@mui/x-data-grid 8.0.0-alpha.1 → 8.0.0-alpha.11

package/constants/index.js

@@ -1,3 +1,4 @@
 export * from "./envConstants.js";
 export * from "./localeTextConstants.js";
-export * from "./gridClasses.js";
+export * from "./gridClasses.js";
+export * from "./signature.js";

package/constants/localeTextConstants.js

@@ -26,7 +26,6 @@ export const GRID_DEFAULT_LOCALE_TEXT = {
   toolbarPromptControlWithRecordingPlaceholder: 'Type or record a prompt…',
   toolbarPromptControlRecordingPlaceholder: 'Listening for prompt…',
   toolbarPromptControlLabel: 'Prompt input',
-  toolbarPromptControlDeleteIconLabel: 'Clear',
   toolbarPromptControlRecordButtonDefaultLabel: 'Record',
   toolbarPromptControlRecordButtonActiveLabel: 'Stop recording',
   toolbarPromptControlSendActionLabel: 'Send',
@@ -99,6 +98,7 @@ export const GRID_DEFAULT_LOCALE_TEXT = {
   'headerFilterOperator>=': 'Greater than or equal to',
   'headerFilterOperator<': 'Less than',
   'headerFilterOperator<=': 'Less than or equal to',
+  headerFilterClear: 'Clear filter',
   // Filter values text
   filterValueAny: 'any',
   filterValueTrue: 'true',

package/constants/signature.d.ts

@@ -0,0 +1,9 @@
+/**
+ * Signal to the underlying logic what version of the public component API
+ * of the Data Grid is exposed.
+ */
+export declare enum GridSignature {
+    DataGrid = "DataGrid",
+    DataGridPro = "DataGridPro",
+    DataGridPremium = "DataGridPremium"
+}

package/constants/signature.js

@@ -0,0 +1,10 @@
+/**
+ * Signal to the underlying logic what version of the public component API
+ * of the Data Grid is exposed.
+ */
+export let GridSignature = /*#__PURE__*/function (GridSignature) {
+  GridSignature["DataGrid"] = "DataGrid";
+  GridSignature["DataGridPro"] = "DataGridPro";
+  GridSignature["DataGridPremium"] = "DataGridPremium";
+  return GridSignature;
+}({});

package/context/GridContextProvider.d.ts

@@ -1,8 +1,9 @@
 import * as React from 'react';
+import { RefObject } from '@mui/x-internals/types';
 import { GridPrivateApiCommunity } from '../models/api/gridApiCommunity';
 import { GridConfiguration } from '../models/configuration/gridConfiguration';
 type GridContextProviderProps = {
-    privateApiRef: React.MutableRefObject<GridPrivateApiCommunity>;
+    privateApiRef: RefObject<GridPrivateApiCommunity>;
     configuration: GridConfiguration;
     props: {};
     children: React.ReactNode;

package/context/GridRootPropsContext.js

@@ -1,3 +1,5 @@
+'use client';
+
 import * as React from 'react';
 const GridRootPropsContext = /*#__PURE__*/React.createContext(undefined);
 if (process.env.NODE_ENV !== 'production') {

package/hooks/core/pipeProcessing/gridPipeProcessingApi.d.ts

@@ -6,7 +6,7 @@ import { GridHydrateColumnsValue, GridPinnedColumnPosition } from '../../feature
 import { GridRowEntry, GridRowId } from '../../../models/gridRows';
 import { GridHydrateRowsValue } from '../../features/rows/gridRowsInterfaces';
 import { GridPreferencePanelsValue } from '../../features/preferencesPanel';
-import { GridGetRowsParams } from '../../../models/gridDataSource';
+import { GridGetRowsParams, GridGetRowsResponse } from '../../../models/gridDataSource';
 import { HeightEntry } from '../../features/rows/gridRowsMetaInterfaces';
 export type GridPipeProcessorGroup = keyof GridPipeProcessingLookup;
 export interface GridPipeProcessingLookup {
@@ -29,7 +29,7 @@ export interface GridPipeProcessingLookup {
     };
     exportMenu: {
         value: {
-            component: React.ReactElement;
+            component: React.ReactElement<any>;
             componentName: string;
         }[];
         context: any;
@@ -84,6 +84,13 @@ export interface GridPipeProcessingLookup {
         value: GridPinnedColumnPosition | false;
         context: string;
     };
+    processDataSourceRows: {
+        value: {
+            params: GridGetRowsParams;
+            response: GridGetRowsResponse;
+        };
+        context: boolean;
+    };
 }
 export type GridPipeProcessor<P extends GridPipeProcessorGroup> = (value: GridPipeProcessingLookup[P]['value'], context: GridPipeProcessingLookup[P] extends {
     context: any;

package/hooks/core/pipeProcessing/useGridPipeProcessing.d.ts

@@ -1,4 +1,4 @@
-import * as React from 'react';
+import { RefObject } from '@mui/x-internals/types';
 import { GridPrivateApiCommon } from '../../../models/api/gridApiCommon';
 /**
  * Implement the Pipeline Pattern
@@ -29,4 +29,4 @@ import { GridPrivateApiCommon } from '../../../models/api/gridApiCommon';
  *   * a processor is registered.
  *   * `apiRef.current.requestPipeProcessorsApplication` is called for the given group.
  */
-export declare const useGridPipeProcessing: (apiRef: React.MutableRefObject<GridPrivateApiCommon>) => void;
+export declare const useGridPipeProcessing: (apiRef: RefObject<GridPrivateApiCommon>) => void;

package/hooks/core/pipeProcessing/useGridRegisterPipeApplier.d.ts

@@ -1,4 +1,4 @@
-import * as React from 'react';
+import { RefObject } from '@mui/x-internals/types';
 import { GridPrivateApiCommon } from '../../../models/api/gridApiCommon';
 import { GridPipeProcessorGroup } from './gridPipeProcessingApi';
-export declare const useGridRegisterPipeApplier: <PrivateApi extends GridPrivateApiCommon, G extends GridPipeProcessorGroup>(apiRef: React.MutableRefObject<PrivateApi>, group: G, callback: () => void) => void;
+export declare const useGridRegisterPipeApplier: <PrivateApi extends GridPrivateApiCommon, G extends GridPipeProcessorGroup>(apiRef: RefObject<PrivateApi>, group: G, callback: () => void) => void;

package/hooks/core/pipeProcessing/useGridRegisterPipeApplier.js

@@ -1,7 +1,7 @@
 import * as React from 'react';
 import { useFirstRender } from "../../utils/useFirstRender.js";
 export const useGridRegisterPipeApplier = (apiRef, group, callback) => {
-  const cleanup = React.useRef();
+  const cleanup = React.useRef(null);
   const id = React.useRef(`mui-${Math.round(Math.random() * 1e9)}`);
   const registerPreProcessor = React.useCallback(() => {
     cleanup.current = apiRef.current.registerPipeApplier(group, id.current, callback);

package/hooks/core/pipeProcessing/useGridRegisterPipeProcessor.d.ts

@@ -1,4 +1,4 @@
-import * as React from 'react';
+import { RefObject } from '@mui/x-internals/types';
 import { GridPrivateApiCommon } from '../../../models/api/gridApiCommon';
 import { GridPipeProcessorGroup, GridPipeProcessor } from './gridPipeProcessingApi';
-export declare const useGridRegisterPipeProcessor: <PrivateApi extends GridPrivateApiCommon, G extends GridPipeProcessorGroup>(apiRef: React.MutableRefObject<PrivateApi>, group: G, callback: GridPipeProcessor<G>) => void;
+export declare const useGridRegisterPipeProcessor: <PrivateApi extends GridPrivateApiCommon, G extends GridPipeProcessorGroup>(apiRef: RefObject<PrivateApi>, group: G, callback: GridPipeProcessor<G>, enabled?: boolean) => void;

package/hooks/core/pipeProcessing/useGridRegisterPipeProcessor.js

@@ -1,19 +1,21 @@
 import * as React from 'react';
 import { useFirstRender } from "../../utils/useFirstRender.js";
-export const useGridRegisterPipeProcessor = (apiRef, group, callback) => {
-  const cleanup = React.useRef();
+export const useGridRegisterPipeProcessor = (apiRef, group, callback, enabled = true) => {
+  const cleanup = React.useRef(null);
   const id = React.useRef(`mui-${Math.round(Math.random() * 1e9)}`);
   const registerPreProcessor = React.useCallback(() => {
     cleanup.current = apiRef.current.registerPipeProcessor(group, id.current, callback);
   }, [apiRef, callback, group]);
   useFirstRender(() => {
-    registerPreProcessor();
+    if (enabled) {
+      registerPreProcessor();
+    }
   });
   const isFirstRender = React.useRef(true);
   React.useEffect(() => {
     if (isFirstRender.current) {
       isFirstRender.current = false;
-    } else {
+    } else if (enabled) {
       registerPreProcessor();
     }
     return () => {
@@ -22,5 +24,5 @@ export const useGridRegisterPipeProcessor = (apiRef, group, callback) => {
         cleanup.current = null;
       }
     };
-  }, [registerPreProcessor]);
+  }, [registerPreProcessor, enabled]);
 };

package/hooks/core/strategyProcessing/gridStrategyProcessingApi.d.ts

@@ -1,26 +1,42 @@
 import { GridRowTreeCreationParams, GridRowTreeCreationValue, GridRowsState } from '../../features/rows/gridRowsInterfaces';
 import { GridFilteringMethodParams, GridFilteringMethodValue, GridFilterState, GridVisibleRowsLookupState } from '../../features/filter/gridFilterState';
 import { GridSortingMethodParams, GridSortingMethodValue } from '../../features/sorting/gridSortingState';
+import { GridGetRowsParams, GridGetRowsResponse } from '../../../models/gridDataSource';
 export type GridStrategyProcessorName = keyof GridStrategyProcessingLookup;
-export type GridStrategyGroup = GridStrategyProcessingLookup[keyof GridStrategyProcessingLookup]['group'];
+export declare enum GridStrategyGroup {
+    DataSource = "dataSource",
+    RowTree = "rowTree"
+}
+export type GridStrategyGroupValue = `${GridStrategyGroup}`;
 export interface GridStrategyProcessingLookup {
+    dataSourceRowsUpdate: {
+        group: GridStrategyGroup.DataSource;
+        params: {
+            response: GridGetRowsResponse;
+            fetchParams: GridGetRowsParams;
+        } | {
+            error: Error;
+            fetchParams: GridGetRowsParams;
+        };
+        value: void;
+    };
     rowTreeCreation: {
-        group: 'rowTree';
+        group: GridStrategyGroup.RowTree;
         params: GridRowTreeCreationParams;
         value: GridRowTreeCreationValue;
     };
     filtering: {
-        group: 'rowTree';
+        group: GridStrategyGroup.RowTree;
         params: GridFilteringMethodParams;
         value: GridFilteringMethodValue;
     };
     sorting: {
-        group: 'rowTree';
+        group: GridStrategyGroup.RowTree;
         params: GridSortingMethodParams;
         value: GridSortingMethodValue;
     };
     visibleRowsLookupCreation: {
-        group: 'rowTree';
+        group: GridStrategyGroup.RowTree;
         params: {
             tree: GridRowsState['tree'];
             filteredRowsLookup: GridFilterState['filteredRowsLookup'];
@@ -42,17 +58,17 @@ export interface GridStrategyProcessingApi {
     registerStrategyProcessor: <P extends GridStrategyProcessorName>(strategyName: string, processorName: P, processor: GridStrategyProcessor<P>) => () => void;
     /**
      * Set a callback to know if a strategy is available.
-     * @param {GridStrategyGroup} strategyGroup The group for which we set strategy availability.
+     * @param {GridStrategyGroupValue} strategyGroup The group for which we set strategy availability.
      * @param {string} strategyName The name of the strategy.
      * @param {boolean} callback A callback to know if this strategy is available.
      */
-    setStrategyAvailability: (strategyGroup: GridStrategyGroup, strategyName: string, callback: () => boolean) => void;
+    setStrategyAvailability: (strategyGroup: GridStrategyGroupValue, strategyName: string, callback: () => boolean) => void;
     /**
      * Returns the name of the active strategy of a given strategy group
-     * @param {GridStrategyGroup} strategyGroup The group from which we want the active strategy.
+     * @param {GridStrategyGroupValue} strategyGroup The group from which we want the active strategy.
      * @returns {string} The name of the active strategy.
      */
-    getActiveStrategy: (strategyGroup: GridStrategyGroup) => string;
+    getActiveStrategy: (strategyGroup: GridStrategyGroupValue) => string;
     /**
      * Run the processor registered for the active strategy.
      * @param {GridStrategyProcessorName} processorName The name of the processor to run.

package/hooks/core/strategyProcessing/gridStrategyProcessingApi.js

@@ -1 +1,5 @@
-export {};
+export let GridStrategyGroup = /*#__PURE__*/function (GridStrategyGroup) {
+  GridStrategyGroup["DataSource"] = "dataSource";
+  GridStrategyGroup["RowTree"] = "rowTree";
+  return GridStrategyGroup;
+}({});

package/hooks/core/strategyProcessing/useGridRegisterStrategyProcessor.d.ts

@@ -1,4 +1,4 @@
-import * as React from 'react';
+import { RefObject } from '@mui/x-internals/types';
 import { GridPrivateApiCommon } from '../../../models/api/gridApiCommon';
 import { GridStrategyProcessorName, GridStrategyProcessor } from './gridStrategyProcessingApi';
-export declare const useGridRegisterStrategyProcessor: <Api extends GridPrivateApiCommon, G extends GridStrategyProcessorName>(apiRef: React.MutableRefObject<Api>, strategyName: string, group: G, processor: GridStrategyProcessor<G>) => void;
+export declare const useGridRegisterStrategyProcessor: <Api extends GridPrivateApiCommon, G extends GridStrategyProcessorName>(apiRef: RefObject<Api>, strategyName: string, group: G, processor: GridStrategyProcessor<G>) => void;

package/hooks/core/strategyProcessing/useGridStrategyProcessing.d.ts

@@ -1,9 +1,9 @@
-import * as React from 'react';
+import { RefObject } from '@mui/x-internals/types';
 import { GridPrivateApiCommon } from '../../../models/api/gridApiCommon';
-import { GridStrategyProcessorName, GridStrategyProcessingLookup } from './gridStrategyProcessingApi';
+import { GridStrategyProcessorName, GridStrategyGroupValue } from './gridStrategyProcessingApi';
 export declare const GRID_DEFAULT_STRATEGY = "none";
 export declare const GRID_STRATEGIES_PROCESSORS: {
-    [P in GridStrategyProcessorName]: GridStrategyProcessingLookup[P]['group'];
+    [P in GridStrategyProcessorName]: GridStrategyGroupValue;
 };
 /**
  * Implements a variant of the Strategy Pattern (see https://en.wikipedia.org/wiki/Strategy_pattern)
@@ -40,9 +40,6 @@ export declare const GRID_STRATEGIES_PROCESSORS: {
  * =====================================================================================================================
  *
  * Each processor name is part of a strategy group which can only have one active strategy at the time.
- * For now, there is only one strategy group named `rowTree` which customize
- * - row tree creation algorithm.
- * - sorting algorithm.
- * - filtering algorithm.
+ * There are two active groups named `rowTree` and `dataSource`.
  */
-export declare const useGridStrategyProcessing: (apiRef: React.MutableRefObject<GridPrivateApiCommon>) => void;
+export declare const useGridStrategyProcessing: (apiRef: RefObject<GridPrivateApiCommon>) => void;

package/hooks/core/strategyProcessing/useGridStrategyProcessing.js

@@ -1,13 +1,15 @@
 import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
 import _toPropertyKey from "@babel/runtime/helpers/esm/toPropertyKey";
 import * as React from 'react';
+import { GridStrategyGroup } from "./gridStrategyProcessingApi.js";
 import { useGridApiMethod } from "../../utils/useGridApiMethod.js";
 export const GRID_DEFAULT_STRATEGY = 'none';
 export const GRID_STRATEGIES_PROCESSORS = {
-  rowTreeCreation: 'rowTree',
-  filtering: 'rowTree',
-  sorting: 'rowTree',
-  visibleRowsLookupCreation: 'rowTree'
+  dataSourceRowsUpdate: GridStrategyGroup.DataSource,
+  rowTreeCreation: GridStrategyGroup.RowTree,
+  filtering: GridStrategyGroup.RowTree,
+  sorting: GridStrategyGroup.RowTree,
+  visibleRowsLookupCreation: GridStrategyGroup.RowTree
 };
 /**
  * Implements a variant of the Strategy Pattern (see https://en.wikipedia.org/wiki/Strategy_pattern)
@@ -44,10 +46,7 @@ export const GRID_STRATEGIES_PROCESSORS = {
  * =====================================================================================================================
  *
  * Each processor name is part of a strategy group which can only have one active strategy at the time.
- * For now, there is only one strategy group named `rowTree` which customize
- * - row tree creation algorithm.
- * - sorting algorithm.
- * - filtering algorithm.
+ * There are two active groups named `rowTree` and `dataSource`.
  */
 export const useGridStrategyProcessing = apiRef => {
   const availableStrategies = React.useRef(new Map());

package/hooks/core/useGridApiInitialization.d.ts

@@ -1,5 +1,5 @@
-import * as React from 'react';
+import { RefObject } from '@mui/x-internals/types';
 import { DataGridProcessedProps } from '../../models/props/DataGridProps';
 import type { GridApiCommon, GridPrivateApiCommon } from '../../models/api/gridApiCommon';
 export declare function unwrapPrivateAPI<PrivateApi extends GridPrivateApiCommon, Api extends GridApiCommon>(publicApi: Api): PrivateApi;
-export declare function useGridApiInitialization<PrivateApi extends GridPrivateApiCommon, Api extends GridApiCommon>(inputApiRef: React.MutableRefObject<Api> | undefined, props: Pick<DataGridProcessedProps, 'signature'>): React.MutableRefObject<PrivateApi>;
+export declare function useGridApiInitialization<PrivateApi extends GridPrivateApiCommon, Api extends GridApiCommon>(inputApiRef: RefObject<Api | null> | undefined, props: Pick<DataGridProcessedProps, 'signature'>): RefObject<PrivateApi>;

package/hooks/core/useGridApiInitialization.js

@@ -2,7 +2,7 @@ import * as React from 'react';
 import { EventManager } from '@mui/x-internals/EventManager';
 import { Store } from "../../utils/Store.js";
 import { useGridApiMethod } from "../utils/useGridApiMethod.js";
-import { GridSignature } from "../utils/useGridApiEventHandler.js";
+import { GridSignature } from "../../constants/signature.js";
 const SYMBOL_API_PRIVATE = Symbol('mui.api_private');
 const isSyntheticEvent = event => {
   return event.isPropagationStopped !== undefined;
@@ -68,8 +68,8 @@ function createPublicAPI(privateApiRef) {
   return publicApi;
 }
 export function useGridApiInitialization(inputApiRef, props) {
-  const publicApiRef = React.useRef();
-  const privateApiRef = React.useRef();
+  const publicApiRef = React.useRef(null);
+  const privateApiRef = React.useRef(null);
   if (!privateApiRef.current) {
     privateApiRef.current = createPrivateAPI(publicApiRef);
   }

package/hooks/core/useGridInitialization.d.ts

@@ -1,7 +1,7 @@
-import * as React from 'react';
+import { RefObject } from '@mui/x-internals/types';
 import type { GridApiCommon, GridPrivateApiCommon } from '../../models/api/gridApiCommon';
 import { DataGridProcessedProps } from '../../models/props/DataGridProps';
 /**
  * Initialize the technical pieces of the DataGrid (logger, state, ...) that any DataGrid implementation needs
  */
-export declare const useGridInitialization: <PrivateApi extends GridPrivateApiCommon, Api extends GridApiCommon>(inputApiRef: React.MutableRefObject<Api> | undefined, props: DataGridProcessedProps) => React.MutableRefObject<PrivateApi>;
+export declare const useGridInitialization: <PrivateApi extends GridPrivateApiCommon, Api extends GridApiCommon>(inputApiRef: RefObject<Api | null> | undefined, props: DataGridProcessedProps) => import("react").RefObject<PrivateApi>;

package/hooks/core/useGridIsRtl.d.ts

@@ -1,3 +1,3 @@
-import * as React from 'react';
+import { RefObject } from '@mui/x-internals/types';
 import { GridPrivateApiCommon } from '../../models/api/gridApiCommon';
-export declare const useGridIsRtl: (apiRef: React.MutableRefObject<GridPrivateApiCommon>) => void;
+export declare const useGridIsRtl: (apiRef: RefObject<GridPrivateApiCommon>) => void;

package/hooks/core/useGridLocaleText.d.ts

@@ -1,4 +1,4 @@
-import * as React from 'react';
+import { RefObject } from '@mui/x-internals/types';
 import { GridPrivateApiCommon } from '../../models/api/gridApiCommon';
 import { DataGridProcessedProps } from '../../models/props/DataGridProps';
-export declare const useGridLocaleText: (apiRef: React.MutableRefObject<GridPrivateApiCommon>, props: Pick<DataGridProcessedProps, "localeText">) => void;
+export declare const useGridLocaleText: (apiRef: RefObject<GridPrivateApiCommon>, props: Pick<DataGridProcessedProps, "localeText">) => void;

package/hooks/core/useGridLoggerFactory.d.ts

@@ -1,4 +1,4 @@
-import * as React from 'react';
+import { RefObject } from '@mui/x-internals/types';
 import { GridPrivateApiCommon } from '../../models/api/gridApiCommon';
 import { DataGridProcessedProps } from '../../models/props/DataGridProps';
-export declare const useGridLoggerFactory: (apiRef: React.MutableRefObject<GridPrivateApiCommon>, props: Pick<DataGridProcessedProps, "logger" | "logLevel">) => void;
+export declare const useGridLoggerFactory: (apiRef: RefObject<GridPrivateApiCommon>, props: Pick<DataGridProcessedProps, "logger" | "logLevel">) => void;

package/hooks/core/useGridRefs.d.ts

@@ -1,3 +1,3 @@
-import * as React from 'react';
+import { RefObject } from '@mui/x-internals/types';
 import type { GridPrivateApiCommon } from '../../models/api/gridApiCommon';
-export declare const useGridRefs: <PrivateApi extends GridPrivateApiCommon>(apiRef: React.MutableRefObject<PrivateApi>) => void;
+export declare const useGridRefs: <PrivateApi extends GridPrivateApiCommon>(apiRef: RefObject<PrivateApi>) => void;

package/hooks/core/useGridStateInitialization.d.ts

@@ -1,3 +1,3 @@
-import * as React from 'react';
+import { RefObject } from '@mui/x-internals/types';
 import type { GridPrivateApiCommon } from '../../models/api/gridApiCommon';
-export declare const useGridStateInitialization: <PrivateApi extends GridPrivateApiCommon>(apiRef: React.MutableRefObject<PrivateApi>) => void;
+export declare const useGridStateInitialization: <PrivateApi extends GridPrivateApiCommon>(apiRef: RefObject<PrivateApi>) => void;

package/hooks/core/useGridStateInitialization.js

@@ -4,7 +4,6 @@ import { useGridApiMethod } from "../utils/index.js";
 import { isFunction } from "../../utils/utils.js";
 export const useGridStateInitialization = apiRef => {
   const controlStateMapRef = React.useRef({});
-  const [, rawForceUpdate] = React.useState();
   const registerControlState = React.useCallback(controlStateItem => {
     controlStateMapRef.current[controlStateItem.stateId] = controlStateItem;
   }, []);
@@ -24,8 +23,8 @@ export const useGridStateInitialization = apiRef => {
     const updatedControlStateIds = [];
     Object.keys(controlStateMapRef.current).forEach(stateId => {
       const controlState = controlStateMapRef.current[stateId];
-      const oldSubState = controlState.stateSelector(apiRef.current.state, apiRef.current.instanceId);
-      const newSubState = controlState.stateSelector(newState, apiRef.current.instanceId);
+      const oldSubState = controlState.stateSelector(apiRef.current.state, undefined, apiRef.current.instanceId);
+      const newSubState = controlState.stateSelector(newState, undefined, apiRef.current.instanceId);
       if (newSubState === oldSubState) {
         return;
       }
@@ -57,7 +56,7 @@ export const useGridStateInitialization = apiRef => {
         hasPropChanged
       } = updatedControlStateIds[0];
       const controlState = controlStateMapRef.current[stateId];
-      const model = controlState.stateSelector(newState, apiRef.current.instanceId);
+      const model = controlState.stateSelector(newState, undefined, apiRef.current.instanceId);
       if (controlState.propOnChange && hasPropChanged) {
         controlState.propOnChange(model, {
           reason,
@@ -79,7 +78,9 @@ export const useGridStateInitialization = apiRef => {
       });
     }, reason);
   }, [apiRef]);
-  const forceUpdate = React.useCallback(() => rawForceUpdate(() => apiRef.current.state), [apiRef]);
+  const forceUpdate = React.useCallback(() => {
+    // @deprecated - do nothing
+  }, []);
   const publicStateApi = {
     setState,
     forceUpdate

package/hooks/features/clipboard/useGridClipboard.d.ts

@@ -1,8 +1,8 @@
-import * as React from 'react';
+import { RefObject } from '@mui/x-internals/types';
 import { GridPrivateApiCommunity } from '../../../models/api/gridApiCommunity';
 import type { DataGridProcessedProps } from '../../../models/props/DataGridProps';
 /**
  * @requires useGridCsvExport (method)
  * @requires useGridSelection (method)
  */
-export declare const useGridClipboard: (apiRef: React.MutableRefObject<GridPrivateApiCommunity>, props: Pick<DataGridProcessedProps, "ignoreValueFormatterDuringExport" | "onClipboardCopy" | "clipboardCopyCellDelimiter">) => void;
+export declare const useGridClipboard: (apiRef: RefObject<GridPrivateApiCommunity>, props: Pick<DataGridProcessedProps, "ignoreValueFormatterDuringExport" | "onClipboardCopy" | "clipboardCopyCellDelimiter">) => void;

package/hooks/features/columnGrouping/gridColumnGroupsSelector.d.ts

@@ -4,9 +4,9 @@ import { GridStateCommunity } from '../../../models/gridStateCommunity';
  * @ignore - do not document.
  */
 export declare const gridColumnGroupingSelector: (state: GridStateCommunity) => import("./gridColumnGroupsInterfaces").GridColumnsGroupingState;
-export declare const gridColumnGroupsUnwrappedModelSelector: import("../../..").OutputSelector<GridStateCommunity, {
+export declare const gridColumnGroupsUnwrappedModelSelector: import("../../..").OutputSelector<GridStateCommunity, import("./gridColumnGroupsInterfaces").GridColumnsGroupingState, {
     [columnField: string]: string[];
 }>;
-export declare const gridColumnGroupsLookupSelector: import("../../..").OutputSelector<GridStateCommunity, import("./gridColumnGroupsInterfaces").GridColumnGroupLookup>;
-export declare const gridColumnGroupsHeaderStructureSelector: import("../../..").OutputSelector<GridStateCommunity, import("./gridColumnGroupsInterfaces").GridGroupingStructure[][]>;
-export declare const gridColumnGroupsHeaderMaxDepthSelector: import("../../..").OutputSelector<GridStateCommunity, number>;
+export declare const gridColumnGroupsLookupSelector: import("../../..").OutputSelector<GridStateCommunity, import("./gridColumnGroupsInterfaces").GridColumnsGroupingState, import("./gridColumnGroupsInterfaces").GridColumnGroupLookup>;
+export declare const gridColumnGroupsHeaderStructureSelector: import("../../..").OutputSelector<GridStateCommunity, import("./gridColumnGroupsInterfaces").GridColumnsGroupingState, import("./gridColumnGroupsInterfaces").GridGroupingStructure[][]>;
+export declare const gridColumnGroupsHeaderMaxDepthSelector: import("../../..").OutputSelector<GridStateCommunity, import("./gridColumnGroupsInterfaces").GridColumnsGroupingState, number>;

package/hooks/features/columnGrouping/useGridColumnGrouping.d.ts

@@ -1,4 +1,4 @@
-import * as React from 'react';
+import { RefObject } from '@mui/x-internals/types';
 import { GridPrivateApiCommunity } from '../../../models/api/gridApiCommunity';
 import { DataGridProcessedProps } from '../../../models/props/DataGridProps';
 import { GridStateInitializer } from '../../utils/useGridInitializeState';
@@ -7,4 +7,4 @@ export declare const columnGroupsStateInitializer: GridStateInitializer<Pick<Dat
  * @requires useGridColumns (method, event)
  * @requires useGridParamsApi (method)
  */
-export declare const useGridColumnGrouping: (apiRef: React.MutableRefObject<GridPrivateApiCommunity>, props: Pick<DataGridProcessedProps, "columnGroupingModel">) => void;
+export declare const useGridColumnGrouping: (apiRef: RefObject<GridPrivateApiCommunity>, props: Pick<DataGridProcessedProps, "columnGroupingModel">) => void;

package/hooks/features/columnHeaders/useGridColumnHeaders.d.ts

@@ -6,8 +6,9 @@ import { GridSortColumnLookup } from '../sorting';
 import { GridFilterActiveItemsLookup } from '../filter';
 import { GridColumnGroupIdentifier, GridColumnIdentifier } from '../focus';
 import { GridColumnMenuState } from '../columnMenu';
-import { GridPinnedColumnPosition, GridColumnVisibilityModel } from '../columns';
+import { GridColumnVisibilityModel, gridColumnPositionsSelector } from '../columns';
 import { GridGroupingStructure } from '../columnGrouping/gridColumnGroupsInterfaces';
+import { PinnedColumnPosition } from '../../../internals/constants';
 export interface UseGridColumnHeadersProps {
     visibleColumns: GridStateColDef[];
     sortColumnLookup: GridSortColumnLookup;
@@ -23,7 +24,7 @@ export interface UseGridColumnHeadersProps {
     hasOtherElementInTabSequence: boolean;
 }
 export interface GetHeadersParams {
-    position?: GridPinnedColumnPosition;
+    position?: PinnedColumnPosition;
     renderContext?: GridColumnsRenderContext;
     maxLastColumn?: number;
 }
@@ -46,11 +47,7 @@ export declare const useGridColumnHeaders: (props: UseGridColumnHeadersProps) =>
         right: GridStateColDef[];
     };
     visibleColumns: GridStateColDef[];
-    getCellOffsetStyle: ({ pinnedPosition, columnIndex, computedWidth, }: {
-        pinnedPosition?: GridPinnedColumnPosition;
-        columnIndex: number;
-        computedWidth: number;
-    }) => React.CSSProperties | undefined;
+    columnPositions: number[];
     getFillers: (params: GetHeadersParams | undefined, children: React.ReactNode, leftOverflow: number, borderBottom?: boolean) => React.JSX.Element;
     getColumnHeadersRow: () => React.JSX.Element;
     getColumnsToRender: (params?: GetHeadersParams) => {
@@ -59,6 +56,7 @@ export declare const useGridColumnHeaders: (props: UseGridColumnHeadersProps) =>
         lastColumnToRender: number;
     };
     getColumnGroupHeadersRows: () => React.JSX.Element[] | null;
+    getPinnedCellOffset: (pinnedPosition: PinnedColumnPosition | undefined, computedWidth: number, columnIndex: number, columnPositions: ReturnType<typeof gridColumnPositionsSelector>, columnsTotalWidth: number, scrollbarWidth: number) => number | undefined;
     isDragging: boolean;
     getInnerProps: () => {
         role: string;