@vhyxui/react 0.3.0-alpha → 0.4.0-alpha

package/dist/index.d.ts

@@ -5,6 +5,50 @@ import { FormState } from 'react-hook-form';
 import { UseFormRegister } from 'react-hook-form';
 import { UseFormReturn } from 'react-hook-form';
 
+export declare const Accordion: AccordionComponent;
+
+declare type AccordionComponent = default_2.ForwardRefExoticComponent<AccordionProps & default_2.RefAttributes<HTMLDivElement>> & {
+    Item: typeof AccordionItem;
+};
+
+/** A single collapsible section. */
+declare const AccordionItem: default_2.ForwardRefExoticComponent<AccordionItemProps & default_2.RefAttributes<HTMLDetailsElement>>;
+
+/** One entry for the data-driven `items` shorthand. */
+export declare interface AccordionItemData {
+    value: string;
+    title: default_2.ReactNode;
+    content: default_2.ReactNode;
+    disabled?: boolean;
+}
+
+/** Props for Accordion.Item. */
+export declare interface AccordionItemProps extends Omit<default_2.DetailsHTMLAttributes<HTMLDetailsElement>, 'title' | 'open'> {
+    /** Unique value within the accordion. */
+    value: string;
+    /** Header content. */
+    title: default_2.ReactNode;
+    disabled?: boolean;
+}
+
+/** Props for Accordion. */
+export declare interface AccordionProps extends Omit<default_2.HTMLAttributes<HTMLDivElement>, 'defaultValue'> {
+    /** `single` keeps at most one section open. @default 'single' */
+    type?: 'single' | 'multiple';
+    /** Initially open section values (uncontrolled). */
+    defaultValue?: string[];
+    /** Open section values (controlled). */
+    value?: string[];
+    /** Called with the next list of open values. */
+    onValueChange?: (value: string[]) => void;
+    /** `ghost` removes the outer border. @default 'default' */
+    variant?: 'default' | 'ghost';
+    /** Shorthand: render items from data instead of children. */
+    items?: AccordionItemData[];
+    /** VhyxSeal contract override. */
+    contract?: Partial<ComponentContract>;
+}
+
 export declare const Alert: default_2.ForwardRefExoticComponent<default_2.PropsWithoutRef<AlertProps> & default_2.RefAttributes<HTMLDivElement>>;
 
 /** Props for the Alert component. */
@@ -26,6 +70,49 @@ export declare interface AlertProps extends default_2.HTMLAttributes<HTMLDivElem
 /** Visual variant of the Alert. */
 export declare type AlertVariant = 'default' | 'success' | 'warning' | 'danger' | 'info';
 
+/**
+ * Avatar — image with automatic initials fallback and optional presence dot.
+ * @example
+ * <Avatar name="Ada Lovelace" src="/ada.png" status="online" />
+ */
+export declare const Avatar: default_2.ForwardRefExoticComponent<AvatarProps & default_2.RefAttributes<HTMLSpanElement>>;
+
+/**
+ * AvatarGroup — overlapping stack of avatars with "+N" overflow.
+ * @example
+ * <AvatarGroup max={3}>{people.map(p => <Avatar key={p.id} name={p.name} />)}</AvatarGroup>
+ */
+export declare function AvatarGroup({ max, size, className, children, ...rest }: AvatarGroupProps): default_2.ReactElement;
+
+/** Props for AvatarGroup. */
+export declare interface AvatarGroupProps extends default_2.HTMLAttributes<HTMLDivElement> {
+    /** Show at most this many avatars, then a "+N" chip. */
+    max?: number;
+    /** Size applied to the overflow chip. @default 'md' */
+    size?: AvatarSize;
+    children: default_2.ReactNode;
+}
+
+/** Props for Avatar. */
+export declare interface AvatarProps extends default_2.HTMLAttributes<HTMLSpanElement> {
+    /** Image URL. Falls back to initials when missing or when it fails to load. */
+    src?: string;
+    /** Person or entity name — used for alt text and initials. */
+    name: string;
+    /** @default 'md' */
+    size?: AvatarSize;
+    /** @default 'circle' */
+    shape?: 'circle' | 'square';
+    /** Presence dot in the corner. */
+    status?: AvatarStatus;
+}
+
+/** Avatar sizes. */
+export declare type AvatarSize = 'xs' | 'sm' | 'md' | 'lg' | 'xl';
+
+/** Presence indicator. */
+export declare type AvatarStatus = 'online' | 'busy' | 'away' | 'offline';
+
 export declare const Badge: default_2.ForwardRefExoticComponent<default_2.PropsWithoutRef<BadgeProps> & default_2.RefAttributes<HTMLSpanElement>>;
 
 /** Props for the Badge component. */
