@mui/x-data-grid-premium 8.11.3 → 8.12.0

package/hooks/features/rowGrouping/gridRowGroupingUtils.d.ts

@@ -11,6 +11,7 @@ interface FilterRowTreeFromTreeDataParams {
   rowTree: GridRowTreeConfig;
   isRowMatchingFilters: GridAggregatedFilterItemApplier | null;
   filterModel: GridFilterModel;
+  filterValueGetter: (row: GridRowModel, column: GridColDef) => any;
   apiRef: RefObject<GridPrivateApiPremium>;
 }
 /**

package/hooks/features/rowGrouping/gridRowGroupingUtils.js

@@ -57,7 +57,8 @@ const filterRowTreeFromGroupingColumns = params => {
     apiRef,
     rowTree,
     isRowMatchingFilters,
-    filterModel
+    filterModel,
+    filterValueGetter
   } = params;
   const filteredRowsLookup = {};
   const filteredChildrenCountLookup = {};
@@ -94,7 +95,7 @@ const filterRowTreeFromGroupingColumns = params => {
         isPassingFiltering = filteredDescendantCount > 0;
       } else {
         const allResults = [...ancestorsResults, filterResults];
-        isPassingFiltering = (0, _internals.passFilterLogic)(allResults.map(result => result.passingFilterItems), allResults.map(result => result.passingQuickFilterValues), filterModel, params.apiRef, filterCache);
+        isPassingFiltering = (0, _internals.passFilterLogic)(allResults.map(result => result.passingFilterItems), allResults.map(result => result.passingQuickFilterValues), filterModel, filterValueGetter, params.apiRef, filterCache);
       }
     }
     if (!isPassingFiltering) {

package/hooks/features/rowGrouping/useGridRowGroupingPreProcessors.js

@@ -132,6 +132,7 @@ const useGridRowGroupingPreProcessors = (apiRef, props) => {
       rowTree,
       isRowMatchingFilters: params.isRowMatchingFilters,
       filterModel: params.filterModel,
+      filterValueGetter: params.filterValueGetter,
       apiRef
     });
   }, [apiRef]);

package/hooks/features/sidebar/gridSidebarInterfaces.d.ts

@@ -1,5 +1,6 @@
 export declare enum GridSidebarValue {
   Pivot = "pivot",
+  Charts = "charts",
 }
 export interface GridSidebarApi {
   /**

package/hooks/features/sidebar/gridSidebarInterfaces.js

@@ -6,5 +6,6 @@ Object.defineProperty(exports, "__esModule", {
 exports.GridSidebarValue = void 0;
 let GridSidebarValue = exports.GridSidebarValue = /*#__PURE__*/function (GridSidebarValue) {
   GridSidebarValue["Pivot"] = "pivot";
+  GridSidebarValue["Charts"] = "charts";
   return GridSidebarValue;
 }({});

package/hooks/utils/index.d.ts

@@ -1 +1,2 @@
-export * from "./useKeepGroupedColumnsHidden.js";
+export * from "./useKeepGroupedColumnsHidden.js";
+export * from "./useGridChartIntegration.js";

package/hooks/utils/index.js

@@ -13,4 +13,15 @@ Object.keys(_useKeepGroupedColumnsHidden).forEach(function (key) {
       return _useKeepGroupedColumnsHidden[key];
     }
   });
+});
+var _useGridChartIntegration = require("./useGridChartIntegration");
+Object.keys(_useGridChartIntegration).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (key in exports && exports[key] === _useGridChartIntegration[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function () {
+      return _useGridChartIntegration[key];
+    }
+  });
 });

package/hooks/utils/useGridChartIntegration.d.ts

@@ -0,0 +1,2 @@
+import { GridChartsIntegrationContextValue } from "../../models/gridChartsIntegration.js";
+export declare const useGridChartsIntegrationContext: (ignoreError?: boolean) => GridChartsIntegrationContextValue;

package/hooks/utils/useGridChartIntegration.js

