@lerianstudio/sindarian-ui 2.0.0-beta.12 → 2.0.0-beta.14

package/dist/esm/components/table/locked-table-actions.js

@@ -2,6 +2,36 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { LockIcon } from 'lucide-react';
 import { Tooltip, TooltipContent, TooltipProvider, TooltipTrigger } from '../../components/ui/tooltip/index.js';
 import { cn } from '../../lib/utils.js';
+/**
+ * Where a row's action menu would be, on a record the ledger will not let
+ * anyone change — an external account, in double-entry terms.
+ *
+ * ⛔ THE TRIGGER IS A BUTTON. It used to be a `<div>`, so the ONLY explanation
+ * of why the menu is gone lived in a tooltip that a keyboard could not open and
+ * a screen reader had nothing to attach to: the row simply had one control
+ * fewer, unexplained.
+ *
+ * `aria-disabled`, not the `disabled` attribute: a truly disabled button takes
+ * no focus and fires no pointer events, so it would announce as unavailable and
+ * then refuse to open the tooltip that says WHY — the same dead end in a
+ * different shape. This one is reachable, announces its reason as its name,
+ * opens the tooltip on focus as well as hover, and does nothing when pressed.
+ *
+ * ⛔ DOING NOTHING TAKES A HANDLER. `aria-disabled` is a promise to the
+ * accessibility tree, not to the DOM: the press really does dispatch a click,
+ * and a click bubbles. Consumers put this where a row's action menu would be,
+ * in rows that open the record — so with no handler of its own the one control
+ * that says "you cannot change this" would open the record it refuses to
+ * change, from a pointer and, because a button turns Enter and Space into
+ * clicks, from a keyboard too.
+ */
 export const LockedTableActions = ({ message, className }) => {
-    return (_jsx(TooltipProvider, { children: _jsxs(Tooltip, { children: [_jsx(TooltipTrigger, { asChild: true, children: _jsx("div", { className: cn('border-border bg-muted flex size-9 items-center justify-center rounded-md border', className), children: _jsx(LockIcon, { size: 14, className: "text-muted-foreground" }) }) }), _jsx(TooltipContent, { side: "left", children: message })] }) }));
+    return (_jsx(TooltipProvider, { children: _jsxs(Tooltip, { children: [_jsx(TooltipTrigger, { asChild: true, children: _jsx("button", { type: "button", "aria-disabled": "true", "aria-label": message, onClick: (event) => {
+                            event.preventDefault();
+                            event.stopPropagation();
+                        }, className: cn('border-border bg-muted flex size-9 items-center justify-center rounded-md border', 
+                        // Reachable is half the fix: a `border` over a `bg-muted` can
+                        // swallow the browser's default outline entirely, and the other
+                        // two cells in this table carry the same ring.
+                        'focus-visible:ring-ring focus-visible:ring-2 focus-visible:ring-offset-2 focus-visible:outline-none', className), children: _jsx(LockIcon, { size: 14, className: "text-muted-foreground" }) }) }), _jsx(TooltipContent, { side: "left", children: message })] }) }));
 };

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

@@ -1,6 +1,59 @@
 import { TableCell } from '../ui/table/index.js';
-export type NameTableCellProps = React.ComponentProps<typeof TableCell> & {
-    name?: string | React.ReactNode;
-};
-export declare const NameTableCell: ({ name, ...props }: NameTableCellProps) => import("react").JSX.Element;
+/** Opens the record. Lands on a real button, never on the `<td>`. */
+type OpenRecord = React.MouseEventHandler<HTMLButtonElement>;
+export type NameTableCellProps = Omit<React.ComponentProps<typeof TableCell>, 'onClick'> & 
+/**
+ * Three shapes, and the only one missing is an interactive cell that can
+ * carry no accessible name.
+ *
+ * 1. A text `name` IS the button's accessible name, so the handler is free
+ *    and `buttonLabel` merely overrides what the button announces.
+ * 2. Anything else rendered inside the button — a badge, an icon, an italic
+ *    placeholder — may carry no text at all, so it has to name its button.
+ * 3. No handler, no control: text in a table has nothing to name.
+ */
+({
+    name: string;
+    onClick?: OpenRecord;
+    buttonLabel?: string;
+} | {
+    name?: React.ReactNode;
+    onClick: OpenRecord;
+    buttonLabel: string;
+} | {
+    name?: React.ReactNode;
+    onClick?: never;
+    buttonLabel?: never;
+});
+/**
+ * The name column, which is how an operator opens a record from a list.
+ *
+ * ⛔ THE CLICK IS A BUTTON, NEVER THE `<td>`. The cell had no click prop at
+ * all, so a consumer wanting a clickable name put `onClick` on the `<td>`
+ * through the spread props: a pointer user saw an affordance under a
+ * `<p class="cursor-pointer">`, and a keyboard or screen-reader user got a
+ * table cell with no control in it — the row's only route to the record was
+ * unreachable. `onClick` is now `Omit`ed from the inherited cell props, so the
+ * `<td>` handler is unrepresentable and the compiler says so at the call site.
+ *
+ * And with no handler there is no pointer cursor: text that says it is
+ * clickable and is not is worse than plain text.
+ *
+ * ⛔ AN INTERACTIVE CELL CANNOT BE ANONYMOUS. `name` renders INSIDE the button,
+ * so whatever it renders is the button's accessible name — and a `ReactNode` is
+ * free to render no text at all, which announces as a bare "button" and leaves
+ * the row's only route to its record as unreachable as the `<td>` handler
+ * above. The props are a union rather than a comment: a text `name` names the
+ * button by itself, anything else has to pass `buttonLabel`, and a cell with no
+ * handler is exempt because it holds no control.
+ *
+ * `buttonLabel` and not an inherited `aria-label`, which the spread puts on the
+ * `<td>` — naming the CELL, never the control inside it.
+ *
+ * ⛔ AND THE UNION STILL LETS THE EMPTY STRING THROUGH, because every string
+ * type does. `name=""` satisfies the text arm and `buttonLabel="   "` satisfies
+ * the labelled one, so the last word is the component's, below.
+ */
+export declare const NameTableCell: ({ name, onClick, buttonLabel, ...props }: NameTableCellProps) => import("react").JSX.Element;
+export {};
 //# sourceMappingURL=name-table-cell.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"name-table-cell.d.ts","sourceRoot":"","sources":["../../../../src/components/table/name-table-cell.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,SAAS,EAAqC,MAAM,aAAa,CAAA;AAE1E,MAAM,MAAM,kBAAkB,GAAG,KAAK,CAAC,cAAc,CAAC,OAAO,SAAS,CAAC,GAAG;IACxE,IAAI,CAAC,EAAE,MAAM,GAAG,KAAK,CAAC,SAAS,CAAA;CAChC,CAAA;AAED,eAAO,MAAM,aAAa,GAAI,oBAAoB,kBAAkB,gCAWnE,CAAA"}
