@nsaa/data-table 0.0.0-stage → 0.1.0-alpha.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -0,0 +1,1221 @@
1
+
2
+ import { Cell, Column, ColumnFiltersState, Header, ReactTable, Row, RowData, SortingState, Table, TableFeatures } from "@tanstack/react-table";
3
+ import { CSSProperties, HTMLAttributes, JSX, ReactElement, ReactNode, Ref, RefObject } from "react";
4
+ import { ScrollArea } from "@base-ui/react/scroll-area";
5
+ import { CollisionDetection, DndContextProps, DragCancelEvent, DragEndEvent, DragMoveEvent, DragOverEvent, DragStartEvent, Modifier, UniqueIdentifier } from "@dnd-kit/core";
6
+ import { SortingStrategy } from "@dnd-kit/sortable";
7
+ import { VirtualizerOptions } from "@tanstack/react-virtual";
8
+ export interface DataGridI18nLabels {
9
+ sortAscending: string;
10
+ sortDescending: string;
11
+ pinColumnStart: string;
12
+ pinColumnEnd: string;
13
+ moveColumnStart: string;
14
+ moveColumnEnd: string;
15
+ columnsMenu: string;
16
+ unpinColumn: (title: string) => string;
17
+ toggleColumns: string;
18
+ rowCreate: string;
19
+ pinRow: string;
20
+ unpinRow: string;
21
+ selectRow: string;
22
+ selectAll: string;
23
+ expandRow: string;
24
+ collapseRow: string;
25
+ dragToReorder: string;
26
+ dragToReorderRow: string;
27
+ reorderingUnavailable: string;
28
+ loading: string;
29
+ empty: string;
30
+ allRowsLoaded: string;
31
+ rowsPerPage: string;
32
+ paginationInfo: (info: {
33
+ from: number;
34
+ to: number;
35
+ count: number;
36
+ }) => string;
37
+ previousPage: string;
38
+ nextPage: string;
39
+ goToPage: (page: number) => string;
40
+ paginationEllipsis: string;
41
+ filterSelectedCount: (count: number) => string;
42
+ filterNoResults: string;
43
+ filterClear: string;
44
+ }
45
+ export interface DataGridI18nConfig {
46
+ labels: DataGridI18nLabels;
47
+ }
48
+ export type DataGridI18nOverrides = {
49
+ labels?: Partial<DataGridI18nLabels>;
50
+ };
51
+ /**
52
+ * A shallow merge per section, deliberately: a deep merge would leak a
53
+ * default back into a function-valued label the consumer replaced. With no
54
+ * overrides the frozen default is returned as-is, so the merge is free to
55
+ * run on every render without producing a new identity.
56
+ */
57
+ export declare function mergeDataGridI18n(overrides?: DataGridI18nOverrides): DataGridI18nConfig;
58
+ /**
59
+ * Per-column extras the grid reads off `columnDef.meta`.
60
+ *
61
+ * TanStack v9 resolves this through the `columnMeta` slot on the feature
62
+ * bundle below instead of a global `declare module` augmentation, so
63
+ * installing the data grid no longer widens `ColumnMeta` for every other
64
+ * table in the consuming app.
65
+ */
66
+ /**
67
+ * Per-column write contract for the spreadsheet operations (paste, fill,
68
+ * clear, cut). Presence marks the column writable; every write still flows
69
+ * through `onCellsChange`, so the consumer's state stays the only data owner.
70
+ */
71
+ export interface DataGridColumnCellEdit<TData> {
72
+ /**
73
+ * Set false for a column that formats clipboard output but is never
74
+ * written; a function decides per row, so locked rows (archived, another
75
+ * user's, a totals row) reject like any read-only cell. Defaults to true.
76
+ */
77
+ editable?: boolean | ((row: TData) => boolean);
78
+ /**
79
+ * Clipboard or fill string to typed value. Return undefined to reject the
80
+ * cell into `rejected`. Without it the raw string passes through unchanged -
81
+ * a deliberate non-coercion, so a number column receives strings only when
82
+ * the consumer chose not to parse.
83
+ */
84
+ parse?: (raw: string, row: TData) => unknown;
85
+ /** Typed value to clipboard string. Fallback: String(value ?? ""). */
86
+ format?: (value: unknown, row: TData) => string;
87
+ /** Value dispatched by Delete/Backspace and cut. Defaults to null. */
88
+ clearValue?: unknown;
89
+ /**
90
+ * Opt into the grid's built-in free-text editor: an overlay input (or
91
+ * auto-growing textarea) flush over the focused cell, opened by Enter, F2,
92
+ * typing, or double-click, committing through `onCellsChange` as source
93
+ * `"edit"` with `parse` applied. Columns without it stay consumer-edited
94
+ * via `onCellEditRequest` or their own cell renderers.
95
+ */
96
+ control?: "text" | "textarea";
97
+ }
98
+ export interface DataGridColumnMeta<TData> {
99
+ headerTitle?: string;
100
+ headerClassName?: string;
101
+ cellClassName?: string;
102
+ skeleton?: ReactNode;
103
+ expandedContent?: (row: TData) => ReactNode;
104
+ autoSize?: boolean;
105
+ /** Header spans this many leaves: this one and its next adjacent siblings. */
106
+ headerColSpan?: number;
107
+ cellEdit?: DataGridColumnCellEdit<TData>;
108
+ /**
109
+ * Under `columnsResizable`, this column absorbs the free space the filler
110
+ * strip would otherwise hold, so the grid always reads full-width and the
111
+ * built-in editor covers the whole cell. One column per grid; while free
112
+ * space remains, manual resizing of this column is visually a no-op (the
113
+ * absorbed space compensates), the flex-column trade-off.
114
+ */
115
+ fillWidth?: boolean;
116
+ }
117
+ /**
118
+ * The batteries-included feature bundle every ReUI data-grid example builds
119
+ * on. v9 requires each table to declare its features up front, and the grid's
120
+ * render path needs the ones registered here: `columnVisibilityFeature` alone
121
+ * gates `row.getVisibleCells()`, so even a grid that never hides a column
122
+ * needs it to render at all.
123
+ *
124
+ * Pass it straight through for the full grid:
125
+ *
126
+ * ```tsx
127
+ * const table = useTable({ features: dataGridFeatures, columns, data })
128
+ * ```
129
+ *
130
+ * Extend it when a grid needs more, keeping each prerequisite feature ahead of
131
+ * the slot that depends on it:
132
+ *
133
+ * ```tsx
134
+ * const features = tableFeatures({
135
+ * ...dataGridFeatures,
136
+ * columnGroupingFeature,
137
+ * groupedRowModel: createGroupedRowModel(),
138
+ * })
139
+ * ```
140
+ *
141
+ * Or drop it entirely and hand `<DataGrid>` a leaner table - the components
142
+ * accept any bundle, so you keep full ownership of the TanStack core.
143
+ */
144
+ export declare const dataGridFeatures: {
145
+ columnVisibilityFeature: import("@tanstack/react-table").TableFeature;
146
+ columnOrderingFeature: import("@tanstack/react-table").TableFeature;
147
+ columnPinningFeature: import("@tanstack/react-table").TableFeature;
148
+ columnSizingFeature: import("@tanstack/react-table").TableFeature;
149
+ columnResizingFeature: import("@tanstack/react-table").TableFeature;
150
+ columnFilteringFeature: import("@tanstack/react-table").TableFeature;
151
+ columnFacetingFeature: import("@tanstack/react-table").TableFeature;
152
+ globalFilteringFeature: import("@tanstack/react-table").TableFeature;
153
+ rowSortingFeature: import("@tanstack/react-table").TableFeature;
154
+ rowPaginationFeature: import("@tanstack/react-table").TableFeature;
155
+ rowSelectionFeature: import("@tanstack/react-table").TableFeature;
156
+ rowExpandingFeature: import("@tanstack/react-table").TableFeature;
157
+ rowPinningFeature: import("@tanstack/react-table").TableFeature;
158
+ cellSelectionFeature: import("@tanstack/react-table").TableFeature;
159
+ sortedRowModel: (table: Table<any, any>) => () => import("@tanstack/react-table").RowModel<any, any>;
160
+ filteredRowModel: (table: Table<any, any>) => () => import("@tanstack/react-table").RowModel<any, any>;
161
+ paginatedRowModel: (table: Table<any, any>) => () => import("@tanstack/react-table").RowModel<any, any>;
162
+ expandedRowModel: (table: Table<any, any>) => () => import("@tanstack/react-table").RowModel<any, any>;
163
+ facetedRowModel: (table: Table<any, any>, columnId: string) => () => import("@tanstack/react-table").RowModel<any, any>;
164
+ facetedUniqueValues: (table: Table<TableFeatures, any>, columnId: string) => () => Map<any, number>;
165
+ sortFns: {
166
+ alphanumeric: import("@tanstack/react-table").CreatedSortFn<any, any>;
167
+ alphanumericCaseSensitive: import("@tanstack/react-table").CreatedSortFn<any, any>;
168
+ basic: import("@tanstack/react-table").CreatedSortFn<any, any>;
169
+ datetime: import("@tanstack/react-table").CreatedSortFn<any, any>;
170
+ text: import("@tanstack/react-table").CreatedSortFn<any, any>;
171
+ textCaseSensitive: import("@tanstack/react-table").CreatedSortFn<any, any>;
172
+ };
173
+ columnMeta: DataGridColumnMeta<any>;
174
+ };
175
+ /** The feature set `dataGridFeatures` registers. */
176
+ export type DataGridFeatures = typeof dataGridFeatures;
177
+ /**
178
+ * The grid's internal view of the table.
179
+ *
180
+ * `TFeatures` is invariant in v9 and an unresolved generic one collapses to a
181
+ * union that includes the bare core arm, so no generic signature can call
182
+ * `getVisibleCells()`, `getStartVisibleLeafColumns()` and friends. The public
183
+ * components stay generic so consumers can pass any bundle they like; the
184
+ * table is widened to this concrete type exactly once, on the way into
185
+ * context, and every internal component reads it from there.
186
+ */
187
+ export type DataGridTableInstance<TData extends object> = ReactTable<DataGridFeatures, TData>;
188
+ /** Label for headers / column visibility: `meta.headerTitle`, string `columnDef.header`, or `column.id`. */
189
+ export declare function getColumnHeaderLabel<TData extends RowData, TValue>(column: Column<DataGridFeatures, TData, TValue>): string;
190
+ /**
191
+ * meta.headerColSpan: the sibling leaves each owning leaf's header covers,
192
+ * by owner id. Each must render right after the last in its pin family, or
193
+ * the span ends there; the header rows, the resize indicator and the move
194
+ * and drop targets all read spans from here.
195
+ */
196
+ export declare function getDataGridHeaderSpans<TData extends object>(table: DataGridTableInstance<TData>): Map<string, Column<{
197
+ columnVisibilityFeature: import("@tanstack/react-table").TableFeature;
198
+ columnOrderingFeature: import("@tanstack/react-table").TableFeature;
199
+ columnPinningFeature: import("@tanstack/react-table").TableFeature;
200
+ columnSizingFeature: import("@tanstack/react-table").TableFeature;
201
+ columnResizingFeature: import("@tanstack/react-table").TableFeature;
202
+ columnFilteringFeature: import("@tanstack/react-table").TableFeature;
203
+ columnFacetingFeature: import("@tanstack/react-table").TableFeature;
204
+ globalFilteringFeature: import("@tanstack/react-table").TableFeature;
205
+ rowSortingFeature: import("@tanstack/react-table").TableFeature;
206
+ rowPaginationFeature: import("@tanstack/react-table").TableFeature;
207
+ rowSelectionFeature: import("@tanstack/react-table").TableFeature;
208
+ rowExpandingFeature: import("@tanstack/react-table").TableFeature;
209
+ rowPinningFeature: import("@tanstack/react-table").TableFeature;
210
+ cellSelectionFeature: import("@tanstack/react-table").TableFeature;
211
+ sortedRowModel: (table: Table<any, any>) => () => import("@tanstack/react-table").RowModel<any, any>;
212
+ filteredRowModel: (table: Table<any, any>) => () => import("@tanstack/react-table").RowModel<any, any>;
213
+ paginatedRowModel: (table: Table<any, any>) => () => import("@tanstack/react-table").RowModel<any, any>;
214
+ expandedRowModel: (table: Table<any, any>) => () => import("@tanstack/react-table").RowModel<any, any>;
215
+ facetedRowModel: (table: Table<any, any>, columnId: string) => () => import("@tanstack/react-table").RowModel<any, any>;
216
+ facetedUniqueValues: (table: Table<TableFeatures, any>, columnId: string) => () => Map<any, number>;
217
+ sortFns: {
218
+ alphanumeric: import("@tanstack/react-table").CreatedSortFn<any, any>;
219
+ alphanumericCaseSensitive: import("@tanstack/react-table").CreatedSortFn<any, any>;
220
+ basic: import("@tanstack/react-table").CreatedSortFn<any, any>;
221
+ datetime: import("@tanstack/react-table").CreatedSortFn<any, any>;
222
+ text: import("@tanstack/react-table").CreatedSortFn<any, any>;
223
+ textCaseSensitive: import("@tanstack/react-table").CreatedSortFn<any, any>;
224
+ };
225
+ columnMeta: DataGridColumnMeta<any>;
226
+ }, TData, unknown>[]>;
227
+ /**
228
+ * The td contract for spreadsheet selection. Call inside a
229
+ * `Subscribe source={table.atoms.cellSelection}` render only: the reads are
230
+ * builder calls whose state dependency React Compiler cannot see, exactly the
231
+ * trap the row-selection checkbox documents.
232
+ */
233
+ export declare function getDataGridCellSelectionCellAttrs<TData extends object>(cell: Cell<DataGridFeatures, TData, unknown>): {
234
+ "aria-selected": boolean;
235
+ "data-col-id": string;
236
+ "data-cell-selected": true | undefined;
237
+ "data-cell-focused": true | undefined;
238
+ "data-cell-edge-top": true | undefined;
239
+ "data-cell-edge-right": true | undefined;
240
+ "data-cell-edge-bottom": true | undefined;
241
+ "data-cell-edge-left": true | undefined;
242
+ };
243
+ /**
244
+ * Selection chrome for a body td, activated by the data attributes above plus
245
+ * the imperatively toggled `data-cell-fill-target` (fill-drag preview, written
246
+ * outside React like the resize indicator). A ::before overlay, not outline
247
+ * or box-shadow: an outline ring hugs the cell box and cannot line up with
248
+ * the gridlines the perimeter paints on, and the pinned-column dividers
249
+ * already own the cell's shadow slot (tailwind-merge would collapse a second
250
+ * shadow-[...] into it).
251
+ */
252
+ export declare const dataGridCellSelectionCellClasses: string;
253
+ export type DataGridApiFetchParams = {
254
+ pageIndex: number;
255
+ pageSize: number;
256
+ sorting?: SortingState;
257
+ filters?: ColumnFiltersState;
258
+ searchQuery?: string;
259
+ };
260
+ export type DataGridApiResponse<T> = {
261
+ data: T[];
262
+ empty: boolean;
263
+ pagination: {
264
+ total: number;
265
+ page: number;
266
+ };
267
+ };
268
+ /**
269
+ * Everything `<DataGrid>` accepts except the two props the provider consumes
270
+ * itself. Kept feature-agnostic: layout and messaging never depend on which
271
+ * TanStack features the consumer registered.
272
+ */
273
+ export type DataGridLayoutProps<TData extends object> = Omit<DataGridProps<TableFeatures, TData>, "table" | "children">;
274
+ export interface DataGridContextProps<TData extends object> {
275
+ props: DataGridLayoutProps<TData>;
276
+ table: DataGridTableInstance<TData>;
277
+ recordCount: number;
278
+ isLoading: boolean;
279
+ /** Stable per-grid prefix for the DOM ids ARIA relations point at. */
280
+ gridId: string;
281
+ /** The merged label set; components read `i18n.labels.<key>`. */
282
+ i18n: DataGridI18nConfig;
283
+ /**
284
+ * Internal coordinator for `meta.autoSize` columns. Lives at the core level
285
+ * so every table variant and viewport instance shares one application state.
286
+ */
287
+ autoSize?: DataGridAutoSizeController;
288
+ }
289
+ /**
290
+ * Row and column ids are consumer strings; DOM ids cannot carry spaces or
291
+ * quotes. One shared sanitizer so `aria-activedescendant` writers and the id
292
+ * renderers always agree on the same encoding.
293
+ */
294
+ export declare function toDataGridDomId(value: string): string;
295
+ export type DataGridAutoSizeController = {
296
+ /**
297
+ * Feeds the controller one viewport measurement: the SIGNED free space
298
+ * between the scroll container and the table, negative while the table
299
+ * overflows. The first sight of a `meta.autoSize` column absorbs the
300
+ * free space into its width; after that, every measurement REFLOWS the
301
+ * same growth - a wider window widens the column, a narrower one gives
302
+ * the space back down to the column's `minSize` (or its starting width
303
+ * when none is set) - so the grid tracks its container live. Commits
304
+ * are coalesced for performance: sub-pixel deltas are dropped, a
305
+ * streaming resize gets one leading commit plus one trailing commit at
306
+ * settle, and a width the user dragged is never touched. Safe to call
307
+ * from every viewport measurement; returns true when a sizing update
308
+ * was dispatched.
309
+ */
310
+ apply: (freeSpace: number) => boolean;
311
+ /**
312
+ * The width the armed column would reflow to at this free space, and the
313
+ * width it holds now, without committing anything. Null when no column is
314
+ * armed. A live (onChange) resize previews with it on every move.
315
+ */
316
+ preview: (freeSpace: number) => {
317
+ columnId: string;
318
+ current: number;
319
+ size: number;
320
+ } | null;
321
+ /**
322
+ * Records a width the caller commits for the armed column, so the next
323
+ * measurement reads it as this coordinator's own write and keeps
324
+ * reflowing, rather than as a user drag that stands it down.
325
+ */
326
+ adopt: (columnId: string, size: number) => void;
327
+ };
328
+ export type DataGridRequestParams = {
329
+ pageIndex: number;
330
+ pageSize: number;
331
+ sorting?: SortingState;
332
+ columnFilters?: ColumnFiltersState;
333
+ };
334
+ /** Which spreadsheet operation produced a cell change batch. */
335
+ export type DataGridCellsChangeSource = "paste" | "cut" | "clear" | "fill" | "edit";
336
+ export interface DataGridCellChange<TData> {
337
+ rowId: string;
338
+ columnId: string;
339
+ /** The consumer's row object, so immutable write-back needs no second lookup. */
340
+ row: TData;
341
+ /** Accessor value at dispatch time; enables consumer-side undo stacks. */
342
+ previousValue: unknown;
343
+ /** Typed value produced by `meta.cellEdit.parse`, or `clearValue` for clear/cut. */
344
+ value: unknown;
345
+ }
346
+ /** What onCellsCopy receives after the grid writes the clipboard. */
347
+ export interface DataGridCopyDetails {
348
+ /** The TSV text that reached the clipboard. */
349
+ text: string;
350
+ /** The same content as a row-major grid of formatted fields. */
351
+ grid: string[][];
352
+ /** True when the write came from a cut, which clears the region next. */
353
+ cut: boolean;
354
+ }
355
+ /** One resolved positive region, in pre-paginated display indexes. */
356
+ export interface DataGridCellSelectionBound {
357
+ minRowIndex: number;
358
+ maxRowIndex: number;
359
+ minColumnIndex: number;
360
+ maxColumnIndex: number;
361
+ }
362
+ /** What onCellSelectionChange receives, resolved from the live selection. */
363
+ export interface DataGridCellSelectionSnapshot {
364
+ /** The virtually focused cell, the active range's anchor. Null when clear. */
365
+ focused: {
366
+ rowId: string;
367
+ columnId: string;
368
+ } | null;
369
+ /** Every positive region, geometric order. */
370
+ bounds: DataGridCellSelectionBound[];
371
+ /** The most recent region, the one copy and paste act on. */
372
+ activeBound: DataGridCellSelectionBound | null;
373
+ /**
374
+ * Cells of the selection the view can show - the count that matches the
375
+ * painted range and what a batch will touch.
376
+ */
377
+ visibleCellCount: number;
378
+ }
379
+ export interface DataGridCellRejection {
380
+ rowId: string;
381
+ columnId: string;
382
+ raw: string;
383
+ reason: "readonly" | "invalid";
384
+ }
385
+ /**
386
+ * Lifecycle of a row for the optional CRUD indications: "new" and "dirty"
387
+ * tint the row, "deleted" mutes and strikes it. Purely presentational - the
388
+ * consumer's state stays the only owner of what the statuses mean.
389
+ */
390
+ export type DataGridRowStatus = "new" | "dirty" | "deleted";
391
+ /**
392
+ * Lifecycle of a cell for the optional CRUD indications: a corner mark in
393
+ * the amber tone for "dirty", the destructive tone for "invalid".
394
+ */
395
+ export type DataGridCellStatus = "dirty" | "invalid";
396
+ /**
397
+ * Asks the consumer to open its editor for the focused cell: Enter or F2, or
398
+ * a typed printable character (then `initialText` carries it, the
399
+ * Notion/Airtable type-to-replace flow). Dispatched only for cells whose
400
+ * column is writable via `meta.cellEdit`.
401
+ */
402
+ export interface DataGridCellEditRequest<TData> {
403
+ rowId: string;
404
+ columnId: string;
405
+ row: TData;
406
+ previousValue: unknown;
407
+ /** The typed character that started the edit; absent for Enter and F2. */
408
+ initialText?: string;
409
+ }
410
+ /**
411
+ * One batch per operation, however many cells it spans: a 10k-cell paste is
412
+ * one callback, one consumer setState, one table rebuild. The grid never
413
+ * writes data itself.
414
+ */
415
+ export interface DataGridCellsChangeDetails<TData> {
416
+ source: DataGridCellsChangeSource;
417
+ changes: DataGridCellChange<TData>[];
418
+ rejected: DataGridCellRejection[];
419
+ }
420
+ export interface DataGridProps<TFeatures extends TableFeatures, TData extends object> {
421
+ className?: string;
422
+ table?: Table<TFeatures, TData>;
423
+ recordCount: number;
424
+ children?: ReactNode;
425
+ onRowClick?: (row: TData) => void;
426
+ /**
427
+ * Receives every spreadsheet write batch (paste, cut, clear, fill, edit).
428
+ * Served through the props getter like `onRowClick`, so an inline identity
429
+ * never republishes the context. Absent: copy still works, writes no-op.
430
+ */
431
+ onCellsChange?: (details: DataGridCellsChangeDetails<TData>) => void;
432
+ /**
433
+ * Opens the consumer's editor from the keyboard: Enter, F2, or typing on
434
+ * the focused cell. Absent: Enter keeps moving down, typing does nothing.
435
+ */
436
+ onCellEditRequest?: (request: DataGridCellEditRequest<TData>) => void;
437
+ /**
438
+ * Fires on every cell-selection change (focus moves, ranges grow or
439
+ * clear) with a resolved snapshot, so a selection count, formula bar or
440
+ * context panel needs no reach into TanStack internals.
441
+ */
442
+ onCellSelectionChange?: (snapshot: DataGridCellSelectionSnapshot) => void;
443
+ /**
444
+ * Fires after the grid writes the clipboard (Cmd/Ctrl+C or X, or the
445
+ * native copy and cut events), e.g. to confirm with a toast.
446
+ */
447
+ onCellsCopy?: (details: DataGridCopyDetails) => void;
448
+ /**
449
+ * Renders an "Add row" affordance as the table body's last row; clicking
450
+ * it is the consumer's cue to start creating a row. Absent: no row.
451
+ */
452
+ onRowCreate?: () => void;
453
+ /** Label of the onRowCreate affordance. Defaults to "Add row". */
454
+ rowCreateLabel?: ReactNode;
455
+ /**
456
+ * Rendered inside the table body after the data rows: the slot a DRAFT
457
+ * row lives in while it is being created, before it joins `data` and the
458
+ * pagination math. Supply a `<tr>` of cells; the colgroup sizes them.
459
+ */
460
+ appendRow?: ReactNode;
461
+ /**
462
+ * Optional CRUD indication per row. Return undefined for no indication;
463
+ * omit the prop entirely to render none anywhere.
464
+ */
465
+ getRowStatus?: (row: TData) => DataGridRowStatus | undefined;
466
+ /**
467
+ * Optional CRUD indication per cell: the classic corner mark on cells the
468
+ * consumer tracks as edited or invalid.
469
+ */
470
+ getCellStatus?: (row: TData, columnId: string) => DataGridCellStatus | undefined;
471
+ isLoading?: boolean;
472
+ /**
473
+ * Overrides for every built-in string: menu items, aria labels,
474
+ * pagination copy, state messages. Merged over the defaults; a more
475
+ * specific component prop (`rowCreateLabel`, `loadingMessage`, the
476
+ * pagination label props) still wins over its `i18n` counterpart.
477
+ */
478
+ i18n?: DataGridI18nOverrides;
479
+ loadingMode?: "skeleton" | "spinner";
480
+ loadingMessage?: ReactNode | string;
481
+ fetchingMoreMessage?: ReactNode | string;
482
+ allRowsLoadedMessage?: ReactNode | string;
483
+ emptyMessage?: ReactNode | string;
484
+ tableLayout?: {
485
+ dense?: boolean;
486
+ cellBorder?: boolean;
487
+ rowBorder?: boolean;
488
+ rowRounded?: boolean;
489
+ stripped?: boolean;
490
+ headerBackground?: boolean;
491
+ footerBackground?: boolean;
492
+ headerBorder?: boolean;
493
+ headerSticky?: boolean;
494
+ width?: "auto" | "fixed";
495
+ columnsVisibility?: boolean;
496
+ columnsResizable?: boolean;
497
+ columnsResizeMode?: "onChange" | "onEnd";
498
+ columnsPinnable?: boolean;
499
+ columnsMovable?: boolean;
500
+ columnsDraggable?: boolean;
501
+ rowsDraggable?: boolean;
502
+ rowsPinnable?: boolean;
503
+ /** Spreadsheet cell range selection: mouse ranges, keyboard, clipboard chrome. */
504
+ cellSelection?: boolean;
505
+ /**
506
+ * "range" (default): drag, Shift and Ctrl/Cmd gestures and Shift+keys
507
+ * grow multi-cell regions. "single": one focused cell only - every
508
+ * gesture collapses to it and Ctrl/Cmd+A is inert.
509
+ */
510
+ cellSelectionMode?: "single" | "range";
511
+ /** Drag-to-fill handle on the selection corner. Requires cellSelection. */
512
+ cellFillHandle?: boolean;
513
+ /**
514
+ * How a cell opens its editor from the mouse: "dblclick" (default,
515
+ * the spreadsheet standard - first click focuses, second edits) or
516
+ * "click", opening the editor as soon as a plain click lands on the
517
+ * focused cell; modifier clicks and drags still select.
518
+ */
519
+ cellEditMode?: "dblclick" | "click";
520
+ /**
521
+ * When true, committing an edit with Enter moves focus down (Shift+Enter
522
+ * up), the Sheets and Excel convention. Off by default: the commit keeps
523
+ * focus on the edited cell. Tab always commits and moves across.
524
+ */
525
+ cellEditEnterAdvance?: boolean;
526
+ /**
527
+ * The handle's look: "dot" is a solid primary dot kept inside the
528
+ * cell corner; "ring" is the Sheets-style hollow circle riding the
529
+ * corner point, clamped at the grid's own boundary; "square" is the
530
+ * Excel-style solid square inside the corner. Default "dot".
531
+ */
532
+ cellFillHandleVariant?: "dot" | "ring" | "square";
533
+ };
534
+ tableClassNames?: {
535
+ base?: string;
536
+ header?: string;
537
+ headerRow?: string;
538
+ headerSticky?: string;
539
+ body?: string;
540
+ bodyRow?: string;
541
+ footer?: string;
542
+ edgeCell?: string;
543
+ /** Override the getRowStatus tints; defaults are the warning-muted set. */
544
+ rowNew?: string;
545
+ rowDirty?: string;
546
+ rowDeleted?: string;
547
+ /**
548
+ * Override the pinned-row chrome (muted tint, boundary shadow). A grid
549
+ * that pins a draft row for quick-create wants it to read as an active
550
+ * row, not a muted one.
551
+ */
552
+ rowPinned?: string;
553
+ /** The onRowCreate affordance row, e.g. to match the grid's row height. */
554
+ rowCreate?: string;
555
+ /** The fill handle, e.g. to restyle or resize it beyond the built-in variants. */
556
+ cellFillHandle?: string;
557
+ };
558
+ }
559
+ /**
560
+ * Reads the grid context. Pass `TData` from the calling component when the
561
+ * table, a row or a cell is handed on to something typed against that row
562
+ * shape: v9 declares `TData` invariant, so the default `any` no longer
563
+ * unifies with a concrete row type the way it did on v8.
564
+ */
565
+ declare function useDataGrid<TData extends object = any>(): DataGridContextProps<TData>;
566
+ type DataGridStateAtom<TValue> = {
567
+ get: () => TValue;
568
+ subscribe: (listener: () => void) => {
569
+ unsubscribe: () => void;
570
+ };
571
+ };
572
+ /**
573
+ * Re-renders the caller when one table state atom changes, without waiting
574
+ * for a render from above. The context holds still while a column resize is
575
+ * in flight (see DataGridProvider), and React Compiler caches a consumer's
576
+ * `<DataGridTable />` element, so whatever a drag must keep live (the width
577
+ * variables, the resize line and indicator) subscribes here. `select` must
578
+ * return the slice itself or a primitive, or every write re-renders.
579
+ */
580
+ declare function useDataGridAtom<TValue, TSelected = TValue | undefined>(atom: DataGridStateAtom<TValue> | undefined, select?: (value: TValue | undefined) => TSelected): TSelected;
581
+ declare function DataGridProvider<TData extends object>({ children, table, ...props }: DataGridLayoutProps<TData> & {
582
+ table: DataGridTableInstance<TData>;
583
+ children?: ReactNode;
584
+ }): import("react").JSX.Element;
585
+ declare function DataGrid<TFeatures extends TableFeatures, TData extends object>({ children, table, ...props }: DataGridProps<TFeatures, TData>): import("react").JSX.Element;
586
+ declare function DataGridContainer({ children, className }: {
587
+ children: ReactNode;
588
+ className?: string;
589
+ /** Accepted for backwards compatibility; currently has no effect. */
590
+ border?: boolean;
591
+ }): import("react").JSX.Element;
592
+ interface DataGridFocusCellOptions {
593
+ /** Also open the cell's editor, the way Enter would. */
594
+ edit?: boolean;
595
+ }
596
+ /** Imperative surface of the cell-selection controller. */
597
+ interface DataGridCellSelectionApi {
598
+ /**
599
+ * Moves the grid's cell focus AND the document focus together, retrying
600
+ * briefly while the row mounts, so a freshly created row is typeable
601
+ * without an extra click. `edit: true` also opens the cell's editor the
602
+ * way Enter would. Registered once the controller is wired; null while
603
+ * cell selection is off.
604
+ */
605
+ focusCell: (rowId: string, columnId: string, options?: DataGridFocusCellOptions) => void;
606
+ /** Clears every range and the focused cell. */
607
+ clearSelection: () => void;
608
+ /** Scrolls a rendered cell into view without moving focus. */
609
+ scrollToCell: (rowId: string, columnId: string) => void;
610
+ }
611
+ /** Row-major grid to TSV, CRLF rows, Excel-style quoting. */
612
+ declare function serializeDataGridClipboardText(grid: string[][]): string;
613
+ /**
614
+ * TSV to a row-major grid. A stateful scan, not a split: a quoted field may
615
+ * contain tabs, quotes and both newline flavors, which is exactly what Excel
616
+ * emits for a multi-line cell.
617
+ */
618
+ declare function parseDataGridClipboardText(text: string): string[][];
619
+ /** Repeats a block cyclically to fill rowCount x columnCount. */
620
+ declare function tileDataGridClipboardBlock(block: string[][], rowCount: number, columnCount: number): string[][];
621
+ /**
622
+ * Cells of the current selection the view can actually show, under the
623
+ * same row filter the batch builders use, so a count shown next to the
624
+ * selection always matches what is painted and what a batch will touch.
625
+ * The feature's own getSelectedCellCount spans off-page rows instead.
626
+ */
627
+ declare function getDataGridVisibleSelectedCellCount<TData extends object>(table: DataGridTableInstance<TData>,
628
+ /** The grid's body viewport; null falls back to the full-range count. */
629
+ viewport: HTMLElement | null): number;
630
+ /**
631
+ * The active region as formatted strings, row-major. Columns opted out of
632
+ * selection are compacted away, matching the feature's own ranges-data
633
+ * behavior, and rows the view cannot show are skipped when a viewport is
634
+ * given. Null when nothing is selected.
635
+ */
636
+ declare function getDataGridActiveRegionGrid<TData extends object>(table: DataGridTableInstance<TData>, viewport?: HTMLElement | null): string[][] | null;
637
+ /**
638
+ * A clear/cut batch over the selection's writable cells. Non-writable columns
639
+ * are skipped silently: clearing is an intent over what the grid owns, and a
640
+ * rejection per read-only cell would be noise. Null when nothing clears.
641
+ */
642
+ declare function buildDataGridClearDetails<TData extends object>(table: DataGridTableInstance<TData>, source: "clear" | "cut", activeRegionOnly: boolean, viewport?: HTMLElement | null): DataGridCellsChangeDetails<TData> | null;
643
+ type DataGridPasteTarget = {
644
+ /** Display indexes of the pasted region's first and last row. */
645
+ startRowIndex: number;
646
+ endRowIndex: number;
647
+ /** How many rows a paste actually wrote (hidden rows are skipped). */
648
+ rowCount?: number;
649
+ /** Display indexes of the pasted region's first and last column. */
650
+ startColumnIndex: number;
651
+ endColumnIndex: number;
652
+ };
653
+ /**
654
+ * Resolves a parsed clipboard block into a paste batch, Excel semantics:
655
+ * a 1x1 block fills the whole selected region; a block tiles when the region
656
+ * is an exact multiple of it; otherwise it pastes once from the region's
657
+ * top-left, clamped at the grid edges (rows are never grown).
658
+ */
659
+ declare function buildDataGridPasteDetails<TData extends object>(table: DataGridTableInstance<TData>, block: string[][], viewport?: HTMLElement | null): {
660
+ details: DataGridCellsChangeDetails<TData>;
661
+ target: DataGridPasteTarget;
662
+ } | null;
663
+ /**
664
+ * The inverse batch: every change's value and previousValue swapped and
665
+ * rejections dropped. Feed it through the same state update onCellsChange
666
+ * uses to implement undo; inverting the inverse is redo.
667
+ */
668
+ declare function invertDataGridCellsChange<TData extends object>(details: DataGridCellsChangeDetails<TData>): DataGridCellsChangeDetails<TData>;
669
+ /**
670
+ * Headless spreadsheet controller: keyboard navigation, clipboard, clear and
671
+ * the fill-handle drag. Mount once inside `<DataGrid>`, next to the table.
672
+ * Renders only a hidden anchor; the real listeners attach to the grid's own
673
+ * body viewport, which also receives focus (container-focus model), so a
674
+ * virtualized row unmounting can never strand `document.activeElement`.
675
+ */
676
+ declare function DataGridCellSelection<TData extends object>({ apiRef, clipboard, keyboard }: {
677
+ /** Receives the controller's imperative API, e.g. for create-row flows. */
678
+ apiRef?: RefObject<DataGridCellSelectionApi | null>;
679
+ /** Native copy, cut and paste handling. Defaults to true. */
680
+ clipboard?: boolean;
681
+ /**
682
+ * Arrows (with Ctrl/Cmd edge jumps), Home/End, PageUp/PageDown, Enter,
683
+ * F2, type-to-edit, Tab, Ctrl/Cmd+A, Delete, Escape. Defaults to true.
684
+ */
685
+ keyboard?: boolean;
686
+ }): import("react").JSX.Element;
687
+ /**
688
+ * Thin shell over row selection for bulk actions: selected count, a slot for
689
+ * the consumer's controls, and a clear action. Hidden while nothing is
690
+ * selected. What the controls do stays consumer-owned.
691
+ *
692
+ * Presented as a floating toolbar, the Google Sheets way: auto width,
693
+ * centered, elevated, and sticky to the viewport bottom with breathing room,
694
+ * so bulk actions stay reachable while the grid scrolls.
695
+ */
696
+ declare function DataGridSelectionBar({ children, className, label, clearLabel, onClear }: {
697
+ children?: ReactNode;
698
+ className?: string;
699
+ label?: (count: number) => ReactNode;
700
+ clearLabel?: ReactNode;
701
+ onClear?: () => void;
702
+ }): import("react").JSX.Element | null;
703
+ interface DataGridColumnFilterProps<TData extends object, TValue> {
704
+ column?: Column<DataGridFeatures, TData, TValue>;
705
+ title?: string;
706
+ options: {
707
+ label: string;
708
+ value: string;
709
+ icon?: React.ComponentType<{
710
+ className?: string;
711
+ }>;
712
+ }[];
713
+ }
714
+ declare function DataGridColumnFilter<TData extends object, TValue>({ column, title, options }: DataGridColumnFilterProps<TData, TValue>): import("react").JSX.Element;
715
+ interface DataGridColumnHeaderProps<TData extends object, TValue> extends HTMLAttributes<HTMLDivElement> {
716
+ column: Column<DataGridFeatures, TData, TValue>;
717
+ /** When omitted, uses `column.columnDef.meta.headerTitle`, then a string `columnDef.header`, then `column.id`. */
718
+ title?: string;
719
+ icon?: ReactNode;
720
+ /** Reserved; pin controls are gated by tableLayout.columnsPinnable + column.getCanPin(). */
721
+ pinnable?: boolean;
722
+ filter?: ReactNode;
723
+ visibility?: boolean;
724
+ }
725
+ /**
726
+ * Sort and pin state reaches this header through builder calls on `column`
727
+ * (`getIsSorted()`, `getIsPinned()`), and `column` keeps its identity across
728
+ * renders, so anything memoized against it (the `memo` below, or a consumer's
729
+ * compiled header template) never re-runs those reads: frozen sort arrows and
730
+ * pin controls. The `Subscribe` below turns the slices this header actually
731
+ * reads into a real reactive dependency, and threading the selection through
732
+ * as a prop is what lets it past the `memo`.
733
+ */
734
+ declare function DataGridColumnHeader<TData extends object, TValue>(props: DataGridColumnHeaderProps<TData, TValue>): import("react").JSX.Element;
735
+ declare function DataGridColumnVisibility<TData extends object>({ table, trigger }: {
736
+ table: Table<DataGridFeatures, TData>;
737
+ trigger: ReactElement<Record<string, unknown>>;
738
+ }): import("react").JSX.Element;
739
+ interface DataGridPaginationProps {
740
+ sizes?: number[];
741
+ sizesInfo?: string;
742
+ sizesLabel?: string;
743
+ sizesDescription?: string;
744
+ sizesSkeleton?: ReactNode;
745
+ more?: boolean;
746
+ /** Page buttons the truncated middle shows; the row adds first, last and
747
+ * an ellipsis for each hidden stretch. Clamped to a minimum of 3. */
748
+ moreLimit?: number;
749
+ info?: string;
750
+ infoSkeleton?: ReactNode;
751
+ className?: string;
752
+ rowsPerPageLabel?: string;
753
+ previousPageLabel?: string;
754
+ nextPageLabel?: string;
755
+ ellipsisText?: string;
756
+ }
757
+ declare function DataGridPagination(props: DataGridPaginationProps): JSX.Element;
758
+ type DataGridScrollAreaOrientation = "horizontal" | "vertical" | "both";
759
+ type DataGridScrollAreaProps = Omit<ScrollArea.Root.Props, "children"> & {
760
+ children: ReactNode;
761
+ orientation?: DataGridScrollAreaOrientation;
762
+ };
763
+ declare function DataGridScrollArea({ children, className, orientation, ...props }: DataGridScrollAreaProps): import("react").JSX.Element;
764
+ declare function getPinningStyles<TData extends object>(column: Column<DataGridFeatures, TData, unknown>): CSSProperties;
765
+ declare function getDataGridTreeIndentStyle<TData extends object>(row: Row<DataGridFeatures, TData>, indent?: number): CSSProperties;
766
+ /**
767
+ * Nearest scroll-area viewport that belongs to THIS grid. A viewport outside
768
+ * the grid's own container (e.g. a page-level ScrollArea) would make the
769
+ * width measurement - and the virtualizer - bind the wrong box.
770
+ */
771
+ declare function getDataGridScrollAreaViewport(node: HTMLElement): HTMLElement | null;
772
+ type DataGridTablePinnedBoundary = "top" | "bottom";
773
+ declare function getDataGridTableRowSections<TData extends object>(table: DataGridTableInstance<TData>, rowsPinnable?: boolean): {
774
+ topRows: Row<DataGridFeatures, TData>[];
775
+ centerRows: Row<DataGridFeatures, TData>[];
776
+ bottomRows: Row<DataGridFeatures, TData>[];
777
+ };
778
+ declare function getDataGridTableResolvedRows<TData extends object>(table: DataGridTableInstance<TData>, rowsPinnable?: boolean): {
779
+ row: Row<DataGridFeatures, TData>;
780
+ pinnedBoundary?: DataGridTablePinnedBoundary;
781
+ }[];
782
+ declare function getDataGridTableMergedHeaderGroups<TData extends object>(table: DataGridTableInstance<TData>): {
783
+ id: string;
784
+ headers: Header<DataGridFeatures, TData, unknown>[];
785
+ startHeaders: Header<{
786
+ columnVisibilityFeature: import("@tanstack/react-table").TableFeature;
787
+ columnOrderingFeature: import("@tanstack/react-table").TableFeature;
788
+ columnPinningFeature: import("@tanstack/react-table").TableFeature;
789
+ columnSizingFeature: import("@tanstack/react-table").TableFeature;
790
+ columnResizingFeature: import("@tanstack/react-table").TableFeature;
791
+ columnFilteringFeature: import("@tanstack/react-table").TableFeature;
792
+ columnFacetingFeature: import("@tanstack/react-table").TableFeature;
793
+ globalFilteringFeature: import("@tanstack/react-table").TableFeature;
794
+ rowSortingFeature: import("@tanstack/react-table").TableFeature;
795
+ rowPaginationFeature: import("@tanstack/react-table").TableFeature;
796
+ rowSelectionFeature: import("@tanstack/react-table").TableFeature;
797
+ rowExpandingFeature: import("@tanstack/react-table").TableFeature;
798
+ rowPinningFeature: import("@tanstack/react-table").TableFeature;
799
+ cellSelectionFeature: import("@tanstack/react-table").TableFeature;
800
+ sortedRowModel: (table: import("@tanstack/react-table").Table<any, any>) => () => import("@tanstack/react-table").RowModel<any, any>;
801
+ filteredRowModel: (table: import("@tanstack/react-table").Table<any, any>) => () => import("@tanstack/react-table").RowModel<any, any>;
802
+ paginatedRowModel: (table: import("@tanstack/react-table").Table<any, any>) => () => import("@tanstack/react-table").RowModel<any, any>;
803
+ expandedRowModel: (table: import("@tanstack/react-table").Table<any, any>) => () => import("@tanstack/react-table").RowModel<any, any>;
804
+ facetedRowModel: (table: import("@tanstack/react-table").Table<any, any>, columnId: string) => () => import("@tanstack/react-table").RowModel<any, any>;
805
+ facetedUniqueValues: (table: import("@tanstack/react-table").Table<import("@tanstack/react-table").TableFeatures, any>, columnId: string) => () => Map<any, number>;
806
+ sortFns: {
807
+ alphanumeric: import("@tanstack/react-table").CreatedSortFn<any, any>;
808
+ alphanumericCaseSensitive: import("@tanstack/react-table").CreatedSortFn<any, any>;
809
+ basic: import("@tanstack/react-table").CreatedSortFn<any, any>;
810
+ datetime: import("@tanstack/react-table").CreatedSortFn<any, any>;
811
+ text: import("@tanstack/react-table").CreatedSortFn<any, any>;
812
+ textCaseSensitive: import("@tanstack/react-table").CreatedSortFn<any, any>;
813
+ };
814
+ columnMeta: DataGridColumnMeta<any>;
815
+ }, TData, unknown>[];
816
+ centerHeaders: Header<{
817
+ columnVisibilityFeature: import("@tanstack/react-table").TableFeature;
818
+ columnOrderingFeature: import("@tanstack/react-table").TableFeature;
819
+ columnPinningFeature: import("@tanstack/react-table").TableFeature;
820
+ columnSizingFeature: import("@tanstack/react-table").TableFeature;
821
+ columnResizingFeature: import("@tanstack/react-table").TableFeature;
822
+ columnFilteringFeature: import("@tanstack/react-table").TableFeature;
823
+ columnFacetingFeature: import("@tanstack/react-table").TableFeature;
824
+ globalFilteringFeature: import("@tanstack/react-table").TableFeature;
825
+ rowSortingFeature: import("@tanstack/react-table").TableFeature;
826
+ rowPaginationFeature: import("@tanstack/react-table").TableFeature;
827
+ rowSelectionFeature: import("@tanstack/react-table").TableFeature;
828
+ rowExpandingFeature: import("@tanstack/react-table").TableFeature;
829
+ rowPinningFeature: import("@tanstack/react-table").TableFeature;
830
+ cellSelectionFeature: import("@tanstack/react-table").TableFeature;
831
+ sortedRowModel: (table: import("@tanstack/react-table").Table<any, any>) => () => import("@tanstack/react-table").RowModel<any, any>;
832
+ filteredRowModel: (table: import("@tanstack/react-table").Table<any, any>) => () => import("@tanstack/react-table").RowModel<any, any>;
833
+ paginatedRowModel: (table: import("@tanstack/react-table").Table<any, any>) => () => import("@tanstack/react-table").RowModel<any, any>;
834
+ expandedRowModel: (table: import("@tanstack/react-table").Table<any, any>) => () => import("@tanstack/react-table").RowModel<any, any>;
835
+ facetedRowModel: (table: import("@tanstack/react-table").Table<any, any>, columnId: string) => () => import("@tanstack/react-table").RowModel<any, any>;
836
+ facetedUniqueValues: (table: import("@tanstack/react-table").Table<import("@tanstack/react-table").TableFeatures, any>, columnId: string) => () => Map<any, number>;
837
+ sortFns: {
838
+ alphanumeric: import("@tanstack/react-table").CreatedSortFn<any, any>;
839
+ alphanumericCaseSensitive: import("@tanstack/react-table").CreatedSortFn<any, any>;
840
+ basic: import("@tanstack/react-table").CreatedSortFn<any, any>;
841
+ datetime: import("@tanstack/react-table").CreatedSortFn<any, any>;
842
+ text: import("@tanstack/react-table").CreatedSortFn<any, any>;
843
+ textCaseSensitive: import("@tanstack/react-table").CreatedSortFn<any, any>;
844
+ };
845
+ columnMeta: DataGridColumnMeta<any>;
846
+ }, TData, unknown>[];
847
+ endHeaders: Header<{
848
+ columnVisibilityFeature: import("@tanstack/react-table").TableFeature;
849
+ columnOrderingFeature: import("@tanstack/react-table").TableFeature;
850
+ columnPinningFeature: import("@tanstack/react-table").TableFeature;
851
+ columnSizingFeature: import("@tanstack/react-table").TableFeature;
852
+ columnResizingFeature: import("@tanstack/react-table").TableFeature;
853
+ columnFilteringFeature: import("@tanstack/react-table").TableFeature;
854
+ columnFacetingFeature: import("@tanstack/react-table").TableFeature;
855
+ globalFilteringFeature: import("@tanstack/react-table").TableFeature;
856
+ rowSortingFeature: import("@tanstack/react-table").TableFeature;
857
+ rowPaginationFeature: import("@tanstack/react-table").TableFeature;
858
+ rowSelectionFeature: import("@tanstack/react-table").TableFeature;
859
+ rowExpandingFeature: import("@tanstack/react-table").TableFeature;
860
+ rowPinningFeature: import("@tanstack/react-table").TableFeature;
861
+ cellSelectionFeature: import("@tanstack/react-table").TableFeature;
862
+ sortedRowModel: (table: import("@tanstack/react-table").Table<any, any>) => () => import("@tanstack/react-table").RowModel<any, any>;
863
+ filteredRowModel: (table: import("@tanstack/react-table").Table<any, any>) => () => import("@tanstack/react-table").RowModel<any, any>;
864
+ paginatedRowModel: (table: import("@tanstack/react-table").Table<any, any>) => () => import("@tanstack/react-table").RowModel<any, any>;
865
+ expandedRowModel: (table: import("@tanstack/react-table").Table<any, any>) => () => import("@tanstack/react-table").RowModel<any, any>;
866
+ facetedRowModel: (table: import("@tanstack/react-table").Table<any, any>, columnId: string) => () => import("@tanstack/react-table").RowModel<any, any>;
867
+ facetedUniqueValues: (table: import("@tanstack/react-table").Table<import("@tanstack/react-table").TableFeatures, any>, columnId: string) => () => Map<any, number>;
868
+ sortFns: {
869
+ alphanumeric: import("@tanstack/react-table").CreatedSortFn<any, any>;
870
+ alphanumericCaseSensitive: import("@tanstack/react-table").CreatedSortFn<any, any>;
871
+ basic: import("@tanstack/react-table").CreatedSortFn<any, any>;
872
+ datetime: import("@tanstack/react-table").CreatedSortFn<any, any>;
873
+ text: import("@tanstack/react-table").CreatedSortFn<any, any>;
874
+ textCaseSensitive: import("@tanstack/react-table").CreatedSortFn<any, any>;
875
+ };
876
+ columnMeta: DataGridColumnMeta<any>;
877
+ }, TData, unknown>[];
878
+ coveredHeaders: Map<string, Header<{
879
+ columnVisibilityFeature: import("@tanstack/react-table").TableFeature;
880
+ columnOrderingFeature: import("@tanstack/react-table").TableFeature;
881
+ columnPinningFeature: import("@tanstack/react-table").TableFeature;
882
+ columnSizingFeature: import("@tanstack/react-table").TableFeature;
883
+ columnResizingFeature: import("@tanstack/react-table").TableFeature;
884
+ columnFilteringFeature: import("@tanstack/react-table").TableFeature;
885
+ columnFacetingFeature: import("@tanstack/react-table").TableFeature;
886
+ globalFilteringFeature: import("@tanstack/react-table").TableFeature;
887
+ rowSortingFeature: import("@tanstack/react-table").TableFeature;
888
+ rowPaginationFeature: import("@tanstack/react-table").TableFeature;
889
+ rowSelectionFeature: import("@tanstack/react-table").TableFeature;
890
+ rowExpandingFeature: import("@tanstack/react-table").TableFeature;
891
+ rowPinningFeature: import("@tanstack/react-table").TableFeature;
892
+ cellSelectionFeature: import("@tanstack/react-table").TableFeature;
893
+ sortedRowModel: (table: import("@tanstack/react-table").Table<any, any>) => () => import("@tanstack/react-table").RowModel<any, any>;
894
+ filteredRowModel: (table: import("@tanstack/react-table").Table<any, any>) => () => import("@tanstack/react-table").RowModel<any, any>;
895
+ paginatedRowModel: (table: import("@tanstack/react-table").Table<any, any>) => () => import("@tanstack/react-table").RowModel<any, any>;
896
+ expandedRowModel: (table: import("@tanstack/react-table").Table<any, any>) => () => import("@tanstack/react-table").RowModel<any, any>;
897
+ facetedRowModel: (table: import("@tanstack/react-table").Table<any, any>, columnId: string) => () => import("@tanstack/react-table").RowModel<any, any>;
898
+ facetedUniqueValues: (table: import("@tanstack/react-table").Table<import("@tanstack/react-table").TableFeatures, any>, columnId: string) => () => Map<any, number>;
899
+ sortFns: {
900
+ alphanumeric: import("@tanstack/react-table").CreatedSortFn<any, any>;
901
+ alphanumericCaseSensitive: import("@tanstack/react-table").CreatedSortFn<any, any>;
902
+ basic: import("@tanstack/react-table").CreatedSortFn<any, any>;
903
+ datetime: import("@tanstack/react-table").CreatedSortFn<any, any>;
904
+ text: import("@tanstack/react-table").CreatedSortFn<any, any>;
905
+ textCaseSensitive: import("@tanstack/react-table").CreatedSortFn<any, any>;
906
+ };
907
+ columnMeta: DataGridColumnMeta<any>;
908
+ }, TData, unknown>[]>;
909
+ }[];
910
+ declare function renderDataGridTableHeadCellContent<TData extends object>(header: Header<DataGridFeatures, TData, unknown>): string | number | bigint | boolean | import("react").JSX.Element | Iterable<ReactNode> | Promise<string | number | bigint | boolean | import("react").ReactPortal | import("react").ReactElement<unknown, string | import("react").JSXElementConstructor<any>> | Iterable<ReactNode> | null | undefined> | null | undefined;
911
+ declare function getDataGridHeadCellResizeHeader<TData extends object>(header: Header<DataGridFeatures, TData, unknown>, coveredHeaders?: Header<DataGridFeatures, TData, unknown>[]): Header<{
912
+ columnVisibilityFeature: import("@tanstack/react-table").TableFeature;
913
+ columnOrderingFeature: import("@tanstack/react-table").TableFeature;
914
+ columnPinningFeature: import("@tanstack/react-table").TableFeature;
915
+ columnSizingFeature: import("@tanstack/react-table").TableFeature;
916
+ columnResizingFeature: import("@tanstack/react-table").TableFeature;
917
+ columnFilteringFeature: import("@tanstack/react-table").TableFeature;
918
+ columnFacetingFeature: import("@tanstack/react-table").TableFeature;
919
+ globalFilteringFeature: import("@tanstack/react-table").TableFeature;
920
+ rowSortingFeature: import("@tanstack/react-table").TableFeature;
921
+ rowPaginationFeature: import("@tanstack/react-table").TableFeature;
922
+ rowSelectionFeature: import("@tanstack/react-table").TableFeature;
923
+ rowExpandingFeature: import("@tanstack/react-table").TableFeature;
924
+ rowPinningFeature: import("@tanstack/react-table").TableFeature;
925
+ cellSelectionFeature: import("@tanstack/react-table").TableFeature;
926
+ sortedRowModel: (table: import("@tanstack/react-table").Table<any, any>) => () => import("@tanstack/react-table").RowModel<any, any>;
927
+ filteredRowModel: (table: import("@tanstack/react-table").Table<any, any>) => () => import("@tanstack/react-table").RowModel<any, any>;
928
+ paginatedRowModel: (table: import("@tanstack/react-table").Table<any, any>) => () => import("@tanstack/react-table").RowModel<any, any>;
929
+ expandedRowModel: (table: import("@tanstack/react-table").Table<any, any>) => () => import("@tanstack/react-table").RowModel<any, any>;
930
+ facetedRowModel: (table: import("@tanstack/react-table").Table<any, any>, columnId: string) => () => import("@tanstack/react-table").RowModel<any, any>;
931
+ facetedUniqueValues: (table: import("@tanstack/react-table").Table<import("@tanstack/react-table").TableFeatures, any>, columnId: string) => () => Map<any, number>;
932
+ sortFns: {
933
+ alphanumeric: import("@tanstack/react-table").CreatedSortFn<any, any>;
934
+ alphanumericCaseSensitive: import("@tanstack/react-table").CreatedSortFn<any, any>;
935
+ basic: import("@tanstack/react-table").CreatedSortFn<any, any>;
936
+ datetime: import("@tanstack/react-table").CreatedSortFn<any, any>;
937
+ text: import("@tanstack/react-table").CreatedSortFn<any, any>;
938
+ textCaseSensitive: import("@tanstack/react-table").CreatedSortFn<any, any>;
939
+ };
940
+ columnMeta: DataGridColumnMeta<any>;
941
+ }, TData, unknown>;
942
+ declare function getDataGridHeadCellSizeVar<TData extends object>(header: Header<DataGridFeatures, TData, unknown>, coveredHeaders?: Header<DataGridFeatures, TData, unknown>[]): string;
943
+ declare function hasDataGridTableRightPinnedColumns<TData extends object>(table: DataGridTableInstance<TData>): boolean;
944
+ declare function DataGridTableFillHeadCell({ rowSpan }?: {
945
+ /** Multi-level headers render one fill cell spanning every head row. */
946
+ rowSpan?: number;
947
+ }): import("react").JSX.Element | null;
948
+ declare function DataGridTableFillBodyCell(): import("react").JSX.Element | null;
949
+ /**
950
+ * The quick-create affordance, rendered as the body's last row when
951
+ * `onRowCreate` is set: one full-width ghost button, the Notion/Airtable
952
+ * "+ New" idiom. What the click creates stays consumer-owned.
953
+ */
954
+ declare function DataGridTableAddRow(): import("react").JSX.Element | null;
955
+ declare function DataGridTableBase({ children }: {
956
+ children: ReactNode;
957
+ }): import("react").JSX.Element;
958
+ declare function DataGridTableViewport({ children, className, viewportRef, style }: {
959
+ children: ReactNode;
960
+ className?: string;
961
+ viewportRef?: Ref<HTMLDivElement>;
962
+ style?: CSSProperties;
963
+ }): import("react").JSX.Element;
964
+ declare function DataGridTableHead({ children }: {
965
+ children: ReactNode;
966
+ }): import("react").JSX.Element;
967
+ declare function DataGridTableHeadRow({ children, rowId }: {
968
+ children: ReactNode;
969
+ rowId: string;
970
+ }): import("react").JSX.Element;
971
+ declare function DataGridTableHeadRowCell<TData extends object>({ children, header, coveredHeaders, dndRef, dndStyle }: {
972
+ children: ReactNode;
973
+ header: Header<DataGridFeatures, TData, unknown>;
974
+ /** Headers this cell spans through meta.headerColSpan; they render none. */
975
+ coveredHeaders?: Header<DataGridFeatures, TData, unknown>[];
976
+ dndRef?: React.Ref<HTMLTableCellElement>;
977
+ dndStyle?: CSSProperties;
978
+ }): import("react").JSX.Element;
979
+ declare function DataGridTableHeadRowCellResize<TData extends object>({ header }: {
980
+ header: Header<DataGridFeatures, TData, unknown>;
981
+ }): import("react").JSX.Element;
982
+ declare function DataGridTableRowSpacer(): import("react").JSX.Element;
983
+ declare function DataGridTableBody({ children }: {
984
+ children: ReactNode;
985
+ }): import("react").JSX.Element;
986
+ declare function DataGridTableFoot({ children }: {
987
+ children: ReactNode;
988
+ }): import("react").JSX.Element;
989
+ declare function DataGridTableFootRow({ children }: {
990
+ children: ReactNode;
991
+ }): import("react").JSX.Element;
992
+ declare function DataGridTableFootRowCell({ children, colSpan, className }: {
993
+ children?: ReactNode;
994
+ colSpan?: number;
995
+ className?: string;
996
+ }): import("react").JSX.Element;
997
+ declare function DataGridTableBodyRowSkeleton({ children }: {
998
+ children: ReactNode;
999
+ }): import("react").JSX.Element;
1000
+ declare function DataGridTableBodyRowSkeletonCell<TData extends object>({ children, column }: {
1001
+ children: ReactNode;
1002
+ column: Column<DataGridFeatures, TData, unknown>;
1003
+ }): import("react").JSX.Element;
1004
+ declare function DataGridTableBodyRow<TData extends object>({ children, row, pinnedBoundary, rowRef, dndRef, dndStyle, dndDragging, dataIndex }: {
1005
+ children: ReactNode;
1006
+ row: Row<DataGridFeatures, TData>;
1007
+ pinnedBoundary?: DataGridTablePinnedBoundary;
1008
+ rowRef?: React.Ref<HTMLTableRowElement>;
1009
+ dndRef?: React.Ref<HTMLTableRowElement>;
1010
+ dndStyle?: CSSProperties;
1011
+ dndDragging?: boolean;
1012
+ dataIndex?: number;
1013
+ }): import("react").JSX.Element;
1014
+ declare function DataGridTableBodyRowExpandded<TData extends object>({ row }: {
1015
+ row: Row<DataGridFeatures, TData>;
1016
+ }): import("react").JSX.Element | null;
1017
+ declare function DataGridTableBodyRowCell<TData extends object>({ children, cell, dndRef, dndStyle, columnIndex }: {
1018
+ children: ReactNode;
1019
+ cell: Cell<DataGridFeatures, TData, unknown>;
1020
+ dndRef?: React.Ref<HTMLTableCellElement>;
1021
+ dndStyle?: CSSProperties;
1022
+ /** Center-column index under column virtualization; data-column-index. */
1023
+ columnIndex?: number;
1024
+ }): import("react").JSX.Element;
1025
+ declare function DataGridTableRenderedRow<TData extends object>({ row, pinnedBoundary, rowRef, rowIndex, centerWindow }: {
1026
+ row: Row<DataGridFeatures, TData>;
1027
+ pinnedBoundary?: DataGridTablePinnedBoundary;
1028
+ rowRef?: React.Ref<HTMLTableRowElement>;
1029
+ /** Virtualized list index, rendered as data-index for measureElement. */
1030
+ rowIndex?: number;
1031
+ /**
1032
+ * Column-virtualization window over the CENTER cells: only the inclusive
1033
+ * [start, end] slice renders, and each flank collapses into one colSpan
1034
+ * spacer. The spacers carry no width of their own - the colgroup stays
1035
+ * complete, so under table-fixed the browser sizes them from the col
1036
+ * elements they span and the layout cannot drift.
1037
+ */
1038
+ centerWindow?: {
1039
+ start: number;
1040
+ end: number;
1041
+ };
1042
+ }): import("react").JSX.Element;
1043
+ declare function DataGridTableEmpty(): import("react").JSX.Element;
1044
+ declare function DataGridTableLoader(): import("react").JSX.Element;
1045
+ declare function DataGridTableRowPin<TData extends object>({ row }: {
1046
+ row: Row<DataGridFeatures, TData>;
1047
+ }): import("react").JSX.Element;
1048
+ /**
1049
+ * Selection cell.
1050
+ *
1051
+ * Selection is read through `row.getIsSelected()`, a builder call on a row
1052
+ * that keeps its identity across renders. A consumer's compiled component
1053
+ * around this checkbox caches it against that row and never renders it
1054
+ * again, which shows up as checkboxes that do not respond to clicks.
1055
+ * Subscribing to the row-selection atom makes selection a dependency of its
1056
+ * own. Note the standalone `Subscribe` rather than `table.Subscribe`: inside a
1057
+ * cell template the `table` handed to the column def is the core `Table`, which
1058
+ * has no `Subscribe` attached.
1059
+ */
1060
+ declare function DataGridTableRowSelect<TData extends object>({ row }: {
1061
+ row: Row<DataGridFeatures, TData>;
1062
+ }): import("react").JSX.Element;
1063
+ declare function DataGridTableRowSelectAll(): import("react").JSX.Element;
1064
+ declare function DataGridTableRowExpand<TData extends object>({ row, indent, className, children }: {
1065
+ row: Row<DataGridFeatures, TData>;
1066
+ /** Horizontal offset in px applied per tree depth level. */
1067
+ indent?: number;
1068
+ className?: string;
1069
+ /** Custom toggle icon; replaces the default chevron. */
1070
+ children?: ReactNode;
1071
+ }): import("react").JSX.Element;
1072
+ declare function DataGridTableHeader<TData extends object>(): import("react").JSX.Element;
1073
+ declare function DataGridTable<TData extends object>({ footerContent, renderHeader }: {
1074
+ footerContent?: ReactNode;
1075
+ renderHeader?: boolean;
1076
+ }): import("react").JSX.Element;
1077
+ declare function DataGridTableDnd<TData extends object>({ handleDragEnd, footerContent, accessibility }: {
1078
+ handleDragEnd: (event: DragEndEvent) => void;
1079
+ footerContent?: ReactNode;
1080
+ /**
1081
+ * Forwarded to dnd-kit's `DndContext`: its screen-reader instructions and
1082
+ * live-region announcements, which default to dnd-kit's English strings.
1083
+ */
1084
+ accessibility?: DndContextProps["accessibility"];
1085
+ }): import("react").JSX.Element;
1086
+ /**
1087
+ * Tree metadata attached to every sortable row, readable from
1088
+ * `active.data.current` / `over.data.current` in any drag event. Cross-parent
1089
+ * drops can be resolved from it without re-deriving the shape of the table.
1090
+ */
1091
+ type DataGridTableDndRowData = {
1092
+ type: "data-grid-row";
1093
+ /** Tree depth, 0 for root rows. */
1094
+ depth: number;
1095
+ /** Index within the parent's children, or within the root rows. */
1096
+ index: number;
1097
+ /** Parent row id, or null for root rows. */
1098
+ parentId: string | null;
1099
+ };
1100
+ /**
1101
+ * Per-row render slot for drop indicators and depth guides. The returned node
1102
+ * is positioned over the row, so it never adds a column, shifts striping, or
1103
+ * gets clipped by a truncating resizable cell.
1104
+ */
1105
+ type DataGridTableDndRowDecoration<TData extends object> = (context: {
1106
+ row: Row<DataGridFeatures, TData>;
1107
+ isDragging: boolean;
1108
+ isOver: boolean;
1109
+ }) => ReactNode;
1110
+ declare function DataGridTableDndRowHandle({ className, disabled, disabledLabel }: {
1111
+ className?: string;
1112
+ /**
1113
+ * Renders the grip inert instead of withdrawing it. A grid that reorders on
1114
+ * one truth (manual order) and sorts on another cannot honour both at once,
1115
+ * but dropping the handle entirely collapses the gutter and reads as broken
1116
+ * rather than as unavailable. Keep the column's shape, mute the control.
1117
+ */
1118
+ disabled?: boolean;
1119
+ /** Announced and shown on hover in place of the drag affordance. */
1120
+ disabledLabel?: string;
1121
+ }): import("react").JSX.Element;
1122
+ declare function DataGridTableDndRows<TData extends object>({ handleDragEnd, dataIds, footerContent, collisionDetection, modifiers, sortingStrategy, renderRowDecoration, dropIndicator, onDragStart, onDragMove, onDragOver, onDragCancel, accessibility }: {
1123
+ handleDragEnd: (event: DragEndEvent) => void;
1124
+ dataIds: UniqueIdentifier[];
1125
+ footerContent?: ReactNode;
1126
+ /** Overrides the default `closestCenter` strategy. */
1127
+ collisionDetection?: CollisionDetection;
1128
+ /**
1129
+ * Replaces the default axis restriction, e.g. drop `restrictToVerticalAxis`
1130
+ * to allow the horizontal gesture that tree re-parenting relies on. The
1131
+ * table container clamp is always applied after these, so a dragged row
1132
+ * cannot leave the grid.
1133
+ */
1134
+ modifiers?: Modifier[];
1135
+ /**
1136
+ * Replaces the default `verticalListSortingStrategy`. Return null from a
1137
+ * strategy to leave every row exactly where it is. A tree needs that: its drop
1138
+ * is either INTO the hovered row or BETWEEN two rows, and which one it is
1139
+ * flips as the pointer crosses a single row, so a gap that opens for one and
1140
+ * shuts for the other flickers the whole surface. Such a caller draws its own
1141
+ * insertion line instead, and pairs this with a modifier that holds the
1142
+ * carried row still, since a gap nothing moves into is just a hole.
1143
+ */
1144
+ sortingStrategy?: SortingStrategy;
1145
+ /** Per-row slot for drop indicators and depth guides. */
1146
+ renderRowDecoration?: DataGridTableDndRowDecoration<TData>;
1147
+ /**
1148
+ * Draws a line on the seam the carried row would land on. On by default;
1149
+ * pass `false` when `renderRowDecoration` paints its own insertion affordance
1150
+ * and the two would compete.
1151
+ */
1152
+ dropIndicator?: boolean;
1153
+ onDragStart?: (event: DragStartEvent) => void;
1154
+ onDragMove?: (event: DragMoveEvent) => void;
1155
+ onDragOver?: (event: DragOverEvent) => void;
1156
+ onDragCancel?: (event: DragCancelEvent) => void;
1157
+ /**
1158
+ * Forwarded to dnd-kit's `DndContext`: its screen-reader instructions and
1159
+ * live-region announcements, which default to dnd-kit's English strings.
1160
+ */
1161
+ accessibility?: DndContextProps["accessibility"];
1162
+ }): import("react").JSX.Element;
1163
+ type DataGridTableVirtualScrollElements = {
1164
+ containerElement: HTMLDivElement | null;
1165
+ scrollElement: HTMLElement | null;
1166
+ };
1167
+ type DataGridTableVirtualScrollAlignment = "auto" | "center" | "start" | "end";
1168
+ interface DataGridTableColumnVirtualizerOptions {
1169
+ /** Off unless explicitly true; a column window is opt-in. */
1170
+ enabled?: boolean;
1171
+ overscan?: number;
1172
+ }
1173
+ type DataGridTableVirtualizerOptions<TData extends object> = Omit<VirtualizerOptions<HTMLElement, HTMLTableRowElement>, "count" | "estimateSize" | "getItemKey" | "getScrollElement"> & {
1174
+ estimateSize?: (index: number, row: Row<DataGridFeatures, TData>) => number;
1175
+ getItemKey?: (index: number, row: Row<DataGridFeatures, TData>) => string | number;
1176
+ getScrollElement?: (elements: DataGridTableVirtualScrollElements) => HTMLElement | null;
1177
+ };
1178
+ interface DataGridTableVirtualProps<TData extends object> {
1179
+ height?: number | string;
1180
+ estimateSize?: number;
1181
+ overscan?: number;
1182
+ /** Scroll animation used when revealing a controlled target row. */
1183
+ scrollBehavior?: ScrollBehavior;
1184
+ /** Alignment used when revealing a controlled target row. Defaults to auto. */
1185
+ scrollToRowAlign?: DataGridTableVirtualScrollAlignment;
1186
+ /** Index within the center (non-pinned) row section to reveal. */
1187
+ scrollToRowIndex?: number;
1188
+ /**
1189
+ * Opt-in horizontal virtualization of the CENTER columns. Activates only
1190
+ * under a fixed table layout with a single ungrouped header row; pinned
1191
+ * columns stay mounted, and anything else falls back to full-column
1192
+ * rendering. `scrollBehavior` is shared with controlled row scrolling.
1193
+ */
1194
+ columnVirtualizerOptions?: DataGridTableColumnVirtualizerOptions;
1195
+ /** Alignment used when revealing a controlled target column. */
1196
+ scrollToColumnAlign?: DataGridTableVirtualScrollAlignment;
1197
+ /** Index within the center (non-pinned) visible leaf columns to reveal. */
1198
+ scrollToColumnIndex?: number;
1199
+ footerContent?: ReactNode;
1200
+ renderHeader?: boolean;
1201
+ onFetchMore?: () => void;
1202
+ isFetchingMore?: boolean;
1203
+ hasMore?: boolean;
1204
+ fetchMoreOffset?: number;
1205
+ virtualizerOptions?: DataGridTableVirtualizerOptions<TData>;
1206
+ }
1207
+ declare function DataGridTableVirtual<TData extends object>({ height, estimateSize, overscan, scrollBehavior, scrollToRowAlign, scrollToRowIndex, columnVirtualizerOptions, scrollToColumnAlign, scrollToColumnIndex, footerContent, renderHeader, onFetchMore, isFetchingMore, hasMore, fetchMoreOffset, virtualizerOptions }: DataGridTableVirtualProps<TData>): import("react").JSX.Element;
1208
+ interface Transaction {
1209
+ id: string;
1210
+ name: string;
1211
+ network: string;
1212
+ reference: string;
1213
+ date: string;
1214
+ amount: number;
1215
+ }
1216
+ export declare const TRANSACTIONS: Transaction[];
1217
+ /** A Mobile Money statement: sortable columns, cell borders, pagination (5 per page). */
1218
+ export declare function TransactionsExample({ data }: {
1219
+ data?: Transaction[];
1220
+ }): import("react").JSX.Element;
1221
+ export { DataGrid, DataGridCellSelection, type DataGridCellSelectionApi, DataGridColumnFilter, type DataGridColumnFilterProps, DataGridColumnHeader, type DataGridColumnHeaderProps, DataGridColumnVisibility, DataGridContainer, type DataGridFocusCellOptions, DataGridPagination, type DataGridPaginationProps, type DataGridPasteTarget, DataGridProvider, DataGridScrollArea, type DataGridScrollAreaOrientation, type DataGridScrollAreaProps, DataGridSelectionBar, DataGridTable, DataGridTableAddRow, DataGridTableBase, DataGridTableBody, DataGridTableBodyRow, DataGridTableBodyRowCell, DataGridTableBodyRowExpandded, DataGridTableBodyRowSkeleton, DataGridTableBodyRowSkeletonCell, DataGridTableDnd, type DataGridTableDndRowData, type DataGridTableDndRowDecoration, DataGridTableDndRowHandle, DataGridTableDndRows, DataGridTableEmpty, DataGridTableFillBodyCell, DataGridTableFillHeadCell, DataGridTableFoot, DataGridTableFootRow, DataGridTableFootRowCell, DataGridTableHead, DataGridTableHeadRow, DataGridTableHeadRowCell, DataGridTableHeadRowCellResize, DataGridTableHeader, DataGridTableLoader, type DataGridTablePinnedBoundary, DataGridTableRenderedRow, DataGridTableRowExpand, DataGridTableRowPin, DataGridTableRowSelect, DataGridTableRowSelectAll, DataGridTableRowSpacer, DataGridTableViewport, DataGridTableVirtual, type DataGridTableVirtualProps, type DataGridTableVirtualScrollAlignment, type DataGridTableVirtualScrollElements, type DataGridTableVirtualizerOptions, type Transaction, buildDataGridClearDetails, buildDataGridPasteDetails, getDataGridActiveRegionGrid, getDataGridHeadCellResizeHeader, getDataGridHeadCellSizeVar, getDataGridScrollAreaViewport, getDataGridTableMergedHeaderGroups, getDataGridTableResolvedRows, getDataGridTableRowSections, getDataGridTreeIndentStyle, getDataGridVisibleSelectedCellCount, getPinningStyles, hasDataGridTableRightPinnedColumns, invertDataGridCellsChange, parseDataGridClipboardText, renderDataGridTableHeadCellContent, serializeDataGridClipboardText, tileDataGridClipboardBlock, useDataGrid, useDataGridAtom };