@mui/x-tree-view 7.0.0-beta.7 → 7.1.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +266 -12
- package/README.md +1 -1
- package/RichTreeView/RichTreeView.js +15 -17
- package/RichTreeView/RichTreeView.types.d.ts +1 -1
- package/SimpleTreeView/SimpleTreeView.js +3 -4
- package/SimpleTreeView/SimpleTreeView.plugins.d.ts +1 -1
- package/SimpleTreeView/SimpleTreeView.plugins.js +2 -2
- package/TreeItem/TreeItem.js +43 -35
- package/TreeItem/TreeItem.types.d.ts +3 -3
- package/TreeItem/TreeItemContent.d.ts +7 -7
- package/TreeItem/TreeItemContent.js +10 -10
- package/TreeItem/treeItemClasses.d.ts +1 -1
- package/TreeItem/useTreeItemState.d.ts +1 -1
- package/TreeItem/useTreeItemState.js +13 -13
- package/TreeItem2/TreeItem2.js +16 -17
- package/TreeItem2Icon/TreeItem2Icon.js +5 -6
- package/TreeItem2Icon/TreeItem2Icon.types.d.ts +4 -4
- package/TreeItem2Provider/TreeItem2Provider.js +3 -3
- package/TreeItem2Provider/TreeItem2Provider.types.d.ts +1 -1
- package/TreeView/TreeView.d.ts +1 -1
- package/TreeView/TreeView.js +1 -1
- package/hooks/useTreeItem2Utils/useTreeItem2Utils.d.ts +2 -2
- package/hooks/useTreeItem2Utils/useTreeItem2Utils.js +12 -12
- package/hooks/useTreeViewApiRef.d.ts +1 -1
- package/index.js +1 -1
- package/internals/TreeViewProvider/DescendantProvider.d.ts +1 -1
- package/internals/TreeViewProvider/DescendantProvider.js +1 -1
- package/internals/hooks/useInstanceEventHandler.js +5 -10
- package/internals/index.d.ts +2 -2
- package/internals/models/plugin.d.ts +1 -1
- package/internals/plugins/defaultPlugins.d.ts +3 -3
- package/internals/plugins/defaultPlugins.js +2 -2
- package/internals/plugins/useTreeViewExpansion/useTreeViewExpansion.js +17 -24
- package/internals/plugins/useTreeViewExpansion/useTreeViewExpansion.types.d.ts +6 -6
- package/internals/plugins/useTreeViewFocus/useTreeViewFocus.js +76 -58
- package/internals/plugins/useTreeViewFocus/useTreeViewFocus.types.d.ts +9 -8
- package/internals/plugins/useTreeViewIcons/useTreeViewIcons.types.d.ts +6 -6
- package/internals/plugins/useTreeViewId/useTreeViewId.js +1 -1
- package/internals/plugins/useTreeViewId/useTreeViewId.types.d.ts +2 -2
- package/internals/plugins/useTreeViewItems/index.d.ts +2 -0
- package/internals/plugins/useTreeViewItems/index.js +1 -0
- package/internals/plugins/useTreeViewItems/useTreeViewItems.d.ts +3 -0
- package/{modern/internals/plugins/useTreeViewNodes/useTreeViewNodes.js → internals/plugins/useTreeViewItems/useTreeViewItems.js} +42 -33
- package/internals/plugins/useTreeViewItems/useTreeViewItems.types.d.ts +99 -0
- package/internals/plugins/useTreeViewJSXItems/index.d.ts +2 -0
- package/internals/plugins/useTreeViewJSXItems/index.js +1 -0
- package/internals/plugins/useTreeViewJSXItems/useTreeViewJSXItems.d.ts +3 -0
- package/{modern/internals/plugins/useTreeViewJSXNodes/useTreeViewJSXNodes.js → internals/plugins/useTreeViewJSXItems/useTreeViewJSXItems.js} +41 -40
- package/internals/plugins/useTreeViewJSXItems/useTreeViewJSXItems.types.d.ts +18 -0
- package/internals/plugins/useTreeViewKeyboardNavigation/useTreeViewKeyboardNavigation.js +85 -96
- package/internals/plugins/useTreeViewKeyboardNavigation/useTreeViewKeyboardNavigation.types.d.ts +6 -3
- package/internals/plugins/useTreeViewSelection/useTreeViewSelection.js +44 -47
- package/internals/plugins/useTreeViewSelection/useTreeViewSelection.types.d.ts +8 -8
- package/internals/plugins/useTreeViewSelection/useTreeViewSelection.utils.d.ts +7 -7
- package/internals/plugins/useTreeViewSelection/useTreeViewSelection.utils.js +5 -5
- package/internals/useTreeView/useTreeView.js +5 -6
- package/internals/useTreeView/useTreeView.utils.d.ts +5 -5
- package/internals/useTreeView/useTreeView.utils.js +18 -18
- package/internals/utils/extractPluginParamsFromProps.js +2 -2
- package/internals/utils/utils.js +1 -0
- package/modern/RichTreeView/RichTreeView.js +11 -11
- package/modern/SimpleTreeView/SimpleTreeView.js +1 -1
- package/modern/SimpleTreeView/SimpleTreeView.plugins.js +2 -2
- package/modern/TreeItem/TreeItem.js +31 -22
- package/modern/TreeItem/TreeItemContent.js +10 -10
- package/modern/TreeItem/useTreeItemState.js +13 -13
- package/modern/TreeItem2/TreeItem2.js +11 -11
- package/modern/TreeItem2Provider/TreeItem2Provider.js +3 -3
- package/modern/TreeView/TreeView.js +1 -1
- package/modern/hooks/useTreeItem2Utils/useTreeItem2Utils.js +12 -12
- package/modern/index.js +1 -1
- package/modern/internals/TreeViewProvider/DescendantProvider.js +1 -1
- package/modern/internals/plugins/defaultPlugins.js +2 -2
- package/modern/internals/plugins/useTreeViewExpansion/useTreeViewExpansion.js +14 -14
- package/modern/internals/plugins/useTreeViewFocus/useTreeViewFocus.js +74 -53
- package/modern/internals/plugins/useTreeViewId/useTreeViewId.js +1 -1
- package/modern/internals/plugins/useTreeViewItems/index.js +1 -0
- package/{internals/plugins/useTreeViewNodes/useTreeViewNodes.js → modern/internals/plugins/useTreeViewItems/useTreeViewItems.js} +46 -41
- package/modern/internals/plugins/useTreeViewJSXItems/index.js +1 -0
- package/{internals/plugins/useTreeViewJSXNodes/useTreeViewJSXNodes.js → modern/internals/plugins/useTreeViewJSXItems/useTreeViewJSXItems.js} +41 -41
- package/modern/internals/plugins/useTreeViewKeyboardNavigation/useTreeViewKeyboardNavigation.js +85 -94
- package/modern/internals/plugins/useTreeViewSelection/useTreeViewSelection.js +40 -40
- package/modern/internals/plugins/useTreeViewSelection/useTreeViewSelection.utils.js +5 -5
- package/modern/internals/useTreeView/useTreeView.js +3 -4
- package/modern/internals/useTreeView/useTreeView.utils.js +18 -18
- package/modern/internals/utils/utils.js +1 -0
- package/modern/useTreeItem2/useTreeItem2.js +23 -12
- package/node/RichTreeView/RichTreeView.js +11 -11
- package/node/SimpleTreeView/SimpleTreeView.js +1 -1
- package/node/SimpleTreeView/SimpleTreeView.plugins.js +2 -2
- package/node/TreeItem/TreeItem.js +31 -22
- package/node/TreeItem/TreeItemContent.js +10 -10
- package/node/TreeItem/useTreeItemState.js +13 -13
- package/node/TreeItem2/TreeItem2.js +11 -11
- package/node/TreeItem2Provider/TreeItem2Provider.js +3 -3
- package/node/TreeView/TreeView.js +1 -1
- package/node/hooks/useTreeItem2Utils/useTreeItem2Utils.js +12 -12
- package/node/index.js +1 -1
- package/node/internals/TreeViewProvider/DescendantProvider.js +1 -1
- package/node/internals/plugins/defaultPlugins.js +2 -2
- package/node/internals/plugins/useTreeViewExpansion/useTreeViewExpansion.js +14 -14
- package/node/internals/plugins/useTreeViewFocus/useTreeViewFocus.js +74 -53
- package/node/internals/plugins/useTreeViewId/useTreeViewId.js +1 -1
- package/node/internals/plugins/useTreeViewItems/index.js +12 -0
- package/node/internals/plugins/{useTreeViewNodes/useTreeViewNodes.js → useTreeViewItems/useTreeViewItems.js} +44 -35
- package/node/internals/plugins/useTreeViewJSXItems/index.js +12 -0
- package/node/internals/plugins/{useTreeViewJSXNodes/useTreeViewJSXNodes.js → useTreeViewJSXItems/useTreeViewJSXItems.js} +43 -42
- package/node/internals/plugins/useTreeViewKeyboardNavigation/useTreeViewKeyboardNavigation.js +84 -93
- package/node/internals/plugins/useTreeViewSelection/useTreeViewSelection.js +39 -39
- package/node/internals/plugins/useTreeViewSelection/useTreeViewSelection.utils.js +5 -5
- package/node/internals/useTreeView/useTreeView.js +3 -4
- package/node/internals/useTreeView/useTreeView.utils.js +23 -23
- package/node/internals/utils/utils.js +1 -0
- package/node/useTreeItem2/useTreeItem2.js +23 -12
- package/package.json +5 -5
- package/useTreeItem2/useTreeItem2.d.ts +1 -1
- package/useTreeItem2/useTreeItem2.js +26 -18
- package/useTreeItem2/useTreeItem2.types.d.ts +9 -7
- package/internals/plugins/useTreeViewJSXNodes/index.d.ts +0 -2
- package/internals/plugins/useTreeViewJSXNodes/index.js +0 -1
- package/internals/plugins/useTreeViewJSXNodes/useTreeViewJSXNodes.d.ts +0 -3
- package/internals/plugins/useTreeViewJSXNodes/useTreeViewJSXNodes.types.d.ts +0 -18
- package/internals/plugins/useTreeViewNodes/index.d.ts +0 -2
- package/internals/plugins/useTreeViewNodes/index.js +0 -1
- package/internals/plugins/useTreeViewNodes/useTreeViewNodes.d.ts +0 -3
- package/internals/plugins/useTreeViewNodes/useTreeViewNodes.types.d.ts +0 -88
- package/modern/internals/plugins/useTreeViewJSXNodes/index.js +0 -1
- package/modern/internals/plugins/useTreeViewNodes/index.js +0 -1
- package/node/internals/plugins/useTreeViewJSXNodes/index.js +0 -12
- package/node/internals/plugins/useTreeViewNodes/index.js +0 -12
- /package/internals/plugins/{useTreeViewJSXNodes/useTreeViewJSXNodes.types.js → useTreeViewItems/useTreeViewItems.types.js} +0 -0
- /package/internals/plugins/{useTreeViewNodes/useTreeViewNodes.types.js → useTreeViewJSXItems/useTreeViewJSXItems.types.js} +0 -0
- /package/modern/internals/plugins/{useTreeViewJSXNodes/useTreeViewJSXNodes.types.js → useTreeViewItems/useTreeViewItems.types.js} +0 -0
- /package/modern/internals/plugins/{useTreeViewNodes/useTreeViewNodes.types.js → useTreeViewJSXItems/useTreeViewJSXItems.types.js} +0 -0
- /package/node/internals/plugins/{useTreeViewJSXNodes/useTreeViewJSXNodes.types.js → useTreeViewItems/useTreeViewItems.types.js} +0 -0
- /package/node/internals/plugins/{useTreeViewNodes/useTreeViewNodes.types.js → useTreeViewJSXItems/useTreeViewJSXItems.types.js} +0 -0
package/CHANGELOG.md
CHANGED
|
@@ -3,6 +3,260 @@
|
|
|
3
3
|
All notable changes to this project will be documented in this file.
|
|
4
4
|
See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
|
|
5
5
|
|
|
6
|
+
## 7.1.0
|
|
7
|
+
|
|
8
|
+
_Mar 28, 2024_
|
|
9
|
+
|
|
10
|
+
We'd like to offer a big thanks to the 10 contributors who made this release possible. Here are some highlights ✨:
|
|
11
|
+
|
|
12
|
+
- 🚀 Add `resizeThrottleMs` prop (#12556) @romgrk
|
|
13
|
+
- 🌍 Improve Chinese (Hong Kong) (zh-HK) and Italian (it-IT) locale on the Pickers
|
|
14
|
+
- 🐞 Bugfixes
|
|
15
|
+
- 📚 Documentation improvements
|
|
16
|
+
|
|
17
|
+
### Data Grid
|
|
18
|
+
|
|
19
|
+
#### `@mui/x-data-grid@7.1.0`
|
|
20
|
+
|
|
21
|
+
- [DataGrid] Add `resizeThrottleMs` prop (#12556) @romgrk
|
|
22
|
+
- [DataGrid] Do not publish `rowEditStop` event if row has fields with errors (#11383) @cherniavskii
|
|
23
|
+
- [DataGrid] Fix bug in suspense (#12553) @romgrk
|
|
24
|
+
- [DataGrid] Fix missing class name in the `GridToolbarQuickFilter` component (#12484) @jhawkins11
|
|
25
|
+
|
|
26
|
+
#### `@mui/x-data-grid-pro@7.1.0` [](https://mui.com/r/x-pro-svg-link 'Pro plan')
|
|
27
|
+
|
|
28
|
+
Same changes as in `@mui/x-data-grid@7.1.0`.
|
|
29
|
+
|
|
30
|
+
#### `@mui/x-data-grid-premium@7.1.0` [](https://mui.com/r/x-premium-svg-link 'Premium plan')
|
|
31
|
+
|
|
32
|
+
Same changes as in `@mui/x-data-grid-pro@7.1.0`.
|
|
33
|
+
|
|
34
|
+
### Date and Time Pickers
|
|
35
|
+
|
|
36
|
+
#### `@mui/x-date-pickers@7.1.0`
|
|
37
|
+
|
|
38
|
+
- [fields] Fix placeholder override (#12589) @flaviendelangle
|
|
39
|
+
- [l10n] Improve Chinese (Hong Kong) (zh-HK) locale (#12547) @samchiu90
|
|
40
|
+
- [l10n] Improve Italian (it-IT) locale (#12549) @antomanc
|
|
41
|
+
- [pickers] Prepare compatibility with `@mui/zero-runtime` (stop using `ownerState` in `styled`) (#12003) @flaviendelangle
|
|
42
|
+
|
|
43
|
+
#### `@mui/x-date-pickers-pro@7.1.0` [](https://mui.com/r/x-pro-svg-link 'Pro plan')
|
|
44
|
+
|
|
45
|
+
Same changes as in `@mui/x-date-pickers@7.1.0`, plus:
|
|
46
|
+
|
|
47
|
+
- [DateRangePicker] Fix selection behavior with single input field when `readOnly` (#12593) @LukasTy
|
|
48
|
+
|
|
49
|
+
### Charts
|
|
50
|
+
|
|
51
|
+
#### `@mui/x-charts@7.1.0`
|
|
52
|
+
|
|
53
|
+
- [charts] Fix tooltip causing crash on data change (#12571) @Rishi556
|
|
54
|
+
|
|
55
|
+
### Tree View
|
|
56
|
+
|
|
57
|
+
#### `@mui/x-tree-view@7.1.0`
|
|
58
|
+
|
|
59
|
+
- [TreeView] Do not use outdated version of the state to compute new label first char in `RichTreeView` (#12512) @flaviendelangle
|
|
60
|
+
|
|
61
|
+
### Docs
|
|
62
|
+
|
|
63
|
+
- [docs] Add example to add a second icon next to the field's opening button (#12524) @flaviendelangle
|
|
64
|
+
- [docs] Add missing note to Data Grid migration guide (#12557) @romgrk
|
|
65
|
+
- [docs] Fix Charts title for SEO (#12545) @oliviertassinari
|
|
66
|
+
- [docs] Fix small typo (#12558) @diogoparente
|
|
67
|
+
- [docs] Improve codemod related documentation (#12582) @MBilalShafi
|
|
68
|
+
- [docs] Reduce noise in migration docs side navigation (#12552) @cherniavskii
|
|
69
|
+
- [docs] Sync static images from core repository (#12525) @LukasTy
|
|
70
|
+
|
|
71
|
+
### Core
|
|
72
|
+
|
|
73
|
+
- [core] Fix `l10n` script on Windows (#12550) @LukasTy
|
|
74
|
+
- [core] Include `DateTimeRangePicker` tag in `releaseChangelog` (#12526) @LukasTy
|
|
75
|
+
- [core] Upgrade monorepo (#12536) @cherniavskii
|
|
76
|
+
|
|
77
|
+
## v7.0.0
|
|
78
|
+
|
|
79
|
+
_Mar 22, 2024_
|
|
80
|
+
|
|
81
|
+
We're excited to [announce the first v7 stable release](https://mui.com/blog/mui-x-v7/)! 🎉🚀
|
|
82
|
+
|
|
83
|
+
This is now the officially supported major version, where we'll keep rolling out new features, bug fixes, and improvements.
|
|
84
|
+
Migration guides are available with a complete list of the breaking changes:
|
|
85
|
+
|
|
86
|
+
- [Data Grid](https://mui.com/x/migration/migration-data-grid-v6/)
|
|
87
|
+
- [Date and Time Pickers](https://mui.com/x/migration/migration-pickers-v6/)
|
|
88
|
+
- [Tree View](https://mui.com/x/migration/migration-tree-view-v6/)
|
|
89
|
+
- [Charts](https://mui.com/x/migration/migration-charts-v6/)
|
|
90
|
+
|
|
91
|
+
We'd like to offer a big thanks to the 12 contributors who made this release possible. Here are some highlights ✨:
|
|
92
|
+
|
|
93
|
+
- 🚀 Improve the usage of custom `viewRenderers` on `DateTimePicker` (#12441) @LukasTy
|
|
94
|
+
- ✨ Set focus on the focused Tree Item instead of the Tree View (#12226) @flaviendelangle
|
|
95
|
+
- 🕹️ Support controlled `density` for the Data Grid (#12332) @MBilalShafi
|
|
96
|
+
- 🎁 Dynamic virtualization range for the Data Grid (#12353) @romgrk
|
|
97
|
+
- 🐞 Bugfixes
|
|
98
|
+
- 📚 Documentation improvements
|
|
99
|
+
|
|
100
|
+
### Data Grid
|
|
101
|
+
|
|
102
|
+
#### Breaking changes
|
|
103
|
+
|
|
104
|
+
- 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:
|
|
105
|
+
|
|
106
|
+
1. Move it to the `initialState.density` to initialize it.
|
|
107
|
+
|
|
108
|
+
```diff
|
|
109
|
+
<DataGrid
|
|
110
|
+
- density="compact"
|
|
111
|
+
+ initialState={{ density: "compact" }}
|
|
112
|
+
/>
|
|
113
|
+
```
|
|
114
|
+
|
|
115
|
+
2. Move it to the state and use `onDensityChange` callback to update the `density` prop accordingly for it to work as expected.
|
|
116
|
+
|
|
117
|
+
```diff
|
|
118
|
+
+ const [density, setDensity] = React.useState<GridDensity>('compact');
|
|
119
|
+
<DataGrid
|
|
120
|
+
- density="compact"
|
|
121
|
+
+ density={density}
|
|
122
|
+
+ onDensityChange={(newDensity) => setDensity(newDensity)}
|
|
123
|
+
/>
|
|
124
|
+
```
|
|
125
|
+
|
|
126
|
+
- The selector `gridDensityValueSelector` was removed, use the `gridDensitySelector` instead.
|
|
127
|
+
|
|
128
|
+
- The props `rowBuffer` and `columnBuffer` were renamed to `rowBufferPx` and `columnBufferPx`.
|
|
129
|
+
Their value is now a pixel value rather than a number of items. Their default value is now `150`.
|
|
130
|
+
|
|
131
|
+
- The props `rowThreshold` and `columnThreshold` have been removed.
|
|
132
|
+
If you had the `rowThreshold` prop set to `0` to force new rows to be rendered more often – this is no longer necessary.
|
|
133
|
+
|
|
134
|
+
#### `@mui/x-data-grid@7.0.0`
|
|
135
|
+
|
|
136
|
+
- [DataGrid] Allow to control the grid density (#12332) @MBilalShafi
|
|
137
|
+
- [DataGrid] Dynamic virtualization range (#12353) @romgrk
|
|
138
|
+
- [DataGrid] Fix `ElementType` usage (#12479) @cherniavskii
|
|
139
|
+
- [DataGrid] Fix cell value formatting on copy (#12357) @sai6855
|
|
140
|
+
- [DataGrid] Fix checkbox selection is keeping selection when filtering (#11751) @g1mishra
|
|
141
|
+
- [DataGrid] Make `rows` an optional prop (#12478) @MBilalShafi
|
|
142
|
+
|
|
143
|
+
#### `@mui/x-data-grid-pro@7.0.0` [](https://mui.com/r/x-pro-svg-link 'Pro plan')
|
|
144
|
+
|
|
145
|
+
Same changes as in `@mui/x-data-grid@7.0.0`.
|
|
146
|
+
|
|
147
|
+
#### `@mui/x-data-grid-premium@7.0.0` [](https://mui.com/r/x-premium-svg-link 'Premium plan')
|
|
148
|
+
|
|
149
|
+
Same changes as in `@mui/x-data-grid-pro@7.0.0`, plus:
|
|
150
|
+
|
|
151
|
+
- [DataGridPremium] Add support for confirmation before clipboard paste (#12225) @cherniavskii
|
|
152
|
+
- [DataGridPremium] Fix single grouping column sorting (#9679) @cherniavskii
|
|
153
|
+
- [DataGridPremium] Fix boolean cell not rendered in group rows (#12492) @sai6855
|
|
154
|
+
|
|
155
|
+
### Date and Time Pickers
|
|
156
|
+
|
|
157
|
+
#### Breaking changes
|
|
158
|
+
|
|
159
|
+
- The `DesktopDateTimePicker` view rendering has been optimized by using the same technique as for `DesktopDateTimeRangePicker`.
|
|
160
|
+
- The `dateTimeViewRenderers` have been removed in favor of reusing existing time view renderers (`renderTimeViewClock`, `renderDigitalClockTimeView` and `renderMultiSectionDigitalClockTimeView`) and date view renderer (`renderDateViewCalendar`).
|
|
161
|
+
- Passing `renderTimeViewClock` to time view renderers will no longer revert to the old behavior of rendering only date or time view.
|
|
162
|
+
|
|
163
|
+
#### `@mui/x-date-pickers@7.0.0`
|
|
164
|
+
|
|
165
|
+
- [fields] Allow to override the separator between the start and the end date in all range fields (#12174) @flaviendelangle
|
|
166
|
+
- [fields] Support format without separator (#12489) @flaviendelangle
|
|
167
|
+
- [pickers] Use renderer interceptor on `DesktopDateTimePicker` (#12441) @LukasTy
|
|
168
|
+
|
|
169
|
+
#### `@mui/x-date-pickers-pro@7.0.0` [](https://mui.com/r/x-pro-svg-link 'Pro plan')
|
|
170
|
+
|
|
171
|
+
Same changes as in `@mui/x-date-pickers@7.0.0`, plus:
|
|
172
|
+
|
|
173
|
+
- [DateTimeRangePicker] Add component `JSDoc` (#12518) @LukasTy
|
|
174
|
+
- [DateTimeRangePicker] Fix views behavior regression (#12529) @LukasTy
|
|
175
|
+
|
|
176
|
+
### Charts
|
|
177
|
+
|
|
178
|
+
#### `@mui/x-charts@7.0.0`
|
|
179
|
+
|
|
180
|
+
- [charts] Fix small typo in `CartesianContextProvider` (#12461) @Janpot
|
|
181
|
+
|
|
182
|
+
### Tree View
|
|
183
|
+
|
|
184
|
+
#### Breaking changes
|
|
185
|
+
|
|
186
|
+
- The required `nodeId` prop used by the `TreeItem` has been renamed to `itemId` for consistency:
|
|
187
|
+
|
|
188
|
+
```diff
|
|
189
|
+
<TreeView>
|
|
190
|
+
- <TreeItem label="Item 1" nodeId="one">
|
|
191
|
+
+ <TreeItem label="Item 1" itemId="one">
|
|
192
|
+
</TreeView>
|
|
193
|
+
```
|
|
194
|
+
|
|
195
|
+
- The focus is now applied to the Tree Item root element instead of the Tree View root element.
|
|
196
|
+
|
|
197
|
+
This change will allow new features that require the focus to be on the Tree Item,
|
|
198
|
+
like the drag and drop reordering of items.
|
|
199
|
+
It also solves several issues with focus management,
|
|
200
|
+
like the inability to scroll to the focused item when a lot of items are rendered.
|
|
201
|
+
|
|
202
|
+
This will mostly impact how you write tests to interact with the Tree View:
|
|
203
|
+
|
|
204
|
+
For example, if you were writing a test with `react-testing-library`, here is what the changes could look like:
|
|
205
|
+
|
|
206
|
+
```diff
|
|
207
|
+
it('test example on first item', () => {
|
|
208
|
+
- const { getByRole } = render(
|
|
209
|
+
+ const { getAllByRole } = render(
|
|
210
|
+
<SimpleTreeView>
|
|
211
|
+
<TreeItem nodeId="one" />
|
|
212
|
+
<TreeItem nodeId="two" />
|
|
213
|
+
</SimpleTreeView>
|
|
214
|
+
);
|
|
215
|
+
|
|
216
|
+
- const tree = getByRole('tree');
|
|
217
|
+
+ const firstTreeItem = getAllByRole('treeitem')[0];
|
|
218
|
+
act(() => {
|
|
219
|
+
- tree.focus();
|
|
220
|
+
+ firstTreeItem.focus();
|
|
221
|
+
});
|
|
222
|
+
- fireEvent.keyDown(tree, { key: 'ArrowDown' });
|
|
223
|
+
+ fireEvent.keyDown(firstTreeItem, { key: 'ArrowDown' });
|
|
224
|
+
})
|
|
225
|
+
```
|
|
226
|
+
|
|
227
|
+
#### `@mui/x-tree-view@7.0.0`
|
|
228
|
+
|
|
229
|
+
- [TreeView] Rename `nodeId` to `itemId` (#12418) @noraleonte
|
|
230
|
+
- [TreeView] Set focus on the focused Tree Item instead of the Tree View (#12226) @flaviendelangle
|
|
231
|
+
- [TreeView] Update JSDoc of the `ContentComponent` prop to avoid using the word "node" (#12476) @flaviendelangle
|
|
232
|
+
|
|
233
|
+
### `@mui/x-codemod@7.0.0`
|
|
234
|
+
|
|
235
|
+
- [codemod] Add a codemod and update the grid migration guide (#12488) @MBilalShafi
|
|
236
|
+
|
|
237
|
+
### Docs
|
|
238
|
+
|
|
239
|
+
- [docs] Finalize migration guide (#12501) @noraleonte
|
|
240
|
+
- [docs] Fix nested cells alignment in the popular features demo (#12450) @cherniavskii
|
|
241
|
+
- [docs] Fix some Vale errors (#12469) @oliviertassinari
|
|
242
|
+
- [docs] Remove mentions of pre release (#12513) @noraleonte
|
|
243
|
+
- [docs] Update branch name and tags (#12498) @cherniavskii
|
|
244
|
+
- [docs] Update links to v6 (#12496) @cherniavskii
|
|
245
|
+
- [docs] Update links to v7 docs (#12500) @noraleonte
|
|
246
|
+
- [docs] Update supported versions (#12508) @joserodolfofreitas
|
|
247
|
+
- [docs] Update "What's new in MUI X" page #12527 @cherniavskii
|
|
248
|
+
|
|
249
|
+
### Core
|
|
250
|
+
|
|
251
|
+
- [core] Bump `@mui/material` peer dependency for all packages (#12516) @LukasTy
|
|
252
|
+
- [core] Fix `no-restricted-imports` ESLint rule not working for Data Grid packages (#12477) @cherniavskii
|
|
253
|
+
- [core] Lower the frequency of `no-response` action runs (#12491) @michaldudak
|
|
254
|
+
- [core] Remove leftover `legacy` `browserlistrc` entry (#12415) @LukasTy
|
|
255
|
+
- [core] Update NPM tag (#12511) @cherniavskii
|
|
256
|
+
- [core] Update supported browsers (browserlistrc) (#12521) @LukasTy
|
|
257
|
+
- [core] Use Circle CI context @oliviertassinari
|
|
258
|
+
- [license] Fix grammar on expired license error message (#12460) @joserodolfofreitas
|
|
259
|
+
|
|
6
260
|
## 7.0.0-beta.7
|
|
7
261
|
|
|
8
262
|
_Mar 14, 2024_
|
|
@@ -90,7 +344,7 @@ The `onNodeFocus` callback has been renamed to `onItemFocus` for consistency:
|
|
|
90
344
|
- [docs] Add `legacy` bundle drop mention in migration pages (#12424) @LukasTy
|
|
91
345
|
- [docs] Add missing luxon `Info` import (#12427) @LukasTy
|
|
92
346
|
- [docs] Improve slots definitions for charts (#12408) @alexfauquette
|
|
93
|
-
- [docs] Polish What's new in MUI
|
|
347
|
+
- [docs] Polish What's new in MUI X blog titles (#12309) @oliviertassinari
|
|
94
348
|
- [docs] Replace `rel="noreferrer"` by `rel="noopener"` @oliviertassinari
|
|
95
349
|
- [docs] Update `date-fns` `weekStarsOn` overriding example (#12416) @LukasTy
|
|
96
350
|
|
|
@@ -252,7 +506,7 @@ Same changes as in `@mui/x-date-pickers@7.0.0-beta.5`.
|
|
|
252
506
|
### Docs
|
|
253
507
|
|
|
254
508
|
- [docs] Fix image layout shift when loading @oliviertassinari
|
|
255
|
-
- [docs] Match Material
|
|
509
|
+
- [docs] Match Material UI repo comment for redirections @oliviertassinari
|
|
256
510
|
- [docs] Non breaking spaces @oliviertassinari
|
|
257
511
|
- [docs] Polish the Date Picker playground (#11869) @zanivan
|
|
258
512
|
- [docs] Standardize WAI-ARIA references @oliviertassinari
|
|
@@ -263,9 +517,9 @@ Same changes as in `@mui/x-date-pickers@7.0.0-beta.5`.
|
|
|
263
517
|
- [core] Remove grid folder from `getComponentInfo` RegExp (#12241) @flaviendelangle
|
|
264
518
|
- [core] Remove `window.` reference for common globals @oliviertassinari
|
|
265
519
|
- [core] Use runtime agnostic setTimeout type @oliviertassinari
|
|
266
|
-
- [docs-infra] Fix Stack
|
|
520
|
+
- [docs-infra] Fix Stack Overflow breaking space @oliviertassinari
|
|
267
521
|
- [docs-infra] Fix missing non breaking spaces @oliviertassinari
|
|
268
|
-
- [
|
|
522
|
+
- [infra] Update `no-response` workflow (#12193) @MBilalShafi
|
|
269
523
|
- [infra] Fix missing permission reset @oliviertassinari
|
|
270
524
|
|
|
271
525
|
## 7.0.0-beta.4
|
|
@@ -282,7 +536,7 @@ We'd like to offer a big thanks to the 10 contributors who made this release pos
|
|
|
282
536
|
|
|
283
537
|
### Breaking changes
|
|
284
538
|
|
|
285
|
-
- The support for IE11 has been removed from all MUI
|
|
539
|
+
- The support for IE11 has been removed from all MUI X packages. The `legacy` bundle that used to support old browsers like IE11 is no longer included.
|
|
286
540
|
|
|
287
541
|
### Data Grid
|
|
288
542
|
|
|
@@ -324,7 +578,7 @@ Same changes as in `@mui/x-data-grid-pro@7.0.0-beta.4`.
|
|
|
324
578
|
- The headless field hooks (e.g.: `useDateField`) now returns a new prop called `enableAccessibleFieldDOMStructure`.
|
|
325
579
|
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).
|
|
326
580
|
|
|
327
|
-
|
|
581
|
+
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:
|
|
328
582
|
|
|
329
583
|
```diff
|
|
330
584
|
function MyCustomTextField(props) {
|
|
@@ -392,7 +646,7 @@ These components are no longer exported from `@mui/x-charts`:
|
|
|
392
646
|
### Docs
|
|
393
647
|
|
|
394
648
|
- [docs] Add recipe for hiding separator on non-resizable columns (#12134) @michelengelen
|
|
395
|
-
- [docs] Add small improvements to the Gauge
|
|
649
|
+
- [docs] Add small improvements to the Gauge page (#12076) @danilo-leal
|
|
396
650
|
- [docs] Add the 'point' scaleType to the axis documentation (#12179) @alexfauquette
|
|
397
651
|
- [docs] Clarify Pickers 'Component composition' section (#12097) @LukasTy
|
|
398
652
|
- [docs] Fix "Licensing" page link (#12156) @LukasTy
|
|
@@ -975,7 +1229,7 @@ Same changes as in `@mui/x-date-pickers@7.0.0-alpha.9`.
|
|
|
975
1229
|
|
|
976
1230
|
- [charts] Do not propagate `innerRadius` and `outerRadius` to the DOM (#11689) @alexfauquette
|
|
977
1231
|
- [charts] Fix default `stackOffset` for `LineChart` (#11647) @alexfauquette
|
|
978
|
-
- [charts] Remove a
|
|
1232
|
+
- [charts] Remove a TypeScript ignore (#11688) @alexfauquette
|
|
979
1233
|
|
|
980
1234
|
### Tree View
|
|
981
1235
|
|
|
@@ -1404,7 +1658,7 @@ Same changes as in `@mui/x-date-pickers@7.0.0-alpha.7`.
|
|
|
1404
1658
|
- [core] Fix release changelog (#11496) @romgrk
|
|
1405
1659
|
- [core] Fix use of ::before & ::after (#11515) @oliviertassinari
|
|
1406
1660
|
- [core] Localize the issue template to MUI X (#11511) @oliviertassinari
|
|
1407
|
-
- [core]
|
|
1661
|
+
- [core] Regenerate API files (#11542) @flaviendelangle
|
|
1408
1662
|
- [core] Remove issue emoji @oliviertassinari
|
|
1409
1663
|
- [core] Sync the release instructions with MUI Core @oliviertassinari
|
|
1410
1664
|
- [core] Yaml format match most common convention @oliviertassinari
|
|
@@ -1447,7 +1701,7 @@ We'd like to offer a big thanks to the 6 contributors who made this release poss
|
|
|
1447
1701
|
|
|
1448
1702
|
- The `filterModel` now supports `Date` objects as values for `date` and `dateTime` column types.
|
|
1449
1703
|
The `filterModel` still accepts strings as values for `date` and `dateTime` column types,
|
|
1450
|
-
but all updates to the `filterModel` coming from the UI (
|
|
1704
|
+
but all updates to the `filterModel` coming from the UI (for example filter panel) will set the value as a `Date` object.
|
|
1451
1705
|
|
|
1452
1706
|
#### `@mui/x-data-grid@7.0.0-alpha.6`
|
|
1453
1707
|
|
|
@@ -1658,7 +1912,7 @@ Same changes as in `@mui/x-date-pickers@7.0.0-alpha.5`, plus:
|
|
|
1658
1912
|
### Core
|
|
1659
1913
|
|
|
1660
1914
|
- [core] Automate cherry-pick of PRs from `next` -> `master` (#11382) @MBilalShafi
|
|
1661
|
-
- [
|
|
1915
|
+
- [infra] Update `no-response` workflow (#11369) @MBilalShafi
|
|
1662
1916
|
- [test] Fix flaky screenshots (#11388) @cherniavskii
|
|
1663
1917
|
|
|
1664
1918
|
## 7.0.0-alpha.4
|
|
@@ -1896,7 +2150,7 @@ Same changes as in `@mui/x-date-pickers@7.0.0-alpha.3`.
|
|
|
1896
2150
|
|
|
1897
2151
|
- [charts] Adjusted `defaultizeValueFormatter` util to accept an optional `series.valueFormatter` value (#11144) @michelengelen
|
|
1898
2152
|
- [charts] Apply `labelStyle` and `tickLabelStyle` props on `<ChartsYAxis />` (#11180) @akamfoad
|
|
1899
|
-
- [charts] Fix
|
|
2153
|
+
- [charts] Fix TypeScript config (#11259) @alexfauquette
|
|
1900
2154
|
- [charts] Fix error with empty dataset (#11063) @alexfauquette
|
|
1901
2155
|
- [charts] Fix export strategy (#11235) @alexfauquette
|
|
1902
2156
|
- [charts] Remove outdated prop-types (#11045) @alexfauquette
|
package/README.md
CHANGED
|
@@ -36,21 +36,20 @@ function WrappedTreeItem({
|
|
|
36
36
|
slotProps,
|
|
37
37
|
label,
|
|
38
38
|
id,
|
|
39
|
-
|
|
39
|
+
itemId,
|
|
40
40
|
children
|
|
41
41
|
}) {
|
|
42
|
-
|
|
43
|
-
const Item = (_slots$item = slots == null ? void 0 : slots.item) != null ? _slots$item : TreeItem;
|
|
42
|
+
const Item = slots?.item ?? TreeItem;
|
|
44
43
|
const itemProps = useSlotProps({
|
|
45
44
|
elementType: Item,
|
|
46
|
-
externalSlotProps: slotProps
|
|
45
|
+
externalSlotProps: slotProps?.item,
|
|
47
46
|
additionalProps: {
|
|
48
|
-
|
|
47
|
+
itemId,
|
|
49
48
|
id,
|
|
50
49
|
label
|
|
51
50
|
},
|
|
52
51
|
ownerState: {
|
|
53
|
-
|
|
52
|
+
itemId,
|
|
54
53
|
label
|
|
55
54
|
}
|
|
56
55
|
});
|
|
@@ -58,7 +57,7 @@ function WrappedTreeItem({
|
|
|
58
57
|
children: children
|
|
59
58
|
}));
|
|
60
59
|
}
|
|
61
|
-
const childrenWarning = buildWarning(['MUI X: The `RichTreeView` component does not support JSX children.', 'If you want to add items, you need to use the `items` prop', 'Check the documentation for more details: https://
|
|
60
|
+
const childrenWarning = buildWarning(['MUI X: The `RichTreeView` component does not support JSX children.', 'If you want to add items, you need to use the `items` prop', 'Check the documentation for more details: https://mui.com/x/react-tree-view/rich-tree-view/items/']);
|
|
62
61
|
|
|
63
62
|
/**
|
|
64
63
|
*
|
|
@@ -71,7 +70,6 @@ const childrenWarning = buildWarning(['MUI X: The `RichTreeView` component does
|
|
|
71
70
|
* - [RichTreeView API](https://mui.com/x/api/tree-view/rich-tree-view/)
|
|
72
71
|
*/
|
|
73
72
|
const RichTreeView = /*#__PURE__*/React.forwardRef(function RichTreeView(inProps, ref) {
|
|
74
|
-
var _slots$root;
|
|
75
73
|
const props = useThemeProps({
|
|
76
74
|
props: inProps,
|
|
77
75
|
name: 'MuiRichTreeView'
|
|
@@ -97,19 +95,19 @@ const RichTreeView = /*#__PURE__*/React.forwardRef(function RichTreeView(inProps
|
|
|
97
95
|
instance
|
|
98
96
|
} = useTreeView(pluginParams);
|
|
99
97
|
const classes = useUtilityClasses(props);
|
|
100
|
-
const Root =
|
|
98
|
+
const Root = slots?.root ?? RichTreeViewRoot;
|
|
101
99
|
const rootProps = useSlotProps({
|
|
102
100
|
elementType: Root,
|
|
103
|
-
externalSlotProps: slotProps
|
|
101
|
+
externalSlotProps: slotProps?.root,
|
|
104
102
|
externalForwardedProps: otherProps,
|
|
105
103
|
className: classes.root,
|
|
106
104
|
getSlotProps: getRootProps,
|
|
107
105
|
ownerState: props
|
|
108
106
|
});
|
|
109
|
-
const
|
|
110
|
-
const
|
|
107
|
+
const itemsToRender = instance.getItemsToRender();
|
|
108
|
+
const renderItem = ({
|
|
111
109
|
label,
|
|
112
|
-
|
|
110
|
+
itemId,
|
|
113
111
|
id,
|
|
114
112
|
children
|
|
115
113
|
}) => {
|
|
@@ -118,14 +116,14 @@ const RichTreeView = /*#__PURE__*/React.forwardRef(function RichTreeView(inProps
|
|
|
118
116
|
slotProps: slotProps,
|
|
119
117
|
label: label,
|
|
120
118
|
id: id,
|
|
121
|
-
|
|
122
|
-
children: children
|
|
123
|
-
},
|
|
119
|
+
itemId: itemId,
|
|
120
|
+
children: children?.map(renderItem)
|
|
121
|
+
}, itemId);
|
|
124
122
|
};
|
|
125
123
|
return /*#__PURE__*/_jsx(TreeViewProvider, {
|
|
126
124
|
value: contextValue,
|
|
127
125
|
children: /*#__PURE__*/_jsx(Root, _extends({}, rootProps, {
|
|
128
|
-
children:
|
|
126
|
+
children: itemsToRender.map(renderItem)
|
|
129
127
|
}))
|
|
130
128
|
});
|
|
131
129
|
});
|
|
@@ -9,7 +9,7 @@ import { TreeItem2Props } from '../TreeItem2';
|
|
|
9
9
|
import { TreeViewItemId } from '../models';
|
|
10
10
|
import { TreeViewPublicAPI } from '../internals/models';
|
|
11
11
|
interface RichTreeViewItemSlotOwnerState {
|
|
12
|
-
|
|
12
|
+
itemId: TreeViewItemId;
|
|
13
13
|
label: string;
|
|
14
14
|
}
|
|
15
15
|
export interface RichTreeViewSlots extends DefaultTreeViewPluginSlots {
|
|
@@ -31,7 +31,7 @@ export const SimpleTreeViewRoot = styled('ul', {
|
|
|
31
31
|
outline: 0
|
|
32
32
|
});
|
|
33
33
|
const EMPTY_ITEMS = [];
|
|
34
|
-
const itemsPropWarning = buildWarning(['MUI X: The `SimpleTreeView` component does not support the `items` prop.', 'If you want to add items, you need to pass them as JSX children.', 'Check the documentation for more details: https://
|
|
34
|
+
const itemsPropWarning = buildWarning(['MUI X: The `SimpleTreeView` component does not support the `items` prop.', 'If you want to add items, you need to pass them as JSX children.', 'Check the documentation for more details: https://mui.com/x/react-tree-view/simple-tree-view/items/']);
|
|
35
35
|
|
|
36
36
|
/**
|
|
37
37
|
*
|
|
@@ -44,7 +44,6 @@ const itemsPropWarning = buildWarning(['MUI X: The `SimpleTreeView` component do
|
|
|
44
44
|
* - [SimpleTreeView API](https://mui.com/x/api/tree-view/simple-tree-view/)
|
|
45
45
|
*/
|
|
46
46
|
const SimpleTreeView = /*#__PURE__*/React.forwardRef(function SimpleTreeView(inProps, ref) {
|
|
47
|
-
var _slots$root;
|
|
48
47
|
const props = useThemeProps({
|
|
49
48
|
props: inProps,
|
|
50
49
|
name: 'MuiSimpleTreeView'
|
|
@@ -72,10 +71,10 @@ const SimpleTreeView = /*#__PURE__*/React.forwardRef(function SimpleTreeView(inP
|
|
|
72
71
|
contextValue
|
|
73
72
|
} = useTreeView(pluginParams);
|
|
74
73
|
const classes = useUtilityClasses(props);
|
|
75
|
-
const Root =
|
|
74
|
+
const Root = slots?.root ?? SimpleTreeViewRoot;
|
|
76
75
|
const rootProps = useSlotProps({
|
|
77
76
|
elementType: Root,
|
|
78
|
-
externalSlotProps: slotProps
|
|
77
|
+
externalSlotProps: slotProps?.root,
|
|
79
78
|
externalForwardedProps: otherProps,
|
|
80
79
|
className: classes.root,
|
|
81
80
|
getSlotProps: getRootProps,
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { DefaultTreeViewPluginParameters, DefaultTreeViewPluginSlotProps, DefaultTreeViewPluginSlots } from '../internals/plugins/defaultPlugins';
|
|
2
2
|
import { ConvertPluginsIntoSignatures } from '../internals/models';
|
|
3
|
-
export declare const SIMPLE_TREE_VIEW_PLUGINS: readonly [import("../internals/models").TreeViewPlugin<import("../internals").UseTreeViewIdSignature>, import("../internals/models").TreeViewPlugin<import("../internals").
|
|
3
|
+
export declare const SIMPLE_TREE_VIEW_PLUGINS: readonly [import("../internals/models").TreeViewPlugin<import("../internals").UseTreeViewIdSignature>, import("../internals/models").TreeViewPlugin<import("../internals").UseTreeViewItemsSignature>, import("../internals/models").TreeViewPlugin<import("../internals").UseTreeViewExpansionSignature>, import("../internals/models").TreeViewPlugin<import("../internals").UseTreeViewSelectionSignature>, import("../internals/models").TreeViewPlugin<import("../internals").UseTreeViewFocusSignature>, import("../internals/models").TreeViewPlugin<import("../internals").UseTreeViewKeyboardNavigationSignature>, import("../internals/models").TreeViewPlugin<import("../internals").UseTreeViewIconsSignature>, import("../internals/models").TreeViewPlugin<import("../internals/plugins/useTreeViewJSXItems").UseTreeViewJSXItemsSignature>];
|
|
4
4
|
export type SimpleTreeViewPlugins = ConvertPluginsIntoSignatures<typeof SIMPLE_TREE_VIEW_PLUGINS>;
|
|
5
5
|
export type SimpleTreeViewPluginSlots = DefaultTreeViewPluginSlots;
|
|
6
6
|
export type SimpleTreeViewPluginSlotProps = DefaultTreeViewPluginSlotProps;
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { DEFAULT_TREE_VIEW_PLUGINS } from '../internals/plugins/defaultPlugins';
|
|
2
|
-
import {
|
|
3
|
-
export const SIMPLE_TREE_VIEW_PLUGINS = [...DEFAULT_TREE_VIEW_PLUGINS,
|
|
2
|
+
import { useTreeViewJSXItems } from '../internals/plugins/useTreeViewJSXItems';
|
|
3
|
+
export const SIMPLE_TREE_VIEW_PLUGINS = [...DEFAULT_TREE_VIEW_PLUGINS, useTreeViewJSXItems];
|
|
4
4
|
|
|
5
5
|
// We can't infer this type from the plugin, otherwise we would lose the generics.
|