@box-kite/react 0.0.1 → 2.0.0

package/components/dataGrid/models/exportModel.d.ts

@@ -0,0 +1,51 @@
+import { DataGridExportOptions, ExportTable, Key } from '../contracts/dataGridContract';
+import { default as ColumnModel } from './columnModel';
+import { default as GridModel } from './gridModel';
+/**
+ * What an export writes, decided here and rendered by nobody: the columns, the rows the filters and the
+ * sort left, and the grouping as levels rather than as indentation. Both formats are handed this same
+ * table, which is why a CSV and a workbook of the same grid hold the same figures.
+ *
+ * It is a model rather than part of the writers so that it can be tested without producing a file, and so
+ * the writers stay in the lazy chunk — this is the only export code the grid's own bundle carries.
+ */
+export default class ExportModel<TRow> {
+    readonly grid: GridModel<TRow>;
+    constructor(grid: GridModel<TRow>);
+    /**
+     * The columns a file gets: the visible data columns, **plus** the ones grouping took off the screen.
+     * A grouped column is not hidden — its values moved to the group rows — and a spreadsheet with no
+     * Country column in it is not the grid that was exported.
+     */
+    columns(keys?: Key[]): ColumnModel<TRow>[];
+    /** A column's heading, which is its own `header` or the key it reads. */
+    header(column: ColumnModel<TRow>): string;
+    /** Its width in characters — the unit a spreadsheet sizes columns in, from the pixels the grid uses. */
+    width(column: ColumnModel<TRow>): number;
+    /**
+     * One row's value for one column: the column's own `exportValue` when it has one, else the raw field —
+     * either way through the edits, so a file carries what the grid is showing rather than what it was given.
+     */
+    private value;
+    /** A column's aggregate over a set of rows, or null where it has no aggregation. */
+    private aggregateOf;
+    /**
+     * The table. Group rows carry their own value in the column they group by and a total in every column
+     * that aggregates; a collapsed group exports collapsed, so the file opens looking like the screen.
+     */
+    table(options?: DataGridExportOptions): ExportTable;
+    /**
+     * A tree, as Excel's outline: a row's level is its depth and a shut row exports `collapsed`, with
+     * everything under it `hidden` — the same two flags a collapsed group writes, so the file opens
+     * looking like the screen. The rows are walked rather than the models: a shut row builds none of its
+     * children, and an export writes the whole tree.
+     */
+    private walkTree;
+    /**
+     * The grand totals, over the rows the filters left. The label goes in the leading column with nothing
+     * of its own to say — the same column it occupies on screen when that column is exported at all.
+     */
+    private footerRow;
+    /** The file's name, without an extension: what was asked for, else the grid's title, else `export`. */
+    fileName(options?: DataGridExportOptions): string;
+}

package/components/dataGrid/models/filterModel.d.ts

@@ -0,0 +1,22 @@
+import { ColumnFilters } from '../contracts/dataGridContract';
+import { default as GridModel } from './gridModel';
+/**
+ * Filtering concern: grid-level filter state + the derived flags the UI needs. Per-column
+ * filter config/value/parse helpers live on ColumnModel; the coupled mutations (page-reset,
+ * server-state events, filteredData) live on GridModel.
+ */
+export default class FilterModel<TRow> {
+    readonly grid: GridModel<TRow>;
+    constructor(grid: GridModel<TRow>);
+    get globalFilterValue(): string;
+    get columnFilters(): ColumnFilters<TRow>;
+    get hasActiveFilters(): boolean;
+    get filterStats(): {
+        filtered: number;
+        total: number;
+    };
+    /** Whether any visible column is filterable (controls the filter row's visibility). */
+    get hasFilterableColumns(): boolean;
+    setGlobalFilter: (value: string) => void;
+    clearAllFilters: () => void;
+}

package/components/dataGrid/models/gridModel.d.ts

