material-react-table-narender 2.13.29 → 2.13.32

package/dist/index.js

@@ -53,6 +53,7 @@ var SyncAltIcon = require('@mui/icons-material/SyncAlt');
 var ViewColumnIcon = require('@mui/icons-material/ViewColumn');
 var VisibilityOffIcon = require('@mui/icons-material/VisibilityOff');
 var SettingsBackupRestoreIcon = require('@mui/icons-material/SettingsBackupRestore');
+var SettingsOutlinedIcon = require('@mui/icons-material/SettingsOutlined');
 var reactVirtual = require('@tanstack/react-virtual');
 var Paper = require('@mui/material/Paper');
 var material = require('@mui/material');
@@ -146,6 +147,7 @@ var SyncAltIcon__default = /*#__PURE__*/_interopDefaultLegacy(SyncAltIcon);
 var ViewColumnIcon__default = /*#__PURE__*/_interopDefaultLegacy(ViewColumnIcon);
 var VisibilityOffIcon__default = /*#__PURE__*/_interopDefaultLegacy(VisibilityOffIcon);
 var SettingsBackupRestoreIcon__default = /*#__PURE__*/_interopDefaultLegacy(SettingsBackupRestoreIcon);
+var SettingsOutlinedIcon__default = /*#__PURE__*/_interopDefaultLegacy(SettingsOutlinedIcon);
 var Paper__default = /*#__PURE__*/_interopDefaultLegacy(Paper);
 var TableContainer__default = /*#__PURE__*/_interopDefaultLegacy(TableContainer);
 var Table__default = /*#__PURE__*/_interopDefaultLegacy(Table);
@@ -1462,7 +1464,8 @@ const MRT_Default_Icons = {
     SyncAltIcon: SyncAltIcon__default["default"],
     ViewColumnIcon: ViewColumnIcon__default["default"],
     VisibilityOffIcon: VisibilityOffIcon__default["default"],
-    SettingsBackupRestoreIcon: SettingsBackupRestoreIcon__default["default"]
+    SettingsBackupRestoreIcon: SettingsBackupRestoreIcon__default["default"],
+    SettingsOutlinedIcon: SettingsOutlinedIcon__default["default"]
 };
 
 const MRT_Localization_EN = {
@@ -2989,7 +2992,7 @@ const MRT_FilterOptionMenu = (_a) => {
 const MRT_ColumnActionMenu = (_a) => {
     var _b, _c, _d, _e, _f, _g, _h, _j, _k, _l;
     var { anchorEl, header, setAnchorEl, table } = _a, rest = __rest(_a, ["anchorEl", "header", "setAnchorEl", "table"]);
-    const { getAllLeafColumns, getState, options: { columnFilterDisplayMode, columnFilterModeOptions, enableColumnFilterModes, enableColumnFilters, enableColumnPinning, enableColumnResizing, enableGrouping, enableHiding, enableSorting, enableSortingRemoval, icons: { ClearAllIcon, DynamicFeedIcon, FilterListIcon, FilterListOffIcon, PushPinIcon, RestartAltIcon, SortIcon, ViewColumnIcon, VisibilityOffIcon, }, localization, mrtTheme: { menuBackgroundColor }, renderColumnActionsMenuItems, }, refs: { filterInputRefs }, setColumnFilterFns, setColumnOrder, setColumnSizingInfo, setShowColumnFilters, } = table;
+    const { getAllLeafColumns, getState, options: { columnFilterDisplayMode, columnFilterModeOptions, enableColumnFilterModes, enableColumnFilters, enableColumnPinning, enableColumnResizing, enableGrouping, enableHiding, enableSorting, enableSortingRemoval, icons: { ClearAllIcon, DynamicFeedIcon, FilterListIcon, FilterListOffIcon, PushPinIcon, RestartAltIcon, SortIcon, ViewColumnIcon, VisibilityOffIcon, SettingsOutlinedIcon }, localization, mrtTheme: { menuBackgroundColor }, renderColumnActionsMenuItems, }, refs: { filterInputRefs }, setColumnFilterFns, setColumnOrder, setColumnSizingInfo, setShowColumnFilters, } = table;
     const { column } = header;
     const { columnDef } = column;
     const { columnSizing, columnVisibility, density, showColumnFilters, showToolBar } = getState();
@@ -3101,7 +3104,7 @@ const MRT_ColumnActionMenu = (_a) => {
             ]
             : []),
         // **Newly Added Menu Item for Toolbar Visibility**
-        jsxRuntime.jsx(MRT_ActionMenuItem, { icon: jsxRuntime.jsx(ViewColumnIcon, {}), label: showToolBar ? "Hide ToolBar" : "Show ToolBar", onClick: (e) => {
+        jsxRuntime.jsx(MRT_ActionMenuItem, { icon: jsxRuntime.jsx(SettingsOutlinedIcon, {}), label: showToolBar ? "Hide ToolBar" : "Show ToolBar", onClick: (e) => {
                 e.stopPropagation();
                 table.setShowToolBar(!showToolBar);
             }, table: table }, 13),
@@ -3639,24 +3642,6 @@ const MRT_TableHeadCellSortLabel = (_a) => {
                     }, flex: '0 0', opacity: isSorted ? 1 : 0.3, transition: 'all 150ms ease-in-out', width: '3ch' }, parseFromValuesOrFunc(rest === null || rest === void 0 ? void 0 : rest.sx, theme))) })) }) }));
 };
 
