material-react-table 0.6.10 → 0.7.0-alpha.11

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 (104) hide show
  1. package/README.md +29 -21
  2. package/dist/MaterialReactTable.d.ts +311 -110
  3. package/dist/body/MRT_TableBody.d.ts +3 -0
  4. package/dist/body/MRT_TableBodyCell.d.ts +2 -11
  5. package/dist/body/MRT_TableBodyRow.d.ts +3 -1
  6. package/dist/body/MRT_TableDetailPanel.d.ts +2 -1
  7. package/dist/buttons/MRT_CopyButton.d.ts +2 -1
  8. package/dist/buttons/MRT_EditActionButtons.d.ts +2 -1
  9. package/dist/buttons/MRT_ExpandAllButton.d.ts +2 -0
  10. package/dist/buttons/MRT_ExpandButton.d.ts +2 -1
  11. package/dist/buttons/MRT_FullScreenToggleButton.d.ts +2 -0
  12. package/dist/buttons/MRT_ShowHideColumnsButton.d.ts +2 -0
  13. package/dist/buttons/MRT_ToggleColumnActionMenuButton.d.ts +3 -2
  14. package/dist/buttons/MRT_ToggleDensePaddingButton.d.ts +2 -0
  15. package/dist/buttons/MRT_ToggleFiltersButton.d.ts +2 -0
  16. package/dist/buttons/MRT_ToggleRowActionMenuButton.d.ts +2 -1
  17. package/dist/buttons/MRT_ToggleSearchButton.d.ts +2 -0
  18. package/dist/footer/MRT_TableFooter.d.ts +3 -0
  19. package/dist/footer/MRT_TableFooterCell.d.ts +3 -2
  20. package/dist/footer/MRT_TableFooterRow.d.ts +2 -1
  21. package/dist/head/MRT_TableHead.d.ts +3 -0
  22. package/dist/head/MRT_TableHeadCell.d.ts +4 -18
  23. package/dist/head/MRT_TableHeadRow.d.ts +2 -1
  24. package/dist/icons.d.ts +1 -1
  25. package/dist/inputs/MRT_EditCellTextField.d.ts +2 -1
  26. package/dist/inputs/MRT_FilterTextField.d.ts +3 -2
  27. package/dist/inputs/MRT_SearchTextField.d.ts +2 -0
  28. package/dist/inputs/MRT_SelectCheckbox.d.ts +2 -1
  29. package/dist/localization.d.ts +8 -2
  30. package/dist/material-react-table.cjs.development.js +2253 -2482
  31. package/dist/material-react-table.cjs.development.js.map +1 -1
  32. package/dist/material-react-table.cjs.production.min.js +1 -1
  33. package/dist/material-react-table.cjs.production.min.js.map +1 -1
  34. package/dist/material-react-table.esm.js +2254 -2483
  35. package/dist/material-react-table.esm.js.map +1 -1
  36. package/dist/menus/MRT_ColumnActionMenu.d.ts +3 -2
  37. package/dist/menus/MRT_FilterTypeMenu.d.ts +4 -3
  38. package/dist/menus/MRT_RowActionMenu.d.ts +3 -2
  39. package/dist/menus/MRT_ShowHideColumnsMenu.d.ts +2 -0
  40. package/dist/menus/MRT_ShowHideColumnsMenuItems.d.ts +2 -1
  41. package/dist/table/MRT_Table.d.ts +3 -0
  42. package/dist/table/MRT_TableContainer.d.ts +2 -0
  43. package/dist/table/MRT_TablePaper.d.ts +7 -0
  44. package/dist/table/MRT_TableRoot.d.ts +3 -0
  45. package/dist/toolbar/MRT_LinearProgressBar.d.ts +2 -0
  46. package/dist/toolbar/MRT_TablePagination.d.ts +2 -0
  47. package/dist/toolbar/MRT_ToolbarAlertBanner.d.ts +2 -0
  48. package/dist/toolbar/MRT_ToolbarBottom.d.ts +2 -0
  49. package/dist/toolbar/MRT_ToolbarInternalButtons.d.ts +2 -0
  50. package/dist/toolbar/MRT_ToolbarTop.d.ts +4 -2
  51. package/dist/utils.d.ts +12 -2
  52. package/package.json +29 -30
  53. package/src/MaterialReactTable.tsx +615 -302
  54. package/src/body/MRT_TableBody.tsx +26 -22
  55. package/src/body/MRT_TableBodyCell.tsx +78 -60
  56. package/src/body/MRT_TableBodyRow.tsx +37 -76
  57. package/src/body/MRT_TableDetailPanel.tsx +21 -17
  58. package/src/buttons/MRT_CopyButton.tsx +14 -8
  59. package/src/buttons/MRT_EditActionButtons.tsx +16 -13
  60. package/src/buttons/MRT_ExpandAllButton.tsx +24 -9
  61. package/src/buttons/MRT_ExpandButton.tsx +22 -15
  62. package/src/buttons/MRT_FullScreenToggleButton.tsx +18 -11
  63. package/src/buttons/MRT_ShowHideColumnsButton.tsx +18 -7
  64. package/src/buttons/MRT_ToggleColumnActionMenuButton.tsx +22 -11
  65. package/src/buttons/MRT_ToggleDensePaddingButton.tsx +18 -11
  66. package/src/buttons/MRT_ToggleFiltersButton.tsx +16 -9
  67. package/src/buttons/MRT_ToggleRowActionMenuButton.tsx +30 -25
  68. package/src/buttons/MRT_ToggleSearchButton.tsx +24 -12
  69. package/src/footer/MRT_TableFooter.tsx +24 -8
  70. package/src/footer/MRT_TableFooterCell.tsx +34 -26
  71. package/src/footer/MRT_TableFooterRow.tsx +21 -39
  72. package/src/head/MRT_TableHead.tsx +24 -8
  73. package/src/head/MRT_TableHeadCell.tsx +183 -141
  74. package/src/head/MRT_TableHeadRow.tsx +16 -104
  75. package/src/icons.ts +3 -3
  76. package/src/inputs/MRT_EditCellTextField.tsx +36 -24
  77. package/src/inputs/MRT_FilterTextField.tsx +52 -31
  78. package/src/inputs/MRT_SearchTextField.tsx +46 -24
  79. package/src/inputs/MRT_SelectCheckbox.tsx +42 -30
  80. package/src/localization.ts +14 -2
  81. package/src/menus/MRT_ColumnActionMenu.tsx +128 -68
  82. package/src/menus/MRT_FilterTypeMenu.tsx +23 -20
  83. package/src/menus/MRT_RowActionMenu.tsx +22 -15
  84. package/src/menus/MRT_ShowHideColumnsMenu.tsx +52 -20
  85. package/src/menus/MRT_ShowHideColumnsMenuItems.tsx +27 -17
  86. package/src/table/MRT_Table.tsx +25 -15
  87. package/src/table/MRT_TableContainer.tsx +106 -45
  88. package/src/table/MRT_TablePaper.tsx +65 -0
  89. package/src/table/MRT_TableRoot.tsx +240 -0
  90. package/src/toolbar/MRT_LinearProgressBar.tsx +10 -7
  91. package/src/toolbar/MRT_TablePagination.tsx +33 -19
  92. package/src/toolbar/MRT_ToolbarAlertBanner.tsx +33 -20
  93. package/src/toolbar/MRT_ToolbarBottom.tsx +32 -21
  94. package/src/toolbar/MRT_ToolbarInternalButtons.tsx +35 -20
  95. package/src/toolbar/MRT_ToolbarTop.tsx +36 -29
  96. package/src/utils.ts +37 -8
  97. package/dist/head/MRT_TableHeadCellActions.d.ts +0 -5
  98. package/dist/table/MRT_TableSpacerCell.d.ts +0 -6
  99. package/dist/useMRT.d.ts +0 -28
  100. package/src/@types/faker.d.ts +0 -4
  101. package/src/@types/react-table-config.d.ts +0 -53
  102. package/src/head/MRT_TableHeadCellActions.tsx +0 -29
  103. package/src/table/MRT_TableSpacerCell.tsx +0 -20
  104. package/src/useMRT.tsx +0 -226
