haze-ui 1.33.0 → 1.34.0

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

@@ -1,2 +1,2 @@
-export { ResizableGroup, ResizablePanel, ResizableHandle } from './Resizable';
-export type { ResizableGroupProps, ResizablePanelProps, ResizableHandleProps, } from './Resizable';
+export { ResizableGroup, ResizablePanel, ResizableHandle } from './Resizable.js';
+export type { ResizableGroupProps, ResizablePanelProps, ResizableHandleProps, } from './Resizable.js';

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

@@ -1,2 +1,2 @@
-export { default as Result } from './Result';
-export type { ResultProps, ResultStatus } from './Result';
+export { default as Result } from './Result.js';
+export type { ResultProps, ResultStatus } from './Result.js';

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

@@ -0,0 +1,56 @@
+import type { AnyExtension, Editor } from '@tiptap/core';
+import type { ComponentPropsWithoutRef, ReactNode, Ref } from 'react';
+import type { ControlOrValue } from 'react-use-control';
+/**
+ * Imperative surface for power users — everything the editor can do is
+ * reachable through the Tiptap instance (`chain()`, `can()`, schema,
+ * storage, …). Null before the editor mounts (SSR-safe first paint,
+ * `immediatelyRender: false`) and after unmount.
+ */
+type RichTextEditorHandle = {
+    /** The live Tiptap `Editor` instance, or null when not mounted. */
+    getEditor: () => Editor | null;
+};
+type RichTextEditorProps = {
+    /**
+     * HTML content (`editor.getHTML()` shape). Controlled and uncontrolled
+     * modes share the one prop: external changes are pushed into the editor
+     * only when they differ from the current document, so an equal value
+     * never rebuilds the doc or drops the caret; internal edits publish back
+     * through the control.
+     */
+    value?: ControlOrValue<string>;
+    /** Hint shown while the document is empty (extension-placeholder). */
+    placeholder?: string;
+    /** Whether the document can be edited. Defaults to true. */
+    editable?: ControlOrValue<boolean>;
+    /**
+     * Replaces the built-in formatting toolbar; `false` renders none.
+     * Custom toolbars get the same chrome (padding + divider) and can grab
+     * the editor through the `ref` handle or `useEditorState`.
+     */
+    toolbar?: ReactNode | false;
+    /**
+     * Extra Tiptap extensions appended after the default set
+     * (starter-kit + link + placeholder) — tables, task lists, mentions…
+     */
+    extensions?: AnyExtension[];
+    /**
+     * Remount escape hatch: changing this destroys and recreates the
+     * editor (fresh history, re-read `extensions`/`placeholder`/`value`).
+     */
+    editorKey?: string;
+    /**
+     * Form field name: bridges the HTML value into native form submits
+     * (`new FormData(form)`, server actions) through a hidden input.
+     */
+    name?: string;
+    /**
+     * Imperative handle exposing the Tiptap instance (see
+     * RichTextEditorHandle). `aria-label`/`aria-labelledby` props are
+     * forwarded to the contenteditable textbox itself, not the root.
+     */
+    ref?: Ref<RichTextEditorHandle>;
+} & Omit<ComponentPropsWithoutRef<'div'>, 'value' | 'placeholder' | 'contentEditable' | 'suppressContentEditableWarning' | 'children'>;
+export default function RichTextEditor({ value: valueControl, placeholder, editable: editableControl, toolbar, extensions, editorKey, name, className, 'aria-label': ariaLabel, 'aria-labelledby': ariaLabelledBy, ref, ...rest }: RichTextEditorProps): import("react").JSX.Element;
+export type { RichTextEditorProps, RichTextEditorHandle };

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

@@ -0,0 +1,2 @@
+export { default as RichTextEditor } from './RichTextEditor.js';
+export type { RichTextEditorProps, RichTextEditorHandle } from './RichTextEditor.js';

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

