# [Versions](https://mui.com/versions/) ## 5.11.13 _Mar 14, 2023_ A big thanks to the 13 contributors who made this release possible. Here are some highlights โœจ: - @michaldudak added an option for [disabling the generation](https://mui.com/base/getting-started/customization/#disabling-default-css-classes) of the default classes in MUI Base (#35963) - other ๐Ÿ› bug fixes and ๐Ÿ“š documentation improvements. ### `@mui/material@5.11.13` - ​[core] Bump MUI Base's version in Material UI (#36492) @hbjORbj - ​[material] Export `shouldSkipGeneratingVar` from Material UI (#36489) @siriwatknp - ​[Typography] Apply font properties to typography inherit variant (#33621) @oyar99 ### `@mui/base@5.0.0-alpha.121` - ​[base] Disable classes generation via a context (#35963) @michaldudak - ​[useMenu][base] Add return interface for useMenu hook (#36376) @HeVictor - ​[useBadge] Add interface for the return value (#36042) @skevprog - ​[useMenuItem] Add explicit return type (#36359) @rayrw - ​[useTabs] Add explicit return type (#36047) @sai6855 ### Docs - ​[blog] Update fields behavior on date pickers blog post (#36480) @joserodolfofreitas - ​[docs] Info markdown not rendering in Contributing Guide README (#36487) @hbjORbj - ​[docs] Remove 301 redirection to MUI X lab migration @oliviertassinari - ​[docs] Fix a grammar error (#36486) @hbjORbj - ​[docs] Add blog post notification for v6 release (#36446) @joserodolfofreitas - ​[docs] Update link to v5 docs (#36421) @m4theushw - ​[docs] Fix 404 in the API page links (#36419) @oliviertassinari - ​[docs][joy] Error in the exemplary Codesandbox of using Material UI and Joy UI together (#36462) @hbjORbj - ​[examples] Refactor to have better types in the Next.js + TypeScript examples (#36355) @erikian - ​[website] Fix layout shift when loading /blog/mui-x-v6/ @oliviertassinari - ​[website] Update stats (#36477) @hrutik7 All contributors of this release in alphabetical order: @erikian, @hbjORbj, @HeVictor, @hrutik7, @joserodolfofreitas, @m4theushw, @michaldudak, @oliviertassinari, @oyar99, @rayrw, @sai6855, @siriwatknp, @skevprog ## 5.11.12 _Mar 6, 2023_ A big thanks to the 17 contributors who made this release possible. Here are some highlights โœจ: - @michaldudak added the multiselect functionality to SelectUnstyled (#36274) - @mnajdova updated `extendTheme` so that it can generate CSS variables with default values. This means that the `CssVarsProvider` is no longer required for Joy UI when using the default theme (#35739) - other ๐Ÿ› bug fixes and ๐Ÿ“š documentation improvements. ### `@mui/material@5.11.12` - ​[Autocomplete] Fix list scrolls to the top when new data is added on touch devices (#36231) @SaidMarar - ​[Autocomplete] Add `Mui-expanded` class (#33312) @Osman-Sodefa - ​[Dialog] Use the `id` prop provided to the `DialogTitle` component (#36353) @Kundan28 - ​[Menu] Fix Menu Paper styles overriding in the theme (#36316) @Paatus ### `@mui/lab@5.0.0-alpha.122` - ​[TreeView] Fix Tree View inside shadow root crashes (#36225) @NoFr1ends ### `@mui/system@5.11.12` #### Breaking changes - ​[core] Generate vars in `extendTheme` (#35739) @mnajdova The `shouldSkipGeneratingVar` prop was moved from the `createCssVarsProvider`'s option to the `theme`. If the default theme does not use `extendTheme` from Material UI or Joy UI, it needs to be wrapped inside `unstable_createCssVarsTheme` - a util exported from the MUI System. Below is an example of how the migration should look like: ```diff import { unstable_createCssVarsProvider as createCssVarsProvider, + unstable_createCssVarsTheme as createCssVarsTheme, } from '@mui/system'; const { CssVarsProvider } = createCssVarsProvider({ - theme: { + theme: createCssVarsTheme({ colorSchemes: { light: { typography: { htmlFontSize: '16px', h1: { fontSize: '1rem', fontWeight: 500, }, }, }, }, + shouldSkipGeneratingVar: (keys) => keys[0] === 'typography' && keys[1] === 'h1', - }, + }), defaultColorScheme: 'light', - shouldSkipGeneratingVar: (keys) => keys[0] === 'typography' && keys[1] === 'h1', }); ``` Or you can define it directly in the theme prop: ```diff keys[0] === 'typography' && keys[1] === 'h1' + })} /> ``` This breaking change **only** affects experimental APIs ### `@mui/base@5.0.0-alpha.120` #### Breaking changes - ​[Select][base] Add the multiselect functionality to SelectUnstyled (#36274) @michaldudak The MultiSelectUnstyled was removed. The `SelectUnstyled` component with the `multiple` prop should be used instead. Additionally, the SelectUnstyledProps received a second generic parameter: `Multiple extends boolean`. If you deal with strictly single- or multi-select components, you can hard-code this parameter to `false` or `true`, respectively. Below is an example of how the migration should look like: ```diff -import MultiSelectUnstyled from '@mui/base/MultiSelectUnstyled'; +import SelectUnstyled from '@mui/base/SelectUnstyled'; export default App() { -return +return } ``` #### Changes - ​[useSnackBar] Add explicit return type (#36052) @sai6855 - ​[useMenu] Fix `import type` syntax (#36411) @ZeeshanTamboli - ​[useSwitch] Add explicit return type (#36050) @sai6855 ### `@mui/joy@5.0.0-alpha.70` #### Breaking changes - ​[Joy] Change CSS variables naming for components (#36282) @hbjORbj Joy UI has new naming standards of the CSS variables for its components. Below is an example of how the migration should look like: ```diff - + - + ``` #### Changes - ​[Autocomplete][joy] Add disabled class to the popup indicator (#36397) @hbjORbj - ​[Joy] Fix broken loading button in Safari (#36298) @Kuba429 ### Docs - ​[docs][joy] Clarify when `CssVarsProvider` is required (#36410) @mnajdova - ​MUI X v6 release announcement (#36398) @joserodolfofreitas - ​[docs] Add instructions for deploying docs without a release (#36301) @cherniavskii - ​[docs] Fix 301 redirections on the docs @oliviertassinari - ​[docs] Update MUI X banner to reflect stable release (#36354) @MBilalShafi - ​[docs] Clarify the future plan for integrating MUI Base in Material UI (#36365) @mnajdova - ​[docs] Improve visual look of loose lists (#36190) @oliviertassinari - ​[docs] Fix @mui/styles example links (#36331) @oliviertassinari - ​[docs][joy] Build TS versions for List component demos (#36382) @sai6855 - ​[docs][joy] Build TS versions for Radio component demos (#36406) @sai6855 - ​[docs][joy] Build TS versions for Checkbox component demos (#36381) @sai6855 - ​[docs][joy] Build TS versions for Select component demos (#36380) @sai6855 - ​[docs][joy] Build TS versions for Typography component demos (#36378) @varunmulay22 - ​[docs][joy] Add typescript demos for `Divider` (#36374) @sai6855 - ​[docs][joy] Build TS versions for Textarea component demos (#36371) @varunmulay22 - ​[docs][joy] Build TS versions for Link component demos (#36366) @hbjORbj ### Core - ​Revert "Bump rimraf to ^4.1.3" (#36420) @mnajdova - ​[core] Fix test utils types and external `buildApiUtils` usage issues (#36310) @LukasTy - ​[test] Remove duplicate `combobox` role queries in Autocomplete tests (#36394) @ZeeshanTamboli - ​[website] Clarify redistribution @oliviertassinari - ​[website] Sync /about page (#36334) @oliviertassinari All contributors of this release in alphabetical order: @cherniavskii, @hbjORbj, @joserodolfofreitas, @Kuba429, @Kundan28, @LukasTy, @MBilalShafi, @michaldudak, @mnajdova, @NoFr1ends, @oliviertassinari, @Osman-Sodefa, @Paatus, @sai6855, @SaidMarar, @varunmulay22, @ZeeshanTamboli ## 5.11.11 _Feb 27, 2023_ A big thanks to the 15 contributors who made this release possible. Here are some highlights โœจ: - ๐Ÿ“š added API documentation for the slots in MUI Base and Joy UI by @hbjORbj, for e.g. [SliderUnstyled API](https://mui.com/base/api/slider-unstyled/#slots) - other ๐Ÿ› bug fixes and ๐Ÿ“š documentation improvements. ### `@mui/material@5.11.11` - ​[Autocomplete] Adds `sx` prop to `ListboxProps` type (#36243) @sai6855 - ​[material] Add global CSS class for `readOnly` prop (#32822) @jrparish - ​[Stack][material] Use createStack from the system (#33795) @mnajdova - ​[Select] Fix incorrect selecting of first element (#36024) @michaldudak - ​[Slider] Miscellaneous improvements (#35941) @ZeeshanTamboli - ​[Slider] Remove unnecessary `data-focusvisible` attribute (#36091) @ZeeshanTamboli - ​[Snackbar] Replace component logic with `useSnackbar` hook (#36272) @ZeeshanTamboli - ​[TextField] Fix floating label position (#36246) @oliviertassinari - ​[TextField] Fix floating label position (#36288) @oliviertassinari ### `@mui/base@5.0.0-alpha.119` #### Breaking changes - ​[base] Remove `classes` prop from the Base components that have it (#36157) @hbjORbj These are the components affected by this change: ModalUnstyled, SliderUnstyled, TablePaginationUnstyled and TablePaginationActionsUnstyled. You can replace the `classes` prop by providing the class name prop directly to the prop via `slotProps`. Below is an example of how the migration should look like: ```diff ``` - ​[base] Move hooks to their own directories (#36235) @hbjORbj Base hooks (e.g., `useSelect`) are no longer exported from `{Component}Unstyled` directories and instead they have their own directories. Below is an example of how the migration should look like: ```diff -import { useBadge } from '@mui/base/BadgeUnstyled'; +import useBadge from '@mui/base/useBadge'; ``` You can use this [codemod](https://github.com/mui/material-ui/blob/master/packages/mui-codemod/README.md#base-hook-imports) to help with the migration. #### Changes - ​[Autocomplete] Add docs interface for the hook (#36242) @HeVictor - ​[MenuUnstyled] Remove extra useMemo (#36265) @ivp-dev - ​[base] Export all slot prop overrides interfaces (#36323) @michaldudak ### `@mui/codemod@5.11.11` - ​[base] Codemod for hook directory migration (#36295) @hbjORbj ### `@mui/joy@5.0.0-alpha.69` - ​[Joy] Able to remove default tokens from theme types (#36006) @siriwatknp - ​[Joy] Fix modal dialog overflow viewport (#36103) @siriwatknp - ​[Joy] Select popup should have max-height (#36156) @Vivek-Prajapatii - ​[Joy] Fix `ListDivider` to change semantic based on `List` (#36266) @siriwatknp ### Docs - ​[docs][base] List slots in API documentation (#36104) @hbjORbj - ​[docs] Add missing sandbox adapter deps resolving (#36291) @LukasTy - ​[docs] Allow to pass navigation bar banner from outside (#36299) @MBilalShafi - ​[docs] Fix code on the Working with Tailwind CSS guide (#36090) @mnajdova - ​[docs] Remove See Slots Section text from Material UI slots description (#36284) @hbjORbj - ​[docs] Fix emotion warning `:first-child` (#36263) @siriwatknp - ​[docs][joy] Improve the descriptions of props in API docs (#36307) @hbjORbj - ​[docs][joy] List slots in API documentation (#36271) @hbjORbj - ​[docs][joy] Build API documentations (#36008) @hbjORbj - ​[examples] Update Next.js examples to use built-in font (#36315) @Juneezee - ​[examples] Update curl link in `material-next-ts-v4-v5-migration` example README (#36321) @ZeeshanTamboli - ​[examples] Convert Next.js \_document class components to function components (#36109) @ossan-engineer ### Core - ​[Rating] Add a comment in Rating component to use `readOnly` state class (#36357) @ZeeshanTamboli - ​[website] Fix broken links to role levels (#36333) @oliviertassinari - ​[website] Sync gold sponsors (#36312) @oliviertassinari All contributors of this release in alphabetical order: @hbjORbj, @HeVictor, @ivp-dev, @jrparish, @Juneezee, @LukasTy, @MBilalShafi, @michaldudak, @mnajdova, @oliviertassinari, @ossan-engineer, @sai6855, @siriwatknp, @Vivek-Prajapatii, @ZeeshanTamboli ## 5.11.10 _Feb 20, 2023_ A big thanks to the 11 contributors who made this release possible. This release was mostly about ๐Ÿ› bug fixes and ๐Ÿ“š documentation improvements. ### `@mui/material@5.11.10` - ​[Avatar] Fix ownerState usage with styleOverrides when fallback is used (#36228) @sai6855 - ​[Badge][material] Replace `BadgeUnstyled` with `useBadge` hook (#36158) @hbjORbj - ​[Switch] Fix DOM warning when `type` isn't `checkbox` or `radio` (#36170) @dani-mp - ​[TextareaAutosize] Convert code to TypeScript (#35862) @sai6855 - ​[useMediaQuery] Fix behavior of noSsr with React 18 (#36056) @oliviertassinari ### `@mui/joy@5.0.0-alpha.68` - ​[Joy] Add `zIndex` to theme (#36236) @siriwatknp - ​[Joy] Remove transition from all components (#35952) @hbjORbj ### Docs - ​[docs][base] Fix base Input demos for Safari (#36213) @mj12albert - ​[docs] Fix 301 links @oliviertassinari - ​[docs] Fix modal transition demos (#36137) @oliviertassinari - ​[docs] Update links to pt examples (#36237) @Aleff13 - ​[docs] Update custom Typography variants example (#36185) @mj12albert - ​[docs] Change markdown numbering syntax (#36187) @mj12albert - ​[docs] Fix switch alignment in `Disabled tree items` section in Tree View docs (#36217) @PunitSoniME - ​[docs] Standardize example names (#36112) @samuelsycamore - ​[docs] Fix typo @oliviertassinari - ​[docs] Fix markdown table alignments (#36136) @oliviertassinari - ​[docs] Small color tweaks to the docs search bar (#36160) @danilo-leal - ​[docs][joy] Update class name prefixes in the `Anatomy` section (#36210) @ZeeshanTamboli ### Core - ​[core] Migrate nprogress to emotion (#36181) @siriwatknp - ​[core] Enforce namespace import for ReactDOM (#36208) @mj12albert - ​[core] Fix deploy preview links (#36203) @siriwatknp All contributors of this release in alphabetical order: @Aleff13, @dani-mp, @danilo-leal, @hbjORbj, @mj12albert, @oliviertassinari, @PunitSoniME, @sai6855, @samuelsycamore, @siriwatknp, @ZeeshanTamboli ## 5.11.9 _Feb 14, 2023_ A big thanks to the 17 contributors who made this release possible. Here are some highlights โœจ: - ๐Ÿ› @rangoo94, @sai6855, and @michaldudak fixed a couple of bugs in the Autocomplete component (#36116, #35640, #36076, #36088) - many other ๐Ÿ› bug fixes and ๐Ÿ“š documentation improvements ### `@mui/material@5.11.9` - [AppBar] Fix joinVars() not handling undefined (#36128) @donaldnevermore - [Autocomplete] Fix tag removal regression (#36116) @michaldudak - [Autocomplete] Correct padding of filled Autocomplete (#35640) @michaldudak - [Grid][Stack] classNames prefixed with Mui (#36167) @sai6855 ### `@mui/styled-engine@5.11.9` - [StyledEngineProvider] Fix issue with cache not being defined (#36162) @mnajdova ### `@mui/joy@5.0.0-alpha.67` - [Joy] Add order dashboard template (#36081) @siriwatknp - [Joy] Remove classes prop from the components that have it (#36159) @hbjORbj - [Joy] Miscellaneous fixes (#36163) @siriwatknp ### `@mui/base@5.0.0-alpha.118` - [base] Override the types of `slotProps` per slot (#35964) @hbjORbj - [Select][base] Prevent unnecessary rerendering of Select options (#35946) @michaldudak - [Select][base] Update the generated docs (#36183) @michaldudak - [useAutocomplete] Pass only valid values for the getOptionLabel prop (#36088) @rangoo94 - [useAutocomplete] Fix `useAutocomplete` disabled prop not disabling the input (#36076) @sai6855 - [useInput] Add return value interface (#36036) @Shorifpatwary - [UseTabPanel] Add explicit return type (#36053) @Shorifpatwary - [useTabsList] Add explicit return type (#36048) @sai6855 - [Tab] Add explicit return type to useTab (#36046) @sai6855 ### `@mui/material-next@6.0.0-alpha.75` - [Material You] Use `md` as a CSS var prefix (#36177) @siriwatknp ### Docs - [docs] Fix the prop type regression on the API pages (#36168) @mnajdova - [docs] Fix virtualized table column resizing (#36066) @petyosi - [docs] Fix react-spring demos (#36023) @oliviertassinari - [docs] Fix classname mismatch on Joy docs (#36127) @siriwatknp - [docs] Fix typo in the released version of @mui/styled-engine (#36121) @m4theushw - [docs] Fix demos showing TypeScript instead of JavaScript (#35850) @mj12albert - [docs] Update release instructions (#36113) @mj12albert - [docs] Rename `v6-alpha` to `v6-next` in navigation (#36102) @LukasTy - [docs] Revise Joy UI "Input" page (#35970) @LadyBluenotes - [docs] Revise Joy UI "Typography" page (#35868) @LadyBluenotes ### Examples - [examples][vitejs] Load Roboto font (#35678) @oliv37 ### Core - [blog] Fix the look and feel of the media description (#36069) @oliviertassinari - [core] Add default preview url (#36118) @siriwatknp - [core] Migrate all the internals exported by `tests/utils/index.js` to TypeScript (#35382) @flaviendelangle - [core] Convert the waterfall module to an internal package (#35323) @michaldudak - [website] Fix homepage MD theme demo (#36027) @oliviertassinari - [website] Revise the Lead Designer role job ad (#35912) @danilo-leal - [POC] Add deploy preview to PR body (#35995) @siriwatknp All contributors of this release in alphabetical order: @danilo-leal, @donaldnevermore, @flaviendelangle, @hbjORbj, @LadyBluenotes, @LukasTy, @m4theushw, @michaldudak, @mj12albert, @mnajdova, @oliv37, @oliviertassinari, @petyosi, @rangoo94, @sai6855, @Shorifpatwary, @siriwatknp ## 5.11.8 _Feb 7, 2023_ A big thanks to the 14 contributors who made this release possible. Here are some highlights โœจ: - @siriwatknp added a new [`Sign In` template](https://mui.com/joy-ui/getting-started/templates/sign-in-side/) to Joy UI (#36019) - ๐Ÿ“š Documentation improvements and ๐Ÿ› bug fixes as usual ### `@mui/material@5.11.8` - ​[FormLabel] Export `FormLabelOwnProps` from `FormLabel` to fix type error (#36057) @yoskeoka ### `@mui/joy@5.0.0-alpha.66` - ​[Joy] Miscellaneous fixes (#36073) @siriwatknp - ​[Joy] Add sign-in side template (#36019) @siriwatknp - ​[Joy] Add missing `Table` export from root (#36010) @sai6855 ### `@mui/system@5.11.8` - ​[System] Fix nested grid v2 (#35994) @siriwatknp ### `@mui/styled-engine@5.11.8` - ​[styled-engine] Create cache only if `document` is available (#36001) @m4theushw ### Docs - ​[blog] Fix dark mode support (#35969) @oliviertassinari - ​[docs] Add banner pointing to "Whats new" in MUI X page (#36074) @joserodolfofreitas - ​[docs] Revert unintended change @oliviertassinari - ​[docs] [Joy] Fixed a typo in `customizing theme tokens` (#36067) @badalsaibo - ​[docs] Improve inline preview's information (#35974) @oliviertassinari - ​[docs] Fix wrong v5 migration instructions (#36022) @oliviertassinari - ​[docs] Fix autocomplete render group key warning in the demo (#36025) @chuanyu0201 - ​[docs] Add hooks API pages for MUI Base (#35828) @mnajdova - ​[docs] Fix grammar typo (#36016) @alexownejazayeri - ​[docs][joy] Add JSDoc for the `AutocompleteProps` type (#36039) @ArthurPedroti ### Core - ​[core] Make it easier to find who is importing specific files (#35896) @oliviertassinari - ​[core] Fix SEO redirections issues (#36041) @oliviertassinari - ​[core] Fix a typo in the comment in setup test files (#36014) @ZeeshanTamboli - ​[typescript] Explicitly define the component return types (#36013) @michaldudak - ​[website] Fix layout shift (#36070) @oliviertassinari - ​[website] Revise the Lead Designer role job ad (v1) (#36068) @oliviertassinari - ​[website] Add Albert to the about page (#35954) @mj12albert All contributors of this release in alphabetical order: @alexownejazayeri, @ArthurPedroti, @badalsaibo, @chuanyu0201, @joserodolfofreitas, @m4theushw, @michaldudak, @mj12albert, @mnajdova, @oliviertassinari, @sai6855, @siriwatknp, @yoskeoka, @ZeeshanTamboli ## 5.11.7 _Jan 31, 2023_ A big thanks to the 15 contributors who made this release possible. Here are some highlights โœจ: - @siriwatknp added `Table` component to Joy UI (#35872) - many other ๐Ÿ› bug fixes and ๐Ÿ“š documentation improvements ### `@mui/material@5.11.7` - ​[Autocomplete] Prevent reset scroll position when new options are added (#35735) @sai6855 - ​[CssVarsProvider] Skip `unstable_sxConfig` variables (#35932) @siriwatknp - ​[InputLabel] Add missing `component` type (#35852) @sai6855 - ​[Tooltip] Fix tooltip position (#35909) @marktoman ### `@mui/base@5.0.0-alpha.116` - ​[ListboxUnstyled] Fix option state highlighted to prevent unnecessary focus (#35838) @SaidMarar ### `@mui/joy@5.0.0-alpha.65` #### Breaking changes - ​[Joy] Replace `Joy[Component]` classname with `Mui[Component]` classname for all slots of components (#35718) @hbjORbj - Renames the classname prefix of all Joy UI components from `'Joy'` to `'Mui'`. ```diff ``` - [BottomNavigation] Remove wrapper from BottomNavigationAction (#26923) @siriwatknp `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). ```diff ``` #### Changes - ​[Box] Fix TypeScript error on maxWidth prop (#26859) @ansh-saini - ​[Dialog] Automatically label by its DialogTitle (#26814) @eps1lon - ​[Hidden] Bring back and mark as deprecated (#26908) @siriwatknp - ​[List] Add button runtime deprecation warning (#26743) @siriwatknp - ​[Modal] Type BackdropProps according to styled version (#26836) @eps1lon - ​[Radio] Fix `defaultValue` to match the other value types (#26945) @oliviertassinari - ​[Stepper] Add completed to global pseudo-classes (#26953) @michal-perlakowski - ​[Stepper] Fix support for no connectors (#26874) @varandasi - ​[TextField] Prevent `hiddenLabel` from spreading to DOM (#26864) @siriwatknp - ​[TextField] Fix label disappearing when focusing a button (#26933) @michal-perlakowski ### `@material-ui/codemod@5.0.0-beta.0` - ​[codemod] Add CLI (#26941) @eps1lon ### @material-ui/icons@5.0.0-beta.0 - ​[icons] Regenerate transpiled files (#26985) @eps1lon ### @material-ui/lab@5.0.0-alpha.39 #### Breaking changes - [DatePicker] Remove helper text default value (#26866) @DouglasPds Make the default rendered text field closer to the most common use cases (denser). ```diff ( - + )} > ``` #### Changes - ​[lab] Fix missing dependency on unstyled (#26937) @fishyFrogFace - ​[pickers] Consider TDate in ToolbarComponent types (#27035) @michal-perlakowski ### `@material-ui/system@5.0.0-beta.0` - ​[system] Support array overridesResolver (#26824) @siriwatknp ### Docs - ​[docs] Add notes to Table demo about stableSort (#27025) @CarlosGomez-dev - ​[docs] Add gold sponsor (#26968) @oliviertassinari - ​[docs] Update unstyled demos to not depend on `@material-ui/core` (#26869) @mnajdova - ​[docs] Fix demo paths in windows (#27004) @eps1lon - ​[docs] Export all locales (#27002) @eps1lon - ​[docs] Misc CONTRIBUTING.md changes (#26925) @eps1lon - ​[docs] Fix /components/hidden merge conflict (#26997) @eps1lon - ​[docs] Fix 404 links (#26963) @oliviertassinari - ​[docs] Remove link that points to v4 blog post (#26960) @steveafrost - ​[docs] Use custom webpack loader for markdown (#26774) @eps1lon - ​[docs] Fix 301 links (#26942) @oliviertassinari - ​[docs] Add page for the `sx` prop (#26769) @mnajdova - ​[docs] pre-fill issue when a demo crashes (#27034) @eps1lon - ​[docs] Move styled page under system (#26818) ### Core - ​[core] Inline rollup-plugin-size-snapshot (#26986) @eps1lon - ​[core] Remove unused props clone (#26992) @oliviertassinari - ​[core] Fix tests on Windows (#26931) @michaldudak - ​[core] Fix merge conflict between #26954 and #26874 @oliviertassinari - ​[core] Upgrade issues-helper to v2 (#26955) @michal-perlakowski - ​[core] Fix merge conflict (#26928) @eps1lon - ​[test] Convert HiddenCSS tests to testing-library (#27019) @eps1lon - ​[test] Convert NativeSelectInput tests to testing-library (#26952) @eps1lon - ​[test] Add a default mount implementation to conformance tests (#26949) @eps1lon - ​[test] Update tests to pass react@next (#26967) @eps1lon - ​[test] Add types to describeConformanceV5 (#26954) @eps1lon - ​[test] Use createPickerMount where appropriate (#26951) @eps1lon - ​[test] Convert SwipeableDrawer tests to testing-library (#26916) @eps1lon - ​[test] Convert Menu tests to testing-library (#26915) @eps1lon - ​[test] Convert Popover tests to testing-library (#26913) @eps1lon - ​[test] Convert Modal tests to testing-library (#26912) @eps1lon - ​[test] Make remaining testing-library tests StrictMode compatible (#26924) @eps1lon - ​[test] Only allow wrapping enzyme mount not creating (#27018) @eps1lon - ​[typescript] Disallow spreading TransitionHandlerProps (#26927) @eps1lon All contributors of this release in alphabetical order: @ansh-saini, @BC-M, @CarlosGomez-dev, @DouglasPds, @eps1lon, @fishyFrogFace, @michal-perlakowski, @michaldudak, @mnajdova, @oliviertassinari, @siriwatknp, @steveafrost, @varandasi ## 5.0.0-alpha.38 _Jun 23, 2021_ A big thanks to the 18 contributors who made this release possible. Here are some highlights โœจ: - ๐Ÿš€ 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. - ๐ŸŽจ We have updated `Slider` to match current [Material Design guidelines](https://m2.material.io/components/sliders). - ๐Ÿ’ก `IconButton` now supports 3 sizes (`small, medium, large`). [See demo](https://mui.com/components/buttons/#sizes-2). - โ™ฟ๏ธ We have improved the default style of the `Link` to be more accessible (#26145) @ahmed-28 ### `@material-ui/core@5.0.0-alpha.38` #### Breaking changes - ​[Menu] Use ButtonBase in MenuItem (#26591) @siriwatknp - Change the default value of `anchorOrigin.vertical` to follow the Material Design guidelines. The menu now displays below the anchor instead of on top of it. You can restore the previous behavior with: ```diff +
  • ``` - The prop `listItemClasses` was removed, you can use `classes` instead. ```diff - + ``` - ​[theme] Improve default breakpoints (#26746) @siriwatknp 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). ```diff { xs: 0, sm: 600, - md: 960, + md: 900, - lg: 1280, + lg: 1200, - xl: 1920, + xl: 1536, } ``` If you prefer the old breakpoint values, use the snippet below. ```js import { createTheme } from '@material-ui/core/styles'; const theme = createTheme({ breakpoints: { values: { xs: 0, sm: 600, md: 960, lg: 1280, xl: 1920, }, }, }); ``` - ​[IconButton] Add size `large` and update styles (#26748) @siriwatknp The default size's padding is reduced to `8px` which makes the default IconButton size of `40px`. To get the old default size (`48px`), use `size="large"`. The change was done to better match Google's products when Material Design stopped documenting the icon button pattern. ```diff - + ``` - ​[Slider] Adjust css to match the specification (#26632) @siriwatknp 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/). You can reduce the density of the slider, closer to v4 with the [`size="small"` prop](https://mui.com/components/slider/#sizes). - ​[IconButton] Remove label span (#26801) @siriwatknp `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). ```diff ``` - ​[core] Remove `unstable_` prefix on the `useThemeProps` hook (#26777) @mnajdova The following utilities were renamed to not contain the `unstable_` prefix: - `@material-ui/sytstem` ```diff import { - unstable_useThemeProps, + useThemeProps, } from '@material-ui/system'; ``` - `@material-ui/core` ```diff import { - unstable_useThemeProps, + useThemeProps, } from '@material-ui/core/styles'; ``` #### Changes - ​[Alert] Add support for custom colors (#26831) @varandasi - ​[Button] Fix loading text invisible when disabled (#26857) @DanielBretzigheimer - ​[ButtonBase] Consider as a link with a custom component and `to` prop (#26576) @shadab14meb346 - ​[ButtonBase] Derive state on render instead of in layout effects (#26762) @eps1lon - ​ [Drawer] Fix incorrect z-index (#26791) @michal-perlakowski - ​[Drawer] Remove incorrect transition handler props (#26835) @eps1lon - ​[Link] Improve accessibility support (#26145) @ahmed-28 - ​[Modal] Fix calculating scrollbar size when using custom scrollbar (#26816) @michal-perlakowski - ​[Rating] Make input ids less predictable (#26493) @eps1lon - ​[Stepper] Add componentsProps.label to StepLabel (#26807) @michal-perlakowski - ​[Tabs] Show error when Tab has display: none (#26783) @michal-perlakowski - ​[theme] Add base color palette type to components (#26697) @siriwatknp ### `@material-ui/system@5.0.0-alpha.38` #### Breaking Changes - ​[system] Normalize api for `createBox` (#26820) @mnajdova ```diff import { createBox } from '@material-ui/system'; -const styled = createBox(defaultTheme); +const styled = createBox({ defaultTheme }); ``` #### Changes - ​[system] Add ThemeProvider component (#26787) @mnajdova ### Docs - ​[docs] Fix misspelling of the word Typography (#26898) @dmrqx - ​[docs] Instruct users to install @material-ui/icons with the next tag (#26873) @michal-perlakowski - ​[docs] Sync translations (#26828) @l10nbot - ​[docs] Improve grammar of autocomplete/autofill section (#26798) @dijonkitchen - ​[docs] Explain "inherited props" better in the props table (#26778) @eps1lon - ​[docs] Fix documentation for upgrading to v5 (#26812) @tungdt-90 - ​[docs] Improve notification color (#26796) @mnajdova - ​[docs] Fix various a11y issues with /customization/color (#26757) @eps1lon - ​[docs] Move custom theme to frame (#26744) @siriwatknp - ​[docs] Fix small PT typo fix: inciar -> iniciar (#26775) @brunocavalcante - ​[I10n] Add Chinese (Hong Kong) (zh-HK) locale (#26637) @kshuiroy - ​[l10n] Add sinhalese (siLK) locale (#26875) @pavinduLakshan - ​[examples] Rename nextjs typescript theme from tsx to ts (#26862) @Izhaki ### Core - ​[test] Fix Drawer test API @oliviertassinari - ​[test] Adjust expected useAutocomplete error messages for React 18 (#26858) @eps1lon - ​[test] Convert Drawer tests to testing-library (#26837) @eps1lon - ​[test] Convert remaining enzyme tests to testing-library (#26832) @eps1lon - ​[test] Ignore ReactDOM.hydrate deprecation warnings (#26815) @eps1lon - ​[test] Reduce flakiness (#26761) @eps1lon - ​[useId] Reduce likelyhood of collisions (#26758) @eps1lon - ​yarn deduplicate @oliviertassinari - ​Fix running framer's prettier under pwsh (#26819) @michaldudak - ​[core] Update babel-plugin-optimize-clsx (#26861) @oliviertassinari - ​[core] Assume no document.all at runtime (#26821) @eps1lon - ​[core] Remove dependency on `@material-ui/private-theming` (#26793) @mnajdova - ​[core] Remove dependency on `@material-ui/styled-engine` (#26792) @mnajdova All contributors of this release in alphabetical order: @ahmed-28, @brunocavalcante, @DanielBretzigheimer, @dijonkitchen, @dmrqx, @eps1lon, @Izhaki, @kshuiroy, @l10nbot, @michal-perlakowski, @michaldudak, @mnajdova, @oliviertassinari, @pavinduLakshan, @shadab14meb346, @siriwatknp, @tungdt-90, @varandasi ## 5.0.0-alpha.37 _Jun 15, 2021_ A big thanks to the 11 contributors who made this release possible. Here are some highlights โœจ: - ๐Ÿ’„ Add support for responsive props on the Grid component (#26590) @likitarai1. This fixes a longstanding issue. You can now specify different values for each breakpoint. ```jsx ``` Head to the [documentation](https://mui.com/components/grid/#responsive-values) for more details. - โš’๏ธ We've introduced a new `useTheme` and `useThemeProps` hooks in the `@material-ui/system` package. We believe that this package can be used as a standalone styling solution for building custom design systems (#26649) @mnajdova. - ๐Ÿ’ฅ Made progress with the breaking changes. We have done 105 of the 109 changes [planned](https://github.com/mui/material-ui/issues/20012). We are getting closer to our goal of releasing 5.0.0-beta.0 on July 1st and start to promote its usage over v4. You can also follow [our milestone](https://github.com/mui/material-ui/milestone/35) for more details. - And many more ๐Ÿ› bug fixes and ๐Ÿ“š improvements. ### `@material-ui/core@5.0.0-alpha.37` #### Breaking changes - ​[Button] Remove label span (#26666) @siriwatknp 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. ```diff ``` #### Changes - ​[Button] Add missing color type (#26593) @sakura90 - ​[Grid] Add responsive direction and spacing props (#26590) @likitarai1 - ​[List] Add ListItemButton export to index (#26667) @chadmuro - ​[theme] Fix missing exported Breakpoints types (#26684) @robphoenix ### `@material-ui/system@5.0.0-alpha.37` #### Breaking changes - ​[system] Remove `theme` & `isRtl` from `useThemeProps` (#26701) @mnajdova The `isRtl` and `theme` props are no longer added by the `useThemeProps` hook. You can use the `useTheme` hook for this. ```diff -import { unstable_useThemeProps as useThemeProps } from '@material-ui/core/styles'; +import { unstable_useThemeProps as useThemeProps, useTheme } from '@material-ui/core/styles'; const Component = (inProps) => { - const { isRtl, theme, ...props } = useThemeProps({ props: inProps, name: 'MuiComponent' }); + const props = useThemeProps({ props: inProps, name: 'MuiComponent' }); + const theme = useTheme(); + const isRtl = theme.direction === 'rtl'; //.. rest of the code } ``` #### Changes - ​[system] Add useThemeProps & useTheme hooks (#26649) @mnajdova - ​[system] Add color manipulators (#26668) @mnajdova - ​[system] Fix support of custom shape in createTheme (#26673) @varandasi ### `@material-ui/unstyled@5.0.0-alpha.37` - ​[Slider] Improve TS definition (#26642) @mnajdova - ​[TrapFocus] Capture nodeToRestore via relatedTarget (#26696) @eps1lon ### `@material-ui/icons@5.0.0-alpha.37` - ​Revert "[icons] Only ship ES modules (#26310)" (#26656) @eps1lon The changes that we have tried in #26310 were breaking the integration with Next.js. ### `@material-ui/lab@5.0.0-alpha.37` - ​[core] Remove unused useKeyDown (#26765) @eps1lon - ​[DateTimePicker] Fix not visible selected tab icon (#26624) @nikitabobers ### Docs - ​[blog] Michaล‚ Dudak joins Material UI (#26700) @oliviertassinari - ​[docs] Migrate onepirate premium template to emotion part2 (#26707) @vicasas - ​[docs] Fix TextField demo layout (#26710) @vicasas - ​[docs] Improve Paperbase demo (#26711) @oliviertassinari - ​[docs] Migrate onepirate premium template to emotion part1 (#26671) @vicasas - ​[docs] Migrate paperbase premium template to emotion (#26658) @vicasas - ​[List] Fix demo to have correct semantic (#26742) @siriwatknp ### Core - ​[core] Monitore size of key system modules (#26712) @oliviertassinari - ​[core] Batch small changes (#26738) @oliviertassinari - ​[core] Batch small changes (#26628) @oliviertassinari - ​[test] Ignore ReactDOM.render deprecation warning (#26683) @eps1lon - ​[test] Run e2e test with React 18 on a schedule (#26690) @eps1lon - ​[test] Count profiler renders not passive effects (#26678) @eps1lon - ​[test] Bundling fixtures should not override source build with published build (#26657) @eps1lon - ​[test] Make tests oblivious to StrictMode (#26654) @eps1lon All contributors of this release in alphabetical order: @chadmuro, @eps1lon, @likitarai1, @mnajdova, @nikitabobers, @oliviertassinari, @robphoenix, @sakura90, @siriwatknp, @varandasi, @vicasas ## 5.0.0-alpha.36 _Jun 8, 2021_ A big thanks to the 14 contributors who made this release possible. Here are some highlights โœจ: - โš’๏ธ We've introduced a new `ListItemButton` component that should prevent common mistakes when using `` and help with customization and TypeScript support (#26446) @siriwatknp. - ๐Ÿ‘ฉโ€๐ŸŽค `experimentalStyled` is now available without the `experimental` prefix. We're confident that its API shouldn't receive any major changes until the stable release of v5 (#26558) @mnajdova. - ๐Ÿ“ฆ `@material-ui/icons` only ships ES modules and no longer CommonJS modules. This reduces the download size of the package from 1.7 MB to 1.2 MB and install size from 15.6 MB to 6.7 MB (#26310) @eps1lon. - ๐Ÿ’„ Add support for [row and column spacing](https://mui.com/components/grid/#row-amp-column-spacing) in the Grid component (#26559) @likitarai1. grid spacing demo Note that this feature was already available for [CSS grid users](https://mui.com/components/grid/#css-grid-layout) with the `rowGap` and `columnGap` props. ### `@material-ui/core@5.0.0-alpha.36` #### Breaking changes - ​[AppBar] Fix background color on dark mode (#26545) @siriwatknp 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. ```jsx ``` - ​[core] Rename `experimentalStyled` to `styled` (#26558) @mnajdova Remove the experimental prefix, this module is going stable: ```diff -import { experimentalStyled as styled } from '@material-ui/core/styles'; +import { styled } from '@material-ui/core/styles'; ``` - ​[SwitchBase] Replace IconButton with ButtonBase (#26460) @siriwatknp - ​[theme] Improve default `primary`, `secondary` and `error` theme palette (#26555) @siriwatknp #### Changes - ​[Box] Fix module 'clsx' not found in system (#26553) @coder-freestyle - ​[Box] Fix runtime error when using styled-components without ThemeProvider (#26548) @mnajdova - ​[Radio][checkbox] Don't forward `color` to DOM elements (#26625) @siriwatknp - ​[Dialog] Flatten DialogTitle DOM structure, remove `disableTypography` (#26323) @eps1lon - ​[Grid] Add rowSpacing and columnSpacing props (#26559) @likitarai1 - ​[List] extract button from ListItem to ListItemButton (#26446) @siriwatknp - ​[Popover] Fix PaperProps.ref breaking positioning (#26560) @vedadeepta - ​[Rating] onChangeActive shouldn't be fired on blur/focus (#26584) @coder-freestyle - ​[Select] Fix custom font size centering arrow (#26570) @sarahannnicholson - ​[styled] Convert implicit styleProps to explicit (#26461) @mnajdova@siriwatknp - ​[Tabs] Fix RTL indicator (#26470) @siriwatknp - ​[Tabs] Fix arrow rotation in vertical & RTL (#26527) @siriwatknp - ​[TextField] Fix support for custom `size` prop value (#26585) @coder-freestyle - ​[Tooltip] Finish exiting once started (#26535) @eps1lon ### `@material-ui/icons@5.0.0-alpha.36` #### Breaking changes - ​[icons] Only ship ES modules (#26310) @eps1lon The `require()` of `@material-ui/icons` is no longer supported. This should not affect you if you're using a bundler like `webpack` or `snowpack` or meta frameworks like `next` or `gatsby`. ### `@material-ui/lab@5.0.0-alpha.36` #### Breaking changes - ​[pickers] Remove `openPickerIcon` prop in favor of `components.OpenPickerIcon` (#26223) @vedadeepta ```diff } > ``` ### `@material-ui/system@5.0.0-alpha.36` - ​[system] Add createTheme util (#26490) @mnajdova ### Docs - ​[docs] Migrate templates to emotion (#26604) @vicasas - ​[docs] Remove custom primary & secondary color (#26541) @siriwatknp - ​[docs] Don't escape prop descriptions for markdown table context (#26579) @eps1lon - ​[docs] Prepare for data grid auto-generated docs (#26477) @m4theushw - ​[docs] Fix typo sx !== xs (#26596) @onpaws - ​[docs] Multiple select demos moving when selecting values (#26539) @itsnorbertkalacska - ​[docs] Improve migration guide for `@material-ui/styles` (#26552) @mnajdova - ​[docs] `Rating` `value` is nullable in `onChange` (#26542) @sakura90 - ​[example] Remove the dependency on @material-ui/styles (#26567) @garfunkelvila ### Core - ​[core] Ignore latest prettier run in git-blame @eps1lon - ​[core] Format @eps1lon - ​[test] Add bundle fixtures (#23166) @eps1lon - ​[website] Add Michaล‚ to the About Us page (#26557) @michaldudak All contributors of this release in alphabetical order: @coder-freestyle, @eps1lon, @garfunkelvila, @itsnorbertkalacska, @likitarai1, @m4theushw, @michaldudak, @mnajdova, @onpaws, @sakura90, @sarahannnicholson, @siriwatknp, @vedadeepta, @vicasas ## 5.0.0-alpha.35 _May 31, 2021_ A big thanks to the 14 contributors who made this release possible. Here are some highlights โœจ: - ๐Ÿ‘ฉโ€๐ŸŽค We have completed the migration to emotion of all the components (`@material-ui/core` and `@material-ui/lab`) @siriwatknp, @mnajdova. - ๐Ÿ“ฆ Save [10 kB gzipped](https://bundlephobia.com/package/@material-ui/core@5.0.0-alpha.34) by removing the dependency on `@material-ui/styles` (JSS) from the core and the lab (#26377, #26382, #26376) @mnajdova. - โš’๏ธ Add many new [codemods](https://github.com/mui/material-ui/blob/HEAD/packages/mui-codemod/README.md) to automate the migration from v4 to v5 (#24867) @mbrookes. - And many more ๐Ÿ› bug fixes and ๐Ÿ“š improvements. ### `@material-ui/core@5.0.0-alpha.35` #### Breaking changes - [styles] Remove `makeStyles` from `@material-ui/core` (#26382) @mnajdova The `makeStyles` JSS utility is no longer exported from `@material-ui/core`. You can use `@material-ui/styles` instead. Make sure to add a `ThemeProvider` at the root of your application, as the `defaultTheme` is no longer available. If you are using this utility together with `@material-ui/core`, it's recommended you use the `ThemeProvider` component from `@material-ui/core` instead. ```diff -import { makeStyles } from '@material-ui/core/styles'; +import { makeStyles } from '@material-ui/styles'; +import { createTheme, ThemeProvider } from '@material-ui/core/styles'; +const theme = createTheme(); const useStyles = makeStyles((theme) => ({ background: theme.palette.primary.main, })); function Component() { const classes = useStyles(); return
    } // In the root of your app function App(props) { - return ; + return ; } ``` - [styles] Remove `withStyles` from `@material-ui/core` (#26377) @mnajdova The `withStyles` JSS utility is no longer exported from `@material-ui/core`. You can use `@material-ui/styles` instead. Make sure to add a `ThemeProvider` at the root of your application, as the `defaultTheme` is no longer available. If you are using this utility together with `@material-ui/core`, you should use the `ThemeProvider` component from `@material-ui/core` instead. ```diff -import { withStyles } from '@material-ui/core/styles'; +import { withStyles } from '@material-ui/styles'; +import { createTheme, ThemeProvider } from '@material-ui/core/styles'; +const defaultTheme = createTheme(); const MyComponent = withStyles((props) => { const { classes, className, ...other } = props; return
    })(({ theme }) => ({ root: { background: theme.palette.primary.main }})); function App() { - return ; + return ; } ``` - [styles] Merge options in `experimentalStyled` (#26396) @mnajdova The options inside the `experimentalStyled` module are now merged under one object. In the coming weeks, we will rename ths module: `styled()` to signal that it's no longer experimental. ```diff -experimentalStyled(Button, { shouldForwardProp: (prop) => prop !== 'something' }, { skipSx: true })(...); +experimentalStyled(Button, { shouldForwardProp: (prop) => prop !== 'something', skipSx: true })(...); ``` - [Tabs] Update `min` & `max` width and remove `minWidth` media query (#26458) @siriwatknp Update the implementation to better match Material Design: - Tab `minWidth` changed from `72px` => `90px` (without media-query) according to [material-design spec](https://m2.material.io/components/tabs#specs) - Tab `maxWidth` changed from `264px` => `360px` according to [material-design spec](https://m2.material.io/components/tabs#specs) #### Changes - [ButtonBase] Fix role="button" attribute (#26271) @Gautam-Arora24 - [Dialog] Fix support for custom breakpoints (#26331) @jeferson-sb - [Select] Open popup below button (#26200) @oliviertassinari - [TextField] Add variants support, e.g. custom sizes (#26468) @siriwatknp - [Tooltip] Improve handling of small vs. touch screens (#26097) @oliviertassinari ### `@material-ui/codemod@5.0.0-alpha.35` - [codemod] Add multiple codemods to migrate components from v4 to v5 (#24867) @mbrookes - [codemod] Correct path and add target placeholder (#26414) @mbrookes ### `@material-ui/icons@5.0.0-alpha.35` - [icons] Use array children instead of React fragments (#26309) @eps1lon Reduce a bit the size of the package. ### `@material-ui/system@5.0.0-alpha.35` We are progressively moving all modules that are relevant to styling custom design systems in this package. It's meant to be complementary with `@material-ui/unstyled`. - [system] Add Box to system (#26379) @mnajdova - [system] Add createStyled utility (#26485) @mnajdova ### `@material-ui/styled-engine-sc@5.0.0-alpha.35` - [styled-engine] Fix styled() util to respect `options` (#26339) @pasDamola ### `@material-ui/lab@5.0.0-alpha.35` #### Breaking changes - [pickers] Remove allowKeyboardControl (#26451) @eps1lon - [ClockPicker] Rework keyboard implementation (#26400) @eps1lon Remove the `allowKeyboardControl` prop from ClockPicker (and TimePicker and variants). Keyboard navigation now works by default. #### Changes - [Button] Migrate LoadingButton to emotion (#26370) @siriwatknp - [ClockPicker] Selected option is the active descendant (#26411) @eps1lon - [DatePicker] Migrate CalendarPicker to emotion (#26390) @siriwatknp - [DatePicker] Migrate CalendarPickerSkeleton to emotion (#26335) @siriwatknp - [DateRangePicker] Migrate DateRangePickerDay to emotion (#26368) @siriwatknp - [DateRangePicker] Migrate internal components to emotion (#26326) @siriwatknp - [pickers] Migrate PickersCalendarHeader to emotion (#26354) @siriwatknp - [pickers] Migrate PickersModalDialog to emotion (#26355) @siriwatknp - [pickers] Migrate PickersPopper to emotion (#26391) @siriwatknp - [pickers] Migrate PickersTransition to emotion (#26353) @siriwatknp - [TimePicker] Migrate ClockPicker to emotion (#26389) @siriwatknp - [TreeView] Correctly select items in deeply nested trees (#26413) @Dru89 ### Docs - [docs] Add page for `experimentalStyled()` (#26361) @mnajdova - [docs] Add TypeScript convention (#26259) @siriwatknp - [docs] Add warning about git-blame-ignore-revs (#26487) @eps1lon - [docs] Clarify migration from Hidden (#26348) @m4theushw - [docs] Fix grammar for style library page (#26325) @mbrookes - [docs] Persist copied state indefinitely or until the user moves their cursor (#26336) @eps1lon - [docs] Typo in MultipleSelect (#26466) @wolfykey - [docs] Update system installation for v5 (#26481) @mnajdova - [template] Demo how to retreive form value (#26393) @akshitsuri ### Core - [core] Batch small changes (#26434) @oliviertassinari - [core] Fix peer dependencies declaration with yarn v2 (#26433) @oliviertassinari - [core] Remove `@material-ui/styles` dependencies from declaration files too (#26376) @mnajdova - [core] Revert Leverage CircleCI workspaces for jobs after checkout (#26444) @eps1lon - [test] Don't hoist constant elements (#26448) @eps1lon - [test] Fix prop-type warning (#26432) @oliviertassinari - [test] Flush scheduled effects before user event returns (#26447) @eps1lon - [test] Move ClockPicker tests to ClockPicker.test (#26407) @eps1lon - [test] setProps from createPickerRender should set props on the rendered element (#26405) @eps1lon - [utils] Convert useId to TypeScript (#26491) @eps1lon - [website] Add Material UI X page (#25794) @DanailH - [website] Add open application section (#26501) @oliviertassinari - [website] Add Siriwat to team page (#26406) @siriwatknp All contributors of this release in alphabetical order: @akshitsuri, @DanailH, @Dru89, @eps1lon, @Gautam-Arora24, @jeferson-sb, @m4theushw, @mbrookes, @mnajdova, @oliviertassinari, @pasDamola, @siriwatknp, @wolfykey ## 5.0.0-alpha.34 _May 18, 2021_ A big thanks to the 16 contributors who made this release possible. Here are some highlights โœจ: - ๐Ÿ’ฅ Make progress with the breaking changes. We have done 89 of the 109 changes [planned](https://github.com/mui/material-ui/issues/20012). We will release 5.0.0-beta.0 on July 1st and start to promote its usage over v4. You can also follow [our milestone](https://github.com/mui/material-ui/milestone/35) for more details. - ๐Ÿš€ Make progress with components migration to emotion. We have done 153 of the 168 components (almost there!) - And many more ๐Ÿ› bug fixes and ๐Ÿ“š improvements. ### `@material-ui/core@5.0.0-alpha.34` #### Breaking change - ​[Select][nativeselect] Polish CSS classes (#26186) @m4theushw **Select, NativeSelect** Merge the `selectMenu` slot into `select`. Slot `selectMenu` was redundant. The `root` slot is no longer applied to the select, but to the root. ```diff - + ``` **TablePagination** Move the custom class on `input` to `select`. The `input` key is being applied on another element. ```diff ``` - ​[core] Move `StyledEngineProvider` to `@material-ui/core/styles` (#26265) @mnajdova Change location of `StyledEngineProvider` import. ```diff -import StyledEngineProvider from '@material-ui/core/StyledEngineProvider'; +import { StyledEngineProvider } from '@material-ui/core/styles'; ``` - ​[Autocomplete] Apply .Mui-focused instead of data-focus on the focused option (#26181) @m4theushw The `data-focus` attribute is not set on the focused option anymore, instead, global class names are used. ```diff -'.MuiAutocomplete-option[data-focus="true"]': { +'.MuiAutocomplete-option.Mui-focused': { ``` - ​[Radio] Make color primary default (#26180) @vicasas - ​[Switch] Make color primary default (#26182) @vicasas - ​[pickers] Drop ResponsiveWrapper usage (#26123) @eps1lon When a responsive picker changes from mobile to desktop, it will now clear its entire state. To keep the original behavior you can implement a controlled picker: ```js function ResponsiveDateTimePicker(props) { const [open, setOpen] = React.useState(false); return ( setOpen(false)} onOpen={() => setOpen(true)} {...props} /> ); } ``` - ​[Autocomplete] Rename getOptionSelected to isOptionEqualToValue (#26173) @m4theushw ```diff option.title === value.title} + isOptionEqualToValue={(option, value) => option.title === value.title} /> ``` > Follow [this link](https://mui.com/material-ui/migration/migration-v4/) for full migration from v4 => v5 #### Changes - ​[TextField] Fix hiddenLabel type of FilledInput (#26290) @siriwatknp - ​[TextField] Fix classes forward to InputBase (#26231) @arpitBhalla - ​[Autocomplete] Fix missing 'createOption' in AutocompleteCloseReason type (#26197) @Gautam-Arora24 - ​[Autocomplete] Reduce CSS specificity by 1 (#26238) @Gautam-Arora24 - ​[ButtonBase] Omit aria-disabled if not disabled (#26189) @Gautam-Arora24 - ​[colors] Fix A inconsistencies (#26196) @oliviertassinari - ​[examples] Fix dynamic global styles & global styles leak in the ssr examples (#26177) @mnajdova - ​[Slider] Fix support for non primary colors (#26285) @davidfdriscoll - ​[Slider] Center value label for disabled slider (#26257) @davidfdriscoll - ​[styled-engine] Fix styled-components not supporting empty style (#26098) @ruppysuppy - ​[styles] Fix overrides type issues (#26228) @mnajdova - ​[Container] Fix support for custom breakpoints (#26328) @alanszp ### `@material-ui/lab@5.0.0-alpha.34` - ​[pickers] Migrate TimePickerToolbar to emotion (#26274) @siriwatknp - ​[pickers] Migrate DatePickerToolbar to emotion (#26292) @siriwatknp - ​[DateTimePicker] Migrate DateTimePickerTabs and Toolbar to emotion (#26327) @siriwatknp - ​[DatePicker] Migrate PickersYear to emotion (#25949) @siriwatknp - ​[DateRangePicker] Migrate PickersToolbarText to emotion (#25983) @siriwatknp - ​[pickers] Migrate StaticWrapper to emotion (#26275) @siriwatknp - ​[pickers] Migrate Clock to emotion (#26278) @siriwatknp - ​[pickers] Migrate PickersToolbar to emotion (#26273) @siriwatknp - ​[pickers] Migrate ClockNumber to emotion (#26058) @siriwatknp - ​[pickers] Migrate ClockPointer to emotion (#26057) @siriwatknp - ​[pickers] Migrate PickersMonth to emotion (#26021) @siriwatknp - ​[pickers] Migrate MonthPicker to emotion (#26025) @siriwatknp - ​[pickers] Migrate PickersDay to emotion (#25995) @siriwatknp - ​[pickers] Migrate PickersToolbarButton to emotion (#25989) @siriwatknp ### `@material-ui/icons@5.0.0-alpha.34` - ​[icons] Remove extraneous React.Fragment (#26308) @eps1lon - ​[icons] Synchronize icons (#26302) @eps1lon New DriveFileMove icon and its variants ### Docs - ​[NProgressBar] Fix invalid ARIA and HTML (#26234) @eps1lon - ​[docs] Simplify demos slider (#26324) @oliviertassinari - ​[docs] Use transpiled icons directly (#26268) @eps1lon - ​[docs] Remove dependency on withStyles from @material-ui/core/styles (#26269) @mnajdova - ​[docs] Add Jalali date picker demo (#26243) @smmoosavi - ​[docs] Remove last dependencies on `makeStyles` from `@material-ui/core/styles` (#26246) @mnajdova - ​[docs] Polish the pickers demo (#26094) @oliviertassinari - ​[docs] Fix broken overrides link on API pages (#26244) @mnajdova - ​[docs] Improve documentation for Buttons (#26184) @arpitBhalla - ​[docs] Emphasize on props for screen readers (#26222) @atisheyJain03 - ​[docs] Link third-party routing in Bottom navigation (#26190) @arpitBhalla - ​[docs] Migrate Select, Progress demos to emotion (#26178) @mnajdova - ​[docs] Add accessibility section to Badges (#26009) @likitarai1 - ​[docs] Migrate Popper, Drawer demos to emotion (#26183) @mnajdova - ​[docs] Use public next/router events API (#26233) @eps1lon - ​[docs] Remove remnants Hidden component (#26191) @vicasas - ​[docs] Ensure TreeView demos don't overflow demo container (#26161) @eps1lon - ​[docs] Fix a typo in the import statement of LocalizationProvider (#26226) @huyenltnguyen - ​[docs] Improve react-admin coverage in the showcase (#26169) @fzaninotto - ​[docs] Fix Workbox that are causing infinite loading of site (#26193) @arpitBhalla ### Core - ​[core] Skip sx prop in internal components (#26235) @mnajdova - ​[core] Remove `withStyles` dependencies from `@material-ui/core/styles` (#26277) @mnajdova - ​[core] Include human readable target in the BrowserStack build (#26322) @eps1lon - ​[core] Fix NotchedOutlineProps type (#26305) @gnowland - ​[core] Add file for git-blame --ignore-revs-file (#26295) @eps1lon - ​[core] Ensure component class keys aren't missing (#25754) @eps1lon - ​[core] Drop support for blocking mode (#26262) @eps1lon - ​[core] Don't download monorepo packages (#26261) @eps1lon - ​[core] Batch small changes (#26199) @oliviertassinari - ​[core] Extract classes descriptions from TypeScript (#25933) @eps1lon - ​[styled-engine] Fix test script (#26258) @ruppysuppy All contributors of this release in alphabetical order: @arpitBhalla, @atisheyJain03, @davidfdriscoll, @eps1lon, @fzaninotto, @Gautam-Arora24, @gnowland, @huyenltnguyen, @likitarai1, @m4theushw, @mnajdova, @oliviertassinari, @ruppysuppy, @siriwatknp, @smmoosavi, @vicas ## 5.0.0-alpha.33 _May 9, 2021_ A big thanks to the 17 contributors who made this release possible. Here are some highlights โœจ: - ๐Ÿ’ฅ Make progress with the breaking changes. We have done 81 of the 109 changes [planned](https://github.com/mui/material-ui/issues/20012). We will release 5.0.0-beta.0 on July 1st and start to promote its usage over v4. You can also follow [our milestone](https://github.com/mui/material-ui/milestone/35) for more details. - And many more ๐Ÿ› bug fixes and ๐Ÿ“š improvements. ### `@material-ui/core@5.0.0-alpha.33` #### Breaking changes - ​[core] Remove deprecated innerRef prop (#26028) @m4theushw **withStyles** Replace the `innerRef` prop with the `ref` prop. Refs are now automatically forwarded to the inner component. ```diff import * as React from 'react'; import { withStyles } from '@material-ui/core/styles'; const MyComponent = withStyles({ root: { backgroundColor: 'red', }, })(({ classes }) =>
    ); function MyOtherComponent(props) { const ref = React.useRef(); - return ; + return ; } ``` **withTheme** Replace the `innerRef` prop with the `ref` prop. Refs are now automatically forwarded to the inner component. ```diff import * as React from 'react'; import { withTheme } from '@material-ui/core/styles'; const MyComponent = withTheme(({ theme }) =>
    {props.theme.direction}
    ); function MyOtherComponent(props) { const ref = React.useRef(); - return ; + return ; } ``` - ​[theme] Rename `createMuiTheme` to `createTheme` (#25992) @m4theushw Developers only need one theme in their application. A prefix would suggest a second theme is needed. It's not the case. `createMuiTheme` will be removed in v6. ```diff -import { createMuiTheme } from '@material-ui/core/styles'; +import { createTheme } from '@material-ui/core/styles'; -const theme = createMuiTheme({ +const theme = createTheme({ ``` - ​[theme] Remove MuiThemeProvider alias (#26171) @m4theushw The `MuiThemeProvider` is no longer exported. Use `ThemeProvider` instead. It was removed from the documentation during v4-beta, 2 years ago. ```diff -import { MuiThemeProvider } from '@material-ui/core/styles'; +import { ThemeProvider } from '@material-ui/core/styles'; ``` - ​[Box] Remove the `clone` prop (#26031) @m4theushw Its behavior can be obtained using the `sx` prop. ```diff - - - + ``` - ​[Box] Remove render prop (#26113) @m4theushw Its behavior can be obtained using the `sx` prop directly on the child if it's a Material UI component. For non-Material UI components use the `sx` prop in conjunction with the `component` prop: ```diff - - {(props) => } - + ``` ```diff - - {(props) => } - +Save ``` - ​[Checkbox] Make color="primary" default (#26002) @vicasas This better matches the Material Design guidelines. ```diff - + + - +