material-react-table 1.11.3 → 1.11.5

package/src/MaterialReactTable.tsx

@@ -1,4 +1,4 @@
-import React, {
+import {
   Dispatch,
   MutableRefObject,
   ReactNode,
@@ -77,6 +77,8 @@ type LiteralUnion<T extends U, U = string> = T | (U & Record<never, never>);
 
 export type MRT_DensityState = 'comfortable' | 'compact' | 'spacious';
 
+export type MRT_FilterFnsState = Record<string, MRT_FilterOption>;
+
 export type {
   ColumnFiltersState as MRT_ColumnFiltersState,
   ColumnOrderState as MRT_ColumnOrderState,
@@ -245,9 +247,7 @@ export type MRT_TableInstance<TData extends Record<string, any> = {}> =
         tablePaperRef: MutableRefObject<HTMLDivElement>;
         topToolbarRef: MutableRefObject<HTMLDivElement>;
       };
-      setColumnFilterFns: Dispatch<
-        SetStateAction<{ [key: string]: MRT_FilterOption }>
-      >;
+      setColumnFilterFns: Dispatch<SetStateAction<MRT_FilterFnsState>>;
       setDensity: Dispatch<SetStateAction<MRT_DensityState>>;
       setDraggingColumn: Dispatch<SetStateAction<MRT_Column<TData> | null>>;
       setDraggingRow: Dispatch<SetStateAction<MRT_Row<TData> | null>>;
@@ -270,7 +270,7 @@ export type MRT_TableInstance<TData extends Record<string, any> = {}> =
 
 export type MRT_TableState<TData extends Record<string, any> = {}> = Prettify<
   TableState & {
-    columnFilterFns: Record<string, MRT_FilterOption>;
+    columnFilterFns: MRT_FilterFnsState;
     density: MRT_DensityState;
     draggingColumn: MRT_Column<TData> | null;
     draggingRow: MRT_Row<TData> | null;

package/src/_locales/hu.ts

@@ -0,0 +1,94 @@
+import type { MRT_Localization } from '../MaterialReactTable';
+
+export const MRT_Localization_HU: MRT_Localization = {
+  actions: 'Műveletek',
+  and: 'és',
+  cancel: 'Mégse',
+  changeFilterMode: 'Szűrő módjának megváltoztatása',
+  changeSearchMode: 'Keresés módjának megváltoztatása',
+  clearFilter: 'Szűrő törlése',
+  clearSearch: 'Keresés törlése',
+  clearSort: 'Rendezés törlése',
+  clickToCopy: 'Kattintson a másoláshoz',
+  collapse: 'Összecsukás',
+  collapseAll: 'Mindet összecsuk',
+  columnActions: 'Oszlop műveletek',
+  copiedToClipboard: 'Vágólapra másolva',
+  dropToGroupBy: 'Húzza ide a csoportosításhoz: {column}',
+  edit: 'Szerkesztés',
+  expand: 'Kibontás',
+  expandAll: 'Mindet kibont',
+  filterArrIncludes: 'Tartalmazza',
+  filterArrIncludesAll: 'Mindet tartalmazza',
+  filterArrIncludesSome: 'Tartalmazza',
+  filterBetween: 'Között',
+  filterBetweenInclusive: 'Között (beleértve)',
+  filterByColumn: 'Szűrés: {column} alapján',
+  filterContains: 'Tartalmazza',
+  filterEmpty: 'Üres',
+  filterEndsWith: 'Végződik',
+  filterEquals: 'Egyenlő',
+  filterEqualsString: 'Egyenlő',
+  filterFuzzy: 'Pontatlan',
+  filterGreaterThan: 'Nagyobb, mint',
+  filterGreaterThanOrEqualTo: 'Nagyobb vagy egyenlő, mint',
+  filterInNumberRange: 'Között',
+  filterIncludesString: 'Tartalmazza',
+  filterIncludesStringSensitive: 'Tartalmazza',
+  filterLessThan: 'Kisebb, mint',
+  filterLessThanOrEqualTo: 'Kisebb vagy egyenlő, mint',
+  filterMode: 'Szűrő mód: {filterType}',
+  filterNotEmpty: 'Nem üres',
+  filterNotEquals: 'Nem egyenlő',
+  filterStartsWith: 'Kezdődik',
+  filterWeakEquals: 'Egyenlő',
+  filteringByColumn: '{column} szűrése - {filterType} {filterValue}',
+  goToFirstPage: 'Ugrás az első oldalra',
+  goToLastPage: 'Ugrás az utolsó oldalra',
+  goToNextPage: 'Ugrás a következő oldalra',
+  goToPreviousPage: 'Ugrás az előző oldalra',
+  grab: 'Fogás',
+  groupByColumn: 'Csoportosítás: {column} alapján',
+  groupedBy: 'Csoportosítva: ',
+  hideAll: 'Mindet elrejt',
+  hideColumn: '{column} oszlop elrejtése',
+  max: 'Max',
+  min: 'Min',
+  move: 'Mozgatás',
+  noRecordsToDisplay: 'Nincsenek megjeleníthető rekordok',
+  noResultsFound: 'Nincs találat',
+  of: 'összesen',
+  or: 'vagy',
+  pinToLeft: 'Rögzítés balra',
+  pinToRight: 'Rögzítés jobbra',
+  resetColumnSize: 'Oszlop méretének alaphelyzetbe állítása',
+  resetOrder: 'Rendezés alaphelyzetbe állítása',
+  rowActions: 'Sor műveletek',
+  rowNumber: '#',
+  rowNumbers: 'Sor számok',
+  rowsPerPage: 'Sorok oldalanként',
+  save: 'Mentés',
+  search: 'Keresés',
+  selectedCountOfRowCountRowsSelected:
+    '{selectedCount} kiválasztva {rowCount} sorból',
+  select: 'Kiválasztás',
+  showAll: 'Összes mutatása',
+  showAllColumns: 'Összes oszlop mutatása',
+  showHideColumns: 'Oszlopok mutatása/elrejtése',
+  showHideFilters: 'Szűrők mutatása/elrejtése',
+  showHideSearch: 'Keresés mutatása/elrejtése',
+  sortByColumnAsc: '{column} szerinti növekvő rendezés',
+  sortByColumnDesc: '{column} szerinti csökkenő rendezés',
+  sortedByColumnAsc: '{column} szerinti növekvő rendezés',
+  sortedByColumnDesc: '{column} szerinti csökkenő rendezés',
+  thenBy: ', majd {column} alapján',
+  toggleDensity: 'Sűrűség váltása',
+  toggleFullScreen: 'Váltás teljes képernyőre',
+  toggleSelectAll: 'Összes kiválasztás váltása',
+  toggleSelectRow: 'Sor kiválasztás váltása',
+  toggleVisibility: 'Láthatóság váltása',
+  ungroupByColumn: 'Csoportosítás megszüntetése: {column}',
+  unpin: 'Feloldás',
+  unpinAll: 'Minden feloldása',
+  unsorted: 'Nincs rendezés',
+};

package/src/body/MRT_EditRowModal.tsx

@@ -1,4 +1,3 @@
-import React from 'react';
 import Dialog from '@mui/material/Dialog';
 import DialogActions from '@mui/material/DialogActions';
 import DialogContent from '@mui/material/DialogContent';

package/src/body/MRT_TableBody.tsx

@@ -1,4 +1,4 @@
-import React, { memo, useMemo } from 'react';
+import { memo, useMemo } from 'react';
 import {
   useVirtualizer,
   type VirtualItem,
@@ -124,6 +124,11 @@ export const MRT_TableBody = ({
         estimateSize: () =>
           density === 'compact' ? 37 : density === 'comfortable' ? 58 : 73,
         getScrollElement: () => tableContainerRef.current,
+        measureElement:
+          typeof window !== 'undefined' &&
+          navigator.userAgent.indexOf('Firefox') === -1
+            ? (element) => element?.getBoundingClientRect().height
+            : undefined,
         overscan: 4,
         ...vProps_old,
         ...vProps,

package/src/body/MRT_TableBodyCell.tsx

@@ -1,4 +1,4 @@
-import React, {
+import {
   DragEvent,
   memo,
   MouseEvent,

package/src/body/MRT_TableBodyCellValue.tsx

@@ -1,4 +1,4 @@
-import React, { ReactNode } from 'react';
+import { ReactNode } from 'react';
 import Box from '@mui/material/Box';
 import { darken, lighten } from '@mui/material/styles';
 import highlightWords from 'highlight-words';

package/src/body/MRT_TableBodyRow.tsx

@@ -1,4 +1,4 @@
-import React, { DragEvent, memo, useRef } from 'react';
+import { DragEvent, memo, useRef } from 'react';
 import TableRow from '@mui/material/TableRow';
 import { type Theme, alpha, darken, lighten } from '@mui/material/styles';
 import { Memo_MRT_TableBodyCell, MRT_TableBodyCell } from './MRT_TableBodyCell';

package/src/body/MRT_TableBodyRowGrabHandle.tsx

@@ -1,4 +1,4 @@
-import React, { DragEvent, RefObject } from 'react';
+import { DragEvent, RefObject } from 'react';
 import { MRT_Cell, MRT_TableInstance } from '..';
 import { MRT_GrabHandleButton } from '../buttons/MRT_GrabHandleButton';
 

package/src/body/MRT_TableDetailPanel.tsx

@@ -1,4 +1,4 @@
-import React from 'react';
+import * as React from 'react';
 import Collapse from '@mui/material/Collapse';
 import TableCell from '@mui/material/TableCell';
 import TableRow from '@mui/material/TableRow';

package/src/buttons/MRT_ColumnPinningButtons.tsx

@@ -1,4 +1,3 @@
-import React from 'react';
 import Box from '@mui/material/Box';
 import IconButton from '@mui/material/IconButton';
 import Tooltip from '@mui/material/Tooltip';

package/src/buttons/MRT_CopyButton.tsx

@@ -1,4 +1,4 @@
-import React, { MouseEvent, ReactNode, useState } from 'react';
+import { MouseEvent, ReactNode, useState } from 'react';
 import Button from '@mui/material/Button';
 import Tooltip from '@mui/material/Tooltip';
 import { MRT_Cell, MRT_TableInstance } from '..';

package/src/buttons/MRT_EditActionButtons.tsx

@@ -1,4 +1,3 @@
-import React from 'react';
 import Box from '@mui/material/Box';
 import Button from '@mui/material/Button';
 import IconButton from '@mui/material/IconButton';

package/src/buttons/MRT_ExpandAllButton.tsx

@@ -1,4 +1,3 @@
-import React from 'react';
 import IconButton from '@mui/material/IconButton';
 import Tooltip from '@mui/material/Tooltip';
 import type { MRT_TableInstance } from '..';

package/src/buttons/MRT_ExpandButton.tsx

@@ -1,4 +1,4 @@
-import React, { MouseEvent } from 'react';
+import { MouseEvent } from 'react';
 import IconButton from '@mui/material/IconButton';
 import Tooltip from '@mui/material/Tooltip';
 import type { MRT_Row, MRT_TableInstance } from '..';

package/src/buttons/MRT_FullScreenToggleButton.tsx

@@ -1,4 +1,3 @@
-import React from 'react';
 import IconButton from '@mui/material/IconButton';
 import type { IconButtonProps } from '@mui/material/IconButton';
 import Tooltip from '@mui/material/Tooltip';

package/src/buttons/MRT_GrabHandleButton.tsx

@@ -1,4 +1,4 @@
-import React, { DragEventHandler } from 'react';
+import { DragEventHandler } from 'react';
 import IconButton from '@mui/material/IconButton';
 import Tooltip from '@mui/material/Tooltip';
 import type { IconButtonProps } from '@mui/material/IconButton';

package/src/buttons/MRT_ShowHideColumnsButton.tsx

@@ -1,4 +1,4 @@
-import React, { MouseEvent, useState } from 'react';
+import { MouseEvent, useState } from 'react';
 import IconButton from '@mui/material/IconButton';
 import type { IconButtonProps } from '@mui/material/IconButton';
 import Tooltip from '@mui/material/Tooltip';

package/src/buttons/MRT_ToggleDensePaddingButton.tsx

@@ -1,4 +1,3 @@
-import React from 'react';
 import IconButton from '@mui/material/IconButton';
 import type { IconButtonProps } from '@mui/material/IconButton';
 import Tooltip from '@mui/material/Tooltip';

package/src/buttons/MRT_ToggleFiltersButton.tsx

@@ -1,4 +1,3 @@
-import React from 'react';
 import IconButton from '@mui/material/IconButton';
 import type { IconButtonProps } from '@mui/material/IconButton';
 import Tooltip from '@mui/material/Tooltip';

package/src/buttons/MRT_ToggleGlobalFilterButton.tsx

@@ -1,4 +1,3 @@
-import React from 'react';
 import IconButton from '@mui/material/IconButton';
 import type { IconButtonProps } from '@mui/material/IconButton';
 import Tooltip from '@mui/material/Tooltip';

package/src/buttons/MRT_ToggleRowActionMenuButton.tsx

@@ -1,4 +1,4 @@
-import React, { MouseEvent, useState } from 'react';
+import { MouseEvent, useState } from 'react';
 import IconButton from '@mui/material/IconButton';
 import Tooltip from '@mui/material/Tooltip';
 import { MRT_RowActionMenu } from '../menus/MRT_RowActionMenu';

package/src/column.utils.ts

@@ -123,12 +123,13 @@ export const reorderColumn = <TData extends Record<string, any> = {}>(
   if (draggedColumn.getCanPin()) {
     draggedColumn.pin(targetColumn.getIsPinned());
   }
-  columnOrder.splice(
-    columnOrder.indexOf(targetColumn.id),
+  let newColumnOrder = [...columnOrder];
+  newColumnOrder.splice(
+    newColumnOrder.indexOf(targetColumn.id),
     0,
-    columnOrder.splice(columnOrder.indexOf(draggedColumn.id), 1)[0],
+    newColumnOrder.splice(newColumnOrder.indexOf(draggedColumn.id), 1)[0],
   );
-  return [...columnOrder];
+  return newColumnOrder;
 };
 
 export const showExpandColumn = <TData extends Record<string, any> = {}>(
@@ -238,9 +239,10 @@ export const getIsFirstRightPinnedColumn = (column: MRT_Column) => {
 };
 
 export const getTotalRight = (table: MRT_TableInstance, column: MRT_Column) => {
-  return (
-    (table.getRightLeafHeaders().length - 1 - column.getPinnedIndex()) * 200
-  );
+  return table
+    .getRightLeafHeaders()
+    .slice(column.getPinnedIndex() + 1)
+    .reduce((acc, col) => acc + col.getSize(), 0);
 };
 
 export const getCommonCellStyles = ({

package/src/footer/MRT_TableFooter.tsx

@@ -1,4 +1,3 @@
-import React from 'react';
 import TableFooter from '@mui/material/TableFooter';
 import { MRT_TableFooterRow } from './MRT_TableFooterRow';
 import type { VirtualItem } from '@tanstack/react-virtual';

package/src/footer/MRT_TableFooterCell.tsx

@@ -1,4 +1,3 @@
-import React from 'react';
 import TableCell from '@mui/material/TableCell';
 import { getCommonCellStyles } from '../column.utils';
 import type { MRT_Header, MRT_TableInstance } from '..';

package/src/footer/MRT_TableFooterRow.tsx

@@ -1,4 +1,3 @@
-import React from 'react';
 import TableRow from '@mui/material/TableRow';
 import { lighten } from '@mui/material/styles';
 import { MRT_TableFooterCell } from './MRT_TableFooterCell';

package/src/head/MRT_TableHead.tsx

@@ -1,4 +1,3 @@
-import React from 'react';
 import TableHead from '@mui/material/TableHead';
 import { MRT_TableHeadRow } from './MRT_TableHeadRow';
 import type { VirtualItem } from '@tanstack/react-virtual';

package/src/head/MRT_TableHeadCell.tsx

@@ -1,4 +1,4 @@
-import React, { DragEvent, ReactNode, useMemo } from 'react';
+import { DragEvent, ReactNode, useMemo } from 'react';
 import Box from '@mui/material/Box';
 import TableCell from '@mui/material/TableCell';
 import { useTheme } from '@mui/material/styles';

package/src/head/MRT_TableHeadCellColumnActionsButton.tsx

@@ -1,4 +1,4 @@
-import React, { MouseEvent, useState } from 'react';
+import { MouseEvent, useState } from 'react';
 import IconButton from '@mui/material/IconButton';
 import Tooltip from '@mui/material/Tooltip';
 import { MRT_ColumnActionMenu } from '../menus/MRT_ColumnActionMenu';

package/src/head/MRT_TableHeadCellFilterContainer.tsx

@@ -1,4 +1,3 @@
-import React from 'react';
 import Collapse from '@mui/material/Collapse';
 import { MRT_FilterRangeFields } from '../inputs/MRT_FilterRangeFields';
 import { MRT_FilterTextField } from '../inputs/MRT_FilterTextField';

package/src/head/MRT_TableHeadCellFilterLabel.tsx

@@ -1,4 +1,4 @@
-import React, { MouseEvent } from 'react';
+import { MouseEvent } from 'react';
 import Box from '@mui/material/Box';
 import Grow from '@mui/material/Grow';
 import IconButton from '@mui/material/IconButton';

package/src/head/MRT_TableHeadCellGrabHandle.tsx

@@ -1,4 +1,4 @@
-import React, { DragEvent, RefObject } from 'react';
+import { DragEvent, RefObject } from 'react';
 import { MRT_GrabHandleButton } from '../buttons/MRT_GrabHandleButton';
 import { reorderColumn } from '../column.utils';
 import type { MRT_Column, MRT_TableInstance } from '..';

package/src/head/MRT_TableHeadCellResizeHandle.tsx

@@ -1,4 +1,3 @@
-import React from 'react';
 import Box from '@mui/material/Box';
 import Divider from '@mui/material/Divider';
 import { MRT_Header, MRT_TableInstance } from '..';

package/src/head/MRT_TableHeadCellSortLabel.tsx

@@ -1,4 +1,3 @@
-import React from 'react';
 import Badge from '@mui/material/Badge';
 import TableSortLabel from '@mui/material/TableSortLabel';
 import Tooltip from '@mui/material/Tooltip';

package/src/head/MRT_TableHeadRow.tsx

@@ -1,4 +1,3 @@
-import React from 'react';
 import TableRow from '@mui/material/TableRow';
 import { alpha, lighten } from '@mui/material/styles';
 import { MRT_TableHeadCell } from './MRT_TableHeadCell';

package/src/index.tsx

@@ -11,9 +11,10 @@ import { MRT_EditActionButtons } from './buttons/MRT_EditActionButtons';
 import { MRT_ExpandButton } from './buttons/MRT_ExpandButton';
 import { MRT_FilterOptionMenu } from './menus/MRT_FilterOptionMenu';
 import { MRT_FullScreenToggleButton } from './buttons/MRT_FullScreenToggleButton';
-import { MRT_GrabHandleButton } from './buttons/MRT_GrabHandleButton';
 import { MRT_GlobalFilterTextField } from './inputs/MRT_GlobalFilterTextField';
+import { MRT_GrabHandleButton } from './buttons/MRT_GrabHandleButton';
 import { MRT_ShowHideColumnsButton } from './buttons/MRT_ShowHideColumnsButton';
+import { MRT_TableHeadCellFilterContainer } from './head/MRT_TableHeadCellFilterContainer';
 import { MRT_TablePagination } from './toolbar/MRT_TablePagination';
 import { MRT_ToggleDensePaddingButton } from './buttons/MRT_ToggleDensePaddingButton';
 import { MRT_ToggleFiltersButton } from './buttons/MRT_ToggleFiltersButton';
@@ -31,9 +32,10 @@ export {
   MRT_ExpandButton,
   MRT_FilterOptionMenu,
   MRT_FullScreenToggleButton,
-  MRT_GrabHandleButton,
   MRT_GlobalFilterTextField,
+  MRT_GrabHandleButton,
   MRT_ShowHideColumnsButton,
+  MRT_TableHeadCellFilterContainer,
   MRT_TablePagination,
   MRT_ToggleDensePaddingButton,
   MRT_ToggleFiltersButton,

package/src/inputs/MRT_EditCellTextField.tsx

@@ -1,4 +1,4 @@
-import React, { ChangeEvent, FocusEvent, KeyboardEvent, useState } from 'react';
+import { ChangeEvent, FocusEvent, KeyboardEvent, useState } from 'react';
 import TextField from '@mui/material/TextField';
 import MenuItem from '@mui/material/MenuItem';
 import type { TextFieldProps } from '@mui/material/TextField';

package/src/inputs/MRT_FilterCheckbox.tsx

@@ -1,4 +1,3 @@
-import React from 'react';
 import Checkbox from '@mui/material/Checkbox';
 import FormControlLabel from '@mui/material/FormControlLabel';
 import Tooltip from '@mui/material/Tooltip';

package/src/inputs/MRT_FilterRangeFields.tsx

@@ -1,4 +1,3 @@
-import React from 'react';
 import Box from '@mui/material/Box';
 import { MRT_FilterTextField } from './MRT_FilterTextField';
 import { MRT_Header, MRT_TableInstance } from '..';

package/src/inputs/MRT_FilterTextField.tsx

@@ -1,4 +1,4 @@
-import React, {
+import {
   ChangeEvent,
   MouseEvent,
   useCallback,

package/src/inputs/MRT_GlobalFilterTextField.tsx

@@ -1,4 +1,4 @@
-import React, {
+import {
   ChangeEvent,
   MouseEvent,
   useCallback,

package/src/inputs/MRT_SelectCheckbox.tsx

@@ -1,4 +1,4 @@
-import React, { MouseEvent } from 'react';
+import { MouseEvent } from 'react';
 import Checkbox from '@mui/material/Checkbox';
 import Tooltip from '@mui/material/Tooltip';
 import Radio from '@mui/material/Radio';

package/src/menus/MRT_ColumnActionMenu.tsx

@@ -1,4 +1,5 @@
-import React, { useState } from 'react';
+import { useState } from 'react';
+import * as React from 'react';
 import Box from '@mui/material/Box';
 import IconButton from '@mui/material/IconButton';
 import ListItemIcon from '@mui/material/ListItemIcon';
@@ -45,6 +46,7 @@ export const MRT_ColumnActionMenu = ({
       enableHiding,
       enablePinning,
       enableSorting,
+      enableSortingRemoval,
       icons: {
         ArrowRightIcon,
         ClearAllIcon,
@@ -162,20 +164,23 @@ export const MRT_ColumnActionMenu = ({
           table,
         }) ??
         (enableSorting &&
-          column.getCanSort() && [
-            <MenuItem
-              disabled={!column.getIsSorted()}
-              key={0}
-              onClick={handleClearSort}
-              sx={commonMenuItemStyles}
-            >
-              <Box sx={commonListItemStyles}>
-                <ListItemIcon>
-                  <ClearAllIcon />
-                </ListItemIcon>
-                {localization.clearSort}
-              </Box>
-            </MenuItem>,
+          column.getCanSort() &&
+          [
+            enableSortingRemoval !== false && (
+              <MenuItem
+                disabled={!column.getIsSorted()}
+                key={0}
+                onClick={handleClearSort}
+                sx={commonMenuItemStyles}
+              >
+                <Box sx={commonListItemStyles}>
+                  <ListItemIcon>
+                    <ClearAllIcon />
+                  </ListItemIcon>
+                  {localization.clearSort}
+                </Box>
+              </MenuItem>
+            ),
             <MenuItem
               disabled={column.getIsSorted() === 'asc'}
               key={1}
@@ -211,7 +216,7 @@ export const MRT_ColumnActionMenu = ({
                 )}
               </Box>
             </MenuItem>,
-          ])}
+          ].filter(Boolean))}
       {enableColumnFilters &&
         column.getCanFilter() &&
         [

package/src/menus/MRT_FilterOptionMenu.tsx

@@ -1,4 +1,4 @@
-import React, { useMemo } from 'react';
+import { useMemo } from 'react';
 import Box from '@mui/material/Box';
 import Menu from '@mui/material/Menu';
 import MenuItem from '@mui/material/MenuItem';

package/src/menus/MRT_RowActionMenu.tsx

@@ -1,4 +1,4 @@
-import React, { MouseEvent } from 'react';
+import { MouseEvent } from 'react';
 import Box from '@mui/material/Box';
 import ListItemIcon from '@mui/material/ListItemIcon';
 import Menu from '@mui/material/Menu';

package/src/menus/MRT_ShowHideColumnsMenu.tsx

@@ -1,4 +1,4 @@
-import React, { useMemo, useState } from 'react';
+import { useMemo, useState } from 'react';
 import Box from '@mui/material/Box';
 import Button from '@mui/material/Button';
 import Divider from '@mui/material/Divider';

package/src/menus/MRT_ShowHideColumnsMenuItems.tsx

@@ -1,10 +1,4 @@
-import React, {
-  Dispatch,
-  DragEvent,
-  SetStateAction,
-  useRef,
-  useState,
-} from 'react';
+import { Dispatch, DragEvent, SetStateAction, useRef, useState } from 'react';
 import Box from '@mui/material/Box';
 import FormControlLabel from '@mui/material/FormControlLabel';
 import MenuItem from '@mui/material/MenuItem';

package/src/table/MRT_Table.tsx

@@ -1,4 +1,4 @@
-import React, { useCallback, useMemo } from 'react';
+import { useCallback, useMemo } from 'react';
 import {
   defaultRangeExtractor,
   useVirtualizer,

package/src/table/MRT_TableContainer.tsx

@@ -1,4 +1,4 @@
-import React, { useEffect, useLayoutEffect, useState } from 'react';
+import { useEffect, useLayoutEffect, useState } from 'react';
 import TableContainer from '@mui/material/TableContainer';
 import { MRT_Table } from './MRT_Table';
 import type { MRT_TableInstance } from '..';

package/src/table/MRT_TablePaper.tsx

@@ -1,4 +1,3 @@
-import React from 'react';
 import Paper from '@mui/material/Paper';
 import { MRT_TopToolbar } from '../toolbar/MRT_TopToolbar';
 import { MRT_BottomToolbar } from '../toolbar/MRT_BottomToolbar';

package/src/table/MRT_TableRoot.tsx

@@ -1,4 +1,4 @@
-import React, { useEffect, useMemo, useRef, useState } from 'react';
+import { useEffect, useMemo, useRef, useState } from 'react';
 import {
   getCoreRowModel,
   getExpandedRowModel,
@@ -39,6 +39,7 @@ import type {
   MRT_DensityState,
   MRT_ColumnOrderState,
   MRT_GroupingState,
+  MRT_FilterFnsState,
 } from '..';
 
 export const MRT_TableRoot: any = <TData extends Record<string, any> = {}>(
@@ -61,22 +62,21 @@ export const MRT_TableRoot: any = <TData extends Record<string, any> = {}>(
     return initState;
   }, []);
 
-  const [columnFilterFns, setColumnFilterFns] = useState<{
-    [key: string]: MRT_FilterOption;
-  }>(() =>
-    Object.assign(
-      {},
-      ...getAllLeafColumnDefs(props.columns as MRT_ColumnDef<TData>[]).map(
-        (col) => ({
-          [getColumnId(col)]:
-            col.filterFn instanceof Function
-              ? col.filterFn.name ?? 'custom'
-              : col.filterFn ??
-                initialState?.columnFilterFns?.[getColumnId(col)] ??
-                getDefaultColumnFilterFn(col),
-        }),
+  const [columnFilterFns, setColumnFilterFns] = useState<MRT_FilterFnsState>(
+    () =>
+      Object.assign(
+        {},
+        ...getAllLeafColumnDefs(props.columns as MRT_ColumnDef<TData>[]).map(
+          (col) => ({
+            [getColumnId(col)]:
+              col.filterFn instanceof Function
+                ? col.filterFn.name ?? 'custom'
+                : col.filterFn ??
+                  initialState?.columnFilterFns?.[getColumnId(col)] ??
+                  getDefaultColumnFilterFn(col),
+          }),
+        ),
       ),
-    ),
   );
   const [columnOrder, setColumnOrder] = useState<MRT_ColumnOrderState>(
     initialState.columnOrder ?? [],

package/src/toolbar/MRT_BottomToolbar.tsx

@@ -1,4 +1,3 @@
-import React from 'react';
 import Box from '@mui/material/Box';
 import Toolbar from '@mui/material/Toolbar';
 import useMediaQuery from '@mui/material/useMediaQuery';

package/src/toolbar/MRT_LinearProgressBar.tsx

@@ -1,4 +1,3 @@
-import React from 'react';
 import Collapse from '@mui/material/Collapse';
 import LinearProgress from '@mui/material/LinearProgress';
 import type { MRT_TableInstance } from '..';