+{"version":3,"file":"name-table-cell.d.ts","sourceRoot":"","sources":["../../../../src/components/table/name-table-cell.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,SAAS,EAAqC,MAAM,aAAa,CAAA;AAE1E,qEAAqE;AACrE,KAAK,UAAU,GAAG,KAAK,CAAC,iBAAiB,CAAC,iBAAiB,CAAC,CAAA;AAE5D,MAAM,MAAM,kBAAkB,GAAG,IAAI,CACnC,KAAK,CAAC,cAAc,CAAC,OAAO,SAAS,CAAC,EACtC,SAAS,CACV;AACC;;;;;;;;;GASG;AACH,CACI;IAAE,IAAI,EAAE,MAAM,CAAC;IAAC,OAAO,CAAC,EAAE,UAAU,CAAC;IAAC,WAAW,CAAC,EAAE,MAAM,CAAA;CAAE,GAC5D;IAAE,IAAI,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAAC,OAAO,EAAE,UAAU,CAAC;IAAC,WAAW,EAAE,MAAM,CAAA;CAAE,GACpE;IAAE,IAAI,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAAC,OAAO,CAAC,EAAE,KAAK,CAAC;IAAC,WAAW,CAAC,EAAE,KAAK,CAAA;CAAE,CACnE,CAAA;AAEH;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA4BG;AACH,eAAO,MAAM,aAAa,GAAI,0CAK3B,kBAAkB,gCAgDpB,CAAA"}

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

@@ -1,6 +1,54 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { Search } from 'lucide-react';
 import { TableCell, TableCellWrapper, TableCellAction } from '../ui/table/index.js';
-export const NameTableCell = ({ name, ...props }) => {
-    return (_jsx(TableCell, { ...props, children: _jsxs(TableCellWrapper, { children: [_jsx("p", { className: "cursor-pointer", children: name }), _jsx(TableCellAction, { children: _jsx(Search, { className: "size-3.5" }) })] }) }));
+/**
+ * The name column, which is how an operator opens a record from a list.
+ *
+ * ⛔ THE CLICK IS A BUTTON, NEVER THE `<td>`. The cell had no click prop at
+ * all, so a consumer wanting a clickable name put `onClick` on the `<td>`
+ * through the spread props: a pointer user saw an affordance under a
+ * `<p class="cursor-pointer">`, and a keyboard or screen-reader user got a
+ * table cell with no control in it — the row's only route to the record was
+ * unreachable. `onClick` is now `Omit`ed from the inherited cell props, so the
+ * `<td>` handler is unrepresentable and the compiler says so at the call site.
+ *
+ * And with no handler there is no pointer cursor: text that says it is
+ * clickable and is not is worse than plain text.
+ *
+ * ⛔ AN INTERACTIVE CELL CANNOT BE ANONYMOUS. `name` renders INSIDE the button,
+ * so whatever it renders is the button's accessible name — and a `ReactNode` is
+ * free to render no text at all, which announces as a bare "button" and leaves
+ * the row's only route to its record as unreachable as the `<td>` handler
+ * above. The props are a union rather than a comment: a text `name` names the
+ * button by itself, anything else has to pass `buttonLabel`, and a cell with no
+ * handler is exempt because it holds no control.
+ *
+ * `buttonLabel` and not an inherited `aria-label`, which the spread puts on the
+ * `<td>` — naming the CELL, never the control inside it.
+ *
+ * ⛔ AND THE UNION STILL LETS THE EMPTY STRING THROUGH, because every string
+ * type does. `name=""` satisfies the text arm and `buttonLabel="   "` satisfies
+ * the labelled one, so the last word is the component's, below.
+ */
+export const NameTableCell = ({ name, onClick, buttonLabel, ...props }) => {
+    // Whitespace names nothing. An `aria-label` of "   " is worse than none: it
+    // OVERRIDES the text inside the button, so a perfectly good name is replaced
+    // by silence. Drop it and the text content names the control again.
+    const label = buttonLabel?.trim() ? buttonLabel : undefined;
+    // Only a text `name` can name the button by itself. Any other node is opaque
+    // here — which is why the type demands a label for it in the first place.
+    const textName = typeof name === 'string' ? name.trim() : '';
+    const named = Boolean(label) || textName !== '';
+    // ⛔ AN UNNAMED BUTTON LOSES ITS HANDLER, IT DOES NOT SHIP. The two failures
+    // are not symmetric: a button announcing "" is invisible to the developer who
+    // wrote it and fatal to the operator who cannot use a mouse, while a name
+    // that does not open its record shows itself on the very first render. So the
+    // cell degrades to the plain text it can still display correctly, and says so
+    // where a developer will see it. Never throws: one nameless row must not take
+    // the whole table down.
+    if (process.env.NODE_ENV !== 'production' && onClick && !named) {
+        console.error(`NameTableCell has no accessible name: \`${typeof name === 'string' ? 'name' : 'buttonLabel'}\` is empty, so its click handler was dropped rather than render a button announcing "".`);
+    }
+    const opensRecord = onClick && named;
+    return (_jsx(TableCell, { ...props, children: _jsxs(TableCellWrapper, { children: [opensRecord ? (_jsx("button", { type: "button", onClick: onClick, "aria-label": label, className: "focus-visible:ring-ring cursor-pointer rounded-sm text-left focus-visible:ring-2 focus-visible:outline-none", children: name })) : (_jsx("p", { children: name })), _jsx(TableCellAction, { children: _jsx(Search, { className: "size-3.5" }) })] }) }));
 };

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

@@ -39,6 +39,30 @@ export type CopyFieldProps = {
      * @defaultValue 'Value to copy'
      */
     valueLabel?: string;
+    /**
+     * Accessible name for the copy button. Override for localization. Defaults to
+     * English, derived from `label` when there is one.
+     * @defaultValue `Copy ${label}`, or 'Copy value' without a label
+     */
+    copyLabel?: string;
+    /**
+     * Toast text on the fallback path, when the clipboard API is unavailable or
+     * refuses the write and the value is selected for a manual Ctrl/Cmd+C
+     * instead. Override for localization. Defaults to English.
+     * @defaultValue 'Copy not available — text selected, press Ctrl/Cmd+C'
+     */
+    fallbackLabel?: string;
+    /**
+     * Renders the value in the monospace face. For identifiers, tokens and
+     * recovery codes, where character shapes must be told apart.
+     * @defaultValue false
+     */
+    mono?: boolean;
+    /**
+     * One-line hint rendered under the field and announced with the input via
+     * `aria-describedby`. Omit for no element and no attribute.
+     */
+    description?: React.ReactNode;
     /**
      * Milliseconds after a *successful* copy before the clipboard is wiped, for
      * sensitive values that shouldn't linger there (TOTP secrets, recovery
@@ -52,5 +76,5 @@ export type CopyFieldProps = {
      */
     clearClipboardAfter?: number;
 };
-export declare function CopyField({ value, label, masked, onCopyLabel, revealLabel, hideLabel, valueLabel, clearClipboardAfter }: CopyFieldProps): React.JSX.Element;
+export declare function CopyField({ value, label, masked, onCopyLabel, revealLabel, hideLabel, valueLabel, copyLabel, fallbackLabel, mono, description, clearClipboardAfter }: CopyFieldProps): React.JSX.Element;
 //# sourceMappingURL=index.d.ts.map

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,qBAkKhB"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/components/ui/copy-field/index.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAO9B,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;;;;OAIG;IACH,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB;;;;;OAKG;IACH,aAAa,CAAC,EAAE,MAAM,CAAA;IACtB;;;;OAIG;IACH,IAAI,CAAC,EAAE,OAAO,CAAA;IACd;;;OAGG;IACH,WAAW,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IAC7B;;;;;;;;;;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,SAAS,EACT,aAAa,EACb,IAAY,EACZ,WAAW,EACX,mBAAmB,EACpB,EAAE,cAAc,qBAqLhB"}

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

@@ -4,6 +4,7 @@ import * as React from 'react';
 import { Check, Copy, Eye, EyeOff } from 'lucide-react';
 import { IconButton } from '../../../components/ui/icon-button/index.js';
 import { useToast } from '../../../hooks/use-toast.js';
+import { cn } from '../../../lib/utils.js';
 const DEFAULT_COPY_LABEL = 'Copied to clipboard!';
 const FALLBACK_COPY_LABEL = 'Copy not available — text selected, press Ctrl/Cmd+C';
 const COPIED_ICON_TIMEOUT = 1500;
@@ -31,17 +32,18 @@ const clearClipboardIfUnchanged = async (copiedValue) => {
         // Read or write refused; the clipboard stays as-is.
     }
 };
