@tinybigui/react 0.5.0 → 0.7.0

package/dist/index.d.ts

@@ -1702,141 +1702,250 @@ interface IconButtonHeadlessProps extends AriaButtonProps {
 declare const IconButtonHeadless: React$1.ForwardRefExoticComponent<IconButtonHeadlessProps & React$1.RefAttributes<HTMLButtonElement>>;
 
 /**
- * Material Design 3 FAB Variants (CVA)
+ * Material Design 3 FAB Variants — Slot-based architecture
  *
- * Type-safe variant management for FAB component.
- * Uses Tailwind CSS classes mapped to MD3 design tokens.
+ * Architecture: Variants vs States
+ * - CVA holds design-time structure only (no disabled/loading state variants).
+ * - All interaction states are driven by data-* attributes on the root via
+ *   group-data-[x]/fab Tailwind selectors in each slot's base classes.
+ * - Content flags (data-with-icon, data-loading) are set explicitly by the component.
+ * - Self-targeting data-[x]: selectors handle root-level disabled styling.
  *
- * Key differences from Button/IconButton:
- * - NOT fully rounded (uses specific corner radius: 12px/16px/28px)
- * - Always has elevation (shadow-elevation-3)
- * - Larger sizes (40px/56px/96px)
- * - Extended variant with variable width
+ * Slot responsibilities:
+ *   fabVariants           — root <button>; shape per size, color per variant,
+ *                           elevation (base 3 → hover 4 → focus/pressed 3),
+ *                           self data-[disabled] styling, group/fab scope.
+ *   fabStateLayerVariants — absolute inset overlay, opacity 0/8%/10%/10%,
+ *                           color = icon/on-color per MD3 spec.
+ *   fabFocusRingVariants  — keyboard focus outline ring (inset-[-3px]).
+ *                           MUST NOT sit inside overflow-hidden.
+ *   fabIconVariants       — icon wrapper; size per FAB size variant.
+ *   fabLabelVariants      — extended FAB text label slot.
+ *
+ * MD3 Expressive size scale:
+ *   fab      → 56dp  container, 16dp corner, 24dp icon  (default)
+ *   medium   → 80dp  container, 20dp corner, 28dp icon  (M3 Expressive)
+ *   large    → 96dp  container, 28dp corner, 36dp icon
+ *   extended → 56dp  height,    16dp corner, 24dp icon  (+ text label)
+ *   small    → 40dp  container, 12dp corner, 24dp icon  (@deprecated)
+ *
+ * MD3 Expressive color roles:
+ *   primary-container   → bg-primary-container   / text-on-primary-container   (default)
+ *   secondary-container → bg-secondary-container / text-on-secondary-container
+ *   tertiary-container  → bg-tertiary-container  / text-on-tertiary-container
+ *   primary             → bg-primary             / text-on-primary             (solid, M3 Expressive)
+ *   secondary           → bg-secondary           / text-on-secondary           (solid, M3 Expressive)
+ *   tertiary            → bg-tertiary            / text-on-tertiary            (solid, M3 Expressive)
+ *   surface             → bg-surface-container-high / text-primary             (@deprecated)
+ *
+ * Elevation per state (MD3 spec):
+ *   base    → elevation-3
+ *   hovered → elevation-4  (shadow-elevation-4)
+ *   focused → elevation-3  (doubled selector wins over hover)
+ *   pressed → elevation-3  (doubled selector wins over hover)
+ *   disabled → no shadow
+ *
+ * State-layer opacities (MD3):
+ *   hover  → 8%   (opacity-8)
+ *   focus  → 10%  (opacity-10)
+ *   pressed→ 10%  (opacity-10, doubled selector wins over hover's 8%)
+ *
+ * Important — overflow-hidden is NOT on the root button.
+ * The focus ring span has `inset-[-3px]` to extend outside the button boundary,
+ * which requires the root to not clip overflow. Overflow clipping is delegated
+ * to the state layer and ripple container (overflow-hidden + rounded-[inherit]).
  */
 declare const fabVariants: (props?: ({
-    size?: "small" | "large" | "medium" | "extended" | null | undefined;
-    color?: "primary" | "secondary" | "tertiary" | "surface" | null | undefined;
-    isDisabled?: boolean | null | undefined;
+    size?: "small" | "large" | "medium" | "fab" | "extended" | null | undefined;
+    color?: "primary" | "primary-container" | "secondary" | "secondary-container" | "tertiary" | "tertiary-container" | "surface" | null | undefined;
 } & class_variance_authority_types.ClassProp) | undefined) => string;
-/**
- * Extract variant prop types from CVA
- */
 type FABVariants = VariantProps<typeof fabVariants>;
 
 /**
- * FAB size types
+ * FAB size types — MD3 Expressive scale.
+ *
+ * | Value      | Height | Icon  | Corner | Notes                        |
+ * |------------|--------|-------|--------|------------------------------|
+ * | `fab`      | 56dp   | 24dp  | 16dp   | Default. Regular FAB.        |
+ * | `medium`   | 80dp   | 28dp  | 20dp   | Medium FAB (M3 Expressive).  |
+ * | `large`    | 96dp   | 36dp  | 28dp   | Large FAB.                   |
+ * | `extended` | 56dp   | 24dp  | 16dp   | Extended FAB with text label.|
+ * | `small`    | 40dp   | 24dp  | 12dp   | @deprecated — Use `fab`.     |
+ *
+ * @default 'fab'
  */
-type FABSize = "small" | "medium" | "large" | "extended";
+type FABSize = "fab" | "medium" | "large" | "extended" | "small";
 /**
- * FAB color scheme
+ * FAB color styles — MD3 Expressive color roles.
+ *
+ * **Container styles (default set):**
+ * - `primary-container` — bg-primary-container / text-on-primary-container (default)
+ * - `secondary-container` — bg-secondary-container / text-on-secondary-container
+ * - `tertiary-container` — bg-tertiary-container / text-on-tertiary-container
+ *
+ * **Solid styles (M3 Expressive):**
+ * - `primary` — bg-primary / text-on-primary
+ * - `secondary` — bg-secondary / text-on-secondary
+ * - `tertiary` — bg-tertiary / text-on-tertiary
+ *
+ * **Deprecated:**
+ * - `surface` — @deprecated Use `primary-container`. Maps to surface-container-high.
+ *
+ * @default 'primary-container'
  */
-type FABColor = "primary" | "secondary" | "tertiary" | "surface";
+type FABColor = "primary-container" | "secondary-container" | "tertiary-container" | "primary" | "secondary" | "tertiary" | "surface";
 /**
  * Material Design 3 FAB (Floating Action Button) Component Props
  *
- * High-emphasis button for primary screen action.
- * Supports 4 sizes: small (40px), medium (56px), large (96px), extended (variable width with text)
- *
- * ⚠️ IMPORTANT:
- * - Only ONE FAB per screen
- * - aria-label is REQUIRED (even for extended FAB with text)
- * - Use for primary constructive actions only (create, add, compose)
- * - NOT for destructive (delete), navigation (back), or secondary actions
+ * High-emphasis button for the primary screen action.
+ * Implements the MD3 Expressive FAB spec with a slot-based architecture
+ * matching Button and Switch for consistent interaction state handling.
  *
  * @example
  * ```tsx
- * // Standard FAB (medium)
- * <FAB aria-label="Create new item" icon={<IconAdd />} />
+ * // Default FAB (56dp)
+ * <FAB aria-label="Create" icon={<IconAdd />} />
  *
- * // Small FAB
- * <FAB aria-label="Add photo" icon={<IconCamera />} size="small" />
+ * // Medium FAB (80dp, M3 Expressive)
+ * <FAB aria-label="Create" icon={<IconAdd />} size="medium" />
  *
- * // Large FAB
+ * // Large FAB (96dp)
  * <FAB aria-label="Compose" icon={<IconEdit />} size="large" />
  *
- * // Extended FAB (with text)
- * <FAB aria-label="Create new document" icon={<IconAdd />} size="extended">
+ * // Extended FAB (with text label)
+ * <FAB aria-label="Create document" icon={<IconAdd />} size="extended">
  *   Create
  * </FAB>
  *
+ * // Solid primary color (M3 Expressive)
+ * <FAB aria-label="Add" icon={<IconAdd />} color="primary" />
+ *
  * // Loading state
  * <FAB aria-label="Creating" icon={<IconAdd />} loading />
- *
- * // Secondary color
- * <FAB aria-label="Edit" icon={<IconEdit />} color="secondary" />
  * ```
  */
 interface FABProps extends AriaButtonProps {
     /**
-     * FAB size variant
-     * - small: 40×40px (24px icon)
-     * - medium: 56×56px (24px icon) - default
-     * - large: 96×96px (36px icon)
-     * - extended: Variable width with text (24px icon)
-     * @default 'medium'
+     * FAB size variant.
+     *
+     * - `fab` (56dp) — Default. Standard FAB.
+     * - `medium` (80dp) — Medium FAB. M3 Expressive. Previously 56dp; now remapped.
+     * - `large` (96dp) — Large FAB.
+     * - `extended` (56dp height) — Extended FAB with icon and text label.
+     * - `small` (40dp) — @deprecated. Use `fab` instead.
+     *
+     * @default 'fab'
      */
     size?: FABSize;
     /**
-     * Color scheme
-     * @default 'primary'
+     * Color style for the FAB.
+     *
+     * - `primary-container` — Default. bg-primary-container / text-on-primary-container.
+     * - `secondary-container` — bg-secondary-container / text-on-secondary-container.
+     * - `tertiary-container` — bg-tertiary-container / text-on-tertiary-container.
+     * - `primary` — Solid. bg-primary / text-on-primary (M3 Expressive).
+     * - `secondary` — Solid. bg-secondary / text-on-secondary (M3 Expressive).
+     * - `tertiary` — Solid. bg-tertiary / text-on-tertiary (M3 Expressive).
+     * - `surface` — @deprecated. Use `primary-container`.
+     *
+     * @default 'primary-container'
      */
     color?: FABColor;
     /**
      * Icon content (required).
-     * Recommended sizes:
-     * - small/medium/extended: 24x24px
-     * - large: 36x36px
+     * Recommended icon sizes per variant:
+     * - `fab` / `extended` / `small`: 24×24px
+     * - `medium`: 28×28px
+     * - `large`: 36×36px
      */
     icon: React__default.ReactNode;
     /**
-     * Text label (required for extended FAB, ignored for other sizes)
+     * Text label — only rendered for `size="extended"`.
      */
     children?: React__default.ReactNode;
     /**
-     * Mandatory accessible label for the FAB.
-     * This is crucial for screen readers as FAB is icon-based.
-     * Even extended FAB with text requires aria-label.
+     * Mandatory accessible label for all FAB sizes.
+     * Required even for extended FABs that have visible text.
      */
     "aria-label": string;
     /**
-     * Loading state - shows spinner, disables interaction
+     * Shows a loading spinner and disables interaction.
      * @default false
      */
     loading?: boolean;
     /**
-     * Disable ripple effect
+     * Disables the MD3 ripple press-feedback animation.
      * @default false
      */
     disableRipple?: boolean;
     /**
-     * Additional CSS classes (Tailwind)
-     * Can be used for positioning (e.g., "fixed bottom-4 right-4")
+     * Additional Tailwind classes — commonly used for positioning
+     * (e.g. `className="fixed bottom-4 right-4"`).
      */
     className?: string;
     /**
-     * HTML title attribute for tooltip
+     * HTML title attribute for tooltip.
      */
     title?: string;
     /**
-     * Mouse down handler (for ripple effect and custom handling)
+     * Mouse down handler (merged with the internal ripple handler).
      */
     onMouseDown?: (e: React__default.MouseEvent<HTMLButtonElement>) => void;
+    /**
+     * Tab index for keyboard navigation.
+     * @default 0
+     */
+    tabIndex?: number | undefined;
+    /**
+     * Button type attribute.
+     * @default 'button'
+     */
+    type?: "button" | "submit" | "reset";
 }
 
 /**
- * Material Design 3 FAB (Floating Action Button) Component
+ * Material Design 3 FAB (Floating Action Button) — M3 Expressive
+ *
+ * High-emphasis button for the primary screen action.
+ * Implements the Variants-vs-States architecture: all interaction states are
+ * expressed as data-* attributes on the root and consumed by each slot via
+ * group-data-[x]/fab Tailwind selectors — no state variants in CVA.
+ *
+ * Features:
+ * - ✅ MD3 Expressive size scale: fab (56dp), medium (80dp), large (96dp), extended, small (dep)
+ * - ✅ Container + solid color styles (primary-container, primary, secondary*, tertiary*)
+ * - ✅ Elevation 3 base → 4 hover → 3 focus/pressed per MD3 spec
+ * - ✅ State-layer color = icon/on-color per MD3 spec
+ * - ✅ Correct state-layer opacities: hover 8% / focus 10% / pressed 10%
+ * - ✅ Dedicated focus ring slot (inset-[-3px], keyboard-only)
+ * - ✅ Loading state with spinner
+ * - ✅ Ripple effect (Material Design)
+ * - ✅ Full keyboard accessibility via React Aria
+ *
+ * @example
+ * ```tsx
+ * // Default FAB (56dp, primary-container)
+ * <FAB aria-label="Create" icon={<IconAdd />} />
+ *
+ * // Medium FAB (80dp, M3 Expressive)
+ * <FAB aria-label="Create" icon={<IconAdd />} size="medium" />
  *
- * High-emphasis button for primary screen action.
- * Supports 4 sizes: small, medium, large, extended
- * Implementation uses Tailwind CSS classes mapped to MD3 tokens.
+ * // Solid primary color (M3 Expressive)
+ * <FAB aria-label="Add" icon={<IconAdd />} color="primary" />
+ *
+ * // Extended FAB with text
+ * <FAB aria-label="Create document" icon={<IconAdd />} size="extended">
+ *   Create
+ * </FAB>
+ * ```
  */
-declare const FAB: React__default.ForwardRefExoticComponent<FABProps & Omit<FABVariants, "isDisabled"> & React__default.RefAttributes<HTMLButtonElement>>;
+declare const FAB: React__default.ForwardRefExoticComponent<FABProps & Omit<FABVariants, never> & React__default.RefAttributes<HTMLButtonElement>>;
 
 /**
  * Headless FAB Component (Layer 2)
  *
  * Unstyled FAB primitive using React Aria for accessibility.
- * Provides behavior only - bring your own styles.
+ * Provides behavior only — bring your own styles.
  *
  * Features:
  * - Full keyboard navigation (Enter, Space)
@@ -1844,45 +1953,35 @@ declare const FAB: React__default.ForwardRefExoticComponent<FABProps & Omit<FABV
  * - Touch/pointer event handling
  * - Focus management
  * - Disabled state handling
+ * - Press lifecycle callbacks (onPressStart/onPressEnd) for pressed state tracking
  *
  * @example
  * ```tsx
- * // Use for custom styling
- * <FABHeadless className="custom-fab-class" aria-label="Add">
+ * <FABHeadless aria-label="Add" className="custom-fab">
  *   <IconAdd />
  * </FABHeadless>
  * ```
  */
 interface FABHeadlessProps extends AriaButtonProps {
-    /**
-     * Additional CSS classes
-     */
+    /** Additional CSS classes */
     className?: string;
-    /**
-     * FAB content (icon and optional text)
-     */
+    /** FAB content (icon and optional text) */
     children: React.ReactNode;
     /**
-     * Tab index for keyboard navigation
+     * Tab index for keyboard navigation.
      * @default 0
      */
     tabIndex?: number;
-    /**
-     * Mouse down handler (for ripple effect)
-     */
+    /** Mouse down handler (for ripple effect) */
     onMouseDown?: (e: React.MouseEvent<HTMLButtonElement>) => void;
     /**
-     * Button type attribute
+     * Button type attribute.
      * @default 'button'
      */
     type?: "button" | "submit" | "reset";
-    /**
-     * REQUIRED: Accessible label for screen readers
-     */
+    /** REQUIRED: Accessible label for screen readers */
     "aria-label": string;
-    /**
-     * HTML title attribute for tooltip
-     */
+    /** HTML title attribute for tooltip */
     title?: string;
 }
 declare const FABHeadless: React$1.ForwardRefExoticComponent<FABHeadlessProps & React$1.RefAttributes<HTMLButtonElement>>;
@@ -7869,48 +7968,70 @@ declare const splitButtonVariants: {
  */
 type FABMenuDirection = "up" | "down" | "left" | "right";
 /**
- * Props for an individual FABMenu action item (mini FAB).
+ * Color role for individual FABMenu action items.
+ *
+ * Matches the MD3 Expressive FAB color roles:
+ * - Container variants: `primary-container` (default), `secondary-container`, `tertiary-container`
+ * - Solid variants (M3 Expressive): `primary`, `secondary`, `tertiary`
+ *
+ * The state-layer color equals the icon/on-color per MD3 spec.
+ *
+ * @default 'primary-container'
+ */
+type FABMenuItemColor = "primary-container" | "secondary-container" | "tertiary-container" | "primary" | "secondary" | "tertiary";
+/**
+ * Props for an individual FABMenu action item (MD3 Expressive pill menu item).
  *
- * Each item renders as a small FAB with an icon and optional label.
- * `aria-label` is required for accessibility since items are icon-based.
+ * Each item renders as a full-rounded 56dp pill button with a leading icon
+ * and an inline text label. `label` or `aria-label` must be provided.
  *
  * @example
  * ```tsx
  * <FABMenuItem
  *   icon={<IconEdit />}
  *   label="Edit"
- *   aria-label="Edit item"
  *   onPress={() => console.log('edit')}
  * />
+ *
+ * // Icon-only (requires aria-label)
+ * <FABMenuItem icon={<IconEdit />} aria-label="Edit item" />
  * ```
  */
 interface FABMenuItemProps {
-    /** Icon content for the mini FAB action item. */
+    /** Leading icon for the menu item. */
     icon: React__default.ReactNode;
     /**
-     * Optional text label displayed beside the mini FAB.
-     * Acts as a tooltip or visible label depending on the styled layer.
+     * Inline text label displayed inside the pill button.
+     * Provides the accessible name when `aria-label` is not supplied.
      */
     label?: string;
+    /**
+     * Explicit accessible label for screen readers.
+     * Required when `label` is not provided.
+     * When both are present, `aria-label` takes precedence.
+     */
+    "aria-label"?: string;
     /** Handler called when the action item is pressed. */
     onPress?: (e: PressEvent) => void;
     /**
-     * REQUIRED: Accessible label for screen readers.
-     * Mandatory since action items are icon-based.
+     * Color role for the menu item container.
+     * Controls the background, text, and state-layer colors.
+     *
+     * @default 'primary-container'
      */
-    "aria-label": string;
+    color?: FABMenuItemColor;
     /**
      * Whether the action item is disabled.
      * @default false
      */
     isDisabled?: boolean;
-    /** Additional CSS classes. */
+    /** Additional CSS classes applied to the root pill button. */
     className?: string;
 }
 /**
  * Props for the headless FABMenu primitive (Layer 2).
  *
- * Manages open/close state, keyboard navigation, focus management,
+ * Manages open/close state, keyboard interactions, focus management,
  * and accessibility attributes without opinionated styling.
  *
  * Supports both controlled (`open` + `onOpenChange`) and uncontrolled
@@ -7920,7 +8041,7 @@ interface FABMenuItemProps {
  * ```tsx
  * // Uncontrolled
  * <FABMenuHeadless aria-label="Actions" direction="up">
- *   <FABMenuItem icon={<IconEdit />} aria-label="Edit" />
+ *   <FABMenuItem icon={<IconEdit />} label="Edit" />
  * </FABMenuHeadless>
  *
  * // Controlled
@@ -7929,7 +8050,7 @@ interface FABMenuItemProps {
  *   onOpenChange={setIsOpen}
  *   aria-label="Quick actions"
  * >
- *   <FABMenuItem icon={<IconAdd />} aria-label="Add" />
+ *   <FABMenuItem icon={<IconAdd />} label="Add" />
  * </FABMenuHeadless>
  * ```
  */
@@ -7965,13 +8086,9 @@ interface FABMenuHeadlessProps {
 /**
  * Props for the styled FABMenu component (Layer 3).
  *
- * Extends the headless props — no additional required props at this layer.
- * Styling, variants, and CVA will be added when the styled layer is built.
+ * Extends the headless props. No additional required props at this layer.
  */
-interface FABMenuProps extends FABMenuHeadlessProps {
-    /** Placeholder for future styled-layer extensions (e.g., variant, color). */
-    _brand?: never;
-}
+type FABMenuProps = FABMenuHeadlessProps;
 /**
  * Context value shared between FABMenu and its item descendants.
  *
@@ -7998,11 +8115,14 @@ interface FABMenuContextValue {
 }
 
 /**
- * FABMenu — Material Design 3 styled FAB Menu (Layer 3).
+ * FABMenu — Material Design 3 Expressive FAB Menu (Layer 3).
  *
- * Renders a trigger FAB that expands a list of mini FAB action items
+ * Renders a trigger FAB that expands a list of MD3 Expressive pill menu items
  * in the specified direction. Manages stagger animation-delay on children,
- * elevation changes on the trigger, and icon rotation.
+ * elevation changes on the trigger, and icon rotation (+ → ×).
+ *
+ * The trigger FAB icon morphs using expressive spring spatial tokens to convey
+ * the energetic, high-emphasis nature of the interaction.
  *
  * Built on top of FABMenuContext for state sharing with FABMenuItem children.
  * Uses the existing `FAB` component as the trigger button.
@@ -8010,30 +8130,41 @@ interface FABMenuContextValue {
  * @example
  * ```tsx
  * <FABMenu aria-label="Quick actions" direction="up">
- *   <FABMenuItem icon={<IconEdit />} label="Edit" aria-label="Edit" />
- *   <FABMenuItem icon={<IconShare />} label="Share" aria-label="Share" />
+ *   <FABMenuItem icon={<IconEdit />} label="Edit" />
+ *   <FABMenuItem icon={<IconShare />} label="Share" />
  * </FABMenu>
  * ```
  */
-declare const FABMenu: React__default.ForwardRefExoticComponent<FABMenuProps & React__default.RefAttributes<HTMLDivElement>>;
+declare const FABMenu: React__default.ForwardRefExoticComponent<FABMenuHeadlessProps & React__default.RefAttributes<HTMLDivElement>>;
 
 /**
- * FABMenuItem — Individual action item rendered as a mini FAB (40dp) with
- * optional label chip. Consumes FABMenuContext for open state and direction.
+ * FABMenuItem — MD3 Expressive FAB Menu action item (Layer 3).
+ *
+ * Renders as a full-rounded 56dp pill button with a leading icon and an
+ * inline text label. Implements the Variants-vs-States architecture:
+ * all interaction states are expressed as data-* attributes on the root
+ * and consumed by each slot via group-data-[x]/fab-menu-item selectors.
  *
- * Applies stagger animation via `animation-delay` based on `index` prop
- * (provided by the parent FABMenu). Skips animations when `reducedMotion`
- * is active.
+ * Features:
+ * - ✅ MD3 Expressive pill shape (56dp height, full-rounded)
+ * - ✅ 6 color roles: 3 container + 3 solid (M3 Expressive)
+ * - ✅ Elevation 3 base → 4 hover → 3 focus/pressed per MD3 spec
+ * - ✅ Correct state-layer opacities: hover 8% / focus 10% / pressed 10%
+ * - ✅ Dedicated focus ring slot (inset-[-3px], keyboard-only)
+ * - ✅ Ripple effect (Material Design)
+ * - ✅ Stagger enter/exit animation (animate-md-scale-in/out), reduce-motion guarded
+ * - ✅ Full keyboard accessibility via React Aria
  *
  * @example
  * ```tsx
  * <FABMenuItem
  *   icon={<IconEdit />}
  *   label="Edit"
- *   aria-label="Edit item"
  *   onPress={() => handleEdit()}
- *   index={0}
  * />
+ *
+ * // Solid color role
+ * <FABMenuItem icon={<IconAdd />} label="Add" color="primary" />
  * ```
  */
 declare const FABMenuItem: React__default.ForwardRefExoticComponent<FABMenuItemProps & {
@@ -8080,25 +8211,135 @@ declare function useFABMenuContext(): FABMenuContextValue;
 declare const FABMenuHeadless: React$1.ForwardRefExoticComponent<FABMenuHeadlessProps & React$1.RefAttributes<HTMLDivElement>>;
 
 /**
- * CVA variants for the FABMenu root container.
+ * Material Design 3 FABMenu Variants
  *
- * Controls the expansion direction of action items relative to the trigger FAB.
- * Uses gap-3 (12px) for spacing between trigger and items per MD3 spec.
+ * Architecture: Variants vs States
+ * - CVA holds design-time structure only (no disabled/state variants in CVA).
+ * - All interaction states are driven by data-* attributes on the root via
+ *   group-data-[x]/fab-menu-item Tailwind selectors in each slot's base classes.
+ * - Content flags (data-with-icon, data-with-label) are set explicitly by the component.
+ * - Self-targeting data-[x]: selectors handle root-level disabled styling.
+ *
+ * Slot responsibilities:
+ *   fabMenuVariants           — root container; direction layout
+ *   fabMenuItemVariants       — root <button> pill; shape, color, elevation, group scope
+ *   fabMenuItemStateLayerVariants — absolute inset overlay; opacity 0/8/10/10; color=on-color
+ *   fabMenuItemFocusRingVariants  — keyboard focus outline (inset-[-3px], MUST NOT be clipped)
+ *   fabMenuItemIconVariants   — leading icon wrapper; size-6 (24dp)
+ *   fabMenuItemLabelVariants  — inline text label slot
+ *
+ * MD3 Expressive FAB Menu item spec:
+ *   Shape:       full-rounded pill (rounded-full)
+ *   Height:      56dp (h-14)
+ *   Padding:     16dp leading (pl-4), 20dp trailing (pr-5)
+ *   Gap:         12dp between icon and label (gap-3)
+ *   Icon:        24dp (size-6)
+ *   Typography:  Title Medium
+ *   Elevation:   base 3 → hover 4 → focus/pressed 3 → disabled none
+ *   State-layer: hover 8% | focus 10% | pressed 10% | disabled hidden
+ *
+ * IMPORTANT — overflow-hidden is NOT on the root button.
+ * The focus ring span has `inset-[-3px]` to extend outside the button boundary.
+ * Overflow clipping is delegated to the state layer (overflow-hidden + rounded-[inherit]).
+ */
+/**
+ * Root container for FABMenu.
+ *
+ * The root is sized to the trigger FAB only — `inline-flex` collapses to the
+ * FAB's intrinsic size. The items overlay is absolutely positioned, so the
+ * container never grows and the FAB never shifts position when the menu opens.
  */
-declare const fabMenuVariants: (props?: ({
+declare const fabMenuVariants: (props?: class_variance_authority_types.ClassProp | undefined) => string;
+/**
+ * Absolutely positioned overlay that holds the menu item list.
+ *
+ * Anchored to the trigger FAB via logical insets so placement is correct in
+ * both LTR and RTL document directions — no consumer intervention needed.
+ *
+ * `transform-origin` on each direction aligns the `animate-md-scale-in/out`
+ * pivot with the FAB edge so items appear to emanate from the trigger:
+ *   up    → origin-bottom  (list grows upward from the FAB top edge)
+ *   down  → origin-top     (list grows downward from the FAB bottom edge)
+ *   left  → origin-right   (list grows leftward from the FAB start edge)
+ *   right → origin-left    (list grows rightward from the FAB end edge)
+ *
+ * Logical properties used (`end-0`, `start-full`, `me-3`, etc.) to respect
+ * RTL layout automatically.
+ */
+declare const fabMenuListVariants: (props?: ({
     direction?: "left" | "right" | "up" | "down" | null | undefined;
 } & class_variance_authority_types.ClassProp) | undefined) => string;
 /**
- * CVA variants for individual FABMenuItem containers.
+ * Root <button> pill for a FABMenu action item.
+ *
+ * IMPORTANT — no overflow-hidden here (focus ring must extend outside).
+ * Elevation follows MD3 FAB spec: base 3 → hover 4 → focus/pressed 3 → disabled none.
+ * The doubled attribute selector for focus/pressed gives higher specificity than
+ * the single hover selector, ensuring they always win.
  *
- * Controls visibility and pointer interaction based on open state.
- * Transition classes are applied separately for stagger animation support.
+ * Disabled styling uses self-targeting data-[disabled]: (not group-data —
+ * these selectors target the root element itself).
  */
 declare const fabMenuItemVariants: (props?: ({
-    isOpen?: boolean | null | undefined;
+    color?: "primary" | "primary-container" | "secondary" | "secondary-container" | "tertiary" | "tertiary-container" | null | undefined;
 } & class_variance_authority_types.ClassProp) | undefined) => string;
+/**
+ * State layer — absolute inset overlay that transitions opacity on interaction.
+ *
+ * Per MD3 spec, the state-layer color must equal the icon/on-color:
+ *   primary-container   → bg-on-primary-container
+ *   secondary-container → bg-on-secondary-container
+ *   tertiary-container  → bg-on-tertiary-container
+ *   primary (solid)     → bg-on-primary
+ *   secondary (solid)   → bg-on-secondary
+ *   tertiary (solid)    → bg-on-tertiary
+ *
+ * Opacity:
+ *   0 at rest · 8% hover · 10% focus · 10% pressed · hidden when disabled
+ *
+ * Pressed (10%) must win over hover (8%) when both data attributes are set.
+ * The doubled attribute selector gives it higher specificity:
+ *   group-data-[hovered]/fab-menu-item:          → specificity (0,1,0)
+ *   group-data-[pressed]/fab-menu-item:group-..  → specificity (0,2,0) always wins
+ *
+ * overflow-hidden is placed HERE (not on the root) so the state layer clips to
+ * the pill shape while the focus ring span can extend outside.
+ */
+declare const fabMenuItemStateLayerVariants: (props?: ({
+    color?: "primary" | "primary-container" | "secondary" | "secondary-container" | "tertiary" | "tertiary-container" | null | undefined;
+} & class_variance_authority_types.ClassProp) | undefined) => string;
+/**
+ * Focus ring overlay.
+ *
+ * Rendered as an absolute `<span>` with `inset-[-3px]` so it extends 3px
+ * outside the button boundary. This REQUIRES that `overflow-hidden` is NOT
+ * on the root button — overflow clipping is moved to the state layer.
+ *
+ * Always present in the DOM (opacity-0 at rest), transitions to opacity-100
+ * on keyboard/programmatic focus — avoids layout shifts.
+ */
+declare const fabMenuItemFocusRingVariants: (props?: class_variance_authority_types.ClassProp | undefined) => string;
+/**
+ * Leading icon wrapper.
+ *
+ * MD3 spec: 24×24dp icons inside FAB menu items.
+ * Color is inherited from the parent button's text color.
+ */
+declare const fabMenuItemIconVariants: (props?: class_variance_authority_types.ClassProp | undefined) => string;
+/**
+ * Inline text label wrapper.
+ *
+ * MD3 spec: Title Medium typography for FAB menu item labels.
+ * z-10 keeps it above the state layer and ripple overlays.
+ */
+declare const fabMenuItemLabelVariants: (props?: class_variance_authority_types.ClassProp | undefined) => string;
 type FABMenuVariants = VariantProps<typeof fabMenuVariants>;
+type FABMenuListVariants = VariantProps<typeof fabMenuListVariants>;
 type FABMenuItemVariants = VariantProps<typeof fabMenuItemVariants>;
+type FABMenuItemStateLayerVariants = VariantProps<typeof fabMenuItemStateLayerVariants>;
+type FABMenuItemFocusRingVariants = VariantProps<typeof fabMenuItemFocusRingVariants>;
+type FABMenuItemIconVariants = VariantProps<typeof fabMenuItemIconVariants>;
+type FABMenuItemLabelVariants = VariantProps<typeof fabMenuItemLabelVariants>;
 
 /**
  * Structural variant of the MD3 Slider.
@@ -10749,4 +10990,4 @@ type DatePickerSupportingTextVariants = VariantProps<typeof datePickerSupporting
 declare const datePickerScrimVariants: (props?: class_variance_authority_types.ClassProp | undefined) => string;
 type DatePickerScrimVariants = VariantProps<typeof datePickerScrimVariants>;
 
-export { AppBar, AppBarHeadless, type AppBarHeadlessProps, type AppBarProps, type AppBarVariant, Badge, type BadgeColor, BadgeContent, type BadgeContentProps, BadgeHeadless, type BadgeHeadlessProps, type BadgeProps, type BadgeVariants, BottomSheet, type BottomSheetAnimationState, type BottomSheetAnimationVariants, BottomSheetContext, type BottomSheetContextValue, BottomSheetHandle, type BottomSheetHandleProps, type BottomSheetHandleVariants, BottomSheetHeadless, type BottomSheetHeadlessProps, type BottomSheetProps, type BottomSheetScrimVariants, type BottomSheetVariant, type BottomSheetVariants, Button, ButtonGroup, ButtonGroupContext, type ButtonGroupContextValue, type ButtonGroupFocusRingVariants, ButtonGroupHeadless, type ButtonGroupProps, type ButtonGroupRootVariants, type ButtonGroupSelectionMode, type ButtonGroupShape, type ButtonGroupSize, type ButtonGroupVariant, type ButtonProps, type ButtonSize, type ButtonVariant, type CalendarCellProps, type CalendarCellType, type CalendarCellVariants, CalendarCore, type CalendarGridProps, type CalendarView, Card, CardActions, type CardActionsProps, CardContent, type CardContentProps, CardHeader, type CardHeaderProps, CardHeadless, type CardHeadlessProps, CardMedia, type CardMediaProps, type CardProps, type CardVariant, type CardVariants, Checkbox, type CheckboxProps, Chip, ChipHeadless, type ChipHeadlessProps, type ChipProps, ChipSet, type ChipSetProps, type ChipSurface, type ChipType, type ChipVariants, type ClockDialContainerVariants, type ClockDialNumberVariants, type ClockDialProps, type ClockHandCenterVariants, type ClockHandHandleVariants, type ClockHandProps, type ClockHandTrackVariants, type ClockSelectionMode, DateField, type DateFieldProps, type DateInputFieldProps, DatePicker, type DatePickerActionButtonVariants, type DatePickerActionVariants, type DatePickerActionsProps, type DatePickerContainerVariants, type DatePickerDividerVariants, DatePickerDocked, type DatePickerDockedProps, type DatePickerHeaderVariants, type DatePickerHeadlessProps, type DatePickerHeadlineVariants, DatePickerModal, type DatePickerModalHeaderProps, DatePickerModalInput, type DatePickerModalInputProps, type DatePickerModalProps, type DatePickerNavVariants, type DatePickerProps, type DatePickerRangeIndicatorVariants, type DatePickerRenderState, type DatePickerScrimVariants, type DatePickerSupportingTextVariants, type DatePickerVariant, type DatePickerWeekdayVariants, type DateSelectionMode, Dialog, DialogActions, type DialogActionsProps, type DialogAnimationState, DialogContent, type DialogContentProps, DialogContext, type DialogContextValue, DialogHeadless, type DialogHeadlessProps, DialogHeadline, type DialogHeadlineProps, type DialogProps, type DialogVariant, Divider, DividerHeadless, type DividerHeadlessProps, type DividerInset, type DividerOrientation, type DividerProps, type DividerVariants, Drawer, type DrawerContextValue, DrawerIconOnlyContext, DrawerItem, type DrawerItemBadgeConfig, type DrawerItemProps, type DrawerProps, DrawerSection, type DrawerSectionProps, type DrawerVariant, FAB, type FABColor, FABHeadless, type FABHeadlessProps, FABMenu, FABMenuContext, type FABMenuContextValue, type FABMenuDirection, FABMenuHeadless, type FABMenuHeadlessProps, FABMenuItem, type FABMenuItemProps, type FABMenuItemVariants, type FABMenuProps, type FABMenuVariants, type FABProps, type FABSize, HeadlessDrawer, HeadlessDrawerItem, type HeadlessDrawerItemProps, type HeadlessDrawerProps, HeadlessMenu, HeadlessMenuDivider, HeadlessMenuItem, type HeadlessMenuItemProps, type HeadlessMenuProps, HeadlessMenuSection, type HeadlessMenuSectionProps, HeadlessMenuTrigger, type HeadlessMenuTriggerProps, HeadlessNavigationBar, HeadlessNavigationBarItem, type HeadlessNavigationBarItemProps, type HeadlessNavigationBarProps, HeadlessTab, HeadlessTabList, HeadlessTabPanel, type HeadlessTabPanelProps, type HeadlessTabProps, IconButton, type IconButtonColor, IconButtonHeadless, type IconButtonHeadlessProps, type IconButtonProps, type IconButtonSize, type IconButtonVariant, List, type ListDensity, ListHeadless, type ListHeadlessProps, ListItem, ListItemHeadless, ListItemLeading, type ListItemLeadingProps, type ListItemProps, ListItemText, type ListItemTextProps, ListItemTrailing, type ListItemTrailingProps, type ListItemVariants, type ListLeadingType, type ListProps, type ListTrailingType, type ListVariants, type MD3ColorRole, type MD3TypographyScale, type MD3TypographySize, type MD3TypographyStyle, Menu, type MenuContainerVariants, MenuContext, type MenuContextValue, MenuDivider, type MenuDividerProps, MenuItem, type MenuItemProps, type MenuProps, MenuSection, type MenuSectionProps, MenuTrigger, type MenuTriggerProps, NavigationBar, type NavigationBarBadge, NavigationBarItem, type NavigationBarItemConfig, type NavigationBarItemProps, type NavigationBarItemRenderProps, type NavigationBarProps, type PeriodSelectorContainerVariants, type PeriodSelectorItemVariants, type PeriodSelectorProps, Progress, ProgressHeadless, type ProgressHeadlessProps, type ProgressProps, Radio, RadioGroup, RadioGroupHeadless, type RadioGroupHeadlessProps, type RadioGroupProps, RadioHeadless, type RadioHeadlessProps, type RadioProps, type RangeCalendarProps, RichTooltip, type RichTooltipProps, type RichTooltipVariants, STATE_LAYER_OPACITY, Search, SearchBar, SearchBarHeadless, type SearchBarHeadlessProps, type SearchBarProps, type SearchLayout, type SearchProps, type SearchStyle, SearchView, SearchViewHeadless, type SearchViewHeadlessProps, type SearchViewProps, Slider, SliderHeadless, type SliderHeadlessProps, type SliderOrientation, type SliderProps, type SliderRangeThumbLabels, type SliderRenderState, type SliderSize, type SliderThumbProps, type SliderThumbState, type SliderVariant, Snackbar, type SnackbarAction, SnackbarContext, type SnackbarContextValue, SnackbarHeadless, type SnackbarHeadlessProps, type SnackbarItem, type SnackbarProps, SnackbarProvider, type SnackbarProviderProps, type SnackbarSeverity, SplitButton, type SplitButtonContainerVariants, type SplitButtonDropdownVariants, SplitButtonHeadless, type SplitButtonHeadlessProps, type SplitButtonMenuItem, type SplitButtonPrimaryVariants, type SplitButtonProps, type SplitButtonSize, type SplitButtonVariant, Switch, type SwitchProps, TYPOGRAPHY_ELEMENT_MAP, TYPOGRAPHY_USAGE, Tab, type TabItem, type TabLayout, TabList, type TabListProps, TabPanel, type TabPanelProps, type TabProps, type TabVariant, Tabs, type TabsProps, TextField, type TextFieldProps, type TextFieldSize, type TextFieldVariant, type TimeFormat, type TimeInputFieldProps, type TimeInputFieldVariants, type TimePeriod, TimePicker, type TimePickerActionButtonVariants, type TimePickerActionRowVariants, type TimePickerContainerVariants, TimePickerDial, type TimePickerDialProps, type TimePickerHeadlessProps, type TimePickerHeadlineVariants, TimePickerInput, type TimePickerInputProps, type TimePickerModeToggleVariants, type TimePickerOrientation, type TimePickerProps, type TimePickerRenderState, type TimePickerVariant, type TimeSelectorContainerVariants, type TimeSelectorProps, type TimeSeparatorVariants, type TimeValue, Tooltip, type TooltipHeadlessProps, TooltipOverlayHeadless, type TooltipPlacement, type TooltipProps, TooltipTrigger, TooltipTriggerHeadless, type TooltipTriggerProps, type TooltipTriggerStyledProps, type TooltipVariant, type TooltipVariants, type TypographyProperty, type TypographyStyleObject, type UseBottomSheetDragOptions, type UseBottomSheetDragReturn, type YearItemVariants, applyStateLayer, badgeVariants, bottomSheetAnimationVariants, bottomSheetHandlePillVariants, bottomSheetHandleWrapperVariants, bottomSheetScrimVariants, bottomSheetVariants, buttonGroupFocusRingVariants, buttonGroupRootVariants, buttonGroupVariants, calendarCellVariants, cardVariants, chipVariants, clockDialContainerVariants, clockDialNumberVariants, clockHandCenterVariants, clockHandHandleVariants, clockHandTrackVariants, cn, datePickerActionButtonVariants, datePickerActionVariants, datePickerContainerVariants, datePickerDividerVariants, datePickerHeaderVariants, datePickerHeadlineVariants, datePickerNavVariants, datePickerRangeIndicatorVariants, datePickerScrimVariants, datePickerSupportingTextVariants, datePickerWeekdayVariants, dividerVariants, fabMenuItemVariants, fabMenuVariants, generateMD3Theme, getColorValue, getConnectedRadiusClasses, getFontFamily, getMD3Color, getResponsiveTypography, getTypographyClassName, getTypographyForElement, getTypographyStyle, getTypographyToken, hexToRgb, listItemVariants, listVariants, periodSelectorContainerVariants, periodSelectorItemVariants, pxToRem, remToPx, rgbToHex, richTooltipVariants, searchBarVariants, searchViewHeaderVariants, searchViewVariants, sliderActiveTrackVariants, sliderContainerVariants, sliderHandleStateLayerVariants, sliderHandleVariants, sliderInactiveTrackVariants, sliderTrackLayoutVariants, splitButtonContainerVariants, splitButtonDropdownVariants, splitButtonPrimaryVariants, splitButtonVariants, timeInputFieldVariants, timePickerActionButtonVariants, timePickerActionRowVariants, timePickerContainerVariants, timePickerHeadlineVariants, timePickerModeToggleVariants, timeSelectorContainerVariants, timeSeparatorVariants, tooltipVariants, truncateText, useBottomSheetContext, useBottomSheetDrag, useButtonGroup, useDialogContext, useFABMenuContext, useMenuContext, useOptionalButtonGroup, useSnackbar, withOpacity, yearItemVariants };
+export { AppBar, AppBarHeadless, type AppBarHeadlessProps, type AppBarProps, type AppBarVariant, Badge, type BadgeColor, BadgeContent, type BadgeContentProps, BadgeHeadless, type BadgeHeadlessProps, type BadgeProps, type BadgeVariants, BottomSheet, type BottomSheetAnimationState, type BottomSheetAnimationVariants, BottomSheetContext, type BottomSheetContextValue, BottomSheetHandle, type BottomSheetHandleProps, type BottomSheetHandleVariants, BottomSheetHeadless, type BottomSheetHeadlessProps, type BottomSheetProps, type BottomSheetScrimVariants, type BottomSheetVariant, type BottomSheetVariants, Button, ButtonGroup, ButtonGroupContext, type ButtonGroupContextValue, type ButtonGroupFocusRingVariants, ButtonGroupHeadless, type ButtonGroupProps, type ButtonGroupRootVariants, type ButtonGroupSelectionMode, type ButtonGroupShape, type ButtonGroupSize, type ButtonGroupVariant, type ButtonProps, type ButtonSize, type ButtonVariant, type CalendarCellProps, type CalendarCellType, type CalendarCellVariants, CalendarCore, type CalendarGridProps, type CalendarView, Card, CardActions, type CardActionsProps, CardContent, type CardContentProps, CardHeader, type CardHeaderProps, CardHeadless, type CardHeadlessProps, CardMedia, type CardMediaProps, type CardProps, type CardVariant, type CardVariants, Checkbox, type CheckboxProps, Chip, ChipHeadless, type ChipHeadlessProps, type ChipProps, ChipSet, type ChipSetProps, type ChipSurface, type ChipType, type ChipVariants, type ClockDialContainerVariants, type ClockDialNumberVariants, type ClockDialProps, type ClockHandCenterVariants, type ClockHandHandleVariants, type ClockHandProps, type ClockHandTrackVariants, type ClockSelectionMode, DateField, type DateFieldProps, type DateInputFieldProps, DatePicker, type DatePickerActionButtonVariants, type DatePickerActionVariants, type DatePickerActionsProps, type DatePickerContainerVariants, type DatePickerDividerVariants, DatePickerDocked, type DatePickerDockedProps, type DatePickerHeaderVariants, type DatePickerHeadlessProps, type DatePickerHeadlineVariants, DatePickerModal, type DatePickerModalHeaderProps, DatePickerModalInput, type DatePickerModalInputProps, type DatePickerModalProps, type DatePickerNavVariants, type DatePickerProps, type DatePickerRangeIndicatorVariants, type DatePickerRenderState, type DatePickerScrimVariants, type DatePickerSupportingTextVariants, type DatePickerVariant, type DatePickerWeekdayVariants, type DateSelectionMode, Dialog, DialogActions, type DialogActionsProps, type DialogAnimationState, DialogContent, type DialogContentProps, DialogContext, type DialogContextValue, DialogHeadless, type DialogHeadlessProps, DialogHeadline, type DialogHeadlineProps, type DialogProps, type DialogVariant, Divider, DividerHeadless, type DividerHeadlessProps, type DividerInset, type DividerOrientation, type DividerProps, type DividerVariants, Drawer, type DrawerContextValue, DrawerIconOnlyContext, DrawerItem, type DrawerItemBadgeConfig, type DrawerItemProps, type DrawerProps, DrawerSection, type DrawerSectionProps, type DrawerVariant, FAB, type FABColor, FABHeadless, type FABHeadlessProps, FABMenu, FABMenuContext, type FABMenuContextValue, type FABMenuDirection, FABMenuHeadless, type FABMenuHeadlessProps, FABMenuItem, type FABMenuItemColor, type FABMenuItemFocusRingVariants, type FABMenuItemIconVariants, type FABMenuItemLabelVariants, type FABMenuItemProps, type FABMenuItemStateLayerVariants, type FABMenuItemVariants, type FABMenuListVariants, type FABMenuProps, type FABMenuVariants, type FABProps, type FABSize, HeadlessDrawer, HeadlessDrawerItem, type HeadlessDrawerItemProps, type HeadlessDrawerProps, HeadlessMenu, HeadlessMenuDivider, HeadlessMenuItem, type HeadlessMenuItemProps, type HeadlessMenuProps, HeadlessMenuSection, type HeadlessMenuSectionProps, HeadlessMenuTrigger, type HeadlessMenuTriggerProps, HeadlessNavigationBar, HeadlessNavigationBarItem, type HeadlessNavigationBarItemProps, type HeadlessNavigationBarProps, HeadlessTab, HeadlessTabList, HeadlessTabPanel, type HeadlessTabPanelProps, type HeadlessTabProps, IconButton, type IconButtonColor, IconButtonHeadless, type IconButtonHeadlessProps, type IconButtonProps, type IconButtonSize, type IconButtonVariant, List, type ListDensity, ListHeadless, type ListHeadlessProps, ListItem, ListItemHeadless, ListItemLeading, type ListItemLeadingProps, type ListItemProps, ListItemText, type ListItemTextProps, ListItemTrailing, type ListItemTrailingProps, type ListItemVariants, type ListLeadingType, type ListProps, type ListTrailingType, type ListVariants, type MD3ColorRole, type MD3TypographyScale, type MD3TypographySize, type MD3TypographyStyle, Menu, type MenuContainerVariants, MenuContext, type MenuContextValue, MenuDivider, type MenuDividerProps, MenuItem, type MenuItemProps, type MenuProps, MenuSection, type MenuSectionProps, MenuTrigger, type MenuTriggerProps, NavigationBar, type NavigationBarBadge, NavigationBarItem, type NavigationBarItemConfig, type NavigationBarItemProps, type NavigationBarItemRenderProps, type NavigationBarProps, type PeriodSelectorContainerVariants, type PeriodSelectorItemVariants, type PeriodSelectorProps, Progress, ProgressHeadless, type ProgressHeadlessProps, type ProgressProps, Radio, RadioGroup, RadioGroupHeadless, type RadioGroupHeadlessProps, type RadioGroupProps, RadioHeadless, type RadioHeadlessProps, type RadioProps, type RangeCalendarProps, RichTooltip, type RichTooltipProps, type RichTooltipVariants, STATE_LAYER_OPACITY, Search, SearchBar, SearchBarHeadless, type SearchBarHeadlessProps, type SearchBarProps, type SearchLayout, type SearchProps, type SearchStyle, SearchView, SearchViewHeadless, type SearchViewHeadlessProps, type SearchViewProps, Slider, SliderHeadless, type SliderHeadlessProps, type SliderOrientation, type SliderProps, type SliderRangeThumbLabels, type SliderRenderState, type SliderSize, type SliderThumbProps, type SliderThumbState, type SliderVariant, Snackbar, type SnackbarAction, SnackbarContext, type SnackbarContextValue, SnackbarHeadless, type SnackbarHeadlessProps, type SnackbarItem, type SnackbarProps, SnackbarProvider, type SnackbarProviderProps, type SnackbarSeverity, SplitButton, type SplitButtonContainerVariants, type SplitButtonDropdownVariants, SplitButtonHeadless, type SplitButtonHeadlessProps, type SplitButtonMenuItem, type SplitButtonPrimaryVariants, type SplitButtonProps, type SplitButtonSize, type SplitButtonVariant, Switch, type SwitchProps, TYPOGRAPHY_ELEMENT_MAP, TYPOGRAPHY_USAGE, Tab, type TabItem, type TabLayout, TabList, type TabListProps, TabPanel, type TabPanelProps, type TabProps, type TabVariant, Tabs, type TabsProps, TextField, type TextFieldProps, type TextFieldSize, type TextFieldVariant, type TimeFormat, type TimeInputFieldProps, type TimeInputFieldVariants, type TimePeriod, TimePicker, type TimePickerActionButtonVariants, type TimePickerActionRowVariants, type TimePickerContainerVariants, TimePickerDial, type TimePickerDialProps, type TimePickerHeadlessProps, type TimePickerHeadlineVariants, TimePickerInput, type TimePickerInputProps, type TimePickerModeToggleVariants, type TimePickerOrientation, type TimePickerProps, type TimePickerRenderState, type TimePickerVariant, type TimeSelectorContainerVariants, type TimeSelectorProps, type TimeSeparatorVariants, type TimeValue, Tooltip, type TooltipHeadlessProps, TooltipOverlayHeadless, type TooltipPlacement, type TooltipProps, TooltipTrigger, TooltipTriggerHeadless, type TooltipTriggerProps, type TooltipTriggerStyledProps, type TooltipVariant, type TooltipVariants, type TypographyProperty, type TypographyStyleObject, type UseBottomSheetDragOptions, type UseBottomSheetDragReturn, type YearItemVariants, applyStateLayer, badgeVariants, bottomSheetAnimationVariants, bottomSheetHandlePillVariants, bottomSheetHandleWrapperVariants, bottomSheetScrimVariants, bottomSheetVariants, buttonGroupFocusRingVariants, buttonGroupRootVariants, buttonGroupVariants, calendarCellVariants, cardVariants, chipVariants, clockDialContainerVariants, clockDialNumberVariants, clockHandCenterVariants, clockHandHandleVariants, clockHandTrackVariants, cn, datePickerActionButtonVariants, datePickerActionVariants, datePickerContainerVariants, datePickerDividerVariants, datePickerHeaderVariants, datePickerHeadlineVariants, datePickerNavVariants, datePickerRangeIndicatorVariants, datePickerScrimVariants, datePickerSupportingTextVariants, datePickerWeekdayVariants, dividerVariants, fabMenuItemFocusRingVariants, fabMenuItemIconVariants, fabMenuItemLabelVariants, fabMenuItemStateLayerVariants, fabMenuItemVariants, fabMenuListVariants, fabMenuVariants, generateMD3Theme, getColorValue, getConnectedRadiusClasses, getFontFamily, getMD3Color, getResponsiveTypography, getTypographyClassName, getTypographyForElement, getTypographyStyle, getTypographyToken, hexToRgb, listItemVariants, listVariants, periodSelectorContainerVariants, periodSelectorItemVariants, pxToRem, remToPx, rgbToHex, richTooltipVariants, searchBarVariants, searchViewHeaderVariants, searchViewVariants, sliderActiveTrackVariants, sliderContainerVariants, sliderHandleStateLayerVariants, sliderHandleVariants, sliderInactiveTrackVariants, sliderTrackLayoutVariants, splitButtonContainerVariants, splitButtonDropdownVariants, splitButtonPrimaryVariants, splitButtonVariants, timeInputFieldVariants, timePickerActionButtonVariants, timePickerActionRowVariants, timePickerContainerVariants, timePickerHeadlineVariants, timePickerModeToggleVariants, timeSelectorContainerVariants, timeSeparatorVariants, tooltipVariants, truncateText, useBottomSheetContext, useBottomSheetDrag, useButtonGroup, useDialogContext, useFABMenuContext, useMenuContext, useOptionalButtonGroup, useSnackbar, withOpacity, yearItemVariants };