@@ -0,0 +1,17 @@
+"use strict";
+
+var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.useGridChartsIntegrationContext = void 0;
+var React = _interopRequireWildcard(require("react"));
+var _GridChartsIntegrationContext = require("../../components/chartsIntegration/GridChartsIntegrationContext");
+const useGridChartsIntegrationContext = (ignoreError = false) => {
+  const context = React.useContext(_GridChartsIntegrationContext.GridChartsIntegrationContext);
+  if (!context && !ignoreError) {
+    throw new Error(['MUI X: Could not find the Data Grid charts integration context.', 'It looks like you rendered your component outside of a DataGrid, DataGridPro or DataGridPremium parent component.', 'This can also happen if you are bundling multiple versions of the Data Grid.'].join('\n'));
+  }
+  return context;
+};
+exports.useGridChartsIntegrationContext = useGridChartsIntegrationContext;

package/index.d.ts

@@ -14,6 +14,7 @@ export * from "./DataGridPremium/index.js";
 export * from "./hooks/index.js";
 export * from "./models/index.js";
 export * from "./components/index.js";
+export * from "./context/index.js";
 export { GridColumnHeaders } from '@mui/x-data-grid-pro';
 export type { GridColumnHeadersProps } from '@mui/x-data-grid-pro';
 export type { DataGridPremiumProps, GridExperimentalPremiumFeatures } from "./models/dataGridPremiumProps.js";

package/index.js

@@ -1,5 +1,5 @@
 /**
- * @mui/x-data-grid-premium v8.11.3
+ * @mui/x-data-grid-premium v8.12.0
  *
  * @license SEE LICENSE IN LICENSE
  * This source code is licensed under the SEE LICENSE IN LICENSE license found in the
@@ -256,6 +256,18 @@ Object.keys(_components3).forEach(function (key) {
     }
   });
 });
+var _context2 = require("./context");
+Object.keys(_context2).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;
+  if (key in exports && exports[key] === _context2[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function () {
+      return _context2[key];
+    }
+  });
+});
 var _xDataGridPro = require("@mui/x-data-grid-pro");
 var _reexports = require("./typeOverloads/reexports");
 var _reexports2 = require("./components/reexports");

package/material/icons.d.ts

@@ -12,4 +12,7 @@ export declare const GridPivotIcon: (props: import("@mui/x-data-grid").GridBaseI
 export declare const GridAssistantIcon: (props: import("@mui/x-data-grid").GridBaseIconProps) => React.ReactNode;
 export declare const GridPromptIcon: (props: import("@mui/x-data-grid").GridBaseIconProps) => React.ReactNode;
 export declare const GridRerunIcon: (props: import("@mui/x-data-grid").GridBaseIconProps) => React.ReactNode;
-export declare const GridHistoryIcon: (props: import("@mui/x-data-grid").GridBaseIconProps) => React.ReactNode;
+export declare const GridHistoryIcon: (props: import("@mui/x-data-grid").GridBaseIconProps) => React.ReactNode;
+export declare const GridChartsIcon: (props: import("@mui/x-data-grid").GridBaseIconProps) => React.ReactNode;
+export declare const GridSyncIcon: (props: import("@mui/x-data-grid").GridBaseIconProps) => React.ReactNode;
+export declare const GridSyncDisabledIcon: (props: import("@mui/x-data-grid").GridBaseIconProps) => React.ReactNode;

package/material/icons.js

@@ -4,7 +4,7 @@ var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWild
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.GridWorkspacesIcon = exports.GridSendIcon = exports.GridRerunIcon = exports.GridPromptIcon = exports.GridPivotIcon = exports.GridMoveToTopIcon = exports.GridMoveToBottomIcon = exports.GridMicOffIcon = exports.GridMicIcon = exports.GridHistoryIcon = exports.GridGroupWorkIcon = exports.GridFunctionsIcon = exports.GridExpandLessIcon = exports.GridAssistantIcon = void 0;
+exports.GridWorkspacesIcon = exports.GridSyncIcon = exports.GridSyncDisabledIcon = exports.GridSendIcon = exports.GridRerunIcon = exports.GridPromptIcon = exports.GridPivotIcon = exports.GridMoveToTopIcon = exports.GridMoveToBottomIcon = exports.GridMicOffIcon = exports.GridMicIcon = exports.GridHistoryIcon = exports.GridGroupWorkIcon = exports.GridFunctionsIcon = exports.GridExpandLessIcon = exports.GridChartsIcon = exports.GridAssistantIcon = void 0;
 var React = _interopRequireWildcard(require("react"));
 var _internals = require("@mui/x-data-grid/internals");
 var _jsxRuntime = require("react/jsx-runtime");
@@ -51,4 +51,18 @@ const GridRerunIcon = exports.GridRerunIcon = (0, _internals.createSvgIcon)(/*#_
 }), 'Rerun');
 const GridHistoryIcon = exports.GridHistoryIcon = (0, _internals.createSvgIcon)(/*#__PURE__*/(0, _jsxRuntime.jsx)("path", {
   d: "M13 3c-4.97 0-9 4.03-9 9H1l3.89 3.89.07.14L9 12H6c0-3.87 3.13-7 7-7s7 3.13 7 7-3.13 7-7 7c-1.93 0-3.68-.79-4.94-2.06l-1.42 1.42C8.27 19.99 10.51 21 13 21c4.97 0 9-4.03 9-9s-4.03-9-9-9m-1 5v5l4.28 2.54.72-1.21-3.5-2.08V8z"
-}), 'History');
+}), 'History');
+const GridChartsIcon = exports.GridChartsIcon = (0, _internals.createSvgIcon)(/*#__PURE__*/(0, _jsxRuntime.jsxs)("g", {
+  children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("path", {
+    d: "M0 0h24v24H0z",
+    fill: "none"
+  }), /*#__PURE__*/(0, _jsxRuntime.jsx)("path", {
+    d: "M19 3H5c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2zM9 17H7v-7h2v7zm4 0h-2V7h2v10zm4 0h-2v-4h2v4z"
+  })]
+}), 'Charts');
+const GridSyncIcon = exports.GridSyncIcon = (0, _internals.createSvgIcon)(/*#__PURE__*/(0, _jsxRuntime.jsx)("path", {
+  d: "M10 4.26v2.09C7.67 7.18 6 9.39 6 12c0 1.77.78 3.34 2 4.44V14h2v6H4v-2h2.73C5.06 16.54 4 14.4 4 12c0-3.73 2.55-6.85 6-7.74M20 4h-6v6h2V7.56c1.22 1.1 2 2.67 2 4.44h2c0-2.4-1.06-4.54-2.73-6H20zm0 13v-1c0-1.1-.9-2-2-2s-2 .9-2 2v1c-.55 0-1 .45-1 1v3c0 .55.45 1 1 1h4c.55 0 1-.45 1-1v-3c0-.55-.45-1-1-1m-1 0h-2v-1c0-.55.45-1 1-1s1 .45 1 1z"
+}), 'Sync');
+const GridSyncDisabledIcon = exports.GridSyncDisabledIcon = (0, _internals.createSvgIcon)(/*#__PURE__*/(0, _jsxRuntime.jsx)("path", {
+  d: "M10 6.35V4.26c-.8.21-1.55.54-2.23.96l1.46 1.46c.25-.12.5-.24.77-.33m-7.14-.94 2.36 2.36C4.45 8.99 4 10.44 4 12c0 2.21.91 4.2 2.36 5.64L4 20h6v-6l-2.24 2.24C6.68 15.15 6 13.66 6 12c0-1 .25-1.94.68-2.77l8.08 8.08c-.25.13-.5.25-.77.34v2.09c.8-.21 1.55-.54 2.23-.96l2.36 2.36 1.27-1.27L4.14 4.14zM20 4h-6v6l2.24-2.24C17.32 8.85 18 10.34 18 12c0 1-.25 1.94-.68 2.77l1.46 1.46C19.55 15.01 20 13.56 20 12c0-2.21-.91-4.2-2.36-5.64z"
+}), 'SyncDisabled');

