@fluentui/web-components 3.0.0-beta.2 → 3.0.0-beta.21

package/docs/api-report.md

@@ -4,66 +4,76 @@
 
 ```ts
 
-import type { AnchorOptions as AnchorButtonOptions } from '@microsoft/fast-foundation/anchor.js';
-import type { ButtonOptions } from '@microsoft/fast-foundation/button.js';
-import { CSSDesignToken } from '@microsoft/fast-foundation/design-token.js';
-import { DividerOrientation } from '@microsoft/fast-foundation/divider.js';
-import { DividerRole } from '@microsoft/fast-foundation/divider.js';
+/// <reference types="web" />
+
+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';
-import { FASTAccordion } from '@microsoft/fast-foundation/accordion.js';
-import { FASTAccordionItem } from '@microsoft/fast-foundation/accordion-item.js';
-import { FASTAnchor } from '@microsoft/fast-foundation/anchor.js';
-import { FASTButton } from '@microsoft/fast-foundation/button.js';
-import { FASTCheckbox } from '@microsoft/fast-foundation/checkbox.js';
-import { FASTDivider } from '@microsoft/fast-foundation/divider.js';
 import { FASTElement } from '@microsoft/fast-element';
 import { FASTElementDefinition } from '@microsoft/fast-element';
-import { FASTMenu } from '@microsoft/fast-foundation/menu.js';
-import { FASTMenuItem } from '@microsoft/fast-foundation/menu-item.js';
-import { FASTProgress } from '@microsoft/fast-foundation/progress.js';
-import { FASTProgressRing } from '@microsoft/fast-foundation/progress-ring.js';
-import { FASTRadio } from '@microsoft/fast-foundation/radio.js';
-import { FASTRadioGroup } from '@microsoft/fast-foundation/radio-group.js';
-import { FASTSlider } from '@microsoft/fast-foundation/slider.js';
-import { FASTSwitch } from '@microsoft/fast-foundation/switch.js';
-import { FASTTab } from '@microsoft/fast-foundation/tab.js';
-import { FASTTabPanel } from '@microsoft/fast-foundation/tab-panel.js';
-import { FASTTabs } from '@microsoft/fast-foundation/tabs.js';
-import { FASTTextField } from '@microsoft/fast-foundation/text-field.js';
-import { MenuItemRole } from '@microsoft/fast-foundation/menu-item.js';
-import { RadioGroupOrientation } from '@microsoft/fast-foundation/radio-group.js';
-import { SliderOrientation } from '@microsoft/fast-foundation/slider.js';
-import { StartEnd } from '@microsoft/fast-foundation/patterns.js';
-import { StartEndOptions } from '@microsoft/fast-foundation/patterns.js';
-import type { StaticallyComposableHTML } from '@microsoft/fast-foundation/utilities.js';
-import { TabsOrientation } from '@microsoft/fast-foundation/tabs.js';
-import { TextFieldType as TextInputType } from '@microsoft/fast-foundation/text-field.js';
+import type { HostBehavior } from '@microsoft/fast-element';
+import type { HostController } from '@microsoft/fast-element';
+import { HTMLDirective } from '@microsoft/fast-element';
+import { Orientation } from '@microsoft/fast-web-utilities';
+import type { SyntheticViewTemplate } from '@microsoft/fast-element';
 import type { Theme } from '@fluentui/tokens';
-import type { ValuesOf } from '@microsoft/fast-foundation/utilities.js';
+import { ViewTemplate } from '@microsoft/fast-element';
 
 // @public
-export class Accordion extends FASTAccordion {
+export class Accordion extends FASTElement {
+    // (undocumented)
+    protected accordionItems: Element[];
+    expandmode: AccordionExpandMode;
+    // (undocumented)
+    expandmodeChanged(prev: AccordionExpandMode, next: AccordionExpandMode): void;
+    // @internal (undocumented)
+    handleChange(source: any, propertyName: string): void;
+    // @internal (undocumented)
+    slottedAccordionItems: HTMLElement[];
+    // @internal (undocumented)
+    slottedAccordionItemsChanged(oldValue: HTMLElement[], newValue: HTMLElement[]): void;
 }
 
-// @public
+// @public (undocumented)
 export const accordionDefinition: FASTElementDefinition<typeof Accordion>;
 
-// Warning: (ae-internal-missing-underscore) The name "AccordionItem" should be prefixed with an underscore because the declaration is marked as @internal
+// @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
 //
-// @internal (undocumented)
-export class AccordionItem extends FASTAccordionItem {
-    // @public
+// @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
+export class AccordionItem extends FASTElement {
     block: boolean;
-    // @public
+    // @internal (undocumented)
+    clickHandler: (e: MouseEvent) => void;
+    disabled: boolean;
+    // @internal (undocumented)
+    expandbutton: HTMLElement;
+    expanded: boolean;
     expandIconPosition?: AccordionItemExpandIconPosition;
-    // @public
+    headinglevel: 1 | 2 | 3 | 4 | 5 | 6;
+    id: string;
     size?: AccordionItemSize;
 }
 
-// Warning: (ae-incompatible-release-tags) The symbol "definition" is marked as @public, but its signature references "AccordionItem" which is marked as @internal
+// Warning: (ae-forgotten-export) The symbol "StartEnd" needs to be exported by the entry point index.d.ts
 //
-// @public
+// @internal
+export interface AccordionItem extends StartEnd {
+}
+
+// @public (undocumented)
 export const accordionItemDefinition: FASTElementDefinition<typeof AccordionItem>;
 
 // @public
@@ -75,6 +85,14 @@ export const AccordionItemExpandIconPosition: {
 // @public
 export type AccordionItemExpandIconPosition = ValuesOf<typeof AccordionItemExpandIconPosition>;
 
+// Warning: (ae-forgotten-export) The symbol "StartEndOptions" needs to be exported by the entry point index.d.ts
+//
+// @public
+export type AccordionItemOptions = StartEndOptions<AccordionItem> & {
+    expandedIcon?: StaticallyComposableHTML<AccordionItem>;
+    collapsedIcon?: StaticallyComposableHTML<AccordionItem>;
+};
+
 // @public
 export const AccordionItemSize: {
     readonly small: "small";
@@ -89,8 +107,6 @@ export type AccordionItemSize = ValuesOf<typeof AccordionItemSize>;
 // @public (undocumented)
 export const accordionItemStyles: ElementStyles;
 
-// Warning: (ae-incompatible-release-tags) The symbol "template" is marked as @public, but its signature references "AccordionItem" which is marked as @internal
-//
 // @public
 export const accordionItemTemplate: ElementViewTemplate<AccordionItem>;
 
@@ -100,11 +116,16 @@ export const accordionStyles: ElementStyles;
 // @public (undocumented)
 export const accordionTemplate: ElementViewTemplate<Accordion>;
 
+// Warning: (ae-internal-mixed-release-tag) Mixed release tags are not allowed for "AnchorButton" because one of its declarations is marked as @internal
+//
 // @public
-export class AnchorButton extends FASTAnchor {
+export class AnchorButton extends FASTElement {
     appearance?: AnchorButtonAppearance | undefined;
     // (undocumented)
     connectedCallback(): void;
+    control: HTMLAnchorElement;
+    // @internal
+    defaultSlottedContent: HTMLElement[];
     disabled?: boolean;
     // (undocumented)
     protected disabledChanged(prev: boolean, next: boolean): void;
@@ -113,9 +134,23 @@ export class AnchorButton extends FASTAnchor {
     protected disabledFocusableChanged(prev: boolean, next: boolean): void;
     // (undocumented)
     disconnectedCallback(): void;
+    download: string;
+    href: string;
+    hreflang: string;
     iconOnly: boolean;
+    ping: string;
+    referrerpolicy: string;
+    rel: string;
     shape?: AnchorButtonShape | undefined;
     size?: AnchorButtonSize;
+    target: AnchorTarget;
+    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 {
 }
 
 // @public
@@ -130,10 +165,11 @@ export const AnchorButtonAppearance: {
 // @public
 export type AnchorButtonAppearance = ValuesOf<typeof AnchorButtonAppearance>;
 
-// @public
+// @public (undocumented)
 export const AnchorButtonDefinition: FASTElementDefinition<typeof AnchorButton>;
 
-export { AnchorButtonOptions }
+// @public
+export type AnchorButtonOptions = StartEndOptions<AnchorButton>;
 
 // @public
 export const AnchorButtonShape: {
@@ -158,6 +194,17 @@ export type AnchorButtonSize = ValuesOf<typeof AnchorButtonSize>;
 // @public
 export const AnchorButtonTemplate: ElementViewTemplate<AnchorButton>;
 
+// @public
+export const AnchorTarget: {
+    readonly _self: "_self";
+    readonly _blank: "_blank";
+    readonly _parent: "_parent";
+    readonly _top: "_top";
+};
+
+// @public
+export type AnchorTarget = ValuesOf<typeof AnchorTarget>;
+
 // @public
 export class Avatar extends FASTElement {
     active?: AvatarActive | undefined;
@@ -350,16 +397,9 @@ export const BadgeColor: {
 // @public
 export type BadgeColor = ValuesOf<typeof BadgeColor>;
 
-// @public
+// @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";
@@ -390,36 +430,67 @@ export const BadgeStyles: ElementStyles;
 export const BadgeTemplate: ElementViewTemplate<Badge>;
 
 // @public (undocumented)
-export const borderRadiusCircular: CSSDesignToken<string>;
+export const borderRadiusCircular = "var(--borderRadiusCircular)";
 
 // @public (undocumented)
-export const borderRadiusLarge: CSSDesignToken<string>;
+export const borderRadiusLarge = "var(--borderRadiusLarge)";
 
 // @public (undocumented)
-export const borderRadiusMedium: CSSDesignToken<string>;
+export const borderRadiusMedium = "var(--borderRadiusMedium)";
 
 // @public (undocumented)
-export const borderRadiusNone: CSSDesignToken<string>;
+export const borderRadiusNone = "var(--borderRadiusNone)";
 
 // @public (undocumented)
-export const borderRadiusSmall: CSSDesignToken<string>;
+export const borderRadiusSmall = "var(--borderRadiusSmall)";
 
 // @public (undocumented)
-export const borderRadiusXLarge: CSSDesignToken<string>;
+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
+//
 // @public
-export class Button extends FASTButton {
-    appearance?: ButtonAppearance | undefined;
+export class Button extends FASTElement {
+    constructor();
+    appearance?: ButtonAppearance;
+    autofocus: boolean;
+    // @internal
+    clickHandler(e: Event): boolean | void;
     // (undocumented)
     connectedCallback(): void;
-    disabledFocusable?: boolean;
-    // (undocumented)
-    protected disabledFocusableChanged(prev: boolean, next: boolean): void;
-    // (undocumented)
-    disconnectedCallback(): void;
+    defaultSlottedContent: HTMLElement[];
+    disabled?: boolean;
+    disabledFocusable: boolean;
+    // @internal
+    disabledFocusableChanged(previous: boolean, next: boolean): void;
+    // @internal
+    protected elementInternals: ElementInternals;
+    get form(): HTMLFormElement | null;
+    formAction?: string;
+    static readonly formAssociated = true;
+    formAttribute?: string;
+    // @internal
+    formDisabledCallback(disabled: boolean): void;
+    formEnctype?: string;
+    formMethod?: string;
+    formNoValidate?: boolean;
+    formTarget?: ButtonFormTarget;
     iconOnly: boolean;
-    shape?: ButtonShape | undefined;
+    keypressHandler(e: KeyboardEvent): boolean | void;
+    get labels(): ReadonlyArray<Node>;
+    name?: string;
+    protected press(): void;
+    resetForm(): void;
+    shape?: ButtonShape;
     size?: ButtonSize;
+    type: ButtonType;
+    // @internal
+    typeChanged(previous: ButtonType, next: ButtonType): void;
+    value?: string;
+}
+
+// @internal (undocumented)
+export interface Button extends StartEnd {
 }
 
 // @public
@@ -437,8 +508,20 @@ export type ButtonAppearance = ValuesOf<typeof ButtonAppearance>;
 // @public
 export const ButtonDefinition: FASTElementDefinition<typeof Button>;
 
+// @public
+export const ButtonFormTarget: {
+    readonly blank: "_blank";
+    readonly self: "_self";
+    readonly parent: "_parent";
+    readonly top: "_top";
+};
+
+// @public
+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 }
 
@@ -466,7 +549,29 @@ export type ButtonSize = ValuesOf<typeof ButtonSize>;
 export const ButtonTemplate: ElementViewTemplate<Button>;
 
 // @public
-export class Checkbox extends FASTCheckbox {
+export const ButtonType: {
+    readonly submit: "submit";
+    readonly reset: "reset";
+    readonly button: "button";
+};
+
+// @public
+export type ButtonType = ValuesOf<typeof ButtonType>;
+
+// Warning: (ae-forgotten-export) The symbol "FormAssociatedCheckbox" needs to be exported by the entry point index.d.ts
+//
+// @public
+export class Checkbox extends FormAssociatedCheckbox {
+    constructor();
+    // @internal (undocumented)
+    clickHandler: (e: MouseEvent) => void;
+    // @internal (undocumented)
+    defaultSlottedNodes: Node[];
+    indeterminate: boolean;
+    // @internal
+    initialValue: string;
+    // @internal (undocumented)
+    keypressHandler: (e: KeyboardEvent) => void;
     labelPosition?: CheckboxLabelPosition;
     shape?: CheckboxShape;
     size?: CheckboxSize;
@@ -484,6 +589,12 @@ export const CheckboxLabelPosition: {
 // @public (undocumented)
 export type CheckboxLabelPosition = ValuesOf<typeof CheckboxLabelPosition>;
 
+// @public
+export type CheckboxOptions = {
+    checkedIndicator?: StaticallyComposableHTML<Checkbox>;
+    indeterminateIndicator?: StaticallyComposableHTML<Checkbox>;
+};
+
 // @public
 export const CheckboxShape: {
     readonly circular: "circular";
@@ -509,895 +620,1048 @@ export const CheckboxStyles: ElementStyles;
 export const CheckboxTemplate: ElementViewTemplate<Checkbox>;
 
 // @public (undocumented)
-export const colorBackgroundOverlay: CSSDesignToken<string>;
+export const colorBackgroundOverlay = "var(--colorBackgroundOverlay)";
+
+// @public (undocumented)
+export const colorBrandBackground = "var(--colorBrandBackground)";
+
+// @public (undocumented)
+export const colorBrandBackground2 = "var(--colorBrandBackground2)";
+
+// @public (undocumented)
+export const colorBrandBackground2Hover = "var(--colorBrandBackground2Hover)";
+
+// @public (undocumented)
+export const colorBrandBackground2Pressed = "var(--colorBrandBackground2Pressed)";
+
+// @public (undocumented)
+export const colorBrandBackground3Static = "var(--colorBrandBackground3Static)";
+
+// @public (undocumented)
+export const colorBrandBackground4Static = "var(--colorBrandBackground4Static)";
+
+// @public (undocumented)
+export const colorBrandBackgroundHover = "var(--colorBrandBackgroundHover)";
+
+// @public (undocumented)
+export const colorBrandBackgroundInverted = "var(--colorBrandBackgroundInverted)";
+
+// @public (undocumented)
+export const colorBrandBackgroundInvertedHover = "var(--colorBrandBackgroundInvertedHover)";
+
+// @public (undocumented)
+export const colorBrandBackgroundInvertedPressed = "var(--colorBrandBackgroundInvertedPressed)";
+
+// @public (undocumented)
+export const colorBrandBackgroundInvertedSelected = "var(--colorBrandBackgroundInvertedSelected)";
+
+// @public (undocumented)
+export const colorBrandBackgroundPressed = "var(--colorBrandBackgroundPressed)";
+
+// @public (undocumented)
+export const colorBrandBackgroundSelected = "var(--colorBrandBackgroundSelected)";
+
+// @public (undocumented)
+export const colorBrandBackgroundStatic = "var(--colorBrandBackgroundStatic)";
+
+// @public (undocumented)
+export const colorBrandForeground1 = "var(--colorBrandForeground1)";
+
+// @public (undocumented)
+export const colorBrandForeground2 = "var(--colorBrandForeground2)";
+
+// @public (undocumented)
+export const colorBrandForeground2Hover = "var(--colorBrandForeground2Hover)";
+
+// @public (undocumented)
+export const colorBrandForeground2Pressed = "var(--colorBrandForeground2Pressed)";
+
+// @public (undocumented)
+export const colorBrandForegroundInverted = "var(--colorBrandForegroundInverted)";
+
+// @public (undocumented)
+export const colorBrandForegroundInvertedHover = "var(--colorBrandForegroundInvertedHover)";
+
+// @public (undocumented)
+export const colorBrandForegroundInvertedPressed = "var(--colorBrandForegroundInvertedPressed)";
 
 // @public (undocumented)
-export const colorBrandBackground: CSSDesignToken<string>;
+export const colorBrandForegroundLink = "var(--colorBrandForegroundLink)";
 
 // @public (undocumented)
-export const colorBrandBackground2: CSSDesignToken<string>;
+export const colorBrandForegroundLinkHover = "var(--colorBrandForegroundLinkHover)";
 
 // @public (undocumented)
-export const colorBrandBackgroundHover: CSSDesignToken<string>;
+export const colorBrandForegroundLinkPressed = "var(--colorBrandForegroundLinkPressed)";
 
 // @public (undocumented)
-export const colorBrandBackgroundInverted: CSSDesignToken<string>;
+export const colorBrandForegroundLinkSelected = "var(--colorBrandForegroundLinkSelected)";
 
 // @public (undocumented)
-export const colorBrandBackgroundInvertedHover: CSSDesignToken<string>;
+export const colorBrandForegroundOnLight = "var(--colorBrandForegroundOnLight)";
 
 // @public (undocumented)
-export const colorBrandBackgroundInvertedPressed: CSSDesignToken<string>;
+export const colorBrandForegroundOnLightHover = "var(--colorBrandForegroundOnLightHover)";
 
 // @public (undocumented)
-export const colorBrandBackgroundInvertedSelected: CSSDesignToken<string>;
+export const colorBrandForegroundOnLightPressed = "var(--colorBrandForegroundOnLightPressed)";
 
 // @public (undocumented)
-export const colorBrandBackgroundPressed: CSSDesignToken<string>;
+export const colorBrandForegroundOnLightSelected = "var(--colorBrandForegroundOnLightSelected)";
 
 // @public (undocumented)
-export const colorBrandBackgroundSelected: CSSDesignToken<string>;
+export const colorBrandShadowAmbient = "var(--colorBrandShadowAmbient)";
 
 // @public (undocumented)
-export const colorBrandBackgroundStatic: CSSDesignToken<string>;
+export const colorBrandShadowKey = "var(--colorBrandShadowKey)";
 
 // @public (undocumented)
-export const colorBrandForeground1: CSSDesignToken<string>;
+export const colorBrandStroke1 = "var(--colorBrandStroke1)";
 
 // @public (undocumented)
-export const colorBrandForeground2: CSSDesignToken<string>;
+export const colorBrandStroke2 = "var(--colorBrandStroke2)";
 
 // @public (undocumented)
-export const colorBrandForegroundInverted: CSSDesignToken<string>;
+export const colorBrandStroke2Contrast = "var(--colorBrandStroke2Contrast)";
 
 // @public (undocumented)
-export const colorBrandForegroundInvertedHover: CSSDesignToken<string>;
+export const colorBrandStroke2Hover = "var(--colorBrandStroke2Hover)";
 
 // @public (undocumented)
-export const colorBrandForegroundInvertedPressed: CSSDesignToken<string>;
+export const colorBrandStroke2Pressed = "var(--colorBrandStroke2Pressed)";
 
 // @public (undocumented)
-export const colorBrandForegroundLink: CSSDesignToken<string>;
+export const colorCompoundBrandBackground = "var(--colorCompoundBrandBackground)";
 
 // @public (undocumented)
-export const colorBrandForegroundLinkHover: CSSDesignToken<string>;
+export const colorCompoundBrandBackgroundHover = "var(--colorCompoundBrandBackgroundHover)";
 
 // @public (undocumented)
-export const colorBrandForegroundLinkPressed: CSSDesignToken<string>;
+export const colorCompoundBrandBackgroundPressed = "var(--colorCompoundBrandBackgroundPressed)";
 
 // @public (undocumented)
-export const colorBrandForegroundLinkSelected: CSSDesignToken<string>;
+export const colorCompoundBrandForeground1 = "var(--colorCompoundBrandForeground1)";
 
 // @public (undocumented)
-export const colorBrandForegroundOnLight: CSSDesignToken<string>;
+export const colorCompoundBrandForeground1Hover = "var(--colorCompoundBrandForeground1Hover)";
 
 // @public (undocumented)
-export const colorBrandForegroundOnLightHover: CSSDesignToken<string>;
+export const colorCompoundBrandForeground1Pressed = "var(--colorCompoundBrandForeground1Pressed)";
 
 // @public (undocumented)
-export const colorBrandForegroundOnLightPressed: CSSDesignToken<string>;
+export const colorCompoundBrandStroke = "var(--colorCompoundBrandStroke)";
 
 // @public (undocumented)
-export const colorBrandForegroundOnLightSelected: CSSDesignToken<string>;
+export const colorCompoundBrandStrokeHover = "var(--colorCompoundBrandStrokeHover)";
 
 // @public (undocumented)
-export const colorBrandShadowAmbient: CSSDesignToken<string>;
+export const colorCompoundBrandStrokePressed = "var(--colorCompoundBrandStrokePressed)";
 
 // @public (undocumented)
-export const colorBrandShadowKey: CSSDesignToken<string>;
+export const colorNeutralBackground1 = "var(--colorNeutralBackground1)";
 
 // @public (undocumented)
-export const colorBrandStroke1: CSSDesignToken<string>;
+export const colorNeutralBackground1Hover = "var(--colorNeutralBackground1Hover)";
 
 // @public (undocumented)
-export const colorBrandStroke2: CSSDesignToken<string>;
+export const colorNeutralBackground1Pressed = "var(--colorNeutralBackground1Pressed)";
 
 // @public (undocumented)
-export const colorCompoundBrandBackground: CSSDesignToken<string>;
+export const colorNeutralBackground1Selected = "var(--colorNeutralBackground1Selected)";
 
 // @public (undocumented)
-export const colorCompoundBrandBackgroundHover: CSSDesignToken<string>;
+export const colorNeutralBackground2 = "var(--colorNeutralBackground2)";
 
 // @public (undocumented)
-export const colorCompoundBrandBackgroundPressed: CSSDesignToken<string>;
+export const colorNeutralBackground2Hover = "var(--colorNeutralBackground2Hover)";
 
 // @public (undocumented)
-export const colorCompoundBrandForeground1: CSSDesignToken<string>;
+export const colorNeutralBackground2Pressed = "var(--colorNeutralBackground2Pressed)";
 
 // @public (undocumented)
-export const colorCompoundBrandForeground1Hover: CSSDesignToken<string>;
+export const colorNeutralBackground2Selected = "var(--colorNeutralBackground2Selected)";
 
 // @public (undocumented)
-export const colorCompoundBrandForeground1Pressed: CSSDesignToken<string>;
+export const colorNeutralBackground3 = "var(--colorNeutralBackground3)";
 
 // @public (undocumented)
-export const colorCompoundBrandStroke: CSSDesignToken<string>;
+export const colorNeutralBackground3Hover = "var(--colorNeutralBackground3Hover)";
 
 // @public (undocumented)
-export const colorCompoundBrandStrokeHover: CSSDesignToken<string>;
+export const colorNeutralBackground3Pressed = "var(--colorNeutralBackground3Pressed)";
 
 // @public (undocumented)
-export const colorCompoundBrandStrokePressed: CSSDesignToken<string>;
+export const colorNeutralBackground3Selected = "var(--colorNeutralBackground3Selected)";
 
 // @public (undocumented)
-export const colorNeutralBackground1: CSSDesignToken<string>;
+export const colorNeutralBackground4 = "var(--colorNeutralBackground4)";
 
 // @public (undocumented)
-export const colorNeutralBackground1Hover: CSSDesignToken<string>;
+export const colorNeutralBackground4Hover = "var(--colorNeutralBackground4Hover)";
 
 // @public (undocumented)
-export const colorNeutralBackground1Pressed: CSSDesignToken<string>;
+export const colorNeutralBackground4Pressed = "var(--colorNeutralBackground4Pressed)";
 
 // @public (undocumented)
-export const colorNeutralBackground1Selected: CSSDesignToken<string>;
+export const colorNeutralBackground4Selected = "var(--colorNeutralBackground4Selected)";
 
 // @public (undocumented)
-export const colorNeutralBackground2: CSSDesignToken<string>;
+export const colorNeutralBackground5 = "var(--colorNeutralBackground5)";
 
 // @public (undocumented)
-export const colorNeutralBackground2Hover: CSSDesignToken<string>;
+export const colorNeutralBackground5Hover = "var(--colorNeutralBackground5Hover)";
 
 // @public (undocumented)
-export const colorNeutralBackground2Pressed: CSSDesignToken<string>;
+export const colorNeutralBackground5Pressed = "var(--colorNeutralBackground5Pressed)";
 
 // @public (undocumented)
-export const colorNeutralBackground2Selected: CSSDesignToken<string>;
+export const colorNeutralBackground5Selected = "var(--colorNeutralBackground5Selected)";
 
 // @public (undocumented)
-export const colorNeutralBackground3: CSSDesignToken<string>;
+export const colorNeutralBackground6 = "var(--colorNeutralBackground6)";
 
 // @public (undocumented)
-export const colorNeutralBackground3Hover: CSSDesignToken<string>;
+export const colorNeutralBackgroundAlpha = "var(--colorNeutralBackgroundAlpha)";
 
 // @public (undocumented)
-export const colorNeutralBackground3Pressed: CSSDesignToken<string>;
+export const colorNeutralBackgroundAlpha2 = "var(--colorNeutralBackgroundAlpha2)";
 
 // @public (undocumented)
-export const colorNeutralBackground3Selected: CSSDesignToken<string>;
+export const colorNeutralBackgroundDisabled = "var(--colorNeutralBackgroundDisabled)";
 
 // @public (undocumented)
-export const colorNeutralBackground4: CSSDesignToken<string>;
+export const colorNeutralBackgroundInverted = "var(--colorNeutralBackgroundInverted)";
 
 // @public (undocumented)
-export const colorNeutralBackground4Hover: CSSDesignToken<string>;
+export const colorNeutralBackgroundInvertedDisabled = "var(--colorNeutralBackgroundInvertedDisabled)";
 
 // @public (undocumented)
-export const colorNeutralBackground4Pressed: CSSDesignToken<string>;
+export const colorNeutralBackgroundStatic = "var(--colorNeutralBackgroundStatic)";
 
 // @public (undocumented)
-export const colorNeutralBackground4Selected: CSSDesignToken<string>;
+export const colorNeutralCardBackground = "var(--colorNeutralCardBackground)";
 
 // @public (undocumented)
-export const colorNeutralBackground5: CSSDesignToken<string>;
+export const colorNeutralCardBackgroundDisabled = "var(--colorNeutralCardBackgroundDisabled)";
 
 // @public (undocumented)
-export const colorNeutralBackground5Hover: CSSDesignToken<string>;
+export const colorNeutralCardBackgroundHover = "var(--colorNeutralCardBackgroundHover)";
 
 // @public (undocumented)
-export const colorNeutralBackground5Pressed: CSSDesignToken<string>;
+export const colorNeutralCardBackgroundPressed = "var(--colorNeutralCardBackgroundPressed)";
 
 // @public (undocumented)
-export const colorNeutralBackground5Selected: CSSDesignToken<string>;
+export const colorNeutralCardBackgroundSelected = "var(--colorNeutralCardBackgroundSelected)";
 
 // @public (undocumented)
-export const colorNeutralBackground6: CSSDesignToken<string>;
+export const colorNeutralForeground1 = "var(--colorNeutralForeground1)";
 
 // @public (undocumented)
-export const colorNeutralBackgroundDisabled: CSSDesignToken<string>;
+export const colorNeutralForeground1Hover = "var(--colorNeutralForeground1Hover)";
 
 // @public (undocumented)
-export const colorNeutralBackgroundInverted: CSSDesignToken<string>;
+export const colorNeutralForeground1Pressed = "var(--colorNeutralForeground1Pressed)";
 
 // @public (undocumented)
-export const colorNeutralBackgroundInvertedDisabled: CSSDesignToken<string>;
+export const colorNeutralForeground1Selected = "var(--colorNeutralForeground1Selected)";
 
 // @public (undocumented)
-export const colorNeutralBackgroundStatic: CSSDesignToken<string>;
+export const colorNeutralForeground1Static = "var(--colorNeutralForeground1Static)";
 
 // @public (undocumented)
-export const colorNeutralForeground1: CSSDesignToken<string>;
+export const colorNeutralForeground2 = "var(--colorNeutralForeground2)";
 
 // @public (undocumented)
-export const colorNeutralForeground1Hover: CSSDesignToken<string>;
+export const colorNeutralForeground2BrandHover = "var(--colorNeutralForeground2BrandHover)";
 
 // @public (undocumented)
-export const colorNeutralForeground1Pressed: CSSDesignToken<string>;
+export const colorNeutralForeground2BrandPressed = "var(--colorNeutralForeground2BrandPressed)";
 
 // @public (undocumented)
-export const colorNeutralForeground1Selected: CSSDesignToken<string>;
+export const colorNeutralForeground2BrandSelected = "var(--colorNeutralForeground2BrandSelected)";
 
 // @public (undocumented)
-export const colorNeutralForeground1Static: CSSDesignToken<string>;
+export const colorNeutralForeground2Hover = "var(--colorNeutralForeground2Hover)";
 
 // @public (undocumented)
-export const colorNeutralForeground2: CSSDesignToken<string>;
+export const colorNeutralForeground2Link = "var(--colorNeutralForeground2Link)";
 
 // @public (undocumented)
-export const colorNeutralForeground2BrandHover: CSSDesignToken<string>;
+export const colorNeutralForeground2LinkHover = "var(--colorNeutralForeground2LinkHover)";
 
 // @public (undocumented)
-export const colorNeutralForeground2BrandPressed: CSSDesignToken<string>;
+export const colorNeutralForeground2LinkPressed = "var(--colorNeutralForeground2LinkPressed)";
 
 // @public (undocumented)
-export const colorNeutralForeground2BrandSelected: CSSDesignToken<string>;
+export const colorNeutralForeground2LinkSelected = "var(--colorNeutralForeground2LinkSelected)";
 
 // @public (undocumented)
-export const colorNeutralForeground2Hover: CSSDesignToken<string>;
+export const colorNeutralForeground2Pressed = "var(--colorNeutralForeground2Pressed)";
 
 // @public (undocumented)
-export const colorNeutralForeground2Link: CSSDesignToken<string>;
+export const colorNeutralForeground2Selected = "var(--colorNeutralForeground2Selected)";
 
 // @public (undocumented)
-export const colorNeutralForeground2LinkHover: CSSDesignToken<string>;
+export const colorNeutralForeground3 = "var(--colorNeutralForeground3)";
 
 // @public (undocumented)
-export const colorNeutralForeground2LinkPressed: CSSDesignToken<string>;
+export const colorNeutralForeground3BrandHover = "var(--colorNeutralForeground3BrandHover)";
 
 // @public (undocumented)
-export const colorNeutralForeground2LinkSelected: CSSDesignToken<string>;
+export const colorNeutralForeground3BrandPressed = "var(--colorNeutralForeground3BrandPressed)";
 
 // @public (undocumented)
-export const colorNeutralForeground2Pressed: CSSDesignToken<string>;
+export const colorNeutralForeground3BrandSelected = "var(--colorNeutralForeground3BrandSelected)";
 
 // @public (undocumented)
-export const colorNeutralForeground2Selected: CSSDesignToken<string>;
+export const colorNeutralForeground3Hover = "var(--colorNeutralForeground3Hover)";
 
 // @public (undocumented)
-export const colorNeutralForeground3: CSSDesignToken<string>;
+export const colorNeutralForeground3Pressed = "var(--colorNeutralForeground3Pressed)";
 
 // @public (undocumented)
-export const colorNeutralForeground3BrandHover: CSSDesignToken<string>;
+export const colorNeutralForeground3Selected = "var(--colorNeutralForeground3Selected)";
 
 // @public (undocumented)
-export const colorNeutralForeground3BrandPressed: CSSDesignToken<string>;
+export const colorNeutralForeground4 = "var(--colorNeutralForeground4)";
 
 // @public (undocumented)
-export const colorNeutralForeground3BrandSelected: CSSDesignToken<string>;
+export const colorNeutralForegroundDisabled = "var(--colorNeutralForegroundDisabled)";
 
 // @public (undocumented)
-export const colorNeutralForeground3Hover: CSSDesignToken<string>;
+export const colorNeutralForegroundInverted = "var(--colorNeutralForegroundInverted)";
 
 // @public (undocumented)
-export const colorNeutralForeground3Pressed: CSSDesignToken<string>;
+export const colorNeutralForegroundInverted2 = "var(--colorNeutralForegroundInverted2)";
 
 // @public (undocumented)
-export const colorNeutralForeground3Selected: CSSDesignToken<string>;
+export const colorNeutralForegroundInvertedDisabled = "var(--colorNeutralForegroundInvertedDisabled)";
 
 // @public (undocumented)
-export const colorNeutralForeground4: CSSDesignToken<string>;
+export const colorNeutralForegroundInvertedHover = "var(--colorNeutralForegroundInvertedHover)";
 
 // @public (undocumented)
-export const colorNeutralForegroundDisabled: CSSDesignToken<string>;
+export const colorNeutralForegroundInvertedLink = "var(--colorNeutralForegroundInvertedLink)";
 
 // @public (undocumented)
-export const colorNeutralForegroundInverted: CSSDesignToken<string>;
+export const colorNeutralForegroundInvertedLinkHover = "var(--colorNeutralForegroundInvertedLinkHover)";
 
 // @public (undocumented)
-export const colorNeutralForegroundInverted2: CSSDesignToken<string>;
+export const colorNeutralForegroundInvertedLinkPressed = "var(--colorNeutralForegroundInvertedLinkPressed)";
 
 // @public (undocumented)
-export const colorNeutralForegroundInvertedDisabled: CSSDesignToken<string>;
+export const colorNeutralForegroundInvertedLinkSelected = "var(--colorNeutralForegroundInvertedLinkSelected)";
 
 // @public (undocumented)
-export const colorNeutralForegroundInvertedHover: CSSDesignToken<string>;
+export const colorNeutralForegroundInvertedPressed = "var(--colorNeutralForegroundInvertedPressed)";
 
 // @public (undocumented)
-export const colorNeutralForegroundInvertedLink: CSSDesignToken<string>;
+export const colorNeutralForegroundInvertedSelected = "var(--colorNeutralForegroundInvertedSelected)";
 
 // @public (undocumented)
-export const colorNeutralForegroundInvertedLinkHover: CSSDesignToken<string>;
+export const colorNeutralForegroundOnBrand = "var(--colorNeutralForegroundOnBrand)";
 
 // @public (undocumented)
-export const colorNeutralForegroundInvertedLinkPressed: CSSDesignToken<string>;
+export const colorNeutralForegroundStaticInverted = "var(--colorNeutralForegroundStaticInverted)";
 
 // @public (undocumented)
-export const colorNeutralForegroundInvertedLinkSelected: CSSDesignToken<string>;
+export const colorNeutralShadowAmbient = "var(--colorNeutralShadowAmbient)";
 
 // @public (undocumented)
-export const colorNeutralForegroundInvertedPressed: CSSDesignToken<string>;
+export const colorNeutralShadowAmbientDarker = "var(--colorNeutralShadowAmbientDarker)";
 
 // @public (undocumented)
-export const colorNeutralForegroundInvertedSelected: CSSDesignToken<string>;
+export const colorNeutralShadowAmbientLighter = "var(--colorNeutralShadowAmbientLighter)";
 
 // @public (undocumented)
-export const colorNeutralForegroundOnBrand: CSSDesignToken<string>;
+export const colorNeutralShadowKey = "var(--colorNeutralShadowKey)";
 
 // @public (undocumented)
-export const colorNeutralForegroundStaticInverted: CSSDesignToken<string>;
+export const colorNeutralShadowKeyDarker = "var(--colorNeutralShadowKeyDarker)";
 
 // @public (undocumented)
-export const colorNeutralShadowAmbient: CSSDesignToken<string>;
+export const colorNeutralShadowKeyLighter = "var(--colorNeutralShadowKeyLighter)";
 
 // @public (undocumented)
-export const colorNeutralShadowAmbientDarker: CSSDesignToken<string>;
+export const colorNeutralStencil1 = "var(--colorNeutralStencil1)";
 
 // @public (undocumented)
-export const colorNeutralShadowAmbientLighter: CSSDesignToken<string>;
+export const colorNeutralStencil1Alpha = "var(--colorNeutralStencil1Alpha)";
 
 // @public (undocumented)
-export const colorNeutralShadowKey: CSSDesignToken<string>;
+export const colorNeutralStencil2 = "var(--colorNeutralStencil2)";
 
 // @public (undocumented)
-export const colorNeutralShadowKeyDarker: CSSDesignToken<string>;
+export const colorNeutralStencil2Alpha = "var(--colorNeutralStencil2Alpha)";
 
 // @public (undocumented)
-export const colorNeutralShadowKeyLighter: CSSDesignToken<string>;
+export const colorNeutralStroke1 = "var(--colorNeutralStroke1)";
 
 // @public (undocumented)
-export const colorNeutralStencil1: CSSDesignToken<string>;
+export const colorNeutralStroke1Hover = "var(--colorNeutralStroke1Hover)";
 
 // @public (undocumented)
-export const colorNeutralStencil1Alpha: CSSDesignToken<string>;
+export const colorNeutralStroke1Pressed = "var(--colorNeutralStroke1Pressed)";
 
 // @public (undocumented)
-export const colorNeutralStencil2: CSSDesignToken<string>;
+export const colorNeutralStroke1Selected = "var(--colorNeutralStroke1Selected)";
 
 // @public (undocumented)
-export const colorNeutralStencil2Alpha: CSSDesignToken<string>;
+export const colorNeutralStroke2 = "var(--colorNeutralStroke2)";
 
 // @public (undocumented)
-export const colorNeutralStroke1: CSSDesignToken<string>;
+export const colorNeutralStroke3 = "var(--colorNeutralStroke3)";
 
 // @public (undocumented)
-export const colorNeutralStroke1Hover: CSSDesignToken<string>;
+export const colorNeutralStrokeAccessible = "var(--colorNeutralStrokeAccessible)";
 
 // @public (undocumented)
-export const colorNeutralStroke1Pressed: CSSDesignToken<string>;
+export const colorNeutralStrokeAccessibleHover = "var(--colorNeutralStrokeAccessibleHover)";
 
 // @public (undocumented)
-export const colorNeutralStroke1Selected: CSSDesignToken<string>;
+export const colorNeutralStrokeAccessiblePressed = "var(--colorNeutralStrokeAccessiblePressed)";
 
 // @public (undocumented)
-export const colorNeutralStroke2: CSSDesignToken<string>;
+export const colorNeutralStrokeAccessibleSelected = "var(--colorNeutralStrokeAccessibleSelected)";
 
 // @public (undocumented)
-export const colorNeutralStroke3: CSSDesignToken<string>;
+export const colorNeutralStrokeAlpha = "var(--colorNeutralStrokeAlpha)";
 
 // @public (undocumented)
-export const colorNeutralStrokeAccessible: CSSDesignToken<string>;
+export const colorNeutralStrokeAlpha2 = "var(--colorNeutralStrokeAlpha2)";
 
 // @public (undocumented)
-export const colorNeutralStrokeAccessibleHover: CSSDesignToken<string>;
+export const colorNeutralStrokeDisabled = "var(--colorNeutralStrokeDisabled)";
 
 // @public (undocumented)
-export const colorNeutralStrokeAccessiblePressed: CSSDesignToken<string>;
+export const colorNeutralStrokeInvertedDisabled = "var(--colorNeutralStrokeInvertedDisabled)";
 
 // @public (undocumented)
-export const colorNeutralStrokeAccessibleSelected: CSSDesignToken<string>;
+export const colorNeutralStrokeOnBrand = "var(--colorNeutralStrokeOnBrand)";
 
 // @public (undocumented)
-export const colorNeutralStrokeDisabled: CSSDesignToken<string>;
+export const colorNeutralStrokeOnBrand2 = "var(--colorNeutralStrokeOnBrand2)";
 
 // @public (undocumented)
-export const colorNeutralStrokeInvertedDisabled: CSSDesignToken<string>;
+export const colorNeutralStrokeOnBrand2Hover = "var(--colorNeutralStrokeOnBrand2Hover)";
 
 // @public (undocumented)
-export const colorNeutralStrokeOnBrand: CSSDesignToken<string>;
+export const colorNeutralStrokeOnBrand2Pressed = "var(--colorNeutralStrokeOnBrand2Pressed)";
 
 // @public (undocumented)
-export const colorNeutralStrokeOnBrand2: CSSDesignToken<string>;
+export const colorNeutralStrokeOnBrand2Selected = "var(--colorNeutralStrokeOnBrand2Selected)";
 
 // @public (undocumented)
-export const colorNeutralStrokeOnBrand2Hover: CSSDesignToken<string>;
+export const colorNeutralStrokeSubtle = "var(--colorNeutralStrokeSubtle)";
 
 // @public (undocumented)
-export const colorNeutralStrokeOnBrand2Pressed: CSSDesignToken<string>;
+export const colorPaletteAnchorBackground2 = "var(--colorPaletteAnchorBackground2)";
 
 // @public (undocumented)
-export const colorNeutralStrokeOnBrand2Selected: CSSDesignToken<string>;
+export const colorPaletteAnchorBorderActive = "var(--colorPaletteAnchorBorderActive)";
 
 // @public (undocumented)
-export const colorPaletteAnchorBackground2: CSSDesignToken<string>;
+export const colorPaletteAnchorForeground2 = "var(--colorPaletteAnchorForeground2)";
 
 // @public (undocumented)
-export const colorPaletteAnchorBorderActive: CSSDesignToken<string>;
+export const colorPaletteBeigeBackground2 = "var(--colorPaletteBeigeBackground2)";
 
 // @public (undocumented)
-export const colorPaletteAnchorForeground2: CSSDesignToken<string>;
+export const colorPaletteBeigeBorderActive = "var(--colorPaletteBeigeBorderActive)";
 
 // @public (undocumented)
-export const colorPaletteBeigeBackground2: CSSDesignToken<string>;
+export const colorPaletteBeigeForeground2 = "var(--colorPaletteBeigeForeground2)";
 
 // @public (undocumented)
-export const colorPaletteBeigeBorderActive: CSSDesignToken<string>;
+export const colorPaletteBerryBackground1 = "var(--colorPaletteBerryBackground1)";
 
 // @public (undocumented)
-export const colorPaletteBeigeForeground2: CSSDesignToken<string>;
+export const colorPaletteBerryBackground2 = "var(--colorPaletteBerryBackground2)";
 
 // @public (undocumented)
-export const colorPaletteBerryBackground1: CSSDesignToken<string>;
+export const colorPaletteBerryBackground3 = "var(--colorPaletteBerryBackground3)";
 
 // @public (undocumented)
-export const colorPaletteBerryBackground2: CSSDesignToken<string>;
+export const colorPaletteBerryBorder1 = "var(--colorPaletteBerryBorder1)";
 
 // @public (undocumented)
-export const colorPaletteBerryBackground3: CSSDesignToken<string>;
+export const colorPaletteBerryBorder2 = "var(--colorPaletteBerryBorder2)";
 
 // @public (undocumented)
-export const colorPaletteBerryBorder1: CSSDesignToken<string>;
+export const colorPaletteBerryBorderActive = "var(--colorPaletteBerryBorderActive)";
 
 // @public (undocumented)
-export const colorPaletteBerryBorder2: CSSDesignToken<string>;
+export const colorPaletteBerryForeground1 = "var(--colorPaletteBerryForeground1)";
 
 // @public (undocumented)
-export const colorPaletteBerryBorderActive: CSSDesignToken<string>;
+export const colorPaletteBerryForeground2 = "var(--colorPaletteBerryForeground2)";
 
 // @public (undocumented)
-export const colorPaletteBerryForeground1: CSSDesignToken<string>;
+export const colorPaletteBerryForeground3 = "var(--colorPaletteBerryForeground3)";
 
 // @public (undocumented)
-export const colorPaletteBerryForeground2: CSSDesignToken<string>;
+export const colorPaletteBlueBackground2 = "var(--colorPaletteBlueBackground2)";
 
 // @public (undocumented)
-export const colorPaletteBerryForeground3: CSSDesignToken<string>;
+export const colorPaletteBlueBorderActive = "var(--colorPaletteBlueBorderActive)";
 
 // @public (undocumented)
-export const colorPaletteBlueBackground2: CSSDesignToken<string>;
+export const colorPaletteBlueForeground2 = "var(--colorPaletteBlueForeground2)";
 
 // @public (undocumented)
-export const colorPaletteBlueBorderActive: CSSDesignToken<string>;
+export const colorPaletteBrassBackground2 = "var(--colorPaletteBrassBackground2)";
 
 // @public (undocumented)
-export const colorPaletteBlueForeground2: CSSDesignToken<string>;
+export const colorPaletteBrassBorderActive = "var(--colorPaletteBrassBorderActive)";
 
 // @public (undocumented)
-export const colorPaletteBrassBackground2: CSSDesignToken<string>;
+export const colorPaletteBrassForeground2 = "var(--colorPaletteBrassForeground2)";
 
 // @public (undocumented)
-export const colorPaletteBrassBorderActive: CSSDesignToken<string>;
+export const colorPaletteBrownBackground2 = "var(--colorPaletteBrownBackground2)";
 
 // @public (undocumented)
-export const colorPaletteBrassForeground2: CSSDesignToken<string>;
+export const colorPaletteBrownBorderActive = "var(--colorPaletteBrownBorderActive)";
 
 // @public (undocumented)
-export const colorPaletteBrownBackground2: CSSDesignToken<string>;
+export const colorPaletteBrownForeground2 = "var(--colorPaletteBrownForeground2)";
 
 // @public (undocumented)
-export const colorPaletteBrownBorderActive: CSSDesignToken<string>;
+export const colorPaletteCornflowerBackground2 = "var(--colorPaletteCornflowerBackground2)";
 
 // @public (undocumented)
-export const colorPaletteBrownForeground2: CSSDesignToken<string>;
+export const colorPaletteCornflowerBorderActive = "var(--colorPaletteCornflowerBorderActive)";
 
 // @public (undocumented)
-export const colorPaletteCornflowerBackground2: CSSDesignToken<string>;
+export const colorPaletteCornflowerForeground2 = "var(--colorPaletteCornflowerForeground2)";
 
 // @public (undocumented)
-export const colorPaletteCornflowerBorderActive: CSSDesignToken<string>;
+export const colorPaletteCranberryBackground2 = "var(--colorPaletteCranberryBackground2)";
 
 // @public (undocumented)
-export const colorPaletteCornflowerForeground2: CSSDesignToken<string>;
+export const colorPaletteCranberryBorderActive = "var(--colorPaletteCranberryBorderActive)";
 
 // @public (undocumented)
-export const colorPaletteCranberryBackground2: CSSDesignToken<string>;
+export const colorPaletteCranberryForeground2 = "var(--colorPaletteCranberryForeground2)";
 
 // @public (undocumented)
-export const colorPaletteCranberryBorderActive: CSSDesignToken<string>;
+export const colorPaletteDarkGreenBackground2 = "var(--colorPaletteDarkGreenBackground2)";
 
 // @public (undocumented)
-export const colorPaletteCranberryForeground2: CSSDesignToken<string>;
+export const colorPaletteDarkGreenBorderActive = "var(--colorPaletteDarkGreenBorderActive)";
 
 // @public (undocumented)
-export const colorPaletteDarkGreenBackground2: CSSDesignToken<string>;
+export const colorPaletteDarkGreenForeground2 = "var(--colorPaletteDarkGreenForeground2)";
 
 // @public (undocumented)
-export const colorPaletteDarkGreenBorderActive: CSSDesignToken<string>;
+export const colorPaletteDarkOrangeBackground1 = "var(--colorPaletteDarkOrangeBackground1)";
 
 // @public (undocumented)
-export const colorPaletteDarkGreenForeground2: CSSDesignToken<string>;
+export const colorPaletteDarkOrangeBackground2 = "var(--colorPaletteDarkOrangeBackground2)";
 
 // @public (undocumented)
-export const colorPaletteDarkOrangeBackground1: CSSDesignToken<string>;
+export const colorPaletteDarkOrangeBackground3 = "var(--colorPaletteDarkOrangeBackground3)";
 
 // @public (undocumented)
-export const colorPaletteDarkOrangeBackground2: CSSDesignToken<string>;
+export const colorPaletteDarkOrangeBorder1 = "var(--colorPaletteDarkOrangeBorder1)";
 
 // @public (undocumented)
-export const colorPaletteDarkOrangeBackground3: CSSDesignToken<string>;
+export const colorPaletteDarkOrangeBorder2 = "var(--colorPaletteDarkOrangeBorder2)";
 
 // @public (undocumented)
-export const colorPaletteDarkOrangeBorder1: CSSDesignToken<string>;
+export const colorPaletteDarkOrangeBorderActive = "var(--colorPaletteDarkOrangeBorderActive)";
 
 // @public (undocumented)
-export const colorPaletteDarkOrangeBorder2: CSSDesignToken<string>;
+export const colorPaletteDarkOrangeForeground1 = "var(--colorPaletteDarkOrangeForeground1)";
 
 // @public (undocumented)
-export const colorPaletteDarkOrangeBorderActive: CSSDesignToken<string>;
+export const colorPaletteDarkOrangeForeground2 = "var(--colorPaletteDarkOrangeForeground2)";
 
 // @public (undocumented)
-export const colorPaletteDarkOrangeForeground1: CSSDesignToken<string>;
+export const colorPaletteDarkOrangeForeground3 = "var(--colorPaletteDarkOrangeForeground3)";
 
 // @public (undocumented)
-export const colorPaletteDarkOrangeForeground2: CSSDesignToken<string>;
+export const colorPaletteDarkRedBackground2 = "var(--colorPaletteDarkRedBackground2)";
 
 // @public (undocumented)
-export const colorPaletteDarkOrangeForeground3: CSSDesignToken<string>;
+export const colorPaletteDarkRedBorderActive = "var(--colorPaletteDarkRedBorderActive)";
 
 // @public (undocumented)
-export const colorPaletteDarkRedBackground2: CSSDesignToken<string>;
+export const colorPaletteDarkRedForeground2 = "var(--colorPaletteDarkRedForeground2)";
 
 // @public (undocumented)
-export const colorPaletteDarkRedBorderActive: CSSDesignToken<string>;
+export const colorPaletteForestBackground2 = "var(--colorPaletteForestBackground2)";
 
 // @public (undocumented)
-export const colorPaletteDarkRedForeground2: CSSDesignToken<string>;
+export const colorPaletteForestBorderActive = "var(--colorPaletteForestBorderActive)";
 
 // @public (undocumented)
-export const colorPaletteForestBackground2: CSSDesignToken<string>;
+export const colorPaletteForestForeground2 = "var(--colorPaletteForestForeground2)";
 
 // @public (undocumented)
-export const colorPaletteForestBorderActive: CSSDesignToken<string>;
+export const colorPaletteGoldBackground2 = "var(--colorPaletteGoldBackground2)";
 
 // @public (undocumented)
-export const colorPaletteForestForeground2: CSSDesignToken<string>;
+export const colorPaletteGoldBorderActive = "var(--colorPaletteGoldBorderActive)";
 
 // @public (undocumented)
-export const colorPaletteGoldBackground2: CSSDesignToken<string>;
+export const colorPaletteGoldForeground2 = "var(--colorPaletteGoldForeground2)";
 
 // @public (undocumented)
-export const colorPaletteGoldBorderActive: CSSDesignToken<string>;
+export const colorPaletteGrapeBackground2 = "var(--colorPaletteGrapeBackground2)";
 
 // @public (undocumented)
-export const colorPaletteGoldForeground2: CSSDesignToken<string>;
+export const colorPaletteGrapeBorderActive = "var(--colorPaletteGrapeBorderActive)";
 
 // @public (undocumented)
-export const colorPaletteGrapeBackground2: CSSDesignToken<string>;
+export const colorPaletteGrapeForeground2 = "var(--colorPaletteGrapeForeground2)";
 
 // @public (undocumented)
-export const colorPaletteGrapeBorderActive: CSSDesignToken<string>;
+export const colorPaletteGreenBackground1 = "var(--colorPaletteGreenBackground1)";
 
 // @public (undocumented)
-export const colorPaletteGrapeForeground2: CSSDesignToken<string>;
+export const colorPaletteGreenBackground2 = "var(--colorPaletteGreenBackground2)";
 
 // @public (undocumented)
-export const colorPaletteGreenBackground1: CSSDesignToken<string>;
+export const colorPaletteGreenBackground3 = "var(--colorPaletteGreenBackground3)";
 
 // @public (undocumented)
-export const colorPaletteGreenBackground2: CSSDesignToken<string>;
+export const colorPaletteGreenBorder1 = "var(--colorPaletteGreenBorder1)";
 
 // @public (undocumented)
-export const colorPaletteGreenBackground3: CSSDesignToken<string>;
+export const colorPaletteGreenBorder2 = "var(--colorPaletteGreenBorder2)";
 
 // @public (undocumented)
-export const colorPaletteGreenBorder1: CSSDesignToken<string>;
+export const colorPaletteGreenBorderActive = "var(--colorPaletteGreenBorderActive)";
 
 // @public (undocumented)
-export const colorPaletteGreenBorder2: CSSDesignToken<string>;
+export const colorPaletteGreenForeground1 = "var(--colorPaletteGreenForeground1)";
 
 // @public (undocumented)
-export const colorPaletteGreenBorderActive: CSSDesignToken<string>;
+export const colorPaletteGreenForeground2 = "var(--colorPaletteGreenForeground2)";
 
 // @public (undocumented)
-export const colorPaletteGreenForeground1: CSSDesignToken<string>;
+export const colorPaletteGreenForeground3 = "var(--colorPaletteGreenForeground3)";
 
 // @public (undocumented)
-export const colorPaletteGreenForeground2: CSSDesignToken<string>;
+export const colorPaletteGreenForegroundInverted = "var(--colorPaletteGreenForegroundInverted)";
 
 // @public (undocumented)
-export const colorPaletteGreenForeground3: CSSDesignToken<string>;
+export const colorPaletteLavenderBackground2 = "var(--colorPaletteLavenderBackground2)";
 
 // @public (undocumented)
-export const colorPaletteGreenForegroundInverted: CSSDesignToken<string>;
+export const colorPaletteLavenderBorderActive = "var(--colorPaletteLavenderBorderActive)";
 
 // @public (undocumented)
-export const colorPaletteLavenderBackground2: CSSDesignToken<string>;
+export const colorPaletteLavenderForeground2 = "var(--colorPaletteLavenderForeground2)";
 
 // @public (undocumented)
-export const colorPaletteLavenderBorderActive: CSSDesignToken<string>;
+export const colorPaletteLightGreenBackground1 = "var(--colorPaletteLightGreenBackground1)";
 
 // @public (undocumented)
-export const colorPaletteLavenderForeground2: CSSDesignToken<string>;
+export const colorPaletteLightGreenBackground2 = "var(--colorPaletteLightGreenBackground2)";
 
 // @public (undocumented)
-export const colorPaletteLightGreenBackground1: CSSDesignToken<string>;
+export const colorPaletteLightGreenBackground3 = "var(--colorPaletteLightGreenBackground3)";
 
 // @public (undocumented)
-export const colorPaletteLightGreenBackground2: CSSDesignToken<string>;
+export const colorPaletteLightGreenBorder1 = "var(--colorPaletteLightGreenBorder1)";
 
 // @public (undocumented)
-export const colorPaletteLightGreenBackground3: CSSDesignToken<string>;
+export const colorPaletteLightGreenBorder2 = "var(--colorPaletteLightGreenBorder2)";
 
 // @public (undocumented)
-export const colorPaletteLightGreenBorder1: CSSDesignToken<string>;
+export const colorPaletteLightGreenBorderActive = "var(--colorPaletteLightGreenBorderActive)";
 
 // @public (undocumented)
-export const colorPaletteLightGreenBorder2: CSSDesignToken<string>;
+export const colorPaletteLightGreenForeground1 = "var(--colorPaletteLightGreenForeground1)";
 
 // @public (undocumented)
-export const colorPaletteLightGreenBorderActive: CSSDesignToken<string>;
+export const colorPaletteLightGreenForeground2 = "var(--colorPaletteLightGreenForeground2)";
 
 // @public (undocumented)
-export const colorPaletteLightGreenForeground1: CSSDesignToken<string>;
+export const colorPaletteLightGreenForeground3 = "var(--colorPaletteLightGreenForeground3)";
 
 // @public (undocumented)
-export const colorPaletteLightGreenForeground2: CSSDesignToken<string>;
+export const colorPaletteLightTealBackground2 = "var(--colorPaletteLightTealBackground2)";
 
 // @public (undocumented)
-export const colorPaletteLightGreenForeground3: CSSDesignToken<string>;
+export const colorPaletteLightTealBorderActive = "var(--colorPaletteLightTealBorderActive)";
 
 // @public (undocumented)
-export const colorPaletteLightTealBackground2: CSSDesignToken<string>;
+export const colorPaletteLightTealForeground2 = "var(--colorPaletteLightTealForeground2)";
 
 // @public (undocumented)
-export const colorPaletteLightTealBorderActive: CSSDesignToken<string>;
+export const colorPaletteLilacBackground2 = "var(--colorPaletteLilacBackground2)";
 
 // @public (undocumented)
-export const colorPaletteLightTealForeground2: CSSDesignToken<string>;
+export const colorPaletteLilacBorderActive = "var(--colorPaletteLilacBorderActive)";
 
 // @public (undocumented)
-export const colorPaletteLilacBackground2: CSSDesignToken<string>;
+export const colorPaletteLilacForeground2 = "var(--colorPaletteLilacForeground2)";
 
 // @public (undocumented)
-export const colorPaletteLilacBorderActive: CSSDesignToken<string>;
+export const colorPaletteMagentaBackground2 = "var(--colorPaletteMagentaBackground2)";
 
 // @public (undocumented)
-export const colorPaletteLilacForeground2: CSSDesignToken<string>;
+export const colorPaletteMagentaBorderActive = "var(--colorPaletteMagentaBorderActive)";
 
 // @public (undocumented)
-export const colorPaletteMagentaBackground2: CSSDesignToken<string>;
+export const colorPaletteMagentaForeground2 = "var(--colorPaletteMagentaForeground2)";
 
 // @public (undocumented)
-export const colorPaletteMagentaBorderActive: CSSDesignToken<string>;
+export const colorPaletteMarigoldBackground1 = "var(--colorPaletteMarigoldBackground1)";
 
 // @public (undocumented)
-export const colorPaletteMagentaForeground2: CSSDesignToken<string>;
+export const colorPaletteMarigoldBackground2 = "var(--colorPaletteMarigoldBackground2)";
 
 // @public (undocumented)
-export const colorPaletteMarigoldBackground1: CSSDesignToken<string>;
+export const colorPaletteMarigoldBackground3 = "var(--colorPaletteMarigoldBackground3)";
 
 // @public (undocumented)
-export const colorPaletteMarigoldBackground2: CSSDesignToken<string>;
+export const colorPaletteMarigoldBorder1 = "var(--colorPaletteMarigoldBorder1)";
 
 // @public (undocumented)
-export const colorPaletteMarigoldBackground3: CSSDesignToken<string>;
+export const colorPaletteMarigoldBorder2 = "var(--colorPaletteMarigoldBorder2)";
 
 // @public (undocumented)
-export const colorPaletteMarigoldBorder1: CSSDesignToken<string>;
+export const colorPaletteMarigoldBorderActive = "var(--colorPaletteMarigoldBorderActive)";
 
 // @public (undocumented)
-export const colorPaletteMarigoldBorder2: CSSDesignToken<string>;
+export const colorPaletteMarigoldForeground1 = "var(--colorPaletteMarigoldForeground1)";
 
 // @public (undocumented)
-export const colorPaletteMarigoldBorderActive: CSSDesignToken<string>;
+export const colorPaletteMarigoldForeground2 = "var(--colorPaletteMarigoldForeground2)";
 
 // @public (undocumented)
-export const colorPaletteMarigoldForeground1: CSSDesignToken<string>;
+export const colorPaletteMarigoldForeground3 = "var(--colorPaletteMarigoldForeground3)";
 
 // @public (undocumented)
-export const colorPaletteMarigoldForeground2: CSSDesignToken<string>;
+export const colorPaletteMinkBackground2 = "var(--colorPaletteMinkBackground2)";
 
 // @public (undocumented)
-export const colorPaletteMarigoldForeground3: CSSDesignToken<string>;
+export const colorPaletteMinkBorderActive = "var(--colorPaletteMinkBorderActive)";
 
 // @public (undocumented)
-export const colorPaletteMinkBackground2: CSSDesignToken<string>;
+export const colorPaletteMinkForeground2 = "var(--colorPaletteMinkForeground2)";
 
 // @public (undocumented)
-export const colorPaletteMinkBorderActive: CSSDesignToken<string>;
+export const colorPaletteNavyBackground2 = "var(--colorPaletteNavyBackground2)";
 
 // @public (undocumented)
-export const colorPaletteMinkForeground2: CSSDesignToken<string>;
+export const colorPaletteNavyBorderActive = "var(--colorPaletteNavyBorderActive)";
 
 // @public (undocumented)
-export const colorPaletteNavyBackground2: CSSDesignToken<string>;
+export const colorPaletteNavyForeground2 = "var(--colorPaletteNavyForeground2)";
 
 // @public (undocumented)
-export const colorPaletteNavyBorderActive: CSSDesignToken<string>;
+export const colorPalettePeachBackground2 = "var(--colorPalettePeachBackground2)";
 
 // @public (undocumented)
-export const colorPaletteNavyForeground2: CSSDesignToken<string>;
+export const colorPalettePeachBorderActive = "var(--colorPalettePeachBorderActive)";
 
 // @public (undocumented)
-export const colorPalettePeachBackground2: CSSDesignToken<string>;
+export const colorPalettePeachForeground2 = "var(--colorPalettePeachForeground2)";
 
 // @public (undocumented)
-export const colorPalettePeachBorderActive: CSSDesignToken<string>;
+export const colorPalettePinkBackground2 = "var(--colorPalettePinkBackground2)";
 
 // @public (undocumented)
-export const colorPalettePeachForeground2: CSSDesignToken<string>;
+export const colorPalettePinkBorderActive = "var(--colorPalettePinkBorderActive)";
 
 // @public (undocumented)
-export const colorPalettePinkBackground2: CSSDesignToken<string>;
+export const colorPalettePinkForeground2 = "var(--colorPalettePinkForeground2)";
 
 // @public (undocumented)
-export const colorPalettePinkBorderActive: CSSDesignToken<string>;
+export const colorPalettePlatinumBackground2 = "var(--colorPalettePlatinumBackground2)";
 
 // @public (undocumented)
-export const colorPalettePinkForeground2: CSSDesignToken<string>;
+export const colorPalettePlatinumBorderActive = "var(--colorPalettePlatinumBorderActive)";
 
 // @public (undocumented)
-export const colorPalettePlatinumBackground2: CSSDesignToken<string>;
+export const colorPalettePlatinumForeground2 = "var(--colorPalettePlatinumForeground2)";
 
 // @public (undocumented)
-export const colorPalettePlatinumBorderActive: CSSDesignToken<string>;
+export const colorPalettePlumBackground2 = "var(--colorPalettePlumBackground2)";
 
 // @public (undocumented)
-export const colorPalettePlatinumForeground2: CSSDesignToken<string>;
+export const colorPalettePlumBorderActive = "var(--colorPalettePlumBorderActive)";
 
 // @public (undocumented)
-export const colorPalettePlumBackground2: CSSDesignToken<string>;
+export const colorPalettePlumForeground2 = "var(--colorPalettePlumForeground2)";
 
 // @public (undocumented)
-export const colorPalettePlumBorderActive: CSSDesignToken<string>;
+export const colorPalettePumpkinBackground2 = "var(--colorPalettePumpkinBackground2)";
 
 // @public (undocumented)
-export const colorPalettePlumForeground2: CSSDesignToken<string>;
+export const colorPalettePumpkinBorderActive = "var(--colorPalettePumpkinBorderActive)";
 
 // @public (undocumented)
-export const colorPalettePumpkinBackground2: CSSDesignToken<string>;
+export const colorPalettePumpkinForeground2 = "var(--colorPalettePumpkinForeground2)";
 
 // @public (undocumented)
-export const colorPalettePumpkinBorderActive: CSSDesignToken<string>;
+export const colorPalettePurpleBackground2 = "var(--colorPalettePurpleBackground2)";
 
 // @public (undocumented)
-export const colorPalettePumpkinForeground2: CSSDesignToken<string>;
+export const colorPalettePurpleBorderActive = "var(--colorPalettePurpleBorderActive)";
 
 // @public (undocumented)
-export const colorPalettePurpleBackground2: CSSDesignToken<string>;
+export const colorPalettePurpleForeground2 = "var(--colorPalettePurpleForeground2)";
 
 // @public (undocumented)
-export const colorPalettePurpleBorderActive: CSSDesignToken<string>;
+export const colorPaletteRedBackground1 = "var(--colorPaletteRedBackground1)";
 
 // @public (undocumented)
-export const colorPalettePurpleForeground2: CSSDesignToken<string>;
+export const colorPaletteRedBackground2 = "var(--colorPaletteRedBackground2)";
 
 // @public (undocumented)
-export const colorPaletteRedBackground1: CSSDesignToken<string>;
+export const colorPaletteRedBackground3 = "var(--colorPaletteRedBackground3)";
 
 // @public (undocumented)
-export const colorPaletteRedBackground2: CSSDesignToken<string>;
+export const colorPaletteRedBorder1 = "var(--colorPaletteRedBorder1)";
 
 // @public (undocumented)
-export const colorPaletteRedBackground3: CSSDesignToken<string>;
+export const colorPaletteRedBorder2 = "var(--colorPaletteRedBorder2)";
 
 // @public (undocumented)
-export const colorPaletteRedBorder1: CSSDesignToken<string>;
+export const colorPaletteRedBorderActive = "var(--colorPaletteRedBorderActive)";
 
 // @public (undocumented)
-export const colorPaletteRedBorder2: CSSDesignToken<string>;
+export const colorPaletteRedForeground1 = "var(--colorPaletteRedForeground1)";
 
 // @public (undocumented)
-export const colorPaletteRedBorderActive: CSSDesignToken<string>;
+export const colorPaletteRedForeground2 = "var(--colorPaletteRedForeground2)";
 
 // @public (undocumented)
-export const colorPaletteRedForeground1: CSSDesignToken<string>;
+export const colorPaletteRedForeground3 = "var(--colorPaletteRedForeground3)";
 
 // @public (undocumented)
-export const colorPaletteRedForeground2: CSSDesignToken<string>;
+export const colorPaletteRedForegroundInverted = "var(--colorPaletteRedForegroundInverted)";
 
 // @public (undocumented)
-export const colorPaletteRedForeground3: CSSDesignToken<string>;
+export const colorPaletteRoyalBlueBackground2 = "var(--colorPaletteRoyalBlueBackground2)";
 
 // @public (undocumented)
-export const colorPaletteRedForegroundInverted: CSSDesignToken<string>;
+export const colorPaletteRoyalBlueBorderActive = "var(--colorPaletteRoyalBlueBorderActive)";
 
 // @public (undocumented)
-export const colorPaletteRoyalBlueBackground2: CSSDesignToken<string>;
+export const colorPaletteRoyalBlueForeground2 = "var(--colorPaletteRoyalBlueForeground2)";
 
 // @public (undocumented)
-export const colorPaletteRoyalBlueBorderActive: CSSDesignToken<string>;
+export const colorPaletteSeafoamBackground2 = "var(--colorPaletteSeafoamBackground2)";
 
 // @public (undocumented)
-export const colorPaletteRoyalBlueForeground2: CSSDesignToken<string>;
+export const colorPaletteSeafoamBorderActive = "var(--colorPaletteSeafoamBorderActive)";
 
 // @public (undocumented)
-export const colorPaletteSeafoamBackground2: CSSDesignToken<string>;
+export const colorPaletteSeafoamForeground2 = "var(--colorPaletteSeafoamForeground2)";
 
 // @public (undocumented)
-export const colorPaletteSeafoamBorderActive: CSSDesignToken<string>;
+export const colorPaletteSteelBackground2 = "var(--colorPaletteSteelBackground2)";
 
 // @public (undocumented)
-export const colorPaletteSeafoamForeground2: CSSDesignToken<string>;
+export const colorPaletteSteelBorderActive = "var(--colorPaletteSteelBorderActive)";
 
 // @public (undocumented)
-export const colorPaletteSteelBackground2: CSSDesignToken<string>;
+export const colorPaletteSteelForeground2 = "var(--colorPaletteSteelForeground2)";
 
 // @public (undocumented)
-export const colorPaletteSteelBorderActive: CSSDesignToken<string>;
+export const colorPaletteTealBackground2 = "var(--colorPaletteTealBackground2)";
 
 // @public (undocumented)
-export const colorPaletteSteelForeground2: CSSDesignToken<string>;
+export const colorPaletteTealBorderActive = "var(--colorPaletteTealBorderActive)";
 
 // @public (undocumented)
-export const colorPaletteTealBackground2: CSSDesignToken<string>;
+export const colorPaletteTealForeground2 = "var(--colorPaletteTealForeground2)";
 
 // @public (undocumented)
-export const colorPaletteTealBorderActive: CSSDesignToken<string>;
+export const colorPaletteYellowBackground1 = "var(--colorPaletteYellowBackground1)";
 
 // @public (undocumented)
-export const colorPaletteTealForeground2: CSSDesignToken<string>;
+export const colorPaletteYellowBackground2 = "var(--colorPaletteYellowBackground2)";
 
 // @public (undocumented)
-export const colorPaletteYellowBackground1: CSSDesignToken<string>;
+export const colorPaletteYellowBackground3 = "var(--colorPaletteYellowBackground3)";
 
 // @public (undocumented)
-export const colorPaletteYellowBackground2: CSSDesignToken<string>;
+export const colorPaletteYellowBorder1 = "var(--colorPaletteYellowBorder1)";
 
 // @public (undocumented)
-export const colorPaletteYellowBackground3: CSSDesignToken<string>;
+export const colorPaletteYellowBorder2 = "var(--colorPaletteYellowBorder2)";
 
 // @public (undocumented)
-export const colorPaletteYellowBorder1: CSSDesignToken<string>;
+export const colorPaletteYellowBorderActive = "var(--colorPaletteYellowBorderActive)";
 
 // @public (undocumented)
-export const colorPaletteYellowBorder2: CSSDesignToken<string>;
+export const colorPaletteYellowForeground1 = "var(--colorPaletteYellowForeground1)";
 
 // @public (undocumented)
-export const colorPaletteYellowBorderActive: CSSDesignToken<string>;
+export const colorPaletteYellowForeground2 = "var(--colorPaletteYellowForeground2)";
 
 // @public (undocumented)
-export const colorPaletteYellowForeground1: CSSDesignToken<string>;
+export const colorPaletteYellowForeground3 = "var(--colorPaletteYellowForeground3)";
 
 // @public (undocumented)
-export const colorPaletteYellowForeground2: CSSDesignToken<string>;
+export const colorPaletteYellowForegroundInverted = "var(--colorPaletteYellowForegroundInverted)";
 
 // @public (undocumented)
-export const colorPaletteYellowForeground3: CSSDesignToken<string>;
+export const colorScrollbarOverlay = "var(--colorScrollbarOverlay)";
 
 // @public (undocumented)
-export const colorPaletteYellowForegroundInverted: CSSDesignToken<string>;
+export const colorStatusDangerBackground1 = "var(--colorStatusDangerBackground1)";
 
 // @public (undocumented)
-export const colorScrollbarOverlay: CSSDesignToken<string>;
+export const colorStatusDangerBackground2 = "var(--colorStatusDangerBackground2)";
 
 // @public (undocumented)
-export const colorStrokeFocus1: CSSDesignToken<string>;
+export const colorStatusDangerBackground3 = "var(--colorStatusDangerBackground3)";
 
 // @public (undocumented)
-export const colorStrokeFocus2: CSSDesignToken<string>;
+export const colorStatusDangerBackground3Hover = "var(--colorStatusDangerBackground3Hover)";
 
 // @public (undocumented)
-export const colorSubtleBackground: CSSDesignToken<string>;
+export const colorStatusDangerBackground3Pressed = "var(--colorStatusDangerBackground3Pressed)";
 
 // @public (undocumented)
-export const colorSubtleBackgroundHover: CSSDesignToken<string>;
+export const colorStatusDangerBorder1 = "var(--colorStatusDangerBorder1)";
 
 // @public (undocumented)
-export const colorSubtleBackgroundInverted: CSSDesignToken<string>;
+export const colorStatusDangerBorder2 = "var(--colorStatusDangerBorder2)";
 
 // @public (undocumented)
-export const colorSubtleBackgroundInvertedHover: CSSDesignToken<string>;
+export const colorStatusDangerBorderActive = "var(--colorStatusDangerBorderActive)";
 
 // @public (undocumented)
-export const colorSubtleBackgroundInvertedPressed: CSSDesignToken<string>;
+export const colorStatusDangerForeground1 = "var(--colorStatusDangerForeground1)";
 
 // @public (undocumented)
-export const colorSubtleBackgroundInvertedSelected: CSSDesignToken<string>;
+export const colorStatusDangerForeground2 = "var(--colorStatusDangerForeground2)";
 
 // @public (undocumented)
-export const colorSubtleBackgroundLightAlphaHover: CSSDesignToken<string>;
+export const colorStatusDangerForeground3 = "var(--colorStatusDangerForeground3)";
 
 // @public (undocumented)
-export const colorSubtleBackgroundLightAlphaPressed: CSSDesignToken<string>;
+export const colorStatusDangerForegroundInverted = "var(--colorStatusDangerForegroundInverted)";
 
 // @public (undocumented)
-export const colorSubtleBackgroundLightAlphaSelected: CSSDesignToken<string>;
+export const colorStatusSuccessBackground1 = "var(--colorStatusSuccessBackground1)";
 
 // @public (undocumented)
-export const colorSubtleBackgroundPressed: CSSDesignToken<string>;
+export const colorStatusSuccessBackground2 = "var(--colorStatusSuccessBackground2)";
 
 // @public (undocumented)
-export const colorSubtleBackgroundSelected: CSSDesignToken<string>;
+export const colorStatusSuccessBackground3 = "var(--colorStatusSuccessBackground3)";
 
 // @public (undocumented)
-export const colorTransparentBackground: CSSDesignToken<string>;
+export const colorStatusSuccessBorder1 = "var(--colorStatusSuccessBorder1)";
 
 // @public (undocumented)
-export const colorTransparentBackgroundHover: CSSDesignToken<string>;
+export const colorStatusSuccessBorder2 = "var(--colorStatusSuccessBorder2)";
 
 // @public (undocumented)
-export const colorTransparentBackgroundPressed: CSSDesignToken<string>;
+export const colorStatusSuccessBorderActive = "var(--colorStatusSuccessBorderActive)";
 
 // @public (undocumented)
-export const colorTransparentBackgroundSelected: CSSDesignToken<string>;
+export const colorStatusSuccessForeground1 = "var(--colorStatusSuccessForeground1)";
 
 // @public (undocumented)
-export const colorTransparentStroke: CSSDesignToken<string>;
+export const colorStatusSuccessForeground2 = "var(--colorStatusSuccessForeground2)";
 
 // @public (undocumented)
-export const colorTransparentStrokeDisabled: CSSDesignToken<string>;
+export const colorStatusSuccessForeground3 = "var(--colorStatusSuccessForeground3)";
 
 // @public (undocumented)
-export const colorTransparentStrokeInteractive: CSSDesignToken<string>;
+export const colorStatusSuccessForegroundInverted = "var(--colorStatusSuccessForegroundInverted)";
+
+// @public (undocumented)
+export const colorStatusWarningBackground1 = "var(--colorStatusWarningBackground1)";
+
+// @public (undocumented)
+export const colorStatusWarningBackground2 = "var(--colorStatusWarningBackground2)";
+
+// @public (undocumented)
+export const colorStatusWarningBackground3 = "var(--colorStatusWarningBackground3)";
+
+// @public (undocumented)
+export const colorStatusWarningBorder1 = "var(--colorStatusWarningBorder1)";
+
+// @public (undocumented)
+export const colorStatusWarningBorder2 = "var(--colorStatusWarningBorder2)";
+
+// @public (undocumented)
+export const colorStatusWarningBorderActive = "var(--colorStatusWarningBorderActive)";
+
+// @public (undocumented)
+export const colorStatusWarningForeground1 = "var(--colorStatusWarningForeground1)";
+
+// @public (undocumented)
+export const colorStatusWarningForeground2 = "var(--colorStatusWarningForeground2)";
+
+// @public (undocumented)
+export const colorStatusWarningForeground3 = "var(--colorStatusWarningForeground3)";
+
+// @public (undocumented)
+export const colorStatusWarningForegroundInverted = "var(--colorStatusWarningForegroundInverted)";
+
+// @public (undocumented)
+export const colorStrokeFocus1 = "var(--colorStrokeFocus1)";
+
+// @public (undocumented)
+export const colorStrokeFocus2 = "var(--colorStrokeFocus2)";
+
+// @public (undocumented)
+export const colorSubtleBackground = "var(--colorSubtleBackground)";
+
+// @public (undocumented)
+export const colorSubtleBackgroundHover = "var(--colorSubtleBackgroundHover)";
+
+// @public (undocumented)
+export const colorSubtleBackgroundInverted = "var(--colorSubtleBackgroundInverted)";
+
+// @public (undocumented)
+export const colorSubtleBackgroundInvertedHover = "var(--colorSubtleBackgroundInvertedHover)";
+
+// @public (undocumented)
+export const colorSubtleBackgroundInvertedPressed = "var(--colorSubtleBackgroundInvertedPressed)";
+
+// @public (undocumented)
+export const colorSubtleBackgroundInvertedSelected = "var(--colorSubtleBackgroundInvertedSelected)";
+
+// @public (undocumented)
+export const colorSubtleBackgroundLightAlphaHover = "var(--colorSubtleBackgroundLightAlphaHover)";
+
+// @public (undocumented)
+export const colorSubtleBackgroundLightAlphaPressed = "var(--colorSubtleBackgroundLightAlphaPressed)";
+
+// @public (undocumented)
+export const colorSubtleBackgroundLightAlphaSelected = "var(--colorSubtleBackgroundLightAlphaSelected)";
+
+// @public (undocumented)
+export const colorSubtleBackgroundPressed = "var(--colorSubtleBackgroundPressed)";
+
+// @public (undocumented)
+export const colorSubtleBackgroundSelected = "var(--colorSubtleBackgroundSelected)";
+
+// @public (undocumented)
+export const colorTransparentBackground = "var(--colorTransparentBackground)";
+
+// @public (undocumented)
+export const colorTransparentBackgroundHover = "var(--colorTransparentBackgroundHover)";
+
+// @public (undocumented)
+export const colorTransparentBackgroundPressed = "var(--colorTransparentBackgroundPressed)";
+
+// @public (undocumented)
+export const colorTransparentBackgroundSelected = "var(--colorTransparentBackgroundSelected)";
+
+// @public (undocumented)
+export const colorTransparentStroke = "var(--colorTransparentStroke)";
+
+// @public (undocumented)
+export const colorTransparentStrokeDisabled = "var(--colorTransparentStrokeDisabled)";
+
+// @public (undocumented)
+export const colorTransparentStrokeInteractive = "var(--colorTransparentStrokeInteractive)";
 
 // @public
 export class CompoundButton extends Button {
@@ -1415,7 +1679,7 @@ export const CompoundButtonAppearance: {
 // @public
 export type CompoundButtonAppearance = ValuesOf<typeof CompoundButtonAppearance>;
 
-// @public
+// @public (undocumented)
 export const CompoundButtonDefinition: FASTElementDefinition<typeof CompoundButton>;
 
 // @public
@@ -1492,14 +1756,9 @@ export const CounterBadgeColor: {
 // @public
 export type CounterBadgeColor = ValuesOf<typeof CounterBadgeColor>;
 
-// @public
+// @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";
@@ -1529,37 +1788,89 @@ export const CounterBadgeStyles: ElementStyles;
 export const CounterBadgeTemplate: ElementViewTemplate<CounterBadge>;
 
 // @public (undocumented)
-export const curveAccelerateMax: CSSDesignToken<string>;
+export const curveAccelerateMax = "var(--curveAccelerateMax)";
+
+// @public (undocumented)
+export const curveAccelerateMid = "var(--curveAccelerateMid)";
 
 // @public (undocumented)
-export const curveAccelerateMid: CSSDesignToken<string>;
+export const curveAccelerateMin = "var(--curveAccelerateMin)";
 
 // @public (undocumented)
-export const curveAccelerateMin: CSSDesignToken<string>;
+export const curveDecelerateMax = "var(--curveDecelerateMax)";
 
 // @public (undocumented)
-export const curveDecelerateMax: CSSDesignToken<string>;
+export const curveDecelerateMid = "var(--curveDecelerateMid)";
 
 // @public (undocumented)
-export const curveDecelerateMid: CSSDesignToken<string>;
+export const curveDecelerateMin = "var(--curveDecelerateMin)";
 
 // @public (undocumented)
-export const curveDecelerateMin: CSSDesignToken<string>;
+export const curveEasyEase = "var(--curveEasyEase)";
 
 // @public (undocumented)
-export const curveEasyEase: CSSDesignToken<string>;
+export const curveEasyEaseMax = "var(--curveEasyEaseMax)";
 
 // @public (undocumented)
-export const curveEasyEaseMax: CSSDesignToken<string>;
+export const curveLinear = "var(--curveLinear)";
+
+// @public
+export const darkModeStylesheetBehavior: (styles: ElementStyles) => MatchMediaStyleSheetBehavior;
+
+// @public
+export class Dialog extends FASTElement {
+    ariaDescribedby?: string;
+    ariaLabelledby?: string;
+    connectedCallback(): void;
+    defaultTitleAction?: Button;
+    dialog: HTMLDialogElement;
+    disconnectedCallback(): void;
+    dismiss(): void;
+    handleClick(event: Event): boolean;
+    handleKeydown: (e: KeyboardEvent) => boolean | void;
+    hide(dismissed?: boolean): void;
+    modalType: DialogModalType;
+    modalTypeChanged(oldValue: DialogModalType, newValue: DialogModalType): void;
+    noTitleAction: boolean;
+    onOpenChangeEvent: (dismissed?: boolean) => void;
+    open: boolean;
+    openChanged(oldValue: boolean, newValue: boolean): void;
+    setComponent(): void;
+    show(): void;
+    titleAction: HTMLElement[];
+}
+
+// @public
+export const DialogDefinition: FASTElementDefinition<typeof Dialog>;
+
+// @public
+export const DialogModalType: {
+    readonly modal: "modal";
+    readonly nonModal: "non-modal";
+    readonly alert: "alert";
+};
 
 // @public (undocumented)
-export const curveLinear: CSSDesignToken<string>;
+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;
 
 // @public
-export class Divider extends FASTDivider {
+export class Divider extends FASTElement {
     alignContent?: DividerAlignContent;
     appearance?: DividerAppearance;
     inset?: boolean;
+    orientation: DividerOrientation;
+    role: DividerRole;
 }
 
 // @public
@@ -1586,9 +1897,26 @@ export type DividerAppearance = ValuesOf<typeof DividerAppearance>;
 // @public
 export const DividerDefinition: FASTElementDefinition<typeof Divider>;
 
-export { DividerOrientation }
+// @public
+export const DividerOrientation: {
+    readonly horizontal: "horizontal"; /**
+    * Divider roles
+    * @public
+    */
+    readonly vertical: "vertical";
+};
+
+// @public
+export type DividerOrientation = ValuesOf<typeof DividerOrientation>;
 
-export { DividerRole }
+// @public
+export const DividerRole: {
+    readonly separator: "separator";
+    readonly presentation: "presentation";
+};
+
+// @public
+export type DividerRole = ValuesOf<typeof DividerRole>;
 
 // @public
 export const DividerStyles: ElementStyles;
@@ -1597,25 +1925,28 @@ export const DividerStyles: ElementStyles;
 export const DividerTemplate: ElementViewTemplate<Divider>;
 
 // @public (undocumented)
-export const durationFast: CSSDesignToken<string>;
+export const durationFast = "var(--durationFast)";
 
 // @public (undocumented)
-export const durationFaster: CSSDesignToken<string>;
+export const durationFaster = "var(--durationFaster)";
 
 // @public (undocumented)
-export const durationNormal: CSSDesignToken<string>;
+export const durationGentle = "var(--durationGentle)";
 
 // @public (undocumented)
-export const durationSlow: CSSDesignToken<string>;
+export const durationNormal = "var(--durationNormal)";
 
 // @public (undocumented)
-export const durationSlower: CSSDesignToken<string>;
+export const durationSlow = "var(--durationSlow)";
 
 // @public (undocumented)
-export const durationUltraFast: CSSDesignToken<string>;
+export const durationSlower = "var(--durationSlower)";
 
 // @public (undocumented)
-export const durationUltraSlow: CSSDesignToken<string>;
+export const durationUltraFast = "var(--durationUltraFast)";
+
+// @public (undocumented)
+export const durationUltraSlow = "var(--durationUltraSlow)";
 
 // @public (undocumented)
 export const FluentDesignSystem: Readonly<{
@@ -1625,55 +1956,61 @@ export const FluentDesignSystem: Readonly<{
 }>;
 
 // @public (undocumented)
-export const fontFamilyBase: CSSDesignToken<string>;
+export const fontFamilyBase = "var(--fontFamilyBase)";
 
 // @public (undocumented)
-export const fontFamilyMonospace: CSSDesignToken<string>;
+export const fontFamilyMonospace = "var(--fontFamilyMonospace)";
 
 // @public (undocumented)
-export const fontFamilyNumeric: CSSDesignToken<string>;
+export const fontFamilyNumeric = "var(--fontFamilyNumeric)";
 
 // @public (undocumented)
-export const fontSizeBase100: CSSDesignToken<string>;
+export const fontSizeBase100 = "var(--fontSizeBase100)";
 
 // @public (undocumented)
-export const fontSizeBase200: CSSDesignToken<string>;
+export const fontSizeBase200 = "var(--fontSizeBase200)";
 
 // @public (undocumented)
-export const fontSizeBase300: CSSDesignToken<string>;
+export const fontSizeBase300 = "var(--fontSizeBase300)";
 
 // @public (undocumented)
-export const fontSizeBase400: CSSDesignToken<string>;
+export const fontSizeBase400 = "var(--fontSizeBase400)";
 
 // @public (undocumented)
-export const fontSizeBase500: CSSDesignToken<string>;
+export const fontSizeBase500 = "var(--fontSizeBase500)";
 
 // @public (undocumented)
-export const fontSizeBase600: CSSDesignToken<string>;
+export const fontSizeBase600 = "var(--fontSizeBase600)";
 
 // @public (undocumented)
-export const fontSizeHero1000: CSSDesignToken<string>;
+export const fontSizeHero1000 = "var(--fontSizeHero1000)";
 
 // @public (undocumented)
-export const fontSizeHero700: CSSDesignToken<string>;
+export const fontSizeHero700 = "var(--fontSizeHero700)";
 
 // @public (undocumented)
-export const fontSizeHero800: CSSDesignToken<string>;
+export const fontSizeHero800 = "var(--fontSizeHero800)";
 
 // @public (undocumented)
-export const fontSizeHero900: CSSDesignToken<string>;
+export const fontSizeHero900 = "var(--fontSizeHero900)";
 
 // @public (undocumented)
-export const fontWeightBold: CSSDesignToken<string>;
+export const fontWeightBold = "var(--fontWeightBold)";
 
 // @public (undocumented)
-export const fontWeightMedium: CSSDesignToken<string>;
+export const fontWeightMedium = "var(--fontWeightMedium)";
 
 // @public (undocumented)
-export const fontWeightRegular: CSSDesignToken<string>;
+export const fontWeightRegular = "var(--fontWeightRegular)";
 
 // @public (undocumented)
-export const fontWeightSemibold: CSSDesignToken<string>;
+export const fontWeightSemibold = "var(--fontWeightSemibold)";
+
+// @public
+export const forcedColorsStylesheetBehavior: (styles: ElementStyles) => MatchMediaStyleSheetBehavior;
+
+// @public
+export const getDirection: (rootNode: HTMLElement) => Direction;
 
 // @public
 class Image_2 extends FASTElement {
@@ -1720,68 +2057,142 @@ 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: CSSDesignToken<string>;
+export const lineHeightBase100 = "var(--lineHeightBase100)";
 
 // @public (undocumented)
-export const lineHeightBase200: CSSDesignToken<string>;
+export const lineHeightBase200 = "var(--lineHeightBase200)";
 
 // @public (undocumented)
-export const lineHeightBase300: CSSDesignToken<string>;
+export const lineHeightBase300 = "var(--lineHeightBase300)";
 
 // @public (undocumented)
-export const lineHeightBase400: CSSDesignToken<string>;
+export const lineHeightBase400 = "var(--lineHeightBase400)";
 
 // @public (undocumented)
-export const lineHeightBase500: CSSDesignToken<string>;
+export const lineHeightBase500 = "var(--lineHeightBase500)";
 
 // @public (undocumented)
-export const lineHeightBase600: CSSDesignToken<string>;
+export const lineHeightBase600 = "var(--lineHeightBase600)";
 
 // @public (undocumented)
-export const lineHeightHero1000: CSSDesignToken<string>;
+export const lineHeightHero1000 = "var(--lineHeightHero1000)";
 
 // @public (undocumented)
-export const lineHeightHero700: CSSDesignToken<string>;
+export const lineHeightHero700 = "var(--lineHeightHero700)";
 
 // @public (undocumented)
-export const lineHeightHero800: CSSDesignToken<string>;
+export const lineHeightHero800 = "var(--lineHeightHero800)";
 
 // @public (undocumented)
-export const lineHeightHero900: CSSDesignToken<string>;
+export const lineHeightHero900 = "var(--lineHeightHero900)";
 
 // @public
-export class MenuButton extends Button {
+export abstract class MatchMediaBehavior implements HostBehavior {
+    constructor(query: MediaQueryList);
+    connectedCallback(controller: HostController): void;
+    protected abstract constructListener(controller: HostController): MediaQueryListListener;
+    disconnectedCallback(controller: HostController): void;
+    readonly query: MediaQueryList;
 }
 
 // @public
-export const MenuButtonAppearance: {
-    readonly primary: "primary";
-    readonly outline: "outline";
-    readonly subtle: "subtle";
-    readonly secondary: "secondary";
-    readonly transparent: "transparent";
-};
-
+export class MatchMediaStyleSheetBehavior extends MatchMediaBehavior {
+    constructor(query: MediaQueryList, styles: ElementStyles);
+    protected constructListener(controller: HostController): MediaQueryListListener;
+    readonly query: MediaQueryList;
+    // @internal
+    removedCallback(controller: HostController<any>): void;
+    readonly styles: ElementStyles;
+    static with(query: MediaQueryList): (styles: ElementStyles) => MatchMediaStyleSheetBehavior;
+}
+
 // @public
-export type MenuButtonAppearance = ValuesOf<typeof MenuButtonAppearance>;
+export type MediaQueryListListener = (this: MediaQueryList, ev?: MediaQueryListEvent) => void;
+
+// @public
+export class Menu extends FASTElement {
+    cleanup?: () => void;
+    closeMenu: () => void;
+    closeOnScroll?: boolean;
+    closeOnScrollChanged(oldValue: boolean, newValue: boolean): void;
+    connectedCallback(): void;
+    disconnectedCallback(): void;
+    focusMenuList(): void;
+    focusTrigger(): void;
+    handleMenuKeydown(e: KeyboardEvent): boolean | void;
+    handleTriggerKeydown: (e: KeyboardEvent) => boolean | void;
+    open: boolean;
+    openChanged(oldValue: boolean, newValue: boolean): void;
+    openMenu: (e?: Event) => void;
+    openOnContext?: boolean;
+    openOnContextChanged(oldValue: boolean, newValue: boolean): void;
+    openOnHover?: boolean;
+    openOnHoverChanged(oldValue: boolean, newValue: boolean): void;
+    persistOnItemClick?: boolean;
+    persistOnItemClickChanged(oldValue: boolean, newValue: boolean): void;
+    // @internal
+    positioningContainer?: HTMLElement;
+    setComponent(): void;
+    protected setPositioning(): void;
+    protected setPositioningTask: () => void;
+    slottedMenuList: MenuList[];
+    slottedTriggers: HTMLElement[];
+    toggleMenu: () => void;
+}
+
+// @public
+export class MenuButton extends Button {
+}
 
 // @public
+export const MenuButtonAppearance: {
+    readonly primary: "primary";
+    readonly outline: "outline";
+    readonly subtle: "subtle";
+    readonly secondary: "secondary";
+    readonly transparent: "transparent";
+};
+
+// @public
+export type MenuButtonAppearance = ValuesOf<typeof MenuButtonAppearance>;
+
+// @public (undocumented)
 export const MenuButtonDefinition: FASTElementDefinition<typeof MenuButton>;
 
 // @public
@@ -1808,16 +2219,73 @@ export type MenuButtonSize = ValuesOf<typeof MenuButtonSize>;
 export const MenuButtonTemplate: ElementViewTemplate<MenuButton>;
 
 // @public
-export class MenuItem extends FASTMenuItem {
+export const MenuDefinition: FASTElementDefinition<typeof Menu>;
+
+// Warning: (ae-internal-mixed-release-tag) Mixed release tags are not allowed for "MenuItem" because one of its declarations is marked as @internal
+//
+// @public
+export class MenuItem extends FASTElement {
+    checked: boolean;
+    // (undocumented)
+    protected checkedChanged(oldValue: boolean, newValue: boolean): void;
+    cleanup: () => void;
+    disabled: boolean;
+    // @internal (undocumented)
+    disconnectedCallback(): void;
+    expanded: boolean;
+    // (undocumented)
+    protected expandedChanged(prev: boolean | undefined, next: boolean): void;
+    // @internal (undocumented)
+    handleMenuItemClick: (e: MouseEvent) => boolean;
+    // @internal (undocumented)
+    handleMenuItemKeyDown: (e: KeyboardEvent) => boolean;
+    // @internal (undocumented)
+    handleMouseOut: (e: MouseEvent) => boolean;
+    // @internal (undocumented)
+    handleMouseOver: (e: MouseEvent) => boolean;
+    // @internal (undocumented)
+    get hasSubmenu(): boolean;
+    hidden: boolean;
+    role: MenuItemRole;
+    // @internal
+    slottedSubmenu: HTMLElement[];
+    // @internal
+    protected slottedSubmenuChanged(prev: HTMLElement[] | undefined, next: HTMLElement[]): void;
+    // @internal (undocumented)
+    submenu: HTMLElement | undefined;
+    // @internal
+    submenuContainer: HTMLDivElement;
+    // @internal (undocumented)
+    submenuLoaded: () => void;
+    updateSubmenu(): void;
+}
+
+// @internal
+export interface MenuItem extends StartEnd {
 }
 
 // @public (undocumented)
 export type MenuItemColumnCount = 0 | 1 | 2;
 
-// @public
+// @public (undocumented)
 export const MenuItemDefinition: FASTElementDefinition<typeof MenuItem>;
 
-export { MenuItemRole }
+// @public
+export type MenuItemOptions = StartEndOptions<MenuItem> & {
+    checkboxIndicator?: StaticallyComposableHTML<MenuItem>;
+    expandCollapseGlyph?: StaticallyComposableHTML<MenuItem>;
+    radioIndicator?: StaticallyComposableHTML<MenuItem>;
+};
+
+// @public
+export const MenuItemRole: {
+    readonly menuitem: "menuitem";
+    readonly menuitemcheckbox: "menuitemcheckbox";
+    readonly menuitemradio: "menuitemradio";
+};
+
+// @public
+export type MenuItemRole = ValuesOf<typeof MenuItemRole>;
 
 // @public
 export const MenuItemStyles: ElementStyles;
@@ -1826,12 +2294,33 @@ export const MenuItemStyles: ElementStyles;
 export const MenuItemTemplate: ElementViewTemplate<MenuItem>;
 
 // @public
-export class MenuList extends FASTMenu {
+export class MenuList extends FASTElement {
+    collapseExpandedItem(): void;
+    // @internal (undocumented)
+    connectedCallback(): void;
+    // @internal (undocumented)
+    disconnectedCallback(): void;
+    focus(): void;
+    // (undocumented)
+    handleChange(source: any, propertyName: string): void;
+    // @internal
+    handleFocusOut: (e: FocusEvent) => void;
+    // @internal (undocumented)
+    handleMenuKeyDown(e: KeyboardEvent): void | boolean;
+    protected isMenuItemElement: (el: Element) => el is HTMLElement;
+    // @internal (undocumented)
+    readonly isNestedMenu: () => boolean;
+    // @internal (undocumented)
+    items: HTMLElement[];
+    // (undocumented)
+    protected itemsChanged(oldValue: HTMLElement[], newValue: HTMLElement[]): void;
+    // (undocumented)
+    protected menuItems: Element[] | undefined;
     // (undocumented)
     protected setItems(): void;
 }
 
-// @public
+// @public (undocumented)
 export const MenuListDefinition: FASTElementDefinition<typeof MenuList>;
 
 // @public
@@ -1841,15 +2330,22 @@ export const MenuListStyles: ElementStyles;
 export const MenuListTemplate: ElementViewTemplate<MenuList>;
 
 // @public
-class ProgressBar_2 extends FASTProgress {
+export const MenuStyles: ElementStyles;
+
+// @public (undocumented)
+export const MenuTemplate: ElementViewTemplate<Menu>;
+
+// Warning: (ae-forgotten-export) The symbol "BaseProgress" needs to be exported by the entry point index.d.ts
+//
+// @public
+export class ProgressBar extends BaseProgress {
     shape?: ProgressBarShape;
     thickness?: ProgressBarThickness;
     validationState: ProgressBarValidationState | null;
 }
-export { ProgressBar_2 as ProgressBar }
 
 // @public
-export const ProgressBarDefinition: FASTElementDefinition<typeof ProgressBar_2>;
+export const ProgressBarDefinition: FASTElementDefinition<typeof ProgressBar>;
 
 // @public
 export const ProgressBarShape: {
@@ -1864,7 +2360,7 @@ export type ProgressBarShape = ValuesOf<typeof ProgressBarShape>;
 export const ProgressBarStyles: ElementStyles;
 
 // @public (undocumented)
-export const ProgressBarTemplate: ElementViewTemplate<ProgressBar_2>;
+export const ProgressBarTemplate: ElementViewTemplate<ProgressBar>;
 
 // @public
 export const ProgressBarThickness: {
@@ -1886,21 +2382,81 @@ export const ProgressBarValidationState: {
 export type ProgressBarValidationState = ValuesOf<typeof ProgressBarValidationState>;
 
 // @public
-export class Radio extends FASTRadio {
+export type ProgressOptions = {
+    indeterminateIndicator1?: StaticallyComposableHTML<ProgressBar>;
+    indeterminateIndicator2?: StaticallyComposableHTML<ProgressBar>;
+};
+
+// Warning: (ae-forgotten-export) The symbol "FormAssociatedRadio" needs to be exported by the entry point index.d.ts
+//
+// @public
+export class Radio extends FormAssociatedRadio implements RadioControl {
+    constructor();
+    // @internal (undocumented)
+    connectedCallback(): void;
+    // @internal (undocumented)
+    defaultCheckedChanged(): void;
+    // @internal (undocumented)
+    defaultSlottedNodes: Node[];
+    // @internal
+    initialValue: string;
+    // @beta
+    keypressHandler(e: KeyboardEvent): boolean | void;
+    name: string;
 }
 
+// @public (undocumented)
+export type RadioControl = Pick<HTMLInputElement, 'checked' | 'disabled' | 'focus' | 'setAttribute' | 'getAttribute'>;
+
 // @public
 export const RadioDefinition: FASTElementDefinition<typeof Radio>;
 
 // @public
-export class RadioGroup extends FASTRadioGroup {
+export class RadioGroup extends FASTElement {
+    // (undocumented)
+    childItems: HTMLElement[];
+    // @internal (undocumented)
+    clickHandler: (e: MouseEvent) => void | boolean;
+    // @internal (undocumented)
+    connectedCallback(): void;
+    disabled: boolean;
+    // (undocumented)
+    disconnectedCallback(): void;
+    // @internal (undocumented)
+    focusOutHandler: (e: FocusEvent) => boolean | void;
+    // @internal (undocumented)
+    handleDisabledClick: (e: MouseEvent) => void | boolean;
+    // @internal
+    keydownHandler: (e: KeyboardEvent) => boolean | void;
+    name: string;
+    // (undocumented)
+    protected nameChanged(): void;
+    orientation: RadioGroupOrientation;
+    readOnly: boolean;
+    // @internal (undocumented)
+    slottedRadioButtons: HTMLElement[];
+    // (undocumented)
+    protected slottedRadioButtonsChanged(oldValue: unknown, newValue: HTMLElement[]): void;
     stacked: boolean;
+    value: string;
+    // (undocumented)
+    protected valueChanged(): void;
 }
 
 // @public
 export const RadioGroupDefinition: FASTElementDefinition<typeof RadioGroup>;
 
-export { RadioGroupOrientation }
+// @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;
@@ -1908,69 +2464,171 @@ export const RadioGroupStyles: ElementStyles;
 // @public (undocumented)
 export const RadioGroupTemplate: ElementViewTemplate<RadioGroup>;
 
+// @public
+export type RadioOptions = {
+    checkedIndicator?: StaticallyComposableHTML<Radio>;
+};
+
 // @public
 export const RadioStyles: ElementStyles;
 
 // @public (undocumented)
 export const RadioTemplate: ElementViewTemplate<Radio>;
 
+// Warning: (ae-internal-missing-underscore) The name "roleForMenuItem" should be prefixed with an underscore because the declaration is marked as @internal
+//
+// @internal (undocumented)
+export const roleForMenuItem: {
+    [value in keyof typeof MenuItemRole]: (typeof MenuItemRole)[value];
+};
+
 // @public
 export const setTheme: (theme: Theme) => void;
 
 // @public (undocumented)
-export const setThemeFor: (element: FASTElement, theme: Theme) => void;
+export const setThemeFor: (element: HTMLElement, theme: Theme) => void;
 
 // @public (undocumented)
-export const shadow16: CSSDesignToken<string>;
+export const shadow16 = "var(--shadow16)";
 
 // @public (undocumented)
-export const shadow16Brand: CSSDesignToken<string>;
+export const shadow16Brand = "var(--shadow16Brand)";
 
 // @public (undocumented)
-export const shadow2: CSSDesignToken<string>;
+export const shadow2 = "var(--shadow2)";
 
 // @public (undocumented)
-export const shadow28: CSSDesignToken<string>;
+export const shadow28 = "var(--shadow28)";
 
 // @public (undocumented)
-export const shadow28Brand: CSSDesignToken<string>;
+export const shadow28Brand = "var(--shadow28Brand)";
 
 // @public (undocumented)
-export const shadow2Brand: CSSDesignToken<string>;
+export const shadow2Brand = "var(--shadow2Brand)";
 
 // @public (undocumented)
-export const shadow4: CSSDesignToken<string>;
+export const shadow4 = "var(--shadow4)";
 
 // @public (undocumented)
-export const shadow4Brand: CSSDesignToken<string>;
+export const shadow4Brand = "var(--shadow4Brand)";
 
 // @public (undocumented)
-export const shadow64: CSSDesignToken<string>;
+export const shadow64 = "var(--shadow64)";
 
 // @public (undocumented)
-export const shadow64Brand: CSSDesignToken<string>;
+export const shadow64Brand = "var(--shadow64Brand)";
 
 // @public (undocumented)
-export const shadow8: CSSDesignToken<string>;
+export const shadow8 = "var(--shadow8)";
 
 // @public (undocumented)
-export const shadow8Brand: CSSDesignToken<string>;
+export const shadow8Brand = "var(--shadow8Brand)";
 
+// Warning: (ae-forgotten-export) The symbol "FormAssociatedSlider" needs to be exported by the entry point index.d.ts
+//
 // @public
-export class Slider extends FASTSlider {
-    // (undocumented)
+export class Slider extends FormAssociatedSlider implements SliderConfiguration {
+    // @internal
+    calculateNewValue(rawValue: number): number;
+    // @internal (undocumented)
     connectedCallback(): void;
-    // (undocumented)
+    decrement(): void;
+    // @internal (undocumented)
+    direction: Direction;
+    // @internal (undocumented)
     disconnectedCallback(): void;
     // (undocumented)
     handleChange(source: any, propertyName: string): void;
+    // (undocumented)
+    handleMouseDown: (e: MouseEvent | null) => void;
+    handleThumbMouseDown: (event: MouseEvent | null) => void;
+    increment(): void;
+    // @internal (undocumented)
+    initialValue: string;
+    // @internal (undocumented)
+    isDragging: boolean;
+    // (undocumented)
+    keypressHandler: (e: KeyboardEvent) => void;
+    max: number;
+    // (undocumented)
+    protected maxChanged(): void;
+    min: number;
+    // (undocumented)
+    protected minChanged(): void;
+    mode: SliderMode;
+    orientation: Orientation;
+    // (undocumented)
+    protected orientationChanged(): void;
+    // @internal (undocumented)
+    position: string;
+    readOnly: boolean;
+    // (undocumented)
+    protected readOnlyChanged(): void;
     size?: SliderSize;
+    step: number | undefined;
+    // (undocumented)
+    protected stepChanged(): void;
+    // @internal (undocumented)
+    stepMultiplier: number;
+    // @internal (undocumented)
+    thumb: HTMLDivElement;
+    // @internal (undocumented)
+    track: HTMLDivElement;
+    // @internal (undocumented)
+    trackHeight: number;
+    // @internal (undocumented)
+    trackLeft: number;
+    // @internal (undocumented)
+    trackMinHeight: number;
+    // @internal (undocumented)
+    trackMinWidth: number;
+    // @internal (undocumented)
+    trackWidth: number;
+    get valueAsNumber(): number;
+    set valueAsNumber(next: number);
+    // @internal (undocumented)
+    valueChanged(previous: string, next: string): void;
+    valueTextFormatter: (value: string) => string | null;
+}
+
+// @public (undocumented)
+export interface SliderConfiguration {
+    // (undocumented)
+    direction?: Direction;
+    // (undocumented)
+    disabled?: boolean;
+    // (undocumented)
+    max: number;
+    // (undocumented)
+    min: number;
+    // (undocumented)
+    orientation?: SliderOrientation;
 }
 
 // @public
 export const SliderDefinition: FASTElementDefinition<typeof Slider>;
 
-export { SliderOrientation }
+// @public (undocumented)
+export const SliderMode: {
+    readonly singleValue: "single-value";
+};
+
+// @public
+export type SliderMode = ValuesOf<typeof SliderMode>;
+
+// @public
+export type SliderOptions = {
+    thumb?: StaticallyComposableHTML<Slider>;
+};
+
+// @public (undocumented)
+export const SliderOrientation: {
+    readonly horizontal: "horizontal";
+    readonly vertical: "vertical";
+};
+
+// @public
+export type SliderOrientation = ValuesOf<typeof SliderOrientation>;
 
 // @public
 export const SliderSize: {
@@ -1985,77 +2643,80 @@ export type SliderSize = ValuesOf<typeof SliderSize>;
 export const SliderStyles: ElementStyles;
 
 // @public (undocumented)
-export const SliderTemplate: ElementViewTemplate<FASTSlider>;
+export const SliderTemplate: ElementViewTemplate<Slider>;
 
 // @public (undocumented)
-export const spacingHorizontalL: CSSDesignToken<string>;
+export const spacingHorizontalL = "var(--spacingHorizontalL)";
 
 // @public (undocumented)
-export const spacingHorizontalM: CSSDesignToken<string>;
+export const spacingHorizontalM = "var(--spacingHorizontalM)";
 
 // @public (undocumented)
-export const spacingHorizontalMNudge: CSSDesignToken<string>;
+export const spacingHorizontalMNudge = "var(--spacingHorizontalMNudge)";
 
 // @public (undocumented)
-export const spacingHorizontalNone: CSSDesignToken<string>;
+export const spacingHorizontalNone = "var(--spacingHorizontalNone)";
 
 // @public (undocumented)
-export const spacingHorizontalS: CSSDesignToken<string>;
+export const spacingHorizontalS = "var(--spacingHorizontalS)";
 
 // @public (undocumented)
-export const spacingHorizontalSNudge: CSSDesignToken<string>;
+export const spacingHorizontalSNudge = "var(--spacingHorizontalSNudge)";
 
 // @public (undocumented)
-export const spacingHorizontalXL: CSSDesignToken<string>;
+export const spacingHorizontalXL = "var(--spacingHorizontalXL)";
 
 // @public (undocumented)
-export const spacingHorizontalXS: CSSDesignToken<string>;
+export const spacingHorizontalXS = "var(--spacingHorizontalXS)";
 
 // @public (undocumented)
-export const spacingHorizontalXXL: CSSDesignToken<string>;
+export const spacingHorizontalXXL = "var(--spacingHorizontalXXL)";
 
 // @public (undocumented)
-export const spacingHorizontalXXS: CSSDesignToken<string>;
+export const spacingHorizontalXXS = "var(--spacingHorizontalXXS)";
 
 // @public (undocumented)
-export const spacingHorizontalXXXL: CSSDesignToken<string>;
+export const spacingHorizontalXXXL = "var(--spacingHorizontalXXXL)";
 
 // @public (undocumented)
-export const spacingVerticalL: CSSDesignToken<string>;
+export const spacingVerticalL = "var(--spacingVerticalL)";
 
 // @public (undocumented)
-export const spacingVerticalM: CSSDesignToken<string>;
+export const spacingVerticalM = "var(--spacingVerticalM)";
 
 // @public (undocumented)
-export const spacingVerticalMNudge: CSSDesignToken<string>;
+export const spacingVerticalMNudge = "var(--spacingVerticalMNudge)";
 
 // @public (undocumented)
-export const spacingVerticalNone: CSSDesignToken<string>;
+export const spacingVerticalNone = "var(--spacingVerticalNone)";
 
 // @public (undocumented)
-export const spacingVerticalS: CSSDesignToken<string>;
+export const spacingVerticalS = "var(--spacingVerticalS)";
 
 // @public (undocumented)
-export const spacingVerticalSNudge: CSSDesignToken<string>;
+export const spacingVerticalSNudge = "var(--spacingVerticalSNudge)";
 
 // @public (undocumented)
-export const spacingVerticalXL: CSSDesignToken<string>;
+export const spacingVerticalXL = "var(--spacingVerticalXL)";
 
 // @public (undocumented)
-export const spacingVerticalXS: CSSDesignToken<string>;
+export const spacingVerticalXS = "var(--spacingVerticalXS)";
 
 // @public (undocumented)
-export const spacingVerticalXXL: CSSDesignToken<string>;
+export const spacingVerticalXXL = "var(--spacingVerticalXXL)";
 
 // @public (undocumented)
-export const spacingVerticalXXS: CSSDesignToken<string>;
+export const spacingVerticalXXS = "var(--spacingVerticalXXS)";
 
 // @public (undocumented)
-export const spacingVerticalXXXL: CSSDesignToken<string>;
+export const spacingVerticalXXXL = "var(--spacingVerticalXXXL)";
 
 // @public
-export class Spinner extends FASTProgressRing {
+export class Spinner extends FASTElement {
+    constructor();
     appearance?: SpinnerAppearance;
+    // @internal
+    protected elementInternals: ElementInternals;
     size?: SpinnerSize;
 }
 
@@ -2068,7 +2729,7 @@ export const SpinnerAppearance: {
 // @public
 export type SpinnerAppearance = ValuesOf<typeof SpinnerAppearance>;
 
-// @public
+// @public (undocumented)
 export const SpinnerDefinition: FASTElementDefinition<typeof Spinner>;
 
 // @public
@@ -2089,28 +2750,42 @@ export type SpinnerSize = ValuesOf<typeof SpinnerSize>;
 export const SpinnerStyles: ElementStyles;
 
 // @public (undocumented)
-export const SpinnerTemplate: ElementViewTemplate<Spinner>;
+export const SpinnerTemplate: ViewTemplate<Spinner, any>;
 
 // @public (undocumented)
-export const strokeWidthThick: CSSDesignToken<string>;
+export const strokeWidthThick = "var(--strokeWidthThick)";
 
 // @public (undocumented)
-export const strokeWidthThicker: CSSDesignToken<string>;
+export const strokeWidthThicker = "var(--strokeWidthThicker)";
 
 // @public (undocumented)
-export const strokeWidthThickest: CSSDesignToken<string>;
+export const strokeWidthThickest = "var(--strokeWidthThickest)";
 
 // @public (undocumented)
-export const strokeWidthThin: CSSDesignToken<string>;
+export const strokeWidthThin = "var(--strokeWidthThin)";
 
-// @public (undocumented)
+// @public
 const styles: ElementStyles;
 export { styles as ButtonStyles }
 export { styles as MenuButtonStyles }
 
+// Warning: (ae-forgotten-export) The symbol "FormAssociatedSwitch" needs to be exported by the entry point index.d.ts
+//
 // @public (undocumented)
-export class Switch extends FASTSwitch {
+export class Switch extends FormAssociatedSwitch {
+    constructor();
+    // @internal (undocumented)
+    clickHandler: (e: MouseEvent) => void;
+    // @internal (undocumented)
+    defaultSlottedNodes: Node[];
+    // @internal
+    initialValue: string;
+    // @internal (undocumented)
+    keypressHandler: (e: KeyboardEvent) => void;
     labelPosition: SwitchLabelPosition | undefined;
+    readOnly: boolean;
+    // (undocumented)
+    protected readOnlyChanged(): void;
 }
 
 // @public
@@ -2126,6 +2801,11 @@ export const SwitchLabelPosition: {
 // @public
 export type SwitchLabelPosition = ValuesOf<typeof SwitchLabelPosition>;
 
+// @public (undocumented)
+export type SwitchOptions = {
+    switch?: StaticallyComposableHTML<Switch>;
+};
+
 // @public (undocumented)
 export const SwitchStyles: ElementStyles;
 
@@ -2133,16 +2813,24 @@ export const SwitchStyles: ElementStyles;
 export const SwitchTemplate: ElementViewTemplate<Switch>;
 
 // @public
-export class Tab extends FASTTab {
+export class Tab extends FASTElement {
     // (undocumented)
     connectedCallback(): void;
+    disabled: boolean;
+}
+
+// @public (undocumented)
+export interface Tab extends StartEnd {
 }
 
 // @public (undocumented)
 export const TabDefinition: FASTElementDefinition<typeof Tab>;
 
+// @public
+export type TabOptions = StartEndOptions<Tab>;
+
 // @public (undocumented)
-export class TabPanel extends FASTTabPanel {
+export class TabPanel extends FASTElement {
 }
 
 // @public (undocumented)
@@ -2152,10 +2840,12 @@ export const TabPanelDefinition: FASTElementDefinition<typeof TabPanel>;
 export const TabPanelStyles: ElementStyles;
 
 // @public (undocumented)
-export const TabPanelTemplate: ElementViewTemplate<FASTTabPanel, any>;
+export const TabPanelTemplate: ElementViewTemplate<TabPanel, any>;
 
-// @public
-export class Tabs extends FASTTabs {
+// 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)
     activeidChanged(oldValue: string, newValue: string): void;
     appearance?: TabsAppearance;
@@ -2165,6 +2855,10 @@ export class Tabs extends FASTTabs {
     tabsChanged(): void;
 }
 
+// @public (undocumented)
+export interface Tabs extends StartEnd {
+}
+
 // @public (undocumented)
 export const TabsAppearance: {
     readonly subtle: "subtle";
@@ -2177,7 +2871,17 @@ export type TabsAppearance = ValuesOf<typeof TabsAppearance>;
 // @public (undocumented)
 export const TabsDefinition: FASTElementDefinition<typeof Tabs>;
 
-export { TabsOrientation }
+// @public
+export type TabsOptions = StartEndOptions<Tabs>;
+
+// @public
+export const TabsOrientation: {
+    readonly horizontal: "horizontal";
+    readonly vertical: "vertical";
+};
+
+// @public
+export type TabsOrientation = ValuesOf<typeof TabsOrientation>;
 
 // @public (undocumented)
 export const TabsSize: {
@@ -2193,13 +2897,13 @@ export type TabsSize = ValuesOf<typeof TabsSize>;
 export const TabsStyles: ElementStyles;
 
 // @public (undocumented)
-export const TabsTemplate: ElementViewTemplate<FASTTabs, any>;
+export const TabsTemplate: ElementViewTemplate<Tabs, any>;
 
 // @public (undocumented)
 export const TabStyles: ElementStyles;
 
 // @public (undocumented)
-export const TabTemplate: ElementViewTemplate<FASTTab, any>;
+export const TabTemplate: ElementViewTemplate<Tab, any>;
 
 // @public
 class Text_2 extends FASTElement {
@@ -2240,10 +2944,74 @@ export const TextFont: {
 // @public
 export type TextFont = ValuesOf<typeof TextFont>;
 
+// Warning: (ae-internal-mixed-release-tag) Mixed release tags are not allowed for "TextInput" because one of its declarations is marked as @internal
+//
 // @public
-export class TextInput extends FASTTextField {
+export class TextInput extends FASTElement {
     appearance?: TextInputAppearance;
+    autocomplete?: string;
+    autofocus: boolean;
+    // @internal
+    changeHandler(e: InputEvent): void;
+    // (undocumented)
+    connectedCallback(): void;
+    // @internal
+    control: HTMLInputElement;
+    // @internal
+    controlLabel: HTMLLabelElement;
     controlSize?: TextInputControlSize;
+    // @internal
+    defaultSlottedNodes: Node[];
+    // @internal
+    defaultSlottedNodesChanged(prev: Node[] | undefined, next: Node[] | undefined): void;
+    dirname?: string;
+    disabled?: boolean;
+    // (undocumented)
+    disconnectedCallback(): void;
+    // @internal
+    protected elementInternals: ElementInternals;
+    get form(): HTMLFormElement | null;
+    static readonly formAssociated = true;
+    formAttribute?: string;
+    // @internal
+    formResetCallback(): void;
+    initialValue: string;
+    // @internal
+    initialValueChanged(): void;
+    // @internal
+    inputHandler(e: InputEvent): boolean | void;
+    // @internal
+    keypressHandler(e: KeyboardEvent): boolean | void;
+    list: string;
+    maxlength: number;
+    minlength: number;
+    multiple: boolean;
+    name: string;
+    pattern: string;
+    placeholder: string;
+    readonly?: boolean;
+    // @internal
+    readonlyChanged(): void;
+    required: boolean;
+    // @internal
+    requiredChanged(previous: boolean, next: boolean): void;
+    select(): void;
+    // @internal
+    setFormValue(value: File | string | FormData | null, state?: File | string | FormData | null): void;
+    // @internal
+    setValidity(flags?: ValidityStateFlags, message?: string, anchor?: HTMLElement): void;
+    size: number;
+    spellcheck: boolean;
+    type: TextInputType;
+    get validationMessage(): string;
+    get validity(): ValidityState;
+    get value(): string;
+    set value(value: string);
+    get willValidate(): boolean;
+}
+
+// @internal (undocumented)
+export interface TextInput extends StartEnd {
 }
 
 // @public
@@ -2254,7 +3022,7 @@ export const TextInputAppearance: {
     readonly filledDarker: "filled-darker";
 };
 
-// @public
+// @public (undocumented)
 export type TextInputAppearance = ValuesOf<typeof TextInputAppearance>;
 
 // @public
@@ -2264,12 +3032,15 @@ export const TextInputControlSize: {
     readonly large: "large";
 };
 
-// @public
+// @public (undocumented)
 export type TextInputControlSize = ValuesOf<typeof TextInputControlSize>;
 
 // @public
 export const TextInputDefinition: FASTElementDefinition<typeof TextInput>;
 
+// @public
+export type TextInputOptions = StartEndOptions<TextInput>;
+
 // @public
 export const TextInputStyles: ElementStyles;
 
@@ -2278,7 +3049,17 @@ export const TextInputStyles: ElementStyles;
 // @internal (undocumented)
 export const TextInputTemplate: ElementViewTemplate<TextInput>;
 
-export { TextInputType }
+// @public
+export const TextInputType: {
+    readonly email: "email";
+    readonly password: "password";
+    readonly tel: "tel";
+    readonly text: "text";
+    readonly url: "url";
+};
+
+// @public (undocumented)
+export type TextInputType = ValuesOf<typeof TextInputType>;
 
 // @public
 export const TextSize: {
@@ -2318,27 +3099,16 @@ export type TextWeight = ValuesOf<typeof TextWeight>;
 
 // @public
 export class ToggleButton extends Button {
-    constructor();
-    checked: boolean;
-    checkedAttribute: boolean;
-    // (undocumented)
-    protected checkedAttributeChanged(): void;
-    // (undocumented)
-    protected checkedChanged(prev: boolean | undefined, next: boolean): void;
     // (undocumented)
     connectedCallback(): void;
-    currentChecked: boolean;
-    // (undocumented)
-    currentCheckedChanged(prev: boolean | undefined, next: boolean): void;
-    // (undocumented)
-    defaultChecked: boolean;
-    // (undocumented)
-    protected defaultCheckedChanged(): void;
-    protected dirtyChecked: boolean;
-    // (undocumented)
-    disconnectedCallback(): void;
-    // @internal (undocumented)
-    protected handleToggleButtonClick: (e: MouseEvent) => void;
+    mixed?: boolean;
+    // @internal
+    protected mixedChanged(): void;
+    // @override
+    protected press(): void;
+    pressed: boolean;
+    // @internal
+    protected pressedChanged(): void;
 }
 
 // @public
@@ -2353,7 +3123,7 @@ export const ToggleButtonAppearance: {
 // @public
 export type ToggleButtonAppearance = ValuesOf<typeof ToggleButtonAppearance>;
 
-// @public
+// @public (undocumented)
 export const ToggleButtonDefinition: FASTElementDefinition<typeof ToggleButton>;
 
 // @public
@@ -2376,12 +3146,67 @@ export const ToggleButtonSize: {
 // @public
 export type ToggleButtonSize = ValuesOf<typeof ToggleButtonSize>;
 
-// @public (undocumented)
+// @public
 export const ToggleButtonStyles: ElementStyles;
 
 // @public
 export const ToggleButtonTemplate: ElementViewTemplate<ToggleButton>;
 
+// @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:
+//
+// 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
+
 // (No @packageDocumentation comment for this package)
 
 ```