@mui/x-data-grid 7.29.11 → 7.29.13

package/CHANGELOG.md

@@ -3,6 +3,70 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## 7.29.13
+
+_Apr 27, 2026_
+
+We'd like to extend a big thank you to the 4 contributors who made this release possible. Here are some highlights ✨:
+
+- 🐞 Bugfixes
+
+The following are all team members who have contributed to this release:
+@arminmeh, @dav-is, @LukasTy, @michelengelen
+
+### Data Grid
+
+#### `@mui/x-data-grid@7.29.13`
+
+- [DataGrid] Prevent repeated `hasScrollbar` state updates (#21849) @arminmeh
+
+#### `@mui/x-data-grid-pro@7.29.13` [![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@7.29.13`.
+
+#### `@mui/x-data-grid-premium@7.29.13` [![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@7.29.13`.
+
+### Docs
+
+- [docs] Add `v9` as root path link and move `v8` under subpath (#22037) @LukasTy
+- [docs] Add check for auto-generated group rows in `renderCountry` (#22143) @michelengelen
+- [docs] Remove obsolete v7 deprecation warning for `dayOfWeekFormatter` (@LukasTy) (#22121)
+
+### Miscellaneous
+
+- [docs-infra] Set `SEARCH_INDEX` Env for v7 (#21876) @dav-is
+
+## 7.29.12
+
+_Nov 26, 2025_
+
+We'd like to extend a big thank you to the 2 contributors who made this release possible. Here are some highlights ✨:
+
+- 🐞 Bugfixes
+
+Special thanks go out to the community members for their valuable contributions:
+@m2mathew
+
+Following are all team members who have contributed to this release:
+@arminmeh
+
+### Data Grid
+
+#### `@mui/x-data-grid@7.29.12`
+
+- [DataGrid] Avoid automatic scroll back to the focused element after it leaves the viewport (#20417) @arminmeh
+- [DataGrid] Fix missing rows in the print export window (#20157) @m2mathew
+
+#### `@mui/x-data-grid-pro@7.29.12` [![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@7.29.12`.
+
+#### `@mui/x-data-grid-premium@7.29.12` [![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@7.29.12`.
+
 ## 7.29.11
 
 _Nov 19, 2025_

package/components/columnHeaders/GridColumnGroupHeader.js

@@ -2,6 +2,7 @@ import _extends from "@babel/runtime/helpers/esm/extends";
 import * as React from 'react';
 import { unstable_useId as useId, unstable_composeClasses as composeClasses } from '@mui/utils';
 import { useRtl } from '@mui/system/RtlProvider';
+import { doesSupportPreventScroll } from "../../utils/doesSupportPreventScroll.js";
 import { getDataGridUtilityClass } from "../../constants/gridClasses.js";
 import { useGridRootProps } from "../../hooks/utils/useGridRootProps.js";
 import { gridColumnGroupsLookupSelector } from "../../hooks/features/columnGrouping/gridColumnGroupsSelector.js";
@@ -86,7 +87,18 @@ function GridColumnGroupHeader(props) {
     if (hasFocus) {
       const focusableElement = headerCellRef.current.querySelector('[tabindex="0"]');
       const elementToFocus = focusableElement || headerCellRef.current;
-      elementToFocus?.focus();
+      if (!elementToFocus) {
+        return;
+      }
+      if (doesSupportPreventScroll()) {
+        elementToFocus.focus({
+          preventScroll: true
+        });
+      } else {
+        const scrollPosition = apiRef.current.getScrollPosition();
+        elementToFocus.focus();
+        apiRef.current.scroll(scrollPosition);
+      }
     }
   }, [apiRef, hasFocus]);
   const publish = React.useCallback(eventName => event => {

package/components/columnHeaders/GridColumnHeaderItem.js

@@ -5,6 +5,7 @@ import clsx from 'clsx';
 import { unstable_composeClasses as composeClasses, unstable_useId as useId } from '@mui/utils';
 import { fastMemo } from '@mui/x-internals/fastMemo';
 import { useRtl } from '@mui/system/RtlProvider';
+import { doesSupportPreventScroll } from "../../utils/doesSupportPreventScroll.js";
 import { useGridPrivateApiContext } from "../../hooks/utils/useGridPrivateApiContext.js";
 import { ColumnHeaderMenuIcon } from "./ColumnHeaderMenuIcon.js";
 import { GridColumnHeaderMenu } from "../menu/columnMenu/GridColumnHeaderMenu.js";
@@ -160,9 +161,17 @@ function GridColumnHeaderItem(props) {
     if (hasFocus && !columnMenuState.open) {
       const focusableElement = headerCellRef.current.querySelector('[tabindex="0"]');
       const elementToFocus = focusableElement || headerCellRef.current;
-      elementToFocus?.focus();
-      if (apiRef.current.columnHeadersContainerRef?.current) {
-        apiRef.current.columnHeadersContainerRef.current.scrollLeft = 0;
+      if (!elementToFocus) {
+        return;
+      }
+      if (doesSupportPreventScroll()) {
+        elementToFocus.focus({
+          preventScroll: true
+        });
+      } else {
+        const scrollPosition = apiRef.current.getScrollPosition();
+        elementToFocus.focus();
+        apiRef.current.scroll(scrollPosition);
       }
     }
   }, [apiRef, hasFocus]);

package/components/columnHeaders/GridGenericColumnHeaderItem.js

@@ -5,7 +5,6 @@ import * as React from 'react';
 import clsx from 'clsx';
 import { unstable_useForkRef as useForkRef } from '@mui/utils';
 import { forwardRef } from '@mui/x-internals/forwardRef';
-import { useGridPrivateApiContext } from "../../hooks/utils/useGridPrivateApiContext.js";
 import { GridColumnHeaderTitle } from "./GridColumnHeaderTitle.js";
 import { GridColumnHeaderSeparator } from "./GridColumnHeaderSeparator.js";
 import { useGridRootProps } from "../../hooks/utils/useGridRootProps.js";
@@ -17,7 +16,6 @@ const GridGenericColumnHeaderItem = forwardRef(function GridGenericColumnHeaderI
       height,
       isResizing,
       sortDirection,
-      hasFocus,
       tabIndex,
       separatorSide,
       isDraggable,
@@ -35,7 +33,6 @@ const GridGenericColumnHeaderItem = forwardRef(function GridGenericColumnHeaderI
       style
     } = props,
     other = _objectWithoutPropertiesLoose(props, _excluded);
-  const apiRef = useGridPrivateApiContext();
   const rootProps = useGridRootProps();
   const headerCellRef = React.useRef(null);
   const handleRef = useForkRef(headerCellRef, ref);
@@ -43,17 +40,6 @@ const GridGenericColumnHeaderItem = forwardRef(function GridGenericColumnHeaderI
   if (sortDirection != null) {
     ariaSort = sortDirection === 'asc' ? 'ascending' : 'descending';
   }
-  React.useLayoutEffect(() => {
-    const columnMenuState = apiRef.current.state.columnMenu;
-    if (hasFocus && !columnMenuState.open) {
-      const focusableElement = headerCellRef.current.querySelector('[tabindex="0"]');
-      const elementToFocus = focusableElement || headerCellRef.current;
-      elementToFocus?.focus();
-      if (apiRef.current.columnHeadersContainerRef?.current) {
-        apiRef.current.columnHeadersContainerRef.current.scrollLeft = 0;
-      }
-    }
-  }, [apiRef, hasFocus]);
   return /*#__PURE__*/_jsxs("div", _extends({
     className: clsx(classes.root, headerClassName),
     style: _extends({}, style, {

package/hooks/features/dimensions/useGridDimensions.js

@@ -67,6 +67,21 @@ export function useGridDimensions(apiRef, props) {
   const densityFactor = useGridSelector(apiRef, gridDensityFactorSelector);
   const columnsTotalWidth = useGridSelector(apiRef, columnsTotalWidthSelector);
   const isFirstSizing = React.useRef(true);
+
+  // Vertical scrollbar oscillation detector.
+  // Counts consecutive hasScrollY flips that happen with no row-height change.
+  // After 2 flips it is certainly a layout feedback loop, so every further flip
+  // is forced to false (no scrollbar). The counter resets when row heights change.
+  // Only vertical scrollbar can oscillate because column widths are never 'auto'.
+  // https://github.com/mui/mui-x/issues/20539
+  const scrollYOscillation = React.useRef({
+    counter: 0,
+    heights: {
+      content: 0,
+      pinnedTop: 0,
+      pinnedBottom: 0
+    }
+  });
   const {
     rowHeight,
     headerHeight,
@@ -134,6 +149,7 @@ export function useGridDimensions(apiRef, props) {
       width: nonPinnedColumnsTotalWidth,
       height: roundToDecimalPlaces(rowsMeta.currentPageTotalHeight, 1)
     };
+    const prevDimensions = apiRef.current.state.dimensions;
     let viewportOuterSize;
     let viewportInnerSize;
     let hasScrollX = false;
@@ -171,6 +187,36 @@ export function useGridDimensions(apiRef, props) {
           hasScrollY = content.height + scrollbarSize > container.height;
         }
       }
+
+      // Detect vertical scrollbar oscillation.
+      // Track consecutive hasScrollY flips with no row-height change.
+      // Once confirmed (≥ 2 flips), force hasScrollY off — the scrollbar is
+      // not genuinely needed, it is a layout feedback loop caused by stale
+      // rootSize or the horizontal scrollbar's height cascading.
+      {
+        const osc = scrollYOscillation.current;
+        const heightsChanged = rowsMeta.currentPageTotalHeight !== osc.heights.content || rowsMeta.pinnedTopRowsTotalHeight !== osc.heights.pinnedTop || rowsMeta.pinnedBottomRowsTotalHeight !== osc.heights.pinnedBottom;
+        if (heightsChanged) {
+          osc.counter = 0;
+          osc.heights = {
+            content: rowsMeta.currentPageTotalHeight,
+            pinnedTop: rowsMeta.pinnedTopRowsTotalHeight,
+            pinnedBottom: rowsMeta.pinnedBottomRowsTotalHeight
+          };
+        }
+        if (prevDimensions.isReady && hasScrollY !== prevDimensions.hasScrollY) {
+          if (!heightsChanged) {
+            osc.counter += 1;
+          }
+          if (osc.counter >= 2) {
+            hasScrollY = false;
+            // Recompute hasScrollX without the vertical scrollbar's width impact,
+            // otherwise the cascade (hasScrollY → narrower viewport → hasScrollX)
+            // keeps the horizontal scrollbar/filler alive and the root keeps resizing.
+            hasScrollX = hasScrollXIfNoYScrollBar;
+          }
+        }
+      }
       if (hasScrollY) {
         viewportInnerSize.width -= scrollbarSize;
       }
@@ -205,7 +251,6 @@ export function useGridDimensions(apiRef, props) {
       topContainerHeight,
       bottomContainerHeight
     };
-    const prevDimensions = apiRef.current.state.dimensions;
     if (isDeepEqual(prevDimensions, newDimensions)) {
       return;
     }

package/hooks/features/export/useGridPrintExport.js

@@ -201,7 +201,7 @@ export const useGridPrintExport = (apiRef, props) => {
     // Revert grid to previous state
     apiRef.current.restoreState(previousGridState.current || {});
     if (!previousGridState.current?.columns?.columnVisibilityModel) {
-      // if the apiRef.current.exportState(); did not exported the column visibility, we update it
+      // if the apiRef.current.exportState(); did not export the column visibility, we update it
       apiRef.current.setColumnVisibilityModel(previousColumnVisibility.current);
     }
     apiRef.current.setState(state => _extends({}, state, {
@@ -238,12 +238,7 @@ export const useGridPrintExport = (apiRef, props) => {
       }));
     }
     previousVirtualizationState.current = apiRef.current.state.virtualization;
-    apiRef.current.setState(state => _extends({}, state, {
-      virtualization: _extends({}, state.virtualization, {
-        enabled: false,
-        enabledForColumns: false
-      })
-    }));
+    apiRef.current.unstable_setVirtualization(false);
     await updateGridColumnsForPrint(options?.fields, options?.allColumns, options?.includeCheckboxes);
     updateGridRowsForPrint(options?.getRowsToExport ?? defaultGetRowsToExport);
     await raf(); // wait for the state changes to take action

package/index.js

@@ -1,5 +1,5 @@
 /**
- * @mui/x-data-grid v7.29.11
+ * @mui/x-data-grid v7.29.13
  *
  * @license MIT
  * This source code is licensed under the MIT license found in the

package/modern/components/columnHeaders/GridColumnGroupHeader.js

@@ -2,6 +2,7 @@ import _extends from "@babel/runtime/helpers/esm/extends";
 import * as React from 'react';
 import { unstable_useId as useId, unstable_composeClasses as composeClasses } from '@mui/utils';
 import { useRtl } from '@mui/system/RtlProvider';
+import { doesSupportPreventScroll } from "../../utils/doesSupportPreventScroll.js";
 import { getDataGridUtilityClass } from "../../constants/gridClasses.js";
 import { useGridRootProps } from "../../hooks/utils/useGridRootProps.js";
 import { gridColumnGroupsLookupSelector } from "../../hooks/features/columnGrouping/gridColumnGroupsSelector.js";
@@ -86,7 +87,18 @@ function GridColumnGroupHeader(props) {
     if (hasFocus) {
       const focusableElement = headerCellRef.current.querySelector('[tabindex="0"]');
       const elementToFocus = focusableElement || headerCellRef.current;
-      elementToFocus?.focus();
+      if (!elementToFocus) {
+        return;
+      }
+      if (doesSupportPreventScroll()) {
+        elementToFocus.focus({
+          preventScroll: true
+        });
+      } else {
+        const scrollPosition = apiRef.current.getScrollPosition();
+        elementToFocus.focus();
+        apiRef.current.scroll(scrollPosition);
+      }
     }
   }, [apiRef, hasFocus]);
   const publish = React.useCallback(eventName => event => {

package/modern/components/columnHeaders/GridColumnHeaderItem.js

@@ -5,6 +5,7 @@ import clsx from 'clsx';
 import { unstable_composeClasses as composeClasses, unstable_useId as useId } from '@mui/utils';
 import { fastMemo } from '@mui/x-internals/fastMemo';
 import { useRtl } from '@mui/system/RtlProvider';
+import { doesSupportPreventScroll } from "../../utils/doesSupportPreventScroll.js";
 import { useGridPrivateApiContext } from "../../hooks/utils/useGridPrivateApiContext.js";
 import { ColumnHeaderMenuIcon } from "./ColumnHeaderMenuIcon.js";
 import { GridColumnHeaderMenu } from "../menu/columnMenu/GridColumnHeaderMenu.js";
@@ -160,9 +161,17 @@ function GridColumnHeaderItem(props) {
     if (hasFocus && !columnMenuState.open) {
       const focusableElement = headerCellRef.current.querySelector('[tabindex="0"]');
       const elementToFocus = focusableElement || headerCellRef.current;
-      elementToFocus?.focus();
-      if (apiRef.current.columnHeadersContainerRef?.current) {
-        apiRef.current.columnHeadersContainerRef.current.scrollLeft = 0;
+      if (!elementToFocus) {
+        return;
+      }
+      if (doesSupportPreventScroll()) {
+        elementToFocus.focus({
+          preventScroll: true
+        });
+      } else {
+        const scrollPosition = apiRef.current.getScrollPosition();
+        elementToFocus.focus();
+        apiRef.current.scroll(scrollPosition);
       }
     }
   }, [apiRef, hasFocus]);

package/modern/components/columnHeaders/GridGenericColumnHeaderItem.js

@@ -5,7 +5,6 @@ import * as React from 'react';
 import clsx from 'clsx';
 import { unstable_useForkRef as useForkRef } from '@mui/utils';
 import { forwardRef } from '@mui/x-internals/forwardRef';
-import { useGridPrivateApiContext } from "../../hooks/utils/useGridPrivateApiContext.js";
 import { GridColumnHeaderTitle } from "./GridColumnHeaderTitle.js";
 import { GridColumnHeaderSeparator } from "./GridColumnHeaderSeparator.js";
 import { useGridRootProps } from "../../hooks/utils/useGridRootProps.js";
@@ -17,7 +16,6 @@ const GridGenericColumnHeaderItem = forwardRef(function GridGenericColumnHeaderI
       height,
       isResizing,
       sortDirection,
-      hasFocus,
       tabIndex,
       separatorSide,
       isDraggable,
@@ -35,7 +33,6 @@ const GridGenericColumnHeaderItem = forwardRef(function GridGenericColumnHeaderI
       style
     } = props,
     other = _objectWithoutPropertiesLoose(props, _excluded);
-  const apiRef = useGridPrivateApiContext();
   const rootProps = useGridRootProps();
   const headerCellRef = React.useRef(null);
   const handleRef = useForkRef(headerCellRef, ref);
@@ -43,17 +40,6 @@ const GridGenericColumnHeaderItem = forwardRef(function GridGenericColumnHeaderI
   if (sortDirection != null) {
     ariaSort = sortDirection === 'asc' ? 'ascending' : 'descending';
   }
-  React.useLayoutEffect(() => {
-    const columnMenuState = apiRef.current.state.columnMenu;
-    if (hasFocus && !columnMenuState.open) {
-      const focusableElement = headerCellRef.current.querySelector('[tabindex="0"]');
-      const elementToFocus = focusableElement || headerCellRef.current;
-      elementToFocus?.focus();
-      if (apiRef.current.columnHeadersContainerRef?.current) {
-        apiRef.current.columnHeadersContainerRef.current.scrollLeft = 0;
-      }
-    }
-  }, [apiRef, hasFocus]);
   return /*#__PURE__*/_jsxs("div", _extends({
     className: clsx(classes.root, headerClassName),
     style: _extends({}, style, {

package/modern/hooks/features/dimensions/useGridDimensions.js

@@ -67,6 +67,21 @@ export function useGridDimensions(apiRef, props) {
   const densityFactor = useGridSelector(apiRef, gridDensityFactorSelector);
   const columnsTotalWidth = useGridSelector(apiRef, columnsTotalWidthSelector);
   const isFirstSizing = React.useRef(true);
+
+  // Vertical scrollbar oscillation detector.
+  // Counts consecutive hasScrollY flips that happen with no row-height change.
+  // After 2 flips it is certainly a layout feedback loop, so every further flip
+  // is forced to false (no scrollbar). The counter resets when row heights change.
+  // Only vertical scrollbar can oscillate because column widths are never 'auto'.
+  // https://github.com/mui/mui-x/issues/20539
+  const scrollYOscillation = React.useRef({
+    counter: 0,
+    heights: {
+      content: 0,
+      pinnedTop: 0,
+      pinnedBottom: 0
+    }
+  });
   const {
     rowHeight,
     headerHeight,
@@ -134,6 +149,7 @@ export function useGridDimensions(apiRef, props) {
       width: nonPinnedColumnsTotalWidth,
       height: roundToDecimalPlaces(rowsMeta.currentPageTotalHeight, 1)
     };
+    const prevDimensions = apiRef.current.state.dimensions;
     let viewportOuterSize;
     let viewportInnerSize;
     let hasScrollX = false;
@@ -171,6 +187,36 @@ export function useGridDimensions(apiRef, props) {
           hasScrollY = content.height + scrollbarSize > container.height;
         }
       }
+
+      // Detect vertical scrollbar oscillation.
+      // Track consecutive hasScrollY flips with no row-height change.
+      // Once confirmed (≥ 2 flips), force hasScrollY off — the scrollbar is
+      // not genuinely needed, it is a layout feedback loop caused by stale
+      // rootSize or the horizontal scrollbar's height cascading.
+      {
+        const osc = scrollYOscillation.current;
+        const heightsChanged = rowsMeta.currentPageTotalHeight !== osc.heights.content || rowsMeta.pinnedTopRowsTotalHeight !== osc.heights.pinnedTop || rowsMeta.pinnedBottomRowsTotalHeight !== osc.heights.pinnedBottom;
+        if (heightsChanged) {
+          osc.counter = 0;
+          osc.heights = {
+            content: rowsMeta.currentPageTotalHeight,
+            pinnedTop: rowsMeta.pinnedTopRowsTotalHeight,
+            pinnedBottom: rowsMeta.pinnedBottomRowsTotalHeight
+          };
+        }
+        if (prevDimensions.isReady && hasScrollY !== prevDimensions.hasScrollY) {
+          if (!heightsChanged) {
+            osc.counter += 1;
+          }
+          if (osc.counter >= 2) {
+            hasScrollY = false;
+            // Recompute hasScrollX without the vertical scrollbar's width impact,
+            // otherwise the cascade (hasScrollY → narrower viewport → hasScrollX)
+            // keeps the horizontal scrollbar/filler alive and the root keeps resizing.
+            hasScrollX = hasScrollXIfNoYScrollBar;
+          }
+        }
+      }
       if (hasScrollY) {
         viewportInnerSize.width -= scrollbarSize;
       }
@@ -205,7 +251,6 @@ export function useGridDimensions(apiRef, props) {
       topContainerHeight,
       bottomContainerHeight
     };
-    const prevDimensions = apiRef.current.state.dimensions;
     if (isDeepEqual(prevDimensions, newDimensions)) {
       return;
     }

package/modern/hooks/features/export/useGridPrintExport.js

@@ -201,7 +201,7 @@ export const useGridPrintExport = (apiRef, props) => {
     // Revert grid to previous state
     apiRef.current.restoreState(previousGridState.current || {});
     if (!previousGridState.current?.columns?.columnVisibilityModel) {
-      // if the apiRef.current.exportState(); did not exported the column visibility, we update it
+      // if the apiRef.current.exportState(); did not export the column visibility, we update it
       apiRef.current.setColumnVisibilityModel(previousColumnVisibility.current);
     }
     apiRef.current.setState(state => _extends({}, state, {
@@ -238,12 +238,7 @@ export const useGridPrintExport = (apiRef, props) => {
       }));
     }
     previousVirtualizationState.current = apiRef.current.state.virtualization;
-    apiRef.current.setState(state => _extends({}, state, {
-      virtualization: _extends({}, state.virtualization, {
-        enabled: false,
-        enabledForColumns: false
-      })
-    }));
+    apiRef.current.unstable_setVirtualization(false);
     await updateGridColumnsForPrint(options?.fields, options?.allColumns, options?.includeCheckboxes);
     updateGridRowsForPrint(options?.getRowsToExport ?? defaultGetRowsToExport);
     await raf(); // wait for the state changes to take action

package/modern/index.js

@@ -1,5 +1,5 @@
 /**
- * @mui/x-data-grid v7.29.11
+ * @mui/x-data-grid v7.29.13
  *
  * @license MIT
  * This source code is licensed under the MIT license found in the

package/node/components/columnHeaders/GridColumnGroupHeader.js

@@ -10,6 +10,7 @@ var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends")
 var React = _interopRequireWildcard(require("react"));
 var _utils = require("@mui/utils");
 var _RtlProvider = require("@mui/system/RtlProvider");
+var _doesSupportPreventScroll = require("../../utils/doesSupportPreventScroll");
 var _gridClasses = require("../../constants/gridClasses");
 var _useGridRootProps = require("../../hooks/utils/useGridRootProps");
 var _gridColumnGroupsSelector = require("../../hooks/features/columnGrouping/gridColumnGroupsSelector");
@@ -94,7 +95,18 @@ function GridColumnGroupHeader(props) {
     if (hasFocus) {
       const focusableElement = headerCellRef.current.querySelector('[tabindex="0"]');
       const elementToFocus = focusableElement || headerCellRef.current;
-      elementToFocus?.focus();
+      if (!elementToFocus) {
+        return;
+      }
+      if ((0, _doesSupportPreventScroll.doesSupportPreventScroll)()) {
+        elementToFocus.focus({
+          preventScroll: true
+        });
+      } else {
+        const scrollPosition = apiRef.current.getScrollPosition();
+        elementToFocus.focus();
+        apiRef.current.scroll(scrollPosition);
+      }
     }
   }, [apiRef, hasFocus]);
   const publish = React.useCallback(eventName => event => {

package/node/components/columnHeaders/GridColumnHeaderItem.js

@@ -13,6 +13,7 @@ var _clsx = _interopRequireDefault(require("clsx"));
 var _utils = require("@mui/utils");
 var _fastMemo = require("@mui/x-internals/fastMemo");
 var _RtlProvider = require("@mui/system/RtlProvider");
+var _doesSupportPreventScroll = require("../../utils/doesSupportPreventScroll");
 var _useGridPrivateApiContext = require("../../hooks/utils/useGridPrivateApiContext");
 var _ColumnHeaderMenuIcon = require("./ColumnHeaderMenuIcon");
 var _GridColumnHeaderMenu = require("../menu/columnMenu/GridColumnHeaderMenu");
@@ -168,9 +169,17 @@ function GridColumnHeaderItem(props) {
     if (hasFocus && !columnMenuState.open) {
       const focusableElement = headerCellRef.current.querySelector('[tabindex="0"]');
       const elementToFocus = focusableElement || headerCellRef.current;
-      elementToFocus?.focus();
-      if (apiRef.current.columnHeadersContainerRef?.current) {
-        apiRef.current.columnHeadersContainerRef.current.scrollLeft = 0;
+      if (!elementToFocus) {
+        return;
+      }
+      if ((0, _doesSupportPreventScroll.doesSupportPreventScroll)()) {
+        elementToFocus.focus({
+          preventScroll: true
+        });
+      } else {
+        const scrollPosition = apiRef.current.getScrollPosition();
+        elementToFocus.focus();
+        apiRef.current.scroll(scrollPosition);
       }
     }
   }, [apiRef, hasFocus]);

package/node/components/columnHeaders/GridGenericColumnHeaderItem.js

@@ -12,7 +12,6 @@ var React = _interopRequireWildcard(require("react"));
 var _clsx = _interopRequireDefault(require("clsx"));
 var _utils = require("@mui/utils");
 var _forwardRef = require("@mui/x-internals/forwardRef");
-var _useGridPrivateApiContext = require("../../hooks/utils/useGridPrivateApiContext");
 var _GridColumnHeaderTitle = require("./GridColumnHeaderTitle");
 var _GridColumnHeaderSeparator = require("./GridColumnHeaderSeparator");
 var _useGridRootProps = require("../../hooks/utils/useGridRootProps");
@@ -25,7 +24,6 @@ const GridGenericColumnHeaderItem = exports.GridGenericColumnHeaderItem = (0, _f
       height,
       isResizing,
       sortDirection,
-      hasFocus,
       tabIndex,
       separatorSide,
       isDraggable,
@@ -43,7 +41,6 @@ const GridGenericColumnHeaderItem = exports.GridGenericColumnHeaderItem = (0, _f
       style
     } = props,
     other = (0, _objectWithoutPropertiesLoose2.default)(props, _excluded);
-  const apiRef = (0, _useGridPrivateApiContext.useGridPrivateApiContext)();
   const rootProps = (0, _useGridRootProps.useGridRootProps)();
   const headerCellRef = React.useRef(null);
   const handleRef = (0, _utils.unstable_useForkRef)(headerCellRef, ref);
@@ -51,17 +48,6 @@ const GridGenericColumnHeaderItem = exports.GridGenericColumnHeaderItem = (0, _f
   if (sortDirection != null) {
     ariaSort = sortDirection === 'asc' ? 'ascending' : 'descending';
   }
-  React.useLayoutEffect(() => {
-    const columnMenuState = apiRef.current.state.columnMenu;
-    if (hasFocus && !columnMenuState.open) {
-      const focusableElement = headerCellRef.current.querySelector('[tabindex="0"]');
-      const elementToFocus = focusableElement || headerCellRef.current;
-      elementToFocus?.focus();
-      if (apiRef.current.columnHeadersContainerRef?.current) {
-        apiRef.current.columnHeadersContainerRef.current.scrollLeft = 0;
-      }
-    }
-  }, [apiRef, hasFocus]);
   return /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", (0, _extends2.default)({
     className: (0, _clsx.default)(classes.root, headerClassName),
     style: (0, _extends2.default)({}, style, {

package/node/hooks/features/dimensions/useGridDimensions.js

@@ -77,6 +77,21 @@ function useGridDimensions(apiRef, props) {
   const densityFactor = (0, _utils2.useGridSelector)(apiRef, _density.gridDensityFactorSelector);
   const columnsTotalWidth = (0, _utils2.useGridSelector)(apiRef, columnsTotalWidthSelector);
   const isFirstSizing = React.useRef(true);
+
+  // Vertical scrollbar oscillation detector.
+  // Counts consecutive hasScrollY flips that happen with no row-height change.
+  // After 2 flips it is certainly a layout feedback loop, so every further flip
+  // is forced to false (no scrollbar). The counter resets when row heights change.
+  // Only vertical scrollbar can oscillate because column widths are never 'auto'.
+  // https://github.com/mui/mui-x/issues/20539
+  const scrollYOscillation = React.useRef({
+    counter: 0,
+    heights: {
+      content: 0,
+      pinnedTop: 0,
+      pinnedBottom: 0
+    }
+  });
   const {
     rowHeight,
     headerHeight,
@@ -144,6 +159,7 @@ function useGridDimensions(apiRef, props) {
       width: nonPinnedColumnsTotalWidth,
       height: (0, _roundToDecimalPlaces.roundToDecimalPlaces)(rowsMeta.currentPageTotalHeight, 1)
     };
+    const prevDimensions = apiRef.current.state.dimensions;
     let viewportOuterSize;
     let viewportInnerSize;
     let hasScrollX = false;
@@ -181,6 +197,36 @@ function useGridDimensions(apiRef, props) {
           hasScrollY = content.height + scrollbarSize > container.height;
         }
       }
+
+      // Detect vertical scrollbar oscillation.
+      // Track consecutive hasScrollY flips with no row-height change.
+      // Once confirmed (≥ 2 flips), force hasScrollY off — the scrollbar is
+      // not genuinely needed, it is a layout feedback loop caused by stale
+      // rootSize or the horizontal scrollbar's height cascading.
+      {
+        const osc = scrollYOscillation.current;
+        const heightsChanged = rowsMeta.currentPageTotalHeight !== osc.heights.content || rowsMeta.pinnedTopRowsTotalHeight !== osc.heights.pinnedTop || rowsMeta.pinnedBottomRowsTotalHeight !== osc.heights.pinnedBottom;
+        if (heightsChanged) {
+          osc.counter = 0;
+          osc.heights = {
+            content: rowsMeta.currentPageTotalHeight,
+            pinnedTop: rowsMeta.pinnedTopRowsTotalHeight,
+            pinnedBottom: rowsMeta.pinnedBottomRowsTotalHeight
+          };
+        }
+        if (prevDimensions.isReady && hasScrollY !== prevDimensions.hasScrollY) {
+          if (!heightsChanged) {
+            osc.counter += 1;
+          }
+          if (osc.counter >= 2) {
+            hasScrollY = false;
+            // Recompute hasScrollX without the vertical scrollbar's width impact,
+            // otherwise the cascade (hasScrollY → narrower viewport → hasScrollX)
+            // keeps the horizontal scrollbar/filler alive and the root keeps resizing.
+            hasScrollX = hasScrollXIfNoYScrollBar;
+          }
+        }
+      }
       if (hasScrollY) {
         viewportInnerSize.width -= scrollbarSize;
       }
@@ -215,7 +261,6 @@ function useGridDimensions(apiRef, props) {
       topContainerHeight,
       bottomContainerHeight
     };
-    const prevDimensions = apiRef.current.state.dimensions;
     if ((0, _utils3.isDeepEqual)(prevDimensions, newDimensions)) {
       return;
     }

package/node/hooks/features/export/useGridPrintExport.js

@@ -209,7 +209,7 @@ const useGridPrintExport = (apiRef, props) => {
     // Revert grid to previous state
     apiRef.current.restoreState(previousGridState.current || {});
     if (!previousGridState.current?.columns?.columnVisibilityModel) {
-      // if the apiRef.current.exportState(); did not exported the column visibility, we update it
+      // if the apiRef.current.exportState(); did not export the column visibility, we update it
       apiRef.current.setColumnVisibilityModel(previousColumnVisibility.current);
     }
     apiRef.current.setState(state => (0, _extends2.default)({}, state, {
@@ -246,12 +246,7 @@ const useGridPrintExport = (apiRef, props) => {
       }));
     }
     previousVirtualizationState.current = apiRef.current.state.virtualization;
-    apiRef.current.setState(state => (0, _extends2.default)({}, state, {
-      virtualization: (0, _extends2.default)({}, state.virtualization, {
-        enabled: false,
-        enabledForColumns: false
-      })
-    }));
+    apiRef.current.unstable_setVirtualization(false);
     await updateGridColumnsForPrint(options?.fields, options?.allColumns, options?.includeCheckboxes);
     updateGridRowsForPrint(options?.getRowsToExport ?? _utils2.defaultGetRowsToExport);
     await raf(); // wait for the state changes to take action

package/node/index.js

@@ -1,5 +1,5 @@
 /**
- * @mui/x-data-grid v7.29.11
+ * @mui/x-data-grid v7.29.13
  *
  * @license MIT
  * This source code is licensed under the MIT license found in the

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@mui/x-data-grid",
-  "version": "7.29.11",
+  "version": "7.29.13",
   "description": "The Community plan edition of the Data Grid components (MUI X).",
   "author": "MUI Team",
   "main": "./node/index.js",