@@ -0,0 +1,293 @@
+import { ComponentsAndVariants } from '../../../types';
+import { ColumnFilters, DataGridCsvOptions, DataGridProps, DataGridXlsxOptions, ExportConfig, FilterValue, Key, PaginationState, PinPositionInput, SortDirection } from '../contracts/dataGridContract';
+import { default as AggregationModel } from './aggregationModel';
+import { default as ColumnModel } from './columnModel';
+import { default as ColumnVisibilityModel } from './columnVisibilityModel';
+import { default as DataSourceModel } from './dataSourceModel';
+import { default as DetailRowModel } from './detailRowModel';
+import { default as EditModel } from './editModel';
+import { default as ExportModel } from './exportModel';
+import { default as FilterModel } from './filterModel';
+import { default as GroupRowModel } from './groupRowModel';
+import { default as PaginationModel } from './paginationModel';
+import { default as RowModel } from './rowModel';
+import { default as TreeModel } from './treeModel';
+import { default as ViewportModel } from './viewportModel';
+export { GROUPING_CELL_KEY, ROW_DETAIL_CELL_KEY, ROW_NUMBER_CELL_KEY, ROW_SELECTION_CELL_KEY } from './cellKeys';
+export declare const DEFAULT_ROW_NUMBER_COLUMN_WIDTH = 70;
+export default class GridModel<TRow> {
+    props: DataGridProps<TRow>;
+    constructor(props: DataGridProps<TRow>, onChange?: () => void);
+    private _version;
+    private readonly listeners;
+    /** Subscribe to changes; returns an unsubscribe function. */
+    subscribe: (listener: () => void) => (() => void);
+    /** Monotonic snapshot version — stable between changes, increments on notify(). */
+    getSnapshot: () => number;
+    /** Signal subscribers that state changed and a re-render is needed. */
+    notify: () => void;
+    /**
+     * Sync incoming props. Called during render by the framework adapter — clears
+     * the affected memos but does NOT notify (no extra render cycle; memos recompute
+     * lazily on next access).
+     */
+    setProps(props: DataGridProps<TRow>): void;
+    /**
+     * The rows the grid was handed. `data` is optional because `def.dataSource` replaces it, and every
+     * reader goes through here so that "no rows yet" is one empty array rather than a check at each site.
+     */
+    get data(): TRow[];
+    /**
+     * Every row the grid can act on right now. With a datasource that is the blocks it holds rather than
+     * the table behind them — a select-all cannot reach rows nobody has fetched, and saying otherwise is
+     * the one thing a server-backed grid must not do.
+     */
+    get loadedRows(): TRow[];
+    get componentName(): keyof ComponentsAndVariants;
+    private _identifier;
+    /**
+     * A unique prefix for the ids this grid wires ARIA with. Supplied by the adapter, because only
+     * the adapter can produce one that survives hydration — `useIdentifier` in React's case.
+     */
+    get identifier(): string;
+    setIdentifier(identifier: string): void;
+    /** The title's id: a grid is not named by the rows in it, so it is named by this. */
+    get titleId(): string;
+    get resizerStyle(): 'visible' | 'hover' | 'hidden';
+    get resizeMode(): 'smooth' | 'instant';
+    readonly sourceColumns: import('../../../utils/memo').Memo<ColumnModel<TRow>[]>;
+    readonly columns: import('../../../utils/memo').Memo<{
+        start: ColumnModel<TRow>[];
+        middle: ColumnModel<TRow>[];
+        end: ColumnModel<TRow>[];
+        flat: ColumnModel<TRow>[];
+        leafs: ColumnModel<TRow>[];
+        visibleLeafs: ColumnModel<TRow>[];
+        userVisibleLeafs: ColumnModel<TRow>[];
+        maxDeath: number;
+    }>;
+    readonly headerRows: import('../../../utils/memo').Memo<ColumnModel<TRow>[][]>;
+    readonly gridTemplateColumns: import('../../../utils/memo').Memo<string>;
+    private _globalFilterValue;
+    get globalFilterValue(): string;
+    private _columnFilters;
+    get columnFilters(): ColumnFilters<TRow>;
+    /** Which columns the global filter searches: the ones named, or every column of the caller's own. */
+    private readonly globalFilterColumns;
+    /**
+     * Whether one row survives the filters — all three of them, in the order they cost: the caller's own
+     * predicates, the global search box, then the column filters. A row rather than an array, because a
+     * tree is filtered a node at a time (a match keeps its ancestors) rather than in one pass.
+     */
+    rowMatchesFilters(row: TRow): boolean;
+    /** Whether anything is filtering at all — what says a filtering pass can be skipped outright. */
+    get hasRowFilters(): boolean;
+    private matchesGlobalFilter;
+    private matchesColumnFilters;
+    /**
+     * Check if a cell value matches a filter
+     */
+    private matchesFilter;
+    /**
+     * Get filtered data (applies external, global, then column filters)
+     */
+    get filteredData(): TRow[];
+    private fireServerStateChange;
+    /** Both pager callbacks: the one carrying a reason, and the `(page, pageSize)` pair it replaces. */
+    private firePaginationChange;
+    /**
+     * A query that changed underneath the pager sends it back to the first page. Returns where the page now
+     * is, which is what the server-state snapshot asks the server for.
+     */
+    private resetToFirstPage;
+    /**
+     * Set global filter value
+     */
+    setGlobalFilter: (value: string) => void;
+    /**
+     * Set a single column filter
+     */
+    setColumnFilter: (columnKey: Key, filter: FilterValue | undefined) => void;
+    /**
+     * Clear all column filters
+     */
+    clearColumnFilters: () => void;
+    /**
+     * Clear all filters (global + column)
+     */
+    clearAllFilters: () => void;
+    /**
+     * Get unique values for a column (used for multiselect filter options)
+     */
+    getColumnUniqueValues: (columnKey: Key) => (string | number | boolean | null)[];
+    /**
+     * Check if any filter is active
+     */
+    get hasActiveFilters(): boolean;
+    /**
+     * Get count of filtered rows vs total rows
+     */
+    get filterStats(): {
+        filtered: number;
+        total: number;
+    };
+    /** How many rows the query holds altogether: the server's count where there is one, else what is here. */
+    get totalRowCount(): number;
+    readonly rows: import('../../../utils/memo').Memo<(RowModel<TRow> | GroupRowModel<TRow>)[]>;
+    /**
+     * The columns the group row's label cell covers: the grouping cell itself and the data columns beside it in
+     * its own pin, stopping at the first one carrying an aggregate — past that each column draws a value of its
+     * own, and a number under the wrong heading is worse than a label with less room. With nothing aggregating
+     * the span is every one of them, which is what it was before aggregates existed.
+     */
+    readonly groupingSpan: import('../../../utils/memo').Memo<ColumnModel<TRow>[]>;
+    readonly flatRows: import('../../../utils/memo').Memo<(RowModel<TRow> | GroupRowModel<TRow> | DetailRowModel<TRow>)[]>;
+    get rowHeight(): number;
+    readonly sizes: import('../../../utils/memo').Memo<Record<string, string>>;
+    private _containerWidth;
+    get containerWidth(): number;
+    /**
+     * The DOM element that carries the column-sizing CSS variables (the grid container).
+     * Set by the React adapter. During a resize drag the adapter writes the width vars
+     * here directly — bypassing React re-renders — and only commits to state on release.
+     */
+    private _sizingElement;
+    get sizingElement(): HTMLElement | null;
+    setSizingElement: (el: HTMLElement | null) => void;
+    /**
+     * Which way the grid reads, resolved off the element the widths are written to. A model with no
+     * element yet — a server render, a headless host — reads as left to right, the initial value.
+     */
+    get isRtl(): boolean;
+    setContainerWidth: (width: number) => void;
+    readonly flexWidths: import('../../../utils/memo').Memo<Record<Key, number>>;
+    getFlexWidth(key: Key): number | undefined;
+    readonly DEFAULT_ROW_HEIGHT_PX = 48;
+    readonly MIN_COLUMN_WIDTH_PX = 48;
+    readonly DEFAULT_COLUMN_WIDTH_PX = 200;
+    expandedGroupRow: Set<Key>;
+    private _expandedDetailRows;
+    get expandedDetailRows(): Set<Key>;
+    /** The row whose panel a user action just opened, for the row itself to bring into view once. */
+    private _revealDetailKey;
+    /**
+     * Taken by the detail row on the render that puts it in the DOM, and only then: an `auto` panel's
+     * real height exists nowhere else, and the virtualization offsets carry an estimate for it.
+     */
+    takeDetailReveal(rowKey: Key): boolean;
+    toggleDetailRow: (rowKey: Key) => void;
+    private _page;
+    private _pageSize?;
+    get page(): number;
+    get pageSize(): number;
+    get pageSizeOptions(): number[] | undefined;
+    get isPaginated(): boolean;
+    get paginationState(): PaginationState | undefined;
+    changePage: (page: number) => void;
+    changePageSize: (size: number) => void;
+    readonly rowOffsets: import('../../../utils/memo').Memo<{
+        offsets: number[];
+        totalHeight: number;
+    }>;
+    /** Headless virtualization (windowing math; scrollTop is owned by the adapter). */
+    readonly viewport: ViewportModel<TRow>;
+    /** Backs the top-bar column-visibility menu. */
+    readonly columnVisibility: ColumnVisibilityModel<TRow>;
+    /** Filtering concern (grid-level state + derived flags). */
+    readonly filter: FilterModel<TRow>;
+    /** Pagination concern (navigation + row-range derivations). */
+    readonly pagination: PaginationModel<TRow>;
+    /** Aggregation concern (which columns aggregate, and the footer's grand totals). */
+    readonly aggregation: AggregationModel<TRow>;
+    /** Export concern (the columns, rows and levels both file formats are written from). */
+    readonly exporter: ExportModel<TRow>;
+    /** Server row model: the blocks ~def.dataSource~ has answered, and the ones still in flight. */
+    readonly source: DataSourceModel<TRow>;
+    /** Tree data: the shape `def.treeData` describes, and which of its rows are open. */
+    readonly tree: TreeModel<TRow>;
+    /** Cell editing: which cell is open, what a commit is judged by, and the values the grid has accepted. */
+    readonly edits: EditModel<TRow>;
+    /**
+     * Throw the fetched blocks away and ask for them again. The grid invalidates on its own whenever it
+     * changes the query; this is for the half it cannot see — a filter of the page's own, a row somebody
+     * saved, a tenant that changed underneath the closure ~getRows~ was written in.
+     */
+    refresh: () => void;
+    /**
+     * Which export buttons the top bar shows, and the options they press with. `export: true` resolves to
+     * one shared record rather than a fresh one, so the buttons' handlers keep their identity.
+     */
+    get exportConfig(): ExportConfig | undefined;
+    /**
+     * Download the grid as a CSV. Both writers are behind an `import()`, so the format is fetched on the
+     * first press and a grid nobody exports from carries neither.
+     */
+    exportCsv: (options?: DataGridCsvOptions) => Promise<void>;
+    /** Download the grid as an `.xlsx`, with its groups as Excel's own outline levels. */
+    exportXlsx: (options?: DataGridXlsxOptions) => Promise<void>;
+    /** Whether any user-facing column is currently visible (else the empty-columns state shows). */
+    get hasVisibleColumns(): boolean;
+    get isEmpty(): boolean;
+    /** Header select-all checkbox state. */
+    get allRowsSelected(): boolean;
+    get someRowsSelected(): boolean;
+    private _selectionAnnounced;
+    /**
+     * What the grid's live region says. Ticking a checkbox halfway down a virtualized grid changes nothing a
+     * screen reader would read, so the count is announced instead — and it stays empty until a selection has
+     * happened, since some readers announce a region that already holds text on mount.
+     */
+    get selectionAnnouncement(): string;
+    /** The columns currently grouped, resolved from groupColumns keys (backs the top-bar group chips). */
+    get groupedColumns(): ColumnModel<TRow>[];
+    selectedRows: Set<Key>;
+    get inlineStartEdge(): number;
+    get inlineEndEdge(): number;
+    readonly inlineStartEdgeVarName = "--inline-start-edge";
+    readonly rowHeightVarName = "--row-height";
+    readonly viewportWidthVarName = "--viewport-width";
+    private readonly _idMap;
+    private _autoId;
+    private readonly _idFactory;
+    getRowKey(row: TRow): Key;
+    setSortColumn: (columnKey: Key, sortDirection?: SortDirection) => void;
+    pinColumn: (uniqueKey: string, pin?: PinPositionInput) => void;
+    toggleGrouping: (columnKey: Key) => void;
+    unGroupAll: () => void;
+    /** Grouping changed, so every open path names a group that is not there and every block is stale. */
+    private collapseGroups;
+    /** Bumped by every expand and collapse, so the adapter's fetch effect asks for the level just opened. */
+    private _expansion;
+    get expansionVersion(): number;
+    /**
+     * Whether a group row is open. Explicit state wins: a group somebody has opened or shut is where they
+     * left it, and `def.groupDefaultExpanded` answers for every group nobody has touched. Client-side
+     * grouping only — with a datasource, a level that has never been fetched has no rows to open.
+     */
+    isGroupExpanded(groupRowKey: Key, depth: number): boolean;
+    /** Group rows shut by hand, which is what a `groupDefaultExpanded` grid needs to remember. */
+    private _collapsedGroupRow;
+    toggleGroupRow: (groupRowKey: Key, expanded?: boolean) => void;
+    /**
+     * A tree row opened or shut. The walk over the rows is a different walk — and where the tree is lazy the
+     * level just opened has not been asked for yet, which is what the bumped version tells the fetch effect.
+     */
+    treeExpansionChanged(): void;
+    toggleRowSelection: (rowKey: Key) => void;
+    /** `all` is the header checkbox rather than a count: a group covering every row is still not select-all. */
+    toggleRowsSelection: (rowKeys: Key[], all?: boolean) => void;
+    toggleSelectAllRows: () => void;
+    toggleColumnVisibility: (columnKey: Key) => void;
+    setWidth: (columnKey: Key, width: number) => void;
+    private _groupColumns?;
+    get groupColumns(): Set<Key>;
+    set groupColumns(value: Set<Key>);
+    private _hiddenColumns?;
+    get hiddenColumns(): Set<Key>;
+    set hiddenColumns(value: Set<Key>);
+    columnWidths: Map<Key, number>;
+    private _sortColumn?;
+    get sortColumn(): Key | undefined;
+    private _sortDirection?;
+    get sortDirection(): SortDirection | undefined;
+}

