@mui/x-data-grid-premium 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/DataGridPremium/DataGridPremium.js

@@ -25,6 +25,7 @@ var _useGridApiContext = require("../hooks/utils/useGridApiContext");
 var _useGridRowsOverridableMethods = require("../hooks/features/rows/useGridRowsOverridableMethods");
 var _useGridParamsOverridableMethods = require("../hooks/features/rows/useGridParamsOverridableMethods");
 var _sidebar2 = require("../hooks/features/sidebar");
+var _useGridCellEditable = require("../hooks/features/editing/useGridCellEditable");
 var _jsxRuntime = require("react/jsx-runtime");
 const configuration = {
   hooks: {
@@ -44,11 +45,12 @@ const configuration = {
       }
       return (0, _internals.getRowValue)(row, column, apiRef);
     },
+    useIsCellEditable: _useGridCellEditable.useIsCellEditable,
     useGridRowsOverridableMethods: _useGridRowsOverridableMethods.useGridRowsOverridableMethods,
     useGridParamsOverridableMethods: _useGridParamsOverridableMethods.useGridParamsOverridableMethods
   }
 };
-const releaseInfo = "MTc2MDU3MjgwMDAwMA==";
+const releaseInfo = "MTc2MTY5NjAwMDAwMA==";
 const watermark = /*#__PURE__*/(0, _jsxRuntime.jsx)(_xLicense.Watermark, {
   packageName: "x-data-grid-premium",
   releaseInfo: releaseInfo
@@ -127,6 +129,7 @@ process.env.NODE_ENV !== "production" ? DataGridPremiumRaw.propTypes = {
       helperText: _propTypes.default.string,
       response: _propTypes.default.shape({
         aggregation: _propTypes.default.object.isRequired,
+        chart: _propTypes.default.object,
         conversationId: _propTypes.default.string.isRequired,
         filterOperator: _propTypes.default.oneOf(['and', 'or']),
         filters: _propTypes.default.arrayOf(_propTypes.default.object).isRequired,

package/DataGridPremium/useDataGridPremiumComponent.js

@@ -120,7 +120,7 @@ const useDataGridPremiumComponent = (apiRef, inProps, configuration) => {
   (0, _internals.useGridColumnSpanning)(apiRef);
   (0, _internals.useGridColumnGrouping)(apiRef, props);
   (0, _useGridClipboardImport.useGridClipboardImport)(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/components/prompt/GridPrompt.js

@@ -277,6 +277,13 @@ function GridPrompt(props) {
     }
     return changes;
   }, [apiRef, getColumnName, rootProps.slots]);
+  const getChartChanges = React.useCallback(chart => {
+    return {
+      label: apiRef.current.getLocaleText('toolbarCharts'),
+      description: apiRef.current.getLocaleText('promptChangeChartsLabel')(chart.dimensions.length, chart.values.length),
+      icon: rootProps.slots.promptChartsIcon
+    };
+  }, [apiRef, rootProps.slots.promptChartsIcon]);
   const changeList = React.useMemo(() => {
     if (!response) {
       return [];
@@ -297,8 +304,11 @@ function GridPrompt(props) {
     if (response.pivoting && 'columns' in response.pivoting) {
       changes.push(...getPivotingChanges(response.pivoting));
     }
+    if (response.chart) {
+      changes.push(getChartChanges(response.chart));
+    }
     return changes;
-  }, [response, getGroupingChanges, getAggregationChanges, getFilterChanges, getSortingChanges, getPivotingChanges]);
+  }, [response, getGroupingChanges, getAggregationChanges, getFilterChanges, getSortingChanges, getPivotingChanges, getChartChanges]);
   return /*#__PURE__*/(0, _jsxRuntime.jsxs)(PromptItem, {
     ownerState: ownerState,
     className: classes.root,

package/esm/DataGridPremium/DataGridPremium.js

@@ -18,6 +18,7 @@ import { useGridApiContext } from "../hooks/utils/useGridApiContext.js";
 import { useGridRowsOverridableMethods } from "../hooks/features/rows/useGridRowsOverridableMethods.js";
 import { useGridParamsOverridableMethods } from "../hooks/features/rows/useGridParamsOverridableMethods.js";
 import { gridSidebarOpenSelector } from "../hooks/features/sidebar/index.js";
+import { useIsCellEditable } from "../hooks/features/editing/useGridCellEditable.js";
 import { jsx as _jsx } from "react/jsx-runtime";
 const configuration = {
   hooks: {
@@ -37,11 +38,12 @@ const configuration = {
       }
       return getRowValue(row, column, apiRef);
     },
+    useIsCellEditable,
     useGridRowsOverridableMethods,
     useGridParamsOverridableMethods
   }
 };
-const releaseInfo = "MTc2MDU3MjgwMDAwMA==";
+const releaseInfo = "MTc2MTY5NjAwMDAwMA==";
 const watermark = /*#__PURE__*/_jsx(Watermark, {
   packageName: "x-data-grid-premium",
   releaseInfo: releaseInfo
@@ -120,6 +122,7 @@ process.env.NODE_ENV !== "production" ? DataGridPremiumRaw.propTypes = {
       helperText: PropTypes.string,
       response: PropTypes.shape({
         aggregation: PropTypes.object.isRequired,
+        chart: PropTypes.object,
         conversationId: PropTypes.string.isRequired,
         filterOperator: PropTypes.oneOf(['and', 'or']),
         filters: PropTypes.arrayOf(PropTypes.object).isRequired,

package/esm/DataGridPremium/useDataGridPremiumComponent.js

@@ -112,7 +112,7 @@ export const useDataGridPremiumComponent = (apiRef, inProps, configuration) => {
   useGridColumnSpanning(apiRef);
   useGridColumnGrouping(apiRef, props);
   useGridClipboardImport(apiRef, props);
-  useGridEditing(apiRef, props);
+  useGridEditing(apiRef, props, configuration);
   useGridFocus(apiRef, props);
   useGridPreferencesPanel(apiRef, props);
   useGridFilter(apiRef, props, configuration);

package/esm/components/prompt/GridPrompt.js

@@ -270,6 +270,13 @@ function GridPrompt(props) {
     }
     return changes;
   }, [apiRef, getColumnName, rootProps.slots]);
+  const getChartChanges = React.useCallback(chart => {
+    return {
+      label: apiRef.current.getLocaleText('toolbarCharts'),
+      description: apiRef.current.getLocaleText('promptChangeChartsLabel')(chart.dimensions.length, chart.values.length),
+      icon: rootProps.slots.promptChartsIcon
+    };
+  }, [apiRef, rootProps.slots.promptChartsIcon]);
   const changeList = React.useMemo(() => {
     if (!response) {
       return [];
@@ -290,8 +297,11 @@ function GridPrompt(props) {
     if (response.pivoting && 'columns' in response.pivoting) {
       changes.push(...getPivotingChanges(response.pivoting));
     }
+    if (response.chart) {
+      changes.push(getChartChanges(response.chart));
+    }
     return changes;
-  }, [response, getGroupingChanges, getAggregationChanges, getFilterChanges, getSortingChanges, getPivotingChanges]);
+  }, [response, getGroupingChanges, getAggregationChanges, getFilterChanges, getSortingChanges, getPivotingChanges, getChartChanges]);
   return /*#__PURE__*/_jsxs(PromptItem, {
     ownerState: ownerState,
     className: classes.root,

package/esm/hooks/features/aiAssistant/gridAiAssistantInterfaces.d.ts

@@ -39,6 +39,10 @@ type Pivoting = {
   rows: string[];
   values: Aggregation[];
 } | {};
+type Chart = {
+  dimensions: string[];
+  values: string[];
+};
 export type PromptResponse = {
   conversationId: string;
   select: number;
@@ -48,6 +52,7 @@ export type PromptResponse = {
   sorting: ColumnSort[];
   grouping: Grouping[];
   pivoting: Pivoting;
+  chart: Chart | null;
 };
 export type PromptResolverOptions = {
   /**

package/esm/hooks/features/aiAssistant/useGridAiAssistant.d.ts

@@ -3,4 +3,4 @@ import { GridStateInitializer } from '@mui/x-data-grid-pro/internals';
 import { GridPrivateApiPremium } from "../../../models/gridApiPremium.js";
 import { DataGridPremiumProcessedProps } from "../../../models/dataGridPremiumProps.js";
 export declare const aiAssistantStateInitializer: GridStateInitializer<Pick<DataGridPremiumProcessedProps, 'initialState' | 'aiAssistantConversations' | 'aiAssistant'>>;
-export declare const useGridAiAssistant: (apiRef: RefObject<GridPrivateApiPremium>, props: Pick<DataGridPremiumProcessedProps, "aiAssistant" | "aiAssistantConversations" | "aiAssistantActiveConversationIndex" | "allowAiAssistantDataSampling" | "onAiAssistantConversationsChange" | "onAiAssistantActiveConversationIndexChange" | "onPrompt" | "slots" | "disableColumnFilter" | "disableRowGrouping" | "disableAggregation" | "disableColumnSorting" | "disablePivoting">) => void;
+export declare const useGridAiAssistant: (apiRef: RefObject<GridPrivateApiPremium>, props: Pick<DataGridPremiumProcessedProps, "aiAssistant" | "aiAssistantConversations" | "aiAssistantActiveConversationIndex" | "allowAiAssistantDataSampling" | "onAiAssistantConversationsChange" | "onAiAssistantActiveConversationIndexChange" | "onPrompt" | "slots" | "rowSelection" | "disableColumnFilter" | "disableRowGrouping" | "disableAggregation" | "disableColumnSorting" | "disablePivoting" | "chartsIntegration" | "experimentalFeatures" | "getPivotDerivedColumns">) => void;

package/esm/hooks/features/aiAssistant/useGridAiAssistant.js

@@ -2,11 +2,14 @@
 
 import _extends from "@babel/runtime/helpers/esm/extends";
 import * as React from 'react';
-import { gridColumnLookupSelector, GridLogicOperator, gridRowsLookupSelector, useGridApiMethod, GRID_CHECKBOX_SELECTION_FIELD, GridPreferencePanelsValue } from '@mui/x-data-grid-pro';
+import { isDeepEqual } from '@mui/x-internals/isDeepEqual';
+import { gridColumnLookupSelector, GridLogicOperator, gridRowsLookupSelector, useGridApiMethod, GRID_CHECKBOX_SELECTION_FIELD, GridPreferencePanelsValue, gridColumnGroupsUnwrappedModelSelector, gridVisibleRowsSelector } from '@mui/x-data-grid-pro';
 import { getValueOptions, getVisibleRows, useGridRegisterPipeProcessor } from '@mui/x-data-grid-pro/internals';
 import { gridAiAssistantConversationsSelector, gridAiAssistantActiveConversationSelector, gridAiAssistantActiveConversationIndexSelector } from "./gridAiAssistantSelectors.js";
+import { gridChartsIntegrationActiveChartIdSelector } from "../chartsIntegration/gridChartsIntegrationSelectors.js";
 import { jsx as _jsx } from "react/jsx-runtime";
 const DEFAULT_SAMPLE_COUNT = 5;
+const MAX_CHART_DATA_POINTS = 1000;
 export const aiAssistantStateInitializer = (state, props) => {
   if (!props.aiAssistant) {
     return _extends({}, state, {
@@ -28,12 +31,18 @@ export const useGridAiAssistant = (apiRef, props) => {
     onPrompt,
     allowAiAssistantDataSampling,
     slots,
+    rowSelection,
     disableColumnFilter,
     disableRowGrouping,
     disableAggregation,
     disableColumnSorting,
-    disablePivoting
+    disablePivoting,
+    chartsIntegration,
+    experimentalFeatures,
+    getPivotDerivedColumns
   } = props;
+  const previousUnwrappedGroupingModel = React.useRef([]);
+  const activeChartId = gridChartsIntegrationActiveChartIdSelector(apiRef);
   const columnsLookup = gridColumnLookupSelector(apiRef);
   const columns = Object.values(columnsLookup);
   const rows = Object.values(gridRowsLookupSelector(apiRef));
@@ -78,15 +87,38 @@ export const useGridAiAssistant = (apiRef, props) => {
       return '';
     }
     const examples = allowDataSampling ? collectSampleData() : {};
-    const columnsContext = columns.map(column => ({
-      field: column.field,
-      description: column.description ?? null,
-      examples: examples[column.field] ?? column.examples ?? [],
-      type: column.type ?? 'string',
-      allowedOperators: column.filterOperators?.map(operator => operator.value) ?? []
-    }));
+    const columnsContext = columns.reduce((acc, column) => {
+      const columnContextWithoutExamples = {
+        field: column.field,
+        description: column.description ?? null,
+        examples: [],
+        type: column.type ?? 'string',
+        allowedOperators: column.filterOperators?.map(operator => operator.value) ?? []
+      };
+      acc.push(_extends({}, columnContextWithoutExamples, {
+        examples: examples[column.field] ?? column.examples ?? []
+      }));
+      if (disablePivoting) {
+        return acc;
+      }
+      (getPivotDerivedColumns?.(column, apiRef.current.getLocaleText) || []).forEach(col => acc.push(_extends({}, columnContextWithoutExamples, col, {
+        derivedFrom: column.field
+      })));
+      return acc;
+    }, []);
     return JSON.stringify(columnsContext);
-  }, [columns, collectSampleData, isAiAssistantAvailable]);
+  }, [apiRef, columns, collectSampleData, getPivotDerivedColumns, isAiAssistantAvailable, disablePivoting]);
+  const updateChart = React.useCallback(result => {
+    if (!result.chart) {
+      return;
+    }
+    apiRef.current.updateChartDimensionsData(activeChartId, result.chart.dimensions.map(item => ({
+      field: item
+    })));
+    apiRef.current.updateChartValuesData(activeChartId, result.chart.values.map(item => ({
+      field: item
+    })));
+  }, [apiRef, activeChartId]);
   const applyPromptResult = React.useCallback(result => {
     if (!isAiAssistantAvailable) {
       return;
@@ -115,6 +147,8 @@ export const useGridAiAssistant = (apiRef, props) => {
         quickFilterValues: []
       });
       interestColumns.push(...result.filters.map(f => f.column));
+    } else {
+      result.filters = [];
     }
     let appliedPivoting = false;
     if (!disablePivoting && 'columns' in result.pivoting) {
@@ -138,6 +172,7 @@ export const useGridAiAssistant = (apiRef, props) => {
       appliedPivoting = true;
     } else if ('columns' in result.pivoting) {
       // if pivoting is disabled and there are pivoting results, try to move them into grouping and aggregation
+      apiRef.current.setPivotActive(false);
       result.pivoting.columns.forEach(c => {
         result.grouping.push({
           column: c.column
@@ -154,26 +189,58 @@ export const useGridAiAssistant = (apiRef, props) => {
       });
       // remove the pivoting results data
       result.pivoting = {};
+    } else {
+      apiRef.current.setPivotActive(false);
     }
     if (!disableRowGrouping && !appliedPivoting) {
       apiRef.current.setRowGroupingModel(result.grouping.map(g => g.column));
+    } else {
+      result.grouping = [];
     }
     if (!disableAggregation && !appliedPivoting) {
       apiRef.current.setAggregationModel(result.aggregation);
       interestColumns.push(...Object.keys(result.aggregation));
+    } else {
+      result.aggregation = {};
     }
     if (!disableColumnSorting) {
       apiRef.current.setSortModel(result.sorting.map(s => ({
         field: s.column,
         sort: s.direction
       })));
+    } else {
+      result.sorting = [];
+    }
+    if (experimentalFeatures?.charts && chartsIntegration && activeChartId && result.chart) {
+      if (appliedPivoting) {
+        const unsubscribe = apiRef.current.subscribeEvent('rowsSet', () => {
+          const unwrappedGroupingModel = Object.keys(gridColumnGroupsUnwrappedModelSelector(apiRef));
+          // wait until unwrapped grouping model changes
+          if (!result.chart || unwrappedGroupingModel.length === 0 || isDeepEqual(previousUnwrappedGroupingModel.current, unwrappedGroupingModel)) {
+            return;
+          }
+          previousUnwrappedGroupingModel.current = unwrappedGroupingModel;
+          const visibleRowsCount = gridVisibleRowsSelector(apiRef).rows.length;
+          const maxColumns = Math.floor(MAX_CHART_DATA_POINTS / visibleRowsCount);
+
+          // we assume that the pivoting was adjusted to what needs to be shown in the chart
+          // so we can just pick up all the columns that were created by pivoting
+          // to avoid rendering issues, set the limit to MAX_CHART_DATA_POINTS data points (rows * columns)
+          result.chart.values = unwrappedGroupingModel.slice(0, maxColumns);
+          updateChart(result);
+          unsubscribe();
+        });
+      } else {
+        updateChart(result);
+      }
     }
     const visibleRowsData = getVisibleRows(apiRef);
     const rowSelectionModel = {
       type: 'include',
       ids: new Set()
     };
-    if (result.select !== -1) {
+    const selection = rowSelection ? result.select : -1;
+    if (selection !== -1) {
       for (let i = 0; i < result.select; i += 1) {
         const row = visibleRowsData.rows[i];
         const id = apiRef.current.getRowId(row);
@@ -183,7 +250,7 @@ export const useGridAiAssistant = (apiRef, props) => {
     apiRef.current.setRowSelectionModel(rowSelectionModel);
     const targetIndex = Number(columnsLookup[GRID_CHECKBOX_SELECTION_FIELD] !== undefined) + Number(result.grouping.length);
     interestColumns.reverse().forEach(c => apiRef.current.setColumnIndex(c, targetIndex));
-  }, [apiRef, disableColumnFilter, disableRowGrouping, disableAggregation, disableColumnSorting, disablePivoting, columnsLookup, isAiAssistantAvailable]);
+  }, [apiRef, updateChart, rowSelection, disableColumnFilter, disableRowGrouping, disableAggregation, disableColumnSorting, disablePivoting, columnsLookup, isAiAssistantAvailable, activeChartId, chartsIntegration, experimentalFeatures?.charts]);
   const setActiveConversationId = React.useCallback(id => {
     if (!isAiAssistantAvailable) {
       return;

package/esm/hooks/features/chartsIntegration/gridChartsIntegrationSelectors.d.ts

@@ -3,6 +3,12 @@ import { GridStatePremium } from "../../../models/gridStatePremium.js";
 export declare const gridChartsIntegrationActiveChartIdSelector: (args_0: import("react").RefObject<{
   state: GridStatePremium;
 } | null>) => string;
+export declare const gridChartsIntegrationChartsLookupSelector: (args_0: import("react").RefObject<{
+  state: GridStatePremium;
+} | null>) => Record<string, {
+  dimensions: import("./gridChartsIntegrationInterfaces.js").GridChartsIntegrationItem[];
+  values: import("./gridChartsIntegrationInterfaces.js").GridChartsIntegrationItem[];
+}>;
 export declare const gridChartsPanelOpenSelector: (args_0: import("react").RefObject<{
   state: GridStatePremium;
 } | null>) => boolean;

package/esm/hooks/features/chartsIntegration/gridChartsIntegrationSelectors.js

@@ -3,6 +3,7 @@ import { gridSidebarStateSelector, GridSidebarValue } from "../sidebar/index.js"
 import { gridPivotModelSelector } from "../pivoting/gridPivotingSelectors.js";
 const gridChartsIntegrationStateSelector = createRootSelector(state => state.chartsIntegration);
 export const gridChartsIntegrationActiveChartIdSelector = createSelector(gridChartsIntegrationStateSelector, chartsIntegration => chartsIntegration.activeChartId);
+export const gridChartsIntegrationChartsLookupSelector = createSelector(gridChartsIntegrationStateSelector, chartsIntegration => chartsIntegration.charts);
 export const gridChartsPanelOpenSelector = createSelector(gridSidebarStateSelector, sidebar => sidebar.value === GridSidebarValue.Charts && sidebar.open);
 export const gridChartableColumnsSelector = createSelectorMemoized(gridColumnLookupSelector, gridPivotActiveSelector, gridPivotModelSelector, (columns, pivotActive, pivotModel) => {
   let chartableColumns = Object.values(columns).filter(column => column.chartable);

package/esm/hooks/features/chartsIntegration/useGridChartsIntegration.d.ts

@@ -1,7 +1,7 @@
 import { RefObject } from '@mui/x-internals/types';
 import { GridStateInitializer } from '@mui/x-data-grid-pro/internals';
 import type { DataGridPremiumProcessedProps } from "../../../models/dataGridPremiumProps.js";
-import { GridPrivateApiPremium } from "../../../models/gridApiPremium.js";
+import type { GridPrivateApiPremium } from "../../../models/gridApiPremium.js";
 import { ChartState } from "../../../models/gridChartsIntegration.js";
 export declare const EMPTY_CHART_INTEGRATION_CONTEXT_STATE: ChartState;
 export declare const chartsIntegrationStateInitializer: GridStateInitializer<Pick<DataGridPremiumProcessedProps, 'chartsIntegration' | 'initialState' | 'activeChartId' | 'rowGroupingModel' | 'pivotModel' | 'experimentalFeatures'>, GridPrivateApiPremium>;