@mui/x-tree-view 8.0.0-alpha.12 → 8.0.0-alpha.14

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.
Files changed (123) hide show
  1. package/CHANGELOG.md +430 -0
  2. package/RichTreeView/RichTreeView.js +24 -5
  3. package/SimpleTreeView/SimpleTreeView.js +8 -6
  4. package/TreeItem/TreeItem.d.ts +2 -0
  5. package/TreeItem/TreeItem.js +46 -5
  6. package/TreeItem/TreeItem.types.d.ts +14 -0
  7. package/TreeItemIcon/TreeItemIcon.js +2 -0
  8. package/esm/RichTreeView/RichTreeView.js +24 -5
  9. package/esm/SimpleTreeView/SimpleTreeView.js +8 -6
  10. package/esm/TreeItem/TreeItem.d.ts +2 -0
  11. package/esm/TreeItem/TreeItem.js +45 -4
  12. package/esm/TreeItem/TreeItem.types.d.ts +14 -0
  13. package/esm/TreeItemIcon/TreeItemIcon.js +2 -0
  14. package/esm/hooks/useTreeItemUtils/useTreeItemUtils.d.ts +3 -2
  15. package/esm/hooks/useTreeItemUtils/useTreeItemUtils.js +21 -9
  16. package/esm/hooks/useTreeViewApiRef.d.ts +1 -1
  17. package/esm/index.js +1 -1
  18. package/esm/internals/hooks/useSelector.js +4 -1
  19. package/esm/internals/index.d.ts +6 -1
  20. package/esm/internals/index.js +4 -1
  21. package/esm/internals/plugins/useTreeViewExpansion/useTreeViewExpansion.js +35 -12
  22. package/esm/internals/plugins/useTreeViewExpansion/useTreeViewExpansion.selectors.d.ts +4 -0
  23. package/esm/internals/plugins/useTreeViewExpansion/useTreeViewExpansion.types.d.ts +40 -16
  24. package/esm/internals/plugins/useTreeViewItems/useTreeViewItems.js +157 -16
  25. package/esm/internals/plugins/useTreeViewItems/useTreeViewItems.selectors.d.ts +172 -0
  26. package/esm/internals/plugins/useTreeViewItems/useTreeViewItems.selectors.js +13 -0
  27. package/esm/internals/plugins/useTreeViewItems/useTreeViewItems.types.d.ts +49 -0
  28. package/esm/internals/plugins/useTreeViewJSXItems/useTreeViewJSXItems.js +2 -2
  29. package/esm/internals/plugins/useTreeViewKeyboardNavigation/useTreeViewKeyboardNavigation.js +16 -7
  30. package/esm/internals/plugins/useTreeViewKeyboardNavigation/useTreeViewKeyboardNavigation.types.d.ts +2 -1
  31. package/esm/internals/plugins/useTreeViewLazyLoading/index.d.ts +1 -0
  32. package/esm/internals/plugins/useTreeViewLazyLoading/index.js +1 -0
  33. package/esm/internals/plugins/useTreeViewLazyLoading/useTreeViewLazyLoading.selectors.d.ts +249 -0
  34. package/esm/internals/plugins/useTreeViewLazyLoading/useTreeViewLazyLoading.selectors.js +27 -0
  35. package/esm/internals/plugins/useTreeViewLazyLoading/useTreeViewLazyLoading.types.d.ts +83 -0
  36. package/esm/internals/plugins/useTreeViewLazyLoading/useTreeViewLazyLoading.types.js +1 -0
  37. package/esm/internals/plugins/useTreeViewSelection/useTreeViewSelection.js +4 -4
  38. package/esm/internals/plugins/useTreeViewSelection/useTreeViewSelection.types.d.ts +12 -12
  39. package/esm/internals/utils/selectors.d.ts +7 -0
  40. package/esm/internals/utils/selectors.js +9 -0
  41. package/esm/useTreeItem/useTreeItem.d.ts +1 -1
  42. package/esm/useTreeItem/useTreeItem.js +13 -0
  43. package/esm/useTreeItem/useTreeItem.types.d.ts +21 -0
  44. package/esm/utils/cache.d.ts +38 -0
  45. package/esm/utils/cache.js +31 -0
  46. package/esm/utils/index.d.ts +1 -0
  47. package/esm/utils/index.js +1 -0
  48. package/hooks/useTreeItemUtils/useTreeItemUtils.d.ts +3 -2
  49. package/hooks/useTreeItemUtils/useTreeItemUtils.js +22 -10
  50. package/hooks/useTreeViewApiRef.d.ts +1 -1
  51. package/index.js +1 -1
  52. package/internals/hooks/useSelector.js +5 -1
  53. package/internals/index.d.ts +6 -1
  54. package/internals/index.js +33 -0
  55. package/internals/plugins/useTreeViewExpansion/useTreeViewExpansion.js +35 -12
  56. package/internals/plugins/useTreeViewExpansion/useTreeViewExpansion.selectors.d.ts +4 -0
  57. package/internals/plugins/useTreeViewExpansion/useTreeViewExpansion.types.d.ts +40 -16
  58. package/internals/plugins/useTreeViewItems/useTreeViewItems.js +157 -16
  59. package/internals/plugins/useTreeViewItems/useTreeViewItems.selectors.d.ts +172 -0
  60. package/internals/plugins/useTreeViewItems/useTreeViewItems.selectors.js +14 -1
  61. package/internals/plugins/useTreeViewItems/useTreeViewItems.types.d.ts +49 -0
  62. package/internals/plugins/useTreeViewJSXItems/useTreeViewJSXItems.js +1 -1
  63. package/internals/plugins/useTreeViewKeyboardNavigation/useTreeViewKeyboardNavigation.js +16 -7
  64. package/internals/plugins/useTreeViewKeyboardNavigation/useTreeViewKeyboardNavigation.types.d.ts +2 -1
  65. package/internals/plugins/useTreeViewLazyLoading/index.d.ts +1 -0
  66. package/internals/plugins/useTreeViewLazyLoading/index.js +5 -0
  67. package/internals/plugins/useTreeViewLazyLoading/useTreeViewLazyLoading.selectors.d.ts +249 -0
  68. package/internals/plugins/useTreeViewLazyLoading/useTreeViewLazyLoading.selectors.js +33 -0
  69. package/internals/plugins/useTreeViewLazyLoading/useTreeViewLazyLoading.types.d.ts +83 -0
  70. package/internals/plugins/useTreeViewLazyLoading/useTreeViewLazyLoading.types.js +5 -0
  71. package/internals/plugins/useTreeViewSelection/useTreeViewSelection.js +4 -4
  72. package/internals/plugins/useTreeViewSelection/useTreeViewSelection.types.d.ts +12 -12
  73. package/internals/utils/selectors.d.ts +7 -0
  74. package/internals/utils/selectors.js +9 -0
  75. package/modern/RichTreeView/RichTreeView.js +24 -5
  76. package/modern/SimpleTreeView/SimpleTreeView.js +8 -6
  77. package/modern/TreeItem/TreeItem.d.ts +2 -0
  78. package/modern/TreeItem/TreeItem.js +45 -4
  79. package/modern/TreeItem/TreeItem.types.d.ts +14 -0
  80. package/modern/TreeItemIcon/TreeItemIcon.js +2 -0
  81. package/modern/hooks/useTreeItemUtils/useTreeItemUtils.d.ts +3 -2
  82. package/modern/hooks/useTreeItemUtils/useTreeItemUtils.js +21 -9
  83. package/modern/hooks/useTreeViewApiRef.d.ts +1 -1
  84. package/modern/index.js +1 -1
  85. package/modern/internals/hooks/useSelector.js +4 -1
  86. package/modern/internals/index.d.ts +6 -1
  87. package/modern/internals/index.js +4 -1
  88. package/modern/internals/plugins/useTreeViewExpansion/useTreeViewExpansion.js +35 -12
  89. package/modern/internals/plugins/useTreeViewExpansion/useTreeViewExpansion.selectors.d.ts +4 -0
  90. package/modern/internals/plugins/useTreeViewExpansion/useTreeViewExpansion.types.d.ts +40 -16
  91. package/modern/internals/plugins/useTreeViewItems/useTreeViewItems.js +157 -16
  92. package/modern/internals/plugins/useTreeViewItems/useTreeViewItems.selectors.d.ts +172 -0
  93. package/modern/internals/plugins/useTreeViewItems/useTreeViewItems.selectors.js +13 -0
  94. package/modern/internals/plugins/useTreeViewItems/useTreeViewItems.types.d.ts +49 -0
  95. package/modern/internals/plugins/useTreeViewJSXItems/useTreeViewJSXItems.js +2 -2
  96. package/modern/internals/plugins/useTreeViewKeyboardNavigation/useTreeViewKeyboardNavigation.js +16 -7
  97. package/modern/internals/plugins/useTreeViewKeyboardNavigation/useTreeViewKeyboardNavigation.types.d.ts +2 -1
  98. package/modern/internals/plugins/useTreeViewLazyLoading/index.d.ts +1 -0
  99. package/modern/internals/plugins/useTreeViewLazyLoading/index.js +1 -0
  100. package/modern/internals/plugins/useTreeViewLazyLoading/useTreeViewLazyLoading.selectors.d.ts +249 -0
  101. package/modern/internals/plugins/useTreeViewLazyLoading/useTreeViewLazyLoading.selectors.js +27 -0
  102. package/modern/internals/plugins/useTreeViewLazyLoading/useTreeViewLazyLoading.types.d.ts +83 -0
  103. package/modern/internals/plugins/useTreeViewLazyLoading/useTreeViewLazyLoading.types.js +1 -0
  104. package/modern/internals/plugins/useTreeViewSelection/useTreeViewSelection.js +4 -4
  105. package/modern/internals/plugins/useTreeViewSelection/useTreeViewSelection.types.d.ts +12 -12
  106. package/modern/internals/utils/selectors.d.ts +7 -0
  107. package/modern/internals/utils/selectors.js +9 -0
  108. package/modern/useTreeItem/useTreeItem.d.ts +1 -1
  109. package/modern/useTreeItem/useTreeItem.js +13 -0
  110. package/modern/useTreeItem/useTreeItem.types.d.ts +21 -0
  111. package/modern/utils/cache.d.ts +38 -0
  112. package/modern/utils/cache.js +31 -0
  113. package/modern/utils/index.d.ts +1 -0
  114. package/modern/utils/index.js +1 -0
  115. package/package.json +2 -2
  116. package/tsconfig.build.tsbuildinfo +1 -1
  117. package/useTreeItem/useTreeItem.d.ts +1 -1
  118. package/useTreeItem/useTreeItem.js +13 -0
  119. package/useTreeItem/useTreeItem.types.d.ts +21 -0
  120. package/utils/cache.d.ts +38 -0
  121. package/utils/cache.js +38 -0
  122. package/utils/index.d.ts +1 -0
  123. package/utils/index.js +16 -0