package/README.md CHANGED
@@ -1,47 +1,55 @@
1
1
  # Material React Table
2
2
 
3
- - A fully featured Material-UI implementation of react-table
4
- - Inspired by material-table and the material-ui DataGrid
5
- - Written from the ground up in TypeScript, Material-UI, and React Table
3
+ > This Project is based on react-table v8, which itself is still in alpha, and therefore this package is also still in alpha
6
4
 
7
- ## This project is in alpha, but feel free to install and explore
5
+ - A fully featured Material UI v5 implementation of react-table v8 (alpha)
6
+ - Inspired by material-table and the MUI X DataGrid
7
+ - Written from the ground up in TypeScript, Material UI, and React Table
8
+ - All internal Material UI components are easily customizable
8
9
 
9
- View the docs (alpha) site at https://www.material-react-table.com/
10
+ ## This project is in alpha, but feel free to install and explore
10
11
 
11
- View additional storybook examples at https://www.material-react-table.dev/
12
+ View the [docs (alpha) site](https://www.material-react-table.com/)
12
13
 
13
- View the source code and open issues at https://github.com/KevinVandy/material-react-table
14
+ View additional [storybook examples](https://www.material-react-table.dev/)
14
15
 
15
- Join the discord development discussion at https://discord.gg/5wqyRx6fnm
16
+ View the [github source code](https://github.com/KevinVandy/material-react-table) and [github open issues](https://github.com/KevinVandy/material-react-table/issues)
16
17
 
17
- <br />
18
+ Join the [discord](https://discord.gg/5wqyRx6fnm) server to join in on the development discussion or ask questions
18
19
 
19
- ### Features (Still In Active Development)
20
+ ### Features (Some Still In Active Development)
20
21
 
21
- - [ ] Column Ordering
22
- - [ ] Column Resizing (in dev)
23
- - [x] Cell Editing
22
+ - [x] Click To Copy Cell Values
24
23
  - [x] Column Actions
25
24
  - [x] Column Hiding
26
- - [x] Custom Styling
25
+ - [x] Column Grouping (Group By and Aggregates)
26
+ - [ ] Column Ordering (react-dnd planned)
27
+ - [x] Column Pinning
28
+ - [x] Column Resizing (work in progress)
29
+ - [x] Custom Icons
30
+ - [x] Custom Styling and internal Mui Components
31
+ - [x] Data Editing
27
32
  - [x] Dense Padding Toggle
28
- - [x] Localization
29
33
  - [x] Filtering
30
- - [x] Global Search
34
+ - [x] Fullscreen
35
+ - [ ] Global Search (broken in react-table v8 :( ))
31
36
  - [x] HeaderGroups
32
- - [x] Pagination
37
+ - [x] Localization i18n
38
+ - [x] Pagination (supports client-side and server-side)
33
39
  - [x] Row Actions
34
- - [x] Selection
40
+ - [x] Row Selection
41
+ - [x] SSR compatible
35
42
  - [x] Sorting
36
43
  - [x] Toolbars
37
- - [x] Tree Data (Subrows)
44
+ - [x] Tree Data / Expanding Subrows
45
+ - [ ] Virtualization (planned)
38
46
 
39
47
  ### Installation
40
48
 
41
- 1. Install Peer Dependencies (material-ui v5 and react table v7)
49
+ 1. Install Peer Dependencies (Material UI v5)
42
50
 
43
51
  ```bash
44
- npm install @mui/material @mui/icons-material @emotion/react @emotion/styled react-table
52
+ npm install @mui/material @mui/icons-material @emotion/react @emotion/styled
45
53
  ```
46
54
 
47
55
  2. Install material-react-table
@@ -1,96 +1,174 @@
1
- import { ChangeEvent, FC, MouseEvent, ReactNode } from 'react';
2
- import { AlertProps, ButtonProps, CheckboxProps, IconButtonProps, LinearProgressProps, SkeletonProps, TableBodyProps, TableCellProps, TableContainerProps, TableFooterProps, TableHeadProps, TablePaginationProps, TableProps, TableRowProps, TextFieldProps, ToolbarProps } from '@mui/material';
3
- import { Cell, Column, ColumnInstance, FilterType, ColumnInterface, HeaderGroup, Row, TableInstance, TableOptions, TableState, UseColumnOrderInstanceProps, UseColumnOrderState, UseExpandedInstanceProps, UseExpandedOptions, UseExpandedRowProps, UseExpandedState, UseFiltersColumnOptions, UseFiltersColumnProps, UseFiltersInstanceProps, UseFiltersOptions, UseFiltersState, UseGlobalFiltersColumnOptions, UseGlobalFiltersInstanceProps, UseGlobalFiltersOptions, UseGlobalFiltersState, UseGroupByCellProps, UseGroupByColumnOptions, UseGroupByColumnProps, UseGroupByInstanceProps, UseGroupByOptions, UseGroupByRowProps, UseGroupByState, UsePaginationInstanceProps, UsePaginationOptions, UsePaginationState, UseResizeColumnsColumnOptions, UseResizeColumnsColumnProps, UseResizeColumnsOptions, UseResizeColumnsState, UseRowSelectInstanceProps, UseRowSelectOptions, UseRowSelectRowProps, UseRowSelectState, UseRowStateCellProps, UseRowStateInstanceProps, UseRowStateOptions, UseRowStateRowProps, UseRowStateState, UseSortByColumnOptions, UseSortByColumnProps, UseSortByInstanceProps, UseSortByOptions, UseSortByState, UseTableHeaderGroupProps, UseTableInstanceProps, UseTableOptions } from 'react-table';
1
+ import { ChangeEvent, Dispatch, FC, FocusEvent, MouseEvent, ReactNode, SetStateAction } from 'react';
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, DefaultGenerics, FilterType, Header, HeaderGroup, Options, Overwrite, PaginationState, Row, TableInstance, TableState, VisibilityState } from '@tanstack/react-table';
4
4
  import { MRT_Localization } from './localization';
5
5
  import { MRT_Icons } from './icons';
6
6
  import { MRT_FILTER_TYPE } from './enums';
7
- export declare type MRT_TableOptions<D extends {} = {}> = TableOptions<D> & UseExpandedOptions<D> & UseFiltersOptions<D> & UseGlobalFiltersOptions<D> & UseGroupByOptions<D> & UsePaginationOptions<D> & UseResizeColumnsOptions<D> & UseRowSelectOptions<D> & UseRowStateOptions<D> & UseSortByOptions<D> & {
8
- columns: MRT_ColumnInterface[];
7
+ export declare type MRT_TableOptions<D extends Record<string, any> = {}> = Partial<Omit<Options<D>, 'columns' | 'data' | 'initialState' | 'state' | 'expandRowsFn'>> & {
8
+ columns: MRT_ColumnInterface<D>[];
9
9
  data: D[];
10
- initialState?: Partial<MRT_TableState>;
10
+ initialState?: Partial<MRT_TableState<D>>;
11
+ state?: Partial<MRT_TableState<D>>;
12
+ expandRowsFn?: (dataRow: D) => D[];
11
13
  };
12
- export declare type MRT_TableInstance<D extends {} = {}> = TableInstance<D> & UseTableInstanceProps<D> & UseColumnOrderInstanceProps<D> & UseExpandedInstanceProps<D> & UseFiltersInstanceProps<D> & UseGlobalFiltersInstanceProps<D> & UseGroupByInstanceProps<D> & UsePaginationInstanceProps<D> & UseRowSelectInstanceProps<D> & UseRowStateInstanceProps<D> & UseSortByInstanceProps<D> & {
13
- columns: (Column<D> & MRT_ColumnInstance<D>)[];
14
- footerGroups: MRT_HeaderGroup<D>[];
15
- getToggleAllRowsExpandedProps: () => void;
16
- headerGroups: MRT_HeaderGroup<D>[];
17
- page: MRT_Row<D>[];
18
- resetResizing: () => void;
14
+ export interface MRT_RowModel<D extends Record<string, any> = {}> {
15
+ flatRows: MRT_Row<D>[];
19
16
  rows: MRT_Row<D>[];
20
- state: MRT_TableState<D>;
17
+ rowsById: {
18
+ [key: string]: MRT_Row<D>;
19
+ };
20
+ }
21
+ export declare type MRT_TableInstance<D extends Record<string, any> = {}> = Omit<TableInstance<Overwrite<Partial<DefaultGenerics>, {
22
+ Row: D;
23
+ }>>, 'getAllColumns' | 'getAllLeafColumns' | 'getExpandedRowModel' | 'getPaginationRowModel' | 'getPrePaginationRowModel' | 'getRowModel' | 'getSelectedRowModel' | 'getState' | 'options'> & {
24
+ getAllColumns: () => MRT_ColumnInstance<D>[];
25
+ getAllLeafColumns: () => MRT_ColumnInstance<D>[];
26
+ getExpandedRowModel: () => MRT_RowModel<D>;
27
+ getPaginationRowModel: () => MRT_RowModel<D>;
28
+ getPrePaginationRowModel: () => MRT_RowModel<D>;
29
+ getRowModel: () => MRT_RowModel<D>;
30
+ getSelectedRowModel: () => MRT_RowModel<D>;
31
+ getState: () => MRT_TableState<D>;
32
+ options: MaterialReactTableProps<D> & {
33
+ icons: MRT_Icons;
34
+ idPrefix: string;
35
+ filterTypes: {
36
+ [key in MRT_FILTER_TYPE]: any;
37
+ };
38
+ localization: MRT_Localization;
39
+ };
40
+ setCurrentEditingRow: Dispatch<SetStateAction<MRT_Row<D> | null>>;
41
+ setCurrentFilterTypes: Dispatch<SetStateAction<{
42
+ [key: string]: MRT_FilterType;
43
+ }>>;
44
+ setCurrentGlobalFilterType: Dispatch<SetStateAction<MRT_FILTER_TYPE>>;
45
+ setIsDensePadding: Dispatch<SetStateAction<boolean>>;
46
+ setIsFullScreen: Dispatch<SetStateAction<boolean>>;
47
+ setShowFilters: Dispatch<SetStateAction<boolean>>;
48
+ setShowSearch: Dispatch<SetStateAction<boolean>>;
21
49
  };
22
- export declare type MRT_ColumnInterface<D extends {} = {}> = ColumnInterface<D> & UseFiltersColumnOptions<D> & UseGlobalFiltersColumnOptions<D> & UseGroupByColumnOptions<D> & UseResizeColumnsColumnOptions<D> & UseSortByColumnOptions<D> & {
23
- Edit?: ({ cell, onChange, }: {
50
+ export declare type MRT_TableState<D extends Record<string, any> = {}> = Omit<TableState, 'pagination'> & {
51
+ currentEditingRow: MRT_Row<D> | null;
52
+ currentFilterTypes: Record<string, string | Function>;
53
+ currentGlobalFilterType: Record<string, string | Function>;
54
+ isDensePadding: boolean;
55
+ isFullScreen: boolean;
56
+ showFilters: boolean;
57
+ showSearch: boolean;
58
+ pagination: Partial<PaginationState>;
59
+ };
60
+ export declare type MRT_ColumnInterface<D extends Record<string, any> = {}> = Omit<ColumnDef<D>, 'header' | 'footer' | 'columns'> & {
61
+ Edit?: ({ cell, tableInstance, }: {
24
62
  cell: MRT_Cell<D>;
25
- onChange?: (event: ChangeEvent<HTMLInputElement>) => void;
63
+ tableInstance: MRT_TableInstance<D>;
64
+ }) => ReactNode;
65
+ Filter?: ({ header, tableInstance, }: {
66
+ header: MRT_Header<D>;
67
+ tableInstance: MRT_TableInstance<D>;
68
+ }) => ReactNode;
69
+ Footer?: ({ footer, tableInstance, }: {
70
+ footer: MRT_Header<D>;
71
+ tableInstance: MRT_TableInstance<D>;
26
72
  }) => ReactNode;
27
- Filter?: ({ column }: {
28
- column: MRT_HeaderGroup<D>;
73
+ Header?: ({ header, tableInstance, }: {
74
+ header: MRT_Header<D>;
75
+ tableInstance: MRT_TableInstance<D>;
29
76
  }) => ReactNode;
30
- Footer?: string;
31
- Header?: string;
32
- accessor?: string;
77
+ Cell?: ({ cell, tableInstance, }: {
78
+ cell: MRT_Cell<D>;
79
+ tableInstance: MRT_TableInstance<D>;
80
+ }) => ReactNode;
81
+ id: keyof D | string;
33
82
  columns?: MRT_ColumnInterface<D>[];
34
- disableClickToCopy?: boolean;
35
- disableColumnActions?: boolean;
36
- disableColumnHiding?: boolean;
37
- disableEditing?: boolean;
38
- disableFilters?: boolean;
83
+ enableClickToCopy?: boolean;
84
+ enableColumnActions?: boolean;
85
+ enableEditing?: boolean;
39
86
  enabledFilterTypes?: (MRT_FILTER_TYPE | string)[];
40
87
  filter?: MRT_FilterType | string | FilterType<D>;
41
88
  filterSelectOptions?: (string | {
42
89
  text: string;
43
90
  value: string;
44
91
  })[];
45
- muiTableBodyCellCopyButtonProps?: ButtonProps | ((cell?: MRT_Cell<D>) => ButtonProps);
46
- muiTableBodyCellEditTextFieldProps?: TextFieldProps | ((cell: MRT_Cell<D>) => TextFieldProps);
47
- muiTableBodyCellProps?: TableCellProps | ((cell: MRT_Cell<D>) => TableCellProps);
48
- muiTableFooterCellProps?: TableCellProps | ((column: Column<D>) => TableCellProps);
49
- muiTableHeadCellColumnActionsButtonProps?: IconButtonProps | ((column: Column<D>) => IconButtonProps);
50
- muiTableHeadCellFilterTextFieldProps?: TextFieldProps | ((column: Column<D>) => TextFieldProps);
51
- muiTableHeadCellProps?: TableCellProps | ((column: Column<D>) => TableCellProps);
52
- onCellEditChange?: (event: ChangeEvent<HTMLInputElement>, cell: MRT_Cell<D>) => void;
53
- onFilterChange?: (event: ChangeEvent<HTMLInputElement>, filterValue: any) => void;
92
+ footer?: string;
93
+ header: string;
94
+ muiTableBodyCellCopyButtonProps?: ButtonProps | (({ tableInstance, cell, }: {
95
+ tableInstance: MRT_TableInstance;
96
+ cell: MRT_Cell<D>;
97
+ }) => ButtonProps);
98
+ muiTableBodyCellEditTextFieldProps?: TextFieldProps | (({ tableInstance, cell, }: {
99
+ tableInstance: MRT_TableInstance;
100
+ cell: MRT_Cell<D>;
101
+ }) => TextFieldProps);
102
+ muiTableBodyCellProps?: TableCellProps | (({ tableInstance, cell, }: {
103
+ tableInstance: MRT_TableInstance;
104
+ cell: MRT_Cell<D>;
105
+ }) => TableCellProps);
106
+ muiTableFooterCellProps?: TableCellProps | (({ tableInstance, column, }: {
107
+ tableInstance: MRT_TableInstance;
108
+ column: MRT_ColumnInstance<D>;
109
+ }) => TableCellProps);
110
+ muiTableHeadCellColumnActionsButtonProps?: IconButtonProps | (({ tableInstance, column, }: {
111
+ tableInstance: MRT_TableInstance;
112
+ column: MRT_ColumnInstance<D>;
113
+ }) => IconButtonProps);
114
+ muiTableHeadCellFilterTextFieldProps?: TextFieldProps | (({ tableInstance, column, }: {
115
+ tableInstance: MRT_TableInstance;
116
+ column: MRT_ColumnInstance<D>;
117
+ }) => TextFieldProps);
118
+ muiTableHeadCellProps?: TableCellProps | (({ tableInstance, column, }: {
119
+ tableInstance: MRT_TableInstance;
120
+ column: MRT_ColumnInstance<D>;
121
+ }) => TableCellProps);
122
+ onCellEditBlur?: ({ cell, event, tableInstance, }: {
123
+ event: FocusEvent<HTMLInputElement>;
124
+ cell: MRT_Cell<D>;
125
+ tableInstance: MRT_TableInstance<D>;
126
+ }) => void;
127
+ onCellEditChange?: ({ cell, event, tableInstance, }: {
128
+ event: ChangeEvent<HTMLInputElement>;
129
+ cell: MRT_Cell<D>;
130
+ tableInstance: MRT_TableInstance<D>;
131
+ }) => void;
132
+ onColumnFilterValueChange?: ({ event, filterValue, }: {
133
+ event: ChangeEvent<HTMLInputElement>;
134
+ filterValue: any;
135
+ }) => void;
54
136
  };
55
- export declare type MRT_ColumnInstance<D extends {} = {}> = ColumnInstance<D> & UseFiltersColumnProps<D> & UseGroupByColumnProps<D> & UseResizeColumnsColumnProps<D> & UseSortByColumnProps<D> & MRT_ColumnInterface<D> & {
137
+ export declare type MRT_ColumnInstance<D extends Record<string, any> = {}> = Omit<Column<D>, 'header' | 'footer' | 'columns'> & MRT_ColumnInterface<D> & {
56
138
  columns?: MRT_ColumnInstance<D>[];
57
139
  };
58
- export declare type MRT_HeaderGroup<D extends {} = {}> = HeaderGroup<D> & MRT_ColumnInstance<D> & UseTableHeaderGroupProps<D> & {
59
- headers: MRT_HeaderGroup<D>[];
140
+ export declare type MRT_Header<D extends Record<string, any> = {}> = Omit<Header<D>, 'column'> & {
141
+ column: MRT_ColumnInstance<D>;
142
+ };
143
+ export declare type MRT_HeaderGroup<D extends Record<string, any> = {}> = Omit<HeaderGroup<D>, 'headers'> & {
144
+ headers: MRT_Header<D>[];
60
145
  };
61
- export declare type MRT_Row<D extends {} = {}> = Row<D> & UseExpandedRowProps<D> & UseGroupByRowProps<D> & UseRowSelectRowProps<D> & UseRowStateRowProps<D> & {
62
- cells: MRT_Cell<D>[];
146
+ export declare type MRT_Row<D extends Record<string, any> = {}> = Omit<Row<D>, 'getVisibleCells' | 'getAllCells' | 'subRows' | 'original' | 'getLeftVisibleCells' | 'getRightVisibleCells' | 'getCenterVisibleCells'> & {
147
+ getAllCells: () => MRT_Cell<D>[];
148
+ getCenterVisibleCells: () => MRT_Cell<D>[];
149
+ getLeftVisibleCells: () => MRT_Cell<D>[];
150
+ getRightVisibleCells: () => MRT_Cell<D>[];
151
+ getVisibleCells: () => MRT_Cell<D>[];
152
+ subRows?: MRT_Row<D>[];
153
+ original: D;
63
154
  };
64
- export declare type MRT_Cell<D extends {} = {}, _V = any> = Cell<D> & UseGroupByCellProps<D> & UseRowStateCellProps<D> & {
155
+ export declare type MRT_Cell<D extends Record<string, any> = {}> = Omit<Cell<D>, 'column' | 'row'> & {
65
156
  column: MRT_ColumnInstance<D>;
157
+ row: MRT_Row<D>;
66
158
  };
67
159
  export declare type MRT_FilterType = MRT_FILTER_TYPE | Function;
68
- export declare type MRT_TableState<D extends {} = {}> = TableState<D> & UseColumnOrderState<D> & UseExpandedState<D> & UseFiltersState<D> & UseGlobalFiltersState<D> & UseGroupByState<D> & UsePaginationState<D> & UseResizeColumnsState<D> & UseRowSelectState<D> & UseRowStateState<D> & UseSortByState<D> & {
69
- currentEditingRow: MRT_Row<D> | null;
70
- currentFilterTypes: {
71
- [key: string]: MRT_FilterType;
72
- };
73
- currentGlobalFilterType: MRT_FilterType;
74
- densePadding: boolean;
75
- fullScreen: boolean;
76
- showFilters: boolean;
77
- showSearch: boolean;
78
- };
79
- export declare type MaterialReactTableProps<D extends {} = {}> = UseTableOptions<D> & UseExpandedOptions<D> & UseFiltersOptions<D> & UseGlobalFiltersOptions<D> & UseGroupByOptions<D> & UsePaginationOptions<D> & UseResizeColumnsOptions<D> & UseRowSelectOptions<D> & UseRowStateOptions<D> & UseSortByOptions<D> & MRT_TableOptions<D> & {
80
- disableColumnActions?: boolean;
81
- disableColumnHiding?: boolean;
82
- disableDensePaddingToggle?: boolean;
83
- disableExpandAll?: boolean;
84
- disableFullScreenToggle?: boolean;
85
- disableSelectAll?: boolean;
86
- disableSubRowTree?: boolean;
160
+ export declare type MaterialReactTableProps<D extends Record<string, any> = {}> = MRT_TableOptions<D> & {
87
161
  enableClickToCopy?: boolean;
88
- enableColumnGrouping?: boolean;
89
- enableColumnResizing?: boolean;
162
+ enableColumnActions?: boolean;
163
+ enableDensePaddingToggle?: boolean;
164
+ enableEditing?: boolean;
165
+ enableExpandAll?: boolean;
166
+ enableFullScreenToggle?: boolean;
167
+ enablePagination?: boolean;
90
168
  enableRowActions?: boolean;
91
- enableRowEditing?: boolean;
92
169
  enableRowNumbers?: boolean;
93
- enableSelection?: boolean;
170
+ enableSelectAll?: boolean;
171
+ enableStickyHeader?: boolean;
94
172
  enabledGlobalFilterTypes?: (MRT_FILTER_TYPE | string)[];
95
173
  filterTypes?: {
96
174
  [key in MRT_FILTER_TYPE]: any;
@@ -102,57 +180,180 @@ export declare type MaterialReactTableProps<D extends {} = {}> = UseTableOptions
102
180
  hideToolbarTop?: boolean;
103
181
  icons?: Partial<MRT_Icons>;
104
182
  idPrefix?: string;
105
- isFetching?: boolean;
106
183
  isLoading?: boolean;
184
+ isReloading?: boolean;
107
185
  localization?: Partial<MRT_Localization>;
108
- muiLinearProgressProps?: LinearProgressProps | ((tableInstance: MRT_TableInstance) => LinearProgressProps);
109
- muiSearchTextFieldProps?: TextFieldProps;
110
- muiSelectCheckboxProps?: CheckboxProps | ((isSelectAll?: boolean, row?: MRT_Row<D>, tableInstance?: MRT_TableInstance<D>) => CheckboxProps);
111
- muiTableBodyCellCopyButtonProps?: ButtonProps | ((cell?: MRT_Cell<D>) => ButtonProps);
112
- muiTableBodyCellEditTextFieldProps?: TextFieldProps | ((cell?: MRT_Cell<D>) => TextFieldProps);
113
- muiTableBodyCellProps?: TableCellProps | ((cell?: MRT_Cell<D>) => TableCellProps);
114
- muiTableBodyCellSkeletonProps?: SkeletonProps | ((cell?: MRT_Cell<D>) => SkeletonProps);
115
- muiTableBodyProps?: TableBodyProps | ((tableInstance: MRT_TableInstance<D>) => TableBodyProps);
116
- muiTableBodyRowProps?: TableRowProps | ((row: Row<D>) => TableRowProps);
117
- muiTableContainerProps?: TableContainerProps | ((tableInstance: MRT_TableInstance<D>) => TableContainerProps);
118
- muiTableDetailPanelProps?: TableCellProps | ((row: Row<D>) => TableCellProps);
119
- muiTableFooterCellProps?: TableCellProps | ((column: Column<D>) => TableCellProps);
120
- muiTableFooterProps?: TableFooterProps | ((tableInstance: MRT_TableInstance<D>) => TableFooterProps);
121
- muiTableFooterRowProps?: TableRowProps | ((footerGroup: MRT_HeaderGroup<D>) => TableRowProps);
122
- muiTableHeadCellColumnActionsButtonProps?: IconButtonProps | ((column: Column<D>) => IconButtonProps);
123
- muiTableHeadCellFilterTextFieldProps?: TextFieldProps | ((column: Column<D>) => TextFieldProps);
124
- muiTableHeadCellProps?: TableCellProps | ((column: Column<D>) => TableCellProps);
125
- muiTableHeadProps?: TableHeadProps | ((tableInstance: MRT_TableInstance<D>) => TableHeadProps);
126
- muiTableHeadRowProps?: TableRowProps | ((row: MRT_HeaderGroup<D>) => TableRowProps);
127
- muiTablePaginationProps?: Partial<TablePaginationProps> | ((tableInstance: MRT_TableInstance<D>) => Partial<TablePaginationProps>);
128
- muiTableProps?: TableProps | ((tableInstance: MRT_TableInstance<D>) => TableProps);
129
- muiTableToolbarAlertBannerProps?: AlertProps | ((tableInstance: MRT_TableInstance<D>) => AlertProps);
130
- muiTableToolbarBottomProps?: ToolbarProps | ((tableInstance: MRT_TableInstance<D>) => ToolbarProps);
131
- muiTableToolbarTopProps?: ToolbarProps | ((tableInstance: MRT_TableInstance<D>) => ToolbarProps);
132
- onCellClick?: (event: MouseEvent<HTMLTableCellElement>, cell: MRT_Cell<D>) => void;
133
- onColumnHide?: (column: Column<D>, hiddenColumns?: string[]) => void;
134
- onDetailPanelClick?: (event: MouseEvent<HTMLTableCellElement>, row: Row<D>) => void;
135
- onGlobalFilterChange?: (event: ChangeEvent<HTMLInputElement>) => void;
136
- onRowClick?: (event: MouseEvent<HTMLTableRowElement>, row: Row<D>) => void;
137
- onRowEditSubmit?: (row: Row<D>) => Promise<void> | void;
138
- onRowExpandChange?: (event: MouseEvent<HTMLButtonElement>, row: Row<D>) => void;
139
- onSelectAllChange?: (event: ChangeEvent, selectedRows: Row<D>[]) => void;
140
- onSelectChange?: (event: ChangeEvent, row: Row<D>, selectedRows: Row<D>[]) => void;
186
+ muiLinearProgressProps?: LinearProgressProps | (({ tableInstance, }: {
187
+ tableInstance: MRT_TableInstance;
188
+ }) => LinearProgressProps);
189
+ muiSearchTextFieldProps?: TextFieldProps | (({ tableInstance, }: {
190
+ tableInstance: MRT_TableInstance;
191
+ }) => TextFieldProps);
192
+ muiSelectCheckboxProps?: CheckboxProps | (({ tableInstance, isSelectAll, row, }: {
193
+ tableInstance: MRT_TableInstance;
194
+ isSelectAll: boolean;
195
+ row?: MRT_Row<D>;
196
+ }) => CheckboxProps);
197
+ muiTableBodyCellCopyButtonProps?: ButtonProps | (({ tableInstance, cell, }: {
198
+ tableInstance: MRT_TableInstance;
199
+ cell: MRT_Cell<D>;
200
+ }) => ButtonProps);
201
+ muiTableBodyCellEditTextFieldProps?: TextFieldProps | (({ tableInstance, cell, }: {
202
+ tableInstance: MRT_TableInstance;
203
+ cell: MRT_Cell<D>;
204
+ }) => TextFieldProps);
205
+ muiTableBodyCellProps?: TableCellProps | (({ tableInstance, cell, }: {
206
+ tableInstance: MRT_TableInstance;
207
+ cell: MRT_Cell<D>;
208
+ }) => TableCellProps);
209
+ muiTableBodyCellSkeletonProps?: SkeletonProps | (({ tableInstance, cell, }: {
210
+ tableInstance: MRT_TableInstance;
211
+ cell: MRT_Cell<D>;
212
+ }) => SkeletonProps);
213
+ muiTableBodyProps?: TableBodyProps | (({ tableInstance, }: {
214
+ tableInstance: MRT_TableInstance;
215
+ }) => TableBodyProps);
216
+ muiTableBodyRowProps?: TableRowProps | (({ tableInstance, row, }: {
217
+ tableInstance: MRT_TableInstance;
218
+ row: MRT_Row<D>;
219
+ }) => TableRowProps);
220
+ muiTableContainerProps?: TableContainerProps | (({ tableInstance, }: {
221
+ tableInstance: MRT_TableInstance;
222
+ }) => TableContainerProps);
223
+ muiTableDetailPanelProps?: TableCellProps | (({ tableInstance, row, }: {
224
+ tableInstance: MRT_TableInstance;
225
+ row: MRT_Row<D>;
226
+ }) => TableCellProps);
227
+ muiTableFooterCellProps?: TableCellProps | (({ tableInstance, column, }: {
228
+ tableInstance: MRT_TableInstance;
229
+ column: MRT_ColumnInstance<D>;
230
+ }) => TableCellProps);
231
+ muiTableFooterProps?: TableFooterProps | (({ tableInstance, }: {
232
+ tableInstance: MRT_TableInstance;
233
+ }) => TableFooterProps);
234
+ muiTableFooterRowProps?: TableRowProps | (({ tableInstance, footerGroup, }: {
235
+ tableInstance: MRT_TableInstance;
236
+ footerGroup: MRT_HeaderGroup<D>;
237
+ }) => TableRowProps);
238
+ muiTableHeadCellColumnActionsButtonProps?: IconButtonProps | (({ tableInstance, column, }: {
239
+ tableInstance: MRT_TableInstance;
240
+ column: MRT_ColumnInstance<D>;
241
+ }) => IconButtonProps);
242
+ muiTableHeadCellFilterTextFieldProps?: TextFieldProps | (({ tableInstance, column, }: {
243
+ tableInstance: MRT_TableInstance;
244
+ column: MRT_ColumnInstance<D>;
245
+ }) => TextFieldProps);
246
+ muiTableHeadCellProps?: TableCellProps | (({ tableInstance, column, }: {
247
+ tableInstance: MRT_TableInstance;
248
+ column: MRT_ColumnInstance<D>;
249
+ }) => TableCellProps);
250
+ muiTableHeadProps?: TableHeadProps | (({ tableInstance, }: {
251
+ tableInstance: MRT_TableInstance;
252
+ }) => TableHeadProps);
253
+ muiTableHeadRowProps?: TableRowProps | (({ tableInstance, headerGroup, }: {
254
+ tableInstance: MRT_TableInstance;
255
+ headerGroup: MRT_HeaderGroup<D>;
256
+ }) => TableRowProps);
257
+ muiTablePaperProps?: PaperProps | (({ tableInstance, }: {
258
+ tableInstance: MRT_TableInstance;
259
+ }) => PaperProps);
260
+ muiTablePaginationProps?: Partial<TablePaginationProps> | (({ tableInstance, }: {
261
+ tableInstance: MRT_TableInstance;
262
+ }) => Partial<TablePaginationProps>);
263
+ muiTableProps?: TableProps | (({ tableInstance, }: {
264
+ tableInstance: MRT_TableInstance;
265
+ }) => TableProps);
266
+ muiTableToolbarAlertBannerProps?: AlertProps | (({ tableInstance, }: {
267
+ tableInstance: MRT_TableInstance;
268
+ }) => AlertProps);
269
+ muiTableToolbarBottomProps?: ToolbarProps | (({ tableInstance, }: {
270
+ tableInstance: MRT_TableInstance;
271
+ }) => ToolbarProps);
272
+ muiTableToolbarTopProps?: ToolbarProps | (({ tableInstance, }: {
273
+ tableInstance: MRT_TableInstance;
274
+ }) => ToolbarProps);
275
+ onCellClick?: ({ cell, event, tableInstance, }: {
276
+ cell: MRT_Cell<D>;
277
+ tableInstance: MRT_TableInstance<D>;
278
+ event: MouseEvent<HTMLTableCellElement>;
279
+ }) => void;
280
+ onColumnHide?: ({ column, columnVisibility, tableInstance, }: {
281
+ column: MRT_ColumnInstance<D>;
282
+ columnVisibility: VisibilityState;
283
+ tableInstance: MRT_TableInstance<D>;
284
+ }) => void;
285
+ onDetailPanelClick?: ({ event, row, tableInstance, }: {
286
+ event: MouseEvent<HTMLTableCellElement>;
287
+ row: MRT_Row<D>;
288
+ tableInstance: MRT_TableInstance<D>;
289
+ }) => void;
290
+ onGlobalFilterChange?: ({ event, tableInstance, }: {
291
+ event: ChangeEvent<HTMLInputElement>;
292
+ tableInstance: MRT_TableInstance<D>;
293
+ }) => void;
294
+ onRowClick?: ({ event, row, tableInstance, }: {
295
+ event: MouseEvent<HTMLTableRowElement>;
296
+ row: MRT_Row<D>;
297
+ tableInstance: MRT_TableInstance<D>;
298
+ }) => void;
299
+ onEditSubmit?: ({ row, tableInstance, }: {
300
+ row: MRT_Row<D>;
301
+ tableInstance: MRT_TableInstance<D>;
302
+ }) => Promise<void> | void;
303
+ onRowExpandChange?: ({ event, row, }: {
304
+ event: MouseEvent<HTMLButtonElement>;
305
+ row: MRT_Row<D>;
306
+ tableInstance: MRT_TableInstance<D>;
307
+ }) => void;
308
+ onSelectAllChange?: ({ event, selectedRows, tableInstance, }: {
309
+ event: ChangeEvent;
310
+ selectedRows: MRT_Row<D>[];
311
+ tableInstance: MRT_TableInstance<D>;
312
+ }) => void;
313
+ onSelectChange?: ({ event, row, selectedRows, tableInstance, }: {
314
+ event: ChangeEvent;
315
+ row: MRT_Row<D>;
316
+ selectedRows: MRT_Row<D>[];
317
+ tableInstance: MRT_TableInstance<D>;
318
+ }) => void;
141
319
  positionActionsColumn?: 'first' | 'last';
142
320
  positionPagination?: 'bottom' | 'top' | 'both';
143
321
  positionToolbarActions?: 'bottom' | 'top';
144
322
  positionToolbarAlertBanner?: 'bottom' | 'top';
145
- renderDetailPanel?: (row: Row<D>) => ReactNode;
146
- renderRowActionMenuItems?: (rowData: Row<D>, tableInstance: MRT_TableInstance<D>, closeMenu: () => void) => ReactNode[];
147
- renderRowActions?: (row: Row<D>, tableInstance: MRT_TableInstance<D>) => ReactNode;
148
- renderToolbarCustomActions?: (tableInstance: MRT_TableInstance<D>) => ReactNode;
149
- renderToolbarInternalActions?: (tableInstance: MRT_TableInstance<D>, { MRT_ToggleSearchButton, MRT_ToggleFiltersButton, MRT_ShowHideColumnsButton, MRT_ToggleDensePaddingButton, MRT_FullScreenToggleButton, }: {
150
- MRT_ToggleSearchButton: FC<IconButtonProps>;
151
- MRT_ToggleFiltersButton: FC<IconButtonProps>;
152
- MRT_ShowHideColumnsButton: FC<IconButtonProps>;
153
- MRT_ToggleDensePaddingButton: FC<IconButtonProps>;
154
- MRT_FullScreenToggleButton: FC<IconButtonProps>;
323
+ renderDetailPanel?: ({ row, tableInstance, }: {
324
+ row: MRT_Row<D>;
325
+ tableInstance: MRT_TableInstance<D>;
326
+ }) => ReactNode;
327
+ renderRowActionMenuItems?: ({ closeMenu, row, tableInstance, }: {
328
+ closeMenu: () => void;
329
+ row: MRT_Row<D>;
330
+ tableInstance: MRT_TableInstance<D>;
331
+ }) => ReactNode[];
332
+ renderRowActions?: ({ row, tableInstance, }: {
333
+ row: MRT_Row<D>;
334
+ tableInstance: MRT_TableInstance<D>;
335
+ }) => ReactNode;
336
+ renderToolbarCustomActions?: ({ tableInstance, }: {
337
+ tableInstance: MRT_TableInstance<D>;
338
+ }) => ReactNode;
339
+ renderToolbarInternalActions?: ({ tableInstance, MRT_ToggleSearchButton, MRT_ToggleFiltersButton, MRT_ShowHideColumnsButton, MRT_ToggleDensePaddingButton, MRT_FullScreenToggleButton, }: {
340
+ tableInstance: MRT_TableInstance<D>;
341
+ MRT_ToggleSearchButton: FC<IconButtonProps & {
342
+ tableInstance: MRT_TableInstance<D>;
343
+ }>;
344
+ MRT_ToggleFiltersButton: FC<IconButtonProps & {
345
+ tableInstance: MRT_TableInstance<D>;
346
+ }>;
347
+ MRT_ShowHideColumnsButton: FC<IconButtonProps & {
348
+ tableInstance: MRT_TableInstance<D>;
349
+ }>;
350
+ MRT_ToggleDensePaddingButton: FC<IconButtonProps & {
351
+ tableInstance: MRT_TableInstance<D>;
352
+ }>;
353
+ MRT_FullScreenToggleButton: FC<IconButtonProps & {
354
+ tableInstance: MRT_TableInstance<D>;
355
+ }>;
155
356
  }) => ReactNode;
156
357
  };
157
- declare const _default: <D extends {} = {}>({ defaultColumn, filterTypes, globalFilter, icons, localization, positionActionsColumn, positionPagination, positionToolbarActions, positionToolbarAlertBanner, ...rest }: MaterialReactTableProps<D>) => JSX.Element;
358
+ declare const _default: <D extends Record<string, any> = {}>({ autoResetExpanded, enableColumnActions, enableColumnFilters, enableDensePaddingToggle, enableExpandAll, enableFilters, enableFullScreenToggle, enableGlobalFilter, enableHiding, enableMultiRowSelection, enablePagination, enableSelectAll, enableSorting, enableStickyHeader, icons, localization, positionActionsColumn, positionPagination, positionToolbarActions, positionToolbarAlertBanner, ...rest }: MaterialReactTableProps<D>) => JSX.Element;
158
359
  export default _default;
@@ -1,5 +1,8 @@
1
1
  import { FC } from 'react';
2
+ import { MRT_TableInstance } from '..';
2
3
  interface Props {
4
+ pinned: 'left' | 'center' | 'right' | 'none';
5
+ tableInstance: MRT_TableInstance;
3
6
  }
4
7
  export declare const MRT_TableBody: FC<Props>;
5
8
  export {};
@@ -1,17 +1,8 @@
1
1
  import { FC } from 'react';
2
- import type { MRT_Cell } from '..';
3
- export declare const commonTableBodyCellStyles: (densePadding: boolean) => {
4
- p: string;
5
- transition: string;
6
- whiteSpace: string;
7
- };
8
- export declare const commonTableBodyButtonCellStyles: (densePadding: boolean) => {
9
- p: string;
10
- textAlign: string;
11
- transition: string;
12
- };
2
+ import type { MRT_Cell, MRT_TableInstance } from '..';
13
3
  interface Props {
14
4
  cell: MRT_Cell;
5
+ tableInstance: MRT_TableInstance;
15
6
  }
16
7
  export declare const MRT_TableBodyCell: FC<Props>;
17
8
  export {};
@@ -1,7 +1,9 @@
1
1
  import { FC } from 'react';
2
- import type { MRT_Row } from '..';
2
+ import type { MRT_Row, MRT_TableInstance } from '..';
3
3
  interface Props {
4
+ pinned: 'left' | 'center' | 'right' | 'none';
4
5
  row: MRT_Row;
6
+ tableInstance: MRT_TableInstance;
5
7
  }
6
8
  export declare const MRT_TableBodyRow: FC<Props>;
7
9
  export {};
@@ -1,7 +1,8 @@
1
1
  import { FC } from 'react';
2
- import type { MRT_Row } from '..';
2
+ import type { MRT_Row, MRT_TableInstance } from '..';
3
3
  interface Props {
4
4
  row: MRT_Row;
5
+ tableInstance: MRT_TableInstance;
5
6
  }
6
7
  export declare const MRT_TableDetailPanel: FC<Props>;
7
8
  export {};
@@ -1,7 +1,8 @@
1
1
  import { FC } from 'react';
2
- import { MRT_Cell } from '..';
2
+ import { MRT_Cell, MRT_TableInstance } from '..';
3
3
  interface Props {
4
4
  cell: MRT_Cell;
5
+ tableInstance: MRT_TableInstance;
5
6
  }
6
7
  export declare const MRT_CopyButton: FC<Props>;
7
8
  export {};
@@ -1,7 +1,8 @@
1
1
  import { FC } from 'react';
2
- import type { MRT_Row } from '..';
2
+ import type { MRT_Row, MRT_TableInstance } from '..';
3
3
  interface Props {
4
4
  row: MRT_Row;
5
+ tableInstance: MRT_TableInstance;
5
6
  }
6
7
  export declare const MRT_EditActionButtons: FC<Props>;
7
8
  export {};
@@ -1,5 +1,7 @@
1
1
  import { FC } from 'react';
2
+ import { MRT_TableInstance } from '..';
2
3
  interface Props {
4
+ tableInstance: MRT_TableInstance;
3
5
  }
4
6
  export declare const MRT_ExpandAllButton: FC<Props>;
5
7
  export {};