material-react-table 1.9.0 → 1.9.1

package/dist/esm/types/body/MRT_TableBody.d.ts

@@ -1,5 +1,5 @@
 import React from 'react';
-import { VirtualItem, Virtualizer } from '@tanstack/react-virtual';
+import { type VirtualItem, type Virtualizer } from '@tanstack/react-virtual';
 import type { MRT_TableInstance } from '..';
 interface Props {
     columnVirtualizer?: Virtualizer<HTMLDivElement, HTMLTableCellElement>;

package/dist/esm/types/column.utils.d.ts

@@ -1,7 +1,7 @@
-import type { Row } from '@tanstack/react-table';
 import { MRT_AggregationFns } from './aggregationFns';
 import { MRT_FilterFns } from './filterFns';
 import { MRT_SortingFns } from './sortingFns';
+import type { Row } from '@tanstack/react-table';
 import type { TableCellProps } from '@mui/material/TableCell';
 import type { Theme } from '@mui/material/styles';
 import type { MaterialReactTableProps, MRT_Column, MRT_ColumnDef, MRT_ColumnOrderState, MRT_DefinedColumnDef, MRT_DisplayColumnIds, MRT_FilterOption, MRT_GroupingState, MRT_Header, MRT_TableInstance } from '.';

package/dist/esm/types/filterFns.d.ts

@@ -1,5 +1,5 @@
 import { RankingInfo } from '@tanstack/match-sorter-utils';
-import { Row } from '@tanstack/react-table';
+import { type Row } from '@tanstack/react-table';
 export declare const MRT_FilterFns: {
     between: {
         <TData extends Record<string, any> = {}>(row: Row<TData>, id: string, filterValues: [string | number, string | number]): boolean;

package/dist/esm/types/footer/MRT_TableFooterRow.d.ts

@@ -1,5 +1,5 @@
 /// <reference types="react" />
-import { VirtualItem } from '@tanstack/react-virtual';
+import type { VirtualItem } from '@tanstack/react-virtual';
 import type { MRT_HeaderGroup, MRT_TableInstance } from '..';
 interface Props {
     footerGroup: MRT_HeaderGroup;

package/dist/esm/types/sortingFns.d.ts

@@ -1,5 +1,5 @@
-import { Row } from '@tanstack/react-table';
-import { MRT_Row } from '.';
+import { type Row } from '@tanstack/react-table';
+import type { MRT_Row } from '.';
 export declare const MRT_SortingFns: {
     fuzzy: <TData extends Record<string, any> = {}>(rowA: Row<TData>, rowB: Row<TData>, columnId: string) => number;
     alphanumeric: import("@tanstack/react-table").SortingFn<any>;

package/package.json

@@ -1,5 +1,5 @@
 {
-  "version": "1.9.0",
+  "version": "1.9.1",
   "license": "MIT",
   "name": "material-react-table",
   "description": "A fully featured Material UI V5 implementation of TanStack React Table V8, written from the ground up in TypeScript.",

package/src/MaterialReactTable.tsx

@@ -50,7 +50,7 @@ import type {
   TableOptions,
   TableState,
   Updater,
-  VisibilityState
+  VisibilityState,
 } from '@tanstack/react-table';
 import type {
   VirtualizerOptions,

package/src/body/MRT_TableBody.tsx

@@ -1,8 +1,8 @@
 import React, { memo, useMemo } from 'react';
 import {
   useVirtualizer,
-  VirtualItem,
-  Virtualizer,
+  type VirtualItem,
+  type Virtualizer,
 } from '@tanstack/react-virtual';
 import TableBody from '@mui/material/TableBody';
 import Typography from '@mui/material/Typography';

package/src/body/MRT_TableBodyRow.tsx

@@ -1,6 +1,6 @@
 import React, { DragEvent, memo, useRef } from 'react';
 import TableRow from '@mui/material/TableRow';
-import { darken, lighten } from '@mui/material/styles';
+import { alpha, darken, lighten } from '@mui/material/styles';
 import { Memo_MRT_TableBodyCell, MRT_TableBodyCell } from './MRT_TableBodyCell';
 import { MRT_TableDetailPanel } from './MRT_TableDetailPanel';
 import type { VirtualItem, Virtualizer } from '@tanstack/react-virtual';
@@ -86,7 +86,9 @@ export const MRT_TableBodyRow = ({
           '&:hover td': {
             backgroundColor:
               tableRowProps?.hover !== false
-                ? theme.palette.mode === 'dark'
+                ? row.getIsSelected()
+                  ? `${alpha(theme.palette.primary.main, 0.2)}`
+                  : theme.palette.mode === 'dark'
                   ? `${lighten(theme.palette.background.default, 0.12)}`
                   : `${darken(theme.palette.background.default, 0.05)}`
                 : undefined,

package/src/column.utils.ts

@@ -1,8 +1,8 @@
-import type { Row } from '@tanstack/react-table';
 import { MRT_AggregationFns } from './aggregationFns';
 import { MRT_FilterFns } from './filterFns';
 import { MRT_SortingFns } from './sortingFns';
 import { alpha, lighten } from '@mui/material/styles';
+import type { Row } from '@tanstack/react-table';
 import type { TableCellProps } from '@mui/material/TableCell';
 import type { Theme } from '@mui/material/styles';
 import type {

package/src/filterFns.ts

@@ -1,5 +1,5 @@
 import { rankItem, rankings, RankingInfo } from '@tanstack/match-sorter-utils';
-import { filterFns, Row } from '@tanstack/react-table';
+import { filterFns, type Row } from '@tanstack/react-table';
 
 const fuzzy = <TData extends Record<string, any> = {}>(
   row: Row<TData>,

package/src/footer/MRT_TableFooterRow.tsx

@@ -2,7 +2,7 @@ import React from 'react';
 import TableRow from '@mui/material/TableRow';
 import { lighten } from '@mui/material/styles';
 import { MRT_TableFooterCell } from './MRT_TableFooterCell';
-import { VirtualItem } from '@tanstack/react-virtual';
+import type { VirtualItem } from '@tanstack/react-virtual';
 import type { MRT_Header, MRT_HeaderGroup, MRT_TableInstance } from '..';
 
 interface Props {

package/src/inputs/MRT_FilterTextField.tsx

@@ -149,7 +149,7 @@ export const MRT_FilterTextField = ({
     } else if (isRangeFilter) {
       setFilterValue('');
       column.setFilterValue((old: [string | undefined, string | undefined]) => {
-        const newFilterValues = old ?? ['', ''];
+        const newFilterValues = (Array.isArray(old) && old) || ['', ''];
         newFilterValues[rangeFilterIndex as number] = undefined;
         return newFilterValues;
       });

package/src/menus/MRT_FilterOptionMenu.tsx

@@ -99,6 +99,10 @@ export const mrtFilterOptions = (
   },
 ];
 
+const rangeModes = ['between', 'betweenInclusive', 'inNumberRange'];
+const emptyModes = ['empty', 'notEmpty'];
+const arrModes = ['arrIncludesSome', 'arrIncludesAll', 'arrIncludes'];
+
 interface Props<TData extends Record<string, any> = {}> {
   anchorEl: HTMLElement | null;
   header?: MRT_Header<TData>;
@@ -150,46 +154,66 @@ export const MRT_FilterOptionMenu = <TData extends Record<string, any> = {}>({
   );
 
   const handleSelectFilterMode = (option: MRT_FilterOption) => {
-    if (header && column) {
+    const prevFilterMode = columnDef?._filterFn ?? '';
+    if (!header || !column) {
+      // global filter mode
+      setGlobalFilterFn(option);
+    } else if (option !== prevFilterMode) {
+      // column filter mode
       setColumnFilterFns((prev: { [key: string]: any }) => ({
         ...prev,
         [header.id]: option,
       }));
-      if (['empty', 'notEmpty'].includes(option as string)) {
-        column.setFilterValue(' ');
+
+      // reset filter value and/or perform new filter render
+      if (emptyModes.includes(option)) {
+        // will now be empty/notEmpty filter mode
+        if (
+          currentFilterValue !== ' ' &&
+          !emptyModes.includes(prevFilterMode)
+        ) {
+          column.setFilterValue(' ');
+        } else if (currentFilterValue) {
+          column.setFilterValue(currentFilterValue); // perform new filter render
+        }
       } else if (
         columnDef?.filterVariant === 'multi-select' ||
-        ['arrIncludesSome', 'arrIncludesAll', 'arrIncludes'].includes(
-          option as string,
-        )
+        arrModes.includes(option as string)
       ) {
+        // will now be array filter mode
         if (
           currentFilterValue instanceof String ||
           (currentFilterValue as Array<any>)?.length
         ) {
           column.setFilterValue([]);
           setFilterValue?.([]);
+        } else if (currentFilterValue) {
+          column.setFilterValue(currentFilterValue); // perform new filter render
         }
       } else if (
         columnDef?.filterVariant === 'range' ||
-        ['between', 'betweenInclusive', 'inNumberRange'].includes(
-          option as MRT_FilterOption,
-        )
+        rangeModes.includes(option as MRT_FilterOption)
       ) {
-        if (!(currentFilterValue as Array<any>)?.every((v) => v === '')) {
+        // will now be range filter mode
+        if (
+          !Array.isArray(currentFilterValue) ||
+          (!(currentFilterValue as Array<any>)?.every((v) => v === '') &&
+            !rangeModes.includes(prevFilterMode))
+        ) {
           column.setFilterValue(['', '']);
           setFilterValue?.('');
+        } else {
+          column.setFilterValue(currentFilterValue); // perform new filter render
         }
       } else {
-        if (
-          !['', undefined].includes(currentFilterValue as string | undefined)
-        ) {
+        // will now be single value filter mode
+        if (Array.isArray(currentFilterValue)) {
           column.setFilterValue('');
           setFilterValue?.('');
+        } else {
+          column.setFilterValue(currentFilterValue); // perform new filter render
         }
       }
-    } else {
-      setGlobalFilterFn(option);
     }
     setAnchorEl(null);
     onSelect?.();

package/src/sortingFns.ts

@@ -1,6 +1,6 @@
-import { compareItems, RankingInfo } from '@tanstack/match-sorter-utils';
-import { Row, sortingFns } from '@tanstack/react-table';
-import { MRT_Row } from '.';
+import { compareItems, type RankingInfo } from '@tanstack/match-sorter-utils';
+import { type Row, sortingFns } from '@tanstack/react-table';
+import type { MRT_Row } from '.';
 
 const fuzzy = <TData extends Record<string, any> = {}>(
   rowA: Row<TData>,

package/src/table/MRT_Table.tsx

@@ -1,9 +1,9 @@
 import React, { useCallback, useMemo } from 'react';
 import {
   defaultRangeExtractor,
-  Range,
   useVirtualizer,
-  Virtualizer,
+  type Range,
+  type Virtualizer,
 } from '@tanstack/react-virtual';
 import Table from '@mui/material/Table';
 import { MRT_TableHead } from '../head/MRT_TableHead';

package/src/table/MRT_TableRoot.tsx

@@ -26,7 +26,7 @@ import {
   showExpandColumn,
   getColumnId,
 } from '../column.utils';
-import {
+import type {
   MRT_Cell,
   MRT_Column,
   MRT_ColumnDef,