@hypoth-ui/react 0.1.0

package/dist/index.d.ts

@@ -0,0 +1,3068 @@
+import * as react from 'react';
+import react__default, { ButtonHTMLAttributes, ReactNode, HTMLAttributes, TextareaHTMLAttributes, InputHTMLAttributes, ReactElement, Component, ComponentType, CSSProperties } from 'react';
+import { R as ResponsiveProp } from './client-8T-8F3H4.js';
+export { X as Alert, Y as AlertProps, Z as AlertVariant, A as AlignValue, u as AsChildProps, ac as Avatar, ad as AvatarGroup, ai as AvatarGroupProps, ae as AvatarProps, ag as AvatarShape, af as AvatarSize, ah as AvatarStatus, aE as Badge, aI as BadgePosition, aF as BadgeProps, aH as BadgeSize, aG as BadgeVariant, H as Box, m as BoxProps, b as ButtonSize, a as ButtonVariant, a_ as Calendar, a$ as CalendarProps, b0 as CalendarSize, Q as ClientOnly, C as ClientOnlyProps, b1 as DataTable, b3 as DataTableColumn, b5 as DataTablePagination, b2 as DataTableProps, b4 as DataTableSort, b6 as DataTableSortDirection, s as DisplayValue, p as DsInputEventDetail, D as DsNavigateEventDetail, t as FlexDirection, O as FocusScope, F as FocusScopeProps, o as FocusScopeRef, y as Icon, g as IconName, f as IconProps, h as IconSize, w as Input, I as InputProps, d as InputSize, c as InputType, q as InputValueHandler, J as JustifyValue, v as LegacyButton, B as LegacyButtonProps, x as Link, L as LinkProps, e as LinkVariant, aT as List, aU as ListItem, aZ as ListItemProps, aX as ListOrientation, aV as ListRootProps, aW as ListSelectionMode, aY as ListSize, N as NavigateEventHandler, M as Portal, P as PortalProps, a8 as Progress, a9 as ProgressProps, ab as ProgressSize, aa as ProgressVariant, ay as Skeleton, aD as SkeletonAnimation, az as SkeletonProps, aB as SkeletonSize, aA as SkeletonVariant, aC as SkeletonWidth, K as Slot, n as SlotProps, aw as SortDirection, r as SpacingValue, z as Spinner, S as SpinnerProps, i as SpinnerSize, aj as Table, av as TableAlign, al as TableBody, as as TableBodyProps, ao as TableCell, ax as TableCellProps, an as TableHead, au as TableHeadProps, ak as TableHeader, ar as TableHeaderProps, ap as TableRootProps, am as TableRow, at as TableRowProps, aq as TableSize, aJ as Tag, aK as TagProps, aM as TagSize, aL as TagVariant, G as Text, T as TextProps, j as TextSize, l as TextVariant, k as TextWeight, _ as Toast, a4 as ToastAction, a5 as ToastData, a6 as ToastOptions, a2 as ToastPosition, a0 as ToastProviderProps, a3 as ToastState, a1 as ToastVariant, aN as Tree, aO as TreeItem, aS as TreeItemProps, aP as TreeRootProps, aQ as TreeSelectionMode, aR as TreeSize, a7 as UseToastReturn, E as VisuallyHidden, V as VisuallyHiddenProps, W as WrapperConfig, b8 as attachEventListeners, ba as composeEventHandlers, b9 as createComponent, b7 as createEventHandler, bb as mergeClassNames, bd as mergeProps, bc as mergeStyles, U as useIsClient, $ as useToast } from './client-8T-8F3H4.js';
+import * as react_jsx_runtime from 'react/jsx-runtime';
+import { DialogRole, Placement as Placement$1, Option, DateRange, FileInfo, FileUploadError, TimeSegment, TimeValue } from '@hypoth-ui/primitives-dom';
+export { DialogRole, FileInfo, FileUploadError, TimeSegment, TimeValue, formatBytes } from '@hypoth-ui/primitives-dom';
+
+interface ButtonProps extends Omit<ButtonHTMLAttributes<HTMLButtonElement>, "type" | "disabled"> {
+    /** Button content */
+    children?: ReactNode;
+    /** Button type */
+    type?: "button" | "submit" | "reset";
+    /** Whether button is disabled */
+    disabled?: boolean;
+    /** Whether button is in loading state */
+    loading?: boolean;
+    /** Render as child element (polymorphic) */
+    asChild?: boolean;
+    /** Called when button is activated */
+    onPress?: () => void;
+}
+/**
+ * Accessible button component with loading and disabled states.
+ *
+ * @example
+ * ```tsx
+ * <Button onPress={() => console.log("clicked")}>Click me</Button>
+ *
+ * <Button loading>Saving...</Button>
+ *
+ * <Button asChild>
+ *   <a href="/link">Link styled as button</a>
+ * </Button>
+ * ```
+ */
+declare const Button: react.ForwardRefExoticComponent<ButtonProps & react.RefAttributes<HTMLButtonElement>>;
+
+interface FieldProps extends HTMLAttributes<HTMLElement> {
+    /** Whether the field has an error */
+    error?: boolean;
+    /** Whether the field is disabled */
+    disabled?: boolean;
+    /** Whether the field is required */
+    required?: boolean;
+    /** Field content */
+    children?: react__default.ReactNode;
+}
+/**
+ * React wrapper for ds-field Web Component.
+ * Container for form field with label, input, description, and error message.
+ */
+declare const Field: react__default.ForwardRefExoticComponent<FieldProps & react__default.RefAttributes<HTMLElement>>;
+
+interface LabelProps extends HTMLAttributes<HTMLElement> {
+    /** For attribute linking to input */
+    htmlFor?: string;
+    /** Label content */
+    children?: react__default.ReactNode;
+}
+/**
+ * React wrapper for ds-label Web Component.
+ * Label for form fields with automatic ID association.
+ */
+declare const Label: react__default.ForwardRefExoticComponent<LabelProps & react__default.RefAttributes<HTMLElement>>;
+
+interface FieldDescriptionProps extends HTMLAttributes<HTMLElement> {
+    /** Description content */
+    children?: react__default.ReactNode;
+}
+/**
+ * React wrapper for ds-field-description Web Component.
+ * Help text for form fields.
+ */
+declare const FieldDescription: react__default.ForwardRefExoticComponent<FieldDescriptionProps & react__default.RefAttributes<HTMLElement>>;
+
+interface FieldErrorProps extends HTMLAttributes<HTMLElement> {
+    /** Error message content */
+    children?: react__default.ReactNode;
+}
+/**
+ * React wrapper for ds-field-error Web Component.
+ * Error message for form fields.
+ */
+declare const FieldError: react__default.ForwardRefExoticComponent<FieldErrorProps & react__default.RefAttributes<HTMLElement>>;
+
+interface DialogCloseProps extends ButtonHTMLAttributes<HTMLButtonElement> {
+    /** Button content */
+    children?: ReactNode;
+    /** Render as child element (polymorphic) */
+    asChild?: boolean;
+}
+
+type DialogContentSize = "sm" | "md" | "lg" | "xl" | "full";
+interface DialogContentProps extends HTMLAttributes<HTMLDivElement> {
+    /** Dialog content */
+    children?: ReactNode;
+    /** Content size */
+    size?: DialogContentSize;
+    /** Container element for portal (defaults to document.body) */
+    container?: HTMLElement | null;
+    /** Force mount even when closed (for animations) */
+    forceMount?: boolean;
+}
+
+interface DialogDescriptionProps extends HTMLAttributes<HTMLParagraphElement> {
+    /** Description content */
+    children?: ReactNode;
+}
+
+interface DialogRootProps {
+    /** Dialog content */
+    children?: ReactNode;
+    /** Custom ID for the dialog (SSR-safe auto-generated if not provided) */
+    id?: string;
+    /** Controlled open state */
+    open?: boolean;
+    /** Default open state (uncontrolled) */
+    defaultOpen?: boolean;
+    /** Called when open state changes */
+    onOpenChange?: (open: boolean) => void;
+    /** Dialog role */
+    role?: DialogRole;
+    /** Whether dialog is modal (traps focus) */
+    modal?: boolean;
+}
+/**
+ * Root component for Dialog compound pattern.
+ * Provides context to Trigger, Content, Title, Description, and Close.
+ *
+ * @example
+ * ```tsx
+ * <Dialog.Root>
+ *   <Dialog.Trigger>Open</Dialog.Trigger>
+ *   <Dialog.Content>
+ *     <Dialog.Title>Dialog Title</Dialog.Title>
+ *     <Dialog.Description>Dialog description</Dialog.Description>
+ *     <Dialog.Close>Close</Dialog.Close>
+ *   </Dialog.Content>
+ * </Dialog.Root>
+ * ```
+ */
+declare function DialogRoot({ children, id, open: controlledOpen, defaultOpen, onOpenChange, role, modal, }: DialogRootProps): react_jsx_runtime.JSX.Element;
+declare namespace DialogRoot {
+    var displayName: string;
+}
+
+interface DialogTitleProps extends HTMLAttributes<HTMLHeadingElement> {
+    /** Title content */
+    children?: ReactNode;
+}
+
+interface DialogTriggerProps extends ButtonHTMLAttributes<HTMLButtonElement> {
+    /** Trigger content */
+    children?: ReactNode;
+    /** Render as child element (polymorphic) */
+    asChild?: boolean;
+}
+
+declare const Dialog: {
+    Root: typeof DialogRoot;
+    Trigger: react.ForwardRefExoticComponent<DialogTriggerProps & react.RefAttributes<HTMLButtonElement>>;
+    Content: react.ForwardRefExoticComponent<DialogContentProps & react.RefAttributes<HTMLDivElement>>;
+    Title: react.ForwardRefExoticComponent<DialogTitleProps & react.RefAttributes<HTMLHeadingElement>>;
+    Description: react.ForwardRefExoticComponent<DialogDescriptionProps & react.RefAttributes<HTMLParagraphElement>>;
+    Close: react.ForwardRefExoticComponent<DialogCloseProps & react.RefAttributes<HTMLButtonElement>>;
+};
+
+type TextareaSize = "sm" | "md" | "lg";
+interface TextareaProps extends Omit<TextareaHTMLAttributes<HTMLTextAreaElement>, "onChange" | "onInput"> {
+    /**
+     * Textarea size - supports responsive object syntax
+     * @example
+     * ```tsx
+     * // Single value
+     * <Textarea size="md" />
+     *
+     * // Responsive
+     * <Textarea size={{ base: "sm", md: "md", lg: "lg" }} />
+     * ```
+     */
+    size?: ResponsiveProp<TextareaSize>;
+    /** Error state */
+    error?: boolean;
+    /** Auto-resize to fit content */
+    autoResize?: boolean;
+    /** Change handler */
+    onChange?: (value: string, event: Event) => void;
+    /** Value change handler - fires on every keystroke */
+    onValueChange?: (value: string, event: Event) => void;
+}
+/**
+ * React wrapper for ds-textarea Web Component.
+ * Multi-line text input with auto-resize support.
+ */
+declare const Textarea: react__default.ForwardRefExoticComponent<TextareaProps & react__default.RefAttributes<HTMLElement>>;
+
+interface CheckboxProps extends Omit<HTMLAttributes<HTMLElement>, "onChange"> {
+    /** Checkbox name */
+    name?: string;
+    /** Checkbox value */
+    value?: string;
+    /** Whether checked */
+    checked?: boolean;
+    /** Default checked state (uncontrolled) */
+    defaultChecked?: boolean;
+    /** Whether disabled */
+    disabled?: boolean;
+    /** Whether required */
+    required?: boolean;
+    /** Indeterminate state */
+    indeterminate?: boolean;
+    /** Change handler */
+    onChange?: (checked: boolean, event: Event) => void;
+    /** Checkbox label content */
+    children?: react__default.ReactNode;
+}
+/**
+ * React wrapper for ds-checkbox Web Component.
+ * Checkbox input with tri-state support.
+ */
+declare const Checkbox: react__default.ForwardRefExoticComponent<CheckboxProps & react__default.RefAttributes<HTMLElement>>;
+
+type RadioOrientation = "horizontal" | "vertical";
+interface RadioGroupProps extends Omit<HTMLAttributes<HTMLElement>, "onChange"> {
+    /** Group name */
+    name?: string;
+    /** Selected value */
+    value?: string;
+    /** Default value (uncontrolled) */
+    defaultValue?: string;
+    /** Whether disabled */
+    disabled?: boolean;
+    /** Whether required */
+    required?: boolean;
+    /** Layout orientation */
+    orientation?: RadioOrientation;
+    /** Change handler */
+    onChange?: (value: string, event: Event) => void;
+    /** Radio options */
+    children?: react__default.ReactNode;
+}
+/**
+ * React wrapper for ds-radio-group Web Component.
+ * Radio group with roving focus.
+ */
+declare const RadioGroup: react__default.ForwardRefExoticComponent<RadioGroupProps & react__default.RefAttributes<HTMLElement>>;
+
+interface RadioProps extends HTMLAttributes<HTMLElement> {
+    /** Radio value */
+    value: string;
+    /** Whether disabled */
+    disabled?: boolean;
+    /** Radio label content */
+    children?: react__default.ReactNode;
+}
+/**
+ * React wrapper for ds-radio Web Component.
+ * Individual radio option within a RadioGroup.
+ */
+declare const Radio: react__default.ForwardRefExoticComponent<RadioProps & react__default.RefAttributes<HTMLElement>>;
+
+interface SwitchProps extends Omit<HTMLAttributes<HTMLElement>, "onChange"> {
+    /** Switch name */
+    name?: string;
+    /** Whether checked/on */
+    checked?: boolean;
+    /** Default checked state (uncontrolled) */
+    defaultChecked?: boolean;
+    /** Whether disabled */
+    disabled?: boolean;
+    /** Whether required */
+    required?: boolean;
+    /** Change handler */
+    onChange?: (checked: boolean, event: Event) => void;
+    /** Switch label content */
+    children?: react__default.ReactNode;
+}
+/**
+ * React wrapper for ds-switch Web Component.
+ * Toggle switch with role="switch".
+ */
+declare const Switch: react__default.ForwardRefExoticComponent<SwitchProps & react__default.RefAttributes<HTMLElement>>;
+
+type Placement = "top" | "top-start" | "top-end" | "bottom" | "bottom-start" | "bottom-end" | "left" | "left-start" | "left-end" | "right" | "right-start" | "right-end";
+interface PopoverProps extends HTMLAttributes<HTMLElement> {
+    /** Whether the popover is open */
+    open?: boolean;
+    /** Placement relative to trigger */
+    placement?: Placement;
+    /** Offset from trigger in pixels */
+    offset?: number;
+    /** Whether to flip placement when near viewport edge */
+    flip?: boolean;
+    /** Whether Escape closes the popover */
+    closeOnEscape?: boolean;
+    /** Whether clicking outside closes the popover */
+    closeOnOutsideClick?: boolean;
+    /** Handler for open event */
+    onOpen?: () => void;
+    /** Handler for close event */
+    onClose?: () => void;
+    /** Popover content */
+    children?: react__default.ReactNode;
+}
+/**
+ * React wrapper for ds-popover Web Component.
+ * Non-modal popover with anchor positioning.
+ */
+declare const Popover: react__default.ForwardRefExoticComponent<PopoverProps & react__default.RefAttributes<HTMLElement>>;
+
+interface PopoverContentProps extends HTMLAttributes<HTMLElement> {
+    /** Popover content */
+    children?: react__default.ReactNode;
+}
+/**
+ * React wrapper for ds-popover-content Web Component.
+ * Container for popover content.
+ */
+declare const PopoverContent: react__default.ForwardRefExoticComponent<PopoverContentProps & react__default.RefAttributes<HTMLElement>>;
+
+interface TooltipProps extends HTMLAttributes<HTMLElement> {
+    /** Whether the tooltip is open */
+    open?: boolean;
+    /** Placement relative to trigger */
+    placement?: Placement;
+    /** Offset from trigger in pixels */
+    offset?: number;
+    /** Delay before showing tooltip (ms) */
+    showDelay?: number;
+    /** Delay before hiding tooltip (ms) */
+    hideDelay?: number;
+    /** Tooltip content */
+    children?: react__default.ReactNode;
+}
+/**
+ * React wrapper for ds-tooltip Web Component.
+ * Informational tooltip shown on hover/focus.
+ */
+declare const Tooltip: react__default.ForwardRefExoticComponent<TooltipProps & react__default.RefAttributes<HTMLElement>>;
+
+interface TooltipContentProps extends HTMLAttributes<HTMLElement> {
+    /** Tooltip content */
+    children?: react__default.ReactNode;
+}
+/**
+ * React wrapper for ds-tooltip-content Web Component.
+ * Container for tooltip content.
+ */
+declare const TooltipContent: react__default.ForwardRefExoticComponent<TooltipContentProps & react__default.RefAttributes<HTMLElement>>;
+
+interface MenuContentProps extends HTMLAttributes<HTMLDivElement> {
+    /** Menu content */
+    children?: ReactNode;
+    /** Container element for portal (defaults to document.body) */
+    container?: HTMLElement | null;
+    /** Force mount even when closed (for animations) */
+    forceMount?: boolean;
+}
+
+interface MenuItemProps extends HTMLAttributes<HTMLDivElement> {
+    /** Item content */
+    children?: ReactNode;
+    /** Value passed to onSelect */
+    value?: string;
+    /** Whether item is disabled */
+    disabled?: boolean;
+}
+
+interface MenuLabelProps extends HTMLAttributes<HTMLDivElement> {
+    /** Label content */
+    children?: ReactNode;
+}
+
+interface MenuRootProps {
+    /** Menu content */
+    children?: ReactNode;
+    /** Custom ID for the menu (SSR-safe auto-generated if not provided) */
+    id?: string;
+    /** Controlled open state */
+    open?: boolean;
+    /** Default open state (uncontrolled) */
+    defaultOpen?: boolean;
+    /** Called when open state changes */
+    onOpenChange?: (open: boolean) => void;
+    /** Called when an item is selected */
+    onSelect?: (value: string) => void;
+    /** Placement relative to trigger */
+    placement?: Placement$1;
+    /** Offset from trigger in pixels */
+    offset?: number;
+    /** Whether to flip placement on viewport edge */
+    flip?: boolean;
+    /** Whether to loop navigation at ends */
+    loop?: boolean;
+}
+/**
+ * Root component for Menu compound pattern.
+ * Provides context to Trigger, Content, and Item.
+ *
+ * @example
+ * ```tsx
+ * <Menu.Root onSelect={(value) => console.log(value)}>
+ *   <Menu.Trigger>Open Menu</Menu.Trigger>
+ *   <Menu.Content>
+ *     <Menu.Item value="edit">Edit</Menu.Item>
+ *     <Menu.Item value="delete">Delete</Menu.Item>
+ *   </Menu.Content>
+ * </Menu.Root>
+ * ```
+ */
+declare function MenuRoot({ children, id, open: controlledOpen, defaultOpen, onOpenChange, onSelect, placement, offset, flip, loop, }: MenuRootProps): react_jsx_runtime.JSX.Element;
+declare namespace MenuRoot {
+    var displayName: string;
+}
+
+interface MenuSeparatorProps extends HTMLAttributes<HTMLDivElement> {
+}
+
+interface MenuTriggerProps extends ButtonHTMLAttributes<HTMLButtonElement> {
+    /** Trigger content */
+    children?: ReactNode;
+    /** Render as child element (polymorphic) */
+    asChild?: boolean;
+}
+
+declare const Menu: {
+    Root: typeof MenuRoot;
+    Trigger: react.ForwardRefExoticComponent<MenuTriggerProps & react.RefAttributes<HTMLButtonElement>>;
+    Content: react.ForwardRefExoticComponent<MenuContentProps & react.RefAttributes<HTMLDivElement>>;
+    Item: react.ForwardRefExoticComponent<MenuItemProps & react.RefAttributes<HTMLDivElement>>;
+    Separator: react.ForwardRefExoticComponent<MenuSeparatorProps & react.RefAttributes<HTMLDivElement>>;
+    Label: react.ForwardRefExoticComponent<MenuLabelProps & react.RefAttributes<HTMLDivElement>>;
+};
+
+interface SelectContentProps extends HTMLAttributes<HTMLDivElement> {
+    /** Content container */
+    children?: ReactNode;
+    /** Optional label for accessibility */
+    "aria-label"?: string;
+}
+
+interface SelectGroupProps extends HTMLAttributes<HTMLFieldSetElement> {
+    /** Group content (Label and Options) */
+    children?: ReactNode;
+    /** Optional label text (alternative to using Select.Label as child) */
+    label?: string;
+}
+
+interface SelectLabelProps extends HTMLAttributes<HTMLDivElement> {
+    /** Label content */
+    children?: ReactNode;
+}
+
+interface SelectOptionProps extends Omit<HTMLAttributes<HTMLDivElement>, "value"> {
+    /** Option value */
+    value: string;
+    /** Display label (uses children if not specified) */
+    label?: string;
+    /** Whether the option is disabled */
+    disabled?: boolean;
+    /** Option content */
+    children?: ReactNode;
+}
+
+interface SelectRootProps {
+    /** Select content */
+    children?: ReactNode;
+    /** Custom ID for the select (SSR-safe auto-generated if not provided) */
+    id?: string;
+    /** Controlled open state */
+    open?: boolean;
+    /** Default open state (uncontrolled) */
+    defaultOpen?: boolean;
+    /** Called when open state changes */
+    onOpenChange?: (open: boolean) => void;
+    /** Controlled value */
+    value?: string | null;
+    /** Default value (uncontrolled) */
+    defaultValue?: string | null;
+    /** Called when value changes */
+    onValueChange?: (value: string | null) => void;
+    /** Placement relative to trigger */
+    placement?: Placement$1;
+    /** Offset from trigger in pixels */
+    offset?: number;
+    /** Whether to flip placement on viewport edge */
+    flip?: boolean;
+    /** Whether select is disabled */
+    disabled?: boolean;
+    /** Whether select is read-only */
+    readOnly?: boolean;
+    /** Enable typeahead search */
+    searchable?: boolean;
+    /** Allow clearing the selection */
+    clearable?: boolean;
+    /** Whether the select is in a loading state (e.g., fetching options) */
+    loading?: boolean;
+    /** Text to display/announce during loading */
+    loadingText?: string;
+}
+/**
+ * Root component for Select compound pattern.
+ * Provides context to Trigger, Content, and Option.
+ *
+ * @example
+ * ```tsx
+ * <Select.Root onValueChange={(value) => console.log(value)}>
+ *   <Select.Trigger>Select a fruit</Select.Trigger>
+ *   <Select.Content>
+ *     <Select.Option value="apple">Apple</Select.Option>
+ *     <Select.Option value="banana">Banana</Select.Option>
+ *   </Select.Content>
+ * </Select.Root>
+ * ```
+ */
+declare function SelectRoot({ children, id, open: controlledOpen, defaultOpen, onOpenChange, value: controlledValue, defaultValue, onValueChange, placement: _placement, offset: _offset, flip: _flip, disabled, readOnly, searchable, clearable, loading, loadingText, }: SelectRootProps): react_jsx_runtime.JSX.Element;
+declare namespace SelectRoot {
+    var displayName: string;
+}
+
+interface SelectSeparatorProps extends HTMLAttributes<HTMLHRElement> {
+}
+
+interface SelectTriggerProps extends ButtonHTMLAttributes<HTMLButtonElement> {
+    /** Trigger content */
+    children?: ReactNode;
+    /** Render as child element (polymorphic) */
+    asChild?: boolean;
+}
+
+interface SelectValueProps extends Omit<HTMLAttributes<HTMLSpanElement>, "children"> {
+    /** Placeholder text when no value is selected */
+    placeholder?: string;
+    /** Custom render function for the value */
+    children?: ReactNode | ((value: string | null) => ReactNode);
+}
+
+declare const Select: {
+    Root: typeof SelectRoot;
+    Trigger: react.ForwardRefExoticComponent<SelectTriggerProps & react.RefAttributes<HTMLButtonElement>>;
+    Value: react.ForwardRefExoticComponent<SelectValueProps & react.RefAttributes<HTMLSpanElement>>;
+    Content: react.ForwardRefExoticComponent<SelectContentProps & react.RefAttributes<HTMLDivElement>>;
+    Group: react.ForwardRefExoticComponent<SelectGroupProps & react.RefAttributes<HTMLFieldSetElement>>;
+    Option: react.ForwardRefExoticComponent<SelectOptionProps & react.RefAttributes<HTMLDivElement>>;
+    Separator: react.ForwardRefExoticComponent<SelectSeparatorProps & react.RefAttributes<HTMLHRElement>>;
+    Label: react.ForwardRefExoticComponent<SelectLabelProps & react.RefAttributes<HTMLDivElement>>;
+};
+
+interface ComboboxContentProps extends HTMLAttributes<HTMLDivElement> {
+    /** Content container */
+    children?: ReactNode;
+    /** Optional label for accessibility */
+    "aria-label"?: string;
+}
+
+interface ComboboxEmptyProps extends HTMLAttributes<HTMLOutputElement> {
+    /** Empty state content */
+    children?: ReactNode;
+}
+
+interface ComboboxInputProps extends Omit<InputHTMLAttributes<HTMLInputElement>, "value" | "onChange"> {
+    /** Render as child element (polymorphic) */
+    asChild?: boolean;
+}
+
+interface ComboboxLoadingProps extends HTMLAttributes<HTMLOutputElement> {
+    /** Loading indicator content */
+    children?: ReactNode;
+}
+
+interface ComboboxOptionProps extends Omit<HTMLAttributes<HTMLDivElement>, "value"> {
+    /** Option value */
+    value: string;
+    /** Display label (uses children if not specified) */
+    label?: string;
+    /** Whether the option is disabled */
+    disabled?: boolean;
+    /** Option content */
+    children?: ReactNode;
+}
+
+interface ComboboxRootProps<Multi extends boolean = false> {
+    /** Combobox content */
+    children?: ReactNode;
+    /** Controlled open state */
+    open?: boolean;
+    /** Default open state (uncontrolled) */
+    defaultOpen?: boolean;
+    /** Called when open state changes */
+    onOpenChange?: (open: boolean) => void;
+    /** Controlled value (single-select) */
+    value?: Multi extends true ? string[] : string | null;
+    /** Default value (uncontrolled) */
+    defaultValue?: Multi extends true ? string[] : string | null;
+    /** Called when value changes */
+    onValueChange?: (value: Multi extends true ? string[] : string | null) => void;
+    /** Called when input value changes */
+    onInputChange?: (query: string) => void;
+    /** Enable multi-select mode */
+    multiple?: Multi;
+    /** Allow creating new values */
+    creatable?: boolean;
+    /** Called when new value is created */
+    onCreateValue?: (value: string) => void;
+    /** Async item loader */
+    loadItems?: (query: string) => Promise<Option<string>[]>;
+    /** Static items */
+    items?: Option<string>[];
+    /** Debounce delay for async (ms) */
+    debounce?: number;
+    /** Virtualization threshold */
+    virtualizationThreshold?: number;
+    /** Placement relative to input */
+    placement?: Placement$1;
+    /** Offset from input in pixels */
+    offset?: number;
+    /** Whether to flip placement on viewport edge */
+    flip?: boolean;
+    /** Whether combobox is disabled */
+    disabled?: boolean;
+}
+/**
+ * Root component for Combobox compound pattern.
+ * Provides context to Input, Content, Option, and Tag.
+ *
+ * @example
+ * ```tsx
+ * <Combobox.Root onValueChange={(value) => console.log(value)}>
+ *   <Combobox.Input placeholder="Search..." />
+ *   <Combobox.Content>
+ *     <Combobox.Option value="apple">Apple</Combobox.Option>
+ *     <Combobox.Option value="banana">Banana</Combobox.Option>
+ *   </Combobox.Content>
+ * </Combobox.Root>
+ * ```
+ */
+declare function ComboboxRoot<Multi extends boolean = false>({ children, open: controlledOpen, defaultOpen, onOpenChange, value: controlledValue, defaultValue, onValueChange, onInputChange, multiple, creatable, onCreateValue, loadItems, items: staticItems, debounce, virtualizationThreshold, placement: _placement, offset: _offset, flip: _flip, disabled, }: ComboboxRootProps<Multi>): react_jsx_runtime.JSX.Element;
+declare namespace ComboboxRoot {
+    var displayName: string;
+}
+
+interface ComboboxTagProps extends Omit<HTMLAttributes<HTMLDivElement>, "value"> {
+    /** Tag value */
+    value: string;
+    /** Display label */
+    label?: string;
+    /** Tag content */
+    children?: ReactNode;
+}
+
+declare const Combobox: {
+    Root: typeof ComboboxRoot;
+    Input: react.ForwardRefExoticComponent<ComboboxInputProps & react.RefAttributes<HTMLInputElement>>;
+    Content: react.ForwardRefExoticComponent<ComboboxContentProps & react.RefAttributes<HTMLDivElement>>;
+    Option: react.ForwardRefExoticComponent<ComboboxOptionProps & react.RefAttributes<HTMLDivElement>>;
+    Tag: react.ForwardRefExoticComponent<ComboboxTagProps & react.RefAttributes<HTMLDivElement>>;
+    Empty: react.ForwardRefExoticComponent<ComboboxEmptyProps & react.RefAttributes<HTMLOutputElement>>;
+    Loading: react.ForwardRefExoticComponent<ComboboxLoadingProps & react.RefAttributes<HTMLOutputElement>>;
+};
+
+interface DatePickerCalendarProps extends HTMLAttributes<HTMLDivElement> {
+    /** Custom header renderer */
+    renderHeader?: (props: {
+        month: string;
+        year: number;
+        onPrevMonth: () => void;
+        onNextMonth: () => void;
+    }) => ReactNode;
+}
+
+interface DatePickerContentProps extends HTMLAttributes<HTMLDialogElement> {
+    /** Content */
+    children?: ReactNode;
+}
+
+interface DatePickerTriggerProps extends ButtonHTMLAttributes<HTMLButtonElement> {
+    /** Trigger content */
+    children?: ReactNode;
+    /** Render as child element (polymorphic) */
+    asChild?: boolean;
+}
+
+type DatePickerMode = "single" | "range";
+
+interface DatePickerRootProps {
+    /** DatePicker content */
+    children?: ReactNode;
+    /** Controlled open state */
+    open?: boolean;
+    /** Default open state (uncontrolled) */
+    defaultOpen?: boolean;
+    /** Called when open state changes */
+    onOpenChange?: (open: boolean) => void;
+    /** Selection mode: single date or date range */
+    mode?: DatePickerMode;
+    /** Controlled value (single mode) */
+    value?: Date | null;
+    /** Default value (single mode, uncontrolled) */
+    defaultValue?: Date | null;
+    /** Called when date changes (single mode) */
+    onValueChange?: (value: Date | null) => void;
+    /** Controlled range (range mode) */
+    range?: DateRange;
+    /** Default range (range mode, uncontrolled) */
+    defaultRange?: DateRange;
+    /** Called when range changes */
+    onRangeChange?: (range: DateRange) => void;
+    /** Minimum selectable date */
+    minDate?: Date;
+    /** Maximum selectable date */
+    maxDate?: Date;
+    /** Locale for date formatting */
+    locale?: string;
+    /** First day of week (0=Sunday, 1=Monday) */
+    firstDayOfWeek?: 0 | 1 | 2 | 3 | 4 | 5 | 6;
+    /** Placement relative to trigger */
+    placement?: Placement$1;
+    /** Offset from trigger in pixels */
+    offset?: number;
+    /** Whether to flip placement on viewport edge */
+    flip?: boolean;
+    /** Whether picker is disabled */
+    disabled?: boolean;
+}
+/**
+ * Root component for DatePicker compound pattern.
+ * Provides context to Trigger, Calendar, and related components.
+ *
+ * @example
+ * ```tsx
+ * <DatePicker.Root onValueChange={(date) => console.log(date)}>
+ *   <DatePicker.Trigger>Select date</DatePicker.Trigger>
+ *   <DatePicker.Content>
+ *     <DatePicker.Calendar />
+ *   </DatePicker.Content>
+ * </DatePicker.Root>
+ * ```
+ */
+declare function DatePickerRoot({ children, open: controlledOpen, defaultOpen, onOpenChange, mode, value: controlledValue, defaultValue, onValueChange, range: controlledRange, defaultRange, onRangeChange, minDate, maxDate, locale, firstDayOfWeek, placement: _placement, offset: _offset, flip: _flip, disabled, }: DatePickerRootProps): react_jsx_runtime.JSX.Element;
+declare namespace DatePickerRoot {
+    var displayName: string;
+}
+
+declare const DatePicker: {
+    readonly Root: typeof DatePickerRoot;
+    readonly Trigger: react.ForwardRefExoticComponent<DatePickerTriggerProps & react.RefAttributes<HTMLButtonElement>>;
+    readonly Content: react.ForwardRefExoticComponent<DatePickerContentProps & react.RefAttributes<HTMLDialogElement>>;
+    readonly Calendar: react.ForwardRefExoticComponent<DatePickerCalendarProps & react.RefAttributes<HTMLDivElement>>;
+};
+
+interface SliderThumbProps extends HTMLAttributes<HTMLDivElement> {
+    /** Thumb type for range mode */
+    type?: "single" | "min" | "max";
+    /** Accessible label */
+    "aria-label"?: string;
+}
+
+interface SliderRangeProps extends HTMLAttributes<HTMLDivElement> {
+}
+
+interface SliderTrackProps extends HTMLAttributes<HTMLDivElement> {
+    /** Track content (Range, Thumb components) */
+    children?: ReactNode;
+}
+
+interface SliderRootProps {
+    /** Slider content */
+    children?: ReactNode;
+    /** Minimum allowed value */
+    min?: number;
+    /** Maximum allowed value */
+    max?: number;
+    /** Step increment */
+    step?: number;
+    /** Controlled value (single mode) */
+    value?: number;
+    /** Default value (single mode, uncontrolled) */
+    defaultValue?: number;
+    /** Called when value changes */
+    onValueChange?: (value: number) => void;
+    /** Range mode (two thumbs) */
+    range?: boolean;
+    /** Controlled range values */
+    rangeValue?: {
+        min: number;
+        max: number;
+    };
+    /** Default range values */
+    defaultRangeValue?: {
+        min: number;
+        max: number;
+    };
+    /** Called when range changes */
+    onRangeChange?: (range: {
+        min: number;
+        max: number;
+    }) => void;
+    /** Orientation */
+    orientation?: "horizontal" | "vertical";
+    /** Disabled state */
+    disabled?: boolean;
+    /** Value text formatter for screen readers */
+    formatValueText?: (value: number) => string;
+}
+/**
+ * Root component for Slider compound pattern.
+ * Provides context to Track, Thumb, and Range components.
+ *
+ * @example
+ * ```tsx
+ * // Single value slider
+ * <Slider.Root onValueChange={(value) => console.log(value)}>
+ *   <Slider.Track>
+ *     <Slider.Range />
+ *     <Slider.Thumb />
+ *   </Slider.Track>
+ * </Slider.Root>
+ *
+ * // Range slider
+ * <Slider.Root range onRangeChange={(range) => console.log(range)}>
+ *   <Slider.Track>
+ *     <Slider.Range />
+ *     <Slider.Thumb type="min" />
+ *     <Slider.Thumb type="max" />
+ *   </Slider.Track>
+ * </Slider.Root>
+ * ```
+ */
+declare function SliderRoot({ children, min, max, step, value: controlledValue, defaultValue, onValueChange, range, rangeValue: controlledRangeValue, defaultRangeValue, onRangeChange, orientation, disabled, formatValueText, }: SliderRootProps): react_jsx_runtime.JSX.Element;
+declare namespace SliderRoot {
+    var displayName: string;
+}
+
+declare const Slider: {
+    readonly Root: typeof SliderRoot;
+    readonly Track: react.ForwardRefExoticComponent<SliderTrackProps & react.RefAttributes<HTMLDivElement>>;
+    readonly Range: react.ForwardRefExoticComponent<SliderRangeProps & react.RefAttributes<HTMLDivElement>>;
+    readonly Thumb: react.ForwardRefExoticComponent<SliderThumbProps & react.RefAttributes<HTMLDivElement>>;
+};
+
+interface NumberInputDecrementProps extends ButtonHTMLAttributes<HTMLButtonElement> {
+}
+
+interface NumberInputIncrementProps extends ButtonHTMLAttributes<HTMLButtonElement> {
+}
+
+interface NumberInputFieldProps extends Omit<InputHTMLAttributes<HTMLInputElement>, "type" | "value" | "onChange"> {
+}
+
+type NumberInputFormat = "decimal" | "currency" | "percent";
+
+interface NumberInputRootProps {
+    /** NumberInput content */
+    children?: ReactNode;
+    /** Minimum allowed value */
+    min?: number;
+    /** Maximum allowed value */
+    max?: number;
+    /** Step increment */
+    step?: number;
+    /** Decimal precision */
+    precision?: number;
+    /** Controlled value */
+    value?: number | null;
+    /** Default value (uncontrolled) */
+    defaultValue?: number;
+    /** Called when value changes */
+    onValueChange?: (value: number) => void;
+    /** Format type */
+    format?: NumberInputFormat;
+    /** Currency code (for currency format) */
+    currency?: string;
+    /** Locale for formatting */
+    locale?: string;
+    /** Allow empty input */
+    allowEmpty?: boolean;
+    /** Disabled state */
+    disabled?: boolean;
+}
+/**
+ * Root component for NumberInput compound pattern.
+ * Provides context to Input, Increment, and Decrement components.
+ *
+ * @example
+ * ```tsx
+ * <NumberInput.Root min={0} max={100} onValueChange={(v) => console.log(v)}>
+ *   <NumberInput.Decrement>-</NumberInput.Decrement>
+ *   <NumberInput.Input />
+ *   <NumberInput.Increment>+</NumberInput.Increment>
+ * </NumberInput.Root>
+ * ```
+ */
+declare function NumberInputRoot({ children, min, max, step, precision, value: controlledValue, defaultValue, onValueChange, format, currency, locale, allowEmpty, disabled, }: NumberInputRootProps): react_jsx_runtime.JSX.Element;
+declare namespace NumberInputRoot {
+    var displayName: string;
+}
+
+declare const NumberInput: {
+    readonly Root: typeof NumberInputRoot;
+    readonly Input: react.ForwardRefExoticComponent<NumberInputFieldProps & react.RefAttributes<HTMLInputElement>>;
+    readonly Increment: react.ForwardRefExoticComponent<NumberInputIncrementProps & react.RefAttributes<HTMLButtonElement>>;
+    readonly Decrement: react.ForwardRefExoticComponent<NumberInputDecrementProps & react.RefAttributes<HTMLButtonElement>>;
+};
+
+interface FileUploadItemProps extends Omit<HTMLAttributes<HTMLLIElement>, "children"> {
+    /** The file info to display */
+    file: FileInfo;
+    /** Custom render function for file content */
+    children?: ReactNode | ((file: FileInfo) => ReactNode);
+}
+
+interface FileUploadInputProps extends Omit<InputHTMLAttributes<HTMLInputElement>, "type" | "onChange"> {
+}
+
+interface FileUploadDropzoneProps extends HTMLAttributes<HTMLDivElement> {
+    /** Dropzone content */
+    children?: ReactNode;
+}
+
+interface FileUploadRootProps {
+    /** FileUpload content */
+    children?: ReactNode;
+    /** Accepted file types (MIME types or extensions) */
+    accept?: string;
+    /** Maximum number of files */
+    maxFiles?: number;
+    /** Maximum file size in bytes */
+    maxSize?: number;
+    /** Minimum file size in bytes */
+    minSize?: number;
+    /** Allow multiple files */
+    multiple?: boolean;
+    /** Disabled state */
+    disabled?: boolean;
+    /** Called when files are added */
+    onFilesAdd?: (files: FileInfo[]) => void;
+    /** Called when a file is removed */
+    onFileRemove?: (file: FileInfo) => void;
+    /** Called when files change */
+    onFilesChange?: (files: FileInfo[]) => void;
+    /** Called on validation error */
+    onError?: (error: FileUploadError) => void;
+}
+/**
+ * Root component for FileUpload compound pattern.
+ * Provides context to Dropzone, Input, FileList, and Item components.
+ *
+ * @example
+ * ```tsx
+ * <FileUpload.Root accept="image/*" maxSize={5242880} onFilesChange={(files) => console.log(files)}>
+ *   <FileUpload.Dropzone>
+ *     <p>Drop files here or click to upload</p>
+ *   </FileUpload.Dropzone>
+ *   <FileUpload.FileList />
+ * </FileUpload.Root>
+ * ```
+ */
+declare function FileUploadRoot({ children, accept, maxFiles, maxSize, minSize, multiple, disabled, onFilesAdd, onFileRemove, onFilesChange, onError, }: FileUploadRootProps): react_jsx_runtime.JSX.Element;
+declare namespace FileUploadRoot {
+    var displayName: string;
+}
+
+declare const FileUpload: {
+    readonly Root: typeof FileUploadRoot;
+    readonly Dropzone: react.ForwardRefExoticComponent<FileUploadDropzoneProps & react.RefAttributes<HTMLDivElement>>;
+    readonly Input: react.ForwardRefExoticComponent<FileUploadInputProps & react.RefAttributes<HTMLInputElement>>;
+    readonly Item: react.ForwardRefExoticComponent<FileUploadItemProps & react.RefAttributes<HTMLLIElement>>;
+};
+
+interface TimePickerSegmentProps extends Omit<HTMLAttributes<HTMLSpanElement>, "children"> {
+    /** Which segment this represents */
+    segment: TimeSegment;
+}
+
+interface TimePickerRootProps {
+    /** TimePicker content */
+    children?: ReactNode;
+    /** 12-hour or 24-hour format */
+    hourFormat?: 12 | 24;
+    /** Show seconds segment */
+    showSeconds?: boolean;
+    /** Controlled time value */
+    value?: TimeValue;
+    /** Default time value (uncontrolled) */
+    defaultValue?: TimeValue;
+    /** Called when time changes */
+    onValueChange?: (value: TimeValue) => void;
+    /** Minute step */
+    minuteStep?: number;
+    /** Second step */
+    secondStep?: number;
+    /** Minimum time */
+    minTime?: TimeValue;
+    /** Maximum time */
+    maxTime?: TimeValue;
+    /** Disabled state */
+    disabled?: boolean;
+}
+/**
+ * Root component for TimePicker compound pattern.
+ * Provides context to Segment components.
+ *
+ * @example
+ * ```tsx
+ * <TimePicker.Root hourFormat={12} onValueChange={(time) => console.log(time)}>
+ *   <TimePicker.Segment segment="hour" />
+ *   <span>:</span>
+ *   <TimePicker.Segment segment="minute" />
+ *   <TimePicker.Segment segment="period" />
+ * </TimePicker.Root>
+ * ```
+ */
+declare function TimePickerRoot({ children, hourFormat, showSeconds, value: controlledValue, defaultValue, onValueChange, minuteStep, secondStep, minTime, maxTime, disabled, }: TimePickerRootProps): react_jsx_runtime.JSX.Element;
+declare namespace TimePickerRoot {
+    var displayName: string;
+}
+
+declare const TimePicker: {
+    readonly Root: typeof TimePickerRoot;
+    readonly Segment: react.ForwardRefExoticComponent<TimePickerSegmentProps & react.RefAttributes<HTMLSpanElement>>;
+};
+
+interface PinInputFieldProps extends Omit<InputHTMLAttributes<HTMLInputElement>, "type" | "value" | "onChange"> {
+    /** Field index (0-based) */
+    index: number;
+}
+
+interface PinInputRootProps {
+    /** PinInput content */
+    children?: ReactNode;
+    /** Number of input fields */
+    length?: number;
+    /** Controlled value */
+    value?: string;
+    /** Default value (uncontrolled) */
+    defaultValue?: string;
+    /** Called when value changes */
+    onValueChange?: (value: string) => void;
+    /** Called when all digits entered */
+    onComplete?: (value: string) => void;
+    /** Allow alphanumeric characters */
+    alphanumeric?: boolean;
+    /** Disabled state */
+    disabled?: boolean;
+    /** Mask input (like password) */
+    mask?: boolean;
+}
+/**
+ * Root component for PinInput compound pattern.
+ * Provides context to Field components.
+ *
+ * @example
+ * ```tsx
+ * <PinInput.Root length={6} onComplete={(value) => verifyOTP(value)}>
+ *   <PinInput.Field index={0} />
+ *   <PinInput.Field index={1} />
+ *   <PinInput.Field index={2} />
+ *   <PinInput.Field index={3} />
+ *   <PinInput.Field index={4} />
+ *   <PinInput.Field index={5} />
+ * </PinInput.Root>
+ * ```
+ */
+declare function PinInputRoot({ children, length, value: controlledValue, defaultValue, onValueChange, onComplete, alphanumeric, disabled, mask, }: PinInputRootProps): react_jsx_runtime.JSX.Element;
+declare namespace PinInputRoot {
+    var displayName: string;
+}
+
+declare const PinInput: {
+    readonly Root: typeof PinInputRoot;
+    readonly Field: react.ForwardRefExoticComponent<PinInputFieldProps & react.RefAttributes<HTMLInputElement>>;
+};
+
+interface PresenceProps {
+    /**
+     * Whether the child should be present (visible)
+     */
+    present: boolean;
+    /**
+     * The child element to animate. Must be a single React element that accepts a ref.
+     */
+    children: ReactElement;
+    /**
+     * Force the child to always be mounted (useful for SSR or animation debugging)
+     * @default false
+     */
+    forceMount?: boolean;
+    /**
+     * Called when the exit animation completes
+     */
+    onExitComplete?: () => void;
+}
+/**
+ * Presence component for managing exit animations.
+ *
+ * Keeps a child element mounted until its exit animation completes,
+ * allowing for smooth enter/exit transitions.
+ *
+ * The child receives a ref and data-state attribute for animation:
+ * - data-state="open" when entering
+ * - data-state="closed" when exiting
+ *
+ * @example
+ * ```tsx
+ * <Presence present={isOpen} onExitComplete={() => console.log("closed")}>
+ *   <Dialog.Content className="animate-fade-in data-[state=closed]:animate-fade-out">
+ *     Dialog content
+ *   </Dialog.Content>
+ * </Presence>
+ * ```
+ */
+declare function Presence({ present, children, forceMount, onExitComplete, }: PresenceProps): ReactElement | null;
+
+interface UsePresenceOptions {
+    /**
+     * Whether the element should be present (visible)
+     */
+    present: boolean;
+    /**
+     * Called when the exit animation completes
+     */
+    onExitComplete?: () => void;
+}
+interface UsePresenceReturn {
+    /**
+     * Whether the element should be rendered
+     */
+    isPresent: boolean;
+    /**
+     * Ref to attach to the animated element
+     */
+    ref: React.RefCallback<HTMLElement>;
+    /**
+     * Current animation state for data-state attribute
+     */
+    dataState: "open" | "closed";
+}
+/**
+ * Hook for managing presence/exit animations.
+ *
+ * Keeps an element mounted until its exit animation completes,
+ * allowing for smooth enter/exit transitions.
+ *
+ * @example
+ * ```tsx
+ * function AnimatedDialog({ isOpen, onClose }) {
+ *   const { isPresent, ref, dataState } = usePresence({
+ *     present: isOpen,
+ *     onExitComplete: () => console.log("exit complete"),
+ *   });
+ *
+ *   if (!isPresent) return null;
+ *
+ *   return (
+ *     <div ref={ref} data-state={dataState} className="animate-fade-in">
+ *       Dialog content
+ *     </div>
+ *   );
+ * }
+ * ```
+ */
+declare function usePresence(options: UsePresenceOptions): UsePresenceReturn;
+
+/**
+ * Error Boundary utility for React adapters.
+ *
+ * Provides graceful error handling for design system components,
+ * preventing component errors from crashing the entire application.
+ *
+ * @example
+ * ```tsx
+ * import { ErrorBoundary, withErrorBoundary } from "@hypoth-ui/react";
+ *
+ * // Use as a component wrapper
+ * <ErrorBoundary fallback={<div>Component error</div>}>
+ *   <Dialog>...</Dialog>
+ * </ErrorBoundary>
+ *
+ * // Or as a higher-order component
+ * const SafeDialog = withErrorBoundary(Dialog, {
+ *   fallback: <div>Dialog failed to load</div>,
+ * });
+ * ```
+ */
+
+interface ErrorBoundaryProps {
+    /** Child components to wrap */
+    children: ReactNode;
+    /** Fallback UI to show on error */
+    fallback?: ReactNode | ((error: Error, resetError: () => void) => ReactNode);
+    /** Callback when an error is caught */
+    onError?: (error: Error, errorInfo: React.ErrorInfo) => void;
+    /** Reset key - changing this resets the error state */
+    resetKey?: string | number;
+}
+interface ErrorBoundaryState {
+    hasError: boolean;
+    error: Error | null;
+}
+/**
+ * Error boundary component that catches JavaScript errors in child components.
+ *
+ * Features:
+ * - Catches errors during rendering, lifecycle, and constructors
+ * - Provides fallback UI instead of crashing
+ * - Supports error recovery via resetKey or resetError callback
+ * - Logs errors for debugging
+ */
+declare class ErrorBoundary extends Component<ErrorBoundaryProps, ErrorBoundaryState> {
+    constructor(props: ErrorBoundaryProps);
+    static getDerivedStateFromError(error: Error): ErrorBoundaryState;
+    componentDidCatch(error: Error, errorInfo: React.ErrorInfo): void;
+    componentDidUpdate(prevProps: ErrorBoundaryProps): void;
+    resetError: () => void;
+    render(): ReactNode;
+}
+interface WithErrorBoundaryOptions {
+    /** Fallback UI to show on error */
+    fallback?: ReactNode | ((error: Error, resetError: () => void) => ReactNode);
+    /** Callback when an error is caught */
+    onError?: (error: Error, errorInfo: React.ErrorInfo) => void;
+}
+/**
+ * Higher-order component that wraps a component with an ErrorBoundary.
+ *
+ * @example
+ * ```tsx
+ * const SafeDialog = withErrorBoundary(Dialog, {
+ *   fallback: <div>Failed to load dialog</div>,
+ *   onError: (error) => reportError(error),
+ * });
+ * ```
+ */
+declare function withErrorBoundary<P extends object>(WrappedComponent: ComponentType<P>, options?: WithErrorBoundaryOptions): ComponentType<P>;
+/**
+ * Default error fallback component for design system components.
+ *
+ * Provides a simple error message in development and nothing in production.
+ */
+declare function DSErrorFallback({ error, componentName, }: {
+    error: Error;
+    componentName?: string;
+}): ReactNode;
+
+/**
+ * Loading State Types
+ *
+ * Standardized loading state props for async components.
+ *
+ * @packageDocumentation
+ */
+/**
+ * Loading state props for components that support async data.
+ *
+ * Components implementing this interface:
+ * - Select (loading options)
+ * - Combobox (loading search results)
+ * - Table (loading rows)
+ * - Tree (loading children)
+ *
+ * @example
+ * ```tsx
+ * // Basic loading state
+ * <Select loading>
+ *   <SelectTrigger>Loading...</SelectTrigger>
+ * </Select>
+ *
+ * // With loading text
+ * <Select loading loadingText="Fetching options...">
+ *   <SelectTrigger>Select an option</SelectTrigger>
+ * </Select>
+ *
+ * // Table with skeleton rows
+ * <Table loading skeletonRows={5}>
+ *   <TableHeader>...</TableHeader>
+ * </Table>
+ * ```
+ */
+interface LoadingProps {
+    /**
+     * Whether the component is in a loading state.
+     * When true:
+     * - Sets aria-busy="true" for screen readers
+     * - Disables keyboard navigation
+     * - Shows loading indicator (component-specific)
+     */
+    loading?: boolean;
+    /**
+     * Text to display/announce during loading.
+     * Used for both visual loading indicator and screen reader announcement.
+     * @default "Loading..."
+     */
+    loadingText?: string;
+}
+/**
+ * Extended loading props for table-like components.
+ */
+interface TableLoadingProps extends LoadingProps {
+    /**
+     * Number of skeleton rows to show during loading.
+     * Only applies when `loading` is true.
+     * @default 3
+     */
+    skeletonRows?: number;
+}
+/**
+ * Extended loading props for tree-like components.
+ */
+interface TreeLoadingProps extends LoadingProps {
+    /**
+     * Node IDs that are currently loading children.
+     * Allows for node-level loading indicators.
+     */
+    loadingNodes?: Set<string> | string[];
+}
+/**
+ * Loading state detail for async operations.
+ */
+interface LoadingState {
+    /** Whether currently loading */
+    isLoading: boolean;
+    /** Error that occurred during loading, if any */
+    error?: Error | null;
+    /** Progress percentage (0-100) for determinate loading */
+    progress?: number;
+}
+/**
+ * Callback for when loading state changes.
+ */
+type OnLoadingChange = (state: LoadingState) => void;
+
+interface CardRootProps extends HTMLAttributes<HTMLElement> {
+    /** Card content */
+    children?: ReactNode;
+}
+interface CardHeaderProps extends HTMLAttributes<HTMLElement> {
+    /** Header content */
+    children?: ReactNode;
+}
+interface CardContentProps extends HTMLAttributes<HTMLElement> {
+    /** Content */
+    children?: ReactNode;
+}
+interface CardFooterProps extends HTMLAttributes<HTMLElement> {
+    /** Footer content */
+    children?: ReactNode;
+}
+declare const Card: {
+    Root: react.ForwardRefExoticComponent<CardRootProps & react.RefAttributes<HTMLElement>>;
+    Header: react.ForwardRefExoticComponent<CardHeaderProps & react.RefAttributes<HTMLElement>>;
+    Content: react.ForwardRefExoticComponent<CardContentProps & react.RefAttributes<HTMLElement>>;
+    Footer: react.ForwardRefExoticComponent<CardFooterProps & react.RefAttributes<HTMLElement>>;
+};
+
+type SeparatorOrientation = "horizontal" | "vertical";
+interface SeparatorProps extends HTMLAttributes<HTMLElement> {
+    /** Visual orientation of the separator */
+    orientation?: SeparatorOrientation;
+    /** Whether the separator is purely decorative (no semantic meaning) */
+    decorative?: boolean;
+}
+/**
+ * Separator component - visual divider between content sections.
+ */
+declare const Separator: react.ForwardRefExoticComponent<SeparatorProps & react.RefAttributes<HTMLElement>>;
+
+interface AspectRatioProps extends HTMLAttributes<HTMLElement> {
+    /** Content to maintain aspect ratio */
+    children?: ReactNode;
+    /**
+     * Aspect ratio as width/height (e.g., "16/9", "4/3", "1/1").
+     * Can also be a number (e.g., 1.777 for 16:9).
+     */
+    ratio?: string | number;
+}
+/**
+ * AspectRatio component - maintains consistent width-to-height ratio.
+ */
+declare const AspectRatio: react.ForwardRefExoticComponent<AspectRatioProps & react.RefAttributes<HTMLElement>>;
+
+interface CollapsibleRootProps extends HTMLAttributes<HTMLElement> {
+    /** Content */
+    children?: ReactNode;
+    /** Controlled open state */
+    open?: boolean;
+    /** Default open state (uncontrolled) */
+    defaultOpen?: boolean;
+    /** Called when open state changes */
+    onOpenChange?: (open: boolean) => void;
+    /** Disable the collapsible */
+    disabled?: boolean;
+}
+interface CollapsibleTriggerProps extends HTMLAttributes<HTMLElement> {
+    /** Trigger content */
+    children?: ReactNode;
+}
+interface CollapsibleContentProps extends HTMLAttributes<HTMLElement> {
+    /** Content */
+    children?: ReactNode;
+    /** Keep mounted when collapsed */
+    forceMount?: boolean;
+}
+declare const Collapsible: {
+    Root: react.ForwardRefExoticComponent<CollapsibleRootProps & react.RefAttributes<HTMLElement>>;
+    Trigger: react.ForwardRefExoticComponent<CollapsibleTriggerProps & react.RefAttributes<HTMLElement>>;
+    Content: react.ForwardRefExoticComponent<CollapsibleContentProps & react.RefAttributes<HTMLElement>>;
+};
+
+type TabsOrientation = "horizontal" | "vertical";
+type TabsActivationMode = "automatic" | "manual";
+interface TabsRootProps extends HTMLAttributes<HTMLElement> {
+    /** Content */
+    children?: ReactNode;
+    /** Controlled value */
+    value?: string;
+    /** Default value (uncontrolled) */
+    defaultValue?: string;
+    /** Called when value changes */
+    onValueChange?: (value: string) => void;
+    /** Keyboard navigation orientation */
+    orientation?: TabsOrientation;
+    /** Activation mode */
+    activationMode?: TabsActivationMode;
+}
+interface TabsListProps extends HTMLAttributes<HTMLElement> {
+    /** Content */
+    children?: ReactNode;
+    /** Loop focus at ends */
+    loop?: boolean;
+}
+interface TabsTriggerProps extends HTMLAttributes<HTMLElement> {
+    /** Content */
+    children?: ReactNode;
+    /** Unique value identifying this tab */
+    value: string;
+    /** Disable this tab */
+    disabled?: boolean;
+}
+interface TabsContentProps extends HTMLAttributes<HTMLElement> {
+    /** Content */
+    children?: ReactNode;
+    /** Value of associated tab */
+    value: string;
+    /** Keep mounted when inactive */
+    forceMount?: boolean;
+}
+declare const Tabs: {
+    Root: react.ForwardRefExoticComponent<TabsRootProps & react.RefAttributes<HTMLElement>>;
+    List: react.ForwardRefExoticComponent<TabsListProps & react.RefAttributes<HTMLElement>>;
+    Trigger: react.ForwardRefExoticComponent<TabsTriggerProps & react.RefAttributes<HTMLElement>>;
+    Content: react.ForwardRefExoticComponent<TabsContentProps & react.RefAttributes<HTMLElement>>;
+};
+
+type AccordionType = "single" | "multiple";
+type AccordionOrientation = "horizontal" | "vertical";
+interface AccordionSingleProps {
+    type: "single";
+    /** Controlled value */
+    value?: string;
+    /** Default value (uncontrolled) */
+    defaultValue?: string;
+    /** Called when value changes */
+    onValueChange?: (value: string) => void;
+    /** Allow collapsing all items */
+    collapsible?: boolean;
+}
+interface AccordionMultipleProps {
+    type: "multiple";
+    /** Controlled value */
+    value?: string[];
+    /** Default value (uncontrolled) */
+    defaultValue?: string[];
+    /** Called when value changes */
+    onValueChange?: (value: string[]) => void;
+}
+type AccordionRootBaseProps = HTMLAttributes<HTMLElement> & {
+    children?: ReactNode;
+    orientation?: AccordionOrientation;
+};
+type AccordionRootProps = AccordionRootBaseProps & (AccordionSingleProps | AccordionMultipleProps);
+interface AccordionItemProps extends HTMLAttributes<HTMLElement> {
+    children?: ReactNode;
+    /** Unique value identifying this item */
+    value: string;
+    /** Disable this item */
+    disabled?: boolean;
+}
+interface AccordionTriggerProps extends HTMLAttributes<HTMLElement> {
+    children?: ReactNode;
+}
+interface AccordionContentProps extends HTMLAttributes<HTMLElement> {
+    children?: ReactNode;
+    /** Keep mounted when collapsed */
+    forceMount?: boolean;
+}
+declare const Accordion: {
+    Root: react.ForwardRefExoticComponent<AccordionRootProps & react.RefAttributes<HTMLElement>>;
+    Item: react.ForwardRefExoticComponent<AccordionItemProps & react.RefAttributes<HTMLElement>>;
+    Trigger: react.ForwardRefExoticComponent<AccordionTriggerProps & react.RefAttributes<HTMLElement>>;
+    Content: react.ForwardRefExoticComponent<AccordionContentProps & react.RefAttributes<HTMLElement>>;
+};
+
+type AlertDialogContentSize = "sm" | "md" | "lg" | "xl" | "full";
+interface AlertDialogRootProps extends HTMLAttributes<HTMLElement> {
+    /** Content */
+    children?: ReactNode;
+    /** Controlled open state */
+    open?: boolean;
+    /** Default open state (uncontrolled) */
+    defaultOpen?: boolean;
+    /** Called when open state changes */
+    onOpenChange?: (open: boolean) => void;
+    /** Whether to animate open/close transitions */
+    animated?: boolean;
+}
+interface AlertDialogTriggerProps extends HTMLAttributes<HTMLElement> {
+    /** Trigger content (typically a button) */
+    children?: ReactNode;
+}
+interface AlertDialogContentProps extends HTMLAttributes<HTMLElement> {
+    /** Content */
+    children?: ReactNode;
+    /** Size of the content */
+    size?: AlertDialogContentSize;
+}
+interface AlertDialogHeaderProps extends HTMLAttributes<HTMLElement> {
+    /** Header content */
+    children?: ReactNode;
+}
+interface AlertDialogFooterProps extends HTMLAttributes<HTMLElement> {
+    /** Footer content */
+    children?: ReactNode;
+}
+interface AlertDialogTitleProps extends HTMLAttributes<HTMLElement> {
+    /** Title content */
+    children?: ReactNode;
+}
+interface AlertDialogDescriptionProps extends HTMLAttributes<HTMLElement> {
+    /** Description content */
+    children?: ReactNode;
+}
+interface AlertDialogActionProps extends HTMLAttributes<HTMLElement> {
+    /** Action button content */
+    children?: ReactNode;
+    /** Called when action is clicked */
+    onClick?: () => void;
+}
+interface AlertDialogCancelProps extends HTMLAttributes<HTMLElement> {
+    /** Cancel button content */
+    children?: ReactNode;
+    /** Called when cancel is clicked */
+    onClick?: () => void;
+}
+declare const AlertDialog: {
+    Root: react.ForwardRefExoticComponent<AlertDialogRootProps & react.RefAttributes<HTMLElement>>;
+    Trigger: react.ForwardRefExoticComponent<AlertDialogTriggerProps & react.RefAttributes<HTMLElement>>;
+    Content: react.ForwardRefExoticComponent<AlertDialogContentProps & react.RefAttributes<HTMLElement>>;
+    Header: react.ForwardRefExoticComponent<AlertDialogHeaderProps & react.RefAttributes<HTMLElement>>;
+    Footer: react.ForwardRefExoticComponent<AlertDialogFooterProps & react.RefAttributes<HTMLElement>>;
+    Title: react.ForwardRefExoticComponent<AlertDialogTitleProps & react.RefAttributes<HTMLElement>>;
+    Description: react.ForwardRefExoticComponent<AlertDialogDescriptionProps & react.RefAttributes<HTMLElement>>;
+    Action: react.ForwardRefExoticComponent<AlertDialogActionProps & react.RefAttributes<HTMLElement>>;
+    Cancel: react.ForwardRefExoticComponent<AlertDialogCancelProps & react.RefAttributes<HTMLElement>>;
+};
+
+type SheetSide = "top" | "right" | "bottom" | "left";
+type SheetContentSize = "sm" | "md" | "lg" | "xl" | "full";
+interface SheetRootProps extends HTMLAttributes<HTMLElement> {
+    /** Content */
+    children?: ReactNode;
+    /** Controlled open state */
+    open?: boolean;
+    /** Default open state (uncontrolled) */
+    defaultOpen?: boolean;
+    /** Called when open state changes */
+    onOpenChange?: (open: boolean) => void;
+    /** Whether Escape key closes the sheet */
+    closeOnEscape?: boolean;
+    /** Whether clicking the overlay closes the sheet */
+    closeOnOverlay?: boolean;
+    /** Whether to animate open/close transitions */
+    animated?: boolean;
+}
+interface SheetTriggerProps extends HTMLAttributes<HTMLElement> {
+    /** Trigger content (typically a button) */
+    children?: ReactNode;
+}
+interface SheetContentProps extends HTMLAttributes<HTMLElement> {
+    /** Content */
+    children?: ReactNode;
+    /** Side of the screen the sheet appears from */
+    side?: SheetSide;
+    /** Size of the content */
+    size?: SheetContentSize;
+}
+interface SheetHeaderProps extends HTMLAttributes<HTMLElement> {
+    /** Header content */
+    children?: ReactNode;
+}
+interface SheetFooterProps extends HTMLAttributes<HTMLElement> {
+    /** Footer content */
+    children?: ReactNode;
+}
+interface SheetTitleProps extends HTMLAttributes<HTMLElement> {
+    /** Title content */
+    children?: ReactNode;
+}
+interface SheetDescriptionProps extends HTMLAttributes<HTMLElement> {
+    /** Description content */
+    children?: ReactNode;
+}
+interface SheetCloseProps extends HTMLAttributes<HTMLElement> {
+    /** Close button content */
+    children?: ReactNode;
+}
+declare const Sheet: {
+    Root: react.ForwardRefExoticComponent<SheetRootProps & react.RefAttributes<HTMLElement>>;
+    Trigger: react.ForwardRefExoticComponent<SheetTriggerProps & react.RefAttributes<HTMLElement>>;
+    Content: react.ForwardRefExoticComponent<SheetContentProps & react.RefAttributes<HTMLElement>>;
+    Header: react.ForwardRefExoticComponent<SheetHeaderProps & react.RefAttributes<HTMLElement>>;
+    Footer: react.ForwardRefExoticComponent<SheetFooterProps & react.RefAttributes<HTMLElement>>;
+    Title: react.ForwardRefExoticComponent<SheetTitleProps & react.RefAttributes<HTMLElement>>;
+    Description: react.ForwardRefExoticComponent<SheetDescriptionProps & react.RefAttributes<HTMLElement>>;
+    Close: react.ForwardRefExoticComponent<SheetCloseProps & react.RefAttributes<HTMLElement>>;
+};
+
+type DrawerSide = "top" | "right" | "bottom" | "left";
+interface DrawerRootProps extends HTMLAttributes<HTMLElement> {
+    /** Content */
+    children?: ReactNode;
+    /** Controlled open state */
+    open?: boolean;
+    /** Default open state (uncontrolled) */
+    defaultOpen?: boolean;
+    /** Called when open state changes */
+    onOpenChange?: (open: boolean) => void;
+    /** Side of the screen the drawer appears from */
+    side?: DrawerSide;
+    /** Whether swipe-to-dismiss is enabled */
+    swipeDismiss?: boolean;
+    /** Whether Escape key closes the drawer */
+    closeOnEscape?: boolean;
+    /** Whether clicking the overlay closes the drawer */
+    closeOnOverlay?: boolean;
+    /** Whether to animate open/close transitions */
+    animated?: boolean;
+}
+interface DrawerTriggerProps extends HTMLAttributes<HTMLElement> {
+    /** Trigger content (typically a button) */
+    children?: ReactNode;
+}
+interface DrawerContentProps extends HTMLAttributes<HTMLElement> {
+    /** Content */
+    children?: ReactNode;
+}
+interface DrawerHeaderProps extends HTMLAttributes<HTMLElement> {
+    /** Header content */
+    children?: ReactNode;
+}
+interface DrawerFooterProps extends HTMLAttributes<HTMLElement> {
+    /** Footer content */
+    children?: ReactNode;
+}
+interface DrawerTitleProps extends HTMLAttributes<HTMLElement> {
+    /** Title content */
+    children?: ReactNode;
+}
+interface DrawerDescriptionProps extends HTMLAttributes<HTMLElement> {
+    /** Description content */
+    children?: ReactNode;
+}
+declare const Drawer: {
+    Root: react.ForwardRefExoticComponent<DrawerRootProps & react.RefAttributes<HTMLElement>>;
+    Trigger: react.ForwardRefExoticComponent<DrawerTriggerProps & react.RefAttributes<HTMLElement>>;
+    Content: react.ForwardRefExoticComponent<DrawerContentProps & react.RefAttributes<HTMLElement>>;
+    Header: react.ForwardRefExoticComponent<DrawerHeaderProps & react.RefAttributes<HTMLElement>>;
+    Footer: react.ForwardRefExoticComponent<DrawerFooterProps & react.RefAttributes<HTMLElement>>;
+    Title: react.ForwardRefExoticComponent<DrawerTitleProps & react.RefAttributes<HTMLElement>>;
+    Description: react.ForwardRefExoticComponent<DrawerDescriptionProps & react.RefAttributes<HTMLElement>>;
+};
+
+type DropdownMenuPlacement = "top" | "top-start" | "top-end" | "bottom" | "bottom-start" | "bottom-end" | "left" | "left-start" | "left-end" | "right" | "right-start" | "right-end";
+type DropdownMenuItemVariant = "default" | "destructive";
+interface DropdownMenuRootProps extends HTMLAttributes<HTMLElement> {
+    /** Content */
+    children?: ReactNode;
+    /** Controlled open state */
+    open?: boolean;
+    /** Default open state (uncontrolled) */
+    defaultOpen?: boolean;
+    /** Called when open state changes */
+    onOpenChange?: (open: boolean) => void;
+    /** Placement relative to trigger */
+    placement?: DropdownMenuPlacement;
+    /** Offset distance from trigger in pixels */
+    offset?: number;
+    /** Whether to flip placement when near viewport edge */
+    flip?: boolean;
+    /** Whether to animate open/close transitions */
+    animated?: boolean;
+    /** Modal behavior - blocks interaction outside menu */
+    modal?: boolean;
+}
+interface DropdownMenuTriggerProps extends HTMLAttributes<HTMLElement> {
+    /** Trigger content (typically a button) */
+    children?: ReactNode;
+}
+interface DropdownMenuContentProps extends HTMLAttributes<HTMLElement> {
+    /** Content */
+    children?: ReactNode;
+}
+interface DropdownMenuItemProps extends Omit<HTMLAttributes<HTMLElement>, "onSelect"> {
+    /** Item content */
+    children?: ReactNode;
+    /** Value for selection events */
+    value?: string;
+    /** Visual variant */
+    variant?: DropdownMenuItemVariant;
+    /** Disabled state */
+    disabled?: boolean;
+    /** Called when item is selected */
+    onSelect?: (value: string) => void;
+}
+interface DropdownMenuSeparatorProps extends HTMLAttributes<HTMLElement> {
+}
+interface DropdownMenuLabelProps extends HTMLAttributes<HTMLElement> {
+    /** Label content */
+    children?: ReactNode;
+}
+interface DropdownMenuCheckboxItemProps extends HTMLAttributes<HTMLElement> {
+    /** Item content */
+    children?: ReactNode;
+    /** Whether the checkbox is checked */
+    checked?: boolean;
+    /** Called when checkbox state changes */
+    onCheckedChange?: (checked: boolean) => void;
+    /** Disabled state */
+    disabled?: boolean;
+}
+interface DropdownMenuRadioGroupProps extends HTMLAttributes<HTMLElement> {
+    /** Radio items */
+    children?: ReactNode;
+    /** Currently selected value */
+    value?: string;
+    /** Called when selection changes */
+    onValueChange?: (value: string) => void;
+}
+interface DropdownMenuRadioItemProps extends HTMLAttributes<HTMLElement> {
+    /** Item content */
+    children?: ReactNode;
+    /** Value for this radio item */
+    value: string;
+    /** Disabled state */
+    disabled?: boolean;
+}
+declare const DropdownMenu: {
+    Root: react.ForwardRefExoticComponent<DropdownMenuRootProps & react.RefAttributes<HTMLElement>>;
+    Trigger: react.ForwardRefExoticComponent<DropdownMenuTriggerProps & react.RefAttributes<HTMLElement>>;
+    Content: react.ForwardRefExoticComponent<DropdownMenuContentProps & react.RefAttributes<HTMLElement>>;
+    Item: react.ForwardRefExoticComponent<DropdownMenuItemProps & react.RefAttributes<HTMLElement>>;
+    Separator: react.ForwardRefExoticComponent<DropdownMenuSeparatorProps & react.RefAttributes<HTMLElement>>;
+    Label: react.ForwardRefExoticComponent<DropdownMenuLabelProps & react.RefAttributes<HTMLElement>>;
+    CheckboxItem: react.ForwardRefExoticComponent<DropdownMenuCheckboxItemProps & react.RefAttributes<HTMLElement>>;
+    RadioGroup: react.ForwardRefExoticComponent<DropdownMenuRadioGroupProps & react.RefAttributes<HTMLElement>>;
+    RadioItem: react.ForwardRefExoticComponent<DropdownMenuRadioItemProps & react.RefAttributes<HTMLElement>>;
+};
+
+type ContextMenuItemVariant = "default" | "destructive";
+interface ContextMenuRootProps extends HTMLAttributes<HTMLElement> {
+    /** Content */
+    children?: ReactNode;
+    /** Controlled open state */
+    open?: boolean;
+    /** Called when open state changes */
+    onOpenChange?: (open: boolean) => void;
+    /** Whether to animate open/close transitions */
+    animated?: boolean;
+}
+interface ContextMenuTriggerProps extends HTMLAttributes<HTMLElement> {
+    /** Trigger content (the area that responds to right-click) */
+    children?: ReactNode;
+}
+interface ContextMenuContentProps extends HTMLAttributes<HTMLElement> {
+    /** Content */
+    children?: ReactNode;
+}
+interface ContextMenuItemProps extends Omit<HTMLAttributes<HTMLElement>, "onSelect"> {
+    /** Item content */
+    children?: ReactNode;
+    /** Value for selection events */
+    value?: string;
+    /** Visual variant */
+    variant?: ContextMenuItemVariant;
+    /** Disabled state */
+    disabled?: boolean;
+    /** Called when item is selected */
+    onSelect?: (value: string) => void;
+}
+interface ContextMenuSeparatorProps extends HTMLAttributes<HTMLElement> {
+}
+interface ContextMenuLabelProps extends HTMLAttributes<HTMLElement> {
+    /** Label content */
+    children?: ReactNode;
+}
+declare const ContextMenu: {
+    Root: react.ForwardRefExoticComponent<ContextMenuRootProps & react.RefAttributes<HTMLElement>>;
+    Trigger: react.ForwardRefExoticComponent<ContextMenuTriggerProps & react.RefAttributes<HTMLElement>>;
+    Content: react.ForwardRefExoticComponent<ContextMenuContentProps & react.RefAttributes<HTMLElement>>;
+    Item: react.ForwardRefExoticComponent<ContextMenuItemProps & react.RefAttributes<HTMLElement>>;
+    Separator: react.ForwardRefExoticComponent<ContextMenuSeparatorProps & react.RefAttributes<HTMLElement>>;
+    Label: react.ForwardRefExoticComponent<ContextMenuLabelProps & react.RefAttributes<HTMLElement>>;
+};
+
+type HoverCardPlacement = "top" | "top-start" | "top-end" | "bottom" | "bottom-start" | "bottom-end" | "left" | "left-start" | "left-end" | "right" | "right-start" | "right-end";
+interface HoverCardRootProps extends HTMLAttributes<HTMLElement> {
+    /** Content */
+    children?: ReactNode;
+    /** Controlled open state */
+    open?: boolean;
+    /** Default open state (uncontrolled) */
+    defaultOpen?: boolean;
+    /** Called when open state changes */
+    onOpenChange?: (open: boolean) => void;
+    /** Placement relative to trigger */
+    placement?: HoverCardPlacement;
+    /** Offset distance from trigger in pixels */
+    offset?: number;
+    /** Whether to flip placement when near viewport edge */
+    flip?: boolean;
+    /** Delay in ms before showing on hover */
+    openDelay?: number;
+    /** Delay in ms before hiding after hover leaves */
+    closeDelay?: number;
+    /** Whether to animate open/close transitions */
+    animated?: boolean;
+}
+interface HoverCardTriggerProps extends HTMLAttributes<HTMLElement> {
+    /** Trigger content */
+    children?: ReactNode;
+}
+interface HoverCardContentProps extends HTMLAttributes<HTMLElement> {
+    /** Content */
+    children?: ReactNode;
+}
+declare const HoverCard: {
+    Root: react.ForwardRefExoticComponent<HoverCardRootProps & react.RefAttributes<HTMLElement>>;
+    Trigger: react.ForwardRefExoticComponent<HoverCardTriggerProps & react.RefAttributes<HTMLElement>>;
+    Content: react.ForwardRefExoticComponent<HoverCardContentProps & react.RefAttributes<HTMLElement>>;
+};
+
+type NavigationMenuOrientation = "horizontal" | "vertical";
+interface NavigationMenuRootProps extends HTMLAttributes<HTMLElement> {
+    /** Content */
+    children?: ReactNode;
+    /** Controlled active value */
+    value?: string;
+    /** Default active value (uncontrolled) */
+    defaultValue?: string;
+    /** Called when active value changes */
+    onValueChange?: (value: string) => void;
+    /** Delay in ms before opening on hover */
+    delayDuration?: number;
+    /** Delay in ms before closing when pointer leaves */
+    skipDelayDuration?: number;
+    /** Orientation (horizontal or vertical) */
+    orientation?: NavigationMenuOrientation;
+}
+interface NavigationMenuListProps extends HTMLAttributes<HTMLElement> {
+    /** List items */
+    children?: ReactNode;
+}
+interface NavigationMenuItemProps extends HTMLAttributes<HTMLElement> {
+    /** Item content */
+    children?: ReactNode;
+    /** Unique value for this item */
+    value: string;
+}
+interface NavigationMenuTriggerProps extends HTMLAttributes<HTMLElement> {
+    /** Trigger content */
+    children?: ReactNode;
+    /** Disabled state */
+    disabled?: boolean;
+}
+interface NavigationMenuContentProps extends HTMLAttributes<HTMLElement> {
+    /** Content */
+    children?: ReactNode;
+}
+interface NavigationMenuLinkProps extends HTMLAttributes<HTMLElement> {
+    /** Link content */
+    children?: ReactNode;
+    /** URL to navigate to */
+    href?: string;
+    /** Whether this link is currently active */
+    active?: boolean;
+    /** Disabled state */
+    disabled?: boolean;
+    /** Called when link is clicked */
+    onNavigate?: (href: string) => void;
+}
+interface NavigationMenuIndicatorProps extends HTMLAttributes<HTMLElement> {
+}
+interface NavigationMenuViewportProps extends HTMLAttributes<HTMLElement> {
+}
+declare const NavigationMenu: {
+    Root: react.ForwardRefExoticComponent<NavigationMenuRootProps & react.RefAttributes<HTMLElement>>;
+    List: react.ForwardRefExoticComponent<NavigationMenuListProps & react.RefAttributes<HTMLElement>>;
+    Item: react.ForwardRefExoticComponent<NavigationMenuItemProps & react.RefAttributes<HTMLElement>>;
+    Trigger: react.ForwardRefExoticComponent<NavigationMenuTriggerProps & react.RefAttributes<HTMLElement>>;
+    Content: react.ForwardRefExoticComponent<NavigationMenuContentProps & react.RefAttributes<HTMLElement>>;
+    Link: react.ForwardRefExoticComponent<NavigationMenuLinkProps & react.RefAttributes<HTMLElement>>;
+    Indicator: react.ForwardRefExoticComponent<NavigationMenuIndicatorProps & react.RefAttributes<HTMLElement>>;
+    Viewport: react.ForwardRefExoticComponent<NavigationMenuViewportProps & react.RefAttributes<HTMLElement>>;
+};
+
+type ScrollAreaType = "auto" | "always" | "scroll" | "hover";
+interface ScrollAreaRootProps extends HTMLAttributes<HTMLElement> {
+    /** Content */
+    children?: ReactNode;
+    /** When scrollbars are visible */
+    type?: ScrollAreaType;
+    /** Scroll hide delay in ms (for hover type) */
+    scrollHideDelay?: number;
+    /** Orientation for which to show scrollbar */
+    orientation?: "vertical" | "horizontal" | "both";
+    /** Custom styles */
+    style?: CSSProperties;
+}
+interface ScrollAreaViewportProps extends HTMLAttributes<HTMLElement> {
+    /** Scrollable content */
+    children?: ReactNode;
+}
+interface ScrollAreaScrollbarProps extends HTMLAttributes<HTMLElement> {
+    /** Scrollbar content (typically a thumb) */
+    children?: ReactNode;
+    /** Scrollbar orientation */
+    orientation?: "vertical" | "horizontal";
+}
+interface ScrollAreaThumbProps extends HTMLAttributes<HTMLElement> {
+}
+declare const ScrollArea: {
+    Root: react.ForwardRefExoticComponent<ScrollAreaRootProps & react.RefAttributes<HTMLElement>>;
+    Viewport: react.ForwardRefExoticComponent<ScrollAreaViewportProps & react.RefAttributes<HTMLElement>>;
+    Scrollbar: react.ForwardRefExoticComponent<ScrollAreaScrollbarProps & react.RefAttributes<HTMLElement>>;
+    Thumb: react.ForwardRefExoticComponent<ScrollAreaThumbProps & react.RefAttributes<HTMLElement>>;
+};
+
+interface BreadcrumbRootProps extends HTMLAttributes<HTMLElement> {
+    children?: ReactNode;
+}
+interface BreadcrumbListProps extends HTMLAttributes<HTMLElement> {
+    children?: ReactNode;
+}
+interface BreadcrumbItemProps extends HTMLAttributes<HTMLElement> {
+    children?: ReactNode;
+}
+interface BreadcrumbLinkProps extends HTMLAttributes<HTMLElement> {
+    children?: ReactNode;
+    href?: string;
+    onNavigate?: (href: string) => void;
+}
+interface BreadcrumbPageProps extends HTMLAttributes<HTMLElement> {
+    children?: ReactNode;
+}
+interface BreadcrumbSeparatorProps extends HTMLAttributes<HTMLElement> {
+    children?: ReactNode;
+}
+declare const Breadcrumb: {
+    Root: react.ForwardRefExoticComponent<BreadcrumbRootProps & react.RefAttributes<HTMLElement>>;
+    List: react.ForwardRefExoticComponent<BreadcrumbListProps & react.RefAttributes<HTMLElement>>;
+    Item: react.ForwardRefExoticComponent<BreadcrumbItemProps & react.RefAttributes<HTMLElement>>;
+    Link: react.ForwardRefExoticComponent<BreadcrumbLinkProps & react.RefAttributes<HTMLElement>>;
+    Page: react.ForwardRefExoticComponent<BreadcrumbPageProps & react.RefAttributes<HTMLElement>>;
+    Separator: react.ForwardRefExoticComponent<BreadcrumbSeparatorProps & react.RefAttributes<HTMLElement>>;
+};
+
+interface PaginationRootProps extends HTMLAttributes<HTMLElement> {
+    children?: ReactNode;
+    page?: number;
+    defaultPage?: number;
+    totalPages?: number;
+    onPageChange?: (page: number) => void;
+}
+interface PaginationContentProps extends HTMLAttributes<HTMLElement> {
+    children?: ReactNode;
+}
+interface PaginationItemProps extends HTMLAttributes<HTMLElement> {
+    children?: ReactNode;
+}
+interface PaginationLinkProps extends HTMLAttributes<HTMLElement> {
+    children?: ReactNode;
+    page: number;
+    active?: boolean;
+}
+interface PaginationPreviousProps extends HTMLAttributes<HTMLElement> {
+    children?: ReactNode;
+    disabled?: boolean;
+}
+interface PaginationNextProps extends HTMLAttributes<HTMLElement> {
+    children?: ReactNode;
+    disabled?: boolean;
+}
+interface PaginationEllipsisProps extends HTMLAttributes<HTMLElement> {
+}
+declare const Pagination: {
+    Root: react.ForwardRefExoticComponent<PaginationRootProps & react.RefAttributes<HTMLElement>>;
+    Content: react.ForwardRefExoticComponent<PaginationContentProps & react.RefAttributes<HTMLElement>>;
+    Item: react.ForwardRefExoticComponent<PaginationItemProps & react.RefAttributes<HTMLElement>>;
+    Link: react.ForwardRefExoticComponent<PaginationLinkProps & react.RefAttributes<HTMLElement>>;
+    Previous: react.ForwardRefExoticComponent<PaginationPreviousProps & react.RefAttributes<HTMLElement>>;
+    Next: react.ForwardRefExoticComponent<PaginationNextProps & react.RefAttributes<HTMLElement>>;
+    Ellipsis: react.ForwardRefExoticComponent<PaginationEllipsisProps & react.RefAttributes<HTMLElement>>;
+};
+
+type StepperOrientation = "horizontal" | "vertical";
+interface StepperRootProps extends HTMLAttributes<HTMLElement> {
+    children?: ReactNode;
+    value?: number;
+    defaultValue?: number;
+    onStepChange?: (step: number) => void;
+    orientation?: StepperOrientation;
+    linear?: boolean;
+}
+interface StepperItemProps extends HTMLAttributes<HTMLElement> {
+    children?: ReactNode;
+    step: number;
+    completed?: boolean;
+    disabled?: boolean;
+}
+interface StepperTriggerProps extends HTMLAttributes<HTMLElement> {
+    children?: ReactNode;
+}
+interface StepperIndicatorProps extends HTMLAttributes<HTMLElement> {
+    children?: ReactNode;
+}
+interface StepperTitleProps extends HTMLAttributes<HTMLElement> {
+    children?: ReactNode;
+}
+interface StepperDescriptionProps extends HTMLAttributes<HTMLElement> {
+    children?: ReactNode;
+}
+interface StepperSeparatorProps extends HTMLAttributes<HTMLElement> {
+}
+interface StepperContentProps extends HTMLAttributes<HTMLElement> {
+    children?: ReactNode;
+}
+declare const Stepper: {
+    Root: react.ForwardRefExoticComponent<StepperRootProps & react.RefAttributes<HTMLElement>>;
+    Item: react.ForwardRefExoticComponent<StepperItemProps & react.RefAttributes<HTMLElement>>;
+    Trigger: react.ForwardRefExoticComponent<StepperTriggerProps & react.RefAttributes<HTMLElement>>;
+    Indicator: react.ForwardRefExoticComponent<StepperIndicatorProps & react.RefAttributes<HTMLElement>>;
+    Title: react.ForwardRefExoticComponent<StepperTitleProps & react.RefAttributes<HTMLElement>>;
+    Description: react.ForwardRefExoticComponent<StepperDescriptionProps & react.RefAttributes<HTMLElement>>;
+    Separator: react.ForwardRefExoticComponent<StepperSeparatorProps & react.RefAttributes<HTMLElement>>;
+    Content: react.ForwardRefExoticComponent<StepperContentProps & react.RefAttributes<HTMLElement>>;
+};
+
+interface CommandRootProps extends Omit<HTMLAttributes<HTMLElement>, "onSelect"> {
+    children?: ReactNode;
+    value?: string;
+    defaultValue?: string;
+    onValueChange?: (value: string) => void;
+    onSelect?: (value: string) => void;
+    loading?: boolean;
+    filter?: boolean;
+    label?: string;
+}
+interface CommandInputProps extends HTMLAttributes<HTMLElement> {
+    placeholder?: string;
+    disabled?: boolean;
+    value?: string;
+}
+interface CommandListProps extends HTMLAttributes<HTMLElement> {
+    children?: ReactNode;
+}
+interface CommandItemProps extends Omit<HTMLAttributes<HTMLElement>, "onSelect"> {
+    children?: ReactNode;
+    value?: string;
+    keywords?: string;
+    disabled?: boolean;
+    onSelect?: (value: string) => void;
+}
+interface CommandGroupProps extends HTMLAttributes<HTMLElement> {
+    children?: ReactNode;
+    heading?: string;
+}
+interface CommandSeparatorProps extends HTMLAttributes<HTMLElement> {
+}
+interface CommandEmptyProps extends HTMLAttributes<HTMLElement> {
+    children?: ReactNode;
+}
+interface CommandLoadingProps extends HTMLAttributes<HTMLElement> {
+    children?: ReactNode;
+}
+declare const Command: {
+    Root: react.ForwardRefExoticComponent<CommandRootProps & react.RefAttributes<HTMLElement>>;
+    Input: react.ForwardRefExoticComponent<CommandInputProps & react.RefAttributes<HTMLElement>>;
+    List: react.ForwardRefExoticComponent<CommandListProps & react.RefAttributes<HTMLElement>>;
+    Item: react.ForwardRefExoticComponent<CommandItemProps & react.RefAttributes<HTMLElement>>;
+    Group: react.ForwardRefExoticComponent<CommandGroupProps & react.RefAttributes<HTMLElement>>;
+    Separator: react.ForwardRefExoticComponent<CommandSeparatorProps & react.RefAttributes<HTMLElement>>;
+    Empty: react.ForwardRefExoticComponent<CommandEmptyProps & react.RefAttributes<HTMLElement>>;
+    Loading: react.ForwardRefExoticComponent<CommandLoadingProps & react.RefAttributes<HTMLElement>>;
+};
+
+/**
+ * SSR-Safe ID Generation Hooks
+ *
+ * Provides React 18 useId()-based hooks for stable ID generation
+ * that works correctly with SSR and hydration.
+ *
+ * @packageDocumentation
+ */
+/**
+ * Options for useStableId hook
+ */
+interface UseStableIdOptions {
+    /**
+     * Custom ID to use instead of auto-generated one.
+     * Useful when consumer wants to control the ID.
+     */
+    id?: string;
+    /**
+     * Prefix for the generated ID.
+     * @default "ds"
+     */
+    prefix?: string;
+}
+/**
+ * Options for useStableIds hook
+ */
+interface UseStableIdsOptions<T extends string> extends UseStableIdOptions {
+    /**
+     * Parts to generate related IDs for.
+     * Each part will get an ID derived from the base ID.
+     */
+    parts: readonly T[];
+}
+/**
+ * Return type for useStableIds hook
+ */
+type StableIds<T extends string> = {
+    /** The base ID */
+    baseId: string;
+} & Record<T, string>;
+/**
+ * Generate a stable, SSR-safe ID for a component.
+ *
+ * Uses React 18's useId() under the hood, which:
+ * - Generates deterministic IDs that match between server and client
+ * - Avoids hydration mismatches
+ * - Is unique within the React tree
+ *
+ * @example Basic usage
+ * ```tsx
+ * function Dialog() {
+ *   const titleId = useStableId({ prefix: "dialog-title" });
+ *   return (
+ *     <div role="dialog" aria-labelledby={titleId}>
+ *       <h2 id={titleId}>Dialog Title</h2>
+ *     </div>
+ *   );
+ * }
+ * ```
+ *
+ * @example With custom ID override
+ * ```tsx
+ * function Dialog({ id }: { id?: string }) {
+ *   // Uses provided id if available, otherwise generates one
+ *   const titleId = useStableId({ id, prefix: "dialog-title" });
+ *   // ...
+ * }
+ * ```
+ */
+declare function useStableId(options?: UseStableIdOptions): string;
+/**
+ * Generate multiple related stable IDs for a component with multiple ARIA relationships.
+ *
+ * Useful for components like Dialog that need IDs for title, description, and content.
+ *
+ * @example Dialog with multiple ARIA relationships
+ * ```tsx
+ * function Dialog() {
+ *   const ids = useStableIds({
+ *     prefix: "dialog",
+ *     parts: ["title", "description", "content"] as const,
+ *   });
+ *
+ *   return (
+ *     <div
+ *       role="dialog"
+ *       aria-labelledby={ids.title}
+ *       aria-describedby={ids.description}
+ *     >
+ *       <h2 id={ids.title}>Title</h2>
+ *       <p id={ids.description}>Description</p>
+ *       <div id={ids.content}>Content</div>
+ *     </div>
+ *   );
+ * }
+ * ```
+ *
+ * @example Select with listbox and options
+ * ```tsx
+ * function Select() {
+ *   const ids = useStableIds({
+ *     prefix: "select",
+ *     parts: ["trigger", "listbox", "label"] as const,
+ *   });
+ *
+ *   return (
+ *     <>
+ *       <label id={ids.label}>Choose option</label>
+ *       <button
+ *         id={ids.trigger}
+ *         aria-labelledby={ids.label}
+ *         aria-controls={ids.listbox}
+ *       >
+ *         Select...
+ *       </button>
+ *       <ul id={ids.listbox} role="listbox">
+ *         ...
+ *       </ul>
+ *     </>
+ *   );
+ * }
+ * ```
+ */
+declare function useStableIds<T extends string>(options: UseStableIdsOptions<T>): StableIds<T>;
+/**
+ * Create a scoped ID generator function from a base ID.
+ * Useful when you need to generate IDs dynamically within a component.
+ *
+ * @example Dynamic list items
+ * ```tsx
+ * function TreeView({ items }) {
+ *   const baseId = useStableId({ prefix: "tree" });
+ *   const scopedId = useScopedIdGenerator(baseId);
+ *
+ *   return (
+ *     <ul role="tree" id={baseId}>
+ *       {items.map((item, index) => (
+ *         <li key={item.id} id={scopedId(`item-${index}`)}>
+ *           {item.label}
+ *         </li>
+ *       ))}
+ *     </ul>
+ *   );
+ * }
+ * ```
+ */
+declare function useScopedIdGenerator(baseId: string): (suffix: string) => string;
+/**
+ * Hook to conditionally include an ID attribute.
+ * Returns undefined if the ID would be empty or invalid.
+ *
+ * @example Conditional aria-describedby
+ * ```tsx
+ * function Input({ description }: { description?: string }) {
+ *   const descriptionId = useStableId({ prefix: "input-desc" });
+ *   const ariaDescribedBy = useConditionalId(description ? descriptionId : undefined);
+ *
+ *   return (
+ *     <>
+ *       <input aria-describedby={ariaDescribedBy} />
+ *       {description && <p id={descriptionId}>{description}</p>}
+ *     </>
+ *   );
+ * }
+ * ```
+ */
+declare function useConditionalId(id: string | undefined): string | undefined;
+
+/**
+ * React Responsive Classes Hook
+ *
+ * Converts React responsive object syntax to CSS classes.
+ * React syntax: { base: "column", md: "row" }
+ * Output: ["ds-flow--md:dir-row"]
+ */
+/**
+ * Breakpoint tokens for responsive values.
+ */
+type BreakpointToken$1 = "xs" | "sm" | "md" | "lg" | "xl" | "2xl" | "3xl";
+/**
+ * Responsive value type for React props.
+ * Can be a simple value or an object with breakpoint overrides.
+ */
+type ResponsiveValue<T> = T | Partial<Record<"base" | BreakpointToken$1, T>>;
+
+/**
+ * Flow React Component
+ *
+ * Primary 1D layout primitive with responsive direction switching.
+ */
+
+type FlexDirection = "row" | "column" | "row-reverse" | "column-reverse";
+type FlexAlign$1 = "start" | "center" | "end" | "stretch" | "baseline";
+type FlexJustify = "start" | "center" | "end" | "between" | "around" | "evenly";
+type FlexWrap = "nowrap" | "wrap" | "wrap-reverse";
+type SpacingToken$7 = "none" | "xs" | "sm" | "md" | "lg" | "xl" | "2xl" | "3xl";
+interface FlowProps {
+    /** Flex direction. Supports responsive object syntax. */
+    direction?: ResponsiveValue<FlexDirection>;
+    /** Gap between children. Supports responsive object syntax. */
+    gap?: ResponsiveValue<SpacingToken$7>;
+    /** Cross-axis alignment. */
+    align?: FlexAlign$1;
+    /** Main-axis alignment. */
+    justify?: FlexJustify;
+    /** Flex wrap behavior. */
+    wrap?: FlexWrap;
+    /** Use inline-flex instead of flex. */
+    inline?: boolean;
+    /** Additional CSS class names. */
+    className?: string;
+    /** Children elements. */
+    children?: react__default.ReactNode;
+}
+/**
+ * React wrapper for ds-flow Web Component.
+ */
+declare const Flow: react__default.ForwardRefExoticComponent<FlowProps & react__default.RefAttributes<HTMLElement>>;
+
+/**
+ * Container React Component
+ *
+ * Constrains content width with responsive max-widths and padding.
+ */
+
+type ContainerSizeToken$1 = "sm" | "md" | "lg" | "xl" | "2xl" | "full";
+type SpacingToken$6 = "none" | "xs" | "sm" | "md" | "lg" | "xl" | "2xl" | "3xl";
+interface ContainerProps {
+    /** Maximum width constraint. */
+    size?: ContainerSizeToken$1;
+    /** Horizontal padding. */
+    padding?: SpacingToken$6;
+    /** Additional CSS class names. */
+    className?: string;
+    /** Children elements. */
+    children?: react__default.ReactNode;
+}
+/**
+ * React wrapper for ds-container Web Component.
+ */
+declare const Container: react__default.ForwardRefExoticComponent<ContainerProps & react__default.RefAttributes<HTMLElement>>;
+
+/**
+ * Grid React Component
+ *
+ * 2D grid layout with responsive columns.
+ */
+
+type GridColumns = 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12 | "auto-fit" | "auto-fill";
+type SpacingToken$5 = "none" | "xs" | "sm" | "md" | "lg" | "xl" | "2xl" | "3xl";
+interface GridProps {
+    /** Number of columns. Supports responsive object syntax. */
+    columns?: ResponsiveValue<GridColumns>;
+    /** Gap between grid items. Supports responsive object syntax. */
+    gap?: ResponsiveValue<SpacingToken$5>;
+    /** Row gap override. */
+    rowGap?: SpacingToken$5;
+    /** Column gap override. */
+    columnGap?: SpacingToken$5;
+    /** Additional CSS class names. */
+    className?: string;
+    /** Children elements. */
+    children?: react__default.ReactNode;
+}
+/**
+ * React wrapper for ds-grid Web Component.
+ */
+declare const Grid: react__default.ForwardRefExoticComponent<GridProps & react__default.RefAttributes<HTMLElement>>;
+
+/**
+ * Box React Component
+ *
+ * Token-only styling escape hatch for padding, background, and radius.
+ */
+
+type SpacingToken$4 = "none" | "xs" | "sm" | "md" | "lg" | "xl" | "2xl" | "3xl";
+type SurfaceToken$1 = "background" | "surface" | "surface-raised" | "surface-sunken" | "muted";
+type RadiusToken = "none" | "sm" | "md" | "lg" | "xl" | "full";
+interface BoxProps {
+    /** Padding (all sides). */
+    p?: SpacingToken$4;
+    /** Horizontal padding. */
+    px?: SpacingToken$4;
+    /** Vertical padding. */
+    py?: SpacingToken$4;
+    /** Background color token. */
+    bg?: SurfaceToken$1;
+    /** Border radius token. */
+    radius?: RadiusToken;
+    /** Additional CSS class names. */
+    className?: string;
+    /** Children elements. */
+    children?: react__default.ReactNode;
+}
+/**
+ * React wrapper for ds-box Web Component.
+ */
+declare const Box: react__default.ForwardRefExoticComponent<BoxProps & react__default.RefAttributes<HTMLElement>>;
+
+/**
+ * Page React Component
+ *
+ * Page wrapper with min-height and background.
+ */
+
+type SurfaceToken = "background" | "surface" | "surface-raised" | "surface-sunken" | "muted";
+type MinHeightValue = "viewport" | "full";
+interface PageProps {
+    /** Background color token. */
+    bg?: SurfaceToken;
+    /** Minimum height. */
+    minHeight?: MinHeightValue;
+    /** Additional CSS class names. */
+    className?: string;
+    /** Children elements. */
+    children?: react__default.ReactNode;
+}
+/**
+ * React wrapper for ds-page Web Component.
+ */
+declare const Page: react__default.ForwardRefExoticComponent<PageProps & react__default.RefAttributes<HTMLElement>>;
+
+/**
+ * Section React Component
+ *
+ * Semantic section wrapper with consistent vertical spacing.
+ */
+
+type SpacingToken$3 = "none" | "xs" | "sm" | "md" | "lg" | "xl" | "2xl" | "3xl";
+interface SectionProps {
+    /** Vertical padding. */
+    spacing?: SpacingToken$3;
+    /** Additional CSS class names. */
+    className?: string;
+    /** Children elements. */
+    children?: react__default.ReactNode;
+}
+/**
+ * React wrapper for ds-section Web Component.
+ */
+declare const Section: react__default.ForwardRefExoticComponent<SectionProps & react__default.RefAttributes<HTMLElement>>;
+
+/**
+ * AppShell React Component
+ *
+ * Application structure with compound component pattern.
+ */
+
+type SidebarPosition = "left" | "right" | "none";
+interface AppShellProps {
+    /** Sidebar position. */
+    sidebarPosition?: SidebarPosition;
+    /** Additional CSS class names. */
+    className?: string;
+    /** Children elements. */
+    children?: react__default.ReactNode;
+}
+interface HeaderProps {
+    /** Enable sticky positioning. */
+    sticky?: boolean;
+    /** Enable safe area insets. */
+    safeArea?: boolean;
+    /** Additional CSS class names. */
+    className?: string;
+    /** Children elements. */
+    children?: react__default.ReactNode;
+}
+interface FooterProps {
+    /** Enable sticky positioning. */
+    sticky?: boolean;
+    /** Enable safe area insets. */
+    safeArea?: boolean;
+    /** Additional CSS class names. */
+    className?: string;
+    /** Children elements. */
+    children?: react__default.ReactNode;
+}
+interface MainProps {
+    /** Element ID for skip-link targeting. */
+    id?: string;
+    /** Additional CSS class names. */
+    className?: string;
+    /** Children elements. */
+    children?: react__default.ReactNode;
+}
+interface SidebarProps {
+    /** Additional CSS class names. */
+    className?: string;
+    /** Children elements. */
+    children?: react__default.ReactNode;
+}
+declare const AppShell: react__default.ForwardRefExoticComponent<AppShellProps & react__default.RefAttributes<HTMLElement>> & {
+    Header: react__default.ForwardRefExoticComponent<HeaderProps & react__default.RefAttributes<HTMLElement>>;
+    Footer: react__default.ForwardRefExoticComponent<FooterProps & react__default.RefAttributes<HTMLElement>>;
+    Main: react__default.ForwardRefExoticComponent<MainProps & react__default.RefAttributes<HTMLElement>>;
+    Sidebar: react__default.ForwardRefExoticComponent<SidebarProps & react__default.RefAttributes<HTMLElement>>;
+};
+
+type SpacingToken$2 = "none" | "xs" | "sm" | "md" | "lg" | "xl" | "2xl" | "3xl";
+type SpacerAxis = "horizontal" | "vertical";
+interface SpacerProps {
+    /** Size of the space. */
+    size?: SpacingToken$2;
+    /** Axis direction. */
+    axis?: SpacerAxis;
+    /** Additional CSS class names. */
+    className?: string;
+}
+/**
+ * React wrapper for ds-spacer Web Component.
+ */
+declare const Spacer: react.ForwardRefExoticComponent<SpacerProps & react.RefAttributes<HTMLElement>>;
+
+/**
+ * Center React Component
+ *
+ * Centers content horizontally/vertically with optional max-width.
+ */
+
+type ContainerSizeToken = "sm" | "md" | "lg" | "xl" | "2xl" | "full";
+interface CenterProps {
+    /** Maximum width constraint. */
+    maxWidth?: ContainerSizeToken;
+    /** Enable vertical centering. */
+    vertical?: boolean;
+    /** Additional CSS class names. */
+    className?: string;
+    /** Children elements. */
+    children?: react__default.ReactNode;
+}
+/**
+ * React wrapper for ds-center Web Component.
+ */
+declare const Center: react__default.ForwardRefExoticComponent<CenterProps & react__default.RefAttributes<HTMLElement>>;
+
+/**
+ * Split React Component
+ *
+ * Two-region layout with collapse breakpoint.
+ */
+
+type BreakpointToken = "xs" | "sm" | "md" | "lg" | "xl" | "2xl" | "3xl";
+type SpacingToken$1 = "none" | "xs" | "sm" | "md" | "lg" | "xl" | "2xl" | "3xl";
+type SplitRatio = "equal" | "1:2" | "2:1" | "1:3" | "3:1";
+interface SplitProps {
+    /** Breakpoint at which to collapse to single column. */
+    collapseAt?: BreakpointToken;
+    /** Gap between regions. */
+    gap?: SpacingToken$1;
+    /** Width ratio between regions. */
+    ratio?: SplitRatio;
+    /** Additional CSS class names. */
+    className?: string;
+    /** Children elements (should be exactly 2). */
+    children?: react__default.ReactNode;
+}
+/**
+ * React wrapper for ds-split Web Component.
+ */
+declare const Split: react__default.ForwardRefExoticComponent<SplitProps & react__default.RefAttributes<HTMLElement>>;
+
+/**
+ * Wrap React Component
+ *
+ * Wrapping row layout for tags/chips.
+ */
+
+type SpacingToken = "none" | "xs" | "sm" | "md" | "lg" | "xl" | "2xl" | "3xl";
+type FlexAlign = "start" | "center" | "end";
+interface WrapProps {
+    /** Gap between items. */
+    gap?: SpacingToken;
+    /** Row gap override. */
+    rowGap?: SpacingToken;
+    /** Cross-axis alignment. */
+    align?: FlexAlign;
+    /** Additional CSS class names. */
+    className?: string;
+    /** Children elements. */
+    children?: react__default.ReactNode;
+}
+/**
+ * React wrapper for ds-wrap Web Component.
+ */
+declare const Wrap: react__default.ForwardRefExoticComponent<WrapProps & react__default.RefAttributes<HTMLElement>>;
+
+interface StackProps extends Omit<FlowProps, "direction"> {
+    /** Gap between children. Supports responsive object syntax. */
+    gap?: FlowProps["gap"];
+}
+/**
+ * Stack is a Flow with direction="column".
+ */
+declare const Stack: react.ForwardRefExoticComponent<StackProps & react.RefAttributes<HTMLElement>>;
+
+interface InlineProps extends Omit<FlowProps, "direction"> {
+    /** Gap between children. Supports responsive object syntax. */
+    gap?: FlowProps["gap"];
+}
+/**
+ * Inline is a Flow with direction="row".
+ */
+declare const Inline: react.ForwardRefExoticComponent<InlineProps & react.RefAttributes<HTMLElement>>;
+
+/**
+ * Theme System Types
+ *
+ * Type definitions for the theme and density system.
+ *
+ * @packageDocumentation
+ */
+/**
+ * Color mode (light or dark theme)
+ */
+type ColorMode = "light" | "dark" | "system";
+/**
+ * Resolved color mode (excludes "system")
+ */
+type ResolvedColorMode = "light" | "dark";
+/**
+ * Density mode for component sizing
+ */
+type Density = "compact" | "default" | "spacious";
+/**
+ * Theme configuration
+ */
+interface ThemeConfig {
+    /** Color mode preference */
+    colorMode: ColorMode;
+    /** Density preference */
+    density: Density;
+}
+/**
+ * Theme context value
+ */
+interface ThemeContextValue {
+    /** Current color mode setting (may be "system") */
+    colorMode: ColorMode;
+    /** Resolved color mode (never "system") */
+    resolvedColorMode: ResolvedColorMode;
+    /** Current density setting */
+    density: Density;
+    /** Set the color mode */
+    setColorMode: (mode: ColorMode) => void;
+    /** Set the density */
+    setDensity: (density: Density) => void;
+    /** Toggle between light and dark (ignores system) */
+    toggleColorMode: () => void;
+}
+/**
+ * Density context value (subset of theme for density-only use)
+ */
+interface DensityContextValue {
+    /** Current density setting */
+    density: Density;
+    /** Set the density */
+    setDensity: (density: Density) => void;
+}
+/**
+ * Storage key configuration
+ */
+interface StorageKeys {
+    /** Key for color mode storage */
+    colorMode: string;
+    /** Key for density storage */
+    density: string;
+}
+/**
+ * Default storage keys
+ */
+declare const DEFAULT_STORAGE_KEYS: StorageKeys;
+/**
+ * Default theme configuration
+ */
+declare const DEFAULT_THEME: ThemeConfig;
+/**
+ * CSS attribute names for theme
+ */
+declare const THEME_ATTRIBUTES: {
+    readonly colorMode: "data-theme";
+    readonly density: "data-density";
+};
+
+/**
+ * Theme Provider
+ *
+ * React context provider for theme and density settings.
+ *
+ * @packageDocumentation
+ */
+
+/**
+ * Props for ThemeProvider
+ */
+interface ThemeProviderProps {
+    /** Child components */
+    children: ReactNode;
+    /** Default color mode */
+    defaultColorMode?: ColorMode;
+    /** Default density */
+    defaultDensity?: Density;
+    /** Storage keys for persistence */
+    storageKeys?: StorageKeys;
+    /** Whether to sync theme to DOM attributes (default: true) */
+    syncToDOM?: boolean;
+    /** Custom attribute names */
+    attributes?: {
+        colorMode?: string;
+        density?: string;
+    };
+    /** Forced color mode (disables user preference) */
+    forcedColorMode?: ColorMode;
+    /** Forced density (disables user preference) */
+    forcedDensity?: Density;
+}
+/**
+ * Theme Provider Component
+ *
+ * Provides theme context to the component tree. Handles:
+ * - Color mode (light/dark/system)
+ * - Density (compact/default/spacious)
+ * - Persistence to localStorage/cookies
+ * - System color mode detection
+ * - DOM attribute synchronization
+ *
+ * @example
+ * ```tsx
+ * // Basic usage
+ * function App() {
+ *   return (
+ *     <ThemeProvider>
+ *       <MyApp />
+ *     </ThemeProvider>
+ *   );
+ * }
+ *
+ * // With custom defaults
+ * function App() {
+ *   return (
+ *     <ThemeProvider
+ *       defaultColorMode="dark"
+ *       defaultDensity="compact"
+ *     >
+ *       <MyApp />
+ *     </ThemeProvider>
+ *   );
+ * }
+ *
+ * // In Next.js App Router
+ * // app/layout.tsx
+ * import { ThemeProvider, getThemeScriptProps } from '@hypoth-ui/react/theme';
+ *
+ * export default function RootLayout({ children }) {
+ *   return (
+ *     <html>
+ *       <head>
+ *         <script {...getThemeScriptProps()} />
+ *       </head>
+ *       <body>
+ *         <ThemeProvider>{children}</ThemeProvider>
+ *       </body>
+ *     </html>
+ *   );
+ * }
+ * ```
+ */
+declare function ThemeProvider({ children, defaultColorMode, defaultDensity, storageKeys, syncToDOM, attributes, forcedColorMode, forcedDensity, }: ThemeProviderProps): JSX.Element;
+declare namespace ThemeProvider {
+    var displayName: string;
+}
+
+/**
+ * Density Provider
+ *
+ * Lightweight provider for density-only contexts.
+ * Use this when you only need density control without color mode.
+ *
+ * @packageDocumentation
+ */
+
+/**
+ * Props for DensityProvider
+ */
+interface DensityProviderProps {
+    /** Child components */
+    children: ReactNode;
+    /** Default density */
+    defaultDensity?: Density;
+    /** Storage keys for persistence */
+    storageKeys?: StorageKeys;
+    /** Whether to sync density to DOM attributes (default: true) */
+    syncToDOM?: boolean;
+    /** Custom attribute name for density */
+    attribute?: string;
+    /** Forced density value (disables user preference) */
+    forcedDensity?: Density;
+}
+/**
+ * Density Provider Component
+ *
+ * Provides density context to the component tree without color mode support.
+ * Use this for sections that need independent density control.
+ *
+ * @example
+ * ```tsx
+ * // Make a data table section more compact
+ * function DataSection() {
+ *   return (
+ *     <DensityProvider defaultDensity="compact">
+ *       <DataTable data={data} />
+ *     </DensityProvider>
+ *   );
+ * }
+ *
+ * // Force compact density for a specific area
+ * function SidePanel() {
+ *   return (
+ *     <DensityProvider forcedDensity="compact">
+ *       <Navigation />
+ *       <FilterControls />
+ *     </DensityProvider>
+ *   );
+ * }
+ * ```
+ */
+declare function DensityProvider({ children, defaultDensity, storageKeys, syncToDOM, attribute, forcedDensity, }: DensityProviderProps): JSX.Element;
+declare namespace DensityProvider {
+    var displayName: string;
+}
+/**
+ * Hook to access density context from DensityProvider
+ *
+ * @throws Error if used outside of DensityProvider or ThemeProvider
+ *
+ * @example
+ * ```tsx
+ * function CompactToggle() {
+ *   const { density, setDensity } = useDensityContext();
+ *
+ *   return (
+ *     <button onClick={() => setDensity(density === 'compact' ? 'default' : 'compact')}>
+ *       Toggle Compact Mode
+ *     </button>
+ *   );
+ * }
+ * ```
+ */
+declare function useDensityContext(): DensityContextValue;
+
+/**
+ * Hook to access theme context
+ *
+ * @throws Error if used outside of ThemeProvider
+ *
+ * @example
+ * ```tsx
+ * function MyComponent() {
+ *   const { colorMode, setColorMode, density, setDensity } = useTheme();
+ *
+ *   return (
+ *     <div>
+ *       <p>Current mode: {colorMode}</p>
+ *       <button onClick={() => setColorMode('dark')}>Dark</button>
+ *       <button onClick={() => setDensity('compact')}>Compact</button>
+ *     </div>
+ *   );
+ * }
+ * ```
+ */
+declare function useTheme(): ThemeContextValue;
+/**
+ * Options for useThemeState hook
+ */
+interface UseThemeStateOptions {
+    /** Default color mode */
+    defaultColorMode?: ColorMode;
+    /** Default density */
+    defaultDensity?: Density;
+    /** Storage keys */
+    storageKeys?: StorageKeys;
+    /** Whether to sync to DOM attributes */
+    syncToDOM?: boolean;
+    /** Attribute names for DOM sync */
+    attributes?: {
+        colorMode?: string;
+        density?: string;
+    };
+}
+/**
+ * Low-level hook for managing theme state
+ *
+ * This hook manages the theme state internally and can be used
+ * to build custom ThemeProvider implementations.
+ *
+ * @example
+ * ```tsx
+ * function CustomThemeProvider({ children }) {
+ *   const themeState = useThemeState({
+ *     defaultColorMode: 'system',
+ *     defaultDensity: 'default',
+ *   });
+ *
+ *   return (
+ *     <ThemeContext.Provider value={themeState}>
+ *       {children}
+ *     </ThemeContext.Provider>
+ *   );
+ * }
+ * ```
+ */
+declare function useThemeState(options?: UseThemeStateOptions): ThemeContextValue;
+/**
+ * Hook to get only the resolved color mode
+ *
+ * @example
+ * ```tsx
+ * function ThemedIcon() {
+ *   const colorMode = useColorMode();
+ *   return <Icon name={colorMode === 'dark' ? 'moon' : 'sun'} />;
+ * }
+ * ```
+ */
+declare function useColorMode(): ResolvedColorMode;
+/**
+ * Hook to get only the density setting
+ *
+ * @example
+ * ```tsx
+ * function DenseTable() {
+ *   const density = useDensity();
+ *   return <Table compact={density === 'compact'} />;
+ * }
+ * ```
+ */
+declare function useDensity(): Density;
+
+/**
+ * Theme Storage Utilities
+ *
+ * Persistence utilities for theme preferences using localStorage and cookies.
+ * Supports both client-side storage and SSR-safe cookie parsing.
+ *
+ * @packageDocumentation
+ */
+
+/**
+ * Parse theme from cookie string (for SSR)
+ *
+ * @param cookieString - The cookie header string from the request
+ * @param keys - Storage keys to look for
+ * @returns Parsed theme configuration
+ *
+ * @example
+ * ```ts
+ * // In Next.js App Router
+ * import { cookies } from 'next/headers';
+ *
+ * export default function Layout({ children }) {
+ *   const cookieStore = cookies();
+ *   const theme = parseThemeCookie(cookieStore.toString());
+ *   return (
+ *     <html data-theme={theme.colorMode} data-density={theme.density}>
+ *       ...
+ *     </html>
+ *   );
+ * }
+ * ```
+ */
+declare function parseThemeCookie(cookieString: string, keys?: StorageKeys): ThemeConfig;
+/**
+ * Sync theme to both localStorage and cookies
+ * This ensures SSR can read the theme from cookies while
+ * client-side code can use localStorage for faster access.
+ */
+declare function syncThemeStorage(theme: Partial<ThemeConfig>, keys?: StorageKeys): void;
+/**
+ * Get the system color mode preference
+ */
+declare function getSystemColorMode(): ResolvedColorMode;
+
+/**
+ * Theme Script Utilities
+ *
+ * Generates inline scripts to prevent flash of unstyled content (FOUC)
+ * when using theme preferences stored in localStorage/cookies.
+ *
+ * @packageDocumentation
+ */
+
+/**
+ * Options for the theme script
+ */
+interface ThemeScriptOptions {
+    /** Storage keys for theme values */
+    storageKeys?: StorageKeys;
+    /** Default color mode if none stored */
+    defaultColorMode?: "light" | "dark" | "system";
+    /** Default density if none stored */
+    defaultDensity?: "compact" | "default" | "spacious";
+    /** Attribute names for theme */
+    attributes?: {
+        colorMode?: string;
+        density?: string;
+    };
+    /** Enable cookie fallback for SSR */
+    useCookies?: boolean;
+}
+/**
+ * Generate the theme initialization script content
+ *
+ * This script runs synchronously before React hydrates, preventing FOUC.
+ * It reads from localStorage (and optionally cookies) and sets data attributes.
+ */
+declare function getThemeScriptContent(options?: ThemeScriptOptions): string;
+/**
+ * Generate a script element string for inclusion in HTML head
+ *
+ * @example
+ * ```tsx
+ * // In Next.js App Router layout.tsx
+ * import { getThemeScriptTag } from '@hypoth-ui/react/theme';
+ *
+ * export default function RootLayout({ children }) {
+ *   return (
+ *     <html>
+ *       <head>
+ *         <script dangerouslySetInnerHTML={{ __html: getThemeScriptTag() }} />
+ *       </head>
+ *       <body>{children}</body>
+ *     </html>
+ *   );
+ * }
+ * ```
+ */
+declare function getThemeScriptTag(options?: ThemeScriptOptions): string;
+/**
+ * React component props for ThemeScript
+ */
+interface ThemeScriptProps extends ThemeScriptOptions {
+    /** Nonce for CSP (Content Security Policy) */
+    nonce?: string;
+}
+/**
+ * Get props for a script element
+ *
+ * @example
+ * ```tsx
+ * import { getThemeScriptProps } from '@hypoth-ui/react/theme';
+ *
+ * function Head() {
+ *   const scriptProps = getThemeScriptProps({ nonce: 'abc123' });
+ *   return <script {...scriptProps} />;
+ * }
+ * ```
+ */
+declare function getThemeScriptProps(options?: ThemeScriptProps): {
+    dangerouslySetInnerHTML: {
+        __html: string;
+    };
+    nonce?: string;
+};
+
+export { Accordion, type AccordionContentProps, type AccordionItemProps, type AccordionOrientation, type AccordionRootProps, type AccordionTriggerProps, type AccordionType, AlertDialog, type AlertDialogActionProps, type AlertDialogCancelProps, type AlertDialogContentProps, type AlertDialogContentSize, type AlertDialogDescriptionProps, type AlertDialogFooterProps, type AlertDialogHeaderProps, type AlertDialogRootProps, type AlertDialogTitleProps, type AlertDialogTriggerProps, AppShell, type AppShellProps, AspectRatio, type AspectRatioProps, Breadcrumb, type BreadcrumbItemProps, type BreadcrumbLinkProps, type BreadcrumbListProps, type BreadcrumbPageProps, type BreadcrumbRootProps, type BreadcrumbSeparatorProps, Button, type ButtonProps, Card, type CardContentProps, type CardFooterProps, type CardHeaderProps, type CardRootProps, Center, type CenterProps, Checkbox, type CheckboxProps, Collapsible, type CollapsibleContentProps, type CollapsibleRootProps, type CollapsibleTriggerProps, type ColorMode, Combobox, type ComboboxContentProps, type ComboboxEmptyProps, type ComboboxInputProps, type ComboboxLoadingProps, type ComboboxOptionProps, type ComboboxRootProps, type ComboboxTagProps, Command, type CommandEmptyProps, type CommandGroupProps, type CommandInputProps, type CommandItemProps, type CommandListProps, type CommandLoadingProps, type CommandRootProps, type CommandSeparatorProps, Container, type ContainerProps, ContextMenu, type ContextMenuContentProps, type ContextMenuItemProps, type ContextMenuItemVariant, type ContextMenuLabelProps, type ContextMenuRootProps, type ContextMenuSeparatorProps, type ContextMenuTriggerProps, DEFAULT_STORAGE_KEYS, DEFAULT_THEME, DSErrorFallback, DatePicker, type DatePickerCalendarProps, type DatePickerContentProps, type DatePickerMode, type DatePickerRootProps, type DatePickerTriggerProps, type Density, type DensityContextValue, DensityProvider, type DensityProviderProps, Dialog, type DialogCloseProps, type DialogContentProps, type DialogContentSize, type DialogDescriptionProps, type DialogRootProps, type DialogTitleProps, type DialogTriggerProps, Drawer, type DrawerContentProps, type DrawerDescriptionProps, type DrawerFooterProps, type DrawerHeaderProps, type DrawerRootProps, type DrawerSide, type DrawerTitleProps, type DrawerTriggerProps, DropdownMenu, type DropdownMenuCheckboxItemProps, type DropdownMenuContentProps, type DropdownMenuItemProps, type DropdownMenuItemVariant, type DropdownMenuLabelProps, type DropdownMenuPlacement, type DropdownMenuRadioGroupProps, type DropdownMenuRadioItemProps, type DropdownMenuRootProps, type DropdownMenuSeparatorProps, type DropdownMenuTriggerProps, ErrorBoundary, type ErrorBoundaryProps, type ErrorBoundaryState, Field, FieldDescription, type FieldDescriptionProps, FieldError, type FieldErrorProps, type FieldProps, FileUpload, type FileUploadDropzoneProps, type FileUploadInputProps, type FileUploadItemProps, type FileUploadRootProps, Flow, type FlowProps, Grid, type GridProps, HoverCard, type HoverCardContentProps, type HoverCardPlacement, type HoverCardRootProps, type HoverCardTriggerProps, Inline, type InlineProps, Label, type LabelProps, Box as LayoutBox, type BoxProps as LayoutBoxProps, type FooterProps as LayoutFooterProps, type HeaderProps as LayoutHeaderProps, type LoadingProps, type LoadingState, type MainProps, Menu, type MenuContentProps, type MenuItemProps, type MenuLabelProps, type MenuRootProps, type MenuSeparatorProps, type MenuTriggerProps, NavigationMenu, type NavigationMenuContentProps, type NavigationMenuIndicatorProps, type NavigationMenuItemProps, type NavigationMenuLinkProps, type NavigationMenuListProps, type NavigationMenuOrientation, type NavigationMenuRootProps, type NavigationMenuTriggerProps, type NavigationMenuViewportProps, NumberInput, type NumberInputDecrementProps, type NumberInputFieldProps, type NumberInputFormat, type NumberInputIncrementProps, type NumberInputRootProps, type OnLoadingChange, Page, type PageProps, Pagination, type PaginationContentProps, type PaginationEllipsisProps, type PaginationItemProps, type PaginationLinkProps, type PaginationNextProps, type PaginationPreviousProps, type PaginationRootProps, PinInput, type PinInputFieldProps, type PinInputRootProps, type Placement, Popover, PopoverContent, type PopoverContentProps, type PopoverProps, Presence, type PresenceProps, Radio, RadioGroup, type RadioGroupProps, type RadioOrientation, type RadioProps, type ResolvedColorMode, ScrollArea, type ScrollAreaRootProps, type ScrollAreaScrollbarProps, type ScrollAreaThumbProps, type ScrollAreaType, type ScrollAreaViewportProps, Section, type SectionProps, Select, type SelectContentProps, type SelectLabelProps, type SelectOptionProps, type SelectRootProps, type SelectSeparatorProps, type SelectTriggerProps, type SelectValueProps, Separator, type SeparatorOrientation, type SeparatorProps, Sheet, type SheetCloseProps, type SheetContentProps, type SheetContentSize, type SheetDescriptionProps, type SheetFooterProps, type SheetHeaderProps, type SheetRootProps, type SheetSide, type SheetTitleProps, type SheetTriggerProps, type SidebarProps, Slider, type SliderRangeProps, type SliderRootProps, type SliderThumbProps, type SliderTrackProps, Spacer, type SpacerProps, Split, type SplitProps, type StableIds, Stack, type StackProps, Stepper, type StepperContentProps, type StepperDescriptionProps, type StepperIndicatorProps, type StepperItemProps, type StepperOrientation, type StepperRootProps, type StepperSeparatorProps, type StepperTitleProps, type StepperTriggerProps, type StorageKeys, Switch, type SwitchProps, THEME_ATTRIBUTES, type TableLoadingProps, Tabs, type TabsActivationMode, type TabsContentProps, type TabsListProps, type TabsOrientation, type TabsRootProps, type TabsTriggerProps, Textarea, type TextareaProps, type TextareaSize, type ThemeConfig, type ThemeContextValue, ThemeProvider, type ThemeProviderProps, type ThemeScriptOptions, type ThemeScriptProps, TimePicker, type TimePickerRootProps, type TimePickerSegmentProps, Tooltip, TooltipContent, type TooltipContentProps, type TooltipProps, type TreeLoadingProps, type UsePresenceOptions, type UsePresenceReturn, type UseStableIdOptions, type UseStableIdsOptions, type WithErrorBoundaryOptions, Wrap, type WrapProps, getSystemColorMode, getThemeScriptContent, getThemeScriptProps, getThemeScriptTag, parseThemeCookie, syncThemeStorage, useColorMode, useConditionalId, useDensity, useDensityContext, usePresence, useScopedIdGenerator, useStableId, useStableIds, useTheme, useThemeState, withErrorBoundary };