@jielga/tmdatagrid 2.0.0-beta.1 → 2.0.0-beta.2
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/dist/index.d.ts +60 -23
- package/dist/index.js +2020 -1704
- package/dist/index.js.map +1 -1
- package/dist/styles.css +1 -1
- package/package.json +1 -1
- package/skills/appearance/SKILL.md +1 -1
- package/skills/cell-selection/SKILL.md +1 -1
- package/skills/columns/SKILL.md +2 -2
- package/skills/data/SKILL.md +1 -1
- package/skills/editing/SKILL.md +68 -213
- package/skills/editing/references/common-mistakes.md +177 -0
- package/skills/editing/references/editing-api.md +39 -13
- package/skills/editing/references/editors-and-validation.md +5 -2
- package/skills/filtering/SKILL.md +1 -1
- package/skills/getting-started/SKILL.md +1 -1
- package/skills/grouping/SKILL.md +1 -1
- package/skills/options/SKILL.md +2 -2
- package/skills/rows/SKILL.md +1 -1
- package/skills/rows/references/rows-api.md +1 -1
- package/skills/server-side/SKILL.md +1 -1
- package/skills/testing/SKILL.md +3 -2
- package/src/tmdatagrid/components/TMDataGrid.module.css +7 -0
- package/src/tmdatagrid/components/TMDataGridCellEditor.tsx +20 -8
- package/src/tmdatagrid/components/TMDataGridEditActions.tsx +1 -1
- package/src/tmdatagrid/components/TMDataGridEditColumn.tsx +242 -86
- package/src/tmdatagrid/components/TMDataGridEntryRows.tsx +176 -77
- package/src/tmdatagrid/components/TMDataGridTable.module.css +47 -3
- package/src/tmdatagrid/components/TMDataGridTable.tsx +44 -4
- package/src/tmdatagrid/components/icons.ts +1 -0
- package/src/tmdatagrid/core/capabilities.ts +10 -0
- package/src/tmdatagrid/core/draftCellContext.ts +68 -0
- package/src/tmdatagrid/core/editEngine.ts +106 -32
- package/src/tmdatagrid/core/labels.ts +13 -1
- package/src/tmdatagrid/core/labelsSv.ts +4 -0
- package/src/tmdatagrid/index.ts +1 -1
- package/src/tmdatagrid/useTMDataGrid.tsx +39 -20
package/dist/index.d.ts
CHANGED
|
@@ -59,7 +59,7 @@ type TMDataGridEditActionsProps = {
|
|
|
59
59
|
renderActions?: (args: TMDataGridEditActionsSlotArgs) => ReactNode;
|
|
60
60
|
};
|
|
61
61
|
/**
|
|
62
|
-
*
|
|
62
|
+
* Draft mode's toolbar chrome: Save with the dirty-row count, and Discard.
|
|
63
63
|
* Both read the edit store, so they grey out while nothing is dirty and the
|
|
64
64
|
* Save spins while a submit is in flight. Works under any `editing.mode` - a
|
|
65
65
|
* cellConfirm grid accumulating drafts can offer the same pair - and renders
|
|
@@ -262,7 +262,7 @@ declare function tmDataGridFilterFn<TFeatures extends TableFeatures, TData exten
|
|
|
262
262
|
* How commits happen - one axis, each mode a thin policy over the same
|
|
263
263
|
* engine. See `editMode` on `UseTMDataGridOptions`.
|
|
264
264
|
*/
|
|
265
|
-
type TMDataGridEditMode = "cell" | "cellConfirm" | "row" | "
|
|
265
|
+
type TMDataGridEditMode = "cell" | "cellConfirm" | "row" | "draft";
|
|
266
266
|
/**
|
|
267
267
|
* One editing row's live form. TanStack Form's `FormApi`, not a wrapper: the
|
|
268
268
|
* engine is a form library, and everything mid-edit - values, dirty state,
|
|
@@ -344,6 +344,12 @@ type TMDataGridEditRowProjection = {
|
|
|
344
344
|
/** A row-level error - a pathless `.refine()`, or a rejected commit. */
|
|
345
345
|
hasRowError: boolean;
|
|
346
346
|
isSubmitting: boolean;
|
|
347
|
+
/**
|
|
348
|
+
* The row as drafted - the form's `state.values`. Reference-stable while no
|
|
349
|
+
* value changes, so a cell may subscribe to it and repaint only when its
|
|
350
|
+
* row's draft actually moves.
|
|
351
|
+
*/
|
|
352
|
+
values: TMDataGridRowData;
|
|
347
353
|
};
|
|
348
354
|
/**
|
|
349
355
|
* The grid-facing index of everything mid-edit. A projection synced from the
|
|
@@ -363,15 +369,21 @@ type TMDataGridEditState = {
|
|
|
363
369
|
} | null;
|
|
364
370
|
/**
|
|
365
371
|
* Rows with a live form. In cell mode at most one; in row, cellConfirm and
|
|
366
|
-
*
|
|
372
|
+
* draft, as many as the user opened - which rows are editing.
|
|
367
373
|
*/
|
|
368
374
|
openRowIds: ReadonlyArray<string>;
|
|
369
375
|
rows: Record<string, TMDataGridEditRowProjection>;
|
|
370
|
-
/**
|
|
376
|
+
/**
|
|
377
|
+
* Rows being created, not yet in `data`. `confirmed` is draft mode's
|
|
378
|
+
* "entered, awaiting Save all": the entry row renders as a value row until
|
|
379
|
+
* `begin` re-opens it. Under the immediate modes a confirm commits through
|
|
380
|
+
* `onRowAdd` and the entry is dropped, so there it never turns `true`.
|
|
381
|
+
*/
|
|
371
382
|
newRows: ReadonlyArray<{
|
|
372
383
|
tempId: string;
|
|
384
|
+
confirmed: boolean;
|
|
373
385
|
}>;
|
|
374
|
-
/**
|
|
386
|
+
/** Rows marked deleted under draft mode. */
|
|
375
387
|
deletedRowIds: ReadonlyArray<string>;
|
|
376
388
|
};
|
|
377
389
|
type ErasedRow = Row<TMDataGridFeatures, TMDataGridRowData>;
|
|
@@ -492,13 +504,13 @@ type TMDataGridRowDeleteArgs<TData extends RowData> = {
|
|
|
492
504
|
rowId: string;
|
|
493
505
|
row: Row<TMDataGridFeatures, TData>;
|
|
494
506
|
};
|
|
495
|
-
/** What `submitAll` hands `
|
|
496
|
-
type
|
|
507
|
+
/** What `submitAll` hands `onEditCommitDrafts` - everything pending at once. */
|
|
508
|
+
type TMDataGridEditCommitDraftsArgs<TData extends RowData> = {
|
|
497
509
|
/** Every valid dirty existing row. */
|
|
498
510
|
rows: Array<TMDataGridEditCommitArgs<TData>>;
|
|
499
511
|
/** Every valid new row from the entry block. */
|
|
500
512
|
added: Array<TMDataGridRowAddArgs<TData>>;
|
|
501
|
-
/** Ids marked deleted while the
|
|
513
|
+
/** Ids marked deleted while the drafts accumulated. */
|
|
502
514
|
deleted: Array<string>;
|
|
503
515
|
};
|
|
504
516
|
/**
|
|
@@ -567,7 +579,7 @@ type TMDataGridEditApi = {
|
|
|
567
579
|
deactivate: () => void;
|
|
568
580
|
/** Drops every draft. */
|
|
569
581
|
cancelAll: () => void;
|
|
570
|
-
/** Commits every open row -
|
|
582
|
+
/** Commits every open row - draft mode's save. `true` when all landed. */
|
|
571
583
|
submitAll: () => Promise<boolean>;
|
|
572
584
|
/** Writes the type's empty value into a cell and commits it - Delete. */
|
|
573
585
|
clearCell: (rowId: string, columnId: string) => Promise<boolean>;
|
|
@@ -575,12 +587,12 @@ type TMDataGridEditApi = {
|
|
|
575
587
|
* Opens a new entry row (the sticky block under the header) seeded from
|
|
576
588
|
* `newRowDefaults`. Returns its temporary id - a form with no backing row
|
|
577
589
|
* yet. Committing it calls `onRowAdd` (immediate modes) or joins
|
|
578
|
-
* `submitAll`'s `added` (
|
|
590
|
+
* `submitAll`'s `added` (draft).
|
|
579
591
|
*/
|
|
580
592
|
addRow: () => string;
|
|
581
593
|
/**
|
|
582
594
|
* Deletes a row: `onRowDelete` straight away under the immediate modes;
|
|
583
|
-
* under
|
|
595
|
+
* under draft it toggles the id in `deletedRowIds` - the row renders
|
|
584
596
|
* struck through until `submitAll` reports it. On an uncommitted entry
|
|
585
597
|
* row it just discards the entry.
|
|
586
598
|
*/
|
|
@@ -701,8 +713,16 @@ type TMDataGridLabels = {
|
|
|
701
713
|
discardNewRow: string;
|
|
702
714
|
/** The lane's trash can. */
|
|
703
715
|
deleteRow: string;
|
|
704
|
-
/** The lane's undo on a row marked deleted (
|
|
716
|
+
/** The lane's undo on a row marked deleted (draft). */
|
|
705
717
|
restoreRow: string;
|
|
718
|
+
/** The lane's undo on a row with a dirty draft (draft) - drops it. */
|
|
719
|
+
revertRow: string;
|
|
720
|
+
/** The lane's state icon on a confirmed entry row (draft). */
|
|
721
|
+
rowStateNew: string;
|
|
722
|
+
/** The lane's state icon on a row with a dirty draft (draft). */
|
|
723
|
+
rowStateEdited: string;
|
|
724
|
+
/** The lane's state icon on a row marked deleted (draft). */
|
|
725
|
+
rowStateDeleted: string;
|
|
706
726
|
cellCount: (count: number) => string;
|
|
707
727
|
copy: string;
|
|
708
728
|
exportCsv: string;
|
|
@@ -987,6 +1007,13 @@ type TMDataGridFeatureFlags = {
|
|
|
987
1007
|
editing: boolean;
|
|
988
1008
|
/** The commit policy, or `null` while editing is off. */
|
|
989
1009
|
editMode: TMDataGridEditMode | null;
|
|
1010
|
+
/**
|
|
1011
|
+
* Whether a confirmed entry row stays pinned in the sticky entry block
|
|
1012
|
+
* until Save all - `editing.newRowsSticky`, draft mode only. Off by
|
|
1013
|
+
* default: a confirmed row joins the scrolling flow instead, so entering
|
|
1014
|
+
* many rows cannot fill the viewport with sticky chrome.
|
|
1015
|
+
*/
|
|
1016
|
+
editNewRowsSticky: boolean;
|
|
990
1017
|
/** The generated row-number gutter - `enableRowNumbers`. Off by default. */
|
|
991
1018
|
rowNumbers: boolean;
|
|
992
1019
|
/**
|
|
@@ -1601,13 +1628,13 @@ type TMDataGridEditingCallbacks<TData extends RowData> = {
|
|
|
1601
1628
|
newRowDefaults?: TData | (() => TData);
|
|
1602
1629
|
/**
|
|
1603
1630
|
* Called when an entry row commits: `Enter` or the lane's ✓ under the
|
|
1604
|
-
* immediate modes, `submitAll` under
|
|
1631
|
+
* immediate modes, `submitAll` under draft. Create the record and let it
|
|
1605
1632
|
* arrive back through `data`; the engine's `tempId` never leaves the grid.
|
|
1606
1633
|
*/
|
|
1607
1634
|
onRowAdd?: (args: TMDataGridRowAddArgs<TData>) => void | Promise<void>;
|
|
1608
1635
|
/**
|
|
1609
1636
|
* Called by `edit.deleteRow` under the immediate modes - confirmation, if
|
|
1610
|
-
* any, belongs in here. Under
|
|
1637
|
+
* any, belongs in here. Under draft, deletions accumulate in
|
|
1611
1638
|
* `edit.state.deletedRowIds` instead and are reported by `submitAll`.
|
|
1612
1639
|
* Setting this also puts the trash can in the edit lane.
|
|
1613
1640
|
*/
|
|
@@ -1623,11 +1650,11 @@ type TMDataGridEditingCallbacks<TData extends RowData> = {
|
|
|
1623
1650
|
* | `"cell"` | Enter, Tab, blur - Sheets | Escape |
|
|
1624
1651
|
* | `"cellConfirm"` | ✓ or Enter only; blur keeps the draft | ✕ or Escape |
|
|
1625
1652
|
* | `"row"` | Save in the edit lane, or Ctrl+Enter | Cancel, or Escape |
|
|
1626
|
-
* | `"
|
|
1653
|
+
* | `"draft"` | `edit.submitAll()` | `edit.cancelAll()` |
|
|
1627
1654
|
*
|
|
1628
1655
|
* Setting `editing` makes `getRowId` required - drafts are keyed by row id,
|
|
1629
1656
|
* and the index fallback would name a different record after any sort - and
|
|
1630
|
-
* `
|
|
1657
|
+
* `onCommitDrafts` exists only under `mode: "draft"`, the one mode whose
|
|
1631
1658
|
* `submitAll` calls it.
|
|
1632
1659
|
*
|
|
1633
1660
|
* The object may be written inline: the callbacks are read through a ref
|
|
@@ -1640,18 +1667,28 @@ type TMDataGridEditingCallbacks<TData extends RowData> = {
|
|
|
1640
1667
|
* override the rest.
|
|
1641
1668
|
*/
|
|
1642
1669
|
type TMDataGridEditingOptions<TData extends RowData> = TMDataGridEditingCallbacks<TData> & ({
|
|
1643
|
-
mode: "
|
|
1670
|
+
mode: "draft";
|
|
1644
1671
|
/**
|
|
1645
|
-
*
|
|
1672
|
+
* Draft mode's save, called once by `edit.submitAll()` with every
|
|
1646
1673
|
* valid dirty row. Without it, `submitAll` falls back to the per-row
|
|
1647
1674
|
* {@link TMDataGridEditingCallbacks.onCommit} loop. Rows failing
|
|
1648
1675
|
* validation stay open either way; a rejection keeps every draft.
|
|
1649
1676
|
*/
|
|
1650
|
-
|
|
1677
|
+
onCommitDrafts?: (args: TMDataGridEditCommitDraftsArgs<TData>) => void | Promise<void>;
|
|
1678
|
+
/**
|
|
1679
|
+
* Keep confirmed entry rows pinned in the sticky entry block until
|
|
1680
|
+
* Save all. Off by default: a confirmed row joins the scrolling
|
|
1681
|
+
* flow above the body rows instead - the block a row is *typed*
|
|
1682
|
+
* into is always sticky, but entered rows scroll, so entering many
|
|
1683
|
+
* cannot fill the viewport with sticky chrome.
|
|
1684
|
+
*/
|
|
1685
|
+
newRowsSticky?: boolean;
|
|
1651
1686
|
} | {
|
|
1652
|
-
mode: Exclude<TMDataGridEditMode, "
|
|
1653
|
-
/** Only `"
|
|
1654
|
-
|
|
1687
|
+
mode: Exclude<TMDataGridEditMode, "draft">;
|
|
1688
|
+
/** Only `"draft"`'s `submitAll` ever calls it - see the other branch. */
|
|
1689
|
+
onCommitDrafts?: never;
|
|
1690
|
+
/** Confirmed entry rows exist only under `"draft"` - see there. */
|
|
1691
|
+
newRowsSticky?: never;
|
|
1655
1692
|
});
|
|
1656
1693
|
type UseTMDataGridOptions<TData extends RowData> = Omit<TableOptions<TMDataGridFeatures, TData>, "features"> & ({
|
|
1657
1694
|
editing?: undefined;
|
|
@@ -3069,4 +3106,4 @@ declare function getSelectableRowIds<TData extends RowData>(row: Row<TMDataGridF
|
|
|
3069
3106
|
*/
|
|
3070
3107
|
declare function resolveRowSelectionClick<TData extends RowData>({ rows, rowId, anchorRowId, modifiers, selection, canReplaceSelection }: ResolveRowSelectionClickArgs<TData>): ResolvedRowSelection;
|
|
3071
3108
|
//#endregion
|
|
3072
|
-
export { type BuildCellMatrixArgs, type ColumnStepArgs, DATA_STATE_SLICES, DEFAULT_CELL_EXPORT_OPTIONS, DEFAULT_TMDATAGRID_SIZE, DETAILS_COLUMN_ID, DgAutocompleteFilter, DgDateRangeFilter, DgRangeSliderFilter, DgTriStateFilter, EDIT_COLUMN_ID, FILTER_OPERATOR_LABELS, GROUP_COLUMN_ID, type MoveColumnArgs, PERSIST_PAYLOAD_VERSION, ROW_NUMBER_COLUMN_ID, type ResolveCellMoveArgs, type ResolveRangeBoundsArgs, type ResolveRowSelectionClickArgs, type ResolvedRowSelection, SELECT_COLUMN_ID, SETTINGS_STATE_SLICES, SIZE_CONTROL_SIZE, SIZE_ROW_HEIGHT, TMDATAGRID_LABELS_EN, TMDATAGRID_LABELS_SV, TMDataGrid, type TMDataGridAggregationName, type TMDataGridApi, TMDataGridBooleanEditor, type TMDataGridCapabilities, type TMDataGridCellCoords, type TMDataGridCellEventArgs, type TMDataGridCellExportOptions, type TMDataGridCellMatrix, type TMDataGridCellNav, type TMDataGridCellPosition, type TMDataGridCellRange, type TMDataGridCellSelectionMode, type TMDataGridColumnCapabilities, type TMDataGridColumnEditOptions, type TMDataGridColumnFilterOptions, type TMDataGridColumnLayout, type TMDataGridColumnMenuItemsArgs, type TMDataGridColumnMenuItemsRenderer, type TMDataGridColumnMeta, type TMDataGridColumnRegion, type TMDataGridColumnType, type TMDataGridContextValue, type TMDataGridDataSlice, TMDataGridDateEditor, type TMDataGridDetailsArgs, type TMDataGridDetailsRenderer, type TMDataGridDropSide, TMDataGridEditActions, type TMDataGridEditActionsActions, type TMDataGridEditActionsControls, type TMDataGridEditActionsProps, type TMDataGridEditActionsSlotArgs, type TMDataGridEditActionsState, type TMDataGridEditApi, type TMDataGridEditChange, type TMDataGridEditCommitArgs, type
|
|
3109
|
+
export { type BuildCellMatrixArgs, type ColumnStepArgs, DATA_STATE_SLICES, DEFAULT_CELL_EXPORT_OPTIONS, DEFAULT_TMDATAGRID_SIZE, DETAILS_COLUMN_ID, DgAutocompleteFilter, DgDateRangeFilter, DgRangeSliderFilter, DgTriStateFilter, EDIT_COLUMN_ID, FILTER_OPERATOR_LABELS, GROUP_COLUMN_ID, type MoveColumnArgs, PERSIST_PAYLOAD_VERSION, ROW_NUMBER_COLUMN_ID, type ResolveCellMoveArgs, type ResolveRangeBoundsArgs, type ResolveRowSelectionClickArgs, type ResolvedRowSelection, SELECT_COLUMN_ID, SETTINGS_STATE_SLICES, SIZE_CONTROL_SIZE, SIZE_ROW_HEIGHT, TMDATAGRID_LABELS_EN, TMDATAGRID_LABELS_SV, TMDataGrid, type TMDataGridAggregationName, type TMDataGridApi, TMDataGridBooleanEditor, type TMDataGridCapabilities, type TMDataGridCellCoords, type TMDataGridCellEventArgs, type TMDataGridCellExportOptions, type TMDataGridCellMatrix, type TMDataGridCellNav, type TMDataGridCellPosition, type TMDataGridCellRange, type TMDataGridCellSelectionMode, type TMDataGridColumnCapabilities, type TMDataGridColumnEditOptions, type TMDataGridColumnFilterOptions, type TMDataGridColumnLayout, type TMDataGridColumnMenuItemsArgs, type TMDataGridColumnMenuItemsRenderer, type TMDataGridColumnMeta, type TMDataGridColumnRegion, type TMDataGridColumnType, type TMDataGridContextValue, type TMDataGridDataSlice, TMDataGridDateEditor, type TMDataGridDetailsArgs, type TMDataGridDetailsRenderer, type TMDataGridDropSide, TMDataGridEditActions, type TMDataGridEditActionsActions, type TMDataGridEditActionsControls, type TMDataGridEditActionsProps, type TMDataGridEditActionsSlotArgs, type TMDataGridEditActionsState, type TMDataGridEditApi, type TMDataGridEditChange, type TMDataGridEditCommitArgs, type TMDataGridEditCommitDraftsArgs, type TMDataGridEditField, type TMDataGridEditMode, type TMDataGridEditRowProjection, type TMDataGridEditState, type TMDataGridEditValueMap, type TMDataGridEditValueMapArgs, type TMDataGridEditingOptions, type TMDataGridEditorArgs, type TMDataGridEditorComponent, type TMDataGridExpandAllArgs, type TMDataGridExpandTarget, type TMDataGridFeatureFlags, type TMDataGridFeatures, type TMDataGridFieldValidate, type TMDataGridFilterControlArgs, type TMDataGridFilterControlComponent, type TMDataGridFilterOperator, TMDataGridFilterPills, type TMDataGridFilterPillsProps, type TMDataGridFilterValue, TMDataGridFilterValueInput, type TMDataGridFooterProps, type TMDataGridLabels, type TMDataGridLabelsOverride, TMDataGridMultiSelectEditor, TMDataGridNumberEditor, type TMDataGridOption, type TMDataGridOptionsArgs, type TMDataGridOptionsSource, type TMDataGridPaginationActions, type TMDataGridPaginationApi, type TMDataGridPaginationControls, type TMDataGridPaginationSlotArgs, type TMDataGridPaginationState, type TMDataGridPersistKey, type TMDataGridPersistence, type TMDataGridProps, type TMDataGridQuickSearchMode, type TMDataGridRangeBounds, type TMDataGridRowAddArgs, type TMDataGridRowClickModifiers, type TMDataGridRowContextMenuArgs, type TMDataGridRowContextMenuRenderer, type TMDataGridRowData, type TMDataGridRowDeleteArgs, type TMDataGridRowEditForm, type TMDataGridRowStyle, type TMDataGridRowValidators, type TMDataGridScrollAlign, type TMDataGridScrollToRowArgs, TMDataGridSearch, type TMDataGridSearchProps, TMDataGridSelectEditor, type TMDataGridSelectionMode, type TMDataGridSettingsSlice, type TMDataGridSize, type TMDataGridStorageMode, TMDataGridStringEditor, type TMDataGridTable, type TMDataGridTableMeta, type TMDataGridTableProps, type TMDataGridUiActions, type TMDataGridUiState, type TMDataGridUiStore, type UseTMDataGridOptions, aggregateColumn, areAllRowsExpanded, autosizeColumn, boundsCellCount, boundsEdges, buildCellMatrix, buildGridCellMatrix, clearedValueForType, createTMDataGridColumnHelper, downloadTextFile, emptyValueForOperator, exportGridToCsv, formatExportValue, formatFilterLabel, formatGroupValue, fuzzyGlobalFilterFn, getColumnCapabilities, getColumnDefaultOperator, getColumnFilterControl, getColumnLabel, getColumnRegion, getColumnType, getDefaultOperator, getDisplayedRows, getEditFieldName, getGridCapabilities, getGroupDataRows, getOperatorsForType, getSelectableRowIds, getStepTargetColumn, getTMDataGridPaginationApi, isColumnEditableForRow, isColumnReorderable, isControlColumn, isFilterActive, isGeneratedColumn, isPagingActive, isSameCell, isWithinBounds, keepGeneratedColumnsOutermost, measureColumnContentWidth, mergeLabels, moveColumn, moveColumnByStep, normalizeFieldValidate, openColumnFilter, operatorNeedsValue, operatorTakesArrayValue, operatorTakesRangeValue, optionsToComboboxData, readFeatureFlags, resolveCellMove, resolveColumnOptions, resolveExpandAll, resolveRangeBounds, resolveRowSelectionClick, tmDataGridFeatures, toClipboardText, toExcelCsv, useCellControlTabIndex, useTMDataGrid, useTMDataGridContext, writeClipboardText };
|