@mui/x-data-grid 9.0.0-alpha.3 → 9.0.0-alpha.4

package/CHANGELOG.md

@@ -1,5 +1,128 @@
 # Changelog
 
+## 9.0.0-alpha.4
+
+_Mar 19, 2026_
+
+We'd like to extend a big thank you to the 12 contributors who made this release possible. Here are some highlights ✨:
+
+- 🐞 Bugfixes and internal improvements
+
+The following team members contributed to this release:
+@aemartos, @alexfauquette, @bernardobelchior, @Janpot, @JCQuintas, @LukasTy, @mapache-salvaje, @michelengelen, @noraleonte, @rita-codes, @sai6855, @siriwatknp
+
+### Data Grid
+
+#### `@mui/x-data-grid@9.0.0-alpha.4`
+
+- [DataGrid] Mark charts integration as stable (#21764) @JCQuintas
+- [DataGrid] Move `elementOverrides` to constants and remove duplicates (#21618) @sai6855
+- [DataGrid] Migrate from deprecated Material UI APIs (#21682) @siriwatknp
+
+#### `@mui/x-data-grid-pro@9.0.0-alpha.4` [![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@9.0.0-alpha.4`.
+
+#### `@mui/x-data-grid-premium@9.0.0-alpha.4` [![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@9.0.0-alpha.4`.
+
+### Date and Time Pickers
+
+#### `@mui/x-date-pickers@9.0.0-alpha.4`
+
+- [pickers] Avoid stealing focus on click away (#13434) @LukasTy
+- [pickers] Promote `fieldRef` to stable and add `clearValue` method (#21655) @michelengelen
+
+#### `@mui/x-date-pickers-pro@9.0.0-alpha.4` [![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@9.0.0-alpha.4`.
+
+### Charts
+
+#### `@mui/x-charts@9.0.0-alpha.4`
+
+- [charts] Add v9 chart series types and helper functions migration (#21009) @bernardobelchior
+- [charts] Extract event listener to the layer container (#21751) @alexfauquette
+- [charts] Fix WebGL print export canvas stretching (#21738) @JCQuintas
+- [charts] Improve deprecation warnings (#21760) @alexfauquette
+- [charts] Improve type safety in `identifierCleaner` (#21719) @bernardobelchior
+- [charts] Make `preferStrictDomainInLineCharts` the default (#21744) @JCQuintas
+- [charts] Move title and description to the layer container (#21757) @alexfauquette
+- [charts] Refactor `FunnelChart` classes structure (#21652) @JCQuintas
+- [charts] Refactor `Heatmap` classes structure (#21653) @JCQuintas
+- [charts] Refactor `RadarChart` classes structure (#21650) @JCQuintas
+- [charts] Refactor `SankeyChart` classes structure (#21654) @JCQuintas
+- [charts] Refactor legend getters to use utility functions (#21628) @sai6855
+- [charts] Remove deprecated `ChartContainer` and `ChartDataProvider` (#21777) @alexfauquette
+- [charts] Remove deprecated `itemId` from `SeriesLegendItemContext` (#21788) @alexfauquette
+- [charts] Remove deprecated `useMouseTracker()` (#21787) @alexfauquette
+- [charts] Remove deprecated classes (#21775) @alexfauquette
+- [charts] Remove deprecated props from PieArcLabel animation (#21789) @alexfauquette
+- [charts] Remove get*UtilityClass from public exports (#21769) @JCQuintas
+- [charts] Remove the deprecated `disableHover` property (#21785) @alexfauquette
+- [charts] Remove the deprecated `message` prop (#21784) @alexfauquette
+- [charts] Remove deprecated props about voronoi (#21796) @alexfauquette
+- [charts] Remove deprecated pieArcClasses (#21795) @alexfauquette
+- [charts] Rename `data-series-id` by `data-series` (#21761) @alexfauquette
+- [charts] Rename `voronoiMaxRadius`/`disableVoronoi` to `hitAreaRadius`/`disableHitArea` (#21750) @bernardobelchior
+- [charts] Update pt-PT locale (#21296) @bernardobelchior
+- [charts] Use different shape per series by default (#21713) @alexfauquette
+- [charts] Add className prop to Radar components (#21794) @JCQuintas
+- [charts] Add className prop to shared chart components (#21792) @JCQuintas
+- [charts] Add className prop to BarPlot (#21791) @JCQuintas
+- [charts] Portal tooltip into ChartsLayerContainer (#21801) @JCQuintas
+
+#### `@mui/x-charts-pro@9.0.0-alpha.4` [![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@9.0.0-alpha.4`, plus:
+
+- [charts-pro] Allow `brush` interaction to accept `requiredKeys/pointerMode` (#21716) @JCQuintas
+- [charts-pro] Remove deprecated `onAxisClick` for Heatmap (#21786) @alexfauquette
+
+#### `@mui/x-charts-premium@9.0.0-alpha.4` [![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@9.0.0-alpha.4`, plus:
+
+- [charts-premium] Add candlestick chart (#21129) @bernardobelchior
+
+### Tree View
+
+#### `@mui/x-tree-view@9.0.0-alpha.4`
+
+Internal changes.
+
+#### `@mui/x-tree-view-pro@9.0.0-alpha.4` [![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@9.0.0-alpha.4`.
+
+### Codemod
+
+#### `@mui/x-codemod@9.0.0-alpha.4`
+
+Internal changes.
+
+### Docs
+
+- [docs-infra] Exclude `ServerSideLazyLoadingRevalidation` from argos (#21734) @sai6855
+- [docs] Update charts v9 migration guide to include premium package (#21743) @bernardobelchior
+- [docs] Update v9 migration guides to install next tag (#21741) @bernardobelchior
+- [docs] Revise the Pie chart docs (#21565) @mapache-salvaje
+- [docs] Revise the Bar Chart docs (#21482) @mapache-salvaje
+- [docs] Removed a `console.log` from an aggregation demo (#21698) @michelengelen
+
+### Core
+
+- [code-infra] Add pkg-pr-new as dev dependency (#21754) @Janpot
+- [code-infra] Prevent `combiner` to have default parameters (#21707) @JCQuintas
+- [code-infra] Remove CI coverage collection and upload to Codecov (#21671) @Janpot
+- [internal] Remove @bernardobelchior from Charts CODEOWNERS (#21776) @Copilot
+
+### Miscellaneous
+
+- [x-license] Fix process.env.MUI_VERSION not being replaced during build (#21727) @aemartos
+- [x-license] Add new watermark license status message (#21720) @aemartos
+
 ## 9.0.0-alpha.3
 
 _Mar 12, 2026_

package/components/containers/GridRootStyles.js

@@ -22,17 +22,13 @@ const separatorIconDragStyles = {
 // https://github.com/emotion-js/emotion/issues/1105#issuecomment-1722524968
 const ignoreSsrWarning = '/* emotion-disable-server-rendering-unsafe-selector-warning-please-do-not-use-this-the-warning-exists-for-a-reason */';
 const shouldShowBorderTopRightRadiusSelector = apiRef => !apiRef.current.state.dimensions.isReady ? apiRef.current.state.dimensions.scrollbarSize === 0 : apiRef.current.state.dimensions.hasScrollX && (!apiRef.current.state.dimensions.hasScrollY || apiRef.current.state.dimensions.scrollbarSize === 0);
-const elementOverrides = {
-  root: ['autoHeight', 'autosizing', 'root--densityStandard', 'root--densityComfortable', 'root--densityCompact', 'root--disableUserSelection', 'root--noToolbar', 'withVerticalBorder'],
-  children: ['actionsCell', 'booleanCell', 'cell', 'cell--editable', 'cell--editing', 'cell--flex', 'cell--pinnedLeft', 'cell--pinnedRight', 'cell--rangeBottom', 'cell--rangeLeft', 'cell--rangeRight', 'cell--rangeTop', 'cell--selectionMode', 'cell--textCenter', 'cell--textLeft', 'cell--textRight', 'cell--withLeftBorder', 'cell--withRightBorder', 'cellCheckbox', 'cellEmpty', 'cellOffsetLeft', 'cellSkeleton', 'checkboxInput', 'columnHeader', 'columnHeader--alignCenter', 'columnHeader--alignLeft', 'columnHeader--alignRight', 'columnHeader--dragging', 'columnHeader--emptyGroup', 'columnHeader--filledGroup', 'columnHeader--filtered', 'columnHeader--last', 'columnHeader--moving', 'columnHeader--numeric', 'columnHeader--pinnedLeft', 'columnHeader--pinnedRight', 'columnHeader--siblingFocused', 'columnHeader--sortable', 'columnHeader--sorted', 'columnHeader--withLeftBorder', 'columnHeader--withRightBorder', 'columnHeaderCheckbox', 'columnHeaderDraggableContainer', 'columnHeaderTitleContainer', 'columnHeaderTitleContainerContent', 'columnSeparator', 'columnSeparator--resizable', 'columnSeparator--resizing', 'columnSeparator--sideLeft', 'columnSeparator--sideRight', 'container--bottom', 'container--top', 'detailPanelToggleCell', 'detailPanelToggleCell--expanded', 'editBooleanCell', 'filterIcon', 'filler--borderBottom', 'filler--pinnedLeft', 'filler--pinnedRight', 'groupingCriteriaCell', 'groupingCriteriaCellLoadingContainer', 'groupingCriteriaCellToggle', 'headerFilterRow', 'iconSeparator', 'menuIcon', 'menuIconButton', 'menuList', 'menuOpen', 'overlayWrapperInner', 'pinnedRows', 'pinnedRows--bottom', 'pinnedRows--top', 'row', 'row--borderBottom', 'row--detailPanelExpanded', 'row--dragging', 'row--dynamicHeight', 'row--editable', 'row--editing', 'row--firstVisible', 'row--lastVisible', 'rowReorderCell', 'rowReorderCell--draggable', 'rowReorderCellContainer', 'rowReorderCellPlaceholder', 'rowSkeleton', 'scrollbar', 'scrollbar--horizontal', 'scrollbar--vertical', 'scrollbarFiller', 'scrollbarFiller--pinnedRight', 'sortIcon', 'treeDataGroupingCell', 'treeDataGroupingCellLoadingContainer', 'treeDataGroupingCellToggle', 'withBorderColor', 'row--beingDragged']
-};
 const GridRootStyles = exports.GridRootStyles = (0, _styles.styled)('div', {
   name: 'MuiDataGrid',
   slot: 'Root',
   overridesResolver: (props, styles) => {
     // Root overrides
     const overrides = [styles.root];
-    elementOverrides.root.forEach(key => {
+    _gridClasses.gridClassesOverrides.root.forEach(key => {
       overrides.push({
         [`&.${_gridClasses.gridClasses[key]}`]: styles[key]
       });
@@ -41,7 +37,7 @@ const GridRootStyles = exports.GridRootStyles = (0, _styles.styled)('div', {
     // Child element overrides
     // - Only declare overrides here for class names that are not applied to `styled` components.
     // - For `styled` components, declare overrides in the component itself.
-    elementOverrides.children.forEach(key => {
+    _gridClasses.gridClassesOverrides.children.forEach(key => {
       overrides.push({
         [`& .${_gridClasses.gridClasses[key]}`]: styles[key]
       });

package/components/containers/GridRootStyles.mjs

@@ -1,5 +1,5 @@
 import { styled } from '@mui/material/styles';
-import { gridClasses as c } from "../../constants/gridClasses.mjs";
+import { gridClasses as c, gridClassesOverrides } from "../../constants/gridClasses.mjs";
 import { vars } from "../../constants/cssVariables.mjs";
 import { useGridSelector } from "../../hooks/utils/useGridSelector.mjs";
 import { useGridPrivateApiContext } from "../../hooks/utils/useGridPrivateApiContext.mjs";
@@ -16,17 +16,13 @@ const separatorIconDragStyles = {
 // https://github.com/emotion-js/emotion/issues/1105#issuecomment-1722524968
 const ignoreSsrWarning = '/* emotion-disable-server-rendering-unsafe-selector-warning-please-do-not-use-this-the-warning-exists-for-a-reason */';
 const shouldShowBorderTopRightRadiusSelector = apiRef => !apiRef.current.state.dimensions.isReady ? apiRef.current.state.dimensions.scrollbarSize === 0 : apiRef.current.state.dimensions.hasScrollX && (!apiRef.current.state.dimensions.hasScrollY || apiRef.current.state.dimensions.scrollbarSize === 0);
-const elementOverrides = {
-  root: ['autoHeight', 'autosizing', 'root--densityStandard', 'root--densityComfortable', 'root--densityCompact', 'root--disableUserSelection', 'root--noToolbar', 'withVerticalBorder'],
-  children: ['actionsCell', 'booleanCell', 'cell', 'cell--editable', 'cell--editing', 'cell--flex', 'cell--pinnedLeft', 'cell--pinnedRight', 'cell--rangeBottom', 'cell--rangeLeft', 'cell--rangeRight', 'cell--rangeTop', 'cell--selectionMode', 'cell--textCenter', 'cell--textLeft', 'cell--textRight', 'cell--withLeftBorder', 'cell--withRightBorder', 'cellCheckbox', 'cellEmpty', 'cellOffsetLeft', 'cellSkeleton', 'checkboxInput', 'columnHeader', 'columnHeader--alignCenter', 'columnHeader--alignLeft', 'columnHeader--alignRight', 'columnHeader--dragging', 'columnHeader--emptyGroup', 'columnHeader--filledGroup', 'columnHeader--filtered', 'columnHeader--last', 'columnHeader--moving', 'columnHeader--numeric', 'columnHeader--pinnedLeft', 'columnHeader--pinnedRight', 'columnHeader--siblingFocused', 'columnHeader--sortable', 'columnHeader--sorted', 'columnHeader--withLeftBorder', 'columnHeader--withRightBorder', 'columnHeaderCheckbox', 'columnHeaderDraggableContainer', 'columnHeaderTitleContainer', 'columnHeaderTitleContainerContent', 'columnSeparator', 'columnSeparator--resizable', 'columnSeparator--resizing', 'columnSeparator--sideLeft', 'columnSeparator--sideRight', 'container--bottom', 'container--top', 'detailPanelToggleCell', 'detailPanelToggleCell--expanded', 'editBooleanCell', 'filterIcon', 'filler--borderBottom', 'filler--pinnedLeft', 'filler--pinnedRight', 'groupingCriteriaCell', 'groupingCriteriaCellLoadingContainer', 'groupingCriteriaCellToggle', 'headerFilterRow', 'iconSeparator', 'menuIcon', 'menuIconButton', 'menuList', 'menuOpen', 'overlayWrapperInner', 'pinnedRows', 'pinnedRows--bottom', 'pinnedRows--top', 'row', 'row--borderBottom', 'row--detailPanelExpanded', 'row--dragging', 'row--dynamicHeight', 'row--editable', 'row--editing', 'row--firstVisible', 'row--lastVisible', 'rowReorderCell', 'rowReorderCell--draggable', 'rowReorderCellContainer', 'rowReorderCellPlaceholder', 'rowSkeleton', 'scrollbar', 'scrollbar--horizontal', 'scrollbar--vertical', 'scrollbarFiller', 'scrollbarFiller--pinnedRight', 'sortIcon', 'treeDataGroupingCell', 'treeDataGroupingCellLoadingContainer', 'treeDataGroupingCellToggle', 'withBorderColor', 'row--beingDragged']
-};
 export const GridRootStyles = styled('div', {
   name: 'MuiDataGrid',
   slot: 'Root',
   overridesResolver: (props, styles) => {
     // Root overrides
     const overrides = [styles.root];
-    elementOverrides.root.forEach(key => {
+    gridClassesOverrides.root.forEach(key => {
       overrides.push({
         [`&.${c[key]}`]: styles[key]
       });
@@ -35,7 +31,7 @@ export const GridRootStyles = styled('div', {
     // Child element overrides
     // - Only declare overrides here for class names that are not applied to `styled` components.
     // - For `styled` components, declare overrides in the component itself.
-    elementOverrides.children.forEach(key => {
+    gridClassesOverrides.children.forEach(key => {
       overrides.push({
         [`& .${c[key]}`]: styles[key]
       });

package/constants/gridClasses.d.mts

@@ -960,4 +960,20 @@ export interface GridClasses {
 }
 export type GridClassKey = keyof GridClasses;
 export declare function getDataGridUtilityClass(slot: string): string;
+/**
+ * Class groups for the MuiDataGrid component used in GridRootStyles overridesResolver.
+ *
+ * Splits classes into two groups to support style overrides:
+ * - `root`: classes applied directly to the root element (use `&.className` selector)
+ * - `children`: classes applied to child elements (use `& .className` selector)
+ *
+ * These are spread into the gridClasses utility object and used for CSS-in-JS overrides.
+ *
+ * Only include class names here that are NOT applied via `styled` components.
+ * For `styled` components, declare overrides directly in the component definition.
+ */
+export declare const gridClassesOverrides: {
+  readonly root: ["autoHeight", "autosizing", "root--densityStandard", "root--densityComfortable", "root--densityCompact", "root--disableUserSelection", "root--noToolbar", "withVerticalBorder"];
+  readonly children: ["actionsCell", "booleanCell", "cell", "cell--editable", "cell--editing", "cell--flex", "cell--pinnedLeft", "cell--pinnedRight", "cell--rangeBottom", "cell--rangeLeft", "cell--rangeRight", "cell--rangeTop", "cell--selectionMode", "cell--textCenter", "cell--textLeft", "cell--textRight", "cell--withLeftBorder", "cell--withRightBorder", "cellCheckbox", "cellEmpty", "cellOffsetLeft", "cellSkeleton", "checkboxInput", "columnHeader", "columnHeader--alignCenter", "columnHeader--alignLeft", "columnHeader--alignRight", "columnHeader--dragging", "columnHeader--emptyGroup", "columnHeader--filledGroup", "columnHeader--filtered", "columnHeader--last", "columnHeader--moving", "columnHeader--numeric", "columnHeader--pinnedLeft", "columnHeader--pinnedRight", "columnHeader--siblingFocused", "columnHeader--sortable", "columnHeader--sorted", "columnHeader--withLeftBorder", "columnHeader--withRightBorder", "columnHeaderCheckbox", "columnHeaderDraggableContainer", "columnHeaderTitleContainer", "columnHeaderTitleContainerContent", "columnSeparator", "columnSeparator--resizable", "columnSeparator--resizing", "columnSeparator--sideLeft", "columnSeparator--sideRight", "container--bottom", "container--top", "detailPanelToggleCell", "detailPanelToggleCell--expanded", "editBooleanCell", "filterIcon", "filler--borderBottom", "filler--pinnedLeft", "filler--pinnedRight", "groupingCriteriaCell", "groupingCriteriaCellLoadingContainer", "groupingCriteriaCellToggle", "headerFilterRow", "iconSeparator", "menuIcon", "menuIconButton", "menuList", "menuOpen", "overlayWrapperInner", "pinnedRows", "pinnedRows--bottom", "pinnedRows--top", "row", "row--borderBottom", "row--detailPanelExpanded", "row--dragging", "row--dynamicHeight", "row--editable", "row--editing", "row--firstVisible", "row--lastVisible", "rowReorderCell", "rowReorderCell--draggable", "rowReorderCellContainer", "rowReorderCellPlaceholder", "rowSkeleton", "scrollbar", "scrollbar--horizontal", "scrollbar--vertical", "scrollbarFiller", "scrollbarFiller--pinnedRight", "sortIcon", "treeDataGroupingCell", "treeDataGroupingCellLoadingContainer", "treeDataGroupingCellToggle", "withBorderColor", "row--beingDragged"];
+};
 export declare const gridClasses: Record<keyof GridClasses, string>;

package/constants/gridClasses.d.ts

@@ -960,4 +960,20 @@ export interface GridClasses {
 }
 export type GridClassKey = keyof GridClasses;
 export declare function getDataGridUtilityClass(slot: string): string;
+/**
+ * Class groups for the MuiDataGrid component used in GridRootStyles overridesResolver.
+ *
+ * Splits classes into two groups to support style overrides:
+ * - `root`: classes applied directly to the root element (use `&.className` selector)
+ * - `children`: classes applied to child elements (use `& .className` selector)
+ *
+ * These are spread into the gridClasses utility object and used for CSS-in-JS overrides.
+ *
+ * Only include class names here that are NOT applied via `styled` components.
+ * For `styled` components, declare overrides directly in the component definition.
+ */
+export declare const gridClassesOverrides: {
+  readonly root: ["autoHeight", "autosizing", "root--densityStandard", "root--densityComfortable", "root--densityCompact", "root--disableUserSelection", "root--noToolbar", "withVerticalBorder"];
+  readonly children: ["actionsCell", "booleanCell", "cell", "cell--editable", "cell--editing", "cell--flex", "cell--pinnedLeft", "cell--pinnedRight", "cell--rangeBottom", "cell--rangeLeft", "cell--rangeRight", "cell--rangeTop", "cell--selectionMode", "cell--textCenter", "cell--textLeft", "cell--textRight", "cell--withLeftBorder", "cell--withRightBorder", "cellCheckbox", "cellEmpty", "cellOffsetLeft", "cellSkeleton", "checkboxInput", "columnHeader", "columnHeader--alignCenter", "columnHeader--alignLeft", "columnHeader--alignRight", "columnHeader--dragging", "columnHeader--emptyGroup", "columnHeader--filledGroup", "columnHeader--filtered", "columnHeader--last", "columnHeader--moving", "columnHeader--numeric", "columnHeader--pinnedLeft", "columnHeader--pinnedRight", "columnHeader--siblingFocused", "columnHeader--sortable", "columnHeader--sorted", "columnHeader--withLeftBorder", "columnHeader--withRightBorder", "columnHeaderCheckbox", "columnHeaderDraggableContainer", "columnHeaderTitleContainer", "columnHeaderTitleContainerContent", "columnSeparator", "columnSeparator--resizable", "columnSeparator--resizing", "columnSeparator--sideLeft", "columnSeparator--sideRight", "container--bottom", "container--top", "detailPanelToggleCell", "detailPanelToggleCell--expanded", "editBooleanCell", "filterIcon", "filler--borderBottom", "filler--pinnedLeft", "filler--pinnedRight", "groupingCriteriaCell", "groupingCriteriaCellLoadingContainer", "groupingCriteriaCellToggle", "headerFilterRow", "iconSeparator", "menuIcon", "menuIconButton", "menuList", "menuOpen", "overlayWrapperInner", "pinnedRows", "pinnedRows--bottom", "pinnedRows--top", "row", "row--borderBottom", "row--detailPanelExpanded", "row--dragging", "row--dynamicHeight", "row--editable", "row--editing", "row--firstVisible", "row--lastVisible", "rowReorderCell", "rowReorderCell--draggable", "rowReorderCellContainer", "rowReorderCellPlaceholder", "rowSkeleton", "scrollbar", "scrollbar--horizontal", "scrollbar--vertical", "scrollbarFiller", "scrollbarFiller--pinnedRight", "sortIcon", "treeDataGroupingCell", "treeDataGroupingCellLoadingContainer", "treeDataGroupingCellToggle", "withBorderColor", "row--beingDragged"];
+};
 export declare const gridClasses: Record<keyof GridClasses, string>;

package/constants/gridClasses.js

@@ -5,12 +5,29 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.getDataGridUtilityClass = getDataGridUtilityClass;
-exports.gridClasses = void 0;
+exports.gridClassesOverrides = exports.gridClasses = void 0;
 var _generateUtilityClass = _interopRequireDefault(require("@mui/utils/generateUtilityClass"));
 var _generateUtilityClasses = _interopRequireDefault(require("@mui/utils/generateUtilityClasses"));
 function getDataGridUtilityClass(slot) {
   return (0, _generateUtilityClass.default)('MuiDataGrid', slot);
 }
-const gridClasses = exports.gridClasses = (0, _generateUtilityClasses.default)('MuiDataGrid', ['aiAssistantPanel', 'aiAssistantPanelHeader', 'aiAssistantPanelTitleContainer', 'aiAssistantPanelTitle', 'aiAssistantPanelBody', 'aiAssistantPanelEmptyText', 'aiAssistantPanelFooter', 'aiAssistantPanelConversation', 'aiAssistantPanelConversationList', 'aiAssistantPanelConversationTitle', 'aiAssistantPanelSuggestions', 'aiAssistantPanelSuggestionsList', 'aiAssistantPanelSuggestionsItem', 'aiAssistantPanelSuggestionsLabel', 'actionsCell', 'aggregationColumnHeader', 'aggregationColumnHeader--alignLeft', 'aggregationColumnHeader--alignCenter', 'aggregationColumnHeader--alignRight', 'aggregationColumnHeaderLabel', 'aggregationRowOverlayWrapper', 'autoHeight', 'autosizing', 'mainContent', 'withSidePanel', 'booleanCell', 'cell--editable', 'cell--editing', 'cell--flex', 'cell--textCenter', 'cell--textLeft', 'cell--textRight', 'cell--rangeTop', 'cell--rangeBottom', 'cell--rangeLeft', 'cell--rangeRight', 'cell--pinnedLeft', 'cell--pinnedRight', 'cell--selectionMode', 'cell', 'cellCheckbox', 'cellEmpty', 'cellSkeleton', 'cellOffsetLeft', 'checkboxInput', 'collapsible', 'collapsibleTrigger', 'collapsibleIcon', 'collapsiblePanel', 'columnHeader', 'columnHeader--alignCenter', 'columnHeader--alignLeft', 'columnHeader--alignRight', 'columnHeader--dragging', 'columnHeader--moving', 'columnHeader--numeric', 'columnHeader--sortable', 'columnHeader--sorted', 'columnHeader--filtered', 'columnHeader--pinnedLeft', 'columnHeader--pinnedRight', 'columnHeader--last', 'columnHeader--siblingFocused', 'columnHeader--filter', 'columnHeaderFilterInput', 'columnHeaderFilterOperatorLabel', 'columnHeaderCheckbox', 'columnHeaderDraggableContainer', 'columnHeaderTitle', 'columnHeaderTitleContainer', 'columnHeaderTitleContainerContent', 'columnHeader--filledGroup', 'columnHeader--emptyGroup', 'columnHeaders', 'columnSeparator--resizable', 'columnSeparator--resizing', 'columnSeparator--sideLeft', 'columnSeparator--sideRight', 'columnSeparator', 'columnsManagement', 'columnsManagementRow', 'columnsManagementHeader', 'columnsManagementSearchInput', 'columnsManagementFooter', 'columnsManagementScrollArea', 'columnsManagementEmptyText', 'container--top', 'container--bottom', 'detailPanel', 'detailPanelToggleCell', 'detailPanelToggleCell--expanded', 'footerCell', 'panel', 'panelHeader', 'panelWrapper', 'panelContent', 'panelFooter', 'paper', 'editBooleanCell', 'editInputCell', 'longTextCell', 'longTextCellContent', 'longTextCellExpandButton', 'longTextCellCollapseButton', 'longTextCellPopup', 'longTextCellPopperContent', 'editLongTextCell', 'editLongTextCellValue', 'editLongTextCellPopup', 'editLongTextCellPopperContent', 'editLongTextCellTextarea', 'filler', 'filler--borderBottom', 'filler--pinnedLeft', 'filler--pinnedRight', 'filterForm', 'filterFormDeleteIcon', 'filterFormLogicOperatorInput', 'filterFormColumnInput', 'filterFormOperatorInput', 'filterFormValueInput', 'filterIcon', 'footerContainer', 'headerFilterRow', 'iconButtonContainer', 'iconSeparator', 'main', 'main--hasPinnedRight', 'main--hiddenContent', 'menu', 'menuIcon', 'menuIconButton', 'menuOpen', 'menuList', 'overlay', 'overlayWrapper', 'overlayWrapperInner', 'root', 'root--densityStandard', 'root--densityComfortable', 'root--densityCompact', 'root--disableUserSelection', 'root--noToolbar', 'row', 'row--editable', 'row--editing', 'row--firstVisible', 'row--lastVisible',
-// TODO v9: Rename to `cell--dragging`
-'row--dragging', 'row--beingDragged', 'row--dynamicHeight', 'row--detailPanelExpanded', 'row--borderBottom', 'rowReorderCellPlaceholder', 'rowCount', 'rowReorderCellContainer', 'rowReorderCell', 'rowReorderCell--draggable', 'rowReorderIcon', 'rowSkeleton', 'scrollArea--left', 'scrollArea--right', 'scrollArea--up', 'scrollArea--down', 'scrollArea', 'scrollbar', 'scrollbar--vertical', 'scrollbar--horizontal', 'scrollbarFiller', 'scrollbarFiller--pinnedRight', 'scrollShadow', 'scrollShadow--vertical', 'scrollShadow--horizontal', 'selectedRowCount', 'sortButton', 'sortIcon', 'shadowScrollArea', 'sidebar', 'sidebarHeader', 'toolbarContainer', 'toolbar', 'toolbarLabel', 'toolbarDivider', 'toolbarFilterList', 'toolbarQuickFilter', 'toolbarQuickFilterTrigger', 'toolbarQuickFilterControl', 'virtualScroller', 'virtualScroller--hasScrollX', 'virtualScrollerContent', 'virtualScrollerContent--overflowed', 'virtualScrollerRenderZone', 'withVerticalBorder', 'withBorderColor', 'cell--withRightBorder', 'cell--withLeftBorder', 'columnHeader--withRightBorder', 'columnHeader--withLeftBorder', 'treeDataGroupingCell', 'treeDataGroupingCellToggle', 'treeDataGroupingCellLoadingContainer', 'groupingCriteriaCell', 'groupingCriteriaCellToggle', 'groupingCriteriaCellLoadingContainer', 'pinnedRows', 'pinnedRows--top', 'pinnedRows--bottom', 'pivotPanelAvailableFields', 'pivotPanelField', 'pivotPanelField--sorted', 'pivotPanelFieldActionContainer', 'pivotPanelFieldCheckbox', 'pivotPanelFieldDragIcon', 'pivotPanelFieldList', 'pivotPanelFieldName', 'pivotPanelHeader', 'pivotPanelPlaceholder', 'pivotPanelScrollArea', 'pivotPanelSearchContainer', 'pivotPanelSection', 'pivotPanelSectionTitle', 'pivotPanelSections', 'pivotPanelSwitch', 'pivotPanelSwitchLabel', 'prompt', 'promptContent', 'promptText', 'promptFeedback', 'promptChangeList', 'promptChangesToggle', 'promptChangesToggleIcon', 'promptIcon', 'promptIconContainer', 'promptError', 'promptAction', 'resizablePanelHandle', 'resizablePanelHandle--horizontal', 'resizablePanelHandle--vertical']);
+
+/**
+ * Class groups for the MuiDataGrid component used in GridRootStyles overridesResolver.
+ *
+ * Splits classes into two groups to support style overrides:
+ * - `root`: classes applied directly to the root element (use `&.className` selector)
+ * - `children`: classes applied to child elements (use `& .className` selector)
+ *
+ * These are spread into the gridClasses utility object and used for CSS-in-JS overrides.
+ *
+ * Only include class names here that are NOT applied via `styled` components.
+ * For `styled` components, declare overrides directly in the component definition.
+ */
+const gridClassesOverrides = exports.gridClassesOverrides = {
+  root: ['autoHeight', 'autosizing', 'root--densityStandard', 'root--densityComfortable', 'root--densityCompact', 'root--disableUserSelection', 'root--noToolbar', 'withVerticalBorder'],
+  children: ['actionsCell', 'booleanCell', 'cell', 'cell--editable', 'cell--editing', 'cell--flex', 'cell--pinnedLeft', 'cell--pinnedRight', 'cell--rangeBottom', 'cell--rangeLeft', 'cell--rangeRight', 'cell--rangeTop', 'cell--selectionMode', 'cell--textCenter', 'cell--textLeft', 'cell--textRight', 'cell--withLeftBorder', 'cell--withRightBorder', 'cellCheckbox', 'cellEmpty', 'cellOffsetLeft', 'cellSkeleton', 'checkboxInput', 'columnHeader', 'columnHeader--alignCenter', 'columnHeader--alignLeft', 'columnHeader--alignRight', 'columnHeader--dragging', 'columnHeader--emptyGroup', 'columnHeader--filledGroup', 'columnHeader--filtered', 'columnHeader--last', 'columnHeader--moving', 'columnHeader--numeric', 'columnHeader--pinnedLeft', 'columnHeader--pinnedRight', 'columnHeader--siblingFocused', 'columnHeader--sortable', 'columnHeader--sorted', 'columnHeader--withLeftBorder', 'columnHeader--withRightBorder', 'columnHeaderCheckbox', 'columnHeaderDraggableContainer', 'columnHeaderTitleContainer', 'columnHeaderTitleContainerContent', 'columnSeparator', 'columnSeparator--resizable', 'columnSeparator--resizing', 'columnSeparator--sideLeft', 'columnSeparator--sideRight', 'container--bottom', 'container--top', 'detailPanelToggleCell', 'detailPanelToggleCell--expanded', 'editBooleanCell', 'filterIcon', 'filler--borderBottom', 'filler--pinnedLeft', 'filler--pinnedRight', 'groupingCriteriaCell', 'groupingCriteriaCellLoadingContainer', 'groupingCriteriaCellToggle', 'headerFilterRow', 'iconSeparator', 'menuIcon', 'menuIconButton', 'menuList', 'menuOpen', 'overlayWrapperInner', 'pinnedRows', 'pinnedRows--bottom', 'pinnedRows--top', 'row', 'row--borderBottom', 'row--detailPanelExpanded',
+  // TODO v9: Rename to `cell--dragging`
+  'row--dragging', 'row--dynamicHeight', 'row--editable', 'row--editing', 'row--firstVisible', 'row--lastVisible', 'rowReorderCell', 'rowReorderCell--draggable', 'rowReorderCellContainer', 'rowReorderCellPlaceholder', 'rowSkeleton', 'scrollbar', 'scrollbar--horizontal', 'scrollbar--vertical', 'scrollbarFiller', 'scrollbarFiller--pinnedRight', 'sortIcon', 'treeDataGroupingCell', 'treeDataGroupingCellLoadingContainer', 'treeDataGroupingCellToggle', 'withBorderColor', 'row--beingDragged']
+};
+const gridClasses = exports.gridClasses = (0, _generateUtilityClasses.default)('MuiDataGrid', [...gridClassesOverrides.root, ...gridClassesOverrides.children, 'aiAssistantPanel', 'aiAssistantPanelHeader', 'aiAssistantPanelTitleContainer', 'aiAssistantPanelTitle', 'aiAssistantPanelBody', 'aiAssistantPanelEmptyText', 'aiAssistantPanelFooter', 'aiAssistantPanelConversation', 'aiAssistantPanelConversationList', 'aiAssistantPanelConversationTitle', 'aiAssistantPanelSuggestions', 'aiAssistantPanelSuggestionsList', 'aiAssistantPanelSuggestionsItem', 'aiAssistantPanelSuggestionsLabel', 'aggregationColumnHeader', 'aggregationColumnHeader--alignLeft', 'aggregationColumnHeader--alignCenter', 'aggregationColumnHeader--alignRight', 'aggregationColumnHeaderLabel', 'aggregationRowOverlayWrapper', 'mainContent', 'withSidePanel', 'collapsible', 'collapsibleTrigger', 'collapsibleIcon', 'collapsiblePanel', 'columnHeader--filter', 'columnHeaderFilterInput', 'columnHeaderFilterOperatorLabel', 'columnHeaderTitle', 'columnHeaders', 'columnsManagement', 'columnsManagementRow', 'columnsManagementHeader', 'columnsManagementSearchInput', 'columnsManagementFooter', 'columnsManagementScrollArea', 'columnsManagementEmptyText', 'detailPanel', 'footerCell', 'panel', 'panelHeader', 'panelWrapper', 'panelContent', 'panelFooter', 'paper', 'editInputCell', 'longTextCell', 'longTextCellContent', 'longTextCellExpandButton', 'longTextCellCollapseButton', 'longTextCellPopup', 'longTextCellPopperContent', 'editLongTextCell', 'editLongTextCellValue', 'editLongTextCellPopup', 'editLongTextCellPopperContent', 'editLongTextCellTextarea', 'filler', 'filterForm', 'filterFormDeleteIcon', 'filterFormLogicOperatorInput', 'filterFormColumnInput', 'filterFormOperatorInput', 'filterFormValueInput', 'footerContainer', 'iconButtonContainer', 'main', 'main--hasPinnedRight', 'main--hiddenContent', 'menu', 'overlay', 'overlayWrapper', 'root', 'rowCount', 'rowReorderIcon', 'scrollArea--left', 'scrollArea--right', 'scrollArea--up', 'scrollArea--down', 'scrollArea', 'scrollShadow', 'scrollShadow--vertical', 'scrollShadow--horizontal', 'selectedRowCount', 'sortButton', 'shadowScrollArea', 'sidebar', 'sidebarHeader', 'toolbarContainer', 'toolbar', 'toolbarLabel', 'toolbarDivider', 'toolbarFilterList', 'toolbarQuickFilter', 'toolbarQuickFilterTrigger', 'toolbarQuickFilterControl', 'virtualScroller', 'virtualScroller--hasScrollX', 'virtualScrollerContent', 'virtualScrollerContent--overflowed', 'virtualScrollerRenderZone', 'pivotPanelAvailableFields', 'pivotPanelField', 'pivotPanelField--sorted', 'pivotPanelFieldActionContainer', 'pivotPanelFieldCheckbox', 'pivotPanelFieldDragIcon', 'pivotPanelFieldList', 'pivotPanelFieldName', 'pivotPanelHeader', 'pivotPanelPlaceholder', 'pivotPanelScrollArea', 'pivotPanelSearchContainer', 'pivotPanelSection', 'pivotPanelSectionTitle', 'pivotPanelSections', 'pivotPanelSwitch', 'pivotPanelSwitchLabel', 'prompt', 'promptContent', 'promptText', 'promptFeedback', 'promptChangeList', 'promptChangesToggle', 'promptChangesToggleIcon', 'promptIcon', 'promptIconContainer', 'promptError', 'promptAction', 'resizablePanelHandle', 'resizablePanelHandle--horizontal', 'resizablePanelHandle--vertical']);

package/constants/gridClasses.mjs

@@ -3,6 +3,23 @@ import generateUtilityClasses from '@mui/utils/generateUtilityClasses';
 export function getDataGridUtilityClass(slot) {
   return generateUtilityClass('MuiDataGrid', slot);
 }
-export const gridClasses = generateUtilityClasses('MuiDataGrid', ['aiAssistantPanel', 'aiAssistantPanelHeader', 'aiAssistantPanelTitleContainer', 'aiAssistantPanelTitle', 'aiAssistantPanelBody', 'aiAssistantPanelEmptyText', 'aiAssistantPanelFooter', 'aiAssistantPanelConversation', 'aiAssistantPanelConversationList', 'aiAssistantPanelConversationTitle', 'aiAssistantPanelSuggestions', 'aiAssistantPanelSuggestionsList', 'aiAssistantPanelSuggestionsItem', 'aiAssistantPanelSuggestionsLabel', 'actionsCell', 'aggregationColumnHeader', 'aggregationColumnHeader--alignLeft', 'aggregationColumnHeader--alignCenter', 'aggregationColumnHeader--alignRight', 'aggregationColumnHeaderLabel', 'aggregationRowOverlayWrapper', 'autoHeight', 'autosizing', 'mainContent', 'withSidePanel', 'booleanCell', 'cell--editable', 'cell--editing', 'cell--flex', 'cell--textCenter', 'cell--textLeft', 'cell--textRight', 'cell--rangeTop', 'cell--rangeBottom', 'cell--rangeLeft', 'cell--rangeRight', 'cell--pinnedLeft', 'cell--pinnedRight', 'cell--selectionMode', 'cell', 'cellCheckbox', 'cellEmpty', 'cellSkeleton', 'cellOffsetLeft', 'checkboxInput', 'collapsible', 'collapsibleTrigger', 'collapsibleIcon', 'collapsiblePanel', 'columnHeader', 'columnHeader--alignCenter', 'columnHeader--alignLeft', 'columnHeader--alignRight', 'columnHeader--dragging', 'columnHeader--moving', 'columnHeader--numeric', 'columnHeader--sortable', 'columnHeader--sorted', 'columnHeader--filtered', 'columnHeader--pinnedLeft', 'columnHeader--pinnedRight', 'columnHeader--last', 'columnHeader--siblingFocused', 'columnHeader--filter', 'columnHeaderFilterInput', 'columnHeaderFilterOperatorLabel', 'columnHeaderCheckbox', 'columnHeaderDraggableContainer', 'columnHeaderTitle', 'columnHeaderTitleContainer', 'columnHeaderTitleContainerContent', 'columnHeader--filledGroup', 'columnHeader--emptyGroup', 'columnHeaders', 'columnSeparator--resizable', 'columnSeparator--resizing', 'columnSeparator--sideLeft', 'columnSeparator--sideRight', 'columnSeparator', 'columnsManagement', 'columnsManagementRow', 'columnsManagementHeader', 'columnsManagementSearchInput', 'columnsManagementFooter', 'columnsManagementScrollArea', 'columnsManagementEmptyText', 'container--top', 'container--bottom', 'detailPanel', 'detailPanelToggleCell', 'detailPanelToggleCell--expanded', 'footerCell', 'panel', 'panelHeader', 'panelWrapper', 'panelContent', 'panelFooter', 'paper', 'editBooleanCell', 'editInputCell', 'longTextCell', 'longTextCellContent', 'longTextCellExpandButton', 'longTextCellCollapseButton', 'longTextCellPopup', 'longTextCellPopperContent', 'editLongTextCell', 'editLongTextCellValue', 'editLongTextCellPopup', 'editLongTextCellPopperContent', 'editLongTextCellTextarea', 'filler', 'filler--borderBottom', 'filler--pinnedLeft', 'filler--pinnedRight', 'filterForm', 'filterFormDeleteIcon', 'filterFormLogicOperatorInput', 'filterFormColumnInput', 'filterFormOperatorInput', 'filterFormValueInput', 'filterIcon', 'footerContainer', 'headerFilterRow', 'iconButtonContainer', 'iconSeparator', 'main', 'main--hasPinnedRight', 'main--hiddenContent', 'menu', 'menuIcon', 'menuIconButton', 'menuOpen', 'menuList', 'overlay', 'overlayWrapper', 'overlayWrapperInner', 'root', 'root--densityStandard', 'root--densityComfortable', 'root--densityCompact', 'root--disableUserSelection', 'root--noToolbar', 'row', 'row--editable', 'row--editing', 'row--firstVisible', 'row--lastVisible',
-// TODO v9: Rename to `cell--dragging`
-'row--dragging', 'row--beingDragged', 'row--dynamicHeight', 'row--detailPanelExpanded', 'row--borderBottom', 'rowReorderCellPlaceholder', 'rowCount', 'rowReorderCellContainer', 'rowReorderCell', 'rowReorderCell--draggable', 'rowReorderIcon', 'rowSkeleton', 'scrollArea--left', 'scrollArea--right', 'scrollArea--up', 'scrollArea--down', 'scrollArea', 'scrollbar', 'scrollbar--vertical', 'scrollbar--horizontal', 'scrollbarFiller', 'scrollbarFiller--pinnedRight', 'scrollShadow', 'scrollShadow--vertical', 'scrollShadow--horizontal', 'selectedRowCount', 'sortButton', 'sortIcon', 'shadowScrollArea', 'sidebar', 'sidebarHeader', 'toolbarContainer', 'toolbar', 'toolbarLabel', 'toolbarDivider', 'toolbarFilterList', 'toolbarQuickFilter', 'toolbarQuickFilterTrigger', 'toolbarQuickFilterControl', 'virtualScroller', 'virtualScroller--hasScrollX', 'virtualScrollerContent', 'virtualScrollerContent--overflowed', 'virtualScrollerRenderZone', 'withVerticalBorder', 'withBorderColor', 'cell--withRightBorder', 'cell--withLeftBorder', 'columnHeader--withRightBorder', 'columnHeader--withLeftBorder', 'treeDataGroupingCell', 'treeDataGroupingCellToggle', 'treeDataGroupingCellLoadingContainer', 'groupingCriteriaCell', 'groupingCriteriaCellToggle', 'groupingCriteriaCellLoadingContainer', 'pinnedRows', 'pinnedRows--top', 'pinnedRows--bottom', 'pivotPanelAvailableFields', 'pivotPanelField', 'pivotPanelField--sorted', 'pivotPanelFieldActionContainer', 'pivotPanelFieldCheckbox', 'pivotPanelFieldDragIcon', 'pivotPanelFieldList', 'pivotPanelFieldName', 'pivotPanelHeader', 'pivotPanelPlaceholder', 'pivotPanelScrollArea', 'pivotPanelSearchContainer', 'pivotPanelSection', 'pivotPanelSectionTitle', 'pivotPanelSections', 'pivotPanelSwitch', 'pivotPanelSwitchLabel', 'prompt', 'promptContent', 'promptText', 'promptFeedback', 'promptChangeList', 'promptChangesToggle', 'promptChangesToggleIcon', 'promptIcon', 'promptIconContainer', 'promptError', 'promptAction', 'resizablePanelHandle', 'resizablePanelHandle--horizontal', 'resizablePanelHandle--vertical']);
+
+/**
+ * Class groups for the MuiDataGrid component used in GridRootStyles overridesResolver.
+ *
+ * Splits classes into two groups to support style overrides:
+ * - `root`: classes applied directly to the root element (use `&.className` selector)
+ * - `children`: classes applied to child elements (use `& .className` selector)
+ *
+ * These are spread into the gridClasses utility object and used for CSS-in-JS overrides.
+ *
+ * Only include class names here that are NOT applied via `styled` components.
+ * For `styled` components, declare overrides directly in the component definition.
+ */
+export const gridClassesOverrides = {
+  root: ['autoHeight', 'autosizing', 'root--densityStandard', 'root--densityComfortable', 'root--densityCompact', 'root--disableUserSelection', 'root--noToolbar', 'withVerticalBorder'],
+  children: ['actionsCell', 'booleanCell', 'cell', 'cell--editable', 'cell--editing', 'cell--flex', 'cell--pinnedLeft', 'cell--pinnedRight', 'cell--rangeBottom', 'cell--rangeLeft', 'cell--rangeRight', 'cell--rangeTop', 'cell--selectionMode', 'cell--textCenter', 'cell--textLeft', 'cell--textRight', 'cell--withLeftBorder', 'cell--withRightBorder', 'cellCheckbox', 'cellEmpty', 'cellOffsetLeft', 'cellSkeleton', 'checkboxInput', 'columnHeader', 'columnHeader--alignCenter', 'columnHeader--alignLeft', 'columnHeader--alignRight', 'columnHeader--dragging', 'columnHeader--emptyGroup', 'columnHeader--filledGroup', 'columnHeader--filtered', 'columnHeader--last', 'columnHeader--moving', 'columnHeader--numeric', 'columnHeader--pinnedLeft', 'columnHeader--pinnedRight', 'columnHeader--siblingFocused', 'columnHeader--sortable', 'columnHeader--sorted', 'columnHeader--withLeftBorder', 'columnHeader--withRightBorder', 'columnHeaderCheckbox', 'columnHeaderDraggableContainer', 'columnHeaderTitleContainer', 'columnHeaderTitleContainerContent', 'columnSeparator', 'columnSeparator--resizable', 'columnSeparator--resizing', 'columnSeparator--sideLeft', 'columnSeparator--sideRight', 'container--bottom', 'container--top', 'detailPanelToggleCell', 'detailPanelToggleCell--expanded', 'editBooleanCell', 'filterIcon', 'filler--borderBottom', 'filler--pinnedLeft', 'filler--pinnedRight', 'groupingCriteriaCell', 'groupingCriteriaCellLoadingContainer', 'groupingCriteriaCellToggle', 'headerFilterRow', 'iconSeparator', 'menuIcon', 'menuIconButton', 'menuList', 'menuOpen', 'overlayWrapperInner', 'pinnedRows', 'pinnedRows--bottom', 'pinnedRows--top', 'row', 'row--borderBottom', 'row--detailPanelExpanded',
+  // TODO v9: Rename to `cell--dragging`
+  'row--dragging', 'row--dynamicHeight', 'row--editable', 'row--editing', 'row--firstVisible', 'row--lastVisible', 'rowReorderCell', 'rowReorderCell--draggable', 'rowReorderCellContainer', 'rowReorderCellPlaceholder', 'rowSkeleton', 'scrollbar', 'scrollbar--horizontal', 'scrollbar--vertical', 'scrollbarFiller', 'scrollbarFiller--pinnedRight', 'sortIcon', 'treeDataGroupingCell', 'treeDataGroupingCellLoadingContainer', 'treeDataGroupingCellToggle', 'withBorderColor', 'row--beingDragged']
+};
+export const gridClasses = generateUtilityClasses('MuiDataGrid', [...gridClassesOverrides.root, ...gridClassesOverrides.children, 'aiAssistantPanel', 'aiAssistantPanelHeader', 'aiAssistantPanelTitleContainer', 'aiAssistantPanelTitle', 'aiAssistantPanelBody', 'aiAssistantPanelEmptyText', 'aiAssistantPanelFooter', 'aiAssistantPanelConversation', 'aiAssistantPanelConversationList', 'aiAssistantPanelConversationTitle', 'aiAssistantPanelSuggestions', 'aiAssistantPanelSuggestionsList', 'aiAssistantPanelSuggestionsItem', 'aiAssistantPanelSuggestionsLabel', 'aggregationColumnHeader', 'aggregationColumnHeader--alignLeft', 'aggregationColumnHeader--alignCenter', 'aggregationColumnHeader--alignRight', 'aggregationColumnHeaderLabel', 'aggregationRowOverlayWrapper', 'mainContent', 'withSidePanel', 'collapsible', 'collapsibleTrigger', 'collapsibleIcon', 'collapsiblePanel', 'columnHeader--filter', 'columnHeaderFilterInput', 'columnHeaderFilterOperatorLabel', 'columnHeaderTitle', 'columnHeaders', 'columnsManagement', 'columnsManagementRow', 'columnsManagementHeader', 'columnsManagementSearchInput', 'columnsManagementFooter', 'columnsManagementScrollArea', 'columnsManagementEmptyText', 'detailPanel', 'footerCell', 'panel', 'panelHeader', 'panelWrapper', 'panelContent', 'panelFooter', 'paper', 'editInputCell', 'longTextCell', 'longTextCellContent', 'longTextCellExpandButton', 'longTextCellCollapseButton', 'longTextCellPopup', 'longTextCellPopperContent', 'editLongTextCell', 'editLongTextCellValue', 'editLongTextCellPopup', 'editLongTextCellPopperContent', 'editLongTextCellTextarea', 'filler', 'filterForm', 'filterFormDeleteIcon', 'filterFormLogicOperatorInput', 'filterFormColumnInput', 'filterFormOperatorInput', 'filterFormValueInput', 'footerContainer', 'iconButtonContainer', 'main', 'main--hasPinnedRight', 'main--hiddenContent', 'menu', 'overlay', 'overlayWrapper', 'root', 'rowCount', 'rowReorderIcon', 'scrollArea--left', 'scrollArea--right', 'scrollArea--up', 'scrollArea--down', 'scrollArea', 'scrollShadow', 'scrollShadow--vertical', 'scrollShadow--horizontal', 'selectedRowCount', 'sortButton', 'shadowScrollArea', 'sidebar', 'sidebarHeader', 'toolbarContainer', 'toolbar', 'toolbarLabel', 'toolbarDivider', 'toolbarFilterList', 'toolbarQuickFilter', 'toolbarQuickFilterTrigger', 'toolbarQuickFilterControl', 'virtualScroller', 'virtualScroller--hasScrollX', 'virtualScrollerContent', 'virtualScrollerContent--overflowed', 'virtualScrollerRenderZone', 'pivotPanelAvailableFields', 'pivotPanelField', 'pivotPanelField--sorted', 'pivotPanelFieldActionContainer', 'pivotPanelFieldCheckbox', 'pivotPanelFieldDragIcon', 'pivotPanelFieldList', 'pivotPanelFieldName', 'pivotPanelHeader', 'pivotPanelPlaceholder', 'pivotPanelScrollArea', 'pivotPanelSearchContainer', 'pivotPanelSection', 'pivotPanelSectionTitle', 'pivotPanelSections', 'pivotPanelSwitch', 'pivotPanelSwitchLabel', 'prompt', 'promptContent', 'promptText', 'promptFeedback', 'promptChangeList', 'promptChangesToggle', 'promptChangesToggleIcon', 'promptIcon', 'promptIconContainer', 'promptError', 'promptAction', 'resizablePanelHandle', 'resizablePanelHandle--horizontal', 'resizablePanelHandle--vertical']);

package/constants/index.d.mts

@@ -1,4 +1,4 @@
 export * from "./envConstants.mjs";
 export * from "./localeTextConstants.mjs";
-export * from "./gridClasses.mjs";
+export { type GridClassKey, type GridClasses, getDataGridUtilityClass, gridClasses } from "./gridClasses.mjs";
 export * from "./signature.mjs";

package/constants/index.d.ts

@@ -1,4 +1,4 @@
 export * from "./envConstants.js";
 export * from "./localeTextConstants.js";
-export * from "./gridClasses.js";
+export { type GridClassKey, type GridClasses, getDataGridUtilityClass, gridClasses } from "./gridClasses.js";
 export * from "./signature.js";

package/constants/index.js

@@ -3,9 +3,26 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
+var _exportNames = {
+  getDataGridUtilityClass: true,
+  gridClasses: true
+};
+Object.defineProperty(exports, "getDataGridUtilityClass", {
+  enumerable: true,
+  get: function () {
+    return _gridClasses.getDataGridUtilityClass;
+  }
+});
+Object.defineProperty(exports, "gridClasses", {
+  enumerable: true,
+  get: function () {
+    return _gridClasses.gridClasses;
+  }
+});
 var _envConstants = require("./envConstants");
 Object.keys(_envConstants).forEach(function (key) {
   if (key === "default" || key === "__esModule") return;
+  if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;
   if (key in exports && exports[key] === _envConstants[key]) return;
   Object.defineProperty(exports, key, {
     enumerable: true,
@@ -17,6 +34,7 @@ Object.keys(_envConstants).forEach(function (key) {
 var _localeTextConstants = require("./localeTextConstants");
 Object.keys(_localeTextConstants).forEach(function (key) {
   if (key === "default" || key === "__esModule") return;
+  if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;
   if (key in exports && exports[key] === _localeTextConstants[key]) return;
   Object.defineProperty(exports, key, {
     enumerable: true,
@@ -26,19 +44,10 @@ Object.keys(_localeTextConstants).forEach(function (key) {
   });
 });
 var _gridClasses = require("./gridClasses");
-Object.keys(_gridClasses).forEach(function (key) {
-  if (key === "default" || key === "__esModule") return;
-  if (key in exports && exports[key] === _gridClasses[key]) return;
-  Object.defineProperty(exports, key, {
-    enumerable: true,
-    get: function () {
-      return _gridClasses[key];
-    }
-  });
-});
 var _signature = require("./signature");
 Object.keys(_signature).forEach(function (key) {
   if (key === "default" || key === "__esModule") return;
+  if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;
   if (key in exports && exports[key] === _signature[key]) return;
   Object.defineProperty(exports, key, {
     enumerable: true,

package/constants/index.mjs

@@ -1,4 +1,4 @@
 export * from "./envConstants.mjs";
 export * from "./localeTextConstants.mjs";
-export * from "./gridClasses.mjs";
+export { getDataGridUtilityClass, gridClasses } from "./gridClasses.mjs";
 export * from "./signature.mjs";

package/index.js

@@ -1,5 +1,5 @@
 /**
- * @mui/x-data-grid v9.0.0-alpha.3
+ * @mui/x-data-grid v9.0.0-alpha.4
  *
  * @license MIT
  * This source code is licensed under the MIT license found in the

package/index.mjs

@@ -1,5 +1,5 @@
 /**
- * @mui/x-data-grid v9.0.0-alpha.3
+ * @mui/x-data-grid v9.0.0-alpha.4
  *
  * @license MIT
  * This source code is licensed under the MIT license found in the

package/material/index.js

@@ -81,12 +81,14 @@ const _excluded = ["id", "label", "labelId", "material", "disabled", "slotProps"
   _excluded16 = ["id", "multiple", "freeSolo", "options", "getOptionLabel", "isOptionEqualToValue", "value", "onChange", "label", "placeholder", "slotProps", "material"],
   _excluded17 = ["key"],
   _excluded18 = ["inputProps", "InputProps", "InputLabelProps"],
-  _excluded19 = ["slotProps", "material"],
-  _excluded20 = ["material"],
-  _excluded21 = ["ref", "open", "children", "className", "clickAwayTouchEvent", "clickAwayMouseEvent", "flip", "focusTrap", "onExited", "onClickAway", "onDidShow", "onDidHide", "id", "target", "transition", "placement", "material"],
-  _excluded22 = ["native"],
-  _excluded23 = ["children", "value", "active"],
-  _excluded24 = ["items", "value", "material"];
+  _excluded19 = ["slotProps"],
+  _excluded20 = ["slotProps"],
+  _excluded21 = ["slotProps", "material"],
+  _excluded22 = ["material"],
+  _excluded23 = ["ref", "open", "children", "className", "clickAwayTouchEvent", "clickAwayMouseEvent", "flip", "focusTrap", "onExited", "onClickAway", "onDidShow", "onDidHide", "id", "target", "transition", "placement", "material"],
+  _excluded24 = ["native"],
+  _excluded25 = ["children", "value", "active"],
+  _excluded26 = ["items", "value", "material"];
 /* eslint-disable mui/disallow-react-api-in-server-components */
 
 const InputAdornment = (0, _styles.styled)(_InputAdornment.default, {
@@ -168,8 +170,10 @@ const BaseSelect = (0, _forwardRef.forwardRef)(function BaseSelect(props, ref) {
   const computedSize = size ?? textFieldDefaults.size;
   const computedVariant = textFieldDefaults.variant ?? 'outlined';
   const menuProps = {
-    PaperProps: {
-      onKeyDown
+    slotProps: {
+      paper: {
+        onKeyDown
+      }
     }
   };
   if (onClose) {
@@ -299,7 +303,9 @@ const BaseCheckbox = (0, _forwardRef.forwardRef)(function BaseCheckbox(props, re
   if (!label) {
     return /*#__PURE__*/(0, _jsxRuntime.jsx)(Checkbox, (0, _extends2.default)({}, other, material, {
       className: (0, _clsx.default)(className, material?.className),
-      inputProps: slotProps?.htmlInput,
+      slotProps: {
+        input: slotProps?.htmlInput
+      },
       ref: handleRef,
       touchRippleRef: rippleRef
     }));
@@ -307,7 +313,9 @@ const BaseCheckbox = (0, _forwardRef.forwardRef)(function BaseCheckbox(props, re
   return /*#__PURE__*/(0, _jsxRuntime.jsx)(FormControlLabel, {
     className: className,
     control: /*#__PURE__*/(0, _jsxRuntime.jsx)(Checkbox, (0, _extends2.default)({}, other, material, {
-      inputProps: slotProps?.htmlInput,
+      slotProps: {
+        input: slotProps?.htmlInput
+      },
       ref: handleRef,
       touchRippleRef: rippleRef
     })),
@@ -470,8 +478,6 @@ function BaseMenuItem(props) {
   }, "3")]);
 }
 function BaseTextField(props) {
-  // MaterialUI v5 doesn't support slotProps, until we drop v5 support we need to
-  // translate the pattern.
   const {
       slotProps,
       material
@@ -485,11 +491,13 @@ function BaseTextField(props) {
     variant: computedVariant,
     size: computedSize
   }, other, material, {
-    inputProps: slotProps?.htmlInput,
-    InputProps: transformInputProps(slotProps?.input),
-    InputLabelProps: (0, _extends2.default)({
-      shrink: true
-    }, slotProps?.inputLabel)
+    slotProps: {
+      htmlInput: slotProps?.htmlInput,
+      input: transformInputProps(slotProps?.input),
+      inputLabel: (0, _extends2.default)({
+        shrink: true
+      }, slotProps?.inputLabel)
+    }
   }));
 }
 function BaseAutocomplete(props) {
@@ -518,7 +526,7 @@ function BaseAutocomplete(props) {
     isOptionEqualToValue: isOptionEqualToValue,
     value: value,
     onChange: onChange,
-    renderTags: (currentValue, getTagProps) => currentValue.map((option, index) => {
+    renderValue: (currentValue, getTagProps) => currentValue.map((option, index) => {
       const _getTagProps = getTagProps({
           index
         }),
@@ -534,20 +542,33 @@ function BaseAutocomplete(props) {
     }),
     renderInput: params => {
       const {
-          inputProps,
+          inputProps: htmlInputProps,
           InputProps,
           InputLabelProps
         } = params,
         inputRest = (0, _objectWithoutPropertiesLoose2.default)(params, _excluded18);
+      const _ref = slotProps?.textField ?? {},
+        {
+          slotProps: textFieldSlotProps
+        } = _ref,
+        textFieldRest = (0, _objectWithoutPropertiesLoose2.default)(_ref, _excluded19);
+      const _ref2 = rootProps.slotProps?.baseTextField ?? {},
+        {
+          slotProps: baseTextFieldSlotProps
+        } = _ref2,
+        baseTextFieldRest = (0, _objectWithoutPropertiesLoose2.default)(_ref2, _excluded20);
       return /*#__PURE__*/(0, _jsxRuntime.jsx)(_TextField.default, (0, _extends2.default)({}, inputRest, {
         label: label,
-        placeholder: placeholder,
-        inputProps: inputProps,
-        InputProps: transformInputProps(InputProps, false),
-        InputLabelProps: (0, _extends2.default)({
-          shrink: true
-        }, InputLabelProps)
-      }, slotProps?.textField, rootProps.slotProps?.baseTextField));
+        placeholder: placeholder
+      }, textFieldRest, baseTextFieldRest, {
+        slotProps: {
+          htmlInput: (0, _extends2.default)({}, htmlInputProps, textFieldSlotProps?.htmlInput, baseTextFieldSlotProps?.htmlInput),
+          input: (0, _extends2.default)({}, transformInputProps(InputProps, false), textFieldSlotProps?.input, baseTextFieldSlotProps?.input),
+          inputLabel: (0, _extends2.default)({
+            shrink: true
+          }, InputLabelProps, textFieldSlotProps?.inputLabel, baseTextFieldSlotProps?.inputLabel)
+        }
+      }));
     }
   }, other, material));
 }
@@ -562,7 +583,7 @@ function transformInputProps(props, wrapAdornments = true) {
       slotProps,
       material
     } = props,
-    other = (0, _objectWithoutPropertiesLoose2.default)(props, _excluded19);
+    other = (0, _objectWithoutPropertiesLoose2.default)(props, _excluded21);
   const result = other;
   if (wrapAdornments) {
     if (result.startAdornment) {
@@ -596,7 +617,7 @@ const BaseTextarea = (0, _forwardRef.forwardRef)(function BaseTextarea(props, re
   const {
       material
     } = props,
-    other = (0, _objectWithoutPropertiesLoose2.default)(props, _excluded20);
+    other = (0, _objectWithoutPropertiesLoose2.default)(props, _excluded22);
   return /*#__PURE__*/(0, _jsxRuntime.jsx)(_TextareaAutosize.default, (0, _extends2.default)({}, other, material, {
     ref: ref
   }));
@@ -621,7 +642,7 @@ function BasePopper(props) {
       placement,
       material
     } = props,
-    other = (0, _objectWithoutPropertiesLoose2.default)(props, _excluded21);
+    other = (0, _objectWithoutPropertiesLoose2.default)(props, _excluded23);
   const modifiers = React.useMemo(() => {
     const result = [{
       name: 'preventOverflow',
@@ -712,11 +733,11 @@ function focusTrapWrapper(props, content) {
     })
   });
 }
-function BaseSelectOption(_ref) {
+function BaseSelectOption(_ref3) {
   let {
       native
-    } = _ref,
-    props = (0, _objectWithoutPropertiesLoose2.default)(_ref, _excluded22);
+    } = _ref3,
+    props = (0, _objectWithoutPropertiesLoose2.default)(_ref3, _excluded24);
   if (native) {
     return /*#__PURE__*/(0, _jsxRuntime.jsx)("option", (0, _extends2.default)({}, props));
   }
@@ -751,7 +772,7 @@ function TabPanel(props) {
       children,
       active
     } = props,
-    other = (0, _objectWithoutPropertiesLoose2.default)(props, _excluded23);
+    other = (0, _objectWithoutPropertiesLoose2.default)(props, _excluded25);
   return /*#__PURE__*/(0, _jsxRuntime.jsx)(StyledTabPanel, (0, _extends2.default)({
     role: "tabpanel",
     style: {
@@ -761,13 +782,13 @@ function TabPanel(props) {
     children: children
   }));
 }
-function BaseTabs(_ref2) {
+function BaseTabs(_ref4) {
   let {
       items,
       value,
       material
-    } = _ref2,
-    props = (0, _objectWithoutPropertiesLoose2.default)(_ref2, _excluded24);
+    } = _ref4,
+    props = (0, _objectWithoutPropertiesLoose2.default)(_ref4, _excluded26);
   const id = (0, _useId.default)();
   const labelId = `${id}-tab-${value}`;
   const panelId = `${id}-tabpanel-${value}`;

package/material/index.mjs

@@ -20,12 +20,14 @@ const _excluded = ["id", "label", "labelId", "material", "disabled", "slotProps"
   _excluded16 = ["id", "multiple", "freeSolo", "options", "getOptionLabel", "isOptionEqualToValue", "value", "onChange", "label", "placeholder", "slotProps", "material"],
   _excluded17 = ["key"],
   _excluded18 = ["inputProps", "InputProps", "InputLabelProps"],
-  _excluded19 = ["slotProps", "material"],
-  _excluded20 = ["material"],
-  _excluded21 = ["ref", "open", "children", "className", "clickAwayTouchEvent", "clickAwayMouseEvent", "flip", "focusTrap", "onExited", "onClickAway", "onDidShow", "onDidHide", "id", "target", "transition", "placement", "material"],
-  _excluded22 = ["native"],
-  _excluded23 = ["children", "value", "active"],
-  _excluded24 = ["items", "value", "material"];
+  _excluded19 = ["slotProps"],
+  _excluded20 = ["slotProps"],
+  _excluded21 = ["slotProps", "material"],
+  _excluded22 = ["material"],
+  _excluded23 = ["ref", "open", "children", "className", "clickAwayTouchEvent", "clickAwayMouseEvent", "flip", "focusTrap", "onExited", "onClickAway", "onDidShow", "onDidHide", "id", "target", "transition", "placement", "material"],
+  _excluded24 = ["native"],
+  _excluded25 = ["children", "value", "active"],
+  _excluded26 = ["items", "value", "material"];
 import * as React from 'react';
 import clsx from 'clsx';
 import useForkRef from '@mui/utils/useForkRef';
@@ -155,8 +157,10 @@ const BaseSelect = forwardRef(function BaseSelect(props, ref) {
   const computedSize = size ?? textFieldDefaults.size;
   const computedVariant = textFieldDefaults.variant ?? 'outlined';
   const menuProps = {
-    PaperProps: {
-      onKeyDown
+    slotProps: {
+      paper: {
+        onKeyDown
+      }
     }
   };
   if (onClose) {
@@ -286,7 +290,9 @@ const BaseCheckbox = forwardRef(function BaseCheckbox(props, ref) {
   if (!label) {
     return /*#__PURE__*/_jsx(Checkbox, _extends({}, other, material, {
       className: clsx(className, material?.className),
-      inputProps: slotProps?.htmlInput,
+      slotProps: {
+        input: slotProps?.htmlInput
+      },
       ref: handleRef,
       touchRippleRef: rippleRef
     }));
@@ -294,7 +300,9 @@ const BaseCheckbox = forwardRef(function BaseCheckbox(props, ref) {
   return /*#__PURE__*/_jsx(FormControlLabel, {
     className: className,
     control: /*#__PURE__*/_jsx(Checkbox, _extends({}, other, material, {
-      inputProps: slotProps?.htmlInput,
+      slotProps: {
+        input: slotProps?.htmlInput
+      },
       ref: handleRef,
       touchRippleRef: rippleRef
     })),
@@ -457,8 +465,6 @@ function BaseMenuItem(props) {
   }, "3")]);
 }
 function BaseTextField(props) {
-  // MaterialUI v5 doesn't support slotProps, until we drop v5 support we need to
-  // translate the pattern.
   const {
       slotProps,
       material
@@ -472,11 +478,13 @@ function BaseTextField(props) {
     variant: computedVariant,
     size: computedSize
   }, other, material, {
-    inputProps: slotProps?.htmlInput,
-    InputProps: transformInputProps(slotProps?.input),
-    InputLabelProps: _extends({
-      shrink: true
-    }, slotProps?.inputLabel)
+    slotProps: {
+      htmlInput: slotProps?.htmlInput,
+      input: transformInputProps(slotProps?.input),
+      inputLabel: _extends({
+        shrink: true
+      }, slotProps?.inputLabel)
+    }
   }));
 }
 function BaseAutocomplete(props) {
@@ -505,7 +513,7 @@ function BaseAutocomplete(props) {
     isOptionEqualToValue: isOptionEqualToValue,
     value: value,
     onChange: onChange,
-    renderTags: (currentValue, getTagProps) => currentValue.map((option, index) => {
+    renderValue: (currentValue, getTagProps) => currentValue.map((option, index) => {
       const _getTagProps = getTagProps({
           index
         }),
@@ -521,20 +529,33 @@ function BaseAutocomplete(props) {
     }),
     renderInput: params => {
       const {
-          inputProps,
+          inputProps: htmlInputProps,
           InputProps,
           InputLabelProps
         } = params,
         inputRest = _objectWithoutPropertiesLoose(params, _excluded18);
+      const _ref = slotProps?.textField ?? {},
+        {
+          slotProps: textFieldSlotProps
+        } = _ref,
+        textFieldRest = _objectWithoutPropertiesLoose(_ref, _excluded19);
+      const _ref2 = rootProps.slotProps?.baseTextField ?? {},
+        {
+          slotProps: baseTextFieldSlotProps
+        } = _ref2,
+        baseTextFieldRest = _objectWithoutPropertiesLoose(_ref2, _excluded20);
       return /*#__PURE__*/_jsx(MUITextField, _extends({}, inputRest, {
         label: label,
-        placeholder: placeholder,
-        inputProps: inputProps,
-        InputProps: transformInputProps(InputProps, false),
-        InputLabelProps: _extends({
-          shrink: true
-        }, InputLabelProps)
-      }, slotProps?.textField, rootProps.slotProps?.baseTextField));
+        placeholder: placeholder
+      }, textFieldRest, baseTextFieldRest, {
+        slotProps: {
+          htmlInput: _extends({}, htmlInputProps, textFieldSlotProps?.htmlInput, baseTextFieldSlotProps?.htmlInput),
+          input: _extends({}, transformInputProps(InputProps, false), textFieldSlotProps?.input, baseTextFieldSlotProps?.input),
+          inputLabel: _extends({
+            shrink: true
+          }, InputLabelProps, textFieldSlotProps?.inputLabel, baseTextFieldSlotProps?.inputLabel)
+        }
+      }));
     }
   }, other, material));
 }
@@ -549,7 +570,7 @@ function transformInputProps(props, wrapAdornments = true) {
       slotProps,
       material
     } = props,
-    other = _objectWithoutPropertiesLoose(props, _excluded19);
+    other = _objectWithoutPropertiesLoose(props, _excluded21);
   const result = other;
   if (wrapAdornments) {
     if (result.startAdornment) {
@@ -583,7 +604,7 @@ const BaseTextarea = forwardRef(function BaseTextarea(props, ref) {
   const {
       material
     } = props,
-    other = _objectWithoutPropertiesLoose(props, _excluded20);
+    other = _objectWithoutPropertiesLoose(props, _excluded22);
   return /*#__PURE__*/_jsx(MUITextareaAutosize, _extends({}, other, material, {
     ref: ref
   }));
@@ -608,7 +629,7 @@ function BasePopper(props) {
       placement,
       material
     } = props,
-    other = _objectWithoutPropertiesLoose(props, _excluded21);
+    other = _objectWithoutPropertiesLoose(props, _excluded23);
   const modifiers = React.useMemo(() => {
     const result = [{
       name: 'preventOverflow',
@@ -699,11 +720,11 @@ function focusTrapWrapper(props, content) {
     })
   });
 }
-function BaseSelectOption(_ref) {
+function BaseSelectOption(_ref3) {
   let {
       native
-    } = _ref,
-    props = _objectWithoutPropertiesLoose(_ref, _excluded22);
+    } = _ref3,
+    props = _objectWithoutPropertiesLoose(_ref3, _excluded24);
   if (native) {
     return /*#__PURE__*/_jsx("option", _extends({}, props));
   }
@@ -738,7 +759,7 @@ function TabPanel(props) {
       children,
       active
     } = props,
-    other = _objectWithoutPropertiesLoose(props, _excluded23);
+    other = _objectWithoutPropertiesLoose(props, _excluded25);
   return /*#__PURE__*/_jsx(StyledTabPanel, _extends({
     role: "tabpanel",
     style: {
@@ -748,13 +769,13 @@ function TabPanel(props) {
     children: children
   }));
 }
-function BaseTabs(_ref2) {
+function BaseTabs(_ref4) {
   let {
       items,
       value,
       material
-    } = _ref2,
-    props = _objectWithoutPropertiesLoose(_ref2, _excluded24);
+    } = _ref4,
+    props = _objectWithoutPropertiesLoose(_ref4, _excluded26);
   const id = useId();
   const labelId = `${id}-tab-${value}`;
   const panelId = `${id}-tabpanel-${value}`;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@mui/x-data-grid",
-  "version": "9.0.0-alpha.3",
+  "version": "9.0.0-alpha.4",
   "author": "MUI Team",
   "description": "The Community plan edition of the MUI X Data Grid components.",
   "license": "MIT",
@@ -42,8 +42,8 @@
     "clsx": "^2.1.1",
     "prop-types": "^15.8.1",
     "use-sync-external-store": "^1.6.0",
-    "@mui/x-virtualizer": "1.0.0-alpha.1",
-    "@mui/x-internals": "9.0.0-alpha.2"
+    "@mui/x-virtualizer": "1.0.0-beta.0",
+    "@mui/x-internals": "9.0.0-alpha.4"
   },
   "peerDependencies": {
     "@emotion/react": "^11.9.0",