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

package/internals/constants.d.ts

@@ -1,3 +1,9 @@
 export declare const GRID_TREE_DATA_GROUPING_FIELD = "__tree_data_group__";
 export declare const GRID_ROW_GROUPING_SINGLE_GROUPING_FIELD = "__row_group_by_columns_group__";
 export declare const GRID_DETAIL_PANEL_TOGGLE_FIELD = "__detail_panel_toggle__";
+export declare enum PinnedColumnPosition {
+    NONE = 0,
+    LEFT = 1,
+    RIGHT = 2,
+    VIRTUAL = 3
+}

package/internals/constants.js

@@ -1,3 +1,10 @@
 export const GRID_TREE_DATA_GROUPING_FIELD = '__tree_data_group__';
 export const GRID_ROW_GROUPING_SINGLE_GROUPING_FIELD = '__row_group_by_columns_group__';
-export const GRID_DETAIL_PANEL_TOGGLE_FIELD = '__detail_panel_toggle__';
+export const GRID_DETAIL_PANEL_TOGGLE_FIELD = '__detail_panel_toggle__';
+export let PinnedColumnPosition = /*#__PURE__*/function (PinnedColumnPosition) {
+  PinnedColumnPosition[PinnedColumnPosition["NONE"] = 0] = "NONE";
+  PinnedColumnPosition[PinnedColumnPosition["LEFT"] = 1] = "LEFT";
+  PinnedColumnPosition[PinnedColumnPosition["RIGHT"] = 2] = "RIGHT";
+  PinnedColumnPosition[PinnedColumnPosition["VIRTUAL"] = 3] = "VIRTUAL";
+  return PinnedColumnPosition;
+}({});

package/internals/index.d.ts

@@ -12,7 +12,7 @@ export { getValueOptions } from '../components/panel/filterPanel/filterPanelUtil
 export { useGridRegisterPipeProcessor } from '../hooks/core/pipeProcessing';
 export type { GridPipeProcessor } from '../hooks/core/pipeProcessing';
 export { GridStrategyGroup, useGridRegisterStrategyProcessor, GRID_DEFAULT_STRATEGY, } from '../hooks/core/strategyProcessing';
-export type { GridStrategyProcessor } from '../hooks/core/strategyProcessing';
+export type { GridStrategyProcessor, GridStrategyProcessorName, } from '../hooks/core/strategyProcessing';
 export { useGridInitialization } from '../hooks/core/useGridInitialization';
 export { unwrapPrivateAPI } from '../hooks/core/useGridApiInitialization';
 export { useGridClipboard } from '../hooks/features/clipboard/useGridClipboard';
@@ -77,6 +77,7 @@ export type * from '../models/props/DataGridProps';
 export type * from '../models/gridDataSource';
 export { getColumnsToExport, defaultGetRowsToExport } from '../hooks/features/export/utils';
 export * from '../utils/createControllablePromise';
+export * from '../utils/rtlFlipSide';
 export { createSelector, createSelectorMemoized } from '../utils/createSelector';
 export { gridRowGroupsToFetchSelector } from '../hooks/features/rows/gridRowsSelector';
 export { findParentElementFromClassName, getActiveElement, isEventTargetInPortal, } from '../utils/domUtils';

package/internals/index.js

@@ -62,6 +62,7 @@ export { useGridVisibleRows, getVisibleRows } from "../hooks/utils/useGridVisibl
 export { useGridInitializeState } from "../hooks/utils/useGridInitializeState.js";
 export { getColumnsToExport, defaultGetRowsToExport } from "../hooks/features/export/utils.js";
 export * from "../utils/createControllablePromise.js";
+export * from "../utils/rtlFlipSide.js";
 export { createSelector, createSelectorMemoized } from "../utils/createSelector.js";
 export { gridRowGroupsToFetchSelector } from "../hooks/features/rows/gridRowsSelector.js";
 export { findParentElementFromClassName, getActiveElement, isEventTargetInPortal } from "../utils/domUtils.js";

