@mui/x-data-grid 6.17.0 → 6.18.1

package/node/hooks/features/filter/gridFilterUtils.js

@@ -4,12 +4,13 @@ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefau
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.sanitizeFilterModel = exports.passFilterLogic = exports.mergeStateWithFilterModel = exports.cleanFilterItem = exports.buildAggregatedQuickFilterApplier = exports.buildAggregatedFilterItemsApplier = exports.buildAggregatedFilterApplier = void 0;
+exports.sanitizeFilterModel = exports.removeDiacritics = exports.passFilterLogic = exports.mergeStateWithFilterModel = exports.cleanFilterItem = exports.buildAggregatedFilterApplier = void 0;
 var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
 var _models = require("../../../models");
 var _utils = require("../../../colDef/utils");
 var _gridFilterState = require("./gridFilterState");
 var _warning = require("../../../utils/warning");
+var _getPublicApiRef = require("../../../utils/getPublicApiRef");
 var _columns = require("../columns");
 // Fixes https://github.com/mui/mui-x/issues/10056
 const globalScope = typeof window === 'undefined' ? globalThis : window;
@@ -23,7 +24,7 @@ try {
 /**
  * Adds default values to the optional fields of a filter items.
  * @param {GridFilterItem} item The raw filter item.
- * @param {React.MutableRefObject<GridApiCommunity>} apiRef The API of the grid.
+ * @param {React.MutableRefObject<GridPrivateApiCommunity>} apiRef The API of the grid.
  * @return {GridFilterItem} The clean filter item with an uniq ID and an always-defined operator.
  * TODO: Make the typing reflect the different between GridFilterInputItem and GridFilterItem.
  */
@@ -78,6 +79,13 @@ const mergeStateWithFilterModel = (filterModel, disableMultipleColumnsFiltering,
   filterModel: sanitizeFilterModel(filterModel, disableMultipleColumnsFiltering, apiRef)
 });
 exports.mergeStateWithFilterModel = mergeStateWithFilterModel;
