refactor filter textfield slotProps, package upgrades, un-deprecate s…

…ome muiProps
KevinVandy · Dec 22, 2024 · 56b9cb1 · 56b9cb1
1 parent 99f970d
commit 56b9cb1
Show file tree

Hide file tree

Showing 28 changed files with 818 additions and 924 deletions.
diff --git a/apps/material-react-table-docs/package.json b/apps/material-react-table-docs/package.json
@@ -13,22 +13,22 @@
     "sitemap": "pnpm docs:sitemap"
   },
   "dependencies": {
-    "@docsearch/js": "3.8.0",
+    "@docsearch/js": "3.8.2",
     "@emotion/react": "^11.14.0",
     "@emotion/styled": "^11.14.0",
     "@faker-js/faker": "^9.3.0",
-    "@fortawesome/fontawesome-svg-core": "^6.7.1",
-    "@fortawesome/free-solid-svg-icons": "^6.7.1",
+    "@fortawesome/fontawesome-svg-core": "^6.7.2",
+    "@fortawesome/free-solid-svg-icons": "^6.7.2",
     "@fortawesome/react-fontawesome": "^0.2.2",
     "@mdx-js/loader": "^3.1.0",
     "@mdx-js/react": "^3.1.0",
-    "@mui/icons-material": "^6.2.0",
-    "@mui/material": "^6.2.0",
+    "@mui/icons-material": "^6.2.1",
+    "@mui/material": "^6.2.1",
     "@mui/x-charts": "^7.23.2",
-    "@mui/x-date-pickers": "^7.23.2",
-    "@next/mdx": "^15.1.0",
-    "@tanstack/react-query": "^5.62.7",
-    "@tanstack/react-table-devtools": "^8.20.5",
+    "@mui/x-date-pickers": "^7.23.3",
+    "@next/mdx": "^15.1.2",
+    "@tanstack/react-query": "^5.62.8",
+    "@tanstack/react-table-devtools": "^8.20.6",
     "@types/mdx": "^2.0.13",
     "dayjs": "^1.11.13",
     "export-to-csv": "^1.4.0",
@@ -47,12 +47,12 @@
   "devDependencies": {
     "@tanstack/eslint-plugin-query": "^5.62.1",
     "@types/node": "^22.10.2",
-    "@types/react": "^19.0.1",
+    "@types/react": "^19.0.2",
     "@types/react-dom": "^19.0.2",
-    "@typescript-eslint/eslint-plugin": "^8.18.0",
-    "@typescript-eslint/parser": "^8.18.0",
-    "eslint": "9.16.0",
-    "eslint-config-next": "15.1.0",
+    "@typescript-eslint/eslint-plugin": "^8.18.1",
+    "@typescript-eslint/parser": "^8.18.1",
+    "eslint": "9.17.0",
+    "eslint-config-next": "15.1.2",
     "next-plausible": "^3.12.4",
     "raw-loader": "^4.0.2",
     "typescript": "5.7.2"

diff --git a/apps/material-react-table-docs/public/sitemap-0.xml b/apps/material-react-table-docs/public/sitemap-0.xml
diff --git a/apps/test-cra/package.json b/apps/test-cra/package.json
@@ -5,9 +5,9 @@
   "dependencies": {
     "@emotion/react": "^11.14.0",
     "@emotion/styled": "^11.14.0",
-    "@mui/icons-material": "^6.2.0",
-    "@mui/material": "^6.2.0",
-    "@mui/x-date-pickers": "^7.23.2",
+    "@mui/icons-material": "^6.2.1",
+    "@mui/material": "^6.2.1",
+    "@mui/x-date-pickers": "^7.23.3",
     "@testing-library/jest-dom": "^6.6.3",
     "@testing-library/react": "^16.1.0",
     "@testing-library/user-event": "^14.5.2",

diff --git a/apps/test-remix/package.json b/apps/test-remix/package.json
@@ -12,24 +12,24 @@
   "dependencies": {
     "@emotion/react": "^11.14.0",
     "@emotion/styled": "^11.14.0",
-    "@mui/icons-material": "^6.2.0",
-    "@mui/material": "^6.2.0",
-    "@mui/x-date-pickers": "^7.23.2",
-    "@remix-run/css-bundle": "^2.15.1",
-    "@remix-run/node": "^2.15.1",
-    "@remix-run/react": "^2.15.1",
-    "@remix-run/serve": "^2.15.1",
-    "isbot": "^5.1.17",
+    "@mui/icons-material": "^6.2.1",
+    "@mui/material": "^6.2.1",
+    "@mui/x-date-pickers": "^7.23.3",
+    "@remix-run/css-bundle": "^2.15.2",
+    "@remix-run/node": "^2.15.2",
+    "@remix-run/react": "^2.15.2",
+    "@remix-run/serve": "^2.15.2",
+    "isbot": "^5.1.18",
     "material-react-table": "workspace:*",
     "react": "^19.0.0",
     "react-dom": "^19.0.0"
   },
   "devDependencies": {
-    "@remix-run/dev": "^2.15.1",
-    "@remix-run/eslint-config": "^2.15.1",
-    "@types/react": "^19.0.1",
+    "@remix-run/dev": "^2.15.2",
+    "@remix-run/eslint-config": "^2.15.2",
+    "@types/react": "^19.0.2",
     "@types/react-dom": "^19.0.2",
-    "eslint": "^9.16.0",
+    "eslint": "^9.17.0",
     "typescript": "^5.7.2"
   },
   "engines": {

diff --git a/apps/test-vite/package.json b/apps/test-vite/package.json
@@ -12,23 +12,23 @@
   "dependencies": {
     "@emotion/react": "^11.14.0",
     "@emotion/styled": "^11.14.0",
-    "@mui/icons-material": "^6.2.0",
-    "@mui/material": "^6.2.0",
-    "@mui/x-date-pickers": "^7.23.2",
+    "@mui/icons-material": "^6.2.1",
+    "@mui/material": "^6.2.1",
+    "@mui/x-date-pickers": "^7.23.3",
     "material-react-table": "workspace:*",
     "react": "^19.0.0",
     "react-dom": "^19.0.0"
   },
   "devDependencies": {
-    "@types/react": "^19.0.1",
+    "@types/react": "^19.0.2",
     "@types/react-dom": "^19.0.2",
-    "@typescript-eslint/eslint-plugin": "^8.18.0",
-    "@typescript-eslint/parser": "^8.18.0",
+    "@typescript-eslint/eslint-plugin": "^8.18.1",
+    "@typescript-eslint/parser": "^8.18.1",
     "@vitejs/plugin-react": "^4.3.4",
-    "eslint": "^9.16.0",
+    "eslint": "^9.17.0",
     "eslint-plugin-react-hooks": "^5.1.0",
     "eslint-plugin-react-refresh": "^0.4.16",
     "typescript": "^5.7.2",
-    "vite": "^6.0.3"
+    "vite": "^6.0.5"
   }
 }
diff --git a/packages/material-react-table/package.json b/packages/material-react-table/package.json
@@ -65,9 +65,9 @@
     "@emotion/react": "^11.14.0",
     "@emotion/styled": "^11.14.0",
     "@faker-js/faker": "^9.3.0",
-    "@mui/icons-material": "^6.2.0",
-    "@mui/material": "^6.2.0",
-    "@mui/x-date-pickers": "^7.23.2",
+    "@mui/icons-material": "^6.2.1",
+    "@mui/material": "^6.2.1",
+    "@mui/x-date-pickers": "^7.23.3",
     "@rollup/plugin-typescript": "^11.1.6",
     "@size-limit/preset-small-lib": "^11.1.6",
     "@storybook/addon-a11y": "^8.4.7",
@@ -79,14 +79,14 @@
     "@storybook/react": "^8.4.7",
     "@storybook/react-vite": "^8.4.7",
     "@types/node": "^22.10.2",
-    "@types/react": "^19.0.1",
+    "@types/react": "^19.0.2",
     "@types/react-dom": "^19.0.2",
-    "@typescript-eslint/eslint-plugin": "8.5.0",
-    "@typescript-eslint/parser": "8.5.0",
+    "@typescript-eslint/eslint-plugin": "8.18.1",
+    "@typescript-eslint/parser": "8.18.1",
     "@vitejs/plugin-react": "^4.3.4",
-    "eslint": "^9.16.0",
+    "eslint": "^9.17.0",
     "eslint-plugin-mui-path-imports": "^0.0.15",
-    "eslint-plugin-perfectionist": "^4.3.0",
+    "eslint-plugin-perfectionist": "^4.4.0",
     "eslint-plugin-storybook": "^0.11.1",
     "react": "^19.0.0",
     "react-dom": "^19.0.0",
@@ -100,8 +100,8 @@
     "storybook": "^8.4.7",
     "storybook-dark-mode": "^4.0.2",
     "tslib": "^2.8.1",
-    "typescript": "5.6.2",
-    "vite": "^6.0.3"
+    "typescript": "5.7.2",
+    "vite": "^6.0.5"
   },
   "peerDependencies": {
     "@emotion/react": ">=11.13",
@@ -114,8 +114,8 @@
   },
   "dependencies": {
     "@tanstack/match-sorter-utils": "8.19.4",
-    "@tanstack/react-table": "8.20.5",
-    "@tanstack/react-virtual": "3.11.1",
+    "@tanstack/react-table": "8.20.6",
+    "@tanstack/react-virtual": "3.11.2",
     "highlight-words": "2.0.0"
   }
 }
diff --git a/packages/material-react-table/src/components/body/MRT_TableBodyCell.tsx b/packages/material-react-table/src/components/body/MRT_TableBodyCell.tsx
@@ -187,7 +187,7 @@ export const MRT_TableBodyCell = <TData extends MRT_RowData>({
     (parseFromValuesOrFunc(enableClickToCopy, cell) === true ||
       parseFromValuesOrFunc(columnDef.enableClickToCopy, cell) === true) &&
     !['context-menu', false].includes(
-      // @ts-ignore
+      // @ts-expect-error
       parseFromValuesOrFunc(columnDef.enableClickToCopy, cell),
     );
 

diff --git a/packages/material-react-table/src/components/body/MRT_TableBodyRow.tsx b/packages/material-react-table/src/components/body/MRT_TableBodyRow.tsx
@@ -129,7 +129,7 @@ export const MRT_TableBodyRow = <TData extends MRT_RowData>({
     density === 'compact' ? 37 : density === 'comfortable' ? 53 : 69;
 
   const customRowHeight =
-    // @ts-ignore
+    // @ts-expect-error
     parseInt(tableRowProps?.style?.height ?? sx?.height, 10) || undefined;
 
   const rowHeight = customRowHeight || defaultRowHeight;

diff --git a/packages/material-react-table/src/components/buttons/MRT_EditActionButtons.tsx b/packages/material-react-table/src/components/buttons/MRT_EditActionButtons.tsx
@@ -62,7 +62,7 @@ export const MRT_EditActionButtons = <TData extends MRT_RowData>({
           input.value !== undefined &&
           Object.hasOwn(row?._valuesCache as object, input.name)
         ) {
-          // @ts-ignore
+          // @ts-expect-error
           row._valuesCache[input.name] = input.value;
         }
       });

diff --git a/packages/material-react-table/src/components/footer/MRT_TableFooter.tsx b/packages/material-react-table/src/components/footer/MRT_TableFooter.tsx
@@ -57,7 +57,7 @@ export const MRT_TableFooter = <TData extends MRT_RowData>({
       ref={(ref: HTMLTableSectionElement) => {
         tableFooterRef.current = ref;
         if (tableFooterProps?.ref) {
-          // @ts-ignore
+          // @ts-expect-error
           tableFooterProps.ref.current = ref;
         }
       }}

diff --git a/packages/material-react-table/src/components/head/MRT_TableHead.tsx b/packages/material-react-table/src/components/head/MRT_TableHead.tsx
@@ -44,7 +44,7 @@ export const MRT_TableHead = <TData extends MRT_RowData>({
       ref={(ref: HTMLTableSectionElement) => {
         tableHeadRef.current = ref;
         if (tableHeadProps?.ref) {
-          // @ts-ignore
+          // @ts-expect-error
           tableHeadProps.ref.current = ref;
         }
       }}

diff --git a/packages/material-react-table/src/components/head/MRT_TableHeadCellFilterLabel.tsx b/packages/material-react-table/src/components/head/MRT_TableHeadCellFilterLabel.tsx
@@ -76,12 +76,11 @@ export const MRT_TableHeadCellFilterLabel = <TData extends MRT_RowData = {}>({
           .replace(
             '{filterType}',
             currentFilterOption
-              ? // @ts-ignore
-                localization[
+              ? localization[
                   `filter${
-                    currentFilterOption?.charAt(0)?.toUpperCase() +
-                    currentFilterOption?.slice(1)
-                  }`
+                    currentFilterOption.charAt(0).toUpperCase() +
+                    currentFilterOption.slice(1)
+                  }` as keyof typeof localization
                 ]
               : '',
           )
@@ -109,8 +108,7 @@ export const MRT_TableHeadCellFilterLabel = <TData extends MRT_RowData = {}>({
         in={
           columnFilterDisplayMode === 'popover' ||
           (!!filterValue && !isRangeFilter) ||
-          (isRangeFilter && // @ts-ignore
-            (!!filterValue?.[0] || !!filterValue?.[1]))
+          (isRangeFilter && (!!filterValue?.[0] || !!filterValue?.[1]))
         }
         unmountOnExit
       >
@@ -158,7 +156,7 @@ export const MRT_TableHeadCellFilterLabel = <TData extends MRT_RowData = {}>({
           disableScrollLock
           onClick={(event) => event.stopPropagation()}
           onClose={(event) => {
-            //@ts-ignore
+            //@ts-expect-error
             event.stopPropagation();
             setAnchorEl(null);
           }}

diff --git a/packages/material-react-table/src/components/inputs/MRT_EditCellTextField.tsx b/packages/material-react-table/src/components/inputs/MRT_EditCellTextField.tsx
@@ -70,7 +70,7 @@ export const MRT_EditCellTextField = <TData extends MRT_RowData>({
   const isSelectEdit = editVariant === 'select' || textFieldProps?.select;
 
   const saveInputValueToRowCache = (newValue: string) => {
-    //@ts-ignore
+    //@ts-expect-error
     row._valuesCache[column.id] = newValue;
     if (isCreating) {
       setCreatingRow(row);

diff --git a/packages/material-react-table/src/components/inputs/MRT_FilterRangeSlider.tsx b/packages/material-react-table/src/components/inputs/MRT_FilterRangeSlider.tsx
@@ -100,9 +100,9 @@ export const MRT_FilterRangeSlider = <TData extends MRT_RowData>({
             ref: (node) => {
               if (node) {
                 filterInputRefs.current![`${column.id}-0`] = node;
-                // @ts-ignore
+                // @ts-expect-error
                 if (sliderProps?.slotProps?.input?.ref) {
-                  //@ts-ignore
+                  //@ts-expect-error
                   sliderProps.slotProps.input.ref = node;
                 }
               }
@@ -129,12 +129,11 @@ export const MRT_FilterRangeSlider = <TData extends MRT_RowData>({
         >
           {localization.filterMode.replace(
             '{filterType}',
-            // @ts-ignore
             localization[
               `filter${
                 currentFilterOption?.charAt(0)?.toUpperCase() +
                 currentFilterOption?.slice(1)
-              }`
+              }` as keyof typeof localization
             ],
           )}
         </FormHelperText>