@officina/ui 0.1.0

package/dist/index.d.ts

@@ -0,0 +1,3773 @@
+import * as react from 'react';
+import { ComponentPropsWithoutRef, ReactNode, HTMLAttributes, ButtonHTMLAttributes, ElementType, Ref, InputHTMLAttributes, ReactElement, ComponentProps } from 'react';
+import * as class_variance_authority_types from 'class-variance-authority/types';
+import * as class_variance_authority from 'class-variance-authority';
+import { VariantProps } from 'class-variance-authority';
+import { FieldValues, UseFormReturn, SubmitHandler } from 'react-hook-form';
+import { DateRange } from 'react-day-picker';
+export { DateRange } from 'react-day-picker';
+import { PhoneInputProps as PhoneInputProps$1 } from 'react-international-phone';
+import * as sonner from 'sonner';
+import { ExternalToast } from 'sonner';
+import * as zustand from 'zustand';
+import { CalendarProps as CalendarProps$1, Event, View } from 'react-big-calendar';
+import { Panel as Panel$1, Separator as Separator$1 } from 'react-resizable-panels';
+import { ColumnDef, Table as Table$1 } from '@tanstack/react-table';
+export { createColumnHelper } from '@tanstack/react-table';
+import { Locale } from 'date-fns';
+import { OverlayScrollbarsComponentProps } from 'overlayscrollbars-react';
+import { DropzoneOptions } from 'react-dropzone';
+import useEmblaCarousel from 'embla-carousel-react';
+import { SlideImage } from 'yet-another-react-lightbox';
+import { HTMLMotionProps } from 'framer-motion';
+import { DriveStep, Config } from 'driver.js';
+import * as AspectRatioPrimitive from '@radix-ui/react-aspect-ratio';
+import { Placement } from '@floating-ui/react';
+
+declare const buttonVariants: (props?: ({
+    variant?: "primary" | "secondary" | "outline" | "ghost" | "soft" | "danger" | "success" | null | undefined;
+    size?: "xs" | "sm" | "md" | "lg" | "icon" | "icon-sm" | null | undefined;
+} & class_variance_authority_types.ClassProp) | undefined) => string;
+type ButtonProps = ComponentPropsWithoutRef<'button'> & VariantProps<typeof buttonVariants> & {
+    /** Show a loading spinner and disable the button while an action is in flight. */
+    isLoading?: boolean;
+};
+declare const Button: react.ForwardRefExoticComponent<Omit<react.DetailedHTMLProps<react.ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "ref"> & VariantProps<(props?: ({
+    variant?: "primary" | "secondary" | "outline" | "ghost" | "soft" | "danger" | "success" | null | undefined;
+    size?: "xs" | "sm" | "md" | "lg" | "icon" | "icon-sm" | null | undefined;
+} & class_variance_authority_types.ClassProp) | undefined) => string> & {
+    /** Show a loading spinner and disable the button while an action is in flight. */
+    isLoading?: boolean;
+} & react.RefAttributes<HTMLButtonElement>>;
+
+type IconButtonProps = Omit<ButtonProps, 'children' | 'size'> & {
+    icon: ReactNode;
+    /** Visual + control size. Maps to the Button `icon` / `icon-sm` sizes. */
+    size?: 'sm' | 'md';
+    /** Optional tooltip; falls back to `aria-label` when omitted. */
+    tooltip?: ReactNode;
+    tooltipSide?: 'top' | 'right' | 'bottom' | 'left';
+    /** Accessible label is mandatory for icon-only buttons. */
+    'aria-label': string;
+};
+/**
+ * Icon-only button with an enforced accessible label. Optionally wraps itself
+ * in a {@link Tooltip} so hover/focus surfaces the same intent visually.
+ */
+declare const IconButton: react.ForwardRefExoticComponent<Omit<ButtonProps, "size" | "children"> & {
+    icon: ReactNode;
+    /** Visual + control size. Maps to the Button `icon` / `icon-sm` sizes. */
+    size?: "sm" | "md";
+    /** Optional tooltip; falls back to `aria-label` when omitted. */
+    tooltip?: ReactNode;
+    tooltipSide?: "top" | "right" | "bottom" | "left";
+    /** Accessible label is mandatory for icon-only buttons. */
+    'aria-label': string;
+} & react.RefAttributes<HTMLButtonElement>>;
+
+type ButtonGroupProps = {
+    children: ReactNode;
+    orientation?: 'horizontal' | 'vertical';
+    attached?: boolean;
+    size?: 'sm' | 'md' | 'lg';
+    className?: string;
+};
+declare function ButtonGroup({ children, orientation, attached, className, }: ButtonGroupProps): react.JSX.Element;
+
+declare const badgeVariants: (props?: ({
+    variant?: "danger" | "success" | "neutral" | "warning" | "info" | "accent" | null | undefined;
+    size?: "sm" | "md" | null | undefined;
+} & class_variance_authority_types.ClassProp) | undefined) => string;
+type BadgeProps = ComponentPropsWithoutRef<'span'> & Omit<VariantProps<typeof badgeVariants>, 'variant'> & {
+    /** Semantic colour. `error` is accepted as an alias of `danger`. */
+    variant?: VariantProps<typeof badgeVariants>['variant'] | 'error';
+    /** Render a leading status dot in the current colour. */
+    dot?: boolean;
+    /** Alias of `variant`, kept for ergonomic status labelling. */
+    tone?: VariantProps<typeof badgeVariants>['variant'] | 'error';
+};
+declare function Badge({ className, variant, tone, size, dot, children, ...props }: BadgeProps): react.JSX.Element;
+
+declare const avatarVariants: (props?: ({
+    size?: "xs" | "sm" | "md" | "lg" | "xl" | null | undefined;
+    shape?: "circle" | "square" | null | undefined;
+} & class_variance_authority_types.ClassProp) | undefined) => string;
+type AvatarProps = ComponentPropsWithoutRef<'span'> & VariantProps<typeof avatarVariants> & {
+    /** Image URL. Falls back to initials when absent or it fails to load. */
+    src?: string | undefined;
+    /** Full name used to derive initials and the alt text. */
+    name?: string | undefined;
+    /** Explicit initials override (otherwise derived from `name`). */
+    initials?: string | undefined;
+    /** Image alt text (defaults to `name`). */
+    alt?: string | undefined;
+};
+declare function Avatar({ className, size, shape, src, name, initials, alt, ...props }: AvatarProps): react.JSX.Element;
+type AvatarStackItem = {
+    src?: string | undefined;
+    name?: string | undefined;
+    alt?: string | undefined;
+};
+type AvatarStackProps = ComponentPropsWithoutRef<'div'> & {
+    /** Avatar data to render in the stack. */
+    avatars: AvatarStackItem[];
+    /** Max avatars shown before collapsing the rest into a `+N` chip. Defaults to `4`. */
+    max?: number;
+    /** Size applied to every avatar in the stack. Defaults to `'md'`. */
+    size?: AvatarProps['size'];
+    /** Shape applied to every avatar in the stack. Defaults to `'circle'`. */
+    shape?: AvatarProps['shape'];
+};
+/**
+ * Overflow-aware grouped avatars driven by data instead of children.
+ * Renders a `+N` chip once the count exceeds `max`.
+ */
+declare function AvatarStack({ avatars, max, size, shape, className, ...props }: AvatarStackProps): react.JSX.Element;
+type AvatarGroupProps = ComponentPropsWithoutRef<'div'> & {
+    max?: number;
+    size?: AvatarProps['size'];
+};
+declare function AvatarGroup({ children, max, size, className, ...props }: AvatarGroupProps): react.JSX.Element;
+
+type CardProps = ComponentPropsWithoutRef<'div'> & {
+    /** Inner padding scale. */
+    padding?: 'none' | 'sm' | 'md' | 'lg';
+};
+declare function Card({ className, padding, ...props }: CardProps): react.JSX.Element;
+declare function CardHeader({ className, ...props }: ComponentPropsWithoutRef<'div'>): react.JSX.Element;
+declare function CardTitle({ children, className, ...props }: ComponentPropsWithoutRef<'h3'>): react.JSX.Element;
+declare function CardDescription({ className, ...props }: ComponentPropsWithoutRef<'p'>): react.JSX.Element;
+declare function CardContent({ className, ...props }: ComponentPropsWithoutRef<'div'>): react.JSX.Element;
+declare function CardFooter({ className, ...props }: ComponentPropsWithoutRef<'div'>): react.JSX.Element;
+
+type SeparatorProps = ComponentPropsWithoutRef<'div'> & {
+    /** Divider axis. Defaults to horizontal. */
+    orientation?: 'horizontal' | 'vertical';
+    /** Optional centered label rendered within the divider. */
+    label?: string;
+};
+declare function Separator({ className, orientation, label, ...props }: SeparatorProps): react.JSX.Element;
+
+declare const spinnerVariants: (props?: ({
+    size?: "xs" | "sm" | "md" | "lg" | "xl" | null | undefined;
+} & class_variance_authority_types.ClassProp) | undefined) => string;
+type SpinnerProps = ComponentPropsWithoutRef<'span'> & VariantProps<typeof spinnerVariants> & {
+    /** Accessible status label announced to screen readers. Defaults to "Loading…". */
+    label?: string;
+};
+declare function Spinner({ className, size, label, ...props }: SpinnerProps): react.JSX.Element;
+
+type KbdProps = ComponentPropsWithoutRef<'kbd'>;
+declare function Kbd({ className, ...props }: KbdProps): react.JSX.Element;
+
+type ShortcutProps = {
+    /** Combo like `"mod+k"`, `"shift+enter"`, or an array of keys. */
+    keys: string | string[];
+    /** Render `+` separators between keys. */
+    withPlus?: boolean;
+    className?: string;
+};
+/**
+ * Platform-aware keyboard shortcut display built on {@link Kbd}. Renders
+ * `"mod+k"` as ⌘K on Apple platforms and Ctrl+K elsewhere.
+ */
+declare function Shortcut({ keys, withPlus, className }: ShortcutProps): react.JSX.Element;
+
+type ChipTone = 'neutral' | 'info' | 'success' | 'warning' | 'danger';
+type ChipVariant = 'solid' | 'soft' | 'outline';
+type ChipProps = {
+    /** Chip label content. */
+    children: ReactNode;
+    /** Optional leading icon. */
+    icon?: ReactNode;
+    /** When provided, renders a remove (×) button that calls this handler. */
+    onRemove?: () => void;
+    /** Semantic colour. */
+    tone?: ChipTone;
+    /** Chip size. */
+    size?: 'sm' | 'md';
+    /** Fill style: solid, soft, or outline. */
+    variant?: ChipVariant;
+    /** Render as a button (clickable/selectable) rather than a static span. */
+    interactive?: boolean;
+    /** Accessible label for the remove button. */
+    removeLabel?: string;
+} & (HTMLAttributes<HTMLSpanElement> | ButtonHTMLAttributes<HTMLButtonElement>);
+declare const Chip: react.ForwardRefExoticComponent<ChipProps & react.RefAttributes<HTMLButtonElement | HTMLSpanElement>>;
+
+declare const tagVariants: (props?: ({
+    tone?: "danger" | "success" | "warning" | "default" | null | undefined;
+} & class_variance_authority_types.ClassProp) | undefined) => string;
+type TagProps = VariantProps<typeof tagVariants> & {
+    /** Tag contents (label text or nodes). */
+    children: ReactNode;
+    className?: string;
+};
+declare function Tag({ children, tone, className }: TagProps): react.JSX.Element;
+
+type SkeletonProps = HTMLAttributes<HTMLDivElement> & {
+    /** Shape of the placeholder. */
+    variant?: 'rect' | 'circle' | 'text';
+    /** Explicit width (px number or CSS length). */
+    width?: number | string;
+    /** Explicit height (px number or CSS length). */
+    height?: number | string;
+    /** Number of text lines to render for the `text` variant. */
+    lines?: number;
+};
+declare const Skeleton: react.ForwardRefExoticComponent<HTMLAttributes<HTMLDivElement> & {
+    /** Shape of the placeholder. */
+    variant?: "rect" | "circle" | "text";
+    /** Explicit width (px number or CSS length). */
+    width?: number | string;
+    /** Explicit height (px number or CSS length). */
+    height?: number | string;
+    /** Number of text lines to render for the `text` variant. */
+    lines?: number;
+} & react.RefAttributes<HTMLDivElement>>;
+
+type BannerProps = {
+    /** Semantic colour of the banner. */
+    tone: 'info' | 'success' | 'warning' | 'danger';
+    /** Bold leading title. */
+    title?: string;
+    /** Banner message body. */
+    children: ReactNode;
+    /** Called when the dismiss button is clicked; omit to hide it. */
+    onDismiss?: () => void;
+    /** Accessible label for the dismiss button. */
+    dismissLabel?: string;
+    /** Custom leading icon; defaults to a tone-appropriate icon. */
+    icon?: ReactNode;
+    /** Trailing action buttons. */
+    actions?: ReactNode;
+    /** Stretch edge-to-edge with no rounded corners. */
+    full?: boolean;
+    className?: string;
+};
+declare function Banner({ tone, title, children, onDismiss, dismissLabel, icon, actions, full, className, }: BannerProps): react.JSX.Element;
+
+type QRCodeProps = ComponentPropsWithoutRef<'div'> & {
+    /** Data encoded into the QR code. */
+    value: string;
+    /** Module size in pixels. */
+    size?: number;
+    /** Accessible label describing the code. */
+    label?: string;
+};
+declare const QRCode: react.ForwardRefExoticComponent<Omit<react.DetailedHTMLProps<react.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
+    /** Data encoded into the QR code. */
+    value: string;
+    /** Module size in pixels. */
+    size?: number;
+    /** Accessible label describing the code. */
+    label?: string;
+} & react.RefAttributes<HTMLDivElement>>;
+
+interface BarcodeProps {
+    /** Value encoded as a barcode. */
+    value: string;
+    /** Bar height in pixels. */
+    height?: number;
+    className?: string;
+}
+declare function Barcode({ value, height, className }: BarcodeProps): react.JSX.Element;
+
+declare const typographyVariants: (props?: ({
+    align?: "center" | "right" | "left" | "start" | "end" | "justify" | null | undefined;
+    gutterBottom?: boolean | null | undefined;
+    leading?: "normal" | "relaxed" | "tight" | null | undefined;
+    noWrap?: boolean | null | undefined;
+    tone?: "danger" | "success" | "base" | "warning" | "accent" | "muted" | "subtle" | null | undefined;
+    transform?: "none" | "capitalize" | "lowercase" | "uppercase" | null | undefined;
+    variant?: "body" | "caption" | "code" | "h1" | "h2" | "h3" | "h4" | "title" | "display" | "overline" | "body-sm" | null | undefined;
+    weight?: "bold" | "medium" | "regular" | "semibold" | null | undefined;
+} & class_variance_authority_types.ClassProp) | undefined) => string;
+declare const lineClampClass: {
+    readonly 1: "line-clamp-1";
+    readonly 2: "line-clamp-2";
+    readonly 3: "line-clamp-3";
+    readonly 4: "line-clamp-4";
+    readonly 5: "line-clamp-5";
+    readonly 6: "line-clamp-6";
+};
+type TypographyProps = ComponentPropsWithoutRef<'p'> & VariantProps<typeof typographyVariants> & {
+    /** Render as a different element/component while keeping the styles. */
+    as?: ElementType;
+    /** Truncate after N lines with an ellipsis. */
+    lineClamp?: keyof typeof lineClampClass;
+};
+declare function Typography({ align, as, className, gutterBottom, leading, lineClamp, noWrap, tone, transform, variant, weight, ...props }: TypographyProps): react.JSX.Element;
+
+type GradientTextProps = ComponentPropsWithoutRef<'span'> & {
+    /** Render as a different element (e.g. `h1`, `h2`). */
+    as?: ElementType;
+    /** Animate the gradient sweep. Disabled automatically under reduced motion. */
+    animate?: boolean;
+    /** Override the gradient. Defaults to an accent → info token sweep. */
+    gradient?: string;
+};
+/**
+ * Gradient-filled text for premium headings and accents. Uses background-clip
+ * so it inherits font sizing from the surrounding type scale.
+ */
+declare function GradientText({ as, animate, gradient, className, style, children, ...props }: GradientTextProps): react.JSX.Element;
+
+type AnimatedNumberProps = Omit<ComponentPropsWithoutRef<'span'>, 'children'> & {
+    value: number;
+    /** Format the displayed number. Defaults to locale integer formatting. */
+    format?: (value: number) => string;
+    /** Animation duration in seconds. */
+    duration?: number;
+};
+/**
+ * Count-up number that animates from its previous value to the next. Snaps
+ * instantly when the user prefers reduced motion. Drives premium stat displays.
+ */
+declare function AnimatedNumber({ value, format, duration, className, ...props }: AnimatedNumberProps): react.JSX.Element;
+
+type AnimatedListProps<T> = {
+    /** Items to render; add/remove drives enter/exit animations. */
+    items: T[];
+    /** Returns a stable key per item so motion can track add/remove/reorder. */
+    getKey: (item: T, index: number) => string | number;
+    /** Renders a single item. */
+    renderItem: (item: T, index: number) => ReactNode;
+    /** Extra classes for the list container. */
+    className?: string;
+    /** Extra classes applied to each item wrapper. */
+    itemClassName?: string;
+    /** Per-item enter delay for a cascading reveal. */
+    stagger?: number;
+};
+/**
+ * List that animates items in and out as the array changes — premium feel for
+ * notifications, activity feeds, and search results. Honors reduced motion and
+ * relies on the app-level `MotionConfig reducedMotion="user"`.
+ */
+declare function AnimatedList<T>({ items, getKey, renderItem, className, itemClassName, stagger, }: AnimatedListProps<T>): react.JSX.Element;
+
+type PrimitiveLinkProps = ComponentPropsWithoutRef<'a'> & {
+    /** Open in a new tab with safe rel attributes and an external icon. */
+    external?: boolean;
+    /** Use muted foreground colour instead of the accent. */
+    muted?: boolean;
+};
+declare const PrimitiveLink: react.ForwardRefExoticComponent<Omit<react.DetailedHTMLProps<react.AnchorHTMLAttributes<HTMLAnchorElement>, HTMLAnchorElement>, "ref"> & {
+    /** Open in a new tab with safe rel attributes and an external icon. */
+    external?: boolean;
+    /** Use muted foreground colour instead of the accent. */
+    muted?: boolean;
+} & react.RefAttributes<HTMLAnchorElement>>;
+
+type FormProps<T extends FieldValues> = Omit<ComponentPropsWithoutRef<'form'>, 'onSubmit' | 'children'> & {
+    form: UseFormReturn<T>;
+    onSubmit: SubmitHandler<T>;
+    children: ReactNode;
+};
+declare function Form<T extends FieldValues>({ form, onSubmit, children, className, ...rest }: FormProps<T>): react.JSX.Element;
+
+type FieldProps = {
+    /** Explicit id for the control; auto-generated when omitted. */
+    id?: string;
+    /** RHF field name — used to read validation errors from form context. */
+    name?: string;
+    /** Visible field label. */
+    label: string;
+    /** Helper text shown below the control. */
+    hint?: string;
+    /** Manual error message; overrides any RHF error for `name`. */
+    error?: string | undefined;
+    /** Marks the field required (adds the required indicator). */
+    required?: boolean;
+    /** Extra classes for the field wrapper. */
+    className?: string;
+    children: ReactNode | ((props: {
+        id: string;
+        'aria-invalid': boolean;
+        'aria-describedby': string;
+    }) => ReactNode);
+};
+declare function Field({ id: providedId, name, label, hint, error: manualError, required, className, children, }: FieldProps): react.JSX.Element;
+
+declare const Input: react.ForwardRefExoticComponent<Omit<react.DetailedHTMLProps<react.InputHTMLAttributes<HTMLInputElement>, HTMLInputElement>, "ref"> & react.RefAttributes<HTMLInputElement>>;
+
+declare const gridColumns$1: {
+    readonly 1: "grid-cols-1";
+    readonly 2: "grid-cols-1 md:grid-cols-2";
+    readonly 3: "grid-cols-1 md:grid-cols-3";
+    readonly 4: "grid-cols-1 sm:grid-cols-2 xl:grid-cols-4";
+};
+declare const actionAlign: {
+    readonly between: "justify-between";
+    readonly center: "justify-center";
+    readonly end: "justify-end";
+    readonly start: "justify-start";
+};
+type FormGridProps = ComponentPropsWithoutRef<'div'> & {
+    columns?: keyof typeof gridColumns$1;
+};
+declare function FormGrid({ children, className, columns, ...props }: FormGridProps): react.JSX.Element;
+type FieldsetProps = Omit<ComponentPropsWithoutRef<'fieldset'>, 'title'> & {
+    /** Fieldset legend / group title. */
+    legend?: ReactNode;
+    /** Supporting text shown under the legend. */
+    description?: ReactNode;
+    /** Number of grid columns for the contained fields. */
+    columns?: keyof typeof gridColumns$1;
+};
+declare function Fieldset({ children, className, columns, description, legend, ...props }: FieldsetProps): react.JSX.Element;
+type FormActionsProps = ComponentPropsWithoutRef<'div'> & {
+    align?: keyof typeof actionAlign;
+    sticky?: boolean;
+};
+declare function FormActions({ align, children, className, sticky, ...props }: FormActionsProps): react.JSX.Element;
+
+type FormControlField = {
+    /** Stable id shared by the label (`htmlFor`) and the control. */
+    id: string;
+    'aria-describedby': string | undefined;
+    'aria-invalid': true | undefined;
+    'aria-required': true | undefined;
+    required: boolean;
+    disabled: boolean;
+};
+type FormControlContextValue = FormControlField & {
+    descriptionId: string;
+    errorId: string;
+    invalid: boolean;
+};
+declare function useFormControlContext(): FormControlContextValue | null;
+/**
+ * Returns the ARIA wiring a control should spread onto itself so the
+ * surrounding {@link FormControl} can connect label, helper text, and error.
+ * Returns an empty object when used outside a `FormControl`.
+ */
+declare function useFormControl(): Partial<FormControlField>;
+type FormControlProps = Omit<ComponentPropsWithoutRef<'div'>, 'children' | 'id'> & {
+    id?: string;
+    invalid?: boolean;
+    required?: boolean;
+    disabled?: boolean;
+    /**
+     * Children may be a render function that receives the resolved field props,
+     * or static nodes that wire themselves with {@link useFormControl}.
+     */
+    children?: ReactNode | ((field: FormControlField) => ReactNode);
+};
+declare function FormControl({ id, invalid, required, disabled, className, children, ...props }: FormControlProps): react.JSX.Element;
+type FormLabelProps = Omit<ComponentPropsWithoutRef<'label'>, 'htmlFor'> & {
+    htmlFor?: string;
+    required?: boolean;
+};
+declare function FormLabel({ className, children, required, htmlFor, ...props }: FormLabelProps): react.JSX.Element;
+declare const helperTone: {
+    readonly muted: "text-[var(--color-fg-muted)]";
+    readonly danger: "text-[var(--color-danger-fg)]";
+    readonly success: "text-[var(--color-success-fg)]";
+};
+type FormHelperTextProps = ComponentPropsWithoutRef<'p'> & {
+    tone?: keyof typeof helperTone;
+};
+declare function FormHelperText({ className, tone, children, ...props }: FormHelperTextProps): react.JSX.Element;
+type FormErrorProps = ComponentPropsWithoutRef<'p'>;
+declare function FormError({ className, children, ...props }: FormErrorProps): react.JSX.Element | null;
+
+type RadioOption<T = string> = {
+    value: T;
+    label: string;
+    description?: string;
+    icon?: ReactNode;
+    disabled?: boolean;
+};
+type RadioGroupProps<T = string> = {
+    /** Radio options to choose from. */
+    options: RadioOption<T>[];
+    /** Currently selected value. */
+    value: T;
+    /** Called with the newly selected value. */
+    onChange: (value: T) => void;
+    /** Layout direction of the options. */
+    orientation?: 'horizontal' | 'vertical';
+    /** Plain radios or selectable cards. */
+    variant?: 'plain' | 'card';
+    name?: string;
+    className?: string;
+};
+declare function RadioGroup<T = string>({ options, value, onChange, orientation, variant, name, className, }: RadioGroupProps<T>): react.JSX.Element;
+
+type CheckboxGroupOption = {
+    value: string;
+    label: string;
+    description?: string;
+    disabled?: boolean;
+};
+type CheckboxGroupProps = {
+    /** Selectable options rendered as checkboxes. */
+    options: CheckboxGroupOption[];
+    /** Currently selected option values (controlled). */
+    value: string[];
+    /** Called with the next array of selected values when any box toggles. */
+    onChange: (value: string[]) => void;
+    /** Stacking direction of the checkboxes. Defaults to `'vertical'`. */
+    orientation?: 'vertical' | 'horizontal';
+    /** Disables every checkbox in the group. */
+    disabled?: boolean;
+    /** Marks the group invalid for validation styling (sets `data-invalid`). */
+    invalid?: boolean;
+    /** Shared form field name applied to each checkbox. */
+    name?: string;
+    /** Extra classes for the group container. */
+    className?: string;
+    'aria-label'?: string;
+    'aria-labelledby'?: string;
+};
+declare function CheckboxGroup({ options, value, onChange, orientation, disabled, invalid, name, className, ...aria }: CheckboxGroupProps): react.JSX.Element;
+type SwitchGroupOption = {
+    value: string;
+    label: string;
+    description?: string;
+    disabled?: boolean;
+};
+type SwitchGroupProps = {
+    /** Switch options rendered as toggle rows. */
+    options: SwitchGroupOption[];
+    /** Values of the switches currently on (controlled). */
+    value: string[];
+    /** Called with the next array of on values when any switch toggles. */
+    onChange: (value: string[]) => void;
+    /** Disables every switch in the group. */
+    disabled?: boolean;
+    /** Wrap each row in a bordered settings panel. */
+    bordered?: boolean;
+    /** Extra classes for the group container. */
+    className?: string;
+    /** Accessible label for the group. */
+    'aria-label'?: string;
+    /** Id of an element labelling the group. */
+    'aria-labelledby'?: string;
+};
+declare function SwitchGroup({ options, value, onChange, disabled, bordered, className, ...aria }: SwitchGroupProps): react.JSX.Element;
+type RadioCardOption<T = string> = RadioOption<T>;
+declare const cardColumns: {
+    readonly 1: "grid-cols-1";
+    readonly 2: "grid-cols-1 sm:grid-cols-2";
+    readonly 3: "grid-cols-1 sm:grid-cols-3";
+    readonly 4: "grid-cols-1 sm:grid-cols-2 xl:grid-cols-4";
+};
+type RadioCardGroupProps<T = string> = Omit<RadioGroupProps<T>, 'variant'> & {
+    /** Lay cards out as a fixed-column grid instead of wrapping rows. */
+    columns?: keyof typeof cardColumns;
+};
+/**
+ * Single-choice card selector for plans, roles, layouts, or preferences.
+ * Thin preset over {@link RadioGroup} locked to the `card` variant.
+ */
+declare function RadioCardGroup<T = string>({ columns, className, ...props }: RadioCardGroupProps<T>): react.JSX.Element;
+
+type SelectProps = ComponentPropsWithoutRef<'select'>;
+declare const Select: react.ForwardRefExoticComponent<Omit<react.DetailedHTMLProps<react.SelectHTMLAttributes<HTMLSelectElement>, HTMLSelectElement>, "ref"> & react.RefAttributes<HTMLSelectElement>>;
+
+type TextareaProps = ComponentPropsWithoutRef<'textarea'>;
+declare const Textarea: react.ForwardRefExoticComponent<Omit<react.DetailedHTMLProps<react.TextareaHTMLAttributes<HTMLTextAreaElement>, HTMLTextAreaElement>, "ref"> & react.RefAttributes<HTMLTextAreaElement>>;
+
+type CheckboxProps = {
+    /** Controlled checked state. */
+    checked?: boolean;
+    /** Initial checked state when uncontrolled. */
+    defaultChecked?: boolean;
+    /** Called with the new checked state on toggle. */
+    onChange?: (checked: boolean) => void;
+    /** Render the mixed/indeterminate visual state. */
+    indeterminate?: boolean;
+    /** Disable interaction and dim the control. */
+    disabled?: boolean;
+    /** Visible label beside the checkbox. */
+    label?: string;
+    /** Secondary helper text under the label. */
+    description?: string;
+    className?: string;
+    /** Element id, also associates the label. */
+    id?: string;
+};
+declare function Checkbox({ checked, defaultChecked, onChange, indeterminate, disabled, label, description, className, id, }: CheckboxProps): react.JSX.Element;
+
+type SwitchProps = {
+    /** Controlled on/off state. */
+    checked?: boolean;
+    /** Initial state when uncontrolled. */
+    defaultChecked?: boolean;
+    /** Called with the new boolean state when toggled. */
+    onChange?: (checked: boolean) => void;
+    /** Disable interaction and dim the control. */
+    disabled?: boolean;
+    /** Visible label rendered beside the switch. */
+    label?: string;
+    /** Secondary helper text under the label. */
+    description?: string;
+    className?: string;
+    /** Element id, also used to associate the label. */
+    id?: string;
+    /** Accessible name when no visible `label` is provided. */
+    'aria-label'?: string;
+    /** Id of an external element labelling the switch. */
+    'aria-labelledby'?: string;
+};
+declare function Switch({ checked, defaultChecked, onChange, disabled, label, description, className, id, 'aria-label': ariaLabel, 'aria-labelledby': ariaLabelledby, }: SwitchProps): react.JSX.Element;
+
+type ToggleOption<T extends string = string> = {
+    value: T;
+    label: string;
+    icon?: ReactNode;
+    disabled?: boolean;
+};
+type ToggleGroupProps<T extends string = string> = {
+    /** Single-select mode — only one option active at a time. */
+    type: 'single';
+    /** The active option value (controlled). */
+    value: T;
+    /** Called with the newly selected value. */
+    onChange: (value: T) => void;
+    /** Toggle options to render. */
+    options: ToggleOption<T>[];
+    /** Extra classes for the toggle container. */
+    className?: string;
+    /** Accessible label for the group (maps to `aria-label`). */
+    ariaLabel?: string;
+} | {
+    /** Multi-select mode — any number of options active. */
+    type: 'multiple';
+    /** The active option values (controlled). */
+    value: T[];
+    /** Called with the next array of active values when any toggle flips. */
+    onChange: (value: T[]) => void;
+    /** Toggle options to render. */
+    options: ToggleOption<T>[];
+    /** Extra classes for the toggle container. */
+    className?: string;
+    /** Accessible label for the group (maps to `aria-label`). */
+    ariaLabel?: string;
+};
+declare function ToggleGroup<T extends string = string>(props: ToggleGroupProps<T>): react.JSX.Element;
+
+type ComboboxOption<T = string> = {
+    value: T;
+    label: string;
+    description?: string;
+    icon?: ReactNode;
+    disabled?: boolean;
+};
+type ComboboxProps<T = string> = {
+    /** Selectable options. */
+    options: ComboboxOption<T>[];
+    /** Currently selected value, or null. */
+    value: T | null;
+    /** Called with the chosen value (or null when cleared). */
+    onChange: (value: T | null) => void;
+    /** Placeholder text for the input when nothing is selected. */
+    placeholder?: string;
+    /** Message shown when no options match the query. */
+    emptyMessage?: string;
+    /** Show a loading state (e.g. while fetching options). */
+    loading?: boolean;
+    /** Called as the user types — use for async/remote filtering. */
+    onInputChange?: (q: string) => void;
+    /** Custom renderer for an option row. */
+    renderOption?: (option: ComboboxOption<T>) => ReactNode;
+    /** Control size. */
+    size?: 'sm' | 'md';
+    /** Disables the input and prevents selection. */
+    disabled?: boolean;
+    /** Show a clear button to reset the selection. */
+    clearable?: boolean;
+    /** Form field name for the underlying input. */
+    name?: string;
+    /** Explicit id for the input. */
+    id?: string;
+    /** Extra classes for the combobox container. */
+    className?: string;
+};
+declare function Combobox<T = string>({ options, value, onChange, placeholder, emptyMessage, loading, onInputChange, renderOption, size, disabled, clearable, name, id, className, inputRef, }: ComboboxProps<T> & {
+    /** Ref forwarded to the underlying text input. */
+    inputRef?: Ref<HTMLInputElement>;
+}): react.JSX.Element;
+
+type MultiColumnComboboxColumn = {
+    key: string;
+    header: string;
+    width?: string;
+};
+type MultiColumnComboboxItem = Record<string, string> & {
+    id: string;
+};
+type MultiColumnComboboxProps = {
+    /** Selectable rows, each carrying a value per column. */
+    items: MultiColumnComboboxItem[];
+    /** Column definitions shown in the dropdown grid. */
+    columns: MultiColumnComboboxColumn[];
+    /** Id of the selected item, or null. */
+    value: string | null;
+    /** Called with the new selection id (or null when cleared). */
+    onChange: (id: string | null) => void;
+    /** Column key shown in the input when an item is selected. Defaults to first column. */
+    displayKey?: string;
+    /** Visible field label. */
+    label?: string;
+    /** Placeholder when nothing is selected. */
+    placeholder?: string;
+    /** Message shown when no items match the query. */
+    emptyMessage?: string;
+    /** Disable the control. */
+    disabled?: boolean;
+    /** Show a clear button when a value is selected. */
+    clearable?: boolean;
+    className?: string;
+};
+/**
+ * Combobox whose popup is a small table — search across all columns, render
+ * structured rows. For picking entities with several identifying fields
+ * (e.g. SKU + name + stock, employee + department + role).
+ */
+declare function MultiColumnCombobox({ items, columns, value, onChange, displayKey, label, placeholder, emptyMessage, disabled, clearable, className, }: MultiColumnComboboxProps): react.JSX.Element;
+
+type MultiSelectProps<T = string> = {
+    /** Selectable options. */
+    options: ComboboxOption<T>[];
+    /** Currently selected values. */
+    value: T[];
+    /** Called with the updated selection. */
+    onChange: (value: T[]) => void;
+    placeholder?: string;
+    /** Message shown when no options match. */
+    emptyMessage?: string;
+    /** Max chips to render before collapsing into a "+N" badge. */
+    maxBadgeCount?: number;
+    chipsClassName?: string;
+    /** Show a "select all" control. */
+    showSelectAll?: boolean;
+    /** Label for the select-all control. */
+    selectAllLabel?: string;
+    /** Label for the clear-all control. */
+    clearAllLabel?: string;
+    /** Control size. */
+    size?: 'sm' | 'md';
+    disabled?: boolean;
+    className?: string;
+};
+declare function MultiSelect<T = string>({ options, value, onChange, placeholder, emptyMessage, maxBadgeCount, chipsClassName, showSelectAll, selectAllLabel, clearAllLabel, size, disabled, className, }: MultiSelectProps<T>): react.JSX.Element;
+
+type TagInputProps = {
+    /** Current list of tags. */
+    value: string[];
+    /** Called with the updated tag list on add/remove. */
+    onChange: (value: string[]) => void;
+    placeholder?: string;
+    /** Maximum number of tags allowed. */
+    maxTags?: number;
+    /** Pattern that splits typed input into tags (e.g. comma/space). */
+    delimiter?: RegExp;
+    /** Validate a candidate tag; return an error string to reject it. */
+    validate?: (tag: string) => string | null;
+    /** Autocomplete suggestions offered while typing. */
+    suggestions?: string[];
+    className?: string;
+};
+declare function TagInput({ value, onChange, placeholder, maxTags, delimiter, validate, suggestions, className, }: TagInputProps): react.JSX.Element;
+
+type ToggleButtonProps = Omit<ButtonProps, 'onClick'> & {
+    /** Whether the toggle is currently pressed/active. */
+    pressed: boolean;
+    /** Called with the next pressed state when toggled. */
+    onPressedChange: (pressed: boolean) => void;
+};
+declare function ToggleButton({ pressed, onPressedChange, className, variant, ...props }: ToggleButtonProps): react.JSX.Element;
+
+type NumberInputProps = {
+    /** Current value, or null when empty. */
+    value: number | null;
+    /** Called with the parsed value (null when cleared). */
+    onChange: (value: number | null) => void;
+    /** Minimum allowed value. */
+    min?: number;
+    /** Maximum allowed value. */
+    max?: number;
+    /** Increment/decrement step. Defaults to 1. */
+    step?: number;
+    /** Number of decimal places to enforce. */
+    precision?: number;
+    placeholder?: string;
+    /** Unit suffix shown inside the field (e.g. "%"). */
+    suffix?: string;
+    /** Prefix shown inside the field (e.g. "$"). */
+    prefix?: string;
+    /** Show the stepper +/- buttons. */
+    showSteppers?: boolean;
+    /** Control size. */
+    size?: 'sm' | 'md';
+    disabled?: boolean;
+    className?: string;
+    /** Accessible name when no visible label is present. */
+    ariaLabel?: string;
+};
+declare const NumberInput: react.ForwardRefExoticComponent<NumberInputProps & react.RefAttributes<HTMLInputElement>>;
+
+type SearchInputProps = Omit<InputHTMLAttributes<HTMLInputElement>, 'onChange' | 'value'> & {
+    /** Current query string. */
+    value: string;
+    /** Called on every keystroke with the new query. */
+    onChange: (value: string) => void;
+    /** Called after `debounceMs` of inactivity — ideal for firing searches. */
+    onDebouncedChange?: (value: string) => void;
+    /** Debounce window for `onDebouncedChange`, in ms. */
+    debounceMs?: number;
+    /** Show a clear (×) button when there is a value. */
+    showClear?: boolean;
+    /** Accessible label for the clear button. */
+    clearLabel?: string;
+};
+declare const SearchInput: react.ForwardRefExoticComponent<Omit<InputHTMLAttributes<HTMLInputElement>, "value" | "onChange"> & {
+    /** Current query string. */
+    value: string;
+    /** Called on every keystroke with the new query. */
+    onChange: (value: string) => void;
+    /** Called after `debounceMs` of inactivity — ideal for firing searches. */
+    onDebouncedChange?: (value: string) => void;
+    /** Debounce window for `onDebouncedChange`, in ms. */
+    debounceMs?: number;
+    /** Show a clear (×) button when there is a value. */
+    showClear?: boolean;
+    /** Accessible label for the clear button. */
+    clearLabel?: string;
+} & react.RefAttributes<HTMLInputElement>>;
+
+type TimeValue = {
+    hours: number;
+    minutes: number;
+    seconds?: number;
+};
+type TimePickerProps = {
+    /** Selected time ({ hours, minutes, seconds? }). */
+    value: TimeValue;
+    /** Called with the new time on change. */
+    onChange: (value: TimeValue) => void;
+    /** Show a seconds field. */
+    showSeconds?: boolean;
+    /** Use 12-hour format with an AM/PM toggle. */
+    hour12?: boolean;
+    /** Visible field label. */
+    label?: string;
+    /** Disable the control. */
+    disabled?: boolean;
+};
+declare function TimePicker({ value, onChange, showSeconds, hour12, label, disabled, }: TimePickerProps): react.JSX.Element;
+
+type DateTimePickerProps = {
+    /** Selected date-time, or `undefined` when empty (controlled). */
+    value: Date | undefined;
+    /** Called with the newly selected date-time. */
+    onChange: (value: Date | undefined) => void;
+    /** Placeholder text when nothing is selected. */
+    placeholder?: string;
+};
+declare function DateTimePicker({ value, onChange, placeholder }: DateTimePickerProps): react.JSX.Element;
+
+type DateTimeRangePickerProps = {
+    /** Selected start/end date-time range (controlled). */
+    value: DateRange;
+    /** Called with the next range when either date or time changes. */
+    onChange: (value: DateRange) => void;
+    /** Placeholder text for the date inputs. */
+    placeholder?: string;
+    /** Label for the start date-time field. */
+    startLabel?: string;
+    /** Label for the end date-time field. */
+    endLabel?: string;
+    /** Extra classes for the picker container. */
+    className?: string;
+};
+declare function DateTimeRangePicker({ value, onChange, placeholder, startLabel, endLabel, className, }: DateTimeRangePickerProps): react.JSX.Element;
+
+type PinInputProps = {
+    /** Current code value. */
+    value: string;
+    /** Called with the full code as digits are entered. */
+    onChange: (value: string) => void;
+    /** Number of input cells. Defaults to 6. */
+    length?: number;
+    /** Visible label above the inputs. */
+    label?: string;
+    disabled?: boolean;
+};
+declare function PinInput({ value, onChange, length, label, disabled, }: PinInputProps): react.JSX.Element;
+
+type PasswordInputProps = Omit<InputHTMLAttributes<HTMLInputElement>, 'type'> & {
+    /** Show a live password-strength meter below the field. */
+    showStrength?: boolean;
+    /** Accessible label for the reveal toggle (show state). */
+    revealLabel?: string;
+    /** Accessible label for the reveal toggle (hide state). */
+    hideLabel?: string;
+};
+declare const PasswordInput: react.ForwardRefExoticComponent<Omit<InputHTMLAttributes<HTMLInputElement>, "type"> & {
+    /** Show a live password-strength meter below the field. */
+    showStrength?: boolean;
+    /** Accessible label for the reveal toggle (show state). */
+    revealLabel?: string;
+    /** Accessible label for the reveal toggle (hide state). */
+    hideLabel?: string;
+} & react.RefAttributes<HTMLInputElement>>;
+
+type PhoneInputProps = Pick<PhoneInputProps$1, 'value' | 'onChange' | 'disabled' | 'name' | 'placeholder' | 'defaultCountry'>;
+declare function PhoneInput(props: PhoneInputProps): react.JSX.Element;
+
+type CurrencyInputProps = {
+    /** Amount in major units, or null when empty. */
+    value: number | null;
+    /** Called with the parsed amount (null when cleared). */
+    onChange: (value: number | null) => void;
+    /** ISO 4217 currency code (e.g. "USD"). */
+    currency: string;
+    /** BCP 47 locale for formatting. Defaults to the runtime locale. */
+    locale?: string;
+    /** Minimum allowed amount. */
+    min?: number;
+    /** Maximum allowed amount. */
+    max?: number;
+};
+declare function CurrencyInput({ currency, locale, ...props }: CurrencyInputProps): react.JSX.Element;
+
+type RatingProps = {
+    /** Current rating value. */
+    value: number;
+    /** Called with the chosen value; omit for a read-only display. */
+    onChange?: (value: number) => void;
+    /** Number of stars. Defaults to 5. */
+    max?: number;
+    /** Selectable granularity: whole or half stars. */
+    precision?: 1 | 0.5;
+    /** Accessible label for the rating group. */
+    label?: string;
+    /** Render as a non-interactive display. */
+    readOnly?: boolean;
+    /** Star size. */
+    size?: 'sm' | 'md' | 'lg';
+    className?: string;
+};
+declare function Rating({ value, onChange, max, precision, label, readOnly, size, className, }: RatingProps): react.JSX.Element;
+
+type MentionOption = {
+    id: string;
+    label: string;
+};
+type MentionInputProps = {
+    /** Current text value, including any @-mentions. */
+    value: string;
+    /** Called with the new text on change. */
+    onChange: (value: string) => void;
+    /** Candidates shown in the mention autocomplete. */
+    options: MentionOption[];
+    /** Placeholder text when empty. */
+    placeholder?: string;
+};
+declare function MentionInput({ value, onChange, options, placeholder }: MentionInputProps): react.JSX.Element;
+
+type AsyncSelectProps<T = string> = Omit<ComboboxProps<T>, 'options' | 'loading' | 'onInputChange'> & {
+    queryKey: (query: string) => unknown[];
+    queryFn: (query: string) => Promise<ComboboxOption<T>[]>;
+    minChars?: number;
+    minCharsMessage?: string;
+};
+declare function AsyncSelect<T = string>({ queryKey, queryFn, minChars, minCharsMessage, ...props }: AsyncSelectProps<T>): react.JSX.Element;
+
+type InputGroupProps = ComponentPropsWithoutRef<'div'> & {
+    /** Leading addon rendered before the input (icon, label, unit). */
+    prefix?: ReactNode;
+    /** Trailing addon rendered after the input. */
+    suffix?: ReactNode;
+};
+declare const InputGroup: react.ForwardRefExoticComponent<Omit<react.DetailedHTMLProps<react.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
+    /** Leading addon rendered before the input (icon, label, unit). */
+    prefix?: ReactNode;
+    /** Trailing addon rendered after the input. */
+    suffix?: ReactNode;
+} & react.RefAttributes<HTMLDivElement>>;
+
+type Swatch = {
+    value: string;
+    label?: string;
+};
+type SwatchPickerProps = {
+    /** Selectable swatches — hex strings or `{ value, label }` objects. */
+    swatches: Array<string | Swatch>;
+    /** Currently selected swatch value (controlled). */
+    value: string;
+    /** Called with the newly selected swatch value. */
+    onChange: (value: string) => void;
+    /** Swatch size. Defaults to `'md'`. */
+    size?: 'sm' | 'md';
+    /** Append a native color input for arbitrary values. */
+    allowCustom?: boolean;
+    /** Extra classes for the picker container. */
+    className?: string;
+    /** Accessible label for the swatch group. */
+    'aria-label'?: string;
+};
+/**
+ * Controlled color/accent preset selector. Domain-neutral — the app wires
+ * `value`/`onChange` to its own theme state (e.g. brand accent color).
+ */
+declare function SwatchPicker({ swatches, value, onChange, size, allowCustom, className, 'aria-label': ariaLabel, }: SwatchPickerProps): react.JSX.Element;
+
+declare const alertVariants: (props?: ({
+    variant?: "danger" | "success" | "warning" | "info" | null | undefined;
+} & class_variance_authority_types.ClassProp) | undefined) => string;
+type AlertProps = ComponentPropsWithoutRef<'div'> & VariantProps<typeof alertVariants> & {
+    /** Bold heading shown above the message. */
+    title?: string;
+    /** Show a close button that hides the alert. */
+    dismissible?: boolean;
+};
+declare function Alert({ className, variant, title, dismissible, children, ...props }: AlertProps): react.JSX.Element | null;
+
+type InlineNoticeTone = 'info' | 'success' | 'warning' | 'danger' | 'neutral';
+type InlineNoticeProps = Omit<ComponentPropsWithoutRef<'div'>, 'title'> & {
+    /** Semantic tone driving color and default icon. Defaults to `'info'`. */
+    tone?: InlineNoticeTone;
+    /** Leading icon override; falls back to a tone-based default. */
+    icon?: ReactNode;
+    /** Trailing action node (e.g. a small Button or Link). */
+    action?: ReactNode;
+    /** Show a dismiss button. */
+    dismissible?: boolean;
+    /** Called when the dismiss button is clicked. */
+    onDismiss?: () => void;
+};
+/**
+ * Compact single-row feedback for forms and settings panels — lighter than
+ * {@link Alert}. No border or fill by default, just toned text + icon.
+ */
+declare function InlineNotice({ tone, icon, action, dismissible, onDismiss, className, children, ...props }: InlineNoticeProps): react.JSX.Element | null;
+
+declare const toast: {
+    success: (message: string, opts?: ExternalToast) => string | number;
+    error: (message: string, opts?: ExternalToast) => string | number;
+    warn: (message: string, opts?: ExternalToast) => string | number;
+    info: (message: string, opts?: ExternalToast) => string | number;
+    promise: <ToastData>(promise: Promise<ToastData> | (() => Promise<ToastData>), data?: {
+        icon?: react.ReactNode;
+        style?: React.CSSProperties | undefined;
+        className?: string | undefined;
+        id?: number | string | undefined;
+        position?: ("top-left" | "top-right" | "bottom-left" | "bottom-right" | "top-center" | "bottom-center") | undefined;
+        onDismiss?: ((toast: sonner.ToastT) => void) | undefined;
+        action?: react.ReactNode | sonner.Action;
+        cancel?: react.ReactNode | sonner.Action;
+        duration?: number | undefined;
+        classNames?: sonner.ToastClassnames | undefined;
+        dismissible?: boolean | undefined;
+        richColors?: boolean | undefined;
+        invert?: boolean | undefined;
+        closeButton?: boolean | undefined;
+        onAutoClose?: ((toast: sonner.ToastT) => void) | undefined;
+        cancelButtonStyle?: React.CSSProperties | undefined;
+        actionButtonStyle?: React.CSSProperties | undefined;
+        unstyled?: boolean | undefined;
+        descriptionClassName?: string | undefined;
+    } & {
+        loading?: string | React.ReactNode;
+        success?: react.ReactNode | ((data: ToastData) => React.ReactNode | string | Promise<React.ReactNode | string>);
+        error?: react.ReactNode | ((data: any) => React.ReactNode | string | Promise<React.ReactNode | string>);
+        description?: react.ReactNode | ((data: any) => React.ReactNode | string | Promise<React.ReactNode | string>);
+        finally?: () => void | Promise<void>;
+    }) => (string & {
+        unwrap: () => Promise<ToastData>;
+    }) | (number & {
+        unwrap: () => Promise<ToastData>;
+    }) | {
+        unwrap: () => Promise<ToastData>;
+    };
+};
+
+type NotificationCardProps = {
+    /** Notification headline. */
+    title: string;
+    /** Body text. */
+    description?: string;
+    /** Leading icon or avatar. */
+    icon?: ReactNode;
+    /** Trailing metadata such as a timestamp. */
+    meta?: ReactNode;
+    /** Mark as unread (adds an emphasis indicator). */
+    unread?: boolean;
+    /** Action controls rendered in the card. */
+    actions?: ReactNode;
+};
+declare function NotificationCard({ title, description, icon, meta, unread, actions, }: NotificationCardProps): react.JSX.Element;
+
+interface ConfettiProps {
+    /** Fire the confetti burst when true. */
+    run?: boolean;
+    /** Number of confetti pieces. */
+    pieces?: number;
+    /** Height of the confetti canvas in px. */
+    height?: number;
+}
+declare function Confetti({ run, pieces, height }: ConfettiProps): react.JSX.Element;
+
+type BackdropProps = ComponentPropsWithoutRef<'div'> & {
+    /** Apply a backdrop blur to content behind the overlay. */
+    blur?: boolean;
+    /** Whether the backdrop is shown. */
+    open?: boolean;
+};
+declare function Backdrop({ blur, className, open, ...props }: BackdropProps): react.JSX.Element | null;
+
+type LoadingOverlayProps = {
+    /** Whether the overlay is shown. */
+    visible: boolean;
+    /** Optional text shown beneath the spinner. */
+    label?: ReactNode;
+    /** Blur the underlying content instead of dimming it. */
+    blur?: boolean;
+    /** Spinner size. Defaults to `'md'`. */
+    spinnerSize?: 'sm' | 'md' | 'lg';
+    /** Extra classes for the overlay container. */
+    className?: string;
+    /**
+     * When provided, wraps the children in a positioned container and overlays
+     * them. When omitted, renders only the overlay (parent must be `relative`).
+     */
+    children?: ReactNode;
+};
+/**
+ * Contained async overlay for panels, forms, and tables. It traps nothing and
+ * owns no data — drive `visible` from the caller's async state.
+ */
+declare function LoadingOverlay({ visible, label, blur, spinnerSize, className, children, }: LoadingOverlayProps): react.JSX.Element | null;
+
+type TabItem = {
+    label: string;
+    content: ReactNode;
+    icon?: ReactNode;
+    disabled?: boolean;
+    badge?: string | number;
+};
+type TabsProps = {
+    /** Tab definitions; each provides a label and panel content. */
+    items: TabItem[];
+    /** Initially selected tab index when uncontrolled. */
+    defaultIndex?: number;
+    /** Controlled selected tab index. */
+    selectedIndex?: number;
+    /** Called with the newly selected index. */
+    onChange?: (index: number) => void;
+    className?: string;
+    /** Visual style of the tab strip. */
+    variant?: 'underline' | 'pills';
+};
+declare function Tabs({ items, defaultIndex, selectedIndex, onChange, className, variant, }: TabsProps): react.JSX.Element;
+
+type DropdownItem = {
+    label: string;
+    icon?: ReactNode;
+    shortcut?: string;
+    danger?: boolean;
+    disabled?: boolean;
+    onClick?: () => void;
+    href?: string;
+};
+type DropdownSection = {
+    heading?: string;
+    items: DropdownItem[];
+};
+type DropdownProps = {
+    /** Element that opens the dropdown when activated. */
+    trigger: ReactNode;
+    /** Grouped menu items, optionally with section headings. */
+    sections: DropdownSection[];
+    /** Menu alignment relative to the trigger. Defaults to `'start'`. */
+    align?: 'start' | 'end';
+    /** Extra classes for the menu panel. */
+    className?: string;
+};
+declare function Dropdown({ trigger, sections, align, className }: DropdownProps): react.JSX.Element;
+
+type FloatingSide = 'top' | 'right' | 'bottom' | 'left';
+type FloatingAlign = 'start' | 'center' | 'end';
+
+type TooltipProps = {
+    /** Tooltip body shown on hover/focus. */
+    content: ReactNode;
+    /** The single trigger element the tooltip is attached to. */
+    children: ReactElement;
+    /** Preferred side to position against the trigger. */
+    side?: FloatingSide;
+    /** Alignment along the chosen side. */
+    align?: FloatingAlign;
+    /** Hover open delay in milliseconds. */
+    delayMs?: number;
+    /** Gap in pixels between trigger and tooltip. */
+    sideOffset?: number;
+    /** Disable the tooltip entirely. */
+    disabled?: boolean;
+};
+declare function Tooltip({ content, children, side, align, delayMs, sideOffset, disabled, }: TooltipProps): react.JSX.Element;
+
+type PopoverProps = {
+    /** Element that toggles the popover; receives the trigger props. */
+    trigger: ReactElement;
+    /** Panel content, or a render function receiving a `close` callback. */
+    children: ReactNode | ((api: {
+        close: () => void;
+    }) => ReactNode);
+    /** Preferred side of the trigger to position against. */
+    side?: FloatingSide;
+    /** Alignment along the chosen side. */
+    align?: FloatingAlign;
+    /** Gap in pixels between trigger and panel. */
+    sideOffset?: number;
+    /** Controlled open state. */
+    open?: boolean;
+    /** Initial open state when uncontrolled. */
+    defaultOpen?: boolean;
+    /** Called when the open state changes. */
+    onOpenChange?: (open: boolean) => void;
+    /** Trap focus and block outside interaction while open. */
+    modal?: boolean;
+    className?: string;
+};
+declare function Popover({ trigger, children, side, align, sideOffset, open, defaultOpen, onOpenChange, modal, className, }: PopoverProps): react.JSX.Element;
+
+type HoverCardProps = {
+    /** Element that reveals the card on hover/focus. */
+    trigger: ReactElement;
+    /** Card content shown on hover. */
+    children: ReactNode;
+    /** Side of the trigger to position the card. */
+    side?: 'top' | 'right' | 'bottom' | 'left';
+};
+declare function HoverCard({ trigger, children, side }: HoverCardProps): react.JSX.Element;
+
+type ContextMenuItem = {
+    label: string;
+    icon?: ReactNode;
+    disabled?: boolean;
+    danger?: boolean;
+    onClick?: () => void;
+};
+type ContextMenuProps = {
+    /** Target region that opens the menu on right-click. */
+    children: ReactNode;
+    /** Menu entries, including separators and nested items. */
+    items: ContextMenuItem[];
+    className?: string;
+};
+declare function ContextMenu({ children, items, className }: ContextMenuProps): react.JSX.Element;
+
+type CommandAction = {
+    id: string;
+    label: string;
+    section: 'navigation' | 'actions' | 'recent';
+    icon?: ReactNode;
+    keywords?: string[];
+    perform: () => void;
+};
+type CommandStore = {
+    actions: CommandAction[];
+    open: boolean;
+    setOpen: (open: boolean) => void;
+    register: (actions: CommandAction[]) => () => void;
+};
+declare const useCommandStore: zustand.UseBoundStore<zustand.StoreApi<CommandStore>>;
+declare function registerCommands(actions: CommandAction[]): () => void;
+declare function CommandPalette({ label, placeholder, }: {
+    label?: string;
+    placeholder?: string;
+}): react.JSX.Element;
+
+type BreadcrumbItem = {
+    label: string;
+    href?: string;
+};
+type BreadcrumbProps = {
+    /** Trail entries from root to current page. */
+    items: BreadcrumbItem[];
+    /** Custom separator between items. Defaults to a chevron. */
+    separator?: ReactNode;
+    className?: string;
+};
+declare function Breadcrumb({ items, separator, className, }: BreadcrumbProps): react.JSX.Element | null;
+
+type CollapsibleProps = {
+    /** Clickable header that toggles the panel. */
+    title: ReactNode;
+    /** Collapsible content. */
+    children: ReactNode;
+    /** Whether the panel starts open. */
+    defaultOpen?: boolean;
+};
+declare function Collapsible({ title, children, defaultOpen }: CollapsibleProps): react.JSX.Element;
+
+interface AccordionItem {
+    id: string;
+    title: ReactNode;
+    content: ReactNode;
+    disabled?: boolean;
+}
+interface AccordionProps {
+    /** Panel definitions. */
+    items: AccordionItem[];
+    /** Ids of panels open on first render. */
+    defaultOpenIds?: string[];
+    /** Allow more than one panel open at a time. */
+    allowMultiple?: boolean;
+    className?: string;
+}
+declare function Accordion({ items, defaultOpenIds, allowMultiple, className, }: AccordionProps): react.JSX.Element;
+
+interface NavigationMenuItem {
+    label: string;
+    href?: string;
+    content?: ReactNode;
+}
+interface NavigationMenuProps {
+    /** Top-level menu entries, optionally with nested children. */
+    items: NavigationMenuItem[];
+    className?: string;
+}
+declare function NavigationMenu({ items, className }: NavigationMenuProps): react.JSX.Element;
+
+interface SpotlightProps {
+    /** Whether the spotlight overlay is open. */
+    open: boolean;
+    /** Called when the open state changes (Esc, overlay click). */
+    onOpenChange: (open: boolean) => void;
+    /** Current search query. */
+    value: string;
+    /** Called with the new query on input. */
+    onChange: (value: string) => void;
+    /** Result list rendered below the input. */
+    children?: React.ReactNode;
+    /** Placeholder text for the search input. */
+    placeholder?: string;
+}
+declare function Spotlight({ open, onOpenChange, value, onChange, children, placeholder, }: SpotlightProps): react.JSX.Element | null;
+
+type BottomNavigationItem = {
+    icon?: ReactNode;
+    label: string;
+    value: string;
+};
+type BottomNavigationProps = {
+    className?: string;
+    /** Navigation destinations. */
+    items: BottomNavigationItem[];
+    /** Called with the value of the selected destination. */
+    onChange: (value: string) => void;
+    /** Value of the currently active destination. */
+    value: string;
+};
+declare function BottomNavigation({ className, items, onChange, value }: BottomNavigationProps): react.JSX.Element;
+
+type MenuProps = {
+    align?: 'start' | 'end';
+    children: ReactNode;
+    className?: string;
+    sections: DropdownSection[];
+};
+declare function Menu({ align, children, className, sections }: MenuProps): react.JSX.Element;
+
+type ActionMenuItem = DropdownItem;
+type ActionMenuSection = DropdownSection;
+type ActionMenuProps = {
+    /** Flat list of actions. Use `sections` instead for grouped/headed menus. */
+    items?: ActionMenuItem[];
+    /** Grouped actions with optional section headings. */
+    sections?: ActionMenuSection[];
+    /** Accessible label for the default trigger. */
+    label?: string;
+    /** Menu alignment relative to the trigger. Defaults to `'end'`. */
+    align?: 'start' | 'end';
+    /** Replace the default overflow trigger entirely. */
+    trigger?: ReactNode;
+    /** Icon for the default trigger button. Defaults to `MoreHorizontal`. */
+    icon?: ReactNode;
+    /** Size of the default trigger button. */
+    size?: 'sm' | 'md';
+    /** Extra classes for the menu container. */
+    className?: string;
+};
+/**
+ * Domain-neutral overflow menu for row, toolbar, and contextual actions.
+ * Renders a `MoreHorizontal` {@link IconButton} trigger unless overridden.
+ */
+declare function ActionMenu({ items, sections, label, align, trigger, icon, size, className, }: ActionMenuProps): react.JSX.Element;
+
+type RowAction = {
+    label: string;
+    icon: ReactNode;
+    onClick?: () => void;
+    href?: string;
+    danger?: boolean;
+    disabled?: boolean;
+};
+type RowActionsProps = {
+    /** Row actions; the first `max` show inline, the rest fold into a menu. */
+    actions: RowAction[];
+    /** Number of actions shown inline before collapsing the rest into a menu. */
+    max?: number;
+    /** Size of the action buttons. Defaults to `'md'`. */
+    size?: 'sm' | 'md';
+    /** Accessible label for the overflow menu trigger. */
+    menuLabel?: string;
+    /** Extra classes for the actions container. */
+    className?: string;
+};
+/**
+ * Compact action cluster for table rows and list items. Shows up to `max`
+ * inline icon buttons (each with a tooltip), then collapses overflow into an
+ * {@link ActionMenu}. Domain-neutral — it never imports table primitives.
+ */
+declare function RowActions({ actions, max, size, menuLabel, className, }: RowActionsProps): react.JSX.Element;
+
+type SpeedDialAction = {
+    icon?: ReactNode;
+    label: string;
+    onClick: () => void;
+};
+type SpeedDialProps = {
+    /** Actions revealed when the dial expands. */
+    actions: SpeedDialAction[];
+    /** Accessible name for the trigger button. */
+    ariaLabel?: string;
+    className?: string;
+    /** Custom trigger icon. Defaults to a plus. */
+    icon?: ReactNode;
+};
+declare function SpeedDial({ actions, ariaLabel, className, icon, }: SpeedDialProps): react.JSX.Element;
+
+declare const positions: {
+    readonly fixed: "fixed inset-x-0 top-0 z-40";
+    readonly sticky: "sticky top-0 z-30";
+    readonly static: "relative";
+};
+declare const tones: {
+    readonly base: "border-[var(--color-border)] bg-[var(--color-bg-base)] text-[var(--color-fg-base)]";
+    readonly subtle: "border-[var(--color-border-subtle)] bg-[var(--color-bg-subtle)] text-[var(--color-fg-base)]";
+    readonly accent: "border-[var(--color-accent-hover)] bg-[var(--color-accent)] text-[var(--color-accent-contrast)]";
+};
+type AppBarProps = ComponentPropsWithoutRef<'header'> & {
+    /** CSS positioning (e.g. static, sticky, fixed). */
+    position?: keyof typeof positions;
+    /** Background/foreground colour scheme. */
+    tone?: keyof typeof tones;
+};
+declare function AppBar({ className, position, tone, ...props }: AppBarProps): react.JSX.Element;
+declare function AppBarTitle({ className, ...props }: ComponentPropsWithoutRef<'div'>): react.JSX.Element;
+declare function AppBarSection({ className, ...props }: ComponentPropsWithoutRef<'div'>): react.JSX.Element;
+
+type PaginationProps = {
+    /** Current 1-based page number. */
+    page: number;
+    /** Total number of pages. */
+    totalPages: number;
+    /** Called with the new page when the user navigates. */
+    onPageChange: (page: number) => void;
+    /** Page buttons shown either side of the current page. */
+    siblingCount?: number;
+    className?: string;
+};
+declare function Pagination({ page, totalPages, onPageChange, siblingCount, className, }: PaginationProps): react.JSX.Element | null;
+
+declare const trackVariants: (props?: ({
+    size?: "xs" | "sm" | "md" | "lg" | null | undefined;
+} & class_variance_authority_types.ClassProp) | undefined) => string;
+declare const fillVariants: (props?: ({
+    variant?: "danger" | "success" | "warning" | "accent" | null | undefined;
+} & class_variance_authority_types.ClassProp) | undefined) => string;
+type ProgressProps = VariantProps<typeof trackVariants> & VariantProps<typeof fillVariants> & {
+    /** Current progress value, from 0 to `max`. */
+    value: number;
+    /** Maximum value. Defaults to 100. */
+    max?: number;
+    /** Visible label rendered above the track. */
+    label?: string;
+    /** Accessible name when no visible `label` is provided. */
+    ariaLabel?: string;
+    /** Show the numeric percentage beside the label. */
+    showValue?: boolean;
+    className?: string;
+};
+declare function Progress({ value, max, size, variant, label, ariaLabel, showValue, className, }: ProgressProps): react.JSX.Element;
+
+type CircularProgressProps = ComponentPropsWithoutRef<'div'> & {
+    /** Current progress value, 0 to `max`. */
+    value: number;
+    /** Maximum value. Defaults to 100. */
+    max?: number;
+    /** Diameter in pixels. */
+    size?: number;
+    /** Ring stroke width in pixels. */
+    thickness?: number;
+    /** Accessible label / centre caption. */
+    label?: string;
+};
+declare const CircularProgress: react.ForwardRefExoticComponent<Omit<react.DetailedHTMLProps<react.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
+    /** Current progress value, 0 to `max`. */
+    value: number;
+    /** Maximum value. Defaults to 100. */
+    max?: number;
+    /** Diameter in pixels. */
+    size?: number;
+    /** Ring stroke width in pixels. */
+    thickness?: number;
+    /** Accessible label / centre caption. */
+    label?: string;
+} & react.RefAttributes<HTMLDivElement>>;
+
+type DescriptionItem = {
+    term: string;
+    detail?: ReactNode;
+    description?: ReactNode;
+};
+type DescriptionListProps = ComponentPropsWithoutRef<'dl'> & {
+    /** Term/description pairs to render. */
+    items: DescriptionItem[];
+    /** `stacked` puts the term above the value; `inline` puts them side by side. */
+    layout?: 'stacked' | 'inline';
+};
+declare function DescriptionList({ items, layout, className, ...props }: DescriptionListProps): react.JSX.Element;
+
+type PropertyListItem = {
+    label: ReactNode;
+    value: ReactNode;
+};
+type PropertyListProps = Omit<ComponentPropsWithoutRef<'dl'>, 'children'> & {
+    /** Data-driven rows; alternative to passing `PropertyItem` children. */
+    items?: PropertyListItem[];
+    /** `PropertyItem` children; alternative to `items`. */
+    children?: ReactNode;
+    /** `horizontal` puts label and value side by side; `vertical` stacks them. */
+    orientation?: 'horizontal' | 'vertical';
+    /** Add dividing lines between rows. */
+    divided?: boolean;
+    /** Width of the label column when horizontal. */
+    labelWidth?: string;
+};
+/**
+ * Dense label/value rows for detail panels and settings summaries.
+ * Domain-neutral — labels and values are caller-supplied nodes.
+ */
+declare function PropertyList({ items, children, orientation, divided, labelWidth, className, ...props }: PropertyListProps): react.JSX.Element;
+type PropertyItemProps = {
+    /** Row label. */
+    label: ReactNode;
+    /** Row value. */
+    children: ReactNode;
+    /** Layout of label vs value; inherited from the list by default. */
+    orientation?: 'horizontal' | 'vertical';
+    /** Width of the label column when horizontal. */
+    labelWidth?: string;
+    /** Draw a divider above the row. */
+    divided?: boolean;
+    className?: string;
+};
+declare function PropertyItem({ label, children, orientation, labelWidth, divided, className, }: PropertyItemProps): react.JSX.Element;
+
+type MetadataItem = {
+    label: ReactNode;
+    value: ReactNode;
+    icon?: ReactNode;
+    /** When set, renders an inline copy button that copies this string. */
+    copyValue?: string;
+};
+declare const columnClass: {
+    readonly 1: "grid-cols-1";
+    readonly 2: "grid-cols-1 sm:grid-cols-2";
+    readonly 3: "grid-cols-1 sm:grid-cols-2 lg:grid-cols-3";
+};
+type MetadataListProps = {
+    /** Key/value entries to render. */
+    items: MetadataItem[];
+    /** Number of grid columns. */
+    columns?: keyof typeof columnClass;
+    className?: string;
+};
+/**
+ * Compact key/value metadata grid with muted labels, optional leading icons,
+ * and per-item copy actions. Domain-neutral.
+ */
+declare function MetadataList({ items, columns, className }: MetadataListProps): react.JSX.Element;
+
+type StatusTone = 'neutral' | 'success' | 'warning' | 'danger' | 'info' | 'accent';
+type StatusDotProps = ComponentPropsWithoutRef<'span'> & {
+    /** Semantic colour of the dot. */
+    tone?: StatusTone;
+    /** Animate a pulsing ring to signal a live/active state. */
+    pulse?: boolean;
+};
+declare function StatusDot({ tone, pulse, className, ...props }: StatusDotProps): react.JSX.Element;
+type StatusLabelProps = ComponentPropsWithoutRef<'span'> & {
+    /** Semantic colour of the label and dot. */
+    tone?: StatusTone;
+    /** Leading icon; replaces the status dot when set. */
+    icon?: ReactNode;
+    /** Show a leading status dot. Ignored when `icon` is provided. */
+    dot?: boolean;
+    /** Animate a pulsing ring on the dot. */
+    pulse?: boolean;
+    /** `plain` is dot + text on the surface; `soft` wraps it in a tinted pill. */
+    variant?: 'plain' | 'soft';
+};
+/**
+ * Generic status text with a leading dot or icon. Tone is token-driven and
+ * intentionally domain-neutral — callers supply the label text.
+ */
+declare function StatusLabel({ tone, icon, dot, pulse, variant, className, children, ...props }: StatusLabelProps): react.JSX.Element;
+
+type CopyFieldProps = {
+    /** The exact string written to the clipboard. */
+    value: string;
+    /** Optional display override (e.g. masked or formatted). Defaults to `value`. */
+    displayValue?: ReactNode;
+    /** Field label rendered above the value. */
+    label?: ReactNode;
+    /** Truncate the displayed value with an ellipsis when it overflows. */
+    truncate?: boolean;
+    /** Render the value in a monospace font. */
+    monospace?: boolean;
+    /** Control size. Defaults to `'md'`. */
+    size?: 'sm' | 'md';
+    /** Accessible label for the copy button before copying. */
+    copyLabel?: string;
+    /** Accessible label/feedback shown right after copying. */
+    copiedLabel?: string;
+    /** Extra classes for the field wrapper. */
+    className?: string;
+};
+/**
+ * Read-only value with an inline copy action, truncation, and a hover tooltip
+ * on the copy button. Transport-free — copies via the clipboard API only.
+ */
+declare function CopyField({ value, displayValue, label, truncate, monospace, size, copyLabel, copiedLabel, className, }: CopyFieldProps): react.JSX.Element;
+
+type MeterSegment = {
+    value: number;
+    tone?: StatusTone;
+    label?: string;
+};
+type MeterProps = {
+    /** Single-value fill. Ignored when `segments` is provided. */
+    value?: number;
+    /** Upper bound of the scale. Defaults to 100. */
+    max?: number;
+    /** Multiple stacked segments (e.g. storage by type). */
+    segments?: MeterSegment[];
+    /** Visible label above the track. */
+    label?: ReactNode;
+    /** Right-aligned value caption (e.g. "12 of 25 GB"). */
+    valueLabel?: ReactNode;
+    /** Semantic colour for the single-value fill. */
+    tone?: StatusTone;
+    /** Track thickness. */
+    size?: 'sm' | 'md';
+    /** Render a legend of segment labels below the track. */
+    showLegend?: boolean;
+    className?: string;
+    /** Accessible name when no visible `label` is provided. */
+    'aria-label'?: string;
+};
+/**
+ * Usage/quota meter for dashboards — single fill or stacked segments. Uses the
+ * native `meter` ARIA role so assistive tech reads progress correctly.
+ */
+declare function Meter({ value, max, segments, label, valueLabel, tone, size, showLegend, className, 'aria-label': ariaLabel, }: MeterProps): react.JSX.Element;
+
+type StatCardProps = {
+    /** Metric name shown above the value. */
+    label: string;
+    /** Primary metric value. */
+    value: string | number;
+    /** Percentage change; sign drives the up/down colour and arrow. */
+    delta?: number;
+    /** Caption beside the delta (e.g. "vs last month"). */
+    deltaLabel?: string;
+    /** Muted helper text under the value. */
+    hint?: string;
+    /** Leading icon. */
+    icon?: ReactNode;
+    /** Series rendered as an inline trend sparkline. */
+    sparkline?: number[];
+    className?: string;
+};
+declare function StatCard({ label, value, delta, deltaLabel, hint, icon, sparkline, className, }: StatCardProps): react.JSX.Element;
+
+declare const Table: react.ForwardRefExoticComponent<Omit<react.DetailedHTMLProps<react.TableHTMLAttributes<HTMLTableElement>, HTMLTableElement>, "ref"> & react.RefAttributes<HTMLTableElement>>;
+declare const TableHeader: react.ForwardRefExoticComponent<Omit<react.DetailedHTMLProps<react.HTMLAttributes<HTMLTableSectionElement>, HTMLTableSectionElement>, "ref"> & react.RefAttributes<HTMLTableSectionElement>>;
+declare const TableBody: react.ForwardRefExoticComponent<Omit<react.DetailedHTMLProps<react.HTMLAttributes<HTMLTableSectionElement>, HTMLTableSectionElement>, "ref"> & react.RefAttributes<HTMLTableSectionElement>>;
+declare const TableFooter: react.ForwardRefExoticComponent<Omit<react.DetailedHTMLProps<react.HTMLAttributes<HTMLTableSectionElement>, HTMLTableSectionElement>, "ref"> & react.RefAttributes<HTMLTableSectionElement>>;
+declare const TableRow: react.ForwardRefExoticComponent<Omit<react.DetailedHTMLProps<react.HTMLAttributes<HTMLTableRowElement>, HTMLTableRowElement>, "ref"> & react.RefAttributes<HTMLTableRowElement>>;
+declare const TableHead: react.ForwardRefExoticComponent<Omit<react.DetailedHTMLProps<react.ThHTMLAttributes<HTMLTableHeaderCellElement>, HTMLTableHeaderCellElement>, "ref"> & react.RefAttributes<HTMLTableCellElement>>;
+declare const TableCell: react.ForwardRefExoticComponent<Omit<react.DetailedHTMLProps<react.TdHTMLAttributes<HTMLTableDataCellElement>, HTMLTableDataCellElement>, "ref"> & react.RefAttributes<HTMLTableCellElement>>;
+declare const TableCaption: react.ForwardRefExoticComponent<Omit<react.DetailedHTMLProps<react.HTMLAttributes<HTMLElement>, HTMLElement>, "ref"> & react.RefAttributes<HTMLTableCaptionElement>>;
+
+type ListProps = ComponentPropsWithoutRef<'ul'> & {
+    dense?: boolean;
+    variant?: 'plain' | 'outlined' | 'soft';
+};
+declare const List: react.ForwardRefExoticComponent<Omit<react.DetailedHTMLProps<react.HTMLAttributes<HTMLUListElement>, HTMLUListElement>, "ref"> & {
+    dense?: boolean;
+    variant?: "plain" | "outlined" | "soft";
+} & react.RefAttributes<HTMLUListElement>>;
+declare function ListItem({ className, ...props }: ComponentPropsWithoutRef<'li'>): react.JSX.Element;
+type ListItemButtonProps = ComponentPropsWithoutRef<'button'> & {
+    selected?: boolean;
+};
+declare const ListItemButton: react.ForwardRefExoticComponent<Omit<react.DetailedHTMLProps<react.ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "ref"> & {
+    selected?: boolean;
+} & react.RefAttributes<HTMLButtonElement>>;
+declare function ListItemDecorator({ className, ...props }: ComponentPropsWithoutRef<'span'>): react.JSX.Element;
+declare function ListItemContent({ children, className, description, title, ...props }: ComponentPropsWithoutRef<'div'> & {
+    description?: ReactNode;
+    title?: ReactNode;
+}): react.JSX.Element;
+declare function ListDivider({ className, ...props }: ComponentPropsWithoutRef<'li'>): react.JSX.Element;
+declare function ListSubheader({ className, ...props }: ComponentPropsWithoutRef<'li'>): react.JSX.Element;
+
+type Datum = Record<string, string | number>;
+interface ChartSeries {
+    dataKey: string;
+    name?: string;
+    color?: string;
+}
+interface CartesianChartProps {
+    /** Row data; each object holds the x value and every series value. */
+    data: Datum[];
+    /** Key in each datum used for the x axis. */
+    xKey: string;
+    /** Series to plot, each mapping a data key to a label/colour. */
+    series: ChartSeries[];
+    /** Chart height in pixels. */
+    height?: number;
+    /** Show the series legend. */
+    showLegend?: boolean;
+    className?: string;
+}
+interface PieChartProps {
+    /** Slice data. */
+    data: Datum[];
+    /** Key in each datum used for the slice label. */
+    nameKey: string;
+    /** Key in each datum used for the slice value. */
+    valueKey: string;
+    /** Chart height in pixels. */
+    height?: number;
+    /** Render as a donut (hollow centre) instead of a full pie. */
+    donut?: boolean;
+    className?: string;
+}
+interface RadarChartProps {
+    /** Axis labels around the radar. */
+    categories: string[];
+    /** Series, each a value per category with an optional colour. */
+    series: {
+        name: string;
+        data: number[];
+        color?: string;
+    }[];
+    /** Chart height in pixels. */
+    height?: number;
+    className?: string;
+}
+interface GaugeChartProps {
+    /** Current value to display. */
+    value: number;
+    /** Lower bound of the scale. Defaults to 0. */
+    min?: number;
+    /** Upper bound of the scale. Defaults to 100. */
+    max?: number;
+    /** Caption shown with the value. */
+    label?: string;
+    /** Fill colour of the gauge arc. */
+    color?: string;
+    /** Chart height in pixels. */
+    height?: number;
+    className?: string;
+}
+interface HeatmapChartProps {
+    /** Cells as [xIndex, yIndex, value] tuples. */
+    data: [number, number, number][];
+    /** Column labels along the x axis. */
+    xLabels: string[];
+    /** Row labels along the y axis. */
+    yLabels: string[];
+    /** Chart height in pixels. */
+    height?: number;
+    className?: string;
+}
+interface ScatterChartProps {
+    /** Points, each with x/y and optional name and bubble size. */
+    data: {
+        x: number;
+        y: number;
+        name?: string;
+        size?: number;
+    }[];
+    /** Axis title for x. */
+    xLabel?: string;
+    /** Axis title for y. */
+    yLabel?: string;
+    /** Chart height in pixels. */
+    height?: number;
+    className?: string;
+}
+interface FunnelChartProps {
+    /** Stages from widest to narrowest. */
+    data: {
+        name: string;
+        value: number;
+    }[];
+    /** Chart height in pixels. */
+    height?: number;
+    className?: string;
+}
+interface TreemapChartProps {
+    /** Hierarchical nodes; size is proportional to `value`. */
+    data: {
+        name: string;
+        value: number;
+        children?: TreemapNode[];
+    }[];
+    /** Chart height in pixels. */
+    height?: number;
+    className?: string;
+}
+interface TreemapNode {
+    name: string;
+    value: number;
+    children?: TreemapNode[];
+}
+interface WaterfallChartProps {
+    /** Steps; `type` controls running-total vs delta rendering. */
+    data: {
+        name: string;
+        value: number;
+        type?: 'increase' | 'decrease' | 'total';
+    }[];
+    /** Chart height in pixels. */
+    height?: number;
+    className?: string;
+}
+declare function LineChart({ data, xKey, series, height, showLegend, className, }: CartesianChartProps): react.JSX.Element;
+declare function BarChart({ data, xKey, series, height, showLegend, className, }: CartesianChartProps): react.JSX.Element;
+declare function AreaChart({ data, xKey, series, height, showLegend, className, }: CartesianChartProps): react.JSX.Element;
+declare function StackedBarChart({ data, xKey, series, height, showLegend, className, }: CartesianChartProps): react.JSX.Element;
+declare function PieChart({ data, nameKey, valueKey, height, donut, className, }: PieChartProps): react.JSX.Element;
+declare function DonutChart(props: Omit<PieChartProps, 'donut'>): react.JSX.Element;
+declare function RadarChart({ categories, series, height, className }: RadarChartProps): react.JSX.Element;
+declare function GaugeChart({ value, min, max, label, color, height, className, }: GaugeChartProps): react.JSX.Element;
+declare function HeatmapChart({ data, xLabels, yLabels, height, className, }: HeatmapChartProps): react.JSX.Element;
+declare function ScatterChart({ data, xLabel, yLabel, height, className }: ScatterChartProps): react.JSX.Element;
+declare function FunnelChart({ data, height, className }: FunnelChartProps): react.JSX.Element;
+declare function TreemapChart({ data, height, className }: TreemapChartProps): react.JSX.Element;
+declare function WaterfallChart({ data, height, className }: WaterfallChartProps): react.JSX.Element;
+interface SankeyChartProps {
+    /** Named nodes referenced by links. */
+    nodes: {
+        name: string;
+    }[];
+    /** Flows between nodes, weighted by `value`. */
+    links: {
+        source: string;
+        target: string;
+        value: number;
+    }[];
+    /** Chart height in pixels. */
+    height?: number;
+    className?: string;
+}
+declare function SankeyChart({ nodes, links, height, className }: SankeyChartProps): react.JSX.Element;
+interface CandlestickDatum {
+    date: string;
+    open: number;
+    close: number;
+    low: number;
+    high: number;
+    volume?: number;
+}
+interface CandlestickChartProps {
+    /** OHLC data points. */
+    data: CandlestickDatum[];
+    /** Chart height in pixels. */
+    height?: number;
+    /** Render a volume sub-chart below the candles. */
+    showVolume?: boolean;
+    /** Show the zoom/pan data slider. */
+    showZoom?: boolean;
+    className?: string;
+}
+declare function CandlestickChart({ data, height, showVolume, showZoom, className, }: CandlestickChartProps): react.JSX.Element;
+
+type CalendarEvent = Event & {
+    id?: string;
+};
+type CalendarProps = Omit<CalendarProps$1<CalendarEvent>, 'localizer'> & {
+    className?: string;
+};
+declare function Calendar({ className, style, ...props }: CalendarProps): react.JSX.Element;
+
+type CopyButtonProps = Omit<ButtonProps, 'onClick'> & {
+    /** String written to the clipboard on click. */
+    value: string;
+    /** Label shown briefly after a successful copy. */
+    copiedLabel?: string;
+    /** Default button label. */
+    copyLabel?: string;
+};
+declare function CopyButton({ value, copiedLabel, copyLabel, children, ...props }: CopyButtonProps): react.JSX.Element;
+
+type CodeBlockProps = {
+    /** Source code to render. */
+    code: string;
+    /** Language for syntax highlighting (e.g. "ts", "bash"). */
+    language?: string;
+    /** Show a line-number gutter. */
+    showLineNumbers?: boolean;
+    /** Show a copy-to-clipboard button. */
+    showCopy?: boolean;
+    /** Max height in pixels before the block scrolls. */
+    maxHeight?: number;
+};
+declare function CodeBlock({ code, language, showLineNumbers, showCopy, maxHeight, }: CodeBlockProps): react.JSX.Element;
+
+type ToolbarProps = {
+    /** Control groups; each inner array renders as a divided cluster. */
+    groups: ReactNode[][];
+    /** Actions collapsed into an overflow menu. */
+    overflow?: DropdownSection[];
+};
+declare function Toolbar({ groups, overflow }: ToolbarProps): react.JSX.Element;
+
+type ResizablePanelsProps = {
+    direction: 'horizontal' | 'vertical';
+    children: ReactNode;
+    autoSaveId?: string;
+    className?: string;
+};
+declare function ResizablePanels({ direction, children, autoSaveId, className, }: ResizablePanelsProps): react.JSX.Element;
+declare function PanelHandle(props: ComponentProps<typeof Separator$1>): react.JSX.Element;
+type PanelProps = ComponentProps<typeof Panel$1> & {
+    scroll?: 'auto' | 'hidden' | 'x' | 'y';
+};
+declare function Panel({ className, scroll, style, ...props }: PanelProps): react.JSX.Element;
+
+type DiffViewerProps = {
+    oldValue: string;
+    newValue: string;
+};
+declare function DiffViewer({ oldValue, newValue }: DiffViewerProps): react.JSX.Element;
+
+type CountdownTimerProps = {
+    target: Date;
+    doneLabel?: string;
+};
+declare function CountdownTimer({ target, doneLabel }: CountdownTimerProps): react.JSX.Element;
+
+type MarqueeProps = {
+    children: ReactNode;
+    speedSeconds?: number;
+    className?: string;
+};
+declare function Marquee({ children, speedSeconds, className }: MarqueeProps): react.JSX.Element;
+
+interface JSONViewerProps {
+    /** The value to render as an interactive JSON tree. */
+    value: unknown;
+    /** Expand all nodes on first render. */
+    defaultExpanded?: boolean;
+    /** Extra classes for the viewer container. */
+    className?: string;
+}
+declare function JSONViewer({ value, defaultExpanded, className }: JSONViewerProps): react.JSX.Element;
+
+interface ActivityFeedItem {
+    id: string;
+    actor: string;
+    action: ReactNode;
+    timestamp: ReactNode;
+    target?: ReactNode;
+    avatarUrl?: string;
+}
+interface ActivityFeedProps {
+    /** Feed entries in chronological order. */
+    items: ActivityFeedItem[];
+    /** Content shown when there are no items. */
+    empty?: ReactNode;
+    className?: string;
+}
+declare function ActivityFeed({ items, empty, className }: ActivityFeedProps): react.JSX.Element;
+
+interface OrgChartNode {
+    id: string;
+    label: ReactNode;
+    description?: ReactNode;
+    children?: OrgChartNode[];
+}
+interface OrgChartProps {
+    node: OrgChartNode;
+    className?: string;
+}
+declare function OrgChart({ node, className }: OrgChartProps): react.JSX.Element;
+
+interface GanttItem {
+    id: string;
+    label: string;
+    start: Date;
+    end: Date;
+    color?: string;
+}
+interface GanttChartProps {
+    items: GanttItem[];
+    className?: string;
+}
+declare function GanttChart({ items, className }: GanttChartProps): react.JSX.Element;
+
+interface MapMarker {
+    id: string;
+    label: string;
+    x: number;
+    y: number;
+}
+interface MapProps {
+    /** Pins to render on the map. */
+    markers?: MapMarker[];
+    /** Map height in px. */
+    height?: number;
+    /** Extra classes for the map container. */
+    className?: string;
+}
+declare function Map({ markers, height, className }: MapProps): react.JSX.Element;
+
+declare const paperVariants: (props?: ({
+    elevation?: 0 | 1 | 2 | 3 | null | undefined;
+    variant?: "subtle" | "outlined" | "elevated" | null | undefined;
+} & class_variance_authority_types.ClassProp) | undefined) => string;
+type PaperProps = ComponentPropsWithoutRef<'div'> & VariantProps<typeof paperVariants>;
+declare function Paper({ className, elevation, variant, ...props }: PaperProps): react.JSX.Element;
+
+type SpotlightCardProps = ComponentPropsWithoutRef<'div'> & {
+    /** Glow color. Defaults to the accent token. */
+    glowColor?: string;
+    /** Glow radius in pixels. */
+    radius?: number;
+    /** Peak glow opacity (0–1). */
+    intensity?: number;
+};
+/**
+ * Surface with a radial glow that follows the cursor — the signature premium
+ * hover used by Linear/Vercel-style dashboards. Pointer-driven only, so it adds
+ * no ambient motion.
+ */
+declare function SpotlightCard({ glowColor, radius, intensity, className, style, children, onPointerMove, onPointerEnter, onPointerLeave, ...props }: SpotlightCardProps): react.JSX.Element;
+
+type BorderBeamProps = ComponentPropsWithoutRef<'div'> & {
+    /** Beam thickness in pixels. */
+    size?: number;
+    /** Full rotation duration in seconds. */
+    duration?: number;
+    /** Beam color. Defaults to the accent token. */
+    color?: string;
+};
+/**
+ * Surface with a light that travels around its border — a premium accent for
+ * upsell cards, active states, and hero panels. The beam is purely decorative
+ * and pauses under `prefers-reduced-motion`.
+ */
+declare function BorderBeam({ size, duration, color, className, style, children, ...props }: BorderBeamProps): react.JSX.Element;
+
+declare const gridColumns: {
+    readonly 2: "sm:grid-cols-2";
+    readonly 3: "sm:grid-cols-2 lg:grid-cols-3";
+    readonly 4: "sm:grid-cols-2 lg:grid-cols-4";
+    readonly 6: "sm:grid-cols-3 lg:grid-cols-6";
+};
+type BentoGridProps = ComponentPropsWithoutRef<'div'> & {
+    columns?: keyof typeof gridColumns;
+};
+/**
+ * Asymmetric "bento" grid for premium dashboard and marketing layouts. Cells
+ * declare their own span via {@link BentoCard}.
+ */
+declare function BentoGrid({ columns, className, children, ...props }: BentoGridProps): react.JSX.Element;
+declare const colSpan: {
+    readonly 1: "sm:col-span-1";
+    readonly 2: "sm:col-span-2";
+    readonly 3: "sm:col-span-3";
+    readonly 4: "sm:col-span-4";
+};
+declare const rowSpan: {
+    readonly 1: "row-span-1";
+    readonly 2: "row-span-2";
+    readonly 3: "row-span-3";
+};
+type BentoCardProps = ComponentPropsWithoutRef<'div'> & {
+    colSpan?: keyof typeof colSpan;
+    rowSpan?: keyof typeof rowSpan;
+    /** Subtle lift + accent border on hover. */
+    interactive?: boolean;
+};
+declare function BentoCard({ colSpan: col, rowSpan: row, interactive, className, children, ...props }: BentoCardProps): react.JSX.Element;
+
+type RippleProps = ComponentPropsWithoutRef<'span'> & {
+    /** Ripple color. Defaults to a translucent current-color tint. */
+    color?: string;
+    disabled?: boolean;
+};
+/**
+ * Wraps interactive content with a material-style click ripple. Decorative and
+ * skipped under `prefers-reduced-motion`. Keep it around buttons, list rows, or
+ * any pressable surface.
+ */
+declare function Ripple({ color, disabled, className, children, onPointerDown, ...props }: RippleProps): react.JSX.Element;
+
+type TiltProps = ComponentPropsWithoutRef<'div'> & {
+    /** Maximum tilt in degrees. */
+    max?: number;
+    /** Scale applied while hovering. */
+    scale?: number;
+};
+/**
+ * 3D pointer-tilt surface for premium feature and pricing cards. Tilt follows
+ * the cursor and resets on leave. Disabled under `prefers-reduced-motion`.
+ */
+declare function Tilt({ max, scale, className, style, children, onPointerMove, onPointerLeave, ...props }: TiltProps): react.JSX.Element;
+
+type Crumb = {
+    label: string;
+    href?: string;
+};
+type PageHeaderProps = {
+    /** Page title shown as the heading. */
+    title: string;
+    /** Supporting text below the title. */
+    description?: string;
+    /** Breadcrumb trail rendered above the title. */
+    breadcrumbs?: Crumb[];
+    /** Action controls pinned to the right of the header. */
+    actions?: ReactNode;
+    /** Extra classes for the header container. */
+    className?: string;
+};
+declare function PageHeader({ title, description, breadcrumbs, actions, className, }: PageHeaderProps): react.JSX.Element;
+
+type PageBodyProps = {
+    children: ReactNode;
+    className?: string;
+};
+declare function PageBody({ children, className }: PageBodyProps): react.JSX.Element;
+
+type PageSectionProps = {
+    title?: string;
+    description?: string;
+    actions?: ReactNode;
+    children: ReactNode;
+    className?: string;
+};
+declare function PageSection({ title, description, actions, children, className, }: PageSectionProps): react.JSX.Element;
+
+type BoxProps = ComponentPropsWithoutRef<'div'> & {
+    as?: ElementType;
+};
+declare function Box({ as: Component, className, ...props }: BoxProps): react.JSX.Element;
+declare const containerSizes: {
+    readonly sm: "max-w-screen-sm";
+    readonly md: "max-w-screen-md";
+    readonly lg: "max-w-screen-lg";
+    readonly xl: "max-w-screen-xl";
+    readonly '2xl': "max-w-screen-2xl";
+    readonly full: "max-w-none";
+};
+type ContainerProps = ComponentPropsWithoutRef<'div'> & {
+    size?: keyof typeof containerSizes;
+};
+declare function Container({ className, size, ...props }: ContainerProps): react.JSX.Element;
+declare const stackDirections: {
+    readonly row: "flex-row";
+    readonly column: "flex-col";
+};
+declare const stackAlign: {
+    readonly start: "items-start";
+    readonly center: "items-center";
+    readonly end: "items-end";
+    readonly stretch: "items-stretch";
+    readonly baseline: "items-baseline";
+};
+declare const stackJustify: {
+    readonly start: "justify-start";
+    readonly center: "justify-center";
+    readonly end: "justify-end";
+    readonly between: "justify-between";
+    readonly around: "justify-around";
+    readonly evenly: "justify-evenly";
+};
+declare const stackGaps: {
+    readonly 0: "gap-0";
+    readonly 1: "gap-1";
+    readonly 2: "gap-2";
+    readonly 3: "gap-3";
+    readonly 4: "gap-4";
+    readonly 5: "gap-5";
+    readonly 6: "gap-6";
+    readonly 8: "gap-8";
+};
+type StackProps = ComponentPropsWithoutRef<'div'> & {
+    /** Cross-axis alignment of children. Defaults to `'stretch'`. */
+    align?: keyof typeof stackAlign;
+    /** Flex direction of the stack. Defaults to `'column'`. */
+    direction?: keyof typeof stackDirections;
+    /** Element rendered between each child as a separator. */
+    divider?: ReactNode;
+    /** Spacing scale between children. Defaults to `3`. */
+    gap?: keyof typeof stackGaps;
+    /** Main-axis distribution of children. Defaults to `'start'`. */
+    justify?: keyof typeof stackJustify;
+    /** Allow children to wrap onto multiple lines. */
+    wrap?: boolean;
+};
+declare function Stack({ align, children, className, direction, divider, gap, justify, wrap, ...props }: StackProps): react.JSX.Element;
+type GridProps = ComponentPropsWithoutRef<'div'> & {
+    /** Fixed column count; ignored when `minChildWidth` is set. */
+    columns?: number;
+    /** Spacing scale between grid cells. */
+    gap?: keyof typeof stackGaps;
+    /** Min cell width (px) for an auto-responsive grid. Overrides `columns`. */
+    minChildWidth?: number;
+};
+declare function Grid({ className, columns, gap, minChildWidth, style, ...props }: GridProps): react.JSX.Element;
+
+type EmptyStateProps = {
+    /** Illustrative leading icon. */
+    icon?: ReactNode;
+    /** Headline describing the empty condition. */
+    title: string;
+    /** Supporting text under the title. */
+    description?: string;
+    /** Primary call-to-action (e.g. a button). */
+    action?: ReactNode;
+    /** Overall scale of the block. */
+    size?: 'sm' | 'md' | 'lg';
+    className?: string;
+};
+declare function EmptyState({ icon, title, description, action, size, className, }: EmptyStateProps): react.JSX.Element;
+
+type ErrorStateProps = {
+    title?: string;
+    message?: string;
+    retry?: ReactNode;
+    className?: string;
+};
+declare function ErrorState({ title, message, retry, className, }: ErrorStateProps): react.JSX.Element;
+
+type LoadingStateProps = {
+    label?: string;
+    className?: string;
+};
+declare function LoadingState({ label, className }: LoadingStateProps): react.JSX.Element;
+type SkeletonRowProps = {
+    rows?: number;
+    className?: string;
+};
+declare function SkeletonRow({ rows, className }: SkeletonRowProps): react.JSX.Element;
+
+type ModalProps = {
+    /** Dialog body content. */
+    children: ReactNode;
+    className?: string;
+    /** Supporting text rendered under the title. */
+    description?: ReactNode;
+    /** Called when the user dismisses the modal (overlay click, Esc, close button). */
+    onClose: () => void;
+    /** Whether the modal is visible. */
+    open: boolean;
+    /** Heading shown at the top of the dialog. */
+    title?: ReactNode;
+};
+declare function Modal({ children, className, description, onClose, open, title }: ModalProps): react.JSX.Element | null;
+
+type DrawerProps = {
+    /** Whether the drawer is open (controlled). */
+    open: boolean;
+    /** Called when the drawer requests to close (backdrop, escape, close button). */
+    onClose: () => void;
+    /** Drawer heading. */
+    title: string;
+    /** Optional supporting text below the title. */
+    description?: string;
+    /** Drawer body content. */
+    children: ReactNode;
+    /** Panel width preset. Defaults to `'md'`. */
+    width?: 'sm' | 'md' | 'lg';
+};
+declare function Drawer({ open, onClose, title, description, children, width }: DrawerProps): react.JSX.Element;
+
+type SheetProps = {
+    open: boolean;
+    onClose: () => void;
+    title: string;
+    children: ReactNode;
+};
+declare function Sheet({ open, onClose, title, children }: SheetProps): react.JSX.Element;
+
+type ConfirmDialogProps = {
+    /** Whether the dialog is visible (controlled). */
+    open: boolean;
+    /** Called when the dialog is dismissed or cancelled. */
+    onClose: () => void;
+    /** Called when the user confirms the action. */
+    onConfirm: () => void;
+    /** Dialog heading. */
+    title: string;
+    /** Body text explaining the consequence of confirming. */
+    description: string;
+    /** Label for the confirm button. Defaults to `'Confirm'`. */
+    confirmLabel?: string;
+    /** Label for the cancel button. Defaults to `'Cancel'`. */
+    cancelLabel?: string;
+    /** When set, user must type this value to enable the confirm button. */
+    typeToConfirm?: string;
+    /** Styles the confirm button as a destructive action. */
+    destructive?: boolean;
+};
+declare function ConfirmDialog({ open, onClose, onConfirm, title, description, confirmLabel, cancelLabel, typeToConfirm, destructive, }: ConfirmDialogProps): react.JSX.Element;
+
+type UseDialogControlsOptions = {
+    defaultOpen?: boolean;
+    onOpen?: () => void;
+    onClose?: () => void;
+};
+declare function useDialogControls(options?: UseDialogControlsOptions): {
+    dialogProps: {
+        onClose: () => void;
+        open: boolean;
+    };
+    triggerProps: {
+        'aria-expanded': boolean;
+        onClick: () => void;
+        type: "button";
+    };
+    isOpen: boolean;
+    open: () => void;
+    close: () => void;
+    toggle: () => void;
+};
+
+type ExportColumn<T> = {
+    key: keyof T & string;
+    header?: string;
+    value?: (row: T) => unknown;
+    format?: (value: unknown, row: T) => string;
+};
+
+type FilterFieldType = 'string' | 'number' | 'date' | 'enum' | 'boolean';
+type FilterOperator = 'eq' | 'neq' | 'contains' | 'notContains' | 'startsWith' | 'endsWith' | 'in' | 'notIn' | 'gt' | 'gte' | 'lt' | 'lte' | 'between' | 'before' | 'after' | 'relative' | 'is' | 'isEmpty' | 'isNotEmpty';
+type FilterFieldOption = {
+    label: string;
+    value: string | number;
+};
+type FilterFieldDef<TRow = unknown> = {
+    id: string;
+    label: string;
+    type: FilterFieldType;
+    accessor?: (row: TRow) => unknown;
+    options?: FilterFieldOption[];
+    operators?: FilterOperator[];
+    format?: (v: unknown) => string;
+};
+type FilterCondition = {
+    id: string;
+    field: string;
+    op: FilterOperator;
+    value: unknown;
+};
+type FilterCombinator = 'AND' | 'OR';
+type FilterGroup = {
+    id: string;
+    combinator: FilterCombinator;
+    conditions: Array<FilterCondition | FilterGroup>;
+};
+type FilterState = {
+    root: FilterGroup;
+};
+type FilterMode = 'client' | 'server';
+type FilterDialect = 'rest' | 'rsql' | 'graphql-where';
+type SavedView = {
+    id: string;
+    name: string;
+    state: FilterState;
+    pinned?: boolean;
+    createdAt: string;
+};
+
+type ExportFormat = 'csv' | 'xlsx' | 'json' | 'pdf';
+type ExportToolbarProps<T extends object> = {
+    /** Rows to export. */
+    data: T[];
+    /** Base filename (without extension) for the downloaded file. */
+    filename: string;
+    /** Export formats to offer (e.g. CSV, JSON). */
+    formats: ExportFormat[];
+    /** Column definitions controlling which fields and headers are exported. */
+    columns: ExportColumn<T>[];
+};
+declare function ExportToolbar<T extends object>({ data, filename, formats, columns, }: ExportToolbarProps<T>): react.JSX.Element;
+
+type DataTableFilters<TData extends object> = {
+    fields: FilterFieldDef<TData>[];
+    mode: FilterMode;
+    urlKey?: string;
+    dialect?: FilterDialect;
+    onServerQueryChange?: (params: URLSearchParams) => void;
+};
+type DataTableProps<TData extends object> = {
+    /** Row data. */
+    data: TData[];
+    /** TanStack Table column definitions. */
+    columns: ColumnDef<TData, unknown>[];
+    /** Show a loading skeleton instead of rows. */
+    isLoading?: boolean;
+    /** Heading for the empty state. */
+    emptyTitle?: string;
+    /** Description for the empty state. */
+    emptyDescription?: string | undefined;
+    /** Row height/padding density. */
+    density?: 'comfortable' | 'compact';
+    /** When set, table renders a checkbox column and reports row selection. */
+    enableRowSelection?: boolean;
+    /** Called with the selected rows when selection changes. */
+    onRowSelectionChange?: (rows: TData[]) => void;
+    /** Called when a row is clicked. */
+    onRowClick?: (row: TData) => void;
+    /** Controlled global search term. */
+    globalFilter?: string;
+    /** Rows per page; enables pagination when set. */
+    pageSize?: number;
+    /** Custom toolbar rendered above the table. */
+    toolbar?: ReactNode;
+    exportable?: {
+        columns?: ExportColumn<TData>[];
+        filename?: string;
+        formats?: ExportFormat[];
+        scope?: 'visible' | 'all' | 'selected';
+    };
+    filters?: DataTableFilters<TData>;
+    className?: string;
+};
+declare function DataTable<TData extends object>(props: DataTableProps<TData>): react.JSX.Element;
+
+/**
+ * Tiny CSV exporter — no third-party dep.
+ */
+declare function toCsv<T extends object>(rows: T[], columns: ExportColumn<T>[] | (keyof T & string)[]): string;
+declare function downloadCsv(filename: string, csv: string): void;
+
+type TableToolbarProps = {
+    /** Built-in search box config; omit to hide the search input. */
+    search?: {
+        value: string;
+        onChange: (value: string) => void;
+        placeholder?: string;
+    };
+    /** Filter controls rendered in the toolbar's filter slot. */
+    filters?: ReactNode;
+    /** Bulk-action controls shown when rows are selected. */
+    bulkActions?: ReactNode;
+    /** Column visibility toggle control. */
+    columnsToggle?: ReactNode;
+    /** Arbitrary content pinned to the right edge of the toolbar. */
+    rightSlot?: ReactNode;
+};
+declare function TableToolbar({ search, filters, bulkActions, columnsToggle, rightSlot, }: TableToolbarProps): react.JSX.Element;
+
+type UseFiltersOptions<TRow> = {
+    fields: FilterFieldDef<TRow>[];
+    mode: FilterMode;
+    defaultState?: FilterState;
+    urlKey?: string;
+    dialect?: FilterDialect;
+    onChange?: (state: FilterState) => void;
+};
+type FilterChip = {
+    id: string;
+    label: string;
+    onRemove: () => void;
+};
+type UseFiltersReturn<TRow> = {
+    state: FilterState;
+    setState: (next: FilterState | ((prev: FilterState) => FilterState)) => void;
+    addCondition: (field: string) => void;
+    updateCondition: (id: string, patch: Partial<Omit<FilterCondition, 'id'>>) => void;
+    removeCondition: (id: string) => void;
+    clear: () => void;
+    predicate: (row: TRow) => boolean;
+    filter: (rows: TRow[]) => TRow[];
+    queryParams: URLSearchParams;
+    queryString: string;
+    chips: FilterChip[];
+    activeCount: number;
+    encodedUrl: string;
+    fields: FilterFieldDef<TRow>[];
+    mode: FilterMode;
+};
+declare function useFilters<TRow>(opts: UseFiltersOptions<TRow>): UseFiltersReturn<TRow>;
+
+type FiltersProviderProps<TRow> = {
+    value: UseFiltersReturn<TRow>;
+    children: ReactNode;
+};
+declare function FiltersProvider<TRow>({ value, children }: FiltersProviderProps<TRow>): react.JSX.Element;
+declare function useFiltersContext<TRow = unknown>(): UseFiltersReturn<TRow>;
+declare function useOptionalFiltersContext<TRow = unknown>(): UseFiltersReturn<TRow> | null;
+
+type FilterBarProps = {
+    /** Extra classes for the filter bar container. */
+    className?: string;
+    /** Saved-views control rendered in the bar. */
+    savedViews?: ReactNode;
+    /** Label for the add-filter control. */
+    addLabel?: string;
+    /** Label for the clear-filters control. */
+    clearLabel?: string;
+};
+declare function FilterBar({ className, savedViews, addLabel, clearLabel, }: FilterBarProps): react.JSX.Element;
+
+type FilterBuilderProps<TRow = unknown> = {
+    /** The single filter condition being edited. */
+    condition: FilterCondition;
+    /** Available fields the condition can target, with their operators/types. */
+    fields: FilterFieldDef<TRow>[];
+    /** Called with the condition id and a partial patch when any part changes. */
+    onChange: (id: string, patch: Partial<Omit<FilterCondition, 'id'>>) => void;
+    /** Called with the condition id when the user removes it. */
+    onRemove: (id: string) => void;
+};
+declare const defaultValueForOperator: <TRow>(op: FilterOperator, field?: FilterFieldDef<TRow>) => unknown;
+declare function FilterBuilder<TRow = unknown>({ condition, fields, onChange, onRemove, }: FilterBuilderProps<TRow>): react.JSX.Element | null;
+
+type FilterGroupEditorProps<TRow = unknown> = {
+    fields?: FilterFieldDef<TRow>[];
+    maxDepth?: number;
+};
+
+declare function FilterGroupEditor(props: FilterGroupEditorProps): react.JSX.Element;
+
+type FilterPopoverProps = {
+    /** Trigger button label. */
+    label: string;
+    /** Number of active filters; shown as a badge on the trigger. */
+    activeCount?: number;
+    /** Called when the apply button is pressed. */
+    onApply?: () => void;
+    /** Called when the clear button is pressed. */
+    onClear?: () => void;
+    /** Filter controls rendered inside the popover. */
+    children: ReactNode;
+    /** Leading icon on the trigger. */
+    icon?: ReactNode;
+    /** Label for the apply button. */
+    applyLabel?: string;
+    /** Label for the clear button. */
+    clearLabel?: string;
+};
+declare function FilterPopover({ label, activeCount, onApply, onClear, children, icon, applyLabel, clearLabel, }: FilterPopoverProps): react.JSX.Element;
+
+type FacetOption<T = string> = {
+    value: T;
+    label: string;
+    count?: number;
+};
+type FacetedFilterProps<T = string> = {
+    /** Filter label shown on the trigger. */
+    label: string;
+    /** Selectable facet options, optionally with counts. */
+    options: FacetOption<T>[];
+    /** Currently selected option values. */
+    value: T[];
+    /** Called with the new selection array. */
+    onChange: (value: T[]) => void;
+    /** Render inline instead of inside a popover. */
+    inline?: boolean;
+    /** Show a search box above the options. */
+    showSearch?: boolean;
+    /** Placeholder for the option search box. */
+    searchPlaceholder?: string;
+};
+declare function FacetedFilter<T = string>({ label, options, value, onChange, inline, showSearch, searchPlaceholder, }: FacetedFilterProps<T>): react.JSX.Element;
+
+type DateRangeFilterProps = {
+    /** Filter label shown on the trigger. */
+    label: string;
+    /** Selected range ({ from, to }). */
+    value: DateRange;
+    /** Called with the new range. */
+    onChange: (value: DateRange) => void;
+    /** Render inline instead of inside a popover. */
+    inline?: boolean;
+    /** Called when the filter is cleared; omit to hide the clear control. */
+    onClear?: () => void;
+    /** Placeholder when no range is set. */
+    placeholder?: string;
+};
+declare function DateRangeFilter({ label, value, onChange, inline, onClear, placeholder, }: DateRangeFilterProps): react.JSX.Element;
+
+type RangeFilterProps = {
+    /** Filter label shown on the trigger. */
+    label: string;
+    /** Selected [min, max] range. */
+    value: [number, number];
+    /** Called with the new [min, max] tuple. */
+    onChange: (value: [number, number]) => void;
+    /** Lower bound of the slider. */
+    min: number;
+    /** Upper bound of the slider. */
+    max: number;
+    /** Step increment. */
+    step?: number;
+    /** Render inline instead of inside a popover. */
+    inline?: boolean;
+};
+declare function RangeFilter({ label, value, onChange, min, max, step, inline, }: RangeFilterProps): react.JSX.Element;
+
+type SearchFilterProps = {
+    /** Current search text (controlled). */
+    value: string;
+    /** Called on every keystroke with the raw input value. */
+    onChange: (value: string) => void;
+    /** Called with the value after `debounceMs` of inactivity. */
+    onDebouncedChange?: (value: string) => void;
+    /** Debounce window in ms for `onDebouncedChange`. */
+    debounceMs?: number;
+    /** Placeholder text for the search input. */
+    placeholder?: string;
+    /** Extra classes for the input wrapper. */
+    className?: string;
+};
+declare function SearchFilter({ value, onChange, onDebouncedChange, debounceMs, placeholder, className, }: SearchFilterProps): react.JSX.Element;
+
+type FilterChipsProps = {
+    /** Active filter chips to display, each removable. */
+    chips: FilterChip[];
+    /** Called when the user clears all chips at once. */
+    onClearAll?: () => void;
+    /** Label for the clear-all control. */
+    clearAllLabel?: string;
+};
+declare function FilterChips({ chips, onClearAll, clearAllLabel }: FilterChipsProps): react.JSX.Element | null;
+
+type ColumnsToggleProps<TData> = {
+    table: Table$1<TData>;
+    label?: string;
+};
+declare function ColumnsToggle<TData>({ table, label }: ColumnsToggleProps<TData>): react.JSX.Element;
+
+type SavedViewsStorage = {
+    load: () => Promise<SavedView[]>;
+    save: (views: SavedView[]) => Promise<void>;
+};
+type LegacySavedView = {
+    id: string;
+    label: string;
+    filters: unknown;
+};
+type ContextSavedViewsProps = {
+    /** Query-string key the active view serializes filters into. */
+    urlKey: string;
+    /** Storage adapter for persisting saved views. Defaults to localStorage. */
+    storage?: SavedViewsStorage;
+    /** Label for the save-view action. */
+    saveLabel?: string;
+    /** Label for the update-current-view action. */
+    updateLabel?: string;
+    /** Label for the share-view action. */
+    shareLabel?: string;
+    /** Called with a shareable URL when the user shares a view. */
+    onShare?: (url: string) => void;
+    /** Extra classes for the container. */
+    className?: string;
+};
+type LegacySavedViewsProps = {
+    /** Storage key used to persist views (legacy controlled mode). */
+    storageKey: string;
+    /** Id of the active saved view, or null (controlled). */
+    value: string | null;
+    /** Called with the selected view (or null when cleared). */
+    onChange: (view: LegacySavedView | null) => void;
+    /** Current filter state captured when saving a new view. */
+    currentFilters: unknown;
+    /** Label for the save-view action. */
+    saveLabel?: string;
+    /** Placeholder for the view selector. */
+    placeholder?: string;
+};
+type SavedViewsProps = ContextSavedViewsProps | LegacySavedViewsProps;
+declare function SavedViews(props: SavedViewsProps): react.JSX.Element;
+
+type SingleProps$1 = {
+    /** Single-date selection mode (default). */
+    mode?: 'single';
+    /** Selected date, or `undefined` when empty (controlled). */
+    value: Date | undefined;
+    /** Called with the newly selected date. */
+    onChange: (date: Date | undefined) => void;
+    /** Field label shown above the input. */
+    label?: string;
+    /** Placeholder text when no date is selected. */
+    placeholder?: string;
+    /** Extra classes for the field wrapper. */
+    className?: string;
+};
+type RangeProps$1 = {
+    /** Date-range selection mode. */
+    mode: 'range';
+    /** Selected start/end range, or `undefined` when empty (controlled). */
+    value: DateRange | undefined;
+    /** Called with the newly selected range. */
+    onChange: (range: DateRange | undefined) => void;
+    /** Field label shown above the input. */
+    label?: string;
+    /** Placeholder text when no range is selected. */
+    placeholder?: string;
+    /** Extra classes for the field wrapper. */
+    className?: string;
+};
+type DatePickerProps = SingleProps$1 | RangeProps$1;
+declare function DatePicker(props: DatePickerProps): react.JSX.Element;
+
+type DateRangePickerProps = {
+    /** Selected range ({ from, to }). */
+    value: DateRange;
+    /** Called with the new range on selection. */
+    onChange: (value: DateRange) => void;
+    /** Quick-select preset ranges shown beside the calendar. */
+    presets?: {
+        label: string;
+        range: DateRange;
+    }[];
+    /** Earliest selectable date. */
+    minDate?: Date;
+    /** Latest selectable date. */
+    maxDate?: Date;
+    /** Placeholder for the trigger input when empty. */
+    placeholder?: string;
+    /** date-fns locale for labels and formatting. */
+    locale?: Locale;
+    className?: string;
+    /** Render the calendar inline instead of in a popover. */
+    inline?: boolean;
+};
+declare function DateRangePicker({ value, onChange, presets, minDate, maxDate, placeholder, locale, className, inline, }: DateRangePickerProps): react.JSX.Element;
+
+type SingleProps = {
+    /** Single-date selection mode (default). */
+    mode?: 'single';
+    /** Selected date, or `undefined` when empty (controlled). */
+    value: Date | undefined;
+    /** Called with the newly selected date. */
+    onChange: (date: Date | undefined) => void;
+    /** Number of months rendered side by side. Defaults to `2`. */
+    months?: number;
+    /** Extra classes for the calendar container. */
+    className?: string;
+};
+type RangeProps = {
+    /** Date-range selection mode. */
+    mode: 'range';
+    /** Selected start/end range, or `undefined` when empty (controlled). */
+    value: DateRange | undefined;
+    /** Called with the newly selected range. */
+    onChange: (range: DateRange | undefined) => void;
+    /** Number of months rendered side by side. Defaults to `2`. */
+    months?: number;
+    /** Extra classes for the calendar container. */
+    className?: string;
+};
+type MultiViewCalendarProps = SingleProps | RangeProps;
+/**
+ * Inline calendar showing multiple months side by side. Unlike DatePicker this
+ * renders directly in the page (no popover) — for range dashboards, booking
+ * flows, and availability views.
+ */
+declare function MultiViewCalendar(props: MultiViewCalendarProps): react.JSX.Element;
+
+type Step = {
+    id: string;
+    label: string;
+    description?: string;
+};
+type StepperProps = {
+    /** Ordered steps to render. */
+    steps: Step[];
+    /** Zero-based index of the active step. */
+    current: number;
+    /** Called with the step index when a step is clicked. */
+    onStepClick?: (index: number) => void;
+    /** Layout direction. Defaults to `'horizontal'`. */
+    orientation?: 'horizontal' | 'vertical';
+    /** Extra classes for the stepper container. */
+    className?: string;
+};
+declare function Stepper({ steps, current, onStepClick, orientation, className, }: StepperProps): react.JSX.Element;
+
+type TimelineItem = {
+    id: string;
+    title: string;
+    description?: string;
+    timestamp?: string | undefined;
+    tone?: string;
+    icon?: ReactNode;
+};
+type TimelineProps = {
+    items: TimelineItem[];
+    orientation?: 'vertical' | 'horizontal';
+    className?: string;
+};
+declare function Timeline({ items, orientation, className }: TimelineProps): react.JSX.Element;
+
+type SliderValueChange = {
+    bivarianceHack(value: number[]): void;
+}['bivarianceHack'];
+type SliderProps = {
+    /** Current thumb value(s). One entry per thumb. */
+    value: number[];
+    /** Called with the updated value array as thumbs move. */
+    onValueChange: SliderValueChange;
+    /** Minimum value. Defaults to 0. */
+    min?: number;
+    /** Maximum value. Defaults to 100. */
+    max?: number;
+    /** Step increment. Defaults to 1. */
+    step?: number;
+    /** Visible label above the track. */
+    label?: string;
+    className?: string;
+    /** Format a raw value for display (e.g. add a "$"). */
+    formatValue?: (n: number) => string;
+};
+declare function Slider({ value, onValueChange, min, max, step, label, className, formatValue, }: SliderProps): react.JSX.Element;
+
+type RangeSliderProps = {
+    /** Current [start, end] values. */
+    value: [number, number];
+    /** Called with the new [start, end] tuple as either thumb moves. */
+    onValueChange: (value: [number, number]) => void;
+    /** Lower bound of the track. Defaults to 0. */
+    min?: number;
+    /** Upper bound of the track. Defaults to 100. */
+    max?: number;
+    /** Step increment between values. */
+    step?: number;
+    /** Minimum number of steps to keep between the two thumbs. */
+    minStepsBetweenThumbs?: number;
+    /** Visible label above the slider. */
+    label?: string;
+    className?: string;
+    /** Format thumb/value captions (e.g. add a unit or currency). */
+    formatValue?: (n: number) => string;
+};
+declare function RangeSlider({ value, onValueChange, min, max, step, minStepsBetweenThumbs, label, className, formatValue, }: RangeSliderProps): react.JSX.Element;
+
+declare function TopProgressBar(): react.JSX.Element | null;
+
+type ScrollbarProps = OverlayScrollbarsComponentProps & {
+    className?: string;
+};
+declare function Scrollbar({ className, ...rest }: ScrollbarProps): react.JSX.Element;
+
+type EditorProps = {
+    /** Editor content as an HTML string (controlled). */
+    value: string;
+    /** Called with the updated HTML on every change. */
+    onChange: (html: string) => void;
+    /** Placeholder shown while the editor is empty. */
+    placeholder?: string;
+    /** Extra classes for the editor wrapper. */
+    className?: string;
+};
+declare function Editor({ value, onChange, placeholder, className }: EditorProps): react.JSX.Element | null;
+
+type FileUploadProps = Omit<DropzoneOptions, 'onDrop'> & {
+    onFiles: (files: File[]) => void;
+    activeLabel?: string;
+    ariaLabel?: string;
+    hint?: string;
+    label?: string;
+    className?: string;
+};
+declare function FileUpload({ onFiles, activeLabel, ariaLabel, hint, label, className, ...dropzone }: FileUploadProps): react.JSX.Element;
+
+type FileItemStatus = 'idle' | 'uploading' | 'success' | 'error';
+type FileItemProps = {
+    /** File name shown as the primary label. */
+    name: string;
+    /** Size in bytes. Rendered as a human-readable label. */
+    size?: number;
+    /** Current upload state — drives the status icon and styling. */
+    status?: FileItemStatus;
+    /** Upload progress 0–100. Shown as a thin bar when `status` is `uploading`. */
+    progress?: number;
+    /** Error message shown when `status` is `error`. */
+    error?: string;
+    /** Leading icon; defaults to a file-type glyph. */
+    icon?: ReactNode;
+    /** Called when the remove button is clicked. Omit to hide it. */
+    onRemove?: () => void;
+    /** Called when the retry button is clicked (shown on error). */
+    onRetry?: () => void;
+    /** Extra classes for the row container. */
+    className?: string;
+};
+/**
+ * Reusable file row with name, size, progress, status, and remove/retry
+ * actions. Transport-free — the parent owns upload state and callbacks.
+ */
+declare function FileItem({ name, size, status, progress, error, icon, onRemove, onRetry, className, }: FileItemProps): react.JSX.Element;
+
+type ColorPickerProps = {
+    /** Selected color as a hex string (controlled). */
+    value: string;
+    /** Called with the new hex value when the color changes. */
+    onChange: (hex: string) => void;
+    /** Swatch presets shown for quick selection. Falls back to a default palette. */
+    presets?: string[];
+    /** Field label shown above the picker. */
+    label?: string;
+    /** Extra classes for the picker container. */
+    className?: string;
+};
+declare function ColorPicker({ value, onChange, presets, label, className, }: ColorPickerProps): react.JSX.Element;
+
+type CarouselProps = {
+    /** Slides to render, one per child. */
+    children: ReactNode[];
+    /** Embla carousel options (loop, align, drag, etc.). */
+    options?: Parameters<typeof useEmblaCarousel>[0];
+    /** Extra classes for the carousel container. */
+    className?: string;
+    /** Show the dot pagination indicators. */
+    showDots?: boolean;
+    /** Show the previous/next arrow controls. */
+    showArrows?: boolean;
+};
+declare function Carousel({ children, options, className, showDots, showArrows, }: CarouselProps): react.JSX.Element;
+
+type ImageLightboxProps = {
+    /** Whether the lightbox is open (controlled). */
+    open: boolean;
+    /** Called when the lightbox is dismissed. */
+    onClose: () => void;
+    /** Images to display in the gallery. */
+    slides: SlideImage[];
+    /** Zero-based index of the slide shown first. Defaults to `0`. */
+    startIndex?: number;
+};
+declare function ImageLightbox({ open, onClose, slides, startIndex }: ImageLightboxProps): react.JSX.Element;
+
+type ImagePreviewStatus = 'idle' | 'uploading' | 'error';
+type ImagePreviewProps = {
+    /** Image source URL or object URL. */
+    src: string;
+    /** Alt text for the thumbnail. */
+    alt?: string;
+    /** Optional file name shown as a caption/overlay. */
+    name?: string;
+    /** Current upload state — drives the overlay and styling. */
+    status?: ImagePreviewStatus;
+    /** Upload progress 0–100, shown over the thumbnail while `uploading`. */
+    progress?: number;
+    /** Called when the remove button is clicked. Omit to hide it. */
+    onRemove?: () => void;
+    /** Called when the retry button is clicked (shown on error). */
+    onRetry?: () => void;
+    /** Square edge length. Number → px, string → raw CSS size. */
+    size?: number | string;
+    /** Extra classes for the tile container. */
+    className?: string;
+};
+/**
+ * Single image preview tile with remove and retry actions plus uploading/error
+ * overlays. Transport-free — the parent owns the object URL and callbacks.
+ */
+declare function ImagePreview({ src, alt, name, status, progress, onRemove, onRetry, size, className, }: ImagePreviewProps): react.JSX.Element;
+
+type MarkdownProps = {
+    children: string;
+    className?: string;
+};
+declare function Markdown({ children, className }: MarkdownProps): react.JSX.Element;
+
+type TreeNode = {
+    id: string;
+    label: ReactNode;
+    icon?: ReactNode;
+    children?: TreeNode[];
+};
+type TreeViewProps = {
+    /** Hierarchical nodes to render. */
+    nodes: TreeNode[];
+    /** Ids of branches expanded on first render. */
+    defaultExpandedIds?: string[];
+    /** Called with the node id when a node is selected. */
+    onSelect?: (id: string) => void;
+    /** Extra classes for the tree container. */
+    className?: string;
+};
+declare function TreeView({ nodes, defaultExpandedIds, onSelect, className }: TreeViewProps): react.JSX.Element;
+
+type PlayerProps = {
+    /** Media source URL. */
+    src: string;
+    /** Poster image shown before playback. */
+    poster?: string;
+    /** Show native playback controls. Defaults to `true`. */
+    controls?: boolean;
+    /** Extra classes for the player element. */
+    className?: string;
+};
+declare function Player({ src, poster, controls, className }: PlayerProps): react.JSX.Element;
+
+type MegamenuColumn = {
+    heading?: string;
+    items: {
+        label: string;
+        description?: string;
+        href: string;
+        icon?: ReactNode;
+    }[];
+};
+type MegamenuProps = {
+    /** Text label for the menu trigger. */
+    trigger: string;
+    /** Column groups of links shown in the open panel. */
+    columns: MegamenuColumn[];
+    /** Optional footer content below the columns. */
+    footer?: ReactNode;
+    /** Extra classes for the menu container. */
+    className?: string;
+};
+declare function Megamenu({ trigger, columns, footer, className }: MegamenuProps): react.JSX.Element;
+
+declare const PRESETS: {
+    readonly fadeIn: {
+        readonly initial: {
+            readonly opacity: 0;
+        };
+        readonly animate: {
+            readonly opacity: 1;
+        };
+        readonly exit: {
+            readonly opacity: 0;
+        };
+    };
+    readonly fadeInUp: {
+        readonly initial: {
+            readonly opacity: 0;
+            readonly y: 12;
+        };
+        readonly animate: {
+            readonly opacity: 1;
+            readonly y: 0;
+        };
+        readonly exit: {
+            readonly opacity: 0;
+            readonly y: -12;
+        };
+    };
+    readonly scaleIn: {
+        readonly initial: {
+            readonly opacity: 0;
+            readonly scale: 0.96;
+        };
+        readonly animate: {
+            readonly opacity: 1;
+            readonly scale: 1;
+        };
+        readonly exit: {
+            readonly opacity: 0;
+            readonly scale: 0.96;
+        };
+    };
+    readonly slideInRight: {
+        readonly initial: {
+            readonly opacity: 0;
+            readonly x: 24;
+        };
+        readonly animate: {
+            readonly opacity: 1;
+            readonly x: 0;
+        };
+        readonly exit: {
+            readonly opacity: 0;
+            readonly x: -24;
+        };
+    };
+};
+type MotionPresetName = keyof typeof PRESETS;
+type MotionPresetProps = HTMLMotionProps<'div'> & {
+    /** Named animation preset (fadeIn, slideUp, …). Defaults to "fadeIn". */
+    preset?: MotionPresetName;
+    /** Animation duration in seconds. Defaults to 0.25. */
+    duration?: number;
+};
+declare function MotionPreset({ preset, duration, ...rest }: MotionPresetProps): react.JSX.Element;
+
+type ImageCropperProps = {
+    /** Source image URL or object URL to crop. */
+    src: string;
+    /** Fixed crop aspect ratio (width / height); free-form when omitted. */
+    aspect?: number;
+    /** Called with the cropped image as a `Blob` when the user confirms. */
+    onCrop: (blob: Blob) => void;
+    /** Label for the confirm/crop button. */
+    cropLabel?: string;
+};
+declare function ImageCropper({ src, aspect, onCrop, cropLabel }: ImageCropperProps): react.JSX.Element;
+
+type SignaturePadProps = {
+    /** Called with a PNG data URL whenever the signature changes. */
+    onChange: (dataUrl: string) => void;
+    /** Label for the clear button. */
+    clearLabel?: string;
+};
+declare function SignaturePad({ onChange, clearLabel }: SignaturePadProps): react.JSX.Element;
+
+type SortableListProps<T extends {
+    id: string;
+}> = {
+    /** Items to render; each must have a stable `id`. */
+    items: T[];
+    /** Called with the reordered array after a drag completes. */
+    onChange: (items: T[]) => void;
+    /** Renders a single item. */
+    renderItem: (item: T) => ReactNode;
+};
+declare function SortableList<T extends {
+    id: string;
+}>({ items, onChange, renderItem, }: SortableListProps<T>): react.JSX.Element;
+
+interface SplitButtonAction {
+    label: string;
+    onSelect: () => void;
+    disabled?: boolean;
+}
+interface SplitButtonProps extends Omit<ButtonProps, 'children'> {
+    /** Label for the primary (left) button. */
+    label: ReactNode;
+    /** Secondary actions shown in the attached dropdown. */
+    actions: SplitButtonAction[];
+}
+declare function SplitButton({ label, actions, onClick, variant, size, ...props }: SplitButtonProps): react.JSX.Element;
+
+interface TransferListItem {
+    value: string;
+    label: string;
+    disabled?: boolean;
+}
+interface TransferListProps {
+    /** All transferable items across both panes. */
+    items: TransferListItem[];
+    /** Ids of items currently in the selected pane (controlled). */
+    value: string[];
+    /** Called with the next array of selected ids when items move. */
+    onChange: (value: string[]) => void;
+    /** Heading for the available (left) pane. */
+    availableLabel?: string;
+    /** Heading for the selected (right) pane. */
+    selectedLabel?: string;
+    /** Extra classes for the component wrapper. */
+    className?: string;
+}
+declare function TransferList({ items, value, onChange, availableLabel, selectedLabel, className, }: TransferListProps): react.JSX.Element;
+
+interface InfiniteScrollProps {
+    /** Whether more items remain to load. */
+    hasMore: boolean;
+    /** True while a load is in flight — suppresses duplicate `onLoadMore` calls. */
+    isLoading?: boolean;
+    /** Called when the sentinel scrolls into view and more items are available. */
+    onLoadMore: () => void;
+    /** The already-loaded content. */
+    children: ReactNode;
+    /** Node shown while loading the next page. */
+    loader?: ReactNode;
+    /** Node shown once all items are loaded. */
+    end?: ReactNode;
+    /** Extra classes for the scroll container. */
+    className?: string;
+}
+declare function InfiniteScroll({ hasMore, isLoading, onLoadMore, children, loader, end, className, }: InfiniteScrollProps): react.JSX.Element;
+
+interface VirtualListProps<T> {
+    /** Items to virtualize; only the visible window is rendered. */
+    items: T[];
+    /** Estimated row height in px, used before measurement. Defaults to `44`. */
+    estimateSize?: number;
+    /** Height of the scroll viewport (px or CSS length). */
+    height?: number | string;
+    /** Renders a single item for the given index. */
+    renderItem: (item: T, index: number) => ReactNode;
+    /** Extra classes for the scroll container. */
+    className?: string;
+}
+declare function VirtualList<T>({ items, estimateSize, height, renderItem, className, }: VirtualListProps<T>): react.JSX.Element;
+
+interface OnboardingTourProps {
+    /** Ordered tour steps, each targeting an element with content. */
+    steps: DriveStep[];
+    /** Start the tour when true; stops/resets when false. */
+    run?: boolean;
+    /** Driver.js config overrides (animation, labels, behavior). */
+    options?: Config;
+    /** Called when the tour is closed or completed. */
+    onClose?: () => void;
+}
+declare function OnboardingTour({ steps, run, options, onClose }: OnboardingTourProps): null;
+
+type AspectRatioProps = ComponentPropsWithoutRef<typeof AspectRatioPrimitive.Root>;
+declare function AspectRatio({ className, ...props }: AspectRatioProps): react.JSX.Element;
+
+type ImageListProps = ComponentPropsWithoutRef<'div'> & {
+    cols?: number;
+    gap?: number;
+};
+declare function ImageList({ className, cols, gap, style, ...props }: ImageListProps): react.JSX.Element;
+type ImageListItemProps = ComponentPropsWithoutRef<'figure'> & {
+    caption?: string;
+};
+declare function ImageListItem({ caption, children, className, ...props }: ImageListItemProps): react.JSX.Element;
+
+type MasonryProps = ComponentPropsWithoutRef<'div'> & {
+    columns?: number;
+    gap?: number;
+};
+declare function Masonry({ children, className, columns, gap, style, ...props }: MasonryProps): react.JSX.Element;
+declare function MasonryItem({ className, ...props }: ComponentPropsWithoutRef<'div'>): react.JSX.Element;
+
+type FloatingActionButtonProps = ButtonProps & {
+    /** Fixed corner the button is anchored to. */
+    placement?: 'bottom-right' | 'bottom-left' | 'top-right' | 'top-left';
+};
+declare const FloatingActionButton: react.ForwardRefExoticComponent<Omit<react.DetailedHTMLProps<react.ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "ref"> & class_variance_authority.VariantProps<(props?: ({
+    variant?: "primary" | "secondary" | "outline" | "ghost" | "soft" | "danger" | "success" | null | undefined;
+    size?: "xs" | "sm" | "md" | "lg" | "icon" | "icon-sm" | null | undefined;
+} & class_variance_authority_types.ClassProp) | undefined) => string> & {
+    isLoading?: boolean;
+} & {
+    /** Fixed corner the button is anchored to. */
+    placement?: "bottom-right" | "bottom-left" | "top-right" | "top-left";
+} & react.RefAttributes<HTMLButtonElement>>;
+
+interface KanbanCardItem {
+    id: string;
+    columnId: string;
+    content: ReactNode;
+}
+interface KanbanColumnItem {
+    id: string;
+    title: ReactNode;
+}
+interface KanbanBoardProps {
+    /** Column definitions in display order. */
+    columns: KanbanColumnItem[];
+    /** Cards, each referencing its column by id. */
+    cards: KanbanCardItem[];
+    /** Called when a card is dragged to a new column. */
+    onMoveCard?: (cardId: string, columnId: string) => void;
+    className?: string;
+}
+declare function KanbanBoard({ columns, cards, onMoveCard, className }: KanbanBoardProps): react.JSX.Element;
+
+type CodeEditorLanguage = 'javascript' | 'typescript' | 'python' | 'css' | 'html' | 'json' | 'markdown';
+type CodeEditorProps = {
+    /** Current editor contents. */
+    value: string;
+    /** Called with the new contents on edit. */
+    onChange?: (value: string) => void;
+    /** Language for syntax highlighting. */
+    language?: CodeEditorLanguage;
+    /** Render read-only (no editing). */
+    readOnly?: boolean;
+    /** Fixed height (CSS length). */
+    height?: string;
+    /** Minimum height when auto-growing. */
+    minHeight?: string;
+    /** Colour theme; `auto` follows the app theme. */
+    theme?: 'light' | 'dark' | 'auto';
+    /** Show the line-number gutter. */
+    lineNumbers?: boolean;
+    /** Placeholder shown when empty. */
+    placeholder?: string;
+    className?: string;
+};
+declare function CodeEditor({ value, onChange, language, readOnly, height, minHeight, theme, lineNumbers, placeholder, className, }: CodeEditorProps): react.JSX.Element;
+
+type DataGridColumn<TData extends object> = ColumnDef<TData, unknown>;
+type DataGridFilters<TData extends object> = {
+    fields: FilterFieldDef<TData>[];
+    mode: FilterMode;
+    urlKey?: string;
+    dialect?: FilterDialect;
+    onServerQueryChange?: (params: URLSearchParams) => void;
+};
+type DataGridProps<TData extends object> = {
+    /** Row data. */
+    data: TData[];
+    /** Column definitions. */
+    columns: DataGridColumn<TData>[];
+    /** Column accessorKey/id values that allow double-click inline editing. */
+    editableColumns?: string[];
+    /** Called when an editable cell is committed. */
+    onCellChange?: (rowIndex: number, columnId: string, value: string) => void;
+    /** Row height/padding density. */
+    density?: 'comfortable' | 'compact';
+    /** Controlled global search term. */
+    globalFilter?: string;
+    /** Rows per page; enables pagination when set. */
+    pageSize?: number;
+    /** Keep the header visible while scrolling. */
+    stickyHeader?: boolean;
+    /** Per-column filter configuration. */
+    filters?: DataGridFilters<TData>;
+    className?: string;
+};
+declare function DataGrid<TData extends object>(props: DataGridProps<TData>): react.JSX.Element;
+
+type ChatMessage = {
+    id: string;
+    content: string;
+    sender: 'user' | 'other';
+    senderName?: string;
+    avatar?: ReactNode;
+    timestamp?: Date | string;
+    status?: 'sending' | 'sent' | 'error';
+};
+type ChatProps = {
+    /** Conversation messages in chronological order. */
+    messages: ChatMessage[];
+    /** Called with the message text when the user sends. */
+    onSend: (content: string) => void;
+    /** Show a loading state for an in-flight response. */
+    loading?: boolean;
+    /** Placeholder for the composer input. */
+    placeholder?: string;
+    /** Disable the composer. */
+    disabled?: boolean;
+    /** Content shown when there are no messages. */
+    emptyState?: ReactNode;
+    /** Show an animated typing indicator. */
+    typingIndicator?: boolean;
+    className?: string;
+};
+declare function Chat({ messages, onSend, loading, placeholder, disabled, emptyState, typingIndicator, className, }: ChatProps): react.JSX.Element;
+
+type Notification = {
+    id: string;
+    title: string;
+    description?: string;
+    icon?: ReactNode;
+    meta?: ReactNode;
+    unread?: boolean;
+    timestamp?: Date | string;
+    onClick?: () => void;
+};
+type NotificationCenterProps = {
+    /** Notifications to display, newest first. */
+    notifications: Notification[];
+    /** Called when "mark all as read" is pressed. */
+    onMarkAllRead?: () => void;
+    /** Called with an id when a single item is marked read. */
+    onMarkRead?: (id: string) => void;
+    /** Called when the clear-all action is pressed. */
+    onClear?: () => void;
+    /** Called when the "see all" footer link is pressed. */
+    onSeeAll?: () => void;
+    /** Maximum number of items shown before scrolling. */
+    maxVisible?: number;
+    /** Content rendered when there are no notifications. */
+    emptyState?: ReactNode;
+    /** Accessible label for the panel/trigger. */
+    label?: string;
+    className?: string;
+};
+declare function NotificationCenter({ notifications, onMarkAllRead, onMarkRead, onClear, onSeeAll, maxVisible, emptyState, label, className, }: NotificationCenterProps): react.JSX.Element;
+
+type WizardStep = {
+    id: string;
+    label: string;
+    description?: string;
+    content: ReactNode | ((api: WizardStepApi) => ReactNode);
+    onNext?: () => boolean | Promise<boolean>;
+    onBack?: () => void;
+};
+type WizardStepApi = {
+    next: () => Promise<void>;
+    back: () => void;
+    goTo: (index: number) => void;
+    isFirst: boolean;
+    isLast: boolean;
+    currentIndex: number;
+    totalSteps: number;
+};
+type WizardProps = {
+    /** Ordered steps with their content and validation. */
+    steps: WizardStep[];
+    /** Called when the final step is completed. */
+    onComplete?: () => void;
+    /** Layout of the step indicator. */
+    orientation?: 'horizontal' | 'vertical';
+    /** Label for the next button. */
+    nextLabel?: string;
+    /** Label for the back button. */
+    backLabel?: string;
+    /** Label for the final/complete button. */
+    completeLabel?: string;
+    className?: string;
+};
+declare function useWizard(): WizardStepApi;
+declare function Wizard({ steps, onComplete, orientation, nextLabel, backLabel, completeLabel, className, }: WizardProps): react.JSX.Element;
+
+type ClickAwayListenerProps = {
+    children: ReactNode;
+    className?: string;
+    onClickAway: (event: MouseEvent | TouchEvent) => void;
+};
+declare function ClickAwayListener({ children, className, onClickAway }: ClickAwayListenerProps): react.JSX.Element;
+
+type NoSsrProps = {
+    children: ReactNode;
+    fallback?: ReactNode;
+};
+declare function NoSsr({ children, fallback }: NoSsrProps): ReactNode;
+
+type PopperProps = {
+    /** Element to position the floating content against. */
+    anchor: HTMLElement | null;
+    /** Floating content. */
+    children: ReactNode;
+    className?: string;
+    /** Whether the floating content is rendered. */
+    open: boolean;
+    /** Preferred placement relative to the anchor. */
+    placement?: Placement;
+};
+declare function Popper({ anchor, children, className, open, placement, }: PopperProps): react.JSX.Element | null;
+
+type PortalProps = {
+    children: ReactNode;
+    container?: Element | DocumentFragment | null;
+    disabled?: boolean;
+};
+declare function Portal({ children, container, disabled }: PortalProps): ReactNode;
+
+type TextareaAutosizeProps = ComponentPropsWithoutRef<'textarea'> & {
+    maxRows?: number;
+    minRows?: number;
+};
+declare const TextareaAutosize: react.ForwardRefExoticComponent<Omit<react.DetailedHTMLProps<react.TextareaHTMLAttributes<HTMLTextAreaElement>, HTMLTextAreaElement>, "ref"> & {
+    maxRows?: number;
+    minRows?: number;
+} & react.RefAttributes<HTMLTextAreaElement>>;
+
+declare function useMediaQuery(query: string, defaultValue?: boolean): boolean;
+
+type SparklineProps = {
+    /** Series values to plot. */
+    data: number[];
+    /** Render as a line or as bars. */
+    variant?: 'line' | 'bars';
+    /** Width in pixels. */
+    width?: number;
+    /** Height in pixels. */
+    height?: number;
+    /** Stroke/bar colour. */
+    color?: string;
+    /** Fill the area under a line sparkline. */
+    fill?: boolean;
+    /** Accessible description of the trend. */
+    'aria-label'?: string;
+    className?: string;
+};
+declare function Sparkline({ data, variant, width, height, color, fill, 'aria-label': ariaLabel, className, }: SparklineProps): react.JSX.Element | null;
+
+/**
+ * Mask tokens:
+ *   9 — digit (0-9)
+ *   a — letter (A-Z, a-z)
+ *   * — alphanumeric
+ * Any other character is a literal and is inserted automatically.
+ * Example masks: "(999) 999-9999", "99/99/9999", "aa-9999", "99:99"
+ */
+type MaskedInputProps = {
+    /** Mask pattern; `9` = digit, `a` = letter, `*` = alphanumeric (e.g. "(999) 999-9999"). */
+    mask: string;
+    /** Current (masked) value. */
+    value: string;
+    /** Called with the masked value on input. */
+    onChange: (value: string) => void;
+    /** Visible label above the field. */
+    label?: string;
+    placeholder?: string;
+    disabled?: boolean;
+    /** Mark the field invalid for validation styling. */
+    invalid?: boolean;
+    className?: string;
+    /** Accessible name when no visible label is present. */
+    'aria-label'?: string;
+};
+declare function applyMask(raw: string, mask: string): string;
+declare function MaskedInput({ mask, value, onChange, label, placeholder, disabled, invalid, className, 'aria-label': ariaLabel, }: MaskedInputProps): react.JSX.Element;
+
+type ScrollSpyItem = {
+    id: string;
+    label: ReactNode;
+};
+type ScrollSpyProps = {
+    items: ScrollSpyItem[];
+    /** Root margin handed to IntersectionObserver — tune when a section counts as active. */
+    rootMargin?: string;
+    /** Scroll container element id — defaults to the viewport. */
+    containerId?: string;
+    onActiveChange?: (id: string) => void;
+    className?: string;
+};
+declare function useScrollSpy(ids: string[], options?: {
+    rootMargin?: string;
+    containerId?: string;
+}): string | null;
+declare function ScrollSpy({ items, rootMargin, containerId, onActiveChange, className, }: ScrollSpyProps): react.JSX.Element;
+
+type GaugeProps = {
+    /** Current value to display. */
+    value: number;
+    /** Lower bound of the scale. Defaults to 0. */
+    min?: number;
+    /** Upper bound of the scale. Defaults to 100. */
+    max?: number;
+    /** Caption shown with the value. */
+    label?: string;
+    /** Visual style: arc (270° dial), semi (180° half circle), linear (horizontal bar). */
+    variant?: 'arc' | 'semi' | 'linear';
+    /** Diameter (arc/semi) or width (linear) in pixels. */
+    size?: number;
+    /** Fill colour of the value arc/bar. */
+    color?: string;
+    /** Colour of the unfilled track. */
+    trackColor?: string;
+    /** Format the displayed value (e.g. add a unit). */
+    formatValue?: (value: number) => string;
+    /** Threshold stops — color switches when value crosses. Sorted ascending. */
+    thresholds?: {
+        value: number;
+        color: string;
+    }[];
+    className?: string;
+};
+declare function Gauge({ value, min, max, label, variant, size, color, trackColor, formatValue, thresholds, className, }: GaugeProps): react.JSX.Element;
+
+type WindowProps = {
+    /** Whether the window is open (controlled). */
+    open: boolean;
+    /** Called when the window is closed. */
+    onClose: () => void;
+    /** Window title bar content. */
+    title: ReactNode;
+    /** Window body content. */
+    children: ReactNode;
+    /** Starting top-left position in pixels. */
+    initialPosition?: {
+        x: number;
+        y: number;
+    };
+    /** Starting size in pixels. */
+    initialSize?: {
+        width: number;
+        height: number;
+    };
+    /** Minimum width when resizing. */
+    minWidth?: number;
+    /** Minimum height when resizing. */
+    minHeight?: number;
+    /** Allow the user to resize the window. */
+    resizable?: boolean;
+    /** Show the maximize control. */
+    maximizable?: boolean;
+    /** Stack order among multiple windows. */
+    zIndex?: number;
+    /** Called when the window gains focus (e.g. to raise it). */
+    onFocus?: () => void;
+    /** Extra classes for the window container. */
+    className?: string;
+};
+/**
+ * Draggable, resizable floating window. Non-modal — page behind stays
+ * interactive. For multi-window dashboards, tool palettes, and pop-out panels.
+ */
+declare function Window({ open, onClose, title, children, initialPosition, initialSize, minWidth, minHeight, resizable, maximizable, zIndex, onFocus, className, }: WindowProps): react.JSX.Element | null;
+
+type ActionSheetAction = {
+    label: string;
+    icon?: ReactNode;
+    onSelect: () => void;
+    tone?: 'default' | 'danger';
+    disabled?: boolean;
+};
+type ActionSheetProps = {
+    /** Whether the sheet is visible. */
+    open: boolean;
+    /** Called when the sheet is dismissed. */
+    onClose: () => void;
+    /** Optional heading at the top of the sheet. */
+    title?: string;
+    /** Supporting text under the title. */
+    description?: string;
+    /** Action buttons rendered in the sheet. */
+    actions: ActionSheetAction[];
+    /** Label for the cancel button. Defaults to "Cancel". */
+    cancelLabel?: string;
+    className?: string;
+};
+/**
+ * Mobile-first bottom sheet presenting a vertical list of actions.
+ * Desktop renders the same sheet centered at the bottom with max width.
+ */
+declare function ActionSheet({ open, onClose, title, description, actions, cancelLabel, className, }: ActionSheetProps): react.JSX.Element;
+
+type AIPromptProps = {
+    /** Called with the prompt text on submit. Wire your model call here. */
+    onSubmit: (prompt: string) => void;
+    /** Streaming/working state — shows stop affordance and disables input. */
+    busy?: boolean;
+    /** Called when the user clicks stop during a busy/streaming response. */
+    onStop?: () => void;
+    /** Quick-start suggestion chips shown above the input. */
+    suggestions?: string[];
+    /** Placeholder text for the input. Defaults to `'Ask anything…'`. */
+    placeholder?: string;
+    /** Accessible label for the input (visually hidden). Defaults to `'AI prompt'`. */
+    label?: string;
+    /** Rendered output region (markdown, streamed text, components). */
+    output?: ReactNode;
+    /** Footer hint, e.g. model name or token budget. */
+    hint?: string;
+    /** Disables the input and submit affordance. */
+    disabled?: boolean;
+    className?: string;
+};
+/**
+ * Prompt input surface for AI features: suggestion chips, multiline input with
+ * Cmd/Ctrl+Enter submit, busy/stop state, and an output slot. Transport-free —
+ * wire your own model call in onSubmit.
+ */
+declare function AIPrompt({ onSubmit, busy, onStop, suggestions, placeholder, label, output, hint, disabled, className, }: AIPromptProps): react.JSX.Element;
+
+type DropDownTreeProps = {
+    /** Hierarchical tree nodes to choose from. */
+    nodes: TreeNode[];
+    /** Id of the selected node, or `undefined` when empty (controlled). */
+    value: string | undefined;
+    /** Called with the newly selected node id. */
+    onChange: (id: string | undefined) => void;
+    /** Field label shown above the control. */
+    label?: string;
+    /** Placeholder text when nothing is selected. */
+    placeholder?: string;
+    /** Only allow selecting leaf nodes (no children). */
+    leafOnly?: boolean;
+    /** Ids of branches expanded on first render. */
+    defaultExpandedIds?: string[];
+    /** Extra classes for the control wrapper. */
+    className?: string;
+};
+/** Select-style trigger opening a tree picker — for hierarchical taxonomies. */
+declare function DropDownTree({ nodes, value, onChange, label, placeholder, leafOnly, defaultExpandedIds, className, }: DropDownTreeProps): react.JSX.Element;
+
+type TreeListRow = {
+    id: string;
+    children?: TreeListRow[];
+} & Record<string, unknown>;
+type TreeListColumn<R extends TreeListRow = TreeListRow> = {
+    key: string;
+    header: ReactNode;
+    width?: string;
+    align?: 'left' | 'right';
+    render?: (row: R) => ReactNode;
+};
+type TreeListProps<R extends TreeListRow = TreeListRow> = {
+    /** Hierarchical row data; each row may carry nested children. */
+    rows: R[];
+    /** Column definitions describing how to render each cell. */
+    columns: TreeListColumn<R>[];
+    /** Ids of branches expanded on first render. */
+    defaultExpandedIds?: string[];
+    /** Expand every branch initially. */
+    defaultExpandAll?: boolean;
+    /** Called when a row is clicked. */
+    onRowClick?: (row: R) => void;
+    /** Highlighted row id. */
+    selectedId?: string;
+    /** Text shown when there are no rows. */
+    emptyMessage?: string;
+    /** Extra classes for the tree container. */
+    className?: string;
+};
+/**
+ * Hierarchical data grid — rows expand/collapse in place while staying aligned
+ * to columns. KendoUI TreeList equivalent for org structures, BOM tables,
+ * account trees, and file systems.
+ */
+declare function TreeList<R extends TreeListRow = TreeListRow>({ rows, columns, defaultExpandedIds, defaultExpandAll, onRowClick, selectedId, emptyMessage, className, }: TreeListProps<R>): react.JSX.Element;
+
+type SchedulerEvent = Event & {
+    id: string;
+    /** Token-driven color accent for the event chip. */
+    color?: string;
+    resourceId?: string;
+};
+type SchedulerResource = {
+    id: string;
+    title: string;
+};
+type SchedulerProps = {
+    /** Events to render on the calendar (controlled). */
+    events: SchedulerEvent[];
+    /** Called with the next events array after a drag, resize, or edit. */
+    onEventsChange: (events: SchedulerEvent[]) => void;
+    /** Resource lanes (people, rooms, machines) — enables resource view columns. */
+    resources?: SchedulerResource[];
+    /** Called when user selects an empty slot — create-event hook. */
+    onSlotSelect?: (slot: {
+        start: Date;
+        end: Date;
+        resourceId?: string;
+    }) => void;
+    /** Called when an existing event is clicked. */
+    onEventClick?: (event: SchedulerEvent) => void;
+    /** Calendar view shown on first render. */
+    defaultView?: View;
+    /** Views the user can switch between. */
+    views?: View[];
+    /** Date the calendar opens on. */
+    defaultDate?: Date;
+    /** Disable drag/resize editing. */
+    readOnly?: boolean;
+    /** Minimum height of the calendar viewport in px. */
+    minHeight?: number;
+    /** Extra classes for the calendar container. */
+    className?: string;
+};
+/**
+ * Full event scheduler: day/week/month/agenda views, drag to move, drag edges
+ * to resize, slot selection to create, optional resource lanes. Controlled —
+ * pass events and apply changes in onEventsChange.
+ */
+declare function Scheduler({ events, onEventsChange, resources, onSlotSelect, onEventClick, defaultView, views, defaultDate, readOnly, minHeight, className, }: SchedulerProps): react.JSX.Element;
+
+export { AIPrompt, type AIPromptProps, Accordion, type AccordionItem, type AccordionProps, ActionMenu, type ActionMenuItem, type ActionMenuProps, type ActionMenuSection, ActionSheet, type ActionSheetAction, type ActionSheetProps, ActivityFeed, type ActivityFeedItem, type ActivityFeedProps, Alert, type AlertProps, AnimatedList, type AnimatedListProps, AnimatedNumber, type AnimatedNumberProps, AppBar, type AppBarProps, AppBarSection, AppBarTitle, AreaChart, AspectRatio, type AspectRatioProps, AsyncSelect, type AsyncSelectProps, Avatar, AvatarGroup, type AvatarGroupProps, type AvatarProps, AvatarStack, type AvatarStackItem, type AvatarStackProps, Backdrop, type BackdropProps, Badge, type BadgeProps, Banner, type BannerProps, BarChart, Barcode, type BarcodeProps, BentoCard, type BentoCardProps, BentoGrid, type BentoGridProps, BorderBeam, type BorderBeamProps, BottomNavigation, type BottomNavigationItem, type BottomNavigationProps, Box, Breadcrumb, type BreadcrumbItem, type BreadcrumbProps, Button, ButtonGroup, type ButtonGroupProps, type ButtonProps, Calendar, type CalendarEvent, type CalendarProps, CandlestickChart, type CandlestickChartProps, type CandlestickDatum, Card, CardContent, CardDescription, CardFooter, CardHeader, type CardProps, CardTitle, Carousel, type CartesianChartProps, type ChartSeries, Chat, type ChatMessage, type ChatProps, Checkbox, CheckboxGroup, type CheckboxGroupOption, type CheckboxGroupProps, type CheckboxProps, Chip, type ChipProps, CircularProgress, type CircularProgressProps, ClickAwayListener, type ClickAwayListenerProps, CodeBlock, type CodeBlockProps, CodeEditor, type CodeEditorLanguage, type CodeEditorProps, Collapsible, type CollapsibleProps, ColorPicker, ColumnsToggle, type ColumnsToggleProps, Combobox, type ComboboxOption, type ComboboxProps, type CommandAction, CommandPalette, Confetti, type ConfettiProps, ConfirmDialog, Container, type ContainerProps, ContextMenu, type ContextMenuItem, type ContextMenuProps, CopyButton, type CopyButtonProps, CopyField, type CopyFieldProps, CountdownTimer, type CountdownTimerProps, CurrencyInput, type CurrencyInputProps, DataGrid, type DataGridColumn, type DataGridProps, DataTable, type DataTableProps, DatePicker, type DatePickerProps, DateRangeFilter, type DateRangeFilterProps, DateRangePicker, type DateRangePickerProps, DateTimePicker, type DateTimePickerProps, DateTimeRangePicker, type DateTimeRangePickerProps, type DescriptionItem, DescriptionList, type DescriptionListProps, DiffViewer, type DiffViewerProps, DonutChart, Drawer, DropDownTree, type DropDownTreeProps, Dropdown, type DropdownItem, type DropdownProps, type DropdownSection, Editor, EmptyState, type EmptyStateProps, ErrorState, type ExportFormat, ExportToolbar, type FacetOption, FacetedFilter, type FacetedFilterProps, Field, Fieldset, type FieldsetProps, FileItem, type FileItemProps, type FileItemStatus, FileUpload, FilterBar, type FilterBarProps, FilterBuilder, type FilterBuilderProps, type FilterChip, FilterChips, type FilterChipsProps, FilterGroupEditor, type FilterGroupEditorProps, FilterPopover, type FilterPopoverProps, FiltersProvider, type FiltersProviderProps, FloatingActionButton, type FloatingActionButtonProps, Form, FormActions, type FormActionsProps, FormControl, type FormControlField, type FormControlProps, FormError, type FormErrorProps, FormGrid, type FormGridProps, FormHelperText, type FormHelperTextProps, FormLabel, type FormLabelProps, FunnelChart, type FunnelChartProps, GanttChart, type GanttChartProps, type GanttItem, Gauge, GaugeChart, type GaugeChartProps, type GaugeProps, GradientText, type GradientTextProps, Grid, type GridProps, HeatmapChart, type HeatmapChartProps, HoverCard, type HoverCardProps, IconButton, type IconButtonProps, ImageCropper, type ImageCropperProps, ImageLightbox, ImageList, ImageListItem, type ImageListItemProps, type ImageListProps, ImagePreview, type ImagePreviewProps, type ImagePreviewStatus, InfiniteScroll, type InfiniteScrollProps, InlineNotice, type InlineNoticeProps, type InlineNoticeTone, Input, InputGroup, type InputGroupProps, JSONViewer, type JSONViewerProps, Kbd as KBD, KanbanBoard, type KanbanBoardProps, type KanbanCardItem, type KanbanColumnItem, Kbd, type KbdProps, type LegacySavedView, LineChart, PrimitiveLink as Link, List, ListDivider, ListItem, ListItemButton, type ListItemButtonProps, ListItemContent, ListItemDecorator, type ListProps, ListSubheader, LoadingOverlay, type LoadingOverlayProps, LoadingState, Map, type MapMarker, type MapProps, Markdown, Marquee, type MarqueeProps, MaskedInput, type MaskedInputProps, Masonry, MasonryItem, type MasonryProps, Megamenu, type MegamenuColumn, MentionInput, type MentionInputProps, type MentionOption, Menu, type MenuProps, type MetadataItem, MetadataList, type MetadataListProps, Meter, type MeterProps, type MeterSegment, Modal, type ModalProps, MotionPreset, type MotionPresetName, MultiColumnCombobox, type MultiColumnComboboxColumn, type MultiColumnComboboxItem, type MultiColumnComboboxProps, MultiSelect, type MultiSelectProps, MultiViewCalendar, type MultiViewCalendarProps, NavigationMenu, type NavigationMenuItem, type NavigationMenuProps, NoSsr, type NoSsrProps, type Notification, NotificationCard, type NotificationCardProps, NotificationCenter, type NotificationCenterProps, NumberInput, type NumberInputProps, OnboardingTour, type OnboardingTourProps, OrgChart, type OrgChartNode, type OrgChartProps, PageBody, PageHeader, PageSection, Pagination, type PaginationProps, Panel, PanelHandle, Paper, type PaperProps, PasswordInput, type PasswordInputProps, PhoneInput, type PhoneInputProps, PieChart, type PieChartProps, PinInput, type PinInputProps, Player, Popover, type PopoverProps, Popper, type PopperProps, Portal, type PortalProps, PrimitiveLink, type PrimitiveLinkProps, Progress, type ProgressProps, PropertyItem, type PropertyItemProps, PropertyList, type PropertyListItem, type PropertyListProps, QRCode, type QRCodeProps, RadarChart, type RadarChartProps, RadioCardGroup, type RadioCardGroupProps, type RadioCardOption, RadioGroup, type RadioGroupProps, type RadioOption, RangeFilter, type RangeFilterProps, RangeSlider, type RangeSliderProps, Rating, type RatingProps, ResizablePanels, type ResizablePanelsProps, Ripple, type RippleProps, type RowAction, RowActions, type RowActionsProps, SankeyChart, type SankeyChartProps, type SavedView, SavedViews, type SavedViewsProps, type SavedViewsStorage, ScatterChart, type ScatterChartProps, Scheduler, type SchedulerEvent, type SchedulerProps, type SchedulerResource, ScrollSpy, type ScrollSpyItem, type ScrollSpyProps, Scrollbar, SearchFilter, type SearchFilterProps, SearchInput, type SearchInputProps, Select, type SelectProps, Separator, type SeparatorProps, Sheet, Shortcut, type ShortcutProps, SignaturePad, type SignaturePadProps, Skeleton, type SkeletonProps, SkeletonRow, Slider, SortableList, type SortableListProps, Sparkline, type SparklineProps, SpeedDial, type SpeedDialAction, type SpeedDialProps, Spinner, type SpinnerProps, SplitButton, type SplitButtonAction, type SplitButtonProps, Spotlight, SpotlightCard, type SpotlightCardProps, type SpotlightProps, Stack, type StackProps, StackedBarChart, StatCard, type StatCardProps, StatusDot, type StatusDotProps, StatusLabel, type StatusLabelProps, type StatusTone, Stepper, type Swatch, SwatchPicker, type SwatchPickerProps, Switch, SwitchGroup, type SwitchGroupOption, type SwitchGroupProps, type SwitchProps, type TabItem, Table, TableBody, TableCaption, TableCell, TableFooter, TableHead, TableHeader, TableRow, TableToolbar, type TableToolbarProps, Tabs, type TabsProps, Tag, TagInput, type TagInputProps, type TagProps, Textarea, TextareaAutosize, type TextareaAutosizeProps, type TextareaProps, Tilt, type TiltProps, TimePicker, type TimePickerProps, type TimeValue, Timeline, type TimelineItem, ToggleButton, type ToggleButtonProps, ToggleGroup, type ToggleGroupProps, type ToggleOption, Toolbar, type ToolbarProps, Tooltip, type TooltipProps, TopProgressBar, TransferList, type TransferListItem, type TransferListProps, TreeList, type TreeListColumn, type TreeListProps, type TreeListRow, type TreeNode, TreeView, TreemapChart, type TreemapChartProps, type TreemapNode, Typography, type TypographyProps, type UseFiltersOptions, type UseFiltersReturn, VirtualList, type VirtualListProps, WaterfallChart, type WaterfallChartProps, Window, type WindowProps, Wizard, type WizardProps, type WizardStep, type WizardStepApi, applyMask, defaultValueForOperator, downloadCsv, registerCommands, toCsv, toast, useCommandStore, useDialogControls, useFilters, useFiltersContext, useFormControl, useFormControlContext, useMediaQuery, useOptionalFiltersContext, useScrollSpy, useWizard };