@@ -131,6 +218,9 @@ export declare interface BreadcrumbProps extends default_2.HTMLAttributes<HTMLEl
     children?: default_2.ReactNode;
 }
 
+/** Viewport breakpoints shared by responsive layout props. sm 640px · md 768px · lg 1024px. */
+export declare type Breakpoint = 'sm' | 'md' | 'lg';
+
 export declare const Button: default_2.ForwardRefExoticComponent<default_2.PropsWithoutRef<ButtonProps> & default_2.RefAttributes<HTMLButtonElement>>;
 
 /** Props for the Button component. */
@@ -231,6 +321,23 @@ export declare interface CardProps extends default_2.HTMLAttributes<HTMLDivEleme
 /** Visual variant of the Card. */
 export declare type CardVariant = 'default' | 'outline' | 'ghost' | 'elevated';
 
+/**
+ * Center — centers its children on both axes.
+ * @example
+ * <Center fullHeight><Spinner /></Center>
+ */
+export declare const Center: default_2.ForwardRefExoticComponent<CenterProps & default_2.RefAttributes<HTMLElement>>;
+
+/** Props for Center. */
+export declare interface CenterProps extends default_2.HTMLAttributes<HTMLElement> {
+    /** Element to render. @default 'div' */
+    as?: default_2.ElementType;
+    /** Use `inline-flex` instead of `flex`. */
+    inline?: boolean;
+    /** Fill the viewport height — handy for auth and empty screens. */
+    fullHeight?: boolean;
+}
+
 export declare const Checkbox: default_2.ForwardRefExoticComponent<default_2.PropsWithoutRef<CheckboxProps> & default_2.RefAttributes<HTMLButtonElement>>;
 
 /** Props for the Checkbox component. */
@@ -260,6 +367,40 @@ export declare type CheckboxSize = 'sm' | 'md' | 'lg';
 /** Checkbox checked value — boolean or 'indeterminate'. */
 declare type CheckedState = boolean | 'indeterminate';
 
