material-react-table 0.26.4 → 0.27.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.
@@ -182,7 +182,8 @@ var MRT_ExpandAllButton = function MRT_ExpandAllButton(_ref) {
182
182
  }, iconButtonProps, {
183
183
  sx: _extends({
184
184
  height: density === 'compact' ? '1.75rem' : '2.25rem',
185
- width: density === 'compact' ? '1.75rem' : '2.25rem'
185
+ width: density === 'compact' ? '1.75rem' : '2.25rem',
186
+ mt: density !== 'compact' ? '-0.25rem' : undefined
186
187
  }, iconButtonProps == null ? void 0 : iconButtonProps.sx)
187
188
  }), React__default.createElement(KeyboardDoubleArrowDownIcon, {
188
189
  style: {
@@ -239,7 +240,7 @@ var MRT_ExpandButton = function MRT_ExpandButton(_ref) {
239
240
  };
240
241
 
241
242
  var MRT_FilterOptionMenu = function MRT_FilterOptionMenu(_ref) {
242
- var _columnDef$enabledCol;
243
+ var _columnDef$columnFilt;
243
244
 
244
245
  var anchorEl = _ref.anchorEl,
245
246
  header = _ref.header,
@@ -249,7 +250,7 @@ var MRT_FilterOptionMenu = function MRT_FilterOptionMenu(_ref) {
249
250
  var getState = table.getState,
250
251
  _table$options = table.options,
251
252
  enabledGlobalFilterOptions = _table$options.enabledGlobalFilterOptions,
252
- enabledColumnFilterOptions = _table$options.enabledColumnFilterOptions,
253
+ columnFilterModeOptions = _table$options.columnFilterModeOptions,
253
254
  localization = _table$options.localization,
254
255
  setCurrentFilterFns = table.setCurrentFilterFns,
255
256
  setCurrentGlobalFilterFn = table.setCurrentGlobalFilterFn;
@@ -265,7 +266,7 @@ var MRT_FilterOptionMenu = function MRT_FilterOptionMenu(_ref) {
265
266
  var _ref3 = column != null ? column : {},
266
267
  columnDef = _ref3.columnDef;
267
268
 
268
- var allowedColumnFilterOptions = (_columnDef$enabledCol = columnDef == null ? void 0 : columnDef.enabledColumnFilterOptions) != null ? _columnDef$enabledCol : enabledColumnFilterOptions;
269
+ var allowedColumnFilterOptions = (_columnDef$columnFilt = columnDef == null ? void 0 : columnDef.columnFilterModeOptions) != null ? _columnDef$columnFilt : columnFilterModeOptions;
269
270
  var filterOptions = React.useMemo(function () {
270
271
  return [{
271
272
  option: 'fuzzy',
@@ -987,7 +988,7 @@ var commonListItemStyles = {
987
988
  alignItems: 'center'
988
989
  };
989
990
  var MRT_ColumnActionMenu = function MRT_ColumnActionMenu(_ref) {
990
- var _columnDef$enabledCol, _localization$sortByC, _localization$sortByC2, _localization$filterB, _localization, _localization$hideCol, _localization$showAll;
991
+ var _columnDef$columnFilt, _localization$sortByC, _localization$sortByC2, _localization$filterB, _localization, _localization$hideCol, _localization$showAll;
991
992
 
992
993
  var anchorEl = _ref.anchorEl,
993
994
  header = _ref.header,
@@ -1004,7 +1005,7 @@ var MRT_ColumnActionMenu = function MRT_ColumnActionMenu(_ref) {
1004
1005
  enableHiding = _table$options.enableHiding,
1005
1006
  enablePinning = _table$options.enablePinning,
1006
1007
  enableSorting = _table$options.enableSorting,
1007
- enabledColumnFilterOptions = _table$options.enabledColumnFilterOptions,
1008
+ columnFilterModeOptions = _table$options.columnFilterModeOptions,
1008
1009
  _table$options$icons = _table$options.icons,
1009
1010
  ArrowRightIcon = _table$options$icons.ArrowRightIcon,
1010
1011
  ClearAllIcon = _table$options$icons.ClearAllIcon,
@@ -1105,7 +1106,7 @@ var MRT_ColumnActionMenu = function MRT_ColumnActionMenu(_ref) {
1105
1106
  };
1106
1107
 
1107
1108
  var isSelectFilter = !!columnDef.filterSelectOptions;
1108
- var allowedColumnFilterOptions = (_columnDef$enabledCol = columnDef == null ? void 0 : columnDef.enabledColumnFilterOptions) != null ? _columnDef$enabledCol : enabledColumnFilterOptions;
1109
+ var allowedColumnFilterOptions = (_columnDef$columnFilt = columnDef == null ? void 0 : columnDef.columnFilterModeOptions) != null ? _columnDef$columnFilt : columnFilterModeOptions;
1109
1110
  var showFilterModeSubMenu = enableColumnFilterChangeMode && columnDef.enableColumnFilterChangeMode !== false && !isSelectFilter && (allowedColumnFilterOptions === undefined || !!(allowedColumnFilterOptions != null && allowedColumnFilterOptions.length));
1110
1111
  return React__default.createElement(material.Menu, {
1111
1112
  anchorEl: anchorEl,
@@ -1452,172 +1453,14 @@ var MRT_SelectCheckbox = function MRT_SelectCheckbox(_ref) {
1452
1453
  }, checkboxProps, {
1453
1454
  sx: function sx(theme) {
1454
1455
  return _extends({
1455
- height: density === 'compact' ? '1.5rem' : '2rem',
1456
- width: density === 'compact' ? '1.5rem' : '2rem',
1457
- m: '-1re.m'
1456
+ height: density === 'compact' ? '1.75rem' : '2.5rem',
1457
+ width: density === 'compact' ? '1.75rem' : '2.5rem',
1458
+ m: density !== 'compact' ? '-0.4rem' : undefined
1458
1459
  }, (checkboxProps == null ? void 0 : checkboxProps.sx) instanceof Function ? checkboxProps.sx(theme) : checkboxProps == null ? void 0 : checkboxProps.sx);
1459
1460
  }
1460
1461
  })));
1461
1462
  };
1462
1463
 
1463
- var _excluded = ["table"];
1464
- var MRT_FullScreenToggleButton = function MRT_FullScreenToggleButton(_ref) {
1465
- var table = _ref.table,
1466
- rest = _objectWithoutPropertiesLoose(_ref, _excluded);
1467
-
1468
- var getState = table.getState,
1469
- _table$options = table.options,
1470
- _table$options$icons = _table$options.icons,
1471
- FullscreenExitIcon = _table$options$icons.FullscreenExitIcon,
1472
- FullscreenIcon = _table$options$icons.FullscreenIcon,
1473
- localization = _table$options.localization,
1474
- setIsFullScreen = table.setIsFullScreen;
1475
-
1476
- var _getState = getState(),
1477
- isFullScreen = _getState.isFullScreen;
1478
-
1479
- var handleToggleFullScreen = function handleToggleFullScreen() {
1480
- setIsFullScreen(!isFullScreen);
1481
- };
1482
-
1483
- return React__default.createElement(material.Tooltip, {
1484
- arrow: true,
1485
- title: localization.toggleFullScreen
1486
- }, React__default.createElement(material.IconButton, Object.assign({
1487
- "aria-label": localization.showHideFilters,
1488
- onClick: handleToggleFullScreen
1489
- }, rest), isFullScreen ? React__default.createElement(FullscreenExitIcon, null) : React__default.createElement(FullscreenIcon, null)));
1490
- };
1491
-
1492
- var _excluded$1 = ["table"];
1493
- var MRT_ShowHideColumnsButton = function MRT_ShowHideColumnsButton(_ref) {
1494
- var table = _ref.table,
1495
- rest = _objectWithoutPropertiesLoose(_ref, _excluded$1);
1496
-
1497
- var _table$options = table.options,
1498
- ViewColumnIcon = _table$options.icons.ViewColumnIcon,
1499
- localization = _table$options.localization;
1500
-
1501
- var _useState = React.useState(null),
1502
- anchorEl = _useState[0],
1503
- setAnchorEl = _useState[1];
1504
-
1505
- var handleClick = function handleClick(event) {
1506
- setAnchorEl(event.currentTarget);
1507
- };
1508
-
1509
- return React__default.createElement(React__default.Fragment, null, React__default.createElement(material.Tooltip, {
1510
- arrow: true,
1511
- title: localization.showHideColumns
1512
- }, React__default.createElement(material.IconButton, Object.assign({
1513
- "aria-label": localization.showHideColumns,
1514
- onClick: handleClick
1515
- }, rest), React__default.createElement(ViewColumnIcon, null))), React__default.createElement(MRT_ShowHideColumnsMenu, {
1516
- anchorEl: anchorEl,
1517
- setAnchorEl: setAnchorEl,
1518
- table: table
1519
- }));
1520
- };
1521
-
1522
- var _excluded$2 = ["table"];
1523
- var MRT_ToggleDensePaddingButton = function MRT_ToggleDensePaddingButton(_ref) {
1524
- var table = _ref.table,
1525
- rest = _objectWithoutPropertiesLoose(_ref, _excluded$2);
1526
-
1527
- var getState = table.getState,
1528
- _table$options = table.options,
1529
- _table$options$icons = _table$options.icons,
1530
- DensityLargeIcon = _table$options$icons.DensityLargeIcon,
1531
- DensityMediumIcon = _table$options$icons.DensityMediumIcon,
1532
- DensitySmallIcon = _table$options$icons.DensitySmallIcon,
1533
- localization = _table$options.localization,
1534
- setDensity = table.setDensity;
1535
-
1536
- var _getState = getState(),
1537
- density = _getState.density;
1538
-
1539
- var handleToggleDensePadding = function handleToggleDensePadding() {
1540
- var nextDensity = density === 'comfortable' ? 'compact' : density === 'compact' ? 'spacious' : 'comfortable';
1541
- setDensity(nextDensity);
1542
- };
1543
-
1544
- return React__default.createElement(material.Tooltip, {
1545
- arrow: true,
1546
- title: localization.toggleDensity
1547
- }, React__default.createElement(material.IconButton, Object.assign({
1548
- "aria-label": localization.toggleDensity,
1549
- onClick: handleToggleDensePadding
1550
- }, rest), density === 'compact' ? React__default.createElement(DensitySmallIcon, null) : density === 'comfortable' ? React__default.createElement(DensityMediumIcon, null) : React__default.createElement(DensityLargeIcon, null)));
1551
- };
1552
-
1553
- var _excluded$3 = ["table"];
1554
- var MRT_ToggleFiltersButton = function MRT_ToggleFiltersButton(_ref) {
1555
- var table = _ref.table,
1556
- rest = _objectWithoutPropertiesLoose(_ref, _excluded$3);
1557
-
1558
- var getState = table.getState,
1559
- _table$options = table.options,
1560
- _table$options$icons = _table$options.icons,
1561
- FilterListIcon = _table$options$icons.FilterListIcon,
1562
- FilterListOffIcon = _table$options$icons.FilterListOffIcon,
1563
- localization = _table$options.localization,
1564
- setShowFilters = table.setShowFilters;
1565
-
1566
- var _getState = getState(),
1567
- showColumnFilters = _getState.showColumnFilters;
1568
-
1569
- var handleToggleShowFilters = function handleToggleShowFilters() {
1570
- setShowFilters(!showColumnFilters);
1571
- };
1572
-
1573
- return React__default.createElement(material.Tooltip, {
1574
- arrow: true,
1575
- title: localization.showHideFilters
1576
- }, React__default.createElement(material.IconButton, Object.assign({
1577
- "aria-label": localization.showHideFilters,
1578
- onClick: handleToggleShowFilters
1579
- }, rest), showColumnFilters ? React__default.createElement(FilterListOffIcon, null) : React__default.createElement(FilterListIcon, null)));
1580
- };
1581
-
1582
- var _excluded$4 = ["table"];
1583
- var MRT_ToggleGlobalFilterButton = function MRT_ToggleGlobalFilterButton(_ref) {
1584
- var table = _ref.table,
1585
- rest = _objectWithoutPropertiesLoose(_ref, _excluded$4);
1586
-
1587
- var getState = table.getState,
1588
- _table$options = table.options,
1589
- _table$options$icons = _table$options.icons,
1590
- SearchIcon = _table$options$icons.SearchIcon,
1591
- SearchOffIcon = _table$options$icons.SearchOffIcon,
1592
- tableId = _table$options.tableId,
1593
- localization = _table$options.localization,
1594
- muiSearchTextFieldProps = _table$options.muiSearchTextFieldProps,
1595
- setShowGlobalFilter = table.setShowGlobalFilter;
1596
-
1597
- var _getState = getState(),
1598
- showGlobalFilter = _getState.showGlobalFilter;
1599
-
1600
- var textFieldProps = muiSearchTextFieldProps instanceof Function ? muiSearchTextFieldProps({
1601
- table: table
1602
- }) : muiSearchTextFieldProps;
1603
-
1604
- var handleToggleSearch = function handleToggleSearch() {
1605
- setShowGlobalFilter(!showGlobalFilter);
1606
- setTimeout(function () {
1607
- var _document$getElementB, _textFieldProps$id;
1608
-
1609
- return (_document$getElementB = document.getElementById((_textFieldProps$id = textFieldProps == null ? void 0 : textFieldProps.id) != null ? _textFieldProps$id : "mrt-" + tableId + "-search-text-field")) == null ? void 0 : _document$getElementB.focus();
1610
- }, 200);
1611
- };
1612
-
1613
- return React__default.createElement(material.Tooltip, {
1614
- arrow: true,
1615
- title: localization.showHideSearch
1616
- }, React__default.createElement(material.IconButton, Object.assign({
1617
- onClick: handleToggleSearch
1618
- }, rest), showGlobalFilter ? React__default.createElement(SearchOffIcon, null) : React__default.createElement(SearchIcon, null)));
1619
- };
1620
-
1621
1464
  var MRT_GlobalFilterTextField = function MRT_GlobalFilterTextField(_ref) {
1622
1465
  var _localization$clearSe;
1623
1466
 
@@ -1711,47 +1554,37 @@ var MRT_GlobalFilterTextField = function MRT_GlobalFilterTextField(_ref) {
1711
1554
  }));
1712
1555
  };
1713
1556
 
1714
- var MRT_ToolbarInternalButtons = function MRT_ToolbarInternalButtons(_ref) {
1715
- var _renderToolbarInterna;
1557
+ var MRT_LinearProgressBar = function MRT_LinearProgressBar(_ref) {
1558
+ var isTopToolbar = _ref.isTopToolbar,
1559
+ table = _ref.table;
1560
+ var muiLinearProgressProps = table.options.muiLinearProgressProps,
1561
+ getState = table.getState;
1716
1562
 
1717
- var table = _ref.table;
1718
- var _table$options = table.options,
1719
- enableColumnFilters = _table$options.enableColumnFilters,
1720
- enableColumnOrdering = _table$options.enableColumnOrdering,
1721
- enableDensityToggle = _table$options.enableDensityToggle,
1722
- enableFilters = _table$options.enableFilters,
1723
- enableFullScreenToggle = _table$options.enableFullScreenToggle,
1724
- enableGlobalFilter = _table$options.enableGlobalFilter,
1725
- enableHiding = _table$options.enableHiding,
1726
- enablePinning = _table$options.enablePinning,
1727
- positionGlobalFilter = _table$options.positionGlobalFilter,
1728
- renderToolbarInternalActions = _table$options.renderToolbarInternalActions;
1729
- return React__default.createElement(material.Box, {
1563
+ var _getState = getState(),
1564
+ isLoading = _getState.isLoading,
1565
+ showProgressBars = _getState.showProgressBars;
1566
+
1567
+ var linearProgressProps = muiLinearProgressProps instanceof Function ? muiLinearProgressProps({
1568
+ isTopToolbar: isTopToolbar,
1569
+ table: table
1570
+ }) : muiLinearProgressProps;
1571
+ return React__default.createElement(material.Collapse, {
1572
+ "in": isLoading || showProgressBars,
1573
+ mountOnEnter: true,
1574
+ unmountOnExit: true,
1730
1575
  sx: {
1731
- alignItems: 'center',
1732
- display: 'flex',
1733
- zIndex: 3
1576
+ bottom: isTopToolbar ? 0 : undefined,
1577
+ position: 'absolute',
1578
+ top: !isTopToolbar ? 0 : undefined,
1579
+ width: '100%'
1734
1580
  }
1735
- }, (_renderToolbarInterna = renderToolbarInternalActions == null ? void 0 : renderToolbarInternalActions({
1736
- MRT_FullScreenToggleButton: MRT_FullScreenToggleButton,
1737
- MRT_ShowHideColumnsButton: MRT_ShowHideColumnsButton,
1738
- MRT_ToggleDensePaddingButton: MRT_ToggleDensePaddingButton,
1739
- MRT_ToggleFiltersButton: MRT_ToggleFiltersButton,
1740
- MRT_ToggleGlobalFilterButton: MRT_ToggleGlobalFilterButton,
1741
- table: table
1742
- })) != null ? _renderToolbarInterna : React__default.createElement(React__default.Fragment, null, enableGlobalFilter && positionGlobalFilter === 'right' && React__default.createElement(MRT_GlobalFilterTextField, {
1743
- table: table
1744
- }), enableFilters && enableGlobalFilter && React__default.createElement(MRT_ToggleGlobalFilterButton, {
1745
- table: table
1746
- }), enableFilters && enableColumnFilters && React__default.createElement(MRT_ToggleFiltersButton, {
1747
- table: table
1748
- }), (enableHiding || enableColumnOrdering || enablePinning) && React__default.createElement(MRT_ShowHideColumnsButton, {
1749
- table: table
1750
- }), enableDensityToggle && React__default.createElement(MRT_ToggleDensePaddingButton, {
1751
- table: table
1752
- }), enableFullScreenToggle && React__default.createElement(MRT_FullScreenToggleButton, {
1753
- table: table
1754
- })));
1581
+ }, React__default.createElement(material.LinearProgress, Object.assign({
1582
+ "aria-label": "Loading",
1583
+ "aria-busy": "true",
1584
+ sx: {
1585
+ position: 'relative'
1586
+ }
1587
+ }, linearProgressProps)));
1755
1588
  };
1756
1589
 
1757
1590
  var MRT_TablePagination = function MRT_TablePagination(_ref) {
@@ -1876,42 +1709,211 @@ var MRT_ToolbarAlertBanner = function MRT_ToolbarAlertBanner(_ref) {
1876
1709
  }, alertProps == null ? void 0 : alertProps.children, (alertProps == null ? void 0 : alertProps.children) && (selectMessage || groupedByMessage) && React__default.createElement("br", null), selectMessage, selectMessage && groupedByMessage && React__default.createElement("br", null), groupedByMessage)));
1877
1710
  };
1878
1711
 
1879
- var MRT_LinearProgressBar = function MRT_LinearProgressBar(_ref) {
1880
- var isTopToolbar = _ref.isTopToolbar,
1881
- table = _ref.table;
1882
- var muiLinearProgressProps = table.options.muiLinearProgressProps,
1883
- getState = table.getState;
1712
+ var _excluded = ["table"];
1713
+ var MRT_FullScreenToggleButton = function MRT_FullScreenToggleButton(_ref) {
1714
+ var table = _ref.table,
1715
+ rest = _objectWithoutPropertiesLoose(_ref, _excluded);
1716
+
1717
+ var getState = table.getState,
1718
+ _table$options = table.options,
1719
+ _table$options$icons = _table$options.icons,
1720
+ FullscreenExitIcon = _table$options$icons.FullscreenExitIcon,
1721
+ FullscreenIcon = _table$options$icons.FullscreenIcon,
1722
+ localization = _table$options.localization,
1723
+ setIsFullScreen = table.setIsFullScreen;
1884
1724
 
1885
1725
  var _getState = getState(),
1886
- isLoading = _getState.isLoading,
1887
- showProgressBars = _getState.showProgressBars;
1726
+ isFullScreen = _getState.isFullScreen;
1888
1727
 
1889
- var linearProgressProps = muiLinearProgressProps instanceof Function ? muiLinearProgressProps({
1890
- isTopToolbar: isTopToolbar,
1728
+ var handleToggleFullScreen = function handleToggleFullScreen() {
1729
+ setIsFullScreen(!isFullScreen);
1730
+ };
1731
+
1732
+ return React__default.createElement(material.Tooltip, {
1733
+ arrow: true,
1734
+ title: localization.toggleFullScreen
1735
+ }, React__default.createElement(material.IconButton, Object.assign({
1736
+ "aria-label": localization.showHideFilters,
1737
+ onClick: handleToggleFullScreen
1738
+ }, rest), isFullScreen ? React__default.createElement(FullscreenExitIcon, null) : React__default.createElement(FullscreenIcon, null)));
1739
+ };
1740
+
1741
+ var _excluded$1 = ["table"];
1742
+ var MRT_ShowHideColumnsButton = function MRT_ShowHideColumnsButton(_ref) {
1743
+ var table = _ref.table,
1744
+ rest = _objectWithoutPropertiesLoose(_ref, _excluded$1);
1745
+
1746
+ var _table$options = table.options,
1747
+ ViewColumnIcon = _table$options.icons.ViewColumnIcon,
1748
+ localization = _table$options.localization;
1749
+
1750
+ var _useState = React.useState(null),
1751
+ anchorEl = _useState[0],
1752
+ setAnchorEl = _useState[1];
1753
+
1754
+ var handleClick = function handleClick(event) {
1755
+ setAnchorEl(event.currentTarget);
1756
+ };
1757
+
1758
+ return React__default.createElement(React__default.Fragment, null, React__default.createElement(material.Tooltip, {
1759
+ arrow: true,
1760
+ title: localization.showHideColumns
1761
+ }, React__default.createElement(material.IconButton, Object.assign({
1762
+ "aria-label": localization.showHideColumns,
1763
+ onClick: handleClick
1764
+ }, rest), React__default.createElement(ViewColumnIcon, null))), React__default.createElement(MRT_ShowHideColumnsMenu, {
1765
+ anchorEl: anchorEl,
1766
+ setAnchorEl: setAnchorEl,
1891
1767
  table: table
1892
- }) : muiLinearProgressProps;
1893
- return React__default.createElement(material.Collapse, {
1894
- "in": isLoading || showProgressBars,
1895
- mountOnEnter: true,
1896
- unmountOnExit: true,
1897
- sx: {
1898
- bottom: isTopToolbar ? 0 : undefined,
1899
- position: 'absolute',
1900
- top: !isTopToolbar ? 0 : undefined,
1901
- width: '100%'
1902
- }
1903
- }, React__default.createElement(material.LinearProgress, Object.assign({
1904
- "aria-label": "Loading",
1905
- "aria-busy": "true",
1768
+ }));
1769
+ };
1770
+
1771
+ var _excluded$2 = ["table"];
1772
+ var MRT_ToggleDensePaddingButton = function MRT_ToggleDensePaddingButton(_ref) {
1773
+ var table = _ref.table,
1774
+ rest = _objectWithoutPropertiesLoose(_ref, _excluded$2);
1775
+
1776
+ var getState = table.getState,
1777
+ _table$options = table.options,
1778
+ _table$options$icons = _table$options.icons,
1779
+ DensityLargeIcon = _table$options$icons.DensityLargeIcon,
1780
+ DensityMediumIcon = _table$options$icons.DensityMediumIcon,
1781
+ DensitySmallIcon = _table$options$icons.DensitySmallIcon,
1782
+ localization = _table$options.localization,
1783
+ setDensity = table.setDensity;
1784
+
1785
+ var _getState = getState(),
1786
+ density = _getState.density;
1787
+
1788
+ var handleToggleDensePadding = function handleToggleDensePadding() {
1789
+ var nextDensity = density === 'comfortable' ? 'compact' : density === 'compact' ? 'spacious' : 'comfortable';
1790
+ setDensity(nextDensity);
1791
+ };
1792
+
1793
+ return React__default.createElement(material.Tooltip, {
1794
+ arrow: true,
1795
+ title: localization.toggleDensity
1796
+ }, React__default.createElement(material.IconButton, Object.assign({
1797
+ "aria-label": localization.toggleDensity,
1798
+ onClick: handleToggleDensePadding
1799
+ }, rest), density === 'compact' ? React__default.createElement(DensitySmallIcon, null) : density === 'comfortable' ? React__default.createElement(DensityMediumIcon, null) : React__default.createElement(DensityLargeIcon, null)));
1800
+ };
1801
+
1802
+ var _excluded$3 = ["table"];
1803
+ var MRT_ToggleFiltersButton = function MRT_ToggleFiltersButton(_ref) {
1804
+ var table = _ref.table,
1805
+ rest = _objectWithoutPropertiesLoose(_ref, _excluded$3);
1806
+
1807
+ var getState = table.getState,
1808
+ _table$options = table.options,
1809
+ _table$options$icons = _table$options.icons,
1810
+ FilterListIcon = _table$options$icons.FilterListIcon,
1811
+ FilterListOffIcon = _table$options$icons.FilterListOffIcon,
1812
+ localization = _table$options.localization,
1813
+ setShowFilters = table.setShowFilters;
1814
+
1815
+ var _getState = getState(),
1816
+ showColumnFilters = _getState.showColumnFilters;
1817
+
1818
+ var handleToggleShowFilters = function handleToggleShowFilters() {
1819
+ setShowFilters(!showColumnFilters);
1820
+ };
1821
+
1822
+ return React__default.createElement(material.Tooltip, {
1823
+ arrow: true,
1824
+ title: localization.showHideFilters
1825
+ }, React__default.createElement(material.IconButton, Object.assign({
1826
+ "aria-label": localization.showHideFilters,
1827
+ onClick: handleToggleShowFilters
1828
+ }, rest), showColumnFilters ? React__default.createElement(FilterListOffIcon, null) : React__default.createElement(FilterListIcon, null)));
1829
+ };
1830
+
1831
+ var _excluded$4 = ["table"];
1832
+ var MRT_ToggleGlobalFilterButton = function MRT_ToggleGlobalFilterButton(_ref) {
1833
+ var table = _ref.table,
1834
+ rest = _objectWithoutPropertiesLoose(_ref, _excluded$4);
1835
+
1836
+ var getState = table.getState,
1837
+ _table$options = table.options,
1838
+ _table$options$icons = _table$options.icons,
1839
+ SearchIcon = _table$options$icons.SearchIcon,
1840
+ SearchOffIcon = _table$options$icons.SearchOffIcon,
1841
+ tableId = _table$options.tableId,
1842
+ localization = _table$options.localization,
1843
+ muiSearchTextFieldProps = _table$options.muiSearchTextFieldProps,
1844
+ setShowGlobalFilter = table.setShowGlobalFilter;
1845
+
1846
+ var _getState = getState(),
1847
+ showGlobalFilter = _getState.showGlobalFilter;
1848
+
1849
+ var textFieldProps = muiSearchTextFieldProps instanceof Function ? muiSearchTextFieldProps({
1850
+ table: table
1851
+ }) : muiSearchTextFieldProps;
1852
+
1853
+ var handleToggleSearch = function handleToggleSearch() {
1854
+ setShowGlobalFilter(!showGlobalFilter);
1855
+ setTimeout(function () {
1856
+ var _document$getElementB, _textFieldProps$id;
1857
+
1858
+ return (_document$getElementB = document.getElementById((_textFieldProps$id = textFieldProps == null ? void 0 : textFieldProps.id) != null ? _textFieldProps$id : "mrt-" + tableId + "-search-text-field")) == null ? void 0 : _document$getElementB.focus();
1859
+ }, 200);
1860
+ };
1861
+
1862
+ return React__default.createElement(material.Tooltip, {
1863
+ arrow: true,
1864
+ title: localization.showHideSearch
1865
+ }, React__default.createElement(material.IconButton, Object.assign({
1866
+ onClick: handleToggleSearch
1867
+ }, rest), showGlobalFilter ? React__default.createElement(SearchOffIcon, null) : React__default.createElement(SearchIcon, null)));
1868
+ };
1869
+
1870
+ var MRT_ToolbarInternalButtons = function MRT_ToolbarInternalButtons(_ref) {
1871
+ var _renderToolbarInterna;
1872
+
1873
+ var table = _ref.table;
1874
+ var _table$options = table.options,
1875
+ enableColumnFilters = _table$options.enableColumnFilters,
1876
+ enableColumnOrdering = _table$options.enableColumnOrdering,
1877
+ enableDensityToggle = _table$options.enableDensityToggle,
1878
+ enableFilters = _table$options.enableFilters,
1879
+ enableFullScreenToggle = _table$options.enableFullScreenToggle,
1880
+ enableGlobalFilter = _table$options.enableGlobalFilter,
1881
+ enableHiding = _table$options.enableHiding,
1882
+ enablePinning = _table$options.enablePinning,
1883
+ positionGlobalFilter = _table$options.positionGlobalFilter,
1884
+ renderToolbarInternalActions = _table$options.renderToolbarInternalActions;
1885
+ return React__default.createElement(material.Box, {
1906
1886
  sx: {
1907
- position: 'relative'
1887
+ alignItems: 'center',
1888
+ display: 'flex',
1889
+ zIndex: 3
1908
1890
  }
1909
- }, linearProgressProps)));
1891
+ }, (_renderToolbarInterna = renderToolbarInternalActions == null ? void 0 : renderToolbarInternalActions({
1892
+ MRT_FullScreenToggleButton: MRT_FullScreenToggleButton,
1893
+ MRT_ShowHideColumnsButton: MRT_ShowHideColumnsButton,
1894
+ MRT_ToggleDensePaddingButton: MRT_ToggleDensePaddingButton,
1895
+ MRT_ToggleFiltersButton: MRT_ToggleFiltersButton,
1896
+ MRT_ToggleGlobalFilterButton: MRT_ToggleGlobalFilterButton,
1897
+ table: table
1898
+ })) != null ? _renderToolbarInterna : React__default.createElement(React__default.Fragment, null, enableGlobalFilter && positionGlobalFilter === 'right' && React__default.createElement(MRT_GlobalFilterTextField, {
1899
+ table: table
1900
+ }), enableFilters && enableGlobalFilter && React__default.createElement(MRT_ToggleGlobalFilterButton, {
1901
+ table: table
1902
+ }), enableFilters && enableColumnFilters && React__default.createElement(MRT_ToggleFiltersButton, {
1903
+ table: table
1904
+ }), (enableHiding || enableColumnOrdering || enablePinning) && React__default.createElement(MRT_ShowHideColumnsButton, {
1905
+ table: table
1906
+ }), enableDensityToggle && React__default.createElement(MRT_ToggleDensePaddingButton, {
1907
+ table: table
1908
+ }), enableFullScreenToggle && React__default.createElement(MRT_FullScreenToggleButton, {
1909
+ table: table
1910
+ })));
1910
1911
  };
1911
1912
 
1912
1913
  var commonToolbarStyles = function commonToolbarStyles(_ref) {
1913
1914
  var theme = _ref.theme;
1914
1915
  return {
1916
+ alignItems: 'flex-start',
1915
1917
  backgroundColor: material.lighten(theme.palette.background["default"], 0.04),
1916
1918
  backgroundImage: 'none',
1917
1919
  display: 'grid',
@@ -1946,7 +1948,7 @@ var MRT_ToolbarTop = function MRT_ToolbarTop(_ref2) {
1946
1948
  var toolbarProps = muiTableToolbarTopProps instanceof Function ? muiTableToolbarTopProps({
1947
1949
  table: table
1948
1950
  }) : muiTableToolbarTopProps;
1949
- var stackAlertBanner = isMobile || positionToolbarAlertBanner === 'top' && (!!renderToolbarTopCustomActions || showGlobalFilter);
1951
+ var stackAlertBanner = isMobile || !!renderToolbarTopCustomActions || showGlobalFilter;
1950
1952
  return React__default.createElement(material.Toolbar, Object.assign({
1951
1953
  id: "mrt-" + tableId + "-toolbar-top",
1952
1954
  variant: "dense"
@@ -2009,7 +2011,7 @@ var MRT_ToolbarBottom = function MRT_ToolbarBottom(_ref) {
2009
2011
  var toolbarProps = muiTableToolbarBottomProps instanceof Function ? muiTableToolbarBottomProps({
2010
2012
  table: table
2011
2013
  }) : muiTableToolbarBottomProps;
2012
- var stackAlertBanner = isMobile || positionToolbarAlertBanner === 'bottom' && !!renderToolbarBottomCustomActions;
2014
+ var stackAlertBanner = isMobile || !!renderToolbarBottomCustomActions;
2013
2015
  return React__default.createElement(material.Toolbar, Object.assign({
2014
2016
  id: "mrt-" + tableId + "-toolbar-bottom",
2015
2017
  variant: "dense"
@@ -2119,7 +2121,7 @@ var MRT_TableHeadCellColumnActionsButton = function MRT_TableHeadCellColumnActio
2119
2121
  };
2120
2122
 
2121
2123
  var MRT_FilterTextField = function MRT_FilterTextField(_ref) {
2122
- var _currentFilterOption$, _localization$filterB, _columnDef$enabledCol, _currentFilterOption$2, _localization$clearFi, _columnDef$filterSele;
2124
+ var _currentFilterOption$, _localization$filterB, _columnDef$columnFilt, _currentFilterOption$2, _localization$clearFi, _columnDef$filterSele;
2123
2125
 
2124
2126
  var header = _ref.header,
2125
2127
  inputIndex = _ref.inputIndex,
@@ -2127,7 +2129,7 @@ var MRT_FilterTextField = function MRT_FilterTextField(_ref) {
2127
2129
  var getState = table.getState,
2128
2130
  _table$options = table.options,
2129
2131
  enableColumnFilterChangeMode = _table$options.enableColumnFilterChangeMode,
2130
- enabledColumnFilterOptions = _table$options.enabledColumnFilterOptions,
2132
+ columnFilterModeOptions = _table$options.columnFilterModeOptions,
2131
2133
  _table$options$icons = _table$options.icons,
2132
2134
  FilterListIcon = _table$options$icons.FilterListIcon,
2133
2135
  CloseIcon = _table$options$icons.CloseIcon,
@@ -2224,7 +2226,7 @@ var MRT_FilterTextField = function MRT_FilterTextField(_ref) {
2224
2226
  var filterChipLabel = ['empty', 'notEmpty'].includes(currentFilterOption) ? //@ts-ignore
2225
2227
  localization["filter" + ((currentFilterOption == null ? void 0 : (_currentFilterOption$ = currentFilterOption.charAt(0)) == null ? void 0 : _currentFilterOption$.toUpperCase()) + (currentFilterOption == null ? void 0 : currentFilterOption.slice(1)))] : '';
2226
2228
  var filterPlaceholder = inputIndex === undefined ? (_localization$filterB = localization.filterByColumn) == null ? void 0 : _localization$filterB.replace('{column}', String(columnDef.header)) : inputIndex === 0 ? localization.min : inputIndex === 1 ? localization.max : '';
2227
- var allowedColumnFilterOptions = (_columnDef$enabledCol = columnDef == null ? void 0 : columnDef.enabledColumnFilterOptions) != null ? _columnDef$enabledCol : enabledColumnFilterOptions;
2229
+ var allowedColumnFilterOptions = (_columnDef$columnFilt = columnDef == null ? void 0 : columnDef.columnFilterModeOptions) != null ? _columnDef$columnFilt : columnFilterModeOptions;
2228
2230
  var showChangeModeButton = enableColumnFilterChangeMode && columnDef.enableColumnFilterChangeMode !== false && !isSelectFilter && !inputIndex && (allowedColumnFilterOptions === undefined || !!(allowedColumnFilterOptions != null && allowedColumnFilterOptions.length));
2229
2231
  return React__default.createElement(React__default.Fragment, null, React__default.createElement(material.TextField, Object.assign({
2230
2232
  fullWidth: true,
@@ -2296,7 +2298,6 @@ var MRT_FilterTextField = function MRT_FilterTextField(_ref) {
2296
2298
  }, textFieldProps, {
2297
2299
  sx: function sx(theme) {
2298
2300
  return _extends({
2299
- m: '-0.25rem',
2300
2301
  p: 0,
2301
2302
  minWidth: !filterChipLabel ? '8rem' : 'auto',
2302
2303
  width: 'calc(100% + 0.5rem)',
@@ -2629,7 +2630,7 @@ var MRT_TableHeadCell = function MRT_TableHeadCell(_ref) {
2629
2630
  left: column.getIsPinned() === 'left' ? column.getStart('left') + "px" : undefined,
2630
2631
  overflow: 'visible',
2631
2632
  opacity: (currentDraggingColumn == null ? void 0 : currentDraggingColumn.id) === column.id || (currentHoveredColumn == null ? void 0 : currentHoveredColumn.id) === column.id ? 0.5 : 1,
2632
- p: density === 'compact' ? columnDefType === 'display' ? '0 0.5rem' : '0.5rem' : density === 'comfortable' ? columnDefType === 'display' ? '0.5rem 0.75rem' : '1rem' : columnDefType === 'display' ? '1rem 1.25rem' : '1.5rem',
2633
+ p: density === 'compact' ? '0.5rem' : density === 'comfortable' ? columnDefType === 'display' ? '0.75rem' : '1rem' : columnDefType === 'display' ? '1rem 1.25rem' : '1.5rem',
2633
2634
  pb: columnDefType === 'display' ? 0 : undefined,
2634
2635
  position: column.getIsPinned() && columnDefType !== 'group' ? 'sticky' : undefined,
2635
2636
  pt: columnDefType === 'group' ? 0 : density === 'compact' ? '0.25' : density === 'comfortable' ? '.75rem' : '1.25rem',
@@ -2930,6 +2931,7 @@ var MRT_TableBodyCell = function MRT_TableBodyCell(_ref) {
2930
2931
  enableClickToCopy = _table$options.enableClickToCopy,
2931
2932
  enableColumnOrdering = _table$options.enableColumnOrdering,
2932
2933
  enableEditing = _table$options.enableEditing,
2934
+ enablePagination = _table$options.enablePagination,
2933
2935
  enableRowNumbers = _table$options.enableRowNumbers,
2934
2936
  muiTableBodyCellProps = _table$options.muiTableBodyCellProps,
2935
2937
  muiTableBodyCellSkeletonProps = _table$options.muiTableBodyCellSkeletonProps,
@@ -3004,7 +3006,7 @@ var MRT_TableBodyCell = function MRT_TableBodyCell(_ref) {
3004
3006
  var draggingBorders = draggingBorder ? {
3005
3007
  borderLeft: draggingBorder,
3006
3008
  borderRight: draggingBorder,
3007
- borderBottom: row.index === table.getRowModel().rows.length - 1 ? draggingBorder : undefined
3009
+ borderBottom: row.index === (enablePagination ? table.getRowModel() : table.getPrePaginationRowModel()).rows.length - 1 ? draggingBorder : undefined
3008
3010
  } : undefined;
3009
3011
  return React__default.createElement(material.TableCell, Object.assign({
3010
3012
  onDoubleClick: handleDoubleClick,
@@ -3732,7 +3734,7 @@ var MaterialReactTable = (function (_ref) {
3732
3734
  _ref$enableColumnActi = _ref.enableColumnActions,
3733
3735
  enableColumnActions = _ref$enableColumnActi === void 0 ? true : _ref$enableColumnActi,
3734
3736
  _ref$enableColumnFilt = _ref.enableColumnFilterChangeMode,
3735
- enableColumnFilterChangeMode = _ref$enableColumnFilt === void 0 ? true : _ref$enableColumnFilt,
3737
+ enableColumnFilterChangeMode = _ref$enableColumnFilt === void 0 ? false : _ref$enableColumnFilt,
3736
3738
  _ref$enableColumnFilt2 = _ref.enableColumnFilters,
3737
3739
  enableColumnFilters = _ref$enableColumnFilt2 === void 0 ? true : _ref$enableColumnFilt2,
3738
3740
  _ref$enableColumnOrde = _ref.enableColumnOrdering,
@@ -3750,7 +3752,7 @@ var MaterialReactTable = (function (_ref) {
3750
3752
  _ref$enableGlobalFilt = _ref.enableGlobalFilter,
3751
3753
  enableGlobalFilter = _ref$enableGlobalFilt === void 0 ? true : _ref$enableGlobalFilt,
3752
3754
  _ref$enableGlobalFilt2 = _ref.enableGlobalFilterChangeMode,
3753
- enableGlobalFilterChangeMode = _ref$enableGlobalFilt2 === void 0 ? true : _ref$enableGlobalFilt2,
3755
+ enableGlobalFilterChangeMode = _ref$enableGlobalFilt2 === void 0 ? false : _ref$enableGlobalFilt2,
3754
3756
  _ref$enableGlobalFilt3 = _ref.enableGlobalFilterRankedResults,
3755
3757
  enableGlobalFilterRankedResults = _ref$enableGlobalFilt3 === void 0 ? true : _ref$enableGlobalFilt3,
3756
3758
  _ref$enableGrouping = _ref.enableGrouping,