haze-ui 1.32.0 → 1.34.0

package/dist/types/components/Select/Select.d.ts

@@ -1,6 +1,28 @@
 import type { ComponentPropsWithoutRef, ReactNode, Ref } from 'react';
 import type { ControlOrValue } from 'react-use-control';
-import type { SelectVirtualizedConfig } from './SelectFloating';
+import type { SelectVirtualizedConfig } from './SelectFloating.js';
+/**
+ * One entry of the data-driven `options` prop (the Menu `items`
+ * precedent): a plain option, or a labelled group — the
+ * `<OptionGroup>` structure as data. Rendered through the same
+ * components the compound children API uses, so every mode (native
+ * single select, floating listbox, groups, filtering) treats both
+ * authoring forms identically.
+ */
+type SelectOption<T extends string | number = string> = {
+    /** Raw option value — the same contract as `<Option value>`. */
+    value: T;
+    label: ReactNode;
+    disabled?: boolean;
+} | {
+    /** Group heading (the `<OptionGroup label>` structure as data). */
+    label: string;
+    options: {
+        value: T;
+        label: ReactNode;
+        disabled?: boolean;
+    }[];
+};
 /**
  * Semantic slot classes (AntD v6 `classNames` shape), following the
  * data-slot names: `trigger` is the focusable control (native `<select>`
@@ -16,17 +38,40 @@ type SelectClassNames = {
     clearButton?: string;
     /** Selected-value chip in multiple mode (data-slot='item'). */
     item?: string;
-    /** Panel-top filter input in searchable mode (data-slot='input'). */
+    /** Search input (data-slot='input'): the panel-top filter in
+     * searchable mode, the inline trigger input in tags mode. */
     searchInput?: string;
 };
