material-react-table 0.4.5 → 0.4.8

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.
Files changed (65) hide show
  1. package/README.md +3 -2
  2. package/dist/MaterialReactTable.d.ts +71 -25
  3. package/dist/body/MRT_TableBodyCell.d.ts +2 -2
  4. package/dist/body/MRT_TableBodyRow.d.ts +2 -2
  5. package/dist/body/MRT_TableDetailPanel.d.ts +2 -2
  6. package/dist/buttons/MRT_EditActionButtons.d.ts +2 -2
  7. package/dist/buttons/MRT_ExpandButton.d.ts +2 -2
  8. package/dist/buttons/MRT_ToggleColumnActionMenuButton.d.ts +2 -2
  9. package/dist/buttons/MRT_ToggleRowActionMenuButton.d.ts +2 -2
  10. package/dist/footer/MRT_TableFooterCell.d.ts +2 -2
  11. package/dist/footer/MRT_TableFooterRow.d.ts +2 -2
  12. package/dist/head/MRT_TableHeadCell.d.ts +2 -2
  13. package/dist/head/MRT_TableHeadRow.d.ts +2 -2
  14. package/dist/icons.d.ts +25 -0
  15. package/dist/inputs/MRT_EditCellTextField.d.ts +2 -2
  16. package/dist/inputs/MRT_FilterTextField.d.ts +2 -2
  17. package/dist/inputs/MRT_SelectCheckbox.d.ts +2 -2
  18. package/dist/{utils/localization.d.ts → localization.d.ts} +1 -1
  19. package/dist/material-react-table.cjs.development.js +197 -155
  20. package/dist/material-react-table.cjs.development.js.map +1 -1
  21. package/dist/material-react-table.cjs.production.min.js +1 -1
  22. package/dist/material-react-table.cjs.production.min.js.map +1 -1
  23. package/dist/material-react-table.esm.js +198 -156
  24. package/dist/material-react-table.esm.js.map +1 -1
  25. package/dist/menus/MRT_ColumnActionMenu.d.ts +2 -2
  26. package/dist/menus/MRT_RowActionMenu.d.ts +2 -2
  27. package/dist/menus/MRT_ShowHideColumnsMenu.d.ts +2 -2
  28. package/dist/useMRT.d.ts +10 -6
  29. package/package.json +1 -1
  30. package/src/@types/react-table-config.d.ts +18 -121
  31. package/src/MaterialReactTable.tsx +188 -25
  32. package/src/body/MRT_TableBody.tsx +2 -1
  33. package/src/body/MRT_TableBodyCell.tsx +2 -2
  34. package/src/body/MRT_TableBodyRow.tsx +11 -9
  35. package/src/body/MRT_TableDetailPanel.tsx +9 -16
  36. package/src/buttons/MRT_EditActionButtons.tsx +7 -8
  37. package/src/buttons/MRT_ExpandAllButton.tsx +17 -18
  38. package/src/buttons/MRT_ExpandButton.tsx +20 -21
  39. package/src/buttons/MRT_FullScreenToggleButton.tsx +9 -6
  40. package/src/buttons/MRT_ShowHideColumnsButton.tsx +11 -7
  41. package/src/buttons/MRT_ToggleColumnActionMenuButton.tsx +8 -6
  42. package/src/buttons/MRT_ToggleDensePaddingButton.tsx +8 -5
  43. package/src/buttons/MRT_ToggleFiltersButton.tsx +8 -5
  44. package/src/buttons/MRT_ToggleRowActionMenuButton.tsx +8 -9
  45. package/src/buttons/MRT_ToggleSearchButton.tsx +8 -5
  46. package/src/footer/MRT_TableFooter.tsx +2 -1
  47. package/src/footer/MRT_TableFooterCell.tsx +2 -2
  48. package/src/footer/MRT_TableFooterRow.tsx +3 -3
  49. package/src/head/MRT_TableHead.tsx +2 -1
  50. package/src/head/MRT_TableHeadCell.tsx +7 -7
  51. package/src/head/MRT_TableHeadCellActions.tsx +1 -1
  52. package/src/head/MRT_TableHeadRow.tsx +3 -3
  53. package/src/icons.tsx +72 -0
  54. package/src/index.tsx +2 -0
  55. package/src/inputs/MRT_EditCellTextField.tsx +2 -2
  56. package/src/inputs/MRT_FilterTextField.tsx +15 -15
  57. package/src/inputs/MRT_SearchTextField.tsx +4 -5
  58. package/src/inputs/MRT_SelectCheckbox.tsx +7 -7
  59. package/src/{utils/localization.ts → localization.ts} +1 -1
  60. package/src/menus/MRT_ColumnActionMenu.tsx +16 -14
  61. package/src/menus/MRT_RowActionMenu.tsx +4 -4
  62. package/src/menus/MRT_ShowHideColumnsMenu.tsx +3 -2
  63. package/src/table/MRT_TableContainer.tsx +19 -1
  64. package/src/toolbar/MRT_ToolbarAlertBanner.tsx +3 -3
  65. package/src/useMRT.tsx +24 -17
