material-react-table 1.2.7 → 1.2.9

package/dist/esm/icons.d.ts

@@ -1,4 +1,5 @@
 export interface MRT_Icons {
+    ArrowDownwardIcon: any;
     ArrowRightIcon: any;
     CancelIcon: any;
     CheckBoxIcon: any;

package/dist/esm/material-react-table.esm.js

@@ -2,6 +2,7 @@ import React, { useMemo, useRef, useState, useCallback, useEffect, Fragment, mem
 import { aggregationFns, filterFns, sortingFns, useReactTable, getCoreRowModel, getExpandedRowModel, getFacetedRowModel, getFilteredRowModel, getGroupedRowModel, getPaginationRowModel, getSortedRowModel } from '@tanstack/react-table';
 import { alpha, lighten, useTheme, darken } from '@mui/material/styles';
 import { rankItem, rankings, compareItems } from '@tanstack/match-sorter-utils';
+import ArrowDownwardIcon from '@mui/icons-material/ArrowDownward';
 import ArrowRightIcon from '@mui/icons-material/ArrowRight';
 import CancelIcon from '@mui/icons-material/Cancel';
 import CheckBoxIcon from '@mui/icons-material/CheckBox';
@@ -346,6 +347,7 @@ const MRT_FilterFns = Object.assign(Object.assign({}, filterFns), { between,
     startsWith });
 
 const MRT_Default_Icons = {
+    ArrowDownwardIcon,
     ArrowRightIcon,
     CancelIcon,
     CheckBoxIcon,
@@ -1426,7 +1428,7 @@ const MRT_TableHeadCellColumnActionsButton = ({ header, table, }) => {
     const iconButtonProps = Object.assign(Object.assign({}, mTableHeadCellColumnActionsButtonProps), mcTableHeadCellColumnActionsButtonProps);
     return (React.createElement(React.Fragment, null,
         React.createElement(Tooltip, { arrow: true, enterDelay: 1000, enterNextDelay: 1000, placement: "top", title: (_a = iconButtonProps === null || iconButtonProps === void 0 ? void 0 : iconButtonProps.title) !== null && _a !== void 0 ? _a : localization.columnActions },
-            React.createElement(IconButton, Object.assign({ "aria-label": localization.columnActions, onClick: handleClick, size: "small" }, iconButtonProps, { sx: (theme) => (Object.assign({ height: '2rem', m: '-0.2rem', opacity: 0.5, transform: 'scale(0.85)', transition: 'opacity 150ms', width: '2rem', '&:hover': {
+            React.createElement(IconButton, Object.assign({ "aria-label": localization.columnActions, onClick: handleClick, size: "small" }, iconButtonProps, { sx: (theme) => (Object.assign({ height: '2rem', m: '-6px -3px', opacity: 0.5, transform: 'scale(0.85)', transition: 'opacity 150ms', width: '2rem', '&:hover': {
                         opacity: 1,
                     } }, ((iconButtonProps === null || iconButtonProps === void 0 ? void 0 : iconButtonProps.sx) instanceof Function
                     ? iconButtonProps.sx(theme)
@@ -1710,11 +1712,12 @@ const MRT_TableHeadCellFilterLabel = ({ header, table }) => {
                 React.createElement(IconButton, { disableRipple: true, onClick: (event) => {
                         event.stopPropagation();
                     }, size: "small", sx: {
+                        height: '12px',
                         m: 0,
                         opacity: 0.8,
                         p: '2px',
                         transform: 'scale(0.66)',
-                        width: '1.5ch',
+                        width: '12px',
                     } },
                     React.createElement(FilterAltIcon, null))))));
 };
@@ -1790,7 +1793,7 @@ const MRT_TableHeadCellResizeHandle = ({ header, table }) => {
 };
 
 const MRT_TableHeadCellSortLabel = ({ header, table, tableCellProps, }) => {
-    const { options: { localization }, } = table;
+    const { options: { icons: { ArrowDownwardIcon }, localization, }, } = table;
     const { column } = header;
     const { columnDef } = column;
     const sortTooltip = column.getIsSorted()
@@ -1803,11 +1806,11 @@ const MRT_TableHeadCellSortLabel = ({ header, table, tableCellProps, }) => {
                 ? column.getIsSorted()
                 : undefined, sx: {
                 flex: '0 0',
-                width: '2ch',
+                width: '2.3ch',
                 transform: (tableCellProps === null || tableCellProps === void 0 ? void 0 : tableCellProps.align) !== 'right'
                     ? 'translateX(-0.5ch)'
                     : undefined,
-            } })));
+            }, IconComponent: ArrowDownwardIcon })));
 };
 
 const MRT_TableHeadCell = ({ header, table }) => {