@tinybigui/react 0.4.1 → 0.4.2

package/dist/index.d.cts

@@ -733,22 +733,51 @@ declare const AppBar: React$1.ForwardRefExoticComponent<AppBarProps & React$1.Re
 declare const AppBarHeadless: React$1.ForwardRefExoticComponent<AppBarHeadlessProps & React$1.RefAttributes<HTMLElement>>;
 
 /**
- * Material Design 3 Button Variants (CVA)
- *
- * Type-safe variant management for Button component.
- * Uses Tailwind CSS classes mapped to MD3 design tokens.
+ * Material Design 3 Button Variants
+ *
+ * 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]/button Tailwind selectors in each slot's base classes.
+ * - Content flags (data-with-icon, data-loading) are set explicitly by the component.
+ *
+ * Slot responsibilities:
+ *   buttonVariants           — root <button>; shape, color, elevation
+ *   buttonStateLayerVariants — hover/focus/press opacity ring (absolute inset overlay)
+ *   buttonFocusRingVariants  — keyboard focus outline, MUST NOT be inside overflow-hidden
+ *   buttonIconVariants       — leading/trailing icon wrapper
+ *   buttonLabelVariants      — label text slot
+ *
+ * MD3 Spec:
+ *   Shape: rounded-full (corner-full)
+ *   Height: 32dp small | 40dp medium | 56dp large
+ *   Padding: 16dp small | 24dp medium | 32dp large (12dp text variant)
+ *   Icon size: 18px × 18px
+ *   State-layer opacities: hover 8% | focus 10% | pressed 10%
+ *   Disabled: container 12% opacity, content 38% opacity
+ *
+ * Elevation per state (MD3 comp tokens):
+ *   Filled   base=0  hover=1  focus=0  pressed=0
+ *   Tonal    base=0  hover=1  focus=0  pressed=0
+ *   Elevated base=1  hover=2  focus=1  pressed=1
+ *   Outlined base=0  hover=0  focus=0  pressed=0
+ *   Text     base=0  hover=0  focus=0  pressed=0
+ */
+/**
+ * Root <button> element.
+ *
+ * IMPORTANT — overflow is intentionally NOT on the root.
+ * Overflow clipping is delegated to the ripple container and state layer
+ * via `overflow-hidden rounded-[inherit]` on those children. This lets the
+ * focus ring span (`inset-[-3px]`) extend outside the button boundary and
+ * remain fully visible — if overflow-hidden were on the root it would be
+ * clipped to zero width.
  */
 declare const buttonVariants: (props?: ({
     variant?: "text" | "filled" | "outlined" | "tonal" | "elevated" | null | undefined;
-    color?: "primary" | "secondary" | "tertiary" | "error" | null | undefined;
     size?: "small" | "large" | "medium" | null | undefined;
     fullWidth?: boolean | null | undefined;
-    disabled?: boolean | null | undefined;
-    loading?: boolean | null | undefined;
 } & class_variance_authority_types.ClassProp) | undefined) => string;
