@lerianstudio/sindarian-ui 1.4.0-beta.2 → 1.4.0-beta.4

package/dist/enterprise/virtualized-table/index.js

@@ -34,10 +34,12 @@ const jsx_runtime_1 = require("react/jsx-runtime");
 const react_1 = require("react");
 const react_table_1 = require("@tanstack/react-table");
 const react_virtual_1 = require("@tanstack/react-virtual");
+const typography_1 = require("../../lib/typography");
 const utils_1 = require("../../lib/utils");
+const column_size_1 = require("../data-table/column-size");
 /** Rows rendered just outside the viewport to keep fast scrolls smooth. */
 const OVERSCAN = 8;
-function VirtualizedTable({ columns, data, rowHeight = 40, maxHeight = 480, scrollAreaLabel = 'Scrollable table rows', className }) {
+function VirtualizedTable({ columns, data, rowHeight = 40, maxHeight = 480, scrollAreaLabel = 'Scrollable table rows', className, headClassName }) {
     const scrollRef = (0, react_1.useRef)(null);
     const [isScrollable, setIsScrollable] = (0, react_1.useState)(false);
     // A number is px; a string is used verbatim (e.g. '60vh').
@@ -45,6 +47,10 @@ function VirtualizedTable({ columns, data, rowHeight = 40, maxHeight = 480, scro
     const table = (0, react_table_1.useReactTable)({
         data,
         columns,
+        // Keeps `columnDef.size`/`minSize`/`maxSize` meaning "declared" — see
+        // ../data-table/column-size. `getSize()` is unaffected; it falls back to
+        // the library defaults itself.
+        defaultColumn: column_size_1.UNSIZED_DEFAULT_COLUMN,
         getCoreRowModel: (0, react_table_1.getCoreRowModel)()
     });
     const rows = table.getRowModel().rows;
@@ -97,11 +103,23 @@ function VirtualizedTable({ columns, data, rowHeight = 40, maxHeight = 480, scro
                             // its position among its siblings.
                             const firstLeaf = header.column.getLeafColumns()[0];
                             const start = leafPosition.get(firstLeaf?.id ?? header.column.id);
-                            return ((0, jsx_runtime_1.jsx)("div", { role: "columnheader", "aria-colindex": (start ?? 0) + 1, "aria-colspan": header.colSpan > 1 ? header.colSpan : undefined, style: { flex: `${header.colSpan} 1 0%` }, 
+                            // A group header spans leaf columns whose body cells carry
+                            // their own widths, so its size comes from those leaves, not
+                            // from the group def (which declares nothing). A leaf header
+                            // reads its own column, as before.
+                            const size = header.subHeaders.length > 0
+                                ? (0, column_size_1.readDeclaredGroupSize)(header.column.getLeafColumns())
+                                : (0, column_size_1.readDeclaredColumnSize)(header.column);
+                            return ((0, jsx_runtime_1.jsx)("div", { role: "columnheader", "aria-colindex": (start ?? 0) + 1, "aria-colspan": header.colSpan > 1 ? header.colSpan : undefined, 
+                                // A declared width must not be flexed away; without one the
+                                // cell keeps its colSpan share of the row, as before.
+                                style: size?.width === undefined
+                                    ? { flex: `${header.colSpan} 1 0%`, ...size }
+                                    : { flex: '0 0 auto', ...size }, 
                                 // Header height is independent of rowHeight: pinning it to a
                                 // small rowHeight (32) clipped the uppercase label against its
                                 // own padding. Padding sizes it; min-h keeps a stable rule.
-                                className: "text-muted-foreground min-h-10 px-4 py-2.5 text-left text-xs font-medium tracking-wide uppercase", children: header.isPlaceholder
+                                className: (0, utils_1.cn)('min-h-10 px-4 py-2.5 text-left', typography_1.LABEL_VOICE_CLASS, headClassName), children: header.isPlaceholder
                                     ? null
                                     : (0, react_table_1.flexRender)(header.column.columnDef.header, header.getContext()) }, header.id));
                         }) }, headerGroup.id))) }), (0, jsx_runtime_1.jsx)("div", { ref: scrollRef, role: "rowgroup", "data-testid": "virtualized-table-viewport", "aria-label": isScrollable ? scrollAreaLabel : undefined, tabIndex: isScrollable ? 0 : undefined, className: "focus-visible:ring-ring relative overflow-auto focus-visible:ring-2 focus-visible:ring-offset-2 focus-visible:outline-none", style: { maxHeight: viewportMaxHeight }, children: (0, jsx_runtime_1.jsx)("div", { role: "presentation", className: "relative w-full", style: { height: totalSize }, children: virtualRows.map((virtualItem) => {
@@ -109,6 +127,15 @@ function VirtualizedTable({ columns, data, rowHeight = 40, maxHeight = 480, scro
                             return ((0, jsx_runtime_1.jsx)("div", { role: "row", "aria-rowindex": virtualItem.index + headerRowCount + 1, "data-index": virtualItem.index, className: "border-border absolute left-0 flex w-full items-center border-b text-sm", style: {
                                     height: virtualItem.size,
                                     transform: `translateY(${virtualItem.start}px)`
-                                }, children: row.getVisibleCells().map((cell, i) => ((0, jsx_runtime_1.jsx)("div", { role: "cell", "aria-colindex": i + 1, className: "flex-1 truncate px-4", children: (0, react_table_1.flexRender)(cell.column.columnDef.cell, cell.getContext()) }, cell.id))) }, row.id));
+                                }, children: row.getVisibleCells().map((cell, i) => {
+                                    const size = (0, column_size_1.readDeclaredColumnSize)(cell.column);
+                                    return ((0, jsx_runtime_1.jsx)("div", { role: "cell", "aria-colindex": i + 1, 
+                                        // An inline `flex` beats the class, so a sized column
+                                        // stops flexing while every other column renders
+                                        // exactly as it did before.
+                                        style: size?.width === undefined
+                                            ? size
+                                            : { flex: '0 0 auto', ...size }, className: "flex-1 truncate px-4", children: (0, react_table_1.flexRender)(cell.column.columnDef.cell, cell.getContext()) }, cell.id));
+                                }) }, row.id));
                         }) }) })] }) }));
 }

package/dist/esm/components/entity-box/index.d.ts

