@mui/x-data-grid 9.14.0 → 9.15.0

package/hooks/core/strategyProcessing/useGridStrategyProcessing.mjs

@@ -1,8 +1,8 @@
 'use client';
 
 import _formatErrorMessage from "@mui/x-internals/formatErrorMessage";
-import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
-import _toPropertyKey from "@babel/runtime/helpers/esm/toPropertyKey";
+import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/objectWithoutPropertiesLoose";
+import _toPropertyKey from "@babel/runtime/helpers/toPropertyKey";
 import * as React from 'react';
 import { GridStrategyGroup } from "./gridStrategyProcessingApi.mjs";
 import { useGridApiMethod } from "../../utils/useGridApiMethod.mjs";

package/hooks/core/useGridApiInitialization.js

@@ -9,7 +9,7 @@ exports.unwrapPrivateAPI = unwrapPrivateAPI;
 exports.useGridApiInitialization = useGridApiInitialization;
 var React = _interopRequireWildcard(require("react"));
 var _EventManager = require("@mui/x-internals/EventManager");
-var _store = require("@mui/x-internals/store");
+var _store = require("@base-ui/utils/store");
 var _useGridApiMethod = require("../utils/useGridApiMethod");
 var _signature = require("../../constants/signature");
 var _getPublicApiRef = require("../../utils/getPublicApiRef");

package/hooks/core/useGridApiInitialization.mjs

@@ -2,7 +2,7 @@
 
 import * as React from 'react';
 import { EventManager } from '@mui/x-internals/EventManager';
-import { Store } from '@mui/x-internals/store';
+import { Store } from '@base-ui/utils/store';
 import { useGridApiMethod } from "../utils/useGridApiMethod.mjs";
 import { GridSignature } from "../../constants/signature.mjs";
 import { getPublicApiRef } from "../../utils/getPublicApiRef.mjs";

package/hooks/core/useGridIsRtl.mjs

@@ -1,6 +1,6 @@
 'use client';
 
