@mui/x-data-grid-premium 6.0.0-beta.2 → 6.0.0-beta.4

package/CHANGELOG.md

@@ -3,6 +3,112 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## 6.0.0-beta.4
+
+_Feb 16, 2023_
+
+We'd like to offer a big thanks to the 8 contributors who made this release possible. Here are some highlights ✨:
+
+- ⚡️ Improve grid performance by reducing rerenders (#7857) @cherniavskii
+- 📚 Documentation improvements
+- 🐞 Bugfixes
+
+### `@mui/x-data-grid@v6.0.0-beta.4` / `@mui/x-data-grid-pro@v6.0.0-beta.4` / `@mui/x-data-grid-premium@v6.0.0-beta.4`
+
+#### Changes
+
+- [DataGrid] Add interface for `singleSelect` column (#7685) @m4theushw
+- [DataGrid] Allow to pass props to the `TrapFocus` inside the panel wrapper (#7733) @Vivek-Prajapatii
+- [DataGrid] Avoid unnecessary rerenders after `updateRows` (#7857) @cherniavskii
+- [DataGridPro] Change cursor when dragging a column (#7725) @sai6855
+- [DataGridPremium] Fix `leafField` to have correct focus value (#7950) @MBilalShafi
+
+### `@mui/x-date-pickers@v6.0.0-beta.4` / `@mui/x-date-pickers-pro@v6.0.0-beta.4`
+
+#### Changes
+
+- [DateRangePicker] Fix slide transition by avoiding useless component re-rendering (#7874) @LukasTy
+- [fields] Support Backspace key on `Android` (#7842) @flaviendelangle
+- [fields] Support escaped characters on `Luxon` (#7888) @flaviendelangle
+- [pickers] Prepare new pickers for custom fields (#7806) @flaviendelangle
+
+### `@mui/x-codemod@v6.0.0-beta.4`
+
+#### Changes
+
+- [codemod] Fix import path (#7952) @LukasTy
+
+### Docs
+
+- [docs] Add an info callout specifying the current state of desktop time view (#7933) @LukasTy
+- [docs] Add missing param in `useGridApiEventHandler` examples (#7939) @flaviendelangle
+- [docs] Fix markdown table alignments (#7898) @oliviertassinari
+- [docs] Improve `DataGrid` migration guide (#7861) @MBilalShafi
+- [docs] Update `LocalizationProvider` `dateAdapter` with a link to the doc (#7872) @LukasTy
+
+### Core
+
+- [core] Run editing field tests on all major adapters (#7868) @flaviendelangle
+
+## 6.0.0-beta.3
+
+_Feb 9, 2023_
+
+We'd like to offer a big thanks to the 11 contributors who made this release possible. Here are some highlights ✨:
+
+- ⬅️ Add right-to-left support for the data grid (#6580) @yaredtsy
+- ⚡️ Improve grid resize performance (#7864) @cherniavskii
+- ✨ New codemods for migrating to v6 @MBilalShafi
+- 📚 Documentation improvements
+- 🐞 Bugfixes
+
+### `@mui/x-data-grid@v6.0.0-beta.3` / `@mui/x-data-grid-pro@v6.0.0-beta.3` / `@mui/x-data-grid-premium@v6.0.0-beta.3`
+
+#### Changes
+
+- [DataGrid] Add `BaseIconButton` component slot (#7329) @123joshuawu
+- [DataGrid] Allow to customize the value displayed in the filter button tooltip (#6956) @ithrforu
+- [DataGrid] Improve grid resize performance (#7864) @cherniavskii
+- [DataGrid] Make `apiRef.current.getRowWithUpdatedValues` stable (#7788) @m4theushw
+- [DataGrid] Support RTL (#6580) @yaredtsy
+- [DataGrid] Improve query selectors for selecting cell element (#7354) @yaredtsy
+- [l10n] Improve Brazilian Portuguese (pt-BR) locale (#7854) @ed-ateixeira
+
+### `@mui/x-date-pickers@v6.0.0-beta.3` / `@mui/x-date-pickers-pro@v6.0.0-beta.3`
+
+#### Changes
+
+- [fields] Allow to select year 2000 on 2-digit year section (#7858) @flaviendelangle
+- [fields] Fix year editing on `day.js` (#7862) @flaviendelangle
+- [fields] Fix year editing on valid date (#7834) @flaviendelangle
+- [fields] Reset query when pressing `Backspace` or `Delete` (#7855) @flaviendelangle
+- [pickers] Clean Popper position on new pickers (#7445) @flaviendelangle
+- [pickers] Ditch pickers `skipLibCheck` (#7808) @LukasTy
+- [pickers] Improve JSDoc and resulting API docs pages (#7847) @LukasTy
+
+### `@mui/x-codemod@v6.0.0-beta.3`
+
+#### Changes
+
+- [codemod] Add more cases to `rename-selectors-and-events` codemod (#7856) @MBilalShafi
+- [codemod] Add warning message to the codemods and migration guide (#7813) @MBilalShafi
+- [codemod] Add codemod to remove unnecessary `experimentalFeatures` flag (#7836) @MBilalShafi
+- [codemod] Rename `GridFilterItem` props (#7483) @MBilalShafi
+- [codemod] Rename `linkOperators` to `logicOperators` (#7707) @MBilalShafi
+- [codemod] Replace `onCellFocusOut` prop for Data Grid (#7786) @MBilalShafi
+
+### Docs
+
+- [docs] Add a "Whats new in v6" page linked on the sidebar (#7820) @joserodolfofreitas
+- [docs] Fix hydration crash in pickers (#7734) @oliviertassinari
+- [docs] Remove no longer relevant range shortcuts section (#7840) @LukasTy
+- [docs] Use `@next` tag in grid and pickers installation instructions (#7814) @cherniavskii
+
+### Core
+
+- [core] Remove `tslint` package leftovers (#7841) @LukasTy
+- [test] Use `createDescribes` for `describeValue` and `describeValidation` (#7866) @flaviendelangle
+
 ## 6.0.0-beta.2
 
 We'd like to offer a big thanks to the 11 contributors who made this release possible. Here are some highlights ✨:
@@ -2073,6 +2179,64 @@ You can find more information about the new api, including how to set those tran
 - [test] Skip tests for column pinning and dynamic row height (#5997) @m4theushw
 - [website] Improve security header @oliviertassinari
 
+## 5.17.24
+
+_Feb 16, 2023_
+
+We'd like to offer a big thanks to the 5 contributors who made this release possible. Here are some highlights ✨:
+
+- 🌍 Add Hungarian (hu-HU) locale
+- 🐞 Bugfixes
+
+### `@mui/x-data-grid@v5.17.24` / `@mui/x-data-grid-pro@v5.17.24` / `@mui/x-data-grid-premium@v5.17.24`
+
+#### Changes
+
+- [DataGrid] Allow to pass props to the `TrapFocus` inside the panel wrapper (#7897) @Vivek-Prajapatii
+- [DataGrid] Avoid unnecessary rerenders after `updateRows` (#7945) @cherniavskii
+- [DataGridPro] Change cursor when dragging a column (#7878) @sai6855
+- [DataGridPremium] Fix `leafField` to have correct focus value (#7959) @MBilalShafi
+
+### `@mui/x-date-pickers@v5.0.19` / `@mui/x-date-pickers-pro@v5.0.19`
+
+#### Changes
+
+- [l10n] Add Hungarian (hu-HU) locale (#7796) @noherczeg
+
+## 5.17.23
+
+_Feb 9, 2023_
+
+We'd like to offer a big thanks to the 6 contributors who made this release possible. Here are some highlights ✨:
+
+- 🌍 Improve Brazilian Portuguese (pt-BR) locale
+- 🎉 Add banner and callouts to inform about MUI X v6 beta
+- 🐞 Bugfixes
+
+### `@mui/x-data-grid@v5.17.23` / `@mui/x-data-grid-pro@v5.17.23` / `@mui/x-data-grid-premium@v5.17.23`
+
+#### Changes
+
+- [DataGrid] Allow to customize the value displayed in the filter button tooltip (#7816) @ithrforu
+- [DataGrid] Fix `getCellElement` method not working with pinned columns (#7844) @yaredtsy
+- [DataGrid] Fix stale rows issue in `unstable_replaceRows` (#7694) @MBilalShafi
+- [l10n] Improve Brazilian Portuguese (pt-BR) locale (#7850) @ed-ateixeira
+
+### `@mui/x-date-pickers@v_5.0.18` / `@mui/x-date-pickers-pro@v_5.0.18`
+
+#### Changes
+
+- [pickers] Update pickers when new value has a distinct timezone (#7853) @alexfauquette
+
+### Docs
+
+- [docs] Add messages in v5 doc to inform people about v6 (#7838) @flaviendelangle
+- [docs] Fix 301 link @oliviertassinari
+
+### Core
+
+- [core] Upgrade monorepo (#7849) @cherniavskii
+
 ## 5.17.22
 
 _Feb 2, 2023_

package/components/GridGroupingCriteriaCell.js

@@ -1,6 +1,6 @@
+import _extends from "@babel/runtime/helpers/esm/extends";
 import * as React from 'react';
 import { unstable_composeClasses as composeClasses } from '@mui/utils';
-import IconButton from '@mui/material/IconButton';
 import Box from '@mui/material/Box';
 import { useGridSelector, gridFilteredDescendantCountLookupSelector, getDataGridUtilityClass } from '@mui/x-data-grid-pro';
 import { useGridApiContext } from '../hooks/utils/useGridApiContext';
@@ -18,7 +18,7 @@ const useUtilityClasses = ownerState => {
   return composeClasses(slots, getDataGridUtilityClass, classes);
 };
 export function GridGroupingCriteriaCell(props) {
-  var _filteredDescendantCo;
+  var _filteredDescendantCo, _rootProps$components;
   const {
     id,
     field,
@@ -69,16 +69,17 @@ export function GridGroupingCriteriaCell(props) {
     },
     children: [/*#__PURE__*/_jsx("div", {
       className: classes.toggle,
-      children: filteredDescendantCount > 0 && /*#__PURE__*/_jsx(IconButton, {
+      children: filteredDescendantCount > 0 && /*#__PURE__*/_jsx(rootProps.components.BaseIconButton, _extends({
         size: "small",
         onClick: handleClick,
         onKeyDown: handleKeyDown,
         tabIndex: -1,
-        "aria-label": rowNode.childrenExpanded ? apiRef.current.getLocaleText('treeDataCollapse') : apiRef.current.getLocaleText('treeDataExpand'),
+        "aria-label": rowNode.childrenExpanded ? apiRef.current.getLocaleText('treeDataCollapse') : apiRef.current.getLocaleText('treeDataExpand')
+      }, (_rootProps$components = rootProps.componentsProps) == null ? void 0 : _rootProps$components.baseIconButton, {
         children: /*#__PURE__*/_jsx(Icon, {
           fontSize: "inherit"
         })
-      })
+      }))
     }), cellContent, !hideDescendantCount && filteredDescendantCount > 0 ? /*#__PURE__*/_jsxs("span", {
       style: {
         whiteSpace: 'pre'

package/hooks/features/export/serializer/excelSerializer.js

@@ -1,6 +1,6 @@
 import _extends from "@babel/runtime/helpers/esm/extends";
 import { GRID_DATE_COL_DEF, GRID_DATETIME_COL_DEF } from '@mui/x-data-grid-pro';
-import { buildWarning, isObject } from '@mui/x-data-grid/internals';
+import { buildWarning, isObject, isSingleSelectColDef } from '@mui/x-data-grid/internals';
 const getExcelJs = async () => {
   var _excelJsModule$defaul;
   const excelJsModule = await import('exceljs');
@@ -56,38 +56,39 @@ const serializeRow = (id, columns, api, defaultValueOptionsFormulae) => {
     switch (cellParams.colDef.type) {
       case 'singleSelect':
         {
-          if (typeof cellParams.colDef.valueOptions === 'function') {
+          const castColumn = cellParams.colDef;
+          if (typeof castColumn.valueOptions === 'function') {
             // If value option depends on the row, set specific options to the cell
             // This dataValidation is buggy with LibreOffice and does not allow to have coma
-            const valueOptions = cellParams.colDef.valueOptions({
+            const valueOptions = castColumn.valueOptions({
               id,
               row,
               field: cellParams.field
             });
-            const formattedValueOptions = getFormattedValueOptions(cellParams.colDef, valueOptions, api);
-            dataValidation[column.field] = {
+            const formattedValueOptions = getFormattedValueOptions(castColumn, valueOptions, api);
+            dataValidation[castColumn.field] = {
               type: 'list',
               allowBlank: true,
               formulae: [`"${formattedValueOptions.map(x => x.toString().replaceAll(',', 'CHAR(44)')).join(',')}"`]
             };
           } else {
             // If value option is defined for the column, refer to another sheet
-            dataValidation[column.field] = {
+            dataValidation[castColumn.field] = {
               type: 'list',
               allowBlank: true,
-              formulae: [defaultValueOptionsFormulae[column.field]]
+              formulae: [defaultValueOptionsFormulae[castColumn.field]]
             };
           }
-          const formattedValue = api.getCellParams(id, column.field).formattedValue;
+          const formattedValue = api.getCellParams(id, castColumn.field).formattedValue;
           if (process.env.NODE_ENV !== 'production') {
             if (String(cellParams.formattedValue) === '[object Object]') {
               warnInvalidFormattedValue();
             }
           }
           if (isObject(formattedValue)) {
-            row[column.field] = formattedValue == null ? void 0 : formattedValue.label;
+            row[castColumn.field] = formattedValue == null ? void 0 : formattedValue.label;
           } else {
-            row[column.field] = formattedValue;
+            row[castColumn.field] = formattedValue;
           }
           break;
         }
@@ -241,7 +242,7 @@ export async function buildExcel(options, api) {
       return (_column$headerName = column.headerName) != null ? _column$headerName : column.field;
     }));
   }
-  const columnsWithArrayValueOptions = columns.filter(column => column.type === 'singleSelect' && column.valueOptions && typeof column.valueOptions !== 'function');
+  const columnsWithArrayValueOptions = columns.filter(column => isSingleSelectColDef(column) && column.valueOptions && typeof column.valueOptions !== 'function');
   const defaultValueOptionsFormulae = {};
   if (columnsWithArrayValueOptions.length) {
     const valueOptionsWorksheet = workbook.addWorksheet(valueOptionsSheetName);

package/hooks/features/rowGrouping/createGroupingColDef.js

@@ -4,6 +4,7 @@ const _excluded = ["leafField", "mainGroupingCriteria", "hideDescendantCount"],
   _excluded2 = ["leafField", "mainGroupingCriteria", "hideDescendantCount"];
 import * as React from 'react';
 import { GRID_STRING_COL_DEF } from '@mui/x-data-grid-pro';
+import { isSingleSelectColDef } from '@mui/x-data-grid-pro/internals';
 import { GridGroupingColumnFooterCell } from '../../../components/GridGroupingColumnFooterCell';
 import { GridGroupingCriteriaCell } from '../../../components/GridGroupingCriteriaCell';
 import { GridGroupingColumnLeafCell } from '../../../components/GridGroupingColumnLeafCell';
@@ -49,7 +50,7 @@ const getLeafProperties = leafColDef => {
     headerName: (_leafColDef$headerNam = leafColDef.headerName) != null ? _leafColDef$headerNam : leafColDef.field,
     sortable: leafColDef.sortable,
     filterable: leafColDef.filterable,
-    valueOptions: leafColDef.valueOptions,
+    valueOptions: isSingleSelectColDef(leafColDef) ? leafColDef.valueOptions : undefined,
     filterOperators: (_leafColDef$filterOpe = leafColDef.filterOperators) == null ? void 0 : _leafColDef$filterOpe.map(operator => _extends({}, operator, {
       getApplyFilterFn: (filterItem, column) => {
         const originalFn = operator.getApplyFilterFn(filterItem, column);
@@ -75,7 +76,7 @@ const getGroupingCriteriaProperties = (groupedByColDef, applyHeaderName) => {
   const properties = {
     sortable: groupedByColDef.sortable,
     filterable: groupedByColDef.filterable,
-    valueOptions: groupedByColDef.valueOptions,
+    valueOptions: isSingleSelectColDef(groupedByColDef) ? groupedByColDef.valueOptions : undefined,
     sortComparator: (v1, v2, cellParams1, cellParams2) => {
       // We only want to sort the groups of the current grouping criteria
       if (cellParams1.rowNode.type === 'group' && cellParams1.rowNode.groupingField === groupedByColDef.field && cellParams2.rowNode.type === 'group' && cellParams2.rowNode.groupingField === groupedByColDef.field) {
@@ -133,7 +134,8 @@ export const createGroupingColDefForOneGroupingCriteria = ({
       if (params.rowNode.type === 'leaf') {
         if (leafColDef) {
           const leafParams = _extends({}, params.api.getCellParams(params.id, leafField), {
-            api: params.api
+            api: params.api,
+            hasFocus: params.hasFocus
           });
           if (leafColDef.renderCell) {
             return leafColDef.renderCell(leafParams);
@@ -227,7 +229,8 @@ export const createGroupingColDefForAllGroupingCriteria = ({
       if (params.rowNode.type === 'leaf') {
         if (leafColDef) {
           const leafParams = _extends({}, params.api.getCellParams(params.id, leafField), {
-            api: params.api
+            api: params.api,
+            hasFocus: params.hasFocus
           });
           if (leafColDef.renderCell) {
             return leafColDef.renderCell(leafParams);

package/index.js

@@ -1,5 +1,5 @@
 /**
- * @mui/x-data-grid-premium v6.0.0-beta.2
+ * @mui/x-data-grid-premium v6.0.0-beta.4
  *
  * @license MUI X Commercial
  * This source code is licensed under the commercial license found in the

package/legacy/components/GridGroupingCriteriaCell.js

@@ -1,6 +1,6 @@
+import _extends from "@babel/runtime/helpers/esm/extends";
 import * as React from 'react';
 import { unstable_composeClasses as composeClasses } from '@mui/utils';
-import IconButton from '@mui/material/IconButton';
 import Box from '@mui/material/Box';
 import { useGridSelector, gridFilteredDescendantCountLookupSelector, getDataGridUtilityClass } from '@mui/x-data-grid-pro';
 import { useGridApiContext } from '../hooks/utils/useGridApiContext';
@@ -16,7 +16,7 @@ var useUtilityClasses = function useUtilityClasses(ownerState) {
   return composeClasses(slots, getDataGridUtilityClass, classes);
 };
 export function GridGroupingCriteriaCell(props) {
-  var _filteredDescendantCo;
+  var _filteredDescendantCo, _rootProps$components;
   var id = props.id,
     field = props.field,
     rowNode = props.rowNode,
@@ -65,16 +65,17 @@ export function GridGroupingCriteriaCell(props) {
     },
     children: [/*#__PURE__*/_jsx("div", {
       className: classes.toggle,
-      children: filteredDescendantCount > 0 && /*#__PURE__*/_jsx(IconButton, {
+      children: filteredDescendantCount > 0 && /*#__PURE__*/_jsx(rootProps.components.BaseIconButton, _extends({
         size: "small",
         onClick: handleClick,
         onKeyDown: handleKeyDown,
         tabIndex: -1,
-        "aria-label": rowNode.childrenExpanded ? apiRef.current.getLocaleText('treeDataCollapse') : apiRef.current.getLocaleText('treeDataExpand'),
+        "aria-label": rowNode.childrenExpanded ? apiRef.current.getLocaleText('treeDataCollapse') : apiRef.current.getLocaleText('treeDataExpand')
+      }, (_rootProps$components = rootProps.componentsProps) == null ? void 0 : _rootProps$components.baseIconButton, {
         children: /*#__PURE__*/_jsx(Icon, {
           fontSize: "inherit"
         })
-      })
+      }))
     }), cellContent, !hideDescendantCount && filteredDescendantCount > 0 ? /*#__PURE__*/_jsxs("span", {
       style: {
         whiteSpace: 'pre'

package/legacy/hooks/features/export/serializer/excelSerializer.js

@@ -6,7 +6,7 @@ import _asyncToGenerator from "@babel/runtime/helpers/esm/asyncToGenerator";
 var _defaultColumnsStyles;
 import _regeneratorRuntime from "@babel/runtime/regenerator";
 import { GRID_DATE_COL_DEF, GRID_DATETIME_COL_DEF } from '@mui/x-data-grid-pro';
-import { buildWarning, isObject } from '@mui/x-data-grid/internals';
+import { buildWarning, isObject, isSingleSelectColDef } from '@mui/x-data-grid/internals';
 var getExcelJs = /*#__PURE__*/function () {
   var _ref = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee() {
     var _excelJsModule$defaul;
@@ -83,16 +83,17 @@ var serializeRow = function serializeRow(id, columns, api, defaultValueOptionsFo
     switch (cellParams.colDef.type) {
       case 'singleSelect':
         {
-          if (typeof cellParams.colDef.valueOptions === 'function') {
+          var castColumn = cellParams.colDef;
+          if (typeof castColumn.valueOptions === 'function') {
             // If value option depends on the row, set specific options to the cell
             // This dataValidation is buggy with LibreOffice and does not allow to have coma
-            var valueOptions = cellParams.colDef.valueOptions({
+            var valueOptions = castColumn.valueOptions({
               id: id,
               row: row,
               field: cellParams.field
             });
-            var formattedValueOptions = getFormattedValueOptions(cellParams.colDef, valueOptions, api);
-            dataValidation[column.field] = {
+            var formattedValueOptions = getFormattedValueOptions(castColumn, valueOptions, api);
+            dataValidation[castColumn.field] = {
               type: 'list',
               allowBlank: true,
               formulae: ["\"".concat(formattedValueOptions.map(function (x) {
@@ -101,22 +102,22 @@ var serializeRow = function serializeRow(id, columns, api, defaultValueOptionsFo
             };
           } else {
             // If value option is defined for the column, refer to another sheet
-            dataValidation[column.field] = {
+            dataValidation[castColumn.field] = {
               type: 'list',
               allowBlank: true,
-              formulae: [defaultValueOptionsFormulae[column.field]]
+              formulae: [defaultValueOptionsFormulae[castColumn.field]]
             };
           }
-          var formattedValue = api.getCellParams(id, column.field).formattedValue;
+          var formattedValue = api.getCellParams(id, castColumn.field).formattedValue;
           if (process.env.NODE_ENV !== 'production') {
             if (String(cellParams.formattedValue) === '[object Object]') {
               warnInvalidFormattedValue();
             }
           }
           if (isObject(formattedValue)) {
-            row[column.field] = formattedValue == null ? void 0 : formattedValue.label;
+            row[castColumn.field] = formattedValue == null ? void 0 : formattedValue.label;
           } else {
-            row[column.field] = formattedValue;
+            row[castColumn.field] = formattedValue;
           }
           break;
         }
@@ -279,7 +280,7 @@ function _buildExcel() {
               }));
             }
             columnsWithArrayValueOptions = columns.filter(function (column) {
-              return column.type === 'singleSelect' && column.valueOptions && typeof column.valueOptions !== 'function';
+              return isSingleSelectColDef(column) && column.valueOptions && typeof column.valueOptions !== 'function';
             });
             defaultValueOptionsFormulae = {};
             if (columnsWithArrayValueOptions.length) {

package/legacy/hooks/features/rowGrouping/createGroupingColDef.js

@@ -5,6 +5,7 @@ var _excluded = ["leafField", "mainGroupingCriteria", "hideDescendantCount"],
   _excluded2 = ["leafField", "mainGroupingCriteria", "hideDescendantCount"];
 import * as React from 'react';
 import { GRID_STRING_COL_DEF } from '@mui/x-data-grid-pro';
+import { isSingleSelectColDef } from '@mui/x-data-grid-pro/internals';
 import { GridGroupingColumnFooterCell } from '../../../components/GridGroupingColumnFooterCell';
 import { GridGroupingCriteriaCell } from '../../../components/GridGroupingCriteriaCell';
 import { GridGroupingColumnLeafCell } from '../../../components/GridGroupingColumnLeafCell';
@@ -50,7 +51,7 @@ var getLeafProperties = function getLeafProperties(leafColDef) {
     headerName: (_leafColDef$headerNam = leafColDef.headerName) != null ? _leafColDef$headerNam : leafColDef.field,
     sortable: leafColDef.sortable,
     filterable: leafColDef.filterable,
-    valueOptions: leafColDef.valueOptions,
+    valueOptions: isSingleSelectColDef(leafColDef) ? leafColDef.valueOptions : undefined,
     filterOperators: (_leafColDef$filterOpe = leafColDef.filterOperators) == null ? void 0 : _leafColDef$filterOpe.map(function (operator) {
       return _extends({}, operator, {
         getApplyFilterFn: function getApplyFilterFn(filterItem, column) {
@@ -78,7 +79,7 @@ var getGroupingCriteriaProperties = function getGroupingCriteriaProperties(group
   var properties = {
     sortable: groupedByColDef.sortable,
     filterable: groupedByColDef.filterable,
-    valueOptions: groupedByColDef.valueOptions,
+    valueOptions: isSingleSelectColDef(groupedByColDef) ? groupedByColDef.valueOptions : undefined,
     sortComparator: function sortComparator(v1, v2, cellParams1, cellParams2) {
       // We only want to sort the groups of the current grouping criteria
       if (cellParams1.rowNode.type === 'group' && cellParams1.rowNode.groupingField === groupedByColDef.field && cellParams2.rowNode.type === 'group' && cellParams2.rowNode.groupingField === groupedByColDef.field) {
@@ -135,7 +136,8 @@ export var createGroupingColDefForOneGroupingCriteria = function createGroupingC
       if (params.rowNode.type === 'leaf') {
         if (leafColDef) {
           var leafParams = _extends({}, params.api.getCellParams(params.id, leafField), {
-            api: params.api
+            api: params.api,
+            hasFocus: params.hasFocus
           });
           if (leafColDef.renderCell) {
             return leafColDef.renderCell(leafParams);
@@ -226,7 +228,8 @@ export var createGroupingColDefForAllGroupingCriteria = function createGroupingC
       if (params.rowNode.type === 'leaf') {
         if (leafColDef) {
           var leafParams = _extends({}, params.api.getCellParams(params.id, leafField), {
-            api: params.api
+            api: params.api,
+            hasFocus: params.hasFocus
           });
           if (leafColDef.renderCell) {
             return leafColDef.renderCell(leafParams);

package/legacy/index.js

@@ -1,5 +1,5 @@
 /**
- * @mui/x-data-grid-premium v6.0.0-beta.2
+ * @mui/x-data-grid-premium v6.0.0-beta.4
  *
  * @license MUI X Commercial
  * This source code is licensed under the commercial license found in the

package/legacy/utils/releaseInfo.js

@@ -1,6 +1,6 @@
 import { ponyfillGlobal } from '@mui/utils';
 export var getReleaseInfo = function getReleaseInfo() {
-  var releaseInfo = "MTY3NTI5MjQwMDAwMA==";
+  var releaseInfo = "MTY3NjQ5ODQwMDAwMA==";
   if (process.env.NODE_ENV !== 'production') {
     // A simple hack to set the value in the test environment (has no build step).
     // eslint-disable-next-line no-useless-concat

package/modern/components/GridGroupingCriteriaCell.js

@@ -1,6 +1,6 @@
+import _extends from "@babel/runtime/helpers/esm/extends";
 import * as React from 'react';
 import { unstable_composeClasses as composeClasses } from '@mui/utils';
-import IconButton from '@mui/material/IconButton';
 import Box from '@mui/material/Box';
 import { useGridSelector, gridFilteredDescendantCountLookupSelector, getDataGridUtilityClass } from '@mui/x-data-grid-pro';
 import { useGridApiContext } from '../hooks/utils/useGridApiContext';
@@ -68,16 +68,17 @@ export function GridGroupingCriteriaCell(props) {
     },
     children: [/*#__PURE__*/_jsx("div", {
       className: classes.toggle,
-      children: filteredDescendantCount > 0 && /*#__PURE__*/_jsx(IconButton, {
+      children: filteredDescendantCount > 0 && /*#__PURE__*/_jsx(rootProps.components.BaseIconButton, _extends({
         size: "small",
         onClick: handleClick,
         onKeyDown: handleKeyDown,
         tabIndex: -1,
-        "aria-label": rowNode.childrenExpanded ? apiRef.current.getLocaleText('treeDataCollapse') : apiRef.current.getLocaleText('treeDataExpand'),
+        "aria-label": rowNode.childrenExpanded ? apiRef.current.getLocaleText('treeDataCollapse') : apiRef.current.getLocaleText('treeDataExpand')
+      }, rootProps.componentsProps?.baseIconButton, {
         children: /*#__PURE__*/_jsx(Icon, {
           fontSize: "inherit"
         })
-      })
+      }))
     }), cellContent, !hideDescendantCount && filteredDescendantCount > 0 ? /*#__PURE__*/_jsxs("span", {
       style: {
         whiteSpace: 'pre'

package/modern/hooks/features/export/serializer/excelSerializer.js

@@ -1,6 +1,6 @@
 import _extends from "@babel/runtime/helpers/esm/extends";
 import { GRID_DATE_COL_DEF, GRID_DATETIME_COL_DEF } from '@mui/x-data-grid-pro';
-import { buildWarning, isObject } from '@mui/x-data-grid/internals';
+import { buildWarning, isObject, isSingleSelectColDef } from '@mui/x-data-grid/internals';
 const getExcelJs = async () => {
   const excelJsModule = await import('exceljs');
   return excelJsModule.default ?? excelJsModule;
@@ -55,38 +55,39 @@ const serializeRow = (id, columns, api, defaultValueOptionsFormulae) => {
     switch (cellParams.colDef.type) {
       case 'singleSelect':
         {
-          if (typeof cellParams.colDef.valueOptions === 'function') {
+          const castColumn = cellParams.colDef;
+          if (typeof castColumn.valueOptions === 'function') {
             // If value option depends on the row, set specific options to the cell
             // This dataValidation is buggy with LibreOffice and does not allow to have coma
-            const valueOptions = cellParams.colDef.valueOptions({
+            const valueOptions = castColumn.valueOptions({
               id,
               row,
               field: cellParams.field
             });
-            const formattedValueOptions = getFormattedValueOptions(cellParams.colDef, valueOptions, api);
-            dataValidation[column.field] = {
+            const formattedValueOptions = getFormattedValueOptions(castColumn, valueOptions, api);
+            dataValidation[castColumn.field] = {
               type: 'list',
               allowBlank: true,
               formulae: [`"${formattedValueOptions.map(x => x.toString().replaceAll(',', 'CHAR(44)')).join(',')}"`]
             };
           } else {
             // If value option is defined for the column, refer to another sheet
-            dataValidation[column.field] = {
+            dataValidation[castColumn.field] = {
               type: 'list',
               allowBlank: true,
-              formulae: [defaultValueOptionsFormulae[column.field]]
+              formulae: [defaultValueOptionsFormulae[castColumn.field]]
             };
           }
-          const formattedValue = api.getCellParams(id, column.field).formattedValue;
+          const formattedValue = api.getCellParams(id, castColumn.field).formattedValue;
           if (process.env.NODE_ENV !== 'production') {
             if (String(cellParams.formattedValue) === '[object Object]') {
               warnInvalidFormattedValue();
             }
           }
           if (isObject(formattedValue)) {
-            row[column.field] = formattedValue?.label;
+            row[castColumn.field] = formattedValue?.label;
           } else {
-            row[column.field] = formattedValue;
+            row[castColumn.field] = formattedValue;
           }
           break;
         }
@@ -231,7 +232,7 @@ export async function buildExcel(options, api) {
   if (includeHeaders) {
     worksheet.addRow(columns.map(column => column.headerName ?? column.field));
   }
-  const columnsWithArrayValueOptions = columns.filter(column => column.type === 'singleSelect' && column.valueOptions && typeof column.valueOptions !== 'function');
+  const columnsWithArrayValueOptions = columns.filter(column => isSingleSelectColDef(column) && column.valueOptions && typeof column.valueOptions !== 'function');
   const defaultValueOptionsFormulae = {};
   if (columnsWithArrayValueOptions.length) {
     const valueOptionsWorksheet = workbook.addWorksheet(valueOptionsSheetName);

package/modern/hooks/features/rowGrouping/createGroupingColDef.js

@@ -4,6 +4,7 @@ const _excluded = ["leafField", "mainGroupingCriteria", "hideDescendantCount"],
   _excluded2 = ["leafField", "mainGroupingCriteria", "hideDescendantCount"];
 import * as React from 'react';
 import { GRID_STRING_COL_DEF } from '@mui/x-data-grid-pro';
+import { isSingleSelectColDef } from '@mui/x-data-grid-pro/internals';
 import { GridGroupingColumnFooterCell } from '../../../components/GridGroupingColumnFooterCell';
 import { GridGroupingCriteriaCell } from '../../../components/GridGroupingCriteriaCell';
 import { GridGroupingColumnLeafCell } from '../../../components/GridGroupingColumnLeafCell';
@@ -46,7 +47,7 @@ const getLeafProperties = leafColDef => ({
   headerName: leafColDef.headerName ?? leafColDef.field,
   sortable: leafColDef.sortable,
   filterable: leafColDef.filterable,
-  valueOptions: leafColDef.valueOptions,
+  valueOptions: isSingleSelectColDef(leafColDef) ? leafColDef.valueOptions : undefined,
   filterOperators: leafColDef.filterOperators?.map(operator => _extends({}, operator, {
     getApplyFilterFn: (filterItem, column) => {
       const originalFn = operator.getApplyFilterFn(filterItem, column);
@@ -70,7 +71,7 @@ const getGroupingCriteriaProperties = (groupedByColDef, applyHeaderName) => {
   const properties = {
     sortable: groupedByColDef.sortable,
     filterable: groupedByColDef.filterable,
-    valueOptions: groupedByColDef.valueOptions,
+    valueOptions: isSingleSelectColDef(groupedByColDef) ? groupedByColDef.valueOptions : undefined,
     sortComparator: (v1, v2, cellParams1, cellParams2) => {
       // We only want to sort the groups of the current grouping criteria
       if (cellParams1.rowNode.type === 'group' && cellParams1.rowNode.groupingField === groupedByColDef.field && cellParams2.rowNode.type === 'group' && cellParams2.rowNode.groupingField === groupedByColDef.field) {
@@ -126,7 +127,8 @@ export const createGroupingColDefForOneGroupingCriteria = ({
       if (params.rowNode.type === 'leaf') {
         if (leafColDef) {
           const leafParams = _extends({}, params.api.getCellParams(params.id, leafField), {
-            api: params.api
+            api: params.api,
+            hasFocus: params.hasFocus
           });
           if (leafColDef.renderCell) {
             return leafColDef.renderCell(leafParams);
@@ -216,7 +218,8 @@ export const createGroupingColDefForAllGroupingCriteria = ({
       if (params.rowNode.type === 'leaf') {
         if (leafColDef) {
           const leafParams = _extends({}, params.api.getCellParams(params.id, leafField), {
-            api: params.api
+            api: params.api,
+            hasFocus: params.hasFocus
           });
           if (leafColDef.renderCell) {
             return leafColDef.renderCell(leafParams);

package/modern/index.js

@@ -1,5 +1,5 @@
 /**
- * @mui/x-data-grid-premium v6.0.0-beta.2
+ * @mui/x-data-grid-premium v6.0.0-beta.4
  *
  * @license MUI X Commercial
  * This source code is licensed under the commercial license found in the

package/modern/utils/releaseInfo.js

@@ -1,6 +1,6 @@
 import { ponyfillGlobal } from '@mui/utils';
 export const getReleaseInfo = () => {
-  const releaseInfo = "MTY3NTI5MjQwMDAwMA==";
+  const releaseInfo = "MTY3NjQ5ODQwMDAwMA==";
   if (process.env.NODE_ENV !== 'production') {
     // A simple hack to set the value in the test environment (has no build step).
     // eslint-disable-next-line no-useless-concat

package/node/components/GridGroupingCriteriaCell.js

@@ -5,9 +5,9 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.GridGroupingCriteriaCell = GridGroupingCriteriaCell;
+var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
 var React = _interopRequireWildcard(require("react"));
 var _utils = require("@mui/utils");
-var _IconButton = _interopRequireDefault(require("@mui/material/IconButton"));
 var _Box = _interopRequireDefault(require("@mui/material/Box"));
 var _xDataGridPro = require("@mui/x-data-grid-pro");
 var _useGridApiContext = require("../hooks/utils/useGridApiContext");
@@ -76,16 +76,17 @@ function GridGroupingCriteriaCell(props) {
     },
     children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
       className: classes.toggle,
-      children: filteredDescendantCount > 0 && /*#__PURE__*/(0, _jsxRuntime.jsx)(_IconButton.default, {
+      children: filteredDescendantCount > 0 && /*#__PURE__*/(0, _jsxRuntime.jsx)(rootProps.components.BaseIconButton, (0, _extends2.default)({
         size: "small",
         onClick: handleClick,
         onKeyDown: handleKeyDown,
         tabIndex: -1,
-        "aria-label": rowNode.childrenExpanded ? apiRef.current.getLocaleText('treeDataCollapse') : apiRef.current.getLocaleText('treeDataExpand'),
+        "aria-label": rowNode.childrenExpanded ? apiRef.current.getLocaleText('treeDataCollapse') : apiRef.current.getLocaleText('treeDataExpand')
+      }, rootProps.componentsProps?.baseIconButton, {
         children: /*#__PURE__*/(0, _jsxRuntime.jsx)(Icon, {
           fontSize: "inherit"
         })
-      })
+      }))
     }), cellContent, !hideDescendantCount && filteredDescendantCount > 0 ? /*#__PURE__*/(0, _jsxRuntime.jsxs)("span", {
       style: {
         whiteSpace: 'pre'

package/node/hooks/features/export/serializer/excelSerializer.js

@@ -64,38 +64,39 @@ const serializeRow = (id, columns, api, defaultValueOptionsFormulae) => {
     switch (cellParams.colDef.type) {
       case 'singleSelect':
         {
-          if (typeof cellParams.colDef.valueOptions === 'function') {
+          const castColumn = cellParams.colDef;
+          if (typeof castColumn.valueOptions === 'function') {
             // If value option depends on the row, set specific options to the cell
             // This dataValidation is buggy with LibreOffice and does not allow to have coma
-            const valueOptions = cellParams.colDef.valueOptions({
+            const valueOptions = castColumn.valueOptions({
               id,
               row,
               field: cellParams.field
             });
-            const formattedValueOptions = getFormattedValueOptions(cellParams.colDef, valueOptions, api);
-            dataValidation[column.field] = {
+            const formattedValueOptions = getFormattedValueOptions(castColumn, valueOptions, api);
+            dataValidation[castColumn.field] = {
               type: 'list',
               allowBlank: true,
               formulae: [`"${formattedValueOptions.map(x => x.toString().replaceAll(',', 'CHAR(44)')).join(',')}"`]
             };
           } else {
             // If value option is defined for the column, refer to another sheet
-            dataValidation[column.field] = {
+            dataValidation[castColumn.field] = {
               type: 'list',
               allowBlank: true,
-              formulae: [defaultValueOptionsFormulae[column.field]]
+              formulae: [defaultValueOptionsFormulae[castColumn.field]]
             };
           }
-          const formattedValue = api.getCellParams(id, column.field).formattedValue;
+          const formattedValue = api.getCellParams(id, castColumn.field).formattedValue;
           if (process.env.NODE_ENV !== 'production') {
             if (String(cellParams.formattedValue) === '[object Object]') {
               warnInvalidFormattedValue();
             }
           }
           if ((0, _internals.isObject)(formattedValue)) {
-            row[column.field] = formattedValue?.label;
+            row[castColumn.field] = formattedValue?.label;
           } else {
-            row[column.field] = formattedValue;
+            row[castColumn.field] = formattedValue;
           }
           break;
         }
@@ -240,7 +241,7 @@ async function buildExcel(options, api) {
   if (includeHeaders) {
     worksheet.addRow(columns.map(column => column.headerName ?? column.field));
   }
-  const columnsWithArrayValueOptions = columns.filter(column => column.type === 'singleSelect' && column.valueOptions && typeof column.valueOptions !== 'function');
+  const columnsWithArrayValueOptions = columns.filter(column => (0, _internals.isSingleSelectColDef)(column) && column.valueOptions && typeof column.valueOptions !== 'function');
   const defaultValueOptionsFormulae = {};
   if (columnsWithArrayValueOptions.length) {
     const valueOptionsWorksheet = workbook.addWorksheet(valueOptionsSheetName);

package/node/hooks/features/rowGrouping/createGroupingColDef.js

@@ -9,6 +9,7 @@ var _objectWithoutPropertiesLoose2 = _interopRequireDefault(require("@babel/runt
 var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
 var React = _interopRequireWildcard(require("react"));
 var _xDataGridPro = require("@mui/x-data-grid-pro");
+var _internals = require("@mui/x-data-grid-pro/internals");
 var _GridGroupingColumnFooterCell = require("../../../components/GridGroupingColumnFooterCell");
 var _GridGroupingCriteriaCell = require("../../../components/GridGroupingCriteriaCell");
 var _GridGroupingColumnLeafCell = require("../../../components/GridGroupingColumnLeafCell");
@@ -55,7 +56,7 @@ const getLeafProperties = leafColDef => ({
   headerName: leafColDef.headerName ?? leafColDef.field,
   sortable: leafColDef.sortable,
   filterable: leafColDef.filterable,
-  valueOptions: leafColDef.valueOptions,
+  valueOptions: (0, _internals.isSingleSelectColDef)(leafColDef) ? leafColDef.valueOptions : undefined,
   filterOperators: leafColDef.filterOperators?.map(operator => (0, _extends2.default)({}, operator, {
     getApplyFilterFn: (filterItem, column) => {
       const originalFn = operator.getApplyFilterFn(filterItem, column);
@@ -79,7 +80,7 @@ const getGroupingCriteriaProperties = (groupedByColDef, applyHeaderName) => {
   const properties = {
     sortable: groupedByColDef.sortable,
     filterable: groupedByColDef.filterable,
-    valueOptions: groupedByColDef.valueOptions,
+    valueOptions: (0, _internals.isSingleSelectColDef)(groupedByColDef) ? groupedByColDef.valueOptions : undefined,
     sortComparator: (v1, v2, cellParams1, cellParams2) => {
       // We only want to sort the groups of the current grouping criteria
       if (cellParams1.rowNode.type === 'group' && cellParams1.rowNode.groupingField === groupedByColDef.field && cellParams2.rowNode.type === 'group' && cellParams2.rowNode.groupingField === groupedByColDef.field) {
@@ -135,7 +136,8 @@ const createGroupingColDefForOneGroupingCriteria = ({
       if (params.rowNode.type === 'leaf') {
         if (leafColDef) {
           const leafParams = (0, _extends2.default)({}, params.api.getCellParams(params.id, leafField), {
-            api: params.api
+            api: params.api,
+            hasFocus: params.hasFocus
           });
           if (leafColDef.renderCell) {
             return leafColDef.renderCell(leafParams);
@@ -226,7 +228,8 @@ const createGroupingColDefForAllGroupingCriteria = ({
       if (params.rowNode.type === 'leaf') {
         if (leafColDef) {
           const leafParams = (0, _extends2.default)({}, params.api.getCellParams(params.id, leafField), {
-            api: params.api
+            api: params.api,
+            hasFocus: params.hasFocus
           });
           if (leafColDef.renderCell) {
             return leafColDef.renderCell(leafParams);

package/node/index.js

@@ -1,5 +1,5 @@
 /**
- * @mui/x-data-grid-premium v6.0.0-beta.2
+ * @mui/x-data-grid-premium v6.0.0-beta.4
  *
  * @license MUI X Commercial
  * This source code is licensed under the commercial license found in the

package/node/utils/releaseInfo.js

@@ -6,7 +6,7 @@ Object.defineProperty(exports, "__esModule", {
 exports.getReleaseInfo = void 0;
 var _utils = require("@mui/utils");
 const getReleaseInfo = () => {
-  const releaseInfo = "MTY3NTI5MjQwMDAwMA==";
+  const releaseInfo = "MTY3NjQ5ODQwMDAwMA==";
   if (process.env.NODE_ENV !== 'production') {
     // A simple hack to set the value in the test environment (has no build step).
     // eslint-disable-next-line no-useless-concat

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@mui/x-data-grid-premium",
-  "version": "6.0.0-beta.2",
+  "version": "6.0.0-beta.4",
   "description": "The Premium plan edition of the data grid component (MUI X).",
   "author": "MUI Team",
   "main": "./node/index.js",
@@ -31,11 +31,11 @@
     "directory": "packages/grid/x-data-grid-premium"
   },
   "dependencies": {
-    "@babel/runtime": "^7.20.7",
-    "@mui/utils": "^5.11.2",
-    "@mui/x-data-grid": "6.0.0-beta.2",
-    "@mui/x-data-grid-pro": "6.0.0-beta.2",
-    "@mui/x-license-pro": "6.0.0-beta.0",
+    "@babel/runtime": "^7.20.13",
+    "@mui/utils": "^5.11.7",
+    "@mui/x-data-grid": "6.0.0-beta.4",
+    "@mui/x-data-grid-pro": "6.0.0-beta.4",
+    "@mui/x-license-pro": "6.0.0-beta.4",
     "@types/format-util": "^1.0.2",
     "clsx": "^1.2.1",
     "exceljs": "^4.3.0",

package/utils/releaseInfo.js

@@ -1,6 +1,6 @@
 import { ponyfillGlobal } from '@mui/utils';
 export const getReleaseInfo = () => {
-  const releaseInfo = "MTY3NTI5MjQwMDAwMA==";
+  const releaseInfo = "MTY3NjQ5ODQwMDAwMA==";
   if (process.env.NODE_ENV !== 'production') {
     // A simple hack to set the value in the test environment (has no build step).
     // eslint-disable-next-line no-useless-concat