material-react-table 0.5.0 → 0.5.3

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 (35) hide show
  1. package/dist/MaterialReactTable.d.ts +10 -9
  2. package/dist/material-react-table.cjs.development.js +93 -81
  3. package/dist/material-react-table.cjs.development.js.map +1 -1
  4. package/dist/material-react-table.cjs.production.min.js +1 -1
  5. package/dist/material-react-table.cjs.production.min.js.map +1 -1
  6. package/dist/material-react-table.esm.js +94 -82
  7. package/dist/material-react-table.esm.js.map +1 -1
  8. package/dist/useMRT.d.ts +0 -5
  9. package/package.json +2 -2
  10. package/src/@types/react-table-config.d.ts +3 -3
  11. package/src/MaterialReactTable.tsx +16 -9
  12. package/src/body/MRT_TableBody.tsx +7 -2
  13. package/src/body/MRT_TableBodyCell.tsx +3 -2
  14. package/src/body/MRT_TableBodyRow.tsx +11 -8
  15. package/src/buttons/MRT_EditActionButtons.tsx +2 -2
  16. package/src/buttons/MRT_ExpandAllButton.tsx +3 -4
  17. package/src/buttons/MRT_ExpandButton.tsx +3 -1
  18. package/src/buttons/MRT_FullScreenToggleButton.tsx +3 -1
  19. package/src/buttons/MRT_ToggleDensePaddingButton.tsx +3 -1
  20. package/src/buttons/MRT_ToggleFiltersButton.tsx +2 -2
  21. package/src/buttons/MRT_ToggleRowActionMenuButton.tsx +17 -11
  22. package/src/buttons/MRT_ToggleSearchButton.tsx +1 -1
  23. package/src/footer/MRT_TableFooter.tsx +6 -1
  24. package/src/footer/MRT_TableFooterCell.tsx +7 -2
  25. package/src/head/MRT_TableHeadCell.tsx +5 -4
  26. package/src/head/MRT_TableHeadCellActions.tsx +6 -1
  27. package/src/head/MRT_TableHeadRow.tsx +7 -2
  28. package/src/inputs/MRT_EditCellTextField.tsx +3 -1
  29. package/src/inputs/MRT_SearchTextField.tsx +1 -2
  30. package/src/inputs/MRT_SelectCheckbox.tsx +1 -2
  31. package/src/table/MRT_Table.tsx +7 -2
  32. package/src/table/MRT_TableContainer.tsx +19 -5
  33. package/src/toolbar/MRT_ToolbarBottom.tsx +2 -3
  34. package/src/toolbar/MRT_ToolbarTop.tsx +2 -3
  35. package/src/useMRT.tsx +38 -23
package/src/useMRT.tsx CHANGED
@@ -27,9 +27,6 @@ import { MaterialReactTableProps } from './MaterialReactTable';
27
27
  export type UseMRT<D extends {} = {}> = MaterialReactTableProps<D> & {
28
28
  anyRowsCanExpand: boolean;
29
29
  anyRowsExpanded: boolean;
30
- currentEditingRow: MRT_Row<D> | null;
31
- densePadding: boolean;
32
- fullScreen: boolean;
33
30
  icons: MRT_Icons;
34
31
  localization: MRT_Localization;
35
32
  setCurrentEditingRow: (currentRowEditingId: MRT_Row<D> | null) => void;
@@ -37,8 +34,6 @@ export type UseMRT<D extends {} = {}> = MaterialReactTableProps<D> & {
37
34
  setFullScreen: (fullScreen: boolean) => void;
38
35
  setShowFilters: (showFilters: boolean) => void;
39
36
  setShowSearch: (showSearch: boolean) => void;
40
- showFilters: boolean;
41
- showSearch: boolean;
42
37
  tableInstance: MRT_TableInstance<D>;
43
38
  };
44
39
 
@@ -61,18 +56,6 @@ export const MaterialReactTableProvider = <D extends {}>(
61
56
  if (props.enableColumnResizing)
62
57
  hooks.unshift(useResizeColumns, useFlexLayout);
63
58
 
64
- const tableInstance = useTable<D>(props, ...hooks) as MRT_TableInstance<D>;
65
-
66
- const anyRowsCanExpand = useMemo(
67
- // @ts-ignore
68
- () => tableInstance.rows.some((row: MRT_Row) => row.canExpand),
69
- [tableInstance.rows],
70
- );
71
- const anyRowsExpanded = useMemo(
72
- // @ts-ignore
73
- () => tableInstance.rows.some((row: MRT_Row) => row.isExpanded),
74
- [tableInstance.rows],
75
- );
76
59
  const [currentEditingRow, setCurrentEditingRow] = useState<MRT_Row | null>(
77
60
  null,
78
61
  );
@@ -86,7 +69,44 @@ export const MaterialReactTableProvider = <D extends {}>(
86
69
  props.initialState?.showFilters ?? false,
87
70
  );
88
71
  const [showSearch, setShowSearch] = useState(
89
- props.initialState?.showSearchTextField ?? false,
72
+ props.initialState?.showSearch ?? false,
73
+ );
74
+
75
+ const tableInstance = useTable<D>(
76
+ {
77
+ ...props,
78
+ useControlledState: (state) =>
79
+ useMemo(
80
+ () => ({
81
+ ...state,
82
+ currentEditingRow,
83
+ densePadding,
84
+ fullScreen,
85
+ showFilters,
86
+ showSearch,
87
+ //@ts-ignore
88
+ ...props?.useControlledState?.(state),
89
+ }),
90
+ [
91
+ currentEditingRow,
92
+ densePadding,
93
+ fullScreen,
94
+ showFilters,
95
+ showSearch,
96
+ state,
97
+ ],
98
+ ),
99
+ },
100
+ ...hooks,
101
+ ) as MRT_TableInstance<D>;
102
+
103
+ const anyRowsCanExpand = useMemo(
104
+ () => tableInstance.rows.some((row) => row.canExpand),
105
+ [tableInstance.rows],
106
+ );
107
+ const anyRowsExpanded = useMemo(
108
+ () => tableInstance.rows.some((row) => row.isExpanded),
109
+ [tableInstance.rows],
90
110
  );
91
111
 
92
112
  return (
@@ -95,16 +115,11 @@ export const MaterialReactTableProvider = <D extends {}>(
95
115
  ...props,
96
116
  anyRowsCanExpand,
97
117
  anyRowsExpanded,
98
- currentEditingRow,
99
- densePadding,
100
118
  setCurrentEditingRow,
101
119
  setDensePadding,
102
- fullScreen,
103
120
  setFullScreen,
104
121
  setShowFilters,
105
122
  setShowSearch,
106
- showFilters,
107
- showSearch,
108
123
  //@ts-ignore
109
124
  tableInstance,
110
125
  }}