themelia-react-ui 0.0.0-stage → 1.0.0

package/dist/components/base/chart/chart.d.ts

@@ -0,0 +1,99 @@
+/**
+ * Chart — Recharts helpers with shadcn-compatible configuration.
+ *
+ * Localized from the shadcn/ReUI chart helper into the base layer so chart
+ * chrome uses this library's tokens, tooltip density, and BEM DOM hooks.
+ * The Recharts peer stays isolated to the exact `base/chart` entrypoint.
+ */
+import * as React from 'react';
+import * as RechartsPrimitive from 'recharts';
+declare const THEMES: {
+    readonly light: "";
+    readonly dark: ".dark";
+};
+export type ChartConfig = Record<string, {
+    /** Axis label for the hovered position. Supplied by Recharts. */
+    label?: React.ReactNode;
+    /** Leading glyph. */
+    icon?: React.ComponentType;
+} & ({
+    color?: string;
+    theme?: never;
+} | {
+    color?: never;
+    theme: Record<keyof typeof THEMES, string>;
+})>;
+export type ChartPayloadItem = {
+    dataKey?: string | number;
+    /** Form field name, forwarded for native submits. */
+    name?: string | number;
+    /** Current value. Controlled. */
+    value?: string | number | Array<string | number>;
+    type?: string;
+    /** Overrides the colour of the tooltip indicator. */
+    color?: string;
+    fill?: string;
+    /** Data points under the cursor. Supplied by Recharts. */
+    payload?: Record<string, unknown>;
+};
+export interface ChartInitialDimension {
+    width: number;
+    height: number;
+}
+export interface ChartContainerProps extends React.ComponentPropsWithoutRef<'div'> {
+    /** Maps each data key to its label, colour, and icon. */
+    config: ChartConfig;
+    children: React.ComponentProps<typeof RechartsPrimitive.ResponsiveContainer>['children'];
+    /** Starting width and height, so the chart renders before its container is measured. */
+    initialDimension?: ChartInitialDimension;
+}
+declare function ChartContainer({ id, className, children, config, initialDimension, ...props }: ChartContainerProps): React.JSX.Element;
+declare function ChartStyle({ id, config }: {
+    id: string;
+    config: ChartConfig;
+}): React.JSX.Element | null;
+declare const ChartTooltip: typeof RechartsPrimitive.Tooltip;
+export interface ChartTooltipContentProps extends React.ComponentPropsWithoutRef<'div'> {
+    /** Whether the tooltip is showing. Supplied by Recharts. */
+    active?: boolean;
+    /** Data points under the cursor. Supplied by Recharts. */
+    payload?: ChartPayloadItem[];
+    /** Axis label for the hovered position. Supplied by Recharts. */
+    label?: React.ReactNode;
+    /** Merged onto the tooltip label. */
+    labelClassName?: string;
+    /** Formats the tooltip label. */
+    labelFormatter?: (label: React.ReactNode, payload: ChartPayloadItem[]) => React.ReactNode;
+    /** Formats each tooltip value. */
+    formatter?: (
+    /** Current value. Controlled. */
+    value: NonNullable<ChartPayloadItem['value']>, 
+    /** Form field name, forwarded for native submits. */
+    name: NonNullable<ChartPayloadItem['name']>, item: ChartPayloadItem, index: number, 
+    /** Data points under the cursor. Supplied by Recharts. */
+    payload?: Record<string, unknown>) => React.ReactNode;
+    /** Overrides the colour of the tooltip indicator. */
+    color?: string;
+    /** Hides the tooltip label row. */
+    hideLabel?: boolean;
+    /** Hides the colour indicator beside each value. */
+    hideIndicator?: boolean;
+    /** Shape of the colour indicator. */
+    indicator?: 'line' | 'dot' | 'dashed';
+    /** Key in the payload holding each series name. */
+    nameKey?: string;
+    /** Key in the payload holding the tooltip label. */
+    labelKey?: string;
+}
+declare function ChartTooltipContent({ active, payload, className, indicator, hideLabel, hideIndicator, label, labelFormatter, labelClassName, formatter, color, nameKey, labelKey, }: ChartTooltipContentProps): React.JSX.Element | null;
+declare const ChartLegend: React.MemoExoticComponent<(outsideProps: RechartsPrimitive.LegendProps) => React.ReactPortal | null>;
+export interface ChartLegendContentProps extends React.ComponentPropsWithoutRef<'div'> {
+    hideIcon?: boolean;
+    /** Data points under the cursor. Supplied by Recharts. */
+    payload?: ChartPayloadItem[];
+    verticalAlign?: 'top' | 'bottom' | 'middle';
+    /** Key in the payload holding each series name. */
+    nameKey?: string;
+}
+declare function ChartLegendContent({ className, hideIcon, payload, verticalAlign, nameKey, }: ChartLegendContentProps): React.JSX.Element | null;
+export { ChartContainer, ChartTooltip, ChartTooltipContent, ChartLegend, ChartLegendContent, ChartStyle, };

