@mui/x-data-grid 9.11.0 → 9.12.0

package/CHANGELOG.md

@@ -1,5 +1,170 @@
 # Changelog
 
+## 9.12.0
+
+_Aug 21, 2026_
+
+We'd like to extend a big thank you to the 12 contributors who made this release possible. Here are some highlights ✨:
+
+- 🧮 Support [Formulas](https://mui.com/x/react-data-grid/formulas/) on the Data Grid: cells in opted-in columns can hold spreadsheet-like formulas (`=SUM(RANGE(…))`, `=price * quantity`) evaluated by a built-in engine, with a formula editor and [Formula Bar](https://mui.com/x/react-data-grid/components/formula-bar/), autocomplete, reference highlighting, optional A1 notation, fill-handle reference adjustment, custom functions, and live formula Excel export
+- ♿️ Improve the accessibility of Data Grid cells and picker day cells
+- 🗓️ Enable multi-resource event creation and editing in the Scheduler
+- 🐞 Bugfixes
+- 📚 Documentation improvements
+
+Special thanks go out to these community members for their valuable contributions:
+@Anexus5919, @mustafajw07
+
+The following team members contributed to this release:
+@brijeshb42, @flaviendelangle, @JCQuintas, @LukasTy, @MBilalShafi, @michelengelen, @noraleonte, @rita-codes, @romgrk, @silviuaavram
+
+### Data Grid
+
+#### `@mui/x-data-grid@9.12.0`
+
+- [DataGrid] Expose `apiRef` on `GridCallbackDetails` for selector access in callbacks (#22973) @michelengelen
+- [DataGrid] Fix header height not updating when `headerFilters` or `columnGroupingModel` change (#23059) @MBilalShafi
+- [DataGrid] Fix unhandled rejection when unmounting mid-autosize (#23319) @JCQuintas
+- [DataGrid] Label the blank `singleSelect` filter option (#23294) @JCQuintas
+- [DataGrid] Stop sending incomplete filter items to the data source (#23303) @JCQuintas
+- [DataGrid] Support the `rowheader` attribute for grid cells (#23340) @silviuaavram
+
+#### `@mui/x-data-grid-pro@9.12.0` [![pro](https://mui.com/r/x-pro-svg)](https://mui.com/r/x-pro-svg-link 'Pro plan')
+
+Same changes as in `@mui/x-data-grid@9.12.0`, plus:
+
+- [DataGridPro] Honor `hasNextPage` in infinite lazy loading (#23048) @MBilalShafi
+
+#### `@mui/x-data-grid-premium@9.12.0` [![premium](https://mui.com/r/x-premium-svg)](https://mui.com/r/x-premium-svg-link 'Premium plan')
+
+Same changes as in `@mui/x-data-grid-pro@9.12.0`, plus:
+
+- [DataGridPremium] Formula support (#22807) @MBilalShafi
+
+### Date and Time Pickers
+
+#### `@mui/x-date-pickers@9.12.0`
+
+- [fields] Keep the selected section on blank space clicks (#23318) @LukasTy
+- [pickers] Associate the day cells with their week day column header (#23339) @LukasTy
+- [pickers] Keep the `gridcell` role and the column index on filler cells (#23326) @Anexus5919
+
+#### `@mui/x-date-pickers-pro@9.12.0` [![pro](https://mui.com/r/x-pro-svg)](https://mui.com/r/x-pro-svg-link 'Pro plan')
+
+Same changes as in `@mui/x-date-pickers@9.12.0`, plus:
+
+- [DateRangeCalendar] Round the range highlight at the month grid edges (#23297) @JCQuintas
+- [DateRangePicker] Keep the range highlight opaque for disabled days (#23317) @JCQuintas
+
+### Charts
+
+#### `@mui/x-charts@9.12.0`
+
+- [charts] Add a demo for label on grid row (#23333) @noraleonte
+- [charts] Fix React 18 `propTypes` warnings and stray-pointer test flakiness (#23384) @LukasTy
+- [charts] Focus the clicked item for keyboard navigation (#23247) @JCQuintas
+
+#### `@mui/x-charts-pro@9.12.0` [![pro](https://mui.com/r/x-pro-svg)](https://mui.com/r/x-pro-svg-link 'Pro plan')
+
+Same changes as in `@mui/x-charts@9.12.0`.
+
+#### `@mui/x-charts-premium@9.12.0` [![premium](https://mui.com/r/x-premium-svg)](https://mui.com/r/x-premium-svg-link 'Premium plan')
+
+Same changes as in `@mui/x-charts-pro@9.12.0`, plus:
+
+- [charts-premium] Add `onItemClick` to the radial charts (#23253) @JCQuintas
+
+### Tree View
+
+#### `@mui/x-tree-view@9.12.0`
+
+Internal changes.
+
+#### `@mui/x-tree-view-pro@9.12.0` [![pro](https://mui.com/r/x-pro-svg)](https://mui.com/r/x-pro-svg-link 'Pro plan')
+
+Same changes as in `@mui/x-tree-view@9.12.0`.
+
+### Scheduler
+
+#### `@mui/x-scheduler@9.0.0-beta.10`
+
+- [scheduler] Add `onEventEditingStart` to let consumers open their own edit UI (#23361) @rita-codes
+- [scheduler] Fix keyboard and focus issues around the "+N more" popover (#23312) @rita-codes
+- [scheduler] Honor `viewConfig` hour limits in the compact day and week views (#23316) @rita-codes
+- [scheduler] Share timeline event layout data (#23366) @flaviendelangle
+- [scheduler] enable multi-resource event creation and editing (#23313) @mustafajw07
+
+#### `@mui/x-scheduler-premium@9.0.0-beta.10` [![premium](https://mui.com/r/x-premium-svg)](https://mui.com/r/x-premium-svg-link 'Premium plan')
+
+Same changes as in `@mui/x-scheduler@9.0.0-beta.10`, plus:
+
+- [scheduler-premium] Allow to control the min and max hour in the Event Timeline (#23212) @rita-codes
+- [scheduler-premium] Dependencies - Create, select and delete via terminals (#23200) @rita-codes
+
+### Codemod
+
+#### `@mui/x-codemod@9.12.0`
+
+Internal changes.
+
+### Docs
+
+- [docs][charts] Document line mark size customization (#23370) @JCQuintas
+- [docs] Add recipe for constraining the `make-child` drop action by item type (#22940) @michelengelen
+- [docs] Redirect the renamed Event Timeline views page (#23324) @brijeshb42
+- [docs] Remove unused `adapter-dependencies.json` (#23328) @LukasTy
+
+### Core
+
+- [code-infra] Add release skill (#23308) @brijeshb42
+- [code-infra] Fix changelog categorization of docs and `DateRangeCalendar` tags (#23385) @JCQuintas
+- [code-infra] Sync mui-release skill (#23330) @brijeshb42
+
+### Miscellaneous
+
+- [core] Declare the missing `react-dom` peer dependencies (#23381) @LukasTy
+- [test] Fix act warnings in the data source filter tests (#23360) @JCQuintas
+- [virtualizer] Add inverse-sticky layout (#23053) @romgrk
+
+## 9.11.1
+
+_Aug 6, 2026_
+
+We'd like to extend a big thank you to the 2 contributors who made this release possible. Here are some highlights ✨:
+
+- 🐛 Fix the empty `@mui/x-charts-vendor` package published in v9.11.0
+
+The following team members contributed to this release:
+@JCQuintas, @rita-codes
+
+### Charts
+
+#### `@mui/x-charts@9.11.1`
+
+- [charts] Fix empty `@mui/x-charts-vendor` published package (#23310) @JCQuintas
+
+#### `@mui/x-charts-pro@9.11.1` [![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.11.1`.
+
+#### `@mui/x-charts-premium@9.11.1` [![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.11.1`.
+
+#### `@mui/x-charts-vendor@9.11.1`
+
+- [charts] Fix empty `@mui/x-charts-vendor` published package (#23310) @JCQuintas
+
+### Scheduler
+
+#### `@mui/x-scheduler@9.0.0-beta.9`
+
+- [scheduler] Show the range validation errors on the End date and End time fields (#23291) @rita-codes
+
+#### `@mui/x-scheduler-premium@9.0.0-beta.9` [![premium](https://mui.com/r/x-premium-svg)](https://mui.com/r/x-premium-svg-link 'Premium plan')
+
+Same changes as in `@mui/x-scheduler@9.0.0-beta.9`.
+
 ## 9.11.0
 
 _Aug 6, 2026_

package/DataGrid/DataGrid.js

@@ -33,7 +33,8 @@ const configuration = {
     useGridParamsOverridableMethods: _useGridParamsOverridableMethods.useGridParamsOverridableMethods,
     useIsCellEditable: _useGridCellEditable.useIsCellEditable,
     useCellAggregationResult: () => null,
-    useFilterValueGetter: apiRef => apiRef.current.getRowValue
+    useFilterValueGetter: apiRef => apiRef.current.getRowValue,
+    useColumnHeaderAdornment: () => null
   }
 };
 const DataGridRaw = function DataGrid(inProps, ref) {
@@ -166,6 +167,7 @@ process.env.NODE_ENV !== "production" ? DataGridRaw.propTypes /* remove-proptype
     renderEditCell: _propTypes.default.func,
     renderHeader: _propTypes.default.func,
     resizable: _propTypes.default.bool,
+    rowHeader: _propTypes.default.bool,
     rowSpanValueGetter: _propTypes.default.func,
     sortable: _propTypes.default.bool,
     sortComparator: _propTypes.default.func,

package/DataGrid/DataGrid.mjs

@@ -26,7 +26,8 @@ const configuration = {
     useGridParamsOverridableMethods,
     useIsCellEditable,
     useCellAggregationResult: () => null,
-    useFilterValueGetter: apiRef => apiRef.current.getRowValue
+    useFilterValueGetter: apiRef => apiRef.current.getRowValue,
+    useColumnHeaderAdornment: () => null
   }
 };
 const DataGridRaw = function DataGrid(inProps, ref) {
@@ -159,6 +160,7 @@ process.env.NODE_ENV !== "production" ? DataGridRaw.propTypes /* remove-proptype
     renderEditCell: PropTypes.func,
     renderHeader: PropTypes.func,
     resizable: PropTypes.bool,
+    rowHeader: PropTypes.bool,
     rowSpanValueGetter: PropTypes.func,
     sortable: PropTypes.bool,
     sortComparator: PropTypes.func,

package/DataGrid/useDataGridProps.d.mts

@@ -1,3 +1,3 @@
 import type { DataGridProcessedProps, DataGridProps } from "../models/props/DataGridProps.mjs";
 import type { GridValidRowModel } from "../models/index.mjs";
-export declare const useDataGridProps: <R extends GridValidRowModel>(inProps: DataGridProps<R>) => DataGridProcessedProps<R>;
+export declare const useDataGridProps: <R extends GridValidRowModel>(inProps: DataGridProps<R>) => DataGridProcessedProps<R, any>;

package/DataGrid/useDataGridProps.d.ts

@@ -1,3 +1,3 @@
 import type { DataGridProcessedProps, DataGridProps } from "../models/props/DataGridProps.js";
 import type { GridValidRowModel } from "../models/index.js";
-export declare const useDataGridProps: <R extends GridValidRowModel>(inProps: DataGridProps<R>) => DataGridProcessedProps<R>;
+export declare const useDataGridProps: <R extends GridValidRowModel>(inProps: DataGridProps<R>) => DataGridProcessedProps<R, any>;

package/components/cell/GridCell.js

@@ -231,6 +231,19 @@ const GridCell = (0, _forwardRef.forwardRef)(function GridCell(props, ref) {
     }
     const doc = (0, _ownerDocument.default)(apiRef.current.rootElementRef.current);
     if (cellRef.current && !cellRef.current.contains(doc.activeElement)) {
+      // An external editor can legitimately hold DOM focus for the focused cell
+      // (e.g. the Premium formula bar) — the same pipe the document click
+      // handler consults decides whether pulling focus back is allowed. The
+      // pseudo-event only carries the element that owns the focus.
+      const canUpdateFocus = apiRef.current.unstable_applyPipeProcessors('canUpdateFocus', true, {
+        event: {
+          target: doc.activeElement
+        },
+        cell: null
+      });
+      if (!canUpdateFocus) {
+        return;
+      }
       const focusableElement = cellRef.current.querySelector('[tabindex="0"]');
       const elementToFocus = focusableElement || cellRef.current;
       (0, _focusElement.focusElement)(elementToFocus, apiRef);
@@ -291,7 +304,7 @@ const GridCell = (0, _forwardRef.forwardRef)(function GridCell(props, ref) {
   };
   return /*#__PURE__*/(0, _jsxRuntime.jsx)("div", (0, _extends2.default)({
     className: (0, _clsx.default)(classes.root, classNames, className),
-    role: "gridcell",
+    role: column.rowHeader ? 'rowheader' : 'gridcell',
     "data-field": field,
     "data-colindex": colIndex,
     "aria-colindex": colIndex + 1,

package/components/cell/GridCell.mjs

@@ -224,6 +224,19 @@ const GridCell = forwardRef(function GridCell(props, ref) {
     }
     const doc = ownerDocument(apiRef.current.rootElementRef.current);
     if (cellRef.current && !cellRef.current.contains(doc.activeElement)) {
+      // An external editor can legitimately hold DOM focus for the focused cell
+      // (e.g. the Premium formula bar) — the same pipe the document click
+      // handler consults decides whether pulling focus back is allowed. The
+      // pseudo-event only carries the element that owns the focus.
+      const canUpdateFocus = apiRef.current.unstable_applyPipeProcessors('canUpdateFocus', true, {
+        event: {
+          target: doc.activeElement
+        },
+        cell: null
+      });
+      if (!canUpdateFocus) {
+        return;
+      }
       const focusableElement = cellRef.current.querySelector('[tabindex="0"]');
       const elementToFocus = focusableElement || cellRef.current;
       focusElement(elementToFocus, apiRef);
@@ -284,7 +297,7 @@ const GridCell = forwardRef(function GridCell(props, ref) {
   };
   return /*#__PURE__*/_jsx("div", _extends({
     className: clsx(classes.root, classNames, className),
-    role: "gridcell",
+    role: column.rowHeader ? 'rowheader' : 'gridcell',
     "data-field": field,
     "data-colindex": colIndex,
     "aria-colindex": colIndex + 1,

package/components/columnHeaders/GridBaseColumnHeaders.js

@@ -47,7 +47,7 @@ const GridBaseColumnHeaders = exports.GridBaseColumnHeaders = (0, _forwardRef.fo
     className: (0, _clsx.default)(classes.root, className),
     ownerState: rootProps
   }, other, {
-    role: "none",
+    role: "rowgroup",
     ref: ref
   }));
 });

package/components/columnHeaders/GridBaseColumnHeaders.mjs

@@ -40,7 +40,7 @@ export const GridBaseColumnHeaders = forwardRef(function GridColumnHeaders(props
     className: clsx(classes.root, className),
     ownerState: rootProps
   }, other, {
-    role: "none",
+    role: "rowgroup",
     ref: ref
   }));
 });

package/components/columnHeaders/GridColumnHeaderItem.js

@@ -18,6 +18,7 @@ var _fastMemo = require("@mui/x-internals/fastMemo");
 var _RtlProvider = require("@mui/system/RtlProvider");
 var _focusElement = require("../../utils/focusElement");
 var _useGridPrivateApiContext = require("../../hooks/utils/useGridPrivateApiContext");
+var _useGridConfiguration = require("../../hooks/utils/useGridConfiguration");
 var _getColumnMenuItemKeys = require("../../hooks/features/columnMenu/getColumnMenuItemKeys");
 var _ColumnHeaderMenuIcon = require("./ColumnHeaderMenuIcon");
 var _GridColumnHeaderMenu = require("../menu/columnMenu/GridColumnHeaderMenu");
@@ -81,8 +82,10 @@ function GridColumnHeaderItem(props) {
     pinnedOffset
   } = props;
   const apiRef = (0, _useGridPrivateApiContext.useGridPrivateApiContext)();
+  const configuration = (0, _useGridConfiguration.useGridConfiguration)();
   const rootProps = (0, _useGridRootProps.useGridRootProps)();
   const isRtl = (0, _RtlProvider.useRtl)();
+  const adornment = configuration.hooks.useColumnHeaderAdornment(colDef.field);
   const headerCellRef = React.useRef(null);
   const columnMenuId = (0, _useId.default)();
   const columnMenuButtonId = (0, _useId.default)();
@@ -232,6 +235,7 @@ function GridColumnHeaderItem(props) {
     separatorSide: separatorSide,
     isDraggable: isDraggable,
     headerComponent: headerComponent,
+    adornment: adornment,
     description: colDef.description,
     elementId: colDef.field,
     width: colDef.computedWidth,

package/components/columnHeaders/GridColumnHeaderItem.mjs

@@ -11,6 +11,7 @@ import { fastMemo } from '@mui/x-internals/fastMemo';
 import { useRtl } from '@mui/system/RtlProvider';
 import { focusElement } from "../../utils/focusElement.mjs";
 import { useGridPrivateApiContext } from "../../hooks/utils/useGridPrivateApiContext.mjs";
+import { useGridConfiguration } from "../../hooks/utils/useGridConfiguration.mjs";
 import { getColumnMenuItemKeys } from "../../hooks/features/columnMenu/getColumnMenuItemKeys.mjs";
 import { ColumnHeaderMenuIcon } from "./ColumnHeaderMenuIcon.mjs";
 import { GridColumnHeaderMenu } from "../menu/columnMenu/GridColumnHeaderMenu.mjs";
@@ -74,8 +75,10 @@ function GridColumnHeaderItem(props) {
     pinnedOffset
   } = props;
   const apiRef = useGridPrivateApiContext();
+  const configuration = useGridConfiguration();
   const rootProps = useGridRootProps();
   const isRtl = useRtl();
+  const adornment = configuration.hooks.useColumnHeaderAdornment(colDef.field);
   const headerCellRef = React.useRef(null);
   const columnMenuId = useId();
   const columnMenuButtonId = useId();
@@ -225,6 +228,7 @@ function GridColumnHeaderItem(props) {
     separatorSide: separatorSide,
     isDraggable: isDraggable,
     headerComponent: headerComponent,
+    adornment: adornment,
     description: colDef.description,
     elementId: colDef.field,
     width: colDef.computedWidth,

package/components/columnHeaders/GridGenericColumnHeaderItem.d.mts

@@ -23,6 +23,13 @@ interface GridGenericColumnHeaderItemProps extends Pick<GridStateColDef, 'header
   columnMenuIconButton?: React.ReactNode;
   columnMenu?: React.ReactNode;
   columnTitleIconButtons?: React.ReactNode;
+  /**
+   * Optional adornment rendered at the start of the title content, before the
+   * title label (used by the Premium formula feature for A1 column letters).
+   * Placing it inside the (non-reversed) title content keeps it on the same
+   * side of the title for both left- and right-aligned headers.
+   */
+  adornment?: React.ReactNode;
   label: string;
   draggableContainerProps?: Partial<React.HTMLProps<HTMLDivElement>>;
   columnHeaderSeparatorProps?: Partial<GridColumnHeaderSeparatorProps>;

package/components/columnHeaders/GridGenericColumnHeaderItem.d.ts

@@ -23,6 +23,13 @@ interface GridGenericColumnHeaderItemProps extends Pick<GridStateColDef, 'header
   columnMenuIconButton?: React.ReactNode;
   columnMenu?: React.ReactNode;
   columnTitleIconButtons?: React.ReactNode;
+  /**
+   * Optional adornment rendered at the start of the title content, before the
+   * title label (used by the Premium formula feature for A1 column letters).
+   * Placing it inside the (non-reversed) title content keeps it on the same
+   * side of the title for both left- and right-aligned headers.
+   */
+  adornment?: React.ReactNode;
   label: string;
   draggableContainerProps?: Partial<React.HTMLProps<HTMLDivElement>>;
   columnHeaderSeparatorProps?: Partial<GridColumnHeaderSeparatorProps>;

package/components/columnHeaders/GridGenericColumnHeaderItem.js

@@ -17,7 +17,7 @@ var _GridColumnHeaderTitle = require("./GridColumnHeaderTitle");
 var _GridColumnHeaderSeparator = require("./GridColumnHeaderSeparator");
 var _useGridRootProps = require("../../hooks/utils/useGridRootProps");
 var _jsxRuntime = require("react/jsx-runtime");
-const _excluded = ["classes", "columnMenuOpen", "colIndex", "height", "isResizing", "sortDirection", "hasFocus", "tabIndex", "separatorSide", "isDraggable", "headerComponent", "description", "elementId", "width", "columnMenuIconButton", "columnMenu", "columnTitleIconButtons", "headerClassName", "label", "resizable", "draggableContainerProps", "columnHeaderSeparatorProps", "style"];
+const _excluded = ["classes", "columnMenuOpen", "colIndex", "height", "isResizing", "sortDirection", "hasFocus", "tabIndex", "separatorSide", "isDraggable", "headerComponent", "description", "elementId", "width", "columnMenuIconButton", "columnMenu", "columnTitleIconButtons", "adornment", "headerClassName", "label", "resizable", "draggableContainerProps", "columnHeaderSeparatorProps", "style"];
 const GridGenericColumnHeaderItem = exports.GridGenericColumnHeaderItem = (0, _forwardRef.forwardRef)(function GridGenericColumnHeaderItem(props, ref) {
   const {
       classes,
@@ -34,6 +34,7 @@ const GridGenericColumnHeaderItem = exports.GridGenericColumnHeaderItem = (0, _f
       columnMenuIconButton = null,
       columnMenu = null,
       columnTitleIconButtons = null,
+      adornment = null,
       headerClassName,
       label,
       resizable,
@@ -68,13 +69,13 @@ const GridGenericColumnHeaderItem = exports.GridGenericColumnHeaderItem = (0, _f
       children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
         className: classes.titleContainer,
         role: "none",
-        children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+        children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
           className: classes.titleContainerContent,
-          children: headerComponent !== undefined ? headerComponent : /*#__PURE__*/(0, _jsxRuntime.jsx)(_GridColumnHeaderTitle.GridColumnHeaderTitle, {
+          children: [adornment, headerComponent !== undefined ? headerComponent : /*#__PURE__*/(0, _jsxRuntime.jsx)(_GridColumnHeaderTitle.GridColumnHeaderTitle, {
             label: label,
             description: description,
             columnWidth: width
-          })
+          })]
         }), columnTitleIconButtons]
       }), columnMenuIconButton]
     })), /*#__PURE__*/(0, _jsxRuntime.jsx)(_GridColumnHeaderSeparator.GridColumnHeaderSeparator, (0, _extends2.default)({

package/components/columnHeaders/GridGenericColumnHeaderItem.mjs

@@ -2,7 +2,7 @@
 
 import _extends from "@babel/runtime/helpers/esm/extends";
 import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
-const _excluded = ["classes", "columnMenuOpen", "colIndex", "height", "isResizing", "sortDirection", "hasFocus", "tabIndex", "separatorSide", "isDraggable", "headerComponent", "description", "elementId", "width", "columnMenuIconButton", "columnMenu", "columnTitleIconButtons", "headerClassName", "label", "resizable", "draggableContainerProps", "columnHeaderSeparatorProps", "style"];
+const _excluded = ["classes", "columnMenuOpen", "colIndex", "height", "isResizing", "sortDirection", "hasFocus", "tabIndex", "separatorSide", "isDraggable", "headerComponent", "description", "elementId", "width", "columnMenuIconButton", "columnMenu", "columnTitleIconButtons", "adornment", "headerClassName", "label", "resizable", "draggableContainerProps", "columnHeaderSeparatorProps", "style"];
 import * as React from 'react';
 import clsx from 'clsx';
 import useForkRef from '@mui/utils/useForkRef';
@@ -27,6 +27,7 @@ const GridGenericColumnHeaderItem = forwardRef(function GridGenericColumnHeaderI
       columnMenuIconButton = null,
       columnMenu = null,
       columnTitleIconButtons = null,
+      adornment = null,
       headerClassName,
       label,
       resizable,
@@ -61,13 +62,13 @@ const GridGenericColumnHeaderItem = forwardRef(function GridGenericColumnHeaderI
       children: [/*#__PURE__*/_jsxs("div", {
         className: classes.titleContainer,
         role: "none",
-        children: [/*#__PURE__*/_jsx("div", {
+        children: [/*#__PURE__*/_jsxs("div", {
           className: classes.titleContainerContent,
-          children: headerComponent !== undefined ? headerComponent : /*#__PURE__*/_jsx(GridColumnHeaderTitle, {
+          children: [adornment, headerComponent !== undefined ? headerComponent : /*#__PURE__*/_jsx(GridColumnHeaderTitle, {
             label: label,
             description: description,
             columnWidth: width
-          })
+          })]
         }), columnTitleIconButtons]
       }), columnMenuIconButton]
     })), /*#__PURE__*/_jsx(GridColumnHeaderSeparator, _extends({

package/components/panel/filterPanel/GridFilterInputSingleSelect.js

@@ -23,12 +23,23 @@ const renderSingleSelectOptions = ({
   getOptionLabel,
   getOptionValue,
   isSelectNative,
-  baseSelectOptionProps
+  baseSelectOptionProps,
+  blankOptionLabel
 }) => {
-  const iterableColumnValues = ['', ...((0, _filterPanelUtils.getValueOptions)(column) || [])];
-  return iterableColumnValues.map(option => {
-    const value = getOptionValue(option);
-    let label = getOptionLabel(option);
+  const valueOptions = (0, _filterPanelUtils.getValueOptions)(column) || [];
+
+  // A column that declares its own blank entry already offers a way to reset the filter.
+  // Prepending another one would render two options sharing the same `''` key.
+  const declaresBlankOption = valueOptions.some(option => {
+    const optionValue = getOptionValue(option);
+    return optionValue === '' || optionValue === null || optionValue === undefined;
+  });
+  const iterableColumnValues = declaresBlankOption ? valueOptions : ['', ...valueOptions];
+  return iterableColumnValues.map((option, index) => {
+    // The prepended entry is ours, not a value option, so it skips the column accessors.
+    const isBlankOption = !declaresBlankOption && index === 0;
+    const value = isBlankOption ? '' : getOptionValue(option);
+    let label = isBlankOption ? blankOptionLabel : getOptionLabel(option);
     if (label === '') {
       label = ' '; // To force the height of the empty option
     }
@@ -98,7 +109,8 @@ function GridFilterInputSingleSelect(props) {
         getOptionLabel,
         getOptionValue,
         isSelectNative,
-        baseSelectOptionProps: rootProps.slotProps?.baseSelectOption
+        baseSelectOptionProps: rootProps.slotProps?.baseSelectOption,
+        blankOptionLabel: apiRef.current.getLocaleText('filterValueAny')
       })
     })), headerFilterMenu, clearButton]
   });

package/components/panel/filterPanel/GridFilterInputSingleSelect.mjs

@@ -15,12 +15,23 @@ const renderSingleSelectOptions = ({
   getOptionLabel,
   getOptionValue,
   isSelectNative,
-  baseSelectOptionProps
+  baseSelectOptionProps,
+  blankOptionLabel
 }) => {
-  const iterableColumnValues = ['', ...(getValueOptions(column) || [])];
-  return iterableColumnValues.map(option => {
-    const value = getOptionValue(option);
-    let label = getOptionLabel(option);
+  const valueOptions = getValueOptions(column) || [];
+
+  // A column that declares its own blank entry already offers a way to reset the filter.
+  // Prepending another one would render two options sharing the same `''` key.
+  const declaresBlankOption = valueOptions.some(option => {
+    const optionValue = getOptionValue(option);
+    return optionValue === '' || optionValue === null || optionValue === undefined;
+  });
+  const iterableColumnValues = declaresBlankOption ? valueOptions : ['', ...valueOptions];
+  return iterableColumnValues.map((option, index) => {
+    // The prepended entry is ours, not a value option, so it skips the column accessors.
+    const isBlankOption = !declaresBlankOption && index === 0;
+    const value = isBlankOption ? '' : getOptionValue(option);
+    let label = isBlankOption ? blankOptionLabel : getOptionLabel(option);
     if (label === '') {
       label = ' '; // To force the height of the empty option
     }
@@ -90,7 +101,8 @@ function GridFilterInputSingleSelect(props) {
         getOptionLabel,
         getOptionValue,
         isSelectNative,
-        baseSelectOptionProps: rootProps.slotProps?.baseSelectOption
+        baseSelectOptionProps: rootProps.slotProps?.baseSelectOption,
+        blankOptionLabel: apiRef.current.getLocaleText('filterValueAny')
       })
     })), headerFilterMenu, clearButton]
   });

package/constants/gridClasses.d.mts

@@ -83,6 +83,18 @@ export interface GridClasses {
    * Styles applied to the aggregation row overlay wrapper.
    */
   aggregationRowOverlayWrapper: string;
+  /**
+   * Styles applied to the A1-notation column-letter adornment in the column header (Premium formulas).
+   */
+  formulaColumnHeaderLetter: string;
+  /**
+   * Styles applied to the cells of the A1-notation row-number column (Premium formulas).
+   */
+  formulaRowNumberCell: string;
+  /**
+   * Styles applied to the formula bar root element (Premium formulas).
+   */
+  formulaBar: string;
   /**
    * Styles applied to the root element if `autoHeight={true}`.
    */

package/constants/gridClasses.d.ts

@@ -83,6 +83,18 @@ export interface GridClasses {
    * Styles applied to the aggregation row overlay wrapper.
    */
   aggregationRowOverlayWrapper: string;
+  /**
+   * Styles applied to the A1-notation column-letter adornment in the column header (Premium formulas).
+   */
+  formulaColumnHeaderLetter: string;
+  /**
+   * Styles applied to the cells of the A1-notation row-number column (Premium formulas).
+   */
+  formulaRowNumberCell: string;
+  /**
+   * Styles applied to the formula bar root element (Premium formulas).
+   */
+  formulaBar: string;
   /**
    * Styles applied to the root element if `autoHeight={true}`.
    */

package/constants/gridClasses.js

@@ -30,4 +30,4 @@ const gridClassesOverrides = exports.gridClassesOverrides = {
   // 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', 'contentFiller', 'detailPanel', 'footerCell', 'panel', 'panelHeader', 'panelWrapper', 'panelContent', 'panelFooter', 'paper', 'editInputCell', 'longTextCell', 'longTextCellContent', 'longTextCellExpandButton', 'longTextCellCollapseButton', 'longTextCellPopup', 'longTextCellPopperContent', 'editLongTextCell', 'editLongTextCellValue', 'editLongTextCellPopup', 'editLongTextCellPopperContent', 'editLongTextCellTextarea', 'multiSelectCell', 'multiSelectCellChip', 'multiSelectCellChip--hidden', 'multiSelectCellOverflow', 'multiSelectCellPopup', 'multiSelectCellPopperContent', 'editMultiSelectCell', 'editMultiSelectCellChip', 'editMultiSelectCellChip--hidden', 'editMultiSelectCellOverflow', 'editMultiSelectCellPopup', 'editMultiSelectCellPopperContent', 'filler', 'filterForm', 'filterFormDeleteIcon', 'filterFormLogicOperatorInput', 'filterFormColumnInput', 'filterFormOperatorInput', 'filterFormValueInput', 'filler--horizontal', 'footerContainer', 'iconButtonContainer', 'main', 'main--hasPinnedRight', 'main--hiddenContent', 'menu', 'overlay', 'overlayWrapper', 'root', 'virtualizer--layoutControlled', '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']);
+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', 'formulaColumnHeaderLetter', 'formulaRowNumberCell', 'formulaBar', 'mainContent', 'withSidePanel', 'collapsible', 'collapsibleTrigger', 'collapsibleIcon', 'collapsiblePanel', 'columnHeader--filter', 'columnHeaderFilterInput', 'columnHeaderFilterOperatorLabel', 'columnHeaderTitle', 'columnHeaders', 'columnsManagement', 'columnsManagementRow', 'columnsManagementHeader', 'columnsManagementSearchInput', 'columnsManagementFooter', 'columnsManagementScrollArea', 'columnsManagementEmptyText', 'contentFiller', 'detailPanel', 'footerCell', 'panel', 'panelHeader', 'panelWrapper', 'panelContent', 'panelFooter', 'paper', 'editInputCell', 'longTextCell', 'longTextCellContent', 'longTextCellExpandButton', 'longTextCellCollapseButton', 'longTextCellPopup', 'longTextCellPopperContent', 'editLongTextCell', 'editLongTextCellValue', 'editLongTextCellPopup', 'editLongTextCellPopperContent', 'editLongTextCellTextarea', 'multiSelectCell', 'multiSelectCellChip', 'multiSelectCellChip--hidden', 'multiSelectCellOverflow', 'multiSelectCellPopup', 'multiSelectCellPopperContent', 'editMultiSelectCell', 'editMultiSelectCellChip', 'editMultiSelectCellChip--hidden', 'editMultiSelectCellOverflow', 'editMultiSelectCellPopup', 'editMultiSelectCellPopperContent', 'filler', 'filterForm', 'filterFormDeleteIcon', 'filterFormLogicOperatorInput', 'filterFormColumnInput', 'filterFormOperatorInput', 'filterFormValueInput', 'filler--horizontal', 'footerContainer', 'iconButtonContainer', 'main', 'main--hasPinnedRight', 'main--hiddenContent', 'menu', 'overlay', 'overlayWrapper', 'root', 'virtualizer--layoutControlled', '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

@@ -22,4 +22,4 @@ export const gridClassesOverrides = {
   // 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', 'contentFiller', 'detailPanel', 'footerCell', 'panel', 'panelHeader', 'panelWrapper', 'panelContent', 'panelFooter', 'paper', 'editInputCell', 'longTextCell', 'longTextCellContent', 'longTextCellExpandButton', 'longTextCellCollapseButton', 'longTextCellPopup', 'longTextCellPopperContent', 'editLongTextCell', 'editLongTextCellValue', 'editLongTextCellPopup', 'editLongTextCellPopperContent', 'editLongTextCellTextarea', 'multiSelectCell', 'multiSelectCellChip', 'multiSelectCellChip--hidden', 'multiSelectCellOverflow', 'multiSelectCellPopup', 'multiSelectCellPopperContent', 'editMultiSelectCell', 'editMultiSelectCellChip', 'editMultiSelectCellChip--hidden', 'editMultiSelectCellOverflow', 'editMultiSelectCellPopup', 'editMultiSelectCellPopperContent', 'filler', 'filterForm', 'filterFormDeleteIcon', 'filterFormLogicOperatorInput', 'filterFormColumnInput', 'filterFormOperatorInput', 'filterFormValueInput', 'filler--horizontal', 'footerContainer', 'iconButtonContainer', 'main', 'main--hasPinnedRight', 'main--hiddenContent', 'menu', 'overlay', 'overlayWrapper', 'root', 'virtualizer--layoutControlled', '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']);
+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', 'formulaColumnHeaderLetter', 'formulaRowNumberCell', 'formulaBar', 'mainContent', 'withSidePanel', 'collapsible', 'collapsibleTrigger', 'collapsibleIcon', 'collapsiblePanel', 'columnHeader--filter', 'columnHeaderFilterInput', 'columnHeaderFilterOperatorLabel', 'columnHeaderTitle', 'columnHeaders', 'columnsManagement', 'columnsManagementRow', 'columnsManagementHeader', 'columnsManagementSearchInput', 'columnsManagementFooter', 'columnsManagementScrollArea', 'columnsManagementEmptyText', 'contentFiller', 'detailPanel', 'footerCell', 'panel', 'panelHeader', 'panelWrapper', 'panelContent', 'panelFooter', 'paper', 'editInputCell', 'longTextCell', 'longTextCellContent', 'longTextCellExpandButton', 'longTextCellCollapseButton', 'longTextCellPopup', 'longTextCellPopperContent', 'editLongTextCell', 'editLongTextCellValue', 'editLongTextCellPopup', 'editLongTextCellPopperContent', 'editLongTextCellTextarea', 'multiSelectCell', 'multiSelectCellChip', 'multiSelectCellChip--hidden', 'multiSelectCellOverflow', 'multiSelectCellPopup', 'multiSelectCellPopperContent', 'editMultiSelectCell', 'editMultiSelectCellChip', 'editMultiSelectCellChip--hidden', 'editMultiSelectCellOverflow', 'editMultiSelectCellPopup', 'editMultiSelectCellPopperContent', 'filler', 'filterForm', 'filterFormDeleteIcon', 'filterFormLogicOperatorInput', 'filterFormColumnInput', 'filterFormOperatorInput', 'filterFormValueInput', 'filler--horizontal', 'footerContainer', 'iconButtonContainer', 'main', 'main--hasPinnedRight', 'main--hiddenContent', 'menu', 'overlay', 'overlayWrapper', 'root', 'virtualizer--layoutControlled', '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']);