package/components/dataGrid/models/groupRowCellModel.d.ts

@@ -0,0 +1,34 @@
+import { default as AggregateCellModel } from './aggregateCellModel';
+import { default as ColumnModel } from './columnModel';
+import { default as GridModel } from './gridModel';
+import { default as GroupRowModel } from './groupRowModel';
+/**
+ * How a cell participates in a group row's layout: `grouping` is the expand/label cell spanning the
+ * grouped columns, `selection` the select-all cell, `aggregate` a column totalling the rows under the group,
+ * `spacer` a pinned or leading cell with its own value, and `hidden` a data column absorbed into the
+ * grouping cell's span.
+ */
+export type GroupRowCellKind = 'grouping' | 'selection' | 'aggregate' | 'spacer' | 'hidden';
+export default class GroupRowCellModel<TRow> {
+    readonly grid: GridModel<TRow>;
+    readonly row: GroupRowModel<TRow>;
+    readonly column: ColumnModel<TRow>;
+    constructor(grid: GridModel<TRow>, row: GroupRowModel<TRow>, column: ColumnModel<TRow>);
+    get value(): string | number | null;
+    get isExpanded(): boolean;
+    get isFirst(): boolean;
+    get isLast(): boolean;
+    get cellKind(): GroupRowCellKind;
+    /**
+     * The aggregate over the rows under this group, on the columns that have one. A server group brings its
+     * own total down with it, since the rows it is over were never in the browser to add up.
+     */
+    private readonly _aggregate;
+    get aggregate(): AggregateCellModel<TRow> | null;
+    get depthPadding(): number;
+    get gridColumnSpan(): number;
+    get widthVar(): string;
+    get isEndPinned(): boolean;
+    /** Grouping cell shows a right border only when the grouping column is left-pinned. */
+    get hasGroupingBorder(): boolean;
+}