@@ -1,8 +1,8 @@
1
1
  import { FC } from 'react';
2
- import { HeaderGroup } from 'react-table';
2
+ import { MRT_HeaderGroup } from '..';
3
3
  interface Props {
4
4
  anchorEl: HTMLElement | null;
5
- column: HeaderGroup;
5
+ column: MRT_HeaderGroup;
6
6
  setAnchorEl: (anchorEl: HTMLElement | null) => void;
7
7
  }
8
8
  export declare const MRT_ColumnActionMenu: FC<Props>;
@@ -1,8 +1,8 @@
1
1
  import { FC } from 'react';
2
- import { Row } from 'react-table';
2
+ import { MRT_Row } from '..';
3
3
  interface Props {
4
4
  anchorEl: HTMLElement | null;
5
- row: Row;
5
+ row: MRT_Row;
6
6
  setAnchorEl: (anchorEl: HTMLElement | null) => void;
7
7
  handleEdit: () => void;
8
8
  }
@@ -1,7 +1,7 @@
1
1
  import { FC } from 'react';
2
- import { ColumnInstance } from 'react-table';
2
+ import { MRT_ColumnInstance } from '..';
3
3
  interface Props {
4
- column: ColumnInstance;
4
+ column: MRT_ColumnInstance;
5
5
  }
6
6
  export declare const MRT_ShowHideColumnsMenu: FC<Props>;
7
7
  export {};
package/dist/useMRT.d.ts CHANGED
@@ -1,20 +1,24 @@
1
1
  import React, { PropsWithChildren } from 'react';
2
- import { Row, TableInstance } from 'react-table';
2
+ import { MRT_Row, MRT_TableInstance } from '.';
3
+ import { MRT_Icons } from './icons';
4
+ import { MRT_Localization } from './localization';
3
5
  import { MaterialReactTableProps } from './MaterialReactTable';
4
- export interface UseMRT<D extends {} = {}> extends MaterialReactTableProps<D> {
6
+ export declare type UseMRT<D extends {} = {}> = MaterialReactTableProps<D> & {
5
7
  anyRowsCanExpand: boolean;
6
8
  anyRowsExpanded: boolean;
7
- currentEditingRow: Row<D> | null;
9
+ currentEditingRow: MRT_Row<D> | null;
8
10
  densePadding: boolean;
9
11
  fullScreen: boolean;
10
- setCurrentEditingRow: (currentRowEditingId: Row<D> | null) => void;
12
+ icons: MRT_Icons;
13
+ localization: MRT_Localization;
14
+ setCurrentEditingRow: (currentRowEditingId: MRT_Row<D> | null) => void;
11
15
  setDensePadding: (densePadding: boolean) => void;
12
16
  setFullScreen: (fullScreen: boolean) => void;
13
17
  setShowFilters: (showFilters: boolean) => void;
14
18
  setShowSearch: (showSearch: boolean) => void;
15
19
  showFilters: boolean;
16
20
  showSearch: boolean;
17
- tableInstance: TableInstance<D>;
18
- }
21
+ tableInstance: MRT_TableInstance<D>;
22
+ };
19
23
  export declare const MaterialReactTableProvider: <D extends {}>(props: React.PropsWithChildren<MaterialReactTableProps<D>>) => JSX.Element;
20
24
  export declare const useMRT: <D extends {}>() => UseMRT<D>;
