@mui/x-data-grid 8.0.0-alpha.8 → 8.0.0-beta.0

package/hooks/features/rows/useGridParamsApi.js

@@ -1,9 +1,19 @@
-import * as React from 'react';
-import { getGridCellElement, getGridColumnHeaderElement, getGridRowElement } from "../../../utils/domUtils.js";
-import { useGridApiMethod } from "../../utils/useGridApiMethod.js";
-import { gridFocusCellSelector, gridTabIndexCellSelector } from "../focus/gridFocusStateSelector.js";
-import { gridListColumnSelector } from "../listView/gridListViewSelectors.js";
-export class MissingRowIdError extends Error {}
+"use strict";
+
+var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.MissingRowIdError = void 0;
+exports.useGridParamsApi = useGridParamsApi;
+var React = _interopRequireWildcard(require("react"));
+var _domUtils = require("../../../utils/domUtils");
+var _useGridApiMethod = require("../../utils/useGridApiMethod");
+var _gridFocusStateSelector = require("../focus/gridFocusStateSelector");
+var _gridListViewSelectors = require("../listView/gridListViewSelectors");
+var _gridRowsSelector = require("./gridRowsSelector");
+var _gridRowsUtils = require("./gridRowsUtils");
+class MissingRowIdError extends Error {}
 
 /**
  * @requires useGridColumns (method)
@@ -13,7 +23,8 @@ export class MissingRowIdError extends Error {}
  * TODO: Impossible priority - useGridEditing also needs to be after useGridParamsApi
  * TODO: Impossible priority - useGridFocus also needs to be after useGridParamsApi
  */