package/components/dataGrid/models/groupRowModel.d.ts

@@ -0,0 +1,68 @@
+import { AggregateValue, Key } from '../contracts/dataGridContract';
+import { default as ColumnModel } from './columnModel';
+import { default as DetailRowModel } from './detailRowModel';
+import { default as GridModel } from './gridModel';
+import { default as GroupRowCellModel } from './groupRowCellModel';
+import { default as RowModel } from './rowModel';
+export default class GroupRowModel<TRow> {
+    readonly grid: GridModel<TRow>;
+    readonly groupColumn: ColumnModel<TRow>;
+    readonly rows: RowModel<TRow>[] | GroupRowModel<TRow>[];
+    readonly rowIndex: number;
+    constructor(grid: GridModel<TRow>, groupColumn: ColumnModel<TRow>, rows: RowModel<TRow>[] | GroupRowModel<TRow>[], rowIndex: number, groupValue: Key);
+    protected _groupValue: Key;
+    /**
+     * The value this group collects. A getter rather than a parameter property so a subclass can read it
+     * from somewhere else — a field would shadow the override outright, which is what `useDefineForClassFields`
+     * does to a base class's own properties.
+     */
+    get groupValue(): Key;
+    /** What the expand cell reads: the value, and how many rows are under it. */
+    get label(): string;
+    /** Whether the group's rows have arrived at all. Always, until a server answers a level — see `SourceGroupRowModel`. */
+    get placeholder(): boolean;
+    /** Whether the select-all checkbox is offered: a group can only select the rows the grid holds. */
+    get selectable(): boolean;
+    /**
+     * An aggregate the grid was handed rather than one it works out. Nothing server-side can be totalled in
+     * the browser — the rows are not here — so a server group row carries its own totals and this is where
+     * they come from; `undefined` means "compute it", which is every client-side group.
+     */
+    aggregateValue(_column: ColumnModel<TRow>): AggregateValue | undefined;
+    get key(): Key;
+    parentRow?: GroupRowModel<TRow>;
+    private readonly _cells;
+    get cells(): GroupRowCellModel<TRow>[];
+    /**
+     * The cells this row actually renders, each with the column it starts at. A `hidden` cell is a
+     * data column the grouping cell has absorbed into its span: no element, and nothing to navigate
+     * to — which is why a group row's cell positions and its `aria-colindex` values differ.
+     */
+    private readonly _renderedCells;
+    get renderedCells(): {
+        cell: GroupRowCellModel<TRow>;
+        columnIndex: number;
+    }[];
+    /** Fewer than the column count — the width the grid navigation sees for this row. */
+    get cellCount(): number;
+    /**
+     * Where a cell starts in column-index space. The cells the grouping cell spans are not rendered
+     * at all, so an ordinal here is short of its column by however many of them came before it.
+     */
+    columnOf(cell: number): number;
+    get selected(): boolean;
+    get indeterminate(): boolean;
+    get expanded(): boolean;
+    get depth(): number;
+    get count(): number;
+    get flatRows(): (RowModel<TRow> | GroupRowModel<TRow> | DetailRowModel<TRow>)[];
+    get allRows(): RowModel<TRow>[];
+    get groupingColumn(): ColumnModel<TRow>;
+    get groupingColumnGridColumn(): number;
+    /** Whether the label cell has swallowed this column, which is what leaves it with no cell of its own. */
+    spans(column: ColumnModel<TRow>): boolean;
+    readonly kind: "group";
+    toggleRow(): void;
+    /** Select/deselect every leaf row under this group. */
+    toggleSelectAll: () => void;
+}

