material-react-table 1.11.2 → 1.11.4

package/dist/cjs/index.js

@@ -314,7 +314,10 @@ const getIsFirstRightPinnedColumn = (column) => {
     return column.getIsPinned() === 'right' && column.getPinnedIndex() === 0;
 };
 const getTotalRight = (table, column) => {
-    return ((table.getRightLeafHeaders().length - 1 - column.getPinnedIndex()) * 200);
+    return table
+        .getRightLeafHeaders()
+        .slice(column.getPinnedIndex() + 1)
+        .reduce((acc, col) => acc + col.getSize(), 0);
 };
 const getCommonCellStyles = ({ column, header, table, tableCellProps, theme, }) => {
     var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k;
@@ -759,7 +762,7 @@ const commonListItemStyles = {
 };
 const MRT_ColumnActionMenu = ({ anchorEl, header, setAnchorEl, table, }) => {
     var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k;
-    const { getState, toggleAllColumnsVisible, setColumnOrder, options: { columnFilterModeOptions, enableColumnFilterModes, enableColumnFilters, enableColumnResizing, enableGrouping, enableHiding, enablePinning, enableSorting, icons: { ArrowRightIcon, ClearAllIcon, ViewColumnIcon, DynamicFeedIcon, FilterListIcon, FilterListOffIcon, PushPinIcon, SortIcon, RestartAltIcon, VisibilityOffIcon, }, localization, renderColumnActionsMenuItems, }, refs: { filterInputRefs }, setColumnSizingInfo, setShowColumnFilters, } = table;
+    const { getState, toggleAllColumnsVisible, setColumnOrder, options: { columnFilterModeOptions, enableColumnFilterModes, enableColumnFilters, enableColumnResizing, enableGrouping, enableHiding, enablePinning, enableSorting, enableSortingRemoval, icons: { ArrowRightIcon, ClearAllIcon, ViewColumnIcon, DynamicFeedIcon, FilterListIcon, FilterListOffIcon, PushPinIcon, SortIcon, RestartAltIcon, VisibilityOffIcon, }, localization, renderColumnActionsMenuItems, }, refs: { filterInputRefs }, setColumnSizingInfo, setShowColumnFilters, } = table;
     const { column } = header;
     const { columnDef } = column;
     const { columnSizing, columnVisibility, density, showColumnFilters } = getState();
@@ -829,23 +832,24 @@ const MRT_ColumnActionMenu = ({ anchorEl, header, setAnchorEl, table, }) => {
         column,
         table,
     })) !== null && _d !== void 0 ? _d : (enableSorting &&
-        column.getCanSort() && [
-        React__default["default"].createElement(MenuItem__default["default"], { disabled: !column.getIsSorted(), key: 0, onClick: handleClearSort, sx: commonMenuItemStyles },
-            React__default["default"].createElement(Box__default["default"], { sx: commonListItemStyles },
-                React__default["default"].createElement(ListItemIcon__default["default"], null,
-                    React__default["default"].createElement(ClearAllIcon, null)),
-                localization.clearSort)),
-        React__default["default"].createElement(MenuItem__default["default"], { disabled: column.getIsSorted() === 'asc', key: 1, onClick: handleSortAsc, sx: commonMenuItemStyles },
-            React__default["default"].createElement(Box__default["default"], { sx: commonListItemStyles },
-                React__default["default"].createElement(ListItemIcon__default["default"], null,
-                    React__default["default"].createElement(SortIcon, { style: { transform: 'rotate(180deg) scaleX(-1)' } })), (_e = localization.sortByColumnAsc) === null || _e === void 0 ? void 0 :
-                _e.replace('{column}', String(columnDef.header)))),
-        React__default["default"].createElement(MenuItem__default["default"], { divider: enableColumnFilters || enableGrouping || enableHiding, key: 2, disabled: column.getIsSorted() === 'desc', onClick: handleSortDesc, sx: commonMenuItemStyles },
-            React__default["default"].createElement(Box__default["default"], { sx: commonListItemStyles },
-                React__default["default"].createElement(ListItemIcon__default["default"], null,
-                    React__default["default"].createElement(SortIcon, null)), (_f = localization.sortByColumnDesc) === null || _f === void 0 ? void 0 :
-                _f.replace('{column}', String(columnDef.header)))),
-    ]),
+        column.getCanSort() &&
+        [
+            enableSortingRemoval !== false && (React__default["default"].createElement(MenuItem__default["default"], { disabled: !column.getIsSorted(), key: 0, onClick: handleClearSort, sx: commonMenuItemStyles },
+                React__default["default"].createElement(Box__default["default"], { sx: commonListItemStyles },
+                    React__default["default"].createElement(ListItemIcon__default["default"], null,
+                        React__default["default"].createElement(ClearAllIcon, null)),
+                    localization.clearSort))),
+            React__default["default"].createElement(MenuItem__default["default"], { disabled: column.getIsSorted() === 'asc', key: 1, onClick: handleSortAsc, sx: commonMenuItemStyles },
+                React__default["default"].createElement(Box__default["default"], { sx: commonListItemStyles },
+                    React__default["default"].createElement(ListItemIcon__default["default"], null,
+                        React__default["default"].createElement(SortIcon, { style: { transform: 'rotate(180deg) scaleX(-1)' } })), (_e = localization.sortByColumnAsc) === null || _e === void 0 ? void 0 :
+                    _e.replace('{column}', String(columnDef.header)))),
+            React__default["default"].createElement(MenuItem__default["default"], { divider: enableColumnFilters || enableGrouping || enableHiding, key: 2, disabled: column.getIsSorted() === 'desc', onClick: handleSortDesc, sx: commonMenuItemStyles },
+                React__default["default"].createElement(Box__default["default"], { sx: commonListItemStyles },
+                    React__default["default"].createElement(ListItemIcon__default["default"], null,
+                        React__default["default"].createElement(SortIcon, null)), (_f = localization.sortByColumnDesc) === null || _f === void 0 ? void 0 :
+                    _f.replace('{column}', String(columnDef.header)))),
+        ].filter(Boolean)),
         enableColumnFilters &&
             column.getCanFilter() &&
             [
@@ -2565,9 +2569,7 @@ const MRT_TableBodyRow = ({ columnVirtualizer, measureElement, numRows, row, row
                     rowRef.current = node;
                     measureElement === null || measureElement === void 0 ? void 0 : measureElement(node);
                 }
-            } }, tableRowProps, { sx: (theme) => (Object.assign({ backgroundColor: styles.lighten(theme.palette.background.default, 0.06), display: layoutMode === 'grid' ? 'flex' : 'table-row', opacity: (draggingRow === null || draggingRow === void 0 ? void 0 : draggingRow.id) === row.id || (hoveredRow === null || hoveredRow === void 0 ? void 0 : hoveredRow.id) === row.id ? 0.5 : 1, position: virtualRow ? 'absolute' : undefined, top: virtualRow ? 0 : undefined, transform: virtualRow
-                    ? `translateY(${virtualRow === null || virtualRow === void 0 ? void 0 : virtualRow.start}px)`
-                    : undefined, transition: virtualRow ? 'none' : 'all 150ms ease-in-out', width: '100%', '&:hover td': {
+            } }, tableRowProps, { sx: (theme) => (Object.assign({ backgroundColor: styles.lighten(theme.palette.background.default, 0.06), boxSizing: 'border-box', display: layoutMode === 'grid' ? 'flex' : 'table-row', opacity: (draggingRow === null || draggingRow === void 0 ? void 0 : draggingRow.id) === row.id || (hoveredRow === null || hoveredRow === void 0 ? void 0 : hoveredRow.id) === row.id ? 0.5 : 1, position: virtualRow ? 'absolute' : undefined, transition: virtualRow ? 'none' : 'all 150ms ease-in-out', top: virtualRow ? 0 : undefined, width: '100%', '&:hover td': {
                     backgroundColor: (tableRowProps === null || tableRowProps === void 0 ? void 0 : tableRowProps.hover) !== false
                         ? row.getIsSelected()
                             ? `${styles.alpha(theme.palette.primary.main, 0.2)}`
@@ -2577,7 +2579,9 @@ const MRT_TableBodyRow = ({ columnVirtualizer, measureElement, numRows, row, row
                         : undefined,
                 } }, ((tableRowProps === null || tableRowProps === void 0 ? void 0 : tableRowProps.sx) instanceof Function
                 ? tableRowProps.sx(theme)
-                : tableRowProps === null || tableRowProps === void 0 ? void 0 : tableRowProps.sx))) }),
+                : tableRowProps === null || tableRowProps === void 0 ? void 0 : tableRowProps.sx))), style: Object.assign({ transform: virtualRow
+                    ? `translateY(${virtualRow === null || virtualRow === void 0 ? void 0 : virtualRow.start}px)`
+                    : undefined }, tableRowProps === null || tableRowProps === void 0 ? void 0 : tableRowProps.style) }),
             virtualPaddingLeft ? (React__default["default"].createElement("td", { style: { display: 'flex', width: virtualPaddingLeft } })) : null,
             (virtualColumns !== null && virtualColumns !== void 0 ? virtualColumns : row.getVisibleCells()).map((cellOrVirtualCell) => {
                 const cell = columnVirtualizer
@@ -2655,7 +2659,10 @@ const MRT_TableBody = ({ columnVirtualizer, table, virtualColumns, virtualPaddin
         pagination.pageSize,
     ]);
     const rowVirtualizer = enableRowVirtualization
-        ? reactVirtual.useVirtualizer(Object.assign(Object.assign({ count: rows.length, estimateSize: () => density === 'compact' ? 37 : density === 'comfortable' ? 58 : 73, getScrollElement: () => tableContainerRef.current, measureElement: (element) => element === null || element === void 0 ? void 0 : element.getBoundingClientRect().height, overscan: 4 }, vProps_old), vProps))
+        ? reactVirtual.useVirtualizer(Object.assign(Object.assign({ count: rows.length, estimateSize: () => density === 'compact' ? 37 : density === 'comfortable' ? 58 : 73, getScrollElement: () => tableContainerRef.current, measureElement: typeof window !== 'undefined' &&
+                navigator.userAgent.indexOf('Firefox') === -1
+                ? (element) => element === null || element === void 0 ? void 0 : element.getBoundingClientRect().height
+                : undefined, overscan: 4 }, vProps_old), vProps))
         : undefined;
     if (rowVirtualizerInstanceRef && rowVirtualizer) {
         rowVirtualizerInstanceRef.current = rowVirtualizer;
@@ -3259,6 +3266,7 @@ exports.MRT_GlobalFilterTextField = MRT_GlobalFilterTextField;
 exports.MRT_GrabHandleButton = MRT_GrabHandleButton;
 exports.MRT_ShowHideColumnsButton = MRT_ShowHideColumnsButton;
 exports.MRT_SortingFns = MRT_SortingFns;
+exports.MRT_TableHeadCellFilterContainer = MRT_TableHeadCellFilterContainer;
 exports.MRT_TablePagination = MRT_TablePagination;
 exports.MRT_ToggleDensePaddingButton = MRT_ToggleDensePaddingButton;
 exports.MRT_ToggleFiltersButton = MRT_ToggleFiltersButton;