-/**
- * Extract variant prop types from CVA
- */
 type ButtonVariants = VariantProps<typeof buttonVariants>;
 
 /**
@@ -756,68 +785,63 @@ type ButtonVariants = VariantProps<typeof buttonVariants>;
  */
 type ButtonVariant = "filled" | "outlined" | "tonal" | "elevated" | "text";
 /**
- * Button color schemes (Material Design 3 color roles)
- */
-type ButtonColor = "primary" | "secondary" | "tertiary" | "error";
-/**
- * Button sizes
+ * Button sizes (Material Design 3)
  */
 type ButtonSize = "small" | "medium" | "large";
 /**
  * Material Design 3 Button Component Props
  *
  * Built on React Aria for world-class accessibility.
- * Supports 5 variants: filled, outlined, tonal, elevated, text
- * Implementation uses CVA + Tailwind CSS classes mapped to MD3 tokens.
+ * Supports 5 strict MD3 variants: filled, outlined, tonal, elevated, text.
+ * Each variant uses its spec-defined color roles — no color override prop.
+ *
+ * Interaction states (hover, focus, press, disabled) are managed via
+ * React Aria hooks and expressed as data-* attributes on the root element,
+ * consumed by slot classes via group-data-[x]/button selectors.
  *
  * @example
  * ```tsx
- * // Filled button (default)
- * <Button variant="filled" color="primary">
- *   Click me
- * </Button>
+ * // Filled button (default, highest emphasis)
+ * <Button variant="filled">Save</Button>
+ *
+ * // Outlined button (medium emphasis)
+ * <Button variant="outlined">Cancel</Button>
  *
- * // With icon
- * <Button variant="tonal" icon={<IconAdd />}>
+ * // Tonal button (secondary emphasis)
+ * <Button variant="tonal">Learn more</Button>
+ *
+ * // With icon (MD3 spec: 18px × 18px)
+ * <Button variant="filled" icon={<IconAdd className="h-[18px] w-[18px]" />}>
  *   Add Item
  * </Button>
  *
  * // Loading state
- * <Button variant="elevated" loading>
- *   Saving...
- * </Button>
+ * <Button variant="elevated" loading>Saving...</Button>
  *
  * // Disabled
- * <Button variant="outlined" isDisabled>
- *   Disabled
- * </Button>
+ * <Button variant="outlined" isDisabled>Disabled</Button>
  *
  * // Headless version (custom styling)
- * <ButtonHeadless className="my-custom-styles">
- *   Click me
- * </ButtonHeadless>
+ * <ButtonHeadless className="my-custom-styles">Click me</ButtonHeadless>
  * ```
  */
 interface ButtonProps extends AriaButtonProps, Omit<React__default.HTMLAttributes<HTMLButtonElement>, keyof AriaButtonProps | "children"> {
     /**
-     * Button variant
+     * Button variant (MD3 specification).
+     * Determines visual emphasis and color roles.
      * @default 'filled'
      */
     variant?: ButtonVariant;
     /**
-     * Color scheme
-     * @default 'primary'
-     */
-    color?: ButtonColor;
-    /**
-     * Size variant
+     * Size variant.
+     * MD3 heights: small=32dp, medium=40dp, large=56dp
      * @default 'medium'
      */
     size?: ButtonSize;
     /**
-     * Leading icon (before text)
+     * Leading icon (before label text).
      *
-     * MD3 Specification: Icons should be 18px × 18px
+     * MD3 Specification: Icons must be 18px × 18px.
      *
      * @example
      * ```tsx
@@ -828,9 +852,9 @@ interface ButtonProps extends AriaButtonProps, Omit<React__default.HTMLAttribute
      */
     icon?: React__default.ReactNode;
     /**
-     * Trailing icon (after text)
+     * Trailing icon (after label text).
      *
-     * MD3 Specification: Icons should be 18px × 18px
+     * MD3 Specification: Icons must be 18px × 18px.
      *
      * @example
      * ```tsx
@@ -841,35 +865,36 @@ interface ButtonProps extends AriaButtonProps, Omit<React__default.HTMLAttribute
      */
     trailingIcon?: React__default.ReactNode;
     /**
-     * Button content (text)
+     * Button label content.
      */
     children: React__default.ReactNode;
     /**
-     * Full width button (spans container)
+     * Full width button (spans container width).
      * @default false
      */
     fullWidth?: boolean;
     /**
-     * Loading state - shows spinner, disables interaction
+     * Loading state — shows spinner and disables interaction.
+     * The button remains in the DOM as disabled while loading.
      * @default false
      */
     loading?: boolean;
     /**
-     * Disable ripple effect
+     * Disable the ripple effect on press.
      * @default false
      */
     disableRipple?: boolean;
     /**
-     * Additional CSS classes (Tailwind)
+     * Additional Tailwind CSS classes applied to the root element.
      */
     className?: string;
     /**
-     * Tab index for keyboard navigation
+     * Tab index for keyboard navigation.
      * @default 0
      */
     tabIndex?: number;
     /**
-     * Button type attribute
+     * Button type attribute.
      * @default 'button'
      */
     type?: "button" | "submit" | "reset";
@@ -879,58 +904,51 @@ interface ButtonProps extends AriaButtonProps, Omit<React__default.HTMLAttribute
  * Material Design 3 Button Component (Layer 3: Styled)
  *
  * Built on React Aria for world-class accessibility.
- * Uses CVA for type-safe variant management.
- * Styled with Tailwind CSS using MD3 design tokens.
+ * 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]/button Tailwind selectors — no state variants in CVA.
  *
  * Features:
  * - ✅ 5 MD3 variants: filled, outlined, tonal, elevated, text