@@ -0,0 +1,113 @@
+import type { ComponentPropsWithoutRef, ReactNode, Ref } from 'react';
+import type { ControlOrValue } from 'react-use-control';
+type ScheduleView = 'day' | 'week' | 'month';
+type ScheduleEventColor = 'primary' | 'success' | 'danger' | 'warning' | 'info' | 'neutral';
+type ScheduleEvent = {
+    id: string;
+    start: Date | string;
+    end: Date | string;
+    title: ReactNode;
+    color?: ScheduleEventColor;
+    allDay?: boolean;
+};
+type ScheduleEventChange = {
+    id: string;
+    start: Date;
+    end: Date;
+};
+type ScheduleBusinessHours = {
+    start: number;
+    end: number;
+};
+type ScheduleViewLabels = Partial<Record<ScheduleView, string>>;
+/**
+ * Semantic slot classes (AntD v6 `classNames` shape) for Schedule: one
+ * record themes the toolbar and both grid kinds plus every event chip.
+ * Consumer classes are appended at the end of each part's class list
+ * (able to override component defaults).
+ */
+type ScheduleClassNames = {
+    /** The root container (`data-slot='schedule'`). */
+    root?: string;
+    /** The toolbar strip — nav buttons, title and the view switcher
+     *  (`data-slot='toolbar'`). */
+    toolbar?: string;
+    /** The day/week time grid (`data-slot='time-grid'`), header and
+     *  all-day rows included. */
+    timeGrid?: string;
+    /** The month grid (`data-slot='month-grid'`). */
+    monthGrid?: string;
+    /** Every event chip across all views (`data-slot='event'`), the
+     *  "+N" overflow chips excepted (`data-slot='overflow-chip'`). */
+    event?: string;
+};
+type ScheduleProps = {
+    /** Events to lay out. The component never mutates them — drag and
+     * keyboard rescheduling surface through `onEventChange` and the
+     * consumer owns the data. */
+    events: ScheduleEvent[];
+    /** Active view. Uncontrolled (`'week'`) or controlled. */
+    view?: ControlOrValue<ScheduleView>;
+    onViewChange?: (view: ScheduleView) => void;
+    /** Anchor date the grid is centered on (defaults to today). */
+    date?: ControlOrValue<Date>;
+    onDateChange?: (date: Date) => void;
+    /** Snap granularity in minutes for the day/week time grid (default 60). */
+    slotMinutes?: number;
+    /** Hour numbers (0–23); rows outside the window render muted. */
+    businessHours?: ScheduleBusinessHours;
+    /** Current-time line in day/week views (default true). */
+    nowIndicator?: boolean;
+    onEventClick?: (event: ScheduleEvent) => void;
+    /** Fired when an event is moved by drag or arrow keys: duration is
+     * preserved, start/end snapped to `slotMinutes`. */
+    onEventChange?: (change: ScheduleEventChange) => void;
+    /** Fired when a month-view day cell (or its "+N" overflow chip) is
+     * activated. Cells stay inert unless this is provided. */
+    onDayClick?: (date: Date) => void;
+    todayLabel?: string;
+    prevLabel?: string;
+    nextLabel?: string;
+    viewLabels?: ScheduleViewLabels;
+    /** BCP 47 locale for weekday/month/time formatting; falls back to the
+     * LocaleProvider chain, then the browser default. */
+    locale?: string;
+    /**
+     * Semantic slot classes (AntD v6 `classNames` shape), keyed by the
+     * structural parts (see {@link ScheduleClassNames}). Slot classes are
+     * appended at the end of each part's class list; per-part `className`
+     * stays on the root and still lands after the `root` slot. Not
+     * passing it renders identical output.
+     */
+    classNames?: ScheduleClassNames;
+    className?: string;
+    /** Forwarded to the root container `<div>` (`data-slot='schedule'`). */
+    ref?: Ref<HTMLDivElement>;
+} & ComponentPropsWithoutRef<'div'>;
+type DropPosition = {
+    dayIndex: number;
+    minutes: number;
+};
+type DropContext = {
+    /** Start-of-day for every visible column, in reading order. */
+    days: Date[];
+    eventStart: Date;
+    eventEnd: Date;
+    /** Column index / minute-of-day the pointer grabbed the event at. */
+    grabDayIndex: number;
+    grabMinutes: number;
+    slotMinutes: number;
+};
+/**
+ * Drop-position → rescheduled range, pure so the snap/day-shift/duration
+ * math can be unit-tested without a DOM. The day index is clamped into
+ * the visible columns, the raw pointer delta (drop − grab) shifts the
+ * event civilly, the start snaps to the nearest `slotMinutes` boundary
+ * of its day, and the original duration is re-attached.
+ */
+export declare function computeDropTime(position: DropPosition, context: DropContext): {
+    start: Date;
+    end: Date;
+};
+export default function Schedule({ events, view: viewControl, onViewChange, date: dateControl, onDateChange, slotMinutes, businessHours, nowIndicator, onEventClick, onEventChange, onDayClick, todayLabel, prevLabel, nextLabel, viewLabels, locale, classNames, className, ref, ...rest }: ScheduleProps): import("react").JSX.Element;
+export type { ScheduleProps, ScheduleClassNames, ScheduleEvent, ScheduleView, ScheduleEventChange, ScheduleEventColor, ScheduleBusinessHours, ScheduleViewLabels, };

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

