@mui/private-theming 5.10.9 โ†’ 5.10.15

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,421 @@
1
1
  # [Versions](https://mui.com/versions/)
2
2
 
3
+ ## 5.10.15
4
+
5
+ <!-- generated comparing v5.10.14..master -->
6
+
7
+ _Nov 21, 2022_
8
+
9
+ A big thanks to the 9 contributors who made this release possible. Here are some highlights โœจ:
10
+
11
+ - ๐Ÿš€ @mnajdova added the button as the first component that implements [Material You](https://m3.material.io/) design (MD3)
12
+ - ๐ŸŒ @MBilalShafi added Urdu (Pakistan) localization
13
+ - Many other ๐Ÿ› bug fixes, ๐Ÿ“š documentation, and โš™๏ธ infrastructure improvements
14
+
15
+ ### `@mui/material@5.10.15`
16
+
17
+ - [Autocomplete] Fix keyboard navigation when using custom popover (#35160) @sai6855
18
+ - [typescript] Add `background.defaultChannel` to `CssVarsPalette` (#35174) @alexfauquette
19
+ - [l10n] Add Urdu (ur-PK) locale (#35154) @MBilalShafi
20
+
21
+ ### `@mui/icons-material@5.10.15`
22
+
23
+ - [icons] Update the Material Design icons (#35194) @michaldudak
24
+
25
+ ### `@mui/material-next@6.0.0-alpha.63`
26
+
27
+ - [Material You] Add theme structure & Button component (#34650) @mnajdova
28
+
29
+ ### `@mui/base@5.0.0-alpha.106`
30
+
31
+ - [Select] Add attributes to conform with ARIA 1.2 (#35182) @michaldudak
32
+
33
+ ### Docs
34
+
35
+ - [docs] Fix a couple documentation errors (#35217) @danilo-leal
36
+ - [docs] Change MUI -> Material UI in icons-material's readme (#35220) @michaldudak
37
+ - [docs] the pages have no <link rel=canonical so we need to tell Google to not index the staging envs @oliviertassinari
38
+ - [docs] Fix confusion in TOCs when reaching scroll bottom (#35214) @oliviertassinari
39
+ - [docs] Fix typos in section titles (#35025) @iamxukai
40
+ - [docs] Fix typo in legacy date picker migration guide @oliviertassinari
41
+ - [docs] Iterating on recent Joy UI Component page updates (#35162) @samuelsycamore
42
+ - [docs] Inform that pickers are in X repository (#35189) @alexfauquette
43
+ - [docs] Explain how the `error` prop works in the Unstyled Input (#35171) @michaldudak
44
+ - [docs] Hotfix missing styles in dark mode (#35179) @siriwatknp
45
+ - [docs] Add Joy UI theme typography page (#34811) @siriwatknp
46
+ - [docs] Fix undo/redo in live editor (#35163) @oliviertassinari
47
+ - [docs] Revise the Joy UI "Avatar" component page (#35152) @samuelsycamore
48
+ - [docs] Make navbar backdrop filter consistent with website (#35157) @danilo-leal
49
+ - [docs] Host CodeSandbox on MUI org (#35110) @oliviertassinari
50
+ - [docs] Uplift introduction demos & make consistent with Base (#34316) @danilo-leal
51
+ - [website] Add Security questionnaire in pricing (#35172) @oliviertassinari
52
+ - [website] Fix theme mode toggle state (#35216) @siriwatknp
53
+ - [website] Exclude experiment pages in production (#35180) @siriwatknp
54
+ - [website] Disable SEO for performance pages (#35173) @oliviertassinari
55
+
56
+ ### Core
57
+
58
+ - [core] Convert icons scripts to ESM (#35101) @Janpot
59
+ - [core] Group renovate GitHub Action dependency updates @oliviertassinari
60
+ - [core] Upgrade eslint-config-airbnb-typescript (#34642) @Janpot
61
+ - [core] Ensure that prettier CI step fails when code is badly formatted (#35170) @michaldudak
62
+
63
+ All contributors of this release in alphabetical order: @alexfauquette, @danilo-leal, @iamxukai, @Janpot, @MBilalShafi, @michaldudak, @oliviertassinari, @samuelsycamore, @siriwatknp
64
+
65
+ ## v5.10.14
66
+
67
+ <!-- generated comparing v5.10.13..master -->
68
+
69
+ _Nov 14, 2022_
70
+
71
+ A big thanks to the 17 contributors who made this release possible. Here are some highlights โœจ:
72
+
73
+ - ๐Ÿš€ @siriwatknp added the Autocomplete component to the Joy UI (#34315)
74
+ - โ™ฟ @sfavello improved the accessibility of the Material UI's Autocomplete by adding support for the Delete key (#33822)
75
+ - Many other ๐Ÿ› bug fixes, ๐Ÿ“š documentation, and โš™๏ธ infrastructure improvements.
76
+
77
+ ### `@mui/material@5.10.14`
78
+
79
+ - [Material UI] Add `palette.background.defaultChannel` token (#35061) @siriwatknp
80
+ - [Autocomplete] Remove tags with the Delete key (#33822) @sfavello
81
+ - [IconButton] custom color causes type error (#34521) @kushagra010
82
+
83
+ ### `@mui/system@5.10.14`
84
+
85
+ - [Unstable_Gridv2] sorted responsize keys based on breakpoint value (#34987) @sai6855
86
+
87
+ ### `@mui/joy@5.0.0-alpha.54`
88
+
89
+ - [Joy] Export `FormControl`, `LinearProgress` and `ListSubheader` components from `@mui/joy` (#35003) @Studio384
90
+ - [Joy] Miscellaneous fixes (#35044) @siriwatknp
91
+ - [Joy] Add `Autocomplete` component (#34315) @siriwatknp
92
+ - [Joy] Saturate a bit the gray palette (#35148) @danilo-leal
93
+ - [Autocomplete][joy] Fix types (#35153) @siriwatknp
94
+
95
+ ### Docs
96
+
97
+ - [blog] Fix font size of code blocks on iOS @oliviertassinari
98
+ - [docs] Accessibility - increase default contrastThreshold for WCAG AA compliance (#34901) @kennethbigler
99
+ - [docs] Correct the keepMounted section on the Drawer page (#35076) @michaldudak
100
+ - [docs] Fix code editor styles mismatches (#35108) @oliviertassinari
101
+ - [docs] Allows to access the next MUI-X (#34798) @alexfauquette
102
+ - [docs] Fix bugs with live edit demos (#35106) @oliviertassinari
103
+ - [docs] Fix `MarkdownElement` regression from adding CSS variables (#35096) @siriwatknp
104
+ - [docs] Add a new gold sponsor (#35089) @hbjORbj
105
+ - [docs] Fix scroll issue on expanded live demos (#35064) @bharatkashyap
106
+ - [docs] Improve alignment of the sponsors @oliviertassinari
107
+ - [docs] Improve code font family v2 (#35053) @oliviertassinari
108
+ - [docs] Upgrade to Next.js 13 (#35001) @mnajdova
109
+ - [docs] Fix typo in changelog @oliviertassinari
110
+ - [docs] Update Joy UI templates to use latest components (#35058) @siriwatknp
111
+ - [website] Fix design kits showcase throwing an error (#35093) @cherniavskii
112
+ - [website] Fix margin bug on CTA @oliviertassinari
113
+ - [website] Link respective repositories in product pages (#35046) @sidtohan
114
+ - [website] Migrate blog pages to use CSS theme variables (#34976) @siriwatknp
115
+ - [website] Update DoiT International logo and links with new brand (#35030) @ofir5300
116
+ - [website] Improve visual design app bar (#35111) @oliviertassinari
117
+
118
+ ### Core
119
+
120
+ - [core] Convert scripts to ES modules (#35036) @michaldudak
121
+ - [core] Show the whole version to make blame easier @oliviertassinari
122
+ - [core] Polish GitHub Action version @oliviertassinari
123
+ - [core] Ignore icons to speed up CodeQL @oliviertassinari
124
+ - [core] Feedback on branch protection @oliviertassinari
125
+ - [core] Revert CI (#35098) @siriwatknp
126
+ - [core] Fix job name to match the CI (#35097) @siriwatknp
127
+ - [core] ESLint fixes for tests (#34924) @Janpot
128
+ - [core] Ignore unrelated folders from github actions (#35028) @siriwatknp
129
+ - [core] Use pretty-quick instead of custom script (#34062) @Janpot
130
+
131
+ 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
132
+
133
+ ## v5.10.13
134
+
135
+ <!-- generated comparing v5.10.12..master -->
136
+
137
+ _Nov 7, 2022_
138
+
139
+ A big thanks to the 12 contributors who made this release possible. Here are some highlights โœจ:
140
+
141
+ - ๐Ÿš€ The slots API has been introduced to the Material UI package by @michaldudak (#34873).
142
+ - ๐Ÿ”ฅ Live editing of demos is stabilized by @oliviertassinari (#34870).
143
+ - Many other ๐Ÿ› bug fixes, ๐Ÿ“š documentation, and โš™๏ธ infrastructure improvements.
144
+
145
+ ### `@mui/material@5.10.13`
146
+
147
+ - &#8203;<!-- 08 -->[material-ui] Introduce the slots API (#34873) @michaldudak
148
+ - &#8203;<!-- 07 -->[NativeSelectInput] Support CSS theme variables (#34975) @siriwatknp
149
+
150
+ ### `@mui/system@5.10.13`
151
+
152
+ - &#8203;<!-- 05 -->[system] Add a missing key attribute in getInitColorScheme to fix key issue (#34992) @akshaya-venkatesh8
153
+
154
+ ### `@mui/base@5.0.0-alpha.105`
155
+
156
+ - &#8203;<!-- 26 -->[base] Avoid calling setState during renders (#34916) @Janpot
157
+
158
+ ### `@mui/joy@5.0.0-alpha.53`
159
+
160
+ - &#8203;<!-- 06 -->[Select] Fix custom options menu not opening on Avatar click (#34648) @shivam1646
161
+
162
+ ### Docs
163
+
164
+ - &#8203;<!-- 20 -->[docs] Add a guide for setting dark mode by default (#34839) @siriwatknp
165
+ - &#8203;<!-- 19 -->[docs] Improve code font family (#35027) @oliviertassinari
166
+ - &#8203;<!-- 18 -->[docs] Revise and expand Joy UI "Alert" page (#34838) @samuelsycamore
167
+ - &#8203;<!-- 17 -->[docs] Live demos v2 (#34870) @oliviertassinari
168
+ - &#8203;<!-- 16 -->[docs] Fix 301 links in the docs @oliviertassinari
169
+ - &#8203;<!-- 15 -->[docs] Fix code display in RTL (#34951) @oliviertassinari
170
+ - &#8203;<!-- 14 -->[docs] New API design rule disabled > disable (#34972) @oliviertassinari
171
+ - &#8203;<!-- 13 -->[docs] Explain the usage of Select's onOpen/onClose in the uncontrolled mode (#34755) @michaldudak
172
+ - &#8203;<!-- 12 -->[docs] Add a new gold sponsor (#34984) @hbjORbj
173
+ - &#8203;<!-- 11 -->[docs] Add author and published_time meta tags (#34382) @alexfauquette
174
+ - &#8203;<!-- 10 -->[examples] Next.js examples v13 - fonts (#34971) @PetroSilenius
175
+ - &#8203;<!-- 09 -->[examples] Next.js examples v13 - links (#34970) @PetroSilenius
176
+ - &#8203;<!-- 04 -->[website] Update IPinfo.AI name @oliviertassinari
177
+ - &#8203;<!-- 03 -->[website] Remove date-io from the docs dependencies (#34748) @michaldudak
178
+ - &#8203;<!-- 02 -->[website] Migrate Design-kits page to use CSS theme variables (#34920) @jesrodri
179
+ - &#8203;<!-- 01 -->[website] Migrate Pricing page to use CSS theme variables (#34917) @trizotti
180
+
181
+ ### Core
182
+
183
+ - &#8203;<!-- 25 -->[core] Remove default access to GitHub action scopes @oliviertassinari
184
+ - &#8203;<!-- 24 -->[core] Fix Pinned-Dependencies @oliviertassinari
185
+ - &#8203;<!-- 23 -->[core] Fix typos in the component name @oliviertassinari
186
+ - &#8203;<!-- 22 -->[core] Fix scorecard regression @oliviertassinari
187
+ - &#8203;<!-- 21 -->[core] Create the docs theme once (#34954) @oliviertassinari
188
+
189
+ All contributors of this release in alphabetical order: @akshaya-venkatesh8, @alexfauquette, @hbjORbj, @Janpot, @jesrodri, @michaldudak, @oliviertassinari, @PetroSilenius, @samuelsycamore, @shivam1646, @siriwatknp, @trizotti
190
+
191
+ ## v5.10.12
192
+
193
+ <!-- generated comparing v5.10.11..master -->
194
+
195
+ _Oct 31, 2022_
196
+
197
+ A big thanks to the 16 contributors who made this release possible. Here are some highlights โœจ:
198
+
199
+ - ๐Ÿš€ The LinearProgress component has been added to Joy UI by @hbjORbj (#34514).
200
+ - Many other ๐Ÿ› bug fixes, ๐Ÿ“š documentation, and โš™๏ธ infrastructure improvements.
201
+
202
+ ### `@mui/material@5.10.12`
203
+
204
+ - &#8203;<!-- 37 -->[Chip] Don't override icon color (#34247) @emlai
205
+ - &#8203;<!-- 09 -->[Radio] Skip default hover style when disableRipple is set (#34902) @VinceCYLiao
206
+ - &#8203;<!-- 08 -->[SwipeableDrawer] Fix React 18 issues (#34505) @mnajdova
207
+ - &#8203;<!-- 05 -->[Tooltip] Save a few bytes (#34853) @oliviertassinari
208
+
209
+ ### `@mui/base@5.0.0-alpha.104`
210
+
211
+ - &#8203;<!-- 38 -->[ButtonUnstyled] Update to render as link when href or to is provided (#34337) @EduardoSCosta
212
+
213
+ ### `@mui/joy@5.0.0-alpha.52`
214
+
215
+ - &#8203;<!-- 36 -->[Joy][circularprogress] Prevent new styles from being generated when `value` changes (#34897) @hbjORbj
216
+ - &#8203;<!-- 11 -->[Joy] Add color inversion feature (#32511) @siriwatknp
217
+ - &#8203;<!-- 10 -->[Joy] Add `LinearProgress` component (#34514) @hbjORbj
218
+
219
+ ### Docs
220
+
221
+ - &#8203;<!-- 40 -->[blog] Add blog post for high-level overview of all MUI products (#34325) @samuelsycamore
222
+ - &#8203;<!-- 39 -->[blog] Fix hydration mistmatch (#34857) @oliviertassinari
223
+ - &#8203;<!-- 21 -->[docs] Revise the Joy UI "Aspect Ratio" page (#34858) @samuelsycamore
224
+ - &#8203;<!-- 20 -->[docs] Fix Safari code font size (#34859) @oliviertassinari
225
+ - &#8203;<!-- 19 -->[docs] Fix spelling mistake (#34955) @punithnayak
226
+ - &#8203;<!-- 18 -->[docs] Fix 404 link of supported Material UI components @oliviertassinari
227
+ - &#8203;<!-- 17 -->[docs] Fix Safari button misalignment (#34861) @oliviertassinari
228
+ - &#8203;<!-- 16 -->[docs] Fix typo in docs title (#34926) @PunitSoniME
229
+ - &#8203;<!-- 25 -->[docs] Fix missing emotion prefixes (#34958) @oliviertassinari
230
+ - &#8203;<!-- 26 -->[docs] Improve UI display for copy code (#34950) @oliviertassinari
231
+ - &#8203;<!-- 15 -->[docs] Standardize all MUI Core "Usage" pages (#34183) @samuelsycamore
232
+ - &#8203;<!-- 14 -->[docs] Update templates' readme files to include required dependencies (#34757) @michaldudak
233
+ - &#8203;<!-- 13 -->[docs] Fix inconsistent theme colors when applying custom colors in playground (#34866) @cherniavskii
234
+ - &#8203;<!-- 12 -->[docs] Fix typo in bottom-navigation.md (#34884) @RoodyCode
235
+ - &#8203;<!-- 07 -->[website] Migrate about-us page to use CSS theme variables (#34919) @brianlu2610
236
+ - &#8203;<!-- 06 -->[website] Migrate Product-Templates page to use CSS theme variables (#34913) @EduardoSCosta
237
+ - &#8203;<!-- 05 -->[website] Migrate career page to use CSS theme variables (#34908) @the-mgi
238
+ - &#8203;<!-- 04 -->[website] Update MUI X open and future roles + about page (#34894) @DanailH
239
+ - &#8203;<!-- 03 -->[website] Remove one DOM node (#34960) @oliviertassinari
240
+ - &#8203;<!-- 02 -->[website] Use `span` for icon image (#34914) @siriwatknp
241
+ - &#8203;<!-- 01 -->[website] Fix subscribe input with Safari (#34869) @oliviertassinari
242
+
243
+ ### Core
244
+
245
+ - &#8203;<!-- 35 -->[core] Ignore compiled icons in CodeQL @oliviertassinari
246
+ - &#8203;<!-- 34 -->[core] Add OSSF Scorecard action (#34854) @oliviertassinari
247
+ - &#8203;<!-- 40 -->[core] Fix extra GitHub Action permission (#34496) @sashashura
248
+ - &#8203;<!-- 33 -->[core] Fix duplicate id @oliviertassinari
249
+ - &#8203;<!-- 41 -->[core] Enforce import \* as React (#34878) @da0x
250
+ - &#8203;<!-- 32 -->[core] A couple of simply fixes from #34870 (#34953) @oliviertassinari
251
+ - &#8203;<!-- 31 -->[core] Migrate outdated pattern to convention @oliviertassinari
252
+ - &#8203;<!-- 30 -->[core] Pin GitHub Actions dependencies (#34929) @renovate[bot]
253
+ - &#8203;<!-- 29 -->[core] Make the reproduction more important in the bug template (#34875) @oliviertassinari
254
+ - &#8203;<!-- 28 -->[core] Fix docs GitHub API rate limit (#34856) @oliviertassinari
255
+ - &#8203;<!-- 42 -->[core] Fix eslint issues (#34964) @mnajdova
256
+ - &#8203;<!-- 27 -->[core] Pin GitHub Action to digests (#34855) @oliviertassinari
257
+ - &#8203;<!-- 26 -->[core] Fix permissions in workflow @oliviertassinari
258
+ - &#8203;<!-- 25 -->[core] memoize context values for react/jsx-no-constructed-context-values (#34849) @Janpot
259
+ - &#8203;<!-- 24 -->[core] Fix @typescript-eslint/default-param-last issues (#34846) @Janpot
260
+ - &#8203;<!-- 23 -->[core] Fix HTML validation error (#34860) @oliviertassinari
261
+ - &#8203;<!-- 22 -->[core] Fix duplicate CodeQL build @oliviertassinari
262
+ - &#8203;<!-- 07 -->[test] Move Firefox tests to CircleCI (#34764) @oliviertassinari
263
+ - &#8203;<!-- 06 -->[test] Use screen when possible for simplicity (#34890) @oliviertassinari
264
+
265
+ 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
266
+
267
+ ## v5.10.11
268
+
269
+ <!-- generated comparing v5.10.10..master -->
270
+
271
+ _Oct 25, 2022_
272
+
273
+ A big thanks to the 10 contributors who made this release possible. Here are some highlights โœจ:
274
+
275
+ - ๐Ÿ”ง Moved `components` to `slots` prop starting at MUI Base to create consistency across products
276
+ - Many other ๐Ÿ› bug fixes, ๐Ÿ“š documentation, and โš™๏ธ infrastructure improvements
277
+
278
+ ### `@mui/material@5.10.11`
279
+
280
+ - [InputBase] Fix `onInvalid` to use HTMLInputElement | HTMLTextAreaElement Element type (#33162) @KuSh
281
+ - [Alert] Add `components` and `componentsProps` props to allow close action overrides (#33582) @jake-collibra
282
+
283
+ ### `@mui/base@5.0.0-alpha.103`
284
+
285
+ #### BREAKING CHANGE
286
+
287
+ - [base] `components` -> `slots` API rename (#34693) @michaldudak
288
+
289
+ - Change all occurrences ofย componentsย andย componentsPropsย props in Base components toย slotsย andย slotProps, respectively.
290
+ - Change casing ofย slots' fields to camelCase
291
+
292
+ ```diff
293
+ -<SwitchUnstyled components={{Root: CustomRoot}} componentsProps={{rail: { className: 'custom-rail' }}} />
294
+ +<SwitchUnstyled slots={{root: CustomRoot}} slotProps={{rail: { className: 'custom-rail' }}} />
295
+ ```
296
+
297
+ - [base] Make CSS class prefixes consistent (#33411) @michaldudak
298
+
299
+ **This is a breaking change for anyone who depends on the class names applied to Base components.**
300
+ 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.
301
+
302
+ ```diff
303
+ -.ButtonUnstyled-root { ... };
304
+ +.MuiButton-root { ... };
305
+ ```
306
+
307
+ #### Changes
308
+
309
+ - [test] Test all Base components with describeConformanceUnstyled (#34825) @michaldudak
310
+
311
+ ### `@mui/joy@5.0.0-alpha.51`
312
+
313
+ - [CircularProgress][joy] Fix classnames and add test (#34806) @hbjORbj
314
+ - [Joy] Allow string type for `size` prop in components (#34805) @hbjORbj
315
+
316
+ ### Docs
317
+
318
+ - Revert "[docs] Fix search icons in other languages (#34823)" @oliviertassinari
319
+ - Revert "[core] Move SearchIcons to docs src folder (#34802)" @oliviertassinari
320
+ - Revert "[docs] Live demos (#34454)" @oliviertassinari
321
+ - Update the order of operations for pagination example so that slicing takes place after sorting. (#34189) @marceliwac
322
+ - [docs] Gatsby Description in Joy dark-mode (#34702) @pixelass
323
+ - [docs] Add notification for blogpost MUI X v6 alpha (#34809) @joserodolfofreitas
324
+ - [docs] Polish Crowdin config (#34852) @oliviertassinari
325
+ - [docs] Fix a few style standard deviations @oliviertassinari
326
+ - [docs] Enforce no trailing spaces (#34762) @oliviertassinari
327
+ - [docs] Enforce correct git diff format (#34765) @oliviertassinari
328
+ - [docs] Fix Toolpad docs 301 route (#34843) @bharatkashyap
329
+ - [docs] Replace initial value with theme white (#34822) @siriwatknp
330
+ - [docs] Remove localization redirects (#34844) @mnajdova
331
+ - [docs] Fix search icons in other languages (#34823) @siriwatknp
332
+ - [docs] Fix JavaScript capitalization @oliviertassinari
333
+ - [docs] Update new links to MD2 (#34848) @oliviertassinari
334
+ - [website] Update future work items on X landing page (#34810) @joserodolfofreitas
335
+ - [website] Add Toolpad docs to navigation (#34749) @bharatkashyap
336
+
337
+ ### Core
338
+
339
+ - [core] Remove dead files (#34850) @oliviertassinari
340
+ - [core] Fix revert conflict @oliviertassinari
341
+ - [core] Fix a few CodeQL errors (#34766) @oliviertassinari
342
+ - [core] Harden GitHub Actions permissions (#34769) @oliviertassinari
343
+ - [core] Remove the codeowners file (#34876) @michaldudak
344
+
345
+ All contributors of this release in alphabetical order: @bharatkashyap, @hbjORbj, @jake-collibra, @joserodolfofreitas, @KuSh, @marceliwac, @michaldudak, @oliviertassinari, @pixelass, @siriwatknp
346
+
347
+ ## 5.10.10
348
+
349
+ <!-- generated comparing v5.10.9..master -->
350
+
351
+ _Oct 18, 2022_
352
+
353
+ A big thanks to the 21 contributors who made this release possible. Here are some highlights โœจ:
354
+
355
+ - ๐Ÿ–Œ Thanks to the efforts of @bharatkashyap and @nihgwu, we now have editable demos across our docs (#34454)!
356
+ - ๐Ÿš€ The Tooltip component has been added to Joy UI by @hbjORbj (#34509).
357
+ - โš™๏ธ We started converting the remaining JS components in MUI Base to TypeScript.
358
+ @mbayucot finished the first PR with the conversion of the NoSsr code (#34735).
359
+ - And more ๐Ÿ› bug fixes and ๐Ÿ“š documentation improvements.
360
+
361
+ ### `@mui/material@5.10.10`
362
+
363
+ - [Popover] Fix paper position flash on open (#34546) @TheUnlocked
364
+ - [SwipeableDrawer] Make component `defaultProps` overridable (#34643) @hbjORbj
365
+
366
+ ### `@mui/system@5.10.10`
367
+
368
+ - [system] Support CSS `grey` color in `sx` (#34548) @TheUnlocked
369
+
370
+ ### `@mui/styles@5.10.10`
371
+
372
+ - [styles] Use memoized context in StylesProvider (#34637) @mohd-akram
373
+
374
+ ### `@mui/joy@5.0.0-alpha.50`
375
+
376
+ - [Select][joy] Added hidden input element (#34657) @zee-bit
377
+ - [Slider][joy] Add global variant to slider (#34733) @siriwatknp
378
+ - [Tooltip][joy] Add component (#34509) @hbjORbj
379
+
380
+ ### `@mui/base@5.0.0-alpha.102`
381
+
382
+ - [MultiSelect][base] Prevent the renderValue prop from being propagated to the DOM (#34698) @michaldudak
383
+ - [NoSsr] Convert code to TypeScript (#34735) @mbayucot
384
+
385
+ ### Docs
386
+
387
+ - [docs] Fix the Autocomplete Highlighting example (#34184) @hayawata3626
388
+ - [docs] Fix typos in Base (Menu, Tabs) and Joy UI (Chip) (#34803) @rvrvrv
389
+ - [docs] Use new editing API in homepage demos (#34220) @m4theushw
390
+ - [docs] Live demos (#34454) @bharatkashyap
391
+ - [docs] Fix typos in Joy UI Switch (#34728) @ndresx
392
+ - [docs] Avoid scrollbar in the code demos (#34741) @oliviertassinari
393
+ - [docs] Revise the Joy UI "Automatic adjustment" page (#34614) @samuelsycamore
394
+ - [docs] Revise and rename the Joy UI "Perfect dark mode" page (#34613) @samuelsycamore
395
+ - [docs] Revise the Joy UI "Global variants" page (#34595) @samuelsycamore
396
+ - [docs] Basic link verification at PR level (#34588) @alexfauquette
397
+ - [docs] Add a missing comma in the customization example (#34617) @AbayKinayat
398
+ - [website] Clarify Pro/Premium support (#34607) @oliviertassinari
399
+ - [website] Fix home page dark mode flicker (#33545)
400
+ - [website] Update the state of the date pickers on the landing page (#34750) @joserodolfofreitas
401
+
402
+ ### Core
403
+
404
+ - [core] Clean conditionals (#34772) @pedroprado010
405
+ - [core] Temporary remove the authorization (#34796) @siriwatknp
406
+ - [core] Avoid slower CI run statues @oliviertassinari
407
+ - [core] Improve the playground DX (#34739) @oliviertassinari
408
+ - [core] Link Netlify in the danger comment (#34688) @oliviertassinari
409
+ - [core] Fix CI after out of sync merge @oliviertassinari
410
+ - [core] Enforce straight quote (#34686) @oliviertassinari
411
+ - [core] Add code scanning via CodeQL (#34707) @DanailH
412
+ - [core] Fix some upcoming eslint issues (#34727) @oliviertassinari
413
+ - [core] Auto-fix upcoming eslint issues (#34644) @Janpot
414
+ - [core] Move SearchIcons to docs src folder (#34802)
415
+ - [test] Enable `react/no-unstable-nested-components` (#34518) @eps1lon
416
+
417
+ 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
418
+
3
419
  ## 5.10.9
4
420
 
5
421
  <!-- generated comparing v5.10.8..master -->
@@ -154,8 +570,8 @@ A big thanks to the 21 contributors who made this release possible. Here are som
154
570
  - [TrapFocus] Rename TrapFocus to FocusTrap (#34216) @kabernardes
155
571
 
156
572
  ```diff
157
- - import TrapFocus from โ€˜@mui/base/TrapFocusโ€™;
158
- + import FocusTrap from โ€˜@mui/base/FocusTrapโ€™;
573
+ -import TrapFocus from '@mui/base/TrapFocus';
574
+ +import FocusTrap from '@mui/base/FocusTrap';
159
575
  ```
160
576
 
161
577
  #### Changes
@@ -437,7 +853,7 @@ _Aug 22, 2022_
437
853
 
438
854
  A big thanks to the 11 contributors who made this release possible. Here are some highlights โœจ:
439
855
 
440
- - โœจ @michaldudak synced the Material Icons set with the latest from Google (#33988).
856
+ - โœจ @michaldudak synced the Material Icons set with the latest from Google (#33988).\
441
857
  A couple of icons changed their appearance. See the difference [on this Argos build](https://app.argos-ci.com/mui/material-ui/builds/4428]).
442
858
 
443
859
  ### `@mui/material@5.10.2`
@@ -1629,7 +2045,8 @@ All contributors of this release in alphabetical order: @abhinav-22-tech, @ainat
1629
2045
 
1630
2046
  _Apr 18, 2022_
1631
2047
 
1632
- A big thanks to the 11 contributors who made this release possible. This release is mostly about ๐Ÿ› bug fixes and ๐Ÿ“š documentation improvements.
2048
+ A big thanks to the 11 contributors who made this release possible.
2049
+ This release is mostly about ๐Ÿ› bug fixes and ๐Ÿ“š documentation improvements.
1633
2050
 
1634
2051
  ### `@mui/material@5.6.2`
1635
2052
 
@@ -1688,7 +2105,7 @@ All contributors of this release in alphabetical order: @abaker93, @cherniavskii
1688
2105
 
1689
2106
  _Apr 11, 2022_
1690
2107
 
1691
- A big thanks to the 8 contributors who made this release possible.
2108
+ A big thanks to the 8 contributors who made this release possible.
1692
2109
  This release is mostly about ๐Ÿ› bug fixes and ๐Ÿ“š documentation improvements.
1693
2110
 
1694
2111
  ### `@mui/material@5.6.1`
@@ -1851,7 +2268,7 @@ A big thanks to the 17 contributors who made this release possible. Here are som
1851
2268
  -import { Unstyled_TrapFocus } from '@mui/base';
1852
2269
  +import { TrapFocus } from '@mui/base';
1853
2270
 
1854
- // or
2271
+ // or
1855
2272
 
1856
2273
  -import TrapFocus from '@mui/base/Unstyled_TrapFocus';
1857
2274
  +import TrapFocus from '@mui/base/TrapFocus';
@@ -2027,8 +2444,8 @@ A big thanks to the 16 contributors who made this release possible. Here are som
2027
2444
  `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:
2028
2445
 
2029
2446
  ```diff
2030
- - import { unstable_ClassNameGenerator } from '@mui/material/utils';
2031
- + import { unstable_ClassNameGenerator } from '@mui/material/className';
2447
+ -import { unstable_ClassNameGenerator } from '@mui/material/utils';
2448
+ +import { unstable_ClassNameGenerator } from '@mui/material/className';
2032
2449
  ```
2033
2450
 
2034
2451
  #### Changes
@@ -2370,8 +2787,8 @@ A big thanks to the 22 contributors who made this release possible. Here are som
2370
2787
  3. Change the import paths of unstyled components from @mui/material to @mui/base, e.g.:
2371
2788
 
2372
2789
  ```diff
2373
- - @import ButtonUnstyled from '@mui/material/ButtonUnstyled';
2374
- + @import ButtonUnstyled from '@mui/base/ButtonUnstyled';
2790
+ -import ButtonUnstyled from '@mui/material/ButtonUnstyled';
2791
+ +import ButtonUnstyled from '@mui/base/ButtonUnstyled';
2375
2792
  ```
2376
2793
 
2377
2794
  #### Changes
@@ -4414,12 +4831,12 @@ A big thanks to the 13 contributors who made this release possible. Here are som
4414
4831
  `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).
4415
4832
 
4416
4833
  ```diff
4417
- <button class="MuiTab-root">
4418
- - <span class="MuiTab-wrapper">
4834
+ <button class="MuiTab-root">
4835
+ - <span class="MuiTab-wrapper">
4419
4836
  {icon}
4420
4837
  {label}
4421
- - </span>
4422
- </button>
4838
+ - </span>
4839
+ </button>
4423
4840
  ```
4424
4841
 
4425
4842
  - [BottomNavigation] Remove wrapper from BottomNavigationAction (#26923) @siriwatknp
@@ -4427,14 +4844,14 @@ A big thanks to the 13 contributors who made this release possible. Here are som
4427
4844
  `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).
4428
4845
 
4429
4846
  ```diff
4430
- <button class="MuiBottomNavigationAction-root">
4431
- - <span class="MuiBottomNavigationAction-wrapper">
4432
- {icon}
4433
- <span class="MuiBottomNavigationAction-label">
4434
- {label}
4435
- </span>
4436
- - </span>
4437
- </button>
4847
+ <button class="MuiBottomNavigationAction-root">
4848
+ - <span class="MuiBottomNavigationAction-wrapper">
4849
+ {icon}
4850
+ <span class="MuiBottomNavigationAction-label">
4851
+ {label}
4852
+ </span>
4853
+ - </span>
4854
+ </button>
4438
4855
  ```
4439
4856
 
4440
4857
  #### Changes
@@ -4467,15 +4884,15 @@ A big thanks to the 13 contributors who made this release possible. Here are som
4467
4884
  Make the default rendered text field closer to the most common use cases (denser).
4468
4885
 
4469
4886
  ```diff
4470
- <DatePicker
4471
- label="Helper text example"
4472
- value={value}
4473
- onChange={onChange}
4474
- renderInput={(params) => (
4887
+ <DatePicker
4888
+ label="Helper text example"
4889
+ value={value}
4890
+ onChange={onChange}
4891
+ renderInput={(params) => (
4475
4892
  - <TextField {...params} />
4476
4893
  + <TextField {...params} helperText={params?.inputProps?.placeholder} />
4477
- )}
4478
- >
4894
+ )}
4895
+ >
4479
4896
  ```
4480
4897
 
4481
4898
  #### Changes
@@ -4537,7 +4954,7 @@ _Jun 23, 2021_
4537
4954
  A big thanks to the 18 contributors who made this release possible. Here are some highlights โœจ:
4538
4955
 
4539
4956
  - ๐Ÿš€ 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.
4540
- - ๐ŸŽจ We have updated `Slider` to match current [Material Design guidelines](https://material.io/components/sliders).
4957
+ - ๐ŸŽจ We have updated `Slider` to match current [Material Design guidelines](https://m2.material.io/components/sliders).
4541
4958
 
4542
4959
  <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>
4543
4960
 
@@ -4581,16 +4998,16 @@ A big thanks to the 18 contributors who made this release possible. Here are som
4581
4998
  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).
4582
4999
 
4583
5000
  ```diff
4584
- {
4585
- xs: 0,
4586
- sm: 600,
4587
- - md: 960,
4588
- + md: 900,
4589
- - lg: 1280,
4590
- + lg: 1200,
4591
- - xl: 1920,
4592
- + xl: 1536,
4593
- }
5001
+ {
5002
+ xs: 0,
5003
+ sm: 600,
5004
+ - md: 960,
5005
+ + md: 900,
5006
+ - lg: 1280,
5007
+ + lg: 1200,
5008
+ - xl: 1920,
5009
+ + xl: 1536,
5010
+ }
4594
5011
  ```
4595
5012
 
4596
5013
  If you prefer the old breakpoint values, use the snippet below.
@@ -4622,7 +5039,7 @@ A big thanks to the 18 contributors who made this release possible. Here are som
4622
5039
 
4623
5040
  - &#8203;<!-- 08 -->[Slider] Adjust css to match the specification (#26632) @siriwatknp
4624
5041
 
4625
- 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/).
5042
+ 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/).
4626
5043
 
4627
5044
  <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>
4628
5045
 
@@ -4635,11 +5052,11 @@ A big thanks to the 18 contributors who made this release possible. Here are som
4635
5052
  `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).
4636
5053
 
4637
5054
  ```diff
4638
- <button class="MuiIconButton-root">
4639
- - <span class="MuiIconButton-label">
4640
- <svg />
4641
- - </span>
4642
- </button>
5055
+ <button class="MuiIconButton-root">
5056
+ - <span class="MuiIconButton-label">
5057
+ <svg />
5058
+ - </span>
5059
+ </button>
4643
5060
  ```
4644
5061
 
4645
5062
  - &#8203;<!-- 19 -->[core] Remove `unstable_` prefix on the `useThemeProps` hook (#26777) @mnajdova
@@ -4765,11 +5182,11 @@ A big thanks to the 11 contributors who made this release possible. Here are som
4765
5182
  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.
4766
5183
 
4767
5184
  ```diff
4768
- <button class="MuiButton-root">
4769
- - <span class="MuiButton-label">
4770
- children
4771
- - </span>
4772
- </button>
5185
+ <button class="MuiButton-root">
5186
+ - <span class="MuiButton-label">
5187
+ children
5188
+ - </span>
5189
+ </button>
4773
5190
  ```
4774
5191
 
4775
5192
  #### Changes
@@ -4798,7 +5215,7 @@ A big thanks to the 11 contributors who made this release possible. Here are som
4798
5215
  + const theme = useTheme();
4799
5216
  + const isRtl = theme.direction === 'rtl';
4800
5217
  //.. rest of the code
4801
- }
5218
+ }
4802
5219
  ```
4803
5220
 
4804
5221
  #### Changes
@@ -4870,7 +5287,7 @@ A big thanks to the 14 contributors who made this release possible. Here are som
4870
5287
 
4871
5288
  - &#8203;<!-- 10 -->[AppBar] Fix background color on dark mode (#26545) @siriwatknp
4872
5289
 
4873
- 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.
5290
+ 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.
4874
5291
 
4875
5292
  ```jsx
4876
5293
  <AppBar enableColorOnDark />
@@ -4921,13 +5338,14 @@ A big thanks to the 14 contributors who made this release possible. Here are som
4921
5338
  - &#8203;<!-- 29 -->[pickers] Remove `openPickerIcon` prop in favor of `components.OpenPickerIcon` (#26223) @vedadeepta
4922
5339
 
4923
5340
  ```diff
4924
- <DateTimePicker
4925
- components={{
4926
- LeftArrowIcon: AlarmIcon,
4927
- RightArrowIcon: SnoozeIcon,
4928
- + OpenPickerIcon: ClockIcon,
4929
- }}
4930
- - openPickerIcon={<ClockIcon />}
5341
+ <DateTimePicker
5342
+ components={{
5343
+ LeftArrowIcon: AlarmIcon,
5344
+ RightArrowIcon: SnoozeIcon,
5345
+ + OpenPickerIcon: ClockIcon,
5346
+ }}
5347
+ - openPickerIcon={<ClockIcon />}
5348
+ >
4931
5349
  ```
4932
5350
 
4933
5351
  ### `@material-ui/system@5.0.0-alpha.36`
@@ -5031,8 +5449,8 @@ A big thanks to the 14 contributors who made this release possible. Here are som
5031
5449
 
5032
5450
  Update the implementation to better match Material Design:
5033
5451
 
5034
- - Tab `minWidth` changed from `72px` => `90px` (without media-query) according to [material-design spec](https://material.io/components/tabs#specs)
5035
- - Tab `maxWidth` changed from `264px` => `360px` according to [material-design spec](https://material.io/components/tabs#specs)
5452
+ - Tab `minWidth` changed from `72px` => `90px` (without media-query) according to [material-design spec](https://m2.material.io/components/tabs#specs)
5453
+ - Tab `maxWidth` changed from `264px` => `360px` according to [material-design spec](https://m2.material.io/components/tabs#specs)
5036
5454
 
5037
5455
  #### Changes
5038
5456
 
@@ -5150,10 +5568,10 @@ A big thanks to the 16 contributors who made this release possible. Here are som
5150
5568
  Move the custom class on `input` to `select`. The `input` key is being applied on another element.
5151
5569
 
5152
5570
  ```diff
5153
- <TablePagination
5154
- - classes={{ input: 'foo' }}
5155
- + classes={{ select: 'foo' }}
5156
- />
5571
+ <TablePagination
5572
+ - classes={{ input: 'foo' }}
5573
+ + classes={{ select: 'foo' }}
5574
+ />
5157
5575
  ```
5158
5576
 
5159
5577
  - &#8203;<!-- 45 -->[core] Move `StyledEngineProvider` to `@material-ui/core/styles` (#26265) @mnajdova
@@ -5198,10 +5616,10 @@ A big thanks to the 16 contributors who made this release possible. Here are som
5198
5616
  - &#8203;<!-- 63 -->[Autocomplete] Rename getOptionSelected to isOptionEqualToValue (#26173) @m4theushw
5199
5617
 
5200
5618
  ```diff
5201
- <Autocomplete
5619
+ <Autocomplete
5202
5620
  - getOptionSelected={(option, value) => option.title === value.title}
5203
5621
  + isOptionEqualToValue={(option, value) => option.title === value.title}
5204
- />
5622
+ />
5205
5623
  ```
5206
5624
 
5207
5625
  > Follow [this link](https://mui.com/material-ui/migration/migration-v4/) for full migration from v4 => v5
@@ -5304,18 +5722,20 @@ A big thanks to the 17 contributors who made this release possible. Here are som
5304
5722
  Replace the `innerRef` prop with the `ref` prop. Refs are now automatically forwarded to the inner component.
5305
5723
 
5306
5724
  ```diff
5307
- import * as React from 'react';
5308
- import { withStyles } from '@material-ui/core/styles';
5309
- const MyComponent = withStyles({
5310
- root: {
5311
- backgroundColor: 'red',
5312
- },
5313
- })(({ classes }) => <div className={classes.root} />);
5314
- function MyOtherComponent(props) {
5315
- const ref = React.useRef();
5316
- - return <MyComponent innerRef={ref} />;
5317
- + return <MyComponent ref={ref} />;
5318
- }
5725
+ import * as React from 'react';
5726
+ import { withStyles } from '@material-ui/core/styles';
5727
+
5728
+ const MyComponent = withStyles({
5729
+ root: {
5730
+ backgroundColor: 'red',
5731
+ },
5732
+ })(({ classes }) => <div className={classes.root} />);
5733
+
5734
+ function MyOtherComponent(props) {
5735
+ const ref = React.useRef();
5736
+ - return <MyComponent innerRef={ref} />;
5737
+ + return <MyComponent ref={ref} />;
5738
+ }
5319
5739
  ```
5320
5740
 
5321
5741
  **withTheme**
@@ -5323,14 +5743,16 @@ A big thanks to the 17 contributors who made this release possible. Here are som
5323
5743
  Replace the `innerRef` prop with the `ref` prop. Refs are now automatically forwarded to the inner component.
5324
5744
 
5325
5745
  ```diff
5326
- import * as React from 'react';
5327
- import { withTheme } from '@material-ui/core/styles';
5328
- const MyComponent = withTheme(({ theme }) => <div>{props.theme.direction}</div>);
5329
- function MyOtherComponent(props) {
5330
- const ref = React.useRef();
5331
- - return <MyComponent innerRef={ref} />;
5332
- + return <MyComponent ref={ref} />;
5333
- }
5746
+ import * as React from 'react';
5747
+ import { withTheme } from '@material-ui/core/styles';
5748
+
5749
+ const MyComponent = withTheme(({ theme }) => <div>{props.theme.direction}</div>);
5750
+
5751
+ function MyOtherComponent(props) {
5752
+ const ref = React.useRef();
5753
+ - return <MyComponent innerRef={ref} />;
5754
+ + return <MyComponent ref={ref} />;
5755
+ }
5334
5756
  ```
5335
5757
 
5336
5758
  - &#8203;<!-- 10 -->[theme] Rename `createMuiTheme` to `createTheme` (#25992) @m4theushw
@@ -5672,23 +6094,23 @@ A big thanks to the 15 contributors who made this release possible. Here are som
5672
6094
  - &#8203;<!-- 41 -->[Checkbox][switch] Remove checked argument from onChange (#25871) @m4theushw
5673
6095
 
5674
6096
  ```diff
5675
- function MyCheckbox() {
5676
- - const handleChange = (event: React.ChangeEvent<HTMLInputElement>, checked: boolean) => {
5677
- + const handleChange = (event: React.ChangeEvent<HTMLInputElement>) => {
5678
- + const checked = event.target.checked;
5679
- };
5680
- return <Checkbox onChange={handleChange} />;
5681
- }
6097
+ function MyCheckbox() {
6098
+ - const handleChange = (event: React.ChangeEvent<HTMLInputElement>, checked: boolean) => {
6099
+ + const handleChange = (event: React.ChangeEvent<HTMLInputElement>) => {
6100
+ + const checked = event.target.checked;
6101
+ };
6102
+ return <Checkbox onChange={handleChange} />;
6103
+ }
5682
6104
  ```
5683
6105
 
5684
6106
  ```diff
5685
- function MySwitch() {
5686
- - const handleChange = (event: React.ChangeEvent<HTMLInputElement>, checked: boolean) => {
5687
- + const handleChange = (event: React.ChangeEvent<HTMLInputElement>) => {
5688
- + const checked = event.target.checked;
5689
- };
5690
- return <Switch onChange={handleChange} />;
5691
- }
6107
+ function MySwitch() {
6108
+ - const handleChange = (event: React.ChangeEvent<HTMLInputElement>, checked: boolean) => {
6109
+ + const handleChange = (event: React.ChangeEvent<HTMLInputElement>) => {
6110
+ + const checked = event.target.checked;
6111
+ };
6112
+ return <Switch onChange={handleChange} />;
6113
+ }
5692
6114
  ```
5693
6115
 
5694
6116
  - &#8203;<!-- 42 -->[theme] Remove theme.breakpoints.width helper (#25918) @m4theushw
@@ -5843,12 +6265,12 @@ A big thanks to the 19 contributors who made this release possible. Here are som
5843
6265
  -import DayPicker from '@material-ui/lab/DayPicker';
5844
6266
  +import CalendarPicker from '@material-ui/lab/CalendarPicker';
5845
6267
 
5846
- createMuiTheme({
5847
- components: {
5848
- - MuiDayPicker: {},
5849
- + MuiCalendarPicker: {},
5850
- }
5851
- })
6268
+ createMuiTheme({
6269
+ components: {
6270
+ - MuiDayPicker: {},
6271
+ + MuiCalendarPicker: {},
6272
+ }
6273
+ })
5852
6274
  ```
5853
6275
 
5854
6276
  - &#8203;<!-- 04 -->[Pickers] Rename PickersCalendarSkeleton to CalendarPickerSkeleton (#25679) @eps1lon
@@ -6372,10 +6794,10 @@ A big thanks to the 26 contributors who made this release possible. Here are som
6372
6794
 
6373
6795
  - &#8203;<!-- 087 -->[icons] Synchronize icons (#25055) @eps1lon
6374
6796
 
6375
- 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:
6797
+ 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:
6376
6798
 
6377
6799
  ```diff
6378
- // AmpStories -> Download
6800
+ // AmpStories -> Download
6379
6801
  -AmpStories
6380
6802
  +Download
6381
6803
  -AmpStoriesOutlined
@@ -6386,7 +6808,7 @@ A big thanks to the 26 contributors who made this release possible. Here are som
6386
6808
  +DownloadSharp
6387
6809
  -AmpStoriesTwoTone
6388
6810
  +DownloadTwoTone
6389
- // Outbond -> Outbound
6811
+ // Outbond -> Outbound
6390
6812
  -Outbond
6391
6813
  +Outbound
6392
6814
  -OutbondOutlined
@@ -6563,10 +6985,10 @@ A big thanks to the 30 contributors who made this release possible. Here are som
6563
6985
  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}>`.
6564
6986
 
6565
6987
  ```diff
6566
- <Box
6567
- - gap={2}
6568
- + gap="2px"
6569
- >
6988
+ <Box
6989
+ - gap={2}
6990
+ + gap="2px"
6991
+ >
6570
6992
  ```
6571
6993
 
6572
6994
  ### `@material-ui/styled-engine@5.0.0-alpha.25`
@@ -6807,14 +7229,14 @@ A big thanks to the 15 contributors who made this release possible. Here are som
6807
7229
  --- a/docs/src/pages/components/date-range-picker/BasicDateRangePicker.tsx
6808
7230
  +++ b/docs/src/pages/components/date-range-picker/BasicDateRangePicker.tsx
6809
7231
  @@ -3,7 +3,7 @@ import TextField from '@material-ui/core/TextField';
6810
- import DateRangePicker, { DateRange } from '@material-ui/lab/DateRangePicker';
6811
- import AdapterDateFns from '@material-ui/lab/AdapterDateFns';
6812
- import LocalizationProvider from '@material-ui/lab/LocalizationProvider';
7232
+ import DateRangePicker, { DateRange } from '@material-ui/lab/DateRangePicker';
7233
+ import AdapterDateFns from '@material-ui/lab/AdapterDateFns';
7234
+ import LocalizationProvider from '@material-ui/lab/LocalizationProvider';
6813
7235
  -import DateRangeDelimiter from '@material-ui/lab/DateRangeDelimiter';
6814
7236
  +import Box from '@material-ui/core/Box';
6815
7237
 
6816
- export default function BasicDateRangePicker() {
6817
- const [value, setValue] = React.useState<DateRange<Date>>([null, null]);
7238
+ export default function BasicDateRangePicker() {
7239
+ const [value, setValue] = React.useState<DateRange<Date>>([null, null]);
6818
7240
  @@ -20,7 +20,7 @@ export default function BasicDateRangePicker() {
6819
7241
  renderInput={(startProps, endProps) => (
6820
7242
  <React.Fragment>
@@ -7356,42 +7778,42 @@ A big thanks to the 18 contributors who made this release possible. Here are som
7356
7778
  - [Dialog] Remove the `disableBackdropClick` prop. It's redundant with the `reason` argument (#23607) @eps1lon.
7357
7779
 
7358
7780
  ```diff
7359
- <Dialog
7360
- - disableBackdropClick
7361
- - onClose={handleClose}
7362
- + onClose={(event, reason) => {
7363
- + if (reason !== 'backdropClick') {
7364
- + onClose(event, reason);
7365
- + }
7366
- + }}
7367
- />
7781
+ <Dialog
7782
+ - disableBackdropClick
7783
+ - onClose={handleClose}
7784
+ + onClose={(event, reason) => {
7785
+ + if (reason !== 'backdropClick') {
7786
+ + onClose(event, reason);
7787
+ + }
7788
+ + }}
7789
+ />
7368
7790
  ```
7369
7791
 
7370
7792
  - [Modal] Remove the `disableBackdropClick` prop. It's redundant with the `reason` argument (#23607) @eps1lon.
7371
7793
 
7372
7794
  ```diff
7373
- <Modal
7374
- - disableBackdropClick
7375
- - onClose={handleClose}
7376
- + onClose={(event, reason) => {
7377
- + if (reason !== 'backdropClick') {
7378
- + onClose(event, reason);
7379
- + }
7380
- + }}
7381
- />
7795
+ <Modal
7796
+ - disableBackdropClick
7797
+ - onClose={handleClose}
7798
+ + onClose={(event, reason) => {
7799
+ + if (reason !== 'backdropClick') {
7800
+ + onClose(event, reason);
7801
+ + }
7802
+ + }}
7803
+ />
7382
7804
  ```
7383
7805
 
7384
7806
  - [Modal] Remove the `onEscapeKeyDown` prop. It's redundant with the `reason` argument. (#23571) @eps1lon
7385
7807
 
7386
7808
  ```diff
7387
- <Modal
7809
+ <Modal
7388
7810
  - onEscapeKeyDown={handleEscapeKeyDown}
7389
7811
  + onClose={(event, reason) => {
7390
7812
  + if (reason === "escapeKeyDown") {
7391
7813
  + handleEscapeKeyDown(event);
7392
7814
  + }
7393
7815
  + }}
7394
- />;
7816
+ />;
7395
7817
  ```
7396
7818
 
7397
7819
  #### Changes
@@ -7744,10 +8166,10 @@ Here are some highlights โœจ:
7744
8166
  - The CSS prefixes have changed:
7745
8167
 
7746
8168
  ```diff
7747
- popper: {
7748
- zIndex: 1,
7749
- - '&[x-placement*="bottom"] $arrow': {
7750
- + '&[data-popper-placement*="bottom"] $arrow': {
8169
+ popper: {
8170
+ zIndex: 1,
8171
+ - '&[x-placement*="bottom"] $arrow': {
8172
+ + '&[data-popper-placement*="bottom"] $arrow': {
7751
8173
  ```
7752
8174
 
7753
8175
  - Method names have changed.
@@ -7771,13 +8193,13 @@ Here are some highlights โœจ:
7771
8193
  -import withMobileDialog from '@material-ui/core/withMobileDialog';
7772
8194
  +import {ย useTheme, useMediaQuery } from '@material-ui/core';
7773
8195
 
7774
- function ResponsiveDialog(props) {
7775
- - const { fullScreen } = props;
7776
- + const theme = useTheme();
7777
- + const fullScreen = useMediaQuery(theme.breakpoints.down('sm'));
7778
- const [open, setOpen] = React.useState(false);
8196
+ function ResponsiveDialog(props) {
8197
+ - const { fullScreen } = props;
8198
+ + const theme = useTheme();
8199
+ + const fullScreen = useMediaQuery(theme.breakpoints.down('sm'));
8200
+ const [open, setOpen] = React.useState(false);
7779
8201
 
7780
- // ...
8202
+ // ...
7781
8203
 
7782
8204
  -export default withMobileDialog()(ResponsiveDialog);
7783
8205
  +export default ResponsiveDialog;
@@ -8023,24 +8445,24 @@ Here are some highlights โœจ:
8023
8445
  The change was done to match the API convention.
8024
8446
 
8025
8447
  ```diff
8026
- <TablePagination
8027
- - onChangeRowsPerPage={()=>{}}
8028
- - onChangePage={()=>{}}
8029
- + onRowsPerPageChange={()=>{}}
8030
- + onPageChange={()=>{}}
8448
+ <TablePagination
8449
+ - onChangeRowsPerPage={()=>{}}
8450
+ - onChangePage={()=>{}}
8451
+ + onRowsPerPageChange={()=>{}}
8452
+ + onPageChange={()=>{}}
8031
8453
  ```
8032
8454
 
8033
8455
  - [theme] Rename fade to alpha (#22834) @mnajdova
8034
8456
  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.
8035
8457
 
8036
8458
  ```diff
8037
- - import { fade } from '@material-ui/core/styles';
8038
- + import { alpha } from '@material-ui/core/styles';
8459
+ -import { fade } from '@material-ui/core/styles';
8460
+ +import { alpha } from '@material-ui/core/styles';
8039
8461
 
8040
- const classes = makeStyles(theme => ({
8462
+ const classes = makeStyles(theme => ({
8041
8463
  - backgroundColor: fade(theme.palette.primary.main, theme.palette.action.selectedOpacity),
8042
8464
  + backgroundColor: alpha(theme.palette.primary.main, theme.palette.action.selectedOpacity),
8043
- }));
8465
+ }));
8044
8466
  ```
8045
8467
 
8046
8468
  - [Tooltip] Make `interactive` default (#22382) @eps1lon
@@ -8051,7 +8473,7 @@ Here are some highlights โœจ:
8051
8473
  ```diff
8052
8474
  -<Tooltip>
8053
8475
  +<Tooltip disableInteractive>
8054
- # Interactive tooltips no longer need the `interactive` prop.
8476
+ # Interactive tooltips no longer need the `interactive` prop.
8055
8477
  -<Tooltip interactive>
8056
8478
  +<Tooltip>
8057
8479
  ```
@@ -8299,7 +8721,7 @@ Here are some highlights โœจ:
8299
8721
  Renames `theme.palette.type` to `theme.palette.mode`, to better follow the "dark mode" term that is usually used for describing this feature.
8300
8722
 
8301
8723
  ```diff
8302
- import { createMuiTheme } from '@material-ui/core/styles';
8724
+ import { createMuiTheme } from '@material-ui/core/styles';
8303
8725
 
8304
8726
  -const theme = createMuiTheme({palette: { type: 'dark' }}),
8305
8727
  +const theme = createMuiTheme({palette: { mode: 'dark' }}),
@@ -8364,22 +8786,22 @@ Here are some highlights โœจ:
8364
8786
  You can recover from the change with:
8365
8787
 
8366
8788
  ```diff
8367
- <Autocomplete
8368
- - renderOption={(option, { selected }) => (
8369
- - <React.Fragment>
8370
- + renderOption={(props, option, { selected }) => (
8371
- + <li {...props}>
8372
- <Checkbox
8373
- icon={icon}
8374
- checkedIcon={checkedIcon}
8375
- style={{ marginRight: 8 }}
8376
- checked={selected}
8377
- />
8378
- {option.title}
8379
- - </React.Fragment>
8380
- + </li>
8381
- )}
8382
- />
8789
+ <Autocomplete
8790
+ - renderOption={(option, { selected }) => (
8791
+ - <React.Fragment>
8792
+ + renderOption={(props, option, { selected }) => (
8793
+ + <li {...props}>
8794
+ <Checkbox
8795
+ icon={icon}
8796
+ checkedIcon={checkedIcon}
8797
+ style={{ marginRight: 8 }}
8798
+ checked={selected}
8799
+ />
8800
+ {option.title}
8801
+ - </React.Fragment>
8802
+ + </li>
8803
+ )}
8804
+ />
8383
8805
  ```
8384
8806
 
8385
8807
  #### Changes
@@ -8465,12 +8887,12 @@ Here are some highlights โœจ:
8465
8887
  Rename `focused` to `focusVisible` for consistency with the other components:
8466
8888
 
8467
8889
  ```diff
8468
- <Accordion
8469
- classes={{
8470
- - focused: 'custom-focus-visible-classname',
8471
- + focusVisible: 'custom-focus-visible-classname',
8472
- }}
8473
- />
8890
+ <Accordion
8891
+ classes={{
8892
+ - focused: 'custom-focus-visible-classname',
8893
+ + focusVisible: 'custom-focus-visible-classname',
8894
+ }}
8895
+ />
8474
8896
  ```
8475
8897
 
8476
8898
  - [Stepper] Remove Paper and built-in padding (#22564) @mbrookes
@@ -8550,10 +8972,10 @@ Here are some highlights โœจ:
8550
8972
  If you have a custom `icon` prop but no `emptyIcon` prop, you can restore the previous behavior with:
8551
8973
 
8552
8974
  ```diff
8553
- <Rating
8554
- icon={customIcon}
8555
- + emptyIcon={null}
8556
- />
8975
+ <Rating
8976
+ icon={customIcon}
8977
+ + emptyIcon={null}
8978
+ />
8557
8979
  ```
8558
8980
 
8559
8981
  #### Changes
@@ -8583,7 +9005,7 @@ _Sep 6, 2020_
8583
9005
  A big thanks to the 14 contributors who made this release possible.
8584
9006
  Here are some highlights โœจ:
8585
9007
 
8586
- - ๐Ÿ’Ž A new diamond sponsor: [DoiT](https://www.doit-intl.com/), thank you!
9008
+ - ๐Ÿ’Ž A new diamond sponsor: [DoiT](https://www.doit.com/), thank you!
8587
9009
  - ๐Ÿ“š Include the default value of the props in IntelliSense (#22447) @eps1lon
8588
9010
  - โš›๏ธ More source migrated to TypeScript and testing-library (#22441) @baterson
8589
9011
  - And many more ๐Ÿ› bug fixes and ๐Ÿ“š improvements.
@@ -8679,9 +9101,9 @@ const theme = createMuiTheme({
8679
9101
  1. `props`
8680
9102
 
8681
9103
  ```diff
8682
- import { createMuiTheme } from '@material-ui/core/styles';
9104
+ import { createMuiTheme } from '@material-ui/core/styles';
8683
9105
 
8684
- const theme = createMuiTheme({
9106
+ const theme = createMuiTheme({
8685
9107
  - props: {
8686
9108
  - MuiButton: {
8687
9109
  - disableRipple: true,
@@ -8694,15 +9116,15 @@ const theme = createMuiTheme({
8694
9116
  + },
8695
9117
  + },
8696
9118
  + },
8697
- });
9119
+ });
8698
9120
  ```
8699
9121
 
8700
9122
  2. `overrides`
8701
9123
 
8702
9124
  ```diff
8703
- import { createMuiTheme } from '@material-ui/core/styles';
9125
+ import { createMuiTheme } from '@material-ui/core/styles';
8704
9126
 
8705
- const theme = createMuiTheme({
9127
+ const theme = createMuiTheme({
8706
9128
  - overrides: {
8707
9129
  - MuiButton: {
8708
9130
  - root: { padding: 0 },
@@ -8715,7 +9137,7 @@ const theme = createMuiTheme({
8715
9137
  + },
8716
9138
  + },
8717
9139
  + },
8718
- });
9140
+ });
8719
9141
  ```
8720
9142
 
8721
9143
  Note that if you don't have the time to upgrade the structure of the theme, you
@@ -8826,7 +9248,7 @@ Here are some highlights โœจ:
8826
9248
  The onE\* transition props were removed. Use TransitionProps instead.
8827
9249
 
8828
9250
  ```diff
8829
- <Menu
9251
+ <Menu
8830
9252
  - onEnter={onEnter}
8831
9253
  - onEntered={onEntered},
8832
9254
  - onEntering={onEntered},
@@ -8841,14 +9263,14 @@ Here are some highlights โœจ:
8841
9263
  + onExited,
8842
9264
  + onExiting,
8843
9265
  + }}
8844
- >
9266
+ >
8845
9267
  ```
8846
9268
 
8847
9269
  - [Popover] Remove transition onX props (#22184) @mbrookes
8848
9270
  The onE\* transition props were removed. Use TransitionProps instead.
8849
9271
 
8850
9272
  ```diff
8851
- <Popover
9273
+ <Popover
8852
9274
  - onEnter={onEnter}
8853
9275
  - onEntered={onEntered},
8854
9276
  - onEntering={onEntered},
@@ -8863,7 +9285,7 @@ Here are some highlights โœจ:
8863
9285
  + onExited,
8864
9286
  + onExiting,
8865
9287
  + }}
8866
- />
9288
+ />
8867
9289
  ```
8868
9290
 
8869
9291
  - [TextField] Improve line-height reset (#22149) @imnasnainaec
@@ -9017,7 +9439,7 @@ Here are some highlights โœจ:
9017
9439
  The onE\* transition props were removed. Use TransitionProps instead.
9018
9440
 
9019
9441
  ```diff
9020
- <Dialog
9442
+ <Dialog
9021
9443
  - onEnter={onEnter}
9022
9444
  - onEntered={onEntered},
9023
9445
  - onEntering={onEntered},
@@ -9032,7 +9454,7 @@ Here are some highlights โœจ:
9032
9454
  + onExited,
9033
9455
  + onExiting,
9034
9456
  + }}
9035
- />
9457
+ />
9036
9458
  ```
9037
9459
 
9038
9460
  - [Fab] Rename round -> circular for consistency (#21903) @kodai3
@@ -9079,7 +9501,7 @@ Here are some highlights โœจ:
9079
9501
  The onE\* transition props were removed. Use TransitionProps instead.
9080
9502
 
9081
9503
  ```diff
9082
- <Snackbar
9504
+ <Snackbar
9083
9505
  - onEnter={onEnter}
9084
9506
  - onEntered={onEntered},
9085
9507
  - onEntering={onEntered},
@@ -9094,7 +9516,7 @@ Here are some highlights โœจ:
9094
9516
  + onExited,
9095
9517
  + onExiting,
9096
9518
  + }}
9097
- />
9519
+ />
9098
9520
  ```
9099
9521
 
9100
9522
  - [TextareaAutosize] Rename rowsMax->maxRows & rowsMin->minRows (#21873) @mhayk
@@ -9463,21 +9885,21 @@ A big thanks to the 33 contributors who made this release possible. Here are som
9463
9885
  It prevents inconsistent height on scaled screens. For people customizing the color of the border, the change requires changing the override CSS property:
9464
9886
 
9465
9887
  ```diff
9466
- .MuiDivider-root {
9467
- - background-color: #f00;
9468
- + border-color: #f00;
9469
- }
9888
+ .MuiDivider-root {
9889
+ - background-color: #f00;
9890
+ + border-color: #f00;
9891
+ }
9470
9892
  ```
9471
9893
 
9472
9894
  - [Rating] Rename `visuallyhidden` to `visuallyHidden` for consistency (#21413) @mnajdova.
9473
9895
 
9474
9896
  ```diff
9475
- <Rating
9476
- classes={{
9897
+ <Rating
9898
+ classes={{
9477
9899
  - visuallyhidden: 'custom-visually-hidden-classname',
9478
9900
  + visuallyHidden: 'custom-visually-hidden-classname',
9479
- }}
9480
- />
9901
+ }}
9902
+ />
9481
9903
  ```
9482
9904
 
9483
9905
  - [Typography] Replace the `srOnly` prop so as to not duplicate the capabilities of [System](https://mui.com/system/getting-started/overview/) (#21413) @mnajdova.
@@ -9497,10 +9919,10 @@ A big thanks to the 33 contributors who made this release possible. Here are som
9497
9919
  The customization of the table pagination's actions labels must be done with the `getItemAriaLabel` prop. This increases consistency with the `Pagination` component.
9498
9920
 
9499
9921
  ```diff
9500
- <TablePagination
9501
- - backIconButtonText="Avant"
9502
- - nextIconButtonText="Aprรจs
9503
- + getItemAriaLabel={โ€ฆ}
9922
+ <TablePagination
9923
+ - backIconButtonText="Avant"
9924
+ - nextIconButtonText="Aprรจs
9925
+ + getItemAriaLabel={โ€ฆ}
9504
9926
  ```
9505
9927
 
9506
9928
  - [ExpansionPanel] Rename to Accordion (#21494) @mnajdova.