package/internals/utils/attachPinnedStyle.d.ts

@@ -0,0 +1,2 @@
+import { PinnedColumnPosition } from '../constants';
+export declare function attachPinnedStyle(style: React.CSSProperties, isRtl: boolean, pinnedPosition: PinnedColumnPosition | undefined, pinnedOffset?: number): import("react").CSSProperties;

package/internals/utils/attachPinnedStyle.js

@@ -0,0 +1,9 @@
+import { rtlFlipSide } from "../../utils/rtlFlipSide.js";
+export function attachPinnedStyle(style, isRtl, pinnedPosition, pinnedOffset) {
+  const side = rtlFlipSide(pinnedPosition, isRtl);
+  if (!side || pinnedOffset === undefined) {
+    return style;
+  }
+  style[side] = pinnedOffset;
+  return style;
+}

package/internals/utils/getPinnedCellOffset.d.ts

@@ -1,3 +1,3 @@
-import { GridPinnedColumnPosition, gridColumnPositionsSelector } from '../../hooks/features/columns';
-import type { GridDimensions } from '../../hooks/features/dimensions';
-export declare const getPinnedCellOffset: (pinnedPosition: GridPinnedColumnPosition | undefined, computedWidth: number, columnIndex: number, columnPositions: ReturnType<typeof gridColumnPositionsSelector>, dimensions: GridDimensions) => number;
+import { PinnedColumnPosition } from '../constants';
+import { gridColumnPositionsSelector } from '../../hooks/features/columns';
+export declare const getPinnedCellOffset: (pinnedPosition: PinnedColumnPosition | undefined, computedWidth: number, columnIndex: number, columnPositions: ReturnType<typeof gridColumnPositionsSelector>, columnsTotalWidth: number, scrollbarWidth: number) => number | undefined;

package/internals/utils/getPinnedCellOffset.js