@@ -0,0 +1,2 @@
+export { default as Schedule } from './Schedule.js';
+export type { ScheduleProps, ScheduleClassNames, ScheduleEvent, ScheduleView, ScheduleEventChange, ScheduleEventColor, ScheduleBusinessHours, ScheduleViewLabels, } from './Schedule.js';

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

@@ -1,8 +1,32 @@
-import type { ReactNode } from 'react';
+import type { ComponentPropsWithoutRef, ReactNode, Ref } from 'react';
+import type { ScrollbarMode } from './ScrollAreaContext.js';
 type ScrollAreaProps = {
+    /**
+     * Caps the scroll area's height (px when numeric) — the long-standing
+     * sugar sizing knob. Compound usage can size the root via CSS instead.
+     */
     maxHeight?: number | string;
+    /**
+     * Scrollbar visibility mode: `'hover'` (default) shows thumbs while
+     * the pointer is over the scroll area, `'always'` keeps them on,
+     * `'scroll'` flashes them after each scroll.
+     */
+    type?: ScrollbarMode;
+    /**
+     * Accessible name for the scrollable viewport (it becomes focusable
+     * while its content overflows, so keyboard users need a name). An
+     * `aria-label` on `<ScrollViewport>` wins.
+     */
+    label?: string;
     className?: string;
+    /**
+     * Sugar path: plain content is wrapped in an implicit viewport with
+     * overlay scrollbars. Compound path: include `<ScrollViewport>` (or
+     * `<Scrollbar>`/`<ScrollThumb>`) children and they compose as given —
+     * an explicit `<Scrollbar>` suppresses the auto-appended pair.
+     */
     children: ReactNode;
-};
-export default function ScrollArea({ maxHeight, className, children, }: ScrollAreaProps): import("react").JSX.Element;
+    ref?: Ref<HTMLDivElement>;
+} & Omit<ComponentPropsWithoutRef<'div'>, 'children'>;
+export default function ScrollArea({ maxHeight, type, label, className, children, ref, style: consumerStyle, ...rest }: ScrollAreaProps): import("react").JSX.Element;
 export type { ScrollAreaProps };

package/dist/types/components/ScrollArea/ScrollAreaContext.d.ts