- * - ✅ 4 color schemes: primary, secondary, tertiary, error
- * - ✅ 3 sizes: small, medium, large
+ * - ✅ 3 sizes: small (32dp), medium (40dp), large (56dp)
  * - ✅ Loading state with spinner
  * - ✅ Ripple effect (Material Design)
+ * - ✅ Proper MD3 state layer (hover 8%, focus 10%, pressed 10%)
  * - ✅ Full keyboard accessibility (via React Aria)
  * - ✅ Screen reader support (via React Aria)
  * - ✅ Focus management (via React Aria)
  * - ✅ ButtonGroup-aware: applies connected corner radii and min-width when inside a group
  *
  * MD3 Specifications:
- * - Height: 40dp (medium), 32dp (small), 48dp (large)
- * - Typography: Label Large (14px, 500 weight, +0.1px letter-spacing)
+ * - Height: 40dp (medium), 32dp (small), 56dp (large)
+ * - Typography: Label Large (medium), Label Medium (small), Title Medium (large)
  * - Icon size: 18px × 18px (per MD3 spec)
- * - State layers: 8% hover, 12% focus/pressed
- * - Elevation: Level 1 on hover (filled), Level 1→2 (elevated)
+ * - State layers: 8% hover, 10% focus/pressed
+ * - Elevation: Level 1 on hover (filled), Level 1 base → Level 2 hover (elevated)
  *
  * @example
  * ```tsx
  * // Basic usage
  * <Button>Click me</Button>
  *
- * // With variant and color
- * <Button variant="outlined" color="secondary">
- *   Secondary Action
- * </Button>
+ * // With variant
+ * <Button variant="outlined">Secondary Action</Button>
  *
- * // With icon (MD3 spec: icons should be 18px × 18px)
+ * // With icon (MD3 spec: icons are 18px × 18px)
  * <Button icon={<IconAdd className="h-[18px] w-[18px]" />}>
  *   Add Item
  * </Button>
  *
  * // Loading state
- * <Button loading>
- *   Saving...
- * </Button>
+ * <Button loading>Saving...</Button>
  *
  * // Disabled
- * <Button isDisabled>
- *   Disabled
- * </Button>
+ * <Button isDisabled>Disabled</Button>
  *
  * // Full width
- * <Button fullWidth>
- *   Full Width Button
- * </Button>
+ * <Button fullWidth>Full Width Button</Button>
  *
- * // Inside a connected ButtonGroup (corner radii applied automatically)
+ * // Inside a connected ButtonGroup
  * <ButtonGroup variant="connected" selectionMode="required" defaultValue="md">
  *   <Button value="sm">S</Button>
  *   <Button value="md">M</Button>
@@ -938,7 +956,7 @@ interface ButtonProps extends AriaButtonProps, Omit<React__default.HTMLAttribute
  * </ButtonGroup>
  * ```
  */
-declare const Button: React__default.ForwardRefExoticComponent<ButtonProps & Omit<ButtonVariants, "disabled"> & React__default.RefAttributes<HTMLButtonElement>>;
+declare const Button: React__default.ForwardRefExoticComponent<ButtonProps & Omit<ButtonVariants, never> & React__default.RefAttributes<HTMLButtonElement>>;
 
 /**
  * ButtonGroup layout variant (Material Design 3)
@@ -999,6 +1017,13 @@ interface ButtonGroupContextValue {
      * The child passes its own `value` string.
      */
     onSelectionChange: (value: string) => void;
