Merge branch 'master' into custom-system-props

CHANGELOG.md

@@ -1,5 +1,67 @@
 # [Versions](https://mui.com/versions/)
 
+## 5.13.1
+
+<!-- generated comparing v5.13.0..master -->
+
+_May 16, 2023_
+
+A big thanks to the 25 contributors who made this release possible. Here are some highlights ✨:
+
+- 🌏 Added Central Myanmar (my-MY), Malay (ms-MS), Nepali (ne-NP), Tagalog (tl-TL) locales (#37017) @cccEric
+- 🐛 bug fixes and 📚 documentation improvements.
+
+### `@mui/material@5.13.1`
+
+- [Autocomplete] Allow tooltip text selection (#36503) @safeamiiir
+- [Dialog] Fixed broken dialog when using maxWidth="xs" and custom breakpoint unit (#37237) @jguddas
+- [l10n] Add Central Myanmar (my-MY), Malay (ms-MS), Nepali (ne-NP), Tagalog (tl-TL) locales (#37017) @cccEric
+
+### `@mui/utils@5.13.1`
+
+- [utils] Fix downstream bundlers remove React 17 useId compatibility (#37183) @nickiaconis
+
+### `@mui/base@5.0.0-beta.1`
+
+- [Select][base] Keep focus on the trigger element when listbox is open (#37244) @michaldudak
+
+### `@mui/joy@5.0.0-alpha.80`
+
+- [Autocomplete] Fixed scroll into view (#37217) @sai6855
+- [AutocompleteOption][Avatar] js test replaced with ts test (#37088) @PunitSoniME
+- [Breadcrumbs] Replace js-tests with ts-tests (#37107) @mauwaz
+- [RadioGroup] Turn JS test to TS test (#37138) @uuxxx
+- [SvgIcon] Turn JS test to TS test (#37151) @nicolas-ot
+- [Tooltip] Turn JS test to TS test (#37149) @nicolas-ot
+- [Typography] Convert Typography test to TypeScript (#37165) @DerTimonius
+- [Sheet][Slider][Stack][Switch] Replace js-tests with ts-tests (#37139) @mauwaz
+- Miscellaneous fixes (#37274) @siriwatknp
+
+### Docs
+
+- [docs] Remove upload button (#36844) @Bastian
+- [docs] Update link to overriding component structure guide (#36870) @hbjORbj
+- [docs] Fix Material Design templates (#37187) @oliviertassinari
+- [docs] Fix link to Joy UI GitHub issues @oliviertassinari
+- [docs] Show default value for `filterOptions` prop in Autocomplete's API docs (#37230) @ZeeshanTamboli
+- [docs] Add summary and improve `test_static` CI doc in CONTRIBUTING readme file (#36711) @kriskw1999
+- [docs] Update theme customization typescript (#35551) @siriwatknp
+- [docs] Add Joy Frames X web blocks template (#37203) @siriwatknp
+- [docs] Change Base UI `alpha` to `beta` in README (#37228) @ZeeshanTamboli
+- [docs] Improve Base UI overview page (#37227) @mnajdova
+- [docs] Update Joy + Material guide (#36911) @cherniavskii
+
+### Core
+
+- [core] Remove `toEqualDateTime` chai matcher (#37073) @flaviendelangle
+- [core] Check dependency cycles inside packages directory only (#37223) @michaldudak
+- [core] Remove outdated babel proposal plugins (#36795) @kkocdko
+- [website] Add Diego to About Us page (#37284) @DiegoAndai
+- [website] Add Victor teamMember card to 'About' (#37283) @zanivan
+- [website] Add Rich to the 'About' page (#37221) @richbustos
+
+All contributors of this release in alphabetical order: @Bastian, @binh1298, @cccEric, @cherniavskii, @DerTimonius, @DiegoAndai, @flaviendelangle, @hbjORbj, @jguddas, @kkocdko, @kriskw1999, @mauwaz, @michaldudak, @mnajdova, @nickiaconis, @nicolas-ot, @oliviertassinari, @PunitSoniME, @richbustos, @safeamiiir, @sai6855, @siriwatknp, @uuxxx, @zanivan, @ZeeshanTamboli
+
 ## 5.13.0
 
 <!-- generated comparing v5.12.3..master -->

babel.config.js

@@ -62,12 +62,6 @@ module.exports = function getBabelConfig(api) {
       },
     ],
     'babel-plugin-optimize-clsx',
-    // Need the following 3 proposals for all targets in .browserslistrc.
-    // With our usage the transpiled loose mode is equivalent to spec mode.
-    ['@babel/plugin-proposal-class-properties', { loose: true }],
-    ['@babel/plugin-proposal-private-methods', { loose: true }],
-    ['@babel/plugin-proposal-private-property-in-object', { loose: true }],
-    ['@babel/plugin-proposal-object-rest-spread', { loose: true }],
     [
       '@babel/plugin-transform-runtime',
       {

benchmark/package.json

@@ -12,12 +12,12 @@
   },
   "dependencies": {
     "@chakra-ui/system": "^2.5.7",
-    "@emotion/react": "^11.10.8",
-    "@emotion/styled": "^11.10.8",
+    "@emotion/react": "^11.11.0",
+    "@emotion/styled": "^11.11.0",
     "@mdx-js/react": "^2.3.0",
-    "@mui/material": "^5.13.0",
-    "@mui/styles": "^5.12.3",
-    "@mui/system": "^5.12.3",
+    "@mui/material": "^5.13.1",
+    "@mui/styles": "^5.13.1",
+    "@mui/system": "^5.13.1",
     "@styled-system/css": "^5.1.5",
     "benchmark": "^2.1.4",
     "playwright": "^1.33.0",

docs/data/joy/guides/using-joy-ui-and-material-ui/using-joy-ui-and-material-ui.md

@@ -31,8 +31,8 @@ Render Material UI's `CssVarsProvider` inside Joy UI's provider and use `THEME_I
 import {
   experimental_extendTheme as materialExtendTheme,
   Experimental_CssVarsProvider as MaterialCssVarsProvider,
+  THEME_ID as MATERIAL_THEME_ID,
 } from '@mui/material/styles';
-import colors from '@mui/joy/colors';
 import { CssVarsProvider as JoyCssVarsProvider } from '@mui/joy/styles';
 
 const materialTheme = materialExtendTheme();

docs/data/material/components/buttons/buttons-pt.md

@@ -79,10 +79,6 @@ For larger or smaller buttons, use the `size` prop.
 
 {{"demo": "ButtonSizes.js"}}
 
-## Botão de upload
-
-{{"demo": "UploadButtons.js"}}
-
 ## Botões com ícones e rótulo
 
 Às vezes você pode querer ter ícones para certos botões para aprimorar a experiência do usuário, pois reconhecem logotipos mais facilmente do que texto. Por exemplo, se você tem um botão com a ação de "deletar", você pode rotulá-lo com o ícone de lata de lixo.

docs/data/material/components/buttons/buttons-zh.md

@@ -79,10 +79,6 @@ Note that the documentation [avoids](/material-ui/guides/api/#native-properties)
 
 {{"demo": "ButtonSizes.js"}}
 
-## Upload button 上传按钮
-
-{{"demo": "UploadButtons.js"}}
-
 ## 带有 icons（图标）和 label（标签）的按钮
 
 因为相比纯文本来说用户对图标更敏感，所以有些时候你可能希望为某些按钮设置图标，以增强应用程序的用户体验。 例如，如果您有删除按钮，则可以使用垃圾箱图标对其进行标记。

docs/data/material/components/buttons/buttons.md

@@ -85,10 +85,6 @@ For larger or smaller buttons, use the `size` prop.
 
 {{"demo": "ButtonSizes.js"}}
 
-## Upload button
-
-{{"demo": "UploadButtons.js"}}
-
 ## Buttons with icons and label
 
 Sometimes you might want to have icons for certain buttons to enhance the UX of the application as we recognize logos more easily than plain text. For example, if you have a delete button you can label it with a dustbin icon.

docs/data/material/guides/localization/localization.md

@@ -72,6 +72,9 @@ The [Data Grid and Data Grid Pro](/x/react-data-grid/) components have their own
 | Korean                  | ko-KR               | `koKR`      |
 | Kurdish (Central)       | ku-CKB              | `kuCKB`     |
 | Macedonian              | mk-MK               | `mkMK`      |
+| Myanmar                 | my-MY               | `myMY`      |
+| Malay                   | ms-MS               | `msMS`      |
+| Nepali                  | ne-NP               | `neNP`      |
 | Norwegian (bokmål)      | nb-NO               | `nbNO`      |
 | Persian                 | fa-IR               | `faIR`      |
 | Polish                  | pl-PL               | `plPL`      |
@@ -86,6 +89,7 @@ The [Data Grid and Data Grid Pro](/x/react-data-grid/) components have their own
 | Swedish                 | sv-SE               | `svSE`      |
 | Thai                    | th-TH               | `thTH`      |
 | Turkish                 | tr-TR               | `trTR`      |
+| Tagalog                 | tl-TL               | `tlTL`      |
 | Ukrainian               | uk-UA               | `ukUA`      |
 | Urdu (Pakistan)         | ur-PK               | `urPK`      |
 | Vietnamese              | vi-VN               | `viVN`      |

docs/data/material/migration/migration-v4/migration-v4.md

@@ -80,7 +80,7 @@ If you are using a React version below 17.0.0, update your packages to at least
 With npm:
 
 ```sh
-npm update @material-ui/core@^4.11.2 react@^17.0.0
+npm install @material-ui/core@^4.11.2 react@^17.0.0
 ```
 
 With yarn:

docs/next.config.js

@@ -241,4 +241,7 @@ module.exports = withDocsInfra({
       { source: `/static/x/:rest*`, destination: 'http://0.0.0.0:3001/static/x/:rest*' },
     ];
   },
+  experimental: {
+    esmExternals: false,
+  },
 });

docs/package.json

@@ -24,25 +24,25 @@
     "@babel/plugin-transform-object-assign": "^7.18.6",
     "@babel/runtime-corejs2": "^7.21.0",
     "@docsearch/react": "^3.3.4",
-    "@emotion/cache": "^11.10.8",
-    "@emotion/react": "^11.10.8",
-    "@emotion/server": "^11.10.0",
-    "@emotion/styled": "^11.10.8",
-    "@fortawesome/fontawesome-svg-core": "^6.2.1",
-    "@fortawesome/free-solid-svg-icons": "^6.2.1",
+    "@emotion/cache": "^11.11.0",
+    "@emotion/react": "^11.11.0",
+    "@emotion/server": "^11.11.0",
+    "@emotion/styled": "^11.11.0",
+    "@fortawesome/fontawesome-svg-core": "^6.4.0",
+    "@fortawesome/free-solid-svg-icons": "^6.4.0",
     "@fortawesome/react-fontawesome": "^0.2.0",
-    "@mui/base": "5.0.0-beta.0",
-    "@mui/docs": "^5.12.3",
+    "@mui/base": "5.0.0-beta.1",
+    "@mui/docs": "^5.12.4",
     "@mui/icons-material": "^5.11.16",
-    "@mui/joy": "5.0.0-alpha.79",
-    "@mui/lab": "5.0.0-alpha.129",
+    "@mui/joy": "5.0.0-alpha.80",
+    "@mui/lab": "5.0.0-alpha.130",
     "@mui/markdown": "^5.0.0",
-    "@mui/material": "^5.13.0",
-    "@mui/material-next": "6.0.0-alpha.84",
+    "@mui/material": "^5.13.1",
+    "@mui/material-next": "6.0.0-alpha.85",
     "@mui/styled-engine": "^5.12.3",
     "@mui/styled-engine-sc": "^5.12.0",
-    "@mui/styles": "^5.12.3",
-    "@mui/system": "^5.12.3",
+    "@mui/styles": "^5.13.1",
+    "@mui/system": "^5.13.1",
     "@mui/types": "^7.2.4",
     "@mui/x-data-grid": "6.4.0",
     "@mui/x-data-grid-generator": "6.4.0",

docs/pages/_app.js

@@ -20,6 +20,10 @@ import createEmotionCache from 'docs/src/createEmotionCache';
 import findActivePage from 'docs/src/modules/utils/findActivePage';
 import useRouterExtra from 'docs/src/modules/utils/useRouterExtra';
 import { LicenseInfo } from '@mui/x-data-grid-pro';
+import materialPkgJson from 'packages/mui-material/package.json';
+import joyPkgJson from 'packages/mui-joy/package.json';
+import systemPkgJson from 'packages/mui-system/package.json';
+import basePkgJson from 'packages/mui-base/package.json';
 
 // Remove the license warning from demonstration purposes
 LicenseInfo.setLicenseKey(process.env.NEXT_PUBLIC_MUI_LICENSE);
@@ -142,6 +146,61 @@ function AppWrapper(props) {
     }
   }, []);
 
+  const productIdentifier = React.useMemo(() => {
+    const languagePrefix = pageProps.userLanguage === 'en' ? '' : `/${pageProps.userLanguage}`;
+
+    if (product === 'material-ui') {
+      return {
+        name: 'Material UI',
+        metadata: 'MUI Core',
+        versions: [
+          { text: `v${materialPkgJson.version}`, current: true },
+          {
+            text: 'v4',
+            href: `https://v4.mui.com${languagePrefix}/getting-started/installation/`,
+          },
+          {
+            text: 'View all versions',
+            href: `https://mui.com${languagePrefix}/versions/`,
+          },
+        ],
+      };
+    }
+
+    if (product === 'joy-ui') {
+      return {
+        name: 'Joy UI',
+        metadata: 'MUI Core',
+        versions: [{ text: `v${joyPkgJson.version}`, current: true }],
+      };
+    }
+
+    if (product === 'system') {
+      return {
+        name: 'MUI System',
+        metadata: 'MUI Core',
+        versions: [
+          { text: `v${systemPkgJson.version}`, current: true },
+          { text: 'v4', href: `https://v4.mui.com${languagePrefix}/system/basics/` },
+          {
+            text: 'View all versions',
+            href: `https://mui.com${languagePrefix}/versions/`,
+          },
+        ],
+      };
+    }
+
+    if (product === 'base') {
+      return {
+        name: 'MUI Base',
+        metadata: 'MUI Core',
+        versions: [{ text: `v${basePkgJson.version}`, current: true }],
+      };
+    }
+
+    return null; // The identifier for X and Toolpad is handled by their own site
+  }, [pageProps.userLanguage, product]);
+
   const pageContextValue = React.useMemo(() => {
     let pages = generalPages;
     if (product === 'base') {
@@ -156,8 +215,8 @@ function AppWrapper(props) {
 
     const { activePage, activePageParents } = findActivePage(pages, router.pathname);
 
-    return { activePage, activePageParents, pages };
-  }, [product, router.pathname]);
+    return { activePage, activePageParents, pages, productIdentifier };
+  }, [product, productIdentifier, router.pathname]);
 
   let fonts = [];
   if (asPathWithoutLang.match(/onepirate/)) {

docs/pages/about.tsx

@@ -472,6 +472,16 @@ const teamMembers: Array<Profile> = [
     github: 'zanivan',
     twitter: 'Zanivan_',
   },
+  {
+    name: 'Diego Andai',
+    src: '/static/branding/about/diego.png',
+    title: 'MUI Core Engineer',
+    location: 'Santiago, Chile',
+    locationCountry: 'cl',
+    about: 'I love tennis 🎾 and cats 🐈',
+    twitter: 'DiegoAndaiC',
+    github: 'DiegoAndai',
+  },
 ];
 
 const contributors = [