package/material/index.d.ts

@@ -30,5 +30,16 @@ declare const materialSlots: {
   promptPivotIcon: React.JSXElementConstructor<import("@mui/x-data-grid/models/gridBaseSlots").IconProps>;
   promptAggregationIcon: React.JSXElementConstructor<import("@mui/x-data-grid/models/gridBaseSlots").IconProps>;
   promptChangesToggleIcon: React.JSXElementConstructor<import("@mui/x-data-grid/models/gridBaseSlots").IconProps>;
+  chartsIcon: React.JSXElementConstructor<import("@mui/x-data-grid/models/gridBaseSlots").IconProps>;
+  chartsSearchIcon: React.JSXElementConstructor<import("@mui/x-data-grid/models/gridBaseSlots").IconProps>;
+  chartsSearchClearIcon: React.JSXElementConstructor<import("@mui/x-data-grid/models/gridBaseSlots").IconProps>;
+  chartsMenuMoveUpIcon: React.JSXElementConstructor<import("@mui/x-data-grid/models/gridBaseSlots").IconProps>;
+  chartsMenuMoveDownIcon: React.JSXElementConstructor<import("@mui/x-data-grid/models/gridBaseSlots").IconProps>;
+  chartsMenuMoveToTopIcon: React.JSXElementConstructor<import("@mui/x-data-grid/models/gridBaseSlots").IconProps>;
+  chartsMenuMoveToBottomIcon: React.JSXElementConstructor<import("@mui/x-data-grid/models/gridBaseSlots").IconProps>;
+  chartsMenuAddIcon: React.JSXElementConstructor<import("@mui/x-data-grid/models/gridBaseSlots").IconProps>;
+  chartsMenuRemoveIcon: React.JSXElementConstructor<import("@mui/x-data-grid/models/gridBaseSlots").IconProps>;
+  chartsSyncIcon: React.JSXElementConstructor<import("@mui/x-data-grid/models/gridBaseSlots").IconProps>;
+  chartsSyncDisabledIcon: React.JSXElementConstructor<import("@mui/x-data-grid/models/gridBaseSlots").IconProps>;
 };
 export default materialSlots;