+const removeDiacritics = value => {
+  if (typeof value === 'string') {
+    return value.normalize('NFD').replace(/[\u0300-\u036f]/g, '');
+  }
+  return value;
+};
+exports.removeDiacritics = removeDiacritics;
 const getFilterCallbackFromItem = (filterItem, apiRef) => {
   if (!filterItem.field || !filterItem.operator) {
     return null;
@@ -93,6 +101,12 @@ const getFilterCallbackFromItem = (filterItem, apiRef) => {
   } else {
     parsedValue = filterItem.value;
   }
+  const {
+    ignoreDiacritics
+  } = apiRef.current.rootProps;
+  if (ignoreDiacritics) {
+    parsedValue = removeDiacritics(parsedValue);
+  }
   const newFilterItem = (0, _extends2.default)({}, filterItem, {
     value: parsedValue
   });
@@ -106,6 +120,7 @@ const getFilterCallbackFromItem = (filterItem, apiRef) => {
   }
   const hasUserFunctionLegacy = !(0, _utils.isInternalFilter)(filterOperator.getApplyFilterFn);
   const hasUserFunctionV7 = !(0, _utils.isInternalFilter)(filterOperator.getApplyFilterFnV7);
+  const publicApiRef = (0, _getPublicApiRef.getPublicApiRef)(apiRef);
   if (filterOperator.getApplyFilterFnV7 && !(hasUserFunctionLegacy && !hasUserFunctionV7)) {
     const applyFilterOnRow = filterOperator.getApplyFilterFnV7(newFilterItem, column);
     if (typeof applyFilterOnRow !== 'function') {
@@ -115,8 +130,11 @@ const getFilterCallbackFromItem = (filterItem, apiRef) => {
       v7: true,
       item: newFilterItem,
       fn: row => {
-        const value = apiRef.current.getRowValue(row, column);
-        return applyFilterOnRow(value, row, column, apiRef);
+        let value = apiRef.current.getRowValue(row, column);
+        if (ignoreDiacritics) {
+          value = removeDiacritics(value);
+        }
+        return applyFilterOnRow(value, row, column, publicApiRef);
       }
     };
   }
@@ -129,7 +147,10 @@ const getFilterCallbackFromItem = (filterItem, apiRef) => {
     item: newFilterItem,
     fn: rowId => {
       const params = apiRef.current.getCellParams(rowId, newFilterItem.field);
-      _utils.GLOBAL_API_REF.current = apiRef;
+      _utils.GLOBAL_API_REF.current = publicApiRef;
+      if (ignoreDiacritics) {
+        params.value = removeDiacritics(params.value);
+      }
       const result = applyFilterOnRow(params);
       _utils.GLOBAL_API_REF.current = null;
       return result;
@@ -140,12 +161,11 @@ let filterItemsApplierId = 1;
 
 /**
  * Generates a method to easily check if a row is matching the current filter model.
- * @param {GridRowIdGetter | undefined} getRowId The getter for row's id.
  * @param {GridFilterModel} filterModel The model with which we want to filter the rows.
- * @param {React.MutableRefObject<GridApiCommunity>} apiRef The API of the grid.
+ * @param {React.MutableRefObject<GridPrivateApiCommunity>} apiRef The API of the grid.
  * @returns {GridAggregatedFilterItemApplier | null} A method that checks if a row is matching the current filter model. If `null`, we consider that all the rows are matching the filters.
  */
-const buildAggregatedFilterItemsApplier = (getRowId, filterModel, apiRef, disableEval) => {
+const buildAggregatedFilterItemsApplier = (filterModel, apiRef, disableEval) => {
   const {
     items
   } = filterModel;
@@ -160,7 +180,7 @@ const buildAggregatedFilterItemsApplier = (getRowId, filterModel, apiRef, disabl
       for (let i = 0; i < appliers.length; i += 1) {
         const applier = appliers[i];
         if (!shouldApplyFilter || shouldApplyFilter(applier.item.field)) {
-          resultPerItemId[applier.item.id] = applier.v7 ? applier.fn(row) : applier.fn(getRowId ? getRowId(row) : row.id);
+          resultPerItemId[applier.item.id] = applier.v7 ? applier.fn(row) : applier.fn(apiRef.current.getRowId(row));
         }
       }
       return resultPerItemId;
@@ -176,14 +196,14 @@ const buildAggregatedFilterItemsApplier = (getRowId, filterModel, apiRef, disabl
       ${appliers.map((applier, i) => `${JSON.stringify(String(applier.item.id))}:
           !shouldApply${i} ?
             false :
-            ${applier.v7 ? `appliers[${i}].fn(row)` : `appliers[${i}].fn(${getRowId ? 'getRowId(row)' : 'row.id'})`},
+            ${applier.v7 ? `appliers[${i}].fn(row)` : `appliers[${i}].fn(getRowId(row))`},
       `).join('\n')}};
 
       return result$$;
     })`;
   const filterItemCore = evalCode(filterItemTemplate.replaceAll('$$', String(filterItemsApplierId)));
   const filterItem = (row, shouldApplyItem) => {
-    return filterItemCore(getRowId, appliers, row, shouldApplyItem);
+    return filterItemCore(apiRef.current.getRowId, appliers, row, shouldApplyItem);
   };
   filterItemsApplierId += 1;
   return filterItem;
@@ -191,13 +211,11 @@ const buildAggregatedFilterItemsApplier = (getRowId, filterModel, apiRef, disabl
 
 /**
  * Generates a method to easily check if a row is matching the current quick filter.
- * @param {GridRowIdGetter | undefined} getRowId The getter for row's id.
  * @param {any[]} filterModel The model with which we want to filter the rows.
- * @param {React.MutableRefObject<GridApiCommunity>} apiRef The API of the grid.
+ * @param {React.MutableRefObject<GridPrivateApiCommunity>} apiRef The API of the grid.
  * @returns {GridAggregatedFilterItemApplier | null} A method that checks if a row is matching the current filter model. If `null`, we consider that all the rows are matching the filters.
  */
-exports.buildAggregatedFilterItemsApplier = buildAggregatedFilterItemsApplier;
-const buildAggregatedQuickFilterApplier = (getRowId, filterModel, apiRef) => {
+const buildAggregatedQuickFilterApplier = (filterModel, apiRef) => {
   const quickFilterValues = filterModel.quickFilterValues?.filter(Boolean) ?? [];
   if (quickFilterValues.length === 0) {
     return null;
@@ -205,6 +223,10 @@ const buildAggregatedQuickFilterApplier = (getRowId, filterModel, apiRef) => {
   const quickFilterExcludeHiddenColumns = filterModel.quickFilterExcludeHiddenColumns ?? false;
   const columnFields = quickFilterExcludeHiddenColumns ? (0, _columns.gridVisibleColumnFieldsSelector)(apiRef) : (0, _columns.gridColumnFieldsSelector)(apiRef);
   const appliersPerField = [];
+  const {
+    ignoreDiacritics
+  } = apiRef.current.rootProps;
+  const publicApiRef = (0, _getPublicApiRef.getPublicApiRef)(apiRef);
   columnFields.forEach(field => {
     const column = apiRef.current.getColumn(field);
     const getApplyQuickFilterFn = column?.getApplyQuickFilterFn;
@@ -214,18 +236,24 @@ const buildAggregatedQuickFilterApplier = (getRowId, filterModel, apiRef) => {
     if (getApplyQuickFilterFnV7 && !(hasUserFunctionLegacy && !hasUserFunctionV7)) {
       appliersPerField.push({
         column,
-        appliers: quickFilterValues.map(value => ({
-          v7: true,
-          fn: getApplyQuickFilterFnV7(value, column, apiRef)
-        }))
+        appliers: quickFilterValues.map(quickFilterValue => {
+          const value = ignoreDiacritics ? removeDiacritics(quickFilterValue) : quickFilterValue;
+          return {
+            v7: true,
+            fn: getApplyQuickFilterFnV7(value, column, publicApiRef)
+          };
+        })
       });
     } else if (getApplyQuickFilterFn) {
       appliersPerField.push({
         column,
-        appliers: quickFilterValues.map(value => ({
-          v7: false,
-          fn: getApplyQuickFilterFn(value, column, apiRef)
-        }))
+        appliers: quickFilterValues.map(quickFilterValue => {
+          const value = ignoreDiacritics ? removeDiacritics(quickFilterValue) : quickFilterValue;
+          return {
+            v7: false,
+            fn: getApplyQuickFilterFn(value, column, publicApiRef)
+          };
+        })
       });
     }
   });
@@ -248,18 +276,24 @@ const buildAggregatedQuickFilterApplier = (getRowId, filterModel, apiRef) => {
           continue;
         }
         const applier = appliers[v];
-        const value = apiRef.current.getRowValue(row, column);
+        let value = apiRef.current.getRowValue(row, column);
         if (applier.fn === null) {
           continue;
         }
         if (applier.v7) {
-          const isMatching = applier.fn(value, row, column, apiRef);
+          if (ignoreDiacritics) {
+            value = removeDiacritics(value);
+          }
+          const isMatching = applier.fn(value, row, column, publicApiRef);
           if (isMatching) {
             result[filterValue] = true;
             continue outer;
           }
         } else {
-          const cellParams = usedCellParams[field] ?? apiRef.current.getCellParams(getRowId ? getRowId(row) : row.id, field);
+          const cellParams = usedCellParams[field] ?? apiRef.current.getCellParams(apiRef.current.getRowId(row), field);
+          if (ignoreDiacritics) {
+            cellParams.value = removeDiacritics(cellParams.value);
+          }
           usedCellParams[field] = cellParams;
           const isMatching = applier.fn(cellParams);
           if (isMatching) {
@@ -275,10 +309,9 @@ const buildAggregatedQuickFilterApplier = (getRowId, filterModel, apiRef) => {
     return result;
   };
 };
-exports.buildAggregatedQuickFilterApplier = buildAggregatedQuickFilterApplier;
-const buildAggregatedFilterApplier = (getRowId, filterModel, apiRef, disableEval) => {
-  const isRowMatchingFilterItems = buildAggregatedFilterItemsApplier(getRowId, filterModel, apiRef, disableEval);
-  const isRowMatchingQuickFilter = buildAggregatedQuickFilterApplier(getRowId, filterModel, apiRef);
+const buildAggregatedFilterApplier = (filterModel, apiRef, disableEval) => {
+  const isRowMatchingFilterItems = buildAggregatedFilterItemsApplier(filterModel, apiRef, disableEval);
+  const isRowMatchingQuickFilter = buildAggregatedQuickFilterApplier(filterModel, apiRef);
   return function isRowMatchingFilters(row, shouldApplyFilter, result) {
     result.passingFilterItems = isRowMatchingFilterItems?.(row, shouldApplyFilter) ?? null;
     result.passingQuickFilterValues = isRowMatchingQuickFilter?.(row, shouldApplyFilter) ?? null;

package/node/hooks/features/filter/useGridFilter.js

@@ -69,7 +69,7 @@ const useGridFilter = (apiRef, props) => {
   const updateFilteredRows = React.useCallback(() => {
     apiRef.current.setState(state => {
       const filterModel = (0, _gridFilterSelector.gridFilterModelSelector)(state, apiRef.current.instanceId);
-      const isRowMatchingFilters = props.filterMode === 'client' ? (0, _gridFilterUtils.buildAggregatedFilterApplier)(props.getRowId, filterModel, apiRef, props.disableEval) : null;
+      const isRowMatchingFilters = props.filterMode === 'client' ? (0, _gridFilterUtils.buildAggregatedFilterApplier)(filterModel, apiRef, props.disableEval) : null;
       const filteringResult = apiRef.current.applyStrategyProcessor('filtering', {
         isRowMatchingFilters,
         filterModel: filterModel ?? (0, _gridFilterState.getDefaultGridFilterModel)()
@@ -83,7 +83,7 @@ const useGridFilter = (apiRef, props) => {
       });
     });
     apiRef.current.publishEvent('filteredRowsSet');
-  }, [apiRef, props.filterMode, props.getRowId, props.disableEval]);
+  }, [apiRef, props.filterMode, props.disableEval]);
   const addColumnMenuItem = React.useCallback((columnMenuItems, colDef) => {
     if (colDef == null || colDef.filterable === false || props.disableColumnFilter) {
       return columnMenuItems;
@@ -222,7 +222,8 @@ const useGridFilter = (apiRef, props) => {
     setFilterModel,
     showFilterPanel,
     hideFilterPanel,
-    setQuickFilterValues
+    setQuickFilterValues,
+    ignoreDiacritics: props.ignoreDiacritics
   };
   (0, _useGridApiMethod.useGridApiMethod)(apiRef, filterApi, 'public');
 

package/node/index.js

@@ -1,5 +1,5 @@
 /**
- * @mui/x-data-grid v6.17.0
+ * @mui/x-data-grid v6.18.1
  *
  * @license MIT
  * This source code is licensed under the MIT license found in the

package/node/internals/index.js

@@ -716,6 +716,18 @@ var _keyboardUtils = require("../utils/keyboardUtils");
 var _utils2 = require("../utils/utils");
 var _warning = require("../utils/warning");
 var _exportAs = require("../utils/exportAs");
+var _getPublicApiRef = require("../utils/getPublicApiRef");
+Object.keys(_getPublicApiRef).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;
+  if (key in exports && exports[key] === _getPublicApiRef[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function () {
+      return _getPublicApiRef[key];
+    }
+  });
+});
 var _useGridPrivateApiContext = require("../hooks/utils/useGridPrivateApiContext");
 var _useOnMount = require("../hooks/utils/useOnMount");
 Object.keys(_useOnMount).forEach(function (key) {

package/node/internals/utils/computeSlots.js

@@ -19,5 +19,12 @@ function computeSlots({
   if (!overrides || Object.keys(overrides).length === 0) {
     return defaultSlots;
   }
-  return (0, _extends2.default)({}, defaultSlots, overrides);
+  const result = (0, _extends2.default)({}, defaultSlots);
+  Object.keys(overrides).forEach(key => {
+    const k = key;
+    if (overrides[k] !== undefined) {
+      result[k] = overrides[k];
+    }
+  });
+  return result;
 }

package/node/utils/getPublicApiRef.js

@@ -0,0 +1,11 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.getPublicApiRef = getPublicApiRef;
+function getPublicApiRef(apiRef) {
+  return {
+    current: apiRef.current.getPublicApi()
+  };
+}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@mui/x-data-grid",
-  "version": "6.17.0",
+  "version": "6.18.1",
   "description": "The community edition of the data grid component (MUI X).",
   "author": "MUI Team",
   "main": "./node/index.js",
@@ -36,7 +36,7 @@
   },
   "dependencies": {
     "@babel/runtime": "^7.23.2",
-    "@mui/utils": "^5.14.14",
+    "@mui/utils": "^5.14.16",
     "clsx": "^2.0.0",
     "prop-types": "^15.8.1",
     "reselect": "^4.1.8"

package/utils/getPublicApiRef.d.ts

@@ -0,0 +1,3 @@
+/// <reference types="react" />
+import type { GridPrivateApiCommunity } from '../models/api/gridApiCommunity';
+export declare function getPublicApiRef<PrivateApi extends GridPrivateApiCommunity>(apiRef: React.MutableRefObject<PrivateApi>): import("react").MutableRefObject<ReturnType<PrivateApi["getPublicApi"]>>;

package/utils/getPublicApiRef.js

@@ -0,0 +1,5 @@
+export function getPublicApiRef(apiRef) {
+  return {
+    current: apiRef.current.getPublicApi()
+  };
+}