package/dist/components/base/chart/index.d.ts

@@ -0,0 +1,9 @@
+/**
+ * Token-aware Recharts helpers.
+ *
+ * Published as its own `themelia-react-ui/base/chart` entrypoint so the
+ * optional `recharts` peer stays isolated from the broad base barrels. Reach
+ * for `themelia-react-ui/blocks/analytics` when the chart also needs
+ * standard card chrome.
+ */
+export { ChartContainer, ChartLegend, ChartLegendContent, ChartStyle, ChartTooltip, ChartTooltipContent, type ChartConfig, type ChartContainerProps, type ChartInitialDimension, type ChartLegendContentProps, type ChartPayloadItem, type ChartTooltipContentProps, } from './chart';

package/dist/components/base/choice-inputs/card-checkbox-group.d.ts

@@ -0,0 +1,27 @@
+/**
+ * CardCheckboxGroup — multi-select group rendered as a grid of card-shaped
+ * options with title, optional description, and optional leading icon.
+ * Use for a small set of feature flags / preferences where each option
+ * benefits from extra context that a flat checkbox list can't carry.
+ *
+ * Pairs with `CardRadioGroup` (single-select). Both share spacing tokens
+ * from `./choice-types` so they line up when used side-by-side.
+ */
+import { type LucideIcon } from 'lucide-react';
+import { type ChoiceGroupBaseProps, type ChoiceOptionBase } from './choice-types';
+export interface CardCheckboxOption extends ChoiceOptionBase {
+    /** Leading glyph. */
+    icon?: LucideIcon;
+}
+export interface CardCheckboxGroupProps extends ChoiceGroupBaseProps {
+    /** Choices offered. */
+    options: CardCheckboxOption[];
+    /** Current value. Controlled. */
+    value?: string[];
+    /** Initial value for uncontrolled use. */
+    defaultValue?: string[];
+    onValueChange?: (values: string[]) => void;
+    /** How many columns the grid uses. */
+    columns?: 1 | 2 | 3 | 4;
+}
+export declare const CardCheckboxGroup: import("react").ForwardRefExoticComponent<CardCheckboxGroupProps & import("react").RefAttributes<HTMLDivElement>>;

package/dist/components/base/choice-inputs/card-radio-group.d.ts

@@ -0,0 +1,19 @@
+import { type LucideIcon } from 'lucide-react';
+import * as React from 'react';
+import { type ChoiceGroupBaseProps, type ChoiceOptionBase } from './choice-types';
+export interface CardRadioOption extends ChoiceOptionBase {
+    /** Leading glyph. */
+    icon?: LucideIcon;
+}
+export interface CardRadioGroupProps extends ChoiceGroupBaseProps {
+    /** Choices offered. */
+    options: CardRadioOption[];
+    /** Current value. Controlled. */
+    value?: string;
+    /** Initial value for uncontrolled use. */
+    defaultValue?: string;
+    onValueChange?: (value: string) => void;
+    /** How many columns the grid uses. */
+    columns?: 1 | 2 | 3 | 4;
+}
+export declare const CardRadioGroup: React.NamedExoticComponent<CardRadioGroupProps & React.RefAttributes<HTMLDivElement>>;

package/dist/components/base/choice-inputs/checkbox.d.ts

