v7.0.0 (#12523)

Signed-off-by: Nora <72460825+noraleonte@users.noreply.github.com> Co-authored-by: Andrew Cherniavskyi <andrew@mui.com> Co-authored-by: Bilal Shafi <bilalshafidev@gmail.com> Co-authored-by: Flavien DELANGLE <flaviendelangle@gmail.com> Co-authored-by: Lukas <llukas.tyla@gmail.com> Co-authored-by: José Rodolfo Freitas <joserodolfo.freitas@gmail.com>
mui · Mar 22, 2024 · 2e5fbb3 · 2e5fbb3
1 parent 2916fb1
commit 2e5fbb3
Show file tree

Hide file tree

Showing 13 changed files with 204 additions and 21 deletions.
diff --git a/CHANGELOG.md b/CHANGELOG.md
@@ -3,6 +3,189 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## v7.0.0
+
+_Mar 22, 2024_
+
+We're excited to [announce the first v7 stable release](https://mui.com/blog/mui-x-v7/)! 🎉🚀
+
+This is now the officially supported major version, where we'll keep rolling out new features, bug fixes, and improvements.
+Migration guides are available with a complete list of the breaking changes:
+
+- [Data Grid](https://mui.com/x/migration/migration-data-grid-v6/)
+- [Date and Time Pickers](https://mui.com/x/migration/migration-pickers-v6/)
+- [Tree View](https://mui.com/x/migration/migration-tree-view-v6/)
+- [Charts](https://mui.com/x/migration/migration-charts-v6/)
+
+We'd like to offer a big thanks to the 12 contributors who made this release possible. Here are some highlights ✨:
+
+- 🚀 Improve the usage of custom `viewRenderers` on `DateTimePicker` (#12441) @LukasTy
+- ✨ Set focus on the focused Tree Item instead of the Tree View (#12226) @flaviendelangle
+- 🕹️ Support controlled `density` for the Data Grid (#12332) @MBilalShafi
+- 🎁 Dynamic virtualization range for the Data Grid (#12353) @romgrk
+- 🐞 Bugfixes
+- 📚 Documentation improvements
+
+### Data Grid
+
+#### Breaking changes
+
+- The `density` is a [controlled prop](https://mui.com/x/react-data-grid/accessibility/#set-the-density-programmatically) now, if you were previously passing the `density` prop to the Data Grid, you will need to do one of the following:
+
+  1. Move it to the `initialState.density` to initialize it.
+
+  ```diff
+   <DataGrid
+  -  density="compact"
+  +  initialState={{ density: "compact" }}
+   />
+  ```
+
+  2. Move it to the state and use `onDensityChange` callback to update the `density` prop accordingly for it to work as expected.
+
+  ```diff
+  + const [density, setDensity] = React.useState<GridDensity>('compact');
+   <DataGrid
+  -  density="compact"
+  +  density={density}
+  +  onDensityChange={(newDensity) => setDensity(newDensity)}
+   />
+  ```
+
+- The selector `gridDensityValueSelector` was removed, use the `gridDensitySelector` instead.
+
+- The props `rowBuffer` and `columnBuffer` were renamed to `rowBufferPx` and `columnBufferPx`.
+  Their value is now a pixel value rather than a number of items. Their default value is now `150`.
+
+- The props `rowThreshold` and `columnThreshold` have been removed.
+  If you had the `rowThreshold` prop set to `0` to force new rows to be rendered more often – this is no longer necessary.
+
+#### `@mui/x-data-grid@7.0.0`
+
+- [DataGrid] Allow to control the grid density (#12332) @MBilalShafi
+- [DataGrid] Dynamic virtualization range (#12353) @romgrk
+- [DataGrid] Fix `ElementType` usage (#12479) @cherniavskii
+- [DataGrid] Fix cell value formatting on copy (#12357) @sai6855
+- [DataGrid] Fix checkbox selection is keeping selection when filtering (#11751) @g1mishra
+- [DataGrid] Make `rows` an optional prop (#12478) @MBilalShafi
+
+#### `@mui/x-data-grid-pro@7.0.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@7.0.0`.
+
+#### `@mui/x-data-grid-premium@7.0.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@7.0.0`, plus:
+
+- [DataGridPremium] Add support for confirmation before clipboard paste (#12225) @cherniavskii
+- [DataGridPremium] Fix single grouping column sorting (#9679) @cherniavskii
+- [DataGridPremium] Fix boolean cell not rendered in group rows (#12492) @sai6855
+
+### Date and Time Pickers
+
+#### Breaking changes
+
+- The `DesktopDateTimePicker` view rendering has been optimized by using the same technique as for `DesktopDateTimeRangePicker`.
+  - The `dateTimeViewRenderers` have been removed in favor of reusing existing time view renderers (`renderTimeViewClock`, `renderDigitalClockTimeView` and `renderMultiSectionDigitalClockTimeView`) and date view renderer (`renderDateViewCalendar`).
+  - Passing `renderTimeViewClock` to time view renderers will no longer revert to the old behavior of rendering only date or time view.
+
+#### `@mui/x-date-pickers@7.0.0`
+
+- [fields] Allow to override the separator between the start and the end date in all range fields (#12174) @flaviendelangle
+- [fields] Support format without separator (#12489) @flaviendelangle
+- [pickers] Use renderer interceptor on `DesktopDateTimePicker` (#12441) @LukasTy
+
+#### `@mui/x-date-pickers-pro@7.0.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@7.0.0`, plus:
+
+- [DateTimeRangePicker] Add component `JSDoc` (#12518) @LukasTy
+- [DateTimeRangePicker] Fix views behavior regression (#12529) @LukasTy
+
+### Charts
+
+#### `@mui/x-charts@7.0.0`
+
+- [charts] Fix small typo in `CartesianContextProvider` (#12461) @Janpot
+
+### Tree View
+
+#### Breaking changes
+
+- The required `nodeId` prop used by the `TreeItem` has been renamed to `itemId` for consistency:
+
+```diff
+ <TreeView>
+-    <TreeItem label="Item 1" nodeId="one">
++    <TreeItem label="Item 1" itemId="one">
+ </TreeView>
+```
+
+- The focus is now applied to the Tree Item root element instead of the Tree View root element.
+
+  This change will allow new features that require the focus to be on the Tree Item,
+  like the drag and drop reordering of items.
+  It also solves several issues with focus management,
+  like the inability to scroll to the focused item when a lot of items are rendered.
+
+  This will mostly impact how you write tests to interact with the Tree View:
+
+  For example, if you were writing a test with `react-testing-library`, here is what the changes could look like:
+
+  ```diff
+   it('test example on first item', () => {
+  -  const { getByRole } = render(
+  +  const { getAllByRole } = render(
+       <SimpleTreeView>
+         <TreeItem nodeId="one" />
+         <TreeItem nodeId="two" />
+      </SimpleTreeView>
+     );
+
+  -  const tree = getByRole('tree');
+  +  const firstTreeItem = getAllByRole('treeitem')[0];
+     act(() => {
+  -    tree.focus();
+  +    firstTreeItem.focus();
+     });
+  -  fireEvent.keyDown(tree, { key: 'ArrowDown' });
+  +  fireEvent.keyDown(firstTreeItem, { key: 'ArrowDown' });
+   })
+  ```
+
+#### `@mui/x-tree-view@7.0.0`
+
+- [TreeView] Rename `nodeId` to `itemId` (#12418) @noraleonte
+- [TreeView] Set focus on the focused Tree Item instead of the Tree View (#12226) @flaviendelangle
+- [TreeView] Update JSDoc of the `ContentComponent` prop to avoid using the word "node" (#12476) @flaviendelangle
+
+### `@mui/x-codemod@7.0.0`
+
+- [codemod] Add a codemod and update the grid migration guide (#12488) @MBilalShafi
+
+### Docs
+
+- [docs] Finalize migration guide (#12501) @noraleonte
+- [docs] Fix nested cells alignment in the popular features demo (#12450) @cherniavskii
+- [docs] Fix some Vale errors (#12469) @oliviertassinari
+- [docs] Remove mentions of pre release (#12513) @noraleonte
+- [docs] Update branch name and tags (#12498) @cherniavskii
+- [docs] Update links to v6 (#12496) @cherniavskii
+- [docs] Update links to v7 docs (#12500) @noraleonte
+- [docs] Update supported versions (#12508) @joserodolfofreitas
+- [docs] Update "What's new in MUI X" page #12527 @cherniavskii
+
+### Core
+
+- [core] Bump `@mui/material` peer dependency for all packages (#12516) @LukasTy
+- [core] Fix `no-restricted-imports` ESLint rule not working for Data Grid packages (#12477) @cherniavskii
+- [core] Lower the frequency of `no-response` action runs (#12491) @michaldudak
+- [core] Remove leftover `legacy` `browserlistrc` entry (#12415) @LukasTy
+- [core] Update NPM tag (#12511) @cherniavskii
+- [core] Update supported browsers (browserlistrc) (#12521) @LukasTy
+- [core] Use Circle CI context @oliviertassinari
+- [license] Fix grammar on expired license error message (#12460) @joserodolfofreitas
+
 ## 7.0.0-beta.7
 
 _Mar 14, 2024_
@@ -324,7 +507,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`.
   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](/x/react-date-pickers/fields/#accessible-dom-structure).
 
- When building a custom UI, you are most-likely only supporting one DOM structure, so you can remove `enableAccessibleFieldDOMStructure` before it is passed to the DOM:
+  When building a custom UI, you are most-likely only supporting one DOM structure, so you can remove `enableAccessibleFieldDOMStructure` before it is passed to the DOM:
 
   ```diff
     function MyCustomTextField(props) {

diff --git a/package.json b/package.json
@@ -1,5 +1,5 @@
 {
-  "version": "7.0.0-beta.7",
+  "version": "7.0.0",
   "private": true,
   "scripts": {
     "start": "yarn && yarn docs:dev",

diff --git a/packages/x-charts/package.json b/packages/x-charts/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@mui/x-charts",
-  "version": "7.0.0-beta.7",
+  "version": "7.0.0",
   "description": "The community edition of the charts components (MUI X).",
   "author": "MUI Team",
   "main": "./src/index.js",

diff --git a/packages/x-codemod/package.json b/packages/x-codemod/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@mui/x-codemod",
-  "version": "7.0.0-beta.7",
+  "version": "7.0.0",
   "bin": "./codemod.js",
   "private": false,
   "author": "MUI Team",

diff --git a/packages/x-data-grid-generator/package.json b/packages/x-data-grid-generator/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@mui/x-data-grid-generator",
-  "version": "7.0.0-beta.7",
+  "version": "7.0.0",
   "description": "Generate fake data for demo purposes only.",
   "author": "MUI Team",
   "main": "src/index.ts",
@@ -34,7 +34,7 @@
   "dependencies": {
     "@babel/runtime": "^7.24.0",
     "@mui/base": "^5.0.0-beta.40",
-    "@mui/x-data-grid-premium": "7.0.0-beta.7",
+    "@mui/x-data-grid-premium": "7.0.0",
     "chance": "^1.1.11",
     "clsx": "^2.1.0",
     "lru-cache": "^7.18.3"

diff --git a/packages/x-data-grid-premium/package.json b/packages/x-data-grid-premium/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@mui/x-data-grid-premium",
-  "version": "7.0.0-beta.7",
+  "version": "7.0.0",
   "description": "The Premium plan edition of the data grid component (MUI X).",
   "author": "MUI Team",
   "main": "src/index.ts",
@@ -45,9 +45,9 @@
     "@babel/runtime": "^7.24.0",
     "@mui/system": "^5.15.14",
     "@mui/utils": "^5.15.14",
-    "@mui/x-data-grid": "7.0.0-beta.7",
-    "@mui/x-data-grid-pro": "7.0.0-beta.7",
-    "@mui/x-license": "7.0.0-beta.6",
+    "@mui/x-data-grid": "7.0.0",
+    "@mui/x-data-grid-pro": "7.0.0",
+    "@mui/x-license": "7.0.0",
     "@types/format-util": "^1.0.4",
     "clsx": "^2.1.0",
     "exceljs": "^4.4.0",

diff --git a/packages/x-data-grid-premium/src/tests/rowGrouping.DataGridPremium.test.tsx b/packages/x-data-grid-premium/src/tests/rowGrouping.DataGridPremium.test.tsx
@@ -172,7 +172,7 @@ describe('<DataGridPremium /> - Row grouping', () => {
             },
           }}
           columns={[...baselineProps.columns, { field: 'isFilled', type: 'boolean' }]}
-          rows={baselineProps.rows.map((row) => ({ ...row, isFilled: false }))}
+          rows={baselineProps.rows?.map((row) => ({ ...row, isFilled: false }))}
         />,
       );
 

diff --git a/packages/x-data-grid-pro/package.json b/packages/x-data-grid-pro/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@mui/x-data-grid-pro",
-  "version": "7.0.0-beta.7",
+  "version": "7.0.0",
   "description": "The Pro plan edition of the data grid component (MUI X).",
   "author": "MUI Team",
   "main": "src/index.ts",
@@ -45,8 +45,8 @@
     "@babel/runtime": "^7.24.0",
     "@mui/system": "^5.15.14",
     "@mui/utils": "^5.15.14",
-    "@mui/x-data-grid": "7.0.0-beta.7",
-    "@mui/x-license": "7.0.0-beta.6",
+    "@mui/x-data-grid": "7.0.0",
+    "@mui/x-license": "7.0.0",
     "@types/format-util": "^1.0.4",
     "clsx": "^2.1.0",
     "prop-types": "^15.8.1",

diff --git a/packages/x-data-grid/package.json b/packages/x-data-grid/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@mui/x-data-grid",
-  "version": "7.0.0-beta.7",
+  "version": "7.0.0",
   "description": "The community edition of the data grid component (MUI X).",
   "author": "MUI Team",
   "main": "src/index.ts",

diff --git a/packages/x-date-pickers-pro/package.json b/packages/x-date-pickers-pro/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@mui/x-date-pickers-pro",
-  "version": "7.0.0-beta.7",
+  "version": "7.0.0",
   "description": "The commercial edition of the date picker components (MUI X).",
   "author": "MUI Team",
   "main": "src/index.ts",
@@ -45,8 +45,8 @@
     "@mui/base": "^5.0.0-beta.40",
     "@mui/system": "^5.15.14",
     "@mui/utils": "^5.15.14",
-    "@mui/x-date-pickers": "7.0.0-beta.7",
-    "@mui/x-license": "7.0.0-beta.6",
+    "@mui/x-date-pickers": "7.0.0",
+    "@mui/x-license": "7.0.0",
     "clsx": "^2.1.0",
     "prop-types": "^15.8.1",
     "react-transition-group": "^4.4.5"

diff --git a/packages/x-date-pickers/package.json b/packages/x-date-pickers/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@mui/x-date-pickers",
-  "version": "7.0.0-beta.7",
+  "version": "7.0.0",
   "description": "The community edition of the date picker components (MUI X).",
   "author": "MUI Team",
   "main": "src/index.ts",

diff --git a/packages/x-license/package.json b/packages/x-license/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@mui/x-license",
-  "version": "7.0.0-beta.6",
+  "version": "7.0.0",
   "description": "MUI X License verification",
   "author": "MUI Team",
   "main": "src/index.ts",

diff --git a/packages/x-tree-view/package.json b/packages/x-tree-view/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@mui/x-tree-view",
-  "version": "7.0.0-beta.7",
+  "version": "7.0.0",
   "description": "The community edition of the tree view components (MUI X).",
   "author": "MUI Team",
   "main": "src/index.ts",