-const MRT_TableHeadCellToolBar = (_a) => {
-    var { header, table } = _a, rest = __rest(_a, ["header", "table"]);
-    const { getState, options: { icons: { ArrowDownwardIcon, SyncAltIcon }, localization, }, } = table;
-    const { isLoading, showSkeletons, showToolBar } = getState();
-    const showToolBarTooltip = isLoading || showSkeletons
-        ? ''
-        : showToolBar
-            ? "Hide ToolBar"
-            : "Show ToolBar";
-    return (jsxRuntime.jsx(Tooltip__default["default"], { placement: "top", title: showToolBarTooltip, children: jsxRuntime.jsx(material.IconButton, { "aria-label": showToolBarTooltip, size: "small", sx: (theme) => (Object.assign({ '&:hover': {
-                    backgroundColor: 'transparent',
-                    opacity: 1,
-                }, cursor: 'pointer', opacity: 1, p: '2px', transition: 'all 150ms ease-in-out' }, parseFromValuesOrFunc(rest === null || rest === void 0 ? void 0 : rest.sx, theme))), onClick: (e) => {
-                e.stopPropagation();
-                table.setShowToolBar(!showToolBar);
-            }, children: jsxRuntime.jsx(SyncAltIcon, {}) }) }));
-};
-
 const MRT_TableHeadCell = (_a) => {
     var _b, _c, _d, _f, _g, _h;
     var { columnVirtualizer, header, staticColumnIndex, table } = _a, rest = __rest(_a, ["columnVirtualizer", "header", "staticColumnIndex", "table"]);
@@ -3824,7 +3809,7 @@ const MRT_TableHeadCell = (_a) => {
                                         whiteSpace: ((_h = (_g = columnDef.header) === null || _g === void 0 ? void 0 : _g.length) !== null && _h !== void 0 ? _h : 0) < 20
                                             ? 'nowrap'
                                             : 'normal',
-                                    }, children: HeaderElement }), column.getCanFilter() && (jsxRuntime.jsx(MRT_TableHeadCellFilterLabel, { header: header, table: table })), column.getCanSort() && (jsxRuntime.jsx(MRT_TableHeadCellSortLabel, { header: header, table: table })), jsxRuntime.jsx(MRT_TableHeadCellToolBar, { header: header, table: table })] }), columnDefType !== 'group' && (jsxRuntime.jsxs(Box__default["default"], { className: "Mui-TableHeadCell-Content-Actions", sx: {
+                                    }, children: HeaderElement }), column.getCanFilter() && (jsxRuntime.jsx(MRT_TableHeadCellFilterLabel, { header: header, table: table })), column.getCanSort() && (jsxRuntime.jsx(MRT_TableHeadCellSortLabel, { header: header, table: table }))] }), columnDefType !== 'group' && (jsxRuntime.jsxs(Box__default["default"], { className: "Mui-TableHeadCell-Content-Actions", sx: {
                                 whiteSpace: 'nowrap',
                             }, children: [showDragHandle && (jsxRuntime.jsx(MRT_TableHeadCellGrabHandle, { column: column, table: table, tableHeadCellRef: {
                                         current: tableHeadCellRefs.current[column.id],
@@ -4289,10 +4274,7 @@ const MRT_ShowHideColumnsMenuItems = (_a) => {
                                         opacity: columnDefType !== 'display' ? 1 : 0.5,
                                     },
                                 },
-                            }, control: jsxRuntime.jsx(Tooltip__default["default"], Object.assign({}, getCommonTooltipProps(), { title: localization.toggleVisibility, children: jsxRuntime.jsx(Switch__default["default"], {}) })), disabled: !column.getCanHide(), label: columnDef.header, onChange: () => handleToggleColumnHidden(column) })) : (jsxRuntime.jsx(Typography__default["default"], { sx: { alignSelf: 'center' }, children: columnDef.header })), enableColumnResizing && columnDefType !== 'group' &&
-                            (columnDef.enableResizing !== false ? (jsxRuntime.jsx(Tooltip__default["default"], Object.assign({}, getCommonTooltipProps(), { title: localization.resetColumnSize, children: jsxRuntime.jsx(material.Button, { onClick: () => {
-                                        column.resetSize();
-                                    }, children: jsxRuntime.jsx(SettingsBackupRestoreIcon, {}) }) }))) : (jsxRuntime.jsx(Box__default["default"], { sx: { width: '28px' } })))] }) })), (_b = column.columns) === null || _b === void 0 ? void 0 : _b.map((c, i) => (jsxRuntime.jsx(MRT_ShowHideColumnsMenuItems, { allColumns: allColumns, column: c, hoveredColumn: hoveredColumn, isNestedColumns: isNestedColumns, setHoveredColumn: setHoveredColumn, table: table }, `${i}-${c.id}`)))] }));
+                            }, control: jsxRuntime.jsx(Tooltip__default["default"], Object.assign({}, getCommonTooltipProps(), { title: localization.toggleVisibility, children: jsxRuntime.jsx(Switch__default["default"], {}) })), disabled: !column.getCanHide(), label: columnDef.header, onChange: () => handleToggleColumnHidden(column) })) : (jsxRuntime.jsx(Typography__default["default"], { sx: { alignSelf: 'center' }, children: columnDef.header }))] }) })), (_b = column.columns) === null || _b === void 0 ? void 0 : _b.map((c, i) => (jsxRuntime.jsx(MRT_ShowHideColumnsMenuItems, { allColumns: allColumns, column: c, hoveredColumn: hoveredColumn, isNestedColumns: isNestedColumns, setHoveredColumn: setHoveredColumn, table: table }, `${i}-${c.id}`)))] }));
 };
 
 const MRT_ShowHideColumnsMenu = (_a) => {
@@ -4403,19 +4385,6 @@ const MRT_ToggleGlobalFilterButton = (_a) => {
     return (jsxRuntime.jsx(Tooltip__default["default"], { title: (_b = rest === null || rest === void 0 ? void 0 : rest.title) !== null && _b !== void 0 ? _b : localization.showHideSearch, children: jsxRuntime.jsx(IconButton__default["default"], Object.assign({ "aria-label": (_c = rest === null || rest === void 0 ? void 0 : rest.title) !== null && _c !== void 0 ? _c : localization.showHideSearch, disabled: !!globalFilter, onClick: handleToggleSearch }, rest, { title: undefined, children: showGlobalFilter ? jsxRuntime.jsx(SearchOffIcon, {}) : jsxRuntime.jsx(SearchIcon, {}) })) }));
 };
 
-const MRT_ToggleNavigationButton = (_a) => {
-    var _b;
-    var { table } = _a, rest = __rest(_a, ["table"]);
-    const { getState, options: { icons: { FullscreenExitIcon, FullscreenIcon }, localization, }, setEnableKeyboardShortcuts, } = table;
-    const { enableKeyboardShortcuts } = getState();
-    const [tooltipOpened, setTooltipOpened] = react.useState(false);
-    const handleToggleFullScreen = () => {
-        setTooltipOpened(false);
-        setEnableKeyboardShortcuts(!enableKeyboardShortcuts);
-    };
-    return (jsxRuntime.jsx(Tooltip__default["default"], { open: tooltipOpened, title: (_b = rest === null || rest === void 0 ? void 0 : rest.title) !== null && _b !== void 0 ? _b : localization.toggleFullScreen, children: jsxRuntime.jsx(IconButton__default["default"], Object.assign({ "aria-label": localization.toggleFullScreen, onClick: handleToggleFullScreen, onMouseEnter: () => setTooltipOpened(true), onMouseLeave: () => setTooltipOpened(false) }, rest, { title: undefined, children: enableKeyboardShortcuts ? jsxRuntime.jsx(FullscreenExitIcon, {}) : jsxRuntime.jsx(FullscreenIcon, {}) })) }));
-};
-
 const MRT_ToolbarInternalButtons = (_a) => {
     var _b;
     var { table } = _a, rest = __rest(_a, ["table"]);
@@ -4426,7 +4395,7 @@ const MRT_ToolbarInternalButtons = (_a) => {
                     enableGlobalFilter &&
                     !(initialState === null || initialState === void 0 ? void 0 : initialState.showGlobalFilter) && (jsxRuntime.jsx(MRT_ToggleGlobalFilterButton, { table: table })), enableFilters &&
                     enableColumnFilters &&
-                    columnFilterDisplayMode !== 'popover' && (jsxRuntime.jsx(MRT_ToggleFiltersButton, { table: table })), (enableHiding || enableColumnOrdering || enableColumnPinning) && (jsxRuntime.jsx(MRT_ShowHideColumnsButton, { table: table })), enableDensityToggle && (jsxRuntime.jsx(MRT_ToggleDensePaddingButton, { table: table })), enableFullScreenToggle && (jsxRuntime.jsx(MRT_ToggleFullScreenButton, { table: table })), enableKeyboardShortcuts && (jsxRuntime.jsx(MRT_ToggleNavigationButton, { table: table }))] })) })));
+                    columnFilterDisplayMode !== 'popover' && (jsxRuntime.jsx(MRT_ToggleFiltersButton, { table: table })), (enableHiding || enableColumnOrdering || enableColumnPinning) && (jsxRuntime.jsx(MRT_ShowHideColumnsButton, { table: table })), enableDensityToggle && (jsxRuntime.jsx(MRT_ToggleDensePaddingButton, { table: table })), enableFullScreenToggle && (jsxRuntime.jsx(MRT_ToggleFullScreenButton, { table: table }))] })) })));
 };
 
 const MRT_GlobalFilterTextField = (_a) => {
@@ -4527,7 +4496,7 @@ const MRT_TablePaper = (_a) => {
     var _b, _c;
     var { table } = _a, rest = __rest(_a, ["table"]);
     const { getState, options: { enableBottomToolbar, enableTopToolbar, mrtTheme: { baseBackgroundColor }, muiTablePaperProps, renderBottomToolbar, renderTopToolbar, }, refs: { tablePaperRef }, } = table;
-    const { isFullScreen } = getState();
+    const { isFullScreen, showToolBar } = getState();
     const paperProps = Object.assign(Object.assign({}, parseFromValuesOrFunc(muiTablePaperProps, { table })), rest);
     const theme = material.useTheme();
     return (jsxRuntime.jsxs(Paper__default["default"], Object.assign({ elevation: 2 }, paperProps, { ref: (ref) => {