@@ -0,0 +1,17 @@
+import { type CheckboxProps } from '../../ui/checkbox';
+/**
+ * Checkbox — base wrapper around the shadcn/Base UI checkbox primitive.
+ *
+ * Base UI renders the root as an inline span; the wrapper makes it an
+ * inline-flex control so token size utilities render as a square box instead
+ * of collapsing to the two border lines.
+ *
+ * The root ref accepts the actual HTMLElement, including custom button renders.
+ * The muted foreground border keeps the unchecked boundary visible in both themes.
+ *
+ * The wrapper retains its compact corner recipe while deriving it from the
+ * shared theme radius, so scoped consumer radius overrides still apply.
+ */
+declare const Checkbox: import("react").ForwardRefExoticComponent<Omit<CheckboxProps, "ref"> & import("react").RefAttributes<HTMLElement>>;
+export { Checkbox };
+export type { CheckboxProps };

package/dist/components/base/choice-inputs/choice-types.d.ts

@@ -0,0 +1,57 @@
+/**
+ * Shared types for choice-style form fields (CardRadio, CardCheckbox,
+ * ListRadio, PillRadio). Each variant exports its own `Option` type that
+ * extends `ChoiceOptionBase`, so consumers see one consistent option shape
+ * across the family.
+ *
+ * Sizes follow the package component scale (`sm | md | lg`). CardRadio and
+ * CardCheckbox additionally accept `size` to drive padding, icon size, and type
+ * scale through shared form/display variables.
+ */
+import type { ComponentType, ReactNode } from 'react';
+import type { ComponentScale } from '../../../lib/ui-provider';
+export type ChoiceSize = ComponentScale;
+export interface ChoiceOptionBase<TValue extends string = string> {
+    value: TValue;
+    label: ReactNode;
+    description?: ReactNode;
+    icon?: ComponentType<{
+        className?: string;
+    }>;
+    disabled?: boolean;
+}
+export interface ChoiceGroupBaseProps {
+    /** Supporting/error descriptions associated with the group. */
+    'aria-describedby'?: string;
+    /** Form field name (also used for hidden inputs and aria grouping). */
+    name?: string;
+    /** Disable the entire group. */
+    disabled?: boolean;
+    /** Show error styling. */
+    invalid?: boolean;
+    /** Density / control size. Defaults from `useDensityConfig().defaultScale`. */
+    size?: ChoiceSize;
+    className?: string;
+}
+/**
+ * Padding / icon-size token map shared across CardRadio + CardCheckbox so the
+ * two variants line up visually when placed side-by-side.
+ */
+export declare const choiceCardSizeTokens: Record<ChoiceSize, {
+    padding: string;
+    iconBox: string;
+    iconSize: string;
+    gap: string;
+}>;
+/**
+ * Pill height / horizontal padding tokens. Shared across PillRadioGroup
+ * and any future toggle-bar variant so they stack cleanly.
+ */
+export declare const choicePillSizeTokens: Record<ChoiceSize, string>;
+/**
+ * Row padding tokens for ListRadio and any future inline list variant.
+ */
+export declare const choiceListSizeTokens: Record<ChoiceSize, string>;
+/** Shared selected-card marker and content clearance; derives from action/icon geometry. */
+export declare const choiceCardMarkerClasses = "absolute top-space-sm end-space-sm size-action-sm text-primary-foreground fill-primary stroke-primary-foreground";
+export declare const choiceCardMarkerClearance = "[&>*:not(svg)]:max-w-[calc(100%_-_var(--spacing-action-sm))]";

package/dist/components/base/choice-inputs/index.d.ts