+    /**
+     * Whether the entire group is disabled.
+     * When `true`, all child buttons should be non-interactive.
+     *
+     * @default false
+     */
+    isDisabled: boolean;
     /**
      * Tailwind class for the inner (adjacent) corner radius in the connected variant.
      * Applied to all four corners of every button in a connected group.
@@ -1124,6 +1149,14 @@ interface ButtonGroupProps extends Omit<React__default.HTMLAttributes<HTMLDivEle
      * @default new Set()
      */
     defaultValue?: string | string[] | undefined;
+    /**
+     * Whether the entire group and all child buttons are disabled.
+     * When `true`, the group container receives `data-disabled` and
+     * all children inherit the disabled state via context.
+     *
+     * @default false
+     */
+    isDisabled?: boolean;
     /**
      * Child buttons (Button, IconButton, or any element with a `value` prop).
      */
@@ -1137,10 +1170,21 @@ interface ButtonGroupProps extends Omit<React__default.HTMLAttributes<HTMLDivEle
 /**
  * Material Design 3 ButtonGroup Component (Layer 3: Styled)
  *
+ * Built on the Variants-vs-States architecture: interaction/selection states
+ * are expressed as data-* attributes on the root and consumed by child slots
+ * via group-data-[x]/button-group Tailwind selectors.
+ *
  * An invisible container that:
- * - Applies MD3-spec gap between child buttons
+ * - Applies MD3-spec gap between child buttons with spatial spring transitions
  * - Manages selection state (single / multi / required) across toggle buttons
- * - Passes shape, size, and variant metadata to children via React Context
+ * - Passes shape, size, variant, and disabled metadata to children via React Context
+ * - Emits container-level state attributes for CSS targeting
+ *
+ * Container data attributes:
+ * - `data-connected`      — variant is "connected"
+ * - `data-has-selection`  — at least one child button is selected
+ * - `data-selection-mode` — "single" | "required" | "multi"
+ * - `data-disabled`       — group is non-interactive (via getInteractionDataAttributes)
  *
  * Variants:
  * - `standard`: Buttons float independently. Gap is larger for xs/sm to preserve
@@ -1153,6 +1197,11 @@ interface ButtonGroupProps extends Omit<React__default.HTMLAttributes<HTMLDivEle
  * - `required`: Exactly one always selected; pressing the active button is a no-op.
  * - `multi`: Any number of buttons selected simultaneously.
  *
+ * Motion:
+ * - Gap transitions use spring-standard-fast-spatial (350ms) for smooth layout changes
+ * - Border-radius morphing on child buttons uses expressive-fast-spatial (350ms, overshoot)
+ * - Color/opacity effects on children use spring-standard-fast-effects (150ms, no overshoot)
+ *
  * @example
  * ```tsx
  * // Standard icon-button group (no selection management)
@@ -1173,16 +1222,10 @@ interface ButtonGroupProps extends Omit<React__default.HTMLAttributes<HTMLDivEle
  *   <Button value="16oz">16 oz</Button>
  * </ButtonGroup>
  *
- * // Controlled multi-select
- * <ButtonGroup
- *   variant="connected"
- *   selectionMode="multi"
- *   selectedValues={selected}
- *   onSelectionChange={setSelected}
- *   aria-label="Text formatting"
- * >
- *   <Button value="bold">Bold</Button>
- *   <Button value="italic">Italic</Button>
+ * // Disabled group
+ * <ButtonGroup variant="connected" isDisabled aria-label="Unavailable options">
+ *   <Button value="a">A</Button>
+ *   <Button value="b">B</Button>
  * </ButtonGroup>
  * ```
  */