+/** A value accepted by {@link cx}: strings are kept, falsy values dropped, objects keep truthy keys. */
+export declare type ClassValue = string | number | false | null | undefined | Record<string, boolean | null | undefined> | ClassValue[];
+
+/**
+ * Container — centers content with a readable max width and responsive gutters.
+ * @example
+ * <Container size="md"><Prose /></Container>
+ */
+export declare const Container: default_2.ForwardRefExoticComponent<ContainerProps & default_2.RefAttributes<HTMLElement>>;
+
+/** Props for Container. */
+export declare interface ContainerProps extends default_2.HTMLAttributes<HTMLElement> {
+    /** Element to render. @default 'div' */
+    as?: default_2.ElementType;
+    /** Maximum width. @default 'lg' */
+    size?: ContainerSize;
+    /** Remove horizontal padding. */
+    flush?: boolean;
+}
+
+/** Max-width presets: sm 640 · md 768 · lg 1024 · xl 1280 · full. */
+export declare type ContainerSize = 'sm' | 'md' | 'lg' | 'xl' | 'full';
+
+/**
+ * Joins class names, skipping falsy values. Tiny `clsx` equivalent with zero dependencies.
+ *
+ * Works with Tailwind: component styles live in `@layer components`, so any
+ * utility you pass through `className` wins without `!important`.
+ *
+ * @example
+ * cx('p-4', isActive && 'bg-accent', { 'opacity-50': disabled })
+ */
+export declare function cx(...values: ClassValue[]): string;
+
 export declare const Dialog: default_2.ComponentType<DialogProps & default_2.RefAttributes<HTMLDivElement>> & {
     Trigger: default_2.ForwardRefExoticComponent<DialogTriggerProps & default_2.RefAttributes<HTMLButtonElement>>;
     Portal: typeof DialogPortal;
@@ -322,7 +463,6 @@ export declare interface DialogHeaderProps extends default_2.HTMLAttributes<HTML
 export declare interface DialogOverlayProps extends default_2.HTMLAttributes<HTMLDivElement> {
 }
 
-/** Renders its children in document.body. */
 declare function DialogPortal({ children }: DialogPortalProps): default_2.ReactPortal | null;
 
 declare namespace DialogPortal {
@@ -368,6 +508,9 @@ export declare interface DialogTriggerProps extends default_2.ButtonHTMLAttribut
     children?: default_2.ReactNode;
 }
 
+/** Props for HStack/VStack — Stack without `direction`. */
+export declare type DirectionalStackProps = Omit<StackProps, 'direction'>;
+
 export declare const Drawer: default_2.ComponentType<DrawerProps & default_2.RefAttributes<HTMLDivElement>> & {
     Trigger: default_2.ForwardRefExoticComponent<DrawerTriggerProps & default_2.RefAttributes<HTMLButtonElement>>;
     Portal: typeof DrawerPortal;
@@ -425,7 +568,6 @@ export declare interface DrawerHeaderProps extends default_2.HTMLAttributes<HTML
 export declare interface DrawerOverlayProps extends default_2.HTMLAttributes<HTMLDivElement> {
 }
 
-/** Renders its children in document.body when the drawer is open. */
 declare function DrawerPortal({ children }: DrawerPortalProps): default_2.ReactPortal | null;
 
 declare namespace DrawerPortal {
@@ -513,21 +655,21 @@ export declare interface FieldProps extends Omit<default_2.HTMLAttributes<HTMLDi
      */
     name: string;
     /** Label rendered above (or beside) the input. */
-    label?: default_2.ReactNode;
+    label?: default_2.ReactNode | undefined;
     /** Helper text rendered below the input. Connected via aria-describedby. */
-    hint?: default_2.ReactNode;
+    hint?: default_2.ReactNode | undefined;
     /**
      * Error message. When set, the child input receives aria-invalid and
      * data-error attributes and the error text is announced as a live region.
      * If absent, Field reads the error from the parent Form context automatically.
      */
-    error?: string;
+    error?: string | undefined;
     /** When true, renders a required indicator (*) next to the label. */
-    required?: boolean;
+    required?: boolean | undefined;
     /** When true, renders an optional indicator next to the label. */
-    optional?: boolean;
+    optional?: boolean | undefined;
     /** Field layout. Overrides the parent Form layout when set. @default 'vertical' */
-    layout?: 'vertical' | 'horizontal';
+    layout?: 'vertical' | 'horizontal' | undefined;
     /** The single interactive child element (Input, Textarea, Select, etc.). */
     children: default_2.ReactNode;
 }
@@ -586,6 +728,64 @@ export declare interface FormProps extends default_2.FormHTMLAttributes<HTMLForm
     onSubmit?: (data: FieldValues) => void | Promise<void>;
 }
 
+/**
+ * Derives up to two initials from a name.
+ * @example
+ * getInitials('Ada Lovelace') // 'AL'
+ */
+export declare function getInitials(name: string): string;
+
+/**
+ * Grid — equal columns or responsive auto-fit cards in one prop.
+ *
+ * @example
+ * <Grid minChildWidth="16rem" gap={6}>{cards}</Grid>
+ * <Grid columns={3} collapseBelow="md">…</Grid>
+ */
+export declare const Grid: default_2.ForwardRefExoticComponent<GridProps & default_2.RefAttributes<HTMLElement>>;
+
+/** Props for Grid. */
+export declare interface GridProps extends default_2.HTMLAttributes<HTMLElement> {
+    /** Element to render. @default 'div' */
+    as?: default_2.ElementType;
+    /** Fixed number of equal columns. Ignored when `minChildWidth` is set. @default 1 */
+    columns?: number;
+    /**
+     * Responsive auto-fit: as many columns as fit, each at least this wide
+     * (e.g. `"16rem"` or `240`). The easiest way to build card grids.
+     */
+    minChildWidth?: string | number;
+    /** Gap between cells, in token steps. @default 4 */
+    gap?: Space;
+    /** Collapse to a single column below this breakpoint (fixed `columns` only). */
+    collapseBelow?: Breakpoint;
+}
+
+/**
+ * Heading — semantic level and visual size are separate, so outlines stay correct.
+ * @example
+ * <Heading level={1}>Dashboard</Heading>
+ * <Heading level={2} size="sm">Recent activity</Heading>
+ */
+export declare const Heading: default_2.ForwardRefExoticComponent<HeadingProps & default_2.RefAttributes<HTMLHeadingElement>>;
+
+/** Heading level 1–6. */
+export declare type HeadingLevel = 1 | 2 | 3 | 4 | 5 | 6;
+
+/** Props for Heading. */
+export declare interface HeadingProps extends default_2.HTMLAttributes<HTMLHeadingElement> {
+    /** Semantic level → renders `<h1>`…`<h6>`. @default 2 */
+    level?: HeadingLevel;
+    /** Visual size. Defaults from level so semantics and looks stay independent. */
+    size?: HeadingSize;
+}
+
+/** Visual heading size, independent of level. */
+export declare type HeadingSize = 'xs' | 'sm' | 'md' | 'lg' | 'xl' | '2xl';
+
+/** Horizontal Stack. Defaults `align="center"`. @example <HStack gap={2}><Button/><Button/></HStack> */
+export declare const HStack: default_2.ForwardRefExoticComponent<DirectionalStackProps & default_2.RefAttributes<HTMLElement>>;
+
 export declare const Input: default_2.ForwardRefExoticComponent<default_2.PropsWithoutRef<InputProps> & default_2.RefAttributes<HTMLInputElement>>;
 
 /** Props for the Input component. */
@@ -613,6 +813,19 @@ export declare interface InputProps extends Omit<default_2.InputHTMLAttributes<H
 /** Size tokens available on the Input component. */
 export declare type InputSize = 'sm' | 'md' | 'lg';
 
+/**
+ * Kbd — keyboard shortcut hint.
+ * @example
+ * <Kbd keys={['⌘', 'K']} />
+ */
+export declare function Kbd({ keys, children, style, ...rest }: KbdProps): default_2.ReactElement;
+
+/** Props for Kbd. */
+export declare interface KbdProps extends default_2.HTMLAttributes<HTMLElement> {
+    /** Keys to render joined with "+", e.g. `['⌘', 'K']`. Alternative to children. */
+    keys?: string[];
+}
+
 export declare const Pagination: default_2.ForwardRefExoticComponent<default_2.PropsWithoutRef<PaginationProps> & default_2.RefAttributes<HTMLElement>>;
 
 /** Props for the Pagination component. */
@@ -797,6 +1010,12 @@ export declare interface RadioItemProps extends Omit<default_2.ButtonHTMLAttribu
     children?: default_2.ReactNode;
 }
 