@@ -0,0 +1,28 @@
+/**
+ * choice-inputs — controls for picking from a known set of options.
+ *
+ * Split out of `base/forms`. Binary toggles live here too: a switch is a
+ * two-option choice, and grouping by interaction rather than by widget name
+ * keeps `Checkbox`, `Switch` and the radio groups under one contract.
+ *
+ * Related families:
+ *   - `themelia-react-ui/base/text-inputs` — free-form text entry
+ *   - `themelia-react-ui/base/value-inputs` — editing one structured value
+ *   - `themelia-react-ui/base/forms` — the label/control/error row itself
+ *
+ * The `SelectPopup*` parts are public because they are shared anatomy, not
+ * `Select` internals: `base/value-inputs`' phone control and three of
+ * `base/forms-numeric`'s unit pickers render the same popup. They previously
+ * reached it through a deep private path, which the split makes untenable and
+ * this export replaces.
+ */
+export { Select, defaultSelectStrings, type SelectProps, type SelectOption, type SelectStrings, } from './select';
+export { SelectPopupContent, SelectPopupGroup, SelectPopupItem, SelectPopupLabel, SelectPopupSeparator, type SelectPopupItemProps, type SelectPopupLabelProps, } from './select-popup';
+export { Checkbox, type CheckboxProps } from './checkbox';
+export { Switch, type SwitchProps } from './switch';
+export { SwitchCard, type SwitchCardProps } from './switch-card';
+export { ToggleField, type ToggleFieldProps, type ToggleFieldKind } from './toggle-field';
+export { CardCheckboxGroup, type CardCheckboxGroupProps, type CardCheckboxOption } from './card-checkbox-group';
+export { CardRadioGroup, type CardRadioGroupProps, type CardRadioOption } from './card-radio-group';
+export { ListRadioGroup, type ListRadioGroupProps, type ListRadioOption } from './list-radio-group';
+export { PillRadioGroup, type PillRadioGroupProps, type PillRadioGroupOption } from './pill-radio-group';

package/dist/components/base/choice-inputs/list-radio-group.d.ts

@@ -0,0 +1,13 @@
+import { type ChoiceGroupBaseProps, type ChoiceOptionBase } from './choice-types';
+export interface ListRadioOption extends ChoiceOptionBase {
+}
+export interface ListRadioGroupProps extends ChoiceGroupBaseProps {
+    /** Choices offered. */
+    options: ListRadioOption[];
+    /** Current value. Controlled. */
+    value?: string;
+    /** Initial value for uncontrolled use. */
+    defaultValue?: string;
+    onValueChange?: (value: string) => void;
+}
+export declare const ListRadioGroup: import("react").ForwardRefExoticComponent<ListRadioGroupProps & import("react").RefAttributes<HTMLDivElement>>;

package/dist/components/base/choice-inputs/pill-radio-group.d.ts

@@ -0,0 +1,27 @@
+/**
+ * PillRadioGroup — compact, inline single-select rendered as connected pill
+ * buttons. Best for 2–4 options where a full `<Select>` is too heavy and
+ * cards are too tall (e.g. timeframe toggles, view-mode switchers).
+ *
+ * Custom-styled buttons rather than the shadcn ToggleGroup primitive: the
+ * primitive strips inner rounding when spacing=0, which doesn't match this
+ * design system's pill connector style.
+ */
+import * as React from 'react';
+import { type ChoiceGroupBaseProps, type ChoiceOptionBase } from './choice-types';
+export interface PillRadioGroupOption extends ChoiceOptionBase {
+}
+export interface PillRadioGroupProps extends Omit<ChoiceGroupBaseProps, 'name'> {
+    /** Form field name, forwarded for native submits. */
+    name: string;
+    /** Current value. Controlled. */
+    value: string | null | undefined;
+    /** Choices offered. */
+    options: PillRadioGroupOption[];
+    onValueChange: (value: string | null) => void;
+    /** Allow deselecting (click active pill to clear). Default false. */
+    allowClear?: boolean;
+    /** Stretch pills to fill the container. */
+    fullWidth?: boolean;
+}
+export declare const PillRadioGroup: React.ForwardRefExoticComponent<PillRadioGroupProps & React.RefAttributes<HTMLDivElement>>;

package/dist/components/base/choice-inputs/select-popup.d.ts