-type SelectProps = {
-    /** `string` in single mode, `string[]` when `multiple` is set. */
-    value?: ControlOrValue<string | string[]>;
+type SelectProps<T extends string | number = string> = {
+    /** The option value type: `T` in single mode, `T[]` when `multiple`
+     * is set (defaults to `string`). */
+    value?: ControlOrValue<T | T[]>;
     /**
      * Multiple selection mode (see SelectCoreProps.multiple). The
      * uncontrolled empty value is `[]` in this mode, `''` otherwise.
      */
     multiple?: boolean;
+    /**
+     * Tags mode (AntD `mode="tags"` / Mantine TagsInput shape): implies
+     * `multiple` selection and `searchable` — the search input moves
+     * into the trigger, which renders the selected chips and the inline
+     * input as one field. Typing filters the panel's options; Enter
+     * commits the highlighted option, or — when nothing matches —
+     * creates a new tag from the trimmed query (highlighted `Create
+     * "…"` row, deduped against existing option values and the current
+     * selection). Backspace on an empty query removes the last chip.
+     * Usable alone or with `multiple` set explicitly.
+     */
+    tags?: boolean;
+    /**
+     * Multiple/tags mode only: cap the selectable count. Once the
+     * selection reaches `maxCount`, options that are not selected are
+     * disabled — dimmed, `aria-disabled`, clicks and Enter rejected —
+     * until something is deselected (selected options stay removable,
+     * and the tags create row is suppressed at the cap). Works the same
+     * controlled and uncontrolled; single mode ignores it.
+     */
+    maxCount?: number;
     /**
      * Searchable single select (see SelectCoreProps.searchable): swaps
      * the native `<select>` for the floating listbox with a panel-top
@@ -74,13 +119,23 @@ type SelectProps = {
      */
     virtualized?: boolean | SelectVirtualizedConfig;
     /**
-     * Value callback for both modes: `string` in single mode, `string[]`
-     * when `multiple` is set — fired after the value updates. The native
+     * Value callback for both modes: `T` in single mode, `T[]` when
+     * `multiple` is set — fired after the value updates. The native
      * select `change` event stays available through `onChange` in single
      * mode (the historical contract); the floating paths have no native
      * event.
      */
-    onValuesChange?: (value: string | string[]) => void;
+    onValuesChange?: (value: T | T[]) => void;
+    /**
+     * Data-driven alternative to composed children (the Menu `items`
+     * precedent): plain `{value, label, disabled}` options and labelled
+     * `{label, options}` groups, rendered through the same `<Option>` /
+     * `<OptionGroup>` components the compound API uses — every mode
+     * (native select, floating listbox, search filtering, groups)
+     * behaves identically to the children form. Composes with children:
+     * the data options render first, the children after.
+     */
+    options?: SelectOption<T>[];
     /**
      * Placeholder text for the floating triggers (falls back to the
      * `select.placeholder` locale string). A native `<select>` has no
@@ -94,11 +149,28 @@ type SelectProps = {
     /**
      * Forwarded to the focusable element — the native `<select>` in plain
      * and clearable single mode, the trigger `<button>` when `multiple`
-     * or `searchable` render the floating engine. Form bridges and
-     * `ref.current.focus()` reach whichever mode renders.
+     * or `searchable` render the floating engine, and the inline
+     * `<input>` in tags mode. Form bridges and `ref.current.focus()`
+     * reach whichever mode renders.
+     */
+    ref?: Ref<HTMLSelectElement | HTMLButtonElement | HTMLInputElement>;
+    /**
+     * Form field name: renders hidden input bridge(s) next to the control
+     * so `<form action={fn}>` / `new FormData(form)` receive the value in
+     * every mode — one input in single mode (String(value)), one per
+     * entry under the same name in multiple mode (native repeated-field
+     * semantics). The empty sentinel (`''` / `[]`) submits nothing.
+     * Rerouted off the visual element because the floating trigger is a
+     * `<button>`, where `name` would be submitter-scoped; react-f0rm
+     * `FormItem` usage never passes it, so both worlds coexist.
+     */
+    name?: string;
+    /**
+     * Compound `<Option>` / `<OptionGroup>` children (the historical
+     * authoring form). Optional when `options` supplies the entries;
+     * both forms compose — `options` render first, children after.
      */
-    ref?: Ref<HTMLSelectElement | HTMLButtonElement>;
-    children: ReactNode;
-} & Omit<ComponentPropsWithoutRef<'select'>, 'value' | 'size' | 'multiple'>;
-export default function Select({ value: valueControl, multiple, searchable, clearable, loading, onSearch, maxTagCount, virtualized, size, className, classNames, children, onChange, onValuesChange, placeholder, ref, ...rest }: SelectProps): import("react").JSX.Element;
-export type { SelectClassNames, SelectProps };
+    children?: ReactNode;
+} & Omit<ComponentPropsWithoutRef<'select'>, 'value' | 'size' | 'multiple' | 'name'>;
+export default function Select<T extends string | number = string>({ value: valueControl, multiple, tags, maxCount, searchable, clearable, loading, onSearch, maxTagCount, virtualized, size, className, classNames, options, children, onChange, onValuesChange, placeholder, name, ref, ...rest }: SelectProps<T>): import("react").JSX.Element;
+export type { SelectClassNames, SelectProps, SelectOption };

package/dist/types/components/Select/SelectCore.d.ts

@@ -1,12 +1,13 @@
 import type { ComponentPropsWithoutRef, ReactNode, Ref } from 'react';
