sherick-ui 1.0.4 → 2.0.0

package/dist/types/index.d.ts

@@ -0,0 +1,1111 @@
+import { Accordion as Accordion$1 } from '@base-ui/react/accordion';
+import React, { ReactNode, ButtonHTMLAttributes, ImgHTMLAttributes, HTMLAttributes, Ref, ComponentProps, InputHTMLAttributes, ComponentPropsWithoutRef, ForwardRefExoticComponent, RefAttributes, ReactElement, MouseEventHandler, AnchorHTMLAttributes, TextareaHTMLAttributes } from 'react';
+import { Collapsible as Collapsible$1 } from '@base-ui/react/collapsible';
+import { AlertDialog as AlertDialog$1 } from '@base-ui/react/alert-dialog';
+import { Checkbox as Checkbox$1 } from '@base-ui/react/checkbox';
+import { Toggle } from '@base-ui/react/toggle';
+import { ToggleGroup as ToggleGroup$1 } from '@base-ui/react/toggle-group';
+import { Combobox as Combobox$1 } from '@base-ui/react/combobox';
+import { Select as Select$1 } from '@base-ui/react/select';
+import { Field as Field$1 } from '@base-ui/react/field';
+import { Input as Input$1 } from '@base-ui/react/input';
+import { Dialog as Dialog$1 } from '@base-ui/react/dialog';
+import { Menu as Menu$1 } from '@base-ui/react/menu';
+import { NumberField as NumberField$1 } from '@base-ui/react/number-field';
+import { Popover as Popover$1 } from '@base-ui/react/popover';
+import { Progress as Progress$1 } from '@base-ui/react/progress';
+import { RadioGroup as RadioGroup$1 } from '@base-ui/react/radio-group';
+import { Slider as Slider$1 } from '@base-ui/react/slider';
+import * as class_variance_authority_types from 'class-variance-authority/types';
+import { VariantProps } from 'class-variance-authority';
+import { Switch as Switch$1 } from '@base-ui/react/switch';
+import { Tabs as Tabs$1 } from '@base-ui/react/tabs';
+
+/** A heading level for the groups of an `Accordion`. Base renders a heading around every panel
+ *  trigger, because that is what makes the group navigable as a set of sections; which level it
+ *  is depends on where the accordion sits in the document. */
+type AccordionHeadingLevel = 1 | 2 | 3 | 4 | 5 | 6;
+interface AccordionProps {
+    children: ReactNode;
+    /**
+     * Whether more than one panel can be open at once. A group that answers a question is single:
+     * opening one section closes the one before it.
+     */
+    multiple?: boolean;
+    /** The item(s) that are expanded, when the application owns the state. */
+    value?: Accordion$1.Root.Props["value"];
+    /** The item(s) that start expanded, for an accordion that owns its own state. */
+    defaultValue?: Accordion$1.Root.Props["defaultValue"];
+    /** Base's own value-change callback, event details included. */
+    onValueChange?: Accordion$1.Root.Props["onValueChange"];
+    /** Whether the whole group is inert. */
+    disabled?: boolean;
+    /** The heading level the group labels its sections with. */
+    headingLevel?: AccordionHeadingLevel;
+    /** Adds to the group's own column. The rows and panels style themselves. */
+    className?: string;
+}
+interface AccordionItemProps {
+    children: ReactNode;
+    /**
+     * Identifies the item. A controlled accordion expands its items by value, so an item without
+     * one can still be opened but not addressed from outside.
+     */
+    value?: Accordion$1.Item.Props["value"];
+    /** Whether this item alone is inert. */
+    disabled?: boolean;
+    /** Adds to the item's own column. */
+    className?: string;
+}
+interface AccordionTriggerProps {
+    children: ReactNode;
+    /** Adds to the row. The row's shape, tone and states are the disclosure recipe's. */
+    className?: string;
+}
+interface AccordionPanelProps {
+    children: ReactNode;
+    /** Adds to the measured region. The region's height and clipping are the recipe's. */
+    className?: string;
+}
+declare const AccordionItem: ({ children, className, ...props }: AccordionItemProps) => React.JSX.Element;
+type AccordionComponent = ((props: AccordionProps) => React.JSX.Element) & {
+    Item: typeof AccordionItem;
+    Trigger: typeof AccordionTrigger;
+    Panel: typeof AccordionPanel;
+};
+declare const AccordionTrigger: ({ children, className }: AccordionTriggerProps) => React.JSX.Element;
+declare const AccordionPanel: ({ children, className }: AccordionPanelProps) => React.JSX.Element;
+declare const Accordion: AccordionComponent;
+
+interface CollapsibleProps {
+    children: ReactNode;
+    /** Whether the region is expanded, when the application owns the state. */
+    open?: boolean;
+    /** Whether the region starts expanded, for a collapsible that owns its own state. */
+    defaultOpen?: boolean;
+    /** Base's own open-change callback, event details included. */
+    onOpenChange?: Collapsible$1.Root.Props["onOpenChange"];
+    /** Whether the disclosure is inert. */
+    disabled?: boolean;
+    /** Adds to the disclosure's own column. The row and the panel style themselves. */
+    className?: string;
+}
+interface CollapsibleTriggerProps {
+    children: ReactNode;
+    /** Adds to the row. The row's shape, tone and states are the disclosure recipe's. */
+    className?: string;
+}
+interface CollapsiblePanelProps {
+    children: ReactNode;
+    /** Adds to the measured region. The region's height and clipping are the recipe's. */
+    className?: string;
+}
+type CollapsibleComponent = ((props: CollapsibleProps) => React.JSX.Element) & {
+    Trigger: typeof CollapsibleTrigger;
+    Panel: typeof CollapsiblePanel;
+};
+declare const CollapsibleTrigger: ({ children, className }: CollapsibleTriggerProps) => React.JSX.Element;
+declare const CollapsiblePanel: ({ children, className }: CollapsiblePanelProps) => React.JSX.Element;
+/**
+ * One region that expands where it sits, without belonging to a group. Base UI owns the expanded
+ * state and the trigger's `aria-expanded`/`aria-controls` plumbing — including making the
+ * trigger's own state reachable, since nothing else in the page holds it; Sherick UI owns the
+ * row, the panel's clipping and how the height moves.
+ *
+ * It is the same object an `Accordion` item is, at the scope of a single disclosure: use a
+ * `Collapsible` for one region on its own, and an `Accordion` when several sections belong to
+ * one group.
+ */
+declare const Collapsible: CollapsibleComponent;
+
+type Variant = "primary" | "secondary" | "danger" | "warning" | "success";
+/**
+ * The edge a floating surface is anchored to, and how it sits along that edge.
+ *
+ * These are this package's own names for the values it renders. A surface's entrance geometry is
+ * written per edge, so the set is part of Sherick UI's contract rather than a pass-through of the
+ * positioning library underneath it.
+ */
+type OverlaySide = "top" | "bottom" | "left" | "right" | "inline-start" | "inline-end";
+type OverlayAlign = "start" | "center" | "end";
+
+type ButtonAppearance = "filled" | "tonal" | "text";
+type ButtonSize = "sm" | "md" | "lg";
+interface ButtonProps extends ButtonHTMLAttributes<HTMLButtonElement> {
+    children: ReactNode;
+    variant?: Variant;
+    appearance?: ButtonAppearance;
+    size?: ButtonSize;
+    icon?: ReactNode;
+    loading?: boolean;
+}
+declare const Button: React.ForwardRefExoticComponent<ButtonProps & React.RefAttributes<HTMLButtonElement>>;
+
+interface AlertProps {
+    children: ReactNode;
+    variant?: Variant;
+    className?: string;
+    closeable?: boolean;
+    onDismiss?: () => void;
+}
+declare const Alert: ({ children, variant, className, closeable, onDismiss, }: AlertProps) => React.JSX.Element | null;
+
+interface AlertDialogProps {
+    /** The question the dialog asks. Base makes it the surface's accessible name. */
+    title: ReactNode;
+    /** What the confirmation will do. Base makes it the surface's accessible description. */
+    description?: ReactNode;
+    cancelLabel?: string;
+    confirmLabel: string;
+    /** The action the confirmation performs. It runs before the dialog closes. */
+    onConfirm?: () => void;
+    /**
+     * Runs for every user cancellation — the cancel action and Escape alike — because a keyboard
+     * dismissal is the same decision as pressing the button. A dialog the application closes itself
+     * is not a cancellation and reports through `onOpenChange` only.
+     */
+    onCancel?: () => void;
+    /**
+     * The tone of the confirm action. A confirmation that destroys something says so on the one
+     * control that destroys it — the dialog surface itself never carries semantic color.
+     */
+    confirmVariant?: Variant;
+    className?: string;
+    open?: boolean;
+    defaultOpen?: boolean;
+    /** Base's own open-change callback, event details included. */
+    onOpenChange?: AlertDialog$1.Root.Props["onOpenChange"];
+}
+/**
+ * A dialog that asks one question and requires one answer. Its interaction contract differs from
+ * `Dialog`: it is always modal, an outside press never dismisses it, and Base's default focus
+ * lands on the first tabbable element — the cancel action — so a stray `Enter` cannot destroy
+ * anything. Base owns presence, focus restoration, Escape and the `alertdialog` semantics; the
+ * surface, typography and shape are the same ones `Dialog` uses.
+ */
+declare const AlertDialog: React.ForwardRefExoticComponent<AlertDialogProps & React.RefAttributes<HTMLDivElement>>;
+
+interface AvatarProps extends Omit<ImgHTMLAttributes<HTMLImageElement>, "src" | "alt" | "width" | "height"> {
+    src: string;
+    alt: string;
+    size?: "sm" | "md" | "lg";
+    shape?: "circle" | "rounded";
+}
+declare const Avatar: ({ src, alt, size, shape: shapeRole, className, ...props }: AvatarProps) => React.JSX.Element;
+
+interface BadgeProps extends HTMLAttributes<HTMLSpanElement> {
+    children: ReactNode;
+    variant?: Variant;
+    icon?: ReactNode;
+}
+declare const Badge: ({ children, variant, icon, className, ...props }: BadgeProps) => React.JSX.Element;
+
+interface CardProps extends HTMLAttributes<HTMLDivElement> {
+    children: ReactNode;
+    variant?: Variant;
+}
+declare const Card: ({ children, variant, className, ...props }: CardProps) => React.JSX.Element;
+
+interface CheckboxProps extends Omit<ButtonHTMLAttributes<HTMLButtonElement>, "value" | "type"> {
+    checked?: boolean;
+    defaultChecked?: boolean;
+    onCheckedChange?: Checkbox$1.Root.Props["onCheckedChange"];
+    /** Neither ticked nor unticked. Base UI reports it as `mixed`, not as a ticked box. */
+    indeterminate?: boolean;
+    value?: string;
+    /** The value submitted when the box is unticked. By default a form omits it, as native. */
+    uncheckedValue?: string;
+    readOnly?: boolean;
+    required?: boolean;
+    /** A ref to the hidden `<input>` that participates in the form. */
+    inputRef?: Ref<HTMLInputElement>;
+}
+/**
+ * A ticked, unticked or mixed choice. The ref points at the visible button; the form input Base
+ * UI keeps beside it is reached through `inputRef`.
+ */
+declare const Checkbox: React.ForwardRefExoticComponent<CheckboxProps & React.RefAttributes<HTMLButtonElement>>;
+
+/** The parts every chip has, whichever of its two forms it takes. */
+interface ChipAnatomy {
+    children: ReactNode;
+    variant?: Variant;
+    icon?: ReactNode;
+    className?: string;
+}
+/**
+ * A chip is one of two things, and never both.
+ *
+ * * A **toggle chip** holds a selection. Supplying any of `checked`, `defaultChecked`,
+ *   `onCheckedChange` or `value` makes it a toggle button, and it takes the props of one; inside a
+ *   `ChipGroup` the group owns the value, exactly as it does for any grouped control.
+ * * A **tag** holds no selection and may be dismissed. `onRemove` renders the dismiss control, and
+ *   the tag takes the props of the passive element it is.
+ *
+ * The two cannot be combined: a control that both holds a value and deletes itself is one target
+ * with two meanings, and a toggle is a `<button>` while a tag is a `<span>` containing its dismiss
+ * control — a button cannot legally nest inside a button.
+ */
+type ChipProps = (ChipAnatomy & Omit<ButtonHTMLAttributes<HTMLButtonElement>, "value" | "type"> & {
+    /** The controlled counterpart of `defaultChecked`. */
+    checked?: boolean;
+    defaultChecked?: boolean;
+    /** Fires when the chip's selection changes. Base UI's own callback, event details included. */
+    onCheckedChange?: Toggle.Props<string>["onPressedChange"];
+    /** The chip's identity inside a `ChipGroup`. */
+    value?: string;
+    /** A toggle is a button; it carries no dismiss control. Give the row a `ChipGroup`. */
+    onRemove?: never;
+    removeLabel?: never;
+}) | (ChipAnatomy & HTMLAttributes<HTMLSpanElement> & {
+    /** Renders a dismiss control. */
+    onRemove?: () => void;
+    /**
+     * The dismiss control's accessible name. Defaults to `Remove <text>` when the chip's
+     * children are a string, and to `Remove` otherwise.
+     */
+    removeLabel?: string;
+    /** A tag holds nothing to select. */
+    checked?: never;
+    defaultChecked?: never;
+    onCheckedChange?: never;
+    value?: never;
+    disabled?: never;
+});
+/**
+ * A compact control-sized object: a toggle button that holds a selection, or a tag that carries its
+ * tone in its fill and can be dismissed.
+ *
+ * A toggle is raised and tactile because it is manipulated. A tag is flat because it is only read,
+ * and it is passive in the markup as well: nothing about its own box is interactive, its copy keeps
+ * its normal emphasis while its icon carries the semantic tone, and its only control is the dismiss
+ * one. The ref points at the chip's own element — the button or the tag's span.
+ */
+declare const Chip: React.ForwardRefExoticComponent<ChipProps & React.RefAttributes<HTMLElement>>;
+
+interface ChipGroupProps extends Omit<ToggleGroup$1.Props<string>, "multiple" | "className" | "render"> {
+    children: ReactNode;
+    /**
+     * Whether several chips can be held at once. A filter row usually can, so this defaults to
+     * `true` — the opposite of the primitive's own default, and the one deliberate difference
+     * between this group and a `ToggleGroup`.
+     */
+    multiple?: boolean;
+    /** Styles the group's own row. The chips style themselves. */
+    className?: string;
+}
+/**
+ * A row of chips sharing one value. It is the primitive's group with a chip row's own anatomy:
+ * no track, because a chip is a control in its own right rather than a segment of one — and
+ * Base UI still owns the group value, the roving tab index and the arrow keys.
+ *
+ * A tag inside the group is not a toggle, so it takes no part in the shared value and no part in
+ * the roving focus; its dismiss control is reachable by Tab like any other control.
+ */
+declare const ChipGroup: React.ForwardRefExoticComponent<Omit<ChipGroupProps, "ref"> & React.RefAttributes<HTMLDivElement>>;
+
+interface ComboboxOption {
+    label: string;
+    value: string;
+    disabled?: boolean;
+}
+type ComboboxRootProps = Combobox$1.Root.Props<ComboboxOption>;
+type ComboboxChangeDetails = Parameters<NonNullable<ComboboxRootProps["onValueChange"]>>[1];
+interface ComboboxProps {
+    options: ComboboxOption[];
+    /** The selected option's value, or `null` for no selection. */
+    value?: string | null;
+    defaultValue?: string | null;
+    /**
+     * The selected option's own `value`, so two equal options compare equal even when a caller
+     * rebuilds its options array. Base's event details are passed through unchanged.
+     */
+    onValueChange?: (value: string | null, eventDetails: ComboboxChangeDetails) => void;
+    placeholder?: string;
+    /** Shown in place of the list when the query matches no option. */
+    emptyMessage?: ReactNode;
+    /** Styles the control's own box. The popup and its rows style themselves. */
+    className?: string;
+    /** Custom matching, when the default label search is not what the list needs. */
+    filter?: ((option: ComboboxOption, query: string) => boolean) | null;
+    open?: boolean;
+    defaultOpen?: boolean;
+    /** Base's own open-change callback, event details included. */
+    onOpenChange?: ComboboxRootProps["onOpenChange"];
+    /** The query, when the application controls it. */
+    inputValue?: string;
+    defaultInputValue?: string;
+    /** Base's own input-value callback, event details included. */
+    onInputValueChange?: ComboboxRootProps["onInputValueChange"];
+    /** The control's own id, for a native `<label htmlFor>`. */
+    id?: ComboboxRootProps["id"];
+    /** Highlights the first match as the query narrows, so `Enter` chooses it. */
+    autoHighlight?: boolean;
+    /** Identifies the field when a form is submitted. */
+    name?: string;
+    /** The form that owns the control, when it renders outside it. */
+    form?: string;
+    required?: boolean;
+    readOnly?: boolean;
+    disabled?: boolean;
+}
+/**
+ * A text field that filters a list of options and selects one of them. It is the searchable
+ * sibling of `Select`: the same option shape, the same value contract and the same box, with an
+ * input instead of a trigger. Base UI owns filtering, the listbox semantics, keyboard
+ * interaction, the anchored popup and the hidden form input; Sherick UI owns the field, the row
+ * treatment and the tone of the selected option.
+ *
+ * Filtering is Base's and it is local — an application that needs remote results owns the
+ * fetching, the debounce and the loading state around this control.
+ */
+declare const Combobox: React.ForwardRefExoticComponent<ComboboxProps & React.RefAttributes<HTMLInputElement>>;
+
+declare const edgeTone: {
+    readonly row: "border-sherick-edge/[0.06]";
+    readonly header: "border-sherick-edge/[0.10]";
+    readonly rule: "border-sherick-edge/[0.075]";
+};
+
+/**
+ * Which structural line the divider draws. The three are one tone at three strengths — the line
+ * between the rows of a stacked list, the general break inside a surface, and the rule beneath a
+ * column header — so a caller names the join it is drawing rather than picking an opacity.
+ */
+type DividerWeight = keyof typeof edgeTone;
+interface DividerProps {
+    className?: string;
+    orientation?: "horizontal" | "vertical";
+    /** The weight of the line. `rule` is the general section break. */
+    weight?: DividerWeight;
+}
+declare const Divider: ({ className, orientation, weight }: DividerProps) => React.JSX.Element;
+
+interface SelectOption {
+    label: string;
+    value: string;
+    disabled?: boolean;
+}
+type SelectRootProps = Select$1.Root.Props<string>;
+type SelectChangeDetails = Parameters<NonNullable<SelectRootProps["onValueChange"]>>[1];
+interface SelectProps extends Omit<ButtonHTMLAttributes<HTMLButtonElement>, "value" | "defaultValue"> {
+    options: SelectOption[];
+    variant?: Variant;
+    value?: string | null;
+    defaultValue?: string | null;
+    /** Base's value-change event details are passed through unchanged. */
+    onValueChange?: (value: string | null, eventDetails: SelectChangeDetails) => void;
+    placeholder?: string;
+    readOnly?: boolean;
+    required?: boolean;
+}
+declare const Select: React.ForwardRefExoticComponent<SelectProps & React.RefAttributes<HTMLButtonElement>>;
+
+interface FieldProps extends Omit<ComponentProps<typeof Field$1.Root>, "children" | "className" | "ref"> {
+    /** The field's label. Base UI associates it with the control and names the group. */
+    label?: ReactNode;
+    /** Supporting copy beneath the control. */
+    description?: ReactNode;
+    /**
+     * The message shown while the field is invalid. Its presence is what makes the field invalid,
+     * so an error can never be rendered without the state that explains it. Omit it and Base UI's
+     * own validation message is shown instead.
+     */
+    error?: ReactNode;
+    /**
+     * Renders the required mark beside the label. This is presentational only: the requirement
+     * itself can only be declared by the control, so pass `required` to the control as well —
+     * every example, fixture and test in this repository does.
+     */
+    required?: boolean;
+    /** Styles the field's own column. The control inside styles itself. */
+    className?: string;
+    /**
+     * A Base-backed control that is one control: `Checkbox`, `Slider` or `NumberField`. A
+     * group of controls names itself — `RadioGroup` carries its own label — because the
+     * field's label belongs to the single control it validates.
+     */
+    children: ReactNode;
+}
+/**
+ * Labels and validates one form control. Base UI owns the generated IDs and the
+ * `aria-describedby` / `aria-invalid` wiring; this component owns only the order and the
+ * typography of label, control, description and error.
+ */
+declare const Field: React.ForwardRefExoticComponent<FieldProps & React.RefAttributes<HTMLDivElement>>;
+
+type IconButtonAppearance = "tonal" | "ghost" | "acrylic";
+interface IconButtonProps extends ButtonHTMLAttributes<HTMLButtonElement> {
+    variant?: Variant;
+    appearance?: IconButtonAppearance;
+    icon?: ReactNode;
+    loading?: boolean;
+}
+declare const IconButton: React.ForwardRefExoticComponent<IconButtonProps & React.RefAttributes<HTMLButtonElement>>;
+
+interface InputProps extends InputHTMLAttributes<HTMLInputElement> {
+    label?: ReactNode;
+    description?: ReactNode;
+    error?: boolean;
+    errorMessage?: ReactNode;
+    inputClassName?: string;
+    /** Base's value-change callback, event details included. */
+    onValueChange?: Input$1.Props["onValueChange"];
+}
+declare const Input: React.ForwardRefExoticComponent<InputProps & React.RefAttributes<HTMLInputElement>>;
+
+type DialogContentProps = HTMLAttributes<HTMLDivElement>;
+declare const DialogContent: ({ children, className, ...props }: DialogContentProps) => React.JSX.Element;
+
+type DialogDescriptionProps = ComponentPropsWithoutRef<typeof Dialog$1.Description>;
+declare const DialogDescription: ({ className, ...props }: DialogDescriptionProps) => React.JSX.Element;
+
+interface DialogFooterProps {
+    children: ReactNode;
+    className?: string;
+}
+declare const DialogFooter: ({ children, className }: DialogFooterProps) => React.JSX.Element;
+
+interface DialogHeaderProps {
+    children: ReactNode;
+    className?: string;
+}
+declare const DialogHeader: ({ children, className }: DialogHeaderProps) => React.JSX.Element;
+
+interface DialogProps {
+    children: ReactNode;
+    open?: boolean;
+    defaultOpen?: boolean;
+    /** Base's open-change callback, event details included. */
+    onOpenChange?: Dialog$1.Root.Props["onOpenChange"];
+    className?: string;
+}
+type DialogComponent = ForwardRefExoticComponent<DialogProps & RefAttributes<HTMLDivElement>> & {
+    Header: typeof DialogHeader;
+    Description: typeof DialogDescription;
+    Content: typeof DialogContent;
+    Footer: typeof DialogFooter;
+};
+declare const Dialog: DialogComponent;
+
+interface MenuProps {
+    children: ReactNode;
+    open?: boolean;
+    defaultOpen?: boolean;
+    /** Base's own open-change callback, event details included. */
+    onOpenChange?: Menu$1.Root.Props["onOpenChange"];
+}
+interface MenuTriggerProps {
+    /**
+     * The element the trigger's own props are handed to — usually a Sherick `Button`. The surface
+     * opens from whatever this renders, so the trigger looks like the control it is.
+     */
+    render?: ReactElement;
+    children?: ReactNode;
+    /** Adds to the rendered element. The trigger writes no visual rules of its own. */
+    className?: string;
+}
+interface MenuContentProps {
+    children: ReactNode;
+    /** Adds to the popup's own shell. The sheet's material, shape and elevation are the recipe's. */
+    className?: string;
+    /** The edge the sheet is anchored to. Its entrance grows from whichever edge it resolves to. */
+    side?: OverlaySide;
+    align?: OverlayAlign;
+    sideOffset?: number;
+    alignOffset?: number;
+}
+interface MenuItemProps {
+    children: ReactNode;
+    /** Adds to the row's own shell. */
+    className?: string;
+    /**
+     * The action's semantic role. `danger` marks the action itself — the row's label and its
+     * highlight take the danger tone, and the popup around it stays neutral.
+     */
+    variant?: Variant;
+    /**
+     * An action that cannot be performed. It stays in the list and stays reachable by keyboard — a
+     * disabled command is still one a reader has to be able to find and be told about — but it
+     * cannot be activated, and it takes no hover or press state.
+     */
+    disabled?: boolean;
+    /** What choosing the action does. The menu closes afterwards; that is Base's contract. */
+    onClick?: MouseEventHandler<HTMLDivElement>;
+}
+interface MenuSeparatorProps {
+    className?: string;
+}
+/**
+ * A surface of actions. Each item acts and the menu closes; nothing here holds a value, so a
+ * value-selection surface is `Select` or `Combobox` rather than a menu. Base UI owns keyboard
+ * navigation, typeahead, roving focus, Escape, outside dismissal and focus restoration; Sherick
+ * UI owns the sheet, the row treatment and the tone an action reads in.
+ *
+ * This is the whole of the surface Sherick UI publishes to a consumer: the parts below accept the
+ * capabilities this package supports, not the primitive's complete prop set. Composing a Base
+ * primitive is how these components are built; it is not what they promise.
+ */
+type MenuComponent = ((props: MenuProps) => React.JSX.Element) & {
+    Trigger: typeof MenuTrigger;
+    Content: typeof MenuContent;
+    Item: typeof MenuItem;
+    Separator: typeof MenuSeparator;
+};
+declare const MenuContent: ({ children, className, side, align, sideOffset, alignOffset, }: MenuContentProps) => React.JSX.Element;
+declare const MenuTrigger: ({ ...props }: MenuTriggerProps) => React.JSX.Element;
+declare const MenuItem: {
+    ({ variant, className, children, ...props }: MenuItemProps): React.JSX.Element;
+    displayName: string;
+};
+declare const MenuSeparator: ({ className }: MenuSeparatorProps) => React.JSX.Element;
+declare const Menu: MenuComponent;
+
+interface NavGroupItem {
+    label: string;
+    href: string;
+}
+/** The heading level a group labels itself with. A navigation group owns a real heading, because
+ *  that is what makes a column of destinations scannable as groups; which level it is depends on
+ *  where the navigation sits in the host document, which this component cannot know. */
+type NavGroupHeadingLevel = 1 | 2 | 3 | 4 | 5 | 6;
+interface NavGroupProps {
+    title: string;
+    items: NavGroupItem[];
+    activeHref?: string;
+    /** The heading level the group labels itself with. Choose it from the document it is placed
+     *  in: a group under a page title is a level 2, one in a sidebar section is whatever its
+     *  neighbours are. The default matches the package's other grouped surfaces. */
+    headingLevel?: NavGroupHeadingLevel;
+    className?: string;
+}
+declare const NavGroup: ({ title, items, activeHref, headingLevel, className }: NavGroupProps) => React.JSX.Element;
+
+interface NavItemProps extends AnchorHTMLAttributes<HTMLAnchorElement> {
+    children: ReactNode;
+    href: string;
+    icon?: ReactNode;
+    active?: boolean;
+}
+declare const NavItem: ({ children, icon, className, href, active, ...props }: NavItemProps) => React.JSX.Element;
+
+interface NumberFieldProps extends Omit<ComponentProps<"input">, "value" | "defaultValue" | "onChange" | "min" | "max" | "step" | "type" | "size" | "ref"> {
+    value?: number | null;
+    defaultValue?: number;
+    onValueChange?: NumberField$1.Root.Props["onValueChange"];
+    /** Fires when a change is committed — a stepper released, a value blurred into place. */
+    onValueCommitted?: NumberField$1.Root.Props["onValueCommitted"];
+    min?: number;
+    max?: number;
+    step?: number;
+    disabled?: boolean;
+    readOnly?: boolean;
+    required?: boolean;
+    /** Identifies the field when a form is submitted. */
+    name?: string;
+    form?: string;
+    /** A ref to the hidden `<input type="number">` that participates in the form. */
+    inputRef?: Ref<HTMLInputElement>;
+    /** Styles the field's own container. The text input is styled through `inputClassName`. */
+    className?: string;
+    inputClassName?: string;
+}
+/**
+ * A number typed or stepped. Base UI owns parsing, stepping, clamping, spinbutton semantics and
+ * locale formatting; the ref points at the input, and the hidden form input is `inputRef`.
+ */
+declare const NumberField: React.ForwardRefExoticComponent<NumberFieldProps & React.RefAttributes<HTMLInputElement>>;
+
+interface PopoverProps {
+    children: ReactNode;
+    open?: boolean;
+    defaultOpen?: boolean;
+    /** Base's own open-change callback, event details included. */
+    onOpenChange?: Popover$1.Root.Props["onOpenChange"];
+}
+interface PopoverTriggerProps {
+    /**
+     * The element the trigger's own props are handed to — usually a Sherick `Button`. The surface
+     * opens from whatever this renders, so the trigger looks like the control it is.
+     */
+    render?: ReactElement;
+    children?: ReactNode;
+    /** Adds to the rendered element. The trigger writes no visual rules of its own. */
+    className?: string;
+}
+interface PopoverContentProps {
+    children: ReactNode;
+    /** Adds to the popup's own shell. The sheet's material, shape and elevation are the recipe's. */
+    className?: string;
+    /** The edge the sheet is anchored to. Its entrance grows from whichever edge it resolves to. */
+    side?: OverlaySide;
+    align?: OverlayAlign;
+    sideOffset?: number;
+    alignOffset?: number;
+}
+/**
+ * The anchored surface a control opens to show free-form content. Base UI owns the portal,
+ * anchor positioning, collision handling, outside interaction, Escape and focus restoration;
+ * Sherick UI owns the sheet and the geometry its entrance grows from.
+ *
+ * `Trigger` hands Base's trigger props to whatever the caller renders — usually a Sherick `Button`
+ * through its `render` prop — so the control that opens the surface looks like the control it is.
+ *
+ * This is the whole of the surface Sherick UI publishes to a consumer: the parts below accept the
+ * capabilities this package supports, not the primitive's complete prop set. Composing a Base
+ * primitive is how this component is built; it is not what it promises.
+ */
+type PopoverComponent = ((props: PopoverProps) => React.JSX.Element) & {
+    Trigger: typeof PopoverTrigger;
+    Content: typeof PopoverContent;
+};
+declare const PopoverTrigger: ({ ...props }: PopoverTriggerProps) => React.JSX.Element;
+declare const PopoverContent: ({ children, className, side, align, sideOffset, alignOffset, }: PopoverContentProps) => React.JSX.Element;
+declare const Popover: PopoverComponent;
+
+interface ProgressProps extends Omit<ComponentProps<"div">, "children">, Pick<Progress$1.Root.Props, "min" | "max" | "format" | "locale" | "getAriaValueText"> {
+    /**
+     * How far the work has come. Omit it, or pass `null`, for work whose extent is not known: the
+     * bar then reports that it is working rather than where it is.
+     */
+    value?: number | null;
+    /** The tone of the fill. */
+    variant?: Variant;
+    /** A visible label above the track. Base UI associates it with the bar. */
+    label?: ReactNode;
+    /**
+     * Renders the formatted value opposite the label. A bar with no known value has no value to
+     * show, so nothing is rendered for it while the bar is indeterminate.
+     */
+    showValue?: boolean;
+    /** Styles the bar's own column. The track and the fill style themselves. */
+    className?: string;
+}
+/**
+ * How far along a task has come. Base UI owns the `progressbar` role, the value boundaries, the
+ * percentage and the accessible text; Sherick UI owns the recessed groove, the accent fill and the
+ * sweep an unknown extent reports itself with.
+ */
+declare const Progress: React.ForwardRefExoticComponent<Omit<ProgressProps, "ref"> & React.RefAttributes<HTMLDivElement>>;
+
+interface RadioGroupOption {
+    value: string;
+    label: ReactNode;
+    disabled?: boolean;
+}
+interface RadioGroupProps extends Omit<ComponentProps<"div">, "onChange" | "defaultValue" | "children"> {
+    options: RadioGroupOption[];
+    /** The group's own label. Naming the group is the group's job, not a field's: an
+     *  enclosing `Field` names one control, while every option here is its own control. */
+    label?: ReactNode;
+    value?: string;
+    defaultValue?: string;
+    onValueChange?: RadioGroup$1.Props<string>["onValueChange"];
+    name?: string;
+    form?: string;
+    required?: boolean;
+    disabled?: boolean;
+    readOnly?: boolean;
+    /** A ref to the hidden `<input>` that participates in the form. */
+    inputRef?: Ref<HTMLInputElement>;
+    /** Styles the labelled group. */
+    className?: string;
+}
+/**
+ * One choice out of a list. Base UI owns the value, the roving tab index, the arrow keys,
+ * the name and the form participation; Sherick UI owns the labelled column and the rows.
+ */
+declare const RadioGroup: React.ForwardRefExoticComponent<Omit<RadioGroupProps, "ref"> & React.RefAttributes<HTMLDivElement>>;
+
+interface SearchProps extends InputHTMLAttributes<HTMLInputElement> {
+    onSearch: (value: string) => void;
+    /** Base's value-change callback, event details included. */
+    onValueChange?: Input$1.Props["onValueChange"];
+    variant?: Variant;
+    loading?: boolean;
+    debounceMs?: number;
+    inputClassName?: string;
+}
+declare const Search: React.ForwardRefExoticComponent<SearchProps & React.RefAttributes<HTMLInputElement>>;
+
+interface SegmentedControlOption {
+    value: string;
+    label: ReactNode;
+    /** A mark before the label. The segment's accessible name stays the label. */
+    icon?: ReactNode;
+    disabled?: boolean;
+}
+interface SegmentedControlProps extends Omit<ComponentProps<"div">, "onChange" | "defaultValue" | "children"> {
+    options: SegmentedControlOption[];
+    /** The chosen option. This is the controlled counterpart of `defaultValue`. */
+    value?: string;
+    defaultValue?: string;
+    /**
+     * Fires when another option is chosen. Base UI's own callback, event details included, so the
+     * change it describes can be cancelled before the group commits it.
+     */
+    onValueChange?: (value: string, eventDetails: ToggleGroup$1.ChangeEventDetails) => void;
+    variant?: Variant;
+    disabled?: boolean;
+    /** Styles the control's own track. The segments style themselves. */
+    className?: string;
+}
+/**
+ * One choice out of a few, in a single track. It is a `ToggleGroup` with single selection and an
+ * options array: the primitive owns the group value, the roving tab index and the arrow keys, and
+ * this component decides that the choice is exclusive, that it can never be empty, and how the
+ * options are described.
+ *
+ * "Never empty" is two rules. Left uncontrolled with no `defaultValue`, the control starts on the
+ * first option that is not disabled — so a segmented control is never a row of unselected segments
+ * waiting to be told what they are — and the press that would release the option it already holds
+ * is vetoed rather than committed. A controlled `value` is the caller's to keep inside `options`.
+ *
+ * It names itself the way a tab list does — through `aria-label` / `aria-labelledby` — because it
+ * is one control holding one value rather than a group of labelled controls.
+ */
+declare const SegmentedControl: React.ForwardRefExoticComponent<Omit<SegmentedControlProps, "ref"> & React.RefAttributes<HTMLDivElement>>;
+
+type SkeletonProps = HTMLAttributes<HTMLDivElement>;
+declare const Skeleton: ({ className, "aria-hidden": ariaHidden, ...props }: SkeletonProps) => React.JSX.Element;
+
+interface SliderProps extends Omit<ComponentProps<"div">, "defaultValue" | "onChange" | "children"> {
+    value?: number;
+    defaultValue?: number;
+    onValueChange?: Slider$1.Root.Props<number>["onValueChange"];
+    /** Fires when a change is committed — a drag released, a stepper pressed, a blur. */
+    onValueCommitted?: Slider$1.Root.Props<number>["onValueCommitted"];
+    min?: number;
+    max?: number;
+    step?: number;
+    disabled?: boolean;
+    /** Identifies the field when a form is submitted. */
+    name?: string;
+    form?: string;
+    /** A visible label for the slider, for a slider that is not inside a `Field`. */
+    label?: ReactNode;
+    /** Styles the slider's own column. The handle is styled through `thumbClassName`. */
+    className?: string;
+    thumbClassName?: string;
+    /**
+     * Label props reach the handle, which is the only element a slider can name itself with; every
+     * other prop, `className` included, styles the slider's root.
+     */
+    "aria-label"?: string;
+    "aria-labelledby"?: string;
+}
+/**
+ * A single handle on a groove. The ref points at the handle, which is the part a user grabs.
+ */
+declare const Slider: React.ForwardRefExoticComponent<Omit<SliderProps, "ref"> & React.RefAttributes<HTMLDivElement>>;
+
+declare const spinnerVariants: (props?: ({
+    show?: boolean | null | undefined;
+} & class_variance_authority_types.ClassProp) | undefined) => string;
+declare const loaderVariants: (props?: ({
+    size?: "small" | "medium" | "large" | null | undefined;
+} & class_variance_authority_types.ClassProp) | undefined) => string;
+interface SpinnerProps extends VariantProps<typeof spinnerVariants>, VariantProps<typeof loaderVariants> {
+    className?: string;
+    children?: React.ReactNode;
+}
+declare function Spinner({ size, show, children, className }: SpinnerProps): React.JSX.Element;
+
+interface SwitchProps extends Omit<ButtonHTMLAttributes<HTMLButtonElement>, "value"> {
+    checked?: boolean;
+    defaultChecked?: boolean;
+    /** Base's checked-change callback, event details included. */
+    onCheckedChange?: Switch$1.Root.Props["onCheckedChange"];
+    variant?: Variant;
+    value?: string;
+    uncheckedValue?: string;
+    readOnly?: boolean;
+    required?: boolean;
+    inputRef?: Ref<HTMLInputElement>;
+}
+declare const Switch: React.ForwardRefExoticComponent<SwitchProps & React.RefAttributes<HTMLButtonElement>>;
+
+type TabsChangeDetails = Parameters<NonNullable<Tabs$1.Root.Props["onValueChange"]>>[1];
+interface Tab {
+    id: string;
+    label: string;
+    content: ReactNode;
+    disabled?: boolean;
+}
+interface TabsProps {
+    tabs: Tab[];
+    variant?: Variant;
+    className?: string;
+    value?: string;
+    defaultValue?: string;
+    /** Base's value-change event details are passed through unchanged. */
+    onValueChange?: (tabId: string, eventDetails: TabsChangeDetails) => void;
+    ariaLabel?: string;
+}
+declare const Tabs: ({ tabs, variant, className, value, defaultValue, onValueChange, ariaLabel, }: TabsProps) => React.JSX.Element | null;
+
+interface ToggleGroupProps extends Omit<ToggleGroup$1.Props<string>, "className" | "render"> {
+    /** Styles the group's own track. The segments style themselves. */
+    className?: string;
+}
+interface ToggleGroupItemProps extends Omit<Toggle.Props<string>, "value" | "children" | "className" | "pressed" | "defaultPressed" | "render" | "style"> {
+    /** The item's identity in the group. Base UI requires it on every grouped toggle. */
+    value: string;
+    children: ReactNode;
+    /** The tone the segment takes once it is selected. */
+    variant?: Variant;
+    /** Styles the segment's own box. */
+    className?: string;
+}
+/**
+ * One option in a `ToggleGroup`. Segments are equal objects in one groove: unselected they show
+ * the track through, and the selected one takes the selected tone and rises out of it.
+ */
+declare const ToggleGroupItem: React.ForwardRefExoticComponent<Omit<ToggleGroupItemProps, "ref"> & React.RefAttributes<HTMLButtonElement>>;
+type ToggleGroupComponent = ForwardRefExoticComponent<ToggleGroupProps & RefAttributes<HTMLDivElement>> & {
+    Item: typeof ToggleGroupItem;
+};
+/**
+ * A set of toggle buttons sharing one value. Base UI owns the roving tab index, the arrow keys,
+ * the group value and whether one or several segments can be held; Sherick UI owns the recessed
+ * track and the raised selected segment.
+ *
+ * `SegmentedControl` is the single-choice form of this object with an options array — it renders
+ * this group and its items rather than a second implementation.
+ */
+declare const ToggleGroup: ToggleGroupComponent;
+
+interface TableProps {
+    headers: string[];
+    rows: ReactNode[][];
+    className?: string;
+}
+declare const Table: ({ headers, rows, className, }: TableProps) => React.JSX.Element;
+
+interface TextareaProps extends TextareaHTMLAttributes<HTMLTextAreaElement> {
+    label?: ReactNode;
+    description?: ReactNode;
+    error?: boolean;
+    errorMessage?: ReactNode;
+    textareaClassName?: string;
+    /** Base's value-change callback, event details included. */
+    onValueChange?: ComponentProps<typeof Field$1.Control>["onValueChange"];
+}
+declare const Textarea: React.ForwardRefExoticComponent<TextareaProps & React.RefAttributes<HTMLTextAreaElement>>;
+
+interface TooltipProps {
+    children: ReactElement;
+    content: ReactNode;
+    className?: string;
+    position?: "top" | "right" | "bottom" | "left";
+}
+declare const Tooltip: ({ children, content, className, position }: TooltipProps) => React.JSX.Element;
+
+/**
+ * Where a viewport-owning surface is attached. `center` is a dialog: it has no edge, so it rises
+ * into the middle of the viewport and takes the modal presence. Every other value is a sheet
+ * attached to that edge of the viewport, and slides out of it.
+ */
+type DialogAttachment = "center" | "bottom" | "top" | "left" | "right";
+
+/**
+ * The viewport edge a sheet is attached to. Sides are **physical** rather than logical: the
+ * contract places the sheet against that edge of the screen rather than resolving a writing
+ * direction the component cannot see, so a direction-sensitive placement is the consumer's own
+ * `dir`-aware arrangement rather than an inferred one.
+ */
+type DrawerSide = Exclude<DialogAttachment, "center">;
+interface DrawerProps {
+    children: ReactNode;
+    open?: boolean;
+    defaultOpen?: boolean;
+    /** Base's own open-change callback, event details included. */
+    onOpenChange?: Dialog$1.Root.Props["onOpenChange"];
+    /** The edge the sheet is attached to. */
+    side?: DrawerSide;
+}
+interface DrawerTriggerProps {
+    /**
+     * The element the trigger's own props are handed to — usually a Sherick `Button`. The sheet
+     * opens from whatever this renders, so the control that opens it looks like the control it is.
+     */
+    render?: ReactElement;
+    children?: ReactNode;
+    /** Adds to the rendered element. The trigger writes no visual rules of its own. */
+    className?: string;
+}
+interface DrawerContentProps {
+    children: ReactNode;
+    /** Adds to the sheet's own surface. Its shell, elevation and presence are the recipe's. */
+    className?: string;
+}
+interface DrawerHeaderProps {
+    children: ReactNode;
+    className?: string;
+}
+interface DrawerDescriptionProps {
+    children: ReactNode;
+    className?: string;
+}
+interface DrawerFooterProps {
+    children: ReactNode;
+    className?: string;
+}
+type DrawerComponent = ((props: DrawerProps) => React.JSX.Element) & {
+    Trigger: typeof DrawerTrigger;
+    Content: typeof DrawerContent;
+    Header: typeof DrawerHeader;
+    Description: typeof DrawerDescription;
+    Footer: typeof DrawerFooter;
+    Close: typeof DrawerClose;
+};
+declare const DrawerTrigger: ({ ...props }: DrawerTriggerProps) => React.JSX.Element;
+/**
+ * The sheet itself: the plane behind it, the viewport, the edge-attached surface, and the
+ * dismissal control every sheet carries. Base UI — through the same dialog root a `Dialog` uses —
+ * owns the portal, focus trapping and restoration, document scroll locking, Escape and outside
+ * dismissal; Sherick UI owns the surface and how it slides out of its edge.
+ *
+ * It is a `Dialog` that changed its attachment: there is no second modal system here, so a sheet
+ * traps focus, restores it, locks the page and dismisses exactly as a dialog does. Use a `Dialog`
+ * when the surface has no edge.
+ */
+declare const DrawerContent: ({ children, className }: DrawerContentProps) => React.JSX.Element;
+declare const DrawerHeader: ({ children, className }: DrawerHeaderProps) => React.JSX.Element;
+declare const DrawerDescription: ({ children, className }: DrawerDescriptionProps) => React.JSX.Element;
+declare const DrawerFooter: ({ children, className }: DrawerFooterProps) => React.JSX.Element;
+declare const DrawerClose: (props: ComponentProps<typeof Dialog$1.Close>) => React.JSX.Element;
+/**
+ * A surface attached to one edge of the viewport: a bottom sheet, a side panel, a top drawer. It
+ * is a `Dialog` with an edge rather than a second kind of modal — the same root, the same scrim,
+ * the same focus trapping and restoration, the same Escape and outside dismissal, the same
+ * document scroll locking and the same portal — and only the placement and the direction the
+ * surface arrives from differ.
+ *
+ * Compose a `Drawer.Trigger` and a `Drawer.Content`; the header, description and footer parts
+ * mirror a `Dialog`'s, because it is the same surface.
+ */
+declare const Drawer: DrawerComponent;
+
+/**
+ * What a toast is reporting. The type lands on the toast's mark and its tone — never on the surface,
+ * which stays neutral so the copy is still read at its normal emphasis.
+ */
+type ToastType = "info" | "success" | "warning" | "danger";
+/** The corner the stack grows from, named by its **inline** ends. */
+type ToastPosition = "bottom-end" | "bottom-start" | "top-end" | "top-start";
+/** What choosing a toast's action does. */
+interface ToastActionOptions {
+    children: ReactNode;
+    onClick?: MouseEventHandler<HTMLButtonElement>;
+}
+/**
+ * Everything a toast can be raised with. This is the whole of what this package's renderer
+ * supports: Base's own add-options also carry a positioner, a custom data bag and its internal
+ * presence state, and none of those exist here — a toast is always stacked, never anchored.
+ */
+interface ToastOptions {
+    /**
+     * Identifies the toast. Raising one with an id that already exists updates it in place and
+     * restarts its auto-dismiss timer instead of stacking a duplicate.
+     */
+    id?: string;
+    /** What it is reporting. */
+    type?: ToastType;
+    title?: ReactNode;
+    description?: ReactNode;
+    /** How long it stays before dismissing itself. `0` keeps it until it is dismissed. */
+    timeout?: number;
+    /** How urgently it is announced. `high` interrupts rather than waiting its turn. */
+    priority?: "low" | "high";
+    /** The one control in the toast that does something. */
+    actionProps?: ToastActionOptions;
+    /** Runs when the toast is dismissed. */
+    onClose?: () => void;
+    /** Runs once the toast has left the stack, after its exit has finished. */
+    onRemove?: () => void;
+}
+/** What `update` takes: the same contract as raising one, without an id to identify it by. */
+type ToastUpdateOptions = Omit<ToastOptions, "id">;
+/** The three states one promise is reported through. Each is a line or a change to the toast. */
+interface ToastPromiseOptions<Value> {
+    loading: string | ToastUpdateOptions;
+    success: string | ToastUpdateOptions | ((result: Value) => string | ToastUpdateOptions);
+    error: string | ToastUpdateOptions | ((error: unknown) => string | ToastUpdateOptions);
+}
+/**
+ * The handle for raising toasts. It is deliberately narrow: Base's own manager object also exposes
+ * a subscriber channel for its store, which is internal machinery rather than a capability this
+ * package promises to hold steady.
+ */
+interface ToastManager {
+    /** Raises a toast and returns its id. */
+    add: (options: ToastOptions) => string;
+    /** Changes a toast that is already on screen. */
+    update: (id: string, options: ToastUpdateOptions) => void;
+    /** Dismisses one toast, or every toast when no id is given. */
+    close: (id?: string) => void;
+    /**
+     * Reports one promise through one toast: it arrives as `loading`, and becomes `success` or
+     * `error` when the promise settles. The returned promise resolves with the caller's own value,
+     * so an existing `.then` chain keeps working.
+     */
+    promise: <Value>(promise: Promise<Value>, options: ToastPromiseOptions<Value>) => Promise<Value>;
+}
+interface ToastProviderProps {
+    children: ReactNode;
+    /**
+     * How many toasts are shown at once. A toast past the limit stays mounted but is marked
+     * `limited`, so it can retire rather than be dropped.
+     */
+    limit?: number;
+    /** How long a toast stays before dismissing itself. `0` keeps it until it is dismissed. */
+    timeout?: number;
+    /** A manager built with `createToastManager`, for raising a toast from outside React. */
+    manager?: ToastManager;
+}
+interface ToastViewportProps {
+    /** The corner the stack grows from. It is also the edge a toast enters and leaves through. */
+    position?: ToastPosition;
+    /** Adds to the viewport's own layer. The toasts style themselves. */
+    className?: string;
+}
+/**
+ * Supplies the queue a toast is raised into. Wrap the application: a toast is raised by calling
+ * `useToast` anywhere beneath this, or by handing `createToastManager`'s manager in as `manager`
+ * so code outside React can raise one too.
+ *
+ * Base UI owns the whole lifecycle — the queue and its limit, the auto-dismiss timer, the live
+ * region and its priority, swipe dismissal and the stack's own state; Sherick UI owns the surface
+ * and how the stack moves.
+ */
+declare const ToastProvider: ({ children, manager, ...props }: ToastProviderProps) => React.JSX.Element;
+/**
+ * The stack, and the only place a toast is rendered. Put one inside `ToastProvider` at the root of
+ * the application: `useToast().add(...)` raises a toast, and this renders every toast the manager
+ * is holding. Base provides F6 entry and focus restoration; the live region remains available
+ * while a modal is open. Keep the keyboard shortcut discoverable without reimplementing it.
+ */
+declare const ToastViewport: ({ position, className }: ToastViewportProps) => React.JSX.Element;
+/**
+ * Raises, updates and closes toasts from inside the React tree. The handle is stable for as long as
+ * the provider is, so it can be listed as a dependency without churning an effect.
+ */
+declare const useToast: () => ToastManager;
+/**
+ * Builds a manager that lives outside the React tree, so a plain function — a fetch wrapper, an
+ * error boundary, a route loader — can raise a toast. Hand it to `ToastProvider`'s `manager` so the
+ * same viewport renders what it raises.
+ */
+declare const createToastManager: () => ToastManager;
+
+interface DirectionProviderProps {
+    /** Match the document's `dir` attribute. This provider adds no DOM element. */
+    direction: "ltr" | "rtl";
+    children: ReactNode;
+}
+/** Declares writing direction to the interaction and positioning primitives, including portals. */
+declare const DirectionProvider: ({ direction, children }: DirectionProviderProps) => React.JSX.Element;
+
+export { Accordion, Alert, AlertDialog, Avatar, Badge, Button, Card, Checkbox, Chip, ChipGroup, Collapsible, Combobox, Dialog, DirectionProvider, Divider, Drawer, Field, IconButton, Input, Menu, NavGroup, NavItem, NumberField, Popover, Progress, RadioGroup, Search, SegmentedControl, Select, Skeleton, Slider, Spinner, Switch, Table, Tabs, Textarea, ToastProvider, ToastViewport, ToggleGroup, Tooltip, createToastManager, useToast };
+export type { AccordionHeadingLevel, AccordionItemProps, AccordionPanelProps, AccordionProps, AccordionTriggerProps, AlertDialogProps, AlertProps, AvatarProps, BadgeProps, ButtonAppearance, ButtonProps, ButtonSize, CardProps, CheckboxProps, ChipGroupProps, ChipProps, CollapsiblePanelProps, CollapsibleProps, CollapsibleTriggerProps, ComboboxOption, ComboboxProps, DialogContentProps, DialogDescriptionProps, DialogFooterProps, DialogHeaderProps, DialogProps, DirectionProviderProps, DividerProps, DividerWeight, DrawerContentProps, DrawerDescriptionProps, DrawerFooterProps, DrawerHeaderProps, DrawerProps, DrawerSide, DrawerTriggerProps, FieldProps, IconButtonAppearance, IconButtonProps, InputProps, MenuContentProps, MenuItemProps, MenuProps, MenuSeparatorProps, MenuTriggerProps, NavGroupHeadingLevel, NavGroupItem, NavGroupProps, NavItemProps, NumberFieldProps, OverlayAlign, OverlaySide, PopoverContentProps, PopoverProps, PopoverTriggerProps, ProgressProps, RadioGroupOption, RadioGroupProps, SearchProps, SegmentedControlOption, SegmentedControlProps, SelectOption, SelectProps, SkeletonProps, SliderProps, SpinnerProps, SwitchProps, Tab, TableProps, TabsProps, TextareaProps, ToastActionOptions, ToastManager, ToastOptions, ToastPosition, ToastPromiseOptions, ToastProviderProps, ToastType, ToastUpdateOptions, ToastViewportProps, ToggleGroupItemProps, ToggleGroupProps, TooltipProps, Variant };