@@ -0,0 +1,26 @@
+import type { ComponentPropsWithoutRef } from 'react';
+import * as baseui from '../../ui/select';
+import { type FormControlSize } from '../../../lib/ui-provider';
+import { type CollectionDensity } from '../popover/popover.recipes';
+/**
+ * Private presentation layer for every Select-based form popup.
+ *
+ * It deliberately leaves Root/Trigger/Value state and form semantics with the
+ * owning control, while centralizing the collection popup's compact surface inset, row
+ * rhythm, option indicator clearance, icon sizing, and group anatomy.
+ */
+export declare function SelectPopupContent({ className, align, alignItemWithTrigger, ...props }: ComponentPropsWithoutRef<typeof baseui.SelectContent>): import("react").JSX.Element;
+export declare function SelectPopupGroup({ className, ...props }: ComponentPropsWithoutRef<typeof baseui.SelectGroup>): import("react").JSX.Element;
+export interface SelectPopupItemProps extends ComponentPropsWithoutRef<typeof baseui.SelectItem> {
+    /** Match option typography, gap, icon, and indicator clearance to its trigger. */
+    size?: FormControlSize;
+    /** Vertical option rhythm, independent from trigger/icon size. */
+    density?: CollectionDensity;
+}
+export declare function SelectPopupItem({ children, className, size, density, ...props }: SelectPopupItemProps): import("react").JSX.Element;
+export interface SelectPopupLabelProps extends ComponentPropsWithoutRef<typeof baseui.SelectLabel> {
+    /** Match the group label to the owning form control's text scale. */
+    size?: FormControlSize;
+}
+export declare function SelectPopupLabel({ children, className, size, ...props }: SelectPopupLabelProps): import("react").JSX.Element;
+export declare function SelectPopupSeparator({ className, ...props }: ComponentPropsWithoutRef<typeof baseui.SelectSeparator>): import("react").JSX.Element;

package/dist/components/base/choice-inputs/select.d.ts

@@ -0,0 +1,94 @@
+import { type ComponentPropsWithoutRef, type FocusEventHandler, type ReactNode, type Ref } from 'react';
+import * as baseui from '../../ui/select';
+import { type FormControlSize } from '../../../lib/ui-provider';
+import { type StringsProp } from '../../../lib/strings';
+import type { CollectionDensity } from '../popover/popover.recipes';
+export interface SelectStrings {
+    placeholder: string;
+}
+export declare const defaultSelectStrings: SelectStrings;
+export interface SelectOption {
+    value: string;
+    label: string;
+    description?: string;
+    icon?: ReactNode;
+    disabled?: boolean;
+}
+type BaseSelectTriggerProps = ComponentPropsWithoutRef<typeof baseui.SelectTrigger>;
+type SelectTriggerProps = Omit<BaseSelectTriggerProps, 'aria-describedby' | 'aria-invalid' | 'aria-label' | 'aria-labelledby' | 'children' | 'className' | 'defaultValue' | 'disabled' | 'form' | 'id' | 'name' | 'onBlur' | 'onChange' | 'onFocus' | 'required' | 'size' | 'value'>;
+export interface SelectProps extends SelectTriggerProps {
+    /** Popup option rhythm, independent from the trigger size. Defaults to default. */
+    density?: CollectionDensity;
+    /** Available options. An empty-string option clears the selection. */
+    options: SelectOption[];
+    /** Placeholder text — overrides `strings.placeholder` when provided. */
+    placeholder?: string;
+    /** String overrides (e.g. placeholder). */
+    strings?: StringsProp<SelectStrings>;
+    /** Add a placeholder option that clears the current selection. */
+    allowClear?: boolean;
+    /** Error state for styling (passed from FormField). */
+    invalid?: boolean;
+    /** Visual size. */
+    size?: FormControlSize;
+    /** Additional class names for the trigger. */
+    className?: string;
+    /** Additional class names for the popup surface. */
+    contentClassName?: string;
+    /** Canonical value callback. Returns `undefined` when the selection is cleared. */
+    onValueChange?: (value: string | undefined) => void;
+    /** Current value. Passing `value={undefined}` explicitly keeps the control controlled and clear. */
+    value?: string | null;
+    /** Initial value for an uncontrolled select. */
+    defaultValue?: string | null;
+    /** Disabled state. */
+    disabled?: boolean;
+    /** Read-only state. */
+    readOnly?: boolean;
+    /** Field name used by the hidden native input. */
+    name?: string;
+    /** The owning form id when the select is rendered outside that form. */
+    form?: string;
+    /** Native autocomplete hint forwarded to the hidden input. */
+    autoComplete?: string;
+    /** Ref to the hidden native input used for form submission. */
+    inputRef?: Ref<HTMLInputElement>;
+    /** Root id; Base UI applies it to the trigger/field contract. */
+    id?: string;
+    /** Required state. */
+    required?: boolean;
+    /** Accessible label for externally-labelled or compact trigger contexts. */
+    'aria-label'?: string;
+    /** Ids of elements that label the trigger. */
+    'aria-labelledby'?: string;
+    /** Ids of elements that describe the trigger. */
+    'aria-describedby'?: string;
+    /** Native invalid state forwarded to the trigger. `invalid` takes precedence. */
+    'aria-invalid'?: BaseSelectTriggerProps['aria-invalid'];
+    /** Native focus callback forwarded to the trigger. */
+    onFocus?: FocusEventHandler<HTMLButtonElement>;
+    /** Native blur callback forwarded to the trigger. */
+    onBlur?: FocusEventHandler<HTMLButtonElement>;
+    /** Open state (controlled). */
+    open?: boolean;
+    /** Default open state. */
+    defaultOpen?: boolean;
+    /** Open change handler. */
+    onOpenChange?: (open: boolean) => void;
+    /** Called after the popup's opening or closing animation completes. */
+    onOpenChangeComplete?: (open: boolean) => void;
+    /** Whether the open popup should isolate interaction from the rest of the page. */
+    modal?: boolean;
+    /** Whether pointer movement should highlight popup options. */
+    highlightItemOnHover?: boolean;
+    /** Replace the default icon/label/description option presentation. */
+    renderOption?: (option: SelectOption) => ReactNode;
+    /** Replace the trigger value presentation. Receives `undefined` for the placeholder state. */
+    renderValue?: (option: SelectOption | undefined) => ReactNode;
+}
+/**
+ * Canonical finite-option form control. `Select` owns the single Base UI state
+ * engine used by both standard and descriptive option presentations.
+ */
+export declare const Select: import("react").NamedExoticComponent<SelectProps & import("react").RefAttributes<HTMLButtonElement>>;
+export {};