-import type { SelectVirtualizedConfig } from './SelectFloating';
-import type { SelectClassNames } from './Select';
-type SelectCoreProps = {
-    /** `string` in single mode, `string[]` when `multiple` is set. */
-    value: string | string[];
-    /** Notifies the next value: `string` in single mode, `string[]` when
+import type { SelectVirtualizedConfig } from './SelectFloating.js';
+import type { SelectClassNames } from './Select.js';
+type SelectCoreProps<T extends string | number = string> = {
+    /** The option value type: `T` in single mode, `T[]` when `multiple`
+     * is set. */
+    value: T | T[];
+    /** Notifies the next value: `T` in single mode, `T[]` when
      * `multiple` is set. */
-    onChange: (value: string | string[]) => void;
+    onChange: (value: T | T[]) => void;
     /** Native change event passthrough — invoked with the DOM event after
      * `onChange`, so a spread can never override the controlled callback.
      * Single mode only; the floating paths have no native select element. */
@@ -20,12 +21,24 @@ type SelectCoreProps = {
      */
     placeholder?: string;
     /**
-     * Multiple selection mode: the native `<select>` is replaced by a
-     * button trigger rendering the selected values as removable Chips,
-     * opening a floating multi-select listbox. Default (`false`) keeps
-     * the native single-select path untouched.
+     * Multiple selection mode (see SelectFloatingProps.multiple): chips
+     * in the trigger, toggling options, panel stays open across picks.
+     * Default (`false`) keeps the native single-select path untouched.
      */
     multiple?: boolean;
+    /**
+     * Tags mode (see SelectProps.tags in ./Select): implies multiple and
+     * searchable — routes to the floating engine with the inline search
+     * input in the trigger. Ignored by the native single-select path.
+     */
+    tags?: boolean;
+    /**
+     * Multiple/tags mode only: cap the selectable count — unselected
+     * options disable once the cap is reached (see
+     * SelectFloatingProps.maxCount). The native single-select path
+     * ignores it.
+     */
+    maxCount?: number;
     /**
      * Swap the single-mode native `<select>` for the floating listbox
      * engine (the one `multiple` uses) with a search input at the top of
@@ -74,7 +87,12 @@ type SelectCoreProps = {
      * native `<select>` ignores it — it handles long lists natively.
      */
     virtualized?: boolean | SelectVirtualizedConfig;
-    children: ReactNode;
+    /**
+     * Compound `<Option>` / `<OptionGroup>` children — the owning Select
+     * composes its data-driven `options` in here ahead of them. Optional
+     * for callers supplying entries entirely another way.
+     */
+    children?: ReactNode;
     className?: string;
     /** Slot classes (see SelectProps.classNames in ./Select). */
     classNames?: SelectClassNames;
@@ -83,7 +101,7 @@ type SelectCoreProps = {
      * and clearable single mode, the trigger `<button>` when `multiple`
      * or `searchable` render the floating engine.
      */
-    ref?: Ref<HTMLSelectElement | HTMLButtonElement>;
+    ref?: Ref<HTMLSelectElement | HTMLButtonElement | HTMLInputElement>;
 } & Omit<ComponentPropsWithoutRef<'select'>, 'value' | 'onChange' | 'size' | 'multiple'>;
-export default function SelectCore({ value, onChange, onNativeChange, multiple, searchable, clearable, loading, onSearch, maxTagCount, size, virtualized, className, classNames, placeholder, children, ref, ...rest }: SelectCoreProps): import("react").JSX.Element;
+export default function SelectCore<T extends string | number = string>({ value, onChange, onNativeChange, multiple, tags, maxCount, searchable, clearable, loading, onSearch, maxTagCount, size, virtualized, className, classNames, placeholder, children, ref, ...rest }: SelectCoreProps<T>): import("react").JSX.Element;
 export type { SelectCoreProps };

package/dist/types/components/Select/SelectFloating.d.ts

@@ -1,6 +1,6 @@
 import type { ComponentPropsWithoutRef, Ref } from 'react';
-import type { SelectClassNames } from './Select';
-import type { SelectEntryData } from './select-options';
+import type { SelectClassNames } from './Select.js';
+import type { SelectEntryData } from './select-options.js';
 /** Metrics override for the `virtualized` option list of the floating
  * Select paths (multiple, or single with `searchable`). */
 type SelectVirtualizedConfig = {
@@ -17,24 +17,34 @@ type SelectVirtualizedConfig = {
      * to VirtualList's 5. */
     overscan?: number;
 };
-type SelectFloatingProps = {
+type SelectFloatingProps<T extends string | number = string> = {
     /**
-     * Current selection — `string[]` in multiple mode, `string` in single
-     * mode. A stray value of the other shape is normalized (empty
-     * selection / empty value) rather than crashing.
+     * Current selection — `T[]` in multiple mode, `T` in single mode. A
+     * stray value of the other shape is normalized (empty selection /
+     * empty value) rather than crashing.
      */
-    value: string | string[];
+    value: T | T[];
     /**
-     * Notifies the next value: `string[]` in multiple mode, `string` in
-     * single mode — the single-mode option pick also closes the panel.
+     * Notifies the next value: `T[]` in multiple mode, `T` in single
+     * mode — the single-mode option pick also closes the panel.
      */
-    onChange: (value: string | string[]) => void;
+    onChange: (value: T | T[]) => void;
     /** Extracted <Option>/<option>/<OptionGroup> children of the owning
      * Select, grouping structure preserved. */
-    entries: SelectEntryData[];
+    entries: SelectEntryData<T>[];
     /** Multiple selection mode: chips in the trigger, toggling options,
      * panel stays open across picks. Single mode closes on pick. */
     multiple: boolean;
+    /**
+     * Tags mode (see SelectProps.tags in ./Select): implies multiple
+     * selection — the search input moves into the trigger, which renders
+     * the selected chips and the inline input as one field. Typing
+     * filters the panel's options; Enter commits the highlighted option
+     * or, when nothing matches, creates a new tag from the trimmed query
+     * (deduped against existing option values and the current
+     * selection). Backspace on an empty query removes the last chip.
+     */
+    tags?: boolean;
     /** Falls back to the `select.placeholder` locale string. */
     placeholder?: string;
     size?: 'sm' | 'md' | 'lg';
@@ -84,6 +94,14 @@ type SelectFloatingProps = {
      * presentational.
      */
     maxTagCount?: number;
+    /**
+     * Multiple/tags mode only: once the selection reaches this count,
+     * options that are not currently selected are disabled — dimmed,
+     * `aria-disabled`, clicks and Enter rejected — until something is
+     * deselected. Selected options stay removable; the tags create row
+     * is suppressed at the cap. Single mode ignores it.
+     */
+    maxCount?: number;
     /**
      * Render the options list through VirtualList so thousand-option
      * listboxes mount only the visible window (plus overscan) instead of
@@ -92,8 +110,9 @@ type SelectFloatingProps = {
      */
     virtualized?: boolean | SelectVirtualizedConfig;
     className?: string;
-    /** Forwarded to the trigger `<button>` element. */
-    ref?: Ref<HTMLButtonElement>;
+    /** Forwarded to the trigger — the `<button>` element, or the inline
+     * `<input>` in tags mode. */
+    ref?: Ref<HTMLButtonElement | HTMLInputElement>;
 } & Omit<ComponentPropsWithoutRef<'button'>, 'value' | 'onChange' | 'size' | 'type' | 'children'>;
-export default function SelectFloating({ value, onChange, entries, multiple, placeholder, searchable, clearable, loading, onSearch, maxTagCount, size, virtualized, className, classNames, ref, ...rest }: SelectFloatingProps): import("react").JSX.Element;
+export default function SelectFloating<T extends string | number = string>({ value, onChange, entries, multiple, tags, maxCount, placeholder, searchable, clearable, loading, onSearch, maxTagCount, size, virtualized, className, classNames, ref, ...rest }: SelectFloatingProps<T>): import("react").JSX.Element;
 export type { SelectFloatingProps, SelectVirtualizedConfig };

package/dist/types/components/Select/index.d.ts

@@ -1,8 +1,8 @@
-export { default as Select } from './Select';
-export type { SelectClassNames, SelectProps } from './Select';
-export { default as SelectCore } from './SelectCore';
-export type { SelectCoreProps } from './SelectCore';
-export { default as Option } from './Option';
-export type { OptionProps } from './Option';
-export { default as OptionGroup } from './OptionGroup';
-export type { OptionGroupProps } from './OptionGroup';
+export { default as Select } from './Select.js';
+export type { SelectClassNames, SelectProps, SelectOption } from './Select.js';
+export { default as SelectCore } from './SelectCore.js';
+export type { SelectCoreProps } from './SelectCore.js';
+export { default as Option } from './Option.js';
+export type { OptionProps } from './Option.js';
+export { default as OptionGroup } from './OptionGroup.js';
+export type { OptionGroupProps } from './OptionGroup.js';

package/dist/types/components/Select/select-options.d.ts

@@ -1,8 +1,14 @@
 import type { ReactNode } from 'react';
-/** One selectable entry extracted from the Select's JSX children. */
-export type SelectOptionData = {
-    value: string;
+/** One selectable entry extracted from the Select's JSX children. The
+ * value keeps the raw `<Option value>` type (no DOM stringification —
+ * the floating paths compare raw values). */
+export type SelectOptionData<T extends string | number = string> = {
+    value: T;
     label: ReactNode;
+    /** Option-level disabled state (from `<Option disabled>` or the
+     * data-driven `options` prop): the row renders dimmed/aria-disabled
+     * and both the click and keyboard pick paths reject it. */
+    disabled?: boolean;
 };
 /**
  * One rendering slot of the Select's children: a top-level option, or a
@@ -10,13 +16,13 @@ export type SelectOptionData = {
  * The flat keyboard-navigation order is the depth-first traversal of
  * this structure, so highlighting runs continuously across groups.
  */
-export type SelectEntryData = {
+export type SelectEntryData<T extends string | number = string> = {
     kind: 'option';
-    option: SelectOptionData;
+    option: SelectOptionData<T>;
 } | {
     kind: 'group';
     label: string;
-    options: SelectOptionData[];
+    options: SelectOptionData<T>[];
 };
 /**
  * Flattens the Select's children — <Option> and plain <option> elements
@@ -25,7 +31,7 @@ export type SelectEntryData = {
  * order. Children without a resolvable value are ignored, the same way
  * a native select treats stray non-option nodes.
  */
-export declare function extractSelectOptions(children: ReactNode): SelectOptionData[];
+export declare function extractSelectOptions<T extends string | number = string>(children: ReactNode): SelectOptionData<T>[];
 /**
  * Extracts the Select's children preserving the grouping structure:
  * top-level options stay single entries, <OptionGroup>/<optgroup>
@@ -33,10 +39,10 @@ export declare function extractSelectOptions(children: ReactNode): SelectOptionD
  * nesting is not recursive — a native <optgroup> cannot contain another
  * group — and groups left without any resolvable option are dropped.
  */
-export declare function extractSelectEntries(children: ReactNode): SelectEntryData[];
+export declare function extractSelectEntries<T extends string | number = string>(children: ReactNode): SelectEntryData<T>[];
 /** Depth-first flattening of the entry structure (groups in document
  * order) — the order keyboard navigation walks. */
-export declare function flattenSelectEntries(entries: SelectEntryData[]): SelectOptionData[];
+export declare function flattenSelectEntries<T extends string | number = string>(entries: SelectEntryData<T>[]): SelectOptionData<T>[];
 /**
  * Textual form of an option's label for string-only contexts: the
  * search filter and the `+N` overflow tooltip. String/number labels
@@ -50,4 +56,4 @@ export declare function selectOptionText(label: ReactNode): string;
  * whose options all miss the query are dropped entirely, keeping the
  * rendered list free of orphaned headers.
  */
-export declare function filterSelectEntries(entries: SelectEntryData[], query: string): SelectEntryData[];
+export declare function filterSelectEntries<T extends string | number = string>(entries: SelectEntryData<T>[], query: string): SelectEntryData<T>[];

package/dist/types/components/Sidebar/index.d.ts

@@ -1,4 +1,4 @@
-export { default as Sidebar } from './Sidebar';
-export type { SidebarProps } from './Sidebar';
-export { SidebarGroup, SidebarItem, SidebarFooter, SidebarToggle } from './Sidebar';
-export type { SidebarGroupProps, SidebarItemProps, SidebarFooterProps, SidebarToggleProps, } from './Sidebar';
+export { default as Sidebar } from './Sidebar.js';
+export type { SidebarProps } from './Sidebar.js';
+export { SidebarGroup, SidebarItem, SidebarFooter, SidebarToggle } from './Sidebar.js';
+export type { SidebarGroupProps, SidebarItemProps, SidebarFooterProps, SidebarToggleProps, } from './Sidebar.js';

package/dist/types/components/Signature/index.d.ts

@@ -1,2 +1,2 @@
-export { default as Signature } from './Signature';
-export type { SignatureProps } from './Signature';
+export { default as Signature } from './Signature.js';
+export type { SignatureProps } from './Signature.js';

package/dist/types/components/Skeleton/index.d.ts

@@ -1,2 +1,2 @@
-export { default as Skeleton } from './Skeleton';
-export type { SkeletonProps } from './Skeleton';
+export { default as Skeleton } from './Skeleton.js';
+export type { SkeletonProps } from './Skeleton.js';

package/dist/types/components/Slider/index.d.ts

@@ -1,4 +1,4 @@
-export { default as Slider } from './Slider';
-export type { SliderProps } from './Slider';
-export { default as SliderCore } from './SliderCore';
-export type { SliderCoreProps } from './SliderCore';
+export { default as Slider } from './Slider.js';
+export type { SliderProps } from './Slider.js';
+export { default as SliderCore } from './SliderCore.js';
+export type { SliderCoreProps } from './SliderCore.js';

package/dist/types/components/Sources/index.d.ts

@@ -1,2 +1,2 @@
-export { default as Sources } from './Sources';
-export type { SourcesProps, SourceItem } from './Sources';
+export { default as Sources } from './Sources.js';
+export type { SourcesProps, SourceItem } from './Sources.js';

package/dist/types/components/Sparkline/Sparkline.d.ts

@@ -24,8 +24,8 @@ type SparklineProps = {
     /** `area` adds a translucent token fill under the line. */
     variant?: 'line' | 'area';
     /** Semantic stroke color for the trend. */
-    tone?: 'primary' | 'success' | 'danger' | 'warning' | 'info';
+    color?: 'default' | 'primary' | 'success' | 'warning' | 'danger' | 'info';
     className?: string;
-} & Omit<ComponentPropsWithoutRef<'svg'>, 'children'>;
-export default function Sparkline({ data, width, height, variant, tone, className, ...rest }: SparklineProps): import("react").JSX.Element;
+} & Omit<ComponentPropsWithoutRef<'svg'>, 'children' | 'color'>;
+export default function Sparkline({ data, width, height, variant, color, className, ...rest }: SparklineProps): import("react").JSX.Element;
 export type { SparklineProps };

package/dist/types/components/Sparkline/index.d.ts

@@ -1,3 +1,3 @@
-export { default as Sparkline } from './Sparkline';
-export type { SparklineProps } from './Sparkline';
-export { toneStrokes as sparklineToneStrokes, toneFills as sparklineToneFills } from './sparkline-styles';
+export { default as Sparkline } from './Sparkline.js';
+export type { SparklineProps } from './Sparkline.js';
+export { colorStrokes as sparklineToneStrokes, colorFills as sparklineToneFills } from './sparkline-styles.js';

package/dist/types/components/Sparkline/sparkline-styles.d.ts

@@ -1,5 +1,5 @@
 /**
- * Shared Sparkline skin — the base class plus tone→stroke / tone→fill
+ * Shared Sparkline skin — the base class plus color→stroke / color→fill
  * variant maps the `Sparkline` component wears. Living in their own module
  * keeps the component file free of style internals (react-refresh
  * boundary) and lets the maps ship as public constants
@@ -8,16 +8,18 @@
  * CSS into `haze-ui/css/sparkline.css` with them.
  */
 export declare const base: import("@linaria/core").LinariaClassName;
-/** Stroke color per tone; worn by the line path. */
-export declare const toneStrokes: {
+/** Stroke color per semantic color; worn by the line path. */
+export declare const colorStrokes: {
+    readonly default: import("@linaria/core").LinariaClassName;
     readonly primary: import("@linaria/core").LinariaClassName;
     readonly success: import("@linaria/core").LinariaClassName;
     readonly danger: import("@linaria/core").LinariaClassName;
     readonly warning: import("@linaria/core").LinariaClassName;
     readonly info: import("@linaria/core").LinariaClassName;
 };
-/** Translucent area fill per tone; worn by the fill path of the `area` variant. */
-export declare const toneFills: {
+/** Translucent area fill per semantic color; worn by the fill path of the `area` variant. */
+export declare const colorFills: {
+    readonly default: import("@linaria/core").LinariaClassName;
     readonly primary: import("@linaria/core").LinariaClassName;
     readonly success: import("@linaria/core").LinariaClassName;
     readonly danger: import("@linaria/core").LinariaClassName;

package/dist/types/components/Spinner/Spinner.d.ts

@@ -1,6 +1,9 @@
+import type { Ref } from 'react';
 type SpinnerProps = {
     size?: 'sm' | 'md' | 'lg';
     className?: string;
+    /** Forwarded to the root span (data-slot='spinner'). */
+    ref?: Ref<HTMLSpanElement>;
 };
-export default function Spinner({ size, className, }: SpinnerProps): import("react").JSX.Element;
+export default function Spinner({ size, className, ref, }: SpinnerProps): import("react").JSX.Element;
 export type { SpinnerProps };

package/dist/types/components/Spinner/index.d.ts

@@ -1,2 +1,2 @@
-export { default as Spinner } from './Spinner';
-export type { SpinnerProps } from './Spinner';
+export { default as Spinner } from './Spinner.js';
+export type { SpinnerProps } from './Spinner.js';

package/dist/types/components/Splitter/Splitter.d.ts

@@ -0,0 +1,33 @@
+import type { ComponentPropsWithoutRef, ReactNode } from 'react';
+import type { ControlOrValue } from 'react-use-control';
+type SplitterProps = {
+    /** Layout axis: horizontal stacks panes left-to-right, vertical
+     * top-to-bottom. */
+    orientation?: 'horizontal' | 'vertical';
+    /** Pane sizes in percent of the pane area (the container minus the
+     * dividers), one entry per pane, summing to 100. Accepts a Control for
+     * controlled usage or a plain array as the uncontrolled initial
+     * value (equal split when omitted). */
+    sizes?: ControlOrValue<number[]>;
+    /** Fired on every applied change — pointer moves and keyboard steps
+     * alike — with the full next sizes array. */
+    onSizesChange?: (sizes: number[]) => void;
+    children?: ReactNode;
+    className?: string;
+} & Omit<ComponentPropsWithoutRef<'div'>, 'children'>;
+export declare function Splitter({ orientation, sizes: sizesControl, onSizesChange, children, className, ...rest }: SplitterProps): import("react").JSX.Element;
+type SplitterPaneProps = {
+    /** Minimum size in percent of the pane area. */
+    min?: number;
+    /** Maximum size in percent of the pane area. */
+    max?: number;
+    /** Opt the pane into divider collapse triggers: every divider
+     * touching it grows a button that zeroes the pane (the partner
+     * absorbs its share) and, once collapsed, expands it back to its
+     * pre-collapse size. */
+    collapsible?: boolean;
+    children?: ReactNode;
+    className?: string;
+} & Omit<ComponentPropsWithoutRef<'div'>, 'min' | 'max'>;
+export declare function SplitterPane({ min, max, collapsible, children, className, ...rest }: SplitterPaneProps): import("react").JSX.Element;
+export type { SplitterProps, SplitterPaneProps };

package/dist/types/components/Splitter/index.d.ts

@@ -0,0 +1,2 @@
+export { Splitter, SplitterPane } from './Splitter.js';
+export type { SplitterProps, SplitterPaneProps } from './Splitter.js';

package/dist/types/components/Spoiler/index.d.ts

@@ -1,2 +1,2 @@
-export { default as Spoiler } from './Spoiler';
-export type { SpoilerProps } from './Spoiler';
+export { default as Spoiler } from './Spoiler.js';
+export type { SpoilerProps } from './Spoiler.js';

package/dist/types/components/Stat/index.d.ts

@@ -1,2 +1,2 @@
-export { Stat, StatGroup } from './Stat';
-export type { StatProps, StatGroupProps } from './Stat';
+export { Stat, StatGroup } from './Stat.js';
+export type { StatProps, StatGroupProps } from './Stat.js';

package/dist/types/components/StatusBar/index.d.ts

@@ -1,3 +1,3 @@
-export { default as StatusBar } from './StatusBar';
-export { StatusItem } from './StatusBar';
-export type { StatusBarProps, StatusItemProps } from './StatusBar';
+export { default as StatusBar } from './StatusBar.js';
+export { StatusItem } from './StatusBar.js';
+export type { StatusBarProps, StatusItemProps } from './StatusBar.js';

package/dist/types/components/StepTimeline/StepTimeline.d.ts

@@ -1,5 +1,6 @@
 import type { ReactNode } from 'react';
-type StepStatus = 'pending' | 'active' | 'done' | 'error';
+import type { ControlOrValue } from 'react-use-control';
+type StepStatus = 'pending' | 'active' | 'running' | 'done' | 'error';
 type StepTimelineProps = {
     children: ReactNode;
     className?: string;
@@ -8,9 +9,23 @@ type StepTimelineItemProps = {
     label: ReactNode;
     description?: ReactNode;
     status?: StepStatus;
+    /** Timing/duration shown muted at the inline end of the label, e.g. `'2.4s'`. */
+    time?: ReactNode;
+    /** Replaces the glyph inside the status marker (the marker ring keeps its status color). */
+    icon?: ReactNode;
+    /** Turns the header into a disclosure toggle for `content`/child steps. */
+    collapsible?: boolean;
+    /** Extra content revealed below the header while expanded. */
+    content?: ReactNode;
+    /** Controlled/uncontrolled expanded state of a collapsible item (default `false`). */
+    open?: ControlOrValue<boolean>;
+    /** Fires on every expand/collapse transition, whatever drove it. */
+    onOpenChange?: (open: boolean) => void;
+    /** Nested `StepTimelineItem`s — rendered as an indented sub-timeline. */
+    children?: ReactNode;
     className?: string;
 };
-declare function StepTimelineItem({ label, description, status, className }: StepTimelineItemProps): import("react").JSX.Element;
+declare function StepTimelineItem({ label, description, status, time, icon, collapsible, content, open: openControl, onOpenChange, children, className, }: StepTimelineItemProps): import("react").JSX.Element;
 declare function StepTimeline({ children, className }: StepTimelineProps): import("react").JSX.Element;
 export default StepTimeline;
 export { StepTimelineItem };

package/dist/types/components/StepTimeline/index.d.ts

@@ -1,2 +1,2 @@
-export { default as StepTimeline, StepTimelineItem } from './StepTimeline';
-export type { StepTimelineProps, StepTimelineItemProps, StepStatus } from './StepTimeline';
+export { default as StepTimeline, StepTimelineItem } from './StepTimeline.js';
+export type { StepTimelineProps, StepTimelineItemProps, StepStatus } from './StepTimeline.js';

package/dist/types/components/Stepper/index.d.ts

@@ -1,4 +1,4 @@
-export { default as Stepper } from './Stepper';
-export type { StepperProps } from './Stepper';
-export { default as Step } from './Step';
-export type { StepProps } from './Step';
+export { default as Stepper } from './Stepper.js';
+export type { StepperProps } from './Stepper.js';
+export { default as Step } from './Step.js';
+export type { StepProps } from './Step.js';

package/dist/types/components/StreamingText/index.d.ts

@@ -1,2 +1,2 @@
-export { default as StreamingText } from './StreamingText';
-export type { StreamingTextProps } from './StreamingText';
+export { default as StreamingText } from './StreamingText.js';
+export type { StreamingTextProps } from './StreamingText.js';

package/dist/types/components/SwipeAction/index.d.ts

@@ -1,2 +1,2 @@
-export { default as SwipeAction } from './SwipeAction';
-export type { SwipeActionProps } from './SwipeAction';
+export { default as SwipeAction } from './SwipeAction.js';
+export type { SwipeActionProps } from './SwipeAction.js';

package/dist/types/components/Switch/Switch.d.ts

@@ -3,9 +3,19 @@ import type { ControlOrValue } from 'react-use-control';
 type SwitchProps = {
     checked?: ControlOrValue<boolean>;
     size?: 'sm' | 'md' | 'lg';
+    /**
+     * Form field name: renders a hidden checkbox bridge next to the
+     * button so `<form action={fn}>` / `new FormData(form)` receive
+     * `on` while checked (native successful-control semantics —
+     * unchecked submits nothing). Without it the switch is form-silent;
+     * react-f0rm `FormItem` usage never passes it, so both worlds
+     * coexist. A `<button>`'s own `name` is submitter-scoped, hence the
+     * rerouting.
+     */
+    name?: string;
     /** Forwarded to the underlying switch `<button>` — form bridges and
      * `ref.current.focus()` reach. */
     ref?: Ref<HTMLButtonElement>;
-} & Omit<ComponentPropsWithoutRef<'button'>, 'type' | 'checked' | 'onChange'>;
-export default function Switch({ checked: checkedControl, size, className, onClick, ref, ...rest }: SwitchProps): import("react").JSX.Element;
+} & Omit<ComponentPropsWithoutRef<'button'>, 'type' | 'checked' | 'onChange' | 'name'>;
+export default function Switch({ checked: checkedControl, size, className, onClick, name, ref, ...rest }: SwitchProps): import("react").JSX.Element;
 export type { SwitchProps };