package/material/index.js

@@ -40,7 +40,18 @@ const iconsSlots = {
   promptPivotIcon: _icons.GridPivotIcon,
   promptAggregationIcon: _icons.GridFunctionsIcon,
   promptGroupIcon: _icons.GridGroupWorkIcon,
-  promptChangesToggleIcon: _xDataGrid.GridExpandMoreIcon
+  promptChangesToggleIcon: _xDataGrid.GridExpandMoreIcon,
+  chartsIcon: _icons.GridChartsIcon,
+  chartsSearchIcon: _xDataGrid.GridSearchIcon,
+  chartsSearchClearIcon: _xDataGrid.GridClearIcon,
+  chartsMenuMoveUpIcon: _icons.GridExpandLessIcon,
+  chartsMenuMoveDownIcon: _xDataGrid.GridExpandMoreIcon,
+  chartsMenuMoveToTopIcon: _icons.GridMoveToTopIcon,
+  chartsMenuMoveToBottomIcon: _icons.GridMoveToBottomIcon,
+  chartsMenuAddIcon: _xDataGrid.GridAddIcon,
+  chartsMenuRemoveIcon: _xDataGrid.GridDeleteIcon,
+  chartsSyncIcon: _icons.GridSyncIcon,
+  chartsSyncDisabledIcon: _icons.GridSyncDisabledIcon
 };
 const materialSlots = (0, _extends2.default)({}, iconsSlots);
 var _default = exports.default = materialSlots;

package/models/dataGridPremiumProps.d.ts

