@mui/x-data-grid 9.11.0 → 9.13.0

package/locales/ukUA.mjs

@@ -59,6 +59,11 @@ const ukUAGrid = {
   // Toolbar AI Assistant button
   // toolbarAssistant: 'AI Assistant',
 
+  // Formula bar (Premium formulas)
+  // formulaBarLabel: 'Formula bar',
+  // formulaBarInputLabel: 'Formula',
+  // formulaBarAddressLabel: 'Active cell',
+
   // Columns management text
   columnsManagementSearchTitle: 'Пошук',
   columnsManagementNoColumns: 'Немає стовпців',

package/locales/urPK.js

@@ -50,6 +50,11 @@ const urPKGrid = {
   // Toolbar AI Assistant button
   // toolbarAssistant: 'AI Assistant',
 
+  // Formula bar (Premium formulas)
+  // formulaBarLabel: 'Formula bar',
+  // formulaBarInputLabel: 'Formula',
+  // formulaBarAddressLabel: 'Active cell',
+
   // Columns management text
   columnsManagementSearchTitle: 'تلاش',
   columnsManagementNoColumns: 'کوئی کالم نہیں',

package/locales/urPK.mjs

@@ -44,6 +44,11 @@ const urPKGrid = {
   // Toolbar AI Assistant button
   // toolbarAssistant: 'AI Assistant',
 
+  // Formula bar (Premium formulas)
+  // formulaBarLabel: 'Formula bar',
+  // formulaBarInputLabel: 'Formula',
+  // formulaBarAddressLabel: 'Active cell',
+
   // Columns management text
   columnsManagementSearchTitle: 'تلاش',
   columnsManagementNoColumns: 'کوئی کالم نہیں',

package/locales/viVN.js

@@ -50,6 +50,11 @@ const viVNGrid = {
   // Toolbar AI Assistant button
   // toolbarAssistant: 'AI Assistant',
 
+  // Formula bar (Premium formulas)
+  // formulaBarLabel: 'Formula bar',
+  // formulaBarInputLabel: 'Formula',
+  // formulaBarAddressLabel: 'Active cell',
+
   // Columns management text
   columnsManagementSearchTitle: 'Tìm kiếm',
   columnsManagementNoColumns: 'Không có cột',

package/locales/viVN.mjs

@@ -44,6 +44,11 @@ const viVNGrid = {
   // Toolbar AI Assistant button
   // toolbarAssistant: 'AI Assistant',
 
+  // Formula bar (Premium formulas)
+  // formulaBarLabel: 'Formula bar',
+  // formulaBarInputLabel: 'Formula',
+  // formulaBarAddressLabel: 'Active cell',
+
   // Columns management text
   columnsManagementSearchTitle: 'Tìm kiếm',
   columnsManagementNoColumns: 'Không có cột',

package/locales/zhCN.js

@@ -51,6 +51,11 @@ const zhCNGrid = {
   // Toolbar AI Assistant button
   // toolbarAssistant: 'AI Assistant',
 
+  // Formula bar (Premium formulas)
+  // formulaBarLabel: 'Formula bar',
+  // formulaBarInputLabel: 'Formula',
+  // formulaBarAddressLabel: 'Active cell',
+
   // Columns management text
   columnsManagementSearchTitle: '搜索',
   columnsManagementNoColumns: '没有列',

package/locales/zhCN.mjs

@@ -45,6 +45,11 @@ const zhCNGrid = {
   // Toolbar AI Assistant button
   // toolbarAssistant: 'AI Assistant',
 
+  // Formula bar (Premium formulas)
+  // formulaBarLabel: 'Formula bar',
+  // formulaBarInputLabel: 'Formula',
+  // formulaBarAddressLabel: 'Active cell',
+
   // Columns management text
   columnsManagementSearchTitle: '搜索',
   columnsManagementNoColumns: '没有列',

package/locales/zhHK.js

@@ -51,6 +51,11 @@ const zhHKGrid = {
   // Toolbar AI Assistant button
   // toolbarAssistant: 'AI Assistant',
 
+  // Formula bar (Premium formulas)
+  // formulaBarLabel: 'Formula bar',
+  // formulaBarInputLabel: 'Formula',
+  // formulaBarAddressLabel: 'Active cell',
+
   // Columns management text
   columnsManagementSearchTitle: '搜尋',
   columnsManagementNoColumns: '沒有列',

package/locales/zhHK.mjs

@@ -45,6 +45,11 @@ const zhHKGrid = {
   // Toolbar AI Assistant button
   // toolbarAssistant: 'AI Assistant',
 
+  // Formula bar (Premium formulas)
+  // formulaBarLabel: 'Formula bar',
+  // formulaBarInputLabel: 'Formula',
+  // formulaBarAddressLabel: 'Active cell',
+
   // Columns management text
   columnsManagementSearchTitle: '搜尋',
   columnsManagementNoColumns: '沒有列',

package/locales/zhTW.js

@@ -51,6 +51,11 @@ const zhTWGrid = {
   // Toolbar AI Assistant button
   // toolbarAssistant: 'AI Assistant',
 
+  // Formula bar (Premium formulas)
+  // formulaBarLabel: 'Formula bar',
+  // formulaBarInputLabel: 'Formula',
+  // formulaBarAddressLabel: 'Active cell',
+
   // Columns management text
   columnsManagementSearchTitle: '搜尋',
   columnsManagementNoColumns: '沒有欄位',

package/locales/zhTW.mjs

@@ -45,6 +45,11 @@ const zhTWGrid = {
   // Toolbar AI Assistant button
   // toolbarAssistant: 'AI Assistant',
 
+  // Formula bar (Premium formulas)
+  // formulaBarLabel: 'Formula bar',
+  // formulaBarInputLabel: 'Formula',
+  // formulaBarAddressLabel: 'Active cell',
+
   // Columns management text
   columnsManagementSearchTitle: '搜尋',
   columnsManagementNoColumns: '沒有欄位',

package/material/variables.d.mts

@@ -1,5 +1,10 @@
+import type { Theme } from '@mui/material/styles';
 import type { GridCSSVariablesInterface } from "../constants/cssVariables.mjs";
 export declare function useMaterialCSSVariables(): {
   id: string;
   variables: GridCSSVariablesInterface;
-};
+};
+export declare function getBackgroundBase(theme: Theme): string;
+export declare function getFontBody(theme: Theme): any;
+export declare function getSpacingUnit(theme: Theme): any;
+export declare function getBorderColor(theme: Theme): string;

package/material/variables.d.ts

@@ -1,5 +1,10 @@
+import type { Theme } from '@mui/material/styles';
 import type { GridCSSVariablesInterface } from "../constants/cssVariables.js";
 export declare function useMaterialCSSVariables(): {
   id: string;
   variables: GridCSSVariablesInterface;
-};
+};
+export declare function getBackgroundBase(theme: Theme): string;
+export declare function getFontBody(theme: Theme): any;
+export declare function getSpacingUnit(theme: Theme): any;
+export declare function getBorderColor(theme: Theme): string;

package/material/variables.js

@@ -4,6 +4,10 @@ var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWild
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
+exports.getBackgroundBase = getBackgroundBase;
+exports.getBorderColor = getBorderColor;
+exports.getFontBody = getFontBody;
+exports.getSpacingUnit = getSpacingUnit;
 exports.useMaterialCSSVariables = useMaterialCSSVariables;
 var React = _interopRequireWildcard(require("react"));
 var _styles = require("@mui/material/styles");
@@ -25,19 +29,19 @@ function transformTheme(t) {
   const borderColor = getBorderColor(t);
   const dataGridPalette = (t.vars || t).palette.DataGrid;
   const paperColor = (t.vars || t).palette.background.paper;
-  const backgroundBase = dataGridPalette?.bg ?? (t.palette.mode === 'dark' ? (0, _GridRootStyles.colorMixIfSupported)(`color-mix(in srgb, ${paperColor} 95%, #fff)`, paperColor) : paperColor);
+  const backgroundBase = getBackgroundBase(t);
   const backgroundHeader = dataGridPalette?.headerBg ?? backgroundBase;
   const backgroundPinned = dataGridPalette?.pinnedBg ?? backgroundBase;
   const backgroundBackdrop = t.alpha((t.vars || t).palette.background.default, (t.vars || t).palette.action.disabledOpacity);
   const backgroundOverlay = t.palette.mode === 'dark' ? (0, _GridRootStyles.colorMixIfSupported)(`color-mix(in srgb, ${paperColor} 90%, #fff)`, paperColor) : paperColor;
   const selectedColor = (t.vars || t).palette.primary.main;
   const radius = getRadius(t);
-  const fontBody = t.vars?.font?.body2 ?? formatFont(t.typography.body2);
+  const fontBody = getFontBody(t);
   const fontSmall = t.vars?.font?.caption ?? formatFont(t.typography.caption);
   const fontLarge = t.vars?.font?.body1 ?? formatFont(t.typography.body1);
   const k = _cssVariables.vars.keys;
   return {
-    [k.spacingUnit]: t.vars ? t.vars.spacing ?? t.spacing(1) : t.spacing(1),
+    [k.spacingUnit]: getSpacingUnit(t),
     [k.colors.border.base]: borderColor,
     [k.colors.background.base]: backgroundBase,
     [k.colors.background.overlay]: backgroundOverlay,
@@ -85,6 +89,16 @@ function getRadius(theme) {
   }
   return typeof theme.shape.borderRadius === 'number' ? `${theme.shape.borderRadius}px` : theme.shape.borderRadius;
 }
+function getBackgroundBase(theme) {
+  const paperColor = (theme.vars || theme).palette.background.paper;
+  return (theme.vars || theme).palette.DataGrid?.bg ?? (theme.palette.mode === 'dark' ? (0, _GridRootStyles.colorMixIfSupported)(`color-mix(in srgb, ${paperColor} 95%, #fff)`, paperColor) : paperColor);
+}
+function getFontBody(theme) {
+  return theme.vars?.font?.body2 ?? formatFont(theme.typography.body2);
+}
+function getSpacingUnit(theme) {
+  return theme.vars ? theme.vars.spacing ?? theme.spacing(1) : theme.spacing(1);
+}
 function getBorderColor(theme) {
   if (theme.vars) {
     return theme.vars.palette.TableCell.border;

package/material/variables.mjs

@@ -18,19 +18,19 @@ function transformTheme(t) {
   const borderColor = getBorderColor(t);
   const dataGridPalette = (t.vars || t).palette.DataGrid;
   const paperColor = (t.vars || t).palette.background.paper;
-  const backgroundBase = dataGridPalette?.bg ?? (t.palette.mode === 'dark' ? colorMixIfSupported(`color-mix(in srgb, ${paperColor} 95%, #fff)`, paperColor) : paperColor);
+  const backgroundBase = getBackgroundBase(t);
   const backgroundHeader = dataGridPalette?.headerBg ?? backgroundBase;
   const backgroundPinned = dataGridPalette?.pinnedBg ?? backgroundBase;
   const backgroundBackdrop = t.alpha((t.vars || t).palette.background.default, (t.vars || t).palette.action.disabledOpacity);
   const backgroundOverlay = t.palette.mode === 'dark' ? colorMixIfSupported(`color-mix(in srgb, ${paperColor} 90%, #fff)`, paperColor) : paperColor;
   const selectedColor = (t.vars || t).palette.primary.main;
   const radius = getRadius(t);
-  const fontBody = t.vars?.font?.body2 ?? formatFont(t.typography.body2);
+  const fontBody = getFontBody(t);
   const fontSmall = t.vars?.font?.caption ?? formatFont(t.typography.caption);
   const fontLarge = t.vars?.font?.body1 ?? formatFont(t.typography.body1);
   const k = vars.keys;
   return {
-    [k.spacingUnit]: t.vars ? t.vars.spacing ?? t.spacing(1) : t.spacing(1),
+    [k.spacingUnit]: getSpacingUnit(t),
     [k.colors.border.base]: borderColor,
     [k.colors.background.base]: backgroundBase,
     [k.colors.background.overlay]: backgroundOverlay,
@@ -78,7 +78,17 @@ function getRadius(theme) {
   }
   return typeof theme.shape.borderRadius === 'number' ? `${theme.shape.borderRadius}px` : theme.shape.borderRadius;
 }
-function getBorderColor(theme) {
+export function getBackgroundBase(theme) {
+  const paperColor = (theme.vars || theme).palette.background.paper;
+  return (theme.vars || theme).palette.DataGrid?.bg ?? (theme.palette.mode === 'dark' ? colorMixIfSupported(`color-mix(in srgb, ${paperColor} 95%, #fff)`, paperColor) : paperColor);
+}
+export function getFontBody(theme) {
+  return theme.vars?.font?.body2 ?? formatFont(theme.typography.body2);
+}
+export function getSpacingUnit(theme) {
+  return theme.vars ? theme.vars.spacing ?? theme.spacing(1) : theme.spacing(1);
+}
+export function getBorderColor(theme) {
   if (theme.vars) {
     return theme.vars.palette.TableCell.border;
   }

package/models/api/gridApiCommon.d.mts

@@ -11,7 +11,7 @@ import type { GridLocaleTextApi } from "./gridLocaleTextApi.mjs";
 import type { GridParamsApi, GridParamsPrivateApi } from "./gridParamsApi.mjs";
 import type { GridPreferencesPanelApi } from "./gridPreferencesPanelApi.mjs";
 import type { GridPrintExportApi } from "./gridPrintExportApi.mjs";
-import type { GridRowApi, GridRowProPrivateApi } from "./gridRowApi.mjs";
+import type { GridRowApi, GridRowProPrivateApi, GridRowSpanningPrivateApi } from "./gridRowApi.mjs";
 import type { GridRowsMetaApi, GridRowsMetaPrivateApi } from "./gridRowsMetaApi.mjs";
 import type { GridRowSelectionApi } from "./gridRowSelectionApi.mjs";
 import type { GridSortApi } from "./gridSortApi.mjs";
@@ -32,7 +32,7 @@ import type { DataGridProcessedProps } from "../props/DataGridProps.mjs";
 import type { GridColumnResizeApi } from "../../hooks/features/columnResize/index.mjs";
 import type { GridPivotingPrivateApiCommunity } from "../../hooks/features/pivoting/gridPivotingInterfaces.mjs";
 export interface GridApiCommon<GridState extends GridStateCommunity = GridStateCommunity, GridInitialState extends GridInitialStateCommunity = GridInitialStateCommunity> extends GridCoreApi, GridPipeProcessingApi, GridDensityApi, GridDimensionsApi, GridRowApi, GridRowsMetaApi, GridEditingApi, GridParamsApi, GridColumnApi, GridRowSelectionApi, GridSortApi, GridPaginationApi, GridCsvExportApi, GridFocusApi, GridFilterApi, GridColumnMenuApi, GridPreferencesPanelApi, GridPrintExportApi, GridVirtualizationApi, GridLocaleTextApi, GridScrollApi, GridColumnSpanningApi, GridStateApi<GridState>, GridStatePersistenceApi<GridInitialState>, GridColumnGroupingApi, GridHeaderFilteringApi, GridColumnResizeApi {}
-export interface GridPrivateOnlyApiCommon<Api extends GridApiCommon, PrivateApi extends GridPrivateApiCommon, Props extends DataGridProcessedProps> extends GridCorePrivateApi<Api, PrivateApi, Props>, GridStatePrivateApi<Api['state']>, GridPipeProcessingPrivateApi, GridStrategyProcessingApi, GridColumnSpanningPrivateApi, GridRowsMetaPrivateApi, GridDimensionsPrivateApi, GridEditingPrivateApi, GridLoggerApi, GridFocusPrivateApi, GridHeaderFilteringPrivateApi, GridVirtualizationPrivateApi, GridRowProPrivateApi, GridParamsPrivateApi, GridPivotingPrivateApiCommunity {
+export interface GridPrivateOnlyApiCommon<Api extends GridApiCommon, PrivateApi extends GridPrivateApiCommon, Props extends DataGridProcessedProps> extends GridCorePrivateApi<Api, PrivateApi, Props>, GridStatePrivateApi<Api['state'], Api>, GridPipeProcessingPrivateApi, GridStrategyProcessingApi, GridColumnSpanningPrivateApi, GridRowsMetaPrivateApi, GridDimensionsPrivateApi, GridEditingPrivateApi, GridLoggerApi, GridFocusPrivateApi, GridHeaderFilteringPrivateApi, GridVirtualizationPrivateApi, GridRowProPrivateApi, GridRowSpanningPrivateApi, GridParamsPrivateApi, GridPivotingPrivateApiCommunity {
   virtualizer: Virtualizer;
 }
 export interface GridPrivateApiCommon extends GridApiCommon, GridPrivateOnlyApiCommon<GridApiCommon, GridPrivateApiCommon, DataGridProcessedProps> {}

package/models/api/gridApiCommon.d.ts

@@ -11,7 +11,7 @@ import type { GridLocaleTextApi } from "./gridLocaleTextApi.js";
 import type { GridParamsApi, GridParamsPrivateApi } from "./gridParamsApi.js";
 import type { GridPreferencesPanelApi } from "./gridPreferencesPanelApi.js";
 import type { GridPrintExportApi } from "./gridPrintExportApi.js";
-import type { GridRowApi, GridRowProPrivateApi } from "./gridRowApi.js";
+import type { GridRowApi, GridRowProPrivateApi, GridRowSpanningPrivateApi } from "./gridRowApi.js";
 import type { GridRowsMetaApi, GridRowsMetaPrivateApi } from "./gridRowsMetaApi.js";
 import type { GridRowSelectionApi } from "./gridRowSelectionApi.js";
 import type { GridSortApi } from "./gridSortApi.js";
@@ -32,7 +32,7 @@ import type { DataGridProcessedProps } from "../props/DataGridProps.js";
 import type { GridColumnResizeApi } from "../../hooks/features/columnResize/index.js";
 import type { GridPivotingPrivateApiCommunity } from "../../hooks/features/pivoting/gridPivotingInterfaces.js";
 export interface GridApiCommon<GridState extends GridStateCommunity = GridStateCommunity, GridInitialState extends GridInitialStateCommunity = GridInitialStateCommunity> extends GridCoreApi, GridPipeProcessingApi, GridDensityApi, GridDimensionsApi, GridRowApi, GridRowsMetaApi, GridEditingApi, GridParamsApi, GridColumnApi, GridRowSelectionApi, GridSortApi, GridPaginationApi, GridCsvExportApi, GridFocusApi, GridFilterApi, GridColumnMenuApi, GridPreferencesPanelApi, GridPrintExportApi, GridVirtualizationApi, GridLocaleTextApi, GridScrollApi, GridColumnSpanningApi, GridStateApi<GridState>, GridStatePersistenceApi<GridInitialState>, GridColumnGroupingApi, GridHeaderFilteringApi, GridColumnResizeApi {}
-export interface GridPrivateOnlyApiCommon<Api extends GridApiCommon, PrivateApi extends GridPrivateApiCommon, Props extends DataGridProcessedProps> extends GridCorePrivateApi<Api, PrivateApi, Props>, GridStatePrivateApi<Api['state']>, GridPipeProcessingPrivateApi, GridStrategyProcessingApi, GridColumnSpanningPrivateApi, GridRowsMetaPrivateApi, GridDimensionsPrivateApi, GridEditingPrivateApi, GridLoggerApi, GridFocusPrivateApi, GridHeaderFilteringPrivateApi, GridVirtualizationPrivateApi, GridRowProPrivateApi, GridParamsPrivateApi, GridPivotingPrivateApiCommunity {
+export interface GridPrivateOnlyApiCommon<Api extends GridApiCommon, PrivateApi extends GridPrivateApiCommon, Props extends DataGridProcessedProps> extends GridCorePrivateApi<Api, PrivateApi, Props>, GridStatePrivateApi<Api['state'], Api>, GridPipeProcessingPrivateApi, GridStrategyProcessingApi, GridColumnSpanningPrivateApi, GridRowsMetaPrivateApi, GridDimensionsPrivateApi, GridEditingPrivateApi, GridLoggerApi, GridFocusPrivateApi, GridHeaderFilteringPrivateApi, GridVirtualizationPrivateApi, GridRowProPrivateApi, GridRowSpanningPrivateApi, GridParamsPrivateApi, GridPivotingPrivateApiCommunity {
   virtualizer: Virtualizer;
 }
 export interface GridPrivateApiCommon extends GridApiCommon, GridPrivateOnlyApiCommon<GridApiCommon, GridPrivateApiCommon, DataGridProcessedProps> {}

package/models/api/gridCallbackDetails.d.mts

@@ -1,9 +1,10 @@
+import type { RefObject } from '@mui/x-internals/types';
 import type { GridControlledStateReasonLookup } from "../events/gridEventLookup.mjs";
 import type { GridApiCommon } from "./gridApiCommon.mjs";
 /**
  * Additional details passed to the callbacks
  */
-export interface GridCallbackDetails<K extends keyof GridControlledStateReasonLookup = any> {
+export interface GridCallbackDetails<K extends keyof GridControlledStateReasonLookup = any, Api extends GridApiCommon = GridApiCommon> {
   /**
    * The reason for this callback to have been called.
    */
@@ -12,4 +13,13 @@ export interface GridCallbackDetails<K extends keyof GridControlledStateReasonLo
    * GridApi that let you manipulate the grid.
    */
   api: GridApiCommon;
+  /**
+   * A ref to the GridApi that let you manipulate the grid.
+   * Can be used to call selectors without a separate `useGridApiRef`.
+   * @example
+   * onRowSelectionModelChange={(model, details) => {
+   *   const rows = gridRowSelectionIdsSelector(details.apiRef);
+   * }}
+   */
+  apiRef: Readonly<RefObject<Api>>;
 }

package/models/api/gridCallbackDetails.d.ts

@@ -1,9 +1,10 @@
+import type { RefObject } from '@mui/x-internals/types';
 import type { GridControlledStateReasonLookup } from "../events/gridEventLookup.js";
 import type { GridApiCommon } from "./gridApiCommon.js";
 /**
  * Additional details passed to the callbacks
  */
-export interface GridCallbackDetails<K extends keyof GridControlledStateReasonLookup = any> {
+export interface GridCallbackDetails<K extends keyof GridControlledStateReasonLookup = any, Api extends GridApiCommon = GridApiCommon> {
   /**
    * The reason for this callback to have been called.
    */
@@ -12,4 +13,13 @@ export interface GridCallbackDetails<K extends keyof GridControlledStateReasonLo
    * GridApi that let you manipulate the grid.
    */
   api: GridApiCommon;
+  /**
+   * A ref to the GridApi that let you manipulate the grid.
+   * Can be used to call selectors without a separate `useGridApiRef`.
+   * @example
+   * onRowSelectionModelChange={(model, details) => {
+   *   const rows = gridRowSelectionIdsSelector(details.apiRef);
+   * }}
+   */
+  apiRef: Readonly<RefObject<Api>>;
 }

package/models/api/gridLocaleTextApi.d.mts

@@ -34,6 +34,9 @@ export interface GridLocaleText {
   toolbarPivot: string;
   toolbarCharts: string;
   toolbarAssistant: React.ReactNode;
+  formulaBarLabel: string;
+  formulaBarInputLabel: string;
+  formulaBarAddressLabel: string;
   columnsManagementSearchTitle: string;
   columnsManagementNoColumns: string;
   columnsManagementShowHideAllText: string;

package/models/api/gridLocaleTextApi.d.ts

@@ -34,6 +34,9 @@ export interface GridLocaleText {
   toolbarPivot: string;
   toolbarCharts: string;
   toolbarAssistant: React.ReactNode;
+  formulaBarLabel: string;
+  formulaBarInputLabel: string;
+  formulaBarAddressLabel: string;
   columnsManagementSearchTitle: string;
   columnsManagementNoColumns: string;
   columnsManagementShowHideAllText: string;

package/models/api/gridRowApi.d.mts

@@ -1,4 +1,4 @@
-import type { GridRowModel, GridRowId, GridRowModelUpdate, GridValidRowModel, GridTreeNode } from "../gridRows.mjs";
+import type { GridRowModel, GridRowId, GridRowModelUpdate, GridRowModelReplace, GridValidRowModel, GridTreeNode } from "../gridRows.mjs";
 export type RowReorderDropPosition = 'above' | 'below' | 'inside';
 export type RowReorderDragDirection = 'up' | 'down';
 export interface GridRowGroupChildrenGetterParams {
@@ -58,10 +58,10 @@ export interface GridRowApi {
    */
   setRows: (rows: GridRowModel[]) => void;
   /**
-   * Allows to update, insert and delete rows.
-   * @param {GridRowModelUpdate[]} updates An array of rows with an `action` specifying what to do.
+   * Allows to update, insert, replace and delete rows.
+   * @param {Array<GridRowModelUpdate | GridRowModelReplace>} updates An array of rows with an `action` specifying what to do.
    */
-  updateRows: (updates: GridRowModelUpdate[]) => void;
+  updateRows: (updates: Array<GridRowModelUpdate | GridRowModelReplace>) => void;
   /**
    * Gets the row data with a given id.
    * @param {GridRowId} id The id of the row.
@@ -139,9 +139,21 @@ export interface GridRowProApi {
 }
 export interface GridRowProPrivateApi {
   /**
-   * Allows to update, insert and delete rows at a specific nested level.
-   * @param {GridRowModelUpdate[]} updates An array of rows with an `action` specifying what to do.
+   * Allows to update, insert, replace and delete rows at a specific nested level.
+   * @param {Array<GridRowModelUpdate | GridRowModelReplace>} updates An array of rows with an `action` specifying what to do.
    * @param {string[]} nestedLevel The nested level of the rows to update, it represents the path to the row in the tree based on `node.groupingKey`.
    */
-  updateNestedRows: (updates: GridRowModelUpdate[], nestedLevel?: string[]) => void;
+  updateNestedRows: (updates: Array<GridRowModelUpdate | GridRowModelReplace>, nestedLevel?: string[]) => void;
+}
+export interface GridRowSpanningPrivateApi {
+  /**
+   * Recomputes the row spanning state from scratch.
+   * Row spanning recomputes on its own after row, sort, filter, pagination,
+   * and column updates. Features that change the values cells resolve to
+   * without emitting any of those events (for example a formula evaluation
+   * pass, whose value overlay changes evaluated results in place) call this
+   * method to keep the spans in sync. No-op when the `rowSpanning` prop is
+   * not enabled.
+   */
+  resetRowSpanningState: () => void;
 }

package/models/api/gridRowApi.d.ts

@@ -1,4 +1,4 @@
-import type { GridRowModel, GridRowId, GridRowModelUpdate, GridValidRowModel, GridTreeNode } from "../gridRows.js";
+import type { GridRowModel, GridRowId, GridRowModelUpdate, GridRowModelReplace, GridValidRowModel, GridTreeNode } from "../gridRows.js";
 export type RowReorderDropPosition = 'above' | 'below' | 'inside';
 export type RowReorderDragDirection = 'up' | 'down';
 export interface GridRowGroupChildrenGetterParams {
@@ -58,10 +58,10 @@ export interface GridRowApi {
    */
   setRows: (rows: GridRowModel[]) => void;
   /**
-   * Allows to update, insert and delete rows.
-   * @param {GridRowModelUpdate[]} updates An array of rows with an `action` specifying what to do.
+   * Allows to update, insert, replace and delete rows.
+   * @param {Array<GridRowModelUpdate | GridRowModelReplace>} updates An array of rows with an `action` specifying what to do.
    */
-  updateRows: (updates: GridRowModelUpdate[]) => void;
+  updateRows: (updates: Array<GridRowModelUpdate | GridRowModelReplace>) => void;
   /**
    * Gets the row data with a given id.
    * @param {GridRowId} id The id of the row.
@@ -139,9 +139,21 @@ export interface GridRowProApi {
 }
 export interface GridRowProPrivateApi {
   /**
-   * Allows to update, insert and delete rows at a specific nested level.
-   * @param {GridRowModelUpdate[]} updates An array of rows with an `action` specifying what to do.
+   * Allows to update, insert, replace and delete rows at a specific nested level.
+   * @param {Array<GridRowModelUpdate | GridRowModelReplace>} updates An array of rows with an `action` specifying what to do.
    * @param {string[]} nestedLevel The nested level of the rows to update, it represents the path to the row in the tree based on `node.groupingKey`.
    */
-  updateNestedRows: (updates: GridRowModelUpdate[], nestedLevel?: string[]) => void;
+  updateNestedRows: (updates: Array<GridRowModelUpdate | GridRowModelReplace>, nestedLevel?: string[]) => void;
+}
+export interface GridRowSpanningPrivateApi {
+  /**
+   * Recomputes the row spanning state from scratch.
+   * Row spanning recomputes on its own after row, sort, filter, pagination,
+   * and column updates. Features that change the values cells resolve to
+   * without emitting any of those events (for example a formula evaluation
+   * pass, whose value overlay changes evaluated results in place) call this
+   * method to keep the spans in sync. No-op when the `rowSpanning` prop is
+   * not enabled.
+   */
+  resetRowSpanningState: () => void;
 }

package/models/api/gridStateApi.d.mts

@@ -1,6 +1,7 @@
 import type { GridStateCommunity } from "../gridStateCommunity.mjs";
 import type { GridControlledStateEventLookup, GridControlledStateReasonLookup } from "../events/index.mjs";
 import type { GridControlStateItem } from "../controlStateItem.mjs";
+import type { GridApiCommon } from "./gridApiCommon.mjs";
 export interface GridStateApi<State extends GridStateCommunity> {
   /**
    * Property that contains the whole state of the grid.
@@ -15,7 +16,7 @@ export interface GridStateApi<State extends GridStateCommunity> {
    */
   setState: <S extends State, K extends keyof GridControlledStateReasonLookup>(state: S | ((previousState: S) => S), reason?: GridControlledStateReasonLookup[K]) => boolean;
 }
-export interface GridStatePrivateApi<State extends GridStateCommunity> {
+export interface GridStatePrivateApi<State extends GridStateCommunity, Api extends GridApiCommon = GridApiCommon> {
   /**
    * Updates a single sub-state.
    * Publishes the `xxxChange` event and calls the `onXXXChange` prop.
@@ -29,5 +30,5 @@ export interface GridStatePrivateApi<State extends GridStateCommunity> {
    * Updates a control state that binds the model, the onChange prop, and the grid state together.
    * @param {GridControlStateItem>} controlState The [[GridControlStateItem]] to be registered.
    */
-  registerControlState: <E extends keyof GridControlledStateEventLookup, Args>(controlState: GridControlStateItem<State, Args, E>) => void;
+  registerControlState: <E extends keyof GridControlledStateEventLookup, Args>(controlState: GridControlStateItem<State, Args, E, Api>) => void;
 }

package/models/api/gridStateApi.d.ts

@@ -1,6 +1,7 @@
 import type { GridStateCommunity } from "../gridStateCommunity.js";
 import type { GridControlledStateEventLookup, GridControlledStateReasonLookup } from "../events/index.js";
 import type { GridControlStateItem } from "../controlStateItem.js";
+import type { GridApiCommon } from "./gridApiCommon.js";
 export interface GridStateApi<State extends GridStateCommunity> {
   /**
    * Property that contains the whole state of the grid.
@@ -15,7 +16,7 @@ export interface GridStateApi<State extends GridStateCommunity> {
    */
   setState: <S extends State, K extends keyof GridControlledStateReasonLookup>(state: S | ((previousState: S) => S), reason?: GridControlledStateReasonLookup[K]) => boolean;
 }
-export interface GridStatePrivateApi<State extends GridStateCommunity> {
+export interface GridStatePrivateApi<State extends GridStateCommunity, Api extends GridApiCommon = GridApiCommon> {
   /**
    * Updates a single sub-state.
    * Publishes the `xxxChange` event and calls the `onXXXChange` prop.
@@ -29,5 +30,5 @@ export interface GridStatePrivateApi<State extends GridStateCommunity> {
    * Updates a control state that binds the model, the onChange prop, and the grid state together.
    * @param {GridControlStateItem>} controlState The [[GridControlStateItem]] to be registered.
    */
-  registerControlState: <E extends keyof GridControlledStateEventLookup, Args>(controlState: GridControlStateItem<State, Args, E>) => void;
+  registerControlState: <E extends keyof GridControlledStateEventLookup, Args>(controlState: GridControlStateItem<State, Args, E, Api>) => void;
 }

package/models/api/index.d.mts

@@ -3,7 +3,7 @@ export type { GridParamsApi } from "./gridParamsApi.mjs";
 export type { GridCoreApi } from "./gridCoreApi.mjs";
 export * from "./gridColumnApi.mjs";
 export * from "./gridDensityApi.mjs";
-export type { GridRowGroupChildrenGetterParams, GridRowApi, GridRowProApi, GridRowProPrivateApi } from "./gridRowApi.mjs";
+export type { GridRowGroupChildrenGetterParams, GridRowApi, GridRowProApi, GridRowProPrivateApi, GridRowSpanningPrivateApi } from "./gridRowApi.mjs";
 export type { GridRowsMetaApi } from "./gridRowsMetaApi.mjs";
 export * from "./gridRowSelectionApi.mjs";
 export * from "./gridSortApi.mjs";

package/models/api/index.d.ts

@@ -3,7 +3,7 @@ export type { GridParamsApi } from "./gridParamsApi.js";
 export type { GridCoreApi } from "./gridCoreApi.js";
 export * from "./gridColumnApi.js";
 export * from "./gridDensityApi.js";
-export type { GridRowGroupChildrenGetterParams, GridRowApi, GridRowProApi, GridRowProPrivateApi } from "./gridRowApi.js";
+export type { GridRowGroupChildrenGetterParams, GridRowApi, GridRowProApi, GridRowProPrivateApi, GridRowSpanningPrivateApi } from "./gridRowApi.js";
 export type { GridRowsMetaApi } from "./gridRowsMetaApi.js";
 export * from "./gridRowSelectionApi.js";
 export * from "./gridSortApi.js";

package/models/colDef/gridColDef.d.mts

@@ -44,6 +44,11 @@ export interface GridBaseColDef<R extends GridValidRowModel = GridValidRowModel,
    * The title displayed in the column header cell.
    */
   headerName?: string;
+  /**
+   * If `true`, the cells in this column identify their respective rows and receive the `rowheader` ARIA role.
+   * @default false
+   */
+  rowHeader?: boolean;
   /**
    * The tooltip text shown when the column header name is truncated.
    */

package/models/colDef/gridColDef.d.ts

@@ -44,6 +44,11 @@ export interface GridBaseColDef<R extends GridValidRowModel = GridValidRowModel,
    * The title displayed in the column header cell.
    */
   headerName?: string;
+  /**
+   * If `true`, the cells in this column identify their respective rows and receive the `rowheader` ARIA role.
+   * @default false
+   */
+  rowHeader?: boolean;
   /**
    * The tooltip text shown when the column header name is truncated.
    */

package/models/configuration/gridConfiguration.d.mts

@@ -10,7 +10,19 @@ import type { GridParamsOverridableMethodsInternalHook } from "./gridParamsConfi
 export interface GridAriaAttributesInternalHook {
   useGridAriaAttributes: () => React.HTMLAttributes<HTMLElement>;
 }
-export interface GridInternalHook<Api, Props> extends GridAriaAttributesInternalHook, GridRowAriaAttributesInternalHook, GridCellEditableInternalHook<Api, Props>, GridAggregationInternalHooks<Api, Props>, GridRowsOverridableMethodsInternalHook<Api, Props>, GridParamsOverridableMethodsInternalHook<Api> {
+export interface GridColumnHeaderAdornmentInternalHook {
+  /**
+   * Returns an optional adornment rendered inside a column header's title
+   * content, at the start, before the title label. Placing it inside the
+   * (non-reversed) title content keeps it on the same side of the title for
+   * both left- and right-aligned headers. Called once per rendered header
+   * cell, so the implementation may use hooks.
+   * @param {string} field The column field.
+   * @returns {React.ReactNode} The adornment node, or `null` for none.
+   */
+  useColumnHeaderAdornment: (field: string) => React.ReactNode;
+}
+export interface GridInternalHook<Api, Props> extends GridAriaAttributesInternalHook, GridRowAriaAttributesInternalHook, GridCellEditableInternalHook<Api, Props>, GridAggregationInternalHooks<Api, Props>, GridColumnHeaderAdornmentInternalHook, GridRowsOverridableMethodsInternalHook<Api, Props>, GridParamsOverridableMethodsInternalHook<Api> {
   useCSSVariables: () => {
     id: string;
     variables: GridCSSVariablesInterface;

package/models/configuration/gridConfiguration.d.ts

@@ -10,7 +10,19 @@ import type { GridParamsOverridableMethodsInternalHook } from "./gridParamsConfi
 export interface GridAriaAttributesInternalHook {
   useGridAriaAttributes: () => React.HTMLAttributes<HTMLElement>;
 }
-export interface GridInternalHook<Api, Props> extends GridAriaAttributesInternalHook, GridRowAriaAttributesInternalHook, GridCellEditableInternalHook<Api, Props>, GridAggregationInternalHooks<Api, Props>, GridRowsOverridableMethodsInternalHook<Api, Props>, GridParamsOverridableMethodsInternalHook<Api> {
+export interface GridColumnHeaderAdornmentInternalHook {
+  /**
+   * Returns an optional adornment rendered inside a column header's title
+   * content, at the start, before the title label. Placing it inside the
+   * (non-reversed) title content keeps it on the same side of the title for
+   * both left- and right-aligned headers. Called once per rendered header
+   * cell, so the implementation may use hooks.
+   * @param {string} field The column field.
+   * @returns {React.ReactNode} The adornment node, or `null` for none.
+   */
+  useColumnHeaderAdornment: (field: string) => React.ReactNode;
+}
+export interface GridInternalHook<Api, Props> extends GridAriaAttributesInternalHook, GridRowAriaAttributesInternalHook, GridCellEditableInternalHook<Api, Props>, GridAggregationInternalHooks<Api, Props>, GridColumnHeaderAdornmentInternalHook, GridRowsOverridableMethodsInternalHook<Api, Props>, GridParamsOverridableMethodsInternalHook<Api> {
   useCSSVariables: () => {
     id: string;
     variables: GridCSSVariablesInterface;

package/models/controlStateItem.d.mts

@@ -1,14 +1,15 @@
 import type { RefObject } from '@mui/x-internals/types';
 import type { GridCallbackDetails } from "./api/gridCallbackDetails.mjs";
+import type { GridApiCommon } from "./api/gridApiCommon.mjs";
 import type { GridEventLookup, GridControlledStateEventLookup } from "./events/index.mjs";
 import type { OutputSelector } from "../utils/createSelector.mjs";
 import type { GridStateCommunity } from "./gridStateCommunity.mjs";
-export interface GridControlStateItem<State extends GridStateCommunity, Args, E extends keyof GridControlledStateEventLookup> {
+export interface GridControlStateItem<State extends GridStateCommunity, Args, E extends keyof GridControlledStateEventLookup, Api extends GridApiCommon = GridApiCommon> {
   stateId: string;
   propModel?: GridEventLookup[E]['params'];
   stateSelector: OutputSelector<State, Args, GridControlledStateEventLookup[E]['params']> | ((apiRef: RefObject<{
     state: State;
   }>) => GridControlledStateEventLookup[E]['params']);
-  propOnChange?: (model: GridControlledStateEventLookup[E]['params'], details: GridCallbackDetails) => void;
+  propOnChange?: (model: GridControlledStateEventLookup[E]['params'], details: GridCallbackDetails<any, Api>) => void;
   changeEvent: E;
 }