silicaui-react 0.1.0

package/dist/index.d.ts

@@ -0,0 +1,2754 @@
+import * as React from 'react';
+import { Accordion as Accordion$1 } from '@base-ui-components/react/accordion';
+import { Slider as Slider$1 } from '@base-ui-components/react/slider';
+import * as _base_ui_components_react_toast from '@base-ui-components/react/toast';
+import { Toast } from '@base-ui-components/react/toast';
+import { NumberField as NumberField$1 } from '@base-ui-components/react/number-field';
+import { Dialog as Dialog$1 } from '@base-ui-components/react/dialog';
+import { PreviewCard as PreviewCard$1 } from '@base-ui-components/react/preview-card';
+import * as _base_ui_components_react_toolbar from '@base-ui-components/react/toolbar';
+import { Toolbar as Toolbar$1 } from '@base-ui-components/react/toolbar';
+import * as _base_ui_components_react_navigation_menu from '@base-ui-components/react/navigation-menu';
+import { NavigationMenu as NavigationMenu$1 } from '@base-ui-components/react/navigation-menu';
+import * as _base_ui_components_react_menu from '@base-ui-components/react/menu';
+import { Menu as Menu$1 } from '@base-ui-components/react/menu';
+import * as _base_ui_components_react_menubar from '@base-ui-components/react/menubar';
+import { Menubar as Menubar$1 } from '@base-ui-components/react/menubar';
+import * as _base_ui_components_react_context_menu from '@base-ui-components/react/context-menu';
+import { ContextMenu as ContextMenu$1 } from '@base-ui-components/react/context-menu';
+import * as _base_ui_components_react_toggle from '@base-ui-components/react/toggle';
+import { Toggle as Toggle$1 } from '@base-ui-components/react/toggle';
+import * as _base_ui_components_react_toggle_group from '@base-ui-components/react/toggle-group';
+import { ToggleGroup as ToggleGroup$1 } from '@base-ui-components/react/toggle-group';
+import * as _base_ui_components_react_field from '@base-ui-components/react/field';
+import { Field as Field$1 } from '@base-ui-components/react/field';
+import { Form as Form$1 } from '@base-ui-components/react/form';
+import { Switch as Switch$1 } from '@base-ui-components/react/switch';
+import { Collapsible as Collapsible$1 } from '@base-ui-components/react/collapsible';
+import { AlertDialog as AlertDialog$1 } from '@base-ui-components/react/alert-dialog';
+import { Select as Select$1 } from '@base-ui-components/react/select';
+import { Combobox as Combobox$1 } from '@base-ui-components/react/combobox';
+import { Autocomplete as Autocomplete$1 } from '@base-ui-components/react/autocomplete';
+import { Popover as Popover$1 } from '@base-ui-components/react/popover';
+import { Tooltip as Tooltip$1 } from '@base-ui-components/react/tooltip';
+import { Tabs as Tabs$1 } from '@base-ui-components/react/tabs';
+
+/**
+ * Shared token unions used across Silica components.
+ *
+ * `SilicaColor` lists the built-in semantic colors for autocomplete but also
+ * accepts any custom color string (the `(string & {})` trick keeps the literal
+ * suggestions while still allowing arbitrary user-defined colors registered via
+ * `@plugin "silicaui" { colors: … }`).
+ */
+type SilicaColor = "primary" | "secondary" | "accent" | "neutral" | "info" | "success" | "warning" | "error" | (string & {});
+type SilicaSize = "xs" | "sm" | "md" | "lg" | "xl";
+
+/** Semantic or custom color. Alias of the shared {@link SilicaColor}. */
+type ButtonColor = SilicaColor;
+type ButtonVariant = "solid" | "outline" | "soft" | "ghost" | "link" | "dash";
+type ButtonSize = SilicaSize;
+interface ButtonProps extends React.ButtonHTMLAttributes<HTMLButtonElement> {
+    /** Semantic or custom color; maps to `btn-<color>`. */
+    color?: ButtonColor;
+    /** How the color is applied. Default `solid`. */
+    variant?: ButtonVariant;
+    /** Default `md`. */
+    size?: ButtonSize;
+    /** Icon-only button shape. */
+    shape?: "square" | "circle";
+    /** Full-width. */
+    block?: boolean;
+    /** Extra-wide. */
+    wide?: boolean;
+    /** Force the pressed look. */
+    active?: boolean;
+    /** Show a spinner, set `aria-busy`, and make the button non-interactive. */
+    loading?: boolean;
+    iconStart?: React.ReactNode;
+    iconEnd?: React.ReactNode;
+    /**
+     * Render as a different element (e.g. an anchor or router link) while keeping
+     * Silica's classes and behavior. Mirrors Base UI's `render` composition model.
+     *
+     *   <Button render={<a href="/docs" />}>Docs</Button>
+     */
+    render?: React.ReactElement;
+}
+/**
+ * Silica Button — a thin wrapper that applies Silica's `btn` classes. It's a
+ * presentational component, so it doesn't pull in a headless primitive; the
+ * `render` prop covers polymorphism.
+ */
+declare const Button: React.ForwardRefExoticComponent<ButtonProps & React.RefAttributes<HTMLButtonElement>>;
+
+type BadgeColor = SilicaColor;
+type BadgeVariant = "solid" | "outline" | "soft" | "ghost" | "dash";
+type BadgeSize = SilicaSize;
+interface BadgeProps extends React.HTMLAttributes<HTMLSpanElement> {
+    /** Semantic or custom color; maps to `badge-<color>`. */
+    color?: BadgeColor;
+    /** How the color is applied. Default `solid`. */
+    variant?: BadgeVariant;
+    /** Default `md`. */
+    size?: BadgeSize;
+    /** Render as a different element while keeping Silica's classes. */
+    render?: React.ReactElement;
+}
+/**
+ * Silica Badge — a small pill for labels, counts, and statuses. Presentational;
+ * `render` covers polymorphism (e.g. wrap a link).
+ */
+declare const Badge: React.ForwardRefExoticComponent<BadgeProps & React.RefAttributes<HTMLSpanElement>>;
+
+type InputColor = SilicaColor;
+type InputSize = SilicaSize;
+interface InputProps extends Omit<React.InputHTMLAttributes<HTMLInputElement>, "size" | "color"> {
+    /** Accent color; maps to `input-<color>` (border + focus ring). */
+    color?: InputColor;
+    /** Default `md`. Matches same-size Button heights. */
+    size?: InputSize;
+}
+/**
+ * Silica Input — a single-line text field. Thin, presentational wrapper around a
+ * native `<input>`, so all native attributes (`type`, `value`, `onChange`,
+ * `placeholder`, `disabled`, …) pass straight through.
+ */
+declare const Input: React.ForwardRefExoticComponent<InputProps & React.RefAttributes<HTMLInputElement>>;
+
+type NativeSelectColor = SilicaColor;
+type NativeSelectSize = SilicaSize;
+interface NativeSelectProps extends Omit<React.SelectHTMLAttributes<HTMLSelectElement>, "size" | "color"> {
+    /** Accent color; maps to `select-<color>` (border + focus ring). */
+    color?: NativeSelectColor;
+    /** Default `md`. Matches same-size Input/Button heights. */
+    size?: NativeSelectSize;
+}
+/**
+ * Silica NativeSelect — a native `<select>` restyled to the field tier. Thin,
+ * presentational wrapper: pass `<option>`s as children and all native
+ * attributes (`value`, `defaultValue`, `onChange`, `disabled`, …) through.
+ *
+ * For a rich, searchable, fully-styled listbox (custom popup, groups, keyboard
+ * typeahead, multi-select), use `Select` (the Base UI listbox) instead.
+ */
+declare const NativeSelect: React.ForwardRefExoticComponent<NativeSelectProps & React.RefAttributes<HTMLSelectElement>>;
+
+type TextareaColor = SilicaColor;
+type TextareaSize = SilicaSize;
+interface TextareaProps extends Omit<React.TextareaHTMLAttributes<HTMLTextAreaElement>, "color"> {
+    /** Accent color; maps to `textarea-<color>` (border + focus ring). */
+    color?: TextareaColor;
+    /** Default `md`. */
+    size?: TextareaSize;
+}
+/**
+ * Silica Textarea — a multi-line text field. Thin, presentational wrapper around
+ * a native `<textarea>`, so all native attributes (`value`, `rows`, `onChange`,
+ * `placeholder`, `disabled`, …) pass straight through.
+ */
+declare const Textarea: React.ForwardRefExoticComponent<TextareaProps & React.RefAttributes<HTMLTextAreaElement>>;
+
+type CardProps = React.HTMLAttributes<HTMLDivElement>;
+/**
+ * Silica Card — a surface container. Compose it from parts:
+ *
+ *   <Card>
+ *     <figure><img src={cover} alt="" /></figure>
+ *     <CardBody>
+ *       <CardTitle>Heading</CardTitle>
+ *       <p>Body copy…</p>
+ *       <CardActions>
+ *         <Button color="primary">Action</Button>
+ *       </CardActions>
+ *     </CardBody>
+ *   </Card>
+ */
+declare const Card: React.ForwardRefExoticComponent<CardProps & React.RefAttributes<HTMLDivElement>>;
+/** Padded content stack inside a Card. */
+declare const CardBody: React.ForwardRefExoticComponent<CardProps & React.RefAttributes<HTMLDivElement>>;
+/** Card heading. Renders a `div` — pair with your own heading level if needed. */
+declare const CardTitle: React.ForwardRefExoticComponent<CardProps & React.RefAttributes<HTMLDivElement>>;
+/** Right-aligned action row (buttons, links) at the bottom of a Card body. */
+declare const CardActions: React.ForwardRefExoticComponent<CardProps & React.RefAttributes<HTMLDivElement>>;
+
+type AlertColor = SilicaColor;
+type AlertSize = SilicaSize;
+type AlertVariant = "solid" | "soft" | "outline" | "dash";
+interface AlertProps extends Omit<React.HTMLAttributes<HTMLDivElement>, "color"> {
+    /** Semantic color; maps to `alert-<color>`. Omit for a neutral surface. */
+    color?: AlertColor;
+    /** Visual style. Default `solid`. */
+    variant?: AlertVariant;
+    /** Default `md`. */
+    size?: AlertSize;
+}
+/**
+ * Silica Alert — a feedback surface. Compose it from parts, like Card:
+ *
+ *   // One-liner: icon + message
+ *   <Alert color="success"><CheckIcon /> Your changes were saved.</Alert>
+ *
+ *   // Structured: title + description + trailing actions
+ *   <Alert color="error">
+ *     <XIcon />
+ *     <AlertContent>
+ *       <AlertTitle>Upload failed</AlertTitle>
+ *       <AlertDescription>The file exceeds the 5 MB limit.</AlertDescription>
+ *     </AlertContent>
+ *     <AlertActions>
+ *       <Button size="sm" color="error" variant="soft">Retry</Button>
+ *     </AlertActions>
+ *   </Alert>
+ *
+ * A leading `<svg>` child is sized automatically. Defaults to `role="alert"`
+ * (assertive); pass `role="status"` for a quieter, non-interrupting announcement.
+ */
+declare const Alert: React.ForwardRefExoticComponent<AlertProps & React.RefAttributes<HTMLDivElement>>;
+/** Growing middle column of an Alert — holds the title + description. */
+declare const AlertContent: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & React.RefAttributes<HTMLDivElement>>;
+/** Bold heading line of an Alert. */
+declare const AlertTitle: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & React.RefAttributes<HTMLDivElement>>;
+/** Secondary message line under an AlertTitle. */
+declare const AlertDescription: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & React.RefAttributes<HTMLDivElement>>;
+/** Trailing action group (buttons, links) at the end of an Alert row. */
+declare const AlertActions: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & React.RefAttributes<HTMLDivElement>>;
+
+type ProgressColor = SilicaColor;
+type ProgressSize = SilicaSize;
+interface ProgressProps extends Omit<React.HTMLAttributes<HTMLDivElement>, "color" | "children"> {
+    /** Fill color; maps to `progress-<color>`. Omit for a neutral bar. */
+    color?: ProgressColor;
+    /** Default `md`. Height lines up with same-size fields. */
+    size?: ProgressSize;
+    /**
+     * Current value, from 0 to `max`. Omit entirely for an indeterminate
+     * (unknown-duration) loading bar.
+     */
+    value?: number;
+    /** Upper bound of `value`. Default `100`. */
+    max?: number;
+}
+/**
+ * Silica Progress — a task-completion bar (div-based, so it renders identically
+ * across engines; see the CSS component for why not native `<progress>`).
+ *
+ *   <Progress value={60} />                  // 60%
+ *   <Progress color="success" value={3} max={4} />
+ *   <Progress />                             // indeterminate
+ *
+ * Exposes the ARIA `progressbar` role with the right value bounds; an
+ * indeterminate bar omits `aria-valuenow` so assistive tech announces it as
+ * busy rather than a fixed percentage.
+ */
+declare const Progress: React.ForwardRefExoticComponent<ProgressProps & React.RefAttributes<HTMLDivElement>>;
+
+type AvatarColor = SilicaColor;
+type AvatarSize = SilicaSize;
+type AvatarShape = "circle" | "rounded";
+type AvatarStatus = "online" | "offline";
+interface AvatarProps extends Omit<React.HTMLAttributes<HTMLSpanElement>, "color"> {
+    /** Fallback-chip + ring color; maps to `avatar-<color>`. */
+    color?: AvatarColor;
+    /** Default `md`. */
+    size?: AvatarSize;
+    /** `circle` (default) or a `rounded` square. */
+    shape?: AvatarShape;
+    /** Draw an accent ring with a base-100 gap. */
+    ring?: boolean;
+    /** Presence dot in the corner. */
+    status?: AvatarStatus;
+    /** Photo URL. If it fails to load, the fallback `children` show instead. */
+    src?: string;
+    /** Accessible label for the photo / the initials fallback. */
+    alt?: string;
+}
+/**
+ * Silica Avatar — a photo, or an initials/icon fallback on a colored chip.
+ *
+ *   <Avatar src={url} alt="Jane Doe">JD</Avatar>   // photo, falls back to "JD"
+ *   <Avatar color="primary" alt="Ada Lovelace">AL</Avatar>   // initials chip
+ *   <Avatar color="accent"><UserIcon /></Avatar>            // icon fallback
+ *
+ * `children` are the fallback shown when there's no `src` or the image errors.
+ * When falling back to initials with an `alt`, the container is exposed as an
+ * `img` with that label so assistive tech announces the person, not "JD".
+ */
+declare const Avatar: React.ForwardRefExoticComponent<AvatarProps & React.RefAttributes<HTMLSpanElement>>;
+/** Overlapping row of Avatars (`<Avatar>` children stack with a base-100 gap). */
+declare const AvatarGroup: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLSpanElement> & React.RefAttributes<HTMLSpanElement>>;
+
+type SkeletonShape = "block" | "circle" | "text";
+interface SkeletonProps extends React.HTMLAttributes<HTMLDivElement> {
+    /**
+     * `block` (default, `--radius-field`), `circle` (avatar/dot placeholder), or
+     * `text` (a pill-rounded line sized in `em`). Give it dimensions with
+     * utilities or inline `style`.
+     */
+    shape?: SkeletonShape;
+}
+/**
+ * Silica Skeleton — an animated placeholder for loading content.
+ *
+ *   <Skeleton className="h-32 w-full" />              // block
+ *   <Skeleton shape="circle" className="h-12 w-12" /> // avatar placeholder
+ *   <Skeleton shape="text" className="w-40" />        // one line of text
+ *
+ * Owns only the fill, radius, and shimmer — size it yourself. Marked
+ * `aria-hidden` by default (it's decorative; announce loading with an
+ * `aria-busy` region around it); override via props if you need otherwise.
+ */
+declare const Skeleton: React.ForwardRefExoticComponent<SkeletonProps & React.RefAttributes<HTMLDivElement>>;
+
+type TableSize = SilicaSize;
+interface TableProps extends React.TableHTMLAttributes<HTMLTableElement> {
+    /** Striped rows. */
+    zebra?: boolean;
+    /** Highlight the row under the cursor. */
+    hover?: boolean;
+    /** Default `md`. Scales cell padding + type. */
+    size?: TableSize;
+    /** Class for the horizontal-scroll wrapper (the outer `<div>`). */
+    wrapperClassName?: string;
+}
+/**
+ * Silica Table — a styled `<table>`. Compose it from plain semantic rows; the
+ * CSS styles the native elements, so no per-cell classes are needed:
+ *
+ *   <Table zebra hover>
+ *     <thead>
+ *       <tr><th>Name</th><th>Role</th></tr>
+ *     </thead>
+ *     <tbody>
+ *       <tr><td>Ada</td><td>Engineer</td></tr>
+ *     </tbody>
+ *   </Table>
+ *
+ * Auto-wrapped in an `overflow-x: auto` container so a wide table scrolls
+ * instead of blowing out the page; `ref`/`className` land on the `<table>`.
+ */
+declare const Table: React.ForwardRefExoticComponent<TableProps & React.RefAttributes<HTMLTableElement>>;
+
+type DividerOrientation = "horizontal" | "vertical";
+interface DividerProps extends React.HTMLAttributes<HTMLDivElement> {
+    /** `horizontal` (default) or `vertical` (for row layouts). */
+    orientation?: DividerOrientation;
+}
+/**
+ * Silica Divider — a plain or labeled separator.
+ *
+ *   <Divider />              // plain rule
+ *   <Divider>OR</Divider>    // centered label with rules on each side
+ *   <Divider orientation="vertical" />   // vertical rule inside a flex row
+ */
+declare const Divider: React.ForwardRefExoticComponent<DividerProps & React.RefAttributes<HTMLDivElement>>;
+
+type KbdSize = SilicaSize;
+interface KbdProps extends React.HTMLAttributes<HTMLElement> {
+    /** Default `md`. Scales the (em-based) keycap with the surrounding text. */
+    size?: KbdSize;
+}
+/**
+ * Silica Kbd — an inline keyboard-key cap.
+ *
+ *   Press <Kbd>⌘</Kbd> <Kbd>K</Kbd> to search.
+ */
+declare const Kbd: React.ForwardRefExoticComponent<KbdProps & React.RefAttributes<HTMLElement>>;
+
+interface BreadcrumbProps extends React.HTMLAttributes<HTMLElement> {
+}
+/**
+ * Silica Breadcrumb — a navigation trail. Pass `<li>` items as children; the
+ * chevron separators are drawn by CSS, so no separator markup is needed.
+ *
+ *   <Breadcrumb>
+ *     <li><a href="/">Home</a></li>
+ *     <li><a href="/projects">Projects</a></li>
+ *     <li><span aria-current="page">Silica</span></li>
+ *   </Breadcrumb>
+ */
+declare const Breadcrumb: React.ForwardRefExoticComponent<BreadcrumbProps & React.RefAttributes<HTMLElement>>;
+
+interface StatsProps extends React.HTMLAttributes<HTMLDivElement> {
+    /** Stack the blocks vertically instead of inline. */
+    vertical?: boolean;
+}
+/** Container for a row (or column) of `<Stat>` blocks. */
+declare const Stats: React.ForwardRefExoticComponent<StatsProps & React.RefAttributes<HTMLDivElement>>;
+interface StatProps extends React.HTMLAttributes<HTMLDivElement> {
+}
+/**
+ * Silica Stat — a single metric block. Compose from parts:
+ *
+ *   <Stats>
+ *     <Stat>
+ *       <StatFigure><ChartIcon /></StatFigure>
+ *       <StatTitle>Revenue</StatTitle>
+ *       <StatValue>$42.8k</StatValue>
+ *       <StatDesc>↗︎ 12% this month</StatDesc>
+ *     </Stat>
+ *   </Stats>
+ */
+declare const Stat: React.ForwardRefExoticComponent<StatProps & React.RefAttributes<HTMLDivElement>>;
+/** Muted label above the value. */
+declare const StatTitle: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & React.RefAttributes<HTMLDivElement>>;
+/** The headline metric. */
+declare const StatValue: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & React.RefAttributes<HTMLDivElement>>;
+/** Secondary line under the value (trend, context). */
+declare const StatDesc: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & React.RefAttributes<HTMLDivElement>>;
+/** Trailing figure/icon, centered beside the text (defaults to primary). */
+declare const StatFigure: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & React.RefAttributes<HTMLDivElement>>;
+
+type StepColor = SilicaColor;
+interface StepsProps extends React.OlHTMLAttributes<HTMLOListElement> {
+}
+/**
+ * Silica Steps — a horizontal progress tracker. Children are `<Step>`s; color
+ * the ones up to (and including) the current step to show completion.
+ *
+ *   <Steps>
+ *     <Step color="primary" data-content="✓">Cart</Step>
+ *     <Step color="primary">Shipping</Step>
+ *     <Step>Payment</Step>
+ *     <Step>Done</Step>
+ *   </Steps>
+ */
+declare const Steps: React.ForwardRefExoticComponent<StepsProps & React.RefAttributes<HTMLOListElement>>;
+interface StepProps extends React.LiHTMLAttributes<HTMLLIElement> {
+    /** Paints the node + incoming connector; maps to `step-<color>`. */
+    color?: StepColor;
+    /** Glyph shown in the node instead of its number (e.g. a check). */
+    "data-content"?: string;
+}
+/** A single node + label in a `<Steps>` track. */
+declare const Step: React.ForwardRefExoticComponent<StepProps & React.RefAttributes<HTMLLIElement>>;
+
+type JoinOrientation = "horizontal" | "vertical";
+interface JoinProps extends React.HTMLAttributes<HTMLDivElement> {
+    /** `horizontal` (default) or `vertical`. */
+    orientation?: JoinOrientation;
+}
+/**
+ * Silica Join — merges its children into one seamless segmented group.
+ *
+ *   <Join>
+ *     <Button>Day</Button>
+ *     <Button>Week</Button>
+ *     <Button>Month</Button>
+ *   </Join>
+ *
+ *   <Join>
+ *     <Input placeholder="Search…" />
+ *     <Button color="primary">Go</Button>
+ *   </Join>
+ */
+declare const Join: React.ForwardRefExoticComponent<JoinProps & React.RefAttributes<HTMLDivElement>>;
+
+interface MenuProps extends React.HTMLAttributes<HTMLUListElement> {
+}
+/**
+ * Silica Menu — a styled list of links/actions.
+ *
+ *   <Menu>
+ *     <MenuTitle>Workspace</MenuTitle>
+ *     <MenuItem><a href="/" aria-current="page">Overview</a></MenuItem>
+ *     <MenuItem><a href="/team">Team</a></MenuItem>
+ *     <MenuItem><button type="button">Sign out</button></MenuItem>
+ *   </Menu>
+ */
+declare const Menu: React.ForwardRefExoticComponent<MenuProps & React.RefAttributes<HTMLUListElement>>;
+/** A single item row — wraps an `<a>` or `<button>`. */
+declare const MenuItem: React.ForwardRefExoticComponent<React.LiHTMLAttributes<HTMLLIElement> & React.RefAttributes<HTMLLIElement>>;
+/** A muted section label between items. */
+declare const MenuTitle: React.ForwardRefExoticComponent<React.LiHTMLAttributes<HTMLLIElement> & React.RefAttributes<HTMLLIElement>>;
+
+interface CollapseProps extends React.DetailsHTMLAttributes<HTMLDetailsElement> {
+    /** Drop the surface for a flush, borderless accordion row. */
+    ghost?: boolean;
+}
+/**
+ * Silica Collapse — a native `<details>` disclosure. Give several the same
+ * `name` for an exclusive accordion (only one open at a time).
+ *
+ *   <Collapse>
+ *     <CollapseTitle>Shipping</CollapseTitle>
+ *     <CollapseContent>Ships in 2–3 business days.</CollapseContent>
+ *   </Collapse>
+ *
+ *   <Collapse name="faq" open>…</Collapse>
+ *   <Collapse name="faq">…</Collapse>
+ */
+declare const Collapse: React.ForwardRefExoticComponent<CollapseProps & React.RefAttributes<HTMLDetailsElement>>;
+/** The clickable header (renders a `<summary>`). */
+declare const CollapseTitle: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLElement> & React.RefAttributes<HTMLElement>>;
+/** The disclosed body. */
+declare const CollapseContent: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & React.RefAttributes<HTMLDivElement>>;
+
+type IndicatorPlacement = "top-end" | "top-start" | "bottom-end" | "bottom-start";
+interface IndicatorProps extends React.HTMLAttributes<HTMLSpanElement> {
+}
+/**
+ * Silica Indicator — pins an overlay to a corner of its content.
+ *
+ *   <Indicator>
+ *     <IndicatorItem><Badge color="error" size="xs">3</Badge></IndicatorItem>
+ *     <Button variant="outline">Inbox</Button>
+ *   </Indicator>
+ *
+ * The item comes first; the element it decorates follows.
+ */
+declare const Indicator: React.ForwardRefExoticComponent<IndicatorProps & React.RefAttributes<HTMLSpanElement>>;
+interface IndicatorItemProps extends React.HTMLAttributes<HTMLSpanElement> {
+    /** Which corner. Default `top-end`. */
+    placement?: IndicatorPlacement;
+}
+/** The pinned overlay (usually a Badge or dot). */
+declare const IndicatorItem: React.ForwardRefExoticComponent<IndicatorItemProps & React.RefAttributes<HTMLSpanElement>>;
+
+type LoadingSize = SilicaSize;
+interface LoadingProps extends React.HTMLAttributes<HTMLSpanElement> {
+    /** Default `md`. */
+    size?: LoadingSize;
+    /** Accessible label announced to assistive tech. Default "Loading". */
+    label?: string;
+}
+/**
+ * Silica Loading — a spinner. Inherits `currentColor`, so color it with a
+ * `text-*` utility or let it match the surrounding text.
+ *
+ *   <Loading />
+ *   <Loading size="sm" className="text-primary" />
+ *   <Button loading>Saving…</Button>   // Button has its own built-in spinner
+ */
+declare const Loading: React.ForwardRefExoticComponent<LoadingProps & React.RefAttributes<HTMLSpanElement>>;
+
+type ProseSize = "sm" | "md" | "lg" | "xl";
+interface ProseProps extends React.HTMLAttributes<HTMLDivElement> {
+    /** Default `md`. Rescales the whole block by one root font-size. */
+    size?: ProseSize;
+}
+/**
+ * Silica Prose — typographic defaults for a block of rich/markdown content.
+ * Wrap raw HTML (or a Markdown renderer's output) and it gets themed headings,
+ * lists, quotes, code, tables, and rhythm — scoped to this block only.
+ *
+ *   <Prose>
+ *     <h1>Title</h1>
+ *     <p>Body copy with a <a href="#">link</a> and <code>inline code</code>.</p>
+ *   </Prose>
+ *
+ *   <Prose dangerouslySetInnerHTML={{ __html: renderedMarkdown }} />
+ *
+ * Caps width at 65ch for readability — add `max-w-none` to remove.
+ */
+declare const Prose: React.ForwardRefExoticComponent<ProseProps & React.RefAttributes<HTMLDivElement>>;
+
+/**
+ * Typography components for silicaui's UI type ramp (see the `typography` plugin
+ * module). They keep the *semantic* element and its *visual* size independent: a
+ * `<Heading level={1} size={3}>` is an `<h1>` for the document outline but reads
+ * as an h3. With no `size`, a heading just inherits its tag's global default, so
+ * `<Heading level={2} />` and a bare `<h2>` match.
+ */
+type HeadingLevel = 1 | 2 | 3 | 4 | 5 | 6;
+interface HeadingProps extends React.HTMLAttributes<HTMLHeadingElement> {
+    /** Semantic level → renders `<h1>`…`<h6>`. Default 2. */
+    level?: HeadingLevel;
+    /** Visual size override (`1`–`6` or `"display"`); omit to use the tag default. */
+    size?: HeadingLevel | "display";
+}
+/** A heading whose semantic level and visual size are set independently. */
+declare const Heading: React.ForwardRefExoticComponent<HeadingProps & React.RefAttributes<HTMLHeadingElement>>;
+interface DisplayProps extends React.HTMLAttributes<HTMLHeadingElement> {
+    /** Semantic level for the outline (the look is always `.display`). Default 1. */
+    level?: HeadingLevel;
+}
+/** Oversized hero/display heading (`.display`) on a semantic heading element. */
+declare const Display: React.ForwardRefExoticComponent<DisplayProps & React.RefAttributes<HTMLHeadingElement>>;
+type TextVariant = "body" | "lead" | "caption";
+interface TextProps extends React.HTMLAttributes<HTMLElement> {
+    /** `body` (default), `lead` (larger intro), or `caption` (small, muted). */
+    variant?: TextVariant;
+    /** Element to render. Default `p`. */
+    as?: React.ElementType;
+}
+/** Body-copy text with a semantic variant. `body` carries no class (bare `<p>`). */
+declare const Text: React.ForwardRefExoticComponent<TextProps & React.RefAttributes<HTMLElement>>;
+
+type NavbarProps = React.HTMLAttributes<HTMLDivElement>;
+/**
+ * Silica Navbar — a top bar with optional start / center / end slots.
+ *
+ *   <Navbar>
+ *     <NavbarStart><a className="text-lg font-bold">Silica</a></NavbarStart>
+ *     <NavbarCenter>…nav links…</NavbarCenter>
+ *     <NavbarEnd><Button>Sign in</Button></NavbarEnd>
+ *   </Navbar>
+ */
+declare const Navbar: React.ForwardRefExoticComponent<NavbarProps & React.RefAttributes<HTMLDivElement>>;
+declare const NavbarStart: React.ForwardRefExoticComponent<NavbarProps & React.RefAttributes<HTMLDivElement>>;
+declare const NavbarCenter: React.ForwardRefExoticComponent<NavbarProps & React.RefAttributes<HTMLDivElement>>;
+declare const NavbarEnd: React.ForwardRefExoticComponent<NavbarProps & React.RefAttributes<HTMLDivElement>>;
+
+interface FooterProps extends React.HTMLAttributes<HTMLElement> {
+    /** Center every column and its contents (single-row, centered footer). */
+    center?: boolean;
+}
+/**
+ * Silica Footer — a responsive multi-column site footer.
+ *
+ *   <Footer>
+ *     <nav>
+ *       <FooterTitle>Product</FooterTitle>
+ *       <Link href="#">Features</Link>
+ *       <Link href="#">Pricing</Link>
+ *     </nav>
+ *     …more columns…
+ *   </Footer>
+ *
+ * Renders a `<footer>`. Each direct child (e.g. a `<nav>`) becomes a vertical
+ * stack of links under its `<FooterTitle>`.
+ */
+declare const Footer: React.ForwardRefExoticComponent<FooterProps & React.RefAttributes<HTMLElement>>;
+type FooterTitleProps = React.HTMLAttributes<HTMLElement>;
+/** A small, muted, upper-cased heading for a footer column. Renders `<h6>`. */
+declare const FooterTitle: React.ForwardRefExoticComponent<FooterTitleProps & React.RefAttributes<HTMLHeadingElement>>;
+
+type HeroProps = React.HTMLAttributes<HTMLDivElement>;
+/**
+ * Silica Hero — a full-width banner that centers its content.
+ *
+ *   <Hero style={{ backgroundImage: `url(${img})` }}>
+ *     <HeroOverlay />
+ *     <HeroContent className="text-neutral-content text-center">
+ *       <div>
+ *         <h1 className="text-5xl font-bold">Ship faster</h1>
+ *         <p>…</p>
+ *         <Button color="primary">Get started</Button>
+ *       </div>
+ *     </HeroContent>
+ *   </Hero>
+ *
+ * Set a background image via the `style` prop; add `<HeroOverlay />` to tint it.
+ */
+declare const Hero: React.ForwardRefExoticComponent<HeroProps & React.RefAttributes<HTMLDivElement>>;
+declare const HeroContent: React.ForwardRefExoticComponent<HeroProps & React.RefAttributes<HTMLDivElement>>;
+/** A translucent dark layer that tints the hero's background image. */
+declare const HeroOverlay: React.ForwardRefExoticComponent<HeroProps & React.RefAttributes<HTMLDivElement>>;
+
+type LinkColor = SilicaColor;
+interface LinkProps extends React.AnchorHTMLAttributes<HTMLAnchorElement> {
+    /** Accent color; maps to `link-<color>`. Defaults to the surrounding text color. */
+    color?: LinkColor;
+    /** Show the underline only on hover / focus. */
+    hover?: boolean;
+}
+/**
+ * Silica Link — a styled inline anchor.
+ *
+ *   <Link href="/docs">Docs</Link>
+ *   <Link href="/pricing" color="primary">Pricing</Link>
+ *   <Link href="#" hover>Underlines on hover</Link>
+ */
+declare const Link: React.ForwardRefExoticComponent<LinkProps & React.RefAttributes<HTMLAnchorElement>>;
+
+type MockupWindowProps = React.HTMLAttributes<HTMLDivElement>;
+/**
+ * Silica MockupWindow — an app window frame with faux traffic-light dots.
+ *
+ *   <MockupWindow>
+ *     <div className="p-8 text-center">Hello!</div>
+ *   </MockupWindow>
+ */
+declare const MockupWindow: React.ForwardRefExoticComponent<MockupWindowProps & React.RefAttributes<HTMLDivElement>>;
+interface MockupBrowserProps extends React.HTMLAttributes<HTMLDivElement> {
+    /** Text shown in the faux address bar. */
+    url?: string;
+    /** Replace the address bar with custom toolbar content. */
+    toolbar?: React.ReactNode;
+}
+/**
+ * Silica MockupBrowser — a browser frame with a toolbar and faux address bar.
+ *
+ *   <MockupBrowser url="https://silica.ui">
+ *     <div className="p-8 text-center">Your page</div>
+ *   </MockupBrowser>
+ */
+declare const MockupBrowser: React.ForwardRefExoticComponent<MockupBrowserProps & React.RefAttributes<HTMLDivElement>>;
+type MockupCodeProps = React.HTMLAttributes<HTMLDivElement>;
+/**
+ * Silica MockupCode — a dark terminal / code block. Compose it from
+ * `<MockupCodeLine>` rows (each renders a `<pre data-prefix>`).
+ *
+ *   <MockupCode>
+ *     <MockupCodeLine prefix="$">npm i silicaui</MockupCodeLine>
+ *     <MockupCodeLine prefix=">" className="text-success">done</MockupCodeLine>
+ *   </MockupCode>
+ */
+declare const MockupCode: React.ForwardRefExoticComponent<MockupCodeProps & React.RefAttributes<HTMLDivElement>>;
+interface MockupCodeLineProps extends React.HTMLAttributes<HTMLPreElement> {
+    /** Gutter prefix rendered before the line (e.g. `$`, `>`, a line number). */
+    prefix?: string;
+}
+/** A single line inside `<MockupCode>`. Renders `<pre data-prefix>`. */
+declare const MockupCodeLine: React.ForwardRefExoticComponent<MockupCodeLineProps & React.RefAttributes<HTMLPreElement>>;
+type MockupPhoneProps = React.HTMLAttributes<HTMLDivElement>;
+/**
+ * Silica MockupPhone — a phone frame with a camera notch.
+ *
+ *   <MockupPhone>
+ *     <div className="p-6 pt-10">Your app screen</div>
+ *   </MockupPhone>
+ *
+ * Children render inside the display; the bezel and notch are supplied by the
+ * frame. Give top content some `pt` so it clears the notch.
+ */
+declare const MockupPhone: React.ForwardRefExoticComponent<MockupPhoneProps & React.RefAttributes<HTMLDivElement>>;
+
+type TimelineOrientation = "vertical" | "horizontal";
+interface TimelineProps extends React.HTMLAttributes<HTMLUListElement> {
+    /** `vertical` (default) or `horizontal`. */
+    orientation?: TimelineOrientation;
+}
+/**
+ * Silica Timeline — a sequence of dated events with a connecting rail.
+ *
+ *   <Timeline>
+ *     <TimelineItem>
+ *       <TimelineStart>2021</TimelineStart>
+ *       <TimelineMiddle />
+ *       <TimelineEnd box>Founded</TimelineEnd>
+ *     </TimelineItem>
+ *     <TimelineItem>
+ *       <TimelineStart>2024</TimelineStart>
+ *       <TimelineMiddle />
+ *       <TimelineEnd box>Shipped 1.0</TimelineEnd>
+ *     </TimelineItem>
+ *   </Timeline>
+ *
+ * Renders `<ul>` / `<li>`. Any slot is optional — omit `<TimelineStart>` for a
+ * one-sided timeline. `<TimelineMiddle>` renders a default dot when empty.
+ */
+declare const Timeline: React.ForwardRefExoticComponent<TimelineProps & React.RefAttributes<HTMLUListElement>>;
+type TimelineItemProps = React.LiHTMLAttributes<HTMLLIElement>;
+declare const TimelineItem: React.ForwardRefExoticComponent<TimelineItemProps & React.RefAttributes<HTMLLIElement>>;
+type TimelineStartProps = React.HTMLAttributes<HTMLDivElement>;
+/** The opposite-side label (e.g. a date). */
+declare const TimelineStart: React.ForwardRefExoticComponent<TimelineStartProps & React.RefAttributes<HTMLDivElement>>;
+type TimelineMiddleProps = React.HTMLAttributes<HTMLDivElement>;
+/** The marker on the rail. Renders a default dot when given no children. */
+declare const TimelineMiddle: React.ForwardRefExoticComponent<TimelineMiddleProps & React.RefAttributes<HTMLDivElement>>;
+interface TimelineEndProps extends React.HTMLAttributes<HTMLDivElement> {
+    /** Wrap the content in a bordered card. */
+    box?: boolean;
+}
+/** The event content. Set `box` to wrap it in a bordered card. */
+declare const TimelineEnd: React.ForwardRefExoticComponent<TimelineEndProps & React.RefAttributes<HTMLDivElement>>;
+
+type CarouselSnap = "start" | "center" | "end";
+type CarouselOrientation = "horizontal" | "vertical";
+interface CarouselProps extends Omit<React.HTMLAttributes<HTMLDivElement>, "onChange"> {
+    /** Snap alignment of items. `start` (default), `center`, or `end`. */
+    snap?: CarouselSnap;
+    /** `horizontal` (default) or `vertical`. */
+    orientation?: CarouselOrientation;
+    /** Show prev/next controls. Default `true`. */
+    controls?: boolean;
+    /** Bottom indicators: `dots` (default), `numbers` (paged), or `false` to hide. */
+    indicators?: boolean | "dots" | "numbers";
+    /** Wrap around past the first/last slide. Default `false`. */
+    loop?: boolean;
+    /** Auto-advance every N ms (pauses on hover/focus). Off by default. */
+    autoplay?: number;
+    /** Called with the active slide index whenever it changes. */
+    onChange?: (index: number) => void;
+    /** Extra class for the scroll surface. */
+    className?: string;
+}
+/**
+ * Silica Carousel — a scroll-snap strip driven by real prev/next controls and
+ * dot indicators (with optional loop + autoplay), not just a scrollable list.
+ *
+ *   <Carousel loop autoplay={4000} className="gap-4 rounded-box">
+ *     <CarouselItem className="w-full"><img … /></CarouselItem>
+ *     <CarouselItem className="w-full"><img … /></CarouselItem>
+ *   </Carousel>
+ */
+declare function Carousel({ snap, orientation, controls, indicators, loop, autoplay, onChange, className, children, ...rest }: CarouselProps): React.JSX.Element;
+type CarouselItemProps = React.HTMLAttributes<HTMLDivElement>;
+declare const CarouselItem: React.ForwardRefExoticComponent<CarouselItemProps & React.RefAttributes<HTMLDivElement>>;
+
+type StackPeek = "top" | "bottom" | "start" | "end";
+interface StackProps extends React.HTMLAttributes<HTMLDivElement> {
+    /** Which way the deck peeks. `top` (default), `bottom`, `start`, or `end`. */
+    peek?: StackPeek;
+    /** Make the deck clickable — sends the front card to the back to reveal the next. */
+    interactive?: boolean;
+}
+/**
+ * Silica Stack — layers its children into a peeking deck (first child on top).
+ * With `interactive`, clicking (or Enter/Space) cycles the front card to the
+ * back so you can flip through the deck; the re-stack animates.
+ *
+ *   <Stack interactive>
+ *     <Card className="bg-primary text-primary-content"><CardBody>1</CardBody></Card>
+ *     <Card className="bg-secondary text-secondary-content"><CardBody>2</CardBody></Card>
+ *     <Card className="bg-accent text-accent-content"><CardBody>3</CardBody></Card>
+ *   </Stack>
+ */
+declare function Stack({ peek, interactive, className, children, onClick, onKeyDown, ...rest }: StackProps): React.JSX.Element;
+
+type RatingColor = SilicaColor;
+type RatingSize = SilicaSize;
+interface RatingProps extends Omit<React.HTMLAttributes<HTMLDivElement>, "onChange" | "defaultValue"> {
+    /** Controlled value (number of filled stars). */
+    value?: number;
+    /** Initial value when uncontrolled. */
+    defaultValue?: number;
+    /** Called when the rating changes. */
+    onChange?: (value: number) => void;
+    /** Number of stars. Default 5. */
+    max?: number;
+    /** Accent color for filled stars. Default warning (gold). */
+    color?: RatingColor;
+    /** Star size. */
+    size?: RatingSize;
+    /** Render non-interactive. */
+    readOnly?: boolean;
+    /** Custom star icon (defaults to a filled star). */
+    icon?: React.ReactNode;
+    /** Accessible label for the group. */
+    label?: string;
+}
+/**
+ * Silica Rating — a row of star buttons.
+ *
+ *   <Rating defaultValue={3} onChange={setStars} />
+ *   <Rating value={4.5 | 4} color="warning" readOnly />
+ *
+ * Keyboard: arrow keys change the value; Home/End jump to 1/max.
+ */
+declare function Rating({ value, defaultValue, onChange, max, color, size, readOnly, icon, label, className, ...rest }: RatingProps): React.JSX.Element;
+
+type RadialProgressColor = SilicaColor;
+interface RadialProgressProps extends React.HTMLAttributes<HTMLDivElement> {
+    /** Progress percentage, 0–100. */
+    value: number;
+    /** Overall diameter (any CSS length). Default `5rem`. */
+    size?: string;
+    /** Ring thickness (any CSS length). Default `0.5rem`. */
+    thickness?: string;
+    /** Accent color. Default primary. */
+    color?: RadialProgressColor;
+}
+/**
+ * Silica RadialProgress — a circular progress ring with a centered label.
+ *
+ *   <RadialProgress value={70} color="success" />
+ *   <RadialProgress value={40} size="7rem" thickness="0.75rem">40%</RadialProgress>
+ *
+ * Defaults the label to `{value}%`; pass children to override.
+ */
+declare const RadialProgress: React.ForwardRefExoticComponent<RadialProgressProps & React.RefAttributes<HTMLDivElement>>;
+
+type PaginationColor = SilicaColor;
+type PaginationSize = "xs" | "sm" | "md" | "lg";
+interface PaginationProps extends Omit<React.HTMLAttributes<HTMLElement>, "onChange"> {
+    /** Current page (1-based). */
+    page: number;
+    /** Total number of pages. */
+    count: number;
+    /** Called with the new page. */
+    onChange?: (page: number) => void;
+    /** Pages shown on each side of the current page. Default 1. */
+    siblingCount?: number;
+    /** Pages shown at the start/end. Default 1. */
+    boundaryCount?: number;
+    /** Show prev/next arrows. Default `true`. */
+    controls?: boolean;
+    color?: PaginationColor;
+    size?: PaginationSize;
+}
+/**
+ * Silica Pagination — page controls with prev/next and ellipsis.
+ *
+ *   <Pagination page={page} count={12} onChange={setPage} color="primary" />
+ */
+declare function Pagination({ page, count, onChange, siblingCount, boundaryCount, controls, color, size, className, ...rest }: PaginationProps): React.JSX.Element;
+
+type Styled$k<T extends React.ElementType> = Omit<React.ComponentPropsWithoutRef<T>, "className"> & {
+    className?: string;
+};
+/**
+ * Silica Accordion — collapsible sections (Base UI behavior, animated height).
+ *
+ *   <Accordion multiple={false} defaultValue={["a"]}>
+ *     <AccordionItem value="a">
+ *       <AccordionTrigger>What is Silica?</AccordionTrigger>
+ *       <AccordionPanel>A design system on one token model.</AccordionPanel>
+ *     </AccordionItem>
+ *     <AccordionItem value="b">
+ *       <AccordionTrigger>Is it themeable?</AccordionTrigger>
+ *       <AccordionPanel>Yes — every color is a token.</AccordionPanel>
+ *     </AccordionItem>
+ *   </Accordion>
+ */
+declare function Accordion({ className, ...rest }: Styled$k<typeof Accordion$1.Root>): React.JSX.Element;
+declare function AccordionItem({ className, ...rest }: Styled$k<typeof Accordion$1.Item>): React.JSX.Element;
+interface AccordionTriggerProps extends Styled$k<typeof Accordion$1.Trigger> {
+    /** Set false to omit the built-in chevron. */
+    chevron?: boolean;
+}
+declare function AccordionTrigger({ className, children, chevron, ...rest }: AccordionTriggerProps): React.JSX.Element;
+declare function AccordionPanel({ className, children, ...rest }: Styled$k<typeof Accordion$1.Panel>): React.JSX.Element;
+
+type ChatSide = "start" | "end";
+type ChatBubbleColor = SilicaColor;
+interface ChatProps extends React.HTMLAttributes<HTMLDivElement> {
+    /** `start` (incoming, avatar left) or `end` (outgoing, avatar right). */
+    side?: ChatSide;
+}
+/**
+ * Silica Chat — a message row: avatar, header, bubble, footer.
+ *
+ *   <Chat side="start">
+ *     <ChatImage><Avatar>OW</Avatar></ChatImage>
+ *     <ChatHeader>Obi-Wan <time className="opacity-60">12:45</time></ChatHeader>
+ *     <ChatBubble>You were the chosen one!</ChatBubble>
+ *     <ChatFooter>Seen</ChatFooter>
+ *   </Chat>
+ *   <Chat side="end">
+ *     <ChatBubble color="primary">I hate you!</ChatBubble>
+ *   </Chat>
+ */
+declare const Chat: React.ForwardRefExoticComponent<ChatProps & React.RefAttributes<HTMLDivElement>>;
+type ChatImageProps = React.HTMLAttributes<HTMLDivElement>;
+declare const ChatImage: React.ForwardRefExoticComponent<ChatImageProps & React.RefAttributes<HTMLDivElement>>;
+type ChatHeaderProps = React.HTMLAttributes<HTMLDivElement>;
+declare const ChatHeader: React.ForwardRefExoticComponent<ChatHeaderProps & React.RefAttributes<HTMLDivElement>>;
+type ChatFooterProps = React.HTMLAttributes<HTMLDivElement>;
+declare const ChatFooter: React.ForwardRefExoticComponent<ChatFooterProps & React.RefAttributes<HTMLDivElement>>;
+interface ChatBubbleProps extends React.HTMLAttributes<HTMLDivElement> {
+    /** Bubble color; maps to `chat-bubble-<color>`. Default neutral base-200. */
+    color?: ChatBubbleColor;
+}
+declare const ChatBubble: React.ForwardRefExoticComponent<ChatBubbleProps & React.RefAttributes<HTMLDivElement>>;
+
+type Styled$j<T extends React.ElementType> = Omit<React.ComponentPropsWithoutRef<T>, "className"> & {
+    className?: string;
+};
+type RangeColor = SilicaColor;
+interface RangeProps extends Styled$j<typeof Slider$1.Root> {
+    /** Accent color for the filled track + thumb. Default primary. */
+    color?: RangeColor;
+}
+/**
+ * Silica Range — a slider (Base UI behavior).
+ *
+ *   <Range defaultValue={40} onValueChange={setV} />
+ *   <Range defaultValue={[20, 60]} color="success" />   // two thumbs
+ *
+ * Pass an array value/defaultValue for a multi-thumb range.
+ */
+declare function Range({ color, className, value, defaultValue, ...rest }: RangeProps): React.JSX.Element;
+
+type ToastProviderProps = React.ComponentProps<typeof Toast.Provider>;
+/**
+ * Silica ToastProvider — wrap your app once, then call `useToast().add(...)`.
+ *
+ *   <ToastProvider>
+ *     <App />
+ *   </ToastProvider>
+ *
+ *   const toast = useToast();
+ *   toast.add({ title: "Saved", description: "Your changes are saved.", type: "success" });
+ */
+declare function ToastProvider({ children, ...rest }: ToastProviderProps): React.JSX.Element;
+/** Toast manager: `add`, `close`, `update`, and the live `toasts` list. */
+declare function useToast(): _base_ui_components_react_toast.UseToastManagerReturnValue;
+
+type SwapVariant = "fade" | "rotate" | "flip";
+interface SwapProps extends Omit<React.HTMLAttributes<HTMLLabelElement>, "onChange"> {
+    /** Shown when active (checked). */
+    on: React.ReactNode;
+    /** Shown when inactive. */
+    off: React.ReactNode;
+    /** Controlled active state. */
+    active?: boolean;
+    /** Initial state when uncontrolled. */
+    defaultActive?: boolean;
+    /** Called when toggled. */
+    onActiveChange?: (active: boolean) => void;
+    /** Transition style. `fade` (default), `rotate`, or `flip`. */
+    variant?: SwapVariant;
+    /** Accessible label. */
+    label?: string;
+}
+/**
+ * Silica Swap — cross-fades (or rotates/flips) between two icons on toggle.
+ *
+ *   <Swap variant="rotate" on={<CloseIcon />} off={<MenuIcon />} label="Menu" />
+ */
+declare function Swap({ on, off, active, defaultActive, onActiveChange, variant, label, className, ...rest }: SwapProps): React.JSX.Element;
+
+type StatusColor = SilicaColor;
+type StatusSize = SilicaSize;
+interface StatusProps extends React.HTMLAttributes<HTMLSpanElement> {
+    /** Dot color. */
+    color?: StatusColor;
+    /** Dot size. */
+    size?: StatusSize;
+    /** Add an expanding "ping" ring. */
+    ping?: boolean;
+    /** Accessible label (e.g. "Online"). */
+    label?: string;
+}
+/**
+ * Silica Status — a small status dot, optionally pinging.
+ *
+ *   <Status color="success" ping label="Online" />
+ *   <Status color="warning" size="sm" />
+ */
+declare const Status: React.ForwardRefExoticComponent<StatusProps & React.RefAttributes<HTMLSpanElement>>;
+
+type CountdownUnit = "days" | "hours" | "minutes" | "seconds";
+interface CountdownProps extends React.HTMLAttributes<HTMLDivElement> {
+    /** Target time (a Date or epoch-ms timestamp). */
+    to: Date | number;
+    /** Which units to show. Default all four. */
+    units?: CountdownUnit[];
+    /** Drop the boxes for an inline number run. */
+    plain?: boolean;
+    /** Called once when the countdown reaches zero. */
+    onComplete?: () => void;
+}
+/**
+ * Silica Countdown — a live days/hours/minutes/seconds display.
+ *
+ *   <Countdown to={launchDate} />
+ *   <Countdown to={Date.now() + 90_000} units={["minutes", "seconds"]} plain />
+ *
+ * Client-only (ticks every second); render under a `"use client"` boundary.
+ */
+declare function Countdown({ to, units, plain, onComplete, className, ...rest }: CountdownProps): React.JSX.Element;
+
+type Styled$i<T extends React.ElementType> = Omit<React.ComponentPropsWithoutRef<T>, "className"> & {
+    className?: string;
+};
+interface NumberFieldProps extends Styled$i<typeof NumberField$1.Root> {
+    /** Accessible label for the input. */
+    label?: string;
+}
+/**
+ * Silica NumberField — a stepper input (Base UI: clamping, keyboard, scrub).
+ *
+ *   <NumberField defaultValue={1} min={0} max={10} onValueChange={setQty} />
+ */
+declare function NumberField({ className, label, ...rest }: NumberFieldProps): React.JSX.Element;
+
+type Styled$h<T extends React.ElementType> = Omit<React.ComponentPropsWithoutRef<T>, "className"> & {
+    className?: string;
+};
+type DrawerSide = "left" | "right" | "top" | "bottom";
+type DrawerProps = React.ComponentProps<typeof Dialog$1.Root>;
+/**
+ * Silica Drawer — a panel that slides in from an edge (Base UI Dialog behavior).
+ *
+ *   <Drawer>
+ *     <DrawerTrigger><Button>Menu</Button></DrawerTrigger>
+ *     <DrawerContent side="left">
+ *       <DrawerTitle>Navigation</DrawerTitle>
+ *       <nav>…</nav>
+ *       <DrawerClose><Button variant="ghost">Close</Button></DrawerClose>
+ *     </DrawerContent>
+ *   </Drawer>
+ */
+declare const Drawer: typeof Dialog$1.Root;
+declare function DrawerTrigger({ children }: {
+    children: React.ReactElement;
+}): React.JSX.Element;
+declare function DrawerClose({ children }: {
+    children: React.ReactElement;
+}): React.JSX.Element;
+interface DrawerContentProps extends Omit<Styled$h<typeof Dialog$1.Popup>, "children"> {
+    children?: React.ReactNode;
+    /** Edge the drawer slides from. Default `left`. */
+    side?: DrawerSide;
+    /** Class for the backdrop layer. */
+    backdropClassName?: string;
+}
+/** Portals + backdrop + the edge-pinned sliding panel in one. */
+declare function DrawerContent({ side, className, backdropClassName, children, ...rest }: DrawerContentProps): React.JSX.Element;
+declare function DrawerTitle({ className, ...rest }: Styled$h<typeof Dialog$1.Title>): React.JSX.Element;
+declare function DrawerDescription({ className, ...rest }: Styled$h<typeof Dialog$1.Description>): React.JSX.Element;
+
+interface ListProps extends React.HTMLAttributes<HTMLDivElement> {
+    /** Add a hover highlight to rows (for interactive lists). */
+    hover?: boolean;
+}
+/**
+ * Silica List — a vertical list of rows.
+ *
+ *   <List hover>
+ *     <ListTitle>Team</ListTitle>
+ *     <ListRow>
+ *       <Avatar size="sm">AL</Avatar>
+ *       <ListColGrow>
+ *         <div className="font-medium">Ada Lovelace</div>
+ *         <div className="text-sm opacity-60">Owner</div>
+ *       </ListColGrow>
+ *       <Button size="sm" variant="ghost">Manage</Button>
+ *     </ListRow>
+ *   </List>
+ */
+declare const List: React.ForwardRefExoticComponent<ListProps & React.RefAttributes<HTMLDivElement>>;
+type ListRowProps = React.HTMLAttributes<HTMLDivElement>;
+declare const ListRow: React.ForwardRefExoticComponent<ListRowProps & React.RefAttributes<HTMLDivElement>>;
+/** The cell that should take the remaining width (title/body). */
+type ListColGrowProps = React.HTMLAttributes<HTMLDivElement>;
+declare const ListColGrow: React.ForwardRefExoticComponent<ListColGrowProps & React.RefAttributes<HTMLDivElement>>;
+type ListTitleProps = React.HTMLAttributes<HTMLDivElement>;
+declare const ListTitle: React.ForwardRefExoticComponent<ListTitleProps & React.RefAttributes<HTMLDivElement>>;
+
+type FileInputSize = "sm" | "md" | "lg";
+interface FileInputProps extends Omit<React.InputHTMLAttributes<HTMLInputElement>, "type" | "size"> {
+    size?: FileInputSize;
+}
+/**
+ * Silica FileInput — a styled `<input type="file">`.
+ *
+ *   <FileInput onChange={(e) => setFile(e.target.files?.[0])} />
+ *   <FileInput accept="image/*" multiple size="lg" />
+ */
+declare const FileInput: React.ForwardRefExoticComponent<FileInputProps & React.RefAttributes<HTMLInputElement>>;
+
+type DockColor = SilicaColor;
+interface DockProps extends React.HTMLAttributes<HTMLElement> {
+    /** Accent color for the active item. Default primary. */
+    color?: DockColor;
+}
+/**
+ * Silica Dock — a bottom navigation bar of icon+label items.
+ *
+ *   <Dock className="fixed inset-x-0 bottom-0">
+ *     <DockItem active><HomeIcon /><DockLabel>Home</DockLabel></DockItem>
+ *     <DockItem><SearchIcon /><DockLabel>Search</DockLabel></DockItem>
+ *     <DockItem><UserIcon /><DockLabel>Profile</DockLabel></DockItem>
+ *   </Dock>
+ */
+declare const Dock: React.ForwardRefExoticComponent<DockProps & React.RefAttributes<HTMLElement>>;
+interface DockItemProps extends React.ButtonHTMLAttributes<HTMLButtonElement> {
+    /** Highlight this item as the current destination. */
+    active?: boolean;
+}
+declare const DockItem: React.ForwardRefExoticComponent<DockItemProps & React.RefAttributes<HTMLButtonElement>>;
+type DockLabelProps = React.HTMLAttributes<HTMLSpanElement>;
+declare const DockLabel: React.ForwardRefExoticComponent<DockLabelProps & React.RefAttributes<HTMLSpanElement>>;
+
+interface FieldsetProps extends React.FieldsetHTMLAttributes<HTMLFieldSetElement> {
+}
+/**
+ * Silica Fieldset — a labeled, vertically-stacked group of form controls.
+ *
+ *   <Fieldset>
+ *     <FieldsetLegend>Profile</FieldsetLegend>
+ *     <Input placeholder="Name" />
+ *     <FieldsetLabel>Your full legal name.</FieldsetLabel>
+ *   </Fieldset>
+ *
+ * Renders a native `<fieldset>` (chrome reset in CSS) so `disabled` cascades to
+ * every control inside it for free.
+ */
+declare const Fieldset: React.ForwardRefExoticComponent<FieldsetProps & React.RefAttributes<HTMLFieldSetElement>>;
+interface FieldsetLegendProps extends React.HTMLAttributes<HTMLLegendElement> {
+}
+/** The group heading. Renders a native `<legend>`. */
+declare const FieldsetLegend: React.ForwardRefExoticComponent<FieldsetLegendProps & React.RefAttributes<HTMLLegendElement>>;
+interface FieldsetLabelProps extends React.HTMLAttributes<HTMLSpanElement> {
+}
+/** Muted helper/hint text under a control. */
+declare const FieldsetLabel: React.ForwardRefExoticComponent<FieldsetLabelProps & React.RefAttributes<HTMLSpanElement>>;
+
+interface LabelProps extends React.LabelHTMLAttributes<HTMLLabelElement> {
+}
+/**
+ * Silica Label — a plain, muted caption for a control.
+ *
+ *   <Label htmlFor="email">Email</Label>
+ *   <Input id="email" />
+ */
+declare const Label: React.ForwardRefExoticComponent<LabelProps & React.RefAttributes<HTMLLabelElement>>;
+interface FloatingLabelProps extends Omit<React.LabelHTMLAttributes<HTMLLabelElement>, "children"> {
+    /** Caption text that floats onto the border when the field is focused/filled. */
+    label: React.ReactNode;
+    /** The control (an `<Input>`, `<Textarea>`, `<select>`, …). */
+    children: React.ReactElement<{
+        placeholder?: string;
+    }>;
+}
+/**
+ * Silica FloatingLabel — a caption that rests inside the field and floats up on
+ * focus or when the field has a value.
+ *
+ *   <FloatingLabel label="Email">
+ *     <Input type="email" />
+ *   </FloatingLabel>
+ *
+ * The "filled" state relies on `:placeholder-shown`, so the control needs a
+ * placeholder — one (a single space) is injected automatically if you don't set
+ * your own.
+ */
+declare const FloatingLabel: React.ForwardRefExoticComponent<FloatingLabelProps & React.RefAttributes<HTMLLabelElement>>;
+
+interface ValidatorProps {
+    /** A single form control to apply validity-driven coloring to. */
+    children: React.ReactElement<{
+        className?: string;
+    }>;
+}
+/**
+ * Silica Validator — recolors its child control by validity.
+ *
+ *   <Validator><Input required type="email" /></Validator>
+ *   <ValidatorHint>Enter a valid email address.</ValidatorHint>
+ *
+ * Adds the `validator` class to the child so the field flips to error/success
+ * on `:user-invalid` / `:user-valid` (after the user interacts) or on an
+ * explicit `aria-invalid`. For the hint to reveal itself, render `<ValidatorHint>`
+ * as the immediate next sibling of the control.
+ */
+declare function Validator({ children }: ValidatorProps): React.JSX.Element;
+interface ValidatorHintProps extends React.HTMLAttributes<HTMLParagraphElement> {
+}
+/** Error message that stays hidden until the preceding control is invalid. */
+declare const ValidatorHint: React.ForwardRefExoticComponent<ValidatorHintProps & React.RefAttributes<HTMLParagraphElement>>;
+
+interface DiffProps extends Omit<React.HTMLAttributes<HTMLElement>, "children"> {
+    /** The "before" layer (clipped from the split leftward). */
+    before: React.ReactNode;
+    /** The "after" layer (revealed to the right of the split). */
+    after: React.ReactNode;
+    /** Controlled split position, 0–100 (percent from the left edge). */
+    position?: number;
+    /** Uncontrolled initial split position, 0–100. Default `50`. */
+    defaultPosition?: number;
+    /** Fires with the new split position (0–100) as it changes. */
+    onPositionChange?: (position: number) => void;
+}
+/**
+ * Silica Diff — a draggable before/after comparison.
+ *
+ *   <Diff
+ *     before={<img src={before} alt="before" />}
+ *     after={<img src={after} alt="after" />}
+ *     className="aspect-video"
+ *   />
+ *
+ * Drag the handle (or click anywhere) to move the split; the handle is a slider,
+ * so ←/→ nudge it (Shift for larger steps), Home/End snap to the edges.
+ */
+declare const Diff: React.ForwardRefExoticComponent<DiffProps & React.RefAttributes<HTMLElement>>;
+
+type MaskVariant = "squircle" | "heart" | "circle" | "hexagon" | "hexagon-2" | "triangle" | "triangle-2" | "triangle-3" | "triangle-4" | "diamond" | "pentagon" | "star" | "star-2" | "decagon" | "parallelogram";
+interface MaskProps extends React.HTMLAttributes<HTMLDivElement> {
+    /** The shape to clip to. */
+    variant: MaskVariant;
+}
+/**
+ * Silica Mask — clips its content (usually an `<img>`) to a shape.
+ *
+ *   <Mask variant="hexagon" className="w-24 h-24">
+ *     <img src={photo} alt="" className="w-full h-full object-cover" />
+ *   </Mask>
+ *
+ * Give the mask a size (via `className`/`style`); the shape scales to fill it.
+ * You can also apply the classes directly to an `<img>` if you prefer.
+ */
+declare const Mask: React.ForwardRefExoticComponent<MaskProps & React.RefAttributes<HTMLDivElement>>;
+
+type MeterColor = SilicaColor;
+type MeterSize = SilicaSize;
+interface MeterProps extends Omit<React.HTMLAttributes<HTMLDivElement>, "color"> {
+    /** The current reading. */
+    value: number;
+    /** Range floor. Default `0`. */
+    min?: number;
+    /** Range ceiling. Default `100`. */
+    max?: number;
+    /** Fill color; maps to `meter-<color>`. */
+    color?: MeterColor;
+    /** Track height; default `md`. */
+    size?: MeterSize;
+    /** Optional label shown in the header row. */
+    label?: React.ReactNode;
+    /** Show the formatted value in the header row. Default `false`. */
+    showValue?: boolean;
+    /** `Intl.NumberFormat` options for the displayed value. */
+    format?: Intl.NumberFormatOptions;
+}
+/**
+ * Silica Meter — a static measurement within a known range (disk usage, score,
+ * capacity). Behavior/accessibility from Base UI's Meter; look from Silica.
+ *
+ *   <Meter value={72} label="Storage" showValue color="warning" />
+ */
+declare const Meter: React.ForwardRefExoticComponent<MeterProps & React.RefAttributes<HTMLDivElement>>;
+
+type ScrollAreaOrientation = "vertical" | "horizontal" | "both";
+interface ScrollAreaProps extends React.HTMLAttributes<HTMLDivElement> {
+    /** Which scrollbars to render. Default `vertical`. */
+    orientation?: ScrollAreaOrientation;
+}
+/**
+ * Silica ScrollArea — a panel with custom overlay scrollbars.
+ *
+ *   <ScrollArea className="h-64 w-72">
+ *     <div className="p-4">…long content…</div>
+ *   </ScrollArea>
+ *
+ * Give it a bounded size (via `className`/`style`); the content scrolls inside
+ * and the overlay scrollbars fade in on hover. Use `orientation="both"` for a
+ * two-axis panel.
+ */
+declare const ScrollArea: React.ForwardRefExoticComponent<ScrollAreaProps & React.RefAttributes<HTMLDivElement>>;
+
+type PositionerProps$9 = React.ComponentProps<typeof PreviewCard$1.Positioner>;
+type PreviewCardSide = NonNullable<PositionerProps$9["side"]>;
+type PreviewCardAlign = NonNullable<PositionerProps$9["align"]>;
+interface PreviewCardProps {
+    /** The trigger (usually a link). Base UI merges hover/focus behavior onto it. */
+    children: React.ReactElement;
+    /** The card body shown on hover/focus. */
+    content: React.ReactNode;
+    /** Preferred side. Default `bottom` (flips to avoid collisions). */
+    side?: PreviewCardSide;
+    /** Alignment along that side. Default `center`. */
+    align?: PreviewCardAlign;
+    /** Gap between trigger and card, in px. Default `8`. */
+    sideOffset?: number;
+    /** Hover-open delay in ms. */
+    delay?: number;
+    /** Close delay in ms. */
+    closeDelay?: number;
+    /** Controlled open state. */
+    open?: boolean;
+    /** Uncontrolled initial open state. */
+    defaultOpen?: boolean;
+    onOpenChange?: (open: boolean) => void;
+    /** Show the little arrow. Default `false`. */
+    arrow?: boolean;
+    /** Extra class on the card surface. */
+    className?: string;
+}
+/**
+ * Silica PreviewCard — a hover/focus link preview (hovercard). Behavior from
+ * Base UI, look from Silica's `.preview-card` CSS.
+ *
+ *   <PreviewCard content={<UserPreview user={u} />}>
+ *     <Link href={u.url}>@{u.handle}</Link>
+ *   </PreviewCard>
+ */
+declare function PreviewCard({ children, content, side, align, sideOffset, delay, closeDelay, open, defaultOpen, onOpenChange, arrow, className, }: PreviewCardProps): React.JSX.Element;
+
+type Styled$g<T extends React.ElementType> = Omit<React.ComponentPropsWithoutRef<T>, "className"> & {
+    className?: string;
+};
+type ToolbarProps = Styled$g<typeof Toolbar$1.Root>;
+type ToolbarButtonProps = Styled$g<typeof Toolbar$1.Button>;
+type ToolbarGroupProps = Styled$g<typeof Toolbar$1.Group>;
+type ToolbarLinkProps = Styled$g<typeof Toolbar$1.Link>;
+type ToolbarSeparatorProps = Styled$g<typeof Toolbar$1.Separator>;
+/**
+ * Silica Toolbar — a group of controls with roving arrow-key focus.
+ *
+ *   <Toolbar aria-label="Formatting">
+ *     <ToolbarButton><BoldIcon /></ToolbarButton>
+ *     <ToolbarButton><ItalicIcon /></ToolbarButton>
+ *     <ToolbarSeparator />
+ *     <ToolbarLink href="/help">Help</ToolbarLink>
+ *   </Toolbar>
+ */
+declare const Toolbar: React.ForwardRefExoticComponent<Omit<Omit<_base_ui_components_react_toolbar.ToolbarRootProps & React.RefAttributes<HTMLDivElement>, "ref">, "className"> & {
+    className?: string;
+} & React.RefAttributes<HTMLDivElement>>;
+declare const ToolbarButton: React.ForwardRefExoticComponent<Omit<Omit<_base_ui_components_react_toolbar.ToolbarButtonProps & React.RefAttributes<HTMLButtonElement>, "ref">, "className"> & {
+    className?: string;
+} & React.RefAttributes<HTMLButtonElement>>;
+declare const ToolbarGroup: React.ForwardRefExoticComponent<Omit<Omit<_base_ui_components_react_toolbar.ToolbarGroupProps & React.RefAttributes<HTMLElement>, "ref">, "className"> & {
+    className?: string;
+} & React.RefAttributes<HTMLDivElement>>;
+declare const ToolbarLink: React.ForwardRefExoticComponent<Omit<Omit<_base_ui_components_react_toolbar.ToolbarLinkProps & React.RefAttributes<HTMLAnchorElement>, "ref">, "className"> & {
+    className?: string;
+} & React.RefAttributes<HTMLAnchorElement>>;
+declare const ToolbarSeparator: React.ForwardRefExoticComponent<Omit<Omit<_base_ui_components_react_toolbar.ToolbarSeparatorProps & React.RefAttributes<HTMLDivElement>, "ref">, "className"> & {
+    className?: string;
+} & React.RefAttributes<HTMLDivElement>>;
+
+interface ThemeControllerProps {
+    /** The themes to cycle through. Default `["light", "dark"]`. */
+    themes?: string[];
+    /** Controlled current theme. */
+    value?: string;
+    /** Uncontrolled initial theme (falls back to stored value, then the target's
+     *  current `data-theme`, then the first theme). */
+    defaultValue?: string;
+    /** Called with the new theme when it changes. */
+    onChange?: (theme: string) => void;
+    /** Element to set `data-theme` on. Default `document.documentElement`. */
+    target?: HTMLElement | null | (() => HTMLElement | null);
+    /** localStorage key for persistence; `null` disables it. Default `"silica-theme"`. */
+    storageKey?: string | null;
+    /** Show the current theme name next to the icon. */
+    labels?: boolean;
+    /** Button variant. Default `ghost`. */
+    variant?: ButtonVariant;
+    /** Button color. Default `neutral`. */
+    color?: ButtonColor;
+    className?: string;
+    "aria-label"?: string;
+}
+/**
+ * Silica ThemeController — a control that switches the active `data-theme`.
+ *
+ *   <ThemeController />                         // light ⇄ dark toggle
+ *   <ThemeController themes={["light","dark","dim"]} labels />
+ *
+ * Applies the theme to `document.documentElement` (or a `target`) and persists
+ * it to localStorage. Cycles to the next theme on click; a plain light/dark pair
+ * shows a sun/moon toggle.
+ */
+declare function ThemeController({ themes, value, defaultValue, onChange, target, storageKey, labels, variant, color, className, "aria-label": ariaLabel, }: ThemeControllerProps): React.JSX.Element;
+
+type Styled$f<T extends React.ElementType> = Omit<React.ComponentPropsWithoutRef<T>, "className"> & {
+    className?: string;
+};
+type PositionerProps$8 = React.ComponentProps<typeof NavigationMenu$1.Positioner>;
+type NavigationMenuSide = NonNullable<PositionerProps$8["side"]>;
+type NavigationMenuAlign = NonNullable<PositionerProps$8["align"]>;
+interface NavigationMenuProps extends Omit<Styled$f<typeof NavigationMenu$1.Root>, "children"> {
+    children?: React.ReactNode;
+    /** Preferred side for the dropdown panel. Default `bottom`. */
+    side?: NavigationMenuSide;
+    /** Alignment. Default `center`. */
+    align?: NavigationMenuAlign;
+    /** Gap between the bar and the panel, in px. Default `8`. */
+    sideOffset?: number;
+}
+/**
+ * Silica NavigationMenu — a site-nav bar with rich dropdown panels (mega menu).
+ * Behavior from Base UI (shared animated viewport that resizes between panels);
+ * look from Silica.
+ *
+ *   <NavigationMenu>
+ *     <NavigationMenuItem>
+ *       <NavigationMenuTrigger>Products</NavigationMenuTrigger>
+ *       <NavigationMenuContent>
+ *         <ul className="grid gap-1">…</ul>
+ *       </NavigationMenuContent>
+ *     </NavigationMenuItem>
+ *     <NavigationMenuItem>
+ *       <NavigationMenuLink href="/pricing">Pricing</NavigationMenuLink>
+ *     </NavigationMenuItem>
+ *   </NavigationMenu>
+ */
+declare function NavigationMenu({ children, className, side, align, sideOffset, ...rest }: NavigationMenuProps): React.JSX.Element;
+type NavigationMenuItemProps = Styled$f<typeof NavigationMenu$1.Item>;
+/** A bar item — holds either a Trigger + Content, or a Link. */
+declare const NavigationMenuItem: React.ForwardRefExoticComponent<Omit<Omit<_base_ui_components_react_navigation_menu.NavigationMenuItemProps & React.RefAttributes<HTMLDivElement>, "ref">, "className"> & {
+    className?: string;
+} & React.RefAttributes<HTMLDivElement>>;
+type NavigationMenuTriggerProps = Styled$f<typeof NavigationMenu$1.Trigger>;
+/** Opens this item's panel; carries an auto-rotating chevron. */
+declare const NavigationMenuTrigger: React.ForwardRefExoticComponent<Omit<Omit<_base_ui_components_react_navigation_menu.NavigationMenuTriggerProps & React.RefAttributes<HTMLButtonElement>, "ref">, "className"> & {
+    className?: string;
+} & React.RefAttributes<HTMLButtonElement>>;
+type NavigationMenuContentProps = Styled$f<typeof NavigationMenu$1.Content>;
+/** The dropdown panel for an item (teleported into the shared viewport). */
+declare const NavigationMenuContent: React.ForwardRefExoticComponent<Omit<Omit<_base_ui_components_react_navigation_menu.NavigationMenuContentProps & React.RefAttributes<HTMLDivElement>, "ref">, "className"> & {
+    className?: string;
+} & React.RefAttributes<HTMLDivElement>>;
+type NavigationMenuLinkProps = Styled$f<typeof NavigationMenu$1.Link>;
+/** A plain bar link (no panel). */
+declare const NavigationMenuLink: React.ForwardRefExoticComponent<Omit<Omit<_base_ui_components_react_navigation_menu.NavigationMenuLinkProps & React.RefAttributes<HTMLAnchorElement>, "ref">, "className"> & {
+    className?: string;
+} & React.RefAttributes<HTMLAnchorElement>>;
+
+type Styled$e<T extends React.ElementType> = Omit<React.ComponentPropsWithoutRef<T>, "className"> & {
+    className?: string;
+};
+type PositionerProps$7 = React.ComponentProps<typeof Menu$1.Positioner>;
+type MenubarSide = NonNullable<PositionerProps$7["side"]>;
+type MenubarAlign = NonNullable<PositionerProps$7["align"]>;
+type MenubarProps = Styled$e<typeof Menubar$1>;
+/**
+ * Silica Menubar — a bar of menus (File / Edit / View …). Behavior from Base UI
+ * (arrow between menus, hover to switch once open, roving focus). Each menu is a
+ * `MenubarMenu`; its popup reuses the shared `.dropdown*` surface.
+ *
+ *   <Menubar>
+ *     <MenubarMenu>
+ *       <MenubarTrigger>File</MenubarTrigger>
+ *       <MenubarContent>
+ *         <MenubarItem>New</MenubarItem>
+ *         <MenubarSeparator />
+ *         <MenubarItem>Exit</MenubarItem>
+ *       </MenubarContent>
+ *     </MenubarMenu>
+ *   </Menubar>
+ */
+declare const Menubar: React.ForwardRefExoticComponent<Omit<Omit<_base_ui_components_react_menubar.MenubarProps & React.RefAttributes<HTMLDivElement>, "ref">, "className"> & {
+    className?: string;
+} & React.RefAttributes<HTMLDivElement>>;
+/** A single menu within the bar. */
+declare const MenubarMenu: typeof Menu$1.Root;
+type MenubarTriggerProps = Styled$e<typeof Menu$1.Trigger>;
+declare const MenubarTrigger: React.ForwardRefExoticComponent<Omit<Omit<_base_ui_components_react_menu.MenuTriggerProps<unknown> & React.RefAttributes<HTMLElement>, "ref">, "className"> & {
+    className?: string;
+} & React.RefAttributes<HTMLButtonElement>>;
+interface MenubarContentProps extends Omit<Styled$e<typeof Menu$1.Popup>, "children"> {
+    children?: React.ReactNode;
+    side?: MenubarSide;
+    align?: MenubarAlign;
+    sideOffset?: number;
+}
+/** Portal + positioner + the menu popup (shared dropdown surface). */
+declare function MenubarContent({ className, children, side, align, sideOffset, ...rest }: MenubarContentProps): React.JSX.Element;
+declare function MenubarItem({ className, ...rest }: Styled$e<typeof Menu$1.Item>): React.JSX.Element;
+declare function MenubarSeparator({ className, ...rest }: Styled$e<typeof Menu$1.Separator>): React.JSX.Element;
+declare function MenubarGroup(props: React.ComponentProps<typeof Menu$1.Group>): React.JSX.Element;
+declare function MenubarLabel({ className, ...rest }: Styled$e<typeof Menu$1.GroupLabel>): React.JSX.Element;
+
+type Styled$d<T extends React.ElementType> = Omit<React.ComponentPropsWithoutRef<T>, "className"> & {
+    className?: string;
+};
+type ContextMenuProps = React.ComponentProps<typeof ContextMenu$1.Root>;
+/**
+ * Silica ContextMenu — a right-click menu. Behavior from Base UI (opens at the
+ * pointer, roving focus, typeahead, dismissal); its popup reuses the shared
+ * `.dropdown*` surface.
+ *
+ *   <ContextMenu>
+ *     <ContextMenuTrigger className="grid h-40 place-items-center rounded-box border border-dashed">
+ *       Right-click here
+ *     </ContextMenuTrigger>
+ *     <ContextMenuContent>
+ *       <ContextMenuGroup>
+ *         <ContextMenuLabel>Actions</ContextMenuLabel>
+ *         <ContextMenuItem>Cut</ContextMenuItem>
+ *         <ContextMenuItem>Copy</ContextMenuItem>
+ *       </ContextMenuGroup>
+ *       <ContextMenuSeparator />
+ *       <ContextMenuItem disabled>Paste</ContextMenuItem>
+ *     </ContextMenuContent>
+ *   </ContextMenu>
+ */
+declare const ContextMenu: typeof ContextMenu$1.Root;
+type ContextMenuTriggerProps = Styled$d<typeof ContextMenu$1.Trigger>;
+/** The right-click area. */
+declare const ContextMenuTrigger: React.ForwardRefExoticComponent<Omit<Omit<_base_ui_components_react_context_menu.ContextMenuTriggerProps & React.RefAttributes<HTMLDivElement>, "ref">, "className"> & {
+    className?: string;
+} & React.RefAttributes<HTMLDivElement>>;
+interface ContextMenuContentProps extends Omit<Styled$d<typeof ContextMenu$1.Popup>, "children"> {
+    children?: React.ReactNode;
+}
+/** Portal + positioner + the menu popup (shared dropdown surface). */
+declare function ContextMenuContent({ className, children, ...rest }: ContextMenuContentProps): React.JSX.Element;
+declare function ContextMenuItem({ className, ...rest }: Styled$d<typeof ContextMenu$1.Item>): React.JSX.Element;
+declare function ContextMenuSeparator({ className, ...rest }: Styled$d<typeof ContextMenu$1.Separator>): React.JSX.Element;
+declare function ContextMenuGroup(props: React.ComponentProps<typeof ContextMenu$1.Group>): React.JSX.Element;
+declare function ContextMenuLabel({ className, ...rest }: Styled$d<typeof ContextMenu$1.GroupLabel>): React.JSX.Element;
+
+type Styled$c<T extends React.ElementType> = Omit<React.ComponentPropsWithoutRef<T>, "className"> & {
+    className?: string;
+};
+type ToggleGroupProps = Styled$c<typeof ToggleGroup$1>;
+type ToggleGroupItemProps = Styled$c<typeof Toggle$1>;
+/**
+ * Silica ToggleGroup — a segmented control (single- or multi-select). Behavior
+ * from Base UI (roving focus, pressed state); look from Silica. This is the
+ * button-based control — for an on/off switch use `Toggle`.
+ *
+ *   <ToggleGroup defaultValue={["list"]}>
+ *     <ToggleGroupItem value="list">List</ToggleGroupItem>
+ *     <ToggleGroupItem value="grid">Grid</ToggleGroupItem>
+ *   </ToggleGroup>
+ */
+declare const ToggleGroup: React.ForwardRefExoticComponent<Omit<Omit<_base_ui_components_react_toggle_group.ToggleGroupProps & React.RefAttributes<HTMLDivElement>, "ref">, "className"> & {
+    className?: string;
+} & React.RefAttributes<HTMLDivElement>>;
+/** One selectable button within a ToggleGroup. */
+declare const ToggleGroupItem: React.ForwardRefExoticComponent<Omit<Omit<_base_ui_components_react_toggle.ToggleProps & React.RefAttributes<HTMLButtonElement>, "ref">, "className"> & {
+    className?: string;
+} & React.RefAttributes<HTMLButtonElement>>;
+
+type Styled$b<T extends React.ElementType> = Omit<React.ComponentPropsWithoutRef<T>, "className"> & {
+    className?: string;
+};
+type FieldProps = Styled$b<typeof Field$1.Root>;
+type FieldLabelProps = Styled$b<typeof Field$1.Label>;
+type FieldControlProps = Styled$b<typeof Field$1.Control>;
+type FieldDescriptionProps = Styled$b<typeof Field$1.Description>;
+type FieldErrorProps = Styled$b<typeof Field$1.Error>;
+/**
+ * Silica Field — an accessible form field. Base UI wires the label, control,
+ * description, and error together (ids, aria, validity tracking); Silica styles
+ * them. Wrap any Silica control.
+ *
+ *   <Field name="email">
+ *     <FieldLabel>Email</FieldLabel>
+ *     <FieldControl type="email" required placeholder="you@example.com" />
+ *     <FieldDescription>We'll never share it.</FieldDescription>
+ *     <FieldError />
+ *   </Field>
+ *
+ * For a non-input control, pass it via `render`:
+ *   <FieldControl render={<Textarea />} />
+ */
+declare const Field: React.ForwardRefExoticComponent<Omit<Omit<_base_ui_components_react_field.FieldRootProps & React.RefAttributes<HTMLDivElement>, "ref">, "className"> & {
+    className?: string;
+} & React.RefAttributes<HTMLDivElement>>;
+declare const FieldLabel: React.ForwardRefExoticComponent<Omit<Omit<_base_ui_components_react_field.FieldLabelProps & React.RefAttributes<any>, "ref">, "className"> & {
+    className?: string;
+} & React.RefAttributes<HTMLLabelElement>>;
+/**
+ * The control. Defaults to a native input styled as a Silica `.input`; when you
+ * pass `render` (a Textarea/Select/etc.), it carries its own styling instead.
+ */
+declare const FieldControl: React.ForwardRefExoticComponent<Omit<Omit<_base_ui_components_react_field.FieldControlProps & React.RefAttributes<HTMLInputElement>, "ref">, "className"> & {
+    className?: string;
+} & React.RefAttributes<HTMLInputElement>>;
+declare const FieldDescription: React.ForwardRefExoticComponent<Omit<Omit<_base_ui_components_react_field.FieldDescriptionProps & React.RefAttributes<HTMLParagraphElement>, "ref">, "className"> & {
+    className?: string;
+} & React.RefAttributes<HTMLParagraphElement>>;
+/** Error message; renders only when the field is invalid. */
+declare const FieldError: React.ForwardRefExoticComponent<Omit<Omit<_base_ui_components_react_field.FieldErrorProps & React.RefAttributes<HTMLDivElement>, "ref">, "className"> & {
+    className?: string;
+} & React.RefAttributes<HTMLParagraphElement>>;
+
+type FormProps = React.ComponentPropsWithoutRef<typeof Form$1>;
+/**
+ * Silica Form — a `<form>` that coordinates its Fields' validation. Behavior
+ * from Base UI: it runs each Field's validation on submit, focuses the first
+ * invalid control, and accepts server-returned `errors` keyed by field `name`.
+ * Presentational only otherwise — lay it out with `Field`s and utilities.
+ *
+ *   <Form errors={serverErrors} onSubmit={…}>
+ *     <Field name="email">…</Field>
+ *     <Button type="submit">Save</Button>
+ *   </Form>
+ */
+declare const Form: React.ForwardRefExoticComponent<Omit<Form$1.Props<Record<string, any>> & {
+    ref?: React.Ref<HTMLFormElement>;
+}, "ref"> & React.RefAttributes<HTMLFormElement>>;
+
+type RadioGroupOrientation = "vertical" | "horizontal";
+interface RadioGroupProps extends Omit<React.HTMLAttributes<HTMLDivElement>, "onChange" | "defaultValue"> {
+    /** Controlled selected value. */
+    value?: string;
+    /** Uncontrolled initial value. */
+    defaultValue?: string;
+    /** Fires with the newly-selected value. */
+    onValueChange?: (value: string) => void;
+    /** Shared radio `name` (auto-generated if omitted). */
+    name?: string;
+    /** Stack (`vertical`, default) or row (`horizontal`). */
+    orientation?: RadioGroupOrientation;
+    /** Disable every option. */
+    disabled?: boolean;
+    /** Default accent color for the options. */
+    color?: SilicaColor;
+    /** Default size for the options. */
+    size?: SilicaSize;
+}
+/**
+ * Silica RadioGroup — a managed set of radios (native inputs, so arrow-key
+ * navigation comes free). Pair with `RadioOption`s.
+ *
+ *   <RadioGroup defaultValue="card" name="pay">
+ *     <RadioOption value="card">Card</RadioOption>
+ *     <RadioOption value="ach">Bank transfer</RadioOption>
+ *   </RadioGroup>
+ */
+declare function RadioGroup({ value, defaultValue, onValueChange, name, orientation, disabled, color, size, className, children, ...rest }: RadioGroupProps): React.JSX.Element;
+interface RadioOptionProps extends Omit<React.LabelHTMLAttributes<HTMLLabelElement>, "onChange"> {
+    /** This option's value. */
+    value: string;
+    disabled?: boolean;
+    color?: SilicaColor;
+    size?: SilicaSize;
+}
+/** One labeled radio within a RadioGroup. */
+declare function RadioOption({ value, disabled, color, size, className, children, ...rest }: RadioOptionProps): React.JSX.Element;
+
+type CheckboxGroupOrientation = "vertical" | "horizontal";
+interface CheckboxGroupProps extends Omit<React.HTMLAttributes<HTMLDivElement>, "onChange" | "defaultValue"> {
+    /** Controlled array of checked values. */
+    value?: string[];
+    /** Uncontrolled initial checked values. */
+    defaultValue?: string[];
+    /** Fires with the new array of checked values. */
+    onValueChange?: (value: string[]) => void;
+    /** Stack (`vertical`, default) or row (`horizontal`). */
+    orientation?: CheckboxGroupOrientation;
+    /** Disable every option. */
+    disabled?: boolean;
+    /** Default accent color for the options. */
+    color?: SilicaColor;
+    /** Default size for the options. */
+    size?: SilicaSize;
+}
+/**
+ * Silica CheckboxGroup — a managed set of checkboxes whose value is the array of
+ * checked items. Pair with `CheckboxOption`s.
+ *
+ *   <CheckboxGroup defaultValue={["email"]}>
+ *     <CheckboxOption value="email">Email</CheckboxOption>
+ *     <CheckboxOption value="sms">SMS</CheckboxOption>
+ *   </CheckboxGroup>
+ */
+declare function CheckboxGroup({ value, defaultValue, onValueChange, orientation, disabled, color, size, className, children, ...rest }: CheckboxGroupProps): React.JSX.Element;
+interface CheckboxOptionProps extends Omit<React.LabelHTMLAttributes<HTMLLabelElement>, "onChange"> {
+    /** This option's value. */
+    value: string;
+    disabled?: boolean;
+    color?: SilicaColor;
+    size?: SilicaSize;
+}
+/** One labeled checkbox within a CheckboxGroup. */
+declare function CheckboxOption({ value, disabled, color, size, className, children, ...rest }: CheckboxOptionProps): React.JSX.Element;
+
+type Styled$a<T extends React.ElementType> = Omit<React.ComponentPropsWithoutRef<T>, "className"> & {
+    className?: string;
+};
+type SliderColor = SilicaColor;
+type SliderSize = "sm" | "md" | "lg";
+interface SliderProps extends Omit<Styled$a<typeof Slider$1.Root>, "color"> {
+    /** Accent for the filled track + thumb(s). */
+    color?: SilicaColor;
+    /** Rail thickness + thumb diameter. */
+    size?: SliderSize;
+    /** Show a live numeric readout beside the track. */
+    showValue?: boolean;
+}
+/**
+ * Silica Slider — a rich range input (Base UI behavior). Pass a number for a
+ * single thumb, or a tuple for a two-thumb range selection; the number of thumbs
+ * follows the shape of `value`/`defaultValue`.
+ *
+ *   <Slider defaultValue={40} color="primary" showValue />
+ *   <Slider defaultValue={[20, 60]} min={0} max={100} step={5} />
+ *   <Slider orientation="vertical" defaultValue={50} />
+ */
+declare const Slider: React.ForwardRefExoticComponent<SliderProps & React.RefAttributes<HTMLDivElement>>;
+
+type Styled$9<T extends React.ElementType> = Omit<React.ComponentPropsWithoutRef<T>, "className"> & {
+    className?: string;
+};
+type SwitchColor = SilicaColor;
+type SwitchSize = SilicaSize;
+interface SwitchProps extends Omit<Styled$9<typeof Switch$1.Root>, "color"> {
+    /** Accent for the checked track. */
+    color?: SilicaColor;
+    /** Track height (width follows at 1.75×). */
+    size?: SilicaSize;
+}
+/**
+ * Silica Switch — an accessible on/off toggle (Base UI: `role="switch"` with a
+ * hidden real input, so it submits in a form and pairs with `Field`). The CSS
+ * cousin `Toggle` is a bare restyled checkbox; reach for `Switch` when you want
+ * proper switch semantics or form integration.
+ *
+ *   <Switch defaultChecked color="success" />
+ *   <Switch checked={on} onCheckedChange={setOn} />
+ */
+declare const Switch: React.ForwardRefExoticComponent<SwitchProps & React.RefAttributes<HTMLElement>>;
+
+type Styled$8<T extends React.ElementType> = Omit<React.ComponentPropsWithoutRef<T>, "className"> & {
+    className?: string;
+};
+type CollapsibleProps = Styled$8<typeof Collapsible$1.Root>;
+/**
+ * Silica Collapsible — a single show/hide disclosure (Base UI behavior, animated
+ * height). The primitive behind `Accordion`; use it when you have just one
+ * region to reveal.
+ *
+ *   <Collapsible defaultOpen>
+ *     <CollapsibleTrigger>Shipping details</CollapsibleTrigger>
+ *     <CollapsiblePanel>Ships in 2–3 business days.</CollapsiblePanel>
+ *   </Collapsible>
+ */
+declare function Collapsible({ className, ...rest }: CollapsibleProps): React.JSX.Element;
+interface CollapsibleTriggerProps extends Styled$8<typeof Collapsible$1.Trigger> {
+    /** Set false to omit the built-in chevron. */
+    chevron?: boolean;
+}
+declare function CollapsibleTrigger({ className, children, chevron, ...rest }: CollapsibleTriggerProps): React.JSX.Element;
+interface CollapsiblePanelProps extends Styled$8<typeof Collapsible$1.Panel> {
+    children?: React.ReactNode;
+}
+declare function CollapsiblePanel({ className, children, ...rest }: CollapsiblePanelProps): React.JSX.Element;
+
+type Styled$7<T extends React.ElementType> = Omit<React.ComponentPropsWithoutRef<T>, "className"> & {
+    className?: string;
+};
+type AlertDialogProps = React.ComponentProps<typeof AlertDialog$1.Root>;
+/**
+ * Silica AlertDialog — a confirmation modal from Base UI. Unlike `Dialog`, its
+ * backdrop is inert: clicking outside will NOT dismiss it, so the user can't
+ * lose the decision by tapping away (Escape still cancels, per the ARIA alert
+ * dialog pattern). Reach for it on destructive or consequential actions; reuses
+ * the Dialog surface styling.
+ *
+ *   <AlertDialog>
+ *     <AlertDialogTrigger><Button color="error">Delete account</Button></AlertDialogTrigger>
+ *     <AlertDialogContent>
+ *       <AlertDialogTitle>Delete account?</AlertDialogTitle>
+ *       <AlertDialogDescription>This permanently removes your data.</AlertDialogDescription>
+ *       <div className="mt-4 flex justify-end gap-2">
+ *         <AlertDialogClose><Button variant="ghost">Cancel</Button></AlertDialogClose>
+ *         <AlertDialogClose><Button color="error" onClick={destroy}>Delete</Button></AlertDialogClose>
+ *       </div>
+ *     </AlertDialogContent>
+ *   </AlertDialog>
+ */
+declare const AlertDialog: typeof AlertDialog$1.Root;
+/** Wraps its single child element as the element that opens the dialog. */
+declare function AlertDialogTrigger({ children, }: {
+    children: React.ReactElement;
+}): React.JSX.Element;
+/** Wraps its single child element as an element that closes the dialog. */
+declare function AlertDialogClose({ children, }: {
+    children: React.ReactElement;
+}): React.JSX.Element;
+interface AlertDialogContentProps extends Omit<Styled$7<typeof AlertDialog$1.Popup>, "children"> {
+    children?: React.ReactNode;
+    /** Class for the backdrop layer. */
+    backdropClassName?: string;
+}
+/** Portals + backdrop + the centered popup surface in one (shares Dialog styles). */
+declare function AlertDialogContent({ className, backdropClassName, children, ...rest }: AlertDialogContentProps): React.JSX.Element;
+declare function AlertDialogTitle({ className, ...rest }: Styled$7<typeof AlertDialog$1.Title>): React.JSX.Element;
+declare function AlertDialogDescription({ className, ...rest }: Styled$7<typeof AlertDialog$1.Description>): React.JSX.Element;
+
+interface FilterProps extends Omit<React.HTMLAttributes<HTMLDivElement>, "onChange" | "color"> {
+    /** Controlled selected value (`undefined` = nothing selected). */
+    value?: string;
+    /** Uncontrolled initial value. */
+    defaultValue?: string;
+    /** Fires with the new value, or `undefined` when reset. */
+    onValueChange?: (value: string | undefined) => void;
+    /** Accent for the selected chip. */
+    color?: SilicaColor;
+    /** Disable every chip + the reset. */
+    disabled?: boolean;
+    /** Render the reset (×) once something is selected (default true). */
+    showReset?: boolean;
+    /** Accessible label for the reset control. */
+    resetLabel?: string;
+}
+/**
+ * Silica Filter — a single-select row of chips with a reset, for faceted
+ * product/category filtering. Radio semantics: one chip at a time; the reset
+ * clears the choice. Pair with `FilterItem`s.
+ *
+ *   <Filter defaultValue="all" color="primary">
+ *     <FilterItem value="all">All</FilterItem>
+ *     <FilterItem value="apparel">Apparel</FilterItem>
+ *     <FilterItem value="gear">Gear</FilterItem>
+ *   </Filter>
+ */
+declare function Filter({ value, defaultValue, onValueChange, color, disabled, showReset, resetLabel, className, children, ...rest }: FilterProps): React.JSX.Element;
+interface FilterItemProps extends Omit<React.ButtonHTMLAttributes<HTMLButtonElement>, "value"> {
+    /** This chip's value. */
+    value: string;
+}
+/** One selectable chip within a Filter. */
+declare const FilterItem: React.ForwardRefExoticComponent<FilterItemProps & React.RefAttributes<HTMLButtonElement>>;
+
+type Styled$6<T extends React.ElementType> = Omit<React.ComponentPropsWithoutRef<T>, "className"> & {
+    className?: string;
+};
+type PositionerProps$6 = React.ComponentProps<typeof Select$1.Positioner>;
+type SelectSide = NonNullable<PositionerProps$6["side"]>;
+type SelectAlign = NonNullable<PositionerProps$6["align"]>;
+type SelectColor = SilicaColor;
+type SelectSize = SilicaSize;
+interface SelectItemProps extends Omit<Styled$6<typeof Select$1.Item>, "children"> {
+    /** The value stored when this item is chosen. */
+    value: unknown;
+    children?: React.ReactNode;
+}
+/** One option. Renders its own selected-check indicator. */
+declare function SelectItem({ className, children, ...rest }: SelectItemProps): React.JSX.Element;
+/** Groups related items; pair with a `SelectGroupLabel`. */
+declare function SelectGroup(props: React.ComponentProps<typeof Select$1.Group>): React.JSX.Element;
+/** A heading for a `SelectGroup` — MUST be rendered inside one. */
+declare function SelectGroupLabel({ className, ...rest }: Styled$6<typeof Select$1.GroupLabel>): React.JSX.Element;
+declare function SelectSeparator({ className, ...rest }: Styled$6<typeof Select$1.Separator>): React.JSX.Element;
+interface SelectOptionData {
+    label: React.ReactNode;
+    value: unknown;
+}
+type SelectItems = Record<string, React.ReactNode> | ReadonlyArray<SelectOptionData>;
+interface SelectProps {
+    /** Controlled value (array when `multiple`). */
+    value?: unknown;
+    /** Uncontrolled initial value. */
+    defaultValue?: unknown;
+    /** Fires with the newly-selected value. */
+    onValueChange?: (value: unknown, eventDetails?: unknown) => void;
+    /** Allow selecting multiple items (value becomes an array). */
+    multiple?: boolean;
+    /**
+     * Value→label map used to render the trigger's selected label (and, if no
+     * children are given, to auto-render the options). A record (`{value: label}`)
+     * or an array (`[{ value, label }]`).
+     */
+    items?: SelectItems;
+    /** Field name for form submission. */
+    name?: string;
+    disabled?: boolean;
+    required?: boolean;
+    readOnly?: boolean;
+    /** Shown on the trigger while nothing is selected. */
+    placeholder?: React.ReactNode;
+    /** Accent for the trigger border + focus ring (shares NativeSelect colors). */
+    color?: SelectColor;
+    /** Trigger height; matches same-size Inputs/Buttons. */
+    size?: SelectSize;
+    side?: SelectSide;
+    align?: SelectAlign;
+    sideOffset?: number;
+    /** Overlay the selected item on the trigger (native-select style). Default false. */
+    alignItemWithTrigger?: boolean;
+    /** Class for the trigger button. */
+    className?: string;
+    /** Class for the popup surface. */
+    popupClassName?: string;
+    /** Accessible name when there's no associated visible label. */
+    "aria-label"?: string;
+    "aria-labelledby"?: string;
+    id?: string;
+    /** `SelectItem`/`SelectGroup`/`SelectSeparator`s. Omit to auto-render `items`. */
+    children?: React.ReactNode;
+}
+/**
+ * Silica Select — a fully-styled, keyboard-driven listbox (Base UI: typeahead,
+ * roving focus, portalled popup, optional multi-select). The trigger matches
+ * `NativeSelect` pixel-for-pixel; reach for `NativeSelect` only when you need a
+ * bare platform `<select>`.
+ *
+ *   // items-driven (auto-renders options, powers the trigger label):
+ *   <Select
+ *     items={{ react: "React", vue: "Vue", svelte: "Svelte" }}
+ *     value={fw} onValueChange={setFw} placeholder="Framework" color="primary"
+ *   />
+ *
+ *   // composable:
+ *   <Select value={fw} onValueChange={setFw} items={labels} placeholder="Framework">
+ *     <SelectGroup>
+ *       <SelectGroupLabel>Frontend</SelectGroupLabel>
+ *       <SelectItem value="react">React</SelectItem>
+ *       <SelectItem value="vue">Vue</SelectItem>
+ *     </SelectGroup>
+ *   </Select>
+ */
+declare function Select({ value, defaultValue, onValueChange, multiple, items, name, disabled, required, readOnly, placeholder, color, size, side, align, sideOffset, alignItemWithTrigger, className, popupClassName, id, children, ...aria }: SelectProps): React.JSX.Element;
+
+type Styled$5<T extends React.ElementType> = Omit<React.ComponentPropsWithoutRef<T>, "className"> & {
+    className?: string;
+};
+type PositionerProps$5 = React.ComponentProps<typeof Combobox$1.Positioner>;
+type ComboboxSide = NonNullable<PositionerProps$5["side"]>;
+type ComboboxAlign = NonNullable<PositionerProps$5["align"]>;
+type ComboboxColor = SilicaColor;
+type ComboboxSize = SilicaSize;
+interface ComboboxItemProps extends Omit<Styled$5<typeof Combobox$1.Item>, "children"> {
+    value: unknown;
+    children?: React.ReactNode;
+    /** Show the leading selected-check (default true). */
+    indicator?: boolean;
+}
+/** One option row within a Combobox. */
+declare function ComboboxItem({ className, children, indicator, ...rest }: ComboboxItemProps): React.JSX.Element;
+interface ComboboxProps {
+    /** The full option set (strings or `{ value, label }`); Base UI filters it. */
+    items: readonly unknown[];
+    /** Controlled selected value. */
+    value?: unknown;
+    /** Uncontrolled initial value. */
+    defaultValue?: unknown;
+    /** Fires with the newly-selected value. */
+    onValueChange?: (value: unknown, eventDetails?: unknown) => void;
+    name?: string;
+    disabled?: boolean;
+    required?: boolean;
+    placeholder?: string;
+    /** Shown in the popup when nothing matches the query. */
+    emptyMessage?: React.ReactNode;
+    /** Accent for the input border + focus ring (shares Input colors). */
+    color?: ComboboxColor;
+    /** Input height; matches same-size Inputs. */
+    size?: ComboboxSize;
+    /** Show the clear (×) button (default true). */
+    clearable?: boolean;
+    side?: ComboboxSide;
+    align?: ComboboxAlign;
+    sideOffset?: number;
+    /** Class for the text input. */
+    className?: string;
+    /** Class for the popup surface. */
+    popupClassName?: string;
+    /** For object items, map an item to its display string (default: `.label`). */
+    itemToStringLabel?: (item: unknown) => string;
+    /** Override how each filtered item renders. */
+    renderItem?: (item: unknown, index: number) => React.ReactNode;
+    "aria-label"?: string;
+    "aria-labelledby"?: string;
+    id?: string;
+}
+/**
+ * Silica Combobox — a searchable, filtered listbox (Base UI: typeahead filtering,
+ * roving focus, portalled popup). Type to narrow `items`; pick to select. The
+ * input matches the field tier like `Input`.
+ *
+ *   <Combobox
+ *     items={["Alabama", "Alaska", "Arizona", "Arkansas"]}
+ *     value={state} onValueChange={setState}
+ *     placeholder="Search states…"
+ *   />
+ *
+ *   // object items:
+ *   <Combobox
+ *     items={[{ value: "us", label: "United States" }, { value: "ca", label: "Canada" }]}
+ *     placeholder="Country" color="primary"
+ *   />
+ */
+declare function Combobox({ items, value, defaultValue, onValueChange, name, disabled, required, placeholder, emptyMessage, color, size, clearable, side, align, sideOffset, className, popupClassName, itemToStringLabel, renderItem, id, ...aria }: ComboboxProps): React.JSX.Element;
+
+type Styled$4<T extends React.ElementType> = Omit<React.ComponentPropsWithoutRef<T>, "className"> & {
+    className?: string;
+};
+type PositionerProps$4 = React.ComponentProps<typeof Autocomplete$1.Positioner>;
+type AutocompleteSide = NonNullable<PositionerProps$4["side"]>;
+type AutocompleteAlign = NonNullable<PositionerProps$4["align"]>;
+type AutocompleteColor = SilicaColor;
+type AutocompleteSize = SilicaSize;
+type AutocompleteMode = "list" | "both" | "inline" | "none";
+interface AutocompleteItemProps extends Omit<Styled$4<typeof Autocomplete$1.Item>, "children"> {
+    value: unknown;
+    children?: React.ReactNode;
+}
+/** One suggestion row within an Autocomplete. */
+declare function AutocompleteItem({ className, children, ...rest }: AutocompleteItemProps): React.JSX.Element;
+interface AutocompleteProps {
+    /** Suggestion set; filtered by the input value (in `list`/`both` modes). */
+    items: readonly string[];
+    /** Controlled input value. */
+    value?: string;
+    /** Uncontrolled initial input value. */
+    defaultValue?: string;
+    /** Fires with the new input string. */
+    onValueChange?: (value: string, eventDetails?: unknown) => void;
+    /** Suggestion behavior; `list` (default) filters the list as you type. */
+    mode?: AutocompleteMode;
+    name?: string;
+    disabled?: boolean;
+    required?: boolean;
+    placeholder?: string;
+    /** Shown in the popup when nothing matches the query. */
+    emptyMessage?: React.ReactNode;
+    /** Accent for the input border + focus ring (shares Input colors). */
+    color?: AutocompleteColor;
+    /** Input height; matches same-size Inputs. */
+    size?: AutocompleteSize;
+    /** Show the clear (×) button (default true). */
+    clearable?: boolean;
+    side?: AutocompleteSide;
+    align?: AutocompleteAlign;
+    sideOffset?: number;
+    /** Class for the text input. */
+    className?: string;
+    /** Class for the popup surface. */
+    popupClassName?: string;
+    /** Override how each filtered suggestion renders. */
+    renderItem?: (item: string, index: number) => React.ReactNode;
+    "aria-label"?: string;
+    "aria-labelledby"?: string;
+    id?: string;
+}
+/**
+ * Silica Autocomplete — a free-text input with a filtered suggestion list
+ * (Base UI). Unlike `Combobox` (which selects a value from a fixed set), the
+ * value here IS the typed string; suggestions just help complete it.
+ *
+ *   <Autocomplete
+ *     items={["React", "React Native", "Redux", "Remix"]}
+ *     value={q} onValueChange={setQ}
+ *     placeholder="Search the docs…"
+ *   />
+ */
+declare function Autocomplete({ items, value, defaultValue, onValueChange, mode, name, disabled, required, placeholder, emptyMessage, color, size, clearable, side, align, sideOffset, className, popupClassName, renderItem, id, ...aria }: AutocompleteProps): React.JSX.Element;
+
+type CalendarColor = SilicaColor;
+type CalendarMode = "single" | "range";
+type Weekday = 0 | 1 | 2 | 3 | 4 | 5 | 6;
+interface DateRange {
+    start: Date | null;
+    end: Date | null;
+}
+type CalendarValue = Date | DateRange | null;
+interface CalendarProps {
+    /** `single` (default) selects one date; `range` selects a start/end pair. */
+    mode?: CalendarMode;
+    /** Controlled selection — a `Date` in single mode, a `DateRange` in range mode. */
+    value?: CalendarValue;
+    /** Uncontrolled initial selection. */
+    defaultValue?: CalendarValue;
+    /** Fires with the new selection. */
+    onValueChange?: (value: CalendarValue) => void;
+    /** Controlled visible (left-most) month. */
+    month?: Date;
+    /** Uncontrolled initial visible month. */
+    defaultMonth?: Date;
+    onMonthChange?: (month: Date) => void;
+    /** How many month grids to show side by side (default 1; 2 for range). */
+    numberOfMonths?: number;
+    /** 0 = Sunday (default) … 6 = Saturday. */
+    weekStartsOn?: Weekday;
+    /** Selectable bounds (inclusive). */
+    min?: Date;
+    max?: Date;
+    /** Per-date disable predicate. */
+    isDateDisabled?: (date: Date) => boolean;
+    /** BCP-47 locale for month/weekday names (default: runtime locale). */
+    locale?: string;
+    /** Accent for the selection. */
+    color?: CalendarColor;
+    className?: string;
+    "aria-label"?: string;
+}
+/**
+ * Silica Calendar — a from-scratch month-grid date picker (single date or a
+ * range), with full keyboard navigation (arrows, PageUp/Down, Home/End,
+ * Enter/Space). The primitive behind `DatePicker` / `DateRangePicker`; render it
+ * inline when you want an always-visible calendar.
+ *
+ *   <Calendar value={date} onValueChange={setDate} />
+ *   <Calendar mode="range" numberOfMonths={2} value={range} onValueChange={setRange} />
+ */
+declare function Calendar({ mode, value, defaultValue, onValueChange, month, defaultMonth, onMonthChange, numberOfMonths, weekStartsOn, min, max, isDateDisabled, locale, color, className, ...aria }: CalendarProps): React.JSX.Element;
+
+type PositionerProps$3 = React.ComponentProps<typeof Popover$1.Positioner>;
+type DatePickerSide = NonNullable<PositionerProps$3["side"]>;
+type DatePickerAlign = NonNullable<PositionerProps$3["align"]>;
+type DatePickerColor = CalendarColor;
+type DatePickerSize = SilicaSize;
+interface DatePickerProps {
+    value?: Date | null;
+    defaultValue?: Date | null;
+    onValueChange?: (value: Date | null) => void;
+    placeholder?: React.ReactNode;
+    disabled?: boolean;
+    weekStartsOn?: Weekday;
+    min?: Date;
+    max?: Date;
+    isDateDisabled?: (date: Date) => boolean;
+    locale?: string;
+    /** Intl options for the trigger label (default `{ dateStyle: "medium" }`). */
+    formatOptions?: Intl.DateTimeFormatOptions;
+    color?: DatePickerColor;
+    size?: DatePickerSize;
+    side?: DatePickerSide;
+    align?: DatePickerAlign;
+    sideOffset?: number;
+    className?: string;
+    popupClassName?: string;
+    id?: string;
+    "aria-label"?: string;
+}
+/**
+ * Silica DatePicker — an input that opens a `Calendar` popover to pick one date.
+ *
+ *   <DatePicker value={date} onValueChange={setDate} placeholder="Pick a date" />
+ */
+declare function DatePicker({ value, defaultValue, onValueChange, placeholder, disabled, weekStartsOn, min, max, isDateDisabled, locale, formatOptions, color, size, side, align, sideOffset, className, popupClassName, id, "aria-label": ariaLabel, }: DatePickerProps): React.JSX.Element;
+interface DateRangePickerProps {
+    value?: DateRange;
+    defaultValue?: DateRange;
+    onValueChange?: (value: DateRange) => void;
+    placeholder?: React.ReactNode;
+    disabled?: boolean;
+    numberOfMonths?: number;
+    weekStartsOn?: Weekday;
+    min?: Date;
+    max?: Date;
+    isDateDisabled?: (date: Date) => boolean;
+    locale?: string;
+    formatOptions?: Intl.DateTimeFormatOptions;
+    color?: DatePickerColor;
+    size?: DatePickerSize;
+    side?: DatePickerSide;
+    align?: DatePickerAlign;
+    sideOffset?: number;
+    className?: string;
+    popupClassName?: string;
+    id?: string;
+    "aria-label"?: string;
+}
+/**
+ * Silica DateRangePicker — an input that opens a two-month `Calendar` to pick a
+ * start/end range. Closes once both ends are chosen.
+ *
+ *   <DateRangePicker value={range} onValueChange={setRange} />
+ */
+declare function DateRangePicker({ value, defaultValue, onValueChange, placeholder, disabled, numberOfMonths, weekStartsOn, min, max, isDateDisabled, locale, formatOptions, color, size, side, align, sideOffset, className, popupClassName, id, "aria-label": ariaLabel, }: DateRangePickerProps): React.JSX.Element;
+
+type PositionerProps$2 = React.ComponentProps<typeof Tooltip$1.Positioner>;
+type TooltipSide = NonNullable<PositionerProps$2["side"]>;
+type TooltipAlign = NonNullable<PositionerProps$2["align"]>;
+interface TooltipProps {
+    /** The floating content. */
+    content: React.ReactNode;
+    /** The trigger element — Base UI merges hover/focus behavior onto it. */
+    children: React.ReactElement;
+    /** Which side of the trigger to prefer. Default `top` (flips to avoid collisions). */
+    side?: TooltipSide;
+    /** Alignment along that side. Default `center`. */
+    align?: TooltipAlign;
+    /** Gap between trigger and popup, in px. Default `8`. */
+    sideOffset?: number;
+    /** Hover-open delay in ms. Default `600` (Base UI). */
+    delay?: number;
+    /** Close delay in ms. Default `0`. */
+    closeDelay?: number;
+    /** Controlled open state. */
+    open?: boolean;
+    /** Uncontrolled initial open state. */
+    defaultOpen?: boolean;
+    onOpenChange?: (open: boolean) => void;
+    /** Disable the tooltip entirely. */
+    disabled?: boolean;
+    /** Show the little arrow. Default `true`. */
+    arrow?: boolean;
+    /** Extra class on the popup surface. */
+    className?: string;
+}
+/**
+ * Silica Tooltip — behavior from Base UI, look from Silica's `.tooltip` CSS.
+ *
+ *   <Tooltip content="Copy link">
+ *     <Button variant="ghost">Copy</Button>
+ *   </Tooltip>
+ *
+ * Wrap a subtree in <TooltipProvider> to share a delay across many tooltips
+ * (adjacent ones then open instantly).
+ */
+declare function Tooltip({ content, children, side, align, sideOffset, delay, closeDelay, open, defaultOpen, onOpenChange, disabled, arrow, className, }: TooltipProps): React.JSX.Element;
+type TooltipProviderProps = React.ComponentProps<typeof Tooltip$1.Provider>;
+/** Shares a hover delay across the tooltips beneath it (adjacent open instantly). */
+declare function TooltipProvider(props: TooltipProviderProps): React.JSX.Element;
+
+type Styled$3<T extends React.ElementType> = Omit<React.ComponentPropsWithoutRef<T>, "className"> & {
+    className?: string;
+};
+type DialogProps = React.ComponentProps<typeof Dialog$1.Root>;
+/**
+ * Silica Dialog — a modal, from Base UI (focus trap + scroll lock + dismissal).
+ *
+ *   <Dialog>
+ *     <DialogTrigger><Button>Delete…</Button></DialogTrigger>
+ *     <DialogContent>
+ *       <DialogTitle>Delete project?</DialogTitle>
+ *       <DialogDescription>This can't be undone.</DialogDescription>
+ *       <div className="mt-4 flex justify-end gap-2">
+ *         <DialogClose><Button variant="ghost">Cancel</Button></DialogClose>
+ *         <DialogClose><Button color="error">Delete</Button></DialogClose>
+ *       </div>
+ *     </DialogContent>
+ *   </Dialog>
+ *
+ * Pass `modal="trap-focus"` for a non-scroll-locking dialog, or control it with
+ * `open`/`onOpenChange`.
+ */
+declare const Dialog: typeof Dialog$1.Root;
+/** Wraps its single child element as the element that opens the dialog. */
+declare function DialogTrigger({ children }: {
+    children: React.ReactElement;
+}): React.JSX.Element;
+/** Wraps its single child element as an element that closes the dialog. */
+declare function DialogClose({ children }: {
+    children: React.ReactElement;
+}): React.JSX.Element;
+interface DialogContentProps extends Omit<Styled$3<typeof Dialog$1.Popup>, "children"> {
+    children?: React.ReactNode;
+    /** Class for the backdrop layer. */
+    backdropClassName?: string;
+}
+/** Portals + backdrop + the centered popup surface in one. */
+declare function DialogContent({ className, backdropClassName, children, ...rest }: DialogContentProps): React.JSX.Element;
+declare function DialogTitle({ className, ...rest }: Styled$3<typeof Dialog$1.Title>): React.JSX.Element;
+declare function DialogDescription({ className, ...rest }: Styled$3<typeof Dialog$1.Description>): React.JSX.Element;
+
+type Styled$2<T extends React.ElementType> = Omit<React.ComponentPropsWithoutRef<T>, "className"> & {
+    className?: string;
+};
+type PositionerProps$1 = React.ComponentProps<typeof Popover$1.Positioner>;
+type PopoverSide = NonNullable<PositionerProps$1["side"]>;
+type PopoverAlign = NonNullable<PositionerProps$1["align"]>;
+type PopoverProps = React.ComponentProps<typeof Popover$1.Root>;
+/**
+ * Silica Popover — a click-triggered floating panel (Base UI).
+ *
+ *   <Popover>
+ *     <PopoverTrigger><Button variant="outline">Details</Button></PopoverTrigger>
+ *     <PopoverContent>
+ *       <PopoverTitle>Storage</PopoverTitle>
+ *       <PopoverDescription>92% of your quota is used.</PopoverDescription>
+ *     </PopoverContent>
+ *   </Popover>
+ */
+declare const Popover: typeof Popover$1.Root;
+declare function PopoverTrigger({ children }: {
+    children: React.ReactElement;
+}): React.JSX.Element;
+declare function PopoverClose({ children }: {
+    children: React.ReactElement;
+}): React.JSX.Element;
+interface PopoverContentProps extends Omit<Styled$2<typeof Popover$1.Popup>, "children"> {
+    children?: React.ReactNode;
+    side?: PopoverSide;
+    align?: PopoverAlign;
+    sideOffset?: number;
+    /** Show the little arrow. Default `false`. */
+    arrow?: boolean;
+}
+/** Portal + positioner + the popup panel. */
+declare function PopoverContent({ className, children, side, align, sideOffset, arrow, ...rest }: PopoverContentProps): React.JSX.Element;
+declare function PopoverTitle({ className, ...rest }: Styled$2<typeof Popover$1.Title>): React.JSX.Element;
+declare function PopoverDescription({ className, ...rest }: Styled$2<typeof Popover$1.Description>): React.JSX.Element;
+
+type Styled$1<T extends React.ElementType> = Omit<React.ComponentPropsWithoutRef<T>, "className"> & {
+    className?: string;
+};
+type PositionerProps = React.ComponentProps<typeof Menu$1.Positioner>;
+type DropdownMenuSide = NonNullable<PositionerProps["side"]>;
+type DropdownMenuAlign = NonNullable<PositionerProps["align"]>;
+type DropdownMenuProps = React.ComponentProps<typeof Menu$1.Root>;
+/**
+ * Silica Dropdown Menu — a command menu (Base UI: roving focus, typeahead,
+ * dismissal). Distinct from the static `Menu` nav-list.
+ *
+ *   <DropdownMenu>
+ *     <DropdownMenuTrigger><Button variant="outline">Options</Button></DropdownMenuTrigger>
+ *     <DropdownMenuContent>
+ *       <DropdownMenuLabel>Actions</DropdownMenuLabel>
+ *       <DropdownMenuItem onClick={…}>Edit</DropdownMenuItem>
+ *       <DropdownMenuItem onClick={…}>Duplicate</DropdownMenuItem>
+ *       <DropdownMenuSeparator />
+ *       <DropdownMenuItem disabled>Archive</DropdownMenuItem>
+ *     </DropdownMenuContent>
+ *   </DropdownMenu>
+ */
+declare const DropdownMenu: typeof Menu$1.Root;
+declare function DropdownMenuTrigger({ children }: {
+    children: React.ReactElement;
+}): React.JSX.Element;
+interface DropdownMenuContentProps extends Omit<Styled$1<typeof Menu$1.Popup>, "children"> {
+    children?: React.ReactNode;
+    side?: DropdownMenuSide;
+    align?: DropdownMenuAlign;
+    sideOffset?: number;
+}
+/** Portal + positioner + the menu popup. */
+declare function DropdownMenuContent({ className, children, side, align, sideOffset, ...rest }: DropdownMenuContentProps): React.JSX.Element;
+declare function DropdownMenuItem({ className, ...rest }: Styled$1<typeof Menu$1.Item>): React.JSX.Element;
+declare function DropdownMenuSeparator({ className, ...rest }: Styled$1<typeof Menu$1.Separator>): React.JSX.Element;
+declare function DropdownMenuGroup(props: React.ComponentProps<typeof Menu$1.Group>): React.JSX.Element;
+declare function DropdownMenuLabel({ className, ...rest }: Styled$1<typeof Menu$1.GroupLabel>): React.JSX.Element;
+
+type Styled<T extends React.ElementType> = Omit<React.ComponentPropsWithoutRef<T>, "className"> & {
+    className?: string;
+};
+type TabValue = React.ComponentProps<typeof Tabs$1.Tab>["value"];
+/** Visual style. `underline` (default), `boxed` (segmented), or `pills`. */
+type TabsVariant = "underline" | "boxed" | "pills";
+type TabsColor = SilicaColor;
+interface TabsProps extends Styled<typeof Tabs$1.Root> {
+    variant?: TabsVariant;
+    /** Accent color (underline + pills fill); maps to `tabs-<color>`. Default primary. */
+    color?: TabsColor;
+}
+/**
+ * Silica Tabs — Base UI selection state + roving focus + a moving indicator.
+ *
+ *   <Tabs defaultValue="account" variant="boxed">
+ *     <TabsList>
+ *       <TabsTab value="account">Account</TabsTab>
+ *       <TabsTab value="password">Password</TabsTab>
+ *     </TabsList>
+ *     <TabsPanel value="account">…</TabsPanel>
+ *     <TabsPanel value="password">…</TabsPanel>
+ *   </Tabs>
+ *
+ * The same sliding indicator styles per variant — an underline, or a full pill.
+ */
+declare function Tabs({ variant, color, className, ...rest }: TabsProps): React.JSX.Element;
+interface TabsListProps extends Omit<Styled<typeof Tabs$1.List>, "children"> {
+    children?: React.ReactNode;
+    /** Render the moving underline indicator. Default `true`. */
+    indicator?: boolean;
+}
+declare function TabsList({ className, children, indicator, ...rest }: TabsListProps): React.JSX.Element;
+declare function TabsTab({ className, ...rest }: Styled<typeof Tabs$1.Tab>): React.JSX.Element;
+declare function TabsPanel({ className, ...rest }: Styled<typeof Tabs$1.Panel>): React.JSX.Element;
+
+interface CheckboxProps extends Omit<React.InputHTMLAttributes<HTMLInputElement>, "size" | "color" | "type"> {
+    /** Accent color; maps to `checkbox-<color>` (checked fill + focus ring). */
+    color?: SilicaColor;
+    /** Default `md`. */
+    size?: SilicaSize;
+}
+/**
+ * Silica Checkbox — a restyled native `<input type="checkbox">`. All native
+ * attributes (`checked`, `defaultChecked`, `onChange`, `disabled`, …) pass
+ * through. Pair it with your own `<label>` for a clickable caption.
+ */
+declare const Checkbox: React.ForwardRefExoticComponent<CheckboxProps & React.RefAttributes<HTMLInputElement>>;
+
+interface RadioProps extends Omit<React.InputHTMLAttributes<HTMLInputElement>, "size" | "color" | "type"> {
+    /** Accent color; maps to `radio-<color>` (checked dot + focus ring). */
+    color?: SilicaColor;
+    /** Default `md`. */
+    size?: SilicaSize;
+}
+/**
+ * Silica Radio — a restyled native `<input type="radio">`. Group them by giving
+ * several the same `name`. All native attributes pass through.
+ */
+declare const Radio: React.ForwardRefExoticComponent<RadioProps & React.RefAttributes<HTMLInputElement>>;
+
+interface ToggleProps extends Omit<React.InputHTMLAttributes<HTMLInputElement>, "size" | "color" | "type"> {
+    /** Accent color; maps to `toggle-<color>` (checked track fill). */
+    color?: SilicaColor;
+    /** Default `md`. */
+    size?: SilicaSize;
+}
+/**
+ * Silica Toggle — a restyled native `<input type="checkbox">` presented as a
+ * switch. Adds `role="switch"` for assistive tech; all native attributes
+ * (`checked`, `onChange`, `disabled`, …) pass through.
+ */
+declare const Toggle: React.ForwardRefExoticComponent<ToggleProps & React.RefAttributes<HTMLInputElement>>;
+
+type TagInputSize = "sm" | "md" | "lg";
+interface TagInputProps extends Omit<React.HTMLAttributes<HTMLDivElement>, "onChange" | "color"> {
+    /** Controlled tag list. */
+    value?: string[];
+    /** Uncontrolled initial tags. */
+    defaultValue?: string[];
+    /** Called with the next tag list whenever it changes. */
+    onValueChange?: (tags: string[]) => void;
+    /** Placeholder shown in the text field when there are no tags. */
+    placeholder?: string;
+    /** Disable the whole control. */
+    disabled?: boolean;
+    /** Chip + focus-ring accent color. */
+    color?: SilicaColor;
+    /** Height/type scale. Default `"md"`. */
+    size?: TagInputSize;
+    /** Keys that commit the current text as a tag. Default `["Enter", ","]`. */
+    separators?: string[];
+    /** Reject duplicate tags. Default `true`. */
+    dedupe?: boolean;
+    /** Maximum number of tags. */
+    max?: number;
+    /** Commit any pending text when the field loses focus. Default `true`. */
+    addOnBlur?: boolean;
+    /** Extra props for the inner `<input>`. */
+    inputProps?: React.InputHTMLAttributes<HTMLInputElement>;
+}
+/**
+ * A chip-based multi-value text field — tags for segments, recipients,
+ * categories, and the like. Type and press Enter (or comma) to add; Backspace on
+ * an empty field removes the last tag. Controlled via `value`/`onValueChange` or
+ * uncontrolled via `defaultValue`.
+ */
+declare const TagInput: React.ForwardRefExoticComponent<TagInputProps & React.RefAttributes<HTMLDivElement>>;
+
+type EmptyStateSize = "sm" | "md";
+interface EmptyStateProps extends Omit<React.HTMLAttributes<HTMLDivElement>, "title"> {
+    /** Icon/illustration shown in the chip above the title. */
+    icon?: React.ReactNode;
+    /** Headline (e.g. "No orders yet"). */
+    title?: React.ReactNode;
+    /** Supporting copy under the title. */
+    description?: React.ReactNode;
+    /** Action buttons/links rendered below the copy. */
+    actions?: React.ReactNode;
+    /** `"md"` (default) or the more compact `"sm"`. */
+    size?: EmptyStateSize;
+}
+/**
+ * The centered "nothing here yet" placeholder — icon, title, description, and an
+ * action row. Drop it into an empty list, a table body, a card, or a panel.
+ * Slots are optional; `children` renders between the description and the actions
+ * for custom content.
+ */
+declare const EmptyState: React.ForwardRefExoticComponent<EmptyStateProps & React.RefAttributes<HTMLDivElement>>;
+
+/**
+ * OKLCH ↔ sRGB color math — pure, dependency-free.
+ *
+ * SilicaUI's whole color system is OKLCH (see the theme tokens), so the
+ * `ColorPicker` is OKLCH-native: it edits L (lightness 0–1), C (chroma 0–~0.37),
+ * and H (hue 0–360) directly. These helpers convert to/from sRGB so the picker
+ * can show a hex readout and accept hex input, and clamp out-of-gamut colors for
+ * display. The matrices are Björn Ottosson's canonical OKLab ⇄ linear-sRGB
+ * transforms (https://bottosson.github.io/posts/oklab/).
+ */
+interface Oklch {
+    /** Lightness, 0–1. */
+    l: number;
+    /** Chroma, 0–~0.37 (values past the sRGB gamut get clamped on export). */
+    c: number;
+    /** Hue angle in degrees, 0–360. */
+    h: number;
+}
+/** Largest chroma the picker exposes — a bit past sRGB's gamut for most hues. */
+declare const MAX_CHROMA = 0.37;
+/** True if the OKLCH color is representable in sRGB without clamping. */
+declare function inGamut(l: number, c: number, h: number): boolean;
+/** OKLCH → sRGB bytes (0–255), gamut-clamped per channel. */
+declare function oklchToRgb(l: number, c: number, h: number): [number, number, number];
+/** OKLCH → `#rrggbb`, gamut-clamped. */
+declare function oklchToHex(l: number, c: number, h: number): string;
+/** `#rgb`/`#rrggbb` → OKLCH, or `null` if it doesn't parse. */
+declare function hexToOklch(hex: string): Oklch | null;
+/** OKLCH → a canonical `oklch(L C H)` string with sensible rounding. */
+declare function formatOklch(l: number, c: number, h: number): string;
+/** Parse an `oklch(L C H)` string (L/C plain numbers or %) → OKLCH, or `null`. */
+declare function parseOklch(input: string): Oklch | null;
+
+type ColorPickerFormat = "oklch" | "hex";
+interface ColorPickerProps extends Omit<React.HTMLAttributes<HTMLDivElement>, "onChange" | "color"> {
+    /** Controlled color (an `oklch(…)` or `#hex` string). */
+    value?: string;
+    /** Uncontrolled initial color. Default `oklch(0.7 0.15 250)`. */
+    defaultValue?: string;
+    /** Fires with the formatted string AND the raw OKLCH on every change. */
+    onValueChange?: (value: string, oklch: Oklch) => void;
+    /** Output format handed to `onValueChange`. Default `"oklch"`. */
+    format?: ColorPickerFormat;
+    /** Show the hex read/write field. Default `true`. */
+    showHex?: boolean;
+    disabled?: boolean;
+}
+/**
+ * ColorPicker — an OKLCH-native color editor. SilicaUI's tokens are OKLCH, so
+ * the picker edits Lightness / Chroma / Hue directly (each slider's track shows
+ * the live ramp), previews the result, and reads/writes hex. Controlled via
+ * `value`/`onValueChange` or uncontrolled via `defaultValue`.
+ */
+declare const ColorPicker: React.ForwardRefExoticComponent<ColorPickerProps & React.RefAttributes<HTMLDivElement>>;
+
+interface CommandItem {
+    /** Stable identity (also the React key). */
+    id: string;
+    /** Primary text shown in the row. */
+    label: string;
+    /** Optional secondary line under the label. */
+    description?: string;
+    /** Optional leading icon (already an element, e.g. an `<svg>`). */
+    icon?: React.ReactNode;
+    /** Optional trailing shortcut hint, display-only (e.g. `"⌘P"`). */
+    shortcut?: string;
+    /** Extra terms to match against beyond the label/description. */
+    keywords?: string[];
+    /** Group heading this item lives under. */
+    group?: string;
+    disabled?: boolean;
+    /** Run when the item is chosen (click or Enter). */
+    onSelect?: () => void;
+}
+interface CommandPaletteProps {
+    /** The commands to show and filter. */
+    items: CommandItem[];
+    /** Controlled open state. */
+    open?: boolean;
+    /** Uncontrolled initial open state. */
+    defaultOpen?: boolean;
+    onOpenChange?: (open: boolean) => void;
+    /** Search box placeholder. */
+    placeholder?: string;
+    /** Shown when nothing matches. */
+    emptyMessage?: string;
+    /**
+     * Global toggle hotkey. `true` (default) binds ⌘K / Ctrl+K; pass a single
+     * letter to rebind (still combined with ⌘/Ctrl); `false` disables it.
+     */
+    hotkey?: boolean | string;
+    className?: string;
+}
+/**
+ * CommandPalette — a ⌘K launcher. Feed it a flat `items` list (optionally
+ * grouped); it filters as you type, moves the highlight with ↑/↓, runs the
+ * active command on Enter, and closes on Escape or backdrop click. Opens on
+ * ⌘K/Ctrl+K by default, or drive it with `open`/`onOpenChange`.
+ */
+declare function CommandPalette({ items, open, defaultOpen, onOpenChange, placeholder, emptyMessage, hotkey, className, }: CommandPaletteProps): React.JSX.Element;
+
+interface TreeNode {
+    /** Stable identity (React key + selection/expansion id). */
+    id: string;
+    /** Row label. */
+    label: React.ReactNode;
+    /** Optional leading icon element. */
+    icon?: React.ReactNode;
+    /** Child nodes; presence makes the node expandable. */
+    children?: TreeNode[];
+    disabled?: boolean;
+}
+interface TreeViewProps extends Omit<React.HTMLAttributes<HTMLUListElement>, "onSelect"> {
+    /** The node forest. */
+    items: TreeNode[];
+    /** Controlled set of expanded node ids. */
+    expanded?: string[];
+    /** Uncontrolled initial expanded ids. */
+    defaultExpanded?: string[];
+    onExpandedChange?: (expanded: string[]) => void;
+    /** Controlled selected node id. */
+    selected?: string;
+    /** Uncontrolled initial selected id. */
+    defaultSelected?: string;
+    onSelectedChange?: (id: string) => void;
+    /** Fires with the full node when one is selected. */
+    onSelect?: (node: TreeNode) => void;
+}
+/**
+ * TreeView — a hierarchical tree with full keyboard support (↑/↓ move,
+ * →/← expand-or-descend / collapse-or-ascend, Home/End, Enter selects, Space
+ * toggles). Feed it a `TreeNode[]` forest; control expansion via
+ * `expanded`/`onExpandedChange` and selection via `selected`/`onSelectedChange`,
+ * or run uncontrolled with the `default*` props.
+ */
+declare const TreeView: React.ForwardRefExoticComponent<TreeViewProps & React.RefAttributes<HTMLUListElement>>;
+
+interface DropzoneRejection {
+    file: File;
+    reason: "type" | "size";
+}
+interface DropzoneProps extends Omit<React.HTMLAttributes<HTMLDivElement>, "onDrop" | "title"> {
+    /** Called with the accepted files (from a drop or the picker). */
+    onFiles?: (files: File[]) => void;
+    /** Called with files rejected by `accept` / `maxSize`. */
+    onReject?: (rejections: DropzoneRejection[]) => void;
+    /** Native-style accept list, e.g. `"image/*,.pdf"`. */
+    accept?: string;
+    /** Allow selecting/dropping more than one file. Default `true`. */
+    multiple?: boolean;
+    /** Max size per file, in bytes. */
+    maxSize?: number;
+    disabled?: boolean;
+    /** Primary line. Default `"Drop files here, or click to browse"`. */
+    title?: React.ReactNode;
+    /** Secondary hint line (e.g. accepted types). */
+    hint?: React.ReactNode;
+    /** Override the default upload icon. */
+    icon?: React.ReactNode;
+    /** Extra props for the underlying `<input type=file>`. */
+    inputProps?: React.InputHTMLAttributes<HTMLInputElement>;
+}
+/**
+ * Dropzone — drag files onto it or click to open the picker. Emits accepted
+ * files via `onFiles` and anything filtered out by `accept`/`maxSize` via
+ * `onReject`. Purely presentational about the *result* — render your own file
+ * list from what `onFiles` hands you.
+ */
+declare const Dropzone: React.ForwardRefExoticComponent<DropzoneProps & React.RefAttributes<HTMLDivElement>>;
+
+interface WizardStep {
+    /** Stable identity + React key. */
+    id: string;
+    /** Step label under the marker. */
+    title: React.ReactNode;
+    /** Content shown when this step is active (unless `children` is provided). */
+    content?: React.ReactNode;
+    /** Marks the step "Optional" under its label. */
+    optional?: boolean;
+    /** Can't be navigated to. */
+    disabled?: boolean;
+}
+interface WizardProps extends Omit<React.HTMLAttributes<HTMLDivElement>, "onChange"> {
+    steps: WizardStep[];
+    /** Controlled active step index. */
+    activeStep?: number;
+    /** Uncontrolled initial step index. Default `0`. */
+    defaultStep?: number;
+    onStepChange?: (index: number) => void;
+    /** Accent color for markers + rail. */
+    color?: SilicaColor;
+    /**
+     * Linear flow: markers can only jump backward (revisit) or stay; forward is via
+     * Next. `false` lets any enabled step be clicked. Default `true`.
+     */
+    linear?: boolean;
+    /** Gate the Next button (e.g. until the active step validates). Default `true`. */
+    canGoNext?: boolean;
+    /** Called when Next is pressed on the last step. */
+    onFinish?: () => void;
+    backLabel?: string;
+    nextLabel?: string;
+    finishLabel?: string;
+    /** Hide the built-in Back / Next footer. */
+    hideFooter?: boolean;
+    /** Render your own content instead of the active step's `content`. */
+    children?: React.ReactNode;
+}
+/**
+ * Wizard — a multi-step flow with a numbered indicator, per-step content, and a
+ * Back / Next-or-Finish footer. Control the step via `activeStep`/`onStepChange`
+ * or run uncontrolled with `defaultStep`. Steps carry their own `content`, or
+ * pass `children` to render the body yourself. `canGoNext` gates advancing so you
+ * can require the current step to validate first.
+ */
+declare const Wizard: React.ForwardRefExoticComponent<WizardProps & React.RefAttributes<HTMLDivElement>>;
+
+/**
+ * Runtime configuration shared by all Silica React components.
+ *
+ * `prefix` MUST match the `prefix` you set on `@plugin "silicaui"` in your CSS.
+ * The CSS plugin emits `.<prefix>btn`; these components rebuild those class
+ * names at runtime, so both sides have to agree on the prefix.
+ */
+interface SilicaConfig {
+    /** Prepended verbatim to every Silica class (e.g. `"sx-"` → `sx-btn`). */
+    prefix: string;
+}
+interface SilicaProviderProps extends Partial<SilicaConfig> {
+    children: React.ReactNode;
+}
+/**
+ * Provides Silica config to the components beneath it. Providers may be nested —
+ * a client-site subtree can run under `prefix="st-"` inside a platform shell on
+ * `prefix="sx-"`, and each Silica component picks up its nearest provider.
+ *
+ *   <SilicaProvider prefix="sx-">
+ *     <App />
+ *   </SilicaProvider>
+ */
+declare function SilicaProvider({ prefix, children }: SilicaProviderProps): React.JSX.Element;
+/** Read the full Silica config from context (defaults to `{ prefix: "" }`). */
+declare function useSilicaConfig(): SilicaConfig;
+/**
+ * Returns a class-name builder bound to the active prefix. `cn("btn")` →
+ * `"sx-btn"` when a `prefix="sx-"` provider is in scope, or `"btn"` otherwise.
+ * Passing a nullish/false value returns it unchanged, so it composes with the
+ * same conditional style the components already use.
+ */
+declare function useSilicaClass(): (name: string | false | null | undefined) => string | false | null | undefined;
+
+/** Tiny className joiner. Falsy parts are dropped. */
+declare function cx(...parts: Array<string | false | null | undefined>): string;
+
+export { Accordion, AccordionItem, AccordionPanel, AccordionTrigger, type AccordionTriggerProps, Alert, AlertActions, type AlertColor, AlertContent, AlertDescription, AlertDialog, AlertDialogClose, AlertDialogContent, type AlertDialogContentProps, AlertDialogDescription, type AlertDialogProps, AlertDialogTitle, AlertDialogTrigger, type AlertProps, type AlertSize, AlertTitle, type AlertVariant, Autocomplete, type AutocompleteAlign, type AutocompleteColor, AutocompleteItem, type AutocompleteItemProps, type AutocompleteMode, type AutocompleteProps, type AutocompleteSide, type AutocompleteSize, Avatar, type AvatarColor, AvatarGroup, type AvatarProps, type AvatarShape, type AvatarSize, type AvatarStatus, Badge, type BadgeColor, type BadgeProps, type BadgeSize, type BadgeVariant, Breadcrumb, type BreadcrumbProps, Button, type ButtonColor, type ButtonProps, type ButtonSize, type ButtonVariant, Calendar, type CalendarColor, type CalendarMode, type CalendarProps, type CalendarValue, Card, CardActions, CardBody, type CardProps, CardTitle, Carousel, CarouselItem, type CarouselItemProps, type CarouselOrientation, type CarouselProps, type CarouselSnap, Chat, ChatBubble, type ChatBubbleColor, type ChatBubbleProps, ChatFooter, type ChatFooterProps, ChatHeader, type ChatHeaderProps, ChatImage, type ChatImageProps, type ChatProps, type ChatSide, Checkbox, CheckboxGroup, type CheckboxGroupOrientation, type CheckboxGroupProps, CheckboxOption, type CheckboxOptionProps, type CheckboxProps, Collapse, CollapseContent, type CollapseProps, CollapseTitle, Collapsible, CollapsiblePanel, type CollapsiblePanelProps, type CollapsibleProps, CollapsibleTrigger, type CollapsibleTriggerProps, ColorPicker, type ColorPickerFormat, type ColorPickerProps, Combobox, type ComboboxAlign, type ComboboxColor, ComboboxItem, type ComboboxItemProps, type ComboboxProps, type ComboboxSide, type ComboboxSize, type CommandItem, CommandPalette, type CommandPaletteProps, ContextMenu, ContextMenuContent, type ContextMenuContentProps, ContextMenuGroup, ContextMenuItem, ContextMenuLabel, type ContextMenuProps, ContextMenuSeparator, ContextMenuTrigger, type ContextMenuTriggerProps, Countdown, type CountdownProps, type CountdownUnit, DatePicker, type DatePickerAlign, type DatePickerColor, type DatePickerProps, type DatePickerSide, type DatePickerSize, type DateRange, DateRangePicker, type DateRangePickerProps, Dialog, DialogClose, DialogContent, type DialogContentProps, DialogDescription, type DialogProps, DialogTitle, DialogTrigger, Diff, type DiffProps, Display, type DisplayProps, Divider, type DividerOrientation, type DividerProps, Dock, type DockColor, DockItem, type DockItemProps, DockLabel, type DockLabelProps, type DockProps, Drawer, DrawerClose, DrawerContent, type DrawerContentProps, DrawerDescription, type DrawerProps, type DrawerSide, DrawerTitle, DrawerTrigger, DropdownMenu, type DropdownMenuAlign, DropdownMenuContent, type DropdownMenuContentProps, DropdownMenuGroup, DropdownMenuItem, DropdownMenuLabel, type DropdownMenuProps, DropdownMenuSeparator, type DropdownMenuSide, DropdownMenuTrigger, Dropzone, type DropzoneProps, type DropzoneRejection, EmptyState, type EmptyStateProps, type EmptyStateSize, Field, FieldControl, type FieldControlProps, FieldDescription, type FieldDescriptionProps, FieldError, type FieldErrorProps, FieldLabel, type FieldLabelProps, type FieldProps, Fieldset, FieldsetLabel, type FieldsetLabelProps, FieldsetLegend, type FieldsetLegendProps, type FieldsetProps, FileInput, type FileInputProps, type FileInputSize, Filter, FilterItem, type FilterItemProps, type FilterProps, FloatingLabel, type FloatingLabelProps, Footer, type FooterProps, FooterTitle, type FooterTitleProps, Form, type FormProps, Heading, type HeadingLevel, type HeadingProps, Hero, HeroContent, HeroOverlay, type HeroProps, Indicator, IndicatorItem, type IndicatorItemProps, type IndicatorPlacement, type IndicatorProps, Input, type InputColor, type InputProps, type InputSize, Join, type JoinOrientation, type JoinProps, Kbd, type KbdProps, type KbdSize, Label, type LabelProps, Link, type LinkColor, type LinkProps, List, ListColGrow, type ListColGrowProps, type ListProps, ListRow, type ListRowProps, ListTitle, type ListTitleProps, Loading, type LoadingProps, type LoadingSize, MAX_CHROMA, Mask, type MaskProps, type MaskVariant, Menu, MenuItem, type MenuProps, MenuTitle, Menubar, type MenubarAlign, MenubarContent, type MenubarContentProps, MenubarGroup, MenubarItem, MenubarLabel, MenubarMenu, type MenubarProps, MenubarSeparator, type MenubarSide, MenubarTrigger, type MenubarTriggerProps, Meter, type MeterColor, type MeterProps, type MeterSize, MockupBrowser, type MockupBrowserProps, MockupCode, MockupCodeLine, type MockupCodeLineProps, type MockupCodeProps, MockupPhone, type MockupPhoneProps, MockupWindow, type MockupWindowProps, NativeSelect, type NativeSelectColor, type NativeSelectProps, type NativeSelectSize, Navbar, NavbarCenter, NavbarEnd, type NavbarProps, NavbarStart, NavigationMenu, type NavigationMenuAlign, NavigationMenuContent, type NavigationMenuContentProps, NavigationMenuItem, type NavigationMenuItemProps, NavigationMenuLink, type NavigationMenuLinkProps, type NavigationMenuProps, type NavigationMenuSide, NavigationMenuTrigger, type NavigationMenuTriggerProps, NumberField, type NumberFieldProps, type Oklch, Pagination, type PaginationColor, type PaginationProps, type PaginationSize, Popover, type PopoverAlign, PopoverClose, PopoverContent, type PopoverContentProps, PopoverDescription, type PopoverProps, type PopoverSide, PopoverTitle, PopoverTrigger, PreviewCard, type PreviewCardAlign, type PreviewCardProps, type PreviewCardSide, Progress, type ProgressColor, type ProgressProps, type ProgressSize, Prose, type ProseProps, type ProseSize, RadialProgress, type RadialProgressColor, type RadialProgressProps, Radio, RadioGroup, type RadioGroupOrientation, type RadioGroupProps, RadioOption, type RadioOptionProps, type RadioProps, Range, type RangeColor, type RangeProps, Rating, type RatingColor, type RatingProps, type RatingSize, ScrollArea, type ScrollAreaOrientation, type ScrollAreaProps, Select, type SelectAlign, type SelectColor, SelectGroup, SelectGroupLabel, SelectItem, type SelectItemProps, type SelectItems, type SelectOptionData, type SelectProps, SelectSeparator, type SelectSide, type SelectSize, type SilicaColor, type SilicaConfig, SilicaProvider, type SilicaProviderProps, type SilicaSize, Skeleton, type SkeletonProps, type SkeletonShape, Slider, type SliderColor, type SliderProps, type SliderSize, Stack, type StackPeek, type StackProps, Stat, StatDesc, StatFigure, type StatProps, StatTitle, StatValue, Stats, type StatsProps, Status, type StatusColor, type StatusProps, type StatusSize, Step, type StepColor, type StepProps, Steps, type StepsProps, Swap, type SwapProps, type SwapVariant, Switch, type SwitchColor, type SwitchProps, type SwitchSize, type TabValue, Table, type TableProps, type TableSize, Tabs, type TabsColor, TabsList, type TabsListProps, TabsPanel, type TabsProps, TabsTab, type TabsVariant, TagInput, type TagInputProps, type TagInputSize, Text, type TextProps, type TextVariant, Textarea, type TextareaColor, type TextareaProps, type TextareaSize, ThemeController, type ThemeControllerProps, Timeline, TimelineEnd, type TimelineEndProps, TimelineItem, type TimelineItemProps, TimelineMiddle, type TimelineMiddleProps, type TimelineOrientation, type TimelineProps, TimelineStart, type TimelineStartProps, ToastProvider, type ToastProviderProps, Toggle, ToggleGroup, ToggleGroupItem, type ToggleGroupItemProps, type ToggleGroupProps, type ToggleProps, Toolbar, ToolbarButton, type ToolbarButtonProps, ToolbarGroup, type ToolbarGroupProps, ToolbarLink, type ToolbarLinkProps, type ToolbarProps, ToolbarSeparator, type ToolbarSeparatorProps, Tooltip, type TooltipAlign, type TooltipProps, TooltipProvider, type TooltipProviderProps, type TooltipSide, type TreeNode, TreeView, type TreeViewProps, Validator, ValidatorHint, type ValidatorHintProps, type ValidatorProps, type Weekday, Wizard, type WizardProps, type WizardStep, cx, formatOklch, hexToOklch, inGamut, oklchToHex, oklchToRgb, parseOklch, useSilicaClass, useSilicaConfig, useToast };