@mui/x-data-grid 8.1.0 → 8.3.0

package/CHANGELOG.md

@@ -5,13 +5,235 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## 8.3.0
+
+_May 8, 2025_
+
+We'd like to offer a big thanks to the 11 contributors who made this release possible. Here are some highlights ✨:
+
+- 🎨 Added new styling options and shapes for `<FunnelChart />`, including `variant`, `borderRadius`, `pyramid`, and `step-pyramid` curves.
+- 📚 Documentation improvements
+- 🐞 Bugfixes
+
+Special thanks go out to this community member for a valuable contribution:
+@ptuukkan.
+Team members who have contributed to this release:
+@alexfauquette, @arminmeh, @bernardobelchior, @flaviendelangle, @Janpot, @JCQuintas, @LukasTy, @MBilalShafi, @rita-codes, @romgrk.
+
+### Data Grid
+
+#### `@mui/x-data-grid@8.3.0`
+
+- [DataGrid] Fix cell editing of computed columns with data source (#17684) @ptuukkan
+- [DataGrid] Fix lazy loading crash with `isRowSelectable` prop (#17629) @MBilalShafi
+- [DataGrid] Fix: use CSS nonce (#17726) @romgrk
+- [DataGrid] Ignore `preProcessEditCellProps` for non-editable columns when starting a row update (#17732) @arminmeh
+- [DataGrid] Avoid applying row selection propagation on filtered rows (#17739) @MBilalShafi
+
+#### `@mui/x-data-grid-pro@8.3.0` [![pro](https://mui.com/r/x-pro-svg)](https://mui.com/r/x-pro-svg-link 'Pro plan')
+
+Same changes as in `@mui/x-data-grid@8.3.0`.
+
+#### `@mui/x-data-grid-premium@8.3.0` [![premium](https://mui.com/r/x-premium-svg)](https://mui.com/r/x-premium-svg-link 'Premium plan')
+
+Same changes as in `@mui/x-data-grid-pro@8.3.0`.
+
+### Date and Time Pickers
+
+#### `@mui/x-date-pickers@8.3.0`
+
+- [DateTimePicker] Fix focus behavior on desktop variant (#17719) @LukasTy
+- [pickers] Avoid `DigitalClock` stealing focus from a Picker open button on close (#17686) @LukasTy
+
+#### `@mui/x-date-pickers-pro@8.3.0` [![pro](https://mui.com/r/x-pro-svg)](https://mui.com/r/x-pro-svg-link 'Pro plan')
+
+Same changes as in `@mui/x-date-pickers@8.3.0`, plus:
+
+- [DateRangePicker] Fix to reset range position after closing mobile Picker (#17631) @LukasTy
+
+### Charts
+
+- The `<FunnelChart />` series now accepts a `variant='outlined'` prop for a simpler style.
+  <img width="398" alt="Screenshot 2025-05-06 at 20 36 12" src="https://github.com/user-attachments/assets/00fef14f-9026-421e-a4b6-7e081adce1e8" />
+
+- Add a `borderRadius` property to `<FunnelChart />`. All funnels have `8px` as a default value.
+  <img width="386" alt="Screenshot 2025-05-06 at 14 00 20" src="https://github.com/user-attachments/assets/4f4cc0e7-01ce-4ed6-a0e1-a387f78def23" />
+
+- Add a `pyramid` curve to `<FunnelChart />`, which allows creation of a pyramid-shaped funnel.
+  <img width="344" alt="Screenshot 2025-05-06 at 14 32 59" src="https://github.com/user-attachments/assets/0b2896e0-0478-4766-bb1b-258a4977a751" />
+
+- Add a `step-pyramid` curve to `<FunnelChart />`, which creates a stepped-pyramid like shape.
+  <img width="344" alt="Screenshot 2025-05-06 at 14 33 03" src="https://github.com/user-attachments/assets/894f0ab3-7898-40fe-b0df-560feea4085a" />
+
+#### `@mui/x-charts@8.3.0`
+
+- [charts] Add charts toolbar with zoom options (#17615) @bernardobelchior
+- [charts] Add zoom slider (#17496) @bernardobelchior
+- [charts] Cleanup compiler warnings (#17360) @alexfauquette
+- [charts] Fix `<PieArcLabel />` not taking `arcLabelRadius` into account (#17655) @bernardobelchior
+- [charts] Fix spark line not having clip path (#17501) @bernardobelchior
+- [charts] Fix type issue with ESM (#17624) @alexfauquette
+- [charts] Improve `<MarkElement />` performance (#17546) @bernardobelchior
+- [charts] Rename `materialSlots` internal constant (#17710) @bernardobelchior
+- [charts] Update zoom slider design (#17682) @bernardobelchior
+- [charts] Fix zoom being documented as available for heatmap (#17657) @bernardobelchior
+
+#### `@mui/x-charts-pro@8.3.0` [![pro](https://mui.com/r/x-pro-svg)](https://mui.com/r/x-pro-svg-link 'Pro plan')
+
+Same changes as in `@mui/x-charts@8.3.0`, plus:
+
+- [charts-pro] Add `pyramid` curve to `<FunnelChart />` (#17665) @JCQuintas
+- [charts-pro] Add `variant='outlined'` to `<FunnelChart />` series (#17661) @JCQuintas
+- [charts-pro] Add a `borderRadius` property to `<FunnelChart />` (#17660) @JCQuintas
+
+### Tree View
+
+#### `@mui/x-tree-view@8.3.0`
+
+- [tree view] Bug fix - Escape does not cancel Drag n Drop (#17735) @rita-codes
+- [tree view] Fix keyboard navigation error (#17685) @rita-codes
+- [tree view] Continue cleaning the plugin system (#17386) @flaviendelangle
+
+#### `@mui/x-tree-view-pro@8.3.0` [![pro](https://mui.com/r/x-pro-svg)](https://mui.com/r/x-pro-svg-link 'Pro plan')
+
+Same changes as in `@mui/x-tree-view@8.3.0`.
+
+### Docs
+
+- [charts] Add population pyramid demo (#17652) @bernardobelchior
+- [charts] Fix randomised argos test (#17658) @JCQuintas
+- [docs] Make preview messaging consistent in charts @bernardobelchior
+
+### Core
+
+- [code-infra] Avoid `node` types in the built packages (#17533) @LukasTy
+- [code-infra] Add `pkg.pr.new` publishing (#17402) @Janpot
+- [code-infra] Normalize author package in org @oliviertassinari
+- [code-infra] Remove required checkout step (#17729) @JCQuintas
+- [docs-infra] Normalize netlify.toml in org @oliviertassinari
+
+## 8.2.0
+
+_May 1, 2025_
+
+We'd like to offer a big thanks to the 14 contributors who made this release possible. Here are some highlights ✨:
+
+- 📊 `<FunnelChart/>` now uses the `strawberrySky` sequential color palette by default.
+  <img width="481" alt="Screenshot 2025-04-29 at 13 55 21" src="https://github.com/user-attachments/assets/182085d1-a7ce-4e4d-9d8d-a4fe87f27167" />
+- 📊 Add API to export a chart as an image: `apiRef.exportAsImage` — [Learn more](https://mui.com/x/react-charts/export/#export-as-image).
+
+Special thanks go out to the community members for their valuable contributions:
+@federico-ntr, @nusr.
+Following are all team members who have contributed to this release:
+@alexfauquette, @arminmeh, @bernardobelchior, @hasdfa, @Janpot, @JCQuintas, @KenanYusuf, @LukasTy, @MBilalShafi, @michelengelen, @oliviertassinari, @romgrk.
+
+<!--/ HIGHLIGHT_ABOVE_SEPARATOR /-->
+
+### Data Grid
+
+#### `@mui/x-data-grid@8.2.0`
+
+- [DataGrid] Fix panel alignment (#17625) @KenanYusuf
+- [DataGrid] Fix theme `defaultProps` causing unwanted re-renders (#17490) @KenanYusuf
+- [DataGrid] Fix circular reference error (#17591) @romgrk
+- [DataGrid] Fix `<GridEditInputCell />` break input (#16773) @nusr
+
+#### `@mui/x-data-grid-pro@8.2.0` [![pro](https://mui.com/r/x-pro-svg)](https://mui.com/r/x-pro-svg-link 'Pro plan')
+
+Same changes as in `@mui/x-data-grid@8.2.0`, plus:
+
+- [DataGridPro] Use intersection observer to trigger server-side infinite loading (#17369) @arminmeh
+
+#### `@mui/x-data-grid-premium@8.2.0` [![premium](https://mui.com/r/x-premium-svg)](https://mui.com/r/x-premium-svg-link 'Premium plan')
+
+Same changes as in `@mui/x-data-grid-pro@8.2.0`.
+
+### Date and Time Pickers
+
+#### `@mui/x-date-pickers@8.2.0`
+
+- [l10n] Improve Italian (it-IT) locale (#17600) @federico-ntr
+- [pickers] Refactor owner state typing (#17517) @LukasTy
+
+#### `@mui/x-date-pickers-pro@8.2.0` [![pro](https://mui.com/r/x-pro-svg)](https://mui.com/r/x-pro-svg-link 'Pro plan')
+
+Same changes as in `@mui/x-date-pickers@8.2.0`.
+
+### Charts
+
+#### `@mui/x-charts@8.2.0`
+
+- [charts] Add library name to errors (#17547) @bernardobelchior
+- [charts] Add monochrome palettes (#17610) @JCQuintas
+- [charts] Add screenshot of the tooltip (#17395) @alexfauquette
+- [charts] Default bar chart x-axis scale type to band (#17519) @bernardobelchior
+- [charts] Document axis ID uniqueness constraints (#17630) @bernardobelchior
+- [charts] Refactor axis types (#17632) @bernardobelchior
+- [charts] Use `<circle />` for circular legend mark (#17590) @alexfauquette
+
+#### `@mui/x-charts-pro@8.2.0` [![pro](https://mui.com/r/x-pro-svg)](https://mui.com/r/x-pro-svg-link 'Pro plan')
+
+Same changes as in `@mui/x-charts@8.2.0`, plus:
+
+- [charts-pro] Add `gap` option to `<FunnelChart />` (#17642) @JCQuintas
+- [charts-pro] Export charts as image (#17353) @bernardobelchior
+- [charts-pro] Simplify zoom testing (#17525) @JCQuintas
+- [charts-pro] Use new sequential color palette in `<FunnelChart />` (#17606) @JCQuintas
+
+### Tree View
+
+#### `@mui/x-tree-view@8.2.0`
+
+Internal changes.
+
+#### `@mui/x-tree-view-pro@8.2.0` [![pro](https://mui.com/r/x-pro-svg)](https://mui.com/r/x-pro-svg-link 'Pro plan')
+
+Same changes as in `@mui/x-tree-view@8.2.0`.
+
+### Docs
+
+- [docs][charts] Add composition sections (#17377) @alexfauquette
+- [docs][charts] Add docs on tooltip style (#17601) @bernardobelchior
+- [docs][charts] Fix highlighting heading structure (#17581) @oliviertassinari
+- [docs][charts] Improve export docs (#17538) @oliviertassinari
+- [docs][charts] Similar introduction on most charts pages (#17374) @alexfauquette
+- [docs][DataGrid] Clear component docs (#17540) @oliviertassinari
+- [docs] Explicitly state that `groupingColDef` reference needs to be stable (#17544) @arminmeh
+- [docs] Fix <kbd> a11y (#17536) @oliviertassinari
+- [docs] Fix CodeSandbox spelling @oliviertassinari
+- [docs] Fix coding style function @oliviertassinari
+- [docs] Fix migration guide format (#17450) @oliviertassinari
+- [docs] Improve data grid export docs (#17551) @MBilalShafi
+- [docs] Remove leftover `@next` usages (#17542) @LukasTy
+
+### Core
+
+- [core] Add security label to dependabot PRs @oliviertassinari
+- [core] Allow post-install vale @oliviertassinari
+- [core] Component consistency @oliviertassinari
+- [core] Fix all Vale errors @oliviertassinari
+- [core] Move `loadStyleSheets` to internals and use it in data grid and charts (#17548) @bernardobelchior
+- [core] Remove empty version (#17582) @oliviertassinari
+- [core] Remove eslint from codemod spec files (#17443) @alexfauquette
+- [core] Remove unnecessary versions (#17597) @oliviertassinari
+- [code-infra] Allow postinstall scripts for packages requesting it (#17635) @LukasTy
+- [code-infra] Data Grid `vitest` changes (#17619) @JCQuintas
+- [code-infra] Fix date-time sensitive tests (#17644) @JCQuintas
+- [code-infra] Fix extension handling for type imports (#17636) @Janpot
+- [code-infra] Further remove `clock=fake` and add `async act` for datagrid (#17563) @JCQuintas
+- [code-infra] Latest vitest picker changes (#17577) @JCQuintas
+- [docs-infra] Fix Vale no longer working (#17602) @alexfauquette
+- [docs-infra] Uniformize Vale between repositories @oliviertassinari
+- [infra] Updates to `branch switch comments` (#17589) @michelengelen
+- [x-telemetry] Fix issue with get machineid hash (#17614) @hasdfa
+
 ## 8.1.0
 
 _Apr 24, 2025_
 
 We'd like to offer a big thanks to the 14 contributors who made this release possible. Here are some highlights ✨:
 
-- 📊 Add API to print a chart or export it as PDF: `apiRef.exportAsPrint`.
+- 📊 Add API to print a chart or export it as PDF: `apiRef.exportAsPrint()`.
 - 📚 Documentation improvements
 - 🐞 Bugfixes
 
@@ -56,7 +278,7 @@ Same changes as in `@mui/x-date-pickers@8.1.0`.
 
 ### Charts
 
-- Add API to print a chart or export it as PDF: `apiRef.exportAsPrint`.
+- Add API to print a chart or export it as PDF: `apiRef.exportAsPrint()`.
 
 #### `@mui/x-charts@8.1.0`
 
@@ -1821,7 +2043,7 @@ Same changes as in `@mui/x-tree-view@8.0.0-alpha.8`.
 - [docs] Add example for custom legend (#16169) @alexfauquette
 - [docs] Add full custom field creation example (#15194) @flaviendelangle
 - [docs] Copyedit the Data Grid cell selection page (#16099) @samuelsycamore
-- [docs] Fix demo rendering issue on Codesandbox (#16118) @arminmeh
+- [docs] Fix demo rendering issue on CodeSandbox (#16118) @arminmeh
 - [docs] Remove broken links (#16167) @alexfauquette
 - [docs] Split the Data Grid editing page (#14931) @MBilalShafi
 - [docs] Fix wrong props warnings (#16119) @JCQuintas
@@ -2268,7 +2490,7 @@ Releasing to benefit from license package fix (#15814).
 
 - [code-infra] Add Charts sandbox generation (#15830) @JCQuintas
 - [code-infra] Remove redundant `@type/react-test-renderer` dep (#15766) @LukasTy
-- [license] Use `console.log` for the error message on Codesandbox to avoid rendering error (#15814) @arminmeh
+- [license] Use `console.log` for the error message on CodeSandbox to avoid rendering error (#15814) @arminmeh
 
 ## 8.0.0-alpha.3
 
@@ -2484,6 +2706,8 @@ Same changes as in `@mui/x-tree-view@v8.0.0-alpha.2`.
 
 ### Docs
 
+<!-- vale MUI.CorrectRererenceCased = NO -->
+
 - [docs] Fix 404 links (#15575) @oliviertassinari
 - [docs] Fix bash comments (#15571) @oliviertassinari
 - [docs] Fix Pickers theme augmentation example (#15672) @LukasTy
@@ -2493,6 +2717,8 @@ Same changes as in `@mui/x-tree-view@v8.0.0-alpha.2`.
 - [docs] Fix `anchorEl` API page for charts (#15625) @oliviertassinari
 - [docs] Add documentation for the list view feature (#15344) @KenanYusuf
 
+<!-- vale MUI.CorrectRererenceCased = YES -->
+
 ### Core
 
 - [core] Follow `()` function convention for docs @oliviertassinari
@@ -3401,7 +3627,7 @@ Same changes as in `@mui/x-tree-view@7.24.0`.
 ### Docs
 
 - [docs] Copyedit the Data Grid cell selection page (#16213) @samuelsycamore
-- [docs] Fix demo rendering issue on Codesandbox (#16129) @arminmeh
+- [docs] Fix demo rendering issue on CodeSandbox (#16129) @arminmeh
 
 ### Core
 
@@ -3679,7 +3905,7 @@ Releasing to benefit from license package fix (#15818).
 ### Core
 
 - [core] Add `@mui/x-tree-view-pro` to `releaseChangelog` (#15747) @flaviendelangle
-- [license] Use `console.log` for the error message on Codesandbox to avoid rendering error (#15818) @arminmeh
+- [license] Use `console.log` for the error message on CodeSandbox to avoid rendering error (#15818) @arminmeh
 
 ## 7.23.1
 
@@ -7020,7 +7246,7 @@ Same changes as in `@mui/x-data-grid-pro@7.0.0-beta.4`.
    />
   ```
 
-- The headless field hooks (e.g.: `useDateField`) now returns a new prop called `enableAccessibleFieldDOMStructure`.
+- The headless field hooks (for example `useDateField()`) now returns a new prop called `enableAccessibleFieldDOMStructure`.
   This property is utilized to determine whether the anticipated UI is constructed using an accessible DOM structure.
   Learn more about this new accessible DOM structure in the [v8 migration guide](https://v7.mui.com/x/migration/migration-pickers-v7/#new-dom-structure-for-the-field).
 

package/DataGrid/DataGrid.d.ts

@@ -1,7 +1,7 @@
 import * as React from 'react';
 import { DataGridProps } from "../models/props/DataGridProps.js";
 import { GridValidRowModel } from "../models/gridRows.js";
-export type { GridSlotsComponent as GridSlots } from '../models';
+export type { GridSlotsComponent as GridSlots } from "../models/index.js";
 interface DataGridComponent {
   <R extends GridValidRowModel = any>(props: DataGridProps<R> & React.RefAttributes<HTMLDivElement>): React.JSX.Element;
   propTypes?: any;

package/DataGrid/useDataGridProps.js

@@ -9,6 +9,7 @@ exports.useDataGridProps = void 0;
 var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
 var React = _interopRequireWildcard(require("react"));
 var _styles = require("@mui/material/styles");
+var _system = require("@mui/system");
 var _constants = require("../constants");
 var _defaultGridSlotsComponents = require("../constants/defaultGridSlotsComponents");
 var _utils = require("../internals/utils");
@@ -32,12 +33,12 @@ const getDataGridForcedProps = themedProps => (0, _extends2.default)({}, DATA_GR
 } : {});
 const defaultSlots = _defaultGridSlotsComponents.DATA_GRID_DEFAULT_SLOTS_COMPONENTS;
 const useDataGridProps = inProps => {
-  const themedProps =
-  // eslint-disable-next-line material-ui/mui-name-matches-component-name
-  (0, _styles.useThemeProps)({
+  const theme = (0, _styles.useTheme)();
+  const themedProps = React.useMemo(() => (0, _system.getThemeProps)({
     props: inProps,
+    theme,
     name: 'MuiDataGrid'
-  });
+  }), [theme, inProps]);
   const localeText = React.useMemo(() => (0, _extends2.default)({}, _constants.GRID_DEFAULT_LOCALE_TEXT, themedProps.localeText), [themedProps.localeText]);
   const slots = React.useMemo(() => (0, _utils.computeSlots)({
     defaultSlots,

package/colDef/gridDefaultColumnTypes.d.ts

@@ -1,3 +1,3 @@
-import type { GridColumnTypesRecord } from '../models/colDef/gridColumnTypesRecord';
+import type { GridColumnTypesRecord } from "../models/colDef/gridColumnTypesRecord.js";
 export declare const DEFAULT_GRID_COL_TYPE_KEY = "string";
 export declare const getGridDefaultColumnTypes: () => GridColumnTypesRecord;

package/colDef/gridNumericOperators.d.ts

@@ -1,6 +1,6 @@
 import { GridFilterOperator } from "../models/gridFilterOperator.js";
-import type { GridFilterInputValueProps } from '../models/gridFilterInputComponent';
-import type { GetApplyQuickFilterFn } from '../models/colDef/gridColDef';
+import type { GridFilterInputValueProps } from "../models/gridFilterInputComponent.js";
+import type { GetApplyQuickFilterFn } from "../models/colDef/gridColDef.js";
 export declare const getGridNumericQuickFilterFn: GetApplyQuickFilterFn<any, number | string | null>;
 export declare const getGridNumericOperators: () => GridFilterOperator<any, number | string | null, any, GridFilterInputValueProps & {
   type?: "number";

package/colDef/gridStringOperators.d.ts

@@ -1,4 +1,4 @@
-import type { GetApplyQuickFilterFn } from '../models/colDef/gridColDef';
+import type { GetApplyQuickFilterFn } from "../models/colDef/gridColDef.js";
 import { GridFilterOperator } from "../models/gridFilterOperator.js";
 export declare const getGridStringQuickFilterFn: GetApplyQuickFilterFn<any, unknown>;
 export declare const getGridStringOperators: (disableTrim?: boolean) => GridFilterOperator<any, number | string | null, any>[];

package/components/GridDetailPanels.d.ts

@@ -1,4 +1,4 @@
-import type { VirtualScroller } from '../hooks/features/virtualization/useGridVirtualScroller';
+import type { VirtualScroller } from "../hooks/features/virtualization/useGridVirtualScroller.js";
 export interface GridDetailPanelsProps {
   virtualScroller: VirtualScroller;
 }

package/components/GridPinnedRows.d.ts

@@ -1,4 +1,4 @@
-import type { VirtualScroller } from '../hooks/features/virtualization/useGridVirtualScroller';
+import type { VirtualScroller } from "../hooks/features/virtualization/useGridVirtualScroller.js";
 export interface GridPinnedRowsProps {
   position: 'top' | 'bottom';
   virtualScroller: VirtualScroller;

package/components/GridRow.d.ts

@@ -1,7 +1,7 @@
 import * as React from 'react';
 import { GridRowId, GridRowModel } from "../models/gridRows.js";
 import { GridPinnedColumns } from "../hooks/features/columns/index.js";
-import type { GridStateColDef } from '../models/colDef/gridColDef';
+import type { GridStateColDef } from "../models/colDef/gridColDef.js";
 export interface GridRowProps extends React.HTMLAttributes<HTMLDivElement> {
   row: GridRowModel;
   rowId: GridRowId;

package/components/GridScrollArea.js

@@ -9,7 +9,6 @@ Object.defineProperty(exports, "__esModule", {
 exports.GridScrollArea = void 0;
 var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
 var React = _interopRequireWildcard(require("react"));
-var _clsx = _interopRequireDefault(require("clsx"));
 var _useEventCallback = _interopRequireDefault(require("@mui/utils/useEventCallback"));
 var _composeClasses = _interopRequireDefault(require("@mui/utils/composeClasses"));
 var _system = require("@mui/system");
@@ -149,7 +148,7 @@ function GridScrollAreaContent(props) {
   }
   return /*#__PURE__*/(0, _jsxRuntime.jsx)(GridScrollAreaRawRoot, {
     ref: rootRef,
-    className: (0, _clsx.default)(classes.root),
+    className: classes.root,
     ownerState: ownerState,
     onDragOver: handleDragOver,
     style: style

package/components/base/GridOverlays.js

@@ -11,7 +11,6 @@ var React = _interopRequireWildcard(require("react"));
 var _propTypes = _interopRequireDefault(require("prop-types"));
 var _system = require("@mui/system");
 var _composeClasses = _interopRequireDefault(require("@mui/utils/composeClasses"));
-var _clsx = _interopRequireDefault(require("clsx"));
 var _gridRowsUtils = require("../../hooks/features/rows/gridRowsUtils");
 var _useGridSelector = require("../../hooks/utils/useGridSelector");
 var _dimensions = require("../../hooks/features/dimensions");
@@ -70,11 +69,11 @@ function GridOverlayWrapper(props) {
     classes: rootProps.classes
   }));
   return /*#__PURE__*/(0, _jsxRuntime.jsx)(GridOverlayWrapperRoot, (0, _extends2.default)({
-    className: (0, _clsx.default)(classes.root)
+    className: classes.root
   }, props, {
     right: dimensions.columnsTotalWidth - dimensions.viewportOuterSize.width,
     children: /*#__PURE__*/(0, _jsxRuntime.jsx)(GridOverlayWrapperInner, (0, _extends2.default)({
-      className: (0, _clsx.default)(classes.inner),
+      className: classes.inner,
       style: {
         height,
         width: dimensions.viewportOuterSize.width

package/components/cell/GridActionsCellItem.d.ts

@@ -44,7 +44,7 @@ declare const GridActionsCellItem: React.ForwardRefExoticComponent<GridActionsCe
 } & import("@mui/x-data-grid").BaseMenuItemPropsOverrides, "component">) | Omit<GridActionsCellItemCommonProps & {
   showInMenu?: false;
   icon: React.ReactElement<any>;
-} & Omit<Omit<import("../../models/gridBaseSlots").ButtonProps, "startIcon"> & {
+} & Omit<Omit<import("../../models/gridBaseSlots.js").ButtonProps, "startIcon"> & {
   label?: string;
   color?: "default" | "inherit" | "primary";
   edge?: "start" | "end" | false;

package/components/cell/GridBooleanCell.d.ts

@@ -1,6 +1,6 @@
 import * as React from 'react';
-import type { GridColDef } from '../../models/colDef/gridColDef';
-import type { GridRenderCellParams } from '../../models/params/gridCellParams';
+import type { GridColDef } from "../../models/colDef/gridColDef.js";
+import type { GridRenderCellParams } from "../../models/params/gridCellParams.js";
 interface GridBooleanCellProps extends GridRenderCellParams {
   hideDescendantCount?: boolean;
 }

package/components/cell/GridEditInputCell.js

@@ -60,9 +60,6 @@ const GridEditInputCell = exports.GridEditInputCell = (0, _forwardRef.forwardRef
   const classes = useUtilityClasses(rootProps);
   const handleChange = React.useCallback(async event => {
     const newValue = event.target.value;
-    if (onValueChange) {
-      await onValueChange(event, newValue);
-    }
     const column = apiRef.current.getColumn(field);
     let parsedValue = newValue;
     if (column.valueParser) {
@@ -76,6 +73,9 @@ const GridEditInputCell = exports.GridEditInputCell = (0, _forwardRef.forwardRef
       debounceMs,
       unstable_skipValueParser: true
     }, event);
+    if (onValueChange) {
+      await onValueChange(event, newValue);
+    }
   }, [apiRef, debounceMs, field, id, onValueChange]);
   const meta = apiRef.current.unstable_getEditCellMeta(id, field);
   React.useEffect(() => {

package/components/cell/GridEditSingleSelectCell.d.ts

@@ -1,5 +1,5 @@
 import * as React from 'react';
-import type { GridSlotProps } from '../../models/gridSlotsComponentsProps';
+import type { GridSlotProps } from "../../models/gridSlotsComponentsProps.js";
 import { GridRenderEditCellParams } from "../../models/params/gridCellParams.js";
 export interface GridEditSingleSelectCellProps extends GridRenderEditCellParams {
   /**

package/components/cell/index.d.ts

@@ -1,5 +1,5 @@
 export { GridCell } from "./GridCell.js";
-export type { GridCellProps } from './GridCell';
+export type { GridCellProps } from "./GridCell.js";
 export * from "./GridBooleanCell.js";
 export * from "./GridEditBooleanCell.js";
 export * from "./GridEditDateCell.js";

package/components/columnSelection/GridCellCheckboxRenderer.d.ts

@@ -1,5 +1,5 @@
 import * as React from 'react';
-import type { GridRenderCellParams } from '../../models/params/gridCellParams';
+import type { GridRenderCellParams } from "../../models/params/gridCellParams.js";
 declare const GridCellCheckboxForwardRef: React.ForwardRefExoticComponent<GridRenderCellParams<any, any, any, import("@mui/x-data-grid").GridTreeNodeWithRender>> | React.ForwardRefExoticComponent<GridRenderCellParams<any, any, any, import("@mui/x-data-grid").GridTreeNodeWithRender> & React.RefAttributes<HTMLInputElement>>;
 export { GridCellCheckboxForwardRef };
 export declare const GridCellCheckboxRenderer: React.ForwardRefExoticComponent<GridRenderCellParams<any, any, any, import("@mui/x-data-grid").GridTreeNodeWithRender>> | React.ForwardRefExoticComponent<GridRenderCellParams<any, any, any, import("@mui/x-data-grid").GridTreeNodeWithRender> & React.RefAttributes<HTMLInputElement>>;

package/components/columnSelection/GridHeaderCheckbox.d.ts

@@ -1,4 +1,4 @@
 import * as React from 'react';
-import type { GridColumnHeaderParams } from '../../models/params/gridColumnHeaderParams';
+import type { GridColumnHeaderParams } from "../../models/params/gridColumnHeaderParams.js";
 declare const GridHeaderCheckbox: React.ForwardRefExoticComponent<GridColumnHeaderParams<import("@mui/x-data-grid").GridValidRowModel, any, any>> | React.ForwardRefExoticComponent<GridColumnHeaderParams<import("@mui/x-data-grid").GridValidRowModel, any, any> & React.RefAttributes<HTMLButtonElement>>;
 export { GridHeaderCheckbox };

package/components/columnSelection/GridHeaderCheckbox.js

@@ -83,6 +83,10 @@ const GridHeaderCheckbox = exports.GridHeaderCheckbox = (0, _forwardRef.forwardR
     const candidates = new Set();
     for (let i = 0; i < rowIds.length; i += 1) {
       const id = rowIds[i];
+      if (!apiRef.current.getRow(id)) {
+        // The row could have been removed
+        continue;
+      }
       if (apiRef.current.isRowSelectable(id)) {
         candidates.add(id);
       }

package/components/columnsManagement/GridColumnsManagement.d.ts

@@ -1,6 +1,6 @@
 import * as React from 'react';
 import { TextFieldProps } from "../../models/gridBaseSlots.js";
-import type { GridColDef } from '../../models/colDef/gridColDef';
+import type { GridColDef } from "../../models/colDef/gridColDef.js";
 export interface GridColumnsManagementProps {
   sort?: 'asc' | 'desc';
   searchPredicate?: (column: GridColDef, searchValue: string) => boolean;

package/components/columnsManagement/utils.d.ts

@@ -1,4 +1,4 @@
 import { GridColumnVisibilityModel } from "../../hooks/features/columns/gridColumnsInterfaces.js";
-import type { GridColumnsManagementProps } from './GridColumnsManagement';
+import type { GridColumnsManagementProps } from "./GridColumnsManagement.js";
 export declare const checkColumnVisibilityModelsSame: (a: GridColumnVisibilityModel, b: GridColumnVisibilityModel) => boolean;
 export declare const defaultSearchPredicate: NonNullable<GridColumnsManagementProps['searchPredicate']>;

package/components/columnsPanel/ColumnsPanelTrigger.d.ts

@@ -1,6 +1,6 @@
 import * as React from 'react';
 import { RenderProp } from "../../hooks/utils/useGridComponentRenderer.js";
-import type { GridSlotProps } from '../../models';
+import type { GridSlotProps } from "../../models/index.js";
 export interface ColumnsPanelState {
   /**
    * If `true`, the columns panel is open.

package/components/export/ExportCsv.d.ts

@@ -1,7 +1,7 @@
 import * as React from 'react';
 import { RenderProp } from "../../hooks/utils/useGridComponentRenderer.js";
 import { GridCsvExportOptions } from "../../models/gridExport.js";
-import type { GridSlotProps } from '../../models';
+import type { GridSlotProps } from "../../models/index.js";
 export type ExportCsvProps = GridSlotProps['baseButton'] & {
   /**
    * A function to customize rendering of the component.

package/components/export/ExportPrint.d.ts

@@ -1,7 +1,7 @@
 import * as React from 'react';
 import { RenderProp } from "../../hooks/utils/useGridComponentRenderer.js";
 import { GridPrintExportOptions } from "../../models/gridExport.js";
-import type { GridSlotProps } from '../../models';
+import type { GridSlotProps } from "../../models/index.js";
 export type ExportPrintProps = GridSlotProps['baseButton'] & {
   /**
    * A function to customize rendering of the component.

package/components/filterPanel/FilterPanelTrigger.d.ts

@@ -1,6 +1,6 @@
 import * as React from 'react';
 import { RenderProp } from "../../hooks/utils/useGridComponentRenderer.js";
-import type { GridSlotProps } from '../../models';
+import type { GridSlotProps } from "../../models/index.js";
 export interface FilterPanelState {
   /**
    * If `true`, the filter panel is open.

package/components/panel/GridPanel.js

@@ -38,7 +38,6 @@ const GridPanelContent = (0, _styles.styled)('div', {
   boxShadow: _cssVariables.vars.shadows.overlay,
   display: 'flex',
   maxWidth: `calc(100vw - ${_cssVariables.vars.spacing(2)})`,
-  margin: _cssVariables.vars.spacing(1),
   overflow: 'auto'
 });
 const GridPanel = exports.GridPanel = (0, _forwardRef.forwardRef)((props, ref) => {

package/components/panel/filterPanel/GridFilterInputMultipleSingleSelect.d.ts

@@ -1,7 +1,7 @@
 import * as React from 'react';
 import { AutocompleteProps } from "../../../models/gridBaseSlots.js";
 import { GridFilterInputValueProps } from "../../../models/gridFilterInputComponent.js";
-import type { ValueOptions } from '../../../models/colDef/gridColDef';
+import type { ValueOptions } from "../../../models/colDef/gridColDef.js";
 export type GridFilterInputMultipleSingleSelectProps = GridFilterInputValueProps<Omit<AutocompleteProps<ValueOptions, true, false, true>, 'options'>> & {
   type?: 'singleSelect';
 };

package/components/panel/filterPanel/filterPanelUtils.d.ts

@@ -1,5 +1,5 @@
-import type { GridColDef, GridSingleSelectColDef } from '../../../models/colDef/gridColDef';
-import type { GridValueOptionsParams } from '../../../models/params/gridValueOptionsParams';
+import type { GridColDef, GridSingleSelectColDef } from "../../../models/colDef/gridColDef.js";
+import type { GridValueOptionsParams } from "../../../models/params/gridValueOptionsParams.js";
 export declare function isSingleSelectColDef(colDef: GridColDef | null): colDef is GridSingleSelectColDef;
 export declare function getValueOptions(column: GridSingleSelectColDef, additionalParams?: Omit<GridValueOptionsParams, 'field'>): import("@mui/x-data-grid").ValueOptions[] | undefined;
 export declare function getValueFromValueOptions(value: string, valueOptions: any[] | undefined, getOptionValue: NonNullable<GridSingleSelectColDef['getOptionValue']>): any;

package/components/panel/filterPanel/index.d.ts

@@ -3,8 +3,8 @@ export { GridFilterInputValue, type GridTypeFilterInputValueProps } from "./Grid
 export * from "./GridFilterInputDate.js";
 export * from "./GridFilterInputSingleSelect.js";
 export { GridFilterInputBoolean } from "./GridFilterInputBoolean.js";
-export type { GridFilterInputBooleanProps } from './GridFilterInputBoolean';
+export type { GridFilterInputBooleanProps } from "./GridFilterInputBoolean.js";
 export { GridFilterPanel } from "./GridFilterPanel.js";
-export type { GetColumnForNewFilterArgs } from './GridFilterPanel';
+export type { GetColumnForNewFilterArgs } from "./GridFilterPanel.js";
 export * from "./GridFilterInputMultipleValue.js";
 export * from "./GridFilterInputMultipleSingleSelect.js";

package/components/quickFilter/QuickFilter.d.ts

@@ -1,7 +1,7 @@
 import * as React from 'react';
 import { QuickFilterState } from "./QuickFilterContext.js";
 import { RenderProp } from "../../hooks/utils/useGridComponentRenderer.js";
-import type { GridFilterModel } from '../../models';
+import type { GridFilterModel } from "../../models/index.js";
 export type QuickFilterProps = Omit<React.HTMLAttributes<HTMLDivElement>, 'className'> & {
   /**
    * Function responsible for parsing text input in an array of independent values for quick filtering.

package/components/quickFilter/QuickFilterClear.d.ts

@@ -1,6 +1,6 @@
 import * as React from 'react';
 import { RenderProp } from "../../hooks/utils/useGridComponentRenderer.js";
-import type { GridSlotProps } from '../../models';
+import type { GridSlotProps } from "../../models/index.js";
 import { QuickFilterState } from "./QuickFilterContext.js";
 export type QuickFilterClearProps = Omit<GridSlotProps['baseIconButton'], 'className'> & {
   /**