@@ -0,0 +1,24 @@
+import type { Dispatch, SetStateAction } from 'react';
+/**
+ * Scrollbar visibility mode, declared once on `<ScrollArea>` and read by
+ * every thumb through context:
+ *
+ * - `'hover'` (default) — thumbs appear while the pointer is over the
+ *   scroll area or while they are being dragged
+ * - `'always'` — thumbs are always shown (when the axis overflows)
+ * - `'scroll'` — thumbs appear for a moment after each scroll
+ */
+export type ScrollbarMode = 'hover' | 'always' | 'scroll';
+type ScrollAreaContextValue = {
+    /** Visibility mode declared on the root. */
+    mode: ScrollbarMode;
+    /** The mounted scrollable viewport (`null` before it attaches). */
+    viewport: HTMLDivElement | null;
+    /** Viewport registration — `<ScrollViewport>` calls it via its ref. */
+    setViewport: Dispatch<SetStateAction<HTMLDivElement | null>>;
+    /** Accessible name declared on the root; the viewport falls back to it. */
+    label: string | undefined;
+};
+export declare const ScrollAreaProvider: import("react").Provider<ScrollAreaContextValue | undefined>;
+export declare function useScrollAreaContext(): ScrollAreaContextValue;
+export {};

package/dist/types/components/ScrollArea/ScrollThumb.d.ts

@@ -0,0 +1,9 @@
+import type { ComponentPropsWithoutRef, Ref } from 'react';
+import type { Orientation } from './scroll-math.js';
+type ScrollThumbProps = {
+    orientation?: Orientation;
+    className?: string;
+    ref?: Ref<HTMLDivElement>;
+} & Omit<ComponentPropsWithoutRef<'div'>, 'children'>;
+export default function ScrollThumb({ orientation, className, ref, ...rest }: ScrollThumbProps): import("react").JSX.Element;
+export type { ScrollThumbProps };

package/dist/types/components/ScrollArea/ScrollViewport.d.ts

@@ -0,0 +1,8 @@
+import type { ComponentPropsWithoutRef, ReactNode, Ref } from 'react';
+type ScrollViewportProps = {
+    className?: string;
+    children: ReactNode;
+    ref?: Ref<HTMLDivElement>;
+} & Omit<ComponentPropsWithoutRef<'div'>, 'children'>;
+export default function ScrollViewport({ className, children, ref, ...restProps }: ScrollViewportProps): import("react").JSX.Element;
+export type { ScrollViewportProps };

package/dist/types/components/ScrollArea/Scrollbar.d.ts

@@ -0,0 +1,19 @@
+import type { ComponentPropsWithoutRef, ReactNode, Ref } from 'react';
+import type { Orientation } from './scroll-math.js';
+type ScrollbarProps = {
+    /**
+     * Axis this track overlays. The track is an absolutely positioned
+     * strip on the corresponding root edge.
+     */
+    orientation?: Orientation;
+    className?: string;
+    /**
+     * Track content — defaults to `<ScrollThumb orientation/>`. Custom
+     * children replace the thumb wholesale (and with it the automatic
+     * `data-scrollable` hit-testing toggle the built-in thumb maintains).
+     */
+    children?: ReactNode;
+    ref?: Ref<HTMLDivElement>;
+} & Omit<ComponentPropsWithoutRef<'div'>, 'children'>;
+export default function Scrollbar({ orientation, className, children, ref, ...rest }: ScrollbarProps): import("react").JSX.Element;
+export type { ScrollbarProps };

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

@@ -1,2 +1,9 @@
-export { default as ScrollArea } from './ScrollArea';
-export type { ScrollAreaProps } from './ScrollArea';
+export { default as ScrollArea } from './ScrollArea.js';
+export type { ScrollAreaProps } from './ScrollArea.js';
+export { default as Scrollbar } from './Scrollbar.js';
+export type { ScrollbarProps } from './Scrollbar.js';
+export { default as ScrollThumb } from './ScrollThumb.js';
+export type { ScrollThumbProps } from './ScrollThumb.js';
+export { default as ScrollViewport } from './ScrollViewport.js';
+export type { ScrollViewportProps } from './ScrollViewport.js';
+export type { ScrollbarMode } from './ScrollAreaContext.js';