-export function CopyField({ value, label, masked = false, onCopyLabel, revealLabel = 'Show value', hideLabel = 'Hide value', valueLabel = 'Value to copy', clearClipboardAfter }) {
+export function CopyField({ value, label, masked = false, onCopyLabel, revealLabel = 'Show value', hideLabel = 'Hide value', valueLabel = 'Value to copy', copyLabel, fallbackLabel, mono = false, description, clearClipboardAfter }) {
     const { toast } = useToast();
     const generatedId = React.useId();
     const inputId = `${generatedId}-copy-field`;
+    const descriptionId = `${inputId}-description`;
     const inputRef = React.useRef(null);
     const copiedTimerRef = React.useRef(null);
     const clearTimerRef = React.useRef(null);
     const [revealed, setRevealed] = React.useState(false);
     const [copied, setCopied] = React.useState(false);
     const showAsText = !masked || revealed;
-    const copyAccessibleName = label ? `Copy ${label}` : 'Copy value';
+    const copyAccessibleName = copyLabel ?? (label ? `Copy ${label}` : 'Copy value');
     React.useEffect(() => {
         return () => {
             if (copiedTimerRef.current) {
@@ -73,7 +75,7 @@ export function CopyField({ value, label, masked = false, onCopyLabel, revealLab
     };
     const handleFallback = () => {
         selectFieldText();
-        toast({ title: FALLBACK_COPY_LABEL });
+        toast({ title: fallbackLabel ?? FALLBACK_COPY_LABEL });
     };
     const handleCopy = async () => {
         if (!isClipboardAvailable()) {
@@ -110,10 +112,13 @@ export function CopyField({ value, label, masked = false, onCopyLabel, revealLab
                         // codes. While masked it renders as type="password", which invites
                         // browsers and password managers to autofill it or offer to SAVE its
                         // value, and spellcheck can ship the text to a remote service.
-                        autoComplete: "off", spellCheck: false, "aria-label": label ? undefined : valueLabel, 
+                        autoComplete: "off", spellCheck: false, "aria-label": label ? undefined : valueLabel, "aria-describedby": description ? descriptionId : undefined, 
                         // `min-w-0` lets this flex item shrink below its content width so a
                         // 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-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, {}) })] })] }));
+                        // instead of overflowing its container. Sans by default, inheriting
+                        // the app font (Inter) so the field matches every other input;
+                        // `mono` opts identifiers, tokens and recovery codes into the
+                        // monospace face, where telling 0 from O decides whether the value
+                        // read back is the value.
+                        className: cn('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', mono && 'font-mono') }), 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, {}) })] }), description ? (_jsx("p", { "data-slot": "copy-field-description", id: descriptionId, className: "text-muted-foreground text-xs", children: description })) : null] }));
 }

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;;;;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"}
+{"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;AA0BD,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

@@ -27,15 +27,19 @@ function SelectValue({ ...props }) {
  * 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.
+ * Written as a descendant-scoped variant on the TRIGGER because Radix strips
+ * `className` off `Select.Value` itself. DESCENDANT, not `>`: a trigger that
+ * carries a leading glyph groups the glyph and the value into one flex child
+ * (see `SelectField`'s `leadingIcon`), so the value span is no longer the
+ * trigger's direct child and a `>` combinator stopped truncating exactly where
+ * the trigger has the least room. The wrapper carries `min-w-0` itself, which
+ * is what lets the shrinkage reach the value.
  *
  * 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';
+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', 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" }) }))] }));
 }

package/dist/esm/enterprise/data-table/index.d.ts

@@ -1,13 +1,53 @@
-import { type ColumnDef, type OnChangeFn, type RowData, type RowSelectionState, type SortingState } from '@tanstack/react-table';
+import { type ColumnDef, type OnChangeFn, type RowData, type RowSelectionState, type SortingState, type VisibilityState } from '@tanstack/react-table';
 import { type EmptyStateProps } from '../empty-state/index.js';
 /**
- * Per-column opt-in for ledger numeric alignment. Set `meta: { numeric: true }`
- * on a money/number `ColumnDef` and DataTable right-aligns both the header and
- * its body cells (mono tabular figures).
+ * Per-column channel into the cells DataTable renders on the consumer's behalf:
+ * how a column aligns, what classes it carries on head and body, and whether it
+ * renders its own `<td>` at all. The member names are frozen by plan
+ * 2026-09-21-console-simplification C9.
  */
 declare module '@tanstack/react-table' {
     interface ColumnMeta<TData extends RowData, TValue> {
+        /**
+         * Ledger numeric treatment: right-aligns the header and its body cells and
+         * gives the body mono tabular figures. `align` overrides the alignment half
+         * on its own — the figures stay mono.
+         */
         numeric?: boolean;
+        /**
+         * Column alignment, header and body. Beats `numeric`'s implicit right, so a
+         * money column can read left or centre without losing its figure treatment.
+         * With `renderOwnCell` it reaches the header only — the body cell is the
+         * consumer's, and so is aligning it.
+         */
+        align?: 'left' | 'right' | 'center';
+        /**
+         * Extra classes on this column's `<th>`, merged AFTER the table-level
+         * `headClassName` so one column can override what the table set for all.
+         */
+        headerClassName?: string;
+        /**
+         * Extra classes on this column's body `<td>`, merged after the numeric and
+         * density treatments. IGNORED when `renderOwnCell` is set: there is no cell
+         * of the table's left to carry them. Use `headerClassName` for the `<th>`,
+         * which the table still owns either way.
+         */
+        className?: string;
+        /**
+         * The column's `cell` renderer emits its own `<td>`; DataTable renders it
+         * bare rather than wrapping it. The HEADER is still the table's `<th>` —
+         * nothing about owning a body cell makes a column own its header, and a
+         * table whose head and body disagree on cell count is broken markup.
+         *
+         * So the split is by element, not by column: the head still takes `align`,
+         * `numeric`, `headerClassName` and the declared width, because the `<th>`
+         * is the table's to style; the BODY takes none of them, because the `<td>`
+         * is the consumer's. A money column declaring `align: 'right'` therefore
+         * gets a right-aligned header and must right-align its own cell to match —
+         * leave the cell's alignment out and the figures sit under a heading that
+         * points somewhere else.
+         */
+        renderOwnCell?: boolean;
     }
 }
 /**
@@ -71,6 +111,35 @@ type SortingProps = {
     /** Controlled sort updater (TanStack `OnChangeFn`). */
     onSortingChange: OnChangeFn<SortingState>;
 };
+/**
+ * Column visibility is controlled but, deliberately, NOT a required pair — a
+ * departure from the two unions above, and not drift. Those two are unions
+ * because each has an `enable*` flag whose "on" state is meaningless without
+ * the controlled pair. TanStack has no enable flag for visibility: the model is
+ * always running, and the only shipped consumer passes STATE WITH NO UPDATER,
+ * because a separate dropdown owns the state on the page. Requiring the pair
+ * would refuse that usage.
+ *
+ * What the union does forbid is the updater ALONE: TanStack reads an
+ * `on[State]Change` callback as a declaration of controlled state, so a
+ * callback with no `columnVisibility` freezes visibility at its initial value
+ * while the callback keeps firing. Prop names frozen by plan
+ * 2026-09-21-console-simplification C9.
+ *
+ * Omit both and the table keeps its own visibility state, exactly as before.
+ */
+type ColumnVisibilityProps = {
+    /** Controlled column-visibility state (TanStack `VisibilityState`). */
+    columnVisibility: VisibilityState;
+    /**
+     * Controlled updater (TanStack `OnChangeFn`). Optional: a consumer may
+     * drive the state from outside the table entirely.
+     */
+    onColumnVisibilityChange?: OnChangeFn<VisibilityState>;
+} | {
+    columnVisibility?: undefined;
+    onColumnVisibilityChange?: undefined;
+};
 type DataTableBaseProps<TData> = {
     columns: ColumnDef<TData, unknown>[];
     data: TData[];
@@ -117,7 +186,8 @@ type DataTableBaseProps<TData> = {
     /**
      * Extra classes merged onto every header cell, after the kit label voice —
      * so a caller can override the voice's size/tracking/color for one table
-     * without restating the cluster. Per-column alignment stays `meta.numeric`.
+     * without restating the cluster. Per column, `meta.headerClassName` merges
+     * after this one and `meta.align` / `meta.numeric` own the alignment.
      */
     headClassName?: string;
     /**
@@ -127,7 +197,7 @@ type DataTableBaseProps<TData> = {
      */
     footer?: React.ReactNode;
 };
-export type DataTableProps<TData> = DataTableBaseProps<TData> & RowSelectionProps<TData> & SortingProps;
-export declare function DataTable<TData>({ columns, data, loading, skeletonRows, loadingLabel, empty, getRowId, flush, density, enableRowSelection, rowSelection, onRowSelectionChange, getRowSelectionLabel, enableSorting, sorting, onSortingChange, onRowActivate, rowHref, className, headClassName, footer }: DataTableProps<TData>): import("react").JSX.Element;
+export type DataTableProps<TData> = DataTableBaseProps<TData> & RowSelectionProps<TData> & SortingProps & ColumnVisibilityProps;
+export declare function DataTable<TData>({ columns, data, loading, skeletonRows, loadingLabel, empty, getRowId, flush, density, enableRowSelection, rowSelection, onRowSelectionChange, getRowSelectionLabel, enableSorting, sorting, onSortingChange, columnVisibility, onColumnVisibilityChange, onRowActivate, rowHref, className, headClassName, footer }: DataTableProps<TData>): import("react").JSX.Element;
 export {};
 //# sourceMappingURL=index.d.ts.map

package/dist/esm/enterprise/data-table/index.d.ts.map

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

package/dist/esm/enterprise/data-table/index.js

@@ -52,7 +52,7 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
  * activation. Keydown events originating from interactive children (links,
  * buttons, checkboxes, form fields) are never hijacked.
  */
-import { useEffect, useMemo, useRef, useState } from 'react';
+import { Fragment, useEffect, useMemo, useRef, useState } from 'react';
 import { flexRender, getCoreRowModel, useReactTable } from '@tanstack/react-table';
 import { Table, TableBody, TableCell, TableFooter, TableHead, TableHeader, TableRow } from '../../components/ui/table/index.js';
 import { Skeleton } from '../../components/ui/skeleton/index.js';
@@ -62,8 +62,21 @@ import { EmptyState } from '../empty-state/index.js';
 import { readPreferredColumnSize, UNSIZED_DEFAULT_COLUMN } from './column-size.js';
 const SELECTION_COLUMN_ID = '__select__';
 const CHECKBOX_CLASS = 'accent-primary block size-4';
-/** Right-aligned mono treatment for `meta: { numeric: true }` columns. */
-const NUMERIC_CELL_CLASS = 'text-right font-mono tabular-nums';
+/** Figure treatment for `meta: { numeric: true }` columns; the alignment half
+ * lives in ALIGN_CELL_CLASS so `meta.align` can override one without the other. */
+const NUMERIC_FIGURE_CLASS = 'font-mono tabular-nums';
+/**
+ * Body-cell alignment, one class per direction rather than a single string with
+ * `text-right` baked in: an explicit `meta.align` has to beat `numeric` by
+ * choosing the class, not by out-ordering it — tailwind-merge resolving two
+ * conflicting alignment utilities by source order is not a contract worth
+ * relying on.
+ */
+const ALIGN_CELL_CLASS = {
+    left: 'text-left',
+    center: 'text-center',
+    right: 'text-right'
+};
 /**
  * Keydown events whose target sits inside one of these are never hijacked
  * by the row-level keyboard handler — Space in a checkbox and Enter on an
@@ -113,7 +126,7 @@ function createSelectionColumn(getLabel) {
         cell: ({ row }) => _jsx(RowSelectionCheckbox, { row: row, getLabel: getLabel })
     };
 }
-export function DataTable({ columns, data, loading = false, skeletonRows = 8, loadingLabel = 'Loading table rows', empty, getRowId, flush = false, density = 'comfortable', enableRowSelection = false, rowSelection, onRowSelectionChange, getRowSelectionLabel, enableSorting = false, sorting, onSortingChange, onRowActivate, rowHref, className, headClassName, footer }) {
+export function DataTable({ columns, data, loading = false, skeletonRows = 8, loadingLabel = 'Loading table rows', empty, getRowId, flush = false, density = 'comfortable', enableRowSelection = false, rowSelection, onRowSelectionChange, getRowSelectionLabel, enableSorting = false, sorting, onSortingChange, columnVisibility, onColumnVisibilityChange, onRowActivate, rowHref, className, headClassName, footer }) {
     const tableColumns = useMemo(() => enableRowSelection
         ? [createSelectionColumn(getRowSelectionLabel), ...columns]
         : columns, [columns, enableRowSelection, getRowSelectionLabel]);
@@ -139,12 +152,33 @@ export function DataTable({ columns, data, loading = false, skeletonRows = 8, lo
         manualSorting: true,
         enableSorting,
         onSortingChange: enableSorting ? onSortingChange : undefined,
+        // ⛔ EACH VISIBILITY ENTRY IS GUARDED ON ITS OWN PROP, NEVER ON THE OTHER.
+        //
+        // TanStack merges options as `{...defaultOptions, ...options}` and state as
+        // `{...internalState, ...options.state}`, both plain spreads — so a key
+        // present and holding `undefined` OVERWRITES what it was meant to leave
+        // alone. `onColumnVisibilityChange: undefined` replaces the feature's own
+        // `makeStateUpdater`, and `setColumnVisibility` reads
+        // `options.onColumnVisibilityChange == null ? void 0 : ...`, so it (and
+        // every `column.toggleVisibility` behind it) becomes a silent no-op.
+        // `columnVisibility: undefined` replaces the table's initial `{}`, so a
+        // consumer reading the slice gets `undefined` instead of an empty object.
+        //
+        // Guarding the UPDATER on the STATE put that `undefined` back for the
+        // union's first arm — state with no updater, which is the shipped console
+        // usage, where a separate dropdown owns the state. A table that passes
+        // neither prop is uncontrolled, exactly as before.
+        ...(onColumnVisibilityChange !== undefined && { onColumnVisibilityChange }),
         state: {
             rowSelection: enableRowSelection ? (rowSelection ?? {}) : undefined,
-            sorting: enableSorting ? (sorting ?? []) : undefined
+            sorting: enableSorting ? (sorting ?? []) : undefined,
+            ...(columnVisibility !== undefined && { columnVisibility })
         }
     });
-    const colCount = tableColumns.length;
+    // Visible, not declared: the skeleton grid and the empty row's colSpan have
+    // to match the header the table actually rendered, and a hidden column is in
+    // `tableColumns` but in no `<th>`.
+    const colCount = table.getVisibleLeafColumns().length;
     const dataRows = table.getRowModel().rows;
     const rowCount = dataRows.length;
     // Compact density overrides only THIS table's cell padding (tailwind-merge
@@ -262,13 +296,13 @@ export function DataTable({ columns, data, loading = false, skeletonRows = 8, lo
                     : rowCount === 0
                         ? 'No rows'
                         : `${rowCount} rows` }), _jsxs(Table, { "aria-busy": loading ? 'true' : undefined, children: [_jsx(TableHeader, { children: table.getHeaderGroups().map((headerGroup) => (_jsx(TableRow, { className: "hover:bg-transparent", children: headerGroup.headers.map((header) => {
-                                const numeric = header.column.columnDef.meta?.numeric;
-                                return (_jsx(TableHead, { align: numeric ? 'right' : undefined, "aria-sort": header.isPlaceholder
+                                const meta = header.column.columnDef.meta;
+                                return (_jsx(TableHead, { align: meta?.align ?? (meta?.numeric ? 'right' : undefined), "aria-sort": header.isPlaceholder
                                         ? undefined
                                         : ariaSortFor(header.column), 
                                     // Only a column that DECLARED sizing gets an inline width;
                                     // everything else keeps the auto table layout it has today.
-                                    style: readPreferredColumnSize(header.column), className: cn(LABEL_VOICE_CLASS, headDensityClass, header.column.id === SELECTION_COLUMN_ID && 'w-10', headClassName), children: header.isPlaceholder
+                                    style: readPreferredColumnSize(header.column), className: cn(LABEL_VOICE_CLASS, headDensityClass, header.column.id === SELECTION_COLUMN_ID && 'w-10', headClassName, meta?.headerClassName), children: header.isPlaceholder
                                         ? null
                                         : flexRender(header.column.columnDef.header, header.getContext()) }, header.id));
                             }) }, headerGroup.id))) }), _jsx(TableBody, { children: loading ? (Array.from({ length: skeletonRows }).map((_, rowIndex) => (_jsx(TableRow, { className: "hover:bg-transparent", children: Array.from({ length: colCount }).map((__, cellIndex) => (_jsx(TableCell, { className: cellDensityClass, children: _jsx(Skeleton, { className: "h-4 w-full max-w-[160px]" }) }, `skeleton-${rowIndex}-${cellIndex}`))) }, `skeleton-${rowIndex}`)))) : rowCount === 0 ? (_jsx(TableRow, { className: "hover:bg-transparent", children: _jsx(TableCell, { colSpan: colCount, className: "p-0", children: _jsx(EmptyState, { title: empty?.title ?? 'Nothing here yet', description: empty?.description, icon: empty?.icon, action: empty?.action, 
@@ -291,7 +325,18 @@ export function DataTable({ columns, data, loading = false, skeletonRows = 8, lo
                                 ? (event) => handleRowKeyDown(event, row, rowIndex)
                                 : undefined, className: keyboardNav ? ROW_FOCUS_CLASS : undefined, "data-state": enableRowSelection && row.getIsSelected()
                                 ? 'selected'
-                                : undefined, children: row.getVisibleCells().map((cell) => (_jsx(TableCell, { style: readPreferredColumnSize(cell.column), className: cn(cell.column.columnDef.meta?.numeric && NUMERIC_CELL_CLASS, cellDensityClass, cell.column.id === SELECTION_COLUMN_ID && 'w-10'), onClick: cell.column.id === SELECTION_COLUMN_ID
-                                    ? stopPropagation
-                                    : undefined, children: flexRender(cell.column.columnDef.cell, cell.getContext()) }, cell.id))) }, row.id)))) }), footer ? _jsx(TableFooter, { children: footer }) : null] })] }));
+                                : undefined, children: row.getVisibleCells().map((cell) => {
+                                const meta = cell.column.columnDef.meta;
+                                const content = flexRender(cell.column.columnDef.cell, cell.getContext());
+                                // The column owns its `<td>`: render the consumer's cell bare.
+                                // The kit's selection column is built here and carries no
+                                // meta, so it can never take this path.
+                                if (meta?.renderOwnCell) {
+                                    return _jsx(Fragment, { children: content }, cell.id);
+                                }
+                                const align = meta?.align ?? (meta?.numeric ? 'right' : undefined);
+                                return (_jsx(TableCell, { style: readPreferredColumnSize(cell.column), className: cn(meta?.numeric && NUMERIC_FIGURE_CLASS, align && ALIGN_CELL_CLASS[align], cellDensityClass, cell.column.id === SELECTION_COLUMN_ID && 'w-10', meta?.className), onClick: cell.column.id === SELECTION_COLUMN_ID
+                                        ? stopPropagation
+                                        : undefined, children: content }, cell.id));
+                            }) }, row.id)))) }), footer ? _jsx(TableFooter, { children: footer }) : null] })] }));
 }

package/dist/esm/index.d.ts

@@ -1,5 +1,6 @@
 export * from './components/ui/alert/index.js';
 export * from './components/ui/autocomplete/index.js';
+export * from './hooks/use-click-away.js';
 export * from './components/ui/autosize-textarea/index.js';
 export * from './components/ui/avatar/index.js';
 export * from './components/ui/badge/index.js';
@@ -39,6 +40,7 @@ export * from './components/ui/toast/index.js';
 export * from './components/ui/toast/toaster.js';
 export * from './hooks/use-toast.js';
 export * from './components/ui/time-picker/index.js';
+export * from './hooks/use-time.js';
 export * from './components/ui/tooltip/index.js';
 export * from './components/ui/form.js';
 export { Breadcrumb as ApplicationBreadcrumb } from './components/breadcrumb/index.js';

package/dist/esm/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/index.tsx"],"names":[],"mappings":"AAGA,cAAc,uBAAuB,CAAA;AACrC,cAAc,8BAA8B,CAAA;AAC5C,cAAc,mCAAmC,CAAA;AACjD,cAAc,wBAAwB,CAAA;AACtC,cAAc,uBAAuB,CAAA;AACrC,cAAc,4BAA4B,CAAA;AAC1C,cAAc,wBAAwB,CAAA;AACtC,cAAc,6BAA6B,CAAA;AAC3C,cAAc,0BAA0B,CAAA;AACxC,cAAc,sBAAsB,CAAA;AACpC,cAAc,0BAA0B,CAAA;AACxC,cAAc,6BAA6B,CAAA;AAC3C,cAAc,yBAAyB,CAAA;AACvC,cAAc,4BAA4B,CAAA;AAC1C,cAAc,wBAAwB,CAAA;AACtC,cAAc,+BAA+B,CAAA;AAC7C,cAAc,uBAAuB,CAAA;AACrC,cAAc,2BAA2B,CAAA;AACzC,cAAc,uBAAuB,CAAA;AACrC,cAAc,gCAAgC,CAAA;AAC9C,cAAc,iCAAiC,CAAA;AAC/C,cAAc,uBAAuB,CAAA;AACrC,cAAc,mCAAmC,CAAA;AACjD,cAAc,yBAAyB,CAAA;AACvC,cAAc,0BAA0B,CAAA;AACxC,cAAc,yBAAyB,CAAA;AACvC,cAAc,wBAAwB,CAAA;AACtC,cAAc,2BAA2B,CAAA;AACzC,cAAc,uBAAuB,CAAA;AACrC,cAAc,yBAAyB,CAAA;AACvC,cAAc,0BAA0B,CAAA;AACxC,cAAc,yBAAyB,CAAA;AACvC,cAAc,qBAAqB,CAAA;AACnC,cAAc,wBAAwB,CAAA;AACtC,cAAc,uBAAuB,CAAA;AACrC,cAAc,sBAAsB,CAAA;AACpC,cAAc,0BAA0B,CAAA;AACxC,cAAc,uBAAuB,CAAA;AACrC,cAAc,+BAA+B,CAAA;AAC7C,cAAc,mBAAmB,CAAA;AACjC,cAAc,6BAA6B,CAAA;AAC3C,cAAc,yBAAyB,CAAA;AACvC,cAAc,sBAAsB,CAAA;AAGpC,OAAO,EAAE,UAAU,IAAI,qBAAqB,EAAE,MAAM,yBAAyB,CAAA;AAC7E,cAAc,8CAA8C,CAAA;AAC5D,cAAc,mBAAmB,CAAA;AACjC,cAAc,qBAAqB,CAAA;AACnC,cAAc,yBAAyB,CAAA;AACvC,cAAc,gCAAgC,CAAA;AAC9C,cAAc,mBAAmB,CAAA;AACjC,cAAc,mBAAmB,CAAA;AACjC,cAAc,0BAA0B,CAAA;AACxC,cAAc,yBAAyB,CAAA;AACvC,cAAc,oBAAoB,CAAA;AAGlC,cAAc,cAAc,CAAA;AAC5B,cAAc,SAAS,CAAA;AACvB,cAAc,SAAS,CAAA;AACvB,cAAc,UAAU,CAAA;AACxB,cAAc,UAAU,CAAA;AAGxB,cAAc,2BAA2B,CAAA;AACzC,cAAc,8BAA8B,CAAA;AAC5C,cAAc,6BAA6B,CAAA;AAC3C,cAAc,4BAA4B,CAAA;AAC1C,cAAc,6BAA6B,CAAA;AAC3C,cAAc,6BAA6B,CAAA;AAC3C,cAAc,8BAA8B,CAAA;AAG5C,OAAO,EAAE,EAAE,EAAE,MAAM,aAAa,CAAA;AAChC,cAAc,kBAAkB,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/index.tsx"],"names":[],"mappings":"AAGA,cAAc,uBAAuB,CAAA;AACrC,cAAc,8BAA8B,CAAA;AAC5C,cAAc,wBAAwB,CAAA;AACtC,cAAc,mCAAmC,CAAA;AACjD,cAAc,wBAAwB,CAAA;AACtC,cAAc,uBAAuB,CAAA;AACrC,cAAc,4BAA4B,CAAA;AAC1C,cAAc,wBAAwB,CAAA;AACtC,cAAc,6BAA6B,CAAA;AAC3C,cAAc,0BAA0B,CAAA;AACxC,cAAc,sBAAsB,CAAA;AACpC,cAAc,0BAA0B,CAAA;AACxC,cAAc,6BAA6B,CAAA;AAC3C,cAAc,yBAAyB,CAAA;AACvC,cAAc,4BAA4B,CAAA;AAC1C,cAAc,wBAAwB,CAAA;AACtC,cAAc,+BAA+B,CAAA;AAC7C,cAAc,uBAAuB,CAAA;AACrC,cAAc,2BAA2B,CAAA;AACzC,cAAc,uBAAuB,CAAA;AACrC,cAAc,gCAAgC,CAAA;AAC9C,cAAc,iCAAiC,CAAA;AAC/C,cAAc,uBAAuB,CAAA;AACrC,cAAc,mCAAmC,CAAA;AACjD,cAAc,yBAAyB,CAAA;AACvC,cAAc,0BAA0B,CAAA;AACxC,cAAc,yBAAyB,CAAA;AACvC,cAAc,wBAAwB,CAAA;AACtC,cAAc,2BAA2B,CAAA;AACzC,cAAc,uBAAuB,CAAA;AACrC,cAAc,yBAAyB,CAAA;AACvC,cAAc,0BAA0B,CAAA;AACxC,cAAc,yBAAyB,CAAA;AACvC,cAAc,qBAAqB,CAAA;AACnC,cAAc,wBAAwB,CAAA;AACtC,cAAc,uBAAuB,CAAA;AACrC,cAAc,sBAAsB,CAAA;AACpC,cAAc,0BAA0B,CAAA;AACxC,cAAc,uBAAuB,CAAA;AACrC,cAAc,+BAA+B,CAAA;AAC7C,cAAc,mBAAmB,CAAA;AACjC,cAAc,6BAA6B,CAAA;AAC3C,cAAc,kBAAkB,CAAA;AAChC,cAAc,yBAAyB,CAAA;AACvC,cAAc,sBAAsB,CAAA;AAGpC,OAAO,EAAE,UAAU,IAAI,qBAAqB,EAAE,MAAM,yBAAyB,CAAA;AAC7E,cAAc,8CAA8C,CAAA;AAC5D,cAAc,mBAAmB,CAAA;AACjC,cAAc,qBAAqB,CAAA;AACnC,cAAc,yBAAyB,CAAA;AACvC,cAAc,gCAAgC,CAAA;AAC9C,cAAc,mBAAmB,CAAA;AACjC,cAAc,mBAAmB,CAAA;AACjC,cAAc,0BAA0B,CAAA;AACxC,cAAc,yBAAyB,CAAA;AACvC,cAAc,oBAAoB,CAAA;AAGlC,cAAc,cAAc,CAAA;AAC5B,cAAc,SAAS,CAAA;AACvB,cAAc,SAAS,CAAA;AACvB,cAAc,UAAU,CAAA;AACxB,cAAc,UAAU,CAAA;AAGxB,cAAc,2BAA2B,CAAA;AACzC,cAAc,8BAA8B,CAAA;AAC5C,cAAc,6BAA6B,CAAA;AAC3C,cAAc,4BAA4B,CAAA;AAC1C,cAAc,6BAA6B,CAAA;AAC3C,cAAc,6BAA6B,CAAA;AAC3C,cAAc,8BAA8B,CAAA;AAG5C,OAAO,EAAE,EAAE,EAAE,MAAM,aAAa,CAAA;AAChC,cAAc,kBAAkB,CAAA"}

package/dist/esm/index.js

@@ -2,6 +2,7 @@
 // Primitives
 export * from './components/ui/alert/index.js';
 export * from './components/ui/autocomplete/index.js';
+export * from './hooks/use-click-away.js';
 export * from './components/ui/autosize-textarea/index.js';
 export * from './components/ui/avatar/index.js';
 export * from './components/ui/badge/index.js';
@@ -41,6 +42,7 @@ export * from './components/ui/toast/index.js';
 export * from './components/ui/toast/toaster.js';
 export * from './hooks/use-toast.js';
 export * from './components/ui/time-picker/index.js';
+export * from './hooks/use-time.js';
 export * from './components/ui/tooltip/index.js';
 export * from './components/ui/form.js';
 // Components

package/dist/index.d.ts

@@ -1,5 +1,6 @@
 export * from './components/ui/alert';
 export * from './components/ui/autocomplete';
+export * from './hooks/use-click-away';
 export * from './components/ui/autosize-textarea';
 export * from './components/ui/avatar';
 export * from './components/ui/badge';
@@ -39,6 +40,7 @@ export * from './components/ui/toast';
 export * from './components/ui/toast/toaster';
 export * from './hooks/use-toast';
 export * from './components/ui/time-picker';
+export * from './hooks/use-time';
 export * from './components/ui/tooltip';
 export * from './components/ui/form';
 export { Breadcrumb as ApplicationBreadcrumb } from './components/breadcrumb';