@lerianstudio/sindarian-ui 2.0.0-beta.1 → 2.0.0-beta.11

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

@@ -2,8 +2,59 @@ 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, 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 })] }));
+import { useMemo, useRef } from 'react';
+/**
+ * Fan one node out to several refs. React hands a node to ONE ref, so a
+ * consumer ref and react-hook-form's `field.ref` cannot both be passed
+ * directly — one silently wins. Only used when the consumer actually supplied
+ * a ref, so a field without one keeps `field.ref`'s own identity and React
+ * never re-attaches it.
+ */
+function fanOutRef(...refs) {
+    return (node) => {
+        const cleanups = [];
+        for (const ref of refs) {
+            if (typeof ref === 'function') {
+                const cleanup = ref(node);
+                cleanups.push(typeof cleanup === 'function' ? cleanup : () => ref(null));
+            }
+            else if (ref) {
+                ;
+                ref.current = node;
+                cleanups.push(() => {
+                    ;
+                    ref.current = null;
+                });
+            }
+        }
+        return () => cleanups.forEach((cleanup) => cleanup());
+    };
+}
+export const InputField = ({ className, type, label, tooltip, labelExtra, placeholder, description, startAdornment, endAdornment, required, readOnly, minHeight, maxHeight, textArea, defaultValue, value, onChange, min, max, step, maxLength, autoComplete, inputMode, pattern, autoFocus, ref, 'aria-invalid': ariaInvalid, ...others }) => {
+    // OR with the form's error, expressed through the Slot merge rather than by
+    // reading the form: FormControl already injects `aria-invalid={!!error}`, and
+    // a child prop only wins that merge when the KEY is present. So emit the key
+    // only for an explicit `true`, and let FormControl answer for every other
+    // case. `true || error` is true; `false || error` is whatever the form says,
+    // which is the whole point — an explicit `false` cannot mute a live error.
+    // With no `control` there is no error to OR against, so FormControl injects
+    // `false` and today's behaviour is unchanged.
+    const ariaInvalidProp = ariaInvalid ? { 'aria-invalid': true } : undefined;
+    const formRef = useRef(undefined);
+    const composedRef = useMemo(() => ref ? fanOutRef((node) => formRef.current?.(node), ref) : ref, 
+    // `others.name` belongs here, and leaving it out is not a lint nit.
+    // react-hook-form hands a fresh `field.ref` for every name, and that ref
+    // only receives the element when React reattaches, which it does only when
+    // this callback's identity changes. Memoised on `ref` alone, one identity
+    // survived a name change, the new field never got its element, and
+    // `form.setFocus(newName)` then found nothing to focus and said nothing.
+    [ref, others.name]);
+    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, maxLength: maxLength, autoComplete: autoComplete, inputMode: inputMode, autoFocus: autoFocus, "data-testid": others['data-testid'], ...ariaInvalidProp, ...binding })) : (_jsx(Input, { className: className, type: type, placeholder: placeholder, readOnly: readOnly, startAdornment: startAdornment, endAdornment: endAdornment, 
+                    // Bounds belong to the single-line control only: `min`/`max`/`step`
+                    // mean nothing on a textarea and would render as invalid markup.
+                    min: min, max: max, step: step, maxLength: maxLength, autoComplete: autoComplete, inputMode: inputMode, 
+                    // Single-line only: `<textarea pattern>` is not a thing.
+                    pattern: pattern, autoFocus: autoFocus, "data-testid": others['data-testid'], ...ariaInvalidProp, ...binding })) }), _jsx(FormMessage, {}), description && _jsx(FormDescription, { children: description })] }));
     if (!others.control) {
         return renderItem({
             name: others.name,
@@ -11,7 +62,10 @@ export const InputField = ({ className, type, label, tooltip, labelExtra, placeh
             // 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)
+            onChange: (e) => onChange?.(e),
+            // Nothing else claims the node on this branch, so the consumer ref goes
+            // straight through. Without it there was no node to focus at all.
+            ref: ref
         });
     }
     return (_jsx(FormField, { ...others, name: others.name, 
@@ -19,16 +73,20 @@ export const InputField = ({ className, type, label, tooltip, labelExtra, placeh
         // 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);
-            }
-        }) }));
+        defaultValue: defaultValue, render: ({ field }) => {
+            formRef.current = field.ref;
+            return 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);
+                },
+                ref: (ref ? composedRef : field.ref)
+            });
+        } }));
 };

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

@@ -9,6 +9,10 @@ export type PasswordFieldProps<TFieldValues extends FieldValues = FieldValues, T
     required?: boolean;
     disabled?: boolean;
     'data-testid'?: string;