package/dist/types/components/ScrollArea/scroll-math.d.ts

@@ -0,0 +1,121 @@
+/**
+ * Pure scroll/thumb geometry for the ScrollArea family.
+ *
+ * jsdom has no layout engine (every extent reads 0), so the math is
+ * extracted here as pure functions over plain numbers: unit tests cover
+ * the math directly, component tests cover the DOM wiring with mocked
+ * extents.
+ *
+ * Axis vocabulary (vertical examples):
+ * - `viewportSize` — `clientHeight`, the visible extent
+ * - `scrollSize`   — `scrollHeight`, the content extent
+ * - `trackSize`    — the scrollbar track's extent
+ * - `scrollOffset` — `scrollTop`, distance from the scroll *start*
+ *   (logical units, see RTL below)
+ * - `thumbOffset`  — the thumb's displacement from the track's
+ *   *physical* start (top for vertical, left for horizontal)
+ *
+ * RTL: horizontal offsets stay *logical* (0 = inline start = the
+ * physical right edge), normalized against the spec-aligned `scrollLeft`
+ * scale that reads 0 at the start and goes negative toward the end —
+ * the same convention VirtualList normalizes. The thumb's physical
+ * position mirrors: logical progress 0 parks it at the right edge.
+ */
+/** Axis a scrollbar/thumb operates on. */
+export type Orientation = 'vertical' | 'horizontal';
+/**
+ * Smallest rendered thumb (px) — keeps the grab target reachable when
+ * the content is huge (WCAG 2.5.8 target-size spirit). Layout geometry,
+ * not a visual token: it feeds the same math that consumes px extents.
+ */
+export declare const MIN_THUMB_SIZE = 24;
+/**
+ * Minimal element surface the readers/writers need — test literals and
+ * jsdom elements (real or mocked) both plug in.
+ */
+type ScrollElementLike = {
+    clientHeight: number;
+    scrollHeight: number;
+    scrollTop: number;
+    clientWidth: number;
+    scrollWidth: number;
+    scrollLeft: number;
+};
+export declare function clamp(value: number, min: number, max: number): number;
+export type AxisGeometryInput = {
+    viewportSize: number;
+    scrollSize: number;
+    trackSize: number;
+    /** Distance from the scroll start (logical units). */
+    scrollOffset: number;
+    /** Floor for the thumb extent; defaults to {@link MIN_THUMB_SIZE}. */
+    minThumbSize?: number;
+    /** Mirror the thumb along the track (horizontal RTL). */
+    rtl?: boolean;
+};
+export type AxisGeometry = {
+    /** Whether the axis has overflow at all. */
+    scrollable: boolean;
+    /** Fraction [0,1] of the content the viewport shows. */
+    ratio: number;
+    /** Thumb extent in px; 0 when not scrollable. */
+    thumbSize: number;
+    /** Thumb displacement from the track's physical start in px. */
+    thumbOffset: number;
+    /** Largest scroll offset (px). */
+    maxScroll: number;
+    /** Largest thumb displacement (px). */
+    maxThumbOffset: number;
+};
+/** Thumb size and position for one axis from its extents. */
+export declare function axisGeometry(input: AxisGeometryInput): AxisGeometry;
+export type ThumbDragInput = {
+    /** Thumb displacement from the track start at grab time (physical px). */
+    thumbStart: number;
+    /** Pointer travel since grab (px, positive = toward the track's physical end). */
+    pointerDelta: number;
+    viewportSize: number;
+    scrollSize: number;
+    trackSize: number;
+    minThumbSize?: number;
+    rtl?: boolean;
+};
+/**
+ * Scroll offset a thumb drag must produce: travel the thumb by the
+ * pointer delta (mirrored in RTL), then invert the offset mapping.
+ */
+export declare function thumbDragToScroll(input: ThumbDragInput): number;
+export type TrackPageInput = {
+    /** Pointer displacement from the track's physical start (px). */
+    trackPos: number;
+    /** Live thumb placement on that track. */
+    thumbOffset: number;
+    thumbSize: number;
+    scrollOffset: number;
+    viewportSize: number;
+    scrollSize: number;
+};
+/**
+ * Track-press paging, Chrome/Windows-scrollbar semantics: jump one
+ * viewport toward the press (past/before the thumb's center), clamped
+ * to the scroll range.
+ */
+export declare function trackPageToScroll(input: TrackPageInput): number;
+/** One axis of a scroll element in logical units (RTL horizontal normalized). */
+export type ViewportAxis = {
+    viewportSize: number;
+    scrollSize: number;
+    scrollOffset: number;
+};
+/**
+ * Read one axis off a scroll element. Horizontal RTL `scrollLeft` reads
+ * 0 at the inline start (physical right) and goes negative toward the
+ * end — negate it into logical units.
+ */
+export declare function readViewportAxis(el: ScrollElementLike, orientation: Orientation, rtl: boolean): ViewportAxis;
+/** Write a logical scroll offset back to the element (RTL de-normalized). */
+export declare function writeViewportAxis(el: {
+    scrollTop: number;
+    scrollLeft: number;
+}, orientation: Orientation, rtl: boolean, value: number): void;
+export {};

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