-import _extends from "@babel/runtime/helpers/esm/extends";
+import _extends from "@babel/runtime/helpers/extends";
 import * as React from 'react';
 import { useRtl } from '@mui/system/RtlProvider';
 export const useGridIsRtl = apiRef => {

package/hooks/core/useGridProps.mjs

@@ -1,6 +1,6 @@
 'use client';
 
-import _extends from "@babel/runtime/helpers/esm/extends";
+import _extends from "@babel/runtime/helpers/extends";
 import * as React from 'react';
 export const propsStateInitializer = (state, props) => {
   return _extends({}, state, {

package/hooks/core/useGridStateInitialization.mjs

@@ -1,6 +1,6 @@
 'use client';
 
-import _extends from "@babel/runtime/helpers/esm/extends";
+import _extends from "@babel/runtime/helpers/extends";
 import _formatErrorMessage from "@mui/x-internals/formatErrorMessage";
 import * as React from 'react';
 import { useGridApiMethod } from "../utils/index.mjs";

package/hooks/core/useGridVirtualizer.d.mts

@@ -4,10 +4,10 @@ import { Dimensions, LayoutDataGrid, Virtualization } from '@mui/x-virtualizer';
  * Virtualizer setup
  */
 export declare function useGridVirtualizer(): {
-  store: import("@mui/x-internals/store").Store<Dimensions.State & Virtualization.State<LayoutDataGrid> & import("@mui/x-virtualizer").Colspan.State & import("@mui/x-virtualizer").Rowspan.State>;
+  store: import("@base-ui/utils/store").Store<Dimensions.State & Virtualization.State<LayoutDataGrid> & import("@mui/x-virtualizer").Colspan.State & import("@mui/x-virtualizer").Rowspan.State>;
   api: {
     updateDimensions: (firstUpdate?: boolean) => void;
-    debouncedUpdateDimensions: (((firstUpdate?: boolean) => void) & import("@mui/x-internals/throttle").Cancelable) | undefined;
+    debouncedUpdateDimensions: ((firstUpdate?: boolean) => void) & import("@mui/x-internals/throttle").Cancelable | undefined;
     rowsMeta: {
       getRowHeight: (rowId: import("@mui/x-virtualizer").RowId) => any;
       setLastMeasuredRowIndex: (index: number) => void;

package/hooks/core/useGridVirtualizer.d.ts

@@ -4,10 +4,10 @@ import { Dimensions, LayoutDataGrid, Virtualization } from '@mui/x-virtualizer';
  * Virtualizer setup
  */
 export declare function useGridVirtualizer(): {
-  store: import("@mui/x-internals/store").Store<Dimensions.State & Virtualization.State<LayoutDataGrid> & import("@mui/x-virtualizer").Colspan.State & import("@mui/x-virtualizer").Rowspan.State>;
+  store: import("@base-ui/utils/store").Store<Dimensions.State & Virtualization.State<LayoutDataGrid> & import("@mui/x-virtualizer").Colspan.State & import("@mui/x-virtualizer").Rowspan.State>;
   api: {
     updateDimensions: (firstUpdate?: boolean) => void;
-    debouncedUpdateDimensions: (((firstUpdate?: boolean) => void) & import("@mui/x-internals/throttle").Cancelable) | undefined;
+    debouncedUpdateDimensions: ((firstUpdate?: boolean) => void) & import("@mui/x-internals/throttle").Cancelable | undefined;
     rowsMeta: {
       getRowHeight: (rowId: import("@mui/x-virtualizer").RowId) => any;
       setLastMeasuredRowIndex: (index: number) => void;

package/hooks/core/useGridVirtualizer.js

@@ -13,9 +13,9 @@ var _useEventCallback = _interopRequireDefault(require("@mui/utils/useEventCallb
 var _RtlProvider = require("@mui/system/RtlProvider");
 var _math = require("@mui/x-internals/math");
 var _lruMemoize = require("@mui/x-internals/lruMemoize");
-var _store = require("@mui/x-internals/store");
+var _useStoreEffect = require("@mui/x-internals/useStoreEffect");
 var _xVirtualizer = require("@mui/x-virtualizer");
-var _useFirstRender = require("../utils/useFirstRender");
+var _useOnFirstRender = require("@base-ui/utils/useOnFirstRender");
 var _createSelector = require("../../utils/createSelector");
 var _useGridSelector = require("../utils/useGridSelector");
 var _gridDimensionsSelectors = require("../features/dimensions/gridDimensionsSelectors");
@@ -252,12 +252,12 @@ function useGridVirtualizer() {
   // initialization code runs between those two moments.
   //
   // TODO(v9): Remove this
-  (0, _useFirstRender.useFirstRender)(() => {
+  (0, _useOnFirstRender.useOnFirstRender)(() => {
     apiRef.current.store.state.dimensions = addGridDimensions(virtualizer.store.state.dimensions, headerHeight, groupHeaderHeight, headerFilterHeight, headersTotalHeight);
     apiRef.current.store.state.rowsMeta = virtualizer.store.state.rowsMeta;
     apiRef.current.store.state.virtualization = virtualizer.store.state.virtualization;
   });
-  (0, _store.useStoreEffect)(virtualizer.store, _xVirtualizer.Dimensions.selectors.dimensions, (_, dimensions) => {
+  (0, _useStoreEffect.useStoreEffect)(virtualizer.store, _xVirtualizer.Dimensions.selectors.dimensions, (_, dimensions) => {
     if (!dimensions.isReady) {
       return;
     }
@@ -265,14 +265,14 @@ function useGridVirtualizer() {
       dimensions: addGridDimensions(dimensions, headerHeight, groupHeaderHeight, headerFilterHeight, headersTotalHeight)
     }));
   });
-  (0, _store.useStoreEffect)(virtualizer.store, _xVirtualizer.Dimensions.selectors.rowsMeta, (_, rowsMeta) => {
+  (0, _useStoreEffect.useStoreEffect)(virtualizer.store, _xVirtualizer.Dimensions.selectors.rowsMeta, (_, rowsMeta) => {
     if (rowsMeta !== apiRef.current.state.rowsMeta) {
       apiRef.current.setState(gridState => (0, _extends2.default)({}, gridState, {
         rowsMeta
       }));
     }
   });
-  (0, _store.useStoreEffect)(virtualizer.store, _xVirtualizer.Virtualization.selectors.store, (_, virtualization) => {
+  (0, _useStoreEffect.useStoreEffect)(virtualizer.store, _xVirtualizer.Virtualization.selectors.store, (_, virtualization) => {
     if (virtualization.renderContext === _xVirtualizer.EMPTY_RENDER_CONTEXT) {
       return;
     }

package/hooks/core/useGridVirtualizer.mjs

@@ -1,13 +1,13 @@
-import _extends from "@babel/runtime/helpers/esm/extends";
+import _extends from "@babel/runtime/helpers/extends";
 import * as React from 'react';
 import useLazyRef from '@mui/utils/useLazyRef';
 import useEventCallback from '@mui/utils/useEventCallback';
 import { useRtl } from '@mui/system/RtlProvider';
 import { roundToDecimalPlaces } from '@mui/x-internals/math';
 import { lruMemoize } from '@mui/x-internals/lruMemoize';
-import { useStoreEffect } from '@mui/x-internals/store';
+import { useStoreEffect } from '@mui/x-internals/useStoreEffect';
 import { useVirtualizer, Dimensions, LayoutDataGrid, Virtualization, EMPTY_RENDER_CONTEXT } from '@mui/x-virtualizer';
-import { useFirstRender } from "../utils/useFirstRender.mjs";
+import { useOnFirstRender } from '@base-ui/utils/useOnFirstRender';
 import { createSelector } from "../../utils/createSelector.mjs";
 import { useGridSelector } from "../utils/useGridSelector.mjs";
 import { gridHasFillerSelector, gridVerticalScrollbarWidthSelector } from "../features/dimensions/gridDimensionsSelectors.mjs";
@@ -244,7 +244,7 @@ export function useGridVirtualizer() {
   // initialization code runs between those two moments.
   //
   // TODO(v9): Remove this
-  useFirstRender(() => {
+  useOnFirstRender(() => {
     apiRef.current.store.state.dimensions = addGridDimensions(virtualizer.store.state.dimensions, headerHeight, groupHeaderHeight, headerFilterHeight, headersTotalHeight);
     apiRef.current.store.state.rowsMeta = virtualizer.store.state.rowsMeta;
     apiRef.current.store.state.virtualization = virtualizer.store.state.virtualization;

package/hooks/features/columnGrouping/gridColumnGroupsUtils.mjs

@@ -1,6 +1,6 @@
-import _extends from "@babel/runtime/helpers/esm/extends";
+import _extends from "@babel/runtime/helpers/extends";
 import _formatErrorMessage from "@mui/x-internals/formatErrorMessage";
-import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
+import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/objectWithoutPropertiesLoose";
 const _excluded = ["groupId", "children"];
 import { isLeaf } from "../../../models/gridColumnGrouping.mjs";
 export const createGroupLookup = columnGroupingModel => {

package/hooks/features/columnGrouping/useGridColumnGrouping.mjs

@@ -1,6 +1,6 @@
 'use client';
 
-import _extends from "@babel/runtime/helpers/esm/extends";
+import _extends from "@babel/runtime/helpers/extends";
 import * as React from 'react';
 import { gridColumnGroupsLookupSelector, gridColumnGroupsUnwrappedModelSelector } from "./gridColumnGroupsSelector.mjs";
 import { useGridApiMethod } from "../../utils/useGridApiMethod.mjs";

package/hooks/features/columnHeaders/useGridColumnHeaders.mjs

@@ -1,6 +1,6 @@
 'use client';
 
-import _extends from "@babel/runtime/helpers/esm/extends";
+import _extends from "@babel/runtime/helpers/extends";
 import * as React from 'react';
 import clsx from 'clsx';
 import { styled } from '@mui/material/styles';

package/hooks/features/columnMenu/getColumnMenuItemKeys.mjs

@@ -1,4 +1,4 @@
-import _extends from "@babel/runtime/helpers/esm/extends";
+import _extends from "@babel/runtime/helpers/extends";
 /**
  * Returns the list of column menu item keys (sorted by `displayOrder`) that should be rendered for a given column.
  * This is shared between the column header (to know if menu is empty) and the menu itself (to render items).

package/hooks/features/columnMenu/useGridColumnMenu.mjs

@@ -1,6 +1,6 @@
 'use client';
 
-import _extends from "@babel/runtime/helpers/esm/extends";
+import _extends from "@babel/runtime/helpers/extends";
 import * as React from 'react';
 import { useGridLogger, useGridApiMethod, useGridEvent } from "../../utils/index.mjs";
 import { gridColumnMenuSelector } from "./columnMenuSelector.mjs";

package/hooks/features/columnMenu/useGridColumnMenuSlots.mjs

@@ -1,5 +1,5 @@
-import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
-import _extends from "@babel/runtime/helpers/esm/extends";
+import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/objectWithoutPropertiesLoose";
+import _extends from "@babel/runtime/helpers/extends";
 const _excluded = ["displayOrder"];
 import * as React from 'react';
 import { useGridRootProps } from "../../utils/useGridRootProps.mjs";

package/hooks/features/columnResize/useGridColumnResize.mjs

@@ -1,6 +1,6 @@
 'use client';
 
-import _extends from "@babel/runtime/helpers/esm/extends";
+import _extends from "@babel/runtime/helpers/extends";
 import * as React from 'react';
 import useEventCallback from '@mui/utils/useEventCallback';
 import ownerDocument from '@mui/utils/ownerDocument';

package/hooks/features/columns/gridColumnsInterfaces.d.mts

@@ -2,7 +2,7 @@ import type { GridColDef, GridStateColDef } from "../../../models/colDef/gridCol
 import type { GridColumnDimensionProperties } from "./gridColumnsUtils.mjs";
 export declare enum GridPinnedColumnPosition {
   LEFT = "left",
-  RIGHT = "right",
+  RIGHT = "right"
 }
 export type GridColumnLookup = {
   [field: string]: GridStateColDef;

package/hooks/features/columns/gridColumnsInterfaces.d.ts

@@ -2,7 +2,7 @@ import type { GridColDef, GridStateColDef } from "../../../models/colDef/gridCol
 import type { GridColumnDimensionProperties } from "./gridColumnsUtils.js";
 export declare enum GridPinnedColumnPosition {
   LEFT = "left",
-  RIGHT = "right",
+  RIGHT = "right"
 }
 export type GridColumnLookup = {
   [field: string]: GridStateColDef;

package/hooks/features/columns/gridColumnsUtils.d.mts

@@ -7,7 +7,7 @@ import type { GridApiCommon } from "../../../models/api/gridApiCommon.mjs";
 import type { GridRowEntry } from "../../../models/gridRows.mjs";
 import type { GridDimensions } from "../dimensions/gridDimensionsApi.mjs";
 export declare const COLUMNS_DIMENSION_PROPERTIES: readonly ['maxWidth', 'minWidth', 'width', 'flex'];
-export type GridColumnDimensionProperties = (typeof COLUMNS_DIMENSION_PROPERTIES)[number];
+export type GridColumnDimensionProperties = typeof COLUMNS_DIMENSION_PROPERTIES[number];
 /**
  * Computes width for flex columns.
  * Based on CSS Flexbox specification:

package/hooks/features/columns/gridColumnsUtils.d.ts

@@ -7,7 +7,7 @@ import type { GridApiCommon } from "../../../models/api/gridApiCommon.js";
 import type { GridRowEntry } from "../../../models/gridRows.js";
 import type { GridDimensions } from "../dimensions/gridDimensionsApi.js";
 export declare const COLUMNS_DIMENSION_PROPERTIES: readonly ['maxWidth', 'minWidth', 'width', 'flex'];
-export type GridColumnDimensionProperties = (typeof COLUMNS_DIMENSION_PROPERTIES)[number];
+export type GridColumnDimensionProperties = typeof COLUMNS_DIMENSION_PROPERTIES[number];
 /**
  * Computes width for flex columns.
  * Based on CSS Flexbox specification:

package/hooks/features/columns/gridColumnsUtils.mjs

@@ -1,4 +1,4 @@
-import _extends from "@babel/runtime/helpers/esm/extends";
+import _extends from "@babel/runtime/helpers/extends";
 import resolveProps from '@mui/utils/resolveProps';
 import { GRID_STRING_COL_DEF } from "../../../colDef/index.mjs";
 import { getRegisteredColumnTypeDef, isCommunityColumnType } from "../../../colDef/gridColumnTypesRegistry.mjs";

package/hooks/features/columns/useGridColumns.js

@@ -360,7 +360,7 @@ function useGridColumns(apiRef, props) {
     }
     const lookup = (0, _gridColumnsSelector.gridColumnLookupSelector)(apiRef);
     if (orderedFields.some(field => lookup[field]?.type === 'multiSelect')) {
-      (0, _warning.warnOnce)(['MUI X: The `multiSelect` column type is available in Pro and Premium versions', 'Use `<DataGridPro />` or `<DataGridPremium />` to render it correctly.', 'For more details, see https://mui.com/x/react-data-grid/column-definition/#multi-select-keyboard-interactions']);
+      (0, _warning.warnOnce)(['MUI X: The `multiSelect` column type is available in Pro and Premium versions', 'Use `<DataGridPro />` or `<DataGridPremium />` to render it correctly.', 'For more details, see https://mui.com/x/react-data-grid/column-definition/#multi-select-keyboard-interactions'].join('\n'));
     }
   }, [apiRef, props.signature]);
   (0, _useGridEvent.useGridEvent)(apiRef, 'columnsChange', checkMultiSelectColumns);

package/hooks/features/columns/useGridColumns.mjs

@@ -1,6 +1,6 @@
 'use client';
 
-import _extends from "@babel/runtime/helpers/esm/extends";
+import _extends from "@babel/runtime/helpers/extends";
 import * as React from 'react';
 import { warnOnce } from '@mui/x-internals/warning';
 import { useGridApiMethod } from "../../utils/useGridApiMethod.mjs";
@@ -351,7 +351,7 @@ export function useGridColumns(apiRef, props) {
     }
     const lookup = gridColumnLookupSelector(apiRef);
     if (orderedFields.some(field => lookup[field]?.type === 'multiSelect')) {
-      warnOnce(['MUI X: The `multiSelect` column type is available in Pro and Premium versions', 'Use `<DataGridPro />` or `<DataGridPremium />` to render it correctly.', 'For more details, see https://mui.com/x/react-data-grid/column-definition/#multi-select-keyboard-interactions']);
+      warnOnce(['MUI X: The `multiSelect` column type is available in Pro and Premium versions', 'Use `<DataGridPro />` or `<DataGridPremium />` to render it correctly.', 'For more details, see https://mui.com/x/react-data-grid/column-definition/#multi-select-keyboard-interactions'].join('\n'));
     }
   }, [apiRef, props.signature]);
   useGridEvent(apiRef, 'columnsChange', checkMultiSelectColumns);

package/hooks/features/dataSource/cache.js

@@ -9,11 +9,11 @@ function getKeyDefault(params) {
   return JSON.stringify([params.filterModel, params.sortModel, params.start, params.end]);
 }
 class GridDataSourceCacheDefault {
+  cache = {};
   constructor({
     ttl = 300_000,
     getKey = getKeyDefault
   }) {
-    this.cache = {};
     this.ttl = ttl;
     this.getKey = getKey;
   }

package/hooks/features/dataSource/cache.mjs

@@ -2,11 +2,11 @@ export function getKeyDefault(params) {
   return JSON.stringify([params.filterModel, params.sortModel, params.start, params.end]);
 }
 export class GridDataSourceCacheDefault {
+  cache = {};
   constructor({
     ttl = 300_000,
     getKey = getKeyDefault
   }) {
-    this.cache = {};
     this.ttl = ttl;
     this.getKey = getKey;
   }

package/hooks/features/dataSource/useGridDataSourceBase.js

@@ -25,6 +25,7 @@ var _columns = require("../columns");
 var _gridFilterUtils = require("../filter/gridFilterUtils");
 var _gridDataSourceSelector = require("./gridDataSourceSelector");
 var _useGridDataSourceFilterModelChange = require("./useGridDataSourceFilterModelChange");
+var _useGridDataSourcePolling = require("./useGridDataSourcePolling");
 var _utils2 = require("./utils");
 var _cache = require("./cache");
 var _gridDataSourceError = require("./gridDataSourceError");
@@ -55,9 +56,7 @@ const useGridDataSourceBase = (apiRef, props, options = {}) => {
   const rowsAreUpToDate = React.useRef(false);
   // Requests that are still running and will apply their response when they settle.
   const pendingRequestCount = React.useRef(0);
-  const pollingIntervalRef = React.useRef(null);
   const onDataSourceErrorProp = props.onDataSourceError;
-  const revalidateMs = props.dataSourceRevalidateMs;
   const cacheChunkManager = (0, _useLazyRef.default)(() => {
     if (!props.pagination) {
       return new _utils2.CacheChunkManager(paginationModel.pageSize);
@@ -149,7 +148,7 @@ const useGridDataSourceBase = (apiRef, props, options = {}) => {
             cause: originalError
           }));
         } else if (process.env.NODE_ENV !== 'production') {
-          (0, _warning.warnOnce)(['MUI X: A call to `dataSource.getRows()` threw an error which was not handled because `onDataSourceError()` is missing.', 'To handle the error pass a callback to the `onDataSourceError` prop, for example `<DataGrid onDataSourceError={(error) => ...} />`.', 'For more detail, see https://mui.com/x/react-data-grid/server-side-data/#error-handling.'], 'error');
+          (0, _warning.errorOnce)(['MUI X: A call to `dataSource.getRows()` threw an error which was not handled because `onDataSourceError()` is missing.', 'To handle the error pass a callback to the `onDataSourceError` prop, for example `<DataGrid onDataSourceError={(error) => ...} />`.', 'For more detail, see https://mui.com/x/react-data-grid/server-side-data/#error-handling.'].join('\n'));
         }
       }
     } finally {
@@ -210,19 +209,16 @@ const useGridDataSourceBase = (apiRef, props, options = {}) => {
       // Ignore background revalidation errors.
     }
   });
-  const stopPolling = React.useCallback(() => {
-    if (pollingIntervalRef.current !== null) {
-      clearInterval(pollingIntervalRef.current);
-      pollingIntervalRef.current = null;
-    }
-  }, []);
-  const startPolling = (0, _useEventCallback.default)(() => {
-    stopPolling();
-    if (revalidateMs <= 0 || !standardRowsUpdateStrategyActive) {
-      return;
-    }
-    pollingIntervalRef.current = setInterval(revalidate, revalidateMs);
+  const {
+    startPolling: startPollingWith,
+    stopPolling
+  } = (0, _useGridDataSourcePolling.useGridDataSourcePolling)({
+    revalidateMs: props.dataSourceRevalidateMs,
+    isActive: standardRowsUpdateStrategyActive,
+    // Rows that are still loading start the polling when they arrive.
+    shouldResume: () => rowsAreUpToDate.current
   });
+  const startPolling = React.useCallback(() => startPollingWith(revalidate), [startPollingWith, revalidate]);
   const handleDataUpdate = React.useCallback(params => {
     if ('error' in params) {
       // Reset the rows on error, even with `dataSourceKeepPreviousData`. The previous
@@ -276,7 +272,7 @@ const useGridDataSourceBase = (apiRef, props, options = {}) => {
           cause: errorThrown
         }));
       } else if (process.env.NODE_ENV !== 'production') {
-        (0, _warning.warnOnce)(['MUI X: A call to `dataSource.updateRow()` threw an error which was not handled because `onDataSourceError()` is missing.', 'To handle the error pass a callback to the `onDataSourceError` prop, for example `<DataGrid onDataSourceError={(error) => ...} />`.', 'For more detail, see https://mui.com/x/react-data-grid/server-side-data/#error-handling.'], 'error');
+        (0, _warning.errorOnce)(['MUI X: A call to `dataSource.updateRow()` threw an error which was not handled because `onDataSourceError()` is missing.', 'To handle the error pass a callback to the `onDataSourceError` prop, for example `<DataGrid onDataSourceError={(error) => ...} />`.', 'For more detail, see https://mui.com/x/react-data-grid/server-side-data/#error-handling.'].join('\n'));
       }
       throw errorThrown; // Let the caller handle the error further
     }
@@ -329,17 +325,6 @@ const useGridDataSourceBase = (apiRef, props, options = {}) => {
     const newCache = getCache(props.dataSourceCache, options.cacheOptions);
     setCache(prevCache => prevCache !== newCache ? newCache : prevCache);
   }, [props.dataSourceCache, options.cacheOptions]);
-  React.useEffect(() => {
-    if (!standardRowsUpdateStrategyActive) {
-      stopPolling();
-    }
-  }, [standardRowsUpdateStrategyActive, stopPolling]);
-  React.useEffect(() => {
-    if (revalidateMs <= 0) {
-      stopPolling();
-    }
-  }, [revalidateMs, stopPolling]);
-  React.useEffect(() => stopPolling, [stopPolling]);
   const lastApiRef = React.useRef(apiRef);
   const lastStrategy = React.useRef(currentStrategy);
   const lastDataSource = React.useRef(props.dataSource);
@@ -388,7 +373,7 @@ const useGridDataSourceBase = (apiRef, props, options = {}) => {
     // strategies always reset the rows on refetch to keep their order consistent with the
     // response. Warn so the limitation is discoverable at runtime, not only in the docs.
     if (process.env.NODE_ENV !== 'production' && props.dataSourceKeepPreviousData && (currentStrategy === _utils2.DataSourceRowsUpdateStrategy.GroupedData || currentStrategy === _utils2.DataSourceRowsUpdateStrategy.LazyLoadedGroupedData)) {
-      (0, _warning.warnOnce)(['MUI X: The `dataSourceKeepPreviousData` prop only applies to flat data.', 'It is ignored when tree data or row grouping is enabled, because the rows are always reset on refetch to keep their order consistent with the response.', 'For more details, see https://mui.com/x/react-data-grid/server-side-data/#keep-previous-data-while-fetching.']);
+      (0, _warning.warnOnce)(['MUI X: The `dataSourceKeepPreviousData` prop only applies to flat data.', 'It is ignored when tree data or row grouping is enabled, because the rows are always reset on refetch to keep their order consistent with the response.', 'For more details, see https://mui.com/x/react-data-grid/server-side-data/#keep-previous-data-while-fetching.'].join('\n'));
     }
   }, [props.dataSourceKeepPreviousData, currentStrategy]);
   return {

package/hooks/features/dataSource/useGridDataSourceBase.mjs

@@ -1,13 +1,13 @@
 'use client';
 
-import _extends from "@babel/runtime/helpers/esm/extends";
-import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
+import _extends from "@babel/runtime/helpers/extends";
+import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/objectWithoutPropertiesLoose";
 const _excluded = ["skipCache", "keepChildrenExpanded", "showChildrenLoading"];
 import * as React from 'react';
 import useLazyRef from '@mui/utils/useLazyRef';
 import useEventCallback from '@mui/utils/useEventCallback';
 import debounce from '@mui/utils/debounce';
-import { warnOnce } from '@mui/x-internals/warning';
+import { errorOnce, warnOnce } from '@mui/x-internals/warning';
 import { isDeepEqual } from '@mui/x-internals/isDeepEqual';
 import { GRID_ROOT_GROUP_ID, getReplaceRow, isReplaceUpdate } from "../rows/gridRowsUtils.mjs";
 import { runIf } from "../../../utils/utils.mjs";
@@ -19,6 +19,7 @@ import { gridColumnLookupSelector } from "../columns/index.mjs";
 import { removeIncompleteFilterItems } from "../filter/gridFilterUtils.mjs";
 import { gridGetRowsParamsSelector } from "./gridDataSourceSelector.mjs";
 import { useGridDataSourceFilterModelChange } from "./useGridDataSourceFilterModelChange.mjs";
+import { useGridDataSourcePolling } from "./useGridDataSourcePolling.mjs";
 import { CacheChunkManager, DataSourceRowsUpdateStrategy } from "./utils.mjs";
 import { GridDataSourceCacheDefault } from "./cache.mjs";
 import { GridGetRowsError, GridUpdateRowError } from "./gridDataSourceError.mjs";
@@ -48,9 +49,7 @@ export const useGridDataSourceBase = (apiRef, props, options = {}) => {
   const rowsAreUpToDate = React.useRef(false);
   // Requests that are still running and will apply their response when they settle.
   const pendingRequestCount = React.useRef(0);
-  const pollingIntervalRef = React.useRef(null);
   const onDataSourceErrorProp = props.onDataSourceError;
-  const revalidateMs = props.dataSourceRevalidateMs;
   const cacheChunkManager = useLazyRef(() => {
     if (!props.pagination) {
       return new CacheChunkManager(paginationModel.pageSize);
@@ -142,7 +141,7 @@ export const useGridDataSourceBase = (apiRef, props, options = {}) => {
             cause: originalError
           }));
         } else if (process.env.NODE_ENV !== 'production') {
-          warnOnce(['MUI X: A call to `dataSource.getRows()` threw an error which was not handled because `onDataSourceError()` is missing.', 'To handle the error pass a callback to the `onDataSourceError` prop, for example `<DataGrid onDataSourceError={(error) => ...} />`.', 'For more detail, see https://mui.com/x/react-data-grid/server-side-data/#error-handling.'], 'error');
+          errorOnce(['MUI X: A call to `dataSource.getRows()` threw an error which was not handled because `onDataSourceError()` is missing.', 'To handle the error pass a callback to the `onDataSourceError` prop, for example `<DataGrid onDataSourceError={(error) => ...} />`.', 'For more detail, see https://mui.com/x/react-data-grid/server-side-data/#error-handling.'].join('\n'));
         }
       }
     } finally {
@@ -203,19 +202,16 @@ export const useGridDataSourceBase = (apiRef, props, options = {}) => {
       // Ignore background revalidation errors.
     }
   });
-  const stopPolling = React.useCallback(() => {
-    if (pollingIntervalRef.current !== null) {
-      clearInterval(pollingIntervalRef.current);
-      pollingIntervalRef.current = null;
-    }
-  }, []);
-  const startPolling = useEventCallback(() => {
-    stopPolling();
-    if (revalidateMs <= 0 || !standardRowsUpdateStrategyActive) {
-      return;
-    }
-    pollingIntervalRef.current = setInterval(revalidate, revalidateMs);
+  const {
+    startPolling: startPollingWith,
+    stopPolling
+  } = useGridDataSourcePolling({
+    revalidateMs: props.dataSourceRevalidateMs,
+    isActive: standardRowsUpdateStrategyActive,
+    // Rows that are still loading start the polling when they arrive.
+    shouldResume: () => rowsAreUpToDate.current
   });
+  const startPolling = React.useCallback(() => startPollingWith(revalidate), [startPollingWith, revalidate]);
   const handleDataUpdate = React.useCallback(params => {
     if ('error' in params) {
       // Reset the rows on error, even with `dataSourceKeepPreviousData`. The previous
@@ -269,7 +265,7 @@ export const useGridDataSourceBase = (apiRef, props, options = {}) => {
           cause: errorThrown
         }));
       } else if (process.env.NODE_ENV !== 'production') {
-        warnOnce(['MUI X: A call to `dataSource.updateRow()` threw an error which was not handled because `onDataSourceError()` is missing.', 'To handle the error pass a callback to the `onDataSourceError` prop, for example `<DataGrid onDataSourceError={(error) => ...} />`.', 'For more detail, see https://mui.com/x/react-data-grid/server-side-data/#error-handling.'], 'error');
+        errorOnce(['MUI X: A call to `dataSource.updateRow()` threw an error which was not handled because `onDataSourceError()` is missing.', 'To handle the error pass a callback to the `onDataSourceError` prop, for example `<DataGrid onDataSourceError={(error) => ...} />`.', 'For more detail, see https://mui.com/x/react-data-grid/server-side-data/#error-handling.'].join('\n'));
       }
       throw errorThrown; // Let the caller handle the error further
     }
@@ -322,17 +318,6 @@ export const useGridDataSourceBase = (apiRef, props, options = {}) => {
     const newCache = getCache(props.dataSourceCache, options.cacheOptions);
     setCache(prevCache => prevCache !== newCache ? newCache : prevCache);
   }, [props.dataSourceCache, options.cacheOptions]);
-  React.useEffect(() => {
-    if (!standardRowsUpdateStrategyActive) {
-      stopPolling();
-    }
-  }, [standardRowsUpdateStrategyActive, stopPolling]);
-  React.useEffect(() => {
-    if (revalidateMs <= 0) {
-      stopPolling();
-    }
-  }, [revalidateMs, stopPolling]);
-  React.useEffect(() => stopPolling, [stopPolling]);
   const lastApiRef = React.useRef(apiRef);
   const lastStrategy = React.useRef(currentStrategy);
   const lastDataSource = React.useRef(props.dataSource);
@@ -381,7 +366,7 @@ export const useGridDataSourceBase = (apiRef, props, options = {}) => {
     // strategies always reset the rows on refetch to keep their order consistent with the
     // response. Warn so the limitation is discoverable at runtime, not only in the docs.
     if (process.env.NODE_ENV !== 'production' && props.dataSourceKeepPreviousData && (currentStrategy === DataSourceRowsUpdateStrategy.GroupedData || currentStrategy === DataSourceRowsUpdateStrategy.LazyLoadedGroupedData)) {
-      warnOnce(['MUI X: The `dataSourceKeepPreviousData` prop only applies to flat data.', 'It is ignored when tree data or row grouping is enabled, because the rows are always reset on refetch to keep their order consistent with the response.', 'For more details, see https://mui.com/x/react-data-grid/server-side-data/#keep-previous-data-while-fetching.']);
+      warnOnce(['MUI X: The `dataSourceKeepPreviousData` prop only applies to flat data.', 'It is ignored when tree data or row grouping is enabled, because the rows are always reset on refetch to keep their order consistent with the response.', 'For more details, see https://mui.com/x/react-data-grid/server-side-data/#keep-previous-data-while-fetching.'].join('\n'));
     }
   }, [props.dataSourceKeepPreviousData, currentStrategy]);
   return {

package/hooks/features/dataSource/useGridDataSourcePolling.d.mts

@@ -0,0 +1,29 @@
+interface UseGridDataSourcePollingOptions {
+  /**
+   * The polling interval in milliseconds. The polling is off when it is `0` or less.
+   */
+  revalidateMs: number;
+  /**
+   * The polling is off when it is `false`.
+   */
+  isActive: boolean;
+  /**
+   * Runs when `<Activity>` shows the grid again, if the polling started before.
+   * @returns {boolean} `true` to resume the polling.
+   * @default () => true
+   */
+  shouldResume?: () => boolean;
+}
+/**
+ * Calls a revalidation callback at the `revalidateMs` interval.
+ * The polling pauses while `<Activity>` hides the grid and stops after the grid unmounts.
+ */
+export declare const useGridDataSourcePolling: ({
+  revalidateMs,
+  isActive,
+  shouldResume
+}: UseGridDataSourcePollingOptions) => {
+  startPolling: (callback: () => void) => void;
+  stopPolling: () => void;
+};
+export {};

package/hooks/features/dataSource/useGridDataSourcePolling.d.ts

@@ -0,0 +1,29 @@
+interface UseGridDataSourcePollingOptions {
+  /**
+   * The polling interval in milliseconds. The polling is off when it is `0` or less.
+   */
+  revalidateMs: number;
+  /**
+   * The polling is off when it is `false`.
+   */
+  isActive: boolean;
+  /**
+   * Runs when `<Activity>` shows the grid again, if the polling started before.
+   * @returns {boolean} `true` to resume the polling.
+   * @default () => true
+   */
+  shouldResume?: () => boolean;
+}
+/**
+ * Calls a revalidation callback at the `revalidateMs` interval.
+ * The polling pauses while `<Activity>` hides the grid and stops after the grid unmounts.
+ */
+export declare const useGridDataSourcePolling: ({
+  revalidateMs,
+  isActive,
+  shouldResume
+}: UseGridDataSourcePollingOptions) => {
+  startPolling: (callback: () => void) => void;
+  stopPolling: () => void;
+};
+export {};