package/package.json CHANGED
@@ -1,5 +1,5 @@
1
1
  {
2
- "version": "0.4.5",
2
+ "version": "0.4.8",
3
3
  "license": "MIT",
4
4
  "name": "material-react-table",
5
5
  "description": "A fully featured Material-UI implementation of react-table, inspired by material-table and the mui DataGrid, written from the ground up in TypeScript.",
@@ -1,102 +1,23 @@
1
- import { ChangeEvent, ReactNode } from 'react';
2
- import { TableCellProps, TextFieldProps } from '@mui/material';
3
1
  import {
4
- UseColumnOrderInstanceProps,
5
- UseColumnOrderState,
6
- UseExpandedHooks,
7
- UseExpandedInstanceProps,
8
- UseExpandedOptions,
9
- UseExpandedRowProps,
10
- UseExpandedState,
11
- UseFiltersColumnOptions,
12
- UseFiltersColumnProps,
13
- UseFiltersInstanceProps,
14
- UseFiltersOptions,
15
- UseFiltersState,
16
- UseGlobalFiltersColumnOptions,
17
- UseGlobalFiltersInstanceProps,
18
- UseGlobalFiltersOptions,
19
- UseGlobalFiltersState,
20
- UseGroupByCellProps,
21
- UseGroupByColumnOptions,
22
- UseGroupByColumnProps,
23
2
  UseGroupByHooks,
24
- UseGroupByInstanceProps,
25
- UseGroupByOptions,
26
- UseGroupByRowProps,
27
- UseGroupByState,
28
- UsePaginationInstanceProps,
29
- UsePaginationOptions,
30
- UsePaginationState,
31
- UseResizeColumnsColumnOptions,
32
- UseResizeColumnsColumnProps,
33
- UseResizeColumnsOptions,
34
- UseResizeColumnsState,
35
3
  UseRowSelectHooks,
36
- UseRowSelectInstanceProps,
37
- UseRowSelectOptions,
38
- UseRowSelectRowProps,
39
- UseRowSelectState,
40
- UseRowStateCellProps,
41
- UseRowStateInstanceProps,
42
- UseRowStateOptions,
43
- UseRowStateRowProps,
44
- UseRowStateState,
45
- UseSortByColumnOptions,
46
- UseSortByColumnProps,
47
4
  UseSortByHooks,
48
- UseSortByInstanceProps,
49
- UseSortByOptions,
50
- UseSortByState,
51
5
  } from 'react-table';
52
-
53
- export type MRT_ColumnInterface<D extends {} = {}> =
54
- UseFiltersColumnOptions<D> &
55
- UseGlobalFiltersColumnOptions<D> &
56
- UseGroupByColumnOptions<D> &
57
- UseResizeColumnsColumnOptions<D> &
58
- UseSortByColumnOptions<D> & {
59
- disableFilters?: boolean;
60
- Filter?: ({ column }: { column: HeaderGroup<D> }) => ReactNode;
61
- editable?: boolean;
62
- Edit?: ({ cell, onChange }: { cell: Cell<D> }) => ReactNode;
63
- muiTableBodyCellProps?:
64
- | TableCellProps
65
- | ((cell: Cell<D>) => TableCellProps);
66
- muiTableHeadCellProps?:
67
- | TableCellProps
68
- | ((column: Column<D>) => TableCellProps);
69
- muiTableFooterCellProps?:
70
- | TableCellProps
71
- | ((column: Column<D>) => TableCellProps);
72
- muiTableBodyCellEditTextFieldProps?:
73
- | TextFieldProps
74
- | ((cell: Cell<D>) => TextFieldProps);
75
- muiTableHeadCellFilterTextFieldProps?:
76
- | TextFieldProps
77
- | ((column: Column<D>) => TextFieldProps);
78
- onCellEditChange?: (
79
- event: ChangeEvent<HTMLInputElement>,
80
- cell: Cell<D>,
81
- ) => void;
82
- onFilterChange?: (
83
- event: ChangeEvent<HTMLInputElement>,
84
- filterValue: any,
85
- ) => void;
86
- };
6
+ import {
7
+ MRT_Cell,
8
+ MRT_ColumnInstance,
9
+ MRT_ColumnInterface,
10
+ MRT_Row,
11
+ MRT_TableInstance,
12
+ MRT_TableOptions,
13
+ MRT_TableState,
14
+ } from '..';
87
15
 
88
16
  declare module 'react-table' {
17
+ // take this file as-is, or comment out the sections that don't apply to your plugin configuration
18
+
89
19
  export interface TableOptions<D extends Record<string, unknown>>
90
- extends UseExpandedOptions<D>,
91
- UseFiltersOptions<D>,
92
- UseGlobalFiltersOptions<D>,
93
- UseGroupByOptions<D>,
94
- UsePaginationOptions<D>,
95
- UseResizeColumnsOptions<D>,
96
- UseRowSelectOptions<D>,
97
- UseRowStateOptions<D>,
98
- UseSortByOptions<D>,
99
- Record<string, any> {}
20
+ extends MRT_TableOptions<D> {}
100
21
 
101
22
  export interface Hooks<
102
23
  D extends Record<string, unknown> = Record<string, unknown>,
@@ -107,50 +28,26 @@ declare module 'react-table' {
107
28
 
108
29
  export interface TableInstance<
109
30
  D extends Record<string, unknown> = Record<string, unknown>,
110
- > extends UseColumnOrderInstanceProps<D>,
111
- UseExpandedInstanceProps<D>,
112
- UseFiltersInstanceProps<D>,
113
- UseGlobalFiltersInstanceProps<D>,
114
- UseGroupByInstanceProps<D>,
115
- UsePaginationInstanceProps<D>,
116
- UseRowSelectInstanceProps<D>,
117
- UseRowStateInstanceProps<D>,
118
- UseSortByInstanceProps<D> {}
31
+ > extends MRT_TableInstance<D> {}
119
32
 
120
33
  export interface TableState<
121
34
  D extends Record<string, unknown> = Record<string, unknown>,
122
- > extends UseColumnOrderState<D>,
123
- UseExpandedState<D>,
124
- UseFiltersState<D>,
125
- UseGlobalFiltersState<D>,
126
- UseGroupByState<D>,
127
- UsePaginationState<D>,
128
- UseResizeColumnsState<D>,
129
- UseRowSelectState<D>,
130
- UseRowStateState<D>,
131
- UseSortByState<D> {}
35
+ > extends MRT_TableState<D> {}
132
36
 
133
37
  export interface ColumnInterface<
134
38
  D extends Record<string, unknown> = Record<string, unknown>,
135
- > extends MRT_ColumnInterface {}
39
+ > extends MRT_ColumnInterface<D> {}
136
40
 
137
41
  export interface ColumnInstance<
138
42
  D extends Record<string, unknown> = Record<string, unknown>,
139
- > extends UseFiltersColumnProps<D>,
140
- UseGroupByColumnProps<D>,
141
- UseResizeColumnsColumnProps<D>,
142
- UseSortByColumnProps<D> {}
43
+ > extends MRT_ColumnInstance<D> {}
143
44
 
144
45
  export interface Cell<
145
46
  D extends Record<string, unknown> = Record<string, unknown>,
146
47
  V = any,
147
- > extends UseGroupByCellProps<D>,
148
- UseRowStateCellProps<D> {}
48
+ > extends MRT_Cell<D> {}
149
49
 
150
50
  export interface Row<
151
51
  D extends Record<string, unknown> = Record<string, unknown>,
152
- > extends UseExpandedRowProps<D>,
153
- UseGroupByRowProps<D>,
154
- UseRowSelectRowProps<D>,
155
- UseRowStateRowProps<D> {}
52
+ > extends MRT_Row<D> {}
156
53
  }
@@ -16,27 +16,185 @@ import {
16
16
  import {
17
17
  Cell,
18
18
  Column,
19
+ ColumnInstance,
20
+ // ColumnInterface,
19
21
  HeaderGroup,
20
22
  Row,
21
23
  TableInstance,
22
24
  TableOptions,
25
+ TableState,
26
+ UseColumnOrderInstanceProps,
27
+ UseColumnOrderState,
28
+ UseExpandedInstanceProps,
23
29
  UseExpandedOptions,
30
+ UseExpandedRowProps,
31
+ UseExpandedState,
32
+ UseFiltersColumnOptions,
33
+ UseFiltersColumnProps,
34
+ UseFiltersInstanceProps,
24
35
  UseFiltersOptions,
36
+ UseFiltersState,
37
+ UseGlobalFiltersColumnOptions,
38
+ UseGlobalFiltersInstanceProps,
25
39
  UseGlobalFiltersOptions,
40
+ UseGlobalFiltersState,
41
+ UseGroupByCellProps,
42
+ UseGroupByColumnOptions,
43
+ UseGroupByColumnProps,
44
+ UseGroupByInstanceProps,
26
45
  UseGroupByOptions,
46
+ UseGroupByRowProps,
47
+ UseGroupByState,
48
+ UsePaginationInstanceProps,
27
49
  UsePaginationOptions,
50
+ UsePaginationState,
51
+ UseResizeColumnsColumnOptions,
52
+ UseResizeColumnsColumnProps,
28
53
  UseResizeColumnsOptions,
54
+ UseResizeColumnsState,
55
+ UseRowSelectInstanceProps,
29
56
  UseRowSelectOptions,
57
+ UseRowSelectRowProps,
58
+ UseRowSelectState,
59
+ UseRowStateCellProps,
60
+ UseRowStateInstanceProps,
30
61
  UseRowStateOptions,
62
+ UseRowStateRowProps,
63
+ UseRowStateState,
64
+ UseSortByColumnOptions,
65
+ UseSortByColumnProps,
66
+ UseSortByInstanceProps,
31
67
  UseSortByOptions,
68
+ UseSortByState,
69
+ UseTableHeaderGroupProps,
70
+ UseTableInstanceProps,
32
71
  UseTableOptions,
33
72
  } from 'react-table';
34
73
  import { MaterialReactTableProvider } from './useMRT';
35
74
  import { MRT_TableContainer } from './table/MRT_TableContainer';
36
- import { defaultLocalization, MRT_Localization } from './utils/localization';
37
- import { MRT_ColumnInterface } from './@types/react-table-config';
75
+ import { MRT_Localization, MRT_DefaultLocalization_EN } from './localization';
76
+ import { MRT_Default_Icons, MRT_Icons } from './icons';
38
77
 
39
- export type MaterialReactTableProps<D extends {} = {}> = TableOptions<D> &
78
+ export type MRT_TableOptions<D extends {} = {}> = TableOptions<D> &
79
+ UseExpandedOptions<D> &
80
+ UseFiltersOptions<D> &
81
+ UseGlobalFiltersOptions<D> &
82
+ UseGroupByOptions<D> &
83
+ UsePaginationOptions<D> &
84
+ UseResizeColumnsOptions<D> &
85
+ UseRowSelectOptions<D> &
86
+ UseRowStateOptions<D> &
87
+ UseSortByOptions<D> & {};
88
+
89
+ export type MRT_TableInstance<D extends {} = {}> = TableInstance<D> &
90
+ UseTableInstanceProps<D> &
91
+ UseColumnOrderInstanceProps<D> &
92
+ UseExpandedInstanceProps<D> &
93
+ UseFiltersInstanceProps<D> &
94
+ UseGlobalFiltersInstanceProps<D> &
95
+ UseGroupByInstanceProps<D> &
96
+ UsePaginationInstanceProps<D> &
97
+ UseRowSelectInstanceProps<D> &
98
+ UseRowStateInstanceProps<D> &
99
+ UseSortByInstanceProps<D> & {
100
+ columns: (Column<D> & MRT_ColumnInstance<D>)[];
101
+ headerGroups: MRT_HeaderGroup<D>[];
102
+ footerGroups: MRT_HeaderGroup<D>[];
103
+ state: MRT_TableState<D>;
104
+ rows: MRT_Row<D>[];
105
+ page: MRT_Row<D>[];
106
+ resetResizing: () => void;
107
+ getToggleAllRowsExpandedProps: () => void;
108
+ };
109
+
110
+ export type MRT_ColumnInterface<D extends {} = {}> =
111
+ // ColumnInterface<D> &
112
+ UseFiltersColumnOptions<D> &
113
+ UseGlobalFiltersColumnOptions<D> &
114
+ UseGroupByColumnOptions<D> &
115
+ UseResizeColumnsColumnOptions<D> &
116
+ UseSortByColumnOptions<D> & {
117
+ Edit?: ({
118
+ cell,
119
+ onChange,
120
+ }: {
121
+ cell: MRT_Cell<D>;
122
+ onChange?: (event: ChangeEvent<HTMLInputElement>) => void;
123
+ }) => ReactNode;
124
+ Filter?: ({ column }: { column: MRT_HeaderGroup<D> }) => ReactNode;
125
+ Footer?: string;
126
+ Header?: string;
127
+ disableFilters?: boolean;
128
+ editable?: boolean;
129
+ muiTableBodyCellEditTextFieldProps?:
130
+ | TextFieldProps
131
+ | ((cell: MRT_Cell<D>) => TextFieldProps);
132
+ muiTableBodyCellProps?:
133
+ | TableCellProps
134
+ | ((cell: MRT_Cell<D>) => TableCellProps);
135
+ muiTableFooterCellProps?:
136
+ | TableCellProps
137
+ | ((column: Column<D>) => TableCellProps);
138
+ muiTableHeadCellFilterTextFieldProps?:
139
+ | TextFieldProps
140
+ | ((column: Column<D>) => TextFieldProps);
141
+ muiTableHeadCellProps?:
142
+ | TableCellProps
143
+ | ((column: Column<D>) => TableCellProps);
144
+ onCellEditChange?: (
145
+ event: ChangeEvent<HTMLInputElement>,
146
+ cell: MRT_Cell<D>,
147
+ ) => void;
148
+ onFilterChange?: (
149
+ event: ChangeEvent<HTMLInputElement>,
150
+ filterValue: any,
151
+ ) => void;
152
+ };
153
+
154
+ export type MRT_ColumnInstance<D extends {} = {}> = ColumnInstance<D> &
155
+ UseFiltersColumnProps<D> &
156
+ UseGroupByColumnProps<D> &
157
+ UseResizeColumnsColumnProps<D> &
158
+ UseSortByColumnProps<D> & {
159
+ columns?: MRT_ColumnInstance<D>[];
160
+ };
161
+
162
+ export type MRT_HeaderGroup<D extends {} = {}> = HeaderGroup<D> &
163
+ MRT_ColumnInstance<D> &
164
+ UseTableHeaderGroupProps<D> & {
165
+ headers: MRT_HeaderGroup<D>[];
166
+ };
167
+
168
+ export type MRT_Row<D extends {} = {}> = Row<D> &
169
+ UseExpandedRowProps<D> &
170
+ UseGroupByRowProps<D> &
171
+ UseRowSelectRowProps<D> &
172
+ UseRowStateRowProps<D> & {
173
+ cells: MRT_Cell<D>[];
174
+ };
175
+
176
+ export type MRT_Cell<D extends {} = {}, _V = any> = Cell<D> &
177
+ UseGroupByCellProps<D> &
178
+ UseRowStateCellProps<D> & {};
179
+
180
+ export type MRT_TableState<D extends {} = {}> = TableState<D> &
181
+ UseColumnOrderState<D> &
182
+ UseExpandedState<D> &
183
+ UseFiltersState<D> &
184
+ UseGlobalFiltersState<D> &
185
+ UseGroupByState<D> &
186
+ UsePaginationState<D> &
187
+ UseResizeColumnsState<D> &
188
+ UseRowSelectState<D> &
189
+ UseRowStateState<D> &
190
+ UseSortByState<D> & {
191
+ densePadding?: boolean;
192
+ fullScreen?: boolean;
193
+ showFilters?: boolean;
194
+ showSearchTextField?: boolean;
195
+ };
196
+
197
+ export type MaterialReactTableProps<D extends {} = {}> = MRT_TableOptions<D> &
40
198
  UseTableOptions<D> &
41
199
  UseExpandedOptions<D> &
42
200
  UseFiltersOptions<D> &
@@ -48,10 +206,7 @@ export type MaterialReactTableProps<D extends {} = {}> = TableOptions<D> &
48
206
  UseRowStateOptions<D> &
49
207
  UseSortByOptions<D> & {
50
208
  columns: (Column<D> & MRT_ColumnInterface)[];
51
- defaultDensePadding?: boolean;
52
- defaultFullScreen?: boolean;
53
- defaultShowFilters?: boolean;
54
- defaultShowSearchTextField?: boolean;
209
+ data: D[];
55
210
  disableColumnActions?: boolean;
56
211
  disableColumnHiding?: boolean;
57
212
  disableDensePaddingToggle?: boolean;
@@ -59,32 +214,34 @@ export type MaterialReactTableProps<D extends {} = {}> = TableOptions<D> &
59
214
  disableFullScreenToggle?: boolean;
60
215
  disableSelectAll?: boolean;
61
216
  disableSubRowTree?: boolean;
62
- enableRowNumbers?: boolean;
63
217
  enableColumnGrouping?: boolean;
64
218
  enableColumnResizing?: boolean;
65
219
  enableRowActions?: boolean;
66
220
  enableRowEditing?: boolean;
221
+ enableRowNumbers?: boolean;
67
222
  enableSelection?: boolean;
68
223
  hideTableFooter?: boolean;
69
224
  hideTableHead?: boolean;
70
- hideToolbarInternalActions?: boolean;
71
225
  hideToolbarBottom?: boolean;
226
+ hideToolbarInternalActions?: boolean;
72
227
  hideToolbarTop?: boolean;
228
+ icons?: Partial<MRT_Icons>;
229
+ initialState?: Partial<MRT_TableState>;
73
230
  isFetching?: boolean;
74
231
  isLoading?: boolean;
75
232
  localization?: Partial<MRT_Localization>;
76
233
  muiSearchTextFieldProps?: TextFieldProps;
77
234
  muiTableBodyCellEditTextFieldProps?:
78
235
  | TextFieldProps
79
- | ((cell?: Cell<D>) => TextFieldProps);
236
+ | ((cell?: MRT_Cell<D>) => TextFieldProps);
80
237
  muiTableBodyCellProps?:
81
238
  | TableCellProps
82
- | ((cell?: Cell<D>) => TableCellProps);
239
+ | ((cell?: MRT_Cell<D>) => TableCellProps);
83
240
  muiTableBodyProps?: TableBodyProps;
84
241
  muiTableBodyRowProps?: TableRowProps | ((row: Row<D>) => TableRowProps);
85
242
  muiTableContainerProps?:
86
243
  | TableContainerProps
87
- | ((table: TableInstance<D>) => TableContainerProps);
244
+ | ((table: MRT_TableInstance<D>) => TableContainerProps);
88
245
  muiTableDetailPanelProps?:
89
246
  | TableCellProps
90
247
  | ((row: Row<D>) => TableCellProps);
@@ -94,7 +251,7 @@ export type MaterialReactTableProps<D extends {} = {}> = TableOptions<D> &
94
251
  muiTableFooterProps?: TableFooterProps;
95
252
  muiTableFooterRowProps?:
96
253
  | TableRowProps
97
- | ((footerGroup: HeaderGroup<D>) => TableRowProps);
254
+ | ((footerGroup: MRT_HeaderGroup<D>) => TableRowProps);
98
255
  muiTableHeadCellFilterTextFieldProps?:
99
256
  | TextFieldProps
100
257
  | ((column: Column<D>) => TextFieldProps);
@@ -104,23 +261,25 @@ export type MaterialReactTableProps<D extends {} = {}> = TableOptions<D> &
104
261
  muiTableHeadProps?: TableHeadProps;
105
262
  muiTableHeadRowProps?:
106
263
  | TableRowProps
107
- | ((row: HeaderGroup<D>) => TableRowProps);
264
+ | ((row: MRT_HeaderGroup<D>) => TableRowProps);
108
265
  muiTablePaginationProps?:
109
266
  | Partial<TablePaginationProps>
110
- | ((tableInstance: TableInstance<D>) => Partial<TablePaginationProps>);
267
+ | ((
268
+ tableInstance: MRT_TableInstance<D>,
269
+ ) => Partial<TablePaginationProps>);
111
270
  muiTableProps?: TableProps;
112
271
  muiTableToolbarAlertBannerProps?:
113
272
  | AlertProps
114
- | ((tableInstance: TableInstance<D>) => AlertProps);
273
+ | ((tableInstance: MRT_TableInstance<D>) => AlertProps);
115
274
  muiTableToolbarBottomProps?:
116
275
  | ToolbarProps
117
- | ((tableInstance: TableInstance<D>) => ToolbarProps);
276
+ | ((tableInstance: MRT_TableInstance<D>) => ToolbarProps);
118
277
  muiTableToolbarTopProps?:
119
278
  | ToolbarProps
120
- | ((tableInstance: TableInstance<D>) => ToolbarProps);
279
+ | ((tableInstance: MRT_TableInstance<D>) => ToolbarProps);
121
280
  onCellClick?: (
122
281
  event: MouseEvent<HTMLTableCellElement>,
123
- cell: Cell<D>,
282
+ cell: MRT_Cell<D>,
124
283
  ) => void;
125
284
  onColumnHide?: (column: Column<D>, visibleColumns: Column<D>[]) => void;
126
285
  onDetailPanelClick?: (
@@ -147,16 +306,18 @@ export type MaterialReactTableProps<D extends {} = {}> = TableOptions<D> &
147
306
  renderDetailPanel?: (row: Row<D>) => ReactNode;
148
307
  renderRowActionMenuItems?: (
149
308
  rowData: Row<D>,
150
- tableInstance: TableInstance<D>,
309
+ tableInstance: MRT_TableInstance<D>,
151
310
  closeMenu: () => void,
152
311
  ) => ReactNode[];
153
312
  renderRowActions?: (
154
313
  row: Row<D>,
155
- tableInstance: TableInstance<D>,
314
+ tableInstance: MRT_TableInstance<D>,
315
+ ) => ReactNode;
316
+ renderToolbarCustomActions?: (
317
+ tableInstance: MRT_TableInstance<D>,
156
318
  ) => ReactNode;
157
- renderToolbarCustomActions?: (tableInstance: TableInstance<D>) => ReactNode;
158
319
  renderToolbarInternalActions?: (
159
- tableInstance: TableInstance<D>,
320
+ tableInstance: MRT_TableInstance<D>,
160
321
  {
161
322
  MRT_ToggleSearchButton,
162
323
  MRT_ToggleFiltersButton,
@@ -175,7 +336,8 @@ export type MaterialReactTableProps<D extends {} = {}> = TableOptions<D> &
175
336
 
176
337
  export default <D extends {}>({
177
338
  defaultColumn = { minWidth: 50, maxWidth: 1000 },
178
- localization = defaultLocalization,
339
+ icons,
340
+ localization,
179
341
  positionActionsColumn = 'first',
180
342
  positionPagination = 'bottom',
181
343
  positionToolbarActions = 'top',
@@ -184,7 +346,8 @@ export default <D extends {}>({
184
346
  }: MaterialReactTableProps<D>) => (
185
347
  <MaterialReactTableProvider
186
348
  defaultColumn={defaultColumn}
187
- localization={{ ...defaultLocalization, ...localization }}
349
+ icons={{ ...MRT_Default_Icons, ...icons }}
350
+ localization={{ ...MRT_DefaultLocalization_EN, ...localization }}
188
351
  positionActionsColumn={positionActionsColumn}
189
352
  positionPagination={positionPagination}
190
353
  positionToolbarActions={positionToolbarActions}
@@ -2,6 +2,7 @@ import React, { FC } from 'react';
2
2
  import { styled, TableBody as MuiTableBody } from '@mui/material';
3
3
  import { MRT_TableBodyRow } from './MRT_TableBodyRow';
4
4
  import { useMRT } from '../useMRT';
5
+ import { MRT_Row } from '..';
5
6
 
6
7
  const TableBody = styled(MuiTableBody)({
7
8
  overflowY: 'hidden',
@@ -25,7 +26,7 @@ export const MRT_TableBody: FC<Props> = () => {
25
26
 
26
27
  return (
27
28
  <TableBody {...tableBodyProps}>
28
- {rows.map((row) => {
29
+ {rows.map((row: MRT_Row) => {
29
30
  tableInstance.prepareRow(row);
30
31
  return <MRT_TableBodyRow key={row.getRowProps().key} row={row} />;
31
32
  })}
@@ -1,8 +1,8 @@
1
1
  import React, { FC, MouseEvent } from 'react';
2
2
  import { styled, TableCell as MuiTableCell } from '@mui/material';
3
- import { Cell } from 'react-table';
4
3
  import { useMRT } from '../useMRT';
5
4
  import { MRT_EditCellTextField } from '../inputs/MRT_EditCellTextField';
5
+ import { MRT_Cell } from '..';
6
6
 
7
7
  export const MRT_StyledTableBodyCell = styled(MuiTableCell, {
8
8
  shouldForwardProp: (prop) => prop !== 'densePadding',
@@ -13,7 +13,7 @@ export const MRT_StyledTableBodyCell = styled(MuiTableCell, {
13
13
  }));
14
14
 
15
15
  interface Props {
16
- cell: Cell;
16
+ cell: MRT_Cell;
17
17
  }
18
18
 
19
19
  export const MRT_TableBodyCell: FC<Props> = ({ cell }) => {
@@ -1,6 +1,5 @@
1
1
  import React, { FC, MouseEvent } from 'react';
2
2
  import { alpha, styled, TableRow as MuiTableRow } from '@mui/material';
3
- import { Row } from 'react-table';
4
3
  import {
5
4
  MRT_StyledTableBodyCell,
6
5
  MRT_TableBodyCell,
@@ -10,6 +9,7 @@ import { MRT_TableDetailPanel } from './MRT_TableDetailPanel';
10
9
  import { MRT_ExpandButton } from '../buttons/MRT_ExpandButton';
11
10
  import { MRT_SelectCheckbox } from '../inputs/MRT_SelectCheckbox';
12
11
  import { MRT_ToggleRowActionMenuButton } from '../buttons/MRT_ToggleRowActionMenuButton';
12
+ import { MRT_Cell, MRT_Row } from '..';
13
13
 
14
14
  export const TableRow = styled(MuiTableRow, {
15
15
  shouldForwardProp: (prop) => prop !== 'isSelected',
@@ -20,7 +20,7 @@ export const TableRow = styled(MuiTableRow, {
20
20
  }));
21
21
 
22
22
  interface Props {
23
- row: Row;
23
+ row: MRT_Row;
24
24
  }
25
25
 
26
26
  export const MRT_TableBodyRow: FC<Props> = ({ row }) => {
@@ -63,19 +63,21 @@ export const MRT_TableBodyRow: FC<Props> = ({ row }) => {
63
63
  {enableRowNumbers && (
64
64
  <MRT_StyledTableBodyCell>{row.index + 1}</MRT_StyledTableBodyCell>
65
65
  )}
66
- {(enableRowActions || enableRowEditing) && positionActionsColumn === 'first' && (
67
- <MRT_ToggleRowActionMenuButton row={row} />
68
- )}
66
+ {(enableRowActions || enableRowEditing) &&
67
+ positionActionsColumn === 'first' && (
68
+ <MRT_ToggleRowActionMenuButton row={row} />
69
+ )}
69
70
  {(anyRowsCanExpand || renderDetailPanel) && (
70
71
  <MRT_ExpandButton row={row} />
71
72
  )}
72
73
  {enableSelection && <MRT_SelectCheckbox row={row} />}
73
- {row.cells.map((cell) => (
74
+ {row.cells.map((cell: MRT_Cell) => (
74
75
  <MRT_TableBodyCell key={cell.getCellProps().key} cell={cell} />
75
76
  ))}
76
- {(enableRowActions || enableRowEditing) && positionActionsColumn === 'last' && (
77
- <MRT_ToggleRowActionMenuButton row={row} />
78
- )}
77
+ {(enableRowActions || enableRowEditing) &&
78
+ positionActionsColumn === 'last' && (
79
+ <MRT_ToggleRowActionMenuButton row={row} />
80
+ )}
79
81
  </TableRow>
80
82
  {renderDetailPanel && <MRT_TableDetailPanel row={row} />}
81
83
  </>