material-react-table 0.7.0-alpha.1 → 0.7.0-alpha.12
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 +29 -21
- package/dist/MaterialReactTable.d.ts +236 -75
- package/dist/buttons/MRT_CopyButton.d.ts +1 -2
- package/dist/buttons/{MRT_ToggleSearchButton.d.ts → MRT_ToggleGlobalFilterButton.d.ts} +1 -1
- package/dist/localization.d.ts +1 -0
- package/dist/material-react-table.cjs.development.js +399 -1011
- package/dist/material-react-table.cjs.development.js.map +1 -1
- package/dist/material-react-table.cjs.production.min.js +1 -1
- package/dist/material-react-table.cjs.production.min.js.map +1 -1
- package/dist/material-react-table.esm.js +400 -1012
- package/dist/material-react-table.esm.js.map +1 -1
- package/dist/utils.d.ts +1 -1
- package/package.json +7 -7
- package/src/MaterialReactTable.tsx +436 -143
- package/src/body/MRT_TableBody.tsx +1 -1
- package/src/body/MRT_TableBodyCell.tsx +11 -8
- package/src/body/MRT_TableBodyRow.tsx +2 -2
- package/src/body/MRT_TableDetailPanel.tsx +6 -4
- package/src/buttons/MRT_CopyButton.tsx +3 -4
- package/src/buttons/MRT_EditActionButtons.tsx +6 -4
- package/src/buttons/MRT_ExpandButton.tsx +1 -1
- package/src/buttons/MRT_FullScreenToggleButton.tsx +13 -3
- package/src/buttons/MRT_ToggleColumnActionMenuButton.tsx +5 -2
- package/src/buttons/MRT_ToggleDensePaddingButton.tsx +13 -3
- package/src/buttons/MRT_ToggleFiltersButton.tsx +13 -3
- package/src/buttons/MRT_ToggleGlobalFilterButton.tsx +57 -0
- package/src/buttons/MRT_ToggleRowActionMenuButton.tsx +7 -7
- package/src/footer/MRT_TableFooter.tsx +1 -1
- package/src/footer/MRT_TableFooterCell.tsx +2 -2
- package/src/footer/MRT_TableFooterRow.tsx +1 -1
- package/src/head/MRT_TableHead.tsx +1 -1
- package/src/head/MRT_TableHeadCell.tsx +23 -30
- package/src/head/MRT_TableHeadRow.tsx +1 -1
- package/src/inputs/MRT_EditCellTextField.tsx +27 -14
- package/src/inputs/MRT_FilterTextField.tsx +3 -3
- package/src/inputs/MRT_SearchTextField.tsx +10 -5
- package/src/inputs/MRT_SelectCheckbox.tsx +9 -7
- package/src/localization.ts +2 -1
- package/src/menus/MRT_ColumnActionMenu.tsx +4 -4
- package/src/menus/MRT_FilterTypeMenu.tsx +3 -6
- package/src/menus/MRT_RowActionMenu.tsx +7 -5
- package/src/menus/MRT_ShowHideColumnsMenuItems.tsx +5 -6
- package/src/table/MRT_Table.tsx +1 -1
- package/src/table/MRT_TableContainer.tsx +20 -24
- package/src/table/MRT_TablePaper.tsx +9 -5
- package/src/table/MRT_TableRoot.tsx +44 -40
- package/src/toolbar/MRT_LinearProgressBar.tsx +1 -1
- package/src/toolbar/MRT_TablePagination.tsx +6 -2
- package/src/toolbar/MRT_ToolbarAlertBanner.tsx +2 -1
- package/src/toolbar/MRT_ToolbarBottom.tsx +1 -1
- package/src/toolbar/MRT_ToolbarInternalButtons.tsx +12 -10
- package/src/toolbar/MRT_ToolbarTop.tsx +2 -2
- package/src/buttons/MRT_ToggleSearchButton.tsx +0 -46
|
@@ -2,6 +2,7 @@ import React, {
|
|
|
2
2
|
ChangeEvent,
|
|
3
3
|
Dispatch,
|
|
4
4
|
FC,
|
|
5
|
+
FocusEvent,
|
|
5
6
|
MouseEvent,
|
|
6
7
|
ReactNode,
|
|
7
8
|
SetStateAction,
|
|
@@ -39,12 +40,18 @@ import {
|
|
|
39
40
|
Row,
|
|
40
41
|
TableInstance,
|
|
41
42
|
TableState,
|
|
43
|
+
VisibilityState,
|
|
42
44
|
} from '@tanstack/react-table';
|
|
43
45
|
import { MRT_Localization, MRT_DefaultLocalization_EN } from './localization';
|
|
44
46
|
import { MRT_Default_Icons, MRT_Icons } from './icons';
|
|
45
47
|
import { MRT_FILTER_TYPE } from './enums';
|
|
46
48
|
import { MRT_TableRoot } from './table/MRT_TableRoot';
|
|
47
49
|
|
|
50
|
+
//@ts-ignore
|
|
51
|
+
global.performance = global.performance || {
|
|
52
|
+
now: () => new Date().getTime(),
|
|
53
|
+
};
|
|
54
|
+
|
|
48
55
|
export type MRT_TableOptions<D extends Record<string, any> = {}> = Partial<
|
|
49
56
|
Omit<
|
|
50
57
|
Options<D>,
|
|
@@ -85,29 +92,29 @@ export type MRT_TableInstance<D extends Record<string, any> = {}> = Omit<
|
|
|
85
92
|
> & {
|
|
86
93
|
getAllColumns: () => MRT_ColumnInstance<D>[];
|
|
87
94
|
getAllLeafColumns: () => MRT_ColumnInstance<D>[];
|
|
88
|
-
getExpandedRowModel: () => MRT_RowModel
|
|
89
|
-
getPaginationRowModel: () => MRT_RowModel
|
|
90
|
-
getPrePaginationRowModel: () => MRT_RowModel
|
|
91
|
-
getRowModel: () => MRT_RowModel
|
|
92
|
-
getSelectedRowModel: () => MRT_RowModel
|
|
95
|
+
getExpandedRowModel: () => MRT_RowModel<D>;
|
|
96
|
+
getPaginationRowModel: () => MRT_RowModel<D>;
|
|
97
|
+
getPrePaginationRowModel: () => MRT_RowModel<D>;
|
|
98
|
+
getRowModel: () => MRT_RowModel<D>;
|
|
99
|
+
getSelectedRowModel: () => MRT_RowModel<D>;
|
|
93
100
|
getState: () => MRT_TableState<D>;
|
|
94
101
|
options: MaterialReactTableProps<D> & {
|
|
95
102
|
icons: MRT_Icons;
|
|
96
103
|
idPrefix: string;
|
|
97
104
|
filterTypes: { [key in MRT_FILTER_TYPE]: any };
|
|
98
105
|
localization: MRT_Localization;
|
|
99
|
-
setCurrentEditingRow: Dispatch<SetStateAction<MRT_Row<D> | null>>;
|
|
100
|
-
setCurrentFilterTypes: Dispatch<
|
|
101
|
-
SetStateAction<{
|
|
102
|
-
[key: string]: MRT_FilterType;
|
|
103
|
-
}>
|
|
104
|
-
>;
|
|
105
|
-
setCurrentGlobalFilterType: Dispatch<SetStateAction<MRT_FILTER_TYPE>>;
|
|
106
|
-
setIsDensePadding: Dispatch<SetStateAction<boolean>>;
|
|
107
|
-
setIsFullScreen: Dispatch<SetStateAction<boolean>>;
|
|
108
|
-
setShowFilters: Dispatch<SetStateAction<boolean>>;
|
|
109
|
-
setShowSearch: Dispatch<SetStateAction<boolean>>;
|
|
110
106
|
};
|
|
107
|
+
setCurrentEditingRow: Dispatch<SetStateAction<MRT_Row<D> | null>>;
|
|
108
|
+
setCurrentFilterTypes: Dispatch<
|
|
109
|
+
SetStateAction<{
|
|
110
|
+
[key: string]: MRT_FilterType;
|
|
111
|
+
}>
|
|
112
|
+
>;
|
|
113
|
+
setCurrentGlobalFilterType: Dispatch<SetStateAction<MRT_FILTER_TYPE>>;
|
|
114
|
+
setIsDensePadding: Dispatch<SetStateAction<boolean>>;
|
|
115
|
+
setIsFullScreen: Dispatch<SetStateAction<boolean>>;
|
|
116
|
+
setShowFilters: Dispatch<SetStateAction<boolean>>;
|
|
117
|
+
setShowGlobalFilter: Dispatch<SetStateAction<boolean>>;
|
|
111
118
|
};
|
|
112
119
|
|
|
113
120
|
export type MRT_TableState<D extends Record<string, any> = {}> = Omit<
|
|
@@ -120,7 +127,7 @@ export type MRT_TableState<D extends Record<string, any> = {}> = Omit<
|
|
|
120
127
|
isDensePadding: boolean;
|
|
121
128
|
isFullScreen: boolean;
|
|
122
129
|
showFilters: boolean;
|
|
123
|
-
|
|
130
|
+
showGlobalFilter: boolean;
|
|
124
131
|
pagination: Partial<PaginationState>;
|
|
125
132
|
};
|
|
126
133
|
|
|
@@ -131,16 +138,18 @@ export type MRT_ColumnInterface<D extends Record<string, any> = {}> = Omit<
|
|
|
131
138
|
Edit?: ({
|
|
132
139
|
cell,
|
|
133
140
|
tableInstance,
|
|
134
|
-
|
|
135
|
-
|
|
141
|
+
}: // onChange,
|
|
142
|
+
{
|
|
136
143
|
cell: MRT_Cell<D>;
|
|
137
144
|
tableInstance: MRT_TableInstance<D>;
|
|
138
|
-
onChange?: (event: ChangeEvent<HTMLInputElement>) => void;
|
|
145
|
+
// onChange?: (event: ChangeEvent<HTMLInputElement>) => void;
|
|
139
146
|
}) => ReactNode;
|
|
140
147
|
Filter?: ({
|
|
148
|
+
// onChange,
|
|
141
149
|
header,
|
|
142
150
|
tableInstance,
|
|
143
151
|
}: {
|
|
152
|
+
// onChange?: (event: ChangeEvent<HTMLInputElement>) => void;
|
|
144
153
|
header: MRT_Header<D>;
|
|
145
154
|
tableInstance: MRT_TableInstance<D>;
|
|
146
155
|
}) => ReactNode;
|
|
@@ -170,8 +179,6 @@ export type MRT_ColumnInterface<D extends Record<string, any> = {}> = Omit<
|
|
|
170
179
|
enableClickToCopy?: boolean;
|
|
171
180
|
enableColumnActions?: boolean;
|
|
172
181
|
enableEditing?: boolean;
|
|
173
|
-
enableColumnFilters?: boolean;
|
|
174
|
-
enableHiding?: boolean;
|
|
175
182
|
enabledFilterTypes?: (MRT_FILTER_TYPE | string)[];
|
|
176
183
|
filter?: MRT_FilterType | string | FilterType<D>;
|
|
177
184
|
filterSelectOptions?: (string | { text: string; value: string })[];
|
|
@@ -179,33 +186,92 @@ export type MRT_ColumnInterface<D extends Record<string, any> = {}> = Omit<
|
|
|
179
186
|
header: string;
|
|
180
187
|
muiTableBodyCellCopyButtonProps?:
|
|
181
188
|
| ButtonProps
|
|
182
|
-
| ((
|
|
189
|
+
| (({
|
|
190
|
+
tableInstance,
|
|
191
|
+
cell,
|
|
192
|
+
}: {
|
|
193
|
+
tableInstance: MRT_TableInstance;
|
|
194
|
+
cell: MRT_Cell<D>;
|
|
195
|
+
}) => ButtonProps);
|
|
183
196
|
muiTableBodyCellEditTextFieldProps?:
|
|
184
197
|
| TextFieldProps
|
|
185
|
-
| ((
|
|
198
|
+
| (({
|
|
199
|
+
tableInstance,
|
|
200
|
+
cell,
|
|
201
|
+
}: {
|
|
202
|
+
tableInstance: MRT_TableInstance;
|
|
203
|
+
cell: MRT_Cell<D>;
|
|
204
|
+
}) => TextFieldProps);
|
|
186
205
|
muiTableBodyCellProps?:
|
|
187
206
|
| TableCellProps
|
|
188
|
-
| ((
|
|
207
|
+
| (({
|
|
208
|
+
tableInstance,
|
|
209
|
+
cell,
|
|
210
|
+
}: {
|
|
211
|
+
tableInstance: MRT_TableInstance;
|
|
212
|
+
cell: MRT_Cell<D>;
|
|
213
|
+
}) => TableCellProps);
|
|
189
214
|
muiTableFooterCellProps?:
|
|
190
215
|
| TableCellProps
|
|
191
|
-
| ((
|
|
216
|
+
| (({
|
|
217
|
+
tableInstance,
|
|
218
|
+
column,
|
|
219
|
+
}: {
|
|
220
|
+
tableInstance: MRT_TableInstance;
|
|
221
|
+
column: MRT_ColumnInstance<D>;
|
|
222
|
+
}) => TableCellProps);
|
|
192
223
|
muiTableHeadCellColumnActionsButtonProps?:
|
|
193
224
|
| IconButtonProps
|
|
194
|
-
| ((
|
|
225
|
+
| (({
|
|
226
|
+
tableInstance,
|
|
227
|
+
column,
|
|
228
|
+
}: {
|
|
229
|
+
tableInstance: MRT_TableInstance;
|
|
230
|
+
column: MRT_ColumnInstance<D>;
|
|
231
|
+
}) => IconButtonProps);
|
|
195
232
|
muiTableHeadCellFilterTextFieldProps?:
|
|
196
233
|
| TextFieldProps
|
|
197
|
-
| ((
|
|
234
|
+
| (({
|
|
235
|
+
tableInstance,
|
|
236
|
+
column,
|
|
237
|
+
}: {
|
|
238
|
+
tableInstance: MRT_TableInstance;
|
|
239
|
+
column: MRT_ColumnInstance<D>;
|
|
240
|
+
}) => TextFieldProps);
|
|
198
241
|
muiTableHeadCellProps?:
|
|
199
242
|
| TableCellProps
|
|
200
|
-
| ((
|
|
201
|
-
|
|
202
|
-
|
|
203
|
-
|
|
204
|
-
|
|
205
|
-
|
|
206
|
-
|
|
207
|
-
|
|
208
|
-
|
|
243
|
+
| (({
|
|
244
|
+
tableInstance,
|
|
245
|
+
column,
|
|
246
|
+
}: {
|
|
247
|
+
tableInstance: MRT_TableInstance;
|
|
248
|
+
column: MRT_ColumnInstance<D>;
|
|
249
|
+
}) => TableCellProps);
|
|
250
|
+
onCellEditBlur?: ({
|
|
251
|
+
cell,
|
|
252
|
+
event,
|
|
253
|
+
tableInstance,
|
|
254
|
+
}: {
|
|
255
|
+
event: FocusEvent<HTMLInputElement>;
|
|
256
|
+
cell: MRT_Cell<D>;
|
|
257
|
+
tableInstance: MRT_TableInstance<D>;
|
|
258
|
+
}) => void;
|
|
259
|
+
onCellEditChange?: ({
|
|
260
|
+
cell,
|
|
261
|
+
event,
|
|
262
|
+
tableInstance,
|
|
263
|
+
}: {
|
|
264
|
+
event: ChangeEvent<HTMLInputElement>;
|
|
265
|
+
cell: MRT_Cell<D>;
|
|
266
|
+
tableInstance: MRT_TableInstance<D>;
|
|
267
|
+
}) => void;
|
|
268
|
+
onColumnFilterValueChange?: ({
|
|
269
|
+
event,
|
|
270
|
+
filterValue,
|
|
271
|
+
}: {
|
|
272
|
+
event: ChangeEvent<HTMLInputElement>;
|
|
273
|
+
filterValue: any;
|
|
274
|
+
}) => void;
|
|
209
275
|
};
|
|
210
276
|
|
|
211
277
|
export type MRT_ColumnInstance<D extends Record<string, any> = {}> = Omit<
|
|
@@ -263,16 +329,15 @@ export type MaterialReactTableProps<D extends Record<string, any> = {}> =
|
|
|
263
329
|
MRT_TableOptions<D> & {
|
|
264
330
|
enableClickToCopy?: boolean;
|
|
265
331
|
enableColumnActions?: boolean;
|
|
266
|
-
enableColumnPinning?: boolean;
|
|
267
332
|
enableDensePaddingToggle?: boolean;
|
|
333
|
+
enableEditing?: boolean;
|
|
268
334
|
enableExpandAll?: boolean;
|
|
269
335
|
enableFullScreenToggle?: boolean;
|
|
270
336
|
enablePagination?: boolean;
|
|
271
337
|
enableRowActions?: boolean;
|
|
272
|
-
enableStickyHeader?: boolean;
|
|
273
|
-
enableRowEditing?: boolean;
|
|
274
338
|
enableRowNumbers?: boolean;
|
|
275
339
|
enableSelectAll?: boolean;
|
|
340
|
+
enableStickyHeader?: boolean;
|
|
276
341
|
enabledGlobalFilterTypes?: (MRT_FILTER_TYPE | string)[];
|
|
277
342
|
filterTypes?: { [key in MRT_FILTER_TYPE]: any };
|
|
278
343
|
hideTableFooter?: boolean;
|
|
@@ -282,175 +347,400 @@ export type MaterialReactTableProps<D extends Record<string, any> = {}> =
|
|
|
282
347
|
hideToolbarTop?: boolean;
|
|
283
348
|
icons?: Partial<MRT_Icons>;
|
|
284
349
|
idPrefix?: string;
|
|
285
|
-
isReloading?: boolean;
|
|
286
350
|
isLoading?: boolean;
|
|
351
|
+
isReloading?: boolean;
|
|
287
352
|
localization?: Partial<MRT_Localization>;
|
|
288
353
|
muiLinearProgressProps?:
|
|
289
354
|
| LinearProgressProps
|
|
290
|
-
| ((
|
|
291
|
-
|
|
355
|
+
| (({
|
|
356
|
+
tableInstance,
|
|
357
|
+
}: {
|
|
358
|
+
tableInstance: MRT_TableInstance;
|
|
359
|
+
}) => LinearProgressProps);
|
|
360
|
+
muiSearchTextFieldProps?:
|
|
361
|
+
| TextFieldProps
|
|
362
|
+
| (({
|
|
363
|
+
tableInstance,
|
|
364
|
+
}: {
|
|
365
|
+
tableInstance: MRT_TableInstance;
|
|
366
|
+
}) => TextFieldProps);
|
|
292
367
|
muiSelectCheckboxProps?:
|
|
293
368
|
| CheckboxProps
|
|
294
|
-
| ((
|
|
295
|
-
|
|
296
|
-
|
|
297
|
-
|
|
298
|
-
|
|
369
|
+
| (({
|
|
370
|
+
tableInstance,
|
|
371
|
+
isSelectAll,
|
|
372
|
+
row,
|
|
373
|
+
}: {
|
|
374
|
+
tableInstance: MRT_TableInstance;
|
|
375
|
+
isSelectAll: boolean;
|
|
376
|
+
row?: MRT_Row<D>;
|
|
377
|
+
}) => CheckboxProps);
|
|
299
378
|
muiTableBodyCellCopyButtonProps?:
|
|
300
379
|
| ButtonProps
|
|
301
|
-
| ((
|
|
380
|
+
| (({
|
|
381
|
+
tableInstance,
|
|
382
|
+
cell,
|
|
383
|
+
}: {
|
|
384
|
+
tableInstance: MRT_TableInstance;
|
|
385
|
+
cell: MRT_Cell<D>;
|
|
386
|
+
}) => ButtonProps);
|
|
302
387
|
muiTableBodyCellEditTextFieldProps?:
|
|
303
388
|
| TextFieldProps
|
|
304
|
-
| ((
|
|
389
|
+
| (({
|
|
390
|
+
tableInstance,
|
|
391
|
+
cell,
|
|
392
|
+
}: {
|
|
393
|
+
tableInstance: MRT_TableInstance;
|
|
394
|
+
cell: MRT_Cell<D>;
|
|
395
|
+
}) => TextFieldProps);
|
|
305
396
|
muiTableBodyCellProps?:
|
|
306
397
|
| TableCellProps
|
|
307
|
-
| ((
|
|
398
|
+
| (({
|
|
399
|
+
tableInstance,
|
|
400
|
+
cell,
|
|
401
|
+
}: {
|
|
402
|
+
tableInstance: MRT_TableInstance;
|
|
403
|
+
cell: MRT_Cell<D>;
|
|
404
|
+
}) => TableCellProps);
|
|
308
405
|
muiTableBodyCellSkeletonProps?:
|
|
309
406
|
| SkeletonProps
|
|
310
|
-
| ((
|
|
407
|
+
| (({
|
|
408
|
+
tableInstance,
|
|
409
|
+
cell,
|
|
410
|
+
}: {
|
|
411
|
+
tableInstance: MRT_TableInstance;
|
|
412
|
+
cell: MRT_Cell<D>;
|
|
413
|
+
}) => SkeletonProps);
|
|
311
414
|
muiTableBodyProps?:
|
|
312
415
|
| TableBodyProps
|
|
313
|
-
| ((
|
|
314
|
-
|
|
416
|
+
| (({
|
|
417
|
+
tableInstance,
|
|
418
|
+
}: {
|
|
419
|
+
tableInstance: MRT_TableInstance;
|
|
420
|
+
}) => TableBodyProps);
|
|
421
|
+
muiTableBodyRowProps?:
|
|
422
|
+
| TableRowProps
|
|
423
|
+
| (({
|
|
424
|
+
tableInstance,
|
|
425
|
+
row,
|
|
426
|
+
}: {
|
|
427
|
+
tableInstance: MRT_TableInstance;
|
|
428
|
+
row: MRT_Row<D>;
|
|
429
|
+
}) => TableRowProps);
|
|
315
430
|
muiTableContainerProps?:
|
|
316
431
|
| TableContainerProps
|
|
317
|
-
| ((
|
|
432
|
+
| (({
|
|
433
|
+
tableInstance,
|
|
434
|
+
}: {
|
|
435
|
+
tableInstance: MRT_TableInstance;
|
|
436
|
+
}) => TableContainerProps);
|
|
318
437
|
muiTableDetailPanelProps?:
|
|
319
438
|
| TableCellProps
|
|
320
|
-
| ((
|
|
439
|
+
| (({
|
|
440
|
+
tableInstance,
|
|
441
|
+
row,
|
|
442
|
+
}: {
|
|
443
|
+
tableInstance: MRT_TableInstance;
|
|
444
|
+
row: MRT_Row<D>;
|
|
445
|
+
}) => TableCellProps);
|
|
321
446
|
muiTableFooterCellProps?:
|
|
322
447
|
| TableCellProps
|
|
323
|
-
| ((
|
|
448
|
+
| (({
|
|
449
|
+
tableInstance,
|
|
450
|
+
column,
|
|
451
|
+
}: {
|
|
452
|
+
tableInstance: MRT_TableInstance;
|
|
453
|
+
column: MRT_ColumnInstance<D>;
|
|
454
|
+
}) => TableCellProps);
|
|
324
455
|
muiTableFooterProps?:
|
|
325
456
|
| TableFooterProps
|
|
326
|
-
| ((
|
|
457
|
+
| (({
|
|
458
|
+
tableInstance,
|
|
459
|
+
}: {
|
|
460
|
+
tableInstance: MRT_TableInstance;
|
|
461
|
+
}) => TableFooterProps);
|
|
327
462
|
muiTableFooterRowProps?:
|
|
328
463
|
| TableRowProps
|
|
329
|
-
| ((
|
|
464
|
+
| (({
|
|
465
|
+
tableInstance,
|
|
466
|
+
footerGroup,
|
|
467
|
+
}: {
|
|
468
|
+
tableInstance: MRT_TableInstance;
|
|
469
|
+
footerGroup: MRT_HeaderGroup<D>;
|
|
470
|
+
}) => TableRowProps);
|
|
330
471
|
muiTableHeadCellColumnActionsButtonProps?:
|
|
331
472
|
| IconButtonProps
|
|
332
|
-
| ((
|
|
473
|
+
| (({
|
|
474
|
+
tableInstance,
|
|
475
|
+
column,
|
|
476
|
+
}: {
|
|
477
|
+
tableInstance: MRT_TableInstance;
|
|
478
|
+
column: MRT_ColumnInstance<D>;
|
|
479
|
+
}) => IconButtonProps);
|
|
333
480
|
muiTableHeadCellFilterTextFieldProps?:
|
|
334
481
|
| TextFieldProps
|
|
335
|
-
| ((
|
|
482
|
+
| (({
|
|
483
|
+
tableInstance,
|
|
484
|
+
column,
|
|
485
|
+
}: {
|
|
486
|
+
tableInstance: MRT_TableInstance;
|
|
487
|
+
column: MRT_ColumnInstance<D>;
|
|
488
|
+
}) => TextFieldProps);
|
|
336
489
|
muiTableHeadCellProps?:
|
|
337
490
|
| TableCellProps
|
|
338
|
-
| ((
|
|
491
|
+
| (({
|
|
492
|
+
tableInstance,
|
|
493
|
+
column,
|
|
494
|
+
}: {
|
|
495
|
+
tableInstance: MRT_TableInstance;
|
|
496
|
+
column: MRT_ColumnInstance<D>;
|
|
497
|
+
}) => TableCellProps);
|
|
339
498
|
muiTableHeadProps?:
|
|
340
499
|
| TableHeadProps
|
|
341
|
-
| ((
|
|
500
|
+
| (({
|
|
501
|
+
tableInstance,
|
|
502
|
+
}: {
|
|
503
|
+
tableInstance: MRT_TableInstance;
|
|
504
|
+
}) => TableHeadProps);
|
|
342
505
|
muiTableHeadRowProps?:
|
|
343
506
|
| TableRowProps
|
|
344
|
-
| ((
|
|
507
|
+
| (({
|
|
508
|
+
tableInstance,
|
|
509
|
+
headerGroup,
|
|
510
|
+
}: {
|
|
511
|
+
tableInstance: MRT_TableInstance;
|
|
512
|
+
headerGroup: MRT_HeaderGroup<D>;
|
|
513
|
+
}) => TableRowProps);
|
|
345
514
|
muiTablePaperProps?:
|
|
346
515
|
| PaperProps
|
|
347
|
-
| ((
|
|
516
|
+
| (({
|
|
517
|
+
tableInstance,
|
|
518
|
+
}: {
|
|
519
|
+
tableInstance: MRT_TableInstance;
|
|
520
|
+
}) => PaperProps);
|
|
348
521
|
muiTablePaginationProps?:
|
|
349
522
|
| Partial<TablePaginationProps>
|
|
350
|
-
| ((
|
|
351
|
-
tableInstance
|
|
352
|
-
|
|
523
|
+
| (({
|
|
524
|
+
tableInstance,
|
|
525
|
+
}: {
|
|
526
|
+
tableInstance: MRT_TableInstance;
|
|
527
|
+
}) => Partial<TablePaginationProps>);
|
|
353
528
|
muiTableProps?:
|
|
354
529
|
| TableProps
|
|
355
|
-
| ((
|
|
530
|
+
| (({
|
|
531
|
+
tableInstance,
|
|
532
|
+
}: {
|
|
533
|
+
tableInstance: MRT_TableInstance;
|
|
534
|
+
}) => TableProps);
|
|
356
535
|
muiTableToolbarAlertBannerProps?:
|
|
357
536
|
| AlertProps
|
|
358
|
-
| ((
|
|
537
|
+
| (({
|
|
538
|
+
tableInstance,
|
|
539
|
+
}: {
|
|
540
|
+
tableInstance: MRT_TableInstance;
|
|
541
|
+
}) => AlertProps);
|
|
359
542
|
muiTableToolbarBottomProps?:
|
|
360
543
|
| ToolbarProps
|
|
361
|
-
| ((
|
|
544
|
+
| (({
|
|
545
|
+
tableInstance,
|
|
546
|
+
}: {
|
|
547
|
+
tableInstance: MRT_TableInstance;
|
|
548
|
+
}) => ToolbarProps);
|
|
362
549
|
muiTableToolbarTopProps?:
|
|
363
550
|
| ToolbarProps
|
|
364
|
-
| ((
|
|
365
|
-
|
|
366
|
-
|
|
367
|
-
|
|
368
|
-
|
|
369
|
-
|
|
370
|
-
|
|
371
|
-
|
|
372
|
-
|
|
373
|
-
|
|
374
|
-
|
|
375
|
-
|
|
376
|
-
|
|
377
|
-
|
|
378
|
-
|
|
379
|
-
event
|
|
380
|
-
row
|
|
381
|
-
|
|
382
|
-
|
|
383
|
-
|
|
384
|
-
|
|
385
|
-
|
|
386
|
-
) => void;
|
|
387
|
-
|
|
388
|
-
event
|
|
389
|
-
|
|
390
|
-
|
|
391
|
-
|
|
392
|
-
|
|
393
|
-
|
|
394
|
-
|
|
395
|
-
|
|
551
|
+
| (({
|
|
552
|
+
tableInstance,
|
|
553
|
+
}: {
|
|
554
|
+
tableInstance: MRT_TableInstance;
|
|
555
|
+
}) => ToolbarProps);
|
|
556
|
+
onCellClick?: ({
|
|
557
|
+
cell,
|
|
558
|
+
event,
|
|
559
|
+
tableInstance,
|
|
560
|
+
}: {
|
|
561
|
+
cell: MRT_Cell<D>;
|
|
562
|
+
tableInstance: MRT_TableInstance<D>;
|
|
563
|
+
event: MouseEvent<HTMLTableCellElement>;
|
|
564
|
+
}) => void;
|
|
565
|
+
onDetailPanelClick?: ({
|
|
566
|
+
event,
|
|
567
|
+
row,
|
|
568
|
+
tableInstance,
|
|
569
|
+
}: {
|
|
570
|
+
event: MouseEvent<HTMLTableCellElement>;
|
|
571
|
+
row: MRT_Row<D>;
|
|
572
|
+
tableInstance: MRT_TableInstance<D>;
|
|
573
|
+
}) => void;
|
|
574
|
+
onGlobalFilterChange?: ({
|
|
575
|
+
event,
|
|
576
|
+
tableInstance,
|
|
577
|
+
}: {
|
|
578
|
+
event: ChangeEvent<HTMLInputElement>;
|
|
579
|
+
tableInstance: MRT_TableInstance<D>;
|
|
580
|
+
}) => void;
|
|
581
|
+
onRowClick?: ({
|
|
582
|
+
event,
|
|
583
|
+
row,
|
|
584
|
+
tableInstance,
|
|
585
|
+
}: {
|
|
586
|
+
event: MouseEvent<HTMLTableRowElement>;
|
|
587
|
+
row: MRT_Row<D>;
|
|
588
|
+
tableInstance: MRT_TableInstance<D>;
|
|
589
|
+
}) => void;
|
|
590
|
+
onEditSubmit?: ({
|
|
591
|
+
row,
|
|
592
|
+
tableInstance,
|
|
593
|
+
}: {
|
|
594
|
+
row: MRT_Row<D>;
|
|
595
|
+
tableInstance: MRT_TableInstance<D>;
|
|
596
|
+
}) => Promise<void> | void;
|
|
597
|
+
onRowExpandChange?: ({
|
|
598
|
+
event,
|
|
599
|
+
row,
|
|
600
|
+
}: {
|
|
601
|
+
event: MouseEvent<HTMLButtonElement>;
|
|
602
|
+
row: MRT_Row<D>;
|
|
603
|
+
tableInstance: MRT_TableInstance<D>;
|
|
604
|
+
}) => void;
|
|
605
|
+
onSelectAllChange?: ({
|
|
606
|
+
event,
|
|
607
|
+
selectedRows,
|
|
608
|
+
tableInstance,
|
|
609
|
+
}: {
|
|
610
|
+
event: ChangeEvent;
|
|
611
|
+
selectedRows: MRT_Row<D>[];
|
|
612
|
+
tableInstance: MRT_TableInstance<D>;
|
|
613
|
+
}) => void;
|
|
614
|
+
onSelectChange?: ({
|
|
615
|
+
event,
|
|
616
|
+
row,
|
|
617
|
+
selectedRows,
|
|
618
|
+
tableInstance,
|
|
619
|
+
}: {
|
|
620
|
+
event: ChangeEvent;
|
|
621
|
+
row: MRT_Row<D>;
|
|
622
|
+
selectedRows: MRT_Row<D>[];
|
|
623
|
+
tableInstance: MRT_TableInstance<D>;
|
|
624
|
+
}) => void;
|
|
625
|
+
onToggleColumnVisibility?: ({
|
|
626
|
+
column,
|
|
627
|
+
columnVisibility,
|
|
628
|
+
tableInstance,
|
|
629
|
+
}: {
|
|
630
|
+
column: MRT_ColumnInstance<D>;
|
|
631
|
+
columnVisibility: VisibilityState;
|
|
632
|
+
tableInstance: MRT_TableInstance<D>;
|
|
633
|
+
}) => void;
|
|
634
|
+
onToggleDensePadding?: ({
|
|
635
|
+
event,
|
|
636
|
+
isDensePadding,
|
|
637
|
+
tableInstance,
|
|
638
|
+
}: {
|
|
639
|
+
event: MouseEvent<HTMLButtonElement>;
|
|
640
|
+
isDensePadding: boolean;
|
|
641
|
+
tableInstance: MRT_TableInstance<D>;
|
|
642
|
+
}) => void;
|
|
643
|
+
onToggleFullScreen?: ({
|
|
644
|
+
event,
|
|
645
|
+
isFullScreen,
|
|
646
|
+
tableInstance,
|
|
647
|
+
}: {
|
|
648
|
+
event: MouseEvent<HTMLButtonElement>;
|
|
649
|
+
isFullScreen: boolean;
|
|
650
|
+
tableInstance: MRT_TableInstance<D>;
|
|
651
|
+
}) => void;
|
|
652
|
+
onToggleShowFilters?: ({
|
|
653
|
+
event,
|
|
654
|
+
showFilters,
|
|
655
|
+
tableInstance,
|
|
656
|
+
}: {
|
|
657
|
+
event: MouseEvent<HTMLButtonElement>;
|
|
658
|
+
showFilters: boolean;
|
|
659
|
+
tableInstance: MRT_TableInstance<D>;
|
|
660
|
+
}) => void;
|
|
661
|
+
onToggleShowGlobalFilter?: ({
|
|
662
|
+
event,
|
|
663
|
+
showGlobalFilter,
|
|
664
|
+
tableInstance,
|
|
665
|
+
}: {
|
|
666
|
+
event: MouseEvent<HTMLButtonElement>;
|
|
667
|
+
showGlobalFilter: boolean;
|
|
668
|
+
tableInstance: MRT_TableInstance<D>;
|
|
669
|
+
}) => void;
|
|
396
670
|
positionActionsColumn?: 'first' | 'last';
|
|
397
671
|
positionPagination?: 'bottom' | 'top' | 'both';
|
|
398
672
|
positionToolbarActions?: 'bottom' | 'top';
|
|
399
673
|
positionToolbarAlertBanner?: 'bottom' | 'top';
|
|
400
|
-
renderDetailPanel?: (
|
|
401
|
-
|
|
402
|
-
|
|
403
|
-
|
|
404
|
-
|
|
405
|
-
|
|
406
|
-
|
|
407
|
-
|
|
408
|
-
|
|
409
|
-
|
|
410
|
-
|
|
411
|
-
|
|
412
|
-
|
|
413
|
-
|
|
414
|
-
tableInstance: MRT_TableInstance<D
|
|
415
|
-
|
|
416
|
-
|
|
417
|
-
|
|
418
|
-
|
|
419
|
-
|
|
420
|
-
|
|
421
|
-
|
|
422
|
-
|
|
423
|
-
|
|
424
|
-
|
|
425
|
-
|
|
426
|
-
|
|
427
|
-
|
|
428
|
-
|
|
429
|
-
|
|
430
|
-
|
|
431
|
-
|
|
432
|
-
|
|
433
|
-
|
|
434
|
-
|
|
435
|
-
|
|
436
|
-
|
|
437
|
-
|
|
438
|
-
|
|
674
|
+
renderDetailPanel?: ({
|
|
675
|
+
row,
|
|
676
|
+
tableInstance,
|
|
677
|
+
}: {
|
|
678
|
+
row: MRT_Row<D>;
|
|
679
|
+
tableInstance: MRT_TableInstance<D>;
|
|
680
|
+
}) => ReactNode;
|
|
681
|
+
renderRowActionMenuItems?: ({
|
|
682
|
+
closeMenu,
|
|
683
|
+
row,
|
|
684
|
+
tableInstance,
|
|
685
|
+
}: {
|
|
686
|
+
closeMenu: () => void;
|
|
687
|
+
row: MRT_Row<D>;
|
|
688
|
+
tableInstance: MRT_TableInstance<D>;
|
|
689
|
+
}) => ReactNode[];
|
|
690
|
+
renderRowActions?: ({
|
|
691
|
+
row,
|
|
692
|
+
tableInstance,
|
|
693
|
+
}: {
|
|
694
|
+
row: MRT_Row<D>;
|
|
695
|
+
tableInstance: MRT_TableInstance<D>;
|
|
696
|
+
}) => ReactNode;
|
|
697
|
+
renderToolbarCustomActions?: ({
|
|
698
|
+
tableInstance,
|
|
699
|
+
}: {
|
|
700
|
+
tableInstance: MRT_TableInstance<D>;
|
|
701
|
+
}) => ReactNode;
|
|
702
|
+
renderToolbarInternalActions?: ({
|
|
703
|
+
tableInstance,
|
|
704
|
+
MRT_ToggleGlobalFilterButton,
|
|
705
|
+
MRT_ToggleFiltersButton,
|
|
706
|
+
MRT_ShowHideColumnsButton,
|
|
707
|
+
MRT_ToggleDensePaddingButton,
|
|
708
|
+
MRT_FullScreenToggleButton,
|
|
709
|
+
}: {
|
|
710
|
+
tableInstance: MRT_TableInstance<D>;
|
|
711
|
+
MRT_ToggleGlobalFilterButton: FC<
|
|
712
|
+
IconButtonProps & { tableInstance: MRT_TableInstance<D> }
|
|
713
|
+
>;
|
|
714
|
+
MRT_ToggleFiltersButton: FC<
|
|
715
|
+
IconButtonProps & { tableInstance: MRT_TableInstance<D> }
|
|
716
|
+
>;
|
|
717
|
+
MRT_ShowHideColumnsButton: FC<
|
|
718
|
+
IconButtonProps & { tableInstance: MRT_TableInstance<D> }
|
|
719
|
+
>;
|
|
720
|
+
MRT_ToggleDensePaddingButton: FC<
|
|
721
|
+
IconButtonProps & { tableInstance: MRT_TableInstance<D> }
|
|
722
|
+
>;
|
|
723
|
+
MRT_FullScreenToggleButton: FC<
|
|
724
|
+
IconButtonProps & { tableInstance: MRT_TableInstance<D> }
|
|
725
|
+
>;
|
|
726
|
+
}) => ReactNode;
|
|
439
727
|
};
|
|
440
728
|
|
|
441
729
|
export default <D extends Record<string, any> = {}>({
|
|
730
|
+
autoResetExpanded = false,
|
|
442
731
|
enableColumnActions = true,
|
|
443
732
|
enableColumnFilters = true,
|
|
444
733
|
enableDensePaddingToggle = true,
|
|
445
734
|
enableExpandAll = true,
|
|
735
|
+
enableFilters = true,
|
|
446
736
|
enableFullScreenToggle = true,
|
|
447
737
|
enableGlobalFilter = true,
|
|
448
738
|
enableHiding = true,
|
|
739
|
+
enableMultiRowSelection = true,
|
|
449
740
|
enablePagination = true,
|
|
450
741
|
enableSelectAll = true,
|
|
451
742
|
enableSorting = true,
|
|
452
743
|
enableStickyHeader = true,
|
|
453
|
-
filterTypes,
|
|
454
744
|
icons,
|
|
455
745
|
localization,
|
|
456
746
|
positionActionsColumn = 'first',
|
|
@@ -460,13 +750,16 @@ export default <D extends Record<string, any> = {}>({
|
|
|
460
750
|
...rest
|
|
461
751
|
}: MaterialReactTableProps<D>) => (
|
|
462
752
|
<MRT_TableRoot
|
|
753
|
+
autoResetExpanded={autoResetExpanded}
|
|
463
754
|
enableColumnActions={enableColumnActions}
|
|
464
755
|
enableColumnFilters={enableColumnFilters}
|
|
465
756
|
enableDensePaddingToggle={enableDensePaddingToggle}
|
|
466
757
|
enableExpandAll={enableExpandAll}
|
|
758
|
+
enableFilters={enableFilters}
|
|
467
759
|
enableFullScreenToggle={enableFullScreenToggle}
|
|
468
760
|
enableGlobalFilter={enableGlobalFilter}
|
|
469
761
|
enableHiding={enableHiding}
|
|
762
|
+
enableMultiRowSelection={enableMultiRowSelection}
|
|
470
763
|
enablePagination={enablePagination}
|
|
471
764
|
enableSelectAll={enableSelectAll}
|
|
472
765
|
enableSorting={enableSorting}
|