diff --git a/docs/data/data-grid/filtering/header-filters.md b/docs/data/data-grid/filtering/header-filters.md
index 4022fffdfdd7..fea11f2b5452 100644
--- a/docs/data/data-grid/filtering/header-filters.md
+++ b/docs/data/data-grid/filtering/header-filters.md
@@ -67,6 +67,15 @@ Additionally, `slots.headerFilterMenu` could also be used to customize the menu
{{"demo": "CustomHeaderFilterDataGridPro.js", "bg": "inline", "defaultCodeOpen": false}}
+### Custom header filter height
+
+By default, the height of the header filter row is the same as the header row (represented by `columnHeaderHeight` prop).
+You can customize the height of the header filter cell using the `headerFilterHeight` prop.
+
+```tsx
+
+```
+
## Ignore diacritics (accents)
You can ignore diacritics (accents) when filtering the rows. See [Quick filter - Ignore diacritics (accents)](/x/react-data-grid/filtering/quick-filter/#ignore-diacritics-accents).
diff --git a/docs/pages/x/api/data-grid/data-grid-premium.json b/docs/pages/x/api/data-grid/data-grid-premium.json
index 56215024f027..d680b3db5462 100644
--- a/docs/pages/x/api/data-grid/data-grid-premium.json
+++ b/docs/pages/x/api/data-grid/data-grid-premium.json
@@ -163,6 +163,7 @@
}
},
"groupingColDef": { "type": { "name": "union", "description": "func
| object" } },
+ "headerFilterHeight": { "type": { "name": "number" } },
"headerFilters": { "type": { "name": "bool" }, "default": "false" },
"hideFooter": { "type": { "name": "bool" }, "default": "false" },
"hideFooterPagination": { "type": { "name": "bool" }, "default": "false" },
diff --git a/docs/pages/x/api/data-grid/data-grid-pro.json b/docs/pages/x/api/data-grid/data-grid-pro.json
index 2de559b31451..1c430f5a3052 100644
--- a/docs/pages/x/api/data-grid/data-grid-pro.json
+++ b/docs/pages/x/api/data-grid/data-grid-pro.json
@@ -140,6 +140,7 @@
}
},
"groupingColDef": { "type": { "name": "union", "description": "func
| object" } },
+ "headerFilterHeight": { "type": { "name": "number" } },
"headerFilters": { "type": { "name": "bool" }, "default": "false" },
"hideFooter": { "type": { "name": "bool" }, "default": "false" },
"hideFooterPagination": { "type": { "name": "bool" }, "default": "false" },
diff --git a/docs/translations/api-docs/data-grid/data-grid-premium/data-grid-premium.json b/docs/translations/api-docs/data-grid/data-grid-premium/data-grid-premium.json
index e4650258c745..f62380f50c38 100644
--- a/docs/translations/api-docs/data-grid/data-grid-premium/data-grid-premium.json
+++ b/docs/translations/api-docs/data-grid/data-grid-premium/data-grid-premium.json
@@ -179,6 +179,7 @@
}
},
"groupingColDef": { "description": "The grouping column used by the tree data." },
+ "headerFilterHeight": { "description": "Override the height of the header filters." },
"headerFilters": {
"description": "If true
, enables the data grid filtering on header feature."
},
diff --git a/docs/translations/api-docs/data-grid/data-grid-pro/data-grid-pro.json b/docs/translations/api-docs/data-grid/data-grid-pro/data-grid-pro.json
index 44babc11d794..6898229f45b3 100644
--- a/docs/translations/api-docs/data-grid/data-grid-pro/data-grid-pro.json
+++ b/docs/translations/api-docs/data-grid/data-grid-pro/data-grid-pro.json
@@ -160,6 +160,7 @@
}
},
"groupingColDef": { "description": "The grouping column used by the tree data." },
+ "headerFilterHeight": { "description": "Override the height of the header filters." },
"headerFilters": {
"description": "If true
, enables the data grid filtering on header feature."
},
diff --git a/packages/x-data-grid-premium/src/DataGridPremium/DataGridPremium.tsx b/packages/x-data-grid-premium/src/DataGridPremium/DataGridPremium.tsx
index 1f3caece0f9a..ed9e568c6f46 100644
--- a/packages/x-data-grid-premium/src/DataGridPremium/DataGridPremium.tsx
+++ b/packages/x-data-grid-premium/src/DataGridPremium/DataGridPremium.tsx
@@ -422,6 +422,10 @@ DataGridPremiumRaw.propTypes = {
* The grouping column used by the tree data.
*/
groupingColDef: PropTypes.oneOfType([PropTypes.func, PropTypes.object]),
+ /**
+ * Override the height of the header filters.
+ */
+ headerFilterHeight: PropTypes.number,
/**
* If `true`, enables the data grid filtering on header feature.
* @default false
diff --git a/packages/x-data-grid-premium/src/hooks/features/cellSelection/useGridCellSelection.ts b/packages/x-data-grid-premium/src/hooks/features/cellSelection/useGridCellSelection.ts
index ad700ae7eca1..e83cd6834b8b 100644
--- a/packages/x-data-grid-premium/src/hooks/features/cellSelection/useGridCellSelection.ts
+++ b/packages/x-data-grid-premium/src/hooks/features/cellSelection/useGridCellSelection.ts
@@ -68,7 +68,7 @@ export const useGridCellSelection = (
const autoScrollRAF = React.useRef();
const sortedRowIds = useGridSelector(apiRef, gridSortedRowIdsSelector);
const dimensions = useGridSelector(apiRef, gridDimensionsSelector);
- const totalHeaderHeight = getTotalHeaderHeight(apiRef, props.columnHeaderHeight);
+ const totalHeaderHeight = getTotalHeaderHeight(apiRef, props);
const ignoreValueFormatterProp = props.ignoreValueFormatterDuringExport;
const ignoreValueFormatter =
diff --git a/packages/x-data-grid-pro/src/DataGridPro/DataGridPro.tsx b/packages/x-data-grid-pro/src/DataGridPro/DataGridPro.tsx
index 1b9dce1dbcf4..272316b357e7 100644
--- a/packages/x-data-grid-pro/src/DataGridPro/DataGridPro.tsx
+++ b/packages/x-data-grid-pro/src/DataGridPro/DataGridPro.tsx
@@ -363,6 +363,10 @@ DataGridProRaw.propTypes = {
* The grouping column used by the tree data.
*/
groupingColDef: PropTypes.oneOfType([PropTypes.func, PropTypes.object]),
+ /**
+ * Override the height of the header filters.
+ */
+ headerFilterHeight: PropTypes.number,
/**
* If `true`, enables the data grid filtering on header feature.
* @default false
diff --git a/packages/x-data-grid-pro/src/hooks/features/columnHeaders/useGridColumnHeaders.tsx b/packages/x-data-grid-pro/src/hooks/features/columnHeaders/useGridColumnHeaders.tsx
index 9e9a6b446ea3..5465063b1a27 100644
--- a/packages/x-data-grid-pro/src/hooks/features/columnHeaders/useGridColumnHeaders.tsx
+++ b/packages/x-data-grid-pro/src/hooks/features/columnHeaders/useGridColumnHeaders.tsx
@@ -127,7 +127,7 @@ export const useGridColumnHeaders = (props: UseGridColumnHeadersProps) => {
extends Omit<
- DataGridPropsWithoutDefaultValue,
- 'initialState' | 'componentsProps' | 'slotProps'
- > {
+ DataGridPropsWithoutDefaultValue,
+ 'initialState' | 'componentsProps' | 'slotProps'
+ >,
+ DataGridProSharedPropsWithoutDefaultValue {
/**
* The ref object that allows grid manipulation. Can be instantiated with `useGridApiRef()`.
*/
diff --git a/packages/x-data-grid-pro/src/tests/layout.DataGridPro.test.tsx b/packages/x-data-grid-pro/src/tests/layout.DataGridPro.test.tsx
index 3471efe273e6..dc631df9fe10 100644
--- a/packages/x-data-grid-pro/src/tests/layout.DataGridPro.test.tsx
+++ b/packages/x-data-grid-pro/src/tests/layout.DataGridPro.test.tsx
@@ -143,6 +143,22 @@ describe(' - Layout', () => {
});
});
+ it('should work with `headerFilterHeight` prop', () => {
+ render(
+
+
+
,
+ );
+ expect(grid('main')!.clientHeight).to.equal(baselineProps.rows.length * 20 + 20 + 32);
+ });
+
it('should support translations in the theme', () => {
render(
diff --git a/packages/x-data-grid/src/components/GridRow.tsx b/packages/x-data-grid/src/components/GridRow.tsx
index 6157ed735ba3..5e9854587a4e 100644
--- a/packages/x-data-grid/src/components/GridRow.tsx
+++ b/packages/x-data-grid/src/components/GridRow.tsx
@@ -545,6 +545,7 @@ GridRow.propTypes = {
}).isRequired,
hasScrollX: PropTypes.bool.isRequired,
hasScrollY: PropTypes.bool.isRequired,
+ headerFilterHeight: PropTypes.number.isRequired,
headerHeight: PropTypes.number.isRequired,
headersTotalHeight: PropTypes.number.isRequired,
isReady: PropTypes.bool.isRequired,
diff --git a/packages/x-data-grid/src/components/GridScrollArea.tsx b/packages/x-data-grid/src/components/GridScrollArea.tsx
index 8abd78dfb49d..59752fd21305 100644
--- a/packages/x-data-grid/src/components/GridScrollArea.tsx
+++ b/packages/x-data-grid/src/components/GridScrollArea.tsx
@@ -97,7 +97,7 @@ function GridScrollAreaRaw(props: ScrollAreaProps) {
const rootProps = useGridRootProps();
const ownerState = { ...rootProps, scrollDirection };
const classes = useUtilityClasses(ownerState);
- const totalHeaderHeight = getTotalHeaderHeight(apiRef, rootProps.columnHeaderHeight);
+ const totalHeaderHeight = getTotalHeaderHeight(apiRef, rootProps);
const headerHeight = Math.floor(rootProps.columnHeaderHeight * densityFactor);
const style: React.CSSProperties = {
diff --git a/packages/x-data-grid/src/components/cell/GridCell.tsx b/packages/x-data-grid/src/components/cell/GridCell.tsx
index 4c1b45ac20aa..0a84b3eb627e 100644
--- a/packages/x-data-grid/src/components/cell/GridCell.tsx
+++ b/packages/x-data-grid/src/components/cell/GridCell.tsx
@@ -31,10 +31,7 @@ import { useGridApiContext } from '../../hooks/utils/useGridApiContext';
import { useGridRootProps } from '../../hooks/utils/useGridRootProps';
import { gridFocusCellSelector } from '../../hooks/features/focus/gridFocusStateSelector';
import { MissingRowIdError } from '../../hooks/features/rows/useGridParamsApi';
-import type {
- DataGridProcessedProps,
- DataGridProcessedPropsWithShared,
-} from '../../models/props/DataGridProps';
+import type { DataGridProcessedProps } from '../../models/props/DataGridProps';
import { shouldCellShowLeftBorder, shouldCellShowRightBorder } from '../../utils/cellBorderUtils';
import { GridPinnedColumnPosition } from '../../hooks/features/columns/gridColumnsInterfaces';
@@ -182,7 +179,7 @@ const GridCell = React.forwardRef((props, ref) =>
} = props;
const apiRef = useGridApiContext();
- const rootProps = useGridRootProps() as DataGridProcessedPropsWithShared;
+ const rootProps = useGridRootProps();
const field = column.field;
diff --git a/packages/x-data-grid/src/hooks/features/columnHeaders/useGridColumnHeaders.tsx b/packages/x-data-grid/src/hooks/features/columnHeaders/useGridColumnHeaders.tsx
index d3c513e248d6..e748eb161570 100644
--- a/packages/x-data-grid/src/hooks/features/columnHeaders/useGridColumnHeaders.tsx
+++ b/packages/x-data-grid/src/hooks/features/columnHeaders/useGridColumnHeaders.tsx
@@ -74,7 +74,6 @@ export const GridColumnHeaderRow = styled('div', {
overridesResolver: (_, styles) => styles.columnHeaderRow,
})<{ ownerState: OwnerState }>({
display: 'flex',
- height: 'var(--DataGrid-headerHeight)',
});
export const useGridColumnHeaders = (props: UseGridColumnHeadersProps) => {
diff --git a/packages/x-data-grid/src/hooks/features/columns/gridColumnsUtils.ts b/packages/x-data-grid/src/hooks/features/columns/gridColumnsUtils.ts
index 7da63d617fef..94ec07bb341a 100644
--- a/packages/x-data-grid/src/hooks/features/columns/gridColumnsUtils.ts
+++ b/packages/x-data-grid/src/hooks/features/columns/gridColumnsUtils.ts
@@ -12,6 +12,7 @@ import {
GRID_STRING_COL_DEF,
getGridDefaultColumnTypes,
} from '../../../colDef';
+import { DataGridProcessedProps } from '../../../models/props/DataGridProps';
import { GridApiCommunity } from '../../../models/api/gridApiCommunity';
import { GridColDef, GridStateColDef } from '../../../models/colDef/gridColDef';
import { gridColumnsStateSelector, gridColumnVisibilityModelSelector } from './gridColumnsSelector';
@@ -431,11 +432,16 @@ export function getFirstNonSpannedColumnToRender({
export function getTotalHeaderHeight(
apiRef: React.MutableRefObject,
- headerHeight: number,
+ props: Pick,
) {
const densityFactor = gridDensityFactorSelector(apiRef);
const maxDepth = gridColumnGroupsHeaderMaxDepthSelector(apiRef);
const isHeaderFilteringEnabled = gridHeaderFilteringEnabledSelector(apiRef);
- const multiplicationFactor = isHeaderFilteringEnabled ? 2 : 1;
- return Math.floor(headerHeight * densityFactor) * ((maxDepth ?? 0) + multiplicationFactor);
+
+ const columnHeadersHeight = Math.floor(props.columnHeaderHeight * densityFactor);
+ const filterHeadersHeight = isHeaderFilteringEnabled
+ ? Math.floor((props.headerFilterHeight ?? props.columnHeaderHeight) * densityFactor)
+ : 0;
+
+ return columnHeadersHeight * (1 + (maxDepth ?? 0)) + filterHeadersHeight;
}
diff --git a/packages/x-data-grid/src/hooks/features/dimensions/gridDimensionsApi.ts b/packages/x-data-grid/src/hooks/features/dimensions/gridDimensionsApi.ts
index 277b71145688..c7b5bdd3815c 100644
--- a/packages/x-data-grid/src/hooks/features/dimensions/gridDimensionsApi.ts
+++ b/packages/x-data-grid/src/hooks/features/dimensions/gridDimensionsApi.ts
@@ -59,9 +59,13 @@ export interface GridDimensions {
*/
rightPinnedWidth: number;
/**
- * Height of one headers.
+ * Height of one column header.
*/
headerHeight: number;
+ /**
+ * Height of header filters.
+ */
+ headerFilterHeight: number;
/**
* Height of all the column headers.
*/
diff --git a/packages/x-data-grid/src/hooks/features/dimensions/useGridDimensions.ts b/packages/x-data-grid/src/hooks/features/dimensions/useGridDimensions.ts
index 86c21a6195dc..1c3a96e97712 100644
--- a/packages/x-data-grid/src/hooks/features/dimensions/useGridDimensions.ts
+++ b/packages/x-data-grid/src/hooks/features/dimensions/useGridDimensions.ts
@@ -42,6 +42,7 @@ type RootProps = Pick<
| 'rowHeight'
| 'resizeThrottleMs'
| 'columnHeaderHeight'
+ | 'headerFilterHeight'
>;
export type GridDimensionsState = GridDimensions;
@@ -58,6 +59,7 @@ const EMPTY_DIMENSIONS: GridDimensions = {
hasScrollY: false,
scrollbarSize: 0,
headerHeight: 0,
+ headerFilterHeight: 0,
rowWidth: 0,
rowHeight: 0,
columnsTotalWidth: 0,
@@ -89,8 +91,11 @@ export function useGridDimensions(
const densityFactor = useGridSelector(apiRef, gridDensityFactorSelector);
const rowHeight = Math.floor(props.rowHeight * densityFactor);
const headerHeight = Math.floor(props.columnHeaderHeight * densityFactor);
+ const headerFilterHeight = Math.floor(
+ (props.headerFilterHeight ?? props.columnHeaderHeight) * densityFactor,
+ );
const columnsTotalWidth = roundToDecimalPlaces(gridColumnsTotalWidthSelector(apiRef), 6);
- const headersTotalHeight = getTotalHeaderHeight(apiRef, props.columnHeaderHeight);
+ const headersTotalHeight = getTotalHeaderHeight(apiRef, props);
const leftPinnedWidth = pinnedColumns.left.reduce((w, col) => w + col.computedWidth, 0);
const rightPinnedWidth = pinnedColumns.right.reduce((w, col) => w + col.computedWidth, 0);
@@ -244,6 +249,7 @@ export function useGridDimensions(
hasScrollY,
scrollbarSize,
headerHeight,
+ headerFilterHeight,
rowWidth,
rowHeight,
columnsTotalWidth,
@@ -273,6 +279,7 @@ export function useGridDimensions(
rowsMeta.currentPageTotalHeight,
rowHeight,
headerHeight,
+ headerFilterHeight,
columnsTotalWidth,
headersTotalHeight,
leftPinnedWidth,
diff --git a/packages/x-data-grid/src/hooks/features/export/useGridPrintExport.tsx b/packages/x-data-grid/src/hooks/features/export/useGridPrintExport.tsx
index 68957d6884cb..909ecae28e8c 100644
--- a/packages/x-data-grid/src/hooks/features/export/useGridPrintExport.tsx
+++ b/packages/x-data-grid/src/hooks/features/export/useGridPrintExport.tsx
@@ -64,7 +64,7 @@ function buildPrintWindow(title?: string): HTMLIFrameElement {
*/
export const useGridPrintExport = (
apiRef: React.MutableRefObject,
- props: Pick,
+ props: Pick,
): void => {
const logger = useGridLogger(apiRef, 'useGridPrintExport');
const doc = React.useRef(null);
@@ -160,7 +160,7 @@ export const useGridPrintExport = (
// Expand container height to accommodate all rows
const computedTotalHeight =
rowsMeta.currentPageTotalHeight +
- getTotalHeaderHeight(apiRef, props.columnHeaderHeight) +
+ getTotalHeaderHeight(apiRef, props) +
gridToolbarElementHeight +
gridFooterElementHeight;
gridClone.style.height = `${computedTotalHeight}px`;
@@ -256,7 +256,7 @@ export const useGridPrintExport = (
});
}
},
- [apiRef, doc, props.columnHeaderHeight],
+ [apiRef, doc, props],
);
const handlePrintWindowAfterPrint = React.useCallback(
diff --git a/packages/x-data-grid/src/hooks/features/headerFiltering/useGridHeaderFiltering.ts b/packages/x-data-grid/src/hooks/features/headerFiltering/useGridHeaderFiltering.ts
index fccdbb154952..dae3a8542487 100644
--- a/packages/x-data-grid/src/hooks/features/headerFiltering/useGridHeaderFiltering.ts
+++ b/packages/x-data-grid/src/hooks/features/headerFiltering/useGridHeaderFiltering.ts
@@ -1,6 +1,6 @@
import * as React from 'react';
import { GridPrivateApiCommunity } from '../../../models/api/gridApiCommunity';
-import { DataGridProcessedPropsWithShared } from '../../../models/props/DataGridProps';
+import { DataGridProcessedProps } from '../../../models/props/DataGridProps';
import { GridHeaderFilteringState } from '../../../models/gridHeaderFilteringModel';
import { useGridApiMethod } from '../../utils/useGridApiMethod';
import { GridStateInitializer } from '../../utils/useGridInitializeState';
@@ -17,7 +17,7 @@ import {
export const headerFilteringStateInitializer: GridStateInitializer = (
state,
- props: DataGridProcessedPropsWithShared,
+ props: DataGridProcessedProps,
) => ({
...state,
headerFiltering: { enabled: props.headerFilters ?? false, editing: null, menuOpen: null },
@@ -25,7 +25,7 @@ export const headerFilteringStateInitializer: GridStateInitializer = (
export const useGridHeaderFiltering = (
apiRef: React.MutableRefObject,
- props: Pick,
+ props: Pick,
) => {
const logger = useGridLogger(apiRef, 'useGridHeaderFiltering');
const setHeaderFilterState = React.useCallback(
diff --git a/packages/x-data-grid/src/hooks/features/keyboardNavigation/useGridKeyboardNavigation.ts b/packages/x-data-grid/src/hooks/features/keyboardNavigation/useGridKeyboardNavigation.ts
index 1a2d4d606823..1854e8a134b0 100644
--- a/packages/x-data-grid/src/hooks/features/keyboardNavigation/useGridKeyboardNavigation.ts
+++ b/packages/x-data-grid/src/hooks/features/keyboardNavigation/useGridKeyboardNavigation.ts
@@ -6,7 +6,7 @@ import { GridCellParams } from '../../../models/params/gridCellParams';
import { gridVisibleColumnDefinitionsSelector } from '../columns/gridColumnsSelector';
import { useGridLogger } from '../../utils/useGridLogger';
import { useGridApiEventHandler } from '../../utils/useGridApiEventHandler';
-import { DataGridProcessedPropsWithShared } from '../../../models/props/DataGridProps';
+import { DataGridProcessedProps } from '../../../models/props/DataGridProps';
import { gridExpandedSortedRowEntriesSelector } from '../filter/gridFilterSelector';
import { useGridVisibleRows } from '../../utils/useGridVisibleRows';
import { GRID_CHECKBOX_SELECTION_COL_DEF } from '../../../colDef/gridCheckboxSelectionColDef';
@@ -92,7 +92,7 @@ const getRightColumnIndex = ({
export const useGridKeyboardNavigation = (
apiRef: React.MutableRefObject,
props: Pick<
- DataGridProcessedPropsWithShared,
+ DataGridProcessedProps,
| 'pagination'
| 'paginationMode'
| 'getRowId'
diff --git a/packages/x-data-grid/src/internals/index.ts b/packages/x-data-grid/src/internals/index.ts
index bee9fac100d2..88b4d71bf80f 100644
--- a/packages/x-data-grid/src/internals/index.ts
+++ b/packages/x-data-grid/src/internals/index.ts
@@ -129,15 +129,7 @@ export { useGridVisibleRows, getVisibleRows } from '../hooks/utils/useGridVisibl
export { useGridInitializeState } from '../hooks/utils/useGridInitializeState';
export type { GridStateInitializer } from '../hooks/utils/useGridInitializeState';
-export type {
- DataGridProSharedPropsWithDefaultValue,
- DataGridPremiumSharedPropsWithDefaultValue,
- GridExperimentalFeatures,
- DataGridPropsWithoutDefaultValue,
- DataGridPropsWithDefaultValues,
- DataGridPropsWithComplexDefaultValueAfterProcessing,
- DataGridPropsWithComplexDefaultValueBeforeProcessing,
-} from '../models/props/DataGridProps';
+export type * from '../models/props/DataGridProps';
export { getColumnsToExport, defaultGetRowsToExport } from '../hooks/features/export/utils';
export * from '../utils/createControllablePromise';
diff --git a/packages/x-data-grid/src/models/props/DataGridProps.ts b/packages/x-data-grid/src/models/props/DataGridProps.ts
index 47619a4c8db1..84f1c3f9456a 100644
--- a/packages/x-data-grid/src/models/props/DataGridProps.ts
+++ b/packages/x-data-grid/src/models/props/DataGridProps.ts
@@ -53,14 +53,6 @@ export type DataGridProps = Omit<
pagination?: true;
};
-/**
- * The props of the `DataGrid` component after the pre-processing phase.
- */
-export interface DataGridProcessedProps
- extends DataGridPropsWithDefaultValues,
- DataGridPropsWithComplexDefaultValueAfterProcessing,
- DataGridPropsWithoutDefaultValue {}
-
/**
* The props of the `DataGrid` component after the pre-processing phase that the user should not be able to override.
* Those are usually used in feature-hook for which the pro-plan has more advanced features (eg: multi-sorting, multi-filtering, ...).
@@ -799,6 +791,13 @@ export interface DataGridProSharedPropsWithDefaultValue {
headerFilters: boolean;
}
+export interface DataGridProSharedPropsWithoutDefaultValue {
+ /**
+ * Override the height of the header filters.
+ */
+ headerFilterHeight?: number;
+}
+
export interface DataGridPremiumSharedPropsWithDefaultValue {
/**
* If `true`, the cell selection mode is enabled.
@@ -808,9 +807,12 @@ export interface DataGridPremiumSharedPropsWithDefaultValue {
}
/**
- * Contains the commercial packages' props shared in the MIT version.
+ * The props of the `DataGrid` component after the pre-processing phase.
*/
-export interface DataGridProcessedPropsWithShared
- extends DataGridProcessedProps,
+export interface DataGridProcessedProps
+ extends DataGridPropsWithDefaultValues,
+ DataGridPropsWithComplexDefaultValueAfterProcessing,
+ DataGridPropsWithoutDefaultValue,
+ DataGridProSharedPropsWithoutDefaultValue,
Partial,
Partial {}