@salemcobalt/ui 0.2.0-rc.2 → 0.2.0-rc.20

package/dist/index.d.ts

@@ -1,5 +1,5 @@
 import * as react from 'react';
-import { ComponentPropsWithRef, ReactNode, ReactElement, CSSProperties } from 'react';
+import { ComponentPropsWithRef, ReactNode, ReactElement, CSSProperties, MouseEvent, MouseEventHandler } from 'react';
 import { useRender } from '@base-ui/react/use-render';
 import { Dialog as Dialog$1 } from '@base-ui/react/dialog';
 import * as _base_ui_react from '@base-ui/react';
@@ -8,6 +8,7 @@ import { Checkbox as Checkbox$1 } from '@base-ui/react/checkbox';
 import { Switch as Switch$1 } from '@base-ui/react/switch';
 import { Tabs as Tabs$1 } from '@base-ui/react/tabs';
 import { Toolbar as Toolbar$1 } from '@base-ui/react/toolbar';
+import { Popover as Popover$1 } from '@base-ui/react/popover';
 
 type ButtonVariant = 'primary' | 'secondary' | 'ghost' | 'danger';
 type ButtonSize = 'sm' | 'md' | 'lg';
@@ -24,9 +25,13 @@ interface ButtonProps extends ComponentPropsWithRef<'button'> {
     loading?: boolean | undefined;
     /** Stretches to the container. */
     fullWidth?: boolean | undefined;
+    /** A keyboard hint after the label: `shortcut={<Kbd>N</Kbd>}`. Hidden from assistive tech; announce the key with `aria-keyshortcuts="n"`. Not shown on devices with no fine pointer (touch only). */
+    shortcut?: ReactNode | undefined;
+    /** Shows only `iconStart` (or `iconEnd`) in a square button; the label stays the accessible name and the shortcut hides. Toggles without remounting, e.g. when a header runs out of room. Pair with a Tooltip carrying the label. */
+    iconOnly?: boolean | undefined;
 }
 /** The one way to trigger an action. Renders a native `<button>`; `type` defaults to `button`. */
-declare function Button({ variant, size, iconStart, iconEnd, loading, fullWidth, type, className, children, onClick, ...rest }: ButtonProps): react.JSX.Element;
+declare function Button({ variant, size, iconStart, iconEnd, loading, fullWidth, shortcut, iconOnly, type, className, children, onClick, ...rest }: ButtonProps): react.JSX.Element;
 
 type BadgeTone = 'neutral' | 'accent' | 'success' | 'warning' | 'danger' | 'info';
 type BadgeVariant = 'soft' | 'solid' | 'outline';
