From 8b5da7f0359889c447ae3768bdf66e2801aabff8 Mon Sep 17 00:00:00 2001
From: Christopher Holt <=>
Date: Tue, 16 Apr 2024 10:57:23 -0700
Subject: [PATCH 1/4] fix(web-components): refactor exports to remove most
 barrel exports for components

---
 ...-b79350c6-45b4-4047-b3cb-bdd2f3913561.json |   7 +
 .../src/accordion-item/index.ts               |   4 +-
 .../web-components/src/accordion/index.ts     |   3 +-
 .../web-components/src/anchor-button/index.ts |  10 +-
 packages/web-components/src/avatar/index.ts   |  11 +-
 packages/web-components/src/badge/index.ts    |   4 +-
 packages/web-components/src/button/index.ts   |   4 +-
 packages/web-components/src/checkbox/index.ts |   4 +-
 .../src/compound-button/index.ts              |   4 +-
 .../web-components/src/counter-badge/index.ts |   9 +-
 packages/web-components/src/dialog/index.ts   |   3 +-
 packages/web-components/src/divider/index.ts  |   4 +-
 packages/web-components/src/image/index.ts    |   4 +-
 packages/web-components/src/index.ts          | 259 +++++++++++++++---
 packages/web-components/src/label/index.ts    |   3 +-
 .../web-components/src/menu-button/index.ts   |   4 +-
 .../src/menu-button/menu-button.options.ts    |   2 +-
 .../web-components/src/menu-item/index.ts     |   3 +-
 .../web-components/src/menu-list/index.ts     |   2 +-
 packages/web-components/src/menu/index.ts     |   2 +-
 .../web-components/src/progress-bar/index.ts  |   9 +-
 .../progress-ring/progress-ring.options.ts    |  10 -
 .../src/progress-ring/progress-ring.ts        |  15 -
 .../web-components/src/radio-group/index.ts   |   3 +-
 packages/web-components/src/radio/index.ts    |   2 +-
 packages/web-components/src/slider/index.ts   |   4 +-
 packages/web-components/src/spinner/index.ts  |   4 +-
 .../web-components/src/spinner/spinner.ts     |   4 +-
 packages/web-components/src/switch/index.ts   |   4 +-
 .../web-components/src/tab-panel/index.ts     |   2 +-
 packages/web-components/src/tab/index.ts      |   2 +-
 packages/web-components/src/tabs/index.ts     |   4 +-
 .../web-components/src/text-input/index.ts    |   4 +-
 .../src/text-input/text-input.options.ts      |  14 +-
 .../src/text-input/text-input.ts              |   8 +-
 packages/web-components/src/text/index.ts     |   4 +-
 .../web-components/src/toggle-button/index.ts |   9 +-
 37 files changed, 326 insertions(+), 122 deletions(-)
 create mode 100644 change/@fluentui-web-components-b79350c6-45b4-4047-b3cb-bdd2f3913561.json
 delete mode 100644 packages/web-components/src/progress-ring/progress-ring.options.ts
 delete mode 100644 packages/web-components/src/progress-ring/progress-ring.ts

diff --git a/change/@fluentui-web-components-b79350c6-45b4-4047-b3cb-bdd2f3913561.json b/change/@fluentui-web-components-b79350c6-45b4-4047-b3cb-bdd2f3913561.json
new file mode 100644
index 00000000000000..3ae947b76d1f1d
--- /dev/null
+++ b/change/@fluentui-web-components-b79350c6-45b4-4047-b3cb-bdd2f3913561.json
@@ -0,0 +1,7 @@
+{
+  "type": "prerelease",
+  "comment": "fix(web-components): remove all barrell exports with exception of design tokens",
+  "packageName": "@fluentui/web-components",
+  "email": "=",
+  "dependentChangeType": "patch"
+}
diff --git a/packages/web-components/src/accordion-item/index.ts b/packages/web-components/src/accordion-item/index.ts
index 14613c95835a65..0ece099782f068 100644
--- a/packages/web-components/src/accordion-item/index.ts
+++ b/packages/web-components/src/accordion-item/index.ts
@@ -1,5 +1,5 @@
-export * from './accordion-item.js';
-export * from './accordion-item.options.js';
+export { AccordionItem, AccordionItemOptions } from './accordion-item.js';
+export { AccordionItemSize, AccordionItemExpandIconPosition } from './accordion-item.options.js';
 export { styles as accordionItemStyles } from './accordion-item.styles.js';
 export { definition as accordionItemDefinition } from './accordion-item.definition.js';
 export { template as accordionItemTemplate } from './accordion-item.template.js';
diff --git a/packages/web-components/src/accordion/index.ts b/packages/web-components/src/accordion/index.ts
index c6b994bfc7c025..a78691556e3028 100644
--- a/packages/web-components/src/accordion/index.ts
+++ b/packages/web-components/src/accordion/index.ts
@@ -1,4 +1,5 @@
-export * from './accordion.js';
+export { Accordion } from './accordion.js';
+export { AccordionExpandMode } from './accordion.options.js';
 export { template as accordionTemplate } from './accordion.template.js';
 export { styles as accordionStyles } from './accordion.styles.js';
 export { definition as accordionDefinition } from './accordion.definition.js';
diff --git a/packages/web-components/src/anchor-button/index.ts b/packages/web-components/src/anchor-button/index.ts
index 0623781e9ad729..5b17e7dcaae22b 100644
--- a/packages/web-components/src/anchor-button/index.ts
+++ b/packages/web-components/src/anchor-button/index.ts
@@ -1,4 +1,10 @@
-export * from './anchor-button.js';
-export * from './anchor-button.options.js';
+export { AnchorButton } from './anchor-button.js';
+export {
+  AnchorButtonOptions,
+  AnchorButtonAppearance,
+  AnchorButtonShape,
+  AnchorButtonSize,
+  AnchorTarget,
+} from './anchor-button.options.js';
 export { template as AnchorButtonTemplate } from './anchor-button.template.js';
 export { definition as AnchorButtonDefinition } from './anchor-button.definition.js';
diff --git a/packages/web-components/src/avatar/index.ts b/packages/web-components/src/avatar/index.ts
index 8bb35aee4dc2a3..94ffd5f6b086f6 100644
--- a/packages/web-components/src/avatar/index.ts
+++ b/packages/web-components/src/avatar/index.ts
@@ -1,5 +1,12 @@
-export * from './avatar.js';
-export * from './avatar.options.js';
+export { Avatar } from './avatar.js';
+export {
+  AvatarActive,
+  AvatarAppearance,
+  AvatarColor,
+  AvatarNamedColor,
+  AvatarShape,
+  AvatarSize,
+} from './avatar.options.js';
 export { template as AvatarTemplate } from './avatar.template.js';
 export { styles as AvatarStyles } from './avatar.styles.js';
 export { definition as AvatarDefinition } from './avatar.definition.js';
diff --git a/packages/web-components/src/badge/index.ts b/packages/web-components/src/badge/index.ts
index 92e3fdcd872146..1213fe39812bf6 100644
--- a/packages/web-components/src/badge/index.ts
+++ b/packages/web-components/src/badge/index.ts
@@ -1,5 +1,5 @@
-export * from './badge.js';
-export * from './badge.options.js';
+export { Badge } from './badge.js';
+export { BadgeAppearance, BadgeColor, BadgeShape, BadgeSize } from './badge.options.js';
 export { template as BadgeTemplate } from './badge.template.js';
 export { styles as BadgeStyles } from './badge.styles.js';
 export { definition as BadgeDefinition } from './badge.definition.js';
diff --git a/packages/web-components/src/button/index.ts b/packages/web-components/src/button/index.ts
index 37df4b2a8eddad..b1115c6ca44bc7 100644
--- a/packages/web-components/src/button/index.ts
+++ b/packages/web-components/src/button/index.ts
@@ -1,5 +1,5 @@
-export * from './button.js';
-export * from './button.options.js';
+export { Button } from './button.js';
+export { ButtonAppearance, ButtonShape, ButtonSize, ButtonType, ButtonOptions } from './button.options.js';
 export { template as ButtonTemplate } from './button.template.js';
 export { styles as ButtonStyles } from './button.styles.js';
 export { definition as ButtonDefinition } from './button.definition.js';
diff --git a/packages/web-components/src/checkbox/index.ts b/packages/web-components/src/checkbox/index.ts
index 2bba4c13d942c4..44778771bed54b 100644
--- a/packages/web-components/src/checkbox/index.ts
+++ b/packages/web-components/src/checkbox/index.ts
@@ -1,5 +1,5 @@
-export * from './checkbox.js';
-export * from './checkbox.options.js';
+export { Checkbox, CheckboxOptions } from './checkbox.js';
+export { CheckboxLabelPosition, CheckboxShape, CheckboxSize } from './checkbox.options.js';
 export { definition as CheckboxDefinition } from './checkbox.definition.js';
 export { template as CheckboxTemplate } from './checkbox.template.js';
 export { styles as CheckboxStyles } from './checkbox.styles.js';
diff --git a/packages/web-components/src/compound-button/index.ts b/packages/web-components/src/compound-button/index.ts
index e4e0bc601f76e0..4628532108a5e0 100644
--- a/packages/web-components/src/compound-button/index.ts
+++ b/packages/web-components/src/compound-button/index.ts
@@ -1,5 +1,5 @@
-export * from './compound-button.js';
-export * from './compound-button.options.js';
+export { CompoundButton } from './compound-button.js';
+export { CompoundButtonAppearance, CompoundButtonShape, CompoundButtonSize } from './compound-button.options.js';
 export { template as CompoundButtonTemplate } from './compound-button.template.js';
 export { styles as CompoundButtonStyles } from './compound-button.styles.js';
 export { definition as CompoundButtonDefinition } from './compound-button.definition.js';
diff --git a/packages/web-components/src/counter-badge/index.ts b/packages/web-components/src/counter-badge/index.ts
index 159c31d2e2f94e..b13de0fa61286a 100644
--- a/packages/web-components/src/counter-badge/index.ts
+++ b/packages/web-components/src/counter-badge/index.ts
@@ -1,5 +1,10 @@
-export * from './counter-badge.js';
-export * from './counter-badge.options.js';
+export { CounterBadge } from './counter-badge.js';
+export {
+  CounterBadgeAppearance,
+  CounterBadgeColor,
+  CounterBadgeShape,
+  CounterBadgeSize,
+} from './counter-badge.options.js';
 export { template as CounterBadgeTemplate } from './counter-badge.template.js';
 export { styles as CounterBadgeStyles } from './counter-badge.styles.js';
 export { definition as CounterBadgeDefinition } from './counter-badge.definition.js';
diff --git a/packages/web-components/src/dialog/index.ts b/packages/web-components/src/dialog/index.ts
index 12f8a223acb9b5..cd49aa25da03b7 100644
--- a/packages/web-components/src/dialog/index.ts
+++ b/packages/web-components/src/dialog/index.ts
@@ -1,4 +1,5 @@
-export * from './dialog.js';
+export { Dialog } from './dialog.js';
+export { DialogModalType } from './dialog.options.js';
 export { definition as DialogDefinition } from './dialog.definition.js';
 export { template as DialogTemplate } from './dialog.template.js';
 export { styles as DialogStyles } from './dialog.styles.js';
diff --git a/packages/web-components/src/divider/index.ts b/packages/web-components/src/divider/index.ts
index 5ee2dd0fcaf33e..c5d945cfa38d03 100644
--- a/packages/web-components/src/divider/index.ts
+++ b/packages/web-components/src/divider/index.ts
@@ -1,5 +1,5 @@
-export * from './divider.js';
-export * from './divider.options.js';
+export { Divider } from './divider.js';
+export { DividerAlignContent, DividerAppearance, DividerOrientation, DividerRole } from './divider.options.js';
 export { definition as DividerDefinition } from './divider.definition.js';
 export { template as DividerTemplate } from './divider.template.js';
 export { styles as DividerStyles } from './divider.styles.js';
diff --git a/packages/web-components/src/image/index.ts b/packages/web-components/src/image/index.ts
index 29839a12488658..6ba3fcb6dc11f2 100644
--- a/packages/web-components/src/image/index.ts
+++ b/packages/web-components/src/image/index.ts
@@ -1,5 +1,5 @@
-export * from './image.js';
-export * from './image.options.js';
+export { Image } from './image.js';
+export { ImageFit, ImageShape } from './image.options.js';
 export { definition as ImageDefinition } from './image.definition.js';
 export { template as ImageTemplate } from './image.template.js';
 export { styles as ImageStyles } from './image.styles.js';