+    /** Accessible name of the eye button while the password is hidden. */
+    showPasswordLabel?: string;
+    /** Accessible name of the eye button while the password is showing. */
+    hidePasswordLabel?: string;
 };
-export declare function PasswordField<TFieldValues extends FieldValues = FieldValues, TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>>({ name, label, tooltip, placeholder, control, required, disabled, 'data-testid': dataTestId }: PasswordFieldProps<TFieldValues, TName>): React.JSX.Element;
+export declare function PasswordField<TFieldValues extends FieldValues = FieldValues, TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>>({ name, label, tooltip, placeholder, control, required, disabled, 'data-testid': dataTestId, showPasswordLabel, hidePasswordLabel }: PasswordFieldProps<TFieldValues, TName>): React.JSX.Element;
 //# sourceMappingURL=index.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/components/form/password-field/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AACzB,OAAO,EAAE,OAAO,EAAE,SAAS,EAAE,WAAW,EAAE,MAAM,iBAAiB,CAAA;AAajE,MAAM,MAAM,kBAAkB,CAC5B,YAAY,SAAS,WAAW,GAAG,WAAW,EAC9C,KAAK,SAAS,SAAS,CAAC,YAAY,CAAC,GAAG,SAAS,CAAC,YAAY,CAAC,IAC7D;IACF,IAAI,EAAE,KAAK,CAAA;IACX,KAAK,EAAE,MAAM,CAAA;IACb,OAAO,CAAC,EAAE,MAAM,CAAA;IAChB,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB,OAAO,EAAE,OAAO,CAAC,YAAY,CAAC,CAAA;IAC9B,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,aAAa,CAAC,EAAE,MAAM,CAAA;CACvB,CAAA;AAED,wBAAgB,aAAa,CAC3B,YAAY,SAAS,WAAW,GAAG,WAAW,EAC9C,KAAK,SAAS,SAAS,CAAC,YAAY,CAAC,GAAG,SAAS,CAAC,YAAY,CAAC,EAC/D,EACA,IAAI,EACJ,KAAK,EACL,OAAO,EACP,WAAW,EACX,OAAO,EACP,QAAgB,EAChB,QAAgB,EAChB,aAAa,EAAE,UAAU,EAC1B,EAAE,kBAAkB,CAAC,YAAY,EAAE,KAAK,CAAC,qBA0CzC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/components/form/password-field/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AACzB,OAAO,EAAE,OAAO,EAAE,SAAS,EAAE,WAAW,EAAE,MAAM,iBAAiB,CAAA;AAajE,MAAM,MAAM,kBAAkB,CAC5B,YAAY,SAAS,WAAW,GAAG,WAAW,EAC9C,KAAK,SAAS,SAAS,CAAC,YAAY,CAAC,GAAG,SAAS,CAAC,YAAY,CAAC,IAC7D;IACF,IAAI,EAAE,KAAK,CAAA;IACX,KAAK,EAAE,MAAM,CAAA;IACb,OAAO,CAAC,EAAE,MAAM,CAAA;IAChB,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB,OAAO,EAAE,OAAO,CAAC,YAAY,CAAC,CAAA;IAC9B,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,aAAa,CAAC,EAAE,MAAM,CAAA;IACtB,sEAAsE;IACtE,iBAAiB,CAAC,EAAE,MAAM,CAAA;IAC1B,uEAAuE;IACvE,iBAAiB,CAAC,EAAE,MAAM,CAAA;CAC3B,CAAA;AAED,wBAAgB,aAAa,CAC3B,YAAY,SAAS,WAAW,GAAG,WAAW,EAC9C,KAAK,SAAS,SAAS,CAAC,YAAY,CAAC,GAAG,SAAS,CAAC,YAAY,CAAC,EAC/D,EACA,IAAI,EACJ,KAAK,EACL,OAAO,EACP,WAAW,EACX,OAAO,EACP,QAAgB,EAChB,QAAgB,EAChB,aAAa,EAAE,UAAU,EACzB,iBAAmC,EACnC,iBAAmC,EACpC,EAAE,kBAAkB,CAAC,YAAY,EAAE,KAAK,CAAC,qBAuDzC"}

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

@@ -4,7 +4,7 @@ import { FormControl, FormField, FormItem, FormLabel, FormMessage, FormTooltip }
 import { Input, InputAdornment } from '../../../components/ui/input/index.js';
 import { Eye, EyeOff } from 'lucide-react';
 import { IconButton } from '../../../components/ui/icon-button/index.js';
