@mui/x-data-grid-pro 8.14.1 → 8.16.0

package/CHANGELOG.md

@@ -5,6 +5,213 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## 8.16.0
+
+_Oct 29, 2025_
+
+We'd like to extend a big thank you to the 14 contributors who made this release possible. Here are some highlights ✨:
+
+- 🖌️ Add `brush` zoom interaction to charts
+- 🔁 [Server-side update](https://mui.com/x/react-data-grid/server-side-data/#updating-server-side-data) in a grid with tree data/row grouping and aggregation will trigger re-fetch for all parent levels of that row to update aggregated values. See the [demo](https://mui.com/x/react-data-grid/server-side-data/aggregation/#usage-with-tree-data).
+
+Special thanks go out to the community members for their valuable contributions:
+@felix-wg, @frncesc, @sai6855
+
+The following are all team members who have contributed to this release:
+@alexfauquette, @arminmeh, @bernardobelchior, @brijeshb42, @flaviendelangle, @JCQuintas, @MBilalShafi, @mbrookes, @michelengelen, @noraleonte, @rita-codes
+
+### Data Grid
+
+#### `@mui/x-data-grid@8.16.0`
+
+- [DataGrid] Ignore `Ctrl+A` key combination for the row selection in the community version (#20110) @felix-wg
+- [DataGrid][l10n] Improve Spanish (es-ES) locale (#20134) @frncesc
+
+#### `@mui/x-data-grid-pro@8.16.0` [![pro](https://mui.com/r/x-pro-svg)](https://mui.com/r/x-pro-svg-link 'Pro plan')
+
+Same changes as in `@mui/x-data-grid@8.16.0`, plus:
+
+- [DataGridPro] Add explicit return type to `getVisibleRowsLookup()` to fix the build with `tsc` (#20116) @arminmeh
+- [DataGridPro] Retain the expansion state with expansion configuration props (#20126) @MBilalShafi
+
+#### `@mui/x-data-grid-premium@8.16.0` [![premium](https://mui.com/r/x-premium-svg)](https://mui.com/r/x-premium-svg-link 'Premium plan')
+
+Same changes as in `@mui/x-data-grid-pro@8.16.0`, plus:
+
+- [DataGridPremium] Export and restore chart integration state (#20079) @arminmeh
+- [DataGridPremium] Fix grouping column `valueFormatter()` crash  (#20070) @sai6855
+- [DataGridPremium] Refetch aggregation data after row update with server-side aggregation (#20039) @arminmeh
+
+### Date and Time Pickers
+
+#### `@mui/x-date-pickers@8.16.0`
+
+- [pickers] Prevent blur event propagation on individual sections (#19825) @michelengelen
+
+#### `@mui/x-date-pickers-pro@8.16.0` [![pro](https://mui.com/r/x-pro-svg)](https://mui.com/r/x-pro-svg-link 'Pro plan')
+
+Same changes as in `@mui/x-date-pickers@8.16.0`.
+
+### Charts
+
+#### `@mui/x-charts@8.16.0`
+
+- [charts] Allow tooltip to anchor items (#19954) @alexfauquette
+- [charts] Fix behavior of grouped axis (#20118) @JCQuintas
+- [charts] Move scale symlog inside scales (#20137) @JCQuintas
+- [charts] Fix AreaChartConnectNulls demo height not correctly resizing (#20078) @sai6855
+- [charts] Fix charts resizing overflow (#20080) @alexfauquette
+- [charts] Fix tooltip not showing on first render (#20115) @bernardobelchior
+- [charts] Handle `undefined` id and color in series (#20087) @bernardobelchior
+- [charts] Remove `useMemo` from isZoomOn*Enabled and isPanOn*Enabled hooks (#20132) @Copilot
+- [charts] Use static data for perf (#20072) @JCQuintas
+- [charts] Move scale symlog inside scales (#20137) @JCQuintas
+
+#### `@mui/x-charts-pro@8.16.0` [![pro](https://mui.com/r/x-pro-svg)](https://mui.com/r/x-pro-svg-link 'Pro plan')
+
+Same changes as in `@mui/x-charts@8.16.0`, plus:
+
+- [charts-pro] Add `brush` zoom interaction (#19899) @JCQuintas
+- [charts-pro] Add sankey performance check (#20069) @JCQuintas
+
+#### `@mui/x-charts-premium@8.16.0` [![premium](https://mui.com/r/x-premium-svg)](https://mui.com/r/x-premium-svg-link 'Premium plan')
+
+Same changes as in `@mui/x-charts-pro@8.16.0`.
+
+### Tree View
+
+#### `@mui/x-tree-view@8.16.0`
+
+Internal changes.
+
+#### `@mui/x-tree-view-pro@8.16.0` [![pro](https://mui.com/r/x-pro-svg)](https://mui.com/r/x-pro-svg-link 'Pro plan')
+
+Same changes as in `@mui/x-tree-view@8.16.0`.
+
+### Codemod
+
+#### `@mui/x-codemod@8.16.0`
+
+Internal changes.
+
+### Core
+
+- [code-infra] Setup eslint compat plugin (#20105) @brijeshb42
+- [code-infra] Improve store types (#20129) @JCQuintas
+- [docs] Update the callout in `rows` prop documentation (#20127) @MBilalShafi
+- [docs-infra] Refine changelog contributor acknowledgment messages (#20123) @mbrookes
+
+### Miscellaneous
+
+- [x-telemetry] Skip telemetry tests on browser mode (#20122) @bernardobelchior
+
+## 8.15.0
+
+_Oct 23, 2025_
+
+We'd like to extend a big thank you to the 14 contributors who made this release possible. Here are some highlights ✨:
+
+- 🖌️ Add new [`brush` charts interaction](https://mui.com/x/react-charts/brush/) for building custom behavior.
+  ![brush visualization example](https://github.com/user-attachments/assets/60c382a1-e418-4736-8dcb-1567c4e361e3)
+- ⚡️ Performance improvements for large bar charts
+- 🤖 Data Grid AI assistant can now [visualize the query results](https://mui.com/x/react-data-grid/ai-assistant/#data-visualization) by controlling the chart integration settings
+- 📦 DataGrid uses an internal MUI fork of ExcelJS that does not depend on vulnerable versions of NPM packages
+- 🐞 Bugfixes
+- 📚 Documentation improvements
+
+Special thanks go out to the community members for their valuable contributions:
+@ZagrebaAlex
+
+The following are all team members who have contributed to this release:
+@alexfauquette, @bernardobelchior, @cherniavskii, @flaviendelangle, @Janpot, @JCQuintas, @KenanYusuf, @prakhargupta1, @rita-codes, @siriwatknp, @arminmeh, @brijeshb42, @noraleonte
+
+### Data Grid
+
+#### `@mui/x-data-grid@8.15.0`
+
+- [DataGrid] Fix `dataSource.fetchRows` API's return type (#20068) @arminmeh
+
+#### `@mui/x-data-grid-pro@8.15.0` [![pro](https://mui.com/r/x-pro-svg)](https://mui.com/r/x-pro-svg-link 'Pro plan')
+
+Same changes as in `@mui/x-data-grid@8.15.0`, plus:
+
+- [DataGridPro] Keep children in the tree after parent row is re-fetched with the data source (#19934) @arminmeh
+- [DataGridPro] Support scroll shadows customization (#19982) @KenanYusuf
+
+#### `@mui/x-data-grid-premium@8.15.0` [![premium](https://mui.com/r/x-premium-svg)](https://mui.com/r/x-premium-svg-link 'Premium plan')
+
+Same changes as in `@mui/x-data-grid-pro@8.15.0`, plus:
+
+- [DataGridPremium] Use ExcelJS fork (#19796) @cherniavskii
+- [DataGridPremium] Support data visualization in AI Assistant (#19831) @arminmeh
+
+### Date and Time Pickers
+
+#### `@mui/x-date-pickers@8.15.0`
+
+Internal changes.
+
+#### `@mui/x-date-pickers-pro@8.15.0` [![pro](https://mui.com/r/x-pro-svg)](https://mui.com/r/x-pro-svg-link 'Pro plan')
+
+Same changes as in `@mui/x-date-pickers@8.15.0`.
+
+### Charts
+
+#### `@mui/x-charts@8.15.0`
+
+- [charts] Add `ChartsBrushOverlay` and allow brush configuration (#19956) @JCQuintas
+- [charts] Add `getStringSize` benchmark. Remove benchmarks from built package. (#19995) @bernardobelchior
+- [charts] Batch string size measurement (#19994) @bernardobelchior
+- [charts] Fix console issue (#20025) @JCQuintas
+- [charts] Fix is[ZoomFeature]Enabled type (#20058) @alexfauquette
+- [charts] Fix reference line middle spacing (#20004) @JCQuintas
+- [charts] Improve `getStringSize` and `batchMeasureStrings` performance (#19996) @bernardobelchior
+- [charts] Improve deep export script (#20007) @JCQuintas
+- [charts] Improve string measurement benchmarks (#19999) @bernardobelchior
+- [charts] Measure string sizes using SVG elements (#19981) @bernardobelchior
+- [l10n] Improve Greek (gr-GR) locale (#20060) @ZagrebaAlex
+
+#### `@mui/x-charts-pro@8.15.0` [![pro](https://mui.com/r/x-pro-svg)](https://mui.com/r/x-pro-svg-link 'Pro plan')
+
+Same changes as in `@mui/x-charts@8.15.0`, plus:
+
+- [charts-pro] Fix pan with `axis.reverse` (#20031) @JCQuintas
+
+#### `@mui/x-charts-premium@8.15.0` [![premium](https://mui.com/r/x-premium-svg)](https://mui.com/r/x-premium-svg-link 'Premium plan')
+
+Same changes as in `@mui/x-charts-pro@8.15.0`.
+
+### Tree View
+
+#### `@mui/x-tree-view@8.15.0`
+
+- [tree view] Multi character type-ahead (#19942) @noraleonte
+
+#### `@mui/x-tree-view-pro@8.15.0` [![pro](https://mui.com/r/x-pro-svg)](https://mui.com/r/x-pro-svg-link 'Pro plan')
+
+Same changes as in `@mui/x-tree-view@8.15.0`.
+
+### Codemod
+
+#### `@mui/x-codemod@8.14.0`
+
+Internal changes.
+
+### Docs
+
+- [docs] Add overview section for scatter chart and heatmap (#19888) @prakhargupta1
+- [docs] Add charts bell curve example (#20003) @JCQuintas
+- [docs] Add grouped multiple fields for Data Grid row grouping recipe (#19964) @siriwatknp
+- [docs] Add Data Grid loading state recipe (#19958) @siriwatknp
+
+### Core
+
+- [code-infra] Remove @mui/monorepo usage for react versioning (#19894) @Janpot
+- [code-infra] Remove invalid `environment: 'browser'` from vitest browser config (#19993) @bernardobelchior
+- [code-infra] Remove unused babel aliases (#19987) @Janpot
+- [code-infra] Turn on all testing-library eslint rules (#19946) @brijeshb42
+- [docs-infra] Fix broken hash link (#20062) @Janpot
+
 ## 8.14.1
 
 _Oct 16, 2025_

package/DataGridPro/DataGridPro.js

@@ -28,11 +28,12 @@ const configuration = {
     useGridRowAriaAttributes: _useGridRowAriaAttributes.useGridRowAriaAttributesPro,
     useGridRowsOverridableMethods: _internals.useGridRowsOverridableMethods,
     useGridParamsOverridableMethods: _internals.useGridParamsOverridableMethods,
+    useIsCellEditable: _internals.useIsCellEditable,
     useCellAggregationResult: () => null,
     useFilterValueGetter: apiRef => apiRef.current.getRowValue
   }
 };
-const releaseInfo = "MTc2MDU3MjgwMDAwMA==";
+const releaseInfo = "MTc2MTY5NjAwMDAwMA==";
 const watermark = /*#__PURE__*/(0, _jsxRuntime.jsx)(_xLicense.Watermark, {
   packageName: "x-data-grid-pro",
   releaseInfo: releaseInfo

package/DataGridPro/useDataGridProComponent.js

@@ -93,7 +93,7 @@ const useDataGridProComponent = (apiRef, props, configuration) => {
   (0, _useGridDetailPanel.useGridDetailPanel)(apiRef, props);
   (0, _internals.useGridColumnSpanning)(apiRef);
   (0, _internals.useGridColumnGrouping)(apiRef, props);
-  (0, _internals.useGridEditing)(apiRef, props);
+  (0, _internals.useGridEditing)(apiRef, props, configuration);
   (0, _internals.useGridFocus)(apiRef, props);
   (0, _internals.useGridPreferencesPanel)(apiRef, props);
   (0, _internals.useGridFilter)(apiRef, props, configuration);

package/esm/DataGridPro/DataGridPro.js

@@ -5,7 +5,7 @@ import * as React from 'react';
 import PropTypes from 'prop-types';
 import { useLicenseVerifier, Watermark } from '@mui/x-license';
 import { GridRoot, GridContextProvider } from '@mui/x-data-grid';
-import { validateProps, useGridApiInitialization, useGridRowsOverridableMethods, useGridParamsOverridableMethods } from '@mui/x-data-grid/internals';
+import { validateProps, useGridApiInitialization, useGridRowsOverridableMethods, useGridParamsOverridableMethods, useIsCellEditable } from '@mui/x-data-grid/internals';
 import { useMaterialCSSVariables } from '@mui/x-data-grid/material';
 import { forwardRef } from '@mui/x-internals/forwardRef';
 import { useDataGridProComponent } from "./useDataGridProComponent.js";
@@ -21,11 +21,12 @@ const configuration = {
     useGridRowAriaAttributes: useGridRowAriaAttributesPro,
     useGridRowsOverridableMethods,
     useGridParamsOverridableMethods,
+    useIsCellEditable,
     useCellAggregationResult: () => null,
     useFilterValueGetter: apiRef => apiRef.current.getRowValue
   }
 };
-const releaseInfo = "MTc2MDU3MjgwMDAwMA==";
+const releaseInfo = "MTc2MTY5NjAwMDAwMA==";
 const watermark = /*#__PURE__*/_jsx(Watermark, {
   packageName: "x-data-grid-pro",
   releaseInfo: releaseInfo

package/esm/DataGridPro/useDataGridProComponent.js

@@ -86,7 +86,7 @@ export const useDataGridProComponent = (apiRef, props, configuration) => {
   useGridDetailPanel(apiRef, props);
   useGridColumnSpanning(apiRef);
   useGridColumnGrouping(apiRef, props);
-  useGridEditing(apiRef, props);
+  useGridEditing(apiRef, props, configuration);
   useGridFocus(apiRef, props);
   useGridPreferencesPanel(apiRef, props);
   useGridFilter(apiRef, props, configuration);

package/esm/hooks/features/dataSource/models.d.ts

@@ -1,5 +1,5 @@
 import type { GridValidRowModel, GridRowId, GridGetRowsResponse, GridDataSource, GridGetRowsParams } from '@mui/x-data-grid';
-import type { GridDataSourceApiBase } from '@mui/x-data-grid/internals';
+import type { GridDataSourceApiBase, GridDataSourceFetchRowsParams } from '@mui/x-data-grid/internals';
 export interface GridDataSourceState {
   loading: Record<GridRowId, boolean>;
   errors: Record<GridRowId, any>;
@@ -42,9 +42,10 @@ export interface GridDataSourceApiBasePro extends Omit<GridDataSourceApiBase, 'f
    * If no `parentId` option is provided, it fetches the root rows.
    * Any missing parameter from `params` will be filled from the state (sorting, filtering, etc.).
    * @param {GridRowId} parentId The id of the parent node (default: `GRID_ROOT_GROUP_ID`).
-   * @param {Partial<GridGetRowsParamsPro>} params Request parameters override.
+   * @param {GridDataSourceFetchRowsParams<GridGetRowsParamsPro>} params Request parameters override.
+   * @returns {Promise<void>} A promise that resolves when the rows are fetched.
    */
-  fetchRows: (parentId?: GridRowId, params?: Partial<GridGetRowsParamsPro>) => void;
+  fetchRows: (parentId?: GridRowId, params?: GridDataSourceFetchRowsParams<GridGetRowsParamsPro>) => Promise<void>;
   /**
    * Set the loading state of a parent row.
    * @param {string} parentId The id of the parent node.

package/esm/hooks/features/dataSource/useGridDataSourceBasePro.d.ts

@@ -1,6 +1,6 @@
 import { RefObject } from '@mui/x-internals/types';
 import { GridRowId } from '@mui/x-data-grid';
-import { CacheChunkManager, DataSourceRowsUpdateStrategy, GridDataSourceBaseOptions } from '@mui/x-data-grid/internals';
+import { CacheChunkManager, DataSourceRowsUpdateStrategy, GridDataSourceBaseOptions, GridStrategyProcessor } from '@mui/x-data-grid/internals';
 import { GridPrivateApiPro } from "../../../models/gridApiPro.js";
 import { DataGridProProcessedProps } from "../../../models/dataGridProProps.js";
 import { GridDataSourceApiPro, GridDataSourcePrivateApiPro } from "./models.js";
@@ -13,11 +13,16 @@ export declare const useGridDataSourceBasePro: <Api extends GridPrivateApiPro>(a
     public: GridDataSourceApiPro;
     private: GridDataSourcePrivateApiPro;
   };
-  debouncedFetchRows: ((parentId?: import("@mui/x-data-grid").GridRowId, params?: import("@mui/x-data-grid/hooks/features/dataSource/models").GridDataSourceFetchRowsParams) => void) & import("@mui/utils/debounce").Cancelable;
-  strategyProcessor: {
+  debouncedFetchRows: ((parentId?: import("@mui/x-data-grid").GridRowId, params?: import("@mui/x-data-grid/internals").GridDataSourceFetchRowsParams<import("@mui/x-data-grid").GridGetRowsParams>) => Promise<void>) & import("@mui/utils/debounce").Cancelable;
+  flatTreeStrategyProcessor: {
     strategyName: DataSourceRowsUpdateStrategy;
     group: "dataSourceRowsUpdate";
-    processor: import("@mui/x-data-grid/internals").GridStrategyProcessor<"dataSourceRowsUpdate">;
+    processor: GridStrategyProcessor<"dataSourceRowsUpdate">;
+  };
+  groupedDataStrategyProcessor: {
+    strategyName: DataSourceRowsUpdateStrategy;
+    group: "dataSourceRowsUpdate";
+    processor: GridStrategyProcessor<"dataSourceRowsUpdate">;
   };
   events: {
     strategyAvailabilityChange: import("@mui/x-data-grid").GridEventListener<"strategyAvailabilityChange">;

package/esm/hooks/features/dataSource/useGridDataSourceBasePro.js

@@ -4,8 +4,8 @@ import _extends from "@babel/runtime/helpers/esm/extends";
 import * as React from 'react';
 import { isDeepEqual } from '@mui/x-internals/isDeepEqual';
 import useLazyRef from '@mui/utils/useLazyRef';
-import { useGridSelector, GridGetRowsError, gridRowIdSelector, gridRowNodeSelector, gridRowTreeSelector } from '@mui/x-data-grid';
-import { gridRowGroupsToFetchSelector, useGridDataSourceBase, CacheChunkManager, gridGetRowsParamsSelector, DataSourceRowsUpdateStrategy, GridStrategyGroup } from '@mui/x-data-grid/internals';
+import { useGridSelector, GridGetRowsError, gridRowIdSelector, gridRowNodeSelector, gridRowTreeSelector, GRID_ROOT_GROUP_ID } from '@mui/x-data-grid';
+import { gridRowGroupsToFetchSelector, useGridDataSourceBase, CacheChunkManager, gridGetRowsParamsSelector, DataSourceRowsUpdateStrategy, GridStrategyGroup, getTreeNodeDescendants } from '@mui/x-data-grid/internals';
 import { warnOnce } from '@mui/x-internals/warning';
 import { NestedDataManager, RequestStatus, getGroupKeys } from "./utils.js";
 import { gridDataSourceErrorsSelector } from "./gridDataSourceSelector.js";
@@ -37,7 +37,7 @@ export const useGridDataSourceBasePro = (apiRef, props, options = {}) => {
   const {
     api,
     debouncedFetchRows,
-    strategyProcessor,
+    strategyProcessor: flatTreeStrategyProcessor,
     events,
     cacheChunkManager,
     cache
@@ -47,8 +47,9 @@ export const useGridDataSourceBasePro = (apiRef, props, options = {}) => {
     handleEditRow
   }, options));
   const setStrategyAvailability = React.useCallback(() => {
-    apiRef.current.setStrategyAvailability(GridStrategyGroup.DataSource, DataSourceRowsUpdateStrategy.Default, props.dataSource && !props.lazyLoading ? () => true : () => false);
-  }, [apiRef, props.dataSource, props.lazyLoading]);
+    const targetStrategy = props.treeData ? DataSourceRowsUpdateStrategy.GroupedData : DataSourceRowsUpdateStrategy.Default;
+    apiRef.current.setStrategyAvailability(GridStrategyGroup.DataSource, targetStrategy, props.dataSource && !props.lazyLoading ? () => true : () => false);
+  }, [apiRef, props.dataSource, props.lazyLoading, props.treeData]);
   const onDataSourceErrorProp = props.onDataSourceError;
   const fetchRowChildren = React.useCallback(async id => {
     const pipedParams = apiRef.current.unstable_applyPipeProcessors('getRowsParams', {});
@@ -205,6 +206,55 @@ export const useGridDataSourceBasePro = (apiRef, props, options = {}) => {
       apiRef.current.updateNestedRows(removedRows, rowNode.path);
     }
   }, [apiRef]);
+  const handleGroupedDataUpdate = React.useCallback(params => {
+    if ('error' in params) {
+      apiRef.current.setRows([]);
+      return;
+    }
+    const {
+      response,
+      options: {
+        keepChildrenExpanded
+      }
+    } = params;
+    if (response.rowCount !== undefined) {
+      apiRef.current.setRowCount(response.rowCount);
+    }
+    if (keepChildrenExpanded === false) {
+      apiRef.current.setRows(response.rows);
+    } else {
+      const tree = gridRowTreeSelector(apiRef);
+      // Remove existing outdated rows before setting the new ones
+      // Create a set of the current root rows
+      const parentRowsToDelete = new Set(getTreeNodeDescendants(tree, GRID_ROOT_GROUP_ID, false, true));
+      // Remove from the list the rows that are again in the response
+      response.rows.forEach(row => {
+        parentRowsToDelete.delete(gridRowIdSelector(apiRef, row));
+      });
+      const rowsToDelete = [];
+      if (parentRowsToDelete.size > 0) {
+        parentRowsToDelete.forEach(parentRowId => {
+          const descendants = getTreeNodeDescendants(tree, parentRowId, false, false);
+          for (let i = descendants.length - 1; i >= 0; i -= 1) {
+            // delete deepest descendants first
+            rowsToDelete.push({
+              id: descendants[i],
+              _action: 'delete'
+            });
+          }
+          rowsToDelete.push({
+            id: parentRowId,
+            _action: 'delete'
+          });
+        });
+      }
+      apiRef.current.updateRows(response.rows.concat(rowsToDelete));
+    }
+    apiRef.current.unstable_applyPipeProcessors('processDataSourceRows', {
+      params: params.fetchParams,
+      response
+    }, true);
+  }, [apiRef]);
   const dataSourceApi = {
     dataSource: _extends({}, api.public.dataSource, {
       setChildrenLoading,
@@ -229,7 +279,12 @@ export const useGridDataSourceBasePro = (apiRef, props, options = {}) => {
       private: dataSourcePrivateApi
     },
     debouncedFetchRows,
-    strategyProcessor,
+    flatTreeStrategyProcessor,
+    groupedDataStrategyProcessor: {
+      strategyName: DataSourceRowsUpdateStrategy.GroupedData,
+      group: 'dataSourceRowsUpdate',
+      processor: handleGroupedDataUpdate
+    },
     events,
     setStrategyAvailability,
     cacheChunkManager,

package/esm/hooks/features/dataSource/useGridDataSourcePro.js

@@ -21,13 +21,15 @@ const options = {
 export const useGridDataSourcePro = (apiRef, props) => {
   const {
     api,
-    strategyProcessor,
+    flatTreeStrategyProcessor,
+    groupedDataStrategyProcessor,
     events,
     setStrategyAvailability
   } = useGridDataSourceBasePro(apiRef, props, options);
   useGridApiMethod(apiRef, api.public, 'public');
   useGridApiMethod(apiRef, api.private, 'private');
-  useGridRegisterStrategyProcessor(apiRef, strategyProcessor.strategyName, strategyProcessor.group, strategyProcessor.processor);
+  useGridRegisterStrategyProcessor(apiRef, flatTreeStrategyProcessor.strategyName, flatTreeStrategyProcessor.group, flatTreeStrategyProcessor.processor);
+  useGridRegisterStrategyProcessor(apiRef, groupedDataStrategyProcessor.strategyName, groupedDataStrategyProcessor.group, groupedDataStrategyProcessor.processor);
   Object.entries(events).forEach(([event, handler]) => {
     addEventHandler(apiRef, event, handler);
   });

package/esm/index.js

@@ -1,5 +1,5 @@
 /**
- * @mui/x-data-grid-pro v8.14.1
+ * @mui/x-data-grid-pro v8.16.0
  *
  * @license SEE LICENSE IN LICENSE
  * This source code is licensed under the SEE LICENSE IN LICENSE license found in the

package/esm/internals/index.d.ts

@@ -25,6 +25,7 @@ export { useGridInfiniteLoadingIntersection } from "../hooks/features/serverSide
 export { dataSourceStateInitializer } from "../hooks/features/dataSource/useGridDataSourcePro.js";
 export { useGridDataSourceBasePro } from "../hooks/features/dataSource/useGridDataSourceBasePro.js";
 export { gridDataSourceErrorSelector, gridDataSourceLoadingIdSelector } from "../hooks/features/dataSource/gridDataSourceSelector.js";
+export { getGroupKeys } from "../hooks/features/dataSource/utils.js";
 export type { GridExperimentalProFeatures, DataGridProPropsWithoutDefaultValue, DataGridProPropsWithDefaultValue } from "../models/dataGridProProps.js";
 export type { GridProSlotProps } from "../models/gridProSlotProps.js";
 export { createRowTree } from "../utils/tree/createRowTree.js";

package/esm/internals/index.js

@@ -28,6 +28,7 @@ export { useGridInfiniteLoadingIntersection } from "../hooks/features/serverSide
 export { dataSourceStateInitializer } from "../hooks/features/dataSource/useGridDataSourcePro.js";
 export { useGridDataSourceBasePro } from "../hooks/features/dataSource/useGridDataSourceBasePro.js";
 export { gridDataSourceErrorSelector, gridDataSourceLoadingIdSelector } from "../hooks/features/dataSource/gridDataSourceSelector.js";
+export { getGroupKeys } from "../hooks/features/dataSource/utils.js";
 export { createRowTree } from "../utils/tree/createRowTree.js";
 export { updateRowTree } from "../utils/tree/updateRowTree.js";
 export { sortRowTree } from "../utils/tree/sortRowTree.js";

package/esm/utils/tree/utils.d.ts

@@ -2,6 +2,7 @@ import { GridFilterState, GridGroupNode, GridRowId, GridRowTreeConfig, GridRowsS
 import { GridTreeDepths } from '@mui/x-data-grid/internals';
 import { RowTreeBuilderGroupingCriterion } from "./models.js";
 import { DataGridProProps } from "../../models/dataGridProProps.js";
+import type { GridStatePro } from "../../models/gridStatePro.js";
 export declare const getGroupRowIdFromPath: (path: RowTreeBuilderGroupingCriterion[]) => string;
 export declare const getNodePathInTree: ({
   id,
@@ -50,4 +51,4 @@ export declare const getVisibleRowsLookup: ({
 }: {
   tree: GridRowsState["tree"];
   filteredRowsLookup: GridFilterState["filteredRowsLookup"];
-}) => import("@mui/x-data-grid/hooks/features/filter/gridFilterState").GridVisibleRowsLookupState;
+}) => GridStatePro["visibleRowsLookup"];

package/esm/utils/tree/utils.js

@@ -24,13 +24,20 @@ export const checkGroupChildrenExpansion = (node, defaultGroupingExpansionDepth,
   if (maxDepth !== undefined && node.depth >= maxDepth) {
     return false;
   }
+
+  // If group existed in previous tree, preserve its expansion state
+  if (prevChildrenExpanded !== undefined) {
+    return prevChildrenExpanded;
+  }
+
+  // For new groups, apply default expansion configuration
   let childrenExpanded;
   if (node.id === GRID_ROOT_GROUP_ID) {
     childrenExpanded = true;
   } else if (isGroupExpandedByDefault) {
     childrenExpanded = isGroupExpandedByDefault(node);
   } else {
-    childrenExpanded = defaultGroupingExpansionDepth === -1 || defaultGroupingExpansionDepth > node.depth || (prevChildrenExpanded ?? false);
+    childrenExpanded = defaultGroupingExpansionDepth === -1 || defaultGroupingExpansionDepth > node.depth;
   }
   return childrenExpanded;
 };

package/hooks/features/dataSource/models.d.ts

@@ -1,5 +1,5 @@
 import type { GridValidRowModel, GridRowId, GridGetRowsResponse, GridDataSource, GridGetRowsParams } from '@mui/x-data-grid';
-import type { GridDataSourceApiBase } from '@mui/x-data-grid/internals';
+import type { GridDataSourceApiBase, GridDataSourceFetchRowsParams } from '@mui/x-data-grid/internals';
 export interface GridDataSourceState {
   loading: Record<GridRowId, boolean>;
   errors: Record<GridRowId, any>;
@@ -42,9 +42,10 @@ export interface GridDataSourceApiBasePro extends Omit<GridDataSourceApiBase, 'f
    * If no `parentId` option is provided, it fetches the root rows.
    * Any missing parameter from `params` will be filled from the state (sorting, filtering, etc.).
    * @param {GridRowId} parentId The id of the parent node (default: `GRID_ROOT_GROUP_ID`).
-   * @param {Partial<GridGetRowsParamsPro>} params Request parameters override.
+   * @param {GridDataSourceFetchRowsParams<GridGetRowsParamsPro>} params Request parameters override.
+   * @returns {Promise<void>} A promise that resolves when the rows are fetched.
    */
-  fetchRows: (parentId?: GridRowId, params?: Partial<GridGetRowsParamsPro>) => void;
+  fetchRows: (parentId?: GridRowId, params?: GridDataSourceFetchRowsParams<GridGetRowsParamsPro>) => Promise<void>;
   /**
    * Set the loading state of a parent row.
    * @param {string} parentId The id of the parent node.

package/hooks/features/dataSource/useGridDataSourceBasePro.d.ts

@@ -1,6 +1,6 @@
 import { RefObject } from '@mui/x-internals/types';
 import { GridRowId } from '@mui/x-data-grid';
-import { CacheChunkManager, DataSourceRowsUpdateStrategy, GridDataSourceBaseOptions } from '@mui/x-data-grid/internals';
+import { CacheChunkManager, DataSourceRowsUpdateStrategy, GridDataSourceBaseOptions, GridStrategyProcessor } from '@mui/x-data-grid/internals';
 import { GridPrivateApiPro } from "../../../models/gridApiPro.js";
 import { DataGridProProcessedProps } from "../../../models/dataGridProProps.js";
 import { GridDataSourceApiPro, GridDataSourcePrivateApiPro } from "./models.js";
@@ -13,11 +13,16 @@ export declare const useGridDataSourceBasePro: <Api extends GridPrivateApiPro>(a
     public: GridDataSourceApiPro;
     private: GridDataSourcePrivateApiPro;
   };
-  debouncedFetchRows: ((parentId?: import("@mui/x-data-grid").GridRowId, params?: import("@mui/x-data-grid/hooks/features/dataSource/models").GridDataSourceFetchRowsParams) => void) & import("@mui/utils/debounce").Cancelable;
-  strategyProcessor: {
+  debouncedFetchRows: ((parentId?: import("@mui/x-data-grid").GridRowId, params?: import("@mui/x-data-grid/internals").GridDataSourceFetchRowsParams<import("@mui/x-data-grid").GridGetRowsParams>) => Promise<void>) & import("@mui/utils/debounce").Cancelable;
+  flatTreeStrategyProcessor: {
     strategyName: DataSourceRowsUpdateStrategy;
     group: "dataSourceRowsUpdate";
-    processor: import("@mui/x-data-grid/internals").GridStrategyProcessor<"dataSourceRowsUpdate">;
+    processor: GridStrategyProcessor<"dataSourceRowsUpdate">;
+  };
+  groupedDataStrategyProcessor: {
+    strategyName: DataSourceRowsUpdateStrategy;
+    group: "dataSourceRowsUpdate";
+    processor: GridStrategyProcessor<"dataSourceRowsUpdate">;
   };
   events: {
     strategyAvailabilityChange: import("@mui/x-data-grid").GridEventListener<"strategyAvailabilityChange">;

package/hooks/features/dataSource/useGridDataSourceBasePro.js

@@ -44,7 +44,7 @@ const useGridDataSourceBasePro = (apiRef, props, options = {}) => {
   const {
     api,
     debouncedFetchRows,
-    strategyProcessor,
+    strategyProcessor: flatTreeStrategyProcessor,
     events,
     cacheChunkManager,
     cache
@@ -54,8 +54,9 @@ const useGridDataSourceBasePro = (apiRef, props, options = {}) => {
     handleEditRow
   }, options));
   const setStrategyAvailability = React.useCallback(() => {
-    apiRef.current.setStrategyAvailability(_internals.GridStrategyGroup.DataSource, _internals.DataSourceRowsUpdateStrategy.Default, props.dataSource && !props.lazyLoading ? () => true : () => false);
-  }, [apiRef, props.dataSource, props.lazyLoading]);
+    const targetStrategy = props.treeData ? _internals.DataSourceRowsUpdateStrategy.GroupedData : _internals.DataSourceRowsUpdateStrategy.Default;
+    apiRef.current.setStrategyAvailability(_internals.GridStrategyGroup.DataSource, targetStrategy, props.dataSource && !props.lazyLoading ? () => true : () => false);
+  }, [apiRef, props.dataSource, props.lazyLoading, props.treeData]);
   const onDataSourceErrorProp = props.onDataSourceError;
   const fetchRowChildren = React.useCallback(async id => {
     const pipedParams = apiRef.current.unstable_applyPipeProcessors('getRowsParams', {});
@@ -212,6 +213,55 @@ const useGridDataSourceBasePro = (apiRef, props, options = {}) => {
       apiRef.current.updateNestedRows(removedRows, rowNode.path);
     }
   }, [apiRef]);
+  const handleGroupedDataUpdate = React.useCallback(params => {
+    if ('error' in params) {
+      apiRef.current.setRows([]);
+      return;
+    }
+    const {
+      response,
+      options: {
+        keepChildrenExpanded
+      }
+    } = params;
+    if (response.rowCount !== undefined) {
+      apiRef.current.setRowCount(response.rowCount);
+    }
+    if (keepChildrenExpanded === false) {
+      apiRef.current.setRows(response.rows);
+    } else {
+      const tree = (0, _xDataGrid.gridRowTreeSelector)(apiRef);
+      // Remove existing outdated rows before setting the new ones
+      // Create a set of the current root rows
+      const parentRowsToDelete = new Set((0, _internals.getTreeNodeDescendants)(tree, _xDataGrid.GRID_ROOT_GROUP_ID, false, true));
+      // Remove from the list the rows that are again in the response
+      response.rows.forEach(row => {
+        parentRowsToDelete.delete((0, _xDataGrid.gridRowIdSelector)(apiRef, row));
+      });
+      const rowsToDelete = [];
+      if (parentRowsToDelete.size > 0) {
+        parentRowsToDelete.forEach(parentRowId => {
+          const descendants = (0, _internals.getTreeNodeDescendants)(tree, parentRowId, false, false);
+          for (let i = descendants.length - 1; i >= 0; i -= 1) {
+            // delete deepest descendants first
+            rowsToDelete.push({
+              id: descendants[i],
+              _action: 'delete'
+            });
+          }
+          rowsToDelete.push({
+            id: parentRowId,
+            _action: 'delete'
+          });
+        });
+      }
+      apiRef.current.updateRows(response.rows.concat(rowsToDelete));
+    }
+    apiRef.current.unstable_applyPipeProcessors('processDataSourceRows', {
+      params: params.fetchParams,
+      response
+    }, true);
+  }, [apiRef]);
   const dataSourceApi = {
     dataSource: (0, _extends2.default)({}, api.public.dataSource, {
       setChildrenLoading,
@@ -236,7 +286,12 @@ const useGridDataSourceBasePro = (apiRef, props, options = {}) => {
       private: dataSourcePrivateApi
     },
     debouncedFetchRows,
-    strategyProcessor,
+    flatTreeStrategyProcessor,
+    groupedDataStrategyProcessor: {
+      strategyName: _internals.DataSourceRowsUpdateStrategy.GroupedData,
+      group: 'dataSourceRowsUpdate',
+      processor: handleGroupedDataUpdate
+    },
     events,
     setStrategyAvailability,
     cacheChunkManager,

package/hooks/features/dataSource/useGridDataSourcePro.js

@@ -29,13 +29,15 @@ const options = {
 const useGridDataSourcePro = (apiRef, props) => {
   const {
     api,
-    strategyProcessor,
+    flatTreeStrategyProcessor,
+    groupedDataStrategyProcessor,
     events,
     setStrategyAvailability
   } = (0, _useGridDataSourceBasePro.useGridDataSourceBasePro)(apiRef, props, options);
   (0, _xDataGrid.useGridApiMethod)(apiRef, api.public, 'public');
   (0, _xDataGrid.useGridApiMethod)(apiRef, api.private, 'private');
-  (0, _internals.useGridRegisterStrategyProcessor)(apiRef, strategyProcessor.strategyName, strategyProcessor.group, strategyProcessor.processor);
+  (0, _internals.useGridRegisterStrategyProcessor)(apiRef, flatTreeStrategyProcessor.strategyName, flatTreeStrategyProcessor.group, flatTreeStrategyProcessor.processor);
+  (0, _internals.useGridRegisterStrategyProcessor)(apiRef, groupedDataStrategyProcessor.strategyName, groupedDataStrategyProcessor.group, groupedDataStrategyProcessor.processor);
   Object.entries(events).forEach(([event, handler]) => {
     (0, _xDataGrid.useGridEvent)(apiRef, event, handler);
   });

package/index.js

@@ -1,5 +1,5 @@
 /**
- * @mui/x-data-grid-pro v8.14.1
+ * @mui/x-data-grid-pro v8.16.0
  *
  * @license SEE LICENSE IN LICENSE
  * This source code is licensed under the SEE LICENSE IN LICENSE license found in the

package/internals/index.d.ts

@@ -25,6 +25,7 @@ export { useGridInfiniteLoadingIntersection } from "../hooks/features/serverSide
 export { dataSourceStateInitializer } from "../hooks/features/dataSource/useGridDataSourcePro.js";
 export { useGridDataSourceBasePro } from "../hooks/features/dataSource/useGridDataSourceBasePro.js";
 export { gridDataSourceErrorSelector, gridDataSourceLoadingIdSelector } from "../hooks/features/dataSource/gridDataSourceSelector.js";
+export { getGroupKeys } from "../hooks/features/dataSource/utils.js";
 export type { GridExperimentalProFeatures, DataGridProPropsWithoutDefaultValue, DataGridProPropsWithDefaultValue } from "../models/dataGridProProps.js";
 export type { GridProSlotProps } from "../models/gridProSlotProps.js";
 export { createRowTree } from "../utils/tree/createRowTree.js";

package/internals/index.js

@@ -37,6 +37,7 @@ var _exportNames = {
   useGridDataSourceBasePro: true,
   gridDataSourceErrorSelector: true,
   gridDataSourceLoadingIdSelector: true,
+  getGroupKeys: true,
   createRowTree: true,
   updateRowTree: true,
   sortRowTree: true,
@@ -96,16 +97,22 @@ Object.defineProperty(exports, "detailPanelStateInitializer", {
     return _useGridDetailPanel.detailPanelStateInitializer;
   }
 });
+Object.defineProperty(exports, "getGroupKeys", {
+  enumerable: true,
+  get: function () {
+    return _utils.getGroupKeys;
+  }
+});
 Object.defineProperty(exports, "getParentPath", {
   enumerable: true,
   get: function () {
-    return _utils2.getParentPath;
+    return _utils3.getParentPath;
   }
 });
 Object.defineProperty(exports, "getVisibleRowsLookup", {
   enumerable: true,
   get: function () {
-    return _utils.getVisibleRowsLookup;
+    return _utils2.getVisibleRowsLookup;
   }
 });
 Object.defineProperty(exports, "gridDataSourceErrorSelector", {
@@ -123,13 +130,13 @@ Object.defineProperty(exports, "gridDataSourceLoadingIdSelector", {
 Object.defineProperty(exports, "insertNodeInTree", {
   enumerable: true,
   get: function () {
-    return _utils.insertNodeInTree;
+    return _utils2.insertNodeInTree;
   }
 });
 Object.defineProperty(exports, "removeNodeFromTree", {
   enumerable: true,
   get: function () {
-    return _utils.removeNodeFromTree;
+    return _utils2.removeNodeFromTree;
   }
 });
 Object.defineProperty(exports, "rowPinningStateInitializer", {
@@ -147,13 +154,13 @@ Object.defineProperty(exports, "rowReorderStateInitializer", {
 Object.defineProperty(exports, "skipFiltering", {
   enumerable: true,
   get: function () {
-    return _utils2.skipFiltering;
+    return _utils3.skipFiltering;
   }
 });
 Object.defineProperty(exports, "skipSorting", {
   enumerable: true,
   get: function () {
-    return _utils2.skipSorting;
+    return _utils3.skipSorting;
   }
 });
 Object.defineProperty(exports, "sortRowTree", {
@@ -331,11 +338,12 @@ var _useGridInfiniteLoadingIntersection = require("../hooks/features/serverSideL
 var _useGridDataSourcePro = require("../hooks/features/dataSource/useGridDataSourcePro");
 var _useGridDataSourceBasePro = require("../hooks/features/dataSource/useGridDataSourceBasePro");
 var _gridDataSourceSelector = require("../hooks/features/dataSource/gridDataSourceSelector");
+var _utils = require("../hooks/features/dataSource/utils");
 var _createRowTree = require("../utils/tree/createRowTree");
 var _updateRowTree = require("../utils/tree/updateRowTree");
 var _sortRowTree = require("../utils/tree/sortRowTree");
-var _utils = require("../utils/tree/utils");
-var _utils2 = require("../hooks/features/serverSideTreeData/utils");
+var _utils2 = require("../utils/tree/utils");
+var _utils3 = require("../hooks/features/serverSideTreeData/utils");
 var _propValidation = require("./propValidation");
 Object.keys(_propValidation).forEach(function (key) {
   if (key === "default" || key === "__esModule") return;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@mui/x-data-grid-pro",
-  "version": "8.14.1",
+  "version": "8.16.0",
   "author": "MUI Team",
   "description": "The Pro plan edition of the MUI X Data Grid components.",
   "license": "SEE LICENSE IN LICENSE",
@@ -37,9 +37,9 @@
     "@mui/utils": "^7.3.3",
     "clsx": "^2.1.1",
     "prop-types": "^15.8.1",
-    "@mui/x-data-grid": "8.14.1",
-    "@mui/x-license": "8.14.1",
-    "@mui/x-internals": "8.14.0"
+    "@mui/x-data-grid": "8.16.0",
+    "@mui/x-license": "8.16.0",
+    "@mui/x-internals": "8.16.0"
   },
   "peerDependencies": {
     "@emotion/react": "^11.9.0",

package/utils/tree/utils.d.ts

@@ -2,6 +2,7 @@ import { GridFilterState, GridGroupNode, GridRowId, GridRowTreeConfig, GridRowsS
 import { GridTreeDepths } from '@mui/x-data-grid/internals';
 import { RowTreeBuilderGroupingCriterion } from "./models.js";
 import { DataGridProProps } from "../../models/dataGridProProps.js";
+import type { GridStatePro } from "../../models/gridStatePro.js";
 export declare const getGroupRowIdFromPath: (path: RowTreeBuilderGroupingCriterion[]) => string;
 export declare const getNodePathInTree: ({
   id,
@@ -50,4 +51,4 @@ export declare const getVisibleRowsLookup: ({
 }: {
   tree: GridRowsState["tree"];
   filteredRowsLookup: GridFilterState["filteredRowsLookup"];
-}) => import("@mui/x-data-grid/hooks/features/filter/gridFilterState").GridVisibleRowsLookupState;
+}) => GridStatePro["visibleRowsLookup"];

package/utils/tree/utils.js

@@ -33,13 +33,20 @@ const checkGroupChildrenExpansion = (node, defaultGroupingExpansionDepth, maxDep
   if (maxDepth !== undefined && node.depth >= maxDepth) {
     return false;
   }
+
+  // If group existed in previous tree, preserve its expansion state
+  if (prevChildrenExpanded !== undefined) {
+    return prevChildrenExpanded;
+  }
+
+  // For new groups, apply default expansion configuration
   let childrenExpanded;
   if (node.id === _xDataGrid.GRID_ROOT_GROUP_ID) {
     childrenExpanded = true;
   } else if (isGroupExpandedByDefault) {
     childrenExpanded = isGroupExpandedByDefault(node);
   } else {
-    childrenExpanded = defaultGroupingExpansionDepth === -1 || defaultGroupingExpansionDepth > node.depth || (prevChildrenExpanded ?? false);
+    childrenExpanded = defaultGroupingExpansionDepth === -1 || defaultGroupingExpansionDepth > node.depth;
   }
   return childrenExpanded;
 };