@opencorestack/opengridx 2.0.4 → 3.0.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +408 -3
- package/README.md +93 -72
- package/dist/index.d.ts +611 -121
- package/dist/opengridx.css +1 -1
- package/dist/opengridx.es.js +7992 -5650
- package/dist/opengridx.es.js.map +1 -1
- package/dist/opengridx.umd.js +17 -23
- package/dist/opengridx.umd.js.map +1 -1
- package/docs/API_REFERENCE.md +348 -161
- package/docs/README.md +6 -1
- package/docs/architecture/datagrid-orchestration.md +81 -0
- package/docs/architecture/grid-row-meta.md +102 -0
- package/docs/architecture/use-grid-columns.md +128 -0
- package/docs/architecture/use-grid-controlled-state.md +157 -0
- package/docs/architecture/use-grid-row-pipeline.md +120 -0
- package/docs/architecture/use-grid-scroll-sync.md +111 -0
- package/docs/architecture/use-grid-state-snapshot.md +90 -0
- package/docs/architecture/use-grid-virtualization.md +115 -0
- package/docs/architecture/use-grid-visible-rows.md +85 -0
- package/docs/assets/banner-alt.png +0 -0
- package/docs/assets/banner.png +0 -0
- package/docs/assets/hero.png +0 -0
- package/docs/assets/logo.png +0 -0
- package/docs/components/aggregation-footer.md +15 -10
- package/docs/components/cell.md +16 -6
- package/docs/components/column-group-header.md +55 -28
- package/docs/components/column-resize.md +17 -13
- package/docs/components/column-visibility.md +45 -22
- package/docs/components/datagrid.md +14 -12
- package/docs/components/empty-state.md +2 -1
- package/docs/components/error-overlay.md +12 -7
- package/docs/components/filter-panel.md +28 -8
- package/docs/components/header.md +28 -9
- package/docs/components/pagination.md +14 -8
- package/docs/components/row.md +21 -5
- package/docs/components/toolbar.md +27 -9
- package/docs/components/tooltip.md +16 -7
- package/docs/customization/slots-api.md +100 -36
- package/docs/customization/theming.md +66 -18
- package/docs/features/aggregation-pivot.md +75 -9
- package/docs/features/cell-spanning.md +80 -125
- package/docs/features/clipboard.md +41 -16
- package/docs/features/custom-pagination.md +38 -18
- package/docs/features/data-source.md +36 -13
- package/docs/features/editing-reordering.md +125 -16
- package/docs/features/export-guide.md +147 -41
- package/docs/features/filtering.md +44 -6
- package/docs/features/infinite-scroll.md +54 -46
- package/docs/features/keyboard-navigation.md +83 -0
- package/docs/features/list-view.md +58 -5
- package/docs/features/loading-states.md +18 -20
- package/docs/features/master-detail.md +18 -5
- package/docs/features/pdf-export.md +56 -19
- package/docs/features/pinning.md +23 -5
- package/docs/features/selection.md +50 -10
- package/docs/features/sorting-pagination.md +66 -14
- package/docs/features/state-persistence.md +78 -10
- package/docs/features/toolbar-customization.md +26 -17
- package/docs/features/tree-data-grouping.md +44 -9
- package/docs/features/virtualization.md +64 -15
- package/docs/migration/v1-to-v2.md +115 -0
- package/docs/migration/v2-to-v3.md +1222 -0
- package/docs/performance.md +124 -0
- package/docs/roadmap.md +16 -10
- package/lib/components/Cell/Cell.css +13 -1
- package/lib/components/Cell/Cell.tsx +130 -57
- package/lib/components/Cell/CellErrorBoundary.tsx +12 -6
- package/lib/components/Cell/GridEditInputCell.tsx +114 -41
- package/lib/components/ColumnGroupHeader/ColumnGroupHeader.css +7 -1
- package/lib/components/ColumnResizeHandle/ColumnResizeHandle.css +11 -0
- package/lib/components/ColumnResizeHandle/ColumnResizeHandle.tsx +104 -38
- package/lib/components/ColumnResizeHandle/clampResizeWidth.ts +13 -0
- package/lib/components/ColumnVisibilityPanel/ColumnVisibilityPanel.css +6 -0
- package/lib/components/ColumnVisibilityPanel/ColumnVisibilityPanel.tsx +21 -13
- package/lib/components/DataGrid/DataGrid.css +84 -12
- package/lib/components/DataGrid/DataGrid.tsx +606 -872
- package/lib/components/DataGrid/GridAggregationFooter.tsx +53 -17
- package/lib/components/DataGrid/GridEmptyState.tsx +7 -1
- package/lib/components/DataGrid/GridErrorOverlay.tsx +15 -12
- package/lib/components/DataGrid/GridListView.tsx +166 -23
- package/lib/components/DataGrid/GridLiveRegion.tsx +31 -0
- package/lib/components/DataGrid/GridLoadingOverlay.tsx +27 -0
- package/lib/components/DataGrid/GridPaginationArea.tsx +44 -0
- package/lib/components/DataGrid/GridPinnedRows.tsx +65 -11
- package/lib/components/DataGrid/GridStandaloneColumnPanel.tsx +40 -38
- package/lib/components/DataGrid/GridToolbarSlot.tsx +51 -0
- package/lib/components/DataGrid/GridVirtualRows.tsx +48 -25
- package/lib/components/DetailPanel/DetailPanel.css +0 -6
- package/lib/components/DetailPanel/DetailPanel.tsx +34 -5
- package/lib/components/DetailPanel/DetailPanelContent.tsx +17 -0
- package/lib/components/FilterPanel/FilterPanel.css +13 -2
- package/lib/components/FilterPanel/FilterPanel.tsx +272 -99
- package/lib/components/Header/ColumnMenu.tsx +91 -39
- package/lib/components/Header/Header.css +3 -3
- package/lib/components/Header/Header.tsx +179 -160
- package/lib/components/ListView/ListView.css +25 -0
- package/lib/components/ListView/ListViewRow.tsx +79 -10
- package/lib/components/Pagination/Pagination.tsx +15 -7
- package/lib/components/Row/Row.tsx +185 -75
- package/lib/components/Toolbar/GlobalSearch.css +6 -3
- package/lib/components/Toolbar/GlobalSearch.tsx +26 -27
- package/lib/components/Toolbar/GridToolbar.css +12 -11
- package/lib/components/Toolbar/GridToolbar.tsx +133 -89
- package/lib/components/Toolbar/PivotPanel.tsx +89 -49
- package/lib/components/Tooltip/Tooltip.css +20 -0
- package/lib/components/Tooltip/Tooltip.tsx +68 -35
- package/lib/components/ui/Button.tsx +3 -0
- package/lib/components/ui/Checkbox.tsx +2 -1
- package/lib/components/ui/ExpandIcon.css +0 -9
- package/lib/components/ui/ExpandIcon.tsx +4 -1
- package/lib/hooks/core/gridApiPlaceholder.ts +34 -0
- package/lib/hooks/core/gridToolbarHostContext.ts +14 -0
- package/lib/hooks/core/useDataGrid.ts +115 -173
- package/lib/hooks/core/useGridAggregationApi.ts +72 -0
- package/lib/hooks/core/useGridApiMethods.ts +115 -0
- package/lib/hooks/core/useGridApiRef.ts +15 -3
- package/lib/hooks/core/useGridApiRefBinding.ts +18 -0
- package/lib/hooks/core/useGridAriaRows.ts +38 -0
- package/lib/hooks/core/useGridClipboardApi.ts +38 -0
- package/lib/hooks/core/useGridColumnLookup.ts +30 -0
- package/lib/hooks/core/useGridColumns.tsx +284 -76
- package/lib/hooks/core/useGridColumnsPanel.ts +77 -0
- package/lib/hooks/core/useGridControlledState.ts +99 -6
- package/lib/hooks/core/useGridDetailPanel.ts +51 -0
- package/lib/hooks/core/useGridDevWarnings.ts +123 -0
- package/lib/hooks/core/useGridFocusHandlers.ts +50 -0
- package/lib/hooks/core/useGridGroupingColumn.ts +62 -0
- package/lib/hooks/core/useGridHeaderHandlers.ts +92 -0
- package/lib/hooks/core/useGridHierarchy.ts +81 -0
- package/lib/hooks/core/useGridKeyboardNavigation.ts +452 -250
- package/lib/hooks/core/useGridLiveRowSelection.ts +67 -0
- package/lib/hooks/core/useGridPageCorrection.ts +55 -0
- package/lib/hooks/core/useGridRowIdOf.ts +32 -0
- package/lib/hooks/core/useGridRowInteractions.ts +81 -0
- package/lib/hooks/core/useGridRowPipeline.ts +69 -39
- package/lib/hooks/core/useGridRowSelection.ts +91 -0
- package/lib/hooks/core/useGridScrollSync.ts +80 -32
- package/lib/hooks/core/useGridScrollToIndexesApi.ts +45 -0
- package/lib/hooks/core/useGridStateSnapshot.ts +40 -5
- package/lib/hooks/core/useGridThemeDimensions.ts +49 -0
- package/lib/hooks/core/useGridToolbarProps.ts +97 -0
- package/lib/hooks/core/useGridViewport.ts +38 -0
- package/lib/hooks/core/useGridViewportSize.ts +26 -0
- package/lib/hooks/core/useGridVisibleRows.ts +20 -7
- package/lib/hooks/core/useLayout.ts +215 -195
- package/lib/hooks/core/useRowsScrollEndLatch.ts +41 -0
- package/lib/hooks/core/useStableColumns.ts +34 -0
- package/lib/hooks/features/useAggregation.ts +86 -90
- package/lib/hooks/features/useColumnGroupReorderGuard.ts +34 -0
- package/lib/hooks/features/useDetailPanelHeights.ts +29 -0
- package/lib/hooks/features/useGridClipboard.ts +133 -73
- package/lib/hooks/features/useGridDataSource.ts +354 -128
- package/lib/hooks/features/useGridEditing.ts +211 -51
- package/lib/hooks/features/useGridPivot.ts +92 -0
- package/lib/hooks/features/useGridSpanRenderWindow.ts +104 -0
- package/lib/hooks/features/useGridSpanning.ts +410 -306
- package/lib/hooks/features/usePivot.ts +0 -0
- package/lib/hooks/features/useServerTreeChildren.ts +50 -0
- package/lib/hooks/useColumnReorder.ts +38 -44
- package/lib/hooks/useRowGrouping.ts +335 -214
- package/lib/hooks/useRowReorder.ts +62 -31
- package/lib/hooks/useTreeData.ts +330 -262
- package/lib/index.ts +30 -2
- package/lib/state/index.ts +1 -0
- package/lib/state/types.ts +7 -1
- package/lib/state/useGridStateStorage.ts +88 -29
- package/lib/theme/DataGridThemeProvider.tsx +143 -38
- package/lib/theme/gridThemeContext.ts +5 -0
- package/lib/theme/index.ts +5 -0
- package/lib/theme/presets.ts +5 -4
- package/lib/theme/types.ts +40 -2
- package/lib/types/index.ts +311 -108
- package/lib/utils/aggregation/index.ts +157 -0
- package/lib/utils/aria/index.ts +40 -0
- package/lib/utils/columnGroups.ts +110 -0
- package/lib/utils/columnLookup.ts +33 -0
- package/lib/utils/columnWidth.ts +22 -0
- package/lib/utils/dataSource/index.ts +46 -0
- package/lib/utils/detailPanel.ts +66 -0
- package/lib/utils/dragData.ts +44 -0
- package/lib/utils/editing/index.ts +30 -0
- package/lib/utils/export/exportShared.ts +197 -0
- package/lib/utils/export/exportToExcelAdvanced.ts +344 -121
- package/lib/utils/export/exportToPdf.ts +143 -92
- package/lib/utils/export/groupLabel.ts +14 -0
- package/lib/utils/export/index.ts +278 -272
- package/lib/utils/export/pdfText.ts +50 -0
- package/lib/utils/filtering/index.ts +277 -148
- package/lib/utils/focus/index.ts +115 -0
- package/lib/utils/gridApiRows.ts +35 -0
- package/lib/utils/gridModes.ts +77 -0
- package/lib/utils/grouping/groupedExportRows.ts +91 -0
- package/lib/utils/pagination/index.ts +56 -0
- package/lib/utils/pinning/index.ts +77 -33
- package/lib/utils/pivot/index.ts +368 -0
- package/lib/utils/scroll/index.ts +78 -0
- package/lib/utils/scroll/scrollEnd.ts +18 -0
- package/lib/utils/sorting/index.ts +154 -30
- package/lib/utils/syntheticRows.ts +12 -0
- package/lib/utils/values.ts +206 -0
- package/lib/utils/viewport.ts +14 -0
- package/llms.txt +272 -166
- package/package.json +18 -6
- package/lib/components/ColumnGroupHeader/ColumnGroupHeader.tsx +0 -220
- package/lib/components/ColumnVisibilityPanel/ColumnVisibilityPanel.test.tsx +0 -85
- package/lib/components/DataGrid/DataGrid.regression.test.tsx +0 -132
- package/lib/components/DataGrid/DataGrid.smoke.test.tsx +0 -58
- package/lib/components/DataGrid/DataGrid.v2.test.tsx +0 -127
- package/lib/components/Header/Header.test.tsx +0 -135
- package/lib/components/Pagination/Pagination.test.tsx +0 -64
- package/lib/hooks/core/useDataGrid.regression.test.ts +0 -66
- package/lib/hooks/core/useGridControlledState.test.ts +0 -86
- package/lib/hooks/core/useGridKeyboardNavigation.test.ts +0 -176
- package/lib/hooks/core/useGridRowPipeline.test.ts +0 -117
- package/lib/hooks/features/useAggregation.test.ts +0 -175
- package/lib/hooks/features/usePivot.test.ts +0 -202
- package/lib/hooks/useRowGrouping.test.ts +0 -137
- package/lib/utils/export/exportToPdf.test.ts +0 -120
- package/lib/utils/export/groupedExport.test.ts +0 -144
- package/lib/utils/filtering/filtering.test.ts +0 -178
- package/lib/utils/sorting/sorting.test.ts +0 -88
package/lib/types/index.ts
CHANGED
|
@@ -1,4 +1,5 @@
|
|
|
1
|
-
|
|
1
|
+
import type { GridToolbarProps } from '../components/Toolbar/GridToolbar';
|
|
2
|
+
import type { PaginationProps } from '../components/Pagination/Pagination';
|
|
2
3
|
|
|
3
4
|
/** Unique identifier for a row (string or number). */
|
|
4
5
|
export type GridRowId = string | number;
|
|
@@ -16,23 +17,55 @@ export interface GridRowModel {
|
|
|
16
17
|
}
|
|
17
18
|
|
|
18
19
|
/**
|
|
19
|
-
*
|
|
20
|
+
* The constraint on the row type `R` of the generic grid types (`DataGridProps<R>`, `GridColDef<R>`,
|
|
21
|
+
* `GridRenderCellParams<R>` …): any object type. Your own interfaces and type aliases can be used as `R`
|
|
22
|
+
* directly; they do not need an index signature or to extend `GridRowModel`. Rows without an `id`
|
|
23
|
+
* field need `getRowId`. `GridRowModel` stays the default `R` (rows with any keys, read as `unknown`).
|
|
24
|
+
* @since v3.0
|
|
25
|
+
*/
|
|
26
|
+
export type GridValidRowModel = object;
|
|
27
|
+
|
|
28
|
+
/**
|
|
29
|
+
* A callback that is checked bivariantly in its parameter, like a method. Used for `GridColDef`
|
|
30
|
+
* options that are either a value or a function, so a column typed for your rows (`GridColDef<Row>`)
|
|
31
|
+
* can still be used where an untyped `GridColDef` is expected.
|
|
32
|
+
*/
|
|
33
|
+
type GridColDefCallback<P, T> = { bivarianceHack(params: P): T }['bivarianceHack'];
|
|
34
|
+
|
|
35
|
+
/**
|
|
36
|
+
* Hierarchy metadata for a row. Exposed via `params.rowMeta` in `renderCell`.
|
|
20
37
|
* Not present (`undefined`) for flat rows with no active tree-data or row-grouping.
|
|
21
38
|
*
|
|
22
39
|
* @since v1.1 — replaces the `_hasChildren` / `_treeDepth` / `_groupingField` etc.
|
|
23
|
-
*
|
|
24
|
-
*
|
|
25
|
-
* backward compatibility; they will be removed from the runtime in v2.0.
|
|
40
|
+
* fields that were injected onto row objects. Since v3.0 those fields are no longer
|
|
41
|
+
* added at runtime: row objects reach `renderCell` exactly as you passed them.
|
|
26
42
|
*/
|
|
27
43
|
export interface GridRowMeta {
|
|
44
|
+
/** The row has children to show: the expand toggle is rendered for it. */
|
|
28
45
|
hasChildren?: boolean;
|
|
29
46
|
treeDepth?: number;
|
|
30
47
|
groupingField?: string;
|
|
31
48
|
groupingValue?: unknown;
|
|
49
|
+
/** The label the grid shows for a synthetic row: the group label, or the path segment of an auto-created tree parent. */
|
|
32
50
|
groupLabel?: string;
|
|
51
|
+
/**
|
|
52
|
+
* Data rows below this row at any depth that pass the active filter (row-grouping leaves, or
|
|
53
|
+
* tree-data rows; auto-created tree parents are not counted). The "(n)" shown next to group labels.
|
|
54
|
+
*/
|
|
33
55
|
descendantCount?: number;
|
|
34
56
|
isExpanded?: boolean;
|
|
57
|
+
/**
|
|
58
|
+
* The row is synthetic: a row-grouping group row, a group subtotal row, or a tree-data parent the
|
|
59
|
+
* grid created for a path segment with no row of its own. Synthetic rows are never selected,
|
|
60
|
+
* edited or given a detail panel, and `valueGetter` is not called for them.
|
|
61
|
+
*/
|
|
35
62
|
isGroupRow?: boolean;
|
|
63
|
+
/**
|
|
64
|
+
* The row is the subtotal row of the group described by `groupingField` / `groupingValue`, shown
|
|
65
|
+
* after the group's children when `getAggregationPosition` returns `'footer'` for it.
|
|
66
|
+
* @since v3.0
|
|
67
|
+
*/
|
|
68
|
+
isGroupFooter?: boolean;
|
|
36
69
|
}
|
|
37
70
|
|
|
38
71
|
export type GridAlignment = 'left' | 'center' | 'right';
|
|
@@ -64,7 +97,7 @@ export interface GridTreeNode {
|
|
|
64
97
|
/** Display label for the group. */
|
|
65
98
|
label?: string;
|
|
66
99
|
|
|
67
|
-
/**
|
|
100
|
+
/** Row grouping: the number of leaf rows in the group that pass the active filter (recursive). */
|
|
68
101
|
descendantCount?: number;
|
|
69
102
|
|
|
70
103
|
/** Count of children on the server (for lazy loading). */
|
|
@@ -77,7 +110,7 @@ export type GridSortDirection = 'asc' | 'desc' | null;
|
|
|
77
110
|
* Metadata for a single column.
|
|
78
111
|
* Governs rendering, sorting, filtering, and data transformation.
|
|
79
112
|
*/
|
|
80
|
-
export interface GridColDef<R extends
|
|
113
|
+
export interface GridColDef<R extends GridValidRowModel = GridRowModel> {
|
|
81
114
|
/** The unique identifier for the column, typically matching a row object key. */
|
|
82
115
|
field: string;
|
|
83
116
|
/** Text displayed in the column header. */
|
|
@@ -128,16 +161,25 @@ export interface GridColDef<R extends GridRowModel = GridRowModel> {
|
|
|
128
161
|
/** Options used for 'singleSelect' type. */
|
|
129
162
|
valueOptions?: Array<string | number | { value: unknown; label: string }>;
|
|
130
163
|
|
|
164
|
+
// The row callbacks below are declared as methods so that `GridColDef<Row>` stays assignable to an
|
|
165
|
+
// untyped `GridColDef` (method parameters are checked bivariantly).
|
|
131
166
|
/** Function to compute a cell value from raw row data. */
|
|
132
|
-
valueGetter
|
|
167
|
+
valueGetter?(params: GridValueGetterParams<R>): unknown;
|
|
168
|
+
/**
|
|
169
|
+
* Maps an edited value back onto the row when an edit is committed; return the updated row.
|
|
170
|
+
* Needed for editable columns with a `valueGetter`, whose value is not stored in `row[field]`.
|
|
171
|
+
* Without it the commit writes `row[field] = value`.
|
|
172
|
+
* @since v3.0
|
|
173
|
+
*/
|
|
174
|
+
valueSetter?(params: GridValueSetterParams<R>): R;
|
|
133
175
|
/** Function to format a value into a human-readable string. */
|
|
134
|
-
valueFormatter
|
|
176
|
+
valueFormatter?(params: GridValueFormatterParams<R>): string;
|
|
135
177
|
/** Custom component or element to render in the cell. */
|
|
136
|
-
renderCell
|
|
178
|
+
renderCell?(params: GridRenderCellParams<R>): React.ReactNode;
|
|
137
179
|
/** Custom component or element to render in the header. */
|
|
138
|
-
renderHeader
|
|
139
|
-
/** Component to render when the cell is in edit mode. */
|
|
140
|
-
renderEditCell
|
|
180
|
+
renderHeader?(params: GridRenderHeaderParams): React.ReactNode;
|
|
181
|
+
/** Component to render when the cell is in edit mode. Receives `onValueChange`, `onCommit` and `onCancel`. */
|
|
182
|
+
renderEditCell?(params: GridRenderEditCellParams<R>): React.ReactNode;
|
|
141
183
|
/** If true, the cell's value can be modified by the user. */
|
|
142
184
|
editable?: boolean;
|
|
143
185
|
/** Optional stacking order (CSS z-index). */
|
|
@@ -145,10 +187,19 @@ export interface GridColDef<R extends GridRowModel = GridRowModel> {
|
|
|
145
187
|
/** If true, the column kebab/hamburger menu is disabled. */
|
|
146
188
|
disableColumnMenu?: boolean;
|
|
147
189
|
|
|
148
|
-
/**
|
|
149
|
-
|
|
150
|
-
|
|
151
|
-
|
|
190
|
+
/**
|
|
191
|
+
* Number of columns this cell should occupy horizontally: the origin plus the next visible columns
|
|
192
|
+
* in render order, clamped to the end of the origin's pinned section. Fractions are floored,
|
|
193
|
+
* `Infinity` means "to the end", and NaN / values below 1 mean no span. `params.value` is the
|
|
194
|
+
* `valueGetter` result. A function that throws is treated as 1.
|
|
195
|
+
*/
|
|
196
|
+
colSpan?: number | GridColDefCallback<GridRenderCellParams<R>, number>;
|
|
197
|
+
/**
|
|
198
|
+
* Number of rows this cell should occupy vertically, clamped to the end of its row section
|
|
199
|
+
* (top-pinned, scrolling or bottom-pinned rows) and to the first row with an expanded detail
|
|
200
|
+
* panel. Normalised like `colSpan`. With both set, the origin covers the whole rectangle.
|
|
201
|
+
*/
|
|
202
|
+
rowSpan?: number | GridColDefCallback<GridRenderCellParams<R>, number>;
|
|
152
203
|
|
|
153
204
|
/**
|
|
154
205
|
* Custom CSS class applied to every cell in this column.
|
|
@@ -158,7 +209,7 @@ export interface GridColDef<R extends GridRowModel = GridRowModel> {
|
|
|
158
209
|
* cellClassName: 'my-class'
|
|
159
210
|
* cellClassName: ({ value }) => value > 100 ? 'cell--high' : 'cell--low'
|
|
160
211
|
*/
|
|
161
|
-
cellClassName?: string |
|
|
212
|
+
cellClassName?: string | GridColDefCallback<GridRenderCellParams<R>, string>;
|
|
162
213
|
|
|
163
214
|
/**
|
|
164
215
|
* Custom CSS class applied to the header cell of this column.
|
|
@@ -176,9 +227,9 @@ export interface GridColDef<R extends GridRowModel = GridRowModel> {
|
|
|
176
227
|
}
|
|
177
228
|
|
|
178
229
|
/** Column definition used exclusively in List View mode. */
|
|
179
|
-
export interface GridListViewColDef<R extends
|
|
230
|
+
export interface GridListViewColDef<R extends GridValidRowModel = GridRowModel> {
|
|
180
231
|
field: string;
|
|
181
|
-
renderCell
|
|
232
|
+
renderCell(params: GridRenderCellParams<R>): React.ReactNode;
|
|
182
233
|
}
|
|
183
234
|
|
|
184
235
|
/**
|
|
@@ -199,7 +250,7 @@ export interface GridColumnGroup {
|
|
|
199
250
|
groupId: string;
|
|
200
251
|
/** Text displayed in the group header cell. */
|
|
201
252
|
headerName: string;
|
|
202
|
-
/**
|
|
253
|
+
/** CSS class(es) added to this group's header cell(s). */
|
|
203
254
|
headerClassName?: string;
|
|
204
255
|
/**
|
|
205
256
|
* Either an array of column field strings (leaf group)
|
|
@@ -212,7 +263,7 @@ export type GridColumnGroupingModel = GridColumnGroup[];
|
|
|
212
263
|
|
|
213
264
|
|
|
214
265
|
/** Parameters passed to the `valueGetter` function. */
|
|
215
|
-
export interface GridValueGetterParams<R extends
|
|
266
|
+
export interface GridValueGetterParams<R extends GridValidRowModel = GridRowModel> {
|
|
216
267
|
/** The row object. */
|
|
217
268
|
row: R;
|
|
218
269
|
/** The field name. */
|
|
@@ -221,8 +272,21 @@ export interface GridValueGetterParams<R extends GridRowModel = GridRowModel> {
|
|
|
221
272
|
value: unknown;
|
|
222
273
|
}
|
|
223
274
|
|
|
275
|
+
/**
|
|
276
|
+
* Parameters passed to the `valueSetter` function.
|
|
277
|
+
* @since v3.0
|
|
278
|
+
*/
|
|
279
|
+
export interface GridValueSetterParams<R extends GridValidRowModel = GridRowModel> {
|
|
280
|
+
/** The committed value from the editor. */
|
|
281
|
+
value: unknown;
|
|
282
|
+
/** The row as it was before the edit. */
|
|
283
|
+
row: R;
|
|
284
|
+
/** The field name. */
|
|
285
|
+
field: string;
|
|
286
|
+
}
|
|
287
|
+
|
|
224
288
|
/** Parameters passed to the `valueFormatter` function. */
|
|
225
|
-
export interface GridValueFormatterParams<R extends
|
|
289
|
+
export interface GridValueFormatterParams<R extends GridValidRowModel = GridRowModel> {
|
|
226
290
|
/** The raw value to format. */
|
|
227
291
|
value: unknown;
|
|
228
292
|
/** The row object. */
|
|
@@ -232,9 +296,14 @@ export interface GridValueFormatterParams<R extends GridRowModel = GridRowModel>
|
|
|
232
296
|
}
|
|
233
297
|
|
|
234
298
|
/** Parameters passed to the `renderCell` function. */
|
|
235
|
-
export interface GridRenderCellParams<R extends
|
|
299
|
+
export interface GridRenderCellParams<R extends GridValidRowModel = GridRowModel> {
|
|
236
300
|
/** The current cell value. */
|
|
237
301
|
value: unknown;
|
|
302
|
+
/**
|
|
303
|
+
* The value after `colDef.valueFormatter` (or `String(value)` when no formatter is set; `''` for null/undefined).
|
|
304
|
+
* @since v2.1
|
|
305
|
+
*/
|
|
306
|
+
formattedValue?: string;
|
|
238
307
|
/** The row object. */
|
|
239
308
|
row: R;
|
|
240
309
|
/** The field name and unique ID. */
|
|
@@ -252,6 +321,19 @@ export interface GridRenderCellParams<R extends GridRowModel = GridRowModel> {
|
|
|
252
321
|
rowMeta?: GridRowMeta;
|
|
253
322
|
}
|
|
254
323
|
|
|
324
|
+
/**
|
|
325
|
+
* Parameters passed to `renderEditCell`. `value` is the pending (uncommitted) value.
|
|
326
|
+
* @since v3.0
|
|
327
|
+
*/
|
|
328
|
+
export interface GridRenderEditCellParams<R extends GridValidRowModel = GridRowModel> extends GridRenderCellParams<R> {
|
|
329
|
+
/** Updates the pending value. Call it on every change; nothing is saved until `onCommit`. */
|
|
330
|
+
onValueChange: (value: unknown) => void;
|
|
331
|
+
/** Commits the pending value (runs `processRowUpdate`) and leaves edit mode. */
|
|
332
|
+
onCommit: () => void;
|
|
333
|
+
/** Discards the pending value and leaves edit mode. */
|
|
334
|
+
onCancel: () => void;
|
|
335
|
+
}
|
|
336
|
+
|
|
255
337
|
export interface GridRenderHeaderParams {
|
|
256
338
|
field: string;
|
|
257
339
|
colDef: GridColDef;
|
|
@@ -276,13 +358,18 @@ export type GridFilterOperator =
|
|
|
276
358
|
| 'isEmpty'
|
|
277
359
|
| 'isNotEmpty'
|
|
278
360
|
| 'isAnyOf'
|
|
361
|
+
| '='
|
|
279
362
|
| '>'
|
|
280
363
|
| '>='
|
|
281
364
|
| '<'
|
|
282
365
|
| '<='
|
|
283
366
|
| '!='
|
|
284
367
|
| 'is'
|
|
285
|
-
| 'not'
|
|
368
|
+
| 'not'
|
|
369
|
+
| 'after'
|
|
370
|
+
| 'onOrAfter'
|
|
371
|
+
| 'before'
|
|
372
|
+
| 'onOrBefore';
|
|
286
373
|
|
|
287
374
|
/** Describes a filter condition for a specific column. */
|
|
288
375
|
export interface GridFilterItem {
|
|
@@ -320,7 +407,7 @@ export interface GridFilterModel {
|
|
|
320
407
|
* Configuration options for exporting the DataGrid to PDF format.
|
|
321
408
|
* Requires jspdf and jspdf-autotable peer dependencies.
|
|
322
409
|
*/
|
|
323
|
-
export interface PdfExportOptions {
|
|
410
|
+
export interface PdfExportOptions<R extends GridValidRowModel = GridRowModel> {
|
|
324
411
|
/**
|
|
325
412
|
* Output filename without extension. Default: 'export'
|
|
326
413
|
*/
|
|
@@ -344,10 +431,18 @@ export interface PdfExportOptions {
|
|
|
344
431
|
orientation?: 'portrait' | 'landscape';
|
|
345
432
|
|
|
346
433
|
/**
|
|
347
|
-
* If provided, only rows whose id is in this array are exported.
|
|
434
|
+
* If provided, only rows whose id is in this array are exported. A non-empty selection takes
|
|
435
|
+
* precedence over `groupedRows` (the selected rows are exported flat), and the footer totals
|
|
436
|
+
* are recomputed over the selected rows.
|
|
348
437
|
*/
|
|
349
438
|
selectedRows?: (string | number)[];
|
|
350
439
|
|
|
440
|
+
/**
|
|
441
|
+
* The grid's `getRowId`, when it has one: `selectedRows` holds those ids, and the grid does not
|
|
442
|
+
* copy them onto `row.id` (v3.0+). Defaults to `row.id`.
|
|
443
|
+
*/
|
|
444
|
+
getRowId?: (row: R) => GridRowId;
|
|
445
|
+
|
|
351
446
|
/**
|
|
352
447
|
* Aggregation result from apiRef.current.getAggregationResult().
|
|
353
448
|
* When provided alongside aggregationModel, appends a footer row.
|
|
@@ -384,11 +479,30 @@ export interface PdfExportOptions {
|
|
|
384
479
|
*/
|
|
385
480
|
fontSize?: number;
|
|
386
481
|
|
|
482
|
+
/**
|
|
483
|
+
* A TrueType font for the whole document. The built-in Helvetica font only covers Latin-1 and
|
|
484
|
+
* WinAnsi punctuation (é, ü, €, “ ”, •). Without this option other characters (₹, Greek,
|
|
485
|
+
* Cyrillic, CJK, Devanagari, U+202F used by some locales as a thousands separator) are
|
|
486
|
+
* replaced with `?` (spaces and minus signs with their ASCII forms) and a warning is logged.
|
|
487
|
+
* `data` is the `.ttf` file as a base64 string; `boldData` is an optional bold face for the
|
|
488
|
+
* title, header and totals (the regular face is used when omitted). jsPDF does not shape
|
|
489
|
+
* complex scripts, so Devanagari or Arabic ligatures may not join.
|
|
490
|
+
* @since v3.0
|
|
491
|
+
*/
|
|
492
|
+
font?: {
|
|
493
|
+
/** Font family name, e.g. 'NotoSans'. */
|
|
494
|
+
name: string;
|
|
495
|
+
/** Base64-encoded .ttf file. */
|
|
496
|
+
data: string;
|
|
497
|
+
/** Base64-encoded bold .ttf file. Default: `data`. */
|
|
498
|
+
boldData?: string;
|
|
499
|
+
};
|
|
500
|
+
|
|
387
501
|
/**
|
|
388
502
|
* Pre-built grouped export rows from `apiRef.current.getGroupedExportRows()`.
|
|
389
503
|
* When provided, the PDF table reflects the grouping structure (group headers,
|
|
390
504
|
* leaf rows, per-group subtotals, grand total) instead of a flat row list.
|
|
391
|
-
* Has no effect when the grid has no active `rowGroupingModel
|
|
505
|
+
* Has no effect when the grid has no active `rowGroupingModel`, or when `selectedRows` is non-empty.
|
|
392
506
|
*/
|
|
393
507
|
groupedRows?: GridGroupedExportRow[];
|
|
394
508
|
}
|
|
@@ -406,6 +520,13 @@ export interface GridGroupedExportRow {
|
|
|
406
520
|
groupField?: string;
|
|
407
521
|
/** The raw grouping value for this level (absent on 'leaf' and 'grand-total'). */
|
|
408
522
|
groupValue?: unknown;
|
|
523
|
+
/**
|
|
524
|
+
* The group label exactly as the grid shows it (from `groupingValueFormatter`, else `"field: value"`),
|
|
525
|
+
* on 'group-header' and 'group-subtotal' entries from `getGroupedExportRows()`. Exporters use it for
|
|
526
|
+
* group-header rows; when absent they apply the column's `groupingValueFormatter` themselves.
|
|
527
|
+
* @since v3.0
|
|
528
|
+
*/
|
|
529
|
+
groupLabel?: string;
|
|
409
530
|
/** Per-group aggregation results (present on 'group-subtotal' and 'grand-total'). */
|
|
410
531
|
aggregatedValues?: Record<string, unknown>;
|
|
411
532
|
/** The original data row (only present when `type === 'leaf'`). */
|
|
@@ -440,7 +561,7 @@ export interface GridColumnOrderChangeParams {
|
|
|
440
561
|
|
|
441
562
|
export type GridColumnOrder = string[];
|
|
442
563
|
|
|
443
|
-
export interface GridRowOrderChangeParams<R extends
|
|
564
|
+
export interface GridRowOrderChangeParams<R extends GridValidRowModel = GridRowModel> {
|
|
444
565
|
row: R;
|
|
445
566
|
oldIndex: number;
|
|
446
567
|
targetIndex: number;
|
|
@@ -455,7 +576,7 @@ export interface GridGetRowsParams {
|
|
|
455
576
|
aggregationModel?: GridAggregationModel;
|
|
456
577
|
}
|
|
457
578
|
|
|
458
|
-
export interface GridGetRowsResponse<R extends
|
|
579
|
+
export interface GridGetRowsResponse<R extends GridValidRowModel = GridRowModel> {
|
|
459
580
|
rows: R[];
|
|
460
581
|
rowCount?: number;
|
|
461
582
|
aggregationResults?: Record<string, unknown>;
|
|
@@ -465,7 +586,7 @@ export interface GridGetRowsResponse<R extends GridRowModel = GridRowModel> {
|
|
|
465
586
|
* Interface for providing data to the grid from a remote source.
|
|
466
587
|
* Enables server-side sorting, filtering, and pagination.
|
|
467
588
|
*/
|
|
468
|
-
export interface GridDataSource<R extends
|
|
589
|
+
export interface GridDataSource<R extends GridValidRowModel = GridRowModel> {
|
|
469
590
|
/**
|
|
470
591
|
* Fetches a chunk of rows based on current grid state.
|
|
471
592
|
* @param params Sorting, filtering, and range parameters.
|
|
@@ -489,26 +610,24 @@ export interface GridPinnedColumns {
|
|
|
489
610
|
right?: string[];
|
|
490
611
|
}
|
|
491
612
|
|
|
492
|
-
export interface GridPinnedRows<R extends
|
|
613
|
+
export interface GridPinnedRows<R extends GridValidRowModel = GridRowModel> {
|
|
493
614
|
top?: R[];
|
|
494
615
|
bottom?: R[];
|
|
495
616
|
}
|
|
496
617
|
|
|
497
|
-
export interface GridVirtualizationState {
|
|
498
|
-
renderContext: GridRenderContext;
|
|
499
|
-
}
|
|
500
|
-
|
|
501
618
|
export type GridRowGroupingModel = string[];
|
|
502
619
|
|
|
503
|
-
export type GridAggregationFunction = (values: unknown[]) => unknown;
|
|
504
|
-
|
|
505
620
|
export interface GridAggregationModel {
|
|
506
621
|
[field: string]: string;
|
|
507
622
|
}
|
|
508
623
|
|
|
509
624
|
export type GridAggregationResult = Record<string, unknown>;
|
|
510
625
|
|
|
511
|
-
|
|
626
|
+
/**
|
|
627
|
+
* Where a group's aggregates are shown, as returned by `getAggregationPosition`: `'inline'` on the group row,
|
|
628
|
+
* `'footer'` on a subtotal row after the group's children, `null` hidden.
|
|
629
|
+
*/
|
|
630
|
+
export type GridAggregationPosition = 'inline' | 'footer' | null;
|
|
512
631
|
|
|
513
632
|
export type GridPivotAggFn = 'sum' | 'avg' | 'count' | 'min' | 'max';
|
|
514
633
|
|
|
@@ -524,27 +643,16 @@ export interface GridPivotModel {
|
|
|
524
643
|
valueFields: GridPivotValueField[];
|
|
525
644
|
}
|
|
526
645
|
|
|
527
|
-
export interface GridRenderContext {
|
|
528
|
-
firstRowIndex: number;
|
|
529
|
-
lastRowIndex: number;
|
|
530
|
-
firstColumnIndex: number;
|
|
531
|
-
lastColumnIndex: number;
|
|
532
|
-
}
|
|
533
|
-
|
|
534
646
|
export interface GridInternalState {
|
|
535
647
|
rows: {
|
|
536
648
|
idRowsLookup: Map<GridRowId, GridRowModel>;
|
|
537
649
|
allRows: GridRowId[];
|
|
538
|
-
|
|
539
|
-
|
|
540
|
-
sortModel: GridSortItem[];
|
|
541
|
-
};
|
|
542
|
-
filter: {
|
|
543
|
-
filterModel: GridFilterModel;
|
|
650
|
+
/** Row object → its getRowId() key. Rows are stored untouched, so this is how ids are resolved. */
|
|
651
|
+
idByRow: Map<GridRowModel, GridRowId>;
|
|
544
652
|
};
|
|
545
653
|
pagination: {
|
|
546
|
-
|
|
547
|
-
rowCount
|
|
654
|
+
/** Server-reported total (dataSource responses); undefined until one arrives. */
|
|
655
|
+
rowCount?: number;
|
|
548
656
|
};
|
|
549
657
|
columns: {
|
|
550
658
|
all: GridColDef[];
|
|
@@ -552,14 +660,10 @@ export interface GridInternalState {
|
|
|
552
660
|
orderedFields: string[];
|
|
553
661
|
columnVisibilityModel: GridColumnVisibilityModel;
|
|
554
662
|
};
|
|
555
|
-
selection: {
|
|
556
|
-
selectedRows: Set<GridRowId>;
|
|
557
|
-
};
|
|
558
663
|
pinning: {
|
|
559
664
|
pinnedColumns: GridPinnedColumns;
|
|
560
665
|
pinnedRows: GridPinnedRows;
|
|
561
666
|
};
|
|
562
|
-
virtualization: GridVirtualizationState;
|
|
563
667
|
dimensions: {
|
|
564
668
|
rowHeight: number;
|
|
565
669
|
headerHeight: number;
|
|
@@ -593,7 +697,7 @@ export interface GridLocaleText {
|
|
|
593
697
|
/**
|
|
594
698
|
* Main properties for the DataGrid component.
|
|
595
699
|
*/
|
|
596
|
-
export interface DataGridProps<R extends
|
|
700
|
+
export interface DataGridProps<R extends GridValidRowModel = GridRowModel> {
|
|
597
701
|
/** The dataset to display in the grid. */
|
|
598
702
|
rows: R[];
|
|
599
703
|
/** Column definitions governing how data is displayed and interacted with. */
|
|
@@ -677,8 +781,13 @@ export interface DataGridProps<R extends GridRowModel = GridRowModel> {
|
|
|
677
781
|
disableRowSelectionOnClick?: boolean;
|
|
678
782
|
/** If true, the user can only select a single row at a time. */
|
|
679
783
|
disableMultipleRowSelection?: boolean;
|
|
784
|
+
/**
|
|
785
|
+
* If true, Ctrl/Cmd+C does not copy the selected rows, so the page (or your own handler) owns
|
|
786
|
+
* the shortcut. `apiRef.current.copySelectedRows()` still works. Default: false.
|
|
787
|
+
*/
|
|
788
|
+
disableClipboardCopy?: boolean;
|
|
680
789
|
|
|
681
|
-
/**
|
|
790
|
+
/** Loading state. With no rows the body shows skeleton rows (or `slots.loadingOverlay`); with rows, they stay and a progress bar (or `slots.loadingOverlay`) is shown over them. */
|
|
682
791
|
loading?: boolean;
|
|
683
792
|
/** Visual density of the grid. */
|
|
684
793
|
density?: 'compact' | 'standard' | 'comfortable';
|
|
@@ -699,17 +808,34 @@ export interface DataGridProps<R extends GridRowModel = GridRowModel> {
|
|
|
699
808
|
|
|
700
809
|
/** Advanced: The starting internal state of the grid. */
|
|
701
810
|
initialState?: import('../state/types').GridInitialState;
|
|
702
|
-
/**
|
|
811
|
+
/**
|
|
812
|
+
* Called on mount and whenever the value of the sorting, filter, pagination, columns (widths, order,
|
|
813
|
+
* visibility, pinning) or density state changes. Selection, expansion and editing do not call it.
|
|
814
|
+
*/
|
|
703
815
|
onStateChange?: (state: import('../state/types').GridState) => void;
|
|
704
816
|
|
|
705
|
-
/**
|
|
817
|
+
/**
|
|
818
|
+
* Callback fired when a row is clicked. Tree-data parent rows are real rows: a click fires this and
|
|
819
|
+
* selects them like any row (the chevron expands them). Synthetic rows (row-grouping group rows,
|
|
820
|
+
* subtotal rows and auto-created tree parents) do not fire it: clicking a group row toggles it.
|
|
821
|
+
*/
|
|
706
822
|
onRowClick?: (params: GridRowParams<R>) => void;
|
|
823
|
+
/**
|
|
824
|
+
* Callback fired when a row is double-clicked. Also fires for group rows; check
|
|
825
|
+
* `apiRef` / `rowMeta` if you only want leaf rows. Not fired when the double-click
|
|
826
|
+
* lands on the checkbox, expand icon, drag handle, or an open cell editor.
|
|
827
|
+
* @since v2.1
|
|
828
|
+
*/
|
|
829
|
+
onRowDoubleClick?: (params: GridRowParams<R>) => void;
|
|
707
830
|
/** Callback fired when a cell is clicked. */
|
|
708
831
|
onCellClick?: (params: GridCellParams<R>) => void;
|
|
709
832
|
|
|
710
|
-
/**
|
|
833
|
+
/**
|
|
834
|
+
* Renders the detail panel content for a row in Master-Detail mode. Called for data rows only:
|
|
835
|
+
* synthetic group, subtotal and auto-created tree-parent rows have no detail panel.
|
|
836
|
+
*/
|
|
711
837
|
getDetailPanelContent?: (params: GridDetailPanelParams<R>) => React.ReactNode;
|
|
712
|
-
/** Defines the height of the detail panel. */
|
|
838
|
+
/** Defines the height of the detail panel. Called for data rows only, like `getDetailPanelContent`. */
|
|
713
839
|
getDetailPanelHeight?: (params: GridDetailPanelParams<R>) => GridDetailPanelHeight;
|
|
714
840
|
/** Controlled state for expanded detail panels. */
|
|
715
841
|
detailPanelExpandedRowIds?: Set<GridRowId>;
|
|
@@ -720,8 +846,17 @@ export interface DataGridProps<R extends GridRowModel = GridRowModel> {
|
|
|
720
846
|
disableColumnReorder?: boolean;
|
|
721
847
|
/** Controlled horizontal order of column fields. */
|
|
722
848
|
columnOrder?: GridColumnOrder;
|
|
723
|
-
/**
|
|
724
|
-
|
|
849
|
+
/**
|
|
850
|
+
* Fired when the user moves one column (header drag or Columns panel). `oldIndex` / `targetIndex`
|
|
851
|
+
* are positions in the grid's full column order: every current column, in order.
|
|
852
|
+
*/
|
|
853
|
+
onColumnOrderChange?: (params: GridColumnOrderChangeParams) => void;
|
|
854
|
+
/**
|
|
855
|
+
* Fired with the whole new column order after every change: a header drag, a Columns panel drag
|
|
856
|
+
* and the panel's Reset. The easiest way to keep a controlled `columnOrder` in sync.
|
|
857
|
+
* Not fired for the generated columns of pivot mode.
|
|
858
|
+
*/
|
|
859
|
+
onColumnOrderModelChange?: (columnOrder: GridColumnOrder) => void;
|
|
725
860
|
|
|
726
861
|
/** If true, rows can be reordered via drag-and-drop. */
|
|
727
862
|
rowReordering?: boolean;
|
|
@@ -730,10 +865,17 @@ export interface DataGridProps<R extends GridRowModel = GridRowModel> {
|
|
|
730
865
|
|
|
731
866
|
/** If true, enables hierarchical tree data display. */
|
|
732
867
|
treeData?: boolean;
|
|
733
|
-
/**
|
|
868
|
+
/**
|
|
869
|
+
* Function to get the path (array of strings) for a row in Tree Data mode. Required with `treeData`:
|
|
870
|
+
* without it the rows are shown flat. Segments may contain any character, including '/'. Keep the
|
|
871
|
+
* function identity stable (module scope or useCallback); a new function rebuilds the tree.
|
|
872
|
+
*/
|
|
734
873
|
getTreeDataPath?: (row: R) => string[];
|
|
735
|
-
/**
|
|
736
|
-
|
|
874
|
+
/**
|
|
875
|
+
* Adds a dedicated grouping column (pinned left) under row grouping or tree data, configured by these
|
|
876
|
+
* fields. Every key is optional: `field` is always `'__group__'` (a `field` you pass is ignored).
|
|
877
|
+
*/
|
|
878
|
+
groupingColDef?: Partial<GridColDef<R>>;
|
|
737
879
|
/** Initial expansion depth for Tree Data. */
|
|
738
880
|
defaultGroupingExpansionDepth?: number;
|
|
739
881
|
|
|
@@ -743,7 +885,12 @@ export interface DataGridProps<R extends GridRowModel = GridRowModel> {
|
|
|
743
885
|
aggregationModel?: GridAggregationModel;
|
|
744
886
|
/** Callback fired when aggregation model changes. */
|
|
745
887
|
onAggregationModelChange?: (model: GridAggregationModel) => void;
|
|
746
|
-
/**
|
|
888
|
+
/**
|
|
889
|
+
* Advanced: where aggregation results appear. Called for every group node (with its current
|
|
890
|
+
* `isExpanded`) and once with `null` for the grand total. `'inline'` (default for groups) shows them
|
|
891
|
+
* on the group row; `'footer'` on a subtotal row after the group's children while it is expanded
|
|
892
|
+
* (inline while collapsed); `null` hides them. For the grand total, `null` hides the footer row.
|
|
893
|
+
*/
|
|
747
894
|
getAggregationPosition?: (groupNode: GridTreeNode | null) => 'inline' | 'footer' | null;
|
|
748
895
|
|
|
749
896
|
/** If true, switches the grid to multidimensional Pivot Mode. */
|
|
@@ -770,24 +917,40 @@ export interface DataGridProps<R extends GridRowModel = GridRowModel> {
|
|
|
770
917
|
|
|
771
918
|
/** Custom components to replace internal grid parts. */
|
|
772
919
|
slots?: {
|
|
773
|
-
/**
|
|
774
|
-
|
|
775
|
-
|
|
776
|
-
|
|
777
|
-
|
|
778
|
-
|
|
779
|
-
|
|
780
|
-
|
|
781
|
-
|
|
782
|
-
|
|
920
|
+
/**
|
|
921
|
+
* Component rendered as the grid toolbar. Receives `GridToolbarSlotProps` (plus `slotProps.toolbar`),
|
|
922
|
+
* so it can be typed with `GridToolbarProps` or wrap the exported `GridToolbar`.
|
|
923
|
+
*/
|
|
924
|
+
toolbar?: React.ComponentType<GridToolbarSlotProps & Record<string, unknown>>;
|
|
925
|
+
/**
|
|
926
|
+
* Component rendered as the pagination control. Receives `PaginationProps` (plus `slotProps.pagination`),
|
|
927
|
+
* so it can be typed with `PaginationProps` or wrap the exported `Pagination`.
|
|
928
|
+
*/
|
|
929
|
+
pagination?: React.ComponentType<GridPaginationSlotProps & Record<string, unknown>>;
|
|
930
|
+
/** Component rendered when the grid is empty. Receives only `slotProps.noRowsOverlay`. */
|
|
931
|
+
noRowsOverlay?: React.ComponentType<GridOverlaySlotProps>;
|
|
932
|
+
/** Component rendered during loading states. Receives only `slotProps.loadingOverlay`. */
|
|
933
|
+
loadingOverlay?: React.ComponentType<GridOverlaySlotProps>;
|
|
934
|
+
/**
|
|
935
|
+
* Component rendered at the very bottom of the grid, in place of the pagination area.
|
|
936
|
+
* Receives `GridFooterSlotProps` (plus `slotProps.footer`).
|
|
937
|
+
*/
|
|
938
|
+
footer?: React.ComponentType<GridFooterSlotProps & Record<string, unknown>>;
|
|
783
939
|
};
|
|
784
940
|
/** Properties passed directly to custom slots. */
|
|
785
941
|
slotProps?: {
|
|
786
|
-
|
|
787
|
-
|
|
788
|
-
|
|
789
|
-
|
|
790
|
-
|
|
942
|
+
/**
|
|
943
|
+
* Merged over the props the grid passes to the toolbar. Typed as `GridToolbarProps` (so render props
|
|
944
|
+
* such as `renderQuickFilter` are checked and their parameters inferred), plus any extra keys a custom
|
|
945
|
+
* toolbar reads. `columns` / `baseColumns` are not checked, so typed `GridColDef<R>[]` can be passed.
|
|
946
|
+
*/
|
|
947
|
+
toolbar?: Omit<Partial<GridToolbarProps>, 'columns' | 'baseColumns'> & Record<string, unknown>;
|
|
948
|
+
/** Merged over the `PaginationProps` the grid passes to the pagination slot. */
|
|
949
|
+
pagination?: Partial<GridPaginationSlotProps> & Record<string, unknown>;
|
|
950
|
+
noRowsOverlay?: GridOverlaySlotProps;
|
|
951
|
+
loadingOverlay?: GridOverlaySlotProps;
|
|
952
|
+
/** Merged over the `GridFooterSlotProps` the grid passes to the footer slot. */
|
|
953
|
+
footer?: Partial<GridFooterSlotProps> & Record<string, unknown>;
|
|
791
954
|
};
|
|
792
955
|
|
|
793
956
|
/** When true, renders the grid as a single-column list of cards. Perfect for mobile/responsive views. */
|
|
@@ -802,26 +965,73 @@ export interface DataGridProps<R extends GridRowModel = GridRowModel> {
|
|
|
802
965
|
columnGroupingModel?: GridColumnGroupingModel;
|
|
803
966
|
}
|
|
804
967
|
|
|
805
|
-
|
|
806
|
-
|
|
807
|
-
|
|
808
|
-
|
|
809
|
-
|
|
968
|
+
/**
|
|
969
|
+
* `DataGridProps<R>` with untyped `columns` (`GridColDef[]`, i.e. `GridColDef<GridRowModel>[]`). `DataGrid`
|
|
970
|
+
* accepts these props as well as `DataGridProps<R>`, so columns written without a row type work with rows of
|
|
971
|
+
* any type `R`. Their callbacks then see `params.row` as `GridRowModel`; type the columns as
|
|
972
|
+
* `GridColDef<R>[]` to get your row type there.
|
|
973
|
+
* @since v3.0
|
|
974
|
+
*/
|
|
975
|
+
export type DataGridUntypedColumnsProps<R extends GridValidRowModel = GridRowModel> =
|
|
976
|
+
Omit<DataGridProps<R>, 'columns'> & { columns: GridColDef[] };
|
|
977
|
+
|
|
978
|
+
/**
|
|
979
|
+
* Props the grid passes to `slots.toolbar`, before `slotProps.toolbar` is merged over them: the
|
|
980
|
+
* `GridToolbarProps` it controls (columns, models and their change handlers) plus `apiRef`.
|
|
981
|
+
* @since v3.0
|
|
982
|
+
*/
|
|
983
|
+
export interface GridToolbarSlotProps extends GridToolbarProps {
|
|
984
|
+
apiRef: React.MutableRefObject<GridApi>;
|
|
810
985
|
}
|
|
811
986
|
|
|
812
|
-
|
|
987
|
+
/**
|
|
988
|
+
* Props the grid passes to `slots.pagination`, before `slotProps.pagination` is merged over them.
|
|
989
|
+
* @since v3.0
|
|
990
|
+
*/
|
|
991
|
+
export type GridPaginationSlotProps = PaginationProps;
|
|
992
|
+
|
|
993
|
+
/**
|
|
994
|
+
* Props of `slots.noRowsOverlay` and `slots.loadingOverlay`: the grid passes none of its own, only
|
|
995
|
+
* `slotProps.noRowsOverlay` / `slotProps.loadingOverlay`.
|
|
996
|
+
* @since v3.0
|
|
997
|
+
*/
|
|
998
|
+
export type GridOverlaySlotProps = Record<string, unknown>;
|
|
813
999
|
|
|
814
|
-
|
|
815
|
-
|
|
1000
|
+
/**
|
|
1001
|
+
* Props the grid passes to `slots.footer`, before `slotProps.footer` is merged over them.
|
|
1002
|
+
* @since v3.0
|
|
1003
|
+
*/
|
|
1004
|
+
export interface GridFooterSlotProps {
|
|
1005
|
+
apiRef: React.MutableRefObject<GridApi>;
|
|
1006
|
+
/** The active aggregation model (`{}` when none). */
|
|
1007
|
+
aggregationModel: GridAggregationModel;
|
|
1008
|
+
/** The grand-total aggregation result, or `null` when no aggregation is active. */
|
|
1009
|
+
aggregationResult: GridAggregationResult | null;
|
|
1010
|
+
/**
|
|
1011
|
+
* The built-in pager's count: rows after filtering, pinned rows excluded (`rowCount` from the
|
|
1012
|
+
* server in server pagination mode). Under tree data / row grouping: the filtered data rows.
|
|
1013
|
+
*/
|
|
1014
|
+
rowCount: number;
|
|
1015
|
+
/** Whether pagination is in effect (false under row grouping and infinite scroll). */
|
|
1016
|
+
pagination: boolean;
|
|
1017
|
+
paginationModel: GridPaginationModel;
|
|
1018
|
+
pageSizeOptions: number[];
|
|
1019
|
+
onPaginationModelChange: (model: GridPaginationModel) => void;
|
|
816
1020
|
}
|
|
817
1021
|
|
|
818
|
-
|
|
1022
|
+
/** The `slots` prop of `DataGrid`: components that replace built-in parts of the grid. */
|
|
1023
|
+
export type GridSlots = NonNullable<DataGridProps['slots']>;
|
|
1024
|
+
|
|
1025
|
+
/** The `slotProps` prop of `DataGrid`: props for each slot, keyed like `GridSlots`. */
|
|
1026
|
+
export type GridSlotProps = NonNullable<DataGridProps['slotProps']>;
|
|
1027
|
+
|
|
1028
|
+
export interface GridRowParams<R extends GridValidRowModel = GridRowModel> {
|
|
819
1029
|
row: R;
|
|
820
1030
|
id: GridRowId;
|
|
821
1031
|
rowIndex: number;
|
|
822
1032
|
}
|
|
823
1033
|
|
|
824
|
-
export interface GridCellParams<R extends
|
|
1034
|
+
export interface GridCellParams<R extends GridValidRowModel = GridRowModel> {
|
|
825
1035
|
row: R;
|
|
826
1036
|
field: string;
|
|
827
1037
|
value: unknown;
|
|
@@ -830,7 +1040,7 @@ export interface GridCellParams<R extends GridRowModel = GridRowModel> {
|
|
|
830
1040
|
colIndex: number;
|
|
831
1041
|
}
|
|
832
1042
|
|
|
833
|
-
export interface GridDetailPanelParams<R extends
|
|
1043
|
+
export interface GridDetailPanelParams<R extends GridValidRowModel = GridRowModel> {
|
|
834
1044
|
row: R;
|
|
835
1045
|
id: GridRowId;
|
|
836
1046
|
rowIndex: number;
|
|
@@ -838,15 +1048,6 @@ export interface GridDetailPanelParams<R extends GridRowModel = GridRowModel> {
|
|
|
838
1048
|
|
|
839
1049
|
export type GridDetailPanelHeight = number | 'auto';
|
|
840
1050
|
|
|
841
|
-
export type GridDetailPanelContent<R extends GridRowModel = GridRowModel> =
|
|
842
|
-
| React.ReactNode
|
|
843
|
-
| ((params: GridDetailPanelParams<R>) => React.ReactNode);
|
|
844
|
-
|
|
845
|
-
export interface GridDetailPanelState {
|
|
846
|
-
expandedRowIds: Set<GridRowId>;
|
|
847
|
-
contentCache: Map<GridRowId, React.ReactNode>;
|
|
848
|
-
}
|
|
849
|
-
|
|
850
1051
|
/**
|
|
851
1052
|
* The Imperative API for interacting with the DataGrid.
|
|
852
1053
|
* Access this via the `apiRef` prop or a ref passed to the component.
|
|
@@ -920,9 +1121,11 @@ export interface GridApi {
|
|
|
920
1121
|
scrollToIndexes: (params: { rowIndex?: number; colIndex?: number }) => void;
|
|
921
1122
|
|
|
922
1123
|
/**
|
|
923
|
-
* Programmatically copies all currently selected rows to the clipboard as TSV
|
|
924
|
-
*
|
|
925
|
-
*
|
|
1124
|
+
* Programmatically copies all currently selected rows to the clipboard as TSV: every selected
|
|
1125
|
+
* row that passes the filter (other pages, collapsed groups and pinned rows included), with the
|
|
1126
|
+
* visible columns in screen order. Equivalent to the user pressing Ctrl+C / Cmd+C.
|
|
1127
|
+
* @returns A Promise that resolves when the text is written (or when no selected row was found,
|
|
1128
|
+
* in which case nothing is written) and rejects when the clipboard write fails.
|
|
926
1129
|
*/
|
|
927
1130
|
copySelectedRows: () => Promise<void>;
|
|
928
1131
|
}
|