-export function PasswordField({ name, label, tooltip, placeholder, control, required = false, disabled = false, 'data-testid': dataTestId }) {
+export function PasswordField({ name, label, tooltip, placeholder, control, required = false, disabled = false, 'data-testid': dataTestId, showPasswordLabel = 'Show password', hidePasswordLabel = 'Hide password' }) {
     const [show, setShow] = React.useState(false);
-    return (_jsx(FormField, { control: control, name: name, render: ({ field }) => (_jsxs(FormItem, { required: required, children: [_jsx(FormLabel, { extra: tooltip ? _jsx(FormTooltip, { children: tooltip }) : undefined, children: label }), _jsx(FormControl, { children: _jsx(Input, { ...field, type: show ? 'text' : 'password', placeholder: placeholder, endAdornment: _jsx(InputAdornment, { position: "end", children: _jsx(IconButton, { type: "button", variant: "outline", rounded: true, onClick: () => setShow(!show), children: show ? _jsx(EyeOff, {}) : _jsx(Eye, {}) }) }), disabled: disabled, className: "pr-10", "data-testid": dataTestId }) }), _jsx(FormMessage, {})] })) }));
+    return (_jsx(FormField, { control: control, name: name, render: ({ field }) => (_jsxs(FormItem, { required: required, children: [_jsx(FormLabel, { extra: tooltip ? _jsx(FormTooltip, { children: tooltip }) : undefined, children: label }), _jsx(FormControl, { children: _jsx(Input, { ...field, type: show ? 'text' : 'password', placeholder: placeholder, endAdornment: _jsx(InputAdornment, { position: "end", children: _jsx(IconButton, { type: "button", variant: "outline", rounded: true, "aria-label": show ? hidePasswordLabel : showPasswordLabel, onClick: () => setShow(!show), children: show ? _jsx(EyeOff, { "aria-hidden": true }) : _jsx(Eye, { "aria-hidden": true }) }) }), disabled: disabled, className: "pr-10", "data-testid": dataTestId }) }), _jsx(FormMessage, {})] })) }));
 }

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

@@ -13,7 +13,15 @@ type SelectFieldSharedProps<T extends FieldValues = FieldValues> = PropsWithChil
      *  with `value` + `onChange`. */
     control?: Control<T>;
     required?: boolean;
+    /** Copy for the "nothing to pick" row. Defaults to "No options found." */
     emptyMessage?: string;
+    /**
+     * Placed on the field's own root box, merged with its spacing rather than
+     * replacing it. The root is the element a parent grid positions, so
+     * without this a consumer had to wrap the field in a spare div just to
+     * span a column.
+     */
+    className?: string;
     'data-testid'?: string;
 };
 /**
@@ -39,6 +47,6 @@ type SelectFieldModeProps = {
     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 declare const SelectField: <T extends FieldValues = FieldValues>({ name, label, tooltip, labelExtra, required, placeholder, description, disabled, readOnly, multi, control, value, children, emptyMessage, className, 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,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"}
+{"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,0EAA0E;IAC1E,YAAY,CAAC,EAAE,MAAM,CAAA;IACrB;;;;;OAKG;IACH,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,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,6KAkB9D,gBAAgB,CAAC,CAAC,CAAC,sBA6FrB,CAAA"}

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

@@ -3,14 +3,14 @@ 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, value, children, emptyMessage = 'No options found.', onChange, ...others }) => {
+export const SelectField = ({ name, label, tooltip, labelExtra, required, placeholder, description, disabled, readOnly, multi, control, value, children, emptyMessage = 'No options found.', className, 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) => {
+        return (_jsxs(FormItem, { required: required, className: className, 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) => {

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

@@ -67,5 +67,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("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-muted-foreground 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-muted-foreground text-sm leading-relaxed font-medium", children: [answer, seeMore && href && (_jsxs(_Fragment, { children: [' ', _jsxs("a", { target: "_blank", rel: "noopener noreferrer", href: href, className: "text-muted-foreground 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-muted-foreground" }) }) })] }) }) }));
 }

package/dist/esm/components/table/id-table-cell.d.ts

@@ -2,6 +2,10 @@ import { TableCell } from '../../components/ui/table/index.js';
 export type IdTableCellProps = Omit<React.ComponentProps<typeof TableCell>, 'onCopy'> & {
     id?: string;
     onCopy?: (id: string) => void;
+    /** Characters kept from the start of the id. */
+    head?: number;
+    /** Characters kept from the end of the id. */
+    tail?: number;
 };
-export declare const IdTableCell: ({ id, onCopy, ...others }: IdTableCellProps) => import("react").JSX.Element;
+export declare const IdTableCell: ({ id, onCopy, head, tail, ...others }: IdTableCellProps) => import("react").JSX.Element;
 //# sourceMappingURL=id-table-cell.d.ts.map

