material-react-table 0.41.0 → 1.0.0-beta.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/README.md CHANGED
@@ -21,6 +21,8 @@
21
21
 
22
22
  ## About
23
23
 
24
+ > Now in Beta!
25
+
24
26
  __Built with [Material UI <sup>V5</sup>](https://mui.com) and [TanStack Table <sup>V8</sup>](https://tanstack.com/table/v8)__
25
27
 
26
28
  _Quickly Create React Data Tables with Material Design_
package/dist/cjs/index.js CHANGED
@@ -1030,7 +1030,7 @@ const MRT_GlobalFilterTextField = ({ table, }) => {
1030
1030
  const textFieldProps = muiSearchTextFieldProps instanceof Function
1031
1031
  ? muiSearchTextFieldProps({ table })
1032
1032
  : muiSearchTextFieldProps;
1033
- return (React__default["default"].createElement(material.Collapse, { in: showGlobalFilter, orientation: "horizontal" },
1033
+ return (React__default["default"].createElement(material.Collapse, { in: showGlobalFilter, orientation: "horizontal", unmountOnExit: true, mountOnEnter: true },
1034
1034
  React__default["default"].createElement(material.TextField, Object.assign({ placeholder: localization.search, onChange: handleChange, value: searchValue !== null && searchValue !== void 0 ? searchValue : '', variant: "standard", InputProps: {
1035
1035
  startAdornment: enableGlobalFilterModes ? (React__default["default"].createElement(material.InputAdornment, { position: "start" },
1036
1036
  React__default["default"].createElement(material.Tooltip, { arrow: true, title: localization.changeSearchMode },
@@ -1079,11 +1079,11 @@ const MRT_TablePagination = ({ table, position }) => {
1079
1079
  return (React__default["default"].createElement(material.TablePagination, Object.assign({ SelectProps: {
1080
1080
  sx: { m: '0 1rem 0 1ch' },
1081
1081
  MenuProps: { MenuListProps: { disablePadding: true } },
1082
- }, component: "div", count: totalRowCount, onPageChange: (_, newPage) => setPageIndex(newPage), onRowsPerPageChange: handleChangeRowsPerPage, page: pageIndex, rowsPerPage: pageSize, rowsPerPageOptions: [5, 10, 15, 20, 25, 30, 50, 100], showFirstButton: showFirstLastPageButtons, showLastButton: showFirstLastPageButtons }, tablePaginationProps, { sx: (theme) => (Object.assign({ m: '0 0.5rem', mt: position === 'top' &&
1082
+ }, component: "div", count: totalRowCount, onPageChange: (_, newPage) => setPageIndex(newPage), onRowsPerPageChange: handleChangeRowsPerPage, page: pageIndex, rowsPerPage: pageSize, rowsPerPageOptions: [5, 10, 15, 20, 25, 30, 50, 100], showFirstButton: showFirstLastPageButtons, showLastButton: showFirstLastPageButtons }, tablePaginationProps, { sx: (theme) => (Object.assign({ mt: position === 'top' &&
1083
1083
  enableToolbarInternalActions &&
1084
1084
  !showGlobalFilter
1085
1085
  ? '3.5rem'
1086
- : undefined, position: 'relative', zIndex: 2 }, ((tablePaginationProps === null || tablePaginationProps === void 0 ? void 0 : tablePaginationProps.sx) instanceof Function
1086
+ : '-0.25rem', position: 'relative', zIndex: 2 }, ((tablePaginationProps === null || tablePaginationProps === void 0 ? void 0 : tablePaginationProps.sx) instanceof Function
1087
1087
  ? tablePaginationProps.sx(theme)
1088
1088
  : tablePaginationProps === null || tablePaginationProps === void 0 ? void 0 : tablePaginationProps.sx))) })));
1089
1089
  };
@@ -1191,7 +1191,7 @@ const MRT_ToggleGlobalFilterButton = (_a) => {
1191
1191
 
1192
1192
  const MRT_ToolbarInternalButtons = ({ table }) => {
1193
1193
  var _a;
1194
- const { options: { enableColumnFilters, enableColumnOrdering, enableDensityToggle, enableFilters, enableFullScreenToggle, enableGlobalFilter, enableHiding, enablePinning, positionGlobalFilter, renderToolbarInternalActions, }, } = table;
1194
+ const { options: { enableColumnFilters, enableColumnOrdering, enableDensityToggle, enableFilters, enableFullScreenToggle, enableGlobalFilter, enableHiding, enablePinning, initialState, renderToolbarInternalActions, }, } = table;
1195
1195
  return (React__default["default"].createElement(material.Box, { sx: {
1196
1196
  alignItems: 'center',
1197
1197
  display: 'flex',
@@ -1199,8 +1199,9 @@ const MRT_ToolbarInternalButtons = ({ table }) => {
1199
1199
  } }, (_a = renderToolbarInternalActions === null || renderToolbarInternalActions === void 0 ? void 0 : renderToolbarInternalActions({
1200
1200
  table,
1201
1201
  })) !== null && _a !== void 0 ? _a : (React__default["default"].createElement(React__default["default"].Fragment, null,
1202
- enableGlobalFilter && positionGlobalFilter === 'right' && (React__default["default"].createElement(MRT_GlobalFilterTextField, { table: table })),
1203
- enableFilters && enableGlobalFilter && (React__default["default"].createElement(MRT_ToggleGlobalFilterButton, { table: table })),
1202
+ enableFilters &&
1203
+ enableGlobalFilter &&
1204
+ !(initialState === null || initialState === void 0 ? void 0 : initialState.showGlobalFilter) && (React__default["default"].createElement(MRT_ToggleGlobalFilterButton, { table: table })),
1204
1205
  enableFilters && enableColumnFilters && (React__default["default"].createElement(MRT_ToggleFiltersButton, { table: table })),
1205
1206
  (enableHiding || enableColumnOrdering || enablePinning) && (React__default["default"].createElement(MRT_ShowHideColumnsButton, { table: table })),
1206
1207
  enableDensityToggle && (React__default["default"].createElement(MRT_ToggleDensePaddingButton, { table: table })),
@@ -1274,7 +1275,9 @@ const MRT_TopToolbar = ({ table }) => {
1274
1275
  width: '100%',
1275
1276
  } },
1276
1277
  enableGlobalFilter && positionGlobalFilter === 'left' && (React__default["default"].createElement(MRT_GlobalFilterTextField, { table: table })), (_a = renderTopToolbarCustomActions === null || renderTopToolbarCustomActions === void 0 ? void 0 : renderTopToolbarCustomActions({ table })) !== null && _a !== void 0 ? _a : React__default["default"].createElement("span", null),
1277
- enableToolbarInternalActions ? (React__default["default"].createElement(MRT_ToolbarInternalButtons, { table: table })) : (enableGlobalFilter &&
1278
+ enableToolbarInternalActions ? (React__default["default"].createElement(material.Box, { sx: { display: 'flex', flexWrap: 'wrap' } },
1279
+ enableGlobalFilter && positionGlobalFilter === 'right' && (React__default["default"].createElement(MRT_GlobalFilterTextField, { table: table })),
1280
+ React__default["default"].createElement(MRT_ToolbarInternalButtons, { table: table }))) : (enableGlobalFilter &&
1278
1281
  positionGlobalFilter === 'right' && (React__default["default"].createElement(MRT_GlobalFilterTextField, { table: table })))),
1279
1282
  enablePagination &&
1280
1283
  ['top', 'both'].includes(positionPagination !== null && positionPagination !== void 0 ? positionPagination : '') && (React__default["default"].createElement(MRT_TablePagination, { table: table, position: "top" })),
@@ -1302,8 +1305,11 @@ const MRT_BottomToolbar = ({ table }) => {
1302
1305
  positionToolbarAlertBanner === 'bottom' && (React__default["default"].createElement(MRT_ToolbarAlertBanner, { table: table })),
1303
1306
  ['both', 'bottom'].includes(positionToolbarDropZone !== null && positionToolbarDropZone !== void 0 ? positionToolbarDropZone : '') && (React__default["default"].createElement(MRT_ToolbarDropZone, { table: table })),
1304
1307
  React__default["default"].createElement(material.Box, { sx: {
1308
+ alignItems: 'flex-start',
1309
+ boxSizing: 'border-box',
1305
1310
  display: 'flex',
1306
1311
  justifyContent: 'space-between',
1312
+ p: '0.5rem',
1307
1313
  width: '100%',
1308
1314
  } },
1309
1315
  renderBottomToolbarCustomActions ? (renderBottomToolbarCustomActions({ table })) : (React__default["default"].createElement("span", null)),