@@ -4,13 +4,16 @@ import { GridExperimentalProFeatures, DataGridProPropsWithDefaultValue, DataGrid
 import type { GridRowGroupingModel } from "../hooks/features/rowGrouping/index.js";
 import type { GridAggregationModel, GridAggregationFunction, GridAggregationFunctionDataSource, GridAggregationPosition } from "../hooks/features/aggregation/index.js";
 import { GridPremiumSlotsComponent } from "./gridPremiumSlotsComponent.js";
+import { GridPremiumSlotProps } from "./gridPremiumSlotProps.js";
 import { GridInitialStatePremium } from "./gridStatePremium.js";
 import { GridApiPremium } from "./gridApiPremium.js";
 import { GridCellSelectionModel } from "../hooks/features/cellSelection/index.js";
 import type { GridPivotingColDefOverrides, GridPivotModel } from "../hooks/features/pivoting/gridPivotingInterfaces.js";
 import { GridDataSourcePremium as GridDataSource, GridGetRowsParamsPremium as GridGetRowsParams } from "../hooks/features/dataSource/models.js";
 import { Conversation, PromptResponse, PromptSuggestion } from "../hooks/features/aiAssistant/gridAiAssistantInterfaces.js";
-export interface GridExperimentalPremiumFeatures extends GridExperimentalProFeatures {}
+export interface GridExperimentalPremiumFeatures extends GridExperimentalProFeatures {
+  charts?: boolean;
+}
 export interface DataGridPremiumPropsWithComplexDefaultValueBeforeProcessing extends Pick<DataGridPropsWithComplexDefaultValueBeforeProcessing, 'localeText'> {
   /**
    * Overridable components.
@@ -102,6 +105,11 @@ export interface DataGridPremiumPropsWithDefaultValue<R extends GridValidRowMode
    * @default false
    */
   aiAssistant: boolean;
+  /**
+   * If `true`, the charts integration feature is enabled.
+   * @default false
+   */
+  chartsIntegration: boolean;
 }
 export interface DataGridPremiumPropsWithoutDefaultValue<R extends GridValidRowModel = any> extends Omit<DataGridProPropsWithoutDefaultValue<R>, 'initialState' | 'apiRef' | 'dataSource' | 'onDataSourceError'> {
   /**
@@ -114,6 +122,10 @@ export interface DataGridPremiumPropsWithoutDefaultValue<R extends GridValidRowM
    * If one of the data in `initialState` is also being controlled, then the control state wins.
    */
   initialState?: GridInitialStatePremium;
+  /**
+   * Overridable components props dynamically passed to the component at rendering.
+   */
+  slotProps?: GridPremiumSlotProps;
   /**
    * Set the row grouping model of the grid.
    */
@@ -270,4 +282,13 @@ export interface DataGridPremiumPropsWithoutDefaultValue<R extends GridValidRowM
    * @param {GridCallbackDetails} details Additional details for this callback.
    */
   onSidebarOpen?: GridEventListener<'sidebarOpen'>;
+  /**
+   * The id of the active chart.
+   */
+  activeChartId?: string;
+  /**
+   * Callback fired when the active chart changes.
+   * @param {string} activeChartId The new active chart id.
+   */
+  onActiveChartIdChange?: (activeChartId: string) => void;
 }

package/models/gridApiPremium.d.ts

@@ -10,9 +10,10 @@ import type { GridAggregationPrivateApi } from "../hooks/features/aggregation/gr
 import type { GridPivotingApi, GridPivotingPrivateApi } from "../hooks/features/pivoting/gridPivotingInterfaces.js";
 import { GridAiAssistantApi } from "../hooks/features/aiAssistant/gridAiAssistantInterfaces.js";
 import { GridSidebarApi } from "../hooks/features/sidebar/gridSidebarInterfaces.js";
+import { GridChartsIntegrationApi, GridChartsIntegrationPrivateApi } from "../hooks/features/chartsIntegration/gridChartsIntegrationInterfaces.js";
 /**
  * The api of Data Grid Premium.
  * TODO: Do not redefine manually the pro features
  */
-export interface GridApiPremium extends GridApiCommon<GridStatePremium, GridInitialStatePremium>, GridRowProApi, GridColumnPinningApi, GridDetailPanelApi, GridRowGroupingApi, GridExcelExportApi, GridAggregationApi, GridRowPinningApi, GridDataSourceApiPremium, GridCellSelectionApi, GridPivotingApi, GridAiAssistantApi, GridSidebarApi, GridRowMultiSelectionApi, GridColumnReorderApi {}
-export interface GridPrivateApiPremium extends GridApiPremium, GridPrivateOnlyApiCommon<GridApiPremium, GridPrivateApiPremium, DataGridPremiumProcessedProps>, GridDataSourcePremiumPrivateApi, GridAggregationPrivateApi, GridDetailPanelPrivateApi, GridRowReorderPrivateApi, GridPivotingPrivateApi {}
+export interface GridApiPremium extends GridApiCommon<GridStatePremium, GridInitialStatePremium>, GridRowProApi, GridColumnPinningApi, GridDetailPanelApi, GridRowGroupingApi, GridExcelExportApi, GridAggregationApi, GridRowPinningApi, GridDataSourceApiPremium, GridCellSelectionApi, GridPivotingApi, GridAiAssistantApi, GridSidebarApi, GridChartsIntegrationApi, GridRowMultiSelectionApi, GridColumnReorderApi {}
+export interface GridPrivateApiPremium extends GridApiPremium, GridPrivateOnlyApiCommon<GridApiPremium, GridPrivateApiPremium, DataGridPremiumProcessedProps>, GridDataSourcePremiumPrivateApi, GridAggregationPrivateApi, GridDetailPanelPrivateApi, GridRowReorderPrivateApi, GridPivotingPrivateApi, GridChartsIntegrationPrivateApi {}

package/models/gridChartsIntegration.d.ts

@@ -0,0 +1,17 @@
+import type { Dataset } from '@mui/x-internals/types';
+export type ChartState = {
+  label?: string;
+  synced: boolean;
+  dimensions: Dataset<string | number | null>;
+  values: Dataset<number | null>;
+  type: string;
+  configuration: Record<string, string | number | boolean | null>;
+  dimensionsLabel?: string;
+  valuesLabel?: string;
+  maxDimensions?: number;
+  maxValues?: number;
+};
+export interface GridChartsIntegrationContextValue {
+  chartStateLookup: Record<string, ChartState>;
+  setChartState: (id: string, state: Partial<ChartState>) => void;
+}

package/models/gridChartsIntegration.js

@@ -0,0 +1,5 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});

