@nxgt/material 2.7.1 → 2.8.0

package/dist/{infoDiagram-VRGFBTTK-Cboh-B9n.js → infoDiagram-VRGFBTTK-CtVsLyCQ.js}

@@ -1,8 +1,8 @@
-import { n as e } from "./src-C9kQSo6K.js";
+import { n as e } from "./src-CsLQInsN.js";
 import { n as t } from "./mermaid-parser.core-BXD_TD1T.js";
 import { n } from "./chunk-Y2CYZVJY-BAad7w_K.js";
-import { c as r } from "./chunk-O7XYJQB3-A66QSOPA.js";
-import { t as i } from "./chunk-6AEJRKK7-3YWRP4aV.js";
+import { c as r } from "./chunk-O7XYJQB3-BChweQ_V.js";
+import { t as i } from "./chunk-6AEJRKK7-BLBlw8ui.js";
 //#region ../../node_modules/mermaid/dist/chunks/mermaid.core/infoDiagram-VRGFBTTK.mjs
 var a = { parse: /* @__PURE__ */ n(async (n) => {
 	let r = await t("info", n);

package/dist/{isArrayLikeObject-CO5xeuaJ.js → isArrayLikeObject-BSfDsA7T.js}

@@ -1,6 +1,6 @@
-import { x as e } from "./translator-CwpmpI24.js";
-import { i as t, o as n, t as r } from "./_overRest-DvC5rm5s.js";
-import { d as i } from "./_Uint8Array-JRUmWcRr.js";
+import { x as e } from "./translator-B85Q_O55.js";
+import { i as t, o as n, t as r } from "./_overRest-BQ8agsDH.js";
+import { d as i } from "./_Uint8Array-CALbCR7W.js";
 //#region ../../node_modules/lodash-es/_baseRest.js
 function a(e, i) {
 	return t(r(e, i, n), e + "");

package/dist/{isEmpty-DOC38Ces.js → isEmpty-BEe-nNXw.js}

@@ -1,6 +1,6 @@
-import { C as e, o as t, s as n, v as r } from "./translator-CwpmpI24.js";
-import { S as i, j as a, k as o } from "./async-slice-OftEOtMA.js";
-import { a as s, c, d as l, f as u, l as d, p as f, u as p } from "./_Uint8Array-JRUmWcRr.js";
+import { C as e, o as t, s as n, v as r } from "./translator-B85Q_O55.js";
+import { S as i, j as a, k as o } from "./async-slice-BHMdvnqm.js";
+import { a as s, c, d as l, f as u, l as d, p as f, u as p } from "./_Uint8Array-CALbCR7W.js";
 //#region ../../node_modules/lodash-es/_isFlattenable.js
 var m = e ? e.isConcatSpreadable : void 0;
 function h(e) {

package/dist/{ishikawaDiagram-OU5B5YK6-DwTd1YxL.js → ishikawaDiagram-OU5B5YK6-D1n8vp8C.js}

@@ -1,8 +1,8 @@
-import "./src-C9kQSo6K.js";
-import { p as e } from "./chunk-ZIGJFQKS-C3xUAXJq.js";
+import "./src-CsLQInsN.js";
+import { p as e } from "./chunk-ZIGJFQKS-9VXArDKF.js";
 import { n as t } from "./chunk-Y2CYZVJY-BAad7w_K.js";
-import { H as n, U as r, a as i, c as a, q as o, s, v as c, w as l, x as u, y as d } from "./chunk-O7XYJQB3-A66QSOPA.js";
-import { t as f } from "./chunk-6AEJRKK7-3YWRP4aV.js";
+import { H as n, U as r, a as i, c as a, q as o, s, v as c, w as l, x as u, y as d } from "./chunk-O7XYJQB3-BChweQ_V.js";
+import { t as f } from "./chunk-6AEJRKK7-BLBlw8ui.js";
 import { t as p } from "./rough.esm-Cvc79rxE.js";
 //#region ../../node_modules/mermaid/dist/chunks/mermaid.core/ishikawaDiagram-OU5B5YK6.mjs
 var m = (function() {

package/dist/{journeyDiagram-ZHPQQLJL-Dxvl3oeN.js → journeyDiagram-ZHPQQLJL-CTGnr-JY.js}

@@ -1,9 +1,9 @@
-import { ct as e } from "./components-DrStgM4J.js";
-import { t } from "./src-C9kQSo6K.js";
+import { ct as e } from "./components-Bg1bqGbc.js";
+import { t } from "./src-CsLQInsN.js";
 import { n } from "./chunk-Y2CYZVJY-BAad7w_K.js";
-import { H as r, U as i, a, c as o, q as s, v as c, w as l, x as u, y as d } from "./chunk-O7XYJQB3-A66QSOPA.js";
+import { H as r, U as i, a, c as o, q as s, v as c, w as l, x as u, y as d } from "./chunk-O7XYJQB3-BChweQ_V.js";
 import { t as f } from "./chunk-5VM5RSS4-BFskf6Qk.js";
-import { a as p, n as m, o as h, s as g } from "./chunk-GWA4HPMP-Co-A6dtV.js";
+import { a as p, n as m, o as h, s as g } from "./chunk-GWA4HPMP-B8jXI0Tl.js";
 //#region ../../node_modules/mermaid/dist/chunks/mermaid.core/journeyDiagram-ZHPQQLJL.mjs
 var _ = (function() {
 	var e = /* @__PURE__ */ n(function(e, t, n, r) {

package/dist/{kanban-definition-PNTS6WVX-S8plI4wn.js → kanban-definition-PNTS6WVX-D1-Owjil.js}

@@ -1,15 +1,15 @@
-import { n as e } from "./src-C9kQSo6K.js";
-import "./chunk-ZIGJFQKS-C3xUAXJq.js";
+import { n as e } from "./src-CsLQInsN.js";
+import "./chunk-ZIGJFQKS-9VXArDKF.js";
 import { n as t } from "./chunk-Y2CYZVJY-BAad7w_K.js";
-import { Y as n, f as r, it as i, nt as a, tt as o, x as s, z as c } from "./chunk-O7XYJQB3-A66QSOPA.js";
-import { t as l } from "./chunk-6AEJRKK7-3YWRP4aV.js";
-import "./chunk-742MDFTN-Cs1qGiTK.js";
-import "./chunk-MBY4JIJT-C3RQP_Nk.js";
+import { Y as n, f as r, it as i, nt as a, tt as o, x as s, z as c } from "./chunk-O7XYJQB3-BChweQ_V.js";
+import { t as l } from "./chunk-6AEJRKK7-BLBlw8ui.js";
+import "./chunk-742MDFTN-CsUjFyzK.js";
+import "./chunk-MBY4JIJT-BFIqOe-8.js";
 import { t as u } from "./chunk-5VM5RSS4-BFskf6Qk.js";
-import "./chunk-7PRAP22T-_Av9vcXz.js";
-import "./chunk-7INBJB4K-BY5n77ka.js";
-import { i as d, r as f } from "./chunk-5DYCD2WN-Cja1INgd.js";
-import { r as p } from "./chunk-UA2S7LBM-BNeHeMx9.js";
+import "./chunk-7PRAP22T-0C6_H8Li.js";
+import "./chunk-7INBJB4K-k-I67NSP.js";
+import { i as d, r as f } from "./chunk-5DYCD2WN-Cd1zazNp.js";
+import { r as p } from "./chunk-UA2S7LBM-ChuksCDg.js";
 import { n as m, t as h } from "./chunk-LNGE3PJU-DJjGTS7O.js";
 //#region ../../node_modules/mermaid/dist/chunks/mermaid.core/kanban-definition-PNTS6WVX.mjs
 var g = (function() {

package/dist/lib/components/ui/actions/button/busy-click-capture.d.ts

@@ -0,0 +1,11 @@
+import { MouseEvent } from 'react';
+import { useClickLock } from './use-click-lock';
+/**
+ * A busy button cancels the click, which is also what Enter in a field of
+ * its form sends a submit button, in the capture phase: before the
+ * caller's `onClick` — an `asChild` child's own handler included, which a
+ * Slot runs before the slot's — and before any ancestor's. Read the lock
+ * now: the second click of a double click comes before the re-render that
+ * shows it.
+ */
+export declare function busyClickCapture(busy: boolean, clickLock: ReturnType<typeof useClickLock>, onClickCapture?: (event: MouseEvent<HTMLButtonElement>) => void): (event: MouseEvent<HTMLButtonElement>) => void;

package/dist/lib/components/ui/actions/button/button-tones.d.ts

@@ -0,0 +1,36 @@
+/**
+ * The text colour of the `tonal`, `outlined` and `link` variants of `Button`
+ * and `IconButton`, per `color`: the token itself where it reads at 4.5:1 on
+ * the page, on `--card` and on its own 15 % tint, else mixed toward black in
+ * the light theme and toward white in the dark one (WCAG 1.4.3). The class
+ * names are written out whole so Tailwind finds them.
+ */
+export declare const toneText: {
+    readonly primary: "text-primary dark:text-[color-mix(in_oklab,var(--color-primary)_40%,white)]";
+    readonly secondary: "text-secondary";
+    readonly success: "text-success dark:text-[color-mix(in_oklab,var(--color-success)_85%,white)]";
+    readonly info: "text-info";
+    readonly warning: "text-[color-mix(in_oklab,var(--color-warning)_85%,black)] dark:text-[color-mix(in_oklab,var(--color-warning)_85%,white)]";
+    readonly error: "text-[color-mix(in_oklab,var(--color-error)_85%,black)] dark:text-[color-mix(in_oklab,var(--color-error)_70%,white)]";
+    readonly default: "text-foreground";
+};
+/** The same tones for an icon marked `data-slot="icon"`. */
+export declare const toneIcon: {
+    readonly primary: "[&_svg]:data-[slot=icon]:text-primary dark:[&_svg]:data-[slot=icon]:text-[color-mix(in_oklab,var(--color-primary)_40%,white)]";
+    readonly secondary: "[&_svg]:data-[slot=icon]:text-secondary";
+    readonly success: "[&_svg]:data-[slot=icon]:text-success dark:[&_svg]:data-[slot=icon]:text-[color-mix(in_oklab,var(--color-success)_85%,white)]";
+    readonly info: "[&_svg]:data-[slot=icon]:text-info";
+    readonly warning: "[&_svg]:data-[slot=icon]:text-[color-mix(in_oklab,var(--color-warning)_85%,black)] dark:[&_svg]:data-[slot=icon]:text-[color-mix(in_oklab,var(--color-warning)_85%,white)]";
+    readonly error: "[&_svg]:data-[slot=icon]:text-[color-mix(in_oklab,var(--color-error)_85%,black)] dark:[&_svg]:data-[slot=icon]:text-[color-mix(in_oklab,var(--color-error)_70%,white)]";
+    readonly default: "[&_svg]:data-[slot=icon]:text-foreground";
+};
+/** The same tones for `IconButton`'s icon line (`stroke`). */
+export declare const toneStroke: {
+    readonly primary: "[&_svg]:stroke-primary dark:[&_svg]:stroke-[color-mix(in_oklab,var(--color-primary)_40%,white)]";
+    readonly secondary: "[&_svg]:stroke-secondary";
+    readonly success: "[&_svg]:stroke-success dark:[&_svg]:stroke-[color-mix(in_oklab,var(--color-success)_85%,white)]";
+    readonly info: "[&_svg]:stroke-info";
+    readonly warning: "[&_svg]:stroke-[color-mix(in_oklab,var(--color-warning)_85%,black)] dark:[&_svg]:stroke-[color-mix(in_oklab,var(--color-warning)_85%,white)]";
+    readonly error: "[&_svg]:stroke-[color-mix(in_oklab,var(--color-error)_85%,black)] dark:[&_svg]:stroke-[color-mix(in_oklab,var(--color-error)_70%,white)]";
+    readonly default: "[&_svg]:stroke-foreground";
+};

package/dist/lib/components/ui/actions/button/button.d.ts

@@ -3,8 +3,27 @@ import { SpinnerProps } from '../../feedback/spinner/spinner';
 import { ButtonVariants, buttonVariants } from './button.variants';
 export type ButtonProps = ComponentProps<'button'> & ButtonVariants & {
     asChild?: boolean;
+    /**
+     * Busy: `aria-busy` and `aria-disabled`, a spinner, and every click
+     * blocked — so a submit button does not submit, by a click or by Enter
+     * in a field. It stays focusable (no native `disabled`), so focus is
+     * not lost while the work runs. Pass `formState.isSubmitting`.
+     */
     loading?: boolean;
+    /**
+     * A click locks the button at once, before `loading` has rendered,
+     * until `loading` has turned true and back (or for a second when it
+     * does not turn true): for a `loading` that turns true only after an
+     * `await`, such as a mutation's pending state.
+     */
+    lockOnClick?: boolean;
     spinnerVariant?: SpinnerProps['variant'];
+    /**
+     * The label breaks onto several lines instead of being cut with an
+     * ellipsis at its container's width: the button grows taller, never
+     * shorter than its `size`. Without it a long label is truncated.
+     */
+    wrap?: boolean;
 } & {
     tooltip?: string;
 };

package/dist/lib/components/ui/actions/button/button.wrap.d.ts

@@ -0,0 +1,8 @@
+import { ButtonVariants } from './button.variants';
+/**
+ * The classes of `wrap`: the label breaks onto as many lines as it needs,
+ * centred, instead of being cut with an ellipsis; the button grows taller,
+ * never shorter than its `size`, and keeps its vertical padding. An `icon*`
+ * size is square and ignores it.
+ */
+export declare function buttonWrapClasses(wrap: boolean | undefined, size: ButtonVariants['size']): string | false;

package/dist/lib/components/ui/actions/button/label-text.d.ts

@@ -0,0 +1,10 @@
+import { ReactNode } from 'react';
+/**
+ * Puts each run of bare text (strings, numbers) among a button's children (in a fragment too) in one
+ * `<span data-slot="button-label">`, so `Delete {name}?` is one piece and not
+ * three separated by the button's gap. A text node is an anonymous flex item,
+ * which neither shrinks below its text nor shows an ellipsis; a span with
+ * `truncate` does both, so a long label is cut with "…" inside its
+ * container instead of sticking out of it. Elements are left as they are.
+ */
+export declare function wrapLabelText(children: ReactNode): ReactNode;

package/dist/lib/components/ui/actions/button/use-click-lock.d.ts

@@ -0,0 +1,18 @@
+/** How long a click locks the button when `loading` never turns true. */
+export declare const CLICK_LOCK_FALLBACK_MS = 1000;
+/**
+ * `lockOnClick`: a click locks the button, synchronously, so a second click
+ * (or Enter) before the caller's `loading` has rendered does nothing. The
+ * lock lasts until `loading` has turned true and back to false — the work the
+ * click started is over — or, when `loading` does not turn true within
+ * `CLICK_LOCK_FALLBACK_MS`, until then.
+ *
+ * `isLocked()` reads the lock as it is now (a ref: the second click of a
+ * double click comes before any re-render); `locked` is the same for the
+ * render, so the button shows it.
+ */
+export declare function useClickLock(enabled: boolean | undefined, loading: boolean): {
+    locked: boolean;
+    lock: () => void;
+    isLocked: () => boolean;
+};

package/dist/lib/components/ui/actions/copy-button/copy-button.d.ts

@@ -2,8 +2,12 @@ import { ReactNode } from 'react';
 import { IconButtonProps } from '../icon-button/icon-button';
 export type CopyButtonProps = Omit<IconButtonProps, 'onClick' | 'children' | 'tooltip' | 'value'> & {
     value: string | (() => string);
+    /** The button's accessible name; it never changes after a click. */
     label?: string;
+    /** Announced (not a new name) once the text is on the clipboard. */
     copiedLabel?: string;
+    /** Announced when the clipboard refused the text. */
+    failedLabel?: string;
     icon?: ReactNode;
 };
-export declare function CopyButton({ value, label, copiedLabel, icon, variant, color, ...props }: CopyButtonProps): import("react").JSX.Element;
+export declare function CopyButton({ value, label, copiedLabel, failedLabel, icon, variant, color, ...props }: CopyButtonProps): import("react").JSX.Element;

package/dist/lib/components/ui/actions/icon-button/icon-button.compound-variants.d.ts

@@ -0,0 +1,114 @@
+/** The colour of each variant: one entry per `variant` × `color`. */
+export declare const iconButtonCompoundVariants: ({
+    variant: "filled";
+    color: "primary";
+    class: string;
+} | {
+    variant: "filled";
+    color: "secondary";
+    class: string;
+} | {
+    variant: "filled";
+    color: "success";
+    class: string;
+} | {
+    variant: "filled";
+    color: "info";
+    class: string;
+} | {
+    variant: "filled";
+    color: "warning";
+    class: string;
+} | {
+    variant: "filled";
+    color: "error";
+    class: string;
+} | {
+    variant: "filled";
+    color: "default";
+    class: string;
+} | {
+    variant: "tonal";
+    color: "primary";
+    class: string;
+} | {
+    variant: "tonal";
+    color: "secondary";
+    class: string;
+} | {
+    variant: "tonal";
+    color: "success";
+    class: string;
+} | {
+    variant: "tonal";
+    color: "info";
+    class: string;
+} | {
+    variant: "tonal";
+    color: "warning";
+    class: string;
+} | {
+    variant: "tonal";
+    color: "error";
+    class: string;
+} | {
+    variant: "tonal";
+    color: "default";
+    class: string;
+} | {
+    variant: "outlined";
+    color: "primary";
+    class: string;
+} | {
+    variant: "outlined";
+    color: "secondary";
+    class: string;
+} | {
+    variant: "outlined";
+    color: "success";
+    class: string;
+} | {
+    variant: "outlined";
+    color: "info";
+    class: string;
+} | {
+    variant: "outlined";
+    color: "warning";
+    class: string;
+} | {
+    variant: "outlined";
+    color: "error";
+    class: string;
+} | {
+    variant: "outlined";
+    color: "default";
+    class: string;
+} | {
+    variant: "link";
+    color: "primary";
+    class: string;
+} | {
+    variant: "link";
+    color: "secondary";
+    class: string;
+} | {
+    variant: "link";
+    color: "success";
+    class: string;
+} | {
+    variant: "link";
+    color: "info";
+    class: string;
+} | {
+    variant: "link";
+    color: "warning";
+    class: string;
+} | {
+    variant: "link";
+    color: "error";
+    class: string;
+} | {
+    variant: "link";
+    color: "default";
+    class: string;
+})[];

package/dist/lib/components/ui/collections/data-table/hooks.d.ts

@@ -1,4 +1,4 @@
-import { Row, RowData, Table } from '@tanstack/react-table';
+import { Row, RowData } from '@tanstack/react-table';
 import { DataTableFeatures } from './features';
 export declare function useColumnHelpers<T extends RowData>(): {
     columnHelper: import('@tanstack/table-core').ColumnHelper<{
@@ -8,10 +8,10 @@ export declare function useColumnHelpers<T extends RowData>(): {
         rowSortingFeature: import('@tanstack/table-core').TableFeature;
         rowExpandingFeature: import('@tanstack/table-core').TableFeature;
         rowPaginationFeature: import('@tanstack/table-core').TableFeature;
-        filteredRowModel: (table: Table<any, any>) => () => import('@tanstack/table-core').RowModel<any, any>;
-        sortedRowModel: (table: Table<any, any>) => () => import('@tanstack/table-core').RowModel<any, any>;
-        paginatedRowModel: (table: Table<any, any>) => () => import('@tanstack/table-core').RowModel<any, any>;
-        expandedRowModel: (table: Table<any, any>) => () => import('@tanstack/table-core').RowModel<any, any>;
+        filteredRowModel: (table: import('@tanstack/table-core').Table<any, any>) => () => import('@tanstack/table-core').RowModel<any, any>;
+        sortedRowModel: (table: import('@tanstack/table-core').Table<any, any>) => () => import('@tanstack/table-core').RowModel<any, any>;
+        paginatedRowModel: (table: import('@tanstack/table-core').Table<any, any>) => () => import('@tanstack/table-core').RowModel<any, any>;
+        expandedRowModel: (table: import('@tanstack/table-core').Table<any, any>) => () => import('@tanstack/table-core').RowModel<any, any>;
     }, T>;
     predefinedColumns: () => {
         select: import('@tanstack/table-core').DisplayColumnDef<{
@@ -21,10 +21,10 @@ export declare function useColumnHelpers<T extends RowData>(): {
             rowSortingFeature: import('@tanstack/table-core').TableFeature;
             rowExpandingFeature: import('@tanstack/table-core').TableFeature;
             rowPaginationFeature: import('@tanstack/table-core').TableFeature;
-            filteredRowModel: (table: Table<any, any>) => () => import('@tanstack/table-core').RowModel<any, any>;
-            sortedRowModel: (table: Table<any, any>) => () => import('@tanstack/table-core').RowModel<any, any>;
-            paginatedRowModel: (table: Table<any, any>) => () => import('@tanstack/table-core').RowModel<any, any>;
-            expandedRowModel: (table: Table<any, any>) => () => import('@tanstack/table-core').RowModel<any, any>;
+            filteredRowModel: (table: import('@tanstack/table-core').Table<any, any>) => () => import('@tanstack/table-core').RowModel<any, any>;
+            sortedRowModel: (table: import('@tanstack/table-core').Table<any, any>) => () => import('@tanstack/table-core').RowModel<any, any>;
+            paginatedRowModel: (table: import('@tanstack/table-core').Table<any, any>) => () => import('@tanstack/table-core').RowModel<any, any>;
+            expandedRowModel: (table: import('@tanstack/table-core').Table<any, any>) => () => import('@tanstack/table-core').RowModel<any, any>;
         }, T, unknown>;
         expand: import('@tanstack/table-core').DisplayColumnDef<{
             columnFilteringFeature: import('@tanstack/table-core').TableFeature;
@@ -33,10 +33,10 @@ export declare function useColumnHelpers<T extends RowData>(): {
             rowSortingFeature: import('@tanstack/table-core').TableFeature;
             rowExpandingFeature: import('@tanstack/table-core').TableFeature;
             rowPaginationFeature: import('@tanstack/table-core').TableFeature;
-            filteredRowModel: (table: Table<any, any>) => () => import('@tanstack/table-core').RowModel<any, any>;
-            sortedRowModel: (table: Table<any, any>) => () => import('@tanstack/table-core').RowModel<any, any>;
-            paginatedRowModel: (table: Table<any, any>) => () => import('@tanstack/table-core').RowModel<any, any>;
-            expandedRowModel: (table: Table<any, any>) => () => import('@tanstack/table-core').RowModel<any, any>;
+            filteredRowModel: (table: import('@tanstack/table-core').Table<any, any>) => () => import('@tanstack/table-core').RowModel<any, any>;
+            sortedRowModel: (table: import('@tanstack/table-core').Table<any, any>) => () => import('@tanstack/table-core').RowModel<any, any>;
+            paginatedRowModel: (table: import('@tanstack/table-core').Table<any, any>) => () => import('@tanstack/table-core').RowModel<any, any>;
+            expandedRowModel: (table: import('@tanstack/table-core').Table<any, any>) => () => import('@tanstack/table-core').RowModel<any, any>;
         }, T, unknown>;
     };
 };

package/dist/lib/components/ui/collections/data-table/partials/data-table-empty-row.d.ts

@@ -6,7 +6,11 @@ export type DataTableEmptyState = {
 };
 export type DataTableEmpty = ReactNode | ((state: DataTableEmptyState) => ReactNode);
 /** `DataTable`'s "nothing here" row: one `TableEmpty` cell spanning every
- * visible column, holding `empty` or the default icon and text. */
+ * visible column, holding `empty` or the default icon and text. The content
+ * is centred in the width the scroll region shows (its
+ * `--table-visible-width`, at most; the cell's width before it is measured),
+ * and sticks to its start, so a table wider than a phone does not push it out of
+ * view. */
 export declare function DataTableEmptyRow({ columnCount, empty, filtered, }: {
     columnCount: number;
     empty?: DataTableEmpty;

package/dist/lib/components/ui/collections/data-table/partials/data-table-scroll-region.d.ts

@@ -0,0 +1,16 @@
+import { ReactNode } from 'react';
+/**
+ * The one box `DataTable`'s table scrolls in — the `Table` primitive's own
+ * container is made `overflow-visible` here, so there is no scroll inside a
+ * scroll. While its content overflows, it is a keyboard-focusable region with
+ * a name (axe `scrollable-region-focusable`), and an edge fades on each side
+ * where columns are hidden. Its measured visible width is set as
+ * `--table-visible-width`, so the empty state can centre itself within it —
+ * not a size container, which would collapse it inside a content-sized parent
+ * (`w-fit`, `inline-flex`, an `auto` grid track, a popover).
+ */
+export declare function DataTableScrollRegion({ label, maxHeight, children, }: {
+    label: string;
+    maxHeight?: number | string;
+    children: ReactNode;
+}): import("react").JSX.Element;

package/dist/lib/components/ui/collections/data-table/partials/data-table-toolbar.d.ts

@@ -0,0 +1,24 @@
+import { RowData } from '@tanstack/react-table';
+import { ReactNode } from 'react';
+import { DataTableTable } from '../types';
+/** Whether a node renders anything: `null`, `false`, whitespace-only
+ * strings, and arrays and fragments of them do not. A component that
+ * returns `null` cannot be seen from here. */
+export declare function rendersContent(node: ReactNode): boolean;
+/**
+ * `DataTable`'s toolbar: `actions(table)` and the view options. Rendered
+ * only when one of them has content — an empty `<fieldset>` is a nameless
+ * group to a screen reader. A fieldset disables every native control in it
+ * (filters, the view options) while loading, whoever rendered it.
+ *
+ * With `actions` and a `select` column, actions that show on the first
+ * selection must not push the rows down under a finger: the toolbar's height
+ * is reserved — an empty, hidden placeholder while `actions` render nothing,
+ * and the same minimum height once they do.
+ */
+export declare function DataTableToolbar<TData extends RowData>({ table, actions, showViewOptions, loading, }: {
+    table: DataTableTable<TData>;
+    actions?: (table: DataTableTable<TData>) => ReactNode;
+    showViewOptions?: boolean;
+    loading: boolean;
+}): import("react").JSX.Element | null;

package/dist/lib/components/ui/collections/data-table/select-checkbox.d.ts

@@ -0,0 +1,10 @@
+import { RowData, Table } from '@tanstack/react-table';
+import { DataTableFeatures } from './features';
+/** 16px boxes, with a centred 24px `::before` target (WCAG 2.5.8). */
+export declare const SELECT_CHECKBOX_CLASS = "ml-2 relative before:absolute before:top-1/2 before:left-1/2 before:size-6 before:-translate-x-1/2 before:-translate-y-1/2";
+/** The `select` column's header: disabled while the table loads, when the
+ * rows it would select are inert. */
+export declare function SelectAllCheckbox<T extends RowData>({ table, label, }: {
+    table: Table<DataTableFeatures, T>;
+    label: string;
+}): import("react").JSX.Element;

package/dist/lib/components/ui/collections/data-table/types.d.ts

@@ -42,7 +42,16 @@ export interface DataTableProps<TData extends RowData> {
     actions?: (table: DataTableTable<TData>) => ReactNode;
     options?: DataTableOptions;
     renderExpandedRow?: (row: Row<DataTableFeatures, TData>) => ReactNode;
+    /** The header row (column names, sorting, "Select all"). Shown at every
+     * width; `false` hides it. */
     showHeader?: boolean;
+    /** Caps the table's height (`400`, `'60vh'`); the rows then scroll inside
+     * it. Default: none — the table is as tall as its rows, and the page
+     * scrolls. */
+    maxHeight?: number | string;
+    /** The name of the scroll region the table becomes while it overflows.
+     * Default: "Scrollable table" (`material.table.labels.scroll-region`). */
+    scrollLabel?: string;
     onLoadMore?: () => void;
     isLoadingMore?: boolean;
     showViewOptions?: boolean;

package/dist/lib/components/ui/collections/data-table/use-data-table.d.ts

@@ -1,4 +1,4 @@
-import { ColumnDef, RowData, RowSelectionState, SortingState } from '@tanstack/react-table';
+import { ColumnDef, OnChangeFn, RowData, RowSelectionState, SortingState } from '@tanstack/react-table';
 import { DataTableFeatures } from './features';
 export type UseDataTableOptions<TData extends RowData> = {
     data: TData[];
@@ -12,6 +12,17 @@ export type UseDataTableOptions<TData extends RowData> = {
     onRowSelectionChange?: (rowSelection: RowSelectionState) => void;
     getRowId?: (row: TData, index: number) => string;
 };
+/** A state held here unless the caller passes `value`; `onChange` is told
+ * of every change, with the new value rather than TanStack's updater.
+ *
+ * An update that resolves to the current value is dropped: no `setState`,
+ * no `onChange`. TanStack's auto-resets (`expanded` when `data` changes) run
+ * in a microtask and hand an updater that returns the old state when it is
+ * already the reset one; calling `setState` for it anyway re-rendered the
+ * table after every page, and in a browser that runs that microtask while
+ * React renders (Firefox under Playwright does), React logged "Cannot update
+ * a component (`DataTable`) while rendering a different component". */
+export declare function useControlled<T>(value: T | undefined, onChange: ((value: T) => void) | undefined, initial: T): [T, OnChangeFn<T>];
 /** `DataTable`'s table: sorting, filters, visibility, selection and expansion
  * held in local state (sorting and selection controllable), rows expandable
  * when the table renders them. */

package/dist/lib/components/ui/collections/data-table/use-scroll-edges.d.ts

@@ -0,0 +1,22 @@
+import { RefObject } from 'react';
+/** What `useScrollEdges` reads off a scroll container. */
+export type ScrollEdges = {
+    /** Its content is wider or taller than it: it scrolls. */
+    scrollable: boolean;
+    /** Content is hidden before the inline start (scrolled away from it). */
+    start: boolean;
+    /** Content is hidden past the inline end. */
+    end: boolean;
+    /** Its visible width (`clientWidth`), in pixels; `0` until measured. */
+    width: number;
+};
+/**
+ * Whether `ref`'s element scrolls, and on which inline edges content is
+ * hidden — for an edge fade and a focusable scroll region — and how wide
+ * it shows its content. The scroll offset
+ * comes from react-use's `useScroll`; the sizes are re-read when the element
+ * or its `<table>` resizes (new rows, a column shown). `scrollLeft` is
+ * negative in a right-to-left table, so its absolute value is the distance
+ * from the start. Nothing scrolls on the server or before the first effect.
+ */
+export declare function useScrollEdges(ref: RefObject<HTMLElement | null>): ScrollEdges;

package/dist/lib/components/ui/dates/calendar/calendar-day.d.ts

@@ -0,0 +1,8 @@
+import { ComponentProps, ReactNode } from 'react';
+import { DayButton, DayProps } from 'react-day-picker';
+declare function CalendarSelectedHint({ children }: {
+    children: ReactNode;
+}): import("react").JSX.Element;
+declare function CalendarDay({ day, modifiers, ...props }: DayProps): import("react").JSX.Element;
+declare function CalendarDayButton({ className, day, modifiers, ...props }: Omit<ComponentProps<typeof DayButton>, 'color'>): import("react").JSX.Element;
+export { CalendarDay, CalendarDayButton, CalendarSelectedHint };

package/dist/lib/components/ui/dates/calendar/calendar.d.ts

@@ -1,12 +1,12 @@
 import { ComponentProps } from 'react';
-import { DateRange, DayButton, DayPicker } from 'react-day-picker';
+import { DateRange, DayPicker } from 'react-day-picker';
 import { Button } from '../../actions/button/button';
-declare function Calendar({ className, classNames, showOutsideDays, captionLayout, buttonVariant, formatters, components, month: monthProp, defaultMonth, onMonthChange, startMonth, endMonth, disabled, minDate, maxDate, disablePast, disableFuture, ...props }: ComponentProps<typeof DayPicker> & {
+import { CalendarDayButton } from './calendar-day';
+declare function Calendar({ className, classNames, showOutsideDays, captionLayout, buttonVariant, formatters, components, month: monthProp, defaultMonth, onMonthChange, startMonth, endMonth, disabled, minDate, maxDate, disablePast, disableFuture, locale, labels, ...props }: ComponentProps<typeof DayPicker> & {
     buttonVariant?: ComponentProps<typeof Button>['variant'];
     minDate?: Date;
     maxDate?: Date;
     disablePast?: boolean;
     disableFuture?: boolean;
 }): import("react").JSX.Element;
-declare function CalendarDayButton({ className, day, modifiers, ...props }: Omit<ComponentProps<typeof DayButton>, 'color'>): import("react").JSX.Element;
 export { Calendar, CalendarDayButton, type DateRange };

package/dist/lib/components/ui/dates/calendar/calendar.utils.d.ts

@@ -14,7 +14,15 @@ declare function resolveDateBounds({ minDate, maxDate, disablePast, disableFutur
     maxDate?: Date;
 };
 declare function buildDisabledMatchers(disabled: Matcher | Matcher[] | undefined, minDate?: Date, maxDate?: Date): Matcher[] | undefined;
+/**
+ * A day's accessible name: its full localized date ("Thursday, October 1,
+ * 2026", "jeudi 1 octobre 2026"), nothing else - the chosen and current states
+ * are `aria-selected`, `aria-current` and a described-by "Selected", not words
+ * in the name. An unknown language tag falls back to English.
+ */
+declare function labelDay(date: Date, language?: string): string;
 export declare const CALENDAR_UTILS: {
+    labelDay: typeof labelDay;
     getYearPageStart: typeof getYearPageStart;
     getYearsForPage: typeof getYearsForPage;
     formatYearRange: typeof formatYearRange;

package/dist/lib/components/ui/dates/calendar/use-calendar-labels.d.ts

@@ -0,0 +1,22 @@
+import { DayPickerProps } from 'react-day-picker';
+/**
+ * The calendar's language and the labels built from it: the `locale` prop, else
+ * the active `I18nProvider` language, else English. A day is named by its full
+ * localized date; a consumer's `labels.labelDayButton` still wins.
+ */
+export declare function useCalendarLabels(locale: DayPickerProps['locale'], labels: DayPickerProps['labels']): {
+    locale: import('date-fns').Locale | Partial<import('react-day-picker').DayPickerLocale>;
+    labels: {
+        labelNav?: typeof import('react-day-picker').labelNav | undefined;
+        labelGrid?: typeof import('react-day-picker').labelGrid | undefined;
+        labelGridcell?: typeof import('react-day-picker').labelGridcell | undefined;
+        labelMonthDropdown?: typeof import('react-day-picker').labelMonthDropdown | undefined;
+        labelYearDropdown?: typeof import('react-day-picker').labelYearDropdown | undefined;
+        labelNext?: typeof import('react-day-picker').labelNext | undefined;
+        labelPrevious?: typeof import('react-day-picker').labelPrevious | undefined;
+        labelDayButton: typeof import('react-day-picker').labelDayButton;
+        labelWeekday?: typeof import('react-day-picker').labelWeekday | undefined;
+        labelWeekNumber?: typeof import('react-day-picker').labelWeekNumber | undefined;
+        labelWeekNumberHeader?: typeof import('react-day-picker').labelWeekNumberHeader | undefined;
+    };
+};

package/dist/lib/components/ui/display/description/description.d.ts

@@ -7,6 +7,7 @@ export type DescriptionProps = {
  * Description - Label/value pair for read-only detail panels.
  *
  * Renders nothing when `value` is falsy, so callers can drop it into a grid of
- * optional fields without guarding each one.
+ * optional fields without guarding each one. It takes one cell of the parent
+ * grid; pass `className="col-start-full"` for a full-width row.
  */
 export declare function Description({ label, value, className, children, ...props }: DescriptionProps): false | "" | 0 | 0n | import("react").JSX.Element | null | undefined;

package/dist/lib/components/ui/display/list-tile/list-tile.d.ts

@@ -1,4 +1,5 @@
 import { HTMLAttributes, MouseEventHandler, ReactNode } from 'react';
+import { LinkComponent } from '../../primitives/link/link-component';
 export type ListTileProps = {
     leading?: ReactNode;
     trailing?: ReactNode;
@@ -7,7 +8,14 @@ export type ListTileProps = {
     selected?: boolean;
     size?: 'sm' | 'md';
     href?: string;
+    /**
+     * The link element of a tile with an `href`, with the app shell's contract
+     * ({@link LinkComponent}: it takes `href`, spreads every other prop and
+     * forwards `ref`). A plain `<a>` by default, which reloads the page; pass a
+     * router `Link` wrapper for client-side navigation.
+     */
+    linkComponent?: LinkComponent;
     disabled?: boolean;
     onClick?: MouseEventHandler<HTMLButtonElement | HTMLAnchorElement>;
 } & Omit<HTMLAttributes<HTMLElement>, 'children' | 'title' | 'onClick'>;
-export declare function ListTile({ title, subtitle, leading, trailing, className, selected, size, href, disabled, onClick, ...props }: ListTileProps): import("react").JSX.Element;
+export declare function ListTile({ title, subtitle, leading, trailing, className, selected, size, href, linkComponent, disabled, onClick, ...props }: ListTileProps): import("react").JSX.Element;