@sableui/react 0.10.0 → 0.12.0

package/dist/index.d.ts

@@ -9,11 +9,12 @@ export { AspectBox, AspectBoxProps, Bleed, BleedProps, Breakpoint, Center, Cente
 export { Icon, IconContextValue, IconProps, IconProvider, IconProviderProps, composeIconSets, useIconSet } from './icon/index.js';
 export { a as IconRenderProps, I as IconSet, b as IconVariant } from './registry-CyL28OzJ.js';
 import * as react from 'react';
-import { ReactNode, ComponentPropsWithoutRef, ElementType, ReactElement, Ref, ComponentPropsWithRef, MouseEvent, ComponentProps, FormEvent } from 'react';
+import { ReactNode, ComponentPropsWithoutRef, ElementType, ReactElement, Ref, ComponentPropsWithRef, MouseEvent, ComponentProps, AriaAttributes, FormEvent } from 'react';
 import { VariantProps } from 'class-variance-authority';
 import { useRender } from '@base-ui/react/use-render';
 import * as class_variance_authority_types from 'class-variance-authority/types';
 import * as _base_ui_react from '@base-ui/react';
+import { Menu as Menu$1 } from '@base-ui/react/menu';
 import { AlertDialog as AlertDialog$1 } from '@base-ui/react/alert-dialog';
 import { Dialog as Dialog$1 } from '@base-ui/react/dialog';
 import { Separator as Separator$1 } from '@base-ui/react/separator';
@@ -33,7 +34,8 @@ import { Radio as Radio$1 } from '@base-ui/react/radio';
 import { RadioGroup as RadioGroup$1 } from '@base-ui/react/radio-group';
 import { Select as Select$1 } from '@base-ui/react/select';
 import { Popover as Popover$1 } from '@base-ui/react/popover';
-import { Menu as Menu$1 } from '@base-ui/react/menu';
+import { NavigationMenu as NavigationMenu$1 } from '@base-ui/react/navigation-menu';
+import { Menubar as Menubar$1 } from '@base-ui/react/menubar';
 import { Drawer } from '@base-ui/react/drawer';
 import { DayPickerProps } from 'react-day-picker';
 import { Toast } from '@base-ui/react/toast';
@@ -422,6 +424,36 @@ declare namespace Button {
 
 declare const buttonMeta: ComponentMeta;
 
+type ButtonGroupProps = ComponentPropsWithRef<"div">;
+/**
+ * Buttons joined into one control — a split button ("Copy page" beside the
+ * chevron that opens its menu), or a short run of related actions.
+ *
+ *   <ButtonGroup aria-label="Page actions">
+ *     <Button variant="outline" size="sm">Copy page</Button>
+ *     <Menu>
+ *       <MenuTrigger render={<Button variant="outline" size="icon-sm" aria-label="More actions" />}>
+ *         <Icon name="chevron-down" />
+ *       </MenuTrigger>
+ *       …
+ *     </Menu>
+ *   </ButtonGroup>
+ *
+ * The children stay ordinary Buttons, each with its own variant and size; the
+ * group only joins them. It squares the inner corners through the per-side
+ * radius vars Button reads (`--button-radius-s` / `-e`), so the outer corners
+ * keep the theme's button shape. Bordered buttons overlap by their hairline so
+ * the seam is one line, not two; filled and ghost buttons get a hairline seam
+ * in their own ink, which reads on any fill. A focused child is raised so its
+ * ring is not clipped by its neighbour.
+ *
+ * Give every child the same height (`sm` with `icon-sm`, `md` with `icon`):
+ * the group aligns them but cannot reconcile two heights into one edge.
+ */
+declare function ButtonGroup({ className, role, ...props }: ButtonGroupProps): react.JSX.Element;
+
+declare const buttonGroupMeta: ComponentMeta;
+
 interface CardProps extends ComponentPropsWithRef<"div"> {
     /** "default" = raised surface (bg-card + edge + soft shadow). "flat" = transparent. */
     variant?: "default" | "flat";
@@ -536,6 +568,303 @@ declare function CardFooter({ actions, className, children, ...props }: CardFoot
 
 declare const cardMeta: ComponentMeta;
 
+/** A character that opens suggestions at the caret: `@` for people, `/` for commands. */
+interface CaretTrigger {
+    /** The character typed to open suggestions, e.g. `"@"`, `"/"`, `"#"`, `":"`. */
+    char: string;
+    /**
+     * Only at the start of the field (leading whitespace allowed), as a slash
+     * command is: `/sum` at the start opens, `and/or` mid-sentence does not.
+     * @default false
+     */
+    atStart?: boolean;
+    /**
+     * Let the query hold spaces, for multi-word names (`@Sam Riv`). Off, a
+     * space ends the query and closes suggestions, which is what a command
+     * wants. A newline always ends it.
+     * @default false
+     */
+    allowSpaces?: boolean;
+    /** Close once the query grows past this many characters. @default 32 */
+    maxQueryLength?: number;
+}
+/** The trigger the caret is inside, and what has been typed after it. */
+interface CaretTriggerMatch {
+    /** The trigger that matched, as passed in. */
+    trigger: CaretTrigger;
+    /** The text typed after the trigger character, up to the caret. */
+    query: string;
+    /** Index of the trigger character in the field's value. */
+    start: number;
+    /** Index just past the query (the caret). `replace()` swaps `start…end`. */
+    end: number;
+}
+type CaretTriggerField = HTMLTextAreaElement | HTMLInputElement;
+interface UseCaretTriggerOptions {
+    /** The characters that open suggestions. */
+    triggers: CaretTrigger[];
+}
+interface UseCaretTriggerResult {
+    /**
+     * Attach to the text field: `ref` on Textarea or Input, `fieldRef` on
+     * ChatComposer. To keep a ref of your own as well, merge the two.
+     */
+    fieldRef: (node: CaretTriggerField | null) => void;
+    /** The attached field, once mounted. CaretMenu listens to its keys. */
+    field: CaretTriggerField | null;
+    /** The open trigger and its query, or null when suggestions are closed. */
+    match: CaretTriggerMatch | null;
+    /**
+     * The caret's box at the trigger character, in viewport coordinates, for
+     * anchoring a popup. Measured on demand (it moves when the field scrolls).
+     */
+    getAnchorRect: () => DOMRect | null;
+    /**
+     * Swap the trigger and its query for `text`: `"@Sam Rivera "` for a
+     * mention, `""` to clear a slash command after running it. Goes through the
+     * field's own input path, so a controlled value updates and undo works.
+     */
+    replace: (text: string) => void;
+    /** Close suggestions for this trigger until the caret leaves it. Escape does this. */
+    dismiss: () => void;
+}
+/**
+ * Watch a plain text field for a trigger character at the caret — `@` for a
+ * mention, `/` for a command — and report what has been typed after it.
+ *
+ * Headless, and the value stays a string: a mention becomes text in the
+ * message (`@Sam Rivera`), not a token. That is what a textarea can hold, and
+ * it covers slash commands entirely and mentions as most chat apps send them.
+ * Chips inside the field need a rich-text editor, which Sable does not own
+ * (`sable docs extending-a-component`). Pair it with CaretMenu for the list.
+ *
+ *   const trigger = useCaretTrigger({ triggers: [{ char: "@", allowSpaces: true }, { char: "/", atStart: true }] })
+ *   <ChatComposer fieldRef={trigger.fieldRef} … />
+ *   <CaretMenu trigger={trigger} label="Suggestions">…</CaretMenu>
+ *
+ * The rules a trigger follows, each one a bug in a naive version:
+ *
+ * - **Word boundary.** The character opens suggestions only at the start of
+ *   the field or after whitespace or an opening bracket, so `ana@example.com`
+ *   and `and/or` stay text.
+ * - **Caret, not value.** The match is read at the caret, so moving the caret
+ *   out of `@sam` (arrow keys, a click elsewhere) closes it and moving back
+ *   reopens it. A selection (not a bare caret) never matches.
+ * - **Composition.** While an IME is composing, the value is provisional; the
+ *   match updates on `compositionend`, not on every candidate.
+ * - **Dismissal sticks.** Escape closes this trigger until the caret leaves it
+ *   or its character is deleted. Re-reading the value must not reopen it on
+ *   the next keystroke.
+ */
+declare function useCaretTrigger({ triggers }: UseCaretTriggerOptions): UseCaretTriggerResult;
+
+/**
+ * Menu — themed dropdown over Base UI's Menu (roving focus, typeahead, ARIA
+ * menu/menuitem wiring, collision-aware positioning, Esc/outside dismissal all
+ * come from Base UI). Compose:
+ *
+ *   <Menu>
+ *     <MenuTrigger render={<Button variant="secondary">Options</Button>} />
+ *     <MenuContent>
+ *       <MenuItem>Edit</MenuItem>
+ *       <MenuItem>Duplicate</MenuItem>
+ *       <MenuSeparator />
+ *       <MenuGroup>
+ *         <MenuGroupLabel>Danger</MenuGroupLabel>
+ *         <MenuItem>Delete</MenuItem>
+ *       </MenuGroup>
+ *     </MenuContent>
+ *   </Menu>
+ *
+ * State surfaces via Base UI data-attributes: data-[highlighted] (active item),
+ * data-[disabled], and data-[starting-style]/data-[ending-style] (open/close).
+ */
+declare const Menu: <Payload>(props: Menu$1.Root.Props<Payload>) => react.JSX.Element;
+declare const MenuTrigger: Menu$1.Trigger;
+declare const MenuPortal: {
+    (props: Omit<_base_ui_react.ContextMenuPortalProps, "ref"> & react.RefAttributes<HTMLDivElement>): react.JSX.Element;
+    displayName: string;
+};
+type PositionerProps$6 = ComponentProps<typeof Menu$1.Positioner>;
+type ContentProps$8 = Omit<ComponentProps<typeof Menu$1.Popup>, "className"> & {
+    className?: string;
+    /** Which side of the trigger to render against. @default "bottom" */
+    side?: PositionerProps$6["side"];
+    /** Alignment along the chosen side. @default "start" */
+    align?: PositionerProps$6["align"];
+    /** Gap between trigger and popup, in px. @default 6 */
+    sideOffset?: PositionerProps$6["sideOffset"];
+};
+/**
+ * The dropdown surface. Composes Portal + Positioner + Popup so callers pass a
+ * single element. Defaults to the `bottom` side, `start` aligned, 6px offset.
+ */
+declare function MenuContent({ className, children, side, align, sideOffset, ...props }: ContentProps$8): react.JSX.Element;
+type ItemContent = {
+    /** A leading icon. Beside a `description` it sits in a small tile spanning both lines. */
+    icon?: ReactNode;
+    /**
+     * A second, quieter line under the label: what the action does, where a
+     * label alone is ambiguous ("Copy page" → "Copy page as Markdown for LLMs").
+     */
+    description?: ReactNode;
+};
+type ItemProps$5 = Omit<ComponentProps<typeof Menu$1.Item>, "className"> & ItemContent & {
+    className?: string;
+    /**
+     * `destructive` for an action that deletes or cannot be undone. It keeps the
+     * destructive ink when highlighted — the default highlight repaints the row
+     * in accent ink, which hid the warning exactly when the row was targeted —
+     * and washes the highlight in the destructive tone instead.
+     * @default "default"
+     */
+    variant?: "default" | "destructive";
+};
+/** A single interactive row. Highlights via Base UI's data-[highlighted]. */
+declare function MenuItem({ className, variant, icon, description, children, ...props }: ItemProps$5): react.JSX.Element;
+type LinkItemProps = Omit<ComponentProps<typeof Menu$1.LinkItem>, "className"> & ItemContent & {
+    className?: string;
+};
+/**
+ * A row that navigates: a real `<a>`, so it opens in a new tab, middle-clicks
+ * and copies as a link, which a MenuItem with an onClick cannot. Pass `href`,
+ * and `target="_blank"` for a page outside the app; the row then marks itself
+ * as leaving with a trailing ↗.
+ */
+declare function MenuLinkItem({ className, icon, description, children, target, ...props }: LinkItemProps): react.JSX.Element;
+type SeparatorProps$3 = Omit<ComponentProps<typeof Menu$1.Separator>, "className"> & {
+    className?: string;
+};
+/** A hairline rule between item runs. Bleeds past the popup padding. */
+declare function MenuSeparator({ className, ...props }: SeparatorProps$3): react.JSX.Element;
+type GroupProps$3 = Omit<ComponentProps<typeof Menu$1.Group>, "className"> & {
+    className?: string;
+};
+/** Groups related items with a label for screen readers. */
+declare function MenuGroup({ className, ...props }: GroupProps$3): react.JSX.Element;
+type GroupLabelProps$3 = Omit<ComponentProps<typeof Menu$1.GroupLabel>, "className"> & {
+    className?: string;
+};
+/** The label for a MenuGroup. Auto-associated with the group it sits in. */
+declare function MenuGroupLabel({ className, ...props }: GroupLabelProps$3): react.JSX.Element;
+/**
+ * A nested menu. Wraps a `MenuSubmenuTrigger` and its own `MenuContent`:
+ *
+ *   <MenuSubmenu>
+ *     <MenuSubmenuTrigger>Effort</MenuSubmenuTrigger>
+ *     <MenuContent side="inline-end" align="start">…</MenuContent>
+ *   </MenuSubmenu>
+ *
+ * `side="inline-end"` rather than `"right"` so the submenu opens away from the
+ * parent in RTL as well as LTR — Base UI flips it at the collision boundary
+ * either way, but starting on the correct side avoids a flip on every open.
+ */
+declare const MenuSubmenu: typeof Menu$1.SubmenuRoot;
+type SubmenuTriggerProps = Omit<ComponentProps<typeof Menu$1.SubmenuTrigger>, "className"> & {
+    className?: string;
+    /** Trailing value shown before the chevron — the current choice, usually. */
+    value?: ComponentProps<"span">["children"];
+};
+/**
+ * The row that opens a submenu. Styled as a MenuItem plus a trailing chevron,
+ * and optionally the current `value` — which is what lets a settings menu read
+ * as `Effort   High ›` rather than making the reader open each row to find out
+ * what is set.
+ */
+declare function MenuSubmenuTrigger({ className, children, value, ...props }: SubmenuTriggerProps): react.JSX.Element;
+/**
+ * A single-choice group inside a menu. Controlled via `value`/`onValueChange`,
+ * uncontrolled via `defaultValue`.
+ */
+declare const MenuRadioGroup: react.NamedExoticComponent<Omit<_base_ui_react.ContextMenuRadioGroupProps, "ref"> & react.RefAttributes<HTMLDivElement>>;
+type RadioItemProps = Omit<ComponentProps<typeof Menu$1.RadioItem>, "className"> & {
+    className?: string;
+};
+/**
+ * One option in a MenuRadioGroup. The check sits in a reserved leading column
+ * rather than appearing and disappearing with the selection — otherwise every
+ * label shifts sideways as the reader moves the highlight, which is the exact
+ * thing a menu of options must not do.
+ */
+declare function MenuRadioItem({ className, children, ...props }: RadioItemProps): react.JSX.Element;
+type CheckboxItemProps = Omit<ComponentProps<typeof Menu$1.CheckboxItem>, "className"> & {
+    className?: string;
+};
+/**
+ * A toggling row. Same reserved leading column as MenuRadioItem, so a menu
+ * mixing the two keeps one text margin.
+ */
+declare function MenuCheckboxItem({ className, children, ...props }: CheckboxItemProps): react.JSX.Element;
+
+interface CaretMenuProps {
+    /** The result of `useCaretTrigger`, attached to the field the suggestions are for. */
+    trigger: UseCaretTriggerResult;
+    /** The list's accessible name, e.g. "People" or "Commands". */
+    label: string;
+    /**
+     * A row under the items for what the list is doing: "Searching…", "No one
+     * matches", "Couldn't load people". It is also announced, politely, in place
+     * of the suggestion count. With no items and no status the menu stays shut.
+     */
+    status?: ReactNode;
+    /** `CaretMenuItem`s, already filtered for `trigger.match.query`. */
+    children?: ReactNode;
+    /** Layout classes for the popup (a width, say). */
+    className?: string;
+}
+/**
+ * CaretMenu — suggestions at the caret of a text field, for mentions and slash
+ * commands. Pair it with `useCaretTrigger`, which watches the field; this draws
+ * the list beside the trigger and drives it from the field's keys.
+ *
+ *   const trigger = useCaretTrigger({ triggers: [{ char: "@", allowSpaces: true }] })
+ *   const q = trigger.match?.query.toLowerCase() ?? ""
+ *   <Textarea ref={trigger.fieldRef} … />
+ *   <CaretMenu trigger={trigger} label="People">
+ *     {people.filter((p) => p.name.toLowerCase().includes(q)).map((p) => (
+ *       <CaretMenuItem key={p.id} onSelect={() => trigger.replace(`@${p.name} `)}>{p.name}</CaretMenuItem>
+ *     ))}
+ *   </CaretMenu>
+ *
+ * **Focus never leaves the field.** That is the whole interaction: the person
+ * is typing, and a list that took focus would eat the next keystroke. So the
+ * field carries the list's semantics and the popup is only ever pointed at:
+ *
+ * - An `<input>` becomes the ARIA combobox it is (`role="combobox"`,
+ *   `aria-expanded`). A `<textarea>` keeps its textbox role, because
+ *   `combobox` would lose `aria-multiline` and screen readers would stop
+ *   treating it as a place to write paragraphs. A textbox may not carry
+ *   `aria-expanded`, so for both, opening is also announced through a polite
+ *   status ("3 suggestions"), mounted from the start so it is heard.
+ * - Both get `aria-autocomplete="list"`, `aria-controls` (the listbox) and
+ *   `aria-activedescendant` (the highlighted option), which is how a screen
+ *   reader follows the arrow keys without focus moving.
+ * - ↑/↓ move the highlight, Enter or Tab pick it, Escape closes the list and
+ *   stays out of the way of a Dialog's own Escape. Shift+Enter is left alone,
+ *   so a line break is still a line break.
+ * - Rows keep focus where it is on pointer down, so clicking one does not blur
+ *   the field (which would close the list before the click lands).
+ *
+ * Positioned by hand at the caret rather than through a Base UI positioner:
+ * every Base UI popup manages focus, and this one must never take it. It
+ * flips above the caret when there is more room there, caps its height to the
+ * room it has, and keeps clear of the viewport's edges.
+ */
+declare function CaretMenu({ trigger, label, status, children, className }: CaretMenuProps): react.JSX.Element;
+type CaretMenuItemProps = Omit<ComponentPropsWithRef<"div">, "onSelect"> & ItemContent & {
+    /** What choosing the row does: `trigger.replace("@Sam Rivera ")` for a mention, run the command and `trigger.replace("")` for a slash command. */
+    onSelect: () => void;
+    /** Shown but not choosable; skipped by the arrow keys. @default false */
+    disabled?: boolean;
+};
+/**
+ * One suggestion. Takes `icon` and `description` like MenuItem, and looks
+ * like one, so a mention list and a menu are the same rows.
+ */
+declare function CaretMenuItem({ onSelect, disabled, icon, description, className, children, id, ...props }: CaretMenuItemProps): react.JSX.Element;
+
+declare const caretMenuMeta: ComponentMeta;
+
 /**
  * A badge is two independent choices: how it is DRAWN (`appearance`) and what
  * it MEANS (`tone`). They used to be one flat list of eleven variants that mixed
@@ -725,7 +1054,7 @@ declare const AlertDialogFooter: typeof DialogFooter;
 
 declare const dialogMeta: ComponentMeta;
 
-interface SeparatorProps$3 extends Omit<ComponentProps<typeof Separator$1>, "className"> {
+interface SeparatorProps$2 extends Omit<ComponentProps<typeof Separator$1>, "className"> {
     /** Axis of the rule. Horizontal spans the inline width; vertical the block height. */
     orientation?: "horizontal" | "vertical";
     /**
@@ -741,7 +1070,7 @@ interface SeparatorProps$3 extends Omit<ComponentProps<typeof Separator$1>, "cla
  * that stretches to its flex parent's height. Tinted with the `border` token.
  * Pass `label` (horizontal only) for a centered caption between two rules.
  */
-declare function Separator({ orientation, label, className, ...props }: SeparatorProps$3): react.JSX.Element;
+declare function Separator({ orientation, label, className, ...props }: SeparatorProps$2): react.JSX.Element;
 declare namespace Separator {
     var displayName: string;
 }
@@ -804,6 +1133,48 @@ declare namespace Input {
 
 declare const inputMeta: ComponentMeta;
 
+/** The control wiring a Field hands its child, forwarded to the input. */
+type ControlProps$1 = {
+    id?: string;
+    required?: boolean;
+    disabled?: boolean;
+    "aria-describedby"?: AriaAttributes["aria-describedby"];
+    "aria-invalid"?: AriaAttributes["aria-invalid"];
+};
+interface InputGroupProps extends Omit<ComponentPropsWithRef<"div">, keyof ControlProps$1 | "children">, ControlProps$1 {
+    /** Inside the field, before the text: a prefix ("https://", "$"), an icon, or a borderless Button. */
+    leading?: ReactNode;
+    /** Inside the field, after the text: a suffix (".com", "kg"), an icon, or a borderless Button (copy, reveal, clear). */
+    trailing?: ReactNode;
+    /** The single `<Input />` the addons sit around. */
+    children: ReactElement;
+}
+/**
+ * InputGroup — an Input with addons inside the same field: a prefix or suffix
+ * ("https://", ".com", "$"), an icon, or a borderless Button such as copy or
+ * reveal. One shell, one focus ring, one error state, so the addons read as
+ * part of the field rather than things placed beside it (that is Field's
+ * `trailing`: an Apply button next to a promo code).
+ *
+ *   <Field label="Website">
+ *     <InputGroup leading="https://" trailing=".com"><Input placeholder="example" /></InputGroup>
+ *   </Field>
+ *
+ * The group wears the field shell and the Input inside gives up its own border,
+ * fill and ring. A Field's wiring (id, aria-describedby, aria-invalid,
+ * required, disabled) is forwarded to the Input, so the label still points at
+ * the text box and the error still reaches it. A Button addon sits a hairline
+ * step in from the edge on every side (the addon shrinks its padding when it
+ * holds one), so the button reads as inside the field and its glyph lands near
+ * the text's inset.
+ */
+declare function InputGroup({ leading, trailing, children, className, id, required, disabled, "aria-describedby": describedBy, "aria-invalid": invalid, ...props }: InputGroupProps): react.JSX.Element;
+declare namespace InputGroup {
+    var displayName: string;
+}
+
+declare const inputGroupMeta: ComponentMeta;
+
 interface TextareaProps extends ComponentPropsWithRef<"textarea"> {
     /**
      * Grow to fit content as the user types, via CSS `field-sizing: content`
@@ -1060,7 +1431,7 @@ declare namespace Label {
 
 declare const labelMeta: ComponentMeta;
 
-type RootProps$6 = Omit<ComponentProps<typeof Switch$1.Root>, "className"> & {
+type RootProps$7 = Omit<ComponentProps<typeof Switch$1.Root>, "className"> & {
     className?: string;
 };
 /**
@@ -1074,14 +1445,14 @@ type RootProps$6 = Omit<ComponentProps<typeof Switch$1.Root>, "className"> & {
  * Use it for immediate-effect toggles. For deferred/form-submit choices that
  * need a visible label and validation, reach for a checkbox instead.
  */
-declare function Switch({ className, ...props }: RootProps$6): react.JSX.Element;
+declare function Switch({ className, ...props }: RootProps$7): react.JSX.Element;
 declare namespace Switch {
     var displayName: string;
 }
 
 declare const switchMeta: ComponentMeta;
 
-type RootProps$5 = Omit<ComponentProps<typeof Checkbox$1.Root>, "className"> & {
+type RootProps$6 = Omit<ComponentProps<typeof Checkbox$1.Root>, "className"> & {
     className?: string;
 };
 /**
@@ -1098,7 +1469,7 @@ type RootProps$5 = Omit<ComponentProps<typeof Checkbox$1.Root>, "className"> & {
  * The box and its mark are shared with CheckboxCard (`CHECK_BOX` +
  * `CheckboxMark`), so the standalone control and the card's box cannot drift.
  */
-declare function Checkbox({ className, children, ...props }: RootProps$5): react.JSX.Element;
+declare function Checkbox({ className, children, ...props }: RootProps$6): react.JSX.Element;
 declare namespace Checkbox {
     var displayName: string;
 }
@@ -1126,14 +1497,14 @@ declare const checkboxMeta: ComponentMeta;
  */
 declare const Tabs: react.ForwardRefExoticComponent<Omit<_base_ui_react.TabsRootProps, "ref"> & react.RefAttributes<HTMLDivElement>>;
 type TabsVariant = "underline" | "pill";
-type ListProps = Omit<ComponentProps<typeof Tabs$1.List>, "className"> & {
+type ListProps$1 = Omit<ComponentProps<typeof Tabs$1.List>, "className"> & {
     className?: string;
     /** `underline` (default) or `pill`. Triggers inside inherit it. */
     variant?: TabsVariant;
 };
 /** The tablist — a row of triggers, on a divider rule or as pills. */
-declare function TabsList({ className, variant, ...props }: ListProps): react.JSX.Element;
-type TriggerProps$3 = Omit<ComponentProps<typeof Tabs$1.Tab>, "className"> & {
+declare function TabsList({ className, variant, ...props }: ListProps$1): react.JSX.Element;
+type TriggerProps$4 = Omit<ComponentProps<typeof Tabs$1.Tab>, "className"> & {
     className?: string;
 };
 /**
@@ -1146,7 +1517,7 @@ type TriggerProps$3 = Omit<ComponentProps<typeof Tabs$1.Tab>, "className"> & {
  * A badge or icon beside the label is spaced like Button's (`--control-gap`):
  * the label is its own trimmed span, so a typed space after it collapses.
  */
-declare function TabsTrigger({ className, children, ...props }: TriggerProps$3): react.JSX.Element;
+declare function TabsTrigger({ className, children, ...props }: TriggerProps$4): react.JSX.Element;
 type PanelProps$3 = Omit<ComponentProps<typeof Tabs$1.Panel>, "className"> & {
     className?: string;
 };
@@ -1175,15 +1546,15 @@ declare const TooltipPortal: {
     (props: Omit<_base_ui_react.TooltipPortalProps, "ref"> & react.RefAttributes<HTMLDivElement>): react.JSX.Element;
     displayName: string;
 };
-type PositionerProps$6 = ComponentProps<typeof Tooltip$1.Positioner>;
+type PositionerProps$5 = ComponentProps<typeof Tooltip$1.Positioner>;
 type PopupProps = Omit<ComponentProps<typeof Tooltip$1.Popup>, "className"> & {
     className?: string;
     /** Which side of the trigger to render against. @default "top" */
-    side?: PositionerProps$6["side"];
+    side?: PositionerProps$5["side"];
     /** Alignment along the chosen side. @default "center" */
-    align?: PositionerProps$6["align"];
+    align?: PositionerProps$5["align"];
     /** Gap between trigger and popup, in px. @default 6 */
-    sideOffset?: PositionerProps$6["sideOffset"];
+    sideOffset?: PositionerProps$5["sideOffset"];
 };
 /**
  * The tooltip surface. Composes Portal + Positioner + Popup so callers pass a
@@ -1267,13 +1638,13 @@ declare const avatarGroupVariants: (props?: ({
  *
  *   <Avatar src={user.pfp} alt={user.name} fallback="AM" size="lg" />
  */
-type RootProps$4 = Omit<ComponentProps<typeof Avatar$1.Root>, "className"> & VariantProps<typeof avatarVariants> & {
+type RootProps$5 = Omit<ComponentProps<typeof Avatar$1.Root>, "className"> & VariantProps<typeof avatarVariants> & {
     className?: string;
 };
 /** The row sizes. `xl`/`2xl` are portraits, which are never stacked. */
 type AvatarGroupSize = NonNullable<VariantProps<typeof avatarGroupVariants>["size"]>;
 /** The circular frame. Clips the image; holds the `size` axis. */
-declare function AvatarRoot({ size, className, ...props }: RootProps$4): react.JSX.Element;
+declare function AvatarRoot({ size, className, ...props }: RootProps$5): react.JSX.Element;
 declare namespace AvatarRoot {
     var displayName: string;
 }
@@ -1293,7 +1664,7 @@ declare function AvatarFallback({ className, ...props }: FallbackProps): react.J
 declare namespace AvatarFallback {
     var displayName: string;
 }
-interface AvatarProps extends RootProps$4 {
+interface AvatarProps extends RootProps$5 {
     /** Image source. When omitted (or it fails to load), the fallback shows. */
     src?: string;
     /** Alt text for the image. Falls back to an empty string for decorative use. */
@@ -1331,7 +1702,7 @@ declare function Avatar({ src, alt, fallback, fallbackDelay, size, status, varia
 declare namespace Avatar {
     var displayName: string;
 }
-interface AvatarGroupCountProps extends Omit<RootProps$4, "children"> {
+interface AvatarGroupCountProps extends Omit<RootProps$5, "children"> {
     /** How many people are not shown. Renders as "+N". */
     count: number;
     /** What screen readers hear instead of "+N". Defaults to "and N more". */
@@ -1639,7 +2010,7 @@ type ProgressSize = "sm" | "md" | "lg";
  * Pass `value={null}` (or omit it) for an indeterminate bar — the fill spans the
  * full track and pulses while work is in flight.
  */
-type RootProps$3 = Omit<ComponentProps<typeof Progress$1.Root>, "className" | "value"> & {
+type RootProps$4 = Omit<ComponentProps<typeof Progress$1.Root>, "className" | "value"> & {
     className?: string;
     /**
      * Current value, 0–100 by default (see `min`/`max`). Omit or pass `null`
@@ -1655,7 +2026,7 @@ type RootProps$3 = Omit<ComponentProps<typeof Progress$1.Root>, "className" | "v
  * children are supplied it renders a default Track + Indicator so the common
  * case is a single self-contained element.
  */
-declare function Progress({ className, children, value, size, ...props }: RootProps$3): react.JSX.Element;
+declare function Progress({ className, children, value, size, ...props }: RootProps$4): react.JSX.Element;
 declare namespace Progress {
     var displayName: string;
 }
@@ -1716,7 +2087,7 @@ declare const progressMeta: ComponentMeta;
 
 type MeterTone = "primary" | "3" | "success" | "warning" | "destructive";
 type MeterSize = "sm" | "md" | "lg";
-type RootProps$2 = Omit<ComponentProps<typeof Meter$1.Root>, "className"> & {
+type RootProps$3 = Omit<ComponentProps<typeof Meter$1.Root>, "className"> & {
     className?: string;
     /**
      * Fill colour, mapped to a semantic token. Choose it from your own
@@ -1760,7 +2131,7 @@ type RootProps$2 = Omit<ComponentProps<typeof Meter$1.Root>, "className"> & {
  *
  * `shape="ring"` draws the same measurement as a circular gauge (it was Gauge).
  */
-declare function Meter({ className, children, tone, shape, size, strokeWidth, showValue, ...props }: RootProps$2): react.JSX.Element;
+declare function Meter({ className, children, tone, shape, size, strokeWidth, showValue, ...props }: RootProps$3): react.JSX.Element;
 declare namespace Meter {
     var displayName: string;
 }
@@ -2551,7 +2922,7 @@ declare const SelectGroup: react.ForwardRefExoticComponent<Omit<_base_ui_react.S
  * value outside the default trigger.
  */
 declare const SelectValue: react.ForwardRefExoticComponent<Omit<_base_ui_react.SelectValueProps, "ref"> & react.RefAttributes<HTMLSpanElement>>;
-type TriggerProps$2 = Omit<ComponentProps<typeof Select$1.Trigger>, "className" | "children"> & {
+type TriggerProps$3 = Omit<ComponentProps<typeof Select$1.Trigger>, "className" | "children"> & {
     className?: string;
     /** Placeholder text shown when no value is selected. */
     placeholder?: ReactNode;
@@ -2583,16 +2954,16 @@ type TriggerProps$2 = Omit<ComponentProps<typeof Select$1.Trigger>, "className"
  * The trigger button. Composes Base UI's Trigger + Value (the selected label)
  * and a trailing chevron Icon slot that flips via `data-[popup-open]`.
  */
-declare function SelectTrigger({ className, placeholder, size, children, ...props }: TriggerProps$2): react.JSX.Element;
-type PositionerProps$5 = ComponentProps<typeof Select$1.Positioner>;
+declare function SelectTrigger({ className, placeholder, size, children, ...props }: TriggerProps$3): react.JSX.Element;
+type PositionerProps$4 = ComponentProps<typeof Select$1.Positioner>;
 type ContentProps$7 = Omit<ComponentProps<typeof Select$1.Popup>, "className"> & {
     className?: string;
     /** Which side of the trigger to render against. @default "bottom" */
-    side?: PositionerProps$5["side"];
+    side?: PositionerProps$4["side"];
     /** Alignment along the chosen side. @default "start" */
-    align?: PositionerProps$5["align"];
+    align?: PositionerProps$4["align"];
     /** Gap between trigger and popup, in px. @default 6 */
-    sideOffset?: PositionerProps$5["sideOffset"];
+    sideOffset?: PositionerProps$4["sideOffset"];
 };
 /**
  * The popup surface. Composes Portal + Positioner + Popup + List so callers pass
@@ -2612,16 +2983,16 @@ type ItemProps$4 = Omit<ComponentProps<typeof Select$1.Item>, "className"> & {
  * instead of the display text.
  */
 declare function SelectItem({ className, children, label, ...props }: ItemProps$4): react.JSX.Element;
-type GroupLabelProps$3 = Omit<ComponentProps<typeof Select$1.GroupLabel>, "className"> & {
+type GroupLabelProps$2 = Omit<ComponentProps<typeof Select$1.GroupLabel>, "className"> & {
     className?: string;
 };
 /** A heading for a SelectGroup. Auto-associated for screen readers by Base UI. */
-declare function SelectGroupLabel({ className, ...props }: GroupLabelProps$3): react.JSX.Element;
-type SeparatorProps$2 = Omit<ComponentProps<typeof Select$1.Separator>, "className"> & {
+declare function SelectGroupLabel({ className, ...props }: GroupLabelProps$2): react.JSX.Element;
+type SeparatorProps$1 = Omit<ComponentProps<typeof Select$1.Separator>, "className"> & {
     className?: string;
 };
 /** A thin divider between groups of items. Decorative (Base UI marks it aria-hidden). */
-declare function SelectSeparator({ className, ...props }: SeparatorProps$2): react.JSX.Element;
+declare function SelectSeparator({ className, ...props }: SeparatorProps$1): react.JSX.Element;
 
 declare const selectMeta: ComponentMeta;
 
@@ -2647,21 +3018,21 @@ declare const PopoverPortal: {
     displayName: string;
 };
 declare const PopoverClose: react.ForwardRefExoticComponent<Omit<_base_ui_react.PopoverCloseProps, "ref"> & react.RefAttributes<HTMLButtonElement>>;
-type PositionerProps$4 = ComponentProps<typeof Popover$1.Positioner>;
+type PositionerProps$3 = ComponentProps<typeof Popover$1.Positioner>;
 type ContentProps$6 = Omit<ComponentProps<typeof Popover$1.Popup>, "className"> & {
     className?: string;
     /** Which side of the trigger to render against. @default "bottom" */
-    side?: PositionerProps$4["side"];
+    side?: PositionerProps$3["side"];
     /** Alignment along the chosen side. @default "center" */
-    align?: PositionerProps$4["align"];
+    align?: PositionerProps$3["align"];
     /** Gap between trigger and popup, in px. @default 8 */
-    sideOffset?: PositionerProps$4["sideOffset"];
+    sideOffset?: PositionerProps$3["sideOffset"];
     /**
      * Position against a different element/ref than the trigger (an element, a
      * ref, or a getter). Base UI has no separate Anchor part — pass it here to
      * decouple where the popover opens from what toggles it.
      */
-    anchor?: PositionerProps$4["anchor"];
+    anchor?: PositionerProps$3["anchor"];
 };
 /**
  * The popover surface. Composes Portal + Positioner + Popup so callers pass a
@@ -2686,126 +3057,131 @@ declare function PopoverArrow({ className, ...props }: ArrowProps$1): react.JSX.
 
 declare const popoverMeta: ComponentMeta;
 
+declare const menuMeta: ComponentMeta;
+
 /**
- * Menu — themed dropdown over Base UI's Menu (roving focus, typeahead, ARIA
- * menu/menuitem wiring, collision-aware positioning, Esc/outside dismissal all
- * come from Base UI). Compose:
- *
- *   <Menu>
- *     <MenuTrigger render={<Button variant="secondary">Options</Button>} />
- *     <MenuContent>
- *       <MenuItem>Edit</MenuItem>
- *       <MenuItem>Duplicate</MenuItem>
- *       <MenuSeparator />
- *       <MenuGroup>
- *         <MenuGroupLabel>Danger</MenuGroupLabel>
- *         <MenuItem>Delete</MenuItem>
- *       </MenuGroup>
- *     </MenuContent>
- *   </Menu>
- *
- * State surfaces via Base UI data-attributes: data-[highlighted] (active item),
- * data-[disabled], and data-[starting-style]/data-[ending-style] (open/close).
- */
-declare const Menu: <Payload>(props: Menu$1.Root.Props<Payload>) => react.JSX.Element;
-declare const MenuTrigger: Menu$1.Trigger;
-declare const MenuPortal: {
-    (props: Omit<_base_ui_react.ContextMenuPortalProps, "ref"> & react.RefAttributes<HTMLDivElement>): react.JSX.Element;
-    displayName: string;
-};
-type PositionerProps$3 = ComponentProps<typeof Menu$1.Positioner>;
-type ContentProps$5 = Omit<ComponentProps<typeof Menu$1.Popup>, "className"> & {
+ * NavigationMenu — a site header's primary nav over Base UI's NavigationMenu
+ * (hover/focus-to-open triggers, arrow-key roving across the bar, Esc and
+ * outside dismissal, `aria-current` on the active link). Compose:
+ *
+ *   <NavigationMenu>
+ *     <NavigationMenuList>
+ *       <NavigationMenuItem>
+ *         <NavigationMenuTrigger>Product</NavigationMenuTrigger>
+ *         <NavigationMenuContent className="grid w-[30rem] grid-cols-2">
+ *           <NavigationMenuLink href="/editor" description="Write and review together.">Editor</NavigationMenuLink>
+ *           <NavigationMenuLink href="/sync" description="Offline first, conflict free.">Sync</NavigationMenuLink>
+ *         </NavigationMenuContent>
+ *       </NavigationMenuItem>
+ *       <NavigationMenuItem>
+ *         <NavigationMenuLink href="/pricing">Pricing</NavigationMenuLink>
+ *       </NavigationMenuItem>
+ *     </NavigationMenuList>
+ *   </NavigationMenu>
+ *
+ * The root also renders the one floating panel every trigger shares (Portal +
+ * Positioner + Popup + Viewport), so callers never assemble it. Moving between
+ * triggers keeps that panel open: it glides to the new trigger, resizes to the
+ * new content, and the content slides in from the side it was reached from.
+ *
+ * Links are router-agnostic: `render={<Link to="/pricing" />}` keeps Base UI's
+ * roving focus and `active` (→ `aria-current="page"`) on your router's link.
+ */
+type RootProps$2 = Omit<ComponentProps<typeof NavigationMenu$1.Root>, "className"> & {
     className?: string;
-    /** Which side of the trigger to render against. @default "bottom" */
-    side?: PositionerProps$3["side"];
-    /** Alignment along the chosen side. @default "start" */
-    align?: PositionerProps$3["align"];
-    /** Gap between trigger and popup, in px. @default 6 */
-    sideOffset?: PositionerProps$3["sideOffset"];
+    /** Alignment of the panel along its trigger. @default "start" */
+    align?: ComponentProps<typeof NavigationMenu$1.Positioner>["align"];
+    /** Gap between the bar and the panel, in px. @default 8 */
+    sideOffset?: ComponentProps<typeof NavigationMenu$1.Positioner>["sideOffset"];
 };
-/**
- * The dropdown surface. Composes Portal + Positioner + Popup so callers pass a
- * single element. Defaults to the `bottom` side, `start` aligned, 6px offset.
- */
-declare function MenuContent({ className, children, side, align, sideOffset, ...props }: ContentProps$5): react.JSX.Element;
-type ItemProps$3 = Omit<ComponentProps<typeof Menu$1.Item>, "className"> & {
+declare function NavigationMenu({ className, children, align, sideOffset, ...props }: RootProps$2): react.JSX.Element;
+type ListProps = Omit<ComponentProps<typeof NavigationMenu$1.List>, "className"> & {
     className?: string;
-    /**
-     * `destructive` for an action that deletes or cannot be undone. It keeps the
-     * destructive ink when highlighted — the default highlight repaints the row
-     * in accent ink, which hid the warning exactly when the row was targeted —
-     * and washes the highlight in the destructive tone instead.
-     * @default "default"
-     */
-    variant?: "default" | "destructive";
 };
-/** A single interactive row. Highlights via Base UI's data-[highlighted]. */
-declare function MenuItem({ className, variant, ...props }: ItemProps$3): react.JSX.Element;
-type SeparatorProps$1 = Omit<ComponentProps<typeof Menu$1.Separator>, "className"> & {
+/** The bar: a `<ul>` of items. Arrow keys rove across it. */
+declare function NavigationMenuList({ className, ...props }: ListProps): react.JSX.Element;
+type ItemProps$3 = Omit<ComponentProps<typeof NavigationMenu$1.Item>, "className"> & {
     className?: string;
 };
-/** A hairline rule between item runs. Bleeds past the popup padding. */
-declare function MenuSeparator({ className, ...props }: SeparatorProps$1): react.JSX.Element;
-type GroupProps$2 = Omit<ComponentProps<typeof Menu$1.Group>, "className"> & {
+/** One `<li>` in the bar: a NavigationMenuLink, or a Trigger with its Content. */
+declare function NavigationMenuItem({ className, ...props }: ItemProps$3): react.JSX.Element;
+type TriggerProps$2 = Omit<ComponentProps<typeof NavigationMenu$1.Trigger>, "className"> & {
     className?: string;
 };
-/** Groups related items with a label for screen readers. */
-declare function MenuGroup({ className, ...props }: GroupProps$2): react.JSX.Element;
-type GroupLabelProps$2 = Omit<ComponentProps<typeof Menu$1.GroupLabel>, "className"> & {
+/** Opens its item's Content on hover, click or Enter. Carries its own chevron. */
+declare function NavigationMenuTrigger({ className, children, ...props }: TriggerProps$2): react.JSX.Element;
+type ContentProps$5 = Omit<ComponentProps<typeof NavigationMenu$1.Content>, "className"> & {
     className?: string;
 };
-/** The label for a MenuGroup. Auto-associated with the group it sits in. */
-declare function MenuGroupLabel({ className, ...props }: GroupLabelProps$2): react.JSX.Element;
 /**
- * A nested menu. Wraps a `MenuSubmenuTrigger` and its own `MenuContent`:
- *
- *   <MenuSubmenu>
- *     <MenuSubmenuTrigger>Effort</MenuSubmenuTrigger>
- *     <MenuContent side="inline-end" align="start">…</MenuContent>
- *   </MenuSubmenu>
- *
- * `side="inline-end"` rather than `"right"` so the submenu opens away from the
- * parent in RTL as well as LTR — Base UI flips it at the collision boundary
- * either way, but starting on the correct side avoids a flip on every open.
+ * An item's panel content, rendered into the shared panel when its trigger
+ * opens. Size it with layout classes (`w-[30rem] grid grid-cols-2`); the panel
+ * follows. It slides in from the side it was reached from.
  */
-declare const MenuSubmenu: typeof Menu$1.SubmenuRoot;
-type SubmenuTriggerProps = Omit<ComponentProps<typeof Menu$1.SubmenuTrigger>, "className"> & {
+declare function NavigationMenuContent({ className, ...props }: ContentProps$5): react.JSX.Element;
+type LinkProps = Omit<ComponentProps<typeof NavigationMenu$1.Link>, "className"> & {
     className?: string;
-    /** Trailing value shown before the chevron — the current choice, usually. */
-    value?: ComponentProps<"span">["children"];
+    /**
+     * A second line under the title, in a panel: what is behind the link
+     * ("Write and review together"). Ignored in the bar, where a link is one word.
+     */
+    description?: ReactNode;
 };
 /**
- * The row that opens a submenu. Styled as a MenuItem plus a trailing chevron,
- * and optionally the current `value` — which is what lets a settings menu read
- * as `Effort   High ›` rather than making the reader open each row to find out
- * what is set.
+ * A link: a bar entry when it sits in a NavigationMenuItem, a two-line row
+ * when it sits in a NavigationMenuContent. `active` marks the current page
+ * (`aria-current="page"`); `render={<Link to="…" />}` uses your router.
  */
-declare function MenuSubmenuTrigger({ className, children, value, ...props }: SubmenuTriggerProps): react.JSX.Element;
+declare function NavigationMenuLink({ className, description, children, ...props }: LinkProps): react.JSX.Element;
+
+declare const navigationMenuMeta: ComponentMeta;
+
 /**
- * A single-choice group inside a menu. Controlled via `value`/`onValueChange`,
- * uncontrolled via `defaultValue`.
+ * Menubar — an application's row of menus (File, Edit, View), over Base UI's
+ * Menubar. Each menu is an ordinary Sable `Menu`; the bar only joins them:
+ *
+ *   <Menubar aria-label="Editor">
+ *     <Menu>
+ *       <MenubarTrigger>File</MenubarTrigger>
+ *       <MenuContent>
+ *         <MenuItem>New</MenuItem>
+ *       </MenuContent>
+ *     </Menu>
+ *     <Menu>
+ *       <MenubarTrigger>Edit</MenubarTrigger>
+ *       <MenuContent>…</MenuContent>
+ *     </Menu>
+ *   </Menubar>
+ *
+ * Base UI owns the joining: `role="menubar"`, one tab stop for the whole bar,
+ * ←/→ between the titles, ↓ into the open menu, and — once one menu is open —
+ * moving the pointer across the bar opens its neighbours without another click.
+ * Every row, group, submenu and checkbox inside is the Menu part you already
+ * know; there is no Menubar-specific item.
  */
-declare const MenuRadioGroup: react.NamedExoticComponent<Omit<_base_ui_react.ContextMenuRadioGroupProps, "ref"> & react.RefAttributes<HTMLDivElement>>;
-type RadioItemProps = Omit<ComponentProps<typeof Menu$1.RadioItem>, "className"> & {
+type MenubarProps = Omit<ComponentProps<typeof Menubar$1>, "className"> & {
     className?: string;
 };
-/**
- * One option in a MenuRadioGroup. The check sits in a reserved leading column
- * rather than appearing and disappearing with the selection — otherwise every
- * label shifts sideways as the reader moves the highlight, which is the exact
- * thing a menu of options must not do.
- */
-declare function MenuRadioItem({ className, children, ...props }: RadioItemProps): react.JSX.Element;
-type CheckboxItemProps = Omit<ComponentProps<typeof Menu$1.CheckboxItem>, "className"> & {
+declare function Menubar({ className, ...props }: MenubarProps): react.JSX.Element;
+declare namespace Menubar {
+    var displayName: string;
+}
+type MenubarTriggerProps = Omit<ComponentProps<typeof MenuTrigger>, "className"> & {
     className?: string;
 };
 /**
- * A toggling row. Same reserved leading column as MenuRadioItem, so a menu
- * mixing the two keeps one text margin.
+ * A menu's title in the bar. Styled as a small ghost Button (the same classes,
+ * so it follows the density ladder and the theme's button shape), set in the
+ * control tier a menu row uses rather than a button's louder label, and held in
+ * the accent wash while its menu is open so the reader can see which title the
+ * popup belongs to.
  */
-declare function MenuCheckboxItem({ className, children, ...props }: CheckboxItemProps): react.JSX.Element;
+declare function MenubarTrigger({ className, children, ...props }: MenubarTriggerProps): react.JSX.Element;
+declare namespace MenubarTrigger {
+    var displayName: string;
+}
 
-declare const menuMeta: ComponentMeta;
+declare const menubarMeta: ComponentMeta;
 
 /**
  * Edge-anchored sheet surface. The shared base pins the popup to a viewport
@@ -2831,18 +3207,35 @@ declare const menuMeta: ComponentMeta;
  * off-screen from where the finger left it. A swipe dismissal scales the exit
  * duration by --drawer-swipe-strength (a fast flick leaves faster), still in
  * units of the motion token, so reduced motion keeps it instant.
+ *
+ * Snap points (bottom only): Base UI writes the active stop as
+ * --drawer-snap-point-offset, the distance the full panel sits below its
+ * resting place, and the bottom side adds it to the swipe travel in the same
+ * transform. A release glides to the next stop on the same transform
+ * transition as the enter/exit, so reduced motion snaps there instantly.
+ *
+ * The on-screen keyboard: --sheet-keyboard-inset (SheetContent, from
+ * visualViewport) lifts a bottom sheet off the keyboard and takes the keyboard
+ * out of its height budget, where `dvh` alone does not.
  */
 declare const sheetVariants: (props?: ({
     side?: "bottom" | "left" | "right" | "top" | null | undefined;
 } & class_variance_authority_types.ClassProp) | undefined) => string;
 
+/** A snap point: a fraction of the viewport (0–1), pixels (> 1), or a `px` / `rem` string. */
+type SheetSnapPoint = number | string;
 /**
- * Root props. Everything Base UI Drawer.Root takes except the swipe direction
- * (derived from SheetContent's `side`) and snap points (a bottom-sheet feature
- * Sheet's styling does not implement).
+ * Root props: everything Base UI Drawer.Root takes except the swipe direction,
+ * which comes from SheetContent's `side`.
+ *
+ * Snap points are a bottom sheet's: stops the panel rests at between closed
+ * and fully open, dragged between by its handle or any touch swipe. They take
+ * effect only with `side="bottom"`; a side or top sheet ignores them and a
+ * development build says so, rather than half-applying a bottom-sheet gesture
+ * to a panel that slides sideways.
  */
-type SheetProps<Payload = unknown> = Omit<Drawer.Root.Props<Payload>, "swipeDirection" | "snapPoints" | "snapPoint" | "defaultSnapPoint" | "onSnapPointChange" | "snapToSequentialPoints">;
-declare function Sheet<Payload = unknown>(props: SheetProps<Payload>): react.JSX.Element;
+type SheetProps<Payload = unknown> = Omit<Drawer.Root.Props<Payload>, "swipeDirection">;
+declare function Sheet<Payload = unknown>({ snapPoints, snapPoint, defaultSnapPoint, onSnapPointChange, snapToSequentialPoints, ...props }: SheetProps<Payload>): react.JSX.Element;
 declare const SheetTrigger: Drawer.Trigger;
 declare const SheetClose: Drawer.Close;
 declare const SheetPortal: {
@@ -2852,15 +3245,7 @@ declare const SheetPortal: {
 type ContentProps$4 = Omit<ComponentProps<typeof Drawer.Popup>, "className"> & VariantProps<typeof sheetVariants> & {
     className?: string;
 };
-/**
- * Backdrop + edge-anchored popup surface. Renders through a portal. Pick the
- * entry edge with `side` ("right" | "left" | "top" | "bottom", default "right").
- *
- * The children sit in Base UI's Drawer.Content (as `display: contents`, so they
- * stay flex items of the popup column): a mouse drag that starts on content
- * selects text instead of dragging the sheet. Touch swipes work anywhere.
- */
-declare function SheetContent({ className, children, side, initialFocus, ref, ...props }: ContentProps$4): react.JSX.Element;
+declare function SheetContent({ className, children, side, initialFocus, ref, style, ...props }: ContentProps$4): react.JSX.Element;
 type TitleProps$1 = Omit<ComponentProps<typeof Drawer.Title>, "className"> & {
     className?: string;
 };
@@ -3989,11 +4374,11 @@ type SeparatorProps = Omit<ComponentProps<typeof ContextMenu$1.Separator>, "clas
 };
 /** A hairline rule between item runs. Bleeds past the popup padding. */
 declare function ContextMenuSeparator({ className, ...props }: SeparatorProps): react.JSX.Element;
-type GroupProps$1 = Omit<ComponentProps<typeof ContextMenu$1.Group>, "className"> & {
+type GroupProps$2 = Omit<ComponentProps<typeof ContextMenu$1.Group>, "className"> & {
     className?: string;
 };
 /** Groups related items with a label for screen readers. */
-declare function ContextMenuGroup({ className, ...props }: GroupProps$1): react.JSX.Element;
+declare function ContextMenuGroup({ className, ...props }: GroupProps$2): react.JSX.Element;
 type GroupLabelProps = Omit<ComponentProps<typeof ContextMenu$1.GroupLabel>, "className"> & {
     className?: string;
 };
@@ -4070,8 +4455,19 @@ interface PaginationProps extends Omit<ComponentPropsWithRef<"nav">, "onChange">
     page: number;
     /** Total number of pages. */
     total: number;
-    /** Called with the next page when a control is activated. */
-    onPageChange: (page: number) => void;
+    /**
+     * Called with the next page when a control is activated. Optional when
+     * `pageLink` is set and the URL is the page state.
+     */
+    onPageChange?: (page: number) => void;
+    /**
+     * Make every page control a real link: return the element to render for a
+     * page, `(page) => <a href={`?page=${page}`} />` or a router's
+     * `(page) => <Link to={`?page=${page}`} />`. Links are crawlable and open
+     * in a new tab; without this the controls are buttons for client-only paging.
+     * Previous/next at the bounds stay disabled buttons, never a link to nowhere.
+     */
+    pageLink?: (page: number) => ReactElement;
     /**
      * How many page buttons to show on each side of the current page before the
      * list collapses into ellipses. First and last pages are always shown.
@@ -4092,7 +4488,7 @@ interface PaginationProps extends Omit<ComponentPropsWithRef<"nav">, "onChange">
  *   const [page, setPage] = useState(1)
  *   <Pagination page={page} total={10} onPageChange={setPage} />
  */
-declare function Pagination({ page, total, onPageChange, siblingCount, label, className, ref, ...props }: PaginationProps): react.JSX.Element;
+declare function Pagination({ page, total, onPageChange, pageLink, siblingCount, label, className, ref, ...props }: PaginationProps): react.JSX.Element;
 declare namespace Pagination {
     var displayName: string;
 }
@@ -4679,6 +5075,36 @@ declare function PropertyPair({ labels, className, children, ...props }: PairPro
 declare namespace PropertyPair {
     var displayName: string;
 }
+type GroupProps$1 = Omit<ComponentProps<typeof Collapsible>, "children" | "className"> & {
+    /** The group's name. */
+    label: ReactNode;
+    /**
+     * What the group is set to, readable while it is closed: a value ("Cool",
+     * "200% pull"), a few swatches, or both. Sits before the indicator.
+     */
+    summary?: ReactNode;
+    className?: string;
+    children: ReactNode;
+};
+/**
+ * PropertyGroup — a set of properties that folds behind one row, inside a
+ * PanelSection: the row names the group and summarises its value, and opens to
+ * the controls beneath it. The +/− tools use for "more here" (Figma's
+ * collapsible layer properties), at the panel's own scale — an Accordion is
+ * page furniture, its title-sized trigger twice the height of a property row.
+ *
+ * Each group opens on its own, so two can be compared side by side. Groups
+ * stack with a hairline between them; the summary is what keeps a closed
+ * group honest, so give it the value, not a restatement of the label.
+ *
+ *   <PropertyGroup label="Neutrals" summary="Cool">
+ *     <PropertyRow label="Tint">…</PropertyRow>
+ *   </PropertyGroup>
+ */
+declare function PropertyGroup({ label, summary, className, children, ...props }: GroupProps$1): react.JSX.Element;
+declare namespace PropertyGroup {
+    var displayName: string;
+}
 
 declare const panelSectionMeta: ComponentMeta;
 
@@ -5149,8 +5575,19 @@ interface SidebarProps extends ComponentPropsWithRef<"aside"> {
      * @default "app"
      */
     variant?: "app" | "inline";
+    /**
+     * Which surface the rail is painted on.
+     * - `rail` (default) — its own `--sidebar-*` surface, with a border. Right
+     *   for a full-height rail that frames the app on its own; a theme can tint
+     *   it, or paint it dark on a light page.
+     * - `page` — the page's own surface and ink, no border. Use it when a
+     *   full-width header sits above the rail: a tinted column that starts
+     *   under a page-coloured bar reads as pasted on, not as chrome.
+     * @default "rail"
+     */
+    surface?: "rail" | "page";
 }
-declare function Sidebar({ collapsed, icons, variant, className, children, ...props }: SidebarProps): react.JSX.Element;
+declare function Sidebar({ collapsed, icons, variant, surface, className, children, ...props }: SidebarProps): react.JSX.Element;
 declare namespace Sidebar {
     var displayName: string;
 }
@@ -6942,6 +7379,15 @@ interface ScrollerProps extends ComponentPropsWithRef<"div"> {
      * @default true
      */
     wheelScroll?: boolean;
+    /**
+     * Ease mouse-wheel steps toward their target, the inertia a smooth-scroll
+     * library adds, on either axis. Only a mouse wheel: trackpads and touch keep
+     * their own momentum, keys and scrollbar drags stay native, and reduced
+     * motion (the OS preference or MotionProvider) turns it off. Anything else
+     * that moves the region, such as `scrollIntoView`, stops the easing.
+     * @default true
+     */
+    smoothWheel?: boolean;
     /**
      * Accessible name for the scroll region. A scrollable region that takes
      * focus should say what it contains — without one, a screen reader announces
@@ -7007,7 +7453,7 @@ interface ScrollerProps extends ComponentPropsWithRef<"div"> {
  *     <div className="flex gap-3">…wide content…</div>
  *   </Scroller>
  */
-declare function Scroller({ orientation, wheelScroll, label, className, viewportClassName, children, ref, style, onScroll, onKeyDown, ...props }: ScrollerProps): react.JSX.Element;
+declare function Scroller({ orientation, wheelScroll, smoothWheel, label, className, viewportClassName, children, ref, style, onScroll, onKeyDown, ...props }: ScrollerProps): react.JSX.Element;
 declare namespace Scroller {
     var displayName: string;
 }
@@ -7665,15 +8111,26 @@ interface ChatComposerProps extends Omit<ComponentPropsWithRef<"form">, "onSubmi
     /**
      * Called with the trimmed message when the reader sends. An uncontrolled
      * composer clears itself afterwards; a controlled one is the caller's to
-     * clear, since only they know whether the send succeeded.
+     * clear, since only they know whether the send succeeded. With `allowEmpty`
+     * the message can be `""`.
      */
     onSend?: (value: string) => void;
+    /**
+     * Let the reader send with no text, because the app has something else to
+     * send — pending attachments, a picked file. Pass it only while that is true
+     * (`allowEmpty={files.length > 0}`), or send is enabled with nothing to send.
+     * `onSend` then receives `""`.
+     * @default false
+     */
+    allowEmpty?: boolean;
     /** Placeholder for the field. @default "Send a message…" */
     placeholder?: string;
     /**
      * Which key sends. `enter` for chat: Enter sends, Shift+Enter breaks the line.
      * `mod-enter` for long-form replies (an email, a support answer): Enter breaks
      * the line and ⌘/Ctrl+Enter sends, so a paragraph break never mails a draft.
+     * On a touch device (`pointer: coarse`) `enter` behaves as `mod-enter`: the
+     * soft keyboard's Return breaks the line and the send button sends.
      * @default "enter"
      */
     sendOn?: "enter" | "mod-enter";
@@ -7703,8 +8160,14 @@ interface ChatComposerProps extends Omit<ComponentPropsWithRef<"form">, "onSubmi
     sendLabel?: string;
     /** Accessible label for the stop button. @default "Stop generating" */
     stopLabel?: string;
-    /** Helper or counter text below the controls. */
-    footer?: ReactNode;
+    /**
+     * Helper or counter text below the controls. A function receives the send
+     * key in effect, so a keyboard hint stays true on touch, where `enter`
+     * becomes `mod-enter`; return null and the row goes away.
+     */
+    footer?: ReactNode | ((state: {
+        sendOn: "enter" | "mod-enter";
+    }) => ReactNode);
     /** Ref to the underlying textarea — for focusing after a send, or on mount. */
     fieldRef?: ComponentPropsWithRef<"textarea">["ref"];
 }
@@ -7724,18 +8187,23 @@ interface ChatComposerProps extends Omit<ComponentPropsWithRef<"form">, "onSubmi
  * The three details that are the whole job:
  *
  * - **Enter sends, Shift+Enter breaks the line** (or, with `sendOn="mod-enter"`,
- *   Enter breaks it and ⌘/Ctrl+Enter sends) — and neither fires mid-IME.
+ *   Enter breaks it and ⌘/Ctrl+Enter sends) — and neither fires mid-IME. On
+ *   a touch device Return always breaks the line: a soft keyboard has no
+ *   Shift+Return, so Enter-to-send would leave no way to write a second line.
  *   A Japanese, Chinese, or Korean reader confirming a candidate in the
  *   composition popup presses Enter to *choose a word*, and a composer that
  *   reads that as "send" mails half a sentence. `event.nativeEvent.isComposing`
  *   is the guard, and it is the single most commonly missed line in a chat input.
+ *   An Enter that something else already handled (`preventDefault()`) does not
+ *   send either: that is how a CaretMenu on `fieldRef` picks a suggestion.
  * - **Whitespace never sends.** The send button is disabled until there is
- *   something to send, so the affordance and the behaviour agree.
+ *   something to send, so the affordance and the behaviour agree. When the
+ *   something is a file rather than text, the app says so with `allowEmpty`.
  * - **Send becomes stop while busy**, in place, when `onStop` is given.
  *   Interrupting a long generation is the most common thing a reader wants
  *   during one, and it belongs where their cursor already is.
  */
-declare function ChatComposer({ value, defaultValue, onValueChange, onSend, placeholder, sendOn, busy, onStop, disabled, invalid, attachments, leading, actions, onAttach, label, sendLabel, stopLabel, footer, fieldRef, className, children, ...props }: ChatComposerProps): react.JSX.Element;
+declare function ChatComposer({ value, defaultValue, onValueChange, onSend, allowEmpty, placeholder, sendOn, busy, onStop, disabled, invalid, attachments, leading, actions, onAttach, label, sendLabel, stopLabel, footer, fieldRef, className, children, ...props }: ChatComposerProps): react.JSX.Element;
 declare namespace ChatComposer {
     var displayName: string;
 }
@@ -8377,6 +8845,8 @@ interface UseCopyResult {
     /** True for `timeout` ms after a successful copy — swap the icon on it. */
     copied: boolean;
 }
+/** The text to copy, or a function that produces it at click time. */
+type CopySource = string | (() => string | Promise<string>);
 /**
  * Copy text to the clipboard and know, briefly, that it worked. Copying is a
  * BEHAVIOUR, not a kind of button: pair this with the ordinary icon Button so a
@@ -8387,10 +8857,63 @@ interface UseCopyResult {
  *     <Icon name={copied ? "check" : "copy"} />
  *   </Button>
  *
+ * Text that costs something to produce (a file to fetch, a document to
+ * serialise) is passed as a function, called only on click:
+ * `useCopy(() => fetch(url).then((r) => r.text()))`. A promise goes to the
+ * clipboard as a pending ClipboardItem, because Safari honours a write only
+ * when it starts inside the click, not after an await.
+ *
  * Clipboard access is guarded, so it is SSR-safe and fails quietly (resolving
- * false) where the API is missing or the write is refused.
+ * false) where the API is missing, the write is refused, or the text rejects.
+ */
+declare function useCopy(text: CopySource, { timeout }?: UseCopyOptions): UseCopyResult;
+
+interface SmoothWheelOptions {
+    /** The axis the element scrolls on. @default "vertical" */
+    axis?: "vertical" | "horizontal";
+    /**
+     * Horizontal only: a vertical mouse wheel scrolls the element sideways. Most
+     * mice have no horizontal wheel, so without it the content past the fold is
+     * out of reach. @default true
+     */
+    mapVertical?: boolean;
+    /**
+     * Ease mouse-wheel steps toward their target instead of jumping. Trackpads,
+     * touch, keys and scrollbar drags stay native, and reduced motion (the OS
+     * preference or MotionProvider) turns it off. @default true
+     */
+    smooth?: boolean;
+}
+/**
+ * Mouse-wheel scrolling for one scroll container: eased steps (the inertia a
+ * smooth-scroll library such as Lenis adds), and on a horizontal strip, a
+ * vertical wheel mapped sideways. Returns a ref callback for the scrolling
+ * element. Already wired into `<Scroller>`; use it directly for a scroll
+ * container of your own.
+ *
+ *   const wheel = useSmoothWheel()
+ *   <div ref={wheel} className="overflow-y-auto scrollbar-quiet">…</div>
+ *
+ * Unlike a page-level smooth scroller, it owns one element and only the mouse
+ * wheel, so it never fights the browser over anything else:
+ *
+ * 1. **It releases at the ends.** At either end the event passes through and
+ *    the page (or the scroller around this one) scrolls, which is what the
+ *    reader was doing. Intercepting unconditionally traps the page.
+ * 2. **It leaves trackpads, touch and `shift+wheel` alone** (see `isNotch`), and
+ *    a trackpad's own horizontal swipe on a strip, which the browser already
+ *    scrolls.
+ * 3. **Anything else that scrolls the element wins.** A scrollbar drag, a key,
+ *    `scrollIntoView` from a highlighted row or a stick-to-bottom chat: the
+ *    moment the position moves without us, the easing stops and that movement
+ *    stands.
+ * 4. **It normalises `deltaMode`** — see `toPixels`.
+ *
+ * The wheel listener is non-passive, because `preventDefault` is the mechanism.
+ * It is attached only when there is something to do: a vertical element with
+ * easing off, or under reduced motion, gets no listener at all.
  */
-declare function useCopy(text: string, { timeout }?: UseCopyOptions): UseCopyResult;
+declare function useSmoothWheel({ axis, mapVertical, smooth, }?: SmoothWheelOptions): (node: HTMLElement | null) => void;
 
 /**
  * The palette: nine colour families and a scale under every tone, generated
@@ -8443,6 +8966,6 @@ declare const PALETTE_TONES: readonly ["tone-1", "tone-2", "tone-3", "tone-info"
 /** Everything the palette names: neutral, the families, then the tone scales. */
 declare const PALETTE_SCALES: readonly ["neutral", ...string[], "tone-1", "tone-2", "tone-3", "tone-info", "tone-warning", "success", "destructive"];
 
-declare const SABLE_UI_VERSION: "0.10.0";
+declare const SABLE_UI_VERSION: "0.12.0";
 
-export { Accordion, AccordionItem, AccordionPanel, AccordionTrigger, AlertDialog, AlertDialogClose, AlertDialogContent, AlertDialogDescription, AlertDialogFooter, AlertDialogHeader, AlertDialogOverlay, AlertDialogTitle, AlertDialogTrigger, AppHeader, type AppHeaderProps, AppShell, type AppShellProps, AreaChart, type AreaChartProps, type ArtTone, Attachment, type AttachmentProps, Avatar, AvatarFallback, AvatarGroup, AvatarGroupCount, type AvatarGroupCountProps, type AvatarGroupProps, AvatarImage, type AvatarProps, AvatarRoot, BADGE_APPEARANCES, BADGE_TONES, Badge, type BadgeAppearance, type BadgeProps, type BadgeTone, Banner, type BannerProps, BarChart, type BarChartProps, BottomNav, BottomNavItem, type BottomNavItemProps, BreadcrumbItem, type BreadcrumbItemProps, BreadcrumbLink, type BreadcrumbLinkProps, BreadcrumbPage, type BreadcrumbPageProps, BreadcrumbSeparator, type BreadcrumbSeparatorProps, Breadcrumbs, type BreadcrumbsProps, Browser, type BrowserProps, Bubble, type BubbleProps, BubbleReaction, type BubbleReactionProps, BubbleReactions, type BubbleReactionsProps, Button, type ButtonBleed, type ButtonProps, CHART_SERIES_COUNT, COMPONENT_GROUPS, COMPONENT_TAXONOMY, Calendar, type CalendarProps, Card, CardAction, CardContent, type CardContentProps, CardDescription, CardFooter, type CardFooterProps, CardHeader, CardList, type CardProps, CardTitle, type CardTitleProps, Carousel, type CarouselProps, type CarouselSlidesToShow, type ChartCategories, type ChartCenterLabel, type ChartCurve, type ChartDatum, type ChartSeries, type ChartTone, type ChartTooltipIndicator, type ChartTooltipOptions, type ChartValueFormatter, ChatComposer, type ChatComposerProps, Checkbox, CheckboxCard, type CheckboxCardProps, type CheckboxCardTone, CheckboxGroup, type CheckboxGroupProps, Code, CodeBlock, type CodeBlockProps, CodeHighlightProvider, type CodeHighlighter, type CodeProps, Collapsible, CollapsibleIndicator, CollapsiblePanel, CollapsibleTrigger, ColorField, type ColorFieldProps, Combobox, ComboboxChips, ComboboxClear, ComboboxContent, ComboboxEmpty, ComboboxGroup, ComboboxGroupLabel, ComboboxInput, ComboboxItem, type ComboboxItemGroup, ComboboxItemIndicator, ComboboxList, ComboboxPortal, type ComboboxProps, ComboboxValue, ComboboxVirtualList, type ComboboxVirtualListProps, type CommandFilter, type CommandItem, CommandMenu, CommandMenuGroup, type CommandMenuGroupProps, CommandMenuItem, type CommandMenuItemProps, CommandMenuPanel, type CommandMenuPanelProps, type CommandMenuProps, CommandMenuTrigger, type CommandMenuTriggerProps, type ComponentGroup, type ComponentGuidance, ComponentMeta, type ComponentRegister, type ConstraintFlag, ContextCard, ContextCardArrow, ContextCardContent, ContextCardPortal, ContextCardTrigger, ContextMenu, ContextMenuContent, ContextMenuGroup, ContextMenuGroupLabel, ContextMenuItem, ContextMenuPortal, ContextMenuSeparator, ContextMenuTrigger, DataTable, type DataTableColumn, type DataTableProps, type DataTableRowKey, DatePicker, type DatePickerProps, DateTile, type DateTileProps, Density, DensityProvider, Density as DensityValue, DestructiveActionModal, type DestructiveActionModalProps, Dialog, DialogClose, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogOverlay, DialogPortal, type DialogSize, DialogTitle, DialogTrigger, DisclosurePicker, DisclosurePickerEmpty, DisclosurePickerList, type DisclosurePickerListProps, DisclosurePickerOption, type DisclosurePickerOptionProps, DisclosurePickerPanel, type DisclosurePickerPanelProps, type DisclosurePickerProps, type DisclosurePickerSearch, DisclosurePickerTrigger, type DisclosurePickerTriggerProps, EmptyState, type EmptyStateProps, Entity, type EntityProps, Feedback, type FeedbackData, type FeedbackProps, type FeedbackRating, Field, type FieldProps, Fieldset, FieldsetContent, FieldsetDescription, FieldsetFooter, FieldsetLegend, type FieldsetVariant, FileDropzone, type FileDropzoneProps, type FileRejection, type FileRejectionCode, FontPicker, type FontPickerFont, type FontPickerOption, type FontPickerProps, Form, type FormProps, GlidingHighlight, type GlidingHighlightProps, GradientArt, type GradientArtProps, type Hsv, InlineStatus, type InlineStatusProps, type StatusTone as InlineTone, Input, type InputProps$1 as InputProps, Kbd, KbdGroup, type KbdGroupProps, type KbdProps, Label, type LabelProps$2 as LabelProps, LineChart, type LineChartProps, Marker, type MarkerProps, Marquee, type MarqueeProps, MediaImage, type MediaImageProps, MediaTile, type MediaTileProps, Menu, MenuCheckboxItem, MenuContent, MenuGroup, MenuGroupLabel, MenuItem, MenuPortal, MenuRadioGroup, MenuRadioItem, MenuSeparator, MenuSubmenu, MenuSubmenuTrigger, MenuTrigger, Message, type MessageProps, MessageScroller, type MessageScrollerHandle, type MessageScrollerProps, Meter, MeterIndicator, MeterLabel, type MeterSize, type MeterTone, MeterTrack, MeterValue, MiddleTruncate, type MiddleTruncateProps, type MotionPolicy, MotionProvider, type MotionProviderProps, Note, type NoteAction, type NoteProps, NotificationBadge, type NotificationBadgeProps, NumberField, type NumberFieldProps, type OrbMode, type OrbSize, OtpField, type OtpFieldProps, OverflowMenu, type OverflowMenuProps, PALETTE_COLORS, PALETTE_FAMILIES, PALETTE_SCALES, PALETTE_STEPS, PALETTE_TONES, PageHeader, type PageHeaderProps, PageLoader, type PageLoaderProps, Pagination, type PaginationProps, type PaletteColor, type PaletteFamily, type PaletteStep, Panel, PanelGroup, PanelResizer, type PanelResizerProps, PanelSection, type PanelWidthBounds, Phone, type PhoneProps, PieChart, type PieChartProps, Pill, type PillProps, Popover, PopoverArrow, PopoverClose, PopoverContent, PopoverDescription, PopoverPortal, PopoverTitle, PopoverTrigger, Presence, type PresenceProps, type Presentation, PresentationProvider, Progress, ProgressIndicator, ProgressLabel, type ProgressSize, ProgressTrack, ProgressValue, PropertyPair, PropertyRow, RadarChart, type RadarChartProps, RadialChart, type RadialChartProps, Radio, RadioCard, type RadioCardProps, type RadioCardTone, RadioGroup, RelativeTime, type RelativeTimeProps, Reveal, type RevealProps, type Rgb, SABLE_UI_VERSION, SEGMENTED_BAR_TONES, STATUS_TONES, STATUS_TONE_ICON, type ScrollCommandOptions, Scroller, type ScrollerProps, ScrubField, type ScrubFieldProps, SearchInput, type SearchInputProps, SectionHeader, type SectionHeaderProps, SegmentedBar, type SegmentedBarProps, type SegmentedBarSegment, type SegmentedBarTone, Select, SelectContent, SelectGroup, SelectGroupLabel, SelectItem, SelectPortal, SelectSeparator, SelectTrigger, SelectValue, Separator, type SeparatorProps$3 as SeparatorProps, SettingsMenu, type SettingsMenuProps, SettingsRow, type SettingsRowProps, Sheet, SheetClose, SheetContent, SheetDescription, SheetFooter, SheetHeader, SheetList, SheetPortal, SheetTitle, SheetTrigger, ShowMore, type ShowMoreProps, SideNav, type SideNavActiveVariant, SideNavGroup, type SideNavGroupProps, SideNavItem, type SideNavItemProps, type SideNavProps, type SideNavSize, Sidebar, SidebarBrand, type SidebarBrandProps, SidebarFooter, SidebarHeader, SidebarItem, type SidebarItemProps, SidebarNav, type SidebarProps, SimpleTooltip, Skeleton, SkipLink, Slider, SliderControl, SliderIndicator, SliderRoot, SliderThumb, SliderTrack, SliderValue, Sparkline, type SparklineProps, Spinner, type SpinnerProps, StatusBar, StatusBarGroup, StatusBarSeparator, StatusDot, type StatusDotProps, type StatusTone, type StepStatus, Stepper, StepperItem, type StepperItemProps, type StepperOrientation, type StepperProps, StreamingText, type StreamingTextProps, Switch, TRANSPARENT, Table, TableBody, TableCaption, TableCell, TableFooter, TableHead, TableHeader, TableRow, Tabs, TabsPanel as TabsContent, TabsList, TabsPanel, TabsTrigger, TextReveal, type TextRevealProps, Textarea, type TextareaProps, ThemeId, ThemeManifest, ThemeMode$1 as ThemeManifestMode, type ThemeMode, ThemePreview, type ThemePreviewProps, ThemeSelector, type ThemeSelectorProps, ThemeSwitcher, type ThemeSwitcherProps, ThinkingOrb, type ThinkingOrbProps, ToastAction, type ToastApi, ToastClose, ToastContent, ToastDescription, type ToastManagerApi, type ToastOptions, type ToastPosition, ToastProvider, type ToastProviderProps, ToastRoot, ToastTitle, type ToastType, ToastViewport, Toggle, ToggleGroup, type ToggleGroupAppearance, Toggle as ToggleGroupItem, Toolbar, ToolbarButton, type ToolbarButtonProps, ToolbarGroup, type ToolbarGroupProps, ToolbarInput, type ToolbarInputProps, ToolbarLink, type ToolbarLinkProps, type ToolbarProps, ToolbarSeparator, type ToolbarSeparatorProps, Tooltip, TooltipArrow, TooltipContent, TooltipPortal, TooltipProvider, TooltipTrigger, Tree, TreeAddRow, TreeEmpty, TreeRow, TreeSection, type UseCopyOptions, type UseCopyResult, type UseInViewOptions, type UsePanelWidthOptions, Video, type VideoProps, ViewTransitionName, type ViewTransitionNameProps, Workspace, WorkspaceBar, WorkspaceCanvas, accordionMeta, appHeaderMeta, appShellMeta, areaChartMeta, attachmentMeta, avatarGroupVariants, avatarMeta, avatarVariants, badgeMeta, badgeVariants, bannerMeta, bannerVariants, barChartMeta, bottomNavMeta, breadcrumbsMeta, browserMeta, bubbleMeta, buttonMeta, buttonVariants, calendarMeta, cardMeta, carouselMeta, chartColor, toneColor as chartToneColor, chatComposerMeta, checkboxCardMeta, checkboxMeta, cn, codeBlockMeta, codeMeta, collapsibleMeta, colorFieldMeta, comboboxMeta, commandMenuMeta, componentGuidance, componentLabel, componentSlug, componentsInGroup, contextCardMeta, contextMenuMeta, dataTableMeta, datePickerMeta, dateTileMeta, destructiveActionModalMeta, dialogMeta, disclosurePickerMeta, emptyStateMeta, entityMeta, feedbackMeta, fieldsetMeta, fileDropzoneMeta, fileDropzoneVariants, fontPickerMeta, formMeta, formatFileSize, formatHex, glidingHighlightMeta, gradientArtMeta, hsvToRgb, hueColor, inlineStatusMeta, inputMeta, isPaletteColor, isTransparent, kbdMeta, labelMeta, lineChartMeta, markerMeta, marqueeMeta, mediaImageMeta, mediaTileMeta, menuMeta, messageMeta, messageScrollerMeta, meterIndicatorVariants, meterMeta, meterTrackVariants, middleTruncateMeta, noteMeta, noteVariants, notificationBadgeMeta, notificationCountVariants, notificationDotVariants, numberFieldMeta, otpFieldMeta, overflowMenuMeta, pageHeaderMeta, pageLoaderMeta, paginationMeta, panelGroupMeta, panelSectionMeta, parseHex, phoneMeta, pieChartMeta, pillMeta, pillVariants, popoverMeta, progressMeta, progressTrackVariants, radarChartMeta, radialChartMeta, radioCardMeta, radioMeta, relativeTimeMeta, rgbToHsv, scrollerMeta, scrubFieldMeta, searchInputMeta, sectionHeaderMeta, segmentedBarMeta, segmentedBarSegmentVariants, segmentedBarVariants, selectMeta, separatorMeta, settingsMenuMeta, sheetMeta, sheetVariants, showMoreMeta, sideNavMeta, sidebarMeta, skeletonMeta, sliderMeta, sparklineMeta, spinnerMeta, startViewTransition, statusBarMeta, statusDotMeta, statusDotVariants, stepperConnectorVariants, stepperIndicatorVariants, stepperMeta, streamingTextMeta, supportsViewTransitions, switchMeta, tableMeta, tabsMeta, textareaMeta, themeSelectorMeta, themeSwitcherMeta, thinkingOrbMeta, toast, toastMeta, toggleMeta, toolbarGroupVariants, toolbarMeta, toolbarSeparatorVariants, toolbarVariants, tooltipMeta, treeIndent, treeMeta, useAnchoredDensity, useComboboxFilteredItems, useCommandMenuShortcut, useCopy, useDensity, useDisclosurePicker, useInView, useMotion, usePanelWidth, usePresentation, useReducedMotion, useScrollActivity, useSidebar, useToast, useToastManager, useTypeTier, videoMeta, workspaceMeta };
+export { Accordion, AccordionItem, AccordionPanel, AccordionTrigger, AlertDialog, AlertDialogClose, AlertDialogContent, AlertDialogDescription, AlertDialogFooter, AlertDialogHeader, AlertDialogOverlay, AlertDialogTitle, AlertDialogTrigger, AppHeader, type AppHeaderProps, AppShell, type AppShellProps, AreaChart, type AreaChartProps, type ArtTone, Attachment, type AttachmentProps, Avatar, AvatarFallback, AvatarGroup, AvatarGroupCount, type AvatarGroupCountProps, type AvatarGroupProps, AvatarImage, type AvatarProps, AvatarRoot, BADGE_APPEARANCES, BADGE_TONES, Badge, type BadgeAppearance, type BadgeProps, type BadgeTone, Banner, type BannerProps, BarChart, type BarChartProps, BottomNav, BottomNavItem, type BottomNavItemProps, BreadcrumbItem, type BreadcrumbItemProps, BreadcrumbLink, type BreadcrumbLinkProps, BreadcrumbPage, type BreadcrumbPageProps, BreadcrumbSeparator, type BreadcrumbSeparatorProps, Breadcrumbs, type BreadcrumbsProps, Browser, type BrowserProps, Bubble, type BubbleProps, BubbleReaction, type BubbleReactionProps, BubbleReactions, type BubbleReactionsProps, Button, type ButtonBleed, ButtonGroup, type ButtonGroupProps, type ButtonProps, CHART_SERIES_COUNT, COMPONENT_GROUPS, COMPONENT_TAXONOMY, Calendar, type CalendarProps, Card, CardAction, CardContent, type CardContentProps, CardDescription, CardFooter, type CardFooterProps, CardHeader, CardList, type CardProps, CardTitle, type CardTitleProps, CaretMenu, CaretMenuItem, type CaretMenuItemProps, type CaretMenuProps, type CaretTrigger, type CaretTriggerField, type CaretTriggerMatch, Carousel, type CarouselProps, type CarouselSlidesToShow, type ChartCategories, type ChartCenterLabel, type ChartCurve, type ChartDatum, type ChartSeries, type ChartTone, type ChartTooltipIndicator, type ChartTooltipOptions, type ChartValueFormatter, ChatComposer, type ChatComposerProps, Checkbox, CheckboxCard, type CheckboxCardProps, type CheckboxCardTone, CheckboxGroup, type CheckboxGroupProps, Code, CodeBlock, type CodeBlockProps, CodeHighlightProvider, type CodeHighlighter, type CodeProps, Collapsible, CollapsibleIndicator, CollapsiblePanel, CollapsibleTrigger, ColorField, type ColorFieldProps, Combobox, ComboboxChips, ComboboxClear, ComboboxContent, ComboboxEmpty, ComboboxGroup, ComboboxGroupLabel, ComboboxInput, ComboboxItem, type ComboboxItemGroup, ComboboxItemIndicator, ComboboxList, ComboboxPortal, type ComboboxProps, ComboboxValue, ComboboxVirtualList, type ComboboxVirtualListProps, type CommandFilter, type CommandItem, CommandMenu, CommandMenuGroup, type CommandMenuGroupProps, CommandMenuItem, type CommandMenuItemProps, CommandMenuPanel, type CommandMenuPanelProps, type CommandMenuProps, CommandMenuTrigger, type CommandMenuTriggerProps, type ComponentGroup, type ComponentGuidance, ComponentMeta, type ComponentRegister, type ConstraintFlag, ContextCard, ContextCardArrow, ContextCardContent, ContextCardPortal, ContextCardTrigger, ContextMenu, ContextMenuContent, ContextMenuGroup, ContextMenuGroupLabel, ContextMenuItem, ContextMenuPortal, ContextMenuSeparator, ContextMenuTrigger, type CopySource, DataTable, type DataTableColumn, type DataTableProps, type DataTableRowKey, DatePicker, type DatePickerProps, DateTile, type DateTileProps, Density, DensityProvider, Density as DensityValue, DestructiveActionModal, type DestructiveActionModalProps, Dialog, DialogClose, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogOverlay, DialogPortal, type DialogSize, DialogTitle, DialogTrigger, DisclosurePicker, DisclosurePickerEmpty, DisclosurePickerList, type DisclosurePickerListProps, DisclosurePickerOption, type DisclosurePickerOptionProps, DisclosurePickerPanel, type DisclosurePickerPanelProps, type DisclosurePickerProps, type DisclosurePickerSearch, DisclosurePickerTrigger, type DisclosurePickerTriggerProps, EmptyState, type EmptyStateProps, Entity, type EntityProps, Feedback, type FeedbackData, type FeedbackProps, type FeedbackRating, Field, type FieldProps, Fieldset, FieldsetContent, FieldsetDescription, FieldsetFooter, FieldsetLegend, type FieldsetVariant, FileDropzone, type FileDropzoneProps, type FileRejection, type FileRejectionCode, FontPicker, type FontPickerFont, type FontPickerOption, type FontPickerProps, Form, type FormProps, GlidingHighlight, type GlidingHighlightProps, GradientArt, type GradientArtProps, type Hsv, InlineStatus, type InlineStatusProps, type StatusTone as InlineTone, Input, InputGroup, type InputGroupProps, type InputProps$1 as InputProps, Kbd, KbdGroup, type KbdGroupProps, type KbdProps, Label, type LabelProps$2 as LabelProps, LineChart, type LineChartProps, Marker, type MarkerProps, Marquee, type MarqueeProps, MediaImage, type MediaImageProps, MediaTile, type MediaTileProps, Menu, MenuCheckboxItem, MenuContent, MenuGroup, MenuGroupLabel, MenuItem, MenuLinkItem, MenuPortal, MenuRadioGroup, MenuRadioItem, MenuSeparator, MenuSubmenu, MenuSubmenuTrigger, MenuTrigger, Menubar, type MenubarProps, MenubarTrigger, type MenubarTriggerProps, Message, type MessageProps, MessageScroller, type MessageScrollerHandle, type MessageScrollerProps, Meter, MeterIndicator, MeterLabel, type MeterSize, type MeterTone, MeterTrack, MeterValue, MiddleTruncate, type MiddleTruncateProps, type MotionPolicy, MotionProvider, type MotionProviderProps, NavigationMenu, NavigationMenuContent, NavigationMenuItem, NavigationMenuLink, NavigationMenuList, NavigationMenuTrigger, Note, type NoteAction, type NoteProps, NotificationBadge, type NotificationBadgeProps, NumberField, type NumberFieldProps, type OrbMode, type OrbSize, OtpField, type OtpFieldProps, OverflowMenu, type OverflowMenuProps, PALETTE_COLORS, PALETTE_FAMILIES, PALETTE_SCALES, PALETTE_STEPS, PALETTE_TONES, PageHeader, type PageHeaderProps, PageLoader, type PageLoaderProps, Pagination, type PaginationProps, type PaletteColor, type PaletteFamily, type PaletteStep, Panel, PanelGroup, PanelResizer, type PanelResizerProps, PanelSection, type PanelWidthBounds, Phone, type PhoneProps, PieChart, type PieChartProps, Pill, type PillProps, Popover, PopoverArrow, PopoverClose, PopoverContent, PopoverDescription, PopoverPortal, PopoverTitle, PopoverTrigger, Presence, type PresenceProps, type Presentation, PresentationProvider, Progress, ProgressIndicator, ProgressLabel, type ProgressSize, ProgressTrack, ProgressValue, PropertyGroup, PropertyPair, PropertyRow, RadarChart, type RadarChartProps, RadialChart, type RadialChartProps, Radio, RadioCard, type RadioCardProps, type RadioCardTone, RadioGroup, RelativeTime, type RelativeTimeProps, Reveal, type RevealProps, type Rgb, SABLE_UI_VERSION, SEGMENTED_BAR_TONES, STATUS_TONES, STATUS_TONE_ICON, type ScrollCommandOptions, Scroller, type ScrollerProps, ScrubField, type ScrubFieldProps, SearchInput, type SearchInputProps, SectionHeader, type SectionHeaderProps, SegmentedBar, type SegmentedBarProps, type SegmentedBarSegment, type SegmentedBarTone, Select, SelectContent, SelectGroup, SelectGroupLabel, SelectItem, SelectPortal, SelectSeparator, SelectTrigger, SelectValue, Separator, type SeparatorProps$2 as SeparatorProps, SettingsMenu, type SettingsMenuProps, SettingsRow, type SettingsRowProps, Sheet, SheetClose, SheetContent, SheetDescription, SheetFooter, SheetHeader, SheetList, SheetPortal, type SheetProps, type SheetSnapPoint, SheetTitle, SheetTrigger, ShowMore, type ShowMoreProps, SideNav, type SideNavActiveVariant, SideNavGroup, type SideNavGroupProps, SideNavItem, type SideNavItemProps, type SideNavProps, type SideNavSize, Sidebar, SidebarBrand, type SidebarBrandProps, SidebarFooter, SidebarHeader, SidebarItem, type SidebarItemProps, SidebarNav, type SidebarProps, SimpleTooltip, Skeleton, SkipLink, Slider, SliderControl, SliderIndicator, SliderRoot, SliderThumb, SliderTrack, SliderValue, type SmoothWheelOptions, Sparkline, type SparklineProps, Spinner, type SpinnerProps, StatusBar, StatusBarGroup, StatusBarSeparator, StatusDot, type StatusDotProps, type StatusTone, type StepStatus, Stepper, StepperItem, type StepperItemProps, type StepperOrientation, type StepperProps, StreamingText, type StreamingTextProps, Switch, TRANSPARENT, Table, TableBody, TableCaption, TableCell, TableFooter, TableHead, TableHeader, TableRow, Tabs, TabsPanel as TabsContent, TabsList, TabsPanel, TabsTrigger, TextReveal, type TextRevealProps, Textarea, type TextareaProps, ThemeId, ThemeManifest, ThemeMode$1 as ThemeManifestMode, type ThemeMode, ThemePreview, type ThemePreviewProps, ThemeSelector, type ThemeSelectorProps, ThemeSwitcher, type ThemeSwitcherProps, ThinkingOrb, type ThinkingOrbProps, ToastAction, type ToastApi, ToastClose, ToastContent, ToastDescription, type ToastManagerApi, type ToastOptions, type ToastPosition, ToastProvider, type ToastProviderProps, ToastRoot, ToastTitle, type ToastType, ToastViewport, Toggle, ToggleGroup, type ToggleGroupAppearance, Toggle as ToggleGroupItem, Toolbar, ToolbarButton, type ToolbarButtonProps, ToolbarGroup, type ToolbarGroupProps, ToolbarInput, type ToolbarInputProps, ToolbarLink, type ToolbarLinkProps, type ToolbarProps, ToolbarSeparator, type ToolbarSeparatorProps, Tooltip, TooltipArrow, TooltipContent, TooltipPortal, TooltipProvider, TooltipTrigger, Tree, TreeAddRow, TreeEmpty, TreeRow, TreeSection, type UseCaretTriggerOptions, type UseCaretTriggerResult, type UseCopyOptions, type UseCopyResult, type UseInViewOptions, type UsePanelWidthOptions, Video, type VideoProps, ViewTransitionName, type ViewTransitionNameProps, Workspace, WorkspaceBar, WorkspaceCanvas, accordionMeta, appHeaderMeta, appShellMeta, areaChartMeta, attachmentMeta, avatarGroupVariants, avatarMeta, avatarVariants, badgeMeta, badgeVariants, bannerMeta, bannerVariants, barChartMeta, bottomNavMeta, breadcrumbsMeta, browserMeta, bubbleMeta, buttonGroupMeta, buttonMeta, buttonVariants, calendarMeta, cardMeta, caretMenuMeta, carouselMeta, chartColor, toneColor as chartToneColor, chatComposerMeta, checkboxCardMeta, checkboxMeta, cn, codeBlockMeta, codeMeta, collapsibleMeta, colorFieldMeta, comboboxMeta, commandMenuMeta, componentGuidance, componentLabel, componentSlug, componentsInGroup, contextCardMeta, contextMenuMeta, dataTableMeta, datePickerMeta, dateTileMeta, destructiveActionModalMeta, dialogMeta, disclosurePickerMeta, emptyStateMeta, entityMeta, feedbackMeta, fieldsetMeta, fileDropzoneMeta, fileDropzoneVariants, fontPickerMeta, formMeta, formatFileSize, formatHex, glidingHighlightMeta, gradientArtMeta, hsvToRgb, hueColor, inlineStatusMeta, inputGroupMeta, inputMeta, isPaletteColor, isTransparent, kbdMeta, labelMeta, lineChartMeta, markerMeta, marqueeMeta, mediaImageMeta, mediaTileMeta, menuMeta, menubarMeta, messageMeta, messageScrollerMeta, meterIndicatorVariants, meterMeta, meterTrackVariants, middleTruncateMeta, navigationMenuMeta, noteMeta, noteVariants, notificationBadgeMeta, notificationCountVariants, notificationDotVariants, numberFieldMeta, otpFieldMeta, overflowMenuMeta, pageHeaderMeta, pageLoaderMeta, paginationMeta, panelGroupMeta, panelSectionMeta, parseHex, phoneMeta, pieChartMeta, pillMeta, pillVariants, popoverMeta, progressMeta, progressTrackVariants, radarChartMeta, radialChartMeta, radioCardMeta, radioMeta, relativeTimeMeta, rgbToHsv, scrollerMeta, scrubFieldMeta, searchInputMeta, sectionHeaderMeta, segmentedBarMeta, segmentedBarSegmentVariants, segmentedBarVariants, selectMeta, separatorMeta, settingsMenuMeta, sheetMeta, sheetVariants, showMoreMeta, sideNavMeta, sidebarMeta, skeletonMeta, sliderMeta, sparklineMeta, spinnerMeta, startViewTransition, statusBarMeta, statusDotMeta, statusDotVariants, stepperConnectorVariants, stepperIndicatorVariants, stepperMeta, streamingTextMeta, supportsViewTransitions, switchMeta, tableMeta, tabsMeta, textareaMeta, themeSelectorMeta, themeSwitcherMeta, thinkingOrbMeta, toast, toastMeta, toggleMeta, toolbarGroupVariants, toolbarMeta, toolbarSeparatorVariants, toolbarVariants, tooltipMeta, treeIndent, treeMeta, useAnchoredDensity, useCaretTrigger, useComboboxFilteredItems, useCommandMenuShortcut, useCopy, useDensity, useDisclosurePicker, useInView, useMotion, usePanelWidth, usePresentation, useReducedMotion, useScrollActivity, useSidebar, useSmoothWheel, useToast, useToastManager, useTypeTier, videoMeta, workspaceMeta };