package/components/dataGrid/models/headerCellModel.d.ts

@@ -0,0 +1,83 @@
+import { SortDirection } from '../contracts/dataGridContract';
+import { default as ColumnModel } from './columnModel';
+/** All derived state for rendering a column's header cell and its context menu. */
+export default class HeaderCellModel<TRow> {
+    readonly column: ColumnModel<TRow>;
+    constructor(column: ColumnModel<TRow>);
+    private get grid();
+    /** Header label. `null` for the row-number and selection cells (rendered specially). */
+    get label(): string | number | null;
+    /**
+     * A name for a header that draws nothing. The row-number and row-detail columns are blank on
+     * screen by design, and a blank column header leaves every cell under it unlabelled — which is
+     * the one thing a screen reader relies on when it reads a cell out.
+     */
+    get hiddenLabel(): string | undefined;
+    get isSortable(): boolean;
+    get isSorted(): boolean;
+    get sortDirection(): SortDirection | undefined;
+    get showResizer(): boolean;
+    get showContextMenu(): boolean;
+    /** Grid column span: a leaf occupies one column, a group header spans its leaf count. */
+    get gridColumn(): number;
+    /** 1-based `aria-colindex`: the first column this header covers. */
+    get columnIndex(): number;
+    /** `aria-colspan`, left off when the header covers a single column. */
+    get columnSpan(): number | undefined;
+    /** `aria-rowspan`: a leaf declared above the deepest level reaches down to the bottom row. */
+    get rowSpan(): number | undefined;
+    /**
+     * `aria-sort`. A sortable column that is not the sorted one still carries `none`: that is what
+     * tells a screen reader the column *can* be sorted, and leaving it off says the opposite.
+     */
+    get ariaSort(): 'ascending' | 'descending' | 'none' | undefined;
+    /** What the resizer names itself. A separator carries no text, so it has nothing else to go on. */
+    get resizerLabel(): string;
+    /** `aria-valuenow`: how wide the column is right now, in px. */
+    get width(): number;
+    /** `aria-valuemin`: every leaf the header covers at the narrowest the grid allows. */
+    get minWidth(): number;
+    /**
+     * `aria-valuemax`. There is no width the grid refuses — a drag can take a column past the
+     * viewport and scroll to it — so the ceiling the keyboard offers is the grid's own width, raised
+     * to whatever a drag has already made it so that `aria-valuenow` stays inside the range.
+     */
+    get maxWidth(): number;
+    /** Room for the sort icon, which sits where the reading ends — so an end-aligned header needs it in front. */
+    get paddingStart(): number | undefined;
+    get paddingEnd(): number | undefined;
+    /** Variant flags for the header cell. */
+    get variant(): {
+        isPinned: boolean;
+        isFirstStartPinned: boolean;
+        isLastStartPinned: boolean;
+        isFirstEndPinned: boolean;
+        isLastEndPinned: boolean;
+        isSortable: boolean;
+        isRowNumber: boolean;
+        isFirstLeaf: boolean;
+        isLastLeaf: boolean;
+    };
+    /** Variant flags for the context-menu trigger button. */
+    get contextMenuButtonVariant(): {
+        isPinned: boolean;
+        isFirstStartPinned: boolean;
+        isLastStartPinned: boolean;
+        isFirstEndPinned: boolean;
+        isLastEndPinned: boolean;
+        isSortable: boolean;
+        isRowNumber: boolean;
+    };
+    private get sections();
+    get canSortAsc(): boolean;
+    get canSortDesc(): boolean;
+    get canClearSort(): boolean;
+    get canPinStart(): boolean;
+    get canPinEnd(): boolean;
+    get canUnpin(): boolean;
+    get canGroupBy(): boolean;
+    get canUnGroupAll(): boolean;
+    get hasSortSection(): boolean;
+    get hasPinSection(): boolean;
+    get hasGroupSection(): boolean;
+}