package/dist/components/base/choice-inputs/switch-card.d.ts

@@ -0,0 +1,36 @@
+/**
+ * SwitchCard — bordered settings card with an icon, title, optional
+ * description, optional hint, and a trailing switch. The whole card is
+ * clickable and toggles the switch; clicking inside the actual switch only
+ * toggles once. Active state lifts the border and tints the surface.
+ *
+ * Use for top-of-list "feature" toggles where the switch needs more visual
+ * weight than a `ToggleField`. For dense rows, prefer `ToggleField`.
+ */
+import { type LucideIcon } from 'lucide-react';
+import * as React from 'react';
+export interface SwitchCardProps {
+    /** Additional supporting/error descriptions associated with the editable control. */
+    'aria-describedby'?: string;
+    /** Card title, also the switch's accessible name. */
+    label: string;
+    /** Supporting sentence under the label. */
+    description?: string;
+    /** Short guidance below the description. */
+    hint?: string;
+    /** Leading glyph. */
+    icon?: LucideIcon;
+    /** Form field name, forwarded for native submits. */
+    name?: string;
+    /** Whether the switch is on. Controlled. */
+    value?: boolean;
+    /** Initial switch state for uncontrolled use. */
+    defaultValue?: boolean;
+    onValueChange?: (checked: boolean) => void;
+    /** Disables the switch and mutes the card. */
+    disabled?: boolean;
+    /** Applies the invalid styling. */
+    invalid?: boolean;
+    className?: string;
+}
+export declare const SwitchCard: React.ForwardRefExoticComponent<SwitchCardProps & React.RefAttributes<HTMLDivElement>>;

package/dist/components/base/choice-inputs/switch.d.ts

@@ -0,0 +1,38 @@
+/**
+ * Switch — canonical boolean switch wrapper around the internal shadcn primitive.
+ *
+ * `onValueChange` is the package-wide value callback.
+ */
+import { type ComponentProps } from 'react';
+import { Switch as SwitchPrimitive } from '../../ui/switch';
+import { type ComponentScale } from '../../../lib/ui-provider';
+type BaseSwitchProps = ComponentProps<typeof SwitchPrimitive>;
+export interface SwitchProps extends Omit<BaseSwitchProps, 'onCheckedChange' | 'size'> {
+    /** Component scale. Falls back to `UIProvider.density.defaultScale`. */
+    size?: ComponentScale;
+    /** Controlled checked state. */
+    checked?: boolean;
+    /** Initial checked state for uncontrolled usage. */
+    defaultChecked?: boolean;
+    /** Disable interaction and native form participation changes. */
+    disabled?: boolean;
+    /** Prevent changes while retaining the current submitted value. */
+    readOnly?: boolean;
+    /** Require the switch to be checked for native form validation. */
+    required?: boolean;
+    /** Hidden input name used during native form submission. */
+    name?: string;
+    /** Hidden input value submitted while checked. */
+    value?: string;
+    /** Optional value submitted while unchecked. */
+    uncheckedValue?: string;
+    /** Associate the hidden input with a form by id. */
+    form?: string;
+    /** Canonical boolean value callback. */
+    onValueChange?: (checked: boolean) => void;
+    /** Error state for styling (passed from FormField). */
+    invalid?: boolean;
+}
+/** Canonical boolean control with native form state and value-first callbacks. */
+export declare const Switch: import("react").ForwardRefExoticComponent<Omit<SwitchProps, "ref"> & import("react").RefAttributes<HTMLSpanElement>>;
+export {};

