prime-ui-kit 0.10.0 → 0.11.0

package/dist/components/data-table/ColumnsMenu.d.ts

@@ -0,0 +1,19 @@
+import * as React from "react";
+import type { PositionAlign, PositionSide } from "../../hooks/usePosition";
+export type DataTableColumnsMenuProps = Omit<React.ButtonHTMLAttributes<HTMLButtonElement>, "type" | "children"> & {
+    /** Side of the trigger the menu opens on. Default `bottom`. */
+    side?: PositionSide;
+    /** Alignment to the trigger. Default `auto` (the edge with more room). */
+    align?: PositionAlign;
+    /** The trigger button. */
+    ref?: React.Ref<HTMLButtonElement>;
+};
+/**
+ * The column chooser of the table it sits in (put it into `toolbar`): a trigger button and a menu
+ * with a check item per column and «Показать все». Writes the table's `hiddenColumns`; a column
+ * with `hideable: false` stays checked and disabled, and the last visible column cannot be hidden.
+ */
+export declare function DataTableColumnsMenu({ side, align, ...rest }: DataTableColumnsMenuProps): import("react/jsx-runtime").JSX.Element;
+export declare namespace DataTableColumnsMenu {
+    var displayName: string;
+}

package/dist/components/data-table/DataTable.d.ts

@@ -1,7 +1,9 @@
 import * as React from "react";
