@mui/x-data-grid-premium 8.9.1 → 8.10.0

package/CHANGELOG.md

@@ -5,6 +5,215 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## 8.10.0
+
+_Aug 8, 2025_
+
+We'd like to extend a big thank you to the 17 contributors who made this release possible. Here are some highlights ✨:
+
+- 📊 [`FunnelChart`](https://mui.com/x/react-charts/funnel/) marked as stable
+- 📈 [Zoom slider](https://mui.com/x/react-charts/zoom-and-pan/#zoom-slider) and [Preview](https://mui.com/x/react-charts/zoom-and-pan/#preview) marked as stable
+- 📈 Supporting [label groups](https://mui.com/x/react-charts/axis/#grouped-axes) in band and point axis
+- 🌎 Improve Norwegian Nynorsk (nn-NO) locale on the Data Grid
+- 🐞 Bugfixes
+- 📚 Documentation improvements
+
+Special thanks go out to the community members for their valuable contributions:
+@AnderzL7, @aqeelat, @dwrth, @noobyogi0010, @nusr, @sai6855
+
+The following are all team members who have contributed to this release:
+@arminmeh, @bernardobelchior, @cherniavskii, @flaviendelangle, @Janpot, @JCQuintas, @mapache-salvaje, @MBilalShafi, @oliviertassinari, @rita-codes, @romgrk
+
+### Data Grid
+
+#### `@mui/x-data-grid@8.10.0`
+
+- [DataGrid] Move spread operator in `BaseSelect` to allow `variant` change (#19026) @dwrth
+- [DataGrid] Use `use-sync-external-store` shim (#19063) @romgrk
+- [DataGrid] Allow skipping cache in `dataSource.fetchRows()` API method (#18904) @MBilalShafi
+- [DataGrid] Do not call `preProcessEditCellProps()` if cell is not editable based on `isCellEditable()` (#18405) @nusr
+- [DataGrid] Fix `renderCountry` throwing an error when used in tree data (#19068) @cherniavskii
+- [DataGrid] Fix performance issue for root level "select all" (#19015) @MBilalShafi
+- [DataGrid] Fix pagination `slotProps` being ignored by the grid (#19095) @romgrk
+- [l10n] Improve Norwegian Nynorsk (nn-NO) locale (#19076) @AnderzL7
+
+#### `@mui/x-data-grid-pro@8.10.0` [![pro](https://mui.com/r/x-pro-svg)](https://mui.com/r/x-pro-svg-link 'Pro plan')
+
+Same changes as in `@mui/x-data-grid@8.10.0`, plus:
+
+- [DataGridPro] Fix row reorder not working with column reorder disabled (#19016) @MBilalShafi
+- [DataGridPro] Fix header filters cache sharing issue (#19090) @MBilalShafi
+
+#### `@mui/x-data-grid-premium@8.10.0` [![premium](https://mui.com/r/x-premium-svg)](https://mui.com/r/x-premium-svg-link 'Premium plan')
+
+Same changes as in `@mui/x-data-grid-pro@8.10.0`, plus:
+
+- [DataGridPremium] Allow additional derived columns customization via `valueFormatter` (#18982) @arminmeh
+- [DataGridPremium] Fix complex `singleSelect` columns not working in pivot model (#18971) @cherniavskii
+
+### Date and Time Pickers
+
+#### `@mui/x-date-pickers@8.10.0`
+
+- [pickers] `MuiPickersLayout-toolbar` is overlapping the Calendar in RTL `MobileDatePicker` variant (#18981) @rita-codes
+
+#### `@mui/x-date-pickers-pro@8.10.0` [![pro](https://mui.com/r/x-pro-svg)](https://mui.com/r/x-pro-svg-link 'Pro plan')
+
+Same changes as in `@mui/x-date-pickers@8.10.0`.
+
+### Charts
+
+#### `@mui/x-charts@8.10.0`
+
+- [charts] Add `groups` to `band` and `point` axis config (#18766) @JCQuintas
+- [charts] Animation example using `motion` library (#18993) @JCQuintas
+- [charts] Deprecate `Unstable_` radar exports (#19079) @JCQuintas
+- [charts] Improve grouped axis logic (#19069) @JCQuintas
+- [charts] Fix type assertion in axis highlight components (#19060) @sai6855
+- [charts] Remove unnecessary type assertion in tooltip `valueFormatter` in heatmap (#19047) @sai6855
+
+#### `@mui/x-charts-pro@8.10.0` [![pro](https://mui.com/r/x-pro-svg)](https://mui.com/r/x-pro-svg-link 'Pro plan')
+
+Same changes as in `@mui/x-charts@8.10.0`, plus:
+
+- [charts-pro] Fix `slotProps.tooltip.trigger` not respected in `ScatterChartPro` and `FunnelChart` (#18902) @bernardobelchior
+- [charts-pro] Fix zoom filtering adjusting axis too soon (#18992) @bernardobelchior
+- [charts-pro] Mark `FunnelChart` as stable (#19048) @JCQuintas
+- [charts-pro] Mark zoom slider and preview as stable (#19049) @JCQuintas
+- [charts-pro] Refactor `createAxisFilterMapper` (#18998) @bernardobelchior
+
+### Tree View
+
+#### `@mui/x-tree-view@8.10.0`
+
+Internal changes.
+
+#### `@mui/x-tree-view-pro@8.10.0` [![pro](https://mui.com/r/x-pro-svg)](https://mui.com/r/x-pro-svg-link 'Pro plan')
+
+Same changes as in `@mui/x-tree-view@8.10.0`.
+
+### Codemod
+
+#### `@mui/x-codemod@8.10.0`
+
+Internal changes.
+
+### Docs
+
+- [docs] Add CSS bundler breaking change to migration guide (#17436) @romgrk
+- [docs] `RichTreeViewPro` demo for dragging via custom drag-handle is not working properly (#19008) @rita-codes
+- [docs] Fix broken link to D3 in Charts (#19020) @oliviertassinari
+- [docs] Revise the Charts Animation doc (#18990) @mapache-salvaje
+- [docs] Fix incorrect code in line chart preview (#19023) @noobyogi0010
+- [docs] Improve bundling instructions for the Data Grid (#19065) @romgrk
+- [docs] Reduce image size in the inventory grid demo (#19004) @arminmeh
+
+### Core
+
+- [core] Fix ESLint reference name @oliviertassinari
+
+### Miscellaneous
+
+- [infra] Remove bundle size tracking for subpaths (#19072) @Janpot
+- [infra] Accept `PORT` env on `docs:dev` script (#19014) @JCQuintas
+- [infra] Skip codesandbox iframe demos in regressions tests (#18970) @cherniavskii
+- [infra] Remove package.json `module` field (#18961) @Janpot
+- [internal] Remove peer dependency on `@mui/system` (#19062) @aqeelat
+
+## 8.9.2
+
+_Jul 31, 2025_
+
+We'd like to extend a big thank you to the 23 contributors who made this release possible. Here are some highlights ✨:
+
+- 🌎 Improve French (fr-FR), Hebrew (he-IL) and Polish (pl-PL) locales on the Data Grid
+- 🌎 Improve Korean (ko-KR) locale on the Date and Time Pickers
+- 📈 Add symlog scale to charts
+- 📊 Fix bar border radius on Firefox
+- 🐞 Bugfixes
+- 📚 Documentation improvements
+
+Special thanks go out to the community members for their valuable contributions:
+@AmrElnaggar99, @atlanteh, @ddolcimascolo, @Jiseoup, @leonaha5, @noherczeg, @sai6855
+
+The following are all team members who have contributed to this release:
+@alexfauquette, @arminmeh, @bernardobelchior, @bharatkashyap, @brijeshb42, @cherniavskii, @flaviendelangle, @Janpot, @JCQuintas, @KenanYusuf, @LukasTy, @mapache-salvaje, @MBilalShafi, @rita-codes, @romgrk, @siriwatknp
+
+### Data Grid
+
+#### `@mui/x-data-grid@8.9.2`
+
+- [DataGrid] Add debounce for columns panel search (#18719) @noherczeg
+- [DataGrid] Extract virtualization engine (#18275) @romgrk
+- [DataGrid] Improve types in `<GridEditSingleSelect />` (#18184) @sai6855
+- [l10n] Improve French (fr-FR) locale (#18905) @ddolcimascolo
+- [l10n] Improve Hebrew (he-IL) locale (#18665) @atlanteh
+- [l10n] Improve Polish (pl-PL) locale (#18068) @leonaha5
+
+#### `@mui/x-data-grid-pro@8.9.2` [![pro](https://mui.com/r/x-pro-svg)](https://mui.com/r/x-pro-svg-link 'Pro plan')
+
+Same changes as in `@mui/x-data-grid@8.9.2`, plus:
+
+- [DataGridPro] Fix duplicate nested rows for dynamically updated row IDs (#18526) @MBilalShafi
+
+#### `@mui/x-data-grid-premium@8.9.2` [![premium](https://mui.com/r/x-premium-svg)](https://mui.com/r/x-premium-svg-link 'Premium plan')
+
+Same changes as in `@mui/x-data-grid-pro@8.9.2`, plus:
+
+- [DataGridPremium] Add `privateMode` to AI assistant prompt resolver (#18759) @bharatkashyap
+- [DataGridPremium] Fix empty nested group values caused by main criterial `valueFormatter()` (#18916) @cherniavskii
+- [DataGridPremium] Sidebar content and state is managed the same way as for preference panel (#18741) @arminmeh
+- [DataGridPremium] Make `api` param for the aggregation function optional (#18984) @arminmeh
+
+### Date and Time Pickers
+
+#### `@mui/x-date-pickers@8.9.2`
+
+- [l10n] Improve Korean (ko-KR) locale (#18664) @Jiseoup
+- [pickers] Fix popper click-away behavior (#18804) @LukasTy
+- [pickers] Fix usage not in main document (#18944) @LukasTy
+
+#### `@mui/x-date-pickers-pro@8.9.2` [![pro](https://mui.com/r/x-pro-svg)](https://mui.com/r/x-pro-svg-link 'Pro plan')
+
+Same changes as in `@mui/x-date-pickers@8.9.2`.
+
+### Charts
+
+#### `@mui/x-charts@8.9.2`
+
+- [charts] Add symlog scale to charts (#18729) @bernardobelchior
+- [charts] Fix bar border radius on Firefox (#18824) @bernardobelchior
+- [charts] Fix crash when rendering large scatter dataset (#18845) @bernardobelchior
+- [charts] Remove unnecessary type assertion in tooltip `valueFormatter()` (#18877) @sai6855
+- [charts] Export `ChartsWrapper` from `'./ChartsWrapper'` rather than `'./internals'` (#18966) @JCQuintas
+
+#### `@mui/x-charts-pro@8.9.2` [![pro](https://mui.com/r/x-pro-svg)](https://mui.com/r/x-pro-svg-link 'Pro plan')
+
+Same changes as in `@mui/x-charts@8.9.2`, plus:
+
+- [charts-pro] Fix voronoi interaction with zoom (#18950) @alexfauquette
+- [charts-pro] Hide toolbar by default when exporting (#18764) @bernardobelchior
+
+### Codemod
+
+#### `@mui/x-codemod@8.9.2`
+
+Internal changes.
+
+### Docs
+
+- [docs] Add Data Grid demo pages (#18180) @KenanYusuf
+- [docs] Copyedit the Charts Overview page (#18840) @mapache-salvaje
+- [docs] Fix incorrect parameter name in pickers "Custom components" page from `variant` to `pickerVariant` (#18919) @AmrElnaggar99
+
+### Miscellaneous
+
+- [code-infra] Auto-generate deep exports to prevent asymmetric exports (#18917) @JCQuintas
+- [docs-infra] Turn on "Edit in Chat" for X docs (#18869) @siriwatknp
+- [infra] Add specific bundle size tracking (#18884) @Janpot
+- [infra] Fix markdown formatting in llms generation (#18914) @Janpot
+- [infra] Use CI action from mui-public (#18709) @brijeshb42
+
 ## 8.9.1
 
 _Jul 21, 2025_
@@ -23,11 +232,11 @@ The following are all team members who have contributed to this release:
 - [DataGrid] Move conditional list view column logic into `gridVisibleColumnDefinitionsSelector` (#18724) @KenanYusuf
 - [DataGrid] Fix row selection "exclude" model inconsistency (#18844) @MBilalShafi
 
-#### `@mui/x-data-grid-pro@8.9.1` [![pro](https://mui.com/r/x-pro-svg)](https://mui.com/r/x-pro-svg-link "Pro plan")
+#### `@mui/x-data-grid-pro@8.9.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-data-grid@8.9.1`.
 
-#### `@mui/x-data-grid-premium@8.9.1` [![premium](https://mui.com/r/x-premium-svg)](https://mui.com/r/x-premium-svg-link "Premium plan")
+#### `@mui/x-data-grid-premium@8.9.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-data-grid-pro@8.9.1`.
 
@@ -324,8 +533,8 @@ Same changes as in `@mui/x-tree-view@8.7.0`, plus:
 
 - [code-infra] Bump code-infra version and fix breaking changes (#18653) @brijeshb42
 - [code-infra] Ensure `material-ui/disallow-react-api-in-server-components` ESLint rule is applied (#18570) @LukasTy
-- [code-infra] Migrate to flat eslint config (#18562) @brijeshb42
-- [code-infra] Refactor eslint config (#18643) @LukasTy
+- [code-infra] Migrate to flat ESLint config (#18562) @brijeshb42
+- [code-infra] Refactor ESLint config (#18643) @LukasTy
 - [infra] Add renovatebot rule for latest infra packages (#18609) @Janpot
 - [infra] Move pushArgos script to code-infra (#18667) @Janpot
 - [infra] Updates release script to fetch latest major version from upstream (#18552) @michelengelen
@@ -1239,7 +1448,7 @@ Same changes as in `@mui/x-tree-view@8.2.0`.
 - [core] Fix all Vale errors @oliviertassinari
 - [core] Move `loadStyleSheets` to internals and use it in data grid and charts (#17548) @bernardobelchior
 - [core] Remove empty version (#17582) @oliviertassinari
-- [core] Remove eslint from codemod spec files (#17443) @alexfauquette
+- [core] Remove ESLint from codemod spec files (#17443) @alexfauquette
 - [core] Remove unnecessary versions (#17597) @oliviertassinari
 - [code-infra] Allow postinstall scripts for packages requesting it (#17635) @LukasTy
 - [code-infra] Data Grid `vitest` changes (#17619) @JCQuintas
@@ -6733,7 +6942,7 @@ Same changes as in `@mui/x-date-pickers@7.8.0`.
 
 ### Core
 
-- [core] Add eslint rule to restrict import from `../internals` root (#13633) @JCQuintas
+- [core] Add ESLint rule to restrict import from `../internals` root (#13633) @JCQuintas
 - [docs-infra] Sync `\_app` folder with monorepo (#13582) @Janpot
 - [license] Allow usage of Charts and Tree View Pro package for old premium licenses (#13619) @flaviendelangle
 
@@ -6871,7 +7080,7 @@ Same changes as in `@mui/x-date-pickers@7.7.0`.
 
 - [charts] Add watermark on the pro `ResponsiveChartContainer` (#13398) @alexfauquette
 - [charts] Allow to specify y-axis configuration (#13438) @alexfauquette
-- [charts] Fix eslint for react compiler (#13444) @alexfauquette
+- [charts] Fix ESLint for react compiler (#13444) @alexfauquette
 - [charts] Improve themeAugmentation typing (#13433) @noraleonte
 - [charts] Move the `ZAxisContextProvider` by default in the `ChartContainer` (#13465) @alexfauquette
 - [charts] Use plugins to define series extremum and colors (#13397) @alexfauquette
@@ -7418,7 +7627,7 @@ Same changes as in `@mui/x-date-pickers@7.3.1`.
 - [core] Use `describeTreeView` for focus tests (#12698) @flaviendelangle
 - [core] Use `describeTreeView` for type-ahead tests (#12811) @flaviendelangle
 - [code-infra] Change package manager to `pnpm` (#11875) @LukasTy
-- [code-infra] Closer sync with eslint config of codebase (#12864) @oliviertassinari
+- [code-infra] Closer sync with ESLint config of codebase (#12864) @oliviertassinari
 - [support-infra] Add release announcement to GitHub workflows (#11867) (#12843) @michelengelen
 
 ## 7.3.0

package/DataGridPremium/DataGridPremium.js

@@ -18,19 +18,17 @@ var _forwardRef = require("@mui/x-internals/forwardRef");
 var _useDataGridPremiumComponent = require("./useDataGridPremiumComponent");
 var _useDataGridPremiumProps = require("./useDataGridPremiumProps");
 var _sidebar = require("../components/sidebar");
-var _GridPivotPanel = require("../components/pivotPanel/GridPivotPanel");
 var _useGridAriaAttributes = require("../hooks/utils/useGridAriaAttributes");
 var _useGridRowAriaAttributes = require("../hooks/features/rows/useGridRowAriaAttributes");
 var _gridAggregationSelectors = require("../hooks/features/aggregation/gridAggregationSelectors");
 var _useGridApiContext = require("../hooks/utils/useGridApiContext");
-var _gridPivotingSelectors = require("../hooks/features/pivoting/gridPivotingSelectors");
-var _utils = require("../hooks/features/pivoting/utils");
+var _sidebar2 = require("../hooks/features/sidebar");
 var _jsxRuntime = require("react/jsx-runtime");
 const configuration = {
   hooks: {
     useCSSVariables: _material.useMaterialCSSVariables,
-    useGridAriaAttributes: _useGridAriaAttributes.useGridAriaAttributes,
-    useGridRowAriaAttributes: _useGridRowAriaAttributes.useGridRowAriaAttributes,
+    useGridAriaAttributes: _useGridAriaAttributes.useGridAriaAttributesPremium,
+    useGridRowAriaAttributes: _useGridRowAriaAttributes.useGridRowAriaAttributesPremium,
     useCellAggregationResult: (id, field) => {
       const apiRef = (0, _useGridApiContext.useGridApiContext)();
       return (0, _xDataGridPro.useGridSelector)(apiRef, _gridAggregationSelectors.gridCellAggregationResultSelector, {
@@ -40,7 +38,7 @@ const configuration = {
     }
   }
 };
-const releaseInfo = "MTc1MzAzODAwMDAwMA==";
+const releaseInfo = "MTc1NDYwNDAwMDAwMA==";
 const watermark = /*#__PURE__*/(0, _jsxRuntime.jsx)(_xLicense.Watermark, {
   packageName: "x-data-grid-premium",
   releaseInfo: releaseInfo
@@ -54,13 +52,11 @@ const DataGridPremiumRaw = (0, _forwardRef.forwardRef)(function DataGridPremium(
   const privateApiRef = (0, _internals.useGridApiInitialization)(initialProps.apiRef, initialProps);
   const props = (0, _useDataGridPremiumComponent.useDataGridPremiumComponent)(privateApiRef, initialProps);
   (0, _xLicense.useLicenseVerifier)('x-data-grid-premium', releaseInfo);
-  const pivotSettingsOpen = (0, _xDataGridPro.useGridSelector)(privateApiRef, _gridPivotingSelectors.gridPivotPanelOpenSelector);
   if (process.env.NODE_ENV !== 'production') {
     (0, _internals.validateProps)(props, dataGridPremiumPropValidators);
   }
-  const sidePanel = (0, _utils.isPivotingAvailable)(props) && pivotSettingsOpen ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_sidebar.Sidebar, {
-    children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_GridPivotPanel.GridPivotPanel, {})
-  }) : null;
+  const sidebarOpen = (0, _xDataGridPro.useGridSelector)(privateApiRef, _sidebar2.gridSidebarOpenSelector);
+  const sidePanel = sidebarOpen ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_sidebar.Sidebar, {}) : null;
   return /*#__PURE__*/(0, _jsxRuntime.jsx)(_xDataGridPro.GridContextProvider, {
     privateApiRef: privateApiRef,
     configuration: configuration,
@@ -224,6 +220,11 @@ process.env.NODE_ENV !== "production" ? DataGridPremiumRaw.propTypes = {
    * @default 150
    */
   columnBufferPx: _propTypes.default.number,
+  /**
+   * The milliseconds delay to wait after a keystroke before triggering filtering in the columns menu.
+   * @default 150
+   */
+  columnFilterDebounceMs: _propTypes.default.number,
   /**
    * Sets the height in pixels of the column group headers in the Data Grid.
    * Inherits the `columnHeaderHeight` value if not set.
@@ -895,6 +896,7 @@ process.env.NODE_ENV !== "production" ? DataGridPremiumRaw.propTypes = {
   /**
    * Callback fired when the pivot side panel open state changes.
    * @param {boolean} pivotPanelOpen Whether the pivot side panel is visible.
+   * @deprecated Use the `sidebarOpen` and `sidebarClose` events or corresponding event handlers `onSidebarOpen()` and `onSidebarClose()` instead.
    */
   onPivotPanelOpenChange: _propTypes.default.func,
   /**
@@ -996,6 +998,20 @@ process.env.NODE_ENV !== "production" ? DataGridPremiumRaw.propTypes = {
    * @deprecated Use the {@link https://mui.com/x/react-data-grid/server-side-data/lazy-loading/#infinite-loading Server-side data-Infinite loading} instead.
    */
   onRowsScrollEnd: _propTypes.default.func,
+  /**
+   * Callback fired when the sidebar is closed.
+   * @param {GridSidebarParams} params With all properties from [[GridSidebarParams]].
+   * @param {MuiEvent<{}>} event The event object.
+   * @param {GridCallbackDetails} details Additional details for this callback.
+   */
+  onSidebarClose: _propTypes.default.func,
+  /**
+   * Callback fired when the sidebar is opened.
+   * @param {GridSidebarParams} params With all properties from [[GridSidebarParams]].
+   * @param {MuiEvent<{}>} event The event object.
+   * @param {GridCallbackDetails} details Additional details for this callback.
+   */
+  onSidebarOpen: _propTypes.default.func,
   /**
    * Callback fired when the sort model changes before a column is sorted.
    * @param {GridSortModel} model With all properties from [[GridSortModel]].
@@ -1102,6 +1118,7 @@ process.env.NODE_ENV !== "production" ? DataGridPremiumRaw.propTypes = {
   /**
    * If `true`, the pivot side panel is visible.
    * @default false
+   * @deprecated Use `initialState.sidebar.open` instead.
    */
   pivotPanelOpen: _propTypes.default.bool,
   /**

package/DataGridPremium/useDataGridPremiumComponent.js

@@ -23,6 +23,7 @@ var _useGridClipboardImport = require("../hooks/features/clipboard/useGridClipbo
 var _useGridPivoting = require("../hooks/features/pivoting/useGridPivoting");
 var _gridPivotingSelectors = require("../hooks/features/pivoting/gridPivotingSelectors");
 var _useGridAiAssistant = require("../hooks/features/aiAssistant/useGridAiAssistant");
+var _useGridSidebar = require("../hooks/features/sidebar/useGridSidebar");
 // Premium-only features
 
 const useDataGridPremiumComponent = (apiRef, inProps) => {
@@ -70,10 +71,12 @@ const useDataGridPremiumComponent = (apiRef, inProps) => {
   (0, _internals.useGridInitializeState)(_useGridRowGrouping.rowGroupingStateInitializer, apiRef, props, key);
   (0, _internals.useGridInitializeState)(_useGridAggregation.aggregationStateInitializer, apiRef, props, key);
   (0, _internals.useGridInitializeState)(_internals.rowSelectionStateInitializer, apiRef, props);
+  (0, _internals.useGridInitializeState)(_internals.rowReorderStateInitializer, apiRef, props);
   (0, _internals.useGridInitializeState)(_useGridCellSelection.cellSelectionStateInitializer, apiRef, props);
   (0, _internals.useGridInitializeState)(_internals.detailPanelStateInitializer, apiRef, props);
   (0, _internals.useGridInitializeState)(_internals.columnPinningStateInitializer, apiRef, props, key);
   (0, _internals.useGridInitializeState)(_internals.columnsStateInitializer, apiRef, props, key);
+  (0, _internals.useGridInitializeState)(_useGridSidebar.sidebarStateInitializer, apiRef, props);
   (0, _internals.useGridInitializeState)(_useGridPivoting.pivotingStateInitializer, apiRef, props);
   (0, _internals.useGridInitializeState)(_internals.rowPinningStateInitializer, apiRef, props);
   (0, _internals.useGridInitializeState)(_internals.rowsStateInitializer, apiRef, props);
@@ -95,6 +98,8 @@ const useDataGridPremiumComponent = (apiRef, inProps) => {
   (0, _internals.useGridInitializeState)(_internals.rowsMetaStateInitializer, apiRef, props);
   (0, _internals.useGridInitializeState)(_internals.listViewStateInitializer, apiRef, props);
   (0, _internals.useGridInitializeState)(_useGridAiAssistant.aiAssistantStateInitializer, apiRef, props);
+  (0, _internals.useGridVirtualizer)(apiRef, props);
+  (0, _useGridSidebar.useGridSidebar)(apiRef, props);
   (0, _useGridPivoting.useGridPivoting)(apiRef, props, inProps.columns, inProps.rows);
   (0, _useGridRowGrouping.useGridRowGrouping)(apiRef, props);
   (0, _internals.useGridHeaderFiltering)(apiRef, props);

package/components/GridColumnMenuPivotItem.js

@@ -7,9 +7,10 @@ Object.defineProperty(exports, "__esModule", {
 exports.GridColumnMenuPivotItem = GridColumnMenuPivotItem;
 var React = _interopRequireWildcard(require("react"));
 var _xDataGridPro = require("@mui/x-data-grid-pro");
-var _internals = require("@mui/x-data-grid-pro/internals");
+var _gridPivotingSelectors = require("../hooks/features/pivoting/gridPivotingSelectors");
 var _useGridRootProps = require("../hooks/utils/useGridRootProps");
 var _useGridApiContext = require("../hooks/utils/useGridApiContext");
+var _sidebar = require("../hooks/features/sidebar");
 var _jsxRuntime = require("react/jsx-runtime");
 function GridColumnMenuPivotItem(props) {
   const {
@@ -17,10 +18,10 @@ function GridColumnMenuPivotItem(props) {
   } = props;
   const rootProps = (0, _useGridRootProps.useGridRootProps)();
   const apiRef = (0, _useGridApiContext.useGridApiContext)();
-  const isPivotPanelOpen = (0, _xDataGridPro.useGridSelector)(apiRef, _internals.gridPivotPanelOpenSelector);
+  const isPivotPanelOpen = (0, _xDataGridPro.useGridSelector)(apiRef, _gridPivotingSelectors.gridPivotPanelOpenSelector);
   const openPivotSettings = event => {
     onClick(event);
-    apiRef.current.setPivotPanelOpen(true);
+    apiRef.current.showSidebar(_sidebar.GridSidebarValue.Pivot);
   };
   return /*#__PURE__*/(0, _jsxRuntime.jsx)(rootProps.slots.baseMenuItem, {
     onClick: openPivotSettings,

package/components/GridDataSourceGroupingCriteriaCell.js

@@ -42,7 +42,9 @@ function GridGroupingCriteriaCellIcon(props) {
       // always fetch/get from cache the children when the node is expanded
       apiRef.current.dataSource.fetchRows(id);
     } else {
-      apiRef.current.setRowChildrenExpansion(id, !rowNode.childrenExpanded);
+      // Collapse the node and remove child rows from the grid
+      apiRef.current.setRowChildrenExpansion(id, false);
+      apiRef.current.removeChildrenRows(id);
     }
     apiRef.current.setCellFocus(id, field);
     event.stopPropagation();

package/components/pivotPanel/GridPivotPanelHeader.js

@@ -81,7 +81,7 @@ function GridPivotPanelHeader(props) {
         })
       }, rootProps.slotProps?.baseSwitch)), /*#__PURE__*/(0, _jsxRuntime.jsx)(rootProps.slots.baseIconButton, (0, _extends2.default)({
         onClick: () => {
-          apiRef.current.setPivotPanelOpen(false);
+          apiRef.current.hideSidebar();
           if (isEmptyPivot) {
             apiRef.current.setPivotActive(false);
           }

package/components/pivotPanel/PivotPanelTrigger.js

@@ -17,6 +17,7 @@ var _xDataGridPro = require("@mui/x-data-grid-pro");
 var _useGridApiContext = require("../../hooks/utils/useGridApiContext");
 var _useGridRootProps = require("../../hooks/utils/useGridRootProps");
 var _gridPivotingSelectors = require("../../hooks/features/pivoting/gridPivotingSelectors");
+var _sidebar = require("../../hooks/features/sidebar");
 var _jsxRuntime = require("react/jsx-runtime");
 const _excluded = ["render", "className", "onClick", "onPointerUp"];
 /**
@@ -50,7 +51,11 @@ const PivotPanelTrigger = exports.PivotPanelTrigger = (0, _forwardRef.forwardRef
   };
   const resolvedClassName = typeof className === 'function' ? className(state) : className;
   const handleClick = event => {
-    apiRef.current.setPivotPanelOpen(!open);
+    if (open) {
+      apiRef.current.hideSidebar();
+    } else {
+      apiRef.current.showSidebar(_sidebar.GridSidebarValue.Pivot, panelId, buttonId);
+    }
     onClick?.(event);
   };
   const element = (0, _useComponentRenderer.useComponentRenderer)(rootProps.slots.baseButton, render, (0, _extends2.default)({}, rootProps.slotProps?.baseButton, {

package/components/sidebar/Sidebar.d.ts

@@ -1,4 +1,4 @@
 import * as React from 'react';
 export type SidebarProps = React.HTMLAttributes<HTMLDivElement>;
-declare function Sidebar(props: SidebarProps): React.JSX.Element;
+declare function Sidebar(props: SidebarProps): React.JSX.Element | null;
 export { Sidebar };

package/components/sidebar/Sidebar.js

@@ -13,8 +13,10 @@ var _clsx = _interopRequireDefault(require("clsx"));
 var _system = require("@mui/system");
 var _xDataGridPro = require("@mui/x-data-grid-pro");
 var _composeClasses = _interopRequireDefault(require("@mui/utils/composeClasses"));
+var _useGridApiContext = require("../../hooks/utils/useGridApiContext");
 var _resizablePanel = require("../resizablePanel");
 var _useGridRootProps = require("../../hooks/utils/useGridRootProps");
+var _sidebar = require("../../hooks/features/sidebar");
 var _jsxRuntime = require("react/jsx-runtime");
 const _excluded = ["className", "children"];
 const useUtilityClasses = ownerState => {
@@ -39,16 +41,30 @@ const SidebarRoot = (0, _system.styled)(_resizablePanel.ResizablePanel, {
 });
 function Sidebar(props) {
   const {
-      className,
-      children
+      className
     } = props,
     other = (0, _objectWithoutPropertiesLoose2.default)(props, _excluded);
+  const apiRef = (0, _useGridApiContext.useGridApiContext)();
   const rootProps = (0, _useGridRootProps.useGridRootProps)();
   const classes = useUtilityClasses(rootProps);
+  const {
+    value,
+    sidebarId,
+    labelId
+  } = (0, _xDataGridPro.useGridSelector)(apiRef, _sidebar.gridSidebarContentSelector);
+  if (!value) {
+    return null;
+  }
+  const sidebarContent = apiRef.current.unstable_applyPipeProcessors('sidebar', null, value);
+  if (!sidebarContent) {
+    return null;
+  }
   return /*#__PURE__*/(0, _jsxRuntime.jsxs)(SidebarRoot, (0, _extends2.default)({
+    id: sidebarId,
     className: (0, _clsx.default)(className, classes.root),
-    ownerState: rootProps
+    ownerState: rootProps,
+    "aria-labelledby": labelId
   }, other, {
-    children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_resizablePanel.ResizablePanelHandle, {}), children]
+    children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_resizablePanel.ResizablePanelHandle, {}), sidebarContent]
   }));
 }

package/esm/DataGridPremium/DataGridPremium.js

@@ -11,19 +11,17 @@ import { forwardRef } from '@mui/x-internals/forwardRef';
 import { useDataGridPremiumComponent } from "./useDataGridPremiumComponent.js";
 import { useDataGridPremiumProps } from "./useDataGridPremiumProps.js";
 import { Sidebar } from "../components/sidebar/index.js";
-import { GridPivotPanel } from "../components/pivotPanel/GridPivotPanel.js";
-import { useGridAriaAttributes } from "../hooks/utils/useGridAriaAttributes.js";
-import { useGridRowAriaAttributes } from "../hooks/features/rows/useGridRowAriaAttributes.js";
+import { useGridAriaAttributesPremium } from "../hooks/utils/useGridAriaAttributes.js";
+import { useGridRowAriaAttributesPremium } from "../hooks/features/rows/useGridRowAriaAttributes.js";
 import { gridCellAggregationResultSelector } from "../hooks/features/aggregation/gridAggregationSelectors.js";
 import { useGridApiContext } from "../hooks/utils/useGridApiContext.js";
-import { gridPivotPanelOpenSelector } from "../hooks/features/pivoting/gridPivotingSelectors.js";
-import { isPivotingAvailable } from "../hooks/features/pivoting/utils.js";
+import { gridSidebarOpenSelector } from "../hooks/features/sidebar/index.js";
 import { jsx as _jsx } from "react/jsx-runtime";
 const configuration = {
   hooks: {
     useCSSVariables: useMaterialCSSVariables,
-    useGridAriaAttributes,
-    useGridRowAriaAttributes,
+    useGridAriaAttributes: useGridAriaAttributesPremium,
+    useGridRowAriaAttributes: useGridRowAriaAttributesPremium,
     useCellAggregationResult: (id, field) => {
       const apiRef = useGridApiContext();
       return useGridSelector(apiRef, gridCellAggregationResultSelector, {
@@ -33,7 +31,7 @@ const configuration = {
     }
   }
 };
-const releaseInfo = "MTc1MzAzODAwMDAwMA==";
+const releaseInfo = "MTc1NDYwNDAwMDAwMA==";
 const watermark = /*#__PURE__*/_jsx(Watermark, {
   packageName: "x-data-grid-premium",
   releaseInfo: releaseInfo
@@ -47,13 +45,11 @@ const DataGridPremiumRaw = forwardRef(function DataGridPremium(inProps, ref) {
   const privateApiRef = useGridApiInitialization(initialProps.apiRef, initialProps);
   const props = useDataGridPremiumComponent(privateApiRef, initialProps);
   useLicenseVerifier('x-data-grid-premium', releaseInfo);
-  const pivotSettingsOpen = useGridSelector(privateApiRef, gridPivotPanelOpenSelector);
   if (process.env.NODE_ENV !== 'production') {
     validateProps(props, dataGridPremiumPropValidators);
   }
-  const sidePanel = isPivotingAvailable(props) && pivotSettingsOpen ? /*#__PURE__*/_jsx(Sidebar, {
-    children: /*#__PURE__*/_jsx(GridPivotPanel, {})
-  }) : null;
+  const sidebarOpen = useGridSelector(privateApiRef, gridSidebarOpenSelector);
+  const sidePanel = sidebarOpen ? /*#__PURE__*/_jsx(Sidebar, {}) : null;
   return /*#__PURE__*/_jsx(GridContextProvider, {
     privateApiRef: privateApiRef,
     configuration: configuration,
@@ -217,6 +213,11 @@ process.env.NODE_ENV !== "production" ? DataGridPremiumRaw.propTypes = {
    * @default 150
    */
   columnBufferPx: PropTypes.number,
+  /**
+   * The milliseconds delay to wait after a keystroke before triggering filtering in the columns menu.
+   * @default 150
+   */
+  columnFilterDebounceMs: PropTypes.number,
   /**
    * Sets the height in pixels of the column group headers in the Data Grid.
    * Inherits the `columnHeaderHeight` value if not set.
@@ -888,6 +889,7 @@ process.env.NODE_ENV !== "production" ? DataGridPremiumRaw.propTypes = {
   /**
    * Callback fired when the pivot side panel open state changes.
    * @param {boolean} pivotPanelOpen Whether the pivot side panel is visible.
+   * @deprecated Use the `sidebarOpen` and `sidebarClose` events or corresponding event handlers `onSidebarOpen()` and `onSidebarClose()` instead.
    */
   onPivotPanelOpenChange: PropTypes.func,
   /**
@@ -989,6 +991,20 @@ process.env.NODE_ENV !== "production" ? DataGridPremiumRaw.propTypes = {
    * @deprecated Use the {@link https://mui.com/x/react-data-grid/server-side-data/lazy-loading/#infinite-loading Server-side data-Infinite loading} instead.
    */
   onRowsScrollEnd: PropTypes.func,
+  /**
+   * Callback fired when the sidebar is closed.
+   * @param {GridSidebarParams} params With all properties from [[GridSidebarParams]].
+   * @param {MuiEvent<{}>} event The event object.
+   * @param {GridCallbackDetails} details Additional details for this callback.
+   */
+  onSidebarClose: PropTypes.func,
+  /**
+   * Callback fired when the sidebar is opened.
+   * @param {GridSidebarParams} params With all properties from [[GridSidebarParams]].
+   * @param {MuiEvent<{}>} event The event object.
+   * @param {GridCallbackDetails} details Additional details for this callback.
+   */
+  onSidebarOpen: PropTypes.func,
   /**
    * Callback fired when the sort model changes before a column is sorted.
    * @param {GridSortModel} model With all properties from [[GridSortModel]].
@@ -1095,6 +1111,7 @@ process.env.NODE_ENV !== "production" ? DataGridPremiumRaw.propTypes = {
   /**
    * If `true`, the pivot side panel is visible.
    * @default false
+   * @deprecated Use `initialState.sidebar.open` instead.
    */
   pivotPanelOpen: PropTypes.bool,
   /**