+/**
+ * Resolves the VhyxSeal manifest domain without ever returning an empty string.
+ * An empty domain makes `generateManifest()` throw a fatal error on every render.
+ */
+export declare function resolveSealDomain(domain?: string): string;
+
 export declare const Select: default_2.ComponentType<SelectProps & default_2.RefAttributes<HTMLDivElement>> & {
     Trigger: default_2.ForwardRefExoticComponent<SelectTriggerProps & default_2.RefAttributes<HTMLButtonElement>>;
     Content: typeof SelectContent;
@@ -911,11 +1130,11 @@ export declare interface SelectProps extends default_2.HTMLAttributes<HTMLDivEle
     /** Called when a new value is selected. */
     onValueChange?: (value: string) => void;
     /** When true, the trigger is disabled. */
-    disabled?: boolean;
+    disabled?: boolean | undefined;
     /** Size applied to all Select sub-components. @default 'md' */
-    size?: SelectSize;
+    size?: SelectSize | undefined;
     /** Placeholder text shown when no value is selected. */
-    placeholder?: string;
+    placeholder?: string | undefined;
     /** VhyxSeal contract override. */
     contract?: Partial<ComponentContract>;
 }
@@ -971,6 +1190,35 @@ export declare interface SeparatorProps extends default_2.HTMLAttributes<HTMLEle
     label?: string;
 }
 