package/models/gridPremiumIconSlotsComponent.d.ts

@@ -157,5 +157,60 @@ export interface GridPremiumIconSlotsComponent {
    * @default GridExpandMoreIcon
    */
   promptChangesToggleIcon: React.JSXElementConstructor<IconProps>;
+  /**
+   * Icon used for the charts configuration button
+   * @default GridChartsIcon
+   */
+  chartsIcon: React.JSXElementConstructor<IconProps>;
+  /**
+   * Icon used for the search icon in the sidebar search field in the charts configuration panel
+   * @default GridSearchIcon
+   */
+  chartsSearchIcon: React.JSXElementConstructor<IconProps>;
+  /**
+   * Icon used for the clear button in the sidebar search field in the charts configuration panel
+   * @default GridClearIcon
+   */
+  chartsSearchClearIcon: React.JSXElementConstructor<IconProps>;
+  /**
+   * Icon used for the move up button in the charts configuration panel menu
+   * @default GridExpandLessIcon
+   */
+  chartsMenuMoveUpIcon: React.JSXElementConstructor<IconProps>;
+  /**
+   * Icon used for the move down button in the charts configuration panel menu
+   * @default GridExpandMoreIcon
+   */
+  chartsMenuMoveDownIcon: React.JSXElementConstructor<IconProps>;
+  /**
+   * Icon used for the move to top button in the charts configuration panel menu
+   * @default GridMoveToTopIcon
+   */
+  chartsMenuMoveToTopIcon: React.JSXElementConstructor<IconProps>;
+  /**
+   * Icon used for the move to bottom button in the charts configuration panel menu
+   * @default GridMoveToBottomIcon
+   */
+  chartsMenuMoveToBottomIcon: React.JSXElementConstructor<IconProps>;
+  /**
+   * Icon used for the add button in the charts configuration panel menu
+   * @default GridAddIcon
+   */
+  chartsMenuAddIcon: React.JSXElementConstructor<IconProps>;
+  /**
+   * Icon used for the remove button in the charts configuration panel menu
+   * @default GridDeleteIcon
+   */
+  chartsMenuRemoveIcon: React.JSXElementConstructor<IconProps>;
+  /**
+   * Icon used for the sync button in the charts configuration panel when sync is enabled
+   * @default GridSyncIcon
+   */
+  chartsSyncIcon: React.JSXElementConstructor<IconProps>;
+  /**
+   * Icon used for the sync button in the charts configuration panel when sync is disabled
+   * @default GridSyncDisabledIcon
+   */
+  chartsSyncDisabledIcon: React.JSXElementConstructor<IconProps>;
 }
 export {};

package/models/gridPremiumSlotProps.d.ts

@@ -0,0 +1,8 @@
+import { GridProSlotProps } from '@mui/x-data-grid-pro/internals';
+import type { GridChartsPanelProps } from "../components/chartsPanel/GridChartsPanel.js";
+export interface GridChartsPanelPropsOverrides {}
+type SlotProps<Props, Overrides> = Partial<Props & Overrides>;
+export interface GridPremiumSlotProps extends GridProSlotProps {
+  chartsPanel?: SlotProps<GridChartsPanelProps, GridChartsPanelPropsOverrides>;
+}
+export {};

package/models/gridPremiumSlotProps.js

@@ -0,0 +1,5 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});

package/models/gridPremiumSlotsComponent.d.ts

@@ -11,6 +11,12 @@ export interface GridPremiumSlotsComponent extends GridProSlotsComponent, GridPr
    * @default null
    */
   aiAssistantPanel: React.JSXElementConstructor<any> | null;