package/components/dataGrid/models/paginationModel.d.ts

@@ -0,0 +1,32 @@
+import { PaginationState } from '../contracts/dataGridContract';
+import { default as GridModel } from './gridModel';
+/**
+ * Pagination concern: navigation state + derived row range for the bottom bar / pager.
+ * The coupled mutations (page-reset on filter/sort, server-state events) live on GridModel;
+ * this model owns the navigation behavior and derivations the UI needs.
+ */
+export default class PaginationModel<TRow> {
+    readonly grid: GridModel<TRow>;
+    constructor(grid: GridModel<TRow>);
+    get isPaginated(): boolean;
+    get state(): PaginationState | undefined;
+    get pageSizeOptions(): number[] | undefined;
+    get page(): number;
+    get pageSize(): number;
+    get totalPages(): number;
+    get totalItems(): number;
+    get canGoPrev(): boolean;
+    get canGoNext(): boolean;
+    /** 1-based index of the first row on the current page. */
+    get startItem(): number;
+    /** 1-based index of the last row on the current page (clamped to totalItems). */
+    get endItem(): number;
+    changePage: (page: number) => void;
+    changePageSize: (size: number) => void;
+    firstPage: () => void;
+    prevPage: () => void;
+    nextPage: () => void;
+    lastPage: () => void;
+    /** Parse a raw page-jump input and navigate (clamped to [1, totalPages]); ignores non-numeric input. */
+    jumpToPage: (raw: string) => void;
+}

