@mui/x-data-grid 6.9.2 → 6.10.0

package/legacy/hooks/core/useGridApiInitialization.js

@@ -1,64 +1,84 @@
+import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
 import * as React from 'react';
 import { Store } from '../../utils/Store';
 import { useGridApiMethod } from '../utils/useGridApiMethod';
 import { GridSignature } from '../utils/useGridApiEventHandler';
 import { EventManager } from '../../utils/EventManager';
+var SYMBOL_API_PRIVATE = Symbol('mui.api_private');
 var isSyntheticEvent = function isSyntheticEvent(event) {
   return event.isPropagationStopped !== undefined;
 };
+export function unwrapPrivateAPI(publicApi) {
+  return publicApi[SYMBOL_API_PRIVATE];
+}
 var globalId = 0;
-var wrapPublicApi = function wrapPublicApi(publicApi) {
-  var privateOnlyApi = {};
-  privateOnlyApi.getPublicApi = function () {
-    return publicApi;
+function createPrivateAPI(publicApiRef) {
+  var _publicApiRef$current;
+  var existingPrivateApi = (_publicApiRef$current = publicApiRef.current) == null ? void 0 : _publicApiRef$current[SYMBOL_API_PRIVATE];
+  if (existingPrivateApi) {
+    return existingPrivateApi;
+  }
+  var state = {};
+  var privateApi = {
+    state: state,
+    store: Store.create(state),
+    instanceId: {
+      id: globalId
+    }
+  };
+  globalId += 1;
+  privateApi.getPublicApi = function () {
+    return publicApiRef.current;
   };
-  privateOnlyApi.register = function (visibility, methods) {
+  privateApi.register = function (visibility, methods) {
     Object.keys(methods).forEach(function (methodName) {
-      if (visibility === 'public') {
-        publicApi[methodName] = methods[methodName];
+      var method = methods[methodName];
+      var currentPrivateMethod = privateApi[methodName];
+      if ((currentPrivateMethod == null ? void 0 : currentPrivateMethod.spying) === true) {
+        currentPrivateMethod.target = method;
       } else {
-        privateOnlyApi[methodName] = methods[methodName];
+        privateApi[methodName] = method;
+      }
+      if (visibility === 'public') {
+        var publicApi = publicApiRef.current;
+        var currentPublicMethod = publicApi[methodName];
+        if ((currentPublicMethod == null ? void 0 : currentPublicMethod.spying) === true) {
+          currentPublicMethod.target = method;
+        } else {
+          publicApi[methodName] = method;
+        }
       }
     });
   };
-  var handler = {
-    get: function get(obj, prop) {
-      if (prop in obj) {
-        return obj[prop];
-      }
-      return privateOnlyApi[prop];
+  privateApi.register('private', {
+    caches: {},
+    eventManager: new EventManager()
+  });
+  return privateApi;
+}
+function createPublicAPI(privateApiRef) {
+  var publicApi = _defineProperty({
+    get state() {
+      return privateApiRef.current.state;
+    },
+    get store() {
+      return privateApiRef.current.store;
     },
-    set: function set(obj, prop, value) {
-      obj[prop] = value;
-      return true;
+    get instanceId() {
+      return privateApiRef.current.instanceId;
     }
-  };
-  return new Proxy(publicApi, handler);
-};
+  }, SYMBOL_API_PRIVATE, privateApiRef.current);
+  return publicApi;
+}
 export function useGridApiInitialization(inputApiRef, props) {
   var publicApiRef = React.useRef();
-  if (!publicApiRef.current) {
-    var state = {};
-    publicApiRef.current = {
-      state: state,
-      store: Store.create(state),
-      instanceId: {
-        id: globalId
-      }
-    };
-    globalId += 1;
-  }
   var privateApiRef = React.useRef();
   if (!privateApiRef.current) {
-    privateApiRef.current = wrapPublicApi(publicApiRef.current);
-    privateApiRef.current.register('private', {
-      caches: {},
-      eventManager: new EventManager()
-    });
+    privateApiRef.current = createPrivateAPI(publicApiRef);
+  }
+  if (!publicApiRef.current) {
+    publicApiRef.current = createPublicAPI(privateApiRef);
   }
-  React.useImperativeHandle(inputApiRef, function () {
-    return publicApiRef.current;
-  }, [publicApiRef]);
   var publishEvent = React.useCallback(function () {
     for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
       args[_key] = arguments[_key];
@@ -87,6 +107,9 @@ export function useGridApiInitialization(inputApiRef, props) {
     subscribeEvent: subscribeEvent,
     publishEvent: publishEvent
   }, 'public');
+  React.useImperativeHandle(inputApiRef, function () {
+    return publicApiRef.current;
+  }, [publicApiRef]);
   React.useEffect(function () {
     var api = privateApiRef.current;
     return function () {

package/legacy/hooks/features/export/serializers/csvSerializer.js

@@ -1,3 +1,5 @@
+import _classCallCheck from "@babel/runtime/helpers/esm/classCallCheck";
+import _createClass from "@babel/runtime/helpers/esm/createClass";
 import { GRID_CHECKBOX_SELECTION_COL_DEF } from '../../../../colDef';
 import { buildWarning } from '../../../../utils/warning';
 function sanitizeCellValue(value, delimiterCharacter) {
@@ -37,48 +39,119 @@ export var serializeCellValue = function serializeCellValue(cellParams, options)
   return sanitizeCellValue(value, delimiterCharacter);
 };
 var objectFormattedValueWarning = buildWarning(['MUI: When the value of a field is an object or a `renderCell` is provided, the CSV export might not display the value correctly.', 'You can provide a `valueFormatter` with a string representation to be used.']);
+var CSVRow = /*#__PURE__*/function () {
+  function CSVRow(options) {
+    _classCallCheck(this, CSVRow);
+    this.options = void 0;
+    this.rowString = '';
+    this.isEmpty = true;
+    this.options = options;
+  }
+  _createClass(CSVRow, [{
+    key: "addValue",
+    value: function addValue(value) {
+      if (!this.isEmpty) {
+        this.rowString += this.options.delimiterCharacter;
+      }
+      if (value === null || value === undefined) {
+        this.rowString += '';
+      } else if (typeof this.options.sanitizeCellValue === 'function') {
+        this.rowString += this.options.sanitizeCellValue(value, this.options.delimiterCharacter);
+      } else {
+        this.rowString += value;
+      }
+      this.isEmpty = false;
+    }
+  }, {
+    key: "getRowString",
+    value: function getRowString() {
+      return this.rowString;
+    }
+  }]);
+  return CSVRow;
+}();
 var serializeRow = function serializeRow(_ref) {
   var id = _ref.id,
     columns = _ref.columns,
     getCellParams = _ref.getCellParams,
     delimiterCharacter = _ref.delimiterCharacter,
     ignoreValueFormatter = _ref.ignoreValueFormatter;
-  return columns.map(function (column) {
+  var row = new CSVRow({
+    delimiterCharacter: delimiterCharacter
+  });
+  columns.forEach(function (column) {
     var cellParams = getCellParams(id, column.field);
     if (process.env.NODE_ENV !== 'production') {
       if (String(cellParams.formattedValue) === '[object Object]') {
         objectFormattedValueWarning();
       }
     }
-    return serializeCellValue(cellParams, {
+    row.addValue(serializeCellValue(cellParams, {
       delimiterCharacter: delimiterCharacter,
       ignoreValueFormatter: ignoreValueFormatter
-    });
+    }));
   });
+  return row.getRowString();
 };
 export function buildCSV(options) {
   var columns = options.columns,
     rowIds = options.rowIds,
-    getCellParams = options.getCellParams,
     delimiterCharacter = options.delimiterCharacter,
     includeHeaders = options.includeHeaders,
-    ignoreValueFormatter = options.ignoreValueFormatter;
+    includeColumnGroupsHeaders = options.includeColumnGroupsHeaders,
+    ignoreValueFormatter = options.ignoreValueFormatter,
+    apiRef = options.apiRef;
   var CSVBody = rowIds.reduce(function (acc, id) {
     return "".concat(acc).concat(serializeRow({
       id: id,
       columns: columns,
-      getCellParams: getCellParams,
+      getCellParams: apiRef.current.getCellParams,
       delimiterCharacter: delimiterCharacter,
       ignoreValueFormatter: ignoreValueFormatter
-    }).join(delimiterCharacter), "\r\n");
+    }), "\r\n");
   }, '').trim();
   if (!includeHeaders) {
     return CSVBody;
   }
-  var CSVHead = "".concat(columns.filter(function (column) {
+  var filteredColumns = columns.filter(function (column) {
     return column.field !== GRID_CHECKBOX_SELECTION_COL_DEF.field;
-  }).map(function (column) {
-    return sanitizeCellValue(column.headerName || column.field, delimiterCharacter);
-  }).join(delimiterCharacter), "\r\n");
+  });
+  var headerRows = [];
+  if (includeColumnGroupsHeaders) {
+    var columnGroupLookup = apiRef.current.unstable_getAllGroupDetails();
+    var maxColumnGroupsDepth = 0;
+    var columnGroupPathsLookup = filteredColumns.reduce(function (acc, column) {
+      var columnGroupPath = apiRef.current.unstable_getColumnGroupPath(column.field);
+      acc[column.field] = columnGroupPath;
+      maxColumnGroupsDepth = Math.max(maxColumnGroupsDepth, columnGroupPath.length);
+      return acc;
+    }, {});
+    var _loop = function _loop(i) {
+      var headerGroupRow = new CSVRow({
+        delimiterCharacter: delimiterCharacter,
+        sanitizeCellValue: sanitizeCellValue
+      });
+      headerRows.push(headerGroupRow);
+      filteredColumns.forEach(function (column) {
+        var columnGroupId = (columnGroupPathsLookup[column.field] || [])[i];
+        var columnGroup = columnGroupLookup[columnGroupId];
+        headerGroupRow.addValue(columnGroup ? columnGroup.headerName || columnGroup.groupId : '');
+      });
+    };
+    for (var i = 0; i < maxColumnGroupsDepth; i += 1) {
+      _loop(i);
+    }
+  }
+  var mainHeaderRow = new CSVRow({
+    delimiterCharacter: delimiterCharacter,
+    sanitizeCellValue: sanitizeCellValue
+  });
+  filteredColumns.forEach(function (column) {
+    mainHeaderRow.addValue(column.headerName || column.field);
+  });
+  headerRows.push(mainHeaderRow);
+  var CSVHead = "".concat(headerRows.map(function (row) {
+    return row.getRowString();
+  }).join('\r\n'), "\r\n");
   return "".concat(CSVHead).concat(CSVBody).trim();
 }

package/legacy/hooks/features/export/useGridCsvExport.js

@@ -21,7 +21,7 @@ export var useGridCsvExport = function useGridCsvExport(apiRef, props) {
   var ignoreValueFormatterProp = props.unstable_ignoreValueFormatterDuringExport;
   var ignoreValueFormatter = (_typeof(ignoreValueFormatterProp) === 'object' ? ignoreValueFormatterProp == null ? void 0 : ignoreValueFormatterProp.csvExport : ignoreValueFormatterProp) || false;
   var getDataAsCsv = React.useCallback(function () {
-    var _options$getRowsToExp, _options$includeHeade;
+    var _options$getRowsToExp, _options$includeHeade, _options$includeColum;
     var options = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
     logger.debug("Get data as CSV");
     var exportedColumns = getColumnsToExport({
@@ -35,10 +35,11 @@ export var useGridCsvExport = function useGridCsvExport(apiRef, props) {
     return buildCSV({
       columns: exportedColumns,
       rowIds: exportedRowIds,
-      getCellParams: apiRef.current.getCellParams,
       delimiterCharacter: options.delimiter || ',',
       includeHeaders: (_options$includeHeade = options.includeHeaders) != null ? _options$includeHeade : true,
-      ignoreValueFormatter: ignoreValueFormatter
+      includeColumnGroupsHeaders: (_options$includeColum = options.includeColumnGroupsHeaders) != null ? _options$includeColum : true,
+      ignoreValueFormatter: ignoreValueFormatter,
+      apiRef: apiRef
     });
   }, [logger, apiRef, ignoreValueFormatter]);
   var exportDataAsCsv = React.useCallback(function (options) {

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

@@ -3,7 +3,7 @@ import { GridLogicOperator } from '../../../models';
 import { GLOBAL_API_REF, isInternalFilter } from '../../../colDef/utils';
 import { getDefaultGridFilterModel } from './gridFilterState';
 import { buildWarning } from '../../../utils/warning';
-import { gridColumnFieldsSelector, gridColumnLookupSelector } from '../columns';
+import { gridColumnFieldsSelector, gridColumnLookupSelector, gridVisibleColumnFieldsSelector } from '../columns';
 /**
  * Adds default values to the optional fields of a filter items.
  * @param {GridFilterItem} item The raw filter item.
@@ -170,12 +170,13 @@ export var buildAggregatedFilterItemsApplier = function buildAggregatedFilterIte
  * @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.
  */
 export var buildAggregatedQuickFilterApplier = function buildAggregatedQuickFilterApplier(getRowId, filterModel, apiRef) {
-  var _filterModel$quickFil, _filterModel$quickFil2;
+  var _filterModel$quickFil, _filterModel$quickFil2, _filterModel$quickFil3;
   var quickFilterValues = (_filterModel$quickFil = (_filterModel$quickFil2 = filterModel.quickFilterValues) == null ? void 0 : _filterModel$quickFil2.filter(Boolean)) != null ? _filterModel$quickFil : [];
   if (quickFilterValues.length === 0) {
     return null;
   }
-  var columnFields = gridColumnFieldsSelector(apiRef);
+  var quickFilterExcludeHiddenColumns = (_filterModel$quickFil3 = filterModel.quickFilterExcludeHiddenColumns) != null ? _filterModel$quickFil3 : false;
+  var columnFields = quickFilterExcludeHiddenColumns ? gridVisibleColumnFieldsSelector(apiRef) : gridColumnFieldsSelector(apiRef);
   var appliersPerField = [];
   columnFields.forEach(function (field) {
     var column = apiRef.current.getColumn(field);
@@ -299,14 +300,14 @@ export var passFilterLogic = function passFilterLogic(allFilterItemResults, allQ
 
   // get result for quick filter model
   if (cleanedQuickFilterResults.length > 0 && filterModel.quickFilterValues != null) {
-    var _filterModel$quickFil3;
+    var _filterModel$quickFil4;
     // Return true if the item pass with one of the rows
     var quickFilterValuePredicate = function quickFilterValuePredicate(value) {
       return cleanedQuickFilterResults.some(function (quickFilterValueResult) {
         return quickFilterValueResult[value];
       });
     };
-    var quickFilterLogicOperator = (_filterModel$quickFil3 = filterModel.quickFilterLogicOperator) != null ? _filterModel$quickFil3 : getDefaultGridFilterModel().quickFilterLogicOperator;
+    var quickFilterLogicOperator = (_filterModel$quickFil4 = filterModel.quickFilterLogicOperator) != null ? _filterModel$quickFil4 : getDefaultGridFilterModel().quickFilterLogicOperator;
     if (quickFilterLogicOperator === GridLogicOperator.And) {
       var passesAllQuickFilterValues = filterModel.quickFilterValues.every(quickFilterValuePredicate);
       if (!passesAllQuickFilterValues) {

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

@@ -22,6 +22,7 @@ export var filterStateInitializer = function filterStateInitializer(state, props
   return _extends({}, state, {
     filter: {
       filterModel: sanitizeFilterModel(filterModel, props.disableMultipleColumnsFiltering, apiRef),
+      filteredRowsLookup: {},
       filteredDescendantCountLookup: {}
     },
     visibleRowsLookup: {}
@@ -347,6 +348,13 @@ export var useGridFilter = function useGridFilter(apiRef, props) {
   useGridApiEventHandler(apiRef, 'columnsChange', handleColumnsChange);
   useGridApiEventHandler(apiRef, 'activeStrategyProcessorChange', handleStrategyProcessorChange);
   useGridApiEventHandler(apiRef, 'rowExpansionChange', updateVisibleRowsLookupState);
+  useGridApiEventHandler(apiRef, 'columnVisibilityModelChange', function () {
+    var filterModel = gridFilterModelSelector(apiRef);
+    if (filterModel.quickFilterValues && filterModel.quickFilterExcludeHiddenColumns) {
+      // re-apply filters because the quick filter results may have changed
+      apiRef.current.unstable_applyFilters();
+    }
+  });
 
   /**
    * 1ST RENDER

package/legacy/hooks/features/rows/gridRowsUtils.js

@@ -3,7 +3,7 @@ import _extends from "@babel/runtime/helpers/esm/extends";
 import { gridPinnedRowsSelector } from './gridRowsSelector';
 import { gridDensityFactorSelector } from '../density/densitySelector';
 export var GRID_ROOT_GROUP_ID = "auto-generated-group-node-root";
-export var GRID_ID_AUTOGENERATED = Symbol('mui-autogenerated-id');
+export var GRID_ID_AUTOGENERATED = Symbol('mui.id_autogenerated');
 export var buildRootGroup = function buildRootGroup() {
   return {
     type: 'group',

package/legacy/hooks/utils/useGridApiMethod.js

@@ -1,29 +1,11 @@
-import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
-import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
 import * as React from 'react';
 export function useGridApiMethod(privateApiRef, apiMethods, visibility) {
-  var apiMethodsRef = React.useRef(apiMethods);
-  var _React$useState = React.useState(Object.keys(apiMethods)),
-    _React$useState2 = _slicedToArray(_React$useState, 1),
-    apiMethodsNames = _React$useState2[0];
-  var installMethods = React.useCallback(function () {
-    if (!privateApiRef.current) {
-      return;
-    }
-    apiMethodsNames.forEach(function (methodName) {
-      if (!privateApiRef.current.hasOwnProperty(methodName)) {
-        privateApiRef.current.register(visibility, _defineProperty({}, methodName, function () {
-          var fn = apiMethodsRef.current[methodName];
-          return fn.apply(void 0, arguments);
-        }));
-      }
-    });
-  }, [apiMethodsNames, privateApiRef, visibility]);
+  var isFirstRender = React.useRef(true);
   React.useEffect(function () {
-    apiMethodsRef.current = apiMethods;
-  }, [apiMethods]);
-  React.useEffect(function () {
-    installMethods();
-  }, [installMethods]);
-  installMethods();
+    isFirstRender.current = false;
+    privateApiRef.current.register(visibility, apiMethods);
+  }, [privateApiRef, visibility, apiMethods]);
+  if (isFirstRender.current) {
+    privateApiRef.current.register(visibility, apiMethods);
+  }
 }

package/legacy/index.js

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

package/legacy/internals/index.js

@@ -8,6 +8,7 @@ export { getGridFilter } from '../components/panel/filterPanel/GridFilterPanel';
 export { useGridRegisterPipeProcessor } from '../hooks/core/pipeProcessing';
 export { useGridRegisterStrategyProcessor, GRID_DEFAULT_STRATEGY } from '../hooks/core/strategyProcessing';
 export { useGridInitialization } from '../hooks/core/useGridInitialization';
+export { unwrapPrivateAPI } from '../hooks/core/useGridApiInitialization';
 export { useGridClipboard } from '../hooks/features/clipboard/useGridClipboard';
 export { useGridColumnHeaders } from '../hooks/features/columnHeaders/useGridColumnHeaders';
 export { unstable_gridHeaderFilteringEditFieldSelector, unstable_gridHeaderFilteringMenuSelector } from '../hooks/features/headerFiltering/gridHeaderFilteringSelectors';

package/legacy/locales/plPL.js

@@ -39,7 +39,7 @@ var plPLGrid = {
   columnsPanelHideAllButton: 'Ukryj wszystko',
   // Filter panel text
   filterPanelAddFilter: 'Dodaj filtr',
-  // filterPanelRemoveAll: 'Remove all',
+  filterPanelRemoveAll: 'Usuń wszystkie',
   filterPanelDeleteIconLabel: 'Usuń',
   filterPanelLogicOperator: 'Operator logiczny',
   filterPanelOperator: 'Operator',
@@ -70,12 +70,12 @@ var plPLGrid = {
   // 'filterOperator<=': '<=',
 
   // Header filter operators text
-  // headerFilterOperatorContains: 'Contains',
-  // headerFilterOperatorEquals: 'Equals',
-  // headerFilterOperatorStartsWith: 'Starts with',
-  // headerFilterOperatorEndsWith: 'Ends with',
+  headerFilterOperatorContains: 'Zawiera',
+  headerFilterOperatorEquals: 'Równa się',
+  headerFilterOperatorStartsWith: 'Zaczyna się od',
+  headerFilterOperatorEndsWith: 'Kończy się na',
   // headerFilterOperatorIs: 'Is',
-  // headerFilterOperatorNot: 'Is not',
+  headerFilterOperatorNot: 'Niepuste',
   // headerFilterOperatorAfter: 'Is after',
   // headerFilterOperatorOnOrAfter: 'Is on or after',
   // headerFilterOperatorBefore: 'Is before',
@@ -97,7 +97,7 @@ var plPLGrid = {
   // Column menu text
   columnMenuLabel: 'Menu',
   columnMenuShowColumns: 'Pokaż wszystkie kolumny',
-  // columnMenuManageColumns: 'Manage columns',
+  columnMenuManageColumns: 'Zarządzaj kolumnami',
   columnMenuFilter: 'Filtr',
   columnMenuHideColumn: 'Ukryj',
   columnMenuUnsort: 'Anuluj sortowanie',

package/locales/plPL.js

@@ -37,7 +37,7 @@ const plPLGrid = {
   columnsPanelHideAllButton: 'Ukryj wszystko',
   // Filter panel text
   filterPanelAddFilter: 'Dodaj filtr',
-  // filterPanelRemoveAll: 'Remove all',
+  filterPanelRemoveAll: 'Usuń wszystkie',
   filterPanelDeleteIconLabel: 'Usuń',
   filterPanelLogicOperator: 'Operator logiczny',
   filterPanelOperator: 'Operator',
@@ -68,12 +68,12 @@ const plPLGrid = {
   // 'filterOperator<=': '<=',
 
   // Header filter operators text
-  // headerFilterOperatorContains: 'Contains',
-  // headerFilterOperatorEquals: 'Equals',
-  // headerFilterOperatorStartsWith: 'Starts with',
-  // headerFilterOperatorEndsWith: 'Ends with',
+  headerFilterOperatorContains: 'Zawiera',
+  headerFilterOperatorEquals: 'Równa się',
+  headerFilterOperatorStartsWith: 'Zaczyna się od',
+  headerFilterOperatorEndsWith: 'Kończy się na',
   // headerFilterOperatorIs: 'Is',
-  // headerFilterOperatorNot: 'Is not',
+  headerFilterOperatorNot: 'Niepuste',
   // headerFilterOperatorAfter: 'Is after',
   // headerFilterOperatorOnOrAfter: 'Is on or after',
   // headerFilterOperatorBefore: 'Is before',
@@ -95,7 +95,7 @@ const plPLGrid = {
   // Column menu text
   columnMenuLabel: 'Menu',
   columnMenuShowColumns: 'Pokaż wszystkie kolumny',
-  // columnMenuManageColumns: 'Manage columns',
+  columnMenuManageColumns: 'Zarządzaj kolumnami',
   columnMenuFilter: 'Filtr',
   columnMenuHideColumn: 'Ukryj',
   columnMenuUnsort: 'Anuluj sortowanie',

package/models/events/gridEventLookup.d.ts

@@ -452,7 +452,6 @@ export interface GridEventLookup extends GridRowEventLookup, GridColumnHeaderEve
     sortedRowsSet: {};
     /**
      * Fired when the expansion of a row is changed. Called with a [[GridGroupNode]] object.
-     * @ignore - do not document.
      */
     rowExpansionChange: {
         params: GridGroupNode;

package/models/gridExport.d.ts

@@ -69,10 +69,17 @@ export interface GridCsvExportOptions extends GridFileExportOptions {
      */
     utf8WithBom?: boolean;
     /**
-     * If `true`, the first row of the CSV will include the headers of the grid.
+     * If `true`, the CSV will include the column headers and column groups.
+     * Use `includeColumnGroupsHeaders` to control whether the column groups are included.
      * @default true
      */
     includeHeaders?: boolean;
+    /**
+     * If `true`, the CSV will include the column groups.
+     * @see See {@link https://mui.com/x/react-data-grid/column-groups/ column groups docs} for more details.
+     * @default true
+     */
+    includeColumnGroupsHeaders?: boolean;
     /**
      * Function that returns the id of the rows to export on the order they should be exported.
      * @param {GridCsvGetRowsToExportParams} params With all properties from [[GridCsvGetRowsToExportParams]].

package/models/gridFilterModel.d.ts

@@ -26,4 +26,9 @@ export interface GridFilterModel {
      * @default `GridLogicOperator.And`
      */
     quickFilterLogicOperator?: GridLogicOperator;
+    /**
+     * If `true`, the quick filter will skip cell values from hidden columns.
+     * @default false
+     */
+    quickFilterExcludeHiddenColumns?: boolean;
 }

package/modern/DataGrid/DataGrid.js

@@ -181,6 +181,7 @@ DataGridRaw.propTypes = {
       value: PropTypes.any
     })).isRequired,
     logicOperator: PropTypes.oneOf(['and', 'or']),
+    quickFilterExcludeHiddenColumns: PropTypes.bool,
     quickFilterLogicOperator: PropTypes.oneOf(['and', 'or']),
     quickFilterValues: PropTypes.array
   }),

package/modern/components/toolbar/GridToolbarQuickFilter.js

@@ -55,18 +55,20 @@ function GridToolbarQuickFilter(props) {
   const rootProps = useGridRootProps();
   const quickFilterValues = useGridSelector(apiRef, gridQuickFilterValuesSelector);
   const [searchValue, setSearchValue] = React.useState(() => quickFilterFormatter(quickFilterValues ?? []));
-  const [prevQuickFilterValues, setPrevQuickFilterValues] = React.useState(quickFilterValues);
+  const prevQuickFilterValuesRef = React.useRef(quickFilterValues);
   React.useEffect(() => {
-    if (!isDeepEqual(prevQuickFilterValues, quickFilterValues)) {
+    if (!isDeepEqual(prevQuickFilterValuesRef.current, quickFilterValues)) {
       // The model of quick filter value has been updated
-      setPrevQuickFilterValues(quickFilterValues);
+      prevQuickFilterValuesRef.current = quickFilterValues;
 
       // Update the input value if needed to match the new model
       setSearchValue(prevSearchValue => isDeepEqual(quickFilterParser(prevSearchValue), quickFilterValues) ? prevSearchValue : quickFilterFormatter(quickFilterValues ?? []));
     }
-  }, [prevQuickFilterValues, quickFilterValues, quickFilterFormatter, quickFilterParser]);
+  }, [quickFilterValues, quickFilterFormatter, quickFilterParser]);
   const updateSearchValue = React.useCallback(newSearchValue => {
-    apiRef.current.setQuickFilterValues(quickFilterParser(newSearchValue));
+    const newQuickFilterValues = quickFilterParser(newSearchValue);
+    prevQuickFilterValuesRef.current = newQuickFilterValues;
+    apiRef.current.setQuickFilterValues(newQuickFilterValues);
   }, [apiRef, quickFilterParser]);
   const debouncedUpdateSearchValue = React.useMemo(() => debounce(updateSearchValue, debounceMs), [updateSearchValue, debounceMs]);
   const handleSearchValueChange = React.useCallback(event => {
@@ -86,8 +88,9 @@ function GridToolbarQuickFilter(props) {
     onChange: handleSearchValueChange,
     placeholder: apiRef.current.getLocaleText('toolbarQuickFilterPlaceholder'),
     "aria-label": apiRef.current.getLocaleText('toolbarQuickFilterLabel'),
-    type: "search",
-    InputProps: {
+    type: "search"
+  }, other, {
+    InputProps: _extends({
       startAdornment: /*#__PURE__*/_jsx(rootProps.slots.quickFilterIcon, {
         fontSize: "small"
       }),
@@ -103,8 +106,8 @@ function GridToolbarQuickFilter(props) {
           fontSize: "small"
         })
       }))
-    }
-  }, other, rootProps.slotProps?.baseTextField));
+    }, other.InputProps)
+  }, rootProps.slotProps?.baseTextField));
 }
 process.env.NODE_ENV !== "production" ? GridToolbarQuickFilter.propTypes = {
   // ----------------------------- Warning --------------------------------

package/modern/hooks/core/pipeProcessing/useGridPipeProcessing.js

@@ -33,13 +33,16 @@ import { useGridApiMethod } from '../../utils/useGridApiMethod';
  */
 export const useGridPipeProcessing = apiRef => {
   const processorsCache = React.useRef({});
+  const isRunning = React.useRef(false);
   const runAppliers = React.useCallback(groupCache => {
-    if (!groupCache) {
+    if (isRunning.current || !groupCache) {
       return;
     }
+    isRunning.current = true;
     Object.values(groupCache.appliers).forEach(callback => {
       callback();
     });
+    isRunning.current = false;
   }, []);
   const registerPipeProcessor = React.useCallback((group, id, processor) => {
     if (!processorsCache.current[group]) {