material-react-table 0.17.1 → 0.19.0-alpha.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/MaterialReactTable.d.ts +170 -230
- package/dist/body/MRT_TableBody.d.ts +1 -1
- package/dist/body/MRT_TableBodyCell.d.ts +1 -1
- package/dist/body/MRT_TableBodyRow.d.ts +1 -1
- package/dist/body/MRT_TableDetailPanel.d.ts +1 -1
- package/dist/buttons/MRT_ColumnPinningButtons.d.ts +1 -1
- package/dist/buttons/MRT_CopyButton.d.ts +1 -1
- package/dist/buttons/MRT_EditActionButtons.d.ts +1 -1
- package/dist/buttons/MRT_ExpandAllButton.d.ts +1 -1
- package/dist/buttons/MRT_ExpandButton.d.ts +1 -1
- package/dist/buttons/MRT_FullScreenToggleButton.d.ts +1 -1
- package/dist/buttons/MRT_GrabHandleButton.d.ts +1 -1
- package/dist/buttons/MRT_ShowHideColumnsButton.d.ts +1 -1
- package/dist/buttons/MRT_ToggleDensePaddingButton.d.ts +1 -1
- package/dist/buttons/MRT_ToggleFiltersButton.d.ts +1 -1
- package/dist/buttons/MRT_ToggleGlobalFilterButton.d.ts +1 -1
- package/dist/buttons/MRT_ToggleRowActionMenuButton.d.ts +1 -1
- package/dist/filtersFns.d.ts +31 -23
- package/dist/footer/MRT_TableFooter.d.ts +1 -1
- package/dist/footer/MRT_TableFooterCell.d.ts +1 -1
- package/dist/footer/MRT_TableFooterRow.d.ts +1 -1
- package/dist/head/MRT_DraggableTableHeadCell.d.ts +1 -1
- package/dist/head/MRT_TableHead.d.ts +1 -1
- package/dist/head/MRT_TableHeadCell.d.ts +1 -1
- package/dist/head/MRT_TableHeadCellColumnActionsButton.d.ts +1 -1
- package/dist/head/MRT_TableHeadCellFilterContainer.d.ts +1 -1
- package/dist/head/MRT_TableHeadCellFilterLabel.d.ts +1 -1
- package/dist/head/MRT_TableHeadCellResizeHandle.d.ts +1 -1
- package/dist/head/MRT_TableHeadCellSortLabel.d.ts +1 -1
- package/dist/head/MRT_TableHeadRow.d.ts +1 -1
- package/dist/inputs/MRT_EditCellTextField.d.ts +1 -1
- package/dist/inputs/MRT_FilterRangeFields.d.ts +1 -1
- package/dist/inputs/MRT_FilterTextField.d.ts +1 -1
- package/dist/inputs/MRT_GlobalFilterTextField.d.ts +1 -1
- package/dist/inputs/MRT_SelectCheckbox.d.ts +1 -1
- package/dist/material-react-table.cjs.development.js +791 -915
- 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 +793 -917
- package/dist/material-react-table.esm.js.map +1 -1
- package/dist/menus/MRT_ColumnActionMenu.d.ts +1 -1
- package/dist/menus/MRT_FilterOptionMenu.d.ts +1 -1
- package/dist/menus/MRT_RowActionMenu.d.ts +1 -1
- package/dist/menus/MRT_ShowHideColumnsMenu.d.ts +1 -1
- package/dist/menus/MRT_ShowHideColumnsMenuItems.d.ts +1 -1
- package/dist/sortingFns.d.ts +10 -3
- package/dist/table/MRT_Table.d.ts +1 -1
- package/dist/table/MRT_TableContainer.d.ts +1 -1
- package/dist/table/MRT_TablePaper.d.ts +1 -1
- package/dist/toolbar/MRT_LinearProgressBar.d.ts +1 -1
- package/dist/toolbar/MRT_TablePagination.d.ts +1 -1
- package/dist/toolbar/MRT_ToolbarAlertBanner.d.ts +1 -1
- package/dist/toolbar/MRT_ToolbarBottom.d.ts +1 -1
- package/dist/toolbar/MRT_ToolbarInternalButtons.d.ts +1 -1
- package/dist/toolbar/MRT_ToolbarTop.d.ts +1 -1
- package/dist/utils.d.ts +10 -16
- package/package.json +4 -4
- package/src/MaterialReactTable.tsx +168 -334
- package/src/body/MRT_TableBody.tsx +5 -6
- package/src/body/MRT_TableBodyCell.tsx +19 -36
- package/src/body/MRT_TableBodyRow.tsx +9 -12
- package/src/body/MRT_TableDetailPanel.tsx +8 -12
- package/src/buttons/MRT_ColumnPinningButtons.tsx +3 -3
- package/src/buttons/MRT_CopyButton.tsx +5 -7
- package/src/buttons/MRT_EditActionButtons.tsx +4 -5
- package/src/buttons/MRT_ExpandAllButton.tsx +4 -5
- package/src/buttons/MRT_ExpandButton.tsx +6 -9
- package/src/buttons/MRT_FullScreenToggleButton.tsx +5 -15
- package/src/buttons/MRT_GrabHandleButton.tsx +39 -41
- package/src/buttons/MRT_ShowHideColumnsButton.tsx +4 -4
- package/src/buttons/MRT_ToggleDensePaddingButton.tsx +5 -15
- package/src/buttons/MRT_ToggleFiltersButton.tsx +5 -12
- package/src/buttons/MRT_ToggleGlobalFilterButton.tsx +6 -16
- package/src/buttons/MRT_ToggleRowActionMenuButton.tsx +6 -6
- package/src/filtersFns.ts +24 -23
- package/src/footer/MRT_TableFooter.tsx +5 -6
- package/src/footer/MRT_TableFooterCell.tsx +8 -11
- package/src/footer/MRT_TableFooterRow.tsx +5 -9
- package/src/head/MRT_DraggableTableHeadCell.tsx +4 -6
- package/src/head/MRT_TableHead.tsx +5 -5
- package/src/head/MRT_TableHeadCell.tsx +18 -29
- package/src/head/MRT_TableHeadCellColumnActionsButton.tsx +6 -8
- package/src/head/MRT_TableHeadCellFilterContainer.tsx +5 -7
- package/src/head/MRT_TableHeadCellFilterLabel.tsx +13 -19
- package/src/head/MRT_TableHeadCellResizeHandle.tsx +12 -11
- package/src/head/MRT_TableHeadCellSortLabel.tsx +3 -5
- package/src/head/MRT_TableHeadRow.tsx +6 -6
- package/src/inputs/MRT_EditCellTextField.tsx +13 -15
- package/src/inputs/MRT_FilterRangeFields.tsx +4 -4
- package/src/inputs/MRT_FilterTextField.tsx +27 -64
- package/src/inputs/MRT_GlobalFilterTextField.tsx +5 -10
- package/src/inputs/MRT_SelectCheckbox.tsx +9 -36
- package/src/menus/MRT_ColumnActionMenu.tsx +5 -9
- package/src/menus/MRT_FilterOptionMenu.tsx +16 -48
- package/src/menus/MRT_RowActionMenu.tsx +4 -5
- package/src/menus/MRT_ShowHideColumnsMenu.tsx +8 -9
- package/src/menus/MRT_ShowHideColumnsMenuItems.tsx +11 -10
- package/src/sortingFns.ts +11 -3
- package/src/table/MRT_Table.tsx +7 -11
- package/src/table/MRT_TableContainer.tsx +5 -6
- package/src/table/MRT_TablePaper.tsx +7 -8
- package/src/table/MRT_TableRoot.tsx +123 -156
- package/src/toolbar/MRT_LinearProgressBar.tsx +4 -5
- package/src/toolbar/MRT_TablePagination.tsx +7 -9
- package/src/toolbar/MRT_ToolbarAlertBanner.tsx +15 -11
- package/src/toolbar/MRT_ToolbarBottom.tsx +8 -9
- package/src/toolbar/MRT_ToolbarInternalButtons.tsx +10 -10
- package/src/toolbar/MRT_ToolbarTop.tsx +11 -11
- package/src/utils.ts +56 -50
|
@@ -1,10 +1,12 @@
|
|
|
1
|
-
import { ChangeEvent, Dispatch, FC, FocusEvent,
|
|
1
|
+
import { ChangeEvent, Dispatch, FC, FocusEvent, ReactNode, SetStateAction } from 'react';
|
|
2
2
|
import { AlertProps, ButtonProps, CheckboxProps, IconButtonProps, LinearProgressProps, PaperProps, SkeletonProps, TableBodyProps, TableCellProps, TableContainerProps, TableFooterProps, TableHeadProps, TablePaginationProps, TableProps, TableRowProps, TextFieldProps, ToolbarProps } from '@mui/material';
|
|
3
|
-
import { Cell, Column, ColumnDef,
|
|
3
|
+
import { Cell, Column, ColumnDef, FilterFn, Header, HeaderGroup, OnChangeFn, Row, SortingFn, Table, TableOptions, TableState } from '@tanstack/react-table';
|
|
4
4
|
import { Options as VirtualizerOptions } from 'react-virtual';
|
|
5
5
|
import { MRT_Localization } from './localization';
|
|
6
6
|
import { MRT_Icons } from './icons';
|
|
7
|
-
|
|
7
|
+
import { MRT_FilterFns } from './filtersFns';
|
|
8
|
+
import { MRT_SortingFns } from './sortingFns';
|
|
9
|
+
export declare type MRT_TableOptions<D extends Record<string, any> = {}> = Partial<Omit<TableOptions<D>, 'columns' | 'data' | 'initialState' | 'state' | 'expandRowsFn'>> & {
|
|
8
10
|
columns: MRT_ColumnDef<D>[];
|
|
9
11
|
data: D[];
|
|
10
12
|
expandRowsFn?: (dataRow: D) => D[];
|
|
@@ -18,9 +20,7 @@ export interface MRT_RowModel<D extends Record<string, any> = {}> {
|
|
|
18
20
|
[key: string]: MRT_Row<D>;
|
|
19
21
|
};
|
|
20
22
|
}
|
|
21
|
-
export declare type MRT_TableInstance<D extends Record<string, any> = {}> = Omit<
|
|
22
|
-
Row: D;
|
|
23
|
-
}>>, 'getAllColumns' | 'getAllFlatColumns' | 'getAllLeafColumns' | 'getCenterLeafColumns' | 'getColumn' | 'getExpandedRowModel' | 'getFlatHeaders' | 'getLeftLeafColumns' | 'getPaginationRowModel' | 'getPreFilteredRowModel' | 'getPrePaginationRowModel' | 'getRightLeafColumns' | 'getRowModel' | 'getSelectedRowModel' | 'getState' | 'options'> & {
|
|
23
|
+
export declare type MRT_TableInstance<D extends Record<string, any> = {}> = Omit<Table<D>, 'getAllColumns' | 'getAllFlatColumns' | 'getAllLeafColumns' | 'getCenterLeafColumns' | 'getColumn' | 'getExpandedRowModel' | 'getFlatHeaders' | 'getLeftLeafColumns' | 'getPaginationRowModel' | 'getPreFilteredRowModel' | 'getPrePaginationRowModel' | 'getRightLeafColumns' | 'getRowModel' | 'getSelectedRowModel' | 'getState' | 'options'> & {
|
|
24
24
|
getAllColumns: () => MRT_Column<D>[];
|
|
25
25
|
getAllFlatColumns: () => MRT_Column<D>[];
|
|
26
26
|
getAllLeafColumns: () => MRT_Column<D>[];
|
|
@@ -44,125 +44,148 @@ export declare type MRT_TableInstance<D extends Record<string, any> = {}> = Omit
|
|
|
44
44
|
setCurrentEditingCell: Dispatch<SetStateAction<MRT_Cell | null>>;
|
|
45
45
|
setCurrentEditingRow: Dispatch<SetStateAction<MRT_Row | null>>;
|
|
46
46
|
setCurrentFilterFns: Dispatch<SetStateAction<{
|
|
47
|
-
[key: string]:
|
|
47
|
+
[key: string]: MRT_FilterOption;
|
|
48
48
|
}>>;
|
|
49
|
-
setCurrentGlobalFilterFn: Dispatch<SetStateAction<
|
|
49
|
+
setCurrentGlobalFilterFn: Dispatch<SetStateAction<MRT_FilterOption>>;
|
|
50
50
|
setDensity: Dispatch<SetStateAction<'comfortable' | 'compact' | 'spacious'>>;
|
|
51
51
|
setIsFullScreen: Dispatch<SetStateAction<boolean>>;
|
|
52
|
+
setShowAlertBanner: Dispatch<SetStateAction<boolean>>;
|
|
52
53
|
setShowFilters: Dispatch<SetStateAction<boolean>>;
|
|
53
54
|
setShowGlobalFilter: Dispatch<SetStateAction<boolean>>;
|
|
54
55
|
};
|
|
55
56
|
export declare type MRT_TableState<D extends Record<string, any> = {}> = TableState & {
|
|
56
57
|
currentEditingCell: MRT_Cell<D> | null;
|
|
57
58
|
currentEditingRow: MRT_Row<D> | null;
|
|
58
|
-
currentFilterFns: Record<string,
|
|
59
|
-
currentGlobalFilterFn: Record<string,
|
|
59
|
+
currentFilterFns: Record<string, MRT_FilterOption>;
|
|
60
|
+
currentGlobalFilterFn: Record<string, MRT_FilterOption>;
|
|
60
61
|
density: 'comfortable' | 'compact' | 'spacious';
|
|
61
62
|
isLoading: boolean;
|
|
62
63
|
isFullScreen: boolean;
|
|
64
|
+
showAlertBanner: boolean;
|
|
63
65
|
showFilters: boolean;
|
|
64
66
|
showGlobalFilter: boolean;
|
|
65
67
|
showProgressBars: boolean;
|
|
66
68
|
showSkeletons: boolean;
|
|
67
69
|
};
|
|
68
|
-
export declare type MRT_ColumnDef<D extends Record<string, any> = {}> = Omit<ColumnDef<D>, 'accessorFn' | 'aggregatedCell' | 'cell' | 'columns' | 'filterFn' | 'footer' | 'header' | 'sortingFn'> & {
|
|
69
|
-
AggregatedCell?: ({ cell,
|
|
70
|
+
export declare type MRT_ColumnDef<D extends Record<string, any> = {}> = Omit<ColumnDef<D>, 'accessorFn' | 'accessorKey' | 'aggregatedCell' | 'cell' | 'columns' | 'filterFn' | 'footer' | 'header' | 'id' | 'sortingFn'> & {
|
|
71
|
+
AggregatedCell?: ({ cell, table, }: {
|
|
70
72
|
cell: MRT_Cell<D>;
|
|
71
|
-
|
|
73
|
+
table: MRT_TableInstance<D>;
|
|
72
74
|
}) => ReactNode;
|
|
73
|
-
Cell?: ({ cell,
|
|
75
|
+
Cell?: ({ cell, table, }: {
|
|
74
76
|
cell: MRT_Cell<D>;
|
|
75
|
-
|
|
77
|
+
table: MRT_TableInstance<D>;
|
|
76
78
|
}) => ReactNode;
|
|
77
|
-
Edit?: ({ cell,
|
|
79
|
+
Edit?: ({ cell, table, }: {
|
|
78
80
|
cell: MRT_Cell<D>;
|
|
79
|
-
|
|
81
|
+
table: MRT_TableInstance<D>;
|
|
80
82
|
}) => ReactNode;
|
|
81
|
-
Filter?: ({ header,
|
|
83
|
+
Filter?: ({ header, table, }: {
|
|
82
84
|
header: MRT_Header<D>;
|
|
83
|
-
|
|
85
|
+
table: MRT_TableInstance<D>;
|
|
84
86
|
}) => ReactNode;
|
|
85
|
-
Footer?: ReactNode | (({ footer,
|
|
87
|
+
Footer?: ReactNode | (({ footer, table, }: {
|
|
86
88
|
footer: MRT_Header<D>;
|
|
87
|
-
|
|
89
|
+
table: MRT_TableInstance<D>;
|
|
88
90
|
}) => ReactNode);
|
|
89
|
-
Header?: ReactNode | (({ header,
|
|
91
|
+
Header?: ReactNode | (({ header, table, }: {
|
|
90
92
|
header: MRT_Header<D>;
|
|
91
|
-
|
|
93
|
+
table: MRT_TableInstance<D>;
|
|
92
94
|
}) => ReactNode);
|
|
95
|
+
/**
|
|
96
|
+
* Either an `accessorKey` or a combination of an `accessorFn` and `id` are required for a data column definition.
|
|
97
|
+
* Specify a function here to point to the correct property in the data object.
|
|
98
|
+
*
|
|
99
|
+
* @example accessorFn: (row) => row.username
|
|
100
|
+
*/
|
|
93
101
|
accessorFn?: (row: D) => any;
|
|
102
|
+
/**
|
|
103
|
+
* Either an `accessorKey` or a combination of an `accessorFn` and `id` are required for a data column definition.
|
|
104
|
+
* Specify which key in the row this column should use to access the correct data.
|
|
105
|
+
*
|
|
106
|
+
* @example accessorKey: 'username'
|
|
107
|
+
*/
|
|
108
|
+
accessorKey?: keyof D;
|
|
109
|
+
/**
|
|
110
|
+
* Specify what type of column this is. Either `data`, `display`, or `group`. Defaults to `data`.
|
|
111
|
+
* Leave this blank if you are just creating a normal data column.
|
|
112
|
+
*
|
|
113
|
+
* @default 'data'
|
|
114
|
+
*
|
|
115
|
+
* @example columnDefType: 'display'
|
|
116
|
+
*/
|
|
117
|
+
columnDefType?: 'data' | 'display' | 'group';
|
|
94
118
|
columns?: MRT_ColumnDef<D>[];
|
|
95
119
|
enableClickToCopy?: boolean;
|
|
96
120
|
enableColumnActions?: boolean;
|
|
97
121
|
enableColumnFilterChangeMode?: boolean;
|
|
98
122
|
enableColumnOrdering?: boolean;
|
|
99
123
|
enableEditing?: boolean;
|
|
100
|
-
enabledColumnFilterOptions?:
|
|
101
|
-
filterFn?: MRT_FilterFn
|
|
124
|
+
enabledColumnFilterOptions?: MRT_FilterOption[] | null;
|
|
125
|
+
filterFn?: MRT_FilterFn<D>;
|
|
102
126
|
filterSelectOptions?: (string | {
|
|
103
127
|
text: string;
|
|
104
128
|
value: string;
|
|
105
129
|
})[];
|
|
106
130
|
footer?: string;
|
|
107
131
|
header: string;
|
|
108
|
-
|
|
109
|
-
|
|
110
|
-
|
|
132
|
+
/**
|
|
133
|
+
* Either an `accessorKey` or a combination of an `accessorFn` and `id` are required for a data column definition.
|
|
134
|
+
* If you have also specified an `accessorFn`, MRT still needs to have a valid `id` to be able to identify the column uniquely.
|
|
135
|
+
* `id` defaults to the `accessorKey` or `header` if not specified.
|
|
136
|
+
*
|
|
137
|
+
* @default gets set to the same value as `accessorKey` by default
|
|
138
|
+
*/
|
|
139
|
+
id?: string;
|
|
140
|
+
muiTableBodyCellCopyButtonProps?: ButtonProps | (({ table, cell, }: {
|
|
141
|
+
table: MRT_TableInstance<D>;
|
|
111
142
|
cell: MRT_Cell<D>;
|
|
112
143
|
}) => ButtonProps);
|
|
113
|
-
muiTableBodyCellEditTextFieldProps?: TextFieldProps | (({
|
|
114
|
-
|
|
144
|
+
muiTableBodyCellEditTextFieldProps?: TextFieldProps | (({ table, cell, }: {
|
|
145
|
+
table: MRT_TableInstance<D>;
|
|
115
146
|
cell: MRT_Cell<D>;
|
|
116
147
|
}) => TextFieldProps);
|
|
117
|
-
muiTableBodyCellProps?: TableCellProps | (({
|
|
118
|
-
|
|
148
|
+
muiTableBodyCellProps?: TableCellProps | (({ table, cell, }: {
|
|
149
|
+
table: MRT_TableInstance<D>;
|
|
119
150
|
cell: MRT_Cell<D>;
|
|
120
151
|
}) => TableCellProps);
|
|
121
|
-
muiTableFooterCellProps?: TableCellProps | (({
|
|
122
|
-
|
|
152
|
+
muiTableFooterCellProps?: TableCellProps | (({ table, column, }: {
|
|
153
|
+
table: MRT_TableInstance<D>;
|
|
123
154
|
column: MRT_Column<D>;
|
|
124
155
|
}) => TableCellProps);
|
|
125
|
-
muiTableHeadCellColumnActionsButtonProps?: IconButtonProps | (({
|
|
126
|
-
|
|
156
|
+
muiTableHeadCellColumnActionsButtonProps?: IconButtonProps | (({ table, column, }: {
|
|
157
|
+
table: MRT_TableInstance<D>;
|
|
127
158
|
column: MRT_Column<D>;
|
|
128
159
|
}) => IconButtonProps);
|
|
129
|
-
muiTableHeadCellFilterTextFieldProps?: TextFieldProps | (({
|
|
130
|
-
|
|
160
|
+
muiTableHeadCellFilterTextFieldProps?: TextFieldProps | (({ table, column, }: {
|
|
161
|
+
table: MRT_TableInstance<D>;
|
|
131
162
|
column: MRT_Column<D>;
|
|
132
163
|
}) => TextFieldProps);
|
|
133
|
-
muiTableHeadCellProps?: TableCellProps | (({
|
|
134
|
-
|
|
164
|
+
muiTableHeadCellProps?: TableCellProps | (({ table, column, }: {
|
|
165
|
+
table: MRT_TableInstance<D>;
|
|
135
166
|
column: MRT_Column<D>;
|
|
136
167
|
}) => TableCellProps);
|
|
137
|
-
onCellEditBlur?: ({ cell, event,
|
|
168
|
+
onCellEditBlur?: ({ cell, event, table, }: {
|
|
138
169
|
event: FocusEvent<HTMLInputElement>;
|
|
139
170
|
cell: MRT_Cell<D>;
|
|
140
|
-
|
|
171
|
+
table: MRT_TableInstance<D>;
|
|
141
172
|
}) => void;
|
|
142
|
-
|
|
173
|
+
onCellEditChange?: ({ cell, event, table, }: {
|
|
143
174
|
event: ChangeEvent<HTMLInputElement>;
|
|
144
175
|
cell: MRT_Cell<D>;
|
|
145
|
-
|
|
146
|
-
}) => void;
|
|
147
|
-
onColumnFilterValueChanged?: ({ column, event, filterValue, instance, }: {
|
|
148
|
-
column: MRT_Column<D>;
|
|
149
|
-
event: ChangeEvent<HTMLInputElement>;
|
|
150
|
-
filterValue: any;
|
|
151
|
-
instance: MRT_TableInstance<D>;
|
|
152
|
-
}) => void;
|
|
153
|
-
onColumnFilterValueChangedDebounced?: ({ column, event, filterValue, instance, }: {
|
|
154
|
-
column: MRT_Column<D>;
|
|
155
|
-
event: ChangeEvent<HTMLInputElement>;
|
|
156
|
-
filterValue: any;
|
|
157
|
-
instance: MRT_TableInstance<D>;
|
|
176
|
+
table: MRT_TableInstance<D>;
|
|
158
177
|
}) => void;
|
|
159
178
|
sortingFn?: MRT_SortingFn;
|
|
160
179
|
};
|
|
161
|
-
export declare type
|
|
180
|
+
export declare type MRT_DefinedColumnDef<D extends Record<string, any> = {}> = Omit<MRT_ColumnDef<D>, 'id'> & {
|
|
181
|
+
id: string;
|
|
182
|
+
};
|
|
183
|
+
export declare type MRT_Column<D extends Record<string, any> = {}> = Omit<Column<D>, 'header' | 'footer' | 'columns' | 'columnDef' | 'filterFn'> & {
|
|
184
|
+
columnDef: MRT_DefinedColumnDef<D>;
|
|
162
185
|
columns?: MRT_Column<D>[];
|
|
163
|
-
|
|
164
|
-
header: string;
|
|
186
|
+
filterFn?: MRT_FilterFn<D>;
|
|
165
187
|
footer: string;
|
|
188
|
+
header: string;
|
|
166
189
|
};
|
|
167
190
|
export declare type MRT_Header<D extends Record<string, any> = {}> = Omit<Header<D>, 'column'> & {
|
|
168
191
|
column: MRT_Column<D>;
|
|
@@ -181,10 +204,10 @@ export declare type MRT_Cell<D extends Record<string, any> = {}> = Omit<Cell<D>,
|
|
|
181
204
|
column: MRT_Column<D>;
|
|
182
205
|
row: MRT_Row<D>;
|
|
183
206
|
};
|
|
184
|
-
export declare type MRT_SortingOption =
|
|
185
|
-
export declare type MRT_SortingFn = SortingFn<
|
|
186
|
-
export declare type
|
|
187
|
-
export declare type MRT_FilterFn = FilterFn<
|
|
207
|
+
export declare type MRT_SortingOption = keyof typeof MRT_SortingFns;
|
|
208
|
+
export declare type MRT_SortingFn<D extends Record<string, any> = {}> = SortingFn<D> | MRT_SortingOption;
|
|
209
|
+
export declare type MRT_FilterOption = keyof typeof MRT_FilterFns;
|
|
210
|
+
export declare type MRT_FilterFn<D extends Record<string, any> = {}> = FilterFn<D> | MRT_FilterOption;
|
|
188
211
|
export declare type MaterialReactTableProps<D extends Record<string, any> = {}> = MRT_TableOptions<D> & {
|
|
189
212
|
editingMode?: 'table' | 'row' | 'cell';
|
|
190
213
|
enableClickToCopy?: boolean;
|
|
@@ -208,255 +231,172 @@ export declare type MaterialReactTableProps<D extends Record<string, any> = {}>
|
|
|
208
231
|
enableToolbarBottom?: boolean;
|
|
209
232
|
enableToolbarInternalActions?: boolean;
|
|
210
233
|
enableToolbarTop?: boolean;
|
|
211
|
-
enabledColumnFilterOptions?: (
|
|
212
|
-
enabledGlobalFilterOptions?: (
|
|
234
|
+
enabledColumnFilterOptions?: (MRT_FilterOption | string)[] | null;
|
|
235
|
+
enabledGlobalFilterOptions?: (MRT_FilterOption | string)[] | null;
|
|
213
236
|
icons?: Partial<MRT_Icons>;
|
|
214
237
|
localization?: Partial<MRT_Localization>;
|
|
215
|
-
muiExpandAllButtonProps?: IconButtonProps | (({
|
|
216
|
-
|
|
238
|
+
muiExpandAllButtonProps?: IconButtonProps | (({ table }: {
|
|
239
|
+
table: MRT_TableInstance<D>;
|
|
217
240
|
}) => IconButtonProps);
|
|
218
|
-
muiExpandButtonProps?: IconButtonProps | (({
|
|
219
|
-
|
|
241
|
+
muiExpandButtonProps?: IconButtonProps | (({ table, }: {
|
|
242
|
+
table: MRT_TableInstance<D>;
|
|
220
243
|
row: MRT_Row<D>;
|
|
221
244
|
}) => IconButtonProps);
|
|
222
|
-
muiLinearProgressProps?: LinearProgressProps | (({
|
|
223
|
-
|
|
245
|
+
muiLinearProgressProps?: LinearProgressProps | (({ table }: {
|
|
246
|
+
table: MRT_TableInstance<D>;
|
|
224
247
|
}) => LinearProgressProps);
|
|
225
|
-
muiSearchTextFieldProps?: TextFieldProps | (({
|
|
226
|
-
|
|
248
|
+
muiSearchTextFieldProps?: TextFieldProps | (({ table }: {
|
|
249
|
+
table: MRT_TableInstance<D>;
|
|
227
250
|
}) => TextFieldProps);
|
|
228
|
-
muiSelectAllCheckboxProps?: CheckboxProps | (({
|
|
229
|
-
|
|
251
|
+
muiSelectAllCheckboxProps?: CheckboxProps | (({ table }: {
|
|
252
|
+
table: MRT_TableInstance<D>;
|
|
230
253
|
}) => CheckboxProps);
|
|
231
|
-
muiSelectCheckboxProps?: CheckboxProps | (({
|
|
232
|
-
|
|
254
|
+
muiSelectCheckboxProps?: CheckboxProps | (({ table, row, }: {
|
|
255
|
+
table: MRT_TableInstance<D>;
|
|
233
256
|
row: MRT_Row<D>;
|
|
234
257
|
}) => CheckboxProps);
|
|
235
|
-
muiTableBodyCellCopyButtonProps?: ButtonProps | (({
|
|
236
|
-
|
|
258
|
+
muiTableBodyCellCopyButtonProps?: ButtonProps | (({ table, cell, }: {
|
|
259
|
+
table: MRT_TableInstance<D>;
|
|
237
260
|
cell: MRT_Cell<D>;
|
|
238
261
|
}) => ButtonProps);
|
|
239
|
-
muiTableBodyCellEditTextFieldProps?: TextFieldProps | (({
|
|
240
|
-
|
|
262
|
+
muiTableBodyCellEditTextFieldProps?: TextFieldProps | (({ table, cell, }: {
|
|
263
|
+
table: MRT_TableInstance<D>;
|
|
241
264
|
cell: MRT_Cell<D>;
|
|
242
265
|
}) => TextFieldProps);
|
|
243
|
-
muiTableBodyCellProps?: TableCellProps | (({
|
|
244
|
-
|
|
266
|
+
muiTableBodyCellProps?: TableCellProps | (({ table, cell, }: {
|
|
267
|
+
table: MRT_TableInstance<D>;
|
|
245
268
|
cell: MRT_Cell<D>;
|
|
246
269
|
}) => TableCellProps);
|
|
247
|
-
muiTableBodyCellSkeletonProps?: SkeletonProps | (({
|
|
248
|
-
|
|
270
|
+
muiTableBodyCellSkeletonProps?: SkeletonProps | (({ table, cell, }: {
|
|
271
|
+
table: MRT_TableInstance<D>;
|
|
249
272
|
cell: MRT_Cell<D>;
|
|
250
273
|
}) => SkeletonProps);
|
|
251
|
-
muiTableBodyProps?: TableBodyProps | (({
|
|
252
|
-
|
|
274
|
+
muiTableBodyProps?: TableBodyProps | (({ table }: {
|
|
275
|
+
table: MRT_TableInstance<D>;
|
|
253
276
|
}) => TableBodyProps);
|
|
254
|
-
muiTableBodyRowProps?: TableRowProps | (({
|
|
255
|
-
|
|
277
|
+
muiTableBodyRowProps?: TableRowProps | (({ table, row, }: {
|
|
278
|
+
table: MRT_TableInstance<D>;
|
|
256
279
|
row: MRT_Row<D>;
|
|
257
280
|
}) => TableRowProps);
|
|
258
|
-
muiTableContainerProps?: TableContainerProps | (({
|
|
259
|
-
|
|
281
|
+
muiTableContainerProps?: TableContainerProps | (({ table }: {
|
|
282
|
+
table: MRT_TableInstance<D>;
|
|
260
283
|
}) => TableContainerProps);
|
|
261
|
-
muiTableDetailPanelProps?: TableCellProps | (({
|
|
262
|
-
|
|
284
|
+
muiTableDetailPanelProps?: TableCellProps | (({ table, row, }: {
|
|
285
|
+
table: MRT_TableInstance<D>;
|
|
263
286
|
row: MRT_Row<D>;
|
|
264
287
|
}) => TableCellProps);
|
|
265
|
-
muiTableFooterCellProps?: TableCellProps | (({
|
|
266
|
-
|
|
288
|
+
muiTableFooterCellProps?: TableCellProps | (({ table, column, }: {
|
|
289
|
+
table: MRT_TableInstance<D>;
|
|
267
290
|
column: MRT_Column<D>;
|
|
268
291
|
}) => TableCellProps);
|
|
269
|
-
muiTableFooterProps?: TableFooterProps | (({
|
|
270
|
-
|
|
292
|
+
muiTableFooterProps?: TableFooterProps | (({ table }: {
|
|
293
|
+
table: MRT_TableInstance<D>;
|
|
271
294
|
}) => TableFooterProps);
|
|
272
|
-
muiTableFooterRowProps?: TableRowProps | (({
|
|
273
|
-
|
|
295
|
+
muiTableFooterRowProps?: TableRowProps | (({ table, footerGroup, }: {
|
|
296
|
+
table: MRT_TableInstance<D>;
|
|
274
297
|
footerGroup: MRT_HeaderGroup<D>;
|
|
275
298
|
}) => TableRowProps);
|
|
276
|
-
muiTableHeadCellColumnActionsButtonProps?: IconButtonProps | (({
|
|
277
|
-
|
|
299
|
+
muiTableHeadCellColumnActionsButtonProps?: IconButtonProps | (({ table, column, }: {
|
|
300
|
+
table: MRT_TableInstance<D>;
|
|
278
301
|
column: MRT_Column<D>;
|
|
279
302
|
}) => IconButtonProps);
|
|
280
|
-
muiTableHeadCellFilterTextFieldProps?: TextFieldProps | (({
|
|
281
|
-
|
|
303
|
+
muiTableHeadCellFilterTextFieldProps?: TextFieldProps | (({ table, column, }: {
|
|
304
|
+
table: MRT_TableInstance<D>;
|
|
282
305
|
column: MRT_Column<D>;
|
|
283
306
|
}) => TextFieldProps);
|
|
284
|
-
muiTableHeadCellProps?: TableCellProps | (({
|
|
285
|
-
|
|
307
|
+
muiTableHeadCellProps?: TableCellProps | (({ table, column, }: {
|
|
308
|
+
table: MRT_TableInstance<D>;
|
|
286
309
|
column: MRT_Column<D>;
|
|
287
310
|
}) => TableCellProps);
|
|
288
|
-
muiTableHeadProps?: TableHeadProps | (({
|
|
289
|
-
|
|
311
|
+
muiTableHeadProps?: TableHeadProps | (({ table }: {
|
|
312
|
+
table: MRT_TableInstance<D>;
|
|
290
313
|
}) => TableHeadProps);
|
|
291
|
-
muiTableHeadRowProps?: TableRowProps | (({
|
|
292
|
-
|
|
314
|
+
muiTableHeadRowProps?: TableRowProps | (({ table, headerGroup, }: {
|
|
315
|
+
table: MRT_TableInstance<D>;
|
|
293
316
|
headerGroup: MRT_HeaderGroup<D>;
|
|
294
317
|
}) => TableRowProps);
|
|
295
|
-
muiTablePaginationProps?: Partial<TablePaginationProps> | (({
|
|
296
|
-
|
|
318
|
+
muiTablePaginationProps?: Partial<TablePaginationProps> | (({ table, }: {
|
|
319
|
+
table: MRT_TableInstance<D>;
|
|
297
320
|
}) => Partial<TablePaginationProps>);
|
|
298
|
-
muiTablePaperProps?: PaperProps | (({
|
|
299
|
-
|
|
321
|
+
muiTablePaperProps?: PaperProps | (({ table }: {
|
|
322
|
+
table: MRT_TableInstance<D>;
|
|
300
323
|
}) => PaperProps);
|
|
301
|
-
muiTableProps?: TableProps | (({
|
|
302
|
-
|
|
324
|
+
muiTableProps?: TableProps | (({ table }: {
|
|
325
|
+
table: MRT_TableInstance<D>;
|
|
303
326
|
}) => TableProps);
|
|
304
|
-
muiTableToolbarAlertBannerProps?: AlertProps | (({
|
|
305
|
-
|
|
327
|
+
muiTableToolbarAlertBannerProps?: AlertProps | (({ table }: {
|
|
328
|
+
table: MRT_TableInstance<D>;
|
|
306
329
|
}) => AlertProps);
|
|
307
|
-
muiTableToolbarBottomProps?: ToolbarProps | (({
|
|
308
|
-
|
|
330
|
+
muiTableToolbarBottomProps?: ToolbarProps | (({ table }: {
|
|
331
|
+
table: MRT_TableInstance<D>;
|
|
309
332
|
}) => ToolbarProps);
|
|
310
|
-
muiTableToolbarTopProps?: ToolbarProps | (({
|
|
311
|
-
|
|
333
|
+
muiTableToolbarTopProps?: ToolbarProps | (({ table }: {
|
|
334
|
+
table: MRT_TableInstance<D>;
|
|
312
335
|
}) => ToolbarProps);
|
|
313
|
-
|
|
314
|
-
cell: MRT_Cell<D>;
|
|
315
|
-
instance: MRT_TableInstance<D>;
|
|
316
|
-
event: MouseEvent<HTMLTableCellElement>;
|
|
317
|
-
}) => void;
|
|
318
|
-
onCellEditBlur?: ({ cell, event, instance, }: {
|
|
336
|
+
onCellEditBlur?: ({ cell, event, table, }: {
|
|
319
337
|
event: FocusEvent<HTMLInputElement>;
|
|
320
338
|
cell: MRT_Cell<D>;
|
|
321
|
-
|
|
339
|
+
table: MRT_TableInstance<D>;
|
|
322
340
|
}) => void;
|
|
323
|
-
|
|
341
|
+
onCellEditChange?: ({ cell, event, table, }: {
|
|
324
342
|
event: ChangeEvent<HTMLInputElement>;
|
|
325
343
|
cell: MRT_Cell<D>;
|
|
326
|
-
|
|
327
|
-
}) => void;
|
|
328
|
-
onColumnFilterValueChanged?: ({ column, event, filterValue, instance, }: {
|
|
329
|
-
column: MRT_Column<D>;
|
|
330
|
-
event: ChangeEvent<HTMLInputElement>;
|
|
331
|
-
filterValue: any;
|
|
332
|
-
instance: MRT_TableInstance<D>;
|
|
333
|
-
}) => void;
|
|
334
|
-
onColumnFilterValueChangedDebounced?: ({ column, event, filterValue, instance, }: {
|
|
335
|
-
column: MRT_Column<D>;
|
|
336
|
-
event: ChangeEvent<HTMLInputElement>;
|
|
337
|
-
filterValue: any;
|
|
338
|
-
instance: MRT_TableInstance<D>;
|
|
339
|
-
}) => void;
|
|
340
|
-
onColumnOrderChanged?: ({ columnOrder, instance, }: {
|
|
341
|
-
columnOrder: ColumnOrderState;
|
|
342
|
-
instance: MRT_TableInstance<D>;
|
|
343
|
-
}) => void;
|
|
344
|
-
onColumnPinningChanged?: ({ columnPinning, instance, }: {
|
|
345
|
-
columnPinning: ColumnPinningState;
|
|
346
|
-
instance: MRT_TableInstance<D>;
|
|
347
|
-
}) => void;
|
|
348
|
-
onColumnVisibilityChanged?: ({ column, columnVisibility, instance, }: {
|
|
349
|
-
column: MRT_Column<D>;
|
|
350
|
-
columnVisibility: VisibilityState;
|
|
351
|
-
instance: MRT_TableInstance<D>;
|
|
344
|
+
table: MRT_TableInstance<D>;
|
|
352
345
|
}) => void;
|
|
353
346
|
onCurrentEditingCellChange?: OnChangeFn<MRT_Cell>;
|
|
354
347
|
onCurrentEditingRowChange?: OnChangeFn<MRT_Row>;
|
|
355
348
|
onCurrentFilterFnsChange?: OnChangeFn<{
|
|
356
|
-
[key: string]:
|
|
349
|
+
[key: string]: MRT_FilterOption;
|
|
357
350
|
}>;
|
|
358
|
-
onCurrentGlobalFilterFnChange?: OnChangeFn<
|
|
359
|
-
|
|
360
|
-
event: MouseEvent<HTMLTableCellElement>;
|
|
351
|
+
onCurrentGlobalFilterFnChange?: OnChangeFn<MRT_FilterOption>;
|
|
352
|
+
onEditRowSubmit?: ({ row, table, }: {
|
|
361
353
|
row: MRT_Row<D>;
|
|
362
|
-
|
|
363
|
-
}) => void;
|
|
364
|
-
onEditRowSubmit?: ({ row, instance, }: {
|
|
365
|
-
row: MRT_Row<D>;
|
|
366
|
-
instance: MRT_TableInstance<D>;
|
|
354
|
+
table: MRT_TableInstance<D>;
|
|
367
355
|
}) => Promise<void> | void;
|
|
368
|
-
onExpandChanged?: ({ event, row, }: {
|
|
369
|
-
event: MouseEvent<HTMLButtonElement>;
|
|
370
|
-
row: MRT_Row<D>;
|
|
371
|
-
instance: MRT_TableInstance<D>;
|
|
372
|
-
}) => void;
|
|
373
|
-
onGlobalFilterValueChanged?: ({ event, instance, }: {
|
|
374
|
-
event: ChangeEvent<HTMLInputElement>;
|
|
375
|
-
instance: MRT_TableInstance<D>;
|
|
376
|
-
}) => void;
|
|
377
|
-
onGlobalFilterValueChangedDebounced?: ({ event, instance, }: {
|
|
378
|
-
event: ChangeEvent<HTMLInputElement>;
|
|
379
|
-
instance: MRT_TableInstance<D>;
|
|
380
|
-
}) => void;
|
|
381
356
|
onDensityChange?: OnChangeFn<boolean>;
|
|
382
|
-
onDensityChanged?: ({ event, density, instance, }: {
|
|
383
|
-
event: MouseEvent<HTMLButtonElement>;
|
|
384
|
-
density: 'comfortable' | 'compact' | 'spacious';
|
|
385
|
-
instance: MRT_TableInstance<D>;
|
|
386
|
-
}) => void;
|
|
387
357
|
onIsFullScreenChange?: OnChangeFn<boolean>;
|
|
388
|
-
|
|
389
|
-
event: MouseEvent<HTMLButtonElement>;
|
|
390
|
-
isFullScreen: boolean;
|
|
391
|
-
instance: MRT_TableInstance<D>;
|
|
392
|
-
}) => void;
|
|
393
|
-
onRowClick?: ({ event, row, instance, }: {
|
|
394
|
-
event: MouseEvent<HTMLTableRowElement>;
|
|
395
|
-
row: MRT_Row<D>;
|
|
396
|
-
instance: MRT_TableInstance<D>;
|
|
397
|
-
}) => void;
|
|
398
|
-
onRowSelectAllChanged?: ({ event, selectedRows, instance, }: {
|
|
399
|
-
event: ChangeEvent;
|
|
400
|
-
selectedRows: MRT_Row<D>[];
|
|
401
|
-
instance: MRT_TableInstance<D>;
|
|
402
|
-
}) => void;
|
|
403
|
-
onRowSelectionChanged?: ({ event, row, selectedRows, instance, }: {
|
|
404
|
-
event: ChangeEvent;
|
|
405
|
-
row: MRT_Row<D>;
|
|
406
|
-
selectedRows: MRT_Row<D>[];
|
|
407
|
-
instance: MRT_TableInstance<D>;
|
|
408
|
-
}) => void;
|
|
358
|
+
onShowAlertBannerChange?: OnChangeFn<boolean>;
|
|
409
359
|
onShowFiltersChange?: OnChangeFn<boolean>;
|
|
410
|
-
onShowFiltersChanged?: ({ event, instance, showFilters, }: {
|
|
411
|
-
event: MouseEvent<HTMLButtonElement>;
|
|
412
|
-
instance: MRT_TableInstance<D>;
|
|
413
|
-
showFilters: boolean;
|
|
414
|
-
}) => void;
|
|
415
360
|
onShowGlobalFilterChange?: OnChangeFn<boolean>;
|
|
416
|
-
onShowGlobalFilterChanged?: ({ event, instance, showGlobalFilter, }: {
|
|
417
|
-
event: MouseEvent<HTMLButtonElement>;
|
|
418
|
-
instance: MRT_TableInstance<D>;
|
|
419
|
-
showGlobalFilter: boolean;
|
|
420
|
-
}) => void;
|
|
421
361
|
positionActionsColumn?: 'first' | 'last';
|
|
422
362
|
positionGlobalFilter?: 'left' | 'right';
|
|
423
363
|
positionPagination?: 'bottom' | 'top' | 'both';
|
|
424
364
|
positionToolbarAlertBanner?: 'bottom' | 'top';
|
|
425
|
-
renderDetailPanel?: ({ row,
|
|
365
|
+
renderDetailPanel?: ({ row, table, }: {
|
|
426
366
|
row: MRT_Row<D>;
|
|
427
|
-
|
|
367
|
+
table: MRT_TableInstance<D>;
|
|
428
368
|
}) => ReactNode;
|
|
429
|
-
renderRowActionMenuItems?: ({ closeMenu, row,
|
|
369
|
+
renderRowActionMenuItems?: ({ closeMenu, row, table, }: {
|
|
430
370
|
closeMenu: () => void;
|
|
431
371
|
row: MRT_Row<D>;
|
|
432
|
-
|
|
372
|
+
table: MRT_TableInstance<D>;
|
|
433
373
|
}) => ReactNode[];
|
|
434
|
-
renderRowActions?: ({ row,
|
|
374
|
+
renderRowActions?: ({ row, table, }: {
|
|
435
375
|
row: MRT_Row<D>;
|
|
436
|
-
|
|
376
|
+
table: MRT_TableInstance<D>;
|
|
437
377
|
}) => ReactNode;
|
|
438
|
-
renderToolbarBottomCustomActions?: ({
|
|
439
|
-
|
|
378
|
+
renderToolbarBottomCustomActions?: ({ table, }: {
|
|
379
|
+
table: MRT_TableInstance<D>;
|
|
440
380
|
}) => ReactNode;
|
|
441
|
-
renderToolbarTopCustomActions?: ({
|
|
442
|
-
|
|
381
|
+
renderToolbarTopCustomActions?: ({ table, }: {
|
|
382
|
+
table: MRT_TableInstance<D>;
|
|
443
383
|
}) => ReactNode;
|
|
444
|
-
renderToolbarInternalActions?: ({
|
|
445
|
-
|
|
384
|
+
renderToolbarInternalActions?: ({ table, MRT_ToggleGlobalFilterButton, MRT_ToggleFiltersButton, MRT_ShowHideColumnsButton, MRT_ToggleDensePaddingButton, MRT_FullScreenToggleButton, }: {
|
|
385
|
+
table: MRT_TableInstance<D>;
|
|
446
386
|
MRT_ToggleGlobalFilterButton: FC<IconButtonProps & {
|
|
447
|
-
|
|
387
|
+
table: MRT_TableInstance<D>;
|
|
448
388
|
}>;
|
|
449
389
|
MRT_ToggleFiltersButton: FC<IconButtonProps & {
|
|
450
|
-
|
|
390
|
+
table: MRT_TableInstance<D>;
|
|
451
391
|
}>;
|
|
452
392
|
MRT_ShowHideColumnsButton: FC<IconButtonProps & {
|
|
453
|
-
|
|
393
|
+
table: MRT_TableInstance<D>;
|
|
454
394
|
}>;
|
|
455
395
|
MRT_ToggleDensePaddingButton: FC<IconButtonProps & {
|
|
456
|
-
|
|
396
|
+
table: MRT_TableInstance<D>;
|
|
457
397
|
}>;
|
|
458
398
|
MRT_FullScreenToggleButton: FC<IconButtonProps & {
|
|
459
|
-
|
|
399
|
+
table: MRT_TableInstance<D>;
|
|
460
400
|
}>;
|
|
461
401
|
}) => ReactNode;
|
|
462
402
|
rowCount?: number;
|