package/components/dataGrid/models/rowModel.d.ts

@@ -0,0 +1,46 @@
+import { Key } from '../contracts/dataGridContract';
+import { default as CellModel } from './cellModel';
+import { default as DetailRowModel } from './detailRowModel';
+import { default as GridModel } from './gridModel';
+import { default as GroupRowModel } from './groupRowModel';
+export default class RowModel<TRow> {
+    readonly grid: GridModel<TRow>;
+    readonly rowIndex: number;
+    constructor(grid: GridModel<TRow>, data: TRow, rowIndex: number);
+    protected _data: TRow;
+    /**
+     * The row's values. A getter rather than a parameter property so a subclass can read them from
+     * somewhere else — `SourceRowModel` reads them out of the block cache, which is what lets a block
+     * arriving change what a row shows without a single model being rebuilt.
+     */
+    get data(): TRow;
+    private _key?;
+    /**
+     * Resolved lazily: getRowKey() can call crypto.randomUUID(), so building a model for every
+     * row would generate a key for thousands of off-screen rows. Only rows that actually render
+     * (or are otherwise inspected) pay the cost. getRowKey itself is idempotent per row.
+     */
+    get key(): Key;
+    parentRow?: GroupRowModel<TRow>;
+    readonly count = 1;
+    readonly kind: "row";
+    /** Whether this is a row the server has not sent yet — see `SourceRowModel`, which answers it live. */
+    get placeholder(): boolean;
+    /** Whether clicking the row toggles its detail panel. */
+    get expandOnRowClick(): boolean;
+    toggleDetail: () => void;
+    private readonly _cells;
+    get cells(): CellModel<TRow>[];
+    /** One cell per visible column — the width the grid navigation sees for this row. */
+    get cellCount(): number;
+    /** Where a cell starts in column-index space: one cell per column, so its own ordinal. */
+    columnOf(cell: number): number;
+    get selected(): boolean;
+    /** Half-selected, which only a tree row with the cascade on can be. */
+    get indeterminate(): boolean;
+    /** Select or deselect this row. A tree row under `selection: 'cascade'` takes its subtree with it. */
+    toggleSelection: () => void;
+    get expanded(): boolean;
+    get flatRows(): (RowModel<TRow> | DetailRowModel<TRow>)[];
+    get allRows(): this;
+}