+/**
+ * Skeleton — loading placeholder. Hidden from assistive tech; pair it with an
+ * `aria-busy` container. Respects `prefers-reduced-motion`.
+ * @example
+ * <Skeleton variant="circle" width={40} height={40} />
+ * <Skeleton variant="text" lines={3} />
+ */
+export declare function Skeleton({ variant, width, height, lines, className, style, ...rest }: SkeletonProps): default_2.ReactElement;
+
+/** Props for Skeleton. */
+export declare interface SkeletonProps extends default_2.HTMLAttributes<HTMLSpanElement> {
+    /** @default 'rect' */
+    variant?: 'rect' | 'circle' | 'text';
+    width?: string | number;
+    height?: string | number;
+    /** Repeat as N stacked text lines (last one shorter). */
+    lines?: number;
+}
+
+/** Spacing steps available in @vhyxui/tokens (`--vhyx-space-*`). */
+export declare type Space = 0 | 0.5 | 1 | 1.5 | 2 | 2.5 | 3 | 3.5 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 12 | 14 | 16 | 20 | 24 | 32;
+
+/**
+ * Converts a spacing step to its CSS variable, e.g. `2.5` → `var(--vhyx-space-2-5)`.
+ * @example
+ * spaceVar(4) // 'var(--vhyx-space-4)'
+ */
+export declare function spaceVar(step: Space): string;
+
 export declare const Spinner: default_2.ForwardRefExoticComponent<default_2.PropsWithoutRef<SpinnerProps> & default_2.RefAttributes<SVGSVGElement>>;
 
 /** Props for the Spinner component. */
@@ -992,6 +1240,46 @@ export declare type SpinnerSize = 'xs' | 'sm' | 'md' | 'lg' | 'xl';
 /** Color variant of the spinner stroke. */
 export declare type SpinnerVariant = 'default' | 'accent' | 'white';
 
+/**
+ * Stack — the one layout primitive you need most: children in a row or column with consistent gaps.
+ *
+ * @example
+ * <Stack gap={4}>
+ *   <Heading>Title</Heading>
+ *   <Text tone="subtle">Body</Text>
+ * </Stack>
+ *
+ * @example
+ * <Stack direction="row" justify="between" align="center" collapseBelow="md">…</Stack>
+ */
+export declare const Stack: default_2.ForwardRefExoticComponent<StackProps & default_2.RefAttributes<HTMLElement>>;
+
+/** Flex alignment keywords. */
+export declare type StackAlign = 'start' | 'center' | 'end' | 'stretch' | 'baseline';
+
+/** Flex justification keywords. */
+export declare type StackJustify = 'start' | 'center' | 'end' | 'between' | 'around' | 'evenly';
+
+/** Props for Stack. */
+export declare interface StackProps extends default_2.HTMLAttributes<HTMLElement> {
+    /** Element to render. @default 'div' */
+    as?: default_2.ElementType;
+    /** Main axis. @default 'column' */
+    direction?: 'row' | 'column';
+    /** Gap between children, in token steps. @default 3 */
+    gap?: Space;
+    /** Cross-axis alignment. */
+    align?: StackAlign;
+    /** Main-axis distribution. */
+    justify?: StackJustify;
+    /** Allow children to wrap onto multiple lines. */
+    wrap?: boolean;
+    /** Switch a row to a column below this breakpoint (responsive without media queries in your code). */
+    collapseBelow?: Breakpoint;
+    /** Padding on all sides, in token steps. */
+    padding?: Space;
+}
+
 export declare const Switch: default_2.ForwardRefExoticComponent<default_2.PropsWithoutRef<SwitchProps> & default_2.RefAttributes<HTMLButtonElement>>;
 
 /** Props for the Switch component. */
@@ -1016,6 +1304,67 @@ export declare interface SwitchProps extends Omit<default_2.ButtonHTMLAttributes
 /** Size tokens available on the Switch component. */
 export declare type SwitchSize = 'sm' | 'md' | 'lg';
 
