diff --git a/docs/pages/x/api/data-grid/grid-cell-params.json b/docs/pages/x/api/data-grid/grid-cell-params.json
index ff6ddfd6dd02d..2e99ec3bc0fab 100644
--- a/docs/pages/x/api/data-grid/grid-cell-params.json
+++ b/docs/pages/x/api/data-grid/grid-cell-params.json
@@ -6,6 +6,7 @@
"import { GridCellParams } from '@mui/x-data-grid'"
],
"properties": {
+ "api": { "type": { "description": "GridApiCommunity" }, "required": true },
"cellMode": { "type": { "description": "GridCellMode" }, "required": true },
"colDef": { "type": { "description": "GridStateColDef" }, "required": true },
"field": { "type": { "description": "string" }, "required": true },
diff --git a/docs/translations/api-docs/data-grid/grid-cell-params.json b/docs/translations/api-docs/data-grid/grid-cell-params.json
index 39d3bbcc36617..b9be4d64e27e5 100644
--- a/docs/translations/api-docs/data-grid/grid-cell-params.json
+++ b/docs/translations/api-docs/data-grid/grid-cell-params.json
@@ -1,6 +1,7 @@
{
"interfaceDescription": "Object passed as parameter in the column GridColDef cell renderer.",
"propertiesDescriptions": {
+ "api": { "description": "GridApi that let you manipulate the grid." },
"cellMode": { "description": "The mode of the cell." },
"colDef": { "description": "The column of the row that the current cell belongs to." },
"field": { "description": "The column field of the cell that triggered the event." },
diff --git a/packages/x-data-grid/src/components/cell/GridCell.tsx b/packages/x-data-grid/src/components/cell/GridCell.tsx
index 68feacc68c28c..81ddc96ba4fac 100644
--- a/packages/x-data-grid/src/components/cell/GridCell.tsx
+++ b/packages/x-data-grid/src/components/cell/GridCell.tsx
@@ -8,7 +8,6 @@ import {
unstable_capitalize as capitalize,
} from '@mui/utils';
import { fastMemo } from '@mui/x-internals/fastMemo';
-import type { GridApiCommunity } from '../../internals';
import { doesSupportPreventScroll } from '../../utils/doesSupportPreventScroll';
import { getDataGridUtilityClass, gridClasses } from '../../constants/gridClasses';
import {
@@ -75,11 +74,7 @@ export type GridCellProps = {
[x: string]: any; // TODO v7: remove this - it breaks type safety
};
-type CellParamsWithAPI = GridCellParams & {
- api: GridApiCommunity;
-};
-
-const EMPTY_CELL_PARAMS: CellParamsWithAPI = {
+const EMPTY_CELL_PARAMS: GridCellParams = {
id: -1,
field: '__unset__',
row: {},
@@ -183,19 +178,17 @@ const GridCell = React.forwardRef(function GridCe
const field = column.field;
- const cellParamsWithAPI = useGridSelector(
+ const cellParams = useGridSelector(
apiRef,
() => {
// This is required because `.getCellParams` tries to get the `state.rows.tree` entry
// associated with `rowId`/`fieldId`, but this selector runs after the state has been
// updated, while `rowId`/`fieldId` reference an entry in the old state.
try {
- const cellParams = apiRef.current.getCellParams(
+ const result = apiRef.current.getCellParams(
rowId,
field,
);
-
- const result = cellParams as CellParamsWithAPI;
result.api = apiRef.current;
return result;
} catch (e) {
@@ -215,7 +208,7 @@ const GridCell = React.forwardRef(function GridCe
}),
);
- const { cellMode, hasFocus, isEditable = false, value } = cellParamsWithAPI;
+ const { cellMode, hasFocus, isEditable = false, value } = cellParams;
const canManageOwnFocus =
column.type === 'actions' &&
@@ -223,7 +216,7 @@ const GridCell = React.forwardRef(function GridCe
.getActions?.(apiRef.current.getRowParams(rowId))
.some((action) => !action.props.disabled);
const tabIndex =
- (cellMode === 'view' || !isEditable) && !canManageOwnFocus ? cellParamsWithAPI.tabIndex : -1;
+ (cellMode === 'view' || !isEditable) && !canManageOwnFocus ? cellParams.tabIndex : -1;
const { classes: rootClasses, getCellClassName } = rootProps;
@@ -243,7 +236,7 @@ const GridCell = React.forwardRef(function GridCe
if (column.cellClassName) {
classNames.push(
typeof column.cellClassName === 'function'
- ? column.cellClassName(cellParamsWithAPI)
+ ? column.cellClassName(cellParams)
: column.cellClassName,
);
}
@@ -253,10 +246,10 @@ const GridCell = React.forwardRef(function GridCe
}
if (getCellClassName) {
- classNames.push(getCellClassName(cellParamsWithAPI));
+ classNames.push(getCellClassName(cellParams));
}
- const valueToRender = cellParamsWithAPI.formattedValue ?? value;
+ const valueToRender = cellParams.formattedValue ?? value;
const cellRef = React.useRef(null);
const handleRef = useForkRef(ref, cellRef);
const focusElementRef = React.useRef(null);
@@ -373,7 +366,7 @@ const GridCell = React.forwardRef(function GridCe
}
}, [hasFocus, cellMode, apiRef]);
- if (cellParamsWithAPI === EMPTY_CELL_PARAMS) {
+ if (cellParams === EMPTY_CELL_PARAMS) {
return null;
}
@@ -411,7 +404,7 @@ const GridCell = React.forwardRef(function GridCe
let title: string | undefined;
if (editCellState === null && column.renderCell) {
- children = column.renderCell(cellParamsWithAPI);
+ children = column.renderCell(cellParams);
}
if (editCellState !== null && column.renderEditCell) {
@@ -422,10 +415,10 @@ const GridCell = React.forwardRef(function GridCe
const formattedValue = column.valueFormatter
? column.valueFormatter(editCellState.value as never, updatedRow, column, apiRef)
- : cellParamsWithAPI.formattedValue;
+ : cellParams.formattedValue;
const params: GridRenderEditCellParams = {
- ...cellParamsWithAPI,
+ ...cellParams,
row: updatedRow,
formattedValue,
...editCellStateRest,
diff --git a/packages/x-data-grid/src/hooks/features/rows/useGridParamsApi.ts b/packages/x-data-grid/src/hooks/features/rows/useGridParamsApi.ts
index 165ba3ee211c0..b663d9700a783 100644
--- a/packages/x-data-grid/src/hooks/features/rows/useGridParamsApi.ts
+++ b/packages/x-data-grid/src/hooks/features/rows/useGridParamsApi.ts
@@ -77,6 +77,7 @@ export function useGridParamsApi(apiRef: React.MutableRefObject