package/dist/components/base/choice-inputs/toggle-field.d.ts

@@ -0,0 +1,41 @@
+/**
+ * ToggleField — inline label-and-control row for switches and checkboxes.
+ *
+ * Pattern: a left-aligned descriptive label/description block with the
+ * control sitting on the trailing edge. Use for settings rows (e.g. "Email
+ * notifications" + switch) where a full SwitchCard is too heavy and a bare
+ * `Switch` + `<label>` is too brittle. The whole row is clickable and
+ * keyboard-accessible.
+ *
+ * Two control kinds: `'switch'` (default) and `'checkbox'`. Both honour
+ * controlled `value` / `defaultValue` / `onValueChange`. Strings are passed via
+ * standard React props rather than a `strings` object — there are no
+ * defaults to override.
+ */
+import type { ReactNode } from 'react';
+export type ToggleFieldKind = 'switch' | 'checkbox';
+export interface ToggleFieldProps {
+    /** Additional supporting/error descriptions associated with the editable control. */
+    'aria-describedby'?: string;
+    /** Control label. */
+    label: ReactNode;
+    /** Supporting sentence under the label. */
+    description?: ReactNode;
+    /** Which control renders — a switch or a checkbox. */
+    kind?: ToggleFieldKind;
+    /** Whether the control is on. Controlled. */
+    value?: boolean;
+    /** Initial state for uncontrolled use. */
+    defaultValue?: boolean;
+    onValueChange?: (checked: boolean) => void;
+    /** Disables the control. */
+    disabled?: boolean;
+    /** Applies the invalid styling. */
+    invalid?: boolean;
+    /** Form field name, forwarded for native submits. */
+    name?: string;
+    className?: string;
+    /** Place the control on the leading edge instead of trailing (default). */
+    controlPosition?: 'leading' | 'trailing';
+}
+export declare const ToggleField: import("react").ForwardRefExoticComponent<ToggleFieldProps & import("react").RefAttributes<HTMLDivElement>>;

package/dist/components/base/code-block/code-block.d.ts

@@ -0,0 +1,3 @@
+import { type CodeBlockProps } from './code-block.types';
+/** Generic code display. Consumers own highlighting; source text remains the copy payload. */
+export declare const CodeBlock: import("react").ForwardRefExoticComponent<CodeBlockProps & import("react").RefAttributes<HTMLDivElement>>;

package/dist/components/base/code-block/code-block.types.d.ts

@@ -0,0 +1,46 @@
+import type { ComponentPropsWithoutRef, ReactNode } from 'react';
+import type { StringsProp } from '../../../lib/strings';
+export interface CodeBlockStrings {
+    copyAria: string;
+    copied: string;
+    copyError: string;
+    defaultLanguageLabel: string;
+    wrap: string;
+    contentAria: string;
+}
+export declare const defaultCodeBlockStrings: CodeBlockStrings;
+export interface CodeBlockLine {
+    /** Source text, always used for copying even when a renderLine is supplied. */
+    text: string;
+    /** Source line number, starting at startLine. */
+    number: number;
+    highlighted: boolean;
+    focused: boolean;
+    diff?: 'add' | 'remove';
+}
+export interface CodeBlockProps extends Omit<ComponentPropsWithoutRef<'div'>, 'children' | 'onCopy'> {
+    code: string;
+    language?: string;
+    filename?: string;
+    showLineNumbers?: boolean;
+    /** First displayed line number. @default 1 */
+    startLine?: number;
+    highlightLines?: readonly number[];
+    /** Dim other lines. Hover/focus restores context. Source numbers are one based. */
+    focusLines?: readonly number[];
+    diffLines?: Readonly<Record<number, 'add' | 'remove'>>;
+    /** Caller-prepared syntax rendering, e.g. token spans. Plain text is server safe and escaped by React. Never pass untrusted HTML. */
+    renderLine?: (line: CodeBlockLine) => ReactNode;
+    hideHeader?: boolean;
+    hideCopy?: boolean;
+    maxHeight?: number | string;
+    headerStart?: ReactNode;
+    headerActions?: ReactNode;
+    wrap?: boolean;
+    defaultWrap?: boolean;
+    onWrapChange?: (wrap: boolean) => void;
+    showWrapToggle?: boolean;
+    onCopy?: (code: string) => void;
+    onCopyError?: (error: unknown) => void;
+    strings?: StringsProp<CodeBlockStrings>;
+}