@@ -1,12 +1,20 @@
 import type { Ref } from 'react';
 import type { ControlOrValue } from 'react-use-control';
-import type { SegmentedOption } from './SegmentedCore';
+import type { SegmentedOption } from './SegmentedCore.js';
 type SegmentedProps = {
     options: SegmentedOption[];
     value?: ControlOrValue<string>;
     onChange?: (value: string) => void;
     size?: 'sm' | 'md' | 'lg';
     className?: string;
+    /**
+     * Form field name: renders a hidden input bridge next to the button
+     * group so `<form action={fn}>` / `new FormData(form)` receive the
+     * selected option's value. The `''` no-selection sentinel submits
+     * nothing. react-f0rm `FormItem` usage never passes it, so both
+     * worlds coexist.
+     */
+    name?: string;
     /**
      * Forwarded to the group's focus target — the selected option's
      * `<button>` (falling back to the first) — so form bridges and
@@ -14,5 +22,5 @@ type SegmentedProps = {
      */
     ref?: Ref<HTMLButtonElement>;
 };
-export default function Segmented({ options, value: valueControl, onChange, size, className, ref, }: SegmentedProps): import("react").JSX.Element;
+export default function Segmented({ options, value: valueControl, onChange, size, className, name, ref, }: SegmentedProps): import("react").JSX.Element;
 export type { SegmentedProps, SegmentedOption };

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

@@ -1,4 +1,4 @@
-export { default as Segmented } from './Segmented';
-export type { SegmentedProps, SegmentedOption } from './Segmented';
-export { default as SegmentedCore } from './SegmentedCore';
-export type { SegmentedCoreProps, SegmentedOption as SegmentedCoreOption } from './SegmentedCore';
+export { default as Segmented } from './Segmented.js';
+export type { SegmentedProps, SegmentedOption } from './Segmented.js';
+export { default as SegmentedCore } from './SegmentedCore.js';
+export type { SegmentedCoreProps, SegmentedOption as SegmentedCoreOption } from './SegmentedCore.js';

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

@@ -1,6 +1,9 @@
 import type { ComponentPropsWithoutRef, ReactNode } from 'react';
 type OptionProps = {
-    value: string;
+    /** Raw option value — `string | number`; the owning Select's value
+     * type param governs what is meaningful here (the DOM stringifies
+     * the rendered attribute; the floating paths compare raw values). */
+    value: string | number;
     children: ReactNode;
 } & Omit<ComponentPropsWithoutRef<'option'>, 'value'>;
 export default function Option({ value, children, ...rest }: OptionProps): import("react").JSX.Element;

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 };