@elabs-ai/components-ui 4.0.0

package/dist/index.d.ts

@@ -0,0 +1,4497 @@
+import { ClassValue } from 'clsx';
+import { LucideIcon, LucideProps } from 'lucide-react';
+import * as react from 'react';
+import react__default, { HTMLAttributes, ReactNode, InputHTMLAttributes, ButtonHTMLAttributes, ComponentProps, ComponentPropsWithoutRef, ReactElement, TextareaHTMLAttributes, TdHTMLAttributes, ThHTMLAttributes, LiHTMLAttributes, AnchorHTMLAttributes, OlHTMLAttributes } from 'react';
+import * as AccordionPrimitive from '@radix-ui/react-accordion';
+import * as class_variance_authority_types from 'class-variance-authority/types';
+import * as _radix_ui_react_separator from '@radix-ui/react-separator';
+import { VariantProps } from 'class-variance-authority';
+import * as TooltipPrimitive from '@radix-ui/react-tooltip';
+import * as AlertDialogPrimitive from '@radix-ui/react-alert-dialog';
+import * as AspectRatioPrimitive from '@radix-ui/react-aspect-ratio';
+import * as AvatarPrimitive from '@radix-ui/react-avatar';
+import { DayPicker, DateRange } from 'react-day-picker';
+export { DateRange } from 'react-day-picker';
+import useEmblaCarousel, { UseEmblaCarouselType } from 'embla-carousel-react';
+import * as CheckboxPrimitive from '@radix-ui/react-checkbox';
+import * as CollapsiblePrimitive from '@radix-ui/react-collapsible';
+import { Command as Command$1 } from 'cmdk';
+import * as DialogPrimitive from '@radix-ui/react-dialog';
+import * as ContextMenuPrimitive from '@radix-ui/react-context-menu';
+import * as vaul from 'vaul';
+import { Drawer as Drawer$1 } from 'vaul';
+import * as DropdownMenuPrimitive from '@radix-ui/react-dropdown-menu';
+import * as _radix_ui_react_slot from '@radix-ui/react-slot';
+import * as _radix_ui_react_label from '@radix-ui/react-label';
+import * as react_hook_form from 'react-hook-form';
+import { FieldValues, FieldPath, ControllerProps } from 'react-hook-form';
+import * as HoverCardPrimitive from '@radix-ui/react-hover-card';
+import * as input_otp from 'input-otp';
+import * as PopoverPrimitive from '@radix-ui/react-popover';
+import * as MenubarPrimitive from '@radix-ui/react-menubar';
+export { Group as MenubarGroup, Menu as MenubarMenu, Portal as MenubarPortal, RadioGroup as MenubarRadioGroup, Sub as MenubarSub } from '@radix-ui/react-menubar';
+import * as NavigationMenuPrimitive from '@radix-ui/react-navigation-menu';
+import * as ProgressPrimitive from '@radix-ui/react-progress';
+import * as RadioGroupPrimitive from '@radix-ui/react-radio-group';
+import * as ResizablePrimitive from 'react-resizable-panels';
+import * as ScrollAreaPrimitive from '@radix-ui/react-scroll-area';
+import * as SelectPrimitive from '@radix-ui/react-select';
+import * as SliderPrimitive from '@radix-ui/react-slider';
+import { Toaster as Toaster$1 } from 'sonner';
+export { toast } from 'sonner';
+import * as SwitchPrimitive from '@radix-ui/react-switch';
+import * as TabsPrimitive from '@radix-ui/react-tabs';
+import { ThemeName } from '@elabs-ai/components-tokens';
+import * as TogglePrimitive from '@radix-ui/react-toggle';
+import * as ToggleGroupPrimitive from '@radix-ui/react-toggle-group';
+import * as ToolbarPrimitive from '@radix-ui/react-toolbar';
+import { Virtualizer } from '@tanstack/react-virtual';
+
+/**
+ * Merge class names with conflict resolution. `clsx` handles conditionals;
+ * `tailwind-merge` ensures later Tailwind utilities win (e.g. `p-2 p-4` -> `p-4`).
+ * Use this in every component that accepts a `className` prop.
+ */
+declare function cn(...inputs: ClassValue[]): string;
+
+/** Returns true when the viewport is below the mobile breakpoint (768px). */
+declare function useIsMobile(): boolean;
+
+/**
+ * Browser file-download helpers — the single home for the
+ * `Blob`/URL → hidden `<a download>` → click → revoke dance that was previously
+ * copy-pasted across `@elabs-ai/components-ai` (ConversationDownload), `@elabs-ai/components-data`
+ * (downloadCsv) and now `@elabs-ai/components-ai` Gallery.
+ *
+ * Pure DOM mechanics, no React, no other deps — and SSR-guarded
+ * (`typeof document === "undefined"` → no-op) so it's safe to import from
+ * dependency-light modules. The CONTENT (CSV serialization, markdown export,
+ * image source) stays with each caller; this only triggers the save.
+ */
+/**
+ * Trigger a download for an in-memory `Blob`. No-op in non-DOM environments.
+ * Revokes the object URL immediately after the click (the browser captures the
+ * download synchronously, mirroring the prior call sites).
+ */
+declare function downloadBlob(blob: Blob, filename: string): void;
+/**
+ * Trigger a download for an existing `url` (an http(s)/relative URL, or a
+ * `data:`/`blob:` URI). No-op in non-DOM environments.
+ *
+ * Same-origin / `blob:` / `data:` → a direct `<a download>` (honors `filename`).
+ * Cross-origin → the browser ignores the `download` filename, so we `fetch` the
+ * bytes and save via {@link downloadBlob}. This requires the server to allow CORS;
+ * on failure (CORS/opaque/offline) we fall back to opening the source in a new
+ * tab so the user still gets the asset. Fire-and-forget: `void downloadUrl(...)`.
+ */
+declare function downloadUrl(url: string, filename?: string): Promise<void>;
+
+/** How long the transient "copied" state stays true before it resets. */
+declare const COPY_FEEDBACK_MS = 1500;
+interface UseCopyToClipboardOptions {
+    /** ms the `copied` flag stays true. Default: {@link COPY_FEEDBACK_MS}. */
+    resetAfterMs?: number;
+}
+interface CopyToClipboard {
+    /** True for `resetAfterMs` after a successful copy. */
+    copied: boolean;
+    /** Writes `text` to the clipboard. Resolves `false` when it could not. */
+    copy: (text: string) => Promise<boolean>;
+}
+/**
+ * Copy-to-clipboard with a transient confirmation flag.
+ *
+ * One implementation for the whole library — the copy button in
+ * `@elabs-ai/components-editor` and `CopyableValue` share it, so the
+ * timing, the unmount cleanup and the "no clipboard here" answer are defined
+ * once instead of re-derived per component.
+ *
+ * `navigator.clipboard` is absent under SSR, in jsdom, and in any insecure
+ * (non-`https`, non-`localhost`) context. That is reported as `false` rather
+ * than thrown: a copy affordance failing is a papercut, not a crash, and the
+ * caller decides whether to say anything about it. The deprecated
+ * `document.execCommand("copy")` fallback is deliberately not used.
+ */
+declare function useCopyToClipboard(options?: UseCopyToClipboardOptions): CopyToClipboard;
+
+/**
+ * The one file-type resolver for the whole library — extension + MIME → a
+ * COARSE, CLOSED category.
+ *
+ * Before this existed the repo had three competing, package-private ideas of
+ * "what kind of file is this": `ContextAssetType`
+ * (`markdown|code|sql|csv|image`, `@elabs-ai/components-ai`),
+ * `AttachmentMediaCategory` (six MIME buckets, same package) and
+ * `UploadFile` (no kind at all, `@elabs-ai/components-ui`). None could
+ * see the others, so each grew its own icon map and its own gaps.
+ *
+ * ## Why the category is closed and coarse (ADR 0024 §4)
+ *
+ * {@link FileCategory} answers "what SHAPE of thing is this" — enough to pick an
+ * icon, a label, or a fallback surface. It is deliberately NOT the routing key
+ * for a renderer. Fine-grained format matching (`.docx` vs `.odt`,
+ * `.tsx` vs `.rs`) belongs to the adapter manifests in the package that owns the
+ * parsers, so adding a format never means editing this file — and never means a
+ * `@elabs-ai/components-ui` release.
+ *
+ * Pure data + string handling: no React, no DOM, no other deps.
+ */
+/**
+ * Coarse file shape. CLOSED — adding a member is a breaking change for any
+ * consumer with an exhaustive `switch`, so extend the adapter manifests instead.
+ */
+type FileCategory = "image" | "video" | "audio" | "document" | "spreadsheet" | "presentation" | "code" | "text" | "data" | "archive" | "unknown";
+/** What {@link resolveFileKind} knows about a file before anything reads it. */
+interface FileKind {
+    /** Coarse shape, for icons, labels and fallback surfaces. */
+    category: FileCategory;
+    /**
+     * Best-known MIME type. The caller's value wins when it is meaningful;
+     * otherwise inferred from the extension, else `"application/octet-stream"`.
+     */
+    mediaType: string;
+    /** Lowercased extension WITHOUT the dot (`"pdf"`), or `""` when there is none. */
+    extension: string;
+}
+/**
+ * Lowercased extension without the dot. `""` when the name has none, is a
+ * dotfile (`.gitignore` — the whole name is the "extension" to a human, but it
+ * is not a format), or ends in a dot.
+ */
+declare function extensionOf(name: string): string;
+/**
+ * Best-known MIME for a filename, from its extension alone.
+ * `undefined` when the extension is unknown — callers decide the fallback.
+ */
+declare function mediaTypeFromName(name: string): string | undefined;
+/**
+ * Resolve what a file is from its name and (optionally) the MIME the source
+ * reported. Never throws; unknown input resolves to
+ * `{ category: "unknown", mediaType: "application/octet-stream", extension: "" }`.
+ *
+ * A caller-supplied `mediaType` wins over the extension EXCEPT where the
+ * extension is strictly more specific — `report.csv` served as `text/plain`
+ * still resolves to `"data"`, because servers routinely under-specify.
+ */
+declare function resolveFileKind(name: string, mediaType?: string): FileKind;
+
+/**
+ * One input model for "a file", whatever the app happens to be holding.
+ *
+ * The library previously had three: a `File` (upload), a `string` of content
+ * (chat assets), and a bare URL (attachments) — so every surface that wanted to
+ * render a file first had to guess which of the three it had. {@link FileSource}
+ * is the union all of them collapse into, and {@link normalizeFileSource} turns
+ * any member into one uniform reader.
+ *
+ * Two things this fixes beyond the merge:
+ *
+ * - **Authenticated remote files work.** The `url` variant carries
+ *   `init?: RequestInit`, so headers, credentials and an abort signal reach the
+ *   fetch. A viewer that can only take a naked URL cannot open anything behind
+ *   auth, which is most enterprise content.
+ * - **Alt text has a home.** Every binary variant takes `alt`, so an image or a
+ *   rendered page can be described without a parallel prop channel.
+ *
+ * Pure DOM/platform mechanics: no React, no other deps. SSR-safe to import;
+ * only {@link ResolvedFileSource.url} needs a browser, and it says so.
+ */
+
+/** Any file the library can be handed. Discriminated on `kind`. */
+type FileSource = 
+/** A user-picked file. Name and MIME come from the platform. */
+{
+    kind: "file";
+    file: File;
+    alt?: string;
+}
+/** In-memory bytes that already have a `Blob` wrapper (a generated export, a decoded attachment). */
+ | {
+    kind: "blob";
+    blob: Blob;
+    name: string;
+    mediaType?: string;
+    alt?: string;
+}
+/**
+ * A remote file. `init` is passed straight to `fetch` — this is how auth
+ * headers, `credentials` and an `AbortSignal` reach the request.
+ */
+ | {
+    kind: "url";
+    url: string;
+    name?: string;
+    mediaType?: string;
+    alt?: string;
+    init?: RequestInit;
+}
+/** Raw bytes with no wrapper (a worker result, a WASM output). */
+ | {
+    kind: "buffer";
+    buffer: ArrayBuffer;
+    name: string;
+    mediaType: string;
+    alt?: string;
+}
+/** Content the app already has as a string (an agent's markdown, a code snippet). */
+ | {
+    kind: "text";
+    text: string;
+    name: string;
+    mediaType?: string;
+};
+/**
+ * A {@link FileSource} with its identity resolved and its bytes reachable the
+ * same way regardless of where they came from.
+ *
+ * Reads are memoized on success, so `text()` after `bytes()` costs nothing and a
+ * remote file is fetched once. A failed read is NOT cached — a retry re-runs it.
+ */
+interface ResolvedFileSource {
+    /** Display name, always non-empty. Derived from the URL path when the caller gave none. */
+    readonly name: string;
+    /** Best-known MIME, resolved from the declared type then the extension. */
+    readonly mediaType: string;
+    /** Coarse shape, for icons/labels/fallbacks. Not a renderer routing key. */
+    readonly category: FileCategory;
+    /** Lowercased extension without the dot, or `""`. */
+    readonly extension: string;
+    /** Author-supplied description, for images and rendered pages. */
+    readonly alt?: string;
+    /** Byte length when known up front. `undefined` for `text` and un-fetched `url` sources. */
+    readonly size?: number;
+    /** The full contents as bytes. */
+    bytes(signal?: AbortSignal): Promise<ArrayBuffer>;
+    /** The full contents decoded as UTF-8. */
+    text(signal?: AbortSignal): Promise<string>;
+    /**
+     * A URL usable as an `<img>`/`<video>`/`<iframe>` src.
+     *
+     * A public `url` source returns its own URL unchanged, so the browser streams
+     * it and no full read happens. Every other source (and any `url` source with
+     * an `init`, which the element could not replay) mints an object URL — release
+     * it with {@link revoke}. Browser only: rejects where `URL.createObjectURL`
+     * does not exist.
+     */
+    url(signal?: AbortSignal): Promise<string>;
+    /** Release any object URL this reader minted. Idempotent; safe to call unconditionally. */
+    revoke(): void;
+}
+/**
+ * Turn any {@link FileSource} into a uniform reader.
+ *
+ * Cheap and synchronous — it resolves identity only. Nothing is read, fetched or
+ * decoded until a `bytes()` / `text()` / `url()` call.
+ */
+declare function normalizeFileSource(source: FileSource): ResolvedFileSource;
+
+/**
+ * One glyph per {@link FileCategory} — the single icon map for file-shaped UI.
+ *
+ * Supersedes two package-private maps that could not see each other:
+ * `PRODUCED_ASSET_ICONS` (`@elabs-ai/components-ai` file-tree, keyed by
+ * the five-member `ContextAssetType`) and `mediaCategoryIcons` (same package,
+ * attachments, keyed by six MIME buckets) — so the same `.csv` drew a table glyph
+ * in one surface and a generic document glyph in the other.
+ *
+ * Lucide per `.claude/rules/icons.md`: these are generic UI glyphs, not product
+ * vocabulary, so nothing here belongs in
+ * `@elabs-ai/components-icons`.
+ *
+ * Values only — this module holds component REFERENCES, it renders nothing.
+ * Icons inherit color from `currentColor`; the category is never carried by hue
+ * alone, so a caller must still supply a text label or an `aria-label` on the
+ * control (WCAG 1.4.1).
+ */
+
+/** The glyph for each coarse file shape. Exhaustive over {@link FileCategory}. */
+declare const FILE_CATEGORY_ICONS: Readonly<Record<FileCategory, LucideIcon>>;
+/**
+ * The glyph for a file, resolved from its name and (optionally) MIME.
+ * Falls back to the generic file glyph rather than throwing.
+ */
+declare function fileIconFor(name: string, mediaType?: string): LucideIcon;
+
+/**
+ * How one part of a document is addressed.
+ *
+ * A viewer that can only open a file answers "here is the document". A viewer
+ * that can be pointed at a PART of one answers "here is the sentence that
+ * claim came from" — the RAG-citation case, and the same machinery behind
+ * find-in-document.
+ *
+ * ## Why this lives in `@elabs-ai/components-ui`
+ *
+ * The producer of an address (a chat answer's citation, in
+ * `@elabs-ai/components-ai`) and its consumer (the file viewer, in
+ * `@elabs-ai/components-viewer`) are Layer-2 siblings that may not
+ * import each other. `ui` is the only layer both reach, which is exactly why
+ * `FileSource` and `MatchRange` already live here. This module is a
+ * dependency-free leaf: types plus pure string functions, no React.
+ *
+ * ## Three kinds, one union
+ *
+ * Real producers disagree about what they can emit, so the union carries all
+ * three rather than forcing everyone through the weakest:
+ *
+ * - **`quote`** — the snippet text. The only kind that survives crossing a tool
+ *   boundary: an indexing pipeline's character offsets are computed against ITS
+ *   extraction of the PDF, never against ours, so its numbers are meaningless
+ *   here while its text still is. Lossy (a repeated phrase is ambiguous) and the
+ *   most useful.
+ * - **`range`** — exact character offsets, and exact only against the SAME text
+ *   projection: `AdapterDocument.text` as this build's adapter produced it. Use
+ *   it when both ends are ours (find-in-document, a second pass over a document
+ *   already open).
+ * - **`rect`** — page-relative boxes, `0..1` fractions of the page. Needs no
+ *   text at all, which is what makes it the answer for a scanned page, a chart,
+ *   a photo region, or any layout-analysis model whose output is geometry.
+ *
+ * ## The rule that lets this union grow
+ *
+ * A consumer matches only the kinds it declared it honours and reports the rest
+ * as unsupported — it never writes an exhaustive `switch` with a `never`
+ * fallthrough. That is what lets a fourth kind (a spreadsheet `cell` address,
+ * say) be added later without breaking every consumer that predates it.
+ */
+/** The address kinds, as a value — for capability declarations and iteration. */
+declare const DOCUMENT_ADDRESS_KINDS: readonly ["quote", "range", "rect"];
+/** Which way a part of a document is addressed. */
+type DocumentAddressKind = (typeof DOCUMENT_ADDRESS_KINDS)[number];
+/**
+ * A box on a page, as fractions of that page's own box.
+ *
+ * Fractions, not pixels, because the page is not a fixed size: it rescales with
+ * zoom, with the pane's width and with the device's pixel ratio. A consumer
+ * multiplies by the page element's live measured size at paint time, so the box
+ * stays put through every one of those. Origin is top-left (CSS), so `y` grows
+ * downward — matching the DOM rather than the PDF's own bottom-left space.
+ */
+interface DocumentRect {
+    /** Distance from the page's left edge, `0..1`. */
+    x: number;
+    /** Distance from the page's TOP edge, `0..1`. */
+    y: number;
+    /** Fraction of the page's width. */
+    width: number;
+    /** Fraction of the page's height. */
+    height: number;
+}
+/**
+ * Address by the text itself — the interoperable kind.
+ *
+ * Matching is done on the normalized form of both sides
+ * ({@link normalizeQuoteText}), so a quote survives the whitespace, quote-glyph
+ * and casing differences that every extractor introduces.
+ */
+interface QuoteAddress {
+    kind: "quote";
+    /** The passage to find. Whitespace and quote glyphs need not match exactly. */
+    text: string;
+    /**
+     * Which occurrence to take when the passage appears more than once, 1-based.
+     * Omitted means the first — or the one nearest {@link QuoteAddress.near},
+     * when that is given.
+     */
+    occurrence?: number;
+    /**
+     * A hint about where to look. It disambiguates repeats rather than restricting
+     * the search: the occurrence closest to it wins, and a passage that turns out
+     * to be elsewhere is still found.
+     */
+    near?: {
+        /**
+         * 1-based page (or slide) the passage is expected on.
+         *
+         * Advisory, and deliberately NOT used to navigate: the viewer turns to the
+         * page the passage was actually located on, so a stale hint cannot send a
+         * reader to a blank page. Only {@link QuoteAddress.near.offset} takes part in
+         * tie-breaking today; a renderer may read this off the address if it wants
+         * more.
+         */
+        page?: number;
+        /** Approximate character offset the passage is expected near. */
+        offset?: number;
+    };
+}
+/**
+ * Address by character offsets into `AdapterDocument.text`, half-open
+ * `[start, end)` — the same convention as `MatchRange`.
+ *
+ * Only meaningful against the text projection THIS build produced. An offset
+ * from a foreign pipeline is not this kind; it is a {@link QuoteAddress}.
+ */
+interface RangeAddress {
+    kind: "range";
+    start: number;
+    end: number;
+    /**
+     * 1-based page hint, when the producer knows it. Advisory only — the viewer
+     * derives the page from the offsets against its own index, so a hint that
+     * disagrees cannot misdirect the pager.
+     */
+    page?: number;
+}
+/** Address by geometry — one or more boxes on one page. */
+interface RectAddress {
+    kind: "rect";
+    /** 1-based page (or slide) number. */
+    page: number;
+    /**
+     * The boxes making up this one addressed part. An array, not a single box,
+     * because a real passage wraps: a sentence spanning three lines is three
+     * boxes, and a two-column paragraph is more. Painting them as one shape each
+     * is what avoids stitching DOM ranges together.
+     */
+    rects: readonly DocumentRect[];
+}
+/** Which part of a document something refers to. */
+type DocumentAddress = QuoteAddress | RangeAddress | RectAddress;
+/**
+ * The result of normalizing, with the way back.
+ *
+ * `offsets` has one more entry than `text` has characters: `offsets[i]` is the
+ * index in the ORIGINAL string where normalized character `i` came from, and
+ * the final entry is one past the last character that survived — NOT the
+ * original's length, which would drag trailing whitespace into every range that
+ * runs to the end. So a normalized range `[a, b)` maps back to
+ * `[offsets[a], offsets[b])` with no arithmetic, which is the whole point of
+ * building the map rather than searching twice.
+ */
+interface NormalizedText {
+    text: string;
+    offsets: readonly number[];
+}
+/**
+ * Fold a string to its canonical match key, keeping a map back to the original.
+ *
+ * Every rule is a collapse, a drop or a 1:1 swap — never an expansion — so the
+ * map stays monotone and a range maps back exactly. That constraint is why
+ * ligatures (`fi`) and the ellipsis character are deliberately left alone: both
+ * would be 1:many, and a fuzzier match is not worth an offset map that can no
+ * longer be trusted.
+ *
+ * What it does: collapses every whitespace run to one space and trims; drops
+ * zero-width characters and soft hyphens; straightens curly quotes and dashes;
+ * folds case — a citation is matched case-insensitively, and that is a property
+ * of the match key rather than a flag every caller has to remember.
+ */
+declare function normalizeQuoteTextWithOffsets(input: string): NormalizedText;
+/**
+ * The canonical match key for a quote — {@link normalizeQuoteTextWithOffsets}
+ * without the map, for comparing or de-duplicating two quotes.
+ */
+declare function normalizeQuoteText(input: string): string;
+
+/**
+ * Every key of `StreamdownTranslations` as of streamdown@2.5.0.
+ *
+ * Kept explicit rather than derived from `defaultTranslations`, so the list is
+ * readable data here and checkable against the real type over in `ai`.
+ */
+declare const STREAMDOWN_TRANSLATION_KEYS: readonly ["close", "copied", "copyCode", "copyLink", "copyTable", "copyTableAsCsv", "copyTableAsMarkdown", "copyTableAsTsv", "downloadDiagram", "downloadDiagramAsMmd", "downloadDiagramAsPng", "downloadDiagramAsSvg", "downloadFile", "downloadImage", "downloadTable", "downloadTableAsCsv", "downloadTableAsMarkdown", "exitFullscreen", "externalLinkWarning", "imageNotAvailable", "mermaidFormatMmd", "mermaidFormatPng", "mermaidFormatSvg", "openExternalLink", "openLink", "tableFormatCsv", "tableFormatMarkdown", "tableFormatTsv", "viewFullscreen"];
+type StreamdownTranslationKey = (typeof STREAMDOWN_TRANSLATION_KEYS)[number];
+/** What Streamdown's `translations` prop takes, expressed without importing it. */
+type StreamdownTranslationMap = Record<StreamdownTranslationKey, string>;
+/**
+ * Resolve every Streamdown label through `t()`.
+ *
+ * Provider-optional, like `useLocale()` itself: with no `<LocaleProvider>` every
+ * key resolves to the shipped English default.
+ *
+ * Memoization matters — Streamdown puts `translations` into a React context, so
+ * a fresh object per render would re-render every code block and table in the
+ * document. The map is memoized on `t`, which is stable per locale.
+ */
+declare function useStreamdownTranslations(): StreamdownTranslationMap;
+
+declare const Accordion: react.ForwardRefExoticComponent<(AccordionPrimitive.AccordionSingleProps | AccordionPrimitive.AccordionMultipleProps) & react.RefAttributes<HTMLDivElement>>;
+declare const AccordionItem: react.ForwardRefExoticComponent<Omit<AccordionPrimitive.AccordionItemProps & react.RefAttributes<HTMLDivElement>, "ref"> & react.RefAttributes<HTMLDivElement>>;
+declare const AccordionTrigger: react.ForwardRefExoticComponent<Omit<AccordionPrimitive.AccordionTriggerProps & react.RefAttributes<HTMLButtonElement>, "ref"> & react.RefAttributes<HTMLButtonElement>>;
+declare const AccordionContent: react.ForwardRefExoticComponent<Omit<AccordionPrimitive.AccordionContentProps & react.RefAttributes<HTMLDivElement>, "ref"> & react.RefAttributes<HTMLDivElement>>;
+
+interface AdvancedGroupProps extends Omit<HTMLAttributes<HTMLDivElement>, "title"> {
+    /** The disclosure's label. Defaults to "Advanced". */
+    title?: ReactNode;
+    /**
+     * What is hidden inside, shown ONLY while collapsed — so a reader can tell
+     * whether the group holds defaults or edits without opening it.
+     */
+    summary?: ReactNode;
+    /** Shorthand summary: renders "N changed" when `summary` is not given. */
+    changedCount?: number;
+    /** Uncontrolled initial state. Collapsed by default — that is the point. */
+    defaultOpen?: boolean;
+    /** Controlled open state. */
+    open?: boolean;
+    /** Fires on every open/close, controlled or not. */
+    onOpenChange?: (open: boolean) => void;
+}
+/**
+ * A collapsed-by-default group of secondary settings (#341).
+ *
+ * Long dialogs go wrong in one of two ways: everything is visible (so nothing
+ * reads as primary), or the extras are hidden with no hint that they were
+ * touched. `AdvancedGroup` takes the third option — hidden, but SUMMARISED:
+ * while collapsed it shows what is inside ("3 changed"), and the summary
+ * disappears once the group is open and the values speak for themselves.
+ *
+ * A preset over `Collapsible`, not a new disclosure primitive: Radix keeps the
+ * trigger/content wiring, `aria-expanded`, and keyboard operation.
+ *
+ * ```tsx
+ * <AdvancedGroup changedCount={3}>
+ *   <Field … />
+ * </AdvancedGroup>
+ * ```
+ */
+declare function AdvancedGroup({ className, title, summary, changedCount, defaultOpen, open: openProp, onOpenChange, children, ...props }: AdvancedGroupProps): react.JSX.Element;
+
+type InputProps = InputHTMLAttributes<HTMLInputElement>;
+declare const Input: react.ForwardRefExoticComponent<InputProps & react.RefAttributes<HTMLInputElement>>;
+
+declare const buttonVariants: (props?: ({
+    variant?: "link" | "default" | "secondary" | "outline" | "destructive" | "outline-subtle" | "ghost" | null | undefined;
+    size?: "default" | "sm" | "lg" | "icon" | "icon-sm" | "icon-lg" | null | undefined;
+} & class_variance_authority_types.ClassProp) | undefined) => string;
+interface ButtonProps extends ButtonHTMLAttributes<HTMLButtonElement>, VariantProps<typeof buttonVariants> {
+    /** Render the child element as the button (Radix Slot) instead of a <button>. */
+    asChild?: boolean;
+}
+declare const Button: react.ForwardRefExoticComponent<ButtonProps & react.RefAttributes<HTMLButtonElement>>;
+
+declare const TooltipProvider: react.FC<TooltipPrimitive.TooltipProviderProps>;
+declare const Tooltip: react.FC<TooltipPrimitive.TooltipProps>;
+declare const TooltipTrigger: react.ForwardRefExoticComponent<TooltipPrimitive.TooltipTriggerProps & react.RefAttributes<HTMLButtonElement>>;
+declare const TooltipContent: react.ForwardRefExoticComponent<Omit<TooltipPrimitive.TooltipContentProps & react.RefAttributes<HTMLDivElement>, "ref"> & react.RefAttributes<HTMLDivElement>>;
+
+type SidebarContextProps = {
+    state: "expanded" | "collapsed";
+    open: boolean;
+    setOpen: (open: boolean) => void;
+    openMobile: boolean;
+    setOpenMobile: (open: boolean) => void;
+    isMobile: boolean;
+    toggleSidebar: () => void;
+};
+declare function useSidebar(): SidebarContextProps;
+declare const SidebarProvider: react.ForwardRefExoticComponent<Omit<react.ClassAttributes<HTMLDivElement> & react.HTMLAttributes<HTMLDivElement> & {
+    defaultOpen?: boolean;
+    open?: boolean;
+    onOpenChange?: (open: boolean) => void;
+}, "ref"> & react.RefAttributes<HTMLDivElement>>;
+declare const Sidebar: react.ForwardRefExoticComponent<Omit<react.ClassAttributes<HTMLDivElement> & react.HTMLAttributes<HTMLDivElement> & {
+    side?: "left" | "right";
+    variant?: "sidebar" | "floating" | "inset";
+    collapsible?: "offcanvas" | "icon" | "none";
+}, "ref"> & react.RefAttributes<HTMLDivElement>>;
+declare const SidebarTrigger: react.ForwardRefExoticComponent<Omit<ButtonProps & react.RefAttributes<HTMLButtonElement>, "ref"> & react.RefAttributes<HTMLButtonElement>>;
+declare const SidebarRail: react.ForwardRefExoticComponent<Omit<react.DetailedHTMLProps<react.ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "ref"> & react.RefAttributes<HTMLButtonElement>>;
+declare const SidebarInset: react.ForwardRefExoticComponent<Omit<react.DetailedHTMLProps<react.HTMLAttributes<HTMLElement>, HTMLElement>, "ref"> & react.RefAttributes<HTMLDivElement>>;
+declare const SidebarInput: react.ForwardRefExoticComponent<Omit<InputProps & react.RefAttributes<HTMLInputElement>, "ref"> & react.RefAttributes<HTMLInputElement>>;
+declare const SidebarHeader: react.ForwardRefExoticComponent<Omit<react.DetailedHTMLProps<react.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & react.RefAttributes<HTMLDivElement>>;
+declare const SidebarFooter: react.ForwardRefExoticComponent<Omit<react.DetailedHTMLProps<react.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & react.RefAttributes<HTMLDivElement>>;
+declare const SidebarSeparator: react.ForwardRefExoticComponent<Omit<Omit<_radix_ui_react_separator.SeparatorProps & react.RefAttributes<HTMLDivElement>, "ref"> & VariantProps<(props?: ({
+    tone?: "strong" | "subtle" | null | undefined;
+} & class_variance_authority_types.ClassProp) | undefined) => string> & react.RefAttributes<HTMLDivElement>, "ref"> & react.RefAttributes<HTMLDivElement>>;
+declare const SidebarContent: react.ForwardRefExoticComponent<Omit<react.DetailedHTMLProps<react.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & react.RefAttributes<HTMLDivElement>>;
+declare const SidebarGroup: react.ForwardRefExoticComponent<Omit<react.DetailedHTMLProps<react.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & react.RefAttributes<HTMLDivElement>>;
+declare const SidebarGroupLabel: react.ForwardRefExoticComponent<Omit<react.ClassAttributes<HTMLDivElement> & react.HTMLAttributes<HTMLDivElement> & {
+    asChild?: boolean;
+}, "ref"> & react.RefAttributes<HTMLDivElement>>;
+declare const SidebarGroupAction: react.ForwardRefExoticComponent<Omit<react.ClassAttributes<HTMLButtonElement> & react.ButtonHTMLAttributes<HTMLButtonElement> & {
+    asChild?: boolean;
+}, "ref"> & react.RefAttributes<HTMLButtonElement>>;
+declare const SidebarGroupContent: react.ForwardRefExoticComponent<Omit<react.DetailedHTMLProps<react.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & react.RefAttributes<HTMLDivElement>>;
+declare const SidebarMenu: react.ForwardRefExoticComponent<Omit<react.DetailedHTMLProps<react.HTMLAttributes<HTMLUListElement>, HTMLUListElement>, "ref"> & react.RefAttributes<HTMLUListElement>>;
+declare const SidebarMenuItem: react.ForwardRefExoticComponent<Omit<react.DetailedHTMLProps<react.LiHTMLAttributes<HTMLLIElement>, HTMLLIElement>, "ref"> & react.RefAttributes<HTMLLIElement>>;
+declare const sidebarMenuButtonVariants: (props?: ({
+    variant?: "default" | "outline" | null | undefined;
+    size?: "default" | "sm" | "lg" | null | undefined;
+} & class_variance_authority_types.ClassProp) | undefined) => string;
+declare const SidebarMenuButton: react.ForwardRefExoticComponent<Omit<react.ClassAttributes<HTMLButtonElement> & react.ButtonHTMLAttributes<HTMLButtonElement> & {
+    asChild?: boolean;
+    isActive?: boolean;
+    tooltip?: string | ComponentProps<typeof TooltipContent>;
+} & VariantProps<(props?: ({
+    variant?: "default" | "outline" | null | undefined;
+    size?: "default" | "sm" | "lg" | null | undefined;
+} & class_variance_authority_types.ClassProp) | undefined) => string>, "ref"> & react.RefAttributes<HTMLButtonElement>>;
+declare const SidebarMenuAction: react.ForwardRefExoticComponent<Omit<react.ClassAttributes<HTMLButtonElement> & react.ButtonHTMLAttributes<HTMLButtonElement> & {
+    asChild?: boolean;
+    showOnHover?: boolean;
+}, "ref"> & react.RefAttributes<HTMLButtonElement>>;
+declare const SidebarMenuBadge: react.ForwardRefExoticComponent<Omit<react.DetailedHTMLProps<react.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & react.RefAttributes<HTMLDivElement>>;
+declare function SidebarMenuSkeleton({ className, showIcon, ...props }: ComponentProps<"div"> & {
+    showIcon?: boolean;
+}): react.JSX.Element;
+declare const SidebarMenuSub: react.ForwardRefExoticComponent<Omit<react.DetailedHTMLProps<react.HTMLAttributes<HTMLUListElement>, HTMLUListElement>, "ref"> & react.RefAttributes<HTMLUListElement>>;
+declare const SidebarMenuSubItem: react.ForwardRefExoticComponent<Omit<react.DetailedHTMLProps<react.LiHTMLAttributes<HTMLLIElement>, HTMLLIElement>, "ref"> & react.RefAttributes<HTMLLIElement>>;
+declare const SidebarMenuSubButton: react.ForwardRefExoticComponent<Omit<react.ClassAttributes<HTMLAnchorElement> & react.AnchorHTMLAttributes<HTMLAnchorElement> & {
+    asChild?: boolean;
+    size?: "sm" | "md";
+    isActive?: boolean;
+}, "ref"> & react.RefAttributes<HTMLAnchorElement>>;
+
+interface AppSidebarProps extends ComponentProps<typeof Sidebar> {
+    /**
+     * Content rendered inside `<SidebarHeader>`. Typically a `TeamSwitcher`
+     * or a logo + title combination.
+     */
+    header?: ReactNode;
+    /**
+     * Content rendered inside `<SidebarFooter>`. Typically a `NavUser` or
+     * a `TeamSwitcher` placed at the bottom.
+     */
+    footer?: ReactNode;
+    /**
+     * Main navigation content rendered inside `<SidebarContent>`. Pass one or
+     * more `<SidebarGroup>` / `<SidebarMenu>` compositions here.
+     */
+    children?: ReactNode;
+}
+/**
+ * Parameterized application sidebar shell. Composes `@radix-ui` `Sidebar`
+ * primitives with typed `header`, `footer`, and `children` slots.
+ *
+ * Registry blocks (`sidebar-02`, `sidebar-04`, `sidebar-05`) should import
+ * this instead of constructing the `Sidebar` → `SidebarHeader` →
+ * `SidebarContent` → `SidebarFooter` skeleton themselves.
+ *
+ * @example
+ * ```tsx
+ * <AppSidebar
+ *   header={<TeamSwitcher teams={teams} />}
+ *   footer={<NavUser user={currentUser} />}
+ * >
+ *   <SidebarGroup>…</SidebarGroup>
+ * </AppSidebar>
+ * ```
+ */
+declare const AppSidebar: react.ForwardRefExoticComponent<Omit<AppSidebarProps, "ref"> & react.RefAttributes<HTMLDivElement>>;
+
+declare const alertVariants: (props?: ({
+    variant?: "default" | "success" | "warning" | "destructive" | "info" | null | undefined;
+} & class_variance_authority_types.ClassProp) | undefined) => string;
+declare const Alert: react.ForwardRefExoticComponent<HTMLAttributes<HTMLDivElement> & VariantProps<(props?: ({
+    variant?: "default" | "success" | "warning" | "destructive" | "info" | null | undefined;
+} & class_variance_authority_types.ClassProp) | undefined) => string> & react.RefAttributes<HTMLDivElement>>;
+interface AlertTitleProps extends HTMLAttributes<HTMLHeadingElement> {
+    /**
+     * Render at a different heading level to fit the surrounding document
+     * outline (#329). The visual (`mb-1 font-medium leading-none
+     * tracking-tight`) is identical at every level. @default "h5"
+     */
+    as?: "h1" | "h2" | "h3" | "h4" | "h5" | "h6";
+}
+declare const AlertTitle: react.ForwardRefExoticComponent<AlertTitleProps & react.RefAttributes<HTMLHeadingElement>>;
+interface AlertDescriptionProps extends HTMLAttributes<HTMLParagraphElement> {
+    /**
+     * Cap the line length to a readable prose measure (`max-w-prose`, ~65ch)
+     * for genuine paragraph content (#339). Off by default — short,
+     * label-style descriptions should stay full width.
+     */
+    measure?: boolean;
+}
+declare const AlertDescription: react.ForwardRefExoticComponent<AlertDescriptionProps & react.RefAttributes<HTMLParagraphElement>>;
+
+declare const AlertDialog: react.FC<AlertDialogPrimitive.AlertDialogProps>;
+declare const AlertDialogTrigger: react.ForwardRefExoticComponent<AlertDialogPrimitive.AlertDialogTriggerProps & react.RefAttributes<HTMLButtonElement>>;
+declare const AlertDialogPortal: react.FC<AlertDialogPrimitive.AlertDialogPortalProps>;
+declare const AlertDialogContent: react.ForwardRefExoticComponent<Omit<AlertDialogPrimitive.AlertDialogContentProps & react.RefAttributes<HTMLDivElement>, "ref"> & react.RefAttributes<HTMLDivElement>>;
+declare function AlertDialogHeader({ className, ...props }: HTMLAttributes<HTMLDivElement>): react.JSX.Element;
+declare function AlertDialogFooter({ className, ...props }: HTMLAttributes<HTMLDivElement>): react.JSX.Element;
+declare const AlertDialogTitle: react.ForwardRefExoticComponent<Omit<AlertDialogPrimitive.AlertDialogTitleProps & react.RefAttributes<HTMLHeadingElement>, "ref"> & react.RefAttributes<HTMLHeadingElement>>;
+declare const AlertDialogDescription: react.ForwardRefExoticComponent<Omit<AlertDialogPrimitive.AlertDialogDescriptionProps & react.RefAttributes<HTMLParagraphElement>, "ref"> & react.RefAttributes<HTMLParagraphElement>>;
+declare const AlertDialogAction: react.ForwardRefExoticComponent<Omit<AlertDialogPrimitive.AlertDialogActionProps & react.RefAttributes<HTMLButtonElement>, "ref"> & react.RefAttributes<HTMLButtonElement>>;
+declare const AlertDialogCancel: react.ForwardRefExoticComponent<Omit<AlertDialogPrimitive.AlertDialogCancelProps & react.RefAttributes<HTMLButtonElement>, "ref"> & react.RefAttributes<HTMLButtonElement>>;
+
+interface AppShellProps {
+    /** Persistent left navigation (often a <Sidebar />). */
+    sidebar?: ReactNode;
+    /** Top bar (often a <TopNav />). */
+    topNav?: ReactNode;
+    children: ReactNode;
+    className?: string;
+    /** Class for the scrolling main content region. */
+    mainClassName?: string;
+}
+/**
+ * App-first layout: fixed-height viewport with an optional sidebar, a top bar,
+ * and a scrollable main region. Pure layout — bring your own nav components.
+ */
+declare function AppShell({ sidebar, topNav, children, className, mainClassName }: AppShellProps): react.JSX.Element;
+
+declare const AspectRatio: react.ForwardRefExoticComponent<AspectRatioPrimitive.AspectRatioProps & react.RefAttributes<HTMLDivElement>>;
+
+/**
+ * The shape of one third-party notice rendered by `AttributionPanel`.
+ *
+ * Hand-written (the DATA is generated, the type is not) so the generated module
+ * type-checks against a real contract and a malformed entry fails `typecheck`
+ * rather than rendering blank.
+ */
+/**
+ * What is being credited — also the panel's grouping and render order.
+ *
+ * - `data`       — content served at runtime (basemap tiles, map data). Usually
+ *                  the notices a licence actually OBLIGES us to display.
+ * - `source`     — code adapted or vendored into brand-ui (shadcn/ui, mapcn, …).
+ * - `font`       — a self-hosted webfont shipped in the tokens package.
+ * - `dependency` — an npm runtime dependency of a distributable package.
+ */
+type AttributionCategory = "data" | "source" | "font" | "dependency";
+interface Attribution {
+    /** Stable key — the npm name, `font:<face>`, or the curated source's id. */
+    id: string;
+    category: AttributionCategory;
+    /** Display name. */
+    name: string;
+    /** Resolved npm version, when the entry is a package. */
+    version: string | null;
+    /** SPDX identifier where one exists, else the terms' name. */
+    license: string;
+    /** The copyright line to display verbatim, when the source provides one. */
+    copyright: string | null;
+    /** Canonical link (homepage, repository, or licence page). */
+    url: string | null;
+    /** The `@elabs-ai/components-*` packages this reaches a consumer through. */
+    usedBy: readonly string[];
+    /**
+     * True when a licence or provider terms OBLIGE the notice to be displayed
+     * (ODbL, the OFL, provider terms) — as opposed to a courtesy credit. Required
+     * notices render first and are visually marked.
+     */
+    required: boolean;
+    /** Short human explanation of what it is used for. */
+    note: string | null;
+}
+
+declare const ATTRIBUTIONS: readonly Attribution[];
+
+declare const CATEGORY_LABEL: Record<AttributionCategory, string>;
+interface AttributionPanelProps extends HTMLAttributes<HTMLElement> {
+    /**
+     * The notices to render. Defaults to the GENERATED dataset
+     * (`scripts/gen-attributions.mjs`), which is what keeps this panel accurate
+     * without anyone maintaining a list — override only to scope or to test.
+     */
+    attributions?: readonly Attribution[];
+    /** Restrict to these categories, in the panel's own order. Default: all. */
+    categories?: readonly AttributionCategory[];
+    /**
+     * Restrict to notices reachable through these packages — e.g. an app that only
+     * uses `…-ui` need not credit MapLibre's basemap providers. Matched against
+     * each entry's `usedBy`. Default: all.
+     */
+    packages?: readonly string[];
+    /** Show only the notices a licence obliges us to display. */
+    requiredOnly?: boolean;
+    /**
+     * Cap the body height and scroll inside it. Omit to let the panel grow and
+     * leave scrolling to the container (a Dialog body, a settings pane).
+     */
+    maxHeight?: number | string;
+}
+/**
+ * The single surface where brand-ui's third-party notices are displayed —
+ * OSS dependencies, adapted source, self-hosted fonts, and the map data/tile
+ * credits that a licence actually obliges the product to show.
+ *
+ * The content is GENERATED from the repo (`pnpm gen:attributions`, gated by
+ * `pnpm attributions:check`), so it cannot drift from what is actually shipped
+ * the way a hand-kept credits page does.
+ *
+ * **Why this exists:** `MapCanvas` disables MapLibre's in-map attribution
+ * control by default, and the flow canvases hide the React Flow badge. The
+ * React Flow badge is an MIT project's request and carries no condition, but the
+ * default Carto basemap's OpenStreetMap data is ODbL-licensed and the credit is
+ * REQUIRED — mounting this panel somewhere a user can reach (an About dialog, a
+ * settings pane, a footer link) is what keeps that obligation met while the map
+ * corner stays clean. Ship it, or turn the in-map control back on.
+ */
+declare const AttributionPanel: react.ForwardRefExoticComponent<AttributionPanelProps & react.RefAttributes<HTMLElement>>;
+
+declare const Avatar: react.ForwardRefExoticComponent<Omit<AvatarPrimitive.AvatarProps & react.RefAttributes<HTMLSpanElement>, "ref"> & react.RefAttributes<HTMLSpanElement>>;
+declare const AvatarImage: react.ForwardRefExoticComponent<Omit<AvatarPrimitive.AvatarImageProps & react.RefAttributes<HTMLImageElement>, "ref"> & react.RefAttributes<HTMLImageElement>>;
+declare const AvatarFallback: react.ForwardRefExoticComponent<Omit<AvatarPrimitive.AvatarFallbackProps & react.RefAttributes<HTMLSpanElement>, "ref"> & react.RefAttributes<HTMLSpanElement>>;
+
+declare const badgeVariants: (props?: ({
+    variant?: "default" | "secondary" | "outline" | "success" | "warning" | "destructive" | "info" | null | undefined;
+} & class_variance_authority_types.ClassProp) | undefined) => string;
+interface BadgeProps extends HTMLAttributes<HTMLSpanElement>, VariantProps<typeof badgeVariants> {
+}
+declare function Badge({ className, variant, ...props }: BadgeProps): react.JSX.Element;
+
+interface BentoGridProps extends HTMLAttributes<HTMLDivElement> {
+    /** Additional className merged via cn(). */
+    className?: string;
+    /**
+     * Enable the cursor-following spotlight on every tile in this grid. Individual
+     * tiles can still opt out (or in) with their own `spotlight` prop. Disabled
+     * entirely under OS `prefers-reduced-motion` regardless of this prop.
+     * @default false
+     */
+    spotlight?: boolean;
+}
+/**
+ * Responsive CSS-grid container.
+ * - 1 column on mobile, 2 on sm, 4 on lg.
+ * - `grid-auto-flow: dense` fills in gaps left by spanning tiles.
+ * - `auto-rows-[14rem]` gives a baseline row height (14rem ≈ 224px); tiles can
+ *   span multiple rows via the `size` / `span.row` API.
+ * - Carries the grid-wide `spotlight` default for its tiles (opt-in).
+ */
+declare const BentoGrid: react.ForwardRefExoticComponent<BentoGridProps & react.RefAttributes<HTMLDivElement>>;
+/**
+ * Size preset → [colSpan, rowSpan].
+ *
+ * | size  | cols | rows | purpose                                                    |
+ * |-------|------|------|------------------------------------------------------------|
+ * | sm    |  1   |  1   | Supporting: compact metric or icon tile                    |
+ * | md    |  2   |  1   | Supporting: wider but single-row                           |
+ * | lg    |  2   |  2   | Featured: 2×2 block                                        |
+ * | hero  |  2   |  2   | Hero: 2×2 + gradient emphasis wash                         |
+ *
+ * On a 1-column layout (mobile) ALL col spans clamp to 1 automatically via
+ * CSS `min()` in `gridColumn`. Row spans are always honoured.
+ */
+type BentoGridSize = "sm" | "md" | "lg" | "hero";
+declare const bentoGridItemVariants: (props?: ({
+    hero?: boolean | null | undefined;
+    interactive?: boolean | null | undefined;
+} & class_variance_authority_types.ClassProp) | undefined) => string;
+type BentoGridItemVariants = VariantProps<typeof bentoGridItemVariants>;
+interface BentoGridItemProps extends HTMLAttributes<HTMLDivElement>, BentoGridItemVariants {
+    /**
+     * Size preset. Resolves to a col + row span. Overridden by explicit `span`.
+     * @default "sm"
+     */
+    size?: BentoGridSize;
+    /**
+     * Explicit grid span. Wins over `size`. Spans clamp gracefully on narrow
+     * layouts — a `col: 4` on a 2-col grid becomes `span min(4, 2)`.
+     */
+    span?: {
+        col?: number;
+        row?: number;
+    };
+    /**
+     * Enable the cursor-following spotlight gradient on this tile. Omit to inherit
+     * the parent `BentoGrid`'s `spotlight` (itself `false` by default) — so the
+     * effect is opt-in, per grid or per tile. Disabled entirely under OS
+     * `prefers-reduced-motion` regardless of this prop.
+     * @default false (inherited from BentoGrid)
+     */
+    spotlight?: boolean;
+}
+/**
+ * A single bento tile. Composes `Card`, rests flat, lifts to `shadow-lg` on
+ * hover, and adds the OPT-IN spotlight overlay.
+ *
+ * Spotlight:
+ * - Sets `--bento-x` / `--bento-y` CSS custom properties on `onMouseMove`
+ *   via a direct style set (no layout reads in render — uses
+ *   `getBoundingClientRect` in the event handler only, never during paint).
+ * - An absolutely-positioned `pointer-events-none aria-hidden` overlay paints
+ *   `radial-gradient(… at var(--bento-x) var(--bento-y), color-mix(--primary), transparent)`.
+ * - Revealed on hover via opacity transition gated by `duration-base ease-standard`.
+ * - Suppressed with `motion-reduce:hidden` — cursor-following IS motion.
+ */
+declare const BentoGridItem: react.ForwardRefExoticComponent<BentoGridItemProps & react.RefAttributes<HTMLDivElement>>;
+
+interface NumberInputProps extends Omit<HTMLAttributes<HTMLDivElement>, "onChange" | "defaultValue"> {
+    /** Controlled value. Pass `null` to represent an empty state. */
+    value?: number | null;
+    /** Uncontrolled default value. */
+    defaultValue?: number | null;
+    /** Called when the numeric value changes. */
+    onValueChange?: (value: number | null) => void;
+    /** Minimum allowed value. */
+    min?: number;
+    /** Maximum allowed value. */
+    max?: number;
+    /** Step increment/decrement amount (default 1). */
+    step?: number;
+    /**
+     * When true (default), the value is clamped to [min, max] on blur.
+     * Clamping does NOT happen per-keystroke — only on blur.
+     */
+    clamp?: boolean;
+    /** Intl.NumberFormat options used to format the displayed value. */
+    formatOptions?: Intl.NumberFormatOptions;
+    /** Placeholder text for the underlying input. */
+    placeholder?: string;
+    /** Whether the input is disabled. */
+    disabled?: boolean;
+    /** Whether the input is read-only. */
+    readOnly?: boolean;
+    /** Name attribute forwarded to the underlying <input>. */
+    name?: string;
+    /** id attribute forwarded to the underlying <input>. */
+    id?: string;
+    /** aria-label forwarded to the underlying <input>. */
+    "aria-label"?: string;
+    /** aria-labelledby forwarded to the underlying <input>. */
+    "aria-labelledby"?: string;
+    /** aria-describedby forwarded to the underlying <input>. */
+    "aria-describedby"?: string;
+    /** aria-invalid forwarded to the underlying <input>. */
+    "aria-invalid"?: boolean | "true" | "false" | "grammar" | "spelling";
+    /** aria-required forwarded to the underlying <input>. */
+    "aria-required"?: boolean | "true" | "false";
+}
+/**
+ * NumberInput — a numeric stepper that composes InputGroup + two step buttons.
+ *
+ * Controlled via `value`/`onValueChange`; uncontrolled via `defaultValue`.
+ * Keyboard ↑/↓ = ±step; Shift+↑/↓ = ±step×10. Clamps on blur (not per keystroke).
+ */
+declare const NumberInput: react.ForwardRefExoticComponent<NumberInputProps & react.RefAttributes<HTMLDivElement>>;
+
+interface BoundedNumberProps extends NumberInputProps {
+    /**
+     * Content shown in place of the value when the field is empty (`null`) and
+     * not focused — e.g. "No limit" for a capped setting with no cap set.
+     * Defaults to "No limit".
+     */
+    emptyLabel?: ReactNode;
+}
+/**
+ * BoundedNumber — a `NumberInput` preset for a bounded numeric where "empty"
+ * has a semantic meaning ("No limit") instead of reading as a blank box.
+ *
+ * Written reuse verdict (see #373): this wraps `NumberInput` rather than
+ * reimplementing anything. `NumberInput` already does everything the value
+ * needs — blur-only clamping (`clamp`, default true) and `null` as a real,
+ * distinct empty state (`commit(null)` on empty blur). The only missing
+ * behaviour is rendering that empty state as a meaningful label instead of a
+ * blank input, which is exactly what this preset adds: an absolutely
+ * positioned, `pointer-events-none` overlay shown only while the value is
+ * `null` AND the field is not focused, so the underlying input stays fully
+ * clickable/typable and still round-trips to `null` on an empty blur.
+ */
+declare const BoundedNumber: react.ForwardRefExoticComponent<BoundedNumberProps & react.RefAttributes<HTMLDivElement>>;
+
+declare const Breadcrumb: react.ForwardRefExoticComponent<Omit<react.DetailedHTMLProps<react.HTMLAttributes<HTMLElement>, HTMLElement>, "ref"> & react.RefAttributes<HTMLElement>>;
+declare const BreadcrumbList: react.ForwardRefExoticComponent<Omit<react.DetailedHTMLProps<react.OlHTMLAttributes<HTMLOListElement>, HTMLOListElement>, "ref"> & react.RefAttributes<HTMLOListElement>>;
+declare const BreadcrumbItem: react.ForwardRefExoticComponent<Omit<react.DetailedHTMLProps<react.LiHTMLAttributes<HTMLLIElement>, HTMLLIElement>, "ref"> & react.RefAttributes<HTMLLIElement>>;
+declare const BreadcrumbLink: react.ForwardRefExoticComponent<Omit<react.ClassAttributes<HTMLAnchorElement> & react.AnchorHTMLAttributes<HTMLAnchorElement> & {
+    asChild?: boolean;
+}, "ref"> & react.RefAttributes<HTMLAnchorElement>>;
+declare const BreadcrumbPage: react.ForwardRefExoticComponent<Omit<react.DetailedHTMLProps<react.HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, "ref"> & react.RefAttributes<HTMLSpanElement>>;
+declare function BreadcrumbSeparator({ children, className, ...props }: ComponentProps<"li">): react.JSX.Element;
+declare function BreadcrumbEllipsis({ className, ...props }: ComponentProps<"span">): react.JSX.Element;
+
+declare const buttonGroupVariants: (props?: ({
+    orientation?: "horizontal" | "vertical" | null | undefined;
+} & class_variance_authority_types.ClassProp) | undefined) => string;
+declare const ButtonGroup: react.ForwardRefExoticComponent<Omit<react.ClassAttributes<HTMLDivElement> & react.HTMLAttributes<HTMLDivElement> & VariantProps<(props?: ({
+    orientation?: "horizontal" | "vertical" | null | undefined;
+} & class_variance_authority_types.ClassProp) | undefined) => string>, "ref"> & react.RefAttributes<HTMLDivElement>>;
+declare const ButtonGroupText: react.ForwardRefExoticComponent<Omit<react.ClassAttributes<HTMLDivElement> & react.HTMLAttributes<HTMLDivElement> & {
+    asChild?: boolean;
+}, "ref"> & react.RefAttributes<HTMLDivElement>>;
+declare const ButtonGroupSeparator: react.ForwardRefExoticComponent<Omit<Omit<_radix_ui_react_separator.SeparatorProps & react.RefAttributes<HTMLDivElement>, "ref"> & VariantProps<(props?: ({
+    tone?: "strong" | "subtle" | null | undefined;
+} & class_variance_authority_types.ClassProp) | undefined) => string> & react.RefAttributes<HTMLDivElement>, "ref"> & react.RefAttributes<HTMLDivElement>>;
+
+type CalendarProps = React.ComponentProps<typeof DayPicker>;
+/** Date picker calendar (react-day-picker v9), themed with brand tokens. */
+declare function Calendar({ className, classNames, showOutsideDays, ...props }: CalendarProps): react.JSX.Element;
+
+declare const cardVariants: (props?: ({
+    interactive?: boolean | null | undefined;
+} & class_variance_authority_types.ClassProp) | undefined) => string;
+interface CardProps extends HTMLAttributes<HTMLDivElement>, VariantProps<typeof cardVariants> {
+    /**
+     * Optional detail-panel content. **Undefined → a plain card** (today's single `<div>` —
+     * no grid, no panel, zero behaviour change).
+     */
+    detail?: ReactNode;
+    /** Which edge the detail panel sits on. @default "side" */
+    detailPlacement?: "side" | "bottom";
+    /**
+     * `fixed` (default, accessible) → panel always visible. `hover` → hidden at rest, revealed
+     * on hover **and** keyboard `focus-within` at a FIXED outer footprint (the main content
+     * yields the space; no surrounding reflow). Use `hover` for **supplementary** detail only —
+     * essential content must use `fixed`. @default "fixed"
+     */
+    detailReveal?: "fixed" | "hover";
+    /** Detail track size (any CSS length). @default "16rem" (side) / "auto" (bottom) */
+    detailSize?: string;
+    /** Accessible label for the detail region. @default "Details" */
+    detailLabel?: string;
+}
+declare const Card: react.ForwardRefExoticComponent<CardProps & react.RefAttributes<HTMLDivElement>>;
+declare const CardHeader: react.ForwardRefExoticComponent<HTMLAttributes<HTMLDivElement> & react.RefAttributes<HTMLDivElement>>;
+interface CardTitleProps extends HTMLAttributes<HTMLElement> {
+    /**
+     * Render as a different element — pick the semantic heading level so a
+     * card that titles a real page section contributes to the document outline
+     * (#328). The visual (`text-title leading-none`) is identical regardless of
+     * tag. @default "div"
+     */
+    as?: "div" | "h1" | "h2" | "h3" | "h4" | "h5" | "h6";
+}
+declare const CardTitle: react.ForwardRefExoticComponent<CardTitleProps & react.RefAttributes<HTMLDivElement>>;
+interface CardDescriptionProps extends HTMLAttributes<HTMLParagraphElement> {
+    /**
+     * Cap the line length to a readable prose measure (`max-w-prose`, ~65ch)
+     * for genuine paragraph content (#339). Off by default — short,
+     * subtitle-style descriptions should stay full width.
+     */
+    measure?: boolean;
+}
+declare const CardDescription: react.ForwardRefExoticComponent<CardDescriptionProps & react.RefAttributes<HTMLParagraphElement>>;
+declare const CardAction: react.ForwardRefExoticComponent<HTMLAttributes<HTMLDivElement> & react.RefAttributes<HTMLDivElement>>;
+declare const CardContent: react.ForwardRefExoticComponent<HTMLAttributes<HTMLDivElement> & react.RefAttributes<HTMLDivElement>>;
+declare const CardFooter: react.ForwardRefExoticComponent<HTMLAttributes<HTMLDivElement> & react.RefAttributes<HTMLDivElement>>;
+
+type CarouselApi = UseEmblaCarouselType[1];
+type CarouselOptions = NonNullable<Parameters<typeof useEmblaCarousel>[0]>;
+type CarouselPlugin = NonNullable<Parameters<typeof useEmblaCarousel>[1]>;
+interface CarouselProps {
+    opts?: CarouselOptions;
+    plugins?: CarouselPlugin;
+    orientation?: "horizontal" | "vertical";
+    setApi?: (api: CarouselApi) => void;
+}
+/**
+ * Root carousel region. Carries `role="region" aria-roledescription="carousel"`
+ * plus an `aria-label` — it defaults to `"Carousel"` so the region always has an
+ * accessible name (issue #279), but **consumers should pass a specific
+ * `aria-label`** (e.g. `"Product photos"`) describing what the carousel actually
+ * shows, since AT users otherwise can't distinguish multiple carousels on a page.
+ */
+declare const Carousel: react.ForwardRefExoticComponent<HTMLAttributes<HTMLDivElement> & CarouselProps & react.RefAttributes<HTMLDivElement>>;
+declare const CarouselContent: react.ForwardRefExoticComponent<HTMLAttributes<HTMLDivElement> & react.RefAttributes<HTMLDivElement>>;
+declare const CarouselItem: react.ForwardRefExoticComponent<HTMLAttributes<HTMLDivElement> & react.RefAttributes<HTMLDivElement>>;
+declare function CarouselPrevious({ className, ...props }: ComponentProps<typeof Button>): react.JSX.Element;
+declare function CarouselNext({ className, ...props }: ComponentProps<typeof Button>): react.JSX.Element;
+
+/** Who / what proposed the change set (presentational only; never fetches). */
+interface ChangeProvenance {
+    /** Display name of the person or agent author. */
+    author?: string;
+    /** Model or tool identifier (e.g. "claude-sonnet-4-6"). */
+    model?: string;
+    /** ISO-8601 or human-readable timestamp. */
+    timestamp?: string;
+    /** Free-form note, e.g. commit hash or run ID. */
+    note?: string;
+}
+/** Status of a single change hunk. Drives the accent-rail colour and icon. */
+type ChangeHunkStatus = "added" | "removed" | "modified";
+/** A single proposed change in the review set. */
+interface ChangeHunk {
+    /** Unique identifier for this hunk (used in the approved set). */
+    id: string;
+    /** Short title shown in the hunk header (e.g. filename or section label). */
+    title?: string;
+    /** The content before the proposed edit. */
+    before?: ReactNode;
+    /** The content after the proposed edit (the proposal). */
+    after?: ReactNode;
+    /** Change type — drives accent rail + icon. @default "modified" */
+    status?: ChangeHunkStatus;
+    /** Per-hunk provenance override (overrides the review-level provenance). */
+    provenance?: ChangeProvenance;
+}
+/** State surface exposed by the ChangeReview context. */
+interface ChangeReviewState {
+    /** Set of currently-approved hunk IDs. */
+    approved: ReadonlySet<string>;
+    /** Total number of hunks. */
+    totalCount: number;
+    /** Number of approved hunks. */
+    approvedCount: number;
+    /** True when every hunk is approved. */
+    allApproved: boolean;
+    /** True when no hunk is approved. */
+    noneApproved: boolean;
+}
+/** Actions exposed by the ChangeReview context. */
+interface ChangeReviewActions {
+    /** Toggle the approval state of a single hunk. */
+    toggle: (id: string, next: boolean) => void;
+    /** Approve all hunks. */
+    approveAll: () => void;
+    /** Reject (un-approve) all hunks. */
+    rejectAll: () => void;
+}
+/**
+ * Hunk-status accent rail — the separation grammar's accent-rail channel: ONE
+ * focal gesture (the status rail) on a neutral card ground (`bg-card` + the
+ * subtle, redundant-exempt `border-border` hairline). NO colored wash and NO
+ * redundant colored border — the slop the "AI card" look is built from. Status
+ * reads from the rail + the header icon + the StatusBadge (never color alone).
+ * Approval is signalled by the StatusBadge + the filled toggle (no ring wash).
+ */
+declare const hunkVariants: (props?: ({
+    status?: "added" | "removed" | "modified" | null | undefined;
+} & class_variance_authority_types.ClassProp) | undefined) => string;
+interface ChangeReviewProviderProps {
+    hunks: ChangeHunk[];
+    /**
+     * Controlled approved set. Pass `Set<string>` or a string array.
+     * When provided, the component is controlled and `onToggle` / `onApproveAll` /
+     * `onRejectAll` are the only way to update the state.
+     */
+    approved?: Set<string> | string[];
+    onToggle?: (id: string, next: boolean) => void;
+    onApproveAll?: () => void;
+    onRejectAll?: () => void;
+    children: ReactNode;
+}
+/**
+ * Lifts the approval state. Can be controlled (pass `approved`) or uncontrolled.
+ * Derive `isControlled = approved !== undefined`.
+ */
+declare function ChangeReviewProvider({ hunks, approved: approvedProp, onToggle, onApproveAll, onRejectAll, children, }: ChangeReviewProviderProps): react.JSX.Element;
+type ChangeReviewHeaderProps = HTMLAttributes<HTMLDivElement>;
+/**
+ * Count summary ("3 of 5 approved") + Approve all / Reject all bulk actions.
+ * `aria-controls` is intentionally omitted — screen readers reach the list
+ * naturally in DOM order.
+ */
+declare const ChangeReviewHeader: react.ForwardRefExoticComponent<ChangeReviewHeaderProps & react.RefAttributes<HTMLDivElement>>;
+interface ChangeReviewProvenanceProps extends HTMLAttributes<HTMLDivElement> {
+    /**
+     * Structured provenance object OR any ReactNode for custom rendering.
+     * When a `ChangeProvenance` object is passed, a default attribution line
+     * is rendered. Pass a ReactNode for full control.
+     */
+    provenance: ReactNode | ChangeProvenance;
+}
+/**
+ * Quiet attribution line showing who/what proposed the change set.
+ * Uses `text-muted-foreground` and small typography — it should not compete
+ * with the hunks themselves.
+ */
+declare const ChangeReviewProvenance: react.ForwardRefExoticComponent<ChangeReviewProvenanceProps & react.RefAttributes<HTMLDivElement>>;
+type ChangeReviewListProps = HTMLAttributes<HTMLOListElement>;
+/**
+ * Ordered list of change hunks. Uses `<ol>` so AT users can navigate by
+ * item number ("item 2 of 5"). Renders a StatePanel when the list is empty.
+ */
+declare const ChangeReviewList: react.ForwardRefExoticComponent<ChangeReviewListProps & react.RefAttributes<HTMLOListElement>>;
+interface ChangeReviewHunkProps extends Omit<HTMLAttributes<HTMLLIElement>, "children">, Omit<VariantProps<typeof hunkVariants>, "approved"> {
+    hunk: ChangeHunk;
+    /**
+     * Override the default before/after layout. Receives the hunk data and
+     * current approval state. Return `null` to suppress the default content area.
+     */
+    renderHunk?: (hunk: ChangeHunk, state: {
+        approved: boolean;
+    }) => ReactNode;
+}
+/**
+ * A single change hunk row.
+ *
+ * Approval state is signalled with TWO non-color cues:
+ * - icon: Check (approved) vs plain toggle (pending)
+ * - label: "Approved" badge vs "Approve" button text
+ * This ensures the state is clear in all three themes including the low-chroma
+ * monochrome surfaces (colorblind-safe).
+ */
+declare const ChangeReviewHunk: react.ForwardRefExoticComponent<ChangeReviewHunkProps & react.RefAttributes<HTMLLIElement>>;
+interface ChangeReviewProps extends Omit<HTMLAttributes<HTMLDivElement>, "children" | "onToggle"> {
+    /** The proposed changes to review. */
+    hunks: ChangeHunk[];
+    /**
+     * Controlled approved set. Pass `Set<string>` or a string array.
+     * When omitted the component manages approval state internally (uncontrolled).
+     */
+    approved?: Set<string> | string[];
+    /** Called when the user toggles a single hunk's approval state. */
+    onToggle?: (id: string, next: boolean) => void;
+    /** Called when the user clicks "Approve all". */
+    onApproveAll?: () => void;
+    /** Called when the user clicks "Reject all". */
+    onRejectAll?: () => void;
+    /**
+     * Provenance to show above the hunk list. Accepts a `ChangeProvenance`
+     * object (renders default attribution) or any ReactNode.
+     */
+    provenance?: ReactNode | ChangeProvenance;
+    /**
+     * Override the per-hunk body renderer (passed through to each `ChangeReviewHunk`).
+     */
+    renderHunk?: ChangeReviewHunkProps["renderHunk"];
+}
+/**
+ * Convenience composition that wires Provider → Header → Provenance → List → Hunks.
+ * For custom layouts compose the parts manually via `ChangeReview.Provider`,
+ * `ChangeReview.Header`, etc.
+ */
+declare const ChangeReview: react.ForwardRefExoticComponent<ChangeReviewProps & react.RefAttributes<HTMLDivElement>>;
+
+declare const Checkbox: react.ForwardRefExoticComponent<Omit<CheckboxPrimitive.CheckboxProps & react.RefAttributes<HTMLButtonElement>, "ref"> & react.RefAttributes<HTMLButtonElement>>;
+
+declare const Collapsible: react.ForwardRefExoticComponent<CollapsiblePrimitive.CollapsibleProps & react.RefAttributes<HTMLDivElement>>;
+declare const CollapsibleTrigger: react.ForwardRefExoticComponent<CollapsiblePrimitive.CollapsibleTriggerProps & react.RefAttributes<HTMLButtonElement>>;
+declare const CollapsibleContent: react.ForwardRefExoticComponent<Omit<CollapsiblePrimitive.CollapsibleContentProps & react.RefAttributes<HTMLDivElement>, "ref"> & react.RefAttributes<HTMLDivElement>>;
+
+type CollapsiblePanelSide = "left" | "right";
+type CollapsiblePanelState = "expanded" | "collapsed";
+interface UseCollapsiblePanelOptions {
+    /** Which edge the panel lives on. Default `"left"`. */
+    side?: CollapsiblePanelSide;
+    /** Controlled open state (`isControlled = open !== undefined`). */
+    open?: boolean;
+    /** Uncontrolled initial open state. Default `true`. */
+    defaultOpen?: boolean;
+    /** Called with the next open state on `setOpen`/`toggle`. */
+    onOpenChange?: (open: boolean) => void;
+    /**
+     * Literal expanded-width utility (e.g. `"w-(--sidebar-width)"`). Must be a
+     * literal in the consumer's source so Tailwind generates it.
+     */
+    widthClassName?: string;
+    /**
+     * Literal collapsed-state utility for the gap spacer (e.g.
+     * `"group-data-[collapsible=offcanvas]:w-0"`).
+     */
+    spacerCollapsedClassName?: string;
+    /**
+     * Literal off-screen slide utilities for the fixed container, keyed by side
+     * (e.g. `left: "left-0 group-data-[collapsible=offcanvas]:left-[calc(var(--sidebar-width)*-1)]"`).
+     */
+    containerSlideClassNames?: Record<CollapsiblePanelSide, string>;
+}
+/** Data attributes for the panel's `group` element. */
+interface CollapsiblePanelAttrs {
+    "data-state": CollapsiblePanelState;
+    "data-side": CollapsiblePanelSide;
+}
+interface UseCollapsiblePanelReturn {
+    /** Resolved open state (controlled prop wins). */
+    open: boolean;
+    /** `"expanded"` when open, `"collapsed"` when closed. */
+    state: CollapsiblePanelState;
+    side: CollapsiblePanelSide;
+    /** Set the open state (accepts a value or an updater fn). */
+    setOpen: (open: boolean | ((open: boolean) => boolean)) => void;
+    toggle: () => void;
+    /** `data-state`/`data-side` for the group element wrapping both fragments. */
+    attrs: CollapsiblePanelAttrs;
+    /** The gap-spacer fragment: reserves/releases the inline width. */
+    spacerClassName: string;
+    /** The fixed-container fragment: slides the panel off-screen. */
+    containerClassName: string;
+}
+declare function useCollapsiblePanel({ side, open: openProp, defaultOpen, onOpenChange, widthClassName, spacerCollapsedClassName, containerSlideClassNames, }?: UseCollapsiblePanelOptions): UseCollapsiblePanelReturn;
+
+/**
+ * The semantic color token names that ColorPicker understands as "safe" values.
+ * These map 1-to-1 with Tailwind utilities backed by CSS variables so they
+ * remain theme-aware at runtime.
+ */
+type ColorToken = "primary" | "secondary" | "destructive" | "success" | "warning" | "info" | "chart-1" | "chart-2" | "chart-3" | "chart-4" | "chart-5" | "chart-6" | "chart-7" | "chart-8" | "chart-9" | "chart-10" | "chart-11" | "chart-12";
+/** All recognised token names in display order. */
+declare const COLOR_TOKENS: ColorToken[];
+interface ColorPickerProps extends Omit<HTMLAttributes<HTMLDivElement>, "onChange"> {
+    /**
+     * Controlled value — a `ColorToken` name (preferred, theme-aware) or a raw
+     * hex string (only when `allowCustom` is true).
+     */
+    value?: ColorToken | string;
+    /** Uncontrolled default value. */
+    defaultValue?: ColorToken | string;
+    /** Called when the selected color changes. */
+    onValueChange?: (value: ColorToken | string) => void;
+    /**
+     * Swatches to display. Defaults to all chart + status tokens.
+     * Accepts any subset of `ColorToken`.
+     */
+    swatches?: ColorToken[];
+    /**
+     * When true, a free-form hex input is shown below the swatches.
+     * NOTE: custom hex values are NOT theme-aware — they will not adapt when
+     * the active theme changes. Prefer token values for all theme-safe UI.
+     */
+    allowCustom?: boolean;
+    /** aria-label for the trigger button. Defaults to "Pick color". */
+    "aria-label"?: string;
+}
+/**
+ * ColorPicker — a token-safe swatch picker backed by a Popover.
+ *
+ * The default value type is a `ColorToken` (a semantic CSS variable name),
+ * not a hex string. This ensures the chosen color adapts to the active theme.
+ * Raw hex is available opt-in via `allowCustom` — see the prop docs.
+ *
+ * Swatch group uses `role="radiogroup"` with arrow-key navigation.
+ */
+declare const ColorPicker: react.ForwardRefExoticComponent<ColorPickerProps & react.RefAttributes<HTMLDivElement>>;
+
+interface ComboboxOption {
+    label: string;
+    value: string;
+}
+interface ComboboxProps {
+    options: ComboboxOption[];
+    value?: string;
+    onValueChange?: (value: string) => void;
+    placeholder?: string;
+    searchPlaceholder?: string;
+    /**
+     * Message shown when the search yields no results. Defaults to "No
+     * results." — or, when `allowCustomValue` is set, a message that also
+     * signals a custom value is acceptable.
+     */
+    emptyText?: string;
+    className?: string;
+    /** Disables the trigger and prevents the popover from opening. */
+    disabled?: boolean;
+    /**
+     * When `true`, typed text that doesn't match any option becomes a
+     * submittable value: a synthetic "Use…" suggestion is shown, and pressing
+     * Enter with no listed option highlighted accepts the typed text via
+     * `onValueChange`. Suggestions still filter as usual. Default `false`
+     * (selection-only, unchanged behavior) — #359.
+     */
+    allowCustomValue?: boolean;
+    /** `id` applied to the trigger button. */
+    id?: string;
+    /**
+     * The trigger's accessible name always defaults to the SELECTED VALUE (or
+     * the placeholder) — that tells AT what is currently chosen, never what the
+     * control is FOR. Pass `aria-label`/`aria-labelledby` to also name the
+     * control's purpose (e.g. "Session switcher").
+     */
+    "aria-label"?: string;
+    "aria-labelledby"?: string;
+    /**
+     * Escape hatch spread onto the trigger `Button` (after the named props
+     * above, so it wins if both are set) for anything not covered by a named
+     * prop — `data-*`, `name`, `data-testid`, etc. `role`/`aria-expanded` stay
+     * component-owned and can't be passed here; disabling stays on the
+     * top-level `disabled` prop so the popover-open guard below can't drift
+     * out of sync with the trigger's actual disabled state.
+     */
+    triggerProps?: Omit<ComponentPropsWithoutRef<typeof Button>, "role" | "aria-expanded" | "disabled"> & {
+        /** Arbitrary `data-*` attributes (test hooks, analytics, …). */
+        [key: `data-${string}`]: string | number | boolean | undefined;
+    };
+}
+/** Single-select combobox (Popover + Command). Controlled or uncontrolled. */
+declare const Combobox: react.ForwardRefExoticComponent<ComboboxProps & react.RefAttributes<HTMLButtonElement>>;
+
+declare const dialogContentVariants: (props?: ({
+    size?: "full" | "sm" | "lg" | "xl" | null | undefined;
+} & class_variance_authority_types.ClassProp) | undefined) => string;
+declare const Dialog: react.FC<DialogPrimitive.DialogProps>;
+declare const DialogTrigger: react.ForwardRefExoticComponent<DialogPrimitive.DialogTriggerProps & react.RefAttributes<HTMLButtonElement>>;
+declare const DialogPortal: react.FC<DialogPrimitive.DialogPortalProps>;
+declare const DialogClose: react.ForwardRefExoticComponent<DialogPrimitive.DialogCloseProps & react.RefAttributes<HTMLButtonElement>>;
+declare const DialogOverlay: react.ForwardRefExoticComponent<Omit<DialogPrimitive.DialogOverlayProps & react.RefAttributes<HTMLDivElement>, "ref"> & react.RefAttributes<HTMLDivElement>>;
+declare const DialogContent: react.ForwardRefExoticComponent<Omit<DialogPrimitive.DialogContentProps & react.RefAttributes<HTMLDivElement>, "ref"> & VariantProps<(props?: ({
+    size?: "full" | "sm" | "lg" | "xl" | null | undefined;
+} & class_variance_authority_types.ClassProp) | undefined) => string> & react.RefAttributes<HTMLDivElement>>;
+declare function DialogHeader({ className, ...props }: HTMLAttributes<HTMLDivElement>): react.JSX.Element;
+declare function DialogFooter({ className, ...props }: HTMLAttributes<HTMLDivElement>): react.JSX.Element;
+declare const DialogTitle: react.ForwardRefExoticComponent<Omit<DialogPrimitive.DialogTitleProps & react.RefAttributes<HTMLHeadingElement>, "ref"> & react.RefAttributes<HTMLHeadingElement>>;
+declare const DialogDescription: react.ForwardRefExoticComponent<Omit<DialogPrimitive.DialogDescriptionProps & react.RefAttributes<HTMLParagraphElement>, "ref"> & react.RefAttributes<HTMLParagraphElement>>;
+type DialogBodyProps = HTMLAttributes<HTMLDivElement>;
+/**
+ * The dialog's scroll owner (#341).
+ *
+ * Placing a `DialogBody` between `DialogHeader` and `DialogFooter` switches
+ * `DialogContent` into its fixed-header/footer regime (see
+ * `dialogContentVariants`): the header and footer stay put and ONLY this region
+ * scrolls, so the primary action never scrolls out of view. Without it a dialog
+ * behaves exactly as before — the anatomy is the switch, there is no `scroll`
+ * prop.
+ *
+ * `overscroll-contain` stops the scroll chaining to the page underneath
+ * (`.claude/rules/interaction-guidelines.md`, Touch & overscroll).
+ *
+ * **The `p-1`/`-m-1`/`scroll-p-1` trio reserves a focus-ring gutter (#425).**
+ * Per CSS Overflow 3, authoring only `overflow-y-auto` still makes this a
+ * two-axis scroll container (the `visible` axis computes to `auto` too), and a
+ * scroll container clips at its **padding box**. With no padding of its own,
+ * that padding box IS the content box, so a full-width child's border box
+ * lands exactly on the clip edge — leaving 0px for a focus ring, which is
+ * `box-shadow` (ink overflow: never part of the scrollable region, so it is
+ * simply cut, not merely scrolled out of reach). `p-1` moves the scrollport
+ * 4px outward on every side — enough for the library's widest outward paint
+ * (`ring-2 ring-offset-2` = 4px) — and `-m-1` pulls the border box back by the
+ * same amount so body content stays flush with `DialogHeader`/`DialogFooter`
+ * instead of indenting 4px against them. `scroll-p-1` keeps a keyboard-driven
+ * scroll-into-view (Tab landing on a control currently outside the scrollport)
+ * from placing that control flush against the scrollport edge again.
+ *
+ * Two consumer-facing consequences: a larger `className` padding (e.g. `p-6`)
+ * still wins through `tailwind-merge`, with the border box remaining 4px
+ * outward; but **`className="p-0"` re-opens the bug** — the merge kills `p-1`
+ * while `-m-1` survives — so a consumer who genuinely wants no gutter must
+ * clear both sides with `className="m-0 p-0"`.
+ *
+ * Known, accepted residual: at `data-density="compact"`, `--spacing` is
+ * `0.222rem` (`density.css:97`), so `p-1` is 3.55px against a 4px ring — a
+ * 0.45px shortfall on the outermost edge of a 2px stroke. Do not "fix" this
+ * with a fixed-px override; that would break the density dial's contract.
+ */
+declare const DialogBody: react.ForwardRefExoticComponent<DialogBodyProps & react.RefAttributes<HTMLDivElement>>;
+interface DialogSectionProps extends Omit<HTMLAttributes<HTMLElement>, "title"> {
+    /** The section heading. States what the group of fields is for. */
+    title: ReactNode;
+    /** One line of supporting context under the heading. */
+    description?: ReactNode;
+    /**
+     * Semantic heading level. `DialogTitle` renders an `<h2>`, so a section is an
+     * `<h3>` by default and an `<h4>` when nested a rung deeper.
+     */
+    level?: 3 | 4;
+    /** Section-scoped actions, aligned to the inline end of the heading row. */
+    actions?: ReactNode;
+}
+/**
+ * A real section heading inside a dialog (#341).
+ *
+ * The recurring downstream defect was section labels rendering at the same size
+ * as the field labels beneath them, which flattens a long form into one
+ * undifferentiated list. The rungs are distinct BY TOKEN, not by eye:
+ * `DialogTitle` `text-title` (1.25rem) > `DialogSection` `text-subtitle` (1rem) >
+ * `Label` `text-body` (0.875rem).
+ *
+ * Deliberately NOT `SectionHeader` (`../section-header`): that is the page-level
+ * `<h2>` row with an eyebrow, one rung too loud and one level too high inside a
+ * dialog whose title already owns the `<h2>`.
+ */
+declare const DialogSection: react.ForwardRefExoticComponent<DialogSectionProps & react.RefAttributes<HTMLElement>>;
+
+interface UseDialogDismissGuardOptions {
+    /**
+     * Does the dialog currently hold unsaved changes? **App-owned** — brand-ui is
+     * a presentation layer (`docs/DECISIONS.md` §D5) and cannot know what "dirty"
+     * means for your form. Compute it (a `react-hook-form` `isDirty`, a deep
+     * compare, a store flag) and pass it in.
+     */
+    dirty: boolean;
+    /** Close the dialog — the app sets its own `open` state to `false`. */
+    onClose: () => void;
+    /**
+     * Open the dialog. Only needed when a `DialogTrigger` (rather than the app)
+     * opens it, because Radix routes that through the same `onOpenChange`.
+     */
+    onOpen?: () => void;
+}
+interface DialogDismissGuard {
+    /**
+     * Spread onto `<Dialog onOpenChange={…}>`. Intercepts EVERY user dismissal —
+     * Escape, overlay click, the built-in close ✕ and any `DialogClose` — because
+     * Radix funnels all four through `onOpenChange(false)`.
+     */
+    onOpenChange: (open: boolean) => void;
+    /** Controlled `open` for the discard confirmation. */
+    confirmOpen: boolean;
+    /** Controlled `onOpenChange` for the discard confirmation. */
+    onConfirmOpenChange: (open: boolean) => void;
+    /** Confirm the discard: closes the confirmation AND calls `onClose()`. */
+    confirmDiscard: () => void;
+}
+/**
+ * Warn before a dialog with unsaved changes is dismissed (#341).
+ *
+ * `.claude/rules/interaction-guidelines.md` (Forms) requires warning before
+ * navigating away from unsaved changes; this is that rule for dialogs, as a HOOK
+ * rather than a prop because the component must not own app state — the app owns
+ * `open` and decides what `dirty` means (D5).
+ *
+ * ## The asymmetry is structural, not a flag
+ *
+ * A **user dismissal** reaches Radix's `onOpenChange`, so the guard sees it and
+ * can hold the dialog open. A **programmatic close** (the app setting its own
+ * `open` to `false` after a successful save) never touches the guard, so it is
+ * unobservable here and closes silently. That is exactly the wanted behaviour,
+ * and it falls out of the wiring — there is no "skip the guard" option to get
+ * wrong.
+ *
+ * The name is literal: it guards DISMISSALS routed through the returned
+ * `onOpenChange`. It is not a navigation blocker and it cannot intercept a tab
+ * close, a router navigation, or an `open` prop that the app flips itself.
+ *
+ * ```tsx
+ * const [open, setOpen] = useState(false);
+ * const guard = useDialogDismissGuard({
+ *   dirty,
+ *   onClose: () => setOpen(false),
+ *   onOpen: () => setOpen(true),
+ * });
+ *
+ * <Dialog open={open} onOpenChange={guard.onOpenChange}>…</Dialog>
+ * <ConfirmDialog
+ *   open={guard.confirmOpen}
+ *   onOpenChange={guard.onConfirmOpenChange}
+ *   onConfirm={guard.confirmDiscard}
+ *   tone="destructive"
+ *   title="Discard changes?"
+ *   description="Your edits to this project have not been saved."
+ *   confirmLabel="Discard"
+ * />
+ * ```
+ *
+ * The `ConfirmDialog` is a SIBLING of the guarded dialog, not a child of it.
+ */
+declare function useDialogDismissGuard({ dirty, onClose, onOpen, }: UseDialogDismissGuardOptions): DialogDismissGuard;
+
+interface CommandProps extends ComponentPropsWithoutRef<typeof Command$1> {
+    /**
+     * Reports the DOM `id` cmdk assigned to the currently highlighted item, so
+     * an input rendered OUTSIDE this `Command` tree (a composer textarea, a
+     * combobox trigger) can set `aria-activedescendant` without querying
+     * `[role="option"]` positionally. Fires with `undefined` when nothing is
+     * highlighted.
+     *
+     * cmdk owns each item's `id`/`role`/`aria-selected` and applies them AFTER
+     * the consumer spread, so a consumer-supplied `id` on `CommandItem` is
+     * silently dropped (`CommandItem` warns about this in development) — this
+     * callback is the supported way to obtain it. See also the
+     * `useCommandActiveItemId` hook for reading the same value from a
+     * descendant already inside the `<Command>` tree.
+     *
+     * It fires for EVERY highlight change, including the item cmdk
+     * auto-highlights on mount and the one it re-highlights after each filter
+     * keystroke — the two states cmdk's own `state.selectedItemId` misses.
+     */
+    onActiveItemIdChange?: (id: string | undefined) => void;
+}
+declare const Command: react.ForwardRefExoticComponent<CommandProps & react.RefAttributes<HTMLDivElement>>;
+/**
+ * The DOM `id` of the currently highlighted `CommandItem`. Must be called
+ * from a component rendered inside a `<Command>` tree; returns `undefined`
+ * when nothing is highlighted (or when there is no `<Command>` ancestor).
+ * Reports exactly the same value as `Command`'s `onActiveItemIdChange`
+ * callback, for a consumer that is already a descendant (rather than an
+ * external input above the tree).
+ */
+declare function useCommandActiveItemId(): string | undefined;
+declare function CommandDialog({ children, filter, ...props }: ComponentPropsWithoutRef<typeof Dialog> & {
+    /** Custom cmdk ranking (e.g. strict substring instead of fuzzy). */
+    filter?: ComponentPropsWithoutRef<typeof Command$1>["filter"];
+}): react.JSX.Element;
+declare const CommandInput: react.ForwardRefExoticComponent<Omit<Omit<Pick<Pick<react.DetailedHTMLProps<react.InputHTMLAttributes<HTMLInputElement>, HTMLInputElement>, "key" | keyof react.InputHTMLAttributes<HTMLInputElement>> & {
+    ref?: React.Ref<HTMLInputElement>;
+} & {
+    asChild?: boolean;
+}, "key" | "asChild" | keyof react.InputHTMLAttributes<HTMLInputElement>>, "type" | "onChange" | "value"> & {
+    value?: string;
+    onValueChange?: (search: string) => void;
+} & react.RefAttributes<HTMLInputElement>, "ref"> & react.RefAttributes<HTMLInputElement>>;
+declare const CommandList: react.ForwardRefExoticComponent<Omit<{
+    children?: React.ReactNode;
+} & Pick<Pick<react.DetailedHTMLProps<HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "key" | keyof HTMLAttributes<HTMLDivElement>> & {
+    ref?: React.Ref<HTMLDivElement>;
+} & {
+    asChild?: boolean;
+}, "key" | keyof HTMLAttributes<HTMLDivElement> | "asChild"> & {
+    label?: string;
+} & react.RefAttributes<HTMLDivElement>, "ref"> & react.RefAttributes<HTMLDivElement>>;
+declare const CommandEmpty: react.ForwardRefExoticComponent<Omit<{
+    children?: React.ReactNode;
+} & Pick<Pick<react.DetailedHTMLProps<HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "key" | keyof HTMLAttributes<HTMLDivElement>> & {
+    ref?: React.Ref<HTMLDivElement>;
+} & {
+    asChild?: boolean;
+}, "key" | keyof HTMLAttributes<HTMLDivElement> | "asChild"> & react.RefAttributes<HTMLDivElement>, "ref"> & react.RefAttributes<HTMLDivElement>>;
+declare const CommandGroup: react.ForwardRefExoticComponent<Omit<{
+    children?: React.ReactNode;
+} & Omit<Pick<Pick<react.DetailedHTMLProps<HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "key" | keyof HTMLAttributes<HTMLDivElement>> & {
+    ref?: React.Ref<HTMLDivElement>;
+} & {
+    asChild?: boolean;
+}, "key" | keyof HTMLAttributes<HTMLDivElement> | "asChild">, "value" | "heading"> & {
+    heading?: React.ReactNode;
+    value?: string;
+    forceMount?: boolean;
+} & react.RefAttributes<HTMLDivElement>, "ref"> & react.RefAttributes<HTMLDivElement>>;
+declare const CommandSeparator: react.ForwardRefExoticComponent<Omit<Pick<Pick<react.DetailedHTMLProps<HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "key" | keyof HTMLAttributes<HTMLDivElement>> & {
+    ref?: React.Ref<HTMLDivElement>;
+} & {
+    asChild?: boolean;
+}, "key" | keyof HTMLAttributes<HTMLDivElement> | "asChild"> & {
+    alwaysRender?: boolean;
+} & react.RefAttributes<HTMLDivElement>, "ref"> & react.RefAttributes<HTMLDivElement>>;
+declare const CommandItem: react.ForwardRefExoticComponent<Omit<{
+    children?: React.ReactNode;
+} & Omit<Pick<Pick<react.DetailedHTMLProps<HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "key" | keyof HTMLAttributes<HTMLDivElement>> & {
+    ref?: React.Ref<HTMLDivElement>;
+} & {
+    asChild?: boolean;
+}, "key" | keyof HTMLAttributes<HTMLDivElement> | "asChild">, "onSelect" | "value" | "disabled"> & {
+    disabled?: boolean;
+    onSelect?: (value: string) => void;
+    value?: string;
+    keywords?: string[];
+    forceMount?: boolean;
+} & react.RefAttributes<HTMLDivElement>, "ref"> & react.RefAttributes<HTMLDivElement>>;
+declare function CommandShortcut({ className, ...props }: HTMLAttributes<HTMLSpanElement>): react.JSX.Element;
+
+interface ConfirmDialogProps {
+    /** Controlled open state — the app owns it. */
+    open: boolean;
+    /** Fires on cancel, Escape, and any other Radix dismissal. */
+    onOpenChange: (open: boolean) => void;
+    /** What is about to happen, as a question or a statement. */
+    title: ReactNode;
+    /**
+     * The consequence, spelled out. **Required**: `AlertDialogContent` is
+     * inaccessible to screen-reader users without a description (Radix warns), and
+     * a confirmation whose only text is its title cannot state what is at stake.
+     */
+    description: ReactNode;
+    /**
+     * The confirm action's label. States the CONSEQUENCE ("Delete skill"), never
+     * "OK" — a label that names the outcome is the last chance to catch a mistake.
+     * Defaults to a generic "Confirm", which you should almost always replace.
+     */
+    confirmLabel?: ReactNode;
+    /** The safe action's label. Defaults to "Cancel". */
+    cancelLabel?: ReactNode;
+    /** Runs when the confirm action is activated. */
+    onConfirm: () => void;
+    /** Runs when the safe action is activated (in addition to `onOpenChange`). */
+    onCancel?: () => void;
+    /** Visual tone of the CONFIRM action only. The dialog chrome never changes. */
+    tone?: "default" | "destructive";
+    /**
+     * The confirm request is in flight: the action swaps its label for a spinner
+     * and reports `aria-busy`. It deliberately stays ENABLED
+     * (`.claude/rules/interaction-guidelines.md`, Forms — a submit is never
+     * pre-disabled); repeat activations are ignored while it is set.
+     */
+    loading?: boolean;
+    /** Extra body content between the description and the actions. */
+    children?: ReactNode;
+    className?: string;
+}
+/**
+ * A destructive/irreversible confirmation (#341).
+ *
+ * Built on `AlertDialog`, not `Dialog`, and that is the entire point of it
+ * existing as a named component rather than a recipe: `AlertDialogContent`
+ * prevents its own open-autofocus and focuses the mounted `AlertDialogCancel`
+ * instead, so **initial focus lands on the safe action** — but only if a Cancel
+ * is actually mounted, which a hand-rolled confirmation routinely forgets (and a
+ * plain `Dialog` cannot do at all). `ConfirmDialog` always renders one, so the
+ * wrong choice is unrepresentable. It also inherits `AlertDialog`'s refusal to
+ * dismiss on an outside click.
+ *
+ * Cancel is FIRST in the DOM so assistive tech reads the safe action first;
+ * `AlertDialogFooter`'s `flex-col-reverse sm:flex-row sm:justify-end` still
+ * paints the confirm action bottom-right on every breakpoint.
+ *
+ * **Confirming does not close the dialog** — `onConfirm` fires and the app sets
+ * `open={false}` when it is ready (immediately for a synchronous action, after
+ * the request for an async one, which is what makes `loading` coherent).
+ * Cancelling closes through `onOpenChange(false)` as usual.
+ *
+ * ```tsx
+ * <ConfirmDialog
+ *   open={open}
+ *   onOpenChange={setOpen}
+ *   tone="destructive"
+ *   title={`Delete ${skill.name}?`}
+ *   description={`Removing it also deletes its ${skill.runs} saved runs. This cannot be undone.`}
+ *   confirmLabel={`Delete ${skill.name}`}
+ *   onConfirm={() => { deleteSkill(); setOpen(false); }}
+ * />
+ * ```
+ */
+declare function ConfirmDialog({ open, onOpenChange, title, description, confirmLabel, cancelLabel, onConfirm, onCancel, tone, loading, children, className, }: ConfirmDialogProps): react.JSX.Element;
+
+declare const ContextMenu: react.FC<ContextMenuPrimitive.ContextMenuProps>;
+declare const ContextMenuTrigger: react.ForwardRefExoticComponent<ContextMenuPrimitive.ContextMenuTriggerProps & react.RefAttributes<HTMLSpanElement>>;
+declare const ContextMenuGroup: react.ForwardRefExoticComponent<ContextMenuPrimitive.ContextMenuGroupProps & react.RefAttributes<HTMLDivElement>>;
+declare const ContextMenuSub: react.FC<ContextMenuPrimitive.ContextMenuSubProps>;
+declare const ContextMenuRadioGroup: react.ForwardRefExoticComponent<ContextMenuPrimitive.ContextMenuRadioGroupProps & react.RefAttributes<HTMLDivElement>>;
+declare const ContextMenuSubTrigger: react.ForwardRefExoticComponent<Omit<ContextMenuPrimitive.ContextMenuSubTriggerProps & react.RefAttributes<HTMLDivElement>, "ref"> & {
+    inset?: boolean;
+} & react.RefAttributes<HTMLDivElement>>;
+declare const ContextMenuSubContent: react.ForwardRefExoticComponent<Omit<ContextMenuPrimitive.ContextMenuSubContentProps & react.RefAttributes<HTMLDivElement>, "ref"> & react.RefAttributes<HTMLDivElement>>;
+declare const ContextMenuContent: react.ForwardRefExoticComponent<Omit<ContextMenuPrimitive.ContextMenuContentProps & react.RefAttributes<HTMLDivElement>, "ref"> & react.RefAttributes<HTMLDivElement>>;
+declare const ContextMenuItem: react.ForwardRefExoticComponent<Omit<ContextMenuPrimitive.ContextMenuItemProps & react.RefAttributes<HTMLDivElement>, "ref"> & {
+    inset?: boolean;
+} & react.RefAttributes<HTMLDivElement>>;
+declare const ContextMenuCheckboxItem: react.ForwardRefExoticComponent<Omit<ContextMenuPrimitive.ContextMenuCheckboxItemProps & react.RefAttributes<HTMLDivElement>, "ref"> & react.RefAttributes<HTMLDivElement>>;
+declare const ContextMenuRadioItem: react.ForwardRefExoticComponent<Omit<ContextMenuPrimitive.ContextMenuRadioItemProps & react.RefAttributes<HTMLDivElement>, "ref"> & react.RefAttributes<HTMLDivElement>>;
+declare const ContextMenuLabel: react.ForwardRefExoticComponent<Omit<ContextMenuPrimitive.ContextMenuLabelProps & react.RefAttributes<HTMLDivElement>, "ref"> & {
+    inset?: boolean;
+} & react.RefAttributes<HTMLDivElement>>;
+declare const ContextMenuSeparator: react.ForwardRefExoticComponent<Omit<ContextMenuPrimitive.ContextMenuSeparatorProps & react.RefAttributes<HTMLDivElement>, "ref"> & react.RefAttributes<HTMLDivElement>>;
+declare function ContextMenuShortcut({ className, ...props }: HTMLAttributes<HTMLSpanElement>): react.JSX.Element;
+
+interface CopyableValueProps extends Omit<ButtonHTMLAttributes<HTMLButtonElement>, "value" | "children"> {
+    /**
+     * The EXACT text written to the clipboard — the unrounded, un-abbreviated
+     * value. Not locale-formatted by this component: a copied number is usually
+     * on its way into a spreadsheet or a query.
+     */
+    value: string;
+    /** What the reader sees. Defaults to `value`. */
+    children?: ReactNode;
+    /**
+     * Overrides the screen-reader hint appended to the visible text. The
+     * accessible name is always `<visible text> + <hint>`, which keeps WCAG 2.5.3
+     * (Label in Name) satisfied — voice-control users can say what they read.
+     */
+    hint?: string;
+    /** ms the "Copied" confirmation stays. Default: 1500. */
+    resetAfterMs?: number;
+}
+/**
+ * A value that copies its exact form on click.
+ *
+ * ```tsx
+ * <CopyableValue value="50012102.632741">50M</CopyableValue>
+ * ```
+ */
+declare const CopyableValue: react.ForwardRefExoticComponent<CopyableValueProps & react.RefAttributes<HTMLButtonElement>>;
+
+interface DatePickerProps {
+    value?: Date;
+    onValueChange?: (date?: Date) => void;
+    placeholder?: string;
+    className?: string;
+}
+/** Single-date picker (Popover + Calendar). Controlled or uncontrolled. */
+declare function DatePicker({ value, onValueChange, placeholder, className, }: DatePickerProps): react.JSX.Element;
+
+interface DateRangePreset {
+    label: string;
+    getRange: () => DateRange;
+}
+interface DateRangePickerProps {
+    value?: DateRange;
+    defaultValue?: DateRange;
+    onValueChange?: (range?: DateRange) => void;
+    presets?: DateRangePreset[];
+    numberOfMonths?: number;
+    placeholder?: string;
+    className?: string;
+}
+/**
+ * Date range picker (Popover + Calendar in range mode).
+ * Supports optional preset quick-picks, controlled or uncontrolled.
+ */
+declare const DateRangePicker: react.ForwardRefExoticComponent<DateRangePickerProps & react.RefAttributes<HTMLButtonElement>>;
+
+declare const descriptionsVariants: (props?: ({
+    columns?: 1 | 2 | 3 | null | undefined;
+} & class_variance_authority_types.ClassProp) | undefined) => string;
+type DescriptionsLayout = "horizontal" | "vertical";
+interface DescriptionsProps extends HTMLAttributes<HTMLDListElement>, VariantProps<typeof descriptionsVariants> {
+    /**
+     * Number of columns at the widest breakpoint. Collapses to a single column
+     * on small screens. Default 1.
+     */
+    columns?: 1 | 2 | 3;
+    /**
+     * `horizontal` places the label beside the value; `vertical` stacks the
+     * label above the value. Default `horizontal`.
+     */
+    layout?: DescriptionsLayout;
+}
+/**
+ * Descriptions — a responsive definition list of label↔value pairs.
+ *
+ * Renders a native `<dl>`; compose with `DescriptionsItem` (`<dt>`/`<dd>`).
+ * `columns` controls the grid; `layout` controls label placement per item.
+ */
+declare const Descriptions: react.ForwardRefExoticComponent<DescriptionsProps & react.RefAttributes<HTMLDListElement>>;
+interface DescriptionsItemProps extends HTMLAttributes<HTMLDivElement> {
+    /** The term / label for this entry. */
+    label: React.ReactNode;
+    /**
+     * When the value is numeric, set this so the value uses `tabular-nums`
+     * for aligned digits.
+     */
+    numeric?: boolean;
+}
+/**
+ * DescriptionsItem — one label↔value pair (`<dt>` + `<dd>`) inside `Descriptions`.
+ */
+declare const DescriptionsItem: react.ForwardRefExoticComponent<DescriptionsItemProps & react.RefAttributes<HTMLDivElement>>;
+
+declare function Drawer({ shouldScaleBackground, ...props }: ComponentProps<typeof Drawer$1.Root>): react.JSX.Element;
+declare const DrawerTrigger: react.ForwardRefExoticComponent<DialogPrimitive.DialogTriggerProps & react.RefAttributes<HTMLButtonElement>>;
+declare const DrawerPortal: typeof vaul.Portal;
+declare const DrawerClose: react.ForwardRefExoticComponent<DialogPrimitive.DialogCloseProps & react.RefAttributes<HTMLButtonElement>>;
+declare const DrawerContent: react.ForwardRefExoticComponent<Omit<Omit<DialogPrimitive.DialogContentProps & react.RefAttributes<HTMLDivElement>, "ref"> & react.RefAttributes<HTMLDivElement>, "ref"> & react.RefAttributes<HTMLDivElement>>;
+declare function DrawerHeader({ className, ...props }: HTMLAttributes<HTMLDivElement>): react.JSX.Element;
+declare function DrawerFooter({ className, ...props }: HTMLAttributes<HTMLDivElement>): react.JSX.Element;
+declare const DrawerTitle: react.ForwardRefExoticComponent<Omit<DialogPrimitive.DialogTitleProps & react.RefAttributes<HTMLHeadingElement>, "ref"> & react.RefAttributes<HTMLHeadingElement>>;
+declare const DrawerDescription: react.ForwardRefExoticComponent<Omit<DialogPrimitive.DialogDescriptionProps & react.RefAttributes<HTMLParagraphElement>, "ref"> & react.RefAttributes<HTMLParagraphElement>>;
+
+declare const DropdownMenu: react.FC<DropdownMenuPrimitive.DropdownMenuProps>;
+declare const DropdownMenuTrigger: react.ForwardRefExoticComponent<DropdownMenuPrimitive.DropdownMenuTriggerProps & react.RefAttributes<HTMLButtonElement>>;
+declare const DropdownMenuGroup: react.ForwardRefExoticComponent<DropdownMenuPrimitive.DropdownMenuGroupProps & react.RefAttributes<HTMLDivElement>>;
+declare const DropdownMenuPortal: react.FC<DropdownMenuPrimitive.DropdownMenuPortalProps>;
+declare const DropdownMenuSub: react.FC<DropdownMenuPrimitive.DropdownMenuSubProps>;
+declare const DropdownMenuRadioGroup: react.ForwardRefExoticComponent<DropdownMenuPrimitive.DropdownMenuRadioGroupProps & react.RefAttributes<HTMLDivElement>>;
+declare const DropdownMenuSubTrigger: react.ForwardRefExoticComponent<Omit<DropdownMenuPrimitive.DropdownMenuSubTriggerProps & react.RefAttributes<HTMLDivElement>, "ref"> & {
+    inset?: boolean;
+} & react.RefAttributes<HTMLDivElement>>;
+declare const DropdownMenuSubContent: react.ForwardRefExoticComponent<Omit<DropdownMenuPrimitive.DropdownMenuSubContentProps & react.RefAttributes<HTMLDivElement>, "ref"> & react.RefAttributes<HTMLDivElement>>;
+declare const DropdownMenuRadioItem: react.ForwardRefExoticComponent<Omit<DropdownMenuPrimitive.DropdownMenuRadioItemProps & react.RefAttributes<HTMLDivElement>, "ref"> & react.RefAttributes<HTMLDivElement>>;
+declare const DropdownMenuCheckboxItem: react.ForwardRefExoticComponent<Omit<DropdownMenuPrimitive.DropdownMenuCheckboxItemProps & react.RefAttributes<HTMLDivElement>, "ref"> & react.RefAttributes<HTMLDivElement>>;
+declare const DropdownMenuContent: react.ForwardRefExoticComponent<Omit<DropdownMenuPrimitive.DropdownMenuContentProps & react.RefAttributes<HTMLDivElement>, "ref"> & react.RefAttributes<HTMLDivElement>>;
+declare const DropdownMenuItem: react.ForwardRefExoticComponent<Omit<DropdownMenuPrimitive.DropdownMenuItemProps & react.RefAttributes<HTMLDivElement>, "ref"> & {
+    inset?: boolean;
+} & react.RefAttributes<HTMLDivElement>>;
+declare const DropdownMenuLabel: react.ForwardRefExoticComponent<Omit<DropdownMenuPrimitive.DropdownMenuLabelProps & react.RefAttributes<HTMLDivElement>, "ref"> & react.RefAttributes<HTMLDivElement>>;
+declare const DropdownMenuSeparator: react.ForwardRefExoticComponent<Omit<DropdownMenuPrimitive.DropdownMenuSeparatorProps & react.RefAttributes<HTMLDivElement>, "ref"> & react.RefAttributes<HTMLDivElement>>;
+declare function DropdownMenuShortcut({ className, ...props }: React.HTMLAttributes<HTMLSpanElement>): react.JSX.Element;
+
+interface EmptyStateProps {
+    title: ReactNode;
+    description?: ReactNode;
+    /** Optional icon/illustration shown above the title. */
+    icon?: ReactNode;
+    /** Primary/secondary actions. */
+    actions?: ReactNode;
+    className?: string;
+}
+/** @deprecated Use `<StatePanel kind="empty" />` instead. */
+declare function EmptyState({ title, description, icon, actions, className }: EmptyStateProps): react.JSX.Element;
+
+interface ErrorStateProps {
+    title?: ReactNode;
+    description?: ReactNode;
+    /** Optional retry / support actions. */
+    actions?: ReactNode;
+    className?: string;
+}
+/** @deprecated Use `<StatePanel kind="error" />` instead. */
+declare function ErrorState({ title, description, actions, className }: ErrorStateProps): react.JSX.Element;
+
+/**
+ * ExpandDialog — the one "make this bigger" modal: enlarged content on the
+ * inline-start, its context on the inline-end.
+ *
+ * The shape was invented inside `@elabs-ai/components-charts`'
+ * `ChartFrame` (chart left, data summary right) and then hand-rolled a second
+ * and third time — a chat lightbox, an in-place CSS breakout in a consuming
+ * app — because it was trapped in a package the other surfaces cannot import.
+ * It lives here so every "expand" affordance in the system opens the SAME
+ * two-pane surface: a chart, a table, an image, a document.
+ *
+ * It is a LAYOUT, not a viewer. What goes in each pane is the caller's
+ * business; this component owns the dialog anatomy, the pane geometry, the
+ * scroll ownership and the region labelling.
+ */
+/**
+ * The panes grid.
+ *
+ * `detailPlacement` picks the axis; `stackBelow` re-runs the same decision at a
+ * breakpoint, because a 2.5fr/1fr split on a 375px viewport leaves the detail
+ * pane about 107px wide — technically present, practically unreadable. The 2×4
+ * compound matrix mirrors `cardDetailVariants` (`card.tsx`) so the two
+ * detail-panel surfaces in this package resolve their tracks the same way.
+ *
+ * Track sizes arrive as CSS custom properties (`--expand-dialog-view-size` /
+ * `--expand-dialog-detail-size`) rather than arbitrary-value classes, because a
+ * runtime string cannot be a Tailwind class — the same technique `Card` uses
+ * for `--card-detail-size`. The one pair of properties drives whichever axis is
+ * active: columns when the detail is beside, rows when it is below.
+ */
+declare const expandDialogPanesVariants: (props?: ({
+    detailPlacement?: "bottom" | "side" | null | undefined;
+    stackBelow?: "md" | "never" | "sm" | "lg" | null | undefined;
+} & class_variance_authority_types.ClassProp) | undefined) => string;
+interface ExpandDialogPanesProps extends Omit<HTMLAttributes<HTMLDivElement>, "children">, VariantProps<typeof expandDialogPanesVariants> {
+    /** The enlarged content — the reason the dialog opened. */
+    children: ReactNode;
+    /**
+     * Context for what is in the view pane. Omit for a single-pane dialog: the
+     * grid then renders one full-width track and no region wrapper at all.
+     */
+    detail?: ReactNode;
+    /** Accessible name for the detail region. @default `t("ui.expandDialog.detail")` */
+    detailLabel?: string;
+    /** View track size (any CSS length). @default `"minmax(0, 2.5fr)"` */
+    viewSize?: string;
+    /** Detail track size (any CSS length). @default `"minmax(0, 1fr)"` */
+    detailSize?: string;
+    /** Class on the view pane. */
+    viewClassName?: string;
+    /** Class on the detail pane. */
+    detailClassName?: string;
+    /** Tab index for the view pane. Pass `-1` when it owns focusable content. */
+    viewTabIndex?: number;
+    /** Tab index for the detail pane. Pass `-1` when it owns focusable content. */
+    detailTabIndex?: number;
+}
+/**
+ * The two-pane body. Usable on its own for a headerless surface (an image
+ * lightbox), or via `ExpandDialog`, which supplies the dialog around it.
+ */
+declare const ExpandDialogPanes: react.ForwardRefExoticComponent<ExpandDialogPanesProps & react.RefAttributes<HTMLDivElement>>;
+interface ExpandDialogHeaderProps extends Omit<HTMLAttributes<HTMLDivElement>, "title"> {
+    /** Names the dialog. Rendered as the `<h2>` Radix labels the dialog by. */
+    title: ReactNode;
+    /** One line of supporting context under the title. */
+    description?: ReactNode;
+    /** Controls aligned to the inline end of the title row. */
+    actions?: ReactNode;
+}
+/**
+ * The dialog's title row.
+ *
+ * `pe-12` is load-bearing: Radix positions the close button absolutely in the
+ * top inline-end corner, so without the padding a long title runs underneath
+ * it.
+ */
+declare function ExpandDialogHeader({ actions, className, description, title, ...props }: ExpandDialogHeaderProps): react.JSX.Element;
+type ExpandDialogContentProps = ComponentPropsWithoutRef<typeof DialogContent>;
+/**
+ * The full-bleed content box every expand surface uses.
+ *
+ * `size="full"` plus a `DialogBody` child puts `DialogContent` into its
+ * fixed-header regime (a 3-row grid, header pinned, body owning the scroll) —
+ * the anatomy IS the switch, so nothing here hand-rolls a flex column.
+ */
+declare const ExpandDialogContent: react.ForwardRefExoticComponent<Omit<Omit<DialogPrimitive.DialogContentProps & react.RefAttributes<HTMLDivElement>, "ref"> & VariantProps<(props?: ({
+    size?: "full" | "sm" | "lg" | "xl" | null | undefined;
+} & class_variance_authority_types.ClassProp) | undefined) => string> & react.RefAttributes<HTMLDivElement>, "ref"> & react.RefAttributes<HTMLDivElement>>;
+interface ExpandDialogProps extends Omit<ExpandDialogContentProps, "title" | "children">, Pick<ExpandDialogHeaderProps, "title" | "description" | "actions">, Pick<ExpandDialogPanesProps, "children" | "detail" | "detailClassName" | "detailLabel" | "detailPlacement" | "detailSize" | "detailTabIndex" | "stackBelow" | "viewClassName" | "viewSize" | "viewTabIndex"> {
+    /** Class on the panes grid. */
+    panesClassName?: string;
+    /** Class on the recessed field the panes sit in. */
+    fieldClassName?: string;
+}
+/**
+ * The batteries-included composition: content box → header → scroll body →
+ * panes. Place it inside a `Dialog` you control:
+ *
+ * ```tsx
+ * <Dialog open={open} onOpenChange={setOpen}>
+ *   <ExpandDialog title={chart.title} detail={<Summary />}>
+ *     <Chart />
+ *   </ExpandDialog>
+ * </Dialog>
+ * ```
+ *
+ * `Dialog`/`DialogTrigger` are deliberately NOT re-exported under an
+ * `ExpandDialog*` name — they would be zero-behaviour aliases, and open state
+ * is the consumer's already.
+ */
+declare const ExpandDialog: react.ForwardRefExoticComponent<ExpandDialogProps & react.RefAttributes<HTMLDivElement>>;
+
+interface FieldRowProps extends Omit<HTMLAttributes<HTMLDivElement>, "children"> {
+    /** Field label — rendered as a real `<label>`, click-to-focus associated with the control. */
+    label: ReactNode;
+    /** Optional help/description text, always visible (not gated by an error). */
+    description?: ReactNode;
+    /**
+     * Validation error text. When present: sets `aria-invalid` on the control,
+     * is appended to `aria-describedby`, and is announced via `role="alert"`.
+     */
+    error?: ReactNode;
+    /**
+     * The single field control (`Input`, `Textarea`, `Select`, …). Receives
+     * `id`/`aria-describedby`/`aria-invalid` via a Radix `Slot` — must be a
+     * single element that forwards those props to a real form control.
+     */
+    children: ReactElement;
+}
+/**
+ * Label/description/error/`aria-describedby` wiring for a field OUTSIDE a
+ * `react-hook-form` tree — the same anatomy as `FormItem`/`FormLabel`/
+ * `FormControl`/`FormDescription`/`FormMessage` (`../form`), but driven by
+ * plain props (`label`/`description`/`error`) instead of RHF field state, so
+ * a single `useState`-controlled field doesn't need a full `<Form>` +
+ * `<FormField>` + `Controller` just to get correct label/error association.
+ *
+ * Reach for `Form`/`FormField`/… instead when the field already lives inside
+ * a `react-hook-form` `<FormProvider>` — this component does not replace that
+ * family, it covers the gap outside it (#354).
+ */
+declare const FieldRow: react.ForwardRefExoticComponent<FieldRowProps & react.RefAttributes<HTMLDivElement>>;
+
+type FileUploadStatus = "pending" | "uploading" | "success" | "error";
+interface UploadFile {
+    /** Unique identifier for this file in the list. */
+    id: string;
+    /** The underlying File object. */
+    file: File;
+    /** Upload progress 0–100. */
+    progress?: number;
+    /** Upload lifecycle status. */
+    status?: FileUploadStatus;
+    /** Error message shown when status is "error". */
+    errorMessage?: string;
+}
+interface FileUploadContextValue {
+    files: UploadFile[];
+    addFiles: (incoming: File[]) => void;
+    removeFile: (id: string) => void;
+    isDragging: boolean;
+    /** Programmatically open the native file picker. */
+    openPicker: () => void;
+    accept?: string;
+    multiple?: boolean;
+    maxSize?: number;
+    maxFiles?: number;
+    disabled?: boolean;
+    inputId: string;
+}
+declare function useFileUpload(): FileUploadContextValue;
+interface FileUploadProps extends HTMLAttributes<HTMLDivElement> {
+    /** Controlled file list. */
+    files?: UploadFile[];
+    /** Called when files are added or removed. */
+    onFilesChange?: (files: UploadFile[]) => void;
+    /** Accepted MIME types / extensions (forwarded to <input accept>). */
+    accept?: string;
+    /** Allow multiple files at once. */
+    multiple?: boolean;
+    /** Maximum individual file size in bytes. */
+    maxSize?: number;
+    /** Maximum number of files in the list at once. */
+    maxFiles?: number;
+    /** Disable all interactions. */
+    disabled?: boolean;
+    children?: ReactNode;
+}
+/**
+ * FileUpload — compound-component root (Provider).
+ *
+ * Holds the selected-file list + drag state and exposes
+ * `{ files, addFiles, removeFile, isDragging }` via context.
+ * **Presentational** — the app drives per-item `progress` + `status` on
+ * `<FileUploadItem>`. No upload/network logic lives here.
+ *
+ * Controlled via `files`/`onFilesChange`; uncontrolled by default.
+ */
+declare const FileUpload: react.ForwardRefExoticComponent<FileUploadProps & react.RefAttributes<HTMLDivElement>>;
+interface FileUploadDropzoneProps extends HTMLAttributes<HTMLElement> {
+    /** Label for the visually-hidden file picker link (for SR users). */
+    browseLabel?: string;
+}
+/**
+ * FileUploadDropzone — the drag-and-drop target.
+ *
+ * Uses a `<label>` wrapping the hidden `<input>` so the ENTIRE zone is ONE hit
+ * target — no `<div onClick>`.  Keyboard users get the Browse button as a
+ * complementary path.
+ */
+declare const FileUploadDropzone: react.ForwardRefExoticComponent<FileUploadDropzoneProps & react.RefAttributes<HTMLElement>>;
+type FileUploadListProps = HTMLAttributes<HTMLUListElement>;
+/**
+ * FileUploadList — the `role="status"` region that lists accepted files.
+ * Reads from context; children are `<FileUploadItem>` elements.
+ */
+declare const FileUploadList: react.ForwardRefExoticComponent<FileUploadListProps & react.RefAttributes<HTMLUListElement>>;
+interface FileUploadItemProps extends HTMLAttributes<HTMLLIElement> {
+    /** The UploadFile entry to display. */
+    uploadFile: UploadFile;
+    /** Upload progress 0–100. Shown only during "uploading" status. */
+    progress?: number;
+    /** Current status of the upload. */
+    status?: FileUploadStatus;
+    /** Error message (displayed when status="error"). */
+    errorMessage?: string;
+}
+/**
+ * FileUploadItem — a single row in the file list.
+ *
+ * The app controls `progress` and `status` to drive the upload lifecycle.
+ * Per-file errors use `role="alert"`.
+ */
+declare const FileUploadItem: react.ForwardRefExoticComponent<FileUploadItemProps & react.RefAttributes<HTMLLIElement>>;
+
+declare const Form: <TFieldValues extends FieldValues, TContext = any, TTransformedValues = TFieldValues>({ children, watch, getValues, getFieldState, setError, clearErrors, setValue, setValues, trigger, formState, resetField, reset, handleSubmit, unregister, control, register, setFocus, subscribe, }: react_hook_form.FormProviderProps<TFieldValues, TContext, TTransformedValues>) => React.JSX.Element;
+declare function FormField<TFieldValues extends FieldValues = FieldValues, TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>>(props: ControllerProps<TFieldValues, TName>): react.JSX.Element;
+declare function useFormField(): {
+    invalid: boolean;
+    isDirty: boolean;
+    isTouched: boolean;
+    isValidating: boolean;
+    error?: react_hook_form.FieldError;
+    id: string;
+    name: string;
+    formItemId: string;
+    formDescriptionId: string;
+    formMessageId: string;
+};
+declare const FormItem: react.ForwardRefExoticComponent<HTMLAttributes<HTMLDivElement> & react.RefAttributes<HTMLDivElement>>;
+declare const FormLabel: react.ForwardRefExoticComponent<Omit<Omit<_radix_ui_react_label.LabelProps & react.RefAttributes<HTMLLabelElement>, "ref"> & react.RefAttributes<HTMLLabelElement>, "ref"> & react.RefAttributes<HTMLLabelElement>>;
+declare const FormControl: react.ForwardRefExoticComponent<Omit<_radix_ui_react_slot.SlotProps & react.RefAttributes<HTMLElement>, "ref"> & react.RefAttributes<HTMLElement>>;
+declare const FormDescription: react.ForwardRefExoticComponent<HTMLAttributes<HTMLParagraphElement> & react.RefAttributes<HTMLParagraphElement>>;
+declare const FormMessage: react.ForwardRefExoticComponent<HTMLAttributes<HTMLParagraphElement> & react.RefAttributes<HTMLParagraphElement>>;
+
+declare const HoverCard: react.FC<HoverCardPrimitive.HoverCardProps>;
+declare const HoverCardTrigger: react.ForwardRefExoticComponent<HoverCardPrimitive.HoverCardTriggerProps & react.RefAttributes<HTMLAnchorElement>>;
+declare const HoverCardContent: react.ForwardRefExoticComponent<Omit<HoverCardPrimitive.HoverCardContentProps & react.RefAttributes<HTMLDivElement>, "ref"> & react.RefAttributes<HTMLDivElement>>;
+
+/** The icon-only size axis (a deliberate subset of `buttonVariants`' `size`). */
+type IconButtonSize = "icon" | "icon-sm" | "icon-lg";
+interface IconButtonProps extends Omit<ButtonHTMLAttributes<HTMLButtonElement>, "title" | "children" | "aria-label" | "aria-describedby">, Pick<VariantProps<typeof buttonVariants>, "variant"> {
+    /**
+     * Accessible name AND tooltip text — a single source of truth, so the two
+     * can never drift out of sync (the failure this component exists to close:
+     * `aria-label` and a tooltip's children set independently, most call sites
+     * only setting one).
+     */
+    label: string;
+    /** The glyph (typically a `lucide-react` element). */
+    icon: ReactNode;
+    /** Icon-only size axis. Default `"icon"`. */
+    size?: IconButtonSize;
+    /**
+     * Shown appended to the tooltip text, and — independently — exposed via
+     * `aria-describedby` through an `sr-only` node that is present whenever this
+     * prop is (i.e. it does NOT depend on the tooltip being open, and it is not
+     * rendered at all when there is no reason — so it can never be read as stray
+     * text), so assistive tech gets the reason even while the button is disabled
+     * (a disabled
+     * `<button>` still exposes its ARIA attributes; it just isn't
+     * focusable/hoverable itself, which is why the tooltip trigger wraps a
+     * focusable `<span>` instead — see the render below).
+     */
+    disabledReason?: string;
+    /** Tooltip placement. Default `"top"`. */
+    side?: ComponentProps<typeof TooltipContent>["side"];
+}
+/**
+ * A single affordance for an icon-only control: `label` becomes both the
+ * `aria-label` and the tooltip text, so they cannot diverge. Composes
+ * `Button` + `Tooltip` — it does not reimplement either.
+ *
+ * Deliberately has **no `asChild`**: accepting one would dissolve the button
+ * into a Radix `Slot` and break the tooltip-trigger wrapper below. A
+ * link-styled icon button should compose `Button asChild` + `Tooltip`
+ * directly instead.
+ */
+declare const IconButton: react.ForwardRefExoticComponent<IconButtonProps & react.RefAttributes<HTMLButtonElement>>;
+
+type TextareaProps = TextareaHTMLAttributes<HTMLTextAreaElement>;
+declare const Textarea: react.ForwardRefExoticComponent<TextareaProps & react.RefAttributes<HTMLTextAreaElement>>;
+
+declare const inputGroupVariants: (props?: ({
+    variant?: "outline" | "surface" | "card" | null | undefined;
+} & class_variance_authority_types.ClassProp) | undefined) => string;
+type InputGroupProps = ComponentProps<"div"> & VariantProps<typeof inputGroupVariants>;
+declare const InputGroup: react.ForwardRefExoticComponent<Omit<InputGroupProps, "ref"> & react.RefAttributes<HTMLDivElement>>;
+declare const inputGroupAddonVariants: (props?: ({
+    align?: "inline-end" | "inline-start" | "block-end" | "block-start" | null | undefined;
+} & class_variance_authority_types.ClassProp) | undefined) => string;
+declare const InputGroupAddon: react.ForwardRefExoticComponent<Omit<react.ClassAttributes<HTMLDivElement> & react.HTMLAttributes<HTMLDivElement> & VariantProps<(props?: ({
+    align?: "inline-end" | "inline-start" | "block-end" | "block-start" | null | undefined;
+} & class_variance_authority_types.ClassProp) | undefined) => string>, "ref"> & react.RefAttributes<HTMLDivElement>>;
+declare const InputGroupButton: react.ForwardRefExoticComponent<Omit<Omit<ButtonProps & react.RefAttributes<HTMLButtonElement>, "size"> & {
+    size?: "xs" | "sm" | "icon-xs" | "icon-sm";
+}, "ref"> & react.RefAttributes<HTMLButtonElement>>;
+declare const InputGroupText: react.ForwardRefExoticComponent<Omit<react.DetailedHTMLProps<react.HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, "ref"> & react.RefAttributes<HTMLSpanElement>>;
+declare const InputGroupInput: react.ForwardRefExoticComponent<Omit<InputProps & react.RefAttributes<HTMLInputElement>, "ref"> & react.RefAttributes<HTMLInputElement>>;
+declare const InputGroupTextarea: react.ForwardRefExoticComponent<Omit<TextareaProps & react.RefAttributes<HTMLTextAreaElement>, "ref"> & react.RefAttributes<HTMLTextAreaElement>>;
+
+declare const InputOTP: react.ForwardRefExoticComponent<ComponentPropsWithoutRef<react.ForwardRefExoticComponent<input_otp.OTPInputProps & react.RefAttributes<HTMLInputElement>>> & react.RefAttributes<HTMLInputElement>>;
+declare const InputOTPGroup: react.ForwardRefExoticComponent<react.HTMLAttributes<HTMLDivElement> & react.RefAttributes<HTMLDivElement>>;
+declare const InputOTPSlot: react.ForwardRefExoticComponent<react.HTMLAttributes<HTMLDivElement> & {
+    index: number;
+} & react.RefAttributes<HTMLDivElement>>;
+declare const InputOTPSeparator: react.ForwardRefExoticComponent<react.HTMLAttributes<HTMLDivElement> & react.RefAttributes<HTMLDivElement>>;
+
+/** Keyboard key hint, e.g. <Kbd>⌘K</Kbd>. */
+declare const Kbd: react.ForwardRefExoticComponent<HTMLAttributes<HTMLElement> & react.RefAttributes<HTMLElement>>;
+
+interface KeyValueRow {
+    key: string;
+    value: string;
+    /**
+     * Marks this row's value as sensitive: it renders masked (`type="password"`)
+     * with a reveal toggle, and is never surfaced in plain text via any
+     * `title`/`aria-label`/`aria-valuetext`. Defaults to false (a plain,
+     * unmasked key/value pair) — the consumer opts a row in explicitly.
+     */
+    secret?: boolean;
+}
+interface KeyValueEditorProps extends Omit<HTMLAttributes<HTMLDivElement>, "onChange" | "defaultValue"> {
+    /**
+     * Controlled, ORDERED rows. An ordered `{ key, value, secret? }[]` is used
+     * instead of `Record<string,string>` because a plain record can't
+     * represent an in-progress duplicate key or preserve row order while the
+     * user is mid-edit — both happen constantly while typing an env-var map.
+     */
+    value?: KeyValueRow[];
+    /** Uncontrolled initial rows. */
+    defaultValue?: KeyValueRow[];
+    /** Called when the rows change (add, remove, or edit). */
+    onValueChange?: (rows: KeyValueRow[]) => void;
+    /** Placeholder for each row's key field. */
+    keyPlaceholder?: string;
+    /** Placeholder for each row's value field. */
+    valuePlaceholder?: string;
+    /** Label for the "add row" control. */
+    addLabel?: ReactNode;
+    /** Disables the whole editor. */
+    disabled?: boolean;
+}
+/**
+ * KeyValueEditor — key/value rows with per-row secret masking.
+ *
+ * Composes the existing `Input` + `Button` (icon vocabulary matches
+ * `packages/ai/src/environment-variables.tsx`'s `Eye`/`EyeOff` reveal icons
+ * for conceptual consistency, though this component lives in
+ * `@elabs-ai/components-ui` — an EDITABLE settings-form primitive
+ * is app UI, not the read-only agent tool-output display that
+ * `EnvironmentVariables` is).
+ *
+ * A masked row uses the native `type="password"` input (the correct
+ * primitive for an EDITABLE masked field — unlike a read-only display, the
+ * value must stay typable, and native masking is what keeps it that way
+ * without hand-rolling bullet substitution). The reveal toggle's
+ * `aria-label` never contains the secret text itself, and no `title`
+ * attribute is ever set from row content.
+ *
+ * Controlled via `value`/`onValueChange`; uncontrolled via `defaultValue`.
+ */
+declare const KeyValueEditor: react.ForwardRefExoticComponent<KeyValueEditorProps & react.RefAttributes<HTMLDivElement>>;
+
+declare const Label: react.ForwardRefExoticComponent<Omit<_radix_ui_react_label.LabelProps & react.RefAttributes<HTMLLabelElement>, "ref"> & react.RefAttributes<HTMLLabelElement>>;
+
+interface LinkPreviewCardProps extends HTMLAttributes<HTMLDivElement> {
+    /** Page title — the primary text, 1–2 lines. */
+    title?: string;
+    /** Short description / Open-Graph description. Omit for title+domain only. */
+    description?: string;
+    /**
+     * Absolute URL of the thumbnail image (consumer-provided; the library never
+     * fetches). Decorative — `alt` is always `""`. Omit to hide the thumbnail
+     * area cleanly (no broken-image placeholder).
+     */
+    image?: string;
+    /**
+     * Domain label shown with the globe icon, e.g. `"github.com"`. Wrapped in
+     * `translate="no"` so browsers never auto-translate identifiers.
+     */
+    domain?: string;
+    /**
+     * When set, the entire card becomes a keyboard-focusable link (stretched-link
+     * pattern). The visible focus ring is placed on the card via `focus-within`.
+     * Prefer a full absolute URL so the `<a>` is meaningful.
+     */
+    href?: string;
+    /**
+     * Render skeleton placeholders in lieu of real content. Sets `aria-busy="true"`
+     * on the card root so assistive technology knows the content is pending.
+     */
+    loading?: boolean;
+}
+/**
+ * A rich, presentational link-preview card (unfurled URL / bookmark block).
+ * Renders favicon/domain, title, description, and an optional thumbnail from
+ * **consumer-provided** metadata — the library never fetches.
+ *
+ * States: `loading` (skeleton), loaded (full), no-image, no-description
+ * (title + domain only), and empty/error (degrades to a plain placeholder).
+ *
+ * Pass `href` to make the whole card a keyboard-focusable stretched link.
+ * Use `loading` for the skeleton state; set `aria-busy` is applied automatically.
+ */
+declare const LinkPreviewCard: react.ForwardRefExoticComponent<LinkPreviewCardProps & react.RefAttributes<HTMLDivElement>>;
+/**
+ * Convenience alias for `LinkPreviewCard`. Identical component — use whichever
+ * name reads more naturally at the call site.
+ *
+ * `LinkPreviewCard` is the canonical export; `LinkPreview` is the alias.
+ */
+declare const LinkPreview: react.ForwardRefExoticComponent<LinkPreviewCardProps & react.RefAttributes<HTMLDivElement>>;
+
+interface ListEditorProps extends Omit<HTMLAttributes<HTMLDivElement>, "onChange" | "defaultValue"> {
+    /** Controlled list of strings. */
+    value?: string[];
+    /** Uncontrolled initial list of strings. */
+    defaultValue?: string[];
+    /** Called when the list changes (add, remove, edit, or reorder). */
+    onValueChange?: (value: string[]) => void;
+    /**
+     * Whether rows can be reordered via move-up/move-down buttons. Default
+     * true. Reordering is keyboard-operable (real buttons), never drag-only.
+     */
+    reorderable?: boolean;
+    /** Placeholder shown in each row's text field. */
+    placeholder?: string;
+    /** Maximum number of rows allowed. */
+    max?: number;
+    /** Whether the editor is disabled. */
+    disabled?: boolean;
+    /** Label for the "add item" control. */
+    addLabel?: ReactNode;
+}
+/**
+ * ListEditor — one `Input` per row over a `string[]`, with add / remove /
+ * keyboard-operable reorder (move-up/move-down buttons, not drag-and-drop —
+ * no drag library exists in the monorepo and none should be added for this).
+ *
+ * Controlled via `value`/`onValueChange`; uncontrolled via `defaultValue`.
+ */
+declare const ListEditor: react.ForwardRefExoticComponent<ListEditorProps & react.RefAttributes<HTMLDivElement>>;
+
+/** A flat map of string keys to their translated values. */
+type Messages = Record<string, string>;
+interface LocaleContextValue {
+    /** BCP-47 locale tag, e.g. "en-US", "ar-EG", "de-DE". */
+    locale: string;
+    /** Layout direction for the locale region. */
+    dir: "ltr" | "rtl";
+    /**
+     * Translate a key.
+     * Falls back to: consumer messages → English default → the key itself.
+     * Supports simple `{name}`-style variable interpolation.
+     */
+    t: (key: string, vars?: Record<string, string | number>) => string;
+    /** Format a number using the active locale. Memoized per locale+opts hash. */
+    formatNumber: (n: number, opts?: Intl.NumberFormatOptions) => string;
+    /** Format a date using the active locale. Memoized per locale+opts hash. */
+    formatDate: (d: Date | number, opts?: Intl.DateTimeFormatOptions) => string;
+}
+interface LocaleProviderProps {
+    /**
+     * BCP-47 locale tag. Defaults to "en-US".
+     * Used by `t`, `formatNumber`, and `formatDate`.
+     */
+    locale?: string;
+    /**
+     * Layout direction for the subtree.
+     * Defaults to "ltr". Set "rtl" for Arabic, Hebrew, Farsi, etc.
+     */
+    dir?: "ltr" | "rtl";
+    /**
+     * Additional/overriding message strings merged on top of the shipped English
+     * defaults. Only the keys you provide are overridden; the rest fall through
+     * to the English bundle.
+     */
+    messages?: Messages;
+    children: ReactNode;
+}
+/**
+ * `LocaleProvider` supplies locale, layout direction, component microcopy, and
+ * Intl formatting helpers to the component subtree.
+ *
+ * - Wrap your app (or a regional subtree) with it to localise brand-ui components.
+ * - Components call `useLocale()` unconditionally; without a provider they
+ *   degrade gracefully to "en-US" / "ltr" / English defaults.
+ * - Portalled Radix content (Dialog, Sheet, Popover, DropdownMenu) still honors
+ *   `dir` because the subtree is wrapped in Radix's `DirectionProvider`, which
+ *   every Radix primitive reads via context regardless of DOM position (ADR-0014).
+ *   The `<div dir={dir}>` continues to carry direction for non-Radix content.
+ */
+declare function LocaleProvider({ locale, dir, messages, children, }: LocaleProviderProps): react.JSX.Element;
+/**
+ * Read the active locale, direction, `t`, `formatNumber`, and `formatDate`.
+ *
+ * Provider-optional: without a `<LocaleProvider>` this returns the en-US
+ * defaults so components can call it unconditionally and remain usable in
+ * unwrapped contexts.
+ */
+declare function useLocale(): LocaleContextValue;
+
+/**
+ * Shipped English (en-US) default microcopy bundle.
+ *
+ * Keys are intentionally terse, semantic, and framework-agnostic so they
+ * translate cleanly into any target locale. Keep this list small and real —
+ * only add a key here when a component actually needs it.
+ */
+declare const DEFAULT_MESSAGES: Record<string, string>;
+
+interface LoadingStateProps {
+    /** Accessible status label. Defaults to "Loading…". */
+    label?: ReactNode;
+    /** Visual size of the spinner. */
+    size?: "sm" | "md" | "lg";
+    className?: string;
+}
+/** @deprecated Use `<StatePanel kind="loading" />` instead. */
+declare function LoadingState({ label, size, className }: LoadingStateProps): react.JSX.Element;
+
+/** A half-open `[start, end)` character range within the text. */
+type MatchRange = readonly [number, number];
+interface MatchHighlightProps extends HTMLAttributes<HTMLSpanElement> {
+    /** The full string to render. */
+    text: string;
+    /**
+     * One or more needles to highlight. Case-insensitive by default. Ignored when
+     * `ranges` is supplied.
+     */
+    query?: string | string[];
+    /**
+     * Precomputed match ranges (e.g. from a fuzzy matcher / MiniSearch). Wins over
+     * `query` when supplied. Overlapping and adjacent ranges are merged.
+     */
+    ranges?: readonly MatchRange[];
+    /** Match `query` case-sensitively. @default false */
+    caseSensitive?: boolean;
+    /**
+     * Which mark is the CURRENT one, 0-based among the resolved (merged, sorted)
+     * ranges. `-1` or omitted means none is.
+     *
+     * "One of twelve" and "the one you are on" are different meanings, so the
+     * current mark gets its own token pair rather than an opacity tweak — and,
+     * because colour is never the only channel (WCAG 1.4.1), an outline and
+     * `aria-current="true"` as well. It also carries `data-active`, which is how
+     * a caller finds it to scroll it into view:
+     * `root.querySelector('[data-slot="match-highlight-mark"][data-active]')`.
+     */
+    activeIndex?: number;
+}
+/**
+ * Find every occurrence of each needle in `text` and return their `[start, end)`
+ * ranges. Uses a per-needle global regex so indices land on the ORIGINAL string
+ * (unicode-safe — no `toLowerCase()` length drift), handling multiple needles and
+ * case folding. Empty needles are ignored.
+ */
+declare function queryToRanges(text: string, query: string | string[], caseSensitive?: boolean): MatchRange[];
+/**
+ * Clamp ranges to `[0, len)`, drop empty/invalid ones, sort, and merge
+ * overlapping AND adjacent ranges (so `[0,2]` + `[2,4]` → a single `[0,4]`).
+ */
+declare function normalizeRanges(ranges: readonly MatchRange[], len: number): MatchRange[];
+/**
+ * Render `text` with the query matches wrapped in real `<mark>` elements. Purely
+ * presentational: pass `query` to let it compute ranges (case-insensitive by
+ * default), or `ranges` from your own fuzzy engine. Marks use the semantic
+ * `--highlight` token pair (AA-legible ink in every theme). Screen readers read
+ * the full string naturally.
+ */
+declare const MatchHighlight: react.ForwardRefExoticComponent<MatchHighlightProps & react.RefAttributes<HTMLSpanElement>>;
+
+declare const Popover: react.FC<PopoverPrimitive.PopoverProps>;
+declare const PopoverTrigger: react.ForwardRefExoticComponent<PopoverPrimitive.PopoverTriggerProps & react.RefAttributes<HTMLButtonElement>>;
+declare const PopoverAnchor: react.ForwardRefExoticComponent<PopoverPrimitive.PopoverAnchorProps & react.RefAttributes<HTMLDivElement>>;
+declare const PopoverContent: react.ForwardRefExoticComponent<Omit<PopoverPrimitive.PopoverContentProps & react.RefAttributes<HTMLDivElement>, "ref"> & react.RefAttributes<HTMLDivElement>>;
+
+/**
+ * The pure offset algebra behind `MentionInput`.
+ *
+ * Chip atomicity in a real `<textarea>` is **selection arithmetic over a token
+ * map**, not DOM nodes: the field holds ordinary text, and this module keeps a
+ * parallel list of `{ id, label, start }` records honest as that text is edited,
+ * pasted over and deleted. Nothing here touches React or the DOM, so every
+ * acceptance criterion about backspace atomicity, caret skipping and the
+ * `{ text, mentionedIds }` payload reduces to a unit test on these functions.
+ */
+/** One selectable roster entry. */
+interface MentionOption {
+    /** Stable id — this is what `serializeMentions` emits. */
+    id: string;
+    /** Inserted verbatim after the trigger character. */
+    label: string;
+    /** Optional secondary line shown under the label. */
+    description?: string;
+    /** Optional leading glyph (avatar, icon). */
+    icon?: ReactNode;
+    /** Extra match terms, so "ada" can find "Ada Lovelace". */
+    keywords?: string[];
+    /** Rendered but not selectable. */
+    disabled?: boolean;
+}
+/** A resolved mention inside `MentionValue.text`. */
+interface Mention {
+    /** The option id this run refers to. */
+    id: string;
+    /** The label WITHOUT the trigger character. */
+    label: string;
+    /** Offset of the trigger character in `text`. */
+    start: number;
+}
+/** The component's value: plain text plus the mentions it contains. */
+interface MentionValue {
+    text: string;
+    mentions: Mention[];
+}
+/** The result of inserting an option: the new value and where the caret goes. */
+interface InsertMentionResult {
+    value: MentionValue;
+    /** Offset immediately after the inserted token's trailing space. */
+    caret: number;
+}
+/** Exclusive end offset of a mention's `trigger + label` run. */
+declare function mentionEnd(mention: Mention, trigger?: string): number;
+/**
+ * The mention whose half-open range `[start, end)` contains `index`, if any.
+ *
+ * Half-open on purpose: the offset one past the token is *outside* it, so a
+ * caret sitting immediately after `@Ada Lovelace` is "next to" the mention
+ * rather than "in" it. Backspace therefore asks about `caret - 1` and Delete
+ * about `caret`, and both get an unambiguous answer.
+ */
+declare function mentionAt(value: MentionValue, index: number, trigger?: string): Mention | undefined;
+/**
+ * Re-derive the mention list after the text changed underneath it.
+ *
+ * The edit is treated as ONE contiguous replacement — which is what a
+ * keystroke, a paste, a cut and a native undo all are. The common prefix and
+ * common suffix bracket it; a mention entirely before the edit keeps its
+ * offset, one entirely after it shifts by the length delta, and one the edit
+ * reaches into is **dropped** (its text no longer spells the person's name, so
+ * the id would be a lie).
+ *
+ * Every survivor is then **re-validated** against the new text: the run at its
+ * offset must still read exactly `trigger + label`. That second pass is what
+ * makes a multi-mention paste safe — the arithmetic alone can be fooled by a
+ * replacement whose prefix/suffix boundaries land ambiguously, but a run that
+ * no longer spells the token can never survive the check.
+ */
+declare function remapMentions(prev: MentionValue, nextText: string, trigger?: string): Mention[];
+/**
+ * Replace the in-progress `trigger + query` run with `trigger + label + " "`.
+ *
+ * `queryStart` is the offset of the trigger character; `caret` is where the
+ * query ends. The trailing space is deliberate: it terminates the query so the
+ * popup closes, and it gives the next word somewhere to start.
+ */
+declare function insertMention(value: MentionValue, option: MentionOption, trigger: string, queryStart: number, caret: number): InsertMentionResult;
+/**
+ * The serialization contract a consumer gets out: the raw text plus the option
+ * ids it references, **deduped** and in **document order** (two mentions of the
+ * same person yield one id).
+ */
+declare function serializeMentions(value: MentionValue): {
+    text: string;
+    mentionedIds: string[];
+};
+/**
+ * Case-insensitive substring match over `label` and `keywords`. An empty query
+ * matches everything, so the full roster shows the moment the trigger is typed.
+ */
+declare function defaultMentionFilter(option: MentionOption, query: string): boolean;
+
+interface MentionInputContextValue {
+    state: {
+        value: MentionValue;
+        /** The in-progress query WITHOUT the trigger char; `null` when closed. */
+        query: string | null;
+        open: boolean;
+        /** Index into `filtered`; `-1` when nothing is highlighted. */
+        activeIndex: number;
+        /** DOM id of the highlighted option; `undefined` when nothing is. */
+        activeId?: string;
+        filtered: MentionOption[];
+    };
+    actions: {
+        insert: (option: MentionOption) => void;
+        close: () => void;
+        setActiveIndex: (index: number) => void;
+    };
+    meta: {
+        trigger: string;
+        listId: string;
+        /**
+         * The id `MentionInputTextarea` puts on its element. Advisory only — with
+         * `asChild`, Radix `Slot` lets a consumer-supplied `id` on the child win
+         * (child props are merged OVER slot props), so the component itself never
+         * resolves the field through this id; it holds a real ref.
+         */
+        textareaId: string;
+        optionId: (index: number) => string;
+    };
+}
+/** Read the surrounding `MentionInput`'s state, actions and ids. */
+declare function useMentionInput(): MentionInputContextValue;
+interface MentionInputProps extends Omit<HTMLAttributes<HTMLDivElement>, "onChange" | "defaultValue"> {
+    /** The roster the popup offers. */
+    options: MentionOption[];
+    /** Controlled value. */
+    value?: MentionValue;
+    /** Uncontrolled initial value. */
+    defaultValue?: MentionValue;
+    /** Called with the whole value whenever text or mentions change. */
+    onValueChange?: (value: MentionValue) => void;
+    /** Trigger character. Default `"@"`. */
+    trigger?: string;
+    /**
+     * Which options survive the current query. Defaults to
+     * `defaultMentionFilter`; pass `() => true` when the roster is fetched
+     * app-side from `onQueryChange`.
+     */
+    filter?: (option: MentionOption, query: string) => boolean;
+    /** The query changed. `null` means the popup closed. */
+    onQueryChange?: (query: string | null) => void;
+    /** Controlled popup state. */
+    open?: boolean;
+    /** Called when the popup wants to open or close. */
+    onOpenChange?: (open: boolean) => void;
+    children: ReactNode;
+}
+/**
+ * MentionInput — an `@`-mention text field built on a real `<textarea>`.
+ *
+ * The field stays a native textarea (so IME, paste, undo, spellcheck, mobile
+ * keyboards and `FormData` all keep working) and mentions are tracked as
+ * offsets beside it. The suggestion popup is this component's own listbox
+ * driven by `aria-activedescendant`, so **focus never leaves the textarea** —
+ * a popup that took focus would take the caret with it.
+ */
+declare const MentionInput: react.ForwardRefExoticComponent<MentionInputProps & react.RefAttributes<HTMLDivElement>>;
+interface MentionInputTextareaProps extends Omit<TextareaHTMLAttributes<HTMLTextAreaElement>, "value" | "defaultValue"> {
+    /**
+     * Render the consumer's own textarea-rendering component instead of a
+     * `Textarea` — e.g. `PromptInputTextarea`. The child must ultimately render a
+     * real `<textarea>`; everything this component needs is spread onto it.
+     */
+    asChild?: boolean;
+}
+/**
+ * The field itself — a real `<textarea>` carrying the combobox semantics.
+ *
+ * The mention interception is bound as **`onKeyDownCapture`**, not `onKeyDown`.
+ * Under `asChild`, Radix `Slot` merges CHILD handlers over slot handlers and
+ * runs the child's **first**. So when the child binds `onKeyDown` directly on
+ * the host element, a bubble-phase handler here would fire *after* it — the
+ * child's Enter→submit would win and the popup would never see the key. React
+ * dispatches an element's capture pass before its bubble pass and shares one
+ * `SyntheticEvent` between them, so `preventDefault()` here is already visible
+ * as `event.defaultPrevented` when the child's handler runs.
+ *
+ * **Scope of the hazard, stated precisely** (an earlier version of this comment
+ * overclaimed): it applies to a child that binds `onKeyDown` on a *host
+ * element*. It does NOT apply to `PromptInputTextarea`, which is a *component*
+ * that destructures `onKeyDown` out of its own props, calls it first and bails
+ * on `defaultPrevented` (`packages/ai/src/prompt-input.tsx`) — that composition
+ * works with either binding. The capture binding is what makes the raw-host
+ * case correct too, and that is the case the locking test exercises: see
+ * "T8 Slot handler-order contract" in `mention-input.test.tsx`, which fails if
+ * this is ever moved to `onKeyDown`.
+ */
+declare const MentionInputTextarea: react.ForwardRefExoticComponent<MentionInputTextareaProps & react.RefAttributes<HTMLTextAreaElement>>;
+type MentionInputContentProps = React.ComponentPropsWithoutRef<typeof PopoverContent>;
+/** The floating panel. Never takes focus — the caret has to stay in the field. */
+declare const MentionInputContent: react.ForwardRefExoticComponent<Omit<Omit<PopoverPrimitive.PopoverContentProps & react.RefAttributes<HTMLDivElement>, "ref"> & react.RefAttributes<HTMLDivElement>, "ref"> & react.RefAttributes<HTMLDivElement>>;
+interface MentionInputListProps extends Omit<HTMLAttributes<HTMLDivElement>, "children"> {
+    /**
+     * Either static nodes, or a render function called once per filtered option.
+     * The function form is the one to reach for — the parent has to hand each
+     * option back, which is exactly what `children`-as-a-function is for.
+     */
+    children?: ReactNode | ((option: MentionOption, index: number) => ReactNode);
+}
+/** The listbox. Owns the accessible name and the option mapping. */
+declare const MentionInputList: react.ForwardRefExoticComponent<MentionInputListProps & react.RefAttributes<HTMLDivElement>>;
+interface MentionInputItemProps extends Omit<HTMLAttributes<HTMLDivElement>, "children"> {
+    option: MentionOption;
+    children?: ReactNode;
+}
+/**
+ * One option row.
+ *
+ * The row derives its own index from the provider's `filtered` list rather than
+ * accepting one, so its `id` and `aria-selected` can never disagree with the
+ * `aria-activedescendant` the field is publishing.
+ */
+declare const MentionInputItem: react.ForwardRefExoticComponent<MentionInputItemProps & react.RefAttributes<HTMLDivElement>>;
+type MentionInputEmptyProps = HTMLAttributes<HTMLDivElement>;
+/**
+ * The "nothing matches" line. A **sibling** of the listbox, never a child —
+ * a `role="listbox"` may only own `option` and `group` children.
+ */
+declare const MentionInputEmpty: react.ForwardRefExoticComponent<MentionInputEmptyProps & react.RefAttributes<HTMLDivElement>>;
+
+declare const Menubar: react.ForwardRefExoticComponent<Omit<MenubarPrimitive.MenubarProps & react.RefAttributes<HTMLDivElement>, "ref"> & react.RefAttributes<HTMLDivElement>>;
+declare const MenubarTrigger: react.ForwardRefExoticComponent<Omit<MenubarPrimitive.MenubarTriggerProps & react.RefAttributes<HTMLButtonElement>, "ref"> & react.RefAttributes<HTMLButtonElement>>;
+declare const MenubarContent: react.ForwardRefExoticComponent<Omit<MenubarPrimitive.MenubarContentProps & react.RefAttributes<HTMLDivElement>, "ref"> & react.RefAttributes<HTMLDivElement>>;
+declare const MenubarItem: react.ForwardRefExoticComponent<Omit<MenubarPrimitive.MenubarItemProps & react.RefAttributes<HTMLDivElement>, "ref"> & {
+    inset?: boolean;
+} & react.RefAttributes<HTMLDivElement>>;
+declare const MenubarSubTrigger: react.ForwardRefExoticComponent<Omit<MenubarPrimitive.MenubarSubTriggerProps & react.RefAttributes<HTMLDivElement>, "ref"> & {
+    inset?: boolean;
+} & react.RefAttributes<HTMLDivElement>>;
+declare const MenubarSubContent: react.ForwardRefExoticComponent<Omit<MenubarPrimitive.MenubarSubContentProps & react.RefAttributes<HTMLDivElement>, "ref"> & react.RefAttributes<HTMLDivElement>>;
+declare const MenubarCheckboxItem: react.ForwardRefExoticComponent<Omit<MenubarPrimitive.MenubarCheckboxItemProps & react.RefAttributes<HTMLDivElement>, "ref"> & react.RefAttributes<HTMLDivElement>>;
+declare const MenubarRadioItem: react.ForwardRefExoticComponent<Omit<MenubarPrimitive.MenubarRadioItemProps & react.RefAttributes<HTMLDivElement>, "ref"> & react.RefAttributes<HTMLDivElement>>;
+declare const MenubarSeparator: react.ForwardRefExoticComponent<Omit<MenubarPrimitive.MenubarSeparatorProps & react.RefAttributes<HTMLDivElement>, "ref"> & react.RefAttributes<HTMLDivElement>>;
+declare function MenubarShortcut({ className, ...props }: HTMLAttributes<HTMLSpanElement>): react.JSX.Element;
+
+/**
+ * `ModelPicker`'s two state decisions, kept OUT of the component on purpose.
+ *
+ * Both were inline ternaries in the consuming app this component came from, and
+ * both survived every mutation thrown at them — because no test could reach an
+ * expression buried in JSX. As exported pure functions they are directly
+ * testable, which is the whole reason they live in their own module.
+ */
+/** What the picker knows about the list it was handed. */
+type ModelPickerStatus = "idle" | "loading" | "ready" | "stale" | "error" | "empty";
+/** Which of the four mutually-exclusive bodies the popover renders. */
+type ModelPickerBody = "loading" | "list" | "error" | "empty";
+/**
+ * Pick the body.
+ *
+ * **A non-empty list always wins.** A failed refresh over usable stale data is an
+ * inline strip above a working list (see `showsInlineError`), never a takeover —
+ * collapsing "stale list + error" into "error panel" throws away a list the user
+ * could still have picked from.
+ */
+declare function modelPickerBody(status: ModelPickerStatus, itemCount: number): ModelPickerBody;
+/**
+ * Whether to show the error line ABOVE a list that still works — i.e. the
+ * refresh failed but there is stale data worth keeping on screen.
+ */
+declare function showsInlineError(status: ModelPickerStatus, itemCount: number): boolean;
+/** One selectable row. */
+interface ModelPickerItem {
+    id: string;
+    label: string;
+    /** Muted second line. */
+    description?: string;
+    /**
+     * Extra strings cmdk should MATCH on without displaying — ids, a space or
+     * workspace name. This is what lets a search for "northwind" find a target
+     * whose visible label never says it.
+     */
+    keywords?: string[];
+    /**
+     * Leading glyph. A ReactNode, never a URL: a renderer with no remote origins
+     * cannot fetch a logo, so the caller supplies a bundled node.
+     */
+    icon?: React.ReactNode;
+    /**
+     * Trailing muted badges ("not provisioned", "no modes").
+     *
+     * Deliberately a caller-supplied ARRAY rather than derived from flags. A
+     * three-valued flag where absent means "undecided" renders as "not enabled"
+     * the moment a component computes the badge from `!flag` — which mislabels
+     * every row on a deployment that simply never probed. Keeping this a list the
+     * caller builds means the library cannot get that wrong on their behalf.
+     */
+    meta?: string[];
+    /** Disable this row without removing it. */
+    disabled?: boolean;
+}
+/** A titled group of rows. */
+interface ModelPickerGroup {
+    key: string;
+    /**
+     * Rendered verbatim as the group heading. The CALLER derives it (`Apps ·
+     * northwind`, `Assistants · personal`) — the library never invents grouping or
+     * heading text from the data.
+     */
+    label: string;
+    items: ModelPickerItem[];
+}
+/** Total rows across all groups. */
+declare function countItems(groups: readonly ModelPickerGroup[]): number;
+
+interface ModelPickerProps extends Omit<HTMLAttributes<HTMLDivElement>, "onSelect"> {
+    /** Grouped rows. Grouping and heading text are the caller's, never derived. */
+    groups: readonly ModelPickerGroup[];
+    /** The currently pinned row's id. */
+    value?: string;
+    /** Fires with the chosen row; the popover closes first. */
+    onSelect?: (item: ModelPickerItem) => void;
+    /** Drives the four bodies — see `modelPickerBody`. Default `"ready"`. */
+    status?: ModelPickerStatus;
+    /** Trigger text — usually the pinned row's label. */
+    triggerLabel: ReactNode;
+    /** Retry action for the error strip and the empty panel. Omit to hide it. */
+    onRetry?: () => void;
+    /** Search field placeholder. */
+    searchPlaceholder?: string;
+    disabled?: boolean;
+    /** Extra classes for the popover panel (default width `w-96`). */
+    contentClassName?: string;
+    /** Accessible name for the trigger — what the control is FOR, not what is chosen. */
+    "aria-label"?: string;
+    /**
+     * Controlled popover open state. Omit for the uncontrolled default (internal
+     * `useState(false)`, unchanged). `isControlled = open !== undefined` and the
+     * mode never flips mid-life — see `component-api.md` "Controlled/uncontrolled".
+     */
+    open?: boolean;
+    /** Fires whenever the popover would open/close — a trigger click, or a row select. */
+    onOpenChange?: (open: boolean) => void;
+}
+/**
+ * A compact pill that opens a grouped, searchable target list anchored under
+ * itself — sized to sit in a composer footer.
+ *
+ * The inline sibling of `@elabs-ai/components-ai`'s `ModelSelector`,
+ * which is the same `Command` internals in a modal `Dialog`. Reach for that one
+ * for a full command palette; reach for this one for an in-place picker.
+ *
+ * **`Command` lives inside a `Popover`, never a `DropdownMenu`, and that is not
+ * a stylistic choice.** `DropdownMenuContent` owns roving tabindex and its own
+ * typeahead, both of which fight a real `<input>` in its subtree: arrow keys move
+ * the menu's focus instead of cmdk's highlight, and keystrokes are swallowed
+ * before they reach `CommandInput`. `Popover` contributes positioning and
+ * dismissal and claims no keyboard, which is why every combobox is built on it.
+ * Do not "simplify" this back.
+ */
+declare const ModelPicker: react.ForwardRefExoticComponent<ModelPickerProps & react.RefAttributes<HTMLDivElement>>;
+
+/**
+ * compact-number.ts — the same "shown short, copied exact" number rule the
+ * charts package applies to axis ticks and tooltips, available to `ui` surfaces
+ * that display a figure (today: `MetricCard`).
+ *
+ * DELIBERATE TWIN of `packages/charts/src/charts/value-format.ts`. Dependencies
+ * flow one way — `tokens → ui → charts` — so `ui` cannot import the charts
+ * module, and a chart-domain union does not belong in the `ui` public API just
+ * to be shared. The duplication is ~20 lines and the two must stay in step:
+ * **change one, change the other**, and keep {@link COMPACT_THRESHOLD} equal in
+ * both. `metric-card.test.tsx` and `value-format.test.ts` pin the same cases on
+ * each side so a drift shows up as a failing test rather than as two surfaces
+ * disagreeing about what `1500` looks like.
+ */
+/** How a numeric value is rendered. Mirrors the charts `ChartValueFormat`. */
+type NumberFormatKind = "number" | "compact" | "currency" | "percent";
+
+declare const metricValueVariants: (props?: ({
+    emphasis?: "default" | "headline" | null | undefined;
+} & class_variance_authority_types.ClassProp) | undefined) => string;
+type MetricCardEmphasis = NonNullable<VariantProps<typeof metricValueVariants>["emphasis"]>;
+/**
+ * How a NUMERIC `value` is rendered. A function takes over completely.
+ *
+ * `"compact"` is the default because a KPI tile is a small box and
+ * `50012102.632741` does not fit in one — the exact figure stays one click
+ * away via `CopyableValue`. Anything that is not a `number` (a string, an
+ * element) is passed through untouched, so every existing call site is
+ * unaffected.
+ */
+type MetricCardValueFormat = NumberFormatKind | ((value: number) => ReactNode);
+interface MetricCardProps extends HTMLAttributes<HTMLDivElement>, VariantProps<typeof metricValueVariants> {
+    label: ReactNode;
+    value: ReactNode;
+    /**
+     * How to render a NUMERIC `value`. Default: `"compact"`. Ignored for every
+     * other `ReactNode` — a string you already formatted is rendered verbatim.
+     */
+    valueFormat?: MetricCardValueFormat;
+    /** ISO 4217 code for `valueFormat: "currency"`. Default: `"USD"`. */
+    currency?: string;
+    /**
+     * Offer the exact figure on click when a numeric `value` was shortened.
+     * Default: `true`. Turning it off leaves a compacted number with no way back
+     * to its digits, so only do that when the tile is decorative.
+     */
+    copyExactValue?: boolean;
+    /** Secondary line under the value — sublabel / context. */
+    description?: ReactNode;
+    /** Signed change, e.g. "+12.4%". Direction colors it. */
+    delta?: string;
+    deltaDirection?: "up" | "down" | "neutral";
+    /** Whether "up" is good (green) — flip for metrics where down is good. */
+    positiveIsGood?: boolean;
+    icon?: ReactNode;
+    /** Optional inline visual (e.g. a sparkline) shown under the value/description. */
+    visual?: ReactNode;
+    /**
+     * Optional grounding footer (research 11 §B.5 KPI-3) — connects a cited
+     * figure to its source (e.g. an `EvidenceChip` from `@elabs-ai/components-ai`). Rendered
+     * subdued (`text-meta text-muted-foreground`) under the tile body.
+     */
+    evidence?: ReactNode;
+    /**
+     * Loading vs ready — renders a layout-shaped skeleton (matching the real
+     * box height) instead of the value/label/delta text. Default: `false`.
+     */
+    loading?: boolean;
+    /**
+     * Whether this tile announces its own `loading` state via a live region.
+     * Set to `false` when several tiles are composed inside a container that
+     * already announces once for the whole region (e.g. a loading
+     * `MetricGrid`) — see loading-states.md §a11y ("one live region per
+     * region, not per box"). Default: `true`.
+     */
+    announceLoading?: boolean;
+}
+/** Compact KPI tile for dashboards. */
+declare const MetricCard: react.ForwardRefExoticComponent<MetricCardProps & react.RefAttributes<HTMLDivElement>>;
+
+type NavMainSubItem = {
+    title: string;
+    link: string;
+    icon?: react__default.ReactNode;
+};
+type NavMainRoute = {
+    id: string;
+    title: string;
+    icon?: react__default.ReactNode;
+    link: string;
+    subs?: NavMainSubItem[];
+};
+interface NavMainProps {
+    routes: NavMainRoute[];
+    className?: string;
+}
+/**
+ * Collapsible primary navigation list for sidebars.
+ *
+ * - Routes with `subs` render as an expandable group (one open at a time).
+ * - Routes without `subs` render as a simple link button.
+ * - Collapses to icon-only when the enclosing `Sidebar` is in `"collapsed"` state.
+ *
+ * @example
+ * ```tsx
+ * <NavMain routes={[
+ *   { id: "home", title: "Home", icon: <Home />, link: "#" },
+ *   { id: "settings", title: "Settings", icon: <Settings />, link: "#",
+ *     subs: [{ title: "General", link: "#" }] },
+ * ]} />
+ * ```
+ */
+declare function NavMain({ routes, className }: NavMainProps): react__default.JSX.Element;
+
+interface NavNotification {
+    id: string;
+    /** Two-letter fallback initials for the avatar. */
+    fallback: string;
+    text: string;
+    time: string;
+}
+interface NavNotificationsProps {
+    notifications: NavNotification[];
+    /** Label for the "view all" footer item. @default "View all notifications" */
+    viewAllLabel?: string;
+}
+/**
+ * Sidebar notifications dropdown button. Shared primitive from sidebar-02 (issue #99).
+ * Renders a bell-icon ghost button that opens a dropdown listing recent notifications.
+ */
+declare function NavNotifications({ notifications, viewAllLabel, }: NavNotificationsProps): react.JSX.Element;
+
+interface NavUserUser {
+    name: string;
+    email: string;
+    /** URL for the user's avatar image. */
+    avatar?: string;
+}
+interface NavUserProps {
+    user: NavUserUser;
+}
+/**
+ * Sidebar account / user menu. Shared primitive from sidebar-04 (issue #99).
+ * Renders a trigger showing name + email + avatar; the dropdown exposes
+ * account, billing, notifications and log-out actions.
+ *
+ * Wire your own action handlers by composing custom `DropdownMenuItem` children
+ * if you need more than the default actions — or extend via className.
+ */
+declare function NavUser({ user }: NavUserProps): react.JSX.Element;
+
+declare const NavigationMenu: react.ForwardRefExoticComponent<Omit<NavigationMenuPrimitive.NavigationMenuProps & react.RefAttributes<HTMLElement>, "ref"> & react.RefAttributes<HTMLElement>>;
+declare const NavigationMenuList: react.ForwardRefExoticComponent<Omit<NavigationMenuPrimitive.NavigationMenuListProps & react.RefAttributes<HTMLUListElement>, "ref"> & react.RefAttributes<HTMLUListElement>>;
+declare const NavigationMenuItem: react.ForwardRefExoticComponent<NavigationMenuPrimitive.NavigationMenuItemProps & react.RefAttributes<HTMLLIElement>>;
+declare const navigationMenuTriggerStyle: (props?: class_variance_authority_types.ClassProp | undefined) => string;
+declare const NavigationMenuTrigger: react.ForwardRefExoticComponent<Omit<NavigationMenuPrimitive.NavigationMenuTriggerProps & react.RefAttributes<HTMLButtonElement>, "ref"> & react.RefAttributes<HTMLButtonElement>>;
+declare const NavigationMenuContent: react.ForwardRefExoticComponent<Omit<NavigationMenuPrimitive.NavigationMenuContentProps & react.RefAttributes<HTMLDivElement>, "ref"> & react.RefAttributes<HTMLDivElement>>;
+declare const NavigationMenuLink: react.ForwardRefExoticComponent<NavigationMenuPrimitive.NavigationMenuLinkProps & react.RefAttributes<HTMLAnchorElement>>;
+declare const NavigationMenuViewport: react.ForwardRefExoticComponent<Omit<NavigationMenuPrimitive.NavigationMenuViewportProps & react.RefAttributes<HTMLDivElement>, "ref"> & react.RefAttributes<HTMLDivElement>>;
+
+interface PageShellProps {
+    children: ReactNode;
+    /** Optional header row (often a <SectionHeader />, or a <ViewToolbar> — see headerVariant). */
+    header?: ReactNode;
+    /**
+     * "default" (unset) — `header` renders inline, scrolls with the body.
+     * Byte-identical to today.
+     *
+     * "toolbar" — for a `<ViewToolbar>` header (`@elabs-ai/components-ui`,
+     * `Docs/View Toolbar Contract`): wraps `header` in a `sticky top-0` container
+     * with an opaque/blurred fill and a bottom hairline, so it stays pinned while
+     * the body scrolls beneath it. PLACES whatever node `header` is — it does not
+     * reimplement ViewToolbar's own info/left-cluster/actions grammar, and it does
+     * NOT cap the row's height (a `<ViewToolbar>` wraps at narrow widths; see
+     * `Docs/View Toolbar Contract` R7).
+     */
+    headerVariant?: "default" | "toolbar";
+    /** Constrain content width. Defaults to "xl". */
+    width?: "md" | "lg" | "xl" | "full";
+    className?: string;
+    contentClassName?: string;
+}
+/** Page-level content container with consistent padding and max width. */
+declare function PageShell({ children, header, headerVariant, width, className, contentClassName, }: PageShellProps): react.JSX.Element;
+
+declare function Pagination({ className, ...props }: ComponentProps<"nav">): react.JSX.Element;
+declare const PaginationContent: react.ForwardRefExoticComponent<Omit<react.DetailedHTMLProps<react.HTMLAttributes<HTMLUListElement>, HTMLUListElement>, "ref"> & react.RefAttributes<HTMLUListElement>>;
+declare const PaginationItem: react.ForwardRefExoticComponent<Omit<react.DetailedHTMLProps<react.LiHTMLAttributes<HTMLLIElement>, HTMLLIElement>, "ref"> & react.RefAttributes<HTMLLIElement>>;
+type PaginationLinkProps = {
+    isActive?: boolean;
+} & ComponentProps<"a">;
+declare function PaginationLink({ className, isActive, ...props }: PaginationLinkProps): react.JSX.Element;
+declare function PaginationPrevious({ className, ...props }: ComponentProps<"a">): react.JSX.Element;
+declare function PaginationNext({ className, ...props }: ComponentProps<"a">): react.JSX.Element;
+declare function PaginationEllipsis({ className, ...props }: ComponentProps<"span">): react.JSX.Element;
+
+/**
+ * Tone vocabulary reused from `StatusBadge`/`Alert` (success/warning/destructive
+ * on semantic tokens, #358) rather than reinvented. `default` keeps the fill
+ * byte-identical (`bg-primary`) when `variant` is unset.
+ */
+declare const progressIndicatorVariants: (props?: ({
+    variant?: "default" | "success" | "warning" | "destructive" | null | undefined;
+} & class_variance_authority_types.ClassProp) | undefined) => string;
+interface ProgressProps extends ComponentPropsWithoutRef<typeof ProgressPrimitive.Root>, VariantProps<typeof progressIndicatorVariants> {
+}
+/**
+ * Color must not be the only signal a guardrail tripped: set `aria-valuetext`
+ * (e.g. `"Exceeded — 120 of 100"`) alongside a non-`default` `variant` — it
+ * passes straight through to the underlying `role="progressbar"` element via
+ * `...props` (Radix's `ProgressPrimitive.Root` already supports it).
+ */
+declare const Progress: react.ForwardRefExoticComponent<ProgressProps & react.RefAttributes<HTMLDivElement>>;
+
+declare const RadioGroup: react.ForwardRefExoticComponent<Omit<RadioGroupPrimitive.RadioGroupProps & react.RefAttributes<HTMLDivElement>, "ref"> & react.RefAttributes<HTMLDivElement>>;
+declare const RadioGroupItem: react.ForwardRefExoticComponent<Omit<RadioGroupPrimitive.RadioGroupItemProps & react.RefAttributes<HTMLButtonElement>, "ref"> & react.RefAttributes<HTMLButtonElement>>;
+
+declare const ratingVariants: (props?: ({
+    size?: "md" | "sm" | "lg" | null | undefined;
+} & class_variance_authority_types.ClassProp) | undefined) => string;
+interface RatingProps extends Omit<HTMLAttributes<HTMLDivElement>, "onChange" | "defaultValue">, VariantProps<typeof ratingVariants> {
+    /** Controlled value (0..max). */
+    value?: number;
+    /** Uncontrolled default value (0..max). Default 0. */
+    defaultValue?: number;
+    /** Called when the rating changes. */
+    onValueChange?: (value: number) => void;
+    /** Number of stars. Default 5. */
+    max?: number;
+    /** Allow half-star values (0.5 increments). Default false. */
+    allowHalf?: boolean;
+    /** Render as a non-interactive display of the value. */
+    readOnly?: boolean;
+    /** Disable interaction (interactive variant only). */
+    disabled?: boolean;
+    /** Accessible name for the rating group. Default "Rating". */
+    "aria-label"?: string;
+}
+/**
+ * Rating — a star rating control.
+ *
+ * Controlled via `value`/`onValueChange`; uncontrolled via `defaultValue`.
+ * Interactive mode is a `radiogroup` (keyboard ←/→ adjust by `allowHalf ? 0.5 : 1`,
+ * Home clears, End sets max). `readOnly` renders a non-interactive `role="img"`
+ * summary. Half-star clicks land on the left/right half of a star when `allowHalf`.
+ */
+declare const Rating: react.ForwardRefExoticComponent<RatingProps & react.RefAttributes<HTMLDivElement>>;
+
+declare function ResizablePanelGroup({ className, ...props }: React.ComponentProps<typeof ResizablePrimitive.PanelGroup>): react.JSX.Element;
+declare const ResizablePanel: react.ForwardRefExoticComponent<Omit<react.HTMLAttributes<HTMLAnchorElement | HTMLElement | HTMLDivElement | HTMLObjectElement | HTMLTitleElement | HTMLBodyElement | HTMLMetaElement | HTMLParagraphElement | HTMLSelectElement | HTMLLinkElement | HTMLAreaElement | HTMLAudioElement | HTMLBaseElement | HTMLQuoteElement | HTMLBRElement | HTMLButtonElement | HTMLCanvasElement | HTMLTableColElement | HTMLDataElement | HTMLDataListElement | HTMLModElement | HTMLDetailsElement | HTMLDialogElement | HTMLDListElement | HTMLEmbedElement | HTMLFieldSetElement | HTMLFormElement | HTMLHeadingElement | HTMLHeadElement | HTMLHRElement | HTMLHtmlElement | HTMLIFrameElement | HTMLImageElement | HTMLInputElement | HTMLLabelElement | HTMLLegendElement | HTMLLIElement | HTMLMapElement | HTMLMeterElement | HTMLOListElement | HTMLOptGroupElement | HTMLOptionElement | HTMLOutputElement | HTMLPreElement | HTMLProgressElement | HTMLScriptElement | HTMLSlotElement | HTMLSourceElement | HTMLSpanElement | HTMLStyleElement | HTMLTableElement | HTMLTableSectionElement | HTMLTableCellElement | HTMLTemplateElement | HTMLTextAreaElement | HTMLTimeElement | HTMLTableRowElement | HTMLTrackElement | HTMLUListElement | HTMLVideoElement | HTMLTableCaptionElement | HTMLMenuElement | HTMLPictureElement>, "id" | "onResize"> & {
+    className?: string | undefined;
+    collapsedSize?: number | undefined;
+    collapsible?: boolean | undefined;
+    defaultSize?: number | undefined;
+    id?: string | undefined;
+    maxSize?: number | undefined;
+    minSize?: number | undefined;
+    onCollapse?: ResizablePrimitive.PanelOnCollapse | undefined;
+    onExpand?: ResizablePrimitive.PanelOnExpand | undefined;
+    onResize?: ResizablePrimitive.PanelOnResize | undefined;
+    order?: number | undefined;
+    style?: object | undefined;
+    tagName?: keyof HTMLElementTagNameMap | undefined;
+} & {
+    children?: react.ReactNode;
+} & react.RefAttributes<ResizablePrimitive.ImperativePanelHandle>>;
+declare function ResizableHandle({ withHandle, className, ...props }: React.ComponentProps<typeof ResizablePrimitive.PanelResizeHandle> & {
+    withHandle?: boolean;
+}): react.JSX.Element;
+
+/**
+ * Entrance-animation classes (tw-animate-css), gated by the motion system: the
+ * `duration-*` utility feeds `--tw-duration` (= the gated `--t-*`), so the
+ * reveal slows to ~0 when motion is reduced/off. `fill-mode-both` holds the
+ * start state through any stagger delay so items don't flash in early.
+ */
+declare const revealVariants: (props?: ({
+    appear?: "left" | "right" | "zoom" | "up" | "down" | "fade" | null | undefined;
+    speed?: "base" | "fast" | "slow" | null | undefined;
+} & class_variance_authority_types.ClassProp) | undefined) => string;
+interface RevealProps extends HTMLAttributes<HTMLDivElement>, VariantProps<typeof revealVariants> {
+    /** Animation delay in ms (RevealGroup sets this per child to stagger). */
+    delayMs?: number;
+}
+/**
+ * Animates its content in on mount (fade + directional slide/zoom). Gated by the
+ * motion system — no animation when motion is reduced/off. For a list/grid, use
+ * {@link RevealGroup} to stagger children.
+ */
+declare const Reveal: react.ForwardRefExoticComponent<RevealProps & react.RefAttributes<HTMLDivElement>>;
+interface RevealGroupProps extends HTMLAttributes<HTMLDivElement>, VariantProps<typeof revealVariants> {
+    /** Delay added per successive child, in ms. */
+    staggerMs?: number;
+}
+/**
+ * Staggers an entrance across direct children. Clones each child to add the
+ * reveal classes + an incremental `animation-delay` — no wrapper elements, so it
+ * is safe inside flex/grid layouts. Remount it (e.g. via a changing `key`) to
+ * replay. Gated by the motion system.
+ */
+declare const RevealGroup: react.ForwardRefExoticComponent<RevealGroupProps & react.RefAttributes<HTMLDivElement>>;
+
+declare const ScrollArea: react.ForwardRefExoticComponent<Omit<ScrollAreaPrimitive.ScrollAreaProps & react.RefAttributes<HTMLDivElement>, "ref"> & react.RefAttributes<HTMLDivElement>>;
+declare const ScrollBar: react.ForwardRefExoticComponent<Omit<ScrollAreaPrimitive.ScrollAreaScrollbarProps & react.RefAttributes<HTMLDivElement>, "ref"> & react.RefAttributes<HTMLDivElement>>;
+
+interface SectionHeaderProps {
+    title: ReactNode;
+    description?: ReactNode;
+    /** Right-aligned actions (buttons, menus). */
+    actions?: ReactNode;
+    /** Optional element rendered above the title (eyebrow / breadcrumbs). */
+    eyebrow?: ReactNode;
+    className?: string;
+}
+/** A consistent page/section heading row with optional actions. */
+declare function SectionHeader({ title, description, actions, eyebrow, className, }: SectionHeaderProps): react.JSX.Element;
+
+interface SegmentedFieldOption {
+    /** The option's value, reported to `onValueChange`. */
+    value: string;
+    /** Visible content for the segment. */
+    label: ReactNode;
+    /** Disables just this segment. */
+    disabled?: boolean;
+}
+interface SegmentedFieldProps extends Omit<HTMLAttributes<HTMLDivElement>, "onChange" | "defaultValue"> {
+    /** Visible label describing the field. */
+    label: ReactNode;
+    /**
+     * Segment options. Omit and render `ToggleGroupItem` children directly for
+     * the compound-component escape hatch (component-api.md) when a plain
+     * `{ value, label }` shape isn't expressive enough.
+     */
+    options?: SegmentedFieldOption[];
+    /** Controlled selected value. */
+    value?: string;
+    /** Uncontrolled initial selected value. */
+    defaultValue?: string;
+    /**
+     * Called when the selected value changes. Never called with `""` —
+     * re-clicking the active segment (Radix `ToggleGroup`'s `type="single"`
+     * empty-emission on re-click) is swallowed as a no-op instead of clearing
+     * the field.
+     */
+    onValueChange?: (value: string) => void;
+    /** Size applied to every segment. Defaults to "sm", matching the compact segmented look. */
+    size?: "default" | "sm" | "lg";
+    /** Disables every segment. */
+    disabled?: boolean;
+    /** `ToggleGroupItem` children — the compound escape hatch (used instead of `options`). */
+    children?: ReactNode;
+}
+/**
+ * SegmentedField — a labelled segmented control with STICKY selection.
+ *
+ * Composes the existing `Label` + `ToggleGroup`/`ToggleGroupItem`
+ * (`variant="segmented"`) — no new visual style. The whole reason this
+ * component exists: Radix's `ToggleGroup` in `type="single"` mode emits `""`
+ * when the already-active segment is re-clicked, silently clearing a field
+ * that must always hold exactly one value. `SegmentedField` swallows that
+ * emission so re-clicking the active segment is a true no-op.
+ *
+ * Per the WAI-ARIA radiogroup pattern (each segment renders `role="radio"`
+ * for `type="single"`), ARROW-KEY navigation also SELECTS the newly focused
+ * segment (selection follows focus), matching native radio-button behavior —
+ * Radix's roving-tabindex only moves focus, so this component adds that
+ * activation on top of it.
+ *
+ * Selection follows focus ONLY for arrow/Home/End keys, never for arbitrary
+ * focus. A bare `onFocus` commit would make three non-navigation paths mutate
+ * the field: clicking the `<Label>` (which moves focus into the group),
+ * tabbing into a group with nothing selected yet, and any programmatic
+ * `.focus()` a consumer performs. The keyboard intent is recorded on the
+ * wrapper in the CAPTURE phase (it must land before Radix's own roving-focus
+ * keydown handler runs) and is cleared by the focus it explains, by a pointer
+ * press, by any non-navigation key, or by focus leaving the field — so it can
+ * never leak into a later, unrelated focus.
+ */
+declare const SegmentedField: react.ForwardRefExoticComponent<SegmentedFieldProps & react.RefAttributes<HTMLDivElement>>;
+
+declare const Select: react.FC<SelectPrimitive.SelectProps>;
+declare const SelectGroup: react.ForwardRefExoticComponent<SelectPrimitive.SelectGroupProps & react.RefAttributes<HTMLDivElement>>;
+declare const SelectValue: react.ForwardRefExoticComponent<SelectPrimitive.SelectValueProps & react.RefAttributes<HTMLSpanElement>>;
+/**
+ * `[&>span]:line-clamp-1` clips the rendered `SelectValue` — necessary so a
+ * long/composed label doesn't blow out the trigger's width. To keep clipped
+ * text recoverable, the trigger MEASURES its content and sets a native `title`
+ * only while something is genuinely cut off, so it's readable on mouse hover
+ * with zero extra code.
+ *
+ * The measurement is not cosmetic: an unconditional `title` becomes the
+ * button's accessible name, which would paper over a real "this combobox has
+ * no name" a11y failure with the field's own VALUE — a value is not a name.
+ * Label the trigger properly (`aria-label`/`aria-labelledby`) regardless.
+ *
+ * `title` also never reaches keyboard users — for that, wrap the trigger in
+ * `Tooltip`/`TooltipTrigger asChild`/`TooltipContent` and pass
+ * `autoTitle={false}` (see the `LongComposedLabel` story), which Radix opens
+ * on keyboard focus too.
+ */
+declare const SelectTrigger: react.ForwardRefExoticComponent<Omit<SelectPrimitive.SelectTriggerProps & react.RefAttributes<HTMLButtonElement>, "ref"> & {
+    size?: "sm" | "default";
+    /**
+     * Auto-set a native `title` from the trigger's rendered text — but ONLY
+     * while that text is actually clipped (default `true`).
+     *
+     * Set `false` when the trigger is a `TooltipTrigger`: the native tooltip and
+     * the Radix one would otherwise both appear on hover. A caller-supplied
+     * `title` also disables it (an explicit `title` is never overridden).
+     */
+    autoTitle?: boolean;
+} & react.RefAttributes<HTMLButtonElement>>;
+declare const SelectContent: react.ForwardRefExoticComponent<Omit<SelectPrimitive.SelectContentProps & react.RefAttributes<HTMLDivElement>, "ref"> & react.RefAttributes<HTMLDivElement>>;
+declare const SelectLabel: react.ForwardRefExoticComponent<Omit<SelectPrimitive.SelectLabelProps & react.RefAttributes<HTMLDivElement>, "ref"> & react.RefAttributes<HTMLDivElement>>;
+declare const SelectItem: react.ForwardRefExoticComponent<Omit<SelectPrimitive.SelectItemProps & react.RefAttributes<HTMLDivElement>, "ref"> & react.RefAttributes<HTMLDivElement>>;
+declare const SelectSeparator: react.ForwardRefExoticComponent<Omit<SelectPrimitive.SelectSeparatorProps & react.RefAttributes<HTMLDivElement>, "ref"> & react.RefAttributes<HTMLDivElement>>;
+
+declare const separatorVariants: (props?: ({
+    tone?: "strong" | "subtle" | null | undefined;
+} & class_variance_authority_types.ClassProp) | undefined) => string;
+type SeparatorProps = ComponentPropsWithoutRef<typeof _radix_ui_react_separator.Root> & VariantProps<typeof separatorVariants>;
+declare const Separator: react.ForwardRefExoticComponent<Omit<_radix_ui_react_separator.SeparatorProps & react.RefAttributes<HTMLDivElement>, "ref"> & VariantProps<(props?: ({
+    tone?: "strong" | "subtle" | null | undefined;
+} & class_variance_authority_types.ClassProp) | undefined) => string> & react.RefAttributes<HTMLDivElement>>;
+
+declare const Sheet: react.FC<DialogPrimitive.DialogProps>;
+declare const SheetTrigger: react.ForwardRefExoticComponent<DialogPrimitive.DialogTriggerProps & react.RefAttributes<HTMLButtonElement>>;
+declare const SheetClose: react.ForwardRefExoticComponent<DialogPrimitive.DialogCloseProps & react.RefAttributes<HTMLButtonElement>>;
+declare const SheetPortal: react.FC<DialogPrimitive.DialogPortalProps>;
+declare const sheetVariants: (props?: ({
+    side?: "bottom" | "left" | "right" | "top" | null | undefined;
+} & class_variance_authority_types.ClassProp) | undefined) => string;
+interface SheetContentProps extends ComponentPropsWithoutRef<typeof DialogPrimitive.Content>, VariantProps<typeof sheetVariants> {
+}
+declare const SheetContent: react.ForwardRefExoticComponent<SheetContentProps & react.RefAttributes<HTMLDivElement>>;
+declare function SheetHeader({ className, ...props }: HTMLAttributes<HTMLDivElement>): react.JSX.Element;
+declare function SheetFooter({ className, ...props }: HTMLAttributes<HTMLDivElement>): react.JSX.Element;
+declare const SheetTitle: react.ForwardRefExoticComponent<Omit<DialogPrimitive.DialogTitleProps & react.RefAttributes<HTMLHeadingElement>, "ref"> & react.RefAttributes<HTMLHeadingElement>>;
+declare const SheetDescription: react.ForwardRefExoticComponent<Omit<DialogPrimitive.DialogDescriptionProps & react.RefAttributes<HTMLParagraphElement>, "ref"> & react.RefAttributes<HTMLParagraphElement>>;
+
+type SkeletonProps = HTMLAttributes<HTMLDivElement>;
+/** Loading placeholder. Compose with width/height utilities, e.g. `h-4 w-32`. */
+declare function Skeleton({ className, ...props }: SkeletonProps): react.JSX.Element;
+
+/** Props for a single `SliderPrimitive.Thumb` — see `SliderProps["thumbProps"]`. */
+type SliderThumbProps = ComponentPropsWithoutRef<typeof SliderPrimitive.Thumb>;
+type SliderProps = ComponentPropsWithoutRef<typeof SliderPrimitive.Root> & {
+    /**
+     * Announced instead of the raw numeric value (e.g. `"step 3 of 12"` for a
+     * replay scrubber). Forwarded to the thumb alongside `aria-label`/
+     * `aria-labelledby` — see the doc comment below for why it has to land
+     * there, not on the root.
+     */
+    "aria-valuetext"?: string;
+    /**
+     * Escape hatch spread onto the thumb LAST — for `data-*`/`style`/etc, or to
+     * deliberately override `aria-label`/`aria-labelledby`/`aria-valuetext`
+     * (an explicit key here always wins over the matching top-level prop).
+     *
+     * The six keys that MAKE the element a slider are ignored on purpose:
+     * `role`, `aria-valuenow`, `aria-valuemin`, `aria-valuemax`,
+     * `aria-orientation` and `tabIndex`. Radix derives every one of them from
+     * the slider's live state and spreads consumer props AFTER its own, so
+     * passing them here would silently destroy the widget (a wrong
+     * `aria-valuenow` mis-announces the value; `role`/`tabIndex` make it
+     * unreachable). Change the VALUE (`value`/`min`/`max`/`orientation`/
+     * `disabled`) on `Slider` instead; use `aria-valuetext` to change how the
+     * value is spoken.
+     *
+     * Radix renders one thumb per element of `value`/`defaultValue` — pass a
+     * single object to apply the same props to every thumb (the historical
+     * single-thumb shape, unchanged), or an ARRAY to give each thumb its own
+     * props, indexed positionally against `value`/`defaultValue` (#398). A
+     * missing array slot falls back to no per-thumb override for that thumb.
+     */
+    thumbProps?: SliderThumbProps | SliderThumbProps[];
+};
+/**
+ * Range input — a single-thumb value by default, or a multi-thumb range
+ * slider when `value`/`defaultValue` is an array with more than one element
+ * (Radix's own range-slider shape; #398). One `Thumb` is rendered per value.
+ *
+ * `aria-label` / `aria-labelledby` / `aria-valuetext` are routed to the
+ * THUMB(S), not the root: Radix puts `role="slider"` on the thumb, so a name
+ * (or value text) on the root would never reach the widget. Pass `aria-label`
+ * (or `aria-labelledby`, for a visible `<Label>`) — an unnamed slider is an
+ * accessibility failure. For a range slider, pass an ARRAY to `thumbProps` so
+ * each thumb gets its own name/valuetext (e.g. "Minimum price"/"Maximum
+ * price") — the top-level `aria-label`/`aria-valuetext` apply identically to
+ * every thumb, which is rarely what a multi-thumb slider wants.
+ */
+declare const Slider: react.ForwardRefExoticComponent<Omit<SliderPrimitive.SliderProps & react.RefAttributes<HTMLSpanElement>, "ref"> & {
+    /**
+     * Announced instead of the raw numeric value (e.g. `"step 3 of 12"` for a
+     * replay scrubber). Forwarded to the thumb alongside `aria-label`/
+     * `aria-labelledby` — see the doc comment below for why it has to land
+     * there, not on the root.
+     */
+    "aria-valuetext"?: string;
+    /**
+     * Escape hatch spread onto the thumb LAST — for `data-*`/`style`/etc, or to
+     * deliberately override `aria-label`/`aria-labelledby`/`aria-valuetext`
+     * (an explicit key here always wins over the matching top-level prop).
+     *
+     * The six keys that MAKE the element a slider are ignored on purpose:
+     * `role`, `aria-valuenow`, `aria-valuemin`, `aria-valuemax`,
+     * `aria-orientation` and `tabIndex`. Radix derives every one of them from
+     * the slider's live state and spreads consumer props AFTER its own, so
+     * passing them here would silently destroy the widget (a wrong
+     * `aria-valuenow` mis-announces the value; `role`/`tabIndex` make it
+     * unreachable). Change the VALUE (`value`/`min`/`max`/`orientation`/
+     * `disabled`) on `Slider` instead; use `aria-valuetext` to change how the
+     * value is spoken.
+     *
+     * Radix renders one thumb per element of `value`/`defaultValue` — pass a
+     * single object to apply the same props to every thumb (the historical
+     * single-thumb shape, unchanged), or an ARRAY to give each thumb its own
+     * props, indexed positionally against `value`/`defaultValue` (#398). A
+     * missing array slot falls back to no per-thumb override for that thumb.
+     */
+    thumbProps?: SliderThumbProps | SliderThumbProps[];
+} & react.RefAttributes<HTMLSpanElement>>;
+
+interface SliderNumberProps extends Omit<HTMLAttributes<HTMLDivElement>, "onChange" | "defaultValue"> {
+    /** Controlled value. Pass `null` for "use the provider default". */
+    value?: number | null;
+    /** Uncontrolled initial value. */
+    defaultValue?: number | null;
+    /** Called when the value changes — always rounded identically on the drag and type paths. */
+    onValueChange?: (value: number | null) => void;
+    /** Minimum allowed value. Defaults to 0. */
+    min?: number;
+    /** Maximum allowed value. Defaults to 100. */
+    max?: number;
+    /** Step increment for both the slider and the number input's arrow keys. Defaults to 1. */
+    step?: number;
+    /**
+     * Number of decimal places to round to. Defaults to the decimal places in
+     * `step` (e.g. `step={0.1}` rounds to 1 decimal). Applied identically on
+     * BOTH the slider path and the number-input path so drag-then-type never
+     * disagrees.
+     */
+    precision?: number;
+    /** Label for the reset-to-provider-default control. Defaults to "Reset". */
+    resetLabel?: ReactNode;
+    /** Disables the whole control. */
+    disabled?: boolean;
+    id?: string;
+    name?: string;
+    "aria-label"?: string;
+    "aria-labelledby"?: string;
+}
+/**
+ * SliderNumber — a `Slider` and a `NumberInput` bound to one value, clamped
+ * and rounded in lockstep so they can never disagree, plus an explicit
+ * `null` state meaning "use the provider default" with a reset control.
+ *
+ * The subtle part (#372): both the slider's `onValueChange` and the number
+ * input's `onValueChange` are routed through the SAME `commit` function,
+ * which rounds to a fixed decimal precision before storing — so dragging to
+ * a value and then typing the same value never produces two representations
+ * of the same intent (e.g. floating-point drift like `0.30000000000000004`).
+ */
+declare const SliderNumber: react.ForwardRefExoticComponent<SliderNumberProps & react.RefAttributes<HTMLDivElement>>;
+
+type ToasterProps = React.ComponentProps<typeof Toaster$1>;
+/**
+ * Toast host. Mount once near the app root. Trigger toasts with the exported
+ * `toast()`. Theme follows the active brand theme (via `data-theme`), so it
+ * works with or without <ThemeProvider>.
+ *
+ * ## Customizing toast styling
+ *
+ * The Toaster wrapper renders with the classes `toaster group` by default.
+ * These classes are **merged** with any consumer-supplied `className`, not
+ * replaced, so that built-in styling (the `.group-[.toaster]:*` selectors
+ * on individual toasts) continues to work.
+ *
+ * To override a built-in toast class, **mirror the variant prefix** when you
+ * pass `toastOptions.classNames`. Built-in toast classes are variant-scoped
+ * (e.g. `group-[.toaster]:bg-card`), so a bare utility override will be
+ * outspecificity'd by the built-in and appear to do nothing. Instead, use:
+ *
+ * ```tsx
+ * <Toaster
+ *   toastOptions={{
+ *     classNames: {
+ *       toast: "group-[.toaster]:bg-primary",  // ✓ mirrors the prefix
+ *     }
+ *   }}
+ * />
+ * ```
+ *
+ * ## Theme handling
+ *
+ * The Toaster's `theme` prop is automatically set from the active theme's own
+ * `color-scheme` declaration, so toasts visually track the app's theme by
+ * default — including a theme you authored yourself. However, you may pass
+ * `theme="light"` or `theme="dark"` directly to override this derivation if needed.
+ */
+declare function Toaster({ className, toastOptions, ...rest }: ToasterProps): react.JSX.Element;
+
+interface SpinnerProps extends React.SVGProps<SVGSVGElement> {
+    /** Accessible label; defaults to "Loading". */
+    label?: string;
+}
+/** Indeterminate spinner with an accessible label. */
+declare function Spinner({ className, label, ...props }: SpinnerProps): react.JSX.Element;
+
+declare const statePanelVariants: (props?: ({
+    kind?: "error" | "loading" | "empty" | null | undefined;
+} & class_variance_authority_types.ClassProp) | undefined) => string;
+interface StatePanelProps extends VariantProps<typeof statePanelVariants> {
+    /**
+     * The visual/semantic kind of state.
+     * - `"empty"` — neutral "nothing here yet" (dashed border, surface bg).
+     * - `"error"` — recoverable failure (destructive border/bg, alert role).
+     * - `"loading"` — in-progress (spinner, status/live-region role).
+     */
+    kind?: "empty" | "error" | "loading";
+    /** Heading text. */
+    title?: ReactNode;
+    /** Supporting description below the title. */
+    description?: ReactNode;
+    /**
+     * Icon or illustration shown above the title.
+     * For `"error"` defaults to a built-in warning triangle.
+     * For `"loading"` defaults to an animated spinner.
+     */
+    icon?: ReactNode;
+    /** Accessible label for the spinner in loading state. @default "Loading…" */
+    loadingLabel?: string;
+    /** Spinner size (loading kind only). @default "md" */
+    size?: "sm" | "md" | "lg";
+    /** Primary / secondary action buttons. */
+    actions?: ReactNode;
+    className?: string;
+}
+/**
+ * Unified state panel covering empty, error, and loading states.
+ * Replaces the three separate `EmptyState` / `ErrorState` / `LoadingState` components
+ * while keeping those as back-compat thin wrappers.
+ */
+declare function StatePanel({ kind, title, description, icon, loadingLabel, size, actions, className, }: StatePanelProps): react.JSX.Element;
+
+/** The canonical, closed 7-state status enum (research 10 §B.1). */
+declare const STATUSES: readonly ["pending", "running", "complete", "awaiting-approval", "denied", "failed", "skipped"];
+type Status = (typeof STATUSES)[number];
+/** Closed tone set for the out-of-vocabulary escape hatch (CALM treatments only). */
+declare const STATUS_TONES: readonly ["neutral", "info", "success", "warning", "destructive"];
+type StatusTone = (typeof STATUS_TONES)[number];
+/**
+ * An out-of-vocabulary status. Prefer the canonical `Status` enum; reach for
+ * this only when the domain genuinely has a state the 7 do not express (e.g. a
+ * run engine's `stopped_guardrail`). Map it ONCE, near your domain — not per
+ * call site.
+ */
+interface CustomStatus {
+    label: string;
+    tone: StatusTone;
+    /** Optional Lucide glyph. Omitted → label-only (no default glyph). */
+    icon?: LucideIcon;
+}
+/** Narrows `Status | CustomStatus` — the object form is always the escape hatch. */
+declare function isCustomStatus(status: Status | CustomStatus): status is CustomStatus;
+/**
+ * The canonical semantic ROLE per status — the single source of truth for
+ * status colour (#392). Any other status-keyed colour map in the repo
+ * (`Timeline`'s `NODE_STYLE`, or a future one) must be TESTED against this,
+ * not hand-authored — a second literal copy is exactly how `NODE_STYLE`
+ * drifted (`running` rendered `--primary` while this map said `--info`).
+ * Do NOT interpolate `bg-${STATUS_ROLE[status]}` into a class map: Tailwind
+ * scans source statically, so a template-literal class emits no CSS. Keep
+ * consuming maps as literal class strings, verified against this export by a
+ * test.
+ */
+declare const STATUS_ROLE: {
+    readonly pending: "secondary";
+    readonly running: "info";
+    readonly complete: "success";
+    readonly "awaiting-approval": "warning";
+    readonly denied: "muted";
+    readonly failed: "destructive";
+    readonly skipped: "secondary";
+};
+/** Default human-readable label per status (override via `children`). */
+declare const STATUS_LABELS: Record<Status, string>;
+/**
+ * Lucide glyph per out-of-vocabulary TONE — the same five-tone escape hatch
+ * `CustomStatus` uses (`STATUS_TONES`). A consumer that encodes a bare TONE
+ * with no fuller `Status` semantics (e.g. `@elabs-ai/components-flow`'s `FlowNode.tone`,
+ * #387) derives its non-colour cue from here instead of inventing a second
+ * icon vocabulary — each entry reuses the SAME icon `STATUS_ICONS` already
+ * pairs with that tone's one canonical status (`success`→`complete`'s
+ * `CheckCircle2`, `warning`→`awaiting-approval`'s `Clock`,
+ * `destructive`→`failed`'s `AlertCircle`). `neutral`/`info` have no entry:
+ * nothing consumes them yet, and reaching for a glyph on every neutral/
+ * default-toned element would be assistive-tech noise on the common case —
+ * extend this map, don't fork a new one, the day something needs them.
+ */
+declare const STATUS_TONE_ICONS: Partial<Record<StatusTone, LucideIcon>>;
+interface StatusIconProps extends Omit<LucideProps, "ref"> {
+    /** The canonical execution status (closed enum). */
+    status: Status;
+}
+/**
+ * The icon + status-color atom `StatusBadge` itself composes — for tight rows
+ * (test-result rows, timeline/rail nodes) where a full badge is too heavy.
+ * Decorative by default (`aria-hidden`); the adjacent row text must carry the
+ * status name for AT users.
+ */
+declare const StatusIcon: react.ForwardRefExoticComponent<StatusIconProps & react.RefAttributes<SVGSVGElement>>;
+declare const statusBadgeVariants: (props?: ({
+    status?: "running" | "pending" | "complete" | "awaiting-approval" | "denied" | "failed" | "skipped" | null | undefined;
+    tone?: "success" | "warning" | "destructive" | "info" | "neutral" | null | undefined;
+    size?: "md" | "sm" | null | undefined;
+} & class_variance_authority_types.ClassProp) | undefined) => string;
+interface StatusBadgeProps extends HTMLAttributes<HTMLSpanElement>, Omit<VariantProps<typeof statusBadgeVariants>, "status" | "tone"> {
+    /** The canonical execution status, or a mapped out-of-vocabulary one (#363). */
+    status: Status | CustomStatus;
+    /** Render label-only (no status icon). */
+    hideIcon?: boolean;
+}
+declare const StatusBadge: react.ForwardRefExoticComponent<StatusBadgeProps & react.RefAttributes<HTMLSpanElement>>;
+/** The editor/markdown `Timeline` 3-state vocabulary (`@elabs-ai/components-editor`). */
+type TimelineStatus = "done" | "active" | "pending";
+/**
+ * Map the Timeline `done|active|pending` vocabulary onto the canonical
+ * `Status` (research 10 §B.1 mapping b — lossless; the timeline only
+ * expresses 3 of the 7 states). The AI-SDK `ToolUIPart` mapper lives in
+ * `@elabs-ai/components-ai` (`statusFromToolState`, tool.tsx) so `@elabs-ai/components-ui` stays free of
+ * the `ai` dependency (D6).
+ */
+declare function fromTimelineStatus(status: TimelineStatus): Status;
+
+/**
+ * Per-pane surface tone — the ground-offset tiering axis (research 08 §H, #193).
+ * `plain` keeps the ambient ground (default; non-breaking). `card` RAISES the pane as
+ * a white `bg-card` + `shadow-sm` and is robust across all three themes — a card is
+ * lighter than the page ground in BOTH light and dark, so it always reads as raised.
+ * `muted` (`bg-surface-muted`) reads as a recessed well ONLY in light themes; in dark
+ * themes `--surface-muted` is lighter than `--card`, so a `muted` pane reads as a faint
+ * raised tint, not a recess (dark-mode layering only goes UP — there is no surface below
+ * the page ground). For a guaranteed cross-theme raise/recess contrast, raise the focus
+ * pane with `card` and leave the other `plain`.
+ */
+declare const paneToneVariants: (props?: ({
+    tone?: "card" | "muted" | "plain" | null | undefined;
+} & class_variance_authority_types.ClassProp) | undefined) => string;
+type SplitPanelTone = NonNullable<VariantProps<typeof paneToneVariants>["tone"]>;
+interface SplitPanelProps {
+    start: ReactNode;
+    end: ReactNode;
+    /** Layout axis. Defaults to "horizontal" (side-by-side). */
+    direction?: "horizontal" | "vertical";
+    /**
+     * Size of the START pane as a CSS grid track (e.g. "320px", "40%", "1fr").
+     * The END pane fills the remainder. Defaults to "1fr" (equal split).
+     */
+    startSize?: string;
+    /** Show a thin divider between panes. Defaults to true. */
+    divider?: boolean;
+    /** Surface tone of the START pane (ground-offset tiering). Defaults to "plain". */
+    startTone?: SplitPanelTone;
+    /** Surface tone of the END pane (ground-offset tiering). Defaults to "plain". */
+    endTone?: SplitPanelTone;
+    className?: string;
+    startClassName?: string;
+    endClassName?: string;
+}
+/**
+ * Two-pane layout for master/detail, editor/preview and inspector workflows.
+ * Static sizing by design (predictable in tests/SSR); for drag-to-resize wrap
+ * with a resize hook or compose `react-resizable-panels` at the app level.
+ *
+ * For a master/detail surface where the detail should read as a raised card on a
+ * recessed list, use `startTone="muted" endTone="card"` (ground-offset tiering).
+ */
+declare function SplitPanel({ start, end, direction, startSize, divider, startTone, endTone, className, startClassName, endClassName, }: SplitPanelProps): react.JSX.Element;
+
+declare const Switch: react.ForwardRefExoticComponent<Omit<SwitchPrimitive.SwitchProps & react.RefAttributes<HTMLButtonElement>, "ref"> & react.RefAttributes<HTMLButtonElement>>;
+
+declare const Table: react.ForwardRefExoticComponent<HTMLAttributes<HTMLTableElement> & react.RefAttributes<HTMLTableElement>>;
+declare const TableHeader: react.ForwardRefExoticComponent<HTMLAttributes<HTMLTableSectionElement> & react.RefAttributes<HTMLTableSectionElement>>;
+declare const TableBody: react.ForwardRefExoticComponent<HTMLAttributes<HTMLTableSectionElement> & react.RefAttributes<HTMLTableSectionElement>>;
+declare const TableFooter: react.ForwardRefExoticComponent<HTMLAttributes<HTMLTableSectionElement> & react.RefAttributes<HTMLTableSectionElement>>;
+declare const TableRow: react.ForwardRefExoticComponent<HTMLAttributes<HTMLTableRowElement> & react.RefAttributes<HTMLTableRowElement>>;
+declare const TableHead: react.ForwardRefExoticComponent<ThHTMLAttributes<HTMLTableCellElement> & react.RefAttributes<HTMLTableCellElement>>;
+declare const TableCell: react.ForwardRefExoticComponent<TdHTMLAttributes<HTMLTableCellElement> & react.RefAttributes<HTMLTableCellElement>>;
+declare const TableCaption: react.ForwardRefExoticComponent<HTMLAttributes<HTMLTableCaptionElement> & react.RefAttributes<HTMLTableCaptionElement>>;
+
+declare const Tabs: react.ForwardRefExoticComponent<TabsPrimitive.TabsProps & react.RefAttributes<HTMLDivElement>>;
+/**
+ * `overflow-x-auto` + `max-w-full` turn an overflowing tab strip into a
+ * scroll container instead of silently clipping it — a bare `inline-flex`
+ * has no bound on this element's own width, so without `max-w-full` it would
+ * just grow past its parent instead of scrolling. `justify-center-safe`
+ * (not `justify-center`) is required too: plain `justify-center` strands the
+ * first tab off the left edge once the set overflows; `safe` falls back to
+ * start-alignment on overflow while staying visually identical when the
+ * strip fits (see #344).
+ */
+declare const TabsList: react.ForwardRefExoticComponent<Omit<TabsPrimitive.TabsListProps & react.RefAttributes<HTMLDivElement>, "ref"> & react.RefAttributes<HTMLDivElement>>;
+declare const TabsTrigger: react.ForwardRefExoticComponent<Omit<TabsPrimitive.TabsTriggerProps & react.RefAttributes<HTMLButtonElement>, "ref"> & react.RefAttributes<HTMLButtonElement>>;
+declare const TabsContent: react.ForwardRefExoticComponent<Omit<TabsPrimitive.TabsContentProps & react.RefAttributes<HTMLDivElement>, "ref"> & react.RefAttributes<HTMLDivElement>>;
+
+interface TagInputProps extends Omit<HTMLAttributes<HTMLDivElement>, "defaultValue" | "onChange"> {
+    /** Controlled tag list. */
+    value?: string[];
+    /** Uncontrolled initial tag list. */
+    defaultValue?: string[];
+    /** Called when the tag list changes. */
+    onValueChange?: (value: string[]) => void;
+    /** Maximum number of tags allowed. */
+    max?: number;
+    /**
+     * Validate a candidate tag before it is added.
+     * Return `true` to accept, `false` to silently reject, or a string
+     * to reject and show as an inline error message.
+     */
+    validate?: (tag: string) => boolean | string;
+    /**
+     * Characters (or strings) that trigger tag creation in addition to Enter.
+     * Defaults to `[","]`.
+     */
+    delimiter?: string[];
+    /** Allow duplicate tags (default false). */
+    allowDuplicates?: boolean;
+    /** Placeholder text for the entry field. */
+    placeholder?: string;
+    /** Whether the input is disabled. */
+    disabled?: boolean;
+    /** id for the underlying text input (useful for external <label>). */
+    id?: string;
+    /** Name forwarded to the underlying input. */
+    name?: string;
+    /** aria-label for the underlying text input. */
+    "aria-label"?: string;
+    /** aria-labelledby for the underlying text input. */
+    "aria-labelledby"?: string;
+}
+/**
+ * TagInput — chip-style multi-value text entry.
+ *
+ * Controlled via `value`/`onValueChange`; uncontrolled via `defaultValue`.
+ * Enter + configurable delimiters (default `[","]`) add a tag.
+ * Backspace on an empty field removes the last tag.
+ * Inline validation errors render with `role="alert"`.
+ */
+declare const TagInput: react.ForwardRefExoticComponent<TagInputProps & react.RefAttributes<HTMLDivElement>>;
+
+type TeamSwitcherTeam = {
+    name: string;
+    logo: react.ElementType;
+    plan: string;
+};
+interface TeamSwitcherProps {
+    teams: TeamSwitcherTeam[];
+    /**
+     * Tailwind class for the active-team logo container background.
+     * @default "bg-sidebar-accent text-sidebar-accent-foreground"
+     */
+    logoClassName?: string;
+    className?: string;
+}
+/**
+ * Sidebar team/workspace switcher. Shared primitive reconciled from sidebar-02
+ * and sidebar-05 blocks (issue #99). Copy-owned blocks should import this
+ * instead of maintaining local duplicates.
+ */
+declare function TeamSwitcher({ teams, logoClassName, className }: TeamSwitcherProps): react.JSX.Element | null;
+
+/** Whole-screen reveal effects for the animated theme switch (View Transitions API). */
+type ThemeTransitionEffect = "polygon" | "circle" | "circle-blur" | "triangle";
+/**
+ * Returns a theme setter that animates the whole-screen switch via the View
+ * Transitions API (the chanhdai.com "theme toggle effect", adapted to brand-ui).
+ *
+ * - Direction-aware: sets `data-vt="to-dark|to-light"` on `<html>` from the
+ *   target theme's `dark` flag, so the clip-path wipes the right way for ANY of
+ *   the three themes (not just light/dark).
+ * - `data-vt-effect` selects the reveal shape (default "polygon").
+ * - Motion-aware: under `useReducedMotion()` (OS or in-app preference) — or when
+ *   the browser lacks `startViewTransition` — it falls back to an instant,
+ *   unanimated `setTheme`.
+ *
+ * The visual is pure CSS on `::view-transition-*` in `@elabs-ai/components-tokens` themes.css;
+ * this hook only orchestrates it.
+ */
+declare function useThemeTransition(effect?: ThemeTransitionEffect): (next: ThemeName) => void;
+
+type ButtonSize = "sm" | "default" | "lg";
+/** A theme choice, or "system" to follow the OS color scheme. */
+type ThemePreference = ThemeName | "system";
+interface ThemeSwitcherProps extends Omit<HTMLAttributes<HTMLButtonElement>, "onChange"> {
+    /**
+     * Themes to offer, as names. ≤2 → toggle; >2 → dropdown.
+     *
+     * Defaults to the PROVIDER's registry (ADR 0029) — so an app that registers
+     * its own themes gets a working switcher with no prop at all. Pass this only
+     * to offer a subset, or to fix the order; names the provider doesn't know are
+     * dropped.
+     */
+    themes?: ThemeName[];
+    /** Force presentation; "auto" (default) picks toggle vs dropdown by theme count. */
+    mode?: "auto" | "toggle" | "dropdown";
+    /** Offer a "System" option that follows the OS color scheme. Default true. */
+    showSystem?: boolean;
+    /** Whole-screen reveal effect for the animated switch. Default "polygon". */
+    effect?: ThemeTransitionEffect;
+    /** Control size. Default "default". */
+    size?: ButtonSize;
+    /**
+     * Controlled preference (#366). When set, the switcher derives its "current"
+     * state — including "system" — from this prop instead of its own internal,
+     * `localStorage`-backed state, and reports every user pick via
+     * `onPreferenceChange` instead of writing its own storage key. Pass this pair
+     * when your app's actual source of truth is a different persisted preference
+     * (a settings API, a different storage key, a server-synced setting). Omit
+     * both for the default, uncontrolled behavior (unchanged).
+     */
+    preference?: ThemePreference;
+    /** Called with the new preference on every user pick, when `preference` is controlled. */
+    onPreferenceChange?: (preference: ThemePreference) => void;
+}
+/**
+ * Adaptive theme control. With ≤2 themes it renders a light/dark/system toggle
+ * (a single icon button that cycles); with >2 it auto-upgrades to a dropdown
+ * over the offered themes. Every switch animates the whole screen via
+ * `useThemeTransition` (respecting reduced motion). Icons follow each theme's
+ * `dark` flag, so it works for any theme — including one you authored.
+ *
+ * Uncontrolled by default (tracks its own "system" choice via `localStorage`).
+ * Pass `preference`/`onPreferenceChange` to drive it from an external store
+ * instead (#366) — see the `Controlled` story.
+ *
+ * **It renders the PROVIDER's registry** (ADR 0029). Register your themes on
+ * `<ThemeProvider themes={…}>` and this switcher offers them with no prop —
+ * which is also why `allowedThemes` (#355) is honoured for free: the provider
+ * has already narrowed what it exposes. The `themes` prop is now purely an
+ * additional, optional narrowing on top; a name the provider does not offer is
+ * dropped rather than rendered, so a disallowed or unregistered theme is never
+ * reachable via a menu item, the toggle, "System", or the OS
+ * `prefers-color-scheme` listener.
+ *
+ * The pre-ADR-0029 hard-coded `["light","dark"]` default is gone. Behaviour for
+ * an app on the default provider is unchanged — that registry IS light + dark.
+ */
+declare const ThemeSwitcher: react.ForwardRefExoticComponent<ThemeSwitcherProps & react.RefAttributes<HTMLButtonElement>>;
+
+/**
+ * A single revision entry. The APP assigns `lane` (0-based column index),
+ * computes `additions`/`deletions`, and orders revisions newest-first.
+ */
+interface Revision {
+    /** Unique identifier — used for selection + edge references. */
+    id: string;
+    /** Commit message (may be long; the component truncates). */
+    message: string;
+    /** Display name of the commit author. */
+    author?: string;
+    /** Avatar image URL for the author. */
+    authorAvatar?: string;
+    /** When the commit was authored. Accepts Date, ISO string, or epoch ms. */
+    timestamp: Date | string | number;
+    /** Short commit hash (e.g. "a1b2c3d"). */
+    shortSha?: string;
+    /** Lines added (churn indicator). */
+    additions?: number;
+    /** Lines deleted (churn indicator). */
+    deletions?: number;
+    /**
+     * Column index assigned by the app (0-based). Lane 0 = main branch (leftmost).
+     * Used to position the node dot and draw the lane spine in the SVG gutter.
+     */
+    lane: number;
+    /** Branch or tag labels rendered as chips on this revision. */
+    refs?: string[];
+    /**
+     * Branch identity for the collapse/expand mode. Opt-in: only takes effect when
+     * a matching `branches` entry is supplied to `RevisionTimeline`. When omitted
+     * (or unmatched), the revision renders as a normal, never-collapsible row.
+     */
+    branchId?: string;
+}
+/**
+ * A parent link between two revisions, for the lane graph.
+ * Used to draw merge joins (curves / angled lines) in the SVG gutter.
+ */
+interface RevisionEdge {
+    /** Id of the child revision (newer, higher in the list). */
+    from: string;
+    /** Id of the parent revision (older, lower in the list). */
+    to: string;
+}
+/**
+ * A collapsible branch in the history. The APP supplies these (it already
+ * computes lanes + edges); listing a branch here makes it collapsible. Nesting
+ * via `parentBranchId` lets a parent branch's collapse also fold its descendants
+ * (multi-level). Omitting a branch from this list keeps its commits permanently
+ * visible (e.g. the trunk).
+ */
+interface RevisionBranch {
+    /** Stable id, referenced by `Revision.branchId` and other branches' `parentBranchId`. */
+    id: string;
+    /** Human label for the collapsed summary row. Defaults to `id`. */
+    name?: string;
+    /** Parent branch id — enables multi-level nesting in the collapse hierarchy. */
+    parentBranchId?: string;
+}
+/** Visual density variants for the timeline. */
+declare const revisionTimelineVariants: (props?: ({
+    density?: "compact" | "comfortable" | null | undefined;
+} & class_variance_authority_types.ClassProp) | undefined) => string;
+type RevisionTimelineDensity = NonNullable<VariantProps<typeof revisionTimelineVariants>["density"]>;
+/** Lane index → CSS token string (`var(--chart-1)` … `var(--chart-5)`). */
+declare function laneColor(lane: number): string;
+interface RevisionTimelineProps extends Omit<HTMLAttributes<HTMLDivElement>, "onSelect">, VariantProps<typeof revisionTimelineVariants> {
+    /** Ordered revisions, newest → oldest. */
+    revisions: Revision[];
+    /**
+     * Parent-link edges for drawing the branch graph.
+     * Each edge connects a child revision (`from`) to its parent (`to`).
+     */
+    edges?: RevisionEdge[];
+    /**
+     * How to group revisions. `"day"` inserts day headers; `"none"` renders a
+     * flat list. @default "day"
+     */
+    groupBy?: "day" | "none";
+    /** Format the day-group header label. Defaults to `Intl.DateTimeFormat` long date. */
+    formatDay?: (d: Date) => string;
+    /**
+     * Controlled selection: the id of the currently-selected revision.
+     * Omit to use uncontrolled selection (`defaultSelectedId`).
+     */
+    selectedId?: string;
+    /** Initial selected revision id for uncontrolled usage. */
+    defaultSelectedId?: string;
+    /** Called when the user selects a revision row. */
+    onSelect?: (id: string) => void;
+    /**
+     * Collapsible branch registry. **Supplying this opts in to the collapse/expand
+     * mode.** Each listed branch becomes collapsible; a branch's commits fold into a
+     * single summary row at its tip. `parentBranchId` nests branches so collapsing a
+     * parent also folds its descendants (multi-level). A revision whose `branchId`
+     * is not listed here (e.g. the trunk) stays permanently visible. Omit entirely
+     * for the classic, non-collapsible timeline.
+     */
+    branches?: RevisionBranch[];
+    /** Controlled set of collapsed branch ids. */
+    collapsedBranchIds?: string[];
+    /** Uncontrolled initial set of collapsed branch ids. */
+    defaultCollapsedBranchIds?: string[];
+    /** Called when a branch is collapsed or expanded. `collapsed` is the NEXT state. */
+    onBranchToggle?: (branchId: string, collapsed: boolean) => void;
+    /**
+     * Trailing summary text on a collapsed branch row. Defaults to
+     * `"<n> commit(s)"`; override to re-vocabulary the timeline (e.g. `"<n> steps"`
+     * when modelling a process flow rather than git history).
+     */
+    formatBranchSummary?: (count: number, branch: RevisionBranch) => string;
+}
+/**
+ * RevisionTimeline — presentational git-history timeline.
+ *
+ * Renders revisions in a scrollable list with:
+ *   - Day grouping (collapsible via `groupBy`)
+ *   - SVG branch-graph lanes + merge joins in the left gutter
+ *   - Churn indicators, ref chips, author, SHA, timestamp
+ *   - Accessible selection (real `<button>` elements in an `<ol>`)
+ *
+ * Self-contained: no required Provider ancestor. Use `selectedId` +
+ * `onSelect` for controlled selection, or `defaultSelectedId` for uncontrolled.
+ *
+ * Pass `branches` to enable the collapse/expand mode: a branch's commits fold
+ * into a single summary row at its tip (multi-level via `parentBranchId`).
+ */
+declare const RevisionTimeline: react.ForwardRefExoticComponent<RevisionTimelineProps & react.RefAttributes<HTMLDivElement>>;
+
+type TimelineRootProps = HTMLAttributes<HTMLOListElement>;
+/** The `<ol>` that owns the rail geometry; compose `TimelineItem`s inside. */
+declare const TimelineRoot: react.ForwardRefExoticComponent<TimelineRootProps & react.RefAttributes<HTMLOListElement>>;
+interface TimelineItemProps extends LiHTMLAttributes<HTMLLIElement> {
+    /** The canonical execution status (closed 7-state enum, status-badge #189). */
+    status?: Status;
+    /** Right-aligned meta (e.g. a date) on the title row. */
+    timestamp?: ReactNode;
+    /** Secondary line under the title. */
+    description?: ReactNode;
+    /**
+     * Rich block content under the title/description, indented with the rail —
+     * the slot composing consumers (e.g. `@elabs-ai/components-ai`'s `AgentStep`, #192)
+     * interleave per node. Block-level, so it must NOT ride the inline title
+     * slot (`children`).
+     */
+    detail?: ReactNode;
+}
+/**
+ * One `<li>`: status node + connector + the title row; `children` is the
+ * title slot. The connector hides itself on the last item via CSS
+ * (`group-last`), so streaming/compound consumers never track "is last".
+ */
+declare const TimelineItem: react.ForwardRefExoticComponent<TimelineItemProps & react.RefAttributes<HTMLLIElement>>;
+/**
+ * One step of the array-API `Timeline` (the editor's original item shape —
+ * re-exported by `@elabs-ai/components-editor` as `TimelineItem` for back-compat).
+ */
+interface TimelineEntry {
+    title: ReactNode;
+    description?: ReactNode;
+    /** The editor's 3-state vocabulary; mapped in via `fromTimelineStatus`. */
+    status?: TimelineStatus;
+    timestamp?: ReactNode;
+}
+interface TimelineProps extends HTMLAttributes<HTMLOListElement> {
+    items: TimelineEntry[];
+}
+/** Array convenience over the compound parts (data in, list out). */
+declare const Timeline: react.ForwardRefExoticComponent<TimelineProps & react.RefAttributes<HTMLOListElement>>;
+
+declare const toggleVariants: (props?: ({
+    variant?: "default" | "outline" | "segmented" | null | undefined;
+    size?: "default" | "sm" | "lg" | null | undefined;
+} & class_variance_authority_types.ClassProp) | undefined) => string;
+declare const Toggle: react.ForwardRefExoticComponent<Omit<TogglePrimitive.ToggleProps & react.RefAttributes<HTMLButtonElement>, "ref"> & VariantProps<(props?: ({
+    variant?: "default" | "outline" | "segmented" | null | undefined;
+    size?: "default" | "sm" | "lg" | null | undefined;
+} & class_variance_authority_types.ClassProp) | undefined) => string> & react.RefAttributes<HTMLButtonElement>>;
+
+type ToggleVariantProps = VariantProps<typeof toggleVariants>;
+declare const ToggleGroup: react.ForwardRefExoticComponent<(ComponentPropsWithoutRef<react.ForwardRefExoticComponent<(ToggleGroupPrimitive.ToggleGroupSingleProps | ToggleGroupPrimitive.ToggleGroupMultipleProps) & react.RefAttributes<HTMLDivElement>>> & ToggleVariantProps) & react.RefAttributes<HTMLDivElement>>;
+declare const ToggleGroupItem: react.ForwardRefExoticComponent<Omit<ToggleGroupPrimitive.ToggleGroupItemProps & react.RefAttributes<HTMLButtonElement>, "ref"> & ToggleVariantProps & react.RefAttributes<HTMLButtonElement>>;
+
+declare const toolbarVariants: (props?: ({
+    orientation?: "horizontal" | "vertical" | null | undefined;
+} & class_variance_authority_types.ClassProp) | undefined) => string;
+interface ToolbarProps extends Omit<ComponentPropsWithoutRef<typeof ToolbarPrimitive.Root>, "orientation">, VariantProps<typeof toolbarVariants> {
+    /**
+     * What this toolbar acts on ("Document", "Formatting"). A toolbar is one tab
+     * stop with several controls inside it, so without a name a screen-reader
+     * user lands on an anonymous group — hence required, not optional.
+     */
+    "aria-label": string;
+}
+/**
+ * The row shell. Renders no surface of its own: a toolbar sits ON something
+ * (a card header, a document frame) and inherits that surface, so painting a
+ * background here would double the fill wherever it is placed.
+ */
+declare const Toolbar: react.ForwardRefExoticComponent<ToolbarProps & react.RefAttributes<HTMLDivElement>>;
+interface ToolbarButtonProps extends ComponentPropsWithoutRef<typeof ToolbarPrimitive.Button>, Pick<VariantProps<typeof buttonVariants>, "variant" | "size"> {
+}
+/**
+ * A control inside the toolbar. Styled with `buttonVariants` — the same ink,
+ * heights and focus ring as every other button in the system, not a parallel
+ * set. Icon-only controls take `size="icon-sm"` and MUST carry an `aria-label`;
+ * wrap in a `Tooltip` when the glyph needs a name on screen too.
+ */
+declare const ToolbarButton: react.ForwardRefExoticComponent<ToolbarButtonProps & react.RefAttributes<HTMLButtonElement>>;
+type ToolbarSeparatorProps = ComponentPropsWithoutRef<typeof ToolbarPrimitive.Separator>;
+/**
+ * The divider between two groups of controls. It is the ONLY cue between two
+ * same-fill regions of the row, so it takes the strong rung (WCAG 1.4.11,
+ * ADR 0010) — `Separator`'s subtle default would be a decorative hairline here.
+ */
+declare const ToolbarSeparator: react.ForwardRefExoticComponent<Omit<ToolbarPrimitive.ToolbarSeparatorProps & react.RefAttributes<HTMLDivElement>, "ref"> & react.RefAttributes<HTMLDivElement>>;
+type ToolbarToggleGroupProps = ComponentPropsWithoutRef<typeof ToolbarPrimitive.ToggleGroup>;
+/** A set of mutually-exclusive or multi-select toggles (a view switcher, bold/italic). */
+declare const ToolbarToggleGroup: react.ForwardRefExoticComponent<ToolbarToggleGroupProps & react.RefAttributes<HTMLDivElement>>;
+interface ToolbarToggleItemProps extends ComponentPropsWithoutRef<typeof ToolbarPrimitive.ToggleItem>, Pick<VariantProps<typeof toggleVariants>, "size"> {
+}
+/** One toggle. Shares `Toggle`'s pressed styling, so state reads the same everywhere. */
+declare const ToolbarToggleItem: react.ForwardRefExoticComponent<ToolbarToggleItemProps & react.RefAttributes<HTMLButtonElement>>;
+/**
+ * An escape hatch for anything the parts above do not cover — a `Select`, an
+ * input, a `DropdownMenu` trigger. `asChild` hands the roving-tabindex wiring to
+ * whatever you render, so the control stays part of the arrow-key sequence
+ * instead of becoming a second tab stop inside a single-tab-stop row.
+ */
+declare const ToolbarSlot: react.ForwardRefExoticComponent<ToolbarPrimitive.ToolbarButtonProps & react.RefAttributes<HTMLButtonElement>>;
+
+interface TopNavProps extends HTMLAttributes<HTMLElement> {
+    /** Left slot (brand on mobile, breadcrumbs, title). */
+    start?: ReactNode;
+    /** Right slot (search, actions, account menu). */
+    end?: ReactNode;
+}
+/** Application top bar. Sticky, single row, brand-neutral. */
+declare const TopNav: react.ForwardRefExoticComponent<TopNavProps & react.RefAttributes<HTMLElement>>;
+
+interface TransferItem {
+    value: string;
+    label: ReactNode;
+    disabled?: boolean;
+}
+interface TransferProps extends Omit<HTMLAttributes<HTMLDivElement>, "onChange"> {
+    /** Full data set. Source = items NOT in target; target = items IN target. */
+    dataSource: TransferItem[];
+    /** Controlled: values in the RIGHT (target) list. */
+    targetKeys?: string[];
+    /** Uncontrolled initial target keys. */
+    defaultTargetKeys?: string[];
+    /** Called whenever the target key-set changes. */
+    onChange?: (targetKeys: string[]) => void;
+    /** Show per-panel search input. @default false */
+    showSearch?: boolean;
+    /** Panel titles. @default ["Source", "Target"] */
+    titles?: [ReactNode, ReactNode];
+    /** Custom row renderer. @default (item) => item.label */
+    renderItem?: (item: TransferItem) => ReactNode;
+    className?: string;
+}
+declare const Transfer: react.ForwardRefExoticComponent<TransferProps & react.RefAttributes<HTMLDivElement>>;
+
+interface TreeNode<T = unknown> {
+    id: string;
+    label: ReactNode;
+    children?: TreeNode<T>[];
+    /**
+     * Marks a node as expandable even when `children` is not yet loaded.
+     * A node with `hasChildren: true` and no `children` array will show the
+     * expand affordance. Calling `loadChildren` will populate its children.
+     */
+    hasChildren?: boolean;
+    disabled?: boolean;
+    icon?: ReactNode;
+    /**
+     * Optional trailing content rendered after the label — e.g. a size or
+     * token-count badge (#369). Rendered as a SIBLING of the label and kept out
+     * of the row's accessible name: a string `label` names the row via
+     * `aria-label`, a `ReactNode` label names it via `aria-labelledby` pointing
+     * at the label span only, so the accessory text never joins either.
+     *
+     * The slot is isolated from the row: click, keydown and focus are stopped at
+     * the accessory, so it never selects/expands the row, never lets the tree's
+     * roving-tabindex handler swallow its keys, and never has focus yanked back
+     * to the row. Interactive content (a button, a link) therefore works and is
+     * independently focusable in normal tab order; the row's own keyboard
+     * navigation (arrow keys, Enter/Space) is unaffected while the row is focused.
+     */
+    accessory?: ReactNode;
+    data?: T;
+}
+interface TreeProps<T = unknown> extends Omit<HTMLAttributes<HTMLDivElement>, "onSelect"> {
+    nodes: TreeNode<T>[];
+    /** Controlled expanded ids */
+    expandedIds?: string[];
+    /** Uncontrolled initial expanded ids */
+    defaultExpandedIds?: string[];
+    onExpandedChange?: (ids: string[]) => void;
+    /** "single" | "multiple" | "none" — default "single" */
+    selectionMode?: "single" | "multiple" | "none";
+    /** Controlled selected ids */
+    selectedIds?: string[];
+    /** Uncontrolled initial selected ids */
+    defaultSelectedIds?: string[];
+    onSelectionChange?: (ids: string[]) => void;
+    /** Show checkboxes for multi-selection affordance — default false */
+    checkboxes?: boolean;
+    /**
+     * The surface on which the tree is rendered.
+     * - `"default"` (default) — renders selected rows with `bg-accent` (for use on
+     *   background/card surfaces).
+     * - `"sidebar"` — renders selected rows with the sidebar's own active-item
+     *   treatment (`bg-sidebar-accent` + `text-sidebar-accent-foreground` +
+     *   `font-medium`), so selection reads consistently with `SidebarMenuButton`'s
+     *   active state on the `--sidebar` surface. (No fill is ≥3:1 on a sidebar;
+     *   perceivability comes from the foreground/weight shift + `aria-selected`,
+     *   the same multi-cue approach the Sidebar uses.)
+     */
+    surface?: "default" | "sidebar";
+    /**
+     * Enable windowed rendering for large trees (>50 visible rows).
+     * When `true`, only the visible slice of the flattened tree is mounted in
+     * the DOM. Requires a bounded scroll container — either via `maxHeight` or
+     * by sizing the root element externally with `overflow-auto`.
+     * Default: `false` (backward-compatible nested-group DOM).
+     */
+    virtualize?: boolean;
+    /** Estimated row height in px used by the virtualizer. Default 32. */
+    estimateRowHeight?: number;
+    /** Number of extra rows to render beyond the visible window. Default 8. */
+    overscan?: number;
+    /**
+     * CSS max-height for the scroll viewport when `virtualize` is true.
+     * E.g. `"400px"` or `"60vh"`. When omitted the root div must be sized by
+     * the caller (e.g. via `className="h-96 overflow-auto"`).
+     */
+    maxHeight?: number | string;
+    /**
+     * Scroll the node with this id into view when the value CHANGES. Reveals a
+     * node selected programmatically (via `selectedIds`) that is windowed out of
+     * the DOM in `virtualize` mode (or below the fold), so the tree shows "where
+     * I am", not just structure. Expands the node's (loaded) ancestors and kicks
+     * their lazy `loadChildren` as needed, then centers the node. Independent of
+     * keyboard focus (keyboard nav's own scroll is unchanged).
+     */
+    scrollToId?: string;
+    /**
+     * When `true`, reveal the newly-selected controlled node (the id added to
+     * `selectedIds`) into view — the selection-driven equivalent of `scrollToId`.
+     * `scrollToId` wins when both are set.
+     */
+    scrollSelectionIntoView?: boolean;
+    /**
+     * Async function called when a node with `hasChildren: true` (and no
+     * loaded `children`) is expanded for the first time. The returned nodes
+     * are merged into the internal tree state and cached so re-expanding the
+     * node does not re-fetch.
+     */
+    loadChildren?: (node: TreeNode<T>) => Promise<TreeNode<T>[]>;
+    className?: string;
+}
+declare const Tree: <T = unknown>(props: TreeProps<T> & {
+    ref?: React.Ref<HTMLDivElement>;
+}) => React.ReactElement | null;
+
+interface UseTreeKeyboardOptions<T> {
+    nodes: TreeNode<T>[];
+    expandedIds: Set<string>;
+    onExpandedChange: (ids: Set<string>) => void;
+    selectionMode: "single" | "multiple" | "none";
+    selectedIds: Set<string>;
+    onSelectionChange: (ids: Set<string>) => void;
+    /**
+     * When `true`, the tree uses windowed rendering. Focus navigation must
+     * scroll the virtualizer before focusing an unmounted row.
+     */
+    virtualize?: boolean;
+    /**
+     * Ordered list of visible node ids in the virtual flat list. Provided by
+     * the Tree when `virtualize` is true so the keyboard hook can map an id to
+     * a virtual index without re-flattening.
+     */
+    flatNodeIds?: string[];
+    /**
+     * Ref that the keyboard hook writes a node id into when it needs to focus a
+     * row that is currently scrolled out of view. The Tree's `registerAndFlush`
+     * callback reads this ref on every ref registration and focuses the element
+     * once it mounts.
+     */
+    pendingFocusIdRef?: React.MutableRefObject<string | null>;
+    /**
+     * Called when the keyboard hook wants to bring an index into view before
+     * focusing it. Only called in virtual mode.
+     */
+    scrollToVirtualIndex?: (index: number) => void;
+}
+interface UseTreeKeyboardResult {
+    activeId: string | null;
+    setActiveId: (id: string | null) => void;
+    /** ref callback — register each tree item element keyed by node id */
+    registerNodeRef: (id: string, el: HTMLElement | null) => void;
+    /** onKeyDown handler to attach to the root tree div */
+    onKeyDown: (e: React.KeyboardEvent<HTMLElement>) => void;
+}
+declare function useTreeKeyboard<T>(options: UseTreeKeyboardOptions<T>): UseTreeKeyboardResult;
+
+interface TreeSelectProps<T = unknown> extends Omit<ButtonHTMLAttributes<HTMLButtonElement>, "value" | "onChange"> {
+    nodes: TreeNode<T>[];
+    /** Controlled value — `string` in single mode, `string[]` in multiple mode. */
+    value?: string | string[];
+    /** Uncontrolled initial value. */
+    defaultValue?: string | string[];
+    onValueChange?: (value: string | string[]) => void;
+    /** Allow selecting multiple nodes (checkbox tree). Default false. */
+    multiple?: boolean;
+    placeholder?: string;
+    className?: string;
+}
+/**
+ * A select whose options are a hierarchical {@link Tree}. Single or multiple
+ * selection; composes `Tree` for all keyboard/SR behaviour.
+ */
+declare const TreeSelect: <T = unknown>(props: TreeSelectProps<T> & {
+    ref?: React.Ref<HTMLButtonElement>;
+}) => React.ReactElement | null;
+
+/**
+ * The role font sizes in rem — a TS mirror of the `--text-<role>` tokens
+ * (packages/tokens/src/themes.css) for consumers that need the numbers at
+ * runtime (e.g. @elabs-ai/components-editor's markdown-scale CSS-var seam). Edit the tokens
+ * first; typography.test.tsx pins this mirror to themes.css.
+ */
+declare const TEXT_ROLE_REM: {
+    readonly display: 1.875;
+    readonly title: 1.25;
+    readonly subtitle: 1;
+    readonly body: 0.875;
+    readonly caption: 0.8125;
+    readonly meta: 0.75;
+    readonly kpi: 2;
+    readonly code: 0.8125;
+};
+type TextRole = keyof typeof TEXT_ROLE_REM;
+declare const textVariants: (props?: ({
+    variant?: "body" | "caption" | "meta" | "kpi" | "code" | "lead" | null | undefined;
+    tone?: "default" | "primary" | "muted" | null | undefined;
+} & class_variance_authority_types.ClassProp) | undefined) => string;
+type TextVariant = NonNullable<VariantProps<typeof textVariants>["variant"]>;
+type TextTone = NonNullable<VariantProps<typeof textVariants>["tone"]>;
+interface TextProps extends HTMLAttributes<HTMLParagraphElement>, VariantProps<typeof textVariants> {
+    /** Render as a different element. Defaults to "p". */
+    as?: "p" | "span" | "div";
+    /** Render the child element as the text root (Radix Slot) instead. */
+    asChild?: boolean;
+}
+declare const Text: react.ForwardRefExoticComponent<TextProps & react.RefAttributes<HTMLParagraphElement>>;
+type HeadingLevel = 1 | 2 | 3 | 4 | 5 | 6;
+declare const headingVariants: (props?: ({
+    size?: "display" | "title" | "subtitle" | null | undefined;
+} & class_variance_authority_types.ClassProp) | undefined) => string;
+type HeadingSize = NonNullable<VariantProps<typeof headingVariants>["size"]>;
+interface HeadingProps extends HTMLAttributes<HTMLHeadingElement>, VariantProps<typeof headingVariants> {
+    /** Semantic heading level — drives the rendered tag AND the default size. */
+    level?: HeadingLevel;
+    /** Render the child element as the heading root (Radix Slot) instead. */
+    asChild?: boolean;
+}
+/**
+ * `level` keeps the a11y heading order; `size` overrides the visual rung
+ * independently, so a visually-small `<h2>` stays an `<h2>`.
+ */
+declare const Heading: react.ForwardRefExoticComponent<HeadingProps & react.RefAttributes<HTMLHeadingElement>>;
+
+type ProseHeadingLevel = 1 | 2 | 3 | 4 | 5 | 6;
+/**
+ * Canonical reading-scale heading sizes in rem — the single source the markdown
+ * WYSIWYG editor derives its CSS vars from (@elabs-ai/components-editor `markdown-scale`).
+ * h2/h4/h5/h6 sit exactly on the title/subtitle/body roles; h1 (1.5rem) and
+ * h3 (1.125rem) are intermediate reading rungs with no app role.
+ */
+declare const PROSE_HEADING_REM: Record<ProseHeadingLevel, number>;
+/** Canonical prose heading weight (Tailwind `font-semibold`). */
+declare const PROSE_HEADING_WEIGHT = 600;
+/** Canonical prose heading letter-spacing (Tailwind `tracking-tight`). */
+declare const PROSE_HEADING_TRACKING = "-0.025em";
+interface ProseHeadingProps extends HTMLAttributes<HTMLHeadingElement> {
+    level?: ProseHeadingLevel;
+}
+declare const ProseHeading: react.ForwardRefExoticComponent<ProseHeadingProps & react.RefAttributes<HTMLHeadingElement>>;
+declare const TEXT_VARIANT: {
+    readonly body: "text-body leading-relaxed text-foreground";
+    readonly muted: "text-body leading-relaxed text-muted-foreground";
+    readonly lead: "text-subtitle font-normal leading-relaxed text-foreground";
+    readonly small: "text-meta font-normal text-muted-foreground";
+};
+interface ProseTextProps extends HTMLAttributes<HTMLParagraphElement> {
+    variant?: keyof typeof TEXT_VARIANT;
+    /** Render as a different element (e.g. "span"). Defaults to "p". */
+    as?: "p" | "span" | "div";
+}
+declare const ProseText: react.ForwardRefExoticComponent<ProseTextProps & react.RefAttributes<HTMLParagraphElement>>;
+interface ProseLinkProps extends AnchorHTMLAttributes<HTMLAnchorElement> {
+    /** Opens in a new tab with safe rel. Auto-detected for http(s) hrefs when unset. */
+    external?: boolean;
+}
+declare const ProseLink: react.ForwardRefExoticComponent<ProseLinkProps & react.RefAttributes<HTMLAnchorElement>>;
+interface ProseListProps extends OlHTMLAttributes<HTMLElement> {
+    ordered?: boolean;
+}
+declare const ProseList: react.ForwardRefExoticComponent<ProseListProps & react.RefAttributes<HTMLUListElement & HTMLOListElement>>;
+declare const ProseListItem: react.ForwardRefExoticComponent<HTMLAttributes<HTMLLIElement> & react.RefAttributes<HTMLLIElement>>;
+declare const ProseBlockquote: react.ForwardRefExoticComponent<HTMLAttributes<HTMLQuoteElement> & react.RefAttributes<HTMLQuoteElement>>;
+declare const ProseInlineCode: react.ForwardRefExoticComponent<HTMLAttributes<HTMLElement> & react.RefAttributes<HTMLElement>>;
+
+interface ViewToolbarProps extends HTMLAttributes<HTMLDivElement> {
+    /**
+     * What this view is, as a tooltip on an ⓘ trigger at the start of the row —
+     * so a view does not need an in-page `<h1>` + paragraph block just to explain
+     * itself. Omit it when the surrounding page already says what the view is.
+     *
+     * **Pointer/keyboard only.** A Radix tooltip opens on hover and on keyboard
+     * focus but deliberately NOT on tap (and Radix suppresses the focus-open when
+     * focus arrived from a pointer), so on a touch device this text is
+     * unreachable. Treat `info` as progressive enhancement: never put something a
+     * phone user cannot do without in it. See `Docs/View Toolbar Contract`.
+     */
+    info?: ReactNode;
+    /** Left cluster — status/context, `ViewToolbarFilters`, `ResultCount`. */
+    children?: ReactNode;
+    /** Right cluster — the view's actions. Stays reachable at every width. */
+    actions?: ReactNode;
+}
+declare const ViewToolbar: react.ForwardRefExoticComponent<ViewToolbarProps & react.RefAttributes<HTMLDivElement>>;
+interface ViewToolbarFiltersProps extends HTMLAttributes<HTMLDivElement> {
+    /**
+     * Clear every active filter. Supplying it renders the "clear all" affordance
+     * at the end of the chip run; omit it when a view has no bulk reset.
+     */
+    onClearAll?: () => void;
+}
+/**
+ * The chip run. Render it ONLY when at least one filter is active — the
+ * "no filters applied" state is the region's ABSENCE, not an empty box.
+ *
+ * Runs at chip height (24px) so the whole group reads as one control rung; the
+ * `actions` cluster runs at button height. That split is the fix for the
+ * control-height scatter #331 measured.
+ */
+declare const ViewToolbarFilters: react.ForwardRefExoticComponent<ViewToolbarFiltersProps & react.RefAttributes<HTMLDivElement>>;
+interface FilterChipProps extends Omit<ButtonHTMLAttributes<HTMLButtonElement>, "children"> {
+    /**
+     * Label-in-value text — `"Status: Failed"`, never `"Status = failed"` and
+     * never a bare `"Failed"`. The caller composes the string so the chip reads
+     * as a sentence fragment out of context (and in a screen reader).
+     */
+    label: string;
+    /** Remove this filter. The WHOLE chip is the remove control — see below. */
+    onRemove: () => void;
+}
+/**
+ * A removable active-filter chip.
+ *
+ * The whole chip is a single `<button>` whose action is "remove", rather than a
+ * span with a nested ✕: one tab stop instead of two, a ≥24px target (WCAG 2.5.8)
+ * with no dead zone, and Enter/Space for free from the native element. Its
+ * accessible name is "Remove filter: <label>", which CONTAINS the visible label
+ * (WCAG 2.5.3 Label in Name).
+ *
+ * A chip that must EDIT a filter rather than remove it is a different control —
+ * reach for `FacetFilter` (`@elabs-ai/components-data`), not a variant of this.
+ */
+declare const FilterChip: react.ForwardRefExoticComponent<FilterChipProps & react.RefAttributes<HTMLButtonElement>>;
+interface ResultCountProps extends HTMLAttributes<HTMLSpanElement> {
+    /** How many rows/cards the view is showing right now. */
+    count: number;
+    /**
+     * The unfiltered total. Supplying it renders "N of M" — the honest reading
+     * when a filter is active. Omit it for an unfiltered view's bare count.
+     */
+    total?: number;
+    /**
+     * No count yet. Renders a layout-shaped placeholder instead of a `0` that
+     * lies while the data is in flight (see `.claude/rules/loading-states.md`).
+     */
+    loading?: boolean;
+    /**
+     * Optional trailing noun ("results", "runs", "rows") joined with a
+     * non-breaking space, so the number is never announced bare.
+     */
+    children?: ReactNode;
+}
+declare const ResultCount: react.ForwardRefExoticComponent<ResultCountProps & react.RefAttributes<HTMLSpanElement>>;
+
+interface VirtualSelectOption {
+    label: string;
+    value: string;
+    disabled?: boolean;
+}
+interface UseVirtualListboxOptions {
+    count: number;
+    filtered: VirtualSelectOption[];
+    /** Reserved for future use (e.g. multi-select keyboard shortcuts). */
+    multiple?: boolean;
+    isOpen: boolean;
+    onSelect: (value: string) => void;
+    virtualizer: Virtualizer<any, any> | null;
+}
+interface UseVirtualListboxReturn {
+    activeIndex: number;
+    setActiveIndex: (index: number) => void;
+    onInputKeyDown: (e: React.KeyboardEvent<HTMLInputElement>) => void;
+}
+/**
+ * Keyboard navigation logic for the VirtualSelect listbox.
+ * Encapsulates ArrowDown/Up/Home/End/Enter/Escape handling.
+ * Focus stays on the search input; `aria-activedescendant` tracks the active row.
+ */
+declare function useVirtualListbox({ count, filtered, isOpen, onSelect, virtualizer, }: UseVirtualListboxOptions): UseVirtualListboxReturn;
+
+interface VirtualSelectProps extends Omit<ButtonHTMLAttributes<HTMLButtonElement>, "value" | "onChange" | "defaultValue"> {
+    /** The full option list. Only visible items are rendered in the DOM. */
+    options: VirtualSelectOption[];
+    /** Allow selecting multiple values. Default `false`. */
+    multiple?: boolean;
+    /** Controlled value — `string` in single mode, `string[]` in multiple mode. */
+    value?: string | string[];
+    /** Uncontrolled initial value. */
+    defaultValue?: string | string[];
+    /** Called when the selection changes. Emits `string` (single) or `string[]` (multiple). */
+    onValueChange?: (value: string | string[]) => void;
+    /** Trigger placeholder when nothing is selected. Default "Select…" */
+    placeholder?: string;
+    /** Search-input placeholder. Default "Search…" */
+    searchPlaceholder?: string;
+    /** Empty-state message when no options match the query. Default "No results." */
+    emptyText?: string;
+    /**
+     * Estimated row height used by the virtualizer (px).
+     * Increase for taller rows (e.g. with descriptions). Default 32.
+     */
+    estimateOptionHeight?: number;
+    /**
+     * CSS max-height for the scrollable listbox. Default "18rem".
+     */
+    maxListHeight?: string;
+    className?: string;
+}
+/**
+ * VirtualSelect — a combobox that renders only the visible window of options
+ * in the DOM, making it suitable for option lists of 10,000+ items.
+ *
+ * Uses `@tanstack/react-virtual` for windowed rendering and a purpose-built
+ * `aria-activedescendant` keyboard model so focus stays on the search input
+ * while navigating the listbox.
+ */
+declare const VirtualSelect: react.ForwardRefExoticComponent<VirtualSelectProps & react.RefAttributes<HTMLButtonElement>>;
+
+interface WizardStepMeta {
+    /** Stable id for the step. */
+    id: string;
+    /** Title shown in the step indicator. */
+    title: string;
+    /** Optional supporting text shown under the title. */
+    description?: string;
+}
+/** A step validator — return false (or a rejected/`false` promise) to block advance. */
+type WizardValidator = () => boolean | Promise<boolean>;
+declare const wizardVariants: (props?: ({
+    orientation?: "horizontal" | "vertical" | null | undefined;
+} & class_variance_authority_types.ClassProp) | undefined) => string;
+interface WizardProps extends Omit<HTMLAttributes<HTMLDivElement>, "onChange">, VariantProps<typeof wizardVariants> {
+    /** The ordered step metadata used to render the indicator. */
+    steps: WizardStepMeta[];
+    /** Controlled active step index. */
+    step?: number;
+    /** Uncontrolled initial step index. Default 0. */
+    defaultStep?: number;
+    /** Called whenever the active step changes. */
+    onStepChange?: (step: number) => void;
+    children?: ReactNode;
+}
+/**
+ * Wizard — a multi-step flow with a step indicator, per-step validation gating,
+ * and Back/Next/Finish navigation.
+ *
+ * Controlled via `step`/`onStepChange`; uncontrolled via `defaultStep`. State is
+ * lifted into the provider and exposed to `WizardSteps`/`WizardStep`/`WizardNav`
+ * via context. `Next` runs the active step's `validate` (sync or async) before
+ * advancing and stays enabled until validation runs.
+ */
+declare const Wizard: react.ForwardRefExoticComponent<WizardProps & react.RefAttributes<HTMLDivElement>>;
+type WizardStepsProps = HTMLAttributes<HTMLOListElement>;
+/** WizardSteps — the ordered step indicator. Reads steps from context. */
+declare const WizardSteps: react.ForwardRefExoticComponent<WizardStepsProps & react.RefAttributes<HTMLOListElement>>;
+interface WizardStepProps extends HTMLAttributes<HTMLDivElement> {
+    /** This step's index (0-based) — must match its position in `steps`. */
+    step: number;
+    /** Run before advancing past this step. Return false to block. */
+    validate?: WizardValidator;
+}
+/**
+ * WizardStep — renders its children only when it is the active step, and
+ * registers its `validate` with the wizard while active. Receives focus on
+ * activation for keyboard users.
+ */
+declare const WizardStep: react.ForwardRefExoticComponent<WizardStepProps & react.RefAttributes<HTMLDivElement>>;
+interface WizardNavProps extends HTMLAttributes<HTMLDivElement> {
+    backLabel?: string;
+    nextLabel?: string;
+    finishLabel?: string;
+    /** Called when Finish is pressed on the last step. */
+    onFinish?: () => void;
+}
+/** WizardNav — Back / Next (or Finish on the last step) controls. */
+declare const WizardNav: react.ForwardRefExoticComponent<WizardNavProps & react.RefAttributes<HTMLDivElement>>;
+
+export { ATTRIBUTIONS, Accordion, AccordionContent, AccordionItem, AccordionTrigger, AdvancedGroup, type AdvancedGroupProps, Alert, AlertDescription, type AlertDescriptionProps, AlertDialog, AlertDialogAction, AlertDialogCancel, AlertDialogContent, AlertDialogDescription, AlertDialogFooter, AlertDialogHeader, AlertDialogPortal, AlertDialogTitle, AlertDialogTrigger, AlertTitle, type AlertTitleProps, AppShell, type AppShellProps, AppSidebar, type AppSidebarProps, AspectRatio, type Attribution, type AttributionCategory, AttributionPanel, type AttributionPanelProps, Avatar, AvatarFallback, AvatarImage, Badge, type BadgeProps, BentoGrid, BentoGridItem, type BentoGridItemProps, type BentoGridItemVariants, type BentoGridProps, type BentoGridSize, BoundedNumber, type BoundedNumberProps, Breadcrumb, BreadcrumbEllipsis, BreadcrumbItem, BreadcrumbLink, BreadcrumbList, BreadcrumbPage, BreadcrumbSeparator, Button, ButtonGroup, ButtonGroupSeparator, ButtonGroupText, type ButtonProps, CATEGORY_LABEL, COLOR_TOKENS, COPY_FEEDBACK_MS, Calendar, type CalendarProps, Card, CardAction, CardContent, CardDescription, type CardDescriptionProps, CardFooter, CardHeader, type CardProps, CardTitle, type CardTitleProps, Carousel, type CarouselApi, CarouselContent, CarouselItem, CarouselNext, CarouselPrevious, type ChangeHunk, type ChangeHunkStatus, type ChangeProvenance, ChangeReview, type ChangeReviewActions, ChangeReviewHeader, type ChangeReviewHeaderProps, ChangeReviewHunk, type ChangeReviewHunkProps, ChangeReviewList, type ChangeReviewListProps, type ChangeReviewProps, ChangeReviewProvenance, type ChangeReviewProvenanceProps, ChangeReviewProvider, type ChangeReviewProviderProps, type ChangeReviewState, Checkbox, Collapsible, CollapsibleContent, type CollapsiblePanelAttrs, type CollapsiblePanelSide, type CollapsiblePanelState, CollapsibleTrigger, ColorPicker, type ColorPickerProps, type ColorToken, Combobox, type ComboboxOption, type ComboboxProps, Command, CommandDialog, CommandEmpty, CommandGroup, CommandInput, CommandItem, CommandList, type CommandProps, CommandSeparator, CommandShortcut, ConfirmDialog, type ConfirmDialogProps, ContextMenu, ContextMenuCheckboxItem, ContextMenuContent, ContextMenuGroup, ContextMenuItem, ContextMenuLabel, ContextMenuRadioGroup, ContextMenuRadioItem, ContextMenuSeparator, ContextMenuShortcut, ContextMenuSub, ContextMenuSubContent, ContextMenuSubTrigger, ContextMenuTrigger, type CopyToClipboard, CopyableValue, type CopyableValueProps, type CustomStatus, DEFAULT_MESSAGES, DOCUMENT_ADDRESS_KINDS, DatePicker, type DatePickerProps, DateRangePicker, type DateRangePickerProps, type DateRangePreset, Descriptions, DescriptionsItem, type DescriptionsItemProps, type DescriptionsProps, Dialog, DialogBody, type DialogBodyProps, DialogClose, DialogContent, DialogDescription, type DialogDismissGuard, DialogFooter, DialogHeader, DialogOverlay, DialogPortal, DialogSection, type DialogSectionProps, DialogTitle, DialogTrigger, type DocumentAddress, type DocumentAddressKind, type DocumentRect, Drawer, DrawerClose, DrawerContent, DrawerDescription, DrawerFooter, DrawerHeader, DrawerPortal, DrawerTitle, DrawerTrigger, DropdownMenu, DropdownMenuCheckboxItem, DropdownMenuContent, DropdownMenuGroup, DropdownMenuItem, DropdownMenuLabel, DropdownMenuPortal, DropdownMenuRadioGroup, DropdownMenuRadioItem, DropdownMenuSeparator, DropdownMenuShortcut, DropdownMenuSub, DropdownMenuSubContent, DropdownMenuSubTrigger, DropdownMenuTrigger, EmptyState, type EmptyStateProps, ErrorState, type ErrorStateProps, ExpandDialog, ExpandDialogContent, type ExpandDialogContentProps, ExpandDialogHeader, type ExpandDialogHeaderProps, ExpandDialogPanes, type ExpandDialogPanesProps, type ExpandDialogProps, FILE_CATEGORY_ICONS, FieldRow, type FieldRowProps, type FileCategory, type FileKind, type FileSource, FileUpload, FileUploadDropzone, type FileUploadDropzoneProps, FileUploadItem, type FileUploadItemProps, FileUploadList, type FileUploadListProps, type FileUploadProps, type FileUploadStatus, FilterChip, type FilterChipProps, Form, FormControl, FormDescription, FormField, FormItem, FormLabel, FormMessage, Heading, type HeadingLevel, type HeadingProps, type HeadingSize, HoverCard, HoverCardContent, HoverCardTrigger, IconButton, type IconButtonProps, type IconButtonSize, Input, InputGroup, InputGroupAddon, InputGroupButton, InputGroupInput, type InputGroupProps, InputGroupText, InputGroupTextarea, InputOTP, InputOTPGroup, InputOTPSeparator, InputOTPSlot, type InputProps, type InsertMentionResult, Kbd, KeyValueEditor, type KeyValueEditorProps, type KeyValueRow, Label, LinkPreview, LinkPreviewCard, type LinkPreviewCardProps, ListEditor, type ListEditorProps, LoadingState, type LoadingStateProps, type LocaleContextValue, LocaleProvider, type LocaleProviderProps, MatchHighlight, type MatchHighlightProps, type MatchRange, type Mention, MentionInput, MentionInputContent, type MentionInputContentProps, type MentionInputContextValue, MentionInputEmpty, type MentionInputEmptyProps, MentionInputItem, type MentionInputItemProps, MentionInputList, type MentionInputListProps, type MentionInputProps, MentionInputTextarea, type MentionInputTextareaProps, type MentionOption, type MentionValue, Menubar, MenubarCheckboxItem, MenubarContent, MenubarItem, MenubarRadioItem, MenubarSeparator, MenubarShortcut, MenubarSubContent, MenubarSubTrigger, MenubarTrigger, type Messages, MetricCard, type MetricCardEmphasis, type MetricCardProps, ModelPicker, type ModelPickerBody, type ModelPickerGroup, type ModelPickerItem, type ModelPickerProps, type ModelPickerStatus, NavMain, type NavMainProps, type NavMainRoute, type NavMainSubItem, type NavNotification, NavNotifications, type NavNotificationsProps, NavUser, type NavUserProps, type NavUserUser, NavigationMenu, NavigationMenuContent, NavigationMenuItem, NavigationMenuLink, NavigationMenuList, NavigationMenuTrigger, NavigationMenuViewport, type NormalizedText, NumberInput, type NumberInputProps, PROSE_HEADING_REM, PROSE_HEADING_TRACKING, PROSE_HEADING_WEIGHT, PageShell, type PageShellProps, Pagination, PaginationContent, PaginationEllipsis, PaginationItem, PaginationLink, PaginationNext, PaginationPrevious, Popover, PopoverAnchor, PopoverContent, PopoverTrigger, Progress, type ProgressProps, ProseBlockquote, ProseHeading, type ProseHeadingLevel, type ProseHeadingProps, ProseInlineCode, ProseLink, type ProseLinkProps, ProseList, ProseListItem, type ProseListProps, ProseText, type ProseTextProps, type QuoteAddress, RadioGroup, RadioGroupItem, type RangeAddress, Rating, type RatingProps, type RectAddress, ResizableHandle, ResizablePanel, ResizablePanelGroup, type ResolvedFileSource, ResultCount, type ResultCountProps, Reveal, RevealGroup, type RevealGroupProps, type RevealProps, type Revision, type RevisionBranch, type RevisionEdge, RevisionTimeline, type RevisionTimelineDensity, type RevisionTimelineProps, STATUSES, STATUS_LABELS, STATUS_ROLE, STATUS_TONES, STATUS_TONE_ICONS, STREAMDOWN_TRANSLATION_KEYS, ScrollArea, ScrollBar, SectionHeader, type SectionHeaderProps, SegmentedField, type SegmentedFieldOption, type SegmentedFieldProps, Select, SelectContent, SelectGroup, SelectItem, SelectLabel, SelectSeparator, SelectTrigger, SelectValue, Separator, type SeparatorProps, Sheet, SheetClose, SheetContent, type SheetContentProps, SheetDescription, SheetFooter, SheetHeader, SheetPortal, SheetTitle, SheetTrigger, Sidebar, SidebarContent, SidebarFooter, SidebarGroup, SidebarGroupAction, SidebarGroupContent, SidebarGroupLabel, SidebarHeader, SidebarInput, SidebarInset, SidebarMenu, SidebarMenuAction, SidebarMenuBadge, SidebarMenuButton, SidebarMenuItem, SidebarMenuSkeleton, SidebarMenuSub, SidebarMenuSubButton, SidebarMenuSubItem, SidebarProvider, SidebarRail, SidebarSeparator, SidebarTrigger, Skeleton, type SkeletonProps, Slider, SliderNumber, type SliderNumberProps, type SliderProps, type SliderThumbProps, Spinner, type SpinnerProps, SplitPanel, type SplitPanelProps, type SplitPanelTone, StatePanel, type StatePanelProps, type Status, StatusBadge, type StatusBadgeProps, StatusIcon, type StatusIconProps, type StatusTone, type StreamdownTranslationKey, type StreamdownTranslationMap, Switch, TEXT_ROLE_REM, Table, TableBody, TableCaption, TableCell, TableFooter, TableHead, TableHeader, TableRow, Tabs, TabsContent, TabsList, TabsTrigger, TagInput, type TagInputProps, TeamSwitcher, type TeamSwitcherProps, type TeamSwitcherTeam, Text, type TextProps, type TextRole, type TextTone, type TextVariant, Textarea, type TextareaProps, type ThemePreference, ThemeSwitcher, type ThemeSwitcherProps, type ThemeTransitionEffect, Timeline, type TimelineEntry, TimelineItem, type TimelineItemProps, type TimelineProps, TimelineRoot, type TimelineRootProps, type TimelineStatus, Toaster, type ToasterProps, Toggle, ToggleGroup, ToggleGroupItem, Toolbar, ToolbarButton, type ToolbarButtonProps, type ToolbarProps, ToolbarSeparator, type ToolbarSeparatorProps, ToolbarSlot, ToolbarToggleGroup, type ToolbarToggleGroupProps, ToolbarToggleItem, type ToolbarToggleItemProps, Tooltip, TooltipContent, TooltipProvider, TooltipTrigger, TopNav, type TopNavProps, Transfer, type TransferItem, type TransferProps, Tree, type TreeNode, type TreeProps, TreeSelect, type TreeSelectProps, type UploadFile, type UseCollapsiblePanelOptions, type UseCollapsiblePanelReturn, type UseCopyToClipboardOptions, type UseDialogDismissGuardOptions, type UseTreeKeyboardOptions, type UseTreeKeyboardResult, ViewToolbar, ViewToolbarFilters, type ViewToolbarFiltersProps, type ViewToolbarProps, VirtualSelect, type VirtualSelectOption, type VirtualSelectProps, Wizard, WizardNav, type WizardNavProps, type WizardProps, WizardStep, type WizardStepMeta, type WizardStepProps, WizardSteps, type WizardStepsProps, type WizardValidator, alertVariants, badgeVariants, bentoGridItemVariants, buttonGroupVariants, buttonVariants, cardVariants, cn, countItems, defaultMentionFilter, dialogContentVariants, downloadBlob, downloadUrl, expandDialogPanesVariants, extensionOf, fileIconFor, fromTimelineStatus, headingVariants, hunkVariants, inputGroupAddonVariants, inputGroupVariants, insertMention, isCustomStatus, laneColor, mediaTypeFromName, mentionAt, mentionEnd, modelPickerBody, navigationMenuTriggerStyle, normalizeFileSource, normalizeQuoteText, normalizeQuoteTextWithOffsets, normalizeRanges, progressIndicatorVariants, queryToRanges, remapMentions, resolveFileKind, revealVariants, revisionTimelineVariants, serializeMentions, showsInlineError, sidebarMenuButtonVariants, statePanelVariants, statusBadgeVariants, textVariants, toggleVariants, toolbarVariants, useCollapsiblePanel, useCommandActiveItemId, useCopyToClipboard, useDialogDismissGuard, useFileUpload, useFormField, useIsMobile, useLocale, useMentionInput, useSidebar, useStreamdownTranslations, useThemeTransition, useTreeKeyboard, useVirtualListbox };