Skip to content

Commit 8b1b24f

Browse files
flaviendelangleflaviendelangle
authored
v5.0.0-beta.4 (#2865)
1 parent a8e2e3c commit 8b1b24f

File tree

11 files changed

+187
-15
lines changed

11 files changed

+187
-15
lines changed

‎CHANGELOG.md

+172
Original file line numberDiff line numberDiff line change
@@ -3,6 +3,178 @@
33
All notable changes to this project will be documented in this file.
44
See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
55

6+
## 5.0.0-beta.4
7+
8+
_Oct 14, 2021_
9+
10+
A big thanks to the 7 contributors who made this release possible. Here are some highlights ✨:
11+
12+
- 🎁 Add the ability to print the grid (#2519) @DanailH
13+
14+
This new feature adds a button to the toolbar to generate a printer-friendly layout. Check the [documentation](https://mui.com/components/data-grid/export/#print) about it.
15+
16+
- 💡 Enhance internal code structure
17+
- ✨ New slots for `row` and `cell` (#2753) @m4theushw
18+
- 📚 Documentation improvements
19+
- 🐞 Bugfixes
20+
21+
### `@mui/[email protected]` / `@mui/[email protected]`
22+
23+
#### Breaking changes
24+
25+
- [DataGrid] Remove unused event listeners and redundant DOM attributes on `GridCell` and `GridRow` (#2810) @m4theushw
26+
27+
The following props were removed. If you depend on them, use `componentsProps.row` and `componentsProps.cell` to pass custom props to the row or cell.
28+
29+
- `onCellBlur`
30+
- `onCellOver`
31+
- `onCellOut`
32+
- `onCellEnter`
33+
- `onCellLeave`
34+
- `onRowOver`
35+
- `onRowOut`
36+
- `onRowEnter`
37+
- `onRowLeave`
38+
39+
For more information, check [this page](https://mui.com/components/data-grid/components/#row). Example:
40+
41+
```diff
42+
-<DataGrid onRowOver={handleRowOver} />;
43+
+<DataGrid
44+
+ componentsProps={{
45+
+ row: { onMouseOver: handleRowOver },
46+
+ }}
47+
+/>;
48+
```
49+
50+
The `data-rowindex` and `data-rowselected` attributes were removed from the cell element. Equivalent attributes can be found in the row element.
51+
52+
The `data-editable` attribute was removed from the cell element. Use the `.MuiDataGrid-cell--editable` CSS class.
53+
54+
The `data-mode` attribute was removed from the cell element. Use the `.MuiDataGrid-cell--editing` CSS class.
55+
56+
- [DataGrid] The `state.filter` and `state.visibleRows` were merged into a single `state.filter` sub-state (#2782) @flaviendelangle
57+
58+
To still access this information, use `state.filter` or the selectors as below:
59+
60+
```diff
61+
-const filterModel = state.filter
62+
-const filterModel = gridFilterStateSelector(state)
63+
+const filterModel = state.filter.filterModel
64+
+const filterModel = gridFilterModelSelector(state) // preferred method
65+
66+
-const visibleRowsLookup = state.visibleRows.visibleRowsLookup
67+
-const visibleRowsLookup = visibleGridRowsStateSelector(state).visibleRowsLookup
68+
+const visibleRowsLookup = state.filter.visibleRowsLookup
69+
+const visibleRowsLookup = gridVisibleRowsLookupSelector(state).visibleRowsLookup // preferred method
70+
71+
-const visibleRows = state.visibleRows.visibleRows
72+
+const visibleRows = state.filter.visibleRows
73+
+const visibleRows = gridVisibleRowsLookupSelector(state).visibleRows // preferred method
74+
```
75+
76+
- [DataGrid] The CSS classes constants are not exported anymore. Use `gridClasses` instead. (#2788) @flaviendelangle
77+
78+
```diff
79+
-const columnHeaderClass = GRID_COLUMN_HEADER_CSS_CLASS
80+
+const columnHeaderClass = gridClasses.columnHeader
81+
82+
-const rowClass = GRID_ROW_CSS_CLASS
83+
+const rowClass = gridClasses.row
84+
85+
-const cellClass = GRID_CELL_CSS_CLASS
86+
+const cellClass = gridClasses.cell
87+
88+
-const columnSeparatorClass = GRID_COLUMN_HEADER_SEPARATOR_RESIZABLE_CSS_CLASS
89+
+const columnSeparatorClass = gridClasses['columnSeparator--resizable']
90+
91+
-const columnHeaderTitleClass = GRID_COLUMN_HEADER_TITLE_CSS_CLASS
92+
+const columnHeaderTitleClass = gridClasses.columnHeaderTitle
93+
94+
-const columnHeaderDropZoneClass = GRID_COLUMN_HEADER_DROP_ZONE_CSS_CLASS
95+
+const columnHeaderDropZoneClass = gridClasses.columnHeaderDropZone
96+
97+
-const columnHeaderDraggingClass = GRID_COLUMN_HEADER_DRAGGING_CSS_CLASS
98+
+const columnHeaderDraggingClass = gridClasses["columnHeader--dragging"]
99+
```
100+
101+
- [DataGrid] Rename `gridCheckboxSelectionColDef` to `GRID_CHECKBOX_SELECTION_COL_DEF` (#2793) @flaviendelangle
102+
103+
```diff
104+
- gridCheckboxSelectionColDef
105+
+ GRID_CHECKBOX_SELECTION_COL_DEF
106+
```
107+
108+
- [DataGrid] The constants referring to the column types were removed (#2791) @flaviendelangle
109+
Replace them as below:
110+
111+
```diff
112+
-const isColumnString = column.type === GRID_STRING_COLUMN_TYPE;
113+
+const isColumnString = col.type === 'string';
114+
115+
-const isColumnNumber = col.type === GRID_NUMBER_COLUMN_TYPE;
116+
+const isColumnNumber = col.type === 'number';
117+
118+
-const isColumnDate = col.type === GRID_DATE_COLUMN_TYPE;
119+
+const isColumnDate = col.type === 'date';
120+
121+
-const isColumnDateTime = col.type === GRID_DATETIME_COLUMN_TYPE;
122+
+const isColumnDateTime = col.type === 'dateTime';
123+
124+
-const isColumnBoolean = col.type === GRID_BOOLEAN_COLUMN_TYPE;
125+
+const isColumnBoolean = col.type === 'boolean';
126+
```
127+
128+
- [DataGrid] The state initializers were removed (#2782) @flaviendelangle
129+
130+
Use `getDefaultGridFilterModel` instead of `getInitialGridFilterState`:
131+
132+
```diff
133+
-const [filterModel, setFilterModel] = React.useState(getInitialGridFilterState);
134+
+const [filterModel, setFilterModel] = React.useState(getDefaultGridFilterModel);
135+
```
136+
137+
For the other methods, you can hardcode the value you want to apply:
138+
139+
```diff
140+
-const [sortModel, setSortModel] = React.useState(() => getInitialGridSortingState().sortModel);
141+
+const [sortModel, setSortModel] React.useState([]);
142+
143+
-getInitialGridColumnReorderState
144+
-getInitialGridColumnResizeState
145+
-getInitialGridColumnsState
146+
-getInitialGridRenderingState
147+
-getInitialGridRowState
148+
-getInitialGridState
149+
-getInitialVisibleGridRowsState
150+
-getInitialGridState
151+
```
152+
153+
#### Changes
154+
155+
- [DataGrid] Add `row` and `cell` component slots (#2753) @m4theushw
156+
- [DataGrid] Rename `gridCheckboxSelectionColDef` to `GRID_CHECKBOX_SELECTION_COL_DEF` (#2793) @flaviendelangle
157+
- [DataGrid] Clean hook folder structure and stop exporting internal hooks (#2789) @flaviendelangle
158+
- [DataGrid] Add support for Print export (#2519) @DanailH
159+
- [DataGrid] Remove internal localization and column type constant exports (#2791) @flaviendelangle
160+
- [DataGrid] Remove `GridRowCells` component (#2811) @m4theushw
161+
- [DataGrid] Remove class constants exports (#2788) @flaviendelangle
162+
- [DataGrid] Remove unused event listeners on `GridCell` and `GridRow` (#2810) @m4theushw
163+
- [DataGrid] Fix the header selection checkbox to work with `prop.checkboxSelectionVisibleOnly` (#2781) @flaviendelangle
164+
165+
### Docs
166+
167+
- [docs] Add link to installation page (#2778) @MostafaKMilly
168+
- [docs] Add redirect from docs home page to `DataGrid` home page (#2737) @flaviendelangle
169+
- [docs] Fix JSX closing tag in `getActions` example (#2847) @dstarner
170+
- [docs] Fix pagination in Ant Design demo (#2787) @ZeeshanTamboli
171+
- [docs] Update the `page` prop docs (#2812) @m4theushw
172+
173+
### Core
174+
175+
- [core] Update hooks to initialize their state synchronously (#2782) @flaviendelangle
176+
- [core] Fix rollup external warnings (#2736) @eps1lon
177+
6178
## 5.0.0-beta.3
7179

8180
_Oct 7, 2021_

‎benchmark/package.json

+1-1
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
{
22
"name": "benchmark",
3-
"version": "5.0.0-beta.3",
3+
"version": "5.0.0-beta.4",
44
"private": true,
55
"scripts": {
66
"browser": "webpack --config browser/webpack.config.js && node browser/scripts/benchmark.js"

‎docs/package.json

+1-1
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
{
22
"name": "docs",
3-
"version": "5.0.0-beta.3",
3+
"version": "5.0.0-beta.4",
44
"private": true,
55
"author": "MUI Team",
66
"license": "MIT",

‎lerna.json

+1-1
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
{
2-
"version": "5.0.0-beta.3",
2+
"version": "5.0.0-beta.4",
33
"npmClient": "yarn",
44
"useWorkspaces": true
55
}

‎package.json

+1-1
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
{
2-
"version": "5.0.0-beta.3",
2+
"version": "5.0.0-beta.4",
33
"private": true,
44
"scripts": {
55
"start": "yarn docs:dev",

‎packages/eslint-plugin-material-ui/package.json

+1-1
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
{
22
"name": "eslint-plugin-material-ui",
3-
"version": "5.0.0-beta.3",
3+
"version": "5.0.0-beta.4",
44
"private": true,
55
"description": "Custom eslint rules for MUI.",
66
"main": "src/index.js",

‎packages/grid/data-grid/package.json

+1-1
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
{
22
"name": "@mui/x-data-grid",
3-
"version": "5.0.0-beta.3",
3+
"version": "5.0.0-beta.4",
44
"description": "The community edition of the data grid component (MUI X).",
55
"author": "MUI Team",
66
"main": "build/index-cjs.js",

‎packages/grid/x-grid-data-generator/package.json

+1-1
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
{
22
"name": "@mui/x-data-grid-generator",
3-
"version": "5.0.0-beta.3",
3+
"version": "5.0.0-beta.4",
44
"description": "Generate fake data for demo purposes only.",
55
"author": "MUI Team",
66
"main": "cjs/index.js",

‎packages/grid/x-grid/package.json

+2-2
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
{
22
"name": "@mui/x-data-grid-pro",
3-
"version": "5.0.0-beta.3",
3+
"version": "5.0.0-beta.4",
44
"description": "The commercial edition of the data grid component (MUI X).",
55
"author": "MUI Team",
66
"main": "build/index-cjs.js",
@@ -38,7 +38,7 @@
3838
},
3939
"dependencies": {
4040
"@mui/utils": "^5.0.1",
41-
"@mui/x-license-pro": "5.0.0-beta.3",
41+
"@mui/x-license-pro": "5.0.0-beta.4",
4242
"clsx": "^1.0.4",
4343
"prop-types": "^15.7.2",
4444
"reselect": "^4.0.0"

‎packages/storybook/package.json

+5-5
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
{
22
"name": "storybook",
3-
"version": "5.0.0-beta.3",
3+
"version": "5.0.0-beta.4",
44
"description": "Storybook components",
55
"author": "MUI Team",
66
"private": true,
@@ -19,10 +19,10 @@
1919
"@mui/icons-material": "^5.0.3",
2020
"@mui/material": "^5.0.2",
2121
"@mui/styles": "^5.0.1",
22-
"@mui/x-data-grid": "5.0.0-beta.3",
23-
"@mui/x-data-grid-generator": "5.0.0-beta.3",
24-
"@mui/x-data-grid-pro": "5.0.0-beta.3",
25-
"@mui/x-license-pro": "5.0.0-beta.3",
22+
"@mui/x-data-grid": "5.0.0-beta.4",
23+
"@mui/x-data-grid-generator": "5.0.0-beta.4",
24+
"@mui/x-data-grid-pro": "5.0.0-beta.4",
25+
"@mui/x-license-pro": "5.0.0-beta.4",
2626
"@storybook/builder-webpack5": "^6.4.0-beta.7",
2727
"@storybook/manager-webpack5": "^6.4.0-beta.7",
2828
"react": "^17.0.2",

‎packages/x-license/package.json

+1-1
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
{
22
"name": "@mui/x-license-pro",
3-
"version": "5.0.0-beta.3",
3+
"version": "5.0.0-beta.4",
44
"description": "MUI X License verification",
55
"author": "MUI Team",
66
"main": "build/cjs/index.js",

0 commit comments

Comments
 (0)