diff --git a/packages/web-components/src/index.ts b/packages/web-components/src/index.ts
index 22f633130be87b..45ba11c214f72d 100644
--- a/packages/web-components/src/index.ts
+++ b/packages/web-components/src/index.ts
@@ -1,35 +1,213 @@
-export * from './accordion/index.js';
-export * from './accordion-item/index.js';
-export * from './anchor-button/index.js';
-export * from './avatar/index.js';
-export * from './badge/index.js';
-export * from './button/index.js';
-export * from './checkbox/index.js';
-export * from './compound-button/index.js';
-export * from './counter-badge/index.js';
-export * from './dialog/index.js';
-export * from './divider/index.js';
-export * from './image/index.js';
-export * from './label/index.js';
-export * from './menu/index.js';
-export * from './menu-button/index.js';
-export * from './menu-item/index.js';
-export * from './menu-list/index.js';
-export * from './progress-bar/index.js';
-export * from './radio/index.js';
-export * from './radio-group/index.js';
-export * from './slider/index.js';
-export * from './spinner/index.js';
-export * from './switch/index.js';
-export * from './tabs/index.js';
-export * from './tab/index.js';
-export * from './tab-panel/index.js';
-export * from './text/index.js';
-export * from './text-input/index.js';
-export * from './toggle-button/index.js';
-
-export * from './fluent-design-system.js';
-export * from './theme/index.js';
+export {
+  Accordion,
+  AccordionExpandMode,
+  accordionTemplate,
+  accordionStyles,
+  accordionDefinition,
+} from './accordion/index.js';
+export {
+  AccordionItem,
+  AccordionItemOptions,
+  AccordionItemSize,
+  AccordionItemExpandIconPosition,
+  accordionItemTemplate,
+  accordionItemStyles,
+  accordionItemDefinition,
+} from './accordion-item/index.js';
+export {
+  AnchorButton,
+  AnchorButtonOptions,
+  AnchorButtonAppearance,
+  AnchorButtonShape,
+  AnchorButtonSize,
+  AnchorTarget,
+  AnchorButtonTemplate,
+  AnchorButtonDefinition,
+} from './anchor-button/index.js';
+export {
+  Avatar,
+  AvatarActive,
+  AvatarAppearance,
+  AvatarColor,
+  AvatarNamedColor,
+  AvatarShape,
+  AvatarSize,
+  AvatarTemplate,
+  AvatarStyles,
+  AvatarDefinition,
+} from './avatar/index.js';
+export {
+  Badge,
+  BadgeAppearance,
+  BadgeColor,
+  BadgeShape,
+  BadgeSize,
+  BadgeTemplate,
+  BadgeStyles,
+  BadgeDefinition,
+} from './badge/index.js';
+export {
+  Button,
+  ButtonAppearance,
+  ButtonShape,
+  ButtonSize,
+  ButtonType,
+  ButtonOptions,
+  ButtonTemplate,
+  ButtonStyles,
+  ButtonDefinition,
+} from './button/index.js';
+export {
+  Checkbox,
+  CheckboxOptions,
+  CheckboxLabelPosition,
+  CheckboxShape,
+  CheckboxSize,
+  CheckboxDefinition,
+  CheckboxTemplate,
+  CheckboxStyles,
+} from './checkbox/index.js';
+export {
+  CompoundButton,
+  CompoundButtonAppearance,
+  CompoundButtonShape,
+  CompoundButtonSize,
+  CompoundButtonTemplate,
+  CompoundButtonStyles,
+  CompoundButtonDefinition,
+} from './compound-button/index.js';
+export {
+  CounterBadge,
+  CounterBadgeAppearance,
+  CounterBadgeColor,
+  CounterBadgeShape,
+  CounterBadgeSize,
+  CounterBadgeTemplate,
+  CounterBadgeStyles,
+  CounterBadgeDefinition,
+} from './counter-badge/index.js';
+export { Dialog, DialogModalType, DialogDefinition, DialogTemplate, DialogStyles } from './dialog/index.js';
+export {
+  Divider,
+  DividerAlignContent,
+  DividerAppearance,
+  DividerOrientation,
+  DividerRole,
+  DividerDefinition,
+  DividerTemplate,
+  DividerStyles,
+} from './divider/index.js';
+export { Image, ImageFit, ImageShape, ImageDefinition, ImageTemplate, ImageStyles } from './image/index.js';
+export { Label, LabelSize, LabelWeight, LabelDefinition, LabelStyles, LabelTemplate } from './label/index.js';
+export { Menu, MenuTemplate, MenuStyles, MenuDefinition } from './menu/index.js';
+export {
+  MenuButton,
+  MenuButtonAppearance,
+  MenuButtonShape,
+  MenuButtonSize,
+  MenuButtonOptions,
+  MenuButtonTemplate,
+  MenuButtonStyles,
+  MenuButtonDefinition,
+} from './menu-button/index.js';
+export {
+  MenuItem,
+  MenuItemColumnCount,
+  MenuItemOptions,
+  MenuItemRole,
+  roleForMenuItem,
+  MenuItemTemplate,
+  MenuItemStyles,
+  MenuItemDefinition,
+} from './menu-item/index.js';
+export { MenuList, MenuListTemplate, MenuListStyles, MenuListDefinition } from './menu-list/index.js';
+export {
+  ProgressBar,
+  ProgressOptions,
+  ProgressBarShape,
+  ProgressBarThickness,
+  ProgressBarValidationState,
+  ProgressBarDefinition,
+  ProgressBarStyles,
+  ProgressBarTemplate,
+} from './progress-bar/index.js';
+export { Radio, RadioControl, RadioOptions, RadioDefinition, RadioStyles, RadioTemplate } from './radio/index.js';
+export {
+  RadioGroup,
+  RadioGroupOrientation,
+  RadioGroupDefinition,
+  RadioGroupStyles,
+  RadioGroupTemplate,
+} from './radio-group/index.js';
+export {
+  Slider,
+  SliderConfiguration,
+  SliderMode,
+  SliderOptions,
+  SliderOrientation,
+  SliderSize,
+  SliderDefinition,
+  SliderStyles,
+  SliderTemplate,
+} from './slider/index.js';
+export {
+  Spinner,
+  SpinnerAppearance,
+  SpinnerSize,
+  SpinnerTemplate,
+  SpinnerStyles,
+  SpinnerDefinition,
+} from './spinner/index.js';
+export {
+  Switch,
+  SwitchOptions,
+  SwitchLabelPosition,
+  SwitchDefinition,
+  SwitchStyles,
+  SwitchTemplate,
+} from './switch/index.js';
+export { Tab, TabOptions, TabTemplate, TabStyles, TabDefinition } from './tab/index.js';
+export { TabPanel, TabPanelTemplate, TabPanelStyles, TabPanelDefinition } from './tab-panel/index.js';
+export {
+  Tabs,
+  TabsAppearance,
+  TabsOptions,
+  TabsOrientation,
+  TabsSize,
+  TabsTemplate,
+  TabsStyles,
+  TabsDefinition,
+} from './tabs/index.js';
+export {
+  Text,
+  TextAlign,
+  TextFont,
+  TextSize,
+  TextWeight,
+  TextTemplate,
+  TextStyles,
+  TextDefinition,
+} from './text/index.js';
+export {
+  TextInputOptions,
+  TextInput,
+  TextInputType,
+  TextInputAppearance,
+  TextInputControlSize,
+  TextInputTemplate,
+  TextInputStyles,
+  TextInputDefinition,
+} from './text-input/index.js';
+export {
+  ToggleButton,
+  ToggleButtonAppearance,
+  ToggleButtonOptions,
+  ToggleButtonShape,
+  ToggleButtonSize,
+  ToggleButtonTemplate,
+  ToggleButtonStyles,
+  ToggleButtonDefinition,
+} from './toggle-button/index.js';
 
 export {
   typographyBody1Styles,
@@ -51,6 +229,17 @@ export {
   typographyTitle3Styles,
 } from './styles/partials/typography.partials.js';
 
-export * from './utils/direction.js';
-export * from './utils/display.js';
-export * from './utils/behaviors/match-media-stylesheet-behavior.js';
+export { getDirection } from './utils/direction.js';
+export { display } from './utils/display.js';
+export {
+  forcedColorsStylesheetBehavior,
+  MatchMediaBehavior,
+  MatchMediaStyleSheetBehavior,
+  MediaQueryListListener,
+  darkModeStylesheetBehavior,
+  lightModeStylesheetBehavior,
+} from './utils/behaviors/match-media-stylesheet-behavior.js';
+
+export { FluentDesignSystem } from './fluent-design-system.js';
+export { setTheme, setThemeFor } from './theme/index.js';
+export * as tokens from './theme/design-tokens.js';
diff --git a/packages/web-components/src/label/index.ts b/packages/web-components/src/label/index.ts
index 0e5f0190ff1610..fb926d1220351a 100644
--- a/packages/web-components/src/label/index.ts
+++ b/packages/web-components/src/label/index.ts
@@ -1,4 +1,5 @@
-export * from './label.js';
+export { Label } from './label.js';
+export { LabelSize, LabelWeight } from './label.options.js';
 export { definition as LabelDefinition } from './label.definition.js';
 export { styles as LabelStyles } from './label.styles.js';
 export { template as LabelTemplate } from './label.template.js';
diff --git a/packages/web-components/src/menu-button/index.ts b/packages/web-components/src/menu-button/index.ts
index cf17a408fbe991..e3abeee7c48d75 100644
--- a/packages/web-components/src/menu-button/index.ts
+++ b/packages/web-components/src/menu-button/index.ts
@@ -1,5 +1,5 @@
-export * from './menu-button.js';
-export * from './menu-button.options.js';
+export { MenuButton } from './menu-button.js';
+export { MenuButtonAppearance, MenuButtonShape, MenuButtonSize, MenuButtonOptions } from './menu-button.options.js';
 export { template as MenuButtonTemplate } from './menu-button.template.js';
 export { styles as MenuButtonStyles } from '../button/button.styles.js';
 export { definition as MenuButtonDefinition } from './menu-button.definition.js';
diff --git a/packages/web-components/src/menu-button/menu-button.options.ts b/packages/web-components/src/menu-button/menu-button.options.ts
index 802a107e6f5d0f..b4036a3e4fd72b 100644
--- a/packages/web-components/src/menu-button/menu-button.options.ts
+++ b/packages/web-components/src/menu-button/menu-button.options.ts
@@ -1,4 +1,4 @@
-import type { ButtonOptions } from '../button/index.js';
+import type { ButtonOptions } from '../button/button.options.js';
 import { ButtonAppearance, ButtonShape, ButtonSize } from '../button/button.options.js';
 import type { ValuesOf } from '../utils/index.js';
 
diff --git a/packages/web-components/src/menu-item/index.ts b/packages/web-components/src/menu-item/index.ts
index 9e578159286126..df2b2eb4c6e33f 100644
--- a/packages/web-components/src/menu-item/index.ts
+++ b/packages/web-components/src/menu-item/index.ts
@@ -1,4 +1,5 @@
-export * from './menu-item.js';
+export { MenuItem, MenuItemColumnCount, MenuItemOptions } from './menu-item.js';
+export { MenuItemRole, roleForMenuItem } from './menu-item.options.js';
 export { template as MenuItemTemplate } from './menu-item.template.js';
 export { styles as MenuItemStyles } from './menu-item.styles.js';
 export { definition as MenuItemDefinition } from './menu-item.definition.js';
diff --git a/packages/web-components/src/menu-list/index.ts b/packages/web-components/src/menu-list/index.ts
index 3448cf03ccf197..8bf3024cfbae4d 100644
--- a/packages/web-components/src/menu-list/index.ts
+++ b/packages/web-components/src/menu-list/index.ts
@@ -1,4 +1,4 @@
-export * from './menu-list.js';
+export { MenuList } from './menu-list.js';
 export { template as MenuListTemplate } from './menu-list.template.js';
 export { styles as MenuListStyles } from './menu-list.styles.js';
 export { definition as MenuListDefinition } from './menu-list.definition.js';
diff --git a/packages/web-components/src/menu/index.ts b/packages/web-components/src/menu/index.ts
index ed356e7171a09f..d237bd53b6824f 100644
--- a/packages/web-components/src/menu/index.ts
+++ b/packages/web-components/src/menu/index.ts
@@ -1,4 +1,4 @@
-export * from './menu.js';
+export { Menu } from './menu.js';
 export { template as MenuTemplate } from './menu.template.js';
 export { styles as MenuStyles } from './menu.styles.js';
 export { definition as MenuDefinition } from './menu.definition.js';
diff --git a/packages/web-components/src/progress-bar/index.ts b/packages/web-components/src/progress-bar/index.ts
index 8689e08b832e30..922619fc0c3e23 100644
--- a/packages/web-components/src/progress-bar/index.ts
+++ b/packages/web-components/src/progress-bar/index.ts
@@ -1,5 +1,10 @@
-export * from './progress-bar.js';
-export * from './progress-bar.options.js';
+export { ProgressBar } from './progress-bar.js';
+export {
+  ProgressOptions,
+  ProgressBarShape,
+  ProgressBarThickness,
+  ProgressBarValidationState,
+} from './progress-bar.options.js';
 export { definition as ProgressBarDefinition } from './progress-bar.definition.js';
 export { styles as ProgressBarStyles } from './progress-bar.styles.js';
 export { template as ProgressBarTemplate } from './progress-bar.template.js';
diff --git a/packages/web-components/src/progress-ring/progress-ring.options.ts b/packages/web-components/src/progress-ring/progress-ring.options.ts
deleted file mode 100644
index 7f70d78e914b88..00000000000000
--- a/packages/web-components/src/progress-ring/progress-ring.options.ts
+++ /dev/null
@@ -1,10 +0,0 @@
-import type { StaticallyComposableHTML } from '../utils/template-helpers.js';
-import type { ProgressRing } from './progress-ring.js';
-
-/**
- * ProgressRing configuration options
- * @public
- */
-export type ProgressRingOptions = {
-  indeterminateIndicator?: StaticallyComposableHTML<ProgressRing>;
-};
diff --git a/packages/web-components/src/progress-ring/progress-ring.ts b/packages/web-components/src/progress-ring/progress-ring.ts
deleted file mode 100644
index 67b3ff5dc2dde7..00000000000000
--- a/packages/web-components/src/progress-ring/progress-ring.ts
+++ /dev/null
@@ -1,15 +0,0 @@
-import { BaseProgress } from '../progress-bar/base-progress.js';
-
-/**
- * An circular Progress HTML Element.
- * Implements the {@link https://www.w3.org/TR/wai-aria-1.1/#progressbar | ARIA progressbar }.
- *
- * @slot indeterminate - The slot for a custom indeterminate indicator
- * @slot determinate - The slot for a custom determinate indicator
- * @csspart progress - Represents the progress element
- * @csspart determinate - The determinate indicator
- * @csspart background - The background
- *
- * @public
- */
-export class ProgressRing extends BaseProgress {}
diff --git a/packages/web-components/src/radio-group/index.ts b/packages/web-components/src/radio-group/index.ts
index 967f498a393fbf..9862557adab432 100644
--- a/packages/web-components/src/radio-group/index.ts
+++ b/packages/web-components/src/radio-group/index.ts
@@ -1,4 +1,5 @@
-export * from './radio-group.js';
+export { RadioGroup } from './radio-group.js';
+export { RadioGroupOrientation } from './radio-group.options.js';
 export { definition as RadioGroupDefinition } from './radio-group.definition.js';
 export { styles as RadioGroupStyles } from './radio-group.styles.js';
 export { template as RadioGroupTemplate } from './radio-group.template.js';
diff --git a/packages/web-components/src/radio/index.ts b/packages/web-components/src/radio/index.ts
index e1af0f69389a11..25f52027363fba 100644
--- a/packages/web-components/src/radio/index.ts
+++ b/packages/web-components/src/radio/index.ts
@@ -1,4 +1,4 @@
-export * from './radio.js';
+export { Radio, RadioControl, RadioOptions } from './radio.js';
 export { definition as RadioDefinition } from './radio.definition.js';
 export { styles as RadioStyles } from './radio.styles.js';
 export { template as RadioTemplate } from './radio.template.js';
diff --git a/packages/web-components/src/slider/index.ts b/packages/web-components/src/slider/index.ts
index f48135c8b62643..6d227167c77fc0 100644
--- a/packages/web-components/src/slider/index.ts
+++ b/packages/web-components/src/slider/index.ts
@@ -1,5 +1,5 @@
-export * from './slider.js';
-export * from './slider.options.js';
+export { Slider } from './slider.js';
+export { SliderConfiguration, SliderMode, SliderOptions, SliderOrientation, SliderSize } from './slider.options.js';
 export { definition as SliderDefinition } from './slider.definition.js';
 export { styles as SliderStyles } from './slider.styles.js';
 export { template as SliderTemplate } from './slider.template.js';
diff --git a/packages/web-components/src/spinner/index.ts b/packages/web-components/src/spinner/index.ts
index 2a6c2db892f33c..af6b25e2892ebf 100644
--- a/packages/web-components/src/spinner/index.ts
+++ b/packages/web-components/src/spinner/index.ts
@@ -1,5 +1,5 @@
-export * from './spinner.js';
-export * from './spinner.options.js';
+export { Spinner } from './spinner.js';
+export { SpinnerAppearance, SpinnerSize } from './spinner.options.js';
 export { template as SpinnerTemplate } from './spinner.template.js';
 export { styles as SpinnerStyles } from './spinner.styles.js';
 export { definition as SpinnerDefinition } from './spinner.definition.js';
diff --git a/packages/web-components/src/spinner/spinner.ts b/packages/web-components/src/spinner/spinner.ts
index 05a6fe7633c477..39a88689ae3d00 100644
--- a/packages/web-components/src/spinner/spinner.ts
+++ b/packages/web-components/src/spinner/spinner.ts
@@ -1,12 +1,12 @@
 import { attr } from '@microsoft/fast-element';
-import { ProgressRing } from '../progress-ring/progress-ring.js';
+import { BaseProgress } from '../progress-bar/base-progress.js';
 import type { SpinnerAppearance, SpinnerSize } from './spinner.options.js';
 
 /**
  * The base class used for constructing a fluent-spinner custom element
  * @public
  */
-export class Spinner extends ProgressRing {
+export class Spinner extends BaseProgress {
   /**
    * The size of the spinner
    *
diff --git a/packages/web-components/src/switch/index.ts b/packages/web-components/src/switch/index.ts
index 4f1e312e631225..1db8bc64b2dc8e 100644
--- a/packages/web-components/src/switch/index.ts
+++ b/packages/web-components/src/switch/index.ts
@@ -1,5 +1,5 @@
-export * from './switch.js';
-export * from './switch.options.js';
+export { Switch, SwitchOptions } from './switch.js';
+export { SwitchLabelPosition } from './switch.options.js';
 export { definition as SwitchDefinition } from './switch.definition.js';
 export { styles as SwitchStyles } from './switch.styles.js';
 export { template as SwitchTemplate } from './switch.template.js';
diff --git a/packages/web-components/src/tab-panel/index.ts b/packages/web-components/src/tab-panel/index.ts
index a207477eac76dd..ae9dc3fd1028fb 100644
--- a/packages/web-components/src/tab-panel/index.ts
+++ b/packages/web-components/src/tab-panel/index.ts
@@ -1,4 +1,4 @@
-export * from './tab-panel.js';
+export { TabPanel } from './tab-panel.js';
 export { template as TabPanelTemplate } from './tab-panel.template.js';
 export { styles as TabPanelStyles } from './tab-panel.styles.js';
 export { definition as TabPanelDefinition } from './tab-panel.definition.js';
diff --git a/packages/web-components/src/tab/index.ts b/packages/web-components/src/tab/index.ts
index 08f46e1c8d896c..ca2b080e332a06 100644
--- a/packages/web-components/src/tab/index.ts
+++ b/packages/web-components/src/tab/index.ts
@@ -1,4 +1,4 @@
-export * from './tab.js';
+export { Tab, TabOptions } from './tab.js';
 export { template as TabTemplate } from './tab.template.js';
 export { styles as TabStyles } from './tab.styles.js';
 export { definition as TabDefinition } from './tab.definition.js';
diff --git a/packages/web-components/src/tabs/index.ts b/packages/web-components/src/tabs/index.ts
index 14c0fbd3d95507..47086ab80ad214 100644
--- a/packages/web-components/src/tabs/index.ts
+++ b/packages/web-components/src/tabs/index.ts
@@ -1,5 +1,5 @@
-export * from './tabs.js';
-export * from './tabs.options.js';
+export { Tabs } from './tabs.js';
+export { TabsAppearance, TabsOptions, TabsOrientation, TabsSize } from './tabs.options.js';
 export { template as TabsTemplate } from './tabs.template.js';
 export { styles as TabsStyles } from './tabs.styles.js';
 export { definition as TabsDefinition } from './tabs.definition.js';
diff --git a/packages/web-components/src/text-input/index.ts b/packages/web-components/src/text-input/index.ts
index f6c3255d59653f..12da2cc5f2777b 100644
--- a/packages/web-components/src/text-input/index.ts
+++ b/packages/web-components/src/text-input/index.ts
@@ -1,5 +1,5 @@
-export * from './text-input.js';
-export * from './text-input.options.js';
+export { TextInputOptions, TextInput } from './text-input.js';
+export { TextInputType, TextInputAppearance, TextInputControlSize } from './text-input.options.js';
 export { template as TextInputTemplate } from './text-input.template.js';
 export { styles as TextInputStyles } from './text-input.styles.js';
 export { definition as TextInputDefinition } from './text-input.definition.js';
diff --git a/packages/web-components/src/text-input/text-input.options.ts b/packages/web-components/src/text-input/text-input.options.ts
index 0a161029c31191..9e9de9cbe7a211 100644
--- a/packages/web-components/src/text-input/text-input.options.ts
+++ b/packages/web-components/src/text-input/text-input.options.ts
@@ -37,29 +37,29 @@ export type TextInputAppearance = ValuesOf<typeof TextInputAppearance>;
  * Text field sub-types
  * @public
  */
-export const TextFieldType = {
+export const TextInputType = {
   /**
-   * An email TextField
+   * An email TextInput
    */
   email: 'email',
 
   /**
-   * A password TextField
+   * A password TextInput
    */
   password: 'password',
 
   /**
-   * A telephone TextField
+   * A telephone TextInput
    */
   tel: 'tel',
 
   /**
-   * A text TextField
+   * A text TextInput
    */
   text: 'text',
 
   /**
-   * A URL TextField
+   * A URL TextInput
    */
   url: 'url',
 } as const;
@@ -68,4 +68,4 @@ export const TextFieldType = {
  * Types for the text field sub-types
  * @public
  */
-export type TextFieldType = ValuesOf<typeof TextFieldType>;
+export type TextInputType = ValuesOf<typeof TextInputType>;
diff --git a/packages/web-components/src/text-input/text-input.ts b/packages/web-components/src/text-input/text-input.ts
index db25c013c0661a..2a41bfbb8cdfa9 100644
--- a/packages/web-components/src/text-input/text-input.ts
+++ b/packages/web-components/src/text-input/text-input.ts
@@ -2,12 +2,12 @@ import { attr, nullableNumberConverter, observable, Updates } from '@microsoft/f
 import { ARIAGlobalStatesAndProperties, StartEnd, StartEndOptions } from '../patterns/index.js';
 import { applyMixins } from '../utils/apply-mixins.js';
 import { TextInputAppearance, TextInputControlSize } from './text-input.options.js';
-import { TextFieldType } from './text-input.options.js';
+import { TextInputType } from './text-input.options.js';
 import { FormAssociatedTextField } from './text-field.form-associated.js';
 
-export { TextFieldType };
+export { TextInputType };
 
-export type TextFieldOptions = StartEndOptions<TextInput>;
+export type TextInputOptions = StartEndOptions<TextInput>;
 
 export class TextInput extends FormAssociatedTextField {
   /**
@@ -84,7 +84,7 @@ export class TextInput extends FormAssociatedTextField {
    * HTML Attribute: type
    */
   @attr
-  public type: TextFieldType = TextFieldType.text;
+  public type: TextInputType = TextInputType.text;
   private typeChanged(): void {
     if (this.proxy instanceof HTMLInputElement) {
       this.proxy.type = this.type;
diff --git a/packages/web-components/src/text/index.ts b/packages/web-components/src/text/index.ts
index 663cf3ebbf645e..72ba6d87272b8b 100644
--- a/packages/web-components/src/text/index.ts
+++ b/packages/web-components/src/text/index.ts
@@ -1,5 +1,5 @@
-export * from './text.js';
-export * from './text.options.js';
+export { Text } from './text.js';
+export { TextAlign, TextFont, TextSize, TextWeight } from './text.options.js';
 export { template as TextTemplate } from './text.template.js';
 export { styles as TextStyles } from './text.styles.js';
 export { definition as TextDefinition } from './text.definition.js';
diff --git a/packages/web-components/src/toggle-button/index.ts b/packages/web-components/src/toggle-button/index.ts
index 004c061cfd624c..5ed2bfa2367d42 100644
--- a/packages/web-components/src/toggle-button/index.ts
+++ b/packages/web-components/src/toggle-button/index.ts
@@ -1,5 +1,10 @@
-export * from './toggle-button.js';
-export * from './toggle-button.options.js';
+export { ToggleButton } from './toggle-button.js';
+export {
+  ToggleButtonAppearance,
+  ToggleButtonOptions,
+  ToggleButtonShape,
+  ToggleButtonSize,
+} from './toggle-button.options.js';
 export { template as ToggleButtonTemplate } from './toggle-button.template.js';
 export { styles as ToggleButtonStyles } from './toggle-button.styles.js';
 export { definition as ToggleButtonDefinition } from './toggle-button.definition.js';

From 8bc1ddb7781572ac3c1fc558f1e88fbbc454a655 Mon Sep 17 00:00:00 2001
From: Christopher Holt <=>
Date: Tue, 16 Apr 2024 16:27:05 -0700
Subject: [PATCH 2/4] update index rollup and export for api-extractor

---
 packages/web-components/docs/api-report.md    | 1316 +++++++++++------
 packages/web-components/src/index-rollup.ts   |  205 ++-
 packages/web-components/src/index.ts          |    5 +-
 packages/web-components/src/spinner/index.ts  |    2 +-
 .../src/spinner/spinner.template.ts           |    5 +-
 .../web-components/src/spinner/spinner.ts     |    9 +
 .../src/text-input/text-input.template.ts     |    4 +-
 7 files changed, 1081 insertions(+), 465 deletions(-)

diff --git a/packages/web-components/docs/api-report.md b/packages/web-components/docs/api-report.md
index 0c01414777db97..06ac3a8f1bfa7e 100644
--- a/packages/web-components/docs/api-report.md
+++ b/packages/web-components/docs/api-report.md
@@ -21,7 +21,6 @@ import type { Theme } from '@fluentui/tokens';
 export class Accordion extends FASTElement {
     // (undocumented)
     protected accordionItems: Element[];
-    // Warning: (ae-forgotten-export) The symbol "AccordionExpandMode" needs to be exported by the entry point index.d.ts
     expandmode: AccordionExpandMode;
     // (undocumented)
     expandmodeChanged(prev: AccordionExpandMode, next: AccordionExpandMode): void;
@@ -36,6 +35,17 @@ export class Accordion extends FASTElement {
 // @public (undocumented)
 export const accordionDefinition: FASTElementDefinition<typeof Accordion>;
 
+// @public
+export const AccordionExpandMode: {
+    readonly single: "single";
+    readonly multi: "multi";
+};
+
+// Warning: (ae-forgotten-export) The symbol "ValuesOf" needs to be exported by the entry point index.d.ts
+//
+// @public
+export type AccordionExpandMode = ValuesOf<typeof AccordionExpandMode>;
+
 // Warning: (ae-internal-mixed-release-tag) Mixed release tags are not allowed for "AccordionItem" because one of its declarations is marked as @internal
 //
 // @public
@@ -68,8 +78,6 @@ export const AccordionItemExpandIconPosition: {
     readonly end: "end";
 };
 
-// Warning: (ae-forgotten-export) The symbol "ValuesOf" needs to be exported by the entry point index.d.ts
-//
 // @public
 export type AccordionItemExpandIconPosition = ValuesOf<typeof AccordionItemExpandIconPosition>;
 
@@ -135,6 +143,8 @@ export class AnchorButton extends FASTElement {
     type: string;
 }
 
+// Warning: (ae-forgotten-export) The symbol "DelegatesARIALink" needs to be exported by the entry point index.d.ts
+//
 // @internal
 export interface AnchorButton extends StartEnd, DelegatesARIALink {
 }
@@ -154,6 +164,9 @@ export type AnchorButtonAppearance = ValuesOf<typeof AnchorButtonAppearance>;
 // @public (undocumented)
 export const AnchorButtonDefinition: FASTElementDefinition<typeof AnchorButton>;
 
+// @public
+export type AnchorButtonOptions = StartEndOptions<AnchorButton>;
+
 // @public
 export const AnchorButtonShape: {
     readonly circular: "circular";
@@ -177,11 +190,6 @@ export type AnchorButtonSize = ValuesOf<typeof AnchorButtonSize>;
 // @public
 export const AnchorButtonTemplate: ElementViewTemplate<AnchorButton>;
 
-// @public
-type AnchorOptions = StartEndOptions<AnchorButton>;
-export { AnchorOptions as AnchorButtonOptions }
-export { AnchorOptions }
-
 // @public
 export const AnchorTarget: {
     readonly _self: "_self";
@@ -388,13 +396,6 @@ export type BadgeColor = ValuesOf<typeof BadgeColor>;
 // @public (undocumented)
 export const BadgeDefinition: FASTElementDefinition<typeof Badge>;
 
-// Warning: (ae-internal-missing-underscore) The name "BadgeOptions" should be prefixed with an underscore because the declaration is marked as @internal
-//
-// @internal
-export type BadgeOptions = StartEndOptions<Badge> & {
-    defaultContent?: StaticallyComposableHTML;
-};
-
 // @public
 export const BadgeShape: {
     readonly circular: "circular";
@@ -424,46 +425,23 @@ export const BadgeStyles: ElementStyles;
 // @public (undocumented)
 export const BadgeTemplate: ElementViewTemplate<Badge>;
 
-// @public
-export class BaseTabs extends FASTElement {
-    activeid: string;
-    // @internal (undocumented)
-    activeidChanged(oldValue: string, newValue: string): void;
-    activetab: HTMLElement;
-    adjust(adjustment: number): void;
-    // @internal (undocumented)
-    connectedCallback(): void;
-    orientation: TabsOrientation;
-    // @internal (undocumented)
-    orientationChanged(): void;
-    protected setTabs(): void;
-    // @internal (undocumented)
-    tabpanels: HTMLElement[];
-    // @internal (undocumented)
-    tabpanelsChanged(): void;
-    // @internal (undocumented)
-    tabs: HTMLElement[];
-    // @internal (undocumented)
-    tabsChanged(): void;
-}
-
 // @public (undocumented)
-export const borderRadiusCircular = "var(--borderRadiusCircular)";
+const borderRadiusCircular = "var(--borderRadiusCircular)";
 
 // @public (undocumented)
-export const borderRadiusLarge = "var(--borderRadiusLarge)";
+const borderRadiusLarge = "var(--borderRadiusLarge)";
 
 // @public (undocumented)
-export const borderRadiusMedium = "var(--borderRadiusMedium)";
+const borderRadiusMedium = "var(--borderRadiusMedium)";
 
 // @public (undocumented)
-export const borderRadiusNone = "var(--borderRadiusNone)";
+const borderRadiusNone = "var(--borderRadiusNone)";
 
 // @public (undocumented)
-export const borderRadiusSmall = "var(--borderRadiusSmall)";
+const borderRadiusSmall = "var(--borderRadiusSmall)";
 
 // @public (undocumented)
-export const borderRadiusXLarge = "var(--borderRadiusXLarge)";
+const borderRadiusXLarge = "var(--borderRadiusXLarge)";
 
 // Warning: (ae-internal-mixed-release-tag) Mixed release tags are not allowed for "Button" because one of its declarations is marked as @internal
 //
@@ -540,7 +518,6 @@ export type ButtonFormTarget = ValuesOf<typeof ButtonFormTarget>;
 // @public
 type ButtonOptions = StartEndOptions<Button>;
 export { ButtonOptions }
-export { ButtonOptions as CompoundButtonOptions }
 export { ButtonOptions as MenuButtonOptions }
 export { ButtonOptions as ToggleButtonOptions }
 
@@ -639,895 +616,895 @@ export const CheckboxStyles: ElementStyles;
 export const CheckboxTemplate: ElementViewTemplate<Checkbox>;
 
 // @public (undocumented)
-export const colorBackgroundOverlay = "var(--colorBackgroundOverlay)";
+const colorBackgroundOverlay = "var(--colorBackgroundOverlay)";
 
 // @public (undocumented)
-export const colorBrandBackground = "var(--colorBrandBackground)";
+const colorBrandBackground = "var(--colorBrandBackground)";
 
 // @public (undocumented)
-export const colorBrandBackground2 = "var(--colorBrandBackground2)";
+const colorBrandBackground2 = "var(--colorBrandBackground2)";
 
 // @public (undocumented)
-export const colorBrandBackgroundHover = "var(--colorBrandBackgroundHover)";
+const colorBrandBackgroundHover = "var(--colorBrandBackgroundHover)";
 
 // @public (undocumented)
-export const colorBrandBackgroundInverted = "var(--colorBrandBackgroundInverted)";
+const colorBrandBackgroundInverted = "var(--colorBrandBackgroundInverted)";
 
 // @public (undocumented)
-export const colorBrandBackgroundInvertedHover = "var(--colorBrandBackgroundInvertedHover)";
+const colorBrandBackgroundInvertedHover = "var(--colorBrandBackgroundInvertedHover)";
 
 // @public (undocumented)
-export const colorBrandBackgroundInvertedPressed = "var(--colorBrandBackgroundInvertedPressed)";
+const colorBrandBackgroundInvertedPressed = "var(--colorBrandBackgroundInvertedPressed)";
 
 // @public (undocumented)
-export const colorBrandBackgroundInvertedSelected = "var(--colorBrandBackgroundInvertedSelected)";
+const colorBrandBackgroundInvertedSelected = "var(--colorBrandBackgroundInvertedSelected)";
 
 // @public (undocumented)
-export const colorBrandBackgroundPressed = "var(--colorBrandBackgroundPressed)";
+const colorBrandBackgroundPressed = "var(--colorBrandBackgroundPressed)";
 
 // @public (undocumented)
-export const colorBrandBackgroundSelected = "var(--colorBrandBackgroundSelected)";
+const colorBrandBackgroundSelected = "var(--colorBrandBackgroundSelected)";
 
 // @public (undocumented)
-export const colorBrandBackgroundStatic = "var(--colorBrandBackgroundStatic)";
+const colorBrandBackgroundStatic = "var(--colorBrandBackgroundStatic)";
 
 // @public (undocumented)
-export const colorBrandForeground1 = "var(--colorBrandForeground1)";
+const colorBrandForeground1 = "var(--colorBrandForeground1)";
 
 // @public (undocumented)
-export const colorBrandForeground2 = "var(--colorBrandForeground2)";
+const colorBrandForeground2 = "var(--colorBrandForeground2)";
 
 // @public (undocumented)
-export const colorBrandForegroundInverted = "var(--colorBrandForegroundInverted)";
+const colorBrandForegroundInverted = "var(--colorBrandForegroundInverted)";
 
 // @public (undocumented)
-export const colorBrandForegroundInvertedHover = "var(--colorBrandForegroundInvertedHover)";
+const colorBrandForegroundInvertedHover = "var(--colorBrandForegroundInvertedHover)";
 
 // @public (undocumented)
-export const colorBrandForegroundInvertedPressed = "var(--colorBrandForegroundInvertedPressed)";
+const colorBrandForegroundInvertedPressed = "var(--colorBrandForegroundInvertedPressed)";
 
 // @public (undocumented)
-export const colorBrandForegroundLink = "var(--colorBrandForegroundLink)";
+const colorBrandForegroundLink = "var(--colorBrandForegroundLink)";
 
 // @public (undocumented)
-export const colorBrandForegroundLinkHover = "var(--colorBrandForegroundLinkHover)";
+const colorBrandForegroundLinkHover = "var(--colorBrandForegroundLinkHover)";
 
 // @public (undocumented)
-export const colorBrandForegroundLinkPressed = "var(--colorBrandForegroundLinkPressed)";
+const colorBrandForegroundLinkPressed = "var(--colorBrandForegroundLinkPressed)";
 
 // @public (undocumented)
-export const colorBrandForegroundLinkSelected = "var(--colorBrandForegroundLinkSelected)";
+const colorBrandForegroundLinkSelected = "var(--colorBrandForegroundLinkSelected)";
 
 // @public (undocumented)
-export const colorBrandForegroundOnLight = "var(--colorBrandForegroundOnLight)";
+const colorBrandForegroundOnLight = "var(--colorBrandForegroundOnLight)";
 
 // @public (undocumented)
-export const colorBrandForegroundOnLightHover = "var(--colorBrandForegroundOnLightHover)";
+const colorBrandForegroundOnLightHover = "var(--colorBrandForegroundOnLightHover)";
 
 // @public (undocumented)
-export const colorBrandForegroundOnLightPressed = "var(--colorBrandForegroundOnLightPressed)";
+const colorBrandForegroundOnLightPressed = "var(--colorBrandForegroundOnLightPressed)";
 
 // @public (undocumented)
-export const colorBrandForegroundOnLightSelected = "var(--colorBrandForegroundOnLightSelected)";
+const colorBrandForegroundOnLightSelected = "var(--colorBrandForegroundOnLightSelected)";
 
 // @public (undocumented)
-export const colorBrandShadowAmbient = "var(--colorBrandShadowAmbient)";
+const colorBrandShadowAmbient = "var(--colorBrandShadowAmbient)";
 
 // @public (undocumented)
-export const colorBrandShadowKey = "var(--colorBrandShadowKey)";
+const colorBrandShadowKey = "var(--colorBrandShadowKey)";
 
 // @public (undocumented)
-export const colorBrandStroke1 = "var(--colorBrandStroke1)";
+const colorBrandStroke1 = "var(--colorBrandStroke1)";
 
 // @public (undocumented)
-export const colorBrandStroke2 = "var(--colorBrandStroke2)";
+const colorBrandStroke2 = "var(--colorBrandStroke2)";
 
 // @public (undocumented)
-export const colorCompoundBrandBackground = "var(--colorCompoundBrandBackground)";
+const colorCompoundBrandBackground = "var(--colorCompoundBrandBackground)";
 
 // @public (undocumented)
-export const colorCompoundBrandBackgroundHover = "var(--colorCompoundBrandBackgroundHover)";
+const colorCompoundBrandBackgroundHover = "var(--colorCompoundBrandBackgroundHover)";
 
 // @public (undocumented)
-export const colorCompoundBrandBackgroundPressed = "var(--colorCompoundBrandBackgroundPressed)";
+const colorCompoundBrandBackgroundPressed = "var(--colorCompoundBrandBackgroundPressed)";
 
 // @public (undocumented)
-export const colorCompoundBrandForeground1 = "var(--colorCompoundBrandForeground1)";
+const colorCompoundBrandForeground1 = "var(--colorCompoundBrandForeground1)";
 
 // @public (undocumented)
-export const colorCompoundBrandForeground1Hover = "var(--colorCompoundBrandForeground1Hover)";
+const colorCompoundBrandForeground1Hover = "var(--colorCompoundBrandForeground1Hover)";
 
 // @public (undocumented)
-export const colorCompoundBrandForeground1Pressed = "var(--colorCompoundBrandForeground1Pressed)";
+const colorCompoundBrandForeground1Pressed = "var(--colorCompoundBrandForeground1Pressed)";
 
 // @public (undocumented)
-export const colorCompoundBrandStroke = "var(--colorCompoundBrandStroke)";
+const colorCompoundBrandStroke = "var(--colorCompoundBrandStroke)";
 
 // @public (undocumented)
-export const colorCompoundBrandStrokeHover = "var(--colorCompoundBrandStrokeHover)";
+const colorCompoundBrandStrokeHover = "var(--colorCompoundBrandStrokeHover)";
 
 // @public (undocumented)
-export const colorCompoundBrandStrokePressed = "var(--colorCompoundBrandStrokePressed)";
+const colorCompoundBrandStrokePressed = "var(--colorCompoundBrandStrokePressed)";
 
 // @public (undocumented)
-export const colorNeutralBackground1 = "var(--colorNeutralBackground1)";
+const colorNeutralBackground1 = "var(--colorNeutralBackground1)";
 
 // @public (undocumented)
-export const colorNeutralBackground1Hover = "var(--colorNeutralBackground1Hover)";
+const colorNeutralBackground1Hover = "var(--colorNeutralBackground1Hover)";
 
 // @public (undocumented)
-export const colorNeutralBackground1Pressed = "var(--colorNeutralBackground1Pressed)";
+const colorNeutralBackground1Pressed = "var(--colorNeutralBackground1Pressed)";
 
 // @public (undocumented)
-export const colorNeutralBackground1Selected = "var(--colorNeutralBackground1Selected)";
+const colorNeutralBackground1Selected = "var(--colorNeutralBackground1Selected)";
 
 // @public (undocumented)
-export const colorNeutralBackground2 = "var(--colorNeutralBackground2)";
+const colorNeutralBackground2 = "var(--colorNeutralBackground2)";
 
 // @public (undocumented)
-export const colorNeutralBackground2Hover = "var(--colorNeutralBackground2Hover)";
+const colorNeutralBackground2Hover = "var(--colorNeutralBackground2Hover)";
 
 // @public (undocumented)
-export const colorNeutralBackground2Pressed = "var(--colorNeutralBackground2Pressed)";
+const colorNeutralBackground2Pressed = "var(--colorNeutralBackground2Pressed)";
 
 // @public (undocumented)
-export const colorNeutralBackground2Selected = "var(--colorNeutralBackground2Selected)";
+const colorNeutralBackground2Selected = "var(--colorNeutralBackground2Selected)";
 
 // @public (undocumented)
-export const colorNeutralBackground3 = "var(--colorNeutralBackground3)";
+const colorNeutralBackground3 = "var(--colorNeutralBackground3)";
 
 // @public (undocumented)
-export const colorNeutralBackground3Hover = "var(--colorNeutralBackground3Hover)";
+const colorNeutralBackground3Hover = "var(--colorNeutralBackground3Hover)";
 
 // @public (undocumented)
-export const colorNeutralBackground3Pressed = "var(--colorNeutralBackground3Pressed)";
+const colorNeutralBackground3Pressed = "var(--colorNeutralBackground3Pressed)";
 
 // @public (undocumented)
-export const colorNeutralBackground3Selected = "var(--colorNeutralBackground3Selected)";
+const colorNeutralBackground3Selected = "var(--colorNeutralBackground3Selected)";
 
 // @public (undocumented)
-export const colorNeutralBackground4 = "var(--colorNeutralBackground4)";
+const colorNeutralBackground4 = "var(--colorNeutralBackground4)";
 
 // @public (undocumented)
-export const colorNeutralBackground4Hover = "var(--colorNeutralBackground4Hover)";
+const colorNeutralBackground4Hover = "var(--colorNeutralBackground4Hover)";
 
 // @public (undocumented)
-export const colorNeutralBackground4Pressed = "var(--colorNeutralBackground4Pressed)";
+const colorNeutralBackground4Pressed = "var(--colorNeutralBackground4Pressed)";
 
 // @public (undocumented)
-export const colorNeutralBackground4Selected = "var(--colorNeutralBackground4Selected)";
+const colorNeutralBackground4Selected = "var(--colorNeutralBackground4Selected)";
 
 // @public (undocumented)
-export const colorNeutralBackground5 = "var(--colorNeutralBackground5)";
+const colorNeutralBackground5 = "var(--colorNeutralBackground5)";
 
 // @public (undocumented)
-export const colorNeutralBackground5Hover = "var(--colorNeutralBackground5Hover)";
+const colorNeutralBackground5Hover = "var(--colorNeutralBackground5Hover)";
 
 // @public (undocumented)
-export const colorNeutralBackground5Pressed = "var(--colorNeutralBackground5Pressed)";
+const colorNeutralBackground5Pressed = "var(--colorNeutralBackground5Pressed)";
 
 // @public (undocumented)
-export const colorNeutralBackground5Selected = "var(--colorNeutralBackground5Selected)";
+const colorNeutralBackground5Selected = "var(--colorNeutralBackground5Selected)";
 
 // @public (undocumented)
-export const colorNeutralBackground6 = "var(--colorNeutralBackground6)";
+const colorNeutralBackground6 = "var(--colorNeutralBackground6)";
 
 // @public (undocumented)
-export const colorNeutralBackgroundDisabled = "var(--colorNeutralBackgroundDisabled)";
+const colorNeutralBackgroundDisabled = "var(--colorNeutralBackgroundDisabled)";
 
 // @public (undocumented)
-export const colorNeutralBackgroundInverted = "var(--colorNeutralBackgroundInverted)";
+const colorNeutralBackgroundInverted = "var(--colorNeutralBackgroundInverted)";
 
 // @public (undocumented)
-export const colorNeutralBackgroundInvertedDisabled = "var(--colorNeutralBackgroundInvertedDisabled)";
+const colorNeutralBackgroundInvertedDisabled = "var(--colorNeutralBackgroundInvertedDisabled)";
 
 // @public (undocumented)
-export const colorNeutralBackgroundStatic = "var(--colorNeutralBackgroundStatic)";
+const colorNeutralBackgroundStatic = "var(--colorNeutralBackgroundStatic)";
 
 // @public (undocumented)
-export const colorNeutralForeground1 = "var(--colorNeutralForeground1)";
+const colorNeutralForeground1 = "var(--colorNeutralForeground1)";
 
 // @public (undocumented)
-export const colorNeutralForeground1Hover = "var(--colorNeutralForeground1Hover)";
+const colorNeutralForeground1Hover = "var(--colorNeutralForeground1Hover)";
 
 // @public (undocumented)
-export const colorNeutralForeground1Pressed = "var(--colorNeutralForeground1Pressed)";
+const colorNeutralForeground1Pressed = "var(--colorNeutralForeground1Pressed)";
 
 // @public (undocumented)
-export const colorNeutralForeground1Selected = "var(--colorNeutralForeground1Selected)";
+const colorNeutralForeground1Selected = "var(--colorNeutralForeground1Selected)";
 
 // @public (undocumented)
-export const colorNeutralForeground1Static = "var(--colorNeutralForeground1Static)";
+const colorNeutralForeground1Static = "var(--colorNeutralForeground1Static)";
 
 // @public (undocumented)
-export const colorNeutralForeground2 = "var(--colorNeutralForeground2)";
+const colorNeutralForeground2 = "var(--colorNeutralForeground2)";
 
 // @public (undocumented)
-export const colorNeutralForeground2BrandHover = "var(--colorNeutralForeground2BrandHover)";
+const colorNeutralForeground2BrandHover = "var(--colorNeutralForeground2BrandHover)";
 
 // @public (undocumented)
-export const colorNeutralForeground2BrandPressed = "var(--colorNeutralForeground2BrandPressed)";
+const colorNeutralForeground2BrandPressed = "var(--colorNeutralForeground2BrandPressed)";
 
 // @public (undocumented)
-export const colorNeutralForeground2BrandSelected = "var(--colorNeutralForeground2BrandSelected)";
+const colorNeutralForeground2BrandSelected = "var(--colorNeutralForeground2BrandSelected)";
 
 // @public (undocumented)
-export const colorNeutralForeground2Hover = "var(--colorNeutralForeground2Hover)";
+const colorNeutralForeground2Hover = "var(--colorNeutralForeground2Hover)";
 
 // @public (undocumented)
-export const colorNeutralForeground2Link = "var(--colorNeutralForeground2Link)";
+const colorNeutralForeground2Link = "var(--colorNeutralForeground2Link)";
 
 // @public (undocumented)
-export const colorNeutralForeground2LinkHover = "var(--colorNeutralForeground2LinkHover)";
+const colorNeutralForeground2LinkHover = "var(--colorNeutralForeground2LinkHover)";
 
 // @public (undocumented)
-export const colorNeutralForeground2LinkPressed = "var(--colorNeutralForeground2LinkPressed)";
+const colorNeutralForeground2LinkPressed = "var(--colorNeutralForeground2LinkPressed)";
 
 // @public (undocumented)
-export const colorNeutralForeground2LinkSelected = "var(--colorNeutralForeground2LinkSelected)";
+const colorNeutralForeground2LinkSelected = "var(--colorNeutralForeground2LinkSelected)";
 
 // @public (undocumented)
-export const colorNeutralForeground2Pressed = "var(--colorNeutralForeground2Pressed)";
+const colorNeutralForeground2Pressed = "var(--colorNeutralForeground2Pressed)";
 
 // @public (undocumented)
-export const colorNeutralForeground2Selected = "var(--colorNeutralForeground2Selected)";
+const colorNeutralForeground2Selected = "var(--colorNeutralForeground2Selected)";
 
 // @public (undocumented)
-export const colorNeutralForeground3 = "var(--colorNeutralForeground3)";
+const colorNeutralForeground3 = "var(--colorNeutralForeground3)";
 
 // @public (undocumented)
-export const colorNeutralForeground3BrandHover = "var(--colorNeutralForeground3BrandHover)";
+const colorNeutralForeground3BrandHover = "var(--colorNeutralForeground3BrandHover)";
 
 // @public (undocumented)
-export const colorNeutralForeground3BrandPressed = "var(--colorNeutralForeground3BrandPressed)";
+const colorNeutralForeground3BrandPressed = "var(--colorNeutralForeground3BrandPressed)";
 
 // @public (undocumented)
-export const colorNeutralForeground3BrandSelected = "var(--colorNeutralForeground3BrandSelected)";
+const colorNeutralForeground3BrandSelected = "var(--colorNeutralForeground3BrandSelected)";
 
 // @public (undocumented)
-export const colorNeutralForeground3Hover = "var(--colorNeutralForeground3Hover)";
+const colorNeutralForeground3Hover = "var(--colorNeutralForeground3Hover)";
 
 // @public (undocumented)
-export const colorNeutralForeground3Pressed = "var(--colorNeutralForeground3Pressed)";
+const colorNeutralForeground3Pressed = "var(--colorNeutralForeground3Pressed)";
 
 // @public (undocumented)
-export const colorNeutralForeground3Selected = "var(--colorNeutralForeground3Selected)";
+const colorNeutralForeground3Selected = "var(--colorNeutralForeground3Selected)";
 
 // @public (undocumented)
-export const colorNeutralForeground4 = "var(--colorNeutralForeground4)";
+const colorNeutralForeground4 = "var(--colorNeutralForeground4)";
 
 // @public (undocumented)
-export const colorNeutralForegroundDisabled = "var(--colorNeutralForegroundDisabled)";
+const colorNeutralForegroundDisabled = "var(--colorNeutralForegroundDisabled)";
 
 // @public (undocumented)
-export const colorNeutralForegroundInverted = "var(--colorNeutralForegroundInverted)";
+const colorNeutralForegroundInverted = "var(--colorNeutralForegroundInverted)";
 
 // @public (undocumented)
-export const colorNeutralForegroundInverted2 = "var(--colorNeutralForegroundInverted2)";
+const colorNeutralForegroundInverted2 = "var(--colorNeutralForegroundInverted2)";
 
 // @public (undocumented)
-export const colorNeutralForegroundInvertedDisabled = "var(--colorNeutralForegroundInvertedDisabled)";
+const colorNeutralForegroundInvertedDisabled = "var(--colorNeutralForegroundInvertedDisabled)";
 
 // @public (undocumented)
-export const colorNeutralForegroundInvertedHover = "var(--colorNeutralForegroundInvertedHover)";
+const colorNeutralForegroundInvertedHover = "var(--colorNeutralForegroundInvertedHover)";
 
 // @public (undocumented)
-export const colorNeutralForegroundInvertedLink = "var(--colorNeutralForegroundInvertedLink)";
+const colorNeutralForegroundInvertedLink = "var(--colorNeutralForegroundInvertedLink)";
 
 // @public (undocumented)
-export const colorNeutralForegroundInvertedLinkHover = "var(--colorNeutralForegroundInvertedLinkHover)";
+const colorNeutralForegroundInvertedLinkHover = "var(--colorNeutralForegroundInvertedLinkHover)";
 
 // @public (undocumented)
-export const colorNeutralForegroundInvertedLinkPressed = "var(--colorNeutralForegroundInvertedLinkPressed)";
+const colorNeutralForegroundInvertedLinkPressed = "var(--colorNeutralForegroundInvertedLinkPressed)";
 
 // @public (undocumented)
-export const colorNeutralForegroundInvertedLinkSelected = "var(--colorNeutralForegroundInvertedLinkSelected)";
+const colorNeutralForegroundInvertedLinkSelected = "var(--colorNeutralForegroundInvertedLinkSelected)";
 
 // @public (undocumented)
-export const colorNeutralForegroundInvertedPressed = "var(--colorNeutralForegroundInvertedPressed)";
+const colorNeutralForegroundInvertedPressed = "var(--colorNeutralForegroundInvertedPressed)";
 
 // @public (undocumented)
-export const colorNeutralForegroundInvertedSelected = "var(--colorNeutralForegroundInvertedSelected)";
+const colorNeutralForegroundInvertedSelected = "var(--colorNeutralForegroundInvertedSelected)";
 
 // @public (undocumented)
-export const colorNeutralForegroundOnBrand = "var(--colorNeutralForegroundOnBrand)";
+const colorNeutralForegroundOnBrand = "var(--colorNeutralForegroundOnBrand)";
 
 // @public (undocumented)
-export const colorNeutralForegroundStaticInverted = "var(--colorNeutralForegroundStaticInverted)";
+const colorNeutralForegroundStaticInverted = "var(--colorNeutralForegroundStaticInverted)";
 
 // @public (undocumented)
-export const colorNeutralShadowAmbient = "var(--colorNeutralShadowAmbient)";
+const colorNeutralShadowAmbient = "var(--colorNeutralShadowAmbient)";
 
 // @public (undocumented)
-export const colorNeutralShadowAmbientDarker = "var(--colorNeutralShadowAmbientDarker)";
+const colorNeutralShadowAmbientDarker = "var(--colorNeutralShadowAmbientDarker)";
 
 // @public (undocumented)
-export const colorNeutralShadowAmbientLighter = "var(--colorNeutralShadowAmbientLighter)";
+const colorNeutralShadowAmbientLighter = "var(--colorNeutralShadowAmbientLighter)";
 
 // @public (undocumented)
-export const colorNeutralShadowKey = "var(--colorNeutralShadowKey)";
+const colorNeutralShadowKey = "var(--colorNeutralShadowKey)";
 
 // @public (undocumented)
-export const colorNeutralShadowKeyDarker = "var(--colorNeutralShadowKeyDarker)";
+const colorNeutralShadowKeyDarker = "var(--colorNeutralShadowKeyDarker)";
 
 // @public (undocumented)
-export const colorNeutralShadowKeyLighter = "var(--colorNeutralShadowKeyLighter)";
+const colorNeutralShadowKeyLighter = "var(--colorNeutralShadowKeyLighter)";
 
 // @public (undocumented)
-export const colorNeutralStencil1 = "var(--colorNeutralStencil1)";
+const colorNeutralStencil1 = "var(--colorNeutralStencil1)";
 
 // @public (undocumented)
-export const colorNeutralStencil1Alpha = "var(--colorNeutralStencil1Alpha)";
+const colorNeutralStencil1Alpha = "var(--colorNeutralStencil1Alpha)";
 
 // @public (undocumented)
-export const colorNeutralStencil2 = "var(--colorNeutralStencil2)";
+const colorNeutralStencil2 = "var(--colorNeutralStencil2)";
 
 // @public (undocumented)
-export const colorNeutralStencil2Alpha = "var(--colorNeutralStencil2Alpha)";
+const colorNeutralStencil2Alpha = "var(--colorNeutralStencil2Alpha)";
 
 // @public (undocumented)
-export const colorNeutralStroke1 = "var(--colorNeutralStroke1)";
+const colorNeutralStroke1 = "var(--colorNeutralStroke1)";
 
 // @public (undocumented)
-export const colorNeutralStroke1Hover = "var(--colorNeutralStroke1Hover)";
+const colorNeutralStroke1Hover = "var(--colorNeutralStroke1Hover)";
 
 // @public (undocumented)
-export const colorNeutralStroke1Pressed = "var(--colorNeutralStroke1Pressed)";
+const colorNeutralStroke1Pressed = "var(--colorNeutralStroke1Pressed)";
 
 // @public (undocumented)
-export const colorNeutralStroke1Selected = "var(--colorNeutralStroke1Selected)";
+const colorNeutralStroke1Selected = "var(--colorNeutralStroke1Selected)";
 
 // @public (undocumented)
-export const colorNeutralStroke2 = "var(--colorNeutralStroke2)";
+const colorNeutralStroke2 = "var(--colorNeutralStroke2)";
 
 // @public (undocumented)
-export const colorNeutralStroke3 = "var(--colorNeutralStroke3)";
+const colorNeutralStroke3 = "var(--colorNeutralStroke3)";
 
 // @public (undocumented)
-export const colorNeutralStrokeAccessible = "var(--colorNeutralStrokeAccessible)";
+const colorNeutralStrokeAccessible = "var(--colorNeutralStrokeAccessible)";
 
 // @public (undocumented)
-export const colorNeutralStrokeAccessibleHover = "var(--colorNeutralStrokeAccessibleHover)";
+const colorNeutralStrokeAccessibleHover = "var(--colorNeutralStrokeAccessibleHover)";
 
 // @public (undocumented)
-export const colorNeutralStrokeAccessiblePressed = "var(--colorNeutralStrokeAccessiblePressed)";
+const colorNeutralStrokeAccessiblePressed = "var(--colorNeutralStrokeAccessiblePressed)";
 
 // @public (undocumented)
-export const colorNeutralStrokeAccessibleSelected = "var(--colorNeutralStrokeAccessibleSelected)";
+const colorNeutralStrokeAccessibleSelected = "var(--colorNeutralStrokeAccessibleSelected)";
 
 // @public (undocumented)
-export const colorNeutralStrokeDisabled = "var(--colorNeutralStrokeDisabled)";
+const colorNeutralStrokeDisabled = "var(--colorNeutralStrokeDisabled)";
 
 // @public (undocumented)
-export const colorNeutralStrokeInvertedDisabled = "var(--colorNeutralStrokeInvertedDisabled)";
+const colorNeutralStrokeInvertedDisabled = "var(--colorNeutralStrokeInvertedDisabled)";
 
 // @public (undocumented)
-export const colorNeutralStrokeOnBrand = "var(--colorNeutralStrokeOnBrand)";
+const colorNeutralStrokeOnBrand = "var(--colorNeutralStrokeOnBrand)";
 
 // @public (undocumented)
-export const colorNeutralStrokeOnBrand2 = "var(--colorNeutralStrokeOnBrand2)";
+const colorNeutralStrokeOnBrand2 = "var(--colorNeutralStrokeOnBrand2)";
 
 // @public (undocumented)
-export const colorNeutralStrokeOnBrand2Hover = "var(--colorNeutralStrokeOnBrand2Hover)";
+const colorNeutralStrokeOnBrand2Hover = "var(--colorNeutralStrokeOnBrand2Hover)";
 
 // @public (undocumented)
-export const colorNeutralStrokeOnBrand2Pressed = "var(--colorNeutralStrokeOnBrand2Pressed)";
+const colorNeutralStrokeOnBrand2Pressed = "var(--colorNeutralStrokeOnBrand2Pressed)";
 
 // @public (undocumented)
-export const colorNeutralStrokeOnBrand2Selected = "var(--colorNeutralStrokeOnBrand2Selected)";
+const colorNeutralStrokeOnBrand2Selected = "var(--colorNeutralStrokeOnBrand2Selected)";
 
 // @public (undocumented)
-export const colorPaletteAnchorBackground2 = "var(--colorPaletteAnchorBackground2)";
+const colorPaletteAnchorBackground2 = "var(--colorPaletteAnchorBackground2)";
 
 // @public (undocumented)
-export const colorPaletteAnchorBorderActive = "var(--colorPaletteAnchorBorderActive)";
+const colorPaletteAnchorBorderActive = "var(--colorPaletteAnchorBorderActive)";
 
 // @public (undocumented)
-export const colorPaletteAnchorForeground2 = "var(--colorPaletteAnchorForeground2)";
+const colorPaletteAnchorForeground2 = "var(--colorPaletteAnchorForeground2)";
 
 // @public (undocumented)
-export const colorPaletteBeigeBackground2 = "var(--colorPaletteBeigeBackground2)";
+const colorPaletteBeigeBackground2 = "var(--colorPaletteBeigeBackground2)";
 
 // @public (undocumented)
-export const colorPaletteBeigeBorderActive = "var(--colorPaletteBeigeBorderActive)";
+const colorPaletteBeigeBorderActive = "var(--colorPaletteBeigeBorderActive)";
 
 // @public (undocumented)
-export const colorPaletteBeigeForeground2 = "var(--colorPaletteBeigeForeground2)";
+const colorPaletteBeigeForeground2 = "var(--colorPaletteBeigeForeground2)";
 
 // @public (undocumented)
-export const colorPaletteBerryBackground1 = "var(--colorPaletteBerryBackground1)";
+const colorPaletteBerryBackground1 = "var(--colorPaletteBerryBackground1)";
 
 // @public (undocumented)
-export const colorPaletteBerryBackground2 = "var(--colorPaletteBerryBackground2)";
+const colorPaletteBerryBackground2 = "var(--colorPaletteBerryBackground2)";
 
 // @public (undocumented)
-export const colorPaletteBerryBackground3 = "var(--colorPaletteBerryBackground3)";
+const colorPaletteBerryBackground3 = "var(--colorPaletteBerryBackground3)";
 
 // @public (undocumented)
-export const colorPaletteBerryBorder1 = "var(--colorPaletteBerryBorder1)";
+const colorPaletteBerryBorder1 = "var(--colorPaletteBerryBorder1)";
 
 // @public (undocumented)
-export const colorPaletteBerryBorder2 = "var(--colorPaletteBerryBorder2)";
+const colorPaletteBerryBorder2 = "var(--colorPaletteBerryBorder2)";
 
 // @public (undocumented)
-export const colorPaletteBerryBorderActive = "var(--colorPaletteBerryBorderActive)";
+const colorPaletteBerryBorderActive = "var(--colorPaletteBerryBorderActive)";
 
 // @public (undocumented)
-export const colorPaletteBerryForeground1 = "var(--colorPaletteBerryForeground1)";
+const colorPaletteBerryForeground1 = "var(--colorPaletteBerryForeground1)";
 
 // @public (undocumented)
-export const colorPaletteBerryForeground2 = "var(--colorPaletteBerryForeground2)";
+const colorPaletteBerryForeground2 = "var(--colorPaletteBerryForeground2)";
 
 // @public (undocumented)
-export const colorPaletteBerryForeground3 = "var(--colorPaletteBerryForeground3)";
+const colorPaletteBerryForeground3 = "var(--colorPaletteBerryForeground3)";
 
 // @public (undocumented)
-export const colorPaletteBlueBackground2 = "var(--colorPaletteBlueBackground2)";
+const colorPaletteBlueBackground2 = "var(--colorPaletteBlueBackground2)";
 
 // @public (undocumented)
-export const colorPaletteBlueBorderActive = "var(--colorPaletteBlueBorderActive)";
+const colorPaletteBlueBorderActive = "var(--colorPaletteBlueBorderActive)";
 
 // @public (undocumented)
-export const colorPaletteBlueForeground2 = "var(--colorPaletteBlueForeground2)";
+const colorPaletteBlueForeground2 = "var(--colorPaletteBlueForeground2)";
 
 // @public (undocumented)
-export const colorPaletteBrassBackground2 = "var(--colorPaletteBrassBackground2)";
+const colorPaletteBrassBackground2 = "var(--colorPaletteBrassBackground2)";
 
 // @public (undocumented)
-export const colorPaletteBrassBorderActive = "var(--colorPaletteBrassBorderActive)";
+const colorPaletteBrassBorderActive = "var(--colorPaletteBrassBorderActive)";
 
 // @public (undocumented)
-export const colorPaletteBrassForeground2 = "var(--colorPaletteBrassForeground2)";
+const colorPaletteBrassForeground2 = "var(--colorPaletteBrassForeground2)";
 
 // @public (undocumented)
-export const colorPaletteBrownBackground2 = "var(--colorPaletteBrownBackground2)";
+const colorPaletteBrownBackground2 = "var(--colorPaletteBrownBackground2)";
 
 // @public (undocumented)
-export const colorPaletteBrownBorderActive = "var(--colorPaletteBrownBorderActive)";
+const colorPaletteBrownBorderActive = "var(--colorPaletteBrownBorderActive)";
 
 // @public (undocumented)
-export const colorPaletteBrownForeground2 = "var(--colorPaletteBrownForeground2)";
+const colorPaletteBrownForeground2 = "var(--colorPaletteBrownForeground2)";
 
 // @public (undocumented)
-export const colorPaletteCornflowerBackground2 = "var(--colorPaletteCornflowerBackground2)";
+const colorPaletteCornflowerBackground2 = "var(--colorPaletteCornflowerBackground2)";
 
 // @public (undocumented)
-export const colorPaletteCornflowerBorderActive = "var(--colorPaletteCornflowerBorderActive)";
+const colorPaletteCornflowerBorderActive = "var(--colorPaletteCornflowerBorderActive)";
 
 // @public (undocumented)
-export const colorPaletteCornflowerForeground2 = "var(--colorPaletteCornflowerForeground2)";
+const colorPaletteCornflowerForeground2 = "var(--colorPaletteCornflowerForeground2)";
 
 // @public (undocumented)
-export const colorPaletteCranberryBackground2 = "var(--colorPaletteCranberryBackground2)";
+const colorPaletteCranberryBackground2 = "var(--colorPaletteCranberryBackground2)";
 
 // @public (undocumented)
-export const colorPaletteCranberryBorderActive = "var(--colorPaletteCranberryBorderActive)";
+const colorPaletteCranberryBorderActive = "var(--colorPaletteCranberryBorderActive)";
 
 // @public (undocumented)
-export const colorPaletteCranberryForeground2 = "var(--colorPaletteCranberryForeground2)";
+const colorPaletteCranberryForeground2 = "var(--colorPaletteCranberryForeground2)";
 
 // @public (undocumented)
-export const colorPaletteDarkGreenBackground2 = "var(--colorPaletteDarkGreenBackground2)";
+const colorPaletteDarkGreenBackground2 = "var(--colorPaletteDarkGreenBackground2)";
 
 // @public (undocumented)
-export const colorPaletteDarkGreenBorderActive = "var(--colorPaletteDarkGreenBorderActive)";
+const colorPaletteDarkGreenBorderActive = "var(--colorPaletteDarkGreenBorderActive)";
 
 // @public (undocumented)
-export const colorPaletteDarkGreenForeground2 = "var(--colorPaletteDarkGreenForeground2)";
+const colorPaletteDarkGreenForeground2 = "var(--colorPaletteDarkGreenForeground2)";
 
 // @public (undocumented)
-export const colorPaletteDarkOrangeBackground1 = "var(--colorPaletteDarkOrangeBackground1)";
+const colorPaletteDarkOrangeBackground1 = "var(--colorPaletteDarkOrangeBackground1)";
 
 // @public (undocumented)
-export const colorPaletteDarkOrangeBackground2 = "var(--colorPaletteDarkOrangeBackground2)";
+const colorPaletteDarkOrangeBackground2 = "var(--colorPaletteDarkOrangeBackground2)";
 
 // @public (undocumented)
-export const colorPaletteDarkOrangeBackground3 = "var(--colorPaletteDarkOrangeBackground3)";
+const colorPaletteDarkOrangeBackground3 = "var(--colorPaletteDarkOrangeBackground3)";
 
 // @public (undocumented)
-export const colorPaletteDarkOrangeBorder1 = "var(--colorPaletteDarkOrangeBorder1)";
+const colorPaletteDarkOrangeBorder1 = "var(--colorPaletteDarkOrangeBorder1)";
 
 // @public (undocumented)
-export const colorPaletteDarkOrangeBorder2 = "var(--colorPaletteDarkOrangeBorder2)";
+const colorPaletteDarkOrangeBorder2 = "var(--colorPaletteDarkOrangeBorder2)";
 
 // @public (undocumented)
-export const colorPaletteDarkOrangeBorderActive = "var(--colorPaletteDarkOrangeBorderActive)";
+const colorPaletteDarkOrangeBorderActive = "var(--colorPaletteDarkOrangeBorderActive)";
 
 // @public (undocumented)
-export const colorPaletteDarkOrangeForeground1 = "var(--colorPaletteDarkOrangeForeground1)";
+const colorPaletteDarkOrangeForeground1 = "var(--colorPaletteDarkOrangeForeground1)";
 
 // @public (undocumented)
-export const colorPaletteDarkOrangeForeground2 = "var(--colorPaletteDarkOrangeForeground2)";
+const colorPaletteDarkOrangeForeground2 = "var(--colorPaletteDarkOrangeForeground2)";
 
 // @public (undocumented)
-export const colorPaletteDarkOrangeForeground3 = "var(--colorPaletteDarkOrangeForeground3)";
+const colorPaletteDarkOrangeForeground3 = "var(--colorPaletteDarkOrangeForeground3)";
 
 // @public (undocumented)
-export const colorPaletteDarkRedBackground2 = "var(--colorPaletteDarkRedBackground2)";
+const colorPaletteDarkRedBackground2 = "var(--colorPaletteDarkRedBackground2)";
 
 // @public (undocumented)
-export const colorPaletteDarkRedBorderActive = "var(--colorPaletteDarkRedBorderActive)";
+const colorPaletteDarkRedBorderActive = "var(--colorPaletteDarkRedBorderActive)";
 
 // @public (undocumented)
-export const colorPaletteDarkRedForeground2 = "var(--colorPaletteDarkRedForeground2)";
+const colorPaletteDarkRedForeground2 = "var(--colorPaletteDarkRedForeground2)";
 
 // @public (undocumented)
-export const colorPaletteForestBackground2 = "var(--colorPaletteForestBackground2)";
+const colorPaletteForestBackground2 = "var(--colorPaletteForestBackground2)";
 
 // @public (undocumented)
-export const colorPaletteForestBorderActive = "var(--colorPaletteForestBorderActive)";
+const colorPaletteForestBorderActive = "var(--colorPaletteForestBorderActive)";
 
 // @public (undocumented)
-export const colorPaletteForestForeground2 = "var(--colorPaletteForestForeground2)";
+const colorPaletteForestForeground2 = "var(--colorPaletteForestForeground2)";
 
 // @public (undocumented)
-export const colorPaletteGoldBackground2 = "var(--colorPaletteGoldBackground2)";
+const colorPaletteGoldBackground2 = "var(--colorPaletteGoldBackground2)";
 
 // @public (undocumented)
-export const colorPaletteGoldBorderActive = "var(--colorPaletteGoldBorderActive)";
+const colorPaletteGoldBorderActive = "var(--colorPaletteGoldBorderActive)";
 
 // @public (undocumented)
-export const colorPaletteGoldForeground2 = "var(--colorPaletteGoldForeground2)";
+const colorPaletteGoldForeground2 = "var(--colorPaletteGoldForeground2)";
 
 // @public (undocumented)
-export const colorPaletteGrapeBackground2 = "var(--colorPaletteGrapeBackground2)";
+const colorPaletteGrapeBackground2 = "var(--colorPaletteGrapeBackground2)";
 
 // @public (undocumented)
-export const colorPaletteGrapeBorderActive = "var(--colorPaletteGrapeBorderActive)";
+const colorPaletteGrapeBorderActive = "var(--colorPaletteGrapeBorderActive)";
 
 // @public (undocumented)
-export const colorPaletteGrapeForeground2 = "var(--colorPaletteGrapeForeground2)";
+const colorPaletteGrapeForeground2 = "var(--colorPaletteGrapeForeground2)";
 
 // @public (undocumented)
-export const colorPaletteGreenBackground1 = "var(--colorPaletteGreenBackground1)";
+const colorPaletteGreenBackground1 = "var(--colorPaletteGreenBackground1)";
 
 // @public (undocumented)
-export const colorPaletteGreenBackground2 = "var(--colorPaletteGreenBackground2)";
+const colorPaletteGreenBackground2 = "var(--colorPaletteGreenBackground2)";
 
 // @public (undocumented)
-export const colorPaletteGreenBackground3 = "var(--colorPaletteGreenBackground3)";
+const colorPaletteGreenBackground3 = "var(--colorPaletteGreenBackground3)";
 
 // @public (undocumented)
-export const colorPaletteGreenBorder1 = "var(--colorPaletteGreenBorder1)";
+const colorPaletteGreenBorder1 = "var(--colorPaletteGreenBorder1)";
 
 // @public (undocumented)
-export const colorPaletteGreenBorder2 = "var(--colorPaletteGreenBorder2)";
+const colorPaletteGreenBorder2 = "var(--colorPaletteGreenBorder2)";
 
 // @public (undocumented)
-export const colorPaletteGreenBorderActive = "var(--colorPaletteGreenBorderActive)";
+const colorPaletteGreenBorderActive = "var(--colorPaletteGreenBorderActive)";
 
 // @public (undocumented)
-export const colorPaletteGreenForeground1 = "var(--colorPaletteGreenForeground1)";
+const colorPaletteGreenForeground1 = "var(--colorPaletteGreenForeground1)";
 
 // @public (undocumented)
-export const colorPaletteGreenForeground2 = "var(--colorPaletteGreenForeground2)";
+const colorPaletteGreenForeground2 = "var(--colorPaletteGreenForeground2)";
 
 // @public (undocumented)
-export const colorPaletteGreenForeground3 = "var(--colorPaletteGreenForeground3)";
+const colorPaletteGreenForeground3 = "var(--colorPaletteGreenForeground3)";
 
 // @public (undocumented)
-export const colorPaletteGreenForegroundInverted = "var(--colorPaletteGreenForegroundInverted)";
+const colorPaletteGreenForegroundInverted = "var(--colorPaletteGreenForegroundInverted)";
 
 // @public (undocumented)
-export const colorPaletteLavenderBackground2 = "var(--colorPaletteLavenderBackground2)";
+const colorPaletteLavenderBackground2 = "var(--colorPaletteLavenderBackground2)";
 
 // @public (undocumented)
-export const colorPaletteLavenderBorderActive = "var(--colorPaletteLavenderBorderActive)";
+const colorPaletteLavenderBorderActive = "var(--colorPaletteLavenderBorderActive)";
 
 // @public (undocumented)
-export const colorPaletteLavenderForeground2 = "var(--colorPaletteLavenderForeground2)";
+const colorPaletteLavenderForeground2 = "var(--colorPaletteLavenderForeground2)";
 
 // @public (undocumented)
-export const colorPaletteLightGreenBackground1 = "var(--colorPaletteLightGreenBackground1)";
+const colorPaletteLightGreenBackground1 = "var(--colorPaletteLightGreenBackground1)";
 
 // @public (undocumented)
-export const colorPaletteLightGreenBackground2 = "var(--colorPaletteLightGreenBackground2)";
+const colorPaletteLightGreenBackground2 = "var(--colorPaletteLightGreenBackground2)";
 
 // @public (undocumented)
-export const colorPaletteLightGreenBackground3 = "var(--colorPaletteLightGreenBackground3)";
+const colorPaletteLightGreenBackground3 = "var(--colorPaletteLightGreenBackground3)";
 
 // @public (undocumented)
-export const colorPaletteLightGreenBorder1 = "var(--colorPaletteLightGreenBorder1)";
+const colorPaletteLightGreenBorder1 = "var(--colorPaletteLightGreenBorder1)";
 
 // @public (undocumented)
-export const colorPaletteLightGreenBorder2 = "var(--colorPaletteLightGreenBorder2)";
+const colorPaletteLightGreenBorder2 = "var(--colorPaletteLightGreenBorder2)";
 
 // @public (undocumented)
-export const colorPaletteLightGreenBorderActive = "var(--colorPaletteLightGreenBorderActive)";
+const colorPaletteLightGreenBorderActive = "var(--colorPaletteLightGreenBorderActive)";
 
 // @public (undocumented)
-export const colorPaletteLightGreenForeground1 = "var(--colorPaletteLightGreenForeground1)";
+const colorPaletteLightGreenForeground1 = "var(--colorPaletteLightGreenForeground1)";
 
 // @public (undocumented)
-export const colorPaletteLightGreenForeground2 = "var(--colorPaletteLightGreenForeground2)";
+const colorPaletteLightGreenForeground2 = "var(--colorPaletteLightGreenForeground2)";
 
 // @public (undocumented)
-export const colorPaletteLightGreenForeground3 = "var(--colorPaletteLightGreenForeground3)";
+const colorPaletteLightGreenForeground3 = "var(--colorPaletteLightGreenForeground3)";
 
 // @public (undocumented)
-export const colorPaletteLightTealBackground2 = "var(--colorPaletteLightTealBackground2)";
+const colorPaletteLightTealBackground2 = "var(--colorPaletteLightTealBackground2)";
 
 // @public (undocumented)
-export const colorPaletteLightTealBorderActive = "var(--colorPaletteLightTealBorderActive)";
+const colorPaletteLightTealBorderActive = "var(--colorPaletteLightTealBorderActive)";
 
 // @public (undocumented)
-export const colorPaletteLightTealForeground2 = "var(--colorPaletteLightTealForeground2)";
+const colorPaletteLightTealForeground2 = "var(--colorPaletteLightTealForeground2)";
 
 // @public (undocumented)
-export const colorPaletteLilacBackground2 = "var(--colorPaletteLilacBackground2)";
+const colorPaletteLilacBackground2 = "var(--colorPaletteLilacBackground2)";
 
 // @public (undocumented)
-export const colorPaletteLilacBorderActive = "var(--colorPaletteLilacBorderActive)";
+const colorPaletteLilacBorderActive = "var(--colorPaletteLilacBorderActive)";
 
 // @public (undocumented)
-export const colorPaletteLilacForeground2 = "var(--colorPaletteLilacForeground2)";
+const colorPaletteLilacForeground2 = "var(--colorPaletteLilacForeground2)";
 
 // @public (undocumented)
-export const colorPaletteMagentaBackground2 = "var(--colorPaletteMagentaBackground2)";
+const colorPaletteMagentaBackground2 = "var(--colorPaletteMagentaBackground2)";
 
 // @public (undocumented)
-export const colorPaletteMagentaBorderActive = "var(--colorPaletteMagentaBorderActive)";
+const colorPaletteMagentaBorderActive = "var(--colorPaletteMagentaBorderActive)";
 
 // @public (undocumented)
-export const colorPaletteMagentaForeground2 = "var(--colorPaletteMagentaForeground2)";
+const colorPaletteMagentaForeground2 = "var(--colorPaletteMagentaForeground2)";
 
 // @public (undocumented)
-export const colorPaletteMarigoldBackground1 = "var(--colorPaletteMarigoldBackground1)";
+const colorPaletteMarigoldBackground1 = "var(--colorPaletteMarigoldBackground1)";
 
 // @public (undocumented)
-export const colorPaletteMarigoldBackground2 = "var(--colorPaletteMarigoldBackground2)";
+const colorPaletteMarigoldBackground2 = "var(--colorPaletteMarigoldBackground2)";
 
 // @public (undocumented)
-export const colorPaletteMarigoldBackground3 = "var(--colorPaletteMarigoldBackground3)";
+const colorPaletteMarigoldBackground3 = "var(--colorPaletteMarigoldBackground3)";
 
 // @public (undocumented)
-export const colorPaletteMarigoldBorder1 = "var(--colorPaletteMarigoldBorder1)";
+const colorPaletteMarigoldBorder1 = "var(--colorPaletteMarigoldBorder1)";
 
 // @public (undocumented)
-export const colorPaletteMarigoldBorder2 = "var(--colorPaletteMarigoldBorder2)";
+const colorPaletteMarigoldBorder2 = "var(--colorPaletteMarigoldBorder2)";
 
 // @public (undocumented)
-export const colorPaletteMarigoldBorderActive = "var(--colorPaletteMarigoldBorderActive)";
+const colorPaletteMarigoldBorderActive = "var(--colorPaletteMarigoldBorderActive)";
 
 // @public (undocumented)
-export const colorPaletteMarigoldForeground1 = "var(--colorPaletteMarigoldForeground1)";
+const colorPaletteMarigoldForeground1 = "var(--colorPaletteMarigoldForeground1)";
 
 // @public (undocumented)
-export const colorPaletteMarigoldForeground2 = "var(--colorPaletteMarigoldForeground2)";
+const colorPaletteMarigoldForeground2 = "var(--colorPaletteMarigoldForeground2)";
 
 // @public (undocumented)
-export const colorPaletteMarigoldForeground3 = "var(--colorPaletteMarigoldForeground3)";
+const colorPaletteMarigoldForeground3 = "var(--colorPaletteMarigoldForeground3)";
 
 // @public (undocumented)
-export const colorPaletteMinkBackground2 = "var(--colorPaletteMinkBackground2)";
+const colorPaletteMinkBackground2 = "var(--colorPaletteMinkBackground2)";
 
 // @public (undocumented)
-export const colorPaletteMinkBorderActive = "var(--colorPaletteMinkBorderActive)";
+const colorPaletteMinkBorderActive = "var(--colorPaletteMinkBorderActive)";
 
 // @public (undocumented)
-export const colorPaletteMinkForeground2 = "var(--colorPaletteMinkForeground2)";
+const colorPaletteMinkForeground2 = "var(--colorPaletteMinkForeground2)";
 
 // @public (undocumented)
-export const colorPaletteNavyBackground2 = "var(--colorPaletteNavyBackground2)";
+const colorPaletteNavyBackground2 = "var(--colorPaletteNavyBackground2)";
 
 // @public (undocumented)
-export const colorPaletteNavyBorderActive = "var(--colorPaletteNavyBorderActive)";
+const colorPaletteNavyBorderActive = "var(--colorPaletteNavyBorderActive)";
 
 // @public (undocumented)
-export const colorPaletteNavyForeground2 = "var(--colorPaletteNavyForeground2)";
+const colorPaletteNavyForeground2 = "var(--colorPaletteNavyForeground2)";
 
 // @public (undocumented)
-export const colorPalettePeachBackground2 = "var(--colorPalettePeachBackground2)";
+const colorPalettePeachBackground2 = "var(--colorPalettePeachBackground2)";
 
 // @public (undocumented)
-export const colorPalettePeachBorderActive = "var(--colorPalettePeachBorderActive)";
+const colorPalettePeachBorderActive = "var(--colorPalettePeachBorderActive)";
 
 // @public (undocumented)
-export const colorPalettePeachForeground2 = "var(--colorPalettePeachForeground2)";
+const colorPalettePeachForeground2 = "var(--colorPalettePeachForeground2)";
 
 // @public (undocumented)
-export const colorPalettePinkBackground2 = "var(--colorPalettePinkBackground2)";
+const colorPalettePinkBackground2 = "var(--colorPalettePinkBackground2)";
 
 // @public (undocumented)
-export const colorPalettePinkBorderActive = "var(--colorPalettePinkBorderActive)";
+const colorPalettePinkBorderActive = "var(--colorPalettePinkBorderActive)";
 
 // @public (undocumented)
-export const colorPalettePinkForeground2 = "var(--colorPalettePinkForeground2)";
+const colorPalettePinkForeground2 = "var(--colorPalettePinkForeground2)";
 
 // @public (undocumented)
-export const colorPalettePlatinumBackground2 = "var(--colorPalettePlatinumBackground2)";
+const colorPalettePlatinumBackground2 = "var(--colorPalettePlatinumBackground2)";
 
 // @public (undocumented)
-export const colorPalettePlatinumBorderActive = "var(--colorPalettePlatinumBorderActive)";
+const colorPalettePlatinumBorderActive = "var(--colorPalettePlatinumBorderActive)";
 
 // @public (undocumented)
-export const colorPalettePlatinumForeground2 = "var(--colorPalettePlatinumForeground2)";
+const colorPalettePlatinumForeground2 = "var(--colorPalettePlatinumForeground2)";
 
 // @public (undocumented)
-export const colorPalettePlumBackground2 = "var(--colorPalettePlumBackground2)";
+const colorPalettePlumBackground2 = "var(--colorPalettePlumBackground2)";
 
 // @public (undocumented)
-export const colorPalettePlumBorderActive = "var(--colorPalettePlumBorderActive)";
+const colorPalettePlumBorderActive = "var(--colorPalettePlumBorderActive)";
 
 // @public (undocumented)
-export const colorPalettePlumForeground2 = "var(--colorPalettePlumForeground2)";
+const colorPalettePlumForeground2 = "var(--colorPalettePlumForeground2)";
 
 // @public (undocumented)
-export const colorPalettePumpkinBackground2 = "var(--colorPalettePumpkinBackground2)";
+const colorPalettePumpkinBackground2 = "var(--colorPalettePumpkinBackground2)";
 
 // @public (undocumented)
-export const colorPalettePumpkinBorderActive = "var(--colorPalettePumpkinBorderActive)";
+const colorPalettePumpkinBorderActive = "var(--colorPalettePumpkinBorderActive)";
 
 // @public (undocumented)
-export const colorPalettePumpkinForeground2 = "var(--colorPalettePumpkinForeground2)";
+const colorPalettePumpkinForeground2 = "var(--colorPalettePumpkinForeground2)";
 
 // @public (undocumented)
-export const colorPalettePurpleBackground2 = "var(--colorPalettePurpleBackground2)";
+const colorPalettePurpleBackground2 = "var(--colorPalettePurpleBackground2)";
 
 // @public (undocumented)
-export const colorPalettePurpleBorderActive = "var(--colorPalettePurpleBorderActive)";
+const colorPalettePurpleBorderActive = "var(--colorPalettePurpleBorderActive)";
 
 // @public (undocumented)
-export const colorPalettePurpleForeground2 = "var(--colorPalettePurpleForeground2)";
+const colorPalettePurpleForeground2 = "var(--colorPalettePurpleForeground2)";
 
 // @public (undocumented)
-export const colorPaletteRedBackground1 = "var(--colorPaletteRedBackground1)";
+const colorPaletteRedBackground1 = "var(--colorPaletteRedBackground1)";
 
 // @public (undocumented)
-export const colorPaletteRedBackground2 = "var(--colorPaletteRedBackground2)";
+const colorPaletteRedBackground2 = "var(--colorPaletteRedBackground2)";
 
 // @public (undocumented)
-export const colorPaletteRedBackground3 = "var(--colorPaletteRedBackground3)";
+const colorPaletteRedBackground3 = "var(--colorPaletteRedBackground3)";
 
 // @public (undocumented)
-export const colorPaletteRedBorder1 = "var(--colorPaletteRedBorder1)";
+const colorPaletteRedBorder1 = "var(--colorPaletteRedBorder1)";
 
 // @public (undocumented)
-export const colorPaletteRedBorder2 = "var(--colorPaletteRedBorder2)";
+const colorPaletteRedBorder2 = "var(--colorPaletteRedBorder2)";
 
 // @public (undocumented)
-export const colorPaletteRedBorderActive = "var(--colorPaletteRedBorderActive)";
+const colorPaletteRedBorderActive = "var(--colorPaletteRedBorderActive)";
 
 // @public (undocumented)
-export const colorPaletteRedForeground1 = "var(--colorPaletteRedForeground1)";
+const colorPaletteRedForeground1 = "var(--colorPaletteRedForeground1)";
 
 // @public (undocumented)
-export const colorPaletteRedForeground2 = "var(--colorPaletteRedForeground2)";
+const colorPaletteRedForeground2 = "var(--colorPaletteRedForeground2)";
 
 // @public (undocumented)
-export const colorPaletteRedForeground3 = "var(--colorPaletteRedForeground3)";
+const colorPaletteRedForeground3 = "var(--colorPaletteRedForeground3)";
 
 // @public (undocumented)
-export const colorPaletteRedForegroundInverted = "var(--colorPaletteRedForegroundInverted)";
+const colorPaletteRedForegroundInverted = "var(--colorPaletteRedForegroundInverted)";
 
 // @public (undocumented)
-export const colorPaletteRoyalBlueBackground2 = "var(--colorPaletteRoyalBlueBackground2)";
+const colorPaletteRoyalBlueBackground2 = "var(--colorPaletteRoyalBlueBackground2)";
 
 // @public (undocumented)
-export const colorPaletteRoyalBlueBorderActive = "var(--colorPaletteRoyalBlueBorderActive)";
+const colorPaletteRoyalBlueBorderActive = "var(--colorPaletteRoyalBlueBorderActive)";
 
 // @public (undocumented)
-export const colorPaletteRoyalBlueForeground2 = "var(--colorPaletteRoyalBlueForeground2)";
+const colorPaletteRoyalBlueForeground2 = "var(--colorPaletteRoyalBlueForeground2)";
 
 // @public (undocumented)
-export const colorPaletteSeafoamBackground2 = "var(--colorPaletteSeafoamBackground2)";
+const colorPaletteSeafoamBackground2 = "var(--colorPaletteSeafoamBackground2)";
 
 // @public (undocumented)
-export const colorPaletteSeafoamBorderActive = "var(--colorPaletteSeafoamBorderActive)";
+const colorPaletteSeafoamBorderActive = "var(--colorPaletteSeafoamBorderActive)";
 
 // @public (undocumented)
-export const colorPaletteSeafoamForeground2 = "var(--colorPaletteSeafoamForeground2)";
+const colorPaletteSeafoamForeground2 = "var(--colorPaletteSeafoamForeground2)";
 
 // @public (undocumented)
-export const colorPaletteSteelBackground2 = "var(--colorPaletteSteelBackground2)";
+const colorPaletteSteelBackground2 = "var(--colorPaletteSteelBackground2)";
 
 // @public (undocumented)
-export const colorPaletteSteelBorderActive = "var(--colorPaletteSteelBorderActive)";
+const colorPaletteSteelBorderActive = "var(--colorPaletteSteelBorderActive)";
 
 // @public (undocumented)
-export const colorPaletteSteelForeground2 = "var(--colorPaletteSteelForeground2)";
+const colorPaletteSteelForeground2 = "var(--colorPaletteSteelForeground2)";
 
 // @public (undocumented)
-export const colorPaletteTealBackground2 = "var(--colorPaletteTealBackground2)";
+const colorPaletteTealBackground2 = "var(--colorPaletteTealBackground2)";
 
 // @public (undocumented)
-export const colorPaletteTealBorderActive = "var(--colorPaletteTealBorderActive)";
+const colorPaletteTealBorderActive = "var(--colorPaletteTealBorderActive)";
 
 // @public (undocumented)
-export const colorPaletteTealForeground2 = "var(--colorPaletteTealForeground2)";
+const colorPaletteTealForeground2 = "var(--colorPaletteTealForeground2)";
 
 // @public (undocumented)
-export const colorPaletteYellowBackground1 = "var(--colorPaletteYellowBackground1)";
+const colorPaletteYellowBackground1 = "var(--colorPaletteYellowBackground1)";
 
 // @public (undocumented)
-export const colorPaletteYellowBackground2 = "var(--colorPaletteYellowBackground2)";
+const colorPaletteYellowBackground2 = "var(--colorPaletteYellowBackground2)";
 
 // @public (undocumented)
-export const colorPaletteYellowBackground3 = "var(--colorPaletteYellowBackground3)";
+const colorPaletteYellowBackground3 = "var(--colorPaletteYellowBackground3)";
 
 // @public (undocumented)
-export const colorPaletteYellowBorder1 = "var(--colorPaletteYellowBorder1)";
+const colorPaletteYellowBorder1 = "var(--colorPaletteYellowBorder1)";
 
 // @public (undocumented)
-export const colorPaletteYellowBorder2 = "var(--colorPaletteYellowBorder2)";
+const colorPaletteYellowBorder2 = "var(--colorPaletteYellowBorder2)";
 
 // @public (undocumented)
-export const colorPaletteYellowBorderActive = "var(--colorPaletteYellowBorderActive)";
+const colorPaletteYellowBorderActive = "var(--colorPaletteYellowBorderActive)";
 
 // @public (undocumented)
-export const colorPaletteYellowForeground1 = "var(--colorPaletteYellowForeground1)";
+const colorPaletteYellowForeground1 = "var(--colorPaletteYellowForeground1)";
 
 // @public (undocumented)
-export const colorPaletteYellowForeground2 = "var(--colorPaletteYellowForeground2)";
+const colorPaletteYellowForeground2 = "var(--colorPaletteYellowForeground2)";
 
 // @public (undocumented)
-export const colorPaletteYellowForeground3 = "var(--colorPaletteYellowForeground3)";
+const colorPaletteYellowForeground3 = "var(--colorPaletteYellowForeground3)";
 
 // @public (undocumented)
-export const colorPaletteYellowForegroundInverted = "var(--colorPaletteYellowForegroundInverted)";
+const colorPaletteYellowForegroundInverted = "var(--colorPaletteYellowForegroundInverted)";
 
 // @public (undocumented)
-export const colorScrollbarOverlay = "var(--colorScrollbarOverlay)";
+const colorScrollbarOverlay = "var(--colorScrollbarOverlay)";
 
 // @public (undocumented)
-export const colorStrokeFocus1 = "var(--colorStrokeFocus1)";
+const colorStrokeFocus1 = "var(--colorStrokeFocus1)";
 
 // @public (undocumented)
-export const colorStrokeFocus2 = "var(--colorStrokeFocus2)";
+const colorStrokeFocus2 = "var(--colorStrokeFocus2)";
 
 // @public (undocumented)
-export const colorSubtleBackground = "var(--colorSubtleBackground)";
+const colorSubtleBackground = "var(--colorSubtleBackground)";
 
 // @public (undocumented)
-export const colorSubtleBackgroundHover = "var(--colorSubtleBackgroundHover)";
+const colorSubtleBackgroundHover = "var(--colorSubtleBackgroundHover)";
 
 // @public (undocumented)
-export const colorSubtleBackgroundInverted = "var(--colorSubtleBackgroundInverted)";
+const colorSubtleBackgroundInverted = "var(--colorSubtleBackgroundInverted)";
 
 // @public (undocumented)
-export const colorSubtleBackgroundInvertedHover = "var(--colorSubtleBackgroundInvertedHover)";
+const colorSubtleBackgroundInvertedHover = "var(--colorSubtleBackgroundInvertedHover)";
 
 // @public (undocumented)
-export const colorSubtleBackgroundInvertedPressed = "var(--colorSubtleBackgroundInvertedPressed)";
+const colorSubtleBackgroundInvertedPressed = "var(--colorSubtleBackgroundInvertedPressed)";
 
 // @public (undocumented)
-export const colorSubtleBackgroundInvertedSelected = "var(--colorSubtleBackgroundInvertedSelected)";
+const colorSubtleBackgroundInvertedSelected = "var(--colorSubtleBackgroundInvertedSelected)";
 
 // @public (undocumented)
-export const colorSubtleBackgroundLightAlphaHover = "var(--colorSubtleBackgroundLightAlphaHover)";
+const colorSubtleBackgroundLightAlphaHover = "var(--colorSubtleBackgroundLightAlphaHover)";
 
 // @public (undocumented)
-export const colorSubtleBackgroundLightAlphaPressed = "var(--colorSubtleBackgroundLightAlphaPressed)";
+const colorSubtleBackgroundLightAlphaPressed = "var(--colorSubtleBackgroundLightAlphaPressed)";
 
 // @public (undocumented)
-export const colorSubtleBackgroundLightAlphaSelected = "var(--colorSubtleBackgroundLightAlphaSelected)";
+const colorSubtleBackgroundLightAlphaSelected = "var(--colorSubtleBackgroundLightAlphaSelected)";
 
 // @public (undocumented)
-export const colorSubtleBackgroundPressed = "var(--colorSubtleBackgroundPressed)";
+const colorSubtleBackgroundPressed = "var(--colorSubtleBackgroundPressed)";
 
 // @public (undocumented)
-export const colorSubtleBackgroundSelected = "var(--colorSubtleBackgroundSelected)";
+const colorSubtleBackgroundSelected = "var(--colorSubtleBackgroundSelected)";
 
 // @public (undocumented)
-export const colorTransparentBackground = "var(--colorTransparentBackground)";
+const colorTransparentBackground = "var(--colorTransparentBackground)";
 
 // @public (undocumented)
-export const colorTransparentBackgroundHover = "var(--colorTransparentBackgroundHover)";
+const colorTransparentBackgroundHover = "var(--colorTransparentBackgroundHover)";
 
 // @public (undocumented)
-export const colorTransparentBackgroundPressed = "var(--colorTransparentBackgroundPressed)";
+const colorTransparentBackgroundPressed = "var(--colorTransparentBackgroundPressed)";
 
 // @public (undocumented)
-export const colorTransparentBackgroundSelected = "var(--colorTransparentBackgroundSelected)";
+const colorTransparentBackgroundSelected = "var(--colorTransparentBackgroundSelected)";
 
 // @public (undocumented)
-export const colorTransparentStroke = "var(--colorTransparentStroke)";
+const colorTransparentStroke = "var(--colorTransparentStroke)";
 
 // @public (undocumented)
-export const colorTransparentStrokeDisabled = "var(--colorTransparentStrokeDisabled)";
+const colorTransparentStrokeDisabled = "var(--colorTransparentStrokeDisabled)";
 
 // @public (undocumented)
-export const colorTransparentStrokeInteractive = "var(--colorTransparentStrokeInteractive)";
+const colorTransparentStrokeInteractive = "var(--colorTransparentStrokeInteractive)";
 
 // @public
 export class CompoundButton extends Button {
@@ -1625,11 +1602,6 @@ export type CounterBadgeColor = ValuesOf<typeof CounterBadgeColor>;
 // @public (undocumented)
 export const CounterBadgeDefinition: FASTElementDefinition<typeof CounterBadge>;
 
-// Warning: (ae-incompatible-release-tags) The symbol "CounterBadgeOptions" is marked as @public, but its signature references "BadgeOptions" which is marked as @internal
-//
-// @public
-export type CounterBadgeOptions = BadgeOptions;
-
 // @public
 export const CounterBadgeShape: {
     readonly circular: "circular";
@@ -1658,35 +1630,32 @@ export const CounterBadgeStyles: ElementStyles;
 // @public
 export const CounterBadgeTemplate: ElementViewTemplate<CounterBadge>;
 
-// @public
-export type CSSDisplayPropertyValue = 'block' | 'contents' | 'flex' | 'grid' | 'inherit' | 'initial' | 'inline' | 'inline-block' | 'inline-flex' | 'inline-grid' | 'inline-table' | 'list-item' | 'none' | 'run-in' | 'table' | 'table-caption' | 'table-cell' | 'table-column' | 'table-column-group' | 'table-footer-group' | 'table-header-group' | 'table-row' | 'table-row-group';
-
 // @public (undocumented)
-export const curveAccelerateMax = "var(--curveAccelerateMax)";
+const curveAccelerateMax = "var(--curveAccelerateMax)";
 
 // @public (undocumented)
-export const curveAccelerateMid = "var(--curveAccelerateMid)";
+const curveAccelerateMid = "var(--curveAccelerateMid)";
 
 // @public (undocumented)
-export const curveAccelerateMin = "var(--curveAccelerateMin)";
+const curveAccelerateMin = "var(--curveAccelerateMin)";
 
 // @public (undocumented)
-export const curveDecelerateMax = "var(--curveDecelerateMax)";
+const curveDecelerateMax = "var(--curveDecelerateMax)";
 
 // @public (undocumented)
-export const curveDecelerateMid = "var(--curveDecelerateMid)";
+const curveDecelerateMid = "var(--curveDecelerateMid)";
 
 // @public (undocumented)
-export const curveDecelerateMin = "var(--curveDecelerateMin)";
+const curveDecelerateMin = "var(--curveDecelerateMin)";
 
 // @public (undocumented)
-export const curveEasyEase = "var(--curveEasyEase)";
+const curveEasyEase = "var(--curveEasyEase)";
 
 // @public (undocumented)
-export const curveEasyEaseMax = "var(--curveEasyEaseMax)";
+const curveEasyEaseMax = "var(--curveEasyEaseMax)";
 
 // @public (undocumented)
-export const curveLinear = "var(--curveLinear)";
+const curveLinear = "var(--curveLinear)";
 
 // @public
 export const darkModeStylesheetBehavior: (styles: ElementStyles) => MatchMediaStyleSheetBehavior;
@@ -1724,7 +1693,6 @@ export class Dialog extends FASTElement {
     handleClick(event: Event): boolean;
     handleKeydown: (e: KeyboardEvent) => boolean | void;
     hide(dismissed?: boolean): void;
-    // Warning: (ae-forgotten-export) The symbol "DialogModalType" needs to be exported by the entry point index.d.ts
     modalType: DialogModalType;
     modalTypeChanged(oldValue: DialogModalType, newValue: DialogModalType): void;
     noTitleAction: boolean;
@@ -1739,12 +1707,24 @@ export class Dialog extends FASTElement {
 // @public
 export const DialogDefinition: FASTElementDefinition<typeof Dialog>;
 
+// @public
+export const DialogModalType: {
+    readonly modal: "modal";
+    readonly nonModal: "non-modal";
+    readonly alert: "alert";
+};
+
+// @public (undocumented)
+export type DialogModalType = ValuesOf<typeof DialogModalType>;
+
 // @public
 export const DialogStyles: ElementStyles;
 
 // @public
 export const DialogTemplate: ElementViewTemplate<Dialog>;
 
+// Warning: (ae-forgotten-export) The symbol "CSSDisplayPropertyValue" needs to be exported by the entry point index.d.ts
+//
 // @public
 export function display(displayValue: CSSDisplayPropertyValue): string;
 
@@ -1809,25 +1789,25 @@ export const DividerStyles: ElementStyles;
 export const DividerTemplate: ElementViewTemplate<Divider>;
 
 // @public (undocumented)
-export const durationFast = "var(--durationFast)";
+const durationFast = "var(--durationFast)";
 
 // @public (undocumented)
-export const durationFaster = "var(--durationFaster)";
+const durationFaster = "var(--durationFaster)";
 
 // @public (undocumented)
-export const durationNormal = "var(--durationNormal)";
+const durationNormal = "var(--durationNormal)";
 
 // @public (undocumented)
-export const durationSlow = "var(--durationSlow)";
+const durationSlow = "var(--durationSlow)";
 
 // @public (undocumented)
-export const durationSlower = "var(--durationSlower)";
+const durationSlower = "var(--durationSlower)";
 
 // @public (undocumented)
-export const durationUltraFast = "var(--durationUltraFast)";
+const durationUltraFast = "var(--durationUltraFast)";
 
 // @public (undocumented)
-export const durationUltraSlow = "var(--durationUltraSlow)";
+const durationUltraSlow = "var(--durationUltraSlow)";
 
 // @public (undocumented)
 export const FluentDesignSystem: Readonly<{
@@ -1837,55 +1817,55 @@ export const FluentDesignSystem: Readonly<{
 }>;
 
 // @public (undocumented)
-export const fontFamilyBase = "var(--fontFamilyBase)";
+const fontFamilyBase = "var(--fontFamilyBase)";
 
 // @public (undocumented)
-export const fontFamilyMonospace = "var(--fontFamilyMonospace)";
+const fontFamilyMonospace = "var(--fontFamilyMonospace)";
 
 // @public (undocumented)
-export const fontFamilyNumeric = "var(--fontFamilyNumeric)";
+const fontFamilyNumeric = "var(--fontFamilyNumeric)";
 
 // @public (undocumented)
-export const fontSizeBase100 = "var(--fontSizeBase100)";
+const fontSizeBase100 = "var(--fontSizeBase100)";
 
 // @public (undocumented)
-export const fontSizeBase200 = "var(--fontSizeBase200)";
+const fontSizeBase200 = "var(--fontSizeBase200)";
 
 // @public (undocumented)
-export const fontSizeBase300 = "var(--fontSizeBase300)";
+const fontSizeBase300 = "var(--fontSizeBase300)";
 
 // @public (undocumented)
-export const fontSizeBase400 = "var(--fontSizeBase400)";
+const fontSizeBase400 = "var(--fontSizeBase400)";
 
 // @public (undocumented)
-export const fontSizeBase500 = "var(--fontSizeBase500)";
+const fontSizeBase500 = "var(--fontSizeBase500)";
 
 // @public (undocumented)
-export const fontSizeBase600 = "var(--fontSizeBase600)";
+const fontSizeBase600 = "var(--fontSizeBase600)";
 
 // @public (undocumented)
-export const fontSizeHero1000 = "var(--fontSizeHero1000)";
+const fontSizeHero1000 = "var(--fontSizeHero1000)";
 
 // @public (undocumented)
-export const fontSizeHero700 = "var(--fontSizeHero700)";
+const fontSizeHero700 = "var(--fontSizeHero700)";
 
 // @public (undocumented)
-export const fontSizeHero800 = "var(--fontSizeHero800)";
+const fontSizeHero800 = "var(--fontSizeHero800)";
 
 // @public (undocumented)
-export const fontSizeHero900 = "var(--fontSizeHero900)";
+const fontSizeHero900 = "var(--fontSizeHero900)";
 
 // @public (undocumented)
-export const fontWeightBold = "var(--fontWeightBold)";
+const fontWeightBold = "var(--fontWeightBold)";
 
 // @public (undocumented)
-export const fontWeightMedium = "var(--fontWeightMedium)";
+const fontWeightMedium = "var(--fontWeightMedium)";
 
 // @public (undocumented)
-export const fontWeightRegular = "var(--fontWeightRegular)";
+const fontWeightRegular = "var(--fontWeightRegular)";
 
 // @public (undocumented)
-export const fontWeightSemibold = "var(--fontWeightSemibold)";
+const fontWeightSemibold = "var(--fontWeightSemibold)";
 
 // @public
 export const forcedColorsStylesheetBehavior: (styles: ElementStyles) => MatchMediaStyleSheetBehavior;
@@ -1893,9 +1873,6 @@ export const forcedColorsStylesheetBehavior: (styles: ElementStyles) => MatchMed
 // @public
 export const getDirection: (rootNode: HTMLElement) => Direction;
 
-// @public
-export const hidden = ":host([hidden]){display:none}";
-
 // @public
 class Image_2 extends FASTElement {
     block?: boolean;
@@ -1941,53 +1918,70 @@ export const ImageTemplate: ElementViewTemplate<Image_2>;
 export class Label extends FASTElement {
     disabled: boolean;
     required: boolean;
-    // Warning: (ae-forgotten-export) The symbol "LabelSize" needs to be exported by the entry point index.d.ts
     size?: LabelSize;
-    // Warning: (ae-forgotten-export) The symbol "LabelWeight" needs to be exported by the entry point index.d.ts
     weight?: LabelWeight;
 }
 
 // @public
 export const LabelDefinition: FASTElementDefinition<typeof Label>;
 
+// @public
+export const LabelSize: {
+    readonly small: "small";
+    readonly medium: "medium";
+    readonly large: "large";
+};
+
+// @public
+export type LabelSize = ValuesOf<typeof LabelSize>;
+
 // @public
 export const LabelStyles: ElementStyles;
 
 // @public (undocumented)
 export const LabelTemplate: ElementViewTemplate<Label>;
 
+// @public
+export const LabelWeight: {
+    readonly regular: "regular";
+    readonly semibold: "semibold";
+};
+
+// @public
+export type LabelWeight = ValuesOf<typeof LabelWeight>;
+
 // @public
 export const lightModeStylesheetBehavior: (styles: ElementStyles) => MatchMediaStyleSheetBehavior;
 
 // @public (undocumented)
-export const lineHeightBase100 = "var(--lineHeightBase100)";
+const lineHeightBase100 = "var(--lineHeightBase100)";
 
 // @public (undocumented)
-export const lineHeightBase200 = "var(--lineHeightBase200)";
+const lineHeightBase200 = "var(--lineHeightBase200)";
 
 // @public (undocumented)
-export const lineHeightBase300 = "var(--lineHeightBase300)";
+const lineHeightBase300 = "var(--lineHeightBase300)";
 
 // @public (undocumented)
-export const lineHeightBase400 = "var(--lineHeightBase400)";
+const lineHeightBase400 = "var(--lineHeightBase400)";
 
 // @public (undocumented)
-export const lineHeightBase500 = "var(--lineHeightBase500)";
+const lineHeightBase500 = "var(--lineHeightBase500)";
 
 // @public (undocumented)
-export const lineHeightBase600 = "var(--lineHeightBase600)";
+const lineHeightBase600 = "var(--lineHeightBase600)";
 
 // @public (undocumented)
-export const lineHeightHero1000 = "var(--lineHeightHero1000)";
+const lineHeightHero1000 = "var(--lineHeightHero1000)";
 
 // @public (undocumented)
-export const lineHeightHero700 = "var(--lineHeightHero700)";
+const lineHeightHero700 = "var(--lineHeightHero700)";
 
 // @public (undocumented)
-export const lineHeightHero800 = "var(--lineHeightHero800)";
+const lineHeightHero800 = "var(--lineHeightHero800)";
 
 // @public (undocumented)
-export const lineHeightHero900 = "var(--lineHeightHero900)";
+const lineHeightHero900 = "var(--lineHeightHero900)";
 
 // @public
 export abstract class MatchMediaBehavior implements HostBehavior {
@@ -2298,7 +2292,6 @@ export class RadioGroup extends FASTElement {
     name: string;
     // (undocumented)
     protected nameChanged(): void;
-    // Warning: (ae-forgotten-export) The symbol "RadioGroupOrientation" needs to be exported by the entry point index.d.ts
     orientation: RadioGroupOrientation;
     readOnly: boolean;
     // @internal (undocumented)
@@ -2314,6 +2307,18 @@ export class RadioGroup extends FASTElement {
 // @public
 export const RadioGroupDefinition: FASTElementDefinition<typeof RadioGroup>;
 
+// @public
+export const RadioGroupOrientation: {
+    readonly horizontal: "horizontal"; /**
+    * Radio Group orientation
+    * @public
+    */
+    readonly vertical: "vertical";
+};
+
+// @public
+export type RadioGroupOrientation = ValuesOf<typeof RadioGroupOrientation>;
+
 // @public
 export const RadioGroupStyles: ElementStyles;
 
@@ -2345,40 +2350,40 @@ export const setTheme: (theme: Theme) => void;
 export const setThemeFor: (element: HTMLElement, theme: Theme) => void;
 
 // @public (undocumented)
-export const shadow16 = "var(--shadow16)";
+const shadow16 = "var(--shadow16)";
 
 // @public (undocumented)
-export const shadow16Brand = "var(--shadow16Brand)";
+const shadow16Brand = "var(--shadow16Brand)";
 
 // @public (undocumented)
-export const shadow2 = "var(--shadow2)";
+const shadow2 = "var(--shadow2)";
 
 // @public (undocumented)
-export const shadow28 = "var(--shadow28)";
+const shadow28 = "var(--shadow28)";
 
 // @public (undocumented)
-export const shadow28Brand = "var(--shadow28Brand)";
+const shadow28Brand = "var(--shadow28Brand)";
 
 // @public (undocumented)
-export const shadow2Brand = "var(--shadow2Brand)";
+const shadow2Brand = "var(--shadow2Brand)";
 
 // @public (undocumented)
-export const shadow4 = "var(--shadow4)";
+const shadow4 = "var(--shadow4)";
 
 // @public (undocumented)
-export const shadow4Brand = "var(--shadow4Brand)";
+const shadow4Brand = "var(--shadow4Brand)";
 
 // @public (undocumented)
-export const shadow64 = "var(--shadow64)";
+const shadow64 = "var(--shadow64)";
 
 // @public (undocumented)
-export const shadow64Brand = "var(--shadow64Brand)";
+const shadow64Brand = "var(--shadow64Brand)";
 
 // @public (undocumented)
-export const shadow8 = "var(--shadow8)";
+const shadow8 = "var(--shadow8)";
 
 // @public (undocumented)
-export const shadow8Brand = "var(--shadow8Brand)";
+const shadow8Brand = "var(--shadow8Brand)";
 
 // Warning: (ae-forgotten-export) The symbol "FormAssociatedSlider" needs to be exported by the entry point index.d.ts
 //
@@ -2502,75 +2507,73 @@ export const SliderStyles: ElementStyles;
 export const SliderTemplate: ElementViewTemplate<Slider>;
 
 // @public (undocumented)
-export const spacingHorizontalL = "var(--spacingHorizontalL)";
+const spacingHorizontalL = "var(--spacingHorizontalL)";
 
 // @public (undocumented)
-export const spacingHorizontalM = "var(--spacingHorizontalM)";
+const spacingHorizontalM = "var(--spacingHorizontalM)";
 
 // @public (undocumented)
-export const spacingHorizontalMNudge = "var(--spacingHorizontalMNudge)";
+const spacingHorizontalMNudge = "var(--spacingHorizontalMNudge)";
 
 // @public (undocumented)
-export const spacingHorizontalNone = "var(--spacingHorizontalNone)";
+const spacingHorizontalNone = "var(--spacingHorizontalNone)";
 
 // @public (undocumented)
-export const spacingHorizontalS = "var(--spacingHorizontalS)";
+const spacingHorizontalS = "var(--spacingHorizontalS)";
 
 // @public (undocumented)
-export const spacingHorizontalSNudge = "var(--spacingHorizontalSNudge)";
+const spacingHorizontalSNudge = "var(--spacingHorizontalSNudge)";
 
 // @public (undocumented)
-export const spacingHorizontalXL = "var(--spacingHorizontalXL)";
+const spacingHorizontalXL = "var(--spacingHorizontalXL)";
 
 // @public (undocumented)
-export const spacingHorizontalXS = "var(--spacingHorizontalXS)";
+const spacingHorizontalXS = "var(--spacingHorizontalXS)";
 
 // @public (undocumented)
-export const spacingHorizontalXXL = "var(--spacingHorizontalXXL)";
+const spacingHorizontalXXL = "var(--spacingHorizontalXXL)";
 
 // @public (undocumented)
-export const spacingHorizontalXXS = "var(--spacingHorizontalXXS)";
+const spacingHorizontalXXS = "var(--spacingHorizontalXXS)";
 
 // @public (undocumented)
-export const spacingHorizontalXXXL = "var(--spacingHorizontalXXXL)";
+const spacingHorizontalXXXL = "var(--spacingHorizontalXXXL)";
 
 // @public (undocumented)
-export const spacingVerticalL = "var(--spacingVerticalL)";
+const spacingVerticalL = "var(--spacingVerticalL)";
 
 // @public (undocumented)
-export const spacingVerticalM = "var(--spacingVerticalM)";
+const spacingVerticalM = "var(--spacingVerticalM)";
 
 // @public (undocumented)
-export const spacingVerticalMNudge = "var(--spacingVerticalMNudge)";
+const spacingVerticalMNudge = "var(--spacingVerticalMNudge)";
 
 // @public (undocumented)
-export const spacingVerticalNone = "var(--spacingVerticalNone)";
+const spacingVerticalNone = "var(--spacingVerticalNone)";
 
 // @public (undocumented)
-export const spacingVerticalS = "var(--spacingVerticalS)";
+const spacingVerticalS = "var(--spacingVerticalS)";
 
 // @public (undocumented)
-export const spacingVerticalSNudge = "var(--spacingVerticalSNudge)";
+const spacingVerticalSNudge = "var(--spacingVerticalSNudge)";
 
 // @public (undocumented)
-export const spacingVerticalXL = "var(--spacingVerticalXL)";
+const spacingVerticalXL = "var(--spacingVerticalXL)";
 
 // @public (undocumented)
-export const spacingVerticalXS = "var(--spacingVerticalXS)";
+const spacingVerticalXS = "var(--spacingVerticalXS)";
 
 // @public (undocumented)
-export const spacingVerticalXXL = "var(--spacingVerticalXXL)";
+const spacingVerticalXXL = "var(--spacingVerticalXXL)";
 
 // @public (undocumented)
-export const spacingVerticalXXS = "var(--spacingVerticalXXS)";
+const spacingVerticalXXS = "var(--spacingVerticalXXS)";
 
 // @public (undocumented)
-export const spacingVerticalXXXL = "var(--spacingVerticalXXXL)";
+const spacingVerticalXXXL = "var(--spacingVerticalXXXL)";
 
-// Warning: (ae-forgotten-export) The symbol "ProgressRing" needs to be exported by the entry point index.d.ts
-//
 // @public
-export class Spinner extends ProgressRing {
+export class Spinner extends BaseProgress {
     appearance?: SpinnerAppearance;
     size?: SpinnerSize;
 }
@@ -2587,6 +2590,11 @@ export type SpinnerAppearance = ValuesOf<typeof SpinnerAppearance>;
 // @public (undocumented)
 export const SpinnerDefinition: FASTElementDefinition<typeof Spinner>;
 
+// @public
+export type SpinnerOptions = {
+    indeterminateIndicator?: StaticallyComposableHTML<Spinner>;
+};
+
 // @public
 export const SpinnerSize: {
     readonly tiny: "tiny";
@@ -2608,16 +2616,16 @@ export const SpinnerStyles: ElementStyles;
 export const SpinnerTemplate: ElementViewTemplate<Spinner>;
 
 // @public (undocumented)
-export const strokeWidthThick = "var(--strokeWidthThick)";
+const strokeWidthThick = "var(--strokeWidthThick)";
 
 // @public (undocumented)
-export const strokeWidthThicker = "var(--strokeWidthThicker)";
+const strokeWidthThicker = "var(--strokeWidthThicker)";
 
 // @public (undocumented)
-export const strokeWidthThickest = "var(--strokeWidthThickest)";
+const strokeWidthThickest = "var(--strokeWidthThickest)";
 
 // @public (undocumented)
-export const strokeWidthThin = "var(--strokeWidthThin)";
+const strokeWidthThin = "var(--strokeWidthThin)";
 
 // @public
 const styles: ElementStyles;
@@ -2697,6 +2705,8 @@ export const TabPanelStyles: ElementStyles;
 // @public (undocumented)
 export const TabPanelTemplate: ElementViewTemplate<TabPanel, any>;
 
+// Warning: (ae-forgotten-export) The symbol "BaseTabs" needs to be exported by the entry point index.d.ts
+//
 // @public (undocumented)
 export class Tabs extends BaseTabs {
     // (undocumented)
@@ -2787,21 +2797,6 @@ export type TextAlign = ValuesOf<typeof TextAlign>;
 // @public
 export const TextDefinition: FASTElementDefinition<typeof Text_2>;
 
-// @public (undocumented)
-export type TextFieldOptions = StartEndOptions<TextInput>;
-
-// @public
-export const TextFieldType: {
-    readonly email: "email";
-    readonly password: "password";
-    readonly tel: "tel";
-    readonly text: "text";
-    readonly url: "url";
-};
-
-// @public
-export type TextFieldType = ValuesOf<typeof TextFieldType>;
-
 // @public
 export const TextFont: {
     readonly base: "base";
@@ -2856,13 +2851,15 @@ export class TextInput extends FormAssociatedTextField {
     spellcheck: boolean;
     // (undocumented)
     protected spellcheckChanged(): void;
-    type: TextFieldType;
+    type: TextInputType;
     // Warning: (ae-unresolved-inheritdoc-reference) The @inheritDoc reference could not be resolved: The package "@fluentui/web-components" does not have an export "FormAssociated"
     //
     // (undocumented)
     validate(): void;
 }
 
+// Warning: (ae-forgotten-export) The symbol "DelegatesARIATextbox" needs to be exported by the entry point index.d.ts
+//
 // @public (undocumented)
 export interface TextInput extends StartEnd, DelegatesARIATextbox {
 }
@@ -2891,6 +2888,9 @@ export type TextInputControlSize = ValuesOf<typeof TextInputControlSize>;
 // @public
 export const TextInputDefinition: FASTElementDefinition<typeof TextInput>;
 
+// @public (undocumented)
+export type TextInputOptions = StartEndOptions<TextInput>;
+
 // @public
 export const TextInputStyles: ElementStyles;
 
@@ -2899,6 +2899,18 @@ export const TextInputStyles: ElementStyles;
 // @internal (undocumented)
 export const TextInputTemplate: ElementViewTemplate<TextInput>;
 
+// @public
+export const TextInputType: {
+    readonly email: "email";
+    readonly password: "password";
+    readonly tel: "tel";
+    readonly text: "text";
+    readonly url: "url";
+};
+
+// @public
+export type TextInputType = ValuesOf<typeof TextInputType>;
+
 // @public
 export const TextSize: {
     readonly _100: "100";
@@ -2990,6 +3002,396 @@ export const ToggleButtonStyles: ElementStyles;
 // @public
 export const ToggleButtonTemplate: ElementViewTemplate<ToggleButton>;
 
+declare namespace tokens {
+    export {
+        colorNeutralForeground1,
+        colorNeutralForeground1Hover,
+        colorNeutralForeground1Pressed,
+        colorNeutralForeground1Selected,
+        colorNeutralForeground2,
+        colorNeutralForeground2Hover,
+        colorNeutralForeground2Pressed,
+        colorNeutralForeground2Selected,
+        colorNeutralForeground2BrandHover,
+        colorNeutralForeground2BrandPressed,
+        colorNeutralForeground2BrandSelected,
+        colorNeutralForeground3,
+        colorNeutralForeground3Hover,
+        colorNeutralForeground3Pressed,
+        colorNeutralForeground3Selected,
+        colorNeutralForeground3BrandHover,
+        colorNeutralForeground3BrandPressed,
+        colorNeutralForeground3BrandSelected,
+        colorNeutralForeground4,
+        colorNeutralForegroundDisabled,
+        colorBrandForegroundLink,
+        colorBrandForegroundLinkHover,
+        colorBrandForegroundLinkPressed,
+        colorBrandForegroundLinkSelected,
+        colorNeutralForeground2Link,
+        colorNeutralForeground2LinkHover,
+        colorNeutralForeground2LinkPressed,
+        colorNeutralForeground2LinkSelected,
+        colorCompoundBrandForeground1,
+        colorCompoundBrandForeground1Hover,
+        colorCompoundBrandForeground1Pressed,
+        colorNeutralForegroundOnBrand,
+        colorNeutralForegroundInverted,
+        colorNeutralForegroundInvertedHover,
+        colorNeutralForegroundInvertedPressed,
+        colorNeutralForegroundInvertedSelected,
+        colorNeutralForegroundInverted2,
+        colorNeutralForegroundStaticInverted,
+        colorNeutralForegroundInvertedLink,
+        colorNeutralForegroundInvertedLinkHover,
+        colorNeutralForegroundInvertedLinkPressed,
+        colorNeutralForegroundInvertedLinkSelected,
+        colorNeutralForegroundInvertedDisabled,
+        colorBrandForeground1,
+        colorBrandForeground2,
+        colorNeutralForeground1Static,
+        colorBrandForegroundInverted,
+        colorBrandForegroundInvertedHover,
+        colorBrandForegroundInvertedPressed,
+        colorBrandForegroundOnLight,
+        colorBrandForegroundOnLightHover,
+        colorBrandForegroundOnLightPressed,
+        colorBrandForegroundOnLightSelected,
+        colorNeutralBackground1,
+        colorNeutralBackground1Hover,
+        colorNeutralBackground1Pressed,
+        colorNeutralBackground1Selected,
+        colorNeutralBackground2,
+        colorNeutralBackground2Hover,
+        colorNeutralBackground2Pressed,
+        colorNeutralBackground2Selected,
+        colorNeutralBackground3,
+        colorNeutralBackground3Hover,
+        colorNeutralBackground3Pressed,
+        colorNeutralBackground3Selected,
+        colorNeutralBackground4,
+        colorNeutralBackground4Hover,
+        colorNeutralBackground4Pressed,
+        colorNeutralBackground4Selected,
+        colorNeutralBackground5,
+        colorNeutralBackground5Hover,
+        colorNeutralBackground5Pressed,
+        colorNeutralBackground5Selected,
+        colorNeutralBackground6,
+        colorNeutralBackgroundStatic,
+        colorNeutralBackgroundInverted,
+        colorSubtleBackground,
+        colorSubtleBackgroundHover,
+        colorSubtleBackgroundPressed,
+        colorSubtleBackgroundSelected,
+        colorSubtleBackgroundLightAlphaHover,
+        colorSubtleBackgroundLightAlphaPressed,
+        colorSubtleBackgroundLightAlphaSelected,
+        colorSubtleBackgroundInverted,
+        colorSubtleBackgroundInvertedHover,
+        colorSubtleBackgroundInvertedPressed,
+        colorSubtleBackgroundInvertedSelected,
+        colorTransparentBackground,
+        colorTransparentBackgroundHover,
+        colorTransparentBackgroundPressed,
+        colorTransparentBackgroundSelected,
+        colorNeutralBackgroundDisabled,
+        colorNeutralBackgroundInvertedDisabled,
+        colorNeutralStencil1,
+        colorNeutralStencil2,
+        colorNeutralStencil1Alpha,
+        colorNeutralStencil2Alpha,
+        colorBackgroundOverlay,
+        colorScrollbarOverlay,
+        colorBrandBackground,
+        colorBrandBackgroundHover,
+        colorBrandBackgroundPressed,
+        colorBrandBackgroundSelected,
+        colorCompoundBrandBackground,
+        colorCompoundBrandBackgroundHover,
+        colorCompoundBrandBackgroundPressed,
+        colorBrandBackgroundStatic,
+        colorBrandBackground2,
+        colorBrandBackgroundInverted,
+        colorBrandBackgroundInvertedHover,
+        colorBrandBackgroundInvertedPressed,
+        colorBrandBackgroundInvertedSelected,
+        colorNeutralStrokeAccessible,
+        colorNeutralStrokeAccessibleHover,
+        colorNeutralStrokeAccessiblePressed,
+        colorNeutralStrokeAccessibleSelected,
+        colorNeutralStroke1,
+        colorNeutralStroke1Hover,
+        colorNeutralStroke1Pressed,
+        colorNeutralStroke1Selected,
+        colorNeutralStroke2,
+        colorNeutralStroke3,
+        colorNeutralStrokeOnBrand,
+        colorNeutralStrokeOnBrand2,
+        colorNeutralStrokeOnBrand2Hover,
+        colorNeutralStrokeOnBrand2Pressed,
+        colorNeutralStrokeOnBrand2Selected,
+        colorBrandStroke1,
+        colorBrandStroke2,
+        colorCompoundBrandStroke,
+        colorCompoundBrandStrokeHover,
+        colorCompoundBrandStrokePressed,
+        colorNeutralStrokeDisabled,
+        colorNeutralStrokeInvertedDisabled,
+        colorTransparentStroke,
+        colorTransparentStrokeInteractive,
+        colorTransparentStrokeDisabled,
+        colorStrokeFocus1,
+        colorStrokeFocus2,
+        colorNeutralShadowAmbient,
+        colorNeutralShadowKey,
+        colorNeutralShadowAmbientLighter,
+        colorNeutralShadowKeyLighter,
+        colorNeutralShadowAmbientDarker,
+        colorNeutralShadowKeyDarker,
+        colorBrandShadowAmbient,
+        colorBrandShadowKey,
+        colorPaletteRedBackground1,
+        colorPaletteRedBackground2,
+        colorPaletteRedBackground3,
+        colorPaletteRedBorderActive,
+        colorPaletteRedBorder1,
+        colorPaletteRedBorder2,
+        colorPaletteRedForeground1,
+        colorPaletteRedForeground2,
+        colorPaletteRedForeground3,
+        colorPaletteRedForegroundInverted,
+        colorPaletteGreenBackground1,
+        colorPaletteGreenBackground2,
+        colorPaletteGreenBackground3,
+        colorPaletteGreenBorderActive,
+        colorPaletteGreenBorder1,
+        colorPaletteGreenBorder2,
+        colorPaletteGreenForeground1,
+        colorPaletteGreenForeground2,
+        colorPaletteGreenForeground3,
+        colorPaletteGreenForegroundInverted,
+        colorPaletteDarkOrangeBackground1,
+        colorPaletteDarkOrangeBackground2,
+        colorPaletteDarkOrangeBackground3,
+        colorPaletteDarkOrangeBorderActive,
+        colorPaletteDarkOrangeBorder1,
+        colorPaletteDarkOrangeBorder2,
+        colorPaletteDarkOrangeForeground1,
+        colorPaletteDarkOrangeForeground2,
+        colorPaletteDarkOrangeForeground3,
+        colorPaletteYellowBackground1,
+        colorPaletteYellowBackground2,
+        colorPaletteYellowBackground3,
+        colorPaletteYellowBorderActive,
+        colorPaletteYellowBorder1,
+        colorPaletteYellowBorder2,
+        colorPaletteYellowForeground1,
+        colorPaletteYellowForeground2,
+        colorPaletteYellowForeground3,
+        colorPaletteYellowForegroundInverted,
+        colorPaletteBerryBackground1,
+        colorPaletteBerryBackground2,
+        colorPaletteBerryBackground3,
+        colorPaletteBerryBorderActive,
+        colorPaletteBerryBorder1,
+        colorPaletteBerryBorder2,
+        colorPaletteBerryForeground1,
+        colorPaletteBerryForeground2,
+        colorPaletteBerryForeground3,
+        colorPaletteMarigoldBackground1,
+        colorPaletteMarigoldBackground2,
+        colorPaletteMarigoldBackground3,
+        colorPaletteMarigoldBorderActive,
+        colorPaletteMarigoldBorder1,
+        colorPaletteMarigoldBorder2,
+        colorPaletteMarigoldForeground1,
+        colorPaletteMarigoldForeground2,
+        colorPaletteMarigoldForeground3,
+        colorPaletteLightGreenBackground1,
+        colorPaletteLightGreenBackground2,
+        colorPaletteLightGreenBackground3,
+        colorPaletteLightGreenBorderActive,
+        colorPaletteLightGreenBorder1,
+        colorPaletteLightGreenBorder2,
+        colorPaletteLightGreenForeground1,
+        colorPaletteLightGreenForeground2,
+        colorPaletteLightGreenForeground3,
+        colorPaletteAnchorBackground2,
+        colorPaletteAnchorBorderActive,
+        colorPaletteAnchorForeground2,
+        colorPaletteBeigeBackground2,
+        colorPaletteBeigeBorderActive,
+        colorPaletteBeigeForeground2,
+        colorPaletteBlueBackground2,
+        colorPaletteBlueBorderActive,
+        colorPaletteBlueForeground2,
+        colorPaletteBrassBackground2,
+        colorPaletteBrassBorderActive,
+        colorPaletteBrassForeground2,
+        colorPaletteBrownBackground2,
+        colorPaletteBrownBorderActive,
+        colorPaletteBrownForeground2,
+        colorPaletteCornflowerBackground2,
+        colorPaletteCornflowerBorderActive,
+        colorPaletteCornflowerForeground2,
+        colorPaletteCranberryBackground2,
+        colorPaletteCranberryBorderActive,
+        colorPaletteCranberryForeground2,
+        colorPaletteDarkGreenBackground2,
+        colorPaletteDarkGreenBorderActive,
+        colorPaletteDarkGreenForeground2,
+        colorPaletteDarkRedBackground2,
+        colorPaletteDarkRedBorderActive,
+        colorPaletteDarkRedForeground2,
+        colorPaletteForestBackground2,
+        colorPaletteForestBorderActive,
+        colorPaletteForestForeground2,
+        colorPaletteGoldBackground2,
+        colorPaletteGoldBorderActive,
+        colorPaletteGoldForeground2,
+        colorPaletteGrapeBackground2,
+        colorPaletteGrapeBorderActive,
+        colorPaletteGrapeForeground2,
+        colorPaletteLavenderBackground2,
+        colorPaletteLavenderBorderActive,
+        colorPaletteLavenderForeground2,
+        colorPaletteLightTealBackground2,
+        colorPaletteLightTealBorderActive,
+        colorPaletteLightTealForeground2,
+        colorPaletteLilacBackground2,
+        colorPaletteLilacBorderActive,
+        colorPaletteLilacForeground2,
+        colorPaletteMagentaBackground2,
+        colorPaletteMagentaBorderActive,
+        colorPaletteMagentaForeground2,
+        colorPaletteMinkBackground2,
+        colorPaletteMinkBorderActive,
+        colorPaletteMinkForeground2,
+        colorPaletteNavyBackground2,
+        colorPaletteNavyBorderActive,
+        colorPaletteNavyForeground2,
+        colorPalettePeachBackground2,
+        colorPalettePeachBorderActive,
+        colorPalettePeachForeground2,
+        colorPalettePinkBackground2,
+        colorPalettePinkBorderActive,
+        colorPalettePinkForeground2,
+        colorPalettePlatinumBackground2,
+        colorPalettePlatinumBorderActive,
+        colorPalettePlatinumForeground2,
+        colorPalettePlumBackground2,
+        colorPalettePlumBorderActive,
+        colorPalettePlumForeground2,
+        colorPalettePumpkinBackground2,
+        colorPalettePumpkinBorderActive,
+        colorPalettePumpkinForeground2,
+        colorPalettePurpleBackground2,
+        colorPalettePurpleBorderActive,
+        colorPalettePurpleForeground2,
+        colorPaletteRoyalBlueBackground2,
+        colorPaletteRoyalBlueBorderActive,
+        colorPaletteRoyalBlueForeground2,
+        colorPaletteSeafoamBackground2,
+        colorPaletteSeafoamBorderActive,
+        colorPaletteSeafoamForeground2,
+        colorPaletteSteelBackground2,
+        colorPaletteSteelBorderActive,
+        colorPaletteSteelForeground2,
+        colorPaletteTealBackground2,
+        colorPaletteTealBorderActive,
+        colorPaletteTealForeground2,
+        borderRadiusNone,
+        borderRadiusSmall,
+        borderRadiusMedium,
+        borderRadiusLarge,
+        borderRadiusXLarge,
+        borderRadiusCircular,
+        fontFamilyBase,
+        fontFamilyMonospace,
+        fontFamilyNumeric,
+        fontSizeBase100,
+        fontSizeBase200,
+        fontSizeBase300,
+        fontSizeBase400,
+        fontSizeBase500,
+        fontSizeBase600,
+        fontSizeHero700,
+        fontSizeHero800,
+        fontSizeHero900,
+        fontSizeHero1000,
+        fontWeightRegular,
+        fontWeightMedium,
+        fontWeightSemibold,
+        fontWeightBold,
+        lineHeightBase100,
+        lineHeightBase200,
+        lineHeightBase300,
+        lineHeightBase400,
+        lineHeightBase500,
+        lineHeightBase600,
+        lineHeightHero700,
+        lineHeightHero800,
+        lineHeightHero900,
+        lineHeightHero1000,
+        shadow2,
+        shadow4,
+        shadow8,
+        shadow16,
+        shadow28,
+        shadow64,
+        shadow2Brand,
+        shadow4Brand,
+        shadow8Brand,
+        shadow16Brand,
+        shadow28Brand,
+        shadow64Brand,
+        strokeWidthThin,
+        strokeWidthThick,
+        strokeWidthThicker,
+        strokeWidthThickest,
+        spacingHorizontalNone,
+        spacingHorizontalXXS,
+        spacingHorizontalXS,
+        spacingHorizontalSNudge,
+        spacingHorizontalS,
+        spacingHorizontalMNudge,
+        spacingHorizontalM,
+        spacingHorizontalL,
+        spacingHorizontalXL,
+        spacingHorizontalXXL,
+        spacingHorizontalXXXL,
+        spacingVerticalNone,
+        spacingVerticalXXS,
+        spacingVerticalXS,
+        spacingVerticalSNudge,
+        spacingVerticalS,
+        spacingVerticalMNudge,
+        spacingVerticalM,
+        spacingVerticalL,
+        spacingVerticalXL,
+        spacingVerticalXXL,
+        spacingVerticalXXXL,
+        durationUltraFast,
+        durationFaster,
+        durationFast,
+        durationNormal,
+        durationSlow,
+        durationSlower,
+        durationUltraSlow,
+        curveAccelerateMax,
+        curveAccelerateMid,
+        curveAccelerateMin,
+        curveDecelerateMax,
+        curveDecelerateMid,
+        curveDecelerateMin,
+        curveEasyEaseMax,
+        curveEasyEase,
+        curveLinear
+    }
+}
+export { tokens }
+
 // Warnings were encountered during analysis:
 //
 // dist/dts/accordion-item/accordion-item.d.ts:11:5 - (ae-forgotten-export) The symbol "StaticallyComposableHTML" needs to be exported by the entry point index.d.ts
diff --git a/packages/web-components/src/index-rollup.ts b/packages/web-components/src/index-rollup.ts
index ee01cc9bd3233f..6c0d36ad1137b7 100644
--- a/packages/web-components/src/index-rollup.ts
+++ b/packages/web-components/src/index-rollup.ts
@@ -1 +1,204 @@
-export * from './index.js';
+export {
+  Accordion,
+  AccordionExpandMode,
+  accordionTemplate,
+  accordionStyles,
+  accordionDefinition,
+} from './accordion/index.js';
+export {
+  AccordionItem,
+  AccordionItemSize,
+  AccordionItemExpandIconPosition,
+  accordionItemTemplate,
+  accordionItemStyles,
+  accordionItemDefinition,
+} from './accordion-item/index.js';
+export {
+  AnchorButton,
+  AnchorButtonAppearance,
+  AnchorButtonShape,
+  AnchorButtonSize,
+  AnchorTarget,
+  AnchorButtonTemplate,
+  AnchorButtonDefinition,
+} from './anchor-button/index.js';
+export {
+  Avatar,
+  AvatarActive,
+  AvatarAppearance,
+  AvatarColor,
+  AvatarNamedColor,
+  AvatarShape,
+  AvatarSize,
+  AvatarTemplate,
+  AvatarStyles,
+  AvatarDefinition,
+} from './avatar/index.js';
+export {
+  Badge,
+  BadgeAppearance,
+  BadgeColor,
+  BadgeShape,
+  BadgeSize,
+  BadgeTemplate,
+  BadgeStyles,
+  BadgeDefinition,
+} from './badge/index.js';
+export {
+  Button,
+  ButtonAppearance,
+  ButtonShape,
+  ButtonSize,
+  ButtonType,
+  ButtonTemplate,
+  ButtonStyles,
+  ButtonDefinition,
+} from './button/index.js';
+export {
+  Checkbox,
+  CheckboxLabelPosition,
+  CheckboxShape,
+  CheckboxSize,
+  CheckboxDefinition,
+  CheckboxTemplate,
+  CheckboxStyles,
+} from './checkbox/index.js';
+export {
+  CompoundButton,
+  CompoundButtonAppearance,
+  CompoundButtonShape,
+  CompoundButtonSize,
+  CompoundButtonTemplate,
+  CompoundButtonStyles,
+  CompoundButtonDefinition,
+} from './compound-button/index.js';
+export {
+  CounterBadge,
+  CounterBadgeAppearance,
+  CounterBadgeColor,
+  CounterBadgeShape,
+  CounterBadgeSize,
+  CounterBadgeTemplate,
+  CounterBadgeStyles,
+  CounterBadgeDefinition,
+} from './counter-badge/index.js';
+export { Dialog, DialogModalType, DialogDefinition, DialogTemplate, DialogStyles } from './dialog/index.js';
+export {
+  Divider,
+  DividerAlignContent,
+  DividerAppearance,
+  DividerOrientation,
+  DividerRole,
+  DividerDefinition,
+  DividerTemplate,
+  DividerStyles,
+} from './divider/index.js';
+export { Image, ImageFit, ImageShape, ImageDefinition, ImageTemplate, ImageStyles } from './image/index.js';
+export { Label, LabelSize, LabelWeight, LabelDefinition, LabelStyles, LabelTemplate } from './label/index.js';
+export { Menu, MenuTemplate, MenuStyles, MenuDefinition } from './menu/index.js';
+export {
+  MenuButton,
+  MenuButtonAppearance,
+  MenuButtonShape,
+  MenuButtonSize,
+  MenuButtonTemplate,
+  MenuButtonStyles,
+  MenuButtonDefinition,
+} from './menu-button/index.js';
+export {
+  MenuItem,
+  MenuItemRole,
+  roleForMenuItem,
+  MenuItemTemplate,
+  MenuItemStyles,
+  MenuItemDefinition,
+} from './menu-item/index.js';
+export { MenuList, MenuListTemplate, MenuListStyles, MenuListDefinition } from './menu-list/index.js';
+export {
+  ProgressBar,
+  ProgressBarShape,
+  ProgressBarThickness,
+  ProgressBarValidationState,
+  ProgressBarDefinition,
+  ProgressBarStyles,
+  ProgressBarTemplate,
+} from './progress-bar/index.js';
+export { Radio, RadioDefinition, RadioStyles, RadioTemplate } from './radio/index.js';
+export {
+  RadioGroup,
+  RadioGroupOrientation,
+  RadioGroupDefinition,
+  RadioGroupStyles,
+  RadioGroupTemplate,
+} from './radio-group/index.js';
+export {
+  Slider,
+  SliderMode,
+  SliderOrientation,
+  SliderSize,
+  SliderDefinition,
+  SliderStyles,
+  SliderTemplate,
+} from './slider/index.js';
+export {
+  Spinner,
+  SpinnerAppearance,
+  SpinnerSize,
+  SpinnerTemplate,
+  SpinnerStyles,
+  SpinnerDefinition,
+} from './spinner/index.js';
+export { Switch, SwitchLabelPosition, SwitchDefinition, SwitchStyles, SwitchTemplate } from './switch/index.js';
+export { Tab, TabTemplate, TabStyles, TabDefinition } from './tab/index.js';
+export { TabPanel, TabPanelTemplate, TabPanelStyles, TabPanelDefinition } from './tab-panel/index.js';
+export {
+  Tabs,
+  TabsAppearance,
+  TabsOrientation,
+  TabsSize,
+  TabsTemplate,
+  TabsStyles,
+  TabsDefinition,
+} from './tabs/index.js';
+export {
+  Text,
+  TextAlign,
+  TextFont,
+  TextSize,
+  TextWeight,
+  TextTemplate,
+  TextStyles,
+  TextDefinition,
+} from './text/index.js';
+export {
+  TextInput,
+  TextInputType,
+  TextInputAppearance,
+  TextInputControlSize,
+  TextInputTemplate,
+  TextInputStyles,
+  TextInputDefinition,
+} from './text-input/index.js';
+export {
+  ToggleButton,
+  ToggleButtonAppearance,
+  ToggleButtonShape,
+  ToggleButtonSize,
+  ToggleButtonTemplate,
+  ToggleButtonStyles,
+  ToggleButtonDefinition,
+} from './toggle-button/index.js';
+
+export { getDirection } from './utils/direction.js';
+export { display } from './utils/display.js';
+export {
+  forcedColorsStylesheetBehavior,
+  darkModeStylesheetBehavior,
+  lightModeStylesheetBehavior,
+} from './utils/behaviors/match-media-stylesheet-behavior.js';
+
+export { FluentDesignSystem } from './fluent-design-system.js';
+export { setTheme, setThemeFor } from './theme/index.js';
+
+import * as tokens from './theme/design-tokens.js';
+export { tokens };
diff --git a/packages/web-components/src/index.ts b/packages/web-components/src/index.ts
index 45ba11c214f72d..f0324e14220c68 100644
--- a/packages/web-components/src/index.ts
+++ b/packages/web-components/src/index.ts
@@ -154,6 +154,7 @@ export {
   Spinner,
   SpinnerAppearance,
   SpinnerSize,
+  SpinnerOptions,
   SpinnerTemplate,
   SpinnerStyles,
   SpinnerDefinition,
@@ -242,4 +243,6 @@ export {
 
 export { FluentDesignSystem } from './fluent-design-system.js';
 export { setTheme, setThemeFor } from './theme/index.js';
-export * as tokens from './theme/design-tokens.js';
+
+import * as tokens from './theme/design-tokens.js';
+export { tokens };
diff --git a/packages/web-components/src/spinner/index.ts b/packages/web-components/src/spinner/index.ts
index af6b25e2892ebf..4a41c2def87a11 100644
--- a/packages/web-components/src/spinner/index.ts
+++ b/packages/web-components/src/spinner/index.ts
@@ -1,4 +1,4 @@
-export { Spinner } from './spinner.js';
+export { Spinner, SpinnerOptions } from './spinner.js';
 export { SpinnerAppearance, SpinnerSize } from './spinner.options.js';
 export { template as SpinnerTemplate } from './spinner.template.js';
 export { styles as SpinnerStyles } from './spinner.styles.js';
diff --git a/packages/web-components/src/spinner/spinner.template.ts b/packages/web-components/src/spinner/spinner.template.ts
index 569aeea632f868..32fd8c68654573 100644
--- a/packages/web-components/src/spinner/spinner.template.ts
+++ b/packages/web-components/src/spinner/spinner.template.ts
@@ -1,12 +1,11 @@
 import { html, when } from '@microsoft/fast-element';
 import type { ElementViewTemplate } from '@microsoft/fast-element';
-import { ProgressRingOptions } from '../progress-ring/progress-ring.options.js';
 import { staticallyCompose } from '../utils/index.js';
-import { Spinner } from './spinner.js';
+import { Spinner, SpinnerOptions } from './spinner.js';
 
 const progressSegments: number = 44;
 
-export function progressRingTemplate<T extends Spinner>(options: ProgressRingOptions = {}): ElementViewTemplate<T> {
+export function progressRingTemplate<T extends Spinner>(options: SpinnerOptions = {}): ElementViewTemplate<T> {
   return html<T>`
     <template
       role="progressbar"
diff --git a/packages/web-components/src/spinner/spinner.ts b/packages/web-components/src/spinner/spinner.ts
index 39a88689ae3d00..2820bd4834b2ee 100644
--- a/packages/web-components/src/spinner/spinner.ts
+++ b/packages/web-components/src/spinner/spinner.ts
@@ -1,7 +1,16 @@
 import { attr } from '@microsoft/fast-element';
 import { BaseProgress } from '../progress-bar/base-progress.js';
+import { StaticallyComposableHTML } from '../utils/template-helpers.js';
 import type { SpinnerAppearance, SpinnerSize } from './spinner.options.js';
 
+/**
+ * Progress configuration options
+ * @public
+ */
+export type SpinnerOptions = {
+  indeterminateIndicator?: StaticallyComposableHTML<Spinner>;
+};
+
 /**
  * The base class used for constructing a fluent-spinner custom element
  * @public
diff --git a/packages/web-components/src/text-input/text-input.template.ts b/packages/web-components/src/text-input/text-input.template.ts
index 0c7034d32068f0..8050dea155f979 100644
--- a/packages/web-components/src/text-input/text-input.template.ts
+++ b/packages/web-components/src/text-input/text-input.template.ts
@@ -1,9 +1,9 @@
 import { ElementViewTemplate, html, ref, slotted } from '@microsoft/fast-element';
 import { endSlotTemplate, startSlotTemplate } from '../patterns/index.js';
 import { whitespaceFilter } from '../utils/index.js';
-import type { TextFieldOptions, TextInput } from './text-input.js';
+import type { TextInput, TextInputOptions } from './text-input.js';
 
-export function textFieldTemplate<T extends TextInput>(options: TextFieldOptions = {}): ElementViewTemplate<T> {
+export function textFieldTemplate<T extends TextInput>(options: TextInputOptions = {}): ElementViewTemplate<T> {
   return html<T>`
     <label
       part="label"

From 522ea407141e18fbb664dc57dc3548c0b4c9ec9b Mon Sep 17 00:00:00 2001
From: Christopher Holt <=>
Date: Tue, 23 Apr 2024 12:19:28 -0700
Subject: [PATCH 3/4] export buttonformtarget type

---
 packages/web-components/docs/api-report.md  | 21 ---------------------
 packages/web-components/src/button/index.ts |  9 ++++++++-
 packages/web-components/src/index.ts        |  1 +
 3 files changed, 9 insertions(+), 22 deletions(-)

diff --git a/packages/web-components/docs/api-report.md b/packages/web-components/docs/api-report.md
index 06ac3a8f1bfa7e..ca12cafc9c49ca 100644
--- a/packages/web-components/docs/api-report.md
+++ b/packages/web-components/docs/api-report.md
@@ -1660,27 +1660,6 @@ const curveLinear = "var(--curveLinear)";
 // @public
 export const darkModeStylesheetBehavior: (styles: ElementStyles) => MatchMediaStyleSheetBehavior;
 
-// Warning: (ae-internal-mixed-release-tag) Mixed release tags are not allowed for "DelegatesARIALink" because one of its declarations is marked as @internal
-//
-// @public
-export class DelegatesARIALink {
-    ariaExpanded: 'true' | 'false' | string | null;
-}
-
-// Warning: (ae-forgotten-export) The symbol "ARIAGlobalStatesAndProperties" needs to be exported by the entry point index.d.ts
-//
-// @internal
-export interface DelegatesARIALink extends ARIAGlobalStatesAndProperties {
-}
-
-// @public
-export class DelegatesARIATextbox {
-}
-
-// @public (undocumented)
-export interface DelegatesARIATextbox extends ARIAGlobalStatesAndProperties {
-}
-
 // @public
 export class Dialog extends FASTElement {
     ariaDescribedby?: string;
diff --git a/packages/web-components/src/button/index.ts b/packages/web-components/src/button/index.ts
index b1115c6ca44bc7..a8ea45396709c7 100644
--- a/packages/web-components/src/button/index.ts
+++ b/packages/web-components/src/button/index.ts
@@ -1,5 +1,12 @@
 export { Button } from './button.js';
-export { ButtonAppearance, ButtonShape, ButtonSize, ButtonType, ButtonOptions } from './button.options.js';
+export {
+  ButtonAppearance,
+  ButtonFormTarget,
+  ButtonShape,
+  ButtonSize,
+  ButtonType,
+  ButtonOptions,
+} from './button.options.js';
 export { template as ButtonTemplate } from './button.template.js';
 export { styles as ButtonStyles } from './button.styles.js';
 export { definition as ButtonDefinition } from './button.definition.js';
diff --git a/packages/web-components/src/index.ts b/packages/web-components/src/index.ts
index f0324e14220c68..e1964fe05471d9 100644
--- a/packages/web-components/src/index.ts
+++ b/packages/web-components/src/index.ts
@@ -49,6 +49,7 @@ export {
 export {
   Button,
   ButtonAppearance,
+  ButtonFormTarget,
   ButtonShape,
   ButtonSize,
   ButtonType,

From 9b2f0209e3112dc30984acaea3261338e8444cf7 Mon Sep 17 00:00:00 2001
From: Christopher Holt <=>
Date: Thu, 25 Apr 2024 11:58:10 -0700
Subject: [PATCH 4/4] fixup export of tokens

---
 packages/web-components/docs/api-report.md  | 1208 +++++++------------
 packages/web-components/src/index-rollup.ts |    3 +-
 packages/web-components/src/index.ts        |    3 +-
 3 files changed, 437 insertions(+), 777 deletions(-)

diff --git a/packages/web-components/docs/api-report.md b/packages/web-components/docs/api-report.md
index ca12cafc9c49ca..39dce2abc5cc98 100644
--- a/packages/web-components/docs/api-report.md
+++ b/packages/web-components/docs/api-report.md
@@ -5,6 +5,7 @@
 ```ts
 
 import type { Constructable } from '@microsoft/fast-element';
+import { CSSDirective } from '@microsoft/fast-element';
 import { Direction } from '@microsoft/fast-web-utilities';
 import { ElementStyles } from '@microsoft/fast-element';
 import { ElementViewTemplate } from '@microsoft/fast-element';
@@ -426,22 +427,22 @@ export const BadgeStyles: ElementStyles;
 export const BadgeTemplate: ElementViewTemplate<Badge>;
 
 // @public (undocumented)
-const borderRadiusCircular = "var(--borderRadiusCircular)";
+export const borderRadiusCircular = "var(--borderRadiusCircular)";
 
 // @public (undocumented)
-const borderRadiusLarge = "var(--borderRadiusLarge)";
+export const borderRadiusLarge = "var(--borderRadiusLarge)";
 
 // @public (undocumented)
-const borderRadiusMedium = "var(--borderRadiusMedium)";
+export const borderRadiusMedium = "var(--borderRadiusMedium)";
 
 // @public (undocumented)
-const borderRadiusNone = "var(--borderRadiusNone)";
+export const borderRadiusNone = "var(--borderRadiusNone)";
 
 // @public (undocumented)
-const borderRadiusSmall = "var(--borderRadiusSmall)";
+export const borderRadiusSmall = "var(--borderRadiusSmall)";
 
 // @public (undocumented)
-const borderRadiusXLarge = "var(--borderRadiusXLarge)";
+export const borderRadiusXLarge = "var(--borderRadiusXLarge)";
 
 // Warning: (ae-internal-mixed-release-tag) Mixed release tags are not allowed for "Button" because one of its declarations is marked as @internal
 //
@@ -616,895 +617,895 @@ export const CheckboxStyles: ElementStyles;
 export const CheckboxTemplate: ElementViewTemplate<Checkbox>;
 
 // @public (undocumented)
-const colorBackgroundOverlay = "var(--colorBackgroundOverlay)";
+export const colorBackgroundOverlay = "var(--colorBackgroundOverlay)";
 
 // @public (undocumented)
-const colorBrandBackground = "var(--colorBrandBackground)";
+export const colorBrandBackground = "var(--colorBrandBackground)";
 
 // @public (undocumented)
-const colorBrandBackground2 = "var(--colorBrandBackground2)";
+export const colorBrandBackground2 = "var(--colorBrandBackground2)";
 
 // @public (undocumented)
-const colorBrandBackgroundHover = "var(--colorBrandBackgroundHover)";
+export const colorBrandBackgroundHover = "var(--colorBrandBackgroundHover)";
 
 // @public (undocumented)
-const colorBrandBackgroundInverted = "var(--colorBrandBackgroundInverted)";
+export const colorBrandBackgroundInverted = "var(--colorBrandBackgroundInverted)";
 
 // @public (undocumented)
-const colorBrandBackgroundInvertedHover = "var(--colorBrandBackgroundInvertedHover)";
+export const colorBrandBackgroundInvertedHover = "var(--colorBrandBackgroundInvertedHover)";
 
 // @public (undocumented)
-const colorBrandBackgroundInvertedPressed = "var(--colorBrandBackgroundInvertedPressed)";
+export const colorBrandBackgroundInvertedPressed = "var(--colorBrandBackgroundInvertedPressed)";
 
 // @public (undocumented)
-const colorBrandBackgroundInvertedSelected = "var(--colorBrandBackgroundInvertedSelected)";
+export const colorBrandBackgroundInvertedSelected = "var(--colorBrandBackgroundInvertedSelected)";
 
 // @public (undocumented)
-const colorBrandBackgroundPressed = "var(--colorBrandBackgroundPressed)";
+export const colorBrandBackgroundPressed = "var(--colorBrandBackgroundPressed)";
 
 // @public (undocumented)
-const colorBrandBackgroundSelected = "var(--colorBrandBackgroundSelected)";
+export const colorBrandBackgroundSelected = "var(--colorBrandBackgroundSelected)";
 
 // @public (undocumented)
-const colorBrandBackgroundStatic = "var(--colorBrandBackgroundStatic)";
+export const colorBrandBackgroundStatic = "var(--colorBrandBackgroundStatic)";
 
 // @public (undocumented)
-const colorBrandForeground1 = "var(--colorBrandForeground1)";
+export const colorBrandForeground1 = "var(--colorBrandForeground1)";
 
 // @public (undocumented)
-const colorBrandForeground2 = "var(--colorBrandForeground2)";
+export const colorBrandForeground2 = "var(--colorBrandForeground2)";
 
 // @public (undocumented)
-const colorBrandForegroundInverted = "var(--colorBrandForegroundInverted)";
+export const colorBrandForegroundInverted = "var(--colorBrandForegroundInverted)";
 
 // @public (undocumented)
-const colorBrandForegroundInvertedHover = "var(--colorBrandForegroundInvertedHover)";
+export const colorBrandForegroundInvertedHover = "var(--colorBrandForegroundInvertedHover)";
 
 // @public (undocumented)
-const colorBrandForegroundInvertedPressed = "var(--colorBrandForegroundInvertedPressed)";
+export const colorBrandForegroundInvertedPressed = "var(--colorBrandForegroundInvertedPressed)";
 
 // @public (undocumented)
-const colorBrandForegroundLink = "var(--colorBrandForegroundLink)";
+export const colorBrandForegroundLink = "var(--colorBrandForegroundLink)";
 
 // @public (undocumented)
-const colorBrandForegroundLinkHover = "var(--colorBrandForegroundLinkHover)";
+export const colorBrandForegroundLinkHover = "var(--colorBrandForegroundLinkHover)";
 
 // @public (undocumented)
-const colorBrandForegroundLinkPressed = "var(--colorBrandForegroundLinkPressed)";
+export const colorBrandForegroundLinkPressed = "var(--colorBrandForegroundLinkPressed)";
 
 // @public (undocumented)
-const colorBrandForegroundLinkSelected = "var(--colorBrandForegroundLinkSelected)";
+export const colorBrandForegroundLinkSelected = "var(--colorBrandForegroundLinkSelected)";
 
 // @public (undocumented)
-const colorBrandForegroundOnLight = "var(--colorBrandForegroundOnLight)";
+export const colorBrandForegroundOnLight = "var(--colorBrandForegroundOnLight)";
 
 // @public (undocumented)
-const colorBrandForegroundOnLightHover = "var(--colorBrandForegroundOnLightHover)";
+export const colorBrandForegroundOnLightHover = "var(--colorBrandForegroundOnLightHover)";
 
 // @public (undocumented)
-const colorBrandForegroundOnLightPressed = "var(--colorBrandForegroundOnLightPressed)";
+export const colorBrandForegroundOnLightPressed = "var(--colorBrandForegroundOnLightPressed)";
 
 // @public (undocumented)
-const colorBrandForegroundOnLightSelected = "var(--colorBrandForegroundOnLightSelected)";
+export const colorBrandForegroundOnLightSelected = "var(--colorBrandForegroundOnLightSelected)";
 
 // @public (undocumented)
-const colorBrandShadowAmbient = "var(--colorBrandShadowAmbient)";
+export const colorBrandShadowAmbient = "var(--colorBrandShadowAmbient)";
 
 // @public (undocumented)
-const colorBrandShadowKey = "var(--colorBrandShadowKey)";
+export const colorBrandShadowKey = "var(--colorBrandShadowKey)";
 
 // @public (undocumented)
-const colorBrandStroke1 = "var(--colorBrandStroke1)";
+export const colorBrandStroke1 = "var(--colorBrandStroke1)";
 
 // @public (undocumented)
-const colorBrandStroke2 = "var(--colorBrandStroke2)";
+export const colorBrandStroke2 = "var(--colorBrandStroke2)";
 
 // @public (undocumented)
-const colorCompoundBrandBackground = "var(--colorCompoundBrandBackground)";
+export const colorCompoundBrandBackground = "var(--colorCompoundBrandBackground)";
 
 // @public (undocumented)
-const colorCompoundBrandBackgroundHover = "var(--colorCompoundBrandBackgroundHover)";
+export const colorCompoundBrandBackgroundHover = "var(--colorCompoundBrandBackgroundHover)";
 
 // @public (undocumented)
-const colorCompoundBrandBackgroundPressed = "var(--colorCompoundBrandBackgroundPressed)";
+export const colorCompoundBrandBackgroundPressed = "var(--colorCompoundBrandBackgroundPressed)";
 
 // @public (undocumented)
-const colorCompoundBrandForeground1 = "var(--colorCompoundBrandForeground1)";
+export const colorCompoundBrandForeground1 = "var(--colorCompoundBrandForeground1)";
 
 // @public (undocumented)
-const colorCompoundBrandForeground1Hover = "var(--colorCompoundBrandForeground1Hover)";
+export const colorCompoundBrandForeground1Hover = "var(--colorCompoundBrandForeground1Hover)";
 
 // @public (undocumented)
-const colorCompoundBrandForeground1Pressed = "var(--colorCompoundBrandForeground1Pressed)";
+export const colorCompoundBrandForeground1Pressed = "var(--colorCompoundBrandForeground1Pressed)";
 
 // @public (undocumented)
-const colorCompoundBrandStroke = "var(--colorCompoundBrandStroke)";
+export const colorCompoundBrandStroke = "var(--colorCompoundBrandStroke)";
 
 // @public (undocumented)
-const colorCompoundBrandStrokeHover = "var(--colorCompoundBrandStrokeHover)";
+export const colorCompoundBrandStrokeHover = "var(--colorCompoundBrandStrokeHover)";
 
 // @public (undocumented)
-const colorCompoundBrandStrokePressed = "var(--colorCompoundBrandStrokePressed)";
+export const colorCompoundBrandStrokePressed = "var(--colorCompoundBrandStrokePressed)";
 
 // @public (undocumented)
-const colorNeutralBackground1 = "var(--colorNeutralBackground1)";
+export const colorNeutralBackground1 = "var(--colorNeutralBackground1)";
 
 // @public (undocumented)
-const colorNeutralBackground1Hover = "var(--colorNeutralBackground1Hover)";
+export const colorNeutralBackground1Hover = "var(--colorNeutralBackground1Hover)";
 
 // @public (undocumented)
-const colorNeutralBackground1Pressed = "var(--colorNeutralBackground1Pressed)";
+export const colorNeutralBackground1Pressed = "var(--colorNeutralBackground1Pressed)";
 
 // @public (undocumented)
-const colorNeutralBackground1Selected = "var(--colorNeutralBackground1Selected)";
+export const colorNeutralBackground1Selected = "var(--colorNeutralBackground1Selected)";
 
 // @public (undocumented)
-const colorNeutralBackground2 = "var(--colorNeutralBackground2)";
+export const colorNeutralBackground2 = "var(--colorNeutralBackground2)";
 
 // @public (undocumented)
-const colorNeutralBackground2Hover = "var(--colorNeutralBackground2Hover)";
+export const colorNeutralBackground2Hover = "var(--colorNeutralBackground2Hover)";
 
 // @public (undocumented)
-const colorNeutralBackground2Pressed = "var(--colorNeutralBackground2Pressed)";
+export const colorNeutralBackground2Pressed = "var(--colorNeutralBackground2Pressed)";
 
 // @public (undocumented)
-const colorNeutralBackground2Selected = "var(--colorNeutralBackground2Selected)";
+export const colorNeutralBackground2Selected = "var(--colorNeutralBackground2Selected)";
 
 // @public (undocumented)
-const colorNeutralBackground3 = "var(--colorNeutralBackground3)";
+export const colorNeutralBackground3 = "var(--colorNeutralBackground3)";
 
 // @public (undocumented)
-const colorNeutralBackground3Hover = "var(--colorNeutralBackground3Hover)";
+export const colorNeutralBackground3Hover = "var(--colorNeutralBackground3Hover)";
 
 // @public (undocumented)
-const colorNeutralBackground3Pressed = "var(--colorNeutralBackground3Pressed)";
+export const colorNeutralBackground3Pressed = "var(--colorNeutralBackground3Pressed)";
 
 // @public (undocumented)
-const colorNeutralBackground3Selected = "var(--colorNeutralBackground3Selected)";
+export const colorNeutralBackground3Selected = "var(--colorNeutralBackground3Selected)";
 
 // @public (undocumented)
-const colorNeutralBackground4 = "var(--colorNeutralBackground4)";
+export const colorNeutralBackground4 = "var(--colorNeutralBackground4)";
 
 // @public (undocumented)
-const colorNeutralBackground4Hover = "var(--colorNeutralBackground4Hover)";
+export const colorNeutralBackground4Hover = "var(--colorNeutralBackground4Hover)";
 
 // @public (undocumented)
-const colorNeutralBackground4Pressed = "var(--colorNeutralBackground4Pressed)";
+export const colorNeutralBackground4Pressed = "var(--colorNeutralBackground4Pressed)";
 
 // @public (undocumented)
-const colorNeutralBackground4Selected = "var(--colorNeutralBackground4Selected)";
+export const colorNeutralBackground4Selected = "var(--colorNeutralBackground4Selected)";
 
 // @public (undocumented)
-const colorNeutralBackground5 = "var(--colorNeutralBackground5)";
+export const colorNeutralBackground5 = "var(--colorNeutralBackground5)";
 
 // @public (undocumented)
-const colorNeutralBackground5Hover = "var(--colorNeutralBackground5Hover)";
+export const colorNeutralBackground5Hover = "var(--colorNeutralBackground5Hover)";
 
 // @public (undocumented)
-const colorNeutralBackground5Pressed = "var(--colorNeutralBackground5Pressed)";
+export const colorNeutralBackground5Pressed = "var(--colorNeutralBackground5Pressed)";
 
 // @public (undocumented)
-const colorNeutralBackground5Selected = "var(--colorNeutralBackground5Selected)";
+export const colorNeutralBackground5Selected = "var(--colorNeutralBackground5Selected)";
 
 // @public (undocumented)
-const colorNeutralBackground6 = "var(--colorNeutralBackground6)";
+export const colorNeutralBackground6 = "var(--colorNeutralBackground6)";
 
 // @public (undocumented)
-const colorNeutralBackgroundDisabled = "var(--colorNeutralBackgroundDisabled)";
+export const colorNeutralBackgroundDisabled = "var(--colorNeutralBackgroundDisabled)";
 
 // @public (undocumented)
-const colorNeutralBackgroundInverted = "var(--colorNeutralBackgroundInverted)";
+export const colorNeutralBackgroundInverted = "var(--colorNeutralBackgroundInverted)";
 
 // @public (undocumented)
-const colorNeutralBackgroundInvertedDisabled = "var(--colorNeutralBackgroundInvertedDisabled)";
+export const colorNeutralBackgroundInvertedDisabled = "var(--colorNeutralBackgroundInvertedDisabled)";
 
 // @public (undocumented)
-const colorNeutralBackgroundStatic = "var(--colorNeutralBackgroundStatic)";
+export const colorNeutralBackgroundStatic = "var(--colorNeutralBackgroundStatic)";
 
 // @public (undocumented)
-const colorNeutralForeground1 = "var(--colorNeutralForeground1)";
+export const colorNeutralForeground1 = "var(--colorNeutralForeground1)";
 
 // @public (undocumented)
-const colorNeutralForeground1Hover = "var(--colorNeutralForeground1Hover)";
+export const colorNeutralForeground1Hover = "var(--colorNeutralForeground1Hover)";
 
 // @public (undocumented)
-const colorNeutralForeground1Pressed = "var(--colorNeutralForeground1Pressed)";
+export const colorNeutralForeground1Pressed = "var(--colorNeutralForeground1Pressed)";
 
 // @public (undocumented)
-const colorNeutralForeground1Selected = "var(--colorNeutralForeground1Selected)";
+export const colorNeutralForeground1Selected = "var(--colorNeutralForeground1Selected)";
 
 // @public (undocumented)
-const colorNeutralForeground1Static = "var(--colorNeutralForeground1Static)";
+export const colorNeutralForeground1Static = "var(--colorNeutralForeground1Static)";
 
 // @public (undocumented)
-const colorNeutralForeground2 = "var(--colorNeutralForeground2)";
+export const colorNeutralForeground2 = "var(--colorNeutralForeground2)";
 
 // @public (undocumented)
-const colorNeutralForeground2BrandHover = "var(--colorNeutralForeground2BrandHover)";
+export const colorNeutralForeground2BrandHover = "var(--colorNeutralForeground2BrandHover)";
 
 // @public (undocumented)
-const colorNeutralForeground2BrandPressed = "var(--colorNeutralForeground2BrandPressed)";
+export const colorNeutralForeground2BrandPressed = "var(--colorNeutralForeground2BrandPressed)";
 
 // @public (undocumented)
-const colorNeutralForeground2BrandSelected = "var(--colorNeutralForeground2BrandSelected)";
+export const colorNeutralForeground2BrandSelected = "var(--colorNeutralForeground2BrandSelected)";
 
 // @public (undocumented)
-const colorNeutralForeground2Hover = "var(--colorNeutralForeground2Hover)";
+export const colorNeutralForeground2Hover = "var(--colorNeutralForeground2Hover)";
 
 // @public (undocumented)
-const colorNeutralForeground2Link = "var(--colorNeutralForeground2Link)";
+export const colorNeutralForeground2Link = "var(--colorNeutralForeground2Link)";
 
 // @public (undocumented)
-const colorNeutralForeground2LinkHover = "var(--colorNeutralForeground2LinkHover)";
+export const colorNeutralForeground2LinkHover = "var(--colorNeutralForeground2LinkHover)";
 
 // @public (undocumented)
-const colorNeutralForeground2LinkPressed = "var(--colorNeutralForeground2LinkPressed)";
+export const colorNeutralForeground2LinkPressed = "var(--colorNeutralForeground2LinkPressed)";
 
 // @public (undocumented)
-const colorNeutralForeground2LinkSelected = "var(--colorNeutralForeground2LinkSelected)";
+export const colorNeutralForeground2LinkSelected = "var(--colorNeutralForeground2LinkSelected)";
 
 // @public (undocumented)
-const colorNeutralForeground2Pressed = "var(--colorNeutralForeground2Pressed)";
+export const colorNeutralForeground2Pressed = "var(--colorNeutralForeground2Pressed)";
 
 // @public (undocumented)
-const colorNeutralForeground2Selected = "var(--colorNeutralForeground2Selected)";
+export const colorNeutralForeground2Selected = "var(--colorNeutralForeground2Selected)";
 
 // @public (undocumented)
-const colorNeutralForeground3 = "var(--colorNeutralForeground3)";
+export const colorNeutralForeground3 = "var(--colorNeutralForeground3)";
 
 // @public (undocumented)
-const colorNeutralForeground3BrandHover = "var(--colorNeutralForeground3BrandHover)";
+export const colorNeutralForeground3BrandHover = "var(--colorNeutralForeground3BrandHover)";
 
 // @public (undocumented)
-const colorNeutralForeground3BrandPressed = "var(--colorNeutralForeground3BrandPressed)";
+export const colorNeutralForeground3BrandPressed = "var(--colorNeutralForeground3BrandPressed)";
 
 // @public (undocumented)
-const colorNeutralForeground3BrandSelected = "var(--colorNeutralForeground3BrandSelected)";
+export const colorNeutralForeground3BrandSelected = "var(--colorNeutralForeground3BrandSelected)";
 
 // @public (undocumented)
-const colorNeutralForeground3Hover = "var(--colorNeutralForeground3Hover)";
+export const colorNeutralForeground3Hover = "var(--colorNeutralForeground3Hover)";
 
 // @public (undocumented)
-const colorNeutralForeground3Pressed = "var(--colorNeutralForeground3Pressed)";
+export const colorNeutralForeground3Pressed = "var(--colorNeutralForeground3Pressed)";
 
 // @public (undocumented)
-const colorNeutralForeground3Selected = "var(--colorNeutralForeground3Selected)";
+export const colorNeutralForeground3Selected = "var(--colorNeutralForeground3Selected)";
 
 // @public (undocumented)
-const colorNeutralForeground4 = "var(--colorNeutralForeground4)";
+export const colorNeutralForeground4 = "var(--colorNeutralForeground4)";
 
 // @public (undocumented)
-const colorNeutralForegroundDisabled = "var(--colorNeutralForegroundDisabled)";
+export const colorNeutralForegroundDisabled = "var(--colorNeutralForegroundDisabled)";
 
 // @public (undocumented)
-const colorNeutralForegroundInverted = "var(--colorNeutralForegroundInverted)";
+export const colorNeutralForegroundInverted = "var(--colorNeutralForegroundInverted)";
 
 // @public (undocumented)
-const colorNeutralForegroundInverted2 = "var(--colorNeutralForegroundInverted2)";
+export const colorNeutralForegroundInverted2 = "var(--colorNeutralForegroundInverted2)";
 
 // @public (undocumented)
-const colorNeutralForegroundInvertedDisabled = "var(--colorNeutralForegroundInvertedDisabled)";
+export const colorNeutralForegroundInvertedDisabled = "var(--colorNeutralForegroundInvertedDisabled)";
 
 // @public (undocumented)
-const colorNeutralForegroundInvertedHover = "var(--colorNeutralForegroundInvertedHover)";
+export const colorNeutralForegroundInvertedHover = "var(--colorNeutralForegroundInvertedHover)";
 
 // @public (undocumented)
-const colorNeutralForegroundInvertedLink = "var(--colorNeutralForegroundInvertedLink)";
+export const colorNeutralForegroundInvertedLink = "var(--colorNeutralForegroundInvertedLink)";
 
 // @public (undocumented)
-const colorNeutralForegroundInvertedLinkHover = "var(--colorNeutralForegroundInvertedLinkHover)";
+export const colorNeutralForegroundInvertedLinkHover = "var(--colorNeutralForegroundInvertedLinkHover)";
 
 // @public (undocumented)
-const colorNeutralForegroundInvertedLinkPressed = "var(--colorNeutralForegroundInvertedLinkPressed)";
+export const colorNeutralForegroundInvertedLinkPressed = "var(--colorNeutralForegroundInvertedLinkPressed)";
 
 // @public (undocumented)
-const colorNeutralForegroundInvertedLinkSelected = "var(--colorNeutralForegroundInvertedLinkSelected)";
+export const colorNeutralForegroundInvertedLinkSelected = "var(--colorNeutralForegroundInvertedLinkSelected)";
 
 // @public (undocumented)
-const colorNeutralForegroundInvertedPressed = "var(--colorNeutralForegroundInvertedPressed)";
+export const colorNeutralForegroundInvertedPressed = "var(--colorNeutralForegroundInvertedPressed)";
 
 // @public (undocumented)
-const colorNeutralForegroundInvertedSelected = "var(--colorNeutralForegroundInvertedSelected)";
+export const colorNeutralForegroundInvertedSelected = "var(--colorNeutralForegroundInvertedSelected)";
 
 // @public (undocumented)
-const colorNeutralForegroundOnBrand = "var(--colorNeutralForegroundOnBrand)";
+export const colorNeutralForegroundOnBrand = "var(--colorNeutralForegroundOnBrand)";
 
 // @public (undocumented)
-const colorNeutralForegroundStaticInverted = "var(--colorNeutralForegroundStaticInverted)";
+export const colorNeutralForegroundStaticInverted = "var(--colorNeutralForegroundStaticInverted)";
 
 // @public (undocumented)
-const colorNeutralShadowAmbient = "var(--colorNeutralShadowAmbient)";
+export const colorNeutralShadowAmbient = "var(--colorNeutralShadowAmbient)";
 
 // @public (undocumented)
-const colorNeutralShadowAmbientDarker = "var(--colorNeutralShadowAmbientDarker)";
+export const colorNeutralShadowAmbientDarker = "var(--colorNeutralShadowAmbientDarker)";
 
 // @public (undocumented)
-const colorNeutralShadowAmbientLighter = "var(--colorNeutralShadowAmbientLighter)";
+export const colorNeutralShadowAmbientLighter = "var(--colorNeutralShadowAmbientLighter)";
 
 // @public (undocumented)
-const colorNeutralShadowKey = "var(--colorNeutralShadowKey)";
+export const colorNeutralShadowKey = "var(--colorNeutralShadowKey)";
 
 // @public (undocumented)
-const colorNeutralShadowKeyDarker = "var(--colorNeutralShadowKeyDarker)";
+export const colorNeutralShadowKeyDarker = "var(--colorNeutralShadowKeyDarker)";
 
 // @public (undocumented)
-const colorNeutralShadowKeyLighter = "var(--colorNeutralShadowKeyLighter)";
+export const colorNeutralShadowKeyLighter = "var(--colorNeutralShadowKeyLighter)";
 
 // @public (undocumented)
-const colorNeutralStencil1 = "var(--colorNeutralStencil1)";
+export const colorNeutralStencil1 = "var(--colorNeutralStencil1)";
 
 // @public (undocumented)
-const colorNeutralStencil1Alpha = "var(--colorNeutralStencil1Alpha)";
+export const colorNeutralStencil1Alpha = "var(--colorNeutralStencil1Alpha)";
 
 // @public (undocumented)
-const colorNeutralStencil2 = "var(--colorNeutralStencil2)";
+export const colorNeutralStencil2 = "var(--colorNeutralStencil2)";
 
 // @public (undocumented)
-const colorNeutralStencil2Alpha = "var(--colorNeutralStencil2Alpha)";
+export const colorNeutralStencil2Alpha = "var(--colorNeutralStencil2Alpha)";
 
 // @public (undocumented)
-const colorNeutralStroke1 = "var(--colorNeutralStroke1)";
+export const colorNeutralStroke1 = "var(--colorNeutralStroke1)";
 
 // @public (undocumented)
-const colorNeutralStroke1Hover = "var(--colorNeutralStroke1Hover)";
+export const colorNeutralStroke1Hover = "var(--colorNeutralStroke1Hover)";
 
 // @public (undocumented)
-const colorNeutralStroke1Pressed = "var(--colorNeutralStroke1Pressed)";
+export const colorNeutralStroke1Pressed = "var(--colorNeutralStroke1Pressed)";
 
 // @public (undocumented)
-const colorNeutralStroke1Selected = "var(--colorNeutralStroke1Selected)";
+export const colorNeutralStroke1Selected = "var(--colorNeutralStroke1Selected)";
 
 // @public (undocumented)
-const colorNeutralStroke2 = "var(--colorNeutralStroke2)";
+export const colorNeutralStroke2 = "var(--colorNeutralStroke2)";
 
 // @public (undocumented)
-const colorNeutralStroke3 = "var(--colorNeutralStroke3)";
+export const colorNeutralStroke3 = "var(--colorNeutralStroke3)";
 
 // @public (undocumented)
-const colorNeutralStrokeAccessible = "var(--colorNeutralStrokeAccessible)";
+export const colorNeutralStrokeAccessible = "var(--colorNeutralStrokeAccessible)";
 
 // @public (undocumented)
-const colorNeutralStrokeAccessibleHover = "var(--colorNeutralStrokeAccessibleHover)";
+export const colorNeutralStrokeAccessibleHover = "var(--colorNeutralStrokeAccessibleHover)";
 
 // @public (undocumented)
-const colorNeutralStrokeAccessiblePressed = "var(--colorNeutralStrokeAccessiblePressed)";
+export const colorNeutralStrokeAccessiblePressed = "var(--colorNeutralStrokeAccessiblePressed)";
 
 // @public (undocumented)
-const colorNeutralStrokeAccessibleSelected = "var(--colorNeutralStrokeAccessibleSelected)";
+export const colorNeutralStrokeAccessibleSelected = "var(--colorNeutralStrokeAccessibleSelected)";
 
 // @public (undocumented)
-const colorNeutralStrokeDisabled = "var(--colorNeutralStrokeDisabled)";
+export const colorNeutralStrokeDisabled = "var(--colorNeutralStrokeDisabled)";
 
 // @public (undocumented)
-const colorNeutralStrokeInvertedDisabled = "var(--colorNeutralStrokeInvertedDisabled)";
+export const colorNeutralStrokeInvertedDisabled = "var(--colorNeutralStrokeInvertedDisabled)";
 
 // @public (undocumented)
-const colorNeutralStrokeOnBrand = "var(--colorNeutralStrokeOnBrand)";
+export const colorNeutralStrokeOnBrand = "var(--colorNeutralStrokeOnBrand)";
 
 // @public (undocumented)
-const colorNeutralStrokeOnBrand2 = "var(--colorNeutralStrokeOnBrand2)";
+export const colorNeutralStrokeOnBrand2 = "var(--colorNeutralStrokeOnBrand2)";
 
 // @public (undocumented)
-const colorNeutralStrokeOnBrand2Hover = "var(--colorNeutralStrokeOnBrand2Hover)";
+export const colorNeutralStrokeOnBrand2Hover = "var(--colorNeutralStrokeOnBrand2Hover)";
 
 // @public (undocumented)
-const colorNeutralStrokeOnBrand2Pressed = "var(--colorNeutralStrokeOnBrand2Pressed)";
+export const colorNeutralStrokeOnBrand2Pressed = "var(--colorNeutralStrokeOnBrand2Pressed)";
 
 // @public (undocumented)
-const colorNeutralStrokeOnBrand2Selected = "var(--colorNeutralStrokeOnBrand2Selected)";
+export const colorNeutralStrokeOnBrand2Selected = "var(--colorNeutralStrokeOnBrand2Selected)";
 
 // @public (undocumented)
-const colorPaletteAnchorBackground2 = "var(--colorPaletteAnchorBackground2)";
+export const colorPaletteAnchorBackground2 = "var(--colorPaletteAnchorBackground2)";
 
 // @public (undocumented)
-const colorPaletteAnchorBorderActive = "var(--colorPaletteAnchorBorderActive)";
+export const colorPaletteAnchorBorderActive = "var(--colorPaletteAnchorBorderActive)";
 
 // @public (undocumented)
-const colorPaletteAnchorForeground2 = "var(--colorPaletteAnchorForeground2)";
+export const colorPaletteAnchorForeground2 = "var(--colorPaletteAnchorForeground2)";
 
 // @public (undocumented)
-const colorPaletteBeigeBackground2 = "var(--colorPaletteBeigeBackground2)";
+export const colorPaletteBeigeBackground2 = "var(--colorPaletteBeigeBackground2)";
 
 // @public (undocumented)
-const colorPaletteBeigeBorderActive = "var(--colorPaletteBeigeBorderActive)";
+export const colorPaletteBeigeBorderActive = "var(--colorPaletteBeigeBorderActive)";
 
 // @public (undocumented)
-const colorPaletteBeigeForeground2 = "var(--colorPaletteBeigeForeground2)";
+export const colorPaletteBeigeForeground2 = "var(--colorPaletteBeigeForeground2)";
 
 // @public (undocumented)
-const colorPaletteBerryBackground1 = "var(--colorPaletteBerryBackground1)";
+export const colorPaletteBerryBackground1 = "var(--colorPaletteBerryBackground1)";
 
 // @public (undocumented)
-const colorPaletteBerryBackground2 = "var(--colorPaletteBerryBackground2)";
+export const colorPaletteBerryBackground2 = "var(--colorPaletteBerryBackground2)";
 
 // @public (undocumented)
-const colorPaletteBerryBackground3 = "var(--colorPaletteBerryBackground3)";
+export const colorPaletteBerryBackground3 = "var(--colorPaletteBerryBackground3)";
 
 // @public (undocumented)
-const colorPaletteBerryBorder1 = "var(--colorPaletteBerryBorder1)";
+export const colorPaletteBerryBorder1 = "var(--colorPaletteBerryBorder1)";
 
 // @public (undocumented)
-const colorPaletteBerryBorder2 = "var(--colorPaletteBerryBorder2)";
+export const colorPaletteBerryBorder2 = "var(--colorPaletteBerryBorder2)";
 
 // @public (undocumented)
-const colorPaletteBerryBorderActive = "var(--colorPaletteBerryBorderActive)";
+export const colorPaletteBerryBorderActive = "var(--colorPaletteBerryBorderActive)";
 
 // @public (undocumented)
-const colorPaletteBerryForeground1 = "var(--colorPaletteBerryForeground1)";
+export const colorPaletteBerryForeground1 = "var(--colorPaletteBerryForeground1)";
 
 // @public (undocumented)
-const colorPaletteBerryForeground2 = "var(--colorPaletteBerryForeground2)";
+export const colorPaletteBerryForeground2 = "var(--colorPaletteBerryForeground2)";
 
 // @public (undocumented)
-const colorPaletteBerryForeground3 = "var(--colorPaletteBerryForeground3)";
+export const colorPaletteBerryForeground3 = "var(--colorPaletteBerryForeground3)";
 
 // @public (undocumented)
-const colorPaletteBlueBackground2 = "var(--colorPaletteBlueBackground2)";
+export const colorPaletteBlueBackground2 = "var(--colorPaletteBlueBackground2)";
 
 // @public (undocumented)
-const colorPaletteBlueBorderActive = "var(--colorPaletteBlueBorderActive)";
+export const colorPaletteBlueBorderActive = "var(--colorPaletteBlueBorderActive)";
 
 // @public (undocumented)
-const colorPaletteBlueForeground2 = "var(--colorPaletteBlueForeground2)";
+export const colorPaletteBlueForeground2 = "var(--colorPaletteBlueForeground2)";
 
 // @public (undocumented)
-const colorPaletteBrassBackground2 = "var(--colorPaletteBrassBackground2)";
+export const colorPaletteBrassBackground2 = "var(--colorPaletteBrassBackground2)";
 
 // @public (undocumented)
-const colorPaletteBrassBorderActive = "var(--colorPaletteBrassBorderActive)";
+export const colorPaletteBrassBorderActive = "var(--colorPaletteBrassBorderActive)";
 
 // @public (undocumented)
-const colorPaletteBrassForeground2 = "var(--colorPaletteBrassForeground2)";
+export const colorPaletteBrassForeground2 = "var(--colorPaletteBrassForeground2)";
 
 // @public (undocumented)
-const colorPaletteBrownBackground2 = "var(--colorPaletteBrownBackground2)";
+export const colorPaletteBrownBackground2 = "var(--colorPaletteBrownBackground2)";
 
 // @public (undocumented)
-const colorPaletteBrownBorderActive = "var(--colorPaletteBrownBorderActive)";
+export const colorPaletteBrownBorderActive = "var(--colorPaletteBrownBorderActive)";
 
 // @public (undocumented)
-const colorPaletteBrownForeground2 = "var(--colorPaletteBrownForeground2)";
+export const colorPaletteBrownForeground2 = "var(--colorPaletteBrownForeground2)";
 
 // @public (undocumented)
-const colorPaletteCornflowerBackground2 = "var(--colorPaletteCornflowerBackground2)";
+export const colorPaletteCornflowerBackground2 = "var(--colorPaletteCornflowerBackground2)";
 
 // @public (undocumented)
-const colorPaletteCornflowerBorderActive = "var(--colorPaletteCornflowerBorderActive)";
+export const colorPaletteCornflowerBorderActive = "var(--colorPaletteCornflowerBorderActive)";
 
 // @public (undocumented)
-const colorPaletteCornflowerForeground2 = "var(--colorPaletteCornflowerForeground2)";
+export const colorPaletteCornflowerForeground2 = "var(--colorPaletteCornflowerForeground2)";
 
 // @public (undocumented)
-const colorPaletteCranberryBackground2 = "var(--colorPaletteCranberryBackground2)";
+export const colorPaletteCranberryBackground2 = "var(--colorPaletteCranberryBackground2)";
 
 // @public (undocumented)
-const colorPaletteCranberryBorderActive = "var(--colorPaletteCranberryBorderActive)";
+export const colorPaletteCranberryBorderActive = "var(--colorPaletteCranberryBorderActive)";
 
 // @public (undocumented)
-const colorPaletteCranberryForeground2 = "var(--colorPaletteCranberryForeground2)";
+export const colorPaletteCranberryForeground2 = "var(--colorPaletteCranberryForeground2)";
 
 // @public (undocumented)
-const colorPaletteDarkGreenBackground2 = "var(--colorPaletteDarkGreenBackground2)";
+export const colorPaletteDarkGreenBackground2 = "var(--colorPaletteDarkGreenBackground2)";
 
 // @public (undocumented)
-const colorPaletteDarkGreenBorderActive = "var(--colorPaletteDarkGreenBorderActive)";
+export const colorPaletteDarkGreenBorderActive = "var(--colorPaletteDarkGreenBorderActive)";
 
 // @public (undocumented)
-const colorPaletteDarkGreenForeground2 = "var(--colorPaletteDarkGreenForeground2)";
+export const colorPaletteDarkGreenForeground2 = "var(--colorPaletteDarkGreenForeground2)";
 
 // @public (undocumented)
-const colorPaletteDarkOrangeBackground1 = "var(--colorPaletteDarkOrangeBackground1)";
+export const colorPaletteDarkOrangeBackground1 = "var(--colorPaletteDarkOrangeBackground1)";
 
 // @public (undocumented)
-const colorPaletteDarkOrangeBackground2 = "var(--colorPaletteDarkOrangeBackground2)";
+export const colorPaletteDarkOrangeBackground2 = "var(--colorPaletteDarkOrangeBackground2)";
 
 // @public (undocumented)
-const colorPaletteDarkOrangeBackground3 = "var(--colorPaletteDarkOrangeBackground3)";
+export const colorPaletteDarkOrangeBackground3 = "var(--colorPaletteDarkOrangeBackground3)";
 
 // @public (undocumented)
-const colorPaletteDarkOrangeBorder1 = "var(--colorPaletteDarkOrangeBorder1)";
+export const colorPaletteDarkOrangeBorder1 = "var(--colorPaletteDarkOrangeBorder1)";
 
 // @public (undocumented)
-const colorPaletteDarkOrangeBorder2 = "var(--colorPaletteDarkOrangeBorder2)";
+export const colorPaletteDarkOrangeBorder2 = "var(--colorPaletteDarkOrangeBorder2)";
 
 // @public (undocumented)
-const colorPaletteDarkOrangeBorderActive = "var(--colorPaletteDarkOrangeBorderActive)";
+export const colorPaletteDarkOrangeBorderActive = "var(--colorPaletteDarkOrangeBorderActive)";
 
 // @public (undocumented)
-const colorPaletteDarkOrangeForeground1 = "var(--colorPaletteDarkOrangeForeground1)";
+export const colorPaletteDarkOrangeForeground1 = "var(--colorPaletteDarkOrangeForeground1)";
 
 // @public (undocumented)
-const colorPaletteDarkOrangeForeground2 = "var(--colorPaletteDarkOrangeForeground2)";
+export const colorPaletteDarkOrangeForeground2 = "var(--colorPaletteDarkOrangeForeground2)";
 
 // @public (undocumented)
-const colorPaletteDarkOrangeForeground3 = "var(--colorPaletteDarkOrangeForeground3)";
+export const colorPaletteDarkOrangeForeground3 = "var(--colorPaletteDarkOrangeForeground3)";
 
 // @public (undocumented)
-const colorPaletteDarkRedBackground2 = "var(--colorPaletteDarkRedBackground2)";
+export const colorPaletteDarkRedBackground2 = "var(--colorPaletteDarkRedBackground2)";
 
 // @public (undocumented)
-const colorPaletteDarkRedBorderActive = "var(--colorPaletteDarkRedBorderActive)";
+export const colorPaletteDarkRedBorderActive = "var(--colorPaletteDarkRedBorderActive)";
 
 // @public (undocumented)
-const colorPaletteDarkRedForeground2 = "var(--colorPaletteDarkRedForeground2)";
+export const colorPaletteDarkRedForeground2 = "var(--colorPaletteDarkRedForeground2)";
 
 // @public (undocumented)
-const colorPaletteForestBackground2 = "var(--colorPaletteForestBackground2)";
+export const colorPaletteForestBackground2 = "var(--colorPaletteForestBackground2)";
 
 // @public (undocumented)
-const colorPaletteForestBorderActive = "var(--colorPaletteForestBorderActive)";
+export const colorPaletteForestBorderActive = "var(--colorPaletteForestBorderActive)";
 
 // @public (undocumented)
-const colorPaletteForestForeground2 = "var(--colorPaletteForestForeground2)";
+export const colorPaletteForestForeground2 = "var(--colorPaletteForestForeground2)";
 
 // @public (undocumented)
-const colorPaletteGoldBackground2 = "var(--colorPaletteGoldBackground2)";
+export const colorPaletteGoldBackground2 = "var(--colorPaletteGoldBackground2)";
 
 // @public (undocumented)
-const colorPaletteGoldBorderActive = "var(--colorPaletteGoldBorderActive)";
+export const colorPaletteGoldBorderActive = "var(--colorPaletteGoldBorderActive)";
 
 // @public (undocumented)
-const colorPaletteGoldForeground2 = "var(--colorPaletteGoldForeground2)";
+export const colorPaletteGoldForeground2 = "var(--colorPaletteGoldForeground2)";
 
 // @public (undocumented)
-const colorPaletteGrapeBackground2 = "var(--colorPaletteGrapeBackground2)";
+export const colorPaletteGrapeBackground2 = "var(--colorPaletteGrapeBackground2)";
 
 // @public (undocumented)
-const colorPaletteGrapeBorderActive = "var(--colorPaletteGrapeBorderActive)";
+export const colorPaletteGrapeBorderActive = "var(--colorPaletteGrapeBorderActive)";
 
 // @public (undocumented)
-const colorPaletteGrapeForeground2 = "var(--colorPaletteGrapeForeground2)";
+export const colorPaletteGrapeForeground2 = "var(--colorPaletteGrapeForeground2)";
 
 // @public (undocumented)
-const colorPaletteGreenBackground1 = "var(--colorPaletteGreenBackground1)";
+export const colorPaletteGreenBackground1 = "var(--colorPaletteGreenBackground1)";
 
 // @public (undocumented)
-const colorPaletteGreenBackground2 = "var(--colorPaletteGreenBackground2)";
+export const colorPaletteGreenBackground2 = "var(--colorPaletteGreenBackground2)";
 
 // @public (undocumented)
-const colorPaletteGreenBackground3 = "var(--colorPaletteGreenBackground3)";
+export const colorPaletteGreenBackground3 = "var(--colorPaletteGreenBackground3)";
 
 // @public (undocumented)
-const colorPaletteGreenBorder1 = "var(--colorPaletteGreenBorder1)";
+export const colorPaletteGreenBorder1 = "var(--colorPaletteGreenBorder1)";
 
 // @public (undocumented)
-const colorPaletteGreenBorder2 = "var(--colorPaletteGreenBorder2)";
+export const colorPaletteGreenBorder2 = "var(--colorPaletteGreenBorder2)";
 
 // @public (undocumented)
-const colorPaletteGreenBorderActive = "var(--colorPaletteGreenBorderActive)";
+export const colorPaletteGreenBorderActive = "var(--colorPaletteGreenBorderActive)";
 
 // @public (undocumented)
-const colorPaletteGreenForeground1 = "var(--colorPaletteGreenForeground1)";
+export const colorPaletteGreenForeground1 = "var(--colorPaletteGreenForeground1)";
 
 // @public (undocumented)
-const colorPaletteGreenForeground2 = "var(--colorPaletteGreenForeground2)";
+export const colorPaletteGreenForeground2 = "var(--colorPaletteGreenForeground2)";
 
 // @public (undocumented)
-const colorPaletteGreenForeground3 = "var(--colorPaletteGreenForeground3)";
+export const colorPaletteGreenForeground3 = "var(--colorPaletteGreenForeground3)";
 
 // @public (undocumented)
-const colorPaletteGreenForegroundInverted = "var(--colorPaletteGreenForegroundInverted)";
+export const colorPaletteGreenForegroundInverted = "var(--colorPaletteGreenForegroundInverted)";
 
 // @public (undocumented)
-const colorPaletteLavenderBackground2 = "var(--colorPaletteLavenderBackground2)";
+export const colorPaletteLavenderBackground2 = "var(--colorPaletteLavenderBackground2)";
 
 // @public (undocumented)
-const colorPaletteLavenderBorderActive = "var(--colorPaletteLavenderBorderActive)";
+export const colorPaletteLavenderBorderActive = "var(--colorPaletteLavenderBorderActive)";
 
 // @public (undocumented)
-const colorPaletteLavenderForeground2 = "var(--colorPaletteLavenderForeground2)";
+export const colorPaletteLavenderForeground2 = "var(--colorPaletteLavenderForeground2)";
 
 // @public (undocumented)
-const colorPaletteLightGreenBackground1 = "var(--colorPaletteLightGreenBackground1)";
+export const colorPaletteLightGreenBackground1 = "var(--colorPaletteLightGreenBackground1)";
 
 // @public (undocumented)
-const colorPaletteLightGreenBackground2 = "var(--colorPaletteLightGreenBackground2)";
+export const colorPaletteLightGreenBackground2 = "var(--colorPaletteLightGreenBackground2)";
 
 // @public (undocumented)
-const colorPaletteLightGreenBackground3 = "var(--colorPaletteLightGreenBackground3)";
+export const colorPaletteLightGreenBackground3 = "var(--colorPaletteLightGreenBackground3)";
 
 // @public (undocumented)
-const colorPaletteLightGreenBorder1 = "var(--colorPaletteLightGreenBorder1)";
+export const colorPaletteLightGreenBorder1 = "var(--colorPaletteLightGreenBorder1)";
 
 // @public (undocumented)
-const colorPaletteLightGreenBorder2 = "var(--colorPaletteLightGreenBorder2)";
+export const colorPaletteLightGreenBorder2 = "var(--colorPaletteLightGreenBorder2)";
 
 // @public (undocumented)
-const colorPaletteLightGreenBorderActive = "var(--colorPaletteLightGreenBorderActive)";
+export const colorPaletteLightGreenBorderActive = "var(--colorPaletteLightGreenBorderActive)";
 
 // @public (undocumented)
-const colorPaletteLightGreenForeground1 = "var(--colorPaletteLightGreenForeground1)";
+export const colorPaletteLightGreenForeground1 = "var(--colorPaletteLightGreenForeground1)";
 
 // @public (undocumented)
-const colorPaletteLightGreenForeground2 = "var(--colorPaletteLightGreenForeground2)";
+export const colorPaletteLightGreenForeground2 = "var(--colorPaletteLightGreenForeground2)";
 
 // @public (undocumented)
-const colorPaletteLightGreenForeground3 = "var(--colorPaletteLightGreenForeground3)";
+export const colorPaletteLightGreenForeground3 = "var(--colorPaletteLightGreenForeground3)";
 
 // @public (undocumented)
-const colorPaletteLightTealBackground2 = "var(--colorPaletteLightTealBackground2)";
+export const colorPaletteLightTealBackground2 = "var(--colorPaletteLightTealBackground2)";
 
 // @public (undocumented)
-const colorPaletteLightTealBorderActive = "var(--colorPaletteLightTealBorderActive)";
+export const colorPaletteLightTealBorderActive = "var(--colorPaletteLightTealBorderActive)";
 
 // @public (undocumented)
-const colorPaletteLightTealForeground2 = "var(--colorPaletteLightTealForeground2)";
+export const colorPaletteLightTealForeground2 = "var(--colorPaletteLightTealForeground2)";
 
 // @public (undocumented)
-const colorPaletteLilacBackground2 = "var(--colorPaletteLilacBackground2)";
+export const colorPaletteLilacBackground2 = "var(--colorPaletteLilacBackground2)";
 
 // @public (undocumented)
-const colorPaletteLilacBorderActive = "var(--colorPaletteLilacBorderActive)";
+export const colorPaletteLilacBorderActive = "var(--colorPaletteLilacBorderActive)";
 
 // @public (undocumented)
-const colorPaletteLilacForeground2 = "var(--colorPaletteLilacForeground2)";
+export const colorPaletteLilacForeground2 = "var(--colorPaletteLilacForeground2)";
 
 // @public (undocumented)
-const colorPaletteMagentaBackground2 = "var(--colorPaletteMagentaBackground2)";
+export const colorPaletteMagentaBackground2 = "var(--colorPaletteMagentaBackground2)";
 
 // @public (undocumented)
-const colorPaletteMagentaBorderActive = "var(--colorPaletteMagentaBorderActive)";
+export const colorPaletteMagentaBorderActive = "var(--colorPaletteMagentaBorderActive)";
 
 // @public (undocumented)
-const colorPaletteMagentaForeground2 = "var(--colorPaletteMagentaForeground2)";
+export const colorPaletteMagentaForeground2 = "var(--colorPaletteMagentaForeground2)";
 
 // @public (undocumented)
-const colorPaletteMarigoldBackground1 = "var(--colorPaletteMarigoldBackground1)";
+export const colorPaletteMarigoldBackground1 = "var(--colorPaletteMarigoldBackground1)";
 
 // @public (undocumented)
-const colorPaletteMarigoldBackground2 = "var(--colorPaletteMarigoldBackground2)";
+export const colorPaletteMarigoldBackground2 = "var(--colorPaletteMarigoldBackground2)";
 
 // @public (undocumented)
-const colorPaletteMarigoldBackground3 = "var(--colorPaletteMarigoldBackground3)";
+export const colorPaletteMarigoldBackground3 = "var(--colorPaletteMarigoldBackground3)";
 
 // @public (undocumented)
-const colorPaletteMarigoldBorder1 = "var(--colorPaletteMarigoldBorder1)";
+export const colorPaletteMarigoldBorder1 = "var(--colorPaletteMarigoldBorder1)";
 
 // @public (undocumented)
-const colorPaletteMarigoldBorder2 = "var(--colorPaletteMarigoldBorder2)";
+export const colorPaletteMarigoldBorder2 = "var(--colorPaletteMarigoldBorder2)";
 
 // @public (undocumented)
-const colorPaletteMarigoldBorderActive = "var(--colorPaletteMarigoldBorderActive)";
+export const colorPaletteMarigoldBorderActive = "var(--colorPaletteMarigoldBorderActive)";
 
 // @public (undocumented)
-const colorPaletteMarigoldForeground1 = "var(--colorPaletteMarigoldForeground1)";
+export const colorPaletteMarigoldForeground1 = "var(--colorPaletteMarigoldForeground1)";
 
 // @public (undocumented)
-const colorPaletteMarigoldForeground2 = "var(--colorPaletteMarigoldForeground2)";
+export const colorPaletteMarigoldForeground2 = "var(--colorPaletteMarigoldForeground2)";
 
 // @public (undocumented)
-const colorPaletteMarigoldForeground3 = "var(--colorPaletteMarigoldForeground3)";
+export const colorPaletteMarigoldForeground3 = "var(--colorPaletteMarigoldForeground3)";
 
 // @public (undocumented)
-const colorPaletteMinkBackground2 = "var(--colorPaletteMinkBackground2)";
+export const colorPaletteMinkBackground2 = "var(--colorPaletteMinkBackground2)";
 
 // @public (undocumented)
-const colorPaletteMinkBorderActive = "var(--colorPaletteMinkBorderActive)";
+export const colorPaletteMinkBorderActive = "var(--colorPaletteMinkBorderActive)";
 
 // @public (undocumented)
-const colorPaletteMinkForeground2 = "var(--colorPaletteMinkForeground2)";
+export const colorPaletteMinkForeground2 = "var(--colorPaletteMinkForeground2)";
 
 // @public (undocumented)
-const colorPaletteNavyBackground2 = "var(--colorPaletteNavyBackground2)";
+export const colorPaletteNavyBackground2 = "var(--colorPaletteNavyBackground2)";
 
 // @public (undocumented)
-const colorPaletteNavyBorderActive = "var(--colorPaletteNavyBorderActive)";
+export const colorPaletteNavyBorderActive = "var(--colorPaletteNavyBorderActive)";
 
 // @public (undocumented)
-const colorPaletteNavyForeground2 = "var(--colorPaletteNavyForeground2)";
+export const colorPaletteNavyForeground2 = "var(--colorPaletteNavyForeground2)";
 
 // @public (undocumented)
-const colorPalettePeachBackground2 = "var(--colorPalettePeachBackground2)";
+export const colorPalettePeachBackground2 = "var(--colorPalettePeachBackground2)";
 
 // @public (undocumented)
-const colorPalettePeachBorderActive = "var(--colorPalettePeachBorderActive)";
+export const colorPalettePeachBorderActive = "var(--colorPalettePeachBorderActive)";
 
 // @public (undocumented)
-const colorPalettePeachForeground2 = "var(--colorPalettePeachForeground2)";
+export const colorPalettePeachForeground2 = "var(--colorPalettePeachForeground2)";
 
 // @public (undocumented)
-const colorPalettePinkBackground2 = "var(--colorPalettePinkBackground2)";
+export const colorPalettePinkBackground2 = "var(--colorPalettePinkBackground2)";
 
 // @public (undocumented)
-const colorPalettePinkBorderActive = "var(--colorPalettePinkBorderActive)";
+export const colorPalettePinkBorderActive = "var(--colorPalettePinkBorderActive)";
 
 // @public (undocumented)
-const colorPalettePinkForeground2 = "var(--colorPalettePinkForeground2)";
+export const colorPalettePinkForeground2 = "var(--colorPalettePinkForeground2)";
 
 // @public (undocumented)
-const colorPalettePlatinumBackground2 = "var(--colorPalettePlatinumBackground2)";
+export const colorPalettePlatinumBackground2 = "var(--colorPalettePlatinumBackground2)";
 
 // @public (undocumented)
-const colorPalettePlatinumBorderActive = "var(--colorPalettePlatinumBorderActive)";
+export const colorPalettePlatinumBorderActive = "var(--colorPalettePlatinumBorderActive)";
 
 // @public (undocumented)
-const colorPalettePlatinumForeground2 = "var(--colorPalettePlatinumForeground2)";
+export const colorPalettePlatinumForeground2 = "var(--colorPalettePlatinumForeground2)";
 
 // @public (undocumented)
-const colorPalettePlumBackground2 = "var(--colorPalettePlumBackground2)";
+export const colorPalettePlumBackground2 = "var(--colorPalettePlumBackground2)";
 
 // @public (undocumented)
-const colorPalettePlumBorderActive = "var(--colorPalettePlumBorderActive)";
+export const colorPalettePlumBorderActive = "var(--colorPalettePlumBorderActive)";
 
 // @public (undocumented)
-const colorPalettePlumForeground2 = "var(--colorPalettePlumForeground2)";
+export const colorPalettePlumForeground2 = "var(--colorPalettePlumForeground2)";
 
 // @public (undocumented)
-const colorPalettePumpkinBackground2 = "var(--colorPalettePumpkinBackground2)";
+export const colorPalettePumpkinBackground2 = "var(--colorPalettePumpkinBackground2)";
 
 // @public (undocumented)
-const colorPalettePumpkinBorderActive = "var(--colorPalettePumpkinBorderActive)";
+export const colorPalettePumpkinBorderActive = "var(--colorPalettePumpkinBorderActive)";
 
 // @public (undocumented)
-const colorPalettePumpkinForeground2 = "var(--colorPalettePumpkinForeground2)";
+export const colorPalettePumpkinForeground2 = "var(--colorPalettePumpkinForeground2)";
 
 // @public (undocumented)
-const colorPalettePurpleBackground2 = "var(--colorPalettePurpleBackground2)";
+export const colorPalettePurpleBackground2 = "var(--colorPalettePurpleBackground2)";
 
 // @public (undocumented)
-const colorPalettePurpleBorderActive = "var(--colorPalettePurpleBorderActive)";
+export const colorPalettePurpleBorderActive = "var(--colorPalettePurpleBorderActive)";
 
 // @public (undocumented)
-const colorPalettePurpleForeground2 = "var(--colorPalettePurpleForeground2)";
+export const colorPalettePurpleForeground2 = "var(--colorPalettePurpleForeground2)";
 
 // @public (undocumented)
-const colorPaletteRedBackground1 = "var(--colorPaletteRedBackground1)";
+export const colorPaletteRedBackground1 = "var(--colorPaletteRedBackground1)";
 
 // @public (undocumented)
-const colorPaletteRedBackground2 = "var(--colorPaletteRedBackground2)";
+export const colorPaletteRedBackground2 = "var(--colorPaletteRedBackground2)";
 
 // @public (undocumented)
-const colorPaletteRedBackground3 = "var(--colorPaletteRedBackground3)";
+export const colorPaletteRedBackground3 = "var(--colorPaletteRedBackground3)";
 
 // @public (undocumented)
-const colorPaletteRedBorder1 = "var(--colorPaletteRedBorder1)";
+export const colorPaletteRedBorder1 = "var(--colorPaletteRedBorder1)";
 
 // @public (undocumented)
-const colorPaletteRedBorder2 = "var(--colorPaletteRedBorder2)";
+export const colorPaletteRedBorder2 = "var(--colorPaletteRedBorder2)";
 
 // @public (undocumented)
-const colorPaletteRedBorderActive = "var(--colorPaletteRedBorderActive)";
+export const colorPaletteRedBorderActive = "var(--colorPaletteRedBorderActive)";
 
 // @public (undocumented)
-const colorPaletteRedForeground1 = "var(--colorPaletteRedForeground1)";
+export const colorPaletteRedForeground1 = "var(--colorPaletteRedForeground1)";
 
 // @public (undocumented)
-const colorPaletteRedForeground2 = "var(--colorPaletteRedForeground2)";
+export const colorPaletteRedForeground2 = "var(--colorPaletteRedForeground2)";
 
 // @public (undocumented)
-const colorPaletteRedForeground3 = "var(--colorPaletteRedForeground3)";
+export const colorPaletteRedForeground3 = "var(--colorPaletteRedForeground3)";
 
 // @public (undocumented)
-const colorPaletteRedForegroundInverted = "var(--colorPaletteRedForegroundInverted)";
+export const colorPaletteRedForegroundInverted = "var(--colorPaletteRedForegroundInverted)";
 
 // @public (undocumented)
-const colorPaletteRoyalBlueBackground2 = "var(--colorPaletteRoyalBlueBackground2)";
+export const colorPaletteRoyalBlueBackground2 = "var(--colorPaletteRoyalBlueBackground2)";
 
 // @public (undocumented)
-const colorPaletteRoyalBlueBorderActive = "var(--colorPaletteRoyalBlueBorderActive)";
+export const colorPaletteRoyalBlueBorderActive = "var(--colorPaletteRoyalBlueBorderActive)";
 
 // @public (undocumented)
-const colorPaletteRoyalBlueForeground2 = "var(--colorPaletteRoyalBlueForeground2)";
+export const colorPaletteRoyalBlueForeground2 = "var(--colorPaletteRoyalBlueForeground2)";
 
 // @public (undocumented)
-const colorPaletteSeafoamBackground2 = "var(--colorPaletteSeafoamBackground2)";
+export const colorPaletteSeafoamBackground2 = "var(--colorPaletteSeafoamBackground2)";
 
 // @public (undocumented)
-const colorPaletteSeafoamBorderActive = "var(--colorPaletteSeafoamBorderActive)";
+export const colorPaletteSeafoamBorderActive = "var(--colorPaletteSeafoamBorderActive)";
 
 // @public (undocumented)
-const colorPaletteSeafoamForeground2 = "var(--colorPaletteSeafoamForeground2)";
+export const colorPaletteSeafoamForeground2 = "var(--colorPaletteSeafoamForeground2)";
 
 // @public (undocumented)
-const colorPaletteSteelBackground2 = "var(--colorPaletteSteelBackground2)";
+export const colorPaletteSteelBackground2 = "var(--colorPaletteSteelBackground2)";
 
 // @public (undocumented)
-const colorPaletteSteelBorderActive = "var(--colorPaletteSteelBorderActive)";
+export const colorPaletteSteelBorderActive = "var(--colorPaletteSteelBorderActive)";
 
 // @public (undocumented)
-const colorPaletteSteelForeground2 = "var(--colorPaletteSteelForeground2)";
+export const colorPaletteSteelForeground2 = "var(--colorPaletteSteelForeground2)";
 
 // @public (undocumented)
-const colorPaletteTealBackground2 = "var(--colorPaletteTealBackground2)";
+export const colorPaletteTealBackground2 = "var(--colorPaletteTealBackground2)";
 
 // @public (undocumented)
-const colorPaletteTealBorderActive = "var(--colorPaletteTealBorderActive)";
+export const colorPaletteTealBorderActive = "var(--colorPaletteTealBorderActive)";
 
 // @public (undocumented)
-const colorPaletteTealForeground2 = "var(--colorPaletteTealForeground2)";
+export const colorPaletteTealForeground2 = "var(--colorPaletteTealForeground2)";
 
 // @public (undocumented)
-const colorPaletteYellowBackground1 = "var(--colorPaletteYellowBackground1)";
+export const colorPaletteYellowBackground1 = "var(--colorPaletteYellowBackground1)";
 
 // @public (undocumented)
-const colorPaletteYellowBackground2 = "var(--colorPaletteYellowBackground2)";
+export const colorPaletteYellowBackground2 = "var(--colorPaletteYellowBackground2)";
 
 // @public (undocumented)
-const colorPaletteYellowBackground3 = "var(--colorPaletteYellowBackground3)";
+export const colorPaletteYellowBackground3 = "var(--colorPaletteYellowBackground3)";
 
 // @public (undocumented)
-const colorPaletteYellowBorder1 = "var(--colorPaletteYellowBorder1)";
+export const colorPaletteYellowBorder1 = "var(--colorPaletteYellowBorder1)";
 
 // @public (undocumented)
-const colorPaletteYellowBorder2 = "var(--colorPaletteYellowBorder2)";
+export const colorPaletteYellowBorder2 = "var(--colorPaletteYellowBorder2)";
 
 // @public (undocumented)
-const colorPaletteYellowBorderActive = "var(--colorPaletteYellowBorderActive)";
+export const colorPaletteYellowBorderActive = "var(--colorPaletteYellowBorderActive)";
 
 // @public (undocumented)
-const colorPaletteYellowForeground1 = "var(--colorPaletteYellowForeground1)";
+export const colorPaletteYellowForeground1 = "var(--colorPaletteYellowForeground1)";
 
 // @public (undocumented)
-const colorPaletteYellowForeground2 = "var(--colorPaletteYellowForeground2)";
+export const colorPaletteYellowForeground2 = "var(--colorPaletteYellowForeground2)";
 
 // @public (undocumented)
-const colorPaletteYellowForeground3 = "var(--colorPaletteYellowForeground3)";
+export const colorPaletteYellowForeground3 = "var(--colorPaletteYellowForeground3)";
 
 // @public (undocumented)
-const colorPaletteYellowForegroundInverted = "var(--colorPaletteYellowForegroundInverted)";
+export const colorPaletteYellowForegroundInverted = "var(--colorPaletteYellowForegroundInverted)";
 
 // @public (undocumented)
-const colorScrollbarOverlay = "var(--colorScrollbarOverlay)";
+export const colorScrollbarOverlay = "var(--colorScrollbarOverlay)";
 
 // @public (undocumented)
-const colorStrokeFocus1 = "var(--colorStrokeFocus1)";
+export const colorStrokeFocus1 = "var(--colorStrokeFocus1)";
 
 // @public (undocumented)
-const colorStrokeFocus2 = "var(--colorStrokeFocus2)";
+export const colorStrokeFocus2 = "var(--colorStrokeFocus2)";
 
 // @public (undocumented)
-const colorSubtleBackground = "var(--colorSubtleBackground)";
+export const colorSubtleBackground = "var(--colorSubtleBackground)";
 
 // @public (undocumented)
-const colorSubtleBackgroundHover = "var(--colorSubtleBackgroundHover)";
+export const colorSubtleBackgroundHover = "var(--colorSubtleBackgroundHover)";
 
 // @public (undocumented)
-const colorSubtleBackgroundInverted = "var(--colorSubtleBackgroundInverted)";
+export const colorSubtleBackgroundInverted = "var(--colorSubtleBackgroundInverted)";
 
 // @public (undocumented)
-const colorSubtleBackgroundInvertedHover = "var(--colorSubtleBackgroundInvertedHover)";
+export const colorSubtleBackgroundInvertedHover = "var(--colorSubtleBackgroundInvertedHover)";
 
 // @public (undocumented)
-const colorSubtleBackgroundInvertedPressed = "var(--colorSubtleBackgroundInvertedPressed)";
+export const colorSubtleBackgroundInvertedPressed = "var(--colorSubtleBackgroundInvertedPressed)";
 
 // @public (undocumented)
-const colorSubtleBackgroundInvertedSelected = "var(--colorSubtleBackgroundInvertedSelected)";
+export const colorSubtleBackgroundInvertedSelected = "var(--colorSubtleBackgroundInvertedSelected)";
 
 // @public (undocumented)
-const colorSubtleBackgroundLightAlphaHover = "var(--colorSubtleBackgroundLightAlphaHover)";
+export const colorSubtleBackgroundLightAlphaHover = "var(--colorSubtleBackgroundLightAlphaHover)";
 
 // @public (undocumented)
-const colorSubtleBackgroundLightAlphaPressed = "var(--colorSubtleBackgroundLightAlphaPressed)";
+export const colorSubtleBackgroundLightAlphaPressed = "var(--colorSubtleBackgroundLightAlphaPressed)";
 
 // @public (undocumented)
-const colorSubtleBackgroundLightAlphaSelected = "var(--colorSubtleBackgroundLightAlphaSelected)";
+export const colorSubtleBackgroundLightAlphaSelected = "var(--colorSubtleBackgroundLightAlphaSelected)";
 
 // @public (undocumented)
-const colorSubtleBackgroundPressed = "var(--colorSubtleBackgroundPressed)";
+export const colorSubtleBackgroundPressed = "var(--colorSubtleBackgroundPressed)";
 
 // @public (undocumented)
-const colorSubtleBackgroundSelected = "var(--colorSubtleBackgroundSelected)";
+export const colorSubtleBackgroundSelected = "var(--colorSubtleBackgroundSelected)";
 
 // @public (undocumented)
-const colorTransparentBackground = "var(--colorTransparentBackground)";
+export const colorTransparentBackground = "var(--colorTransparentBackground)";
 
 // @public (undocumented)
-const colorTransparentBackgroundHover = "var(--colorTransparentBackgroundHover)";
+export const colorTransparentBackgroundHover = "var(--colorTransparentBackgroundHover)";
 
 // @public (undocumented)
-const colorTransparentBackgroundPressed = "var(--colorTransparentBackgroundPressed)";
+export const colorTransparentBackgroundPressed = "var(--colorTransparentBackgroundPressed)";
 
 // @public (undocumented)
-const colorTransparentBackgroundSelected = "var(--colorTransparentBackgroundSelected)";
+export const colorTransparentBackgroundSelected = "var(--colorTransparentBackgroundSelected)";
 
 // @public (undocumented)
-const colorTransparentStroke = "var(--colorTransparentStroke)";
+export const colorTransparentStroke = "var(--colorTransparentStroke)";
 
 // @public (undocumented)
-const colorTransparentStrokeDisabled = "var(--colorTransparentStrokeDisabled)";
+export const colorTransparentStrokeDisabled = "var(--colorTransparentStrokeDisabled)";
 
 // @public (undocumented)
-const colorTransparentStrokeInteractive = "var(--colorTransparentStrokeInteractive)";
+export const colorTransparentStrokeInteractive = "var(--colorTransparentStrokeInteractive)";
 
 // @public
 export class CompoundButton extends Button {
@@ -1631,31 +1632,31 @@ export const CounterBadgeStyles: ElementStyles;
 export const CounterBadgeTemplate: ElementViewTemplate<CounterBadge>;
 
 // @public (undocumented)
-const curveAccelerateMax = "var(--curveAccelerateMax)";
+export const curveAccelerateMax = "var(--curveAccelerateMax)";
 
 // @public (undocumented)
-const curveAccelerateMid = "var(--curveAccelerateMid)";
+export const curveAccelerateMid = "var(--curveAccelerateMid)";
 
 // @public (undocumented)
-const curveAccelerateMin = "var(--curveAccelerateMin)";
+export const curveAccelerateMin = "var(--curveAccelerateMin)";
 
 // @public (undocumented)
-const curveDecelerateMax = "var(--curveDecelerateMax)";
+export const curveDecelerateMax = "var(--curveDecelerateMax)";
 
 // @public (undocumented)
-const curveDecelerateMid = "var(--curveDecelerateMid)";
+export const curveDecelerateMid = "var(--curveDecelerateMid)";
 
 // @public (undocumented)
-const curveDecelerateMin = "var(--curveDecelerateMin)";
+export const curveDecelerateMin = "var(--curveDecelerateMin)";
 
 // @public (undocumented)
-const curveEasyEase = "var(--curveEasyEase)";
+export const curveEasyEase = "var(--curveEasyEase)";
 
 // @public (undocumented)
-const curveEasyEaseMax = "var(--curveEasyEaseMax)";
+export const curveEasyEaseMax = "var(--curveEasyEaseMax)";
 
 // @public (undocumented)
-const curveLinear = "var(--curveLinear)";
+export const curveLinear = "var(--curveLinear)";
 
 // @public
 export const darkModeStylesheetBehavior: (styles: ElementStyles) => MatchMediaStyleSheetBehavior;
@@ -1768,25 +1769,25 @@ export const DividerStyles: ElementStyles;
 export const DividerTemplate: ElementViewTemplate<Divider>;
 
 // @public (undocumented)
-const durationFast = "var(--durationFast)";
+export const durationFast = "var(--durationFast)";
 
 // @public (undocumented)
-const durationFaster = "var(--durationFaster)";
+export const durationFaster = "var(--durationFaster)";
 
 // @public (undocumented)
-const durationNormal = "var(--durationNormal)";
+export const durationNormal = "var(--durationNormal)";
 
 // @public (undocumented)
-const durationSlow = "var(--durationSlow)";
+export const durationSlow = "var(--durationSlow)";
 
 // @public (undocumented)
-const durationSlower = "var(--durationSlower)";
+export const durationSlower = "var(--durationSlower)";
 
 // @public (undocumented)
-const durationUltraFast = "var(--durationUltraFast)";
+export const durationUltraFast = "var(--durationUltraFast)";
 
 // @public (undocumented)
-const durationUltraSlow = "var(--durationUltraSlow)";
+export const durationUltraSlow = "var(--durationUltraSlow)";
 
 // @public (undocumented)
 export const FluentDesignSystem: Readonly<{
@@ -1796,55 +1797,55 @@ export const FluentDesignSystem: Readonly<{
 }>;
 
 // @public (undocumented)
-const fontFamilyBase = "var(--fontFamilyBase)";
+export const fontFamilyBase = "var(--fontFamilyBase)";
 
 // @public (undocumented)
-const fontFamilyMonospace = "var(--fontFamilyMonospace)";
+export const fontFamilyMonospace = "var(--fontFamilyMonospace)";
 
 // @public (undocumented)
-const fontFamilyNumeric = "var(--fontFamilyNumeric)";
+export const fontFamilyNumeric = "var(--fontFamilyNumeric)";
 
 // @public (undocumented)
-const fontSizeBase100 = "var(--fontSizeBase100)";
+export const fontSizeBase100 = "var(--fontSizeBase100)";
 
 // @public (undocumented)
-const fontSizeBase200 = "var(--fontSizeBase200)";
+export const fontSizeBase200 = "var(--fontSizeBase200)";
 
 // @public (undocumented)
-const fontSizeBase300 = "var(--fontSizeBase300)";
+export const fontSizeBase300 = "var(--fontSizeBase300)";
 
 // @public (undocumented)
-const fontSizeBase400 = "var(--fontSizeBase400)";
+export const fontSizeBase400 = "var(--fontSizeBase400)";
 
 // @public (undocumented)
-const fontSizeBase500 = "var(--fontSizeBase500)";
+export const fontSizeBase500 = "var(--fontSizeBase500)";
 
 // @public (undocumented)
-const fontSizeBase600 = "var(--fontSizeBase600)";
+export const fontSizeBase600 = "var(--fontSizeBase600)";
 
 // @public (undocumented)
-const fontSizeHero1000 = "var(--fontSizeHero1000)";
+export const fontSizeHero1000 = "var(--fontSizeHero1000)";
 
 // @public (undocumented)
-const fontSizeHero700 = "var(--fontSizeHero700)";
+export const fontSizeHero700 = "var(--fontSizeHero700)";
 
 // @public (undocumented)
-const fontSizeHero800 = "var(--fontSizeHero800)";
+export const fontSizeHero800 = "var(--fontSizeHero800)";
 
 // @public (undocumented)
-const fontSizeHero900 = "var(--fontSizeHero900)";
+export const fontSizeHero900 = "var(--fontSizeHero900)";
 
 // @public (undocumented)
-const fontWeightBold = "var(--fontWeightBold)";
+export const fontWeightBold = "var(--fontWeightBold)";
 
 // @public (undocumented)
-const fontWeightMedium = "var(--fontWeightMedium)";
+export const fontWeightMedium = "var(--fontWeightMedium)";
 
 // @public (undocumented)
-const fontWeightRegular = "var(--fontWeightRegular)";
+export const fontWeightRegular = "var(--fontWeightRegular)";
 
 // @public (undocumented)
-const fontWeightSemibold = "var(--fontWeightSemibold)";
+export const fontWeightSemibold = "var(--fontWeightSemibold)";
 
 // @public
 export const forcedColorsStylesheetBehavior: (styles: ElementStyles) => MatchMediaStyleSheetBehavior;
@@ -1933,34 +1934,34 @@ export type LabelWeight = ValuesOf<typeof LabelWeight>;
 export const lightModeStylesheetBehavior: (styles: ElementStyles) => MatchMediaStyleSheetBehavior;
 
 // @public (undocumented)
-const lineHeightBase100 = "var(--lineHeightBase100)";
+export const lineHeightBase100 = "var(--lineHeightBase100)";
 
 // @public (undocumented)
-const lineHeightBase200 = "var(--lineHeightBase200)";
+export const lineHeightBase200 = "var(--lineHeightBase200)";
 
 // @public (undocumented)
-const lineHeightBase300 = "var(--lineHeightBase300)";
+export const lineHeightBase300 = "var(--lineHeightBase300)";
 
 // @public (undocumented)
-const lineHeightBase400 = "var(--lineHeightBase400)";
+export const lineHeightBase400 = "var(--lineHeightBase400)";
 
 // @public (undocumented)
-const lineHeightBase500 = "var(--lineHeightBase500)";
+export const lineHeightBase500 = "var(--lineHeightBase500)";
 
 // @public (undocumented)
-const lineHeightBase600 = "var(--lineHeightBase600)";
+export const lineHeightBase600 = "var(--lineHeightBase600)";
 
 // @public (undocumented)
-const lineHeightHero1000 = "var(--lineHeightHero1000)";
+export const lineHeightHero1000 = "var(--lineHeightHero1000)";
 
 // @public (undocumented)
-const lineHeightHero700 = "var(--lineHeightHero700)";
+export const lineHeightHero700 = "var(--lineHeightHero700)";
 
 // @public (undocumented)
-const lineHeightHero800 = "var(--lineHeightHero800)";
+export const lineHeightHero800 = "var(--lineHeightHero800)";
 
 // @public (undocumented)
-const lineHeightHero900 = "var(--lineHeightHero900)";
+export const lineHeightHero900 = "var(--lineHeightHero900)";
 
 // @public
 export abstract class MatchMediaBehavior implements HostBehavior {
@@ -2329,40 +2330,40 @@ export const setTheme: (theme: Theme) => void;
 export const setThemeFor: (element: HTMLElement, theme: Theme) => void;
 
 // @public (undocumented)
-const shadow16 = "var(--shadow16)";
+export const shadow16 = "var(--shadow16)";
 
 // @public (undocumented)
-const shadow16Brand = "var(--shadow16Brand)";
+export const shadow16Brand = "var(--shadow16Brand)";
 
 // @public (undocumented)
-const shadow2 = "var(--shadow2)";
+export const shadow2 = "var(--shadow2)";
 
 // @public (undocumented)
-const shadow28 = "var(--shadow28)";
+export const shadow28 = "var(--shadow28)";
 
 // @public (undocumented)
-const shadow28Brand = "var(--shadow28Brand)";
+export const shadow28Brand = "var(--shadow28Brand)";
 
 // @public (undocumented)
-const shadow2Brand = "var(--shadow2Brand)";
+export const shadow2Brand = "var(--shadow2Brand)";
 
 // @public (undocumented)
-const shadow4 = "var(--shadow4)";
+export const shadow4 = "var(--shadow4)";
 
 // @public (undocumented)
-const shadow4Brand = "var(--shadow4Brand)";
+export const shadow4Brand = "var(--shadow4Brand)";
 
 // @public (undocumented)
-const shadow64 = "var(--shadow64)";
+export const shadow64 = "var(--shadow64)";
 
 // @public (undocumented)
-const shadow64Brand = "var(--shadow64Brand)";
+export const shadow64Brand = "var(--shadow64Brand)";
 
 // @public (undocumented)
-const shadow8 = "var(--shadow8)";
+export const shadow8 = "var(--shadow8)";
 
 // @public (undocumented)
-const shadow8Brand = "var(--shadow8Brand)";
+export const shadow8Brand = "var(--shadow8Brand)";
 
 // Warning: (ae-forgotten-export) The symbol "FormAssociatedSlider" needs to be exported by the entry point index.d.ts
 //
@@ -2486,70 +2487,70 @@ export const SliderStyles: ElementStyles;
 export const SliderTemplate: ElementViewTemplate<Slider>;
 
 // @public (undocumented)
-const spacingHorizontalL = "var(--spacingHorizontalL)";
+export const spacingHorizontalL = "var(--spacingHorizontalL)";
 
 // @public (undocumented)
-const spacingHorizontalM = "var(--spacingHorizontalM)";
+export const spacingHorizontalM = "var(--spacingHorizontalM)";
 
 // @public (undocumented)
-const spacingHorizontalMNudge = "var(--spacingHorizontalMNudge)";
+export const spacingHorizontalMNudge = "var(--spacingHorizontalMNudge)";
 
 // @public (undocumented)
-const spacingHorizontalNone = "var(--spacingHorizontalNone)";
+export const spacingHorizontalNone = "var(--spacingHorizontalNone)";
 
 // @public (undocumented)
-const spacingHorizontalS = "var(--spacingHorizontalS)";
+export const spacingHorizontalS = "var(--spacingHorizontalS)";
 
 // @public (undocumented)
-const spacingHorizontalSNudge = "var(--spacingHorizontalSNudge)";
+export const spacingHorizontalSNudge = "var(--spacingHorizontalSNudge)";
 
 // @public (undocumented)
-const spacingHorizontalXL = "var(--spacingHorizontalXL)";
+export const spacingHorizontalXL = "var(--spacingHorizontalXL)";
 
 // @public (undocumented)
-const spacingHorizontalXS = "var(--spacingHorizontalXS)";
+export const spacingHorizontalXS = "var(--spacingHorizontalXS)";
 
 // @public (undocumented)
-const spacingHorizontalXXL = "var(--spacingHorizontalXXL)";
+export const spacingHorizontalXXL = "var(--spacingHorizontalXXL)";
 
 // @public (undocumented)
-const spacingHorizontalXXS = "var(--spacingHorizontalXXS)";
+export const spacingHorizontalXXS = "var(--spacingHorizontalXXS)";
 
 // @public (undocumented)
-const spacingHorizontalXXXL = "var(--spacingHorizontalXXXL)";
+export const spacingHorizontalXXXL = "var(--spacingHorizontalXXXL)";
 
 // @public (undocumented)
-const spacingVerticalL = "var(--spacingVerticalL)";
+export const spacingVerticalL = "var(--spacingVerticalL)";
 
 // @public (undocumented)
-const spacingVerticalM = "var(--spacingVerticalM)";
+export const spacingVerticalM = "var(--spacingVerticalM)";
 
 // @public (undocumented)
-const spacingVerticalMNudge = "var(--spacingVerticalMNudge)";
+export const spacingVerticalMNudge = "var(--spacingVerticalMNudge)";
 
 // @public (undocumented)
-const spacingVerticalNone = "var(--spacingVerticalNone)";
+export const spacingVerticalNone = "var(--spacingVerticalNone)";
 
 // @public (undocumented)
-const spacingVerticalS = "var(--spacingVerticalS)";
+export const spacingVerticalS = "var(--spacingVerticalS)";
 
 // @public (undocumented)
-const spacingVerticalSNudge = "var(--spacingVerticalSNudge)";
+export const spacingVerticalSNudge = "var(--spacingVerticalSNudge)";
 
 // @public (undocumented)
-const spacingVerticalXL = "var(--spacingVerticalXL)";
+export const spacingVerticalXL = "var(--spacingVerticalXL)";
 
 // @public (undocumented)
-const spacingVerticalXS = "var(--spacingVerticalXS)";
+export const spacingVerticalXS = "var(--spacingVerticalXS)";
 
 // @public (undocumented)
-const spacingVerticalXXL = "var(--spacingVerticalXXL)";
+export const spacingVerticalXXL = "var(--spacingVerticalXXL)";
 
 // @public (undocumented)
-const spacingVerticalXXS = "var(--spacingVerticalXXS)";
+export const spacingVerticalXXS = "var(--spacingVerticalXXS)";
 
 // @public (undocumented)
-const spacingVerticalXXXL = "var(--spacingVerticalXXXL)";
+export const spacingVerticalXXXL = "var(--spacingVerticalXXXL)";
 
 // @public
 export class Spinner extends BaseProgress {
@@ -2595,16 +2596,16 @@ export const SpinnerStyles: ElementStyles;
 export const SpinnerTemplate: ElementViewTemplate<Spinner>;
 
 // @public (undocumented)
-const strokeWidthThick = "var(--strokeWidthThick)";
+export const strokeWidthThick = "var(--strokeWidthThick)";
 
 // @public (undocumented)
-const strokeWidthThicker = "var(--strokeWidthThicker)";
+export const strokeWidthThicker = "var(--strokeWidthThicker)";
 
 // @public (undocumented)
-const strokeWidthThickest = "var(--strokeWidthThickest)";
+export const strokeWidthThickest = "var(--strokeWidthThickest)";
 
 // @public (undocumented)
-const strokeWidthThin = "var(--strokeWidthThin)";
+export const strokeWidthThin = "var(--strokeWidthThin)";
 
 // @public
 const styles: ElementStyles;
@@ -2981,395 +2982,56 @@ export const ToggleButtonStyles: ElementStyles;
 // @public
 export const ToggleButtonTemplate: ElementViewTemplate<ToggleButton>;
 
-declare namespace tokens {
-    export {
-        colorNeutralForeground1,
-        colorNeutralForeground1Hover,
-        colorNeutralForeground1Pressed,
-        colorNeutralForeground1Selected,
-        colorNeutralForeground2,
-        colorNeutralForeground2Hover,
-        colorNeutralForeground2Pressed,
-        colorNeutralForeground2Selected,
-        colorNeutralForeground2BrandHover,
-        colorNeutralForeground2BrandPressed,
-        colorNeutralForeground2BrandSelected,
-        colorNeutralForeground3,
-        colorNeutralForeground3Hover,
-        colorNeutralForeground3Pressed,
-        colorNeutralForeground3Selected,
-        colorNeutralForeground3BrandHover,
-        colorNeutralForeground3BrandPressed,
-        colorNeutralForeground3BrandSelected,
-        colorNeutralForeground4,
-        colorNeutralForegroundDisabled,
-        colorBrandForegroundLink,
-        colorBrandForegroundLinkHover,
-        colorBrandForegroundLinkPressed,
-        colorBrandForegroundLinkSelected,
-        colorNeutralForeground2Link,
-        colorNeutralForeground2LinkHover,
-        colorNeutralForeground2LinkPressed,
-        colorNeutralForeground2LinkSelected,
-        colorCompoundBrandForeground1,
-        colorCompoundBrandForeground1Hover,
-        colorCompoundBrandForeground1Pressed,
-        colorNeutralForegroundOnBrand,
-        colorNeutralForegroundInverted,
-        colorNeutralForegroundInvertedHover,
-        colorNeutralForegroundInvertedPressed,
-        colorNeutralForegroundInvertedSelected,
-        colorNeutralForegroundInverted2,
-        colorNeutralForegroundStaticInverted,
-        colorNeutralForegroundInvertedLink,
-        colorNeutralForegroundInvertedLinkHover,
-        colorNeutralForegroundInvertedLinkPressed,
-        colorNeutralForegroundInvertedLinkSelected,
-        colorNeutralForegroundInvertedDisabled,
-        colorBrandForeground1,
-        colorBrandForeground2,
-        colorNeutralForeground1Static,
-        colorBrandForegroundInverted,
-        colorBrandForegroundInvertedHover,
-        colorBrandForegroundInvertedPressed,
-        colorBrandForegroundOnLight,
-        colorBrandForegroundOnLightHover,
-        colorBrandForegroundOnLightPressed,
-        colorBrandForegroundOnLightSelected,
-        colorNeutralBackground1,
-        colorNeutralBackground1Hover,
-        colorNeutralBackground1Pressed,
-        colorNeutralBackground1Selected,
-        colorNeutralBackground2,
-        colorNeutralBackground2Hover,
-        colorNeutralBackground2Pressed,
-        colorNeutralBackground2Selected,
-        colorNeutralBackground3,
-        colorNeutralBackground3Hover,
-        colorNeutralBackground3Pressed,
-        colorNeutralBackground3Selected,
-        colorNeutralBackground4,
-        colorNeutralBackground4Hover,
-        colorNeutralBackground4Pressed,
-        colorNeutralBackground4Selected,
-        colorNeutralBackground5,
-        colorNeutralBackground5Hover,
-        colorNeutralBackground5Pressed,
-        colorNeutralBackground5Selected,
-        colorNeutralBackground6,
-        colorNeutralBackgroundStatic,
-        colorNeutralBackgroundInverted,
-        colorSubtleBackground,
-        colorSubtleBackgroundHover,
-        colorSubtleBackgroundPressed,
-        colorSubtleBackgroundSelected,
-        colorSubtleBackgroundLightAlphaHover,
-        colorSubtleBackgroundLightAlphaPressed,
-        colorSubtleBackgroundLightAlphaSelected,
-        colorSubtleBackgroundInverted,
-        colorSubtleBackgroundInvertedHover,
-        colorSubtleBackgroundInvertedPressed,
-        colorSubtleBackgroundInvertedSelected,
-        colorTransparentBackground,
-        colorTransparentBackgroundHover,
-        colorTransparentBackgroundPressed,
-        colorTransparentBackgroundSelected,
-        colorNeutralBackgroundDisabled,
-        colorNeutralBackgroundInvertedDisabled,
-        colorNeutralStencil1,
-        colorNeutralStencil2,
-        colorNeutralStencil1Alpha,
-        colorNeutralStencil2Alpha,
-        colorBackgroundOverlay,
-        colorScrollbarOverlay,
-        colorBrandBackground,
-        colorBrandBackgroundHover,
-        colorBrandBackgroundPressed,
-        colorBrandBackgroundSelected,
-        colorCompoundBrandBackground,
-        colorCompoundBrandBackgroundHover,
-        colorCompoundBrandBackgroundPressed,
-        colorBrandBackgroundStatic,
-        colorBrandBackground2,
-        colorBrandBackgroundInverted,
-        colorBrandBackgroundInvertedHover,
-        colorBrandBackgroundInvertedPressed,
-        colorBrandBackgroundInvertedSelected,
-        colorNeutralStrokeAccessible,
-        colorNeutralStrokeAccessibleHover,
-        colorNeutralStrokeAccessiblePressed,
-        colorNeutralStrokeAccessibleSelected,
-        colorNeutralStroke1,
-        colorNeutralStroke1Hover,
-        colorNeutralStroke1Pressed,
-        colorNeutralStroke1Selected,
-        colorNeutralStroke2,
-        colorNeutralStroke3,
-        colorNeutralStrokeOnBrand,
-        colorNeutralStrokeOnBrand2,
-        colorNeutralStrokeOnBrand2Hover,
-        colorNeutralStrokeOnBrand2Pressed,
-        colorNeutralStrokeOnBrand2Selected,
-        colorBrandStroke1,
-        colorBrandStroke2,
-        colorCompoundBrandStroke,
-        colorCompoundBrandStrokeHover,
-        colorCompoundBrandStrokePressed,
-        colorNeutralStrokeDisabled,
-        colorNeutralStrokeInvertedDisabled,
-        colorTransparentStroke,
-        colorTransparentStrokeInteractive,
-        colorTransparentStrokeDisabled,
-        colorStrokeFocus1,
-        colorStrokeFocus2,
-        colorNeutralShadowAmbient,
-        colorNeutralShadowKey,
-        colorNeutralShadowAmbientLighter,
-        colorNeutralShadowKeyLighter,
-        colorNeutralShadowAmbientDarker,
-        colorNeutralShadowKeyDarker,
-        colorBrandShadowAmbient,
-        colorBrandShadowKey,
-        colorPaletteRedBackground1,
-        colorPaletteRedBackground2,
-        colorPaletteRedBackground3,
-        colorPaletteRedBorderActive,
-        colorPaletteRedBorder1,
-        colorPaletteRedBorder2,
-        colorPaletteRedForeground1,
-        colorPaletteRedForeground2,
-        colorPaletteRedForeground3,
-        colorPaletteRedForegroundInverted,
-        colorPaletteGreenBackground1,
-        colorPaletteGreenBackground2,
-        colorPaletteGreenBackground3,
-        colorPaletteGreenBorderActive,
-        colorPaletteGreenBorder1,
-        colorPaletteGreenBorder2,
-        colorPaletteGreenForeground1,
-        colorPaletteGreenForeground2,
-        colorPaletteGreenForeground3,
-        colorPaletteGreenForegroundInverted,
-        colorPaletteDarkOrangeBackground1,
-        colorPaletteDarkOrangeBackground2,
-        colorPaletteDarkOrangeBackground3,
-        colorPaletteDarkOrangeBorderActive,
-        colorPaletteDarkOrangeBorder1,
-        colorPaletteDarkOrangeBorder2,
-        colorPaletteDarkOrangeForeground1,
-        colorPaletteDarkOrangeForeground2,
-        colorPaletteDarkOrangeForeground3,
-        colorPaletteYellowBackground1,
-        colorPaletteYellowBackground2,
-        colorPaletteYellowBackground3,
-        colorPaletteYellowBorderActive,
-        colorPaletteYellowBorder1,
-        colorPaletteYellowBorder2,
-        colorPaletteYellowForeground1,
-        colorPaletteYellowForeground2,
-        colorPaletteYellowForeground3,
-        colorPaletteYellowForegroundInverted,
-        colorPaletteBerryBackground1,
-        colorPaletteBerryBackground2,
-        colorPaletteBerryBackground3,
-        colorPaletteBerryBorderActive,
-        colorPaletteBerryBorder1,
-        colorPaletteBerryBorder2,
-        colorPaletteBerryForeground1,
-        colorPaletteBerryForeground2,
-        colorPaletteBerryForeground3,
-        colorPaletteMarigoldBackground1,
-        colorPaletteMarigoldBackground2,
-        colorPaletteMarigoldBackground3,
-        colorPaletteMarigoldBorderActive,
-        colorPaletteMarigoldBorder1,
-        colorPaletteMarigoldBorder2,
-        colorPaletteMarigoldForeground1,
-        colorPaletteMarigoldForeground2,
-        colorPaletteMarigoldForeground3,
-        colorPaletteLightGreenBackground1,
-        colorPaletteLightGreenBackground2,
-        colorPaletteLightGreenBackground3,
-        colorPaletteLightGreenBorderActive,
-        colorPaletteLightGreenBorder1,
-        colorPaletteLightGreenBorder2,
-        colorPaletteLightGreenForeground1,
-        colorPaletteLightGreenForeground2,
-        colorPaletteLightGreenForeground3,
-        colorPaletteAnchorBackground2,
-        colorPaletteAnchorBorderActive,
-        colorPaletteAnchorForeground2,
-        colorPaletteBeigeBackground2,
-        colorPaletteBeigeBorderActive,
-        colorPaletteBeigeForeground2,
-        colorPaletteBlueBackground2,
-        colorPaletteBlueBorderActive,
-        colorPaletteBlueForeground2,
-        colorPaletteBrassBackground2,
-        colorPaletteBrassBorderActive,
-        colorPaletteBrassForeground2,
-        colorPaletteBrownBackground2,
-        colorPaletteBrownBorderActive,
-        colorPaletteBrownForeground2,
-        colorPaletteCornflowerBackground2,
-        colorPaletteCornflowerBorderActive,
-        colorPaletteCornflowerForeground2,
-        colorPaletteCranberryBackground2,
-        colorPaletteCranberryBorderActive,
-        colorPaletteCranberryForeground2,
-        colorPaletteDarkGreenBackground2,
-        colorPaletteDarkGreenBorderActive,
-        colorPaletteDarkGreenForeground2,
-        colorPaletteDarkRedBackground2,
-        colorPaletteDarkRedBorderActive,
-        colorPaletteDarkRedForeground2,
-        colorPaletteForestBackground2,
-        colorPaletteForestBorderActive,
-        colorPaletteForestForeground2,
-        colorPaletteGoldBackground2,
-        colorPaletteGoldBorderActive,
-        colorPaletteGoldForeground2,
-        colorPaletteGrapeBackground2,
-        colorPaletteGrapeBorderActive,
-        colorPaletteGrapeForeground2,
-        colorPaletteLavenderBackground2,
-        colorPaletteLavenderBorderActive,
-        colorPaletteLavenderForeground2,
-        colorPaletteLightTealBackground2,
-        colorPaletteLightTealBorderActive,
-        colorPaletteLightTealForeground2,
-        colorPaletteLilacBackground2,
-        colorPaletteLilacBorderActive,
-        colorPaletteLilacForeground2,
-        colorPaletteMagentaBackground2,
-        colorPaletteMagentaBorderActive,
-        colorPaletteMagentaForeground2,
-        colorPaletteMinkBackground2,
-        colorPaletteMinkBorderActive,
-        colorPaletteMinkForeground2,
-        colorPaletteNavyBackground2,
-        colorPaletteNavyBorderActive,
-        colorPaletteNavyForeground2,
-        colorPalettePeachBackground2,
-        colorPalettePeachBorderActive,
-        colorPalettePeachForeground2,
-        colorPalettePinkBackground2,
-        colorPalettePinkBorderActive,
-        colorPalettePinkForeground2,
-        colorPalettePlatinumBackground2,
-        colorPalettePlatinumBorderActive,
-        colorPalettePlatinumForeground2,
-        colorPalettePlumBackground2,
-        colorPalettePlumBorderActive,
-        colorPalettePlumForeground2,
-        colorPalettePumpkinBackground2,
-        colorPalettePumpkinBorderActive,
-        colorPalettePumpkinForeground2,
-        colorPalettePurpleBackground2,
-        colorPalettePurpleBorderActive,
-        colorPalettePurpleForeground2,
-        colorPaletteRoyalBlueBackground2,
-        colorPaletteRoyalBlueBorderActive,
-        colorPaletteRoyalBlueForeground2,
-        colorPaletteSeafoamBackground2,
-        colorPaletteSeafoamBorderActive,
-        colorPaletteSeafoamForeground2,
-        colorPaletteSteelBackground2,
-        colorPaletteSteelBorderActive,
-        colorPaletteSteelForeground2,
-        colorPaletteTealBackground2,
-        colorPaletteTealBorderActive,
-        colorPaletteTealForeground2,
-        borderRadiusNone,
-        borderRadiusSmall,
-        borderRadiusMedium,
-        borderRadiusLarge,
-        borderRadiusXLarge,
-        borderRadiusCircular,
-        fontFamilyBase,
-        fontFamilyMonospace,
-        fontFamilyNumeric,
-        fontSizeBase100,
-        fontSizeBase200,
-        fontSizeBase300,
-        fontSizeBase400,
-        fontSizeBase500,
-        fontSizeBase600,
-        fontSizeHero700,
-        fontSizeHero800,
-        fontSizeHero900,
-        fontSizeHero1000,
-        fontWeightRegular,
-        fontWeightMedium,
-        fontWeightSemibold,
-        fontWeightBold,
-        lineHeightBase100,
-        lineHeightBase200,
-        lineHeightBase300,
-        lineHeightBase400,
-        lineHeightBase500,
-        lineHeightBase600,
-        lineHeightHero700,
-        lineHeightHero800,
-        lineHeightHero900,
-        lineHeightHero1000,
-        shadow2,
-        shadow4,
-        shadow8,
-        shadow16,
-        shadow28,
-        shadow64,
-        shadow2Brand,
-        shadow4Brand,
-        shadow8Brand,
-        shadow16Brand,
-        shadow28Brand,
-        shadow64Brand,
-        strokeWidthThin,
-        strokeWidthThick,
-        strokeWidthThicker,
-        strokeWidthThickest,
-        spacingHorizontalNone,
-        spacingHorizontalXXS,
-        spacingHorizontalXS,
-        spacingHorizontalSNudge,
-        spacingHorizontalS,
-        spacingHorizontalMNudge,
-        spacingHorizontalM,
-        spacingHorizontalL,
-        spacingHorizontalXL,
-        spacingHorizontalXXL,
-        spacingHorizontalXXXL,
-        spacingVerticalNone,
-        spacingVerticalXXS,
-        spacingVerticalXS,
-        spacingVerticalSNudge,
-        spacingVerticalS,
-        spacingVerticalMNudge,
-        spacingVerticalM,
-        spacingVerticalL,
-        spacingVerticalXL,
-        spacingVerticalXXL,
-        spacingVerticalXXXL,
-        durationUltraFast,
-        durationFaster,
-        durationFast,
-        durationNormal,
-        durationSlow,
-        durationSlower,
-        durationUltraSlow,
-        curveAccelerateMax,
-        curveAccelerateMid,
-        curveAccelerateMin,
-        curveDecelerateMax,
-        curveDecelerateMid,
-        curveDecelerateMin,
-        curveEasyEaseMax,
-        curveEasyEase,
-        curveLinear
-    }
-}
-export { tokens }
+// @public (undocumented)
+export const typographyBody1StrongerStyles: CSSDirective;
+
+// @public (undocumented)
+export const typographyBody1StrongStyles: CSSDirective;
+
+// @public (undocumented)
+export const typographyBody1Styles: CSSDirective;
+
+// @public (undocumented)
+export const typographyBody2Styles: CSSDirective;
+
+// @public (undocumented)
+export const typographyCaption1StrongerStyles: CSSDirective;
+
+// @public (undocumented)
+export const typographyCaption1StrongStyles: CSSDirective;
+
+// @public (undocumented)
+export const typographyCaption1Styles: CSSDirective;
+
+// @public (undocumented)
+export const typographyCaption2StrongStyles: CSSDirective;
+
+// @public (undocumented)
+export const typographyCaption2Styles: CSSDirective;
+
+// @public (undocumented)
+export const typographyDisplayStyles: CSSDirective;
+
+// @public (undocumented)
+export const typographyLargeTitleStyles: CSSDirective;
+
+// @public (undocumented)
+export const typographySubtitle1Styles: CSSDirective;
+
+// @public (undocumented)
+export const typographySubtitle2StrongerStyles: CSSDirective;
+
+// @public (undocumented)
+export const typographySubtitle2Styles: CSSDirective;
+
+// @public (undocumented)
+export const typographyTitle1Styles: CSSDirective;
+
+// @public (undocumented)
+export const typographyTitle2Styles: CSSDirective;
+
+// @public (undocumented)
+export const typographyTitle3Styles: CSSDirective;
 
 // Warnings were encountered during analysis:
 //
diff --git a/packages/web-components/src/index-rollup.ts b/packages/web-components/src/index-rollup.ts
index 6c0d36ad1137b7..47c6b8175e001e 100644
--- a/packages/web-components/src/index-rollup.ts
+++ b/packages/web-components/src/index-rollup.ts
@@ -200,5 +200,4 @@ export {
 export { FluentDesignSystem } from './fluent-design-system.js';
 export { setTheme, setThemeFor } from './theme/index.js';
 
-import * as tokens from './theme/design-tokens.js';
-export { tokens };
+export * from './theme/design-tokens.js';
diff --git a/packages/web-components/src/index.ts b/packages/web-components/src/index.ts
index e1964fe05471d9..4d0f88af6df42e 100644
--- a/packages/web-components/src/index.ts
+++ b/packages/web-components/src/index.ts
@@ -245,5 +245,4 @@ export {
 export { FluentDesignSystem } from './fluent-design-system.js';
 export { setTheme, setThemeFor } from './theme/index.js';
 
-import * as tokens from './theme/design-tokens.js';
-export { tokens };
+export * from './theme/design-tokens.js';