package/dist/esm/components/table/id-table-cell.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"id-table-cell.d.ts","sourceRoot":"","sources":["../../../../src/components/table/id-table-cell.tsx"],"names":[],"mappings":"AAAA,OAAO,EACL,SAAS,EAGV,MAAM,uBAAuB,CAAA;AAU9B,MAAM,MAAM,gBAAgB,GAAG,IAAI,CACjC,KAAK,CAAC,cAAc,CAAC,OAAO,SAAS,CAAC,EACtC,QAAQ,CACT,GAAG;IACF,EAAE,CAAC,EAAE,MAAM,CAAA;IACX,MAAM,CAAC,EAAE,CAAC,EAAE,EAAE,MAAM,KAAK,IAAI,CAAA;CAC9B,CAAA;AAED,eAAO,MAAM,WAAW,GAAI,2BAA2B,gBAAgB,gCAqBtE,CAAA"}
+{"version":3,"file":"id-table-cell.d.ts","sourceRoot":"","sources":["../../../../src/components/table/id-table-cell.tsx"],"names":[],"mappings":"AAAA,OAAO,EACL,SAAS,EAGV,MAAM,uBAAuB,CAAA;AAS9B,MAAM,MAAM,gBAAgB,GAAG,IAAI,CACjC,KAAK,CAAC,cAAc,CAAC,OAAO,SAAS,CAAC,EACtC,QAAQ,CACT,GAAG;IACF,EAAE,CAAC,EAAE,MAAM,CAAA;IACX,MAAM,CAAC,EAAE,CAAC,EAAE,EAAE,MAAM,KAAK,IAAI,CAAA;IAC7B,gDAAgD;IAChD,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,8CAA8C;IAC9C,IAAI,CAAC,EAAE,MAAM,CAAA;CACd,CAAA;AA6CD,eAAO,MAAM,WAAW,GAAI,uCAMzB,gBAAgB,gCAiClB,CAAA"}

package/dist/esm/components/table/id-table-cell.js

@@ -1,12 +1,57 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { TableCell, TableCellAction, TableCellWrapper } from '../../components/ui/table/index.js';
 import { Tooltip, TooltipContent, TooltipProvider, TooltipTrigger } from '../../components/ui/tooltip/index.js';
-import truncate from 'lodash/truncate.js';
 import { Copy } from 'lucide-react';