-export function useGridParamsApi(apiRef, props) {
+exports.MissingRowIdError = MissingRowIdError;
+function useGridParamsApi(apiRef, props) {
   const getColumnHeaderParams = React.useCallback(field => ({
     field,
     colDef: apiRef.current.getColumn(field)
@@ -30,37 +41,52 @@ export function useGridParamsApi(apiRef, props) {
     };
     return params;
   }, [apiRef]);
-  const getCellParams = React.useCallback((id, field) => {
-    const colDef = props.unstable_listView ? gridListColumnSelector(apiRef.current.state) : apiRef.current.getColumn(field);
-    const row = apiRef.current.getRow(id);
-    const rowNode = apiRef.current.getRowNode(id);
-    if (!row || !rowNode) {
-      throw new MissingRowIdError(`No row with id #${id} found`);
-    }
+  const getCellParamsForRow = React.useCallback((id, field, row, {
+    cellMode,
+    colDef,
+    hasFocus,
+    rowNode,
+    tabIndex
+  }) => {
     const rawValue = row[field];
     const value = colDef?.valueGetter ? colDef.valueGetter(rawValue, row, colDef, apiRef) : rawValue;
-    const cellFocus = gridFocusCellSelector(apiRef);
-    const cellTabIndex = gridTabIndexCellSelector(apiRef);
     const params = {
       id,
       field,
       row,
       rowNode,
       colDef,
-      cellMode: apiRef.current.getCellMode(id, field),
-      hasFocus: cellFocus !== null && cellFocus.field === field && cellFocus.id === id,
-      tabIndex: cellTabIndex && cellTabIndex.field === field && cellTabIndex.id === id ? 0 : -1,
+      cellMode,
+      hasFocus,
+      tabIndex,
       value,
       formattedValue: value,
       isEditable: false,
-      api: {}
+      api: null
     };
     if (colDef && colDef.valueFormatter) {
       params.formattedValue = colDef.valueFormatter(value, row, colDef, apiRef);
     }
     params.isEditable = colDef && apiRef.current.isCellEditable(params);
     return params;
-  }, [apiRef, props.unstable_listView]);
+  }, [apiRef]);
+  const getCellParams = React.useCallback((id, field) => {
+    const row = apiRef.current.getRow(id);
+    const rowNode = (0, _gridRowsSelector.gridRowNodeSelector)(apiRef, id);
+    if (!row || !rowNode) {
+      throw new MissingRowIdError(`No row with id #${id} found`);
+    }
+    const cellFocus = (0, _gridFocusStateSelector.gridFocusCellSelector)(apiRef);
+    const cellTabIndex = (0, _gridFocusStateSelector.gridTabIndexCellSelector)(apiRef);
+    const cellMode = apiRef.current.getCellMode(id, field);
+    return apiRef.current.getCellParamsForRow(id, field, row, {
+      colDef: props.unstable_listView && props.unstable_listColumn?.field === field ? (0, _gridListViewSelectors.gridListColumnSelector)(apiRef) : apiRef.current.getColumn(field),
+      rowNode,
+      hasFocus: cellFocus !== null && cellFocus.field === field && cellFocus.id === id,
+      tabIndex: cellTabIndex && cellTabIndex.field === field && cellTabIndex.id === id ? 0 : -1,
+      cellMode
+    });
+  }, [apiRef, props.unstable_listView, props.unstable_listColumn?.field]);
   const getCellValue = React.useCallback((id, field) => {
     const colDef = apiRef.current.getColumn(field);
     const row = apiRef.current.getRow(id);
@@ -72,14 +98,7 @@ export function useGridParamsApi(apiRef, props) {
     }
     return colDef.valueGetter(row[colDef.field], row, colDef, apiRef);
   }, [apiRef]);
-  const getRowValue = React.useCallback((row, colDef) => {
-    const field = colDef.field;
-    if (!colDef || !colDef.valueGetter) {
-      return row[field];
-    }
-    const value = row[colDef.field];
-    return colDef.valueGetter(value, row, colDef, apiRef);
-  }, [apiRef]);
+  const getRowValue = React.useCallback((row, colDef) => (0, _gridRowsUtils.getRowValue)(row, colDef, apiRef), [apiRef]);
   const getRowFormattedValue = React.useCallback((row, colDef) => {
     const value = getRowValue(row, colDef);
     if (!colDef || !colDef.valueFormatter) {
@@ -91,19 +110,19 @@ export function useGridParamsApi(apiRef, props) {
     if (!apiRef.current.rootElementRef.current) {
       return null;
     }
-    return getGridColumnHeaderElement(apiRef.current.rootElementRef.current, field);
+    return (0, _domUtils.getGridColumnHeaderElement)(apiRef.current.rootElementRef.current, field);
   }, [apiRef]);
   const getRowElement = React.useCallback(id => {
     if (!apiRef.current.rootElementRef.current) {
       return null;
     }
-    return getGridRowElement(apiRef.current.rootElementRef.current, id);
+    return (0, _domUtils.getGridRowElement)(apiRef.current.rootElementRef.current, id);
   }, [apiRef]);
   const getCellElement = React.useCallback((id, field) => {
     if (!apiRef.current.rootElementRef.current) {
       return null;
     }
-    return getGridCellElement(apiRef.current.rootElementRef.current, {
+    return (0, _domUtils.getGridCellElement)(apiRef.current.rootElementRef.current, {
       id,
       field
     });
@@ -119,5 +138,9 @@ export function useGridParamsApi(apiRef, props) {
     getColumnHeaderParams,
     getColumnHeaderElement
   };
-  useGridApiMethod(apiRef, paramsApi, 'public');
+  const paramsPrivateApi = {
+    getCellParamsForRow
+  };
+  (0, _useGridApiMethod.useGridApiMethod)(apiRef, paramsApi, 'public');
+  (0, _useGridApiMethod.useGridApiMethod)(apiRef, paramsPrivateApi, 'private');
 }

package/hooks/features/rows/useGridRowAriaAttributes.d.ts

@@ -1,2 +1,2 @@
-import { GetRowAriaAttributesFn } from '../../../models/configuration/gridRowConfiguration';
-export declare const useGridRowAriaAttributes: () => GetRowAriaAttributesFn;
+import { GetRowAriaAttributesFn } from "../../../models/configuration/gridRowConfiguration.js";
+export declare const useGridRowAriaAttributes: () => GetRowAriaAttributesFn;

package/hooks/features/rows/useGridRowAriaAttributes.js

@@ -1,19 +1,25 @@
-import * as React from 'react';
-import { selectedIdsLookupSelector } from "../rowSelection/index.js";
-import { useGridSelector } from "../../utils/useGridSelector.js";
-import { gridColumnGroupsHeaderMaxDepthSelector } from "../columnGrouping/gridColumnGroupsSelector.js";
-import { useGridPrivateApiContext } from "../../utils/useGridPrivateApiContext.js";
-export const useGridRowAriaAttributes = () => {
-  const apiRef = useGridPrivateApiContext();
-  const selectedIdsLookup = useGridSelector(apiRef, selectedIdsLookupSelector);
-  const headerGroupingMaxDepth = useGridSelector(apiRef, gridColumnGroupsHeaderMaxDepthSelector);
+"use strict";
+
+var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.useGridRowAriaAttributes = void 0;
+var React = _interopRequireWildcard(require("react"));
+var _useGridSelector = require("../../utils/useGridSelector");
+var _gridColumnGroupsSelector = require("../columnGrouping/gridColumnGroupsSelector");
+var _useGridPrivateApiContext = require("../../utils/useGridPrivateApiContext");
+const useGridRowAriaAttributes = () => {
+  const apiRef = (0, _useGridPrivateApiContext.useGridPrivateApiContext)();
+  const headerGroupingMaxDepth = (0, _useGridSelector.useGridSelector)(apiRef, _gridColumnGroupsSelector.gridColumnGroupsHeaderMaxDepthSelector);
   return React.useCallback((rowNode, index) => {
     const ariaAttributes = {};
     const ariaRowIndex = index + headerGroupingMaxDepth + 2; // 1 for the header row and 1 as it's 1-based
     ariaAttributes['aria-rowindex'] = ariaRowIndex;
     if (apiRef.current.isRowSelectable(rowNode.id)) {
-      ariaAttributes['aria-selected'] = selectedIdsLookup[rowNode.id] !== undefined;
+      ariaAttributes['aria-selected'] = apiRef.current.isRowSelected(rowNode.id);
     }
     return ariaAttributes;
-  }, [apiRef, selectedIdsLookup, headerGroupingMaxDepth]);
-};
+  }, [apiRef, headerGroupingMaxDepth]);
+};
+exports.useGridRowAriaAttributes = useGridRowAriaAttributes;

package/hooks/features/rows/useGridRowSpanning.d.ts

@@ -1,22 +1,22 @@
-import * as React from 'react';
+import { RefObject } from '@mui/x-internals/types';
 import type { GridColDef } from '../../../models/colDef';
 import type { GridRowId } from '../../../models/gridRows';
 import type { DataGridProcessedProps } from '../../../models/props/DataGridProps';
 import type { GridPrivateApiCommunity } from '../../../models/api/gridApiCommunity';
 import type { GridStateInitializer } from '../../utils/useGridInitializeState';
 export interface GridRowSpanningState {
-    spannedCells: Record<GridRowId, Record<GridColDef['field'], number>>;
-    hiddenCells: Record<GridRowId, Record<GridColDef['field'], boolean>>;
-    /**
-     * For each hidden cell, it contains the row index corresponding to the cell that is
-     * the origin of the hidden cell. i.e. the cell which is spanned.
-     * Used by the virtualization to properly keep the spanned cells in view.
-     */
-    hiddenCellOriginMap: Record<number, Record<GridColDef['field'], number>>;
+  spannedCells: Record<GridRowId, Record<GridColDef['field'], number>>;
+  hiddenCells: Record<GridRowId, Record<GridColDef['field'], boolean>>;
+  /**
+   * For each hidden cell, it contains the row index corresponding to the cell that is
+   * the origin of the hidden cell. i.e. the cell which is spanned.
+   * Used by the virtualization to properly keep the spanned cells in view.
+   */
+  hiddenCellOriginMap: Record<number, Record<GridColDef['field'], number>>;
 }
 export type RowRange = {
-    firstRowIndex: number;
-    lastRowIndex: number;
+  firstRowIndex: number;
+  lastRowIndex: number;
 };
 /**
  * @requires columnsStateInitializer (method) - should be initialized before
@@ -24,4 +24,4 @@ export type RowRange = {
  * @requires filterStateInitializer (method) - should be initialized before
  */
 export declare const rowSpanningStateInitializer: GridStateInitializer;
-export declare const useGridRowSpanning: (apiRef: React.RefObject<GridPrivateApiCommunity>, props: Pick<DataGridProcessedProps, "rowSpanning" | "pagination" | "paginationMode">) => void;
+export declare const useGridRowSpanning: (apiRef: RefObject<GridPrivateApiCommunity>, props: Pick<DataGridProcessedProps, "rowSpanning" | "pagination" | "paginationMode">) => void;

package/hooks/features/rows/useGridRowSpanning.js

@@ -1,14 +1,24 @@
-import _extends from "@babel/runtime/helpers/esm/extends";
-import * as React from 'react';
-import useLazyRef from '@mui/utils/useLazyRef';
-import { GRID_DETAIL_PANEL_TOGGLE_FIELD } from "../../../internals/constants.js";
-import { gridVisibleColumnDefinitionsSelector } from "../columns/gridColumnsSelector.js";
-import { getVisibleRows } from "../../utils/useGridVisibleRows.js";
-import { gridRenderContextSelector } from "../virtualization/gridVirtualizationSelectors.js";
-import { getUnprocessedRange, isRowContextInitialized, getCellValue } from "./gridRowSpanningUtils.js";
-import { GRID_CHECKBOX_SELECTION_FIELD } from "../../../colDef/gridCheckboxSelectionColDef.js";
-import { useGridApiEventHandler } from "../../utils/useGridApiEventHandler.js";
-import { runIf } from "../../../utils/utils.js";
+"use strict";
+
+var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.useGridRowSpanning = exports.rowSpanningStateInitializer = void 0;
+var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
+var React = _interopRequireWildcard(require("react"));
+var _useLazyRef = _interopRequireDefault(require("@mui/utils/useLazyRef"));
+var _constants = require("../../../internals/constants");
+var _gridColumnsSelector = require("../columns/gridColumnsSelector");
+var _useGridVisibleRows = require("../../utils/useGridVisibleRows");
+var _gridVirtualizationSelectors = require("../virtualization/gridVirtualizationSelectors");
+var _gridRowSpanningUtils = require("./gridRowSpanningUtils");
+var _gridCheckboxSelectionColDef = require("../../../colDef/gridCheckboxSelectionColDef");
+var _useGridApiEventHandler = require("../../utils/useGridApiEventHandler");
+var _utils = require("../../../utils/utils");
+var _pagination = require("../pagination");
+var _gridRowsSelector = require("./gridRowsSelector");
 const EMPTY_STATE = {
   spannedCells: {},
   hiddenCells: {},
@@ -18,7 +28,7 @@ const EMPTY_RANGE = {
   firstRowIndex: 0,
   lastRowIndex: 0
 };
-const skippedFields = new Set([GRID_CHECKBOX_SELECTION_FIELD, '__reorder__', GRID_DETAIL_PANEL_TOGGLE_FIELD]);
+const skippedFields = new Set([_gridCheckboxSelectionColDef.GRID_CHECKBOX_SELECTION_FIELD, '__reorder__', _constants.GRID_DETAIL_PANEL_TOGGLE_FIELD]);
 /**
  * Default number of rows to process during state initialization to avoid flickering.
  * Number `20` is arbitrarily chosen to be large enough to cover most of the cases without
@@ -26,9 +36,9 @@ const skippedFields = new Set([GRID_CHECKBOX_SELECTION_FIELD, '__reorder__', GRI
  */
 const DEFAULT_ROWS_TO_PROCESS = 20;
 const computeRowSpanningState = (apiRef, colDefs, visibleRows, range, rangeToProcess, resetState, processedRange) => {
-  const spannedCells = resetState ? {} : _extends({}, apiRef.current.state.rowSpanning.spannedCells);
-  const hiddenCells = resetState ? {} : _extends({}, apiRef.current.state.rowSpanning.hiddenCells);
-  const hiddenCellOriginMap = resetState ? {} : _extends({}, apiRef.current.state.rowSpanning.hiddenCellOriginMap);
+  const spannedCells = resetState ? {} : (0, _extends2.default)({}, apiRef.current.state.rowSpanning.spannedCells);
+  const hiddenCells = resetState ? {} : (0, _extends2.default)({}, apiRef.current.state.rowSpanning.hiddenCells);
+  const hiddenCellOriginMap = resetState ? {} : (0, _extends2.default)({}, apiRef.current.state.rowSpanning.hiddenCellOriginMap);
   if (resetState) {
     processedRange = EMPTY_RANGE;
   }
@@ -41,7 +51,7 @@ const computeRowSpanningState = (apiRef, colDefs, visibleRows, range, rangeToPro
       if (hiddenCells[row.id]?.[colDef.field]) {
         continue;
       }
-      const cellValue = getCellValue(row.model, colDef, apiRef);
+      const cellValue = (0, _gridRowSpanningUtils.getCellValue)(row.model, colDef, apiRef);
       if (cellValue == null) {
         continue;
       }
@@ -54,7 +64,7 @@ const computeRowSpanningState = (apiRef, colDefs, visibleRows, range, rangeToPro
       if (index === rangeToProcess.firstRowIndex) {
         let prevIndex = index - 1;
         let prevRowEntry = visibleRows[prevIndex];
-        while (prevIndex >= range.firstRowIndex && prevRowEntry && getCellValue(prevRowEntry.model, colDef, apiRef) === cellValue) {
+        while (prevIndex >= range.firstRowIndex && prevRowEntry && (0, _gridRowSpanningUtils.getCellValue)(prevRowEntry.model, colDef, apiRef) === cellValue) {
           const currentRow = visibleRows[prevIndex + 1];
           if (hiddenCells[currentRow.id]) {
             hiddenCells[currentRow.id][colDef.field] = true;
@@ -83,7 +93,7 @@ const computeRowSpanningState = (apiRef, colDefs, visibleRows, range, rangeToPro
 
       // Scan the next rows
       let relativeIndex = index + 1;
-      while (relativeIndex <= range.lastRowIndex && visibleRows[relativeIndex] && getCellValue(visibleRows[relativeIndex].model, colDef, apiRef) === cellValue) {
+      while (relativeIndex <= range.lastRowIndex && visibleRows[relativeIndex] && (0, _gridRowSpanningUtils.getCellValue)(visibleRows[relativeIndex].model, colDef, apiRef) === cellValue) {
         const currentRow = visibleRows[relativeIndex];
         if (hiddenCells[currentRow.id]) {
           hiddenCells[currentRow.id][colDef.field] = true;
@@ -124,15 +134,33 @@ const computeRowSpanningState = (apiRef, colDefs, visibleRows, range, rangeToPro
     processedRange
   };
 };
+const getInitialRangeToProcess = (props, apiRef) => {
+  const rowCount = (0, _gridRowsSelector.gridDataRowIdsSelector)(apiRef).length;
+  if (props.pagination) {
+    const pageSize = (0, _pagination.gridPageSizeSelector)(apiRef);
+    let paginationLastRowIndex = DEFAULT_ROWS_TO_PROCESS;
+    if (pageSize > 0) {
+      paginationLastRowIndex = pageSize - 1;
+    }
+    return {
+      firstRowIndex: 0,
+      lastRowIndex: Math.min(paginationLastRowIndex, rowCount)
+    };
+  }
+  return {
+    firstRowIndex: 0,
+    lastRowIndex: Math.min(DEFAULT_ROWS_TO_PROCESS, rowCount)
+  };
+};
 
 /**
  * @requires columnsStateInitializer (method) - should be initialized before
  * @requires rowsStateInitializer (method) - should be initialized before
  * @requires filterStateInitializer (method) - should be initialized before
  */
-export const rowSpanningStateInitializer = (state, props, apiRef) => {
+const rowSpanningStateInitializer = (state, props, apiRef) => {
   if (!props.rowSpanning) {
-    return _extends({}, state, {
+    return (0, _extends2.default)({}, state, {
       rowSpanning: EMPTY_STATE
     });
   }
@@ -142,14 +170,11 @@ export const rowSpanningStateInitializer = (state, props, apiRef) => {
   const columnsLookup = state.columns.lookup;
   const isFilteringPending = Boolean(state.filter.filterModel.items.length) || Boolean(state.filter.filterModel.quickFilterValues?.length);
   if (!rowIds.length || !orderedFields.length || !dataRowIdToModelLookup || !columnsLookup || isFilteringPending) {
-    return _extends({}, state, {
+    return (0, _extends2.default)({}, state, {
       rowSpanning: EMPTY_STATE
     });
   }
-  const rangeToProcess = {
-    firstRowIndex: 0,
-    lastRowIndex: Math.min(DEFAULT_ROWS_TO_PROCESS, Math.max(rowIds.length, 0))
-  };
+  const rangeToProcess = getInitialRangeToProcess(props, apiRef);
   const rows = rowIds.map(id => ({
     id,
     model: dataRowIdToModelLookup[id]
@@ -160,7 +185,7 @@ export const rowSpanningStateInitializer = (state, props, apiRef) => {
     hiddenCells,
     hiddenCellOriginMap
   } = computeRowSpanningState(apiRef, colDefs, rows, rangeToProcess, rangeToProcess, true, EMPTY_RANGE);
-  return _extends({}, state, {
+  return (0, _extends2.default)({}, state, {
     rowSpanning: {
       spannedCells,
       hiddenCells,
@@ -168,35 +193,33 @@ export const rowSpanningStateInitializer = (state, props, apiRef) => {
     }
   });
 };
-export const useGridRowSpanning = (apiRef, props) => {
-  const processedRange = useLazyRef(() => {
-    return Object.keys(apiRef.current.state.rowSpanning.spannedCells).length > 0 ? {
-      firstRowIndex: 0,
-      lastRowIndex: Math.min(DEFAULT_ROWS_TO_PROCESS, Math.max(apiRef.current.state.rows.dataRowIds.length, 0))
-    } : EMPTY_RANGE;
+exports.rowSpanningStateInitializer = rowSpanningStateInitializer;
+const useGridRowSpanning = (apiRef, props) => {
+  const processedRange = (0, _useLazyRef.default)(() => {
+    return apiRef.current.state.rowSpanning !== EMPTY_STATE ? getInitialRangeToProcess(props, apiRef) : EMPTY_RANGE;
   });
   const updateRowSpanningState = React.useCallback((renderContext, resetState = false) => {
     const {
       range,
       rows: visibleRows
-    } = getVisibleRows(apiRef, {
+    } = (0, _useGridVisibleRows.getVisibleRows)(apiRef, {
       pagination: props.pagination,
       paginationMode: props.paginationMode
     });
-    if (range === null || !isRowContextInitialized(renderContext)) {
+    if (range === null || !(0, _gridRowSpanningUtils.isRowContextInitialized)(renderContext)) {
       return;
     }
     if (resetState) {
       processedRange.current = EMPTY_RANGE;
     }
-    const rangeToProcess = getUnprocessedRange({
+    const rangeToProcess = (0, _gridRowSpanningUtils.getUnprocessedRange)({
       firstRowIndex: renderContext.firstRowIndex,
       lastRowIndex: Math.min(renderContext.lastRowIndex, range.lastRowIndex + 1)
     }, processedRange.current);
     if (rangeToProcess === null) {
       return;
     }
-    const colDefs = gridVisibleColumnDefinitionsSelector(apiRef);
+    const colDefs = (0, _gridColumnsSelector.gridVisibleColumnDefinitionsSelector)(apiRef);
     const {
       spannedCells,
       hiddenCells,
@@ -214,7 +237,7 @@ export const useGridRowSpanning = (apiRef, props) => {
       return;
     }
     apiRef.current.setState(state => {
-      return _extends({}, state, {
+      return (0, _extends2.default)({}, state, {
         rowSpanning: {
           spannedCells,
           hiddenCells,
@@ -231,21 +254,21 @@ export const useGridRowSpanning = (apiRef, props) => {
   // - The `paginationModel` is updated
   // - The rows are updated
   const resetRowSpanningState = React.useCallback(() => {
-    const renderContext = gridRenderContextSelector(apiRef);
-    if (!isRowContextInitialized(renderContext)) {
+    const renderContext = (0, _gridVirtualizationSelectors.gridRenderContextSelector)(apiRef);
+    if (!(0, _gridRowSpanningUtils.isRowContextInitialized)(renderContext)) {
       return;
     }
     updateRowSpanningState(renderContext, true);
   }, [apiRef, updateRowSpanningState]);
-  useGridApiEventHandler(apiRef, 'renderedRowsIntervalChange', runIf(props.rowSpanning, updateRowSpanningState));
-  useGridApiEventHandler(apiRef, 'sortedRowsSet', runIf(props.rowSpanning, resetRowSpanningState));
-  useGridApiEventHandler(apiRef, 'paginationModelChange', runIf(props.rowSpanning, resetRowSpanningState));
-  useGridApiEventHandler(apiRef, 'filteredRowsSet', runIf(props.rowSpanning, resetRowSpanningState));
-  useGridApiEventHandler(apiRef, 'columnsChange', runIf(props.rowSpanning, resetRowSpanningState));
+  (0, _useGridApiEventHandler.useGridApiEventHandler)(apiRef, 'renderedRowsIntervalChange', (0, _utils.runIf)(props.rowSpanning, updateRowSpanningState));
+  (0, _useGridApiEventHandler.useGridApiEventHandler)(apiRef, 'sortedRowsSet', (0, _utils.runIf)(props.rowSpanning, resetRowSpanningState));
+  (0, _useGridApiEventHandler.useGridApiEventHandler)(apiRef, 'paginationModelChange', (0, _utils.runIf)(props.rowSpanning, resetRowSpanningState));
+  (0, _useGridApiEventHandler.useGridApiEventHandler)(apiRef, 'filteredRowsSet', (0, _utils.runIf)(props.rowSpanning, resetRowSpanningState));
+  (0, _useGridApiEventHandler.useGridApiEventHandler)(apiRef, 'columnsChange', (0, _utils.runIf)(props.rowSpanning, resetRowSpanningState));
   React.useEffect(() => {
     if (!props.rowSpanning) {
       if (apiRef.current.state.rowSpanning !== EMPTY_STATE) {
-        apiRef.current.setState(state => _extends({}, state, {
+        apiRef.current.setState(state => (0, _extends2.default)({}, state, {
           rowSpanning: EMPTY_STATE
         }));
       }
@@ -253,4 +276,5 @@ export const useGridRowSpanning = (apiRef, props) => {
       resetRowSpanningState();
     }
   }, [apiRef, resetRowSpanningState, props.rowSpanning]);
-};
+};
+exports.useGridRowSpanning = useGridRowSpanning;

package/hooks/features/rows/useGridRows.d.ts

@@ -1,6 +1,6 @@
-import * as React from 'react';
-import { DataGridProcessedProps } from '../../../models/props/DataGridProps';
-import { GridPrivateApiCommunity } from '../../../models/api/gridApiCommunity';
-import { GridStateInitializer } from '../../utils/useGridInitializeState';
-export declare const rowsStateInitializer: GridStateInitializer<Pick<DataGridProcessedProps, 'unstable_dataSource' | 'rows' | 'rowCount' | 'getRowId' | 'loading'>>;
-export declare const useGridRows: (apiRef: React.RefObject<GridPrivateApiCommunity>, props: Pick<DataGridProcessedProps, "rows" | "getRowId" | "rowCount" | "throttleRowsMs" | "signature" | "pagination" | "paginationMode" | "loading" | "unstable_dataSource">) => void;
+import { RefObject } from '@mui/x-internals/types';
+import { DataGridProcessedProps } from "../../../models/props/DataGridProps.js";
+import { GridPrivateApiCommunity } from "../../../models/api/gridApiCommunity.js";
+import { GridStateInitializer } from "../../utils/useGridInitializeState.js";
+export declare const rowsStateInitializer: GridStateInitializer<Pick<DataGridProcessedProps, 'dataSource' | 'rows' | 'rowCount' | 'getRowId' | 'loading'>>;
+export declare const useGridRows: (apiRef: RefObject<GridPrivateApiCommunity>, props: Pick<DataGridProcessedProps, "rows" | "getRowId" | "rowCount" | "throttleRowsMs" | "signature" | "pagination" | "paginationMode" | "loading" | "dataSource">) => void;