package/CHANGELOG.md CHANGED
@@ -5,6 +5,436 @@
5
5
  All notable changes to this project will be documented in this file.
6
6
  See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
7
7
 
8
+ ## 8.0.0-alpha.14
9
+
10
+ _Mar 7, 2025_
11
+
12
+ We'd like to offer a big thanks to the 12 contributors who made this release possible. Here are some highlights ✨:
13
+
14
+ - 🚀📊 New Pro Chart: It is now possible to create Funnel charts—perfect for visualizing conversions, sales pipelines and more!
15
+ <img width="418" alt="Screenshot 2025-01-31 at 12 22 31" src="https://github.com/user-attachments/assets/8cd26821-5f11-46bf-a9bb-34d212880a47" />
16
+ - 🎁 The first iteration of the radar chart is available. Features and refinements will be added in the coming weeks.
17
+ - 🛠️ New and improved [Toolbar component](https://next.mui.com/x/react-data-grid/components/toolbar/) for the data grid
18
+ - 🐞 Bugfixes
19
+
20
+ Special thanks go out to the community member for their valuable contributions:
21
+ @vadimka123.
22
+
23
+ Following are all team members who have contributed to this release:
24
+ @alexfauquette, @arminmeh, @bernardobelchior, @cherniavskii, @flaviendelangle, @JCQuintas, @KenanYusuf, @LukasTy, @michelengelen, @noraleonte, @oliviertassinari.
25
+
26
+ <!--/ HIGHLIGHT_ABOVE_SEPARATOR /-->
27
+
28
+ ### Data Grid
29
+
30
+ #### Breaking changes
31
+
32
+ - The density selector has been removed from the toolbar. It is still possible to set the density programmatically via the `density` prop. A density selector can be added to a custom toolbar passed to `slots.toolbar`. See [Toolbar component—Settings menu](https://next.mui.com/x/react-data-grid/components/toolbar/#settings-menu) for an example.
33
+ - The quick filter is now shown in the toolbar by default. Use `slotProps={{ toolbar: { showQuickFilter: false } }}` to hide it.
34
+ - The `<GridSaveAltIcon />` icon is not exported anymore. Import `SaveAlt` from `@mui/icons-material` instead.
35
+
36
+ #### `@mui/x-data-grid@8.0.0-alpha.14`
37
+
38
+ - [DataGrid] Fix `aria-hidden` console error when scrollbar is dragged (#16829) @arminmeh
39
+ - [DataGrid] Fix scroll jump with dynamic row height (#16763) @cherniavskii
40
+ - [DataGrid] New `<Toolbar />` component (#14611) @KenanYusuf
41
+ - [DataGrid] Use new toolbar by default (#16814) @KenanYusuf
42
+ - [DataGrid] Remove the quick filtering on a given column (#16738) @vadimka123
43
+
44
+ #### `@mui/x-data-grid-pro@8.0.0-alpha.14` [![pro](https://mui.com/r/x-pro-svg)](https://mui.com/r/x-pro-svg-link 'Pro plan')
45
+
46
+ Same changes as in `@mui/x-data-grid@8.0.0-alpha.14`.
47
+
48
+ #### `@mui/x-data-grid-premium@8.0.0-alpha.14` [![premium](https://mui.com/r/x-premium-svg)](https://mui.com/r/x-premium-svg-link 'Premium plan')
49
+
50
+ Same changes as in `@mui/x-data-grid-pro@8.0.0-alpha.14`.
51
+
52
+ ### Date and Time Pickers
53
+
54
+ #### Breaking changes
55
+
56
+ - All Date Time Picker variants now use Digital Clock for time editing.
57
+ - Stop passing invalid date to `onChange` when the date is partially filled — [Learn more](https://next.mui.com/x/migration/migration-pickers-v7/#treat-partially-filled-date-as-null-in-onchange).
58
+
59
+ #### `@mui/x-date-pickers@8.0.0-alpha.14`
60
+
61
+ - [DateTimePicker] Use Digital Clock in all component variants (#16678) @LukasTy
62
+ - [fields] Always use `props.value` as the source of truth when defined (#15875) @flaviendelangle
63
+ - [fields] Fix Fields aria relationship with `helperText` (#16821) @LukasTy
64
+ - [pickers] Add `TValidationProps` generic to the `PickerManager` interface (#16832) @flaviendelangle
65
+ - [pickers] Fix `edge` property setting in different button position cases (#16838) @LukasTy
66
+ - [pickers] Fix typo in JSDoc (#16831) @flaviendelangle
67
+ - [pickers] Refactor the files in the `usePicker` folder (#16680) @flaviendelangle
68
+
69
+ #### `@mui/x-date-pickers-pro@8.0.0-alpha.14` [![pro](https://mui.com/r/x-pro-svg)](https://mui.com/r/x-pro-svg-link 'Pro plan')
70
+
71
+ Same changes as in `@mui/x-date-pickers@8.0.0-alpha.14`.
72
+
73
+ ### Charts
74
+
75
+ #### `@mui/x-charts@8.0.0-alpha.14`
76
+
77
+ - [charts] Fix `undefined` behaving differently from missing value for axis size (#16844) @bernardobelchior
78
+ - [charts] Fix x-axis text anchor default when language is RTL (#16836) @bernardobelchior
79
+ - [charts] Add Radar chart (#16406) @alexfauquette
80
+ - [charts] Move series default color generation in the series config (#16752) @alexfauquette
81
+ - [charts] Render axis title within axis size (#16730) @bernardobelchior
82
+ - [charts] Split `defaultizeAxis` function into two (#16745) @bernardobelchior
83
+ - [charts] Warn if axes data don't have enough elements (#16830) @alexfauquette
84
+ - [charts] XAxis: Add defaults for `textAnchor` and `dominantBaseline` based on `angle` (#16817) @bernardobelchior
85
+
86
+ #### `@mui/x-charts-pro@8.0.0-alpha.14` [![pro](https://mui.com/r/x-pro-svg)](https://mui.com/r/x-pro-svg-link 'Pro plan')
87
+
88
+ Same changes as in `@mui/x-charts@8.0.0-alpha.14`, plus:
89
+
90
+ - [charts] Add Funnel chart (#14804) @JCQuintas
91
+
92
+ ### Tree View
93
+
94
+ #### Breaking changes
95
+
96
+ - The `selectItem` method has been renamed `setItemSelection`:
97
+
98
+ ```diff
99
+ const { publicAPI } = useTreeItemUtils();
100
+
101
+ const handleSelectItem() {
102
+ - publicAPI.selectItem({ event, itemId: props.itemId, shouldBeSelected: true })
103
+ + publicAPI.setItemSelection({ event, itemId: props.itemId, shouldBeSelected: true })
104
+ }
105
+ ```
106
+
107
+ - The `setItemExpansion` method now receives a single object instead of a list of parameters:
108
+
109
+ ```diff
110
+ const { publicAPI } = useTreeItemUtils();
111
+
112
+ const handleExpandItem() {
113
+ - publicAPI.setItemExpansion(event, props.itemId, true)
114
+ + publicAPI.setItemExpansion({ event, itemId: props.itemId, shouldBeExpanded: true })
115
+ }
116
+ ```
117
+
118
+ #### `@mui/x-tree-view@8.0.0-alpha.14`
119
+
120
+ - [TreeView] Clean the expansion and selection API methods (#16795) @flaviendelangle
121
+
122
+ #### `@mui/x-tree-view-pro@8.0.0-alpha.14` [![pro](https://mui.com/r/x-pro-svg)](https://mui.com/r/x-pro-svg-link 'Pro plan')
123
+
124
+ Same changes as in `@mui/x-tree-view@8.0.0-alpha.14`.
125
+
126
+ ### Docs
127
+
128
+ - [docs] Fix padding package install on mobile (#16794) @oliviertassinari
129
+ - [docs] Typo fixes (#16835) @alexfauquette
130
+
131
+ ### Core
132
+
133
+ - [code-infra] Fix console warning in telemetry package (#16816) @JCQuintas
134
+ - [code-infra] Split date-picker test files (#16825) @JCQuintas
135
+ - [infra] Replace PR label check workflow with reusable version (#16762) @michelengelen
136
+ - [infra] Update label in priority-support issue template (#16767) @michelengelen
137
+ - [test] Add timeout to flaky screenshot tests (#16852) @LukasTy
138
+
139
+ ## 8.0.0-alpha.13
140
+
141
+ _Feb 28, 2025_
142
+
143
+ We'd like to offer a big thanks to the 19 contributors who made this release possible. Here are some highlights ✨:
144
+
145
+ - 📊 Decouple `margin` and `axis-size`. A new API to support multiple axes (#16418) @JCQuintas
146
+ - 🗺️ Added Bangla (bn-BD) locale
147
+ - 🗺️ Improve Russian (ru-RU) and Hungarian (hu-HU) locale on the Data Grid
148
+
149
+ Special thanks go out to the community members for their contributions:
150
+ @denpiligrim, @lhilgert9, @noherczeg, @officialkidmax, @pcorpet.
151
+ Following are all team members who have contributed to this release:
152
+ @alexfauquette, @arminmeh, @bernardobelchior, @cherniavskii, @flaviendelangle, @hasdfa, @Janpot, @JCQuintas, @KenanYusuf, @LukasTy, @michelengelen, @MBilalShafi, @oliviertassinari, @romgrk.
153
+
154
+ <!--/ HIGHLIGHT_ABOVE_SEPARATOR /-->
155
+
156
+ ### Data Grid
157
+
158
+ #### Breaking changes
159
+
160
+ - The `slots.baseFormControl` component was removed.
161
+
162
+ - The "Reset" button in the column visibility panel now resets to the initial column visibility model. Previously it was reset to the model that was active at the time the panel was opened. The reset behavior follows these rules:
163
+
164
+ 1. If an initial `columnVisibilityModel` is provided, it resets to that model.
165
+ 2. If a controlled `columnVisibilityModel` is provided, it resets to the first model value.
166
+ 3. When the columns are updated (via the `columns` prop or `updateColumns()` API method), the reset reference point updates to the current `columnVisibilityModel`.
167
+
168
+ To revert to the previous behavior, provide a custom component to the `slots.columnsManagement`.
169
+
170
+ - The deprecated `LicenseInfo` export has been removed from the `@mui/x-data-grid-pro` and `@mui/x-data-grid-premium` packages.
171
+ You have to import it from `@mui/x-license` instead:
172
+
173
+ ```diff
174
+ - import { LicenseInfo } from '@mui/x-data-grid-pro';
175
+ - import { LicenseInfo } from '@mui/x-data-grid-premium';
176
+ + import { LicenseInfo } from '@mui/x-license';
177
+
178
+ LicenseInfo.setLicenseKey('YOUR_LICENSE_KEY');
179
+ ```
180
+
181
+ - The row selection model has been changed from `GridRowId[]` to `{ type: 'include' | 'exclude'; ids: Set<GridRowId> }`.
182
+ Using `Set` allows for a more efficient row selection management.
183
+ The `exclude` selection type allows to select all rows except the ones in the `ids` set.
184
+
185
+ This change impacts the following props:
186
+
187
+ - `rowSelectionModel`
188
+ - `onRowSelectionModelChange`
189
+ - `initialState.rowSelectionModel`
190
+
191
+ ```diff
192
+ - const [rowSelectionModel, setRowSelectionModel] = React.useState<GridRowSelectionModel>([]);
193
+ + const [rowSelectionModel, setRowSelectionModel] = React.useState<GridRowSelectionModel>({ type: 'include', ids: new Set() });
194
+ ```
195
+
196
+ This change also impacts the `gridRowSelectionStateSelector` selector.
197
+ For convenience, use the `gridRowSelectionManagerSelector` selector to handle both selection types:
198
+
199
+ ```diff
200
+ - const rowSelection = gridRowSelectionStateSelector(apiRef);
201
+ - const isRowSelected = rowSelection.includes(rowId);
202
+ + const rowSelectionManager = gridRowSelectionManagerSelector(apiRef);
203
+ + const isRowSelected = rowSelectionManager.has(rowId);
204
+ ```
205
+
206
+ There is also a `createRowSelectionManager` utility function that can be used to manage the row selection:
207
+
208
+ ```ts
209
+ const rowSelectionManager = createRowSelectionManager({
210
+ type: 'include',
211
+ ids: new Set(),
212
+ });
213
+ rowSelectionManager.select(rowId);
214
+ rowSelectionManager.unselect(rowId);
215
+ rowSelectionManager.has(rowId);
216
+ ```
217
+
218
+ - The `selectedIdsLookupSelector` selector has been removed. Use the `gridRowSelectionManagerSelector` or `gridRowSelectionStateSelector` selectors instead.
219
+ - The `selectedGridRowsSelector` has been renamed to `gridRowSelectionIdsSelector`.
220
+ - The `selectedGridRowsCountSelector` has been renamed to `gridRowSelectionCountSelector`.
221
+
222
+ - The data source feature and its related props are now stable.
223
+
224
+ ```diff
225
+ <DataGridPro
226
+ - unstable_dataSource={dataSource}
227
+ - unstable_dataSourceCache={cache}
228
+ - unstable_lazyLoading
229
+ - unstable_lazyLoadingRequestThrottleMs={100}
230
+ + dataSource={dataSource}
231
+ + dataSourceCache={cache}
232
+ + lazyLoading
233
+ + lazyLoadingRequestThrottleMs={100}
234
+ />
235
+ ```
236
+
237
+ - The data source API is now stable.
238
+
239
+ ```diff
240
+ - apiRef.current.unstable_dataSource.getRows()
241
+ + apiRef.current.dataSource.getRows()
242
+ ```
243
+
244
+ - The signature of `unstable_onDataSourceError()` has been updated to support future use-cases.
245
+
246
+ ```diff
247
+ <DataGrid
248
+ - unstable_onDataSourceError={(error: Error, params: GridGetRowsParams) => {
249
+ - if (params.filterModel) {
250
+ - // do something
251
+ - }
252
+ - }}
253
+ + unstable_onDataSourceError={(error: GridGetRowsError | GridUpdateRowError) => {
254
+ + if (error instanceof GridGetRowsError && error.params.filterModel) {
255
+ + // do something
256
+ + }
257
+ + }}
258
+ />
259
+ ```
260
+
261
+ - Fix the type of the `GridSortModel` to allow readonly arrays.
262
+
263
+ - `GridSortItem` interface is not exported anymore.
264
+
265
+ - The `showToolbar` prop is now required to display the toolbar.
266
+
267
+ It is no longer necessary to pass `GridToolbar` as a slot to display the default toolbar.
268
+
269
+ ```diff
270
+ <DataGrid
271
+ + showToolbar
272
+ - slots={{
273
+ - toolbar: GridToolbar,
274
+ - }}
275
+ />
276
+ ```
277
+
278
+ #### `@mui/x-data-grid@8.0.0-alpha.13`
279
+
280
+ - [DataGrid] Add `showToolbar` prop to enable default toolbar (#16687) @KenanYusuf
281
+ - [DataGrid] Column Visibility: Update "Reset" button behavior (#16626) @MBilalShafi
282
+ - [DataGrid] Column management design updates (#16630) @KenanYusuf
283
+ - [DataGrid] Fix `showColumnVerticalBorder` prop (#16715) @KenanYusuf
284
+ - [DataGrid] Fix scrollbar overlapping cells on mount (#16639) @KenanYusuf
285
+ - [DataGrid] Fix: base `Select` menuprops `onClose()` (#16643) @romgrk
286
+ - [DataGrid] Make `GridSortItem` internal (#16732) @arminmeh
287
+ - [DataGrid] Make data source stable (#16710) @MBilalShafi
288
+ - [DataGrid] Reshape row selection model (#15651) @cherniavskii
289
+ - [DataGrid] Replace `sx` prop usage with `styled()` components (#16665) @KenanYusuf
290
+ - [DataGrid] Refactor: create base `Autocomplete` (#16390) @romgrk
291
+ - [DataGrid] Refactor: remove base form control (#16634) @romgrk
292
+ - [DataGrid] Refactor: remove base input label & adornment (#16646) @romgrk
293
+ - [DataGrid] Refactor: remove material containers (#16633) @romgrk
294
+ - [DataGrid] Refactor: theme to CSS variables (#16588) @romgrk
295
+ - [DataGrid] Update the signature of the `onDataSourceError()` callback (#16718) @MBilalShafi
296
+ - [DataGrid] Use readonly array for the `GridSortModel` (#16627) @pcorpet
297
+ - [DataGrid] Fix the popper focus trap (#16736) @romgrk
298
+ - [l10n] Added Bangla (bn-BD) locale (#16648) @officialkidmax
299
+ - [l10n] Improve Hungarian (hu-HU) locale (#16578) @noherczeg
300
+ - [l10n] Improve Russian (ru-RU) locale (#16591) @denpiligrim
301
+
302
+ #### `@mui/x-data-grid-pro@8.0.0-alpha.13` [![pro](https://mui.com/r/x-pro-svg)](https://mui.com/r/x-pro-svg-link 'Pro plan')
303
+
304
+ Same changes as in `@mui/x-data-grid@8.0.0-alpha.13`, plus:
305
+
306
+ - [DataGridPro] Remove `LicenseInfo` reexports (#16671) @cherniavskii
307
+
308
+ #### `@mui/x-data-grid-premium@8.0.0-alpha.13` [![premium](https://mui.com/r/x-premium-svg)](https://mui.com/r/x-premium-svg-link 'Premium plan')
309
+
310
+ Same changes as in `@mui/x-data-grid-pro@8.0.0-alpha.13`, plus:
311
+
312
+ - [DataGridPremium] Use `valueGetter` to get row group keys (#16016) @cherniavskii
313
+
314
+ ### Date and Time Pickers
315
+
316
+ #### Breaking changes
317
+
318
+ - The `<DateRangePicker />` now uses a `dialog` instead of a `tooltip` to render their view when used with a single input range field.
319
+
320
+ #### `@mui/x-date-pickers@8.0.0-alpha.13`
321
+
322
+ - [l10n] Added Bangla (bn-BD) locale (#16648) @officialkidmax
323
+ - [pickers] Clean the typing of the slots on the range pickers (#16670) @flaviendelangle
324
+ - [pickers] Fix Time Clock meridiem button selected styles (#16681) @LukasTy
325
+ - [pickers] Make the single input field the default field on range pickers (#16656) @flaviendelangle
326
+ - [pickers] Move the opening logic to the range fields (#16175) @flaviendelangle
327
+
328
+ #### `@mui/x-date-pickers-pro@8.0.0-alpha.13` [![pro](https://mui.com/r/x-pro-svg)](https://mui.com/r/x-pro-svg-link 'Pro plan')
329
+
330
+ Same changes as in `@mui/x-date-pickers@8.0.0-alpha.13`.
331
+
332
+ ### Charts
333
+
334
+ #### Breaking changes
335
+
336
+ - Charts array inputs are now `readonly`. Allowing externally defined `as const` to be used as a prop value of the React component.
337
+
338
+ ```tsx
339
+ const xAxis = [{ position: 'bottom' }] as const
340
+ <BarChart xAxis={xAxis} />
341
+ ```
342
+
343
+ - Replace `topAxis`, `rightAxis`, `bottomAxis` and `leftAxis` props by the `position` property in the axis config.
344
+ If you were using them to place axis, set the `position` property to the corresponding value `'top' | 'right' | 'bottom' | 'left'`.
345
+ If you were disabling an axis by setting it to `null`, set its `position` to `'none'`.
346
+
347
+ ```diff
348
+ <LineChart
349
+ yAxis={[
350
+ {
351
+ scaleType: 'linear',
352
+ + position: 'right',
353
+ },
354
+ ]}
355
+ series={[{ data: [1, 10, 30, 50, 70, 90, 100], label: 'linear' }]}
356
+ height={400}
357
+ - rightAxis={{}}
358
+ />
359
+ ```
360
+
361
+ - Remove `position` prop from `ChartsXAxis` and `ChartsYAxis`.
362
+ The `position` prop has been removed from the `ChartsXAxis` and `ChartsYAxis` components. Configure it directly in the axis config.
363
+
364
+ ```diff
365
+ <ChartContainer
366
+ yAxis={[
367
+ {
368
+ id: 'my-axis',
369
+ + position: 'right',
370
+ },
371
+ ]}
372
+ >
373
+ - <ChartsYAxis axisId="my-axis" position="right" />
374
+ + <ChartsYAxis axisId="my-axis" />
375
+ </ChartContainer>
376
+ ```
377
+
378
+ - Add `minTickLabelGap` to x-axis, which allows users to define the minimum gap, in pixels, between two tick labels. The default value is 4px. Make sure to check your charts as the spacing between tick labels might have changed.
379
+
380
+ #### `@mui/x-charts@8.0.0-alpha.13`
381
+
382
+ - [charts] Accept component in `labelMarkType` (#16739) @bernardobelchior
383
+ - [charts] Add `minTickLabelGap` to x-axis (#16548) @bernardobelchior
384
+ - [charts] Add unit test for pie chart with empty series (#16663) @bernardobelchior
385
+ - [charts] Decouple `margin` and `axis-size` (#16418) @JCQuintas
386
+ - [charts] Display slider tooltip on demos (#16723) @JCQuintas
387
+ - [charts] Fix composition docs link (#16761) @bernardobelchior
388
+ - [charts] Fix default label measurement being off (#16635) @bernardobelchior
389
+ - [charts] Fix is highlighted memoization (#16592) @alexfauquette
390
+ - [charts] Fix missing `theme.shape` error in the tooltip (#16748) @alexfauquette
391
+ - [charts] Fix typo in error message (#16641) @JCQuintas
392
+ - [charts] Improve axis size docs (#16673) @JCQuintas
393
+ - [charts] Improve performance of rendering ticks in x-axis (#16536) @bernardobelchior
394
+ - [charts] Make `defaultizeAxis` function type-safe (#16642) @JCQuintas
395
+ - [charts] Make `series.data` readonly (#16645) @JCQuintas
396
+ - [charts] Migrate `ChartsUsageDemo` to TSX and removed NoSnap (#16686) @JCQuintas
397
+ - [charts] Prevent `position='none'` axes from rendering (#16727) @JCQuintas
398
+ - [charts] Make array inputs readonly (#16632) @JCQuintas
399
+ - [charts] Remove state initialization hack (#16520) @alexfauquette
400
+ - [charts] Remove redundant default axis (#16734) @bernardobelchior
401
+
402
+ #### `@mui/x-charts-pro@8.0.0-alpha.13` [![pro](https://mui.com/r/x-pro-svg)](https://mui.com/r/x-pro-svg-link 'Pro plan')
403
+
404
+ Same changes as in `@mui/x-charts@8.0.0-alpha.13`, plus:
405
+
406
+ - [charts-pro] Add back zoom control (#16550) @alexfauquette
407
+
408
+ ### Tree View
409
+
410
+ #### `@mui/x-tree-view@8.0.0-alpha.13`
411
+
412
+ Internal changes.
413
+
414
+ #### `@mui/x-tree-view-pro@8.0.0-alpha.13` [![pro](https://mui.com/r/x-pro-svg)](https://mui.com/r/x-pro-svg-link 'Pro plan')
415
+
416
+ Same changes as in `@mui/x-tree-view@8.0.0-alpha.13`.
417
+
418
+ ### `@mui/x-codemod@8.0.0-alpha.13`
419
+
420
+ - [codemod] Add a few Data Grid codemods (#16711) @MBilalShafi
421
+ - [codemod] Improve Pickers renaming codemod (#16685) @LukasTy
422
+
423
+ ### Docs
424
+
425
+ - [docs] Fix charts with on bar and line pages (#16712) @alexfauquette
426
+ - [docs] Fix migration guide introduction for charts (#16679) @alexfauquette
427
+ - [docs] Fix remaining charts demos on mobile (#16728) @alexfauquette
428
+ - [docs] Fix scroll overflow on mobile (#16675) @oliviertassinari
429
+ - [docs] Improve Pickers migration page (#16682) @LukasTy
430
+ - [docs] Update small Pickers doc inconsistencies (#16724) @LukasTy
431
+ - [code-infra] Charts changes for `vitest` (#16755) @JCQuintas
432
+ - [code-infra] General packages changes for `vitest` (#16757) @JCQuintas
433
+ - [code-infra] Native Node.js ESM (#16603) @Janpot
434
+ - [infra] Update contributor acknowledgment wording (#16751) @michelengelen
435
+ - [test] Revert timeout increase for possibly slow tests (#16651) @LukasTy
436
+ - [x-license] Introduce usage telemetry (#13530) @hasdfa
437
+
8
438
  ## 8.0.0-alpha.12
9
439
 
10
440
  _Feb 17, 2025_
@@ -10,6 +10,8 @@ exports.RichTreeViewRoot = exports.RichTreeView = void 0;
10
10
  var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
11
11
  var React = _interopRequireWildcard(require("react"));
12
12
  var _propTypes = _interopRequireDefault(require("prop-types"));
13
+ var _Alert = _interopRequireDefault(require("@mui/material/Alert"));
14
+ var _Typography = _interopRequireDefault(require("@mui/material/Typography"));
13
15
  var _composeClasses = _interopRequireDefault(require("@mui/utils/composeClasses"));
14
16
  var _useSlotProps = _interopRequireDefault(require("@mui/utils/useSlotProps"));
15
17
  var _warning = require("@mui/x-internals/warning");
@@ -19,6 +21,8 @@ var _useTreeView = require("../internals/useTreeView");
19
21
  var _TreeViewProvider = require("../internals/TreeViewProvider");
20
22
  var _RichTreeView = require("./RichTreeView.plugins");
21
23
  var _RichTreeViewItems = require("../internals/components/RichTreeViewItems");
24
+ var _useSelector = require("../internals/hooks/useSelector");
25
+ var _useTreeViewItems = require("../internals/plugins/useTreeViewItems/useTreeViewItems.selectors");
22
26
  var _jsxRuntime = require("react/jsx-runtime");
23
27
  const useThemeProps = (0, _zeroStyled.createUseThemeProps)('MuiRichTreeView');
24
28
  const useUtilityClasses = ownerState => {
@@ -69,6 +73,8 @@ const RichTreeView = exports.RichTreeView = /*#__PURE__*/React.forwardRef(functi
69
73
  rootRef: ref,
70
74
  props
71
75
  });
76
+ const isLoading = (0, _useSelector.useSelector)(contextValue.store, _useTreeViewItems.selectorIsTreeViewLoading);
77
+ const treeViewError = (0, _useSelector.useSelector)(contextValue.store, _useTreeViewItems.selectorGetTreeViewError);
72
78
  const {
73
79
  slots,
74
80
  slotProps
@@ -82,6 +88,17 @@ const RichTreeView = exports.RichTreeView = /*#__PURE__*/React.forwardRef(functi
82
88
  getSlotProps: getRootProps,
83
89
  ownerState: props
84
90
  });
91
+ if (isLoading) {
92
+ return /*#__PURE__*/(0, _jsxRuntime.jsx)(_Typography.default, {
93
+ children: "Loading..."
94
+ });
95
+ }
96
+ if (treeViewError) {
97
+ return /*#__PURE__*/(0, _jsxRuntime.jsx)(_Alert.default, {
98
+ severity: "error",
99
+ children: treeViewError.message
100
+ });
101
+ }
85
102
  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_TreeViewProvider.TreeViewProvider, {
86
103
  value: contextValue,
87
104
  children: /*#__PURE__*/(0, _jsxRuntime.jsx)(Root, (0, _extends2.default)({}, rootProps, {
@@ -107,8 +124,10 @@ process.env.NODE_ENV !== "production" ? RichTreeView.propTypes = {
107
124
  getItemDOMElement: _propTypes.default.func.isRequired,
108
125
  getItemOrderedChildrenIds: _propTypes.default.func.isRequired,
109
126
  getItemTree: _propTypes.default.func.isRequired,
110
- selectItem: _propTypes.default.func.isRequired,
127
+ getParentId: _propTypes.default.func.isRequired,
128
+ setIsItemDisabled: _propTypes.default.func.isRequired,
111
129
  setItemExpansion: _propTypes.default.func.isRequired,
130
+ setItemSelection: _propTypes.default.func.isRequired,
112
131
  updateItemLabel: _propTypes.default.func.isRequired
113
132
  })
114
133
  }),
@@ -212,7 +231,7 @@ process.env.NODE_ENV !== "production" ? RichTreeView.propTypes = {
212
231
  multiSelect: _propTypes.default.bool,
213
232
  /**
214
233
  * Callback fired when Tree Items are expanded/collapsed.
215
- * @param {React.SyntheticEvent} event The DOM event that triggered the change.
234
+ * @param {React.SyntheticEvent} event The DOM event that triggered the change. Can be null when the change is caused by the `publicAPI.setItemExpansion()` method.
216
235
  * @param {array} itemIds The ids of the expanded items.
217
236
  */
218
237
  onExpandedItemsChange: _propTypes.default.func,
@@ -224,7 +243,7 @@ process.env.NODE_ENV !== "production" ? RichTreeView.propTypes = {
224
243
  onItemClick: _propTypes.default.func,
225
244
  /**
226
245
  * Callback fired when a Tree Item is expanded or collapsed.
227
- * @param {React.SyntheticEvent} event The DOM event that triggered the change.
246
+ * @param {React.SyntheticEvent | null} event The DOM event that triggered the change. Can be null when the change is caused by the `publicAPI.setItemExpansion()` method.
228
247
  * @param {array} itemId The itemId of the modified item.
229
248
  * @param {array} isExpanded `true` if the item has just been expanded, `false` if it has just been collapsed.
230
249
  */
@@ -243,14 +262,14 @@ process.env.NODE_ENV !== "production" ? RichTreeView.propTypes = {
243
262
  onItemLabelChange: _propTypes.default.func,
244
263
  /**
245
264
  * Callback fired when a Tree Item is selected or deselected.
246
- * @param {React.SyntheticEvent} event The DOM event that triggered the change.
265
+ * @param {React.SyntheticEvent} event The DOM event that triggered the change. Can be null when the change is caused by the `publicAPI.setItemSelection()` method.
247
266
  * @param {array} itemId The itemId of the modified item.
248
267
  * @param {array} isSelected `true` if the item has just been selected, `false` if it has just been deselected.
249
268
  */
250
269
  onItemSelectionToggle: _propTypes.default.func,
251
270
  /**
252
271
  * Callback fired when Tree Items are selected/deselected.
253
- * @param {React.SyntheticEvent} event The DOM event that triggered the change.
272
+ * @param {React.SyntheticEvent} event The DOM event that triggered the change. Can be null when the change is caused by the `publicAPI.setItemSelection()` method.
254
273
  * @param {string[] | string} itemIds The ids of the selected items.
255
274
  * When `multiSelect` is `true`, this is an array of strings; when false (default) a string.
256
275
  */
@@ -106,8 +106,10 @@ process.env.NODE_ENV !== "production" ? SimpleTreeView.propTypes = {
106
106
  getItemDOMElement: _propTypes.default.func.isRequired,
107
107
  getItemOrderedChildrenIds: _propTypes.default.func.isRequired,
108
108
  getItemTree: _propTypes.default.func.isRequired,
109
- selectItem: _propTypes.default.func.isRequired,
110
- setItemExpansion: _propTypes.default.func.isRequired
109
+ getParentId: _propTypes.default.func.isRequired,
110
+ setIsItemDisabled: _propTypes.default.func.isRequired,
111
+ setItemExpansion: _propTypes.default.func.isRequired,
112
+ setItemSelection: _propTypes.default.func.isRequired
111
113
  })
112
114
  }),
113
115
  /**
@@ -180,7 +182,7 @@ process.env.NODE_ENV !== "production" ? SimpleTreeView.propTypes = {
180
182
  multiSelect: _propTypes.default.bool,
181
183
  /**
182
184
  * Callback fired when Tree Items are expanded/collapsed.
183
- * @param {React.SyntheticEvent} event The DOM event that triggered the change.
185
+ * @param {React.SyntheticEvent} event The DOM event that triggered the change. Can be null when the change is caused by the `publicAPI.setItemExpansion()` method.
184
186
  * @param {array} itemIds The ids of the expanded items.
185
187
  */
186
188
  onExpandedItemsChange: _propTypes.default.func,
@@ -192,7 +194,7 @@ process.env.NODE_ENV !== "production" ? SimpleTreeView.propTypes = {
192
194
  onItemClick: _propTypes.default.func,
193
195
  /**
194
196
  * Callback fired when a Tree Item is expanded or collapsed.
195
- * @param {React.SyntheticEvent} event The DOM event that triggered the change.
197
+ * @param {React.SyntheticEvent | null} event The DOM event that triggered the change. Can be null when the change is caused by the `publicAPI.setItemExpansion()` method.
196
198
  * @param {array} itemId The itemId of the modified item.
197
199
  * @param {array} isExpanded `true` if the item has just been expanded, `false` if it has just been collapsed.
198
200
  */
@@ -205,14 +207,14 @@ process.env.NODE_ENV !== "production" ? SimpleTreeView.propTypes = {
205
207
  onItemFocus: _propTypes.default.func,
206
208
  /**
207
209
  * Callback fired when a Tree Item is selected or deselected.
208
- * @param {React.SyntheticEvent} event The DOM event that triggered the change.
210
+ * @param {React.SyntheticEvent} event The DOM event that triggered the change. Can be null when the change is caused by the `publicAPI.setItemSelection()` method.
209
211
  * @param {array} itemId The itemId of the modified item.
210
212
  * @param {array} isSelected `true` if the item has just been selected, `false` if it has just been deselected.
211
213
  */
212
214
  onItemSelectionToggle: _propTypes.default.func,
213
215
  /**
214
216
  * Callback fired when Tree Items are selected/deselected.
215
- * @param {React.SyntheticEvent} event The DOM event that triggered the change.
217
+ * @param {React.SyntheticEvent} event The DOM event that triggered the change. Can be null when the change is caused by the `publicAPI.setItemSelection()` method.
216
218
  * @param {string[] | string} itemIds The ids of the selected items.
217
219
  * When `multiSelect` is `true`, this is an array of strings; when false (default) a string.
218
220
  */
@@ -11,6 +11,8 @@ export declare const TreeItemLabel: import("@emotion/styled").StyledComponent<im
11
11
  }, React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
12
12
  export declare const TreeItemIconContainer: import("@emotion/styled").StyledComponent<import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, Pick<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof React.ClassAttributes<HTMLDivElement> | keyof React.HTMLAttributes<HTMLDivElement>>, {}>;
13
13
  export declare const TreeItemGroupTransition: import("@emotion/styled").StyledComponent<Pick<import("@mui/material").CollapseProps, keyof import("@mui/material").CollapseProps> & import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, {}, {}>;
14
+ export declare const TreeItemErrorContainer: import("@emotion/styled").StyledComponent<import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, Pick<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof React.ClassAttributes<HTMLDivElement> | keyof React.HTMLAttributes<HTMLDivElement>>, {}>;
15
+ export declare const TreeItemLoadingContainer: import("@emotion/styled").StyledComponent<Pick<import("@mui/material").CircularProgressProps, keyof import("@mui/material").CircularProgressProps> & import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, {}, {}>;
14
16
  export declare const TreeItemCheckbox: import("@emotion/styled").StyledComponent<Pick<Omit<CheckboxProps & {
15
17
  visible?: boolean;
16
18
  }, "ref"> & React.RefAttributes<HTMLButtonElement>, "hidden" | "visible" | "color" | "content" | "size" | "style" | "icon" | "translate" | "disabled" | "form" | "slot" | "title" | "action" | "checked" | "formAction" | "formEncType" | "formMethod" | "formNoValidate" | "formTarget" | "name" | "readOnly" | "required" | "value" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "autoCapitalize" | "autoFocus" | "className" | "contentEditable" | "contextMenu" | "dir" | "draggable" | "enterKeyHint" | "id" | "lang" | "nonce" | "spellCheck" | "tabIndex" | "radioGroup" | "role" | "about" | "datatype" | "inlist" | "prefix" | "property" | "rel" | "resource" | "rev" | "typeof" | "vocab" | "autoCorrect" | "autoSave" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "popover" | "popoverTargetAction" | "popoverTarget" | "inert" | "inputMode" | "is" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-braillelabel" | "aria-brailleroledescription" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colindextext" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-description" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowindextext" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChange" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onResize" | "onResizeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClick" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerLeave" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onToggle" | "onBeforeToggle" | "onTransitionCancel" | "onTransitionCancelCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "onTransitionRun" | "onTransitionRunCapture" | "onTransitionStart" | "onTransitionStartCapture" | "component" | "sx" | "classes" | "centerRipple" | "disableRipple" | "disableTouchRipple" | "focusRipple" | "focusVisibleClassName" | "LinkComponent" | "onFocusVisible" | "TouchRippleProps" | "touchRippleRef" | "disableFocusRipple" | "edge" | "checkedIcon" | "inputProps" | "inputRef" | "indeterminate" | "indeterminateIcon" | keyof React.RefAttributes<HTMLButtonElement>> & import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, {}, {}>;