material-react-table 1.5.8 → 1.5.10

package/package.json

@@ -1,5 +1,5 @@
 {
-  "version": "1.5.8",
+  "version": "1.5.10",
   "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/footer/MRT_TableFooter.tsx

@@ -1,6 +1,5 @@
 import React, { FC } from 'react';
 import TableFooter from '@mui/material/TableFooter';
-import { lighten } from '@mui/material/styles';
 import { MRT_TableFooterRow } from './MRT_TableFooterRow';
 import type { VirtualItem } from '@tanstack/react-virtual';
 import type { MRT_TableInstance } from '..';
@@ -37,7 +36,6 @@ export const MRT_TableFooter: FC<Props> = ({
     <TableFooter
       {...tableFooterProps}
       sx={(theme) => ({
-        backgroundColor: lighten(theme.palette.background.default, 0.06),
         bottom: stickFooter ? 0 : undefined,
         display: layoutMode === 'grid' ? 'grid' : 'table-row-group',
         opacity: stickFooter ? 0.97 : undefined,

package/src/footer/MRT_TableFooterRow.tsx

@@ -1,5 +1,6 @@
 import React, { FC } 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 { MRT_Header, MRT_HeaderGroup, MRT_TableInstance } from '..';
@@ -43,6 +44,7 @@ export const MRT_TableFooterRow: FC<Props> = ({
     <TableRow
       {...tableRowProps}
       sx={(theme) => ({
+        backgroundColor: lighten(theme.palette.background.default, 0.04),
         display: layoutMode === 'grid' ? 'flex' : 'table-row',
         width: '100%',
         ...(tableRowProps?.sx instanceof Function

package/src/head/MRT_TableHeadCellResizeHandle.tsx

@@ -35,12 +35,10 @@ export const MRT_TableHeadCellResizeHandle: FC<Props> = ({ header, table }) => {
         },
       })}
       style={{
-        transform: column.getIsResizing()
-          ? `translateX(${
-              (getState().columnSizingInfo.deltaOffset ?? 0) /
-              (columnResizeMode === 'onChange' ? 16 : 1)
-            }px)`
-          : undefined,
+        transform:
+          column.getIsResizing() && columnResizeMode === 'onEnd'
+            ? `translateX(${getState().columnSizingInfo.deltaOffset ?? 0}px)`
+            : undefined,
       }}
     >
       <Divider

package/src/inputs/MRT_FilterTextField.tsx

@@ -165,10 +165,7 @@ export const MRT_FilterTextField: FC<Props> = ({
     column.setFilterValue(undefined);
     setColumnFilterFns((prev) => ({
       ...prev,
-      [header.id]:
-        columnDef.columnFilterModeOptions?.[0] ??
-        columnFilterModeOptions?.[0] ??
-        'fuzzy',
+      [header.id]: allowedColumnFilterOptions?.[0] ?? 'fuzzy',
     }));
   };
 
@@ -242,7 +239,7 @@ export const MRT_FilterTextField: FC<Props> = ({
         onChange={handleChange}
         onClick={(e: MouseEvent<HTMLInputElement>) => e.stopPropagation()}
         select={isSelectFilter || isMultiSelectFilter}
-        value={filterValue}
+        value={filterValue ?? ''}
         variant="standard"
         InputProps={{
           startAdornment: showChangeModeButton ? (

package/src/table/MRT_Table.tsx

@@ -127,6 +127,7 @@ export const MRT_Table: FC<Props> = ({ table }) => {
       stickyHeader={enableStickyHeader || isFullScreen}
       {...tableProps}
       sx={(theme) => ({
+        borderCollapse: 'separate',
         display: layoutMode === 'grid' ? 'grid' : 'table',
         tableLayout:
           layoutMode !== 'grid' && enableColumnResizing ? 'fixed' : undefined,

package/src/table/MRT_TableRoot.tsx

@@ -314,7 +314,8 @@ export const MRT_TableRoot = <TData extends Record<string, any> = {}>(
     setShowAlertBanner: props.onShowAlertBannerChange ?? setShowAlertBanner,
     setShowFilters: props.onShowFiltersChange ?? setShowFilters,
     setShowGlobalFilter: props.onShowGlobalFilterChange ?? setShowGlobalFilter,
-    setShowToolbarDropZone: props.onShowToolbarDropZoneChange ?? setShowToolbarDropZone,
+    setShowToolbarDropZone:
+      props.onShowToolbarDropZoneChange ?? setShowToolbarDropZone,
   } as MRT_TableInstance<TData>;
 
   if (props.tableInstanceRef) {