-export const IdTableCell = ({ id, onCopy, ...others }) => {
+/**
+ * ⛔ TRUNCATE IN THE MIDDLE, NEVER FROM THE START.
+ *
+ * This cell renders UUIDs, and a ledger hands out long runs of them from a
+ * shared prefix — `00000000-0000-0000-0000-00000000000{1,2,3}`. Keeping the
+ * first 13 characters, which is what `truncate(id, { length: 16 })` did,
+ * rendered every one of those rows as the same string: the only part that told
+ * them apart was the part that was dropped, and the reader had to hover each
+ * row in turn to find the one they wanted.
+ *
+ * Both ends carry information — the head says which family the id belongs to,
+ * the tail says which member — so both ends stay.
+ */
+const DEFAULT_HEAD = 8;
+const DEFAULT_TAIL = 4;
+/**
+ * ⛔ A BAD LENGTH CANNOT THROW HERE. This runs in a render path, so refusing a
+ * malformed prop would unmount the whole table rather than one cell — a
+ * consumer computing `head` from data gets a broken cell, not a broken screen.
+ *
+ * `String.slice` reads a negative number as an offset from the END, so a
+ * negative `head` kept nearly the entire id and put an ellipsis in the middle
+ * of it, and `NaN` read as 0 and dropped the head — the exact failure middle
+ * truncation exists to prevent, and one character LONGER than the untruncated
+ * id. Clamped to a non-negative whole number; anything non-finite falls back
+ * to the default, which a caller passing `NaN` has already bypassed.
+ */
+function charCount(value, fallback) {
+    return Number.isFinite(value) ? Math.max(0, Math.trunc(value)) : fallback;
+}
+function truncateMiddle(id, head, tail) {
+    const start = charCount(head, DEFAULT_HEAD);
+    const end = charCount(tail, DEFAULT_TAIL);
+    // No ellipsis unless it actually saves characters: at head + tail + 1 the
+    // truncation is the same length as the id and hides a character for nothing.
+    return id.length <= start + end + 1
+        ? id
+        : `${id.slice(0, start)}…${id.slice(id.length - end)}`;
+}
+export const IdTableCell = ({ id, onCopy, head = DEFAULT_HEAD, tail = DEFAULT_TAIL, ...others }) => {
     const handleCopyToClipboard = () => {
+        // The WHOLE id, never what is rendered. The cell is the only place most
+        // consoles expose it, and a truncated id pasted into a query matches
+        // nothing.
         navigator.clipboard.writeText(id);
         onCopy?.(id);
     };
-    return (_jsx(TableCell, { onClick: handleCopyToClipboard, ...others, children: _jsxs(TableCellWrapper, { children: [_jsx(TooltipProvider, { children: _jsxs(Tooltip, { delayDuration: 300, children: [_jsx(TooltipTrigger, { children: truncate(id, { length: 16 }) }), _jsx(TooltipContent, { children: id })] }) }), _jsx(TableCellAction, { children: _jsx(Copy, { className: "size-3.5" }) })] }) }));
+    return (_jsx(TableCell, { onClick: handleCopyToClipboard, 
+        // The tooltip is the styled affordance; `title` is the fallback that
+        // survives without it — a printed page, a portal that has not mounted,
+        // and the cell padding outside the trigger.
+        title: id, ...others, children: _jsxs(TableCellWrapper, { children: [_jsx(TooltipProvider, { children: _jsxs(Tooltip, { delayDuration: 300, children: [_jsx(TooltipTrigger, { children: id ? truncateMiddle(id, head, tail) : id }), _jsx(TooltipContent, { children: id })] }) }), _jsx(TableCellAction, { children: _jsx(Copy, { className: "size-3.5" }) })] }) }));
 };

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

@@ -25,14 +25,29 @@ export type AutocompleteTriggerProps = React.ComponentProps<'div'> & {
     clearLabel?: string;
 };
 export declare function AutocompleteTrigger({ ref, className, onClear, clearLabel, children }: AutocompleteTriggerProps): React.JSX.Element;
+export declare namespace AutocompleteTrigger {
+    var displayName: string;
+}
 export declare function AutocompleteValue({ ref, className, value: valueProp, onValueChange, onBlur, ...props }: React.ComponentProps<typeof CommandPrimitive.Input>): React.JSX.Element;
+export declare namespace AutocompleteValue {
+    var displayName: string;
+}
 export type AutocompleteMultipleValueProps = React.ComponentProps<typeof CommandPrimitive.Input> & {
     /** Accessible label for each chip's remove button, prefixed to its value. */
     clearLabel?: string;
 };
 export declare function AutocompleteMultipleValue({ ref, className, clearLabel, ...props }: AutocompleteMultipleValueProps): React.JSX.Element;
+export declare namespace AutocompleteMultipleValue {
+    var displayName: string;
+}
 export declare function AutocompleteEmpty({ className, ...props }: React.ComponentProps<typeof CommandPrimitive.Empty>): React.JSX.Element | null;
+export declare namespace AutocompleteEmpty {
+    var displayName: string;
+}
 export declare function AutocompleteLoading({ className, ref, ...props }: React.ComponentProps<typeof CommandPrimitive.Loading>): React.JSX.Element;
+export declare namespace AutocompleteLoading {
+    var displayName: string;
+}
 export declare const SIDE_OPTIONS: string[];
 type Side = (typeof SIDE_OPTIONS)[number];
 export type AutocompleteContentProps = React.ComponentProps<typeof CommandPrimitive.List> & {
@@ -41,7 +56,13 @@ export type AutocompleteContentProps = React.ComponentProps<typeof CommandPrimit
     onPointerDownOutside?: (event: MouseEvent | TouchEvent) => void;
 };
 export declare function AutocompleteContent({ className, position, side, ref, children, onMouseEnter, onMouseLeave, onPointerDownOutside, ...props }: AutocompleteContentProps): React.JSX.Element;
+export declare namespace AutocompleteContent {
+    var displayName: string;
+}
 export declare function AutocompleteGroup({ className, ...props }: React.ComponentPropsWithoutRef<typeof CommandPrimitive.Group>): React.JSX.Element;
+export declare namespace AutocompleteGroup {
+    var displayName: string;
+}
 export type AutocompleteItemProps = React.ComponentPropsWithoutRef<typeof CommandPrimitive.Item> & {
     /** Text this option reads as wherever it is rendered outside the list (the
      *  input, a chip and its remove button). Required only when the children are
@@ -78,5 +99,8 @@ export type AutocompleteProps = Omit<React.ComponentProps<typeof CommandPrimitiv
     multiple?: boolean;
 };
 export declare function Autocomplete({ ref, value, defaultValue, onValueChange, onClear, className, open: openProp, onOpenChange, showValue, readOnly, disabled, multiple, onKeyDown, children, ...props }: AutocompleteProps): React.JSX.Element;
+export declare namespace Autocomplete {
+    var displayName: string;
+}
 export {};
 //# sourceMappingURL=index.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/components/ui/autocomplete/index.tsx"],"names":[],"mappings":"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"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/components/ui/autocomplete/index.tsx"],"names":[],"mappings":"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"}

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

@@ -366,3 +366,27 @@ export function Autocomplete({ ref, value, defaultValue, onValueChange, onClear,
                 onKeyDown?.(e);
             }, children: children }) }));
 }
+/**
+ * ⛔ THE REST OF THE SET, FOR THE SAME REASON AS `AutocompleteItem` ABOVE.
+ *
+ * A function component's `name` is whatever the bundler left it — one letter in
+ * a production build — so any lookup written against `child.type` needs an
+ * explicit string to compare. `AutocompleteItem` is the only part the walk
+ * reads TODAY, and it is the part that shipped an empty option registry to
+ * every consumer while it was anonymous. Naming the whole set costs a line each
+ * and removes the next instance of that defect before it is written; it also
+ * makes these parts legible in a React tree, which `MultipleSelect` next door
+ * has always done.
+ *
+ * `__tests__`-style enumeration lives in `autocomplete.test.tsx`: it reads the
+ * module's exports rather than a list, so a new part added without a name fails
+ * without anyone remembering to extend anything.
+ */
+Autocomplete.displayName = 'Autocomplete';
+AutocompleteTrigger.displayName = 'AutocompleteTrigger';
+AutocompleteValue.displayName = 'AutocompleteValue';
+AutocompleteMultipleValue.displayName = 'AutocompleteMultipleValue';
+AutocompleteContent.displayName = 'AutocompleteContent';
+AutocompleteGroup.displayName = 'AutocompleteGroup';
+AutocompleteEmpty.displayName = 'AutocompleteEmpty';
+AutocompleteLoading.displayName = 'AutocompleteLoading';

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

@@ -1,12 +1,5 @@
 import * as React from 'react';
 import { type VariantProps } from 'class-variance-authority';
-/**
- * `credit` is the accounting reading of a credit amount, NOT an alias of
- * `destructive` (an error/alarm). The credit role is a tint-and-ink pair:
- * `--credit-foreground` mirrors `--credit` by contract, so the red carries the
- * 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 —
@@ -14,6 +7,17 @@ import { type VariantProps } from 'class-variance-authority';
  * 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.
+ *
+ * `whitespace-nowrap` keeps the pill a pill. `rounded-full` draws the ends as
+ * semicircles sized to ONE line box, so a label that wraps stretches those caps
+ * over two lines and the shape reads as a rounded blob, not a token. It bit a
+ * consumer table whose column was sized to its content: `min-content` on
+ * wrappable text resolves to the WIDEST WORD, so a three-word group name landed
+ * at 112px wide and 46px tall against the 26px of a single-line badge. Nowrap
+ * also pins `min-content` to the full label, which is what lets a caller cap the
+ * box with `max-w-*` plus a truncating child and get an ellipsis. A caller that
+ * genuinely wants a wrapping badge passes `whitespace-normal`; tailwind-merge
+ * lets it win.
  */
 declare const badgeVariants: (props?: ({
     variant?: "default" | "secondary" | "outline" | "destructive" | "alert" | "success" | "active" | "inactive" | "credit" | "error" | "info" | "purple" | 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;;;;;;;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,qBAsBzE;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;;;;;;;;;;;;;;;;;;GAkBG;AACH,QAAA,MAAM,aAAa;;;8EAqDlB,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,qBAsBzE;AAED,OAAO,EAAE,KAAK,EAAE,aAAa,EAAE,CAAA"}

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

@@ -2,13 +2,6 @@ import { jsx as _jsx } from "react/jsx-runtime";
 import { cva } from 'class-variance-authority';
 import { cn } from '../../../lib/utils.js';
 import { Slot } from '@radix-ui/react-slot';
-/**
- * `credit` is the accounting reading of a credit amount, NOT an alias of
- * `destructive` (an error/alarm). The credit role is a tint-and-ink pair:
- * `--credit-foreground` mirrors `--credit` by contract, so the red carries the
- * 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 —
@@ -16,8 +9,19 @@ import { Slot } from '@radix-ui/react-slot';
  * 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.
+ *
+ * `whitespace-nowrap` keeps the pill a pill. `rounded-full` draws the ends as
+ * semicircles sized to ONE line box, so a label that wraps stretches those caps
+ * over two lines and the shape reads as a rounded blob, not a token. It bit a
+ * consumer table whose column was sized to its content: `min-content` on
+ * wrappable text resolves to the WIDEST WORD, so a three-word group name landed
+ * at 112px wide and 46px tall against the 26px of a single-line badge. Nowrap
+ * also pins `min-content` to the full label, which is what lets a caller cap the
+ * box with `max-w-*` plus a truncating child and get an ellipsis. A caller that
+ * genuinely wants a wrapping badge passes `whitespace-normal`; tailwind-merge
+ * lets it win.
  */
-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', {
+const badgeVariants = cva('inline-flex items-center gap-1 whitespace-nowrap 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',
@@ -25,6 +29,14 @@ const badgeVariants = cva('inline-flex items-center gap-1 rounded-full border bo
             inactive: 'bg-muted text-foreground border-muted-foreground/40 py-[2px] px-3',
             secondary: 'border-transparent bg-muted-foreground text-white dark:text-black',
             destructive: 'border-transparent bg-destructive text-destructive-foreground hover:bg-destructive/80',
+            /**
+             * The accounting reading of a credit amount, NOT an alias of
+             * `destructive` (an error/alarm). The credit role is a tint-and-ink
+             * pair: `--credit-foreground` mirrors `--credit` by contract, so the
+             * red carries the 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.
+             */
             credit: 'border-credit/30 bg-credit/10 text-credit-foreground px-[10px] py-1',
             error: 'border-system-error-border bg-system-error-surface text-system-error-text px-[10px] py-1',
             success: 'border-system-success-border bg-system-success-surface text-system-success-text px-[10px] py-1',

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

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/components/ui/calendar/index.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAC9B,OAAO,EACL,SAAS,EAET,KAAK,SAAS,EACf,MAAM,kBAAkB,CAAA;AAGzB,OAAO,EAAE,MAAM,EAAkB,MAAM,wBAAwB,CAAA;AAO/D,iBAAS,QAAQ,CAAC,EAChB,SAAS,EACT,UAAU,EACV,eAAsB,EACtB,aAAuB,EACvB,aAAuB,EACvB,UAAU,EACV,UAAU,EACV,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,SAAS,CAAC,GAAG;IAC1C,aAAa,CAAC,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,MAAM,CAAC,CAAC,SAAS,CAAC,CAAA;CAC/D,qBA0JA;AAED,iBAAS,iBAAiB,CAAC,EACzB,SAAS,EACT,GAAG,EACH,SAAS,EACT,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,SAAS,CAAC,qBAqCxC;AAED,OAAO,EAAE,QAAQ,EAAE,iBAAiB,EAAE,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/components/ui/calendar/index.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAC9B,OAAO,EACL,SAAS,EAGT,KAAK,SAAS,EACf,MAAM,kBAAkB,CAAA;AAGzB,OAAO,EAAE,MAAM,EAAkB,MAAM,wBAAwB,CAAA;AAO/D,iBAAS,QAAQ,CAAC,EAChB,SAAS,EACT,UAAU,EACV,eAAsB,EACtB,aAAuB,EACvB,aAAuB,EACvB,UAAU,EACV,UAAU,EACV,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,SAAS,CAAC,GAAG;IAC1C,aAAa,CAAC,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,MAAM,CAAC,CAAC,SAAS,CAAC,CAAA;CAC/D,qBAgKA;AAED,iBAAS,iBAAiB,CAAC,EACzB,SAAS,EACT,GAAG,EACH,SAAS,EACT,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,SAAS,CAAC,qBAqCxC;AAED,OAAO,EAAE,QAAQ,EAAE,iBAAiB,EAAE,CAAA"}

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

@@ -1,14 +1,20 @@
 'use client';
 import { jsx as _jsx } from "react/jsx-runtime";
 import * as React from 'react';
-import { DayPicker, getDefaultClassNames } from 'react-day-picker';
+import { DayPicker, defaultDateLib, getDefaultClassNames } from 'react-day-picker';
 import { cn } from '../../../lib/utils.js';
 import { Button, buttonVariants } from '../../../components/ui/button/index.js';
 import { ChevronLeftIcon, ChevronRightIcon, ChevronDownIcon } from 'lucide-react';
 function Calendar({ className, classNames, showOutsideDays = true, captionLayout = 'label', buttonVariant = 'plain', formatters, components, ...props }) {
     const defaultClassNames = getDefaultClassNames();
     return (_jsx(DayPicker, { showOutsideDays: showOutsideDays, className: cn('bg-background group/calendar p-2 [--cell-radius:var(--radius-md)] [--cell-size:34px] [--nav-size:28px] [[data-slot=card-content]_&]:bg-transparent [[data-slot=popover-content]_&]:bg-transparent', String.raw `rtl:**:[.rdp-button\_next>svg]:rotate-180`, String.raw `rtl:**:[.rdp-button\_previous>svg]:rotate-180`, className), captionLayout: captionLayout, formatters: {
-            formatMonthDropdown: (date) => date.toLocaleString('default', { month: 'short' }),
+            // react-day-picker's own default is dateLib.format(month, 'LLLL'), the
+            // full month name in the locale it was given. Shortening it has to go
+            // through the same dateLib: Date.toLocaleString('default') reads the
+            // runtime locale instead, so the dropdown fell back to English while
+            // the weekdays and the caption around it stayed in the consumer's
+            // language. 'LLL' is the abbreviated form of the same standalone month.
+            formatMonthDropdown: (month, dateLib = defaultDateLib) => dateLib.format(month, 'LLL'),
             ...formatters
         }, classNames: {
             root: cn('w-fit', defaultClassNames.root),

package/dist/esm/components/ui/copy-field/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/components/ui/copy-field/index.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAM9B,MAAM,MAAM,cAAc,GAAG;IAC3B;;;OAGG;IACH,KAAK,EAAE,MAAM,CAAA;IACb;;;OAGG;IACH,KAAK,CAAC,EAAE,MAAM,CAAA;IACd;;;;OAIG;IACH,MAAM,CAAC,EAAE,OAAO,CAAA;IAChB;;;OAGG;IACH,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB;;;;OAIG;IACH,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB;;;;OAIG;IACH,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB;;;;OAIG;IACH,UAAU,CAAC,EAAE,MAAM,CAAA;IACnB;;;;;;;;;;OAUG;IACH,mBAAmB,CAAC,EAAE,MAAM,CAAA;CAC7B,CAAA;AAmCD,wBAAgB,SAAS,CAAC,EACxB,KAAK,EACL,KAAK,EACL,MAAc,EACd,WAAW,EACX,WAA0B,EAC1B,SAAwB,EACxB,UAA4B,EAC5B,mBAAmB,EACpB,EAAE,cAAc,qBA6JhB"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/components/ui/copy-field/index.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAM9B,MAAM,MAAM,cAAc,GAAG;IAC3B;;;OAGG;IACH,KAAK,EAAE,MAAM,CAAA;IACb;;;OAGG;IACH,KAAK,CAAC,EAAE,MAAM,CAAA;IACd;;;;OAIG;IACH,MAAM,CAAC,EAAE,OAAO,CAAA;IAChB;;;OAGG;IACH,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB;;;;OAIG;IACH,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB;;;;OAIG;IACH,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB;;;;OAIG;IACH,UAAU,CAAC,EAAE,MAAM,CAAA;IACnB;;;;;;;;;;OAUG;IACH,mBAAmB,CAAC,EAAE,MAAM,CAAA;CAC7B,CAAA;AAmCD,wBAAgB,SAAS,CAAC,EACxB,KAAK,EACL,KAAK,EACL,MAAc,EACd,WAAW,EACX,WAA0B,EAC1B,SAAwB,EACxB,UAA4B,EAC5B,mBAAmB,EACpB,EAAE,cAAc,qBAkKhB"}

package/dist/esm/components/ui/copy-field/index.js

@@ -115,5 +115,5 @@ export function CopyField({ value, label, masked = false, onCopyLabel, revealLab
                         // long value (e.g. a UUID recovery code) scrolls inside the field
                         // instead of overflowing its container. No `font-mono`: the value
                         // inherits the app sans font (Inter) so it matches every other field.
-                        className: "text-input-foreground h-full min-w-0 flex-1 cursor-text border-none bg-transparent text-sm outline-none select-text focus:ring-0 focus:ring-offset-0" }), masked ? (_jsx(IconButton, { type: "button", variant: "outline", size: "small", rounded: true, "aria-pressed": revealed, "aria-label": revealed ? hideLabel : revealLabel, onClick: () => setRevealed((prev) => !prev), children: revealed ? _jsx(EyeOff, {}) : _jsx(Eye, {}) })) : null, _jsx(IconButton, { type: "button", variant: "outline", size: "small", rounded: true, "aria-label": copyAccessibleName, onClick: handleCopy, children: copied ? _jsx(Check, {}) : _jsx(Copy, {}) })] })] }));
+                        className: "text-input-foreground h-full min-w-0 flex-1 cursor-text border-none bg-transparent text-sm outline-none select-text focus:ring-0 focus:ring-offset-0" }), masked ? (_jsx(IconButton, { type: "button", variant: "outline", size: "small", rounded: true, "aria-label": revealed ? hideLabel : revealLabel, onClick: () => setRevealed((prev) => !prev), children: revealed ? _jsx(EyeOff, {}) : _jsx(Eye, {}) })) : null, _jsx(IconButton, { type: "button", variant: "outline", size: "small", rounded: true, "aria-label": copyAccessibleName, onClick: handleCopy, children: copied ? _jsx(Check, {}) : _jsx(Copy, {}) })] })] }));
 }