@jielga/tmdatagrid 1.0.0 → 1.0.1
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.
- package/README.md +8 -8
- package/dist/index.d.ts +225 -225
- package/dist/index.js +58 -50
- package/dist/index.js.map +1 -1
- package/dist/styles.css +1 -1
- package/package.json +3 -2
- package/skills/columns/SKILL.md +4 -4
- package/skills/features/SKILL.md +30 -30
- package/skills/getting-started/SKILL.md +16 -16
- package/skills/options/SKILL.md +8 -8
- package/skills/server-side/SKILL.md +7 -7
- package/skills/testing/SKILL.md +12 -12
- package/src/tmdatagrid/TMDataGridContext.ts +2 -2
- package/src/tmdatagrid/components/TMDataGrid.module.css +2 -2
- package/src/tmdatagrid/components/TMDataGrid.tsx +5 -5
- package/src/tmdatagrid/components/TMDataGridCellEditor.tsx +4 -4
- package/src/tmdatagrid/components/TMDataGridColumnsPanel.tsx +2 -2
- package/src/tmdatagrid/components/TMDataGridDetailsColumn.tsx +6 -6
- package/src/tmdatagrid/components/TMDataGridEditActions.tsx +2 -2
- package/src/tmdatagrid/components/TMDataGridEditColumn.tsx +4 -4
- package/src/tmdatagrid/components/TMDataGridEntryRows.tsx +6 -6
- package/src/tmdatagrid/components/TMDataGridFilterPanel.tsx +6 -6
- package/src/tmdatagrid/components/TMDataGridFilterPills.module.css +2 -2
- package/src/tmdatagrid/components/TMDataGridFilterPills.tsx +1 -1
- package/src/tmdatagrid/components/TMDataGridFooter.module.css +1 -1
- package/src/tmdatagrid/components/TMDataGridFooter.tsx +12 -6
- package/src/tmdatagrid/components/TMDataGridGroupColumn.module.css +1 -1
- package/src/tmdatagrid/components/TMDataGridGroupColumn.tsx +5 -5
- package/src/tmdatagrid/components/TMDataGridHeaderCell.module.css +8 -8
- package/src/tmdatagrid/components/TMDataGridHeaderCell.tsx +12 -12
- package/src/tmdatagrid/components/TMDataGridRowNumberColumn.tsx +4 -4
- package/src/tmdatagrid/components/TMDataGridSearch.tsx +5 -5
- package/src/tmdatagrid/components/TMDataGridSelectColumn.tsx +8 -8
- package/src/tmdatagrid/components/TMDataGridTable.module.css +18 -18
- package/src/tmdatagrid/components/TMDataGridTable.tsx +116 -116
- package/src/tmdatagrid/components/TMDataGridToolbar.tsx +5 -5
- package/src/tmdatagrid/components/editors/TMDataGridBooleanEditor.tsx +1 -1
- package/src/tmdatagrid/components/editors/TMDataGridDateEditor.tsx +2 -2
- package/src/tmdatagrid/components/editors/TMDataGridMultiSelectEditor.tsx +1 -1
- package/src/tmdatagrid/components/editors/TMDataGridNumberEditor.tsx +1 -1
- package/src/tmdatagrid/components/editors/TMDataGridSelectEditor.tsx +2 -2
- package/src/tmdatagrid/components/editors/editorShared.ts +3 -3
- package/src/tmdatagrid/components/filters/DgDateRangeFilter.tsx +1 -1
- package/src/tmdatagrid/components/filters/DgRangeSliderFilter.tsx +1 -1
- package/src/tmdatagrid/components/filters/DgTriStateFilter.tsx +1 -1
- package/src/tmdatagrid/components/filters/TMDataGridFilterValueInput.tsx +2 -2
- package/src/tmdatagrid/components/sticky.module.css +8 -8
- package/src/tmdatagrid/core/autosize.ts +4 -4
- package/src/tmdatagrid/core/capabilities.ts +17 -17
- package/src/tmdatagrid/core/cellExport.ts +13 -13
- package/src/tmdatagrid/core/cellNavigation.ts +6 -6
- package/src/tmdatagrid/core/cellRange.ts +4 -4
- package/src/tmdatagrid/core/columnOptions.ts +2 -2
- package/src/tmdatagrid/core/columnOrdering.ts +2 -2
- package/src/tmdatagrid/core/columnUtils.ts +3 -3
- package/src/tmdatagrid/core/editEngine.ts +49 -49
- package/src/tmdatagrid/core/expanding.ts +5 -5
- package/src/tmdatagrid/core/filterControls.ts +5 -5
- package/src/tmdatagrid/core/filterOperators.ts +14 -14
- package/src/tmdatagrid/core/labels.ts +8 -8
- package/src/tmdatagrid/core/matchHighlight.ts +4 -4
- package/src/tmdatagrid/core/persistence.ts +8 -8
- package/src/tmdatagrid/core/quickSearch.ts +8 -8
- package/src/tmdatagrid/core/rowPinning.ts +3 -3
- package/src/tmdatagrid/core/rowSelection.ts +12 -12
- package/src/tmdatagrid/core/sizes.ts +1 -1
- package/src/tmdatagrid/core/summary.ts +3 -3
- package/src/tmdatagrid/useTMDataGrid.tsx +79 -79
package/dist/index.d.ts
CHANGED
|
@@ -16,8 +16,8 @@ declare function TMDataGridColumnsPanel(): import("react").JSX.Element;
|
|
|
16
16
|
/**
|
|
17
17
|
* Batch mode's toolbar chrome: Save with the dirty-row count, and Discard.
|
|
18
18
|
* Both read the edit store, so they grey out while nothing is dirty and the
|
|
19
|
-
* Save spins while a submit is in flight. Works under any `editMode`
|
|
20
|
-
* cellConfirm grid accumulating drafts can offer the same pair
|
|
19
|
+
* Save spins while a submit is in flight. Works under any `editMode` - a
|
|
20
|
+
* cellConfirm grid accumulating drafts can offer the same pair - and renders
|
|
21
21
|
* nothing while editing is off.
|
|
22
22
|
*
|
|
23
23
|
* ```tsx
|
|
@@ -35,7 +35,7 @@ declare function TMDataGridEditActions(): import("react").JSX.Element | null;
|
|
|
35
35
|
* The MUI-style filter surface: one row per active column filter, each row a
|
|
36
36
|
* column / operator / value triple. It only ever reads and writes the table's
|
|
37
37
|
* `columnFilters` state, so a `manualFiltering` grid gets the same panel for
|
|
38
|
-
* free
|
|
38
|
+
* free - the state is forwarded to the server instead of a row model.
|
|
39
39
|
*/
|
|
40
40
|
declare function TMDataGridFilterPanel(): import("react").JSX.Element | null;
|
|
41
41
|
//#endregion
|
|
@@ -45,7 +45,7 @@ declare const DEFAULT_TMDATAGRID_SIZE: TMDataGridSize;
|
|
|
45
45
|
/**
|
|
46
46
|
* Row height per size, in px.
|
|
47
47
|
*
|
|
48
|
-
* The virtualizer needs this as a number
|
|
48
|
+
* The virtualizer needs this as a number - it cannot read the CSS variable -
|
|
49
49
|
* so the scale lives here and `TMDataGrid.module.css` mirrors it. `meta.rowHeight`
|
|
50
50
|
* overrides it when a grid needs a height the scale doesn't offer.
|
|
51
51
|
*/
|
|
@@ -57,7 +57,7 @@ declare const SIZE_CONTROL_SIZE: Record<TMDataGridSize, MantineSize>;
|
|
|
57
57
|
/**
|
|
58
58
|
* Row shape the chrome components work against. They only ever touch columns,
|
|
59
59
|
* rows and cells generically, so the concrete row type is erased at the context
|
|
60
|
-
* boundary
|
|
60
|
+
* boundary - the same trick Mantine uses for its compound components.
|
|
61
61
|
*/
|
|
62
62
|
type TMDataGridRowData = Record<string, unknown>;
|
|
63
63
|
type TMDataGridContextValue = TMDataGridApi<TMDataGridRowData> & {
|
|
@@ -73,7 +73,7 @@ declare function useTMDataGridContext(): TMDataGridContextValue;
|
|
|
73
73
|
*
|
|
74
74
|
* `-1` once cell selection is on, and this is what makes the promise of one tab
|
|
75
75
|
* stop true. Without it the browser walks Tab into the checkbox of every
|
|
76
|
-
* mounted row
|
|
76
|
+
* mounted row - a grid showing twenty rows would be twenty tab stops, and
|
|
77
77
|
* scrolling would change how many. Enter or F2 steps into the cell instead,
|
|
78
78
|
* which reaches a `-1` control perfectly well.
|
|
79
79
|
*
|
|
@@ -119,14 +119,14 @@ type TMDataGridOptionsArgs = {
|
|
|
119
119
|
fallback?: TMDataGridOptionsSource;
|
|
120
120
|
};
|
|
121
121
|
/**
|
|
122
|
-
* Where a column's options come from
|
|
122
|
+
* Where a column's options come from - `meta.options`. One declaration feeds
|
|
123
123
|
* both the filter panel's value control and the cell editor.
|
|
124
124
|
*
|
|
125
125
|
* | Form | For |
|
|
126
126
|
* | --- | --- |
|
|
127
127
|
* | array | a known, fixed set |
|
|
128
128
|
* | `"faceted"` | low-cardinality data columns: the distinct values present, via `getFacetedUniqueValues` |
|
|
129
|
-
* | function | large or contextual sets
|
|
129
|
+
* | function | large or contextual sets - `row` is set when an editor asks, so options can depend on the record (city given country) |
|
|
130
130
|
*/
|
|
131
131
|
type TMDataGridOptionsSource = ReadonlyArray<TMDataGridOption | string> | "faceted" | ((args: TMDataGridOptionsArgs) => ReadonlyArray<TMDataGridOption | string>);
|
|
132
132
|
/**
|
|
@@ -160,12 +160,12 @@ declare function optionsToComboboxData(options: ReadonlyArray<TMDataGridOption>)
|
|
|
160
160
|
*
|
|
161
161
|
* TanStack resolves `filterFn` statically per column, so the operator travels
|
|
162
162
|
* inside the filter *value* instead. That keeps the whole filter model plain,
|
|
163
|
-
* serialisable JSON
|
|
163
|
+
* serialisable JSON - which is what makes it portable to a server-side
|
|
164
164
|
* `manualFiltering` table (just forward `columnFilters` to the API).
|
|
165
165
|
*
|
|
166
166
|
* `value` is a string array under `isAnyOf` / `isNoneOf` (the set the cell is
|
|
167
167
|
* tested against), a `[min, max]` pair under `between` (an empty string means
|
|
168
|
-
* that end is open), and a single string everywhere else
|
|
168
|
+
* that end is open), and a single string everywhere else - dates travel as
|
|
169
169
|
* ISO `YYYY-MM-DD` strings, booleans as `"true"` / `"false"`. Still plain
|
|
170
170
|
* JSON.
|
|
171
171
|
*/
|
|
@@ -179,11 +179,11 @@ declare const FILTER_OPERATOR_LABELS: Record<TMDataGridFilterOperator, string>;
|
|
|
179
179
|
declare function getOperatorsForType(type: TMDataGridColumnType): readonly TMDataGridFilterOperator[];
|
|
180
180
|
declare function getDefaultOperator(type: TMDataGridColumnType): TMDataGridFilterOperator;
|
|
181
181
|
declare function operatorNeedsValue(operator: TMDataGridFilterOperator): boolean;
|
|
182
|
-
/** Whether the operator's value is a string array
|
|
182
|
+
/** Whether the operator's value is a string array - `isAnyOf` / `isNoneOf`. */
|
|
183
183
|
declare function operatorTakesArrayValue(operator: TMDataGridFilterOperator): boolean;
|
|
184
|
-
/** Whether the operator's value is a `[min, max]` pair
|
|
184
|
+
/** Whether the operator's value is a `[min, max]` pair - `between`. */
|
|
185
185
|
declare function operatorTakesRangeValue(operator: TMDataGridFilterOperator): boolean;
|
|
186
|
-
/** The untouched value a fresh filter starts with
|
|
186
|
+
/** The untouched value a fresh filter starts with - the operator's shape, empty. */
|
|
187
187
|
declare function emptyValueForOperator(operator: TMDataGridFilterOperator): string | ReadonlyArray<string>;
|
|
188
188
|
/**
|
|
189
189
|
* A filter only narrows the row set once it has something to compare against.
|
|
@@ -194,15 +194,15 @@ declare function isFilterActive(value: unknown): boolean;
|
|
|
194
194
|
/**
|
|
195
195
|
* One-line description of a single filter, as shown on a filter pill.
|
|
196
196
|
*
|
|
197
|
-
* The type's default operator is left implicit
|
|
198
|
-
* way a person would say it
|
|
197
|
+
* The type's default operator is left implicit - "First name: Sofia" reads the
|
|
198
|
+
* way a person would say it - while any other operator is spelled out, since
|
|
199
199
|
* that is the part a reader cannot guess.
|
|
200
200
|
*/
|
|
201
201
|
declare function formatFilterLabel({ label, type, filter, operatorLabels }: {
|
|
202
202
|
label: string;
|
|
203
203
|
type: TMDataGridColumnType;
|
|
204
204
|
filter: TMDataGridFilterValue;
|
|
205
|
-
/** Localized operator names
|
|
205
|
+
/** Localized operator names - `labels.operators`. Defaults to English. */
|
|
206
206
|
operatorLabels?: Record<TMDataGridFilterOperator, string>;
|
|
207
207
|
}): string;
|
|
208
208
|
/**
|
|
@@ -214,33 +214,33 @@ declare function tmDataGridFilterFn<TFeatures extends TableFeatures, TData exten
|
|
|
214
214
|
//#endregion
|
|
215
215
|
//#region .types-tmp/core/editEngine.d.ts
|
|
216
216
|
/**
|
|
217
|
-
* How commits happen
|
|
217
|
+
* How commits happen - one axis, each mode a thin policy over the same
|
|
218
218
|
* engine. See `editMode` on `UseTMDataGridOptions`.
|
|
219
219
|
*/
|
|
220
220
|
type TMDataGridEditMode = "cell" | "cellConfirm" | "row" | "batch";
|
|
221
221
|
/**
|
|
222
222
|
* One editing row's live form. TanStack Form's `FormApi`, not a wrapper: the
|
|
223
|
-
* engine is a form library, and everything mid-edit
|
|
224
|
-
* errors, async validation, submit lifecycle
|
|
223
|
+
* engine is a form library, and everything mid-edit - values, dirty state,
|
|
224
|
+
* errors, async validation, submit lifecycle - is form state, read off
|
|
225
225
|
* `form.store` with the same selector idiom as the rest of the grid.
|
|
226
226
|
*
|
|
227
227
|
* The alias erases Form's validator generics the way `TMDataGridRowData`
|
|
228
228
|
* erases the row type: the concrete types lived at the `useTMDataGrid` call.
|
|
229
229
|
*/
|
|
230
230
|
type TMDataGridRowEditForm = AnyFormApi;
|
|
231
|
-
/** The live field a cell editor binds to
|
|
231
|
+
/** The live field a cell editor binds to - TanStack Form's own `FieldApi`. */
|
|
232
232
|
type TMDataGridEditField = AnyFieldApi;
|
|
233
233
|
/**
|
|
234
234
|
* A validator as TanStack Form takes it: a Standard Schema (Zod, Valibot,
|
|
235
235
|
* ArkType…) or a plain function returning an error or nothing. Forwarded
|
|
236
|
-
* untouched
|
|
236
|
+
* untouched - the vocabulary is Form's, not a grid re-implementation.
|
|
237
237
|
*/
|
|
238
238
|
type TMDataGridValidator = StandardSchemaV1<unknown, unknown> | ((args: {
|
|
239
239
|
value: never;
|
|
240
240
|
fieldApi: never;
|
|
241
241
|
}) => unknown);
|
|
242
242
|
/**
|
|
243
|
-
* `meta.validate`
|
|
243
|
+
* `meta.validate` - per-column field validators. A bare schema or function is
|
|
244
244
|
* shorthand for `{ onChange: it }`; the object form takes every trigger
|
|
245
245
|
* TanStack Form defines, `Async` variants and debounce included.
|
|
246
246
|
*/
|
|
@@ -255,7 +255,7 @@ type TMDataGridFieldValidate = TMDataGridValidator | {
|
|
|
255
255
|
onSubmitAsync?: TMDataGridValidator;
|
|
256
256
|
};
|
|
257
257
|
/**
|
|
258
|
-
* `rowValidators`
|
|
258
|
+
* `rowValidators` - form-level validators for the whole row, where
|
|
259
259
|
* cross-field rules live. Passed into each row form's `validators` untouched;
|
|
260
260
|
* pathed issues land on the matching fields, pathless ones on the row.
|
|
261
261
|
*/
|
|
@@ -274,29 +274,29 @@ type TMDataGridRowValidators = {
|
|
|
274
274
|
type TMDataGridEditChange = {
|
|
275
275
|
/** Column the field maps back to, for consumers thinking in columns. */
|
|
276
276
|
columnId: string;
|
|
277
|
-
/** The data path
|
|
277
|
+
/** The data path - `getEditFieldName` of the column. */
|
|
278
278
|
field: string;
|
|
279
279
|
previous: unknown;
|
|
280
280
|
next: unknown;
|
|
281
281
|
};
|
|
282
282
|
type TMDataGridEditCommitArgs<TData extends RowData> = {
|
|
283
283
|
rowId: string;
|
|
284
|
-
/** The whole row as edited
|
|
284
|
+
/** The whole row as edited - for the consumer who saves records. */
|
|
285
285
|
value: TData;
|
|
286
286
|
/** The row as it was when editing began. */
|
|
287
287
|
original: TData;
|
|
288
|
-
/** Per-field diff
|
|
288
|
+
/** Per-field diff - for the consumer who PATCHes. One entry in cell mode. */
|
|
289
289
|
changes: Array<TMDataGridEditChange>;
|
|
290
290
|
/** Which policy committed. */
|
|
291
291
|
source: TMDataGridEditMode;
|
|
292
292
|
};
|
|
293
|
-
/** What one open row's form looks like from outside
|
|
293
|
+
/** What one open row's form looks like from outside - the cell markers. */
|
|
294
294
|
type TMDataGridEditRowProjection = {
|
|
295
295
|
/** Field names whose value differs from the original. */
|
|
296
296
|
dirtyFields: ReadonlyArray<string>;
|
|
297
297
|
/** Field names carrying a validation error. */
|
|
298
298
|
errorFields: ReadonlyArray<string>;
|
|
299
|
-
/** A row-level error
|
|
299
|
+
/** A row-level error - a pathless `.refine()`, or a rejected commit. */
|
|
300
300
|
hasRowError: boolean;
|
|
301
301
|
isSubmitting: boolean;
|
|
302
302
|
};
|
|
@@ -304,7 +304,7 @@ type TMDataGridEditRowProjection = {
|
|
|
304
304
|
* The grid-facing index of everything mid-edit. A projection synced from the
|
|
305
305
|
* open forms' stores, so body cells subscribe to this one store for their
|
|
306
306
|
* dirty/error markers instead of one store per form. Only the editor host
|
|
307
|
-
* reads a form's store directly
|
|
307
|
+
* reads a form's store directly - it is mounted for one cell at a time.
|
|
308
308
|
*/
|
|
309
309
|
type TMDataGridEditState = {
|
|
310
310
|
/** The cell whose editor is open; `columnId: null` is a whole row (row mode). */
|
|
@@ -315,24 +315,24 @@ type TMDataGridEditState = {
|
|
|
315
315
|
/** Rows with a live form. In cell mode at most one; in batch, many. */
|
|
316
316
|
openRowIds: ReadonlyArray<string>;
|
|
317
317
|
rows: Record<string, TMDataGridEditRowProjection>;
|
|
318
|
-
/** Phase 4
|
|
318
|
+
/** Phase 4 - rows being created, not yet in `data`. */
|
|
319
319
|
newRows: ReadonlyArray<{
|
|
320
320
|
tempId: string;
|
|
321
321
|
}>;
|
|
322
|
-
/** Phase 4
|
|
322
|
+
/** Phase 4 - rows marked deleted under batch mode. */
|
|
323
323
|
deletedRowIds: ReadonlyArray<string>;
|
|
324
324
|
};
|
|
325
325
|
type ErasedRow = Row<TMDataGridFeatures, TMDataGridRowData>;
|
|
326
326
|
type ErasedColumn = Column<TMDataGridFeatures, TMDataGridRowData, unknown>;
|
|
327
327
|
/**
|
|
328
|
-
* What a cell editor is handed
|
|
328
|
+
* What a cell editor is handed - deliberately both vocabularies at once. The
|
|
329
329
|
* form side is TanStack Form's real `field` API (`field.state.value`,
|
|
330
330
|
* `field.state.meta.errors`, `field.handleChange`, `field.handleBlur`), so a
|
|
331
331
|
* custom calendar, slider or async combobox binds to it exactly as it would
|
|
332
332
|
* inside any TanStack Form. The table side is where the editor is standing.
|
|
333
333
|
*
|
|
334
334
|
* The built-ins are implemented against this same contract, so
|
|
335
|
-
* `meta.editor` is not a special case
|
|
335
|
+
* `meta.editor` is not a special case - it is the slot the defaults
|
|
336
336
|
* fill, and the exported built-ins can be wrapped instead of replaced.
|
|
337
337
|
*/
|
|
338
338
|
type TMDataGridEditorArgs = {
|
|
@@ -344,9 +344,9 @@ type TMDataGridEditorArgs = {
|
|
|
344
344
|
row: ErasedRow;
|
|
345
345
|
column: ErasedColumn;
|
|
346
346
|
table: TMDataGridTable<TMDataGridRowData>;
|
|
347
|
-
/** What Enter would do
|
|
347
|
+
/** What Enter would do - commit the edit. For the editor's own UI. */
|
|
348
348
|
commit: () => Promise<boolean>;
|
|
349
|
-
/** What Escape would do
|
|
349
|
+
/** What Escape would do - drop the draft. */
|
|
350
350
|
cancel: () => void;
|
|
351
351
|
size: TMDataGridSize;
|
|
352
352
|
/**
|
|
@@ -355,29 +355,29 @@ type TMDataGridEditorArgs = {
|
|
|
355
355
|
*/
|
|
356
356
|
autoFocus: boolean;
|
|
357
357
|
/**
|
|
358
|
-
* Set when typing opened the editor (the Sheets gesture)
|
|
358
|
+
* Set when typing opened the editor (the Sheets gesture) - the built-ins
|
|
359
359
|
* replace the value with it and keep typing. A custom editor may ignore it.
|
|
360
360
|
*/
|
|
361
361
|
seedText?: string;
|
|
362
362
|
};
|
|
363
363
|
/**
|
|
364
|
-
* `meta.editor`
|
|
364
|
+
* `meta.editor` - replaces the built-in editor for this column. Rendered as
|
|
365
365
|
* JSX, never invoked as a bare function, so hooks are legal inside. Define it
|
|
366
366
|
* at module scope: a new identity per render remounts the editor mid-edit.
|
|
367
367
|
*/
|
|
368
368
|
type TMDataGridEditorComponent = ComponentType<TMDataGridEditorArgs>;
|
|
369
|
-
/** A new row being committed
|
|
369
|
+
/** A new row being committed - `onRowAdd`, and `submitAll`'s `added`. */
|
|
370
370
|
type TMDataGridRowAddArgs<TData extends RowData> = {
|
|
371
371
|
/** The engine's placeholder id; the real id is the consumer's to mint. */
|
|
372
372
|
tempId: string;
|
|
373
373
|
value: TData;
|
|
374
374
|
};
|
|
375
|
-
/** A deletion
|
|
375
|
+
/** A deletion - `onRowDelete`. */
|
|
376
376
|
type TMDataGridRowDeleteArgs<TData extends RowData> = {
|
|
377
377
|
rowId: string;
|
|
378
378
|
row: Row<TMDataGridFeatures, TData>;
|
|
379
379
|
};
|
|
380
|
-
/** What `submitAll` hands `onEditCommitBatch`
|
|
380
|
+
/** What `submitAll` hands `onEditCommitBatch` - everything pending at once. */
|
|
381
381
|
type TMDataGridEditCommitBatchArgs<TData extends RowData> = {
|
|
382
382
|
/** Every valid dirty existing row. */
|
|
383
383
|
rows: Array<TMDataGridEditCommitArgs<TData>>;
|
|
@@ -393,7 +393,7 @@ type TMDataGridEditCommitBatchArgs<TData extends RowData> = {
|
|
|
393
393
|
* nested rows work for free: `accessorKey: "address.city"` edits
|
|
394
394
|
* `values.address.city`. A column built on `accessorFn` has no path and is
|
|
395
395
|
* not editable unless `meta.editField` names one. TanStack's default column
|
|
396
|
-
* id turns dots into underscores
|
|
396
|
+
* id turns dots into underscores - which is why this starts from
|
|
397
397
|
* `accessorKey`, never from `id`.
|
|
398
398
|
*/
|
|
399
399
|
declare function getEditFieldName(column: {
|
|
@@ -403,17 +403,17 @@ declare function getEditFieldName(column: {
|
|
|
403
403
|
};
|
|
404
404
|
};
|
|
405
405
|
}): string | null;
|
|
406
|
-
/** What Delete writes into a cell
|
|
406
|
+
/** What Delete writes into a cell - the type's honest empty value. */
|
|
407
407
|
declare function clearedValueForType(type: TMDataGridColumnType): unknown;
|
|
408
408
|
/**
|
|
409
|
-
* The engine plus its store
|
|
409
|
+
* The engine plus its store - `api.edit`.
|
|
410
410
|
*
|
|
411
411
|
* "One row, one form": `getForm` hands out the same `FormApi` the inline
|
|
412
412
|
* editors write through, so a consumer can render it in a drawer or a detail
|
|
413
413
|
* panel and share values, dirty state and errors with the cells.
|
|
414
414
|
*/
|
|
415
415
|
type TMDataGridEditApi = {
|
|
416
|
-
/** The projection store
|
|
416
|
+
/** The projection store - subscribe with `useSelector(edit.store, …)`. */
|
|
417
417
|
store: Store<TMDataGridEditState>;
|
|
418
418
|
/** Current snapshot, for reads outside React. */
|
|
419
419
|
readonly state: TMDataGridEditState;
|
|
@@ -424,7 +424,7 @@ type TMDataGridEditApi = {
|
|
|
424
424
|
* switched it off, and the row takes edits at all.
|
|
425
425
|
*/
|
|
426
426
|
canEditCell: (row: ErasedRow, column: ErasedColumn) => boolean;
|
|
427
|
-
/** Whether the row takes edits at all
|
|
427
|
+
/** Whether the row takes edits at all - the edit lane's pencil gate. */
|
|
428
428
|
canEditRow: (row: ErasedRow) => boolean;
|
|
429
429
|
/** Opens an editor. `columnId: null` opens the whole row (row mode). */
|
|
430
430
|
begin: (target: {
|
|
@@ -432,7 +432,7 @@ type TMDataGridEditApi = {
|
|
|
432
432
|
columnId: string | null;
|
|
433
433
|
}) => void;
|
|
434
434
|
/**
|
|
435
|
-
* Commits one row
|
|
435
|
+
* Commits one row - `form.handleSubmit` under the hood. Resolves `true`
|
|
436
436
|
* when the form is gone: validation passed and `onEditCommit` resolved, or
|
|
437
437
|
* there was nothing to save. `false` keeps the form open with its errors.
|
|
438
438
|
*/
|
|
@@ -440,42 +440,42 @@ type TMDataGridEditApi = {
|
|
|
440
440
|
/** Drops one row's draft. */
|
|
441
441
|
cancel: (rowId: string) => void;
|
|
442
442
|
/**
|
|
443
|
-
* Closes the editor without touching the draft
|
|
443
|
+
* Closes the editor without touching the draft - what blur does under
|
|
444
444
|
* `"cellConfirm"`, where the dirty cell keeps waiting for its ✓.
|
|
445
445
|
*/
|
|
446
446
|
deactivate: () => void;
|
|
447
447
|
/** Drops every draft. */
|
|
448
448
|
cancelAll: () => void;
|
|
449
|
-
/** Commits every open row
|
|
449
|
+
/** Commits every open row - batch mode's save. `true` when all landed. */
|
|
450
450
|
submitAll: () => Promise<boolean>;
|
|
451
|
-
/** Writes the type's empty value into a cell and commits it
|
|
451
|
+
/** Writes the type's empty value into a cell and commits it - Delete. */
|
|
452
452
|
clearCell: (rowId: string, columnId: string) => Promise<boolean>;
|
|
453
453
|
/**
|
|
454
454
|
* Opens a new entry row (the sticky block under the header) seeded from
|
|
455
|
-
* `newRowDefaults`. Returns its temporary id
|
|
455
|
+
* `newRowDefaults`. Returns its temporary id - a form with no backing row
|
|
456
456
|
* yet. Committing it calls `onRowAdd` (immediate modes) or joins
|
|
457
457
|
* `submitAll`'s `added` (batch).
|
|
458
458
|
*/
|
|
459
459
|
addRow: () => string;
|
|
460
460
|
/**
|
|
461
461
|
* Deletes a row: `onRowDelete` straight away under the immediate modes;
|
|
462
|
-
* under batch it toggles the id in `deletedRowIds`
|
|
462
|
+
* under batch it toggles the id in `deletedRowIds` - the row renders
|
|
463
463
|
* struck through until `submitAll` reports it. On an uncommitted entry
|
|
464
464
|
* row it just discards the entry.
|
|
465
465
|
*/
|
|
466
466
|
deleteRow: (rowId: string) => void;
|
|
467
|
-
/** Whether delete chrome makes sense
|
|
467
|
+
/** Whether delete chrome makes sense - the lane's trash gate. */
|
|
468
468
|
canDeleteRows: () => boolean;
|
|
469
469
|
};
|
|
470
470
|
/**
|
|
471
471
|
* `meta.validate` normalised to the object TanStack Form's `validators`
|
|
472
|
-
* option takes
|
|
472
|
+
* option takes - a bare schema or function is shorthand for `{ onChange }`.
|
|
473
473
|
*/
|
|
474
474
|
declare function normalizeFieldValidate(validate: TMDataGridFieldValidate | undefined): Record<string, unknown> | undefined;
|
|
475
475
|
//#endregion
|
|
476
476
|
//#region .types-tmp/core/labels.d.ts
|
|
477
477
|
/**
|
|
478
|
-
* Every user-facing string in the grid
|
|
478
|
+
* Every user-facing string in the grid - menu items, panels, tooltips, the
|
|
479
479
|
* pager, and the `aria-label`s a screen reader speaks. One flat object, so an
|
|
480
480
|
* override is a spread rather than a deep merge; `operators` is the single
|
|
481
481
|
* nested record and {@link mergeLabels} folds it separately.
|
|
@@ -486,9 +486,9 @@ declare function normalizeFieldValidate(validate: TMDataGridFieldValidate | unde
|
|
|
486
486
|
type TMDataGridLabels = {
|
|
487
487
|
/** Filter operator names, as shown in the operator dropdown and on pills. */
|
|
488
488
|
operators: Record<TMDataGridFilterOperator, string>;
|
|
489
|
-
/** "Manage columns"
|
|
489
|
+
/** "Manage columns" - the burger button and the header menu item. */
|
|
490
490
|
manageColumns: string;
|
|
491
|
-
/** "Filters"
|
|
491
|
+
/** "Filters" - the funnel button and the filter panel's title. */
|
|
492
492
|
filters: string;
|
|
493
493
|
searchPlaceholder: string;
|
|
494
494
|
searchLabel: string;
|
|
@@ -502,7 +502,7 @@ type TMDataGridLabels = {
|
|
|
502
502
|
/** Menu/panel name of the generated row-number gutter. */
|
|
503
503
|
rowNumberColumnLabel: string;
|
|
504
504
|
/**
|
|
505
|
-
* The truly-empty message
|
|
505
|
+
* The truly-empty message - no data and no filters. Filtered-empty says
|
|
506
506
|
* {@link noResults} instead; only one of the two is the user's own doing.
|
|
507
507
|
*/
|
|
508
508
|
noRows: string;
|
|
@@ -516,7 +516,7 @@ type TMDataGridLabels = {
|
|
|
516
516
|
filterTo: string;
|
|
517
517
|
/** `DgTriStateFilter`'s no-filter segment. */
|
|
518
518
|
filterAll: string;
|
|
519
|
-
/** What a boolean column's `true` reads as
|
|
519
|
+
/** What a boolean column's `true` reads as - its filter choice and cell text. */
|
|
520
520
|
booleanTrue: string;
|
|
521
521
|
booleanFalse: string;
|
|
522
522
|
addFilter: string;
|
|
@@ -574,9 +574,9 @@ type TMDataGridLabels = {
|
|
|
574
574
|
saveAllEdits: (rows: number) => string;
|
|
575
575
|
/** `EditActions`' Discard. */
|
|
576
576
|
discardAllEdits: string;
|
|
577
|
-
/** The entry row's ✓
|
|
577
|
+
/** The entry row's ✓ - commit the add. */
|
|
578
578
|
confirmNewRow: string;
|
|
579
|
-
/** The entry row's ✕
|
|
579
|
+
/** The entry row's ✕ - drop the entry. */
|
|
580
580
|
discardNewRow: string;
|
|
581
581
|
/** The lane's trash can. */
|
|
582
582
|
deleteRow: string;
|
|
@@ -602,7 +602,7 @@ type TMDataGridLabels = {
|
|
|
602
602
|
};
|
|
603
603
|
/**
|
|
604
604
|
* What the `labels` option accepts: any subset, merged over the English
|
|
605
|
-
* defaults
|
|
605
|
+
* defaults - so `{ noResults: "Inga rader" }` is a complete configuration.
|
|
606
606
|
*/
|
|
607
607
|
type TMDataGridLabelsOverride = Partial<Omit<TMDataGridLabels, "operators">> & {
|
|
608
608
|
operators?: Partial<Record<TMDataGridFilterOperator, string>>;
|
|
@@ -614,13 +614,13 @@ declare function mergeLabels(override?: TMDataGridLabelsOverride): TMDataGridLab
|
|
|
614
614
|
//#endregion
|
|
615
615
|
//#region .types-tmp/core/filterControls.d.ts
|
|
616
616
|
/**
|
|
617
|
-
* What a filter control is handed
|
|
617
|
+
* What a filter control is handed - the value slot of one filter-panel row.
|
|
618
618
|
*
|
|
619
619
|
* The contract is value-only: the control reads `operator` to shape itself
|
|
620
620
|
* (a `between` pair renders two ends, an `equals` a single input) and calls
|
|
621
621
|
* `onChange` with the bare value; the grid composes the operator-aware
|
|
622
622
|
* `TMDataGridFilterValue` around it. A control never builds that wrapper and
|
|
623
|
-
* never writes the operator
|
|
623
|
+
* never writes the operator - `table` is the escape hatch for the rare
|
|
624
624
|
* control that must.
|
|
625
625
|
*/
|
|
626
626
|
type TMDataGridFilterControlArgs = {
|
|
@@ -628,13 +628,13 @@ type TMDataGridFilterControlArgs = {
|
|
|
628
628
|
table: TMDataGridTable<TMDataGridRowData>;
|
|
629
629
|
/** The row's currently selected operator. Read-only for the control. */
|
|
630
630
|
operator: TMDataGridFilterOperator;
|
|
631
|
-
/** The bare filter value
|
|
631
|
+
/** The bare filter value - never the `{ operator, value }` wrapper. */
|
|
632
632
|
value: string | ReadonlyArray<string>;
|
|
633
633
|
/** Writes the bare value; the grid pairs it with the current operator. */
|
|
634
634
|
onChange: (next: string | ReadonlyArray<string>) => void;
|
|
635
635
|
/**
|
|
636
636
|
* The column's options through `resolveColumnOptions`, pre-resolved for a
|
|
637
|
-
* column that declares `meta.options` or is select-shaped. Empty otherwise
|
|
637
|
+
* column that declares `meta.options` or is select-shaped. Empty otherwise -
|
|
638
638
|
* a control wanting faceted values on other columns resolves them itself.
|
|
639
639
|
*/
|
|
640
640
|
options: ReadonlyArray<TMDataGridOption>;
|
|
@@ -642,14 +642,14 @@ type TMDataGridFilterControlArgs = {
|
|
|
642
642
|
labels: TMDataGridLabels;
|
|
643
643
|
};
|
|
644
644
|
/**
|
|
645
|
-
* `meta.filterControl`
|
|
645
|
+
* `meta.filterControl` - replaces the built-in value control for this column.
|
|
646
646
|
* Rendered as JSX, never invoked as a bare function, so hooks are legal
|
|
647
647
|
* inside. Define it at module scope so its identity is stable across renders.
|
|
648
648
|
*/
|
|
649
649
|
type TMDataGridFilterControlComponent = ComponentType<TMDataGridFilterControlArgs>;
|
|
650
650
|
//#endregion
|
|
651
651
|
//#region .types-tmp/core/quickSearch.d.ts
|
|
652
|
-
/** How the quick search matches
|
|
652
|
+
/** How the quick search matches - see `quickSearchMode` on the hook options. */
|
|
653
653
|
type TMDataGridQuickSearchMode = "fuzzy" | "contains";
|
|
654
654
|
/** What {@link fuzzyGlobalFilterFn} records per column via `addMeta`. */
|
|
655
655
|
type FuzzyFilterMeta = {
|
|
@@ -657,8 +657,8 @@ type FuzzyFilterMeta = {
|
|
|
657
657
|
};
|
|
658
658
|
/**
|
|
659
659
|
* Match-sorter ranking as the global filter: a row passes when a globally
|
|
660
|
-
* filterable column ranks above match-sorter's threshold
|
|
661
|
-
* characters forgiven
|
|
660
|
+
* filterable column ranks above match-sorter's threshold - typos and skipped
|
|
661
|
+
* characters forgiven - and the rank is recorded for the ordering to read.
|
|
662
662
|
*
|
|
663
663
|
* TanStack stops probing a row's columns at the first passing one, so the
|
|
664
664
|
* recorded ranks cover the columns up to and including it; the best of those
|
|
@@ -699,8 +699,8 @@ type TMDataGridSettingsSlice = (typeof SETTINGS_STATE_SLICES)[number];
|
|
|
699
699
|
/**
|
|
700
700
|
* A storage key, optionally narrowed to a subset of its group's slices.
|
|
701
701
|
*
|
|
702
|
-
* - `"employees.data"`
|
|
703
|
-
* - `["employees.data", ["sorting"]]`
|
|
702
|
+
* - `"employees.data"` - persists every slice in the group.
|
|
703
|
+
* - `["employees.data", ["sorting"]]` - persists only the listed slices.
|
|
704
704
|
*/
|
|
705
705
|
type TMDataGridPersistKey<TSlice extends string> = string | readonly [key: string, slices: readonly TSlice[]];
|
|
706
706
|
/** Same values as Mantine's `StorageType`, which the package does not re-export. */
|
|
@@ -722,7 +722,7 @@ type TMDataGridPersistence = {
|
|
|
722
722
|
* collide with. A payload whose version does not match is dropped whole: a
|
|
723
723
|
* migration would be guessing at a shape this code no longer knows, and the
|
|
724
724
|
* cost of dropping is one lost layout. Payloads written before versioning
|
|
725
|
-
* existed (≤0.4.0) have no stamp and are dropped the same way
|
|
725
|
+
* existed (≤0.4.0) have no stamp and are dropped the same way - the 1.0
|
|
726
726
|
* wave's one-time break, named in its changeset.
|
|
727
727
|
*/
|
|
728
728
|
declare const PERSIST_PAYLOAD_VERSION = 1;
|
|
@@ -741,10 +741,10 @@ declare const PERSIST_PAYLOAD_VERSION = 1;
|
|
|
741
741
|
* what applies the per-column overrides.
|
|
742
742
|
*/
|
|
743
743
|
/**
|
|
744
|
-
* How rows are selected
|
|
744
|
+
* How rows are selected - see `selectionMode` on {@link UseTMDataGridOptions}.
|
|
745
745
|
*
|
|
746
|
-
* One axis, because the two things a config could set independently
|
|
747
|
-
* chrome selects, and what a bare row click does
|
|
746
|
+
* One axis, because the two things a config could set independently - which
|
|
747
|
+
* chrome selects, and what a bare row click does - cannot both be free: a click
|
|
748
748
|
* can either toggle a multi-selection or move the highlight, never both. Folding
|
|
749
749
|
* them into one value makes that conflict unrepresentable rather than something
|
|
750
750
|
* to warn about.
|
|
@@ -756,10 +756,10 @@ type TMDataGridSelectionMode =
|
|
|
756
756
|
"row" |
|
|
757
757
|
/** Checkbox column multi-selects, and a row click highlights one row. */
|
|
758
758
|
"checkboxAndHighlight" |
|
|
759
|
-
/** No selection at all
|
|
759
|
+
/** No selection at all - a row click only highlights. Master-detail. */
|
|
760
760
|
"highlight";
|
|
761
761
|
/**
|
|
762
|
-
* How cells are selected
|
|
762
|
+
* How cells are selected - see `cellSelection` on {@link UseTMDataGridOptions}.
|
|
763
763
|
*
|
|
764
764
|
* A mode rather than a pair of booleans, for the reason
|
|
765
765
|
* {@link TMDataGridSelectionMode} is one: "cells can be selected" and "more
|
|
@@ -776,7 +776,7 @@ type TMDataGridCellSelectionMode =
|
|
|
776
776
|
type TMDataGridFeatureFlags = {
|
|
777
777
|
sorting: boolean;
|
|
778
778
|
filtering: boolean;
|
|
779
|
-
/** Whether the quick search may filter
|
|
779
|
+
/** Whether the quick search may filter - `enableGlobalFilter`. */
|
|
780
780
|
globalFiltering: boolean;
|
|
781
781
|
hiding: boolean;
|
|
782
782
|
pinning: boolean;
|
|
@@ -791,7 +791,7 @@ type TMDataGridFeatureFlags = {
|
|
|
791
791
|
/** Whether a bare row click toggles the selection. Only under `"row"`. */
|
|
792
792
|
rowClickSelects: boolean;
|
|
793
793
|
/**
|
|
794
|
-
* Whether more than one row can be selected at once
|
|
794
|
+
* Whether more than one row can be selected at once - TanStack's
|
|
795
795
|
* `enableMultiRowSelection`. Off, the grid drops the select-all header
|
|
796
796
|
* checkbox: TanStack's `toggleAllRowsSelected` only consults `getCanSelect`,
|
|
797
797
|
* so that control would select every row and walk straight past the limit.
|
|
@@ -802,14 +802,14 @@ type TMDataGridFeatureFlags = {
|
|
|
802
802
|
/** Whether a selected row takes the highlight colour. Follows the mode. */
|
|
803
803
|
showSelectedBackground: boolean;
|
|
804
804
|
/**
|
|
805
|
-
* The single highlighted row
|
|
805
|
+
* The single highlighted row - clicking a row highlights it, for a detail
|
|
806
806
|
* panel to follow. State of its own, not a slice of `rowSelection`, which is
|
|
807
807
|
* what lets it coexist with a checkbox multi-selection.
|
|
808
808
|
*/
|
|
809
809
|
highlightRow: boolean;
|
|
810
810
|
/**
|
|
811
811
|
* Whether cells can be selected at all. Off unless `cellSelection` asks for
|
|
812
|
-
* it
|
|
812
|
+
* it - it takes the body's tab stop off the row and puts it on a cell, and
|
|
813
813
|
* reports the grid to assistive technology as a `grid` rather than a `table`,
|
|
814
814
|
* which is a different promise about what the keyboard does.
|
|
815
815
|
*/
|
|
@@ -827,7 +827,7 @@ type TMDataGridFeatureFlags = {
|
|
|
827
827
|
/**
|
|
828
828
|
* Row grouping: the "Group by" items in the header menu and the generated
|
|
829
829
|
* tree column. On unless `enableGrouping: false`, since an ungrouped grid
|
|
830
|
-
* looks and behaves exactly as it did before
|
|
830
|
+
* looks and behaves exactly as it did before - `grouping` starts empty, and
|
|
831
831
|
* an empty grouping state passes straight through the row model.
|
|
832
832
|
*
|
|
833
833
|
* The exception is `manualPagination`, where the client holds one page rather
|
|
@@ -836,14 +836,14 @@ type TMDataGridFeatureFlags = {
|
|
|
836
836
|
* its own grouping can still say `enableGrouping: true` to override.
|
|
837
837
|
*/
|
|
838
838
|
grouping: boolean;
|
|
839
|
-
/** Whether cells can be edited at all
|
|
839
|
+
/** Whether cells can be edited at all - `editMode` was set. */
|
|
840
840
|
editing: boolean;
|
|
841
841
|
/** The commit policy, or `null` while editing is off. */
|
|
842
842
|
editMode: TMDataGridEditMode | null;
|
|
843
|
-
/** The generated row-number gutter
|
|
843
|
+
/** The generated row-number gutter - `enableRowNumbers`. Off by default. */
|
|
844
844
|
rowNumbers: boolean;
|
|
845
845
|
/**
|
|
846
|
-
* Whether rows can be pinned to the top or bottom edge
|
|
846
|
+
* Whether rows can be pinned to the top or bottom edge - `enableRowPinning`,
|
|
847
847
|
* boolean or per-row predicate. Off by default: pinning has no built-in
|
|
848
848
|
* gesture, so a grid that never calls `row.pin()` has nothing to gain from
|
|
849
849
|
* the body watching the state.
|
|
@@ -851,7 +851,7 @@ type TMDataGridFeatureFlags = {
|
|
|
851
851
|
rowPinning: boolean;
|
|
852
852
|
/**
|
|
853
853
|
* Whether cells highlight the matched text while a contains-family filter
|
|
854
|
-
* or the quick search is active
|
|
854
|
+
* or the quick search is active - `enableMatchHighlighting`. Off by
|
|
855
855
|
* default, so a grid that has not asked pays nothing per cell.
|
|
856
856
|
*/
|
|
857
857
|
matchHighlighting: boolean;
|
|
@@ -880,7 +880,7 @@ type TMDataGridColumnCapabilities = {
|
|
|
880
880
|
canGroup: boolean;
|
|
881
881
|
};
|
|
882
882
|
declare function getColumnCapabilities(column: Column<TMDataGridFeatures, TMDataGridRowData, unknown>, features: TMDataGridFeatureFlags): TMDataGridColumnCapabilities;
|
|
883
|
-
/** The same questions, asked of the whole grid
|
|
883
|
+
/** The same questions, asked of the whole grid - used to hide toolbar buttons. */
|
|
884
884
|
type TMDataGridCapabilities = {
|
|
885
885
|
canSortAny: boolean;
|
|
886
886
|
canFilterAny: boolean;
|
|
@@ -902,7 +902,7 @@ declare function getGridCapabilities(table: TMDataGridTable<TMDataGridRowData>,
|
|
|
902
902
|
* Ids, because every other thing the grid does moves cells around: sorting
|
|
903
903
|
* reorders rows, filtering removes them, dragging a header reorders columns. A
|
|
904
904
|
* coordinate pair would silently come to mean a different cell after any of
|
|
905
|
-
* them, while a pair of ids either still resolves or does not resolve at all
|
|
905
|
+
* them, while a pair of ids either still resolves or does not resolve at all -
|
|
906
906
|
* and "does not resolve" is a state the grid can handle honestly.
|
|
907
907
|
*
|
|
908
908
|
* Indices are what navigation is actually computed in, so they are resolved
|
|
@@ -920,7 +920,7 @@ type TMDataGridCellCoords = {
|
|
|
920
920
|
type ResolveCellMoveArgs = {
|
|
921
921
|
/** `KeyboardEvent.key`. */
|
|
922
922
|
key: string;
|
|
923
|
-
/** Ctrl or Cmd
|
|
923
|
+
/** Ctrl or Cmd - Home and End jump to the corner rather than the row end. */
|
|
924
924
|
ctrlKey: boolean;
|
|
925
925
|
from: TMDataGridCellCoords;
|
|
926
926
|
rowCount: number;
|
|
@@ -937,7 +937,7 @@ type ResolveCellMoveArgs = {
|
|
|
937
937
|
* Moves clamp at the edges instead of wrapping. Wrapping suits a menu, where
|
|
938
938
|
* the items are a short ring; a grid is a coordinate space, and a Right at the
|
|
939
939
|
* last column that lands on the first column of the next row loses the one
|
|
940
|
-
* thing arrow keys are for
|
|
940
|
+
* thing arrow keys are for - knowing where you will end up without looking.
|
|
941
941
|
*
|
|
942
942
|
* A clamped move returns the position it started from rather than `null`. The
|
|
943
943
|
* caller still needs to know the key was handled: an arrow at the last row must
|
|
@@ -953,13 +953,13 @@ declare function isSameCell(a: TMDataGridCellPosition | null, b: TMDataGridCellP
|
|
|
953
953
|
* A selected rectangle of cells, held as the two cells that span it.
|
|
954
954
|
*
|
|
955
955
|
* Two corners rather than a list of cells, because a range is a gesture, not a
|
|
956
|
-
* set: dragging over 40 columns of a 100k-row grid would otherwise build
|
|
957
|
-
* rebuild, on every mouse move
|
|
956
|
+
* set: dragging over 40 columns of a 100k-row grid would otherwise build - and
|
|
957
|
+
* rebuild, on every mouse move - a list with millions of entries in it. Two
|
|
958
958
|
* positions describe the same thing and cost nothing to extend.
|
|
959
959
|
*
|
|
960
960
|
* `anchor` is where the gesture started and stays put; `focus` is the end that
|
|
961
961
|
* moves. Which of the two is top-left depends on the direction it was dragged,
|
|
962
|
-
* so nothing here assumes an order
|
|
962
|
+
* so nothing here assumes an order - see {@link resolveRangeBounds}.
|
|
963
963
|
*/
|
|
964
964
|
type TMDataGridCellRange = {
|
|
965
965
|
anchor: TMDataGridCellPosition;
|
|
@@ -983,7 +983,7 @@ type ResolveRangeBoundsArgs = {
|
|
|
983
983
|
* corner no longer exists.
|
|
984
984
|
*
|
|
985
985
|
* A corner goes missing whenever a filter drops its row or a column is hidden,
|
|
986
|
-
* and the honest answer then is that there is no rectangle
|
|
986
|
+
* and the honest answer then is that there is no rectangle - better than
|
|
987
987
|
* guessing at a replacement corner and quietly copying cells the user never
|
|
988
988
|
* selected. The range itself is left alone: clearing it here would throw away
|
|
989
989
|
* a selection that comes straight back when the filter is lifted.
|
|
@@ -1019,10 +1019,10 @@ type TMDataGridColumnMeta = {
|
|
|
1019
1019
|
*/
|
|
1020
1020
|
type?: TMDataGridColumnType;
|
|
1021
1021
|
/**
|
|
1022
|
-
* The choices of a `select` / `multiSelect` column
|
|
1022
|
+
* The choices of a `select` / `multiSelect` column - one declaration feeding
|
|
1023
1023
|
* the filter panel's value control and the cell editor alike. A static
|
|
1024
1024
|
* array, `"faceted"` (the distinct values present in the data), or a
|
|
1025
|
-
* function of the table, column and
|
|
1025
|
+
* function of the table, column and, for editors, the row. See
|
|
1026
1026
|
* {@link TMDataGridOptionsSource}.
|
|
1027
1027
|
*/
|
|
1028
1028
|
options?: TMDataGridOptionsSource;
|
|
@@ -1031,7 +1031,7 @@ type TMDataGridColumnMeta = {
|
|
|
1031
1031
|
align?: "left" | "right" | "center";
|
|
1032
1032
|
/**
|
|
1033
1033
|
* Size the column to its widest mounted content once, after the first rows
|
|
1034
|
-
* render
|
|
1034
|
+
* render - unless a persisted or user-set width already covers it. The same
|
|
1035
1035
|
* measurement as double-clicking the resize divider; see `autosizeColumn`.
|
|
1036
1036
|
*/
|
|
1037
1037
|
autoSize?: boolean;
|
|
@@ -1043,13 +1043,13 @@ type TMDataGridColumnMeta = {
|
|
|
1043
1043
|
enableOrdering?: boolean;
|
|
1044
1044
|
/**
|
|
1045
1045
|
* The operator a fresh filter on this column starts with, instead of the
|
|
1046
|
-
* type's default
|
|
1046
|
+
* type's default - a salary column can open on `"between"`. Must be one of
|
|
1047
1047
|
* the type's own operators.
|
|
1048
1048
|
*/
|
|
1049
1049
|
defaultFilterOperator?: TMDataGridFilterOperator;
|
|
1050
1050
|
/**
|
|
1051
1051
|
* Replaces the built-in value control in this column's filter-panel row. A
|
|
1052
|
-
* component rendered as JSX
|
|
1052
|
+
* component rendered as JSX (hooks are legal inside), receiving the
|
|
1053
1053
|
* value-only contract: it reads the current operator, writes the bare
|
|
1054
1054
|
* value, and the grid composes the stored filter around it. Define it at
|
|
1055
1055
|
* module scope. See {@link TMDataGridFilterControlArgs}.
|
|
@@ -1058,11 +1058,11 @@ type TMDataGridColumnMeta = {
|
|
|
1058
1058
|
/**
|
|
1059
1059
|
* Whether this column's cells take edits, once `editMode` is on. `false`
|
|
1060
1060
|
* switches the column off outright; a predicate decides per row. Defaults
|
|
1061
|
-
* to editable for any column that maps to a field
|
|
1061
|
+
* to editable for any column that maps to a field - see {@link editField}.
|
|
1062
1062
|
*/
|
|
1063
1063
|
editable?: boolean | ((row: Row<TMDataGridFeatures, TMDataGridRowData>) => boolean);
|
|
1064
1064
|
/**
|
|
1065
|
-
* The data path this column edits, when it is not the `accessorKey`
|
|
1065
|
+
* The data path this column edits, when it is not the `accessorKey` - the
|
|
1066
1066
|
* only way a column built on `accessorFn` becomes editable. Dot paths reach
|
|
1067
1067
|
* into nested records: `"address.city"`.
|
|
1068
1068
|
*/
|
|
@@ -1080,7 +1080,7 @@ type TMDataGridColumnMeta = {
|
|
|
1080
1080
|
validate?: TMDataGridFieldValidate;
|
|
1081
1081
|
/**
|
|
1082
1082
|
* Replaces the built-in editor for this column. A component rendered as
|
|
1083
|
-
* JSX
|
|
1083
|
+
* JSX (hooks are legal inside), receiving the live TanStack Form `field`
|
|
1084
1084
|
* API plus the table context, the same contract the built-ins fill. Define
|
|
1085
1085
|
* it at module scope so its identity is stable across renders. See
|
|
1086
1086
|
* {@link TMDataGridEditorArgs}.
|
|
@@ -1095,7 +1095,7 @@ type TMDataGridTableMeta = {
|
|
|
1095
1095
|
rowHeight?: number;
|
|
1096
1096
|
/**
|
|
1097
1097
|
* Unfiltered row total. Only needed for server-driven grids, where the client
|
|
1098
|
-
* never holds the full data set
|
|
1098
|
+
* never holds the full data set - `TMDataGrid.SummaryCount` uses it as denominator.
|
|
1099
1099
|
*/
|
|
1100
1100
|
totalRowCount?: number;
|
|
1101
1101
|
};
|
|
@@ -1296,13 +1296,13 @@ type TMDataGridUiState = {
|
|
|
1296
1296
|
*/
|
|
1297
1297
|
draggedColumnId: string | null;
|
|
1298
1298
|
/**
|
|
1299
|
-
* The single highlighted row
|
|
1299
|
+
* The single highlighted row - the one a detail panel would be showing. Its
|
|
1300
1300
|
* own concept, not a slice of `rowSelection`: under
|
|
1301
1301
|
* `selectionMode: "checkboxAndHighlight"` the two coexist, and TanStack's one
|
|
1302
1302
|
* selection map cannot hold both.
|
|
1303
1303
|
*
|
|
1304
1304
|
* Not pruned when the row is filtered out, paged away or dropped from `data`,
|
|
1305
|
-
* matching how TanStack treats `rowSelection`
|
|
1305
|
+
* matching how TanStack treats `rowSelection` - nothing there resets it
|
|
1306
1306
|
* either. The row simply renders unhighlighted, and highlights again if it
|
|
1307
1307
|
* comes back.
|
|
1308
1308
|
*/
|
|
@@ -1311,17 +1311,17 @@ type TMDataGridUiState = {
|
|
|
1311
1311
|
selectionAnchorRowId: string | null;
|
|
1312
1312
|
/**
|
|
1313
1313
|
* The cell the keyboard is on, under `enableCellSelection`. `null` until the
|
|
1314
|
-
* grid is first entered
|
|
1314
|
+
* grid is first entered - and again whenever a consumer clears it.
|
|
1315
1315
|
*
|
|
1316
1316
|
* The state is the source of truth and DOM focus follows it, not the other
|
|
1317
1317
|
* way around: under virtualization the cell it names is often not mounted,
|
|
1318
1318
|
* which is exactly what a coordinate has to survive. Held as ids for the
|
|
1319
|
-
* same reason
|
|
1319
|
+
* same reason - see {@link TMDataGridCellPosition}.
|
|
1320
1320
|
*/
|
|
1321
1321
|
focusedCell: TMDataGridCellPosition | null;
|
|
1322
1322
|
/**
|
|
1323
1323
|
* The selected rectangle, under `cellSelection: "range"`. Held as the two
|
|
1324
|
-
* cells that span it
|
|
1324
|
+
* cells that span it - see {@link TMDataGridCellRange}.
|
|
1325
1325
|
*
|
|
1326
1326
|
* Always covers the focused cell: every gesture that moves the focus either
|
|
1327
1327
|
* extends the rectangle or collapses it onto the new cell, so the two never
|
|
@@ -1337,21 +1337,21 @@ type TMDataGridUiActions = {
|
|
|
1337
1337
|
startColumnDrag: (columnId: string) => void;
|
|
1338
1338
|
endColumnDrag: () => void;
|
|
1339
1339
|
/**
|
|
1340
|
-
* Moves the active row, or clears it with `null`
|
|
1340
|
+
* Moves the active row, or clears it with `null` - which is how a consumer
|
|
1341
1341
|
* closing its detail panel puts the grid back in step.
|
|
1342
1342
|
*/
|
|
1343
1343
|
setHighlightedRow: (rowId: string | null) => void;
|
|
1344
1344
|
setSelectionAnchor: (rowId: string | null) => void;
|
|
1345
1345
|
/**
|
|
1346
1346
|
* Moves the focused cell, or clears it with `null`. DOM focus follows while
|
|
1347
|
-
* the grid holds it
|
|
1347
|
+
* the grid holds it - so this both moves the keyboard and, when the row is
|
|
1348
1348
|
* off screen, scrolls it into view. Called for every arrow key, and available
|
|
1349
1349
|
* for a consumer putting the keyboard somewhere itself.
|
|
1350
1350
|
*/
|
|
1351
1351
|
setFocusedCell: (cell: TMDataGridCellPosition | null) => void;
|
|
1352
1352
|
/**
|
|
1353
1353
|
* Sets the selected rectangle, or clears it with `null`. Does not move the
|
|
1354
|
-
* focused cell
|
|
1354
|
+
* focused cell - the two are set together by the gestures that change both,
|
|
1355
1355
|
* which is what keeps "extend the selection" and "move the cursor" separable.
|
|
1356
1356
|
*/
|
|
1357
1357
|
setCellRange: (range: TMDataGridCellRange | null) => void;
|
|
@@ -1362,17 +1362,17 @@ type TMDataGridScrollAlign = "auto" | "start" | "center" | "end";
|
|
|
1362
1362
|
type TMDataGridScrollToRowArgs = {
|
|
1363
1363
|
/** The row's id, as `getRowId` produced it. */
|
|
1364
1364
|
rowId: string;
|
|
1365
|
-
/** Defaults to `"auto"`
|
|
1365
|
+
/** Defaults to `"auto"` - the nearest edge, leaving a visible row alone. */
|
|
1366
1366
|
align?: TMDataGridScrollAlign;
|
|
1367
1367
|
};
|
|
1368
1368
|
/** @internal The body's scroll implementation. See `scrollToRow`. */
|
|
1369
1369
|
type TMDataGridScroller = (args: TMDataGridScrollToRowArgs) => boolean;
|
|
1370
|
-
/** What `useTMDataGrid` returns
|
|
1370
|
+
/** What `useTMDataGrid` returns - spread straight onto `<TMDataGrid />`. */
|
|
1371
1371
|
type TMDataGridApi<TData extends RowData> = {
|
|
1372
1372
|
table: TMDataGridTable<TData>;
|
|
1373
1373
|
ui: TMDataGridUiStore;
|
|
1374
1374
|
/**
|
|
1375
|
-
* The edit engine
|
|
1375
|
+
* The edit engine - open forms, dirty/error projections, and the verbs
|
|
1376
1376
|
* (`begin`, `commit`, `cancel`, `submitAll`). `edit.getForm(rowId)` hands
|
|
1377
1377
|
* out the same TanStack Form the inline editors write through, so a drawer
|
|
1378
1378
|
* or detail panel can share a row's draft. Inert until `editMode` is set.
|
|
@@ -1389,20 +1389,20 @@ type TMDataGridApi<TData extends RowData> = {
|
|
|
1389
1389
|
/** Virtualizer overscan: the option, or {@link DEFAULT_OVERSCAN}. */
|
|
1390
1390
|
overscan: number;
|
|
1391
1391
|
/**
|
|
1392
|
-
* Puts the settings state
|
|
1392
|
+
* Puts the settings state - visibility, order, widths, pinning, grouping -
|
|
1393
1393
|
* back to what a first visit with clean storage would have shown: the
|
|
1394
1394
|
* consumer's `initialState` plus the structural lanes. With persistence
|
|
1395
1395
|
* configured the reset writes through to storage like any other change.
|
|
1396
1396
|
*
|
|
1397
1397
|
* This, not TanStack's `resetColumnX()` family, is the reset for a
|
|
1398
1398
|
* persisted grid: those reset to `initialState`, and the grid bakes the
|
|
1399
|
-
* restored payload into `initialState` at mount
|
|
1399
|
+
* restored payload into `initialState` at mount - they would "reset" to
|
|
1400
1400
|
* the very layout being discarded.
|
|
1401
1401
|
*/
|
|
1402
1402
|
resetSettings: () => void;
|
|
1403
1403
|
/**
|
|
1404
1404
|
* Scrolls a row into view. The grid is always virtualized, so a row far down
|
|
1405
|
-
* the list has no element to scroll to
|
|
1405
|
+
* the list has no element to scroll to - this moves the virtualizer instead,
|
|
1406
1406
|
* which is the only thing that can put one there.
|
|
1407
1407
|
*
|
|
1408
1408
|
* ```ts
|
|
@@ -1410,8 +1410,8 @@ type TMDataGridApi<TData extends RowData> = {
|
|
|
1410
1410
|
* ```
|
|
1411
1411
|
*
|
|
1412
1412
|
* Answers whether the row could be reached. `false` means it is not in the
|
|
1413
|
-
* current view at all
|
|
1414
|
-
* no row
|
|
1413
|
+
* current view at all - filtered out, on another page, or an id that matches
|
|
1414
|
+
* no row - and nothing scrolled. A pinned row answers `true` without
|
|
1415
1415
|
* scrolling: it is already parked at an edge.
|
|
1416
1416
|
*
|
|
1417
1417
|
* Identity is stable, so it is safe in a dependency array.
|
|
@@ -1432,7 +1432,7 @@ type TMDataGridEditingCallbacks<TData extends RowData> = {
|
|
|
1432
1432
|
*/
|
|
1433
1433
|
getRowId: NonNullable<TableOptions<TMDataGridFeatures, TData>["getRowId"]>;
|
|
1434
1434
|
/**
|
|
1435
|
-
* Form-level validators for the whole editing row
|
|
1435
|
+
* Form-level validators for the whole editing row - where cross-field
|
|
1436
1436
|
* rules live. TanStack Form's own vocabulary, Standard Schema included:
|
|
1437
1437
|
*
|
|
1438
1438
|
* ```tsx
|
|
@@ -1447,13 +1447,13 @@ type TMDataGridEditingCallbacks<TData extends RowData> = {
|
|
|
1447
1447
|
* Pathed issues land on the matching columns; pathless ones on the row.
|
|
1448
1448
|
*/
|
|
1449
1449
|
rowValidators?: TMDataGridRowValidators;
|
|
1450
|
-
/** Rows the pencil skips
|
|
1450
|
+
/** Rows the pencil skips - `false` keeps a row read-only in every mode. */
|
|
1451
1451
|
isRowEditable?: (row: Row<TMDataGridFeatures, TData>) => boolean;
|
|
1452
1452
|
/**
|
|
1453
1453
|
* Called when an edit commits. The grid never mutates `data`: apply the
|
|
1454
1454
|
* change and let the new data arrive back through `data` as always. The
|
|
1455
|
-
* engine drops the draft only when this resolves
|
|
1456
|
-
* draft visible with a busy marker
|
|
1455
|
+
* engine drops the draft only when this resolves - a slow save keeps the
|
|
1456
|
+
* draft visible with a busy marker - and a rejection keeps the form open
|
|
1457
1457
|
* with the error on the row.
|
|
1458
1458
|
*
|
|
1459
1459
|
* `changes` is the per-field diff (one entry in cell mode) for consumers
|
|
@@ -1461,7 +1461,7 @@ type TMDataGridEditingCallbacks<TData extends RowData> = {
|
|
|
1461
1461
|
*/
|
|
1462
1462
|
onEditCommit?: (args: TMDataGridEditCommitArgs<TData>) => void | Promise<void>;
|
|
1463
1463
|
/**
|
|
1464
|
-
* Seed values for `edit.addRow()`
|
|
1464
|
+
* Seed values for `edit.addRow()` - the entry row's starting point. A
|
|
1465
1465
|
* function is called per added row (fresh timestamps, empty arrays).
|
|
1466
1466
|
*/
|
|
1467
1467
|
newRowDefaults?: TData | (() => TData);
|
|
@@ -1472,7 +1472,7 @@ type TMDataGridEditingCallbacks<TData extends RowData> = {
|
|
|
1472
1472
|
*/
|
|
1473
1473
|
onRowAdd?: (args: TMDataGridRowAddArgs<TData>) => void | Promise<void>;
|
|
1474
1474
|
/**
|
|
1475
|
-
* Called by `edit.deleteRow` under the immediate modes
|
|
1475
|
+
* Called by `edit.deleteRow` under the immediate modes - confirmation, if
|
|
1476
1476
|
* any, belongs in here. Under batch, deletions accumulate in
|
|
1477
1477
|
* `edit.state.deletedRowIds` instead and are reported by `submitAll`.
|
|
1478
1478
|
* Setting this also puts the trash can in the edit lane.
|
|
@@ -1483,7 +1483,7 @@ type TMDataGridEditingCallbacks<TData extends RowData> = {
|
|
|
1483
1483
|
* The editing options travel together, and the type states it: without
|
|
1484
1484
|
* `editMode` none of them has anything to act on, so passing one is a
|
|
1485
1485
|
* compile error rather than a dead option; with it, `getRowId` becomes
|
|
1486
|
-
* required; and `onEditCommitBatch` exists only under `"batch"`
|
|
1486
|
+
* required; and `onEditCommitBatch` exists only under `"batch"` - the one
|
|
1487
1487
|
* mode whose `submitAll` calls it.
|
|
1488
1488
|
*
|
|
1489
1489
|
* `editMode` itself turns cell editing on and picks how commits happen. Off
|
|
@@ -1491,7 +1491,7 @@ type TMDataGridEditingCallbacks<TData extends RowData> = {
|
|
|
1491
1491
|
*
|
|
1492
1492
|
* | Mode | Commit | Cancel |
|
|
1493
1493
|
* | ---- | ------ | ------ |
|
|
1494
|
-
* | `"cell"` | Enter, Tab, blur
|
|
1494
|
+
* | `"cell"` | Enter, Tab, blur - Sheets | Escape |
|
|
1495
1495
|
* | `"cellConfirm"` | ✓ or Enter only; blur keeps the draft | ✕ or Escape |
|
|
1496
1496
|
* | `"row"` | Save in the edit lane, or Ctrl+Enter | Cancel, or Escape |
|
|
1497
1497
|
* | `"batch"` | `edit.submitAll()` | `edit.cancelAll()` |
|
|
@@ -1513,7 +1513,7 @@ type TMDataGridEditingOptions<TData extends RowData> = (TMDataGridEditingCallbac
|
|
|
1513
1513
|
onEditCommitBatch?: (args: TMDataGridEditCommitBatchArgs<TData>) => void | Promise<void>;
|
|
1514
1514
|
}) | (TMDataGridEditingCallbacks<TData> & {
|
|
1515
1515
|
editMode: Exclude<TMDataGridEditMode, "batch">;
|
|
1516
|
-
/** Only `"batch"`'s `submitAll` ever calls it
|
|
1516
|
+
/** Only `"batch"`'s `submitAll` ever calls it - see the other branch. */
|
|
1517
1517
|
onEditCommitBatch?: never;
|
|
1518
1518
|
}) | {
|
|
1519
1519
|
editMode?: never;
|
|
@@ -1528,14 +1528,14 @@ type TMDataGridEditingOptions<TData extends RowData> = (TMDataGridEditingCallbac
|
|
|
1528
1528
|
type UseTMDataGridOptions<TData extends RowData> = Omit<TableOptions<TMDataGridFeatures, TData>, "features"> & TMDataGridEditingOptions<TData> & {
|
|
1529
1529
|
/**
|
|
1530
1530
|
* Restore and persist table state across mounts. Two keys, because the two
|
|
1531
|
-
* kinds of state have different lifetimes
|
|
1531
|
+
* kinds of state have different lifetimes - see {@link TMDataGridPersistence}.
|
|
1532
1532
|
*
|
|
1533
1533
|
* Keep the object referentially stable (module scope or `useMemo`); it is a
|
|
1534
1534
|
* dependency of the subscription that writes back.
|
|
1535
1535
|
*/
|
|
1536
1536
|
persist?: TMDataGridPersistence;
|
|
1537
1537
|
/**
|
|
1538
|
-
* Overrides for the grid's strings
|
|
1538
|
+
* Overrides for the grid's strings - menu items, panels, the pager, and
|
|
1539
1539
|
* every `aria-label`. Any subset, merged over the English defaults; a full
|
|
1540
1540
|
* Swedish dictionary ships as `TMDATAGRID_LABELS_SV`.
|
|
1541
1541
|
*
|
|
@@ -1544,7 +1544,7 @@ type UseTMDataGridOptions<TData extends RowData> = Omit<TableOptions<TMDataGridF
|
|
|
1544
1544
|
* useTMDataGrid({ data, columns, labels: { noResults: "Inga rader" } });
|
|
1545
1545
|
* ```
|
|
1546
1546
|
*
|
|
1547
|
-
* Keep the object referentially stable (module scope or `useMemo`)
|
|
1547
|
+
* Keep the object referentially stable (module scope or `useMemo`) - the
|
|
1548
1548
|
* chrome re-renders when its identity changes.
|
|
1549
1549
|
*/
|
|
1550
1550
|
labels?: TMDataGridLabelsOverride;
|
|
@@ -1563,19 +1563,19 @@ type UseTMDataGridOptions<TData extends RowData> = Omit<TableOptions<TMDataGridF
|
|
|
1563
1563
|
* virtualization.
|
|
1564
1564
|
*
|
|
1565
1565
|
* The second grid-defined switch (TanStack defines no `enablePagination`
|
|
1566
|
-
* option). `manualPagination: true` implies it
|
|
1566
|
+
* option). `manualPagination: true` implies it - a server-paged grid needs
|
|
1567
1567
|
* no extra flag.
|
|
1568
1568
|
*/
|
|
1569
1569
|
enablePagination?: boolean;
|
|
1570
1570
|
/**
|
|
1571
1571
|
* The row-number gutter: a generated lane, outermost left, numbering the
|
|
1572
|
-
* rows of the current view
|
|
1572
|
+
* rows of the current view - sorted, filtered, continuing across pages,
|
|
1573
1573
|
* with group rows unnumbered. Off by default.
|
|
1574
1574
|
*/
|
|
1575
1575
|
enableRowNumbers?: boolean;
|
|
1576
1576
|
/**
|
|
1577
|
-
* How the quick search (`TMDataGrid.Search`) matches. `"fuzzy"`
|
|
1578
|
-
* default
|
|
1577
|
+
* How the quick search (`TMDataGrid.Search`) matches. `"fuzzy"` - the
|
|
1578
|
+
* default - forgives typos and skipped characters, and while it is the
|
|
1579
1579
|
* only thing narrowing the grid (no sort, no grouping) the rows order by
|
|
1580
1580
|
* match quality, best first. `"contains"` is plain substring matching.
|
|
1581
1581
|
* An explicit `globalFilterFn` overrides both.
|
|
@@ -1583,7 +1583,7 @@ type UseTMDataGridOptions<TData extends RowData> = Omit<TableOptions<TMDataGridF
|
|
|
1583
1583
|
quickSearchMode?: TMDataGridQuickSearchMode;
|
|
1584
1584
|
/**
|
|
1585
1585
|
* Highlights the matched text in cells while a contains-family column
|
|
1586
|
-
* filter or the quick search is active. Default-rendered cells only
|
|
1586
|
+
* filter or the quick search is active. Default-rendered cells only - a
|
|
1587
1587
|
* column with its own `cell` renderer opts out by existing; a fuzzy
|
|
1588
1588
|
* typo-match with no contiguous occurrence shows no highlight. Off by
|
|
1589
1589
|
* default.
|
|
@@ -1599,8 +1599,8 @@ type UseTMDataGridOptions<TData extends RowData> = Omit<TableOptions<TMDataGridF
|
|
|
1599
1599
|
* | `"checkboxAndHighlight"` | yes, multi-select | highlights one row |
|
|
1600
1600
|
* | `"highlight"` | no | highlights one row, no selection at all |
|
|
1601
1601
|
*
|
|
1602
|
-
* One option rather than two, so the combination that cannot work
|
|
1603
|
-
* that both toggles a multi-selection and moves the highlight
|
|
1602
|
+
* One option rather than two, so the combination that cannot work - a click
|
|
1603
|
+
* that both toggles a multi-selection and moves the highlight - is not
|
|
1604
1604
|
* expressible.
|
|
1605
1605
|
*
|
|
1606
1606
|
* The first two write to TanStack's `rowSelection`. The highlight is separate
|
|
@@ -1633,7 +1633,7 @@ type UseTMDataGridOptions<TData extends RowData> = Omit<TableOptions<TMDataGridF
|
|
|
1633
1633
|
* highlight. Read once on mount, like `initialState`.
|
|
1634
1634
|
*
|
|
1635
1635
|
* The grid never persists the highlighted row. Pair this with
|
|
1636
|
-
* {@link onHighlightedRowChange} and keep it wherever it belongs
|
|
1636
|
+
* {@link onHighlightedRowChange} and keep it wherever it belongs - for a
|
|
1637
1637
|
* detail panel that is usually the route, which gets you a shareable link and
|
|
1638
1638
|
* a working back button as well as surviving a reload:
|
|
1639
1639
|
*
|
|
@@ -1669,7 +1669,7 @@ type UseTMDataGridOptions<TData extends RowData> = Omit<TableOptions<TMDataGridF
|
|
|
1669
1669
|
* | PageUp / PageDown | one viewport of rows |
|
|
1670
1670
|
* | Home / End | first / last cell of the row |
|
|
1671
1671
|
* | Ctrl+Home / Ctrl+End | first / last cell of the grid |
|
|
1672
|
-
* | Enter or F2 | into the cell
|
|
1672
|
+
* | Enter or F2 | into the cell - the checkbox, link or button it holds |
|
|
1673
1673
|
* | Escape | back out to the cell |
|
|
1674
1674
|
* | Space | selects the row, as it does in row-selection mode |
|
|
1675
1675
|
*
|
|
@@ -1679,7 +1679,7 @@ type UseTMDataGridOptions<TData extends RowData> = Omit<TableOptions<TMDataGridF
|
|
|
1679
1679
|
* | ------- | ---- |
|
|
1680
1680
|
* | Drag across cells | selects the rectangle they span |
|
|
1681
1681
|
* | Shift+click, Shift+arrows | extends the rectangle from its anchor |
|
|
1682
|
-
* | Ctrl+C | copies it as tab-separated text
|
|
1682
|
+
* | Ctrl+C | copies it as tab-separated text - paste lands in Excel's cells |
|
|
1683
1683
|
* | Right-click inside it | offers the CSV export, headers optional |
|
|
1684
1684
|
*
|
|
1685
1685
|
* Off, nothing about the body changes. On, three things do: the body's tab
|
|
@@ -1689,7 +1689,7 @@ type UseTMDataGridOptions<TData extends RowData> = Omit<TableOptions<TMDataGridF
|
|
|
1689
1689
|
* the cells take `data-focused` / `data-selected` for the ring and the tint.
|
|
1690
1690
|
*
|
|
1691
1691
|
* The state is `ui.state.focusedCell` and `ui.state.cellRange`, and moving it
|
|
1692
|
-
* is `ui.actions.setFocusedCell` / `setCellRange`
|
|
1692
|
+
* is `ui.actions.setFocusedCell` / `setCellRange` - so a consumer can put the
|
|
1693
1693
|
* keyboard on a cell, or follow it:
|
|
1694
1694
|
*
|
|
1695
1695
|
* ```tsx
|
|
@@ -1716,7 +1716,7 @@ type UseTMDataGridOptions<TData extends RowData> = Omit<TableOptions<TMDataGridF
|
|
|
1716
1716
|
* it is what turns row details on.
|
|
1717
1717
|
*
|
|
1718
1718
|
* Which rows are open is TanStack's own `expanded` state, so opening one is
|
|
1719
|
-
* `row.toggleExpanded()` from wherever suits
|
|
1719
|
+
* `row.toggleExpanded()` from wherever suits - a chevron in a cell, a button
|
|
1720
1720
|
* in the context menu, a double-click:
|
|
1721
1721
|
*
|
|
1722
1722
|
* ```tsx
|
|
@@ -1727,7 +1727,7 @@ type UseTMDataGridOptions<TData extends RowData> = Omit<TableOptions<TMDataGridF
|
|
|
1727
1727
|
* });
|
|
1728
1728
|
* ```
|
|
1729
1729
|
*
|
|
1730
|
-
* The panel is as tall as what it renders
|
|
1730
|
+
* The panel is as tall as what it renders - see {@link renderDetailsEstHeight}
|
|
1731
1731
|
* for what the virtualizer assumes before it has measured one.
|
|
1732
1732
|
*
|
|
1733
1733
|
* Group rows are left out: expanding one opens its children, and a panel there
|
|
@@ -1746,7 +1746,7 @@ type UseTMDataGridOptions<TData extends RowData> = Omit<TableOptions<TMDataGridF
|
|
|
1746
1746
|
*
|
|
1747
1747
|
* An estimate, not a height: every mounted row is measured, so the real one
|
|
1748
1748
|
* takes over as soon as the panel is on screen. It keeps the scrollbar honest
|
|
1749
|
-
* for panels that open off screen
|
|
1749
|
+
* for panels that open off screen (restored `expanded` state, say), and being
|
|
1750
1750
|
* roughly right is enough.
|
|
1751
1751
|
*/
|
|
1752
1752
|
renderDetailsEstHeight?: number;
|
|
@@ -1754,7 +1754,7 @@ type UseTMDataGridOptions<TData extends RowData> = Omit<TableOptions<TMDataGridF
|
|
|
1754
1754
|
* Rows the virtualizer keeps mounted above and below the viewport. Defaults
|
|
1755
1755
|
* to 6.
|
|
1756
1756
|
*
|
|
1757
|
-
* Raise it to trade memory for a scroll that stays painted
|
|
1757
|
+
* Raise it to trade memory for a scroll that stays painted - fast wheel or
|
|
1758
1758
|
* touch flings can outrun the virtualizer and flash blank rows, and a larger
|
|
1759
1759
|
* buffer covers the gap. Lower it when rows are expensive to render.
|
|
1760
1760
|
*/
|
|
@@ -1765,7 +1765,7 @@ type UseTMDataGridOptions<TData extends RowData> = Omit<TableOptions<TMDataGridF
|
|
|
1765
1765
|
*
|
|
1766
1766
|
* Every `TableOptions` field passes straight through, so a server-driven grid
|
|
1767
1767
|
* only needs `manualPagination` / `manualFiltering` / `manualSorting`,
|
|
1768
|
-
* `rowCount` and the matching `onXChange` callbacks
|
|
1768
|
+
* `rowCount` and the matching `onXChange` callbacks - the chrome reads
|
|
1769
1769
|
* `getRowCount()` / `getPageCount()` / `getPaginatedRowModel()`, all of which
|
|
1770
1770
|
* already respect manual mode. `manualPagination` also switches the pagination
|
|
1771
1771
|
* flag on, so `<TMDataGrid.Footer />` renders its pager without further
|
|
@@ -1774,7 +1774,7 @@ type UseTMDataGridOptions<TData extends RowData> = Omit<TableOptions<TMDataGridF
|
|
|
1774
1774
|
declare function useTMDataGrid<TData extends RowData>({ persist, labels: labelsOverride, enableColumnOrdering, enablePagination, enableRowNumbers, selectionMode, showSelectedBackground, defaultHighlightedRowId, onHighlightedRowChange, cellSelection, onFocusedCellChange, editMode, rowValidators, isRowEditable, onEditCommit, onEditCommitBatch, newRowDefaults, onRowAdd, onRowDelete, renderDetails, renderDetailsEstHeight, overscan, ...options }: UseTMDataGridOptions<TData>): TMDataGridApi<TData>;
|
|
1775
1775
|
/**
|
|
1776
1776
|
* Opens the filter panel for a column, seeding an empty filter row when the
|
|
1777
|
-
* column has none yet
|
|
1777
|
+
* column has none yet - mirrors "Filter" in the column header menu.
|
|
1778
1778
|
*/
|
|
1779
1779
|
declare function openColumnFilter<TData extends RowData>(api: TMDataGridApi<TData>, columnId: string): void;
|
|
1780
1780
|
//#endregion
|
|
@@ -1794,7 +1794,7 @@ type TMDataGridFilterPillsProps<TData extends RowData> = {
|
|
|
1794
1794
|
className?: string;
|
|
1795
1795
|
};
|
|
1796
1796
|
/**
|
|
1797
|
-
* One pill per active filter
|
|
1797
|
+
* One pill per active filter (`First name: Sofia ✕`), with the ✕ clearing that
|
|
1798
1798
|
* filter and a click on the label opening the filter panel on its column.
|
|
1799
1799
|
*
|
|
1800
1800
|
* The one grid component that takes the api as a prop instead of reading
|
|
@@ -1847,11 +1847,11 @@ type TMDataGridFooterProps = {
|
|
|
1847
1847
|
* MUI-style pager: "Rows per page · from–to of total · ‹ ›".
|
|
1848
1848
|
*
|
|
1849
1849
|
* Renders nothing unless pagination is enabled (`enablePagination` or
|
|
1850
|
-
* `manualPagination`)
|
|
1850
|
+
* `manualPagination`) - the footer is a pager; extra footer content belongs in
|
|
1851
1851
|
* your own layout.
|
|
1852
1852
|
*
|
|
1853
1853
|
* Row totals come from `table.getRowCount()`, which prefers `options.rowCount`
|
|
1854
|
-
*
|
|
1854
|
+
* - so a server-paged grid shows the server's total without changes here.
|
|
1855
1855
|
*/
|
|
1856
1856
|
declare function TMDataGridFooter({ pageSizeOptions, pagination }: TMDataGridFooterProps): import("react").JSX.Element | null;
|
|
1857
1857
|
//#endregion
|
|
@@ -1861,7 +1861,7 @@ type TMDataGridSearchProps = {
|
|
|
1861
1861
|
placeholder?: string;
|
|
1862
1862
|
/**
|
|
1863
1863
|
* How long typing pauses before the filter is applied, in ms. Defaults to
|
|
1864
|
-
* 250. `0` writes on every keystroke
|
|
1864
|
+
* 250. `0` writes on every keystroke - what the tests use, and fine for
|
|
1865
1865
|
* small client-side data sets.
|
|
1866
1866
|
*/
|
|
1867
1867
|
debounce?: number;
|
|
@@ -1869,7 +1869,7 @@ type TMDataGridSearchProps = {
|
|
|
1869
1869
|
w?: number | string;
|
|
1870
1870
|
};
|
|
1871
1871
|
/**
|
|
1872
|
-
* Quick search over every column
|
|
1872
|
+
* Quick search over every column - a debounced input writing the table's
|
|
1873
1873
|
* `globalFilter` state through the `"includesString"` filter the grid
|
|
1874
1874
|
* configures by default.
|
|
1875
1875
|
*
|
|
@@ -1882,12 +1882,12 @@ type TMDataGridSearchProps = {
|
|
|
1882
1882
|
* ```
|
|
1883
1883
|
*
|
|
1884
1884
|
* Renders nothing under `enableGlobalFilter: false`. Columns opt out with
|
|
1885
|
-
* their own `enableGlobalFilter: false`
|
|
1885
|
+
* their own `enableGlobalFilter: false` - the generated lanes already do.
|
|
1886
1886
|
*
|
|
1887
1887
|
* The state is TanStack's `globalFilter`, so everything around it comes free:
|
|
1888
1888
|
* `manualFiltering` grids forward it to the server, and it is one of the
|
|
1889
1889
|
* persisted `data` slices. A grid that wants its own input entirely writes
|
|
1890
|
-
* `table.setGlobalFilter` itself
|
|
1890
|
+
* `table.setGlobalFilter` itself - this component is only the built-in one.
|
|
1891
1891
|
*/
|
|
1892
1892
|
declare function TMDataGridSearch({ placeholder, debounce, w }: TMDataGridSearchProps): import("react").JSX.Element | null;
|
|
1893
1893
|
//#endregion
|
|
@@ -1928,7 +1928,7 @@ declare function formatExportValue(value: unknown, { decimalComma }: {
|
|
|
1928
1928
|
}): string;
|
|
1929
1929
|
type BuildCellMatrixArgs = {
|
|
1930
1930
|
rows: ReadonlyArray<Row<TMDataGridFeatures, TMDataGridRowData>>;
|
|
1931
|
-
/** Every visible column, in render order
|
|
1931
|
+
/** Every visible column, in render order - the same list the bounds index into. */
|
|
1932
1932
|
columns: ReadonlyArray<Column<TMDataGridFeatures, TMDataGridRowData, unknown>>;
|
|
1933
1933
|
bounds: TMDataGridRangeBounds;
|
|
1934
1934
|
includeHeaders: boolean;
|
|
@@ -1937,20 +1937,20 @@ type BuildCellMatrixArgs = {
|
|
|
1937
1937
|
/**
|
|
1938
1938
|
* The selected rectangle as rows of text.
|
|
1939
1939
|
*
|
|
1940
|
-
* The generated lanes
|
|
1940
|
+
* The generated lanes - the checkbox, the tree chevron, the details chevron -
|
|
1941
1941
|
* are dropped even when the rectangle covers them. They hold controls rather
|
|
1942
1942
|
* than data, so a column of empty strings is all they could contribute, and
|
|
1943
1943
|
* pasting one into a spreadsheet only shifts everything to its right.
|
|
1944
1944
|
*/
|
|
1945
1945
|
declare function buildCellMatrix({ rows, columns, bounds, includeHeaders, decimalComma }: BuildCellMatrixArgs): TMDataGridCellMatrix;
|
|
1946
1946
|
/**
|
|
1947
|
-
* The whole grid as rows of text: every filtered and sorted data row
|
|
1948
|
-
* pages, not the one on screen
|
|
1947
|
+
* The whole grid as rows of text: every filtered and sorted data row - all
|
|
1948
|
+
* pages, not the one on screen - by every visible non-control column, in
|
|
1949
1949
|
* render order.
|
|
1950
1950
|
*
|
|
1951
1951
|
* The values are the same ones a cell-range export writes; only the bounds
|
|
1952
1952
|
* differ. Group rows are left out (their records are the rows themselves),
|
|
1953
|
-
* and hidden columns are not exported
|
|
1953
|
+
* and hidden columns are not exported - what you see is what you get, minus
|
|
1954
1954
|
* paging.
|
|
1955
1955
|
*/
|
|
1956
1956
|
declare function buildGridCellMatrix<TData extends RowData>({ table, includeHeaders, decimalComma }: {
|
|
@@ -1959,7 +1959,7 @@ declare function buildGridCellMatrix<TData extends RowData>({ table, includeHead
|
|
|
1959
1959
|
decimalComma?: boolean;
|
|
1960
1960
|
}): TMDataGridCellMatrix;
|
|
1961
1961
|
/**
|
|
1962
|
-
* Downloads the whole grid as a CSV for Excel
|
|
1962
|
+
* Downloads the whole grid as a CSV for Excel - {@link buildGridCellMatrix}
|
|
1963
1963
|
* through {@link toExcelCsv}, with the same Nordic defaults and overrides as
|
|
1964
1964
|
* the cell-range export.
|
|
1965
1965
|
*
|
|
@@ -1977,7 +1977,7 @@ declare function exportGridToCsv<TData extends RowData>({ table, options }: {
|
|
|
1977
1977
|
* The clipboard format spreadsheets read: tab between cells, CRLF between rows.
|
|
1978
1978
|
*
|
|
1979
1979
|
* Tabs rather than commas because that is what Excel, Sheets and Numbers all
|
|
1980
|
-
* put on the clipboard themselves
|
|
1980
|
+
* put on the clipboard themselves - paste it and the cells land in cells. A
|
|
1981
1981
|
* comma-separated string pastes into a single column, which is the thing this
|
|
1982
1982
|
* exists to avoid.
|
|
1983
1983
|
*/
|
|
@@ -1989,12 +1989,12 @@ declare function toClipboardText(matrix: TMDataGridCellMatrix): string;
|
|
|
1989
1989
|
*
|
|
1990
1990
|
* | Part | Why |
|
|
1991
1991
|
* | ---- | --- |
|
|
1992
|
-
* | `sep=;` first line | Excel's own directive
|
|
1992
|
+
* | `sep=;` first line | Excel's own directive - it stops guessing and uses this |
|
|
1993
1993
|
* | UTF-8 BOM | without it Excel reads the file as ANSI, and å ä ö arrive broken |
|
|
1994
1994
|
* | CRLF line endings | what Excel writes, and what its importer is happiest with |
|
|
1995
1995
|
*
|
|
1996
1996
|
* The `sep=` line is Excel's alone; other readers show it as a first row. That
|
|
1997
|
-
* is the trade this makes
|
|
1997
|
+
* is the trade this makes - the file is for Excel, and "it just opens" is worth
|
|
1998
1998
|
* more than being a well-behaved CSV nobody was going to feed to a parser.
|
|
1999
1999
|
*/
|
|
2000
2000
|
declare function toExcelCsv(matrix: TMDataGridCellMatrix, { separator }: {
|
|
@@ -2004,14 +2004,14 @@ declare function toExcelCsv(matrix: TMDataGridCellMatrix, { separator }: {
|
|
|
2004
2004
|
* Puts text on the clipboard, reporting whether it landed.
|
|
2005
2005
|
*
|
|
2006
2006
|
* The async clipboard API only resolves for a document that has the focus and a
|
|
2007
|
-
* user gesture behind it
|
|
2007
|
+
* user gesture behind it - both true when this runs off Ctrl+C or a menu item.
|
|
2008
2008
|
* It is still allowed to reject (a permissions policy, a page that lost focus
|
|
2009
2009
|
* mid-copy), so the result is a boolean rather than a promise nobody checks.
|
|
2010
2010
|
*/
|
|
2011
2011
|
declare function writeClipboardText(text: string): Promise<boolean>;
|
|
2012
2012
|
/**
|
|
2013
2013
|
* Downloads text as a file, through the one mechanism a library can use: an
|
|
2014
|
-
* anchor with an object URL behind it, clicked. Revoked on the next frame
|
|
2014
|
+
* anchor with an object URL behind it, clicked. Revoked on the next frame -
|
|
2015
2015
|
* immediately would race the browser's own read of it.
|
|
2016
2016
|
*/
|
|
2017
2017
|
declare function downloadTextFile({ fileName, text, mimeType }: {
|
|
@@ -2026,12 +2026,12 @@ type TMDataGridColumnLayout = {
|
|
|
2026
2026
|
pinnedAt: "left" | "right" | false;
|
|
2027
2027
|
/** Distance in px from the grid's left or right edge. */
|
|
2028
2028
|
offset: number;
|
|
2029
|
-
/** Last left-pinned / first right-pinned column
|
|
2029
|
+
/** Last left-pinned / first right-pinned column - the one that casts the edge. */
|
|
2030
2030
|
isBoundary: boolean;
|
|
2031
2031
|
};
|
|
2032
2032
|
/**
|
|
2033
2033
|
* What a cell needs to take part in cell selection, or `undefined` while the
|
|
2034
|
-
* feature is off
|
|
2034
|
+
* feature is off - which is what keeps a plain grid's cells exactly as they
|
|
2035
2035
|
* were: no tab stop, no `gridcell` role, no coordinates in the DOM.
|
|
2036
2036
|
*
|
|
2037
2037
|
* The coordinates are there for the delegated key handler, which reads them off
|
|
@@ -2049,7 +2049,7 @@ type TMDataGridCellNav = {
|
|
|
2049
2049
|
selected: boolean;
|
|
2050
2050
|
/**
|
|
2051
2051
|
* Which sides of the rectangle this cell is on, or `null` when it is not in
|
|
2052
|
-
* one. The outline is drawn per cell
|
|
2052
|
+
* one. The outline is drawn per cell - see {@link boundsEdges}.
|
|
2053
2053
|
*/
|
|
2054
2054
|
edges: {
|
|
2055
2055
|
top: boolean;
|
|
@@ -2064,7 +2064,7 @@ type TMDataGridRowContextMenuArgs<TData extends RowData> = {
|
|
|
2064
2064
|
row: Row<TMDataGridFeatures, TData>;
|
|
2065
2065
|
/**
|
|
2066
2066
|
* The cell under the pointer. `null` only when the right-click landed on the
|
|
2067
|
-
* row but on no cell
|
|
2067
|
+
* row but on no cell - which a custom cell renderer that stops propagation
|
|
2068
2068
|
* can cause.
|
|
2069
2069
|
*/
|
|
2070
2070
|
cell: Cell<TMDataGridFeatures, TData, unknown> | null;
|
|
@@ -2075,13 +2075,13 @@ type TMDataGridRowContextMenuArgs<TData extends RowData> = {
|
|
|
2075
2075
|
close: () => void;
|
|
2076
2076
|
};
|
|
2077
2077
|
/**
|
|
2078
|
-
* Builds the contents of a row's context menu
|
|
2078
|
+
* Builds the contents of a row's context menu - `Menu.Item`, `Menu.Label`,
|
|
2079
2079
|
* `Menu.Divider`, `Menu.Sub`, or any other node. The grid owns the `Menu` and
|
|
2080
2080
|
* its `Menu.Dropdown`; this fills the dropdown.
|
|
2081
2081
|
*/
|
|
2082
2082
|
type TMDataGridRowContextMenu<TData extends RowData> = (args: TMDataGridRowContextMenuArgs<TData>) => ReactNode;
|
|
2083
2083
|
/**
|
|
2084
|
-
* What the `onCellClick` family receives
|
|
2084
|
+
* What the `onCellClick` family receives - the cell with its row and column,
|
|
2085
2085
|
* in the consumer's own row type, plus the pointer event.
|
|
2086
2086
|
*/
|
|
2087
2087
|
type TMDataGridCellEventArgs<TData extends RowData> = {
|
|
@@ -2092,7 +2092,7 @@ type TMDataGridCellEventArgs<TData extends RowData> = {
|
|
|
2092
2092
|
};
|
|
2093
2093
|
/**
|
|
2094
2094
|
* Inline styles for a row. Widened to accept CSS variables, because setting
|
|
2095
|
-
* `--row-bg` is the supported way to colour a row
|
|
2095
|
+
* `--row-bg` is the supported way to colour a row - see {@link
|
|
2096
2096
|
* TMDataGridTableProps.rowStyle}.
|
|
2097
2097
|
*/
|
|
2098
2098
|
type TMDataGridRowStyle = CSSProperties | (CSSProperties & Record<`--${string}`, string | number>);
|
|
@@ -2104,8 +2104,8 @@ type TMDataGridTableProps<TData extends RowData> = {
|
|
|
2104
2104
|
onRowClick?: (row: Row<TMDataGridFeatures, TData>) => void;
|
|
2105
2105
|
/**
|
|
2106
2106
|
* Called when a body cell is clicked. Composes, never suppresses: whatever
|
|
2107
|
-
* the click already does
|
|
2108
|
-
*
|
|
2107
|
+
* the click already does - selecting, highlighting, moving the cell cursor
|
|
2108
|
+
* - still happens. Group rows sit out the cell handlers the way they sit
|
|
2109
2109
|
* out `onRowClick`, and for the same reason.
|
|
2110
2110
|
*/
|
|
2111
2111
|
onCellClick?: (args: TMDataGridCellEventArgs<TData>) => void;
|
|
@@ -2118,7 +2118,7 @@ type TMDataGridTableProps<TData extends RowData> = {
|
|
|
2118
2118
|
*/
|
|
2119
2119
|
onCellContextMenu?: (args: TMDataGridCellEventArgs<TData>) => void;
|
|
2120
2120
|
/**
|
|
2121
|
-
* Class for a body row
|
|
2121
|
+
* Class for a body row - a string, or a function of the row (group rows
|
|
2122
2122
|
* included; test `row.getIsGrouped()` to skip them). Added after the grid's
|
|
2123
2123
|
* own row class.
|
|
2124
2124
|
*/
|
|
@@ -2127,7 +2127,7 @@ type TMDataGridTableProps<TData extends RowData> = {
|
|
|
2127
2127
|
* Inline style for a body row. To colour a row, set `--row-bg` rather than
|
|
2128
2128
|
* `background`: the row's own background, its sticky pinned cells and the
|
|
2129
2129
|
* cell-range tint all read that variable, and hover/selection/highlight
|
|
2130
|
-
* keep working on top of it
|
|
2130
|
+
* keep working on top of it - a raw `background` bypasses all of them.
|
|
2131
2131
|
*
|
|
2132
2132
|
* ```tsx
|
|
2133
2133
|
* rowStyle={(row) =>
|
|
@@ -2138,12 +2138,12 @@ type TMDataGridTableProps<TData extends RowData> = {
|
|
|
2138
2138
|
rowStyle?: TMDataGridRowStyle | ((row: Row<TMDataGridFeatures, TData>) => TMDataGridRowStyle | undefined);
|
|
2139
2139
|
/**
|
|
2140
2140
|
* Every second row takes `--dg-row-striped-bg`. Computed from the row's
|
|
2141
|
-
* position in the view
|
|
2141
|
+
* position in the view - sorting and filtering restripe, and the stripes
|
|
2142
2142
|
* stay put while the virtualizer mounts and unmounts rows.
|
|
2143
2143
|
*/
|
|
2144
2144
|
striped?: boolean;
|
|
2145
2145
|
/**
|
|
2146
|
-
* Called when the scroll *arrives* at an edge
|
|
2146
|
+
* Called when the scroll *arrives* at an edge - once per arrival, not per
|
|
2147
2147
|
* scroll event, and not on mount (the grid starts at the top-left edge).
|
|
2148
2148
|
* For loading more rows as the end approaches, `onReachEnd` is the better
|
|
2149
2149
|
* hook: it fires rows-early and latches per row count.
|
|
@@ -2156,10 +2156,10 @@ type TMDataGridTableProps<TData extends RowData> = {
|
|
|
2156
2156
|
/** As {@link onScrollToTop}, for the right edge. */
|
|
2157
2157
|
onScrollToRight?: () => void;
|
|
2158
2158
|
/**
|
|
2159
|
-
* Rendered centred in the body when the view is empty
|
|
2159
|
+
* Rendered centred in the body when the view is empty - the branded blank
|
|
2160
2160
|
* slate. It takes over states 3 and 4 of the empty matrix (see the docs):
|
|
2161
2161
|
* loading still shows the loader, and open entry rows still show only
|
|
2162
|
-
* themselves. `hasActiveFilters` says which emptiness this is
|
|
2162
|
+
* themselves. `hasActiveFilters` says which emptiness this is - a filter
|
|
2163
2163
|
* that matched nothing wants a "clear filters" invitation, a grid with no
|
|
2164
2164
|
* data wants a "create the first one".
|
|
2165
2165
|
*/
|
|
@@ -2169,7 +2169,7 @@ type TMDataGridTableProps<TData extends RowData> = {
|
|
|
2169
2169
|
}) => ReactNode;
|
|
2170
2170
|
/**
|
|
2171
2171
|
* Contents of the menu a right-click on a row opens, at the pointer. Return
|
|
2172
|
-
* `null` to leave a row without one
|
|
2172
|
+
* `null` to leave a row without one - the browser's own menu stays suppressed
|
|
2173
2173
|
* either way.
|
|
2174
2174
|
*
|
|
2175
2175
|
* ```tsx
|
|
@@ -2187,23 +2187,23 @@ type TMDataGridTableProps<TData extends RowData> = {
|
|
|
2187
2187
|
* />
|
|
2188
2188
|
* ```
|
|
2189
2189
|
*
|
|
2190
|
-
* Called during render, and only for the row whose menu is open
|
|
2190
|
+
* Called during render, and only for the row whose menu is open - so it stays
|
|
2191
2191
|
* a pure function of the row, and cost per row does not matter.
|
|
2192
2192
|
*/
|
|
2193
2193
|
rowContextMenu?: TMDataGridRowContextMenu<TData>;
|
|
2194
2194
|
/**
|
|
2195
|
-
* Passed to the Mantine `Menu` the grid wraps the row in
|
|
2195
|
+
* Passed to the Mantine `Menu` the grid wraps the row in - `width`, `shadow`,
|
|
2196
2196
|
* `position`, `transitionProps` and the rest. Its open state is the grid's.
|
|
2197
2197
|
*/
|
|
2198
2198
|
rowContextMenuProps?: Omit<MenuProps, "opened" | "onChange" | "children">;
|
|
2199
2199
|
/**
|
|
2200
2200
|
* How Ctrl+C and the export item write values, under
|
|
2201
|
-
* `cellSelection: "range"`. Defaults to the Nordic Excel conventions
|
|
2201
|
+
* `cellSelection: "range"`. Defaults to the Nordic Excel conventions - see
|
|
2202
2202
|
* {@link TMDataGridCellExportOptions}.
|
|
2203
2203
|
*/
|
|
2204
2204
|
cellExport?: TMDataGridCellExportOptions;
|
|
2205
2205
|
/**
|
|
2206
|
-
* Called when the scroll approaches the last row
|
|
2206
|
+
* Called when the scroll approaches the last row - the infinite-scroll
|
|
2207
2207
|
* hook-in. Append the next page to `data` and the virtualizer keeps its
|
|
2208
2208
|
* position; fires once per row count, so a pending fetch is not asked
|
|
2209
2209
|
* again until it lands.
|
|
@@ -2213,7 +2213,7 @@ type TMDataGridTableProps<TData extends RowData> = {
|
|
|
2213
2213
|
* ```
|
|
2214
2214
|
*
|
|
2215
2215
|
* Sorting and filtering must be server-side (`manual*`) on a grid that
|
|
2216
|
-
* loads this way
|
|
2216
|
+
* loads this way - the client only ever holds a prefix of the data. Not
|
|
2217
2217
|
* compatible with `enablePagination`, which slices the same scroll.
|
|
2218
2218
|
*/
|
|
2219
2219
|
onReachEnd?: () => void;
|
|
@@ -2222,7 +2222,7 @@ type TMDataGridTableProps<TData extends RowData> = {
|
|
|
2222
2222
|
*/
|
|
2223
2223
|
reachEndThreshold?: number;
|
|
2224
2224
|
/**
|
|
2225
|
-
* Accessible name for the grid
|
|
2225
|
+
* Accessible name for the grid - what a screen reader announces on entry,
|
|
2226
2226
|
* and what `getByRole("grid", { name })` matches. Worth setting on any page
|
|
2227
2227
|
* holding more than one grid; without it they are all just "grid".
|
|
2228
2228
|
*/
|
|
@@ -2232,7 +2232,7 @@ type TMDataGridTableProps<TData extends RowData> = {
|
|
|
2232
2232
|
};
|
|
2233
2233
|
/**
|
|
2234
2234
|
* The scrollable grid surface. Always virtualized: only the rows inside the
|
|
2235
|
-
* viewport (plus overscan) are mounted
|
|
2235
|
+
* viewport (plus overscan) are mounted - which is what makes the default
|
|
2236
2236
|
* no-pagination mode viable at any row count. Pagination is opt-in via
|
|
2237
2237
|
* `enablePagination` (or implied by `manualPagination`).
|
|
2238
2238
|
*/
|
|
@@ -2248,7 +2248,7 @@ declare function TMDataGridToolbarSpacer(): import("react").JSX.Element;
|
|
|
2248
2248
|
/**
|
|
2249
2249
|
* A small spinner shown while `meta.loading` is true, and nothing otherwise.
|
|
2250
2250
|
*
|
|
2251
|
-
* The body only shows its loading state while the grid is *empty*
|
|
2251
|
+
* The body only shows its loading state while the grid is *empty* - a
|
|
2252
2252
|
* server-driven grid refetching with rows on screen keeps showing them, which
|
|
2253
2253
|
* is right, but leaves nothing saying a fetch is running. This is that signal,
|
|
2254
2254
|
* and the consumer decides where it sits by placing it in the toolbar:
|
|
@@ -2265,13 +2265,13 @@ declare function TMDataGridToolbarSpacer(): import("react").JSX.Element;
|
|
|
2265
2265
|
declare function TMDataGridLoadingIndicator(): import("react").JSX.Element | null;
|
|
2266
2266
|
/**
|
|
2267
2267
|
* Visible rows over total rows. On a server-driven grid, set
|
|
2268
|
-
* `meta.totalRowCount` for the denominator
|
|
2268
|
+
* `meta.totalRowCount` for the denominator - the client never sees every row.
|
|
2269
2269
|
*/
|
|
2270
2270
|
declare function TMDataGridSummaryCount({ children }: {
|
|
2271
2271
|
children?: ReactNode;
|
|
2272
2272
|
}): import("react").JSX.Element;
|
|
2273
2273
|
/**
|
|
2274
|
-
* Burger menu in the grid's top-right corner
|
|
2274
|
+
* Burger menu in the grid's top-right corner - opens "Manage columns".
|
|
2275
2275
|
* Renders nothing when no column can be hidden (`enableHiding: false`).
|
|
2276
2276
|
*/
|
|
2277
2277
|
declare function TMDataGridColumnsButton(): import("react").JSX.Element | null;
|
|
@@ -2292,7 +2292,7 @@ type TMDataGridProps<TData extends RowData> = TMDataGridApi<TData> & {
|
|
|
2292
2292
|
className?: string;
|
|
2293
2293
|
/**
|
|
2294
2294
|
* Inline styles. Widened to accept CSS variables, which is how the grid's
|
|
2295
|
-
* colours are themed
|
|
2295
|
+
* colours are themed - `--dg-row-selected-bg` for the selected row
|
|
2296
2296
|
* background. Plain `CSSProperties` rejects `--*` keys.
|
|
2297
2297
|
*/
|
|
2298
2298
|
style?: CSSProperties & Record<`--${string}`, string | number>;
|
|
@@ -2301,7 +2301,7 @@ type TMDataGridProps<TData extends RowData> = TMDataGridApi<TData> & {
|
|
|
2301
2301
|
/**
|
|
2302
2302
|
* Names this grid for tests. The grid names its own pieces with
|
|
2303
2303
|
* `data-dg-part` rather than minting test ids, and those repeat across
|
|
2304
|
-
* grids
|
|
2304
|
+
* grids - scope through this one and they stop colliding:
|
|
2305
2305
|
*
|
|
2306
2306
|
* ```ts
|
|
2307
2307
|
* page.getByTestId("orders").locator('[data-dg-part="row"][data-row-id="42"]')
|
|
@@ -2312,7 +2312,7 @@ type TMDataGridProps<TData extends RowData> = TMDataGridApi<TData> & {
|
|
|
2312
2312
|
"data-testid"?: string;
|
|
2313
2313
|
};
|
|
2314
2314
|
/**
|
|
2315
|
-
* Root of the grid. Takes the object returned by `useTMDataGrid`
|
|
2315
|
+
* Root of the grid. Takes the object returned by `useTMDataGrid` - spread it -
|
|
2316
2316
|
* and publishes it to the compound components below it:
|
|
2317
2317
|
*
|
|
2318
2318
|
* ```tsx
|
|
@@ -2345,7 +2345,7 @@ declare const TMDataGrid: typeof TMDataGridRoot & {
|
|
|
2345
2345
|
FilterPanel: typeof TMDataGridFilterPanel;
|
|
2346
2346
|
/**
|
|
2347
2347
|
* Takes the grid as an `api` prop rather than from context, so it can be
|
|
2348
|
-
* rendered outside `<TMDataGrid>`
|
|
2348
|
+
* rendered outside `<TMDataGrid>` - a page header, for instance.
|
|
2349
2349
|
*/
|
|
2350
2350
|
FilterPills: typeof TMDataGridFilterPills;
|
|
2351
2351
|
/** Rendered by `TMDataGrid.ColumnsButton`; exported for custom layouts. */
|
|
@@ -2377,7 +2377,7 @@ declare function formatGroupValue(value: unknown, blankLabel?: string): string;
|
|
|
2377
2377
|
//#endregion
|
|
2378
2378
|
//#region .types-tmp/components/filters/TMDataGridFilterValueInput.d.ts
|
|
2379
2379
|
/**
|
|
2380
|
-
* The built-in value control of a filter-panel row
|
|
2380
|
+
* The built-in value control of a filter-panel row - what renders when a
|
|
2381
2381
|
* column declares no `meta.filterControl`. Shaped by the operator: a
|
|
2382
2382
|
* multi-select for the set operators, a From/To pair for `between`, a Yes/No
|
|
2383
2383
|
* dropdown for booleans, a typed input otherwise.
|
|
@@ -2400,7 +2400,7 @@ declare function DgRangeSliderFilter(args: TMDataGridFilterControlArgs): import(
|
|
|
2400
2400
|
//#region .types-tmp/components/filters/DgDateRangeFilter.d.ts
|
|
2401
2401
|
/**
|
|
2402
2402
|
* A built-in `meta.filterControl` for `date` columns: a From/To pair of
|
|
2403
|
-
* native date inputs writing the `between` pair
|
|
2403
|
+
* native date inputs writing the `between` pair - no `@mantine/dates`
|
|
2404
2404
|
* involved, like the built-in date editor. Pair it with
|
|
2405
2405
|
* `meta.defaultFilterOperator: "between"`; any non-range operator falls back
|
|
2406
2406
|
* to the standard input.
|
|
@@ -2419,7 +2419,7 @@ declare function DgAutocompleteFilter(args: TMDataGridFilterControlArgs): import
|
|
|
2419
2419
|
//#region .types-tmp/components/filters/DgTriStateFilter.d.ts
|
|
2420
2420
|
/**
|
|
2421
2421
|
* A built-in `meta.filterControl` for `boolean` columns: an All / Yes / No
|
|
2422
|
-
* segmented control
|
|
2422
|
+
* segmented control - All clears the value, which deactivates the filter.
|
|
2423
2423
|
* Set or range operators fall back to the standard input.
|
|
2424
2424
|
*/
|
|
2425
2425
|
declare function DgTriStateFilter(args: TMDataGridFilterControlArgs): import("react").JSX.Element;
|
|
@@ -2433,12 +2433,12 @@ declare function TMDataGridStringEditor({ field, autoFocus, column, size }: TMDa
|
|
|
2433
2433
|
declare function TMDataGridNumberEditor({ field, autoFocus, column, size }: TMDataGridEditorArgs): import("react").JSX.Element;
|
|
2434
2434
|
//#endregion
|
|
2435
2435
|
//#region .types-tmp/components/editors/TMDataGridBooleanEditor.d.ts
|
|
2436
|
-
/** The built-in editor for `meta.type: "boolean"`
|
|
2436
|
+
/** The built-in editor for `meta.type: "boolean"` - a focused checkbox. */
|
|
2437
2437
|
declare function TMDataGridBooleanEditor({ field, autoFocus, column, size }: TMDataGridEditorArgs): import("react").JSX.Element;
|
|
2438
2438
|
//#endregion
|
|
2439
2439
|
//#region .types-tmp/components/editors/TMDataGridDateEditor.d.ts
|
|
2440
2440
|
/**
|
|
2441
|
-
* The built-in editor for `meta.type: "date"`
|
|
2441
|
+
* The built-in editor for `meta.type: "date"` - the native
|
|
2442
2442
|
* `<input type="date">` styled by Mantine, no `@mantine/dates` involved. A
|
|
2443
2443
|
* consumer wanting a real picker plugs one in through `meta.editor`.
|
|
2444
2444
|
*/
|
|
@@ -2447,14 +2447,14 @@ declare function TMDataGridDateEditor({ field, autoFocus, column, size }: TMData
|
|
|
2447
2447
|
//#region .types-tmp/components/editors/TMDataGridSelectEditor.d.ts
|
|
2448
2448
|
/**
|
|
2449
2449
|
* The built-in editor for `meta.type: "select"`. Options come from the same
|
|
2450
|
-
* `meta.options` the filter panel reads
|
|
2450
|
+
* `meta.options` the filter panel reads - with the row in hand, so a
|
|
2451
2451
|
* function source can depend on the record being edited.
|
|
2452
2452
|
*/
|
|
2453
2453
|
declare function TMDataGridSelectEditor({ field, autoFocus, column, row, table, size, commit }: TMDataGridEditorArgs): import("react").JSX.Element;
|
|
2454
2454
|
//#endregion
|
|
2455
2455
|
//#region .types-tmp/components/editors/TMDataGridMultiSelectEditor.d.ts
|
|
2456
2456
|
/**
|
|
2457
|
-
* The built-in editor for `meta.type: "multiSelect"`
|
|
2457
|
+
* The built-in editor for `meta.type: "multiSelect"` - cells holding string
|
|
2458
2458
|
* arrays. Never commits on pick: building a set takes several, so the commit
|
|
2459
2459
|
* stays on Enter/blur like a text edit.
|
|
2460
2460
|
*/
|
|
@@ -2492,18 +2492,18 @@ type ColumnLike = {
|
|
|
2492
2492
|
declare function getColumnLabel(column: ColumnLike): string;
|
|
2493
2493
|
declare function getColumnType(column: ColumnLike): TMDataGridColumnType;
|
|
2494
2494
|
/**
|
|
2495
|
-
* The operator a fresh filter on this column starts with
|
|
2495
|
+
* The operator a fresh filter on this column starts with -
|
|
2496
2496
|
* `meta.defaultFilterOperator`, else the type's default.
|
|
2497
2497
|
*/
|
|
2498
2498
|
declare function getColumnDefaultOperator(column: ColumnLike): TMDataGridFilterOperator;
|
|
2499
2499
|
/**
|
|
2500
|
-
* A generated lane holding one fixed-width thing
|
|
2500
|
+
* A generated lane holding one fixed-width thing - the checkbox, the details
|
|
2501
2501
|
* chevron, the row number.
|
|
2502
2502
|
*
|
|
2503
2503
|
* They are laid out differently from every other column: cell padding is sized
|
|
2504
2504
|
* for text and grows with the scale, which at `xl` squeezed a 16px checkbox out
|
|
2505
2505
|
* of its track, so these lanes centre their content in an unpadded cell.
|
|
2506
|
-
* Their headers carry no column menu, and none of them is ever exported
|
|
2506
|
+
* Their headers carry no column menu, and none of them is ever exported -
|
|
2507
2507
|
* they hold chrome, not values.
|
|
2508
2508
|
*
|
|
2509
2509
|
* The tree column is deliberately not one of them: it holds a label as well as a
|
|
@@ -2536,10 +2536,10 @@ declare function isColumnReorderable(column: ColumnLike): boolean;
|
|
|
2536
2536
|
declare function getGroupDataRows<TData extends RowData>(row: Row<TMDataGridFeatures, TData>): Array<Row<TMDataGridFeatures, TData>>;
|
|
2537
2537
|
//#endregion
|
|
2538
2538
|
//#region .types-tmp/core/summary.d.ts
|
|
2539
|
-
/** The registered aggregation names
|
|
2539
|
+
/** The registered aggregation names - the same set `aggregationFn` accepts. */
|
|
2540
2540
|
type TMDataGridAggregationName = keyof typeof aggregationFns;
|
|
2541
2541
|
/**
|
|
2542
|
-
* One column aggregated over every filtered row
|
|
2542
|
+
* One column aggregated over every filtered row - the number a summary-row
|
|
2543
2543
|
* `footer` wants:
|
|
2544
2544
|
*
|
|
2545
2545
|
* ```tsx
|
|
@@ -2549,7 +2549,7 @@ type TMDataGridAggregationName = keyof typeof aggregationFns;
|
|
|
2549
2549
|
* ```
|
|
2550
2550
|
*
|
|
2551
2551
|
* Filtered rather than paginated rows, so the total covers everything the
|
|
2552
|
-
* filters left
|
|
2552
|
+
* filters left (all pages), and follows the filters as they change. Reuses
|
|
2553
2553
|
* TanStack's registered aggregation functions; `fn` defaults to `"sum"`.
|
|
2554
2554
|
*/
|
|
2555
2555
|
declare function aggregateColumn<TData extends RowData>({ table, columnId, fn }: {
|
|
@@ -2563,16 +2563,16 @@ declare function aggregateColumn<TData extends RowData>({ table, columnId, fn }:
|
|
|
2563
2563
|
* Widest rendered content of one column, in px, measured from the DOM.
|
|
2564
2564
|
*
|
|
2565
2565
|
* Mounted cells only: under virtualization the unmounted rows do not exist to
|
|
2566
|
-
* be measured, so this reads the visible window plus overscan
|
|
2566
|
+
* be measured, so this reads the visible window plus overscan - the same
|
|
2567
2567
|
* trade AG Grid's autosize makes by default.
|
|
2568
2568
|
*/
|
|
2569
2569
|
declare function measureColumnContentWidth({ container, columnId }: {
|
|
2570
|
-
/** The grid's scroll container
|
|
2570
|
+
/** The grid's scroll container - anything enclosing the column's cells. */
|
|
2571
2571
|
container: HTMLElement;
|
|
2572
2572
|
columnId: string;
|
|
2573
2573
|
}): number;
|
|
2574
2574
|
/**
|
|
2575
|
-
* Sizes a column to its widest mounted content
|
|
2575
|
+
* Sizes a column to its widest mounted content - what double-clicking the
|
|
2576
2576
|
* resize divider does, exported so a menu item or consumer code can trigger
|
|
2577
2577
|
* the same thing.
|
|
2578
2578
|
*
|
|
@@ -2593,8 +2593,8 @@ declare function autosizeColumn<TData extends RowData>({ table, columnId, contai
|
|
|
2593
2593
|
*
|
|
2594
2594
|
* TanStack keeps one `expanded` state, and the grid opens two unrelated things
|
|
2595
2595
|
* out of it: a group row opens into its children, a data row opens into its
|
|
2596
|
-
* detail panel. So `toggleAllRowsExpanded`
|
|
2597
|
-
* whole-table form
|
|
2596
|
+
* detail panel. So `toggleAllRowsExpanded` - which writes the state's
|
|
2597
|
+
* whole-table form - is the wrong verb for either control. "Expand all groups"
|
|
2598
2598
|
* in the tree menu would open every panel in the grid, and the details lane's
|
|
2599
2599
|
* chevron would unfold the whole tree.
|
|
2600
2600
|
*
|
|
@@ -2604,7 +2604,7 @@ declare function autosizeColumn<TData extends RowData>({ table, columnId, contai
|
|
|
2604
2604
|
type TMDataGridExpandTarget = "groups" | "details";
|
|
2605
2605
|
type TMDataGridExpandAllArgs<TData extends RowData> = {
|
|
2606
2606
|
/**
|
|
2607
|
-
* Every row in the model, groups and records alike
|
|
2607
|
+
* Every row in the model, groups and records alike - `flatRows` off any of
|
|
2608
2608
|
* them. A grouped model lists its leaves both under their group and in the
|
|
2609
2609
|
* flat list, so this may repeat rows; both helpers are written so that a
|
|
2610
2610
|
* repeat costs nothing.
|
|
@@ -2614,7 +2614,7 @@ type TMDataGridExpandAllArgs<TData extends RowData> = {
|
|
|
2614
2614
|
target: TMDataGridExpandTarget;
|
|
2615
2615
|
};
|
|
2616
2616
|
/**
|
|
2617
|
-
* Whether every row of this kind is open
|
|
2617
|
+
* Whether every row of this kind is open - what the control shows, and what a
|
|
2618
2618
|
* bare toggle inverts.
|
|
2619
2619
|
*
|
|
2620
2620
|
* `false` when there are none of them, matching TanStack's own
|
|
@@ -2639,7 +2639,7 @@ type GridTable = TMDataGridTable<TMDataGridRowData>;
|
|
|
2639
2639
|
* Pinning splits the grid into three, and TanStack sequences them from two
|
|
2640
2640
|
* different state slices: `columnPinning.left` / `.right` order the pinned
|
|
2641
2641
|
* lanes, `columnOrder` orders the centre. A move therefore always stays inside
|
|
2642
|
-
* one lane
|
|
2642
|
+
* one lane - moving a column into another one would be a pin, not a reorder.
|
|
2643
2643
|
*/
|
|
2644
2644
|
type TMDataGridColumnRegion = "left" | "center" | "right";
|
|
2645
2645
|
/** Which edge of the column under the pointer a dragged column lands on. */
|
|
@@ -2673,7 +2673,7 @@ type ColumnStepArgs = {
|
|
|
2673
2673
|
* The column a single step would swap with, or `null` when there is none.
|
|
2674
2674
|
*
|
|
2675
2675
|
* A neighbour that cannot be reordered acts as a wall rather than being skipped
|
|
2676
|
-
*
|
|
2676
|
+
* - that is what keeps the checkbox column anchored at the start of the left
|
|
2677
2677
|
* lane. Use it to enable or disable a "move" control.
|
|
2678
2678
|
*/
|
|
2679
2679
|
declare function getStepTargetColumn({ table, columnId, direction }: ColumnStepArgs): GridColumn | null;
|
|
@@ -2683,17 +2683,17 @@ declare function moveColumnByStep({ table, columnId, direction }: ColumnStepArgs
|
|
|
2683
2683
|
//#region .types-tmp/core/rowSelection.d.ts
|
|
2684
2684
|
/**
|
|
2685
2685
|
* Rows in the order they are displayed, which is the order a shift-click range
|
|
2686
|
-
* is measured over
|
|
2686
|
+
* is measured over - so a range follows the active sort and skips filtered-out
|
|
2687
2687
|
* rows. Under pagination it is the current page, so a range cannot cross a page
|
|
2688
2688
|
* boundary.
|
|
2689
2689
|
*
|
|
2690
2690
|
* Once a column is grouped this includes the group rows, and only the leaves of
|
|
2691
|
-
* groups that are open
|
|
2691
|
+
* groups that are open - and paging is suspended, so it is the whole tree. That
|
|
2692
2692
|
* is the right list for a range: it is what the user can see, and a range that
|
|
2693
2693
|
* swept collapsed rows would select things off screen. What a group row in the
|
|
2694
2694
|
* range contributes is decided by {@link getSelectableRowIds}.
|
|
2695
2695
|
*
|
|
2696
|
-
* Rows pinned to an edge leave this list
|
|
2696
|
+
* Rows pinned to an edge leave this list - they render in their own sticky
|
|
2697
2697
|
* blocks, outside the scrolling order a shift-click range or the virtualizer
|
|
2698
2698
|
* walks. See `readPinnedRows`.
|
|
2699
2699
|
*/
|
|
@@ -2707,7 +2707,7 @@ declare function getDisplayedRows<TData extends RowData>(table: TMDataGridTable<
|
|
|
2707
2707
|
* to go looking for, and counting only the top-level rows quietly redefines
|
|
2708
2708
|
* "rows per page" as groups per page, so a page of 25 can hold thousands of
|
|
2709
2709
|
* rows. Rather than pick, the grid renders the whole tree and leans on the
|
|
2710
|
-
* virtualizer
|
|
2710
|
+
* virtualizer - which is its default mode anyway, pagination being opt-in.
|
|
2711
2711
|
*
|
|
2712
2712
|
* `TMDataGrid.Footer` reads this too, and greys the pager out rather than
|
|
2713
2713
|
* hiding it, so the pager going quiet is visible instead of mysterious.
|
|
@@ -2715,7 +2715,7 @@ declare function getDisplayedRows<TData extends RowData>(table: TMDataGridTable<
|
|
|
2715
2715
|
declare function isPagingActive<TData extends RowData>(table: TMDataGridTable<TData>, features: TMDataGridFeatureFlags): boolean;
|
|
2716
2716
|
/**
|
|
2717
2717
|
* Which modifiers were held. Named for what they mean rather than for the keys,
|
|
2718
|
-
* because the keys differ per platform
|
|
2718
|
+
* because the keys differ per platform - `toggle` is Ctrl on Windows/Linux and
|
|
2719
2719
|
* Cmd on macOS.
|
|
2720
2720
|
*/
|
|
2721
2721
|
type TMDataGridRowClickModifiers = {
|
|
@@ -2723,7 +2723,7 @@ type TMDataGridRowClickModifiers = {
|
|
|
2723
2723
|
extend: boolean;
|
|
2724
2724
|
};
|
|
2725
2725
|
type ResolveRowSelectionClickArgs<TData extends RowData> = {
|
|
2726
|
-
/** Displayed order
|
|
2726
|
+
/** Displayed order - see {@link getDisplayedRows}. */
|
|
2727
2727
|
rows: ReadonlyArray<Row<TMDataGridFeatures, TData>>;
|
|
2728
2728
|
rowId: string;
|
|
2729
2729
|
/** The pivot a shift-click extends from. */
|
|
@@ -2734,7 +2734,7 @@ type ResolveRowSelectionClickArgs<TData extends RowData> = {
|
|
|
2734
2734
|
* Whether this gesture is allowed to clear rows it did not touch.
|
|
2735
2735
|
*
|
|
2736
2736
|
* `true` for a bare row click, where replacing is the whole point. `false` for
|
|
2737
|
-
* a checkbox, which is only ever additive
|
|
2737
|
+
* a checkbox, which is only ever additive - ticking one box has never cleared
|
|
2738
2738
|
* the others, and shift-clicking one adds the range rather than becoming it.
|
|
2739
2739
|
*/
|
|
2740
2740
|
canReplaceSelection: boolean;
|