@mui/styled-engine 5.10.8 โ†’ 5.10.16

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 CHANGED
@@ -1,5 +1,584 @@
1
1
  # [Versions](https://mui.com/versions/)
2
2
 
3
+ ## 5.10.16
4
+
5
+ <!-- generated comparing v5.10.15..master -->
6
+
7
+ _Nov 28, 2022_
8
+
9
+ A big thanks to the 13 contributors who made this release possible. This release contains various ๐Ÿ› bug fixes, ๐Ÿ“š documentation, and โš™๏ธ infrastructure improvements.
10
+
11
+ ### `@mui/material@5.10.16`
12
+
13
+ - &#8203;<!-- 21 -->[Autocomplete] Fix inferred value type when `multiple` prop is `true` (#35275) @fenghan34
14
+ - &#8203;<!-- 19 -->[Chip] Add `skipFocusWhenDisabled` prop to not allow focussing deletable chip if disabled (#35065) @sai6855
15
+ - &#8203;<!-- 18 -->[Chip] Remove unnecessary handleKeyDown event handler (#35231) @ZeeshanTamboli
16
+ - &#8203;<!-- 05 -->[FormControl] Add missing types in `useFormControl` (#35168) @ZeeshanTamboli
17
+ - &#8203;<!-- 04 -->[IconButton] Add missing color classes (#33820) @Zetta56
18
+ - &#8203;<!-- 03 -->[SwipeableDrawer] Make paper ref accessible (#35082) @sai6855
19
+
20
+ ### `@mui/system@5.10.16`
21
+
22
+ - &#8203;<!-- 02 -->[system] Remove unnecessary parsed theme (#35239) @siriwatknp
23
+ - &#8203;<!-- 01 -->[theme] Fix TypeScript type for custom variants in responsive font sizes (#35057) @ZeeshanTamboli
24
+
25
+ ### `@mui/base@5.0.0-alpha.108`
26
+
27
+ - &#8203;<!-- 20 -->[Base] Allow useSlotProps to receive undefined elementType (#35192) @leventdeniz
28
+
29
+ ### Docs
30
+
31
+ - &#8203;<!-- 13 -->[docs] Improve feedback precision (#34641) @alexfauquette
32
+ - &#8203;<!-- 12 -->[docs] Add Black Friday notification @oliviertassinari
33
+ - &#8203;<!-- 11 -->[docs] Fix migration feedback (#35232) @alexfauquette
34
+ - &#8203;<!-- 10 -->[docs] Improve the useSelect demo styling (#33883) @michaldudak
35
+ - &#8203;<!-- 09 -->[docs] Fix layout jump on first mistake (#35215) @oliviertassinari
36
+ - &#8203;<!-- 08 -->[docs] Support demos with side effect imports (#35177) @m4theushw
37
+ - &#8203;<!-- 07 -->[examples] Fix Next.js errors (#35246) @oliviertassinari
38
+ - &#8203;<!-- 06 -->[examples] Updated Remix examples with the lates changes using React 18 (#35092) @58bits
39
+
40
+ ### Core
41
+
42
+ - &#8203;<!-- 17 -->[core] Remove unused pattern (#35165) @iamxukai
43
+ - &#8203;<!-- 16 -->[core] Fix Base version in changelog (#35224) @siriwatknp
44
+ - &#8203;<!-- 15 -->[core] Migrate `describeConformance` to TypeScript (#35193) @flaviendelangle
45
+ - &#8203;<!-- 14 -->[core] Skip CI for docs and examples paths (#35225) @siriwatknp
46
+
47
+ All contributors of this release in alphabetical order: @58bits, @alexfauquette, @fenghan34, @flaviendelangle, @iamxukai, @leventdeniz, @m4theushw, @michaldudak, @oliviertassinari, @sai6855, @siriwatknp, @ZeeshanTamboli, @Zetta56
48
+
49
+ ## 5.10.15
50
+
51
+ <!-- generated comparing v5.10.14..master -->
52
+
53
+ _Nov 21, 2022_
54
+
55
+ A big thanks to the 9 contributors who made this release possible. Here are some highlights โœจ:
56
+
57
+ - ๐Ÿš€ @mnajdova added the button as the first component that implements [Material You](https://m3.material.io/) design (MD3)
58
+ - ๐ŸŒ @MBilalShafi added Urdu (Pakistan) localization
59
+ - Many other ๐Ÿ› bug fixes, ๐Ÿ“š documentation, and โš™๏ธ infrastructure improvements
60
+
61
+ ### `@mui/material@5.10.15`
62
+
63
+ - [Autocomplete] Fix keyboard navigation when using custom popover (#35160) @sai6855
64
+ - [typescript] Add `background.defaultChannel` to `CssVarsPalette` (#35174) @alexfauquette
65
+ - [l10n] Add Urdu (ur-PK) locale (#35154) @MBilalShafi
66
+
67
+ ### `@mui/icons-material@5.10.15`
68
+
69
+ - [icons] Update the Material Design icons (#35194) @michaldudak
70
+
71
+ ### `@mui/material-next@6.0.0-alpha.63`
72
+
73
+ - [Material You] Add theme structure & Button component (#34650) @mnajdova
74
+
75
+ ### `@mui/base@5.0.0-alpha.107`
76
+
77
+ - [Select] Add attributes to conform with ARIA 1.2 (#35182) @michaldudak
78
+
79
+ ### Docs
80
+
81
+ - [docs] Fix a couple documentation errors (#35217) @danilo-leal
82
+ - [docs] Change MUI -> Material UI in icons-material's readme (#35220) @michaldudak
83
+ - [docs] the pages have no <link rel=canonical so we need to tell Google to not index the staging envs @oliviertassinari
84
+ - [docs] Fix confusion in TOCs when reaching scroll bottom (#35214) @oliviertassinari
85
+ - [docs] Fix typos in section titles (#35025) @iamxukai
86
+ - [docs] Fix typo in legacy date picker migration guide @oliviertassinari
87
+ - [docs] Iterating on recent Joy UI Component page updates (#35162) @samuelsycamore
88
+ - [docs] Inform that pickers are in X repository (#35189) @alexfauquette
89
+ - [docs] Explain how the `error` prop works in the Unstyled Input (#35171) @michaldudak
90
+ - [docs] Hotfix missing styles in dark mode (#35179) @siriwatknp
91
+ - [docs] Add Joy UI theme typography page (#34811) @siriwatknp
92
+ - [docs] Fix undo/redo in live editor (#35163) @oliviertassinari
93
+ - [docs] Revise the Joy UI "Avatar" component page (#35152) @samuelsycamore
94
+ - [docs] Make navbar backdrop filter consistent with website (#35157) @danilo-leal
95
+ - [docs] Host CodeSandbox on MUI org (#35110) @oliviertassinari
96
+ - [docs] Uplift introduction demos & make consistent with Base (#34316) @danilo-leal
97
+ - [website] Add Security questionnaire in pricing (#35172) @oliviertassinari
98
+ - [website] Fix theme mode toggle state (#35216) @siriwatknp
99
+ - [website] Exclude experiment pages in production (#35180) @siriwatknp
100
+ - [website] Disable SEO for performance pages (#35173) @oliviertassinari
101
+
102
+ ### Core
103
+
104
+ - [core] Convert icons scripts to ESM (#35101) @Janpot
105
+ - [core] Group renovate GitHub Action dependency updates @oliviertassinari
106
+ - [core] Upgrade eslint-config-airbnb-typescript (#34642) @Janpot
107
+ - [core] Ensure that prettier CI step fails when code is badly formatted (#35170) @michaldudak
108
+
109
+ All contributors of this release in alphabetical order: @alexfauquette, @danilo-leal, @iamxukai, @Janpot, @MBilalShafi, @michaldudak, @oliviertassinari, @samuelsycamore, @siriwatknp
110
+
111
+ ## v5.10.14
112
+
113
+ <!-- generated comparing v5.10.13..master -->
114
+
115
+ _Nov 14, 2022_
116
+
117
+ A big thanks to the 17 contributors who made this release possible. Here are some highlights โœจ:
118
+
119
+ - ๐Ÿš€ @siriwatknp added the Autocomplete component to the Joy UI (#34315)
120
+ - โ™ฟ @sfavello improved the accessibility of the Material UI's Autocomplete by adding support for the Delete key (#33822)
121
+ - Many other ๐Ÿ› bug fixes, ๐Ÿ“š documentation, and โš™๏ธ infrastructure improvements.
122
+
123
+ ### `@mui/material@5.10.14`
124
+
125
+ - [Material UI] Add `palette.background.defaultChannel` token (#35061) @siriwatknp
126
+ - [Autocomplete] Remove tags with the Delete key (#33822) @sfavello
127
+ - [IconButton] custom color causes type error (#34521) @kushagra010
128
+
129
+ ### `@mui/system@5.10.14`
130
+
131
+ - [Unstable_Gridv2] sorted responsize keys based on breakpoint value (#34987) @sai6855
132
+
133
+ ### `@mui/joy@5.0.0-alpha.54`
134
+
135
+ - [Joy] Export `FormControl`, `LinearProgress` and `ListSubheader` components from `@mui/joy` (#35003) @Studio384
136
+ - [Joy] Miscellaneous fixes (#35044) @siriwatknp
137
+ - [Joy] Add `Autocomplete` component (#34315) @siriwatknp
138
+ - [Joy] Saturate a bit the gray palette (#35148) @danilo-leal
139
+ - [Autocomplete][joy] Fix types (#35153) @siriwatknp
140
+
141
+ ### Docs
142
+
143
+ - [blog] Fix font size of code blocks on iOS @oliviertassinari
144
+ - [docs] Accessibility - increase default contrastThreshold for WCAG AA compliance (#34901) @kennethbigler
145
+ - [docs] Correct the keepMounted section on the Drawer page (#35076) @michaldudak
146
+ - [docs] Fix code editor styles mismatches (#35108) @oliviertassinari
147
+ - [docs] Allows to access the next MUI-X (#34798) @alexfauquette
148
+ - [docs] Fix bugs with live edit demos (#35106) @oliviertassinari
149
+ - [docs] Fix `MarkdownElement` regression from adding CSS variables (#35096) @siriwatknp
150
+ - [docs] Add a new gold sponsor (#35089) @hbjORbj
151
+ - [docs] Fix scroll issue on expanded live demos (#35064) @bharatkashyap
152
+ - [docs] Improve alignment of the sponsors @oliviertassinari
153
+ - [docs] Improve code font family v2 (#35053) @oliviertassinari
154
+ - [docs] Upgrade to Next.js 13 (#35001) @mnajdova
155
+ - [docs] Fix typo in changelog @oliviertassinari
156
+ - [docs] Update Joy UI templates to use latest components (#35058) @siriwatknp
157
+ - [website] Fix design kits showcase throwing an error (#35093) @cherniavskii
158
+ - [website] Fix margin bug on CTA @oliviertassinari
159
+ - [website] Link respective repositories in product pages (#35046) @sidtohan
160
+ - [website] Migrate blog pages to use CSS theme variables (#34976) @siriwatknp
161
+ - [website] Update DoiT International logo and links with new brand (#35030) @ofir5300
162
+ - [website] Improve visual design app bar (#35111) @oliviertassinari
163
+
164
+ ### Core
165
+
166
+ - [core] Convert scripts to ES modules (#35036) @michaldudak
167
+ - [core] Show the whole version to make blame easier @oliviertassinari
168
+ - [core] Polish GitHub Action version @oliviertassinari
169
+ - [core] Ignore icons to speed up CodeQL @oliviertassinari
170
+ - [core] Feedback on branch protection @oliviertassinari
171
+ - [core] Revert CI (#35098) @siriwatknp
172
+ - [core] Fix job name to match the CI (#35097) @siriwatknp
173
+ - [core] ESLint fixes for tests (#34924) @Janpot
174
+ - [core] Ignore unrelated folders from github actions (#35028) @siriwatknp
175
+ - [core] Use pretty-quick instead of custom script (#34062) @Janpot
176
+
177
+ All contributors of this release in alphabetical order: @alexfauquette, @bharatkashyap, @cherniavskii, @danilo-leal, @hbjORbj, @Janpot, @kennethbigler, @kushagra010, @michaldudak, @mnajdova, @ofir5300, @oliviertassinari, @sai6855, @sfavello, @sidtohan, @siriwatknp, @Studio384
178
+
179
+ ## v5.10.13
180
+
181
+ <!-- generated comparing v5.10.12..master -->
182
+
183
+ _Nov 7, 2022_
184
+
185
+ A big thanks to the 12 contributors who made this release possible. Here are some highlights โœจ:
186
+
187
+ - ๐Ÿš€ The slots API has been introduced to the Material UI package by @michaldudak (#34873).
188
+ - ๐Ÿ”ฅ Live editing of demos is stabilized by @oliviertassinari (#34870).
189
+ - Many other ๐Ÿ› bug fixes, ๐Ÿ“š documentation, and โš™๏ธ infrastructure improvements.
190
+
191
+ ### `@mui/material@5.10.13`
192
+
193
+ - &#8203;<!-- 08 -->[material-ui] Introduce the slots API (#34873) @michaldudak
194
+ - &#8203;<!-- 07 -->[NativeSelectInput] Support CSS theme variables (#34975) @siriwatknp
195
+
196
+ ### `@mui/system@5.10.13`
197
+
198
+ - &#8203;<!-- 05 -->[system] Add a missing key attribute in getInitColorScheme to fix key issue (#34992) @akshaya-venkatesh8
199
+
200
+ ### `@mui/base@5.0.0-alpha.105`
201
+
202
+ - &#8203;<!-- 26 -->[base] Avoid calling setState during renders (#34916) @Janpot
203
+
204
+ ### `@mui/joy@5.0.0-alpha.53`
205
+
206
+ - &#8203;<!-- 06 -->[Select] Fix custom options menu not opening on Avatar click (#34648) @shivam1646
207
+
208
+ ### Docs
209
+
210
+ - &#8203;<!-- 20 -->[docs] Add a guide for setting dark mode by default (#34839) @siriwatknp
211
+ - &#8203;<!-- 19 -->[docs] Improve code font family (#35027) @oliviertassinari
212
+ - &#8203;<!-- 18 -->[docs] Revise and expand Joy UI "Alert" page (#34838) @samuelsycamore
213
+ - &#8203;<!-- 17 -->[docs] Live demos v2 (#34870) @oliviertassinari
214
+ - &#8203;<!-- 16 -->[docs] Fix 301 links in the docs @oliviertassinari
215
+ - &#8203;<!-- 15 -->[docs] Fix code display in RTL (#34951) @oliviertassinari
216
+ - &#8203;<!-- 14 -->[docs] New API design rule disabled > disable (#34972) @oliviertassinari
217
+ - &#8203;<!-- 13 -->[docs] Explain the usage of Select's onOpen/onClose in the uncontrolled mode (#34755) @michaldudak
218
+ - &#8203;<!-- 12 -->[docs] Add a new gold sponsor (#34984) @hbjORbj
219
+ - &#8203;<!-- 11 -->[docs] Add author and published_time meta tags (#34382) @alexfauquette
220
+ - &#8203;<!-- 10 -->[examples] Next.js examples v13 - fonts (#34971) @PetroSilenius
221
+ - &#8203;<!-- 09 -->[examples] Next.js examples v13 - links (#34970) @PetroSilenius
222
+ - &#8203;<!-- 04 -->[website] Update IPinfo.AI name @oliviertassinari
223
+ - &#8203;<!-- 03 -->[website] Remove date-io from the docs dependencies (#34748) @michaldudak
224
+ - &#8203;<!-- 02 -->[website] Migrate Design-kits page to use CSS theme variables (#34920) @jesrodri
225
+ - &#8203;<!-- 01 -->[website] Migrate Pricing page to use CSS theme variables (#34917) @trizotti
226
+
227
+ ### Core
228
+
229
+ - &#8203;<!-- 25 -->[core] Remove default access to GitHub action scopes @oliviertassinari
230
+ - &#8203;<!-- 24 -->[core] Fix Pinned-Dependencies @oliviertassinari
231
+ - &#8203;<!-- 23 -->[core] Fix typos in the component name @oliviertassinari
232
+ - &#8203;<!-- 22 -->[core] Fix scorecard regression @oliviertassinari
233
+ - &#8203;<!-- 21 -->[core] Create the docs theme once (#34954) @oliviertassinari
234
+
235
+ All contributors of this release in alphabetical order: @akshaya-venkatesh8, @alexfauquette, @hbjORbj, @Janpot, @jesrodri, @michaldudak, @oliviertassinari, @PetroSilenius, @samuelsycamore, @shivam1646, @siriwatknp, @trizotti
236
+
237
+ ## v5.10.12
238
+
239
+ <!-- generated comparing v5.10.11..master -->
240
+
241
+ _Oct 31, 2022_
242
+
243
+ A big thanks to the 16 contributors who made this release possible. Here are some highlights โœจ:
244
+
245
+ - ๐Ÿš€ The LinearProgress component has been added to Joy UI by @hbjORbj (#34514).
246
+ - Many other ๐Ÿ› bug fixes, ๐Ÿ“š documentation, and โš™๏ธ infrastructure improvements.
247
+
248
+ ### `@mui/material@5.10.12`
249
+
250
+ - &#8203;<!-- 37 -->[Chip] Don't override icon color (#34247) @emlai
251
+ - &#8203;<!-- 09 -->[Radio] Skip default hover style when disableRipple is set (#34902) @VinceCYLiao
252
+ - &#8203;<!-- 08 -->[SwipeableDrawer] Fix React 18 issues (#34505) @mnajdova
253
+ - &#8203;<!-- 05 -->[Tooltip] Save a few bytes (#34853) @oliviertassinari
254
+
255
+ ### `@mui/base@5.0.0-alpha.104`
256
+
257
+ - &#8203;<!-- 38 -->[ButtonUnstyled] Update to render as link when href or to is provided (#34337) @EduardoSCosta
258
+
259
+ ### `@mui/joy@5.0.0-alpha.52`
260
+
261
+ - &#8203;<!-- 36 -->[Joy][circularprogress] Prevent new styles from being generated when `value` changes (#34897) @hbjORbj
262
+ - &#8203;<!-- 11 -->[Joy] Add color inversion feature (#32511) @siriwatknp
263
+ - &#8203;<!-- 10 -->[Joy] Add `LinearProgress` component (#34514) @hbjORbj
264
+
265
+ ### Docs
266
+
267
+ - &#8203;<!-- 40 -->[blog] Add blog post for high-level overview of all MUI products (#34325) @samuelsycamore
268
+ - &#8203;<!-- 39 -->[blog] Fix hydration mistmatch (#34857) @oliviertassinari
269
+ - &#8203;<!-- 21 -->[docs] Revise the Joy UI "Aspect Ratio" page (#34858) @samuelsycamore
270
+ - &#8203;<!-- 20 -->[docs] Fix Safari code font size (#34859) @oliviertassinari
271
+ - &#8203;<!-- 19 -->[docs] Fix spelling mistake (#34955) @punithnayak
272
+ - &#8203;<!-- 18 -->[docs] Fix 404 link of supported Material UI components @oliviertassinari
273
+ - &#8203;<!-- 17 -->[docs] Fix Safari button misalignment (#34861) @oliviertassinari
274
+ - &#8203;<!-- 16 -->[docs] Fix typo in docs title (#34926) @PunitSoniME
275
+ - &#8203;<!-- 25 -->[docs] Fix missing emotion prefixes (#34958) @oliviertassinari
276
+ - &#8203;<!-- 26 -->[docs] Improve UI display for copy code (#34950) @oliviertassinari
277
+ - &#8203;<!-- 15 -->[docs] Standardize all MUI Core "Usage" pages (#34183) @samuelsycamore
278
+ - &#8203;<!-- 14 -->[docs] Update templates' readme files to include required dependencies (#34757) @michaldudak
279
+ - &#8203;<!-- 13 -->[docs] Fix inconsistent theme colors when applying custom colors in playground (#34866) @cherniavskii
280
+ - &#8203;<!-- 12 -->[docs] Fix typo in bottom-navigation.md (#34884) @RoodyCode
281
+ - &#8203;<!-- 07 -->[website] Migrate about-us page to use CSS theme variables (#34919) @brianlu2610
282
+ - &#8203;<!-- 06 -->[website] Migrate Product-Templates page to use CSS theme variables (#34913) @EduardoSCosta
283
+ - &#8203;<!-- 05 -->[website] Migrate career page to use CSS theme variables (#34908) @the-mgi
284
+ - &#8203;<!-- 04 -->[website] Update MUI X open and future roles + about page (#34894) @DanailH
285
+ - &#8203;<!-- 03 -->[website] Remove one DOM node (#34960) @oliviertassinari
286
+ - &#8203;<!-- 02 -->[website] Use `span` for icon image (#34914) @siriwatknp
287
+ - &#8203;<!-- 01 -->[website] Fix subscribe input with Safari (#34869) @oliviertassinari
288
+
289
+ ### Core
290
+
291
+ - &#8203;<!-- 35 -->[core] Ignore compiled icons in CodeQL @oliviertassinari
292
+ - &#8203;<!-- 34 -->[core] Add OSSF Scorecard action (#34854) @oliviertassinari
293
+ - &#8203;<!-- 40 -->[core] Fix extra GitHub Action permission (#34496) @sashashura
294
+ - &#8203;<!-- 33 -->[core] Fix duplicate id @oliviertassinari
295
+ - &#8203;<!-- 41 -->[core] Enforce import \* as React (#34878) @da0x
296
+ - &#8203;<!-- 32 -->[core] A couple of simply fixes from #34870 (#34953) @oliviertassinari
297
+ - &#8203;<!-- 31 -->[core] Migrate outdated pattern to convention @oliviertassinari
298
+ - &#8203;<!-- 30 -->[core] Pin GitHub Actions dependencies (#34929) @renovate[bot]
299
+ - &#8203;<!-- 29 -->[core] Make the reproduction more important in the bug template (#34875) @oliviertassinari
300
+ - &#8203;<!-- 28 -->[core] Fix docs GitHub API rate limit (#34856) @oliviertassinari
301
+ - &#8203;<!-- 42 -->[core] Fix eslint issues (#34964) @mnajdova
302
+ - &#8203;<!-- 27 -->[core] Pin GitHub Action to digests (#34855) @oliviertassinari
303
+ - &#8203;<!-- 26 -->[core] Fix permissions in workflow @oliviertassinari
304
+ - &#8203;<!-- 25 -->[core] memoize context values for react/jsx-no-constructed-context-values (#34849) @Janpot
305
+ - &#8203;<!-- 24 -->[core] Fix @typescript-eslint/default-param-last issues (#34846) @Janpot
306
+ - &#8203;<!-- 23 -->[core] Fix HTML validation error (#34860) @oliviertassinari
307
+ - &#8203;<!-- 22 -->[core] Fix duplicate CodeQL build @oliviertassinari
308
+ - &#8203;<!-- 07 -->[test] Move Firefox tests to CircleCI (#34764) @oliviertassinari
309
+ - &#8203;<!-- 06 -->[test] Use screen when possible for simplicity (#34890) @oliviertassinari
310
+
311
+ All contributors of this release in alphabetical order: @cherniavskii, @DanailH, @EduardoSCosta, @emlai, @hbjORbj, @Janpot, @michaldudak, @mnajdova, @oliviertassinari, @punithnayak, @PunitSoniME, @renovate[bot], @RoodyCode, @samuelsycamore, @siriwatknp, @VinceCYLiao
312
+
313
+ ## v5.10.11
314
+
315
+ <!-- generated comparing v5.10.10..master -->
316
+
317
+ _Oct 25, 2022_
318
+
319
+ A big thanks to the 10 contributors who made this release possible. Here are some highlights โœจ:
320
+
321
+ - ๐Ÿ”ง Moved `components` to `slots` prop starting at MUI Base to create consistency across products
322
+ - Many other ๐Ÿ› bug fixes, ๐Ÿ“š documentation, and โš™๏ธ infrastructure improvements
323
+
324
+ ### `@mui/material@5.10.11`
325
+
326
+ - [InputBase] Fix `onInvalid` to use HTMLInputElement | HTMLTextAreaElement Element type (#33162) @KuSh
327
+ - [Alert] Add `components` and `componentsProps` props to allow close action overrides (#33582) @jake-collibra
328
+
329
+ ### `@mui/base@5.0.0-alpha.103`
330
+
331
+ #### BREAKING CHANGE
332
+
333
+ - [base] `components` -> `slots` API rename (#34693) @michaldudak
334
+
335
+ - Change all occurrences ofย componentsย andย componentsPropsย props in Base components toย slotsย andย slotProps, respectively.
336
+ - Change casing ofย slots' fields to camelCase
337
+
338
+ ```diff
339
+ -<SwitchUnstyled components={{Root: CustomRoot}} componentsProps={{rail: { className: 'custom-rail' }}} />
340
+ +<SwitchUnstyled slots={{root: CustomRoot}} slotProps={{rail: { className: 'custom-rail' }}} />
341
+ ```
342
+
343
+ - [base] Make CSS class prefixes consistent (#33411) @michaldudak
344
+
345
+ **This is a breaking change for anyone who depends on the class names applied to Base components.**
346
+ If you use the `<component>UnstyledClasses` objects, you won't notice a difference. Only if you depend on the resulting class names (e.g. in CSS stylesheets), you'll have to adjust your code.
347
+
348
+ ```diff
349
+ -.ButtonUnstyled-root { ... };
350
+ +.MuiButton-root { ... };
351
+ ```
352
+
353
+ #### Changes
354
+
355
+ - [test] Test all Base components with describeConformanceUnstyled (#34825) @michaldudak
356
+
357
+ ### `@mui/joy@5.0.0-alpha.51`
358
+
359
+ - [CircularProgress][joy] Fix classnames and add test (#34806) @hbjORbj
360
+ - [Joy] Allow string type for `size` prop in components (#34805) @hbjORbj
361
+
362
+ ### Docs
363
+
364
+ - Revert "[docs] Fix search icons in other languages (#34823)" @oliviertassinari
365
+ - Revert "[core] Move SearchIcons to docs src folder (#34802)" @oliviertassinari
366
+ - Revert "[docs] Live demos (#34454)" @oliviertassinari
367
+ - Update the order of operations for pagination example so that slicing takes place after sorting. (#34189) @marceliwac
368
+ - [docs] Gatsby Description in Joy dark-mode (#34702) @pixelass
369
+ - [docs] Add notification for blogpost MUI X v6 alpha (#34809) @joserodolfofreitas
370
+ - [docs] Polish Crowdin config (#34852) @oliviertassinari
371
+ - [docs] Fix a few style standard deviations @oliviertassinari
372
+ - [docs] Enforce no trailing spaces (#34762) @oliviertassinari
373
+ - [docs] Enforce correct git diff format (#34765) @oliviertassinari
374
+ - [docs] Fix Toolpad docs 301 route (#34843) @bharatkashyap
375
+ - [docs] Replace initial value with theme white (#34822) @siriwatknp
376
+ - [docs] Remove localization redirects (#34844) @mnajdova
377
+ - [docs] Fix search icons in other languages (#34823) @siriwatknp
378
+ - [docs] Fix JavaScript capitalization @oliviertassinari
379
+ - [docs] Update new links to MD2 (#34848) @oliviertassinari
380
+ - [website] Update future work items on X landing page (#34810) @joserodolfofreitas
381
+ - [website] Add Toolpad docs to navigation (#34749) @bharatkashyap
382
+
383
+ ### Core
384
+
385
+ - [core] Remove dead files (#34850) @oliviertassinari
386
+ - [core] Fix revert conflict @oliviertassinari
387
+ - [core] Fix a few CodeQL errors (#34766) @oliviertassinari
388
+ - [core] Harden GitHub Actions permissions (#34769) @oliviertassinari
389
+ - [core] Remove the codeowners file (#34876) @michaldudak
390
+
391
+ All contributors of this release in alphabetical order: @bharatkashyap, @hbjORbj, @jake-collibra, @joserodolfofreitas, @KuSh, @marceliwac, @michaldudak, @oliviertassinari, @pixelass, @siriwatknp
392
+
393
+ ## 5.10.10
394
+
395
+ <!-- generated comparing v5.10.9..master -->
396
+
397
+ _Oct 18, 2022_
398
+
399
+ A big thanks to the 21 contributors who made this release possible. Here are some highlights โœจ:
400
+
401
+ - ๐Ÿ–Œ Thanks to the efforts of @bharatkashyap and @nihgwu, we now have editable demos across our docs (#34454)!
402
+ - ๐Ÿš€ The Tooltip component has been added to Joy UI by @hbjORbj (#34509).
403
+ - โš™๏ธ We started converting the remaining JS components in MUI Base to TypeScript.
404
+ @mbayucot finished the first PR with the conversion of the NoSsr code (#34735).
405
+ - And more ๐Ÿ› bug fixes and ๐Ÿ“š documentation improvements.
406
+
407
+ ### `@mui/material@5.10.10`
408
+
409
+ - [Popover] Fix paper position flash on open (#34546) @TheUnlocked
410
+ - [SwipeableDrawer] Make component `defaultProps` overridable (#34643) @hbjORbj
411
+
412
+ ### `@mui/system@5.10.10`
413
+
414
+ - [system] Support CSS `grey` color in `sx` (#34548) @TheUnlocked
415
+
416
+ ### `@mui/styles@5.10.10`
417
+
418
+ - [styles] Use memoized context in StylesProvider (#34637) @mohd-akram
419
+
420
+ ### `@mui/joy@5.0.0-alpha.50`
421
+
422
+ - [Select][joy] Added hidden input element (#34657) @zee-bit
423
+ - [Slider][joy] Add global variant to slider (#34733) @siriwatknp
424
+ - [Tooltip][joy] Add component (#34509) @hbjORbj
425
+
426
+ ### `@mui/base@5.0.0-alpha.102`
427
+
428
+ - [MultiSelect][base] Prevent the renderValue prop from being propagated to the DOM (#34698) @michaldudak
429
+ - [NoSsr] Convert code to TypeScript (#34735) @mbayucot
430
+
431
+ ### Docs
432
+
433
+ - [docs] Fix the Autocomplete Highlighting example (#34184) @hayawata3626
434
+ - [docs] Fix typos in Base (Menu, Tabs) and Joy UI (Chip) (#34803) @rvrvrv
435
+ - [docs] Use new editing API in homepage demos (#34220) @m4theushw
436
+ - [docs] Live demos (#34454) @bharatkashyap
437
+ - [docs] Fix typos in Joy UI Switch (#34728) @ndresx
438
+ - [docs] Avoid scrollbar in the code demos (#34741) @oliviertassinari
439
+ - [docs] Revise the Joy UI "Automatic adjustment" page (#34614) @samuelsycamore
440
+ - [docs] Revise and rename the Joy UI "Perfect dark mode" page (#34613) @samuelsycamore
441
+ - [docs] Revise the Joy UI "Global variants" page (#34595) @samuelsycamore
442
+ - [docs] Basic link verification at PR level (#34588) @alexfauquette
443
+ - [docs] Add a missing comma in the customization example (#34617) @AbayKinayat
444
+ - [website] Clarify Pro/Premium support (#34607) @oliviertassinari
445
+ - [website] Fix home page dark mode flicker (#33545)
446
+ - [website] Update the state of the date pickers on the landing page (#34750) @joserodolfofreitas
447
+
448
+ ### Core
449
+
450
+ - [core] Clean conditionals (#34772) @pedroprado010
451
+ - [core] Temporary remove the authorization (#34796) @siriwatknp
452
+ - [core] Avoid slower CI run statues @oliviertassinari
453
+ - [core] Improve the playground DX (#34739) @oliviertassinari
454
+ - [core] Link Netlify in the danger comment (#34688) @oliviertassinari
455
+ - [core] Fix CI after out of sync merge @oliviertassinari
456
+ - [core] Enforce straight quote (#34686) @oliviertassinari
457
+ - [core] Add code scanning via CodeQL (#34707) @DanailH
458
+ - [core] Fix some upcoming eslint issues (#34727) @oliviertassinari
459
+ - [core] Auto-fix upcoming eslint issues (#34644) @Janpot
460
+ - [core] Move SearchIcons to docs src folder (#34802)
461
+ - [test] Enable `react/no-unstable-nested-components` (#34518) @eps1lon
462
+
463
+ All contributors of this release in alphabetical order: @AbayKinayat, @alexfauquette, @bharatkashyap, @DanailH, @eps1lon, @hayawata3626, @hbjORbj, @Janpot, @joserodolfofreitas, @m4theushw, @mbayucot, @michaldudak, @mohd-akram, @ndresx, @oliviertassinari, @pedroprado010, @rvrvrv, @samuelsycamore, @siriwatknp, @TheUnlocked, @zee-bit
464
+
465
+ ## 5.10.9
466
+
467
+ <!-- generated comparing v5.10.8..master -->
468
+
469
+ _Oct 10, 2022_
470
+
471
+ A big thanks to the 7 contributors who made this release possible. Here are some highlights โœจ:
472
+
473
+ - ๐Ÿš€ [Joy] Button loading functionality has been added by @kushagra010 (#34658)
474
+ - And more ๐Ÿ› bug fixes and ๐Ÿ“š documentation improvements.
475
+
476
+ ### `@mui/material@5.10.9`
477
+
478
+ - &#8203;<!-- 16 -->[Grid v2][system] Handle direction object prop for responsive design (#34574) @vanyaxk
479
+ - &#8203;<!-- 03 -->[Slider] Fix unnecessary accessibility attribute in root element (#34610) @vanyaxk
480
+
481
+ ### `@mui/system@5.10.9`
482
+
483
+ #### BREAKING CHANGE
484
+
485
+ - &#8203;<!-- 17 -->[system] Fix color-scheme implementation (#34639) @siriwatknp
486
+
487
+ The `enableColorScheme` prop has been removed from `CssVarsProvider` and `getInitColorScheme` (both Material UI and Joy UI).
488
+
489
+ Migration:
490
+
491
+ - **Material UI**: you can enable the CSS color scheme via `<CssBaseline enableColorScheme />`.
492
+ - **Joy UI**: it is enabled automatically if you use `<CssBaseline />`, [see the docs](https://mui.com/joy-ui/react-css-baseline/).
493
+
494
+ #### Changes
495
+
496
+ - &#8203;<!-- 02 -->[system] Fix typo in createCssVarsProvider (#34661) @HexM7
497
+
498
+ ### `@mui/base@5.0.0-alpha.101`
499
+
500
+ - &#8203;<!-- 01 -->[TrapFocus] Restore the previously exported type from @mui/material (#34601) @michaldudak
501
+
502
+ ### `@mui/joy@5.0.0-alpha.49`
503
+
504
+ - &#8203;<!-- 04 -->[Joy] Add button loading functionality (#34658) @kushagra010
505
+
506
+ ### Docs
507
+
508
+ - &#8203;<!-- 18 -->[docs] Revert #34541 (#34700) @michaldudak
509
+ - &#8203;<!-- 15 -->[blog] Blog post for MUI X v6 alpha zero (#34424) @joserodolfofreitas
510
+ - &#8203;<!-- 09 -->[docs] Improve Joy UI tutorial demo (#34653) @oliviertassinari
511
+ - &#8203;<!-- 08 -->[docs] Explain how SelectUnstyled renders a hidden input (#34638) @michaldudak
512
+ - &#8203;<!-- 07 -->[docs] Fix Taiwan description (#34611) @oliviertassinari
513
+ - &#8203;<!-- 06 -->[docs] Fix codesandbox export with dayjs (#34619) @oliviertassinari
514
+ - &#8203;<!-- 05 -->[docs] Explain the purpose of renderGroup prop (#34066) @michaldudak
515
+
516
+ ### Core
517
+
518
+ - &#8203;<!-- 14 -->[core] Make useForkRef variadic (#27939) @michaldudak
519
+ - &#8203;<!-- 13 -->[core] Speedup of yarn install in the CI (#34632) @oliviertassinari
520
+ - &#8203;<!-- 12 -->[core] Fix markdown loader on Windows (#34623) @michaldudak
521
+ - &#8203;<!-- 11 -->[core] Update changelog for version v5.10.8 (#34593) @mnajdova
522
+ - &#8203;<!-- 10 -->[core] Update root package.json version (#34592) @mnajdova
523
+
524
+ All contributors of this release in alphabetical order: @HexM7, @joserodolfofreitas, @kushagra010, @michaldudak, @mnajdova, @oliviertassinari, @vanyaxk
525
+
526
+ ## 5.10.8
527
+
528
+ <!-- generated comparing v5.10.7..master -->
529
+
530
+ _Oct 3, 2022_
531
+
532
+ A big thanks to the 18 contributors who made this release possible. Here are some highlights โœจ:
533
+
534
+ - ๐Ÿš€ [SnackbarUnstyled](https://mui.com/base/react-snackbar/) component & headless hook are added to MUI Base (#33227) @ZeeshanTamboli
535
+ - ๐Ÿ“š [CSS variables documentation](https://mui.com/material-ui/experimental-api/css-theme-variables/overview/) for Material UI has been added by @siriwatknp (#33958)
536
+ - And more ๐Ÿ› bug fixes and ๐Ÿ“š documentation improvements.
537
+
538
+ ### `@mui/material@5.10.8`
539
+
540
+ - &#8203;<!-- 28 -->[Autocomplete] Skip filtering when list of options is loading (#33278) @ndebeiss
541
+ - &#8203;<!-- 13 -->[Fab] Add `disabled` class to FAB button (#34245) @meenarama
542
+ - &#8203;<!-- 09 -->[l10n] Add Arabic Saudi Arabia (ar-SA) locale (#33340) @rolule
543
+ - &#8203;<!-- 08 -->[l10n] zhTW refinement (#33391) @Aporim2051
544
+ - &#8203;<!-- 07 -->[Popover] Add `ownerState` on the paper slot (#34445) @kabernardes
545
+ - &#8203;<!-- 05 -->[Slider] Fixed incorrect marks displayed due to duplicate keys in range (#33526) @kskd1804
546
+ - &#8203;<!-- 03 -->[TextField] Fix typo in FormControlLabel declaration file (#34535) @hghmn
547
+
548
+ ### `@mui/base@5.0.0-alpha.100`
549
+
550
+ - &#8203;<!-- 04 -->[SnackbarUnstyled] Create component and `useSnackbar` hook (#33227) @ZeeshanTamboli
551
+
552
+ ### `@mui/joy@5.0.0-alpha.48`
553
+
554
+ - &#8203;<!-- 12 -->[Joy] Fix `variantPlain` classname missing in few components (#34534) @hbjORbj
555
+ - &#8203;<!-- 11 -->[Joy] Fix input decorator color and list padding (#34586) @siriwatknp
556
+ - &#8203;<!-- 10 -->[Joy] Miscellaneous fixes (#34492) @siriwatknp
557
+
558
+ ### Docs
559
+
560
+ - &#8203;<!-- 27 -->[blog] Fix 404 link in base introduction @oliviertassinari
561
+ - &#8203;<!-- 21 -->[docs] Fix CI build (#34589) @mnajdova
562
+ - &#8203;<!-- 20 -->[docs] Temporary remove date picker from home page (#34541) @siriwatknp
563
+ - &#8203;<!-- 19 -->[docs] Revise and expand Joy UI "Tutorial" doc (#34569) @samuelsycamore
564
+ - &#8203;<!-- 18 -->[docs] Fix SEO issues (#34537) @oliviertassinari
565
+ - &#8203;<!-- 17 -->[docs] Add CSS variables documentation for Material UI (#33958) @siriwatknp
566
+ - &#8203;<!-- 16 -->[docs] Capitalize Material Design on the Breakpoints page (#34481) @Dustin-Digitar
567
+ - &#8203;<!-- 15 -->[docs] Able to load doc components inside markdown files (#34243) @flaviendelangle
568
+ - &#8203;<!-- 14 -->[docs] Use mouse pointer on esc button in the search modal (#34485) @minkyngkm
569
+ - &#8203;<!-- 02 -->[website] Fix typo in pricing FAQ @oliviertassinari
570
+ - &#8203;<!-- 01 -->[website] Move the React Engineer role from open to next (#34494) @mnajdova
571
+
572
+ ### Core
573
+
574
+ - &#8203;<!-- 26 -->[core] Update root package.json version (#34592) @mnajdova
575
+ - &#8203;<!-- 25 -->[core] Remove useless comment in fixtures (#34581) @Garz4
576
+ - &#8203;<!-- 24 -->[core] Fix link to CODE_OF_CONDUCT.md (#34543) @peippo
577
+ - &#8203;<!-- 23 -->[core] Remove outdated docsearch.js dependency (#34421) @oliviertassinari
578
+ - &#8203;<!-- 22 -->[core] Add `newFeature` to the typing of MuiPage (#34511) @flaviendelangle
579
+
580
+ All contributors of this release in alphabetical order: @Aporim2051, @Dustin-Digitar, @flaviendelangle, @Garz4, @hbjORbj, @hghmn, @kabernardes, @kskd1804, @meenarama, @minkyngkm, @mnajdova, @ndebeiss, @oliviertassinari, @peippo, @rolule, @samuelsycamore, @siriwatknp, @ZeeshanTamboli
581
+
3
582
  ## 5.10.7
4
583
 
5
584
  <!-- generated comparing v5.10.6..master -->
@@ -37,8 +616,8 @@ A big thanks to the 21 contributors who made this release possible. Here are som
37
616
  - [TrapFocus] Rename TrapFocus to FocusTrap (#34216) @kabernardes
38
617
 
39
618
  ```diff
40
- - import TrapFocus from โ€˜@mui/base/TrapFocusโ€™;
41
- + import FocusTrap from โ€˜@mui/base/FocusTrapโ€™;
619
+ -import TrapFocus from '@mui/base/TrapFocus';
620
+ +import FocusTrap from '@mui/base/FocusTrap';
42
621
  ```
43
622
 
44
623
  #### Changes
@@ -320,7 +899,7 @@ _Aug 22, 2022_
320
899
 
321
900
  A big thanks to the 11 contributors who made this release possible. Here are some highlights โœจ:
322
901
 
323
- - โœจ @michaldudak synced the Material Icons set with the latest from Google (#33988).
902
+ - โœจ @michaldudak synced the Material Icons set with the latest from Google (#33988).\
324
903
  A couple of icons changed their appearance. See the difference [on this Argos build](https://app.argos-ci.com/mui/material-ui/builds/4428]).
325
904
 
326
905
  ### `@mui/material@5.10.2`
@@ -1512,7 +2091,8 @@ All contributors of this release in alphabetical order: @abhinav-22-tech, @ainat
1512
2091
 
1513
2092
  _Apr 18, 2022_
1514
2093
 
1515
- A big thanks to the 11 contributors who made this release possible. This release is mostly about ๐Ÿ› bug fixes and ๐Ÿ“š documentation improvements.
2094
+ A big thanks to the 11 contributors who made this release possible.
2095
+ This release is mostly about ๐Ÿ› bug fixes and ๐Ÿ“š documentation improvements.
1516
2096
 
1517
2097
  ### `@mui/material@5.6.2`
1518
2098
 
@@ -1571,7 +2151,7 @@ All contributors of this release in alphabetical order: @abaker93, @cherniavskii
1571
2151
 
1572
2152
  _Apr 11, 2022_
1573
2153
 
1574
- A big thanks to the 8 contributors who made this release possible.
2154
+ A big thanks to the 8 contributors who made this release possible.
1575
2155
  This release is mostly about ๐Ÿ› bug fixes and ๐Ÿ“š documentation improvements.
1576
2156
 
1577
2157
  ### `@mui/material@5.6.1`
@@ -1734,7 +2314,7 @@ A big thanks to the 17 contributors who made this release possible. Here are som
1734
2314
  -import { Unstyled_TrapFocus } from '@mui/base';
1735
2315
  +import { TrapFocus } from '@mui/base';
1736
2316
 
1737
- // or
2317
+ // or
1738
2318
 
1739
2319
  -import TrapFocus from '@mui/base/Unstyled_TrapFocus';
1740
2320
  +import TrapFocus from '@mui/base/TrapFocus';
@@ -1910,8 +2490,8 @@ A big thanks to the 16 contributors who made this release possible. Here are som
1910
2490
  `unstable_ClassNameGenerator` has been moved from `utils` to `className` folder to prevent all MUI Base module imports. If you use the module, please update the import as suggested in the diff below:
1911
2491
 
1912
2492
  ```diff
1913
- - import { unstable_ClassNameGenerator } from '@mui/material/utils';
1914
- + import { unstable_ClassNameGenerator } from '@mui/material/className';
2493
+ -import { unstable_ClassNameGenerator } from '@mui/material/utils';
2494
+ +import { unstable_ClassNameGenerator } from '@mui/material/className';
1915
2495
  ```
1916
2496
 
1917
2497
  #### Changes
@@ -2253,8 +2833,8 @@ A big thanks to the 22 contributors who made this release possible. Here are som
2253
2833
  3. Change the import paths of unstyled components from @mui/material to @mui/base, e.g.:
2254
2834
 
2255
2835
  ```diff
2256
- - @import ButtonUnstyled from '@mui/material/ButtonUnstyled';
2257
- + @import ButtonUnstyled from '@mui/base/ButtonUnstyled';
2836
+ -import ButtonUnstyled from '@mui/material/ButtonUnstyled';
2837
+ +import ButtonUnstyled from '@mui/base/ButtonUnstyled';
2258
2838
  ```
2259
2839
 
2260
2840
  #### Changes
@@ -4297,12 +4877,12 @@ A big thanks to the 13 contributors who made this release possible. Here are som
4297
4877
  `span` element that wraps children has been removed. `wrapper` classKey is also removed. More details about [this change](https://github.com/mui/material-ui/pull/26666).
4298
4878
 
4299
4879
  ```diff
4300
- <button class="MuiTab-root">
4301
- - <span class="MuiTab-wrapper">
4880
+ <button class="MuiTab-root">
4881
+ - <span class="MuiTab-wrapper">
4302
4882
  {icon}
4303
4883
  {label}
4304
- - </span>
4305
- </button>
4884
+ - </span>
4885
+ </button>
4306
4886
  ```
4307
4887
 
4308
4888
  - [BottomNavigation] Remove wrapper from BottomNavigationAction (#26923) @siriwatknp
@@ -4310,14 +4890,14 @@ A big thanks to the 13 contributors who made this release possible. Here are som
4310
4890
  `span` element that wraps children has been removed. `wrapper` classKey is also removed. More details about [this change](https://github.com/mui/material-ui/pull/26666).
4311
4891
 
4312
4892
  ```diff
4313
- <button class="MuiBottomNavigationAction-root">
4314
- - <span class="MuiBottomNavigationAction-wrapper">
4315
- {icon}
4316
- <span class="MuiBottomNavigationAction-label">
4317
- {label}
4318
- </span>
4319
- - </span>
4320
- </button>
4893
+ <button class="MuiBottomNavigationAction-root">
4894
+ - <span class="MuiBottomNavigationAction-wrapper">
4895
+ {icon}
4896
+ <span class="MuiBottomNavigationAction-label">
4897
+ {label}
4898
+ </span>
4899
+ - </span>
4900
+ </button>
4321
4901
  ```
4322
4902
 
4323
4903
  #### Changes
@@ -4350,15 +4930,15 @@ A big thanks to the 13 contributors who made this release possible. Here are som
4350
4930
  Make the default rendered text field closer to the most common use cases (denser).
4351
4931
 
4352
4932
  ```diff
4353
- <DatePicker
4354
- label="Helper text example"
4355
- value={value}
4356
- onChange={onChange}
4357
- renderInput={(params) => (
4933
+ <DatePicker
4934
+ label="Helper text example"
4935
+ value={value}
4936
+ onChange={onChange}
4937
+ renderInput={(params) => (
4358
4938
  - <TextField {...params} />
4359
4939
  + <TextField {...params} helperText={params?.inputProps?.placeholder} />
4360
- )}
4361
- >
4940
+ )}
4941
+ >
4362
4942
  ```
4363
4943
 
4364
4944
  #### Changes
@@ -4420,7 +5000,7 @@ _Jun 23, 2021_
4420
5000
  A big thanks to the 18 contributors who made this release possible. Here are some highlights โœจ:
4421
5001
 
4422
5002
  - ๐Ÿš€ We have only 2 left in the [breaking changes](https://github.com/mui/material-ui/issues/20012). The plan to release 5.0.0-beta.0 is on July 1st and will start to promote its usage over v4.
4423
- - ๐ŸŽจ We have updated `Slider` to match current [Material Design guidelines](https://material.io/components/sliders).
5003
+ - ๐ŸŽจ We have updated `Slider` to match current [Material Design guidelines](https://m2.material.io/components/sliders).
4424
5004
 
4425
5005
  <a href="https://mui.com/components/slider/#continuous-sliders"><img width="247" alt="" src="https://user-images.githubusercontent.com/3165635/121884800-a8808600-cd13-11eb-8cdf-e25de8f1ba73.png" style="margin: auto"></a>
4426
5006
 
@@ -4464,16 +5044,16 @@ A big thanks to the 18 contributors who made this release possible. Here are som
4464
5044
  The default breakpoints were changed to better match the common use cases. They also better match the Material Design guidelines. [Read more about the change](https://github.com/mui/material-ui/issues/21902).
4465
5045
 
4466
5046
  ```diff
4467
- {
4468
- xs: 0,
4469
- sm: 600,
4470
- - md: 960,
4471
- + md: 900,
4472
- - lg: 1280,
4473
- + lg: 1200,
4474
- - xl: 1920,
4475
- + xl: 1536,
4476
- }
5047
+ {
5048
+ xs: 0,
5049
+ sm: 600,
5050
+ - md: 960,
5051
+ + md: 900,
5052
+ - lg: 1280,
5053
+ + lg: 1200,
5054
+ - xl: 1920,
5055
+ + xl: 1536,
5056
+ }
4477
5057
  ```
4478
5058
 
4479
5059
  If you prefer the old breakpoint values, use the snippet below.
@@ -4505,7 +5085,7 @@ A big thanks to the 18 contributors who made this release possible. Here are som
4505
5085
 
4506
5086
  - &#8203;<!-- 08 -->[Slider] Adjust css to match the specification (#26632) @siriwatknp
4507
5087
 
4508
- Rework the CSS to match the latest [Material Design guidelines](https://material.io/components/sliders) and make custom styles more intuitive. [See documentation](https://mui.com/components/slider/).
5088
+ Rework the CSS to match the latest [Material Design guidelines](https://m2.material.io/components/sliders) and make custom styles more intuitive. [See documentation](https://mui.com/components/slider/).
4509
5089
 
4510
5090
  <a href="https://mui.com/components/slider/#continuous-sliders"><img width="247" alt="" src="https://user-images.githubusercontent.com/3165635/121884800-a8808600-cd13-11eb-8cdf-e25de8f1ba73.png" style="margin: auto"></a>
4511
5091
 
@@ -4518,11 +5098,11 @@ A big thanks to the 18 contributors who made this release possible. Here are som
4518
5098
  `span` element that wraps children has been removed. `label` classKey is also removed. More details about [this change](https://github.com/mui/material-ui/pull/26666).
4519
5099
 
4520
5100
  ```diff
4521
- <button class="MuiIconButton-root">
4522
- - <span class="MuiIconButton-label">
4523
- <svg />
4524
- - </span>
4525
- </button>
5101
+ <button class="MuiIconButton-root">
5102
+ - <span class="MuiIconButton-label">
5103
+ <svg />
5104
+ - </span>
5105
+ </button>
4526
5106
  ```
4527
5107
 
4528
5108
  - &#8203;<!-- 19 -->[core] Remove `unstable_` prefix on the `useThemeProps` hook (#26777) @mnajdova
@@ -4648,11 +5228,11 @@ A big thanks to the 11 contributors who made this release possible. Here are som
4648
5228
  The `span` element that wraps children has been removed. `label` classKey is also removed. The nested span was required for fixing a flexbox issue with iOS < 11.0.
4649
5229
 
4650
5230
  ```diff
4651
- <button class="MuiButton-root">
4652
- - <span class="MuiButton-label">
4653
- children
4654
- - </span>
4655
- </button>
5231
+ <button class="MuiButton-root">
5232
+ - <span class="MuiButton-label">
5233
+ children
5234
+ - </span>
5235
+ </button>
4656
5236
  ```
4657
5237
 
4658
5238
  #### Changes
@@ -4681,7 +5261,7 @@ A big thanks to the 11 contributors who made this release possible. Here are som
4681
5261
  + const theme = useTheme();
4682
5262
  + const isRtl = theme.direction === 'rtl';
4683
5263
  //.. rest of the code
4684
- }
5264
+ }
4685
5265
  ```
4686
5266
 
4687
5267
  #### Changes
@@ -4753,7 +5333,7 @@ A big thanks to the 14 contributors who made this release possible. Here are som
4753
5333
 
4754
5334
  - &#8203;<!-- 10 -->[AppBar] Fix background color on dark mode (#26545) @siriwatknp
4755
5335
 
4756
- The `color` prop has no longer any effect in dark mode. The app bar uses the background color required by the elevation to follow the [Material Design guidelines](https://material.io/design/color/dark-theme.html). Use `enableColorOnDark` to restore the behavior of v4.
5336
+ The `color` prop has no longer any effect in dark mode. The app bar uses the background color required by the elevation to follow the [Material Design guidelines](https://m2.material.io/design/color/dark-theme.html). Use `enableColorOnDark` to restore the behavior of v4.
4757
5337
 
4758
5338
  ```jsx
4759
5339
  <AppBar enableColorOnDark />
@@ -4804,13 +5384,14 @@ A big thanks to the 14 contributors who made this release possible. Here are som
4804
5384
  - &#8203;<!-- 29 -->[pickers] Remove `openPickerIcon` prop in favor of `components.OpenPickerIcon` (#26223) @vedadeepta
4805
5385
 
4806
5386
  ```diff
4807
- <DateTimePicker
4808
- components={{
4809
- LeftArrowIcon: AlarmIcon,
4810
- RightArrowIcon: SnoozeIcon,
4811
- + OpenPickerIcon: ClockIcon,
4812
- }}
4813
- - openPickerIcon={<ClockIcon />}
5387
+ <DateTimePicker
5388
+ components={{
5389
+ LeftArrowIcon: AlarmIcon,
5390
+ RightArrowIcon: SnoozeIcon,
5391
+ + OpenPickerIcon: ClockIcon,
5392
+ }}
5393
+ - openPickerIcon={<ClockIcon />}
5394
+ >
4814
5395
  ```
4815
5396
 
4816
5397
  ### `@material-ui/system@5.0.0-alpha.36`
@@ -4914,8 +5495,8 @@ A big thanks to the 14 contributors who made this release possible. Here are som
4914
5495
 
4915
5496
  Update the implementation to better match Material Design:
4916
5497
 
4917
- - Tab `minWidth` changed from `72px` => `90px` (without media-query) according to [material-design spec](https://material.io/components/tabs#specs)
4918
- - Tab `maxWidth` changed from `264px` => `360px` according to [material-design spec](https://material.io/components/tabs#specs)
5498
+ - Tab `minWidth` changed from `72px` => `90px` (without media-query) according to [material-design spec](https://m2.material.io/components/tabs#specs)
5499
+ - Tab `maxWidth` changed from `264px` => `360px` according to [material-design spec](https://m2.material.io/components/tabs#specs)
4919
5500
 
4920
5501
  #### Changes
4921
5502
 
@@ -5033,10 +5614,10 @@ A big thanks to the 16 contributors who made this release possible. Here are som
5033
5614
  Move the custom class on `input` to `select`. The `input` key is being applied on another element.
5034
5615
 
5035
5616
  ```diff
5036
- <TablePagination
5037
- - classes={{ input: 'foo' }}
5038
- + classes={{ select: 'foo' }}
5039
- />
5617
+ <TablePagination
5618
+ - classes={{ input: 'foo' }}
5619
+ + classes={{ select: 'foo' }}
5620
+ />
5040
5621
  ```
5041
5622
 
5042
5623
  - &#8203;<!-- 45 -->[core] Move `StyledEngineProvider` to `@material-ui/core/styles` (#26265) @mnajdova
@@ -5081,10 +5662,10 @@ A big thanks to the 16 contributors who made this release possible. Here are som
5081
5662
  - &#8203;<!-- 63 -->[Autocomplete] Rename getOptionSelected to isOptionEqualToValue (#26173) @m4theushw
5082
5663
 
5083
5664
  ```diff
5084
- <Autocomplete
5665
+ <Autocomplete
5085
5666
  - getOptionSelected={(option, value) => option.title === value.title}
5086
5667
  + isOptionEqualToValue={(option, value) => option.title === value.title}
5087
- />
5668
+ />
5088
5669
  ```
5089
5670
 
5090
5671
  > Follow [this link](https://mui.com/material-ui/migration/migration-v4/) for full migration from v4 => v5
@@ -5187,18 +5768,20 @@ A big thanks to the 17 contributors who made this release possible. Here are som
5187
5768
  Replace the `innerRef` prop with the `ref` prop. Refs are now automatically forwarded to the inner component.
5188
5769
 
5189
5770
  ```diff
5190
- import * as React from 'react';
5191
- import { withStyles } from '@material-ui/core/styles';
5192
- const MyComponent = withStyles({
5193
- root: {
5194
- backgroundColor: 'red',
5195
- },
5196
- })(({ classes }) => <div className={classes.root} />);
5197
- function MyOtherComponent(props) {
5198
- const ref = React.useRef();
5199
- - return <MyComponent innerRef={ref} />;
5200
- + return <MyComponent ref={ref} />;
5201
- }
5771
+ import * as React from 'react';
5772
+ import { withStyles } from '@material-ui/core/styles';
5773
+
5774
+ const MyComponent = withStyles({
5775
+ root: {
5776
+ backgroundColor: 'red',
5777
+ },
5778
+ })(({ classes }) => <div className={classes.root} />);
5779
+
5780
+ function MyOtherComponent(props) {
5781
+ const ref = React.useRef();
5782
+ - return <MyComponent innerRef={ref} />;
5783
+ + return <MyComponent ref={ref} />;
5784
+ }
5202
5785
  ```
5203
5786
 
5204
5787
  **withTheme**
@@ -5206,14 +5789,16 @@ A big thanks to the 17 contributors who made this release possible. Here are som
5206
5789
  Replace the `innerRef` prop with the `ref` prop. Refs are now automatically forwarded to the inner component.
5207
5790
 
5208
5791
  ```diff
5209
- import * as React from 'react';
5210
- import { withTheme } from '@material-ui/core/styles';
5211
- const MyComponent = withTheme(({ theme }) => <div>{props.theme.direction}</div>);
5212
- function MyOtherComponent(props) {
5213
- const ref = React.useRef();
5214
- - return <MyComponent innerRef={ref} />;
5215
- + return <MyComponent ref={ref} />;
5216
- }
5792
+ import * as React from 'react';
5793
+ import { withTheme } from '@material-ui/core/styles';
5794
+
5795
+ const MyComponent = withTheme(({ theme }) => <div>{props.theme.direction}</div>);
5796
+
5797
+ function MyOtherComponent(props) {
5798
+ const ref = React.useRef();
5799
+ - return <MyComponent innerRef={ref} />;
5800
+ + return <MyComponent ref={ref} />;
5801
+ }
5217
5802
  ```
5218
5803
 
5219
5804
  - &#8203;<!-- 10 -->[theme] Rename `createMuiTheme` to `createTheme` (#25992) @m4theushw
@@ -5555,23 +6140,23 @@ A big thanks to the 15 contributors who made this release possible. Here are som
5555
6140
  - &#8203;<!-- 41 -->[Checkbox][switch] Remove checked argument from onChange (#25871) @m4theushw
5556
6141
 
5557
6142
  ```diff
5558
- function MyCheckbox() {
5559
- - const handleChange = (event: React.ChangeEvent<HTMLInputElement>, checked: boolean) => {
5560
- + const handleChange = (event: React.ChangeEvent<HTMLInputElement>) => {
5561
- + const checked = event.target.checked;
5562
- };
5563
- return <Checkbox onChange={handleChange} />;
5564
- }
6143
+ function MyCheckbox() {
6144
+ - const handleChange = (event: React.ChangeEvent<HTMLInputElement>, checked: boolean) => {
6145
+ + const handleChange = (event: React.ChangeEvent<HTMLInputElement>) => {
6146
+ + const checked = event.target.checked;
6147
+ };
6148
+ return <Checkbox onChange={handleChange} />;
6149
+ }
5565
6150
  ```
5566
6151
 
5567
6152
  ```diff
5568
- function MySwitch() {
5569
- - const handleChange = (event: React.ChangeEvent<HTMLInputElement>, checked: boolean) => {
5570
- + const handleChange = (event: React.ChangeEvent<HTMLInputElement>) => {
5571
- + const checked = event.target.checked;
5572
- };
5573
- return <Switch onChange={handleChange} />;
5574
- }
6153
+ function MySwitch() {
6154
+ - const handleChange = (event: React.ChangeEvent<HTMLInputElement>, checked: boolean) => {
6155
+ + const handleChange = (event: React.ChangeEvent<HTMLInputElement>) => {
6156
+ + const checked = event.target.checked;
6157
+ };
6158
+ return <Switch onChange={handleChange} />;
6159
+ }
5575
6160
  ```
5576
6161
 
5577
6162
  - &#8203;<!-- 42 -->[theme] Remove theme.breakpoints.width helper (#25918) @m4theushw
@@ -5726,12 +6311,12 @@ A big thanks to the 19 contributors who made this release possible. Here are som
5726
6311
  -import DayPicker from '@material-ui/lab/DayPicker';
5727
6312
  +import CalendarPicker from '@material-ui/lab/CalendarPicker';
5728
6313
 
5729
- createMuiTheme({
5730
- components: {
5731
- - MuiDayPicker: {},
5732
- + MuiCalendarPicker: {},
5733
- }
5734
- })
6314
+ createMuiTheme({
6315
+ components: {
6316
+ - MuiDayPicker: {},
6317
+ + MuiCalendarPicker: {},
6318
+ }
6319
+ })
5735
6320
  ```
5736
6321
 
5737
6322
  - &#8203;<!-- 04 -->[Pickers] Rename PickersCalendarSkeleton to CalendarPickerSkeleton (#25679) @eps1lon
@@ -6255,10 +6840,10 @@ A big thanks to the 26 contributors who made this release possible. Here are som
6255
6840
 
6256
6841
  - &#8203;<!-- 087 -->[icons] Synchronize icons (#25055) @eps1lon
6257
6842
 
6258
- The icons were synchronized with https://material.io/resources/icons/. This change increases the number of supported icons from 1,349 to 1,781 per theme (we support 5 themes). The breaking changes:
6843
+ The icons were synchronized with https://m2.material.io/resources/icons/. This change increases the number of supported icons from 1,349 to 1,781 per theme (we support 5 themes). The breaking changes:
6259
6844
 
6260
6845
  ```diff
6261
- // AmpStories -> Download
6846
+ // AmpStories -> Download
6262
6847
  -AmpStories
6263
6848
  +Download
6264
6849
  -AmpStoriesOutlined
@@ -6269,7 +6854,7 @@ A big thanks to the 26 contributors who made this release possible. Here are som
6269
6854
  +DownloadSharp
6270
6855
  -AmpStoriesTwoTone
6271
6856
  +DownloadTwoTone
6272
- // Outbond -> Outbound
6857
+ // Outbond -> Outbound
6273
6858
  -Outbond
6274
6859
  +Outbound
6275
6860
  -OutbondOutlined
@@ -6446,10 +7031,10 @@ A big thanks to the 30 contributors who made this release possible. Here are som
6446
7031
  If you were using a number previously, you need to provide the value in `px` to bypass the new transformation with `theme.spacing`. The change was done for consistency with the Grid spacing prop and the other system spacing properties, e.g. `<Box padding={2}>`.
6447
7032
 
6448
7033
  ```diff
6449
- <Box
6450
- - gap={2}
6451
- + gap="2px"
6452
- >
7034
+ <Box
7035
+ - gap={2}
7036
+ + gap="2px"
7037
+ >
6453
7038
  ```
6454
7039
 
6455
7040
  ### `@material-ui/styled-engine@5.0.0-alpha.25`
@@ -6690,14 +7275,14 @@ A big thanks to the 15 contributors who made this release possible. Here are som
6690
7275
  --- a/docs/src/pages/components/date-range-picker/BasicDateRangePicker.tsx
6691
7276
  +++ b/docs/src/pages/components/date-range-picker/BasicDateRangePicker.tsx
6692
7277
  @@ -3,7 +3,7 @@ import TextField from '@material-ui/core/TextField';
6693
- import DateRangePicker, { DateRange } from '@material-ui/lab/DateRangePicker';
6694
- import AdapterDateFns from '@material-ui/lab/AdapterDateFns';
6695
- import LocalizationProvider from '@material-ui/lab/LocalizationProvider';
7278
+ import DateRangePicker, { DateRange } from '@material-ui/lab/DateRangePicker';
7279
+ import AdapterDateFns from '@material-ui/lab/AdapterDateFns';
7280
+ import LocalizationProvider from '@material-ui/lab/LocalizationProvider';
6696
7281
  -import DateRangeDelimiter from '@material-ui/lab/DateRangeDelimiter';
6697
7282
  +import Box from '@material-ui/core/Box';
6698
7283
 
6699
- export default function BasicDateRangePicker() {
6700
- const [value, setValue] = React.useState<DateRange<Date>>([null, null]);
7284
+ export default function BasicDateRangePicker() {
7285
+ const [value, setValue] = React.useState<DateRange<Date>>([null, null]);
6701
7286
  @@ -20,7 +20,7 @@ export default function BasicDateRangePicker() {
6702
7287
  renderInput={(startProps, endProps) => (
6703
7288
  <React.Fragment>
@@ -7239,42 +7824,42 @@ A big thanks to the 18 contributors who made this release possible. Here are som
7239
7824
  - [Dialog] Remove the `disableBackdropClick` prop. It's redundant with the `reason` argument (#23607) @eps1lon.
7240
7825
 
7241
7826
  ```diff
7242
- <Dialog
7243
- - disableBackdropClick
7244
- - onClose={handleClose}
7245
- + onClose={(event, reason) => {
7246
- + if (reason !== 'backdropClick') {
7247
- + onClose(event, reason);
7248
- + }
7249
- + }}
7250
- />
7827
+ <Dialog
7828
+ - disableBackdropClick
7829
+ - onClose={handleClose}
7830
+ + onClose={(event, reason) => {
7831
+ + if (reason !== 'backdropClick') {
7832
+ + onClose(event, reason);
7833
+ + }
7834
+ + }}
7835
+ />
7251
7836
  ```
7252
7837
 
7253
7838
  - [Modal] Remove the `disableBackdropClick` prop. It's redundant with the `reason` argument (#23607) @eps1lon.
7254
7839
 
7255
7840
  ```diff
7256
- <Modal
7257
- - disableBackdropClick
7258
- - onClose={handleClose}
7259
- + onClose={(event, reason) => {
7260
- + if (reason !== 'backdropClick') {
7261
- + onClose(event, reason);
7262
- + }
7263
- + }}
7264
- />
7841
+ <Modal
7842
+ - disableBackdropClick
7843
+ - onClose={handleClose}
7844
+ + onClose={(event, reason) => {
7845
+ + if (reason !== 'backdropClick') {
7846
+ + onClose(event, reason);
7847
+ + }
7848
+ + }}
7849
+ />
7265
7850
  ```
7266
7851
 
7267
7852
  - [Modal] Remove the `onEscapeKeyDown` prop. It's redundant with the `reason` argument. (#23571) @eps1lon
7268
7853
 
7269
7854
  ```diff
7270
- <Modal
7855
+ <Modal
7271
7856
  - onEscapeKeyDown={handleEscapeKeyDown}
7272
7857
  + onClose={(event, reason) => {
7273
7858
  + if (reason === "escapeKeyDown") {
7274
7859
  + handleEscapeKeyDown(event);
7275
7860
  + }
7276
7861
  + }}
7277
- />;
7862
+ />;
7278
7863
  ```
7279
7864
 
7280
7865
  #### Changes
@@ -7627,10 +8212,10 @@ Here are some highlights โœจ:
7627
8212
  - The CSS prefixes have changed:
7628
8213
 
7629
8214
  ```diff
7630
- popper: {
7631
- zIndex: 1,
7632
- - '&[x-placement*="bottom"] $arrow': {
7633
- + '&[data-popper-placement*="bottom"] $arrow': {
8215
+ popper: {
8216
+ zIndex: 1,
8217
+ - '&[x-placement*="bottom"] $arrow': {
8218
+ + '&[data-popper-placement*="bottom"] $arrow': {
7634
8219
  ```
7635
8220
 
7636
8221
  - Method names have changed.
@@ -7654,13 +8239,13 @@ Here are some highlights โœจ:
7654
8239
  -import withMobileDialog from '@material-ui/core/withMobileDialog';
7655
8240
  +import {ย useTheme, useMediaQuery } from '@material-ui/core';
7656
8241
 
7657
- function ResponsiveDialog(props) {
7658
- - const { fullScreen } = props;
7659
- + const theme = useTheme();
7660
- + const fullScreen = useMediaQuery(theme.breakpoints.down('sm'));
7661
- const [open, setOpen] = React.useState(false);
8242
+ function ResponsiveDialog(props) {
8243
+ - const { fullScreen } = props;
8244
+ + const theme = useTheme();
8245
+ + const fullScreen = useMediaQuery(theme.breakpoints.down('sm'));
8246
+ const [open, setOpen] = React.useState(false);
7662
8247
 
7663
- // ...
8248
+ // ...
7664
8249
 
7665
8250
  -export default withMobileDialog()(ResponsiveDialog);
7666
8251
  +export default ResponsiveDialog;
@@ -7906,24 +8491,24 @@ Here are some highlights โœจ:
7906
8491
  The change was done to match the API convention.
7907
8492
 
7908
8493
  ```diff
7909
- <TablePagination
7910
- - onChangeRowsPerPage={()=>{}}
7911
- - onChangePage={()=>{}}
7912
- + onRowsPerPageChange={()=>{}}
7913
- + onPageChange={()=>{}}
8494
+ <TablePagination
8495
+ - onChangeRowsPerPage={()=>{}}
8496
+ - onChangePage={()=>{}}
8497
+ + onRowsPerPageChange={()=>{}}
8498
+ + onPageChange={()=>{}}
7914
8499
  ```
7915
8500
 
7916
8501
  - [theme] Rename fade to alpha (#22834) @mnajdova
7917
8502
  Better describe its functionality. The previous name was leading to confusion when the input color already had an alpha value. The helper **overrides** the alpha value of the color.
7918
8503
 
7919
8504
  ```diff
7920
- - import { fade } from '@material-ui/core/styles';
7921
- + import { alpha } from '@material-ui/core/styles';
8505
+ -import { fade } from '@material-ui/core/styles';
8506
+ +import { alpha } from '@material-ui/core/styles';
7922
8507
 
7923
- const classes = makeStyles(theme => ({
8508
+ const classes = makeStyles(theme => ({
7924
8509
  - backgroundColor: fade(theme.palette.primary.main, theme.palette.action.selectedOpacity),
7925
8510
  + backgroundColor: alpha(theme.palette.primary.main, theme.palette.action.selectedOpacity),
7926
- }));
8511
+ }));
7927
8512
  ```
7928
8513
 
7929
8514
  - [Tooltip] Make `interactive` default (#22382) @eps1lon
@@ -7934,7 +8519,7 @@ Here are some highlights โœจ:
7934
8519
  ```diff
7935
8520
  -<Tooltip>
7936
8521
  +<Tooltip disableInteractive>
7937
- # Interactive tooltips no longer need the `interactive` prop.
8522
+ # Interactive tooltips no longer need the `interactive` prop.
7938
8523
  -<Tooltip interactive>
7939
8524
  +<Tooltip>
7940
8525
  ```
@@ -8182,7 +8767,7 @@ Here are some highlights โœจ:
8182
8767
  Renames `theme.palette.type` to `theme.palette.mode`, to better follow the "dark mode" term that is usually used for describing this feature.
8183
8768
 
8184
8769
  ```diff
8185
- import { createMuiTheme } from '@material-ui/core/styles';
8770
+ import { createMuiTheme } from '@material-ui/core/styles';
8186
8771
 
8187
8772
  -const theme = createMuiTheme({palette: { type: 'dark' }}),
8188
8773
  +const theme = createMuiTheme({palette: { mode: 'dark' }}),
@@ -8247,22 +8832,22 @@ Here are some highlights โœจ:
8247
8832
  You can recover from the change with:
8248
8833
 
8249
8834
  ```diff
8250
- <Autocomplete
8251
- - renderOption={(option, { selected }) => (
8252
- - <React.Fragment>
8253
- + renderOption={(props, option, { selected }) => (
8254
- + <li {...props}>
8255
- <Checkbox
8256
- icon={icon}
8257
- checkedIcon={checkedIcon}
8258
- style={{ marginRight: 8 }}
8259
- checked={selected}
8260
- />
8261
- {option.title}
8262
- - </React.Fragment>
8263
- + </li>
8264
- )}
8265
- />
8835
+ <Autocomplete
8836
+ - renderOption={(option, { selected }) => (
8837
+ - <React.Fragment>
8838
+ + renderOption={(props, option, { selected }) => (
8839
+ + <li {...props}>
8840
+ <Checkbox
8841
+ icon={icon}
8842
+ checkedIcon={checkedIcon}
8843
+ style={{ marginRight: 8 }}
8844
+ checked={selected}
8845
+ />
8846
+ {option.title}
8847
+ - </React.Fragment>
8848
+ + </li>
8849
+ )}
8850
+ />
8266
8851
  ```
8267
8852
 
8268
8853
  #### Changes
@@ -8348,12 +8933,12 @@ Here are some highlights โœจ:
8348
8933
  Rename `focused` to `focusVisible` for consistency with the other components:
8349
8934
 
8350
8935
  ```diff
8351
- <Accordion
8352
- classes={{
8353
- - focused: 'custom-focus-visible-classname',
8354
- + focusVisible: 'custom-focus-visible-classname',
8355
- }}
8356
- />
8936
+ <Accordion
8937
+ classes={{
8938
+ - focused: 'custom-focus-visible-classname',
8939
+ + focusVisible: 'custom-focus-visible-classname',
8940
+ }}
8941
+ />
8357
8942
  ```
8358
8943
 
8359
8944
  - [Stepper] Remove Paper and built-in padding (#22564) @mbrookes
@@ -8433,10 +9018,10 @@ Here are some highlights โœจ:
8433
9018
  If you have a custom `icon` prop but no `emptyIcon` prop, you can restore the previous behavior with:
8434
9019
 
8435
9020
  ```diff
8436
- <Rating
8437
- icon={customIcon}
8438
- + emptyIcon={null}
8439
- />
9021
+ <Rating
9022
+ icon={customIcon}
9023
+ + emptyIcon={null}
9024
+ />
8440
9025
  ```
8441
9026
 
8442
9027
  #### Changes
@@ -8466,7 +9051,7 @@ _Sep 6, 2020_
8466
9051
  A big thanks to the 14 contributors who made this release possible.
8467
9052
  Here are some highlights โœจ:
8468
9053
 
8469
- - ๐Ÿ’Ž A new diamond sponsor: [DoiT](https://www.doit-intl.com/), thank you!
9054
+ - ๐Ÿ’Ž A new diamond sponsor: [DoiT](https://www.doit.com/), thank you!
8470
9055
  - ๐Ÿ“š Include the default value of the props in IntelliSense (#22447) @eps1lon
8471
9056
  - โš›๏ธ More source migrated to TypeScript and testing-library (#22441) @baterson
8472
9057
  - And many more ๐Ÿ› bug fixes and ๐Ÿ“š improvements.
@@ -8562,9 +9147,9 @@ const theme = createMuiTheme({
8562
9147
  1. `props`
8563
9148
 
8564
9149
  ```diff
8565
- import { createMuiTheme } from '@material-ui/core/styles';
9150
+ import { createMuiTheme } from '@material-ui/core/styles';
8566
9151
 
8567
- const theme = createMuiTheme({
9152
+ const theme = createMuiTheme({
8568
9153
  - props: {
8569
9154
  - MuiButton: {
8570
9155
  - disableRipple: true,
@@ -8577,15 +9162,15 @@ const theme = createMuiTheme({
8577
9162
  + },
8578
9163
  + },
8579
9164
  + },
8580
- });
9165
+ });
8581
9166
  ```
8582
9167
 
8583
9168
  2. `overrides`
8584
9169
 
8585
9170
  ```diff
8586
- import { createMuiTheme } from '@material-ui/core/styles';
9171
+ import { createMuiTheme } from '@material-ui/core/styles';
8587
9172
 
8588
- const theme = createMuiTheme({
9173
+ const theme = createMuiTheme({
8589
9174
  - overrides: {
8590
9175
  - MuiButton: {
8591
9176
  - root: { padding: 0 },
@@ -8598,7 +9183,7 @@ const theme = createMuiTheme({
8598
9183
  + },
8599
9184
  + },
8600
9185
  + },
8601
- });
9186
+ });
8602
9187
  ```
8603
9188
 
8604
9189
  Note that if you don't have the time to upgrade the structure of the theme, you
@@ -8709,7 +9294,7 @@ Here are some highlights โœจ:
8709
9294
  The onE\* transition props were removed. Use TransitionProps instead.
8710
9295
 
8711
9296
  ```diff
8712
- <Menu
9297
+ <Menu
8713
9298
  - onEnter={onEnter}
8714
9299
  - onEntered={onEntered},
8715
9300
  - onEntering={onEntered},
@@ -8724,14 +9309,14 @@ Here are some highlights โœจ:
8724
9309
  + onExited,
8725
9310
  + onExiting,
8726
9311
  + }}
8727
- >
9312
+ >
8728
9313
  ```
8729
9314
 
8730
9315
  - [Popover] Remove transition onX props (#22184) @mbrookes
8731
9316
  The onE\* transition props were removed. Use TransitionProps instead.
8732
9317
 
8733
9318
  ```diff
8734
- <Popover
9319
+ <Popover
8735
9320
  - onEnter={onEnter}
8736
9321
  - onEntered={onEntered},
8737
9322
  - onEntering={onEntered},
@@ -8746,7 +9331,7 @@ Here are some highlights โœจ:
8746
9331
  + onExited,
8747
9332
  + onExiting,
8748
9333
  + }}
8749
- />
9334
+ />
8750
9335
  ```
8751
9336
 
8752
9337
  - [TextField] Improve line-height reset (#22149) @imnasnainaec
@@ -8900,7 +9485,7 @@ Here are some highlights โœจ:
8900
9485
  The onE\* transition props were removed. Use TransitionProps instead.
8901
9486
 
8902
9487
  ```diff
8903
- <Dialog
9488
+ <Dialog
8904
9489
  - onEnter={onEnter}
8905
9490
  - onEntered={onEntered},
8906
9491
  - onEntering={onEntered},
@@ -8915,7 +9500,7 @@ Here are some highlights โœจ:
8915
9500
  + onExited,
8916
9501
  + onExiting,
8917
9502
  + }}
8918
- />
9503
+ />
8919
9504
  ```
8920
9505
 
8921
9506
  - [Fab] Rename round -> circular for consistency (#21903) @kodai3
@@ -8962,7 +9547,7 @@ Here are some highlights โœจ:
8962
9547
  The onE\* transition props were removed. Use TransitionProps instead.
8963
9548
 
8964
9549
  ```diff
8965
- <Snackbar
9550
+ <Snackbar
8966
9551
  - onEnter={onEnter}
8967
9552
  - onEntered={onEntered},
8968
9553
  - onEntering={onEntered},
@@ -8977,7 +9562,7 @@ Here are some highlights โœจ:
8977
9562
  + onExited,
8978
9563
  + onExiting,
8979
9564
  + }}
8980
- />
9565
+ />
8981
9566
  ```
8982
9567
 
8983
9568
  - [TextareaAutosize] Rename rowsMax->maxRows & rowsMin->minRows (#21873) @mhayk
@@ -9346,21 +9931,21 @@ A big thanks to the 33 contributors who made this release possible. Here are som
9346
9931
  It prevents inconsistent height on scaled screens. For people customizing the color of the border, the change requires changing the override CSS property:
9347
9932
 
9348
9933
  ```diff
9349
- .MuiDivider-root {
9350
- - background-color: #f00;
9351
- + border-color: #f00;
9352
- }
9934
+ .MuiDivider-root {
9935
+ - background-color: #f00;
9936
+ + border-color: #f00;
9937
+ }
9353
9938
  ```
9354
9939
 
9355
9940
  - [Rating] Rename `visuallyhidden` to `visuallyHidden` for consistency (#21413) @mnajdova.
9356
9941
 
9357
9942
  ```diff
9358
- <Rating
9359
- classes={{
9943
+ <Rating
9944
+ classes={{
9360
9945
  - visuallyhidden: 'custom-visually-hidden-classname',
9361
9946
  + visuallyHidden: 'custom-visually-hidden-classname',
9362
- }}
9363
- />
9947
+ }}
9948
+ />
9364
9949
  ```
9365
9950
 
9366
9951
  - [Typography] Replace the `srOnly` prop so as to not duplicate the capabilities of [System](https://mui.com/system/getting-started/overview/) (#21413) @mnajdova.
@@ -9380,10 +9965,10 @@ A big thanks to the 33 contributors who made this release possible. Here are som
9380
9965
  The customization of the table pagination's actions labels must be done with the `getItemAriaLabel` prop. This increases consistency with the `Pagination` component.
9381
9966
 
9382
9967
  ```diff
9383
- <TablePagination
9384
- - backIconButtonText="Avant"
9385
- - nextIconButtonText="Aprรจs
9386
- + getItemAriaLabel={โ€ฆ}
9968
+ <TablePagination
9969
+ - backIconButtonText="Avant"
9970
+ - nextIconButtonText="Aprรจs
9971
+ + getItemAriaLabel={โ€ฆ}
9387
9972
  ```
9388
9973
 
9389
9974
  - [ExpansionPanel] Rename to Accordion (#21494) @mnajdova.