+  /**
+   * Component rendered when charts panel is open. Only needed when `chartsIntegration` prop is passed to the grid.
+   * Pass `GridChartsPanel` to render the default charts panel.
+   * @default null
+   */
+  chartsPanel: React.JSXElementConstructor<any> | null;
   /**
    * Component rendered when pivot mode is enabled but no rows are defined.
    * @default GridEmptyPivotOverlay

package/models/gridStatePremium.d.ts

@@ -1,8 +1,9 @@
 import { GridInitialState as GridInitialStatePro, GridState as GridStatePro } from '@mui/x-data-grid-pro';
 import type { GridRowGroupingState, GridRowGroupingInitialState, GridAggregationState, GridAggregationInitialState, GridCellSelectionModel } from "../hooks/index.js";
 import type { GridPivotingInitialState, GridPivotingState } from "../hooks/features/pivoting/gridPivotingInterfaces.js";
-import { GridAiAssistantInitialState, GridAiAssistantState } from "../hooks/features/aiAssistant/gridAiAssistantInterfaces.js";
-import { GridSidebarInitialState, GridSidebarState } from "../hooks/features/sidebar/gridSidebarState.js";
+import type { GridAiAssistantInitialState, GridAiAssistantState } from "../hooks/features/aiAssistant/gridAiAssistantInterfaces.js";
+import type { GridSidebarInitialState, GridSidebarState } from "../hooks/features/sidebar/gridSidebarState.js";
+import type { GridChartsIntegrationState, GridChartsIntegrationInitialState } from "../hooks/features/chartsIntegration/gridChartsIntegrationInterfaces.js";
 /**
  * The state of Data Grid Premium.
  */
@@ -13,6 +14,7 @@ export interface GridStatePremium extends GridStatePro {
   pivoting: GridPivotingState;
   aiAssistant: GridAiAssistantState;
   sidebar: GridSidebarState;
+  chartsIntegration: GridChartsIntegrationState;
 }
 /**
  * The initial state of Data Grid Premium.
@@ -24,4 +26,5 @@ export interface GridInitialStatePremium extends GridInitialStatePro {
   pivoting?: GridPivotingInitialState;
   aiAssistant?: GridAiAssistantInitialState;
   sidebar?: GridSidebarInitialState;
+  chartsIntegration?: GridChartsIntegrationInitialState;
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@mui/x-data-grid-premium",
-  "version": "8.11.3",
+  "version": "8.12.0",
   "author": "MUI Team",
   "description": "The Premium plan edition of the MUI X Data Grid Components.",
   "license": "SEE LICENSE IN LICENSE",
@@ -39,10 +39,10 @@
     "clsx": "^2.1.1",
     "exceljs": "^4.4.0",
     "prop-types": "^15.8.1",
-    "@mui/x-data-grid": "8.11.3",
-    "@mui/x-internals": "8.11.3",
-    "@mui/x-license": "8.11.3",
-    "@mui/x-data-grid-pro": "8.11.3"
+    "@mui/x-data-grid": "8.12.0",
+    "@mui/x-data-grid-pro": "8.12.0",
+    "@mui/x-license": "8.12.0",
+    "@mui/x-internals": "8.12.0"
   },
   "peerDependencies": {
     "@emotion/react": "^11.9.0",

package/typeOverloads/modules.d.ts

@@ -59,6 +59,12 @@ export interface GridControlledStateEventLookupPremium {
   aiAssistantActiveConversationIndexChange: {
     params: number;
   };
+  /**
+   * Fired when the active chart id changes.
+   */
+  activeChartIdChange: {
+    params: string;
+  };
 }
 interface GridEventLookupPremium extends GridEventLookupPro {
   /**
@@ -89,6 +95,15 @@ interface GridEventLookupPremium extends GridEventLookupPro {
       value: GridSidebarValue;
     };
   };
+  /**
+   * Fired when the chart synchronization state changes.
+   */
+  chartSynchronizationStateChange: {
+    params: {
+      chartId: string;
+      synced: boolean;
+    };
+  };
 }
 export interface GridColDefPremium<R extends GridValidRowModel = any, V = any, F = V> {
   /**
@@ -123,6 +138,11 @@ export interface GridColDefPremium<R extends GridValidRowModel = any, V = any, F
    * @default true
    */
   pivotable?: boolean;
+  /**
+   * If `false`, the column will not be available for charts integration.
+   * @default true
+   */
+  chartable?: boolean;
 }
 export interface GridRenderCellParamsPremium<R extends GridValidRowModel = any, V = any, F = V> {
   aggregation?: GridAggregationCellMeta;