@@ -44,19 +49,19 @@ interface BadgeProps extends ComponentPropsWithRef<'span'> {
 /** One or two words of status beside a thing. Text only; never clickable. */
 declare function Badge({ tone, variant, size, dot, className, children, ...rest }: BadgeProps): react.JSX.Element;
 
-type CardVariant = 'outlined' | 'elevated' | 'filled';
+type CardVariant = 'outlined' | 'elevated' | 'filled' | 'plain';
 type CardPadding = 'none' | 'sm' | 'md' | 'lg';
-type CardElement = 'div' | 'article' | 'section' | 'li' | 'a' | 'button';
+type CardElement = 'div' | 'article' | 'section' | 'nav' | 'li' | 'a' | 'button';
 interface CardProps extends useRender.ComponentProps<'div'> {
-    /** `outlined` hairline (default), `elevated` floats, `filled` is an inset region. */
+    /** `outlined` hairline (default), `elevated` floats, `filled` is an inset region, `plain` has no surface: a quiet list row that washes on hover and takes the accent wash and border when selected. */
     variant?: CardVariant | undefined;
     /** `none`, `sm` 12px, `md` 16px (default), `lg` 24px. */
     padding?: CardPadding | undefined;
     /** Hover lifts the card and the whole card is the target. Render it as `a` or `button` so it is a real control. */
     interactive?: boolean | undefined;
-    /** Accent border with a 1px inset, for the active row or chosen option. */
+    /** Accent border with a 1px inset, for the active row or chosen option; on `plain`, the accent wash with a 1px accent border. Also recolours a Score inside. Visual only: pair it with `aria-pressed`, `aria-selected` or `aria-current`. */
     selected?: boolean | undefined;
-    /** Element to render when `render` is not given. */
+    /** Element to render when `render` is not given. Use `nav` (with an `aria-label`) for a carded navigation landmark. */
     as?: CardElement | undefined;
 }
 /** A bordered surface that groups related content. Compose the inside with Stack and Inline. */
@@ -694,6 +699,9 @@ declare const Kbd: typeof KbdBase & {
 };
 
 type DialogSize = 'sm' | 'md' | 'lg';
+type DialogVariant = 'dialog' | 'sheet' | 'fullscreen';
+/** How a person asked to close: Esc, a press on the backdrop, or a `Dialog.Close`. */
+type DialogCloseRequestReason = 'escape-key' | 'outside-press' | 'close-press';
 interface DialogRootProps {
     /** Controlled open state. */
     open?: boolean | undefined;
@@ -703,30 +711,53 @@ interface DialogRootProps {
     onOpenChange?: ((open: boolean) => void) | undefined;
     /** When `false`, Esc and backdrop clicks no longer close the dialog. Default `true`. */
     dismissible?: boolean | undefined;
+    /**
+     * When set, the dialog no longer closes itself: Esc, a backdrop press and every `Dialog.Close` call
+     * this with the reason instead, and the app closes it by setting `open` to `false` (for example after
+     * a "Leave for now?" confirmation). Use with a controlled `open`. `dismissible={false}` still swallows
+     * Esc and backdrop presses first.
+     */
+    onRequestClose?: ((reason: DialogCloseRequestReason) => void) | undefined;
     children?: ReactNode | undefined;
 }
 /** Owns the open state. Wrap a `Dialog.Trigger` and a `Dialog.Content`. */
-declare function Root$4({ dismissible, onOpenChange, open, defaultOpen, children }: DialogRootProps): react.JSX.Element;
+declare function Root$6({ dismissible, onOpenChange, onRequestClose, open, defaultOpen, children, }: DialogRootProps): react.JSX.Element;
 interface DialogContentProps extends Omit<Dialog$1.Popup.Props, 'className'> {
-    /** `sm` 400px for yes/no, `md` 560px (default) for a short form, `lg` 720px rarely. */
+    /**
+     * Maximum width: `sm` 400px for yes/no, `md` 560px (default) for a short form, `lg` 720px rarely.
+     * Every size clamps to the viewport minus a 16px gutter, so a 390px phone gets a 358px dialog.
+     */
     size?: DialogSize | undefined;
+    /**
+     * `dialog` (default) centres the popup. `sheet` is the same on wide viewports but below 640px it
+     * becomes a bottom sheet: full width, rounded top, title and actions pinned while `Dialog.Body`
+     * scrolls, padding that clears the home indicator. Use it for forms and pickers opened from a list.
+     * `fullscreen` covers the viewport (inset by 16px with a rounded edge from 900px), slides in from the
+     * inline end, keeps clear of the safe areas, and lets `Dialog.Body` scroll between a pinned title and
+     * actions; `size` is ignored. It is the surface of `FullScreenFlow`. Pair it with `onRequestClose` on
+     * the Root when leaving needs a confirmation.
+     */
+    variant?: DialogVariant | undefined;
     className?: string | undefined;
 }
-/** Portal, backdrop and the popup. Focus moves inside on open and returns to the trigger on close. */
-declare function Content$1({ size, className, children, ...rest }: DialogContentProps): react.JSX.Element;
+/**
+ * Portal, backdrop and the popup. Focus moves inside on open and returns to the trigger on close.
+ * Menus, selects and tooltips opened from inside render above it (`--sc-z-dropdown` > `--sc-z-dialog`).
+ */
+declare function Content$2({ size, variant, className, children, ...rest }: DialogContentProps): react.JSX.Element;
 interface DialogTitleProps extends Omit<Dialog$1.Title.Props, 'className'> {
     className?: string | undefined;
 }
 /** Required. Labels the dialog; a question or a statement. Renders an `<h2>`. */
-declare function Title({ className, ...rest }: DialogTitleProps): react.JSX.Element;
+declare function Title$1({ className, ...rest }: DialogTitleProps): react.JSX.Element;
 interface DialogDescriptionProps extends Omit<Dialog$1.Description.Props, 'className'> {
     className?: string | undefined;
 }
 /** Optional, muted. Says what will happen. */
-declare function Description({ className, ...rest }: DialogDescriptionProps): react.JSX.Element;
+declare function Description$1({ className, ...rest }: DialogDescriptionProps): react.JSX.Element;
 type DialogBodyProps = ComponentPropsWithRef<'div'>;
-/** Free content between the description and the actions. */
-declare function Body$1({ className, ...rest }: DialogBodyProps): react.JSX.Element;
+/** Free content between the description and the actions. In a `sheet` it is the part that scrolls. */
+declare function Body$2({ className, ...rest }: DialogBodyProps): react.JSX.Element;
 type DialogActionsProps = Omit<InlineProps, 'justify'>;
 /** Right-aligned row of Buttons. Put the confirming action last. */
 declare function Actions({ className, ...rest }: DialogActionsProps): react.JSX.Element;
@@ -734,17 +765,17 @@ interface DialogCloseProps extends Omit<Dialog$1.Close.Props, 'className'> {
     className?: string | undefined;
 }
 /** With no children or `render`, the × in the corner. Otherwise wraps any Button: `<Dialog.Close render={<Button variant="secondary" />}>Cancel</Dialog.Close>`. */
-declare function Close({ className, children, render, ...rest }: DialogCloseProps): react.JSX.Element;
+declare function Close$1({ className, children, render, ...rest }: DialogCloseProps): react.JSX.Element;
 /** A modal that interrupts for a decision or a short form. Built on Base UI's Dialog. */
 declare const Dialog: {
-    Root: typeof Root$4;
+    Root: typeof Root$6;
     Trigger: Dialog$1.Trigger;
-    Content: typeof Content$1;
-    Title: typeof Title;
-    Description: typeof Description;
-    Body: typeof Body$1;
+    Content: typeof Content$2;
+    Title: typeof Title$1;
+    Description: typeof Description$1;
+    Body: typeof Body$2;
     Actions: typeof Actions;
-    Close: typeof Close;
+    Close: typeof Close$1;
 };
 
 type IconSize = 'xs' | 'sm' | 'md' | 'lg' | 'xl' | 'em';
@@ -901,7 +932,8 @@ declare const Tooltip: typeof TooltipBase & {
     Provider: react.FC<_base_ui_react.TooltipProviderProps>;
 };
 
-interface IconButtonProps extends Omit<ComponentPropsWithRef<'button'>, 'children' | 'aria-label'> {
+type IconButtonDotTone = 'neutral' | 'accent' | 'success' | 'warning' | 'danger' | 'info';
+interface IconButtonProps extends Omit<useRender.ComponentProps<'button'>, 'children' | 'aria-label'> {
     /** Required. The accessible name, and the tooltip text when `tooltip` is `true`. */
     label: string;
     /** The icon, usually a shipped `<Name>Icon`. It is decorative; `label` names the button. Optional only so a popup trigger can supply it through `render`. */
@@ -918,9 +950,15 @@ interface IconButtonProps extends Omit<ComponentPropsWithRef<'button'>, 'childre
     round?: boolean | undefined;
     /** Shows a spinner, sets `aria-busy` and ignores clicks. */
     loading?: boolean | undefined;
+    /** A status dot in the top-left corner, ringed in `--sc-icon-button-dot-ring` (default `surface-default`). Decorative: put the status in `label` too ("Sweeps: paused"). */
+    dot?: IconButtonDotTone | undefined;
 }
-/** A square Button for one icon. Always named by `label`; use `tooltip` to show that name on hover. */
-declare function IconButton({ label, children, variant, size, tooltip, tooltipSide, round, loading, type, className, onClick, ...rest }: IconButtonProps): react.JSX.Element;
+/**
+ * A square Button for one icon. Always named by `label`; use `tooltip` to show that name on hover.
+ * Renders a `<button>` unless `render` gives another element: `render={<a href="/settings" />}` or a
+ * Next.js `<Link href="/settings" />` makes it a link with the same look and name.
+ */
+declare function IconButton({ label, children, variant, size, tooltip, tooltipSide, round, loading, dot, type, className, onClick, render, ref, ...rest }: IconButtonProps): react.JSX.Element;
 
 type MenuSide = 'top' | 'bottom' | 'left' | 'right';
 type MenuAlign = 'start' | 'center' | 'end';
@@ -939,7 +977,7 @@ interface MenuRootProps {
     children?: ReactNode | undefined;
 }
 /** Owns the open state. Wrap a `Menu.Trigger` and a `Menu.Content`. */
-declare function Root$3({ open, defaultOpen, onOpenChange, disabled, modal, children }: MenuRootProps): react.JSX.Element;
+declare function Root$5({ open, defaultOpen, onOpenChange, disabled, modal, children }: MenuRootProps): react.JSX.Element;
 interface MenuTriggerProps extends Omit<Menu$1.Trigger.Props, 'className'> {
     className?: string | undefined;
 }
@@ -947,7 +985,7 @@ interface MenuTriggerProps extends Omit<Menu$1.Trigger.Props, 'className'> {
  * Opens the menu. With no `render` it is a secondary Button with a chevron; pass any Button or
  * IconButton through `render`: `<Menu.Trigger render={<IconButton label="More" />}><MoreHorizontalIcon /></Menu.Trigger>`.
  */
-declare function Trigger({ render, className, children, ...rest }: MenuTriggerProps): react.JSX.Element;
+declare function Trigger$1({ render, className, children, ...rest }: MenuTriggerProps): react.JSX.Element;
 interface MenuContentProps extends Omit<Menu$1.Popup.Props, 'className'> {
     /** Side of the trigger the menu opens on; flips when there is no room. Default `bottom`. */
     side?: MenuSide | undefined;
@@ -958,7 +996,7 @@ interface MenuContentProps extends Omit<Menu$1.Popup.Props, 'className'> {
     className?: string | undefined;
 }
 /** Portal, positioner and the popup. Items go inside. */
-declare function Content({ side, align, sideOffset, className, children, ...rest }: MenuContentProps): react.JSX.Element;
+declare function Content$1({ side, align, sideOffset, className, children, ...rest }: MenuContentProps): react.JSX.Element;
 interface ItemSlots {
     /** A 16px icon before the label. */
     icon?: ReactNode | undefined;
@@ -975,8 +1013,11 @@ declare function Item({ icon, trailing, tone, className, children, ...rest }: Me
 interface MenuLinkItemProps extends Omit<Menu$1.LinkItem.Props, 'className'>, ItemSlots {
     className?: string | undefined;
 }
-/** An item that navigates: renders an `<a href>`. */
-declare function LinkItem({ icon, trailing, tone, className, children, ...rest }: MenuLinkItemProps): react.JSX.Element;
+/**
+ * An item that navigates: renders an `<a href>`. Closes the menu when chosen, like `Menu.Item`: with client-side
+ * routing the page stays mounted, so an open menu would sit over the new page. Pass `closeOnClick={false}` to keep it.
+ */
+declare function LinkItem({ icon, trailing, tone, className, closeOnClick, children, ...rest }: MenuLinkItemProps): react.JSX.Element;
 interface MenuCheckboxItemProps extends Omit<Menu$1.CheckboxItem.Props, 'className' | 'onCheckedChange'> {
     /** Called with the next checked state. */
     onCheckedChange?: ((checked: boolean) => void) | undefined;
@@ -1021,9 +1062,9 @@ interface MenuSeparatorProps extends Omit<Menu$1.Separator.Props, 'className'> {
 declare function Separator$1({ className, ...rest }: MenuSeparatorProps): react.JSX.Element;
 /** A dropdown of actions on a trigger, with full keyboard support. Built on Base UI's Menu. */
 declare const Menu: {
-    Root: typeof Root$3;
-    Trigger: typeof Trigger;
-    Content: typeof Content;
+    Root: typeof Root$5;
+    Trigger: typeof Trigger$1;
+    Content: typeof Content$1;
     Item: typeof Item;
     LinkItem: typeof LinkItem;
     CheckboxItem: typeof CheckboxItem;
@@ -1065,19 +1106,30 @@ interface InputProps extends Omit<ComponentPropsWithRef<'input'>, 'size' | 'name
     /** Called with the string value on every change, beside the native `onChange`. */
     onValueChange?: ((value: string) => void) | undefined;
 }
-/** A labelled single-line text field. Renders a native `<input>` inside Base UI's Field. */
+/**
+ * A labelled single-line text field. Renders a native `<input>` inside Base UI's Field, so every native
+ * attribute passes through: `type="date" | "time" | "number" | "url" | …` keep the same height and
+ * `iconStart` slot; `list="id"` with a `<datalist>` beside it gives native suggestions. Date and time
+ * fields show the browser's picker at the end edge, so leave `iconEnd` off those.
+ */
 declare function Input({ label, hideLabel, description, error, invalid, required, disabled, name, size, className, iconStart, iconEnd, onValueChange, ...rest }: InputProps): react.JSX.Element;
 
+type TextareaVariant = 'default' | 'code';
 interface TextareaProps extends Omit<ComponentPropsWithRef<'textarea'>, 'name' | 'disabled' | 'required' | 'className'>, Omit<FieldProps, 'size'> {
     /** Visible lines. Default 3. */
     rows?: number | undefined;
     /** `vertical` (default) lets the user drag it taller; `none` fixes the height. */
     resize?: 'vertical' | 'none' | undefined;
+    /**
+     * `code` for Markdown, JSON and other source: monospace, `tab-size: 2`, spellcheck, autocorrect and
+     * autocapitalize off. Add the native `wrap="off"` to keep long lines on one line and scroll sideways.
+     */
+    variant?: TextareaVariant | undefined;
     /** Called with the string value on every change, beside the native `onChange`. */
     onValueChange?: ((value: string) => void) | undefined;
 }
 /** A labelled multi-line text field. Renders a native `<textarea>` inside Base UI's Field. */
-declare function Textarea({ label, hideLabel, description, error, invalid, required, disabled, name, className, rows, resize, onValueChange, ...rest }: TextareaProps): react.JSX.Element;
+declare function Textarea({ label, hideLabel, description, error, invalid, required, disabled, name, className, rows, resize, variant, onValueChange, spellCheck, autoCorrect, autoCapitalize, ...rest }: TextareaProps): react.JSX.Element;
 
 interface SelectOption<Value extends string = string> {
     value: Value;
@@ -1092,14 +1144,21 @@ interface SelectGroup<Value extends string = string> {
 interface SelectProps<Value extends string = string> extends FieldProps {
     /** Flat options, or groups of options with a heading. */
     options: Array<SelectOption<Value> | SelectGroup<Value>>;
-    /** Controlled value; `null` for none. */
+    /** Controlled value; `null` for none, which shows `placeholder`. No sentinel option needed. */
     value?: Value | null | undefined;
-    /** Initial value when uncontrolled. */
+    /** Initial value when uncontrolled; `null` (default) for none. */
     defaultValue?: Value | null | undefined;
-    /** Called with the chosen value. */
+    /** Called with the chosen value, or `null` when the field is cleared. */
     onValueChange?: ((value: Value | null) => void) | undefined;
     /** Shown in the trigger while nothing is chosen. */
     placeholder?: ReactNode | undefined;
+    /**
+     * Shows an × beside the chevron while a value is chosen; pressing it, or Backspace/Delete on the
+     * focused trigger, sets the value to `null` and calls `onValueChange(null)`.
+     */
+    clearable?: boolean | undefined;
+    /** Accessible name of the clear button. Default "Clear". */
+    clearLabel?: string | undefined;
     /** Prevents choosing a different option. */
     readOnly?: boolean | undefined;
     /** Stretches the trigger to the container. */
@@ -1110,7 +1169,7 @@ interface SelectProps<Value extends string = string> extends FieldProps {
  * A labelled single-choice dropdown. Built on Base UI's Select so the list is styled and keyboard
  * complete; submits like a native select through `name`.
  */
-declare function Select<Value extends string = string>({ label, hideLabel, description, error, invalid, required, disabled, name, size, className, options, value, defaultValue, onValueChange, placeholder, readOnly, fullWidth, id, }: SelectProps<Value>): react.JSX.Element;
+declare function Select<Value extends string = string>({ label, hideLabel, description, error, invalid, required, disabled, name, size, className, options, value, defaultValue, onValueChange, placeholder, clearable, clearLabel, readOnly, fullWidth, id, }: SelectProps<Value>): react.JSX.Element;
 
 interface CheckboxProps extends Omit<Checkbox$1.Root.Props, 'className' | 'onCheckedChange' | 'render' | 'children'> {
     /** Required. The visible label; clicking it toggles the box. */
@@ -1148,16 +1207,19 @@ interface TabsRootProps extends Omit<Tabs$1.Root.Props, 'className' | 'value' |
     className?: string | undefined;
 }
 /** Owns the active tab. Wrap a `Tabs.List` and one `Tabs.Panel` per tab. */
-declare function Root$2({ className, onValueChange, ...rest }: TabsRootProps): react.JSX.Element;
+declare function Root$4({ className, onValueChange, ...rest }: TabsRootProps): react.JSX.Element;
+type TabsListVariant = 'line' | 'segmented';
 interface TabsListProps extends Omit<Tabs$1.List.Props, 'className'> {
     /** Names the set of tabs for assistive tech: "Inbox sections". */
     'aria-label': string;
     /** Tabs share the width equally instead of sizing to their labels. */
     fill?: boolean | undefined;
+    /** `line` (default): an accent underline on the active tab. `segmented`: a quiet segmented control, a sunken track with the active tab raised and no accent colour. */
+    variant?: TabsListVariant | undefined;
     className?: string | undefined;
 }
 /** The row of tabs with the sliding indicator. Arrow keys move between tabs; Enter or Space activates. */
-declare function List({ fill, className, children, ...rest }: TabsListProps): react.JSX.Element;
+declare function List({ fill, variant, className, children, ...rest }: TabsListProps): react.JSX.Element;
 interface TabsTabProps extends Omit<Tabs$1.Tab.Props, 'className' | 'value'> {
     value: string;
     /** A 16px icon before the label. */
@@ -1176,7 +1238,7 @@ interface TabsPanelProps extends Omit<Tabs$1.Panel.Props, 'className' | 'value'>
 declare function Panel({ className, ...rest }: TabsPanelProps): react.JSX.Element;
 /** Switches between sections of one view. Built on Base UI's Tabs. */
 declare const Tabs: {
-    Root: typeof Root$2;
+    Root: typeof Root$4;
     List: typeof List;
     Tab: typeof Tab;
     Panel: typeof Panel;
@@ -1195,7 +1257,7 @@ interface ToolbarRootProps extends Omit<Toolbar$1.Root.Props, 'className'> {
  * A row of controls with one tab stop: Tab enters, arrow keys move between items, Tab leaves. Put every
  * control through `Toolbar.Button` (`render={<IconButton … />}`) so it joins the roving focus.
  */
-declare function Root$1({ wrap, gap, className, ...rest }: ToolbarRootProps): react.JSX.Element;
+declare function Root$3({ wrap, gap, className, ...rest }: ToolbarRootProps): react.JSX.Element;
 interface ToolbarGroupProps extends Omit<Toolbar$1.Group.Props, 'className'> {
     /** Names the group: "Playback". */
     'aria-label'?: string | undefined;
@@ -1213,6 +1275,9 @@ declare function Separator({ className, ...rest }: ToolbarSeparatorProps): react
 interface ToolbarButtonProps extends Omit<Toolbar$1.Button.Props, 'className'> {
     className?: string | undefined;
 }
+interface ToolbarLinkProps extends Omit<Toolbar$1.Link.Props, 'className'> {
+    className?: string | undefined;
+}
 interface ToolbarSpacerProps {
     className?: string | undefined;
 }
@@ -1220,10 +1285,11 @@ interface ToolbarSpacerProps {
 declare function Spacer({ className }: ToolbarSpacerProps): react.JSX.Element;
 /** A horizontal container of controls. Built on Base UI's Toolbar. */
 declare const Toolbar: {
-    Root: typeof Root$1;
+    Root: typeof Root$3;
     Group: typeof Group;
     Separator: typeof Separator;
     Button: react.ForwardRefExoticComponent<Omit<_base_ui_react.ToolbarButtonProps, "ref"> & react.RefAttributes<HTMLButtonElement>>;
+    Link: react.ForwardRefExoticComponent<Omit<_base_ui_react.ToolbarLinkProps, "ref"> & react.RefAttributes<HTMLAnchorElement>>;
     Spacer: typeof Spacer;
 };
 
@@ -1287,20 +1353,20 @@ interface ProgressProps extends Omit<ComponentPropsWithRef<'div'>, 'children'> {
  * Says that something is processing and, when known, how far along it is. Built on Base UI's Progress:
  * `role="progressbar"` with the aria value attributes, or none while indeterminate.
  */
-declare function Progress({ value, max, min, label, valueText, showValue, tone, size, variant, className, ...rest }: ProgressProps): react.JSX.Element;
+declare function Progress$1({ value, max, min, label, valueText, showValue, tone, size, variant, className, ...rest }: ProgressProps): react.JSX.Element;
 
 type HeadingLevel = 1 | 2 | 3 | 4 | 5 | 6;
-type HeadingSize = 'sm' | 'md' | 'lg' | 'xl' | '2xl' | '3xl' | '4xl' | '5xl';
+type HeadingSize = 'overline' | 'sm' | 'md' | 'lg' | 'xl' | '2xl' | '3xl' | '4xl' | '5xl';
 type HeadingElement = 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'h6' | 'div' | 'span' | 'p';
 type TextTone = 'default' | 'muted' | 'subtle' | 'accent' | 'success' | 'warning' | 'danger' | 'info';
 interface HeadingProps extends ComponentPropsWithRef<'h2'> {
     /** The outline level, rendered as `h1`–`h6`. Default 2. */
     level?: HeadingLevel | undefined;
-    /** Visual size from the type scale, independent of the level. Defaults by level: 3xl, 2xl, xl, lg, md, sm. */
+    /** Visual size from the type scale, independent of the level. Defaults by level: 3xl, 2xl, xl, lg, md, sm. `overline` is a 12px uppercase mono label with wide tracking, muted by default, for section labels ("Why it fits"). */
     size?: HeadingSize | undefined;
     /** Render a different element and keep the look; `div`/`span` for a card title that is not an outline entry. */
     as?: HeadingElement | undefined;
-    /** Colour. Default is the text colour. */
+    /** Colour. Default is the text colour; `muted` for `size="overline"`. */
     tone?: TextTone | undefined;
     /** One line with an ellipsis. */
     truncate?: boolean | undefined;
@@ -1597,6 +1663,7 @@ declare function Heading({ level, size, as, tone, truncate, className, ...rest }
 type TextSize = 'xs' | 'sm' | 'md' | 'lg';
 type TextWeight = 'regular' | 'medium' | 'semibold';
 type TextAlign = 'start' | 'center' | 'end';
+type TextFamily = 'sans' | 'mono';
 type TextElement = 'p' | 'span' | 'div' | 'label' | 'li' | 'dt' | 'dd' | 'strong' | 'em' | 'small' | 'time' | 'figcaption' | 'legend';
 interface TextProps extends ComponentPropsWithRef<'p'> {
     /** Element to render. Default `p`; `span` inside other text. */
@@ -1611,12 +1678,44 @@ interface TextProps extends ComponentPropsWithRef<'p'> {
     truncate?: boolean | number | undefined;
     /** Tabular figures, for numbers that line up in columns. */
     numeric?: boolean | undefined;
+    /** `sans` (default) or `mono` for data next to prose: row metadata, dates, counts ("Quillstack · 5 h"). */
+    family?: TextFamily | undefined;
 }
 /** Running text and labels from the type scale. Parents own spacing: Text has no margins. */
-declare function Text({ as, size, tone, weight, align, truncate, numeric, className, style, ...rest }: TextProps): ReactElement;
+declare function Text({ as, size, tone, weight, align, truncate, numeric, family, className, style, ...rest }: TextProps): ReactElement;
+
+/** The header checkbox: nothing, some or every row selected. */
+type RowSelectionHeaderState = 'none' | 'some' | 'all';
+
+interface RowSelection {
+    /** The selectable ids, in the order passed in. */
+    ids: readonly string[];
+    /** The selected ids; a subset of the ids passed in. */
+    selected: ReadonlySet<string>;
+    /** The selected ids in visible order. */
+    selectedIds: readonly string[];
+    count: number;
+    /** Where the next Shift range starts. */
+    anchor: string | null;
+    /** For the header checkbox. */
+    headerState: RowSelectionHeaderState;
+    isSelected: (id: string) => boolean;
+    toggle: (id: string) => void;
+    /** Every row from the anchor to `id`, inclusive, in the current order, takes `id`'s new state. */
+    toggleRange: (id: string) => void;
+    selectAll: () => void;
+    clear: () => void;
+}
+/**
+ * Selection state for a list of rows, by id. Pass the selectable ids in visible order (after filtering and
+ * sorting); when one disappears it leaves the selection and the rest stay. Hand the result to
+ * `Table.Root selection` for the checkbox column and keyboard, or read it for a bulk-action bar.
+ */
+declare function useRowSelection(ids: readonly string[]): RowSelection;
 
 type TableAlign = 'start' | 'center' | 'end';
 type TableDensity = 'comfortable' | 'compact';
+type TableSortDirection = 'ascending' | 'descending' | 'none';
 interface TableRootProps extends Omit<ComponentPropsWithRef<'table'>, 'style'> {
     /** Column headers stay visible while the table scrolls. Give `maxHeight` to scroll inside the table; otherwise they stick to the page. */
     stickyHeader?: boolean | undefined;
@@ -1633,25 +1732,56 @@ interface TableRootProps extends Omit<ComponentPropsWithRef<'table'>, 'style'> {
     wrapperStyle?: CSSProperties | undefined;
     style?: CSSProperties | undefined;
     children?: ReactNode | undefined;
+    /**
+     * `useRowSelection(ids)`. Turns on the selection column parts (`Table.SelectionHeader`, `Table.SelectionCell`),
+     * modifier clicks on rows with a `selectionId`, and the keyboard: Cmd/Ctrl+A selects every row while focus
+     * is inside the table, Escape clears.
+     */
+    selection?: RowSelection | undefined;
 }
 /** A semantic `<table>` in a horizontally scrolling wrapper. Compose `Table.Head`, `Table.Body`, `Table.Row`, `Table.Header`, `Table.Cell`. */
-declare function Root({ stickyHeader, maxHeight, density, divided, layout, wrapperClassName, wrapperStyle, className, style, children, ...rest }: TableRootProps): react.JSX.Element;
+declare function Root$2({ stickyHeader, maxHeight, density, divided, layout, wrapperClassName, wrapperStyle, className, style, children, selection, onKeyDown, ...rest }: TableRootProps): react.JSX.Element;
 type TableCaptionProps = ComponentPropsWithRef<'caption'>;
 /** Names the table for assistive tech; visually a muted line above it. */
 declare function Caption({ className, ...rest }: TableCaptionProps): react.JSX.Element;
 type TableHeadProps = ComponentPropsWithRef<'thead'>;
 declare function Head({ className, ...rest }: TableHeadProps): react.JSX.Element;
 type TableBodyProps = ComponentPropsWithRef<'tbody'>;
-declare function Body({ className, ...rest }: TableBodyProps): react.JSX.Element;
+declare function Body$1({ className, ...rest }: TableBodyProps): react.JSX.Element;
 type TableFootProps = ComponentPropsWithRef<'tfoot'>;
 declare function Foot({ className, ...rest }: TableFootProps): react.JSX.Element;
 interface TableRowProps extends ComponentPropsWithRef<'tr'> {
-    /** Accent wash, for the current row. */
+    /** Accent wash, for the current row. With `selectionId` it defaults to the row's selection. */
     selected?: boolean | undefined;
     /** Hover wash and pointer; make the primary cell a link or button for the real target. */
     interactive?: boolean | undefined;
+    /**
+     * The row's id in `Table.Root selection`. Shift+click extends the range to this row and Cmd/Ctrl+click
+     * toggles it, unless the click is on a link, button or field inside the row; neither reaches `onClick`,
+     * so a plain click can still open the row.
+     */
+    selectionId?: string | undefined;
+}
+declare function Row({ selected, interactive, selectionId, className, onClick, onMouseDown, ...rest }: TableRowProps): react.JSX.Element;
+interface TableSelectionHeaderProps extends Omit<ComponentPropsWithRef<'th'>, 'children'> {
+    /** The checkbox's accessible name. Default "Select all rows". */
+    label?: string | undefined;
 }
-declare function Row({ selected, interactive, className, ...rest }: TableRowProps): react.JSX.Element;
+/**
+ * The selection column's header: a checkbox that is checked when every row is, mixed when some are, and
+ * selects every row (or, when all are selected, none). The whole cell is the hit area.
+ */
+declare function SelectionHeader({ label, className, onClick, ...rest }: TableSelectionHeaderProps): react.JSX.Element;
+interface TableSelectionCellProps extends Omit<ComponentPropsWithRef<'td'>, 'children'> {
+    /** Required. Names the row's checkbox: "Select Tailscale, Front End Engineer". */
+    label: string;
+}
+/**
+ * The row's checkbox, inside a `Table.Row selectionId`. Click or Space toggles; Shift+click or Shift+Space
+ * extends the range from the last toggled row. The whole cell is the hit area, and its clicks never reach the
+ * row's `onClick`.
+ */
+declare function SelectionCell({ label, className, onClick, onClickCapture, ...rest }: TableSelectionCellProps): react.JSX.Element;
 interface CellSlots {
     /** Horizontal alignment. Default `start`; `end` for numbers. */
     align?: TableAlign | undefined;
@@ -1665,22 +1795,98 @@ interface CellSlots {
     width?: string | undefined;
 }
 interface TableHeaderProps extends Omit<ComponentPropsWithRef<'th'>, 'align' | 'width'>, CellSlots {
+    /** Renders the label as a button that sorts the column. The table stays controlled: sort the rows yourself in `onSort`. */
+    sortable?: boolean | undefined;
+    /** The column's current sort, reflected as `aria-sort`. `none` (default) for every column but the sorted one. */
+    sortDirection?: TableSortDirection | undefined;
+    /** Called with the direction to apply: `ascending` first, then it toggles. */
+    onSort?: ((direction: Exclude<TableSortDirection, 'none'>) => void) | undefined;
 }
-/** A `<th>`; `scope` defaults to `col` inside `Table.Head` usage and `row` when you say so. */
-declare function Header({ align, numeric, nowrap, truncate, width, scope, className, style, ...rest }: TableHeaderProps): react.JSX.Element;
+/** A `<th>`; `scope` defaults to `col`, pass `row` for the first cell of a row. */
+declare function Header$1({ align, numeric, nowrap, truncate, width, sortable, sortDirection, onSort, scope, className, style, children, ...rest }: TableHeaderProps): react.JSX.Element;
 interface TableCellProps extends Omit<ComponentPropsWithRef<'td'>, 'align' | 'width'>, CellSlots {
 }
 declare function Cell({ align, numeric, nowrap, truncate, width, className, style, ...rest }: TableCellProps): react.JSX.Element;
 /** Rows of records with column headers. Native table elements, so screen readers get rows and columns. */
 declare const Table: {
-    Root: typeof Root;
+    Root: typeof Root$2;
     Caption: typeof Caption;
     Head: typeof Head;
-    Body: typeof Body;
+    Body: typeof Body$1;
     Foot: typeof Foot;
     Row: typeof Row;
-    Header: typeof Header;
+    Header: typeof Header$1;
     Cell: typeof Cell;
+    SelectionHeader: typeof SelectionHeader;
+    SelectionCell: typeof SelectionCell;
+};
+
+interface SelectionBarProps {
+    /** How many rows are selected. The bar shows from 1 and leaves at 0. */
+    count: number;
+    /** Clears the selection (the Clear button). */
+    onClear: () => void;
+    /** The actions, each a `Toolbar.Button`: `<Toolbar.Button render={<Button size="sm" variant="secondary" />}>Close 3</Toolbar.Button>`. */
+    children?: ReactNode | undefined;
+    /** Names the toolbar. Default "Bulk actions". */
+    'aria-label'?: string | undefined;
+    /** The count text, visible and announced. Default `${count} selected`. */
+    countLabel?: ((count: number) => string) | undefined;
+    /** Default "Clear". */
+    clearLabel?: string | undefined;
+    /** Announced when the selection goes back to none. Default "Selection cleared". */
+    clearedMessage?: string | undefined;
+    className?: string | undefined;
+}
+/**
+ * A floating bar for bulk actions on selected rows, centred at the bottom of the viewport: the count, the actions
+ * and Clear, as one Toolbar (one tab stop, arrow keys inside). A polite status region announces the count as it
+ * changes. Put it after the table, at the end of the scrolling content: while it shows, it leaves a spacer as
+ * tall as itself there, so the last rows can scroll clear of it. When it leaves while holding focus (an action
+ * cleared the selection), focus goes back to where it came from, usually the last row checkbox.
+ */
+declare function SelectionBar({ count, onClear, children, 'aria-label': ariaLabel, countLabel, clearLabel, clearedMessage, className, }: SelectionBarProps): react.JSX.Element;
+
+type ToastTone = 'neutral' | 'success' | 'danger';
+interface ToastOptions {
+    /** Required. One line: "Closed 5 applications". */
+    title: ReactNode;
+    description?: ReactNode | undefined;
+    /** A coloured edge. Default `neutral`. */
+    tone?: ToastTone | undefined;
+    /** One action, usually Undo. It closes the toast after `onClick`. */
+    action?: {
+        label: string;
+        onClick: () => void;
+    } | undefined;
+    /** Milliseconds before it closes; paused while hovered or focused; `0` keeps it. Default: the Provider's. */
+    timeout?: number | undefined;
+    /** `high` announces assertively (errors). Default `low`, polite. */
+    priority?: 'low' | 'high' | undefined;
+}
+interface ToastProviderProps {
+    children?: ReactNode | undefined;
+    /** Default auto-close, in milliseconds. Default 6000. */
+    timeout?: number | undefined;
+    /** How many show at once; older ones close. Default 3. */
+    limit?: number | undefined;
+}
+/** Holds the toasts for `useToast()` below it and renders them, bottom-end, in the top layer. */
+declare function Provider({ children, timeout, limit }: ToastProviderProps): react.JSX.Element;
+interface ToastApi {
+    /** Shows a toast and returns its id. */
+    add: (options: ToastOptions) => string;
+    /** Closes one toast, or every toast without an id. */
+    close: (id?: string) => void;
+}
+/** Shows toasts from inside a `Toast.Provider`. */
+declare function useToast(): ToastApi;
+/**
+ * Short-lived status messages: "Closed 5 applications · Undo". Built on Base UI's Toast: announced through a
+ * polite region (`priority: 'high'` for errors), paused while hovered or focused, F6 moves focus to them.
+ */
+declare const Toast: {
+    Provider: typeof Provider;
 };
 
 type StatTrend = 'up' | 'down' | 'flat';
@@ -1997,7 +2203,1103 @@ declare function Stat({ label, value, delta, deltaTone, trend, hint, icon, varia
     'data-size': StatSize;
 }, HTMLDivElement>;
 
+type ChipTone = 'neutral' | 'accent' | 'success' | 'warning' | 'danger' | 'info';
+type ChipSize = 'sm' | 'md';
+interface ChipProps extends Omit<ComponentPropsWithRef<'span'>, 'onClick' | 'onRemove'> {
+    /** The chip text. Keep it to a word or three. */
+    children: ReactNode;
+    /** A 14px icon before the text. Decorative. */
+    icon?: ReactNode | undefined;
+    /** Colour. `neutral` (default) for filters, a status tone when the chip is the status. */
+    tone?: ChipTone | undefined;
+    /** `md` 32px (default) or `sm` 24px inside table rows and Card headers. */
+    size?: ChipSize | undefined;
+    /** Filled and `aria-pressed`. Use with `onClick` for a toggling filter chip. */
+    selected?: boolean | undefined;
+    /** Makes the chip a `<button>` that toggles; `selected` is reflected as `aria-pressed`. */
+    onClick?: ((event: MouseEvent<HTMLButtonElement>) => void) | undefined;
+    /**
+     * Adds a labelled × that calls this. Backspace or Delete on the focused chip (or on the ×) removes it
+     * too. Focus is yours to manage after removal: move it to the next chip or the filter input.
+     */
+    onRemove?: (() => void) | undefined;
+    /** Accessible name of the ×. Default "Remove" followed by the chip text when that text is a string. */
+    removeLabel?: string | undefined;
+    disabled?: boolean | undefined;
+}
+/**
+ * A small pill: an applied filter, a tag, a selectable option in a row of a few. `onClick` makes it a
+ * toggle button, `onRemove` adds the ×, and the two combine. Plain text otherwise.
+ */
+declare function Chip({ children, icon, tone, size, selected, onClick, onRemove, removeLabel, disabled, className, ...rest }: ChipProps): react.JSX.Element;
+
+interface DisclosureProps extends Omit<ComponentPropsWithRef<'details'>, 'open' | 'onToggle'> {
+    /** Required. The summary line, a verb phrase: "Show full description". */
+    summary: ReactNode;
+    /** Replaces `summary` while open: "Show less". */
+    summaryOpen?: ReactNode | undefined;
+    /** Controlled open state. */
+    open?: boolean | undefined;
+    /** Initial open state when uncontrolled. */
+    defaultOpen?: boolean | undefined;
+    /** Called when the user toggles it. */
+    onOpenChange?: ((open: boolean) => void) | undefined;
+    /**
+     * While closed, shows this many lines of the content fading out, so a long description still reads
+     * as a teaser. Puts the summary line under the preview. Needs `::details-content` (2025 browsers);
+     * older ones show the summary alone.
+     */
+    previewLines?: number | undefined;
+    /** Puts the summary line above (default) or below the content. Defaults to `end` with `previewLines`. */
+    summaryPosition?: 'start' | 'end' | undefined;
+    children?: ReactNode | undefined;
+}
+/**
+ * A native `<details>` collapse with a styled summary. Works without JavaScript, is announced as a
+ * disclosure, and shares `name` with siblings for an exclusive group.
+ */
+declare function Disclosure({ summary, summaryOpen, open, defaultOpen, onOpenChange, previewLines, summaryPosition, className, style, children, ref, ...rest }: DisclosureProps): react.JSX.Element;
+
+type EmptyStateSize = 'sm' | 'md';
+type EmptyStateElement = 'div' | 'section' | 'li';
+interface EmptyStateProps extends Omit<ComponentPropsWithRef<'div'>, 'title'> {
+    /** Required. What is empty, as a short statement: "No applications yet". */
+    title: ReactNode;
+    /** One sentence on why, or what to do: "Postings you apply to show up here." */
+    description?: ReactNode | undefined;
+    /** A 24px icon in a muted circle above the title. Decorative. */
+    icon?: ReactNode | undefined;
+    /** The actions, usually one primary Button and at most one secondary. Rendered in an Inline. */
+    children?: ReactNode | undefined;
+    /** `md` (default) for a whole view or panel, `sm` inside a Card or a table body. */
+    size?: EmptyStateSize | undefined;
+    /** Element to render. Default `div`. */
+    as?: EmptyStateElement | undefined;
+}
+/**
+ * Centred placeholder for a view with nothing in it: an icon, a title, a sentence and the action that
+ * fills it. Say what is missing and the next step; never apologise.
+ */
+declare function EmptyState({ title, description, icon, children, size, as, className, ...rest }: EmptyStateProps): react.DetailedReactHTMLElement<{
+    slot?: string | undefined | undefined;
+    style?: react.CSSProperties | undefined;
+    ref?: react.Ref<HTMLDivElement> | undefined;
+    key?: react.Key | null | undefined;
+    defaultChecked?: boolean | undefined | undefined;
+    defaultValue?: string | number | readonly string[] | undefined;
+    suppressContentEditableWarning?: boolean | undefined | undefined;
+    suppressHydrationWarning?: boolean | undefined | undefined;
+    accessKey?: string | undefined | undefined;
+    autoCapitalize?: "off" | "none" | "on" | "sentences" | "words" | "characters" | undefined | (string & {}) | undefined;
+    autoFocus?: boolean | undefined | undefined;
+    contentEditable?: (boolean | "true" | "false") | "inherit" | "plaintext-only" | undefined;
+    contextMenu?: string | undefined | undefined;
+    dir?: string | undefined | undefined;
+    draggable?: (boolean | "true" | "false") | undefined;
+    enterKeyHint?: "enter" | "done" | "go" | "next" | "previous" | "search" | "send" | undefined | undefined;
+    hidden?: boolean | undefined | undefined;
+    id?: string | undefined | undefined;
+    lang?: string | undefined | undefined;
+    nonce?: string | undefined | undefined;
+    spellCheck?: (boolean | "true" | "false") | undefined;
+    tabIndex?: number | undefined | undefined;
+    translate?: "yes" | "no" | undefined | undefined;
+    radioGroup?: string | undefined | undefined;
+    role?: react.AriaRole | undefined;
+    about?: string | undefined | undefined;
+    content?: string | undefined | undefined;
+    datatype?: string | undefined | undefined;
+    inlist?: any;
+    prefix?: string | undefined | undefined;
+    property?: string | undefined | undefined;
+    rel?: string | undefined | undefined;
+    resource?: string | undefined | undefined;
+    rev?: string | undefined | undefined;
+    typeof?: string | undefined | undefined;
+    vocab?: string | undefined | undefined;
+    autoCorrect?: string | undefined | undefined;
+    autoSave?: string | undefined | undefined;
+    color?: string | undefined | undefined;
+    itemProp?: string | undefined | undefined;
+    itemScope?: boolean | undefined | undefined;
+    itemType?: string | undefined | undefined;
+    itemID?: string | undefined | undefined;
+    itemRef?: string | undefined | undefined;
+    results?: number | undefined | undefined;
+    security?: string | undefined | undefined;
+    unselectable?: "on" | "off" | undefined | undefined;
+    popover?: "" | "auto" | "manual" | "hint" | undefined | undefined;
+    popoverTargetAction?: "toggle" | "show" | "hide" | undefined | undefined;
+    popoverTarget?: string | undefined | undefined;
+    inert?: boolean | undefined | undefined;
+    inputMode?: "none" | "text" | "tel" | "url" | "email" | "numeric" | "decimal" | "search" | undefined | undefined;
+    is?: string | undefined | undefined;
+    exportparts?: string | undefined | undefined;
+    part?: string | undefined | undefined;
+    "aria-activedescendant"?: string | undefined | undefined;
+    "aria-atomic"?: (boolean | "true" | "false") | undefined;
+    "aria-autocomplete"?: "none" | "inline" | "list" | "both" | undefined | undefined;
+    "aria-braillelabel"?: string | undefined | undefined;
+    "aria-brailleroledescription"?: string | undefined | undefined;
+    "aria-busy"?: (boolean | "true" | "false") | undefined;
+    "aria-checked"?: boolean | "false" | "mixed" | "true" | undefined | undefined;
+    "aria-colcount"?: number | undefined | undefined;
+    "aria-colindex"?: number | undefined | undefined;
+    "aria-colindextext"?: string | undefined | undefined;
+    "aria-colspan"?: number | undefined | undefined;
+    "aria-controls"?: string | undefined | undefined;
+    "aria-current"?: boolean | "false" | "true" | "page" | "step" | "location" | "date" | "time" | undefined | undefined;
+    "aria-describedby"?: string | undefined | undefined;
+    "aria-description"?: string | undefined | undefined;
+    "aria-details"?: string | undefined | undefined;
+    "aria-disabled"?: (boolean | "true" | "false") | undefined;
+    "aria-dropeffect"?: "none" | "copy" | "execute" | "link" | "move" | "popup" | undefined | undefined;
+    "aria-errormessage"?: string | undefined | undefined;
+    "aria-expanded"?: (boolean | "true" | "false") | undefined;
+    "aria-flowto"?: string | undefined | undefined;
+    "aria-grabbed"?: (boolean | "true" | "false") | undefined;
+    "aria-haspopup"?: boolean | "false" | "true" | "menu" | "listbox" | "tree" | "grid" | "dialog" | undefined | undefined;
+    "aria-hidden"?: (boolean | "true" | "false") | undefined;
+    "aria-invalid"?: boolean | "false" | "true" | "grammar" | "spelling" | undefined | undefined;
+    "aria-keyshortcuts"?: string | undefined | undefined;
+    "aria-label"?: string | undefined | undefined;
+    "aria-labelledby"?: string | undefined | undefined;
+    "aria-level"?: number | undefined | undefined;
+    "aria-live"?: "off" | "assertive" | "polite" | undefined | undefined;
+    "aria-modal"?: (boolean | "true" | "false") | undefined;
+    "aria-multiline"?: (boolean | "true" | "false") | undefined;
+    "aria-multiselectable"?: (boolean | "true" | "false") | undefined;
+    "aria-orientation"?: "horizontal" | "vertical" | undefined | undefined;
+    "aria-owns"?: string | undefined | undefined;
+    "aria-placeholder"?: string | undefined | undefined;
+    "aria-posinset"?: number | undefined | undefined;
+    "aria-pressed"?: boolean | "false" | "mixed" | "true" | undefined | undefined;
+    "aria-readonly"?: (boolean | "true" | "false") | undefined;
+    "aria-relevant"?: "additions" | "additions removals" | "additions text" | "all" | "removals" | "removals additions" | "removals text" | "text" | "text additions" | "text removals" | undefined | undefined;
+    "aria-required"?: (boolean | "true" | "false") | undefined;
+    "aria-roledescription"?: string | undefined | undefined;
+    "aria-rowcount"?: number | undefined | undefined;
+    "aria-rowindex"?: number | undefined | undefined;
+    "aria-rowindextext"?: string | undefined | undefined;
+    "aria-rowspan"?: number | undefined | undefined;
+    "aria-selected"?: (boolean | "true" | "false") | undefined;
+    "aria-setsize"?: number | undefined | undefined;
+    "aria-sort"?: "none" | "ascending" | "descending" | "other" | undefined | undefined;
+    "aria-valuemax"?: number | undefined | undefined;
+    "aria-valuemin"?: number | undefined | undefined;
+    "aria-valuenow"?: number | undefined | undefined;
+    "aria-valuetext"?: string | undefined | undefined;
+    dangerouslySetInnerHTML?: {
+        __html: string | TrustedHTML;
+    } | undefined | undefined;
+    onCopy?: react.ClipboardEventHandler<HTMLDivElement> | undefined;
+    onCopyCapture?: react.ClipboardEventHandler<HTMLDivElement> | undefined;
+    onCut?: react.ClipboardEventHandler<HTMLDivElement> | undefined;
+    onCutCapture?: react.ClipboardEventHandler<HTMLDivElement> | undefined;
+    onPaste?: react.ClipboardEventHandler<HTMLDivElement> | undefined;
+    onPasteCapture?: react.ClipboardEventHandler<HTMLDivElement> | undefined;
+    onCompositionEnd?: react.CompositionEventHandler<HTMLDivElement> | undefined;
+    onCompositionEndCapture?: react.CompositionEventHandler<HTMLDivElement> | undefined;
+    onCompositionStart?: react.CompositionEventHandler<HTMLDivElement> | undefined;
+    onCompositionStartCapture?: react.CompositionEventHandler<HTMLDivElement> | undefined;
+    onCompositionUpdate?: react.CompositionEventHandler<HTMLDivElement> | undefined;
+    onCompositionUpdateCapture?: react.CompositionEventHandler<HTMLDivElement> | undefined;
+    onFocus?: react.FocusEventHandler<HTMLDivElement> | undefined;
+    onFocusCapture?: react.FocusEventHandler<HTMLDivElement> | undefined;
+    onBlur?: react.FocusEventHandler<HTMLDivElement> | undefined;
+    onBlurCapture?: react.FocusEventHandler<HTMLDivElement> | undefined;
+    onChange?: react.ChangeEventHandler<HTMLDivElement, Element> | undefined;
+    onChangeCapture?: react.ChangeEventHandler<HTMLDivElement, Element> | undefined;
+    onBeforeInput?: react.InputEventHandler<HTMLDivElement> | undefined;
+    onBeforeInputCapture?: react.InputEventHandler<HTMLDivElement> | undefined;
+    onInput?: react.InputEventHandler<HTMLDivElement> | undefined;
+    onInputCapture?: react.InputEventHandler<HTMLDivElement> | undefined;
+    onReset?: react.ReactEventHandler<HTMLDivElement> | undefined;
+    onResetCapture?: react.ReactEventHandler<HTMLDivElement> | undefined;
+    onSubmit?: react.SubmitEventHandler<HTMLDivElement> | undefined;
+    onSubmitCapture?: react.SubmitEventHandler<HTMLDivElement> | undefined;
+    onInvalid?: react.ReactEventHandler<HTMLDivElement> | undefined;
+    onInvalidCapture?: react.ReactEventHandler<HTMLDivElement> | undefined;
+    onLoad?: react.ReactEventHandler<HTMLDivElement> | undefined;
+    onLoadCapture?: react.ReactEventHandler<HTMLDivElement> | undefined;
+    onError?: react.ReactEventHandler<HTMLDivElement> | undefined;
+    onErrorCapture?: react.ReactEventHandler<HTMLDivElement> | undefined;
+    onKeyDown?: react.KeyboardEventHandler<HTMLDivElement> | undefined;
+    onKeyDownCapture?: react.KeyboardEventHandler<HTMLDivElement> | undefined;
+    onKeyPress?: react.KeyboardEventHandler<HTMLDivElement> | undefined;
+    onKeyPressCapture?: react.KeyboardEventHandler<HTMLDivElement> | undefined;
+    onKeyUp?: react.KeyboardEventHandler<HTMLDivElement> | undefined;
+    onKeyUpCapture?: react.KeyboardEventHandler<HTMLDivElement> | undefined;
+    onAbort?: react.ReactEventHandler<HTMLDivElement> | undefined;
+    onAbortCapture?: react.ReactEventHandler<HTMLDivElement> | undefined;
+    onCanPlay?: react.ReactEventHandler<HTMLDivElement> | undefined;
+    onCanPlayCapture?: react.ReactEventHandler<HTMLDivElement> | undefined;
+    onCanPlayThrough?: react.ReactEventHandler<HTMLDivElement> | undefined;
+    onCanPlayThroughCapture?: react.ReactEventHandler<HTMLDivElement> | undefined;
+    onDurationChange?: react.ReactEventHandler<HTMLDivElement> | undefined;
+    onDurationChangeCapture?: react.ReactEventHandler<HTMLDivElement> | undefined;
+    onEmptied?: react.ReactEventHandler<HTMLDivElement> | undefined;
+    onEmptiedCapture?: react.ReactEventHandler<HTMLDivElement> | undefined;
+    onEncrypted?: react.ReactEventHandler<HTMLDivElement> | undefined;
+    onEncryptedCapture?: react.ReactEventHandler<HTMLDivElement> | undefined;
+    onEnded?: react.ReactEventHandler<HTMLDivElement> | undefined;
+    onEndedCapture?: react.ReactEventHandler<HTMLDivElement> | undefined;
+    onLoadedData?: react.ReactEventHandler<HTMLDivElement> | undefined;
+    onLoadedDataCapture?: react.ReactEventHandler<HTMLDivElement> | undefined;
+    onLoadedMetadata?: react.ReactEventHandler<HTMLDivElement> | undefined;
+    onLoadedMetadataCapture?: react.ReactEventHandler<HTMLDivElement> | undefined;
+    onLoadStart?: react.ReactEventHandler<HTMLDivElement> | undefined;
+    onLoadStartCapture?: react.ReactEventHandler<HTMLDivElement> | undefined;
+    onPause?: react.ReactEventHandler<HTMLDivElement> | undefined;
+    onPauseCapture?: react.ReactEventHandler<HTMLDivElement> | undefined;
+    onPlay?: react.ReactEventHandler<HTMLDivElement> | undefined;
+    onPlayCapture?: react.ReactEventHandler<HTMLDivElement> | undefined;
+    onPlaying?: react.ReactEventHandler<HTMLDivElement> | undefined;
+    onPlayingCapture?: react.ReactEventHandler<HTMLDivElement> | undefined;
+    onProgress?: react.ReactEventHandler<HTMLDivElement> | undefined;
+    onProgressCapture?: react.ReactEventHandler<HTMLDivElement> | undefined;
+    onRateChange?: react.ReactEventHandler<HTMLDivElement> | undefined;
+    onRateChangeCapture?: react.ReactEventHandler<HTMLDivElement> | undefined;
+    onSeeked?: react.ReactEventHandler<HTMLDivElement> | undefined;
+    onSeekedCapture?: react.ReactEventHandler<HTMLDivElement> | undefined;
+    onSeeking?: react.ReactEventHandler<HTMLDivElement> | undefined;
+    onSeekingCapture?: react.ReactEventHandler<HTMLDivElement> | undefined;
+    onStalled?: react.ReactEventHandler<HTMLDivElement> | undefined;
+    onStalledCapture?: react.ReactEventHandler<HTMLDivElement> | undefined;
+    onSuspend?: react.ReactEventHandler<HTMLDivElement> | undefined;
+    onSuspendCapture?: react.ReactEventHandler<HTMLDivElement> | undefined;
+    onTimeUpdate?: react.ReactEventHandler<HTMLDivElement> | undefined;
+    onTimeUpdateCapture?: react.ReactEventHandler<HTMLDivElement> | undefined;
+    onVolumeChange?: react.ReactEventHandler<HTMLDivElement> | undefined;
+    onVolumeChangeCapture?: react.ReactEventHandler<HTMLDivElement> | undefined;
+    onWaiting?: react.ReactEventHandler<HTMLDivElement> | undefined;
+    onWaitingCapture?: react.ReactEventHandler<HTMLDivElement> | undefined;
+    onAuxClick?: react.MouseEventHandler<HTMLDivElement> | undefined;
+    onAuxClickCapture?: react.MouseEventHandler<HTMLDivElement> | undefined;
+    onClick?: react.MouseEventHandler<HTMLDivElement> | undefined;
+    onClickCapture?: react.MouseEventHandler<HTMLDivElement> | undefined;
+    onContextMenu?: react.MouseEventHandler<HTMLDivElement> | undefined;
+    onContextMenuCapture?: react.MouseEventHandler<HTMLDivElement> | undefined;
+    onDoubleClick?: react.MouseEventHandler<HTMLDivElement> | undefined;
+    onDoubleClickCapture?: react.MouseEventHandler<HTMLDivElement> | undefined;
+    onDrag?: react.DragEventHandler<HTMLDivElement> | undefined;
+    onDragCapture?: react.DragEventHandler<HTMLDivElement> | undefined;
+    onDragEnd?: react.DragEventHandler<HTMLDivElement> | undefined;
+    onDragEndCapture?: react.DragEventHandler<HTMLDivElement> | undefined;
+    onDragEnter?: react.DragEventHandler<HTMLDivElement> | undefined;
+    onDragEnterCapture?: react.DragEventHandler<HTMLDivElement> | undefined;
+    onDragExit?: react.DragEventHandler<HTMLDivElement> | undefined;
+    onDragExitCapture?: react.DragEventHandler<HTMLDivElement> | undefined;
+    onDragLeave?: react.DragEventHandler<HTMLDivElement> | undefined;
+    onDragLeaveCapture?: react.DragEventHandler<HTMLDivElement> | undefined;
+    onDragOver?: react.DragEventHandler<HTMLDivElement> | undefined;
+    onDragOverCapture?: react.DragEventHandler<HTMLDivElement> | undefined;
+    onDragStart?: react.DragEventHandler<HTMLDivElement> | undefined;
+    onDragStartCapture?: react.DragEventHandler<HTMLDivElement> | undefined;
+    onDrop?: react.DragEventHandler<HTMLDivElement> | undefined;
+    onDropCapture?: react.DragEventHandler<HTMLDivElement> | undefined;
+    onMouseDown?: react.MouseEventHandler<HTMLDivElement> | undefined;
+    onMouseDownCapture?: react.MouseEventHandler<HTMLDivElement> | undefined;
+    onMouseEnter?: react.MouseEventHandler<HTMLDivElement> | undefined;
+    onMouseLeave?: react.MouseEventHandler<HTMLDivElement> | undefined;
+    onMouseMove?: react.MouseEventHandler<HTMLDivElement> | undefined;
+    onMouseMoveCapture?: react.MouseEventHandler<HTMLDivElement> | undefined;
+    onMouseOut?: react.MouseEventHandler<HTMLDivElement> | undefined;
+    onMouseOutCapture?: react.MouseEventHandler<HTMLDivElement> | undefined;
+    onMouseOver?: react.MouseEventHandler<HTMLDivElement> | undefined;
+    onMouseOverCapture?: react.MouseEventHandler<HTMLDivElement> | undefined;
+    onMouseUp?: react.MouseEventHandler<HTMLDivElement> | undefined;
+    onMouseUpCapture?: react.MouseEventHandler<HTMLDivElement> | undefined;
+    onSelect?: react.ReactEventHandler<HTMLDivElement> | undefined;
+    onSelectCapture?: react.ReactEventHandler<HTMLDivElement> | undefined;
+    onTouchCancel?: react.TouchEventHandler<HTMLDivElement> | undefined;
+    onTouchCancelCapture?: react.TouchEventHandler<HTMLDivElement> | undefined;
+    onTouchEnd?: react.TouchEventHandler<HTMLDivElement> | undefined;
+    onTouchEndCapture?: react.TouchEventHandler<HTMLDivElement> | undefined;
+    onTouchMove?: react.TouchEventHandler<HTMLDivElement> | undefined;
+    onTouchMoveCapture?: react.TouchEventHandler<HTMLDivElement> | undefined;
+    onTouchStart?: react.TouchEventHandler<HTMLDivElement> | undefined;
+    onTouchStartCapture?: react.TouchEventHandler<HTMLDivElement> | undefined;
+    onPointerDown?: react.PointerEventHandler<HTMLDivElement> | undefined;
+    onPointerDownCapture?: react.PointerEventHandler<HTMLDivElement> | undefined;
+    onPointerMove?: react.PointerEventHandler<HTMLDivElement> | undefined;
+    onPointerMoveCapture?: react.PointerEventHandler<HTMLDivElement> | undefined;
+    onPointerUp?: react.PointerEventHandler<HTMLDivElement> | undefined;
+    onPointerUpCapture?: react.PointerEventHandler<HTMLDivElement> | undefined;
+    onPointerCancel?: react.PointerEventHandler<HTMLDivElement> | undefined;
+    onPointerCancelCapture?: react.PointerEventHandler<HTMLDivElement> | undefined;
+    onPointerEnter?: react.PointerEventHandler<HTMLDivElement> | undefined;
+    onPointerLeave?: react.PointerEventHandler<HTMLDivElement> | undefined;
+    onPointerOver?: react.PointerEventHandler<HTMLDivElement> | undefined;
+    onPointerOverCapture?: react.PointerEventHandler<HTMLDivElement> | undefined;
+    onPointerOut?: react.PointerEventHandler<HTMLDivElement> | undefined;
+    onPointerOutCapture?: react.PointerEventHandler<HTMLDivElement> | undefined;
+    onGotPointerCapture?: react.PointerEventHandler<HTMLDivElement> | undefined;
+    onGotPointerCaptureCapture?: react.PointerEventHandler<HTMLDivElement> | undefined;
+    onLostPointerCapture?: react.PointerEventHandler<HTMLDivElement> | undefined;
+    onLostPointerCaptureCapture?: react.PointerEventHandler<HTMLDivElement> | undefined;
+    onScroll?: react.UIEventHandler<HTMLDivElement> | undefined;
+    onScrollCapture?: react.UIEventHandler<HTMLDivElement> | undefined;
+    onScrollEnd?: react.UIEventHandler<HTMLDivElement> | undefined;
+    onScrollEndCapture?: react.UIEventHandler<HTMLDivElement> | undefined;
+    onWheel?: react.WheelEventHandler<HTMLDivElement> | undefined;
+    onWheelCapture?: react.WheelEventHandler<HTMLDivElement> | undefined;
+    onAnimationStart?: react.AnimationEventHandler<HTMLDivElement> | undefined;
+    onAnimationStartCapture?: react.AnimationEventHandler<HTMLDivElement> | undefined;
+    onAnimationEnd?: react.AnimationEventHandler<HTMLDivElement> | undefined;
+    onAnimationEndCapture?: react.AnimationEventHandler<HTMLDivElement> | undefined;
+    onAnimationIteration?: react.AnimationEventHandler<HTMLDivElement> | undefined;
+    onAnimationIterationCapture?: react.AnimationEventHandler<HTMLDivElement> | undefined;
+    onToggle?: react.ToggleEventHandler<HTMLDivElement> | undefined;
+    onBeforeToggle?: react.ToggleEventHandler<HTMLDivElement> | undefined;
+    onTransitionCancel?: react.TransitionEventHandler<HTMLDivElement> | undefined;
+    onTransitionCancelCapture?: react.TransitionEventHandler<HTMLDivElement> | undefined;
+    onTransitionEnd?: react.TransitionEventHandler<HTMLDivElement> | undefined;
+    onTransitionEndCapture?: react.TransitionEventHandler<HTMLDivElement> | undefined;
+    onTransitionRun?: react.TransitionEventHandler<HTMLDivElement> | undefined;
+    onTransitionRunCapture?: react.TransitionEventHandler<HTMLDivElement> | undefined;
+    onTransitionStart?: react.TransitionEventHandler<HTMLDivElement> | undefined;
+    onTransitionStartCapture?: react.TransitionEventHandler<HTMLDivElement> | undefined;
+    className: string;
+    'data-size': EmptyStateSize;
+}, HTMLDivElement>;
+
+type SkeletonVariant = 'text' | 'rect' | 'circle';
+interface SkeletonProps extends ComponentPropsWithRef<'span'> {
+    /** `text` (default) is one line of the current font size; `rect` a block; `circle` an avatar. */
+    variant?: SkeletonVariant | undefined;
+    /** Any CSS length. Default: text `100%`, rect `100%`, circle `40px`. */
+    width?: string | number | undefined;
+    /** Any CSS length. Default: text `1em` (one line), rect `80px`, circle = `width`. */
+    height?: string | number | undefined;
+    /** For `text`: how many lines; the last is shorter. Default 1. */
+    lines?: number | undefined;
+    /** Hides the shimmer. Default `false`; reduced motion hides it anyway. */
+    still?: boolean | undefined;
+}
+/**
+ * A placeholder shape shown while real content loads. It is hidden from assistive tech: put
+ * `aria-busy="true"` on the region being filled, or a `Spinner` with a label beside it, so the loading
+ * state is announced once instead of per block.
+ */
+declare function Skeleton({ variant, width, height, lines, still, className, style, ...rest }: SkeletonProps): react.JSX.Element;
+
+interface FileInputProps extends FieldProps {
+    /** Accepted types, as for the native attribute: `".pdf,.docx,text/plain"` or a list. Extensions, exact MIME types and `image/*` wildcards. */
+    accept?: string | readonly string[] | undefined;
+    /** How the accepted types read in the error message. Default derived from `accept` ("PDF, DOCX or plain text"). */
+    acceptLabel?: string | undefined;
+    /** Largest file accepted, in bytes or as `"10MB"` (base 1000, like the size shown in the list). */
+    maxFileSize?: number | string | undefined;
+    /** Allows several files. Without it a new file replaces the current one. */
+    multiple?: boolean | undefined;
+    /** With `multiple`, the most files the list holds. */
+    maxFiles?: number | undefined;
+    /** Controlled list of accepted files. Pass `[]` to clear. */
+    files?: readonly File[] | undefined;
+    /** Initial files when uncontrolled. */
+    defaultFiles?: readonly File[] | undefined;
+    /** Called with the accepted files (plain `File` objects) after every add or remove. Rejected files never appear here. */
+    onFilesChange?: ((files: File[]) => void) | undefined;
+    /** Drop zone text before the browse link. Default "Drop a file here or" (or "Drop files here or" with `multiple`). */
+    idleLabel?: string | undefined;
+    /** The browse link's text. Default "browse". */
+    browseLabel?: string | undefined;
+    /**
+     * Lets people check a file before it is uploaded: the name of each PDF, plain text, Markdown or image
+     * file becomes a button that opens it in a `FilePreviewDialog`. Other types (DOCX …) show a plain name.
+     * Default `true`; no preview while `disabled`.
+     */
+    preview?: boolean | undefined;
+}
+/**
+ * A labelled file picker with a drop zone, on FilePond (docs/adr/0004). Files stay in the browser: the
+ * component hands plain `File` objects to `onFilesChange`, and with `name` it also keeps them in a file
+ * input so a `<form>` (or a Server Action) submits them. Type, size and count are checked before a file
+ * joins the list; a rejected file never joins it, and the reason shows in the field's error slot and is
+ * announced. FilePond loads on mount, so the server renders a static drop zone and nothing of FilePond.
+ */
+declare function FileInput({ label, hideLabel, description, error, invalid, required, disabled, name, size, className, accept, acceptLabel, maxFileSize, multiple, maxFiles, files, defaultFiles, onFilesChange, idleLabel, browseLabel, preview, }: FileInputProps): react.JSX.Element;
+
+interface FilePreviewDialogProps {
+    /** The file to show. Kept while the dialog closes, so pass `null` only once it has. */
+    file: File | null | undefined;
+    /** Controlled open state. */
+    open: boolean;
+    /** Called when the dialog asks to close (Esc, the ×, the backdrop). */
+    onOpenChange: (open: boolean) => void;
+    /** Where focus goes on close. Default: the element that had focus when it opened. */
+    finalFocus?: DialogContentProps['finalFocus'];
+}
+/**
+ * Shows a local file before it is uploaded: a PDF in the browser's own viewer, plain text and Markdown as
+ * text, an image as an image. Any other type gets a short note and nothing else, because a blob URL runs
+ * with the page's origin: only a PDF is ever framed, and it is re-typed `application/pdf` first, so an HTML
+ * file named `.pdf` cannot run. The object URL exists only while the dialog is open.
+ */
+declare function FilePreviewDialog({ file, open, onOpenChange, finalFocus }: FilePreviewDialogProps): react.JSX.Element;
+
+interface PriorityNavItem {
+    /** Where the link goes. */
+    href: string;
+    /** The visible text. A string (or number) is part of the width cache key; see `PriorityNav`. */
+    label: ReactNode;
+    /** A stable key. Defaults to `href`. */
+    id?: string | undefined;
+    /** The page being shown: `aria-current="page"`, and the link never collapses into "More". */
+    current?: boolean | undefined;
+    /**
+     * A small count (`2`) or `'dot'` after the label: something waiting there. `0` shows nothing. Visual only; say
+     * what it means in `badgeLabel`. While the item is collapsed, "More" shows the summed count (or a dot) and adds
+     * the label to its accessible name.
+     */
+    badge?: number | 'dot' | undefined;
+    /** What the badge means, appended to the link's (and, while collapsed, More's) accessible name: "2 suggestions to review". A count without it is read as the bare number; a dot without it is not announced. */
+    badgeLabel?: string | undefined;
+}
+/** What `renderLink` receives: spread it onto your link component. */
+interface PriorityNavLinkProps {
+    href: string;
+    className: string;
+    'aria-current': 'page' | undefined;
+    onClick: MouseEventHandler<HTMLAnchorElement> | undefined;
+    children: ReactNode;
+}
+interface PriorityNavProps extends Omit<ComponentPropsWithRef<'nav'>, 'children'> {
+    /** Names the landmark: "Main". */
+    'aria-label': string;
+    /** The links, in priority order: the first ones stay inline longest. */
+    items: readonly PriorityNavItem[];
+    /** Visible text of the overflow toggle. Default "More". */
+    moreLabel?: string | undefined;
+    /** Appended to the toggle's accessible name only: "More, 3 links". Default `n link(s)`. */
+    moreCountLabel?: ((hidden: number) => string) | undefined;
+    /** Renders each link. Default a plain `<a>`; pass a router link: `(props) => <Link {...props} />`. */
+    renderLink?: ((props: PriorityNavLinkProps, item: PriorityNavItem) => ReactElement) | undefined;
+    /**
+     * Called when links start or stop collapsing into "More" (also `data-overflowing` on the `nav`), so a
+     * header can make room, e.g. an action button going icon-only.
+     */
+    onOverflowChange?: ((overflowing: boolean) => void) | undefined;
+    /**
+     * Room in px the row must have beyond fitting every link before it stops reporting overflow. Set it to
+     * the space your header gives back on overflow (the button label's width), so the two cannot oscillate.
+     * Default 0.
+     */
+    overflowHysteresis?: number | undefined;
+}
+/**
+ * Priority+ navigation: a row of primary links that keeps the ones that fit inline and collapses the rest
+ * into a "More" disclosure at the end of the row. The current page is never collapsed. Follows the
+ * WAI-ARIA APG disclosure navigation pattern (links in a list, a real button with `aria-expanded`), not
+ * `role="menu"`. Server-renders every link inline, so it works before hydration and without JavaScript;
+ * see docs/adr/0005-priority-nav.md.
+ */
+declare function PriorityNav({ items, moreLabel, moreCountLabel, renderLink, onOverflowChange, overflowHysteresis, className, style, ...rest }: PriorityNavProps): react.JSX.Element;
+
+type PopoverSide = 'top' | 'bottom' | 'left' | 'right';
+type PopoverAlign = 'start' | 'center' | 'end';
+interface PopoverRootProps {
+    /** Controlled open state. */
+    open?: boolean | undefined;
+    /** Initial open state when uncontrolled. */
+    defaultOpen?: boolean | undefined;
+    /** Called when the popover opens or closes. */
+    onOpenChange?: ((open: boolean) => void) | undefined;
+    /** Default `false`: the page stays interactive and focus may leave. `true` makes the page inert until it closes. */
+    modal?: boolean | undefined;
+    children?: ReactNode | undefined;
+}
+/** Owns the open state. Wrap a `Popover.Trigger` and a `Popover.Content`. */
+declare function Root$1({ open, defaultOpen, onOpenChange, modal, children }: PopoverRootProps): react.JSX.Element;
+interface PopoverTriggerProps extends Omit<Popover$1.Trigger.Props, 'className'> {
+    className?: string | undefined;
+}
+/**
+ * Opens the popover. With no `render` it is a secondary Button; pass any Button or IconButton through
+ * `render`: `<Popover.Trigger render={<IconButton label="Sweeps: running" dot="success" />}>`.
+ */
+declare function Trigger({ render, className, children, ...rest }: PopoverTriggerProps): react.JSX.Element;
+interface PopoverContentProps extends Omit<Popover$1.Popup.Props, 'className'> {
+    /** Side of the trigger it opens on; flips when there is no room. Default `bottom`. */
+    side?: PopoverSide | undefined;
+    /** Alignment along that side. Default `center`. */
+    align?: PopoverAlign | undefined;
+    /** Distance from the trigger in px. Default 4, or 8 with `arrow`. */
+    sideOffset?: number | undefined;
+    /** Draws a tip pointing at the trigger. */
+    arrow?: boolean | undefined;
+    className?: string | undefined;
+}
+/** Portal, positioner and the panel. Any content goes inside; name it with `Popover.Title`. */
+declare function Content({ side, align, sideOffset, arrow, className, children, ...rest }: PopoverContentProps): react.JSX.Element;
+interface PopoverTitleProps extends Omit<Popover$1.Title.Props, 'className'> {
+    className?: string | undefined;
+}
+/** Names the popover (`aria-labelledby`). A heading, `h2` by default. */
+declare function Title({ className, ...rest }: PopoverTitleProps): react.JSX.Element;
+interface PopoverDescriptionProps extends Omit<Popover$1.Description.Props, 'className'> {
+    className?: string | undefined;
+}
+/** Describes the popover (`aria-describedby`). Muted text. */
+declare function Description({ className, ...rest }: PopoverDescriptionProps): react.JSX.Element;
+interface PopoverCloseProps extends Omit<Popover$1.Close.Props, 'className'> {
+    className?: string | undefined;
+}
+/** With no children or `render`, the × in the corner. Otherwise wraps any Button: `<Popover.Close render={<Button variant="ghost" />}>Done</Popover.Close>`. */
+declare function Close({ className, children, render, ...rest }: PopoverCloseProps): react.JSX.Element;
+/** A non-modal panel anchored to a trigger, for a small form, a status summary or a legend. Built on Base UI's Popover. */
+declare const Popover: {
+    Root: typeof Root$1;
+    Trigger: typeof Trigger;
+    Content: typeof Content;
+    Title: typeof Title;
+    Description: typeof Description;
+    Close: typeof Close;
+};
+
+interface BroomIconProps extends Omit<ComponentPropsWithRef<'svg'>, 'children'> {
+    /** Sweeps back and forth while dust drifts. With `prefers-reduced-motion` it holds still and shows the dust. */
+    sweeping?: boolean | undefined;
+    /** The Icon sizes (`lg` 20, the nav size, is the default), or `display` (72px, stroke 1.75px) for empty states and showcases. Inside an IconButton it fills the icon slot one step up, since it is drawn on a 24px grid. */
+    size?: IconSize | 'display' | undefined;
+    /** Gives the icon an accessible name (`role="img"`). Without it the icon is decorative and hidden from assistive tech. */
+    title?: string | undefined;
+}
+/**
+ * An animated broom on a 24×24 grid, for "a sweep is running". Inline SVG, because CSS cannot animate
+ * inside a `<use>` clone. Strokes keep a fixed screen width at every size (`vector-effect: non-scaling-stroke`).
+ * Decorative by default: say what is happening in the surrounding control's label ("Sweeps: running").
+ */
+declare function BroomIcon({ sweeping, size, title, className, ...rest }: BroomIconProps): react.JSX.Element;
+
+/** Which way the flow moved: `forward` slides the new step in from the inline end, `back` from the start. */
+type FlowDirection = 'forward' | 'back';
+/** Why the flow asked to close: Esc, or the × in the header. */
+type FlowCloseRequestReason = 'escape-key' | 'close-press';
+interface FullScreenFlowRootProps {
+    /** Whether the flow is showing. Default `true`, for a flow that lives on its own route. */
+    open?: boolean | undefined;
+    /**
+     * Esc and the header's × call this instead of closing. Show a leave confirmation (a nested `Dialog`),
+     * then close by setting `open` to `false` or by navigating away. A press on the backdrop does nothing.
+     */
+    onRequestClose: (reason: FlowCloseRequestReason) => void;
+    /** Enter (outside buttons, links, textareas and `[data-flow-keys="local"]`) and the forward arrow key call this. */
+    onNext?: (() => void) | undefined;
+    /** The back arrow key (outside form controls) calls this. */
+    onBack?: (() => void) | undefined;
+    /** A decorative layer behind everything, such as an illustration. Hidden from assistive tech. */
+    decoration?: ReactNode | undefined;
+    className?: string | undefined;
+    /** `Header`, `Body` and `Footer`, in that order. */
+    children?: ReactNode | undefined;
+}
+/**
+ * A full-screen modal for a multi-step task, on `Dialog variant="fullscreen"`: focus is trapped, the page
+ * behind is inert, and Esc goes to `onRequestClose`. Holds the polite live region that `Step` announces into.
+ */
+declare function Root({ open, onRequestClose, onNext, onBack, decoration, className, children, }: FullScreenFlowRootProps): react.JSX.Element;
+interface FullScreenFlowHeaderProps extends Omit<ComponentPropsWithRef<'div'>, 'title'> {
+    /** The flow's name ("Set up your search"). Labels the dialog. */
+    title: ReactNode;
+    /** A small mark before the title. Decorative. */
+    logo?: ReactNode | undefined;
+    /** Shown instead of `title` below 760px, where the progress drops to its own row: "4 of 10 · Roles". */
+    compactTitle?: ReactNode | undefined;
+    /** A status after the progress, such as a "Saved" tick. */
+    status?: ReactNode | undefined;
+    /** Name of the × button, which calls `onRequestClose('close-press')`. Default "Close". */
+    closeLabel?: string | undefined;
+    /** Usually a `FullScreenFlow.Progress`. */
+    children?: ReactNode | undefined;
+}
+/** The top bar: logo and title, progress in the middle, a status, and the ×. Pinned; it never scrolls. */
+declare function Header({ title, logo, compactTitle, status, closeLabel, className, children, ...rest }: FullScreenFlowHeaderProps): react.JSX.Element;
+/** A chapter of the flow and how many numbered steps it holds. */
+interface FlowChapter {
+    label: string;
+    steps: number;
+}
+interface FullScreenFlowProgressProps extends Omit<ComponentPropsWithRef<'div'>, 'children'> {
+    /** The chapters in order. Each draws one segment, as wide as its share of the steps. */
+    chapters: readonly FlowChapter[];
+    /**
+     * The current step, counted from 1 across every chapter. `0` is before the first (a welcome screen);
+     * anything past the total fills every segment. The current step counts as half done.
+     */
+    step: number;
+    /** One line above the segments: "Step 4 of 10 · Roles · about 5 min left". Hidden below 760px. */
+    label?: ReactNode | undefined;
+    /** Name of the list of segments. Default "Progress". */
+    listLabel?: string | undefined;
+}
+/** Segmented progress, one segment per chapter; the chapter holding the current step has `aria-current="step"`. */
+declare function Progress({ chapters, step, label, listLabel, className, ...rest }: FullScreenFlowProgressProps): react.JSX.Element;
+type FullScreenFlowBodyProps = ComponentPropsWithRef<'div'>;
+/** Between header and footer: a `Rail` (from 1000px) beside the `Viewport`. */
+declare function Body({ className, ...rest }: FullScreenFlowBodyProps): react.JSX.Element;
+interface FullScreenFlowRailProps extends ComponentPropsWithRef<'nav'> {
+    /** A note under the steps, such as where answers can be changed later. Hidden on short screens. */
+    footer?: ReactNode | undefined;
+}
+/** Every step by chapter, shown from 1000px. Holds `RailGroup`s of `RailItem`s. Named "Steps" unless `aria-label` says otherwise. */
+declare function Rail({ 'aria-label': ariaLabel, footer, className, children, ...rest }: FullScreenFlowRailProps): react.JSX.Element;
+interface FullScreenFlowRailGroupProps extends Omit<ComponentPropsWithRef<'div'>, 'title'> {
+    /** The chapter name. */
+    label: ReactNode;
+}
+/** One chapter in the rail: its name over a list of `RailItem`s. */
+declare function RailGroup({ label, className, children, ...rest }: FullScreenFlowRailGroupProps): react.JSX.Element;
+interface FullScreenFlowRailItemProps extends ComponentPropsWithRef<'button'> {
+    /** The step on screen: `aria-current="step"` and the accent wash. */
+    current?: boolean | undefined;
+    /** Shows a check and adds `doneLabel` for assistive tech. */
+    done?: boolean | undefined;
+    /** Read after the label when `done`. Default "done". */
+    doneLabel?: string | undefined;
+    /** A small icon at the end of the row, e.g. "drafted for you". Give it a `title` if it carries meaning. */
+    adornment?: ReactNode | undefined;
+}
+/** A step in the rail. A button: disable the steps not reached yet. */
+declare function RailItem({ current, done, doneLabel, adornment, type, className, children, ...rest }: FullScreenFlowRailItemProps): react.JSX.Element;
+interface FullScreenFlowViewportProps extends Omit<ComponentPropsWithRef<'div'>, 'children' | 'ref'> {
+    /** Which way this change goes. Set it with the step: `back` when the person went back. Default `forward`. */
+    direction?: FlowDirection | undefined;
+    /** Exactly one `FullScreenFlow.Step`, keyed by step: `<FullScreenFlow.Step key={step.id} …>`. */
+    children: ReactElement;
+}
+/**
+ * The scrolling area that shows one step. When the child's `key` changes, the old step slides out and the
+ * new one slides in (by `direction`; a short crossfade under reduced motion), the area scrolls to the top,
+ * and the new step's title takes focus and is announced.
+ */
+declare function Viewport({ direction, className, children, ...rest }: FullScreenFlowViewportProps): react.JSX.Element;
+interface FullScreenFlowStepProps extends Omit<ComponentPropsWithRef<'section'>, 'title'> {
+    /** The step's heading, an `<h2>` that takes focus (`tabindex="-1"`) when the step arrives. */
+    title: ReactNode;
+    /** A short line above the title: "Your search · Step 4 of 10". */
+    eyebrow?: ReactNode | undefined;
+    /** Why this step is asked, under the title. */
+    description?: ReactNode | undefined;
+    /** What the live region says when the step arrives: "Step 4 of 10, Roles". Defaults to `title` when it is a string. */
+    announcement?: string | undefined;
+}
+/** One step: eyebrow, title, description, then its content. Render it inside `Viewport` with a `key`. */
+declare function Step({ title, eyebrow, description, announcement, className, children, ...rest }: FullScreenFlowStepProps): react.JSX.Element;
+interface FullScreenFlowFooterProps extends ComponentPropsWithRef<'div'> {
+    /** At the inline start: a Back button. */
+    back?: ReactNode | undefined;
+    /** Before the actions, from 760px: "Press Enter to continue". */
+    hint?: ReactNode | undefined;
+    /** The primary action, at the inline end; stretches below 520px. */
+    children?: ReactNode | undefined;
+}
+/** The pinned bottom bar. Buttons in it are at least 44px tall and wide, and it clears the home indicator. */
+declare function Footer({ back, hint, className, children, ...rest }: FullScreenFlowFooterProps): react.JSX.Element;
+/**
+ * A full-screen, multi-step flow (onboarding, setup) on `Dialog variant="fullscreen"`:
+ * `Root` › `Header` (with `Progress`) · `Body` (`Rail` › `RailGroup` › `RailItem`, and `Viewport` › `Step`) · `Footer`.
+ * The app owns the state (which step, which direction); this owns the surface, motion, focus and announcements.
+ */
+declare const FullScreenFlow: {
+    Root: typeof Root;
+    Header: typeof Header;
+    Progress: typeof Progress;
+    Body: typeof Body;
+    Rail: typeof Rail;
+    RailGroup: typeof RailGroup;
+    RailItem: typeof RailItem;
+    Viewport: typeof Viewport;
+    Step: typeof Step;
+    Footer: typeof Footer;
+};
+
+type ScoreTone = 'neutral' | 'accent' | 'success' | 'warning' | 'danger';
+type ScoreSize = 'sm' | 'md';
+type ScoreVariant = 'tile' | 'ring';
+interface ScoreProps extends Omit<ComponentPropsWithRef<'span'>, 'children'> {
+    /**
+     * The number shown, e.g. a fit score. Rendered as given; round it first. `null` means not scored yet: a neutral
+     * tile (or an empty ring) with a dash, read as "{label}: not scored", and `tone` is ignored.
+     */
+    value: number | null;
+    /** The top of the scale. Default 100. Fills the ring and ends the default accessible text. */
+    max?: number | undefined;
+    /** Colour. The system holds no thresholds: map the value to a tone in the app. Default `accent`. */
+    tone?: ScoreTone | undefined;
+    /** `tile` (default), a number on a tinted square, or `ring`, a donut for detail headers. */
+    variant?: ScoreVariant | undefined;
+    /** Tile size: `sm` 40px for list rows (default), `md` 48px. The ring is 64px. */
+    size?: ScoreSize | undefined;
+    /** A short word under the number: "fit". Visual only; say it in `label`. */
+    caption?: ReactNode | undefined;
+    /** What the number measures, read before it: "Fit score". Default "Score". */
+    label?: string | undefined;
+    /** The whole text assistive tech reads instead of the default "{label} {value} out of {max}" ("{label}: not scored" without a value). */
+    valueText?: string | undefined;
+    /** Shows the selected look (solid fill). Also on automatically inside a selected Card or an element with `aria-pressed="true"` or `aria-selected="true"`. */
+    selected?: boolean | undefined;
+}
+/**
+ * A score as a number on a tinted tile or inside a ring. The number and caption are visual; assistive tech reads one
+ * visually hidden sentence ("Fit score 94 out of 100"), so the score is named without `aria-label` on a non-interactive
+ * element and reads whole inside a row button. A `null` value is "not scored": a dash, no tone, no arc.
+ */
+declare function Score({ value, max, tone, variant, size, caption, label, valueText, selected, className, style, ...rest }: ScoreProps): react.JSX.Element;
+
+type ReasonTone = 'for' | 'against' | 'gap';
+type ReasonListSize = 'sm' | 'md';
+interface ReasonListProps extends ComponentPropsWithRef<'ul'> {
+    /** What every item in the list is: `for` (a filled square), `against` (a bar) or `gap` (a hollow circle). Shape and colour both carry it. */
+    tone: ReasonTone;
+    /** `md` 14px (default) for a detail view, `sm` 12px for the compact form inside a card. */
+    size?: ReasonListSize | undefined;
+    /** A dashed rule above the list, for the compact form under a card's title. */
+    divider?: boolean | undefined;
+}
+type ReasonListItemProps = ComponentPropsWithRef<'li'>;
+/**
+ * A list of reasons with a marker shape per tone, so the meaning is never colour alone. Name the list with a
+ * heading ("Why it fits", "Watch for") and point `aria-labelledby` at it: the heading says what the marker means.
+ */
+declare function ReasonListRoot({ tone, size, divider, className, ...rest }: ReasonListProps): react.JSX.Element;
+/** One reason. `<strong>` inside picks out the key words in the default text colour. */
+declare function ReasonListItem({ className, ...rest }: ReasonListItemProps): react.JSX.Element;
+declare const ReasonList: typeof ReasonListRoot & {
+    Item: typeof ReasonListItem;
+};
+
+type WordDiffKind = 'same' | 'added' | 'removed';
+interface WordDiffPart {
+    kind: WordDiffKind;
+    text: string;
+}
+type WordDiffElement = 'p' | 'div' | 'span';
+type WordDiffSize = 'sm' | 'md';
+type WordDiffFamily = 'sans' | 'mono';
+interface WordDiffProps extends Omit<ComponentPropsWithRef<'p'>, 'children'> {
+    /** Runs of unchanged, removed and added text, in reading order, whitespace included. Rendered exactly: joining every `text` gives the visible string. */
+    parts: readonly WordDiffPart[];
+    /** Element to render. Default `p`; `div` or `span` inside other text. */
+    as?: WordDiffElement | undefined;
+    /** `sm` 14px UI text (default) or `md` body copy. */
+    size?: WordDiffSize | undefined;
+    /**
+     * `sans` prose (default), or `mono` for code and structured text (YAML, JSON, Markdown source): the mono face, no
+     * reading-measure cap, and marks without side padding so columns stay aligned.
+     */
+    family?: WordDiffFamily | undefined;
+    /** Screen reader word around added text: "[added: …]". Default "added". */
+    addedLabel?: string | undefined;
+    /** Screen reader word around removed text: "[removed: …]". Default "removed". */
+    removedLabel?: string | undefined;
+}
+/**
+ * A word-level diff as prose: removed text struck through and added text underlined, each on a tint, inside real
+ * `<del>` and `<ins>` with "[removed: …]" / "[added: …]" for screen readers. The line, not the colour, carries the
+ * meaning. Whitespace is preserved exactly (`white-space: pre-wrap`).
+ */
+declare function WordDiff({ parts, as, size, family, addedLabel, removedLabel, className, ...rest }: WordDiffProps): react.DetailedReactHTMLElement<{
+    slot?: string | undefined | undefined;
+    style?: react.CSSProperties | undefined;
+    title?: string | undefined | undefined;
+    ref?: react.Ref<HTMLParagraphElement> | undefined;
+    key?: react.Key | null | undefined;
+    defaultChecked?: boolean | undefined | undefined;
+    defaultValue?: string | number | readonly string[] | undefined;
+    suppressContentEditableWarning?: boolean | undefined | undefined;
+    suppressHydrationWarning?: boolean | undefined | undefined;
+    accessKey?: string | undefined | undefined;
+    autoCapitalize?: "off" | "none" | "on" | "sentences" | "words" | "characters" | undefined | (string & {}) | undefined;
+    autoFocus?: boolean | undefined | undefined;
+    contentEditable?: (boolean | "true" | "false") | "inherit" | "plaintext-only" | undefined;
+    contextMenu?: string | undefined | undefined;
+    dir?: string | undefined | undefined;
+    draggable?: (boolean | "true" | "false") | undefined;
+    enterKeyHint?: "enter" | "done" | "go" | "next" | "previous" | "search" | "send" | undefined | undefined;
+    hidden?: boolean | undefined | undefined;
+    id?: string | undefined | undefined;
+    lang?: string | undefined | undefined;
+    nonce?: string | undefined | undefined;
+    spellCheck?: (boolean | "true" | "false") | undefined;
+    tabIndex?: number | undefined | undefined;
+    translate?: "yes" | "no" | undefined | undefined;
+    radioGroup?: string | undefined | undefined;
+    role?: react.AriaRole | undefined;
+    about?: string | undefined | undefined;
+    content?: string | undefined | undefined;
+    datatype?: string | undefined | undefined;
+    inlist?: any;
+    prefix?: string | undefined | undefined;
+    property?: string | undefined | undefined;
+    rel?: string | undefined | undefined;
+    resource?: string | undefined | undefined;
+    rev?: string | undefined | undefined;
+    typeof?: string | undefined | undefined;
+    vocab?: string | undefined | undefined;
+    autoCorrect?: string | undefined | undefined;
+    autoSave?: string | undefined | undefined;
+    color?: string | undefined | undefined;
+    itemProp?: string | undefined | undefined;
+    itemScope?: boolean | undefined | undefined;
+    itemType?: string | undefined | undefined;
+    itemID?: string | undefined | undefined;
+    itemRef?: string | undefined | undefined;
+    results?: number | undefined | undefined;
+    security?: string | undefined | undefined;
+    unselectable?: "on" | "off" | undefined | undefined;
+    popover?: "" | "auto" | "manual" | "hint" | undefined | undefined;
+    popoverTargetAction?: "toggle" | "show" | "hide" | undefined | undefined;
+    popoverTarget?: string | undefined | undefined;
+    inert?: boolean | undefined | undefined;
+    inputMode?: "none" | "text" | "tel" | "url" | "email" | "numeric" | "decimal" | "search" | undefined | undefined;
+    is?: string | undefined | undefined;
+    exportparts?: string | undefined | undefined;
+    part?: string | undefined | undefined;
+    "aria-activedescendant"?: string | undefined | undefined;
+    "aria-atomic"?: (boolean | "true" | "false") | undefined;
+    "aria-autocomplete"?: "none" | "inline" | "list" | "both" | undefined | undefined;
+    "aria-braillelabel"?: string | undefined | undefined;
+    "aria-brailleroledescription"?: string | undefined | undefined;
+    "aria-busy"?: (boolean | "true" | "false") | undefined;
+    "aria-checked"?: boolean | "false" | "mixed" | "true" | undefined | undefined;
+    "aria-colcount"?: number | undefined | undefined;
+    "aria-colindex"?: number | undefined | undefined;
+    "aria-colindextext"?: string | undefined | undefined;
+    "aria-colspan"?: number | undefined | undefined;
+    "aria-controls"?: string | undefined | undefined;
+    "aria-current"?: boolean | "false" | "true" | "page" | "step" | "location" | "date" | "time" | undefined | undefined;
+    "aria-describedby"?: string | undefined | undefined;
+    "aria-description"?: string | undefined | undefined;
+    "aria-details"?: string | undefined | undefined;
+    "aria-disabled"?: (boolean | "true" | "false") | undefined;
+    "aria-dropeffect"?: "none" | "copy" | "execute" | "link" | "move" | "popup" | undefined | undefined;
+    "aria-errormessage"?: string | undefined | undefined;
+    "aria-expanded"?: (boolean | "true" | "false") | undefined;
+    "aria-flowto"?: string | undefined | undefined;
+    "aria-grabbed"?: (boolean | "true" | "false") | undefined;
+    "aria-haspopup"?: boolean | "false" | "true" | "menu" | "listbox" | "tree" | "grid" | "dialog" | undefined | undefined;
+    "aria-hidden"?: (boolean | "true" | "false") | undefined;
+    "aria-invalid"?: boolean | "false" | "true" | "grammar" | "spelling" | undefined | undefined;
+    "aria-keyshortcuts"?: string | undefined | undefined;
+    "aria-label"?: string | undefined | undefined;
+    "aria-labelledby"?: string | undefined | undefined;
+    "aria-level"?: number | undefined | undefined;
+    "aria-live"?: "off" | "assertive" | "polite" | undefined | undefined;
+    "aria-modal"?: (boolean | "true" | "false") | undefined;
+    "aria-multiline"?: (boolean | "true" | "false") | undefined;
+    "aria-multiselectable"?: (boolean | "true" | "false") | undefined;
+    "aria-orientation"?: "horizontal" | "vertical" | undefined | undefined;
+    "aria-owns"?: string | undefined | undefined;
+    "aria-placeholder"?: string | undefined | undefined;
+    "aria-posinset"?: number | undefined | undefined;
+    "aria-pressed"?: boolean | "false" | "mixed" | "true" | undefined | undefined;
+    "aria-readonly"?: (boolean | "true" | "false") | undefined;
+    "aria-relevant"?: "additions" | "additions removals" | "additions text" | "all" | "removals" | "removals additions" | "removals text" | "text" | "text additions" | "text removals" | undefined | undefined;
+    "aria-required"?: (boolean | "true" | "false") | undefined;
+    "aria-roledescription"?: string | undefined | undefined;
+    "aria-rowcount"?: number | undefined | undefined;
+    "aria-rowindex"?: number | undefined | undefined;
+    "aria-rowindextext"?: string | undefined | undefined;
+    "aria-rowspan"?: number | undefined | undefined;
+    "aria-selected"?: (boolean | "true" | "false") | undefined;
+    "aria-setsize"?: number | undefined | undefined;
+    "aria-sort"?: "none" | "ascending" | "descending" | "other" | undefined | undefined;
+    "aria-valuemax"?: number | undefined | undefined;
+    "aria-valuemin"?: number | undefined | undefined;
+    "aria-valuenow"?: number | undefined | undefined;
+    "aria-valuetext"?: string | undefined | undefined;
+    dangerouslySetInnerHTML?: {
+        __html: string | TrustedHTML;
+    } | undefined | undefined;
+    onCopy?: react.ClipboardEventHandler<HTMLParagraphElement> | undefined;
+    onCopyCapture?: react.ClipboardEventHandler<HTMLParagraphElement> | undefined;
+    onCut?: react.ClipboardEventHandler<HTMLParagraphElement> | undefined;
+    onCutCapture?: react.ClipboardEventHandler<HTMLParagraphElement> | undefined;
+    onPaste?: react.ClipboardEventHandler<HTMLParagraphElement> | undefined;
+    onPasteCapture?: react.ClipboardEventHandler<HTMLParagraphElement> | undefined;
+    onCompositionEnd?: react.CompositionEventHandler<HTMLParagraphElement> | undefined;
+    onCompositionEndCapture?: react.CompositionEventHandler<HTMLParagraphElement> | undefined;
+    onCompositionStart?: react.CompositionEventHandler<HTMLParagraphElement> | undefined;
+    onCompositionStartCapture?: react.CompositionEventHandler<HTMLParagraphElement> | undefined;
+    onCompositionUpdate?: react.CompositionEventHandler<HTMLParagraphElement> | undefined;
+    onCompositionUpdateCapture?: react.CompositionEventHandler<HTMLParagraphElement> | undefined;
+    onFocus?: react.FocusEventHandler<HTMLParagraphElement> | undefined;
+    onFocusCapture?: react.FocusEventHandler<HTMLParagraphElement> | undefined;
+    onBlur?: react.FocusEventHandler<HTMLParagraphElement> | undefined;
+    onBlurCapture?: react.FocusEventHandler<HTMLParagraphElement> | undefined;
+    onChange?: react.ChangeEventHandler<HTMLParagraphElement, Element> | undefined;
+    onChangeCapture?: react.ChangeEventHandler<HTMLParagraphElement, Element> | undefined;
+    onBeforeInput?: react.InputEventHandler<HTMLParagraphElement> | undefined;
+    onBeforeInputCapture?: react.InputEventHandler<HTMLParagraphElement> | undefined;
+    onInput?: react.InputEventHandler<HTMLParagraphElement> | undefined;
+    onInputCapture?: react.InputEventHandler<HTMLParagraphElement> | undefined;
+    onReset?: react.ReactEventHandler<HTMLParagraphElement> | undefined;
+    onResetCapture?: react.ReactEventHandler<HTMLParagraphElement> | undefined;
+    onSubmit?: react.SubmitEventHandler<HTMLParagraphElement> | undefined;
+    onSubmitCapture?: react.SubmitEventHandler<HTMLParagraphElement> | undefined;
+    onInvalid?: react.ReactEventHandler<HTMLParagraphElement> | undefined;
+    onInvalidCapture?: react.ReactEventHandler<HTMLParagraphElement> | undefined;
+    onLoad?: react.ReactEventHandler<HTMLParagraphElement> | undefined;
+    onLoadCapture?: react.ReactEventHandler<HTMLParagraphElement> | undefined;
+    onError?: react.ReactEventHandler<HTMLParagraphElement> | undefined;
+    onErrorCapture?: react.ReactEventHandler<HTMLParagraphElement> | undefined;
+    onKeyDown?: react.KeyboardEventHandler<HTMLParagraphElement> | undefined;
+    onKeyDownCapture?: react.KeyboardEventHandler<HTMLParagraphElement> | undefined;
+    onKeyPress?: react.KeyboardEventHandler<HTMLParagraphElement> | undefined;
+    onKeyPressCapture?: react.KeyboardEventHandler<HTMLParagraphElement> | undefined;
+    onKeyUp?: react.KeyboardEventHandler<HTMLParagraphElement> | undefined;
+    onKeyUpCapture?: react.KeyboardEventHandler<HTMLParagraphElement> | undefined;
+    onAbort?: react.ReactEventHandler<HTMLParagraphElement> | undefined;
+    onAbortCapture?: react.ReactEventHandler<HTMLParagraphElement> | undefined;
+    onCanPlay?: react.ReactEventHandler<HTMLParagraphElement> | undefined;
+    onCanPlayCapture?: react.ReactEventHandler<HTMLParagraphElement> | undefined;
+    onCanPlayThrough?: react.ReactEventHandler<HTMLParagraphElement> | undefined;
+    onCanPlayThroughCapture?: react.ReactEventHandler<HTMLParagraphElement> | undefined;
+    onDurationChange?: react.ReactEventHandler<HTMLParagraphElement> | undefined;
+    onDurationChangeCapture?: react.ReactEventHandler<HTMLParagraphElement> | undefined;
+    onEmptied?: react.ReactEventHandler<HTMLParagraphElement> | undefined;
+    onEmptiedCapture?: react.ReactEventHandler<HTMLParagraphElement> | undefined;
+    onEncrypted?: react.ReactEventHandler<HTMLParagraphElement> | undefined;
+    onEncryptedCapture?: react.ReactEventHandler<HTMLParagraphElement> | undefined;
+    onEnded?: react.ReactEventHandler<HTMLParagraphElement> | undefined;
+    onEndedCapture?: react.ReactEventHandler<HTMLParagraphElement> | undefined;
+    onLoadedData?: react.ReactEventHandler<HTMLParagraphElement> | undefined;
+    onLoadedDataCapture?: react.ReactEventHandler<HTMLParagraphElement> | undefined;
+    onLoadedMetadata?: react.ReactEventHandler<HTMLParagraphElement> | undefined;
+    onLoadedMetadataCapture?: react.ReactEventHandler<HTMLParagraphElement> | undefined;
+    onLoadStart?: react.ReactEventHandler<HTMLParagraphElement> | undefined;
+    onLoadStartCapture?: react.ReactEventHandler<HTMLParagraphElement> | undefined;
+    onPause?: react.ReactEventHandler<HTMLParagraphElement> | undefined;
+    onPauseCapture?: react.ReactEventHandler<HTMLParagraphElement> | undefined;
+    onPlay?: react.ReactEventHandler<HTMLParagraphElement> | undefined;
+    onPlayCapture?: react.ReactEventHandler<HTMLParagraphElement> | undefined;
+    onPlaying?: react.ReactEventHandler<HTMLParagraphElement> | undefined;
+    onPlayingCapture?: react.ReactEventHandler<HTMLParagraphElement> | undefined;
+    onProgress?: react.ReactEventHandler<HTMLParagraphElement> | undefined;
+    onProgressCapture?: react.ReactEventHandler<HTMLParagraphElement> | undefined;
+    onRateChange?: react.ReactEventHandler<HTMLParagraphElement> | undefined;
+    onRateChangeCapture?: react.ReactEventHandler<HTMLParagraphElement> | undefined;
+    onSeeked?: react.ReactEventHandler<HTMLParagraphElement> | undefined;
+    onSeekedCapture?: react.ReactEventHandler<HTMLParagraphElement> | undefined;
+    onSeeking?: react.ReactEventHandler<HTMLParagraphElement> | undefined;
+    onSeekingCapture?: react.ReactEventHandler<HTMLParagraphElement> | undefined;
+    onStalled?: react.ReactEventHandler<HTMLParagraphElement> | undefined;
+    onStalledCapture?: react.ReactEventHandler<HTMLParagraphElement> | undefined;
+    onSuspend?: react.ReactEventHandler<HTMLParagraphElement> | undefined;
+    onSuspendCapture?: react.ReactEventHandler<HTMLParagraphElement> | undefined;
+    onTimeUpdate?: react.ReactEventHandler<HTMLParagraphElement> | undefined;
+    onTimeUpdateCapture?: react.ReactEventHandler<HTMLParagraphElement> | undefined;
+    onVolumeChange?: react.ReactEventHandler<HTMLParagraphElement> | undefined;
+    onVolumeChangeCapture?: react.ReactEventHandler<HTMLParagraphElement> | undefined;
+    onWaiting?: react.ReactEventHandler<HTMLParagraphElement> | undefined;
+    onWaitingCapture?: react.ReactEventHandler<HTMLParagraphElement> | undefined;
+    onAuxClick?: react.MouseEventHandler<HTMLParagraphElement> | undefined;
+    onAuxClickCapture?: react.MouseEventHandler<HTMLParagraphElement> | undefined;
+    onClick?: react.MouseEventHandler<HTMLParagraphElement> | undefined;
+    onClickCapture?: react.MouseEventHandler<HTMLParagraphElement> | undefined;
+    onContextMenu?: react.MouseEventHandler<HTMLParagraphElement> | undefined;
+    onContextMenuCapture?: react.MouseEventHandler<HTMLParagraphElement> | undefined;
+    onDoubleClick?: react.MouseEventHandler<HTMLParagraphElement> | undefined;
+    onDoubleClickCapture?: react.MouseEventHandler<HTMLParagraphElement> | undefined;
+    onDrag?: react.DragEventHandler<HTMLParagraphElement> | undefined;
+    onDragCapture?: react.DragEventHandler<HTMLParagraphElement> | undefined;
+    onDragEnd?: react.DragEventHandler<HTMLParagraphElement> | undefined;
+    onDragEndCapture?: react.DragEventHandler<HTMLParagraphElement> | undefined;
+    onDragEnter?: react.DragEventHandler<HTMLParagraphElement> | undefined;
+    onDragEnterCapture?: react.DragEventHandler<HTMLParagraphElement> | undefined;
+    onDragExit?: react.DragEventHandler<HTMLParagraphElement> | undefined;
+    onDragExitCapture?: react.DragEventHandler<HTMLParagraphElement> | undefined;
+    onDragLeave?: react.DragEventHandler<HTMLParagraphElement> | undefined;
+    onDragLeaveCapture?: react.DragEventHandler<HTMLParagraphElement> | undefined;
+    onDragOver?: react.DragEventHandler<HTMLParagraphElement> | undefined;
+    onDragOverCapture?: react.DragEventHandler<HTMLParagraphElement> | undefined;
+    onDragStart?: react.DragEventHandler<HTMLParagraphElement> | undefined;
+    onDragStartCapture?: react.DragEventHandler<HTMLParagraphElement> | undefined;
+    onDrop?: react.DragEventHandler<HTMLParagraphElement> | undefined;
+    onDropCapture?: react.DragEventHandler<HTMLParagraphElement> | undefined;
+    onMouseDown?: react.MouseEventHandler<HTMLParagraphElement> | undefined;
+    onMouseDownCapture?: react.MouseEventHandler<HTMLParagraphElement> | undefined;
+    onMouseEnter?: react.MouseEventHandler<HTMLParagraphElement> | undefined;
+    onMouseLeave?: react.MouseEventHandler<HTMLParagraphElement> | undefined;
+    onMouseMove?: react.MouseEventHandler<HTMLParagraphElement> | undefined;
+    onMouseMoveCapture?: react.MouseEventHandler<HTMLParagraphElement> | undefined;
+    onMouseOut?: react.MouseEventHandler<HTMLParagraphElement> | undefined;
+    onMouseOutCapture?: react.MouseEventHandler<HTMLParagraphElement> | undefined;
+    onMouseOver?: react.MouseEventHandler<HTMLParagraphElement> | undefined;
+    onMouseOverCapture?: react.MouseEventHandler<HTMLParagraphElement> | undefined;
+    onMouseUp?: react.MouseEventHandler<HTMLParagraphElement> | undefined;
+    onMouseUpCapture?: react.MouseEventHandler<HTMLParagraphElement> | undefined;
+    onSelect?: react.ReactEventHandler<HTMLParagraphElement> | undefined;
+    onSelectCapture?: react.ReactEventHandler<HTMLParagraphElement> | undefined;
+    onTouchCancel?: react.TouchEventHandler<HTMLParagraphElement> | undefined;
+    onTouchCancelCapture?: react.TouchEventHandler<HTMLParagraphElement> | undefined;
+    onTouchEnd?: react.TouchEventHandler<HTMLParagraphElement> | undefined;
+    onTouchEndCapture?: react.TouchEventHandler<HTMLParagraphElement> | undefined;
+    onTouchMove?: react.TouchEventHandler<HTMLParagraphElement> | undefined;
+    onTouchMoveCapture?: react.TouchEventHandler<HTMLParagraphElement> | undefined;
+    onTouchStart?: react.TouchEventHandler<HTMLParagraphElement> | undefined;
+    onTouchStartCapture?: react.TouchEventHandler<HTMLParagraphElement> | undefined;
+    onPointerDown?: react.PointerEventHandler<HTMLParagraphElement> | undefined;
+    onPointerDownCapture?: react.PointerEventHandler<HTMLParagraphElement> | undefined;
+    onPointerMove?: react.PointerEventHandler<HTMLParagraphElement> | undefined;
+    onPointerMoveCapture?: react.PointerEventHandler<HTMLParagraphElement> | undefined;
+    onPointerUp?: react.PointerEventHandler<HTMLParagraphElement> | undefined;
+    onPointerUpCapture?: react.PointerEventHandler<HTMLParagraphElement> | undefined;
+    onPointerCancel?: react.PointerEventHandler<HTMLParagraphElement> | undefined;
+    onPointerCancelCapture?: react.PointerEventHandler<HTMLParagraphElement> | undefined;
+    onPointerEnter?: react.PointerEventHandler<HTMLParagraphElement> | undefined;
+    onPointerLeave?: react.PointerEventHandler<HTMLParagraphElement> | undefined;
+    onPointerOver?: react.PointerEventHandler<HTMLParagraphElement> | undefined;
+    onPointerOverCapture?: react.PointerEventHandler<HTMLParagraphElement> | undefined;
+    onPointerOut?: react.PointerEventHandler<HTMLParagraphElement> | undefined;
+    onPointerOutCapture?: react.PointerEventHandler<HTMLParagraphElement> | undefined;
+    onGotPointerCapture?: react.PointerEventHandler<HTMLParagraphElement> | undefined;
+    onGotPointerCaptureCapture?: react.PointerEventHandler<HTMLParagraphElement> | undefined;
+    onLostPointerCapture?: react.PointerEventHandler<HTMLParagraphElement> | undefined;
+    onLostPointerCaptureCapture?: react.PointerEventHandler<HTMLParagraphElement> | undefined;
+    onScroll?: react.UIEventHandler<HTMLParagraphElement> | undefined;
+    onScrollCapture?: react.UIEventHandler<HTMLParagraphElement> | undefined;
+    onScrollEnd?: react.UIEventHandler<HTMLParagraphElement> | undefined;
+    onScrollEndCapture?: react.UIEventHandler<HTMLParagraphElement> | undefined;
+    onWheel?: react.WheelEventHandler<HTMLParagraphElement> | undefined;
+    onWheelCapture?: react.WheelEventHandler<HTMLParagraphElement> | undefined;
+    onAnimationStart?: react.AnimationEventHandler<HTMLParagraphElement> | undefined;
+    onAnimationStartCapture?: react.AnimationEventHandler<HTMLParagraphElement> | undefined;
+    onAnimationEnd?: react.AnimationEventHandler<HTMLParagraphElement> | undefined;
+    onAnimationEndCapture?: react.AnimationEventHandler<HTMLParagraphElement> | undefined;
+    onAnimationIteration?: react.AnimationEventHandler<HTMLParagraphElement> | undefined;
+    onAnimationIterationCapture?: react.AnimationEventHandler<HTMLParagraphElement> | undefined;
+    onToggle?: react.ToggleEventHandler<HTMLParagraphElement> | undefined;
+    onBeforeToggle?: react.ToggleEventHandler<HTMLParagraphElement> | undefined;
+    onTransitionCancel?: react.TransitionEventHandler<HTMLParagraphElement> | undefined;
+    onTransitionCancelCapture?: react.TransitionEventHandler<HTMLParagraphElement> | undefined;
+    onTransitionEnd?: react.TransitionEventHandler<HTMLParagraphElement> | undefined;
+    onTransitionEndCapture?: react.TransitionEventHandler<HTMLParagraphElement> | undefined;
+    onTransitionRun?: react.TransitionEventHandler<HTMLParagraphElement> | undefined;
+    onTransitionRunCapture?: react.TransitionEventHandler<HTMLParagraphElement> | undefined;
+    onTransitionStart?: react.TransitionEventHandler<HTMLParagraphElement> | undefined;
+    onTransitionStartCapture?: react.TransitionEventHandler<HTMLParagraphElement> | undefined;
+    'data-family'?: string;
+    className: string;
+    'data-size': WordDiffSize;
+}, HTMLParagraphElement>;
+
+interface QuoteProps extends ComponentPropsWithRef<'figure'> {
+    /** Who said it, shown as a small overline before the words: "You". */
+    label: ReactNode;
+    /** The quoted words. Phrasing content: the quote renders inline after the label. */
+    children: ReactNode;
+}
+/**
+ * Someone's own words echoed back on the accent wash, with who said them: the instruction you gave above the
+ * rewrite it produced. A `<figure>` whose `<figcaption>` is the label and whose `<blockquote>` is the text, so the
+ * attribution is part of the semantics, not just the styling.
+ */
+declare function Quote({ label, className, children, ...rest }: QuoteProps): react.JSX.Element;
+
 declare const version = "0.1.1";
 
-export { ArchiveIcon, ArrowDownIcon, ArrowLeftIcon, ArrowRightIcon, ArrowUpIcon, Badge, Banner, BellIcon, BriefcaseIcon, Button, CalendarIcon, Card, CheckIcon, Checkbox, ChevronDownIcon, ChevronLeftIcon, ChevronRightIcon, ChevronUpIcon, CircleCheckIcon, CircleXIcon, ClockIcon, CopyIcon, Dialog, DocumentIcon, DownloadIcon, EditIcon, ExternalLinkIcon, EyeIcon, FilterIcon, FlagIcon, Heading, Icon, IconButton, InboxIcon, InfoIcon, Inline, Input, Kbd, LinkIcon, MailIcon, MapPinIcon, Menu, MenuIcon, MinusIcon, MoonIcon, MoreHorizontalIcon, MoreVerticalIcon, PauseIcon, PlayIcon, PlusIcon, Progress, RefreshIcon, SearchIcon, Select, SettingsIcon, Spinner, Stack, StarIcon, Stat, SunIcon, Switch, Table, Tabs, Text, Textarea, ThumbsDownIcon, ThumbsUpIcon, Toolbar, Tooltip, TrashIcon, UndoIcon, UserIcon, WarningIcon, XIcon, iconNames, version };
-export type { BadgeProps, BadgeSize, BadgeTone, BadgeVariant, BannerProps, BannerTone, ButtonProps, ButtonSize, ButtonVariant, CardElement, CardPadding, CardProps, CardVariant, CheckboxProps, ControlSize, DialogActionsProps, DialogBodyProps, DialogCloseProps, DialogContentProps, DialogDescriptionProps, DialogRootProps, DialogSize, DialogTitleProps, FieldProps, HeadingElement, HeadingLevel, HeadingProps, HeadingSize, IconButtonProps, IconGlyphProps, IconName, IconProps, IconSize, InlineAlign, InlineElement, InlineJustify, InlineProps, InputProps, KbdGroupProps, KbdProps, MenuAlign, MenuCheckboxItemProps, MenuContentProps, MenuGroupProps, MenuItemProps, MenuItemTone, MenuLinkItemProps, MenuRadioGroupProps, MenuRadioItemProps, MenuRootProps, MenuSeparatorProps, MenuSide, MenuTriggerProps, ProgressProps, ProgressSize, ProgressTone, ProgressVariant, SelectGroup, SelectOption, SelectProps, SpacingSize, SpinnerProps, StackAlign, StackElement, StackJustify, StackProps, StatDeltaTone, StatElement, StatProps, StatSize, StatTrend, StatVariant, SwitchProps, TableAlign, TableBodyProps, TableCaptionProps, TableCellProps, TableDensity, TableFootProps, TableHeadProps, TableHeaderProps, TableRootProps, TableRowProps, TabsListProps, TabsPanelProps, TabsRootProps, TabsTabProps, TextAlign, TextElement, TextProps, TextSize, TextTone, TextWeight, TextareaProps, ToolbarButtonProps, ToolbarGroupProps, ToolbarRootProps, ToolbarSeparatorProps, ToolbarSpacerProps, TooltipAlign, TooltipProps, TooltipSide };
+export { ArchiveIcon, ArrowDownIcon, ArrowLeftIcon, ArrowRightIcon, ArrowUpIcon, Badge, Banner, BellIcon, BriefcaseIcon, BroomIcon, Button, CalendarIcon, Card, CheckIcon, Checkbox, ChevronDownIcon, ChevronLeftIcon, ChevronRightIcon, ChevronUpIcon, Chip, CircleCheckIcon, CircleXIcon, ClockIcon, CopyIcon, Dialog, Disclosure, DocumentIcon, DownloadIcon, EditIcon, EmptyState, ExternalLinkIcon, EyeIcon, FileInput, FilePreviewDialog, FilterIcon, FlagIcon, FullScreenFlow, Heading, Icon, IconButton, InboxIcon, InfoIcon, Inline, Input, Kbd, LinkIcon, MailIcon, MapPinIcon, Menu, MenuIcon, MinusIcon, MoonIcon, MoreHorizontalIcon, MoreVerticalIcon, PauseIcon, PlayIcon, PlusIcon, Popover, PriorityNav, Progress$1 as Progress, Quote, ReasonList, RefreshIcon, Score, SearchIcon, Select, SelectionBar, SettingsIcon, Skeleton, Spinner, Stack, StarIcon, Stat, SunIcon, Switch, Table, Tabs, Text, Textarea, ThumbsDownIcon, ThumbsUpIcon, Toast, Toolbar, Tooltip, TrashIcon, UndoIcon, UserIcon, WarningIcon, WordDiff, XIcon, iconNames, useRowSelection, useToast, version };
+export type { BadgeProps, BadgeSize, BadgeTone, BadgeVariant, BannerProps, BannerTone, BroomIconProps, ButtonProps, ButtonSize, ButtonVariant, CardElement, CardPadding, CardProps, CardVariant, CheckboxProps, ChipProps, ChipSize, ChipTone, ControlSize, DialogActionsProps, DialogBodyProps, DialogCloseProps, DialogCloseRequestReason, DialogContentProps, DialogDescriptionProps, DialogRootProps, DialogSize, DialogTitleProps, DialogVariant, DisclosureProps, EmptyStateElement, EmptyStateProps, EmptyStateSize, FieldProps, FileInputProps, FilePreviewDialogProps, FlowChapter, FlowCloseRequestReason, FlowDirection, FullScreenFlowBodyProps, FullScreenFlowFooterProps, FullScreenFlowHeaderProps, FullScreenFlowProgressProps, FullScreenFlowRailGroupProps, FullScreenFlowRailItemProps, FullScreenFlowRailProps, FullScreenFlowRootProps, FullScreenFlowStepProps, FullScreenFlowViewportProps, HeadingElement, HeadingLevel, HeadingProps, HeadingSize, IconButtonDotTone, IconButtonProps, IconGlyphProps, IconName, IconProps, IconSize, InlineAlign, InlineElement, InlineJustify, InlineProps, InputProps, KbdGroupProps, KbdProps, MenuAlign, MenuCheckboxItemProps, MenuContentProps, MenuGroupProps, MenuItemProps, MenuItemTone, MenuLinkItemProps, MenuRadioGroupProps, MenuRadioItemProps, MenuRootProps, MenuSeparatorProps, MenuSide, MenuTriggerProps, PopoverAlign, PopoverCloseProps, PopoverContentProps, PopoverDescriptionProps, PopoverRootProps, PopoverSide, PopoverTitleProps, PopoverTriggerProps, PriorityNavItem, PriorityNavLinkProps, PriorityNavProps, ProgressProps, ProgressSize, ProgressTone, ProgressVariant, QuoteProps, ReasonListItemProps, ReasonListProps, ReasonListSize, ReasonTone, RowSelection, RowSelectionHeaderState, ScoreProps, ScoreSize, ScoreTone, ScoreVariant, SelectGroup, SelectOption, SelectProps, SelectionBarProps, SkeletonProps, SkeletonVariant, SpacingSize, SpinnerProps, StackAlign, StackElement, StackJustify, StackProps, StatDeltaTone, StatElement, StatProps, StatSize, StatTrend, StatVariant, SwitchProps, TableAlign, TableBodyProps, TableCaptionProps, TableCellProps, TableDensity, TableFootProps, TableHeadProps, TableHeaderProps, TableRootProps, TableRowProps, TableSelectionCellProps, TableSelectionHeaderProps, TableSortDirection, TabsListProps, TabsListVariant, TabsPanelProps, TabsRootProps, TabsTabProps, TextAlign, TextElement, TextFamily, TextProps, TextSize, TextTone, TextWeight, TextareaProps, TextareaVariant, ToastApi, ToastOptions, ToastProviderProps, ToastTone, ToolbarButtonProps, ToolbarGroupProps, ToolbarLinkProps, ToolbarRootProps, ToolbarSeparatorProps, ToolbarSpacerProps, TooltipAlign, TooltipProps, TooltipSide, WordDiffElement, WordDiffKind, WordDiffPart, WordDiffProps, WordDiffSize };