+export declare const Table: TableComponent;
+
+declare const TableBody: default_2.ForwardRefExoticComponent<default_2.HTMLAttributes<HTMLTableSectionElement> & default_2.RefAttributes<HTMLTableSectionElement>>;
+
+declare const TableCell: default_2.ForwardRefExoticComponent<TableCellProps & default_2.RefAttributes<HTMLTableCellElement>>;
+
+/** Props for header/data cells. */
+export declare interface TableCellProps extends Omit<default_2.TdHTMLAttributes<HTMLTableCellElement>, 'align'> {
+    align?: 'start' | 'center' | 'end';
+}
+
+/** Column definition for the data-driven shorthand. */
+export declare interface TableColumn<Row> {
+    /** Unique key; also the default accessor into the row. */
+    key: string;
+    /** Header content. */
+    header: default_2.ReactNode;
+    /** Custom cell renderer. Defaults to `String(row[key])`. */
+    cell?: (row: Row, index: number) => default_2.ReactNode;
+    /** Text alignment — use `end` for numbers. */
+    align?: 'start' | 'center' | 'end';
+    /** CSS width, e.g. `'8rem'`. */
+    width?: string;
+}
+
+declare type TableComponent = default_2.ForwardRefExoticComponent<TableProps & default_2.RefAttributes<HTMLTableElement>> & {
+    Head: typeof TableHead;
+    Body: typeof TableBody;
+    Row: typeof TableRow;
+    Header: typeof TableHeader;
+    Cell: typeof TableCell;
+};
+
+declare const TableHead: default_2.ForwardRefExoticComponent<default_2.HTMLAttributes<HTMLTableSectionElement> & default_2.RefAttributes<HTMLTableSectionElement>>;
+
+declare const TableHeader: default_2.ForwardRefExoticComponent<TableCellProps & default_2.RefAttributes<HTMLTableCellElement>>;
+
+/** Props for Table. */
+export declare interface TableProps extends default_2.TableHTMLAttributes<HTMLTableElement> {
+    /** Zebra rows. */
+    striped?: boolean;
+    /** Highlight row under the pointer. @default true */
+    hoverable?: boolean;
+    /** @default 'comfortable' */
+    density?: 'comfortable' | 'compact';
+    /** Accessible caption (rendered below the table). */
+    caption?: default_2.ReactNode;
+    /** Shorthand: column definitions. Use with `data`. */
+    columns?: TableColumn<Record<string, unknown>>[];
+    /** Shorthand: rows. Use with `columns`. */
+    data?: Record<string, unknown>[];
+    /** Row key accessor for the shorthand. Defaults to `row.id` or the index. */
+    rowKey?: (row: Record<string, unknown>, index: number) => string;
+    /** Shown when `data` is empty. */
+    emptyState?: default_2.ReactNode;
+    /** VhyxSeal contract override. */
+    contract?: Partial<ComponentContract>;
+}
+
+declare const TableRow: default_2.ForwardRefExoticComponent<default_2.HTMLAttributes<HTMLTableRowElement> & default_2.RefAttributes<HTMLTableRowElement>>;
+
 export declare const Tabs: default_2.ComponentType<TabsProps & default_2.RefAttributes<HTMLDivElement>> & {
     List: default_2.ForwardRefExoticComponent<TabsListProps & default_2.RefAttributes<HTMLDivElement>>;
     Trigger: default_2.ForwardRefExoticComponent<TabsTriggerProps & default_2.RefAttributes<HTMLButtonElement>>;
@@ -1071,6 +1420,14 @@ export declare interface TabsTriggerProps extends Omit<default_2.ButtonHTMLAttri
 /** Variant visual styles for Tabs. */
 export declare type TabsVariant = 'default' | 'pills' | 'underline' | 'enclosed';
 
+/**
+ * Text — body copy with token-based size, tone and weight.
+ * @example
+ * <Text tone="subtle" size="sm">Last updated 2 minutes ago</Text>
+ */
+declare const Text_2: default_2.ForwardRefExoticComponent<TextProps & default_2.RefAttributes<HTMLElement>>;
+export { Text_2 as Text }
+
 export declare const Textarea: default_2.ForwardRefExoticComponent<default_2.PropsWithoutRef<TextareaProps> & default_2.RefAttributes<HTMLTextAreaElement>>;
 
 /**
@@ -1146,6 +1503,33 @@ export declare namespace TextField {
  */
 export declare type TextFieldProps = FieldOwnProps & Omit<InputProps, 'id' | 'error'>;
 
+/** Props for Text. */
+export declare interface TextProps extends default_2.HTMLAttributes<HTMLElement> {
+    /** Element to render. @default 'p' */
+    as?: default_2.ElementType;
+    /** @default 'md' */
+    size?: TextSize;
+    /** @default 'default' */
+    tone?: TextTone;
+    weight?: TextWeight;
+    align?: 'start' | 'center' | 'end';
+    /** Monospace font. */
+    mono?: boolean;
+    /** Single line with ellipsis. */
+    truncate?: boolean;
+    /** Clamp to N lines with ellipsis. */
+    lines?: number;
+}
+
+/** Text size scale. */
+export declare type TextSize = 'xs' | 'sm' | 'md' | 'lg' | 'xl';
+
+/** Semantic colour of text. */
+export declare type TextTone = 'default' | 'subtle' | 'muted' | 'accent' | 'success' | 'warning' | 'danger' | 'inherit';
+
+/** Font weight. */
+export declare type TextWeight = 'normal' | 'medium' | 'semibold' | 'bold';
+
 export declare const Toast: default_2.ComponentType<ToastProviderProps> & {
     displayName: string;
 };
@@ -1268,24 +1652,26 @@ export declare interface TooltipProps {
  */
 export declare function useFormContext(): FormContextValue | null;
 
-/** Default SealProvider config — domain and verification set by the consuming application. */
+/** Colour scheme applied to `<html data-theme>`. `system` follows the OS. */
+export declare type VhyxTheme = 'light' | 'dark' | 'system';
+
 /**
  * VhyxUIProvider — root provider for VhyxUI.
  *
  * Place once at the top of your application tree. Provides:
- * - SealProvider (VhyxSeal contract registry for agent API access)
- * - A visually hidden skip link as the first focusable element on every page.
- *   Becomes visible on keyboard focus, linking to `#vhyx-main`.
- * - The Toast notification region (imperative API via `toast()`).
+ * - SealProvider (VhyxSeal contract registry for agent API access), opt-out via `agentContracts={false}`
+ * - A visually hidden skip link as the first focusable element, linking to `#vhyx-main`
+ * - The Toast notification region (imperative API via `toast()`)
+ * - Optional theme management via `theme="light" | "dark" | "system"`
  *
  * @example
- * <VhyxUIProvider>
+ * <VhyxUIProvider theme="system">
  *   <main id="vhyx-main">
  *     <App />
  *   </main>
  * </VhyxUIProvider>
  */
-export declare function VhyxUIProvider({ children, toastPosition, maxToasts, defaultDuration, domain, }: VhyxUIProviderProps): default_2.ReactElement;
+export declare function VhyxUIProvider({ children, toastPosition, maxToasts, defaultDuration, domain, theme, agentContracts, skipLink, }: VhyxUIProviderProps): default_2.ReactElement;
 
 export declare namespace VhyxUIProvider {
     var displayName: string;
@@ -1297,7 +1683,6 @@ export declare interface VhyxUIProviderProps {
     children: default_2.ReactNode;
     /**
      * Position of the toast notification region.
-     * Passed through to ToastProvider.
      * @default 'bottom-right'
      */
     toastPosition?: ToastPosition;
@@ -1313,10 +1698,45 @@ export declare interface VhyxUIProviderProps {
     defaultDuration?: number;
     /**
      * Domain for VhyxSeal manifest generation.
-     * Falls back to NEXT_PUBLIC_VHYX_DOMAIN env var, then empty string.
+     * Resolution order: this prop → NEXT_PUBLIC_VHYX_DOMAIN → VITE_VHYX_DOMAIN →
+     * `window.location.hostname` → `"localhost"`. Never empty, so the manifest
+     * generator never fails on a missing domain.
      * @example "myshop.platform.com"
      */
     domain?: string;
+    /**
+     * Optional colour scheme. When set, the provider writes `data-theme` on
+     * `<html>` (and follows the OS for `system`). Leave undefined when another
+     * library (next-themes, your own toggle) already owns `data-theme`.
+     */
+    theme?: VhyxTheme;
+    /**
+     * Register components with VhyxSeal so AI agents can read their contracts.
+     * Set to false to opt out entirely (no SealProvider in the tree).
+     * @default true
+     */
+    agentContracts?: boolean;
+    /**
+     * Render the "Skip to main content" link targeting `#vhyx-main`.
+     * @default true
+     */
+    skipLink?: boolean;
 }
 
+/**
+ * VisuallyHidden — content for screen readers only.
+ * @example
+ * <button><Icon /><VisuallyHidden>Close</VisuallyHidden></button>
+ */
+export declare function VisuallyHidden({ as: Tag, style, ...rest }: VisuallyHiddenProps): default_2.ReactElement;
+
+/** Props for VisuallyHidden. */
+export declare interface VisuallyHiddenProps extends default_2.HTMLAttributes<HTMLElement> {
+    /** Element to render. @default 'span' */
+    as?: default_2.ElementType;
+}
+
+/** Vertical Stack. @example <VStack gap={4}>…</VStack> */
+export declare const VStack: default_2.ForwardRefExoticComponent<DirectionalStackProps & default_2.RefAttributes<HTMLElement>>;
+
 export { }