@mui/x-data-grid 5.17.4 → 5.17.5

package/CHANGELOG.md

@@ -3,7 +3,37 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
-## v5.17.4
+## 5.17.5
+
+_Sep 29, 2022_
+
+We'd like to offer a big thanks to the 2 contributors who made this release possible. Here are some highlights ✨:
+
+- 🎁 Add theme augmentation module to DataGridPremium (#6316) @cherniavskii
+- 👀 Fix blank space when changing page with dynamic row height (#6320) @m4theushw
+- 📚 Improve controlled editing demo to make easier to reuse it (#6306) @cherniavskii
+- 🐞 Bugfixes
+
+### `@mui/x-data-grid@v5.17.5` / `@mui/x-data-grid-pro@v5.17.5` / `@mui/x-data-grid-premium@v5.17.5`
+
+#### Changes
+
+- [DataGrid] Fix `GridPagination` props typing (#6295) @cherniavskii
+- [DataGrid] Fix `GridRow` not forwarding `ref` to the root element (#6303) @cherniavskii
+- [DataGrid] Fix `undefined` value being showed in filter button tooltip text (#6271) @cherniavskii
+- [DataGrid] Fix blank space when changing page with dynamic row height (#6320) @m4theushw
+- [DataGrid] Revert cell/row mode if `processRowUpdate` fails (#6319) @m4theushw
+- [DataGridPremium] Add missing `themeAugmentation` module (#6316) @cherniavskii
+
+### Docs
+
+- [docs] Pass model change callbacks in controlled grid editing demos (#6306) @cherniavskii
+
+### Core
+
+- [core] Reduce the amount of updated screenshots reported by Argos (#6310) @cherniavskii
+
+## 5.17.4
 
 _Sep 22, 2022_
 

package/components/GridPagination.d.ts

@@ -1,2 +1,44 @@
 import * as React from 'react';
-export declare const GridPagination: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & React.RefAttributes<HTMLDivElement>>;
+export declare const GridPagination: React.ForwardRefExoticComponent<(Pick<Partial<import("@mui/material/TablePagination").TablePaginationBaseProps & {
+    ActionsComponent?: React.ElementType<import("@mui/material/TablePagination/TablePaginationActions").TablePaginationActionsProps> | undefined;
+    backIconButtonProps?: Partial<import("@mui/material").IconButtonProps<"button", {}>> | undefined;
+    classes?: Partial<import("@mui/material/TablePagination").TablePaginationClasses> | undefined;
+    count: number;
+    getItemAriaLabel?: ((type: "first" | "last" | "next" | "previous") => string) | undefined;
+    labelDisplayedRows?: ((paginationInfo: import("@mui/material/TablePagination").LabelDisplayedRowsArgs) => React.ReactNode) | undefined;
+    labelRowsPerPage?: React.ReactNode;
+    nextIconButtonProps?: Partial<import("@mui/material").IconButtonProps<"button", {}>> | undefined;
+    onPageChange: (event: React.MouseEvent<HTMLButtonElement, MouseEvent> | null, page: number) => void;
+    onRowsPerPageChange?: React.ChangeEventHandler<HTMLInputElement | HTMLTextAreaElement> | undefined;
+    page: number;
+    rowsPerPage: number;
+    rowsPerPageOptions?: (number | {
+        value: number;
+        label: string;
+    })[] | undefined;
+    SelectProps?: Partial<import("@mui/material").SelectProps<unknown>> | undefined;
+    showFirstButton?: boolean | undefined;
+    showLastButton?: boolean | undefined;
+    sx?: import("@mui/material/styles").SxProps<import("@mui/material/styles").Theme> | undefined;
+} & import("@mui/material/OverridableComponent").CommonProps & Omit<import("@mui/material/TablePagination").TablePaginationBaseProps, "hidden" | "color" | "page" | "size" | "height" | "translate" | "width" | "padding" | "abbr" | "slot" | "title" | "ref" | "colSpan" | "headers" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "contentEditable" | "contextMenu" | "dir" | "draggable" | "id" | "lang" | "placeholder" | "spellCheck" | "tabIndex" | "radioGroup" | "role" | "about" | "datatype" | "inlist" | "prefix" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "rowSpan" | "scope" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChange" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClick" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "align" | "valign" | "sx" | keyof import("@mui/material/OverridableComponent").CommonProps | "variant" | "count" | "getItemAriaLabel" | "labelDisplayedRows" | "labelRowsPerPage" | "onPageChange" | "onRowsPerPageChange" | "rowsPerPage" | "rowsPerPageOptions" | "showFirstButton" | "showLastButton" | "backIconButtonProps" | "nextIconButtonProps" | "sortDirection" | "ActionsComponent" | "SelectProps">>, "hidden" | "color" | "page" | "size" | "height" | "translate" | "width" | "padding" | "abbr" | "slot" | "title" | "colSpan" | "headers" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "contentEditable" | "contextMenu" | "dir" | "draggable" | "id" | "lang" | "placeholder" | "spellCheck" | "tabIndex" | "radioGroup" | "role" | "about" | "datatype" | "inlist" | "prefix" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "rowSpan" | "scope" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChange" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClick" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "align" | "valign" | "sx" | keyof import("@mui/material/OverridableComponent").CommonProps | "variant" | "count" | "getItemAriaLabel" | "labelDisplayedRows" | "labelRowsPerPage" | "onPageChange" | "onRowsPerPageChange" | "rowsPerPage" | "rowsPerPageOptions" | "showFirstButton" | "showLastButton" | "backIconButtonProps" | "nextIconButtonProps" | "sortDirection" | "ActionsComponent" | "SelectProps"> | Pick<Partial<import("@mui/material/TablePagination").TablePaginationBaseProps & {
+    ActionsComponent?: React.ElementType<import("@mui/material/TablePagination/TablePaginationActions").TablePaginationActionsProps> | undefined;
+    backIconButtonProps?: Partial<import("@mui/material").IconButtonProps<"button", {}>> | undefined;
+    classes?: Partial<import("@mui/material/TablePagination").TablePaginationClasses> | undefined;
+    count: number;
+    getItemAriaLabel?: ((type: "first" | "last" | "next" | "previous") => string) | undefined;
+    labelDisplayedRows?: ((paginationInfo: import("@mui/material/TablePagination").LabelDisplayedRowsArgs) => React.ReactNode) | undefined;
+    labelRowsPerPage?: React.ReactNode;
+    nextIconButtonProps?: Partial<import("@mui/material").IconButtonProps<"button", {}>> | undefined;
+    onPageChange: (event: React.MouseEvent<HTMLButtonElement, MouseEvent> | null, page: number) => void;
+    onRowsPerPageChange?: React.ChangeEventHandler<HTMLInputElement | HTMLTextAreaElement> | undefined;
+    page: number;
+    rowsPerPage: number;
+    rowsPerPageOptions?: (number | {
+        value: number;
+        label: string;
+    })[] | undefined;
+    SelectProps?: Partial<import("@mui/material").SelectProps<unknown>> | undefined;
+    showFirstButton?: boolean | undefined;
+    showLastButton?: boolean | undefined;
+    sx?: import("@mui/material/styles").SxProps<import("@mui/material/styles").Theme> | undefined;
+} & import("@mui/material/OverridableComponent").CommonProps & Omit<Pick<import("@mui/material/TablePagination").TablePaginationBaseProps, "hidden" | "color" | "size" | "style" | "height" | "translate" | "width" | "padding" | "abbr" | "slot" | "title" | "colSpan" | "headers" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "className" | "contentEditable" | "contextMenu" | "dir" | "draggable" | "id" | "lang" | "placeholder" | "spellCheck" | "tabIndex" | "radioGroup" | "role" | "about" | "datatype" | "inlist" | "prefix" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "rowSpan" | "scope" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChange" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClick" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "align" | "valign" | "sx" | "variant" | "sortDirection"> & React.RefAttributes<React.Component<any, any, any>>, "hidden" | "color" | "page" | "size" | "height" | "translate" | "width" | "padding" | "abbr" | "slot" | "title" | "ref" | "colSpan" | "headers" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "contentEditable" | "contextMenu" | "dir" | "draggable" | "id" | "lang" | "placeholder" | "spellCheck" | "tabIndex" | "radioGroup" | "role" | "about" | "datatype" | "inlist" | "prefix" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "rowSpan" | "scope" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChange" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClick" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "align" | "valign" | "sx" | keyof import("@mui/material/OverridableComponent").CommonProps | "variant" | "count" | "getItemAriaLabel" | "labelDisplayedRows" | "labelRowsPerPage" | "onPageChange" | "onRowsPerPageChange" | "rowsPerPage" | "rowsPerPageOptions" | "showFirstButton" | "showLastButton" | "backIconButtonProps" | "nextIconButtonProps" | "sortDirection" | "ActionsComponent" | "SelectProps">>, "hidden" | "color" | "page" | "size" | "height" | "translate" | "width" | "padding" | "abbr" | "slot" | "title" | "key" | "colSpan" | "headers" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "contentEditable" | "contextMenu" | "dir" | "draggable" | "id" | "lang" | "placeholder" | "spellCheck" | "tabIndex" | "radioGroup" | "role" | "about" | "datatype" | "inlist" | "prefix" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "rowSpan" | "scope" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChange" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClick" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "align" | "valign" | "sx" | keyof import("@mui/material/OverridableComponent").CommonProps | "variant" | "count" | "getItemAriaLabel" | "labelDisplayedRows" | "labelRowsPerPage" | "onPageChange" | "onRowsPerPageChange" | "rowsPerPage" | "rowsPerPageOptions" | "showFirstButton" | "showLastButton" | "backIconButtonProps" | "nextIconButtonProps" | "sortDirection" | "ActionsComponent" | "SelectProps">) & React.RefAttributes<HTMLDivElement>>;

package/components/GridPagination.js

@@ -53,8 +53,7 @@ export const GridPagination = /*#__PURE__*/React.forwardRef(function GridPaginat
   }
 
   return /*#__PURE__*/_jsx(GridPaginationRoot, _extends({
-    ref: ref // @ts-ignore
-    ,
+    ref: ref,
     component: "div",
     count: paginationState.rowCount,
     page: paginationState.page <= lastPage ? paginationState.page : lastPage,

package/components/GridRow.d.ts

@@ -28,8 +28,5 @@ export interface GridRowProps {
     onMouseEnter?: React.MouseEventHandler<HTMLDivElement>;
     onMouseLeave?: React.MouseEventHandler<HTMLDivElement>;
 }
-declare function GridRow(props: React.HTMLAttributes<HTMLDivElement> & GridRowProps): JSX.Element;
-declare namespace GridRow {
-    var propTypes: any;
-}
+declare const GridRow: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & GridRowProps & React.RefAttributes<HTMLDivElement>>;
 export { GridRow };

package/components/GridRow.js

@@ -5,7 +5,7 @@ const _excluded = ["selected", "rowId", "row", "index", "style", "position", "ro
 import * as React from 'react';
 import PropTypes from 'prop-types';
 import clsx from 'clsx';
-import { unstable_composeClasses as composeClasses } from '@mui/material';
+import { unstable_composeClasses as composeClasses, useForkRef } from '@mui/material';
 import { GridEditModes, GridRowModes, GridCellModes } from '../models/gridEditRowModel';
 import { useGridApiContext } from '../hooks/utils/useGridApiContext';
 import { getDataGridUtilityClass, gridClasses } from '../constants/gridClasses';
@@ -55,7 +55,7 @@ const EmptyCell = ({
   }); // TODO change to .MuiDataGrid-emptyCell or .MuiDataGrid-rowFiller
 };
 
-function GridRow(props) {
+const GridRow = /*#__PURE__*/React.forwardRef(function GridRow(props, refProp) {
   var _apiRef$current$getRo;
 
   const {
@@ -90,6 +90,7 @@ function GridRow(props) {
   const sortModel = useGridSelector(apiRef, gridSortModelSelector);
   const treeDepth = useGridSelector(apiRef, gridRowTreeDepthSelector);
   const headerGroupingMaxDepth = useGridSelector(apiRef, gridDensityHeaderGroupingMaxDepthSelector);
+  const handleRef = useForkRef(ref, refProp);
   const ariaRowIndex = index + headerGroupingMaxDepth + 2; // 1 for the header row and 1 as it's 1-based
 
   const {
@@ -378,7 +379,7 @@ function GridRow(props) {
     onMouseLeave: publish('rowMouseLeave', onMouseLeave)
   } : null;
   return /*#__PURE__*/_jsxs("div", _extends({
-    ref: ref,
+    ref: handleRef,
     "data-id": rowId,
     "data-rowindex": index,
     role: "row",
@@ -391,8 +392,7 @@ function GridRow(props) {
       width: emptyCellWidth
     })]
   }));
-}
-
+});
 process.env.NODE_ENV !== "production" ? GridRow.propTypes = {
   // ----------------------------- Warning --------------------------------
   // | These PropTypes are generated from the TypeScript type definitions |

package/components/toolbar/GridToolbarFilterButton.js

@@ -70,11 +70,15 @@ const GridToolbarFilterButton = /*#__PURE__*/React.forwardRef(function GridToolb
     return /*#__PURE__*/_jsxs("div", {
       children: [apiRef.current.getLocaleText('toolbarFiltersTooltipActive')(activeFilters.length), /*#__PURE__*/_jsx(GridToolbarFilterListRoot, {
         className: classes.root,
-        children: activeFilters.map((item, index) => _extends({}, lookup[item.columnField] && /*#__PURE__*/_jsx("li", {
-          children: `${lookup[item.columnField].headerName || item.columnField}
+        children: activeFilters.map((item, index) => {
+          var _item$value;
+
+          return _extends({}, lookup[item.columnField] && /*#__PURE__*/_jsx("li", {
+            children: `${lookup[item.columnField].headerName || item.columnField}
                   ${getOperatorLabel(item)}
-                  ${item.value}`
-        }, index)))
+                  ${(_item$value = item.value) != null ? _item$value : ''}`
+          }, index));
+        })
       })]
     });
   }, [apiRef, preferencePanel.open, activeFilters, lookup, classes]);

package/hooks/features/editRows/useGridCellEditing.new.js

@@ -4,6 +4,7 @@ import _extends from "@babel/runtime/helpers/esm/extends";
 const _excluded = ["id", "field"],
       _excluded2 = ["id", "field"];
 import * as React from 'react';
+import { unstable_useEventCallback as useEventCallback } from '@mui/utils';
 import { useGridApiEventHandler, useGridApiOptionHandler, GridSignature } from '../../utils/useGridApiEventHandler';
 import { GridEditModes, GridCellModes } from '../../../models/gridEditRowModel';
 import { useGridApiMethod } from '../../utils/useGridApiMethod';
@@ -185,7 +186,7 @@ export const useGridCellEditing = (apiRef, props) => {
     const isEditing = editingState[id] && editingState[id][field];
     return isEditing ? GridCellModes.Edit : GridCellModes.View;
   }, [apiRef]);
-  const updateCellModesModel = React.useCallback(newModel => {
+  const updateCellModesModel = useEventCallback(newModel => {
     const isNewModelDifferentFromProp = newModel !== props.cellModesModel;
 
     if (onCellModesModelChange && isNewModelDifferentFromProp) {
@@ -202,7 +203,7 @@ export const useGridCellEditing = (apiRef, props) => {
     setCellModesModel(newModel);
     cellModesModelRef.current = newModel;
     apiRef.current.publishEvent('cellModesModelChange', newModel);
-  }, [apiRef, onCellModesModelChange, props.cellModesModel, signature]);
+  });
   const updateFieldInCellModesModel = React.useCallback((id, field, newProps) => {
     // We use the ref because it always contain the up-to-date value, different from the state
     // that needs a rerender to reflect the new value
@@ -261,7 +262,7 @@ export const useGridCellEditing = (apiRef, props) => {
       mode: GridCellModes.Edit
     }, other));
   }, [throwIfNotEditable, throwIfNotInMode, updateFieldInCellModesModel]);
-  const updateStateToStartCellEditMode = React.useCallback(params => {
+  const updateStateToStartCellEditMode = useEventCallback(params => {
     const {
       id,
       field,
@@ -274,7 +275,7 @@ export const useGridCellEditing = (apiRef, props) => {
     };
     updateOrDeleteFieldState(id, field, newProps);
     apiRef.current.setCellFocus(id, field);
-  }, [apiRef, updateOrDeleteFieldState]);
+  });
   const stopCellEditMode = React.useCallback(params => {
     const {
       id,
@@ -287,7 +288,7 @@ export const useGridCellEditing = (apiRef, props) => {
       mode: GridCellModes.View
     }, other));
   }, [throwIfNotInMode, updateFieldInCellModesModel]);
-  const updateStateToStopCellEditMode = React.useCallback(async params => {
+  const updateStateToStopCellEditMode = useEventCallback(async params => {
     const {
       id,
       field,
@@ -332,7 +333,11 @@ export const useGridCellEditing = (apiRef, props) => {
 
     if (processRowUpdate) {
       const handleError = errorThrown => {
-        prevCellModesModel.current[id][field].mode = GridCellModes.Edit;
+        prevCellModesModel.current[id][field].mode = GridCellModes.Edit; // Revert the mode in the cellModesModel prop back to "edit"
+
+        updateFieldInCellModesModel(id, field, {
+          mode: GridCellModes.Edit
+        });
 
         if (onProcessRowUpdateError) {
           onProcessRowUpdateError(errorThrown);
@@ -354,7 +359,7 @@ export const useGridCellEditing = (apiRef, props) => {
       apiRef.current.updateRows([rowUpdate]);
       finishCellEditMode();
     }
-  }, [apiRef, onProcessRowUpdateError, processRowUpdate, throwIfNotInMode, updateFieldInCellModesModel, updateOrDeleteFieldState]);
+  });
   const setCellEditingEditCellValue = React.useCallback(async params => {
     var _editingState$id, _editingState$id$fiel;
 

package/hooks/features/editRows/useGridRowEditing.new.js

@@ -4,6 +4,7 @@ import _extends from "@babel/runtime/helpers/esm/extends";
 const _excluded = ["id"],
       _excluded2 = ["id"];
 import * as React from 'react';
+import { unstable_useEventCallback as useEventCallback } from '@mui/utils';
 import { useGridApiEventHandler, useGridApiOptionHandler, GridSignature } from '../../utils/useGridApiEventHandler';
 import { GridEditModes, GridRowModes } from '../../../models/gridEditRowModel';
 import { useGridApiMethod } from '../../utils/useGridApiMethod';
@@ -252,7 +253,7 @@ export const useGridRowEditing = (apiRef, props) => {
     const isEditing = editingState[id] && Object.keys(editingState[id]).length > 0;
     return isEditing ? GridRowModes.Edit : GridRowModes.View;
   }, [apiRef, props.editMode]);
-  const updateRowModesModel = React.useCallback(newModel => {
+  const updateRowModesModel = useEventCallback(newModel => {
     const isNewModelDifferentFromProp = newModel !== props.rowModesModel;
 
     if (onRowModesModelChange && isNewModelDifferentFromProp) {
@@ -269,7 +270,7 @@ export const useGridRowEditing = (apiRef, props) => {
     setRowModesModel(newModel);
     rowModesModelRef.current = newModel;
     apiRef.current.publishEvent('rowModesModelChange', newModel);
-  }, [apiRef, onRowModesModelChange, props.rowModesModel, signature]);
+  });
   const updateRowInRowModesModel = React.useCallback((id, newProps) => {
     const newModel = _extends({}, rowModesModelRef.current);
 
@@ -330,7 +331,7 @@ export const useGridRowEditing = (apiRef, props) => {
       mode: GridRowModes.Edit
     }, other));
   }, [throwIfNotInMode, updateRowInRowModesModel]);
-  const updateStateToStartRowEditMode = React.useCallback(params => {
+  const updateStateToStartRowEditMode = useEventCallback(params => {
     const {
       id,
       fieldToFocus,
@@ -357,7 +358,7 @@ export const useGridRowEditing = (apiRef, props) => {
     if (fieldToFocus) {
       apiRef.current.setCellFocus(id, fieldToFocus);
     }
-  }, [apiRef, updateOrDeleteRowState]);
+  });
   const stopRowEditMode = React.useCallback(params => {
     const {
       id
@@ -369,7 +370,7 @@ export const useGridRowEditing = (apiRef, props) => {
       mode: GridRowModes.View
     }, other));
   }, [throwIfNotInMode, updateRowInRowModesModel]);
-  const updateStateToStopRowEditMode = React.useCallback(params => {
+  const updateStateToStopRowEditMode = useEventCallback(params => {
     const {
       id,
       ignoreModifications,
@@ -416,7 +417,11 @@ export const useGridRowEditing = (apiRef, props) => {
 
     if (processRowUpdate) {
       const handleError = errorThrown => {
-        prevRowModesModel.current[id].mode = GridRowModes.Edit;
+        prevRowModesModel.current[id].mode = GridRowModes.Edit; // Revert the mode in the rowModesModel prop back to "edit"
+
+        updateRowInRowModesModel(id, {
+          mode: GridRowModes.Edit
+        });
 
         if (onProcessRowUpdateError) {
           onProcessRowUpdateError(errorThrown);
@@ -437,7 +442,7 @@ export const useGridRowEditing = (apiRef, props) => {
       apiRef.current.updateRows([rowUpdate]);
       finishRowEditMode();
     }
-  }, [apiRef, onProcessRowUpdateError, processRowUpdate, updateOrDeleteRowState, updateRowInRowModesModel]);
+  });
   const setRowEditingEditCellValue = React.useCallback(params => {
     const {
       id,

package/hooks/features/virtualization/useGridVirtualScroller.js

@@ -91,16 +91,16 @@ export const useGridVirtualScroller = props => {
     var _currentPage$range, _currentPage$range2;
 
     const lastMeasuredIndexRelativeToAllRows = apiRef.current.unstable_getLastMeasuredRowIndex();
-    const lastMeasuredIndexRelativeToCurrentPage = lastMeasuredIndexRelativeToAllRows - (((_currentPage$range = currentPage.range) == null ? void 0 : _currentPage$range.firstRowIndex) || 0);
-    const lastMeasuredIndex = Math.max(0, lastMeasuredIndexRelativeToCurrentPage);
-    let allRowsMeasured = lastMeasuredIndex === Infinity;
+    let allRowsMeasured = lastMeasuredIndexRelativeToAllRows === Infinity;
 
-    if ((_currentPage$range2 = currentPage.range) != null && _currentPage$range2.lastRowIndex && !allRowsMeasured) {
+    if ((_currentPage$range = currentPage.range) != null && _currentPage$range.lastRowIndex && !allRowsMeasured) {
       // Check if all rows in this page are already measured
-      allRowsMeasured = lastMeasuredIndex >= currentPage.range.lastRowIndex;
+      allRowsMeasured = lastMeasuredIndexRelativeToAllRows >= currentPage.range.lastRowIndex;
     }
 
-    if (allRowsMeasured || rowsMeta.positions[lastMeasuredIndex] >= offset) {
+    const lastMeasuredIndexRelativeToCurrentPage = clamp(lastMeasuredIndexRelativeToAllRows - (((_currentPage$range2 = currentPage.range) == null ? void 0 : _currentPage$range2.firstRowIndex) || 0), 0, rowsMeta.positions.length);
+
+    if (allRowsMeasured || rowsMeta.positions[lastMeasuredIndexRelativeToCurrentPage] >= offset) {
       // If all rows were measured (when no row has "auto" as height) or all rows before the offset
       // were measured, then use a binary search because it's faster.
       return binarySearch(offset, rowsMeta.positions);
@@ -110,7 +110,7 @@ export const useGridVirtualScroller = props => {
     // Inspired by https://github.com/bvaughn/react-virtualized/blob/master/source/Grid/utils/CellSizeAndPositionManager.js
 
 
-    return exponentialSearch(offset, rowsMeta.positions, lastMeasuredIndex);
+    return exponentialSearch(offset, rowsMeta.positions, lastMeasuredIndexRelativeToCurrentPage);
   }, [apiRef, (_currentPage$range3 = currentPage.range) == null ? void 0 : _currentPage$range3.firstRowIndex, (_currentPage$range4 = currentPage.range) == null ? void 0 : _currentPage$range4.lastRowIndex, rowsMeta.positions]);
   const computeRenderContext = React.useCallback(() => {
     if (disableVirtualization) {

package/index.js

@@ -1,4 +1,4 @@
-/** @license MUI v5.17.4
+/** @license MUI v5.17.5
  *
  * This source code is licensed under the MIT license found in the
  * LICENSE file in the root directory of this source tree.

package/legacy/components/GridPagination.js

@@ -54,8 +54,7 @@ export var GridPagination = /*#__PURE__*/React.forwardRef(function GridPaginatio
   }
 
   return /*#__PURE__*/_jsx(GridPaginationRoot, _extends({
-    ref: ref // @ts-ignore
-    ,
+    ref: ref,
     component: "div",
     count: paginationState.rowCount,
     page: paginationState.page <= lastPage ? paginationState.page : lastPage,

package/legacy/components/GridRow.js

@@ -7,7 +7,7 @@ var _excluded = ["selected", "rowId", "row", "index", "style", "position", "rowH
 import * as React from 'react';
 import PropTypes from 'prop-types';
 import clsx from 'clsx';
-import { unstable_composeClasses as composeClasses } from '@mui/material';
+import { unstable_composeClasses as composeClasses, useForkRef } from '@mui/material';
 import { GridEditModes, GridRowModes, GridCellModes } from '../models/gridEditRowModel';
 import { useGridApiContext } from '../hooks/utils/useGridApiContext';
 import { getDataGridUtilityClass, gridClasses } from '../constants/gridClasses';
@@ -55,7 +55,7 @@ var EmptyCell = function EmptyCell(_ref) {
   }); // TODO change to .MuiDataGrid-emptyCell or .MuiDataGrid-rowFiller
 };
 
-function GridRow(props) {
+var GridRow = /*#__PURE__*/React.forwardRef(function GridRow(props, refProp) {
   var _apiRef$current$getRo;
 
   var selected = props.selected,
@@ -90,6 +90,7 @@ function GridRow(props) {
   var sortModel = useGridSelector(apiRef, gridSortModelSelector);
   var treeDepth = useGridSelector(apiRef, gridRowTreeDepthSelector);
   var headerGroupingMaxDepth = useGridSelector(apiRef, gridDensityHeaderGroupingMaxDepthSelector);
+  var handleRef = useForkRef(ref, refProp);
   var ariaRowIndex = index + headerGroupingMaxDepth + 2; // 1 for the header row and 1 as it's 1-based
 
   var _ref2 = (_apiRef$current$getRo = apiRef.current.getRootDimensions()) != null ? _apiRef$current$getRo : {
@@ -387,7 +388,7 @@ function GridRow(props) {
     onMouseLeave: publish('rowMouseLeave', onMouseLeave)
   } : null;
   return /*#__PURE__*/_jsxs("div", _extends({
-    ref: ref,
+    ref: handleRef,
     "data-id": rowId,
     "data-rowindex": index,
     role: "row",
@@ -400,8 +401,7 @@ function GridRow(props) {
       width: emptyCellWidth
     })]
   }));
-}
-
+});
 process.env.NODE_ENV !== "production" ? GridRow.propTypes = {
   // ----------------------------- Warning --------------------------------
   // | These PropTypes are generated from the TypeScript type definitions |

package/legacy/components/toolbar/GridToolbarFilterButton.js

@@ -75,8 +75,10 @@ var GridToolbarFilterButton = /*#__PURE__*/React.forwardRef(function GridToolbar
       children: [apiRef.current.getLocaleText('toolbarFiltersTooltipActive')(activeFilters.length), /*#__PURE__*/_jsx(GridToolbarFilterListRoot, {
         className: classes.root,
         children: activeFilters.map(function (item, index) {
+          var _item$value;
+
           return _extends({}, lookup[item.columnField] && /*#__PURE__*/_jsx("li", {
-            children: "".concat(lookup[item.columnField].headerName || item.columnField, "\n                  ").concat(getOperatorLabel(item), "\n                  ").concat(item.value)
+            children: "".concat(lookup[item.columnField].headerName || item.columnField, "\n                  ").concat(getOperatorLabel(item), "\n                  ").concat((_item$value = item.value) != null ? _item$value : '')
           }, index));
         })
       })]

package/legacy/hooks/features/editRows/useGridCellEditing.new.js

@@ -8,6 +8,7 @@ var _excluded = ["id", "field"],
     _excluded2 = ["id", "field"];
 import _regeneratorRuntime from "@babel/runtime/regenerator";
 import * as React from 'react';
+import { unstable_useEventCallback as useEventCallback } from '@mui/utils';
 import { useGridApiEventHandler, useGridApiOptionHandler, GridSignature } from '../../utils/useGridApiEventHandler';
 import { GridEditModes, GridCellModes } from '../../../models/gridEditRowModel';
 import { useGridApiMethod } from '../../utils/useGridApiMethod';
@@ -189,7 +190,7 @@ export var useGridCellEditing = function useGridCellEditing(apiRef, props) {
     var isEditing = editingState[id] && editingState[id][field];
     return isEditing ? GridCellModes.Edit : GridCellModes.View;
   }, [apiRef]);
-  var updateCellModesModel = React.useCallback(function (newModel) {
+  var updateCellModesModel = useEventCallback(function (newModel) {
     var isNewModelDifferentFromProp = newModel !== props.cellModesModel;
 
     if (onCellModesModelChange && isNewModelDifferentFromProp) {
@@ -206,7 +207,7 @@ export var useGridCellEditing = function useGridCellEditing(apiRef, props) {
     setCellModesModel(newModel);
     cellModesModelRef.current = newModel;
     apiRef.current.publishEvent('cellModesModelChange', newModel);
-  }, [apiRef, onCellModesModelChange, props.cellModesModel, signature]);
+  });
   var updateFieldInCellModesModel = React.useCallback(function (id, field, newProps) {
     // We use the ref because it always contain the up-to-date value, different from the state
     // that needs a rerender to reflect the new value
@@ -260,7 +261,7 @@ export var useGridCellEditing = function useGridCellEditing(apiRef, props) {
       mode: GridCellModes.Edit
     }, other));
   }, [throwIfNotEditable, throwIfNotInMode, updateFieldInCellModesModel]);
-  var updateStateToStartCellEditMode = React.useCallback(function (params) {
+  var updateStateToStartCellEditMode = useEventCallback(function (params) {
     var id = params.id,
         field = params.field,
         deleteValue = params.deleteValue;
@@ -271,7 +272,7 @@ export var useGridCellEditing = function useGridCellEditing(apiRef, props) {
     };
     updateOrDeleteFieldState(id, field, newProps);
     apiRef.current.setCellFocus(id, field);
-  }, [apiRef, updateOrDeleteFieldState]);
+  });
   var stopCellEditMode = React.useCallback(function (params) {
     var id = params.id,
         field = params.field,
@@ -282,7 +283,7 @@ export var useGridCellEditing = function useGridCellEditing(apiRef, props) {
       mode: GridCellModes.View
     }, other));
   }, [throwIfNotInMode, updateFieldInCellModesModel]);
-  var updateStateToStopCellEditMode = React.useCallback( /*#__PURE__*/function () {
+  var updateStateToStopCellEditMode = useEventCallback( /*#__PURE__*/function () {
     var _ref = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee(params) {
       var id, field, ignoreModifications, _params$cellToFocusAf, cellToFocusAfter, finishCellEditMode, editingState, _editingState$id$fiel, error, isProcessingProps, rowUpdate, handleError, row;
 
@@ -334,7 +335,11 @@ export var useGridCellEditing = function useGridCellEditing(apiRef, props) {
 
               if (processRowUpdate) {
                 handleError = function handleError(errorThrown) {
-                  prevCellModesModel.current[id][field].mode = GridCellModes.Edit;
+                  prevCellModesModel.current[id][field].mode = GridCellModes.Edit; // Revert the mode in the cellModesModel prop back to "edit"
+
+                  updateFieldInCellModesModel(id, field, {
+                    mode: GridCellModes.Edit
+                  });
 
                   if (onProcessRowUpdateError) {
                     onProcessRowUpdateError(errorThrown);
@@ -368,7 +373,7 @@ export var useGridCellEditing = function useGridCellEditing(apiRef, props) {
     return function (_x) {
       return _ref.apply(this, arguments);
     };
-  }(), [apiRef, onProcessRowUpdateError, processRowUpdate, throwIfNotInMode, updateFieldInCellModesModel, updateOrDeleteFieldState]);
+  }());
   var setCellEditingEditCellValue = React.useCallback( /*#__PURE__*/function () {
     var _ref2 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee2(params) {
       var _editingState$id, _editingState$id$fiel2;