@@ -4,13 +4,22 @@ declare function EntityBox({ className, children, ...props }: React.ComponentPro
 declare function EntityBoxCollapsible({ className, ...props }: CollapsibleProps): React.JSX.Element;
 declare function EntityBoxCollapsibleTrigger(props: CollapsibleTriggerProps): React.JSX.Element;
 declare function EntityBoxCollapsibleContent({ children, ...props }: CollapsibleContentProps): React.JSX.Element;
-interface EntityBoxHeaderProps extends React.ComponentProps<'div'> {
+export interface EntityBoxHeaderProps extends React.ComponentProps<'div'> {
     title: string;
     subtitle?: string;
     tooltip?: string;
     tooltipWidth?: string | number;
+    /**
+     * Heading element used for the title. Defaults to `h2`.
+     *
+     * An EntityBox is a content box UNDER the page's own heading — the page `h1`
+     * belongs to `PageHeaderInfoTitle` — so `h1` here would give the page a
+     * second top-level heading. Raise or lower the level to match the section
+     * the box actually sits in.
+     */
+    as?: 'h1' | 'h2' | 'h3' | 'h4';
 }
-declare function EntityBoxHeaderTitle({ title, subtitle, tooltip, tooltipWidth, className, ...props }: EntityBoxHeaderProps): React.JSX.Element;
+declare function EntityBoxHeaderTitle({ title, subtitle, tooltip, tooltipWidth, className, as: Heading, ...props }: EntityBoxHeaderProps): React.JSX.Element;
 declare function EntityBoxBanner({ className, children, ...props }: React.ComponentProps<'div'>): React.JSX.Element;
 declare function EntityBoxActions({ className, children, ...props }: React.ComponentProps<'div'>): React.JSX.Element;
 export { EntityBox, EntityBoxCollapsible, EntityBoxCollapsibleTrigger, EntityBoxCollapsibleContent, EntityBoxHeaderTitle, EntityBoxBanner, EntityBoxActions };

package/dist/esm/components/entity-box/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/entity-box/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AAczB,OAAO,EACL,uBAAuB,EACvB,gBAAgB,EAChB,uBAAuB,EACxB,MAAM,6BAA6B,CAAA;AAIpC,iBAAS,SAAS,CAAC,EACjB,SAAS,EACT,QAAQ,EACR,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,qBAa7B;AAED,iBAAS,oBAAoB,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,gBAAgB,qBAUtE;AAED,iBAAS,2BAA2B,CAAC,KAAK,EAAE,uBAAuB,qBAQlE;AAED,iBAAS,2BAA2B,CAAC,EACnC,QAAQ,EACR,GAAG,KAAK,EACT,EAAE,uBAAuB,qBAOzB;AAED,UAAU,oBAAqB,SAAQ,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC;IAChE,KAAK,EAAE,MAAM,CAAA;IACb,QAAQ,CAAC,EAAE,MAAM,CAAA;IACjB,OAAO,CAAC,EAAE,MAAM,CAAA;IAChB,YAAY,CAAC,EAAE,MAAM,GAAG,MAAM,CAAA;CAC/B;AAED,iBAAS,oBAAoB,CAAC,EAC5B,KAAK,EACL,QAAQ,EACR,OAAO,EACP,YAAY,EACZ,SAAS,EACT,GAAG,KAAK,EACT,EAAE,oBAAoB,qBAgCtB;AAED,iBAAS,eAAe,CAAC,EACvB,SAAS,EACT,QAAQ,EACR,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,qBAU7B;AAED,iBAAS,gBAAgB,CAAC,EACxB,SAAS,EACT,QAAQ,EACR,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,qBAa7B;AAED,OAAO,EACL,SAAS,EACT,oBAAoB,EACpB,2BAA2B,EAC3B,2BAA2B,EAC3B,oBAAoB,EACpB,eAAe,EACf,gBAAgB,EACjB,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/entity-box/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AAczB,OAAO,EACL,uBAAuB,EACvB,gBAAgB,EAChB,uBAAuB,EACxB,MAAM,6BAA6B,CAAA;AAIpC,iBAAS,SAAS,CAAC,EACjB,SAAS,EACT,QAAQ,EACR,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,qBAa7B;AAED,iBAAS,oBAAoB,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,gBAAgB,qBAUtE;AAED,iBAAS,2BAA2B,CAAC,KAAK,EAAE,uBAAuB,qBAQlE;AAED,iBAAS,2BAA2B,CAAC,EACnC,QAAQ,EACR,GAAG,KAAK,EACT,EAAE,uBAAuB,qBAOzB;AAED,MAAM,WAAW,oBAAqB,SAAQ,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC;IACvE,KAAK,EAAE,MAAM,CAAA;IACb,QAAQ,CAAC,EAAE,MAAM,CAAA;IACjB,OAAO,CAAC,EAAE,MAAM,CAAA;IAChB,YAAY,CAAC,EAAE,MAAM,GAAG,MAAM,CAAA;IAC9B;;;;;;;OAOG;IACH,EAAE,CAAC,EAAE,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,CAAA;CAC/B;AAED,iBAAS,oBAAoB,CAAC,EAC5B,KAAK,EACL,QAAQ,EACR,OAAO,EACP,YAAY,EACZ,SAAS,EACT,EAAE,EAAE,OAAc,EAClB,GAAG,KAAK,EACT,EAAE,oBAAoB,qBAkCtB;AAED,iBAAS,eAAe,CAAC,EACvB,SAAS,EACT,QAAQ,EACR,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,qBAU7B;AAED,iBAAS,gBAAgB,CAAC,EACxB,SAAS,EACT,QAAQ,EACR,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,qBAa7B;AAED,OAAO,EACL,SAAS,EACT,oBAAoB,EACpB,2BAA2B,EAC3B,2BAA2B,EAC3B,oBAAoB,EACpB,eAAe,EACf,gBAAgB,EACjB,CAAA"}

package/dist/esm/components/entity-box/index.js

@@ -17,10 +17,10 @@ function EntityBoxCollapsibleTrigger(props) {
 function EntityBoxCollapsibleContent({ children, ...props }) {
     return (_jsxs(CollapsibleContent, { ...props, children: [_jsx(Separator, { orientation: "horizontal" }), _jsx("div", { className: "grid w-full grid-cols-3 p-6", children: children })] }));
 }
-function EntityBoxHeaderTitle({ title, subtitle, tooltip, tooltipWidth, className, ...props }) {
-    return (_jsxs("div", { "data-slot": "entity-box-header", className: cn('flex flex-col items-start', className), ...props, children: [_jsxs("div", { className: "flex items-center gap-[10px]", children: [_jsx("h1", { className: "text-muted-foreground text-lg font-medium", children: title }), tooltip && (_jsx(TooltipProvider, { children: _jsxs(Tooltip, { children: [_jsx(TooltipTrigger, { asChild: true, children: _jsx(CircleHelp, { className: "pointer text-shadcn-400 h-5 w-5" }) }), _jsx(TooltipContent, { side: "right", style: tooltipWidth
+function EntityBoxHeaderTitle({ title, subtitle, tooltip, tooltipWidth, className, as: Heading = 'h2', ...props }) {
+    return (_jsxs("div", { "data-slot": "entity-box-header", className: cn('flex flex-col items-start', className), ...props, children: [_jsxs("div", { className: "flex items-center gap-[10px]", children: [_jsx(Heading, { className: "text-muted-foreground text-lg font-medium", children: title }), tooltip && (_jsx(TooltipProvider, { children: _jsxs(Tooltip, { children: [_jsx(TooltipTrigger, { asChild: true, children: _jsx(CircleHelp, { className: "pointer text-shadcn-400 h-5 w-5" }) }), _jsx(TooltipContent, { side: "right", style: tooltipWidth
                                         ? { width: tooltipWidth, maxWidth: tooltipWidth }
-                                        : undefined, children: tooltip })] }) }))] }), subtitle && _jsx("p", { className: "text-shadcn-400 text-sm", children: subtitle })] }));
+                                        : undefined, children: tooltip })] }) }))] }), subtitle && _jsx("p", { className: "text-muted-foreground text-sm", children: subtitle })] }));
 }
 function EntityBoxBanner({ className, children, ...props }) {
     return (_jsx("div", { "data-slot": "entity-box-banner", className: cn('grid grid-cols-3 p-6', className), ...props, children: children }));

package/dist/esm/components/form/input-field/index.d.ts

@@ -11,16 +11,26 @@ export type InputFieldProps<T extends FieldValues = FieldValues> = {
     description?: ReactNode;
     startAdornment?: ReactNode;
     endAdornment?: ReactNode;
-    control: Control<T>;
+    /** react-hook-form control. Omit it to drive the field from plain state
+     *  with `value`/`defaultValue` + `onChange`. */
+    control?: Control<T>;
+    /** Controlled value for the no-`control` path. */
+    value?: string;
     disabled?: boolean;
     readOnly?: boolean;
     minHeight?: number;
     maxHeight?: number;
     textArea?: boolean;
     required?: boolean;
+    /**
+     * Seed value. With `control` and no form-level default for this name,
+     * react-hook-form treats the seed as a VALUE rather than a default, so
+     * `formState.isDirty` reads true after `reset()` and after retyping the
+     * seed. Prefer `useForm({ defaultValues })` when dirty tracking matters.
+     */
     defaultValue?: string;
     'data-testid'?: string;
     onChange?: (e: React.ChangeEvent<HTMLInputElement | HTMLTextAreaElement>) => void;
 };
-export declare const InputField: <T extends FieldValues = FieldValues>({ className, type, label, tooltip, labelExtra, placeholder, description, startAdornment, endAdornment, required, readOnly, minHeight, maxHeight, textArea, defaultValue, onChange, ...others }: InputFieldProps<T>) => import("react").JSX.Element;
+export declare const InputField: <T extends FieldValues = FieldValues>({ className, type, label, tooltip, labelExtra, placeholder, description, startAdornment, endAdornment, required, readOnly, minHeight, maxHeight, textArea, defaultValue, value, onChange, ...others }: InputFieldProps<T>) => import("react").JSX.Element;
 //# sourceMappingURL=index.d.ts.map

package/dist/esm/components/form/input-field/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/components/form/input-field/index.tsx"],"names":[],"mappings":"AAWA,OAAO,EAAE,sBAAsB,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AACzD,OAAO,EAAE,OAAO,EAAE,WAAW,EAAQ,MAAM,iBAAiB,CAAA;AAE5D,MAAM,MAAM,eAAe,CAAC,CAAC,SAAS,WAAW,GAAG,WAAW,IAAI;IACjE,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,IAAI,EAAE,MAAM,CAAA;IACZ,IAAI,CAAC,EAAE,sBAAsB,CAAA;IAC7B,KAAK,CAAC,EAAE,SAAS,CAAA;IACjB,OAAO,CAAC,EAAE,MAAM,CAAA;IAChB,UAAU,CAAC,EAAE,SAAS,CAAA;IACtB,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB,WAAW,CAAC,EAAE,SAAS,CAAA;IACvB,cAAc,CAAC,EAAE,SAAS,CAAA;IAC1B,YAAY,CAAC,EAAE,SAAS,CAAA;IACxB,OAAO,EAAE,OAAO,CAAC,CAAC,CAAC,CAAA;IACnB,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,YAAY,CAAC,EAAE,MAAM,CAAA;IACrB,aAAa,CAAC,EAAE,MAAM,CAAA;IACtB,QAAQ,CAAC,EAAE,CACT,CAAC,EAAE,KAAK,CAAC,WAAW,CAAC,gBAAgB,GAAG,mBAAmB,CAAC,KACzD,IAAI,CAAA;CACV,CAAA;AACD,eAAO,MAAM,UAAU,GAAI,CAAC,SAAS,WAAW,GAAG,WAAW,EAAE,gMAkB7D,eAAe,CAAC,CAAC,CAAC,gCAmDpB,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/components/form/input-field/index.tsx"],"names":[],"mappings":"AAWA,OAAO,EAAE,sBAAsB,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AACzD,OAAO,EAAE,OAAO,EAAkB,WAAW,EAAQ,MAAM,iBAAiB,CAAA;AAE5E,MAAM,MAAM,eAAe,CAAC,CAAC,SAAS,WAAW,GAAG,WAAW,IAAI;IACjE,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,IAAI,EAAE,MAAM,CAAA;IACZ,IAAI,CAAC,EAAE,sBAAsB,CAAA;IAC7B,KAAK,CAAC,EAAE,SAAS,CAAA;IACjB,OAAO,CAAC,EAAE,MAAM,CAAA;IAChB,UAAU,CAAC,EAAE,SAAS,CAAA;IACtB,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB,WAAW,CAAC,EAAE,SAAS,CAAA;IACvB,cAAc,CAAC,EAAE,SAAS,CAAA;IAC1B,YAAY,CAAC,EAAE,SAAS,CAAA;IACxB;oDACgD;IAChD,OAAO,CAAC,EAAE,OAAO,CAAC,CAAC,CAAC,CAAA;IACpB,kDAAkD;IAClD,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB;;;;;OAKG;IACH,YAAY,CAAC,EAAE,MAAM,CAAA;IACrB,aAAa,CAAC,EAAE,MAAM,CAAA;IACtB,QAAQ,CAAC,EAAE,CACT,CAAC,EAAE,KAAK,CAAC,WAAW,CAAC,gBAAgB,GAAG,mBAAmB,CAAC,KACzD,IAAI,CAAA;CACV,CAAA;AAeD,eAAO,MAAM,UAAU,GAAI,CAAC,SAAS,WAAW,GAAG,WAAW,EAAE,uMAmB7D,eAAe,CAAC,CAAC,CAAC,gCA2EpB,CAAA"}

package/dist/esm/components/form/input-field/index.js

@@ -2,9 +2,33 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { AutosizeTextarea } from '../../../components/ui/autosize-textarea/index.js';
 import { FormControl, FormDescription, FormField, FormItem, FormLabel, FormMessage, FormTooltip } from '../../../components/ui/form.js';
 import { Input } from '../../../components/ui/input/index.js';
-export const InputField = ({ className, type, label, tooltip, labelExtra, placeholder, description, startAdornment, endAdornment, required, readOnly, minHeight, maxHeight, textArea, defaultValue, onChange, ...others }) => {
-    return (_jsx(FormField, { ...others, name: others.name, render: ({ field }) => (_jsxs(FormItem, { required: required, children: [label && (_jsx(FormLabel, { extra: tooltip ? _jsx(FormTooltip, { children: tooltip }) : labelExtra, children: label })), _jsx(FormControl, { children: textArea ? (_jsx(AutosizeTextarea, { className: className, placeholder: placeholder, readOnly: readOnly, minHeight: minHeight, maxHeight: maxHeight, defaultValue: defaultValue, "data-testid": others['data-testid'], ...field, onChange: (e) => {
-                            field.onChange(e);
-                            onChange?.(e);
-                        } })) : (_jsx(Input, { className: className, type: type, placeholder: placeholder, readOnly: readOnly, startAdornment: startAdornment, endAdornment: endAdornment, "data-testid": others['data-testid'], ...field })) }), _jsx(FormMessage, {}), description && _jsx(FormDescription, { children: description })] })) }));
+export const InputField = ({ className, type, label, tooltip, labelExtra, placeholder, description, startAdornment, endAdornment, required, readOnly, minHeight, maxHeight, textArea, defaultValue, value, onChange, ...others }) => {
+    const renderItem = (binding) => (_jsxs(FormItem, { required: required, children: [label && (_jsx(FormLabel, { extra: tooltip ? _jsx(FormTooltip, { children: tooltip }) : labelExtra, children: label })), _jsx(FormControl, { children: textArea ? (_jsx(AutosizeTextarea, { className: className, placeholder: placeholder, readOnly: readOnly, minHeight: minHeight, maxHeight: maxHeight, "data-testid": others['data-testid'], ...binding })) : (_jsx(Input, { className: className, type: type, placeholder: placeholder, readOnly: readOnly, startAdornment: startAdornment, endAdornment: endAdornment, "data-testid": others['data-testid'], ...binding })) }), _jsx(FormMessage, {}), description && _jsx(FormDescription, { children: description })] }));
+    if (!others.control) {
+        return renderItem({
+            name: others.name,
+            disabled: others.disabled,
+            // Controlled when the caller holds the value, uncontrolled when it only
+            // seeds one — supplying both is what React warns about.
+            ...(value !== undefined ? { value } : { defaultValue }),
+            onChange: (e) => onChange?.(e)
+        });
+    }
+    return (_jsx(FormField, { ...others, name: others.name, 
+        // The seed goes through react-hook-form, never straight to the DOM: a
+        // value painted on the box only makes the field LOOK filled while the
+        // form still submits nothing for that name. Controller seeds its own
+        // state from this, so `field.value` carries the seed on both branches.
+        defaultValue: defaultValue, render: ({ field }) => renderItem({
+            ...field,
+            // Controlled from mount. react-hook-form hands `undefined` for any
+            // name the form declares no default for; React then mounts the box
+            // uncontrolled and flips it on the first keystroke, losing that
+            // character.
+            value: field.value ?? '',
+            onChange: (e) => {
+                field.onChange(e);
+                onChange?.(e);
+            }
+        }) }));
 };

package/dist/esm/components/form/select-field/index.d.ts

@@ -1,6 +1,6 @@
 import React, { PropsWithChildren, ReactNode } from 'react';
 import { Control, FieldValues } from 'react-hook-form';
-export type SelectFieldProps<T extends FieldValues = FieldValues> = PropsWithChildren & {
+type SelectFieldSharedProps<T extends FieldValues = FieldValues> = PropsWithChildren & {
     name: string;
     label?: ReactNode;
     tooltip?: string;
@@ -9,12 +9,36 @@ export type SelectFieldProps<T extends FieldValues = FieldValues> = PropsWithChi
     placeholder?: string;
     disabled?: boolean;
     readOnly?: boolean;
-    control: Control<T>;
-    multi?: boolean;
+    /** react-hook-form control. Omit it to drive the field from plain state
+     *  with `value` + `onChange`. */
+    control?: Control<T>;
     required?: boolean;
     emptyMessage?: string;
-    onChange?: (value: string | string[]) => void;
     'data-testid'?: string;
 };
-export declare const SelectField: <T extends FieldValues = FieldValues>({ name, label, tooltip, labelExtra, required, placeholder, description, disabled, readOnly, multi, control, children, emptyMessage, onChange, ...others }: SelectFieldProps<T>) => React.JSX.Element;
+/**
+ * `multi` is the DISCRIMINANT, not an independent flag: it selects which of the
+ * two field shapes the rest of the props must speak. Typed as a plain boolean
+ * beside `value?: string | string[]`, `multi` with `value="pix"` compiled and
+ * then rendered empty — the multi implementation only understands arrays and
+ * turned the string into `[]`, dropping the caller's selection with no error
+ * anywhere. The mismatch is unrepresentable now, and a multi consumer's
+ * `onChange` receives `string[]` without a cast at the call site.
+ */
+type SelectFieldModeProps = {
+    multi: true;
+    /** Controlled values for the no-`control` path. Omit to let the select
+     *  keep its own state and just report changes through `onChange`. */
+    value?: string[];
+    onChange?: (value: string[]) => void;
+} | {
+    multi?: false;
+    /** Controlled value for the no-`control` path. Omit to let the select
+     *  keep its own state and just report changes through `onChange`. */
+    value?: string;
+    onChange?: (value: string) => void;
+};
+export type SelectFieldProps<T extends FieldValues = FieldValues> = SelectFieldSharedProps<T> & SelectFieldModeProps;
+export declare const SelectField: <T extends FieldValues = FieldValues>({ name, label, tooltip, labelExtra, required, placeholder, description, disabled, readOnly, multi, control, value, children, emptyMessage, onChange, ...others }: SelectFieldProps<T>) => React.JSX.Element;
+export {};
 //# sourceMappingURL=index.d.ts.map

package/dist/esm/components/form/select-field/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/components/form/select-field/index.tsx"],"names":[],"mappings":"AAuBA,OAAO,KAAK,EAAE,EAAE,iBAAiB,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AAC3D,OAAO,EAAE,OAAO,EAAE,WAAW,EAAQ,MAAM,iBAAiB,CAAA;AAE5D,MAAM,MAAM,gBAAgB,CAAC,CAAC,SAAS,WAAW,GAAG,WAAW,IAC9D,iBAAiB,GAAG;IAClB,IAAI,EAAE,MAAM,CAAA;IACZ,KAAK,CAAC,EAAE,SAAS,CAAA;IACjB,OAAO,CAAC,EAAE,MAAM,CAAA;IAChB,UAAU,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IAC5B,WAAW,CAAC,EAAE,SAAS,CAAA;IACvB,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,OAAO,EAAE,OAAO,CAAC,CAAC,CAAC,CAAA;IACnB,KAAK,CAAC,EAAE,OAAO,CAAA;IACf,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,YAAY,CAAC,EAAE,MAAM,CAAA;IACrB,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,GAAG,MAAM,EAAE,KAAK,IAAI,CAAA;IAC7C,aAAa,CAAC,EAAE,MAAM,CAAA;CACvB,CAAA;AAEH,eAAO,MAAM,WAAW,GAAI,CAAC,SAAS,WAAW,GAAG,WAAW,EAAE,2JAgB9D,gBAAgB,CAAC,CAAC,CAAC,sBAmErB,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/components/form/select-field/index.tsx"],"names":[],"mappings":"AAuBA,OAAO,KAAK,EAAE,EAAE,iBAAiB,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AAC3D,OAAO,EACL,OAAO,EAEP,WAAW,EAEZ,MAAM,iBAAiB,CAAA;AAExB,KAAK,sBAAsB,CAAC,CAAC,SAAS,WAAW,GAAG,WAAW,IAC7D,iBAAiB,GAAG;IAClB,IAAI,EAAE,MAAM,CAAA;IACZ,KAAK,CAAC,EAAE,SAAS,CAAA;IACjB,OAAO,CAAC,EAAE,MAAM,CAAA;IAChB,UAAU,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IAC5B,WAAW,CAAC,EAAE,SAAS,CAAA;IACvB,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB;qCACiC;IACjC,OAAO,CAAC,EAAE,OAAO,CAAC,CAAC,CAAC,CAAA;IACpB,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,YAAY,CAAC,EAAE,MAAM,CAAA;IACrB,aAAa,CAAC,EAAE,MAAM,CAAA;CACvB,CAAA;AAEH;;;;;;;;GAQG;AACH,KAAK,oBAAoB,GACrB;IACE,KAAK,EAAE,IAAI,CAAA;IACX;yEACqE;IACrE,KAAK,CAAC,EAAE,MAAM,EAAE,CAAA;IAChB,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,EAAE,KAAK,IAAI,CAAA;CACrC,GACD;IACE,KAAK,CAAC,EAAE,KAAK,CAAA;IACb;yEACqE;IACrE,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAA;CACnC,CAAA;AAEL,MAAM,MAAM,gBAAgB,CAAC,CAAC,SAAS,WAAW,GAAG,WAAW,IAC9D,sBAAsB,CAAC,CAAC,CAAC,GAAG,oBAAoB,CAAA;AAWlD,eAAO,MAAM,WAAW,GAAI,CAAC,SAAS,WAAW,GAAG,WAAW,EAAE,kKAiB9D,gBAAgB,CAAC,CAAC,CAAC,sBA6FrB,CAAA"}

package/dist/esm/components/form/select-field/index.js

@@ -3,14 +3,37 @@ import { FormControl, FormDescription, FormField, FormItem, FormLabel, FormMessa
 import { MultipleSelect, MultipleSelectContent, MultipleSelectTrigger, MultipleSelectValue } from '../../../components/ui/multiple-select/index.js';
 import { Select, SelectContent, SelectEmpty, SelectTrigger, SelectValue } from '../../../components/ui/select/index.js';
 import { cn } from '../../../lib/utils.js';
-export const SelectField = ({ name, label, tooltip, labelExtra, required, placeholder, description, disabled, readOnly, multi, control, children, emptyMessage = 'No options found.', onChange, ...others }) => {
-    return (_jsx(FormField, { name: name, control: control, ...others, render: ({ field }) => {
-            return (_jsxs(FormItem, { required: required, children: [label && (_jsx(FormLabel, { extra: tooltip ? _jsx(FormTooltip, { children: tooltip }) : labelExtra, children: label })), multi ? (_jsxs(MultipleSelect, { onValueChange: (value) => {
-                            field.onChange(value);
-                            onChange?.(value);
-                        }, disabled: disabled, ...field, children: [_jsx(MultipleSelectTrigger, { readOnly: readOnly, children: _jsx(MultipleSelectValue, { placeholder: placeholder }) }), _jsx(MultipleSelectContent, { children: children })] })) : (_jsxs(Select, { onValueChange: (value) => {
-                            field.onChange(value);
-                            onChange?.(value);
-                        }, value: field.value ?? '', disabled: disabled, open: readOnly ? false : undefined, onOpenChange: readOnly ? () => { } : undefined, children: [_jsx(FormControl, { children: _jsx(SelectTrigger, { className: cn(disabled && 'bg-shadcn-100'), readOnly: readOnly, "data-testid": others['data-testid'], children: _jsx(SelectValue, { placeholder: placeholder }) }) }), _jsxs(SelectContent, { children: [_jsx(SelectEmpty, { children: emptyMessage }), children] })] })), _jsx(FormMessage, {}), description && _jsx(FormDescription, { children: description })] }));
-        } }));
+export const SelectField = ({ name, label, tooltip, labelExtra, required, placeholder, description, disabled, readOnly, multi, control, value, children, emptyMessage = 'No options found.', onChange, ...others }) => {
+    // The props union already pairs `multi` with the callback shape that branch
+    // emits, but destructuring an intersection loses that correlation — TS sees
+    // two unrelated callbacks. Both branches report through this one seam, each
+    // with the payload its own union member declared.
+    const emitChange = onChange;
+    const renderItem = (field) => {
+        return (_jsxs(FormItem, { required: required, children: [label && (_jsx(FormLabel, { extra: tooltip ? _jsx(FormTooltip, { children: tooltip }) : labelExtra, children: label })), multi ? (_jsxs(MultipleSelect, { onValueChange: (value) => {
+                        field.onChange(value);
+                        emitChange?.(value);
+                    }, disabled: disabled, ...field, children: [_jsx(MultipleSelectTrigger, { readOnly: readOnly, children: _jsx(MultipleSelectValue, { placeholder: placeholder }) }), _jsx(MultipleSelectContent, { children: children })] })) : (_jsxs(Select, { onValueChange: (value) => {
+                        field.onChange(value);
+                        emitChange?.(value);
+                    }, value: field.value, disabled: disabled, open: readOnly ? false : undefined, onOpenChange: readOnly ? () => { } : undefined, children: [_jsx(FormControl, { children: _jsx(SelectTrigger, { className: cn(disabled && 'bg-shadcn-100'), readOnly: readOnly, "data-testid": others['data-testid'], children: _jsx(SelectValue, { placeholder: placeholder }) }) }), _jsxs(SelectContent, { children: [_jsx(SelectEmpty, { children: emptyMessage }), children] })] })), _jsx(FormMessage, {}), description && _jsx(FormDescription, { children: description })] }));
+    };
+    if (!control) {
+        // `value` undefined leaves Radix to keep its own state, so an uncontrolled
+        // standalone select still opens and picks; `onChange` reports either way.
+        // The caller's own `onChange` is invoked by the body, so this is a no-op.
+        return renderItem({
+            name,
+            value,
+            onChange: () => { },
+            onBlur: () => { },
+            ref: () => { },
+            disabled
+        });
+    }
+    return (_jsx(FormField, { name: name, control: control, ...others, 
+        // An unset field falls back to the EMPTY value of its own shape: `''`
+        // for the single select, `[]` for the multi one. Falling back to `''`
+        // for both handed MultipleSelect a string it silently discarded.
+        render: ({ field }) => renderItem({ ...field, value: field.value ?? (multi ? [] : '') }) }));
 };

package/dist/esm/components/page-header/index.d.ts

@@ -16,8 +16,14 @@ export type PageHeaderInfoTitleProps = {
     title: string;
     subtitle?: string;
     subtitleCopyToClipboard?: boolean;
-    /** Routed to the `h1`, as it always has been. */
+    /** Routed to the heading, as it always has been. */
     className?: string;
+    /**
+     * Heading level to render. Defaults to `h1`, which is correct: this IS the
+     * page heading. Set it when the block is nested under an existing `h1` (a
+     * wizard step, an embedded panel) so the document outline stays valid.
+     */
+    as?: 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'h6';
     /**
      * Seam for the wrapper element's own margins. Merged AFTER the hard-coded
      * `mb-12` so a consumer utility (e.g. `mb-0`) wins via tailwind-merge.
@@ -25,7 +31,7 @@ export type PageHeaderInfoTitleProps = {
     containerClassName?: string;
     children?: ReactNode;
 };
-export declare function PageHeaderInfoTitle({ title, subtitle, className, containerClassName, children }: PageHeaderInfoTitleProps): import("react").JSX.Element;
+export declare function PageHeaderInfoTitle({ title, subtitle, className, containerClassName, children, as: Heading }: PageHeaderInfoTitleProps): import("react").JSX.Element;
 export type PageHeaderInfoTooltipProps = {
     subtitle: string;
 };

package/dist/esm/components/page-header/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/page-header/index.tsx"],"names":[],"mappings":"AACA,OAAO,EAAiB,SAAS,EAAwB,MAAM,OAAO,CAAA;AAmBtE,wBAAgB,uBAAuB,CAAC,EACtC,SAAS,EACT,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,+BAQ7B;AAED,wBAAgB,iBAAiB,CAAC,EAChC,SAAS,EACT,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,+BAc7B;AAED,KAAK,eAAe,GAAG;IACrB,QAAQ,EAAE,SAAS,CAAA;IACnB,8DAA8D;IAC9D,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB;;;OAGG;IACH,aAAa,CAAC,EAAE,MAAM,CAAA;CACvB,CAAA;AAED,wBAAgB,UAAU,CAAC,EACzB,QAAQ,EACR,SAAS,EACT,aAAa,EACd,EAAE,eAAe,+BAmBjB;AAED,MAAM,MAAM,wBAAwB,GAAG;IACrC,KAAK,EAAE,MAAM,CAAA;IACb,QAAQ,CAAC,EAAE,MAAM,CAAA;IACjB,uBAAuB,CAAC,EAAE,OAAO,CAAA;IACjC,iDAAiD;IACjD,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB;;;OAGG;IACH,kBAAkB,CAAC,EAAE,MAAM,CAAA;IAC3B,QAAQ,CAAC,EAAE,SAAS,CAAA;CACrB,CAAA;AAED,wBAAgB,mBAAmB,CAAC,EAClC,KAAK,EACL,QAAQ,EACR,SAAS,EACT,kBAAkB,EAClB,QAAQ,EACT,EAAE,wBAAwB,+BAmB1B;AAED,MAAM,MAAM,0BAA0B,GAAG;IACvC,QAAQ,EAAE,MAAM,CAAA;CACjB,CAAA;AAED,wBAAgB,qBAAqB,CAAC,EACpC,QAAQ,EACT,EAAE,0BAA0B,+BA8B5B;AAED,MAAM,MAAM,qCAAqC,GAAG;IAClD,QAAQ,EAAE,MAAM,CAAA;CACjB,CAAA;AAED,wBAAgB,gCAAgC,CAAC,EAC/C,QAAQ,EACT,EAAE,qCAAqC,+BAavC;AAED,MAAM,MAAM,8BAA8B,GAAG;IAC3C,QAAQ,CAAC,EAAE,MAAM,CAAA;IACjB,MAAM,CAAC,EAAE,MAAM,CAAA;IACf,OAAO,CAAC,EAAE,MAAM,CAAA;IAChB,IAAI,CAAC,EAAE,MAAM,CAAA;CACd,CAAA;AAED,wBAAgB,yBAAyB,CAAC,EACxC,QAAQ,EACR,MAAM,EACN,OAAO,EACP,IAAI,EACL,EAAE,8BAA8B,+BAyChC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/page-header/index.tsx"],"names":[],"mappings":"AACA,OAAO,EAAiB,SAAS,EAAwB,MAAM,OAAO,CAAA;AAmBtE,wBAAgB,uBAAuB,CAAC,EACtC,SAAS,EACT,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,+BAQ7B;AAED,wBAAgB,iBAAiB,CAAC,EAChC,SAAS,EACT,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,+BAc7B;AAED,KAAK,eAAe,GAAG;IACrB,QAAQ,EAAE,SAAS,CAAA;IACnB,8DAA8D;IAC9D,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB;;;OAGG;IACH,aAAa,CAAC,EAAE,MAAM,CAAA;CACvB,CAAA;AAED,wBAAgB,UAAU,CAAC,EACzB,QAAQ,EACR,SAAS,EACT,aAAa,EACd,EAAE,eAAe,+BAmBjB;AAED,MAAM,MAAM,wBAAwB,GAAG;IACrC,KAAK,EAAE,MAAM,CAAA;IACb,QAAQ,CAAC,EAAE,MAAM,CAAA;IACjB,uBAAuB,CAAC,EAAE,OAAO,CAAA;IACjC,oDAAoD;IACpD,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB;;;;OAIG;IACH,EAAE,CAAC,EAAE,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,CAAA;IAC5C;;;OAGG;IACH,kBAAkB,CAAC,EAAE,MAAM,CAAA;IAC3B,QAAQ,CAAC,EAAE,SAAS,CAAA;CACrB,CAAA;AAED,wBAAgB,mBAAmB,CAAC,EAClC,KAAK,EACL,QAAQ,EACR,SAAS,EACT,kBAAkB,EAClB,QAAQ,EACR,EAAE,EAAE,OAAc,EACnB,EAAE,wBAAwB,+BAmB1B;AAED,MAAM,MAAM,0BAA0B,GAAG;IACvC,QAAQ,EAAE,MAAM,CAAA;CACjB,CAAA;AAED,wBAAgB,qBAAqB,CAAC,EACpC,QAAQ,EACT,EAAE,0BAA0B,+BAqC5B;AAED,MAAM,MAAM,qCAAqC,GAAG;IAClD,QAAQ,EAAE,MAAM,CAAA;CACjB,CAAA;AAED,wBAAgB,gCAAgC,CAAC,EAC/C,QAAQ,EACT,EAAE,qCAAqC,+BAavC;AAED,MAAM,MAAM,8BAA8B,GAAG;IAC3C,QAAQ,CAAC,EAAE,MAAM,CAAA;IACjB,MAAM,CAAC,EAAE,MAAM,CAAA;IACf,OAAO,CAAC,EAAE,MAAM,CAAA;IAChB,IAAI,CAAC,EAAE,MAAM,CAAA;CACd,CAAA;AAED,wBAAgB,yBAAyB,CAAC,EACxC,QAAQ,EACR,MAAM,EACN,OAAO,EACP,IAAI,EACL,EAAE,8BAA8B,+BA+ChC"}

package/dist/esm/components/page-header/index.js

@@ -9,7 +9,7 @@ import { useToast } from '../../hooks/use-toast.js';
 import { Arrow } from '@radix-ui/react-tooltip';
 const PageHeaderContext = createContext({ isOpen: false });
 export function PageHeaderActionButtons({ className, ...props }) {
-    return (_jsx("div", { "data-slot": "page-header-action-buttons", className: cn('flex items-center gap-8', className), ...props }));
+    return (_jsx("div", { "data-slot": "page-header-action-buttons", className: cn('flex min-w-0 flex-wrap items-center gap-8', className), ...props }));
 }
 export function PageHeaderWrapper({ className, ...props }) {
     const { isOpen } = useContext(PageHeaderContext);
@@ -19,8 +19,8 @@ export function PageHeader({ children, className, rootClassName }) {
     const [isOpen, setIsOpen] = useState(false);
     return (_jsx(PageHeaderContext.Provider, { value: { isOpen }, children: _jsx("div", { "data-slot": "page-header", className: cn('mt-12', isOpen && 'mb-12', rootClassName), children: _jsx(Collapsible, { open: isOpen, onOpenChange: setIsOpen, className: className, children: children }) }) }));
 }
-export function PageHeaderInfoTitle({ title, subtitle, className, containerClassName, children }) {
-    return (_jsxs("div", { "data-slot": "page-header-info-title", className: cn('mb-12 flex flex-col gap-4', containerClassName), children: [_jsx("h1", { className: cn('text-foreground text-4xl font-bold', className), "data-testid": "title", children: title }), _jsxs("div", { className: "flex items-center gap-2", children: [_jsx("p", { className: "text-shadcn-400 text-sm font-medium", children: subtitle }), children] })] }));
+export function PageHeaderInfoTitle({ title, subtitle, className, containerClassName, children, as: Heading = 'h1' }) {
+    return (_jsxs("div", { "data-slot": "page-header-info-title", className: cn('mb-12 flex flex-col gap-4', containerClassName), children: [_jsx(Heading, { className: cn('text-foreground text-4xl font-bold', className), "data-testid": "title", children: title }), _jsxs("div", { className: "flex items-center gap-2", children: [_jsx("p", { className: "text-muted-foreground text-sm font-medium", children: subtitle }), children] })] }));
 }
 export function PageHeaderInfoTooltip({ subtitle }) {
     const { toast } = useToast();
@@ -36,5 +36,5 @@ export function PageHeaderCollapsibleInfoTrigger({ question }) {
     return (_jsx("div", { "data-slot": "page-header-collapsible-info-trigger", children: _jsx(CollapsibleTrigger, { asChild: true, children: _jsxs(Button, { variant: "link", className: "flex gap-2 pr-0", children: [_jsx("span", { className: "text-foreground text-sm font-medium", children: question }), _jsx(HelpCircle, { className: "h-4 w-4" })] }) }) }));
 }
 export function PageHeaderCollapsibleInfo({ question, answer, seeMore, href }) {
-    return (_jsx("div", { "data-slot": "page-header-collapsible-info", children: _jsx(CollapsibleContent, { children: _jsxs("div", { className: "flex w-full justify-between pt-6", children: [_jsxs("div", { className: "mt-12 flex grow flex-col gap-3 pr-6", children: [_jsx("h1", { className: "text-foreground text-xl font-bold", children: question }), _jsxs("p", { className: "text-shadcn-500 text-sm leading-relaxed font-medium", children: [answer, seeMore && href && (_jsxs(_Fragment, { children: [' ', _jsxs("a", { target: "_blank", rel: "noopener noreferrer", href: href, className: "text-shadcn-600 dark:text-shadcn-400 font-medium", children: [_jsx("span", { className: "underline underline-offset-4", children: seeMore }), _jsx(ExternalLink, { size: 16, className: "ml-1 inline align-middle" })] })] }))] })] }), _jsx(CollapsibleTrigger, { asChild: true, children: _jsx(Button, { variant: "link", className: "cursor-pointer self-start", children: _jsx(ChevronUp, { size: 24, className: "text-shadcn-500" }) }) })] }) }) }));
+    return (_jsx("div", { "data-slot": "page-header-collapsible-info", children: _jsx(CollapsibleContent, { children: _jsxs("div", { className: "flex w-full justify-between pt-6", children: [_jsxs("div", { className: "mt-12 flex grow flex-col gap-3 pr-6", children: [_jsx("h2", { className: "text-foreground text-xl font-bold", children: question }), _jsxs("p", { className: "text-shadcn-500 text-sm leading-relaxed font-medium", children: [answer, seeMore && href && (_jsxs(_Fragment, { children: [' ', _jsxs("a", { target: "_blank", rel: "noopener noreferrer", href: href, className: "text-shadcn-600 dark:text-shadcn-400 font-medium", children: [_jsx("span", { className: "underline underline-offset-4", children: seeMore }), _jsx(ExternalLink, { size: 16, className: "ml-1 inline align-middle" })] })] }))] })] }), _jsx(CollapsibleTrigger, { asChild: true, children: _jsx(Button, { variant: "link", className: "cursor-pointer self-start", children: _jsx(ChevronUp, { size: 24, className: "text-shadcn-500" }) }) })] }) }) }));
 }

package/dist/esm/components/ui/badge/index.d.ts

@@ -7,6 +7,14 @@ import { type VariantProps } from 'class-variance-authority';
  * role as text over a tinted surface. Do not "fix" this into a solid
  * `bg-credit` fill — that renders red-on-red and is invisible.
  */
+/**
+ * `gap-1` is load-bearing, not decoration: a badge holding a label AND an
+ * element child (`ID<code>ctx-123</code>`) has nothing between them otherwise —
+ * JSX drops the newline-only text node and CSS drops the whitespace-only
+ * anonymous flex item — so the screen reads `IDctx-123`. Consumers were pasting
+ * `className="gap-1"` per call site; `cn` runs tailwind-merge, so an explicit
+ * `gap-2` still wins. Single-child badges are unaffected: gap needs two items.
+ */
 declare const badgeVariants: (props?: ({
     variant?: "default" | "secondary" | "outline" | "destructive" | "alert" | "success" | "active" | "inactive" | "credit" | "error" | "info" | "purple" | null | undefined;
     size?: "default" | "sm" | null | undefined;

package/dist/esm/components/ui/badge/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/components/ui/badge/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAC9B,OAAO,EAAO,KAAK,YAAY,EAAE,MAAM,0BAA0B,CAAA;AAKjE;;;;;;GAMG;AACH,QAAA,MAAM,aAAa;;;8EA6ClB,CAAA;AAED,MAAM,MAAM,UAAU,GAAG,KAAK,CAAC,cAAc,CAAC,MAAM,CAAC,GACnD,YAAY,CAAC,OAAO,aAAa,CAAC,GAAG;IAAE,OAAO,CAAC,EAAE,OAAO,CAAA;CAAE,CAAA;AAE5D,iBAAS,KAAK,CAAC,EAAE,SAAS,EAAE,OAAO,EAAE,IAAI,EAAE,OAAO,EAAE,GAAG,KAAK,EAAE,EAAE,UAAU,qBAUzE;AAED,OAAO,EAAE,KAAK,EAAE,aAAa,EAAE,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/components/ui/badge/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAC9B,OAAO,EAAO,KAAK,YAAY,EAAE,MAAM,0BAA0B,CAAA;AAKjE;;;;;;GAMG;AACH;;;;;;;GAOG;AACH,QAAA,MAAM,aAAa;;;8EA6ClB,CAAA;AAED,MAAM,MAAM,UAAU,GAAG,KAAK,CAAC,cAAc,CAAC,MAAM,CAAC,GACnD,YAAY,CAAC,OAAO,aAAa,CAAC,GAAG;IAAE,OAAO,CAAC,EAAE,OAAO,CAAA;CAAE,CAAA;AAE5D,iBAAS,KAAK,CAAC,EAAE,SAAS,EAAE,OAAO,EAAE,IAAI,EAAE,OAAO,EAAE,GAAG,KAAK,EAAE,EAAE,UAAU,qBAUzE;AAED,OAAO,EAAE,KAAK,EAAE,aAAa,EAAE,CAAA"}

package/dist/esm/components/ui/badge/index.js

@@ -9,7 +9,15 @@ import { Slot } from '@radix-ui/react-slot';
  * role as text over a tinted surface. Do not "fix" this into a solid
  * `bg-credit` fill — that renders red-on-red and is invisible.
  */
-const badgeVariants = cva('inline-flex items-center rounded-full border border-border px-2.5 py-0.5 text-sm font-medium transition-colors focus:outline-hidden focus:ring-2 focus:ring-ring focus:ring-offset-2', {
+/**
+ * `gap-1` is load-bearing, not decoration: a badge holding a label AND an
+ * element child (`ID<code>ctx-123</code>`) has nothing between them otherwise —
+ * JSX drops the newline-only text node and CSS drops the whitespace-only
+ * anonymous flex item — so the screen reads `IDctx-123`. Consumers were pasting
+ * `className="gap-1"` per call site; `cn` runs tailwind-merge, so an explicit
+ * `gap-2` still wins. Single-child badges are unaffected: gap needs two items.
+ */
+const badgeVariants = cva('inline-flex items-center gap-1 rounded-full border border-border px-2.5 py-0.5 text-sm font-medium transition-colors focus:outline-hidden focus:ring-2 focus:ring-ring focus:ring-offset-2', {
     variants: {
         variant: {
             default: 'border-transparent bg-primary text-primary-foreground hover:bg-primary/80',

package/dist/esm/components/ui/form.d.ts

@@ -5,10 +5,10 @@ import { TooltipProviderProps } from '@radix-ui/react-tooltip';
 declare const Form: <TFieldValues extends FieldValues, TContext = any, TTransformedValues = TFieldValues>(props: import("react-hook-form").FormProviderProps<TFieldValues, TContext, TTransformedValues>) => React.JSX.Element;
 declare const FormField: <TFieldValues extends FieldValues = FieldValues, TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>>({ ...props }: ControllerProps<TFieldValues, TName>) => React.JSX.Element;
 declare const useFormField: () => {
-    invalid: boolean;
-    isDirty: boolean;
-    isTouched: boolean;
-    isValidating: boolean;
+    invalid?: boolean | undefined;
+    isDirty?: boolean | undefined;
+    isTouched?: boolean | undefined;
+    isValidating?: boolean | undefined;
     error?: import("react-hook-form").FieldError;
     id: string;
     name: string;

package/dist/esm/components/ui/form.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"form.d.ts","sourceRoot":"","sources":["../../../../src/components/ui/form.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAC9B,OAAO,KAAK,cAAc,MAAM,uBAAuB,CAAA;AAEvD,OAAO,EAEL,eAAe,EACf,SAAS,EACT,WAAW,EAGZ,MAAM,iBAAiB,CAAA;AAKxB,OAAO,EAAE,oBAAoB,EAAE,MAAM,yBAAyB,CAAA;AAS9D,QAAA,MAAM,IAAI,4MAAe,CAAA;AAazB,QAAA,MAAM,SAAS,GACb,YAAY,SAAS,WAAW,GAAG,WAAW,EAC9C,KAAK,SAAS,SAAS,CAAC,YAAY,CAAC,GAAG,SAAS,CAAC,YAAY,CAAC,EAC/D,cAEC,eAAe,CAAC,YAAY,EAAE,KAAK,CAAC,sBAMtC,CAAA;AAED,QAAA,MAAM,YAAY;;;;;;;;;;;;CAsBjB,CAAA;AAWD,MAAM,MAAM,aAAa,GAAG,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC,GAAG;IACjE,QAAQ,CAAC,EAAE,OAAO,CAAA;CACnB,CAAA;AAED,QAAA,MAAM,QAAQ;eAHD,OAAO;wCAanB,CAAA;AAGD,MAAM,MAAM,cAAc,GAAG,KAAK,CAAC,wBAAwB,CACzD,OAAO,cAAc,CAAC,IAAI,CAC3B,GAAG;IACF,KAAK,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;CACxB,CAAA;AAED,QAAA,MAAM,SAAS;YAHL,KAAK,CAAC,SAAS;0CA2BvB,CAAA;AAGF,eAAO,MAAM,WAAW,GAAI,yBAAyB,oBAAoB,sBASxE,CAAA;AAED,QAAA,MAAM,WAAW;;gFAmBf,CAAA;AAGF,QAAA,MAAM,eAAe,yHAcnB,CAAA;AAGF,QAAA,MAAM,WAAW,yHAqBf,CAAA;AAGF,OAAO,EACL,YAAY,EACZ,IAAI,EACJ,QAAQ,EACR,SAAS,EACT,WAAW,EACX,eAAe,EACf,WAAW,EACX,SAAS,EACV,CAAA"}
+{"version":3,"file":"form.d.ts","sourceRoot":"","sources":["../../../../src/components/ui/form.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAC9B,OAAO,KAAK,cAAc,MAAM,uBAAuB,CAAA;AAEvD,OAAO,EAEL,eAAe,EACf,SAAS,EACT,WAAW,EAGZ,MAAM,iBAAiB,CAAA;AAKxB,OAAO,EAAE,oBAAoB,EAAE,MAAM,yBAAyB,CAAA;AAS9D,QAAA,MAAM,IAAI,4MAAe,CAAA;AAazB,QAAA,MAAM,SAAS,GACb,YAAY,SAAS,WAAW,GAAG,WAAW,EAC9C,KAAK,SAAS,SAAS,CAAC,YAAY,CAAC,GAAG,SAAS,CAAC,YAAY,CAAC,EAC/D,cAEC,eAAe,CAAC,YAAY,EAAE,KAAK,CAAC,sBAMtC,CAAA;AAED,QAAA,MAAM,YAAY;;;;;;;;;;;;CAyBjB,CAAA;AAWD,MAAM,MAAM,aAAa,GAAG,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC,GAAG;IACjE,QAAQ,CAAC,EAAE,OAAO,CAAA;CACnB,CAAA;AAED,QAAA,MAAM,QAAQ;eAHD,OAAO;wCAanB,CAAA;AAGD,MAAM,MAAM,cAAc,GAAG,KAAK,CAAC,wBAAwB,CACzD,OAAO,cAAc,CAAC,IAAI,CAC3B,GAAG;IACF,KAAK,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;CACxB,CAAA;AAED,QAAA,MAAM,SAAS;YAHL,KAAK,CAAC,SAAS;0CA2BvB,CAAA;AAGF,eAAO,MAAM,WAAW,GAAI,yBAAyB,oBAAoB,sBASxE,CAAA;AAED,QAAA,MAAM,WAAW;;gFAmBf,CAAA;AAGF,QAAA,MAAM,eAAe,yHAcnB,CAAA;AAGF,QAAA,MAAM,WAAW,yHAuBf,CAAA;AAGF,OAAO,EACL,YAAY,EACZ,IAAI,EACJ,QAAQ,EACR,SAAS,EACT,WAAW,EACX,eAAe,EACf,WAAW,EACX,SAAS,EACV,CAAA"}

package/dist/esm/components/ui/form.js

@@ -15,11 +15,14 @@ const FormField = ({ ...props }) => {
 const useFormField = () => {
     const fieldContext = React.useContext(FormFieldContext);
     const itemContext = React.useContext(FormItemContext);
-    const { getFieldState, formState } = useFormContext();
-    const fieldState = getFieldState(fieldContext.name, formState);
-    if (!fieldContext) {
-        throw new Error('useFormField should be used within <FormField>');
-    }
+    // `useFormContext()` is null outside a `<Form>` provider, and destructuring it
+    // threw — which is what made every Form primitive, and so every *Field built
+    // on them, unusable in a plain `useState` filter bar. Inside a provider
+    // nothing below changes; outside one, the field simply has no error state.
+    const form = useFormContext();
+    const fieldState = form && fieldContext.name
+        ? form.getFieldState(fieldContext.name, form.formState)
+        : undefined;
     const { id, required } = itemContext;
     return {
         id,
@@ -61,7 +64,10 @@ const FormMessage = React.forwardRef(({ className, children, ...props }, ref) =>
     if (!body) {
         return null;
     }
-    return (_jsx("p", { ref: ref, id: formMessageId, className: cn('text-destructive text-sm font-medium', className), ...props, children: body }));
+    return (_jsx("p", { ref: ref, id: formMessageId, 
+        // The error TEXT token, not `text-destructive`: that is the badge/fill
+        // family and measures ~3.8:1 as ink, under AA. Validation copy is text.
+        className: cn('text-system-error-h1a text-sm font-medium', className), ...props, children: body }));
 });
 FormMessage.displayName = 'FormMessage';
 export { useFormField, Form, FormItem, FormLabel, FormControl, FormDescription, FormMessage, FormField };

package/dist/esm/components/ui/multiple-select/index.d.ts

@@ -58,14 +58,22 @@ export declare const MultipleSelectItem: React.ForwardRefExoticComponent<Omit<{
     keywords?: string[];
     forceMount?: boolean;
 } & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
-export type MultipleSelectProps = React.ComponentPropsWithoutRef<typeof CommandPrimitive> & {
+/**
+ * cmdk's own `value`/`defaultValue`/`onValueChange` are single-string search
+ * state. Spreading them and re-declaring the multi-select versions produced an
+ * INTERSECTION (`string & string[]`, and a handler taking both `string` and
+ * `string[]`), which no caller can satisfy — the controlled shape this
+ * component exists for was uncallable. They are omitted before the multi-value
+ * versions are declared; the component consumes cmdk's search state itself.
+ */
+export type MultipleSelectProps = Omit<React.ComponentPropsWithoutRef<typeof CommandPrimitive>, 'value' | 'defaultValue' | 'onValueChange'> & {
     value?: string[] | [];
     defaultValue?: string[] | [];
     onValueChange?: (values: string[]) => void;
     showValue?: boolean;
     disabled?: boolean;
 };
-export declare const MultipleSelect: React.ForwardRefExoticComponent<Omit<{
+export declare const MultipleSelect: React.ForwardRefExoticComponent<Omit<Omit<{
     children?: React.ReactNode;
 } & Pick<Pick<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "key" | keyof React.HTMLAttributes<HTMLDivElement>> & {
     ref?: React.Ref<HTMLDivElement>;
@@ -81,7 +89,7 @@ export declare const MultipleSelect: React.ForwardRefExoticComponent<Omit<{
     loop?: boolean;
     disablePointerSelection?: boolean;
     vimBindings?: boolean;
-} & React.RefAttributes<HTMLDivElement>, "ref"> & {
+} & React.RefAttributes<HTMLDivElement>, "ref">, "value" | "defaultValue" | "onValueChange"> & {
     value?: string[] | [];
     defaultValue?: string[] | [];
     onValueChange?: (values: string[]) => void;

package/dist/esm/components/ui/multiple-select/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/components/ui/multiple-select/index.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,MAAM,OAAO,CAAA;AAMzB,OAAO,EAAE,OAAO,IAAI,gBAAgB,EAAmB,MAAM,MAAM,CAAA;AAgDnE,eAAO,MAAM,qBAAqB;;;eAG0B,OAAO;wCAyFjE,CAAA;AAGF,eAAO,MAAM,mBAAmB;;;;;;;0FAiD9B,CAAA;AAGF,eAAO,MAAM,mBAAmB;;;;;;uJAiB9B,CAAA;AAGF,MAAM,MAAM,0BAA0B,GAAG,KAAK,CAAC,wBAAwB,CACrE,OAAO,gBAAgB,CAAC,IAAI,CAC7B,GAAG;IACF,QAAQ,CAAC,EAAE,QAAQ,GAAG,QAAQ,CAAA;CAC/B,CAAA;AAED,eAAO,MAAM,qBAAqB;;;;;;;;;eAHrB,QAAQ,GAAG,QAAQ;wCA+D/B,CAAA;AAGD,eAAO,MAAM,mBAAmB;;;;;;;;;;sFAY9B,CAAA;AAGF,eAAO,MAAM,kBAAkB;;;;;;;;;;;;sFAiC9B,CAAA;AAGD,MAAM,MAAM,mBAAmB,GAAG,KAAK,CAAC,wBAAwB,CAC9D,OAAO,gBAAgB,CACxB,GAAG;IACF,KAAK,CAAC,EAAE,MAAM,EAAE,GAAG,EAAE,CAAA;IACrB,YAAY,CAAC,EAAE,MAAM,EAAE,GAAG,EAAE,CAAA;IAC5B,aAAa,CAAC,EAAE,CAAC,MAAM,EAAE,MAAM,EAAE,KAAK,IAAI,CAAA;IAC1C,SAAS,CAAC,EAAE,OAAO,CAAA;IACnB,QAAQ,CAAC,EAAE,OAAO,CAAA;CACnB,CAAA;AAED,eAAO,MAAM,cAAc;;;;;;;;;;;;;;;;;YAPjB,MAAM,EAAE,GAAG,EAAE;mBACN,MAAM,EAAE,GAAG,EAAE;oBACZ,CAAC,MAAM,EAAE,MAAM,EAAE,KAAK,IAAI;gBAC9B,OAAO;eACR,OAAO;wCA2HnB,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/components/ui/multiple-select/index.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,MAAM,OAAO,CAAA;AAMzB,OAAO,EAAE,OAAO,IAAI,gBAAgB,EAAmB,MAAM,MAAM,CAAA;AAgDnE,eAAO,MAAM,qBAAqB;;;eAG0B,OAAO;wCAyFjE,CAAA;AAGF,eAAO,MAAM,mBAAmB;;;;;;;0FAiD9B,CAAA;AAGF,eAAO,MAAM,mBAAmB;;;;;;uJAiB9B,CAAA;AAGF,MAAM,MAAM,0BAA0B,GAAG,KAAK,CAAC,wBAAwB,CACrE,OAAO,gBAAgB,CAAC,IAAI,CAC7B,GAAG;IACF,QAAQ,CAAC,EAAE,QAAQ,GAAG,QAAQ,CAAA;CAC/B,CAAA;AAED,eAAO,MAAM,qBAAqB;;;;;;;;;eAHrB,QAAQ,GAAG,QAAQ;wCA+D/B,CAAA;AAGD,eAAO,MAAM,mBAAmB;;;;;;;;;;sFAY9B,CAAA;AAGF,eAAO,MAAM,kBAAkB;;;;;;;;;;;;sFAiC9B,CAAA;AAGD;;;;;;;GAOG;AACH,MAAM,MAAM,mBAAmB,GAAG,IAAI,CACpC,KAAK,CAAC,wBAAwB,CAAC,OAAO,gBAAgB,CAAC,EACvD,OAAO,GAAG,cAAc,GAAG,eAAe,CAC3C,GAAG;IACF,KAAK,CAAC,EAAE,MAAM,EAAE,GAAG,EAAE,CAAA;IACrB,YAAY,CAAC,EAAE,MAAM,EAAE,GAAG,EAAE,CAAA;IAC5B,aAAa,CAAC,EAAE,CAAC,MAAM,EAAE,MAAM,EAAE,KAAK,IAAI,CAAA;IAC1C,SAAS,CAAC,EAAE,OAAO,CAAA;IACnB,QAAQ,CAAC,EAAE,OAAO,CAAA;CACnB,CAAA;AAED,eAAO,MAAM,cAAc;;;;;;;;;;;;;;;;;YAPjB,MAAM,EAAE,GAAG,EAAE;mBACN,MAAM,EAAE,GAAG,EAAE;oBACZ,CAAC,MAAM,EAAE,MAAM,EAAE,KAAK,IAAI;gBAC9B,OAAO;eACR,OAAO;wCA2HnB,CAAA"}

package/dist/esm/components/ui/select/index.d.ts

@@ -2,6 +2,11 @@ import * as React from 'react';
 import * as SelectPrimitive from '@radix-ui/react-select';
 declare function Select({ ...props }: React.ComponentProps<typeof SelectPrimitive.Root>): React.JSX.Element;
 declare function SelectGroup({ ...props }: React.ComponentProps<typeof SelectPrimitive.Group>): React.JSX.Element;
+/**
+ * Radix strips `className` and `style` off its `Select.Value` before rendering
+ * the span, so this slot cannot be styled directly — it is styled from the
+ * trigger instead, see VALUE_OVERFLOW_CLASS.
+ */
 declare function SelectValue({ ...props }: React.ComponentProps<typeof SelectPrimitive.Value>): React.JSX.Element;
 type SelectTriggerProps = React.ComponentProps<typeof SelectPrimitive.Trigger> & {
     readOnly?: boolean;

package/dist/esm/components/ui/select/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/components/ui/select/index.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAC9B,OAAO,KAAK,eAAe,MAAM,wBAAwB,CAAA;AAKzD,iBAAS,MAAM,CAAC,EACd,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,eAAe,CAAC,IAAI,CAAC,qBAEnD;AAED,iBAAS,WAAW,CAAC,EACnB,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,eAAe,CAAC,KAAK,CAAC,qBAEpD;AAED,iBAAS,WAAW,CAAC,EACnB,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,eAAe,CAAC,KAAK,CAAC,qBAEpD;AAED,KAAK,kBAAkB,GAAG,KAAK,CAAC,cAAc,CAC5C,OAAO,eAAe,CAAC,OAAO,CAC/B,GAAG;IACF,QAAQ,CAAC,EAAE,OAAO,CAAA;CACnB,CAAA;AAED,iBAAS,aAAa,CAAC,EACrB,SAAS,EACT,QAAQ,EACR,QAAQ,EACR,GAAG,KAAK,EACT,EAAE,kBAAkB,qBAqBpB;AAED,iBAAS,oBAAoB,CAAC,EAC5B,SAAS,EACT,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,eAAe,CAAC,cAAc,CAAC,qBAU7D;AACD,iBAAS,sBAAsB,CAAC,EAC9B,SAAS,EACT,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,eAAe,CAAC,gBAAgB,CAAC,qBAU/D;AAED,iBAAS,aAAa,CAAC,EACrB,SAAS,EACT,QAAQ,EACR,QAAmB,EACnB,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,eAAe,CAAC,OAAO,CAAC,qBA0CtD;AAED,iBAAS,WAAW,CAAC,EACnB,SAAS,EACT,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,wBAAwB,CAAC,KAAK,CAAC,qBAQvC;AAED,iBAAS,WAAW,CAAC,EACnB,SAAS,EACT,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,eAAe,CAAC,KAAK,CAAC,qBAQpD;AAED,iBAAS,UAAU,CAAC,EAClB,SAAS,EACT,QAAQ,EACR,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,eAAe,CAAC,IAAI,CAAC,qBAgBnD;AAED,iBAAS,eAAe,CAAC,EACvB,SAAS,EACT,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,eAAe,CAAC,SAAS,CAAC,qBAQxD;AAED,OAAO,EACL,MAAM,EACN,WAAW,EACX,WAAW,EACX,aAAa,EACb,aAAa,EACb,WAAW,EACX,WAAW,EACX,UAAU,EACV,eAAe,EACf,oBAAoB,EACpB,sBAAsB,EACvB,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/components/ui/select/index.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAC9B,OAAO,KAAK,eAAe,MAAM,wBAAwB,CAAA;AAKzD,iBAAS,MAAM,CAAC,EACd,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,eAAe,CAAC,IAAI,CAAC,qBAEnD;AAED,iBAAS,WAAW,CAAC,EACnB,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,eAAe,CAAC,KAAK,CAAC,qBAEpD;AAED;;;;GAIG;AACH,iBAAS,WAAW,CAAC,EACnB,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,eAAe,CAAC,KAAK,CAAC,qBAEpD;AAED,KAAK,kBAAkB,GAAG,KAAK,CAAC,cAAc,CAC5C,OAAO,eAAe,CAAC,OAAO,CAC/B,GAAG;IACF,QAAQ,CAAC,EAAE,OAAO,CAAA;CACnB,CAAA;AAsBD,iBAAS,aAAa,CAAC,EACrB,SAAS,EACT,QAAQ,EACR,QAAQ,EACR,GAAG,KAAK,EACT,EAAE,kBAAkB,qBAsBpB;AAED,iBAAS,oBAAoB,CAAC,EAC5B,SAAS,EACT,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,eAAe,CAAC,cAAc,CAAC,qBAU7D;AACD,iBAAS,sBAAsB,CAAC,EAC9B,SAAS,EACT,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,eAAe,CAAC,gBAAgB,CAAC,qBAU/D;AAED,iBAAS,aAAa,CAAC,EACrB,SAAS,EACT,QAAQ,EACR,QAAmB,EACnB,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,eAAe,CAAC,OAAO,CAAC,qBA0CtD;AAED,iBAAS,WAAW,CAAC,EACnB,SAAS,EACT,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,wBAAwB,CAAC,KAAK,CAAC,qBAQvC;AAED,iBAAS,WAAW,CAAC,EACnB,SAAS,EACT,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,eAAe,CAAC,KAAK,CAAC,qBAQpD;AAED,iBAAS,UAAU,CAAC,EAClB,SAAS,EACT,QAAQ,EACR,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,eAAe,CAAC,IAAI,CAAC,qBAgBnD;AAED,iBAAS,eAAe,CAAC,EACvB,SAAS,EACT,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,eAAe,CAAC,SAAS,CAAC,qBAQxD;AAED,OAAO,EACL,MAAM,EACN,WAAW,EACX,WAAW,EACX,aAAa,EACb,aAAa,EACb,WAAW,EACX,WAAW,EACX,UAAU,EACV,eAAe,EACf,oBAAoB,EACpB,sBAAsB,EACvB,CAAA"}

package/dist/esm/components/ui/select/index.js

@@ -10,11 +10,34 @@ function Select({ ...props }) {
 function SelectGroup({ ...props }) {
     return _jsx(SelectPrimitive.Group, { "data-slot": "select-group", ...props });
 }
+/**
+ * Radix strips `className` and `style` off its `Select.Value` before rendering
+ * the span, so this slot cannot be styled directly — it is styled from the
+ * trigger instead, see VALUE_OVERFLOW_CLASS.
+ */
 function SelectValue({ ...props }) {
     return _jsx(SelectPrimitive.Value, { "data-slot": "select-value", ...props });
 }
+/**
+ * Truncate the selected value instead of letting it wrap out of the trigger.
+ *
+ * `.select-trigger` is a fixed-height `flex w-full items-center justify-between`
+ * box, and a flex item never shrinks below its own min-content width: a long
+ * value broke to a second line and overflowed the box. `min-w-0` lets the value
+ * slot shrink, `truncate` ellipsises what no longer fits — the chevron keeps its
+ * place because the value absorbs all the shrinkage.
+ *
+ * Written as a child-scoped variant on the TRIGGER because Radix strips
+ * `className` off `Select.Value` itself; the `>` combinator holds because Radix
+ * renders that span as the trigger's direct child.
+ *
+ * Truncation hides text, so a trigger showing a long value should also carry
+ * `title` — on the trigger, never on the value slot, which Radix renders
+ * `pointer-events: none`.
+ */
+const VALUE_OVERFLOW_CLASS = '[&>[data-slot=select-value]]:min-w-0 [&>[data-slot=select-value]]:truncate';
 function SelectTrigger({ className, readOnly, children, ...props }) {
-    return (_jsxs(SelectPrimitive.Trigger, { "data-slot": "select-trigger", "data-size": "default", className: cn('select-trigger select-read-only select-disabled', className), "aria-readonly": readOnly, "data-read-only": readOnly ? '' : undefined, ...props, children: [children, !readOnly && (_jsx(SelectPrimitive.Icon, { asChild: true, children: _jsx(ChevronDown, { className: "select-chevron" }) }))] }));
+    return (_jsxs(SelectPrimitive.Trigger, { "data-slot": "select-trigger", "data-size": "default", className: cn('select-trigger select-read-only select-disabled', VALUE_OVERFLOW_CLASS, className), "aria-readonly": readOnly, "data-read-only": readOnly ? '' : undefined, ...props, children: [children, !readOnly && (_jsx(SelectPrimitive.Icon, { asChild: true, children: _jsx(ChevronDown, { className: "select-chevron" }) }))] }));
 }
 function SelectScrollUpButton({ className, ...props }) {
     return (_jsx(SelectPrimitive.ScrollUpButton, { "data-slot": "select-scroll-up-button", className: cn('select-scroll-button', className), ...props, children: _jsx(ChevronUp, { className: "size-4" }) }));