@@ -1224,28 +1267,73 @@ declare const ButtonGroup: React__default.ForwardRefExoticComponent<ButtonGroupP
 declare const ButtonGroupHeadless: React__default.ForwardRefExoticComponent<ButtonGroupProps & React__default.RefAttributes<HTMLDivElement>>;
 
 /**
- * Material Design 3 ButtonGroup Variants (CVA)
+ * Material Design 3 ButtonGroup Variants
+ *
+ * Architecture: Variants vs States
+ * - CVA holds design-time structure only (no interaction state variants).
+ * - All interaction/selection states are driven by data-* attributes on the root
+ *   via group-data-[x]/button-group Tailwind selectors.
+ * - Container-level state attributes:
+ *     data-connected      — variant is "connected"
+ *     data-has-selection  — at least one child button is selected
+ *     data-disabled       — entire group is non-interactive
+ *     data-selection-mode — "single" | "required" | "multi" (when applicable)
  *
- * Type-safe variant management for the ButtonGroup container.
- * The container has no colour of its own — it only controls layout
- * (display, width) and the inner gap between child buttons.
+ * Slot responsibilities:
+ *   buttonGroupRootVariants  — layout container; gap, alignment, motion, disabled state
  *
- * MD3 Inner Gap Spec:
- * | Size        | standard   | connected |
- * |-------------|------------|-----------|
- * | extra-small | 18dp       | 2dp       |
- * | small       | 12dp       | 2dp       |
- * | medium      | 8dp        | 2dp       |
- * | large       | 8dp        | 2dp       |
- * | extra-large | 8dp        | 2dp       |
+ * MD3 Spec (Inner Gap):
+ *   | Size        | standard   | connected |
+ *   |-------------|------------|-----------|
+ *   | extra-small | 18dp       | 2dp       |
+ *   | small       | 12dp       | 2dp       |
+ *   | medium      | 8dp        | 2dp       |
+ *   | large       | 8dp        | 2dp       |
+ *   | extra-large | 8dp        | 2dp       |
+ *
+ * Motion:
+ *   Gap is a spatial property — uses spring-standard-fast-spatial (350ms, no overshoot
+ *   for gap since CSS gap cannot visually overshoot). This ensures smooth transitions
+ *   when the size prop changes or buttons are added/removed.
  *
  * Note: xs/sm standard gaps are intentionally large to preserve 48dp touch targets.
  * Connected gap is always 2dp (`gap-0.5`) regardless of size.
  */
+/**
+ * Root container element — carries `group/button-group` scope via the styled layer.
+ *
+ * Handles:
+ * - Flexbox layout (inline-flex or flex)
+ * - Gap between child buttons (per variant × size)
+ * - Spatial motion for gap transitions
+ * - Disabled state (opacity + pointer-events)
+ */
+declare const buttonGroupRootVariants: (props?: ({
+    variant?: "standard" | "connected" | null | undefined;
+    size?: "small" | "large" | "medium" | "extra-small" | "extra-large" | null | undefined;
+} & class_variance_authority_types.ClassProp) | undefined) => string;
+/**
+ * Focus ring overlay for the group container.
+ *
+ * Visible only when the group itself receives keyboard focus (rare — typically
+ * focus goes to child buttons). Included for completeness and edge cases where
+ * the group container might receive programmatic focus.
+ *
+ * Uses the same pattern as Switch/Button focus rings:
+ * - Always in DOM (opacity-0)
+ * - Transitions to opacity-100 on group-data-[focus-visible]
+ */
+declare const buttonGroupFocusRingVariants: (props?: class_variance_authority_types.ClassProp | undefined) => string;
+/**
+ * @deprecated Use `buttonGroupRootVariants` instead.
+ * Kept for backward compatibility during migration.
+ */
 declare const buttonGroupVariants: (props?: ({
     variant?: "standard" | "connected" | null | undefined;
     size?: "small" | "large" | "medium" | "extra-small" | "extra-large" | null | undefined;
 } & class_variance_authority_types.ClassProp) | undefined) => string;
+type ButtonGroupRootVariants = VariantProps<typeof buttonGroupRootVariants>;
+type ButtonGroupFocusRingVariants = VariantProps<typeof buttonGroupFocusRingVariants>;
 
 /**
  * Context that provides ButtonGroup state to all child buttons.
@@ -10617,4 +10705,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, type ButtonColor, ButtonGroup, ButtonGroupContext, type ButtonGroupContextValue, ButtonGroupHeadless, type ButtonGroupProps, 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, 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 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 };