package/dist/components/base/code-block/index.d.ts

@@ -0,0 +1,2 @@
+export { CodeBlock } from './code-block';
+export { defaultCodeBlockStrings, type CodeBlockProps, type CodeBlockStrings, type CodeBlockLine } from './code-block.types';

package/dist/components/base/code-block/use-code-copy.d.ts

@@ -0,0 +1,6 @@
+/** Clipboard lifecycle for code display; callbacks and text stay per mount. */
+export declare function useCodeCopy(source: string, onCopyError?: (error: unknown) => void): {
+    copied: boolean;
+    failed: boolean;
+    copy: (text: string) => Promise<boolean>;
+};

package/dist/components/base/combobox/index.d.ts

@@ -0,0 +1,27 @@
+/**
+ * Base wrapper for `ui/combobox`.
+ *
+ * This family is the sole importer of `@/components/ui/combobox`: it re-exports
+ * the Base UI combobox anatomy untouched so every other layer composes the
+ * parts without reaching into `ui/`. The searchable recipe built on top of this
+ * anatomy — `Combobox`, `MultiCombobox`, `AsyncResourceCombobox`, and the
+ * headless hooks — lives in `features/combobox`.
+ *
+ * The compound root is exported as `ComboboxRoot` so the canonical `Combobox`
+ * name stays with the opinionated feature component.
+ */
+export { Combobox as ComboboxRoot, ComboboxInputTrigger, ComboboxValue, ComboboxClear, ComboboxPortal, ComboboxPositioner, ComboboxList, ComboboxItemIndicator, ComboboxEmpty, ComboboxStatus, ComboboxGroup, ComboboxGroupLabel, ComboboxCollection, ComboboxChips, ComboboxChip, ComboboxChipsInput, ComboboxBackdrop, ComboboxArrow, useComboboxFilter, } from '../../ui/combobox';
+import { type ComponentProps } from 'react';
+import { ComboboxItem as Item, ComboboxPopup as Popup, ComboboxInput as Input, ComboboxTrigger as Trigger, ComboboxSeparator as Separator } from '../../ui/combobox';
+import { type CollectionDensity } from '../popover/popover.recipes';
+export declare function ComboboxPopup({ className, ...props }: ComponentProps<typeof Popup>): import("react").FunctionComponentElement<import("@base-ui/react").AutocompletePopupProps>;
+export declare function ComboboxInput({ className, ...props }: ComponentProps<typeof Input>): import("react").FunctionComponentElement<import("@base-ui/react").AutocompleteInputProps>;
+export declare function ComboboxTrigger({ className, ...props }: ComponentProps<typeof Trigger>): import("react").FunctionComponentElement<import("@base-ui/react").ComboboxTriggerProps>;
+export declare function ComboboxItem({ className, size, density, children, ...props }: ComponentProps<typeof Item> & {
+    /** Vertical option rhythm. Defaults to the owning control size's rhythm. */
+    density?: CollectionDensity;
+}): import("react").FunctionComponentElement<import("@base-ui/react").ComboboxItemProps & {
+    size?: import("../../ui/combobox").ComboboxSize;
+}>;
+/** Shared collection divider, preserving Base UI separator semantics. */
+export declare function ComboboxSeparator({ className, ...props }: ComponentProps<typeof Separator>): import("react").FunctionComponentElement<import("@base-ui/react").ComboboxSeparatorProps>;