material-react-table 0.22.1 → 0.22.2

package/package.json

@@ -1,5 +1,5 @@
 {
-  "version": "0.22.1",
+  "version": "0.22.2",
   "license": "MIT",
   "name": "material-react-table",
   "description": "A fully featured Material UI implementation of TanStack React Table, inspired by material-table and the MUI X DataGrid, written from the ground up in TypeScript.",

package/src/MaterialReactTable.tsx

@@ -131,7 +131,7 @@ export type MRT_TableState<TData extends Record<string, any> = {}> =
     isLoading: boolean;
     isFullScreen: boolean;
     showAlertBanner: boolean;
-    showFilters: boolean;
+    showColumnFilters: boolean;
     showGlobalFilter: boolean;
     showProgressBars: boolean;
     showSkeletons: boolean;

package/src/buttons/MRT_CopyButton.tsx

@@ -50,7 +50,6 @@ export const MRT_CopyButton: FC<Props> = ({ cell, children, table }) => {
       title={copied ? localization.copiedToClipboard : localization.clickToCopy}
     >
       <Button
-        aria-label={localization.clickToCopy}
         onClick={() => handleCopy(cell.getValue())}
         size="small"
         type="button"

package/src/buttons/MRT_ToggleFiltersButton.tsx

@@ -15,10 +15,10 @@ export const MRT_ToggleFiltersButton: FC<Props> = ({ table, ...rest }) => {
     },
     setShowFilters,
   } = table;
-  const { showFilters } = getState();
+  const { showColumnFilters } = getState();
 
   const handleToggleShowFilters = () => {
-    setShowFilters(!showFilters);
+    setShowFilters(!showColumnFilters);
   };
 
   return (
@@ -28,7 +28,7 @@ export const MRT_ToggleFiltersButton: FC<Props> = ({ table, ...rest }) => {
         onClick={handleToggleShowFilters}
         {...rest}
       >
-        {showFilters ? <FilterListOffIcon /> : <FilterListIcon />}
+        {showColumnFilters ? <FilterListOffIcon /> : <FilterListIcon />}
       </IconButton>
     </Tooltip>
   );

package/src/filtersFns.ts

@@ -4,10 +4,10 @@ import { filterFns, Row } from '@tanstack/react-table';
 export const fuzzy = <TData extends Record<string, any> = {}>(
   row: Row<TData>,
   columnId: string,
-  filterValue: string,
+  filterValue: string | number,
   addMeta: (item: RankingInfo) => void,
 ) => {
-  const itemRank = rankItem(row.getValue(columnId), filterValue, {
+  const itemRank = rankItem(row.getValue(columnId), filterValue as string, {
     threshold: rankings.MATCHES,
   });
   addMeta(itemRank);

package/src/head/MRT_TableHeadCellFilterContainer.tsx

@@ -14,11 +14,11 @@ export const MRT_TableHeadCellFilterContainer: FC<Props> = ({
   table,
 }) => {
   const { getState } = table;
-  const { currentFilterFns, showFilters } = getState();
+  const { currentFilterFns, showColumnFilters } = getState();
   const { column } = header;
 
   return (
-    <Collapse in={showFilters} mountOnEnter unmountOnExit>
+    <Collapse in={showColumnFilters} mountOnEnter unmountOnExit>
       {currentFilterFns[column.id] === 'between' ? (
         <MRT_FilterRangeFields header={header} table={table} />
       ) : (

package/src/head/MRT_TableHeadCellResizeHandle.tsx

@@ -12,7 +12,7 @@ export const MRT_TableHeadCellResizeHandle: FC<Props> = ({ header, table }) => {
     getState,
     options: { columnResizeMode },
   } = table;
-  const { density, showFilters } = getState();
+  const { density, showColumnFilters } = getState();
   const { column } = header;
   const { columnDef } = column;
   const { columnDefType } = columnDef;
@@ -26,7 +26,7 @@ export const MRT_TableHeadCellResizeHandle: FC<Props> = ({ header, table }) => {
         borderRadius: '2px',
         borderRightWidth: '2px',
         cursor: 'col-resize',
-        height: showFilters && columnDefType === 'data' ? '4rem' : '2rem',
+        height: showColumnFilters && columnDefType === 'data' ? '4rem' : '2rem',
         mr: density === 'compact' ? '-0.5rem' : '-1rem',
         opacity: 0.8,
         position: 'absolute',

package/src/table/MRT_TableRoot.tsx

@@ -65,8 +65,8 @@ export const MRT_TableRoot = <TData extends Record<string, any> = {}>(
   const [showAlertBanner, setShowAlertBanner] = useState(
     props.initialState?.showAlertBanner ?? false,
   );
-  const [showFilters, setShowFilters] = useState(
-    initialState?.showFilters ?? false,
+  const [showColumnFilters, setShowFilters] = useState(
+    initialState?.showColumnFilters ?? false,
   );
   const [showGlobalFilter, setShowGlobalFilter] = useState(
     initialState?.showGlobalFilter ?? false,
@@ -230,7 +230,7 @@ export const MRT_TableRoot = <TData extends Record<string, any> = {}>(
         density,
         isFullScreen,
         showAlertBanner,
-        showFilters,
+        showColumnFilters,
         showGlobalFilter,
         ...props.state,
       } as TableState,