@@ -1,16 +1,15 @@
-import { GridPinnedColumnPosition } from "../../hooks/features/columns/index.js";
-export const getPinnedCellOffset = (pinnedPosition, computedWidth, columnIndex, columnPositions, dimensions) => {
-  const scrollbarWidth = dimensions.hasScrollY ? dimensions.scrollbarSize : 0;
+import { PinnedColumnPosition } from "../constants.js";
+export const getPinnedCellOffset = (pinnedPosition, computedWidth, columnIndex, columnPositions, columnsTotalWidth, scrollbarWidth) => {
   let pinnedOffset;
   switch (pinnedPosition) {
-    case GridPinnedColumnPosition.LEFT:
+    case PinnedColumnPosition.LEFT:
       pinnedOffset = columnPositions[columnIndex];
       break;
-    case GridPinnedColumnPosition.RIGHT:
-      pinnedOffset = dimensions.columnsTotalWidth - columnPositions[columnIndex] - computedWidth + scrollbarWidth;
+    case PinnedColumnPosition.RIGHT:
+      pinnedOffset = columnsTotalWidth - columnPositions[columnIndex] - computedWidth + scrollbarWidth;
       break;
     default:
-      pinnedOffset = 0;
+      pinnedOffset = undefined;
       break;
   }
   return pinnedOffset;

package/internals/utils/index.d.ts

@@ -1,3 +1,4 @@
 export * from './computeSlots';
 export * from './propValidation';
 export * from './gridRowGroupingUtils';
+export * from './attachPinnedStyle';

package/internals/utils/index.js

@@ -1,3 +1,4 @@
 export * from "./computeSlots.js";
 export * from "./propValidation.js";
-export * from "./gridRowGroupingUtils.js";
+export * from "./gridRowGroupingUtils.js";
+export * from "./attachPinnedStyle.js";

package/locales/arSD.js

@@ -102,6 +102,8 @@ const arSDGrid = {
   'headerFilterOperator>=': 'أكبر من او يساوي',
   'headerFilterOperator<': 'اصغر من',
   'headerFilterOperator<=': 'اصغر من او يساوي',
+  // headerFilterClear: 'Clear filter',
+
   // Filter values text
   filterValueAny: 'أي',
   filterValueTrue: 'صائب',

package/locales/beBY.js

@@ -117,6 +117,7 @@ const beBYGrid = {
   // 'headerFilterOperator>=': 'Greater than or equal to',
   // 'headerFilterOperator<': 'Less than',
   // 'headerFilterOperator<=': 'Less than or equal to',
+  // headerFilterClear: 'Clear filter',
 
   // Filter values text
   filterValueAny: 'усякі',

package/locales/bgBG.js

@@ -102,6 +102,8 @@ const bgBGGrid = {
   'headerFilterOperator>=': 'По-голямо или равно на',
   'headerFilterOperator<': 'По-малко от',
   'headerFilterOperator<=': 'По-малко или равно на',
+  // headerFilterClear: 'Clear filter',
+
   // Filter values text
   filterValueAny: 'всякакви',
   filterValueTrue: 'вярно',

package/locales/csCZ.js

@@ -110,6 +110,8 @@ const csCZGrid = {
   'headerFilterOperator>=': 'Větší než nebo rovno',
   'headerFilterOperator<': 'Menší než',
   'headerFilterOperator<=': 'Menší než nebo rovno',
+  // headerFilterClear: 'Clear filter',
+
   // Filter values text
   filterValueAny: 'jakýkoliv',
   filterValueTrue: 'ano',

package/locales/daDK.js

@@ -102,6 +102,8 @@ const daDKGrid = {
   'headerFilterOperator>=': 'Større end eller lig med',
   'headerFilterOperator<': 'Mindre end',
   'headerFilterOperator<=': 'Mindre end eller lig med',
+  // headerFilterClear: 'Clear filter',
+
   // Filter values text
   filterValueAny: 'hvilken som helst',
   filterValueTrue: 'positiv',

package/locales/deDE.js

@@ -100,6 +100,8 @@ const deDEGrid = {
   'headerFilterOperator>=': 'Größer als oder gleich',
   'headerFilterOperator<': 'Kleiner als',
   'headerFilterOperator<=': 'Kleiner als oder gleich',
+  // headerFilterClear: 'Clear filter',
+
   // Filter values text
   filterValueAny: 'Beliebig',
   filterValueTrue: 'Ja',

package/locales/elGR.js

@@ -102,6 +102,8 @@ const elGRGrid = {
   'headerFilterOperator>=': 'Μεγαλύτερο ή ίσο με',
   'headerFilterOperator<': 'Μικρότερο από',
   'headerFilterOperator<=': 'Μικρότερο ή ίσο με',
+  // headerFilterClear: 'Clear filter',
+
   // Filter values text
   filterValueAny: 'οποιοδήποτε',
   filterValueTrue: 'αληθές',

package/locales/esES.js

@@ -100,6 +100,8 @@ const esESGrid = {
   'headerFilterOperator>=': 'Es mayor o igual que',
   'headerFilterOperator<': 'Es menor que',
   'headerFilterOperator<=': 'Es menor o igual que',
+  // headerFilterClear: 'Clear filter',
+
   // Filter values text
   filterValueAny: 'cualquiera',
   filterValueTrue: 'verdadero',

package/locales/faIR.js

@@ -102,6 +102,8 @@ const faIRGrid = {
   'headerFilterOperator>=': 'بزرگتر یا مساوی',
   'headerFilterOperator<': 'کوچکتر',
   'headerFilterOperator<=': 'کوچکتر یا مساوی',
+  // headerFilterClear: 'Clear filter',
+
   // Filter values text
   filterValueAny: 'هرچیزی',
   filterValueTrue: 'صحیح',

package/locales/fiFI.js

@@ -102,6 +102,8 @@ const fiFIGrid = {
   'headerFilterOperator>=': 'Enemmän tai yhtä paljon kuin',
   'headerFilterOperator<': 'Vähemmän kuin',
   'headerFilterOperator<=': 'Vähemmän tai yhtä paljon kuin',
+  // headerFilterClear: 'Clear filter',
+
   // Filter values text
   filterValueAny: 'mikä tahansa',
   filterValueTrue: 'tosi',

package/locales/frFR.js

@@ -102,6 +102,8 @@ const frFRGrid = {
   'headerFilterOperator>=': 'Est supérieur ou égal à',
   'headerFilterOperator<': 'Est inférieur à',
   'headerFilterOperator<=': 'Est inférieur ou égal à',
+  // headerFilterClear: 'Clear filter',
+
   // Filter values text
   filterValueAny: 'tous',
   filterValueTrue: 'vrai',

package/locales/heIL.js

@@ -100,6 +100,8 @@ const heILGrid = {
   'headerFilterOperator>=': 'גדול שווה ל-',
   'headerFilterOperator<': 'קטן מ-',
   'headerFilterOperator<=': 'קטן שווה ל-',
+  // headerFilterClear: 'Clear filter',
+
   // Filter values text
   filterValueAny: 'כל ערך',
   filterValueTrue: 'כן',

package/locales/hrHR.js

@@ -110,6 +110,8 @@ const hrHRGrid = {
   'headerFilterOperator>=': 'Veće ili jednako',
   'headerFilterOperator<': 'Manje od',
   'headerFilterOperator<=': 'Manje od ili jednako',
+  // headerFilterClear: 'Clear filter',
+
   // Filter values text
   filterValueAny: 'bilo koji',
   filterValueTrue: 'tačno',

package/locales/huHU.js

@@ -102,6 +102,8 @@ const huHUGrid = {
   'headerFilterOperator>=': 'Nagyobb vagy egyenlő',
   'headerFilterOperator<': 'Kisebb mint',
   'headerFilterOperator<=': 'Kisebb vagy egyenlő',
+  // headerFilterClear: 'Clear filter',
+
   // Filter values text
   filterValueAny: 'bármilyen',
   filterValueTrue: 'igaz',

package/locales/isIS.js

@@ -102,6 +102,8 @@ const isISGrid = {
   'headerFilterOperator>=': 'Stærra en eða jafnt og',
   'headerFilterOperator<': 'Minna en',
   'headerFilterOperator<=': 'Minna en eða jafnt og',
+  // headerFilterClear: 'Clear filter',
+
   // Filter values text
   filterValueAny: 'hvað sem er',
   filterValueTrue: 'satt',

package/locales/itIT.js

@@ -102,6 +102,8 @@ const itITGrid = {
   'headerFilterOperator>=': 'Maggiore o uguale a',
   'headerFilterOperator<': 'Minore di',
   'headerFilterOperator<=': 'Minore o uguale a',
+  // headerFilterClear: 'Clear filter',
+
   // Filter values text
   filterValueAny: 'qualunque',
   filterValueTrue: 'vero',

package/locales/jaJP.js

@@ -102,6 +102,8 @@ const jaJPGrid = {
   'headerFilterOperator>=': '以上',
   'headerFilterOperator<': '未満',
   'headerFilterOperator<=': '以下',
+  // headerFilterClear: 'Clear filter',
+
   // Filter values text
   filterValueAny: 'いずれか',
   filterValueTrue: '真',

package/locales/koKR.js

@@ -100,6 +100,8 @@ const koKRGrid = {
   'headerFilterOperator>=': '같거나 더 큰',
   'headerFilterOperator<': '더 작은',
   'headerFilterOperator<=': '같거나 더 작은',
+  // headerFilterClear: 'Clear filter',
+
   // Filter values text
   filterValueAny: '아무값',
   filterValueTrue: '참',

package/locales/nbNO.js

@@ -102,6 +102,8 @@ const nbNOGrid = {
   'headerFilterOperator>=': 'Større enn eller lik',
   'headerFilterOperator<': 'Mindre enn',
   'headerFilterOperator<=': 'Mindre enn eller lik',
+  // headerFilterClear: 'Clear filter',
+
   // Filter values text
   filterValueAny: 'noen',
   filterValueTrue: 'sant',

package/locales/nlNL.js

@@ -101,6 +101,8 @@ const nlNLGrid = {
   'headerFilterOperator>=': 'Is groter dan of gelijk aan',
   'headerFilterOperator<': 'Is kleiner dan',
   'headerFilterOperator<=': 'Is kleiner dan of gelijk aan',
+  // headerFilterClear: 'Clear filter',
+
   // Filter values text
   filterValueAny: 'alles',
   filterValueTrue: 'waar',

package/locales/nnNO.js

@@ -102,6 +102,8 @@ const nnNOGrid = {
   'headerFilterOperator>=': 'Større enn eller lik',
   'headerFilterOperator<': 'Mindre enn',
   'headerFilterOperator<=': 'Mindre enn eller lik',
+  // headerFilterClear: 'Clear filter',
+
   // Filter values text
   filterValueAny: 'nokon',
   filterValueTrue: 'sant',

package/locales/plPL.js

@@ -103,6 +103,8 @@ const plPLGrid = {
   'headerFilterOperator>=': 'Większy lub równy',
   'headerFilterOperator<': 'Mniejszy niż',
   'headerFilterOperator<=': 'Mniejszy lub równe',
+  // headerFilterClear: 'Clear filter',
+
   // Filter values text
   filterValueAny: 'dowolny',
   filterValueTrue: 'prawda',

package/locales/ptBR.js

@@ -100,6 +100,8 @@ const ptBRGrid = {
   'headerFilterOperator>=': 'Maior que ou igual a',
   'headerFilterOperator<': 'Menor que',
   'headerFilterOperator<=': 'Menor que ou igual a',
+  // headerFilterClear: 'Clear filter',
+
   // Filter values text
   filterValueAny: 'qualquer',
   filterValueTrue: 'verdadeiro',

package/locales/ptPT.js

@@ -100,6 +100,8 @@ const ptPTGrid = {
   'headerFilterOperator>=': 'Melhor que ou igual a',
   'headerFilterOperator<': 'Menor que',
   'headerFilterOperator<=': 'Menos que ou igual a',
+  // headerFilterClear: 'Clear filter',
+
   // Filter values text
   filterValueAny: 'qualquer',
   filterValueTrue: 'verdadeiro',

package/locales/roRO.js

@@ -100,6 +100,8 @@ const roROGrid = {
   'headerFilterOperator>=': 'Mai mare sau egal cu',
   'headerFilterOperator<': 'Mai mic decât',
   'headerFilterOperator<=': 'Mai mic sau egal cu',
+  // headerFilterClear: 'Clear filter',
+
   // Filter values text
   filterValueAny: 'Aleatoriu',
   filterValueTrue: 'Da',

package/locales/ruRU.js

@@ -117,6 +117,8 @@ const ruRUGrid = {
   'headerFilterOperator>=': 'больше или равно',
   'headerFilterOperator<': 'меньше чем',
   'headerFilterOperator<=': 'меньше или равно',
+  // headerFilterClear: 'Clear filter',
+
   // Filter values text
   filterValueAny: 'любой',
   filterValueTrue: 'истина',

package/locales/skSK.js

@@ -110,6 +110,8 @@ const skSKGrid = {
   'headerFilterOperator>=': 'Väčší ako alebo rovný',
   'headerFilterOperator<': 'Menší ako',
   'headerFilterOperator<=': 'Menší ako alebo rovný',
+  // headerFilterClear: 'Clear filter',
+
   // Filter values text
   filterValueAny: 'akýkoľvek',
   filterValueTrue: 'áno',

package/locales/svSE.js

@@ -102,6 +102,8 @@ const svSEGrid = {
   'headerFilterOperator>=': 'Större eller lika med',
   'headerFilterOperator<': 'Mindre än',
   'headerFilterOperator<=': 'Mindre eller lika med',
+  // headerFilterClear: 'Clear filter',
+
   // Filter values text
   filterValueAny: 'något',
   filterValueTrue: 'sant',

package/locales/trTR.js

@@ -100,6 +100,8 @@ const trTRGrid = {
   'headerFilterOperator>=': 'Büyük veya eşit',
   'headerFilterOperator<': 'Küçüktür',
   'headerFilterOperator<=': 'Küçük veya eşit',
+  // headerFilterClear: 'Clear filter',
+
   // Filter values text
   filterValueAny: 'herhangi',
   filterValueTrue: 'doğru',

package/locales/ukUA.js

@@ -117,6 +117,8 @@ const ukUAGrid = {
   'headerFilterOperator>=': 'Більше або дорівнює',
   'headerFilterOperator<': 'Менше ніж',
   'headerFilterOperator<=': 'Менше або дорівнює',
+  // headerFilterClear: 'Clear filter',
+
   // Filter values text
   filterValueAny: 'будь-який',
   filterValueTrue: 'так',

package/locales/urPK.js

@@ -102,6 +102,8 @@ const urPKGrid = {
   'headerFilterOperator>=': 'ذیادہ یا برابر ہے',
   'headerFilterOperator<': 'کم ہے',
   'headerFilterOperator<=': 'کم یا برابر ہے',
+  // headerFilterClear: 'Clear filter',
+
   // Filter values text
   filterValueAny: 'کوئی بھی',
   filterValueTrue: 'صحیح',

package/locales/viVN.js

@@ -102,6 +102,8 @@ const viVNGrid = {
   'headerFilterOperator>=': 'Lớn hơn hoặc bằng',
   'headerFilterOperator<': 'Nhỏ hơn',
   'headerFilterOperator<=': 'Nhỏ hơn hoặc bằng',
+  // headerFilterClear: 'Clear filter',
+
   // Filter values text
   filterValueAny: 'bất kỳ giá trị nào',
   filterValueTrue: 'Có',

package/locales/zhCN.js

@@ -100,6 +100,8 @@ const zhCNGrid = {
   'headerFilterOperator>=': '大于或等于',
   'headerFilterOperator<': '小于',
   'headerFilterOperator<=': '小于或等于',
+  // headerFilterClear: 'Clear filter',
+
   // Filter values text
   filterValueAny: '任何',
   filterValueTrue: '真',

package/locales/zhHK.js

@@ -102,6 +102,8 @@ const zhHKGrid = {
   'headerFilterOperator>=': '大於或等於',
   'headerFilterOperator<': '少於',
   'headerFilterOperator<=': '小於或等於',
+  // headerFilterClear: 'Clear filter',
+
   // Filter values text
   filterValueAny: '任何',
   filterValueTrue: '真的',

package/locales/zhTW.js

@@ -102,6 +102,8 @@ const zhTWGrid = {
   'headerFilterOperator>=': '大於或等於',
   'headerFilterOperator<': '小於',
   'headerFilterOperator<=': '小於或等於',
+  // headerFilterClear: 'Clear filter',
+
   // Filter values text
   filterValueAny: '任何值',
   filterValueTrue: '真',

package/material/index.js

@@ -61,7 +61,8 @@ const iconSlots = {
   loadIcon: GridLoadIcon,
   filterPanelAddIcon: GridAddIcon,
   filterPanelRemoveAllIcon: GridDeleteForeverIcon,
-  columnReorderIcon: GridDragIcon
+  columnReorderIcon: GridDragIcon,
+  menuItemCheckIcon: GridCheckIcon
 };
 const baseSlots = {
   baseBadge: MUIBadge,

package/models/api/gridCoreApi.d.ts

@@ -13,7 +13,7 @@ export interface GridCoreApi {
      * The React ref of the grid root container div element.
      * @ignore - do not document.
      */
-    rootElementRef: React.RefObject<HTMLDivElement>;
+    rootElementRef: React.RefObject<HTMLDivElement | null>;
     /**
      * Registers a handler for an event.
      * @param {string} event The name of the event.
@@ -59,27 +59,27 @@ export interface GridCorePrivateApi<GridPublicApi extends GridApiCommon, GridPri
     /**
      * The React ref of the grid main container div element.
      */
-    mainElementRef: React.MutableRefObject<HTMLDivElement | null>;
+    mainElementRef: React.RefObject<HTMLDivElement | null>;
     /**
      * The React ref of the grid's virtual scroller container element.
      */
-    virtualScrollerRef: React.RefObject<HTMLDivElement>;
+    virtualScrollerRef: React.RefObject<HTMLDivElement | null>;
     /**
      * The React ref of the grid's vertical virtual scrollbar container element.
      */
-    virtualScrollbarVerticalRef: React.RefObject<HTMLDivElement>;
+    virtualScrollbarVerticalRef: React.RefObject<HTMLDivElement | null>;
     /**
      * The React ref of the grid's horizontal virtual scrollbar container element.
      */
-    virtualScrollbarHorizontalRef: React.RefObject<HTMLDivElement>;
+    virtualScrollbarHorizontalRef: React.RefObject<HTMLDivElement | null>;
     /**
      * The React ref of the grid column container virtualized div element.
      */
-    columnHeadersContainerRef: React.RefObject<HTMLDivElement>;
+    columnHeadersContainerRef: React.RefObject<HTMLDivElement | null>;
     /**
      * The React ref of the grid header filter row element.
      */
-    headerFiltersElementRef?: React.RefObject<HTMLDivElement>;
+    headerFiltersElementRef?: React.RefObject<HTMLDivElement | null>;
     register: <V extends 'public' | 'private', T extends V extends 'public' ? Partial<GridPublicApi> : Partial<Omit<GridPrivateApi, keyof GridPublicApi>>>(visibility: V, methods: T) => void;
     /**
      * Returns the public API.

package/models/api/gridDensityApi.d.ts

@@ -1,7 +1,7 @@
 import * as React from 'react';
 import { GridDensity } from '../gridDensity';
 export interface GridDensityOption {
-    icon: React.ReactElement;
+    icon: React.ReactElement<any>;
     label: string;
     value: GridDensity;
 }

package/models/api/gridLocaleTextApi.d.ts

@@ -97,6 +97,7 @@ export interface GridLocaleText {
     'headerFilterOperator>=': string;
     'headerFilterOperator<': string;
     'headerFilterOperator<=': string;
+    headerFilterClear: string;
     filterValueAny: string;
     filterValueTrue: string;
     filterValueFalse: string;

package/models/colDef/gridColDef.d.ts

@@ -24,13 +24,13 @@ export type ValueOptions = string | number | {
  * Value that can be used as a key for grouping rows
  */
 export type GridKeyValue = string | number | boolean;
-export type GridApplyQuickFilter<R extends GridValidRowModel = GridValidRowModel, V = any> = (value: V, row: R, column: GridColDef, apiRef: React.MutableRefObject<GridApiCommunity>) => boolean;
-export type GetApplyQuickFilterFn<R extends GridValidRowModel = GridValidRowModel, V = any> = (value: any, colDef: GridStateColDef<R, V>, apiRef: React.MutableRefObject<GridApiCommunity>) => null | GridApplyQuickFilter<R, V>;
-export type GridValueGetter<R extends GridValidRowModel = GridValidRowModel, V = any, F = V, TValue = never> = (value: TValue, row: R, column: GridColDef<R, V, F>, apiRef: React.MutableRefObject<GridApiCommunity>) => V;
-export type GridValueFormatter<R extends GridValidRowModel = GridValidRowModel, V = any, F = V, TValue = never> = (value: TValue, row: R, column: GridColDef<R, V, F>, apiRef: React.MutableRefObject<GridApiCommunity>) => F;
-export type GridValueSetter<R extends GridValidRowModel = GridValidRowModel, V = any, F = V> = (value: V, row: R, column: GridColDef<R, V, F>, apiRef: React.MutableRefObject<GridApiCommunity>) => R;
-export type GridValueParser<R extends GridValidRowModel = GridValidRowModel, V = any, F = V> = (value: F | undefined, row: R | undefined, column: GridColDef<R, V, F>, apiRef: React.MutableRefObject<GridApiCommunity>) => V;
-export type GridColSpanFn<R extends GridValidRowModel = GridValidRowModel, V = any, F = V> = (value: V, row: R, column: GridColDef<R, V, F>, apiRef: React.MutableRefObject<GridApiCommunity>) => number | undefined;
+export type GridApplyQuickFilter<R extends GridValidRowModel = GridValidRowModel, V = any> = (value: V, row: R, column: GridColDef, apiRef: React.RefObject<GridApiCommunity>) => boolean;
+export type GetApplyQuickFilterFn<R extends GridValidRowModel = GridValidRowModel, V = any> = (value: any, colDef: GridStateColDef<R, V>, apiRef: React.RefObject<GridApiCommunity>) => null | GridApplyQuickFilter<R, V>;
+export type GridValueGetter<R extends GridValidRowModel = GridValidRowModel, V = any, F = V, TValue = never> = (value: TValue, row: R, column: GridColDef<R, V, F>, apiRef: React.RefObject<GridApiCommunity>) => V;
+export type GridValueFormatter<R extends GridValidRowModel = GridValidRowModel, V = any, F = V, TValue = never> = (value: TValue, row: R, column: GridColDef<R, V, F>, apiRef: React.RefObject<GridApiCommunity>) => F;
+export type GridValueSetter<R extends GridValidRowModel = GridValidRowModel, V = any, F = V> = (value: V, row: R, column: GridColDef<R, V, F>, apiRef: React.RefObject<GridApiCommunity>) => R;
+export type GridValueParser<R extends GridValidRowModel = GridValidRowModel, V = any, F = V> = (value: F | undefined, row: R | undefined, column: GridColDef<R, V, F>, apiRef: React.RefObject<GridApiCommunity>) => V;
+export type GridColSpanFn<R extends GridValidRowModel = GridValidRowModel, V = any, F = V> = (value: V, row: R, column: GridColDef<R, V, F>, apiRef: React.RefObject<GridApiCommunity>) => number | undefined;
 /**
  * Column Definition base interface.
  */
@@ -217,7 +217,7 @@ export interface GridBaseColDef<R extends GridValidRowModel = GridValidRowModel,
      * This function can return `null` to skip filtering for this value and column.
      * @param {any} value The value with which we want to filter the column.
      * @param {GridStateColDef} colDef The column from which we want to filter the rows.
-     * @param {React.MutableRefObject<GridApiCommunity>} apiRef Deprecated: The API of the grid.
+     * @param {React.RefObject<GridApiCommunity>} apiRef Deprecated: The API of the grid.
      * @returns {null | GridApplyQuickFilter} The function to call to check if a row pass this filter value or not.
      */
     getApplyQuickFilterFn?: GetApplyQuickFilterFn<R, V>;

package/models/events/gridEventLookup.d.ts

@@ -584,7 +584,12 @@ export interface GridEventLookup extends GridRowEventLookup, GridColumnHeaderEve
      * Fired when the content size used by the `GridVirtualScroller` changes.
      * @ignore - do not document.
      */
-    virtualScrollerContentSizeChange: {};
+    virtualScrollerContentSizeChange: {
+        params: {
+            columnsTotalWidth: number;
+            contentHeight: number;
+        };
+    };
     /**
      * Fired when the content is scrolled by the mouse wheel.
      * It's attached to the "mousewheel" event.