[DataGrid] Fix overlay height in autoHeight mode (#15201)

mui · Oct 31, 2024 · 3ed65dc · 3ed65dc
1 parent c75774c
commit 3ed65dc
Show file tree

Hide file tree

Showing 5 changed files with 4 additions and 4 deletions.
diff --git a/...ta-grid/layout/AutoHeightOverlayNoSnap.js → ...ata/data-grid/layout/AutoHeightOverlay.js b/...ta-grid/layout/AutoHeightOverlayNoSnap.js → ...ata/data-grid/layout/AutoHeightOverlay.js
@@ -56,7 +56,7 @@ function CustomNoRowsOverlay() {
   );
 }
 
-export default function AutoHeightOverlayNoSnap() {
+export default function AutoHeightOverlay() {
   return (
     <Box sx={{ width: '100%' }}>
       <DataGrid

diff --git a/...a-grid/layout/AutoHeightOverlayNoSnap.tsx → ...ta/data-grid/layout/AutoHeightOverlay.tsx b/...a-grid/layout/AutoHeightOverlayNoSnap.tsx → ...ta/data-grid/layout/AutoHeightOverlay.tsx
@@ -56,7 +56,7 @@ function CustomNoRowsOverlay() {
   );
 }
 
-export default function AutoHeightOverlayNoSnap() {
+export default function AutoHeightOverlay() {
   return (
     <Box sx={{ width: '100%' }}>
       <DataGrid

diff --git a/...ayout/AutoHeightOverlayNoSnap.tsx.preview → ...grid/layout/AutoHeightOverlay.tsx.preview b/...ayout/AutoHeightOverlayNoSnap.tsx.preview → ...grid/layout/AutoHeightOverlay.tsx.preview
diff --git a/docs/data/data-grid/layout/layout.md b/docs/data/data-grid/layout/layout.md
@@ -61,7 +61,7 @@ take the height of two rows by default.
 
 To customize the overlay height, use the `--DataGrid-overlayHeight` CSS variable.
 
-{{"demo": "AutoHeightOverlayNoSnap.js", "bg": "inline"}}
+{{"demo": "AutoHeightOverlay.js", "bg": "inline"}}
 
 ## API
 

diff --git a/packages/x-data-grid/src/hooks/features/virtualization/useGridVirtualScroller.tsx b/packages/x-data-grid/src/hooks/features/virtualization/useGridVirtualScroller.tsx
@@ -539,7 +539,7 @@ export const useGridVirtualScroller = () => {
     };
 
     if (rootProps.autoHeight && currentPage.rows.length === 0) {
-      size.height = getMinimalContentHeight(apiRef); // Give room to show the overlay when there no rows.
+      size.flexBasis = getMinimalContentHeight(apiRef); // Give room to show the overlay when there no rows.
     }
 
     return size;