-import type { ControlSize } from "@/internal/states";
-import type { DataTableColumn, DataTableSortState } from "./types";
-export type { DataTableColumn, DataTableOrder, DataTableSortState } from "./types";
+import type { ControlSize } from "../../internal/states";
+import { DataTableColumnsMenu } from "./ColumnsMenu";
+import type { DataTableColumn, DataTableGroup, DataTableRowClickEvent, DataTableSortState } from "./types";
+export type { DataTableColumnsMenuProps } from "./ColumnsMenu";
+export type { DataTableColumn, DataTableGroup, DataTableOrder, DataTableRowClickEvent, DataTableSortState, } from "./types";
 /** System strings; `{from}`, `{to}`, `{total}`, `{label}`, `{count}` are replaced. */
 export type DataTableLabels = {
     /** Screen-reader announcement while skeleton rows are shown. */
@@ -24,17 +26,38 @@ export type DataTableLabels = {
     expand: string;
     /** `aria-label` of the expand toggle of an expanded row. */
     collapse: string;
+    /** Text of the `DataTable.ColumnsMenu` trigger; `{shown}` and `{total}` are column counts. */
+    columns: string;
+    /** The `DataTable.ColumnsMenu` item that shows every column again. */
+    showAllColumns: string;
+    /** `aria-label` of a row's drag handle (`onReorder`); `{label}` is `getRowLabel(row)`. */
+    reorderRow: string;
+    /** Tooltip of the handles while the table is sorted by a column (reordering is off). */
+    reorderSorted: string;
 };
 export type DataTableProps<Row> = Omit<React.HTMLAttributes<HTMLDivElement>, "children"> & {
     /** The outer card-fill `<div>`. */
     ref?: React.Ref<HTMLDivElement>;
     columns: DataTableColumn<Row>[];
     /**
-     * Ids of columns not rendered (head, body, skeleton, state rows). A column with
-     * `hideable: false` stays. The consumer owns the list and the control that changes it.
+     * Ids of columns not rendered (head, body, skeleton, state rows), controlled. A column with
+     * `hideable: false` stays. `DataTable.ColumnsMenu` in `toolbar` changes it.
      */
     hiddenColumns?: string[];
+    /** Initially hidden column ids, uncontrolled. */
+    defaultHiddenColumns?: string[];
+    /** The hidden column ids changed (`DataTable.ColumnsMenu`); keep them to restore the choice. */
+    onHiddenColumnsChange?: (hiddenColumns: string[]) => void;
     rows: Row[];
+    /**
+     * Who sorts and pages the rows. `client` — the table sorts `rows` and slices pages itself;
+     * `server` — `rows` is the one page (or the loaded batches) the owner fetched, already sorted:
+     * the table never re-sorts or slices them, `sort` / `page` drive the request and `rowCount`
+     * the Pagination and the range line.
+     */
+    source?: "client" | "server";
+    /** Total rows on the server (`source="server"`): Pagination and «Показано … из {total}». */
+    rowCount?: number;
     size?: ControlSize;
     className?: string;
     showHeader?: boolean;
@@ -48,7 +71,20 @@ export type DataTableProps<Row> = Omit<React.HTMLAttributes<HTMLDivElement>, "ch
     getRowKey?: (row: Row, index: number) => React.Key;
     /** Human name of a row for the checkbox / expand toggle `aria-label`s (e.g. the person's name). */
     getRowLabel?: (row: Row) => string;
-    onRowClick?: (row: Row, index: number, event: React.MouseEvent<HTMLTableRowElement>) => void;
+    /**
+     * The row is a link: the key cell (first visible column) holds a real `<a>` and the same link
+     * covers every other cell, so a click, ⌘/Ctrl-click, a middle click and «open in new tab» work
+     * anywhere on the row; Tab stops on the link.
+     */
+    getRowHref?: (row: Row) => string;
+    /**
+     * Opens a row in place: a click on the row (never on a control inside it, never from a portal)
+     * or Enter / Space on the focused row. With `getRowHref` it gets the plain clicks only — call
+     * `event.preventDefault()` there to route in the app instead of loading the page.
+     */
+    onRowClick?: (row: Row, index: number, event: DataTableRowClickEvent) => void;
+    /** Which rows open (`getRowHref` / `onRowClick`); `false` for totals and service rows. */
+    isRowClickable?: (row: Row) => boolean;
     loading?: boolean;
     /** Empty-state content (e.g. `EmptyPage`); defaults to `labels.empty`. */
     empty?: React.ReactNode;
@@ -73,8 +109,15 @@ export type DataTableProps<Row> = Omit<React.HTMLAttributes<HTMLDivElement>, "ch
     infiniteBatchSize?: number;
     hasMore?: boolean;
     loadingMore?: boolean;
+    /**
+     * Asks for the next batch. A returned promise shows the loading status until it settles; a
+     * rejected one stops asking until the rows change.
+     */
     onLoadMore?: () => void | Promise<void>;
-    /** Max height of the scroll viewport (number = px). 360 with `paging="infinite"`. */
+    /**
+     * Max height of the scroll viewport (number = px); `"fill"` — the table takes the height of
+     * its flex / grid parent and the rows scroll inside. 360 with `paging="infinite"`.
+     */
     scrollHeight?: number | string;
     /** The table spans its container; `false` sizes it by its content. */
     fullWidth?: boolean;
@@ -90,6 +133,15 @@ export type DataTableProps<Row> = Omit<React.HTMLAttributes<HTMLDivElement>, "ch
     selected?: React.Key[];
     defaultSelected?: React.Key[];
     onSelectedChange?: (selected: React.Key[]) => void;
+    /**
+     * Rows reorder: a leading handle column (drag, a touch hold, Alt + ↑ / ↓). The row `id` now
+     * stands in front of `beforeId` (`getRowKey` values; `null` — last); on a page, a row put last
+     * stands in front of the first row of the next page. Return a promise to save on a server: the
+     * row stays in its new place with a busy handle, a rejection moves it back. Off while the table
+     * is sorted by a column; with `getRowGroup` rows move inside their group. Not combined with
+     * expandable rows (`getRowChildren`, `renderExpanded`).
+     */
+    onReorder?: (id: React.Key, beforeId: React.Key | null) => void | Promise<void>;
     /** Tree sub-rows: rendered under the parent with the same columns, indented by depth. */
     getRowChildren?: (row: Row) => Row[] | undefined;
     /** Detail panel rendered in a full-width row under an expanded row. */
@@ -105,5 +157,17 @@ export type DataTableProps<Row> = Omit<React.HTMLAttributes<HTMLDivElement>, "ch
     loadingRows?: number;
     /** Panel above the table (search, filters, actions). Wraps on narrow widths. */
     toolbar?: React.ReactNode;
+    /**
+     * Group key of a row: rows are drawn under a header row per group. Groups keep the order they
+     * first appear in `rows`; a sort orders the rows inside each group.
+     */
+    getRowGroup?: (row: Row) => string | number;
+    /** Content of a group header row (name, totals); defaults to the group key. */
+    renderGroupHeader?: (group: DataTableGroup<Row>) => React.ReactNode;
+    /** Group header rows stick under the head while their rows scroll. */
+    stickyGroupHeaders?: boolean;
 };
-export declare function DataTable<Row>({ columns: allColumns, hiddenColumns, rows, size, className, showHeader, stickyHeader, stickyFirstColumn, getRowKey, onRowClick, loading, empty, labels: labelsProp, rowDividers, columnDividers, sort, defaultSort, onSortChange, paging, page, defaultPage, onPageChange, pageSize, infiniteBatchSize, hasMore, loadingMore, onLoadMore, scrollHeight, fullWidth, highlightRowOnHover, highlightColumnOnHover, striped, getRowLabel, selectable, selected, defaultSelected, onSelectedChange, getRowChildren, renderExpanded, isRowExpandable, expanded, defaultExpanded, onExpandedChange, error, loadingRows, toolbar, ref, ...rest }: DataTableProps<Row>): import("react/jsx-runtime").JSX.Element;
+export declare function DataTable<Row>({ columns: allColumns, hiddenColumns, defaultHiddenColumns, onHiddenColumnsChange, rows, source, rowCount, size, className, showHeader, stickyHeader, stickyFirstColumn, getRowKey, getRowHref, onRowClick, isRowClickable, loading, empty, labels: labelsProp, rowDividers, columnDividers, sort, defaultSort, onSortChange, paging, page, defaultPage, onPageChange, pageSize, infiniteBatchSize, hasMore, loadingMore, onLoadMore, scrollHeight, fullWidth, highlightRowOnHover, highlightColumnOnHover, striped, getRowLabel, selectable, selected, defaultSelected, onSelectedChange, onReorder, getRowChildren, renderExpanded, isRowExpandable, expanded, defaultExpanded, onExpandedChange, error, loadingRows, toolbar, getRowGroup, renderGroupHeader, stickyGroupHeaders, ref, ...rest }: DataTableProps<Row>): import("react/jsx-runtime").JSX.Element;
+export declare namespace DataTable {
+    var ColumnsMenu: typeof DataTableColumnsMenu;
+}

package/dist/components/data-table/Footer.d.ts

@@ -1,4 +1,4 @@
-import type { ControlSize } from "@/internal/states";
+import type { ControlSize } from "../../internal/states";
 type FooterProps = {
     size: ControlSize;
     /** Range line («Показано 1–5 из 23»), or nothing. */

package/dist/components/data-table/Head.d.ts

@@ -1,4 +1,4 @@
-import type { ControlSize } from "@/internal/states";
+import type { ControlSize } from "../../internal/states";
 import type { DataTableColumn, DataTableSortState } from "./types";
 type HeadProps<Row> = {
     columns: DataTableColumn<Row>[];
@@ -6,9 +6,13 @@ type HeadProps<Row> = {
     sort: DataTableSortState;
     onSort: (columnId: string) => void;
     stickyFirstColumn: boolean;
+    /** The head sticks to the top of the scroller. */
+    stickyHeader: boolean;
     /** Sticky head and first column: the leading head cells stick to both edges. */
     stickyCorner: boolean;
     expandEnabled: boolean;
+    /** A leading column of row handles (`onReorder`). */
+    reorderable?: boolean;
     selectAll?: {
         checked: boolean;
         indeterminate: boolean;
@@ -17,5 +21,5 @@ type HeadProps<Row> = {
         onToggle: () => void;
     };
 };
-export declare function Head<Row>({ columns, size, sort, onSort, stickyFirstColumn, stickyCorner, expandEnabled, selectAll, }: HeadProps<Row>): import("react/jsx-runtime").JSX.Element;
+export declare function Head<Row>({ columns, size, sort, onSort, stickyFirstColumn, stickyHeader, stickyCorner, expandEnabled, reorderable, selectAll, }: HeadProps<Row>): import("react/jsx-runtime").JSX.Element;
 export {};

package/dist/components/data-table/Row.d.ts

@@ -1,8 +1,9 @@
 import * as React from "react";
-import type { ControlSize } from "@/internal/states";
+import type { ControlSize } from "../../internal/states";
 import type { DataTableLabels } from "./DataTable";
+import { type RowReorderShared } from "./reorder";
 import { type MeasureRow } from "./rows";
-import type { DataTableCellAlign, DataTableColumn } from "./types";
+import type { DataTableCellAlign, DataTableColumn, DataTableRowClickEvent } from "./types";
 import type { RowSelectionHandlers } from "./useRowSelection";
 export declare function columnAlign<Row>(column: DataTableColumn<Row>): DataTableCellAlign;
 export declare function columnSizeStyle<Row>(column: DataTableColumn<Row>): React.CSSProperties | undefined;
@@ -16,18 +17,31 @@ export type RowShared<Row> = {
     stickyFirstColumn: boolean;
     striped: boolean;
     totalColumns: number;
-    getRowLabel?: (row: Row) => string;
-    onRowClick?: (row: Row, index: number, event: React.MouseEvent<HTMLTableRowElement>) => void;
+    /**
+     * Opens a row in place (`onRowClick`); null without it. Stable: it calls the owner's latest
+     * handler, so an inline handler never re-renders every row.
+     */
+    openRow: ((row: Row, index: number, event: DataTableRowClickEvent) => void) | null;
     renderExpanded?: (row: Row) => React.ReactNode;
     rowDomId: (key: React.Key) => string;
     detailDomId: (key: React.Key) => string;
+    /** Value range of every `scale` column (heatmap shading). */
+    scaleDomains: Map<string, [number, number]>;
     selection: RowSelectionHandlers;
     toggleExpanded: (key: React.Key) => void;
+    /** Row reordering (`onReorder`): a handle column and sortable rows; null without it. */
+    reorder: RowReorderShared | null;
 };
 type DataTableRowProps<Row> = {
     shared: RowShared<Row>;
     row: Row;
     rowKey: React.Key;
+    /** `getRowLabel(row)`: values, not the owner's functions, so rows memoize on what they show. */
+    rowLabel: string | undefined;
+    /** The row opens (`getRowHref` / `onRowClick`, not taken out by `isRowClickable`). */
+    opens: boolean;
+    /** `getRowHref(row)` of a row that opens as a link. */
+    href: string | undefined;
     index: number;
     depth: number;
     expandable: boolean;
@@ -40,10 +54,24 @@ type DataTableRowProps<Row> = {
     selected: boolean;
     /** Ids of the sub-rows the toggle controls (while expanded). */
     childControls: string;
+    /** A virtualized body: measures the row's `<tr>` (`useVirtualRows`). */
+    measureRef?: ((node: HTMLElement | null) => void) | undefined;
+    /** A virtualized body: the row's position among all rows of the table, head included. */
+    ariaRowIndex?: number | undefined;
 };
-declare function DataTableRowImpl<Row>({ shared, row, rowKey, index, depth, expandable, expanded, animate, folding, detailAnimate, selected, childControls, }: DataTableRowProps<Row>): import("react/jsx-runtime").JSX.Element;
+declare function DataTableRowImpl<Row>({ shared, row, rowKey, rowLabel, opens, href, index, depth, expandable, expanded, animate, folding, detailAnimate, selected, childControls, measureRef, ariaRowIndex, }: DataTableRowProps<Row>): import("react/jsx-runtime").JSX.Element;
 /** A body row (plus its detail panel); re-renders only when its own props change. */
 export declare const DataTableRow: typeof DataTableRowImpl;
+type GroupRowProps = {
+    totalColumns: number;
+    sticky: boolean;
+    children: React.ReactNode;
+};
+/**
+ * The header row of a group (`getRowGroup`): a `<th scope="rowgroup">` across every column at the
+ * head of its own `<tbody>`. Its content stays in the visible width while the table scrolls sideways.
+ */
+export declare function GroupRow({ totalColumns, sticky, children }: GroupRowProps): import("react/jsx-runtime").JSX.Element;
 type MeasureBodyProps<Row> = {
     rows: MeasureRow<Row>[];
     columns: DataTableColumn<Row>[];

package/dist/components/data-table/StateRows.d.ts

@@ -1,5 +1,5 @@
 import type * as React from "react";
-import type { ControlSize } from "@/internal/states";
+import type { ControlSize } from "../../internal/states";
 import type { DataTableColumn } from "./types";
 type StateRowsProps<Row> = {
     state: "error" | "loading" | "empty";
@@ -8,11 +8,13 @@ type StateRowsProps<Row> = {
     totalColumns: number;
     selectable: boolean;
     expandEnabled: boolean;
+    /** A leading column of row handles (`onReorder`). */
+    reorderable?: boolean;
     error: React.ReactNode;
     empty: React.ReactNode;
     emptyLabel: string;
     skeletonRows: number;
 };
 /** The body of the loading (skeleton rows), empty and error states. */
-export declare function StateRows<Row>({ state, columns, size, totalColumns, selectable, expandEnabled, error, empty, emptyLabel, skeletonRows, }: StateRowsProps<Row>): import("react/jsx-runtime").JSX.Element | import("react/jsx-runtime").JSX.Element[];
+export declare function StateRows<Row>({ state, columns, size, totalColumns, selectable, expandEnabled, reorderable, error, empty, emptyLabel, skeletonRows, }: StateRowsProps<Row>): import("react/jsx-runtime").JSX.Element | import("react/jsx-runtime").JSX.Element[];
 export {};

package/dist/components/data-table/context.d.ts

@@ -0,0 +1,14 @@
+import * as React from "react";
+import type { ControlSize } from "../../internal/states";
+import type { DataTableLabels } from "./DataTable";
+import type { DataTableColumn } from "./types";
+/** What `DataTable.ColumnsMenu` reads from the table it sits in (through `toolbar`). */
+export type DataTableColumnsContextValue = {
+    /** Every column, hidden ones included, in table order. */
+    columns: DataTableColumn<never>[];
+    hidden: ReadonlySet<string>;
+    setHidden: (hidden: string[]) => void;
+    labels: DataTableLabels;
+    size: ControlSize;
+};
+export declare const DataTableColumnsContext: React.Context<DataTableColumnsContextValue | null>;

package/dist/components/data-table/reorder.d.ts

@@ -0,0 +1,86 @@
+import * as React from "react";
+import type { FlatRow } from "./rows";
+/** What every row needs to know about reordering (part of the rows' shared props). */
+export type RowReorderShared = {
+    /** The table is sorted by a column: the manual order is not what is on screen. */
+    locked: boolean;
+    /** Rows whose move the owner is still saving. */
+    pending: ReadonlySet<React.Key>;
+    /** `aria-label` of a row's handle; `{label}` is `getRowLabel(row)`. */
+    handleLabel: string;
+    /** Why the handles are off while the table is sorted. */
+    lockedHint: string;
+};
+type Entry<Row> = {
+    item: FlatRow<Row>;
+    index: number;
+};
+export type RowReorderOptions<Row> = {
+    onReorder: ((id: React.Key, beforeId: React.Key | null) => void | Promise<void>) | undefined;
+    /** Expandable rows (sub-rows, detail panels) do not reorder: a row would leave its children. */
+    expandEnabled: boolean;
+    /** Sorted by a column. */
+    sorted: boolean;
+    /** Every row in table order (sorted, grouped), the rows on screen a run of them. */
+    orderedRows: readonly Row[];
+    /** Where the rows on screen start in `orderedRows`. */
+    offset: number;
+    getRowKey: ((row: Row, index: number) => React.Key) | undefined;
+    getRowGroup: ((row: Row) => string | number) | undefined;
+    getRowLabel: ((row: Row) => string) | undefined;
+    handleLabel: string;
+    lockedHint: string;
+};
+/**
+ * Row reordering of a DataTable on Dnd's sortable list: the move goes to the owner as
+ * `onReorder(id, beforeId)` with the row keys; a returned promise keeps the row in its new place
+ * with a busy handle until it settles, a rejection glides it back (Dnd rolls the drawn order back).
+ */
+export declare function useRowReorder<Row>(options: RowReorderOptions<Row>): {
+    enabled: boolean;
+    shared: RowReorderShared | null;
+    reorderIn: (entries: readonly Entry<Row>[]) => (id: string, beforeId: string | null) => void | Promise<void>;
+    isOwnMove: (previous: readonly unknown[], next: readonly unknown[]) => boolean;
+};
+type ReorderBodyProps<Row> = {
+    entries: Entry<Row>[];
+    /** First index of the run among the rows on screen. */
+    start: number;
+    locked: boolean;
+    onReorder: (id: string, beforeId: string | null) => void | Promise<void>;
+    getRowLabel: ((row: Row) => string) | undefined;
+    renderRow: (item: FlatRow<Row>, index: number) => React.ReactNode;
+    /** The group's heading row: it heads the body and never moves. */
+    header?: React.ReactNode;
+    className?: string | undefined;
+};
+/** A `<tbody>` whose rows reorder: Dnd's sortable list in its table-rows mode, by the handle only. */
+export declare function ReorderBody<Row>({ entries, start, locked, onReorder, getRowLabel, renderRow, header, className, }: ReorderBodyProps<Row>): import("react/jsx-runtime").JSX.Element;
+/** Mounts the drag session the rows need, unless the app already has one above the table. */
+export declare function ReorderRoot({ enabled, children, }: {
+    enabled: boolean;
+    children: React.ReactNode;
+}): string | number | bigint | boolean | Iterable<React.ReactNode> | Promise<string | number | bigint | boolean | React.ReactPortal | React.ReactElement<unknown, string | React.JSXElementConstructor<any>> | Iterable<React.ReactNode> | null | undefined> | import("react/jsx-runtime").JSX.Element | null | undefined;
+type RowElementProps = Omit<React.ComponentProps<"tr">, "ref"> & {
+    reorder: RowReorderShared | null;
+    rowKey: React.Key;
+    /** The plain `<tr>` (a virtualized body measures it; virtualized tables never reorder). */
+    rowRef?: ((node: HTMLElement | null) => void) | undefined;
+};
+/**
+ * A body row's `<tr>`; in a reorderable table, a sortable item rendered as that `<tr>` (it needs no
+ * DOM id: only expandable rows are pointed at, and those do not reorder).
+ */
+export declare function RowElement({ reorder, rowKey, rowRef, id, children, ...rest }: RowElementProps): import("react/jsx-runtime").JSX.Element;
+type HandleCellProps = {
+    reorder: RowReorderShared;
+    rowKey: React.Key;
+    rowLabel: string | undefined;
+    className?: string | undefined;
+};
+/**
+ * The leading cell of a reorderable row: the grip (Alt + ↑ / ↓ from the keyboard), a spinner while
+ * the owner saves this row's move, and, while the table is sorted, a disabled grip that says why.
+ */
+export declare function ReorderHandleCell({ reorder, rowKey, rowLabel, className }: HandleCellProps): import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/components/data-table/rowEvents.d.ts

@@ -0,0 +1,14 @@
+import type * as React from "react";
+/**
+ * Elements inside a row that are controls of their own: a click on them never opens the row, and
+ * on a link row they sit above the row's hit area. `data-row-click-ignore` marks a custom widget.
+ */
+export declare const ROW_CONTROLS: string;
+/**
+ * Whether a click on a row should open it: it started inside the row's own DOM (React events
+ * bubble out of portals — a ⋯ menu item in a cell — and those never count), not on a control
+ * inside the row, and it did not end a text selection inside the row.
+ */
+export declare function opensRow(event: React.SyntheticEvent<HTMLElement>): boolean;
+/** A plain primary click: no modifier, so a link row may open in place instead of navigating. */
+export declare function isPlainClick(event: React.MouseEvent): boolean;

package/dist/components/data-table/rows.d.ts

@@ -1,9 +1,21 @@
 import type * as React from "react";
-import type { DataTableColumn, DataTableOrder, DataTableSortState } from "./types";
+import type { DataTableColumn, DataTableGroup, DataTableOrder, DataTableSortState } from "./types";
 /** The value a column sorts by: `sortAccessor`, else `accessor`. */
 export declare function columnValue<Row>(row: Row, column: DataTableColumn<Row>): unknown;
+/** Value range of every `scale` column over the data (top-level rows), with fixed ends applied. */
+export declare function scaleDomains<Row>(data: Row[], columns: DataTableColumn<Row>[]): Map<string, [number, number]>;
+/** Step 1–5 of a value on the chart scale; equal ends give the middle step. */
+export declare function scaleStep(value: unknown, [min, max]: [number, number]): number | undefined;
 /** Stable sort: equal rows keep their order. */
 export declare function sortRows<Row>(list: Row[], column: DataTableColumn<Row>, order: DataTableOrder): Row[];
+/**
+ * Row groups (`getRowGroup`): groups keep the order in which they first appear in the data, rows
+ * inside a group keep the sorted order. Returns the rows in that order and every group by key.
+ */
+export declare function groupRows<Row>(source: Row[], sorted: Row[], getGroup: (row: Row) => string | number): {
+    rows: Row[];
+    groups: Map<string | number, DataTableGroup<Row>>;
+};
 /** Header click cycle: asc → desc → none. */
 export declare function nextSort(current: DataTableSortState, columnId: string): DataTableSortState;
 export type FlatRow<Row> = {
@@ -18,6 +30,8 @@ export type FlatRow<Row> = {
     animate: boolean;
     /** A sub-row of a row that is collapsing: still drawn while it folds away. */
     folding: boolean;
+    /** Top-level row that opens a group on screen (`groupOf`): the group's key. */
+    groupStart?: string | number;
 };
 export type MeasureRow<Row> = {
     row: Row;
@@ -45,6 +59,8 @@ export type FlattenOptions<Row> = {
     lastExpandedKey: React.Key | null;
     /** Collect every key of the data (all pages, all depths) for «select all». */
     collectKeys: boolean;
+    /** Group key of a top-level row: the first rendered row of each group run opens it. */
+    groupOf?: (row: Row) => string | number;
 };
 export type Flattened<Row> = {
     /** Rendered rows in order: the page rows plus the sub-rows of expanded rows. */

package/dist/components/data-table/serverMode.d.ts

@@ -0,0 +1,8 @@
+/**
+ * How the rows on screen changed (`source="server"`): `same` — the same rows (maybe a new array);
+ * `append` — the previous rows stay first and more follow (infinite scroll); `replace` — another
+ * page, sort or filter result took their place. Rows are compared by id (`getRowKey`), else by
+ * identity. A first fill from no rows is no replacement: the body state swap covers it.
+ */
+export type RowsChange = "same" | "append" | "replace";
+export declare function rowsChange<T>(previous: readonly T[], next: readonly T[]): RowsChange;

package/dist/components/data-table/types.d.ts

@@ -4,6 +4,13 @@ export type DataTableSortState = {
     columnId: string;
     order: DataTableOrder;
 } | null;
+/** What opened a row in place: a click on it, or Enter / Space on the focused row. */
+export type DataTableRowClickEvent = React.MouseEvent<HTMLTableRowElement> | React.KeyboardEvent<HTMLTableRowElement>;
+/** A group of rows (`getRowGroup`): its key and every row of the data in it, in table order. */
+export type DataTableGroup<Row> = {
+    key: string | number;
+    rows: Row[];
+};
 /** Internal to the data-table folder (not exported from the kit). */
 export type DataTableCellAlign = "start" | "center" | "end";
 export type DataTableColumn<Row> = {
@@ -37,4 +44,13 @@ export type DataTableColumn<Row> = {
      * key column that names the row — it stays even when its id is listed.
      */
     hideable?: boolean;
+    /**
+     * Heatmap: each cell is shaded by its numeric value (`sortAccessor`, else `accessor`) on the
+     * five-step chart scale (`--prime-color-chart-scale-1…5`); the value itself stays in the cell.
+     * `true` spans the column's own minimum to maximum; `{ min, max }` fixes either end.
+     */
+    scale?: boolean | {
+        min?: number;
+        max?: number;
+    };
 };

package/dist/components/data-table/useColumnHover.d.ts

@@ -1,7 +1,8 @@
 import * as React from "react";
 /**
  * Column highlight: one delegated `pointerover` on the table marks the cells of the hovered column
- * with `data-column-hovered` directly in the DOM. Hovering never re-renders the table.
+ * with `data-column-hovered` directly in the DOM. Hovering never re-renders the table, and a move
+ * to another column touches only the cells of the two columns, not every cell of the table.
  */
 export declare function useColumnHover(enabled: boolean): {
     onPointerOver(event: React.PointerEvent<HTMLTableElement>): void;

package/dist/components/data-table/useInfiniteRows.d.ts

@@ -13,12 +13,15 @@ type UseInfiniteRowsOptions = {
 };
 /**
  * Infinite scroll: reveals loaded rows in batches while a sentinel under the table reaches the
- * viewport, then asks for more data (`onLoadMore`) once every loaded row is shown.
+ * viewport, then asks for more data (`onLoadMore`) once every loaded row is shown. A promise from
+ * `onLoadMore` counts as loading until it settles; after a rejection the table stops asking until
+ * the rows change, so a failing request is never repeated in a loop.
  */
 export declare function useInfiniteRows({ enabled, pageSize, batchSize, totalRows, hasMore, loadingMore, onLoadMore, scrollRef, }: UseInfiniteRowsOptions): {
     visibleCount: number;
     hasInternalMore: boolean;
     canRequestMore: boolean;
+    loading: boolean;
     sentinelRef: React.RefObject<HTMLDivElement | null>;
 };
 export {};

package/dist/components/data-table/useRowSelection.d.ts

@@ -18,10 +18,11 @@ export type RowSelectionHandlers = {
     onClick: (index: number, event: React.MouseEvent<HTMLElement>) => void;
 };
 /**
- * Row selection: controlled / uncontrolled ids, «select all» over every id in the data, Shift+click
- * ranges from the last toggled row, press-and-drag across checkbox cells and a polite count
- * announcement. The cell handlers are stable, so memoized rows do not re-render when the
- * selection of other rows changes.
+ * Row selection: controlled / uncontrolled ids, «select all» over every id in the data, and the
+ * shared range selection (`internal/useRangeSelection`) over the checkbox cells — Shift+click
+ * ranges from the anchor, press-and-drag across checkboxes with the table's scroller following,
+ * «the click after a drag is no toggle» — plus a polite count announcement. The cell handlers are
+ * stable, so memoized rows do not re-render when the selection of other rows changes.
  */
 export declare function useRowSelection({ selected, defaultSelected, onSelectedChange, visibleKeys, allKeys, tableRef, announce, }: UseRowSelectionOptions): {
     selectedSet: Set<React.Key>;

package/dist/components/datepicker/Datepicker.d.ts

@@ -1,6 +1,6 @@
-import type { PositionAlign } from "@/hooks/usePosition";
-import { type FieldFrameProps } from "@/internal/FieldFrame";
-import type { ControlSize } from "@/internal/states";
+import { type PositionAlign } from "../../hooks/usePosition";
+import { type FieldFrameProps } from "../../internal/FieldFrame";
+import type { ControlSize } from "../../internal/states";
 import { type CalendarOptions, DatepickerPanel, type DatepickerPanelProps } from "./DatepickerPanel";
 import { type DatepickerRange } from "./datepickerModel";
 export type { DatepickerLabels, DatepickerPanelProps } from "./DatepickerPanel";
@@ -32,6 +32,11 @@ export type DatepickerRootProps = DatepickerPanelProps & FieldFrameProps & {
     align?: PositionAlign;
     /** Id of the field button; generated when omitted. */
     id?: string;
+    /**
+     * Submits the value with a form through hidden inputs: `yyyy-MM-dd` (`yyyy-MM-ddTHH:mm` with
+     * `withTime`); a range submits two values under the name, `from` then `to` (empty when open).
+     */
+    name?: string;
     /** Accessible name when there is no `label`; the current value is appended. */
     "aria-label"?: string;
     "aria-labelledby"?: string;

package/dist/components/datepicker/DatepickerPanel.d.ts

@@ -1,6 +1,6 @@
 import { type Locale } from "date-fns";
 import * as React from "react";
-import type { ControlSize } from "@/internal/states";
+import type { ControlSize } from "../../internal/states";
 import { type DatepickerPreset, type DatepickerRange, type WeekStart } from "./datepickerModel";
 /** System strings and default texts. */
 export type DatepickerLabels = {
@@ -100,7 +100,7 @@ export declare namespace DatepickerPanel {
 }
 type PanelViewProps = Omit<CalendarOptions, "labels"> & DatepickerValue & {
     labels: DatepickerLabels;
-    /** `Datepicker.Panel`: the card follows its container; otherwise (the Root popover) it sizes to its content. */
+    /** `Datepicker.Panel`: host content that takes its container's width; otherwise (the Root popover) it sizes to its content. */
     embedded: boolean;
     /** After a value is applied (Root closes the popover). */
     onDone?: () => void;

package/dist/components/datepicker/panelLayout.d.ts

@@ -1,4 +1,4 @@
-import type { ControlSize } from "@/internal/states";
+import type { ControlSize } from "../../internal/states";
 /** Buttons and fields inside the panel sit one tier below the panel (m → s, 32 = the day cell). */
 export declare const STEP_DOWN: Record<ControlSize, ControlSize>;
 /** Panel geometry in px, the same numbers the CSS lays out with. */
@@ -7,7 +7,7 @@ export type PanelMetrics = {
     cell: number;
     /** Gap between months: `--prime-space-6`. */
     monthsGap: number;
-    /** Side padding of `.main` (both sides): `space-3` in the popover, `card-padding-s` embedded. */
+    /** Side padding of `.main` (both sides): `space-3` in the popover, none embedded (the host pads). */
     chrome: number;
 };
 /** Reads the panel geometry from the tokens on the document (theme and app overrides apply). */

package/dist/components/description-list/DescriptionList.d.ts

@@ -0,0 +1,59 @@
+import * as React from "react";
+import { type ControlSize } from "../../internal/states";
+export type DescriptionListLabels = {
+    /** Visible mark of an empty value (muted, hidden from assistive tech). */
+    empty: string;
+    /** What assistive tech reads for an empty value. */
+    emptyText: string;
+};
+/**
+ * `horizontal` — the label beside its value, stacking when the list is narrower than 24rem;
+ * `vertical` — the label above its value at any width.
+ */
+export type DescriptionListOrientation = "horizontal" | "vertical";
+export type DescriptionListRootProps = React.HTMLAttributes<HTMLDListElement> & {
+    /** Text and spacing tier. Default: the host tier (a Card, a Drawer form), else `m`. */
+    size?: ControlSize;
+    /** Default `horizontal`. */
+    orientation?: DescriptionListOrientation;
+    labels?: Partial<DescriptionListLabels>;
+    ref?: React.Ref<HTMLDListElement>;
+};
+/** A read-only list of «label — value» pairs: a `<dl>` that adapts to its own width. */
+declare function DescriptionListRoot({ size: sizeProp, orientation, labels, className, children, ...rest }: DescriptionListRootProps): import("react/jsx-runtime").JSX.Element;
+declare namespace DescriptionListRoot {
+    var displayName: string;
+}
+export type DescriptionListItemProps = Omit<React.HTMLAttributes<HTMLDivElement>, "children"> & {
+    /** The visible name of the value (`<dt>`). */
+    label: React.ReactNode;
+    /**
+     * The value (`<dd>`) and an optional `DescriptionList.ItemAction`. No value (`null`, `""`,
+     * `false`) shows `labels.empty`.
+     */
+    children?: React.ReactNode;
+    ref?: React.Ref<HTMLDivElement>;
+};
+/** One pair: a `<div>` holding the `<dt>` and the `<dd>`; the row action sits at the end of the value. */
+declare function DescriptionListItem({ label, children, className, ...rest }: DescriptionListItemProps): import("react/jsx-runtime").JSX.Element;
+declare namespace DescriptionListItem {
+    var displayName: string;
+}
+export type DescriptionListItemActionProps = Omit<React.ButtonHTMLAttributes<HTMLButtonElement>, "children"> & {
+    /** Accessible name and tooltip of the action («Копировать», «Позвонить»). */
+    label: string;
+    /** The icon (`<Icon name="…" />`). */
+    children: React.ReactNode;
+    ref?: React.Ref<HTMLButtonElement>;
+};
+/** A ghost icon Button one tier below the list, with its `label` as the tooltip. */
+declare function DescriptionListItemAction({ label, children, className, ...rest }: DescriptionListItemActionProps): import("react/jsx-runtime").JSX.Element;
+declare namespace DescriptionListItemAction {
+    var displayName: string;
+}
+export declare const DescriptionList: {
+    Root: typeof DescriptionListRoot;
+    Item: typeof DescriptionListItem;
+    ItemAction: typeof DescriptionListItemAction;
+};
+export {};