diff --git a/.circleci/config.yml b/.circleci/config.yml index 0710cceb025d03..4cb1b1a1d52884 100644 --- a/.circleci/config.yml +++ b/.circleci/config.yml @@ -45,7 +45,7 @@ default-job: &default-job AWS_REGION_ARTIFACTS: eu-central-1 working_directory: /tmp/material-ui docker: - - image: cimg/node:18.20 + - image: cimg/node:20.17 default-context: &default-context context: @@ -142,7 +142,7 @@ jobs: name: '`pnpm dedupe` was run?' command: | # #default-branch-switch - if [[ $(git diff --name-status next | grep -E 'pnpm-workspace\.yaml|pnpm-lock.yaml|package\.json') == "" ]]; + if [[ $(git diff --name-status master | grep -E 'pnpm-workspace\.yaml|pnpm-lock.yaml|package\.json') == "" ]]; then echo "No changes to dependencies detected. Skipping..." else @@ -353,13 +353,13 @@ jobs: resource_class: 'medium+' steps: - checkout + - install_js - run: name: Resolve typescript version command: | - pnpm add typescript@next -d -w + pnpm update -r typescript@next # log a patch for maintainers who want to check out this change git --no-pager diff HEAD - - install_js - run: name: Tests TypeScript definitions command: | @@ -495,6 +495,12 @@ jobs: - run: name: Run visual regression tests command: xvfb-run pnpm test:regressions + - run: + name: Build packages for fixtures + command: xvfb-run pnpm release:build + - run: + name: Run visual regression tests using Pigment CSS + command: xvfb-run pnpm test:regressions-pigment-css - run: name: Upload screenshots to Argos CI command: pnpm test:argos diff --git a/.codesandbox/ci.json b/.codesandbox/ci.json index ec72fd1039c4d5..437b8c3d5eb5ef 100644 --- a/.codesandbox/ci.json +++ b/.codesandbox/ci.json @@ -1,7 +1,7 @@ { "buildCommand": "build:codesandbox", "installCommand": "install:codesandbox", - "node": "18", + "node": "20", "packages": [ "packages/markdown", "packages/mui-babel-macros", @@ -21,6 +21,7 @@ "packages/mui-system", "packages/mui-types", "packages/mui-utils", + "packages-internal/babel-plugin-resolve-imports", "packages-internal/docs-utils", "packages-internal/scripts", "packages-internal/test-utils" @@ -36,6 +37,7 @@ "@mui/internal-docs-utils": "packages-internal/docs-utils", "@mui/internal-markdown": "packages/markdown", "@mui/internal-scripts": "packages-internal/scripts", + "@mui/internal-babel-plugin-resolve-imports": "packages-internal/babel-plugin-resolve-imports", "@mui/lab": "packages/mui-lab/build", "@mui/material-nextjs": "packages/mui-material-nextjs/build", "@mui/material": "packages/mui-material/build", diff --git a/.eslintignore b/.eslintignore index 9a58941c035a16..0349804bb8f298 100644 --- a/.eslintignore +++ b/.eslintignore @@ -1,6 +1,5 @@ /.git /.yarn -/benchmark/**/dist /coverage /docs/export /docs/pages/playground/ @@ -29,6 +28,7 @@ /tmp .next build +dist node_modules .nyc_output pnpm-lock.yaml diff --git a/.eslintrc.js b/.eslintrc.js index 8bcf960100b1ee..8c828c846ffa23 100644 --- a/.eslintrc.js +++ b/.eslintrc.js @@ -223,6 +223,11 @@ module.exports = { selector: 'ImportDeclaration[source.value="react-dom/server"] ImportDefaultSpecifier, ImportDeclaration[source.value="react-dom/server"] ImportSpecifier', }, + { + message: + "The 'use client' pragma can't be used with export * in the same module. This is not supported by Next.js.", + selector: 'ExpressionStatement[expression.value="use client"] ~ ExportAllDeclaration', + }, ], // We re-export default in many places, remove when https://github.com/airbnb/javascript/issues/2500 gets resolved diff --git a/.github/ISSUE_TEMPLATE/config.yml b/.github/ISSUE_TEMPLATE/config.yml index 9a2f57519c8df2..a03fc3f8b5ae2c 100644 --- a/.github/ISSUE_TEMPLATE/config.yml +++ b/.github/ISSUE_TEMPLATE/config.yml @@ -1,4 +1,4 @@ contact_links: - name: Support ❔ - url: https://mui.com/getting-started/support/ + url: https://mui.com/material-ui/getting-started/support/ about: I need support with Material UI, MUI System, or Joy UI. diff --git a/.github/workflows/ci.yml b/.github/workflows/ci.yml index e26b8f8b502480..9ee1e1ddca88f5 100644 --- a/.github/workflows/ci.yml +++ b/.github/workflows/ci.yml @@ -30,10 +30,10 @@ jobs: fetch-depth: 0 - name: Set up pnpm uses: pnpm/action-setup@fe02b34f77f8bc703788d5817da081398fad5dd2 # v4.0.0 - - name: Use Node.js 18.x + - name: Use Node.js 20.x uses: actions/setup-node@1e60f620b9541d16bece96c5465dc8ee9832be0b # v4.0.3 with: - node-version: 18 + node-version: 20 cache: 'pnpm' # https://github.com/actions/setup-node/blob/main/docs/advanced-usage.md#caching-packages-dependencies - run: pnpm install - run: pnpm build:ci diff --git a/.github/workflows/closed-issue-message.yml b/.github/workflows/closed-issue-message.yml new file mode 100644 index 00000000000000..8260ffc35db14b --- /dev/null +++ b/.github/workflows/closed-issue-message.yml @@ -0,0 +1,18 @@ +name: Add closing message to issue + +on: + issues: + types: + - closed + workflow_call: + +permissions: {} + +jobs: + add-comment: + name: Add closing message + if: github.event.issue.state_reason == 'completed' + uses: mui/mui-public/.github/workflows/issues_add-closing-message.yml@master + permissions: + contents: read + issues: write diff --git a/.github/workflows/codeql.yml b/.github/workflows/codeql.yml index bdc7438c5cef11..f8e99c9fc48504 100644 --- a/.github/workflows/codeql.yml +++ b/.github/workflows/codeql.yml @@ -19,7 +19,7 @@ jobs: uses: actions/checkout@692973e3d937129bcbf40652eb9f2f61becf3332 # v4.1.7 # Initializes the CodeQL tools for scanning. - name: Initialize CodeQL - uses: github/codeql-action/init@429e1977040da7a23b6822b13c129cd1ba93dbb2 # v3.26.2 + uses: github/codeql-action/init@4dd16135b69a43b6c8efb853346f8437d92d3c93 # v3.26.6 with: languages: typescript config-file: ./.github/codeql/codeql-config.yml @@ -30,4 +30,4 @@ jobs: # Details on CodeQL's query packs refer to : https://docs.github.com/en/code-security/code-scanning/automatically-scanning-your-code-for-vulnerabilities-and-errors/configuring-code-scanning#using-queries-in-ql-packs # queries: security-extended,security-and-quality - name: Perform CodeQL Analysis - uses: github/codeql-action/analyze@429e1977040da7a23b6822b13c129cd1ba93dbb2 # v3.26.2 + uses: github/codeql-action/analyze@4dd16135b69a43b6c8efb853346f8437d92d3c93 # v3.26.6 diff --git a/.github/workflows/publish-canaries.yml b/.github/workflows/publish-canaries.yml index 6ceb6385a7dfbf..b524ad7c36c267 100644 --- a/.github/workflows/publish-canaries.yml +++ b/.github/workflows/publish-canaries.yml @@ -3,6 +3,8 @@ name: Publish canary packages to npm on: workflow_dispatch: +permissions: {} + jobs: publish: runs-on: ubuntu-latest @@ -12,10 +14,10 @@ jobs: fetch-depth: 0 - name: Set up pnpm uses: pnpm/action-setup@fe02b34f77f8bc703788d5817da081398fad5dd2 # v4.0.0 - - name: Use Node.js 18.x + - name: Use Node.js 20.x uses: actions/setup-node@1e60f620b9541d16bece96c5465dc8ee9832be0b # v4.0.3 with: - node-version: 18 + node-version: 20 cache: 'pnpm' # https://github.com/actions/setup-node/blob/main/docs/advanced-usage.md#caching-packages-dependencies - run: pnpm install - run: pnpm canary:release --ignore @mui/icons-material --yes --skip-last-commit-comparison diff --git a/.github/workflows/scorecards.yml b/.github/workflows/scorecards.yml index 4cbf602748f220..2e114a690604ac 100644 --- a/.github/workflows/scorecards.yml +++ b/.github/workflows/scorecards.yml @@ -43,6 +43,6 @@ jobs: # Upload the results to GitHub's code scanning dashboard. - name: Upload to code-scanning - uses: github/codeql-action/upload-sarif@429e1977040da7a23b6822b13c129cd1ba93dbb2 # v3.26.2 + uses: github/codeql-action/upload-sarif@4dd16135b69a43b6c8efb853346f8437d92d3c93 # v3.26.6 with: sarif_file: results.sarif diff --git a/.github/workflows/support-stackoverflow.yml b/.github/workflows/support-stackoverflow.yml index c4c5cb41bce07e..5ba93685846e1b 100644 --- a/.github/workflows/support-stackoverflow.yml +++ b/.github/workflows/support-stackoverflow.yml @@ -22,7 +22,7 @@ jobs: # Comment to post on issues marked as support requests. Add a link # to a support page, or set to `false` to disable issue-comment: | - 👋 Thanks for using our open-source projects! + 👋 Thanks for using this project! We use GitHub issues exclusively as a bug and feature requests tracker, however, this issue appears to be a support request. @@ -32,4 +32,5 @@ jobs: If you have a question on Stack Overflow, you are welcome to link to it here, it might help others. If your issue is subsequently confirmed as a bug, and the report follows the issue template, it can be reopened. close-issue: true + issue-close-reason: 'not planned' lock-issue: false diff --git a/.gitignore b/.gitignore index 5fcf6bd0abd819..dc961ae3ca71b7 100644 --- a/.gitignore +++ b/.gitignore @@ -11,7 +11,6 @@ *.tsbuildinfo /.eslintcache /.nyc_output -/benchmark/**/dist /coverage /docs/.env.local /docs/export @@ -34,6 +33,7 @@ # created by netlify dev (to perform local debug) .netlify build +dist node_modules package-lock.json size-snapshot.json diff --git a/CHANGELOG.md b/CHANGELOG.md index e523564c72b86d..d197c8da228310 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -1,5 +1,211 @@ # [Versions](https://mui.com/versions/) +## 6.0.2 + + + +_Sep 3, 2024_ + +A big thanks to the 11 contributors who made this release possible. + +### `@mui/material@6.0.2` + +- ​Fix `createTheme` with just color schemes (#43518) @siriwatknp +- ​[Menu,Popover] Fix Backdrop props descriptions (#43503) @Michael-Hutchinson +- ​[MenuList] Do not react to an event with modifier key pressed (#43505) @MateuszGroth + +### `@mui/system@6.0.2` + +- ​[InitColorSchemeScript] Use `let/const` instead of `var` (#43468) @ishon19 +- ​Fix composeClasses v6 behavior change (#43537) @oliviertassinari + +### `@mui/codemod@6.0.2` + +- ​Skip `ListItemButton` import for unrelated files (#43532) @siriwatknp + +### Docs + +- ​[figma] Clarity state or Figma Plugin component export (#43543) @oliviertassinari +- ​[material-ui] Fix template shadow tokens (#43514) @zanivan +- ​Update version support range (#43565) @oliviertassinari +- ​Polish Material UI Sync plugin code format @oliviertassinari + +### Core + +- ​[blog] Update Material UI v6 blog post link to reflect correct section title (#43535) @Michael-Hutchinson +- ​[blog] Makes the v5 name change clearer @oliviertassinari +- ​[blog] Fix typo in Material UI v6 blog post (#43502) @iamandrewluca +- ​[code-infra] Add missing @babel/runtime dependency to @mui/material-pigment-css (#43473) @Janpot +- ​[code-infra] Remove permissions in publish-canaries.yml (#43491) @oliviertassinari +- ​[core] Fix CodeQL scan (#43547) @oliviertassinari +- ​[core] Fix CHANGELOG `@mui/material@6.0.1` version (#43516) @DiegoAndai +- ​[docs-infra] Reduce description max-length (#43562) @oliviertassinari +- ​[docs-infra] Crash on invalid callout type (#43546) @oliviertassinari +- ​[docs-infra] Fix GitHub source link redirection (#43534) @oliviertassinari +- ​[infra] Fixed workflow file path (#43528) @michelengelen +- ​[typescript] Fix missing `Theme` generic (#43523) @siriwatknp +- ​[website] Match pricing label with page @oliviertassinari +- ​[website] Update Premium price and remove any mention to cap (#43466) @joserodolfofreitas + +All contributors of this release in alphabetical order: @DiegoAndai, @iamandrewluca, @ishon19, @Janpot, @joserodolfofreitas, @MateuszGroth, @Michael-Hutchinson, @michelengelen, @oliviertassinari, @siriwatknp, @zanivan + +## v6.0.1 + + + +_Aug 29, 2024_ + +A big thanks to the 12 contributors who made this release possible. It contains bug fixes and documentation improvements. + +### `@mui/material@6.0.1` + +- Attach default light color scheme when enabling CSS theme variables (#43493) @siriwatknp +- [Skeleton] Apply the wave animation to the correct element (#43474) @mnajdova + +### Docs + +- [material-ui][Dialog] Update confirmation dialog description (#43488) @Michael-Hutchinson +- Add Material UI v6 is out! to the notifications (#43448) @oliviertassinari +- [material-ui] Dark scroll bars in templates (#43483) @aarongarciah +- [material-ui] Add TemplateFrame to templates (#43406) @zanivan +- [table] Make the data grid blend in (#43489) @oliviertassinari + +### Core + +- [blog] Update Toolpad Studio marketing page links in the blogs (#43407) @prakhargupta1 +- [blog] Add missing social card to the blog post (#43465) @siriwatknp +- [code-infra] Fix typing issues with `@mui-internal/api-docs-builder` (#43498) @Janpot +- [code-infra] Fix nextjs build cache (#43467) @JCQuintas +- Remove `'use client'` from index files and useAutocomplete reexport (#41956) @DiegoAndai +- Replace relative links to absolute ones in JSDocs (#43472) @alexfauquette +- Upgrade babel runtime (#43243) @Janpot +- [docs-infra] Skip shadow DOM regression test (#43500) @aarongarciah +- [docs-infra] Fix use of process.env.DEPLOY_ENV (#43490) @oliviertassinari +- [docs-infra] Add comment about removing optimizeFonts Next.js config (#43469) @aarongarciah +- [examples] Use `latest` on all Material UI dependencies (#43494) @mnajdova +- [infra] fix workflow path (#43464) @michelengelen + +All contributors of this release in alphabetical order: @aarongarciah, @alexfauquette, @DiegoAndai, @Janpot, @JCQuintas, @Michael-Hutchinson, @michelengelen, @mnajdova, @oliviertassinari, @prakhargupta1, @siriwatknp, @zanivan + +## 6.0.0 + + + +_Aug 27, 2024_ + +We are excited to announce the stable release of Material-UI v6 🎉, check out [the blog post](https://mui.com/blog/material-ui-v6-is-out/) to see all the updates. + +### `@mui/material@6.0.0` + +- Change React.ReactElement type from any to unknown (#43358) @sai6855 +- [Pagination] Update `getItemAriaLabel` page param type (#43399) @sydneyjodon-wk +- [Unstable_TrapFocus] Fix `getTabbable` function return type (#42237) @KalmarLorand + +### `@mui/lab@6.0.0-beta.8` + +- [button] Add missing customize points for span (#43436) @oliviertassinari + +### Docs + +- Fix broken links (#43144) @DiegoAndai +- Updated mui-x roadmap links with the new project URL (#43444) @michelengelen +- Update pnpm order, move to second (#42712) @ahmadnadeem6236 +- Fix CSS theme variables section (#43439) @siriwatknp +- Add two Toolpad Core components to Material UI sidebar (#43391) @prakhargupta1 +- Fix licensingModel -> licenseModel @oliviertassinari +- Fix Stack Overflow issue canned response @oliviertassinari +- Avoid referencing MUI Core @oliviertassinari +- Fix description of eslint-plugin-material-ui @oliviertassinari +- [docs-infra] Polish reportBrokenLinks.js to support Base UI @oliviertassinari +- [material-ui] Clarify RTL language support in localization guide (#41784) @bahmanworld +- [material-ui] Refine templates theme selector (#43396) @zanivan + +### Core + +- Prepare for v6 stable release (#43454) @siriwatknp +- [blog] Polish Upcoming changes to MUI X pricing in 2024 (#43438) @oliviertassinari +- [blog] Add Material UI v6 stable release (#41932) @siriwatknp +- [ci] Fix the release:changelog cmd (#43451) @mnajdova +- [core] Allow `^6.0.0` for `@mui/` dependencies in `@mui/docs` (#43445) @LukasTy +- [code-infra] Babel plugin to fully resolve imported paths (#43294) @Janpot +- [infra] Add closing message workflow (#43450) @michelengelen +- [website] Make beta chip consistent for Toolpad (#43392) @prakhargupta1 + +All contributors of this release in alphabetical order: @ahmadnadeem6236, @bahmanworld, @DiegoAndai, @Janpot, @KalmarLorand, @LukasTy, @michelengelen, @mnajdova, @oliviertassinari, @prakhargupta1, @sai6855, @siriwatknp, @sydneyjodon-wk, @zanivan + +## 6.0.0-rc.0 + + + +_Aug 22, 2024_ + +A big thanks to the 12 contributors who made this release possible. Here are some highlights ✨: + +- ⚡ Rendering performance improvements + +### `@mui/material@6.0.0-rc.0` + +#### Breaking changes + +- [Box] Remove `component` from `BoxOwnProps` (#43384) @DiegoAndai + + The `component` prop has been removed from the `BoxOwnProps` as it is already included in the `Box` type. + This might affect your code if you are using the `styled` function with the `Box` component. + If this is the case, use a `div` element instead of `Box`: + + ```diff + -const StyledBox = styled(Box)` + +const StyledDiv = styled('div')` + color: white; + `; + ``` + + This yields the same end result. + If this doesn't work for you, you can also cast the `styled` returned value to `typeof Box`: + + ```diff + const StyledBox = styled(Box)` + color: white; + -`; + +` as typeof Box; + ``` + +#### Changes + +- [ListItem] Remove unnecessary TypeScript test (#43359) @sai6855 +- Skip generating CSS variables for a custom spacing function (#43389) @siriwatknp +- Revert visual regressions from #42283 (#43364) @ZeeshanTamboli + +### `@mui/codemod@6.0.0-rc.0` + +- Add Grid2 to removeSystemProps codemod (#43302) @DiegoAndai + +### Docs + +- [blog] Add video to the Pigment CSS blog post (#42500) @oliviertassinari +- Fix broken link to milestones (#43379) @oliviertassinari +- Update CSS theme variables related content (#43130) @siriwatknp +- Fix link to createTheme source (#43332) @oliviertassinari +- Add cache to avoid unnecessary jsx dynamic import and theme getting (#43139) @Vxee +- Fix broken link to Next.js docs @oliviertassinari +- [material-ui] Revamp `Composition` guide (#43266) @ZeeshanTamboli +- [material-ui][Menu] Replace `PaperProps` with `slotProps.paper` in demos (#43354) @sai6855 + +### Core + +- [code-infra] Change docs:start script to serve the exports folder (#43375) @Janpot +- [core] Fix typescript-next CI workflow (#43394) @aarongarciah +- [core] Run `@mui/system` TypeScript module augmentation tests in CI (#43386) @ZeeshanTamboli +- [core] Enable manage-package-manager-versions pnpm flag (#43366) @aarongarciah +- [core] Replace `indexOf` with `includes` (#42883) @k-rajat19 +- [docs-infra] Add GitHub source link to components (#43228) @Jay-Karia +- [docs-infra] Fix copy shortcut (#43361) @oliviertassinari +- [perf] Remove theme/styling allocations (#43372) @romgrk +- [perf] Improve `composeClasses` (#43363) @romgrk +- [perf] Remove system allocations (#43306) @romgrk + +All contributors of this release in alphabetical order: @aarongarciah, @DiegoAndai, @Janpot, @Jay-Karia, @k-rajat19, @oliviertassinari, @rluzists1, @romgrk, @sai6855, @siriwatknp, @Vxee, @ZeeshanTamboli + ## 6.0.0-beta.6 @@ -1222,15134 +1428,6 @@ A big thanks to the 18 contributors who made this release possible. Here are som All contributors of this release in alphabetical order: @aacevski, @brijeshb42, @cherniavskii, @cipherlogs, @danilo-leal, @DiegoAndai, @harry-whorlow, @Janpot, @joserodolfofreitas, @michael-land, @michaldudak, @mnajdova, @nekoya, @sai6855, @siriwatknp, @StylesTrip, @zanivan, @ZeeshanTamboli -## 5.16.4 - - - -_Jul 16, 2024_ - -A big thanks to the 1 contributor who made this release possible. - -### `@mui/material@5.16.4` - -- ​Fix wrong import in Popover types (#42967) @mnajdova - -All contributors of this release in alphabetical order: @mnajdova - -## 5.16.3 - - - -_Jul 16, 2024_ - -A big thanks to the 3 contributors who made this release possible. - -### `@mui/material@5.16.3` - -- ​[material] Add missing dependency (#42959) @mnajdova - -### Docs - -- ​[material-ui][Autocomplete] Add instructions about `autosuggest-highlight` dependency (#42953) @HoFa1997 -- ​Move feedback from Canny to GitHub @oliviertassinari - -All contributors of this release in alphabetical order: @HoFa1997, @mnajdova, @oliviertassinari - -## 5.16.2 - - - -_Jul 16, 2024_ - -A big thanks to the 2 contributors who made this release possible. - -### `@mui/material@5.16.2` - -- ​[material] Remove dependency to @mui/base (@mnajdova) (#42917) @mnajdova - -### Core - -- ​[website] Sync /about page @oliviertassinari - -All contributors of this release in alphabetical order: @mnajdova, @oliviertassinari - -## 5.16.1 - -_Jul 11, 2024_ - -A big thanks to the 4 contributors who made this release possible. Here are some highlights ✨: - -- ⚛️ All packages, including Material UI, are now compatible with React 18.3.1 - -### `@mui/material@5.16.1` - -- [AppBar] Fix inherit color is inconsistent between ThemeProvider and CssVarsProvider (#42713) @ZeeshanTamboli - -### `@mui/joy@5.0.0-beta.48` - -- [Autocomplete] Fix React spread key warning (#42856) @aarongarciah - -### Docs - -- [material-ui] Fix React 18.3 key spread warnings in Autocomplete demos (#42854) @aarongarciah -- [material-ui] Fix type error in virtualized table demo (#42852) @aarongarciah -- Fix typos (@omahs) (#42888) @omahs -- Fix 301 @oliviertassinari - -### Core - -- [core] Bump React to 18.3.1 (#42846) @aarongarciah -- [core] Remove react-test-renderer (#42853) @aarongarciah -- [core] Replace enzyme in describeConformance (#42847) @aarongarciah -- [test] Remove enzyme (#42850) @aarongarciah -- [test] Remove createMount test util (#42849) @aarongarciah -- [base-ui] Fix React spread key warning in test (#42855) @aarongarciah -- [styles][withStyles] Expect React defaultProps warning in test (#42752) (#42851) @aarongarciah - -All contributors of this release in alphabetical order: @aarongarciah, @oliviertassinari, @omahs, @ZeeshanTamboli - -## 5.16.0 - - - -_Jul 5, 2024_ - -A big thanks to the 5 contributors who made this release possible. Here are some highlights ✨: - -- 🚀 Added `InitColorSchemeScript` for Next.js App Router (#42829) @siriwatknp - -### `@mui/material@5.16.0` - -- [Alert] Add ability to override slot props (@alexey-kozlenkov) (#42808) @alexey-kozlenkov -- Add `InitColorSchemeScript` for Next.js App Router (#42829) @siriwatknp -- Add `DefaultPropsProvider` (#42820) @siriwatknp -- Support `CssVarsTheme` in `responsiveFontSizes` return type (@jxdp) (#42806) @jxdp -- Remove warning from `getInitColorSchemeScript` (#42838) @siriwatknp - -### Docs - -- [docs] Fix 301 MDN redirections @oliviertassinari - -### Core - -- [mui-utils][test] Remove usages of deprecated react-dom APIs (@aarongarciah) (#42813) @aarongarciah - -All contributors of this release in alphabetical order: @aarongarciah, @alexey-kozlenkov, @jxdp, @oliviertassinari, @siriwatknp - -## 5.15.21 - - - -_Jun 28, 2024_ - -A big thanks to the 7 contributors who made this release possible. - -### `@mui/material@5.15.21` - -- [Autocomplete] Fix renderOption props type (@DiegoAndai) (#42709) @DiegoAndai -- [Stepper] Generate class for `nonLinear` prop (@alexismo) (#42677) @alexismo - -### Docs - -- Use new email for sponsoring @oliviertassinari -- Fix 301 links (@alexfauquette) (#42700) @alexfauquette -- [material-ui][Select] Fix the `SelectAutoWidth` demo menu item value (@Danielkhakbaz) (#42696) @Danielkhakbaz -- [material-ui][Autocomplete] Fix more React 18.3 key spread warnings in demos (#42766) @wbt -- [material-ui] Fix sign in side image (#42708) @zanivan -- [website] Add Ale to team (#42769) @alelthomas - -### Core - -- [core] Cherry pick pnpm updates (#42763) @DiegoAndai -- [website] Add Armin to the team members (@arminmeh) (#42681) @arminmeh -- [website] Open Staff Engineer role for Pigment CSS (@mnajdova) (#42669) @mnajdova - -All contributors of this release in alphabetical order: @alexfauquette, @alexismo, @arminmeh, @Danielkhakbaz, @DiegoAndai, @mnajdova, @oliviertassinari - -## 5.15.20 - - - -_Jun 12, 2024_ - -A big thanks to the 9 contributors who made this release possible. - -### `@mui/material@5.15.20` - -- ​[Autocomplete] Shouldn't resize when hovering (@ZeeshanTamboli) (#42535) @ZeeshanTamboli -- ​[Tab] Fix applying `iconWrapper` styles from theme and update its description (@sai6855) (#42570) @sai6855 - -### `@mui/utils@5.15.15` - -- ​Allow passing `NaN` as `defaultValue` to `useControlled` (@iammminzzy) (#42571) @iammminzzy -- ​Fix GitHub-reported prototype pollution vulnerability in `deepmerge` (#41652) (#42608) @DiegoAndai - -### Docs - -- ​[docs] Add Pigment CSS and Base UI logos SVGs (#42513) @danilo-leal -- ​[docs] Update twitter.com to x.com @oliviertassinari -- ​[docs] Simplify Example projects page @oliviertassinari -- ​[material-ui] Add docs for complementary stepper components (@anle9650) (#42613) @anle9650 -- ​[docs] Add changelog section to the design kits page (@danilo-leal) (#42463) @danilo-leal -- ​[material-ui] Fix sentence in the All components page (@danilo-leal) (#42462) @danilo-leal -- ​[material-ui] Update Figma design kit doc redirect link (@danilo-leal) (#42456) @danilo-leal -- ​[system] Add "dynamic values" section to sx prop page (@aarongarciah) (#42453) @aarongarciah - -### Core - -- ​[website] Move the `React Engineer - X` role to future roles (#42532) @DanailH -- ​[examples] Remove Pigment CSS examples (#42538) @sai6855 -- ​[website] Close Developer Advocate / Content Engineer role @oliviertassinari -- ​[website] Update DoiT description and link in Sponsors section (@erezstmn-doit) (#42511) @erezstmn-doit -- ​[website] Clean up the docs-infra job ad (@danilo-leal) (#42509) @danilo-leal -- ​[website] Open the Docs-infra engineer role (@danilo-leal) (#42496) @danilo-leal -- ​[website] Fix locationCountry in about page @oliviertassinari - -All contributors of this release in alphabetical order: @aarongarciah, @anle9650, @DanailH, @danilo-leal, @erezstmn-doit, @iammminzzy, @oliviertassinari, @sai6855, @ZeeshanTamboli - -## 5.15.19 - - - -_May 29, 2024_ - -A big thanks to the 12 contributors who made this release possible. -This release was mostly about 🐛 bug fixes and 📚 documentation improvements. - -### `@mui/material@5.15.19` - -- ​[AlertTitle] Enable extending Typography props (@lucasgmelo) (#42334) @github-actions[bot] -- ​[responsiveFontSizes] Handled undefined variants (@brijeshb42) (#42419) @github-actions[bot] -- ​[Slider] Fix wrong CSS value (@mnajdova) (#42373) @github-actions[bot] - -### Docs - -- ​Link to pnpm installation docs (#42420) @aarongarciah -- ​Remove LocalMonero (@oliviertassinari) (#42315) @github-actions[bot] -- ​[material-ui] Fix typo in style interoperability with Tailwind CSS docs (@ZeeshanTamboli) (#42312) @github-actions[bot] -- ​[material-ui][Pagination] Clarify pagination `page` prop API (@Mandar-Pandya) (#42265) @github-actions[bot] -- ​[material-ui][Tabs] Improve the Basic Tabs demo (@MatheusEli) (#42426) @github-actions[bot] -- ​[pigment-css] Fix duplication of content (#42410) @oliviertassinari - -### Core - -- ​[blog] Add the "Product" tag to the Pigment CSS post (@danilo-leal) (#42366) @github-actions[bot] -- ​[blog] Update blog post OG image (@danilo-leal) (#42306) @github-actions[bot] -- ​[blog] Update Pigment CSS post (@danilo-leal) (#42267) @github-actions[bot] -- ​[core] Fix React 18.3 warnings about spreading keys in the Material UI `Autocomplete` component (#42099) (#42241) @DiegoAndai -- ​[core] Fix a few more key spread issues (@oliviertassinari) (#42318) @github-actions[bot] -- ​[docs-infra] Allow JSDoc tags (#42327) @aarongarciah -- ​[website] Add Nikita to the about page (@nikitaa24) (#42421) @github-actions[bot] -- ​[website] Fix hero spacing changes applying at the wrong breakpoint (@KenanYusuf) (#42357) @github-actions[bot] -- ​[website] Adds Kenan Yusuf to about page (@KenanYusuf) (#42330) @github-actions[bot] -- ​[website] Improve about page @oliviertassinari - -All contributors of this release in alphabetical order: @aarongarciah, @brijeshb42, @danilo-leal, @DiegoAndai, @KenanYusuf, @lucasgmelo, @Mandar-Pandya, @MatheusEli, @mnajdova, @nikitaa24, @oliviertassinari, @ZeeshanTamboli - -## 5.15.18 - - - -_May 14, 2024_ - -A big thanks to the 5 contributors who made this release possible. Here are some highlights ✨: - -### `@mui/material@5.15.18` - -- ​[Autocomplete] Improve design when there's a start adornment for small autocomplete (@TahaRhidouani) (#42176) @github-actions[bot] -- ​[ToggleButtonGroup] Add missing `selected` class in ToggleButtonGroupClasses type (@tarunrajput) (#42250) @github-actions[bot] - -### Docs - -- ​[docs] Fix 301 to Figma @oliviertassinari - -### Core - -- ​[blog] Introducing Pigment CSS blog post (#42198) (#42255) @samuelsycamore -- ​[website] Add redirection for talk @oliviertassinari -- ​[website] Adds Arthur Balduini team info (@arthurbalduini) (#42226) @github-actions[bot] - -All contributors of this release in alphabetical order: @arthurbalduini, @oliviertassinari, @samuelsycamore, @TahaRhidouani, @tarunrajput - -## 5.15.17 - - - -_May 8, 2024_ - -A big thanks to the 4 contributors who made this release possible. -This release was mostly about 🐛 bug fixes and 📚 documentation improvements. - -### `@mui/material@5.15.17` - -- [Slider] Move palette styles to the bottom (#41676) @siriwatknp - -### Docs - -- Fix SEO redirection issues @oliviertassinari -- [material-ui] Fix broken link (@aarongarciah) (#42143) @github-actions[bot] -- [material-ui] Fix link on the Sync page (@danilo-leal) (#42089) @github-actions[bot] - -### Core - -- [blog] Shorten title to fit @oliviertassinari -- [blog] Update Sync post OG image (@danilo-leal) (#42117) @github-actions[bot] -- [blog] A few tweaks in introducing-sync-plugin (@oliviertassinari) (#42094) @github-actions[bot] -- [docs-infra] Fix code block layout shift (#41917) @oliviertassinari -- [website] Fix home page slider's track position (@aarongarciah) (#42144) @github-actions[bot] -- [website] Closing the survey @oliviertassinari -- [website] Remove Survey banner from website and Core docs (#42104) @joserodolfofreitas - -All contributors of this release in alphabetical order: @github-actions[bot], @joserodolfofreitas, @oliviertassinari, @siriwatknp - -## 5.15.16 - - - -_May 1, 2024_ - -A big thanks to the 8 contributors who made this release possible. Here are some highlights ✨: -This release was mostly about 🐛 bug fixes and 📚 documentation improvements. - -### `@mui/material@5.15.16` - -- [material-ui][Dialog] Prevent onClick on the root element from being overwritten (@ryanburr) (#41914) @github-actions[bot] -- [material-ui][Select] Fix `muiName` property TypeScript error (@EyaOuenniche) (#41786) @github-actions[bot] -- —>[material-ui][l10n] Fix typo in is-IS locale (@magnimarels) (#41815) @github-actions[bot] - -### Docs - -- Fix small SEO issues @oliviertassinari -- Fix 301 Toolpad links @oliviertassinari -- Fix 301 Toolpad links @oliviertassinari -- Fix 301 image redirections @oliviertassinari -- Fix small SEO issues @oliviertassinari -- Fix 301 redirection @oliviertassinari -- Fix format git diff regression (#41882) @oliviertassinari -- Fix 301 links @oliviertassinari -- [material-ui] Fix import statement in migration guide (@sai6855) (#41864) @github-actions[bot] -- [material-ui] Update Figma plugin name (@danilo-leal) (#42057) @github-actions[bot] -- [material-ui] Fix minor spelling error in the "About the lab" page (@ryanhartwig) (#42075) @github-actions[bot] -- [material-ui] Add missing backticks to HTML tag in the installation page (@Miguelrom) (#42009) @github-actions[bot] -- [material-ui] Add Connect-related content (@danilo-leal) (#41924) @DiegoAndai -- [material-ui] Fix Material 3 message typo (@aarongarciah) (#41822) @github-actions[bot] -- [material-ui] Remove Data Grid v7 beta callout (@cherniavskii) (#41842) @github-actions[bot] -- [material-ui][templates] Fix input props attributes in Landing Page template (@5-tom) (#42034) @github-actions[bot] -- [system] Update typo on the sx prop page (@bricker) (#42078) @github-actions[bot] - -### Core - -- [blog] Add post to introduce the Connect plugin (@danilo-leal) (#41929) @DiegoAndai -- [core] Automate cherry-pick of PRs from `next` -> `master` (#41742) @aarongarciah -- [docs-infra] Improve Twitter OG:image (#41860) @oliviertassinari -- [docs-infra] Use edge function for card generation (#41188) @alexfauquette -- [docs-infra] Fix drawer performances (#41807) (#41820) @alexfauquette -- [docs-infra] Fix analytics about inline ads (#41474) @alexfauquette -- [website] Sync career roles (@oliviertassinari) (#42059) @github-actions[bot] -- [website] Add content about the Sync plugin in the Material UI page (@danilo-leal) (#42074) @github-actions[bot] -- [website] Add Nadja on the about page (#42054) @mnajdova -- [website] Close the `Design Engineer - X` role (#42014) @DanailH -- [website] Remove customer support agent role from website (@rluzists1) (#41996) @github-actions[bot] -- [website] Add Jose to About Us (#41759) @JCQuintas - -All contributors of this release in alphabetical order: @aarongarciah, @alexfauquette, @DanailH, @DiegoAndai, @github-actions[bot], @JCQuintas, @mnajdova, @oliviertassinari - -## 5.15.15 - - - -_Apr 4, 2024_ - -A big thanks to the 7 contributors who made this release possible. Here are some highlights ✨: -This release was mostly about 🐛 bug fixes and 📚 documentation improvements. - -### `@mui/material@5.15.15` - -- [Autocomplete] Display options provided to the `options` prop even if loading is true (#41677) @ZeeshanTamboli -- [RadioGroup] Apply classnames (#41681) @ZeeshanTamboli - -### `@mui/system@5.15.15` - -- Fix typo to avoid infinite recursion in function call (#41678) @ZeeshanTamboli - -### Docs - -- [material-ui][Slider] Remove `valueLabelFormat` from restricted values demo so that the tooltip thumb label displays the same as the value text (#41679) @ZeeshanTamboli -- [material-ui] Remove deleted page from the sidenav (#41594) @danilo-leal -- [material-ui] Fix typo in CSS theme variables customization (#41680) @ZeeshanTamboli -- Continue migration of Base UI to sperate repository @oliviertassinari -- Add notification for MUI X v7 blog post (#41587) (#41605) @cherniavskii -- Update the versions dropdown to show v6 (#41557) @mnajdova - -### Core - -- [blog] Link to Romain's blog post in MUI X v7 announcement post (#41641) @cherniavskii -- [blog] Blog post with MUI X v7.0.0 annoucement (#41563) (#41604) @cherniavskii -- [blog] Add post about remote (#41565) @danilo-leal -- [core] Continue rename of Toolpad @oliviertassinari -- [docs-infra] Add Toolpad product/category IDs to types (#41551) @bharatkashyap -- [website] Add Aarón to About Us (#41747) @aarongarciah -- [website] Add stray design adjustments throughout the site (#41642) @mnajdova -- [website] Update pricing table (#41606) @cherniavskii - -All contributors of this release in alphabetical order: @aarongarciah, @bharatkashyap, @cherniavskii, @danilo-leal, @mnajdova, @oliviertassinari, @ZeeshanTamboli - -## 5.15.14 - - - -_Mar 18, 2024_ - -A big thanks to the 15 contributors who made this release possible. -This release was mostly about 🐛 bug fixes and 📚 documentation improvements. - -### `@mui/material@5.15.14` - -- [Accordion] Convert to support CSS extraction (#41221) @mnajdova -- ​[Autocomplete] Convert to support CSS extraction (#40330) @mnajdova -- ​[Slider] Convert to support CSS extraction (#41201) @mnajdova -- ​[Select] Fix variant type (#41405) @sai6855 -- ​[typescript] Use interface instead of type for props (#41500) @siriwatknp - -### `@pigment-css/react@0.0.3` - -- ​Add Box component (#41451) @brijeshb42 - -### `pigment-css/nextjs-plugin@0.0.3` - -- ​Fix alias resolver (#41494) @brijeshb42 -- ​Follow-up to #41494 (#41502) @brijeshb42 - -### Docs - -- ​[joy-ui] Add UI improvements to the side navigation demo (#41461) @cipherlogs -- ​[pigment-css] Add media query guide (#41473) @siriwatknp -- ​[pigment-css] Fixing location of the ExtendTheme type in the docs (#41499) @jherr -- ​[material-ui][Progress] Add Circular progress gradient demo from Github comment (#40559) @DiegoAndai - -### Core - -- ​[blog] Bringing consistency to Material UI customization APIs (#41040) @DiegoAndai -- ​[code-infra] Rename @mui-internal/docs-utils to @mui/internal-docs-utils (#41498) @michaldudak -- ​[code-infra] Copy translations.json to @mui/docs build folder (#41472) @Janpot -- ​[core] Use Circle CI context (#41532) @oliviertassinari -- ​[core] Fix CHANGELOG format and update date (#41481) @DiegoAndai -- ​[docs] Fix useStorageState regressions (#41223) @Janpot -- ​[docs] Fix some Vale errors (#41516) @oliviertassinari -- ​[material-ui][docs] Fix landing page template's h1 size (#41543) @zanivan -- ​[material-ui][docs] Apply new code header docs feature (#41508) @danilo-leal -- ​[material-next] Drop the package (#41544) @mnajdova -- ​[docs-infra] Fail CI on Vale error (#40944) @oliviertassinari -- ​[docs-infra] Improve Vale config @oliviertassinari -- ​[docs-infra] Add a feature list "component" (#41484) @danilo-leal -- ​[docs-infra] Add code block header classes (#41487) @danilo-leal -- ​[docs-infra] Make the Algolia search input label invisible (#41542) @danilo-leal -- ​[website] Improve navbar's items hover state (#41535) @EyaOuenniche -- ​[website] Split Toolpad documentation (#41316) @bharatkashyap -- ​[website] Use MUI X Data Grid v7-beta (#41276) @cherniavskii - -All contributors of this release in alphabetical order: @bharatkashyap, @brijeshb42, @cherniavskii, @cipherlogs, @danilo-leal, @DiegoAndai, @EyaOuenniche, @Janpot, @jherr, @michaldudak, @mnajdova, @oliviertassinari, @sai6855, @siriwatknp, @zanivan - -## 5.15.13 - - - -_Mar 13, 2024_ - -A big thanks to the 18 contributors who made this release possible. Here are some highights ✨ - -- The Material UI free Checkout template got a design uplift (#41447) @zanivan - -### `@mui/material@5.15.13` - -- [Alert] Add `slots` and `slotProps` type to theme (#41324) @sai6855 -- [Autocomplete] Fix the options list being added to the DOM in `freeSolo` mode even when there are no options, causing style problems (#41300) @rakeshmusturi -- Add `paperChannel` token (#41447) @siriwatknp -- [Switch] Convert to support CSS extraction (#41367) @alexfauquette -- [Tooltip] Support event handlers with extra parameters (#41320) @LukasTy - -### `@mui/system@5.15.13` - -- [RtlProvider] Add component & hook (#41241) @mnajdova - -### `@mui/utils@5.15.13` - -- [utils] Fix visually hidden styles' margin unit (#41477) @michaldudak - -### `@mui/codemod@5.15.13` - -- Fix merging of slotProps and componentProps (#41323) @sai6855 - -### `@mui/base@5.0.0-beta.39` - -- [material-ui][joy-ui][Autocomplete] Keep in sync highlighted index when the option still exists (#41306) @CGNonofr -- [FormControl] Export `FormControlOwnerState` type from index (#41287) @michaeldfoley -- [material-ui][TextareaAutosize] Fix inline style not getting applied (#41369) @ZeeshanTamboli - -### `@pigment-css/react@0.0.2` - -- Handle more scenarios while transforming sx prop (#41372) @brijeshb42 -- Improve testing of fixtures (#41389) @brijeshb42 -- Fix `keyframes` serialize styles error (#41395) @siriwatknp -- Use class selector instead of class value (#41442) @brijeshb42 -- [next] Warn about unsupported turbo mode in Next.js (#41445) @brijeshb42 - -### Docs - -- [material-ui] Refine checkout template (#40967) @zanivan -- [material-ui] Add docs for complementary List components (#41329) @anle9650 -- [material-ui] Add docs for complementary Dialog components (#41313) @jwithington -- [material-ui] Fix Templates live preview link (#41467) @danilo-leal -- [material-ui] Polish out the templates page (#41468) @zanivan -- [material-ui] Adjust the Templates card design (#41450) @danilo-leal -- [joy-ui] Remove unnecessary styles in color inversion footer demo (#41419) @cipherlogs -- [joy-ui] Update case studies chip background color (#41413) @cipherlogs -- [joy-ui] Remove wrong CSS prop from the Sign-in-side template (#41383) @cipherlogs -- [joy-ui] Fix broken link on the Color Inversion page (#41407) @cipherlogs -- [pigment] Add example and guide section (#41249) @siriwatknp -- [pigment-css] Brand name nonbreaking space (#41438) @oliviertassinari -- [pigment-css] Fix import on the README (#41411) @danilo-leal -- [pigment-css] Edit starter template links on README (#41409) @danilo-leal -- [pigment-css] Tweak the examples and edit READMEs (#41408) @danilo-leal -- [pigment-css] Adjust the bit about CSS vars on the README (#41463) @danilo-leal -- Finish brand name fixes #41438 @oliviertassinari -- Remove noreferrer @oliviertassinari -- Fix v4 docs `` appearing in notifications (#41390) @peterwangsc -- Update GitHub project links (#41370) @danilo-leal - -### Core - -- [pigment] Make all Pigment CSS packages public (#41404) @brijeshb42 -- [pigment] Rename directories to match package names (#41453) @brijeshb42 -- [pigment-css] Example fix leading spaces (#41439) @oliviertassinari -- [code-infra] Add short note about e2e-website workflow schedule (#41355) @Janpot -- [code-infra] Add alias for icon types (#41248) @Janpot -- [code-infra] Reduce concurrency of typescript:ci further (#41392) @Janpot -- [code-infra] Reduce concurrency for test_types ci job (#41385) @Janpot -- [code-infra] Adapt API code generator to Base UI repo needs (#41475) @michaldudak -- [docs-infra] Don't generate preview files for the templates (#41379) @mnajdova -- [docs-infra] Fix Pigment CSS apps path in the render mui demos script (#41476) @mnajdova -- [docs-infra] move feedback to ESM (#41381) @alexfauquette -- [docs-infra] Improve color contrast throughout (#41387) @danilo-leal -- [docs-infra] Simplify Algolia crawler config (#41312) @oliviertassinari -- [docs-infra] Adjust the tabs and layout selection design (#41084) @danilo-leal -- [blog] Update the Base UI post with links to dedicated repo (#41358) @danilo-leal -- [website] Update the Careers page role (#41384) @danilo-leal -- [website] Compress about images @oliviertassinari -- [website] Improve color contrast on the homepage (#41465) @danilo-leal -- [examples] Add pigment-css-vite-ts starter example (#41196) @siriwatknp -- [examples] Add pigment-css-nextjs-ts starter project (#41105) @siriwatknp - -All contributors of this release in alphabetical order: @alexfauquette, @anle9650, @brijeshb42, @CGNonofr, @cipherlogs, @danilo-leal, @jwithington, @Janpot, @michaeldfoley, @michaldudak, @mnajdova, @oliviertassinari, @peterwangsc, @rakeshmusturi, @sai6855, @siriwatknp, @zanivan, @ZeeshanTamboli - -## 5.15.12 - - - -_Mar 5, 2024_ - -A big thanks to the 21 contributors who made this release possible. -This release was mostly about 🐛 bug fixes and 📚 documentation improvements. - -### `@pigment-css/react@0.0.1`, `@pigment-css/nextjs-plugin@0.0.1`, `@pigment-css/vite-plugin@0.0.1`, & `@pigment-css/unplugin@0.0.1` - -- This is the first public release of our new zero-runtime CSS-in-JS library, Pigment CSS. - -### `@mui/material@5.15.12` - -- ​Support props callback type in theme variants (#40946) @ZeeshanTamboli -- ​[Alert] Convert to support zero runtime (#41230) @siriwatknp -- ​[Alert] Deprecate composed classes (#40688) @DiegoAndai -- ​[Button] Deprecate classes for v6 (#40675) @sai6855 -- ​[Checkbox] `large` size added in type (#34909) @smox -- ​[Chip] Deprecate composed classes (#41235) @sai6855 -- ​[Chip] Correct `deleteIconColorPrimary` and `deleteIconColorSecondary` class descriptions (#41231) @sai6855 -- ​Remove unused dev dependency on @mui/lab (#41198) @brijeshb42 -- ​[Slider] Deprecate components and componentProps props for v6 (#40777) @lhilgert9 - -### `@mui/system@5.15.12` - -- ​[pigment-css][material-ui] Render badge demos (#41353) @siriwatknp -- ​[pigment-css] Update to latest wyw version (#41363) @brijeshb42 -- ​[pigment-css] Rename scope to @pigment-css (#41354) @brijeshb42 -- ​[pigment-css] Rename zero-runtime to pigmentcss (#41317) @brijeshb42 -- ​Fix createSpacing return type (#41318) @matystroia -- ​[zero] Add support for styled tagged-template literals (#41268) @brijeshb42 -- ​[zero] Set up Material UI migration demos (#41267) @siriwatknp -- ​[zero] Move extendTheme to already existing @mui/zero-runtime/utils (#41254) @brijeshb42 -- ​[zero] Remove `object` intersection from CSS Fallback (#41271) @siriwatknp -- ​[zero] Minor wording changes in README (#41253) @brijeshb42 -- ​[zero] Prepare zero-runtime packages for public release (#41226) @brijeshb42 - -### `@mui/joy@5.0.0-beta.30` - -- ​[joy-ui][Autocomplete] Fix text overflow in Chip (#40229) @PunitSoniME - -### Docs - -- ​[base-ui] Update the docs post repo separation (#41328) @danilo-leal -- ​Fix missing partner link @oliviertassinari -- ​Update links to GitHub projects (#41297) @danilo-leal -- ​Standardize WAI-ARIA referencest @oliviertassinari -- ​Fix image layout shift when loading @oliviertassinari -- ​[joy-ui] Add stray adjustments throughout the docs (#41211) @danilo-leal -- ​[material-ui] Remove duplicated text at FAQ page (#41326) @zanivan -- ​[material-ui] Fix color mode toggle of the landing page template (#41293) @zanivan -- ​[system] Tweak the Usage demos (#41242) @danilo-leal -- ​[zero] Add a Why section on the README (#41284) @danilo-leal - -### Core - -- ​Revert "[utils] Port `useLocalStorageState` hook from Toolpad (#41096)" @oliviertassinari -- ​[blog] Add post about how MUI uses Toolpad (#40172) @prakhargupta1 -- ​[blog] No bundled demos in blog posts @oliviertassinari -- ​[code-infra] Embed translations in the @mui/docs package (#41246) @Janpot -- ​[code-infra] Prepare the markdown package for publishing (#41240) @michaldudak -- ​[code-infra] Unpin the version of docs-utils in scripts (#41232) @michaldudak -- ​[core] Use runtime agnostic setTimeout type @oliviertassinari -- ​[core] Remove window. reference for common globals @oliviertassinari -- ​[core] Add a script to build all packages (#40631) @michaldudak -- ​[docs-infra] Fix missing non breaking spaces @oliviertassinari -- ​[docs-infra] Add design customizations to the disclosure element (#41285) @danilo-leal -- ​[docs-infra] Adjust headings dark mode color (#41292) @danilo-leal -- ​[docs-infra] Fix Stack Overflow breaking space @oliviertassinari -- ​[docs-infra] Fix product selector popup not closing on route change (#41166) @divyammadhok -- ​[docs-infra] Improve fix blank links ad @oliviertassinari -- ​[docs-infra] Support interfaces for X docs (#41069) @alexfauquette -- ​[infra] Adjust the links to search for issues (#41008) @michelengelen -- ​[website] Move the `React Engineer - xCharts` to `Next roles` section (#41368) @DanailH -- ​[website] Add James to About Us (#41362) @atomiks -- ​[website] Polish Button outline primary medium (#41298) @oliviertassinari -- ​[website] Remove Heatmap chart from community plan on pricing table (#41081) @alexfauquette - -All contributors of this release in alphabetical order: @alexfauquette, @atomiks, @brijeshb42, @DanailH, @danilo-leal, @DiegoAndai, @divyammadhok, @Janpot, @lhilgert9, @matystroia, @michaldudak, @michelengelen, @mj12albert, @oliviertassinari, @prakhargupta1, @PunitSoniME, @sai6855, @siriwatknp, @smox, @zanivan, @ZeeshanTamboli - -## 5.15.11 - - - -_Feb 21, 2024_ - -A big thanks to the 26 contributors who made this release possible. -This release was mostly about 🐛 bug fixes and 📚 documentation improvements. - -### `@mui/material@5.15.11` - -- [Alert] Deprecate components and componentsProps props (#40681) @DiegoAndai -- [Autocomplete] Caret transformation issue with font size change (#41066) @dpertsin -- [StepLabel] Add type for StepIconComponent (#41082) @harrydigos -- [TablePagination] Fix type error in Select props (#39137) @PaulKristoffersson -- [Transitions] External ownerState is incorrectly forwarded to inner components (#41187) @gitstart -- Use direct import (#40851) @siriwatknp - -### `@mui/material-nextjs@5.15.11` - -- Fix missing babel/runtime dependency in material-ui-nextjs (#41077) @siriwatknp - -### `@mui/system@5.15.11` - -- Use direct import (#40851) @siriwatknp -- Move useMediaQuery to system (#39463) @justintoman -- Consolidate the variants props callback arguments (#41222) @mnajdova -- Merge props and ownerState in the variants props callback (#41219) @mnajdova - -### `@mui/codemod@5.15.11` - -- [AccordionSummary] Add contentGutters deprecation codemods (#41006) @DiegoAndai -- [PaginationItem] Add codemod for deprecated classes (#41145) @sai6855 - -### `@mui/utils@5.15.11` - -- Port `useLocalStorageState` hook from Toolpad (#41096) @Janpot - -### `@mui/base@5.0.0-beta.37` - -- [Switch] Add missing role attribute (#40907) @KirankumarAmbati -- [TextareaAutosize] Improve implementation (#40789) @ZeeshanTamboli - -### `@mui/lab@5.0.0-alpha.164` - -- [Masonry] Ability to sort elements from left to right (#39904) @Rishi556 - -### Docs - -- [base-ui] Fix focus state demo in Base UI autocomplete (#41104) @oliviertassinari -- [base-ui] Update the Accessibility page demos design (#40995) @danilo-leal -- [joy-ui] Fix LinearProgressWithLabel example (#41194) @khgiddon -- [joy-ui] Fix 404 image on the docs @oliviertassinari -- [material-ui] Add a "start now" section on the Overview page (#41137) @danilo-leal -- [material-ui] Inform about deprecated TablePagination SelectProps usage (#41186) @gitstart -- [material-ui] Update the Testing page's Argos link (#41170) @gregberge -- [material-ui] Remove Masonry component and Material Design icon from the landing page template (#41080) @zanivan -- [material-ui] Standardize all references to Material Design 3 (M3) (#40903) @samuelsycamore -- [material-ui] Add stray fixes around a few pages (#41038) @danilo-leal -- [material-ui][joy-ui][system] Restore and revise the Box docs (#40622) @samuelsycamore -- [material-ui] Add simpler demo for default behavior (#40980) @zanivan -- [system] Explain why AppRouterCacheProvider (#40909) @oliviertassinari -- Link to react-transition group with https @oliviertassinari -- Update broken URL hashes (#41185) @LukasTy -- Prefer https links @oliviertassinari -- Fix MUI Treasury link @oliviertassinari -- Migrate the last > quotes to ::: callouts @oliviertassinari - -### Core - -- [blog] Add new product tags and stray adjustments (#41193) @danilo-leal -- [blog] Simplify `/base-ui-2024-plans/` page (#41171) @oliviertassinari -- [blog] Add link to Base UI API changes RFC (#41089) @michaldudak -- [blog] Remove the "News" tag (#41208) @danilo-leal -- [changelog] Remove @mui/system@5.15.10 (#41093) @michaldudak -- [code-infra] Move typescript-to-proptypes to internal-scripts package (#41079) @michaldudak -- [code-infra] Move Link to @mui/docs (#40889) @Janpot -- [code-infra] Use `experimental.cpus` to control amount of export workers in Next.js (#41132) @Janpot -- [code-infra] Load commonjs files in next.config.mjs with require (#41108) @Janpot -- [code-infra] Prepare babel macros package for publishing to npm (#41178) @michaldudak -- [code-infra] Build internal packages before publishing (#41210) @michaldudak -- [core] Improve the release instructions (#40973) @mnajdova -- [core] Simplify Next.js Demo Zero Runtime guide @oliviertassinari -- [core] Fix TypeScript spelling in changelog @oliviertassinari -- [core] Fix small detail in the autocomplete demo @oliviertassinari -- [core] Increase node memory limit on Netlify build (#41111) @michaldudak -- [core] Fix Netlify build cache issue (#43281) @LukasTy -- [core][Tooltip] Remove incorrect code comment (#41179) @ZeeshanTamboli -- [core] Fix missing context display names (#41168) @oliviertassinari -- [core][base-ui] Remove `@mui/base` dev dependency from Base UI workspace (#41216) @ZeeshanTamboli -- [zero][demo] Fix sample next app build (#41197) @brijeshb42 -- [docs-infra] Simplify copy logic (#41167) @oliviertassinari -- [docs-infra] New way of providing API layout config (#41106) @alexfauquette -- [docs-infra] Reduce scrollbar width on ROC (#41148) @oliviertassinari -- [docs-infra] Add external link arrow (#41129) @siriwatknp -- [docs-infra] Fix external link arrow (#41181) @alexfauquette -- [docs-infra] Flag npm and GitHub as wrong spellings @oliviertassinari -- [docs-infra] Fix display when the default props is undefined (#41114) @oliviertassinari -- [docs-infra] Remove random layout assignment (#40862) @alexfauquette -- [docs-infra] Add spacing and contrast improvements (#41191) @danilo-leal -- [docs-infra] Share vale-config (#41176) @alexfauquette -- [test] Generalize test utils (#41175) @michaldudak -- [typescript-to-proptypes] Support using `Omit` on types with conditional properties (#41033) @flaviendelangle -- [website] Match chart component names @oliviertassinari -- [website] Add Marblism diamond sponsor (#41097) @rluzists1 -- [website] Add overall improvements to the Material UI page (#41075) @danilo-leal -- [website] Fix responsive breakpoints @oliviertassinari -- [website] Fix overloading of footer JS files @oliviertassinari -- [website] Improve the footer's chip contrast (#41209) @danilo-leal -- [zero] Update to latest version of wyw-in-js (#41182) @brijeshb42 -- [zero] Setup basic testing framework (#40986) @brijeshb42 -- [zero] Fix wrong CSS order by moving import to last (#41002) @siriwatknp -- [zero] Export `extendTheme` for creating a zero-runtime theme (#40897) @siriwatknp -- [zero] Move extendTheme to its own subpath (#41204) @brijeshb42 - -All contributors of this release in alphabetical order: @alexfauquette, @brijeshb42, @danilo-leal, @DiegoAndai, @dpertsin, @flaviendelangle, @gitstart, @gregberge, @harrydigos, @Janpot, @justintoman, @khgiddon, @KirankumarAmbati, @LukasTy, @michaldudak, @mnajdova, @nikosgavalas, @oliviertassinari, @PaulKristoffersson, @Rishi556, @rluzists1, @sai6855, @samuelsycamore, @siriwatknp, @zanivan, @ZeeshanTamboli - -## 5.15.10 - - - -_Feb 12, 2024_ - -A big thanks to the 8 contributors who made this release possible. -This release was mostly about 🐛 bug fixes and 📚 documentation improvements. - -### `@mui/material@5.15.10` - -- [Avatar] Add props deprecation with a codemod (#40853) @siriwatknp - -### `@mui/joy@5.0.0-beta.28` - -- [Button] Fix `disabled` prop priority when inside button group (#41000) @Smileek -- [IconButton] Support loading prop (#40949) @Smileek - -### Docs - -- [Button][material-ui] Fix 'File upload' demo a11y (#40943) @oliviertassinari -- [TableRow][material-ui] Escape markup in `children` prop so docgen tools don't parse it as HTML (#40992) @millerized -- [material-ui] Remove outdated example projects link (it uses Joy UI now) (#40913) @oliviertassinari -- [material-ui] Fix the "Intro to the MUI ecosystem" link placement (#40988) @danilo-leal -- Fix 301 redirection to StackBlitz @oliviertassinari -- Fix h1 on Joy UI templates @oliviertassinari -- Have MUI workspace own the CodeSandbox @oliviertassinari -- Add notification for MUI X v7 beta (#41001) @joserodolfofreitas -- Fix 301 links @oliviertassinari -- Fix Next.js v13.5.1 SEO regression (#40302) @oliviertassinari -- Add a 404 page (#40884) @danilo-leal -- Fix missing GitHub label when opening new issue @oliviertassinari -- [Stack] Update import statement for Stack component (#41032) @sai6855 - -### Core - -- [blog] Add post about upcoming plans for Base UI (#40882) @danilo-leal -- [core] Simplify CodeSandbox reproduction @oliviertassinari -- [core] Missing redirection @oliviertassinari -- [core] Export functions from `copyFiles` script to reuse in MUI X repo (#40970) @cherniavskii -- [core] Avoid variable shorthands @oliviertassinari -- [docs-infra] Fix search icon issue (#40957) @oliviertassinari -- [docs-infra] Ignore classes tagged with `@ignore` (#41009) @cherniavskii -- [docs-infra] Fix selected tab on codeblocks (#41036) @danilo-leal -- [website] Polish Customer Support Agent role @oliviertassinari - -All contributors of this release in alphabetical order: @cherniavskii, @danilo-leal, @joserodolfofreitas, @millerized, @oliviertassinari, @sai6855, @siriwatknp, @Smileek - -## 5.15.9 - -<!-- generated comparing v5.15.8..master --> - -_Feb 8, 2024_ - -A big thanks to the 7 contributors who made this release possible. Here are some highlights ✨: - -- 🐛 A critical fix to remove non-published library usage in `@mui/material` peerDependencies. - -### `@mui/material@5.15.9` - -- ​<!-- 11 -->[autocomplete] Avoid spread operator (#40968) @oliviertassinari -- ​<!-- 05 -->[material] Remove zero-runtime from peer dep (#41003) @brijeshb42 - -### `@mui/base@5.0.0-beta.36` - -- ​<!-- 10 -->[base-ui] Update props using Array to ReadonlyArray type (#40754) @RaghavenderSingh - -### `@mui/system@5.15.9` - -- ​<!-- 02 -->[system] use `ReadonlyArray` for CSS related types (#40972) @siriwatknp -- ​<!-- 01 -->[zero] Migrate to use wyw-in-js instead of linaria (#40866) @brijeshb42 - -### Docs - -- ​<!-- 06 -->[docs] Polish codemod git diff format @oliviertassinari -- ​<!-- 05 -->[material-ui][docs] Migrating from deprecated apis follow up (#40981) @DiegoAndai - -### Core - -- ​<!-- 09 -->[code-infra] Move next config to ESM (#40869) @Janpot -- ​<!-- 08 -->[code-infra] Update prettier (#40772) @Janpot -- ​<!-- 07 -->[code-infra] Add codemod for `light` prop removal (#40947) @sai6855 - -All contributors of this release in alphabetical order: @brijeshb42, @DiegoAndai, @Janpot, @oliviertassinari, @RaghavenderSingh, @sai6855, @siriwatknp - -## 5.15.8 - -<!-- generated comparing v5.15.7..master --> - -_Feb 6, 2024_ - -A big thanks to the 17 contributors who made this release possible. Here are some highlights ✨: - -- 💫 Added a redesigned [landing page template](https://mui.com/material-ui/getting-started/templates/landing-page/) (#37557) @zanivan -- ✨ Added support for Arrow Down/Up + Shift and Page Up/Down keys for faster stepping in the Slider component (#40676) @mnajdova -- many 🐛 bug fixes and 📚 documentation improvements - -### `@mui/material@5.15.8` - -- ​<!-- 36 -->[Avatar] Simplify valid children assertion (#40834) @oliviertassinari - -### `@mui/codemod@5.15.8` - -- ​<!-- 37 -->[Accordion] Update props actual.js test case (#40879) @DiegoAndai -- ​<!-- 12 -->Fix `findComponentJSX` util (#40855) @sai6855 - -### `@mui/system@5.15.8` - -- ​<!-- 10 -->Add blend color manipulator (#40258) @romgrk -- ​<!-- 38 -->Support variants in `theme.styleOverrides` (#40690) @siriwatknp -- ​<!-- 02 -->[zero] Always replace the `createUseThemeProps` call (#40885) @siriwatknp -- ​<!-- 01 -->[zero] Add README with installation and basic usage (#40761) @brijeshb42 - -### `@mui/base@5.0.0-beta.34` - -- ​<!-- 35 -->[Button] Add support for `hostElementName` prop to improve SSR (#40507) @mj12albert -- ​<!-- 30 -->[Menu] Use Popup instead of Popper (#40731) @michaldudak -- ​<!-- 29 -->[useNumberInput] Integrate useNumberInput with useControllableReducer (#40206) @mj12albert -- ​<!-- 11 -->[Slider] Add support for Arrow Down/Up + Shift and Page Up/Down keys (#40676) @mnajdova - -### Docs - -- ​<!-- 34 -->[base-ui] Update usage.md (#40916) @adebiyial -- ​<!-- 33 -->[base-ui] Improve Base UI traffic from Material UI (#40875) @oliviertassinari -- ​<!-- 32 -->[base-ui] Change Radio component terminology from Button to Group (#40888) @danilo-leal -- ​<!-- 42 -->[base-ui] Remove redundant "Styled" prefix (#40478) @oliviertassinari -- ​<!-- 48 -->[base-ui] Update listbox slot style in demo (#40952) @sai6855 -- ​<!-- 14 -->[material-ui] Fix createTheme import and markdown format in the Next.js guide (#40895) @hsmtkk -- ​<!-- 13 -->[material-ui] Correct Google font CDN URL as Roboto 600 weight is not used (#40852) @xuhdev -- ​<!-- 14 -->[material-ui] Replace the Album template with a landing page (#37557) @zanivan -- ​<!-- 21 -->[material-ui] Add deprecations migration guide (#40767) @DiegoAndai -- ​<!-- 22 -->[material-ui] Improve aria-label throughout the Button Group demos (#40892) @danilo-leal -- ​<!-- 17 -->[joy-ui] Update the Overview callout (#40900) @danilo-leal -- ​<!-- 22 -->Fix image size and dark mode @oliviertassinari -- ​<!-- 21 -->Migrate links from legacy.reactjs.org to react.dev @oliviertassinari -- ​<!-- 20 -->Fix 301 links @oliviertassinari -- ​<!-- 19 -->Fix outdated link @oliviertassinari -- ​<!-- 18 -->Fix URL and typo in CONTRIBUTING.md (#40899) @Smileek - -### Core - -- ​<!-- 28 -->[blog] Optimize images for /blog/mui-x-v7-beta/ @oliviertassinari -- ​<!-- 27 -->[blog] Clarify barrel index tree-shaking @oliviertassinari -- ​<!-- 26 -->[code-infra] Simplify bug reproduction (#40833) @oliviertassinari -- ​<!-- 25 -->[code-infra] Prepare publishing @mui-internal/typescript-to-proptypes to npm (#40842) @michaldudak -- ​<!-- 40 -->[code-infra] Remove babel alias from the docs (#40792) @Janpot -- ​<!-- 24 -->[core] Use Google Font v2 API @oliviertassinari -- ​<!-- 23 -->[core] Add missing change to v5.15.7 changelog (#40872) @DiegoAndai -- ​<!-- 31 -->[core] Normalize `<meta name="viewport" />`` @oliviertassinari -- ​<!-- 28 -->[dependencies] Do not update envinfo test dependencies (#40950) @michaldudak -- ​<!-- 17 -->[docs-infra] Fix arbitrary gap between paragraphs in callouts (#40911) @oliviertassinari -- ​<!-- 16 -->[docs-infra] Allow developers to build their CodeSandbox export (#40878) @oliviertassinari -- ​<!-- 15 -->[docs-infra] Improve StackBlitz support (#40832) @oliviertassinari -- ​<!-- 21 -->[docs-infra] Improve support for absolute locale URL (#40940) @oliviertassinari -- ​<!-- 31 -->[Menu][base-ui] Fix improperly merged tests (#40896) @michaldudak -- ​<!-- 09 -->[utils] Use consistent build approach (#40837) @siriwatknp -- ​<!-- 08 -->[website] Fix React missing key console error @oliviertassinari -- ​<!-- 07 -->[website] Fix broken link @oliviertassinari -- ​<!-- 06 -->[website] Fix heading structure (#40912) @oliviertassinari -- ​<!-- 05 -->[website] Add Customer Support Agent role to careers page (#40890) @rluzists1 -- ​<!-- 04 -->[website] Refine the Material UI homepage demo (#40881) @danilo-leal -- ​<!-- 03 -->[website] Use em-dash when relevant over hyphen @oliviertassinari -- ​<!-- 03 -->[zero] Fix build for demo next.js app (#40854) @brijeshb42 - -All contributors of this release in alphabetical order: @adebiyial, @brijeshb42, @danilo-leal, @DiegoAndai, @hsmtkk, @Janpot, @michaldudak, @mj12albert, @mnajdova, @oliviertassinari, @rluzists1, @romgrk, @sai6855, @siriwatknp, @Smileek, @xuhdev, @zanivan - -## 5.15.7 - -<!-- generated comparing v5.15.6..master --> - -_Jan 31, 2024_ - -A big thanks to the 21 contributors who made this release possible. -This release was mostly about 🐛 bug fixes and 📚 documentation improvements. - -### `@mui/material@5.15.7` - -- ​<!-- 55 -->[Select] Fix to show notched outline when `displayEmpty` (#40865) @ZeeshanTamboli -- ​<!-- 51 -->[Avatar] Improve fallback when `children` is empty string or boolean (#40766) @mirus-ua -- ​<!-- 50 -->[AvatarGroup] Refactor component thereby fixing custom spacing logic (#40686) @ZeeshanTamboli - -### `@mui/codemod@5.15.7` - -- ​<!-- 38 -->Add accordion props deprecation (#40771) @siriwatknp - -### `@mui/system@5.15.7` - -- ​<!-- 56 -->[zero-runtime] Use lodash instead of its subpackages (#40868) @michaldudak -- ​<!-- 19 -->Add `applyStyles()` to theme (#40667) @siriwatknp -- ​<!-- 02 -->[zero] Use `theme.applyStyles` in the demo app (#40787) @siriwatknp -- ​<!-- 01 -->[zero] Add `useThemeProps` processor (#40648) @siriwatknp - -### `@mui/utils@5.15.7` - -- ​<!-- 16 -->[core] Remove unnecessary default export (#40788) @siriwatknp -- ​<!-- 15 -->[core] Convert all exports to modules (#39882) @mnajdova -- ​<!-- 20 -->[perf] Prevent unneeded `clearTimeout` calls (#39060) @romgrk - -### `@mui/base@5.0.0-beta.34` - -- ​<!-- 48 -->[Input] Add OTP input demo (#40539) @sai6855 -- ​<!-- 47 -->[Menu] Focus last item after opening a menu using up arrow (#40764) @Jaswanth-Sriram-Veturi -- ​<!-- 46 -->[Menu] Focus Menu Items on hover (#40755) @michaldudak - -### `@mui/joy@5.0.0-beta.25` - -- ​<!-- 22 -->Change the color scheme type to `SupportedColorScheme` (#40776) @Nikhilh26 - -### `@mui/lab@5.0.0-alpha.163` - -- ​<!-- 21 -->[TabContext] Support number type in `value` (#40829) @srinidhi9831 - -### Docs - -- ​<!-- 57 -->[material-ui] Fix the icon preview dialog (#40863) @danilo-leal -- ​<!-- 53 -->[material-ui] Fix typo on styled-components guide (#40858) @dancielos -- ​<!-- 49 -->[base-ui] Fix CSS vars from the plain CSS theme stylesheet (#40762) @zanivan -- ​<!-- 31 -->[material-ui][Divider] Remove light prop references from docs (#40782) @sai6855 -- ​<!-- 30 -->Fix build @oliviertassinari -- ​<!-- 29 -->Add support pages for each product @oliviertassinari -- ​<!-- 28 -->Add survey banner to docs and website (#40553) @joserodolfofreitas -- ​<!-- 24 -->[Menu] Fix hydration mismatch error on Base UI's Menu docs (#40758) @michaldudak -- ​<!-- 25 -->[material-nextjs] Add theming and configuration content to the page (#40626) @siriwatknp - -### Core - -- ​<!-- 54 -->[website] Move `React Engineer - X` into the future roles section (#40867) @DanailH -- ​<!-- 52 -->[material-ui][test][Alert] Add action, icon, and iconMapping tests (#40682) @DiegoAndai -- ​<!-- 45 -->[blog] Lint duplicate h1 on the page (#40835) @oliviertassinari -- ​<!-- 44 -->[blog] MUI X v7 beta announcement blogpost (#40784) @joserodolfofreitas -- ​<!-- 43 -->[code-infra] Remove custom TS installation script (#40636) @michaldudak -- ​<!-- 42 -->[code-infra] Correct API Docs Builder dependencies (#40775) @michaldudak -- ​<!-- 41 -->[code-infra] Migrate to prettier async APIs (#40668) @Janpot -- ​<!-- 40 -->[code-infra] Refined docs generation (#40603) @alexfauquette -- ​<!-- 39 -->[code-infra] Explain how to install the browsers (#40474) @oliviertassinari -- ​<!-- 37 -->`missingKeyGenerator` do no longer exist (#40830) @oliviertassinari -- ​<!-- 36 -->Rely on immutable ref when possible (#40831) @oliviertassinari -- ​<!-- 35 -->Remove deprecated `@types/markdown-to-jsx` package from docs (#40828) @ZeeshanTamboli -- ​<!-- 34 -->Remove unneeded `@slack/web-api` package (#40840) @ZeeshanTamboli -- ​<!-- 33 -->Clarify TODO instruction @oliviertassinari -- ​<!-- 32 -->Remove unneeded use-clients (#40663) @oliviertassinari -- ​<!-- 27 -->[docs-infra] Fix anchor link hook (#40836) @oliviertassinari -- ​<!-- 26 -->[docs-infra] Avoid layout shift on docs-pages (#40749) @oliviertassinari -- ​<!-- 23 -->[examples] Fix build on Next.js Pages Router examples (#40665) @oliviertassinari -- ​<!-- 18 -->[test] Speed up the envinfo test (#40669) @michaldudak -- ​<!-- 17 -->[typescript-to-proptypes] Allow to represent dates as `PropTypes.object` (#40774) @flaviendelangle -- ​<!-- 14 -->[website] Add new Base UI role (#40773) @colmtuite -- ​<!-- 13 -->[website] Fix a couple of rough edges (#40849) @danilo-leal -- ​<!-- 12 -->[website] Small polishing after latest changes to the theme (#40846) @zanivan -- ​<!-- 11 -->[website] Polish some pages and stray components (#40797) @danilo-leal -- ​<!-- 10 -->[website] Refine the careers page slightly (#40793) @danilo-leal -- ​<!-- 09 -->[website] Fix missing key on the Testimonials section (#40791) @Janpot -- ​<!-- 08 -->[website] Fix Footer layout shift (#40786) @oliviertassinari -- ​<!-- 07 -->[website] Revamp the testimonial section in the homepage (#40752) @danilo-leal -- ​<!-- 06 -->[website] Fix pricing license model toggle style (#40747) @oliviertassinari -- ​<!-- 05 -->[website] Fine-tune colors and styles on the branding theme (#40751) @danilo-leal -- ​<!-- 04 -->[website] Fix Toggle Button styles in the homepage demos (#40744) @mohamedsaiedd -- ​<!-- 03 -->[website] Update stats on the testimonials section (#40769) @EyaOuenniche - -All contributors of this release in alphabetical order: @alexfauquette, @colmtuite, @danilo-leal, @DiegoAndai, @EyaOuenniche, @flaviendelangle, @Janpot, @Jaswanth-Sriram-Veturi, @joserodolfofreitas, @michaldudak, @mirus-ua, @mnajdova, @mohamedsaiedd, @Nikhilh26, @oliviertassinari, @romgrk, @sai6855, @siriwatknp, @srinidhi9831, @zanivan, @ZeeshanTamboli - -## 5.15.6 - -<!-- generated comparing v5.15.5..master --> - -_Jan 22, 2024_ - -A big thanks to the 17 contributors who made this release possible. Here are some highlights ✨: -This release was mostly about 🐛 bug fixes and 📚 documentation improvements. - -### `@mui/material@5.15.6` - -- ​<!-- 29 -->[Avatar] Use variants api (#40324) @mnajdova -- ​<!-- 27 -->[TablePagination] Accept readonly array for `rowsPerPageOptions` prop (#40481) @pcorpet -- ​<!-- 06 -->[PaginationItem] Deprecate classes for v6 (#40673) @sai6855 -- ​<!-- 05 -->[Rating] Fix rating width via min-content (#40503) @devhik0 - -### `@mui/base@5.0.0-beta.33` - -- ​<!-- 26 -->[Select] Fix display of selected Options with rich content (#40689) @michaldudak -- ​<!-- 25 -->[Select] Use Popup instead of Popper (#40524) @michaldudak -- ​<!-- 26 -->[useMenuButton] Fix non native button triggers (#40645) @DiegoAndai - -### `@mui/system@5.15.6` - -- ​<!-- 02 -->[zero] Fix theme token import in source file (#40691) @brijeshb42 -- ​<!-- 01 -->[zero] Add support for css import (#40541) @brijeshb42 - -### `@mui/icons-material@5.15.6` - -- ​<!-- 07 -->[icons-material] Fix icons package.json version (#40655) @mj12albert - -### Docs - -- ​<!-- 28 -->[base-ui] Polish the Slider demos (#40332) @danilo-leal -- ​<!-- 24 -->[base-ui][Slider] Fix plain CSS demo's wrong keyboard behavior (#40652) @mnajdova -- ​<!-- 23 -->[base-ui][TextareaAutosize] Add border-box to demo (#40646) @ANUGLYPLUGIN -- ​<!-- 16 -->Fix brand name non-breaking space (#40701) @oliviertassinari -- ​<!-- 15 -->Improve error message for MUI Vale rule @oliviertassinari -- ​<!-- 14 -->Add notification to publish the survey (#40552) @joserodolfofreitas -- ​<!-- 04 -->[system] Explain a bit more how AppRouterCacheProvider works @oliviertassinari -- ​<!-- 12 -->[joy-ui] Move tutorial to iframe (#40567) @oliviertassinari -- ​<!-- 10 -->[material-ui][Slider] Remove custom divs from new demo (#40674) @zanivan -- ​<!-- 11 -->[material-ui] Improve TabContext, TabList, and TabPanel documentation (#40587) @anle9650 -- ​<!-- 09 -->[material-ui][Slider] Added custom mark labels demo (#40647) @DonikaV - -### Core - -- ​<!-- 30 -->[core] Fix RXDB-logo Url (#40724) @mohamedsaiedd -- ​<!-- 24 -->[code-infra] Improve proptypes-generation (#40617) @alexfauquette -- ​<!-- 22 -->[code-infra] Disable pnpm package cache on CircleCI (#40670) @michaldudak -- ​<!-- 21 -->[code-infra] Add missing package to CodeSandbox CI config (#40657) @michaldudak -- ​<!-- 20 -->[code-infra] Remove unnecessary @mui/utils dependency from api-docs-builder (#40632) @michaldudak -- ​<!-- 19 -->[core] Polish issue templates @oliviertassinari -- ​<!-- 13 -->[docs-infra] Support markdown link in slots descriptions (#40679) @alexfauquette -- ​<!-- 08 -->[examples] Simplify Next.js example (#40661) @oliviertassinari -- ​<!-- 03 -->[website] Fix broken styles on Base UI page (#40683) @michaldudak - -All contributors of this release in alphabetical order: @alexfauquette, @anle9650, @ANUGLYPLUGIN, @brijeshb42, @danilo-leal, @devhik0, @DiegoAndai, @DonikaV, @joserodolfofreitas, @michaldudak, @mj12albert, @mnajdova, @mohamedsaiedd, @oliviertassinari, @pcorpet, @sai6855, @zanivan - -## 5.15.5 - -<!-- generated comparing v5.15.4..master --> - -_Jan 17, 2024_ - -A big thanks to the 18 contributors who made this release possible. Here are some highlights ✨: - -- Base UI's CSS class prefix is now `base-` (#40205) @michaldudak -- Bug fixes, and a lot of improvements to code and docs infra - -### `@mui/material@5.15.5` - -- ​<!-- 42 -->[Accordion] Deprecate \*Props props and classes for v6 (#40418) @DiegoAndai -- ​<!-- 41 -->[Alert] Update TypeScript types to allow color override types to be added to `iconMapping` and `severity` props (#40551) @2metres -- ​<!-- 27 -->[Dialog] Remove deprecated onBackdropClick from Dialog tests (#40505) @sai6855 -- ​<!-- 26 -->[Divider] Deprecate props and classes for v6 (#40563) @sai6855 - -### `@mui/material-next@6.0.0-alpha.118` - -- ​<!-- 36 -->[ButtonGroup] Apply MD3 style to `ButtonGroup` (#40124) @lhilgert9 - -### `@mui/base@5.0.0-beta.32` - -#### Breaking changes - -- ​<!-- 40 -->Change the CSS class prefix to `base-` (#40205) @michaldudak - -The class prefix of Base UI components have been changed from `Mui-` to `base-`. This only affects codebases that uses class names verbatim, i.e. not exposed by JS objects such as `buttonClasses`, but as plain strings or in CSS stylesheets (`.MuiButton.root`) - -To adapt your code to the new pattern: - -- replace all occurrences of the regex `.Mui([A-Z][A-Za-z]*)-` with `.base-$1-` (so `MuiButton-root` becomes `base-Button-root`, etc.), -- replace all occurrences of the regex `.Mui-([a-z]*)` with `.base--$1` (so `Mui-disabled` becomes `base--disabled`, etc.). - -#### Changes - -- ​<!-- 39 -->[Select] Fix screen-reader CSS to avoid body scrollbar (#40599) @brijeshb42 -- ​<!-- 38 -->[Switch] Add border-box to demos (#40638) @zanivan - -### `@mui/joy@5.0.0-beta.23` - -- ​<!-- 11 -->[ModalDialog] Fix ModalDialog layout prop override (#40512) @maakcode -- ​<!-- 10 -->[RadioGroup] Allow zero number as a value (#40344) @aacevski - -### `@mui/codemod@5.15.5` - -- ​<!-- 31 -->Allow `json` files to be transformed (#40536) @ZeeshanTamboli - -### `@mui/lab@5.0.0-alpha.161` - -- ​<!-- 09 -->Update `@mui/material` peer dependency version (#40528) @ZeeshanTamboli - -### `@mui/material-nextjs@5.15.5` - -- ​<!-- 08 -->Fix release script (#40519) @petrovmiroslav -- ​<!-- 07 -->Support Nonces in the App Router Provider (#40269) @josh-feldman -- ​<!-- 06 -->Polish @mui/material-nextjs (#40473) @oliviertassinari - -### `@mui/system@5.15.5` - -- ​<!-- 05 -->Fix import path for @mui/system in vite apps (#40490) @brijeshb42 -- ​<!-- 02 -->Fix css vars generation and simplify the code (#40530) @siriwatknp -- ​<!-- 01 -->Identify zero runtime styled path (#40555) @brijeshb42 - -### Docs - -- ​<!-- 35 -->[joy-ui][Card] Fix text alignment in horizontal aligned card demo (#40562) @ZeeshanTamboli -- ​<!-- 25 -->Improve instructions about peer dependencies (#40621) @danilo-leal -- ​<!-- 24 -->Solve page description length @oliviertassinari -- ​<!-- 23 -->Fix MUI Treasury links (#40561) @siriwatknp -- ​<!-- 17 -->[material-ui] Update <ListItem button/> to ListItemButton in demos (#40564) @sai6855 -- ​<!-- 16 -->[material-ui] Revise the Snackbar page (#39298) @danilo-leal -- ​<!-- 15 -->[material-ui] Sharpen Material 3 copy on demo pages (#40546) @samuelsycamore -- ​<!-- 14 -->[material-ui] Fix typo on Next.js integration guide (#40538) @zanivan -- ​<!-- 13 -->[material-ui][Snackbar] Remove unused `State` interface from Consecutive Snackbars demo (#40410) - @zinoroman -- ​<!-- 12 -->[website] Resolve broken links reported by `docs:link-check` (#40547) @samuelsycamore - -### Core - -- ​<!-- 37 -->[blog] Fix 404 link to MUI Treasury @oliviertassinari -- ​<!-- 34 -->[code-infra] Add `run` command to deploy docs (#40513) @siriwatknp -- ​<!-- 32 -->[core] Update the lockfile (#40628) @michaldudak -- ​<!-- 31 -->[core] Remove dead code and follow standard @oliviertassinari -- ​<!-- 30 -->[core] Simplify server detection (#40471) @oliviertassinari -- ​<!-- 29 -->[core] Sync playwright cache between MUI X and Material UI (#40475) @oliviertassinari -- ​<!-- 28 -->[dependencies] Bump tough-cookie (#40437) @michaldudak -- ​<!-- 22 -->[docs-infra] Enforce brand name rules (#40525) @oliviertassinari -- ​<!-- 21 -->[docs-infra] Minimize ad layout shift on mobile (#40582) @oliviertassinari -- ​<!-- 20 -->[docs-infra] Improve API page deprecation info (#40440) @DiegoAndai -- ​<!-- 19 -->[docs-infra] Remove old tocs banners (#40537) @oliviertassinari -- ​<!-- 18 -->[docs-infra] Remove dead code aria-label sponsors (#40526) @oliviertassinari -- ​<!-- 04 -->[utils] Centralize clamp implementation in utils (#40267) @Kamino0 -- ​<!-- 03 -->[website] Polish the Base UI page demos (#40504) @danilo-leal - -All contributors of this release in alphabetical order: @2metres, @aacevski, @brijeshb42, @danilo-leal, @DiegoAndai, @josh-feldman, @Kamino0, @lhilgert9, @maakcode, @michaldudak, @oliviertassinari, @petrovmiroslav, @sai6855, @samuelsycamore, @siriwatknp, @zanivan, @ZeeshanTamboli, @zinoroman - -## 5.15.4 - -<!-- generated comparing v5.15.3..master --> - -_Jan 10, 2024_ - -A big thanks to the 22 contributors who made this release possible. Here are some highlights: - -- ✨ Material UI's [ToggleButtonGroup](https://mui.com/material-ui/react-toggle-button/) now supports non-button element as a child (e.g., showing a Tooltip on a disabled ToggleButton) (#40220) @Methuselah96 - -### `@mui/material@5.15.4` - -- [TextField][FormLabel][InputLabel][FormControl] Use exact children type to allow React children type augmentation (#38872) @nicegamer7 -- [Select] Add form submission regression test (#40176) @mj12albert -- [ToggleButtonGroup] Support different elements under it (#40220) @Methuselah96 -- [ClickAwayListener] Fix export of types (#40485) @illume - -### `@mui/material-nextjs@5.15.4` - -- Improve build size issue (#40436) @siriwatknp - -### `@mui/icons-material@5.15.4` - -- Update the icons (#40365) @michaldudak - -### `@mui/system@5.15.4` - -- [zero] Move zero runtime related packages (#40426) @brijeshb42 -- Fix all use of styled(Box) (#40449) @oliviertassinari - -### `@mui/utils@5.15.4` - -- Fix `isPlainObject` to work across realm (#39981) @brijeshb42 - -### `@mui/base@5.0.0-beta.31` - -- [base-ui][NumberInput] Remove inputId and inputRef types from NumberInput component (#40425) @sai6855 - -### `@mui/joy@5.0.0-beta.22` - -- [Badge] Shouldn't crash when using custom size (#39986) @iamsaumya -- [ToggleButtonGroup] Add `JoyToggleButtonGroup` to extendTheme's components type export (#40407) @RiceCrisp - -### Docs - -- [base-ui] Visual tweaks to the plain CSS theme stylesheet (#40487) @zanivan -- [base-ui] Add tokens to plain CSS theme stylesheet (#40113) @zanivan -- [base-ui] Update the overview page (#40412) @danilo-leal -- [material-ui][Drawer] Resolve flickering when double-clicking on the backdrop to close it (#40343) @aacevski -- [material-ui] Refactor form submission in FormDialog component (#40470) @sai6855 -- [material-ui] Replace recharts with MUI X charts on the Dashboard template (#40107) @alexfauquette -- [material-ui] Revise the Alert demo page (#34892) @samuelsycamore -- [material-ui] Revise the Accordion page (#40284) @anle9650 -- [material-ui] Add docs for complementary Card components (#40346) @anle9650 -- [material-ui] Add Material Design 3 components page (#40350) @DiegoAndai -- Fix strange italic style @oliviertassinari -- Fix references to ESLint @oliviertassinari -- Fix 301 redirections @oliviertassinari -- Right-to-left revision and addition to Joy UI (#39158) @danilo-leal - -### Core - -- [examples] Use material-nextjs integration package (#40199) @siriwatknp -- [code-infra] Configure build dependencies in nx (#40482) @michaldudak -- [code-infra] Don't require noreferrer on target link (#40447) @oliviertassinari -- [code-infra] Use tsx instead of ts-node (#40428) @michaldudak -- [code-infra] Add options to docs-api generation to support X code structure (#40111) @alexfauquette -- [docs-infra] Add types for withDocsInfra (#40301) @oliviertassinari -- [docs-infra] Fix anchor links in API pages (#40450) @oliviertassinari -- [docs-infra] Fix API table full-width (#40476) @oliviertassinari -- [docs-infra] Fix the copy button overlapping with the scrollbar (#40405) @danilo-leal -- [docs-infra] Remove explicit `mui-x` dependency resolving (#40257) @LukasTy -- [docs-infra] Update the outlined Demo container dark mode color (#40488) @danilo-leal -- [core] Lock file maintenance (#34538) @renovate[bot] -- [core] Remove duplicate devDependencies (#40438) @michaldudak -- [core] Remove issue emoji @oliviertassinari -- [core] Move prefetch at the core, will propagate to MUI X @oliviertassinari -- [core] Change package manager to pnpm (#36287) @Janpot -- [core][docs] Remove the "Understand MUI packages" page (#39835) @savalaram-redkar -- [website] Evolve the Developer Advocate role (#40337) @oliviertassinari -- [website] Fix default social card @oliviertassinari -- [test] Restore the `t` command (#40430) @michaldudak - -All contributors of this release in alphabetical order: @aacevski, @alexfauquette, @anle9650, @brijeshb42, @danilo-leal, @DiegoAndai, @iamsaumya, @illume, @Janpot, @LukasTy, @Methuselah96, @michaldudak, @mj12albert, @nicegamer7, @oliviertassinari, @renovate[bot], @RiceCrisp, @sai6855, @samuelsycamore, @savalaram-redkar, @siriwatknp, @zanivan - -## 5.15.3 - -<!-- generated comparing v5.15.2..master --> - -_Jan 3, 2024_ - -A big thanks to the 11 contributors who made this release possible. -This release was mostly about 🐛 bug fixes and 📚 documentation improvements. - -### `@mui/material-nextjs@5.15.3` - -- ​<!-- 06 -->[material-nextjs] Fix order of emotion server (#40409) @siriwatknp - -### `@mui/base@5.0.0-beta.30` - -- ​<!-- 40 -->[useSlider] Rearrange passive option in eventlisteners (#40235) @Kamino0 - -### `@mui/lab@5.0.0-alpha.159` - -- ​<!-- 14 -->Add use client directive (#40358) @DiegoAndai - -### `@mui/material-next@6.0.0-alpha.116` - -- ​<!-- 13 -->[List] Copy all List\* components to material-next package (#40367) @sai6855 -- ​<!-- 12 -->Update CONTRIBUTING guide given v6/v7 rescheduling (#40363) @DiegoAndai -- ​<!-- 11 -->[MenuItem] Fix spec import (#40271) @DiegoAndai -- ​<!-- 10 -->[Option] Add Option component (#40270) @DiegoAndai -- ​<!-- 09 -->[Slider] Replace lodash with internal utils (#40261) @DiegoAndai -- ​<!-- 08 -->[Switch] Change files to TypeScript (#39894) @lhilgert9 -- ​<!-- 07 -->[theme] Move ref palette out of color schemes (#40341) @DiegoAndai - -### Docs - -- ​<!-- 41 -->[base-ui] Polish the Table Pagination demos (#40281) @danilo-leal -- ​<!-- 22 -->[joy-ui] Fix dashboard template console errors (#40316) @oliviertassinari -- ​<!-- 21 -->[joy-ui] Fix image size on the Files template (#40315) @oliviertassinari -- ​<!-- 20 -->[material-ui] Revise the Divider page (#40356) @danilo-leal -- ​<!-- 19 -->[material-ui] Polish the Next.js integration page (#40317) @oliviertassinari -- ​<!-- 18 -->[material-ui] Adding autoFocus on Virtual Popover (#40239) @aacevski -- ​<!-- 17 -->[material-ui] Revise the Roadmap page (#40054) @danilo-leal -- ​<!-- 16 -->[material-ui] Update the "showing and hiding" section on the Tooltip page (#40283) @anle9650 -- ​<!-- 05 -->[material-ui] Fix Slider's customized iOS demo to use updated official colors (#39813) @Super-Kenil -- ​<!-- 15 -->[examples] Simplify Next.js example (#40318) @oliviertassinari - -### Core - -- ​<!-- 39 -->[blog] Update open-graph cards for all posts (#40328) @danilo-leal -- ​<!-- 38 -->[blog] Correct git diff @oliviertassinari -- ​<!-- 37 -->[code-infra] Update lerna and unpin its version (#40399) @michaldudak -- ​<!-- 36 -->[code-infra] Break package dependency cycle between @mui/material and @mui/icons-material (#40400) @michaldudak -- ​<!-- 35 -->[code-infra] Break package dependency cycles (#40398) @michaldudak -- ​<!-- 34 -->[code-infra] Sync bug issue template (#40305) @oliviertassinari -- ​<!-- 33 -->[docs] Fix 301 link to Base UI (#40396) @oliviertassinari -- ​<!-- 32 -->[docs] Link new MUI X components in sidnav (#40345) @oliviertassinari -- ​<!-- 31 -->[docs] Fix 301 links to Toolpad @oliviertassinari -- ​<!-- 30 -->[docs] Remove old notifications @oliviertassinari -- ​<!-- 29 -->[docs] Always mention the npm tag with npx (#40335) @oliviertassinari -- ​<!-- 28 -->[docs] Reduce network use on the All Components pages (#40313) @oliviertassinari -- ​<!-- 27 -->[docs-infra] Fix missing button aria-label (#40394) @oliviertassinari -- ​<!-- 26 -->[docs-infra] Fix a11y violation rule (#40393) @oliviertassinari -- ​<!-- 25 -->[docs-infra] Prefetch pages on hover (#40314) @oliviertassinari -- ​<!-- 24 -->[docs-infra] Fix footer links to link to the main domain (#40373) @oliviertassinari -- ​<!-- 23 -->[docs-infra] Add stray design adjustments (#40347) @danilo-leal -- ​<!-- 04 -->[website] Fix Base UI page's component section imports & styles (#40231) @danilo-leal -- ​<!-- 03 -->[website] Fix outdated Nhost image link @oliviertassinari -- ​<!-- 02 -->[website] Shorten Joy UI description, 7 chars too long @oliviertassinari -- ​<!-- 01 -->[website] Update some social preview images (#40282) @danilo-leal - -All contributors of this release in alphabetical order: @aacevski, @anle9650, @danilo-leal, @DiegoAndai, @Kamino0, @lhilgert9, @michaldudak, @oliviertassinari, @sai6855, @siriwatknp, @Super-Kenil - -## 5.15.2 - -<!-- generated comparing v5.15.1..master --> - -_Dec 25, 2023_ - -A big thanks to the 13 contributors who made this release possible. Here are some highlights ✨: - -- 🚀 Added support for callbacks in the [variant's props definition](https://mui.com/material-ui/customization/theme-components/#creating-new-component-variants) (#40094) @mnajdova -- 💫 Published a [blogpost](https://mui.com/blog/2023-material-ui-v6-and-beyond/) for the 2024's plan about Material UI - -### `@mui/material@5.15.2` - -- ​<!-- 31 -->[Badge] Use the variants API in the styled call (#40213) @mnajdova -- ​<!-- 04 -->[Paper] Add missing Paper classes descriptions (#40300) @sai6855 - -### `@mui/system@5.15.2` - -- ​<!-- 03 -->Support props callback in the variant's definition (#40094) @mnajdova - -### `@mui/base@5.0.0-beta.29` - -- ​<!-- 29 -->[Popup] Use context-based transition API (#39326) @michaldudak -- ​<!-- 28 -->[Popup] Popup no longer opens outside viewport (#39827) @adamhylander -- ​<!-- 27 -->[useSelect] Refactor to use DOM focus management instead of active descendant (#39675) @DiegoAndai - -### `@mui/material-next@6.0.0-alpha.115` - -- ​<!-- 15 -->[material-next][Divider]Divider ts support (#40307) @sai6855 - -### Docs - -- ​<!-- 30 -->[base-ui] Fix form submission Select demo (#40014) @ZeeshanTamboli -- ​<!-- 24 -->[blog] Add Material UI v6 and beyond blog post (#40242) @mnajdova -- ​<!-- 10 -->[material-ui] Fix broken links in the All components page (#40303) @muazaqdas -- ​<!-- 09 -->[material-ui] Fix broken links on the All components page (#40279) @danilo-leal -- ​<!-- 08 -->[material-ui] Add aria-current for nav tabs demo (#39594) @Kimzify -- ​<!-- 07 -->[material-ui] Add an "All components" page (#40256) @danilo-leal -- ​<!-- 06 -->[material-ui][Tooltip] Add demo to show how to change distance between tooltip and its anchor (#40087) @anle9650 - -### Core - -- ​<!-- 26 -->[blog] Fix 301 redirection @oliviertassinari -- ​<!-- 25 -->[blog] Reduce max image size @oliviertassinari -- ​<!-- 23 -->[code-infra] Extract Babel macro from mui-utils (#40262) @michaldudak -- ​<!-- 22 -->[core] Simplify a bit the release instructions @oliviertassinari -- ​<!-- 21 -->[core] Push force to deploy is not unexpected @oliviertassinari -- ​<!-- 20 -->[core] Fix CSS2 vs. CSS3 ::after syntax @oliviertassinari -- ​<!-- 19 -->[core] Fix CSS2 vs. CSS3 ::before syntax @oliviertassinari -- ​<!-- 05 -->[core] Use direct import from utils package (#40254) @siriwatknp -- ​<!-- 18 -->[core] Yaml format match most common convention @oliviertassinari -- ​<!-- 17 -->[core] Polish docs-feedback issue template @oliviertassinari -- ​<!-- 16 -->[core] Pin Node version on GitHub Actions to 18.18 (#40187) @michaldudak -- ​<!-- 14 -->[docs] Fix SEO regression (#40306) @oliviertassinari -- ​<!-- 13 -->[docs] Fix docs redirections @oliviertassinari -- ​<!-- 12 -->[docs] Update the Contributing guide to give more guidance on documentation (#40274) @samuelsycamore -- ​<!-- 11 -->[docs-infra] Add polish to the inline code block (#40260) @danilo-leal -- ​<!-- 02 -->[website] Update Gold sponsors: add RxDB, standardize formatting (#40273) @samuelsycamore -- ​<!-- 01 -->[website] Revert change to homepage SEO attributes @oliviertassinari - -All contributors of this release in alphabetical order: @adamhylander, @anle9650, @danilo-leal, @DiegoAndai, @Kimzify, @michaldudak, @mnajdova, @muazaqdas, @oliviertassinari, @sai6855, @samuelsycamore, @siriwatknp, @ZeeshanTamboli - -## 5.15.1 - -<!-- generated comparing v5.15.0..master --> - -_Dec 19, 2023_ - -A big thanks to the 15 contributors who made this release possible. -This release was mostly about 🐛 bug fixes and 📚 documentation improvements. - -### `@mui/material@5.15.1` - -- ​<!-- 13 -->[CardActions][DialogActions] Apply margin for all children except for 1st child (#40168) @sai6855 -- ​<!-- 03 -->[TablePagination] Add ability to change icons in TablePaginationActions using `slots` and `slotProps` (#33797) @pratikkarad -- ​<!-- 13 -->[CssVarsProvider] Fix HSL breaking button styles (#39869) @gitstart - -### `@mui/joy@5.0.0-beta.19` - -- ​<!-- 05 -->[FormControl] Fix issue with the conditional setting of `htmlFor` and `id` attributes not functioning properly for form labels (#40180) @ReaZzy -- ​<!-- 04 -->[typescript] Address TypeScript issue with custom zIndex not functioning (#40133) @qiweiii - -### `@mui/styled-engine-sc@6.0.0-alpha.9` - -- ​<!-- 02 -->[typescript] Fix `theme` being of type any (#40200) @mnajdova - -### Docs - -- ​<!-- 09 -->[joy-ui] Fix typo in the CSS baseline page (#40222) @possibilities -- ​<!-- 08 -->[joy-ui] Document missing Autocomplete props (#39979) @ZeeshanTamboli -- ​<!-- 10 -->[joy-ui] Fix typo about Typography levels (#40230) @zanivan -- ​<!-- 07 -->[material-ui] Update the related projects page to list `mui-tiptap` for rich text (#40216) @sjdemartini -- ​<!-- 06 -->[material-ui] Fix typo in the Next.js integration page (#40209) @s8990 - -### Core - -- ​<!-- 14 -->[blog] Fix access to Notion without an account @oliviertassinari -- ​<!-- 12 -->[core] Update workflows and issue templates to reflect the updated label (#40197) @MBilalShafi -- ​<!-- 11 -->[docs] Replace Twitter with X (#40193) @mbrookes -- ​<!-- 10 -->[docs-infra] Uplift the Algolia search modal design (#40186) @danilo-leal -- ​<!-- 01 -->[website] Update product descriptions and social preview images (#32181) @danilo-leal - -All contributors of this release in alphabetical order: @danilo-leal, @gitstart, @MBilalShafi, @mbrookes, @mnajdova, @oliviertassinari, @possibilities, @pratikkarad, @qiweiii, @ReaZzy, @s8990, @sai6855, @sjdemartini, @zanivan, @ZeeshanTamboli - -## 5.15.0 - -<!-- generated comparing v5.14.20..master --> - -_Dec 11, 2023_ - -A big thanks to the 15 contributors who made this release possible. Here are some highlights ✨: - -- 🚀 Added [a new package for a better Material UI integration with Next.js](https://mui.com/material-ui/guides/nextjs) (#39947) @siriwatknp - -### `@mui/material@5.15.0` - -- ​<!-- 12 -->Revert "[Select][material-ui] Add name to hidden input element" (#40174) @mj12albert -- ​<!-- 02 -->[material-ui] Refactor ComponentsVariants type into a generic (#39623) @blakenetz - -### `@mui/material-nextjs@5.15.0` - -- ​<!-- 01 -->[material-ui] Add new Next.js integration package (#39947) @siriwatknp - -### `@mui/material-next@6.0.0-alpha.113` - -- ​<!-- 11 -->[Badge][material-next] Apply new OwnerState type to Badge (#40119) @lhilgert9 -- ​<!-- 06 -->[material-next][ButtonGroup] Change `ButtonGroup` files to ts (#39794) @lhilgert9 - -### `@mui/icons-material@5.15.0` - -- ​<!-- 05 -->[icons] Add X logo (#38811) @abreel - -### `@mui/base@5.0.0-beta.27` - -- ​<!-- 10 -->[base-ui] useControllableReducer warns when controlled props become uncontrolled (and vice versa) (#39096) @mj12albert - -### `@mui/joy@5.0.0-beta.18` - -- ​<!-- 04 -->[joy-ui][Radio][Input] Fix inheritance of disabled prop (#39934) @sai6855 - -### `@mui/lab@5.0.0-alpha.156` - -- ​<!-- 03 -->[lab][LoadingButton] LoadingButton now inherits props from ButtonGroup (#39679) @lhilgert9 - -### Docs - -- ​<!-- 09 -->[docs] Fix reference to non-existent checkmark in supported-components.md (#40056) @mbrookes -- ​<!-- 09 -->[docs][base-ui] Add copy button & primary color picker to the component gallery page (#39884) @mnajdova -- ​<!-- 08 -->[docs-infra] Update CodeSandbox links (#39992) @anle9650 -- ​<!-- 04 -->[material-ui][docs] Fix wrong root element for emotion styles in shadow DOM (#35326) @EloB -- ​<!-- 03 -->[material-ui][docs] Move the responsive font charts from recharts to MUI X (#40097) @alexfauquette -- ​<!-- 02 -->[joy-ui][templates] Remove outdated code (#40095) @zanivan -- ​<!-- 05 -->[material-ui][docs][Popper] Update Positioned Popper demo styles (#40170) @sai6855 - -### Core - -- ​<!-- 08 -->[blog] Add a Phuket retreat blog post (#40055) @mikailaread -- ​<!-- 07 -->[blog] Adjust the latest MUI X blog post (#40046) @danilo-leal -- ​<!-- 05 -->[core] Migrate from tslint to eslint (#40020) @ZeeshanTamboli - -All contributors of this release in alphabetical order: @abreel, @alexfauquette, @anle9650, @blakenetz, @danilo-leal, @EloB, @lhilgert9, @mbrookes, @mikailaread, @mj12albert, @mnajdova, @sai6855, @siriwatknp, @zanivan, @ZeeshanTamboli - -## 5.14.20 - -<!-- generated comparing v5.14.19..master --> - -_Dec 5, 2023_ - -A big thanks to the 14 contributors who made this release possible. -This release was mostly about 🐛 bug fixes and 📚 documentation improvements. - -### `@mui/material-next@6.0.0-alpha.112` - -- ​<!-- 07 -->[Menu] Enable again the usage of the autoFocus prop (#39960) @mnajdova -- ​<!-- 06 -->[ProgressIndicator] Apply MD3 style to `CircularProgress` (#39825) @lhilgert9 - -### Docs - -- ​<!-- 15 -->Remove outdated showcase (#40063) @oliviertassinari -- ​<!-- 14 -->Support yaml as prism language (#40044) @Janpot -- ​<!-- 12 -->[material-ui] Fix SearchAppBar width on `sm` screens (#40049) @DiegoAndai -- ​<!-- 11 -->[material-ui] Update the basic Grid section copy (#40035) @REX500 -- ​<!-- 10 -->[material-ui] Add a react-admin example project (#39972) @fzaninotto -- ​<!-- 09 -->[material-ui][TextField] Add a performance section (#39692) @anle9650 -- ​<!-- 05 -->[material-ui][tabs] Refine scrollable tabs description (#40037) @zanivan -- ​<!-- 08 -->[system] Fix typo on the CSS theme variables page (#40040) @caweidmann - -### Core - -- ​<!-- 17 -->[blog] Fix scrollbar on mobile (#40057) @oliviertassinari -- ​<!-- 16 -->[blog] Fix link to charts getting started page (#40043) @alexfauquette -- ​<!-- 13 -->[docs-infra] Simplify CSS classes extraction in API docs generator (#39808) @michaldudak -- ​<!-- 04 -->[website] Polish dark mode colors (#40052) @danilo-leal -- ​<!-- 03 -->[website] Add why Design Engineer for data grid (#40016) @oliviertassinari -- ​<!-- 02 -->[website] Add stray fixes to the Base UI page (#40051) @danilo-leal -- ​<!-- 01 -->[website] Revise the Developer Advocate job posting (#39210) @samuelsycamore - -All contributors of this release in alphabetical order: @alexfauquette, @anle9650, @caweidmann, @danilo-leal, @DiegoAndai, @fzaninotto, @Janpot, @lhilgert9, @michaldudak, @mnajdova, @oliviertassinari, @REX500, @samuelsycamore, @zanivan - -## 5.14.19 - -<!-- generated comparing v5.14.18..master --> - -_Nov 29, 2023_ - -A big thanks to the 18 contributors who made this release possible. Here are some highlights ✨: - -- 🐛 Fix Material UI Autocomplete behavior when there are duplicate labels (#36426) @islandryu -- 🚀 Added Material You Linear Progress to `material-next` package (#39807) @lhilgert9 - -### `@mui/material@5.14.19` - -- ​<!-- 44 -->[Autocomplete] Fix behavior when there are duplicate labels (#36426) @islandryu -- ​<!-- 37 -->[Box] Added boxClasses (#39889) @sadik-malik -- ​<!-- 18 -->[FilledInput] Fix slot props deepmerge order (#38922) @dhaub-exelixis -- ​<!-- 12 -->[Select] Add id to hidden input element (#39414) @DarhkVoyd -- ​<!-- 11 -->[Select] Remove unnecessary picking of `onChange` type from SelectInputProps (#39891) @ZeeshanTamboli - -### `@mui/base@5.0.0-beta.25` - -- ​<!-- 46 -->[Menu] Fix navigation of items when 1st item is disabled (#39828) @sai6855 -- ​<!-- 42 -->[Modal] Refine demos (#39824) @zanivan -- ​<!-- 41 -->[NumberInput] Implement `numberInputReducer` (#38723) @mj12albert -- ​<!-- 40 -->[useNumberInput] Fix change handlers passed through slotProps (#39407) @mj12albert - -### `@mui/joy@5.0.0-beta.16` - -- ​<!-- 38 -->[Box] Added boxClasses (#39895) @sadik-malik - -### `@mui/system@5.14.19` - -- ​<!-- 36 -->[Box] Added boxClasses (#39896) @sadik-malik -- ​<!-- 09 -->Add outlineColor to defaultSxConfig (#39962) @brijeshb42 - -### `@mui/types@7.2.10` - -- ​<!-- 08 -->Add `PartiallyRequired` type (#39939) @lhilgert9 - -### `@mui/material-next@6.0.0-alpha.111` - -- ​<!-- 47 -->[ProgressIndicator] Apply MD3 style to `LinearProgress` (#39807) @lhilgert9 -- ​<!-- 17 -->[FormHelperText] Add FormHelperText component (#39503) @mj12albert -- ​<!-- 16 -->[IconButton] Copy IconButton to material-next (#39945) @mj12albert -- ​<!-- 13 -->[Switch] Copy `Switch` to material next (#39887) @lhilgert9 - -### Docs - -- ​<!-- 19 -->[material-ui] Fix theme prop in v5 migration guide (#39976) @sai6855 -- ​<!-- 43 -->[base-ui] Improve Next.js Link docs (#39838) @oliviertassinari -- ​<!-- 39 -->[base-ui] Export Base UI theme in stylesheet (#39694) @mnajdova -- ​<!-- 52 -->[joy-ui] Fix the date min & max slot props values on the Input demo (#40018) @avikalpg -- ​<!-- 35 -->[joy-ui][ButtonGroup] Fix orientation prop description (#39876) @sai6855 -- ​<!-- 25 -->[joy-ui] Update gif from the Dark Mode Optimization page (#39726) @danilo-leal -- ​<!-- 24 -->[joy-ui] Fix h1 template (#40017) @oliviertassinari -- ​<!-- 23 -->[joy-ui] Fix wrong product id @oliviertassinari -- ​<!-- 22 -->[joy-ui] Fixes in theme scoping documentation (#39899) @ZeeshanTamboli -- ​<!-- 21 -->[joy-ui] Refine the Email, Teams and Files templates (#39579) @zanivan -- ​<!-- 15 -->[joy-ui][templates] Fix layout shift on Profile template (#40022) @zanivan -- ​<!-- 14 -->[joy-ui][Templates] Update thumbnails (#39938) @zanivan -- ​<!-- 20 -->[material-next] Add contributing guide (#39944) @mj12albert -- ​<!-- 51 -->End v6 blogpost notification (#39879) @joserodolfofreitas -- ​<!-- 31 -->Fix nested CSS warning (#39932) @mnajdova -- ​<!-- 30 -->Make integration searchable (#39967) @oliviertassinari -- ​<!-- 29 -->Fix use of quote in markdown (#39953) @oliviertassinari -- ​<!-- 28 -->Show design links on Joy UI (#39955) @oliviertassinari -- ​<!-- 27 -->Restore Algolia results when searching for "Figma" (#39956) @oliviertassinari -- ​<!-- 26 -->Fix two tone icon dark mode color (#39868) @mnajdova - -### Core - -- ​<!-- 45 -->Improve lerna's renovate package rules (#40029) @DiegoAndai -- ​<!-- 34 -->Downgrade lerna to 7.2.0 (#40026) @DiegoAndai -- ​<!-- 32 -->Rename OpenCollective @oliviertassinari -- ​<!-- 48 -->[docs-infra] Env variables should be string (#39991) @oliviertassinari -- ​<!-- 10 -->[Portal] Improve docs for container prop (#39180) @oliviertassinari -- ​<!-- 50 -->[website] Update pricing table (#40023) @cherniavskii -- ​<!-- 49 -->[website][docs] Update the product identifier menu and X page (#39832) @danilo-leal -- ​<!-- 07 -->[website] Mark TreeView and Charts as stable (#39975) @flaviendelangle -- ​<!-- 06 -->[website] Update career page (#40015) @oliviertassinari -- ​<!-- 05 -->[website] Sync about dataset @oliviertassinari -- ​<!-- 04 -->[website] Fix 301 redirection to X tree-view @oliviertassinari -- ​<!-- 03 -->[website] Change redirection prefixes @oliviertassinari -- ​<!-- 02 -->[website] Fix 301 link @oliviertassinari -- ​<!-- 01 -->[website] Fix modal not being closed with the escape key on the Base UI page (#39880) @ZeeshanTamboli - -All contributors of this release in alphabetical order: @avikalpg, @brijeshb42, @cherniavskii, @danilo-leal, @DarhkVoyd, @dhaub-exelixis, @DiegoAndai, @flaviendelangle, @islandryu, @joserodolfofreitas, @lhilgert9, @mj12albert, @mnajdova, @oliviertassinari, @sadik-malik, @sai6855, @zanivan, @ZeeshanTamboli - -## 5.14.18 - -<!-- generated comparing v5.14.17..master --> - -_Nov 14, 2023_ - -A big thanks to the 14 contributors who made this release possible. Here are some highlights ✨: - -- 💫 Introduced new [Stepper](https://mui.com/joy-ui/react-stepper/) component in Joy UI (#39688) @siriwatknp -- other 🐛 bug fixes and 📚 documentation improvements - -### `@mui/material@5.14.18` - -- ​<!-- 32 -->[Autocomplete] Add `defaultMuiPrevented` to onKeyDown type (#39820) @sai6855 -- ​<!-- 31 -->[Autocomplete] Fix React key warning in Next.js (#39795) @mj12albert -- ​<!-- 24 -->[Checkbox] Asterisk placement aligned correctly (#39721) @axelbostrom -- ​<!-- 04 -->[Rating] Fix the hover highlighting for spaced icons (#39775) @ZeeshanTamboli -- ​<!-- 03 -->[TablePagination] Implement `slotProps` pattern for the actions and the select slots (#39353) @anle9650 -- ​<!-- 02 -->[TextField] Fix padding on small filled multiline TextField (#39769) @mj12albert - -### `@mui/joy@5.0.0-beta.15` - -- ​<!-- 11 -->[Stepper] Add new `Stepper` component (#39688) @siriwatknp -- ​<!-- 12 -->[Select] Fix displaying placeholder when multiple is true (#39806) @sai6855 - -### `@mui/material-next@6.0.0-alpha.110` - -- ​<!-- 26 -->[ButtonGroup] Copy `ButtonGroup` to material next (#39739) @lhilgert9 -- ​<!-- 09 -->[ProgressIndicator] Change `CircularProgress` files to ts (#39791) @lhilgert9 -- ​<!-- 08 -->[ProgressIndicator] Change `LinearProgress` files to ts (#39793) @lhilgert9 -- ​<!-- 07 -->[ProgressIndicator] Copy `LinearProgress` to material next (#39779) @lhilgert9 -- ​<!-- 06 -->[ProgressIndicator] Copy `CircularProgress` to material next (#39780) @lhilgert9 -- ​<!-- 05 -->[TextField] Add FormLabel and InputLabel components (#39483) @mj12albert - -## Docs - -- ​<!-- 30 -->[base-ui][NumberInput] Fix inconsistent demo component names (#39786) @mnajdova -- ​<!-- 29 -->[base-ui][Menu] Refine demos (#39823) @zanivan -- ​<!-- 28 -->[base-ui][Switch] Refine demos (#39822) @zanivan -- ​<!-- 16 -->[joy-ui] Fix API generation for Grid (#39861) @oliviertassinari -- ​<!-- 15 -->[joy-ui] Fix menu in color inversion header demo (#39785) @sai6855 -- ​<!-- 14 -->[joy-ui] Change the design kit link on the Overview page (#39725) @danilo-leal -- ​<!-- 13 -->[joy-ui] Add `CssBaseline` to integration with Material UI page (#39790) @swillianc -- ​<!-- 10 -->[joy-ui][Tabs] Add wordBreak style to demo (#39821) @sai6855 - -## Core - -- ​<!-- 27 -->[blog] MUI X late v6 blog post (#39700) @joserodolfofreitas -- ​<!-- 25 -->[CHANGELOG] Correct the Joy UI version in the changelog (#39788) @michaldudak -- ​<!-- 23 -->[core] Remove legacy docs files (#39860) @oliviertassinari -- ​<!-- 22 -->[core] Fix GitHub title tag consistency @oliviertassinari -- ​<!-- 21 -->[core] Make the API docs builder configurable per project (#39772) @michaldudak -- ​<!-- 20 -->[docs] Fix the default theme viewer font family (#39782) @danilo-leal -- ​<!-- 19 -->[docs-infra] Fix hydration api (#39706) @oliviertassinari -- ​<!-- 18 -->[docs-infra] Adjust the website & docs footer (#39810) @danilo-leal -- ​<!-- 17 -->[docs-infra] Fix bug on API prop copy experience (#39707) @oliviertassinari -- ​<!-- 01 -->[website] Change roadmap link destination (#39639) @danilo-leal - -All contributors of this release in alphabetical order: @anle9650, @axelbostrom, @danilo-leal, @joserodolfofreitas, @lhilgert9, @michaldudak, @mj12albert, @mnajdova, @oliviertassinari, @sai6855, @siriwatknp, @swillianc, @zanivan, @ZeeshanTamboli - -## 5.14.17 - -<!-- generated comparing v5.14.16..master --> - -_Nov 6, 2023_ - -A big thanks to the 12 contributors who made this release possible. -This release was mostly about 🐛 bug fixes and 📚 documentation improvements. - -### `@mui/material@5.14.17` - -- [Dialog] Should not close until the IME is cancelled (#39713) @megos -- [InputBase] Add `sx` type to `input` and `root` slot (#39569) @sai6855 - -### `@mui/joy@5.0.0-beta.14` - -- [ModalDialog] Remove redundant code (#39719) @sai6855 -- [ToggleButtonGroup] Fix toggling button state when `Button` is not immediate children (#39571) @sai6855 - -### `@mui/base@5.0.0-beta.23` - -- Make list components more reliable (#39380) @michaldudak - -### `@mui/material-next@6.0.0-alpha.109` - -- [InputBase] InputBase slotProps accepts sx type (#39714) @mj12albert -- [OutlinedInput] Copy v5 OutlinedInput (#39698) @mj12albert - -### `@mui/lab@5.0.0-alpha.152` - -- [TreeView] Remove tree view import from @mui/lab (#39685) @alexfauquette - -### Docs - -- Update Taiwan country name in demos (#39729) @chiahao -- Update release doc for unchanged packages (#39487) @brijeshb42 -- [joy-ui] Make code readable to set next color in color inversion demos (#39669) @ZeeshanTamboli -- [material-ui] Remove numeric input workaround from TextField docs (#39629) @mj12albert -- [material-ui] Add comment about code to be removed from Drawer demo (#39678) @samuelsycamore - -### Core - -- [docs-infra] Fix path bloat client-side (#39708) @oliviertassinari -- [docs-infra] Render footer in SSR (#39710) @oliviertassinari -- [docs-infra] Simplify footer (#39709) @oliviertassinari -- [docs-infra] Fix dark theme color (#39720) @alexfauquette -- [docs-infra] Remove the design feedback alert (#39691) @danilo-leal -- [docs-infra] Bring back scroll gradient in API page with table (#39689) @alexfauquette -- [docs-infra] Clarify the content of the ads @oliviertassinari -- [docs-infra] Link to ScaffoldHub v2 @oliviertassinari -- [docs-infra] Improve access to the component demos via the API page (#39690) @danilo-leal -- [docs-infra] Add appropriate aria-label to docs buttons (#39638) @danilo-leal -- [docs-infra] Fix crawler on API pages (#39490) @alexfauquette -- [docs–infra] Small polish on API toggle (#39704) @oliviertassinari -- [core] Speed up the CI by removing the second build (#39684) @michaldudak -- [core][docs] Fix broken MUI System link in README.md (#39734) @samuelsycamore -- [website] List benefits for sponsors (#39640) @oliviertassinari -- [website] Add Vadym teamMember card to 'About' (#39701) @hasdfa -- [test] Fix flaky screenshot (#39711) @oliviertassinari - -All contributors of this release in alphabetical order: @alexfauquette, @brijeshb42, @chiahao, @danilo-leal, @hasdfa, @megos, @michaldudak, @mj12albert, @oliviertassinari, @sai6855, @samuelsycamore, @ZeeshanTamboli - -## 5.14.16 - -<!-- generated comparing v5.14.15..master --> - -_Oct 31, 2023_ - -A big thanks to the 19 contributors who made this release possible. Here are some highlights ✨: - -- ✨ New highly requested Joy UI component: [Snackbar](https://mui.com/joy-ui/react-snackbar) (#38801) @ZeeshanTamboli - -### `@mui/material@5.14.16` - -- ​<!-- 03 -->Fix ownerstate being propagated to DOM node when using styled-components v6 (#39586) @mnajdova - -### `@mui/base@5.0.0-beta.22` - -- ​<!-- 28 -->[Autocomplete] Standardize box shadow on demos (#39519) @zanivan -- ​<!-- 27 -->[useSelect] Support browser autofill (#39595) @DiegoAndai -- ​<!-- 30 -->[base-ui] Fix mergeSlotProps className join order (#39616) @mj12albert - -### `@mui/joy@5.0.0-beta.13` - -- ​<!-- 29 -->[Accordion] Add type button to accordion -- ​<!-- 28 -->[Card] Fix CardOverflow in nested cards (#39668) @siriwatknp summary (#39532) @Popppins -- ​<!-- 08 -->[Menu] Fix closing of listbox in `MenuList` demo (#39459) @sai6855 -- ​<!-- 07 -->[Progress] Revamp Linear and Circular progress variants (#39492) @zanivan -- ​<!-- 06 -->[Select] Support selection of `multiple` options (#39454) @sai6855 -- ​<!-- 05 -->[Textarea] Add ref usage instructions (#39615) @danilo-leal -- ​<!-- 10 --> Fix sticky hover media query issue on mobile (#37467) @gitstart -- ​<!-- 09 --> Add Snackbar component (#38801) @ZeeshanTamboli - -### `@mui/material-next@6.0.0-alpha.108` - -- ​<!-- 04 -->[theme] Update Material You typescale tokens (#39514) @mj12albert - -### Docs - -- ​<!-- 22 -->Fix 301 link to Primer design system @oliviertassinari -- ​<!-- 19 -->[joy-ui] Revise the CSS vars page (#39335) @danilo-leal -- ​<!-- 18 -->[joy-ui] Add docs for changing styles based on states (#39597) @siriwatknp -- ​<!-- 17 -->[joy-ui] Fix wrong messages (#39602) @siriwatknp -- ​<!-- 16 -->[material-ui] Include link to bundler how-to for Styled Components users (#39620) @jcoyle37 -- ​<!-- 15 -->[material-ui] Improve Dialog demos (#39642) @ZeeshanTamboli -- ​<!-- 14 -->[material-ui] Add stray design fine-tuning to the example collection (#39581) @danilo-leal -- ​<!-- 13 -->[system] Clean up `@mui/styles` docs and discourage users from installing it (#39644) @samuelsycamore -- ​<!-- 12 -->[examples] Upgrade Remix to v2 (#39229) @Nkzn -- ​<!-- 11 -->[examples][material-ui] Remove hardcoded `color="black"` from Next.js App Router layout (#39577) @samuelsycamore - -### Core - -- ​<!-- 26 -->[core] Setup vale for enforcing style guides (#39633) @alexfauquette -- ​<!-- 25 -->[core] Remove unused use client (#38967) @oliviertassinari -- ​<!-- 24 -->[core] Remove duplicate export (#39346) @oliviertassinari -- ​<!-- 23 -->[core] Remove not used `@types/loader-utils` package from `zero-next-plugin` (#39609) @ZeeshanTamboli -- ​<!-- 21 -->[docs-infra] Add meta charset in codesandbox examples (#39424) @Janpot -- ​<!-- 20 -->[docs-infra] Fix settings drawer accessibility issues (#39589) @emamoah -- ​<!-- 02 -->[website] Add stray adjustments and clean-ups (#39673) @danilo-leal -- ​<!-- 01 -->[website] Open the `Design Engineer - xGrid` role (#39375) @DanailH - -All contributors of this release in alphabetical order: @alexfauquette, @Best-Sardar, @DanailH, @danilo-leal, @DiegoAndai, @emamoah, @gitstart, @Janpot, @jcoyle37, @mj12albert, @mnajdova, @Nkzn, @oliviertassinari, @Popppins, @sai6855, @samuelsycamore, @siriwatknp, @zanivan, @ZeeshanTamboli - -## 5.14.15 - -<!-- generated comparing v5.14.14..master --> - -_Oct 24, 2023_ - -A big thanks to the 17 contributors who made this release possible. - -### `@mui/material@5.14.15` - -- ​<!-- 24 -->[Checkbox][Radio] Fix theme style overrides not working for different sizes (#39377) @gitstart -- ​<!-- 12 -->[InputLabel] InputLabel supports ownerState.focused for styleOverrides (#39470) @mj12albert -- ​<!-- 07 -->[ToggleButton] Add `fullWidth` to `toggleButtonClasses` and `toggleButtonGroupClasses` (#39536) @Semigradsky - -### `@mui/base@5.0.0-beta.21` - -- ​<!-- 29 -->[useAutocomplete] Correct keyboard navigation with multiple disabled options (#38788) @VadimZvf -- ​<!-- 28 -->[Select] Standardize box shadow on demos (#39509) @zanivan -- ​<!-- 27 -->[Slider] Refine demos (#39526) @zanivan -- ​<!-- 34 -->[Input] Update and port additional tests from material-ui (#39584) @mj12albert - -### `@mui/material-next@6.0.0-alpha.107` - -- ​<!-- 16 -->[FilledInput] Add FilledInput component (#39307) @mj12albert -- ​<!-- 13 -->[InputAdornment] Fix unstable_capitalize import (#39510) @DiegoAndai -- ​<!-- 08 -->[Snackbar] copy files to mui-material-next (#39232) @Best-Sardar -- ​<!-- 33 -->[Menu] Use useMenu hook (#38934) @mnajdova - -### `@mui/joy@5.0.0-beta.12` - -- ​<!-- 26 -->[Button] Fix button size being a decorator (#39529) @siriwatknp -- ​<!-- 25 -->[CardOverflow] Remove conditional CSS to support Next.js App dir (#39101) @siriwatknp -- ​<!-- 11 -->[Link] Apply `userSelect: none` only when it's a button (#39486) @mwskwong - -### `@mui/lab@5.0.0-alpha.150` - -- ​<!-- 09 -->Update peer dep of @mui/material (#39398) @brijeshb42 - -### `@pigment-css/react@0.0.1-alpha.0` - -- ​<!-- 06 -->Implement typings for public runtime API (#39215) @brijeshb42 - -### `@mui/zero-vite-plugin@0.0.1-alpha.0` - -- ​<!-- 05 -->Modify plugin to transform node_modules (#39517) @brijeshb42 - -### Docs - -- ​<!-- 31 -->[base-ui] Standardize grey palette across demos (#39504) @zanivan -- ​<!-- 30 -->[base-ui] Overall demos design review (#38820) @zanivan -- ​<!-- 19 -->[joy-ui] Adjust the responsiveness of the template card (#39534) @danilo-leal -- ​<!-- 18 -->[material-ui] Typo fixes in overview page (#39540) @Evan151 -- ​<!-- 35 -->[material-ui] Add stray design tweaks to the templates collection (#39583) @danilo-leal -- ​<!-- 17 -->[system] Revise the Box page (#39159) @danilo-leal -- ​<!-- 22 -->Fix git diff format @oliviertassinari -- ​<!-- 15 -->[I10n] Add Norwegian (nynorsk) (nn-NO) locale (#39481) @hjalti-lifekeys -- ​<!-- 10 -->[l10n] Fix double space typo in ar-EG @oliviertassinari -- ​<!-- 14 -->[I10n] Additions to Icelandic (is-IS) locale (#39480) @hjalti-lifekeys - -### Core - -- ​<!-- 23 -->[core] Replace a `useCallback` by `useRef` in useEventCallback (#39078) @romgrk -- ​<!-- 21 -->[docs-infra] Prevent docs crash (#39214) @alexfauquette -- ​<!-- 20 -->[docs-infra] Fix no-op autoprefixer warning (#39385) @oliviertassinari -- ​<!-- 32 -->[docs-infra] Refine the API page design (#39520) @alexfauquette -- ​<!-- 25 -->[docs-infra] Fix cut-off sponsors (#39572) @oliviertassinari -- ​<!-- 04 -->[website] Add missing h1 on page @oliviertassinari -- ​<!-- 03 -->[website] Fix unrecognized prop warning @oliviertassinari -- ​<!-- 02 -->[website] Store Engineer role filled @oliviertassinari -- ​<!-- 01 -->[website] Add stray design adjustments (#39496) @danilo-leal - -All contributors of this release in alphabetical order: @alexfauquette, @Best-Sardar, @brijeshb42, @danilo-leal, @DiegoAndai, @Evan151, @gitstart, @hjalti-lifekeys, @mj12albert, @mnajdova, @mwskwong, @oliviertassinari, @romgrk, @Semigradsky, @siriwatknp, @VadimZvf, @zanivan - -## 5.14.14 - -<!-- generated comparing v5.14.13..master --> - -_Oct 17, 2023_ - -A big thanks to the 24 contributors who made this release possible. Here are some highlights ✨: -This release was mostly about 🐛 bug fixes and 📚 documentation improvements. - -### `@mui/material@5.14.14` - -- ​<!-- 29 -->[material-ui][AppBar] Support all default palette colors in TypeScript (#39389) @BreakBB -- ​<!-- 28 -->[material-ui][AvatarGroup] Add `renderSurplus` prop (#39283) @uuxxx -- ​<!-- 25 -->[material-ui][Box] Fix system properties has incorrect `Theme` interface when applied directly (#39404) @Semigradsky -- ​<!-- 04 -->[material-ui][Pagination] Update `type` parameter of `getItemAriaLabel` prop (#39390) @Simer13 -- ​<!-- 06 -->[material][tab] Show/hide scroll buttons for dynamically added children (#39415) @brijeshb42 - -### `@mui/base@5.0.0-beta.20` - -- ​<!-- 26 -->[base-ui][Menu] Do not reopen the menu after clicking on a trigger in Safari (#39393) @michaldudak - -### `@mui/material-next@6.0.0-alpha.106` - -- ​<!-- 23 -->[Divider][material-next] Add Divider component (#39179) @Best-Sardar - -### `@mui/joy@5.0.0-beta.11` - -- ​<!-- 08 -->[joy-ui][List] Add the `marker` prop (#39313) @siriwatknp -- ​<!-- 07 -->[joy-ui][Skeleton] Fix semi-transparent scenario when with surface components and color inversion (#39400) @TheNatkat -- ​<!-- 06 -->[joy-ui][Textarea] Fix focus ring for error state (#39391) @vineetjk - -### `@mui/icons-material@5.14.14` - -- ​<!-- 09 -->[icons] Fix VoiceChatOutlined showing the wrong icon (#39418) @devuser200 - -### `@mui/system@5.14.14` - -- ​<!-- 03 -->[mui-system][style] bug fix for style value check color in nullable object (#39457) @DarhkVoyd - -### `@mui/styled-engine-sc@6.0.0-alpha.2` - -- ​<!-- 05 -->[styled-engine-sc] Fix TS issues because of missing types (#39395) @mnajdova - -### Docs - -- ​<!-- 27 -->[docs][base-ui] Renaming demos to BaseXxx (#39104) @christophermorin -- ​<!-- 26 -->[docs] Accessibility in Base UI (#39264) @michaldudak -- ​<!-- 22 -->[docs] Fix 301 redirection @oliviertassinari -- ​<!-- 21 -->[docs] Improve Base UI table of contents for APIs (#39412) @ZeeshanTamboli -- ​<!-- 20 -->[docs] Adjust design kits-related content (#39367) @danilo-leal -- ​<!-- 19 -->[docs] Revise the Contributing Guide (#39190) @samuelsycamore -- ​<!-- 12 -->[docs][joy-ui] Fix row hover prop name in the Table page (#39431) @adrienbrault -- ​<!-- 11 -->[docs][joy-ui] Fix color inversion demos (#39403) @danilo-leal -- ​<!-- 10 -->[docs][material-ui] Remove irrelevant TODO from Snackbar demo (#39396) @ZeeshanTamboli -- ​<!-- 06 -->[docs][material-ui][Table] Bug in "Sorting & Selecting" demo (#39426) @codewithrabeeh -- ​<!-- 05 -->[docs][joy-ui][typography] Update docs after lineHeight changes (#39366) @zanivan - -### Core - -- ​<!-- 24 -->[core] Fix multiple typos across the repo (#39422) @parikshitadhikari -- ​<!-- 18 -->[docs-infra] Add refinements to the API content design (#39425) @danilo-leal -- ​<!-- 17 -->[docs-infra] Add a min height to the layout component (#39416) @danilo-leal -- ​<!-- 16 -->[docs-infra] Prevent horizontal scroll in the TOC (#39417) @danilo-leal -- ​<!-- 15 -->[docs-infra] Add a collapsible list & table views to the API content display (#38265) @alexfauquette -- ​<!-- 14 -->[docs-infra] Adjust the `kbd` tag styles (#39397) @danilo-leal -- ​<!-- 13 -->[docs-infra] Fix strong style regression (#39384) @oliviertassinari -- ​<!-- 04 -->[website] Add the LinkedIn profile to the contributors section on the About page (#39455) @chhawinder -- ​<!-- 03 -->[website] Update new role template (#39386) @oliviertassinari -- ​<!-- 02 -->[website] Add stray design fine-tunning to the Pricing page (#39472) @danilo-leal -- ​<!-- 01 -->[website] Fix career anchor link to perks & benefits @oliviertassinari - -All contributors of this release in alphabetical order: @adrienbrault, @alexfauquette, @Best-Sardar, @BreakBB, @brijeshb42, @chhawinder, @christophermorin, @codewithrabeeh, @danilo-leal, @DarhkVoyd, @devuser200, @michaldudak, @mnajdova, @oliviertassinari, @parikshitadhikari, @samuelsycamore, @Semigradsky, @Simer13, @siriwatknp, @TheNatkat, @uuxxx, @vineetjk, @zanivan, @ZeeshanTamboli - -## 5.14.13 - -<!-- generated comparing v5.14.12..master --> - -_Oct 10, 2023_ - -A big thanks to the 22 contributors who made this release possible. Here are some highlights ✨: - -- 🚀 Added support for `styled-components` v6 (#39042) @mnajdova - -### `@mui/material@5.14.13` - -- [Checkbox] Fix checkbox hover bg with extendTheme (#39319) @brijeshb42 -- [Chip] Outlined Chip variant is wider than the Filled counterpart (#39342) @chirag3003 -- [Select] Add notice about select's a11y improvement on v5.14.12 changelog (#39310) @DiegoAndai -- [Typography] Color prop check for primitive type (#39071) @DarhkVoyd -- [Pagination] Fix background color on hover and keyboard focus when using CSS theme variables (#39220) @ValkonX33 -- [Popper] Add missing `styleOverrides` Popper type in theme (#39154) @axelbostrom -- [Slider] Support all default palette colors in TypeScript (#39058) @gugudwt - -### `@mui/base@5.0.0-beta.19` - -- [Menu] Add the anchor prop (#39297) @michaldudak - -### `@mui/material-next@6.0.0-alpha.105` - -- [Menu] Copy v5 Menu components (#39301) @mnajdova - -### `@mui/joy@5.0.0-beta.10` - -- [Autocomplete] Add `type=button` to clear button (#39263) @brijeshb42 -- [Button] Fix the text wrap issue (#38696) @atharva3333 -- [Drawer] Apply color inversion to content slot instead (#39312) @siriwatknp -- [Switch] Fix missing class name (#39327) @Bestwebdesign - -### `@mui/styled-engine-sc@6.0.0-alpha.1` - -- ​<!-- 03 -->[system] Add support for `styled-components` v6 (#39042) @mnajdova - -### Docs - -- [joy-ui] Adjust the templates page card design (#39369) @danilo-leal -- Rename the Data Grid "Quick filter" to "Search" (#37724) @alexfauquette -- Remove obsolete translations (#39221) @mbrookes -- Update link to add custom color in palette (#39359) @ZeeshanTamboli -- Denser code demo @oliviertassinari -- Set up MD3 experiments pages (#39323) @mj12albert -- [Drawer] Fix right anchored persistent drawer intercepts click when it is closed (#39318) @ZeeshanTamboli -- [joy-ui] Revise the Color Inversion page (#39306) @danilo-leal -- [joy-ui] Remove redundant `error` prop from input validation demo (#39280) @sai6855 -- [material-ui] Rename themed components doc, fix typos (#39368) @samuelsycamore -- [material-ui] Adjust the Material You Chip section (#39325) @danilo-leal -- [system] Add documentation on how to augment custom theme types for the `sx` prop callback (#39259) @3xp10it3r -- [joy-ui][Input] Add debounce input demo (#39300) @sai6855 - -### Core - -- [docs-infra] Improve the open diamond sponsor spot callout (#39332) @danilo-leal -- [docs-infra] Fix Code Sandbox download issue (#39317) @ARJ2160 -- [docs-infra] Remove overflow: hidden for demo gradient bg (#39225) @oliviertassinari -- [website] Fix footer responsiveness (#39355) @danilo-leal -- [website] Host Figma redirections in the store for now @oliviertassinari - -All contributors of this release in alphabetical order: @3xp10it3r, @alexfauquette, @ARJ2160, @atharva3333, @axelbostrom, @Bestwebdesign, @brijeshb42, @chirag3003, @danilo-leal, @DarhkVoyd, @DiegoAndai, @gugudwt, @mbrookes, @michaldudak, @mj12albert, @mnajdova, @oliviertassinari, @sai6855, @samuelsycamore, @siriwatknp, @ValkonX33, @ZeeshanTamboli - -## 5.14.12 - -<!-- generated comparing v5.14.11..master --> - -_Oct 3, 2023_ - -A big thanks to the 17 contributors who made this release possible. Here are some highlights ✨: - -- 🎨 Introduced color inversion utilities to Joy UI (#38916) @siriwatknp -- 🚀 Added Chip and related TextField components to Material You @DiegoAndai, @mj12albert -- 🏗️ Improve the Select's component a11y by adding the combobox role and aria-controls attribute (#38785) @xulingzhihou. If your tests require selecting the trigger element by the "button" role, then you'll have to change it to use the "combobox" role instead - -### `@mui/material@5.14.12` - -- [DialogActions] Apply margin-left when children is not of `button` type (#39189) @sai6855 -- [Select] Improve a11y by adding combobox role and aria-controls attribute (#38785) @xulingzhihou -- [Select] Fix MenuProps slotProps forwarding (#39177) @DiegoAndai -- [TextField] Polish types in Textfield demo (#39140) @sai6855 -- [ButtonGroup] Fix rendering with conditional elements (#38989) @ZeeshanTamboli - -### `@mui/system@5.14.12` - -- [system] Add support for `variants` in the styled() util (#39073) @mnajdova -- [Box] Add missing logical spacing property types (#39169) @Semigradsky - -### `@mui/base@5.0.0-beta.18` - -- [useSlider] Align externalProps handling (#38854) @mj12albert -- [useTabs] Align external props handling for useTab/useTabPanel/useTabsList (#39037) @mj12albert -- [test] Fix import paths in useTab tests (#39291) @mj12albert - -### `@mui/material-next@6.0.0-alpha.104` - -- [Chip] Add Material You Chip component (#38927) @DiegoAndai -- [Divider] Copy v5 Divider (#39197) @mj12albert -- [FilledInput] Copy v5 FilledInput (#39040) @mj12albert -- [FormControl] Add FormControl component (#39032) @mj12albert -- [Select] Copy Select files from v5 (#39188) @DiegoAndai -- [TextField] Copy v5 TextField's inner components (#39166) @mj12albert - -### `@mui/joy@5.0.0-beta.9` - -- Introduce color inversion utilities (#38916) @siriwatknp -- Replace margin with `gap` property (#39147) @siriwatknp -- [CssBaseline] use Joy `GlobalStyles` (#39278) @siriwatknp -- [Drawer] Apply content styles from theme to content slot (#39199) @sai6855 -- [List] Add gap and missing active styles (#39146) @siriwatknp -- [Switch] Slight adjustments to the design (#39276) @danilo-leal - -### Docs - -- [docs] Update Autocomplete demo for React 18 (#39162) @oliviertassinari -- [docs-infra] Tweak feedback footer section design (#36556) @danilo-leal -- [docs-infra] Improve code syntax highlight (#39181) @oliviertassinari -- [docs][base] Add Tailwind CSS + plain CSS demo on the TextArea page (#39046) @alisasanib -- [docs][base-ui] Fix style for root div of multiline input (#39182) @ttlpta -- [docs][base-ui] Improve Select's country select demo (#38983) @oliviertassinari -- [docs][joy-ui] Add scrollable tabs example (#39260) @siriwatknp -- [docs][joy-ui] Match `Autocomplete` github label demo to actual github label dropdown (#39228) @sai6855 -- [docs][joy-ui] Refine the Rental dashboard template (#39059) @zanivan -- [docs][joy-ui] Removed incomplete sentence in the Aspect Ratio page (#39227) @Erik-McKelvey -- [docs][joy-ui] Fix typo in the Accordion page (#39226) @Erik-McKelvey -- [docs][joy-ui] Update and standardize template Sidemenus (#39271) @zanivan -- [docs][joy-ui] Add a roadmap page (#39163) @danilo-leal -- [docs][material-ui] Replace `Box` with `Stack` in applicable demos (#39174) @sai6855 -- [docs][material-ui] Add small polish to the Templates page (#39224) @danilo-leal -- [docs][material-ui] Small revision to the Icons page (#38840) @danilo-leal - -### Core - -- Add next lint config to eslint (#39183) @Janpot -- [core] Update eslint rules (#39178) @romgrk -- [core] Fix Greg GitHub slug @oliviertassinari -- [core] Priority Support casing normalization @oliviertassinari -- [website] Add Heatmap in pricing page (#39269) @oliviertassinari -- [website] Update `React Engineer - xCharts` Ashby link (#39172) @DanailH -- [website] Add Charts to the pricing table (#38680) @alexfauquette -- [website] Polish career experience @oliviertassinari -- [website] Simplify the Core products file (#39194) @danilo-leal - -All contributors of this release in alphabetical order: @alexfauquette, @brijeshb42, @DanailH, @danilo-leal, @DiegoAndai, @Erik-McKelvey, @Janpot, @mj12albert, @mnajdova, @oliviertassinari, @romgrk, @sai6855, @Semigradsky, @siriwatknp, @xulingzhihou, @zanivan, @ZeeshanTamboli - -## 5.14.11 - -<!-- generated comparing v5.14.10..master --> - -_Sep 26, 2023_ - -A big thanks to the 23 contributors who made this release possible. -This release was mostly about 🐛 bug fixes and 📚 documentation improvements. - -### `@mui/material@5.14.11` - -- [Autocomplete] Re-export `AutocompleteValue` to make it available from path import (#38638) @vadimka123 -- [Select][material-ui] Missing aria-multiselectable attribute on multiple Select component (#38855) @gitstart -- [l10n] labelDisplayedRows is added for trTR localization (#39056) @tebersefa - -### `@mui/utils@5.14.11` - -- Support RSC in `isMuiElement` util (#38129) @sai6855 - -### `@mui/base@5.0.0-beta.17` - -- [NumberInput] Support adornments (#38900) @anle9650 -- [Menu] Align external props handling for useMenu/MenuButton/MenuItem (#38946) @mj12albert -- [Select] Align external props handling (#39038) @mj12albert -- [TextareaAutosize] Simplify logic and add test (#38728) @oliviertassinari - -### `@mui/joy@5.0.0-beta.8` - -- [Button] Fix disabled button styling when component prop is provided (#38996) @sai6855 -- [Drawer] Add missing `JoyDrawer` in theme components (#39074) @Studio384 - -### `@mui/material-next@6.0.0-alpha.103` - -- [FormControl] Copy v5 FormControl (#39039) @mj12albert - -### `@mui/lab@5.0.0-alpha.146` - -- [TreeView] Fix JSDoc comments in TreeView and TreeItem (#38874) @jergason - -### Docs - -- Improve focus trap demo (#38985) @oliviertassinari -- Add Tailwind CSS + plain CSS demo on the Tabs page (#39000) @alisasanib -- Improve the default theme viewer design (#39049) @danilo-leal -- Add live demo with CssVarsProvider (#38792) @oliviertassinari -- Fix wrong hash on Card's page (#39151) @mnajdova -- Revise the Drawer page (#38988) @danilo-leal -- Simplify the button's loading indicator demo (#39082) @danilo-leal -- Fix the Templates link on the Overview page (#39086) @danilo-leal -- Refine the Sign in template (#38942) @zanivan -- Add `use-count-up` integration with the Circular Progress (#38952) @anon-phantom - -### Core - -- [blog] Add a company values blog post (#38802) @mikailaread -- [core] Downgrade lerna to 7.2.0 (#39149) @michaldudak -- [core] Simplify docs feedback interaction (#39075) @alexfauquette -- [core] Improve ref type definition (#38903) @oliviertassinari -- [core] Simplify career (#39112) @oliviertassinari -- [core] Update Babel types along with source packages (#39070) @michaldudak -- [core] Add a comment to explain `useEnhancedEffect` (#39035) @Janpot -- [docs-infra] Fix code removal in table of content (#39165) @alexfauquette -- [docs-infra] Improve callouts design (#39084) @danilo-leal -- [docs-infra] Fix key warning in Base UI Slider slots section (#38954) @ZeeshanTamboli -- [docs-infra] Fix error when redirecting to the root page (#38451) @maheshguntur -- [docs-infra] Open demo crash in the right repository (#39006) @oliviertassinari -- [test] Split the test package (#39061) @michaldudak -- [website] React Engineer - xCharts role (#38976) @DanailH -- [website] Improve the highlighter component colors (#39087) @danilo-leal -- [website] Fix Pricing page row hover (#39097) @danilo-leal -- [website] Fix typo with straight quote @oliviertassinari -- [website] Sync about page @oliviertassinari -- [website] Update the about page (#38733) @danilo-leal -- [website] Small fixes on the X marketing page (#38975) @flaviendelangle -- [website] Add stray design tweaks to the X page (#38589) @danilo-leal - -All contributors of this release in alphabetical order: @alexfauquette, @alisasanib, @anle9650, @anon-phantom, @DanailH, @danilo-leal, @DiegoAndai, @flaviendelangle, @gitstart, @Janpot, @jergason, @maheshguntur, @michaldudak, @mikailaread, @mj12albert, @mnajdova, @oliviertassinari, @sai6855, @Studio384, @tebersefa, @vadimka123, @zanivan, @ZeeshanTamboli - -## 5.14.10 - -<!-- generated comparing v5.14.9..master --> - -_Sep 18, 2023_ - -A big thanks to the 16 contributors who made this release possible. This release was mostly about 🐛 bug fixes and 📚 documentation improvements. - -### `@mui/material@5.14.10` - -- ​<!-- 20 -->[Chip] Add cursor CSS property reset (#38984) @DiegoAndai - -### `@mui/utils@5.14.10` - -- ​<!-- 05 -->[utils] Move @types/prop-types back to dependencies (#39030) @Methuselah96 - -### `@mui/base@5.0.0-beta.16` - -- ​<!-- 24 -->[NumberInput][base-ui] Warn when changing control mode with `useControlled` (#38757) @sai6855 -- ​<!-- 23 -->[Select][base-ui] Fix Select button layout shift, add placeholder prop (#38796) @mj12albert -- ​<!-- 22 -->[useList][base-ui] Accept arbitrary external props and forward to root (#38848) @mj12albert -- ​<!-- 25 -->[Autocomplete][base-ui] Added ref to getInputProps return value (#38919) @DarhkVoyd - -### `@mui/joy@5.0.0-beta.7` - -- ​<!-- 26 -->[AccordionGroup][joy-ui] Fix console warning when using custom color (#38950) @sai6855 -- ​<!-- 07 -->[GlobalStyles][joy-ui] Ensure compatibility with RSC (#38955) @mateuseap - -### Docs - -- ​<!-- 21 -->[docs][base] Add Tailwind CSS + plain CSS demo on the NumberInput page (#38928) @alisasanib -- ​<!-- 13 -->[docs][Dialog] Add non-modal dialog docs & demo (#38684) @mnajdova -- ​<!-- 12 -->[docs] Fix number input wrong demo @oliviertassinari -- ​<!-- 11 -->[docs] Exclude joy-ui LinearProgressCountup from visual regression (#38969) @siriwatknp -- ​<!-- 09 -->[docs][joy-ui] Revise the Overview page (#38842) @danilo-leal -- ​<!-- 08 -->[docs][material-ui][Pagination] Add `TablePagination` to the API components list (#38486) @MonstraG - -### Core - -- ​<!-- 19 -->[core] Add more context about useEventCallback @oliviertassinari -- ​<!-- 18 -->[core] Allow deeper import of @mui/utils (#38806) @oliviertassinari -- ​<!-- 17 -->[core] Remove react-dom from @mui/utils peerDependencies (#38974) @michaldudak -- ​<!-- 16 -->[core] Remove react from styled-engine dependencies (#38971) @michaldudak -- ​<!-- 15 -->[core] Fix image loading bug on Safari @oliviertassinari -- ​<!-- 14 -->[core] Fix bundle size upload to S3 job (#38956) @Janpot -- ​<!-- 20 -->[core] Move eslint to peer dependencies of eslint-plugin-material-ui (#39033) @michaldudak -- ​<!-- 10 -->[docs-infra] Display markdown lists correctly in docs for props description (#38973) @ZeeshanTamboli -- ​<!-- 04 -->[website] Improve lighthouse score (#39011) @oliviertassinari -- ​<!-- 03 -->[website] Fix lighthouse issues @oliviertassinari -- ​<!-- 02 -->[website] Create the `InfoCard` component (#38987) @danilo-leal -- ​<!-- 01 -->[website] Small tweaks for performance @oliviertassinari -- ​<!-- 06 -->[zero][next] Setup nextjs plugin package (#38852) @brijeshb42 - -All contributors of this release in alphabetical order: @alisasanib, @brijeshb42, @danilo-leal, @DarhkVoyd, @DiegoAndai, @Janpot, @mateuseap, @Methuselah96, @michaldudak, @mj12albert, @mnajdova, @MonstraG, @oliviertassinari, @sai6855, @siriwatknp, @ZeeshanTamboli - -## 5.14.9 - -<!-- generated comparing v5.14.8..master --> - -_Sep 13, 2023_ - -A big thanks to the 18 contributors who made this release possible. Here are some highlights ✨: - -- 🎉 Added the [`Drawer` component](https://mui.com/joy-ui/react-drawer/) to Joy UI (#38169) @mnajdova -- ✨ Material UI's [`ButtonGroup` component](https://mui.com/material-ui/react-button-group/) now styles button elements within it correctly (#38520) @ZeeshanTamboli - -### `@mui/material@5.14.9` - -- ​<!-- 44 -->[ButtonGroup] Determine first, last and middle buttons to support different elements with correct styling (#38520) @ZeeshanTamboli -- ​<!-- 07 -->[Modal] Fix console warning when onTransitionEnter , onTransitionExit provided (#38868) @sai6855 -- ​<!-- 54 -->Revert "[Autocomplete] Type multiple values with readonly arrays." (#38827) @mnajdova -- ​<!-- 57 -->[Tabs] Scrollable tabs shouldn't crash when customizing their styles in the theme with slot callbacks (#38544) @brentertz -- ​<!-- 59 -->[AlertTitle][BreadCrumbs] Fix inheritance message in docs (#38876) @sai6855 - -### `@mui/base@5.0.0-beta.15` - -- ​<!-- 63 -->[useSnackbar] Align externalProps handling (#38935) @mj12albert -- ​<!-- 48 -->[useInput] Align ExternalProps naming (#38849) @mj12albert -- ​<!-- 13 -->[FocusTrap] Refactor & cleanup (#38878) @mnajdova -- ​<!-- 12 -->[FocusTrap] Fix `disableEnforceFocus` behavior (#38816) @mnajdova -- ​<!-- 06 -->[Switch] Simplify source (#38910) @oliviertassinari - -### `@mui/joy@5.0.0-beta.6` - -- ​<!-- 15 -->[Drawer] Add Drawer component (#38169) @mnajdova -- ​<!-- 11 -->Reduce height of some variants (#38527) @zanivan -- ​<!-- 10 -->Refine the default theme color palette (#38416) @zanivan -- ​<!-- 34 -->[Dialog] Add `DialogActions`, `DialogTitle` and `DialogContent` (#38382) @siriwatknp -- ​<!-- 60 -->[AccordionGroup] Add missing `variant` and `color` classes (#38814) @sai6855 - -### `@mui/lab@5.0.0-alpha.144` - -- ​<!-- 09 -->Add TypeScript deprecations (#38833) @oliviertassinari -- ​<!-- 08 -->Fix `@mui/x-tree-view` dependency (#38822) @flaviendelangle - -### `@mui/system@5.14.9` - -- ​<!-- 05 -->Remove dead code (#38884) @oliviertassinari -- ​<!-- 04 -->Remove getInitColorSchemeScript leading spaces (#38794) @oliviertassinari - -### `@mui/zero-vite-plugin@0.0.1-alpha.0` - -- ​<!-- 02 -->[vite] Create a package for vite plugin (#38685) @brijeshb42 - -### Docs - -- ​<!-- 53 -->[docs][base-ui] Improve recommended usage guide (#38570) @oliviertassinari -- ​<!-- 52 -->[docs][base-ui] Create hooks contribution guide (#38679) @michaldudak -- ​<!-- 51 -->[docs][base-ui] Structure and style revisions for Component docs (#38826) @samuelsycamore -- ​<!-- 50 -->[docs][base-ui] Add Number Input to the all components page (#38839) @danilo-leal -- ​<!-- 49 -->[docs][base-ui] Mark Popup with the Preview tag (#38851) @michaldudak -- ​<!-- 47 -->[blog] Polish component reference name @oliviertassinari -- ​<!-- 46 -->[blog] Fix missing card (#38834) @oliviertassinari -- ​<!-- 45 -->[Button][docs][material-ui] Update the file upload demo (#38823) @danilo-leal -- ​<!-- 33 -->[docs][DialogTitle] Fix props docs doesn't mention it extends `Typography` props (#38856) @sai6855 -- ​<!-- 32 -->[docs] Improve npm experience (#38906) @oliviertassinari -- ​<!-- 31 -->[docs] Fix redirection to Base UI URLs @oliviertassinari -- ​<!-- 30 -->[docs] Fix use of callouts (#38747) @oliviertassinari -- ​<!-- 29 -->[docs] Fix 301 links for SEO @oliviertassinari -- ​<!-- 28 -->[docs] Remove flag from installation page @oliviertassinari -- ​<!-- 27 -->[docs] Fix strange break line on mobile in between product name @oliviertassinari -- ​<!-- 26 -->[docs] Clearer npm package homepages (#38864) @oliviertassinari -- ​<!-- 25 -->[docs] enableColorScheme prop was removed (#38795) @oliviertassinari -- ​<!-- 24 -->[docs] Fix a11y issues in tables demos (#38829) @michaldudak -- ​<!-- 62 -->[docs][joy-ui] Refine the Messages template (#38807) @zanivan -- ​<!-- 22 -->[docs][joy-ui] Fix copy on the Tutorial page (#38907) @danilo-leal -- ​<!-- 21 -->[docs][joy-ui] Fix grammar and update Usage section in color inversion page (#38850) @ZeeshanTamboli -- ​<!-- 20 -->[docs][joy-ui] Revise the Lists page (#36324) @LadyBluenotes -- ​<!-- 19 -->[docs][joy-ui] Refine the Profile Dashboard template (#38599) @zanivan -- ​<!-- 18 -->[docs][material-ui] Revise the Paper component docs (#38841) @danilo-leal -- ​<!-- 17 -->[docs][material-ui] Revise the Typography page (#38543) @danilo-leal -- ​<!-- 16 -->[docs][material-ui] Revise and split up "Styled engine" doc (#37774) @samuelsycamore -- ​<!-- 03 -->[TextareaAutosize][docs] Fix component creation in render (#38577) @oliviertassinari - -### Examples - -- ​<!-- 14 -->[examples] Add shortcut to open example in online IDE (#38572) @oliviertassinari -- ​<!-- 61 -->[examples][base-ui] Add Base UI + Vite + Tailwind CSS example in TypeScript (#37595) @dvkam - -### Core - -- ​<!-- 65 -->[core] Remove package declaration from same package dependencies (#38951) @DiegoAndai -- ​<!-- 64 -->[core] Remove workspace dependencies from root package.json (#38940) @michaldudak -- ​<!-- 43 -->[core] Fix prop-types generation (#38831) @flaviendelangle -- ​<!-- 42 -->[core] Move types packages to docs' devDependencies (#38914) @michaldudak -- ​<!-- 41 -->[core] Improve DX when browsing the package on npm and GitHub @oliviertassinari -- ​<!-- 40 -->[core] TrapFocus was renamed to FocusTrap @oliviertassinari -- ​<!-- 39 -->[core] Add types extension for clarity @oliviertassinari -- ​<!-- 38 -->[core] Hoist rewriteImportPaths to parent scope @oliviertassinari -- ​<!-- 37 -->[core] Bump aws-cli orb to 4.1 (#38857) @Janpot -- ​<!-- 36 -->[core] Explicitly define package dependencies (#38859) @michaldudak -- ​<!-- 35 -->[core] Fix yarn docs:create-playground script @oliviertassinari -- ​<!-- 56 -->[docs-infra] Improve show code button affordance (#38824) @danilo-leal -- ​<!-- 55 -->[docs–infra] Fix callout container width (#38880) @oliviertassinari -- ​<!-- 23 -->[docs-infra] Catch duplicated trailing splashes in links (#38758) @oliviertassinari -- ​<!-- 01 -->[website] add Michel Engelen to the about us page (#38818) @michelengelen -- ​<!-- 58 -->[website] Add a templates & design kits section to the Material UI page (#38617) @danilo-leal - -All contributors of this release in alphabetical order: @brentertz, @brijeshb42, @danilo-leal, @DiegoAndai, @dvkam, @flaviendelangle, @Janpot, @LadyBluenotes, @michaldudak, @michelengelen, @mj12albert, @mnajdova, @oliviertassinari, @sai6855, @samuelsycamore, @siriwatknp, @zanivan, @ZeeshanTamboli - -## 5.14.8 - -<!-- generated comparing v5.14.7..master --> - -_Sep 5, 2023_ - -A big thanks to the 25 contributors who made this release possible. - -### `@mui/material@5.14.8` - -- ​<!-- 53 -->ImageItemList fix incorrect (below) rendering (#38452) @omriklein -- ​<!-- 42 -->[Button] Add demo for file upload (#38786) @anle9650 -- ​<!-- 12 -->[Slider] Add missing classes for `Slider` `InputLabel` `InputBase` `Radio` (#38401) @sai6855 -- ​<!-- 11 -->[Select] Merge slotProps.paper with internal Paper props (#38703) @michaldudak -- ​<!-- 09 -->[Tabs] Fix `ref` type (#38717) @ZeeshanTamboli -- ​<!-- 08 -->[TabScrollButton] Extend ButtonBase types (#38719) @ZeeshanTamboli - -### `@mui/base@5.0.0-beta.14` - -- ​<!-- 50 -->[Autocomplete] Type multiple values with readonly arrays. (#38253) @pcorpet -- ​<!-- 07 -->[TextField] Fix unstable height of memoized multiline TextField component (#37135) @amal-qb - -### `@mui/joy@5.0.0-beta.5` - -- ​<!-- 53 -->[Accordion] Fix incorrect display of classname (#38695) @sai6855 -- ​<!-- 51 -->[AspectRatio] Correct `ratio` prop description (#38743) @sai6855 -- ​<!-- 43 -->[Button] Fix disablity of button (#38673) @sai6855 -- ​<!-- 35 -->[design] Stray design tweaks to components (#38476) @zanivan -- ​<!-- 05 -->[Typography] Added position only when Skeleton is a direct child (#38799) @siriwatknp - -### `@mui/lab@5.0.0-alpha.143` - -- ​<!-- 06 -->[TreeView] Use Tree View from MUI X in the lab (#38261) @flaviendelangle -- ​<!-- 13 -->[LoadingButton] Fix HTML rule button > div forbidden nesting (#38584) @oliviertassinari - -### `@mui/system@5.14.8` - -- ​<!-- 11 -->[system] Fix the inconsistent types of the `mergeBreakpointsInOrder` function (#38749) @imevanc -- ​<!-- 10 -->[system] Fix maxWidth incorrectly resolving breakpoints with non-pixel units (#38633) @mj12albert -- ​<!-- 05 -->[typescript] Introduce \*OwnProps interfaces for components (#36798) @szalonna - -### Docs - -- ​<!-- 52 -->Update changelog (#38704) @mj12albert -- ​<!-- 49 -->[docs][Autocomplete] Require referentially stable value (#38734) @michaldudak -- ​<!-- 48 -->[docs][base-ui] Add type parameter to the button in prepareForSlot demo (#38640) @michaldudak -- ​<!-- 47 -->[docs][base-ui] Fix the broken image in the Tailwind CSS guide (#38721) @michaldudak -- ​<!-- 46 -->[docs][base-ui]: Working With Tailwind Guide - revises example code to avoid import errors (#38693) @christophermorin -- ​<!-- 45 -->[docs][base] Add Tailwind CSS + plain CSS demo on the Menu page (#38618) @alisasanib -- ​<!-- 44 -->[blog] Clearer blog release title @oliviertassinari -- ​<!-- 43 -->[blog] Add a post for the Tree View migration (#38407) @flaviendelangle -- ​<!-- 34 -->[docs] Fix broken links to Next.js docs (#38764) @ruflair -- ​<!-- 33 -->[docs] Trim trailing whitespace (#38793) @oliviertassinari -- ​<!-- 32 -->[docs] Fix a typo in lab-tree-view-to-mui-x.md @mbrookes -- ​<!-- 31 -->[docs] Clean up not used Usage files (#38715) @danilo-leal -- ​<!-- 30 -->[docs] Improve theme builder exceptions (#38709) @jyash97 -- ​<!-- 29 -->[docs] Polish Slider demos (#38759) @oliviertassinari -- ​<!-- 28 -->[docs] Fix Joy UI docs link regression (#38761) @oliviertassinari -- ​<!-- 27 -->[docs] Fix typo @oliviertassinari -- ​<!-- 26 -->[docs] Fix e.g. typo (#38748) @oliviertassinari -- ​<!-- 25 -->[docs] Fix Next.js pages router example redirect link (#38750) @sai6855 -- ​<!-- 24 -->[docs] Fix SEO issue broken links @oliviertassinari -- ​<!-- 23 -->[docs] Improve SSR example reference (#38651) @oliviertassinari -- ​<!-- 17 -->[docs][joy-ui] Integrate a count-up feature to the Linear Progress (#38738) @anon-phantom -- ​<!-- 16 -->[docs][joy-ui] Fix Link's `overlay` prop demo (#38702) @danilo-leal -- ​<!-- 15 -->[docs][joy-ui] Polish the Stack page (#38623) @danilo-leal -- ​<!-- 14 -->[docs][material-ui] Adjust simple Slide demo (#38646) @rajgop1 - -### Core - -- ​<!-- 43 -->[core] Re-add nx and setup build caching (#38752) @brijeshb42 -- ​<!-- 41 -->[core] Remove dead code seoTitle @oliviertassinari -- ​<!-- 40 -->[core] Use immutable refs (#38762) @oliviertassinari -- ​<!-- 39 -->[core] Rework `typescript-to-proptypes` to share the AST parsing with `parseStyles` (#38517) @flaviendelangle -- ​<!-- 38 -->[core] Fix CI @oliviertassinari -- ​<!-- 37 -->[core] Remove unnecessary `@types/webpack` package (#38720) @ZeeshanTamboli -- ​<!-- 36 -->[core] Remove duplicate prop @oliviertassinari - -- ​<!-- 22 -->[docs-infra] Fix mobile display in CodeSandbox (#38767) @oliviertassinari -- ​<!-- 21 -->[docs-infra] Remove legacy GA (#37579) @alexfauquette -- ​<!-- 20 -->[docs-infra] Fix emotion :first-child console log (#38690) @oliviertassinari -- ​<!-- 19 -->[docs-infra] Fix leaking callout content (#38712) @danilo-leal -- ​<!-- 18 -->[docs-infra] Remove emoji from callouts (#38694) @danilo-leal - -- ​<!-- 04 -->[website] Fix out of date discount value @oliviertassinari -- ​<!-- 03 -->[website] Fix out-of-date label on Toolpad (#38744) @bharatkashyap -- ​<!-- 02 -->[website] Fine-tune branding buttons box shadows (#38731) @danilo-leal -- ​<!-- 01 -->[website] Fix pricing table style (#38681) @alexfauquette - -All contributors of this release in alphabetical order: @alexfauquette, @alisasanib, @amal-qb, @anle9650, @anon-phantom, @bharatkashyap, @brijeshb42, @christophermorin, @danilo-leal, @flaviendelangle, @imevanc, @jyash97, @mbrookes, @michaldudak, @mj12albert, @oliviertassinari, @omriklein, @pcorpet, @rajgop1, @ruflair, @sai6855, @siriwatknp, @szalonna, @zanivan, @ZeeshanTamboli - -## 5.14.7 - -<!-- generated comparing v5.14.6..master --> - -_Aug 29, 2023_ - -A big thanks to the 11 contributors who made this release possible. This release focuses primarily on 🐛 bug fixes, 📚 documentation, and ⚙️ infrastructure improvements. - -### `@mui/material@5.14.7` - -- [Autocomplete] Fix listbox opened unexpectedly when component is `disabled` (#38611) @mj12albert -- [Select][material-ui] Fix select menu moving on scroll when disableScrollLock is true (#37773) @VishruthR - -### `@mui/base@5.0.0-beta.13` - -- [useButton][base-ui] Accept arbitrary props in getRootProps and forward them (#38475) @DiegoAndai - -### `@pigment-css/react@0.0.1-alpha.1` - -- [system][zero][tag] Add support for sx prop (#38535) @brijeshb42 - -### Docs - -- [docs] Number Input docs fixes (#38521) @mj12albert -- [docs] Show all the code in the usage section (#38691) @oliviertassinari -- [docs][joy-ui] Change the customization and how-to guides docs tree (#38396) @danilo-leal -- [docs][lab][LoadingButton] Improve `loading` prop documentation (#38625) @sai6855 -- [docs][material-ui] Format `key` prop JSDoc description in `Snackbar` component code correctly (#38603) @jaydenseric - -### Core - -- [core] Add use-client to custom icons (#38132) @mj12albert -- [core] Remove unnecessary `@types/jsdom` (#38657) @renovate[bot] -- [core] Improve sponsors GA labels (#38649) @oliviertassinari -- [core] Fix ESM issues with regression tests (#37963) @Janpot -- [core] Potential fix for intermittent ci crashes in e2e test (#38614) @Janpot -- [docs-infra] Mark unstable components with a chip in the nav drawer (#38573) @michaldudak -- [docs-infra] Adjust the Material You playground demo design (#38636) @danilo-leal -- [docs-infra] Hide the SkipLink button if user prefers reduced motion (#38632) @DerTimonius -- [website] Add tiny fixes the homepage Sponsors section (#38635) @danilo-leal - -All contributors of this release in alphabetical order: @brijeshb42, @danilo-leal, @DerTimonius, @DiegoAndai, @Janpot, @jaydenseric, @mj12albert, @oliviertassinari, @renovate[bot], @sai6855, @VishruthR - -## 5.14.6 - -<!-- generated comparing v5.14.5..master --> - -_Aug 23, 2023_ - -A big thanks to the 21 contributors who made this release possible. Here are some highlights ✨: - -- 🚀 Added the [Popup](https://mui.com/base-ui/react-popup/) component to Base UI (#37960) @michaldudak - It's intended to replace the Popper component, which uses the deprecated Popper JS library. The Popup is built on top of Floating UI and has a similar API to the Popper. -- 🚀 Added the [Accordion](https://mui.com/joy-ui/react-accordion/) component to Joy UI (#38164) @siriwatknp -- 🚀 Added InputBase and ButtonBase components to `material-next` (#38319) @DiegoAndai @mj12albert -- 🔋 First iteration on the zero-runtime styling engine compatible with Server Components (#38378) @brijeshb42 - -### `@mui/material@5.14.6` - -- [Modal] Update it to use the useModal hook (#38498) @mnajdova -- [Select] Add `root` class to `SelectClasses` (#38424) @sai6855 -- [Skeleton] Soften the pulse animation (#38506) @oliviertassinari -- [TextField] Fix onClick regressions handling changes (#38474) @mj12albert -- [TextField] Fix TextField onClick test (#38597) @mj12albert - -### `@mui/base@5.0.0-beta.12` - -- [Popup] New component (#37960) @michaldudak - -### `@mui/joy@5.0.0-beta.3` - -- [Accordion] Add Joy UI Accordion components (#38164) @siriwatknp -- [Select] Add `required` prop (#38167) @siriwatknp -- Miscellaneous fixes (#38462) @siriwatknp - -### `@mui/material-next@6.0.0-alpha.98` - -- [ButtonBase] Add ButtonBase component (#38319) @DiegoAndai -- [Input] Add InputBase component (#38392) @mj12albert - -### `@pigment-css/react@0.0.1-alpha.0` - -- Implementation of styled tag processor for linaria (#38378) @brijeshb42 - -### Docs - -- [blog] Clarify tree view move @oliviertassinari -- [docs] Improve the "Understanding MUI packages" page images (#38619) @danilo-leal -- [docs][base-ui] Revise the structure of the Component docs (#38529) @samuelsycamore -- [docs][base-ui] Fix Menu Hooks demo (#38479) @homerchen19 -- [docs][base-ui] Correct the MUI System quickstart example (#38496) @michaldudak -- [docs][base-ui] Add Tailwind & plain CSS demos for Autocomplete page (#38157) @mj12albert -- [docs][base-ui] Add Tailwind CSS + plain CSS demo on the Input page (#38302) @alisasanib -- [docs][base-ui] Add Tailwind CSS + plain CSS demo on the Snackbar, Badge, Switch pages (#38425) @alisasanib -- [docs][base-ui] Add Tailwind CSS + plain CSS demo on the Slider page (#38413) @alisasanib -- [docs][base-ui] Add Tailwind CSS + plain CSS demo on the Select page (#38367) @alisasanib -- [docs][joy-ui] Fix typo: Classname -> Class name for consistency (#38510) @alexfauquette -- [docs][joy-ui] Revise the theme color page (#38402) @danilo-leal -- [docs][joy-ui] Sort templates by popularity (#38490) @oliviertassinari -- [docs][joy-ui] Fix the `fullWidth` prop description for the Input (#38545) @0xturner -- [docs][joy-ui] Updated the List playground demo (#38499) @zanivan -- [docs][joy-ui] Changed bgcolor of the Playground demo (#38502) @zanivan -- [docs][material-ui] Fix key warning in SimpleDialog demo (#38580) @ZeeshanTamboli -- [docs][material-ui] Fixed Google Fonts link for material two-tone icons in CodeSandbox and Stackblitz (#38247) @ZeeshanTamboli -- [docs][material-ui] Fix the Drawer's `onClose` API docs (#38273) @johnmatthiggins -- [docs][material-ui] Improve nav link tab example (#38315) @oliviertassinari -- [docs][material-ui] Fix missing import in the styled engine guide (#38450) @codersjj -- [docs][material-ui][Dialog] Improve screen reader announcement of Customized Dialog (#38592) @ZeeshanTamboli -- [docs] Add 3rd party libraries integration examples for Joy Input (#38541) @siriwatknp -- [docs] Hide translation call to action (#38449) @cristianmacedo -- [docs] Fix codemod name in changelog of v5.14.4 (#38593) @GresilleSiffle -- [docs] More space for theme builder (#38532) @oliviertassinari -- [docs] Fix the math symbol of the width sx prop range @oliviertassinari -- [docs] Fix typo on a11y section of Tabs @oliviertassinari -- [docs] Clarify System peer dependencies @oliviertassinari -- [docs] Fix horizontal scrollbar @oliviertassinari -- [docs] Code style convention @oliviertassinari -- [docs] Fix typo in Base UI @oliviertassinari -- [docs] Update the backers page (#38505) @danilo-leal -- [docs] Add stray design adjustments to the docs (#38501) @danilo-leal -- [docs] Use IBM Plex Sans in Tailwind CSS demos (#38464) @mnajdova -- [docs] Fix SEO issues reported by ahrefs (#38423) @oliviertassinari - -### Examples - -- [examples] Start to remove Gatsby (#38567) @oliviertassinari -- [examples][joy-ui] Fix Joy UI example CLI (#38531) @oliviertassinari -- [examples][joy-ui] Improve example when using Next Font (#38540) @mwskwong - -### Core - -- [changelog] Fix issues in highlight @oliviertassinari -- [core] Remove redundant `@material-ui/` aliases from regression test Webpack config (#38574) @ZeeshanTamboli -- [core] Fix CI error @oliviertassinari -- [core] Remove unnecessary Box (#38461) @oliviertassinari -- [core] Set GitHub Action top level permission @oliviertassinari -- [docs-infra][joy-ui] Polish the usage and CSS vars playgrounds (#38600) @danilo-leal -- [docs-infra] Support link title (#38579) @oliviertassinari -- [docs-infra] Fix ad layout shift (#38622) @oliviertassinari -- [docs-infra] Add light tweaks to the ad container (#38504) @danilo-leal -- [docs-infra] Fix anchor scroll without tabs (#38586) @oliviertassinari -- [docs-infra] Retain velocity animation speed (#38470) @oliviertassinari -- [docs-infra] Follow import and CSS token standard (#38508) @oliviertassinari -- [docs-infra] Add icon to callouts (#38525) @alexfauquette -- [docs-infra] Fix the anchor link on headings (#38528) @danilo-leal -- [docs-infra] Cleanup code on demo code block expansion (#38522) @ZeeshanTamboli -- [docs-infra] Improve the heading buttons positioning (#38428) @danilo-leal -- [docs-infra] Customize the blockquote design (#38503) @danilo-leal -- [docs-infra] Improve the alert before a negative feedback (#38500) @danilo-leal -- [docs-infra] Fix GoogleAnalytics missing event for code copy (#38469) @alexfauquette -- [docs-infra] Improve affordance on the code block expansion (#38421) @danilo-leal -- [website] Fine-tune the branding theme buttons (#38588) @danilo-leal -- [website] Improve the Base UI hero section demo (#38585) @danilo-leal -- [website] Add stray design improvements to the Material UI page (#38590) @danilo-leal -- [website] Fix mobile view Material UI page (#38568) @oliviertassinari -- [website] Fix reference to the data grid @oliviertassinari -- [website] Configure Apple Pay @oliviertassinari -- [website] Fix template link on the homepage (#38471) @danilo-leal - -All contributors of this release in alphabetical order: @0xturner, @alexfauquette, @alisasanib, @brijeshb42, @codersjj, @cristianmacedo, @danilo-leal, @DiegoAndai, @GresilleSiffle, @homerchen19, @johnmatthiggins, @michaldudak, @mj12albert, @mnajdova, @mwskwong, @oliviertassinari, @sai6855, @samuelsycamore, @siriwatknp, @zanivan, @ZeeshanTamboli - -## 5.14.5 - -<!-- generated comparing v5.14.4..master --> - -_Aug 14, 2023_ - -A big thanks to the 17 contributors who made this release possible. Here are some highlights ✨: - -- @mnajdova [made it easier to use third-party components in Base UI slots](https://mui.com/base-ui/getting-started/customization/#overriding-subcomponent-slots) with the introduction of the `prepareForSlot` utility (#38138) - -### `@mui/material@5.14.5` - -- ​<!-- 04 -->[TextField] Fix to handle `onClick` on root element (#38072) @LukasTy - -### `@mui/codemod@5.14.5` - -- ​<!-- 31 -->[codemod] Add v5.0.0/tree-view-moved-to-x codemod (#38248) @flaviendelangle - -### `@mui/joy@5.0.0-beta.2` - -- ​<!-- 07 -->[Input][joy-ui] Fix the `FormHelperText` icon color (#38387) @TheNatkat -- ​<!-- 06 -->[Skeleton][joy-ui] Soften the pulse animation (#38384) @zanivan -- ​<!-- 05 -->[TabPanel][joy-ui] Add `keepMounted` prop (#38293) @decadef20 - -### `@mui/base@5.0.0-beta.11` - -- ​<!-- 30 -->[base-ui] Remove the legacy Extend\* types (#38184) @michaldudak -- ​<!-- 29 -->[base-ui] Add `useModal` hook (#38187) @mnajdova -- ​<!-- 28 -->[base-ui] Add `prepareForSlot` util (#38138) @mnajdova -- ​<!-- 26 -->[useButton][base-ui] Fix tabIndex not being forwarded (#38417) @DiegoAndai -- ​<!-- 25 -->[useButton][base-ui] Fix onFocusVisible not being handled (#38399) @DiegoAndai - -### Docs - -- ​<!-- 32 -->[blog] Blog post for MUI X mid v6. Date Pickers, Data Grid, and Charts (#38241) @richbustos -- ​<!-- 35 -->[docs][base-ui] Update number input API docs (#38363) @mj12albert -- ​<!-- 29 -->[docs] Improve page transition speed (#38394) @oliviertassinari -- ​<!-- 28 -->[docs] Improve examples (#38398) @oliviertassinari -- ​<!-- 19 -->[docs][docs] Add `FileUpload` demo (#38420) @sai6855 -- ​<!-- 18 -->[docs][joy-ui] Refine the Order Dashboard template design (#38395) @zanivan -- ​<!-- 17 -->[docs][material-ui][joy-ui] Simplify the Quickstart section on the Usage page (#38385) @danilo-leal -- ​<!-- 16 -->[docs][Menu][joy] Explain how to control the open state (#38355) @michaldudak -- ​<!-- 15 -->[docs][material] Revise the Support page (#38207) @samuelsycamore -- ​<!-- 14 -->[docs][material-ui] Remove incorrect `aria-label`s in extended variant examples of Floating Action Button (#37170) @ashleykolodziej -- ​<!-- 13 -->[docs][material-ui] Adjust slightly the installation page content (#38380) @danilo-leal -- ​<!-- 12 -->[docs][Switch] Fix the readOnly class name in docs (#38277) @michaldudak -- ​<!-- 11 -->[docs][TablePagination] Add Tailwind CSS & plain CSS introduction demo (#38286) @mnajdova - -### Examples - -- ​<!-- 10 -->[examples] Add Joy UI + Vite.js + TypeScript example app (#37406) @nithins1 - -### Core - -- ​<!-- 30 -->[core] Consistent URL add leading / @oliviertassinari -- ​<!-- 27 -->[docs-infra] Fix rebase issue @oliviertassinari -- ​<!-- 26 -->[docs-infra] Fix typo in docs infra docs @oliviertassinari -- ​<!-- 25 -->[docs-infra] Fix nested list margin (#38456) @oliviertassinari -- ​<!-- 24 -->[docs-infra] Move the Diamond Sponsors to the TOC (#38410) @danilo-leal -- ​<!-- 22 -->[docs-infra] Move imports into page data (#38297) @alexfauquette -- ​<!-- 21 -->[docs-infra] Adjust heading styles (#38365) @danilo-leal -- ​<!-- 20 -->[docs-infra] Fix info callout border color (#38370) @danilo-leal -- ​<!-- 05 -->[website] Upgrade the homepage hero demos design (#38388) @danilo-leal -- ​<!-- 04 -->[website] Improve Base UI hero section demo (#38255) @danilo-leal -- ​<!-- 03 -->[website] Fix EmailSubscribe look (#38429) @oliviertassinari -- ​<!-- 02 -->[website] Link Discord in footer (#38369) @richbustos -- ​<!-- 01 -->[website] Clean up the `GetStartedButtons` component (#38256) @danilo-leal - -All contributors of this release in alphabetical order: @alexfauquette, @ashleykolodziej, @danilo-leal, @decadef20, @DiegoAndai, @flaviendelangle, @LukasTy, @michaldudak, @mj12albert, @mnajdova, @nithins1, @oliviertassinari, @richbustos, @sai6855, @samuelsycamore, @TheNatkat, @zanivan - -## 5.14.4 - -<!-- generated comparing v5.14.3..master --> - -_Aug 8, 2023_ - -A big thanks to the 18 contributors who made this release possible. Here are some highlights ✨: - -- 🎉 Added [Number Input](https://mui.com/base-ui/react-number-input/) component & [useNumberInput](https://mui.com/base-ui/react-number-input/#hook) hook in [Base UI](https://mui.com/base-ui/getting-started/) @mj12albert - -### `@mui/material@5.14.4` - -- ​<!-- 25 -->[Checkbox][material] Add size classes (#38182) @michaldudak -- ​<!-- 03 -->[Typography] Improve inherit variant logic (#38123) @ZeeshanTamboli - -### `@mui/system@5.14.4` - -- ​<!-- 34 -->Revert "[Box] Remove `component` from TypeMap (#38168)" (#38356) @michaldudak - -### `@mui/base@5.0.0-beta.10` - -#### Breaking changes - -- ​<!-- 32 -->[base] Ban default exports (#38200) @michaldudak - - Base UI default exports were changed to named ones. Previously we had a mix of default and named ones. - This was changed to improve consistency and avoid problems some bundlers have with default exports. - See https://github.com/mui/material-ui/issues/21862 for more context. - - ```diff - - import Button, { buttonClasses } from '@mui/base/Button'; - + import { Button, buttonClasses } from '@mui/base/Button'; - - import BaseMenu from '@mui/base/Menu'; - + import { Menu as BaseMenu } from '@mui/base/Menu'; - ``` - - Additionally, the `ClassNameGenerator` has been moved to the directory matching its name: - - ```diff - - import ClassNameGenerator from '@mui/base/className'; - + import { ClassNameGenerator } from '@mui/base/ClassNameGenerator'; - ``` - - A codemod is provided to help with the migration: - - ```bash - npx @mui/codemod@latest v5.0.0/base-use-named-exports <path> - ``` - -#### Changes - -- ​<!-- 31 -->[base] Create useNumberInput and NumberInput (#36119) @mj12albert -- ​<!-- 28 -->[Select][base] Fix flicker on click of controlled Select button (#37855) @VishruthR -- ​<!-- 09 -->[Dropdown] Fix imports of types (#38296) @yash-thakur - -### `@mui/joy@5.0.0-beta.1` - -- ​<!-- 06 -->[joy-ui][MenuButton] Fix disable of `MenuButton` (#38342) @sai6855 - -### Docs - -- ​<!-- 33 -->[docs][AppBar] Fix `ResponsiveAppBar` demo logo href (#38346) @iownthegame -- ​<!-- 30 -->[docs][base] Add Tailwind CSS + plain CSS demo on the Button page (#38240) @alisasanib -- ​<!-- 29 -->[docs][Menu][base] Remove `Unstyled` prefix from demos' function names (#38270) @sai6855 -- ​<!-- 22 -->[docs] Add themeable component guide (#37908) @siriwatknp -- ​<!-- 21 -->[docs] Fix Joy UI demo background color (#38307) @oliviertassinari -- ​<!-- 20 -->[docs] Update API docs for Number Input component (#38301) @ZeeshanTamboli -- ​<!-- 14 -->[docs][joy-ui] Revise the theme typography page (#38285) @danilo-leal -- ​<!-- 13 -->[docs][joy-ui] Add TS demo for Menu Bar (#38308) @sai6855 -- ​<!-- 10 -->[docs][joy-ui] Updated Typography callout at getting started (#38289) @zanivan -- ​<!-- 12 -->[docs][joy-ui] Fix the Inter font installation instructions (#38284) @danilo-leal -- ​<!-- 11 -->[docs][material] Add note to Autocomplete about ref forwarding (#38305) @samuelsycamore -- ​<!-- 05 -->[docs][Skeleton] Make the demos feel more realistic (#38212) @oliviertassinari - -- ​<!-- 08 -->[examples] Swap Next.js examples between App Router and Pages Router; update naming convention (#38204) @samuelsycamore -- ​<!-- 07 -->[examples][material-ui] Add Material UI + Next.js (App Router) example in JS (#38323) @samuelsycamore -- ​<!-- 27 -->[blog] Discord announcement blog (#38258) @richbustos -- ​<!-- 26 -->[blog] Fix 301 links to Toolpad @oliviertassinari -- ​<!-- 04 -->[website] Updating Charts demo with real charts usage for MUI X marketing page (#38317) @richbustos -- ​<!-- 03 -->[website] Adjust styles of the Product section on the homepage (#38366) @danilo-leal -- ​<!-- 02 -->[website] Add Nora teamMember card to 'About' (#38358) @noraleonte -- ​<!-- 01 -->[website] Fix image layout shift (#38326) @oliviertassinari - -### Core - -- ​<!-- 24 -->[core] Fix docs demo export function consistency (#38191) @oliviertassinari -- ​<!-- 23 -->[core] Fix the link-check script on Windows (#38276) @michaldudak -- ​<!-- 26 -->[core] Use @testing-library/user-event direct API (#38325) @mj12albert -- ​<!-- 29 -->[core] Port GitHub workflow for ensuring triage label is present (#38312) @DanailH -- ​<!-- 19 -->[docs-infra] Consider files ending with .types.ts as props files (#37533) @mnajdova -- ​<!-- 18 -->[docs-infra] Fix skip to content design (#38304) @oliviertassinari -- ​<!-- 17 -->[docs-infra] Add a general round of polish to the API content display (#38282) @danilo-leal -- ​<!-- 16 -->[docs-infra] Make the side nav collapse animation snappier (#38259) @danilo-leal -- ​<!-- 15 -->[docs-infra] New Component API design followup (#38183) @cherniavskii -- ​<!-- 06 -->[test] Remove unnecessary `async` keyword from test (#38373) @ZeeshanTamboli - -All contributors of this release in alphabetical order: @alisasanib, @cherniavskii, @DanailH, @danilo-leal, @iownthegame, @michaldudak, @mj12albert, @mnajdova, @noraleonte, @oliviertassinari, @richbustos, @sai6855, @samuelsycamore, @siriwatknp, @VishruthR, @yash-thakur, @zanivan, @ZeeshanTamboli - -## 5.14.3 - -<!-- generated comparing v5.14.2..master --> - -_Jul 31, 2023_ - -A big thanks to the 17 contributors who made this release possible. Here are some highlights ✨: - -- 🚀 [Joy UI](https://mui.com/joy-ui/getting-started/) is now in Beta -- ✨ Refine [Joy UI](https://mui.com/joy-ui/getting-started/)'s default theme @siriwatknp @zanivan -- 🎉 Added Dropdown higher-level menu component [Base UI](https://mui.com/base-ui/getting-started/) @michaldudak -- 💫 Added Material You [Badge](https://mui.com/material-ui/react-badge/#material-you-version) to `material-next` (#37850) @DiegoAndai - -### `@mui/material@5.14.3` - -- ​<!-- 36 -->[Autocomplete][material][joy] Add default `getOptionLabel` prop in ownerState (#38100) @DSK9012 -- ​<!-- 26 -->[Menu][Divider][material] Do not allow focus on Divider when inside Menu list (#38102) @divyammadhok -- ​<!-- 06 -->[typescript][material] Rename one letter type parameters (#38155) @michaldudak -- ​<!-- 08 -->[Menu][material] Fixes slots and slotProps overriding defaults completely (#37902) @gitstart -- ​<!-- 07 -->[Theme][material] Add missing styleOverrides type for theme MuiStack (#38189) @DiegoAndai -- ​<!-- 04 -->[typescript][material] Add `component` field to `*Props` types (#38084) @michaldudak - -### `@mui/base@5.0.0-beta.9` - -#### Breaking changes - -- ​<!-- 11 -->[Dropdown][base][joy] Introduce higher-level menu component (#37667) @michaldudak - -#### Other changes - -- ​<!-- 33 -->[typescript][base] Rename one letter type parameters (#38171) @michaldudak - -### `@mui/joy@5.0.0-beta.0` - -- ​<!-- 10 -->[joy] Refine the default theme (#36843) @siriwatknp - -### `@mui/material-next@6.0.0-alpha.95` - -- ​<!-- 35 -->[Badge][material-next] Add Badge component (#37850) @DiegoAndai -- ​<!-- 30 -->[Chip][material-next] Copy chip component from material (#38053) @DiegoAndai -- ​<!-- 09 -->[typescript][material-next] Rename one letter type parameters (#38172) @michaldudak - -### `@mui/system@5.14.3` - -- ​<!-- 32 -->[Box][system] Remove `component` from TypeMap (#38168) @michaldudak -- ​<!-- 05 -->[Stack][system] Fix CSS selector (#37525) @sai6855 - -### Docs - -- ​<!-- 49 -->[docs] Update Joy UI's package README (#38262) @ZeeshanTamboli -- ​<!-- 48 -->[docs][base-ui] Add new batch of coming soon pages (#38025) @danilo-leal -- ​<!-- 44 -->[docs] fix links to standardized examples (#38193) @emmanuel-ferdman -- ​<!-- 43 -->[docs-infra] Small design polish to the Diamond Sponsor container (#38257) @danilo-leal -- ​<!-- 42 -->[docs-infra] Show props in the table of content (#38173) @alexfauquette -- ​<!-- 41 -->[docs-infra] Polish API page design (#38196) @oliviertassinari -- ​<!-- 40 -->[docs-infra] Search with productCategory when product is missing (#38239) @oliviertassinari -- ​<!-- 39 -->[docs][material] Revise and update Examples doc (#38205) @samuelsycamore -- ​<!-- 38 -->[docs] Fix typo in notifications.json @mbrookes -- ​<!-- 37 -->[docs-infra] Remove leftover standardNavIcon (#38252) @DiegoAndai -- ​<!-- 34 -->[docs][base] Add Tailwind CSS & plain CSS demos on the Popper page (#37953) @zanivan -- ​<!-- 31 -->[docs][Button][joy] Improve `loading` prop documentation (#38156) @sai6855 -- ​<!-- 25 -->[docs] Prepare docs infra for Tree View migration to X (#38202) @flaviendelangle -- ​<!-- 24 -->[docs] Fix SEO issues reported by ahrefs @oliviertassinari -- ​<!-- 23 -->[docs] Fix palette pages - live edit not working (#38195) @oliviertassinari -- ​<!-- 22 -->[docs] Add Google Analytics action for the styling menu (#38085) @mnajdova -- ​<!-- 21 -->[docs] Fix Discord redirection chain @oliviertassinari -- ​<!-- 20 -->[docs] Cover pnpm in more places (#38161) @oliviertassinari -- ​<!-- 19 -->[docs] Avoid broken link (#38154) @oliviertassinari -- ​<!-- 18 -->[docs] Add notification for beta release of Toolpad (#38152) @prakhargupta1 -- ​<!-- 17 -->[docs-infra] Remove sidenav icons (#38174) @oliviertassinari -- ​<!-- 16 -->[docs-infra] Fix search ranking when no productId (#38162) @oliviertassinari -- ​<!-- 15 -->[docs-infra] Adjust the side nav for deeper nested items (#38047) @cherniavskii -- ​<!-- 14 -->[docs][joy] Update TS file of adding more typography levels demo to match the corresponding JS file's styles (#38232) @ZeeshanTamboli -- ​<!-- 13 -->[docs][joy] Add TS demo for reusable component section in approaches page (#38210) @sai6855 -- ​<!-- 12 -->[docs][joy] Add TS demo for theme typography new level customization (#38199) @sai6855 - -### Core - -- ​<!-- 47 -->[blog] Fix blog post slug Base UI (#38254) @oliviertassinari -- ​<!-- 46 -->[core] Use native Node's fetch instead of node-fetch package (#38263) @michaldudak -- ​<!-- 45 -->[core] Remove dead code @oliviertassinari -- ​<!-- 29 -->[core] Polish Stack test to closer CSS injection order @oliviertassinari -- ​<!-- 28 -->[core] Remove unnecessary `Required` utility type from Typography font style type (#38203) @ZeeshanTamboli -- ​<!-- 27 -->[core] Fix generate Proptypes script skipping unstable items (#38198) @mj12albert -- ​<!-- 03 -->[website] Adding Rich Bustos Twitter handle in bio (#38213) @richbustos -- ​<!-- 02 -->[website] Prepare importing data from HiBob (#38238) @oliviertassinari -- ​<!-- 01 -->[website] Sync team member with HiBob, add Raffaella (#38201) @rluzists1 - -All contributors of this release in alphabetical order: @cherniavskii, @DiegoAndai, @divyammadhok, @DSK9012, @flaviendelangle, @gitstart, @michaldudak, @mj12albert, @mnajdova, @oliviertassinari, @prakhargupta1, @richbustos, @rluzists1, @sai6855, @siriwatknp, @zanivan, @ZeeshanTamboli - -## 5.14.2 - -<!-- generated comparing v5.14.1..master --> - -_Jul 25, 2023_ - -A big thanks to the 23 contributors who made this release possible. - -### @mui/material@5.14.2 - -- ​<!-- 39 -->Revert "[core] Adds `component` prop to `OverrideProps` type (#35924)" (#38150) @michaldudak -- ​<!-- 32 -->[Chip][material] Fix base cursor style to be "auto" not "default" (#38076) @DiegoAndai -- ​<!-- 12 -->[Tabs] Refactor IntersectionObserver logic (#38133) @ZeeshanTamboli -- ​<!-- 11 -->[Tabs] Fix and improve visibility of tab scroll buttons using the IntersectionObserver API (#36071) @SaidMarar - -### @mui/joy@5.0.0-alpha.89 - -- ​<!-- 15 -->[Joy] Replace leftover `Joy-` prefix with `Mui-` (#38086) @siriwatknp -- ​<!-- 14 -->[Skeleton][joy] Fix WebkitMaskImage CSS property (#38077) @Bestwebdesign -- ​<!-- 13 -->[Link][Joy UI] Fix font inherit (#38124) @oliviertassinari - -### Docs - -- ​<!-- 37 -->[docs] Add listbox placement demo for Select (#38130) @sai6855 -- ​<!-- 36 -->[docs][base] Add Tailwind CSS & plain CSS demo on the Tabs page (#37910) @mnajdova -- ​<!-- 35 -->[docs][base] Add Tailwind CSS & plain CSS demos on the Textarea page (#37943) @zanivan -- ​<!-- 29 -->[docs] Fix Joy UI menu example (#38140) @harikrishnanp -- ​<!-- 28 -->[docs] Remove translations section from contributing guide (#38125) @nikohoffren -- ​<!-- 27 -->[docs] Fix Base UI Button Tailwind CSS padding @oliviertassinari -- ​<!-- 26 -->[docs] Mention in hompage hero that Core is free (#38075) @mbrookes -- ​<!-- 25 -->[docs] Fix a typo in notifications.json (#38078) @mbrookes -- ​<!-- 24 -->[docs] Add Tailwind CSS & plain CSS demo on the table pagination page (#37937) @mnajdova -- ​<!-- 23 -->[docs] Implement the new API display design (#37405) @alexfauquette -- ​<!-- 22 -->[docs] Update migration installation code blocks (#38028) @danilo-leal -- ​<!-- 21 -->[docs][joy] Revise the Joy UI Link page (#37829) @danilo-leal -- ​<!-- 20 -->[docs][joy] Add playground for Card component (#37820) @Studio384 -- ​<!-- 19 -->[docs][joy] Add adjustments to the color inversion page (#37143) @danilo-leal -- ​<!-- 18 -->[docs][material] Improve documentation about adding custom colors (#37743) @DiegoAndai -- ​<!-- 17 -->[examples] Fix Joy UI Next.js App Router font loading (#38095) @IgnacioUtrilla -- ​<!-- 16 -->[examples] Fix material-next Font Usage with next/font (#38026) @onderonur - -### Core - -- ​<!-- 34 -->[blog] Update Discord invite link in Toolpad beta announcement (#38143) @samuelsycamore -- ​<!-- 33 -->[blog] Update discord server link (#38131) @prakhargupta1 -- ​<!-- 31 -->[core] Fix rsc-builder removing the first line (#38134) @michaldudak -- ​<!-- 30 -->[core] Remove the deprecation rule in tslint (#38087) @michaldudak -- ​<!-- 09 -->[website] Mobile navigation: Toolpad to Beta (#38146) @bharatkashyap -- ​<!-- 08 -->[website] Fix typo on pricing page @oliviertassinari -- ​<!-- 07 -->[website] Fix a few regression (#38050) @oliviertassinari -- ​<!-- 06 -->[website] Update Demo footers on MUI X landing page (#38027) @richbustos -- ​<!-- 05 -->[website] Fix 301 redirection to base index page @oliviertassinari -- ​<!-- 04 -->[website] Fix Cell selection feature name (#38029) @oliviertassinari -- ​<!-- 03 -->[website] Improve button look (#38052) @oliviertassinari -- ​<!-- 02 -->[website] Link new core page to new Base UI landing page (#38030) @mj12albert -- ​<!-- 01 -->[website] Polish pricing page (#37975) @oliviertassinari -- ​<!-- 10 -->[test] Fail the CI when new unexpected files are created (#38039) @oliviertassinari -- ​<!-- 09 -->[test] Fix linting error by matching main component demo name to filename (#38122) @ZeeshanTamboli - -All contributors of this release in alphabetical order: @alexfauquette, @Bestwebdesign, @bharatkashyap, @danilo-leal, @DiegoAndai, @harikrishnanp, @IgnacioUtrilla, @mbrookes, @michaldudak, @mj12albert, @mnajdova, @nikohoffren, @oliviertassinari, @onderonur, @prakhargupta1, @richbustos, @sai6855, @SaidMarar, @samuelsycamore, @siriwatknp, @Studio384, @zanivan, @ZeeshanTamboli - -## 5.14.1 - -<!-- generated comparing v5.14.0..master --> - -_Jul 19, 2023_ - -A big thanks to the 24 contributors who made this release possible. Here are some highlights ✨: - -- 💫 Introducing some new components for Joy UI: - - [Skeleton](https://mui.com/joy-ui/react-skeleton/) component (#37893) @siriwatknp - - [ToggleButton](https://mui.com/joy-ui/react-toggle-button-group/) (#37716) @siriwatknp -- 🎉 Base UI has its own [landing page](https://www.mui.com/base-ui)! -- 🐛 bug fixes, 📚 documentation, and ⚙️ infrastructure improvements. - -### `@mui/material@5.14.1` - -- ​<!-- 14 -->[FormControlLabel] Fix misplaced asterisk when `labelPlacement` is provided (#37831) @ZeeshanTamboli -- ​<!-- 11 -->[Slider][material] Fix type dependency on @types/prop-types (#37853) @Methuselah96 -- ​<!-- 10 -->[Menu] Add MuiMenuList to createTheme components key (#37956) @mj12albert -- ​<!-- 09 -->[Modal] Remove deprecated `BackdropComponent` and `BackdropProps` from tests (#38018) @sai6855 - -### `@mui/material-next@6.0.0-alpha.93` - -- ​<!-- 54 -->[Slider][material-next] Add use client directive to useSliderElementsOverlap (#37955) @mj12albert -- ​<!-- 47 -->[Button][material-next] Fix some event handlers being ignored (#37647) @DiegoAndai - -### `@mui/base@5.0.0-beta.8` - -- ​<!-- 53 -->[Autocomplete] Make touch and click behavior on an option consistent (#37972) @divyammadhok - -### `@mui/joy@5.0.0-alpha.88` - -- ​<!-- 13 -->[Joy][Select] Fix type error caused by custom variant (#37996) @OmPr366 -- ​<!-- 12 -->[ToggleButton][Joy] Add `ToggleButton` component (#37716) @siriwatknp -- ​<!-- 07 -->[Skeleton] Add Joy UI `Skeleton` component (#37893) @siriwatknp - -### `@mui/utils@5.14.1` - -- ​<!-- 06 -->[utils] Add function overload for `useEventCallback` (#37827) @cherniavskii - -### Docs - -- ​<!-- 52 -->[docs][base] Add Tailwind CSS & plain CSS demo on the form control page (#37914) @mnajdova -- ​<!-- 51 -->[docs][base] Make Base UI Select demos denser (#37836) @zanivan -- ​<!-- 38 -->[docs] Link Material UI from the landing page (#37971) @oliviertassinari -- ​<!-- 37 -->[docs] Fix the empty /components page (#38010) @brijeshb42 -- ​<!-- 36 -->[docs] Checkout template follows user's color scheme preference (#37928) @OndrejHj04 -- ​<!-- 35 -->[docs] Disable ad for onboarding pages (#37998) @oliviertassinari -- ​<!-- 34 -->[docs] Fix broken link to Base UI Next.js App Router (#37973) @oliviertassinari -- ​<!-- 33 -->[docs] Fix typo in next-js-app-router.md (#37974) @ericbrian -- ​<!-- 32 -->[docs] Add pnpm commands to Material UI Installation page (#36650) @officialrajdeepsingh -- ​<!-- 31 -->[docs] Link charts in the roadmap (#37944) @oliviertassinari -- ​<!-- 30 -->[docs] Improve changelog @oliviertassinari -- ​<!-- 29 -->[docs] Improve the Select docs (#37279) @michaldudak -- ​<!-- 16 -->[docs][menu] Add Tailwind CSS & plain CSS demo on the Menu page (#37856) @mnajdova -- ​<!-- 15 -->[example] Update EmotionCacheProvider to work with GlobalStyles (#37962) @siriwatknp - -### Core - -- ​<!-- 50 -->[blog] Add blog post about support for Next.js App Router (#37929) @samuelsycamore -- ​<!-- 49 -->[blog] Blog MUI X pro statement removed (#38015) @prakhargupta1 -- ​<!-- 48 -->[blog] Add Toolpad beta announcement blog (#37799) @prakhargupta1 -- ​<!-- 46 -->[core] Increase space available for sidenav @oliviertassinari -- ​<!-- 45 -->[core] Adds `component` prop to `OverrideProps` type (#35924) @sai6855 -- ​<!-- 44 -->[core] Fix rsc build step in CI (#38019) @mj12albert -- ​<!-- 43 -->[core] Remove nx dependency (#37964) @Janpot -- ​<!-- 42 -->[core] Lock `@types/node` to v18 (#37965) @ZeeshanTamboli -- ​<!-- 41 -->[core] Update priority support issue template and prompt (#37824) @DanailH -- ​<!-- 40 -->[core] Remove warnings in docs:api (#37858) @alexfauquette -- ​<!-- 39 -->[core] Make rimraf work after a major update (#37930) @michaldudak -- ​<!-- 28 -->[docs-infra] Change the Diamond Sponsor block positioning on the side nav (#37933) @danilo-leal -- ​<!-- 27 -->[docs-infra] Support backticks in the codeblocks (#37950) @cherniavskii -- ​<!-- 26 -->[docs-infra] Improve performance hideToolbar: true (#37969) @oliviertassinari -- ​<!-- 25 -->[docs-infra] Fix button label on mobile (#37997) @oliviertassinari -- ​<!-- 24 -->[docs-infra] Square drawer corners (#37970) @oliviertassinari -- ​<!-- 23 -->[docs-infra] Improve tab contrast in codeblock (#38000) @oliviertassinari -- ​<!-- 22 -->[docs-infra] Fix API generation for Base UI (#37941) @oliviertassinari -- ​<!-- 21 -->[docs-infra] Fix layout shift on xGrid (#37954) @oliviertassinari -- ​<!-- 20 -->[docs-infra] Update installation commands to use the new tabs code component (#37927) @danilo-leal -- ​<!-- 19 -->[docs-infra] Improve disableToc={true} support (#37931) @oliviertassinari -- ​<!-- 18 -->[docs-infra] Remove icons and tweak the design of the side nav (#37860) @danilo-leal -- ​<!-- 17 -->[docs-infra] Fix TypeScrit error in demo export (#37830) @oliviertassinari -- ​<!-- 08 -->[notifications] Add notification for first Charts release (#37679) @joserodolfofreitas -- ​<!-- 05 -->[website] Add Base UI marketing page (#36622) @siriwatknp -- ​<!-- 04 -->[website] Update MUI X landing page (#37966) @cherniavskii -- ​<!-- 03 -->[website] Fix a11y issues (#37999) @oliviertassinari -- ​<!-- 02 -->[website] Make the Core page refer to group of products (#37608) @danilo-leal -- ​<!-- 01 -->[website] Add perpetual option to pricing page (#35504) @joserodolfofreitas - -All contributors of this release in alphabetical order: @alexfauquette, @brijeshb42, @cherniavskii, @DanailH, @danilo-leal, @DiegoAndai, @divyammadhok, @ericbrian, @Janpot, @joserodolfofreitas, @Methuselah96, @michaldudak, @mj12albert, @mnajdova, @officialrajdeepsingh, @oliviertassinari, @OmPr366, @OndrejHj04, @prakhargupta1, @sai6855, @samuelsycamore, @siriwatknp, @zanivan, @ZeeshanTamboli - -## 5.14.0 - -<!-- generated comparing v5.13.7..master --> - -_Jul 11, 2023_ - -A big thanks to the 15 contributors who made this release possible. Here are some highlights ✨: - -- 💫 Material UI, Joy UI, and Base UI are compatible with [Next.js App Router](https://nextjs.org/docs/app) (#37656) @mj12albert -- 📚 Added new guides for integrating with Next.js 13 App Router (#37656) @mj12albert - - Ⓜ️ [Material UI guide](https://mui.com/material-ui/guides/next-js-app-router/) - - 🅙 [Joy UI guide](https://mui.com/joy-ui/integrations/next-js-app-router/) - - 🅱️ [Base UI guide](https://mui.com/base-ui/guides/next-js-app-router/) -- 🐛 bug fixes, 📚 documentation, and ⚙️ infrastructure improvements. - -### `@mui/material@5.14.0` - -- [Autocomplete] Enable global customization of different options (#36971) @nicolas-ot - -### `@mui/material-next@6.0.0-alpha.92` - -- [Slider][material-next] Slider restructure and style improvements (#37644) @DiegoAndai - -### `@mui/joy@5.0.0-alpha.87` - -- [ButtonGroup] Fix style for single Button (#37692) @MaybePixem -- Fix theme typography fallback value (#37845) @siriwatknp - -### `@mui/icons-material@5.14.0` - -- [icons-material] Rebuild icons with `"use client"` (#37894) @mj12albert - -### Docs - -- [docs] Polish Ukraine banner (#37905) @oliviertassinari -- [docs] Reduce Ukraine banner size (#34795) @oliviertassinari -- [docs] Add callouts about controlled vs uncontrolled components in Core docs (#37849) @samuelsycamore -- [docs] Add missing Portal elements to Tailwind CSS interoperability guide (#37807) @enrique-ramirez -- [docs] Small pickers migration improvement (#37815) @alexfauquette -- [docs] Fix pickers product name (#37825) @LukasTy -- [docs][Joy][Link] Set `variant` and `color` defaults for the playground (#37817) @Studio384 -- [docs][Joy][Table] Add `undefined` as an option to `stripe` (#37816) @Studio384 -- [docs][base] Add Tailwind CSS & plain CSS demo on the Snackbar page (#37812) @mnajdova -- [docs][base] Add Tailwind CSS & plain CSS demo on Badge page (#37768) @mnajdova -- [docs][base] Fix Nested modal demo positioning (#37506) @gitstart -- [docs][base] Add Tailwind CSS & plain CSS demo on the Switch page (#37728) @mnajdova -- [docs-infra] Remove code tags in ToC (#37834) @cherniavskii -- [docs-infra] Fixes in API pages generation (#37813) @mnajdova -- [docs-infra] Add test case when using sh (#37818) @oliviertassinari -- [docs-infra] Use icons instead of words for the code copy button (#37664) @danilo-leal -- [docs-infra] Fix code parser (#37828) @alexfauquette -- [docs-infra] Fix `marked` deprecation warning (#37769) @alexfauquette -- [docs-infra] Allows to use codeblock in the docs (#37643) @alexfauquette -- [docs-infra][joy] Change Joy UI's playground variant selector (#37821) @danilo-leal - -### Core - -- [core] Prepend "use-client" directive + add docs and examples for using the library with Next.js App Router (#37656) @mj12albert -- [core] Fix imports to React (#37863) @oliviertassinari -- [core] Disambiguate eslint plugin name @oliviertassinari -- [core] Sync the lint script name with the other repositories @oliviertassinari -- [core] Point to Crowdin directly @oliviertassinari -- [website] Sync career page (#37847) @oliviertassinari - -All contributors of this release in alphabetical order: @alexfauquette, @cherniavskii, @danilo-leal, @DiegoAndai, @enrique-ramirez, @gitstart, @LukasTy, @MaybePixem, @mj12albert, @mnajdova, @nicolas-ot, @oliviertassinari, @samuelsycamore, @siriwatknp, @Studio384 - -## 5.13.7 - -<!-- generated comparing v5.13.6..master --> - -_Jul 4, 2023_ - -A big thanks to the 21 contributors who made this release possible. -This release focuses primarily on 🐛 bug fixes, 📚 documentation, and ⚙️ infrastructure improvements. - -### `@mui/material@5.13.7` - -- [OutlinedInput] Fix form control properties in `ownerState` (#37668) @vonagam - -### `@mui/system@5.13.7` - -- [Stack] Fix spacing when there are `<style>` children (#34966) @cmd-johnson - -### `@mui/icons-material@5.13.7` - -- [icons] Add Microsoft logo (#37717) @zephyrus21 - -### `@mui/joy@5.0.0-alpha.86` - -- [Autocomplete][joy] Fix Autocomplete and Modal components to work together (#37515) @saikathalderr -- [Menu][Joy] Improve UX of `Menu` usage demo (#37797) @sai6855 - -### `@mui/base@5.0.0-beta.6` - -- [Slider][base][material][joy] Fix not draggable on the edge when `disableSwap={true}` (#35998) @sai6855 -- [Slider][base] Provide slot state to Slider's thumb slot props callback (#37749) @mnajdova -- [Tabs] Wrap TabsList context creation in useMemo (#37370) @michaldudak -- [TextareaAutosize] Fix wrong height measurement (#37185) @bigteech - -### `@mui/lab@5.0.0-alpha.135` - -- [Timeline] Fix position `alternate-reverse` generated classname (#37678) @ZeeshanTamboli - -### Docs - -- [docs][base] Add demo for using the Button as a link (#37317) @AdamSundberg -- [docs][base] Add Tailwind CSS + plain CSS demo on the Select page (#37725) @mnajdova -- [docs][base] Make Base UI input demos denser (#37750) @zanivan -- [docs][base] Make Base UI button demos denser (#37689) @zanivan -- [docs][base] Add Tailwind CSS & plain CSS demos on the Input page (#37685) @mnajdova -- [docs][base] Fix horizontal scrolling on the mobile input page (#37688) @zanivan -- [docs] Improve Base UI index page (#37761) @oliviertassinari -- [docs] Fix incorrect package URL in README of example material-vite (#37755) @Dlouxgit -- [docs] Explain how to disable Base Select's portal (#37684) @michaldudak -- [docs] Shorten overview page URLs (#37660) @oliviertassinari -- [docs][material] Rename custom tab panel in Tabs demo to prevent confusion with @mui/lab (#37638) @MUK-Dev -- [docs][tabs] Document how to use routing with Tabs in Base UI (#37369) @michaldudak -- [docs] Rename product to productId (#37801) @siriwatknp -- [docs][base] Add Tailwind CSS & plain CSS demo on the Slider page (#37736) @mnajdova - -### Core - -- [docs–infra] Prevent displaying multiple ads (#37696) @oliviertassinari -- [blog] Fix mismatch between plan and link @oliviertassinari -- [core] Update yarn lockfile (#37802) @michaldudak -- [core] Add bundle size Toolpad app link to PRs (#36311) @Janpot -- [core] Fix priority support prompt action flow (#37726) @DanailH -- [core] Fix typo in priority support @oliviertassinari -- [core][docs] add Eslint rule to ensure main demo component match file… (#37278) @alexfauquette -- [docs-infra] Fix truncated TOCs scrollbar (#37770) @oliviertassinari -- [docs-infra] Adjust demo container to be glued to the toolbar (#37744) @danilo-leal -- [docs-infra] Fix layout shift ad (#37694) @oliviertassinari -- [docs-infra] Improve demos toolbar (#37762) @oliviertassinari -- [docs-infra] Make the GitHub link in the nav bar open in a new tab (#37766) @gateremark -- [docs-infra] Allow to persist icons in ToC (#37731) @cherniavskii -- [docs-infra] Improve product mapping (#37729) @oliviertassinari -- [docs-infra] Add design polish to the comment and anchor buttons (#37734) @danilo-leal -- [docs-infra] Tweak editable code blocks callout design (#37681) @danilo-leal -- [docs-infra] Improve the edit page experience (#37695) @oliviertassinari -- [docs-infra] Support rendering markdown outside of docs (#37691) @oliviertassinari -- [docs-infra] Polish demo toolbar button designs (#37680) @danilo-leal -- [docs-infra] Adjust demo component container design (#37659) @danilo-leal -- [test] Fix test:e2e local run (#37719) @oliviertassinari -- [test] Remove failing test in dev @oliviertassinari -- [website] Add no-op service worker to fix stale cache issue (#37607) @cherniavskii -- [website] Transition the Core page to be Material UI instead (#37583) @danilo-leal -- [website] Update the pricing page to reflect sales (#37751) @oliviertassinari -- [website] Match Copyright with the rest of the website @oliviertassinari -- [website] Support deep linking to pricing FAQ @oliviertassinari - -All contributors of this release in alphabetical order: @AdamSundberg, @alexfauquette, @bigteech, @cherniavskii, @cmd-johnson, @DanailH, @danilo-leal, @Dlouxgit, @gateremark, @Janpot, @michaldudak, @mnajdova, @MUK-Dev, @oliviertassinari, @sai6855, @saikathalderr, @siriwatknp, @vonagam, @zanivan, @ZeeshanTamboli, @zephyrus21 - -## 5.13.6 - -_Jun 21, 2023_ - -A big thanks to the 25 contributors who made this release possible. Here are some highlights ✨: - -- 💫 Added [Slider](https://mui.com/material-ui/react-slider/#material-you-version) component using the new Material You design language (#37520) @DiegoAndai. -- 📚 Added [examples](https://github.com/mui/material-ui/tree/master/examples/material-ui-nextjs-ts) showcasing how you can use Material UI with next.js's app directory (#37315) @smo043 - -### `@mui/material@5.13.6` - -- ​<!-- 45 -->[Autocomplete] Fixed autocomplete's existing option selection (#37012) @bencevoros -- ​<!-- 44 -->[Autocomplete] Add hint demos to Material UI and Joy UI docs (#37496) @sai6855 -- ​<!-- 13 -->[Masonry] Fix ResizeObserver loop limit exceeded error (#37208) @hbjORbj -- ​<!-- 11 -->[Tooltip][material] Improve warning when Tooltip receives string child (#37530) @DiegoAndai -- ​<!-- 10 -->[Modal] Add missing members to ModalOwnProps (#37568) @ivp-dev -- ​<!-- 09 -->[Slider] Arrow keys control does not work with float numbers (#37071) @gitstart -- ​<!-- 08 -->[SvgIcon] allow `svg` as a child (#37231) @siriwatknp -- ​<!-- 07 -->[Timeline] Add alternate reverse position (#37311) @abhinavkmrru -- ​<!-- 06 -->[Tooltip] Fix type of sx prop in `slotProps` (#37550) @SuperKXT -- ​<!-- 05 -->[TouchRipple] perf: avoid calling `clearTimeout()` (#37512) @romgrk - -### `@mui/material-next@6.0.0-alpha.90` - -- ​<!-- 12 -->[Material You] Add Slider component with Material You design (#37520) @DiegoAndai - -### `@mui/joy@5.0.0-alpha.85` - -- ​<!-- 37 -->[ButtonGroup][joy] Missing border when spacing is more than zero (#37577) @siriwatknp -- ​<!-- 36 -->[CardActions][joy] Add `CardActions` component (#37441) @siriwatknp -- ​<!-- 14 -->[Menu][joy] Fix closing of `Menu` in demos (#36917) @sai6855 - -### `@mui/base@5.0.0-beta.5` - -- ​<!-- 39 -->[Menu][base] Add the resetHighlight action (#37392) @michaldudak -- ​<!-- 38 -->[Select][base] Expose the `areOptionsEqual` prop (#37615) @michaldudak - -### `@mui/utils@5.13.2` - -- ​<!-- 04 -->[utils] Allow nested imports in @mui/utils to speed up build (#37586) @flaviendelangle - -### Docs - -- ​<!-- 43 -->[docs][base] Improve Base UI all components images (#37590) @danilo-leal -- ​<!-- 42 -->[docs][base] Add pages for coming soon components (#37575) @danilo-leal -- ​<!-- 41 -->[docs][base] Add a Snackbar introduction demo (#37602) @danilo-leal -- ​<!-- 40 -->[docs][base] Add page for all Base UI components (#37536) @danilo-leal -- ​<!-- 33 -->[docs] Fix scrollbar on snackbar page (#37657) @oliviertassinari -- ​<!-- 32 -->[docs] Switch order of snackbar buttons in demos (#37389) @Primajin -- ​<!-- 31 -->[docs] Add support for Tailwind CSS and plain CSS demos (#37319) @mnajdova -- ​<!-- 30 -->[docs] Tree view color fix for dark mode in Gmail example (#37051) @PunitSoniME -- ​<!-- 29 -->[docs] Inline the Base UI demo (#37603) @oliviertassinari -- ​<!-- 28 -->[docs] Fix typo in themed components page (#37598) @vinayr -- ​<!-- 27 -->[docs] Fix render inline code in CSS description generation (#37448) @alexfauquette -- ​<!-- 26 -->[docs] Add styles to styled argument list (#37558) @DiegoAndai -- ​<!-- 25 -->[docs] Improve awkward wording in READMEs of example projects (#37110) @DIWAKARKASHYAP -- ​<!-- 24 -->[docs] Fix small base -> base-ui migration issue (#37594) @oliviertassinari -- ​<!-- 23 -->[docs] Fix GitHub typo (#37578) @oliviertassinari -- ​<!-- 22 -->[docs] Improve release guide (#37547) @DiegoAndai -- ​<!-- 21 -->[docs] Review fixes to the Material UI's "Example projects" page (#37444) @danilo-leal -- ​<!-- 17 -->[docs][joy] Add a messages template (#37546) @sernstberger -- ​<!-- 16 -->[docs][joy] Add pages for coming soon Joy UI components (#36920) @danilo-leal -- ​<!-- 15 -->[docs][joy] Add design and consistency tweaks to the Playground (#37580) @danilo-leal -- ​<!-- 37 -->[docs] Add and revise Base UI + Create React App examples (#36825) @samuelsycamore -- ​<!-- 20 -->[docs-infra] Fix demos border radius (#37658) @oliviertassinari -- ​<!-- 19 -->[docs-infra] Add analyticsTags to Algolia (#37600) @Janpot -- ​<!-- 18 -->[docs-infra] Simplify product id handling (#37593) @oliviertassinari -- ​<!-- 35 -->[changelog] Add missing release date for v5.13.5 @oliviertassinari -- ​<!-- 16 -->[examples] Shell command fix in the readme file of material-next-ts example (#37675) @bablukpik -- ​<!-- 15 -->[examples] Next.js v13 app router with Material UI (#37315) @smo043 - -### Core - -- ​<!-- 34 -->[core] Update to Node.js v18 for `test-dev` CI (#37604) @ZeeshanTamboli -- ​<!-- 39 -->[core] Add priority support issue template (#37671) @DanailH -- ​<!-- 03 -->[website] Update roadmap page (#37587) @cherniavskii -- ​<!-- 02 -->[website] Add CSP to limit iframes to self @oliviertassinari -- ​<!-- 01 -->[website] Link mui-x Stack Overflow in footer link (#37509) @richbustos - -All contributors of this release in alphabetical order: @abhinavkmrru, @alexfauquette, @bencevoros, @cherniavskii, @danilo-leal, @DiegoAndai, @DIWAKARKASHYAP, @flaviendelangle, @gitstart, @hbjORbj, @ivp-dev, @Janpot, @michaldudak, @mnajdova, @oliviertassinari, @Primajin, @PunitSoniME, @richbustos, @romgrk, @sai6855, @sernstberger, @siriwatknp, @SuperKXT, @vinayr, @ZeeshanTamboli - -## 5.13.5 - -_Jun 12, 2023_ - -A big thanks to the 9 contributors who made this release possible. Here are some highlights ✨: - -- 💫 Added `ButtonGroup` component in Joy UI (#37407) @siriwatknp. -- 🐛 bug fixes and 📚 documentation improvements. - -### `@mui/material@5.13.5` - -- ​<!-- 03 -->[Material][Popover] Add support for virtual element as anchorEl (#37465) @DiegoAndai - -### `@mui/joy@5.0.0-alpha.84` - -- ​<!-- 20 -->[ButtonGroup][joy] Replace `detached` prop with `spacing`. (#37562) @siriwatknp -- ​<!-- 19 -->[ButtonGroup][joy] Add `ButtonGroup` component (#37407) @siriwatknp -- ​<!-- 04 -->[Input][joy] Simplify focus with `:focus-within` and add examples (#37385) @siriwatknp - -### Docs - -- ​<!-- 17 -->[docs] Move Toolpad from alpha to beta (#37288) @bharatkashyap -- ​<!-- 16 -->[docs] Add usage of createCssVarsProvider (#37513) @brijeshb42 -- ​<!-- 15 -->[docs] Update /base url references to /base-ui (#37412) @brijeshb42 -- ​<!-- 14 -->[docs] Skip components and hooks due to duplicate index (#37539) @siriwatknp -- ​<!-- 13 -->[docs] Polish Sign in to your account joy demo (#37498) @oliviertassinari -- ​<!-- 12 -->[docs] Remove outdated Material UI FAQ @oliviertassinari -- ​<!-- 11 -->[docs] Fix crash access to localStorage in Firefox (#37518) @brijeshb42 -- ​<!-- 10 -->[docs-infra] Enforce max length on description (#37565) @oliviertassinari -- ​<!-- 09 -->[docs-infra] Mandatory versions (#37497) @oliviertassinari -- ​<!-- 08 -->[docs-infra] Fix lighthouse img size issue (#37415) @oliviertassinari -- ​<!-- 07 -->[docs][joy] Replace JoyInput with Input component in JoyUI Text Field documentation (#37548) @musama619 -- ​<!-- 06 -->[docs][joy] Add typography introduction demo component (#37553) @sernstberger -- ​<!-- 05 -->[docs][joy] Add a rental dashboard template (#37453) @sernstberger - -### Core - -- ​<!-- 21 -->Move the React Community Engineer - X in Open Roles (#37552) @DanailH -- ​<!-- 18 -->[core] Update Node.js version to v18 on CircleCI, CodeSandbox, and Netlify (#37173) @ZeeshanTamboli -- ​<!-- 02 -->[website] RIDI gold sponsorship end (#37517) @oliviertassinari -- ​<!-- 01 -->[website] Update X landing page (#37387) @cherniavskii - -All contributors of this release in alphabetical order: @brijeshb42, @cherniavskii, @DanailH, @DiegoAndai, @musama619, @oliviertassinari, @sernstberger, @siriwatknp, @ZeeshanTamboli - -## 5.13.4 - -<!-- generated comparing v5.13.3..master --> - -_Jun 5, 2023_ - -A big thanks to the 12 contributors who made this release possible. Here are some highlights ✨: - -### `@mui/material@5.13.4` - -- ​<!-- 20 -->[Autocomplete][material] Add missing `focusVisible` class in AutocompleteClasses (#37502) @sai6855 -- ​<!-- 04 -->[Menu][material] Fix MenuPaper class composition precedence (#37390) @DiegoAndai -- ​<!-- 03 -->[MenuList] Fix to allow conditional rendering for a menu item under ListSubheader (#36890) @danielplewes -- ​<!-- 02 -->[Stepper] Handle progress bar of mobile stepper when `steps` is one (#37079) @gitstart - -### `@mui/base@5.0.0-beta.4` - -- ​<!-- 16 -->[Input][base] Fix calling slotProps event handlers (#37463) @sai6855 - -### `@mui/joy@5.0.0-alpha.82` - -- ​<!-- 19 -->[Avatar][joy] Fallback to `alt` when `src` or `srcSet` are not defined (#37469) @vishalthatipamula0219 -- ​<!-- 15 -->[Card][joy] Improve usability of card family (#37474) @siriwatknp - -### Docs - -- ​<!-- 18 -->[docs][base] useAutocomplete demos & docs (#37029) @mj12albert -- ​<!-- 17 -->[docs][base] Remove usage of `component` prop in docs (#37462) @sai6855 -- ​<!-- 13 -->[docs] Fix docs redirections @oliviertassinari -- ​<!-- 12 -->[docs] Fix Fluent -> Fluent UI @oliviertassinari -- ​<!-- 11 -->[docs] Fix MUI Base -> Base UI @oliviertassinari -- ​<!-- 10 -->[docs] Add base-vite-tailwind example repo (#36994) @mj12albert -- ​<!-- 09 -->[docs] Fix search bar layout shift (#37460) @oliviertassinari -- ​<!-- 08 -->[docs] Tweak Material UI's "Showcase" page design (#37259) @danilo-leal -- ​<!-- 07 -->[docs] Tweak Material UI's "Template" page design (#37260) @danilo-leal -- ​<!-- 06 -->[docs] Fix "Language" page removal leftovers (#37408) @danilo-leal -- ​<!-- 05 -->[docs] Move contents of css-variables to sibling pages (#37411) @brijeshb42 - -### Core - -- ​<!-- 14 -->[core] Do not let Renovate handle `examples` packages updates (#37386) @ZeeshanTamboli -- ​<!-- 01 -->[website] Add header filters to the pricing table (#37455) @MBilalShafi - -All contributors of this release in alphabetical order: @brijeshb42, @danielplewes, @danilo-leal, @DiegoAndai, @gitstart, @MBilalShafi, @mj12albert, @oliviertassinari, @sai6855, @siriwatknp, @vishalthatipamula0219, @ZeeshanTamboli - -## 5.13.3 - -<!-- generated comparing v5.13.2..master --> - -_May 29, 2023_ - -A big thanks to the 15 contributors who made this release possible. -This release focuses primarily on 🐛 bug fixes and 📚 documentation improvements. - -### `@mui/material@5.13.3 - -- ​<!-- 22 -->[Autocomplete] Accept external Listbox ref (#37325) @sai6855 -- ​<!-- 06 -->[Modal] Pass `className` from `BackdropProps` (#37399) @hbjORbj - -### `@mui/base@5.0.0-beta.3` - -- ​<!-- 20 -->[base] Maintain nodes document order in compound components (#36857) @michaldudak -- ​<!-- 19 -->[base][joy] Prevent persisting hover state styles onclick on mobile (#36704) @gitstart -- ​<!-- 18 -->[Menu][base] MenuItem as a link does not work (#37242) @nicolas-ot -- ​<!-- 17 -->[MenuItem][Base] Pass idGenerator function (#37364) @sai6855 -- ​<!-- 16 -->[Slider][Base] Add Vertical slider demo (#37357) @sai6855 - -### `@mui/joy@5.0.0-alpha.82` - -- ​<!-- 23 -->[Select][joy] Fix popup does not close (#37435) @siriwatknp -- ​<!-- 21 -->[Badge][Joy] Fix `slots` element type in API docs (#37329) @zignis -- ​<!-- 04 -->[Select] [joy] Handle long text content (#37289) @akash191095 -- ​<!-- 07 -->[Tooltip][Joy] Interactive doesn't work (#37159) @nicolas-ot - -### `@mui/codemod@5.13.3 - -- ​<!-- 05 -->[mui-codemod] Add missing script to README (#37377) @hbjORbj - -### Docs - -- ​<!-- 14 -->[docs] Clarify Hidden down props as exclusive (#36927) @canac -- ​<!-- 13 -->[docs] Add refine to Material UI "Related projects" and "More advanced example projects" pages (#37308) @necatiozmen -- ​<!-- 12 -->[docs] Remove todo link from sidebar (#37373) @brijeshb42 -- ​<!-- 11 -->[docs] Clarify the peer dependency with react (#37360) @oliviertassinari -- ​<!-- 10 -->[docs] Divider vertical middle prop migration (#36840) @JhonnK08 -- ​<!-- 09 -->[docs] Fix branding theme tabs and navigation bar regressions (#37362) @ZeeshanTamboli -- ​<!-- 08 -->[docs-infra] Throw on incorrect internal links (#37326) @oliviertassinari - -### Core - -- ​<!-- 15 -->[core] Include scoped JSX namespace when resolving props (#37404) @LukasTy -- ​<!-- 03 -->[test][useMediaQuery] Change SSR test description (#37403) @zignis -- ​<!-- 02 -->[website] Sync with Ashby @oliviertassinari -- ​<!-- 01 -->[website] Add David to about page (#37379) @DavidCnoops - -All contributors of this release in alphabetical order: @akash191095, @brijeshb42, @canac, @DavidCnoops, @gitstart, @hbjORbj, @JhonnK08, @LukasTy, @michaldudak, @necatiozmen, @nicolas-ot, @oliviertassinari, @sai6855, @ZeeshanTamboli, @zignis - -## 5.13.2 - -<!-- generated comparing v5.13.1..master --> - -_May 22, 2023_ - -A big thanks to the 12 contributors who made this release possible. -📚 This release focuses primarily on documentation improvements. - -### `@mui/material@5.13.2 - -- [Slider] Tooltip positioning fixed for vertical slider (#37049) @PunitSoniME - -### Docs - -- [docs][base] Remove default annotations from useTabsList return type (#37324) @TinaSay -- [docs][base] Remove default annotations from useTabPanel return type (#37323) @TinaSay -- [docs][base] Remove default annotations from useSwitch return type (#37322) @TinaSay -- [docs][base] Remove default annotations from useInput return type (#37321) @TinaSay -- [docs][base] Remove default annotations from useAutocomplete return type (#37320) @TinaSay -- [docs][base] Remove default annotations from useBadge's return type (#37313) @TinaSay -- [docs][base] Remove default annotations from useButton's return type (#37312) @TinaSay -- [docs][base] Remove default annotations from useSlider's return type (#37309) @TinaSay -- [docs] Remove Material UI's "Languages" page (#37314) @danilo-leal -- [docs] Prefer to link GitHub repository @oliviertassinari -- [docs] Move product versions to page context (#35078) @m4theushw -- [docs] Fix v5 migration npm install instruction (#37293) @oliviertassinari -- [docs][Tab] Add vertical tabs demo (#37292) @sai6855 -- [docs][Transitions] Fix typo in code sample (#37300) @alexfauquette -- [examples] Remove `@babel/plugin-proposal-class-properties` from Material-Express-SSR example (#37305) @ZeeshanTamboli -- [Website] Add Brijesh to About page (#37318) @brijeshb42 -- [website] Update pricing table (#37290) @cherniavskii -- [website] Update core open roles (#37224) @mnajdova - -### Core - -- Revert "[core] Remove outdated babel proposal plugins (#36795)" (#37331) @michaldudak -- [core] Move esmExternals to the shared next config (#37332) @michaldudak - -All contributors of this release in alphabetical order: @alexfauquette, @brijeshb42, @cherniavskii, @danilo-leal, @m4theushw, @michaldudak, @mnajdova, @oliviertassinari, @PunitSoniME, @sai6855, @TinaSay, @ZeeshanTamboli - -## 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 --> - -_May 10, 2023_ - -A big thanks to the 18 contributors who made this release possible. Here are some highlights ✨: - -- 🚀 Base UI is now in beta - all planned breaking changes are now complete! -- 🗺 We have new [project boards](https://github.com/mui/material-ui/projects?query=is%3Aopen) on GitHub where you can learn about what's coming next. -- 🐛 Various bug fixes, 📚 documentation and 🧪 testing improvements - -### `@mui/material@5.13.0` - -- [Autocomplete] Support `ChipComponent` type (#37112) @sai6855 -- [AppBar] Fix component type (#37172) @sai6855 -- [Select] Simplify handleChange in SelectInput (#37040) @ulrichstark - -### `@mui/joy@5.0.0-alpha.79` - -- [Input][joy] Improve alignment on date fields (#37146) @wewakekumar -- [Alery][joy] Turn JS test to TS test (#37077) @hbjORbj -- [AspectRatio][joy] js test replaced with TypeScript test (#37087) @PunitSoniME -- [Badge][AvatarGroup][joy] js test replaced with TypeScript test (#37089) @PunitSoniME -- [Box][Card][MenuList][joy] Turn JS test to TS test (#37126) @uuxxx -- [List][Menu][joy] Turn JS test to TS test (#37123) @uuxxx -- [test][Joy] Remove duplicate Avatar test (#37201) @zignis -- [test][joy] js test cases converted to TypeScript (#37117) @PunitSoniME -- [Button][joy] Convert Button test to TypeScript (#37181) @akash191095 -- [CardContent][CardCover][CardOverflow][Chip][ChipDelete][joy] js text case converted to TypeScript (#37116) @PunitSoniME -- [Radio][IconButton][Checkbox][Option][joy] Switch to TypeScript unit test (#37137) @DerTimonius - -### `@mui/base@5.0.0-beta.0` - -- [Select][base] Do not call onChange after initial render (#37141) @michaldudak -- [Select][base] Rename the `optionStringifier` prop (#37118) @michaldudak -- [typescript][base] Fix types of components callbacks parameters (#37169) @michaldudak -- [Select], [TablePagination] Use more descriptive parameter names (#37064) @michaldudak - -### Docs - -- [docs] Stray design tweaks to Base UI demos (#37003) @danilo-leal -- [docs] Move outdated CSS prefixing docs (#36710) @kriskw1999 -- [docs] Improve "Example projects" page design (#37007) @danilo-leal -- [docs] Redirect NoSsr, Portal and TextareaAutosize to Base UI API page (#37175) @ZeeshanTamboli -- [docs] Demonstrate `TextField` customization using theme style overrides (#36805) @ZeeshanTamboli -- [docs] Tweak the "Edit this page" button icon (#37142) @danilo-leal -- [docs] Update links to the public roadmap (#36995) @mnajdova -- [docs] Improve Multiselect demo styling (#37120) @michaldudak -- [Stack] Fix import description @oliviertassinari - -### Core - -- [blog] Fix images using "MUI Base" instead of "Base UI" (#37044) @danilo-leal -- [core] Add VSCode extensions recommendations (#37166) @michaldudak -- [test] `e2e-website` related minor fixes (#37204) @ZeeshanTamboli -- [website] Update the active positions (#37075) @DanailH -- [website] Add Romain to the About page (#37124) @romgrk -- [website] Make Toolpad alpha labels consistent (#37125) @gerdadesign - -All contributors of this release in alphabetical order: @akash191095, @DanailH, @danilo-leal, @DerTimonius, @gerdadesign, @hbjORbj, @kriskw1999, @michaldudak, @mnajdova, @oliviertassinari, @PunitSoniME, @romgrk, @sai6855, @ulrichstark, @uuxxx, @wewakekumar, @ZeeshanTamboli, @zignis - -## 5.12.3 - -<!-- generated comparing v5.12.2..master --> - -_May 2, 2023_ - -A big thanks to the 18 contributors who made this release possible. Here are some highlights ✨: - -- all planned breaking changes for Base UI are done. The first beta release should come next week 🎉 -- 🐛 bug fixes and 📚 documentation improvements. - -### `@mui/material@5.12.3` - -- ​<!-- 43 -->[Accordion] Add missing `component` type (#37111) @sai6855 -- ​<!-- 23 -->[ButtonGroup] Should not retain divider color when it is disabled and variant is `text` (#36967) @DavidBoyer11 -- ​<!-- 21 -->[Divider] Fix styles on dividers with text (#35072) @maxdestors -- ​<!-- 04 -->[TextField] Improve IntelliSense support for props (#36737) @sai6855 -- ​<!-- 03 -->[TextField] Fix running click event on disabled (#36892) @sai6855 - -### `@mui/joy@5.0.0-alpha.78` - -- ​<!-- 09 -->[Joy] Miscellaneous fixes and docs improvement (#37026) @siriwatknp - -### `@mui/base@5.0.0-alpha.128` - -#### Breaking changes - -- The `component` prop is no longer supported because it can be replaced with the slots API. This is how the transformation will look like: - - ```diff - <Button - - component="span" - + slots={{ root: "span" }} - /> - ``` - - If using TypeScript, the custom component type should be added as a generic on the `Button` component. - - ```diff - -<Button - +<Button<typeof CustomComponent> - slots={{ root: CustomComponent }} - customProp="foo" - /> - ``` - - There is codemod that you can run in your project to do the transformation: - - ```bash - npx @mui/codemod@latest v5.0.0/base-remove-component-prop <path> - ``` - - The full documentation about the codemod can be found [here](https://github.com/mui/material-ui/blob/master/packages/mui-codemod/README.md#base-remove-component-prop). - - This is the list of PR related to this change: - - - ​<!-- 40 -->[Button][base] Drop `component` prop (#36677) @mnajdova - - ​<!-- 42 -->[Badge][base] Drop `component` prop (#37028) @hbjORbj - - ​<!-- 37 -->[FormControl][base] Drop component prop (#37031) @hbjORbj - - ​<!-- 35 -->[Input][base] Drop component prop (#37057) @hbjORbj - - ​<!-- 34 -->[Menu][base] Drop component prop (#37033) @hbjORbj - - ​<!-- 33 -->[MenuItem][base] Drop component prop (#37032) @hbjORbj - - ​<!-- 32 -->[Modal][base] Drop component prop (#37058) @hbjORbj - - ​<!-- 31 -->[Option][base] Drop component prop (#37052) @hbjORbj - - ​<!-- 30 -->[OptionGroup][base] Drop component prop (#37055) @hbjORbj - - ​<!-- 31 -->[Popper][base] Drop component prop (#37084) @hbjORbj - - ​<!-- 29 -->[Select][base] Drop component prop (#37035) @hbjORbj - - ​<!-- 28 -->[Slider][base] Drop component prop (#37056) @hbjORbj - - ​<!-- 27 -->[Snackbar][base] Drop component prop (#37041) @nicolas-ot - - ​<!-- 26 -->[Switch][base] Drop component prop (#37053) @hbjORbj - - ​<!-- 25 -->[Tab][base] Drop component prop (#36768) @sai6855 - - ​<!-- 24 -->[Tabs][base] Drop component prop (#36770) @sai6855 - - ​<!-- 08 -->[TablePagination][base] Drop component prop (#37059) @sai6855 - - ​<!-- 07 -->[TabPanel][base] Drop component prop (#37054) @sai6855 - - ​<!-- 06 -->[TabsList][base] Drop component prop (#37042) @sai6855 - -- ​<!-- 41 -->[base] Improve API consistency (#36970) @michaldudak - - Brought consistency to Base UI components and hooks' parameters and return values: - - 1. Whenever a hook needs a ref, it's now called `<slot_name>Ref`, which matches the `get<slot_name>Props` in the return value. - 2. All hooks that accept external refs now return merged refs, making combining multiple hooks on one element easier. This was proven necessary in several compound components (like menuItem being both a button and a list item). The type of this value is `React.RefCallback` as using the more general `React.Ref` caused variance issues. - 3. Type of accepted refs is standardized to `React.Ref<Element>` - 4. Naming and typing of the forwarded ref in unstyled components were standardized - it's forwardedRef: React.ForwardedRef<Element> (unless a more specific type is needed). - 5. The shape of the definition of unstyled components was standardized - it's React.forwardRef(function Component(props: Props, forwardedRef: React.Ref<Element>) { ... });. Specifically, the generic parameters of forwardRef were removed as they are specified in function arguments. - -#### Changes - -- ​<!-- 36 -->[FormControl][base] Do not use optional fields in useFormControlContext's return value (#37037) @michaldudak - -### Docs - -- ​<!-- 39 -->[base][docs] Add Base UI Quickstart Guide (#36717) @mj12albert -- ​<!-- 20 -->[docs] Fix Material UI's API linking to Base UI (#37121) @mnajdova -- ​<!-- 19 -->[docs] Fix pagination in the DataGrid demo (#37114) @cherniavskii -- ​<!-- 18 -->[docs] Add notification to the release of the new Time Picker UI (#37065) @joserodolfofreitas -- ​<!-- 17 -->[docs] Specify "Material UI" (not "MUI") where appropriate throughout the docs (#37066) @samuelsycamore -- ​<!-- 16 -->[docs] Use focus-visible instead of focus for Menu demos (#36847) @michaldudak -- ​<!-- 15 -->[docs] Fix small regressions API pages (#36972) @oliviertassinari -- ​<!-- 14 -->[docs] Handle a few docs-feedback (#36977) @oliviertassinari -- ​<!-- 13 -->[docs] Fix anchor link in customization (#37004) @oliviertassinari -- ​<!-- 12 -->[docs] Add a note about minimal required version for theme merging to the guides (#36973) @jakub-stastny -- ​<!-- 11 -->[docs] smooth scrolling added for `back to top` (#37011) @PunitSoniME -- ​<!-- 10 -->[docs] Remove `useFormControl` return values from demos page (#37036) @ZeeshanTamboli -- ​<!-- 47 --> [docs][base] Move styles to the bottom of demos code for `SwitchUnstyled` (#36720) @varunmulay22 -- ​<!-- 46 --> [docs][base] Move styles to the bottom of demos code for `InputUnstyled` (#36724) @varunmulay22 -- ​<!-- 45 --> [docs][base] Move styles to the bottom of demos code for `SliderUnstyled` (#36721) @varunmulay22 -- ​<!-- 44 --> [docs][base] Move styles to the bottom of demos code for `Snackbar` (#36719) @varunmulay22 -- ​<!-- 38 -->[docs][base] Move styles to the bottom of demos code for `SelectUnstyled` (#36718) @varunmulay22 -- ​<!-- 05 -->[templates] Image not displayed in blog layout of React template. (#36991) @navedqb -- ​<!-- 02 -->[website] Take the design role offline @oliviertassinari -- ​<!-- 01 -->[website] Fix URL convention @oliviertassinari -- ​<!-- 21 -->[docs] Turn off job banner on docs (#36080) @joserodolfofreitas - -### Core - -- ​<!-- 22 -->[core] Allow type alias as well in hooks API docs generation (#37034) @ZeeshanTamboli - -All contributors of this release in alphabetical order: @cherniavskii, @DavidBoyer11, @hbjORbj, @jakub-stastny, @joserodolfofreitas, @maxdestors, @michaldudak, @mj12albert, @mnajdova, @navedqb, @nicolas-ot, @oliviertassinari, @PunitSoniME, @sai6855, @samuelsycamore, @siriwatknp, @varunmulay22, @ZeeshanTamboli - -## 5.12.2 - -<!-- generated comparing v5.12.1..master --> - -_Apr 25, 2023_ - -A big thanks to the 12 contributors who made this release possible. Here are some highlights ✨: - -- ⚠️ **[BREAKING CHANGE]** The `Unstyled` suffix has been removed from Base UI component names, including names of types and other related identifiers – a codemod script is provided to assist with the change. -- 🐛 bug fixes and 📚 documentation improvements. - -### `@mui/material@5.12.2` - -- ​<!-- 10 -->[FormControl] Fix `filled` when value is set through `inputProps` (#36741) @sai6855 -- ​<!-- 07 -->[Slider] `onChange` handler should be called only when value has changed (#36706) @gitstart -- ​<!-- 06 -->[Table] Fix `Sorting & Selecting` tables (#36898) @oliviertassinari - -### `@mui/base@5.0.0-alpha.127` - -#### Breaking changes - -- ​<!-- 27 -->[base] Remove unstyled suffix from Base components + Codemod script (#36873) @hbjORbj - - The `Unstyled` suffix has been removed from all Base UI component names, including names of types and other related identifiers. - - You can use this [codemod](https://github.com/mui/material-ui/blob/master/packages/mui-codemod/src/v5.0.0/base-remove-unstyled-suffix.js) to help with the migration: - - ```bash - npx @mui/codemod@latest v5.0.0/base-remove-unstyled-suffix <path> - ``` - -#### Changes - -- ​<!-- 26 -->[codemod][base] Improve the removal of `component` prop codemod script (#36952) @hbjORbj -- ​<!-- 25 -->[codemod][base] Write a migration script for removal of `component` prop from components (#36831) @hbjORbj -- ​<!-- 24 -->[Base][useButton] Allow useButton params to be completely optional (#36922) @mj12albert - -### `@mui/joy@5.0.0-alpha.77` - -- ​<!-- 23 -->[Joy][Chip] Chip button not showing up in Firefox browser (#36930) @TakhyunKim -- ​<!-- 09 -->[Joy] Add `invertedColors` to Menu and Alert (#36975) @siriwatknp -- ​<!-- 08 -->[joy][Select] Set focus visible on select options when navigating with arrow keys (#36689) @gitstart - -### Docs - -- ​<!-- 21 -->[docs] Fix console error introduced by #36408 (#36980) @alexfauquette -- ​<!-- 20 -->[docs] Add stray Joy UI documentation improvements (#36921) @danilo-leal -- ​<!-- 19 -->[docs] Add Joy profile dashboard template (#36931) @siriwatknp -- ​<!-- 18 -->[docs] Fix 404 links (#36969) @oliviertassinari -- ​<!-- 17 -->[docs] Clarify when bundle size optimization is needed (#36823) @oliviertassinari -- ​<!-- 16 -->[docs] Fix Chakra UI theme scoping typo (#36950) @mj12albert -- ​<!-- 15 -->[docs] Add snackbar example using sonner (#36926) @PupoSDC -- ​<!-- 14 -->[docs] Adjust the Material Icons page design and formatting (#36937) @danilo-leal -- ​<!-- 13 -->[docs] Allows to customize menu with any icon (#36408) @alexfauquette -- ​<!-- 12 -->[docs] Add info about passing ref to input element (#36913) @tomaskebrle -- ​<!-- 11 -->[docs][material] Tabs API section cleanup (#36942) @mnajdova - -### Core - -- ​<!-- 22 -->[core] Fix CI failure on `master` (#37016) @hbjORbj -- ​<!-- 05 -->[typescript] Add the missing explicit component return types (#36924) @michaldudak -- ​<!-- 04 -->[website] Update main data grid demo on X landing page (#37001) @cherniavskii -- ​<!-- 03 -->[website] Design role updates (#36997) @danilo-leal -- ​<!-- 02 -->[website] X component section improvements (#36598) @danilo-leal -- ​<!-- 01 -->[website] Developer Advocate role filled @oliviertassinari - -All contributors of this release in alphabetical order: @alexfauquette, @cherniavskii, @danilo-leal, @gitstart, @hbjORbj, @michaldudak, @mj12albert, @mnajdova, @oliviertassinari, @PupoSDC, @sai6855, @siriwatknp, @TakhyunKim, @tomaskebrle - -## 5.12.1 - -<!-- generated comparing v5.12.0..master --> - -_Apr 17, 2023_ - -A big thanks to the 16 contributors who made this release possible. This release was mostly about 🐛 bug fixes and 📚 documentation improvements. - -### `@mui/material@5.12.1` - -- ​<!-- 24 -->[Autocomplete] Fix autocomplete left padding (#36649) @mj12albert -- ​<!-- 17 -->[Button] Fix contained with inherit prop not adapting on dark mode (#34508) @jesrodri -- ​<!-- 07 -->[FormControlLabel] Add `required` prop (#34207) @emlai -- ​<!-- 04 -->[Tabs] Fix null reference in ScrollbarSize after unmounting (#36485) @rkdrnf -- ​<!-- 03 -->[TextField] Fix type error when using `inputTypeSearch` class for `outlined` and `filled` inputs (#36740) @sai6855 -- ​<!-- 02 -->[ThemeProvider] Fix theme proptypes (#36852) @siriwatknp - -### `@mui/system@5.12.1` - -#### Breaking changes - -- ​<!-- 06 -->[Grid2] Replace context with `cloneElement` (#36399) @siriwatknp - - `Grid2` now uses `React.cloneElement` instead of React context for passing the spacing and columns to the next container. The change is close to how CSS flexbox behaves. - -#### Changes - -- ​<!-- 14 -->[CssVarsProvider] Always generate new `css` object (#36853) @siriwatknp - -### `@mui/base@5.0.0-alpha.126` - -#### Breaking changes - -- ​<!-- 23 -->[base] Refactor the compound components building blocks (#36400) @michaldudak - Components affected by the changes are: - - Menu - - `MenuUnstyledContext` is replaced by `MenuProvider`. The value to pass to the provider is returned by the `useMenu` hook. - - MenuUnstyled's `onClose` prop is replaced by `onOpenChange`. It has the `open` parameter and is called when a menu is opened or closed - - Select - - `SelectUnstyledContext` is replaced by `SelectProvider`. The value to pass to the provider is returned by the `useSelect` hook. - - `SelectUnstyled`'s popup is permanently mounted. - - The `defaultOpen` prop was added to the SelectUnstyled. The open/close state can now be controlled or uncontrolled, as a `value`. - - Tabs - - `TabsContext` is replaced by `TabsProvider`. The value to pass to the provider is returned by the `useTabs` hook. - - To deselect all tabs, pass in `null` to Tabs' `value` prop, instead of `false`. This is consistent with how Select works. - - The `value` prop is still technically not mandatory on TabUnstyled and TabPanel, but when omitted, the contents of the selected tab panel will not be rendered during SSR. - -### `@mui/joy@5.0.0-alpha.76` - -- ​<!-- 05 -->[Table][Joy] Replace uses of css selector `*-child` to `*-of-type` (#36839) @keyvanm - -### Docs - -- ​<!-- 25 --> [docs][base] Move styles to the bottom of demos code for `BadgeUnstyled` (#36723) @varunmulay22 -- ​<!-- 22 -->[docs][base] Mention that the hook does not accept any parameters in the `Parameters` section of the API docs (#36773) @ZeeshanTamboli -- ​<!-- 21 -->[docs][base] Move styles to the bottom of demos code for `ModalUnstyled` (#36580) @gitstart -- ​<!-- 20 -->[docs][base] Move styles to the bottom of demos code for `Tabs` (#36577) @gitstart -- ​<!-- 19 -->[docs][base] Move styles to the bottom of demos code for `Popper` (#36578) @gitstart -- ​<!-- 18 -->[docs][base] Move styles to the bottom of demos code for `TablePagination` (#36593) @gitstart -- ​<!-- 13 -->[docs] Remove the incorrect info about useButton's ref parameter (#36883) @michaldudak -- ​<!-- 12 -->[docs] Sync <Stack> between projects (#36785) @oliviertassinari -- ​<!-- 11 -->[docs] Add guides to overriding component structure in Base UI and Joy UI docs (#34990) @samuelsycamore -- ​<!-- 10 -->[docs] Content changed from 'row' to 'orientation=horizontal' (#36858) @navedqb -- ​<!-- 09 -->[docs][Joy] `component`, `slots`, `slotProps` must be visible in Prop table in API docs (#36666) @hbjORbj -- ​<!-- 08 -->[docs][Select] Fix duplicate ID in small size Select demo (#36792) @sai6855 - -### Core - -- ​<!-- 16 -->[core] Use glob to find the test files in parseTest (#36305) @flaviendelangle -- ​<!-- 15 -->[core] Fix minor SEO issues @oliviertassinari -- ​<!-- 01 -->[website] Fix visual bug appbar (#36875) @oliviertassinari - -All contributors of this release in alphabetical order: @emlai, @flaviendelangle, @gitstart, @hbjORbj, @jesrodri, @keyvanm, @michaldudak, @mj12albert, @navedqb, @oliviertassinari, @rkdrnf, @sai6855, @samuelsycamore, @siriwatknp, @varunmulay22, @ZeeshanTamboli - -## 5.12.0 - -<!-- generated comparing v5.11.16..master --> - -_Apr 11, 2023_ - -A big thanks to the 9 contributors who made this release possible. Here are some highlights ✨: - -- 💫 Added [theme scope](https://mui.com/material-ui/guides/theme-scoping/) for using multiple design systems (#36664) @siriwatknp -- 🐛 bug fixes and 📚 documentation improvements. - -### `@mui/system@5.12.0` - -- ​<!-- 05 -->[system] Introduce theme scope for using multiple design systems (#36664) @siriwatknp - -### `@mui/base@5.0.0-alpha.125` - -- ​<!-- 06 -->[PopperUnstyled] Do not merge internal `ownerState` with `ownerState` from props (#36599) @hbjORbj - -### `@mui/joy@5.0.0-alpha.75` - -- ​<!-- 08 -->[Joy] Add tests for slots/slotProps for all components (#36828) @hbjORbj -- ​<!-- 07 -->[Joy] Support `slots`/`slotsProps` for every component (components with only root slot too) (#36540) @hbjORbj - -### Docs - -- ​<!-- 23 -->[docs][Backdrop] Improvements to the docs (#34244) @alirezahekmati -- ​<!-- 20 -->[docs] Fix base API redirects (#36833) @mnajdova -- ​<!-- 19 -->[docs] Improve perf on tab APIs (#36832) @mnajdova -- ​<!-- 18 -->[docs] Revert CircularProgress component text to be proper noun instead (#36837) @ZeeshanTamboli -- ​<!-- 17 -->[docs] Simplify language redirection @oliviertassinari -- ​<!-- 16 -->[docs] Add missing `readOnly` state class in the list (#36788) @ZeeshanTamboli -- ​<!-- 15 -->[docs] Improve side nav scroll into view (#36732) @oliviertassinari -- ​<!-- 14 -->[docs][base & joy] Display "Classes" Section in API docs (#36589) @hbjORbj -- ​<!-- 13 -->[docs] Fix 100+ typos throughout the Material UI docs (#36194) @Lioness100 -- ​<!-- 12 -->[docs] Change "coming soon" chip color (#36786) @danilo-leal -- ​<!-- 11 -->[docs][Joy] Fix wrong prop descriptions (#36826) @hbjORbj -- ​<!-- 10 -->[docs][material] Highlight global state classes in CSS table in API docs (#36633) @hbjORbj -- ​<!-- 09 -->[examples] Fix `SliderUnstyled` slots `key` name (#36830) @sai6855 -- ​<!-- 04 -->[Tabs] Improve useTab() API page (#36725) @oliviertassinari - -### Core - -- ​<!-- 22 -->[core] Increase margin to scroll @oliviertassinari -- ​<!-- 21 -->[core] Replace MUI Base with Base UI (#36716) @mnajdova -- ​<!-- 03 -->[website] Fix broken career website links @oliviertassinari -- ​<!-- 02 -->[website] Fix backlinks to homepage (#36801) @oliviertassinari -- ​<!-- 01 -->[website] Tweaks to the Designer position ad (#36771) @danilo-leal - -All contributors of this release in alphabetical order: @alirezahekmati, @danilo-leal, @hbjORbj, @Lioness100, @mnajdova, @oliviertassinari, @sai6855, @siriwatknp, @ZeeshanTamboli - -## 5.11.16 - -<!-- generated comparing v5.11.15..master --> - -_Apr 4, 2023_ - -A big thanks to the 17 contributors who made this release possible. Here are some highlights ✨: - -- 💅 Added tabs on API pages of Base UI to switch between component and hook references (#35938) @mnajdova -- 🐛 bug fixes and 📚 documentation improvements. - -### `@mui/material@5.11.16` - -- [Autocomplete] Listen for click on the root element (#36369) @sai6855 -- [Autocomplete] Fix navigation issue on mouse hover (#35196) @sai6855 -- [Card] Fix Card focus effect overflowing parent card (#36329) @mj12albert -- [Grid] Missing slot (#36765) @siriwatknp -- [Select] Make error part of the `ownerState` to enable overriding styles with it in theme (#36422) @gitstart -- [Slider] Fix ValueLabel UI issues comes when size="small" and orientation="vertical (#36738) @yushanwebdev - -### `@mui/icons-material@5.11.16` - -- [icons] Do not ignore popular icons (#36608) @michaldudak - -### `@mui/joy@5.0.0-alpha.74` - -- [Joy] Add `ModalOverflow` component (#36262) @siriwatknp -- [Joy] Fix `Checkbox` custom color prop type warning (#36691) @amal-qb - -### Docs - -- [docs][base] Add return type for `useFormControlUnstyledContext` hook (#36302) @HeVictor -- [docs][base] Move styles to the bottom of demos code for `FormControl` (#36579) @gitstart -- [docs][base] Move styles to the bottom of demos code for `Menu` (#36582) @gitstart -- [docs][base] Move styles code to bottom in the `Button` demos (#36590) @sai6855 -- [docs][base] Show components & hooks API on the components page (#35938) @mnajdova -- [docs] Describe slotProps in MUI Base customization doc (#36206) @michaldudak -- [docs] Fix double API page redirection (#36743) @oliviertassinari -- [docs] Remove hash property and leverage pathname (#36764) @siriwatknp -- [docs] Introduce markdown permalink to source (#36729) @oliviertassinari -- [docs] Tabs API add slots section (#36769) @mnajdova -- [docs] Update feedbacks management on slack (#36705) @alexfauquette -- [docs] Fix Joy UI URL to tokens (#36742) @oliviertassinari -- [docs] Add toggle-button coming soon page (#36618) @siriwatknp -- [docs] Fix typo on the Joy UI theme builder (#36734) @danilo-leal -- [docs] Fix small typo (#36727) @RBerthier -- [docs] Fix Joy UI template broken image loading @oliviertassinari -- [docs] Hide the default API column if it's empty (#36715) @mnajdova -- [docs] Update Material UI Related Projects page (#34203) @viclafouch -- [docs] Revise Joy UI "Circular Progress" page (#36126) @LadyBluenotes -- [docs] Revise Joy UI "Radio" page (#35893) @DevinCLane -- [docs] Support Google Analytics 4 (#36123) @alexfauquette -- [docs][material] Keep consistency in description of classes (#36631) @hbjORbj -- [docs] Remove redundant files and fix regression (#36775) @ZeeshanTamboli - -### Core - -- [blog] Compress images @oliviertassinari -- [core] Remove unused token (#36722) @oliviertassinari - -All contributors of this release in alphabetical order: @alexfauquette, @amal-qb, @danilo-leal, @DevinCLane, @gitstart, @hbjORbj, @HeVictor, @LadyBluenotes, @michaldudak, @mj12albert, @mnajdova, @oliviertassinari, @RBerthier, @sai6855, @siriwatknp, @viclafouch, @yushanwebdev - -## 5.11.15 - -<!-- generated comparing v5.11.14..master --> - -_Mar 28, 2023_ - -A big thanks to the 10 contributors who made this release possible. We have one big highlight this week ✨: - -- @siriwatknp made a [Theme Builder](https://mui.com/joy-ui/customization/theme-builder) for Joy UI 🎨 (#35741) - -### `@mui/material@5.11.15` - -- [Chip] Fix error when theme value is a CSS variable (#36654) @siriwatknp -- [Grid2] Support dynamic nested columns (#36401) @siriwatknp - -### `@mui/system@5.11.15` - -- [system] Enable regressions tests & fix regressions (#36611) @mnajdova -- [Stack] Add `useFlexGap` prop (#36404) @siriwatknp - -### `@mui/base@5.0.0-alpha.122` - -- [Autocomplete] Update `autoSelect` prop description (#36280) @sai6855 -- [TablePagination][base] Improve `actions` type in `slotProps` (#36458) @sai6855 -- [Base] Add JSDoc comments for classes of Base components (#36586) @hbjORbj -- [useSlider][base] Add API docs for the hook parameters and return type (#36576) @varunmulay22 - -### `@mui/joy@5.0.0-alpha.73` - -- [Joy] Miscellaneous fixes (#36628) @siriwatknp -- [Joy] Add palette customizer (#35741) @siriwatknp - -### Docs - -- Revert "[docs] Use `theme.applyDarkStyles` for the rest of the docs" (#36602) @mnajdova -- [blog] Improvements on v6 announcement blog (#36505) @joserodolfofreitas -- [docs] Add `Snackbar` coming soon page (#36604) @danilo-leal -- [docs] Add accordion coming soon page (#36279) @siriwatknp -- [docs] Fix palette customizer theme augmentation (#36629) @siriwatknp -- [docs] Finish migration away from https://reactjs.org/ @oliviertassinari -- [docs] Remove duplicated slot descriptions (#36621) @hbjORbj -- [docs] Fix broken example link (#36607) @mnajdova -- [docs] Use `theme.applyDarkStyles` (#36606) @siriwatknp -- [docs] Improve API for theme default prop (#36490) @oliviertassinari -- [docs][Table] Refactor `Sorting & Selecting` table demo (#33236) @IFaniry - -### Core - -- [core] Use Netlify function for feedback management (#36472) @alexfauquette - -All contributors of this release in alphabetical order: @alexfauquette, @danilo-leal, @hbjORbj, @IFaniry, @joserodolfofreitas, @mnajdova, @oliviertassinari, @sai6855, @siriwatknp, @varunmulay22 - -## 5.11.14 - -<!-- generated comparing v5.11.13..master --> - -_Mar 21, 2023_ - -A big thanks to the 15 contributors who made this release possible. -This release was mostly about 🐛 bug fixes and 📚 documentation improvements. - -### `@mui/material@5.11.14` - -- [Breadcrumbs] Add ability to change icon used in `BreadcrumbCollapsed` through slots (#33812) @pratikkarad -- [Stepper] Add aria-current to active StepButton (#36526) @michalak111 -- [TabScrollButton] Add ability to change left and right icons (#33863) @pratikkarad -- [ListItemButton] Respect LinkComponent (#34159) @zaverden -- [l10n] Add Central Kurdish (ku-CKB) locale (#36592) @HediMuhamad - -### `@mui/system@5.11.14` - -- [system] Fix sx prop regression for fontWeight values (#36543) @mnajdova - -### `@mui/base@5.0.0-alpha.121` - -- [docs][base] Improve the Slots Table in API docs (#36330) @hbjORbj - -### `@mui/joy@5.0.0-alpha.72` - -- [Joy] Ensure new CSS variable naming is everywhere (#36460) @hbjORbj -- [Menu][joy] Classname listbox is missing (#36520) @hbjORbj -- [Joy] Fix `--List-decorator*` vars (#36595) @siriwatknp - -### `@mui/lab@5.0.0-alpha.124` - -- [Masonry] Include Masonry in theme augmentation interface (#36533) @hbjORbj - -### Docs - -- [blog] Post blog about Chamonix retreat to the website (#36517) @mikailaread -- [blog] Fix image layout shift (#36522) @oliviertassinari -- [docs] Use `theme.applyDarkStyles` for the rest of the docs (#36161) @siriwatknp -- [docs] Fix 301 and 404 links (#36555) @oliviertassinari -- [docs] Keep slot code order in API docs (#36499) @oliviertassinari -- [docs] Missing className on Migrating from JSS example (#36536) @gabrielnafuzi -- [docs] Fix function name for Joy templates (#36512) @hbjORbj -- [docs] Add multiline Chip example (#36437) @dav1app -- [docs] Add a new gold sponsor (#36518) @hbjORbj -- [docs][joy] Improve the Slots Table in API docs (#36328) @hbjORbj -- [docs] Fix virtualElement demo for Popper (#36320) @sai6855 -- [docs] Fix typo in API docs (#36388) @RomanHotsiy -- [docs] Ensure classname displayed under Slots section in API docs exists (#36539) @hbjORbj -- [docs][joy] Build TS versions for Modal component demos (#36385) @varunmulay22 -- [docs][joy] Build TS versions for Menu component demos (#36383) @varunmulay22 -- [docs][joy] Build TS versions for Switch component demos (#36379) @varunmulay22 -- [docs] Remove `shouldSkipGeneratingVar` usage (#36581) @siriwatknp -- [docs][material] Update Table's demo to show pointer cursor on clickable rows (#36546) @varunmulay22 -- [website] Designer role changes (#36528) @danilo-leal -- [website] Open Head of Operations role (#36501) @oliviertassinari -- [website] Limit sponsors description to two rows @oliviertassinari - -### Core - -- [core] Fix CI @oliviertassinari -- [core] Fix blank line @oliviertassinari -- [website] Simplify internal ops @oliviertassinari - -All contributors of this release in alphabetical order: @danilo-leal, @dav1app, @gabrielnafuzi, @hbjORbj, @HediMuhamad, @michalak111, @mikailaread, @mnajdova, @oliviertassinari, @pratikkarad, @RomanHotsiy, @sai6855, @siriwatknp, @varunmulay22, @zaverden - -## 5.11.13 - -<!-- generated comparing v5.11.12..master --> - -_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-ui/getting-started/customization/#disabling-default-css-classes) of the default classes in Base UI (#35963) -- other 🐛 bug fixes and 📚 documentation improvements. - -### `@mui/material@5.11.13` - -- ​<!-- 13 -->[core] Bump Base UI's version in Material UI (#36492) @hbjORbj -- ​<!-- 17 -->[material] Export `shouldSkipGeneratingVar` from Material UI (#36489) @siriwatknp -- ​<!-- 06 -->[Typography] Apply font properties to typography inherit variant (#33621) @oyar99 - -### `@mui/base@5.0.0-alpha.121` - -- ​<!-- 16 -->[base] Disable classes generation via a context (#35963) @michaldudak -- ​<!-- 15 -->[useMenu][base] Add return interface for useMenu hook (#36376) @HeVictor -- ​<!-- 05 -->[useBadge] Add interface for the return value (#36042) @skevprog -- ​<!-- 04 -->[useMenuItem] Add explicit return type (#36359) @rayrw -- ​<!-- 03 -->[useTabs] Add explicit return type (#36047) @sai6855 - -### Docs - -- ​<!-- 14 -->[blog] Update fields behavior on date pickers blog post (#36480) @joserodolfofreitas -- ​<!-- 12 -->[docs] Info markdown not rendering in Contributing Guide README (#36487) @hbjORbj -- ​<!-- 11 -->[docs] Remove 301 redirection to MUI X lab migration @oliviertassinari -- ​<!-- 10 -->[docs] Fix a grammar error (#36486) @hbjORbj -- ​<!-- 09 -->[docs] Add blog post notification for v6 release (#36446) @joserodolfofreitas -- ​<!-- 08 -->[docs] Update link to v5 docs (#36421) @m4theushw -- ​<!-- 07 -->[docs] Fix 404 in the API page links (#36419) @oliviertassinari -- ​<!-- 08 -->[docs][joy] Error in the exemplary Codesandbox of using Material UI and Joy UI together (#36462) @hbjORbj -- ​<!-- 06 -->[examples] Refactor to have better types in the Next.js + TypeScript examples (#36355) @erikian -- ​<!-- 02 -->[website] Fix layout shift when loading /blog/mui-x-v6/ @oliviertassinari -- ​<!-- 01 -->[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 - -<!-- generated comparing v5.11.11..master --> - -_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` - -- ​<!-- 30 -->[Autocomplete] Fix list scrolls to the top when new data is added on touch devices (#36231) @SaidMarar -- ​<!-- 29 -->[Autocomplete] Add `Mui-expanded` class (#33312) @Osman-Sodefa -- ​<!-- 24 -->[Dialog] Use the `id` prop provided to the `DialogTitle` component (#36353) @Kundan28 -- ​<!-- 07 -->[Menu] Fix Menu Paper styles overriding in the theme (#36316) @Paatus - -### `@mui/lab@5.0.0-alpha.122` - -- ​<!-- 05 -->[TreeView] Fix Tree View inside shadow root crashes (#36225) @NoFr1ends - -### `@mui/system@5.11.12` - -#### Breaking changes - -- ​<!-- 26 -->[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 - <CssVarsProvider - + theme={createCssVarsProvider({ - + // other theme keys - + shouldSkipGeneratingVar: (keys) => keys[0] === 'typography' && keys[1] === 'h1' - + })} /> - ``` - - This breaking change **only** affects experimental APIs - -### `@mui/base@5.0.0-alpha.120` - -#### Breaking changes - -- ​<!-- 27 -->[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 <MultiSelectUnstyled /> - +return <SelectUnstyled multiple /> - } - ``` - -#### Changes - -- ​<!-- 34 -->[useSnackBar] Add explicit return type (#36052) @sai6855 -- ​<!-- 04 -->[useMenu] Fix `import type` syntax (#36411) @ZeeshanTamboli -- ​<!-- 03 -->[useSwitch] Add explicit return type (#36050) @sai6855 - -### `@mui/joy@5.0.0-alpha.70` - -#### Breaking changes - -- ​<!-- 09 -->[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 - -<List sx={{ py: 'var(--List-divider-gap)' }}> - +<List sx={{ py: 'var(--ListDivider-gap)' }}> - -<Switch sx={{ '--Switch-track-width': '40px' }}> - +<Switch sx={{ '--Switch-trackWidth': '40px' }}> - ``` - -#### Changes - -- ​<!-- 28 -->[Autocomplete][joy] Add disabled class to the popup indicator (#36397) @hbjORbj -- ​<!-- 08 -->[Joy] Fix broken loading button in Safari (#36298) @Kuba429 - -### Docs - -- ​<!-- 33 -->[docs][joy] Clarify when `CssVarsProvider` is required (#36410) @mnajdova -- ​<!-- 32 -->MUI X v6 release announcement (#36398) @joserodolfofreitas -- ​<!-- 23 -->[docs] Add instructions for deploying docs without a release (#36301) @cherniavskii -- ​<!-- 22 -->[docs] Fix 301 redirections on the docs @oliviertassinari -- ​<!-- 21 -->[docs] Update MUI X banner to reflect stable release (#36354) @MBilalShafi -- ​<!-- 20 -->[docs] Clarify the future plan for integrating Base UI in Material UI (#36365) @mnajdova -- ​<!-- 19 -->[docs] Improve visual look of loose lists (#36190) @oliviertassinari -- ​<!-- 18 -->[docs] Fix @mui/styles example links (#36331) @oliviertassinari -- ​<!-- 17 -->[docs][joy] Build TS versions for List component demos (#36382) @sai6855 -- ​<!-- 16 -->[docs][joy] Build TS versions for Radio component demos (#36406) @sai6855 -- ​<!-- 15 -->[docs][joy] Build TS versions for Checkbox component demos (#36381) @sai6855 -- ​<!-- 14 -->[docs][joy] Build TS versions for Select component demos (#36380) @sai6855 -- ​<!-- 13 -->[docs][joy] Build TS versions for Typography component demos (#36378) @varunmulay22 -- ​<!-- 12 -->[docs][joy] Add TypeScript demos for `Divider` (#36374) @sai6855 -- ​<!-- 11 -->[docs][joy] Build TS versions for Textarea component demos (#36371) @varunmulay22 -- ​<!-- 10 -->[docs][joy] Build TS versions for Link component demos (#36366) @hbjORbj - -### Core - -- ​<!-- 31 -->Revert "Bump rimraf to ^4.1.3" (#36420) @mnajdova -- ​<!-- 25 -->[core] Fix test utils types and external `buildApiUtils` usage issues (#36310) @LukasTy -- ​<!-- 06 -->[test] Remove duplicate `combobox` role queries in Autocomplete tests (#36394) @ZeeshanTamboli -- ​<!-- 02 -->[website] Clarify redistribution @oliviertassinari -- ​<!-- 01 -->[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 - -<!-- generated comparing v5.11.10..master --> - -_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 Base UI and Joy UI by @hbjORbj, for e.g. [SliderUnstyled API](https://mui.com/base-ui/api/slider-unstyled/#slots) -- other 🐛 bug fixes and 📚 documentation improvements. - -### `@mui/material@5.11.11` - -- ​<!-- 30 -->[Autocomplete] Adds `sx` prop to `ListboxProps` type (#36243) @sai6855 -- ​<!-- 11 -->[material] Add global CSS class for `readOnly` prop (#32822) @jrparish -- ​<!-- 10 -->[Stack][material] Use createStack from MUI System (#33795) @mnajdova -- ​<!-- 07 -->[Select] Fix incorrect selecting of first element (#36024) @michaldudak -- ​<!-- 06 -->[Slider] Miscellaneous improvements (#35941) @ZeeshanTamboli -- ​<!-- 05 -->[Slider] Remove unnecessary `data-focusvisible` attribute (#36091) @ZeeshanTamboli -- ​<!-- 04 -->[Snackbar] Replace component logic with `useSnackbar` hook (#36272) @ZeeshanTamboli -- ​<!-- 03 -->[TextField] Fix floating label position (#36246) @oliviertassinari -- ​<!-- 13 -->[TextField] Fix floating label position (#36288) @oliviertassinari - -### `@mui/base@5.0.0-alpha.119` - -#### Breaking changes - -- ​<!-- 29 -->[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 - <TablePaginationUnstyled - - classes={{ toolbar: 'toolbar-classname', menuItem: 'menuItem-classname' }} - + slotProps={{ toolbar: { className: 'toolbar-classname' }, menuItem: { className: 'menuItem-classname'}}} - /> - ``` - -- ​<!-- 28 -->[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 - -- ​<!-- 31 -->[Autocomplete] Add docs interface for the hook (#36242) @HeVictor -- ​<!-- 09 -->[MenuUnstyled] Remove extra useMemo (#36265) @ivp-dev -- ​<!-- 31 -->[base] Export all slot prop overrides interfaces (#36323) @michaldudak - -### `@mui/codemod@5.11.11` - -- ​<!-- 35 -->[base] Codemod for hook directory migration (#36295) @hbjORbj - -### `@mui/joy@5.0.0-alpha.69` - -- ​<!-- 15 -->[Joy] Able to remove default tokens from theme types (#36006) @siriwatknp -- ​<!-- 14 -->[Joy] Fix modal dialog overflow viewport (#36103) @siriwatknp -- ​<!-- 13 -->[Joy] Select popup should have max-height (#36156) @Vivek-Prajapatii -- ​<!-- 12 -->[Joy] Fix `ListDivider` to change semantic based on `List` (#36266) @siriwatknp - -### Docs - -- ​<!-- 27 -->[docs][base] List slots in API documentation (#36104) @hbjORbj -- ​<!-- 26 -->[docs] Add missing sandbox adapter deps resolving (#36291) @LukasTy -- ​<!-- 25 -->[docs] Allow to pass navigation bar banner from outside (#36299) @MBilalShafi -- ​<!-- 24 -->[docs] Fix code on the Working with Tailwind CSS guide (#36090) @mnajdova -- ​<!-- 23 -->[docs] Remove See Slots Section text from Material UI slots description (#36284) @hbjORbj -- ​<!-- 22 -->[docs] Fix emotion warning `:first-child` (#36263) @siriwatknp -- ​<!-- 21 -->[docs][joy] Improve the descriptions of props in API docs (#36307) @hbjORbj -- ​<!-- 20 -->[docs][joy] List slots in API documentation (#36271) @hbjORbj -- ​<!-- 19 -->[docs][joy] Build API documentations (#36008) @hbjORbj -- ​<!-- 18 -->[examples] Update Next.js examples to use built-in font (#36315) @Juneezee -- ​<!-- 17 -->[examples] Update curl link in `material-ui-nextjs-ts-v4-v5-migration` example README (#36321) @ZeeshanTamboli -- ​<!-- 16 -->[examples] Convert Next.js \_document class components to function components (#36109) @ossan-engineer - -### Core - -- ​<!-- 08 -->[Rating] Add a comment in Rating component to use `readOnly` state class (#36357) @ZeeshanTamboli -- ​<!-- 02 -->[website] Fix broken links to role levels (#36333) @oliviertassinari -- ​<!-- 01 -->[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 - -<!-- generated comparing v5.11.9..master --> - -_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` - -- ​<!-- 22 -->[Avatar] Fix ownerState usage with styleOverrides when fallback is used (#36228) @sai6855 -- ​<!-- 21 -->[Badge][material] Replace `BadgeUnstyled` with `useBadge` hook (#36158) @hbjORbj -- ​<!-- 03 -->[Switch] Fix DOM warning when `type` isn't `checkbox` or `radio` (#36170) @dani-mp -- ​<!-- 02 -->[TextareaAutosize] Convert code to TypeScript (#35862) @sai6855 -- ​<!-- 01 -->[useMediaQuery] Fix behavior of noSsr with React 18 (#36056) @oliviertassinari - -### `@mui/joy@5.0.0-alpha.68` - -- ​<!-- 05 -->[Joy] Add `zIndex` to theme (#36236) @siriwatknp -- ​<!-- 04 -->[Joy] Remove transition from all components (#35952) @hbjORbj - -### Docs - -- ​<!-- 20 -->[docs][base] Fix base Input demos for Safari (#36213) @mj12albert -- ​<!-- 16 -->[docs] Fix 301 links @oliviertassinari -- ​<!-- 15 -->[docs] Fix modal transition demos (#36137) @oliviertassinari -- ​<!-- 14 -->[docs] Update links to pt examples (#36237) @Aleff13 -- ​<!-- 13 -->[docs] Update custom Typography variants example (#36185) @mj12albert -- ​<!-- 12 -->[docs] Change markdown numbering syntax (#36187) @mj12albert -- ​<!-- 11 -->[docs] Fix switch alignment in `Disabled tree items` section in Tree View docs (#36217) @PunitSoniME -- ​<!-- 10 -->[docs] Standardize example names (#36112) @samuelsycamore -- ​<!-- 09 -->[docs] Fix typo @oliviertassinari -- ​<!-- 08 -->[docs] Fix markdown table alignments (#36136) @oliviertassinari -- ​<!-- 07 -->[docs] Small color tweaks to the docs search bar (#36160) @danilo-leal -- ​<!-- 06 -->[docs][joy] Update class name prefixes in the `Anatomy` section (#36210) @ZeeshanTamboli - -### Core - -- ​<!-- 19 -->[core] Migrate nprogress to emotion (#36181) @siriwatknp -- ​<!-- 18 -->[core] Enforce namespace import for ReactDOM (#36208) @mj12albert -- ​<!-- 17 -->[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 - -<!-- generated comparing v5.11.8..master --> - -_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 - -<!-- generated comparing v5.11.7..master --> - -_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` - -- ​<!-- 10 -->[FormLabel] Export `FormLabelOwnProps` from `FormLabel` to fix type error (#36057) @yoskeoka - -### `@mui/joy@5.0.0-alpha.66` - -- ​<!-- 09 -->[Joy] Miscellaneous fixes (#36073) @siriwatknp -- ​<!-- 08 -->[Joy] Add sign-in side template (#36019) @siriwatknp -- ​<!-- 07 -->[Joy] Add missing `Table` export from root (#36010) @sai6855 - -### `@mui/system@5.11.8` - -- ​<!-- 05 -->[System] Fix nested grid v2 (#35994) @siriwatknp - -### `@mui/styled-engine@5.11.8` - -- ​<!-- 06 -->[styled-engine] Create cache only if `document` is available (#36001) @m4theushw - -### Docs - -- ​<!-- 23 -->[blog] Fix dark mode support (#35969) @oliviertassinari -- ​<!-- 19 -->[docs] Add banner pointing to "Whats new" in MUI X page (#36074) @joserodolfofreitas -- ​<!-- 18 -->[docs] Revert unintended change @oliviertassinari -- ​<!-- 17 -->[docs] [Joy] Fixed a typo in `customizing theme tokens` (#36067) @badalsaibo -- ​<!-- 16 -->[docs] Improve inline preview's information (#35974) @oliviertassinari -- ​<!-- 15 -->[docs] Fix wrong v5 migration instructions (#36022) @oliviertassinari -- ​<!-- 14 -->[docs] Fix autocomplete render group key warning in the demo (#36025) @chuanyu0201 -- ​<!-- 13 -->[docs] Add hooks API pages for Base UI (#35828) @mnajdova -- ​<!-- 12 -->[docs] Fix grammar typo (#36016) @alexownejazayeri -- ​<!-- 11 -->[docs][joy] Add JSDoc for the `AutocompleteProps` type (#36039) @ArthurPedroti - -### Core - -- ​<!-- 22 -->[core] Make it easier to find who is importing specific files (#35896) @oliviertassinari -- ​<!-- 21 -->[core] Fix SEO redirections issues (#36041) @oliviertassinari -- ​<!-- 20 -->[core] Fix a typo in the comment in setup test files (#36014) @ZeeshanTamboli -- ​<!-- 04 -->[typescript] Explicitly define the component return types (#36013) @michaldudak -- ​<!-- 03 -->[website] Fix layout shift (#36070) @oliviertassinari -- ​<!-- 02 -->[website] Revise the Lead Designer role job ad (v1) (#36068) @oliviertassinari -- ​<!-- 01 -->[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 - -<!-- generated comparing v5.11.6..master --> - -_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` - -- ​<!-- 30 -->[Autocomplete] Prevent reset scroll position when new options are added (#35735) @sai6855 -- ​<!-- 24 -->[CssVarsProvider] Skip `unstable_sxConfig` variables (#35932) @siriwatknp -- ​<!-- 10 -->[InputLabel] Add missing `component` type (#35852) @sai6855 -- ​<!-- 05 -->[Tooltip] Fix tooltip position (#35909) @marktoman - -### `@mui/base@5.0.0-alpha.116` - -- ​<!-- 29 -->[ListboxUnstyled] Fix option state highlighted to prevent unnecessary focus (#35838) @SaidMarar - -### `@mui/joy@5.0.0-alpha.65` - -#### Breaking changes - -- ​<!-- 05 -->[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 - <Button - -sx={{ '& .JoyButton-root': { '& .JoyButton-button': {} } }} - +sx={{ '& .MuiButton-root': { '& .MuiButton-button': {} } }} - /> - ``` - - You can use this [codemod](https://github.com/mui/material-ui/blob/master/packages/mui-codemod/README.md#joy-rename-classname-prefix) to help with the migration. - -- ​<!-- 04 -->[Joy] Replace `row` prop with `orientation` prop in all Joy UI components (#35721) @hbjORbj - - - Transforms `row` prop to `orientation` prop across `Card`, `List` and `RadioGroup` components in Joy UI. - - ```diff - <Card - -row - +orientation={"horizontal"} - /> - ``` - - You can use this [codemod](https://github.com/mui/material-ui/blob/master/packages/mui-codemod/README.md#joy-rename-row-prop) to help with the migration. - -#### Changes - -- ​<!-- 26 -->[Joy][Checkbox] Display correct icon in checkbox (#35943) @sai6855 -- ​<!-- 09 -->[Joy] Add `Table` component (#35872) @siriwatknp -- ​<!-- 08 -->[Joy] Miscellaneous fixes (#35953) @siriwatknp - -### Docs - -- ​<!-- 28 -->[blog] Add RSS feed (#35777) @gorjiali -- ​<!-- 27 -->[blog] Prevent horizontal scroll on blog posts (#35948) @oliviertassinari -- ​<!-- 23 -->[docs] Add to codemod README about an added script (#35999) @hbjORbj -- ​<!-- 22 -->[docs] Add a warning about to clear the local storage when `defaultMode` changes (#35937) @ArthurPedroti -- ​<!-- 21 -->[docs] Fix Joy UI variables playground (#35950) @siriwatknp -- ​<!-- 20 -->[docs] Fix typos in base components docs (#35985) @HeVictor -- ​<!-- 19 -->[docs] Fix event's label reported to GA (#35930) @oliviertassinari -- ​<!-- 18 -->[docs] Standardize "no longer" / "not documented" callouts in Material UI docs (#35957) @samuelsycamore -- ​<!-- 17 -->[docs] Revise and expand Joy UI Checkbox doc (#35817) @samuelsycamore -- ​<!-- 16 -->[docs] Add docs notification to Date and Time Pickers revamped (#35935) @joserodolfofreitas -- ​<!-- 15 -->[docs] Update community theme builder to forked updated one (#35928) @idebeijer -- ​<!-- 14 -->[docs] Add Joy default theme viewer (#35554) @siriwatknp -- ​<!-- 13 -->[docs][joy] Fixed a typo in `Using icon libraries` page (#35989) @badalsaibo -- ​<!-- 12 -->[docs][joy] Removed Badge info from Chip docs (#35955) @Vivek-Prajapatii -- ​<!-- 11 -->[docs][system] Fix border color of Boxes in demos of `Configure the sx prop` page in dark mode (#35961) @ZeeshanTamboli - -### Core - -- ​<!-- 25 -->[core] Boolean props always have a default value of `false` in API docs (#35913) @hbjORbj -- ​<!-- 04 -->[core] Improve types for usePreviousProps (#35833) @sai6855 -- ​<!-- 03 -->[website] Fix 404 link to store (#35973) @oliviertassinari -- ​<!-- 02 -->[website] Fix 302 of diamond sponsor link @oliviertassinari -- ​<!-- 01 -->[website] Fix outdated YouTube link @oliviertassinari - -All contributors of this release in alphabetical order: @ArthurPedroti, @badalsaibo, @gorjiali, @hbjORbj, @HeVictor, @idebeijer, @joserodolfofreitas, @marktoman, @oliviertassinari, @sai6855, @SaidMarar, @samuelsycamore, @siriwatknp, @Vivek-Prajapatii, @ZeeshanTamboli - -## 5.11.6 - -<!-- generated comparing v5.11.5..master --> - -_Jan 23, 2023_ - -A big thanks to the 13 contributors who made this release possible. Here are some highlights ✨: - -- @ZeeshanTamboli improved the logic for handling the value label in the `SliderUnstyled` (#35805) -- many other 🐛 bug fixes and 📚 documentation improvements - -### `@mui/material@5.11.6` - -- ​<!-- 15 -->[Box] Fix usage of not supported features in TypeScript 3.5 (#35877) @mnajdova -- ​<!-- 14 -->[Button] Fix border color for secondary disabled button (#35866) @SaidMarar -- ​<!-- 03 -->[SwipeableDrawer] Add callback to customise touchstart ignore for swipeable drawer (#30759) @tech-meppem - -### `@mui/base@5.0.0-alpha.115` - -#### Breaking changes - -- ​<!-- 04 -->[SliderUnstyled] Improved logic for displaying the value label (#35805) @ZeeshanTamboli - - - The `valueLabelDisplay` prop is removed from `SliderUnstyled`. The prop was not working as intended in `SliderUnstyled` (See #35398). You can instead provide a `valueLabel` slot with the `slots` prop API to show the value label: - - ```diff - - <SliderUnstyled valueLabelDisplay="on" /> - + <SliderUnstyled slots={{ valueLabel: SliderValueLabel }} /> - ``` - - The following demo shows how to show a value label when it is hovered over with the thumb: https://mui.com/base-ui/react-slider/#value-label - - - The following classes are removed from `sliderUnstyledClasses` since they are not needed for the value label: - - ```diff - - valueLabel - - valueLabelOpen - - valueLabelCircle - - valueLabelLabel - ``` - - In the custom value label component, you can define your own classNames and target them with CSS. - - - The `SliderValueLabelUnstyled` component is removed from SliderUnstyled. You should provide your own custom component for the value label. - - - To avoid using `React.cloneElement` API in value label, the component hierarchy structure of the value label is changed. The value label is now inside the Thumb slot - `Thumb` -> `Input`, `ValueLabel`. - -#### Changes - -- ​<!-- 05 -->[InputUnstyled] Fix externally provided `inputRef` is ignored (#35807) @sai6855 - -### `@mui/joy@5.0.0-alpha.64` - -- ​<!-- 17 -->[Avatar][joy] Remove `imgProps` prop and add Codemod script for migration (#35859) @hbjORbj - -### Docs - -- ​<!-- 16 -->[blog] Date and time pickers revamped (#35486) @joserodolfofreitas -- ​<!-- 10 -->[docs] Fix incorrect breakpoint use (#34948) @rosita-dmello -- ​<!-- 09 -->[docs] Replace react-virtualized with react-virtuoso in Table (#35700) @petyosi -- ​<!-- 08 -->[docs] Fix account menu demo not closing with keyboard. (#35870) @mj12albert -- ​<!-- 07 -->[docs] Fix typos in the docs of Joy UI (#35876) @HeVictor -- ​<!-- 06 -->[docs] Fix wording in `Color` page (#35873) @oliv37 - -### Core - -- ​<!-- 13 -->[core] Fix release changelog to handle commits with empty author field (#35921) @mnajdova -- ​<!-- 12 -->[core] Revert `docs-utilities` migration to TypeScript and fix type (#35881) @ZeeshanTamboli -- ​<!-- 11 -->[core] Migrate internal `docs-utilities` package to TypeScript (#35846) @ZeeshanTamboli -- ​<!-- 02 -->[website] Designer don't spend their time writing code @oliviertassinari -- ​<!-- 01 -->[website] Emphasis the technical background need for this role @oliviertassinari - -All contributors of this release in alphabetical order: @HeVictor, @hbjORbj, @joserodolfofreitas, @mj12albert, @mnajdova, @oliv37, @oliviertassinari, @petyosi, @rosita-dmello, @sai6855, @SaidMarar, @tech-meppem, @ZeeshanTamboli - -## 5.11.5 - -<!-- generated comparing v5.11.4..master --> - -_Jan 17, 2023_ - -A big thanks to the 17 contributors who made this release possible. -This release was mostly about 🐛 bug fixes and 📚 documentation improvements. - -### `@mui/material@5.11.5` - -- [Material UI] Custom channel token should suppress the warning (#35804) @siriwatknp -- [Autocomplete] Fix value type when `strictNullChecks` is `false` (#35367) @fenghan34 -- [Slider] Replace `SliderUnstyled` with `useSlider` hook (#35770) @ZeeshanTamboli -- [l10n] Add Belarusian translation (#35742) @volhalink - -### `@mui/system@5.11.5` - -- [system] Improve the `createBox` types (#35532) @mnajdova - -### `@mui/codemod@5.11.5` - -- Add `joy-text-field-to-input` codemod (#35462) @hbjORbj - -### `@mui/base@5.0.0-alpha.114` - -- [base] Fix typos (#35802) @nnmax -- [Slider] Convert code to TypeScript (#35445) @sai6855 - -### `@mui/joy@5.0.0-alpha.63` - -- [Tabs][joy] Don't apply `:hover, :active` styles when `selected` (#35750) @sai6855 -- Remove `TextField` component and replace its usage in docs with `FormControl`/`FormLabel`/`Input` (#35462) @hbjORbj -- [TextField] Throw error with migration message (#35845) @siriwatknp -- Miscellaneous fixes (#35847) @siriwatknp - -### Docs - -- [docs] Improve pickers lab migration stressing `mui-x` usage (#35740) @LukasTy -- [docs] Fix incorrectly named AccessibleTable demo component (#35832) @HeVictor -- [docs] Clarify where to find docs for Base UI components in Material UI (#35799) @samuelsycamore -- [docs] Fix typos (#35814) @alexfauquette -- [docs] Revise and expand the Joy UI Card page (#35745) @samuelsycamore -- [docs] Fix navigation layout shift (#35679) @oliviertassinari -- [docs] Fix typo in the Composition page (#35774) @msoyka -- [docs][joy] Update Customization section code example to use the correct API (#35765) @pupudu -- [docs][joy] Fix grammar in `Typography` docs (#35796) @atrefonas -- [examples] Remove `next-env.d.ts` from Next.js examples (#35772) @Juneezee - -### Core - -- [website] Improve pricing page (#35767) @oliviertassinari -- [website] Add Greg in about page (#35816) @oliviertassinari -- [website] Update the Accessibility Engineer role (#35751) @oliviertassinari -- [website] Add docs for MUI for Figma @oliviertassinari - -All contributors of this release in alphabetical order: @alexfauquette, @atrefonas, @fenghan34, @hbjORbj, @HeVictor, @Juneezee, @LukasTy, @mnajdova, @msoyka, @nnmax, @oliviertassinari, @pupudu, @sai6855, @samuelsycamore, @siriwatknp, @volhalink, @ZeeshanTamboli - -## 5.11.4 - -<!-- generated comparing v5.11.3..master --> - -_Jan 9, 2023_ - -A big thanks to the 14 contributors who made this release possible. -This release was mostly about 🐛 bug fixes and 📚 documentation improvements. - -### `@mui/material@5.11.4` - -- [Autocomplete] Add index to renderOption's AutocompleteRenderOptionState (#35578) @CowDotDev -- [Autocomplete] Fix grammar in console.error in `useAutocomplete` (#35723) @hamirmahal -- [Modal] Fix can't override Backdrop Props using new Slots API (#35140) @ZeeshanTamboli -- [Select] Revert "Update `renderValue` prop's TypeScript type (#34177)" (#35733) @michaldudak -- [Tabs] Throw error only if individual `Tab` is hidden, not the whole `Tabs` (#34026) @Ryczko -- [TextField] Improve WCAG 2.4.7 with error={true} (#35687) @oliviertassinari -- [Tooltip] Remove `data-foo` attribute (#35736) @koolskateguy89 - -### `@mui/joy@5.0.0-alpha.62` - -- [Autocomplete][joy] Specify `type` attribute for popup indicator (#35648) @hbjORbj -- [Joy] Miscellaneous improvements (#35769) @siriwatknp -- [Joy] Improve `onKeyDown` event handler for demo (#35642) @hbjORbj - -### `@mui/base@5.0.0-alpha.113` - -- [Portal][base] Convert code to TypeScript (#35657) @sai6855 - -### Docs - -- [docs] Revise and expand Joy UI Button doc (#35737) @samuelsycamore -- [docs] Document the workaround for crashing a translated page (#35720) @michaldudak -- [docs] Fix API page for `MenuItem` to list all valid props (#35561) @mnajdova -- [docs] Fix ad exception in Joy UI (#35685) @oliviertassinari -- [docs] Fix content wider than screen regression @oliviertassinari -- [examples] Add `Vite.js with TypeScript` example (#35683) @miha53cevic - -### Core - -- [core] Close 2022 Developer Survey @oliviertassinari -- [core] Fix the product license reference name (#35703) @oliviertassinari -- [core] Use TypeScript AST instead of TTP for component doc building (#35379) @flaviendelangle -- [test] Always use & for nesting styles (#35702) @oliviertassinari -- [website] Improve Lead Designer role description (#35684) @oliviertassinari - -All contributors of this release in alphabetical order: @CowDotDev, @flaviendelangle, @hamirmahal, @hbjORbj, @koolskateguy89, @michaldudak, @miha53cevic, @mnajdova, @oliviertassinari, @Ryczko, @sai6855, @samuelsycamore, @siriwatknp, @ZeeshanTamboli - -## 5.11.3 - -<!-- generated comparing v5.11.2..master --> - -_Jan 2, 2023_ - -A big thanks to the 6 contributors who made this release possible. -This release was mostly about 🐛 bug fixes and 📚 documentation improvements. - -### `@mui/material@5.11.3` - -- ​<!-- 02 -->[Select] Update `renderValue` prop's TypeScript type (#34177) @ZeeshanTamboli - -### `@mui/joy@5.0.0-alpha.61` - -- ​<!-- 14 -->[Autocomplete][joy] Export component (#35647) @mbranch - -### Docs - -- ​<!-- 13 -->[blog] Fix handling of markdown links (#35628) @oliviertassinari -- ​<!-- 09 -->[docs] Fix demo code selection through copy shortcut key on Firefox browser (#35670) @ZeeshanTamboli -- ​<!-- 08 -->[docs] Fix layout shift when streaming the page (#35627) @oliviertassinari -- ​<!-- 07 -->[docs] Fix switch name to reflect the color (#35052) @rjhcnf -- ​<!-- 06 -->[docs] Fix anchor link in the card's docs and fix a typo (#35634) @ZeeshanTamboli -- ​<!-- 05 -->[docs] Fix layout shift with modal (#35591) @oliviertassinari -- ​<!-- 04 -->[Joy][docs] Add documentation for `Input` component (#35482) @hbjORbj -- ​<!-- 03 -->[docs][joy] Improved readability on theme tokens page (#35639) @badalsaibo - -### Core - -- ​<!-- 12 -->[core] Disable prefetch of footer links @oliviertassinari -- ​<!-- 11 -->[core] A few SEO fixes (#35672) @oliviertassinari -- ​<!-- 10 -->[core] Remove need for scopePathnames (#35584) @oliviertassinari -- ​<!-- 01 -->[test] Fix Algolia noisy lvl1 anchor (#35686) @oliviertassinari - -All contributors of this release in alphabetical order: @badalsaibo, @hbjORbj, @mbranch, @oliviertassinari, @rjhcnf, @ZeeshanTamboli - -## 5.11.2 - -<!-- generated comparing v5.11.1..master --> - -_Dec 26, 2022_ - -A big thanks to the 20 contributors who made this release possible. Here are some highlights ✨: - -- ⚙️ Several Base UI components were converted to TypeScript by @trizotti, @leventdeniz and @danhuynhdev (#35005, #34793, #34771) -- Many other 🐛 bug fixes abd 📚 documentation improvements. - -### `@mui/material@5.11.2` - -- ​<!-- 10 -->[l10n] Add displayed rows label to `faIR` locale (#35587) @hootan-rocky -- ​<!-- 09 -->[l10n] Add Kurdish (Kurmanji) locale (#32508) @JagarYousef -- ​<!-- 06 -->[Select] Accept non-component children (#33530) @boutahlilsoufiane -- ​<!-- 05 -->[SelectInput] Update menu to use select wrapper as anchor (#34229) @EduardoSCosta -- ​<!-- 03 -->[TableCell] Fix `scope` prop to be not set when a data cell is rendered within a table head (#35559) @sai6855 - -### `@mui/utils@5.11.2` - -- ​<!-- 02 -->[utils] `mergedeep` deeply clones source key if it's an object (#35364) @sldk-yuri - -### `@mui/base@5.0.0-alpha.112` - -- ​<!-- 16 -->[FocusTrap][base] Convert code to TypeScript (#35005) @trizotti -- ​<!-- 08 -->[Modal][base] Convert code to TypeScript (#34793) @leventdeniz -- ​<!-- 07 -->[Popper][base] Convert code to TypeScript (#34771) @danhuynhdev -- ​<!-- 04 -->[Slider] Exclude `isRtl` from Material UI's Slider props (#35564) @michaldudak - -### `@mui/joy@5.0.0-alpha.60` - -- ​<!-- 15 -->[Joy] Fix radius adjustment (#35629) @siriwatknp -- ​<!-- 14 -->[Joy] Apply color inversion to components (#34602) @siriwatknp -- ​<!-- 13 -->[Joy] Improve cursor pointer and add fallback for outlined variant (#35573) @siriwatknp -- ​<!-- 12 -->[Joy] Miscellaneous fixes (#35552) @siriwatknp -- ​<!-- 11 -->[Radio][joy] Use precise dimensions for radio icon (#35548) @hbjORbj - -### `@mui/material-next@6.0.0-alpha.68` - -- ​<!-- 36 -->[Material You] Update Button test & add active class name (#35497) @mnajdova - -### Docs - -- ​<!-- 35 -->[docs] Fix GoogleMaps demo (#35545) @hbjORbj -- ​<!-- 25 -->[docs] Remove flow, its legacy (#35624) @oliviertassinari -- ​<!-- 24 -->[docs] Add a guide on using icon libraries with Joy UI (#35377) @siriwatknp -- ​<!-- 23 -->[docs] Clarify comment about `sortStability()` use case (#35570) @frontendlane -- ​<!-- 22 -->[docs] Improve the experimental API demos on the button page (#35560) @mnajdova -- ​<!-- 21 -->[docs] Force `light` theme mode when `activePage` is null (#35575) @LukasTy -- ​<!-- 20 -->[docs] Fix ListItem button deprecated use (#33970) @MickaelAustoni -- ​<!-- 19 -->[docs] Fix typo in `Progress` docs (#35553) @jasonsturges -- ​<!-- 18 -->[docs] Remove empty tags on the TransferList demos (#33127) @ekusiadadus -- ​<!-- 17 -->[docs][joy] Add documentation for `Stack` component (#35373) @hbjORbj -- ​<!-- 35 -->[docs][joy] Add documentation for `Grid` component (#35374) @hbjORbj -- ​<!-- 01 -->[website] Update sponsor grid (#35452) @danilo-leal - -### Core - -- ​<!-- 34 -->[core] Shorthand notation to remove outline (#35623) @oliviertassinari -- ​<!-- 33 -->[core] Fix header link layout shift and clash (#35626) @oliviertassinari -- ​<!-- 32 -->[core] Hide keyboard shortcut if no hover feature (#35625) @oliviertassinari -- ​<!-- 31 -->[core] Fix confusing duplicated name in the log @oliviertassinari -- ​<!-- 30 -->[core] Fix API demos callout spacing (#35579) @oliviertassinari -- ​<!-- 29 -->[core] Fix a few title case (#35547) @oliviertassinari -- ​<!-- 28 -->[core] Cleanup mention of test-utils (#35577) @oliviertassinari -- ​<!-- 27 -->[core] Remove oudated pickers prop-type logic (#35571) @oliviertassinari -- ​<!-- 26 -->[core] Exclude documentation of Base props not used in styled libraries (#35562) @michaldudak - -All contributors of this release in alphabetical order: @boutahlilsoufiane, @danhuynhdev, @danilo-leal, @EduardoSCosta, @ekusiadadus, @frontendlane, @hbjORbj, @hootan-rocky, @JagarYousef, @jasonsturges, @leventdeniz, @LukasTy, @michaldudak, @MickaelAustoni, @mnajdova, @oliviertassinari, @sai6855, @siriwatknp, @sldk-yuri, @trizotti - -## 5.11.1 - -<!-- generated comparing v5.11.0..master --> - -_Dec 20, 2022_ - -A big thanks to the 15 contributors who made this release possible. Here are some highlights ✨: - -- 💅 @mnajdova added motion and shape design tokens to Material You package (#35384 and #35393). -- Many other 🐛 bug fixes, 📚 documentation, and ⚙️ infrastructure improvements. - -### `@mui/material@5.11.1` - -- [Chip] Fix hover and focus style with CSS Variables (#35502) @DimaAbr -- [InputLabel] Enable `size` prop overrides via TypeScript module augmentation (#35460) @MickaelAustoni -- [l10n] Change Kazakh locale name to match ISO-639-1 codes (#34664) @talgautb -- [TextField] Fix error focus style (#35167) @42tte -- [core] Bring `experimental_sx` back with error code (#35528) @siriwatknp - -### `@mui/utils@5.11.1` - -- [Theme] Merge components and slots props (#35477) @siriwatknp - -### `@mui/material-next@6.0.0-alpha.67` - -- [Material You] Add motion design tokens (#35384) @mnajdova -- [Material You] Add shape design tokens (#35393) @mnajdova - -### `@mui/joy@5.0.0-alpha.59` - -- [Tooltip] Fix arrow does not appear (#35473) @siriwatknp -- [Input] Fix autofill styles (#35056) @siriwatknp -- [ChipDelete] Add onDelete prop to ChipDelete (#35412) @sai6855 - -### `@mui/base@5.0.0-alpha.111` - -- [Button][base] Set active class when a subcomponent is clicked (#35410) @michaldudak -- [Popper][base] Fix Tooltip Anchor Element Setter (#35469) @sydneyjodon-wk - -### Docs - -- [docs] Fixed the `Select` component `onChange` event type in the migration guide (#35509) @tzynwang -- [docs] Add missing comma to `Providing the colors directly` section (#35507) @cassidoo -- [docs] Add `CardMedia` example without `component="img"` prop (#35470) @lucasmfredmark -- [docs] Fix `unstable_sxConfig` typo (#35478) @siriwatknp -- [docs] List component introduction example default code is missing ListItemContent component (#35492) @Miigaarino -- [website] Close our first people role @oliviertassinari -- [website] Update product icons (#35413) @danilo-leal - -### Core - -- [test] Terminate BrowserStack after 5 minutes (#35454) @oliviertassinari -- [test] Fix broken master branch (#35446) @oliviertassinari - -All contributors of this release in alphabetical order: @42tte, @cassidoo, @danilo-leal, @DimaAbr, @lucasmfredmark, @michaldudak, @MickaelAustoni, @Miigaarino, @mnajdova, @oliviertassinari, @sai6855, @siriwatknp, @sydneyjodon-wk, @talgautb, @tzynwang - -## 5.11.0 - -<!-- generated comparing v5.10.17..master --> - -_Dec 13, 2022_ - -A big thanks to the 19 contributors who made this release possible. Here are some highlights ✨: - -- 🔥 @mnajdova enabled configuration of the `sx` prop in the `theme` (#35150) -- Many other 🐛 bug fixes, 📚 documentation, and ⚙️ infrastructure improvements. - -### `@mui/material@5.11.0` - -- [Alert] Update icon color in all variants (#35414) @danilo-leal -- [Select] Fix `MenuProps.PopoverClasses` being overriden (#35394) @vitorfrs-dev -- [SwipeableDrawer] Fix TypeScript warning "prop open undefined" (#34710) @kraftware - -### `@mui/icons-material@5.11.0` - -- [icons] Restore the PhoneInTalk icons (#35409) @michaldudak - -### `@mui/system@5.11.0` - -#### BREAKING CHANGES - -- [system] Enable configuring the `sx` prop in the `theme` (#35150) @mnajdova - - The breaking change is regarding an experimental API: - - ```diff - -import { styled, experimental_sx } from '@mui/material/styles'; - +import { styled } from '@mui/material/styles'; - - -const Component = styled('div)(experimental_sx({ p: 1 }}); - +const Component = styled('div)(({ theme }) => theme.unstable_sx({ p: 1 }}); - ``` - -### `@mui/joy@5.0.0-alpha.58` - -- [Joy] Miscellaneous fixes (#35447) @siriwatknp - -### `@mui/base@5.0.0-alpha.110` - -- [PopperUnstyled] Update PopperTooltip to have correct width when closing with transition (#34714) @EduardoSCosta - -### `@mui/material-next@6.0.0-alpha.66` - -- [Material You] Add ripple on the button (#35299) @mnajdova - -### Docs - -- [docs] Simplify state management in Text Field demo page (#35051) @PratikDev -- [docs] Improve `Responsive App bar with Drawer` demo (#35418) @ZeeshanTamboli -- [docs] Improve line-height readability (#35387) @oliviertassinari -- [docs] Improve a bit the Composition docs (#35329) @oliviertassinari -- [docs] Refactor `ToggleButtonSizes` demo (#35375) @Armanio -- [docs] Standardize the usage of callouts in the docs (#35361) @samuelsycamore -- [docs] Format feedback to add a link to the commented section (#35381) @alexfauquette -- [docs] Direct users from Material UI to Base UI for duplicated components (#35293) @samuelsycamore -- [docs] Fix typo in FormControl API docs (#35449) @Spanishiwa -- [docs] Update callouts design (#35390) @danilo-leal -- [website] New wave of open roles (#35240) @mnajdova -- [website] Developer Survey 2022 (#35407) @joserodolfofreitas - -### Core - -- [core] Fix @mui/material package building (#35324) @timbset -- [core] Fix leaking theme color override (#35444) @oliviertassinari -- [typescript] Add null to return type of OverridableComponent (#35311) @tsollbach -- [website] Migrate X page to use CSS theme variables (#34922) @jesrodri -- [website] Migrate `/core` page to use CSS variables (#35366) @siriwatknp - -All contributors of this release in alphabetical order: @alexfauquette, @Armanio, @danilo-leal, @EduardoSCosta, @flaviendelangle, @jesrodri, @joserodolfofreitas, @kraftware, @michaldudak, @mnajdova, @oliviertassinari, @PratikDev, @samuelsycamore, @siriwatknp, @Spanishiwa, @timbset, @tsollbach, @vitorfrs-dev, @ZeeshanTamboli - -## 5.10.17 - -<!-- generated comparing v5.10.16..master --> - -_Dec 6, 2022_ - -A big thanks to the 15 contributors who made this release possible. Here are some highlights ✨: - -- ✨ @mnajdova added a [Material You Button playground](https://mui.com/material-ui/react-button/#material-you-version) (#35222) -- 🔧 @hbjORbj renamed `components` / `componentProps` to `slots` / `slotProps` prop in Joy UI to create consistency across products (#34997) -- Many other 🐛 bug fixes, 📚 documentation, and ⚙️ infrastructure improvements - -### `@mui/material@5.10.17` - -- ​<!-- 31 -->[Slider] Fix `markActive` theme class not getting applied (#35067) @ZeeshanTamboli -- ​<!-- 30 -->[SwipeableDrawer] Fix missing close animation when initial open is true (#35010) @sai6855 -- ​<!-- 28 -->[material-ui] Add channel colors if possible (#35178) @siriwatknp -- ​<!-- 10 -->[Fab] Increase disabled styles precedence (#35304) @Uzwername -- ​<!-- 05 -->[Rating] Apply `labelEmptyValueActive` style overrides from theme (#35315) @sai6855 - -### `@mui/system@5.10.17` - -- ​<!-- 04 -->[system] Add support for nested CssVarsProvider (#35277) @siriwatknp - -### `@mui/joy@5.0.0-alpha.57` - -#### BREAKING CHANGE - -- ​<!-- 08 -->[Joy] Add `slots`/`slotProps` props to the typing of all components and apply `useSlot` to all components (#34997) @hbjORbj - - - Change all occurrences of `components` and `componentsProps` props in Joy UI components to `slots` and `slotProps`, respectively. - - ```diff - -<Autocomplete components={{listbox: CustomListbox}} componentsProps={{listbox: { className: 'custom-listbox' }}} /> - +<Autocomplete slots={{listbox: CustomListbox}} slotProps={{listbox: { className: 'custom-listbox' }}} /> - ``` - - You can use this [codemod](https://github.com/mui/material-ui/blob/master/packages/mui-codemod/README.md#joy-rename-components-to-slots) to help with the migration. - -#### Changes - -- ​<!-- 07 -->[Joy] Miscellaneous fixes (#35345) @siriwatknp -- ​<!-- 06 -->[Joy][textarea] Expose decorator classes (#35247) @zignis - -### Docs - -- ​<!-- 29 -->[docs] Improve spacing with ul (#35302) @oliviertassinari -- ​<!-- 23 -->[docs] Correct grammatically incorrect sentences in CONTRIBUTING.md (#34949) @Pandey-utkarsh -- ​<!-- 22 -->[docs] Move the demo higher in the API TOC (#35202) @oliviertassinari -- ​<!-- 21 -->[docs] Fix incorrect link in minimizing-bundle-size (#35297) @Juneezee -- ​<!-- 20 -->[docs] Revise and expand Joy UI "Breadcrumbs" page (#35292) @samuelsycamore -- ​<!-- 19 -->[docs] Fix wrong import in the unstyled tabs page (#35310) @guotie -- ​<!-- 18 -->[docs] Disable translations (#34820) @mnajdova -- ​<!-- 17 -->[docs] Fix typo (#35312) @flaviendelangle -- ​<!-- 16 -->[docs] Add Material You Button playground (#35222) @mnajdova -- ​<!-- 15 -->[docs] Fix experimental API page duplication (#35213) @oliviertassinari -- ​<!-- 14 -->[docs] Improve the autogenerated "Unstyled" and "API" text (#35185) @samuelsycamore -- ​<!-- 13 -->[docs] Fix ad margin on API pages (#35201) @oliviertassinari -- ​<!-- 12 -->[docs] Revise and expand the Joy UI "Badge" page (#35199) @samuelsycamore -- ​<!-- 11 -->[docs] Update Base UI docs with latest style conventions (#35034) @samuelsycamore -- ​<!-- 09 -->[l10n] Improve Chinese (Taiwan) zh-TW locale (#35328) @happyincent -- ​<!-- 02 -->[website] Update stats: GitHub stars, Twitter followers, etc. (#35318) @nomandhoni-cs - -### Core - -- ​<!-- 27 -->[core] Use componentStyles.name over componentName (#35303) @oliviertassinari -- ​<!-- 26 -->[core] Fix warning leak in production (#35313) @oliviertassinari -- ​<!-- 25 -->[core] Move the internal packages from docs/packages (#35305) @michaldudak -- ​<!-- 24 -->[core] Clean up the API docs generation scripts (#35244) @michaldudak -- ​<!-- 03 -->[test] Scope the tests to just Material UI components (#35219) @siriwatknp -- ​<!-- 01 -->[website] Remove BlackFriday notification @oliviertassinari - -All contributors of this release in alphabetical order: @flaviendelangle, @guotie, @happyincent, @hbjORbj, @Juneezee, @michaldudak, @mnajdova, @nomandhoni-cs, @oliviertassinari, @Pandey-utkarsh, @sai6855, @samuelsycamore, @siriwatknp, @Uzwername, @zignis - -## 5.10.16 - -<!-- generated comparing v5.10.15..master --> - -_Nov 28, 2022_ - -A big thanks to the 13 contributors who made this release possible. This release contains various 🐛 bug fixes, 📚 documentation, and ⚙️ infrastructure improvements. - -### `@mui/material@5.10.16` - -- ​<!-- 21 -->[Autocomplete] Fix inferred value type when `multiple` prop is `true` (#35275) @fenghan34 -- ​<!-- 19 -->[Chip] Add `skipFocusWhenDisabled` prop to not allow focussing deletable chip if disabled (#35065) @sai6855 -- ​<!-- 18 -->[Chip] Remove unnecessary handleKeyDown event handler (#35231) @ZeeshanTamboli -- ​<!-- 05 -->[FormControl] Add missing types in `useFormControl` (#35168) @ZeeshanTamboli -- ​<!-- 04 -->[IconButton] Add missing color classes (#33820) @Zetta56 -- ​<!-- 03 -->[SwipeableDrawer] Make paper ref accessible (#35082) @sai6855 - -### `@mui/system@5.10.16` - -- ​<!-- 02 -->[system] Remove unnecessary parsed theme (#35239) @siriwatknp -- ​<!-- 01 -->[theme] Fix TypeScript type for custom variants in responsive font sizes (#35057) @ZeeshanTamboli - -### `@mui/base@5.0.0-alpha.108` - -- ​<!-- 20 -->[Base] Allow useSlotProps to receive undefined elementType (#35192) @leventdeniz - -### Docs - -- ​<!-- 13 -->[docs] Improve feedback precision (#34641) @alexfauquette -- ​<!-- 12 -->[docs] Add Black Friday notification @oliviertassinari -- ​<!-- 11 -->[docs] Fix migration feedback (#35232) @alexfauquette -- ​<!-- 10 -->[docs] Improve the useSelect demo styling (#33883) @michaldudak -- ​<!-- 09 -->[docs] Fix layout jump on first mistake (#35215) @oliviertassinari -- ​<!-- 08 -->[docs] Support demos with side effect imports (#35177) @m4theushw -- ​<!-- 07 -->[examples] Fix Next.js errors (#35246) @oliviertassinari -- ​<!-- 06 -->[examples] Updated Remix examples with the lates changes using React 18 (#35092) @58bits - -### Core - -- ​<!-- 17 -->[core] Remove unused pattern (#35165) @iamxukai -- ​<!-- 16 -->[core] Fix Base version in changelog (#35224) @siriwatknp -- ​<!-- 15 -->[core] Migrate `describeConformance` to TypeScript (#35193) @flaviendelangle -- ​<!-- 14 -->[core] Skip CI for docs and examples paths (#35225) @siriwatknp - -All contributors of this release in alphabetical order: @58bits, @alexfauquette, @fenghan34, @flaviendelangle, @iamxukai, @leventdeniz, @m4theushw, @michaldudak, @oliviertassinari, @sai6855, @siriwatknp, @ZeeshanTamboli, @Zetta56 - -## 5.10.15 - -<!-- generated comparing v5.10.14..master --> - -_Nov 21, 2022_ - -A big thanks to the 9 contributors who made this release possible. Here are some highlights ✨: - -- 🚀 @mnajdova added the button as the first component that implements [Material You](https://m3.material.io/) design (MD3) -- 🌐 @MBilalShafi added Urdu (Pakistan) localization -- Many other 🐛 bug fixes, 📚 documentation, and ⚙️ infrastructure improvements - -### `@mui/material@5.10.15` - -- [Autocomplete] Fix keyboard navigation when using custom popover (#35160) @sai6855 -- [typescript] Add `background.defaultChannel` to `CssVarsPalette` (#35174) @alexfauquette -- [l10n] Add Urdu (ur-PK) locale (#35154) @MBilalShafi - -### `@mui/icons-material@5.10.15` - -- [icons] Update the Material Design icons (#35194) @michaldudak - -### `@mui/material-next@6.0.0-alpha.63` - -- [Material You] Add theme structure & Button component (#34650) @mnajdova - -### `@mui/base@5.0.0-alpha.107` - -- [Select] Add attributes to conform with ARIA 1.2 (#35182) @michaldudak - -### Docs - -- [docs] Fix a couple documentation errors (#35217) @danilo-leal -- [docs] Change MUI -> Material UI in icons-material's readme (#35220) @michaldudak -- [docs] the pages have no <link rel=canonical so we need to tell Google to not index the staging envs @oliviertassinari -- [docs] Fix confusion in TOCs when reaching scroll bottom (#35214) @oliviertassinari -- [docs] Fix typos in section titles (#35025) @iamxukai -- [docs] Fix typo in legacy date picker migration guide @oliviertassinari -- [docs] Iterating on recent Joy UI Component page updates (#35162) @samuelsycamore -- [docs] Inform that pickers are in X repository (#35189) @alexfauquette -- [docs] Explain how the `error` prop works in the Unstyled Input (#35171) @michaldudak -- [docs] Hotfix missing styles in dark mode (#35179) @siriwatknp -- [docs] Add Joy UI theme typography page (#34811) @siriwatknp -- [docs] Fix undo/redo in live editor (#35163) @oliviertassinari -- [docs] Revise the Joy UI "Avatar" component page (#35152) @samuelsycamore -- [docs] Make navbar backdrop filter consistent with website (#35157) @danilo-leal -- [docs] Host CodeSandbox on MUI org (#35110) @oliviertassinari -- [docs] Uplift introduction demos & make consistent with Base (#34316) @danilo-leal -- [website] Add Security questionnaire in pricing (#35172) @oliviertassinari -- [website] Fix theme mode toggle state (#35216) @siriwatknp -- [website] Exclude experiment pages in production (#35180) @siriwatknp -- [website] Disable SEO for performance pages (#35173) @oliviertassinari - -### Core - -- [core] Convert icons scripts to ESM (#35101) @Janpot -- [core] Group renovate GitHub Action dependency updates @oliviertassinari -- [core] Upgrade eslint-config-airbnb-typescript (#34642) @Janpot -- [core] Ensure that prettier CI step fails when code is badly formatted (#35170) @michaldudak - -All contributors of this release in alphabetical order: @alexfauquette, @danilo-leal, @iamxukai, @Janpot, @MBilalShafi, @michaldudak, @oliviertassinari, @samuelsycamore, @siriwatknp - -## 5.10.14 - -<!-- generated comparing v5.10.13..master --> - -_Nov 14, 2022_ - -A big thanks to the 17 contributors who made this release possible. Here are some highlights ✨: - -- 🚀 @siriwatknp added the Autocomplete component to the Joy UI (#34315) -- ♿ @sfavello improved the accessibility of the Material UI's Autocomplete by adding support for the Delete key (#33822) -- Many other 🐛 bug fixes, 📚 documentation, and ⚙️ infrastructure improvements. - -### `@mui/material@5.10.14` - -- [Material UI] Add `palette.background.defaultChannel` token (#35061) @siriwatknp -- [Autocomplete] Remove tags with the Delete key (#33822) @sfavello -- [IconButton] custom color causes type error (#34521) @kushagra010 - -### `@mui/system@5.10.14` - -- [Unstable_Gridv2] sorted responsize keys based on breakpoint value (#34987) @sai6855 - -### `@mui/joy@5.0.0-alpha.54` - -- [Joy] Export `FormControl`, `LinearProgress` and `ListSubheader` components from `@mui/joy` (#35003) @Studio384 -- [Joy] Miscellaneous fixes (#35044) @siriwatknp -- [Joy] Add `Autocomplete` component (#34315) @siriwatknp -- [Joy] Saturate a bit the gray palette (#35148) @danilo-leal -- [Autocomplete][joy] Fix types (#35153) @siriwatknp - -### Docs - -- [blog] Fix font size of code blocks on iOS @oliviertassinari -- [docs] Accessibility - increase default contrastThreshold for WCAG AA compliance (#34901) @kennethbigler -- [docs] Correct the keepMounted section on the Drawer page (#35076) @michaldudak -- [docs] Fix code editor styles mismatches (#35108) @oliviertassinari -- [docs] Allows to access the next MUI-X (#34798) @alexfauquette -- [docs] Fix bugs with live edit demos (#35106) @oliviertassinari -- [docs] Fix `MarkdownElement` regression from adding CSS variables (#35096) @siriwatknp -- [docs] Add a new gold sponsor (#35089) @hbjORbj -- [docs] Fix scroll issue on expanded live demos (#35064) @bharatkashyap -- [docs] Improve alignment of the sponsors @oliviertassinari -- [docs] Improve code font family v2 (#35053) @oliviertassinari -- [docs] Upgrade to Next.js 13 (#35001) @mnajdova -- [docs] Fix typo in changelog @oliviertassinari -- [docs] Update Joy UI templates to use latest components (#35058) @siriwatknp -- [website] Fix design kits showcase throwing an error (#35093) @cherniavskii -- [website] Fix margin bug on CTA @oliviertassinari -- [website] Link respective repositories in product pages (#35046) @sidtohan -- [website] Migrate blog pages to use CSS theme variables (#34976) @siriwatknp -- [website] Update DoiT International logo and links with new brand (#35030) @ofir5300 -- [website] Improve visual design app bar (#35111) @oliviertassinari - -### Core - -- [core] Convert scripts to ES modules (#35036) @michaldudak -- [core] Show the whole version to make blame easier @oliviertassinari -- [core] Polish GitHub Action version @oliviertassinari -- [core] Ignore icons to speed up CodeQL @oliviertassinari -- [core] Feedback on branch protection @oliviertassinari -- [core] Revert CI (#35098) @siriwatknp -- [core] Fix job name to match the CI (#35097) @siriwatknp -- [core] ESLint fixes for tests (#34924) @Janpot -- [core] Ignore unrelated folders from github actions (#35028) @siriwatknp -- [core] Use pretty-quick instead of custom script (#34062) @Janpot - -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 - -## 5.10.13 - -<!-- generated comparing v5.10.12..master --> - -_Nov 7, 2022_ - -A big thanks to the 12 contributors who made this release possible. Here are some highlights ✨: - -- 🚀 The slots API has been introduced to the Material UI package by @michaldudak (#34873). -- 🔥 Live editing of demos is stabilized by @oliviertassinari (#34870). -- Many other 🐛 bug fixes, 📚 documentation, and ⚙️ infrastructure improvements. - -### `@mui/material@5.10.13` - -- ​<!-- 08 -->[material-ui] Introduce the slots API (#34873) @michaldudak -- ​<!-- 07 -->[NativeSelectInput] Support CSS theme variables (#34975) @siriwatknp - -### `@mui/system@5.10.13` - -- ​<!-- 05 -->[system] Add a missing key attribute in getInitColorScheme to fix key issue (#34992) @akshaya-venkatesh8 - -### `@mui/base@5.0.0-alpha.105` - -- ​<!-- 26 -->[base] Avoid calling setState during renders (#34916) @Janpot - -### `@mui/joy@5.0.0-alpha.53` - -- ​<!-- 06 -->[Select] Fix custom options menu not opening on Avatar click (#34648) @shivam1646 - -### Docs - -- ​<!-- 20 -->[docs] Add a guide for setting dark mode by default (#34839) @siriwatknp -- ​<!-- 19 -->[docs] Improve code font family (#35027) @oliviertassinari -- ​<!-- 18 -->[docs] Revise and expand Joy UI "Alert" page (#34838) @samuelsycamore -- ​<!-- 17 -->[docs] Live demos v2 (#34870) @oliviertassinari -- ​<!-- 16 -->[docs] Fix 301 links in the docs @oliviertassinari -- ​<!-- 15 -->[docs] Fix code display in RTL (#34951) @oliviertassinari -- ​<!-- 14 -->[docs] New API design rule disabled > disable (#34972) @oliviertassinari -- ​<!-- 13 -->[docs] Explain the usage of Select's onOpen/onClose in the uncontrolled mode (#34755) @michaldudak -- ​<!-- 12 -->[docs] Add a new gold sponsor (#34984) @hbjORbj -- ​<!-- 11 -->[docs] Add author and published_time meta tags (#34382) @alexfauquette -- ​<!-- 10 -->[examples] Next.js examples v13 - fonts (#34971) @PetroSilenius -- ​<!-- 09 -->[examples] Next.js examples v13 - links (#34970) @PetroSilenius -- ​<!-- 04 -->[website] Update IPinfo.AI name @oliviertassinari -- ​<!-- 03 -->[website] Remove date-io from the docs dependencies (#34748) @michaldudak -- ​<!-- 02 -->[website] Migrate Design-kits page to use CSS theme variables (#34920) @jesrodri -- ​<!-- 01 -->[website] Migrate Pricing page to use CSS theme variables (#34917) @trizotti - -### Core - -- ​<!-- 25 -->[core] Remove default access to GitHub action scopes @oliviertassinari -- ​<!-- 24 -->[core] Fix Pinned-Dependencies @oliviertassinari -- ​<!-- 23 -->[core] Fix typos in the component name @oliviertassinari -- ​<!-- 22 -->[core] Fix scorecard regression @oliviertassinari -- ​<!-- 21 -->[core] Create the docs theme once (#34954) @oliviertassinari - -All contributors of this release in alphabetical order: @akshaya-venkatesh8, @alexfauquette, @hbjORbj, @Janpot, @jesrodri, @michaldudak, @oliviertassinari, @PetroSilenius, @samuelsycamore, @shivam1646, @siriwatknp, @trizotti - -## 5.10.12 - -<!-- generated comparing v5.10.11..master --> - -_Oct 31, 2022_ - -A big thanks to the 16 contributors who made this release possible. Here are some highlights ✨: - -- 🚀 The LinearProgress component has been added to Joy UI by @hbjORbj (#34514). -- Many other 🐛 bug fixes, 📚 documentation, and ⚙️ infrastructure improvements. - -### `@mui/material@5.10.12` - -- ​<!-- 37 -->[Chip] Don't override icon color (#34247) @emlai -- ​<!-- 09 -->[Radio] Skip default hover style when disableRipple is set (#34902) @VinceCYLiao -- ​<!-- 08 -->[SwipeableDrawer] Fix React 18 issues (#34505) @mnajdova -- ​<!-- 05 -->[Tooltip] Save a few bytes (#34853) @oliviertassinari - -### `@mui/base@5.0.0-alpha.104` - -- ​<!-- 38 -->[ButtonUnstyled] Update to render as link when href or to is provided (#34337) @EduardoSCosta - -### `@mui/joy@5.0.0-alpha.52` - -- ​<!-- 36 -->[Joy][circularprogress] Prevent new styles from being generated when `value` changes (#34897) @hbjORbj -- ​<!-- 11 -->[Joy] Add color inversion feature (#32511) @siriwatknp -- ​<!-- 10 -->[Joy] Add `LinearProgress` component (#34514) @hbjORbj - -### Docs - -- ​<!-- 40 -->[blog] Add blog post for high-level overview of all MUI products (#34325) @samuelsycamore -- ​<!-- 39 -->[blog] Fix hydration mistmatch (#34857) @oliviertassinari -- ​<!-- 21 -->[docs] Revise the Joy UI "Aspect Ratio" page (#34858) @samuelsycamore -- ​<!-- 20 -->[docs] Fix Safari code font size (#34859) @oliviertassinari -- ​<!-- 19 -->[docs] Fix spelling mistake (#34955) @punithnayak -- ​<!-- 18 -->[docs] Fix 404 link of supported Material UI components @oliviertassinari -- ​<!-- 17 -->[docs] Fix Safari button misalignment (#34861) @oliviertassinari -- ​<!-- 16 -->[docs] Fix typo in docs title (#34926) @PunitSoniME -- ​<!-- 25 -->[docs] Fix missing emotion prefixes (#34958) @oliviertassinari -- ​<!-- 26 -->[docs] Improve UI display for copy code (#34950) @oliviertassinari -- ​<!-- 15 -->[docs] Standardize all "Usage" pages (#34183) @samuelsycamore -- ​<!-- 14 -->[docs] Update templates' readme files to include required dependencies (#34757) @michaldudak -- ​<!-- 13 -->[docs] Fix inconsistent theme colors when applying custom colors in playground (#34866) @cherniavskii -- ​<!-- 12 -->[docs] Fix typo in bottom-navigation.md (#34884) @RoodyCode -- ​<!-- 07 -->[website] Migrate about-us page to use CSS theme variables (#34919) @brianlu2610 -- ​<!-- 06 -->[website] Migrate Product-Templates page to use CSS theme variables (#34913) @EduardoSCosta -- ​<!-- 05 -->[website] Migrate career page to use CSS theme variables (#34908) @the-mgi -- ​<!-- 04 -->[website] Update MUI X open and future roles + about page (#34894) @DanailH -- ​<!-- 03 -->[website] Remove one DOM node (#34960) @oliviertassinari -- ​<!-- 02 -->[website] Use `span` for icon image (#34914) @siriwatknp -- ​<!-- 01 -->[website] Fix subscribe input with Safari (#34869) @oliviertassinari - -### Core - -- ​<!-- 35 -->[core] Ignore compiled icons in CodeQL @oliviertassinari -- ​<!-- 34 -->[core] Add OSSF Scorecard action (#34854) @oliviertassinari -- ​<!-- 40 -->[core] Fix extra GitHub Action permission (#34496) @sashashura -- ​<!-- 33 -->[core] Fix duplicate id @oliviertassinari -- ​<!-- 41 -->[core] Enforce import \* as React (#34878) @da0x -- ​<!-- 32 -->[core] A couple of simply fixes from #34870 (#34953) @oliviertassinari -- ​<!-- 31 -->[core] Migrate outdated pattern to convention @oliviertassinari -- ​<!-- 30 -->[core] Pin GitHub Actions dependencies (#34929) @renovate[bot] -- ​<!-- 29 -->[core] Make the reproduction more important in the bug template (#34875) @oliviertassinari -- ​<!-- 28 -->[core] Fix docs GitHub API rate limit (#34856) @oliviertassinari -- ​<!-- 42 -->[core] Fix eslint issues (#34964) @mnajdova -- ​<!-- 27 -->[core] Pin GitHub Action to digests (#34855) @oliviertassinari -- ​<!-- 26 -->[core] Fix permissions in workflow @oliviertassinari -- ​<!-- 25 -->[core] memoize context values for react/jsx-no-constructed-context-values (#34849) @Janpot -- ​<!-- 24 -->[core] Fix @typescript-eslint/default-param-last issues (#34846) @Janpot -- ​<!-- 23 -->[core] Fix HTML validation error (#34860) @oliviertassinari -- ​<!-- 22 -->[core] Fix duplicate CodeQL build @oliviertassinari -- ​<!-- 07 -->[test] Move Firefox tests to CircleCI (#34764) @oliviertassinari -- ​<!-- 06 -->[test] Use screen when possible for simplicity (#34890) @oliviertassinari - -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 - -## 5.10.11 - -<!-- generated comparing v5.10.10..master --> - -_Oct 25, 2022_ - -A big thanks to the 10 contributors who made this release possible. Here are some highlights ✨: - -- 🔧 Moved `components` to `slots` prop starting at Base UI to create consistency across products -- Many other 🐛 bug fixes, 📚 documentation, and ⚙️ infrastructure improvements - -### `@mui/material@5.10.11` - -- [InputBase] Fix `onInvalid` to use HTMLInputElement | HTMLTextAreaElement Element type (#33162) @KuSh -- [Alert] Add `components` and `componentsProps` props to allow close action overrides (#33582) @jake-collibra - -### `@mui/base@5.0.0-alpha.103` - -#### BREAKING CHANGE - -- [base] `components` -> `slots` API rename (#34693) @michaldudak - - - Change all occurrences of components and componentsProps props in Base components to slots and slotProps, respectively. - - Change casing of slots' fields to camelCase - - ```diff - -<SwitchUnstyled components={{Root: CustomRoot}} componentsProps={{rail: { className: 'custom-rail' }}} /> - +<SwitchUnstyled slots={{root: CustomRoot}} slotProps={{rail: { className: 'custom-rail' }}} /> - ``` - -- [base] Make CSS class prefixes consistent (#33411) @michaldudak - - **This is a breaking change for anyone who depends on the class names applied to Base components.** - If you use the `<component>UnstyledClasses` objects, you won't notice a difference. Only if you depend on the resulting class names (for example in CSS stylesheets), you'll have to adjust your code. - - ```diff - -.ButtonUnstyled-root { ... }; - +.MuiButton-root { ... }; - ``` - -#### Changes - -- [test] Test all Base components with describeConformanceUnstyled (#34825) @michaldudak - -### `@mui/joy@5.0.0-alpha.51` - -- [CircularProgress][joy] Fix classnames and add test (#34806) @hbjORbj -- [Joy] Allow string type for `size` prop in components (#34805) @hbjORbj - -### Docs - -- Revert "[docs] Fix search icons in other languages (#34823)" @oliviertassinari -- Revert "[core] Move SearchIcons to docs src folder (#34802)" @oliviertassinari -- Revert "[docs] Live demos (#34454)" @oliviertassinari -- Update the order of operations for pagination example so that slicing takes place after sorting. (#34189) @marceliwac -- [docs] Gatsby Description in Joy dark-mode (#34702) @pixelass -- [docs] Add notification for blogpost MUI X v6 alpha (#34809) @joserodolfofreitas -- [docs] Polish Crowdin config (#34852) @oliviertassinari -- [docs] Fix a few style standard deviations @oliviertassinari -- [docs] Enforce no trailing spaces (#34762) @oliviertassinari -- [docs] Enforce correct git diff format (#34765) @oliviertassinari -- [docs] Fix Toolpad docs 301 route (#34843) @bharatkashyap -- [docs] Replace initial value with theme white (#34822) @siriwatknp -- [docs] Remove localization redirects (#34844) @mnajdova -- [docs] Fix search icons in other languages (#34823) @siriwatknp -- [docs] Fix JavaScript capitalization @oliviertassinari -- [docs] Update new links to MD2 (#34848) @oliviertassinari -- [website] Update future work items on X landing page (#34810) @joserodolfofreitas -- [website] Add Toolpad docs to navigation (#34749) @bharatkashyap - -### Core - -- [core] Remove dead files (#34850) @oliviertassinari -- [core] Fix revert conflict @oliviertassinari -- [core] Fix a few CodeQL errors (#34766) @oliviertassinari -- [core] Harden GitHub Actions permissions (#34769) @oliviertassinari -- [core] Remove the codeowners file (#34876) @michaldudak - -All contributors of this release in alphabetical order: @bharatkashyap, @hbjORbj, @jake-collibra, @joserodolfofreitas, @KuSh, @marceliwac, @michaldudak, @oliviertassinari, @pixelass, @siriwatknp - -## 5.10.10 - -<!-- generated comparing v5.10.9..master --> - -_Oct 18, 2022_ - -A big thanks to the 21 contributors who made this release possible. Here are some highlights ✨: - -- 🖌 Thanks to the efforts of @bharatkashyap and @nihgwu, we now have editable demos across our docs (#34454)! -- 🚀 The Tooltip component has been added to Joy UI by @hbjORbj (#34509). -- ⚙️ We started converting the remaining JS components in Base UI to TypeScript. - @mbayucot finished the first PR with the conversion of the NoSsr code (#34735). -- And more 🐛 bug fixes and 📚 documentation improvements. - -### `@mui/material@5.10.10` - -- [Popover] Fix paper position flash on open (#34546) @TheUnlocked -- [SwipeableDrawer] Make component `defaultProps` overridable (#34643) @hbjORbj - -### `@mui/system@5.10.10` - -- [system] Support CSS `grey` color in `sx` (#34548) @TheUnlocked - -### `@mui/styles@5.10.10` - -- [styles] Use memoized context in StylesProvider (#34637) @mohd-akram - -### `@mui/joy@5.0.0-alpha.50` - -- [Select][joy] Added hidden input element (#34657) @zee-bit -- [Slider][joy] Add global variant to slider (#34733) @siriwatknp -- [Tooltip][joy] Add component (#34509) @hbjORbj - -### `@mui/base@5.0.0-alpha.102` - -- [MultiSelect][base] Prevent the renderValue prop from being propagated to the DOM (#34698) @michaldudak -- [NoSsr] Convert code to TypeScript (#34735) @mbayucot - -### Docs - -- [docs] Fix the Autocomplete Highlighting example (#34184) @hayawata3626 -- [docs] Fix typos in Base (Menu, Tabs) and Joy UI (Chip) (#34803) @rvrvrv -- [docs] Use new editing API in homepage demos (#34220) @m4theushw -- [docs] Live demos (#34454) @bharatkashyap -- [docs] Fix typos in Joy UI Switch (#34728) @ndresx -- [docs] Avoid scrollbar in the code demos (#34741) @oliviertassinari -- [docs] Revise the Joy UI "Automatic adjustment" page (#34614) @samuelsycamore -- [docs] Revise and rename the Joy UI "Perfect dark mode" page (#34613) @samuelsycamore -- [docs] Revise the Joy UI "Global variants" page (#34595) @samuelsycamore -- [docs] Basic link verification at PR level (#34588) @alexfauquette -- [docs] Add a missing comma in the customization example (#34617) @AbayKinayat -- [website] Clarify Pro/Premium support (#34607) @oliviertassinari -- [website] Fix home page dark mode flicker (#33545) -- [website] Update the state of the date pickers on the landing page (#34750) @joserodolfofreitas - -### Core - -- [core] Clean conditionals (#34772) @pedroprado010 -- [core] Temporary remove the authorization (#34796) @siriwatknp -- [core] Avoid slower CI run statues @oliviertassinari -- [core] Improve the playground DX (#34739) @oliviertassinari -- [core] Link Netlify in the danger comment (#34688) @oliviertassinari -- [core] Fix CI after out of sync merge @oliviertassinari -- [core] Enforce straight quote (#34686) @oliviertassinari -- [core] Add code scanning via CodeQL (#34707) @DanailH -- [core] Fix some upcoming eslint issues (#34727) @oliviertassinari -- [core] Auto-fix upcoming eslint issues (#34644) @Janpot -- [core] Move SearchIcons to docs src folder (#34802) -- [test] Enable `react/no-unstable-nested-components` (#34518) @eps1lon - -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 - -## 5.10.9 - -<!-- generated comparing v5.10.8..master --> - -_Oct 10, 2022_ - -A big thanks to the 7 contributors who made this release possible. Here are some highlights ✨: - -- 🚀 [Joy] Button loading functionality has been added by @kushagra010 (#34658) -- And more 🐛 bug fixes and 📚 documentation improvements. - -### `@mui/material@5.10.9` - -- ​<!-- 16 -->[Grid v2][system] Handle direction object prop for responsive design (#34574) @vanyaxk -- ​<!-- 03 -->[Slider] Fix unnecessary accessibility attribute in root element (#34610) @vanyaxk - -### `@mui/system@5.10.9` - -#### BREAKING CHANGE - -- ​<!-- 17 -->[system] Fix color-scheme implementation (#34639) @siriwatknp - - The `enableColorScheme` prop has been removed from `CssVarsProvider` and `getInitColorScheme` (both Material UI and Joy UI). - - Migration: - - - **Material UI**: you can enable the CSS color scheme via `<CssBaseline enableColorScheme />`. - - **Joy UI**: it is enabled automatically if you use `<CssBaseline />`, [see the docs](https://mui.com/joy-ui/react-css-baseline/). - -#### Changes - -- ​<!-- 02 -->[system] Fix typo in createCssVarsProvider (#34661) @HexM7 - -### `@mui/base@5.0.0-alpha.101` - -- ​<!-- 01 -->[FocusTrap] Restore the previously exported type from @mui/material (#34601) @michaldudak - -### `@mui/joy@5.0.0-alpha.49` - -- ​<!-- 04 -->[Joy] Add button loading functionality (#34658) @kushagra010 - -### Docs - -- ​<!-- 18 -->[docs] Revert #34541 (#34700) @michaldudak -- ​<!-- 15 -->[blog] Blog post for MUI X v6 alpha zero (#34424) @joserodolfofreitas -- ​<!-- 09 -->[docs] Improve Joy UI tutorial demo (#34653) @oliviertassinari -- ​<!-- 08 -->[docs] Explain how SelectUnstyled renders a hidden input (#34638) @michaldudak -- ​<!-- 07 -->[docs] Fix Taiwan description (#34611) @oliviertassinari -- ​<!-- 06 -->[docs] Fix codesandbox export with dayjs (#34619) @oliviertassinari -- ​<!-- 05 -->[docs] Explain the purpose of renderGroup prop (#34066) @michaldudak - -### Core - -- ​<!-- 14 -->[core] Make useForkRef variadic (#27939) @michaldudak -- ​<!-- 13 -->[core] Speedup of yarn install in the CI (#34632) @oliviertassinari -- ​<!-- 12 -->[core] Fix markdown loader on Windows (#34623) @michaldudak -- ​<!-- 11 -->[core] Update changelog for version v5.10.8 (#34593) @mnajdova -- ​<!-- 10 -->[core] Update root package.json version (#34592) @mnajdova - -All contributors of this release in alphabetical order: @HexM7, @joserodolfofreitas, @kushagra010, @michaldudak, @mnajdova, @oliviertassinari, @vanyaxk - -## 5.10.8 - -<!-- generated comparing v5.10.7..master --> - -_Oct 3, 2022_ - -A big thanks to the 18 contributors who made this release possible. Here are some highlights ✨: - -- 🚀 [SnackbarUnstyled](https://mui.com/base-ui/react-snackbar/) component & headless hook are added to Base UI (#33227) @ZeeshanTamboli -- 📚 [CSS variables documentation](https://mui.com/material-ui/experimental-api/css-theme-variables/overview/) for Material UI has been added by @siriwatknp (#33958) -- And more 🐛 bug fixes and 📚 documentation improvements. - -### `@mui/material@5.10.8` - -- ​<!-- 28 -->[Autocomplete] Skip filtering when list of options is loading (#33278) @ndebeiss -- ​<!-- 13 -->[Fab] Add `disabled` class to FAB button (#34245) @meenarama -- ​<!-- 09 -->[l10n] Add Arabic Saudi Arabia (ar-SA) locale (#33340) @rolule -- ​<!-- 08 -->[l10n] zhTW refinement (#33391) @Aporim2051 -- ​<!-- 07 -->[Popover] Add `ownerState` on the paper slot (#34445) @kabernardes -- ​<!-- 05 -->[Slider] Fixed incorrect marks displayed due to duplicate keys in range (#33526) @kskd1804 -- ​<!-- 03 -->[TextField] Fix typo in FormControlLabel declaration file (#34535) @hghmn - -### `@mui/base@5.0.0-alpha.100` - -- ​<!-- 04 -->[SnackbarUnstyled] Create component and `useSnackbar` hook (#33227) @ZeeshanTamboli - -### `@mui/joy@5.0.0-alpha.48` - -- ​<!-- 12 -->[Joy] Fix `variantPlain` classname missing in few components (#34534) @hbjORbj -- ​<!-- 11 -->[Joy] Fix input decorator color and list padding (#34586) @siriwatknp -- ​<!-- 10 -->[Joy] Miscellaneous fixes (#34492) @siriwatknp - -### Docs - -- ​<!-- 27 -->[blog] Fix 404 link in base introduction @oliviertassinari -- ​<!-- 21 -->[docs] Fix CI build (#34589) @mnajdova -- ​<!-- 20 -->[docs] Temporary remove date picker from home page (#34541) @siriwatknp -- ​<!-- 19 -->[docs] Revise and expand Joy UI "Tutorial" doc (#34569) @samuelsycamore -- ​<!-- 18 -->[docs] Fix SEO issues (#34537) @oliviertassinari -- ​<!-- 17 -->[docs] Add CSS variables documentation for Material UI (#33958) @siriwatknp -- ​<!-- 16 -->[docs] Capitalize Material Design on the Breakpoints page (#34481) @Dustin-Digitar -- ​<!-- 15 -->[docs] Able to load doc components inside markdown files (#34243) @flaviendelangle -- ​<!-- 14 -->[docs] Use mouse pointer on esc button in the search modal (#34485) @minkyngkm -- ​<!-- 02 -->[website] Fix typo in pricing FAQ @oliviertassinari -- ​<!-- 01 -->[website] Move the React Engineer role from open to next (#34494) @mnajdova - -### Core - -- ​<!-- 26 -->[core] Update root package.json version (#34592) @mnajdova -- ​<!-- 25 -->[core] Remove useless comment in fixtures (#34581) @Garz4 -- ​<!-- 24 -->[core] Fix link to CODE_OF_CONDUCT.md (#34543) @peippo -- ​<!-- 23 -->[core] Remove outdated docsearch.js dependency (#34421) @oliviertassinari -- ​<!-- 22 -->[core] Add `newFeature` to the typing of MuiPage (#34511) @flaviendelangle - -All contributors of this release in alphabetical order: @Aporim2051, @Dustin-Digitar, @flaviendelangle, @Garz4, @hbjORbj, @hghmn, @kabernardes, @kskd1804, @meenarama, @minkyngkm, @mnajdova, @ndebeiss, @oliviertassinari, @peippo, @rolule, @samuelsycamore, @siriwatknp, @ZeeshanTamboli - -## 5.10.7 - -<!-- generated comparing v5.10.6..master --> - -_Sep 26, 2022_ - -A big thanks to the 21 contributors who made this release possible. Here are some highlights ✨: - -- 🚀 [Divider](https://mui.com/joy-ui/react-divider/) component is added to Joy UI (#34403) @siriwatknp - -### `@mui/material@5.10.7` - -- [CssVarsProvider] Exclude dark mode variables from `:root` stylesheet (#34131) @siriwatknp -- [Chip] Add chip classes (#33801) @pratikkarad -- [Slider] Fix typo in the comments in the source (#34452) @HexM7 -- [SvgIcon] Fix passing an ownerState to SvgIcon changes the font size (#34429) @ZeeshanTamboli -- [Stepper] Fix optional label is not centered when `alternativeLabel` is used (#34335) @ZeeshanTamboli -- [Tooltip] Add undefined, null or false in `title` (#34289) @abhinav-22-tech -- Make @emotion/\* fully supported in all Material UI components (#34451) @garronej - -### `@mui/system@5.10.7` - -- [system] Fix parsing of hsla colors in getLuminance (#34437) @ptrfrncsmrph -- [system] Fix incorrect type of `shape.borderRadius` in theme (#34076) @ZeeshanTamboli -- [system] Replace `enableSystem` with `defaultMode` (#33960) @siriwatknp - -### `@mui/material@5.0.0-alpha.101` - -- [deps] Move @mui/types to dependencies (#34384) @Methuselah96 - -### `@mui/base@5.0.0-alpha.99` - -#### Breaking changes - -- [FocusTrap] Rename TrapFocus to FocusTrap (#34216) @kabernardes - - ```diff - -import TrapFocus from '@mui/base/TrapFocus'; - +import FocusTrap from '@mui/base/FocusTrap'; - ``` - -#### Changes - -- [MultiSelect] Require a single tap to select an item on mobile Chrome (#33932) @michaldudak - -### `@mui/joy@5.0.0-alpha.47` - -- [Checkbox] spread `value`, `required`, and `readOnly` to input (#34477) @siriwatknp -- [Chip] Fix unbinded `onClick` prop (#34455) @HexM7 -- [Divider] Add `Divider` component (#34403) @siriwatknp -- [Radio] spread `readOnly` and `required` to input (#34478) @siriwatknp - -### Docs - -- [blog] Base UI announcement typo fixed (#34409) @prakhargupta1 -- [blog] Fix typo in date-pickers v5 stable (#34386) @alexfauquette -- [blog] Update date on date pickers v5 release blog post (#34406) @joserodolfofreitas -- [docs] Update `useMenu` and `useMenuItem` hooks demo (#34166) @ZeeshanTamboli -- [docs] Update the guide for migrating to TSS (#34417) @garronej -- [docs] Fix typo in `Grid` docs (#34475) @Dustin-Digitar -- [docs] Fix typo in `Back to top` section in AppBar docs (#34479) @Dustin-Digitar -- [docs] Standardize all "Installation" pages (#34168) @samuelsycamore -- [docs] Fix Webpack file name to the standard: `webpack.config.js` (#34446) @CodingItWrong -- [docs] Fix Select `onChange` call (#34408) @siriwatknp -- [docs] Notification for pickers blog - v5 stable (#34400) @joserodolfofreitas -- [docs] Improve social sharing of docs pages (#34346) @oliviertassinari -- [docs] Refine the use of MUI vs. Material UI (#34345) @oliviertassinari -- [docs] Send feedback directly to a dedicated slack channel (#34196) @alexfauquette -- [website] Adds Bilal to about page (#34412) @MBilalShafi -- [website] Add date range picker to pricing table (#34399) @joserodolfofreitas - -### Core - -- [core] Document some types in @mui/styled-engine-sc (#34413) @mnajdova -- [core] Add yml support to prettier (#33980) @Janpot - -All contributors of this release in alphabetical order: @abhinav-22-tech, @alexfauquette, @CodingItWrong, @Dustin-Digitar, @garronej, @HexM7, @howlettt, @Janpot, @joserodolfofreitas, @kabernardes, @MBilalShafi, @Methuselah96, @michaldudak, @mnajdova, @oliviertassinari, @prakhargupta1, @pratikkarad, @ptrfrncsmrph, @samuelsycamore, @siriwatknp, @ZeeshanTamboli - -## 5.10.6 - -<!-- generated comparing v5.10.5..master --> - -_Sep 19, 2022_ - -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.10.6` - -- [TextField] Fix conflict with `Bootstrap` even when label is not defined (#34343) @ZeeshanTamboli - -### `@mui/joy@5.0.0-alpha.46` - -#### Breaking changes - -- [button][joy] Replace `start/endIcon` prop with `start/endDecorator` (#34288) @hbjORbj - - **BREAKING CHANGE**: replace `start/endIcon` with `start/endDecorator`. - - ```jsx - // before - <Button startIcon={...} endIcon={...} /> - - // after - <Button startDecorator={...} endDecorator={...} /> - ``` - -#### Changes - -- [Joy] Adjust the `Input` and `Textarea` styles (#34281) @siriwatknp -- [menu][joy] Set disablePortal default to false (#34283) @tomasz-sodzawiczny - -### `@mui/base@5.0.0-alpha.98` - -#### Breaking changes - -- [Select][base] Add event parameter to the onChange callback (#34158) @michaldudak - - The SelectUnstyled and MultiSelectUnstyled `onChange` callbacks did not have event as the first parameter, leading to inconsistency with other components and native HTML elements. - This PR adds the event parameter as the first one and moves the newly selected value to the second position. Because of this, it's a breaking change. - This also affects Select from Joy UI. - - ```jsx - // before - <SelectUnstyled onChange={(newValue) => { /* ... */ }} /> - - // after - <SelectUnstyled onChange={(event, newValue) => { /* ... */ }} /> - ``` - -### Docs - -- [blog] The Date Pickers gets a stable v5 release (#34152) @alexfauquette -- [blog] Improve image handling (#34222) @oliviertassinari -- [blog] Correct 2021 survey data interpretation (#34291) @samuelsycamore -- [docs] Remove expired AospExtended showcase @oliviertassinari -- [docs] Link the OpenSSF Best Practices card (#34331) @oliviertassinari -- [docs] Fix 301 link to external projects @oliviertassinari -- [docs] Move 12 component names to Title Case (#34188) @oliviertassinari -- [docs] Fix broken links (#34320) @alexfauquette -- [docs] Add notification for Base UI announcement post (#34295) @samuelsycamore -- [website] Fix MUI X subscribe email border style (#34330) @oliviertassinari -- [website] Improve security header @oliviertassinari - -### Core - -- [core] Lock file maintenance (#34161) @renovate[bot] -- [core] Issue template: move reproduction steps to the top (#34279) @Janpot -- [core] Create shared Next.js baseline config (#34259) @oliviertassinari -- [core] In `typescript-to-proptypes`, respect the value pass to the generic (#34311) @flaviendelangle - -All contributors of this release in alphabetical order: @alexfauquette, @flaviendelangle, @hbjORbj, @Janpot, @michaldudak, @oliviertassinari, @renovate[bot], @samuelsycamore, @siriwatknp, @tomasz-sodzawiczny, @ZeeshanTamboli - -## 5.10.5 - -<!-- generated comparing v5.10.4..master --> - -_Sep 12, 2022_ - -A big thanks to the 12 contributors who made this release possible. Here are some highlights ✨: - -- 🚀 [Blog post](https://mui.com/blog/introducing-base-ui/) for announcing the release of the Base UI package is out thanks to @michaldudak. -- 🚀 Added [`Alert`](https://mui.com/joy-ui/react-alert/), [`Modal`](https://mui.com/joy-ui/react-modal/), [`ListSubheader`](https://mui.com/joy-ui/react-list-subheader/), [`FormControl`](https://mui.com/joy-ui/react-form-control/), [`CircularProgress`](https://mui.com/joy-ui/react-circular-progress/) components to Joy UI (#33859) @hbjORbj @siriwatknp -- And more 🐛 bug fixes and 📚 documentation improvements. - -### `@mui/material@5.10.5` - -- ​<!-- 05 -->[ListItemText] Fix variant mapping in `primaryTypography` (#33880) @iamxukai -- ​<!-- 03 -->[Timeline] Add left and right aligned timeline demos in docs (#34156) @ZeeshanTamboli - -### `@mui/joy@5.0.0-alpha.45` - -- ​<!-- 20 -->[Joy UI] Add `CircularProgress` component (#33869) @hbjORbj -- ​<!-- 19 -->[Joy UI] Add `FormControl` component (#34187) @siriwatknp -- ​<!-- 18 -->[Joy UI] Add `ListSubheader` component (#34191) @siriwatknp -- ​<!-- 17 -->[Joy UI] Add `Modal` component (#34043) @siriwatknp -- ​<!-- 10 -->[Joy] Fix list value of false or 0 (zero) text is incorrectly grey (#34255) @kushagra010 -- ​<!-- 09 -->[Joy] Adjust typography decorator margin (#34257) @siriwatknp -- ​<!-- 08 -->[Joy] Miscellaneous fixes (#34193) @siriwatknp -- ​<!-- 07 -->[Radio][joy] Integrate with form control (#34277) @siriwatknp -- ​<!-- 06 -->[Joy][textarea] Pass `textarea` props from `componentsProps` (#34223) @HexM7 - -### Docs - -- ​<!-- 16 -->[blog] Introducing Base UI (#33778) @michaldudak -- ​<!-- 13 -->[docs] Fix spelling error (#34209) @ChrystianDeMatos -- ​<!-- 12 -->[docs] Improve link to the security policy (#34219) @oliviertassinari -- ​<!-- 11 -->[docs] Fix typo in Joy UI's `Usage` docs (#34200) @zillion504 -- ​<!-- 02 -->[website] Add Lukas to the about page (#34284) @LukasTy -- ​<!-- 01 -->[website] Update diamond sponsor URL (#34256) @oliviertassinari - -### Core - -- ​<!-- 04 -->[test] Replace argos-cli with @argos-ci/core (#34178) @michaldudak -- ​<!-- 15 -->[core] Create a script to generate codeowners (#34175) @michaldudak -- ​<!-- 14 -->[core] Add RFC GH issue template (#33871) @bytasv - -All contributors of this release in alphabetical order: @bytasv, @ChrystianDeMatos, @hbjORbj, @HexM7, @iamxukai, @kushagra010, @LukasTy, @michaldudak, @oliviertassinari, @siriwatknp, @ZeeshanTamboli, @zillion504 - -## 5.10.4 - -<!-- generated comparing v5.10.3..master --> - -_Sep 5, 2022_ - -A big thanks to the 11 contributors who made this release possible. Here are some highlights ✨: - -- 🚀 Added [`Alert`](https://mui.com/joy-ui/react-alert/) component to Joy UI (#33859) @hbjORbj -- Many other 🐛 bug fixes, 📚 documentation, and ⚙️ infrastructure improvements - -### `@mui/material@5.10.4` - -- ​<!-- 22 -->[Avatar] Use structured / semantic markup for avatars and avatar groups (#33994) @paulschreiber -- ​<!-- 05 -->[Steps] Use structured / semantic markup for steps and steppers (#34138) @paulschreiber - -### `@mui/joy@5.0.0-alpha.44` - -- ​<!-- 23 -->[Alert][joy] Add `Alert` component (#33859) @hbjORbj -- ​<!-- 08 -->[Joy] Make the description of `componentsProps` generic (#34140) @hbjORbj -- ​<!-- 07 -->[Joy] Add tests / classes for `Breadcrumbs` component (#33860) @hbjORbj -- ​<!-- 06 -->[Select][joy] Fix forwarding listbox `component` prop (#34172) @siriwatknp - -### `@mui/base@5.0.0-alpha.96` - -- ​<!-- 21 -->[Select][base] Fix type issues that appeared with TS 4.8 (#34132) @michaldudak - -### Docs - -- ​<!-- 15 -->[docs] Add `mui-color-input`, `mui-chips-input` and `mui-tel-input` into the related projects page (#34123) @viclafouch -- ​<!-- 14 -->[docs] Update sponsors (#34157) @hbjORbj -- ​<!-- 13 -->[docs] Move 5 component names to Title Case (#34118) @oliviertassinari -- ​<!-- 12 -->[docs] Fix the color contrast on optional API methods (#34127) @oliviertassinari -- ​<!-- 11 -->[docs] Fix crash due to using wrong variable (#34171) @siriwatknp -- ​<!-- 10 -->[docs] Fix a few Base typos (#33986) @ropereraLK -- ​<!-- 09 -->[docs] Revise Joy UI "Overview" page copy (#34087) @samuelsycamore -- ​<!-- 20 -->[blog] Fix social cards (#34160) @oliviertassinari -- ​<!-- 03 -->[website] Allow deep linking to sponsors @oliviertassinari -- ​<!-- 02 -->[website] Update job descriptions (#34134) @DanailH -- ​<!-- 01 -->[website] Link Toolpad landing page @oliviertassinari - -### Core - -- ​<!-- 19 -->[core] Move renovate config to the repository root (#34180) @oliviertassinari -- ​<!-- 18 -->[core] Reinstate react/no-unused-prop-types eslint rule (#34125) @Janpot -- ​<!-- 17 -->[core] Do not append `types` field to packages without index.d.ts (#33952) @michaldudak -- ​<!-- 16 -->[core] Sanitize input in icon synonyms update script (#33989) @michaldudak -- ​<!-- 04 -->[test] Allow to pass options to `mousePress` function (#34124) @cherniavskii - -All contributors of this release in alphabetical order: @cherniavskii, @DanailH, @hbjORbj, @Janpot, @michaldudak, @oliviertassinari, @paulschreiber, @ropereraLK, @samuelsycamore, @siriwatknp, @viclafouch - -## 5.10.3 - -<!-- generated comparing v5.10.2..master --> - -_Aug 29, 2022_ - -A big thanks to the 16 contributors who made this release possible. Here are some highlights ✨: - -- ⚡ @mnajdova implemented an alternative to OverridableComponent to achieve better dev-time performance (#32735) -- Many other 🐛 bug fixes, 📚 documentation, and ⚙️ infrastructure improvements - -### `@mui/material@5.10.3` - -- [Autocomplete][material] Fix value overflow when `disableClearable` is used (#34053) @mnajdova -- [Autocomplete] Update unstyled demo to not import Material UI (#34060) @oliviertassinari -- [Slider] Remove SliderInput export from d.ts (#34055) @pieetrus -- [TablePagination] Fix select variant not working (#33974) @ZeeshanTamboli - -### `@mui/system@5.10.3` - -- [system] Fix mode blink when open multiple sessions (#33877) @siriwatknp - -### `@mui/base@5.0.0-alpha.95` - -- [Button][base] Prevent too many ref updates (#33882) @michaldudak -- [Select][base] Fix typo in listbox blur event handler (#34120) @ZeeshanTamboli -- [FocusTrap] Improve tab test and simplify demo (#34008) @EthanStandel - -### `@mui/joy@5.0.0-alpha.43` - -- [Joy] Fix `role` proptypes (#34119) @siriwatknp -- [Joy] Refine `componentsProps` for all components (#34077) @siriwatknp -- [Radio][joy] support `componentsProps` as a function (#34022) @siriwatknp -- [Select][joy] Improve the a11y on the select field demo (#34073) @mnajdova -- [Textarea][joy] Add `Textarea` component (#33975) @siriwatknp - -### Docs - -- [blog] Add Grid v2 announcement (#33926) @siriwatknp -- [blog] Making customizable components (#33183) @alexfauquette -- [blog] Improve SEO metadata (#33954) @oliviertassinari -- [docs] Add introduction Base component demos & general uplift (#33896) @danilo-leal -- [docs] Fix Gatsby sample config in CSS variables (#34024) @bicstone -- [docs] Fix 404 link from Joy to React Router (#34115) @oliviertassinari -- [docs] Fix typo in `Select` component (#34091) @HexM7 -- [docs] Fix 301 links to tss's docs @oliviertassinari -- [docs] Fixing Joy UI usage snippet (#34049) @JonathanAsbury-SPS -- [docs] Fix missing JSX closing tag in Tooltip docs (#34064) @hoangph271 -- [website] Add Toolpad to Navigation (#33937) @bharatkashyap -- [website] Improve SEO meta description for MUI X @oliviertassinari -- [website] Improve visual look of code demos (#34070) @oliviertassinari -- [website] Fix `DatePicker` component demo on the home page (#34054) @NaveenPantra - -### Core - -- [core] Offer alternative to `OverridableComponent` via module augmentation for better performance (#32735) @mnajdova -- [core] Fix prop-type warning in regression tests (#34086) @oliviertassinari -- [core] Specify code owners (#33995) @michaldudak -- [core] Fix scroll restoration (#34037) @oliviertassinari - -All contributors of this release in alphabetical order: @alexfauquette, @bharatkashyap, @bicstone, @danilo-leal, @EthanStandel, @HexM7, @hoangph271, @JonathanAsbury-SPS, @michaldudak, @mnajdova, @NaveenPantra, @oliviertassinari, @pieetrus, @renovate[bot], @siriwatknp, @ZeeshanTamboli - -## 5.10.2 - -<!-- generated comparing v5.10.1..master --> - -_Aug 22, 2022_ - -A big thanks to the 11 contributors who made this release possible. Here are some highlights ✨: - -- ✨ @michaldudak synced the Material Icons set with the latest from Google (#33988).\ - A couple of icons changed their appearance. See the difference [on this Argos build](https://app.argos-ci.com/mui/material-ui/builds/4428]). - -### `@mui/material@5.10.2` - -- ​<!-- 16 -->[Autocomplete] Fix `keepMounted` Popper prop not working (#33957) @ZeeshanTamboli -- ​<!-- 10 -->[IconButton] Fix hover effect when CSS Variables are enabled (#33971) @TheUnlocked -- ​<!-- 07 -->[LoadingButton] Add support for CSS variables (#34001) @ZeeshanTamboli -- ​<!-- 05 -->[TimelineConnector] Add support for CSS variables (#34002) @ZeeshanTamboli -- ​<!-- 04 -->[TimelineDot] Add support for CSS variables (#34003) @ZeeshanTamboli -- ​<!-- 03 -->[TreeItem] Add support for CSS variables (#34004) @ZeeshanTamboli - -### `@mui/system@5.10.2` - -- ​<!-- 06 -->[system] catch localStorage errors (#34027) @jsakas - -### `@mui/joy@5.0.0-alpha.42` - -- ​<!-- 08 -->[Joy] Add missing global exports (#33982) @tomasz-sodzawiczny - -### `@mui/icons-material@5.8.5` - -- ​<!-- 09 -->[icons] Sync the Material Icons (#33988) @michaldudak - -### Docs - -- ​<!-- 21 -->[docs] Fix typo in using-joy-ui-and-material-ui.md (#33997) @djohalo2 @danilo-leal -- ​<!-- 20 -->[docs] Fix typo in the Transition docs (#34040) @alirezahekmati -- ​<!-- 19 -->[docs] Typo fix in Joy UI Aspect Ratio doc (#33984) @AjeetSingh2016 -- ​<!-- 15 -->[docs] Fix broken Joy UI codesandbox export (#34007) @oliviertassinari -- ​<!-- 14 -->[docs] Fix typos in `test` folder's README (#33976) @ropereraLK -- ​<!-- 13 -->[docs] Fix interior section links in Base docs that feature hooks (#33948) @samuelsycamore -- ​<!-- 12 -->[docs] Fix typo in Joy UI's List Component docs (#33956) @Cerebro92 -- ​<!-- 11 -->[docs] Fix typo in Joy UI's docs (#33938) @AjeetSingh2016 - -### Core - -- ​<!-- 18 -->[website] Optimize meta description length (#34006) @oliviertassinari -- ​<!-- 17 -->Revert "[core] Replace `getInitialProps` with `getStaticProps`" (#33991) @mnajdova -- ​<!-- 02 -->[website] Move the React Engineer - X to next roles (#34030) @mnajdova -- ​<!-- 01 -->[website] Add Icons8 gold sponsor (#33978) @michaldudak - -All contributors of this release in alphabetical order: @AjeetSingh2016, @alirezahekmati, @Cerebro92, @danilo-leal, @djohalo2, @jsakas, @michaldudak, @mnajdova, @oliviertassinari, @ropereraLK, @samuelsycamore, @TheUnlocked, @tomasz-sodzawiczny, @ZeeshanTamboli - -## 5.10.1 - -<!-- generated comparing v5.10.0..master --> - -_Aug 15, 2022_ - -A big thanks to the 18 contributors who made this release possible. This release was mostly around 🐛 bug fixes and 📚 documentation improvements. - -### `@mui/material@5.10.1` - -- ​<!-- 04 -->[TableCell] Enable variant overrides via TypeScript module augmentation (#33856) @arjunvijayanathakurup - -### `@mui/system@5.10.1` - -- ​<!-- 05 -->[system] Fix `ContainerProps` export (#33923) @bugzpodder - -### `@mui/base@5.0.0-alpha.93` - -- ​<!-- 31 -->[FocusTrap] Removes invisible tabbable elements from (#33543) @EthanStandel -- ​<!-- 30 -->[Input][base] Pass the rows prop to the underlying textarea (#33873) @michaldudak -- ​<!-- 06 -->[SelectUnstyled] Add ability to post the select's value when submitting a form (#33697) @michaldudak - -### `@mui/joy@5.0.0-alpha.41` - -- ​<!-- 07 -->[IconButton][joy] Fix large IconButton scaling (#33885) @cherewaty - -### Docs - -- ​<!-- 23 -->[docs] Expand on a11y section for Material UI `Link` component (#32839) @TKrishnasamy -- ​<!-- 22 -->[docs] Fix typo in Joy UI's `AspectRatio` docs (#33895) @IsaacInsoll -- ​<!-- 21 -->[docs] Improve the Base Usage page (#33272) @samuelsycamore -- ​<!-- 20 -->[docs] Avoid refreshing the page when button on demo is clicked (#33852) @PunitSoniME -- ​<!-- 19 -->[docs] Improve the HorizontalNonLinearStepper demo styling (#33886) @hayawata3626 -- ​<!-- 18 -->[docs] Remove dead NoSsr in the demos (#33910) @oliviertassinari -- ​<!-- 17 -->[docs] Fix the reopening menu problem in MenuUnstyled demo (#33890) @michaldudak -- ​<!-- 24 -->[docs] Fix a few link issues (#33909) @oliviertassinari -- ​<!-- 16 -->[docs] Explain the icons package dependencies (#33592) @michaldudak -- ​<!-- 15 -->[docs] Fix reported SEO issues (#33818) @oliviertassinari -- ​<!-- 14 -->[docs] Add permanent notifications back (#33843) @oliviertassinari -- ​<!-- 13 -->[docs] Enforce description for all pages (#33698) @oliviertassinari -- ​<!-- 12 -->[docs] Clarify difference in startup times between named and default imports (#33109) @cmdcolin -- ​<!-- 11 -->[docs] Update transform function in the sx prop sizing docs (#33850) @ZeeshanTamboli -- ​<!-- 10 -->[docs] Adding missing accessibility labels (#33782) @PunitSoniME -- ​<!-- 09 -->[docs] Fix `/system/getting-started/advanced/` does not exist (#33867) @MonstraG -- ​<!-- 32 -->[docs] New Crowdin updates (#32213) @l10nbot -- ​<!-- 08 -->[examples] Fix broken path to favicon.ico (#33906) @mmostafavi -- ​<!-- 02 -->[website] Add new FAQ to pricing page (#33553) @oliviertassinari -- ​<!-- 03 -->[website] Miscellaneous improvements to the marketing pages (#33897) @danilo-leal - -### Core - -- ​<!-- 29 -->[core] Add the download tracker package (#33899) @michaldudak -- ​<!-- 28 -->[core] Use proper external build id for Argos uploads (#33929) @cherniavskii -- ​<!-- 27 -->[core] Enforce 70 as the max width on the title on the docs (#33819) @oliviertassinari -- ​<!-- 26 -->[core] Clear yarn installation warning (#33776) @michaldudak -- ​<!-- 25 -->[core] Bump yarn to 1.22.19 (#33656) @michaldudak -- ​<!-- 24 -->[core] Remove outdated Next.js options (#33845) @oliviertassinari -- ​<!-- 34 -->[core] Add the download tracker build script (#33941) @michaldudak -- ​<!-- 01 -->[website] Allow /r/store- redirection pattern @oliviertassinari - -All contributors of this release in alphabetical order: @arjunvijayanathakurup, @bugzpodder, @cherewaty, @cherniavskii, @cmdcolin, @danilo-leal, @EthanStandel, @hayawata3626, @IsaacInsoll, @l10nbot, @michaldudak, @mmostafavi, @MonstraG, @oliviertassinari, @PunitSoniME, @samuelsycamore, @TKrishnasamy, @ZeeshanTamboli - -## 5.10.0 - -<!-- generated comparing v5.9.3..master --> - -_Aug 8, 2022_ - -A big thanks to the 16 contributors who made this release possible. Here are some highlights ✨: - -- ✨ [Stack](https://mui.com/system/react-stack/) component is added to MUI System and Joy UI #33760 #33800 @mnajdova -- ✨ [Breadcrumbs](https://mui.com/joy-ui/react-breadcrumbs/) component is added to Joy UI (#32697) @hbjORbj -- Many other 🐛 bug fixes, 📚 documentation, and ⚙️ infrastructure improvements - -### `@mui/material@5.10.0` - -- [Grid] Prevent crash if spacing is set to zero in theme (#33777) @PunitSoniME -- [Grid] Export interface `RegularBreakpoints` to fix type error (#33751) @ZeeshanTamboli -- [Skeleton] Add `rounded` variant (#33687) @siriwatknp -- [Stepper] Fix classes for icon container (#33734) @pratikkarad -- [TableCell] Enable size prop overrides via module augmentation (#33816) @brentertz -- [Tooltip] Fix tooltip arrow css var background (#33753) @TimoWilhelm -- [useScrollTrigger] Add passive flag to scroll trigger event listener #32437 (#33749) @Dsalazar1685 - -### `@mui/system@5.10.0` - -- Fix unnecessary styles created from `sx` (#33752) @siriwatknp -- Fix duplicated styles in Box (#33774) @iamxukai -- Don't spread props to DOM for string tags (#33761) @siriwatknp -- Add `Stack` component (#33760) @mnajdova - -### `@mui/joy@5.0.0-alpha.40` - -- [Stack] Add new component (#33800) @mnajdova -- [Breadcrumbs] Add `Breadcrumbs` component (#32697) @hbjORbj -- [Card] Fix wrong api description for `size` prop (#33862) @hbjORbj -- Miscellaneous fixes (#33796, #33750) @siriwatknp - -### Docs - -- [docs] Create, revise, and expand System "Getting started" docs (#33503) @samuelsycamore -- [docs] Test new image best practice @oliviertassinari -- [docs] Fix typo in the ClickAwayListerner name (#33813) @pawelsmigielski -- [docs] Fix link to `Basics` section in `Trap Focus` docs (#33772) @ZeeshanTamboli -- [docs] z-index added in popper when used by split button (#33763) @PunitSoniME -- [docs] Improve the guide for using @mui/base with Tailwind CSS (#33670) @mnajdova -- [docs] Fix warnings related to Next.js' links (#33693) @mnajdova -- [docs] Add notification to aggregation blogpost (#33745) @joserodolfofreitas -- [docs] Add Grid version 2 docs (#33554) @siriwatknp -- [examples] Fix `NextLinkComposedProps` type error (#33842) @adham618 - -### Core - -- [blog] Add social card to Tenerife retreat post (#33764) -- [blog] Fix blue outline bug (#33707) @oliviertassinari -- [blog] Improve the width of the layout (#33706) @oliviertassinari@samuelsycamore -- [core] Remove unnecessary packageName attribute from pages (#33488) @cherniavskii -- [core] Remove duplicated CODE_OF_CONDUCT (#33702) @oliviertassinari -- [core] Update Playwright packages together (#33737) @michaldudak -- [website] Fix notifications not being marked as read in production (#33756) @cherniavskii - -All contributors of this release in alphabetical order: @adham618, @brentertz, @cherniavskii, @Dsalazar1685, @hbjORbj, @iamxukai, @joserodolfofreitas, @michaldudak, @mnajdova, @oliviertassinari, @pawelsmigielski, @pratikkarad, @PunitSoniME, @siriwatknp, @TimoWilhelm, @ZeeshanTamboli - -## 5.9.3 - -<!-- generated comparing v5.9.2..master --> - -_Aug 1, 2022_ - -A big thanks to the 15 contributors who made this release possible. Here are some highlights ✨: - -- 🖼️ @garronej worked on improving the support of Emotion packages in MUI System (#33205) -- Many other 🐛 bug fixes, 📚 documentation, and ⚙️ infrastructure improvements - -### `@mui/material@5.9.3` - -- [Chip] Assign classnames and associated styles for `filled` variant (#33587) @hbjORbj -- [Grid] Fix `columnSpacing` and `rowSpacing` props ignore higher breakpoints with 0 (#33480) @ZeeshanTamboli -- [Input] Add the readOnly state class (#33654) @michaldudak -- [Stack] Responsive styles based on breakpoints should be in the correct order (#33552) @hbjORbj - -### `@mui/system@5.9.3` - -- [system] Make @emotion/\* fully supported in MUI System (#33205) @garronej - -### `@mui/codemod@5.9.3` - -- [codemod] Fix theme-spacing performance (#33691) @siriwatknp -- [codemod] Support @mui import for variant-prop (#33692) @siriwatknp - -### `@mui/styled-engine-sc@5.9.3` - -- [styled-engine-sc] Add missing @babel/runtime dependency (#33741) @MonstraG - -### `@mui/joy@5.0.0-alpha.38` - -- [Joy] Add Tabs components (#33664) @siriwatknp -- [Joy] Miscellaneous fixes (#33685) @siriwatknp -- [Joy] Update read.me content (#33643) @danilo-leal - -### Docs - -- [blog] Add blog post about company retreat in Tenerife 🏝 (#33566) @samuelsycamore -- [blog] Add blog post to announce the aggregation feature (#33595) @joserodolfofreitas -- [blog] Fix horizontal scrollbar with code snippets (#33648) @joserodolfofreitas -- [docs] Fix a typo in the code in `Sorting & selecting` Table demo (#33674) @mracette -- [docs] Fix en-US format in the Skeleton demo (#33699) @husseinsaad98 -- [docs] Update module reference for `usePagination` (#33675) @fullstackzach -- [docs] Fix code examples in `styled` API vs `sx` prop docs (#33665) @ZeeshanTamboli -- [docs][system] Throw an informative error when `theme.vars` is used in `createTheme` and mention this in the theming docs (#33619) @hbjORbj -- [website] Remove legacy redirect @oliviertassinari -- [website] Add new legal pages (#33650) @oliviertassinari -- [website] Clarify when a license in development is required (#33668) @oliviertassinari -- [website] Update links to rows pages (#33739) @cherniavskii -- [website] Update pricing table to add aggregation and row pinning (#33659) @joserodolfofreitas - -### Core - -- [core] Replace `getInitialProps` with `getStaticProps` (#33684) @mnajdova -- [core] Remove accidentally added files (#33636) @michaldudak -- [core] Update packages with security issues (#33679) @michaldudak -- [core] Add React 17 nightly build (#33594) @mnajdova -- [core] Update lerna to 5.2.0 (#33635) @michaldudak -- [core] Prepare isolation of Next.js X app (#33649) @oliviertassinari -- [core] Remove thenify version override from package.json resolutions (#33638) @michaldudak -- [core] Update Node.js to 14 on CircleCI, CodeSandbox, and Netlify (#33642) @michaldudak -- [test] Replace istanbul-instrumenter-loader with babel-plugin-istanbul (#33666) @michaldudak -- [test] Run TypeScript module augmentation tests for Joy UI in CI (#33667) @ZeeshanTamboli - -All contributors of this release in alphabetical order: @cherniavskii, @danilo-leal, @fullstackzach, @garronej, @hbjORbj, @husseinsaad98, @joserodolfofreitas, @michaldudak, @mnajdova, @MonstraG, @mracette, @oliviertassinari, @samuelsycamore, @siriwatknp, @ZeeshanTamboli - -## 5.9.2 - -<!-- generated comparing v5.9.1..master --> - -_Jul 25, 2022_ - -A big thanks to the 16 contributors who made this release possible. Here are some highlights ✨: - -- 🧪 Ensure all Base components are `OverridableComponent` (#33506) @michaldudak -- 🧪 Various improvements on the Material `Stack` component (#33548, #33588, #33549) @hbjORbj -- Many other 🐛 bug fixes and 📚 documentation improvements - -### `@mui/material@5.9.2` - -- ​<!-- 34 -->Revert "[Tooltip] Fix children mouse over detection (#32321)" @oliviertassinari -- ​<!-- 19 -->[FormHelperText] Fix unable to create new variants (#33589) @DinhBaoTran -- ​<!-- 18 -->[ImageList] Remove vertical spacing between items in masonry layout (#33593) @michaldudak -- ​<!-- 13 -->[LoadingButton] Refactor duplicate code (#33570) @ZeeshanTamboli -- ​<!-- 12 -->[Modal] Explain the meaning of deprecation of the BackdropComponent prop (#33591) @michaldudak -- ​<!-- 11 -->[Stack] Fix unit test failure (#33588) @hbjORbj -- ​<!-- 10 -->[Stack] Fix default `flexDirection` value with responsive prop (#33549) @hbjORbj -- ​<!-- 09 -->[Stack] Ensure that `marginundefined` doesn't occur in styling (#33548) @hbjORbj -- ​<!-- 08 -->[Tabs] Fix `indicatorColor` prop type (#33569) @ZeeshanTamboli -- ​<!-- 07 -->[Tabs] Add TypeScript interface to augment tab indicator color in theme (#33333) @AHeiming - -### `@mui/base@5.0.0-alpha.91` - -- ​<!-- 33 -->[Base] Make PopperUnstyled `component` overridable (#33573) @siriwatknp -- ​<!-- 32 -->[Base] Ensure all components are OverridableComponent (#33506) @michaldudak - -### `@mui/joy@5.0.0-alpha.38` - -- ​<!-- 17 -->[Select] Add new component in Joy (#33630) @siriwatknp -- ​<!-- 15 -->[Joy] Add Text field documentation (#33430, #33631) @danilo-leal -- ​<!-- 14 -->[Joy] Add menu components (#31789) @siriwatknp - -### Docs - -- ​<!-- 31 -->[blog] Fix 404 link to Algolia docs search (dd4308d) @oliviertassinari -- ​<!-- 28 -->[docs] Add accessibility tips (#33633) @siriwatknp -- ​<!-- 27 -->[docs] Fix production deploy of codesandboxes (#33608) @oliviertassinari -- ​<!-- 26 -->[docs] Show border on `palette.background.paper` in dark mode docs (#33611) @ZeeshanTamboli -- ​<!-- 25 -->[docs] Fix typo in Joy UI dark mode page (#33620) @bairamau -- ​<!-- 24 -->[docs] Final polish on Base docs - formatting and style consistency (#33156) @samuelsycamore -- ​<!-- 23 -->[docs] Fix `CssBaseline` import in example code (#33614) @dd-ssc -- ​<!-- 22 -->[docs] Fix Toolpad docs redirection (#33524) @bharatkashyap -- ​<!-- 21 -->[docs] Fix link to Snackbar customization section in Alert docs (#33586) @ZeeshanTamboli -- ​<!-- 20 -->[docs] Fix `placement choices` typo in Tooltip docs (#33571) @MonstraG -- ​<!-- 05 -->[website] Update home page's sponsor grid (#33528) @danilo-leal -- ​<!-- 04 -->[website] Add Vytautas to the about page (#33567) @bytasv -- ​<!-- 03 -->[website] Improve newsletter input design (#33585) @danilo-leal -- ​<!-- 02 -->[website] Add YouTube link to footer (#33580) @gerdadesign -- ​<!-- 01 -->[website] Clarify scope of technical support (#33435) @joserodolfofreitas - -### Core - -- ​<!-- 30 -->[core] Swallow ad blocker fetch fail (#33617) @oliviertassinari -- ​<!-- 29 -->[core] Fix dep security by resolving `thenify` to latest (#33612) @siriwatknp -- ​<!-- 06 -->[test] Remove `view` option from Event in Snackbar tests (#33555) @ZeeshanTamboli - -All contributors of this release in alphabetical order: @AHeiming, @bairamau, @bharatkashyap, @bytasv, @danilo-leal, @dd-ssc, @DinhBaoTran, @gerdadesign, @hbjORbj, @joserodolfofreitas, @michaldudak, @MonstraG, @oliviertassinari, @samuelsycamore, @siriwatknp, @ZeeshanTamboli - -## 5.9.1 - -<!-- generated comparing v5.9.0..master --> - -_Jul 18, 2022_ - -A big thanks to the 17 contributors who made this release possible. This release is mainly about 🐛 bug fixes and 📚 documentation improvements - -### `@mui/material@5.9.1` - -- ​<!-- 24 -->[Autocomplete] Fix disabling component crashing when focused (#31313) @mzedel -- ​<!-- 07 -->[Grid] Avoid scrollbar in demo (#33527) @oliviertassinari -- ​<!-- 05 -->[Slider] Fix transition of tooltips on vertical slider (#33009) @abhinav-22-tech -- ​<!-- 01 -->[TouchRipple] Fix crash on android where `event.touches` are an empty array (#32974) @lukeggchapman - -### `@mui/system@5.9.1` - -- ​<!-- 04 -->[system] Add flag to switch negative margin approach in Grid (#33484) @siriwatknp -- ​<!-- 03 -->[system] Remove needless optional chaining check in `createEmptyBreakpointObject` method (#33482) @ZeeshanTamboli - -### `@mui/base@5.0.0-alpha.90` - -- ​<!-- 23 -->[base] Export types used by components' props (#33522) @michaldudak -- ​<!-- 22 -->[base] Add missing type definitions in useControllableReducer (#33496) @michaldudak -- ​<!-- 06 -->[SelectUnstyled] Do not call onChange unnecessarily (#33408) @michaldudak - -### `@mui/lab@5.0.0-alpha.91` - -- ​<!-- 02 -->[TimelineDot] Add TimelineDotPropsColorOverrides interface to extend color options (#33466) @lolaignatova - -### Docs - -- ​<!-- 19 -->[docs] Add note about CssBaseline in the dark mode page (#33108) @GabrielaLokelani -- ​<!-- 18 -->[docs] Fix typos in the Interoperability page (#33273) @HexM7 -- ​<!-- 17 -->[docs] Improve the `useTheme` documentation (#33508) @rickstaa -- ​<!-- 16 -->[docs] Fix 301 redirections (#33521) @oliviertassinari -- ​<!-- 15 -->[docs] Link the same codesandbox as in the docs (#33472) @oliviertassinari -- ​<!-- 14 -->[docs] Fix copy search false positives (#33438) @oliviertassinari -- ​<!-- 13 -->[docs] Fix typo (#33520) @aravindpanicker -- ​<!-- 12 -->[docs] Update Tailwind docs to include step about updating popover containers (#33315) @ajhenry -- ​<!-- 11 -->[docs] Add yarn command for Roboto font in Material UI's typography.md (#33485) @anthonypz -- ​<!-- 10 -->[docs] Add new community content to the Material UI Learn page (#32927) @Nikhilthadani -- ​<!-- 09 -->[examples] Change createEmotionCache to use `insertionPoint` (#32104) @ANTARES-KOR -- ​<!-- 08 -->[examples] Fix error in Next.js example with @mui/styles (#33456) @paustria - -### Core - -- ​<!-- 21 -->[core] Cleanup experiments (#33547) @siriwatknp -- ​<!-- 20 -->[core] Update CHANGELOG to include pickers breaking change (#33486) @siriwatknp - -All contributors of this release in alphabetical order: @abhinav-22-tech, @ajhenry, @ANTARES-KOR, @anthonypz, @aravindpanicker, @GabrielaLokelani, @HexM7, @lolaignatova, @lukeggchapman, @michaldudak, @mzedel, @Nikhilthadani, @oliviertassinari, @paustria, @rickstaa, @siriwatknp, @ZeeshanTamboli - -## 5.9.0 - -<!-- generated comparing v5.8.7..master --> - -_Jul 12, 2022_ - -A big thanks to the 19 contributors who made this release possible. Here are some highlights ✨: - -- 🧪 Exported Grid v2 as `Unstable_Grid2` (#33479) @siriwatknp -- 📖 Added a guide for using Joy UI and Material UI together (#33396) @siriwatknp -- 🐛 Fixed a few bugs in Material UI components. Thanks to @ZeeshanTamboli, @ivan-ngchakming, and @joebingham-wk. -- ⚠️ **[BREAKING CHANGE]** Date pickers were removed from the lab. Learn how to migrate by visiting the [migration guide](https://mui.com/x/migration/migration-pickers-lab/). (#33386) @flaviendelangle -- many other 🐛 bug fixes and 📚 documentation improvements -- our documentation site is now running with React 18! (#33196) @mnajdova - -### `@mui/material@5.9.0` - -- [CssBaseline] Fixes in overriding style (#33338) @ZeeshanTamboli -- [Autocomplete] Remove unnecessary `clsx` wrapper for single className (#33398) @ZeeshanTamboli -- [Grid] Export new grid as unstable (#33479) @siriwatknp -- [Tooltip] Fix children mouse over detection (#32321) @ivan-ngchakming -- [TypeScript] getCssVar autocomplete for Material UI (#33464) @siriwatknp -- [TypeScript] Fix theme options components types to use `Theme` (#33434) @siriwatknp -- [TypeScript] Reexports necessary types for module augmentation (#33397) @siriwatknp -- [ScopedCssBaseline] Add sx typings (#33474) @joebingham-wk - -### `@mui/system@5.9.0` - -- [System] Add offset feature to Grid (#33415) @siriwatknp -- [system] Add new `Grid` implementation (#32746) @siriwatknp - -### `@mui/lab@5.0.0-alpha.90` - -**⚠️ Breaking changes** - -- [lab] Remove the pickers (#33386) @flaviendelangle - - The pickers are moved to MUI X, check out the [migration guide](https://mui.com/x/migration/migration-pickers-lab/). - -**Changes** - -- [Masonry] Support rem/em values for spacing prop (#33384) @hbjORbj - -### `@mui/base@5.0.0-alpha.89` - -- [Base] Change the order of class names merged in useSlotProps (#33383) @michaldudak -- [ModalUnstyled] Accept callbacks in componentsProps (#33181) @michaldudak -- [SelectUnstyled] Accept callbacks in componentsProps (#33197) @michaldudak -- [TabsUnstyled] Accept callbacks in componentsProps (#33284) @michaldudak - -### `@mui/joy@5.0.0-alpha.36` - -- [Joy] Add guide about using Joy and Material UI together (#33396) @siriwatknp -- [Joy] Fix variants color palette regressions (#33394) @danilo-leal - -### Docs - -- [docs] Correcting small grammatical error (#33393) @robyyo -- [docs] Link to the correct package on Joy component pages (#33439) @cherniavskii -- [docs] Fix e2e tests (#33477) @siriwatknp -- [docs] Fix dead links (#33462) @oliviertassinari -- [docs] Cleanup the migration (#33463) @siriwatknp -- [docs] Fix broken Sponsoring services links @samuelsycamore -- [docs] Improve repo README with light/dark logos, relative links and more (#33356) @samuelsycamore -- [docs] Update links to MUI X Overview and Introduction pages (#33201) @samuelsycamore -- [docs] Update to React 18 (#33196) @mnajdova -- [docs] Simplify "Upload button" demo (#33326) @baharalidurrani -- [docs] Add "refine" demo to showcase (#33240) @omeraplak -- [docs] Add Webpack alias for legacy utils package (#33376) @jgbae -- [docs] Improve external link icons synonyms (#33257) @davidgarciab -- [examples] Update Base UI with Tailwind CSS to use the latest versions of the dependencies (#33401) @mnajdova -- [examples] Add Base UI example (#33154) @siriwatknp - -### Core - -- [core] Fix @mui/monorepo regression for the import of the docs infra (#33390) @Janpot -- [core] Remove old babel resolve rule (#33432) @oliviertassinari -- [website] Shorten the plan descriptions on the pricing page (#32984) @joserodolfofreitas -- [website] Link EULA in the license quantity section (#33292) @oliviertassinari - -All contributors of this release in alphabetical order: @baharalidurrani, @cherniavskii, @danilo-leal, @davidgarciab, @flaviendelangle, @hbjORbj, @ivan-ngchakming, @Janpot, @jgbae, @joebingham-wk, @joserodolfofreitas, @michaldudak, @mnajdova, @oliviertassinari, @omeraplak, @robyyo, @samuelsycamore, @siriwatknp, @ZeeshanTamboli - -## 5.8.7 - -<!-- generated comparing v5.8.6..master --> - -_Jul 4, 2022_ - -A big thanks to the 13 contributors who made this release possible. Here are some highlights ✨: - -- 🐛 Fixed an issue causing TypeScript errors when building a project with Material UI v5.8.6 (@michaldudak) -- 🐛 Fixed a few bugs in Material UI components. Thanks @henriqueholtz, @jake-collibra, @MattiasMartens and @TimoWilhelm! -- many other 🐛 bug fixes and 📚 documentation improvements - -### `@mui/material@5.8.7` - -- [Autocomplete] Add some missing props in `useAutocomplete` (#33269) @henriqueholtz -- [Autocomplete] Extend `componentsProps` to include `popper` and `popupIndicator` slots (#33283) @jake-collibra -- [Select] Annotate empty string as valid value prop (#33088) @MattiasMartens -- [SnackbarContent] Fix message text color with css var provider (#33285) @TimoWilhelm - -### `@mui/styled-engine@5.8.7` - -- [styled-engine] Add missing type dependency on csstype (#33310) @Methuselah96 - -### `@mui/system@5.8.7` - -- [system] Simplify theme input types for `CssVarsProvider` (#33381) @siriwatknp -- [system] Export required types (#33324) @michaldudak - -### `@mui/joy@5.0.0-alpha.35` - -- [Joy] Add radio button documentation (#33254) @siriwatknp -- [Joy] Add switch documentation (#33302) @siriwatknp -- [Joy] Batch a couple of documentation refinements (#33158) -- [Joy] Enable Joy and Material UI compatibility (#33379) @siriwatknp - -### `@mui/base@5.0.0-alpha.88` - -- [base] Remove a type incompatible with TypeScript 3.5 (#33361) @michaldudak -- [BadgeUnstyled] Export BadgeUnstyledOwnProps interface to fix TypeScript compiler error (#33314) @aaronlademann-wf -- [TablePaginationUnstyled] Accept callbacks in componentsProps (#33309) @michaldudak - -### Docs - -- [docs] Fix Link typings in the react-router example (#32308) @aaarichter -- [docs] Add caveat about class components with Tooltip (#33325) @joshkel -- [docs] Fix SEO issues (#33288) @oliviertassinari -- [docs] Fix Slider's "player" demo (#33267) @xlianghang -- [website] Link Toolpad in mui.com (#33287) @oliviertassinari - -All contributors of this release in alphabetical order: @aaarichter, @aaronlademann-wf, @danilo-leal, @henriqueholtz, @jake-collibra, @joshkel, @MattiasMartens, @Methuselah96, @michaldudak, @oliviertassinari, @siriwatknp, @TimoWilhelm, @xlianghang - -## 5.8.6 - -<!-- generated comparing v5.8.5..master --> - -_Jun 27, 2022_ - -A big thanks to the 13 contributors who made this release possible. Here are some highlights ✨: - -- ⚒️ Fixed React 18 issues in few components -- 🚀 Improved the TypeScript augmentation when using CSS variables with `@mui/material` -- many other 🐛 bug fixes and 📚 documentation improvements - -### `@mui/material@5.8.6` - -- ​<!-- 27 -->[Alert] Add support for CSS vars (#32624) @haneenmahd -- ​<!-- 26 -->[Alert] Use `getContrastText` for filled variant font color (#29813) @SamoraMabuya - - Note: The color of the text in the warning contained `Alert` in dark mode was changed to black in order to improve the color contrast ratio - -- ​<!-- 11 -->[OutlinedInput] Fix `ownerState` undefined in theme style overrides (#33241) @siriwatknp -- ​<!-- 08 -->[Tabs] Fix crash when used with React 18 & Suspense (#33277) @mnajdova -- ​<!-- 05 -->[TypeScript] Add CSS vars type augmentation for Material UI (#33211) @siriwatknp - -### `@mui/system@5.8.6` - -- ​<!-- 09 -->[system] Add enableColorScheme option to getInitColorSchemeScript (#33261) @siriwatknp - -### `@mui/utils@5.8.6` - -- ​<!-- 04 -->[utils] Allow state prefix to be configurable (#32972) @siriwatknp - -### `@mui/base@5.0.0-alpha.87` - -- ​<!-- 25 -->[base] Improve the return type of useSlotProps (#33279) @michaldudak -- ​<!-- 24 -->[base] Improve some types (#33270) @mnajdova -- ​<!-- 13 -->[MenuUnstyled] Fix keyboard accessibility of menu items (#33145) @michaldudak -- ​<!-- 12 -->[ModalManager] Lock body scroll when container is inside shadow DOM (#33168) @jacobweberbowery -- ​<!-- 10 -->[SliderUnstyled] Use useSlotProps (#33132) @michaldudak -- ​<!-- 07 -->[TextareaAutosize] Fix crash when used with React 18 & Suspense (#33238) @howlettt -- ​<!-- 06 -->[TextareaAutosize] Fix warnings for too many renders in React 18 (#33253) @mnajdova - -### `@mui/joy@5.0.0-alpha.34` - -- ​<!-- 14 -->[Joy] Add `Sheet` doc (#32820) @hbjORbj - -### Docs - -- ​<!-- 23 -->[blog] Polish Why you should migrate to Material UI v5 today (#33244) @oliviertassinari -- ​<!-- 21 -->[docs] Add note in docs about `componentsProps.root` taking precedence (#33097) @ZeeshanTamboli -- ​<!-- 20 -->[docs] Remove a note about Base components being reexported from Material UI (#33265) @michaldudak -- ​<!-- 19 -->[docs] Update code snippet in docs for custom color palette (#32946) @ZeeshanTamboli -- ​<!-- 18 -->[docs] Fix the docs for production class generation (#31933) @Fafruch -- ​<!-- 17 -->[docs] Fix internal link in Box page (#33149) @davidgarciab -- ​<!-- 16 -->[docs] Badge component link in Base docs should be under Data Display section (#33249) @ZeeshanTamboli -- ​<!-- 15 -->[examples] Fix comment typo (#33256) @WinmezzZ - -### Core - -- ​<!-- 22 -->[core] Remove dead code (#33243) @oliviertassinari -- ​<!-- 03 -->[website] Fix the scroll-top for all the website (#33215) @oliviertassinari -- ​<!-- 02 -->[website] List new core role @oliviertassinari -- ​<!-- 01 -->[website] Fix navigation menu close behavior (#33203) @oliviertassinari - -All contributors of this release in alphabetical order: @davidgarciab, @Fafruch, @haneenmahd, @hbjORbj, @howlettt, @jacobweberbowery, @michaldudak, @mnajdova, @oliviertassinari, @SamoraMabuya, @siriwatknp, @WinmezzZ, @ZeeshanTamboli - -## 5.8.5 - -<!-- generated comparing v5.8.4..master --> - -_Jun 20, 2022_ - -A big thanks to the 14 contributors who made this release possible. Here are some highlights ✨: - -- 🚀 Added support for CSS variables in the `Avatar` component and the `SpeedDialAction` component respectively by @vicasas and @gin1314 -- many other 🐛 bug fixes and 📚 documentation improvements - -### `@mui/material@5.8.5` - -- ​<!-- 30 -->[Avatar] Add support for CSS variables (#32499) @vicasas -- ​<!-- 19 -->[Dialog] Fix broken styles if `maxWidth` is set to `false` (#32987) @kmurgic -- ​<!-- 04 -->[SpeedDialAction] Add support for CSS variables (#32608) @gin1314 -- ​<!-- 02 -->[Tabs] Increment scroll of the minimum amount possible (#33103) @oliviertassinari - -### `@mui/codemod@5.8.5` - -- ​<!-- 24 -->[codemod] Preserve comments within jss-to-tss-react (#33170) @ryancogswell - -### `@mui/lab@5.0.0-alpha.87` - -- ​<!-- 06 -->[Masonry] Fix flickering when used with React 18 (#33163) @mnajdova - -### `@mui/base@5.0.0-alpha.86` - -- ​<!-- 29 -->[BadgeUnstyled] Accept callbacks in componentsProps (#33176) @michaldudak -- ​<!-- 25 -->[ButtonUnstyled] Use useSlotProps (#33096) @michaldudak -- ​<!-- 11 -->[FormControlUnstyled] Accept callbacks in componentsProps (#33180) @michaldudak -- ​<!-- 10 -->[InputUnstyled] Use useSlotProps (#33094) @michaldudak -- ​<!-- 05 -->[ModalUnstyled] Define ownerState and slot props' types (#32901) @michaldudak -- ​<!-- 03 -->[SwitchUnstyled] Use useSlotProps (#33174) @michaldudak - -### `@mui/joy@5.0.0-alpha.33` - -- ​<!-- 09 -->[Joy] Add Checkbox documentation (#33171) @siriwatknp -- ​<!-- 08 -->[Joy] Add List documentation (#33120) @siriwatknp -- ​<!-- 07 -->[Joy] Make slider displays Joy classname (#33051) @siriwatknp - -### Docs - -- ​<!-- 28 -->[blog] Update Blogpost to clear confusion on "no impact" disclaimer. (#33131) @joserodolfofreitas -- ​<!-- 27 -->[blog] Add post about v5 Migration guide update (#33063) @samuelsycamore -- ​<!-- 26 -->[blog] Fix display on Safari (#33102) @oliviertassinari -- ​<!-- 18 -->[docs] Add guide on how to use Base UI with Tailwind CSS (#33100) @mnajdova -- ​<!-- 17 -->[docs] Improve Joy template UX (#33159) @siriwatknp -- ​<!-- 16 -->[docs] Update Shadow DOM guide (#33160) @cherniavskii -- ​<!-- 15 -->[docs] Fix SEO regressions (#33106) @oliviertassinari -- ​<!-- 14 -->[docs] Add job ad in table of content (#33143) @mnajdova -- ​<!-- 13 -->[docs] Add customization as a value proposition (#33014) @oliviertassinari -- ​<!-- 12 -->[examples] Add example using nextjs & @mui/styles as a starter for the migration to v5 (#33005) @mnajdova -- ​<!-- 01 -->[website] Replace Airtable with Ashby links for applying to a opened position (#33193) @DanailH - -### Core - -- ​<!-- 31 -->[core] Add CSS variables support for Material UI components (#32835) @siriwatknp -- ​<!-- 23 -->[core] Add name to workspace root package.json (#33226) @Janpot -- ​<!-- 22 -->[core] Update bug template with generic instruction (#33153) @joserodolfofreitas -- ​<!-- 21 -->[core] Remove dead and redundant code (#33125) @oliviertassinari -- ​<!-- 20 -->[core] Improve inline code rendering within the details tag (#33086) @Harmouch101 - -All contributors of this release in alphabetical order: @cherniavskii, @DanailH, @gin1314, @Harmouch101, @Janpot, @joserodolfofreitas, @kmurgic, @michaldudak, @mnajdova, @oliviertassinari, @ryancogswell, @samuelsycamore, @siriwatknp, @vicasas - -## 5.8.4 - -<!-- generated comparing v5.8.3..master --> - -_Jun 14, 2022_ - -A big thanks to the 24 contributors who made this release possible. Here are some highlights ✨: - -- 🚀 Added support for custom breakpoints in the `Grid` component by @boutahlilsoufiane -- 📚 Added guide on how to use Material UI with Shadow DOM by @cherniavskii -- many other 🐛 bug fixes and 📚 documentation improvements - -### `@mui/material@5.8.4` - -- ​<!-- 36 -->[Button] Add missing classes in `ButtonClasses` type (#33040) @ZeeshanTamboli -- ​<!-- 20 -->[Grid] Fix prop-type key regression (#33123) @oliviertassinari -- ​<!-- 19 -->[Grid] Support custom breakpoints (#31998) @boutahlilsoufiane -- ​<!-- 18 -->[Grow] Limit CSS transition bug workaround to Safari 15.4 only (#32996) @igordanchenko -- ​<!-- 17 -->[Hidden] Remove dependency on hoist-non-react-statics (#33015) @oliviertassinari -- ​<!-- 12 -->[Link] Add support for CSS variables (#33036) @winderica -- ​<!-- 07 -->[Popover] Export `getOffsetTop` & `getOffsetLeft` from Popover's index and add typings (#32959) @rart -- ​<!-- 06 -->[Slider] Fix SliderValueLabelProps type (#32895) @oliviertassinari -- ​<!-- 05 -->[Snackbar] Remove `RTL` direction specific logic (#32808) @aaarichter -- ​<!-- 04 -->[StepIcon] Fix text centering when changing browser font size (#32706) @alansouzati -- ​<!-- 02 -->[Tabs] Scroll by width of the first visible tab if only one tab is partially visible (#32778) @frankkluijtmans - -### `@mui/system@5.8.4` - -- ​<!-- 38 -->[Stack, system] Apply correct responsive styles if any custom breakpoints are provided (#32913) @ZeeshanTamboli -- ​<!-- 03 -->[system] Fix missing typings for ColorFormat (#32417) @l-zoy - -### `@mui/codemod@5.8.4` - -- ​<!-- 35 -->[codemod] Add support for `@mui/styles/makeStyles` imports (#32962) @joshkel - -### `@mui/lab@5.0.0-alpha.86` - -- ​<!-- 08 -->[pickers] Fix broken ref forwarding (#33107) @oliviertassinari -- ​<!-- 13 -->[lab] Fix React's `forwardRef` warning when importing from the index (#33134) @mnajdova - -### `@mui/base@5.0.0-alpha.85` - -- ​<!-- 11 -->[MenuUnstyled] Accept callbacks in componentsProps (#32997) @michaldudak -- ​<!-- 10 -->[ModalUnstyled] Fix errors from the W3C validator about incorrect aria-hidden attribute on some elements (#30920) @mkrtchian -- ​<!-- 09 -->[ModalUnstyled] Fix behavior of not respecting props ariaHidden value (#32055) @tech-meppem - -### `@mui/joy@5.0.0-alpha.32` - -- ​<!-- 16 -->[Joy] Miscellaneous card fixes (#33129) @siriwatknp -- ​<!-- 15 -->[Joy] Miscellaneous fixes (#33073) @siriwatknp -- ​<!-- 14 -->[Joy] Add typography and link docs (#33047) @siriwatknp - -### Docs - -- ​<!-- 40 -->[Contributing.md] Local install instructions (#32975) @Moizsohail -- ​<!-- 32 -->[docs] Add responsive AppBar with drawer (#32769) @dvlprAlamin -- ​<!-- 31 -->[docs] Move codesandbox to MUI org (#33122) @oliviertassinari -- ​<!-- 30 -->[docs] Add Shadow DOM guide (#33007) @cherniavskii -- ​<!-- 29 -->[docs] Fix typo in Material UI overview page (#33087) @oliviertassinari -- ​<!-- 28 -->[docs] Miscellaneous fixes in `Base UI` docs (#33091) @ZeeshanTamboli -- ​<!-- 27 -->[docs] Fix GitHub capitalization (#33071) @oliviertassinari -- ​<!-- 26 -->[docs] Fix a typo in `InputUnstyled` docs (#33077) @ZeeshanTamboli -- ​<!-- 25 -->[docs] Add notification for Joy blog post (#33059) @siriwatknp -- ​<!-- 24 -->[docs] Improve aspect ratio docs and integration (#33065) @siriwatknp -- ​<!-- 34 -->[docs] Update code block copy label (#33128) @siriwatknp -- ​<!-- 23 -->[docs] Fix typo in Autocomplete CSS API (#32838) @KeaghanKennedy -- ​<!-- 22 -->[docs] Improvements for Radio Group Rating Docs (#32843) @Kai-W -- ​<!-- 21 -->[docs] Enable Joy pages (#33064) @siriwatknp -- ​<!-- 02 -->[website] Add Joy UI to the pricing page (#33099) @danilo-leal -- ​<!-- 01 -->[website] Clarify the pricing a bit (#33069) @oliviertassinari - -### Core - -- ​<!-- 39 -->yarn proptypes @oliviertassinari -- ​<!-- 34 -->[core] Update dependencies to fix security vulnerabilities (#33095) @michaldudak -- ​<!-- 33 -->[core] Import new line convention (#33068) @oliviertassinari -- ​<!-- 37 -->[core] Make repository configurable in changelog script (#33130) @Janpot - -All contributors of this release in alphabetical order: @aaarichter, @alansouzati, @boutahlilsoufiane, @cherniavskii, @danilo-leal, @dvlprAlamin, @frankkluijtmans, @igordanchenko, @Janpot, @joshkel, @Kai-W, @KeaghanKennedy, @l-zoy, @michaldudak, @mkrtchian, @mnajdova, @Moizsohail, @oliviertassinari, @pushys, @rart, @siriwatknp, @tech-meppem, @winderica, @ZeeshanTamboli - -## 5.8.3 - -<!-- generated comparing v5.8.2..master --> - -_Jun 7, 2022_ - -A big thanks to the 15 contributors who made this release possible. -This release is mostly about 🐛 bug fixes and 📚 documentation improvements. - -### `@mui/material@5.8.3` - -- [Alert] Constrain message width and allow overflow (#32747) @Janpot -- [Checkbox] Add support for CSS variables (#32579) @haneenmahd -- [Slider] Fix positioning of tooltips on vertical slider (#32919) @abhinav-22-tech - -### `@mui/system@5.8.3` - -- [system] Configurable attributes for libraries (#32971) @siriwatknp - -### `@mui/codemod@5.8.3` - -- [codemod] Fix infinite loop in jss-to-tss-react and add TODO (#33048) @ryancogswell - -### `@mui/lab@5.0.0-alpha.85` - -- [pickers] Add deprecations when importing pickers from the lab (#32950) @flaviendelangle - -### `@mui/joy@5.0.0-alpha.31` - -- [Joy] Add `Slider` component and demos (#32694) @hbjORbj -- [Joy] Add articles about customization approaches (#32887) @siriwatknp -- [Joy] Add automatic adjustment page to core features (#32980) @siriwatknp -- [Joy] Add docs about dark mode (#33002) @siriwatknp -- [Joy] Add template UIs & first look blog post (#32791) @danilo-leal - -### `@mui/base@5.0.0-alpha.84` - -- [base] Remove @mui/system in tests (#32945) @kevinji -- [ButtonUnstyled] Accept callbacks in componentsProps (#32991) @michaldudak -- [SwitchUnstyled] Accept callbacks in componentsProps (#32993) @michaldudak -- [TablePaginationUnstyled] Define ownerState and slot props' types (#32905) @michaldudak -- [TabPanelUnstyled] Define ownerState and slot props' types (#32928) @michaldudak -- [TabsListUnstyled] Define ownerState and slot props' types (#32925) @michaldudak - -### Docs - -- [blog] Fix anchor link scroll (#32994) @oliviertassinari -- [docs] Add "Migration" section to sidebar and revise v4-v5 content (#32740) @samuelsycamore -- [docs] Add What doesn't count as a breaking change? (#32850) @oliviertassinari -- [docs] Fix 301 link @oliviertassinari -- [docs] Fix icon color in `BadgeUnstyled` docs (#32976) @ZeeshanTamboli -- [docs] Improve product identifier (#32707) @danilo-leal -- [docs] Improve UX with back to top (#32896) @oliviertassinari -- [docs] Polish overview page to Material UI (#32954) @oliviertassinari -- [docs] Redirect older URLs (#33037) @oliviertassinari -- [docs] Remove pickers page from the Lab section (#32961) @DanailH -- [docs] Show product identifier on updated MUI X Introduction pages (#32966) @samuelsycamore -- [docs] Throw on 301 links (#32939) @oliviertassinari -- [website] Add Gerda to the about page (#33038) @danilo-leal -- [website] Polish the pricing page (#32811) @oliviertassinari -- [website] Remove unnecessary `address` dependency (#32957) @michaldudak - -### Core - -- [core] Improve icon synonyms (#32742) @oliviertassinari -- [core] Prepare Next.js config for React 18 (#32963) @michaldudak -- [core] Remove dead logic (#32940) @oliviertassinari -- [core] Update dependencies to fix security vulnerabilities (#32947) @michaldudak -- Add security link to README for Tidelift @mbrookes - -All contributors of this release in alphabetical order: @abhinav-22-tech, @DanailH, @danilo-leal, @flaviendelangle, @haneenmahd, @hbjORbj, @Janpot, @kevinji, @mbrookes, @michaldudak, @oliviertassinari, @ryancogswell, @samuelsycamore, @siriwatknp, @ZeeshanTamboli - -## 5.8.2 - -<!-- generated comparing v5.8.1..master --> - -_May 30, 2022_ - -A big thanks to the 8 contributors who made this release possible. Here are some highlights ✨: - -- 🐛 bug fixes and 📚 documentation improvements. - -### `@mui/system@5.8.2` - -- ​<!-- 04 -->[system] Add `getColorSchemeSelector` util (#32868) @siriwatknp - -### `@mui/lab@5.0.0-alpha.84` - -- ​<!-- 07 -->[Masonry] Place items to the left when there are less objects than specified in `column` prop (#32873) @hbjORbj - -### `@mui/base@5.0.0-alpha.83` - -- ​<!-- 24 -->[BadgeUnstyled] Define ownerState and slot props' types (#32750) @michaldudak -- ​<!-- 06 -->[SliderUnstyled] Define ownerState and slot props' types (#32739) @michaldudak -- ​<!-- 05 -->[SwitchUnstyled] Define ownerState and slot props' types (#32573) @michaldudak -- ​<!-- 03 -->[TabsUnstyled] Define ownerState and slot props' types (#32918) @michaldudak -- ​<!-- 02 -->[TabUnstyled] Define ownerState and slot props' types (#32915) @michaldudak - -### `@mui/joy@5.0.0-alpha.30` - -- ​<!-- 13 -->[Joy] use `textColor` prop for Typography and Link (#32938) @siriwatknp -- ​<!-- 12 -->[Joy] Make variants for more flexible (#32931) @siriwatknp -- ​<!-- 11 -->[Joy] Improve automatic adjustment (#32923) @siriwatknp -- ​<!-- 10 -->[Joy] Add `Chip` doc (#32819) @hbjORbj -- ​<!-- 09 -->[Joy] Add `AspectRatio` demos (#32848) @siriwatknp -- ​<!-- 08 -->[Joy] Fix wrong urls (#32883) @siriwatknp - -### Docs - -- ​<!-- 24 -->[docs] Iterate on the job ad for React engineer in Core (#32900) @mnajdova -- ​<!-- 23 -->[blog] Fix avatar image resolution (#32890) @oliviertassinari -- ​<!-- 19 -->[docs] Link the first page of the product (#32943) @oliviertassinari -- ​<!-- 18 -->[docs] Batch small changes (#32170) @michaldudak -- ​<!-- 17 -->[docs] Allow function prop to return undefined (#32766) @m4theushw -- ​<!-- 16 -->[docs] Fix wrong link to Material Icons (#32847) @oliviertassinari -- ​<!-- 15 -->[docs] Fix ClassNameGenerator content (#32800) @siriwatknp -- ​<!-- 14 -->[docs] Fix navigation links (#32851) @oliviertassinari -- ​<!-- 14 -->[docs] Document the `size` prop for InputLabel (#32936) @romelperez -- ​<!-- 21 -->[docs] Add note about transparent background on the outlined Alert variant (#32810) @aaarichter -- ​<!-- 01 -->[website] Update the careers's page with the new roles (#32535) @oliviertassinari - -### Core - -- ​<!-- 22 -->[core] Improve the incomplete issues workflow (#32878) @mnajdova -- ​<!-- 21 -->[core] Add CI check that the PR has label (#32886) @mnajdova -- ​<!-- 20 -->[core] Avoid leaking @babel/runtime (#32874) @oliviertassinari - -All contributors of this release in alphabetical order: @aaarichter, @hbjORbj, @m4theushw, @michaldudak, @mnajdova, @oliviertassinari, @romelperez, @siriwatknp - -## 5.8.1 - -<!-- generated comparing v5.8.0..master --> - -_May 23, 2022_ - -A big thanks to the 21 contributors who made this release possible. Here are some highlights ✨: - -- 💅 Added CSS variables support for two more Material UI components by @diggis00 and @alisasanib -- And more 🐛 bug fixes and 📚 documentation improvements. - -### `@mui/material@5.8.1` - -- ​<!-- 33 -->[Alert] Fix missing `ownerState` on the `action` slot (#32801) @mnajdova -- ​<!-- 20 -->[Fab] Make the `color` prop type extendable (#31830) @paales -- ​<!-- 14 -->[ListItemButton] Render as link if href specified (#32403) @o-dubrovskyi -- ​<!-- 13 -->[Paper] Add support for CSS variables (#32570) @diggis00 -- ​<!-- 11 -->[Radio] Add support for CSS variables (#32599) @alisasanib -- ​<!-- 10 -->[Slider] Prevent rendering for marks that are out of the min & max bounds (#32436) @abriginets -- ​<!-- 09 -->[Slider] Slider having marks should be customizable in theme (#32816) @ZeeshanTamboli -- ​<!-- 03 -->[TouchRipple] Allows call imperative methods without event (#31955) @alexfauquette - -### `@mui/system@5.8.1` - -- ​<!-- 07 -->[system] Simplify stylesheet injection logic (#32869) @siriwatknp -- ​<!-- 06 -->[system] Fix color scheme specificity (#32628) @siriwatknp -- ​<!-- 05 -->[system] Fix `borderRadius` errors when used inside `CssVarsProvider` (#32817) @mnajdova -- ​<!-- 04 -->[system] Fix toolbar media query mixin getting merged in wrong order (#32713) @ZeeshanTamboli - -### `@mui/lab@5.0.0-alpha.83` - -- ​<!-- 15 -->[lab] Add missing `peerDependencies` (#32623) @nate-summercook -- ​<!-- 12 -->[pickers] Update @mui/x-date-pickers to be usable with React 18 (#32828) @flaviendelangle - -### `@mui/base@5.0.0-alpha.82` - -- ​<!-- 08 -->[SliderUnstyled] Fix `disabledSwap` not being respected in `onChangeCommitted` (#32647) @JeanPetrov - -### `@mui/joy@5.0.0-alpha.29` - -- ​<!-- 19 -->[Joy] Show Joy pages on master (#32866) @siriwatknp -- ​<!-- 18 -->[Joy] Add an overview page (#32836) @danilo-leal -- ​<!-- 17 -->[Joy] Add doc for the card components (#32825) @siriwatknp -- ​<!-- 16 -->[Joy] Miscellaneous fixes (#32815) @siriwatknp - -### Docs - -- ​<!-- 31 -->[docs] Simplify header DOM structure (#32844) @oliviertassinari -- ​<!-- 30 -->[docs] Fix CodeSandbox & StackBlitz generation (#32726) @siriwatknp -- ​<!-- 29 -->[docs] Fix urls to columns pages in pricing table (#32842) @alexfauquette -- ​<!-- 28 -->[docs] Fix Tailwind CSS integration docs (#32512) @robertwt7 -- ​<!-- 27 -->[docs] Fixed wrong command for the `link-underline-hover` codemod (#32793) @veronikaslc -- ​<!-- 26 -->[docs] Fixed broken link on the icons page (#32780) @SamuelMaddox -- ​<!-- 25 -->[docs] Add "back to top" button (#30441) @VibhorJaiswal -- ​<!-- 24 -->[docs] Fix typo in notifications @mbrookes -- ​<!-- 32 -->[docs] New WAI-ARIA guidelines location (#32865) @oliviertassinari -- ​<!-- 23 -->[docs] Mention the ESLint plugin for detecting unused classes in tss-react (#32666) @garronej -- ​<!-- 22 -->[docs] Update `useAutocomplete` demos to use `Mui-focused` class (#32757) @ZeeshanTamboli -- ​<!-- 21 -->[examples] Fix `NextLinkComposedProps` gives a TypeScript error (#32655) @ZeeshanTamboli -- ​<!-- 01 -->[website] Add Pedro to About Us page (#32803) @apedroferreira - -### Core - -- ​<!-- 32 -->[core] Upgrade MUI X dependency (#32824) @oliviertassinari -- ​<!-- 02 -->[typescript] Allow module augmentation for `Mixins` (#32798) @mnajdova - -All contributors of this release in alphabetical order: @abriginets, @alexfauquette, @alisasanib, @apedroferreira, @danilo-leal, @diggis00, @flaviendelangle, @garronej, @JeanPetrov, @mbrookes, @mnajdova, @nate-summercook, @o-dubrovskyi, @oliviertassinari, @paales, @robertwt7, @SamuelMaddox, @siriwatknp, @veronikaslc, @VibhorJaiswal, @ZeeshanTamboli - -## 5.8.0 - -<!-- generated comparing v5.7.0..master --> - -_May 17, 2022_ - -A big thanks to the 14 contributors who made this release possible. Here are some highlights ✨: - -- 🚀 [Blog post](https://mui.com/blog/premium-plan-release/) for announcing the release of the Premium plan of MUI X is out thanks to @joserodolfofreitas. -- Codemod for `jss` to `tss-react` migration is out thanks to @ryancogswell -- And more 🐛 bug fixes and 📚 documentation improvements. - -### `@mui/material@5.8.0` - -- ​<!-- 37 -->[Autocomplete] Fix `getInputProps` TypeScript return type (#32730) @ZeeshanTamboli -- ​<!-- 36 -->[Autocomplete] Forward props to renderTags() (#32637) @emlai -- ​<!-- 35 -->[Badge] Fix TypeScript error when adding style overrides for Badge (#32745) @ZeeshanTamboli -- ​<!-- 09 -->[Menu] Fix context menu open position (#32661) @oliviertassinari - -### `@mui/system@5.8.0` - -- ​<!-- 05 -->[system] Add `Container` component and `createContainer` factory (#32263) @mnajdova - -### `@mui/base@5.0.0-alpha.81` - -- ​<!-- 15 -->[InputUnstyled] Support callbacks in componentsProps (#32271) @michaldudak -- ​<!-- 14 -->[InputUnstyled] Define ownerState and slot props' types (#32491) @michaldudak -- ​<!-- 08 -->[MenuUnstyled] Demos improvements (#32714) @michaldudak -- ​<!-- 07 -->[OptionUnstyled] Define ownerState and slot props' types (#32717) @michaldudak - -### `@mui/joy@5.0.0-alpha.28` - -- ​<!-- 13 -->[Joy] Add Badge doc (#32790) @siriwatknp -- ​<!-- 12 -->[Joy] Add global variant feature page (#32695) @siriwatknp -- ​<!-- 11 -->[Joy] Add avatar page (#32711) @siriwatknp - -### `@mui/codemod@5.8.0` - -- ​<!-- 33 -->[codemod] Add jss to tss-react codemod (#31802) @ryancogswell - -### Docs - -- ​<!-- 34 -->[blog] Add release post for MUI X Premium (#32720) @joserodolfofreitas -- ​<!-- 29 -->[docs] Fix wrong code snippet for overriding styles in theme with a callback value (#32781) @ZeeshanTamboli -- ​<!-- 28 -->[docs] Update Crowdin logo (#32782) @andrii-bodnar -- ​<!-- 27 -->[docs] Improve callouts design (#32709) @danilo-leal -- ​<!-- 26 -->[docs] Revise the "Understanding MUI packages" article (#32382) @danilo-leal -- ​<!-- 25 -->[docs] Fix link to the material icons (#32771) @oliviertassinari -- ​<!-- 24 -->[docs] Add notification for Premium release blog post (#32728) @joserodolfofreitas -- ​<!-- 23 -->[docs] Base Portal style revisions and final review (#32157) @samuelsycamore -- ​<!-- 22 -->[docs] Add joy to docs package.json (#32744) @siriwatknp -- ​<!-- 21 -->[docs] Fix TOC-related styles not being applied when disableAd=true (#32733) @cherniavskii -- ​<!-- 20 -->[docs] Add TypeScript guide on the polymorphic components (#32168) @mnajdova -- ​<!-- 19 -->[docs] Fix warning mode pass to React.Fragment (#32729) @siriwatknp -- ​<!-- 18 -->[docs] Revise Showcase copy for clarity + audit appList (#31946) @samuelsycamore -- ​<!-- 17 -->[examples] Update remix example's tsconfig with required values (#32723) @michaldudak -- ​<!-- 16 -->[examples] Update to use React 18's createRoot (#32506) @mnajdova -- ​<!-- 10 -->[l10n] Fix typos and translations on arSD and arEG locales (#31848) @shadigaafar -- ​<!-- 04 -->[website] Improve communication about MUI X components that are still wip (#32708) @danilo-leal -- ​<!-- 03 -->[website] Remove scrollbar on x-axis (#32291) @MrHBS -- ​<!-- 02 -->[website] Update the pricing page for the MUI X premium plan release (#32458) @joserodolfofreitas -- ​<!-- 01 -->[website] Update sponsors (#32725) @oliviertassinari - -### Core - -- ​<!-- 32 -->[core] Enabled Renovate's lockfile maintenance (#32635) @michaldudak -- ​<!-- 31 -->[core] Extract `MuiPage` interface to separate file (#32715) @cherniavskii -- ​<!-- 30 -->[core] Remove unnecessary `spacing` parameter from `createMixins` method (#32690) @ZeeshanTamboli -- ​<!-- 06 -->[private-classnames] Remove package and move everything to utils (#32758) @mnajdova - -All contributors of this release in alphabetical order: @andrii-bodnar, @cherniavskii, @danilo-leal, @emlai, @joserodolfofreitas, @michaldudak, @mnajdova, @MrHBS, @oliviertassinari, @ryancogswell, @samuelsycamore, @shadigaafar, @siriwatknp, @ZeeshanTamboli - -## 5.7.0 - -<!-- generated comparing v5.6.4..master --> - -_May 10, 2022_ - -A big thanks to the 27 contributors who made this release possible. Here are some highlights ✨: - -🛠 This release is all about supporting CSS variables in many Material UI components. -Kudos to all contributors! - -### `@mui/material@5.7.0` - -- [StepLabel, StepIcon] Add support for CSS variables (#32609) @vicasas -- [Table, TableRow] Add support for CSS variables (#32614) @vicasas -- [AppBar] Add a logo component for the responsive app bar demo (#32374) @ameetmadan -- [Autocomplete] Fix clearing single array values (#32626) @mikepricedev -- [Autocomplete] Fix keep listbox open on left/right keys when inputValue is not empty (#31407) @alisasanib -- [Autocomplete] Add support for CSS variables (#32598) @ZeeshanTamboli -- [Autocomplete] Render `endAdornment` only when necessary (#32386) @g1eny0ung -- [ButtonGroup] Add support for CSS variables (#32498) @vicasas -- [CardActionArea] Add support for CSS variables (#32554) @vicasas -- [ClickAwayListener] Allow pointer up/down events to event handler (#32264) @vladjerca -- [CssBaseline] Add support for CSS vars (#32618) @haneenmahd -- [Dialog] Add support for CSS variables (#32555) @vicasas -- [Divider] Add support for CSS variables (#32519) @vicasas -- [Drawer] Add support for CSS variables (#32565) @nghiamvt -- [Fab] Add support for CSS variables (#32564) @alisasanib -- [FormControlLabel] Add support for CSS variables (#32588) @elliefoote -- [FormHelperText] Add support for CSS variables (#32596) @ZeeshanTamboli -- [FormLabel] Add support for CSS variables (#32602) @ZeeshanTamboli -- [Icon] Add support for CSS variables (#32595) @Jamaalwbrown -- [IconButton] Add support for CSS variables (#32590) @Ariyapong -- [ImageListItemBar] Add support for CSS variables (#32578) @vicasas -- [Input] Support CSS variables (#32128) @ivan-ngchakming -- [InputAdornment] Add support CSS variables (#32607) @vicasas -- [Link] Fix style overrides color prop (#32653) @siriwatknp -- [ListItem] Add support for CSS variables (#32580) @dan-mba -- [ListItemButton] Add support for CSS variables (#32582) @dan-mba -- [ListItemIcon] Add support for CSS variables (#32583) @dan-mba -- [ListSubheader] Add support for CSS variables (#32584) @dan-mba -- [MenuItem] Add support for CSS variables (#32561) @nghiamvt -- [MobileStepper] Add support for CSS vars (#32606) @haneenmahd -- [Modal] Add support for CSS variables (#32605) @haneenmahd -- [PaginationItem] Add support for CSS vars (#32612) @haneenmahd -- [Rating] Add support for CSS variables (#32556) @vicasas -- [Snackbar] Add support for CSS variables (#32603) @gin1314 -- [SpeedDial] Add support for CSS variables (#32613) @alisasanib -- [Stepper] Export useStepperContext (#31398) @pzi -- [SvgIcon] Add support for CSS variables (#32610) @vicasas -- [TablePagination] Add support for CSS variables (#32615) @haneenmahd -- [TableSortLabel]: Add support for CSS vars (#32616) @haneenmahd -- [Tabs] Add support for CSS variables (#32547) @ZeeshanTamboli -- [ToggleButton] Add support for CSS variables (#32600) @Ariyapong -- [ToggleButtonGroup] Add support for CSS variables (#32617) @haneenmahd -- [Tooltip] Add support for CSS variables (#32594) @gin1314 - -### `@mui/system@5.7.0` - -- [System] Support CSS variables for iframes & custom nodes (#32496) @siriwatknp - -### `@mui/base@5.0.0-alpha.80` - -- [ButtonUnstyled] Fix keyboard navigation on customized elements (#32204) @michaldudak - -### `@mui/private-classnames@5.7.0` - -- [classnames] Add new package for classnames utils (#32502) @mnajdova - -### Docs - -- [docs] Correct links to prevent 301 redirects (#32692) @michaldudak -- [docs] Move, split, and revise "Unstyled components" page (#32562) @samuelsycamore -- [docs] Nest `ListItemButton` in `ListItem` in the Drawer examples (#31987) @stefanprobst -- [docs] Apply callouts in the Material UI docs (#32567) @danilo-leal -- [docs] Show product identifier on new X pages (#32657) @cherniavskii -- [docs] Fix copy button childNode not found (#32652) @siriwatknp -- [docs] Split install commands in isolated code blocks (#32566) @danilo-leal -- [docs] Base Switch style revisions and final review (#32376) @samuelsycamore -- [docs] Adds Badge link to Base doc nav (#32619) @samuelsycamore -- [docs] Base Installation style revisions and final review (#32483) @samuelsycamore -- [docs] Fix broken redirection (#32581) @oliviertassinari -- [docs] Allows to use `import '<library name>'` in demonstrations (#32492) @alexfauquette -- [docs] Hide copy button on search icon dialog (#32577) @siriwatknp -- [docs] Use full API link for ThemeProvider (#32549) @jcvidiri -- [Joy] Add principles page (#32648) @siriwatknp -- [Joy] Add Button page (#32576) @siriwatknp -- [Joy] Add "Quick start" and "Tutorial" pages (#32383) @siriwatknp -- [website] Add store to the footer and "hiring" chip adjustment (#32650) @danilo-leal -- [website] Optimize conversion to store (#32646) @oliviertassinari -- [website] Remove copy button on marketing pages (#32649) @siriwatknp -- [website] Add missing space in copy label (#32638) @flaviendelangle - -### Core - -- [core] Security updates (#32636) @michaldudak -- [core] Fix `docs:dev` not working after upgrading `next` to 12.1.0 (#32552) @cherniavskii -- [core] Update minimist to fix security vulnerability (#32575) @michaldudak - -All contributors of this release in alphabetical order: @alexfauquette, @alisasanib, @ameetmadan, @Ariyapong, @cherniavskii, @dan-mba, @danilo-leal, @elliefoote, @flaviendelangle, @g1eny0ung, @gin1314, @haneenmahd, @ivan-ngchakming, @Jamaalwbrown, @jcvidiri, @michaldudak, @mikepricedev, @mnajdova, @nghiamvt, @oliviertassinari, @pzi, @samuelsycamore, @siriwatknp, @stefanprobst, @vicasas, @vladjerca, @ZeeshanTamboli - -## 5.6.4 - -<!-- generated comparing v5.6.3..master --> - -_May 2, 2022_ - -A big thanks to the 13 contributors who made this release possible. Here are some highlights ✨: - -- 💅 5 Material UI components were updated to support CSS variables by @ZeeshanTamboli & @vicasas -- And more 🐛 bug fixes and 📚 improvements. - -### `@mui/material@5.6.4` - -- ​<!-- 37 -->[Accordion] Add support for CSS variables (#32542) @ZeeshanTamboli -- ​<!-- 36 -->[AvatarGroup] Add support for CSS variables (#32507) @vicasas -- ​<!-- 35 -->[Badge] Add support for CSS variables (#32516) @vicasas -- ​<!-- 34 -->[BottomNavigation] Add support for CSS variables (#32517) @vicasas -- ​<!-- 33 -->[CircularProgress] Add support for CSS variables (#32543) @ZeeshanTamboli -- ​<!-- 07 -->[FilledInput] Fix type error from undefined `color` (#32258) @hbjORbj -- ​<!-- 02 -->[l10n] Fix typo in csCZ translation of Pagination component (#32509) @Martin005 -- ​<!-- 01 -->[Tabs] Fix `TabIndicatorProps` prop missing `sx` prop (#32503) @b-novikov-ipersonality - -### `@mui/codemod@5.6.4` - -- ​<!-- 32 -->[codemod] Leave numeric arguments to breakpoints functions unchanged (#32426) @ryancogswell -- ​<!-- 31 -->[codemod] Allow for line breaks within theme.spacing parentheses (#32432) @ryancogswell - -### `@mui/joy@5.0.0-alpha.26` - -- ​<!-- 06 -->[Joy] Miscellaneous fixes (#32541) @siriwatknp -- ​<!-- 05 -->[Joy] Add `extendSxProp` to Link (#32505) @siriwatknp -- ​<!-- 04 -->[Joy] Rename variants (#32489) @siriwatknp -- ​<!-- 03 -->[Joy] Add `extendTheme` (#32450) @siriwatknp - -### Docs - -- ​<!-- 30 -->[docs] SEO fixes (#32515) @oliviertassinari -- ​<!-- 29 -->[docs] Replace `Overriding nested component styles` anchor link with text (#32487) @ZeeshanTamboli -- ​<!-- 28 -->[docs] Update the list of external domains (#32514) @oliviertassinari -- ​<!-- 27 -->[docs] Update Material UI code snippets for React 18 (#32361) @samuelsycamore -- ​<!-- 26 -->[docs] Base TextareaAutosize style revisions and final review (#32481) @samuelsycamore -- ​<!-- 25 -->[docs] Base ClickAwayListener style revisions and final review (#32156) @samuelsycamore -- ​<!-- 24 -->[docs] Base Button style revisions and final review (#32380) @samuelsycamore -- ​<!-- 23 -->[docs] Base NoSsr style revisions and final review (#32254) @samuelsycamore -- ​<!-- 22 -->[docs] Correctly capitalize Ctrl @oliviertassinari -- ​<!-- 21 -->[docs] Fix styling in `Basic Popper` demo on the Base UI docs (#32488) @ZeeshanTamboli -- ​<!-- 20 -->[docs] Add "Overview" page to Base docs (#32310) @samuelsycamore -- ​<!-- 19 -->[docs] Add copy button to code block (#32390) @siriwatknp -- ​<!-- 18 -->[docs] Base Tabs style revisions and final review (#32423) @samuelsycamore -- ​<!-- 17 -->[docs] Base Popper style revisions and final review (#32412) @samuelsycamore -- ​<!-- 16 -->[docs] Improve sidenav for MUI X (#32435) @oliviertassinari -- ​<!-- 15 -->[docs] Don't redirect on deploy preview (#32399) @m4theushw -- ​<!-- 14 -->[docs] A few SEO fixes (#32431) @oliviertassinari -- ​<!-- 13 -->[docs] Update links to the new Group & Pivot pages (#32410) @flaviendelangle -- ​<!-- 12 -->[docs] Support callouts (#32402) @siriwatknp -- ​<!-- 11 -->[docs] Fix import path in the Snackbar article #32462 @mongolyy -- ​<!-- 10 -->[docs] Fix grammar mistake in shadows.md (#32454) @HexM7 -- ​<!-- 09 -->[docs] Improve unstyled button docs (#32429) @oliviertassinari - -### Core - -- ​<!-- 08 -->[experiment] Add template for testing Material UI components with CSS variables (#32500) @siriwatknp - -All contributors of this release in alphabetical order: @b-novikov-ipersonality, @flaviendelangle, @hbjORbj, @HexM7, @m4theushw, @Martin005, @mongolyy, @oliviertassinari, @ryancogswell, @samuelsycamore, @siriwatknp, @vicasas, @ZeeshanTamboli - -## 5.6.3 - -<!-- generated comparing v5.6.2..master --> - -_Apr 25, 2022_ - -A big thanks to the 14 contributors who made this release possible. Here are some highlights ✨: - -- 🛠 Fixed TypeScript issue when the `fill` CSS property is used in MUI System (#32355) @valerii15298 -- And more 🐛 bug fixes and 📚 improvements. - -### `@mui/material@5.6.3` - -- [BottomNavigation] Action icon `padding` fix (#32030) @abhinav-22-tech -- [Dialog] Fix `component` prop is not available in `DialogTitleProps` (#32389) @hbjORbj -- [StepContent] Fix TypeScript type of `TransitionComponent` prop (#32314) @ZeeshanTamboli - -### `@mui/system@5.6.3` - -- [system] Fix prop types when the `fill` CSS property is used (#32355) @valerii15298 -- [system] Fix broken behavior when theme value is `zero` (#32365) @ZeeshanTamboli - -### `@mui/base@5.0.0-alpha.78` - -- [InputUnstyled] `multiline` property should not log DOM warnings for `maxRows` and `minRows` props (#32401) @ZeeshanTamboli - -### `@mui/joy@5.0.0-alpha.25` - -- [Joy] Improve theme focus to be more flexible (#32405) @siriwatknp -- [Joy] Add `Radio`, `RadioGroup` components (#32279) @siriwatknp -- [Joy] Add `Chip` component (#31983) @hbjORbj -- [Joy] Improve controls (#32267) @siriwatknp -- [Joy] Set up docs (#32370) @siriwatknp - -### Docs - -- [docs] Enable row reordering on the pricing page (#31875) @DanailH -- [blog] A few improvements on date picker change (#32325) @oliviertassinari -- [docs] Emphasize how to avoid failing tests when migrating from v4 to v5 (#32159) @dwjohnston -- [docs] Revise the related projects page (#32180) @danilo-leal -- [docs] Cleanup remaining @mui/styles usages (#32313) @mnajdova -- [docs] Fix sidenav mobile color (#32324) @oliviertassinari -- [docs] Base TrapFocus style revisions and final review (#32364) @samuelsycamore -- [docs] Update the README.md to better cover the different products (#32360) @samuelsycamore -- [docs] Improve the propTypes generation and API demos' links (#32295) @mnajdova -- [docs] Add ability to display a plan icon next to a page link in nav bar (#32393) @flaviendelangle -- [docs] Change label on `FormControlLabelPlacement` (#32322) @ainatenhi -- [website] Update Diamond sponsors list (#32433) @oliviertassinari -- [website] Add privacy policy link to website's footer (#32080) @danilo-leal -- [website] Remove the designer role (#32384) @danilo-leal - -### Core - -- [core] `yarn prettier` write @oliviertassinari -- [core] Fix changelog warning message (#32240) @praveen001 -- [core] Update the proptypes scripts to support components in @mui/system (#32456) @mnajdova - -All contributors of this release in alphabetical order: @abhinav-22-tech, @ainatenhi, @DanailH, @danilo-leal, @dwjohnston, @flaviendelangle, @hbjORbj, @mnajdova, @oliviertassinari, @praveen001, @samuelsycamore, @siriwatknp, @valerii15298, @ZeeshanTamboli - -## 5.6.2 - -<!-- generated comparing v5.6.1..master --> - -_Apr 18, 2022_ - -A big thanks to the 11 contributors who made this release possible. -This release is mostly about 🐛 bug fixes and 📚 documentation improvements. - -### `@mui/material@5.6.2` - -- ​<!-- 29 -->[Autocomplete] Explain how to use getOptionLabel in free solo mode and update getOptionLabel type (#32165) @michaldudak -- ​<!-- 28 -->[Badge] Fix customization of classes (#32185) @michaldudak -- ​<!-- 03 -->[TextField] Add a workaround for Safari CSS transition scale bug (#32188) @igordanchenko - -### `@mui/system@5.6.2` - -- ​<!-- 05 -->[system] Update style function to use vars automatically if available (#32244) @mnajdova - -### `@mui/base@5.0.0-alpha.77` - -- ​<!-- 08 -->[FormControlUnstyled] Revise API (#32134) @michaldudak - -### `@mui/joy@5.0.0-alpha.24` - -- ​<!-- 07 -->[Joy] Add `Badge` component (#31401) @hbjORbj -- ​<!-- 06 -->[Joy] Fix misuse variable in `Input` (#32268) @siriwatknp - -### Docs - -- ​<!-- 27 -->[blog] Fix images for the docs separation post (#32257) @danilo-leal -- ​<!-- 25 -->[docs] Base Form Control style revisions and final review (#32309) @samuelsycamore -- ​<!-- 24 -->[docs] Base TablePagination style revisions and final review (#32178) @samuelsycamore -- ​<!-- 23 -->[docs] Revise the dark mode article (#32179) @danilo-leal -- ​<!-- 22 -->[docs] Add `aria-label` for `IconButton` (#32276) @SiarheiBobryk -- ​<!-- 21 -->[docs] Fix `borderRadius` in the docs example (#32347) @ZeeshanTamboli -- ​<!-- 20 -->[docs] Fix 404 link in the code (#32323) @oliviertassinari -- ​<!-- 19 -->[docs] Sync h1 with side nav label (#32235) @oliviertassinari -- ​<!-- 18 -->[docs] Fix SEO issues (#32282) @oliviertassinari -- ​<!-- 17 -->[docs] Fix broken link in the test contributing guide (#32283) @sirartemis -- ​<!-- 16 -->[docs] Update "How to customize" page anchor links #32315 @abaker93 -- ​<!-- 15 -->[docs] Mark `onBackdropClick` prop as deprecated in `Dialog`, `Modal` and `ModalUnstyled` components (#32297) @ZeeshanTamboli -- ​<!-- 14 -->[docs] Link to advanced components page (#32290) @siriwatknp -- ​<!-- 13 -->[docs] Sync package description with the docs (#32211) @oliviertassinari -- ​<!-- 12 -->[docs] Revise "Component theming" and "How to customize" guides (#31997) @danilo-leal -- ​<!-- 11 -->[docs] Add note in the Contributing guide about linking issues to a PR (#32174) @danilo-leal -- ​<!-- 10 -->[docs] Update RTL guide (#32242) @michaldudak -- ​<!-- 09 -->[docs] Uniformize capitalization (#32238) @oliviertassinari -- ​<!-- 02 -->[website] Improve new role template @oliviertassinari -- ​<!-- 01 -->[website] Remove a gold sponsor (#32261) @hbjORbj -- ​<!-- 24 -->[website] Mark DataGrid Column spanning done on Pricing page (#32305) @cherniavskii - -### Core - -- ​<!-- 31 -->[core] Remove unecessary div (#32237) @oliviertassinari -- ​<!-- 30 -->[core] Revert #32229 (#32262) @michaldudak -- ​<!-- 04 -->[test] Fix running unit tests on Windows (#32260) @michaldudak - -All contributors of this release in alphabetical order: @abaker93, @cherniavskii, @danilo-leal, @hbjORbj, @igordanchenko, @michaldudak, @mnajdova, @oliviertassinari, @samuelsycamore, @SiarheiBobryk, @sirartemis, @siriwatknp, @ZeeshanTamboli - -## 5.6.1 - -<!-- generated comparing v5.6.0..master --> - -_Apr 11, 2022_ - -A big thanks to the 8 contributors who made this release possible. -This release is mostly about 🐛 bug fixes and 📚 documentation improvements. - -### `@mui/material@5.6.1` - -- [Grow] Extend Safari CSS transition bug workaround on WebKit browsers (#32202) @igordanchenko -- [Link] Fix style overrides 5.6.0 regression (#32182) @siriwatknp -- [Select] Bug when the first child is a ListSubheader (#27299) @DouglasPds - -### `@mui/base@5.0.0-alpha.76` - -- [ButtonUnstyled] Allow receiving focus when disabled (#32090) @michaldudak - -### Docs - -- [blog] Share what's changed about the new docs structure (#32044) @danilo-leal -- [docs] Format number icons search (#32239) @oliviertassinari -- [docs] Fix small external links issue (#32212) @oliviertassinari -- [docs] Make sidenav crawlable (#32241) @oliviertassinari -- [docs] Base Badge style revisions and final review (#32098) @samuelsycamore -- [docs] Fix wrong url (#32208) @siriwatknp -- [docs] Fix date-pickers redirects (#32207) @siriwatknp -- [docs] Add notification for the doc restructure and date pickers update (#32195) @siriwatknp -- [docs] Fix 404 from `ahrefs` report (#32206) @siriwatknp -- [docs] Remove notifications temporary (#32192) @siriwatknp -- [docs] Redirect to new urls (#32048) @siriwatknp -- [docs] Update Learn page copy and resource list (#31989) @samuelsycamore -- [website] Fix wrong MUI X installation instruction link @oliviertassinari -- [website] Revise homepage copy below the hero section (#31283) @samuelsycamore -- [website] Revise homepage Hero copy for more clarity (#31212) @samuelsycamore -- [website] Give up on promoting roles in our docs @oliviertassinari - -### Core - -- [core] Fix misleading types range (#32236) @oliviertassinari -- [core] Small polish on the product name (#32199) @oliviertassinari - -All contributors of this release in alphabetical order: @danilo-leal, @DouglasPds, @igordanchenko, @l10nbot, @michaldudak, @oliviertassinari, @samuelsycamore, @siriwatknp - -## 5.6.0 - -<!-- generated comparing v5.5.3..master --> - -_Apr 5, 2022_ - -A big thanks to the 15 contributors who made this release possible. Here are some highlights ✨: - -- 🧰 Update peer dependencies to support React 18 (#32063) @eps1lon -- 🚀 Added the experimental `CssVarsProvider` in `@mui/material` for generating theme CSS variables (#31138) @mnajdova -- 📣 Moved date and time pickers from the lab to MUI X (#31984) @flaviendelangle -- Several 🐛 bug fixes and 📚 documentation improvements - -### `@mui/material@5.6.0` - -- ​<!-- 25 -->[CssVarsProvider] Add experimental CssVarsProvider in @mui/material (#31138) @mnajdova -- ​<!-- 06 -->[Link] Fix `sx` color to support callback (#32123) @siriwatknp -- ​<!-- 05 -->[Link] Fix color transformation (#32045) @siriwatknp -- ​<!-- 04 -->[ListItemButton] Specified width so that text would ellide (#32083) @MatthijsMud -- ​<!-- 03 -->[TablePagination] Fixed the etEE locale (#32052) @raigoinabox - -### `@mui/base@5.0.0-alpha.75` - -- ​<!-- 31 -->[Badge] Simplify unstyled API (#31974) @michaldudak - -### `@mui/codemod@5.6.0` - -- ​<!-- 29 -->[codemod] Add v5.0.0/date-pickers-moved-to-x codemod (#31373) @flaviendelangle - -### `@mui/lab@5.0.0-alpha.76` - -- ​<!-- 24 -->[DatePicker] Remove date and time pickers from the lab (#31984) @flaviendelangle - -### `@mui/joy@5.0.0-alpha.22` - -- ​<!-- 07 -->[Joy] Add `Card` components (#32027) @siriwatknp - -### Docs - -- ​<!-- 30 -->[blog] New article for the date pickers migration to X (#31831) @flaviendelangle -- ​<!-- 33 -->[docs] Base Menu style revisions and final review (#32097) @samuelsycamore -- ​<!-- 32 -->[docs] Base Select style revisions and final review (#32095) @samuelsycamore -- ​<!-- 31 -->[docs] Base Input style revisions and final review (#32096) @samuelsycamore -- ​<!-- 30 -->[docs] Base Slider style revisions and final review (#32140) @samuelsycamore -- ​<!-- 29 -->[docs] Base Modal style revisions and final review (#32093) @samuelsycamore -- ​<!-- 28 -->[docs] Add page for CSS variables support in @mui/material (#32050) @mnajdova -- ​<!-- 27 -->[docs] Add TSS support for theme style overrides (#31918) @garronej -- ​<!-- 23 -->[docs] Simplify customization examples in ButtonUnstyled demos (#32092) @michaldudak -- ​<!-- 22 -->[docs] Fix linking issues for the redirects (#32101) @siriwatknp -- ​<!-- 21 -->[docs] Create the FormControl page (#32073) @michaldudak -- ​<!-- 20 -->[docs] Remove trap-focus from the navigation (#32079) @psjishnu -- ​<!-- 19 -->[docs] Add date-pickers product identifier (#32076) @siriwatknp -- ​<!-- 18 -->[docs] Move SwitchUnstyled docs to the Base space (#31964) @michaldudak -- ​<!-- 17 -->[docs] Add docs page for unstyled popper (#31813) @siriwatknp -- ​<!-- 16 -->[docs] Copy TextareaAutosize docs to Base (#32034) @michaldudak -- ​<!-- 15 -->[docs] Add react-hook-form-mui to Complementary projects #32015 @TkaczykAdam -- ​<!-- 14 -->[docs] Improve the translation experience (#32021) @oliviertassinari -- ​<!-- 13 -->[docs] Add small size Select demo (#32060) @ivan-ngchakming -- ​<!-- 12 -->[docs] Correct typos (#32029) @apeltop -- ​<!-- 11 -->[docs] Create SliderUnstyled docs (#31850) @michaldudak -- ​<!-- 10 -->[docs] Create TablePaginationUnstyled docs (#32018) @michaldudak -- ​<!-- 09 -->[docs] Move SelectUnstyled docs to the Base space (#31816) @michaldudak -- ​<!-- 08 -->[docs] Create the TabsUnstyled docs (#32023) @michaldudak -- ​<!-- 02 -->[website] The studio finally has a name, use it (#32105) @oliviertassinari -- ​<!-- 01 -->[website] Disable job ad @oliviertassinari - -### Core - -- ​<!-- 28 -->[core] Update peer deps to support React 18 (#32063) @eps1lon -- ​<!-- 27 -->[core] Fix running docs:api on Windows (#32091) @michaldudak -- ​<!-- 26 -->[core] Fix api build script for Base UI (#32081) @siriwatknp - -All contributors of this release in alphabetical order: @apeltop, @eps1lon, @flaviendelangle, @garronej, @ivan-ngchakming, @m4theushw, @MatthijsMud, @michaldudak, @mnajdova, @oliviertassinari, @psjishnu, @raigoinabox, @samuelsycamore, @siriwatknp, @TkaczykAdam - -## 5.5.3 - -<!-- generated comparing v5.5.2..master --> - -_Mar 28, 2022_ - -A big thanks to the 17 contributors who made this release possible. Here are some highlights ✨: - -- ♿️ improved the a11y on some docs demos -- Several 🐛 bug fixes and 📚 documentation improvements - -### `@mui/material@5.5.3` - -- ​<!-- 32 -->[ButtonBase] Start ripple only after mount (#31950) @m4theushw -- ​<!-- 11 -->[FormControlLabel] Fix label prop type to be in-line with other label prop types (#31139) @jannes-io -- ​<!-- 10 -->[Grow] Add a workaround for Safari 15.4 CSS transition bug (#31975) @igordanchenko - -### `@mui/codemod@5.5.3` - -- ​<!-- 31 -->[codemod] Fix variant prop placement (#31990) @ryancogswell - -### `@mui/utils@5.5.3` - -- ​<!-- 02 -->[utils] Improve type inference of useForkRef (#31845) @eps1lon - -### `@mui/base@5.0.0-alpha.74` - -#### Breaking changes - -- ​<!-- 34 -->[base] Remove `BackdropUnstyled` component (#31923) @mnajdova - - The `BackdropUnstyled` component was removed from the `@mui/base` package, as it did not have any specific logic, except adding an `aria-hidden` attribute on the div it rendered. This is not enough to justify it's existence in the base package. Here is an example alternative component you can use: - - ```tsx - const BackdropUnstyled = React.forwardRef<HTMLDivElement, { open?: boolean; className: string }>( - (props, ref) => { - const { open, className, ...other } = props; - return <div className={clsx({ 'MuiBackdrop-open': open }, className)} ref={ref} {...other} />; - }, - ); - ``` - -- ​<!-- 03 -->[FocusTrap] Move docs to Base and drop the Unstyled prefix (#31954) @michaldudak - - Removed the `Unstyled_` prefix from the Base export (it remains in the Material UI export, though). - - ```diff - -import { Unstyled_TrapFocus } from '@mui/base'; - +import { TrapFocus } from '@mui/base'; - - // or - - -import TrapFocus from '@mui/base/Unstyled_TrapFocus'; - +import TrapFocus from '@mui/base/TrapFocus'; - ``` - -#### Changes - -- ​<!-- 33 -->[base] Add @mui/types to dependencies (#31951) @bicstone - -### `@mui/joy@5.0.0-alpha.21` - -- ​<!-- 09 -->[Joy] Add `AvatarGroup` component (#31980) @siriwatknp -- ​<!-- 07 -->[Joy] Miscellaneous fixes (#31873) @siriwatknp -- ​<!-- 08 -->[Joy] Miscellaneous fixes 2 (#31971) @siriwatknp - -### Docs - -- ​<!-- 27 -->[docs] Improve the a11y on the hover rating demo (#31970) @mnajdova -- ​<!-- 26 -->[docs] Improve a11y on the `SplitButton` demo (#31969) @mnajdova -- ​<!-- 25 -->[docs] Improve the color description in the API pages (#30976) @mnajdova -- ​<!-- 24 -->[docs] Add docs page for unstyled Modal (#31417) @mnajdova -- ​<!-- 23 -->[docs] Add InputUnstyled docs (#31881) @mnajdova -- ​<!-- 22 -->[docs] Remove "Work in biotech" from the showcase (#31942) @oliviertassinari -- ​<!-- 21 -->[docs] Fix in-house ad for the design kits (#31965) @oliviertassinari -- ​<!-- 20 -->[docs] Fix the documentation for filterOptions in Autocomplete API page (#31416) @santhoshbala0178 -- ​<!-- 19 -->[docs] Update href for 'TypeScript guide on theme customization' (#31880) @NickFoden -- ​<!-- 18 -->[docs] Fix the CSS Modules example in the Interoperability page (#31935) @WilsonNet -- ​<!-- 17 -->[docs] Fix small typo in the `styled()` utility page (#31967) @jason1985 -- ​<!-- 16 -->[docs] Update mui-x on material-ui navigation (#31810) @siriwatknp -- ​<!-- 15 -->[docs] Copy ClickAwayListener docs to Base (#31878) @michaldudak -- ​<!-- 14 -->[docs] Refine the redirects (#31939) @siriwatknp -- ​<!-- 13 -->[docs] Fix TOC layout for large screen (#31953) @siriwatknp -- ​<!-- 12 -->[examples] Update remix example to not use NODE_ENV guard for `LiveReload` (#31269) @eswarclynn -- ​<!-- 06 -->[NoSsr] Copy docs to the Base space (#31956) @michaldudak -- ​<!-- 05 -->[Portal] Copy Portal docs to the Base space (#31959) @michaldudak -- ​<!-- 01 -->[website] Remove X-Frame-Options @oliviertassinari -- ​<!-- 35 -->Revert "[website] Remove X-Frame-Options" @oliviertassinari - -### Core - -- ​<!-- 30 -->[core] Fixes error in changelog generator for item sorting/padding (#30088) @dimitropoulos -- ​<!-- 29 -->[core] Fix typo in issue template @oliviertassinari -- ​<!-- 28 -->[core] Replace deprecated String.prototype.substr() (#31806) @CommanderRoot -- ​<!-- 04 -->[test] Add tests for component using `StandardProps` and polymorphic components (#31945) @mnajdova - -All contributors of this release in alphabetical order: @bicstone, @CommanderRoot, @dimitropoulos, @eps1lon, @eswarclynn, @igordanchenko, @jannes-io, @jason1985, @m4theushw, @michaldudak, @mnajdova, @NickFoden, @oliviertassinari, @ryancogswell, @santhoshbala0178, @siriwatknp, @WilsonNet - -## 5.5.2 - -<!-- generated comparing v5.5.1..master --> - -_Mar 21, 2022_ - -A big thanks to the 7 contributors who made this release possible. This is a small release focused on some 🐛 bug fixes and 📚 documentation improvements. - -### `@mui/material@5.5.2` - -- ​<!-- 04 -->[Popper] Expose the `sx` prop (#31833) @ivan-ngchakming - -### `@mui/joy@5.0.0-alpha.20` - -- ​<!-- 06 -->[Joy] Add default color to `Input` and `ListItemButton` (#31826) @siriwatknp -- ​<!-- 05 -->[Joy] Add Avatar component (#31303) @hbjORbj - -### `@mui/base@5.0.0-alpha.73` - -- ​<!-- 03 -->[SliderUnstyled] Fix dragging on disabled sliders (#31882) @mnajdova - -### `@mui/styled-engine-sc@5.5.2` - -- ​<!-- 02 -->[styled-engine-sc] GlobalStylesProps inconsistent between the different packages (#31814) @mnajdova - -### Docs - -- ​<!-- 15 -->[data-grid] Fix print export feature (#31807) @oliviertassinari -- ​<!-- 14 -->[docs] Move BadgeUnstyled docs to Base space (#31872) @michaldudak -- ​<!-- 13 -->[docs] Solve duplication of content (#31917) @oliviertassinari -- ​<!-- 12 -->[docs] Fix side nav capitalization of API (#31916) @oliviertassinari -- ​<!-- 11 -->[docs] Use TypeScript demos by default (#31808) @oliviertassinari -- ​<!-- 10 -->[docs] New search experience for multiple products (#31811) @siriwatknp -- ​<!-- 09 -->[docs] Make LTS searchable (#31804) @oliviertassinari -- ​<!-- 08 -->[docs] Fix demo filename on zh markdown (#31790) @nnmax -- ​<!-- 01 -->[website] Highlight the date picker (#31889) @oliviertassinari - -### Core - -- ​<!-- 07 -->[core] Add tests for Avatar component (#31829) @hbjORbj - -All contributors of this release in alphabetical order: @hbjORbj, @ivan-ngchakming, @michaldudak, @mnajdova, @nnmax, @oliviertassinari, @siriwatknp - -## 5.5.1 - -<!-- generated comparing v5.5.0..master --> - -_Mar 14, 2022_ - -A big thanks to the 23 contributors who made this release possible. Here are some highlights ✨: - -- 📊 2021 survey results post by @danilo-leal (#30999) -- Several 🐛 bug fixes and 📚 documentation improvements - -### @mui/material@5.5.1 - -- [Fab] Add z-index (#30842) @issamElmohadeb098 -- [Grid] Fix columns of nested container (#31340) @boutahlilsoufiane -- [i10n] Update italian locale (#30974) @SalvatoreMazzullo -- [Pagination] Fix type of UsePaginationItem["page"] (#31295) @aaronadamsCA -- [Popper] Allow setting default props in a theme (#30118) @hafley66 -- [TextField] fix disappearing border in Safari (#31406) @krysia1 - -### @mui/joy@5.0.0-alpha.19 - -- [Joy] Support horizontal List (#31620) @siriwatknp -- [Joy] Add icon & label `Switch` examples (#31359) @siriwatknp -- [Joy] Add `TextField` component (#31299) @siriwatknp -- [Joy] Add `--Icon-fontSize` to components (#31360) @siriwatknp -- [Joy] Add `Checkbox` component (#31273) @siriwatknp - -### Docs - -- [blog] 2021 survey results post (#30999) @danilo-leal -- [docs] Add Macedonian translation (#31402) @theCuriousOne -- [docs] Fix API page table styles in Safari (#31696) @aaarichter -- [docs] Fix SEO issues (#31505) @oliviertassinari -- [docs] Fix Link leak of Next.js props (#31418) @oliviertassinari -- [docs] Add "Work in biotech" to showcase (#31711) @klyburke -- [docs] Fix docs site crash on iOS Safari 12 (#31458) @badalsaibo -- [docs] Fix search icons crash (#31651) @juanpc10 -- [docs] Remove unnecessary await in e2e-tests (#31767) @siriwatknp -- [docs] Fix source code links on the Templates page (#31425) @danilo-leal -- [docs] Adjust Stack's basic usage demo (#31423) @danilo-leal -- [docs] Migrate button demos to base (#31395) @siriwatknp -- [docs] Fix y-axis unit used in the responsive font sizes chart (#31424) @aaarichter -- [docs] Remove joy mockup pages (#31412) @siriwatknp -- [docs] Fix the statement that styleOverrides are added by default (#31257) @mnajdova -- [docs] Refine the product identifier menu (#31262) @danilo-leal -- [docs] Fix Search crash (#31386) @reckter -- [docs] Update TextField multiline description (#31291) @jontewks -- [docs] Add gap theme mapping in MUI System properties table (#31382) @danilo-leal -- [docs] Test products search (#31351) @siriwatknp -- [docs] Fix GitHub source links in the demo toolbar (#31339) @PunitSoniME -- [docs] Add Algolia verification code to robot.txt (#31356) @siriwatknp -- [examples] Ignore tsbuildinfo with Next.js (#31460) @B0und -- [website] Add new gold sponsor (#31354) @hbjORbj -- [website] Update Ukraine support link (#31378) @samuelsycamore - -### Core - -- [core] Simplify anchor link (#31419) @oliviertassinari -- [core] Revert unrelated changes in #31354 @oliviertassinari -- [test] Upgrade CircleCI convenience image (#31394) @m4theushw -- [typescript] Simplify display of slot props types (#31240) @michaldudak - -All contributors of this release in alphabetical order: @aaarichter, @aaronadamsCA, @B0und, @badalsaibo, @boutahlilsoufiane, @danilo-leal, @hafley66, @hbjORbj, @issamElmohadeb098, @jontewks, @juanpc10, @klyburke, @krysia1, @m4theushw, @michaldudak, @mnajdova, @oliviertassinari, @PunitSoniME, @reckter, @SalvatoreMazzullo, @samuelsycamore, @siriwatknp, @theCuriousOne - -## 5.5.0 - -<!-- generated comparing v5.4.4..master --> - -_Mar 7, 2022_ - -A big thanks to the 16 contributors who made this release possible. Here are some highlights ✨: - -- ♿️ made the `Autocomplete` conform to [ARIA 1.2 combobox](https://www.w3.org/TR/wai-aria-1.2/#combobox) (#30601) @EdmundMai -- Several 🐛 bug fixes and 📚 documentation improvements - -### `@mui/material@5.5.0` - -#### Breaking change - -- ​<!-- 24 -->[ClassNameGenerator] Prevent all `base` imports (#31297) @siriwatknp - - `unstable_ClassNameGenerator` has been moved from `utils` to `className` folder to prevent all Base UI module imports. If you use the module, please update the import as suggested in the diff below: - - ```diff - -import { unstable_ClassNameGenerator } from '@mui/material/utils'; - +import { unstable_ClassNameGenerator } from '@mui/material/className'; - ``` - -#### Changes - -- ​<!-- 28 -->[Autocomplete] Fix failing unit tests (#31302) @michaldudak -- ​<!-- 27 -->[Autocomplete] Have the screen reader announce when autocomplete is open and closed (#30601) @EdmundMai -- ​<!-- 26 -->[AvatarGroup] Fix misalignment with non-default spacing (#31165) @sjdemartini -- ​<!-- 15 -->[Drawer] Adjustments to the mini variant to improve UI/UX (#31267) @siriwatknp -- ​<!-- 04 -->[Select] Add extending `OutlinedInputProps` by SelectProps (#31209) @jrozbicki - -### `@mui/icons-material@5.5.0` - -- ​<!-- 13 -->[icons] Sync new Google Material Icons (#30766) @simonecervini - -### `@mui/codemod@5.5.0` - -- ​<!-- 23 -->[codemod] Fix top level imports codemod (#31308) @mnajdova - -### `@mui/lab@5.0.0-alpha.72` - -- ​<!-- 07 -->[LoadingButton] Fix padding of loading icon in small button (#31113) @PunitSoniME - -### `@mui/base@5.0.0-alpha.71` - -- ​<!-- 05 -->[MenuUnstyled] Create MenuUnstyled and useMenu (#30961) @michaldudak -- ​<!-- 03 -->[SelectUnstyled] Prevent window scrolling after opening (#31237) @michaldudak - -### `@mui/joy@5.0.0-alpha.18` - -- ​<!-- 12 -->[Joy] Make Icon `fontSize` adaptable to its parent (#31268) @siriwatknp -- ​<!-- 11 -->[Joy] Add `Link` component (#31175) @hbjORbj -- ​<!-- 10 -->[Joy] Improve `Sheet` tests (#31241) @hbjORbj -- ​<!-- 09 -->[Joy] Improve SvgIcon tests (#31242) @hbjORbj - -### `@mui/material-next@6.0.0-alpha.26` - -- ​<!-- 06 -->[material-next] Mark @mui/material as a dependency (#31270) @siriwatknp - -### Docs - -- ​<!-- 21 -->[docs] Remove career pages from translation (#31346) @oliviertassinari -- ​<!-- 20 -->[docs] Fix JS files overloading (#31341) @oliviertassinari -- ​<!-- 19 -->[docs] Add banner in solidarity of Ukraine (#31275) @danilo-leal -- ​<!-- 18 -->[docs] Fix maxWidth of scrollable Tabs demos (#31285) @danilo-leal -- ​<!-- 17 -->[docs] Fix icon linking implementation concurrent safe (#30428) @Janpot -- ​<!-- 16 -->[docs] Follow up new doc space issues (#31251) @siriwatknp -- ​<!-- 29 -->[examples] Add `@types/node` to Next.js TypeScript starter (#30918) @Daggy1234 -- ​<!-- 14 -->[examples] Fix import ThemeProvider from correct package in remix-wit… (#30981) @nnecec -- ​<!-- 25 -->[blog] Simplify the labels (#30921) @oliviertassinari -- ​<!-- 08 -->[l10n] Add Croatian (hr-HR) and Serbian (sr-RS) translation (#30906) @m14d3n - -### Core - -- ​<!-- 23 -->[core] Fix running markdownlint on Windows (#31352) @michaldudak -- ​<!-- 22 -->[core] Fix the stylelint script on Windows (#31281) @mnajdova -- ​<!-- 02 -->[test] Fix buildApiUtils tests on Windows (#31304) @michaldudak -- ​<!-- 01 -->[test] Remove legacyRoot option from test renderer (#31284) @eps1lon - -All contributors of this release in alphabetical order: @Daggy1234, @danilo-leal, @EdmundMai, @eps1lon, @hbjORbj, @Janpot, @jrozbicki, @m14d3n, @michaldudak, @mnajdova, @nnecec, @oliviertassinari, @PunitSoniME, @simonecervini, @siriwatknp, @sjdemartini - -## 5.4.4 - -<!-- generated comparing v5.4.3..master --> - -_Feb 28, 2022_ - -A big thanks to the 17 contributors who made this release possible. Here are some highlights ✨: - -- ✨ New `Input` and `Sheet` components were added in the experimental Joy design system by @hbjORbj (#31124, #31086) @hbjORbj -- Several 🐛 bug fixes and 📚 documentation improvements - -### `@mui/material@5.4.4` - -- ​<!-- 28 -->[Autocomplete] Have Autocomplete with multiline textfield log a warning instead of an error (#30680) @iclaude3 -- ​<!-- 27 -->[Chip] Fix ellipsis when the children is too long (#31087) @PunitSoniME -- ​<!-- 14 -->[Input] Export InputBase's classes from the classes const (#31186) @mnajdova -- ​<!-- 29 -->[TextField] Fix Horizontal scroll when label too long (#31187) @RedHeadphone -- ​<!-- 08 -->[styles] Fix typo in import error (#31167) @davwheat - -### `@mui/system@5.4.4` - -- ​<!-- 07 -->[system] Fix executing server-side Emotion component as function interpolation 2 (#31024) @Andarist -- ​<!-- 06 -->[system] Fix sx prop types when CSS variables are used with nested selectors (#31163) @mnajdova -- ​<!-- 05 -->[system] Fix `CssVarsProvider` theme mutation (#31148) @siriwatknp - -### `@mui/codemod@5.4.4` - -- ​<!-- 26 -->[codemods] Add v5.0.0/top-level-imports codemod (#31195) @greengiraffe - -### `@mui/base@5.0.0-alpha.70` - -- ​<!-- 31 -->[SelectUnstyled, MultiSelectUnstyled, ButtonUnstyled] Export additional types to make customization easier (#31172) @michaldudak - -### `@mui/joy@5.0.0-alpha.17` - -- ​<!-- 13 -->[Joy] Add nested list components (#31159) @siriwatknp -- ​<!-- 12 -->[Joy] Improve color customization on `Switch` (#31137) @siriwatknp -- ​<!-- 11 -->[Joy] Add `Sheet` component (#31124) @hbjORbj -- ​<!-- 10 -->[Joy] add `Input` component (#31086) @siriwatknp -- ​<!-- 09 -->[Joy] Fix Button missing slot type (#31166) @siriwatknp - -### Docs - -- ​<!-- 22 -->[docs] Fix 404 link to the blog (#31234) @oliviertassinari -- ​<!-- 21 -->[docs] Use `material-ui` for product name (#31200) @siriwatknp -- ​<!-- 20 -->[docs] Add Base installation page (#30969) @siriwatknp -- ​<!-- 19 -->[docs] Use new Algolia app for new structure (#31178) @siriwatknp -- ​<!-- 18 -->[docs] Typo in the `FormControl` API documentation (#31169) @bonellia -- ​<!-- 17 -->[docs] Fix typo in Stack documentation (#31176) @adriancampos -- ​<!-- 16 -->[docs] Update interoperability.md broken tailwind links (#31182) @robertwt7 -- ​<!-- 15 -->[docs] Add missing import into tss-react migration guide (#31162) @sviande -- ​<!-- 03 -->[website] The role is filled (#31216) @oliviertassinari -- ​<!-- 02 -->[website] Revise the row grouping blog post (#31101) @samuelsycamore -- ​<!-- 01 -->[website] Fix a few SEO issues (#31150) @oliviertassinari - -### Core - -- ​<!-- 30 -->[core] Add group for the @fortawesome dependencies (#31193) @mnajdova -- ​<!-- 25 -->[core] Update playwright docker to match the specified version (#31236) @siriwatknp -- ​<!-- 24 -->[core] Remove parallel on buildTypes (#31189) @siriwatknp -- ​<!-- 23 -->[core] Fix propTypes generation for optional any props (#31141) @m4theushw -- ​<!-- 04 -->[typescript] Remove variants deprecation (#31239) @siriwatknp - -All contributors of this release in alphabetical order: @adriancampos, @Andarist, @bonellia, @davwheat, @greengiraffe, @hbjORbj, @iclaude3, @m4theushw, @michaldudak, @mnajdova, @oliviertassinari, @PunitSoniME, @RedHeadphone, @robertwt7, @samuelsycamore, @siriwatknp, @sviande - -## 5.4.3 - -<!-- generated comparing v5.4.2..master --> - -_Feb 21, 2022_ - -A big thanks to the 14 contributors who made this release possible. Here are some highlights ✨: - -- 🛠 @hbjORbj made components use theme duration/easing values by default (#30894) -- A meaningful number of 🐛 bug fixes and 📚 documentation improvements - -### `@mui/material@5.4.3` - -- ​<!-- 18 -->[ButtonBase] Fix typo (#31135) @Jastor11 -- ​<!-- 05 -->[Stepper] Export useStepContext (#31021) @michaldudak -- ​<!-- 04 -->[Transitions] Some components do not use transition duration/easing values from theme (#30894) @hbjORbj - -### `@mui/icons-material@5.4.3` - -- ​<!-- 11 -->[icons] Add "circle" icon synonyms (#31118) @gnowland - -### `@mui/joy@5.0.0-alpha.16` - -- ​<!-- 10 -->[Joy] `List` second iteration (#31134) @siriwatknp -- ​<!-- 09 -->[Joy] Fix typings (#31120) @siriwatknp -- ​<!-- 08 -->[Joy] Add initial `List` components (#30987) @siriwatknp - -### Docs - -- ​<!-- 19 -->[website] Improve full-stack role job description (#31160) @Janpot -- ​<!-- 14 -->[docs] Fix typo of migration guides v4 (#31136) @pppp606 -- ​<!-- 13 -->[docs] Update on the support page to account for v4 LTS support (#31029) @danilo-leal -- ​<!-- 12 -->[docs] Fix small typo in chips.md (#31092) @cameliaben -- ​<!-- 07 -->[l10n] Add it-IT translation for labelDisplayedRows (#31131) @frab90 -- ​<!-- 06 -->[l10n] Add pl-PL translation for labelDisplayedRows (#31088) @ThomasTheHuman -- ​<!-- 03 -->[website] Sync MUI X table feature (#30913) @alexfauquette -- ​<!-- 02 -->[website] Prefill source in job application links (#31036) @oliviertassinari -- ​<!-- 01 -->[website] Fix a grammar mistake (#31099) @huyenltnguyen - -### Core - -- ​<!-- 17 -->[core] Add jsx, html, css and prisma to prettier extensions (#31161) @Janpot -- ​<!-- 16 -->[core] Allow to run material-ui.com/store alongside mui.com/store (#31065) @oliviertassinari -- ​<!-- 15 -->[core] Polish design tokens (#31095) @oliviertassinari - -All contributors of this release in alphabetical order: @alexfauquette, @cameliaben, @danilo-leal, @frab90, @gnowland, @hbjORbj, @huyenltnguyen, @Janpot, @Jastor11, @michaldudak, @oliviertassinari, @pppp606, @siriwatknp, @ThomasTheHuman - -## 5.4.2 - -_Feb 15, 2022_ - -A big thanks to the 16 contributors who made this release possible. Here are some highlights ✨: - -- 🛠 @sydneyjodon-wk improved propTypes of the ToggleButton components (#30883) -- Several 🐛 bug fixes and 📚 documentation improvements - -### `@mui/material@5.4.2` - -- [Select] Allow customizing Select based on its variant (#30788) @michaldudak -- [Portal] Re-export 'Portal' in material (#31003) @liradb2000 -- [ToggleButton] Add prop types for `onClick` and `onChange` (#30883) @sydneyjodon-wk -- [typescript] Added TypeText declaration to the exports file (#30890) @agauravdev - -### `@mui/system@5.4.2` - -- [system] Fix broken behavior when breakpoints input are not ordered (#30996) @mnajdova - -### `@mui/lab@5.0.0-alpha.69` - -- [DatePicker] Fix passing clearable prop (#30786) @alisasanib - -### `@mui/joy@5.0.0-alpha.15` - -- [Joy] Improve variant customization experience (#30878) @siriwatknp -- [Joy] Make `sx` prop work in Joy (#30955) @siriwatknp - -### Framer - -- [design] Remove framer components (#30983) @mbrookes -- [design] Remove framer leftovers (#31070) @michaldudak - -### Docs - -- [docs] Update installation guide of the icons package (#31026) @huyenltnguyen -- [docs] Improve the indication for the legacy APIs (#30995) @mnajdova -- [docs] Specify which props are added in the default `shouldForwardProp` option (#30978) @mnajdova -- [docs] Fix layout shift on loading (#31017) @oliviertassinari -- [docs] Increase scroll affordance in wide tables (#30713) @danilo-leal -- [docs] Fix look & feel of the Masonry demos (#30971) @oliviertassinari -- [docs] Improve Base component demos (#30884) @danilo-leal -- [docs] Use full product names (Material UI, MUI System) (#30960) @oliviertassinari -- [docs] Prefer useEnhancedEffect to avoid server side warnings (#30977) @mnajdova -- [docs] Fix force redirection to a different locale (#30967) @oliviertassinari -- [docs] Add live Tailwind CSS demo (#30966) @oliviertassinari -- [website] Add banner for promoting priority open roles (#31076) @danilo-leal -- [website] Open Full-stack Engineer role for studio (#31038) @prakhargupta1 -- [website] Minor security improvements (#31062) @oliviertassinari -- [website] Improve title of open roles (#30963) @DanailH -- [website] Add BIMI avatar (#30444) @oliviertassinari -- [website] Add Sycamore to About page (#31000) @samuelsycamore - -### Core - -- [benchmark] Add missing dependency (#30994) @michaldudak -- [core] Bump date-io version (#31016) @michaldudak -- [core] Fix typo in useSlider (#31061) @ryohey -- [core] Remove unused draft-js types package (#30993) @michaldudak -- [test] Test if certain Base members are exported from Material UI (#31067) @michaldudak -- [core] Remove dead code (#31064) @oliviertassinari - -All contributors of this release in alphabetical order: @agauravdev, @alisasanib, @DanailH, @danilo-leal, @huyenltnguyen, @l10nbot, @liradb2000, @mbrookes, @michaldudak, @mnajdova, @prakhargupta1, @oliviertassinari, @ryohey, @samuelsycamore, @siriwatknp, @sydneyjodon-wk - -## 5.4.1 - -<!-- generated comparing v5.4.0..master --> - -_Feb 8, 2022_ - -A big thanks to the 24 contributors who made this release possible. Here are some highlights ✨: - -- ♿️ Snackbar messages are now announced by NVDA when using Firefox (#30774) @eps1lon -- Several 🐛 bug fixes and 📚 documentation improvements. - -### `@mui/material@5.4.1` - -- ​<!-- 37 -->[AvatarGroup] Enable targeting of additional Avatar when max props is passed (#30794) @mogrady88 -- ​<!-- 36 -->[Badge] Fix showzero and invisible condition (#30899) @alisasanib -- ​<!-- 35 -->[ButtonBase] Expose ref to TouchRipple (#30901) @m4theushw -- ​<!-- 15 -->[Fab] Add support for the default theme colors (#30846) @alisasanib -- ​<!-- 11 -->[SelectInput] Only attach click handler to label if a labelId is passed (#30239) @johsunds -- ​<!-- 09 -->[Snackbar] Ensure messages are announced in NVDA+FF (#30774) @eps1lon - -### `@mui/base@5.0.0-alpha.68` - -- ​<!-- 10 -->[SelectUnstyled] Improve exported types (#30895) @michaldudak - -### `@mui/lab@5.0.0-alpha.68` - -- ​<!-- 12 -->[Pickers] Fix `onDismiss` handler in `MobileDatePicker` (#30768) @Ashish2097 -- ​<!-- 06 -->[TimePicker] Add font family for clock numbers (#30738) @alisasanib - -### `@mui/joy@5.0.0-alpha.14` - -- ​<!-- 14 -->[Joy] Add `IconButton` component (#30864) @siriwatknp -- ​<!-- 13 -->[Joy] Use icon inside a Button (#30803) @siriwatknp - -### Docs - -- ​<!-- 16 -->[examples] Fix vitejs example and improve HMR (#30897) @mihailgaberov -- ​<!-- 33 -->[docs] Improve autocomplete "limit tags" demo (#30910) @danilo-leal -- ​<!-- 34 -->[docs] Sync translations with Crowdin (#30950) @l10nbot -- ​<!-- 38 -->[docs] Improve description of the disableRestoreFocus prop of the `TrapFocus` (#30912) @flaviendelangle -- ​<!-- 32 -->[docs] Remove ul with div children and replace with nav element (#30534) @joeframbach -- ​<!-- 31 -->[docs] Add Saleor to showcase (#30924) @cherniavskii -- ​<!-- 30 -->[docs] Include JSS in styling solution interoperability guide (#30736) @garronej -- ​<!-- 29 -->[docs] Fix contents of link-underline-hover (#30904) @pppp606 -- ​<!-- 28 -->[docs] Fix markdown table format (#30947) @oliviertassinari -- ​<!-- 27 -->[docs] Add missing import to RTL guide (#30891) @CFarhad -- ​<!-- 26 -->[docs] Fix WithStyles import statement for @mui/styles (#30942) @altruity -- ​<!-- 25 -->[docs] Fix broken roadmap table (#30943) @cherniavskii -- ​<!-- 24 -->[docs] Fix broken URL in "Edit this page" button (#30923) @cherniavskii -- ​<!-- 23 -->[docs] Migrate content to the new location (#30757) @siriwatknp -- ​<!-- 22 -->[docs] Fix the link to the Vite.js example project (#30872) @GneyHabub -- ​<!-- 21 -->[docs] Clarify the minimum configuration for TypeScript (#30790) @mnajdova -- ​<!-- 20 -->[docs] Clarify what the name of @mui/material is (#30866) @oliviertassinari -- ​<!-- 19 -->[docs] Remove migration from the releases page (#30863) @mnajdova -- ​<!-- 18 -->[docs] Update Instructions for Google Maps Autocomplete (#30849) @kjschabra -- ​<!-- 17 -->[docs] Hotfix notification (#30862) @siriwatknp -- ​<!-- 04 -->[website] Sample GA to avoid hit limit (#30919) @oliviertassinari -- ​<!-- 03 -->[website] Hide scrollbars of hero containers (#29474) @theiliad -- ​<!-- 02 -->[website] Polishing spacing and other small things (#30828) @danilo-leal -- ​<!-- 01 -->[website] Close the Developer Advocate role (#30867) @oliviertassinari - -### Core - -- ​<!-- 37 -->[core] Batch small fixes (#30952) @oliviertassinari -- ​<!-- 34 -->[core] Rename the GitHub org (#30944) @oliviertassinari -- ​<!-- 33 -->[core] Fix propTypes in components where OverridableStringUnion is used (#30682) @paales -- ​<!-- 08 -->[test] Codify the difference between keyup and keydown in SelectUnstyled (#30857) @eps1lon -- ​<!-- 07 -->[test] Fix typo (#30841) @caioagiani -- ​<!-- 05 -->[utils] Use built-in hook when available for useId (#30654) @eps1lon - -All contributors of this release in alphabetical order: @alisasanib, @altruity, @Ashish2097, @caioagiani, @CFarhad, @cherniavskii, @danilo-leal, @eps1lon, @flaviendelangle, @garronej, @GneyHabub, @joeframbach, @johsunds, @kjschabra, @m4theushw, @michaldudak, @mihailgaberov, @mnajdova, @mogrady88, @oliviertassinari, @paales, @pppp606, @siriwatknp, @theiliad - -## 5.4.0 - -<!-- generated comparing v5.3.1..master --> - -_Feb 1, 2022_ - -A big thanks to the 22 contributors who made this release possible. Here are some highlights ✨: - -- 🛠 @goncalovf added an example project using [Material UI with Vite.js](https://github.com/mui/material-ui/tree/master/examples/material-ui-vite) (#28241) -- Number of 🐛 bug fixes and 📚 documentation improvements. - -### `@mui/material@5.4.0` - -#### Breaking changes - -- ​<!-- 27 -->[core] Do not reexport Base from Material (#30853) @michaldudak - - All Base components were exported from the `@mui/material` package and treated as stable even though the `@mui/base` package is in development. It could create a lot of confusion if developers start using Base components, depend on them, and demand quality found in "proper" Material components. We admit it was a mistake to reexport these components without marking them as unstable. - - Developers are still encouraged to evaluate the Base components, but they should do so by explicitly installing the `@mui/base` package. - - This is technically a breaking change as it removes a number of components from the `@mui/material` package. However, we believe that removing the components now and potentially breaking the codebases will do less harm than introducing "silent" breaking changes to Base components while continuing reexporting them from `@mui/material`. - - Note: the utility components, such as ClickAwayListener, NoSsr, Portal, and TextareaAutosize continue to be exported from both `@mui/material` and `@mui/base`. - - If you're encountering build errors after upgrading @mui/material, do the following: - - 1. Install @mui/base: npm install @mui/base or yarn add @mui/base - 2. Make sure the version of @mui/base match the version of @mui/material - 3. Change the import paths of unstyled components from @mui/material to @mui/base, e.g.: - - ```diff - -import ButtonUnstyled from '@mui/material/ButtonUnstyled'; - +import ButtonUnstyled from '@mui/base/ButtonUnstyled'; - ``` - -#### Changes - -- ​<!-- 30 -->[Autocomplete] Add `readOnly` prop (#30706) @ZeeshanTamboli -- ​<!-- 29 -->[Autocomplete] Fix typos in the page (#30737) @austinewuncler -- ​<!-- 14 -->[FormControlLabel][formgroup] add Mui-error class (#30656) @alisasanib -- ​<!-- 13 -->[Grid] Fix prop check for applying wrap-reverse (#30813) @Hubbz -- ​<!-- 07 -->[TextField] Remove notch when no label is added (#30560) @alisasanib -- ​<!-- 06 -->[TextField] Remove usage of dangerouslySetInnerHTML (#30776) @Jack-Works -- ​<!-- 05 -->[TreeView] Select node when key `Enter` is pressed (#30795) @dryrainbow -- ​<!-- 04 -->[useMediaQuery] Ensure no tearing in React 18 (#30655) @eps1lon - -### `@mui/base@5.0.0-alpha.67` - -- ​<!-- 11 -->[SelectUnstyled] Create unstyled select (+ hook) (#30113) @michaldudak - -### `@mui/lab@5.0.0-alpha.67` - -- ​<!-- 23 -->[DateTimePicker] Fix month view highlight wrong tab (#30773) @DiegoYungh -- ​<!-- 12 -->[pickers] Enable the sx props on all components (#30749) @boutahlilsoufiane - -### Docs - -- ​<!-- 28 -->[blog] Introducing callback support in style overrides (#30668) @siriwatknp -- ​<!-- 23 -->[docs] Add notifications for the blog posts (#30852) @siriwatknp -- ​<!-- 22 -->[docs] Improve the interoperability guide (#30785) @mnajdova -- ​<!-- 21 -->[docs] Improve the Getting Started documentation content (#30808) @mnajdova -- ​<!-- 20 -->[docs] Fix typo in ad fallback (#30823) @cherniavskii -- ​<!-- 19 -->[docs] Change ThemeProvider API links (#30705) @atakanzen -- ​<!-- 18 -->[docs] Retain vendor prefixing in rtl example (#30710) @ryancogswell -- ​<!-- 17 -->[docs] Fix typo in the Popper ScrollPlayground demo (#30780) @tanyabouman -- ​<!-- 16 -->[docs] Small fixes on the jss-to-tss migration guide (#30734) @garronej -- ​<!-- 15 -->[examples] Add Vite.js example (#28241) @goncalovf - -### Core - -- ​<!-- 29 -->[core] Clarify the label, to match with MUI X (#30831) @oliviertassinari -- ​<!-- 26 -->[core] Remove none code related instructions from git (#30843) @oliviertassinari -- ​<!-- 25 -->[core] Fix typos in comments for scripts (#30809) @aefox -- ​<!-- 24 -->[core] Fix 301 link in the blog @oliviertassinari -- ​<!-- 10 -->[test] Fix tests on Node 16 (#30819) @michaldudak -- ​<!-- 09 -->[test] Add explicit types to support noImplicityAny=false (#30798) @m4theushw -- ​<!-- 08 -->[test] Support React.useId format in \*DescriptionOf (#30657) @eps1lon -- ​<!-- 03 -->[website] Fix SEO issues (#30829) @oliviertassinari -- ​<!-- 02 -->[website] Add designer position page (#30708) @danilo-leal -- ​<!-- 01 -->[website] Polish /about page (#30747) @oliviertassinari - -All contributors of this release in alphabetical order: @aefox, @alisasanib, @atakanzen, @austinewuncler, @boutahlilsoufiane, @cherniavskii, @danilo-leal, @DiegoYungh, @dryrainbow, @eps1lon, @garronej, @goncalovf, @Hubbz, @Jack-Works, @m4theushw, @michaldudak, @mnajdova, @oliviertassinari, @ryancogswell, @siriwatknp, @tanyabouman, @ZeeshanTamboli - -## 5.3.1 - -<!-- generated comparing v5.3.0..master --> - -_Jan 24, 2022_ - -A big thanks to the 12 contributors who made this release possible. Here are some highlights ✨: - -- 🛠 @mnajdova added interoperability guide for using Tailwind CSS (#30700) -- A meaningful number of 🐛 bug fixes and 📚 documentation improvements. - -### `@mui/icons-material@5.3.1` - -- ​<!-- 04 -->[icons] Fix naming typos (#30512) @MrHBS -- ​<!-- 03 -->[icons] Makes material-icons work with Joy (#30681) @siriwatknp - -### `@mui/base@5.0.0-alpha.66` - -- ​<!-- 02 -->[SliderUnstyled] Improve typings on some internal utils (#30614) @mnajdova - -### Core - -- ​<!-- 24 -->[core] Batch small changes (#30690) @oliviertassinari -- ​<!-- 23 -->[core] Add new structure to ignore list crowdin (#30608) @siriwatknp -- ​<!-- 22 -->[core] Correct version in package.json (#30677) @michaldudak -- ​<!-- 01 -->[test] Fix buildApiUtils tests on Windows (#30698) @michaldudak - -### Docs - -- ​<!-- 26 -->[blog] Enable blog index (#30724) @siriwatknp -- ​<!-- 25 -->[blog] Introducing the Row Grouping feature (#30598) @alexfauquette -- ​<!-- 21 -->[docs] Fix SEO crawl errors (#30733) @oliviertassinari -- ​<!-- 20 -->[docs] Update migration-v4.md (#30721) @ddecrulle -- ​<!-- 19 -->[docs] Fix migration issues detected by `ahrefs` (#30751) @siriwatknp -- ​<!-- 18 -->[docs] Add interoprability guide for using Tailwind CSS (#30700) @mnajdova -- ​<!-- 17 -->[docs] Fix typo in containedSizeMedium class (#30723) @aaneitchik -- ​<!-- 16 -->[docs] Hotfix the wrong URL in X marketing page (#30729) @siriwatknp -- ​<!-- 15 -->[docs] Post migration preparation fix (#30716) @siriwatknp -- ​<!-- 14 -->[docs] Update remix example to restore from error pages (#30592) @mnajdova -- ​<!-- 13 -->[docs] Use new URLs when enable_redirects is true (#30704) @siriwatknp -- ​<!-- 12 -->[docs] Add a missing bracket in the migration-v4 guide (#30616) @chaosmirage -- ​<!-- 11 -->[docs] Add Checkbox color prop change (#30697) @aaneitchik -- ​<!-- 10 -->[docs] Fix migration to have singular urls (#30695) @siriwatknp -- ​<!-- 09 -->[docs] Update UXPin link to new landing page (#30691) @Evomatic -- ​<!-- 08 -->[docs] Close user menu on click in the responsive app bar demo (#30664) @NoahYarian -- ​<!-- 07 -->[docs] Clear the difference between UI and React components (#29930) @oliviertassinari -- ​<!-- 06 -->[docs] Make Autocomplete docs gender neutral (#30679) @exequielbc -- ​<!-- 05 -->[docs] Update doc structure for X components (#30684) @siriwatknp - -All contributors of this release in alphabetical order: @aaneitchik, @alexfauquette, @chaosmirage, @ddecrulle, @Evomatic, @exequielbc, @michaldudak, @mnajdova, @MrHBS, @NoahYarian, @oliviertassinari, @siriwatknp - -## 5.3.0 - -<!-- generated comparing v5.2.8..master --> - -_Jan 17, 2022_ - -A big thanks to the 15 contributors who made this release possible. Here are some highlights ✨: - -- 🛠 @siriwatknp added support for callbacks in styleOverrides (#30524) -- 🧩 @ZeeshanTamboli and @VicHofs improved customization of components (#30515, #30212) -- 🛠 @hbjORbj fixed the use of ResizeObserver in Masonry component (#29896) -- 📄 @danilo-leal and @siriwatknp created our own blog home page (#30121) - -### `@mui/material@5.3.0` - -- [Autocomplete] Add ability to pass props to `Paper` component (#30515) @ZeeshanTamboli -- [Select] Add defaultOpen prop (#30212) @VicHofs - -### `@mui/system@5.3.0` - -- [system][box, grid, typography] `textTransform` prop should work directly on component (#30437) @hbjORbj -- [system] Support callback value in `styleOverrides` slot (#30524) @siriwatknp - -### `@mui/lab@5.0.0-alpha.65` - -- [Masonry] Observe every masonry child to trigger computation when needed (#29896) @hbjORbj -- [MobileDatePicker] Fix calling onOpen when readOnly is true (#30561) @alisasanib - -### `@mui/codemod@5.3.0` - -- [codemod] Bump `jscodeshift` to remove `colors` dependency (#30578) @siriwatknp - -### `@mui/styled-engine-sc@5.3.0` - -- [styled-engine-sc] Add the withConfig API to enable using the babel plugin for styled-comonents (#30589) @mnajdova - -### `@mui/joy@5.0.0-alpha.11` - -- [Joy] Add `SvgIcon` component (#30570) @hbjORbj - -### `@mui/base@5.0.0-alpha.65` - -- [SliderUnstyled] Add useSlider hook and polish (#30094) @mnajdova - -### Docs - -- [docs] End code block in test/README.md (#30531) @yaboi -- [docs] Remove redundant grouping in /components/radio-buttons/ (#30065) @eps1lon -- [docs] Update migration scripts and e2e tests (#30583) @siriwatknp -- [docs] Fix migration guides for versions older than v4 (#30595) @kkirsche -- [docs] Inform about specific files for DataGrid locales (#30411) @alexfauquette -- [docs] jss-to-tss migration advise to drop clsx in favor of cx (#30527) @garronej -- [docs] Fix integration with MUI X (#30593) @oliviertassinari -- [docs] Adding peer dependencies explanation on @mui/lab README.md (#30532) @glaucoheitor -- [docs] Add missing quote in migration docs (#30587) @Atralbus -- [docs] Update link to Doit sponsor (#30586) @oliviertassinari -- [docs] Add products identifier and drawer (#30283) @siriwatknp -- [website] Fix code button with installation command (#30622) @danilo-leal -- [website] Add a Blog index page (#30121) @danilo-leal -- [website] Migrate Twitter from @MaterialUI to @MUI_hq @oliviertassinari -- [website] Add Andrii to the About Us page (#30581) @cherniavskii - -### Core - -- [core] Revert changes to peer dependencies (#30662) @oliviertassinari -- [core] Renovate should not try to update node (#30659) @oliviertassinari -- [core] Remove dead files (#30663) @oliviertassinari -- [core] Fix outdated TypeScript template (#30596) @oliviertassinari -- [core] Remove extra `</p>` from header of README.md (#30530) @yaboi -- [core] Fix `docs:api` script for Windows OS (#30533) @ZeeshanTamboli - -All contributors of this release in alphabetical order: @alexfauquette, @alisasanib, @Atralbus, @cherniavskii, @danilo-leal, @eps1lon, @garronej, @glaucoheitor, @hbjORbj, @kkirsche, @mnajdova, @oliviertassinari, @siriwatknp, @VicHofs, @yaboi, @ZeeshanTamboli - -## 5.2.8 - -<!-- generated comparing v5.2.7..master --> - -_Jan 10, 2022_ - -A big thanks to the 10 contributors who made this release possible. Here are some highlights ✨: - -- A meaningful number of 🐛 bug fixes and 📚 documentation improvements. - -### `@mui/material@5.2.8` - -- ​<!-- 05 -->[TextField][inputlabel] Remove `pointer-events: none` property (#30493) @hbjORbj -- ​<!-- 02 -->[Slider] Add `input` slot to components and componentsProps (#30362) @alexandre-lelain - -### `@mui/joy@5.0.0-alpha.10` - -- ​<!-- 04 -->[Joy] Add `Typography` component (#30489) @siriwatknp -- ​<!-- 03 -->[Joy] Add functional `Switch` component (#30487) @siriwatknp - -### Docs - -- ​<!-- 18 -->[docs] Update markdown parser to remove backticks from description (#30495) @aefox -- ​<!-- 17 -->[docs] Fix the crash when applying custom colors (#30563) @siriwatknp -- ​<!-- 16 -->[docs] Location change of Sebastian (#30528) @eps1lon -- ​<!-- 15 -->[docs] Lint markdown in the CI (#30395) @oliviertassinari -- ​<!-- 14 -->[docs] Fix `componentsProps` API docs and PropTypes (#30502) @ZeeshanTamboli -- ​<!-- 13 -->[docs] Codemod doc for overriding styles using tss (#30499) @garronej -- ​<!-- 12 -->[docs] fix edge case when replacing data-grid url for migration (#30505) @siriwatknp -- ​<!-- 11 -->[docs] fix replace url for migration (#30503) @siriwatknp -- ​<!-- 10 -->[docs] Prepare scripts for migrating to new structure (#30386) @siriwatknp -- ​<!-- 09 -->[docs] Adjust RTL Guide demos to fully support RTL (#30387) @noam-honig -- ​<!-- 08 -->[docs] Move @eps1lon to community (#30473) @oliviertassinari -- ​<!-- 07 -->[docs] Fix typo and spelling in the-sx-prop.md (#30482) @aefox -- ​<!-- 06 -->[docs] More general docs polishing (#30371) @danilo-leal -- ​<!-- 01 -->[website] Add José on the /about page (#30492) @danilo-leal - -All contributors of this release in alphabetical order: @aefox, @alexandre-lelain, @danilo-leal, @eps1lon, @garronej, @hbjORbj, @noam-honig, @oliviertassinari, @siriwatknp, @ZeeshanTamboli - -## 5.2.7 - -<!-- generated comparing v5.2.6..master --> - -_Jan 3, 2022_ - -A big thanks to the 14 contributors who made this release possible. Here are some highlights ✨: - -- 📓 Improvements on the Vietnamese (vi-VN) and Finnish (fi-FI) locales (#30426, #30442) @hckhanh @Certificate -- And more 🐛 bug fixes and 📚 documentation improvements. - -### `@mui/material@5.2.7` - -- ​<!-- 14 -->[Autocomplete] Fix calling onChange for duplicate values (#30374) @alisasanib -- ​<!-- 13 -->[Avatar] Fix TypeScript error on imgProps (#30255) @ahmad-reza619 -- ​<!-- 12 -->[Badge] Fix `classes` prop TypeScript type (#30427) @ZeeshanTamboli -- ​<!-- 03 -->[SvgIcon] Allow viewBox to inherit from Component through inheritViewBox prop (#29954) @alex-dikusar -- ​<!-- 04 -->[SvgIcon] Correct API docs and code style (#30470) @michaldudak - -### Docs - -- ​<!-- 11 -->[blog] 2021 (#30425) @oliviertassinari -- ​<!-- 15 -->[docs] Fix typo on the Grid docs page (#30446) @abhi45 -- ​<!-- 07 -->[docs] Fix `useMediaQuery` SSR example to v5 theme API (#30454) @ValentinH -- ​<!-- 11 -->[docs] Improve the migration guide and add examples for transforming to `tss-react` (#30388) @mnajdova -- ​<!-- 09 -->[docs] Make the reference to the select clearer (#30460) @boazrymland -- ​<!-- 08 -->[docs] Sync translations with Crowdin (#30385) @l10nbot -- ​<!-- 06 -->[example] Avoid double rendering in the Remix example (#30366) @mnajdova -- ​<!-- 05 -->[i18n] improve viVN locale (#30426) @hckhanh -- ​<!-- 04 -->[l10n] Improve fiFI locale (#30442) @Certificate -- ​<!-- 02 -->[website] Add new batch of open roles (#30282) @oliviertassinari -- ​<!-- 01 -->[website] Refactor page context with next router (#30020) @siriwatknp - -### Core - -- ​<!-- 13 -->[core] Automatically close issues that are incomplete and inactive (#30459) @oliviertassinari -- ​<!-- 10 -->[core] Remove contrib tweet (#30455) @oliviertassinari - -All contributors of this release in alphabetical order: @abhi45, @ahmad-reza619, @alex-dikusar, @alisasanib, @boazrymland, @Certificate, @hckhanh, @l10nbot, @michaldudak, @mnajdova, @oliviertassinari, @siriwatknp, @ValentinH, @ZeeshanTamboli - -## 5.2.6 - -<!-- generated comparing v5.2.5..master --> - -_Dec 27, 2021_ - -A big thanks to the 14 contributors who made this release possible. Here are some highlights ✨: - -- 📓 The Norwegian Bokmål (nb-NO) locale was added (#27520) @wogsland -- 🛠 Introduced a new `useBadge` hook in the `@mui/base` package (#30246) @mnajdova -- And more 🐛 bug fixes and 📚 documentation improvements. - -### `@mui/material@5.2.6` - -- ​<!-- 24 -->[ButtonGroup] Fix typo in ButtonGroupContext's interface (#30376) @kealjones-wk -- ​<!-- 03 -->[l10n] Add Norwegian Bokmål (nb-NO) locale (#27520) @wogsland - -### `@mui/base@5.0.0-alpha.62` - -- ​<!-- 26 -->[BadgeUnstyled] Add useBadge hook (#30246) @mnajdova - -### `@mui/joy@5.0.0-alpha.8` - -- ​<!-- 04 -->[Joy] Button API (#29962) @siriwatknp - -### Docs - -- ​<!-- 27 -->[docs] Fix color coercion (#30319) @Janpot -- ​<!-- 25 -->[blog] Fix file import conflict resolution (#30391) @oliviertassinari -- ​<!-- 21 -->[docs] Fix crash on Safari because of unsupported lookahead feature (#30345) @cherniavskii -- ​<!-- 20 -->[docs] Update to new website domain (#30396) @ryota-murakami -- ​<!-- 19 -->[docs] Fix text from material-ui to @mui to reflect v5 name changes (#30393) @pupudu -- ​<!-- 18 -->[docs] Fix a11y in Menu demos (#30378) @ZeeshanTamboli -- ​<!-- 17 -->[docs] Document how to unmount transition child (#30382) @oliviertassinari -- ​<!-- 16 -->[docs] The current standard for quotes is QUOTATION MARK @oliviertassinari -- ​<!-- 15 -->[docs] Fix 404 links (#30380) @oliviertassinari -- ​<!-- 14 -->[docs] Fix Breadcrumb description (#30307) @jamesmelzer -- ​<!-- 13 -->[docs] Modify injection order for Gatsby and SSR examples (#30358) @ShuPink -- ​<!-- 12 -->[docs] Improve the translation experience (#30373) @oliviertassinari -- ​<!-- 11 -->[docs] Sync translations with Crowdin (#30176) @l10nbot -- ​<!-- 10 -->[docs] Fix link to /size-snapshot (#30363) @oliviertassinari -- ​<!-- 09 -->[docs] Fix incorrect aria label in SpeedDial demo (#30354) @chwallen -- ​<!-- 08 -->[docs] Fix incorrect number of breakpoint helpers (#30353) @chwallen -- ​<!-- 07 -->[docs] Update outdated links (#30260) @oliviertassinari -- ​<!-- 06 -->[docs] Support redirects from old urls to /material/\* (#30286) @siriwatknp -- ​<!-- 05 -->[examples] Fix CSS Modules integration (#30381) @oliviertassinari -- ​<!-- 02 -->[website] Fix SEO issues (#30372) @oliviertassinari -- ​<!-- 01 -->[website] Sync sponsors (#30259) @oliviertassinari - -### Core - -- ​<!-- 28 -->[core] Rename Material UI to MUI (#30338) @ZeeshanTamboli -- ​<!-- 23 -->[core] Fix warning in dev mode (#30368) @oliviertassinari -- ​<!-- 22 -->[core] Update `buildApi` script to support new structure (#30245) @siriwatknp - -All contributors of this release in alphabetical order: @cherniavskii, @chwallen, @jamesmelzer, @Janpot, @kealjones-wk, @l10nbot, @mnajdova, @oliviertassinari, @pupudu, @ryota-murakami, @ShuPink, @siriwatknp, @wogsland, @ZeeshanTamboli - -## 5.2.5 - -<!-- generated comparing v5.2.4..master --> - -_Dec 20, 2021_ - -A big thanks to the 16 contributors who made this release possible. Here are some highlights ✨: - -- 🛠 This release mostly improves what's behind the scenes: infrastructure and tests -- 📓 Danish (da-DK) locale was added (#29485) @mikk5829 -- 🖌 Polished the design of Base components (#30149) and the docs in general (#29994) @danilo-leal -- 📚 Many additions and improvements to the documentation were made - -### `@mui/material@5.2.5` - -- [l10n] Add Danish (da-DK) locale (#29485) @mikk5829 -- [LoadingButton] Label progressbar by the LoadingButton (#30002) @eps1lon -- [Tabs] Remove unnecessary `Partial<>` type around TabIndicatorProps type (#30254) @ZeeshanTamboli - -### `@mui/system@5.2.5` - -- [system] Use `useEnhancedEffect` to prevent flicker (#30216) @hbjORbj - -### `@mui/lab@5.0.0-alpha.61` - -- [pickers] Fix the wrong MuiClockPicker's ArrowSwitcher slot name (#30226) @rejetto - -### Docs - -- [docs] Run JS compiler on markdown output (#29732) @Janpot -- [Badge] Add tests for `anchorOrigin` prop (#30147) @daniel-sachs -- [docs] Add cssmodule injection order comments to Nextjs example (#30213) @ShuPink -- [docs] Remove extra word in Select component code example comments (#30281) @KThompso -- [docs] Improve the description of the Accordion (#30253) @jamesmelzer -- [docs] Heading capitalization convention @oliviertassinari -- [docs] Rename remaining 'unstyled' references to 'base' (#30206) @michaldudak -- [docs] Add to migration doc about ref type specificity (#30114) @hbjORbj -- [docs] Add script to clone pages (#30107) @siriwatknp -- [docs] Correct colors in breakpoints documentation (#30219) @michaldudak -- [docs] Sync icon search UI state with the url (#30075) @Janpot -- [docs] Base components demos design polish (#30149) @danilo-leal -- [docs] General documentation polish (#29994) @danilo-leal -- [examples] Fix typo in the remix example's README (#30289) @lemol -- [website] Remove expired gold sponsor (#30222) @oliviertassinari -- [website] Remove broken showcase links (#30217) @mnajdova - -### Core - -- [test] Reduce bundle size comparison memory consumption (#30195) @Janpot -- [core] make snapshot comparison more resilient (#30183) @Janpot -- [core] update formatted ts demo to support new structure (#30248) @siriwatknp -- [core] cache dependencies in github actions (#30211) @siriwatknp -- [core] fix root package version (#30204) @siriwatknp -- [core] Fail the build when the dangerjs script errors (#30186) @Janpot -- [test] Add E2E website tests (#30128) @siriwatknp - -All contributors of this release in alphabetical order: @daniel-sachs, @danilo-leal, @eps1lon, @hbjORbj, @jamesmelzer, @Janpot, @KThompso, @lemol, @michaldudak, @mikk5829, @mnajdova, @oliviertassinari, @rejetto, @ShuPink, @siriwatknp, @ZeeshanTamboli - -## 5.2.4 - -<!-- generated comparing v5.2.3..master --> - -_Dec 14, 2021_ - -A big thanks to the 16 contributors who made this release possible. Here are some highlights ✨: - -- ✨ Add `not` operator to `theme.breakpoints` (#29311) @Philipp000 - - ```js - const styles = (theme) => ({ - root: { - backgroundColor: 'blue', - // Match [xs, md) and [md + 1, ∞) - // [xs, md) and [lg, ∞) - // [0px, 900px) and [1200px, ∞) - [theme.breakpoints.not('md')]: { - backgroundColor: 'red', - }, - }, - }); - ``` - -- And many more 🐛 bug fixes and 📚 improvements. - -### `@mui/material@5.2.4` - -- ​<!-- 14 -->[esm] Correct a styles imports (#29976) @Janpot -- ​<!-- 12 -->[GlobalStyles] Fix `theme` type (#30072) @mnajdova -- ​<!-- 11 -->[Grid] Fix grid items to respond to the container's responsive columns (#29715) @kkorach -- ​<!-- 04 -->[TextField] Fix missing space before asterisk in `OutlinedInput`'s label (#29630) @alisasanib -- ​<!-- 03 -->[Transition] Allow any valid HTML attribute to be passed (#29888) @Janpot -- ​<!-- 02 -->[types] Fix discrepancy between core and system `ThemeOptions` (#30095) @fmeum -- ​<!-- 09 -->[InputBase] Add prop for disabling global styles (#29213) @bryan-hunter -- ​<!-- 08 -->[Select] Improve multiple logic (#30135) @ladygo93 - -### `@mui/system@5.2.4` - -- ​<!-- 06 -->[system] Don't transition when re-appearing (#30108) @eps1lon -- ​<!-- 05 -->[system] Add `not` operator to `breakpoints` (#29311) @Philipp000 - -### `@mui/base@5.0.0-alpha.60` - -- ​<!-- 25 -->[BadgeUnstyled] Make it conformant with other base components (#30141) @mnajdova - -### `@mui/icons-material@5.2.4` - -- ​<!-- 10 -->[icons] Correct location of icon download folder (#29839) @yaboi - -### Docs - -- ​<!-- 22 -->[docs] Explain the use of Select's label in FormControl (#30189) @michaldudak -- ​<!-- 21 -->[docs] Don't run nprogress on shallow routing (#30087) @Janpot -- ​<!-- 20 -->[docs] Add Data Driven Forms to related projects (#30078) @rvsia -- ​<!-- 19 -->[docs] Sync translations with Crowdin (#30067) @l10nbot -- ​<!-- 18 -->[docs] Fix link on "Custom variables" section in the Theming page #30100 @danilo-leal -- ​<!-- 17 -->[docs] Fix justifyContent option in the Grid interactive demo (#30117) @danilo-leal -- ​<!-- 16 -->[docs] Add tip to help access the docs of a previous version when finding answers in Stack Overflow (#30101) @danilo-leal -- ​<!-- 15 -->[docs] Fix import example inside Unstyled Backdrop section (#30098) @TheodosiouTh -- ​<!-- 01 -->[website] Column pinning and Tree data are out (#30136) @oliviertassinari -- ​<!-- 07 -->[survey] Remove survey promotion items (#30122) @danilo-leal - -### Core - -- ​<!-- 23 -->[core] Fix link to Open Collective @oliviertassinari -- ​<!-- 26 -->[core] Update snapshots and s3 fallback (#30134) @Janpot -- ​<!-- 24 -->[ci] Update CI bucket (#30080) @Janpot -- ​<!-- 13 -->[fix] size:snapshot for mui-material-next and mui-joy components (#30106) @Janpot - -All contributors of this release in alphabetical order: @alisasanib, @bryan-hunter, @danilo-leal, @eps1lon, @fmeum, @Janpot, @kkorach, @l10nbot, @ladygo93, @michaldudak, @mnajdova, @oliviertassinari, @Philipp000, @rvsia, @TheodosiouTh, @yaboi - -## 5.2.3 - -<!-- generated comparing v5.2.2..master --> - -_Dec 6, 2021_ - -A big thanks to the 25 contributors who made this release possible. Here are some highlights ✨: - -- ✨ We have introduced a new unstyled component in `@mui/base`: `TablePagination` (#29759) @mnajdova - - <a href="https://mui.com/components/tables/#unstyled-table"><img width="800" alt="unstyled table" src="https://user-images.githubusercontent.com/4512430/144862194-584356ef-7d9d-462c-a631-186a7e716193.png"></a> - - You can follow our progress with unstyled components at https://github.com/mui/base-ui/issues/10. - -- 🎉 We have added an example of how to use MUI with [Remix](https://remix.run/) (#29952) @mnajdova - -- And many more 🐛 bug fixes and 📚 improvements. - -### `@mui/material@5.2.3` - -- ​<!-- 33 -->[Accordion] Add a test for handling `square` prop (#29972) @daniel-sachs -- ​<!-- 32 -->[Alert] Fix `square` Paper prop (#30027) @ZeeshanTamboli -- ​<!-- 31 -->[AvatarGroup] Allow specifying total number of avatars (#29898) @eduardomcv -- ​<!-- 29 -->[Button] Fix regression from context API (#29982) @siriwatknp -- ​<!-- 13 -->[Grid] Fix generated classes for `spacing` prop when the value is object (#29880) @jayeclark -- ​<!-- 10 -->[Select] Should not crash when an empty array is passed with `multiple` enabled (#29957) @Domino987 - -### `@mui/system@5.2.3` - -- ​<!-- 06 -->[system] Fix return type of `createBox` (#29989) @mnajdova -- ​<!-- 05 -->[system] Support boolean values in TypeScript for the `sx` prop when used as array (#29911) @tasugi - -### `@mui/utils@5.2.3` - -- ​<!-- 03 -->[utils] Add typings for `@mui-material/styles/cssUtils` (#29621) @Semigradsky - -### `@mui/icons-material@5.2.1` - -- ​<!-- 12 -->[icons] Consolidate ignored icons into one list (#29843) @chao813 - -### `@mui/base@5.0.0-alpha.59` - -- ​<!-- 30 -->[base] Fix missing ClickAwayListener barrel index export (#30000) @oliviertassinari -- ​<!-- 04 -->[TablePaginationUnstyled] Introduce new component (#29759) @mnajdova - -### `@mui/lab@5.0.0-alpha.59` - -- ​<!-- 27 -->[DateRangePicker] Fix `DateRangePickerDayProps` interface (#29067) @jonathanrtuck -- ​<!-- 10 -->[Pickers] Remove propagation of custom props to the `MonthPicker` component's DOM element (#30021) @ZeeshanTamboli -- ​<!-- 08 -->[StaticDatePicker] Add className and slot to PickerStaticWrapper (#29619) @kkorach - -### `@mui/joy@5.0.0-alpha.5` - -- ​<!-- 11 -->[Joy] Theme setup (#29846) @siriwatknp - -### Docs - -- ​<!-- 34 -->[docs] Fix link in TypeScript doc page (#30044) @genzyy -- ​<!-- 26 -->[docs] Remove the 'WIP' icon from the 'Group & Pivot' page title (#30077) @flaviendelangle -- ​<!-- 25 -->[docs] Add warning that `@mui/styled-engine-sc` does not work in SSR (#30026) @mnajdova -- ​<!-- 24 -->[docs] Add section for CSS specificity in the migration guide (#30008) @hbjORbj -- ​<!-- 28 -->[docs] Clarify comment in migration doc (#30076) @hbjORbj -- ​<!-- 23 -->[docs] Sync translations with Crowdin (#30041) @l10nbot -- ​<!-- 22 -->[docs] Explain how Paper changes shade in dark mode (#30003) @michaldudak -- ​<!-- 21 -->[docs] Update nextjs-typescript-example (#29974) @huydhoang -- ​<!-- 20 -->[docs] Add missing global state classes to API docs generator (#29945) @michaldudak -- ​<!-- 19 -->[docs] Fix benchmarks folder link (#29981) @fourjr -- ​<!-- 18 -->[docs] Improve wording in Stack Overflow section of support page (#29956) @ronwarner -- ​<!-- 17 -->[docs] Remove Black Friday sale notification (#29936) @mbrookes -- ​<!-- 16 -->[examples] Fix typos in the Remix example (#30071) @MichaelDeBoey -- ​<!-- 15 -->[examples] Add Remix example (#29952) @mnajdova -- ​<!-- 14 -->[examples] Fix lint issue for displayName missing in the Next.js examples (#29985) @ZeeshanTamboli -- ​<!-- 09 -->[Stack] Document system props in Stack API (#30069) @ThewBear -- ​<!-- 07 -->[survey] Add a banner and card for promoting the 2021 survey (#29950) @danilo-leal -- ​<!-- 02 -->[website] Correct the Careers page description (#30073) @michaldudak -- ​<!-- 01 -->[website] Fix 301 links (#30040) @oliviertassinari - -### Core - -- ​<!-- 31 -->[core] Batch small changes (#30042) @oliviertassinari -- ​<!-- 28 -->[core] Transition to a new Stack Overflow tag (#29967) @oliviertassinari - -All contributors of this release in alphabetical order: @chao813, @daniel-sachs, @danilo-leal, @Domino987, @eduardomcv, @flaviendelangle, @fourjr, @genzyy, @hbjORbj, @huydhoang, @jayeclark, @jonathanrtuck, @kkorach, @l10nbot, @mbrookes, @MichaelDeBoey, @michaldudak, @mnajdova, @oliviertassinari, @ronwarner, @Semigradsky, @siriwatknp, @tasugi, @ThewBear, @ZeeshanTamboli - -## 5.2.2 - -<!-- generated comparing v5.2.1..master --> - -_Nov 29, 2021_ - -A big thanks to the 9 contributors who made this release possible. Here are some highlights ✨: - -- ♿️ Improved accessibility of `Snackbar` and `TextField` in `@mui/material` (#29782) (#29850) (#29852) @eps1lon. -- 🎉 Added support for `sx` syntax inside `styled()` utility (#29833) @mnajdova. -- 🎉 Added support for more options for `createCssVarsProvider` in `@mui/system` (#29845) (#29857) @hbjORbj. -- And many more 🐛 bug fixes and 📚 improvements. - -### `@mui/material@5.2.2` - -- ​<!-- 14 -->[MenuList] Add component prop (#29882) @Harshikerfuffle -- ​<!-- 13 -->[Snackbar] Interrupt auto-hide on keyboard interaction (#29852) @eps1lon -- ​<!-- 12 -->[Snackbar] Dismiss on Escape press (#29850) @eps1lon -- ​<!-- 06 -->[TextField] Associate accessible name and description by default (#29782) @eps1lon - -### `@mui/joy@5.0.0-alpha.4` - -- ​<!-- 15 -->[Joy] Add `Button` - 1st iteration (#29464) @siriwatknp - -### `@mui/codemod@5.2.1` - -- ​<!-- 28 -->[codemod] Fix alias import for box-sx-prop (#29902) @siriwatknp - -### `@mui/system@5.2.2` - -- ​<!-- 11 -->[system] CSSVarsProvider cleans up `html[style]` when unmounting (#29946) @eps1lon -- ​<!-- 10 -->[system] Add support for `disableTransitionOnChange` in `createCssVarsProvider` (#29857) @hbjORbj -- ​<!-- 09 -->[system] Add support for `enableColorScheme` in `createCssVarsProvider` (#29845) @hbjORbj - -### `@mui/utils@5.2.2` - -- ​<!-- 05 -->[useId] Trade random collisions for collisions on overflow (#29781) @eps1lon -- ​<!-- 04 -->[useIsFocusVisible] Convert to TypeScript (#29779) @eps1lon - -### Docs - -- ​<!-- 24 -->[docs] Fix v5-beta confusing example description (#29932) @oliviertassinari -- ​<!-- 23 -->[docs] Apply the z-index on the right DOM element (#29934) @oliviertassinari -- ​<!-- 22 -->[docs] Improve git diff format (#29935) @oliviertassinari -- ​<!-- 21 -->[docs] Fix typo (#29866) @sinclairity -- ​<!-- 20 -->[docs] Fix key display (#29933) @oliviertassinari -- ​<!-- 19 -->[docs] Fix outdated link to next/link docs (#29937) @radlinskii -- ​<!-- 18 -->[docs] Add how to pass `sx` prop (#29905) @siriwatknp -- ​<!-- 17 -->[docs] Fix typo in notifications @mbrookes -- ​<!-- 16 -->[docs] Black Friday sale notification @mbrookes -- ​<!-- 03 -->[website] Fix canonical links (#29938) @oliviertassinari -- ​<!-- 02 -->[website] Fix SEO issues (#29939) @oliviertassinari -- ​<!-- 01 -->[website] Improvements to the /x product page (#28964) @danilo-leal - -### Core - -- ​<!-- 27 -->[core] Remove dead code (#29940) @oliviertassinari -- ​<!-- 26 -->[core] Move benchmark CI job from AZP to CircleCI (#29894) @eps1lon -- ​<!-- 25 -->[core] Fix PR detection pattern in test_bundle_size_monitor (#29895) @eps1lon -- ​<!-- 08 -->[test] Fix browser tests (#29929) @eps1lon -- ​<!-- 07 -->[test] Reject shorthand properties in style matchers (#29893) @eps1lon - -All contributors of this release in alphabetical order: @danilo-leal, @eps1lon, @Harshikerfuffle, @hbjORbj, @mbrookes, @oliviertassinari, @radlinskii, @sinclairity, @siriwatknp - -## 5.2.1 - -<!-- generated comparing v5.2.0..master --> - -_Nov 25, 2021_ - -A big thanks to the 7 contributors who made this release possible. Here are some highlights ✨: - -This is an early release to fix `export 'useId' (imported as 'React') was not found in 'react'` when bundling code depending on MUI Core. - -- ​<!-- 10 -->[AppBar][docs] Add a fully responsive demo to docs (#29829) @karakib2k18 -- ​<!-- 9 -->[core] Fix PR run detection in test_bundle_size_monitor (#29879) @eps1lon -- ​<!-- 8 -->[core] Move bundle size monitoring to CircleCI (#29876) @eps1lon -- ​<!-- 7 -->[docs] Add keys to Responsive AppBar demo (#29884) @mbrookes -- ​<!-- 6 -->[docs] MUI's 2021 Developer Survey (#29765) @prakhargupta1 -- ​<!-- 5 -->[docs] Smoother image loading UX (#29858) @oliviertassinari -- ​<!-- 4 -->[Select] Fix select display value with React Nodes (#29836) @kegi -- ​<!-- 3 -->[system] Add `experimental_sx` utility (#29833) @mnajdova -- ​<!-- 2 -->[test] Ignore "detected multiple renderers" warning for now (#29854) @eps1lon -- ​<!-- 1 -->[useMediaQuery][utils] Remove usage of React 18 APIs (#29870) @eps1lon - -All contributors of this release in alphabetical order: @eps1lon, @karakib2k18, @kegi, @mbrookes, @mnajdova, @prakhargupta1, @oliviertassinari - -## 5.2.0 - -<!-- generated comparing v5.1.1..master --> - -_Nov 23, 2021_ - -A big thanks to the 18 contributors who made this release possible. Here are some highlights ✨: - -- 🧪 Created another unstyled component: [TabsUnstyled](https://mui.com/components/tabs/#unstyled) (#29597) @mnajdova. -- 🎉 Updated the Material Icons set with the latest changes from Google (#29328) @michaldudak / (#29818) @chao813. - This update adds 200 new icons and tweaks the appearance of many more. - With it, we're getting close to having 2000 icons in our set. -- 🐛 Fixed bugs and improved the infrastructure and documentation 📚. - -### `@mui/material@5.2.0` - -- [IconButton] Remove on hover effect when `disableRipple` is set (#29298) @adamfitzgibbon -- [i18n] Add the amharic language (#29153) @NatiG100 -- [material] Fix types for `variants.style` to accept callbacks (#29610) @mnajdova -- [Popper] Simplify prop types (#29680) @michaldudak -- [Select] Include aria-selected=false when option not selected (#29695) @michaldudak -- [useMediaQuery] Fix crash in Safari < 14 and IE 11 (#29776) @eps1lon -- [useMediaQuery] Ensure no tearing in React 18 (#28491) @eps1lon - -### `@mui/codemod@5.2.0` - -- [codemod] Fix `jss-to-styled` to support multiple withStyles (#29824) @siriwatknp - -### `@mui/icons-material@5.2.0` - -- [icons] Sync new Google Material Icons (#29818) @chao813 -- [icons] Sync recent Material Icons from Google (#29328) @michaldudak - -### `@mui/system@5.2.0` - -- [Box] Fix `sx` prop runtime issue when used as function (#29830) @mnajdova -- [system] Fix `sx` throw error when value is `null` or `undefined` (#29756) @siriwatknp -- [system] Fix minor CssVars issues (#29747) @siriwatknp - -### `@mui/styled-engine@5.2.0` - -- [styled-engine] Fix props inference in styled-engine (#29739) @Janpot - -### `@mui/base@5.0.0-alpha.56` - -- [FormControlUnstyled] `focused` is always false unless explicitly set to `true` @mwilkins91 -- [TabsUnstyled] Introduce new component (#29597) @mnajdova - -### `@mui/lab@5.0.0-alpha.56` - -- [DatePicker][timepicker] Add missing component declarations (#29517) @longzheng -- [Masonry] exports from root package (#29754) @abhinav-22-tech -- [pickers] Widen accepted `luxon` version range (#29761) @eps1lon - -### Docs - -- [blog] MUI X v5 blog post (#29590) @DanailH -- [blog] Polish the Benny Joo joins MUI post (#29697) @oliviertassinari -- [changelog] Explain why we do breaking changes @oliviertassinari -- [core] Update latest issue template for codesandbox CI (#29783) @eps1lon -- [core] Ensure `@mui/core` is an alias for `@mui/base` (#29762) @eps1lon -- [docs] Fix broken Next and Previous links (#29711) @scallaway -- [docs] Add a note that ToggleButton exclusive does not enforce selection (#29812) @mmacu -- [docs] Update the list of supported locales (#29831) @michaldudak -- [docs] Update tooltip doc to better define touch action (#29717) @gnowland -- [website] Standardize the background color from the MUI team photos (#29738) @danilo-leal -- [website] Add Bharat to the About Us Page (#29714) @bharatkashyap -- [website] Add about page entry for jan (#29701) @Janpot -- [website] Adding Prakhar to the about page (#29737) @danilo-leal - -### Core - -- [test] Allow debugging with Chrome and VSCode inspector (#29777) @eps1lon -- [test] Use renderer clock instead of custom useFakeTimers call (#29778) @eps1lon -- [test] Only mock Date in regression tests (#29763) @eps1lon -- [test] Disable nightly integration tests on `next` branch (#29748) @eps1lon -- [test] Allow configuring clock directly from `createRenderer` (#29684) @eps1lon -- [test] Accept backslashes as path separators in test CLI (#29694) @michaldudak -- [utils] Use built-in hook when available for useId (#26489) @eps1lon - -All contributors of this release in alphabetical order: @abhinav-22-tech, @adamfitzgibbon, @bharatkashyap, @chao813, @DanailH, @danilo-leal, @eps1lon, @gnowland, @Janpot, @longzheng, @michaldudak, @mmacu, @mnajdova, @mwilkins91, @NatiG100, @oliviertassinari, @scallaway, @siriwatknp - -## 5.1.1 - -<!-- generated comparing v5.1.0..master --> - -_Nov 16, 2021_ - -A big thanks to the 15 contributors who made this release possible. Here are some highlights ✨: - -- 🛠 Renamed `@mui/core` to `@mui/base` (#29585) @michaldudak. -- And many more 🐛 bug fixes and 📚 improvements. - -### `@mui/material@5.1.1` - -- ​<!-- 34 -->[Breadcrumbs][divider] Replace decimal spacing values with integers and css calc (#29526) @anikcreative -- ​<!-- 10 -->[Select][nativeselect] Add `multiple` class (#29566) @aaronholla -- ​<!-- 09 -->[Popper] Split into PopperUnstyled and Popper (#29488) @michaldudak -- ​<!-- 08 -->[Select] Make it clear that `Select` is not a root component (#29593) @hbjORbj -- ​<!-- 13 -->[l10n] Improved Dutch (nl-NL) locale (#29592) @flipvrijn -- ​<!-- 10 -->[Table] Improve pagination range, use "en dash" over "hyphen" (#29579) @narekmal - -### `@mui/base@5.0.0-alpha.55` - -#### Breaking changes - -- ​<!-- 27 -->[core] Rename mui/core to mui/base (#29585) @michaldudak - - Based on the results of the [poll](https://x.com/michaldudak/status/1452630484706635779) and our internal discussions, we decided to rename the `@mui/core` package to `@mui/base`. The main rationale for this is the fact that we use the term "Core" to refer to the core components product family, the one that includes Material Design components, unstyled components, System utilities, etc. Therefore, @mui/core was effectively a subset of MUI Core. This was confusing. - - The new name better reflects the purpose of the package: it contains unstyled components, hooks, and utilities that serve as a **base** to build on. - - ```diff - -import { useSwitch } from '@mui/core/SwitchUnstyled'; - +import { useSwitch } from '@mui/base/SwitchUnstyled'; - ``` - -### `@mui/lab@5.0.0-alpha.55` - -- ​<!-- 12 -->[LoadingButton] Text variant spacing fixed for both start and end (#29194) @joshua-lawrence -- ​<!-- 11 -->[Masonry] Check if container or child exists to prevent error (#29452) @hbjORbj - -### Docs - -- ​<!-- 25 -->[docs] Correct bundler configuration for using legacy Material UI build (#29146) @petermikitsh -- ​<!-- 24 -->[docs] Fix typo on autocomplete.md (#29570) @netizer -- ​<!-- 23 -->[docs] Fix dark mode on branding pages (#29611) @alexfauquette -- ​<!-- 22 -->[docs] Do not render CSS section in API docs navbar if there are no CSS classes (#29622) @ZeeshanTamboli -- ​<!-- 21 -->[docs] Fix link locale handling (#29624) @oliviertassinari -- ​<!-- 20 -->[docs] Fix Search navigation (#29623) @oliviertassinari -- ​<!-- 19 -->[docs] Fix broken link & update MUI packages explanation (#29583) @siriwatknp -- ​<!-- 18 -->[docs] Do not repeat language snippet in url in Algolia search (#29483) @hbjORbj -- ​<!-- 17 -->[docs] Update `ThemeProvider` API link (#29573) @siriwatknp -- ​<!-- 16 -->[docs] Remove svg logos from the Support page (#29431) @oliviertassinari -- ​<!-- 15 -->[docs] Link UXPin integration (#29422) @oliviertassinari -- ​<!-- 14 -->[docs] Link to the new public roadmap for the design kits (#29433) @oliviertassinari -- ​<!-- 28 -->[docs] correct bundler configuration for using legacy Material UI build (#29146) @petermikitsh -- ​<!-- 01 -->[website] Fix premium plan release date (#29430) @oliviertassinari -- ​<!-- 02 -->[website] Add GitHub icon button to the navbar (#29640) @danilo-leal -- ​<!-- 39 -->[blog] Support many authors in markdown pages (#29633) @m4theushw - -### Core - -- ​<!-- 33 -->[core] Add `experiments` index page (#29582) @siriwatknp -- ​<!-- 32 -->[core] Move s3 bucket ownership to mui-org (#29609) @eps1lon -- ​<!-- 31 -->[core] Improve support request message (#29614) @mnajdova -- ​<!-- 30 -->[core] Use support request GitHub Action (#29594) @mnajdova -- ​<!-- 29 -->[core] Remove unused `getJsxPreview` util (#29586) @ZeeshanTamboli -- ​<!-- 28 -->[core] Use GitHub issue forms (#28038) @oliviertassinari -- ​<!-- 26 -->[core] Add playground (#29423) @oliviertassinari -- ​<!-- 07 -->[test] Correctly identify what the `raf` helper is for (#29683) @eps1lon -- ​<!-- 06 -->[test] Verify a quilted ImageList is created as test title suggests (#29565) @daniel-sachs -- ​<!-- 05 -->[test] Replace `createServerRender` with `createRenderer` (#29503) @eps1lon -- ​<!-- 04 -->[test] Always ignore "useLayoutEffect has no effect on the server"-warning (#29502) @eps1lon -- ​<!-- 03 -->[test] Restore StrictMode by default (#29589) @eps1lon -- ​<!-- 02 -->[test] createPickerRender -> createPickerRenderer (#29575) @eps1lon -- ​<!-- 09 -->[test] Allow experimental CLI to run exact test (#29685) @eps1lon - -All contributors of this release in alphabetical order: @aaronholla, @alexfauquette, @anikcreative, @daniel-sachs, @eps1lon, @flipvrijn, @hbjORbj, @joshua-lawrence, @michaldudak, @mnajdova, @netizer, @oliviertassinari, @petermikitsh, @siriwatknp, @ZeeshanTamboli - -## 5.1.0 - -<!-- generated comparing v5.0.6..master --> - -_Nov 8, 2021_ - -A big thanks to the 33 contributors who made this release possible. Here are some highlights ✨: - -- 🎉 Support custom elements under `ButtonGroup` (#28645) @ZeeshanTamboli -- 🛠 Add support for arrays in the `sx` prop (#29297) @siriwatknp -- And many more 🐛 bug fixes and 📚 improvements. - -### `@mui/material@5.1.0` - -- ​<!-- 68 -->[Autocomplete] Fix `hiddenLabel` prop of `TextField variant={filled}` inside Autocomplete (#29234) @jatinsandilya -- ​<!-- 67 -->[Box] Support generateClassName and defaultClassName (#29347) @siriwatknp -- ​<!-- 66 -->[ButtonGroup] Fix variant outlined always has primary color borders on hover (#29487) @ZeeshanTamboli -- ​<!-- 65 -->[ButtonGroup] Support different elements under ButtonGroup (#28645) @ZeeshanTamboli -- ​<!-- 62 -->[CssBaseline] Add `enableColorScheme` prop so enable using `color-scheme` property to deal with dark mode (#29454) @alexfauquette -- ​<!-- 29 -->[FormControlLabel] Narrow the label type (#29324) @michaldudak -- ​<!-- 28 -->[Grid] Fix usage when columns > 12 (#29196) @tanay123456789 -- ​<!-- 27 -->[InputBase] Do not repeat the same classname (#29353) @hbjORbj -- ​<!-- 30 -->[InputBase] Remove WebkitAppearance from search type (#29383) @nicbarajas -- ​<!-- 25 -->[ListItem] Add missing exports (#29571) @robcaldecott -- ​<!-- 22 -->[Pagination] Allow customization of icons (#29336) @mbeltramin -- ​<!-- 11 -->[TextField] Fix bootstrap, normalize.css, sanitize.css conflicts (#28674) @ChrisClaude -- ​<!-- 10 -->[TextField] Fix invisible wrap within notched inputs (#29088) @DASPRiD -- ​<!-- 09 -->[Tooltip] `open` prop in `componentsProps.popper` can be optional (#29370) @ZeeshanTamboli -- ​<!-- 08 -->[Tooltip] Fix `className` not getting applied from PopperProps (#29023) @ZeeshanTamboli -- ​<!-- 07 -->[useRadioGroup] Convert to TypeScript (#29326) @eps1lon - -### `@mui/system@5.1.0` - -- ​<!-- 21 -->[system] Introduce `mode` to CssVarsProvider (#29418) @siriwatknp -- ​<!-- 20 -->[system] Improve breakpoints resolver function (#29300) @hbjORbj -- ​<!-- 19 -->[system] Add array support for `sx` prop (#29297) @siriwatknp - -### `@mui/codemod@5.1.0` - -- ​<!-- 64 -->[codemod] Add codemod parser flag (#29059) (#29229) @ElonVolo - -### `@mui/lab@5.0.0-alpha.54` - -- ​<!-- 52 -->[DatePicker] Fix disabled/readOnly for view components (#28815) @adamfitzgibbon -- ​<!-- 24 -->[Masonry] Fix crash on unmount when using React 18 (#29358) @eps1lon -- ​<!-- 23 -->[Masonry] Improve height computation and detect changes in `children` (#29351) @hbjORbj - -### `@mui/joy@5.0.0-alpha.0` - -- ​<!-- 28 -->[Joy] Update default theme (#29478) @siriwatknp -- ​<!-- 26 -->[Joy] Export CssVarsProvider with default theme (#29150) @siriwatknp -- ​<!-- 25 -->[Joy] Remove `private` to leverage CodeSandbox (#29280) @siriwatknp - -### Docs - -- ​<!-- 51 -->[docs] Add differences between styled and sx (#28685) @eric-burel -- ​<!-- 50 -->[docs] Track usage of dark mode in Google Analytics (#29419) @oliviertassinari -- ​<!-- 49 -->[docs] Remove create-mui-theme as it is no longer working (#29472) @IPJT -- ​<!-- 48 -->[docs] Fix warnings in AppSearch (#29459) @eps1lon -- ​<!-- 47 -->[docs] Add framework example for ClassNameGenerator (#29453) @siriwatknp -- ​<!-- 46 -->[docs] Fix layout shift when scrolling (#29436) @oliviertassinari -- ​<!-- 45 -->[docs] Fix layout-shift on id='main-content' (#29425) @oliviertassinari -- ​<!-- 44 -->[docs] Remove usage of `process.browser` (#29438) @oliviertassinari -- ​<!-- 43 -->[docs] Add instruction on how to use the child selector API with emotion (#29350) @mnajdova -- ​<!-- 42 -->[docs] Fix small typos (#29424) @oliviertassinari -- ​<!-- 41 -->[docs] Fix TOC highlighting logic (#29435) @oliviertassinari -- ​<!-- 40 -->[docs] Fix about page flags (#29314) @mbrookes -- ​<!-- 39 -->[docs] Fix Box JS docs (#29282) @Pablion -- ​<!-- 38 -->[docs] Update storybook section in migration to v5 docs (#28800) @siriwatknp -- ​<!-- 37 -->[docs] Document how to enable color on dark mode (#29340) @Wimukti -- ​<!-- 36 -->[docs] Display search functionality in all viewports (#28819) @eps1lon -- ​<!-- 35 -->[docs] Query heading for ToC on demand (#29204) @eps1lon -- ​<!-- 34 -->[docs] Add next.js styled-component guide and update links to example (#29118) @Jareechang -- ​<!-- 33 -->[docs] Fix overriding `MuiTextField`'s default props in the migration guide (#29174) @tm1000 -- ​<!-- 32 -->[docs] Fix "clickable" and "deletable" typos (#28702) @jacklaurencegaray -- ​<!-- 31 -->[docs] Update migration-v4 docs for wrong import path (#29042) @busches -- ​<!-- 30 -->[docs] Add GitHub icon change to "Migration from v4 to v5" guide (#29182) @dan-mba -- ​<!-- 06 -->[website] Benny Joo joining MUI (#29499) @mnajdova -- ​<!-- 05 -->[website] Update the `Print export` feature info on the pricing page (#29484) @DanailH -- ​<!-- 04 -->[website] Improve the dev rel role description (#29477) @oliviertassinari -- ​<!-- 03 -->[website] Add customers section on Design Kits and Templates marketing pages (#29168) @danilo-leal -- ​<!-- 02 -->[website] Improvements to the /core product page @danilo-leal -- ​<!-- 01 -->[website] Fix typo on the About Page (#29286) @gssakash - -### Core - -- ​<!-- 63 -->[core] Handle RecordType and FieldType in generatePropDescription.ts (#29467) @flaviendelangle -- ​<!-- 61 -->[core] Convert a named color to lowercase (#29465) @ainatenhi -- ​<!-- 60 -->[core] Allow to reuse functions from `docs:api` (#28828) @m4theushw -- ​<!-- 59 -->[core] Commit new nextjs 12 tsconfig (#29458) @eps1lon -- ​<!-- 58 -->[core] Settle on MUI X for the official name (#29420) @oliviertassinari -- ​<!-- 57 -->[core] Add mui as a npm keyword (#29427) @oliviertassinari -- ​<!-- 56 -->[core] Fix issue template redirection (#29432) @oliviertassinari -- ​<!-- 55 -->[core] Remove unecessary destructuration (#29354) @oliviertassinari -- ​<!-- 54 -->[core] Use cross-env to set env variables in material-icons scripts (#29327) @michaldudak -- ​<!-- 53 -->[core] Don't bump peer dependency ranges on dependency updates (#29303) @eps1lon -- ​<!-- 18 -->[test] Fix browser tests (#29505) @eps1lon -- ​<!-- 69 -->[test] Fix missing act warnings in latest React 18 alpha (#29357) @eps1lon -- ​<!-- 17 -->[test] Replace `createClientRender` with new `createRenderer` API (#29471) @eps1lon -- ​<!-- 16 -->[test] Fix possible "missing act" warning (#29463) @eps1lon -- ​<!-- 15 -->[test] Remove render#baseElement (#29462) @eps1lon -- ​<!-- 14 -->[test] Expose `AbortController` on global (#29360) @eps1lon -- ​<!-- 13 -->[test] Add internal test for uniqe `name` in `Rating` (#29329) @eps1lon -- ​<!-- 12 -->[test] Fix browser tests (#29305) @eps1lon - -All contributors of this release in alphabetical order: @adamfitzgibbon, @ainatenhi, @alexfauquette, @busches, @ChrisClaude, @dan-mba, @DanailH, @danilo-leal, @DASPRiD, @ElonVolo, @eps1lon, @eric-burel, @flaviendelangle, @gssakash, @hbjORbj, @IPJT, @jacklaurencegaray, @Jareechang, @jatinsandilya, @m4theushw, @mbeltramin, @mbrookes, @michaldudak, @mnajdova, @nicbarajas, @oliviertassinari, @Pablion, @robcaldecott, @siriwatknp, @tanay123456789, @tm1000, @Wimukti, @ZeeshanTamboli - -## 5.0.6 - -<!-- generated comparing v5.0.5..master --> - -_Oct 27, 2021_ - -A big thanks to the 4 contributors who made this release possible. Here are some highlights ✨: - -- 🔧 Fix reported TypeScript issues on the `@mui/system` package because some packages were not released - -### `@mui/material@5.0.6` - -- ​<!-- 4 -->[Autocomplete] Fix `clearOnBlur` prop (#29208) @hbjORbj -- ​<!-- 2 -->[Rating] Remove z-index from decimal stars (#29295) @williamhaley - -### `@mui/system@5.0.6` - -- ​<!-- 5 -->[system] Fix various issues reported by using @mui/styled-engine-sc (#29035) @mnajdova -- ​<!-- 1 -->[system] Fix executing server-side Emotion component as function interpolation (#29290) @Andarist - -### Docs - -- ​<!-- 3 -->[blog] Q3 2021 Update (#28970) @oliviertassinari - -All contributors of this release in alphabetical order: @Andarist, @hbjORbj, @oliviertassinari, @williamhaley - -## 5.0.5 - -<!-- generated comparing v5.0.4..master --> - -_Oct 26, 2021_ - -A big thanks to the 19 contributors who made this release possible. Here are some highlights ✨: - -- 🔧 Implement `Masonry` using Flexbox by @hbjORbj. -- 🧪 Add three components to `@mui/base` by @rebeccahongsf and @hbjORbj. - -### `@mui/codemod@5.0.5` - -- ​<!-- 38 -->[codemod] Support new package name in `link-underline-hover` transformer (#29214) @siriwatknp - -### `@mui/base@5.0.0-alpha.52` - -- ​<!-- 39 -->[ClickAwayListener] Move to the core package (#29186) @hbjORbj -- ​<!-- 13 -->[Popper] Move from mui-material to mui-base (#28923) @rebeccahongsf -- ​<!-- 04 -->[TextareaAutosize] Move to the core package (#29148) @hbjORbj - -### `@mui/lab@5.0.0-alpha.52` - -- ​<!-- 16 -->[Masonry] Improve demo styles (#29218) @hbjORbj -- ​<!-- 15 -->[Masonry] Implement Masonry using Flexbox (#28059) @hbjORbj - -### `@mui/icons@5.0.5` - -- ​<!-- 19 -->[icons] Add TipsAndUpdates icon (#29004) @hbjORbj - -### `@mui/material@5.0.5` - -- ​<!-- 40 -->[CardMedia] Apply specified `img` role instead of custom `image` role (#29172) @eps1lon -- ​<!-- 32 -->[CSSBaseline] Remove incorrect @deprecated annotation (#29069) @adamfitzgibbon -- ​<!-- 20 -->[Grid] Support custom columns with nested grid (#28743) @Devesh21700Kumar -- ​<!-- 18 -->[InputBase] Remove wrong theme overriding with MUI's default theme (#29157) @hbjORbj -- ​<!-- 17 -->[LoadingButton] Fix `fullWidth` styling (#28652) @nikitabobers -- ​<!-- 16 -->[Popper] make Popper display:none whenever it's closed (#29233) @adamfitzgibbon -- ​<!-- 14 -->[Menu] Reduce min-height & padding in menu-item with dense property (#29180) @jatinsandilya -- ​<!-- 07 -->[Tab] `iconPosition` prop added in Tab (#28764) @deepanshu2506 -- ​<!-- 03 -->[Tooltip] Correct inconsistent prop precedence (#29132) @michaldudak - -### `@mui/system@5.0.5` - -- ​<!-- 11 -->[system] Allow function type for `sx` prop (#29198) @hbjORbj -- ​<!-- 10 -->[system] Fix various issues reported by using @mui/styled-engine-sc (#29035) @mnajdova -- ​<!-- 09 -->[system] Fix `colorScheme` conflict between application (#29139) @siriwatknp -- ​<!-- 08 -->[system] Add `unstable_createCssVarsProvider` api (#28965) @siriwatknp - -### Documentation - -- ​<!-- 31 -->[docs] Fix path to `DataGrid` CSV export options page (#29220) @DanailH -- ​<!-- 30 -->[docs] Give anonymous components a name (#29189) @eps1lon -- ​<!-- 29 -->[docs] Add deploy context variables (#29195) @siriwatknp -- ​<!-- 28 -->[docs] Add MUI packages explanation (#29073) @siriwatknp -- ​<!-- 27 -->[docs] Fix typo in CSP policy (#29187) @JuliaNeumann -- ​<!-- 26 -->[docs] Dark mode conditional content rendering (#28665) @michal-perlakowski -- ​<!-- 25 -->[docs] Fix ClassNameGenerator introduced version #29177 @siriwatknp -- ​<!-- 24 -->[docs] Add missing `justifyContent` values and update box styling (#29117) @omarmosid -- ​<!-- 23 -->[docs] Make landing page hero section scrollable (#29141) @waxidiotic -- ​<!-- 22 -->[docs] Discourage importing different bundles directly (#29133) @eps1lon -- ​<!-- 21 -->[docs] Update module augmentation reference url (#29064) @gnowland -- ​<!-- 12 -->[pricing] Add tooltip to pricing icon (#28959) @siriwatknp -- ​<!-- 07 -->[Team] Add Alexandre in the about page (#29289) -- ​<!-- 02 -->[website] Fix status label overflow in AdvancedShowcase (#29143) @LorenzHenk -- ​<!-- 01 -->[website] Update legacy logos (#28908) @michaldudak - -### Core - -- ​<!-- 37 -->[core] Order repro methods by preference (#29156) @eps1lon -- ​<!-- 36 -->[core] Remove unnecessary usages of `useEventCallback` (#28910) @NMinhNguyen -- ​<!-- 35 -->[core] add `unstable_ClassNameGenerator` API (#29051) @siriwatknp -- ​<!-- 34 -->[core] Fix issues when using styled-components (#29048) @mnajdova -- ​<!-- 33 -->[core] replace hard-coded classname with classes (#29070) @siriwatknp -- ​<!-- 06 -->[test] Add documentation for visual regression tests (#29154) @eps1lon -- ​<!-- 05 -->[test] Enable "missing act" warnings using new proposal (#29167) @eps1lon - -All contributors of this release in alphabetical order: @adamfitzgibbon, @DanailH, @deepanshu2506, @Devesh21700Kumar, @eps1lon, @gnowland, @hbjORbj, @jatinsandilya, @JuliaNeumann, @LorenzHenk, @michal-perlakowski, @michaldudak, @mnajdova, @nikitabobers, @NMinhNguyen, @omarmosid, @rebeccahongsf, @siriwatknp, @waxidiotic - -## 5.0.4 - -<!-- generated comparing v5.0.3..master --> - -_Oct 14, 2021_ - -A big thanks to the 17 contributors who made this release possible. Here are some highlights ✨: - -- 🧪 Added `UnstyledInput` and `useInput` hook in the the first component in @mui/base package @michaldudak (#28053) -- 🐛 Fixed many bugs and improved the documentation 📚. - -### `@mui/material@5.0.4` - -- ​<!-- 31 -->[Chip] disable ripple only if onDelete is present. (#29034) @mottox2 -- ​<!-- 06 -->[Pagination] Fix clicking on `...` triggering `onChange` with page value `null` (#28884) @ZeeshanTamboli -- ​<!-- 04 -->[Tabs] Alternative way to disable ":first-child is unsafe" error (#28982) @hbjORbj -- ​<!-- 03 -->[Tabs] Fix ":first-child is potentially unsafe" error (#28890) @hbjORbj -- ​<!-- 01 -->[transitions] Mark `children` as required where nullish `children` would crash at runtime (#29028) @eps1lon - -### `@mui/system@5.0.4` - -- ​<!-- 05 -->[system] Update typing for `style` function (#28744) @hbjORbj - -### `@mui/base@5.0.0-alpha.51` - -- ​<!-- 07 -->[InputUnstyled] Create unstyled input and useInput hook (#28053) @michaldudak - -### `@mui/lab@5.0.0-alpha.51` - -- ​<!-- 25 -->[DesktopDatePicker] add Paper props to pass down to Paper component (#28865) @amen-souissi - -### Docs - -- ​<!-- 24 -->[docs] Add JSDoc to `theme.breakpoints` (#29039) @eps1lon -- ​<!-- 23 -->[docs] Rename broken package names in docs pointing to `@mui/material` (#29006) @visualfanatic -- ​<!-- 22 -->[docs] Add troubleshooting guide for unexpected styles (#28907) @mnajdova -- ​<!-- 21 -->[docs] Fix issues reported by ahref (#28986) @mnajdova -- ​<!-- 20 -->[docs] Remove json translations for dropped locales (#28987) @mnajdova -- ​<!-- 19 -->[docs] Fix type signature of renderGroup in Autocomplete (#28876) @tanyabouman -- ​<!-- 18 -->[docs] Minor typo in v4-v5 migration docs (#28995) @kgregory -- ​<!-- 17 -->[docs] Add `mui-image` related project (#28621) @benmneb -- ​<!-- 16 -->[docs] Update Getting Started Templates' Source URIs (#28929) @epodol -- ​<!-- 15 -->[docs] Improve search experience (#28801) @siriwatknp -- ​<!-- 14 -->[docs] Fix demo of the responsive drawer (#28226) @goncalovf -- ​<!-- 13 -->[docs] Fix global theme link demo (#28974) @ZeeshanTamboli -- ​<!-- 12 -->[docs] Update box example to use 'backgroundColor' rather than 'bgColor' (#28958) @Jareechang -- ​<!-- 11 -->[docs] corrected `Box` import for `sx-prop` example (#28873) @phudekar -- ​<!-- 10 -->[docs] Fix footnote ID links in CONTRIBUTING.md (#28849) @officialpiyush -- ​<!-- 09 -->[docs] Fix color & density playground (#28803) @siriwatknp -- ​<!-- 08 -->[docs] Improve visibility of styled engine configuration section in installation guide (#28903) @Jareechang - -### Core - -- ​<!-- 30 -->[core] Prevent yarn cache growing infinitely (#29040) @eps1lon -- ​<!-- 29 -->[core] Update browserslist (#29025) @eps1lon -- ​<!-- 28 -->[core] Update `peerDependencies` to require `latest` instead of `next` (#29007) @eps1lon -- ​<!-- 27 -->[core] Increase memory limit for size:snapshot (#29005) @eps1lon -- ​<!-- 26 -->[core] Init `private` Joy package (#28957) @siriwatknp -- ​<!-- 02 -->[test] Remove a11y snapshot tests (#28887) @eps1lon - -All contributors of this release in alphabetical order: @amen-souissi, @benmneb, @epodol, @eps1lon, @goncalovf, @hbjORbj, @Jareechang, @kgregory, @michaldudak, @mnajdova, @mottox2, @officialpiyush, @phudekar, @siriwatknp, @tanyabouman, @visualfanatic, @ZeeshanTamboli - -## 5.0.3 - -<!-- generated comparing v5.0.2..master --> - -_Oct 7, 2021_ - -A big thanks to the 19 contributors who made this release possible. Here are some highlights ✨: - -- 🧪 Created the first component in @mui/material-next - our v6 prototype package. -- 🐛 Fixed many bugs and improved the documentation 📚. - -### `@mui/material@5.0.3` - -- ​<!-- 10 -->[Stack] Add props & variants types in the theme (#28843) @mnajdova -- ​<!-- 12 -->[InputLabel] Fix condition for applying formControl overrides (#28707) @yevheniiminin -- ​<!-- 05 -->[Tooltip] Allow overriding internal components and their props (#28692) @michaldudak -- ​<!-- 04 -->[transitions] Fix `addEndListener` not being called with the DOM node (#28715) @eps1lon - -### `@mui/codemod@5.0.3` - -- ​<!-- 37 -->[codemod] Fix `optimal-imports` to support v4 and v5-alpha, beta (#28812) @siriwatknp - -### `@mui/system@5.0.3` - -- ​<!-- 09 -->[system] Add padding/margin-block/inline to spacing (#28813) @smmoosavi - -### `@mui/styled-engine-sc@5.0.3` - -- ​<!-- 42 -->Don't allow styled-components APIs on mui styled function (#28807) @hbjORbj - -### `@mui/base@5.0.0-alpha.50` - -- ​<!-- 38 -->[ButtonUnstyled] Don't set redundant role=button (#28488) @michaldudak -- ​<!-- 43 -->[SliderUnstyled] Prevent unknown-prop error when using marks prop (#28868) @hbjORbj - -### `@mui/lab@5.0.0-alpha.50` - -- ​<!-- 11 -->[pickers] Change view even if `onViewChange` is set (#28765) @eps1lon - -### `@mui/material-next@6.0.0-alpha.4` - -- ​<!-- 39 -->[Button-next] Create Button in material-next (#28313) @michaldudak - -### Docs - -- ​<!-- 34 -->[docs] Add alike v4 default button color in migration (#28881) @siriwatknp -- ​<!-- 34 -->[docs] Use PNG instead of SVG for color preview (#28699) @eps1lon -- ​<!-- 33 -->[docs] Use client-side navigation when activating docsearch results (#28750) @eps1lon -- ​<!-- 32 -->[docs] Fluid icon size in icons search (#28747) @eps1lon -- ​<!-- 31 -->[docs] Fix the wrong import in docs grid page (#28863) @taghi-khavari -- ​<!-- 30 -->[docs] Fix typo in Pagination docs (#28864) @ZeeshanTamboli -- ​<!-- 29 -->[docs] Fix 404 links (#28710) @mnajdova -- ​<!-- 28 -->[docs] Fix typo in Mui CSS classname (#28725) @cacpgomes -- ​<!-- 27 -->[docs] Match example to codesandbox demo and update ID link (#28762) @AnilSeervi -- ​<!-- 26 -->[docs] Fix typo in system/box documentation (#28822) @iamsergo -- ​<!-- 25 -->[docs] Use HTML standards for autocomplete attributes (#28827) @epodol -- ​<!-- 24 -->[docs] Improve styled-components integration (#28713) @mnajdova -- ​<!-- 23 -->[docs] Correct Select's menu placement description (#28748) @michaldudak -- ​<!-- 22 -->[docs] AdapterDayJS -> AdapterDayjs (#28770) @veerreshr -- ​<!-- 21 -->[docs] Theme documentation, typo fix (#28805) @saeedseyfi -- ​<!-- 20 -->[docs] Add the last diamond sponsor (#28737) @hbjORbj -- ​<!-- 19 -->[docs] Fix various links in CONTRIBUTING (#28751) @AnilSeervi -- ​<!-- 18 -->[docs] Only add JSS to demos (#28698) @eps1lon -- ​<!-- 17 -->[docs] Update v5 status in release schedule (#28700) @owais635 -- ​<!-- 16 -->[docs] Fix typo in /guides/styled-engine (#28720) @Sharry0 -- ​<!-- 15 -->[docs] Fix typo in chip documentation (#28641) @avranju94 -- ​<!-- 14 -->[docs] Fix versions page (#28682) @mnajdova -- ​<!-- 13 -->[docs] Remove legacy team page (#28646) @mnajdova -- ​<!-- 41 -->[website] add "React" to the hero description (#28830) @danilo-leal -- ​<!-- 03 -->[website] Fix constantly reloading when Russian language is set (#28869) @mnajdova -- ​<!-- 02 -->[website] Compress one avatar image on about us page (#28823) @hbjORbj -- ​<!-- 01 -->[website] Hide 'become a diamond sponsor' box on landing page (#28814) @hbjORbj -- ​<!-- 40 -->[website] Update Benny's profile on about us page (#28816) @hbjORbj - -### Core - -- ​<!-- 36 -->[core] Remove `--exact` from `release:version` (#28840) @siriwatknp -- ​<!-- 35 -->[core] Neglect framer from release flow (#28680) @siriwatknp -- ​<!-- 08 -->[test] Add a test for not allowing styled-components' APIs on mui `styled` function (#28862) @hbjORbj -- ​<!-- 07 -->[test] Fix instances where type tests were only passing due to object being part of ReactNode (#28804) @eps1lon -- ​<!-- 06 -->[test] Move ByMuiTest to test/utils (#28509) @eps1lon - -All contributors of this release in alphabetical order: @AnilSeervi, @avranju94, @cacpgomes, @danilo-leal, @epodol, @eps1lon, @hbjORbj, @iamsergo, @michaldudak, @mnajdova, @owais635, @saeedseyfi, @Sharry0, @siriwatknp, @smmoosavi, @taghi-khavari, @veerreshr, @yevheniiminin, @ZeeshanTamboli - -## 5.0.2 - -<!-- generated comparing v5.0.1..master --> - -_Sep 29, 2021_ - -A big thanks to the 15 contributors who made this release possible. Here are some highlights ✨: - -- 🔧 Improve `jss-to-styled` codemod to use new package names. -- And many more 🐛 bug fixes and 📚 improvements. - -### `@mui/material@5.0.2` - -- ​<!-- 28 -->[Checkbox] Fix form submission with empty value (#28423) @garronej -- ​<!-- 08 -->[Slider] Don't error on minimal changes with readonly value (#28472) @eps1lon -- ​<!-- 07 -->[Switch] Fix style overrides on input (#28576) @praveenkumar-kalidass -- ​<!-- 03 -->[useMediaQuery] Add types for `matchMedia` option and deprecate exported interfaces (#28413) @eps1lon - -### `@mui/codemod@5.0.2` - -- ​<!-- 27 -->[codemod] Add MenuItem v.1.0.0 transform for primaryText property (#28640) @dmitry-yudakov -- ​<!-- 26 -->[codemod] Update the imports in `jss-to-styled` to match the new package names (#28667) @mnajdova - -### `@mui/system@5.0.2` - -- ​<!-- 06 -->[system] Fix types to support theme callbacks on pseudo and nested selectors (#28570) @mnajdova - -### Docs - -- ​<!-- 23 -->[docs] Remove languages: fr, de, ja, es, ru (#28663) @mnajdova -- ​<!-- 22 -->[docs] Improve old doc versions discoverability (#28651) @danilo-leal -- ​<!-- 21 -->[docs] Make the Toggle Button size demo use default icon size (#28656) @danilo-leal -- ​<!-- 20 -->[docs] Uniformize the code's font family (#28582) @oliviertassinari -- ​<!-- 19 -->[docs] Removed duplicate line in date-ranger-picker.md file (#28635) @naveen-bharathi -- ​<!-- 18 -->[docs] Fix title MUI x2 (#28634) @oliviertassinari -- ​<!-- 17 -->[docs] Polish email validation logic (#28255) @kiznick -- ​<!-- 16 -->[docs] Improve migration-v4.md phrasing (#28253) @adamthewebguy -- ​<!-- 15 -->[docs] Fix color in example (#28527) @alexeagleson -- ​<!-- 14 -->[docs] Fix typo in generated class names section (#28549) @fxlemire -- ​<!-- 13 -->[docs] Mention Premium pricing cap (#28581) @oliviertassinari -- ​<!-- 12 -->[docs] Update examples to use latest mui #28565 @siriwatknp -- ​<!-- 11 -->[docs] Push the fixes on Next.js's Link to the examples (#28178) @oliviertassinari -- ​<!-- 10 -->[docs] Fix wrong name for zIndex's property example in /system/ (#28541) @chetrit -- ​<!-- 08 -->[examples] Nextjs Link missing passHref #28588 (#28661) @Brlaney -- ​<!-- 02 -->[website] Iteration on the pricing page (#28406) @danilo-leal -- ​<!-- 01 -->[website] Batch fixes (#28564) @siriwatknp - -### Core - -- ​<!-- 25 -->[core] Improve Renovate groups (#28642) @eps1lon -- ​<!-- 24 -->[core] Batch small changes (#28553) @oliviertassinari -- ​<!-- 05 -->[test] Document where the value for SwitchBase#value comes from (#28638) @eps1lon -- ​<!-- 04 -->[test] Make `seconds` `views` test pass in browsers (#28511) @eps1lon - -All contributors of this release in alphabetical order: @adamthewebguy, @alexeagleson, @Brlaney, @chetrit, @danilo-leal, @dmitry-yudakov, @eps1lon, @fxlemire, @garronej, @kiznick, @mnajdova, @naveen-bharathi, @oliviertassinari, @praveenkumar-kalidass, @siriwatknp - -## 5.0.1 - -<!-- generated comparing v5.0.0..master --> - -_Sep 22, 2021_ - -A big thanks to the 14 contributors who made this release possible. Here are some highlights ✨: - -- 🔎 Improve the search on the documentation. -- 📚 Improve the v4 to v5 migration guide. -- And many more 🐛 bug fixes and 📚 improvements. - -### `@mui/material@5.0.1` - -- ​<!-- 18 -->[Radio] Fix support for number value type (#26772) @sakura90 -- ​<!-- 12 -->[useMediaQuery] Reduce bundle size (#28412) @eps1lon - -### `@mui/codemod@5.0.1` - -- ​<!-- 43 -->[codemod] Cover edge case for theme-spacing #28400 @siriwatknp - -### `@mui/lab@5.0.0-alpha.48` - -- ​<!-- 36 -->[DateTimePicker] Support `seconds` `view` (#25095) @breitembach -- ​<!-- 13 -->[TimePicker] Fire change event when meridiem changes (#26600) @coder-freestyle - -### Docs - -- ​<!-- 35 -->[docs] Fix missing exit animation for transition Poppers (#28506) @eps1lon -- ​<!-- 34 -->[docs] Fix migration v5 docs (#28530) @siriwatknp -- ​<!-- 33 -->[docs] Avoid re-mounting the whole tree when switching theme direction (#28495) @eps1lon -- ​<!-- 32 -->[docs] Fix html compliance (#28429) @oliviertassinari -- ​<!-- 31 -->[docs] Use hyphen-case for CSS properties in /system/properties (#28489) @chetrit -- ​<!-- 30 -->[docs] Update caret position in comments to match npm scope (#28426) @eps1lon -- ​<!-- 29 -->[docs] Fix CONTRIBUTING to point out to master as targeted branch (#28396) @mnajdova -- ​<!-- 28 -->[docs] Update examples to remove 'beta' (#28475) @oliviertassinari -- ​<!-- 27 -->[docs] Fix 404 links to MUI X API (#28176) @oliviertassinari -- ​<!-- 26 -->[docs] Fix broken/incorrect attributes links in Avatar and NativeSelect API pages (#28417) @xenostar -- ​<!-- 25 -->[docs] Explain how `<Alert icon={false} />` behaves (#28348) @nguyenkhanhnam -- ​<!-- 24 -->[docs] Fix typo in /system/the-sx-prop (#28393) @danwoods -- ​<!-- 23 -->[docs] Correct the migration doc (#28391) @michaldudak -- ​<!-- 22 -->[docs] Fix the notification display logic (#28389) @oliviertassinari -- ​<!-- 21 -->[docs] Add notification for v5 @oliviertassinari -- ​<!-- 20 -->[docs] Fix typo (#28521) @valse -- ​<!-- 12 -->[website] Implement algolia redesign (#28252) @hbjORbj -- ​<!-- 11 -->[website] Update data-grid dependencies #28531 @siriwatknp -- ​<!-- 10 -->[website] Cleanup unused files after rebranding (#28505) @siriwatknp -- ​<!-- 09 -->[website] Update /company pages to use marketing website Header and Footer (#28498) @danilo-leal -- ​<!-- 08 -->[website] Optimize images (#28486) @michaldudak -- ​<!-- 07 -->[website] Add components index page (#28485) @siriwatknp -- ​<!-- 06 -->[website] Fix typo (#28478) @oliviertassinari -- ​<!-- 05 -->[website] Fix crash (#28474) @oliviertassinari -- ​<!-- 04 -->[website] Close the open engineering roles (#28428) @oliviertassinari -- ​<!-- 03 -->[website] Fix 40x links (#28401) @mnajdova -- ​<!-- 02 -->[website] Fix SEO issues reported by moz.com (#28402) @mnajdova -- ​<!-- 01 -->[website] Fix production issues (#28384) @siriwatknp - -### Core - -- ​<!-- 44 -->[core] Fix release:changelog base branch (#28533) @mnajdova -- ​<!-- 42 -->[core] Remove code handling JSS components (#28421) @eps1lon -- ​<!-- 41 -->[core] Remove unused dependencies (#28468) @eps1lon -- ​<!-- 40 -->[core] Ensure both docs bundles are analyzeable (#28410) @eps1lon -- ​<!-- 39 -->[core] Switch to Webpack 5 (#28248) @eps1lon -- ​<!-- 38 -->[core] Batch small changes (#28177) @oliviertassinari -- ​<!-- 37 -->[core] Update publish tag to latest (#28382) @mnajdova -- ​<!-- 19 -->[framer] Update @mui/\* dependencies (#28469) @eps1lon -- ​<!-- 17 -->[test] Add custom queries to `screen` (#28507) @eps1lon -- ​<!-- 16 -->[test] Run listChangedFiles against master (#28504) @eps1lon -- ​<!-- 15 -->[test] Increase BrowserStack timeout for Firefox (#28476) @oliviertassinari -- ​<!-- 14 -->[test] Use testing-library alpha when running React 18 tests (#28267) @eps1lon - -All contributors of this release in alphabetical order: @breitembach, @chetrit, @coder-freestyle, @danilo-leal, @danwoods, @eps1lon, @hbjORbj, @michaldudak, @mnajdova, @nguyenkhanhnam, @oliviertassinari, @sakura90, @siriwatknp, @valse, @xenostar - -## 5.0.0 - -<!-- generated comparing v5.0.0-rc.1..next --> - -_Sep 16, 2021_ - -After over 400 days of development and over 40 canary releases, we are excited to introduce [MUI Core v5.0.0](https://mui.com/blog/mui-core-v5/)! - -Some statistics with the released of v5.0.0 compared to the one of v4.0.0: - -- 5,832 new commits -- From 2M downloads/month to 9.5M downloads/month on npm -- From 350k users/month to 700k users/month on the documentation - -A big thanks to the 600+ contributors who made the release possible! - -The 5.0.0 version includes all changes done in the alpha, beta, and rc releases listed below. -These are the changes done from the last release candidate version (5.0.0-rc.1): - -### `@mui/material@5.0.0` - -- ​<!-- 15 -->[Autocomplete] Fix reset value on blur for freeSolo input (#28190) @praveenkumar-kalidass -- ​<!-- 14 -->[ButtonBase] Revert to the pre-unstyled implementation (#28225) @michaldudak -- ​<!-- 13 -->[Checkbox] Fix color proptype typo (#28265) @sydneyjodon-wk -- ​<!-- 40 -->[Tooltip] Ensure user-select CSS property is reverted after touch end (#28372) @tholman - -### `@mui/system@5.0.0` - -- ​<!-- 25 -->[system] Fix missing typings for createSpacing (#28361) @eps1lon - -### `@mui/codemod@5.0.0` - -- ​<!-- 21 -->[codemod] Fix jss-to-styled to support other export class, function etc. (#28321) @jedwards1211 - -### `@mui/lab@5.0.0-alpha.46` - -- ​<!-- 09 -->[DateTimePicker] Change bottom position of AM/PM buttons (#27534) @nikitabobers -- ​<!-- 02 -->[pickers] Add visual regression tests for open views (#28224) @eps1lon - -### Docs - -- ​<!-- 38 -->[blog] Introducing MUI Core v5.0 (#27912) @oliviertassinari -- ​<!-- 08 -->[docs] Fix quotes in font-face literal (#28260) @Aurelain -- ​<!-- 07 -->[docs] Update redirects to X's docs (#28263) @m4theushw -- ​<!-- 06 -->[docs] Change Material UI to MUI in the console (#28270) @mbrookes -- ​<!-- 05 -->[docs] Docs redesign adjustments (#28203) @mnajdova -- ​<!-- 04 -->[docs] How to compose theme in steps (#28246) @goncalovf -- ​<!-- 03 -->[docs] Fix DataGrid demo console warning in Table docs (#28235) @ZeeshanTamboli -- ​<!-- 32 -->[docs] Fix typo in v4 to v5 migration guide (#28353) @zadeviggers -- ​<!-- 17 -->[docs] Fix typo in transition docs (#28312) @tamboliasir1 -- ​<!-- 20 -->[docs] Use https for material-ui & reactcommunity links (#28304) @aghArdeshir -- ​<!-- 22 -->[docs] Add IBM Plex font locally (#28325) @siriwatknp -- ​<!-- 26 -->[docs] Fix failing client-side navigation for /api routes (#28356) @eps1lon -- ​<!-- 29 -->[docs] Update the nav order (#28323) @mbrookes -- ​<!-- 30 -->[docs] Compress images with ImageOptim @oliviertassinari -- ​<!-- 34 -->[docs] Replace remaining unstyled package reference (#28351) @michaldudak -- ​<!-- 35 -->[docs] No import from react-router (#28329) @eps1lon -- ​<!-- 36 -->[website] Refine website before go-live (#28081) @siriwatknp -- ​<!-- 31 -->[website] Update manifest to new logo (#28355) @siriwatknp -- ​<!-- 01 -->[website] Add product-x page (#28106) @siriwatknp -- ​<!-- 24 -->[website] Revert store URL to material-ui.com/store (#28365) @michaldudak -- ​<!-- 33 -->[website] Rename domain to mui.com (#28332) @mnajdova - -### Core - -- ​<!-- 12 -->[core] Replace Material UI with MUI (#28243) @mnajdova -- ​<!-- 11 -->[core] Prepare for v5 stable release (#28240) @mnajdova -- ​<!-- 10 -->[core] Mark lines that needs to be changed with a major release (#28238) @mnajdova -- ​<!-- 18 -->[core] Various updates to what we consider the default branch (#28328) @eps1lon -- ​<!-- 23 -->[core] Remove experimental bundle size tracking page (#28334) @eps1lon -- ​<!-- 27 -->[core] Support release:build with cmd.exe (#28318) @michaldudak -- ​<!-- 28 -->[core] Remove unnecessary titleize warning (#28349) @eps1lon -- ​<!-- 37 -->[core] Batch small fixes (#28381) @oliviertassinari -- ​<!-- 16 -->[test] Recommend yarn t over test:watch (#28254) @eps1lon -- ​<!-- 19 -->[test] Lazily import fixtures (#28239) @eps1lon -- ​<!-- 39 -->[test] Assert on user-select that has the same value across browsers (#28378) @eps1lon - -All contributors of this release in alphabetical order: @aghArdeshir, @Aurelain, @eps1lon, @goncalovf, @jedwards1211, @m4theushw, @mbrookes, @michald -udak, @mnajdova, @nikitabobers, @praveenkumar-kalidass, @siriwatknp, @sydneyjodon-wk, @tamboliasir1, @tholman, @zadeviggers, @ZeeshanTamboli - -## 5.0.0-rc.1 - -<!-- generated comparing v5.0.0-rc.0..next --> - -_Sep 8, 2021_ - -A big thanks to the 13 contributors who made this release possible. Here are some highlights ✨: - -- 📚 Improved the codemod and migration guide for upgrading to v5 -- 🐛 Fixed some bugs and regressions - -### `@mui/material@5.0.0-rc.1` - -- ​<!-- 46 -->[Autocomplete] Fix virtualization regression (#28129) @oliviertassinari -- ​<!-- 45 -->[Button] Use deeper imports from unstyled, correct docs (#28074) @michaldudak -- ​<!-- 44 -->[ButtonBase] Fix ripple persisting on blur (#28186) @michaldudak -- ​<!-- 14 -->[Link] Infer `ref` type from `component` (#28101) @eps1lon -- ​<!-- 11 -->[Popper] Fix bundle size regression (#27910) @oliviertassinari -- ​<!-- 10 -->[Select] Merge `ref` of `Select` and `input` element (#28054) @DouglasPds -- ​<!-- 07 -->[Tabs] Improve error message formatting for invalid `value` (#28172) @eps1lon - -### `@mui/system@5.0.0-rc.1` - -- ​<!-- 47 -->[system] Change type of return value of overridesResolver (#28220) @hbjORbj -- ​<!-- 09 -->[system] Fix zero value condition (#28219) @siriwatknp -- ​<!-- 08 -->[system] Shorten class names in production (#27932) @oliviertassinari - -### `@mui/codemod@5.0.0-rc.1` - -- ​<!-- 42 -->[codemod] Fix various reported issues on `preset-safe` (#28183) @mnajdova - -### `@mui/lab@5.0.0-alpha.46` - -- ​<!-- 43 -->[ClockPicker] Fix to narrow hover area for am hours in am/pm clock (#28207) @eps1lon -- ​<!-- 13 -->[Masonry] Improve the styling on the demos (#27957) @hbjORbj -- ​<!-- 12 -->[MasonryItem] Fix crash on unmount when using React 18 (#28202) @eps1lon - -### Docs - -- ​<!-- 33 -->[docs] Fixes makeStyles migration example (#28213) @RomarQ -- ​<!-- 32 -->[docs] Fix some outdated migration guide (#28222) @siriwatknp -- ​<!-- 31 -->[docs] Update previews (#28223) @eps1lon -- ​<!-- 30 -->[docs] Demo how to use a specific slide direction for Snackbar (#28211) @goncalovf -- ​<!-- 29 -->[docs] Improve docs for creating dark theme (#28104) @mnajdova -- ​<!-- 28 -->[docs] Don't use Material theme in unstyled demos (#28073) @michaldudak -- ​<!-- 27 -->[docs] Fix api doc import example (#28199) @siriwatknp -- ​<!-- 26 -->[docs] Remove demo for re-creating Material UI switches (#28042) @eps1lon -- ​<!-- 25 -->[docs] Improve legibility of CTA on landing page (#28124) @akashshyamdev -- ​<!-- 24 -->[docs] Fix Link outdated default underline prop (#28134) @outofgamut -- ​<!-- 23 -->[docs] Fix branding theme leaking on the templates (#28120) @mnajdova -- ​<!-- 22 -->[docs] Fix wrong package name in codemod (#28118) @aleccaputo -- ​<!-- 21 -->[docs] Cancelled subscription @oliviertassinari -- ​<!-- 20 -->[docs] Remove style duplication (#28087) @oliviertassinari -- ​<!-- 19 -->[docs] Fix migration guide typo (#28113) @paullaros -- ​<!-- 18 -->[docs] Reorder app bar actions (#28089) @mnajdova -- ​<!-- 17 -->[docs] Support Material design theme in MarkdownElement (#28109) @eps1lon -- ​<!-- 16 -->[docs] Improve diamond sponsors in the navigation (#28090) @mnajdova -- ​<!-- 15 -->[docs] Remove unnecessary comma (#28072) @michaldudak -- ​<!-- 04 -->[website] Add new careers page (#28184) @hbjORbj -- ​<!-- 03 -->[website] Disable Next.js font optimization (#28128) @michaldudak -- ​<!-- 02 -->[website] Polish design-kits & templates (#28131) @siriwatknp -- ​<!-- 01 -->[website] Update utm referral params #28040 @siriwatknp - -### Core - -- ​<!-- 41 -->[core] Misc bundle size tracking improvements (#28205) @eps1lon -- ​<!-- 40 -->[core] Ensure code preview is valid JavaScript (#28215) @eps1lon -- ​<!-- 39 -->[core] Create @mui/material-next package (#28200) @michaldudak -- ​<!-- 38 -->[core] Rename directories to match the new package names (#28185) @mnajdova -- ​<!-- 37 -->[core] Remove unused include (#28187) @eps1lon -- ​<!-- 36 -->[core] Fix PR detection mechanism for upstream PRs (#28171) @eps1lon -- ​<!-- 35 -->[core] Simplify ResizeObserver logic (#28037) @oliviertassinari -- ​<!-- 34 -->[core] Include TS modules in rollup import resolution (#28094) @michaldudak -- ​<!-- 06 -->[test] Update test to consider unsuppressed double render logs in React 18 (#28068) @eps1lon -- ​<!-- 05 -->[typescript] Make types of componentsProps consistent (#27499) @michaldudak - -All contributors of this release in alphabetical order: @akashshyamdev, @aleccaputo, @DouglasPds, @eps1lon, @goncalovf, -@hbjORbj, @michaldudak, @mnajdova, @oliviertassinari, @outofgamut, @paullaros, @RomarQ, @siriwatknp - -## 5.0.0-rc.0 - -<!-- generated comparing v5.0.0-beta.5..next --> - -_Sep 1, 2021_ - -A big thanks to the 18 contributors who made this release possible. Here are some highlights ✨: - -- 🎉 Renamed packages to `@mui/*` as part of rebranding the company, following the strategy of expanding the library scope beyond Material Design. For more details about it, check the [GitHub discussion](https://github.com/mui/material-ui/discussions/27803). -- 🛠 Added `mui-replace` codemod for migrating `@material-ui/*` to new packages `@mui/*`. Check out this [codemod detail](https://github.com/mui/material-ui/blob/v5.0.0/packages/mui-codemod/README.md#mui-replace) or head to [migration guide](https://mui.com/material-ui/migration/migration-v4/#preset-safe) -- 🧪 Added new `<Mansory>` component to the lab, [check it out](https://mui.com/components/masonry/). It has been crafted by our first intern, @hbjORbj 👏! - -### `@mui/material@5.0.0-rc.0` - -#### Breaking changes - -- ​<!-- 33 -->[core] Rename packages (#28049) @mnajdova - - replace `@material-ui/*` prefix with `@mui/*`: - - ```bash - @material-ui/system -> @mui/system - @material-ui/styles -> @mui/styles - @material-ui/lab -> @mui/lab - @material-ui/types -> @mui/types - @material-ui/styled-engine -> @mui/styled-engine - @material-ui/styled-engine-sc ->@mui/styled-engine-sc - @material-ui/private-theming -> @mui/private-theming - @material-ui/codemod -> @mui/codemod - ``` - - except these 3 packages that are renamed. - - ```bash - @material-ui/core => @mui/material // represents Material Design components. - @material-ui/icons => @mui/icons-material // represents Material Design icons. - @material-ui/unstyled => @mui/base // fully functional components with minimum styles. - ``` - - > **Note**: `@mui/base` (previously `@material-ui/unstyled`) is not the same as `@material-ui/core`. - - We encourage you to use the [codemod](https://github.com/mui/material-ui/blob/v5.0.0/packages/mui-codemod/README.md#mui-replace) for smooth migration. - -#### Changes - -- ​<!-- 39 -->[Autocomplete] Update warning for `value` prop (#27977) @vedadeepta -- ​<!-- 37 -->[ButtonGroup] Update PropTypes to match augmentable interface (#27944) @aaronlademann-wf -- ​<!-- 36 -->[CardMedia] Add `image` role if `image` prop is specified but no image `component` is specified (#27676) @eps1lon -- ​<!-- 10 -->[InputBase] Fix autofill issue (#28070) @mnajdova -- ​<!-- 08 -->[Tabs] Fix indicator position when tab size changes (ResizeObserver) (#27791) @hbjORbj -- ​<!-- 06 -->[TextareaAutosize] Sync height when the width of the textarea changes (#27840) @hbjORbj -- ​<!-- 05 -->[ToggleButtonGroup] Add "disabled" prop (#27998) @chetas411 -- ​<!-- 34 -->[core] Export types for module augmentation (#28078) @m4theushw - -### `@mui/base@5.0.0-alpha.45` - -- ​<!-- 38 -->[Button] Create ButtonUnstyled and useButton (#27600) @michaldudak - -### `@mui/lab@5.0.0-rc.0` - -- ​<!-- 09 -->[Masonry] Add new component (#27439) @hbjORbj - -### `@mui/codemod@5.0.0-rc.0` - -- ​<!-- 35 -->[codemod] Add `mui-replace` codemod transform (#28060) @siriwatknp - -### Docs - -- ​<!-- 28 -->[docs] Fix preview for multiline JSX attributes (#28092) @eps1lon -- ​<!-- 27 -->[docs] Add a recommendation for hoisting GlobalStyles to static constant (#28088) @mnajdova -- ​<!-- 26 -->[docs] Update toolbar menu to behave closer to default (#28086) @oliviertassinari -- ​<!-- 25 -->[docs] Markdown redesign polish (#27956) @mnajdova -- ​<!-- 24 -->[docs] Fully translated /api/\* pages (#28044) @eps1lon -- ​<!-- 23 -->[docs] Fix matchSorter import path in Autocomplete (#28063) @StefanBRas -- ​<!-- 22 -->[docs] Fix Fab demo overflow on mobile (#28033) @rajzik -- ​<!-- 21 -->[docs] Add notistack example compatible with v5.x.x (#27881) @iamhosseindhv -- ​<!-- 20 -->[docs] Change sign-up template autocomplete to use "new-password" (#28028) @StefanTobler -- ​<!-- 19 -->[docs] Improve the support expectations for developers (#27999) @oliviertassinari -- ​<!-- 18 -->[docs] Don't use nested ternary (#27986) @eps1lon -- ​<!-- 17 -->[docs] Sync redirections from X into Core @oliviertassinari -- ​<!-- 16 -->[docs] Fix typo '.MuiOutinedInput' -> '.MuiOutlinedInput' (#27997) @rsxdalv -- ​<!-- 15 -->[docs] fix floating action button broken demo (#27976) @rajzik -- ​<!-- 14 -->[docs] Update correct variable name (#27960) @bene-we -- ​<!-- 13 -->[docs] Fix Performance typo (#27965) @tdmiller1 -- ​<!-- 12 -->[docs] Add GridExportCSVOptions page to documentation pages (#27951) @flaviendelangle -- ​<!-- 04 -->[website] Add product core page (#27952) @siriwatknp -- ​<!-- 03 -->[website] Make AppBar height and border consistent with nav header (#28085) @michaldudak -- ​<!-- 02 -->[website] Fix typos in the rebranding (#28069) @oliviertassinari -- ​<!-- 01 -->[website] Refine home, pricing and about pages (#27927) @siriwatknp - -### Core - -- ​<!-- 11 -->[eslint-plugin-material-ui] Only require translation of word characters and not API (#28043) @eps1lon -- ​<!-- 32 -->[core] Use lintable pattern for debounced callbacks (#27985) @eps1lon -- ​<!-- 31 -->[core] Remove file-wide disables of `no-use-before-define` (#27984) @eps1lon -- ​<!-- 30 -->[core] Improve `release:changelog` script (#27941) @eps1lon -- ​<!-- 29 -->[core] Enforce curly braces for block statements (#27946) @eps1lon -- ​<!-- 07 -->[test] Disable BrowserStack for PRs (#28041) @eps1lon - -All contributors of this release in alphabetical order: @aaronlademann-wf, @bene-we, @chetas411, @eps1lon, @flaviendelangle, @hbjORbj, @iamhosseindhv, @m4theushw, @michaldudak, @mnajdova, @oliviertassinari, @rajzik, @rsxdalv, @siriwatknp, @StefanBRas, @StefanTobler, @tdmiller1, @vedadeepta - -## 5.0.0-beta.5 - -<!-- generated comparing v5.0.0-beta.4..next --> - -_Aug 24, 2021_ - -A big thanks to the 26 contributors who made this release possible. Here are some highlights ✨: - -- 🐛 Fixed a lot of bugs and regressions to get us closer to the [v5 stable release milestone](https://github.com/mui/material-ui/milestone/44) -- 📚 Improved the docs and the migration guide for upgrading to v5 - -### `@material-ui/core@5.0.0-beta.5` - -#### Breaking changes - -- ​<!-- 36 --> [core] Update `.browserslistrc` file (#27788) @DanailH - - The targets of the default bundle have changed: - - - Chrome 90 (up from 84) - - Edge 91 (up from 85) - - Safari 14 (macOS) (up from 13.1) and 12.4 (iOS) (up from 12.2) - - Opera 76 (up from 70) - -- ​<!-- 43 --> [Autocomplete] Rename Value type to AutocompleteValue (#27804) @michaldudak - - The `useAutocomplete` hook used a type called `Value`. It was a very generic name for a type specific to the `Autocomplete` control, so it was removed to `AutocompleteValue`. - - ```diff - -import { Value } from '@material-ui/core/useAutocomplete'; - +import { AutocompleteValue } from '@material-ui/core/useAutocomplete'; - ``` - -#### Changes - -- ​<!-- 42 --> [AppBar] Fix transparency issue on dark mode (#27281) @will-amaral -- ​<!-- 29 --> Revert "[BottomNavigation] onClick does not fire if tapped while scrolling (#22524)" (#27690) @eps1lon -- ​<!-- 68 --> [Autocomplete] Add verbose warning for defaultValue (#27925) @vedadeepta -- ​<!-- 78 --> [Badge] Add missing classes to exported class object (#27943) @pvdstel -- ​<!-- 41 --> [ButtonGroup] Allow `size` customization via module augmentation (#27834) @aaronlademann-wf -- ​<!-- 67 --> [InputBase] Preserve host state when changing `rows` from undefined to defined (#27683) @eps1lon -- ​<!-- 18 --> [InputLabel] Apply `asterisk` class when `required` (#27738) @alexile -- ​<!-- 26 --> [Select] Fix NativeSelect propagating classes to the DOM element (#27797) @mnajdova -- ​<!-- 28 --> [Stack] Match the customization standard (#27777) @oliviertassinari -- ​<!-- 70 --> [SvgIcon] Apply custom color if defined in the theme (#27923) @eps1lon -- ​<!-- 65 --> [Switch] Add optional `track` slot to SwitchUnstyled (#27916) @michaldudak -- ​<!-- 52 --> [Tooltip] Fix broken arrow position in rtl (#27868) @mnajdova -- ​<!-- 02 --> [transitions] Allow to run Slide into a custom container (#26623) @benny0642 - -### `@material-ui/system@5.0.0-beta.5` - -#### Breaking changes - -- ​<!-- 40 --> [system] Rename `styleProps` to `ownerState` (#27830) @mnajdova - - The change was done in order to better reflect what they are, not what we think they will be used for. - - ```diff - <SomeSlotComponent - - styleProps={propsAndState} - + ownerState={propsAndState} - /> - ``` - -#### Changes - -- ​<!-- 63 --> [system] Remove dependency on `overridesResolver` for the `variants` (#27859) @mnajdova -- ​<!-- 32 --> [system] Forward `classes` prop if no slot specified in the options (#27795) @mnajdova -- ​<!-- 46 --> [system] Fix pseudo class overridden in variants (#27847) @hbjORbj - -### `@material-ui/icons@5.0.0-beta.5` - -- ​<!-- 13 --> [icons] Improve GitHub size (#27740) @oliviertassinari - -### `@material-ui/styled-engine@5.0.0-beta.5` - -- ​<!-- 27 --> [styled-engine] Remove unecessary aliases (#27779) @oliviertassinari -- ​<!-- 14 --> [styled-engine] Drop withComponent support (#27780) @oliviertassinari - -### `@material-ui/unstyled@5.0.0-alpha.44` - -- ​<!-- 07 --> [core] Utilize `CSS.supports` in `SliderUnstyled` component (#27724) @DanailH - -### `@material-ui/lab@5.0.0-alpha.44` - -- ​<!-- 54 --> [DatePicker] Fix click-away logic requiring second click in some cases (#24877) @eps1lon -- ​<!-- 05 --> [lab] Use the public API for module augmentation (#27735) @oliviertassinari -- ​<!-- 25 --> [Timeline] Fix color="inherit" on TimelineDot (#27794) @mnajdova - -### Docs - -- ​<!-- 77 --> [docs] Redesign on markdown page (#27860) @mnajdova -- ​<!-- 76 --> [docs] Split changelog into current and old (#27942) @eps1lon -- ​<!-- 74 --> [docs] Migration, emphasize theme structure change (#27935) @oliviertassinari -- ​<!-- 72 --> [docs] Fix missing `href` for AppDrawerNavItems (#27936) @eps1lon -- ​<!-- 71 --> [docs] Pass window of iframe to framed demos (#27924) @eps1lon -- ​<!-- 69 --> [docs] Simplify Select Chip demo styling (#27864) @LorenzHenk -- ​<!-- 60 --> [docs] Move from Redux to React Context (#27828) @eps1lon -- ​<!-- 58 --> [docs] Correct the useAutocomplete import path (#27805) @michaldudak -- ​<!-- 56 --> [docs] Fix Tooltip flicker when hovering between code icon and demo (#27841) @eps1lon -- ​<!-- 55 --> [docs] Don't log if a request was aborted in ServerRequestDatePicker demo (#27843) @eps1lon -- ​<!-- 53 --> [docs] Fix false-positive useToolbar warning when using the demo toolbar menu (#27842) @eps1lon -- ​<!-- 51 --> [docs] Add missing import (#27850) @nguyenyou -- ​<!-- 50 --> [docs] Fix circular integration demo (#27856) @LorenzHenk -- ​<!-- 48 --> [docs] A few examples is enough (#27874) @mekouar-mehdi -- ​<!-- 47 --> [docs] Improve README.md (#27852) @surajkumar016 -- ​<!-- 45 --> [docs] Fix rtl issue on the demos (#27865) @mnajdova -- ​<!-- 44 --> [docs] Apply the new branding theme and do the AppBar redesign (#27789) @mnajdova -- ​<!-- 39 --> [docs] Improve grammar in 'Align list items' section (#27730) @atorenherrinton -- ​<!-- 38 --> [docs] Make API documentation tables horizontally scrollable (#27787) @jakeanq -- ​<!-- 37 --> [docs] Fix typo on "Customized dialogs" section (#27827) @nomanoff -- ​<!-- 33 --> [docs] Fix Autocomplete country layout shift (#27814) @oliviertassinari -- ​<!-- 23 --> [docs] Improve accessible labels for Card demos (#27675) @eps1lon -- ​<!-- 22 --> [docs] Run in StrictMode by default (#27693) @eps1lon -- ​<!-- 21 --> [docs] Display TypeScript code of demo if requested (#27691) @eps1lon -- ​<!-- 20 --> [docs] Use country image instead of emoji (#27723) @qiweiii -- ​<!-- 17 --> [docs] Zero runtime themeAugmentation documentation (#27706) @eps1lon -- ​<!-- 15 --> [docs] Fix MobileTextStepper example to match description (#27682) @nolastemgarden -- ​<!-- 12 --> [docs] Document the transfer-list limitations (#27783) @oliviertassinari -- ​<!-- 11 --> [docs] Move TypeScript docs in context (#27782) @oliviertassinari -- ​<!-- 10 --> [docs] Prefer linking API source TypeScript (#27781) @oliviertassinari -- ​<!-- 09 --> [docs] Improve the Modal onClose migration (#27775) @oliviertassinari -- ​<!-- 08 --> [docs] Fix outdated styled-engine docs (#27778) @oliviertassinari -- ​<!-- 06 --> [docs] Improve right to left guide (#27713) @mnajdova -- ​<!-- 04 --> [docs] Consistent line break (#27728) @oliviertassinari -- ​<!-- 03 --> [docs] Don't dispatch ignored "reset code variant" actions (#27712) @eps1lon -- ​<!-- 01 --> [docs] Fix sentence to be more grammatically correct (#27733) @atorenherrinton -- ​<!-- 16 --> [examples] Add code sandbox config with node version (#27798) @qiweiii -- ​<!-- 59 --> Revert "[examples] Fix nextjs with styled-components example (#27583)" (#27921) @mnajdova -- ​<!-- 57 --> Revert "[examples] Update create-react-app examples with styled-components to use package aliases (#27591)" (#27917) @mnajdova -- ​<!-- 66 --> [I10n] Add Khmer (kh-KH) locale support (#27915) @teachhay -- ​<!-- 62 --> [website] Add templates & design-kits page (#27811) @siriwatknp -- ​<!-- 61 --> [website] Improve rebranding homepage performance (#27838) @siriwatknp -- ​<!-- 49 --> [website] Honest a11y value proposition (#27826) @eps1lon -- ​<!-- 35 --> [website] Improve homepage rebranding (#27663) @siriwatknp -- ​<!-- 24 --> [website] A few polish (#27741) @oliviertassinari -- ​<!-- 73 --> [website] Polish homepage (#27930) @oliviertassinari - -### Core - -- ​<!-- 64 --> [core] Fix various flip: false regressions (#27920) @mnajdova -- ​<!-- 31 --> [core] Fix typo in code comment (#27818) @hamidreza-nateghi -- ​<!-- 19 --> [core] Fix typos in repository (#27785) @JEONGJIHUN -- ​<!-- 75 --> [test] Current behavior when disabling components variants (#27376) @noviicee -- ​<!-- 30 --> [tests Improve test for checking if classes is forwarded to any DOM element (#27815) @mnajdova -- ​<!-- 34 --> [tests] Replace legacy `describeConformance` with `describeConformanceV5` (#27817) @mnajdova - -All contributors of this release in alphabetical order: @aaronlademann-wf, @alexile, @atorenherrinton, @benny0642, @DanailH, @eps1lon, @hamidreza-nateghi, @hbjORbj, @jakeanq, @JEONGJIHUN, @LorenzHenk, @mekouar-mehdi, @michaldudak, @mnajdova, @nguyenyou, @nolastemgarden, @nomanoff, @noviicee, @oliviertassinari, @pvdstel, @qiweiii, @siriwatknp, @surajkumar016, @teachhay, @vedadeepta, @will-amaral - -## 5.0.0-beta.4 - -<!-- generated comparing v5.0.0-beta.3..next --> - -_Aug 13, 2021_ - -A big thanks to the 19 contributors who made this release possible. Here are some highlights ✨: - -- 🐛 Grid's "auto" behavior has been fixed by @aaronlademann-wf (#27514) -- ♿ An important bug with the keyboard navigation in MenuList was fixed (#27526) @ryancogswell - -### `@material-ui/core@5.0.0-beta.4` - -#### Breaking changes - -- ​<!-- 07 -->[Grid] Fix "auto" behavior to match natural width of its content (#27514) @aaronlademann-wf - -#### Changes - -- ​<!-- 30 -->[ButtonBase] Fix tabIndex type (#27684) @kylegach -- ​<!-- 13 -->[MenuList] Fix text navigation (#27526) @ryancogswell -- ​<!-- 01 -->[l10n] Add Arabic Sudan (ar-SD) locale (#27588) @YassinHussein -- ​<!-- 23 -->[Radio] Fix size prop forwarding with custom icons (#27656) @DouglasPds -- ​<!-- 10 -->[TextField] Password visibility icons ( "visibility" ⇔ "visibility-off" ) should be reversed (#27507) @tonextone -- ​<!-- 18 -->[ToggleButton] Fix handling of color prop (#27635) @oliviertassinari - -### `@material-ui/codemods@5.0.0-beta.4` - -- ​<!-- 20 -->[codemod] Fix filename case sensitive duplicate @oliviertassinari - -### `@material-ui/system@5.0.0-beta.4` - -- ​<!-- 28 -->[StyledEngineProvider] Remove unnecessary emotion cache export (#27680) @garronej -- ​<!-- 11 -->[system] Fix missing filterProps in compose type (#27618) @R-Bower - -### `@material-ui/labs@5.0.0-alpha.42` - -- ​<!-- 27 -->[CalendarPicker] Improve contrast between enabled and disabled days (#27603) @nikitabobers -- ​<!-- 32 -->[PickersDay] Render `children` if specified (#27462) @abriginets -- ​<!-- 05 -->[TreeView] Fix TreeItem label overflow (#27585) @LorenzHenk - -### Docs - -- ​<!-- 36 -->[docs] Update guides for @material-ui/styled-engine-sc installation (#27602) @mnajdova -- ​<!-- 35 -->[docs] Document that @material-ui/styles is not strict mode compatible (#27639) @oliviertassinari -- ​<!-- 34 -->[docs] Link to "Customization of Theme" from relevant theme interfaces (#27689) @eps1lon -- ​<!-- 33 -->[docs] Update CSP page (#27627) @mnajdova -- ​<!-- 29 -->[docs] Reorder and rename "enforce value" ToggleButton demo (#27678) @LorenzHenk -- ​<!-- 12 -->[docs] Fix missing dependency in the DataGrid demo (#27597) @m4theushw -- ​<!-- 04 -->[docs] img should have a src attribute (#27632) @oliviertassinari -- ​<!-- 03 -->[docs] Add badges to Transfer List (#27634) @oliviertassinari -- ​<!-- 02 -->[docs] Recommend the `direct-import` babel plugin over `transform-import` (#27335) @umidbekk -- ​<!-- 37 -->[docs] Remove unused code (#27711) @eps1lon -- ​<!-- 39 -->[docs] Improve virtualization demo (#27340) @vedadeepta -- ​<!-- 31 -->[examples] Include a follow-up on the example (#27620) @matiasherranz -- ​<!-- 26 -->[website] Add about page (#27599) @siriwatknp -- ​<!-- 25 -->[website] Add pricing page (#27598) @siriwatknp - -### Core - -- ​<!-- 16 -->[core] Batch small changes (#27636) @oliviertassinari -- ​<!-- 06 -->[core] Change range strategy to bump (#27652) @oliviertassinari -- ​<!-- 24 -->[core] Fix visual regression example images (#27660) @eps1lon -- ​<!-- 38 -->[core] Remove diff when running yarn docs:dev (#27720) @eps1lon -- ​<!-- 22 -->[core] Remove mocks of require.context in markdown loader (#27406) @eps1lon -- ​<!-- 09 -->[core] Reduce use CSS when Checkbox disableRipple is set (#27568) @oliviertassinari -- ​<!-- 08 -->[test] Add coverage for jss-to-styled prefix from filename (#27522) @eps1lon -- ​<!-- 15 -->[test] Add current behavior for a11y name vs visible name for PickersDay (#27661) @eps1lon -- ​<!-- 17 -->[test] Dodge double logging in dev mode (#27653) @oliviertassinari -- ​<!-- 14 -->[test] Enable skipped test fixed by upstream React fix (#27615) @eps1lon -- ​<!-- 19 -->[theme] Add missed variants in Components interface (#27453) @nikitabobers - -All contributors of this release in alphabetical order: @aaronlademann-wf, @abriginets, @DouglasPds, @eps1lon, @garronej, @kylegach, @LorenzHenk, @m4theushw, @matiasherranz, @mnajdova, @nikitabobers, @oliviertassinari, @R-Bower, @ryancogswell, @siriwatknp, @tonextone, @umidbekk, @vedadeepta, @YassinHussein - -## 5.0.0-beta.3 - -<!-- generated comparing v5.0.0-beta.2..next --> - -_Aug 6, 2021_ - -A big thanks to the 15 contributors who made this release possible. Here are some highlights ✨: - -- ​<!-- 28 -->✨ `jss-to-styled` codemod has been improved to support `createStyles` and `<React.Fragment>` usage (#27578) @mnajdova - -### `@material-ui/core@5.0.0-beta.3` - -- ​<!-- 33 -->[Modal] Restore `overflowX` and `overflowY` styles (#27487) @PCOffline -- ​<!-- 07 -->[Modal] Remove unnecessary check for children.props.tabIndex (#27374) @noviicee -- ​<!-- 14 -->[Select] Fix regression for icon not rotating (#27511) @mnajdova - -### `@material-ui/system@5.0.0-beta.3` - -- ​<!-- 38 -->[system] Added top, left, right and bottom border color CSS properties to system (#27580) @R-Bower - -### `@material-ui/codemod@5.0.0-beta.3` - -- ​<!-- 28 -->[codemod] Add support for `createStyles` usage in `jss-to-styled` (#27578) @mnajdova -- ​<!-- 11 -->[codemod] Fix `jss-to-styled` PREFIX generation on Windows (#27491) @mnajdova -- ​<!-- 39 -->[codemod] Fix `jss-to-styled` codemod to handle React.Fragment as root (#27495) @mnajdova - -### `@material-ui/unstyled@5.0.0-alpha.42` - -- ​<!-- 13 -->[FormControl] Create FormControlUnstyled (#27240) @michaldudak -- ​<!-- 23 -->[Autocomplete] Move useAutocomplete to the Unstyled package (#27485) @michaldudak - -### Docs - -- ​<!-- 40 -->[docs] Fix layout shift when opening hash anchor (#27619) @oliviertassinari -- ​<!-- 35 -->[docs] Add TypeScript guide for the `sx` prop (#27417) @mnajdova -- ​<!-- 32 -->[docs] Hardcode listed colors in /customization/color/#playground (#27446) @eps1lon -- ​<!-- 31 -->[docs] Bring back Select#onChange signature API (#27443) @eps1lon -- ​<!-- 27 -->[docs] Remove backticks in the title (#27567) @oliviertassinari -- ​<!-- 26 -->[docs] Fix 404 links (#27566) @oliviertassinari -- ​<!-- 25 -->[docs] Use the same h2 for the customization demos (#27569) @oliviertassinari -- ​<!-- 22 -->[docs] Fix syntax error in v5 migration `styled` api example (#27518) @kimbaudi -- ​<!-- 21 -->[docs] Improve SSR configuration with emotion (#27496) @frandiox -- ​<!-- 19 -->[docs] Change "pseudo-classes" to "state classes" (#27570) @michaldudak -- ​<!-- 18 -->[docs] Add StackBlitz edit demo integration (#27391) @sulco -- ​<!-- 12 -->[docs] Remove unnecessary generic argument (#27516) @bezpalko -- ​<!-- 08 -->[docs] Add customization demos (#27411) @siriwatknp -- ​<!-- 04 -->[docs] Restore initial descriptionRegExp logic (#27436) @oliviertassinari -- ​<!-- 03 -->[docs] Polish jss-to-styled docs (#27457) @oliviertassinari -- ​<!-- 34 -->[examples] Fix nextjs with styled-components example (#27583) @mnajdova -- ​<!-- 29 -->[examples] Update create-react-app examples with styled-components to use package aliases (#27591) @mnajdova -- ​<!-- 09 -->[examples] Improve integration examples with Next.js (#27331) @Harshita-Kanal -- ​<!-- 37 -->[website] Add spicefactory as gold sponsor @oliviertassinari -- ​<!-- 30 -->[website] Homepage rebranding (#27488) @siriwatknp -- ​<!-- 24 -->[website] Add Flavien to team and about pages (#27575) @flaviendelangle -- ​<!-- 17 -->[website] Add Ryan to Community contributors for Stack Overflow contributions (#27529) @ryancogswell -- ​<!-- 02 -->[website] Add references section to home (#27444) @siriwatknp - -### Core - -- ​<!-- 20 -->[core] rebaseWhen=auto does not seem to work (#27565) @oliviertassinari -- ​<!-- 10 -->[core] Improve instructions for the @material-ui/styles migration (#27466) @mnajdova -- ​<!-- 06 -->[core] Batch small changes (#27435) @oliviertassinari -- ​<!-- 01 -->[core] Receive patch and minor dependency updates (#27455) @eps1lon -- ​<!-- 16 -->[test] Update coverage to include all @material-ui packages (#27521) @eps1lon -- ​<!-- 15 -->[test] Lint codemod tests (#27519) @eps1lon -- ​<!-- 05 -->[test] Allow tests to run for 6s before timeout (#27456) @oliviertassinari - -All contributors of this release in alphabetical order: @bezpalko, @eps1lon, @flaviendelangle, @frandiox, @Harshita-Kanal, @kimbaudi, @michaldudak, @mnajdova, @noviicee, @oliviertassinari, @PCOffline, @R-Bower, @ryancogswell, @siriwatknp, @sulco - -## 5.0.0-beta.2 - -<!-- generated comparing v5.0.0-beta.1..next --> - -_Jul 26, 2021_ - -A big thanks to the 20 contributors who made this release possible. Here are some highlights ✨: - -- ✨ We introduced new codemod for converting JSS styles to emotion (#27292) @siriwatknp - It should help adoption of v5, by making possible the removal of JSS sooner. - -- 🐛 The majority of other changes in this release were bug fixes, test utilities and docs. - -### `@material-ui/core@5.0.0-beta.2` - -- ​<!-- 54 -->[Autocomplete] Explain how the loading prop works (#27416) @michaldudak -- ​<!-- 49 -->[Autocomplete] Update input value when the input changes (#27313) @turtleseason -- ​<!-- 09 -->[Autocomplete] Popper is not closing when the Autocomplete is disabled (#27312) @Goodiec -- ​<!-- 42 -->[Checkbox] Skip default hover styles with `disableRipple` (#27314) @faan234 -- ​<!-- 50 -->[Dialog] Fix override paper styles (#27423) @newsiberian -- ​<!-- 17 -->[Grid] Remove width prop for rowSpacing (#27326) @sashkopavlenko -- ​<!-- 33 -->[Input] Merge `componentsProps` correctly (#27371) @mnajdova -- ​<!-- 55 -->[Pagination] Fixed usePagination requires @emotion in development mode (#27348) @ruppysuppy -- ​<!-- 07 -->[Pagination] Fix :hover effect on previous/next button (#27304) @Aubrey-Li -- ​<!-- 03 -->[Popper] Consistent timing of popper instance creation (#27233) @eps1lon -- ​<!-- 45 -->[Select] Add `SelectChangeEvent` for accurate types for event in onChange prop (#27370) @eps1lon -- ​<!-- 18 -->[Tabs] Use theme transition duration for the Tab animation (#27303) @florianbepunkt -- ​<!-- 35 -->[TextField] Allow custom colors in FormLabel (#27337) @oliviertassinari -- ​<!-- 14 -->[TextField] Fix name of componentsProps (#27338) @oliviertassinari -- ​<!-- 04 -->[transitions] Make sure inline styles used for transition values if declared (#27140) @eps1lon - -### `@material-ui/codemod@5.0.0-beta.2` - -- ​<!-- 57 -->[codemod] Add `optimal-imports` for v5 (#27404) @mnajdova -- ​<!-- 48 -->[codemod] Add jss to emotion codemod (#27292) @siriwatknp -- ​<!-- 34 -->[codemod] Fix running codemod CLI on Windows (#27395) @michaldudak -- ​<!-- 32 -->[codemod] Fix published version (#27384) @eps1lon -- ​<!-- 10 -->[codemod] Improve README.md (#27257) @mnajdova - -### `@material-ui/unstyled@5.0.0-alpha.41` - -- ​<!-- 36 -->[NoSsr] Move NoSsr to the Unstyled package (#27356) @michaldudak - -### `@material-ui/utils@5.0.0-beta.1` - -- ​<!-- 43 -->[utils] Convert createChainedFunction to TypeScript (#27386) @eps1lon - -### `@material-ui/system@5.0.0-beta.2` - -- ​<!-- 39 -->[system] Compute display name of `styled` component if `name` isn't set (#27401) @eps1lon -- ​<!-- 08 -->[system] Adds missing type for `shouldForwardProp` (#27310) @KLubin1 - -### `@material-ui/lab@5.0.0-alpha.41` - -- ​<!-- 58 -->[pickers] Only accept dates from adapters in min/max props (#27392) @eps1lon -- ​<!-- 15 -->[pickers] Fallback to today if all possible dates are disabled (#27294) @eps1lon -- ​<!-- 06 -->[pickers] Minify error when LocalizationProvider is missing (#27295) @eps1lon -- ​<!-- 01 -->[pickers] Fix Fade animation behavior change (#27283) @oliviertassinari - -### Docs - -- ​<!-- 56 -->[docs] Display Popper arrow correctly (#27339) @Patil2099 -- ​<!-- 53 -->[docs] Focus pickers introduction on Material UI (#27394) @eps1lon -- ​<!-- 51 -->[docs] Fix wrong import path in @material-ui/styles section (#27427) @WeldonTan -- ​<!-- 47 -->[docs] Update color imports (#27321) @siriwatknp -- ​<!-- 38 -->[docs] Sync params of callbacks between types and JSDoc description (#27366) @eps1lon -- ​<!-- 37 -->[docs] Add migration note for synthetic native events in onChange (#27368) @eps1lon -- ​<!-- 31 -->[docs] Improve unstyled docs (#27382) @oliviertassinari -- ​<!-- 30 -->[docs] Update `Transitions` page (#27319) @siriwatknp -- ​<!-- 29 -->[docs] Add Unstyled components docs page (#27158) @michaldudak -- ​<!-- 28 -->[docs] Fix app bar regression (#27373) @mnajdova -- ​<!-- 27 -->[docs] Update migration guide to have a section on nested classes (#27354) @mnajdova -- ​<!-- 25 -->[docs] Convert App\* components to emotion (#27150) @eps1lon -- ​<!-- 23 -->[docs] Fix duplicate "Theme" header (#27353) @eps1lon -- ​<!-- 22 -->[docs] Remove horizontal scrollbar in MiniDrawer (#27055) @AlvesJorge -- ​<!-- 21 -->[docs] Add `makeStyles` explanation in troubleshooting (#27322) @siriwatknp -- ​<!-- 20 -->[docs] Fix ExpansionPanel migration notes (#27352) @eps1lon -- ​<!-- 19 -->[docs] Transpile markdown files (#27349) @eps1lon -- ​<!-- 12 -->[docs] Fix typo in the word typography (#27329) @tudi2d -- ​<!-- 11 -->[docs] Use actual symbol of kilogram (#27332) @getsnoopy -- ​<!-- 02 -->[docs] Make migration doc easier to follow (#26948) @siriwatknp -- ​<!-- 46 -->[examples] Cleanup `gatsby` examples (#27375) @mnajdova -- ​<!-- 41 -->[examples] Create nextjs example using styled-components (#27088) @hboylan -- ​<!-- 26 -->[examples] Update gatsby example to use custom plugin (#27357) @mnajdova - -### Core - -- ​<!-- 24 -->[core] Remove obsolete styles documentation (#27350) @eps1lon -- ​<!-- 13 -->[core] Fix GitHub language detection (#27298) @oliviertassinari -- ​<!-- 44 -->[test] Include coverage report of browser tests (#27389) @eps1lon -- ​<!-- 40 -->[test] Add current behavior for getDisplayName with context components (#27402) @eps1lon -- ​<!-- 05 -->[test] Enable skipped picker tests (#27268) @eps1lon -- ​<!-- 52 -->[website] Add hero section to homepage (#27364) @siriwatknp - -All contributors of this release in alphabetical order: @AlvesJorge, @Aubrey-Li, @eps1lon, @faan234, @florianbepunkt, @g -etsnoopy, @Goodiec, @hboylan, @KLubin1, @michaldudak, @mnajdova, @newsiberian, @oliviertassinari, @Patil2099, @ruppysupp -y, @sashkopavlenko, @siriwatknp, @tudi2d, @turtleseason, @WeldonTan - -## 5.0.0-beta.1 - -<!-- generated comparing v5.0.0-beta.0..next --> - -_Jul 14, 2021_ - -A big thanks to the 17 contributors who made this release possible. Here are some highlights ✨: - -- ✨ We have introduced a new unstyled component: the Switch (#26688) @michaldudak - You can find two new versions of the Switch. A component without any styles: [`SwitchUnstyled`](https://mui.com/components/switches/#unstyled), and a hook: [`useSwitch`](https://mui.com/components/switches/#useswitch-hook). - - <a href="https://mui.com/components/switches/#unstyled"><img width="832" alt="switch" src="https://user-images.githubusercontent.com/3165635/125192249-236f8a80-e247-11eb-9df9-17d476379a32.png"></a> - - You can follow our progress at https://github.com/mui/base-ui/issues/10. - -- 💄 We have updated the default `info` `success` `warning` color to be more accessible (#26817) @siriwatknp. - You can find the new [default values](https://mui.com/material-ui/customization/palette/#default-values) in the documentation. - - <a href="https://mui.com/customization/palette/#default-values"><img width="780" alt="colors" src="https://user-images.githubusercontent.com/3165635/125192657-4864fd00-e249-11eb-9dc1-44857b25b3b8.png"></a> - -### `@material-ui/core@5.0.0-beta.1` - -#### Breaking changes - -- [Fab] Remove no longer necessary span wrapper (#27112) @siriwatknp -- [ToggleButton] Remove no longer necessary span wrapper (#27111) @siriwatknp - -#### Changes - -- [Autocomplete] Add componentsProps (#27183) @michal-perlakowski -- [Avatar] Fix support for crossOrigin (#27013) @ShirasawaSama -- [ButtonBase] Correct `disableRipple` API description (#27187) @michaldudak -- [ButtonGroup] Add color palette types (#27215) @ShirasawaSama -- [SwitchBase] Bring back `checked` and mark as deprecated (#27047) @siriwatknp -- [TextField] Remove redundant useFormControl implementation (#27197) @michaldudak -- [theme] Add missing MuiRating types to components.d.ts (#27086) @rajzik -- [theme] Remove `createV4Spacing` from `adaptV4Theme` (#27072) @siriwatknp -- [theme] Update default `info` `success` `warning` color (#26817) @siriwatknp -- [ToggleButton] Add color palette types (#27046) @ShirasawaSama -- [ToggleButton] Fix the api page (#27164) @oliviertassinari - -### `@material-ui/unstyled@5.0.0-alpha.40` - -- [Switch] Create SwitchUnstyled and useSwitch (#26688) @michaldudak - -### `@material-ui/codemod@5.0.0-beta.1` - -- [codemod] Add v5 important migration (#27032) @siriwatknp -- [codemod] Fix v5 codemods on Windows (#27254) @michaldudak - -### `@material-ui/system@5.0.0-beta.1` - -- [Box] Add breakpoint value support to maxWidth prop (#26984) @ansh-saini - -### `@material-ui/lab@5.0.0-alpha.40` - -- [CalendarPicker] Fix slide transition regression (#27273) @eps1lon -- [CalendarPicker] Use transition components from core instead of a custom implementation (#27043) @eps1lon -- [pickers] Fix default value of text keys (#26990) @oliviertassinari -- [TimePicker] Change default minutes and seconds to zero (#27037) @michal-perlakowski - -### Docs - -- [blog] Q2 2021 Update (#27089) @oliviertassinari -- [docs] Add information that the label prop in FormControlLabel is now @michal-perlakowski -- [docs] Don't crash page if an Ad crashes (#27178) @eps1lon -- [docs] Fix alt description of movavi backer @oliviertassinari -- [docs] Fix import source of hidden component (#27116) @vimutti77 -- [docs] Fix layout regression (#27272) @oliviertassinari -- [docs] Fix syntax error in /styles/api markdown (#27176) @sahil-blulabs -- [docs] Fix the link for the sx props page (#27202) @mnajdova -- [docs] Fix theme context example code (#27053) @moshfeu -- [docs] Fix typo in CONTRIBUTING.md (#27218) Ayush Dubey -- [docs] Fix typos (#27074) @michaldudak -- [docs] Improve nav semantics (#27138) @eps1lon -- [docs] Migrate Ad\* components to emotion (#27159) @mnajdova -- [docs] Migrate rest of the docs to emotion (#27184) @mnajdova -- [docs] Move versions from \_app PageContext to page-specific context (#27078) @eps1lon -- [docs] Only bundle one version of the demos in production (#27020) @eps1lon -- [docs] Reduce layout shift on landing page (#27251) @eps1lon -- [docs] Remove Ethical Ads (#27173) @mbrookes -- [docs] Remove unused fs polyfill (#27069) @eps1lon -- [docs] Remove usage of `url` package (#27151) @eps1lon -- [docs] Replace react-text-mask with react-imask in integration example (#27071) @michal-perlakowski -- [docs] Sort the size in a more logical order (#27186) @oliviertassinari -- [docs] Use actual link to paperbase (#27063) @eps1lon -- [docs] Use custom markdown loader for landing page (#27065) @eps1lon -- [docs] Use Webpack 5 (#27077) @eps1lon -- [examples] Fix CDN warning (#27229) @oliviertassinari -- [examples] Remove `StyledEngineProvider` as JSS is not used (#27133) @mnajdova -- [examples] Remove forgotten StyledEngineProvider (#27163) @oliviertassinari - -### Core - -- [core] Batch small changes (#26970) @oliviertassinari -- [core] Configure Renovate (#27003) @renovate[bot] -- [core] Migrate remaining mentions of Dependabot to Renovate (#27118) @eps1lon -- [core] Run yarn deduplicate on Renovate updates (#27115) @eps1lon -- [test] Document broken React 18 behavior of Autocomplete (#27242) @eps1lon -- [test] Increase BS timeout to 6min (#27179) @oliviertassinari -- [test] Migrate regressions to emotion (#27010) @vicasas -- [test] Narrow down React 18 compat issues (#27134) @eps1lon -- [test] Remove StyledEngineProvider usage from regressions and e2e test @mnajdova -- [test] Run React 18 integration tests with new createRoot API (#26672) @eps1lon -- [test] Update tests with latest state of StrictMode compatibility (#27042) @eps1lon -- [test] Use DOM events instead of mocked, partial events (#27198) @eps1lon -- [website] Open 4 new roles (#27123) @oliviertassinari -- [blog] Danilo Leal joins Material UI (#27231) @oliviertassinari - -All contributors of this release in alphabetical order: @eps1lon, @mbrookes, @michal-perlakowski, @michaldudak, @mnajdova, @moshfeu, @oliviertassinari, @rajzik, @renovate[bot], @sahil-blulabs, @ShirasawaSama, @siriwatknp, @vimutti77 - -## 5.0.0-beta.0 - -<!-- generated comparing v5.0.0-alpha.38..next --> - -_Jul 01, 2021_ - -A big thanks to the 13 contributors who made this release possible. Here are some highlights ✨: - -- 🎉 This is the first beta release of v5! A huge thanks to everyone who helped to make this happen! We're targeting the 1st of September for a stable release, and will use the next two months to polish v5, and ease the migration from v4. You can follow [the v5 stable milestone](https://github.com/mui/material-ui/milestone/44) for more details. We now encourage any new projects to start on v5. -- 🚀 We have completed all the planned breaking changes. -- ⚒️ We added the codemod CLI to simplify migration to v5 (#26941) @eps1lon. You can find it at [`@material-ui/codemod`](https://github.com/mui/material-ui/tree/HEAD/packages/mui-codemod). -- 🐛 The majority of other changes in this release were bug fixes, test utilities and docs. - -### `@material-ui/core@5.0.0-beta.0` - -#### Breaking changes - -- [Tabs] Remove unnecessary wrapper from Tab (#26926) @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 - <button class="MuiTab-root"> - - <span class="MuiTab-wrapper"> - {icon} - {label} - - </span> - </button> - ``` - -- [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 - <button class="MuiBottomNavigationAction-root"> - - <span class="MuiBottomNavigationAction-wrapper"> - {icon} - <span class="MuiBottomNavigationAction-label"> - {label} - </span> - - </span> - </button> - ``` - -#### Changes - -- ​<!-- 19 -->[Box] Fix TypeScript error on maxWidth prop (#26859) @ansh-saini -- ​<!-- 04 -->[Dialog] Automatically label by its DialogTitle (#26814) @eps1lon -- ​<!-- 32 -->[Hidden] Bring back and mark as deprecated (#26908) @siriwatknp -- ​<!-- 53 -->[List] Add button runtime deprecation warning (#26743) @siriwatknp -- ​<!-- 03 -->[Modal] Type BackdropProps according to styled version (#26836) @eps1lon -- ​<!-- 21 -->[Radio] Fix `defaultValue` to match the other value types (#26945) @oliviertassinari -- ​<!-- 48 -->[Stepper] Add completed to global pseudo-classes (#26953) @michal-perlakowski -- ​<!-- 25 -->[Stepper] Fix support for no connectors (#26874) @varandasi -- ​<!-- 20 -->[TextField] Prevent `hiddenLabel` from spreading to DOM (#26864) @siriwatknp -- ​<!-- 18 -->[TextField] Fix label disappearing when focusing a button (#26933) @michal-perlakowski - -### `@material-ui/codemod@5.0.0-beta.0` - -- ​<!-- 37 -->[codemod] Add CLI (#26941) @eps1lon - -### @material-ui/icons@5.0.0-beta.0 - -- ​<!-- 29 -->[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 - <DatePicker - label="Helper text example" - value={value} - onChange={onChange} - renderInput={(params) => ( - - <TextField {...params} /> - + <TextField {...params} helperText={params?.inputProps?.placeholder} /> - )} - > - ``` - -#### Changes - -- ​<!-- 12 -->[lab] Fix missing dependency on unstyled (#26937) @fishyFrogFace -- ​<!-- 50 -->[pickers] Consider TDate in ToolbarComponent types (#27035) @michal-perlakowski - -### `@material-ui/system@5.0.0-beta.0` - -- ​<!-- 14 -->[system] Support array overridesResolver (#26824) @siriwatknp - -### Docs - -- ​<!-- 49 -->[docs] Add notes to Table demo about stableSort (#27025) @CarlosGomez-dev -- ​<!-- 47 -->[docs] Add gold sponsor (#26968) @oliviertassinari -- ​<!-- 42 -->[docs] Update unstyled demos to not depend on `@material-ui/core` (#26869) @mnajdova -- ​<!-- 41 -->[docs] Fix demo paths in windows (#27004) @eps1lon -- ​<!-- 40 -->[docs] Export all locales (#27002) @eps1lon -- ​<!-- 38 -->[docs] Misc CONTRIBUTING.md changes (#26925) @eps1lon -- ​<!-- 35 -->[docs] Fix /components/hidden merge conflict (#26997) @eps1lon -- ​<!-- 26 -->[docs] Fix 404 links (#26963) @oliviertassinari -- ​<!-- 24 -->[docs] Remove link that points to v4 blog post (#26960) @steveafrost -- ​<!-- 16 -->[docs] Use custom Webpack loader for markdown (#26774) @eps1lon -- ​<!-- 11 -->[docs] Fix 301 links (#26942) @oliviertassinari -- ​<!-- 01 -->[docs] Add page for the `sx` prop (#26769) @mnajdova -- ​<!-- 52 -->[docs] pre-fill issue when a demo crashes (#27034) @eps1lon -- ​<!-- 54 -->[docs] Move styled page under system (#26818) - -### Core - -- ​<!-- 46 -->[core] Inline rollup-plugin-size-snapshot (#26986) @eps1lon -- ​<!-- 43 -->[core] Remove unused props clone (#26992) @oliviertassinari -- ​<!-- 36 -->[core] Fix tests on Windows (#26931) @michaldudak -- ​<!-- 31 -->[core] Fix merge conflict between #26954 and #26874 @oliviertassinari -- ​<!-- 22 -->[core] Upgrade issues-helper to v2 (#26955) @michal-perlakowski -- ​<!-- 05 -->[core] Fix merge conflict (#26928) @eps1lon -- ​<!-- 45 -->[test] Convert HiddenCSS tests to testing-library (#27019) @eps1lon -- ​<!-- 44 -->[test] Convert NativeSelectInput tests to testing-library (#26952) @eps1lon -- ​<!-- 39 -->[test] Add a default mount implementation to conformance tests (#26949) @eps1lon -- ​<!-- 28 -->[test] Update tests to pass react@next (#26967) @eps1lon -- ​<!-- 27 -->[test] Add types to describeConformanceV5 (#26954) @eps1lon -- ​<!-- 17 -->[test] Use createPickerMount where appropriate (#26951) @eps1lon -- ​<!-- 15 -->[test] Convert SwipeableDrawer tests to testing-library (#26916) @eps1lon -- ​<!-- 13 -->[test] Convert Menu tests to testing-library (#26915) @eps1lon -- ​<!-- 10 -->[test] Convert Popover tests to testing-library (#26913) @eps1lon -- ​<!-- 08 -->[test] Convert Modal tests to testing-library (#26912) @eps1lon -- ​<!-- 07 -->[test] Make remaining testing-library tests StrictMode compatible (#26924) @eps1lon -- ​<!-- 51 -->[test] Only allow wrapping enzyme mount not creating (#27018) @eps1lon -- ​<!-- 06 -->[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 - -<!-- generated comparing v5.0.0-alpha.37..next --> - -_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). - - <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> - -- 💡 `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 - - <a href="https://mui.com/components/links/"><img width="543" alt="" src="https://user-images.githubusercontent.com/3165635/123097983-ef1b6200-d430-11eb-97da-b491fba5df49.png"></a> - -### `@material-ui/core@5.0.0-alpha.38` - -#### Breaking changes - -- ​<!-- 05 -->[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 - <Menu - + anchorOrigin={{ - + vertical: 'top', - + horizontal: 'left', - + }} - ``` - - - The `MenuItem` component inherits the `ButtonBase` component instead of `ListItem`. The class names related to "MuiListItem-\*" are removed and theming `ListItem` is no longer affecting `MenuItem`. - - ```diff - -<li className="MuiButtonBase-root MuiMenuItem-root MuiListItem-root"> - +<li className="MuiButtonBase-root MuiMenuItem-root"> - ``` - - - The prop `listItemClasses` was removed, you can use `classes` instead. - - ```diff - -<MenuItem listItemClasses={{...}}> - +<MenuItem classes={{...}}> - ``` - -- ​<!-- 09 -->[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, - }, - }, - }); - ``` - -- ​<!-- 10 -->[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 - - <IconButton> - + <IconButton size="large"> - ``` - -- ​<!-- 08 -->[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/). - - <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> - - You can reduce the density of the slider, closer to v4 with the [`size="small"` prop](https://mui.com/components/slider/#sizes). - - <a href="https://mui.com/components/slider/#sizes"><img width="330" alt="" src="https://user-images.githubusercontent.com/3165635/123076549-8aa0d880-d419-11eb-8835-06cd2b21b2d3.png" style="margin: auto"></a> - -- ​<!-- 14 -->[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 - <button class="MuiIconButton-root"> - - <span class="MuiIconButton-label"> - <svg /> - - </span> - </button> - ``` - -- ​<!-- 19 -->[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 - -- ​<!-- 33 -->[Alert] Add support for custom colors (#26831) @varandasi -- ​<!-- 32 -->[Button] Fix loading text invisible when disabled (#26857) @DanielBretzigheimer -- ​<!-- 43 -->[ButtonBase] Consider as a link with a custom component and `to` prop (#26576) @shadab14meb346 -- ​<!-- 17 -->[ButtonBase] Derive state on render instead of in layout effects (#26762) @eps1lon -- ​<!-- 37 --> [Drawer] Fix incorrect z-index (#26791) @michal-perlakowski -- ​<!-- 28 -->[Drawer] Remove incorrect transition handler props (#26835) @eps1lon -- ​<!-- 01 -->[Link] Improve accessibility support (#26145) @ahmed-28 -- ​<!-- 41 -->[Modal] Fix calculating scrollbar size when using custom scrollbar (#26816) @michal-perlakowski -- ​<!-- 29 -->[Rating] Make input ids less predictable (#26493) @eps1lon -- ​<!-- 27 -->[Stepper] Add componentsProps.label to StepLabel (#26807) @michal-perlakowski -- ​<!-- 36 -->[Tabs] Show error when Tab has display: none (#26783) @michal-perlakowski -- ​<!-- 46 -->[theme] Add base color palette type to components (#26697) @siriwatknp - -### `@material-ui/system@5.0.0-alpha.38` - -#### Breaking Changes - -- ​<!-- 35 -->[system] Normalize api for `createBox` (#26820) @mnajdova - - ```diff - import { createBox } from '@material-ui/system'; - - -const styled = createBox(defaultTheme); - +const styled = createBox({ defaultTheme }); - ``` - -#### Changes - -- ​<!-- 12 -->[system] Add ThemeProvider component (#26787) @mnajdova - -### Docs - -- ​<!-- 45 -->[docs] Fix misspelling of the word Typography (#26898) @dmrqx -- ​<!-- 42 -->[docs] Instruct users to install @material-ui/icons with the next tag (#26873) @michal-perlakowski -- ​<!-- 26 -->[docs] Sync translations (#26828) @l10nbot -- ​<!-- 25 -->[docs] Improve grammar of autocomplete/autofill section (#26798) @dijonkitchen -- ​<!-- 18 -->[docs] Explain "inherited props" better in the props table (#26778) @eps1lon -- ​<!-- 16 -->[docs] Fix documentation for upgrading to v5 (#26812) @tungdt-90 -- ​<!-- 13 -->[docs] Improve notification color (#26796) @mnajdova -- ​<!-- 11 -->[docs] Fix various a11y issues with /customization/color (#26757) @eps1lon -- ​<!-- 04 -->[docs] Move custom theme to frame (#26744) @siriwatknp -- ​<!-- 02 -->[docs] Fix small PT typo fix: inciar -> iniciar (#26775) @brunocavalcante -- ​<!-- 03 -->[I10n] Add Chinese (Hong Kong) (zh-HK) locale (#26637) @kshuiroy -- ​<!-- 44 -->[l10n] Add sinhalese (siLK) locale (#26875) @pavinduLakshan -- ​<!-- 39 -->[examples] Rename Next.js TypeScript theme from tsx to ts (#26862) @Izhaki - -### Core - -- ​<!-- 38 -->[test] Fix Drawer test API @oliviertassinari -- ​<!-- 34 -->[test] Adjust expected useAutocomplete error messages for React 18 (#26858) @eps1lon -- ​<!-- 30 -->[test] Convert Drawer tests to testing-library (#26837) @eps1lon -- ​<!-- 23 -->[test] Convert remaining enzyme tests to testing-library (#26832) @eps1lon -- ​<!-- 22 -->[test] Ignore ReactDOM.hydrate deprecation warnings (#26815) @eps1lon -- ​<!-- 06 -->[test] Reduce flakiness (#26761) @eps1lon -- ​<!-- 07 -->[useId] Reduce likelyhood of collisions (#26758) @eps1lon -- ​<!-- 31 -->yarn deduplicate @oliviertassinari -- ​<!-- 21 -->Fix running framer's prettier under pwsh (#26819) @michaldudak -- ​<!-- 40 -->[core] Update babel-plugin-optimize-clsx (#26861) @oliviertassinari -- ​<!-- 24 -->[core] Assume no document.all at runtime (#26821) @eps1lon -- ​<!-- 20 -->[core] Remove dependency on `@material-ui/private-theming` (#26793) @mnajdova -- ​<!-- 15 -->[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 - -<!-- generated comparing v5.0.0-alpha.36..next --> - -_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 - <Grid container spacing={{ xs: 2, md: 3 }} columns={{ xs: 1, sm: 2, md: 3 }}> - <Grid item xs={2} sm={4} md={4} /> - <Grid item xs={2} sm={4} md={4} /> - <Grid item xs={2} sm={4} md={4} /> - </Grid> - ``` - - 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 - -- ​<!-- 10 -->[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 - <button class="MuiButton-root"> - - <span class="MuiButton-label"> - children - - </span> - </button> - ``` - -#### Changes - -- ​<!-- 08 -->[Button] Add missing color type (#26593) @sakura90 -- ​<!-- 07 -->[Grid] Add responsive direction and spacing props (#26590) @likitarai1 -- ​<!-- 05 -->[List] Add ListItemButton export to index (#26667) @chadmuro -- ​<!-- 09 -->[theme] Fix missing exported Breakpoints types (#26684) @robphoenix - -### `@material-ui/system@5.0.0-alpha.37` - -#### Breaking changes - -- ​<!-- 26 -->[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 - -- ​<!-- 16 -->[system] Add useThemeProps & useTheme hooks (#26649) @mnajdova -- ​<!-- 15 -->[system] Add color manipulators (#26668) @mnajdova -- ​<!-- 06 -->[system] Fix support of custom shape in createTheme (#26673) @varandasi - -### `@material-ui/unstyled@5.0.0-alpha.37` - -- ​<!-- 04 -->[Slider] Improve TS definition (#26642) @mnajdova -- ​<!-- 21 -->[FocusTrap] Capture nodeToRestore via relatedTarget (#26696) @eps1lon - -### `@material-ui/icons@5.0.0-alpha.37` - -- ​<!-- 03 -->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` - -- ​<!-- 29 -->[core] Remove unused useKeyDown (#26765) @eps1lon -- ​<!-- 28 -->[DateTimePicker] Fix not visible selected tab icon (#26624) @nikitabobers - -### Docs - -- ​<!-- 20 -->[blog] Michał Dudak joins Material UI (#26700) @oliviertassinari -- ​<!-- 27 -->[docs] Migrate onepirate premium template to emotion part2 (#26707) @vicasas -- ​<!-- 24 -->[docs] Fix TextField demo layout (#26710) @vicasas -- ​<!-- 19 -->[docs] Improve Paperbase demo (#26711) @oliviertassinari -- ​<!-- 17 -->[docs] Migrate onepirate premium template to emotion part1 (#26671) @vicasas -- ​<!-- 14 -->[docs] Migrate paperbase premium template to emotion (#26658) @vicasas -- ​<!-- 25 -->[List] Fix demo to have correct semantic (#26742) @siriwatknp - -### Core - -- ​<!-- 23 -->[core] Monitore size of key system modules (#26712) @oliviertassinari -- ​<!-- 22 -->[core] Batch small changes (#26738) @oliviertassinari -- ​<!-- 18 -->[core] Batch small changes (#26628) @oliviertassinari -- ​<!-- 13 -->[test] Ignore ReactDOM.render deprecation warning (#26683) @eps1lon -- ​<!-- 12 -->[test] Run e2e test with React 18 on a schedule (#26690) @eps1lon -- ​<!-- 11 -->[test] Count profiler renders not passive effects (#26678) @eps1lon -- ​<!-- 02 -->[test] Bundling fixtures should not override source build with published build (#26657) @eps1lon -- ​<!-- 01 -->[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 - -<!-- generated comparing v5.0.0-alpha.35..next --> - -_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 `<ListItem button />` 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. - <img width="549" alt="grid spacing demo" src="https://user-images.githubusercontent.com/3165635/121089288-383fa500-c7e7-11eb-8c43-53457b7430f1.png"> - - 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 - -- ​<!-- 10 -->[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 - <AppBar enableColorOnDark /> - ``` - -- ​<!-- 13 -->[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'; - ``` - -- ​<!-- 03 -->[SwitchBase] Replace IconButton with ButtonBase (#26460) @siriwatknp -- ​<!-- 25 -->[theme] Improve default `primary`, `secondary` and `error` theme palette (#26555) @siriwatknp - -#### Changes - -- ​<!-- 17 -->[Box] Fix module 'clsx' not found in system (#26553) @coder-freestyle -- ​<!-- 07 -->[Box] Fix runtime error when using styled-components without ThemeProvider (#26548) @mnajdova -- ​<!-- 27 -->[Radio][checkbox] Don't forward `color` to DOM elements (#26625) @siriwatknp -- ​<!-- 01 -->[Dialog] Flatten DialogTitle DOM structure, remove `disableTypography` (#26323) @eps1lon -- ​<!-- 31 -->[Grid] Add rowSpacing and columnSpacing props (#26559) @likitarai1 -- ​<!-- 34 -->[List] extract button from ListItem to ListItemButton (#26446) @siriwatknp -- ​<!-- 23 -->[Popover] Fix PaperProps.ref breaking positioning (#26560) @vedadeepta -- ​<!-- 19 -->[Rating] onChangeActive shouldn't be fired on blur/focus (#26584) @coder-freestyle -- ​<!-- 11 -->[Select] Fix custom font size centering arrow (#26570) @sarahannnicholson -- ​<!-- 06 -->[styled] Convert implicit styleProps to explicit (#26461) @mnajdova@siriwatknp -- ​<!-- 08 -->[Tabs] Fix RTL indicator (#26470) @siriwatknp -- ​<!-- 02 -->[Tabs] Fix arrow rotation in vertical & RTL (#26527) @siriwatknp -- ​<!-- 20 -->[TextField] Fix support for custom `size` prop value (#26585) @coder-freestyle -- ​<!-- 04 -->[Tooltip] Finish exiting once started (#26535) @eps1lon - -### `@material-ui/icons@5.0.0-alpha.36` - -#### Breaking changes - -- ​<!-- 15 -->[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 - -- ​<!-- 29 -->[pickers] Remove `openPickerIcon` prop in favor of `components.OpenPickerIcon` (#26223) @vedadeepta - - ```diff - <DateTimePicker - components={{ - LeftArrowIcon: AlarmIcon, - RightArrowIcon: SnoozeIcon, - + OpenPickerIcon: ClockIcon, - }} - - openPickerIcon={<ClockIcon />} - > - ``` - -### `@material-ui/system@5.0.0-alpha.36` - -- ​<!-- 18 -->[system] Add createTheme util (#26490) @mnajdova - -### Docs - -- ​<!-- 28 -->[docs] Migrate templates to emotion (#26604) @vicasas -- ​<!-- 26 -->[docs] Remove custom primary & secondary color (#26541) @siriwatknp -- ​<!-- 24 -->[docs] Don't escape prop descriptions for markdown table context (#26579) @eps1lon -- ​<!-- 22 -->[docs] Prepare for data grid auto-generated docs (#26477) @m4theushw -- ​<!-- 21 -->[docs] Fix typo sx !== xs (#26596) @onpaws -- ​<!-- 16 -->[docs] Multiple select demos moving when selecting values (#26539) @itsnorbertkalacska -- ​<!-- 14 -->[docs] Improve migration guide for `@material-ui/styles` (#26552) @mnajdova -- ​<!-- 12 -->[docs] `Rating` `value` is nullable in `onChange` (#26542) @sakura90 -- ​<!-- 30 -->[example] Remove the dependency on @material-ui/styles (#26567) @garfunkelvila - -### Core - -- ​<!-- 33 -->[core] Ignore latest prettier run in git-blame @eps1lon -- ​<!-- 32 -->[core] Format @eps1lon -- ​<!-- 05 -->[test] Add bundle fixtures (#23166) @eps1lon -- ​<!-- 09 -->[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 - -<!-- generated comparing v5.0.0-alpha.34..next --> - -_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/v5.0.0/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 <div className={classes.root} /> - } - - // In the root of your app - function App(props) { - - return <Component />; - + return <ThemeProvider theme={theme}><Component {...props} /></ThemeProvider>; - } - ``` - -- [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 <div className={clsx(className, classes.root)} {...other} /> - })(({ theme }) => ({ root: { background: theme.palette.primary.main }})); - - function App() { - - return <MyComponent />; - + return <ThemeProvider theme={defaultTheme}><MyComponent /></ThemeProvider>; - } - ``` - -- [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, for example 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_ - -<!-- generated comparing v5.0.0-alpha.33..next --> - -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 - -- ​<!-- 47 -->[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 - -<NativeSelect classes={{ root: 'class1', select: 'class2', selectMenu: 'class3' }} /> - +<NativeSelect classes={{ select: 'class1 class2 class3' }} /> - ``` - - **TablePagination** - - Move the custom class on `input` to `select`. The `input` key is being applied on another element. - - ```diff - <TablePagination - - classes={{ input: 'foo' }} - + classes={{ select: 'foo' }} - /> - ``` - -- ​<!-- 45 -->[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'; - ``` - -- ​<!-- 39 -->[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': { - ``` - -- ​<!-- 31 -->[Radio] Make color primary default (#26180) @vicasas -- ​<!-- 03 -->[Switch] Make color primary default (#26182) @vicasas -- ​<!-- 10 -->[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 ( - <DateTimePicker - open={open} - onClose={() => setOpen(false)} - onOpen={() => setOpen(true)} - {...props} - /> - ); - } - ``` - -- ​<!-- 63 -->[Autocomplete] Rename getOptionSelected to isOptionEqualToValue (#26173) @m4theushw - - ```diff - <Autocomplete - - getOptionSelected={(option, value) => 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 - -- ​<!-- 61 -->[TextField] Fix hiddenLabel type of FilledInput (#26290) @siriwatknp -- ​<!-- 54 -->[TextField] Fix classes forward to InputBase (#26231) @arpitBhalla -- ​<!-- 17 -->[Autocomplete] Fix missing 'createOption' in AutocompleteCloseReason type (#26197) @Gautam-Arora24 -- ​<!-- 30 -->[Autocomplete] Reduce CSS specificity by 1 (#26238) @Gautam-Arora24 -- ​<!-- 07 -->[ButtonBase] Omit aria-disabled if not disabled (#26189) @Gautam-Arora24 -- ​<!-- 18 -->[colors] Fix A inconsistencies (#26196) @oliviertassinari -- ​<!-- 08 -->[examples] Fix dynamic global styles & global styles leak in the ssr examples (#26177) @mnajdova -- ​<!-- 57 -->[Slider] Fix support for non primary colors (#26285) @davidfdriscoll -- ​<!-- 56 -->[Slider] Center value label for disabled slider (#26257) @davidfdriscoll -- ​<!-- 19 -->[styled-engine] Fix styled-components not supporting empty style (#26098) @ruppysuppy -- ​<!-- 21 -->[styles] Fix overrides type issues (#26228) @mnajdova -- ​<!-- 64 -->[Container] Fix support for custom breakpoints (#26328) @alanszp - -### `@material-ui/lab@5.0.0-alpha.34` - -- ​<!-- 68 -->[pickers] Migrate TimePickerToolbar to emotion (#26274) @siriwatknp -- ​<!-- 67 -->[pickers] Migrate DatePickerToolbar to emotion (#26292) @siriwatknp -- ​<!-- 66 -->[DateTimePicker] Migrate DateTimePickerTabs and Toolbar to emotion (#26327) @siriwatknp -- ​<!-- 33 -->[DatePicker] Migrate PickersYear to emotion (#25949) @siriwatknp -- ​<!-- 35 -->[DateRangePicker] Migrate PickersToolbarText to emotion (#25983) @siriwatknp -- ​<!-- 46 -->[pickers] Migrate StaticWrapper to emotion (#26275) @siriwatknp -- ​<!-- 58 -->[pickers] Migrate Clock to emotion (#26278) @siriwatknp -- ​<!-- 43 -->[pickers] Migrate PickersToolbar to emotion (#26273) @siriwatknp -- ​<!-- 42 -->[pickers] Migrate ClockNumber to emotion (#26058) @siriwatknp -- ​<!-- 41 -->[pickers] Migrate ClockPointer to emotion (#26057) @siriwatknp -- ​<!-- 32 -->[pickers] Migrate PickersMonth to emotion (#26021) @siriwatknp -- ​<!-- 26 -->[pickers] Migrate MonthPicker to emotion (#26025) @siriwatknp -- ​<!-- 25 -->[pickers] Migrate PickersDay to emotion (#25995) @siriwatknp -- ​<!-- 06 -->[pickers] Migrate PickersToolbarButton to emotion (#25989) @siriwatknp - -### `@material-ui/icons@5.0.0-alpha.34` - -- ​<!-- 52 -->[icons] Remove extraneous React.Fragment (#26308) @eps1lon -- ​<!-- 50 -->[icons] Synchronize icons (#26302) @eps1lon - - New DriveFileMove icon and its variants - -### Docs - -- ​<!-- 16 -->[NProgressBar] Fix invalid ARIA and HTML (#26234) @eps1lon -- ​<!-- 65 -->[docs] Simplify demos slider (#26324) @oliviertassinari -- ​<!-- 48 -->[docs] Use transpiled icons directly (#26268) @eps1lon -- ​<!-- 44 -->[docs] Remove dependency on withStyles from @material-ui/core/styles (#26269) @mnajdova -- ​<!-- 40 -->[docs] Add Jalali date picker demo (#26243) @smmoosavi -- ​<!-- 37 -->[docs] Remove last dependencies on `makeStyles` from `@material-ui/core/styles` (#26246) @mnajdova -- ​<!-- 29 -->[docs] Polish the pickers demo (#26094) @oliviertassinari -- ​<!-- 28 -->[docs] Fix broken overrides link on API pages (#26244) @mnajdova -- ​<!-- 27 -->[docs] Improve documentation for Buttons (#26184) @arpitBhalla -- ​<!-- 24 -->[docs] Emphasize on props for screen readers (#26222) @atisheyJain03 -- ​<!-- 23 -->[docs] Link third-party routing in Bottom navigation (#26190) @arpitBhalla -- ​<!-- 22 -->[docs] Migrate Select, Progress demos to emotion (#26178) @mnajdova -- ​<!-- 20 -->[docs] Add accessibility section to Badges (#26009) @likitarai1 -- ​<!-- 15 -->[docs] Migrate Popper, Drawer demos to emotion (#26183) @mnajdova -- ​<!-- 12 -->[docs] Use public next/router events API (#26233) @eps1lon -- ​<!-- 11 -->[docs] Remove remnants Hidden component (#26191) @vicasas -- ​<!-- 09 -->[docs] Ensure TreeView demos don't overflow demo container (#26161) @eps1lon -- ​<!-- 05 -->[docs] Fix a typo in the import statement of LocalizationProvider (#26226) @huyenltnguyen -- ​<!-- 04 -->[docs] Improve react-admin coverage in the showcase (#26169) @fzaninotto -- ​<!-- 02 -->[docs] Fix Workbox that are causing infinite loading of site (#26193) @arpitBhalla - -### Core - -- ​<!-- 60 -->[core] Skip sx prop in internal components (#26235) @mnajdova -- ​<!-- 59 -->[core] Remove `withStyles` dependencies from `@material-ui/core/styles` (#26277) @mnajdova -- ​<!-- 55 -->[core] Include human readable target in the BrowserStack build (#26322) @eps1lon -- ​<!-- 53 -->[core] Fix NotchedOutlineProps type (#26305) @gnowland -- ​<!-- 51 -->[core] Add file for git-blame --ignore-revs-file (#26295) @eps1lon -- ​<!-- 49 -->[core] Ensure component class keys aren't missing (#25754) @eps1lon -- ​<!-- 38 -->[core] Drop support for blocking mode (#26262) @eps1lon -- ​<!-- 36 -->[core] Don't download monorepo packages (#26261) @eps1lon -- ​<!-- 14 -->[core] Batch small changes (#26199) @oliviertassinari -- ​<!-- 13 -->[core] Extract classes descriptions from TypeScript (#25933) @eps1lon -- ​<!-- 34 -->[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 - -- ​<!-- 09 -->[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 }) => <div className={classes.root} />); - - function MyOtherComponent(props) { - const ref = React.useRef(); - - return <MyComponent innerRef={ref} />; - + return <MyComponent ref={ref} />; - } - ``` - - **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 }) => <div>{props.theme.direction}</div>); - - function MyOtherComponent(props) { - const ref = React.useRef(); - - return <MyComponent innerRef={ref} />; - + return <MyComponent ref={ref} />; - } - ``` - -- ​<!-- 10 -->[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({ - ``` - -- ​<!-- 74 -->[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'; - ``` - -- ​<!-- 20 -->[Box] Remove the `clone` prop (#26031) @m4theushw - - Its behavior can be obtained using the `sx` prop. - - ```diff - -<Box sx={{ border: '1px dashed grey' }} clone> - - <Button>Save</Button> - -</Box> - +<Button sx={{ border: '1px dashed grey' }}>Save</Button> - ``` - -- ​<!-- 51 -->[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 - -<Box sx={{ border: '1px dashed grey' }}> - - {(props) => <Button {...props}>Save</Button>} - -</Box> - +<Button sx={{ border: '1px dashed grey' }}>Save</Button> - ``` - - ```diff - -<Box sx={{ border: '1px dashed grey' }}> - - {(props) => <button {...props}>Save</button>} - -</Box> - +<Box component="button" sx={{ border: '1px dashed grey' }}>Save</Box> - ``` - -- ​<!-- 25 -->[Checkbox] Make color="primary" default (#26002) @vicasas - - This better matches the Material Design guidelines. - - ```diff - -<Checkbox /> - +<Checkbox color="secondary /> - ``` - -- ​<!-- 30 -->[Select] Remove `labelWidth` prop (#26026) @m4theushw - - The `label` prop now fulfills the same purpose, using CSS layout instead of JavaScript measurement to render the gap in the outlined. The TextField already handles it by default. - - ```diff - -<Select variant="outlined" labelWidth={20} /> - +<Select label="Gender" /> - ``` - -- ​<!-- 50 -->[core] Remove `styled` JSS utility from `@material-ui/core/styles` (#26101) @mnajdova - - The `styled` **JSS** utility is no longer exported from `@material-ui/core/styles`. You can use `@material-ui/styles/styled` 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/styles` instead. - - ```diff - -import { styled } from '@material-ui/core/styles'; - +import { styled } from '@material-ui/styles'; - +import { createTheme, ThemeProvider } from '@material-ui/core/styles'; - - +const theme = createTheme(); - const MyComponent = styled('div')(({ theme }) => ({ background: theme.palette.primary.main })); - - function App(props) { - - return <MyComponent />; - + return <ThemeProvider theme={theme}><MyComponent {...props} /></ThemeProvider>; - } - ``` - - For new components, you can instead use the `experimentalStyled()` helper powered by emotion/sc. - - ```jsx - import { experimentalStyled as styled } from '@material-ui/core/styles'; - ``` - -- ​<!-- 63 -->[Hidden] Remove component (#26135) @m4theushw - - Removed in favor of using the `sx` prop or the `useMediaQuery` hook. - - Use the `sx` prop to replace `implementation="css"`: - - ```diff - -<Hidden implementation="css" xlUp><Paper /></Hidden> - -<Hidden implementation="css" xlUp><button /></Hidden> - +<Paper sx={{ display: { xl: 'none', xs: 'block' } }} /> - +<Box component="button" sx={{ display: { xl: 'none', xs: 'block' } }} /> - ``` - - ```diff - -<Hidden implementation="css" mdDown><Paper /></Hidden> - -<Hidden implementation="css" mdDown><button /></Hidden> - +<Paper sx={{ display: { xs: 'none', md: 'block' } }} /> - +<Box component="button" sx={{ display: { xs: 'none', md: 'block' } }} /> - ``` - - Use the `useMediaQuery` hook to replace `implementation="js"`: - - ```diff - -<Hidden implementation="js" xlUp><Paper /></Hidden> - +const hidden = useMediaQuery(theme => theme.breakpoints.up('xl')); - +return hidden ? null : <Paper />; - ``` - -- ​<!-- 64 -->[withWidth] Remove API (#26136) @m4theushw - - Removed in favor of the `useMediaQuery` hook. You can reproduce the same functionality creating a custom hook as described [here](https://mui.com/components/use-media-query/#migrating-from-withwidth). - -- ​<!-- 75 -->[Autocomplete] Rename values of the reason argument (#26172) @m4theushw - - Rename the values of the reason argument in `onChange` and `onClose` for consistency: - - 1. `create-option` to `createOption` - 2. `select-option` to `selectOption` - 3. `remove-option` to `removeOption` - -- ​<!-- 28 -->[core] Remove `withTheme` from `@material-ui/core` (#26051) @mnajdova - - The `withTheme` utility has been removed from the `@material-ui/core/styles` package. You can use the `@material-ui/styles/withTheme` 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` from `@material-ui/core/styles` instead. - - ```diff - import * as React from 'react'; - -import { withTheme } from '@material-ui/core/styles'; - +import { withTheme } from '@material-ui/styles'; - +import { createTheme, ThemeProvider } from '@material-ui/core/styles'; - - +const theme = createTheme(); - const MyComponent = withTheme(({ theme }) => <div>{props.theme.direction}</div>); - - function App(props) { - - return <MyComponent />; - + return <ThemeProvider theme={theme}><MyComponent {...props} /></ThemeProvider>; - } - ``` - -- ​<!-- 15 -->[core] Remove `createStyles` from `@material-ui/core` (#26018) @mnajdova - - - The `createGenerateClassName` module is no longer exported from `@material-ui/core/styles`. You should import it directly from `@material-ui/styles`. - - ```diff - -import { createGenerateClassName } from '@material-ui/core/styles'; - +import { createGenerateClassName } from '@material-ui/styles'; - ``` - - - The `jssPreset` object is no longer exported from `@material-ui/core/styles`. You should import it directly from `@material-ui/styles`. - - ```diff - -import { jssPreset } from '@material-ui/core/styles'; - +import { jssPreset } from '@material-ui/styles'; - ``` - - - The `ServerStyleSheets` component is no longer exported from `@material-ui/core/styles`. You should import it directly from `@material-ui/styles`. - - ```diff - -import { ServerStyleSheets } from '@material-ui/core/styles'; - +import { ServerStyleSheets } from '@material-ui/styles'; - ``` - -- The `StylesProvider` component is no longer exported from `@material-ui/core/styles`. You should import it directly from `@material-ui/styles`. - - ```diff - -import { StylesProvider } from '@material-ui/core/styles'; - +import { StylesProvider } from '@material-ui/styles'; - ``` - -- The `useThemeVariants` hook is no longer exported from `@material-ui/core/styles`. You should import it directly from `@material-ui/styles`. - - ```diff - -import { useThemeVariants } from '@material-ui/core/styles'; - +import { useThemeVariants } from '@material-ui/styles'; - ``` - -- [FormControlLabel] The `label` prop is now required. - -#### Changes - -- ​<!-- 47 -->[Dialog] Improve support for custom breakpoints (#26092) @oliviertassinari -- ​<!-- 32 -->[IconButton] Fix default color prop (#26064) @Jack-Works -- ​<!-- 27 -->[Radio] Migrate RadioButtonIcon to emotion (#26068) @mnajdova -- ​<!-- 33 -->[SwipeableDrawer] Migrate SwipeArea to emotion (#26059) @mnajdova -- ​<!-- 72 -->[Table] Synchronize horizontal sticky header position with body (#26159) @LiKang6688 -- ​<!-- 69 -->[Tabs] Fix support for null children in TabList (#26170) @hubertokf -- ​<!-- 31 -->[Tabs] Fix keyboard traversal over disabled tabs (#26061) @anish-khanna -- ​<!-- 55 -->[TextField] Fix missing `standard` variant classes in types (#26115) @siriwatknp -- ​<!-- 54 -->[TextField] Allow to customize Typography in FormControlLabel (#25883) @mousemke -- ​<!-- 17 -->[theme] Fix transition duration default value customization (#26054) @anshuman9999 - -### `@material-ui/lab@5.0.0-alpha.33` - -#### Breaking changes - -- ​<!-- 08 -->[Timeline] Add support for position override on items (#25974) @simonecervini - - Rename the `align` prop to `position` to reduce confusion. - - ```diff - -<Timeline align="alternate"> - +<Timeline position="alternate"> - ``` - - ```diff - -<Timeline align="left"> - +<Timeline position="right"> - ``` - - ```diff - -<Timeline align="right"> - +<Timeline position="left"> - ``` - -- ​<!-- 56 -->[pickers] Remove customization of deep components (#26118) @eps1lon - -#### Changes - -- ​<!-- 02 -->[DatePicker] Migrate YearPicker to emotion (#25928) @siriwatknp -- ​<!-- 14 -->[DateRangePicker] Fix not being opened on click (#26016) @eps1lon -- ​<!-- 48 -->[pickers] Fix ref types (#26121) @eps1lon -- ​<!-- 43 -->[pickers] Rely on native behavior for disabled/readOnly behavior (#26055) @eps1lon -- ​<!-- 29 -->[pickers] Remove unused components from mobile and desktop variants (#26066) @eps1lon -- ​<!-- 23 -->[pickers] Document readonly/disabled pickers (#26056) @eps1lon -- ​<!-- 19 -->[pickers] Remove unused components from static variants (#26052) @eps1lon -- ​<!-- 13 -->[pickers] Toggle mobile keyboard view in the same commit as the view changes (#26017) @eps1lon -- ​<!-- 11 -->[pickers] Remove redundant aria-hidden (#26014) @eps1lon -- ​<!-- 04 -->[pickers] Ensure input value is reset in the same commit as the value (#25972) @eps1lon -- ​<!-- 49 -->[internal][pickers] Pass desktop wrapper props explicitly (#26120) @eps1lon -- ​<!-- 44 -->[internal][pickers] Move useInterceptProps into module (#26090) @eps1lon -- ​<!-- 37 -->[internal][pickers] Explicit default toolbar components (#26075) @eps1lon -- ​<!-- 35 -->[internal][pickers] Move validation from config to module (#26074) @eps1lon -- ​<!-- 21 -->[internal][pickers] Minimal types for defaultizing in useInterceptProps (#26063) @eps1lon -- ​<!-- 18 -->[internal][pickers] Don't validate inputFormat in production (#26053) @eps1lon -- ​<!-- 12 -->[internal][pickers] Remove unused styles (#26023) @eps1lon -- ​<!-- 03 -->[internal][pickers] Remove `AllSharedPickerProps` and `AllSharedDateRangePickerProps` (#26005) @eps1lon - -### Docs - -- ​<!-- 77 -->[docs] Migrate Tabs, Table, Snackbar demos to emotion (#26175) @mnajdova -- ​<!-- 73 -->[docs] Fix dynamic global styles (#25690) @mnajdova -- ​<!-- 71 -->[docs] Fixed React.forwardRef missing display name ESLint error (#26160) @arpitBhalla -- ​<!-- 70 -->[docs] Migrate Tooltip, Steppers demos to emotion (#26165) @mnajdova -- ​<!-- 68 -->[docs] Migrate Dialog demos to emotion (#26162) @vicasas -- ​<!-- 67 -->[docs] Remove `makeStyles` from landing pages (#26130) @mnajdova -- ​<!-- 65 -->[docs] Add new customized switch examples (#26096) @DanielBretzigheimer -- ​<!-- 62 -->[docs] Migrate Autocomplete demos (#26127) @mnajdova -- ​<!-- 61 -->[docs] Remove `@material-ui/core/styles` from the styles pages (#26126) @mnajdova -- ​<!-- 60 -->[docs] Update templates, premium-themes to use `makeStyles` from `@material-ui/styles` (#26131) @mnajdova -- ​<!-- 59 -->[docs] Migrate TreeView demos (#26146) @mnajdova -- ​<!-- 57 -->[docs] More explicit breakpoint documentation in `sx` (#26140) @eps1lon -- ​<!-- 53 -->[docs] Explicitly describe how the media query affects the rendered version (#26129) @eps1lon -- ​<!-- 45 -->[docs] Fix 301 link to store (#26095) @oliviertassinari -- ​<!-- 42 -->[docs] Normalize name use for state in pickers demo (#26093) @oliviertassinari -- ​<!-- 41 -->[docs] Consistent type name in docs (#26077) @jamesaucode -- ​<!-- 38 -->[docs] Remove `makeStyles` dependency from core in modules (#26071) @mnajdova -- ​<!-- 34 -->[docs] Add links for demo in different deploys (#26065) @eps1lon -- ​<!-- 26 -->[docs] Add section for useFormControl (#25927) @t49tran -- ​<!-- 24 -->[docs] Add Styled Engine page (#25911) @mnajdova -- ​<!-- 16 -->[docs] Migrate Timeline demos to emotion (#26036) @vicasas -- ​<!-- 07 -->[docs] Document all the colors available (#26015) @anshuman9999 -- ​<!-- 01 -->[docs] Avoid extracting classes twice (#25973) @oliviertassinari - -### Core - -- ​<!-- 52 -->[test] Add test for behavior when picker variant changes (#26128) @eps1lon -- ​<!-- 36 -->[test] testing-library patterns for playwright tests (#25860) @eps1lon -- ​<!-- 22 -->[test] Remove scheduler/tracing (#26062) @eps1lon -- ​<!-- 05 -->[test] Remove duplicate property (#26011) @eps1lon -- ​<!-- 76 -->[core] Link to experimental size-comparison page (#26179) @eps1lon -- ​<!-- 66 -->[core] Update typings for theme's components (#26125) @mnajdova -- ​<!-- 58 -->[core] Improve `react@experimental` compat (#26116) @eps1lon -- ​<!-- 46 -->[core] Remove more dependencies on `@material-ui/styles` (#26100) @mnajdova -- ​<!-- 40 -->[core] Batch small changes (#26083) @oliviertassinari -- ​<!-- 39 -->[core] ComponentType -> JSXElementConstructor (#26081) @eps1lon -- ​<!-- 06 -->[core] Create new @material-ui/private-theming package (#25986) @mnajdova - -All contributors of this release in alphabetical order: @anish-khanna, @anshuman9999, @arpitBhalla, @DanielBretzigheimer, @eps1lon, @hubertokf, @Jack-Works, @jamesaucode, @LiKang6688, @m4theushw, @mnajdova, @mousemke, @oliviertassinari, @simonecervini, @siriwatknp, @t49tran, @vicasas - -## 5.0.0-alpha.32 - -<!-- generated comparing v5.0.0-alpha.31..next --> - -_Apr 27, 2021_ - -A big thanks to the 15 contributors who made this release possible. Here are some highlights ✨: - -- 👩‍🎤 We have completed the migration to emotion of all components in `@material-ui/core`. We will focus on the components in `@material-ui/lab` next. -- 💥 Make progress with the breaking changes plan. We have done 38 out of 41 breaking changes that can be deprecated. We have done 21 out of the 39 that can't have deprecations. Once done, we will focus on updating the component for better following material design, and to improve the aesthetic. -- 💄 Support extending the theme for custom color and size values in all components. -- And many more 🐛 bug fixes and 📚 improvements. - -### `@material-ui/core@5.0.0-alpha.32` - -#### Breaking changes - -- ​<!-- 46 --> [Table] Rename padding="default" to padding="normal" (#25924) @m4theushw - - ```diff - -<Table padding="default" /> - -<TableCell padding="default" /> - +<Table padding="normal" /> - +<TableCell padding="normal" /> - ``` - -- ​<!-- 29 -->[Button] Rename `pending` prop to `loading` in LoadingButton (#25874) @m4theushw - - ```diff - -<LoadingButton pending pendingIndicator="Pending…" pendingPosition="end" /> - +<LoadingButton loading loadingIndicator="Pending…" loadingPosition="end" /> - ``` - -- ​<!-- 25 -->[ButtonBase] Remove buttonRef prop (#25896) @m4theushw - - ```diff - -<ButtonBase buttonRef={ref} /> - +<ButtonBase ref={ref} /> - ``` - - ```diff - -<Button buttonRef={ref} /> - +<Button ref={ref} /> - ``` - -- ​<!-- 41 -->[Checkbox][switch] Remove checked argument from onChange (#25871) @m4theushw - - ```diff - function MyCheckbox() { - - const handleChange = (event: React.ChangeEvent<HTMLInputElement>, checked: boolean) => { - + const handleChange = (event: React.ChangeEvent<HTMLInputElement>) => { - + const checked = event.target.checked; - }; - return <Checkbox onChange={handleChange} />; - } - ``` - - ```diff - function MySwitch() { - - const handleChange = (event: React.ChangeEvent<HTMLInputElement>, checked: boolean) => { - + const handleChange = (event: React.ChangeEvent<HTMLInputElement>) => { - + const checked = event.target.checked; - }; - return <Switch onChange={handleChange} />; - } - ``` - -- ​<!-- 42 -->[theme] Remove theme.breakpoints.width helper (#25918) @m4theushw - - ```diff - -theme.breakpoints.width('md') - +theme.breakpoints.values.md - ``` - -- ​<!-- 32 -->[theme] Remove theme.typography.round helper (#25914) @m4theushw - - The `theme.typography.round` helper was removed because it was no longer used. If you need it, use the function below: - - ```js - function round(value) { - return Math.round(value * 1e5) / 1e5; - } - ``` - -#### Changes - -- ​<!-- 03 -->[Container] Fix maxWidth="false" resulting in incorrect css (#25869) @mnajdova -- ​<!-- 49 -->[core] Improve support for extended props in theme (#25934) @vicasas -- ​<!-- 45 -->[core] Fix various too wide `classes` types (AppBar, Card, Link, LoadingButton, MenuItem) (#25917) @eps1lon -- ​<!-- 05 -->[Drawer] Fix classes forwarded to DOM node for docked drawer (#25870) @mnajdova -- ​<!-- 21 -->[IconButton] Support custom colors and sizes (#25890) @Vikram710 -- ​<!-- 16 -->[l10n] Add Bengali (bnBD) locale (#25841) @Knoxo -- ​<!-- 34 -->[Rating] Support custom sizes (#25922) @vicasas -- ​<!-- 30 -->[Select] Fix classes leaking on the DOM (#25894) @siriwatknp -- ​<!-- 43 -->[Stack] Fix support of spacing falsy values (#25937) @simonecervini -- ​<!-- 22 -->[Table] Migrate TablePagination to emotion (#25809) @siriwatknp -- ​<!-- 26 -->[Tabs] Migrate Tabs to emotion (#25824) @siriwatknp -- ​<!-- 50 -->[TextField] Remove utlity class name for margin="none" (#25969) @oliviertassinari -- ​<!-- 24 -->[TextField] Make the `position` prop required in InputAdornment (#25891) @m4theushw -- ​<!-- 23 -->[theme] Remove fade color helper (#25895) @m4theushw - -### `@material-ui/lab@5.0.0-alpha.32` - -- ​<!-- 53 -->[DateTimePicker] `date` is nullable in `onChange` (#25981) @eps1lon -- ​<!-- 39 -->[internal][pickers] Remove unused TView type argument (#25936) @eps1lon -- ​<!-- 48 -->[internal][pickers] Inline some BasePickerProps usages (#25971) @eps1lon -- ​<!-- 44 -->[internal][pickers] Entangle what Props vs AllProps means (#25938) @eps1lon -- ​<!-- 19 -->[lab] Update slot components to use overridesResolver (#25906) @mnajdova -- ​<!-- 40 -->[Timeline] Remove use of nth-child in favor of nth-of-type (#25915) @wellwellmissesanderson -- ​<!-- 06 -->[Timeline] Migrate Timeline to emotion (#25838) @siriwatknp -- ​<!-- 55 -->[TreeView] Migrate TreeItem to emotion (#25835) @siriwatknp - -### `@material-ui/styled-engine@5.0.0-alpha.32` - -- ​<!-- 02 -->[styled-engine] Skip variants resolver for non root slots by default (#25865) @mnajdova - -### `@material-ui/system@5.0.0-alpha.32` - -- ​<!-- 12 -->[system] Add missing `main` entry for styleFunctionSx (#25885) @eps1lon - -### `@material-ui/types@6.0.0` - -This package is just re-released since version 5.1.7 had a breaking change. - -### Docs - -- ​<!-- 28 -->[Autocomplete] Fix tagSize class typo (#25908) @JanMisker -- ​<!-- 51 -->[DataGrid] Update docs sections (#25980) @dtassone -- ​<!-- 38 -->[docs] Batch small fixes (#25807) @m4theushw -- ​<!-- 13 -->[docs] Explicitly list demos of unstyled components (#25900) @eps1lon -- ​<!-- 04 -->[docs] Expose heading links in a11y tree (#25861) @eps1lon -- ​<!-- 58 -->[docs] Fix minor typo (#26001) @onpaws -- ​<!-- 09 -->[docs] Fix global styles leaking on different pages (#25855) @mnajdova -- ​<!-- 31 -->[docs] Fix Typography api docs for `paragraph` prop (#25929) @DanailH -- ​<!-- 17 -->[docs] Fix Slider's classes wrong description (#25907) @mnajdova -- ​<!-- 37 -->[docs] Grammar correction in autocomplete API (#25910) @gruber76 -- ​<!-- 15 -->[docs] Require documentation of demos (#25811) @eps1lon -- ​<!-- 36 -->[docs] Update minimum required TypeScript version (#25930) @eps1lon -- ​<!-- 56 -->[Table] Improve description of TablePagination.rowsPerPageOptions (#25982) @kevinlul - -### Core - -- ​<!-- 54 -->[core] Fix wrong imports to '@material-ui/styles' (#25984) @mnajdova -- ​<!-- 52 -->[core] Ensure props spreading works as expected (#25939) @oliviertassinari -- ​<!-- 47 -->[core] Batch small changes (#25968) @oliviertassinari -- ​<!-- 35 -->[core] Enable trailing comma in TypeScript files (#25931) @eps1lon -- ​<!-- 33 -->[core] Remove @typescript-to-proptypes-generate handlers (#25909) @eps1lon -- ​<!-- 18 -->[core] Update slots components to enable flatten specificity for overrides (#25853, #25864, #25881, #25884, #25887, #25904, #25892) @mnajdova -- ​<!-- 27 -->[test] Add current behavior of inverleaving elements on mousedown (#25903) @eps1lon -- ​<!-- 20 -->[test] Add test validator to improve DX (#25854) @siriwatknp -- ​<!-- 57 -->[test] Fix duplicate key in TreeItem test (#26000) @mnajdova - -All contributors of this release in alphabetical order: @DanailH, @dtassone, @eps1lon, @gruber76, @JanMisker, @kevinlul, @Knoxo, @m4theushw, @mnajdova, @oliviertassinari, @simonecervini, @siriwatknp, @vicasas, @Vikram710, @wellwellmissesanderson - -## 5.0.0-alpha.31 - -<!-- generated comparing v5.0.0-alpha.30..next --> - -_Apr 20, 2021_ - -A big thanks to the 19 contributors who made this release possible. Here are some highlights ✨: - -- 👩‍🎤 Migrate 4 components to emotion. -- 💥 Resume work on the breaking changes, aim for v5.0.0-beta.0 in the next coming months. -- And many more 🐛 bug fixes and 📚 improvements. - -### `@material-ui/core@5.0.0-alpha.31` - -#### Breaking changes - -- [FormControl] Change default variant from standard to outlined (#24895) @petyosi - Standard has been removed from the Material Design guidelines. [This codemod](https://github.com/mui/material-ui/tree/next/packages/mui-codemod#variant-prop) will automatically update your code. - - ```diff - -<FormControl value="Standard" /> - -<FormControl value="Outlined" variant="outlined" /> - +<FormControl value="Standard" variant="standard" /> - +<FormControl value="Outlined" /> - ``` - -- [Menu] The `selectedMenu` variant will not vertically align the selected item with the anchor anymore. (#25691) @m4theushw -- [Popover] Remove the `getContentAnchorEl` prop to simplify the positioning logic. (#25691) @m4theushw -- [Select] Change default variant from standard to outlined (#24895) @petyosi - Standard has been removed from the Material Design guidelines. [This codemod](https://github.com/mui/material-ui/tree/next/packages/mui-codemod#variant-prop) will automatically update your code. - - ```diff - -<Select value="Standard" /> - -<Select value="Outlined" variant="outlined" /> - +<Select value="Standard" variant="standard" /> - +<Select value="Outlined" /> - ``` - -#### Changes - -- ​<!-- 17 -->[Alert] Fix action to be aligned with the text (#25768) @mnajdova -- ​<!-- 30 -->[Avatar] Fix onload event not firing when img cached (#25793) @npandrei -- ​<!-- 35 -->[Box] Add utility mui class (#25802) @mnajdova -- ​<!-- 24 -->[core] Don't call noop event.persist() (#25782) @eps1lon -- ​<!-- 52 -->[Dialog] Fix support of custom breakpoint units (#25788) @Vikram710 -- ​<!-- 26 -->[List] Fix support for list item container style overrides (#25777) @mnajdova -- ​<!-- 21 -->[Rating] Allow clearing ratings with arrow keys (#25645) @Vikram710 -- ​<!-- 05 -->[Rating] Fix focus visible regression (#25698) @oliviertassinari -- ​<!-- 46 -->[Select] Fix specificity of style overrides (#25766) @robphoenix -- ​<!-- 39 -->[Select] Fix className overwritten (#25815) @siriwatknp -- ​<!-- 33 -->[Select] Fix overrides for slots (#25796) @mnajdova -- ​<!-- 19 -->[Snackbar] Fix hidden overlay blocking interactions regression (#25739) @MieleVL -- ​<!-- 13 -->[TextField] Fix InputAdornment classes (#25749) @mnajdova -- ​<!-- 07 -->[theme] Avoid mutating args in createSpacing (#25745) @eps1lon - -### `@material-ui/lab@5.0.0-alpha.31` - -#### Breaking changes - -- ​<!-- 37 -->[Pickers] Rename DayPicker to CalendarPicker (#25810) @eps1lon - - ```diff - -import DayPicker from '@material-ui/lab/DayPicker'; - +import CalendarPicker from '@material-ui/lab/CalendarPicker'; - - createMuiTheme({ - components: { - - MuiDayPicker: {}, - + MuiCalendarPicker: {}, - } - }) - ``` - -- ​<!-- 04 -->[Pickers] Rename PickersCalendarSkeleton to CalendarPickerSkeleton (#25679) @eps1lon - - ```diff - -import PickersCalendarSkeleton from '@material-ui/lab/PickersCalendarSkeleton'; - +import CalendarPickerSkeleton from '@material-ui/lab/CalendarPickerSkeleton'; - ``` - -- ​<!-- 06 -->[Pickers] Rename `date` `view` to `day` (#25685) @eps1lon - - ```diff - -<DatePicker openTo="date" views={['date', 'month']} /> - +<DatePicker openTo="day" views={['day', 'month']} /> - ``` - -#### Changes - -- ​<!-- 16 -->[DateRangePicker] Add DateRangePickerDay to theme augmentation list (#25758) @ifndefdeadmau5 -- ​<!-- 38 -->[Pickers] Rename internal DayPickerView to CalendarPickerView (#25817) @eps1lon -- ​<!-- 41 -->[Pickers] Remove `TView` generic in CalendarPicker (#25818) @eps1lon -- ​<!-- 40 -->[Pickers] Use passive effect to attach close-on-escape listener (#25819) @eps1lon -- ​<!-- 50 -->[Timeline] Migrate TimelineDot to emotion (#25830) @vicasas -- ​<!-- 28 -->[Timeline] Migrate TimelineContent to emotion (#25781) @siriwatknp -- ​<!-- 53 -->[Timeline] Migrate TimelineItem to emotion (#25822) @vicasas -- ​<!-- 47 -->[Timeline] Migrate TimelineOppositeContent to emotion (#25816) @vicasas -- ​<!-- 54 -->[FocusTrap] Make isEnabled and getDoc optional (#25784) @m4theushw - -### `@material-ui/styled-engine@5.0.0-alpha.31` - -- ​<!-- 27 -->[styled-engine] Fix shouldForwardProp on slots (#25780) @mnajdova -- ​<!-- 11 -->[styled-engine] Improve GlobalStyles props (#25751) @mnajdova - -### `@material-ui/unstyled@5.0.0-alpha.31` - -- ​<!-- 14 -->[unstyled] Convert generateUtilityClass(es) to TypeScript (#25753) @eps1lon - -### Docs - -- ​<!-- 31 -->[Avatar] Set backgroundColor from string (#25789) @Vikram710 -- ​<!-- 59 -->[docs] Add demos for public picker components (#25812) @eps1lon -- ​<!-- 49 -->[docs] Add example with switch dark/light mode (#25823) @Vikram710 -- ​<!-- 01 -->[docs] Add package headings to 5.0.0-alpha.30 changelog (#25733) @eps1lon -- ​<!-- 61 -->[docs] Add unstyled section to all components coming with the package (#25843) @mnajdova -- ​<!-- 10 -->[docs] Breakdown Chip demos into smaller ones (#25750) @vicasas -- ​<!-- 12 -->[docs] Document circular progress inherit (#25736) @oliviertassinari -- ​<!-- 58 -->[docs] Fix /production-error crash (#25839) @eps1lon -- ​<!-- 48 -->[docs] Fix ad duplication (#25831) @oliviertassinari -- ​<!-- 09 -->[docs] Fix autocommplete disable event value (#25752) @oliviertassinari -- ​<!-- 56 -->[docs] Fix inline-preview selection controls (#25834) @oliviertassinari -- ​<!-- 29 -->[docs] Fix Horizontally centered demo (#25787) @viditrv123 -- ​<!-- 45 -->[docs] Improve pickers migration docs from v3 (#25813) @ahmed-28 -- ​<!-- 15 -->[docs] Move DataGrid editing nav link (#25769) @dtassone -- ​<!-- 36 -->[docs] Replace Typography color values with system values (#25805) @oliviertassinari -- ​<!-- 60 -->[docs] Remove one inline-style (#25671) @oliviertassinari -- ​<!-- 18 -->[docs] Use gender neutral pronoun for Swipeable Drawer (#25775) @catchanuj -- ​<!-- 20 -->[examples] Add TypeScript for styled-components engine (#25675) @jqrun -- ​<!-- 23 -->[l10n] zhTW refinement (#25786) @shakatoday -- ​<!-- 44 -->[Tabs] Add demo for routing with Tabs (#25827) @ahmed-28 -- ​<!-- 57 -->[website] Add Matheus Wichman (#25801) @m4theushw - -### Core - -- ​<!-- 42 -->[core] Batch small changes (#25804) @oliviertassinari -- ​<!-- 02 -->[core] Document token permissions of release:changelog (#25732) @eps1lon -- ​<!-- 34 -->[core] Error when installing in unsupported node environments (#25795) @eps1lon -- ​<!-- 43 -->[core] Fix rgba to hex conversion (#25825) @saeedeyvazy -- ​<!-- 08 -->[core] Normalize usage of pseudo classes selectors (#25748) @mnajdova -- ​<!-- 51 -->[core] Remove unused public types (#25833) @oliviertassinari -- ​<!-- 25 -->[core] Remove incorrect overridesResolver usages (#25778) @mnajdova -- ​<!-- 03 -->[test] Use public imports (#25686) @vicasas -- ​<!-- 22 -->[core] Use readonly arrays where possible (#25746) @eps1lon - -All contributors of this release in alphabetical order: @ahmed-28, @catchanuj, @dtassone, @eps1lon, @ifndefdeadmau5, @jqrun, @m4theushw, @MieleVL, @mnajdova, @npandrei, @oliviertassinari, @petyosi, @robphoenix, @saeedeyvazy, @shakatoday, @siriwatknp, @vicasas, @viditrv123, @Vikram710 - -## 5.0.0-alpha.30 - -<!-- generated comparing v5.0.0-alpha.29..next --> - -_Apr 12, 2021_ - -A big thanks to the 21 contributors who made this release possible. Here are some highlights ✨: - -- 👩‍🎤 Migrate 9 components to emotion. -- And many more 🐛 bug fixes and 📚 improvements. - -### `@material-ui/core@5.0.0-alpha.30` - -- ​<!-- 19 -->[Alert] Vertically align action on top (#25654) @xdshivani -- ​<!-- 37 -->[Autocomplete] Fix text field standard visual regression (#25676) @oliviertassinari -- ​<!-- 08 -->[CssBaseline] Fix @font-face rule broken in styleOverrides (#25583) @mnajdova -- ​<!-- 45 -->[Grid] Support custom number of columns (#25636) @Avi98 -- ​<!-- 15 -->[InputBase] Fix autofill typo (#25651) @michal-perlakowski -- ​<!-- 43 -->[LinearProgress] Add color="inherit" support (#25641) @itscharlieliu -- ​<!-- 06 -->[Pagination] Allow to differentiate more item types (#25622) @ruppysuppy -- ​<!-- 35 -->[Popover] Add popoverClasses export to type declarations (#25695) @tomasznguyen -- ​<!-- 33 -->[Rating] Add highlight selected rating only (#25649) @Vikram710 -- ​<!-- 14 -->[Rating] Migrate to emotion (#25588) @natac13 -- ​<!-- 38 -->[Select] Migrate to emotion (#25653) @mnajdova -- ​<!-- 17 -->[Select] Migrate NativeSelect to emotion (#24698) @duganbrett -- ​<!-- 28 -->[SpeedDial] Fix broken aria reference issue (#25665) @RiyaNegi -- ​<!-- 05 -->[Stepper] Migrate MobileStepper to emotion (#25589) @natac13 -- ​<!-- 13 -->[styles] Outdated warning message (#25637) @bhairavee23 -- ​<!-- 32 -->[Table] Remove legacy fix for JSS (#25692) @oliviertassinari -- ​<!-- 10 -->[Table] Migrate TableSortLabel to emotion (#25638) @natac13 -- ​<!-- 16 -->[TabPanel] Migrate to emotion (#25646) @tomasznguyen -- ​<!-- 11 -->[TextareaAutosize] Fix resizing bug on Firefox (#25634) @bhairavee23 -- ​<!-- 44 -->[TextField] Add textFieldClasses export to type declarations (#25696) @tomasznguyen -- ​<!-- 39 -->[theme] Change default bgColor to white in light mode (#25730) @saleebm -- ​<!-- 02 -->[ToggleButton] Add fullWidth prop (#25585) @hcz -- ​<!-- 40 -->[typescript] Add muiName to declarations (#25689) @michal-perlakowski - -### `@material-ui/lab@5.0.0-alpha.30` - -- ​<!-- 20 -->[Timeline] Migrate TimelineSeparator to emotion (#25666) @vicasas -- ​<!-- 18 -->[Timeline] Migrate TimelineConnector to emotion (#25663) @vicasas -- ​<!-- 42 -->[TimePicker] Use clock icon when editing in mobile mode (#25569) @alcwhite -- ​<!-- 29 -->[TreeView] Migrate to emotion (#25673) @tomasznguyen - -### Docs - -- ​<!-- 31 -->[blog] Fix typos @oliviertassinari -- ​<!-- 41 -->[docs] Migrate TextField demos to emotion (#25626) @vicasas -- ​<!-- 36 -->[docs] Bump stylis-plugin-rtl requirement (#25661) @mnajdova -- ​<!-- 34 -->[docs] Ensure old api-docs translations are cleaned (#25680) @eps1lon -- ​<!-- 25 -->[docs] Fix typo in v4 migration doc (#25678) @thameera -- ​<!-- 23 -->[docs] Fix useLayoutEffect warning (#25670) @oliviertassinari -- ​<!-- 22 -->[docs] Fix a11y issue in the SpeedDial docs (#25669) @RiyaNegi -- ​<!-- 12 -->[docs] Cover TypeScript commands in codemod readme (#25640) @StuffByLiang -- ​<!-- 09 -->[docs] Migrate Popover demos to emotion (#25620) @vicasas -- ​<!-- 07 -->[docs] Fix typo in switches and checkboxes doc (#25639) @dimitropoulos -- ​<!-- 03 -->[docs] Add interoperability section for Portal (#25575) @mnajdova -- ​<!-- 01 -->[docs] Fix side nav scroll position (#25619) @misaka3 -- ​<!-- 30 -->[website] Q1 2021 Update (#25591) @oliviertassinari -- ​<!-- 04 -->[website] Matheus Wichman joins Material UI (#25590) @oliviertassinari - -### Core - -- ​<!-- 27 -->[test] Use public api in lab (#25682) @vicasas -- ​<!-- 26 -->[test] Test types of .spec lab files (#25684) @eps1lon -- ​<!-- 24 -->[core] Fix build step for unstyled package (#25672) @oliviertassinari -- ​<!-- 21 -->[core] Ensure react-is uses v17 (#25668) @eps1lon - -All contributors of this release in alphabetical order: @alcwhite, @bhairavee23, @dimitropoulos, @duganbrett, @eps1lon, @hcz, @itscharlieliu, @michal-perlakowski, @misaka3, @mnajdova, @natac13, @oliviertassinari, @RiyaNegi, @ruppysuppy, @saleebm, @StuffByLiang, @thameera, @tomasznguyen, @vicasas, @Vikram710, @xdshivani - -## 5.0.0-alpha.29 - -<!-- generated comparing v5.0.0-alpha.28..next --> - -_Apr 4, 2021_ - -A big thanks to the 26 contributors who made this release possible. Here are some highlights ✨: - -- 🙌 Add support in the Grid for any spacing value (#25503) @ZakMiller. - For instance: - - ```jsx - <Grid container spacing={1.5}> - <Grid container spacing="30px"> - ``` - - This feature was made possible by the recent migration to emotion. - You can [find the other issues](https://github.com/mui/material-ui/issues?q=is%3Aopen+is%3Aissue+label%3A%22component%3A+Grid%22) unlocked by the migration to emotion on the Grid component that are left to be solved. - -- 👩‍🎤 Convert 3 components to emotion (#25541, #25516, #25521) @rajzik, @praveenkumar-kalidass, @siriwatknp. -- 📚 Migrate 8 component demo pages to the `sx`, `Stack`, and `styled` API @vicasas. -- And many more 🐛 bug fixes and 📚 improvements. - -### `@material-ui/core@5.0.0-alpha.29` - -- ​<!-- 39 -->[AppBar] Fix type support of overridable component (#25456) @heleg -- ​<!-- 26 -->[Autocomplete] Fix Async demo in docs (#25536) @kanish671 -- ​<!-- 23 -->[Autocomplete] Fix TypeScript wrapper example (#25530) @JanKaczmarkiewicz -- ​<!-- 21 -->[Backdrop] Remove z-index: -1 (#25524) @silver-snoopy -- ​<!-- 41 -->[Card] Add component prop support (#25537) @silver-snoopy -- ​<!-- 31 -->[CssBaseline] Migrate ScopedCssBaseline to emotion (#25541) @rajzik -- ​<!-- 03 -->[Divider] Support middle variant with vertical orientation (#25428) @vedadeepta -- ​<!-- 16 -->[Grid] Support decimal spacing (#25503) @ZakMiller -- ​<!-- 28 -->[List] Remove background inheritance of ListSubheader (#25532) @tanmoyopenroot -- ​<!-- 40 -->[Paper] Support dark mode brightening based on elevation (#25522) @m4theushw -- ​<!-- 43 -->[Select] Fix selection of non-options (#25567) @oliviertassinari -- ​<!-- 34 -->[Select] Set aria-expanded to false when listbox is collapsed (#25545) @Harish-Karthick -- ​<!-- 18 -->[SpeedDial] Call focus on escape (#25509) @tanmoyopenroot -- ​<!-- 20 -->[Stack] Add component prop (#25526) @silver-snoopy -- ​<!-- 07 -->[Stack] Fix the :not selector (#25484) @Andarist -- ​<!-- 24 -->[Stepper] Migrate StepButton to emotion (#25516) @praveenkumar-kalidass -- ​<!-- 22 -->[Stepper] Migrate Stepper to emotion (#25521) @siriwatknp -- ​<!-- 01 -->[Tabs] Don't animate scroll on first render (#25469) @manziEric -- ​<!-- 25 -->[Tooltip] Fix forwarded classes (#25535) @silver-snoopy - -### `@material-ui/unstyled@5.0.0-alpha.29` - -- ​<!-- 38 -->[Slider] Allow disabling the left and right thumbs swap (#25547) @michal-perlakowski - -### `@material-ui/lab@5.0.0-alpha.29` - -- ​<!-- 12 -->[DateRangePicker] Fix props naming in DatePicker components (#25504) @callmeberzerker -- ​<!-- 04 -->[DateRangePickerInput][internal] Inline makeDateRangePicker calls (#25470) @eps1lon -- ​<!-- 06 -->[StaticDateRangePicker] Fix inconsistent name for theme props (#25483) @eps1lon -- ​<!-- 17 -->[Pickers] Move own internals from lab internals to dedicated file (#25498) @eps1lon - -### Docs - -- ​<!-- 46 -->[docs] Provide an alternative to right-to-left (#25584) @dariusk -- ​<!-- 45 -->[docs] Add note for TypeScript on the styled() customization guide (#25576) @mnajdova -- ​<!-- 44 -->[docs] Replace incorrect instances of defined with define (#25572) @surajpoddar16 -- ​<!-- 42 -->[docs] Fix spelling error in roadmap.md file (#25570) @Brlaney -- ​<!-- 37 -->[docs] Migrate Card demos to emotion (#25557) @vicasas -- ​<!-- 36 -->[docs] Fix typo in data grid (#25561) @michael-001 -- ​<!-- 33 -->[docs] Migrate Menu demos to emotion (#25554) @vicasas -- ​<!-- 32 -->[docs] Fix <kbd> style in dark mode (#25551) @m4theushw -- ​<!-- 30 -->[docs] Document changing skeleton color (#25542) @ZakMiller -- ​<!-- 29 -->[docs] Improve coverage of TypeScript theme augmentation (#25489) @ashishshuklabs -- ​<!-- 27 -->[docs] Update minimizing-bundle-size.md (#25534) @nguyenyou -- ​<!-- 15 -->[docs] Migrate Portal demos to emotion (#25505) @vicasas -- ​<!-- 14 -->[docs] Migrate NoSSR demos to emotion (#25506) @vicasas -- ​<!-- 13 -->[docs] Migrate ClickAwayListener demos to emotion (#25507) @vicasas -- ​<!-- 10 -->[docs] Cover change of React support (#25487) @oliviertassinari -- ​<!-- 09 -->[docs] Migrate Transitions demos to emotion (#25488) @vicasas -- ​<!-- 08 -->[docs] Fix Stack divider demo (#25491) @oliviertassinari -- ​<!-- 02 -->[docs] Migrate Icons demos to emotion (#25412) @vicasas - -### Core - -- ​<!-- 19 -->[core] Use latest TypeScript in typescript-to-proptypes (#25512) @eps1lon -- ​<!-- 11 -->[core] Update the codesandbox issue templates (#25501) @oliviertassinari -- ​<!-- 05 -->[test] Wait on e2e server to start before starting runner (#25476) @eps1lon - -All contributors of this release in alphabetical order: @Andarist, @ashishshuklabs, @Brlaney, @callmeberzerker, @dariusk, @eps1lon, @Harish-Karthick, @heleg, @JanKaczmarkiewicz, @kanish671, @m4theushw, @manziEric, @michael-001, @michal-perlakowski, @mnajdova, @nguyenyou, @oliviertassinari, @praveenkumar-kalidass, @rajzik, @silver-snoopy, @siriwatknp, @surajpoddar16, @tanmoyopenroot, @vedadeepta, @vicasas, @ZakMiller - -## 5.0.0-alpha.28 - -_Mar 22, 2021_ - -A big thanks to the 34 contributors who made this release possible. Here are some highlights ✨: - -- 👩‍🎤 Convert 9 components to emotion (#25267, #25216, #25264, #25197, #25372, #25281, #25210, #25279, #2528) @natac13 @tomasznguyen @kayuapi. - 85% of the components have been migrated so far, thanks to the help of the community. -- 📚 Migrate 18 component demo pages to the `sx`, `Stack`, and `styled` API @vicasas. - This was also an importunity to breakdown the existing large demos into smaller and more focuses ones. -- Add a new Stack component (#25149) @souporserious - The component allows to workaround the lack of support for the CSS flexbox `gap` property across browsers. - - <img width="830" alt="stack" src="https://user-images.githubusercontent.com/3165635/112068427-29434200-8b6a-11eb-94e8-057535423b0f.png"> - - See the documentation for [more details](https://mui.com/components/stack/). - -- And many more 🐛 bug fixes and 📚 improvements. - -### `@material-ui/core@5.0.0-alpha.28` - -#### Breaking changes - -- [core] Drop support for React 16 (#25464) @eps1lon -- ​<!-- 36 -->[core] Drop support for node 10 (#25306) @eps1lon - -#### Changes - -- ​<!-- 70 -->[Autocomplete] Warn when the input didn't resolve in time (#25311) @LaneRamp -- ​<!-- 26 -->[Autocomplete] Fix styleOverrides support (#25276) @manziEric -- ​<!-- 68 -->[ButtonBase] Allow to customize the link component via theme (#25331) @vedadeepta -- ​<!-- 43 -->[ButtonBase] Fix default type attribute (submit -> button) (#25323) @RTEYL -- ​<!-- 73 -->[ButtonGroup] Support custom colors (#25413) @oliviertassinari -- ​<!-- 13 -->[CircularProgress] Fix animation when disableShrink={true} (#25247) @duongdev -- ​<!-- 29 -->[Dialog] Fix typo (#25287) @aheimlich -- ​<!-- 22 -->[Dialog] Migrate DialogContentText to emotion (#25267) @tomasznguyen -- ​<!-- 04 -->[Dialog] Migrate Dialog to emotion (#25216) @natac13 -- ​<!-- 79 -->[Drawer] Fix RTL support (#25453) @silver-snoopy -- ​<!-- 50 -->[Menu] Migrate to emotion (#25264) @tomasz-crozzroads -- ​<!-- 77 -->[Paper] Fix component prop type error (#25426) @heleg -- ​<!-- 17 -->[Popover] Migrate to emotion (#25197) @tomasznguyen -- ​<!-- 59 -->[Radio] Fix html structure (#25398) @oliviertassinari -- ​<!-- 58 -->[Select] Fix focus background when variant="outlined" (#25393) @christiaan -- ​<!-- 62 -->[Slider] Add `tabIndex` prop (#25388) @johnloven -- ​<!-- 88 -->[Snackbar] Fix prop type error for 'key' prop (#25431) @jansedlon -- ​<!-- 38 -->[SpeedDial] Reset tooltip state when the speed dial is closed (#25259) @m4theushw -- ​<!-- 71 -->[Stack] Add new component (#25149) @souporserious -- ​<!-- 81 -->[Stepper] Migrate StepLabel to emotion (#25372) @praveenkumar-kalidass -- ​<!-- 27 -->[Stepper] Migrate StepIcon to emotion (#25281) @praveenkumar-kalidass -- ​<!-- 08 -->[Stepper] Migrate StepContent to emotion (#25210) @praveenkumar-kalidass -- ​<!-- 30 -->[SwipeableDrawer] Fix hideBackDrop support (#25275) @manziEric -- ​<!-- 75 -->[Table] Fix duplicated keys in TablePagination rows per page (#25309) @martinfrancois -- ​<!-- 72 -->[Table] Consistency with DataTable (#25414) @oliviertassinari -- ​<!-- 76 -->[TextField] Size small for multiline (#25423) @julihereu -- ​<!-- 48 -->[TextField] Migrate InputAdornment to emotion (#25279) @kayuapi -- ​<!-- 47 -->[TextField] Migrate to emotion (#25286) @tomasznguyen -- ​<!-- 74 -->[ToggleButton] Add color prop (#25390) @AlfredoGJ -- ​<!-- 82 -->[Tooltip] Make `disableFocusListener` prop comment clearer (#25455) @jansedlon -- ​<!-- 24 -->[Tooltip] Fix placement regression (#25255) @oliviertassinari -- ​<!-- 25 -->[Transition] Add easing prop to override default timing function (#25245) @jeferson-sb - -### `@material-ui/lab@5.0.0-alpha.28` - -- ​<!-- 85 -->[Pickers] Follow "private by default" in makeDateRangePicker (#25424) @eps1lon -- ​<!-- 53 -->[Pickers] Simplify internals of \*Wrapper components (#25369) @eps1lon -- ​<!-- 35 -->[Pickers] Remove `make*` HOCs (#25172) @eps1lon -- ​<!-- 19 -->[Pickers] Remove propTypes in production for exotic components (#25261) @eps1lon -- [Pickers] Unify ref behavior (#25425) @eps1lon -- [Pickers] Sort properties (#25473) @eps1lon - -### `@material-ui/utils@5.0.0-alpha.28` - -- ​<!-- 90 -->[utils] Fix useForkRef typings rejecting nullish (#25468) @eps1lon -- ​<!-- 54 -->[utils] Allow functional updates in TypeScript declaration of useControlled (#25378) @MikhailTSE -- ​<!-- 28 -->[utils] Add a new integer propType (#25224) @fayzzzm - -### Docs - -- ​<!-- 56 -->[docs] Fix typo in migration-v4.md (#25384) @Tollwood -- ​<!-- 86 -->[docs] Use defaultCodeOpen where appropriate (#25418) @eps1lon -- ​<!-- 84 -->[docs] Support RTL with styled components (#25457) @silver-snoopy -- ​<!-- 83 -->[docs] Improve the docs of the Grid component (#25429) @oliviertassinari -- ​<!-- 80 -->[docs] Migrate Switch demos to emotion (#25366) @vicasas -- ​<!-- 78 -->[docs] Use Stack in demos (#25419) @vicasas -- ​<!-- 69 -->[docs] Migrate Checkbox demos to emotion (#25394) @vicasas -- ​<!-- 67 -->[docs] Migrate Radio demos to emotion (#25396) @vicasas -- ​<!-- 66 -->[docs] Update icon link to fonts.google.com (#25410) @BGehrels -- ​<!-- 60 -->[docs] Migrate Avatar demos to emotion (#25375) @vicasas -- ​<!-- 57 -->[docs] Fix multiline textfields docs to use minRows/maxRows (#25383) @saleebm -- ​<!-- 55 -->[docs] Consolidate environment variables into next.config (#25386) @eps1lon -- ​<!-- 52 -->[docs] Use `env` next config over DefinePlugin (#25373) @eps1lon -- ​<!-- 49 -->[docs] Migrate SpeedDial to emotion (#25367) @vicasas -- ​<!-- 46 -->[docs] Refine the used prop-type to discriminate number from integer (#25334) @fayzzzm -- ​<!-- 45 -->[docs] Migrate AppBar demos to emotion (#25335) @m4theushw -- ​<!-- 44 -->[docs] Migrate Grid demos to emotion (#25332) @vicasas -- ​<!-- 42 -->[docs] Migrate Toggle Button demos to emotion (#25333) @vicasas -- ​<!-- 41 -->[docs] Migrate Links demos to emotion (#25303) @vicasas -- ​<!-- 40 -->[docs] Migrate Breadcrumbs demos to emotion (#25302) @vicasas -- ​<!-- 34 -->[docs] Migrate Image List demos to emotion (#25301) @vicasas -- ​<!-- 33 -->[docs] Bring clarity about the IE 11 support policy: it's partial (#25262) @oliviertassinari -- ​<!-- 31 -->[docs] Add the new demo page for the data grid (#25284) @DanailH -- ​<!-- 23 -->[docs] Migrate List demos to emotion (#25266) @vicasas -- ​<!-- 21 -->[docs] Migrate Chip demos to emotion (#25268) @vicasas -- ​<!-- 20 -->[docs] Add missing props to \*DatePicker API (#25254) @eps1lon -- ​<!-- 18 -->[docs] Improve accessibility of the basic menu demo (#25207) @ee0pdt -- ​<!-- 16 -->[docs] Migrate Fab demos to emotion (#25251) @vicasas -- ​<!-- 15 -->[docs] Migrate Rating demos to emotion (#25252) @vicasas -- ​<!-- 14 -->[docs] Migrate Transfer List demos to emotion (#25253) @vicasas -- ​<!-- 07 -->[docs] Remove dead generatePropTypeDescription method (#25188) @fayzzzm -- ​<!-- 06 -->[docs] Migrate Skeleton demos to emotion (#25212) @vicasas -- ​<!-- 05 -->[docs] Migrate Paper demos to emotion (#25213) @vicasas -- ​<!-- 03 -->[docs] Migrate Container demos to emotion (#25220) @vicasas -- ​<!-- 01 -->[docs] Add GlobalStyles API (#25191) @eps1lon - -### Core - -- ​<!-- 63 -->[benchmark] Set intended environment (#25402) @eps1lon -- ​<!-- 11 -->[core] Remove .propTypes when the props are empty (#25193) @eps1lon -- ​<!-- 91 -->[core] Fix allSettled usage (#25461) @eps1lon -- ​<!-- 87 -->[core] Switch to React 17 (#25416) @eps1lon -- ​<!-- 65 -->[core] Bump missed node versions (#25385) @eps1lon -- ​<!-- 39 -->[core] Batch small changes (#25330) @oliviertassinari -- ​<!-- 37 -->[core] Use Promise.allSettled over .all where appropriate (#25315) @eps1lon -- ​<!-- 92 -->[test] Use fixture terminology in e2e and visual regression tests (#25466) @eps1lon -- ​<!-- 89 -->[test] Create end-to-end testing CI job (#25405) @eps1lon -- ​<!-- 64 -->[test] Transpile more similar to prod bundle (#25406) @eps1lon -- ​<!-- 32 -->[test] Minor improvements to `describeConformance` (#25297) @eps1lon -- ​<!-- 12 -->[test] Fix warnings in the demos (#25140) @oliviertassinari -- ​<!-- 10 -->[test] Convert createClientRender to TypeScript (#25249) @eps1lon -- ​<!-- 09 -->[test] Increase ttp setup timeout (#25248) @eps1lon -- ​<!-- 02 -->[test] Improve typescript-to-proptypes test suite (#25209) @eps1lon - -All contributors of this release in alphabetical order: @aheimlich, @AlfredoGJ, @BGehrels, @christiaan, @DanailH, @duongdev, @ee0pdt, @eps1lon, @fayzzzm, @heleg, @jansedlon, @jeferson-sb, @johnloven, @julihereu, @kayuapi, @LaneRamp, @m4theushw, @manziEric, @martinfrancois, @MikhailTSE, @natac13, @oliviertassinari, @praveenkumar-kalidass, @RTEYL, @saleebm, @silver-snoopy, @souporserious, @Tollwood, @tomasz-crozzroads, @tomasznguyen, @vedadeepta, @vicasas - -## 5.0.0-alpha.27 - -<!-- generated comparing v5.0.0-alpha.26..next --> - -_Mar 5, 2021_ - -A big thanks to the 12 contributors who made this release possible. Here are some highlights ✨: - -- 👩‍🎤 Convert 8 components to emotion (#25091, #25158, #25146, #25142, #25166) @natac13, @mngu, @m4theushw, @praveenkumar-kalidass. -- 📚 Convert 5 components demos to emotion (#25164, #25183, #25180, #25145, #25138) @vicasas -- And many more 🐛 bug fixes and 📚 improvements. - -### `@material-ui/core@5.0.0-alpha.27` - -- ​<!-- 16 -->[Autocomplete] Support readonly type for the options (#25155) @silver-snoopy -- ​<!-- 13 -->[Drawer] Migrate to emotion (#25091) @natac13 -- ​<!-- 20 -->[LinearProgress] Migrate to emotion (#25158) @mngu -- ​<!-- 06 -->[Pagination] Migrate Pagination and PaginationItem to emotion (#25146) @mngu -- ​<!-- 21 -->[Radio] Migrate to emotion (#25152) @mngu -- ​<!-- 10 -->[Snackbar] Migrate to emotion (#25142) @m4theushw -- ​<!-- 25 -->[SpeedDial] Migrate to emotion (#25166) @m4theushw -- ​<!-- 12 -->[Stepper] Migrate StepConnector to emotion (#25092) @praveenkumar-kalidass -- ​<!-- 07 -->[styled] Fix override logic to support component without root (#25143) @niting143 -- ​<!-- 08 -->[Table] Remove default role logic in TableCell (#25105) @silver-snoopy -- ​<!-- 27 -->[Table] Use primary cover over secondary for selected state (#25182) @beaudry -- ​<!-- 23 -->[theme] Fix styleOverrides with nested selectors (#25156) @ruppysuppy - -### `@material-ui/system@5.0.0-alpha.27` - -- ​<!-- 02 -->[system] Fix behavior of visuallyHidden when used with `sx` prop (#25110) @niting143 - -### `@material-ui/lab@5.0.0-alpha.27` - -#### Breaking changes - -- ​<!-- 18 -->[Pickers] Remove `dateAdapter` prop (#25162) @eps1lon - -The prop didn't solve any important problem better than any of its alternatives do. - -```diff --<DatePicker dateAdapter={x} /> -+<LocalizationProvider dateAdapter={x}> -+ <DatePicker /> -+</LocalizationProvider> -``` - -#### Changes - -- ​<!-- 19 -->[Pickers][internal] Use React.forwardRef instead of forwardedRef prop (#25173) @eps1lon - -### `@material-ui/styles@5.0.0-alpha.27` - -- ​<!-- 03 -->[styles] Use capitalize from utils (#25136) @eps1lon - -### Docs - -- ​<!-- 22 -->[docs] Migrate Bottom navigation demos to emotion (#25180) @vicasas -- ​<!-- 09 -->[docs] Migrate Button demos to emotion (#25138) @vicasas -- ​<!-- 17 -->[docs] Migrate Divider demos to emotion (#25145) @vicasas -- ​<!-- 24 -->[docs] Migrate Pagination demos to emotion (#25183) @vicasas -- ​<!-- 26 -->[docs] Migrate Typography demos to emotion (#25164) @vicasas -- ​<!-- 11 -->[docs] Remove CircleCI from backers (#24801) @mbrookes -- ​<!-- 14 -->[docs] Update the used testing libraries (#25144) @oliviertassinari - -### Core - -- ​<!-- 01 -->[changelog] Better document breaking changes @oliviertassinari -- ​<!-- 05 -->[core] Modernize icons `builder:src` (#25137) @eps1lon -- ​<!-- 04 -->[core] Properly use BABEL_ENV test and development (#25139) @eps1lon -- ​<!-- 15 -->[test] Add (manual) visual regression test for icons (#25160) @eps1lon - -All contributors of this release in alphabetical order: @beaudry, @eps1lon, @m4theushw, @mbrookes, @mngu, @natac13, @niting143, @oliviertassinari, @praveenkumar-kalidass, @ruppysuppy, @silver-snoopy, @vicasas - -## 5.0.0-alpha.26 - -<!-- generated comparing v5.0.0-alpha.25..next --> - -_Feb 27, 2021_ - -A big thanks to the 26 contributors who made this release possible. Here are some highlights ✨: - -- 👩‍🎤 Convert 11 components to emotion (#24696, #24631, #24857, #25048, #24693, #24663, #25007, #24688, #24665, #24878, #24571) @praveenkuma @natac13 @xs9627 @povilass @m4theushw @natac13 @natac13 @DanailH @duganbrett @duganbrett @praveenkumar-kalidass @vinyldarkscratch. - 75% of the components have been migrated so far, thanks to the help of the community. -- 🦴 Convert 4 components to the unstyled pattern (#24985, #24857, #24890, #24957) @povilass. - This change doesn't introduce any breaking changes. Hence, most of the conversion effort will be done post v5-stable. -- 📚 Fix the generation of the API pages for the date pickers (#25101, #25100, #25086, #25089, #25085, #25084) @eps1lon. - This is a follow-up effort after we have merged `material-ui-pickers`. The components are written in TypeScript which required us to upgrade our infra. -- 👌 Improve the Slider thumb and track animation (#24968) @remyoudemans. - The thumb is now moving with a light transition between different values unless it's dragged. - <img src="https://user-images.githubusercontent.com/3165635/109394906-b7405a00-7929-11eb-829a-3b5246c30c08.gif" width="412" height="110" alt="thumb-animation" /> -- 💅 Convert 5 components with custom colors support (#25099, #25088) @mngu. - This change makes it easier to leverage custom palettes -- And many more 🐛 bug fixes and 📚 improvements. - -### `@material-ui/core@5.0.0-alpha.26` - -#### Breaking changes - -- ​<!-- 089 -->[Tabs] Change the default indicatorColor and textColor prop values to "primary" (#25063) @Dripcoding - - This is done to match the most common use cases with Material Design. You can restore the previous behavior with: - - ```diff - -<Tabs /> - +<Tabs indicatorColor="secondary" textColor="inherit" /> - ``` - -#### Changes - -- ​<!-- 099 -->[AppBar][circularprogress][LinearProgress] Support custom colors (#25099) @mngu -- ​<!-- 102 -->[Autocomplete] Prevent closing on no-option text click (#25103) @silver-snoopy -- ​<!-- 101 -->[Autocomplete] Fix ListboxComponent slot regression (#25102) @oliviertassinari -- ​<!-- 035 -->[Autocomplete] Fix the return type of AutocompleteGetTagProps (#24950) @joemaffei -- ​<!-- 029 -->[Autocomplete] Migrate to emotion (#24696) @natac13 -- ​<!-- 091 -->[Button] Fix ripple stuck after displaying the context menu (#25004) @DanailH -- ​<!-- 082 -->[Button] Fix forward classes to ButtonBase (#25072) @praveenkumar-kalidass -- ​<!-- 034 -->[Chip] Normalize Material Design States (#24915) @oliviertassinari -- ​<!-- 031 -->[Chip] Fix focus-visible regression (#24906) @oliviertassinari -- ​<!-- 018 -->[CircularProgress] Make source easier to read (#24893) @oliviertassinari -- ​<!-- 053 -->[Menu] Migrate MenuItem to emotion (#24631) @xs9627 -- ​<!-- 079 -->[Paper] Fix type support of overridable component (#25059) @mngu -- ​<!-- 051 -->[Skeleton] Fix global theme customization (#24983) @glocore -- ​<!-- 067 -->[Slider] Improve thumb and track animation (#24968) @remyoudemans -- ​<!-- 009 -->[Slider] Fix override of event.target when preparing change events (#24782) @praveenkumar-kalidass -- ​<!-- 097 -->[Snackbar] Migrate SnackbarContent to emotion (#25048) @m4theushw -- ​<!-- 028 -->[SwipeableDrawer] Fix detection of native scroll container (#24903) @oliviertassinari -- ​<!-- 059 -->[Switch] Migrate to emotion (#24693) @natac13 -- ​<!-- 050 -->[Switch] Update to follow current MD guidelines (#24954) @hxqlin -- ​<!-- 016 -->[Table] Migrate TableCell to emotion (#24663) @natac13 -- ​<!-- 094 -->[TextField] Support custom color and size (#25088) @mngu -- ​<!-- 093 -->[TextField] Fix input adornment color (#25090) @manziEric -- ​<!-- 081 -->[TextField] Fix FilledInput AA contrast issue (#25046) @Dripcoding -- ​<!-- 072 -->[TextField] Migrate FormControlLabel to emotion (#25007) @DanailH -- ​<!-- 069 -->[TextField] Fix label wrap, display an ellipsis instead (#25012) @NekoApocalypse -- ​<!-- 052 -->[TextField] Migrate OutlinedInput to emotion (#24688) @duganbrett -- ​<!-- 048 -->[TextField] Fix focused={true} disabled={true} infinite render (#24961) @oliviertassinari -- ​<!-- 019 -->[TextField] Migrate FormLabel and InputLabel to emotion (#24665) @duganbrett -- ​<!-- 077 -->[theme] Update theme.palette.text.secondary to match the spec (#25060) @Dripcoding -- ​<!-- 058 -->[ToggleButton] Migrate ToggleButtonGroup to emotion (#24878) @praveenkumar-kalidass -- ​<!-- 098 -->[Tooltip] Migrate to emotion (#24571) @vinyldarkscratch - -### `@material-ui/unstyled@5.0.0-alpha.26` - -- ​<!-- 033 -->[Portal] Migrate to unstyled (#24890) @povilass -- ​<!-- 047 -->[FocusTrap] Migrate to unstyled (#24957) @povilass -- ​<!-- 060 -->[Backdrop] Migrate to unstyled (#24985) @povilass -- ​<!-- 078 -->[Modal] Migrate to emotion + unstyled (#24857) @povilass - -### `@material-ui/lab@5.0.0-alpha.26` - -- ​<!-- 071 -->[Pickers] Fix scroll-jump when opening with a selected value (#25010) @eps1lon -- ​<!-- 066 -->[Pickers] Rework keyboard navigation implementation (#24315) @eps1lon -- ​<!-- 065 -->[Pickers] Fix picker components not opening on click in React 17 (#24981) @eps1lon -- ​<!-- 013 -->[Pickers] Fix outdated link to PickersDay (#24883) @oliviertassinari - -### `@material-ui/icons@5.0.0-alpha.26` - -- ​<!-- 087 -->[icons] Synchronize icons (#25055) @eps1lon - - 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: - - ```diff - // AmpStories -> Download - -AmpStories - +Download - -AmpStoriesOutlined - +DownloadOutlined - -AmpStoriesRounded - +DownloadRounded - -AmpStoriesSharp - +DownloadSharp - -AmpStoriesTwoTone - +DownloadTwoTone - // Outbond -> Outbound - -Outbond - +Outbound - -OutbondOutlined - +OutboundOutlined - -OutbondRounded - +OutboundRounded - -OutbondSharp - +OutboundSharp - -OutbondTwoTone - +OutboundTwoTone - ``` - - We are getting closer to the maximum number of icons our infrastructure can support. In the future, we might remove the least popular icons in favor of the most frequently used ones. - -### `@material-ui/system@5.0.0-alpha.26` - -- ​<!-- 057 -->[system] Fix gap, rowGap, columnGap, borderRadius reponsive support (#24994) @oliviertassinari - -### `@material-ui/utils@5.0.0-alpha.26` - -- ​<!-- 025 -->[utils] Fix isMuiElement types (#24936) @oliviertassinari - -### Docs - -- ​<!-- 100 -->[docs] Add DateRangePickerDay, PickersDay, PickersCalendarSkeleton, MontherPicker API (#25101) @eps1lon -- ​<!-- 096 -->[docs] Add DayPicker API (#25100) @eps1lon -- ​<!-- 095 -->[docs] Improve description of builderbook (#25086) @klyburke -- ​<!-- 092 -->[docs] Add API of ClockPicker (#25089) @eps1lon -- ​<!-- 090 -->[docs] Add API of \*DateRangePicker components (#25085) @eps1lon -- ​<!-- 088 -->[docs] Add API of \*DateTimePicker components (#25084) @eps1lon -- ​<!-- 084 -->[docs] Add graphql-starter to Example Projects (#25068) @koistya -- ​<!-- 083 -->[docs] Migrate Alert demos to emotion (#25074) @m4theushw -- ​<!-- 075 -->[docs] Add codesandbox example for styled-components (#25050) @jony89 -- ​<!-- 056 -->[docs] Wrong link @oliviertassinari -- ​<!-- 049 -->[docs] Improve error message when GitHub API fail (#24976) @oliviertassinari -- ​<!-- 037 -->[docs] Separate simple and nested modal demos (#24938) @ydubinskyi -- ​<!-- 030 -->[docs] Remove under construction icons from DataGrid feature pages (#24946) @DanailH -- ​<!-- 020 -->[docs] Fix prefers-color-scheme switch (#24902) @oliviertassinari -- ​<!-- 001 -->[docs] Add yarn install step, safer @oliviertassinari -- ​<!-- 055 -->[examples] Fix code sandbox link GitHub branch (#24996) @kevbarns - -### Core - -- ​<!-- 086 -->[core] Prevent out-of-memory in test_types_next (#25079) @eps1lon -- ​<!-- 085 -->[core] Pin playwright image to known working version (#25080) @eps1lon -- ​<!-- 080 -->[core] Remove need to reinject backdrop (#25071) @oliviertassinari -- ​<!-- 074 -->[core] Batch small changes (#25015) @oliviertassinari -- ​<!-- 068 -->[core] More cleanup on Pickers code (#25020) @dborstelmann -- ​<!-- 063 -->[core] Allow running full pipeline with various React versions (#25005) @eps1lon -- ​<!-- 061 -->[core] Fix missing codecov report (#25006) @eps1lon -- ​<!-- 040 -->[core] Fix release:tag pushing to first push remote (#24960) @eps1lon -- ​<!-- 039 -->[core] Fix cache miss when using playwright docker images (#24942) @eps1lon -- ​<!-- 023 -->[core] Prevent out-of-memory when type-checking in CI (#24933) @eps1lon -- ​<!-- 022 -->[core] Disable page size tracking (#24932) @eps1lon -- ​<!-- 021 -->[core] Extract linting into separate CI job (#24930) @eps1lon -- ​<!-- 017 -->[core] Only clone props if needed (#24892) @oliviertassinari -- ​<!-- 015 -->[core] listChangedFiles returns an empty list with no changed files (#24879) @eps1lon -- ​<!-- 014 -->[core] Remove dead code in docs:dev (#24880) @oliviertassinari -- ​<!-- 012 -->[core] Fix a few stylelint error (#24885) @oliviertassinari -- ​<!-- 011 -->[core] Fix name of Safari target (#24881) @oliviertassinari -- ​<!-- 010 -->[core] Prefer return over throw in chainPropTypes (#24882) @oliviertassinari -- ​<!-- 006 -->[core] Support /r/issue-template back (#24870) @oliviertassinari -- ​<!-- 003 -->[core] Simplify xxxClasses types (#24736) @oliviertassinari -- ​<!-- 076 -->[test] Improve BrowserStack configuration (#25049) @oliviertassinari -- ​<!-- 073 -->[test] Track bundle size of unstyled components (#25047) @oliviertassinari -- ​<!-- 070 -->[test] Make `render` required with describeConformanceV5 (#25003) @oliviertassinari -- ​<!-- 064 -->[test] Move a11y tree exclusion to appropriate document (#24998) @eps1lon -- ​<!-- 062 -->[test] Test with ClickAwayListener mount on onClickCapture (#25001) @eps1lon -- ​<!-- 045 -->[test] Improve various timer related issues (#24963) @eps1lon -- ​<!-- 043 -->[test] Avoid Rate Limit Exceeded (#24931) @oliviertassinari -- ​<!-- 042 -->[test] Remove internal icons smoke test (#24969) @eps1lon -- ​<!-- 041 -->[test] Reduce compile time of test:karma in watchmode drastically (#24967) @eps1lon -- ​<!-- 038 -->[test] Dedupe missing act warnings for HoC (#24949) @eps1lon -- ​<!-- 036 -->[test] Consolidate on a single API (#24884) @oliviertassinari -- ​<!-- 027 -->[test] Update react next patch (#24934) @eps1lon -- ​<!-- 026 -->[test] Link CircleCI URL in BS (#24935) @oliviertassinari -- ​<!-- 024 -->[test] Run more tests at the same time (#24886) @oliviertassinari -- ​<!-- 008 -->[test] Dedupe missing act warnings by component name (#24871) @eps1lon -- ​<!-- 007 -->[test] Enable type-unaware versions of disabled typed-aware lint rules (#24873) @eps1lon -- ​<!-- 005 -->[test] Initial workspace definition (#24869) @eps1lon -- ​<!-- 004 -->[test] Add current behavior of focus during mount in Popper (#24863) @eps1lon -- ​<!-- 002 -->[test] Increase BrowserStack timeout to 6min (#24861) @oliviertassinari - -All contributors of this release in alphabetical order: @DanailH, @dborstelmann, @Dripcoding, @duganbrett, @eps1lon, @glocore, @hxqlin, @joemaffei, @jony89, @kevbarns, @klyburke, @koistya, @m4theushw, @manziEric, @mngu, @natac13, @NekoApocalypse, @oliviertassinari, @povilass, @praveenkumar-kalidass, @remyoudemans, @silver-snoopy, @vinyldarkscratch, @xs9627, @ydubinskyi - -## 5.0.0-alpha.25 - -<!-- generated comparing v5.0.0-alpha.24..next --> - -_Feb 11, 2021_ - -A big thanks to the 30 contributors who made this release possible. Here are some highlights ✨: - -- 👩‍🎤 Convert 32 components to emotion. Around 64% of the components have been migrated so far, thanks to the help of the community. We aim to migrate them all before the end of Q1 2021. - The podium of the most active community members in the migration 🏆: - - 1. @natac13 x17 - 2. @vicasas x5 - 3. @kodai3 x4 - -- 📐 Add a subset of MUI System as flattened props on `Typography` (#24496) @mnajdova. - Now, you can do: - - ```jsx - <Typography padding={2} color="text.secondary" /> - ``` - -- 📅 Focus on the date pickers, 5 fixes and 3 docs improvements. -- 💅 Provide a new [`darkScrollbar()`](https://mui.com/components/css-baseline/#scrollbars) CSS utility to improve the native scrollbar in dark mode. The documentation uses it. - -### `@material-ui/core@5.0.0-alpha.25` - -#### Breaking changes - -- Increase the minimum version of TypeScript supported from v3.2 to v3.5. (#24795) @petyosi - - We try to align with types released from [DefinitelyTyped](https://github.com/DefinitelyTyped/DefinitelyTyped) (i.e. packages published on npm under the `@types` namespace). - We will not change the minimum supported version in a major version of Material UI. - However, we generally recommend to not use a TypeScript version older than the [lowest supported version of DefinitelyTyped](https://github.com/DefinitelyTyped/DefinitelyTyped#older-versions-of-typescript-33-and-earlier). - -#### Changes - -- ​<!-- 03 -->[ImageList] Migrate to emotion (#24615) @kodai3 -- ​<!-- 04 -->[Dialog] Migrate DialogTitle to emotion (#24623) @vicasas -- ​<!-- 05 -->[TextField] Prepare removal of labelWidth prop (#24595) @oliviertassinari -- ​<!-- 08 -->[ImageList] Migrate ImageListItem to emotion (#24619) @kodai3 -- ​<!-- 09 -->[Card] Migrate CardMedia to emotion (#24625) @natac13 -- ​<!-- 10 -->[Card] Migrate CardHeader to emotion (#24626) @natac13 -- ​<!-- 11 -->[TextField] Migrate FilledInput to emotion (#24634) @mnajdova -- ​<!-- 12 -->[Fab] Migrate to emotion (#24618) @natac13 -- ​<!-- 14 -->[ClickAwayListener] Fix `children` and `onClickAway` types (#24565) @eps1lon -- ​<!-- 15 -->[List] Migrate ListItemIcon to emotion (#24630) @vicasas -- ​<!-- 17 -->[Card] Migrate CardActionArea to emotion (#24636) @natac13 -- ​<!-- 18 -->[DataTable] Add example in docs for data table (#24428) @DanailH -- ​<!-- 19 -->[CircularProgress] Migrate to emotion (#24622) @natac13 -- ​<!-- 20 -->[ImageList] Migrate ImageListItemBar to emotion (#24632) @kodai3 -- ​<!-- 21 -->[TextField] Migrate Input component to emotion (#24638) @duganbrett -- ​<!-- 22 -->[Tab] Migrate to emotion (#24651) @natac13 -- ​<!-- 24 -->[Table] Migrate to emotion (#24657) @natac13 -- ​<!-- 25 -->[List] Migrate ListItemAvatar to emotion (#24656) @vicasas -- ​<!-- 26 -->[TextField] Migrate FormControl to emotion (#24659) @duganbrett -- ​<!-- 27 -->[Table] Migrate TableContainer to emotion (#24666) @natac13 -- ​<!-- 28 -->[Tab] Migrate TabScrollButton to emotion (#24654) @natac13 -- ​<!-- 29 -->[Card] Warn on raised + outlined (#24648) @sumarlidason -- ​<!-- 32 -->[TextField] Migrate FormHelperText to emotion (#24661) @duganbrett -- ​<!-- 33 -->[Dialog] Migrate DialogContent to emotion (#24670) @vicasas -- ​<!-- 36 -->[Typography] Add system props (#24496) @mnajdova -- ​<!-- 38 -->[Paper] Improve warning on invalid combinations of variant and elevation (#24667) @eps1lon -- ​<!-- 39 -->[Chip] Migrate to emotion (#24649) @natac13 -- ​<!-- 41 -->[ToggleButton] Migrate to emotion (#24674) @natac13 -- ​<!-- 42 -->[Step] Migrate to emotion (#24678) @natac13 -- ​<!-- 45 -->[Link] Fix CSS prefix property casing with emotion (#24701) @idanrozin -- ​<!-- 50 -->[Card] Use the default elevation (#24733) @oliviertassinari -- ​<!-- 53 -->[Typography] Remove align inherit noise (#24717) @oliviertassinari -- ​<!-- 56 -->[Dialog] Convert role `none presentation` to `presentation` (#24500) @hallzac2 -- ​<!-- 64 -->[TextField] Improve baseline alignment with start adornment (#24742) @praveenkumar-kalidass -- ​<!-- 65 -->[Popper] Fix usage of ownerDocument with anchorEl (#24753) @ruppysuppy -- ​<!-- 75 -->[Table] Migrate TableBody to emotion (#24703) @natac13 -- ​<!-- 76 -->[Table] Migrate TableRow to emotion (#24687) @natac13 -- ​<!-- 77 -->[TextField] Migrate FormGroup to emotion (#24685) @vicasas -- ​<!-- 82 -->[CssBaseline] Make dark mode scrollbar overrides an optional function (#24780) @dborstelmann -- ​<!-- 83 -->[ButtonGroup] Migrate ButtonGroup to emotion (#24775) @mirefly -- ​<!-- 87 -->[Checkbox] Migrate to emotion (#24702) @natac13 -- ​<!-- 89 -->[Table] Migrate TableHead to emotion (#24686) @natac13 -- ​<!-- 90 -->[Table] Migrate TableFooter to emotion (#24684) @natac13 -- ​<!-- 92 -->[Skeleton] Migrate to emotion (#24652) @kodai3 - -### `@material-ui/system@5.0.0-alpha.25` - -#### Breaking changes - -- ​<!-- 78 -->[system] Use spacing unit in `gap`, `rowGap`, and `columnGap` (#24794) @ruppysuppy - - 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, for example `<Box padding={2}>`. - - ```diff - <Box - - gap={2} - + gap="2px" - > - ``` - -### `@material-ui/styled-engine@5.0.0-alpha.25` - -- ​<!-- 34 -->[styled-engine] Fix GlobalStyles not to throw when no theme is available (#24671) @mnajdova - -### `@material-ui/types@5.0.0-alpha.25` - -#### Breaking changes - -- ​<!-- 91 -->[types] Rename the exported `Omit` type in `@material-ui/types`. (#24795) @petyosi - The module is now called `DistributiveOmit`. The change removes the confusion with the built-in `Omit` helper introduced in TypeScript v3.5. The built-in `Omit`, while similar, is non-distributive. This leads to differences when applied to union types. [See this Stack Overflow answer for further details](https://stackoverflow.com/a/57103940/1009797). - -```diff --import { Omit } from '@material-ui/types'; -+import { DistributiveOmit } from '@material-ui/types'; -``` - -#### Changes - -- ​<!-- 61 -->[types] Remove implicit children from PropInjector (#24746) @eps1lon - -### `@material-ui/lab@5.0.0-alpha.25` - -- ​<!-- 02 -->[Pickers] Fix role attribute (#24621) @EkaterinaMozheiko -- ​<!-- 35 -->[Pickers] Fix `showTodayButton` not returning the current time (#24650) @anthonyraymond -- ​<!-- 44 -->[Pickers] Ensure components have a display name in DEV (#24676) @eps1lon -- ​<!-- 49 -->[Pickers] Fix more name inconsistencies (#24734) @oliviertassinari -- ​<!-- 54 -->[Pickers] Dismiss on clickaway when using the desktop variant (#24653) @eps1lon -- ​<!-- 69 -->[Pickers] Add missing periods at end of some descriptions (#24791) @fulin426 -- ​<!-- 81 -->[Pickers] Enable YearPicker documentation (#24830) @oliviertassinari -- ​<!-- 88 -->[Pickers] Fix useState related console warnings in examples (#24848) @ydubinskyi - -### Docs - -- ​<!-- 06 -->[docs] Add sorting section (#24637) @dtassone -- ​<!-- 13 -->[docs] Include in docs directive to silence `eslint` erroneous warning (#24644) @silviot -- ​<!-- 23 -->[docs] Clarifying the documentation about Chip behavior (#24645) @KarimOurrai -- ​<!-- 30 -->[docs] Update Typography in migration guide (#24662) @mbrookes -- ​<!-- 37 -->[examples] Update examples to use StyledEngineProvider (#24489) @mnajdova -- ​<!-- 40 -->[docs] Add API documentation for \*DatePicker components (#24655) @eps1lon -- ​<!-- 47 -->[docs] Add HoodieBees to sponsors (#24735) @mbrookes -- ​<!-- 48 -->[docs] Fix indent @oliviertassinari -- ​<!-- 55 -->[docs] Make <main> responsive to font size (#24531) @eps1lon -- ​<!-- 59 -->[docs] Follow similar demo pattern for date and time pickers (#24739) @eps1lon -- ​<!-- 66 -->[docs] Add information about local dev environment (#24771) @plug-n-play -- ​<!-- 67 -->[docs] Add tcespal to Showcase (#24793) @ArnaultNouvel -- ​<!-- 68 -->[docs] Fix CssBaseline typography description (#24802) @xiaoyu-tamu -- ​<!-- 70 -->[docs] Add 'playlist' synonym to 'menu' (#24754) @Lagicrus -- ​<!-- 71 -->[docs] Add more similar icons (#24799) @oliviertassinari -- ​<!-- 72 -->[docs] Fix typo in the error message generated by createMuiTheme (#24827) @mbrookes -- ​<!-- 73 -->[examples] Align more with the v5 recommended approach (#24798) @Tejaswiangotu123 -- ​<!-- 74 -->[docs] Update ButtonGroup demos to match v5 (#24797) @SCollinA -- ​<!-- 84 -->[docs] Fix formatting of `mask` prop description (#24842) @eps1lon -- ​<!-- 92 -->[docs] Add read synonym to drafts (#24854) @Lagicrus - -### Core - -- ​<!-- 01 -->[core] Fix release:tag pushing to material-ui-docs (#24633) @eps1lon -- ​<!-- 16 -->[core] Fix `next` using stale pages (#24635) @eps1lon -- ​<!-- 31 -->[test] Skip JSDOM in style related conformance tests (#24668) @mnajdova -- ​<!-- 43 -->[test] Conformance to handle wrapped elements (#24679) @natac13 -- ​<!-- 51 -->[core] Batch small changes (#24705) @oliviertassinari -- ​<!-- 52 -->[test] Run more tests in Strict Mode (#24646) @oliviertassinari -- ​<!-- 57 -->[test] Avoid visual flakiness (#24737) @oliviertassinari -- ​<!-- 60 -->[core] Remove deprecated SimplifiedPropsOf/Simplify types (#24750) @petyosi -- ​<!-- 62 -->[core] Disable type-checking of .propTypes (#24747) @eps1lon -- ​<!-- 63 -->[test] Allow setting react-dist-tag via pipeline parameter (#24755) @eps1lon -- ​<!-- 79 -->[test] Don't run dev CI for dependabot pushes (#24833) @eps1lon -- ​<!-- 80 -->[test] Isolate Tooltip tests more (#24834) @eps1lon -- ​<!-- 85 -->[test] Clear emotion cache between tests (#24837) @eps1lon -- ​<!-- 86 -->[core] Save/restore actual yarn cache folder (#24844) @eps1lon -- ​<!-- 91 -->[test] Increase timeout to 4000ms for screenshots (#24850) @oliviertassinari - -All contributors of this release in alphabetical order: @anthonyraymond, @ArnaultNouvel, @DanailH, @dborstelmann, @dtassone, @duganbrett, @EkaterinaMozheiko, @eps1lon, @fulin426, @hallzac2, @idanrozin, @KarimOurrai, @kodai3, @Lagicrus, @mbrookes, @mirefly, @mnajdova, @natac13, @oliviertassinari, @petyosi, @plug-n-play, @praveenkumar-kalidass, @ruppysuppy, @SCollinA, @silviot, @sumarlidason, @Tejaswiangotu123, @vicasas, @xiaoyu-tamu, @ydubinskyi - -## 5.0.0-alpha.24 - -<!-- generated comparing v5.0.0-alpha.23..next --> - -_Jan 26, 2021_ - -A big thanks to the 23 contributors who made this release possible. Here are some highlights ✨: - -- 👩‍🎤 Convert 31 components to emotion. Around 40% of the components have been migrated so far thanks to the help of the community. -- 🐛 Fix two long-standing issues with the Grid. Solve the horizontal scrollbar as well as dimensions when nesting (#24332) @greguintow. -- 📚 Fix various display issues on API documentation pages (#24526, #24503, #24504. #24517, #24417). -- 📐 Add a subset of MUI System as flatten props on the CSS utility components (`Grid` and `Box` so far, `Typography` and `Stack` coming later) (#24485, #24499) @mnajdova. - - ```jsx - <Box m={2}> - ``` - -### `@material-ui/core@5.0.0-alpha.24` - -- ​<!-- 85 -->[Dialog] Migrate DialogActions to emotion (#24613) @vicasas -- ​<!-- 84 -->[Toolbar] Migrate to emotion (#24567) @natac13 -- ​<!-- 83 -->[Hidden] Fix unsupported props warning when sx prop is used (#24624) @mnajdova -- ​<!-- 82 -->[List] Migrate ListItemText to emotion (#24602) @natac13 -- ​<!-- 80 -->[List] Migrate ListItemSecondaryAction to emotion (#24593) @xs9627 -- ​<!-- 79 -->[BottomNavigation] Migrate to emotion (#24556) @vinyldarkscratch -- ​<!-- 77 -->[CardActions] Fix wrong classes export name (#24609) @mnajdova -- ​<!-- 76 -->[Card] Migrate CardContent to emotion (#24600) @vicasas -- ​<!-- 75 -->[Card] Migrate to emotion (#24597) @povilass -- ​<!-- 74 -->[TextField] Migrate InputBase to emotion (#24555) @duganbrett -- ​<!-- 73 -->[Accordion] Allow to disable gutter/spacing (#24532) @TimonPllkrn -- ​<!-- 72 -->[List] Migrate to emotion (#24560) @vinyldarkscratch -- ​<!-- 71 -->[Card] Migrate CardActions to emotion (#24604) @vicasas -- ​<!-- 69 -->[List] Migrate ListSubheader to emotion (#24561) @vinyldarkscratch -- ​<!-- 68 -->[Breadcrumbs] Migrate to emotion (#24522) @vinyldarkscratch -- ​<!-- 67 -->[Divider] Migrate to emotion (#24558) @vinyldarkscratch -- ​<!-- 66 -->[Switch] Migrate SwitchBase to emotion (#24552) @vinyldarkscratch -- ​<!-- 65 -->[Hidden] Migrate to emotion (#24544) @vinyldarkscratch -- ​<!-- 64 -->[List] Migrate ListItem to emotion (#24543) @xs9627 -- ​<!-- 62 -->[TextField] Fix Google Translate zero-width space issue (#24563) @d3mp -- ​<!-- 61 -->[Table] Separate classes for different labels (#24568) @tonysepia -- ​<!-- 58 -->[Accordion] Migrate AccordionSummary to emotion (#24540) @vinyldarkscratch -- ​<!-- 57 -->[IconButton] Migrate to emotion (#24542) @vinyldarkscratch -- ​<!-- 54 -->[Accordion] Migrate AccordionActions to emotion (#24538) @vinyldarkscratch -- ​<!-- 53 -->[Accordion] Migrate AccordionDetails to emotion (#24539) @vinyldarkscratch -- ​<!-- 50 -->[Link] Migrate to emotion (#24529) @praveenkumar-kalidass -- ​<!-- 49 -->[Accordion] Migrate to emotion (#24518) @vinyldarkscratch -- ​<!-- 46 -->[Backdrop] Migrate to emotion (#24523) @vinyldarkscratch -- ​<!-- 39 -->[Grid] Add system props (#24499) @mnajdova -- ​<!-- 38 -->[Icon] Migrate to emotion (#24516) @vinyldarkscratch -- ​<!-- 36 -->[Collapse] Migrate to emotion (#24501) @vinyldarkscratch -- ​<!-- 33 -->[SvgIcon] Migrate to emotion (#24506) @oliviertassinari -- ​<!-- 32 -->[Avatar] Migrate AvatarGroup to emotion (#24452) @praveenkumar-kalidass -- ​<!-- 31 -->[Box] Add back system props (#24485) @mnajdova -- ​<!-- 30 -->[Alert] Migrate AlertTitle to emotion (#24448) @povilass -- ​<!-- 26 -->[Alert] Migrate to emotion (#24442) @kutnickclose -- ​<!-- 21 -->[l10n] Improve Hebrew translation (#24449) @eladmotola -- ​<!-- 19 -->[Checkbox][switch] Document defaultChecked (#24446) @praveenkumar-kalidass -- ​<!-- 18 -->[AppBar] Migrate to emotion (#24439) @povilass -- ​<!-- 16 -->[l10n] Improve German translation (#24436) @lukaselmer -- ​<!-- 15 -->[Button][badge] Support custom colors and sizes (#24408) @mnajdova -- ​<!-- 10 -->[Grid] Fix horizontal scrollbar and nested dimensions (#24332) @greguintow -- ​<!-- 07 -->[Grid] Migrate to emotion (#24395) @mnajdova -- ​<!-- 06 -->[Badge] Fix TS custom variants (#24407) @mnajdova - -### `@material-ui/lab@5.0.0-alpha.24` - -- ​<!-- 48 -->[DatePicker] Remove unnecessary wrapping dom node (#24533) @mxsph -- ​<!-- 12 -->[DateRangePicker] Remove variant prop override for Textfield (#24433) @praveenkumar-kalidass -- ​<!-- 03 -->[lab] Reflect draft pattern of picker value in implementation (#24367) @eps1lon - -### `@material-ui/styled-engine@5.0.0-alpha.24` - -- ​<!-- 13 -->[styled-engine] Rename StylesProvider to StyledEngineProvider (#24429) @mnajdova - -### `@material-ui/system@5.0.0-alpha.24` - -- ​<!-- 44 -->[system] Fix handling of null-ish values (#24530) @oliviertassinari - -### `@material-ui/unstyled@5.0.0-alpha.24` - -- ​<!-- 08 -->[unstyled] Convert composeClasses to TypeScript (#24396) @eps1lon - -### `@material-ui/utils@5.0.0-alpha.24` - -- ​<!-- 60 -->[utils] `useEventCallback` `args` defaults to `unknown[]` (#24564) @eps1lon -- ​<!-- 11 -->[utils] Fix requirePropFactory to merge validators (#24423) @mnajdova - -### Docs - -- ​<!-- 86 -->[examples] Patch preact example not working (#24616) -- ​<!-- 78 -->[docs] Add missing newline in component JSDoc (#24610) @eps1lon -- ​<!-- 70 -->[docs] Add API of picker components (#24497) @eps1lon -- ​<!-- 63 -->[examples] Add `locale` prop to the Nextjs Link component (#24596) @CyanoFresh -- ​<!-- 52 -->[docs] List required props first in /api/\* (#24526) @eps1lon -- ​<!-- 45 -->[docs] Mention MUI System props when available in the API pages (#24503) @mnajdova -- ​<!-- 43 -->[docs] Improve system properties page (#24524) @mnajdova -- ​<!-- 42 -->[docs] Fix malformed component API description (#24504) @eps1lon -- ​<!-- 41 -->[docs] Fix ToC "Component name" fragment link on /api/\* (#24517) @eps1lon -- ​<!-- 40 -->[docs] Fix ToC on /api pages linking to api-docs (#24515) @eps1lon -- ​<!-- 37 -->[docs] Add comment explaining specificity bump on Select (#24509) @KarimMokhtar -- ​<!-- 28 -->[docs] Compute spreadable from tests (#24490) @eps1lon -- ​<!-- 27 -->[docs] Fix label bug in stepper vertical demo (#24491) @artola -- ​<!-- 20 -->[docs] Update Divjoy URL (#24447) @mbrookes -- ​<!-- 17 -->[docs] Improve packages description (#24330) @oliviertassinari -- ​<!-- 14 -->[docs] Fix content-layout-shift (#24418) @oliviertassinari -- ​<!-- 09 -->[docs] Document default values of external props (#24417) @eps1lon -- ​<!-- 02 -->[docs] Update in-house ads (#24410) @mbrookes @ewldev - -### Core - -- ​<!-- 87 -->[core] Skip downloading browser binaries in codesandbox/ci (#24628) @eps1lon -- ​<!-- 81 -->[core] Batch small changes (#24599) @oliviertassinari -- ​<!-- 59 -->[test] Simplify DatePicker tests (#24545) @eps1lon -- ​<!-- 51 -->[core] Improve pseudo classes overrides error (#24535) @mnajdova -- ​<!-- 35 -->[core] Fix styleProps to always contain all props (#24505) @mnajdova -- ​<!-- 34 -->[test] Fix AvatarGroup failing test (#24512) @mnajdova -- ​<!-- 29 -->[pickers] Sort tests (#24481) @eps1lon -- ​<!-- 25 -->[test] Split tests in describeConformanceV5 to isolate them (#24479) @mnajdova -- ​<!-- 24 -->[core] Do not forward classes prop by default in experimentalStyled (#24451) @mnajdova -- ​<!-- 23 -->[core] Pass styleProps on all slots in the styled() components (#24454) @mnajdova -- ​<!-- 22 -->[core] Batch small changes (#24445) @oliviertassinari -- ​<!-- 01 -->[core] Normalize generating declaration files (#24411) @eps1lon - -All contributors of this release in alphabetical order: @artola, @CyanoFresh, @d3mp, @duganbrett, @eladmotola, @eps1lon, @ewldev, @greguintow, @KarimMokhtar, @kutnickclose, @lukaselmer, @mbrookes, @mnajdova, @mxsph, @natac13, @oliviertassinari, @povilass, @praveenkumar-kalidass, @TimonPllkrn, @tonysepia, @vicasas, @vinyldarkscratch, @xs9627 - -## 5.0.0-alpha.23 - -_Jan 14, 2021_ - -A big thanks to the 15 contributors who made this release possible. Here are some highlights ✨: - -- 📚 Only document public paths in module augmentation (#24267) @eps1lon -- 👩‍🎤 Migrate the Paper and CssBaseline to emotion (#24397, #24176) @povilass @mnajdova - - We have reached a point where we feel confident that the new approach should make it to v5 stable. An issue has been created to track the progress with the migration to emotion: #24405. Your contribution to this effort and the ones from the community are welcome 🙌. - -- 📅 Various improvements on the date picker components (#24301, #24309, #24275, #24298, #24319) @m4theushw @eps1lon @huzaima @praveenkumar-kalidass -- And many more 🐛 bug fixes and 📚 improvements. - -### `@material-ui/core@v5.0.0-alpha.23`/`@material-ui/unstyled@v5.0.0-alpha.23` - -- [Container] Fix disableGutters style not applied (#24284) @povilass -- [Paper] Migrate to emotion (#24397) @povilass -- [Slider] Allow mobile VO users to interact with Sliders (#23902) @CodySchaaf -- [SwipeableDrawer] Add bleeding demo (#24268) @vicasas -- [SwipeableDrawer] Fix overflow scroll computation logic (#24225) @yann120 -- [Table] Fix "more than" translation in es-ES (#24356) @vicasas -- [TextField] Fix error color for form input with secondary color (#24290) @praveenkumar-kalidass -- [Button] Fix resolution of default props (#24253) @oliviertassinari - -### `@material-ui/lab@v5.0.0-alpha.23` - -#### Breaking changes - -- [DateRangePicker] Remove DateRangDelimiter (#24298) @huzaima - - You can migrate away from it with: - - ```diff - diff --git a/docs/src/pages/components/date-range-picker/BasicDateRangePicker.tsx b/docs/src/pages/components/date-range-picker/BasicDateRangePicker.tsx - index 72a89f9a11..2742fa6811 100644 - --- a/docs/src/pages/components/date-range-picker/BasicDateRangePicker.tsx - +++ b/docs/src/pages/components/date-range-picker/BasicDateRangePicker.tsx - @@ -3,7 +3,7 @@ import TextField from '@material-ui/core/TextField'; - import DateRangePicker, { DateRange } from '@material-ui/lab/DateRangePicker'; - import AdapterDateFns from '@material-ui/lab/AdapterDateFns'; - import LocalizationProvider from '@material-ui/lab/LocalizationProvider'; - -import DateRangeDelimiter from '@material-ui/lab/DateRangeDelimiter'; - +import Box from '@material-ui/core/Box'; - - export default function BasicDateRangePicker() { - const [value, setValue] = React.useState<DateRange<Date>>([null, null]); - @@ -20,7 +20,7 @@ export default function BasicDateRangePicker() { - renderInput={(startProps, endProps) => ( - <React.Fragment> - <TextField {...startProps} variant="standard" /> - - <DateRangeDelimiter> to </DateRangeDelimiter> - + <Box sx={{ mx: 2 }}>to</Box> - <TextField {...endProps} variant="standard" /> - </React.Fragment> - )} - ``` - -#### Changes - -- [DatePicker] Fix out of range month selection (#24301) @m4theushw -- [DatePicker] Replace withDefaultProps with useThemeProps (#24309) @m4theushw -- [DatePicker] Simplify ExtendWrapper type (#24275) @eps1lon -- [DatePicker] Reduce coupling of parsing picker input value and props (#24319) @eps1lon -- [TimePicker] Add pointer cursor for clock in desktop (#24276) @praveenkumar-kalidass -- [lab] Drop usage of createStyles (#24158) @eps1lon -- [lab] Fix import paths in generated declaration files (#24380) @eps1lon -- [lab] Prevent possible null pointer in useValidation (#24318) @eps1lon - -### `@material-ui/styled-engine@v5.0.0-alpha.23`/`@material-ui/styled-engine-sc@v5.0.0-alpha.23` - -- [styled-engine] Add `GlobalStyles` component (#24176) @mnajdova - -### Docs - -- [docs] Add example performance Stepper vertical (#24292) @vicasas -- [docs] Change Link example from JS to TS (#24291) @vicasas -- [docs] Do not show 'Add' if user input matches existing option (#24333) @ramdog -- [docs] Focus docs search input when the shortcut is clicked (#24296) @eps1lon -- [docs] Further template the CSS API descriptions (#24360) @mbrookes -- [docs] Improve Next.js Link integration (#24258) @oliviertassinari -- [docs] Misc API fixes (#24357) @mbrookes -- [docs] Prevent kbd to wrap (#24269) @oliviertassinari -- [docs] Simplify icon button docs (#24317) @baharalidurrani -- [docs] Standardize some API descriptions (#24274) @mbrookes -- [docs] Sync AppSearch.tsx with AppSearch.js (#24363) @Lagicrus -- [docs] Update CONTRIBUTING being accepted (#24306) @vicasas -- [docs] Update right to left compatibility plugin version (#24370) @mnajdova -- [docs] Widen example datetime-local picker so it's not clipped (#24324) @ramdog -- [website] Add BrandingFooter (#24095) @mnajdova -- [website] Add Discover more (#24327) @oliviertassinari -- [website] Add newsletter (#24322) @oliviertassinari -- [website] Fix regressions @oliviertassinari -- [website] Improve typography theme (#24386) @oliviertassinari - -### Core - -- [core] Create issue labeled (#24283) @xrkffgg -- [core] Fix eslint @oliviertassinari -- [core] Skip downloading browser binaries when building docs (#24393) @eps1lon -- [core] Small changes (#24329) @oliviertassinari -- [core] Support public paths in module augmentation (#24267) @eps1lon -- [core] Update classes generation logic (#24371) @mnajdova -- [core] Update issue mark duplicate (#24311) @xrkffgg -- [core] Update issues helper version (#24379) @xrkffgg -- [test] Add pipeline task for performance monitoring (#24289) @eps1lon -- [test] Compensate for Circle CI's low performance (#24358) @oliviertassinari -- [test] Debug expensive GH actions still runing for l10nbot (#24392) @eps1lon -- [test] Move callback args to right side of assertion (#24366) @eps1lon -- [test] Persist new declaration files in CI cache (#24313) @eps1lon -- [test] Reduce download times of playwright binaries (#24364) @eps1lon -- [test] Skip expensive GitHub actions on l10nbot commits (#24303) @eps1lon -- [test] Test declaration files in TS nightly (#24391) @eps1lon -- [styles] Define useThemeProps as unstable and fix TS issues (#24383) @mnajdova - -## 5.0.0-alpha.22 - -_Jan 4, 2021_ - -A big thanks to the 14 contributors who made this release possible. Here are some highlights ✨: - -- ♿️ Fix major accessibility issue with the Autocomplete (#24213) @inform880 -- 👩‍🎤 Migrate the Container to emotion (#24227) @oliviertassinari -- 🐛 Fix Next.js regression and other cross-platform issues with the build (#24200, #24223) -- And many more 🐛 bug fixes and 📚 improvements. - -### `@material-ui/core@v5.0.0-alpha.22`/`@material-ui/unstyled@v5.0.0-alpha.22` - -- [Autocomplete] Fix VoiceOver not reading the correct activedescendant (#24213) @inform880 -- [Autocomplete] Warn when value is invalid (#24202) @Sandeep0695 -- [Button] Fix disableElevation regression (#24251) @oliviertassinari -- [Container] Migrate to emotion (#24227) @oliviertassinari -- [Pagination] Fix className forwarding when type is ellipsis (#24256) @andrelmlins -- [Select] Improve description on how it extends the Input components (#24180) @azza85 -- [styled] Fix missing types for `sx` (#24211) @mnajdova -- [styled] Remove unused type parameters from StyledOptions (#24255) @eps1lon -- [styled] Support components without theme (#24214) @mnajdova -- [styles] Fix classes logic (#24250) @oliviertassinari -- [styles] Improve the classes structure (#24249) @oliviertassinari - -### `@material-ui/lab@v5.0.0-alpha.22` - -- [DatePicker] Fix year only view, hide the current month (#24205) @hyeonhong -- [DatePicker] Nested imports for better DX (#24147) @oliviertassinari -- [DatePicker] Remove unused type parameters (#24257) @eps1lon -- [TimePicker] Prevent conflicting type parameter in `ClockProps#getClockLabelText` (#24193) @eps1lon - -### Docs - -- [docs] Accept pages written in TypeScript (#24230) @oliviertassinari -- [docs] Document emotion migration breaking changes (#24229) @luminaxster -- [docs] Fix broken benchmark link (#24210) @jalaj-k -- [docs] Fix codesandbox datagrid demo (#24218) @brno32 -- [docs] Fix iframe demos with emotion (#24232) @oliviertassinari -- [docs] Sync translations (#24161) @l10nbot - -### Core - -- [test] More granular progress tracking of relative type imports (#24233) @eps1lon -- [core] Add missing sx typings on the components migrated to emotion (#24208) @mnajdova -- [core] Batch small changes (#24224) @oliviertassinari -- [core] Create issue mark duplicate (#24184) @xrkffgg -- [core] Fix generation of package.json (#24223) @oliviertassinari -- [core] Fix relative import of types (#24248) @oliviertassinari -- [core] Platform agnostic build script for envinfo (#24200) @eps1lon -- [core] Remove unused generics from experimentalStyled (#24192) @eps1lon - -## 5.0.0-alpha.21 - -_Dec 30, 2020_ - -A big thanks to the 14 contributors who made this release possible. Here are some highlights ✨: - -- 👩‍🎤 Migrate the Avatar to emotion (#24114) @oliviertassinari -- 👩‍🎤 Migrate the Button to emotion (#24107, #24100) @mnajdova -- ♿️ Improve TrapFocus behavior, ignore the container as a tabbable element (#23364) @gregnb - In rare cases, an element might not longer be tabbable when looping, for example overflow container in Firefox. - You can work around the problem by adding a `tabIndex={0}` or customizing the `getTabbable` prop. -- And many more 🐛 bug fixes and 📚 improvements. - -### `@material-ui/core@v5.0.0-alpha.21`/`@material-ui/unstyled@v5.0.0-alpha.21` - -- [Avatar] Migrate to emotion (#24114) @oliviertassinari -- [ButtonBase] Migrate styles to emotion (#24100) @mnajdova -- [Button] Migrate styles to emotion (#24107) @mnajdova -- [unstyled] Add utils for generating utility classes (#24126) @mnajdova -- [FocusTrap] Fix trap to only focus on tabbable elements (#23364) @gregnb -- [Link] Improve integration with Next.js (#24121) @kelvinsanchez15 -- [Select] Fix overflow showing scrollbar (#24085) @Segebre -- [Slider] Fix circular type reference in SliderValueLabel (#24190) @eps1lon -- [Skeleton] Fix default TypeScript component type (#24191) @eps1lon - -### `@material-ui/system@v5.0.0-alpha.21` - -- [system] Fix sx prop typings to support grid gap props (#24093) @mnajdova -- [system] Improve the SxProp typings structure, by splitting them in a separate module. (#24090) @mnajdova -- [system] Replace grid gap properties (#24094) @mnajdova - -### `@material-ui/lab@v5.0.0-alpha.21` - -- [DatePicker] Allow to customize icons (#24017) @jackcwu -- [DatePicker] Fix missing component for theme augmentation (#24092) @rajzik -- [DatePicker] Hide outline on container (#24108) @oliviertassinari -- [DatePicker] Fix accessibility issue with heading (#24183) @gracektay -- [TimePicker] Improve the design to fit on smaller screens (#23855) @marianayap -- [TreeView] Add preventScroll for tree focus (#24105) @praveenkumar-kalidass - -### `@material-ui/styles@v5.0.0-alpha.21` - -- [styles] Fix for supporting non string props in propsToClassKey (#24101) @mnajdova - -### `@material-ui/styled-engine@v5.0.0-alpha.21`/`@material-ui/styled-engine-sc@v5.0.0-alpha.21` - -- [styled-engine] Fix StylesProvider injectFirst with sc (#24104) @mnajdova - -### Docs - -- [docs] Add examples for adding and removing Typography variants (#24088) @mnajdova -- [docs] Fix typo (#24123) @ajonp -- [docs] Fix warning about wrong prop type (#24117) @mnajdova -- [docs] Rename "Customization > Theme > Global" to "Customization > Theme > Components" (#24115) @mnajdova -- [docs] Rename customization/components to customization/how-to-customize (#24089) @mnajdova -- [docs] Replace process.browser with typeof navigator (#24122) @softshipper -- [docs] Sync translations (#24152) @l10nbot -- [docs] Update Fontsource install instructions (#24120) @DecliningLotus -- [docs] Add system grid page (#24119) @mnajdova -- [blog] 2020 in review and beyond (#24130) @oliviertassinari -- [docs] Improve naming and structure of the Customization and Guide pages (#24175) @mnajdova - -### Core - -- [core] Batch small changes (#24131) @oliviertassinari -- [core] Fix overridesResolver on the core components and added tests (#24125) @mnajdova -- [core] Reduce number of files included in language server (#24165) @eps1lon -- [core] Reduce response time of initial PR bot comment (#24168) @eps1lon -- [core] Refactor styled() components to ease out the migration process (#24124) @mnajdova -- [test] Add more packages to browser test suite (#24155) @eps1lon -- [core] Monitor progress of fixing type imports (#24188) @eps1lon -- [core] Fix build on Windows (#24187) @oliviertassinari - -## 5.0.0-alpha.20 - -_Dec 21, 2020_ - -A big thanks to the 13 contributors who made this release possible. Here are some highlights ✨: - -- 👩‍🎤 Migrate the Typography to emotion (#23841) @DanailH - - This change allows to add typography variants in the theme and to use them directly: - - ```jsx - const theme = createMuiTheme({ - typography: { - poster: { - color: 'red', - }, - }, - }); - <Typography variant="poster">poster</Typography>; - ``` - - [A full demo](https://codesandbox.io/p/sandbox/fontsizetheme-material-demo-forked-l9u05?file=/demo.tsx:725-773) - -- 📚 Add a shortcut to open the Algolia search (#23959) @hmaddisb. -- And many more 🐛 bug fixes and 📚 improvements. - -### `@material-ui/core@v5.0.0-alpha.20`/`@material-ui/unstyled@v5.0.0-alpha.20` - -#### Breaking changes - -- [CssBaseline] Change body font size to body1 (1rem) (#24018) @mbrookes - - The new default matches the variant used by the Typography component. To return to the previous size, you can override it in the theme: - - ```js - const theme = createMuiTheme({ - typography: { - body1: { - fontSize: '0.875rem', - }, - }, - }); - ``` - -#### Changes - -- [Badge] Fix the classes description to reflect the correct component (#24035) @mnajdova -- [Select] Fix aria-describedby attribute (#24027) @HVish -- [Skeleton] Fix Circle border radius on Safari (#24054) @anatolzak -- [Slider][badge] Fix classes prop not working (#24034) @mnajdova -- [Typography] Migrate styles to emotion (#23841) @DanailH - -### `@material-ui/styled-engine@v5.0.0-alpha.20`/`@material-ui/styled-engine-sc@v5.0.0-alpha.20` - -- [styled-engine] Add name and slot options (#23964) @mnajdova -- [styled-engine] Add StylesProvider with injectFirst option (#23934) @mnajdova - -### `@material-ui/system@v5.0.0-alpha.20` - -- [system] Fix transform not firing when theme provided (#24010) @ZovcIfzm - -### Docs - -- [docs] Add a shortcut to access the search bar (#23959) @hmaddisb -- [docs] Animate component's mounting and unmounting (#24049) @cjoecker -- [docs] Fix collapse API docs description of 'hidden' style condition (#24053) @jaiwanth-v -- [docs] Improve color demo snippet spacing (#24009) @yukinoda -- [docs] Improve displayed versions (#24051) @oliviertassinari -- [docs] Show a better file on codesandbox (#24052) @oliviertassinari -- [docs] Update customization/components and customization/global pages (#24016) @mnajdova -- [docs] Update the CSS injection guide (#24020) @mnajdova - -### Core - -- [core] Batch small changes (#24038) @oliviertassinari -- [core] Track size of /unstyled (#24021) @eps1lon -- [core] Use consistent naming scheme for ttp annotations (#24022) @eps1lon - -## 5.0.0-alpha.19 - -_Dec 13, 2020_ - -A big thanks to the 24 contributors who made this release possible. Here are some highlights ✨: - -- 👩‍🎤 Migrate the Badge to emotion (#23745) @mnajdova. -- 🌏 Add infrastructure to translate the API pages (#23852) @mbrookes. -- And many more 🐛 bug fixes and 📚 improvements. - -### `@material-ui/core@v5.0.0-alpha.19` - -#### Breaking changes - -- [Icon][svgicon] Change default fontSize from default to medium (#23950) @mbrookes - - The default value of `fontSize` was changed from `default` to `medium` for consistency. - In the unlikey event that you were using the value `default`, the prop can be removed: - - ```diff - -<SvgIcon fontSize="default">{iconPath}</SvgIcon> - +<SvgIcon>{iconPath}</SvgIcon> - ``` - -- [TextField] Add size prop for outlined and filled input (#23832) @mayralgr - - Rename `marginDense` and `inputMarginDense` classes to `sizeSmall` and `inputSizeSmall` to match the prop. - -#### Changes - -- [Autocomplete] Document onChange last `details` param (#23942) @natac13 -- [Autocomplete] Fix useAutocomplete groupedOptions type (#23854) @ZachCMP -- [Autocomplete] Improve DX/UX when getOptionLabel is not configured correctly (#23884) @marianayap -- [Autocomplete] Improve getOptionSelected description (#23817) @smartshivkat -- [Badge] Create unstyled component & move to emotion (#23745) @mnajdova -- [Grid] Improve support for nested grid (#23913) @gbrochar -- [Grid] Fix side effects when direction="column" and xs={} is used (#23900) @Kai-W -- [Select] Fix description, value is not required (#23940) @natac13 -- [Slider] Remove color prop in unstyled (#23840) @mnajdova -- [Slider] Replaced inlined isHostComponent with the utils (#23880) @mnajdova -- [SwipeableDrawer] Refactor internals (#23944) @eps1lon -- [TextField] Add documentation for hidden label (#23915) @Fredestrik -- [TextField] Fix the color leak of the textbox (#23912) @szabgab -- [useMediaQuery] Fix a false return at the first call (#23806) @marthaerm -- [utils] Fix minified errors throwing with \_formatMuiErrorMessage (#23828) @eps1lon - -### `@material-ui/unstyled@v5.0.0-alpha.19` - -- [core] Use Lerna to publish (#23793) @oliviertassinari - -### `@material-ui/system@v5.0.0-alpha.19` - -#### Breaking changes - -- [system] Move visually hidden helper to utils (#23974) @eps1lon - - Only applies if you've installed v5.0.0-alpha.1 - - ```diff - -import { visuallyHidden } from '@material-ui/system'; - +import { visuallyHidden } from '@material-ui/utils'; - ``` - -#### Changes - -- [core] Use Lerna to publish (#23793) @oliviertassinari - -### `@material-ui/lab@v5.0.0-alpha.19` - -- [core] Use Lerna to publish (#23793) @oliviertassinari - -### `@material-ui/utils@v5.0.0-alpha.19` - -- [core] Use Lerna to publish (#23793) @oliviertassinari - -### `@material-ui/styles@v5.0.0-alpha.19` - -- [core] Use Lerna to publish (#23793) @oliviertassinari - -### Docs - -- [example] Change Box to new sx prop (#23937) @natac13 -- [example] Explain package choice (#23938, #23958) @mnajdova -- [example] Update nextjs examples to fix hydration (#23936) @mnajdova -- [docs] Add API tradeoff section for the sx prop (#23962) @mnajdova -- [docs] Add ELEVATOR to backers (#23977) @mbrookes -- [docs] Add eslint rule to docs (#23843) @jens-ox -- [docs] Add infrastructure to translate API pages (#23852) @mbrookes -- [docs] Add link to the sx docs page in the API description (#23967) @mnajdova -- [docs] Add prepend option on emotion caches to allow JSS style overrides (#23892) @mnajdova -- [docs] Add Vercel deploy config (#23910) @eps1lon -- [docs] Allow codesandbox deploy for demos in X (#23644) @oliviertassinari -- [docs] Copy icons to clipboard (#23850) @CodeWithGuruji -- [docs] Fix breakpoints typos (#23893) @mnajdova -- [docs] Fix color contrast of code within links (#23819) @eps1lon -- [docs] Fix duplicated styles generated from emotion (#23809) @mnajdova -- [docs] Fix icon alignment in /components/breadcrumbs (#23818) @eps1lon -- [docs] Fix production deploy (#23963) @eps1lon -- [docs] Fix source on GitHub links (#23821) @praveenkumar-kalidass -- [docs] Fix StickyHeaderTable round borders (#23882) @antoniopacheco -- [docs] Fix typo in date picker dayjs adapter name (#23935) @andresmrm -- [docs] Improve system properties page (#23961) @mnajdova -- [docs] Link module augmentation in TypeScript @oliviertassinari -- [docs] Make stable width of localization example (#23820) @sujinleeme -- [docs] Mention Adobe XD (#23978) @oliviertassinari -- [docs] Prefer system shorthands (#23970) @oliviertassinari -- [docs] Remove 'TODO' comment from buildApi script (#23973) @mbrookes -- [docs] Sync translations (#23742, #23842) @l10nbot -- [docs] Update Badge examples to use Box instead of makeStyles (#23927) @mnajdova - -### Core - -- [test] Add conformance tests for testing the `theme.components` options for the v5 components (#23896) @mnajdova -- [test] Include type path mappings in language server (#23905) @eps1lon -- [test] Make Popper tests StrictMode agnostic (#23838) @eps1lon -- [test] Run benchmarks in Azure Pipelines when approved (#23895) @eps1lon -- [test] Skip tests with cascading network requests (#23823) @eps1lon -- [core] All packages are published from /build (#23886) @oliviertassinari -- [core] Batch small changes (#23853) @oliviertassinari -- [core] Fix failing CI on HEAD (#23947) @oliviertassinari -- [core] Force LF for text files (#23932) @eps1lon -- [core] Improve envinfo instructions (#23918) @eps1lon -- [core] Replace fs-extra deprecated function (exists) (#23848) @leonardopliski -- [core] Use Lerna to publish (#23793) @oliviertassinari -- [core] Use playwright instead of puppeteer (#23906) @eps1lon -- [core] Add envinfo --json flag (#23883) @eps1lon -- [core] Ask for output from envinfo in issues (#23881) @eps1lon - -## 5.0.0-alpha.18 - -_Dec 3, 2020_ - -A big thanks to the 17 contributors who made this release possible. Here are some highlights ✨: - -- Fix most of the issues with MUI System (#23716, #23635, #23737, #23733, #23700, #23688) @mnajdova. -- And many more 🐛 bug fixes and 📚 improvements. - -### `@material-ui/core@v5.0.0-alpha.18` - -#### Breaking changes - -- [Box] Remove deprecated props (#23716) @mnajdova - All props are now available under the `sx` prop. A deprecation will be landing in v4. - Thanks to @mbrookes developers can automate the migration with a [codemod](https://github.com/mui/material-ui/blob/v5.0.0/packages/mui-codemod/README.md#box-sx-prop). - - ```diff - -<Box p={2} bgcolor="primary.main"> - +<Box sx={{ p: 2, bgcolor: 'primary.main' }}> - ``` - -#### Changes - -- [Autocomplete] Add ability to override key down events handlers (#23487) @hessaam -- [Autocomplete] Better isolate test case (#23704) @oliviertassinari -- [Autocomplete] Fix highlight change event (#23718) @TakumaKira -- [Box] Fix TypeScript issue when component prop is used (#23686) @mnajdova -- [experimentalStyled] Make sx style fn optional (#23714) @mnajdova -- [l10n] Improve Brazilian (pt-BR) locale (#23707) @m4rcelofs -- [l10n] Improve Korean (ko-KR) locale (#23794) @sujinleeme -- [Select] Add disabled attribute in input element when disabled (#23778) @praveenkumar-kalidass -- [Switch] Add preventDefault check for state change (#23786) @praveenkumar-kalidass -- [Tabs] Remove duplicate styles (#23561) @cmfcmf - -### `@material-ui/system@v5.0.0-alpha.18` - -- [system] Allow values to use shorter string when the prop name is contained in the value (#23635) @mnajdova -- [system] Another round of perf improvements (#23737) @mnajdova -- [system] Fix transform return value to support CSSObject (#23733) @mnajdova -- [system] Make borderRadius multiply a theme's design token (#23700) @mnajdova -- [system] Various perf gain experiments (#23688) @mnajdova - -### `@material-ui/styles@v5.0.0-alpha.18` - -- [styles] Small performance gain (#23749) @oliviertassinari -- [styles] Update mergeClasses types to more closely match its implementation (#23705) @etrepum - -### `@material-ui/utils@v5.0.0-alpha.18` - -- [system] Another round of perf improvements (#23737) @mnajdova - -### `@material-ui/lab@v5.0.0-alpha.18` - -- [DatePicker] Found one prop that was renamed (#23676) @oliviertassinari -- [DateRangePicker] Allow same date selection (#23701) @hmaddisb - -### `@material-ui/styled-engine@v5.0.0-alpha.18`/`@material-ui/styled-engine-sc@v5.0.0-alpha.18` - -- [styled-engine] Fix tagged template syntax with multiple expressions (#23269) @eps1lon - -### Docs - -- [docs] Add settings panel to allow system mode (#23722) @mbrookes -- [docs] Add v5 peer dependencies in README (#23751) @johnrichardrinehart -- [docs] Document using codesandbox-ci (#23800) @brorlarsnicklas -- [docs] Fix link name for canadacasino (#23799) @eps1lon -- [docs] Fix various a11y issues reported by lighthouse (#23791) @eps1lon -- [docs] Improve prop descriptions (#23723) @oliviertassinari -- [docs] Improve SEO structure (#23748) @oliviertassinari -- [docs] Improve settings toggle button styling (#23754) @mbrookes -- [docs] Misc fixes (#23756) @mbrookes -- [docs] Move instructions for starting the docs earlier in the file (#23801) @brorlarsnicklas -- [docs] Prepare v5.0.0-alpha.17 (#23680) @oliviertassinari -- [docs] Remove unused abstraction (#23724) @oliviertassinari -- [docs] Sync translations (#23682) @l10nbot - -### Core - -- [benchmark] Improve printed results (#23729) @oliviertassinari -- [benchmark] Test styleFunctionSx vs. @styled-system/css (#23702) @mnajdova -- [benchmark] Update with latest (#23694) @oliviertassinari -- [core] Batch small changes (#23678) @oliviertassinari -- [core] Fix ci @oliviertassinari -- [core] Fix error handling on upload (#23734) @eps1lon -- [core] Fully clear composite TypeScript project state (#23805) @eps1lon -- [core] Remove unused classes (#23473) @jens-ox -- [test] Add conformance test suite for v5 (#23798) @mnajdova -- [test] Cleanup skipped tests (#23732) @eps1lon -- [test] Misc improvements to experimental and browser test runner (#23699) @eps1lon -- [test] Stay busy until document.fonts is ready (#23736) @eps1lon - -## 5.0.0-alpha.17 - -_Nov 23, 2020_ - -A big thanks to the 18 contributors who made this release possible. Here are some highlights ✨: - -- 📚 Improve the IntelliSense support for the `sx` prop (#23599) @mnajdova. - You should now get a description for each property of MUI System. For instance with `mx`: - - ![system TypeScript](https://user-images.githubusercontent.com/3165635/99920493-20f60a00-2d24-11eb-8748-c5dd7fe85cbd.png) - -- 💅 Migrate the first core component to the v5 styling architecture (#23308) @mnajdova. - We have spent the last few months iterating on the new styling approach in the lab, and are confident enough in the new approach to move it to the core, so we have migrated the Slider. We will wait a week or two to collect feedback on it, before scaling it to the rest of the codebase. -- 📅 Fix the first few issues on the date picker components since the migration in the lab. -- And many more 🐛 bug fixes and 📚 improvements. - -### `@material-ui/core@v5.0.0-alpha.17` - -#### Breaking changes - -- [Slider] Migrate to emotion (#23308) @mnajdova - - By default, emotion injects its style after JSS, this breaks the computed styles. In order to get the correct CSS injection order until all the components are migrated, you need to wrap the root of your application with: - - ```jsx - import * as React from 'react'; - import ReactDOM from 'react-dom'; - import { StylesProvider } from '@material-ui/core'; - import App from './App'; - - ReactDOM.render( - <StylesProvider injectFirst> - <App /> - </StylesProvider>, - document.querySelector('#root'), - ); - ``` - - This enforces emotion being injected first. [More details](https://mui.com/material-ui/integrations/interoperability/#css-injection-order) in the documentation. - -- [Autocomplete] Rename `closeIcon` prop with `clearIcon` to avoid confusion (#23617) @akhilmhdh. - - ```diff - -<Autocomplete closeIcon={icon} /> - +<Autocomplete clearIcon={icon} /> - ``` - -- [Dialog] Remove the `disableBackdropClick` prop. It's redundant with the `reason` argument (#23607) @eps1lon. - - ```diff - <Dialog - - disableBackdropClick - - onClose={handleClose} - + onClose={(event, reason) => { - + if (reason !== 'backdropClick') { - + onClose(event, reason); - + } - + }} - /> - ``` - -- [Modal] Remove the `disableBackdropClick` prop. It's redundant with the `reason` argument (#23607) @eps1lon. - - ```diff - <Modal - - disableBackdropClick - - onClose={handleClose} - + onClose={(event, reason) => { - + if (reason !== 'backdropClick') { - + onClose(event, reason); - + } - + }} - /> - ``` - -- [Modal] Remove the `onEscapeKeyDown` prop. It's redundant with the `reason` argument. (#23571) @eps1lon - - ```diff - <Modal - - onEscapeKeyDown={handleEscapeKeyDown} - + onClose={(event, reason) => { - + if (reason === "escapeKeyDown") { - + handleEscapeKeyDown(event); - + } - + }} - />; - ``` - -#### Changes - -- [CircularProgress][linearprogress] Change components from div to span (#23587) @bruno-azzi -- [Grid] Improve warning when a prop is missing (#23630) @udayRedI -- [Icon] Allow customizing the 'material-icons' base class name (#23613) @rart -- [Select] Fix focus() call on ref (#23302) @reedanders -- [Slider] Add test case for triggering a specific value (#23642) @Thehambalamba -- [Slider] General cleanup and add classes prop for unstyled (#23569) @mnajdova -- [styles] Add support for TypeScript 4.1 (#23633) @eps1lon - -### `@material-ui/codemod@v5.0.0-alpha.17` - -- [codemod] Add moved-lab-modules (#23588) @eps1lon - This codemod is part of our effort to make the migration from v4 to v5 as painless as possible. - -### `@material-ui/utils@v5.0.0-alpha.17` - -- [Grid] Improve warning when a prop is missing (#23630) @udayRedI - -### `@material-ui/system@v5.0.0-alpha.17` - -- [system] Improve the `sx` prop IntelliSense (#23599) @mnajdova - -### `@material-ui/unstyled@v5.0.0-alpha.17` - -- [Slider] Replace core Slider with SliderStyled (#23308) @mnajdova - -### `@material-ui/lab@v5.0.0-alpha.17` - -#### Breaking changes - -- [DatePicker] Change the import path of the date adapters (#23568) @eps1lon. - It better fits with the current import convention. - - ```diff - -import AdapterDateFns from '@material-ui/lab/dateAdapter/date-fns'; - +import AdapterDateFns from '@material-ui/lab/AdapterDateFns'; - ``` - -#### Changes - -- [DatePicker] Add missing exports (#23621) @havgry -- [DatePicker] Add missing TypeScript definitions (#23560) @mbrookes -- [DatePicker] Fix false-positive when validating mask in Safari (#23602) @eps1lon -- [DatePicker] Fix missing manifest for TypeScript packages (#23564) @eps1lon -- [TimePicker] Prevent scroll when interacting with the clock (#23563) @knightss27 - -### Docs - -- [docs] Add advanced page for MUI System (#23596) @mnajdova -- [docs] Add docs for typography in system (#23510) @oliviertassinari -- [docs] API pages i18n (#23214) @mbrookes -- [docs] Create pickers migration guide (#23605) @dmtrKovalenko -- [docs] Enable TS language service for docs/src (#23576) @eps1lon -- [docs] Explain the information listed on MUI System properties page (#23566) @mnajdova -- [docs] Fix /api client-side routing (#23586) @eps1lon -- [docs] Fix the Box section title on migration-v4 guide (#23679) @claudioldf -- [docs] Generate default values for docs from the unstyled components (#23614) @mnajdova -- [docs] Increase printWidth from 80 to 85(#23512) @eps1lon -- [docs] Prevent layout jumps from img loading in system demo (#23504) @eps1lon -- [docs] Remove controlled Tooltip example in Slider (#23625) @micsidoruk -- [docs] Remove dead demos in MUI System basics page (#23565) @mnajdova -- [docs] Replace emotion-server packages with @emotion/server (#23557) @numToStr -- [docs] Sync translations (#23648) @l10nbot - -### Core - -- [core] Add support for TypeScript 4.1 (#23633) @eps1lon -- [core] Batch small changes (#23554) @oliviertassinari -- [core] Cleanup emotion dependencies (#23556) @eps1lon -- [core] Fix formatting (#23567) @eps1lon -- [core] Fix tracked component size regression (#23516) @eps1lon -- [core] Fix transpilation target of UMD bundle (#23618) @eps1lon -- [test] Create chunks for Argos (#23518) @oliviertassinari -- [test] Debug argos-cli upload failures (#23623) @eps1lon -- [test] Enable experimental-timezone tests (#23595) @eps1lon -- [test] Misc visual regression flakiness improvements (#23619) @eps1lon -- [test] Use playwright instead of vrtest (#23500) @eps1lon - -## 5.0.0-alpha.16 - -_Nov 14, 2020_ - -A big thanks to the 34 contributors who made this release possible. Here are some highlights ✨: - -- 📅 Migrate the date picker to the lab (#22692) @dmtrKovalenko. - We have integrated the components with the code infrastructure. Next we will migrate all the GitHub issues from [material-ui-pickers](https://github.com/mui/material-ui-pickers) and archive the repository. This migration will help provide first-class support for the date picker components. The component will stay in the lab as long as necessary to reach the high-quality bar we have for core components. You can find the [new documentation here](https://mui.com/components/pickers/). - - While the source code is currently hosted in the [main repository](https://github.com/mui/material-ui), we might move it to the [x repository](https://github.com/mui/mui-x) in the future, depending on what is easier for the commercial date range picker. The date picker will stay open source no matter what. - -- 📚 Revamp the documentation for [MUI System](https://mui.com/system/getting-started/). The System contains CSS utilities. The documentation now promotes the use of the `sx` prop. It's ideal for adding one-off styles, for example padding, but when pushed to its limits, it can be used to implement quickly a complete page. -- 👩‍🎨 Upgrade emotion to v11 (#23007) @mnajdova. -- And many more 🐛 bug fixes and 📚 improvements. - -### `@material-ui/core@v5.0.0-alpha.16` - -#### Breaking changes - -- [TextField] Change default variant from standard to outlined (#23503) @mbrookes - Standard has been removed from the Material Design guidelines. [This codemod](https://github.com/mui/material-ui/tree/next/packages/mui-codemod#variant-prop) will automatically update your code. - - ```diff - -<TextField value="Standard" /> - -<TextField value="Outlined" variant="outlined" /> - +<TextField value="Standard" variant="standard" /> - +<TextField value="Outlined" /> - ``` - -- [Autocomplete] Remove `debug` in favor of `open` and dev tools (#23377) @eps1lon - There are a couple of simpler alternatives: `open={true}`, Chrome devtools ["Emulate focused"](https://x.com/sulco/status/1305841873945272321), or React devtools props. - -#### Changes - -- [Autocomplete] Use Popper when `disablePortal` (#23263) @eps1lon -- [Box] Better DX for deprecated props (#23285) @eps1lon -- [codemod] Add a codemod for the Box sx prop (#23465) @mbrookes -- [CssBaseline] Add dark mode scrollbar support (#23407) @mmmols -- [Slider] Extract slots as standalone components (#22893) @mnajdova -- [Stepper] Fix the icon prop support in StepLabel (#23408) @randyshoopman -- [theme] Add htmlFontSize to Typography interface (#23412) @fergusmcdonald -- [Tooltip] Fix PopperProps popper modifiers not being merged properly (#23421) @dominique-mueller -- [Tooltip] Long press select text on iOS (#23466) @hmaddisb -- [Tooltip] Unexpected behavior onOpen/onClose (#23482) @brorlarsnicklas - -### `@material-ui/lab@v5.0.0-alpha.16` - -- [DatePicker] Migrate to the lab #22692 @dmtrKovalenko - -### `@material-ui/system@v5.0.0-alpha.16` - -- [system] Add typography prop that will pull from theme.typography (#23451) @mnajdova -- [system] Create separate margin and padding functions (#23452) @mnajdova -- [system] Export styleFunctionSx and improve signature (#23397) @mnajdova -- [system] Merge breakpoints in correct order (#23380) @mnajdova -- [system] Remove css utility in favor of sx (#23454) @mnajdova -- [system] Warn for spacing when non integer value is used with theme.spacing array (#23460) @mnajdova - -### `@material-ui/styled-engine@v5.0.0-alpha.16` - -- [styled-engine] Upgrade emotion to 11 RC (#23007) @mnajdova - -### `@material-ui/unstyled@v5.0.0-alpha.16` - -- [Slider] Extract slots as standalone components (#22893) @mnajdova - -### `@material-ui/codemod@v5.0.0-alpha.16` - -- [TextField] Change default variant from standard to outlined (#23503) @mbrookes - -### Docs - -- [docs] Allow to host code in a different repo (#23390) @oliviertassinari -- [docs] CHANGELOG for v5.0.0-alpha.15 (#23383) @oliviertassinari -- [docs] Fix examples download URLs to match the correct branch name (#23467) @matchatype -- [docs] Fix links being opened when dismissing context menus (#23491) @eps1lon -- [docs] Fix the Netlify proxy for localization of X (#23387) @oliviertassinari -- [docs] Fix usage of palette.type instead of palette.mode in docs (#23414) @hubgit -- [docs] Improve documentation of MUI System (#23294) @mnajdova -- [docs] Improve feedback a11y (#23459) @eps1lon -- [docs] Improve formatting of MUI System (#23509) @oliviertassinari -- [docs] Improve migration guide for theme.palette (#23416) @hubgit -- [docs] Mention delay instead of transition twice (#23393) @benmneb -- [docs] Prepare Material UI X (#1893) @oliviertassinari -- [docs] Redirect legacy GridList pages to ImageList (#23456) @eps1lon -- [docs] Remove redundant aria-label when wrapped in Tooltip (#23455) @eps1lon -- [docs] Sync translations (#23316) @l10nbot -- [docs] Update buildAPI script to handle the "styled" components (#23370) @mnajdova -- [docs] Update new components in the roadmap (#23507) @mbrookes -- [docs] Update translations (#23501) @l10nbot - -### Core - -- [core] Batch small changes (#23422) @oliviertassinari -- [core] Fix skipped ignore patterns (#23474) @eps1lon -- [core] Switch to globby and fast-glob (#23382) @eps1lon -- [test] Increase timeout threshold for slow Firefox tests (#23463) @eps1lon -- [test] Make sure system properties are in the same order when generating CSS (#23388) @mnajdova -- [test] Prefer longhand properties (#23445) @eps1lon -- [test] Remove data-mui-test from tests (#23498) @eps1lon -- [test] Remove keyDown#force (#23488) @eps1lon -- [test] Use adapter instead of native Date (#23475) @eps1lon -- [test] Use fake timers in visual regression tests (#23464) @eps1lon - -## 5.0.0-alpha.15 - -_Nov 4, 2020_ - -A big thanks to the 20 contributors who made this release possible. Here are some highlights ✨: - -- ⚛️ Add support for React 17 (#23311) @eps1lon. - React 17 release is unusual because it doesn't add any new developer-facing features. It was released a couple of days ago. You can learn more about it in the [introduction post](https://legacy.reactjs.org/blog/2020/10/20/react-v17.html). Material UI now supports `^16.8.0 || ^17.0.0`. -- 🛠 Introduce a new `@material-ui/unstyled` package (#23270) @mnajdova. - This package will host the unstyled version of the components. In this first iteration, only the Slider is available. You can find it documented under the [same page](https://mui.com/components/slider-styled/#unstyled-slider) as the styled version. - - **Why an unstyled package?** - - While engineering teams are successfully building custom design systems by wrapping Material UI, we [occasionally hear](https://github.com/mui/material-ui/issues/6218) that Material Design or our styling solution are something they don't need. Some teams prefer SASS, others prefer to customize the components starting from a pristine state. What all these teams have in common is that they value the features coming from the components, such as accessibility. - - The unstyled package goes one step down in the abstraction layer, providing more flexibility. Angular Material introduced this approach two years ago. Today their unstyled components account for [25% of the usage](https://npm-stat.com/charts.html?package=%40angular%2Fmaterial&package=%40angular%2Fcdk&from=2017-11-03&to=2020-11-03). - - Another reason for introducing this package is to prepare the groundwork for a [second theme](https://github.com/mui/material-ui/issues/22485) (not Material Design based). - - A note on the terminology: "unstyled" means that the components have the same API as the "styled" components but come without CSS. Material UI also contains "headless" components that exposes a hook API, for example [useAutocomplete](https://mui.com/components/autocomplete/#useautocomplete) or [usePagination](https://mui.com/components/pagination/#usepagination). - - This change is part of our strategy to iterate on the v5 architecture with the `Slider` first. In the next alpha release, we plan to replace the v4 slider with the v5 slider. Once the new approach is stress-tested and validated, we will roll it out to all the components. - -- And many more 🐛 bug fixes and 📚 improvements. - -### `@material-ui/core@v5.0.0-alpha.15` - -#### Breaking changes - -- [AppBar] Fix z-index when position="static" (#23325) @sujinleeme - Remove z-index when position static and relative -- [theme] Fix error message for augmentColor failure (#23371) @reedanders - The signature of `theme.palette.augmentColor` helper has changed: - - ```diff - -theme.palette.augmentColor(red); - +theme.palette.augmentColor({ color: red, name: 'brand' }); - ``` - -#### Changes - -- [Autocomplete] Fix unclickable area between text input and endAdornment (#23229) @sujinleeme -- [Autocomplete] Follow Material Design State spec (#23323) @sujinleeme -- [Avatar] Fix usage of srcset property (#23286) @matheuspiment -- [ClickAwayListener] Fix mounting behavior in Portals in React 17 (#23315) @eps1lon -- [core] Allow React 17 (#23311) @eps1lon -- [Icon] Fix translation, for example Google Translate (#23237) @cbeltrangomez84 -- [LinearProgress] Fix Safari's bug during composition of different paint (#23293) @montogeek -- [Radio] Fix dot misalignment in Safari (#23239) @anasufana -- [styled-engine] Fix tagged template syntax with multiple expressions (#23269) @eps1lon -- [Table] Fix empty row logic when displaying all (#23280) @JoaoJesus94 -- [Table] Fix handling of rowsPerPage={-1} (#23299) @JoaoJesus94 -- [TextareaAutosize] Fix container with no intrinsic height (#23273) @sujinleeme -- [TextField] Fix disabled color in Safari (#23375) @Morteza-Jenabzadeh -- [theme] Fix spacing string arguments (#23224) @GuilleDF -- [Tooltip] Fix excess spacing (#23233) @benneq - -### `@material-ui/unstyled@v5.0.0-alpha.15` - -- [unstyled] Create package and move SliderUnstyled there (#23270) @mnajdova -- [core] Allow React 17 (#23311) @eps1lon - -### `@material-ui/lab@v5.0.0-alpha.15` - -- [lab] Migrate Timeline to TypeScript (#23242) @oliviertassinari -- [core] Allow React 17 (#23311) @eps1lon - -### `@material-ui/icons@v5.0.0-alpha.15` - -- [core] Allow React 17 (#23311) @eps1lon - -### `@material-ui/styles@v5.0.0-alpha.15` - -- [core] Allow React 17 (#23311) @eps1lon - -### `@material-ui/system@v5.0.0-alpha.15` - -- [core] Allow React 17 (#23311) @eps1lon -- [theme] Fix spacing string arguments (#23224) @GuilleDF - -### Docs - -- [Transition] Document default appear value (#23221) @GuilleDF -- [blog] Danail Hadjiatanasov joins Material UI (#23223) @oliviertassinari -- [docs] Add Material UI Builder to in-house ads (#23342) @mbrookes -- [docs] Fix a few typos and add comma (#23284) @reedanders -- [docs] Fix few propTypes in Inputs (#23331) @youknowhat -- [docs] Fix language cookie (#23324) @mbrookes -- [docs] Fix typo in `README.md` (#23329) @mtsknn -- [docs] Guard against unknown value in userLanguage cookie (#23336) @mbrookes -- [docs] Make it clearer that custom router is supported (#23304) @Maxgit3 -- [docs] Sync translations (#23080) @l10nbot -- [docs] Update homepage quotes (#23326) @mbrookes -- [docs] Update nav translations (#23234) @mbrookes -- [docs] Update system pages to use sx prop instead of deprecated Box props (#23368) @mnajdova -- [docs] Use present tense for bool prop descriptions (#23274) @mbrookes - -### Core - -- [utils] Add all @material-ui/core/utils to @material-ui/utils (#23264) @mnajdova -- [core] Batch small changes (#23327) @oliviertassinari -- [core] Fix implicit transitive 'csstype' dependency (#23301) @quinnturner -- [core] Move material-ui-benchmark into benchmark/server (#23271) @eps1lon -- [core] Replace temp package with node built-ins (#23262) @eps1lon -- [core] Restrict top level imports that target CJS modules (#23159) @eps1lon -- [test] Fix unexpected console warn/error spy swallowing unrelated messages (#23312) @eps1lon -- [test] Fix various issues with the new cli on windows (#23381) @eps1lon -- [test] Improve test debugging (#23372) @eps1lon -- [test] Introduce experimental CLI (#23369) @eps1lon -- [test] Prevent growing call stack in custom keyDown/keyUp (#23321) @eps1lon -- [test] Run with Safari 13 (#23292) @eps1lon - -## 5.0.0-alpha.14 - -_Oct 23, 2020_ - -A big thanks to the 23 contributors who made this release possible. -Here are some highlights ✨: - -- 💄 Introduce a new `sx` prop (#23053, #23205) @mnajdova - We have resumed the work on Material UI System. This is made possible by the latest progress on the new styling solution of v5. - You can read the [introduction blog post](https://medium.com/material-ui/introducing-material-ui-design-system-93e921beb8df) that we did for MUI System two years ago. - - The system is meant to solve the following problems: - - 1. Naming things is hard. How should a class name, JSS style rule, or styled component be named? - 2. Jumping between JS and CSS in the editor wastes time. This is particularly true as the complexity (LOCs/# of elements) of a component increases. It's still true when using the `styled()` API. - 3. Introducing a `makeStyles` for the first time in a component is daunting. For example, it's why https://github.com/vscodeshift/material-ui-codemorphs#add-usestyles-hook exists. What if we had less code to type, gaining velocity when writing styles? - 4. Pulling values out from the theme can be cumbersome. How can we make it less painful to increase the usage of design tokens? - - This new iteration of MUI System brings two major improvements: - - - It moves from the support of a subset of CSS to the support of a superset of CSS. - Learning the shorthand is optional. It's no longer necessary to moving back to styled() when MUI System doesn't support a specific CSS property. - - It moves from support on Box only to any core component (starting with the slider). - - ```jsx - import Slider from '@material-ui/lab/SliderStyled'; - - // Set the primary color and a vertical margin of 16px on desktop. - <Slider sx={{ color: 'primary.main', my: { xs: 0, md: 2 } }} />; - ``` - -- ✨ Upgrade Popper.js from v1 to v2 (#21761) @joshwooding - The change reduces the bundle size (-1 kB gzipped) while fixing bugs at the same time. - -- 🐛 Fix broken nested imports with the icons package (#23157) @eps1lon - The revamp of the bundling strategy in #22814 has broken the nested imports. - Imports such as the one below should work again with this release: - - ```jsx - import CloseIcon from '@material-ui/icons/Close'; - ``` - -- And many more 🐛 bug fixes and 📚 improvements. - -### `@material-ui/core@v5.0.0-alpha.14` - -#### Breaking changes - -- [Popper] Upgrade to popper.js to v2 (#21761) @joshwooding - This third-party library has introduced a lot of changes.<br /> - You can read [their migration guide](https://popper.js.org/docs/v2/migration-guide/) or the following summary: - - - The CSS prefixes have changed: - - ```diff - popper: { - zIndex: 1, - - '&[x-placement*="bottom"] $arrow': { - + '&[data-popper-placement*="bottom"] $arrow': { - ``` - - - Method names have changed. - - ```diff - -popperRef.current.scheduleUpdate() - +popperRef.current.update() - ``` - - ```diff - -popperRef.current.update() - +popperRef.current.forceUpdate() - ``` - - - Modifiers' API has changed a lot. There are too many changes to be covered here. - -- [withMobileDialog] Remove this higher-order component (#23202) @RDIL - The hook API allows a simpler and more flexible solution than the HOC: - - ```diff - -import withMobileDialog from '@material-ui/core/withMobileDialog'; - +import { useTheme, useMediaQuery } from '@material-ui/core'; - - function ResponsiveDialog(props) { - - const { fullScreen } = props; - + const theme = useTheme(); - + const fullScreen = useMediaQuery(theme.breakpoints.down('sm')); - const [open, setOpen] = React.useState(false); - - // ... - - -export default withMobileDialog()(ResponsiveDialog); - +export default ResponsiveDialog; - ``` - -#### Changes - -- [Box] Add sx prop (#23053) @mnajdova -- [Box] Deprecate system props (#23206) @mnajdova -- [Card] Use flex display for CardHeader.avatar (#23169) @mordechaim -- [Container] Fix support of custom breakpoint units (#23191) @espipj -- [Container] Revert max-width change for xs @oliviertassinari -- [InputBase] Use ref prop instead of inputRef prop on input component (#23174) @GuilleDF -- [l10n] Add Kazakh (kz-KZ) locale (#23195) @abdulgafur24 -- [Rating] Ensure hover and click are in sync (#23117) @redbmk -- [Select] Fix SelectDisplayProps className concat (#23211) @reedanders - -### `@material-ui/styled-engine@v5.0.0-alpha.14` - -- [styled] Add @babel/runtime dependency (#23175) @koistya - -### `@material-ui/system@v5.0.0-alpha.14` - -- [Box] Add sx prop (#23053) @mnajdova -- [core] Fix bundles for packages without subpackages (#23157) @eps1lon - -### `@material-ui/icons@v5.0.0-alpha.14` - -- [core] Fix bundles for packages without subpackages (#23157) @eps1lon - -### `@material-ui/lab@v5.0.0-alpha.14` - -#### Breaking changes - -- [AvatarGroup] Move from lab to core (#23121) @mbrookes - Move the component from the lab to the core. This component will become stable. - - ```diff - -import AvatarGroup from '@material-ui/lab/AvatarGroup'; - +import AvatarGroup from '@material-ui/core/AvatarGroup'; - ``` - -#### Changes - -- [Slider] Add sx prop in SliderStyled (#23205) @mnajdova - -### `@material-ui/utils@v5.0.0-alpha.14` - -- [utils] Fix types of chainPropTypes (#23123) @oliviertassinari -- [core] Fix bundles for packages without subpackages (#23157) @eps1lon - -### `@material-ui/types@v5.2.0-alpha.14` - -- [types] Add LICENSE files (#23162) @lielfr - -### Docs - -- [examples] Remove reason example project (#23158) @mnajdova -- [examples] Update cdn example to use @material-ui/core@next (#23153) @mnajdova -- [examples] Update preact to use the @material-ui/core@next (#23154) @mnajdova -- [examples] Update ssr example to use @material-ui/core@next (#23155) @mnajdova -- [examples] Updated nextjs-typescript example to use @material-ui/core@next (#23119) @numToStr -- [docs] Add Menu component example with explicit positioning prop values (#23167) @jaebradley -- [docs] Add page feedback (#22885) @mbrookes -- [docs] Add Performance section for Modal (#23168) @jaebradley -- [docs] Better document CardActionArea (#23196) @el1f -- [docs] Cleaner image of font-size equation (#23189) @CamDavidsonPilon -- [docs] Fix casing typo (#23148) @piperchester -- [docs] Fix typo in steppers (#23163) @AGDholo -- [docs] Fix typo on interoperability page (#23177) @SassNinja -- [docs] Improve migration v5 guide @oliviertassinari -- [docs] Lazy load demo toolbar (#23108) @eps1lon -- [docs] Remove unused style selectors `extendedIcon` (#23160) @MatejKastak -- [docs] Use Box sx prop on all Slider examples #23217 @mnajdova - -### Core - -- [benchmark] Add theme-ui and chakra-ui Box scenarios (#23180) @mnajdova -- [benchmark] Create separate workspace (#23209) @eps1lon -- [benchmark] Extracted Profiler & added output in readme (#23178) @mnajdova -- [core] Batch small changes (#23116) @oliviertassinari -- [core] Improve bundle size comment (#23110) @eps1lon -- [core] Prevent unstable chunks in size snapshot (#23181) @eps1lon - -## 5.0.0-alpha.13 - -_Oct 17, 2020_ - -A big thanks to the 25 contributors who made this release possible. -Here are some highlights ✨: - -- 📦 Ship modern bundle (#22814) @eps1lon. - This is a significant update to the [browsers supported](https://mui.com/material-ui/getting-started/supported-platforms/) by Material UI. - The previous policy was defined 2 years ago, and the landscape has evolved since then. The package now includes 4 bundles: - - 1. `stable` (default, formerly `esm`) which targets a snapshot (on release) of `> 0.5%, last 2 versions, Firefox ESR, not dead, not IE 11"` - 2. `node` (formerly default) which targets a snapshot (on release) of `maintained node versions` - 3. `legacy` (new) which is `stable` + IE 11 - 4. `modern` (formerly `es`) which targets the last 1 version of evergreen browsers and active node (currently that is 14 - - The change yields a 6% reduction in bundle size 📦 (Babel only). - In the coming weeks, we will refactor the internals to take advantage of the new browser capabilities that dropping these older platforms allows. For instance, we might be able to remove the span we render inside the `<Button>` to work around [Flexbug #9](https://github.com/philipwalton/flexbugs/blob/master/README.md#flexbug-9). - - Check the updated [Supported platforms documentation](https://mui.com/material-ui/getting-started/supported-platforms/) and [new "minimizing bundle size" guide](https://mui.com/material-ui/guides/minimizing-bundle-size/). - - If you target IE11, you need to use the new bundle (`legacy`). We are treating IE11 as a second class-citizen, which is a continuation of the direction taken in #22873. - -- 🚀 Improve the internal benchmark suite (#22923, #23058) @mnajdova. - This was a prerequisite step to improve the [system](https://mui.com/system/getting-started/). We needed to be able to measure performance. After #22945, we have measured that the `Box` component is x3 faster in v5-alpha compared to v4. -- ✏️ A new blog post: [Q3 2020 Update](https://mui.com/blog/2020-q3-update/) (#23055) @oliviertassinari. -- 🐙 Migrate more tests to react-testing-library @deiga, @Morteza-Jenabzadeh, @nicholas-l. -- And many more 🐛 bug fixes and 📚 improvements. - -### `@material-ui/core@v5.0.0-alpha.13` - -#### Breaking changes - -- [core] Ship modern bundle (#22814) @eps1lon - -#### Change - -- [Autocomplete] Fix autoHighlight synchronization (#23025) @Tubaleviao -- [Autocomplete] Ignore keydown event until IME is confirmed (#23050) @jiggum -- [Card] Fix action area hover style on touch devices (#23079) @giulianovarriale -- [Slider] Align value label text center (#23075) @LorenzHenk -- [SwipeableDrawer] Decorrelate swipeAreaWidth and initial jumping amount (#23042) @omidtajik -- [Tooltip] Fix followCursor preventing onMouseMove on children (#23104) @eps1lon -- [Tooltip] Refactor event handling (#23092) @eps1lon -- [theme] Add missing types for theme overrides (#23028) @povilass -- [l10n] Add Arabic (ar_EG) locale (#23006) @GoldenWings - -### `@material-ui/lab@v5.0.0-alpha.13` - -- [TreeView] Fix bundle size link and refactor array spreads (#22992) @joshwooding -- [TreeView] Fix `alpha` color utility instead of deprecated `fade` (#22978) @joshwooding -- [core] Ship modern bundle (#22814) @eps1lon - -### `@material-ui/utils@v5.0.0-alpha.13` - -- [core] Ship modern bundle (#22814) @eps1lon - -### `@material-ui/system@v5.0.0-alpha.13` - -- [core] Ship modern bundle (#22814) @eps1lon - -### `@material-ui/styles@v5.0.0-alpha.13` - -- [core] Ship modern bundle (#22814) @eps1lon - -### `@material-ui/styled-engine@v5.0.0-alpha.13` - -- [core] Ship modern bundle (#22814) @eps1lon - -### `@material-ui/styled-engine-sc@v5.0.0-alpha.13` - -- [core] Ship modern bundle (#22814) @eps1lon - -### `@material-ui/icons@v5.0.0-alpha.13` - -- [core] Ship modern bundle (#22814) @eps1lon - -### Docs - -- [blog] Allow to support card preview (#23087) @oliviertassinari -- [blog] Q3 2020 Update (#23055) @oliviertassinari -- [docs] Add a new demo to the showcase (#22949) @adonig -- [docs] Add demo for Link underline (#23074) @LorenzHenk -- [docs] Add logarithmic slider demo (#23076) @LorenzHenk -- [docs] Add react-admin in related projects page (#23097) @fzaninotto -- [docs] Change color to palette (#23046) @mockingjet -- [docs] Don't suggest putting a Switch inside a ListItemSecondaryAction (#23018) @sirlantis -- [docs] Fix docs:dev (#23023) @eps1lon -- [docs] Fix vertical alignment of Slider demo (#23059) @r0zar -- [docs] Fix wrong variable characters (#23066) @AGDholo -- [docs] Improve docs for Table sticky column grouping (#23100) @andre-silva-14 -- [docs] Improve icon preview color contrast (#22974) @oliviertassinari -- [docs] Interoperability guide updates (#23030) @mnajdova -- [docs] Move outdated versions into a collapsible section (#23029) @NoNamePro0 -- [docs] Point to material-ui-x/next instead of master @oliviertassinari -- [docs] Restore ButtonBases images (#23083) @eps1lon -- [docs] Slider demos clean up (#22964) @mnajdova -- [docs] Sync translations (#22888) @l10nbot -- [examples] Update gatsby example to use @material-ui/\* next (#23089) @mnajdova -- [examples] Update gatsby-theme example to use @material-ui/\* next #23093 @mnajdova -- [examples] Update nextjs example project to use @material-ui/\* next (#23094) @mnajdova - -### Core - -- [benchmark] Add browser benchmark (#22923) @mnajdova -- [benchmark] Fix benchmark scripts & moved scenarios to correct benchmark project (#23058) @mnajdova -- [test] Enable failing unexpected console warn|error in browser tests (#23063) @eps1lon -- [test] Fail each test on unexpected console logs in test:unit (#23064) @eps1lon -- [test] Introduce toHaveInlineStyle and toHaveComputedStyle matcher (#23054) @eps1lon -- [test] Migrate ButtonBase to react-testing-library (#23011) @deiga -- [test] Migrate IconButton to react-testing-library (#22972) @Morteza-Jenabzadeh -- [test] Migrate InputBase to react-testing-library (#23014) @deiga -- [test] Migrate SpeedDial to react-testing-library (#23021) @nicholas-l -- [test] Migrate TableCell to react-testing-library (#23095) @nicholas-l -- [test] Migrate TableRow to react-testing-library (#23105) @deiga -- [test] Move some work out of evaluation phase (#23112) @eps1lon -- [test] Supress 404 img warnings in browser tests (#23106) @eps1lon -- [test] Throw on console.(error|warn) outside of test (#22907) @eps1lon -- [test] Use dot reporter in CI (#23026) @eps1lon -- [core] Add support for iOS Safari 12 (#23068) @eps1lon -- [core] Also format dot files & folders (#22975) @oliviertassinari -- [core] Extend yarn size:why (#22979) @eps1lon -- [core] Fix react-next test (#23027) @oliviertassinari -- [core] Lint CSS (#22976) @oliviertassinari -- [core] Misc modules/\* cleanup (#22983) @eps1lon - -## 5.0.0-alpha.12 - -_Oct 11, 2020_ - -A big thanks to the 45 contributors who made this release possible. -Here are some highlights ✨: - -- 🧪 The promotion of 4 components from the lab to core: Autocomplete, Pagination, SpeedDial, and ToggleButton. These components have been in the lab for more than 10 months @mbrookes. -- 📦 Switch the style engine of the `Box` component from JSS to _@material-ui/styled-engine_ (use emotion by default) (#22945) @mnajdova. - The early benchmark we have run shows that performance has improved. We will share more detailed results in #21657. -- 🐙 Migrate a large portion of the tests from enzyme to react-testing-library @eladmotola, @baterson, @bewong89, @devrasec, @guillermaster, @itamar244, @jeferson-sb, @The24thDS. - Last month, react-testing-library had [more downloads](https://npm-stat.com/charts.html?package=enzyme&package=%40testing-library%2Freact&from=2019-10-10&to=2020-10-10) than enzyme in the ecosystem! -- 🏷 Add support for tooltips [following the cursor](https://mui.com/components/tooltips/#follow-cursor) (#22876) @xtrixia. -- And many more 🐛 bug fixes and 📚 improvements. - -### `@material-ui/core@v5.0.0-alpha.12` - -#### Breaking changes - -- [Accordion] Remove `display:flex` from AccordionDetails (#22809) @croraf - The style was too opinionated. Most developers expect `display: block`. -- [Accordion] Replace IconButton wrapper with div (#22817) @croraf - Remove IconButtonProps prop from AccordionSummary. - The component renders a `<div>` element instead of an IconButton. - The prop is no longer relevant. -- [Box] Add mui styled usage (#22945) @mnajdova - Change the style-engine powering the Box component from JSS to the style engine adatper (emotion by default). -- [CircularProgress] Drop IE11 wobbly workaround (#22873) @suliskh - The IE11 workaround is harming performance on the latest browsers. - This change is part of a best-effort strategy to keep IE11 support. - We are degrading the UX and DX with IE11 where we can improve the components on modern browsers. -- [Table] Rename onChangeRowsPerPage and onChangePage (#22900) @eladmotola - The change was done to match the API convention. - - ```diff - <TablePagination - - onChangeRowsPerPage={()=>{}} - - onChangePage={()=>{}} - + onRowsPerPageChange={()=>{}} - + onPageChange={()=>{}} - ``` - -- [theme] Rename fade to alpha (#22834) @mnajdova - 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. - - ```diff - -import { fade } from '@material-ui/core/styles'; - +import { alpha } from '@material-ui/core/styles'; - - const classes = makeStyles(theme => ({ - - backgroundColor: fade(theme.palette.primary.main, theme.palette.action.selectedOpacity), - + backgroundColor: alpha(theme.palette.primary.main, theme.palette.action.selectedOpacity), - })); - ``` - -- [Tooltip] Make `interactive` default (#22382) @eps1lon - The previous default behavior failed [success criterion 1.4.3 ("hoverable") in WCAG 2.1](https://www.w3.org/TR/WCAG21/#content-on-hover-or-focus). - To reflect the new default value, the prop was renamed to `disableInteractive`. - If you want to restore the old behavior (thus not reaching level AA), you can apply the following diff: - - ```diff - -<Tooltip> - +<Tooltip disableInteractive> - # Interactive tooltips no longer need the `interactive` prop. - -<Tooltip interactive> - +<Tooltip> - ``` - -#### Changes - -- [Accordion] Remove incorrect demo which nests input in button (#22898) @croraf -- [Autocomplete] Fix filtering when value is already selected (#22935) @montelius -- [Autocomplete] Fix virtualization example in IE11 (#22940) @bearfromtheabyss -- [Autocomplete] Restrict component props in `renderInput` (#22789) @eps1lon -- [Box] Add types for `ref` (#22927) @lcswillems -- [Button] Fix invalid type value (#22883) @oliviertassinari -- [Button] Improve loading transition (#22884) @oliviertassinari -- [Grid] Clarify document about direction column limitation (#22871) @ThewBear -- [IconButton] Improve warning against non root onClick listeners (#22821) @pranjanpr -- [Popper] Use placement viewport instead of window (#22748) @maksimgm -- [Select] Add generic support for value (#22839) @AntoineGrandchamp -- [Skeleton] Fix importing with named export (#22879) @0prodigy -- [SpeedDial] Fix keyboard navigation when uncontrolled (#22826) @akharkhonov -- [styled] Specify emotion & styled-components as optional peer dependencies (#22808) @mnajdova -- [styled] Support default theme when none is available (#22791) @mnajdova -- [Tabs] Fix RTL scrollbar with Chrome 85 (#22830) @ankit -- [TextField] Pass minRows to InputComponent (#22831) @suliskh -- [ToggleButton] Fix vertical double border (#22825) @Avi98 -- [ToggleButton] Match ToggleButtonGroup name and render function name (#22790) @jjoselv -- [Tooltip] Add placement `followCursor` (#22876) @xtrixia -- [Tooltip] Improve docs and warning for custom children (#22775) @brorlarsnicklas -- [Tooltip] Use label semantics (#22729) @eps1lon -- [useAutocomplete] Fix getXProps functions type (#22749) @kentaro84207 - -### `@material-ui/styled-engine@v5.0.0-alpha.12` - -- [styled] Support default theme when none is available (#22791) @mnajdova - -### `@material-ui/lab@v5.0.0-alpha.12` - -#### Breaking changes - -- [Autocomplete] Move from lab to core (#22715) @mbrookes - Move the component from the lab to the core. This component will become stable. - - ```diff - -import Autocomplete from '@material-ui/lab/Autocomplete'; - -import useAutocomplete from '@material-ui/lab/useAutocomplete'; - +import Autocomplete from '@material-ui/core/Autocomplete'; - +import useAutocomplete from '@material-ui/core/useAutocomplete'; - ``` - -- [Pagination] Move from lab to core (#22848) @mbrookes - Move the component from the lab to the core. This component will become stable. - - ```diff - -import Pagination from '@material-ui/lab/Pagination'; - -import PaginationItem from '@material-ui/lab/PaginationItem'; - -import { usePagination } from '@material-ui/lab/Pagination'; - +import Pagination from '@material-ui/core/Pagination'; - +import PaginationItem from '@material-ui/core/PaginationItem'; - +import usePagination from '@material-ui/core/usePagination'; - ``` - -- [SpeedDial] Move from lab to core (#22743) @mbrookes - Move the component from the lab to the core. This component will become stable. - - ```diff - -import SpeedDial from '@material-ui/lab/SpeedDial'; - -import SpeedDialAction from '@material-ui/lab/SpeedDialAction'; - -import SpeedDialIcon from '@material-ui/lab/SpeedDialIcon'; - +import SpeedDial from '@material-ui/core/SpeedDial'; - +import SpeedDialAction from '@material-ui/core/SpeedDialAction'; - +import SpeedDialIcon from '@material-ui/core/SpeedDialIcon'; - ``` - -- [ToggleButton] Move from lab to core (#22784) @mbrookes - Move the component from the lab to the core. This component will become stable. - - ```diff - -import ToggleButton from '@material-ui/lab/ToggleButton'; - -import ToggleButtonGroup from '@material-ui/lab/ToggleButtonGroup'; - +import ToggleButton from '@material-ui/core/ToggleButton'; - +import ToggleButtonGroup from '@material-ui/core/ToggleButtonGroup'; - ``` - -- [TreeView] Improve customization of tree item (#22846) @joshwooding - Remove `onLabelClick` and `onIconClick`. - -#### Changes - -- [AvatarGroup] Add variant prop (#22832) @hjades -- [SliderStyled] Fix mark label alignment on coarse pointer devices (#22849) @joshwooding - -### Docs - -- [docs] Add example for using styled-components as styled-engine (#22788) @mnajdova -- [docs] Add longhand system API props to docs (#22796) @possibilities -- [docs] Box & system cleanup (#22962) @mnajdova -- [docs] CONTRIBUTING.md only yarn is supported (#22754) @Yashvirani -- [docs] Document createSvgIcon() (#22843) @mbrookes -- [docs] Document inherited props (#22318) @oliviertassinari -- [docs] Document LoadingButton behavior (#22878) @eps1lon -- [docs] Fix dark theme for input field on autocomplete (#22711) @GauravKesarwani -- [docs] Fix material icon search details view (#22793) @skr571999 -- [docs] Fix type vs. mode and capitalization of createMuiTheme (#22844) @joshwooding -- [docs] Fix typo in guides/typescript (#22806) @croraf -- [docs] Fix various typos (#22842) @kkirsche -- [docs] For non-SSR language, internal search fall back to English (#22902) @bicstone -- [docs] Improve CRA example (#22967) @spursbyte -- [docs] Improve FormControl duplication warning (#22823) @talgautb -- [docs] Improve perf when opening the drawer (#22781) @eps1lon -- [docs] Improve SEO on titles (#22742) @oliviertassinari -- [docs] Improve the left side-nav (#22780) @oliviertassinari -- [docs] Include peer deps in installation steps (#22889) @numToStr -- [docs] Link all the examples in docs (#22891) @Avi98 -- [docs] More robust description matcher (#22836) @eps1lon -- [docs] Reduce risk of 404 when changing the default branch (#22801) @eps1lon -- [docs] Resolve .tsx first (#22315) @oliviertassinari -- [docs] Simplify locales example (#22747) @mbrookes -- [docs] Sync translations (#22752, #22851) @l10nbot -- [docs] Update installation guide to contain peer dependencies (#22787) @mnajdova -- [docs] Update ToggleButton import (#22971) @mbrookes -- [docs] Use demo name as codesandbox name (#22926) @eps1lon - -### Core - -- [benchmark] Add cross-env to fix window run issue (#22895) @mnajdova -- [core] Batch small changes (#22746) @oliviertassinari -- [core] Batch small changes (#22847) @oliviertassinari -- [core] Drop babel-plugin-transform-dev-warning (#22802) @eps1lon -- [core] Misc dependency fixes (#22909) @eps1lon -- [test] Apply lazy forwardRef fix (#22904) @eps1lon -- [test] Autocomplete drop "defaultProps" pattern (#22896) @eps1lon -- [test] Fix react-next patch (#22800) @eps1lon -- [test] Migrate Accordion to react-testing-library (#22952) @bewong89 -- [test] Migrate Backdrop to react-testing-library (#22931) @itamar244 -- [test] Migrate Container to react-testing-library (#22919) @eladmotola -- [test] Migrate CssBaseline to react-testing-library (#22920) @eladmotola -- [test] Migrate Fab to react-testing-library (#22959) @The24thDS -- [test] Migrate Fade to react-testing-library (#22918) @eladmotola -- [test] Migrate Grow to react-testing-library (#22917) @eladmotola -- [test] Migrate List to react-testing-library (#22929) @eladmotola -- [test] Migrate MenuList and ImageListItem to react-testing-library (#22958) @eladmotola -- [test] Migrate MobileStepper to react-testing-library (#22963) @devrasec -- [test] Migrate more components to react-testing-library (#22872) @baterson -- [test] Migrate more components to react-testing-library (#22874) @baterson -- [test] Migrate more components to react-testing-library (#22892) @baterson -- [test] Migrate NativeSelect to react-testing-library (#22970) @guillermaster -- [test] Migrate NativeSelectInput to react-testing-library (#22910) @baterson -- [test] Migrate RadioGroup to react-testing-library (#22953) @eladmotola -- [test] Migrate Slide to react-testing-library (#22913) @eladmotola -- [test] Migrate SpeedDialIcon to react-testing-library (#22965) @jeferson-sb -- [test] Migrate TabIndicator to react-testing-library (#22906) @eladmotola -- [test] Migrate TextField to react-testing-library (#22944) @The24thDS -- [test] Migrate useTheme,withTheme to react-testing-library (#22928) @eladmotola -- [test] Migrate Zoom to react-testing-library (#22914) @eladmotola -- [test] Prevent nextjs build cache to grow indefinitely (#22948) @eps1lon -- [test] Simplify usage of `yarn mocha` (#22899) @eps1lon -- [test] Solve 2000ms timeout (#22778) @oliviertassinari -- [test] Update react next patch (#22890) @eps1lon -- [test] Use appropriate templates for csb CI (#22943) @eps1lon -- [test] Verbose reporter in CI (#22924) @eps1lon - -## 5.0.0-alpha.11 - -_Sep 26, 2020_ - -A big thanks to the 29 contributors who made this release possible. -Here are some highlights ✨: - -- 👩‍🎨 A first iteration on the new styling solution. - - You can find a [new version](https://mui.com/components/slider-styled/) of the slider in the lab powered by [Emotion](https://emotion.sh/). - - In the event that you are already using styled-components in your application, you can swap emotion for styled-components 💅. Check [this CodeSandbox](https://codesandbox.io/p/sandbox/sliderstyled-with-styled-components-forked-olc27?file=/package.json) for a demo. It relies on aliases to prevent any bundle size overhead. - - The new styling solution saves 2kB gzipped in the bundle compared to JSS, and about 14 kB gzipped if you were already using emotion or styled-components. - - Last but not least, the change allows us to take advantage dynamic style props. We will use them for dynamic color props, variant props, and new style props (an improved [system](https://mui.com/system/getting-started/)). - - This change has been in our roadmap for more than a year. - We announced it in the [v4 release blog post](https://mui.com/blog/material-ui-v4-is-out/) as a direction v5 would take. - -- 🛠 A first iteration on the unstyled components. - - You can find a [new version](https://mui.com/components/slider-styled/#UnstyledSlider.tsx) of the slider in the lab without any styles. - The unstyled component weighs 6.5 kB gzipped, compared with 26 kB for the styled version when used standalone. The component is best suited for use when you want to fully customize the look of the component without reimplementing the JavaScript and accessibility logic. - -- ⚡️ A first alpha of the [DataGrid](https://mui.com/x/react-data-grid/) component. - - It has taken 6 months of development since the initial commit (March 15th, 2020) to make the first alpha release of the grid. The component comes in two versions: - @material-ui/data-grid is licensed under MIT, while @material-ui/x-grid is licensed under a commercial license. - -- 🪓 Keep working on the breaking changes. - - We aim to complete most of the breaking changes during the alpha stage of v5. - We will move to beta once all the breaking changes we have anticipated are handled. - As always, you should find a clear and simple upgrade path for each of them. - You can learn more about the breaking changes left to be done in #22700. - -- And many more 🐛 bug fixes and 📚 improvements. - -### `@material-ui/core@v5.0.0-alpha.11` - -#### Breaking changes - -- [Chip] Rename `default` variant to `filled` (#22683) @mnajdova - Rename `default` variant to `filled` for consistency. - - ```diff - -<Chip variant="default"> - +<Chip variant="filled"> - ``` - -- [Tabs] Add allowScrollButtonsMobile prop for mobile view (#22700) @GauravKesarwani - The API that controls the scroll buttons has been split it into two props: - - - The `scrollButtons` prop controls when the scroll buttons are displayed depending on the space available. - - The `allowScrollButtonsMobile` prop removes the CSS media query that systematically hides the scroll buttons on mobile. - - ```diff - -<Tabs scrollButtons="on" /> - -<Tabs scrollButtons="desktop" /> - -<Tabs scrollButtons="off" /> - +<Tabs scrollButtons allowScrollButtonsMobile /> - +<Tabs scrollButtons /> - +<Tabs scrollButtons={false} /> - ``` - -- [theme] Improve breakpoints definitions (#22695) @mnajdova - Breakpoints are now treated as values instead of ranges. - The behavior of `down(key)` was changed to define media query less than the value defined with the corresponding breakpoint (exclusive). - The behavior of `between(start, end)` was also updated to define media query for the values between the actual values of start (inclusive) and end (exclusive). - - Find examples of the changes required defined below: - -```diff --theme.breakpoints.down('sm') // '@media (max-width:959.95px)' - [0, sm + 1) => [0, md) -+theme.breakpoints.down('md') // '@media (max-width:959.95px)' - [0, md) -``` - -```diff --theme.breakpoints.between('sm', 'md') // '@media (min-width:600px) and (max-width:1279.95px)' - [sm, md + 1) => [sm, lg) -+theme.breakpoints.between('sm', 'lg') // '@media (min-width:600px) and (max-width:1279.95px)' - [sm, lg) -``` - -- [theme] Rename `type` to `mode` (#22687) @mnajdova - Renames `theme.palette.type` to `theme.palette.mode`, to better follow the "dark mode" term that is usually used for describing this feature. - - ```diff - import { createMuiTheme } from '@material-ui/core/styles'; - - -const theme = createMuiTheme({palette: { type: 'dark' }}), - +const theme = createMuiTheme({palette: { mode: 'dark' }}), - ``` - - The changes are supported by the `adaptV4Theme()` for easing the migration - -#### Changes - -- [Checkbox] Improve indeterminate UI (#22635) @oliviertassinari -- [Chip] Fix prop-type support for custom variants (#22603) @cansin -- [icons] Expose a data-test-id attribute on all svg icons (#22634) @jaebradley -- [Rating] Add form integration test suite (#22573) @eps1lon -- [Rating] Simpler customization of active "no value" styles (#22613) @eps1lon -- [Rating] Treat as input when readOnly (#22606) @eps1lon -- [Rating] Treat read-only as image (#22639) @eps1lon -- [Select] Improve docs for displayEmpty prop (#22601) @mihaipanait -- [Slider] Better tracking of mouse events (#22557, #22638) @chrisinajar, @oliviertassinari -- [Slider] Create unstyled version and migrate to emotion & styled-components (#22435) @mnajdova -- [Slider] Export components from lab and renamed to fit file names (#22723) @mnajdova -- [Slider] Fix value label display for custom value component (#22614) @NoNonsense126 -- [Stepper] Add slight transition (#22654) @xtrixia -- [Tabs] Fix TabScrollButton using absolute path (#22690) @4vanger -- [Tabs] Only scroll the visible tabs (#22600) @quochuy -- [theme] convertLength does not work for fromUnit !== 'px' (#22739) @brorlarsnicklas -- [theme] Fix createSpacing.d.ts definition (#22645) @dabretin -- [theme] Fix Hidden breakpoints issues and updates the migration guide (#22702) @mnajdova - -### `@material-ui/lab@v5.0.0-alpha.11` - -#### Breaking changes - -- [Alert] Move from lab to core (#22651) @mbrookes - Move the component from the lab to the core. This component will become stable. - - ```diff - -import Alert from '@material-ui/lab/Alert'; - -import AlertTitle from '@material-ui/lab/AlertTitle'; - +import Alert from '@material-ui/core/Alert'; - +import AlertTitle from '@material-ui/core/AlertTitle'; - ``` - -- [Rating] Move from lab to core (#22725) @mbrookes - Move the component from the lab to the core. This component will become stable. - - ```diff - -import Rating from '@material-ui/lab/Rating'; - +import Rating from '@material-ui/core/Rating'; - ``` - -- [Skeleton] Move from lab to core (#22740) @mbrookes - Move the component from the lab to the core. This component will become stable. - - ```diff - -import Skeleton from '@material-ui/lab/Skeleton'; - +import Skeleton from '@material-ui/core/Skeleton'; - ``` - -- [Autocomplete] Get root elements of options via renderOption (#22591) @ImanMahmoudinasab - After this change, the full DOM structure of the option is exposed. - It makes customizations easier. - You can recover from the change with: - - ```diff - <Autocomplete - - renderOption={(option, { selected }) => ( - - <React.Fragment> - + renderOption={(props, option, { selected }) => ( - + <li {...props}> - <Checkbox - icon={icon} - checkedIcon={checkedIcon} - style={{ marginRight: 8 }} - checked={selected} - /> - {option.title} - - </React.Fragment> - + </li> - )} - /> - ``` - -#### Changes - -- [lab] Fix transitive dependencies in @material-ui/lab (#22671) @koistya -- [Autocomplete] Add "remove-option" to AutocompleteCloseReason type (#22672) @iansjk -- [Autocomplete] Don't close popup when Ctrl/Meta is pressed (#22696) @montelius -- [Autocomplete] Fix accessibility issue with empty option set (#22712) @tylerjlawson -- [Autocomplete] Update GitHub customization example (#22735) @hmaddisb - -### `@material-ui/styled-engine@v5.0.0-alpha.11` - -The new default style engine leveraging emotion. - -### `@material-ui/styled-engine-sc@v5.0.0-alpha.11` - -Allows developer to swap emotion with styled-components. -More documentation are coming. - -### `@material-ui/icons@v5.0.0-alpha.11` - -- [icons] Synchronize with Google (#22680) @delewis13 - -### `@material-ui/styles@v5.0.0-alpha.11` - -- [Slider] Create unstyled version and migrate to emotion & styled-components (#22435) @mnajdova - -### `@material-ui/system@v5.0.0-alpha.11` - -- [core] Port createSpacing to TypeScript (#22720) @eps1lon - -### Docs - -- [blog] New posts (#22607) @oliviertassinari -- [docs] Add additional context to Autocomplete asynchronous documentation (#22621) @jaebradley -- [docs] Add emotion dependencies in codesandbox examples (#22736) @mnajdova -- [docs] Add props from Unstyled component to Styled API page (#22733) @mnajdova -- [docs] Add ui-schema in related projects (#22644) @elbakerino -- [docs] Avoid confusion between layout grid and data grid (#22681) @oliviertassinari -- [docs] Batch small changes (#22646) @oliviertassinari -- [docs] Configuring redirects for MUI X (#22632) @dtassone -- [docs] Customized hook at Autocomplete issue in dark mode (#22605) @hmaddisb -- [docs] Encourage DataGrid in /components/tables/ over alternatives (#22637) @oliviertassinari -- [docs] Fix emotion broken in SSR (#22731) @mnajdova -- [docs] Fix markdown metadata yaml (#22629) @oliviertassinari -- [docs] Fix static asset loading with X @oliviertassinari -- [docs] Improve Dashboard template (#22647) @pak1989 -- [docs] Improve DX for docs generation (#22619) @eps1lon -- [docs] Migrate templates to TypeScript (#22650) @oliviertassinari -- [docs] New Crowdin updates (#22620) @mbrookes -- [docs] Prevent toolbar tooltips overlapping demos (#22732) @eps1lon -- [docs] Reduce indirections (#22642) @Arsikod -- [docs] Reference experimental slider demos correctly (#22738) @eps1lon -- [docs] Remove minimum-scale from meta viewport in docs (#22724) @barik -- [docs] Remove wrong migration instruction (#22710) @oliviertassinari -- [docs] Use codesandbox deploy for demos created from deploy previews (#22616) @eps1lon - -### Core - -- [core] Port createSpacing to TypeScript (#22720) @eps1lon -- [core] Replace ChangeEvent<{}> with SyntheticEvent (#22716) @eps1lon -- [core] Use ttp sources directly (#22706) @eps1lon -- [test] Add skip ci to Crowdin commit message (#22685) @mbrookes -- [test] Only run on push for master/next (#22624) @eps1lon -- [test] Run CircleCI anytime (#22676) @eps1lon - -## 5.0.0-alpha.10 - -_Sep 15, 2020_ - -A big thanks to the 16 contributors who made this release possible. -Here are some highlights ✨: - -- Keep working on the breaking changes before v5-beta. - As always, you should find a clear and simple upgrade path for each of them. -- And many more 🐛 bug fixes and 📚 improvements. - -### `@material-ui/core@v5.0.0-alpha.10` - -#### Breaking changes - -- [Accordion] Normalize focusVisible logic (#22567) @oliviertassinari - Rename `focused` to `focusVisible` for consistency with the other components: - - ```diff - <Accordion - classes={{ - - focused: 'custom-focus-visible-classname', - + focusVisible: 'custom-focus-visible-classname', - }} - /> - ``` - -- [Stepper] Remove Paper and built-in padding (#22564) @mbrookes - The root component (Paper) was replaced with a `<div>`. Stepper no longer has elevation, nor inherits Paper's props. This change is meant to encourage composition. - - ```diff - -<Stepper elevation={2}> - - <Step> - - <StepLabel>Hello world</StepLabel> - - </Step> - -</Stepper> - +<Paper square elevation={2}> - + <Stepper> - + <Step> - + <StepLabel>Hello world</StepLabel> - + </Step> - + </Stepper> - +<Paper> - ``` - - Remove the built-in 24px padding for consistency with the other components that avoid reserving space anytime it's possible. - - ```diff - -<Stepper> - - <Step> - - <StepLabel>Hello world</StepLabel> - - </Step> - -</Stepper> - +<Stepper style={{ padding: 24 }}> - + <Step> - + <StepLabel>Hello world</StepLabel> - + </Step> - +</Stepper> - ``` - -- [theme] Always return default spacing value with px units (#22552) @mbrookes - - `theme.spacing` now returns single values with px units by default. - This change improves the integration with styled-components & emotion (with the CSS template strings syntax). - - Before: - - ```bash - theme.spacing(2) => 16 - ``` - - After: - - ```bash - theme.spacing(2) => '16px' - ``` - -- [theme] Remove palette.text.hint key (#22537) @mbrookes - - The `theme.palette.text.hint` key was available but unused in Material UI v4 components. - You can use `adaptV4Theme()` to restore the previous behavior. - -#### Changes - -- [BottomNavigation] onClick does not fire if tapped while scrolling (#22524) @EliasJorgensen -- [Button] Remove dead code (#22566) @oliviertassinari -- [Chip] Fix focus visible style (#22430) @alexmotoc -- [ImageList] Refactor using CSS grid & React context (#22395) @mbrookes -- [Slider] Improve integration with form libraries (#22548) @NoNonsense126 -- [StepIcon] Add className in render SvgIcon (#22559) @ZouYouShun -- [SwipeableDrawer] Avoid blocking events (#22525) @JadRizk -- [theme] Support spacing and border radius with CSS unit (#22530) @madmanwithabike -- [theme] Fix theme object global leak (#22517) @eps1lon -- [theme] Increase usage of the disabled design tokens (#22570) @LorenzHenk - -### `@material-ui/lab@v5.0.0-alpha.10` - -#### Breaking changes - -- [Rating] Use different shape for empty and filled icons (#22554) @oliviertassinari - Change the default empty icon to improve accessibility (1.4.1 WCAG 2.1). - If you have a custom `icon` prop but no `emptyIcon` prop, you can restore the previous behavior with: - - ```diff - <Rating - icon={customIcon} - + emptyIcon={null} - /> - ``` - -#### Changes - -- [Autocomplete] Improve TypeScript in the Google Maps demo (#22555) @L-U-C-K-Y -- [Rating] Explain some styles in code comments (#22571) @eps1lon - -### Docs - -- [docs] Improve Font Awesome integration (#22496) @chrislambe -- [docs] Clarify SSG acronym in Next.js example (#22558) @leerob -- [docs] Add redirection for links published on npm (#22575) @oliviertassinari -- [docs] Add LightyearVPN to showcase (#22568) @lightyearvpn -- [docs] Fix typo, extra 'you' (#22560) @jedsmit -- [docs] Option to disable ads (#22574) @oliviertassinari - -### Core - -- [core] Remove usage of deprecated event.keyCode (#22569) @oliviertassinari -- [core] Remove references to other objects from created theme (#22523) @eps1lon -- [core] Batch small changes (#22565) @oliviertassinari - -## 5.0.0-alpha.9 - -_Sep 6, 2020_ - -A big thanks to the 14 contributors who made this release possible. -Here are some highlights ✨: - -- 💎 A new diamond sponsor: [DoiT](https://www.doit.com/), thank you! -- 📚 Include the default value of the props in IntelliSense (#22447) @eps1lon -- ⚛️ More source migrated to TypeScript and testing-library (#22441) @baterson -- And many more 🐛 bug fixes and 📚 improvements. - -### `@material-ui/core@v5.0.0-alpha.9` - -#### Breaking changes - -- [Modal] Remove `onRendered` prop from Modal and Portal (#22464) @eps1lon - Depending on your use case either use a [callback ref](https://react.dev/learn/manipulating-the-dom-with-refs#how-to-manage-a-list-of-refs-using-a-ref-callback) on the child element or an effect hook in the child component. - -#### Changes - -- [Modal] Convert ModalManager to TypeScript (#22465) @eps1lon -- [Paper] Fix elevation warning when rendering (#22494) @nesso-pfl -- [Slider] Edge against swallowing of mouse up event (#22401) @motiejunas -- [Tabs] Add option to show scrollbar (#22438) @LogyLeo -- [Tabs] Document visibleScrollBar default value (#22475) @eps1lon -- [TextField] Remove excessive catching of hiddenLabel prop (#22444) @croraf - -### `@material-ui/lab@v5.0.0-alpha.9` - -- [docs] Include default values in IntelliSense (#22447) @eps1lon - -### Docs - -- [docs] Add DoiT diamond sponsor (#22436) @oliviertassinari -- [docs] Bump markdown-to-jsx (#22474) @eps1lon -- [docs] Change showcase approval process (#22398) @africanzoe -- [docs] Fix close context menu if repeated (#22463) @eps1lon -- [docs] Fix Next.js example (#22457) @bhati -- [docs] Fix TypeScript deps in CodeSandbox (#22346) @oliviertassinari -- [docs] Fix unresolved returntypes for props (#22459) @eps1lon -- [docs] Fix usage of overrides instead of styleOverrides (#22478) @discodanne -- [docs] Improve Backstage showcase (#22458) @stefanalund -- [docs] Improve styles basics.md section (#22440) @bxie -- [docs] Include default values in IntelliSense (#22447) @eps1lon - -### Core - -- [core] Batch small changes (#22461) @oliviertassinari -- [core] Fix useEventCallback type (#22448) @kodai3 -- [core] Try out new JSX transform where available (#22455) @eps1lon -- [test] Migrate more components to react-testing-library (#22441) @baterson - -## 5.0.0-alpha.8 - -_Aug 31, 2020_ - -A big thanks to the 19 contributors who made this release possible. -Here are some highlights ✨: - -- 🎨 Inverse the customization API of the theme to be component-centric (#22347, #22293) @mnajdova. - -```jsx -const theme = createMuiTheme({ - components: { - MuiIconButton: { - defaultProps: { - size: 'small', - }, - styleOverrides: { - sizeSmall: { - marginLeft: 4, - marginRight: 4, - padding: 12, - }, - }, - }, - }, -}); -``` - -- ✨ Add [text in divider](https://mui.com/components/dividers/#dividers-with-text) support (#22285) @ShehryarShoukat96 - - ```jsx - <Divider>{'CENTER'}</Divider> - ``` - - <img width="530" alt="divider" src="https://user-images.githubusercontent.com/3165635/91740018-01cb5e80-ebb3-11ea-9a7f-6ddb48b3f496.png"> - -- ♿️ A bunch of accessibility fixes (#22366, #22374, #22377, #22340, #22376) @fakeharahman @alexmotoc @eps1lon @oliviertassinari -- ⚛️ Increase adoption of TypeScript in the codebase (#22389, #22367, #22282) @Luchanso, @oliviertassinari - -### `@material-ui/core@v5.0.0-alpha.8` - -#### Breaking changes - -- [theme] Rename theme keys to defaultProps and styleOverrides (#22347) @mnajdova -- [theme] Restructure component definitions (#22293) @mnajdova - The components' definition inside the theme were restructure under the `components` key, to allow people easier discoverability about the definitions regarding one component. - - 1. `props` - - ```diff - import { createMuiTheme } from '@material-ui/core/styles'; - - const theme = createMuiTheme({ - - props: { - - MuiButton: { - - disableRipple: true, - - }, - - }, - + components: { - + MuiButton: { - + defaultProps: { - + disableRipple: true, - + }, - + }, - + }, - }); - ``` - - 2. `overrides` - - ```diff - import { createMuiTheme } from '@material-ui/core/styles'; - - const theme = createMuiTheme({ - - overrides: { - - MuiButton: { - - root: { padding: 0 }, - - }, - - }, - + components: { - + MuiButton: { - + styleOverrides: { - + root: { padding: 0 }, - + }, - + }, - + }, - }); - ``` - - Note that if you don't have the time to upgrade the structure of the theme, you - can use the `adaptV4Theme()` adapter. - -- [GridList] Rename to ImageList (#22311) @mbrookes -- [GridList] Rename Tile to Item (#22385) @mbrookes - Rename the `GridList` components to `ImageList` to align with the current Material Design naming. - - ```diff - -import GridList from '@material-ui/core/GridList'; - -import GridListTile from '@material-ui/core/GridListTile'; - -import GridListTileBar from '@material-ui/core/GridListTileBar'; - +import ImageList from '@material-ui/core/ImageList'; - +import ImageListItem from '@material-ui/core/ImageListItem'; - +import ImageListItemBar from '@material-ui/core/ImageListItemBar'; - - -<GridList> - - <GridListTile> - +<ImageList> - + <ImageListItem> - <img src="file.jpg" alt="Image title" /> - - <GridListTileBar - + <ImageListItemBar - title="Title" - subtitle="Subtitle" - /> - - </GridListTile> - -</GridList> - + </ImageListItem> - +</ImageList> - ``` - -#### Changes - -- [Breadcrumbs] Fix wrong role usage (#22366) @fakeharahman -- [Breadcrumbs] More robust focus capture (#22374) @eps1lon -- [ButtonBase] Reset box-sizing to border-box (#22316) @su8ru -- [Dialog] Fix unexpected close when releasing click on backdrop (#22310) @danbrud -- [Divider] Add text in divider (#22285) @ShehryarShoukat96 -- [Slider] Respect disabled property when already focused (#22247) @pireads -- [Tabs] Don't fire onChange if current value (#22381) @jjoselv -- [Tabs] Improve focus management on list with no active tabs (#22377) @alexmotoc -- [theme] Add theme.mixins.gutters() in adaptV4Theme (#22396) @mnajdova -- [Tooltip] Improve readability (#22340) @oliviertassinari -- [Tooltip] Meet dismissable WCAG criterion (#22376) @eps1lon -- [l10n] Improve th-TH locale (#22350) @vimutti77 - -### `@material-ui/lab@v5.0.0-alpha.8` - -- [docs] Add IntelliSense for each class in the `classes` prop (#22312) @eps1lon - -### `@material-ui/styles@v5.0.0-alpha.8` - -- [theme] Restructure component definitions (#22293) @mnajdova - -### `@material-ui/utils@v5.0.0-alpha.8` - -- [core] Move utils package to TypeScript (#22367) @oliviertassinari - -### Docs - -- [docs] Add Content Security Policy guide (#22383) @tjg37 -- [docs] Add IntelliSense for each class in the `classes` prop (#22312) @eps1lon -- [docs] Add links in the header (#22210) @oliviertassinari -- [docs] Fix Argos-ci 404 link (#22362) @brunocechet -- [docs] Fix test README typo @mbrookes -- [docs] Forward x data-grid (#22400) @oliviertassinari -- [docs] Transpile demo .ts files (#22388) @eps1lon -- [docs] Add Backstage to showcase (#22428) @stefanalund -- [docs] Update Fontsource installation instructions (#22431) @DecliningLotus - -### Core - -- [icons] Label them as vendored for GitHub (#22397) @oliviertassinari -- [test] DialogContent with testing-library (#22356) @baterson -- [test] DialogContentText with testing-library (#22357) @baterson -- [test] DialogTitle with testing-library (#22358) @baterson -- [test] Enable tests that weren't working in JSDOM (#22360) @eps1lon -- [test] Fix failing tests on Windows (#22369) @eps1lon -- [test] Update react 17 patch (#22391) @eps1lon -- [core] Add explicit dependency on `@types/yargs` (#22339) @eps1lon -- [core] Add useEnhancedEffect module (#22317) @oliviertassinari -- [core] Batch small changes (#22314) @oliviertassinari -- [core] Fix setRef types (#22389) @Luchanso -- [core] Include TypeScript definitions in GitHub source (#22282) @oliviertassinari -- [core] Refactor how we ignore default values in docs (#22355) @eps1lon -- [core] Update SECURITY.md to account for v5 @oliviertassinari - -## 5.0.0-alpha.7 - -_Aug 22, 2020_ - -A big thanks to the 22 contributors who made this release possible. -Here are some highlights ✨: - -- 💎 A new diamond sponsor: [Octopus](https://octopus.com/), thank you! -- ⚛️ Migrate parts of the codebase to TypeScript (#22295, #22280, #22179, #22195) @rothbart, @eps1lon, @oliviertassinari. -- 💅 Add support for custom variant to most of the components (9 new components in this release) @mnajdova -- ⚛️ Keep working on React 17 support (#22270, #22262) @eps1lon -- And many more 🐛 bug fixes and 📚 improvements. - -### `@material-ui/core@v5.0.0-alpha.7` - -### Breaking changes - -- [Menu] Remove transition onX props (#22212) @mbrookes - The onE\* transition props were removed. Use TransitionProps instead. - - ```diff - <Menu - - onEnter={onEnter} - - onEntered={onEntered}, - - onEntering={onEntered}, - - onExit={onEntered}, - - onExited={onEntered}, - - onExiting={onEntered} - + TransitionProps={{ - + onEnter, - + onEntered, - + onEntering, - + onExit, - + onExited, - + onExiting, - + }} - > - ``` - -- [Popover] Remove transition onX props (#22184) @mbrookes - The onE\* transition props were removed. Use TransitionProps instead. - - ```diff - <Popover - - onEnter={onEnter} - - onEntered={onEntered}, - - onEntering={onEntered}, - - onExit={onEntered}, - - onExited={onEntered}, - - onExiting={onEntered} - + TransitionProps={{ - + onEnter, - + onEntered, - + onEntering, - + onExit, - + onExited, - + onExiting, - + }} - /> - ``` - -- [TextField] Improve line-height reset (#22149) @imnasnainaec - Increase the line-height by 4px to support long descender on special alphabets. - If you were overriding the input vertical padding, reduce it by 4px. - -### Changes - -- [Accordion] Fix scroll anchoring (#22292) @brickmaker17 -- [colorManipulator] Add support for CSS Color Module Level 4 (#20790) @marcosvega91 -- [Divider] Custom variant (#22182) @mnajdova -- [Fab] Custom variant (#22189) @mnajdova -- [l10n] Add Thai (th-TH) locale (#22242) @smoogi -- [l10n] Improve ja-JP locale (#22287) @chelproc -- [Link] Custom variant (#22204) @mnajdova -- [Paper] Custom variant (#22216) @mnajdova -- [Slider] Improve touch passive event handling (#22269) @mikhalev-im -- [Stepper] Fix spacing without StepContent (#22199) @Floriferous -- [SwipeableDrawer] Fix prevented inner scroll (#22254) @BramKaashoek -- [Tabs] Add aria-orientation of vertical (#22291) @eps1lon -- [Tabs] Document how to make scroll icons visible (#22255) @Sorgrum -- [TextField] Add hidden label to multi-line filled textfield (#22284) @fakeharahman -- [Toolbar] Custom variant (#22217) @mnajdova -- [FocusTrap] Entangle effects (#22155) @eps1lon -- [FocusTrap] Fix compatibility issues with React 17 (#22270) @eps1lon -- [FocusTrap] Prevent possible crash in React 17 (#22262) @eps1lon - -### `@material-ui/icons@v5.0.0-alpha.7` - -- [icons] Synchronize icons (#22186) @oliviertassinari - -### `@material-ui/styles@v5.0.0-alpha.7` - -- [core] Change children to be optional (#22134) @suliskh - -### `@material-ui/lab@v5.0.0-alpha.7` - -- [Alert] Custom variant (#22218) @mnajdova -- [Pagination] Custom variant (#22220, #22219) @mnajdova -- [Skeleton] Custom variant (#22243) @mnajdova -- [SpeedDial] Add support for uncontrolled open state (#22248) @akharkhonov -- [Timeline] Custom variant (#22244) @mnajdova - -### Docs - -- [docs] Add Design resources in installation (#22209) @oliviertassinari -- [docs] Add Octopus diamond sponsor (#22177) @oliviertassinari -- [docs] Better track usage of icons (#22187) @oliviertassinari -- [docs] Change property/properties to prop/props (#22271) @mbrookes -- [docs] Document TextField helperText height (#22146) @morgan-sam -- [docs] Fix `@global` being considered a class (#22297) @eps1lon -- [docs] Fix a typo on TextField components (#22300) @Renfrew -- [docs] Fix use of removed transition onE\* props (#22286) @mbrookes -- [docs] Improve codesandbox generation logic (#22221) @oliviertassinari -- [docs] Migrate Onepirate to TypeScript (#22295) @rothbart -- [docs] Migrate Dashboard template to TypeScript (#22280) @oliviertassinari -- [docs] Fix minimizing-bundle-size.md (#22298) @Primajin - -### Core - -- [core] Batch small changes (#22183) @oliviertassinari -- [core] Change children to be optional (#22134) @suliskh -- [test] Clear fake timers only in afterEach hook (#22307) @dmtrKovalenko -- [test] Convert initMatchers to TypeScript (#22179) @eps1lon -- [test] Improve toHaveVirtualFocus error message (#22185) @eps1lon -- [test] Lint fix the custom rules plugin for useThemeVariants (#22192) @mnajdova -- [test] Make all tests runnable with React 17 (#22290) @eps1lon -- [test] Prevent swallowing errors during setup (#22196) @eps1lon -- [test] Setup infra for tests in TypeScript (#22195) @eps1lon -- [test] Update react next patch (#22260) @eps1lon - -## 5.0.0-alpha.6 - -_Aug 13, 2020_ - -A big thanks to the 26 contributors who made this release possible. -Here are some highlights ✨: - -- 💅 Introduce a new dynamic variant API (#21648) @mnajdova. - This API allows developers to add new variants on the Material UI's components right from the theme, without having to wrap the components. - For instance with the Button: - - ```tsx - // Define the style that should be applied, for specific props. - const theme = createMuiTheme({ - variants: { - MuiButton: [ - { - props: { variant: 'dashed', color: 'secondary' }, - styles: { - border: `4px dashed ${red[500]}`, - }, - }, - ], - }, - }); - - // Retain type safety. - declare module '@material-ui/core/Button/Button' { - interface ButtonPropsVariantOverrides { - dashed: true; - } - } - - // Enjoy! - <Button variant="dashed" />; - ``` - - More details in [the documentation](https://mui.com/material-ui/customization/components/#adding-new-component-variants) and [RFC](#21749). - -- 👮 Add documentation for the [FocusTrap](https://mui.com/base-ui/react-focus-trap/) component (#22062) @oliviertassinari. -- ⚛️ Prepare support for React v17 (#22093, #22105, #22143, #22111) @eps1lon. -- 🚧 We have undertaken breaking changes. - -### `@material-ui/core@v5.0.0-alpha.6` - -#### Breaking changes - -- [Avatar] Rename variant circle -> circular for consistency (#22015) @kodai3 - Rename `circle` to `circular` for consistency. The possible values should be adjectives, not nouns: - - ```diff - -<Avatar variant="circle"> - +<Avatar variant="circular"> - ``` - -- [Badge] Rename overlap circle -> circular and rectangle -> rectangular for consistency (#22050) @kodai3 - Rename `circle` to `circular` and `rectangle` to `rectangular` for consistency. The possible values should be adjectives, not nouns: - - ```diff - -<Badge overlap="circle"> - -<Badge overlap="rectangle"> - +<Badge overlap="circular"> - +<Badge overlap="rectangular"> - ``` - -- [CircularProgress] Remove static variant, simplify determinate (#22060) @mbrookes - The `static` variant has been merged into the `determinate` variant, with the latter assuming the appearance of the former. - The removed variant was rarely useful. It was an exception to Material Design, and was removed from the specification. - - ```diff - -<CircularProgress variant="determinate" /> - ``` - - ```diff - -<CircularProgress variant="static" classes={{ static: 'className' }} /> - +<CircularProgress variant="determinate" classes={{ determinate: 'className' }} /> - ``` - -- [Dialog] Remove transition onX props (#22113) @mbrookes - The onE\* transition props were removed. Use TransitionProps instead. - - ```diff - <Dialog - - onEnter={onEnter} - - onEntered={onEntered}, - - onEntering={onEntered}, - - onExit={onEntered}, - - onExited={onEntered}, - - onExiting={onEntered} - + TransitionProps={{ - + onEnter, - + onEntered, - + onEntering, - + onExit, - + onExited, - + onExiting, - + }} - /> - ``` - -- [Fab] Rename round -> circular for consistency (#21903) @kodai3 - Rename `round` to `circular` for consistency. The possible values should be adjectives, not nouns: - - ```diff - -<Fab variant="round"> - +<Fab variant="circular"> - ``` - -- [List] Improve hover/select/focus UI display (#21930) @joshwooding -- [Pagination] Rename round -> circular for consistency (#22009) @kodai3 - Rename `round` to `circular` for consistency. The possible values should be adjectives, not nouns: - - ```diff - -<Pagination shape="round"> - -<PaginationItem shape="round"> - +<Pagination shape="circular"> - +<PaginationItem shape="circular"> - ``` - -- [RootRef] Remove component (#21974) @eps1lon - This component was removed. You can get a reference to the underlying DOM node of our components via `ref` prop. - The component relied on [`ReactDOM.findDOMNode`](https://legacy.reactjs.org/docs/react-dom.html#finddomnode) which is [deprecated in `React.StrictMode`](https://legacy.reactjs.org/docs/strict-mode.html#warning-about-deprecated-finddomnode-usage). - - ```diff - -<RootRef rootRef={ref}> - - <Button /> - -</RootRef> - +<Button ref={ref} /> - ``` - -- [Snackbar] Change the default position on desktop (#21980) @kodai3 - The notification now displays at the bottom left on large screens. - It better matches the behavior of Gmail, Google Keep, material.io, etc. - You can restore the previous behavior with: - - ```diff - -<Snackbar /> - +<Snackbar anchorOrigin={{ vertical: 'bottom', horizontal: 'center' }} /> - ``` - -- [Snackbar] Remove transition onX props (#22107) @mbrookes - The onE\* transition props were removed. Use TransitionProps instead. - - ```diff - <Snackbar - - onEnter={onEnter} - - onEntered={onEntered}, - - onEntering={onEntered}, - - onExit={onEntered}, - - onExited={onEntered}, - - onExiting={onEntered} - + TransitionProps={{ - + onEnter, - + onEntered, - + onEntering, - + onExit, - + onExited, - + onExiting, - + }} - /> - ``` - -- [TextareaAutosize] Rename rowsMax->maxRows & rowsMin->minRows (#21873) @mhayk - Rename `rowsMin`/`rowsMax` prop with `mi Rows`/`maxRows` for consistency with HTML attributes. - - ```diff - -<TextField rowsMax={6}> - -<TextareAutosize rowsMin={1}> - -<TextareAutosize rowsMax={6}> - +<TextField maxRows={6}> - +<TextareAutosize minRows={1}> - +<TextareAutosize maxRows={6}> - ``` - -- [TextField] Better isolate static textarea behavior to dynamic one (#21995) @AxartInc - Better isolate the fixed textarea height behavior to the dynamic one. - You need to use the `rowsMin` prop in the following case: - - ```diff - -<TextField rows={2} rowsMax={5} /> - +<TextField rowsMin={2} rowsMax={5} /> - ``` - - Remove the `rows` prop, use the `rowsMin` prop instead. - This change aims to clarify the behavior of the prop. - - ```diff - -<TextareaAutosize rows={2} /> - +<TextareaAutosize rowsMin={2} /> - ``` - -- [theme] Remove theme.mixins.gutters (#22109) @joshwooding - The abstraction hasn't proven to be used frequently enough to be valuable. - - ```diff - -theme.mixins.gutters(), - +paddingLeft: theme.spacing(2), - +paddingRight: theme.spacing(2), - +[theme.breakpoints.up('sm')]: { - + paddingLeft: theme.spacing(3), - + paddingRight: theme.spacing(3), - +}, - ``` - -#### Changes - -- [Avatar] Custom variant (#22139) @mnajdova -- [Badge] Add missing class key (#22095) @kodai3 -- [Badge] Custom variant (#22140) @mnajdova -- [Button] Improved variant type names & cleanup tests (#22010) @mnajdova -- [ButtonBase] Forward type to other components than 'button' (#22172) @eps1lon -- [ButtonGroup] Custom variant (#22160) @mnajdova -- [Chip] Custom variant (#22161) @mnajdova -- [CssBaseline] Add text size adjust property (#22089) @Tolsee -- [l10n] Add Greek (el-GR) locale (#21988) @tmanolat -- [Table] Cell small's right padding is bigger than medium (#22017) @adamlaurencik -- [FocusTrap] Add documentation (#22062) @oliviertassinari -- [Typography] Add custom variants support (#22006) @mnajdova -- [useIsFocusVisible] Remove focus-visible if focus is re-targetted (#22102) @eps1lon -- [core] Fix various potential issues with multiple windows (#22159) @scottander -- [core] Improve hook dependencies in useControlled.js (#21977) @roth1002 - -### `@material-ui/lab@v5.0.0-alpha.6` - -#### Breaking changes - -- [Skeleton] Rename variant circle -> circular and rect -> rectangular for consistency (#22053) @kodai3 - Rename `circle` to `circular` and `rect` to `rectangular` for consistency. The possible values should be adjectives, not nouns: - - ```diff - -<Skeleton variant="circle"> - -<Skeleton variant="rect"> - +<Skeleton variant="circular"> - +<Skeleton variant="rectangular"> - ``` - -#### Changes - -- [Autocomplete] Add support for "{label: string}" data type as a default for "options" (#21992) @DanailH -- [TreeView] Add disabled prop (#20133) @netochaves -- [TreeView] Simplify focus logic (#22098) @eps1lon -- [TreeView] Test current behavior of active item removal (#21720) @eps1lon -- [TreeView] Test selection behavior (#21901) @joshwooding - -### `@material-ui/system@v5.0.0-alpha.6` - -- [core] Bump csstype to 3.0.0 (#22048) @eps1lon - -### Docs - -- [docs] Add 'size' prop to ToggleButton API docs (#22052) @zenje -- [docs] Add ClassKeys migration description for Renaming API (#22061) @kodai3 -- [docs] Add a label to the TreeView demos (#21900) @joshwooding -- [docs] Add missing JSDoc for various props (#22005) @eps1lon -- [docs] Add the services that support MUI in readme (#22137) @naineet -- [docs] Add trailingSlash: true (#22008) @oliviertassinari -- [docs] Add visibility to TypeScript examples (#22013) @esemeniuc -- [docs] Avoid using any type in Tabs examples (#22091) @tacigar -- [docs] Bump next to 9.5.0 (#21975) @eps1lon -- [docs] Disallow undefined array members at runtime where they're unexpected (#21990) @eps1lon -- [docs] Improve Autocomplete GitHub demo (#22153) @aquibbaig -- [docs] Improve draggable dialog demo wording (#22021) @Sanskar95 -- [docs] Improve transition props API descriptions (#21952) @maksimgm -- [docs] Port buildApi to TypeScript (#22055) @eps1lon -- [docs] Update build instructions for component API (#21970) @eps1lon -- [docs] Update grouped instruction of autocomplete (#22056) @yfng96 -- [docs] Use `import * as React from 'react';` (#22058) @mbrookes -- [docs] Use pickers v4 (#22023) @eps1lon - -### Core - -- [core] Allow running prettier from material-ui-x (#22071) @oliviertassinari -- [core] Bump csstype to 3.0.0 (#22048) @eps1lon -- [core] Fix next and prevent future regressions (#22135) @eps1lon -- [core] Improve merge-conflict label automation (#22065) @eps1lon -- [core] Lint cleanup (#21972) @eps1lon -- [core] Resolve all dot-prop versions to 5.x (#22007) @eps1lon -- [core] Small changes (#22020) @oliviertassinari -- [Security] Bump elliptic from 6.5.0 to 6.5.3 (#21997) @dependabot-preview -- [test] Drop css-loader (#21999) @eps1lon -- [test] Lint framer workspace (#22002) @eps1lon -- [test] Lint useThemeVariants with custom rules plugin (#21963) @eps1lon -- [test] Run same tests in coverage and unit (#22092) @eps1lon -- [test] Type-check framerx package (#21868) @eps1lon -- [test] Work on React v17 (#22093, #22105, #22143, #22111) @eps1lon - -## 5.0.0-alpha.5 - -_July 28, 2020_ - -A big thanks to the 18 contributors who made this release possible. - -### `@material-ui/core@v5.0.0-alpha.5` - -#### Breaking changes - -- [Grid] Rename justify prop to justifyContent (#21845) @mnajdova - - Rename `justify` prop with `justifyContent` to be aligned with the CSS property name. - - ```diff - -<Grid justify="center"> - +<Grid justifyContent="center"> - ``` - -#### Changes - -- [Accordion] Add new classes key (#21920) @natac13 -- [Accordion] Fix IconButtonProps spreading logic (#21850) @kgregory -- [Avatar] Fix group size (#21896) @natac13 -- [Button] Custom variant (#21648) @mnajdova -- [CssBaseline] Export ScopedCssBaseline from barrel index (#21869) @mherczeg -- [Dialog] Fix body scrollbar close behavior (#21951) @maksimgm -- [Icon] Hide name placeholder while "Material Icons" font is loading (#21950) @maksimgm -- [Select] Ensure that onChange is called before onClose (#21878) @DanailH -- [Slider] Make `index` public in the ValueLabel props (#21932) @govardhan-srinivas - -### `@material-ui/lab@v5.0.0-alpha.5` - -- [TreeView] Change focus management to aria-activedescendant (#21695) @joshwooding -- [TreeView] Fix crash when shift clicking a clean tree (#21899) @joshwooding - -### Framer - -- [framer] Refactor as switch (#21885) @mhkasif -- [framer] Update with latest sources (#21888) @eps1lon - -### Docs - -- [blog] Q2 2020 Update (#21822) @oliviertassinari -- [docs] Add expand all and select all to controlled tree demo (#21929) @joshwooding -- [docs] Add useRadioGroup section (#21910) @kodai3 -- [docs] Autocomplete is not showing options even though they exist (#21949) @maksimgm -- [docs] Change the destination branch for PRs (#21870) @DanailH -- [docs] Fix Skeleton inline example (#21918) @ppecheux -- [docs] Fix custom Snackbar width on mobile (#21948) @ruhci28 -- [docs] Fix the type of the second argument of 'createMuiTheme' function (#21859) @DanailH -- [docs] Improve ad display @oliviertassinari -- [docs] Improve documentation of theme.breakpoints (#21922) @ruhci28 -- [docs] Link react-hook-form (#21886) @jeffshek -- [docs] Mention @MuiContrib in CONTRIBUTING (#21891) @eps1lon -- [docs] Replace latests tags with next in the codesandbox (#21851) @mnajdova -- [docs] Update gold sponsor to Text-Em-All (formerly Call-Em-All) (#21897) @jonmiller0 -- [docs] Update testing guide (#21863) @eps1lon - -### Core - -- [test] Enable more StrictMode tests (#21817) @eps1lon -- [test] Lint internal typescript-to-proptypes fork (#21876) @eps1lon -- [test] Pass didWarnControlledToUncontrolled between tests (#21875) @eps1lon -- [test] Unify import to `test/utils (#21856) @eps1lon -- [core] Add warnings where ref-forwarding components/elements are required (#21883) @eps1lon -- [core] Automatically tweet about good first issues (#21879) @eps1lon -- [core] Batch small changes (#21928) @oliviertassinari -- [core] Remove /test-utils (#21855) @eps1lon -- [core] Throw on unused `typescript-to-proptypes-ignore` directives (#21867) @eps1lon - -## 5.0.0-alpha.4 - -_July 19, 2020_ - -A big thanks to the 11 contributors who made this release possible. - -### `@material-ui/core@v5.0.0-alpha.4` - -#### Breaking changes - -- [core] Drop support for non-ref-forwarding class components (#21811) @eps1lon - Support for non-ref-forwarding class components in the `component` prop or as an immediate `children` has been dropped. If you were using `unstable_createStrictModeTheme` or didn't see any warnings related to `findDOMNode` in `React.StrictMode` then you don't need to do anything. - Otherwise check out the ["Caveat with refs" section in our composition guide](/guides/composition/#caveat-with-refs) to find out how to migrate. - This change affects almost all components where you're using the `component` prop or passing `children` to components that require `children` to be elements (for example `<MenuList><CustomMenuItem /></MenuList>`) -- [Stepper] Use context API (#21613) @baterson - Rely on the context over the `React.cloneElement()` API. - This change makes composition easier. - -### `@material-ui/icons@v5.0.0-alpha.4` - -- [icons] Add Google brand icon (#21807) @bmg02 - -### Docs - -- [docs] Break up Select demos (#21792) @cjoecker -- [docs] Change RMUIF info to new version (#21812) @phoqe -- [docs] Fix Spanish translation (#21800) @adamsr123 -- [docs] Fix nav color (#21780) @mbrookes -- [docs] Update advanced-de.md (#21786) @jasonericdavis - -### Core - -- [core] Allow dist tag as argv in use-react-dist-tag (#21810) @eps1lon -- [core] Drop support for non-ref-forwarding class components (#21811) @eps1lon -- [core] Lint with typescript-eslint parser (#21758) @oliviertassinari -- [core] One label is enough @oliviertassinari -- [core] Remove lint:fix command @oliviertassinari -- [test] Enable "missing act()"-warnings (#21802) @eps1lon -- [test] Improve stack trace for unexpected errors (#21818) @eps1lon -- [test] Update react next patch (#21746) @eps1lon -- [test] Use testing-library in withStyles (#21804) @eps1lon - -## 5.0.0-alpha.3 - -_July 12, 2020_ - -A big thanks to the 14 contributors who made this release possible. - -### `@material-ui/core@v5.0.0-alpha.3` - -- [Avatar] Avoid usage of z-index (#21685) @nvdai2401 -- [GridList] Fix crash when loading images (#21741) @paradoxxxzero -- [List] Fix secondary action position when disableGutters={true} (#21732) @kgregory -- [TablePagination] Fix broken labelling if SelectProps provided ids (#21703) @eps1lon -- [theme] Fix custom breakpoint in CSS Media Queries (#21759) @nkrivous -- [FocusTrap] Fix disableAutoFocus prop (#21612) @oliviertassinari - -### `@material-ui/lab@v5.0.0-alpha.3` - -- [lab] Fix TypeScript theme overrides support (#21724) @cjoecker -- [Autocomplete] Fail form validation if required is filled when `multiple` (#21692, #21670) @weslenng, @eps1lon - -### Docs - -- [examples] Include troubleshooting for next.js (#21683) @ocavue -- [docs] Add ethicalads.io (#21752) @oliviertassinari -- [docs] Apply small fixes (#21754) @jaironalves -- [docs] Batch small changes (#21669) @oliviertassinari -- [docs] Bump next to 9.4.4 (#21690) @eps1lon -- [docs] Fix custom switch ripple color (#21729) @xanderoku -- [docs] Fix text from showcase (#21755) @cjoecker -- [docs] Improve customized timeline demo (#21739) @mageprincess -- [docs] Move more prop docs into IntelliSense (#21659) @eps1lon -- [docs] Move more prop docs into IntelliSense (#21687) @eps1lon -- [docs] Recommend default branch (#21719) @eps1lon -- [docs] Remove `@document` directive from IntelliSense (#21688) @eps1lon -- [docs] Track web-vitals (#21702) @eps1lon - -### Core - -- [test] Allow container + hydrate in render (#21747) @eps1lon -- [test] Bump url-loader (#21689) @eps1lon -- [test] Restore clock between each test (#21760) @eps1lon -- [test] Run lab unit tests in browser (#21691) @eps1lon -- [core] Allow generating markdown api docs for subset of components (#21731) @eps1lon -- [core] Batch small changes (#21756) @oliviertassinari -- [core] Don't bail out early if docs:api fails (#21726) @eps1lon -- [core] Remove dead code from docs:api (#21730) @eps1lon -- [core] Simplify debounce (#21666) @NMinhNguyen -- [core] Use common yarn version (#21779) @eps1lon - -## 5.0.0-alpha.2 - -_July 4, 2020_ - -A big thanks to the 16 contributors who made this release possible. - -### `@material-ui/core@v5.0.0-alpha.2` - -#### Breaking changes - -- [Button] Make primary the default color (#21594) @mbrookes - The button `color` prop is now "primary" by default, and "default" has been removed. This makes the button closer to the Material Design specification and simplifies the API. - - ```diff - -<Button color="default" /> - -<Button color="primary" /> - +<Button /> - +<Button /> - ``` - -- [ExpansionPanel] Remove component (#21630) @mnajdova - This completes our effort on renaming the ExpansionPanel component Accordion -- [Collapse] Add orientation and horizontal support (#20619) @darkowic - The `collapsedHeight` prop was renamed `collapsedSize` to support the horizontal direction. - - ```diff - -<Collapse collapsedHeight={40}> - +<Collapse collapsedSize={40}> - ``` - -#### Changes - -- [Card] Fix vertically center header action (#21646) @kgregory -- [l10n] Update cs-CZ and sk-SK locales (#21656) @char0n -- [l10n] Update sv-SE locale (#21631) @tbz -- [Menu] Remove overflow style in MenuItem (#21644) @tj3407 -- [MenuItem] Add types for ListItemClasses (#21654) @eps1lon -- [Slider] Fix cannot read property 'focus' of null (#21653) @mageprincess -- [TextField] Fix CSS isolation issue (#21665) @Codetalker777 -- [FocusTrap] Fix portal support (#21610) @mnajdova -- [TypeScript] Fix version support (#21640) @jakubfiglak - -### `@material-ui/lab@v5.0.0-alpha.2` - -- [TreeView] Improve node registration and fix other issues (#21574) @joshwooding - -### Docs - -- [blog] Post survey results 2020 (#21555) @mnajdova -- [docs] Add new showcase (#21637) @cjoecker -- [docs] CodeFund is shutting down (#21632) @oliviertassinari -- [docs] Document next version (#21591) @oliviertassinari -- [docs] Enable docs search on v5.0.0 & fix duplicate on master @oliviertassinari -- [docs] Fix ad issues @oliviertassinari -- [docs] Move more prop docs into IntelliSense (#21655) @eps1lon -- [docs] Remove in-context translation code & files (#21633) @mbrookes -- [example] Remove dead dependency from next-typescript (#21628) @StefanWerW - -### Core - -- [test] Add toWarnDev() and toErrorDev() matcher (#21581) @eps1lon - -## 5.0.0-alpha.1 - -_June 27, 2020_ - -A big thanks to the 33 contributors who made this release possible. Here are some highlights ✨: - -- 🔄 Introduce a new `LoadingButton` component in the lab (#21389) @mnajdova. -- 📍 Synchronize icons with Google, add 200 new icons (#21498) @alecananian -- 💥 Start working on breaking changes. - -### `@material-ui/core@v5.0.0-alpha.1` - -#### Breaking changes - -- [Divider] Use border instead of background color (#18965) @mikejav. - It prevents inconsistent height on scaled screens. For people customizing the color of the border, the change requires changing the override CSS property: - - ```diff - .MuiDivider-root { - - background-color: #f00; - + border-color: #f00; - } - ``` - -- [Rating] Rename `visuallyhidden` to `visuallyHidden` for consistency (#21413) @mnajdova. - - ```diff - <Rating - classes={{ - - visuallyhidden: 'custom-visually-hidden-classname', - + visuallyHidden: 'custom-visually-hidden-classname', - }} - /> - ``` - -- [Typography] Replace the `srOnly` prop so as to not duplicate the capabilities of [System](https://mui.com/system/getting-started/) (#21413) @mnajdova. - - ```diff - -import Typography from '@material-ui/core/Typography'; - +import { visuallyHidden } from '@material-ui/utils'; - +import styled from 'styled-component'; - - +const Span = styled('span')(visuallyHidden); - - -<Typography variant="srOnly">Create a user</Typography> - +<Span>Create a user</Span> - ``` - -- [TablePagination] Add showFirstButton and showLastButton support (#20750) @ShahAnuj2610. - The customization of the table pagination's actions labels must be done with the `getItemAriaLabel` prop. This increases consistency with the `Pagination` component. - - ```diff - <TablePagination - - backIconButtonText="Avant" - - nextIconButtonText="Après - + getItemAriaLabel={…} - ``` - -- [ExpansionPanel] Rename to Accordion (#21494) @mnajdova. - Use a more common the naming convention: - - ```diff - -import ExpansionPanel from '@material-ui/core/ExpansionPanel'; - -import ExpansionPanelSummary from '@material-ui/core/ExpansionPanelSummary'; - -import ExpansionPanelDetails from '@material-ui/core/ExpansionPanelDetails'; - -import ExpansionPanelActions from '@material-ui/core/ExpansionPanelActions'; - +import Accordion from '@material-ui/core/Accordion'; - +import AccordionSummary from '@material-ui/core/AccordionSummary'; - +import AccordionDetails from '@material-ui/core/AccordionDetails'; - +import AccordionActions from '@material-ui/core/AccordionActions'; - - -<ExpansionPanel> - +<Accordion> - - <ExpansionPanelSummary> - + <AccordionSummary> - <Typography>Location</Typography> - <Typography>Select trip destination</Typography> - - </ExpansionPanelSummary> - + </AccordionSummary> - - <ExpansionPanelDetails> - + <AccordionDetails> - <Chip label="Barbados" onDelete={() => {}} /> - <Typography variant="caption">Select your destination of choice</Typography> - - </ExpansionPanelDetails> - + </AccordionDetails> - <Divider /> - - <ExpansionPanelActions> - + <AccordionActions> - <Button size="small">Cancel</Button> - <Button size="small" color="primary">Save</Button> - - </ExpansionPanelActions> - + </AccordionActions> - -</ExpansionPanel> - +</Accordion> - ``` - -- [BottomNavigation] TypeScript: The `event` in `onChange` is no longer typed as a `React.ChangeEvent` but `React.SyntheticEvent`. - - ```diff - -<BottomNavigation onChange={(event: React.ChangeEvent<{}>) => {}} /> - +<BottomNavigation onChange={(event: React.SyntheticEvent) => {}} /> - ``` - -- [Slider] TypeScript: The `event` in `onChange` is no longer typed as a `React.ChangeEvent` but `React.SyntheticEvent`. - - ```diff - -<Slider onChange={(event: React.ChangeEvent<{}>, value: unknown) => {}} /> - +<Slider onChange={(event: React.SyntheticEvent, value: unknown) => {}} /> - ``` - -- [Tabs] TypeScript: The `event` in `onChange` is no longer typed as a `React.ChangeEvent` but `React.SyntheticEvent`. - - ```diff - -<Tabs onChange={(event: React.ChangeEvent<{}>, value: unknown) => {}} /> - +<Tabs onChange={(event: React.SyntheticEvent, value: unknown) => {}} /> - ``` - -- [Accordion] TypeScript: The `event` in `onChange` is no longer typed as a `React.ChangeEvent` but `React.SyntheticEvent`. - - ```diff - -<Accordion onChange={(event: React.ChangeEvent<{}>, expanded: boolean) => {}} /> - +<Accordion onChange={(event: React.SyntheticEvent, expanded: boolean) => {}} /> - ``` - -#### Changes - -- [Badge] Fix transition flicker (#21557) @mnajdova -- [ButtonGroup] Improve contained hover style (#21532) @alecananian -- [l10n] Improve Russian translation (#21480) @AntonLukichev -- [l10n] Improve zh-CN, add zh-TW (#21493) @Jack-Works -- [LinearProgress] High frequency updates (#21416) @dnicerio -- [Stepper] Fix optional label alignment (#21420) @curtislin7 -- [Table] Move prop docs into IntelliSense (#21530) @oliviertassinari -- [TablePagination] Add showFirstButton and showLastButton support (#20750) @ShahAnuj2610 -- [Tabs] Fix useCallback missing arguments (#21471) @KitsonBroadhurst -- [TextField] Fix FilledInput disable hover style when disabled (#21457) @tchmnn - -### `@material-ui/lab@v5.0.0-alpha.1` - -- [Autocomplete] Fix support for renderTags={() => null} (#21460) @matthenschke -- [LoadingButton] Introduce new component (#21389) @mnajdova -- [Pagination] Fix display when boundaryCount={0} (#21446) @guimacrf -- [Skeleton] Fix text border (#21543) @el1f -- [Timeline] Align dots with content (#21402) @mnajdova -- [TreeView] Minor styling changes (#21573) @joshwooding -- [TreeView] Simplify customization (#21514) @joshwooding - -### `@material-ui/icons@v5.0.0-alpha.1` - -- [icons] Synchronize icons with Google (#21498) @alecananian - -### `@material-ui/system@v5.0.0-alpha.1` - -- [system] Introduce visuallyHidden style utility (#21413) @mnajdova - -### Docs - -- [docs] Add CSP support section to docs (#21479) @razor-x -- [docs] Add explicit example for extending existing palette colors (#21458) @BennyHinrichs -- [docs] Add more details about breakpoint widths (#21545) @Muzietto -- [docs] Add new gold sponsor @oliviertassinari -- [docs] Add transitions customization page (#21456) @mnajdova -- [docs] Correct syntax errors to improve document readability (#21515) @AGDholo -- [docs] Document type="number" limitation (#21500) @IwalkAlone -- [docs] Entry for translations and fix grammar error (#21478) @jaironalves -- [docs] Fix broken "customization" anchor link (#21506) @connorads -- [docs] Fix typo in MultipleSelects.js (#21510) @ShiyuCheng2018 -- [docs] Fix typo in SpeedDialIcon classes comment (#21398) @zachbradshaw -- [docs] Fix typo in TextField required prop (#21538) @HumbertoL -- [docs] Fix version in localized urls (#21442) @tchmnn -- [docs] Format english markdown files (#21463) @eps1lon -- [docs] Format some previously unformatted, untranslated files (#21558) @eps1lon -- [docs] Hide duplicate table borders (#20809) @marcosvega91 -- [docs] Improve docs for useMediaQuery and breakpoint (#21512) @DDDDDanica -- [docs] Improve npm homepage links (#21452) @eps1lon -- [docs] Move more prop docs into IntelliSense (#21383) @eps1lon -- [docs] Restrict docs markdown and demos to 80ch (#21481) @eps1lon -- [docs] Reword palette intention and fix format (#21477) @DDDDDanica -- [docs] Update v4 migration guide (#21462) @eps1lon - -### Core - -- [typescript-to-proptypes] Integrate into monorepo @eps1lon -- [test] Add type test CardHeader title component (#21590) @eps1lon -- [test] Fix type tests not being type checked (#21539) @eps1lon -- [test] Ignore empty vrtests (#21450) @eps1lon -- [test] Improve makeStyles error coverage (#21568) @eps1lon -- [test] Migrate Typography to testing-library (#21534) @marcosvega91 -- [test] Move size comparison details to separate page (#21504) @eps1lon -- [test] Use testing-library in MenuItem (#21391) @eps1lon -- [test] Use testing-library in StepButton (#21406) @baterson -- [test] Use testing-library in Stepper (#21400) @baterson -- [core] Batch small changes (#21419) @oliviertassinari -- [core] Batch small changes (#21553) @oliviertassinari -- [core] Disable caching for yarn proptypes permanently (#21414) @eps1lon -- [core] Extend env for build script (#21403) @eps1lon -- [core] Fix react next patch and prevent regression (#21495) @eps1lon -- [core] Fork typescript-to-proptypes (#21497) @eps1lon -- [core] Misc branch cleaning (#21459) @eps1lon -- [core] Misc prettier changes (#21484) @eps1lon -- [core] Run prettier on the JSON sources (#21556) @oliviertassinari -- [core] Type custom `onChange` implementations with a generic react event (#21552) @eps1lon - ## Older versions -Changes before 5.x are listed in our [changelog for older versions](https://github.com/mui/material-ui/blob/HEAD/CHANGELOG.old.md). +Changes before 6.x are listed in our [changelog for older versions](https://github.com/mui/material-ui/blob/HEAD/CHANGELOG.old.md). diff --git a/CHANGELOG.old.md b/CHANGELOG.old.md index ddbd9289c9c644..b1d43653b44cd9 100644 --- a/CHANGELOG.old.md +++ b/CHANGELOG.old.md @@ -1,9 +1,15200 @@ -<!-- markdownlint-capture --> -<!-- markdownlint-disable --> +## 5.16.7 + +<!-- generated comparing v5.16.6..master --> + +_Aug 9, 2024_ + +A big thanks to the 3 contributors who made this release possible. + +### `@mui/material@5.16.7` + +- ​<!-- 3 -->[material-ui][mui-system] Add support for version runtime checks (#43233) @DiegoAndai + +### Docs + +- ​<!-- 4 -->[docs] Fix 301 @oliviertassinari + +### Core + +- ​<!-- 2 -->[website] Fix wrong link in pricing table (@zanivan) (#43143) @zanivan +- ​<!-- 1 -->[website] Add blog link to pricing table (@zanivan) (#43140) @zanivan + +All contributors of this release in alphabetical order: @DiegoAndai, @oliviertassinari, @zanivan + +## 5.16.6 + +<!-- generated comparing v5.16.5..master --> + +_Jul 30, 2024_ + +A big thanks to the 5 contributors who made this release possible. + +### `@mui/material@5.16.6` + +- [Divider] Enable borderStyle enhancement in divider with children (#43059) @anuujj + +### Docs + +- [material-ui][Card] Update CardMedia description (#43121) @shahzaibdev1 +- [material-ui] Replace deprecated `<ListItem button/>` with `ListItemButton` component in routing libraries list example (#43114) @aliharis99 +- [material-ui][Snackbar] Improve close `reason` type in demos (#43105) @sai6855 + +### Core + +- [code-infra] Use the same CI names on master & next (#43064) @mnajdova + +All contributors of this release in alphabetical order: @aliharis99, @anuujj, @mnajdova, @sai6855, @shahzaibdev1 + +## 5.16.5 + +<!-- generated comparing v5.16.4..master --> + +_Jul 25, 2024_ + +A big thanks to the 4 contributors who made this release possible. + +### `@mui/utils@5.16.5` + +- ​<!-- 1 -->[utils] Add dependency to @mui/types (@mnajdova) (#43047) @mnajdova + +### Docs + +- ​<!-- 4 -->[material-ui][joy-ui][Autocomplete] Fix `Hint` demo (@ManthanGajjar) (#43039) @ManthanGajjar +- ​<!-- 3 -->Fix CHANGELOG convention @oliviertassinari +- ​<!-- 2 -->[material-ui] Fix broken image links in blog template on master branch (#42969) @navedqb + +All contributors of this release in alphabetical order: @ManthanGajjar, @mnajdova, @navedqb, @oliviertassinari + +## 5.16.4 + +<!-- generated comparing v5.16.3..master --> + +_Jul 16, 2024_ + +A big thanks to the 1 contributor who made this release possible. + +### `@mui/material@5.16.4` + +- ​<!-- 1 -->Fix wrong import in Popover types (#42967) @mnajdova + +All contributors of this release in alphabetical order: @mnajdova + +## 5.16.3 + +<!-- generated comparing v5.16.2..master --> + +_Jul 16, 2024_ + +A big thanks to the 3 contributors who made this release possible. + +### `@mui/material@5.16.3` + +- ​<!-- 1 -->[material] Add missing dependency (#42959) @mnajdova + +### Docs + +- ​<!-- 3 -->[material-ui][Autocomplete] Add instructions about `autosuggest-highlight` dependency (#42953) @HoFa1997 +- ​<!-- 2 -->Move feedback from Canny to GitHub @oliviertassinari + +All contributors of this release in alphabetical order: @HoFa1997, @mnajdova, @oliviertassinari + +## 5.16.2 + +<!-- generated comparing v5.16.1..master --> + +_Jul 16, 2024_ + +A big thanks to the 2 contributors who made this release possible. + +### `@mui/material@5.16.2` + +- ​<!-- 2 -->[material] Remove dependency to @mui/base (@mnajdova) (#42917) @mnajdova + +### Core + +- ​<!-- 1 -->[website] Sync /about page @oliviertassinari + +All contributors of this release in alphabetical order: @mnajdova, @oliviertassinari + +## 5.16.1 + +_Jul 11, 2024_ + +A big thanks to the 4 contributors who made this release possible. Here are some highlights ✨: + +- ⚛️ All packages, including Material UI, are now compatible with React 18.3.1 + +### `@mui/material@5.16.1` + +- [AppBar] Fix inherit color is inconsistent between ThemeProvider and CssVarsProvider (#42713) @ZeeshanTamboli + +### `@mui/joy@5.0.0-beta.48` + +- [Autocomplete] Fix React spread key warning (#42856) @aarongarciah + +### Docs + +- [material-ui] Fix React 18.3 key spread warnings in Autocomplete demos (#42854) @aarongarciah +- [material-ui] Fix type error in virtualized table demo (#42852) @aarongarciah +- Fix typos (@omahs) (#42888) @omahs +- Fix 301 @oliviertassinari + +### Core + +- [core] Bump React to 18.3.1 (#42846) @aarongarciah +- [core] Remove react-test-renderer (#42853) @aarongarciah +- [core] Replace enzyme in describeConformance (#42847) @aarongarciah +- [test] Remove enzyme (#42850) @aarongarciah +- [test] Remove createMount test util (#42849) @aarongarciah +- [base-ui] Fix React spread key warning in test (#42855) @aarongarciah +- [styles][withStyles] Expect React defaultProps warning in test (#42752) (#42851) @aarongarciah + +All contributors of this release in alphabetical order: @aarongarciah, @oliviertassinari, @omahs, @ZeeshanTamboli + +## 5.16.0 + +<!-- generated comparing v5.15.21..master --> + +_Jul 5, 2024_ + +A big thanks to the 5 contributors who made this release possible. Here are some highlights ✨: + +- 🚀 Added `InitColorSchemeScript` for Next.js App Router (#42829) @siriwatknp + +### `@mui/material@5.16.0` + +- [Alert] Add ability to override slot props (@alexey-kozlenkov) (#42808) @alexey-kozlenkov +- Add `InitColorSchemeScript` for Next.js App Router (#42829) @siriwatknp +- Add `DefaultPropsProvider` (#42820) @siriwatknp +- Support `CssVarsTheme` in `responsiveFontSizes` return type (@jxdp) (#42806) @jxdp +- Remove warning from `getInitColorSchemeScript` (#42838) @siriwatknp + +### Docs + +- [docs] Fix 301 MDN redirections @oliviertassinari + +### Core + +- [mui-utils][test] Remove usages of deprecated react-dom APIs (@aarongarciah) (#42813) @aarongarciah + +All contributors of this release in alphabetical order: @aarongarciah, @alexey-kozlenkov, @jxdp, @oliviertassinari, @siriwatknp + +## 5.15.21 + +<!-- generated comparing v5.15.20..master --> + +_Jun 28, 2024_ + +A big thanks to the 7 contributors who made this release possible. + +### `@mui/material@5.15.21` + +- [Autocomplete] Fix renderOption props type (@DiegoAndai) (#42709) @DiegoAndai +- [Stepper] Generate class for `nonLinear` prop (@alexismo) (#42677) @alexismo + +### Docs + +- Use new email for sponsoring @oliviertassinari +- Fix 301 links (@alexfauquette) (#42700) @alexfauquette +- [material-ui][Select] Fix the `SelectAutoWidth` demo menu item value (@Danielkhakbaz) (#42696) @Danielkhakbaz +- [material-ui][Autocomplete] Fix more React 18.3 key spread warnings in demos (#42766) @wbt +- [material-ui] Fix sign in side image (#42708) @zanivan +- [website] Add Ale to team (#42769) @alelthomas + +### Core + +- [core] Cherry pick pnpm updates (#42763) @DiegoAndai +- [website] Add Armin to the team members (@arminmeh) (#42681) @arminmeh +- [website] Open Staff Engineer role for Pigment CSS (@mnajdova) (#42669) @mnajdova + +All contributors of this release in alphabetical order: @alexfauquette, @alexismo, @arminmeh, @Danielkhakbaz, @DiegoAndai, @mnajdova, @oliviertassinari + +## 5.15.20 + +<!-- generated comparing v5.15.19..master --> + +_Jun 12, 2024_ + +A big thanks to the 9 contributors who made this release possible. + +### `@mui/material@5.15.20` + +- ​<!-- 17 -->[Autocomplete] Shouldn't resize when hovering (@ZeeshanTamboli) (#42535) @ZeeshanTamboli +- ​<!-- 07 -->[Tab] Fix applying `iconWrapper` styles from theme and update its description (@sai6855) (#42570) @sai6855 + +### `@mui/utils@5.15.15` + +- ​<!-- 06 -->Allow passing `NaN` as `defaultValue` to `useControlled` (@iammminzzy) (#42571) @iammminzzy +- ​<!-- 17 -->Fix GitHub-reported prototype pollution vulnerability in `deepmerge` (#41652) (#42608) @DiegoAndai + +### Docs + +- ​<!-- 16 -->[docs] Add Pigment CSS and Base UI logos SVGs (#42513) @danilo-leal +- ​<!-- 15 -->[docs] Update twitter.com to x.com @oliviertassinari +- ​<!-- 14 -->[docs] Simplify Example projects page @oliviertassinari +- ​<!-- 13 -->[material-ui] Add docs for complementary stepper components (@anle9650) (#42613) @anle9650 +- ​<!-- 12 -->[docs] Add changelog section to the design kits page (@danilo-leal) (#42463) @danilo-leal +- ​<!-- 11 -->[material-ui] Fix sentence in the All components page (@danilo-leal) (#42462) @danilo-leal +- ​<!-- 10 -->[material-ui] Update Figma design kit doc redirect link (@danilo-leal) (#42456) @danilo-leal +- ​<!-- 09 -->[system] Add "dynamic values" section to sx prop page (@aarongarciah) (#42453) @aarongarciah + +### Core + +- ​<!-- 18 -->[website] Move the `React Engineer - X` role to future roles (#42532) @DanailH +- ​<!-- 08 -->[examples] Remove Pigment CSS examples (#42538) @sai6855 +- ​<!-- 05 -->[website] Close Developer Advocate / Content Engineer role @oliviertassinari +- ​<!-- 04 -->[website] Update DoiT description and link in Sponsors section (@erezstmn-doit) (#42511) @erezstmn-doit +- ​<!-- 03 -->[website] Clean up the docs-infra job ad (@danilo-leal) (#42509) @danilo-leal +- ​<!-- 02 -->[website] Open the Docs-infra engineer role (@danilo-leal) (#42496) @danilo-leal +- ​<!-- 01 -->[website] Fix locationCountry in about page @oliviertassinari + +All contributors of this release in alphabetical order: @aarongarciah, @anle9650, @DanailH, @danilo-leal, @erezstmn-doit, @iammminzzy, @oliviertassinari, @sai6855, @ZeeshanTamboli + +## 5.15.19 + +<!-- generated comparing v5.15.18..master --> + +_May 29, 2024_ + +A big thanks to the 12 contributors who made this release possible. +This release was mostly about 🐛 bug fixes and 📚 documentation improvements. + +### `@mui/material@5.15.19` + +- ​<!-- 19 -->[AlertTitle] Enable extending Typography props (@lucasgmelo) (#42334) @github-actions[bot] +- ​<!-- 06 -->[responsiveFontSizes] Handled undefined variants (@brijeshb42) (#42419) @github-actions[bot] +- ​<!-- 05 -->[Slider] Fix wrong CSS value (@mnajdova) (#42373) @github-actions[bot] + +### Docs + +- ​<!-- 13 -->Link to pnpm installation docs (#42420) @aarongarciah +- ​<!-- 12 -->Remove LocalMonero (@oliviertassinari) (#42315) @github-actions[bot] +- ​<!-- 10 -->[material-ui] Fix typo in style interoperability with Tailwind CSS docs (@ZeeshanTamboli) (#42312) @github-actions[bot] +- ​<!-- 09 -->[material-ui][Pagination] Clarify pagination `page` prop API (@Mandar-Pandya) (#42265) @github-actions[bot] +- ​<!-- 08 -->[material-ui][Tabs] Improve the Basic Tabs demo (@MatheusEli) (#42426) @github-actions[bot] +- ​<!-- 07 -->[pigment-css] Fix duplication of content (#42410) @oliviertassinari + +### Core + +- ​<!-- 18 -->[blog] Add the "Product" tag to the Pigment CSS post (@danilo-leal) (#42366) @github-actions[bot] +- ​<!-- 17 -->[blog] Update blog post OG image (@danilo-leal) (#42306) @github-actions[bot] +- ​<!-- 16 -->[blog] Update Pigment CSS post (@danilo-leal) (#42267) @github-actions[bot] +- ​<!-- 15 -->[core] Fix React 18.3 warnings about spreading keys in the Material UI `Autocomplete` component (#42099) (#42241) @DiegoAndai +- ​<!-- 14 -->[core] Fix a few more key spread issues (@oliviertassinari) (#42318) @github-actions[bot] +- ​<!-- 11 -->[docs-infra] Allow JSDoc tags (#42327) @aarongarciah +- ​<!-- 04 -->[website] Add Nikita to the about page (@nikitaa24) (#42421) @github-actions[bot] +- ​<!-- 03 -->[website] Fix hero spacing changes applying at the wrong breakpoint (@KenanYusuf) (#42357) @github-actions[bot] +- ​<!-- 02 -->[website] Adds Kenan Yusuf to about page (@KenanYusuf) (#42330) @github-actions[bot] +- ​<!-- 01 -->[website] Improve about page @oliviertassinari + +All contributors of this release in alphabetical order: @aarongarciah, @brijeshb42, @danilo-leal, @DiegoAndai, @KenanYusuf, @lucasgmelo, @Mandar-Pandya, @MatheusEli, @mnajdova, @nikitaa24, @oliviertassinari, @ZeeshanTamboli + +## 5.15.18 + +<!-- generated comparing v5.15.17..master --> + +_May 14, 2024_ + +A big thanks to the 5 contributors who made this release possible. Here are some highlights ✨: + +### `@mui/material@5.15.18` + +- ​<!-- 6 -->[Autocomplete] Improve design when there's a start adornment for small autocomplete (@TahaRhidouani) (#42176) @github-actions[bot] +- ​<!-- 3 -->[ToggleButtonGroup] Add missing `selected` class in ToggleButtonGroupClasses type (@tarunrajput) (#42250) @github-actions[bot] + +### Docs + +- ​<!-- 4 -->[docs] Fix 301 to Figma @oliviertassinari + +### Core + +- ​<!-- 5 -->[blog] Introducing Pigment CSS blog post (#42198) (#42255) @samuelsycamore +- ​<!-- 2 -->[website] Add redirection for talk @oliviertassinari +- ​<!-- 1 -->[website] Adds Arthur Balduini team info (@arthurbalduini) (#42226) @github-actions[bot] + +All contributors of this release in alphabetical order: @arthurbalduini, @oliviertassinari, @samuelsycamore, @TahaRhidouani, @tarunrajput + +## 5.15.17 + +<!-- generated comparing v5.15.16..master --> + +_May 8, 2024_ + +A big thanks to the 4 contributors who made this release possible. +This release was mostly about 🐛 bug fixes and 📚 documentation improvements. + +### `@mui/material@5.15.17` + +- [Slider] Move palette styles to the bottom (#41676) @siriwatknp + +### Docs + +- Fix SEO redirection issues @oliviertassinari +- [material-ui] Fix broken link (@aarongarciah) (#42143) @github-actions[bot] +- [material-ui] Fix link on the Sync page (@danilo-leal) (#42089) @github-actions[bot] + +### Core + +- [blog] Shorten title to fit @oliviertassinari +- [blog] Update Sync post OG image (@danilo-leal) (#42117) @github-actions[bot] +- [blog] A few tweaks in introducing-sync-plugin (@oliviertassinari) (#42094) @github-actions[bot] +- [docs-infra] Fix code block layout shift (#41917) @oliviertassinari +- [website] Fix home page slider's track position (@aarongarciah) (#42144) @github-actions[bot] +- [website] Closing the survey @oliviertassinari +- [website] Remove Survey banner from website and Core docs (#42104) @joserodolfofreitas + +All contributors of this release in alphabetical order: @github-actions[bot], @joserodolfofreitas, @oliviertassinari, @siriwatknp + +## 5.15.16 + +<!-- generated comparing v5.15.15..master --> + +_May 1, 2024_ + +A big thanks to the 8 contributors who made this release possible. Here are some highlights ✨: +This release was mostly about 🐛 bug fixes and 📚 documentation improvements. + +### `@mui/material@5.15.16` + +- [material-ui][Dialog] Prevent onClick on the root element from being overwritten (@ryanburr) (#41914) @github-actions[bot] +- [material-ui][Select] Fix `muiName` property TypeScript error (@EyaOuenniche) (#41786) @github-actions[bot] +- —>[material-ui][l10n] Fix typo in is-IS locale (@magnimarels) (#41815) @github-actions[bot] + +### Docs + +- Fix small SEO issues @oliviertassinari +- Fix 301 Toolpad links @oliviertassinari +- Fix 301 Toolpad links @oliviertassinari +- Fix 301 image redirections @oliviertassinari +- Fix small SEO issues @oliviertassinari +- Fix 301 redirection @oliviertassinari +- Fix format git diff regression (#41882) @oliviertassinari +- Fix 301 links @oliviertassinari +- [material-ui] Fix import statement in migration guide (@sai6855) (#41864) @github-actions[bot] +- [material-ui] Update Figma plugin name (@danilo-leal) (#42057) @github-actions[bot] +- [material-ui] Fix minor spelling error in the "About the lab" page (@ryanhartwig) (#42075) @github-actions[bot] +- [material-ui] Add missing backticks to HTML tag in the installation page (@Miguelrom) (#42009) @github-actions[bot] +- [material-ui] Add Connect-related content (@danilo-leal) (#41924) @DiegoAndai +- [material-ui] Fix Material 3 message typo (@aarongarciah) (#41822) @github-actions[bot] +- [material-ui] Remove Data Grid v7 beta callout (@cherniavskii) (#41842) @github-actions[bot] +- [material-ui][templates] Fix input props attributes in Landing Page template (@5-tom) (#42034) @github-actions[bot] +- [system] Update typo on the sx prop page (@bricker) (#42078) @github-actions[bot] + +### Core + +- [blog] Add post to introduce the Connect plugin (@danilo-leal) (#41929) @DiegoAndai +- [core] Automate cherry-pick of PRs from `next` -> `master` (#41742) @aarongarciah +- [docs-infra] Improve Twitter OG:image (#41860) @oliviertassinari +- [docs-infra] Use edge function for card generation (#41188) @alexfauquette +- [docs-infra] Fix drawer performances (#41807) (#41820) @alexfauquette +- [docs-infra] Fix analytics about inline ads (#41474) @alexfauquette +- [website] Sync career roles (@oliviertassinari) (#42059) @github-actions[bot] +- [website] Add content about the Sync plugin in the Material UI page (@danilo-leal) (#42074) @github-actions[bot] +- [website] Add Nadja on the about page (#42054) @mnajdova +- [website] Close the `Design Engineer - X` role (#42014) @DanailH +- [website] Remove customer support agent role from website (@rluzists1) (#41996) @github-actions[bot] +- [website] Add Jose to About Us (#41759) @JCQuintas + +All contributors of this release in alphabetical order: @aarongarciah, @alexfauquette, @DanailH, @DiegoAndai, @github-actions[bot], @JCQuintas, @mnajdova, @oliviertassinari + +## 5.15.15 + +<!-- generated comparing v5.15.14..master --> + +_Apr 4, 2024_ + +A big thanks to the 7 contributors who made this release possible. Here are some highlights ✨: +This release was mostly about 🐛 bug fixes and 📚 documentation improvements. + +### `@mui/material@5.15.15` + +- [Autocomplete] Display options provided to the `options` prop even if loading is true (#41677) @ZeeshanTamboli +- [RadioGroup] Apply classnames (#41681) @ZeeshanTamboli + +### `@mui/system@5.15.15` + +- Fix typo to avoid infinite recursion in function call (#41678) @ZeeshanTamboli + +### Docs + +- [material-ui][Slider] Remove `valueLabelFormat` from restricted values demo so that the tooltip thumb label displays the same as the value text (#41679) @ZeeshanTamboli +- [material-ui] Remove deleted page from the sidenav (#41594) @danilo-leal +- [material-ui] Fix typo in CSS theme variables customization (#41680) @ZeeshanTamboli +- Continue migration of Base UI to sperate repository @oliviertassinari +- Add notification for MUI X v7 blog post (#41587) (#41605) @cherniavskii +- Update the versions dropdown to show v6 (#41557) @mnajdova + +### Core + +- [blog] Link to Romain's blog post in MUI X v7 announcement post (#41641) @cherniavskii +- [blog] Blog post with MUI X v7.0.0 annoucement (#41563) (#41604) @cherniavskii +- [blog] Add post about remote (#41565) @danilo-leal +- [core] Continue rename of Toolpad @oliviertassinari +- [docs-infra] Add Toolpad product/category IDs to types (#41551) @bharatkashyap +- [website] Add Aarón to About Us (#41747) @aarongarciah +- [website] Add stray design adjustments throughout the site (#41642) @mnajdova +- [website] Update pricing table (#41606) @cherniavskii + +All contributors of this release in alphabetical order: @aarongarciah, @bharatkashyap, @cherniavskii, @danilo-leal, @mnajdova, @oliviertassinari, @ZeeshanTamboli + +## 5.15.14 + +<!-- generated comparing v5.15.13..master --> + +_Mar 18, 2024_ + +A big thanks to the 15 contributors who made this release possible. +This release was mostly about 🐛 bug fixes and 📚 documentation improvements. + +### `@mui/material@5.15.14` + +- [Accordion] Convert to support CSS extraction (#41221) @mnajdova +- ​<!-- 24 -->[Autocomplete] Convert to support CSS extraction (#40330) @mnajdova +- ​<!-- 06 -->[Slider] Convert to support CSS extraction (#41201) @mnajdova +- ​<!-- 07 -->[Select] Fix variant type (#41405) @sai6855 +- ​<!-- 09 -->[typescript] Use interface instead of type for props (#41500) @siriwatknp + +### `@pigment-css/react@0.0.3` + +- ​<!-- 03 -->Add Box component (#41451) @brijeshb42 + +### `pigment-css/nextjs-plugin@0.0.3` + +- ​<!-- 04 -->Fix alias resolver (#41494) @brijeshb42 +- ​<!-- 05 -->Follow-up to #41494 (#41502) @brijeshb42 + +### Docs + +- ​<!-- 12 -->[joy-ui] Add UI improvements to the side navigation demo (#41461) @cipherlogs +- ​<!-- 11 -->[pigment-css] Add media query guide (#41473) @siriwatknp +- ​<!-- 10 -->[pigment-css] Fixing location of the ExtendTheme type in the docs (#41499) @jherr +- ​<!-- 08 -->[material-ui][Progress] Add Circular progress gradient demo from Github comment (#40559) @DiegoAndai + +### Core + +- ​<!-- 23 -->[blog] Bringing consistency to Material UI customization APIs (#41040) @DiegoAndai +- ​<!-- 22 -->[code-infra] Rename @mui-internal/docs-utils to @mui/internal-docs-utils (#41498) @michaldudak +- ​<!-- 21 -->[code-infra] Copy translations.json to @mui/docs build folder (#41472) @Janpot +- ​<!-- 20 -->[core] Use Circle CI context (#41532) @oliviertassinari +- ​<!-- 19 -->[core] Fix CHANGELOG format and update date (#41481) @DiegoAndai +- ​<!-- 18 -->[docs] Fix useStorageState regressions (#41223) @Janpot +- ​<!-- 17 -->[docs] Fix some Vale errors (#41516) @oliviertassinari +- ​<!-- 15 -->[material-ui][docs] Fix landing page template's h1 size (#41543) @zanivan +- ​<!-- 14 -->[material-ui][docs] Apply new code header docs feature (#41508) @danilo-leal +- ​<!-- 11 -->[material-next] Drop the package (#41544) @mnajdova +- ​<!-- 16 -->[docs-infra] Fail CI on Vale error (#40944) @oliviertassinari +- ​<!-- 15 -->[docs-infra] Improve Vale config @oliviertassinari +- ​<!-- 14 -->[docs-infra] Add a feature list "component" (#41484) @danilo-leal +- ​<!-- 13 -->[docs-infra] Add code block header classes (#41487) @danilo-leal +- ​<!-- 21 -->[docs-infra] Make the Algolia search input label invisible (#41542) @danilo-leal +- ​<!-- 03 -->[website] Improve navbar's items hover state (#41535) @EyaOuenniche +- ​<!-- 02 -->[website] Split Toolpad documentation (#41316) @bharatkashyap +- ​<!-- 01 -->[website] Use MUI X Data Grid v7-beta (#41276) @cherniavskii + +All contributors of this release in alphabetical order: @bharatkashyap, @brijeshb42, @cherniavskii, @cipherlogs, @danilo-leal, @DiegoAndai, @EyaOuenniche, @Janpot, @jherr, @michaldudak, @mnajdova, @oliviertassinari, @sai6855, @siriwatknp, @zanivan + +## 5.15.13 + +<!-- generated comparing v5.15.12..master --> + +_Mar 13, 2024_ + +A big thanks to the 18 contributors who made this release possible. Here are some highights ✨ + +- The Material UI free Checkout template got a design uplift (#41447) @zanivan + +### `@mui/material@5.15.13` + +- [Alert] Add `slots` and `slotProps` type to theme (#41324) @sai6855 +- [Autocomplete] Fix the options list being added to the DOM in `freeSolo` mode even when there are no options, causing style problems (#41300) @rakeshmusturi +- Add `paperChannel` token (#41447) @siriwatknp +- [Switch] Convert to support CSS extraction (#41367) @alexfauquette +- [Tooltip] Support event handlers with extra parameters (#41320) @LukasTy + +### `@mui/system@5.15.13` + +- [RtlProvider] Add component & hook (#41241) @mnajdova + +### `@mui/utils@5.15.13` + +- [utils] Fix visually hidden styles' margin unit (#41477) @michaldudak + +### `@mui/codemod@5.15.13` + +- Fix merging of slotProps and componentProps (#41323) @sai6855 + +### `@mui/base@5.0.0-beta.39` + +- [material-ui][joy-ui][Autocomplete] Keep in sync highlighted index when the option still exists (#41306) @CGNonofr +- [FormControl] Export `FormControlOwnerState` type from index (#41287) @michaeldfoley +- [material-ui][TextareaAutosize] Fix inline style not getting applied (#41369) @ZeeshanTamboli + +### `@pigment-css/react@0.0.2` + +- Handle more scenarios while transforming sx prop (#41372) @brijeshb42 +- Improve testing of fixtures (#41389) @brijeshb42 +- Fix `keyframes` serialize styles error (#41395) @siriwatknp +- Use class selector instead of class value (#41442) @brijeshb42 +- [next] Warn about unsupported turbo mode in Next.js (#41445) @brijeshb42 + +### Docs + +- [material-ui] Refine checkout template (#40967) @zanivan +- [material-ui] Add docs for complementary List components (#41329) @anle9650 +- [material-ui] Add docs for complementary Dialog components (#41313) @jwithington +- [material-ui] Fix Templates live preview link (#41467) @danilo-leal +- [material-ui] Polish out the templates page (#41468) @zanivan +- [material-ui] Adjust the Templates card design (#41450) @danilo-leal +- [joy-ui] Remove unnecessary styles in color inversion footer demo (#41419) @cipherlogs +- [joy-ui] Update case studies chip background color (#41413) @cipherlogs +- [joy-ui] Remove wrong CSS prop from the Sign-in-side template (#41383) @cipherlogs +- [joy-ui] Fix broken link on the Color Inversion page (#41407) @cipherlogs +- [pigment] Add example and guide section (#41249) @siriwatknp +- [pigment-css] Brand name nonbreaking space (#41438) @oliviertassinari +- [pigment-css] Fix import on the README (#41411) @danilo-leal +- [pigment-css] Edit starter template links on README (#41409) @danilo-leal +- [pigment-css] Tweak the examples and edit READMEs (#41408) @danilo-leal +- [pigment-css] Adjust the bit about CSS vars on the README (#41463) @danilo-leal +- Finish brand name fixes #41438 @oliviertassinari +- Remove noreferrer @oliviertassinari +- Fix v4 docs `<b>` appearing in notifications (#41390) @peterwangsc +- Update GitHub project links (#41370) @danilo-leal + +### Core + +- [pigment] Make all Pigment CSS packages public (#41404) @brijeshb42 +- [pigment] Rename directories to match package names (#41453) @brijeshb42 +- [pigment-css] Example fix leading spaces (#41439) @oliviertassinari +- [code-infra] Add short note about e2e-website workflow schedule (#41355) @Janpot +- [code-infra] Add alias for icon types (#41248) @Janpot +- [code-infra] Reduce concurrency of typescript:ci further (#41392) @Janpot +- [code-infra] Reduce concurrency for test_types ci job (#41385) @Janpot +- [code-infra] Adapt API code generator to Base UI repo needs (#41475) @michaldudak +- [docs-infra] Don't generate preview files for the templates (#41379) @mnajdova +- [docs-infra] Fix Pigment CSS apps path in the render mui demos script (#41476) @mnajdova +- [docs-infra] move feedback to ESM (#41381) @alexfauquette +- [docs-infra] Improve color contrast throughout (#41387) @danilo-leal +- [docs-infra] Simplify Algolia crawler config (#41312) @oliviertassinari +- [docs-infra] Adjust the tabs and layout selection design (#41084) @danilo-leal +- [blog] Update the Base UI post with links to dedicated repo (#41358) @danilo-leal +- [website] Update the Careers page role (#41384) @danilo-leal +- [website] Compress about images @oliviertassinari +- [website] Improve color contrast on the homepage (#41465) @danilo-leal +- [examples] Add pigment-css-vite-ts starter example (#41196) @siriwatknp +- [examples] Add pigment-css-nextjs-ts starter project (#41105) @siriwatknp + +All contributors of this release in alphabetical order: @alexfauquette, @anle9650, @brijeshb42, @CGNonofr, @cipherlogs, @danilo-leal, @jwithington, @Janpot, @michaeldfoley, @michaldudak, @mnajdova, @oliviertassinari, @peterwangsc, @rakeshmusturi, @sai6855, @siriwatknp, @zanivan, @ZeeshanTamboli + +## 5.15.12 + +<!-- generated comparing v5.15.11..master --> + +_Mar 5, 2024_ + +A big thanks to the 21 contributors who made this release possible. +This release was mostly about 🐛 bug fixes and 📚 documentation improvements. + +### `@pigment-css/react@0.0.1`, `@pigment-css/nextjs-plugin@0.0.1`, `@pigment-css/vite-plugin@0.0.1`, & `@pigment-css/unplugin@0.0.1` + +- This is the first public release of our new zero-runtime CSS-in-JS library, Pigment CSS. + +### `@mui/material@5.15.12` + +- ​<!-- 52 -->Support props callback type in theme variants (#40946) @ZeeshanTamboli +- ​<!-- 50 -->[Alert] Convert to support zero runtime (#41230) @siriwatknp +- ​<!-- 49 -->[Alert] Deprecate composed classes (#40688) @DiegoAndai +- ​<!-- 44 -->[Button] Deprecate classes for v6 (#40675) @sai6855 +- ​<!-- 43 -->[Checkbox] `large` size added in type (#34909) @smox +- ​<!-- 42 -->[Chip] Deprecate composed classes (#41235) @sai6855 +- ​<!-- 41 -->[Chip] Correct `deleteIconColorPrimary` and `deleteIconColorSecondary` class descriptions (#41231) @sai6855 +- ​<!-- 17 -->Remove unused dev dependency on @mui/lab (#41198) @brijeshb42 +- ​<!-- 15 -->[Slider] Deprecate components and componentProps props for v6 (#40777) @lhilgert9 + +### `@mui/system@5.15.12` + +- ​<!-- 16 -->[pigment-css][material-ui] Render badge demos (#41353) @siriwatknp +- ​<!-- 14 -->[pigment-css] Update to latest wyw version (#41363) @brijeshb42 +- ​<!-- 13 -->[pigment-css] Rename scope to @pigment-css (#41354) @brijeshb42 +- ​<!-- 12 -->[pigment-css] Rename zero-runtime to pigmentcss (#41317) @brijeshb42 +- ​<!-- 11 -->Fix createSpacing return type (#41318) @matystroia +- ​<!-- 06 -->[zero] Add support for styled tagged-template literals (#41268) @brijeshb42 +- ​<!-- 05 -->[zero] Set up Material UI migration demos (#41267) @siriwatknp +- ​<!-- 04 -->[zero] Move extendTheme to already existing @mui/zero-runtime/utils (#41254) @brijeshb42 +- ​<!-- 03 -->[zero] Remove `object` intersection from CSS Fallback (#41271) @siriwatknp +- ​<!-- 02 -->[zero] Minor wording changes in README (#41253) @brijeshb42 +- ​<!-- 01 -->[zero] Prepare zero-runtime packages for public release (#41226) @brijeshb42 + +### `@mui/joy@5.0.0-beta.30` + +- ​<!-- 48 -->[joy-ui][Autocomplete] Fix text overflow in Chip (#40229) @PunitSoniME + +### Docs + +- ​<!-- 47 -->[base-ui] Update the docs post repo separation (#41328) @danilo-leal +- ​<!-- 34 -->Fix missing partner link @oliviertassinari +- ​<!-- 33 -->Update links to GitHub projects (#41297) @danilo-leal +- ​<!-- 32 -->Standardize WAI-ARIA referencest @oliviertassinari +- ​<!-- 31 -->Fix image layout shift when loading @oliviertassinari +- ​<!-- 23 -->[joy-ui] Add stray adjustments throughout the docs (#41211) @danilo-leal +- ​<!-- 22 -->[material-ui] Remove duplicated text at FAQ page (#41326) @zanivan +- ​<!-- 21 -->[material-ui] Fix color mode toggle of the landing page template (#41293) @zanivan +- ​<!-- 20 -->[system] Tweak the Usage demos (#41242) @danilo-leal +- ​<!-- 19 -->[zero] Add a Why section on the README (#41284) @danilo-leal + +### Core + +- ​<!-- 51 -->Revert "[utils] Port `useLocalStorageState` hook from Toolpad (#41096)" @oliviertassinari +- ​<!-- 46 -->[blog] Add post about how MUI uses Toolpad (#40172) @prakhargupta1 +- ​<!-- 45 -->[blog] No bundled demos in blog posts @oliviertassinari +- ​<!-- 40 -->[code-infra] Embed translations in the @mui/docs package (#41246) @Janpot +- ​<!-- 39 -->[code-infra] Prepare the markdown package for publishing (#41240) @michaldudak +- ​<!-- 38 -->[code-infra] Unpin the version of docs-utils in scripts (#41232) @michaldudak +- ​<!-- 37 -->[core] Use runtime agnostic setTimeout type @oliviertassinari +- ​<!-- 36 -->[core] Remove window. reference for common globals @oliviertassinari +- ​<!-- 35 -->[core] Add a script to build all packages (#40631) @michaldudak +- ​<!-- 30 -->[docs-infra] Fix missing non breaking spaces @oliviertassinari +- ​<!-- 29 -->[docs-infra] Add design customizations to the disclosure element (#41285) @danilo-leal +- ​<!-- 28 -->[docs-infra] Adjust headings dark mode color (#41292) @danilo-leal +- ​<!-- 27 -->[docs-infra] Fix Stack Overflow breaking space @oliviertassinari +- ​<!-- 26 -->[docs-infra] Fix product selector popup not closing on route change (#41166) @divyammadhok +- ​<!-- 25 -->[docs-infra] Improve fix blank links ad @oliviertassinari +- ​<!-- 24 -->[docs-infra] Support interfaces for X docs (#41069) @alexfauquette +- ​<!-- 18 -->[infra] Adjust the links to search for issues (#41008) @michelengelen +- ​<!-- 10 -->[website] Move the `React Engineer - xCharts` to `Next roles` section (#41368) @DanailH +- ​<!-- 09 -->[website] Add James to About Us (#41362) @atomiks +- ​<!-- 08 -->[website] Polish Button outline primary medium (#41298) @oliviertassinari +- ​<!-- 07 -->[website] Remove Heatmap chart from community plan on pricing table (#41081) @alexfauquette + +All contributors of this release in alphabetical order: @alexfauquette, @atomiks, @brijeshb42, @DanailH, @danilo-leal, @DiegoAndai, @divyammadhok, @Janpot, @lhilgert9, @matystroia, @michaldudak, @michelengelen, @mj12albert, @oliviertassinari, @prakhargupta1, @PunitSoniME, @sai6855, @siriwatknp, @smox, @zanivan, @ZeeshanTamboli + +## 5.15.11 + +<!-- generated comparing v5.15.10..master --> + +_Feb 21, 2024_ + +A big thanks to the 26 contributors who made this release possible. +This release was mostly about 🐛 bug fixes and 📚 documentation improvements. + +### `@mui/material@5.15.11` + +- [Alert] Deprecate components and componentsProps props (#40681) @DiegoAndai +- [Autocomplete] Caret transformation issue with font size change (#41066) @dpertsin +- [StepLabel] Add type for StepIconComponent (#41082) @harrydigos +- [TablePagination] Fix type error in Select props (#39137) @PaulKristoffersson +- [Transitions] External ownerState is incorrectly forwarded to inner components (#41187) @gitstart +- Use direct import (#40851) @siriwatknp + +### `@mui/material-nextjs@5.15.11` + +- Fix missing babel/runtime dependency in material-ui-nextjs (#41077) @siriwatknp + +### `@mui/system@5.15.11` + +- Use direct import (#40851) @siriwatknp +- Move useMediaQuery to system (#39463) @justintoman +- Consolidate the variants props callback arguments (#41222) @mnajdova +- Merge props and ownerState in the variants props callback (#41219) @mnajdova + +### `@mui/codemod@5.15.11` + +- [AccordionSummary] Add contentGutters deprecation codemods (#41006) @DiegoAndai +- [PaginationItem] Add codemod for deprecated classes (#41145) @sai6855 + +### `@mui/utils@5.15.11` + +- Port `useLocalStorageState` hook from Toolpad (#41096) @Janpot + +### `@mui/base@5.0.0-beta.37` + +- [Switch] Add missing role attribute (#40907) @KirankumarAmbati +- [TextareaAutosize] Improve implementation (#40789) @ZeeshanTamboli + +### `@mui/lab@5.0.0-alpha.164` + +- [Masonry] Ability to sort elements from left to right (#39904) @Rishi556 + +### Docs + +- [base-ui] Fix focus state demo in Base UI autocomplete (#41104) @oliviertassinari +- [base-ui] Update the Accessibility page demos design (#40995) @danilo-leal +- [joy-ui] Fix LinearProgressWithLabel example (#41194) @khgiddon +- [joy-ui] Fix 404 image on the docs @oliviertassinari +- [material-ui] Add a "start now" section on the Overview page (#41137) @danilo-leal +- [material-ui] Inform about deprecated TablePagination SelectProps usage (#41186) @gitstart +- [material-ui] Update the Testing page's Argos link (#41170) @gregberge +- [material-ui] Remove Masonry component and Material Design icon from the landing page template (#41080) @zanivan +- [material-ui] Standardize all references to Material Design 3 (M3) (#40903) @samuelsycamore +- [material-ui] Add stray fixes around a few pages (#41038) @danilo-leal +- [material-ui][joy-ui][system] Restore and revise the Box docs (#40622) @samuelsycamore +- [material-ui] Add simpler demo for default behavior (#40980) @zanivan +- [system] Explain why AppRouterCacheProvider (#40909) @oliviertassinari +- Link to react-transition group with https @oliviertassinari +- Update broken URL hashes (#41185) @LukasTy +- Prefer https links @oliviertassinari +- Fix MUI Treasury link @oliviertassinari +- Migrate the last > quotes to ::: callouts @oliviertassinari + +### Core + +- [blog] Add new product tags and stray adjustments (#41193) @danilo-leal +- [blog] Simplify `/base-ui-2024-plans/` page (#41171) @oliviertassinari +- [blog] Add link to Base UI API changes RFC (#41089) @michaldudak +- [blog] Remove the "News" tag (#41208) @danilo-leal +- [changelog] Remove @mui/system@5.15.10 (#41093) @michaldudak +- [code-infra] Move typescript-to-proptypes to internal-scripts package (#41079) @michaldudak +- [code-infra] Move Link to @mui/docs (#40889) @Janpot +- [code-infra] Use `experimental.cpus` to control amount of export workers in Next.js (#41132) @Janpot +- [code-infra] Load commonjs files in next.config.mjs with require (#41108) @Janpot +- [code-infra] Prepare babel macros package for publishing to npm (#41178) @michaldudak +- [code-infra] Build internal packages before publishing (#41210) @michaldudak +- [core] Improve the release instructions (#40973) @mnajdova +- [core] Simplify Next.js Demo Zero Runtime guide @oliviertassinari +- [core] Fix TypeScript spelling in changelog @oliviertassinari +- [core] Fix small detail in the autocomplete demo @oliviertassinari +- [core] Increase node memory limit on Netlify build (#41111) @michaldudak +- [core] Fix Netlify build cache issue (#43281) @LukasTy +- [core][Tooltip] Remove incorrect code comment (#41179) @ZeeshanTamboli +- [core] Fix missing context display names (#41168) @oliviertassinari +- [core][base-ui] Remove `@mui/base` dev dependency from Base UI workspace (#41216) @ZeeshanTamboli +- [zero][demo] Fix sample next app build (#41197) @brijeshb42 +- [docs-infra] Simplify copy logic (#41167) @oliviertassinari +- [docs-infra] New way of providing API layout config (#41106) @alexfauquette +- [docs-infra] Reduce scrollbar width on ROC (#41148) @oliviertassinari +- [docs-infra] Add external link arrow (#41129) @siriwatknp +- [docs-infra] Fix external link arrow (#41181) @alexfauquette +- [docs-infra] Flag npm and GitHub as wrong spellings @oliviertassinari +- [docs-infra] Fix display when the default props is undefined (#41114) @oliviertassinari +- [docs-infra] Remove random layout assignment (#40862) @alexfauquette +- [docs-infra] Add spacing and contrast improvements (#41191) @danilo-leal +- [docs-infra] Share vale-config (#41176) @alexfauquette +- [test] Generalize test utils (#41175) @michaldudak +- [typescript-to-proptypes] Support using `Omit` on types with conditional properties (#41033) @flaviendelangle +- [website] Match chart component names @oliviertassinari +- [website] Add Marblism diamond sponsor (#41097) @rluzists1 +- [website] Add overall improvements to the Material UI page (#41075) @danilo-leal +- [website] Fix responsive breakpoints @oliviertassinari +- [website] Fix overloading of footer JS files @oliviertassinari +- [website] Improve the footer's chip contrast (#41209) @danilo-leal +- [zero] Update to latest version of wyw-in-js (#41182) @brijeshb42 +- [zero] Setup basic testing framework (#40986) @brijeshb42 +- [zero] Fix wrong CSS order by moving import to last (#41002) @siriwatknp +- [zero] Export `extendTheme` for creating a zero-runtime theme (#40897) @siriwatknp +- [zero] Move extendTheme to its own subpath (#41204) @brijeshb42 + +All contributors of this release in alphabetical order: @alexfauquette, @brijeshb42, @danilo-leal, @DiegoAndai, @dpertsin, @flaviendelangle, @gitstart, @gregberge, @harrydigos, @Janpot, @justintoman, @khgiddon, @KirankumarAmbati, @LukasTy, @michaldudak, @mnajdova, @nikosgavalas, @oliviertassinari, @PaulKristoffersson, @Rishi556, @rluzists1, @sai6855, @samuelsycamore, @siriwatknp, @zanivan, @ZeeshanTamboli + +## 5.15.10 + +<!-- generated comparing v5.15.9..master --> + +_Feb 12, 2024_ + +A big thanks to the 8 contributors who made this release possible. +This release was mostly about 🐛 bug fixes and 📚 documentation improvements. + +### `@mui/material@5.15.10` + +- [Avatar] Add props deprecation with a codemod (#40853) @siriwatknp + +### `@mui/joy@5.0.0-beta.28` + +- [Button] Fix `disabled` prop priority when inside button group (#41000) @Smileek +- [IconButton] Support loading prop (#40949) @Smileek + +### Docs + +- [Button][material-ui] Fix 'File upload' demo a11y (#40943) @oliviertassinari +- [TableRow][material-ui] Escape markup in `children` prop so docgen tools don't parse it as HTML (#40992) @millerized +- [material-ui] Remove outdated example projects link (it uses Joy UI now) (#40913) @oliviertassinari +- [material-ui] Fix the "Intro to the MUI ecosystem" link placement (#40988) @danilo-leal +- Fix 301 redirection to StackBlitz @oliviertassinari +- Fix h1 on Joy UI templates @oliviertassinari +- Have MUI workspace own the CodeSandbox @oliviertassinari +- Add notification for MUI X v7 beta (#41001) @joserodolfofreitas +- Fix 301 links @oliviertassinari +- Fix Next.js v13.5.1 <title> SEO regression (#40302) @oliviertassinari +- Add a 404 page (#40884) @danilo-leal +- Fix missing GitHub label when opening new issue @oliviertassinari +- [Stack] Update import statement for Stack component (#41032) @sai6855 + +### Core + +- [blog] Add post about upcoming plans for Base UI (#40882) @danilo-leal +- [core] Simplify CodeSandbox reproduction @oliviertassinari +- [core] Missing redirection @oliviertassinari +- [core] Export functions from `copyFiles` script to reuse in MUI X repo (#40970) @cherniavskii +- [core] Avoid variable shorthands @oliviertassinari +- [docs-infra] Fix search icon issue (#40957) @oliviertassinari +- [docs-infra] Ignore classes tagged with `@ignore` (#41009) @cherniavskii +- [docs-infra] Fix selected tab on codeblocks (#41036) @danilo-leal +- [website] Polish Customer Support Agent role @oliviertassinari + +All contributors of this release in alphabetical order: @cherniavskii, @danilo-leal, @joserodolfofreitas, @millerized, @oliviertassinari, @sai6855, @siriwatknp, @Smileek + +## 5.15.9 + +<!-- generated comparing v5.15.8..master --> + +_Feb 8, 2024_ + +A big thanks to the 7 contributors who made this release possible. Here are some highlights ✨: + +- 🐛 A critical fix to remove non-published library usage in `@mui/material` peerDependencies. + +### `@mui/material@5.15.9` + +- ​<!-- 11 -->[autocomplete] Avoid spread operator (#40968) @oliviertassinari +- ​<!-- 05 -->[material] Remove zero-runtime from peer dep (#41003) @brijeshb42 + +### `@mui/base@5.0.0-beta.36` + +- ​<!-- 10 -->[base-ui] Update props using Array to ReadonlyArray type (#40754) @RaghavenderSingh + +### `@mui/system@5.15.9` + +- ​<!-- 02 -->[system] use `ReadonlyArray` for CSS related types (#40972) @siriwatknp +- ​<!-- 01 -->[zero] Migrate to use wyw-in-js instead of linaria (#40866) @brijeshb42 + +### Docs + +- ​<!-- 06 -->[docs] Polish codemod git diff format @oliviertassinari +- ​<!-- 05 -->[material-ui][docs] Migrating from deprecated apis follow up (#40981) @DiegoAndai + +### Core + +- ​<!-- 09 -->[code-infra] Move next config to ESM (#40869) @Janpot +- ​<!-- 08 -->[code-infra] Update prettier (#40772) @Janpot +- ​<!-- 07 -->[code-infra] Add codemod for `light` prop removal (#40947) @sai6855 + +All contributors of this release in alphabetical order: @brijeshb42, @DiegoAndai, @Janpot, @oliviertassinari, @RaghavenderSingh, @sai6855, @siriwatknp + +## 5.15.8 + +<!-- generated comparing v5.15.7..master --> + +_Feb 6, 2024_ + +A big thanks to the 17 contributors who made this release possible. Here are some highlights ✨: + +- 💫 Added a redesigned [landing page template](https://mui.com/material-ui/getting-started/templates/landing-page/) (#37557) @zanivan +- ✨ Added support for Arrow Down/Up + Shift and Page Up/Down keys for faster stepping in the Slider component (#40676) @mnajdova +- many 🐛 bug fixes and 📚 documentation improvements + +### `@mui/material@5.15.8` + +- ​<!-- 36 -->[Avatar] Simplify valid children assertion (#40834) @oliviertassinari + +### `@mui/codemod@5.15.8` + +- ​<!-- 37 -->[Accordion] Update props actual.js test case (#40879) @DiegoAndai +- ​<!-- 12 -->Fix `findComponentJSX` util (#40855) @sai6855 + +### `@mui/system@5.15.8` + +- ​<!-- 10 -->Add blend color manipulator (#40258) @romgrk +- ​<!-- 38 -->Support variants in `theme.styleOverrides` (#40690) @siriwatknp +- ​<!-- 02 -->[zero] Always replace the `createUseThemeProps` call (#40885) @siriwatknp +- ​<!-- 01 -->[zero] Add README with installation and basic usage (#40761) @brijeshb42 + +### `@mui/base@5.0.0-beta.34` + +- ​<!-- 35 -->[Button] Add support for `hostElementName` prop to improve SSR (#40507) @mj12albert +- ​<!-- 30 -->[Menu] Use Popup instead of Popper (#40731) @michaldudak +- ​<!-- 29 -->[useNumberInput] Integrate useNumberInput with useControllableReducer (#40206) @mj12albert +- ​<!-- 11 -->[Slider] Add support for Arrow Down/Up + Shift and Page Up/Down keys (#40676) @mnajdova + +### Docs + +- ​<!-- 34 -->[base-ui] Update usage.md (#40916) @adebiyial +- ​<!-- 33 -->[base-ui] Improve Base UI traffic from Material UI (#40875) @oliviertassinari +- ​<!-- 32 -->[base-ui] Change Radio component terminology from Button to Group (#40888) @danilo-leal +- ​<!-- 42 -->[base-ui] Remove redundant "Styled" prefix (#40478) @oliviertassinari +- ​<!-- 48 -->[base-ui] Update listbox slot style in demo (#40952) @sai6855 +- ​<!-- 14 -->[material-ui] Fix createTheme import and markdown format in the Next.js guide (#40895) @hsmtkk +- ​<!-- 13 -->[material-ui] Correct Google font CDN URL as Roboto 600 weight is not used (#40852) @xuhdev +- ​<!-- 14 -->[material-ui] Replace the Album template with a landing page (#37557) @zanivan +- ​<!-- 21 -->[material-ui] Add deprecations migration guide (#40767) @DiegoAndai +- ​<!-- 22 -->[material-ui] Improve aria-label throughout the Button Group demos (#40892) @danilo-leal +- ​<!-- 17 -->[joy-ui] Update the Overview callout (#40900) @danilo-leal +- ​<!-- 22 -->Fix image size and dark mode @oliviertassinari +- ​<!-- 21 -->Migrate links from legacy.reactjs.org to react.dev @oliviertassinari +- ​<!-- 20 -->Fix 301 links @oliviertassinari +- ​<!-- 19 -->Fix outdated link @oliviertassinari +- ​<!-- 18 -->Fix URL and typo in CONTRIBUTING.md (#40899) @Smileek + +### Core + +- ​<!-- 28 -->[blog] Optimize images for /blog/mui-x-v7-beta/ @oliviertassinari +- ​<!-- 27 -->[blog] Clarify barrel index tree-shaking @oliviertassinari +- ​<!-- 26 -->[code-infra] Simplify bug reproduction (#40833) @oliviertassinari +- ​<!-- 25 -->[code-infra] Prepare publishing @mui-internal/typescript-to-proptypes to npm (#40842) @michaldudak +- ​<!-- 40 -->[code-infra] Remove babel alias from the docs (#40792) @Janpot +- ​<!-- 24 -->[core] Use Google Font v2 API @oliviertassinari +- ​<!-- 23 -->[core] Add missing change to v5.15.7 changelog (#40872) @DiegoAndai +- ​<!-- 31 -->[core] Normalize `<meta name="viewport" />`` @oliviertassinari +- ​<!-- 28 -->[dependencies] Do not update envinfo test dependencies (#40950) @michaldudak +- ​<!-- 17 -->[docs-infra] Fix arbitrary gap between paragraphs in callouts (#40911) @oliviertassinari +- ​<!-- 16 -->[docs-infra] Allow developers to build their CodeSandbox export (#40878) @oliviertassinari +- ​<!-- 15 -->[docs-infra] Improve StackBlitz support (#40832) @oliviertassinari +- ​<!-- 21 -->[docs-infra] Improve support for absolute locale URL (#40940) @oliviertassinari +- ​<!-- 31 -->[Menu][base-ui] Fix improperly merged tests (#40896) @michaldudak +- ​<!-- 09 -->[utils] Use consistent build approach (#40837) @siriwatknp +- ​<!-- 08 -->[website] Fix React missing key console error @oliviertassinari +- ​<!-- 07 -->[website] Fix broken link @oliviertassinari +- ​<!-- 06 -->[website] Fix heading structure (#40912) @oliviertassinari +- ​<!-- 05 -->[website] Add Customer Support Agent role to careers page (#40890) @rluzists1 +- ​<!-- 04 -->[website] Refine the Material UI homepage demo (#40881) @danilo-leal +- ​<!-- 03 -->[website] Use em-dash when relevant over hyphen @oliviertassinari +- ​<!-- 03 -->[zero] Fix build for demo next.js app (#40854) @brijeshb42 + +All contributors of this release in alphabetical order: @adebiyial, @brijeshb42, @danilo-leal, @DiegoAndai, @hsmtkk, @Janpot, @michaldudak, @mj12albert, @mnajdova, @oliviertassinari, @rluzists1, @romgrk, @sai6855, @siriwatknp, @Smileek, @xuhdev, @zanivan + +## 5.15.7 + +<!-- generated comparing v5.15.6..master --> + +_Jan 31, 2024_ + +A big thanks to the 21 contributors who made this release possible. +This release was mostly about 🐛 bug fixes and 📚 documentation improvements. + +### `@mui/material@5.15.7` + +- ​<!-- 55 -->[Select] Fix to show notched outline when `displayEmpty` (#40865) @ZeeshanTamboli +- ​<!-- 51 -->[Avatar] Improve fallback when `children` is empty string or boolean (#40766) @mirus-ua +- ​<!-- 50 -->[AvatarGroup] Refactor component thereby fixing custom spacing logic (#40686) @ZeeshanTamboli + +### `@mui/codemod@5.15.7` + +- ​<!-- 38 -->Add accordion props deprecation (#40771) @siriwatknp + +### `@mui/system@5.15.7` + +- ​<!-- 56 -->[zero-runtime] Use lodash instead of its subpackages (#40868) @michaldudak +- ​<!-- 19 -->Add `applyStyles()` to theme (#40667) @siriwatknp +- ​<!-- 02 -->[zero] Use `theme.applyStyles` in the demo app (#40787) @siriwatknp +- ​<!-- 01 -->[zero] Add `useThemeProps` processor (#40648) @siriwatknp + +### `@mui/utils@5.15.7` + +- ​<!-- 16 -->[core] Remove unnecessary default export (#40788) @siriwatknp +- ​<!-- 15 -->[core] Convert all exports to modules (#39882) @mnajdova +- ​<!-- 20 -->[perf] Prevent unneeded `clearTimeout` calls (#39060) @romgrk + +### `@mui/base@5.0.0-beta.34` + +- ​<!-- 48 -->[Input] Add OTP input demo (#40539) @sai6855 +- ​<!-- 47 -->[Menu] Focus last item after opening a menu using up arrow (#40764) @Jaswanth-Sriram-Veturi +- ​<!-- 46 -->[Menu] Focus Menu Items on hover (#40755) @michaldudak + +### `@mui/joy@5.0.0-beta.25` + +- ​<!-- 22 -->Change the color scheme type to `SupportedColorScheme` (#40776) @Nikhilh26 + +### `@mui/lab@5.0.0-alpha.163` + +- ​<!-- 21 -->[TabContext] Support number type in `value` (#40829) @srinidhi9831 + +### Docs + +- ​<!-- 57 -->[material-ui] Fix the icon preview dialog (#40863) @danilo-leal +- ​<!-- 53 -->[material-ui] Fix typo on styled-components guide (#40858) @dancielos +- ​<!-- 49 -->[base-ui] Fix CSS vars from the plain CSS theme stylesheet (#40762) @zanivan +- ​<!-- 31 -->[material-ui][Divider] Remove light prop references from docs (#40782) @sai6855 +- ​<!-- 30 -->Fix build @oliviertassinari +- ​<!-- 29 -->Add support pages for each product @oliviertassinari +- ​<!-- 28 -->Add survey banner to docs and website (#40553) @joserodolfofreitas +- ​<!-- 24 -->[Menu] Fix hydration mismatch error on Base UI's Menu docs (#40758) @michaldudak +- ​<!-- 25 -->[material-nextjs] Add theming and configuration content to the page (#40626) @siriwatknp + +### Core + +- ​<!-- 54 -->[website] Move `React Engineer - X` into the future roles section (#40867) @DanailH +- ​<!-- 52 -->[material-ui][test][Alert] Add action, icon, and iconMapping tests (#40682) @DiegoAndai +- ​<!-- 45 -->[blog] Lint duplicate h1 on the page (#40835) @oliviertassinari +- ​<!-- 44 -->[blog] MUI X v7 beta announcement blogpost (#40784) @joserodolfofreitas +- ​<!-- 43 -->[code-infra] Remove custom TS installation script (#40636) @michaldudak +- ​<!-- 42 -->[code-infra] Correct API Docs Builder dependencies (#40775) @michaldudak +- ​<!-- 41 -->[code-infra] Migrate to prettier async APIs (#40668) @Janpot +- ​<!-- 40 -->[code-infra] Refined docs generation (#40603) @alexfauquette +- ​<!-- 39 -->[code-infra] Explain how to install the browsers (#40474) @oliviertassinari +- ​<!-- 37 -->`missingKeyGenerator` do no longer exist (#40830) @oliviertassinari +- ​<!-- 36 -->Rely on immutable ref when possible (#40831) @oliviertassinari +- ​<!-- 35 -->Remove deprecated `@types/markdown-to-jsx` package from docs (#40828) @ZeeshanTamboli +- ​<!-- 34 -->Remove unneeded `@slack/web-api` package (#40840) @ZeeshanTamboli +- ​<!-- 33 -->Clarify TODO instruction @oliviertassinari +- ​<!-- 32 -->Remove unneeded use-clients (#40663) @oliviertassinari +- ​<!-- 27 -->[docs-infra] Fix anchor link hook (#40836) @oliviertassinari +- ​<!-- 26 -->[docs-infra] Avoid layout shift on docs-pages (#40749) @oliviertassinari +- ​<!-- 23 -->[examples] Fix build on Next.js Pages Router examples (#40665) @oliviertassinari +- ​<!-- 18 -->[test] Speed up the envinfo test (#40669) @michaldudak +- ​<!-- 17 -->[typescript-to-proptypes] Allow to represent dates as `PropTypes.object` (#40774) @flaviendelangle +- ​<!-- 14 -->[website] Add new Base UI role (#40773) @colmtuite +- ​<!-- 13 -->[website] Fix a couple of rough edges (#40849) @danilo-leal +- ​<!-- 12 -->[website] Small polishing after latest changes to the theme (#40846) @zanivan +- ​<!-- 11 -->[website] Polish some pages and stray components (#40797) @danilo-leal +- ​<!-- 10 -->[website] Refine the careers page slightly (#40793) @danilo-leal +- ​<!-- 09 -->[website] Fix missing key on the Testimonials section (#40791) @Janpot +- ​<!-- 08 -->[website] Fix Footer layout shift (#40786) @oliviertassinari +- ​<!-- 07 -->[website] Revamp the testimonial section in the homepage (#40752) @danilo-leal +- ​<!-- 06 -->[website] Fix pricing license model toggle style (#40747) @oliviertassinari +- ​<!-- 05 -->[website] Fine-tune colors and styles on the branding theme (#40751) @danilo-leal +- ​<!-- 04 -->[website] Fix Toggle Button styles in the homepage demos (#40744) @mohamedsaiedd +- ​<!-- 03 -->[website] Update stats on the testimonials section (#40769) @EyaOuenniche + +All contributors of this release in alphabetical order: @alexfauquette, @colmtuite, @danilo-leal, @DiegoAndai, @EyaOuenniche, @flaviendelangle, @Janpot, @Jaswanth-Sriram-Veturi, @joserodolfofreitas, @michaldudak, @mirus-ua, @mnajdova, @mohamedsaiedd, @Nikhilh26, @oliviertassinari, @romgrk, @sai6855, @siriwatknp, @srinidhi9831, @zanivan, @ZeeshanTamboli + +## 5.15.6 + +<!-- generated comparing v5.15.5..master --> + +_Jan 22, 2024_ + +A big thanks to the 17 contributors who made this release possible. Here are some highlights ✨: +This release was mostly about 🐛 bug fixes and 📚 documentation improvements. + +### `@mui/material@5.15.6` + +- ​<!-- 29 -->[Avatar] Use variants api (#40324) @mnajdova +- ​<!-- 27 -->[TablePagination] Accept readonly array for `rowsPerPageOptions` prop (#40481) @pcorpet +- ​<!-- 06 -->[PaginationItem] Deprecate classes for v6 (#40673) @sai6855 +- ​<!-- 05 -->[Rating] Fix rating width via min-content (#40503) @devhik0 + +### `@mui/base@5.0.0-beta.33` + +- ​<!-- 26 -->[Select] Fix display of selected Options with rich content (#40689) @michaldudak +- ​<!-- 25 -->[Select] Use Popup instead of Popper (#40524) @michaldudak +- ​<!-- 26 -->[useMenuButton] Fix non native button triggers (#40645) @DiegoAndai + +### `@mui/system@5.15.6` + +- ​<!-- 02 -->[zero] Fix theme token import in source file (#40691) @brijeshb42 +- ​<!-- 01 -->[zero] Add support for css import (#40541) @brijeshb42 + +### `@mui/icons-material@5.15.6` + +- ​<!-- 07 -->[icons-material] Fix icons package.json version (#40655) @mj12albert + +### Docs + +- ​<!-- 28 -->[base-ui] Polish the Slider demos (#40332) @danilo-leal +- ​<!-- 24 -->[base-ui][Slider] Fix plain CSS demo's wrong keyboard behavior (#40652) @mnajdova +- ​<!-- 23 -->[base-ui][TextareaAutosize] Add border-box to demo (#40646) @ANUGLYPLUGIN +- ​<!-- 16 -->Fix brand name non-breaking space (#40701) @oliviertassinari +- ​<!-- 15 -->Improve error message for MUI Vale rule @oliviertassinari +- ​<!-- 14 -->Add notification to publish the survey (#40552) @joserodolfofreitas +- ​<!-- 04 -->[system] Explain a bit more how AppRouterCacheProvider works @oliviertassinari +- ​<!-- 12 -->[joy-ui] Move tutorial to iframe (#40567) @oliviertassinari +- ​<!-- 10 -->[material-ui][Slider] Remove custom divs from new demo (#40674) @zanivan +- ​<!-- 11 -->[material-ui] Improve TabContext, TabList, and TabPanel documentation (#40587) @anle9650 +- ​<!-- 09 -->[material-ui][Slider] Added custom mark labels demo (#40647) @DonikaV + +### Core + +- ​<!-- 30 -->[core] Fix RXDB-logo Url (#40724) @mohamedsaiedd +- ​<!-- 24 -->[code-infra] Improve proptypes-generation (#40617) @alexfauquette +- ​<!-- 22 -->[code-infra] Disable pnpm package cache on CircleCI (#40670) @michaldudak +- ​<!-- 21 -->[code-infra] Add missing package to CodeSandbox CI config (#40657) @michaldudak +- ​<!-- 20 -->[code-infra] Remove unnecessary @mui/utils dependency from api-docs-builder (#40632) @michaldudak +- ​<!-- 19 -->[core] Polish issue templates @oliviertassinari +- ​<!-- 13 -->[docs-infra] Support markdown link in slots descriptions (#40679) @alexfauquette +- ​<!-- 08 -->[examples] Simplify Next.js example (#40661) @oliviertassinari +- ​<!-- 03 -->[website] Fix broken styles on Base UI page (#40683) @michaldudak + +All contributors of this release in alphabetical order: @alexfauquette, @anle9650, @ANUGLYPLUGIN, @brijeshb42, @danilo-leal, @devhik0, @DiegoAndai, @DonikaV, @joserodolfofreitas, @michaldudak, @mj12albert, @mnajdova, @mohamedsaiedd, @oliviertassinari, @pcorpet, @sai6855, @zanivan + +## 5.15.5 + +<!-- generated comparing v5.15.4..master --> + +_Jan 17, 2024_ + +A big thanks to the 18 contributors who made this release possible. Here are some highlights ✨: + +- Base UI's CSS class prefix is now `base-` (#40205) @michaldudak +- Bug fixes, and a lot of improvements to code and docs infra + +### `@mui/material@5.15.5` + +- ​<!-- 42 -->[Accordion] Deprecate \*Props props and classes for v6 (#40418) @DiegoAndai +- ​<!-- 41 -->[Alert] Update TypeScript types to allow color override types to be added to `iconMapping` and `severity` props (#40551) @2metres +- ​<!-- 27 -->[Dialog] Remove deprecated onBackdropClick from Dialog tests (#40505) @sai6855 +- ​<!-- 26 -->[Divider] Deprecate props and classes for v6 (#40563) @sai6855 + +### `@mui/material-next@6.0.0-alpha.118` + +- ​<!-- 36 -->[ButtonGroup] Apply MD3 style to `ButtonGroup` (#40124) @lhilgert9 + +### `@mui/base@5.0.0-beta.32` + +#### Breaking changes + +- ​<!-- 40 -->Change the CSS class prefix to `base-` (#40205) @michaldudak + +The class prefix of Base UI components have been changed from `Mui-` to `base-`. This only affects codebases that uses class names verbatim, i.e. not exposed by JS objects such as `buttonClasses`, but as plain strings or in CSS stylesheets (`.MuiButton.root`) + +To adapt your code to the new pattern: + +- replace all occurrences of the regex `.Mui([A-Z][A-Za-z]*)-` with `.base-$1-` (so `MuiButton-root` becomes `base-Button-root`, etc.), +- replace all occurrences of the regex `.Mui-([a-z]*)` with `.base--$1` (so `Mui-disabled` becomes `base--disabled`, etc.). + +#### Changes + +- ​<!-- 39 -->[Select] Fix screen-reader CSS to avoid body scrollbar (#40599) @brijeshb42 +- ​<!-- 38 -->[Switch] Add border-box to demos (#40638) @zanivan + +### `@mui/joy@5.0.0-beta.23` + +- ​<!-- 11 -->[ModalDialog] Fix ModalDialog layout prop override (#40512) @maakcode +- ​<!-- 10 -->[RadioGroup] Allow zero number as a value (#40344) @aacevski + +### `@mui/codemod@5.15.5` + +- ​<!-- 31 -->Allow `json` files to be transformed (#40536) @ZeeshanTamboli + +### `@mui/lab@5.0.0-alpha.161` + +- ​<!-- 09 -->Update `@mui/material` peer dependency version (#40528) @ZeeshanTamboli + +### `@mui/material-nextjs@5.15.5` + +- ​<!-- 08 -->Fix release script (#40519) @petrovmiroslav +- ​<!-- 07 -->Support Nonces in the App Router Provider (#40269) @josh-feldman +- ​<!-- 06 -->Polish @mui/material-nextjs (#40473) @oliviertassinari + +### `@mui/system@5.15.5` + +- ​<!-- 05 -->Fix import path for @mui/system in vite apps (#40490) @brijeshb42 +- ​<!-- 02 -->Fix css vars generation and simplify the code (#40530) @siriwatknp +- ​<!-- 01 -->Identify zero runtime styled path (#40555) @brijeshb42 + +### Docs + +- ​<!-- 35 -->[joy-ui][Card] Fix text alignment in horizontal aligned card demo (#40562) @ZeeshanTamboli +- ​<!-- 25 -->Improve instructions about peer dependencies (#40621) @danilo-leal +- ​<!-- 24 -->Solve page description length @oliviertassinari +- ​<!-- 23 -->Fix MUI Treasury links (#40561) @siriwatknp +- ​<!-- 17 -->[material-ui] Update <ListItem button/> to ListItemButton in demos (#40564) @sai6855 +- ​<!-- 16 -->[material-ui] Revise the Snackbar page (#39298) @danilo-leal +- ​<!-- 15 -->[material-ui] Sharpen Material 3 copy on demo pages (#40546) @samuelsycamore +- ​<!-- 14 -->[material-ui] Fix typo on Next.js integration guide (#40538) @zanivan +- ​<!-- 13 -->[material-ui][Snackbar] Remove unused `State` interface from Consecutive Snackbars demo (#40410) + @zinoroman +- ​<!-- 12 -->[website] Resolve broken links reported by `docs:link-check` (#40547) @samuelsycamore + +### Core + +- ​<!-- 37 -->[blog] Fix 404 link to MUI Treasury @oliviertassinari +- ​<!-- 34 -->[code-infra] Add `run` command to deploy docs (#40513) @siriwatknp +- ​<!-- 32 -->[core] Update the lockfile (#40628) @michaldudak +- ​<!-- 31 -->[core] Remove dead code and follow standard @oliviertassinari +- ​<!-- 30 -->[core] Simplify server detection (#40471) @oliviertassinari +- ​<!-- 29 -->[core] Sync playwright cache between MUI X and Material UI (#40475) @oliviertassinari +- ​<!-- 28 -->[dependencies] Bump tough-cookie (#40437) @michaldudak +- ​<!-- 22 -->[docs-infra] Enforce brand name rules (#40525) @oliviertassinari +- ​<!-- 21 -->[docs-infra] Minimize ad layout shift on mobile (#40582) @oliviertassinari +- ​<!-- 20 -->[docs-infra] Improve API page deprecation info (#40440) @DiegoAndai +- ​<!-- 19 -->[docs-infra] Remove old tocs banners (#40537) @oliviertassinari +- ​<!-- 18 -->[docs-infra] Remove dead code aria-label sponsors (#40526) @oliviertassinari +- ​<!-- 04 -->[utils] Centralize clamp implementation in utils (#40267) @Kamino0 +- ​<!-- 03 -->[website] Polish the Base UI page demos (#40504) @danilo-leal + +All contributors of this release in alphabetical order: @2metres, @aacevski, @brijeshb42, @danilo-leal, @DiegoAndai, @josh-feldman, @Kamino0, @lhilgert9, @maakcode, @michaldudak, @oliviertassinari, @petrovmiroslav, @sai6855, @samuelsycamore, @siriwatknp, @zanivan, @ZeeshanTamboli, @zinoroman + +## 5.15.4 + +<!-- generated comparing v5.15.3..master --> + +_Jan 10, 2024_ + +A big thanks to the 22 contributors who made this release possible. Here are some highlights: + +- ✨ Material UI's [ToggleButtonGroup](https://mui.com/material-ui/react-toggle-button/) now supports non-button element as a child (e.g., showing a Tooltip on a disabled ToggleButton) (#40220) @Methuselah96 + +### `@mui/material@5.15.4` + +- [TextField][FormLabel][InputLabel][FormControl] Use exact children type to allow React children type augmentation (#38872) @nicegamer7 +- [Select] Add form submission regression test (#40176) @mj12albert +- [ToggleButtonGroup] Support different elements under it (#40220) @Methuselah96 +- [ClickAwayListener] Fix export of types (#40485) @illume + +### `@mui/material-nextjs@5.15.4` + +- Improve build size issue (#40436) @siriwatknp + +### `@mui/icons-material@5.15.4` + +- Update the icons (#40365) @michaldudak + +### `@mui/system@5.15.4` + +- [zero] Move zero runtime related packages (#40426) @brijeshb42 +- Fix all use of styled(Box) (#40449) @oliviertassinari + +### `@mui/utils@5.15.4` + +- Fix `isPlainObject` to work across realm (#39981) @brijeshb42 + +### `@mui/base@5.0.0-beta.31` + +- [base-ui][NumberInput] Remove inputId and inputRef types from NumberInput component (#40425) @sai6855 + +### `@mui/joy@5.0.0-beta.22` + +- [Badge] Shouldn't crash when using custom size (#39986) @iamsaumya +- [ToggleButtonGroup] Add `JoyToggleButtonGroup` to extendTheme's components type export (#40407) @RiceCrisp + +### Docs + +- [base-ui] Visual tweaks to the plain CSS theme stylesheet (#40487) @zanivan +- [base-ui] Add tokens to plain CSS theme stylesheet (#40113) @zanivan +- [base-ui] Update the overview page (#40412) @danilo-leal +- [material-ui][Drawer] Resolve flickering when double-clicking on the backdrop to close it (#40343) @aacevski +- [material-ui] Refactor form submission in FormDialog component (#40470) @sai6855 +- [material-ui] Replace recharts with MUI X charts on the Dashboard template (#40107) @alexfauquette +- [material-ui] Revise the Alert demo page (#34892) @samuelsycamore +- [material-ui] Revise the Accordion page (#40284) @anle9650 +- [material-ui] Add docs for complementary Card components (#40346) @anle9650 +- [material-ui] Add Material Design 3 components page (#40350) @DiegoAndai +- Fix strange italic style @oliviertassinari +- Fix references to ESLint @oliviertassinari +- Fix 301 redirections @oliviertassinari +- Right-to-left revision and addition to Joy UI (#39158) @danilo-leal + +### Core + +- [examples] Use material-nextjs integration package (#40199) @siriwatknp +- [code-infra] Configure build dependencies in nx (#40482) @michaldudak +- [code-infra] Don't require noreferrer on target link (#40447) @oliviertassinari +- [code-infra] Use tsx instead of ts-node (#40428) @michaldudak +- [code-infra] Add options to docs-api generation to support X code structure (#40111) @alexfauquette +- [docs-infra] Add types for withDocsInfra (#40301) @oliviertassinari +- [docs-infra] Fix anchor links in API pages (#40450) @oliviertassinari +- [docs-infra] Fix API table full-width (#40476) @oliviertassinari +- [docs-infra] Fix the copy button overlapping with the scrollbar (#40405) @danilo-leal +- [docs-infra] Remove explicit `mui-x` dependency resolving (#40257) @LukasTy +- [docs-infra] Update the outlined Demo container dark mode color (#40488) @danilo-leal +- [core] Lock file maintenance (#34538) @renovate[bot] +- [core] Remove duplicate devDependencies (#40438) @michaldudak +- [core] Remove issue emoji @oliviertassinari +- [core] Move prefetch at the core, will propagate to MUI X @oliviertassinari +- [core] Change package manager to pnpm (#36287) @Janpot +- [core][docs] Remove the "Understand MUI packages" page (#39835) @savalaram-redkar +- [website] Evolve the Developer Advocate role (#40337) @oliviertassinari +- [website] Fix default social card @oliviertassinari +- [test] Restore the `t` command (#40430) @michaldudak + +All contributors of this release in alphabetical order: @aacevski, @alexfauquette, @anle9650, @brijeshb42, @danilo-leal, @DiegoAndai, @iamsaumya, @illume, @Janpot, @LukasTy, @Methuselah96, @michaldudak, @mj12albert, @nicegamer7, @oliviertassinari, @renovate[bot], @RiceCrisp, @sai6855, @samuelsycamore, @savalaram-redkar, @siriwatknp, @zanivan + +## 5.15.3 + +<!-- generated comparing v5.15.2..master --> + +_Jan 3, 2024_ + +A big thanks to the 11 contributors who made this release possible. +This release was mostly about 🐛 bug fixes and 📚 documentation improvements. + +### `@mui/material-nextjs@5.15.3` + +- ​<!-- 06 -->[material-nextjs] Fix order of emotion server (#40409) @siriwatknp + +### `@mui/base@5.0.0-beta.30` + +- ​<!-- 40 -->[useSlider] Rearrange passive option in eventlisteners (#40235) @Kamino0 + +### `@mui/lab@5.0.0-alpha.159` + +- ​<!-- 14 -->Add use client directive (#40358) @DiegoAndai + +### `@mui/material-next@6.0.0-alpha.116` + +- ​<!-- 13 -->[List] Copy all List\* components to material-next package (#40367) @sai6855 +- ​<!-- 12 -->Update CONTRIBUTING guide given v6/v7 rescheduling (#40363) @DiegoAndai +- ​<!-- 11 -->[MenuItem] Fix spec import (#40271) @DiegoAndai +- ​<!-- 10 -->[Option] Add Option component (#40270) @DiegoAndai +- ​<!-- 09 -->[Slider] Replace lodash with internal utils (#40261) @DiegoAndai +- ​<!-- 08 -->[Switch] Change files to TypeScript (#39894) @lhilgert9 +- ​<!-- 07 -->[theme] Move ref palette out of color schemes (#40341) @DiegoAndai + +### Docs + +- ​<!-- 41 -->[base-ui] Polish the Table Pagination demos (#40281) @danilo-leal +- ​<!-- 22 -->[joy-ui] Fix dashboard template console errors (#40316) @oliviertassinari +- ​<!-- 21 -->[joy-ui] Fix image size on the Files template (#40315) @oliviertassinari +- ​<!-- 20 -->[material-ui] Revise the Divider page (#40356) @danilo-leal +- ​<!-- 19 -->[material-ui] Polish the Next.js integration page (#40317) @oliviertassinari +- ​<!-- 18 -->[material-ui] Adding autoFocus on Virtual Popover (#40239) @aacevski +- ​<!-- 17 -->[material-ui] Revise the Roadmap page (#40054) @danilo-leal +- ​<!-- 16 -->[material-ui] Update the "showing and hiding" section on the Tooltip page (#40283) @anle9650 +- ​<!-- 05 -->[material-ui] Fix Slider's customized iOS demo to use updated official colors (#39813) @Super-Kenil +- ​<!-- 15 -->[examples] Simplify Next.js example (#40318) @oliviertassinari + +### Core + +- ​<!-- 39 -->[blog] Update open-graph cards for all posts (#40328) @danilo-leal +- ​<!-- 38 -->[blog] Correct git diff @oliviertassinari +- ​<!-- 37 -->[code-infra] Update lerna and unpin its version (#40399) @michaldudak +- ​<!-- 36 -->[code-infra] Break package dependency cycle between @mui/material and @mui/icons-material (#40400) @michaldudak +- ​<!-- 35 -->[code-infra] Break package dependency cycles (#40398) @michaldudak +- ​<!-- 34 -->[code-infra] Sync bug issue template (#40305) @oliviertassinari +- ​<!-- 33 -->[docs] Fix 301 link to Base UI (#40396) @oliviertassinari +- ​<!-- 32 -->[docs] Link new MUI X components in sidnav (#40345) @oliviertassinari +- ​<!-- 31 -->[docs] Fix 301 links to Toolpad @oliviertassinari +- ​<!-- 30 -->[docs] Remove old notifications @oliviertassinari +- ​<!-- 29 -->[docs] Always mention the npm tag with npx (#40335) @oliviertassinari +- ​<!-- 28 -->[docs] Reduce network use on the All Components pages (#40313) @oliviertassinari +- ​<!-- 27 -->[docs-infra] Fix missing button aria-label (#40394) @oliviertassinari +- ​<!-- 26 -->[docs-infra] Fix a11y violation rule (#40393) @oliviertassinari +- ​<!-- 25 -->[docs-infra] Prefetch pages on hover (#40314) @oliviertassinari +- ​<!-- 24 -->[docs-infra] Fix footer links to link to the main domain (#40373) @oliviertassinari +- ​<!-- 23 -->[docs-infra] Add stray design adjustments (#40347) @danilo-leal +- ​<!-- 04 -->[website] Fix Base UI page's component section imports & styles (#40231) @danilo-leal +- ​<!-- 03 -->[website] Fix outdated Nhost image link @oliviertassinari +- ​<!-- 02 -->[website] Shorten Joy UI description, 7 chars too long @oliviertassinari +- ​<!-- 01 -->[website] Update some social preview images (#40282) @danilo-leal + +All contributors of this release in alphabetical order: @aacevski, @anle9650, @danilo-leal, @DiegoAndai, @Kamino0, @lhilgert9, @michaldudak, @oliviertassinari, @sai6855, @siriwatknp, @Super-Kenil + +## 5.15.2 + +<!-- generated comparing v5.15.1..master --> + +_Dec 25, 2023_ + +A big thanks to the 13 contributors who made this release possible. Here are some highlights ✨: + +- 🚀 Added support for callbacks in the [variant's props definition](https://mui.com/material-ui/customization/theme-components/#creating-new-component-variants) (#40094) @mnajdova +- 💫 Published a [blogpost](https://mui.com/blog/2023-material-ui-v6-and-beyond/) for the 2024's plan about Material UI + +### `@mui/material@5.15.2` + +- ​<!-- 31 -->[Badge] Use the variants API in the styled call (#40213) @mnajdova +- ​<!-- 04 -->[Paper] Add missing Paper classes descriptions (#40300) @sai6855 + +### `@mui/system@5.15.2` + +- ​<!-- 03 -->Support props callback in the variant's definition (#40094) @mnajdova + +### `@mui/base@5.0.0-beta.29` + +- ​<!-- 29 -->[Popup] Use context-based transition API (#39326) @michaldudak +- ​<!-- 28 -->[Popup] Popup no longer opens outside viewport (#39827) @adamhylander +- ​<!-- 27 -->[useSelect] Refactor to use DOM focus management instead of active descendant (#39675) @DiegoAndai + +### `@mui/material-next@6.0.0-alpha.115` + +- ​<!-- 15 -->[material-next][Divider]Divider ts support (#40307) @sai6855 + +### Docs + +- ​<!-- 30 -->[base-ui] Fix form submission Select demo (#40014) @ZeeshanTamboli +- ​<!-- 24 -->[blog] Add Material UI v6 and beyond blog post (#40242) @mnajdova +- ​<!-- 10 -->[material-ui] Fix broken links in the All components page (#40303) @muazaqdas +- ​<!-- 09 -->[material-ui] Fix broken links on the All components page (#40279) @danilo-leal +- ​<!-- 08 -->[material-ui] Add aria-current for nav tabs demo (#39594) @Kimzify +- ​<!-- 07 -->[material-ui] Add an "All components" page (#40256) @danilo-leal +- ​<!-- 06 -->[material-ui][Tooltip] Add demo to show how to change distance between tooltip and its anchor (#40087) @anle9650 + +### Core + +- ​<!-- 26 -->[blog] Fix 301 redirection @oliviertassinari +- ​<!-- 25 -->[blog] Reduce max image size @oliviertassinari +- ​<!-- 23 -->[code-infra] Extract Babel macro from mui-utils (#40262) @michaldudak +- ​<!-- 22 -->[core] Simplify a bit the release instructions @oliviertassinari +- ​<!-- 21 -->[core] Push force to deploy is not unexpected @oliviertassinari +- ​<!-- 20 -->[core] Fix CSS2 vs. CSS3 ::after syntax @oliviertassinari +- ​<!-- 19 -->[core] Fix CSS2 vs. CSS3 ::before syntax @oliviertassinari +- ​<!-- 05 -->[core] Use direct import from utils package (#40254) @siriwatknp +- ​<!-- 18 -->[core] Yaml format match most common convention @oliviertassinari +- ​<!-- 17 -->[core] Polish docs-feedback issue template @oliviertassinari +- ​<!-- 16 -->[core] Pin Node version on GitHub Actions to 18.18 (#40187) @michaldudak +- ​<!-- 14 -->[docs] Fix SEO regression (#40306) @oliviertassinari +- ​<!-- 13 -->[docs] Fix docs redirections @oliviertassinari +- ​<!-- 12 -->[docs] Update the Contributing guide to give more guidance on documentation (#40274) @samuelsycamore +- ​<!-- 11 -->[docs-infra] Add polish to the inline code block (#40260) @danilo-leal +- ​<!-- 02 -->[website] Update Gold sponsors: add RxDB, standardize formatting (#40273) @samuelsycamore +- ​<!-- 01 -->[website] Revert change to homepage SEO attributes @oliviertassinari + +All contributors of this release in alphabetical order: @adamhylander, @anle9650, @danilo-leal, @DiegoAndai, @Kimzify, @michaldudak, @mnajdova, @muazaqdas, @oliviertassinari, @sai6855, @samuelsycamore, @siriwatknp, @ZeeshanTamboli + +## 5.15.1 + +<!-- generated comparing v5.15.0..master --> + +_Dec 19, 2023_ + +A big thanks to the 15 contributors who made this release possible. +This release was mostly about 🐛 bug fixes and 📚 documentation improvements. + +### `@mui/material@5.15.1` + +- ​<!-- 13 -->[CardActions][DialogActions] Apply margin for all children except for 1st child (#40168) @sai6855 +- ​<!-- 03 -->[TablePagination] Add ability to change icons in TablePaginationActions using `slots` and `slotProps` (#33797) @pratikkarad +- ​<!-- 13 -->[CssVarsProvider] Fix HSL breaking button styles (#39869) @gitstart + +### `@mui/joy@5.0.0-beta.19` + +- ​<!-- 05 -->[FormControl] Fix issue with the conditional setting of `htmlFor` and `id` attributes not functioning properly for form labels (#40180) @ReaZzy +- ​<!-- 04 -->[typescript] Address TypeScript issue with custom zIndex not functioning (#40133) @qiweiii + +### `@mui/styled-engine-sc@6.0.0-alpha.9` + +- ​<!-- 02 -->[typescript] Fix `theme` being of type any (#40200) @mnajdova + +### Docs + +- ​<!-- 09 -->[joy-ui] Fix typo in the CSS baseline page (#40222) @possibilities +- ​<!-- 08 -->[joy-ui] Document missing Autocomplete props (#39979) @ZeeshanTamboli +- ​<!-- 10 -->[joy-ui] Fix typo about Typography levels (#40230) @zanivan +- ​<!-- 07 -->[material-ui] Update the related projects page to list `mui-tiptap` for rich text (#40216) @sjdemartini +- ​<!-- 06 -->[material-ui] Fix typo in the Next.js integration page (#40209) @s8990 + +### Core + +- ​<!-- 14 -->[blog] Fix access to Notion without an account @oliviertassinari +- ​<!-- 12 -->[core] Update workflows and issue templates to reflect the updated label (#40197) @MBilalShafi +- ​<!-- 11 -->[docs] Replace Twitter with X (#40193) @mbrookes +- ​<!-- 10 -->[docs-infra] Uplift the Algolia search modal design (#40186) @danilo-leal +- ​<!-- 01 -->[website] Update product descriptions and social preview images (#32181) @danilo-leal + +All contributors of this release in alphabetical order: @danilo-leal, @gitstart, @MBilalShafi, @mbrookes, @mnajdova, @oliviertassinari, @possibilities, @pratikkarad, @qiweiii, @ReaZzy, @s8990, @sai6855, @sjdemartini, @zanivan, @ZeeshanTamboli + +## 5.15.0 + +<!-- generated comparing v5.14.20..master --> + +_Dec 11, 2023_ + +A big thanks to the 15 contributors who made this release possible. Here are some highlights ✨: + +- 🚀 Added [a new package for a better Material UI integration with Next.js](https://mui.com/material-ui/guides/nextjs) (#39947) @siriwatknp + +### `@mui/material@5.15.0` + +- ​<!-- 12 -->Revert "[Select][material-ui] Add name to hidden input element" (#40174) @mj12albert +- ​<!-- 02 -->[material-ui] Refactor ComponentsVariants type into a generic (#39623) @blakenetz + +### `@mui/material-nextjs@5.15.0` + +- ​<!-- 01 -->[material-ui] Add new Next.js integration package (#39947) @siriwatknp + +### `@mui/material-next@6.0.0-alpha.113` + +- ​<!-- 11 -->[Badge][material-next] Apply new OwnerState type to Badge (#40119) @lhilgert9 +- ​<!-- 06 -->[material-next][ButtonGroup] Change `ButtonGroup` files to ts (#39794) @lhilgert9 + +### `@mui/icons-material@5.15.0` + +- ​<!-- 05 -->[icons] Add X logo (#38811) @abreel + +### `@mui/base@5.0.0-beta.27` + +- ​<!-- 10 -->[base-ui] useControllableReducer warns when controlled props become uncontrolled (and vice versa) (#39096) @mj12albert + +### `@mui/joy@5.0.0-beta.18` + +- ​<!-- 04 -->[joy-ui][Radio][Input] Fix inheritance of disabled prop (#39934) @sai6855 + +### `@mui/lab@5.0.0-alpha.156` + +- ​<!-- 03 -->[lab][LoadingButton] LoadingButton now inherits props from ButtonGroup (#39679) @lhilgert9 + +### Docs + +- ​<!-- 09 -->[docs] Fix reference to non-existent checkmark in supported-components.md (#40056) @mbrookes +- ​<!-- 09 -->[docs][base-ui] Add copy button & primary color picker to the component gallery page (#39884) @mnajdova +- ​<!-- 08 -->[docs-infra] Update CodeSandbox links (#39992) @anle9650 +- ​<!-- 04 -->[material-ui][docs] Fix wrong root element for emotion styles in shadow DOM (#35326) @EloB +- ​<!-- 03 -->[material-ui][docs] Move the responsive font charts from recharts to MUI X (#40097) @alexfauquette +- ​<!-- 02 -->[joy-ui][templates] Remove outdated code (#40095) @zanivan +- ​<!-- 05 -->[material-ui][docs][Popper] Update Positioned Popper demo styles (#40170) @sai6855 + +### Core + +- ​<!-- 08 -->[blog] Add a Phuket retreat blog post (#40055) @mikailaread +- ​<!-- 07 -->[blog] Adjust the latest MUI X blog post (#40046) @danilo-leal +- ​<!-- 05 -->[core] Migrate from tslint to eslint (#40020) @ZeeshanTamboli + +All contributors of this release in alphabetical order: @abreel, @alexfauquette, @anle9650, @blakenetz, @danilo-leal, @EloB, @lhilgert9, @mbrookes, @mikailaread, @mj12albert, @mnajdova, @sai6855, @siriwatknp, @zanivan, @ZeeshanTamboli + +## 5.14.20 + +<!-- generated comparing v5.14.19..master --> + +_Dec 5, 2023_ + +A big thanks to the 14 contributors who made this release possible. +This release was mostly about 🐛 bug fixes and 📚 documentation improvements. + +### `@mui/material-next@6.0.0-alpha.112` + +- ​<!-- 07 -->[Menu] Enable again the usage of the autoFocus prop (#39960) @mnajdova +- ​<!-- 06 -->[ProgressIndicator] Apply MD3 style to `CircularProgress` (#39825) @lhilgert9 + +### Docs + +- ​<!-- 15 -->Remove outdated showcase (#40063) @oliviertassinari +- ​<!-- 14 -->Support yaml as prism language (#40044) @Janpot +- ​<!-- 12 -->[material-ui] Fix SearchAppBar width on `sm` screens (#40049) @DiegoAndai +- ​<!-- 11 -->[material-ui] Update the basic Grid section copy (#40035) @REX500 +- ​<!-- 10 -->[material-ui] Add a react-admin example project (#39972) @fzaninotto +- ​<!-- 09 -->[material-ui][TextField] Add a performance section (#39692) @anle9650 +- ​<!-- 05 -->[material-ui][tabs] Refine scrollable tabs description (#40037) @zanivan +- ​<!-- 08 -->[system] Fix typo on the CSS theme variables page (#40040) @caweidmann + +### Core + +- ​<!-- 17 -->[blog] Fix scrollbar on mobile (#40057) @oliviertassinari +- ​<!-- 16 -->[blog] Fix link to charts getting started page (#40043) @alexfauquette +- ​<!-- 13 -->[docs-infra] Simplify CSS classes extraction in API docs generator (#39808) @michaldudak +- ​<!-- 04 -->[website] Polish dark mode colors (#40052) @danilo-leal +- ​<!-- 03 -->[website] Add why Design Engineer for data grid (#40016) @oliviertassinari +- ​<!-- 02 -->[website] Add stray fixes to the Base UI page (#40051) @danilo-leal +- ​<!-- 01 -->[website] Revise the Developer Advocate job posting (#39210) @samuelsycamore + +All contributors of this release in alphabetical order: @alexfauquette, @anle9650, @caweidmann, @danilo-leal, @DiegoAndai, @fzaninotto, @Janpot, @lhilgert9, @michaldudak, @mnajdova, @oliviertassinari, @REX500, @samuelsycamore, @zanivan + +## 5.14.19 + +<!-- generated comparing v5.14.18..master --> + +_Nov 29, 2023_ + +A big thanks to the 18 contributors who made this release possible. Here are some highlights ✨: + +- 🐛 Fix Material UI Autocomplete behavior when there are duplicate labels (#36426) @islandryu +- 🚀 Added Material You Linear Progress to `material-next` package (#39807) @lhilgert9 + +### `@mui/material@5.14.19` + +- ​<!-- 44 -->[Autocomplete] Fix behavior when there are duplicate labels (#36426) @islandryu +- ​<!-- 37 -->[Box] Added boxClasses (#39889) @sadik-malik +- ​<!-- 18 -->[FilledInput] Fix slot props deepmerge order (#38922) @dhaub-exelixis +- ​<!-- 12 -->[Select] Add id to hidden input element (#39414) @DarhkVoyd +- ​<!-- 11 -->[Select] Remove unnecessary picking of `onChange` type from SelectInputProps (#39891) @ZeeshanTamboli + +### `@mui/base@5.0.0-beta.25` + +- ​<!-- 46 -->[Menu] Fix navigation of items when 1st item is disabled (#39828) @sai6855 +- ​<!-- 42 -->[Modal] Refine demos (#39824) @zanivan +- ​<!-- 41 -->[NumberInput] Implement `numberInputReducer` (#38723) @mj12albert +- ​<!-- 40 -->[useNumberInput] Fix change handlers passed through slotProps (#39407) @mj12albert + +### `@mui/joy@5.0.0-beta.16` + +- ​<!-- 38 -->[Box] Added boxClasses (#39895) @sadik-malik + +### `@mui/system@5.14.19` + +- ​<!-- 36 -->[Box] Added boxClasses (#39896) @sadik-malik +- ​<!-- 09 -->Add outlineColor to defaultSxConfig (#39962) @brijeshb42 + +### `@mui/types@7.2.10` + +- ​<!-- 08 -->Add `PartiallyRequired` type (#39939) @lhilgert9 + +### `@mui/material-next@6.0.0-alpha.111` + +- ​<!-- 47 -->[ProgressIndicator] Apply MD3 style to `LinearProgress` (#39807) @lhilgert9 +- ​<!-- 17 -->[FormHelperText] Add FormHelperText component (#39503) @mj12albert +- ​<!-- 16 -->[IconButton] Copy IconButton to material-next (#39945) @mj12albert +- ​<!-- 13 -->[Switch] Copy `Switch` to material next (#39887) @lhilgert9 + +### Docs + +- ​<!-- 19 -->[material-ui] Fix theme prop in v5 migration guide (#39976) @sai6855 +- ​<!-- 43 -->[base-ui] Improve Next.js Link docs (#39838) @oliviertassinari +- ​<!-- 39 -->[base-ui] Export Base UI theme in stylesheet (#39694) @mnajdova +- ​<!-- 52 -->[joy-ui] Fix the date min & max slot props values on the Input demo (#40018) @avikalpg +- ​<!-- 35 -->[joy-ui][ButtonGroup] Fix orientation prop description (#39876) @sai6855 +- ​<!-- 25 -->[joy-ui] Update gif from the Dark Mode Optimization page (#39726) @danilo-leal +- ​<!-- 24 -->[joy-ui] Fix h1 template (#40017) @oliviertassinari +- ​<!-- 23 -->[joy-ui] Fix wrong product id @oliviertassinari +- ​<!-- 22 -->[joy-ui] Fixes in theme scoping documentation (#39899) @ZeeshanTamboli +- ​<!-- 21 -->[joy-ui] Refine the Email, Teams and Files templates (#39579) @zanivan +- ​<!-- 15 -->[joy-ui][templates] Fix layout shift on Profile template (#40022) @zanivan +- ​<!-- 14 -->[joy-ui][Templates] Update thumbnails (#39938) @zanivan +- ​<!-- 20 -->[material-next] Add contributing guide (#39944) @mj12albert +- ​<!-- 51 -->End v6 blogpost notification (#39879) @joserodolfofreitas +- ​<!-- 31 -->Fix nested CSS warning (#39932) @mnajdova +- ​<!-- 30 -->Make integration searchable (#39967) @oliviertassinari +- ​<!-- 29 -->Fix use of quote in markdown (#39953) @oliviertassinari +- ​<!-- 28 -->Show design links on Joy UI (#39955) @oliviertassinari +- ​<!-- 27 -->Restore Algolia results when searching for "Figma" (#39956) @oliviertassinari +- ​<!-- 26 -->Fix two tone icon dark mode color (#39868) @mnajdova + +### Core + +- ​<!-- 45 -->Improve lerna's renovate package rules (#40029) @DiegoAndai +- ​<!-- 34 -->Downgrade lerna to 7.2.0 (#40026) @DiegoAndai +- ​<!-- 32 -->Rename OpenCollective @oliviertassinari +- ​<!-- 48 -->[docs-infra] Env variables should be string (#39991) @oliviertassinari +- ​<!-- 10 -->[Portal] Improve docs for container prop (#39180) @oliviertassinari +- ​<!-- 50 -->[website] Update pricing table (#40023) @cherniavskii +- ​<!-- 49 -->[website][docs] Update the product identifier menu and X page (#39832) @danilo-leal +- ​<!-- 07 -->[website] Mark TreeView and Charts as stable (#39975) @flaviendelangle +- ​<!-- 06 -->[website] Update career page (#40015) @oliviertassinari +- ​<!-- 05 -->[website] Sync about dataset @oliviertassinari +- ​<!-- 04 -->[website] Fix 301 redirection to X tree-view @oliviertassinari +- ​<!-- 03 -->[website] Change redirection prefixes @oliviertassinari +- ​<!-- 02 -->[website] Fix 301 link @oliviertassinari +- ​<!-- 01 -->[website] Fix modal not being closed with the escape key on the Base UI page (#39880) @ZeeshanTamboli + +All contributors of this release in alphabetical order: @avikalpg, @brijeshb42, @cherniavskii, @danilo-leal, @DarhkVoyd, @dhaub-exelixis, @DiegoAndai, @flaviendelangle, @islandryu, @joserodolfofreitas, @lhilgert9, @mj12albert, @mnajdova, @oliviertassinari, @sadik-malik, @sai6855, @zanivan, @ZeeshanTamboli + +## 5.14.18 + +<!-- generated comparing v5.14.17..master --> + +_Nov 14, 2023_ + +A big thanks to the 14 contributors who made this release possible. Here are some highlights ✨: + +- 💫 Introduced new [Stepper](https://mui.com/joy-ui/react-stepper/) component in Joy UI (#39688) @siriwatknp +- other 🐛 bug fixes and 📚 documentation improvements + +### `@mui/material@5.14.18` + +- ​<!-- 32 -->[Autocomplete] Add `defaultMuiPrevented` to onKeyDown type (#39820) @sai6855 +- ​<!-- 31 -->[Autocomplete] Fix React key warning in Next.js (#39795) @mj12albert +- ​<!-- 24 -->[Checkbox] Asterisk placement aligned correctly (#39721) @axelbostrom +- ​<!-- 04 -->[Rating] Fix the hover highlighting for spaced icons (#39775) @ZeeshanTamboli +- ​<!-- 03 -->[TablePagination] Implement `slotProps` pattern for the actions and the select slots (#39353) @anle9650 +- ​<!-- 02 -->[TextField] Fix padding on small filled multiline TextField (#39769) @mj12albert + +### `@mui/joy@5.0.0-beta.15` + +- ​<!-- 11 -->[Stepper] Add new `Stepper` component (#39688) @siriwatknp +- ​<!-- 12 -->[Select] Fix displaying placeholder when multiple is true (#39806) @sai6855 + +### `@mui/material-next@6.0.0-alpha.110` + +- ​<!-- 26 -->[ButtonGroup] Copy `ButtonGroup` to material next (#39739) @lhilgert9 +- ​<!-- 09 -->[ProgressIndicator] Change `CircularProgress` files to ts (#39791) @lhilgert9 +- ​<!-- 08 -->[ProgressIndicator] Change `LinearProgress` files to ts (#39793) @lhilgert9 +- ​<!-- 07 -->[ProgressIndicator] Copy `LinearProgress` to material next (#39779) @lhilgert9 +- ​<!-- 06 -->[ProgressIndicator] Copy `CircularProgress` to material next (#39780) @lhilgert9 +- ​<!-- 05 -->[TextField] Add FormLabel and InputLabel components (#39483) @mj12albert + +## Docs + +- ​<!-- 30 -->[base-ui][NumberInput] Fix inconsistent demo component names (#39786) @mnajdova +- ​<!-- 29 -->[base-ui][Menu] Refine demos (#39823) @zanivan +- ​<!-- 28 -->[base-ui][Switch] Refine demos (#39822) @zanivan +- ​<!-- 16 -->[joy-ui] Fix API generation for Grid (#39861) @oliviertassinari +- ​<!-- 15 -->[joy-ui] Fix menu in color inversion header demo (#39785) @sai6855 +- ​<!-- 14 -->[joy-ui] Change the design kit link on the Overview page (#39725) @danilo-leal +- ​<!-- 13 -->[joy-ui] Add `CssBaseline` to integration with Material UI page (#39790) @swillianc +- ​<!-- 10 -->[joy-ui][Tabs] Add wordBreak style to demo (#39821) @sai6855 + +## Core + +- ​<!-- 27 -->[blog] MUI X late v6 blog post (#39700) @joserodolfofreitas +- ​<!-- 25 -->[CHANGELOG] Correct the Joy UI version in the changelog (#39788) @michaldudak +- ​<!-- 23 -->[core] Remove legacy docs files (#39860) @oliviertassinari +- ​<!-- 22 -->[core] Fix GitHub title tag consistency @oliviertassinari +- ​<!-- 21 -->[core] Make the API docs builder configurable per project (#39772) @michaldudak +- ​<!-- 20 -->[docs] Fix the default theme viewer font family (#39782) @danilo-leal +- ​<!-- 19 -->[docs-infra] Fix hydration api (#39706) @oliviertassinari +- ​<!-- 18 -->[docs-infra] Adjust the website & docs footer (#39810) @danilo-leal +- ​<!-- 17 -->[docs-infra] Fix bug on API prop copy experience (#39707) @oliviertassinari +- ​<!-- 01 -->[website] Change roadmap link destination (#39639) @danilo-leal + +All contributors of this release in alphabetical order: @anle9650, @axelbostrom, @danilo-leal, @joserodolfofreitas, @lhilgert9, @michaldudak, @mj12albert, @mnajdova, @oliviertassinari, @sai6855, @siriwatknp, @swillianc, @zanivan, @ZeeshanTamboli + +## 5.14.17 + +<!-- generated comparing v5.14.16..master --> + +_Nov 6, 2023_ + +A big thanks to the 12 contributors who made this release possible. +This release was mostly about 🐛 bug fixes and 📚 documentation improvements. + +### `@mui/material@5.14.17` + +- [Dialog] Should not close until the IME is cancelled (#39713) @megos +- [InputBase] Add `sx` type to `input` and `root` slot (#39569) @sai6855 + +### `@mui/joy@5.0.0-beta.14` + +- [ModalDialog] Remove redundant code (#39719) @sai6855 +- [ToggleButtonGroup] Fix toggling button state when `Button` is not immediate children (#39571) @sai6855 + +### `@mui/base@5.0.0-beta.23` + +- Make list components more reliable (#39380) @michaldudak + +### `@mui/material-next@6.0.0-alpha.109` + +- [InputBase] InputBase slotProps accepts sx type (#39714) @mj12albert +- [OutlinedInput] Copy v5 OutlinedInput (#39698) @mj12albert + +### `@mui/lab@5.0.0-alpha.152` + +- [TreeView] Remove tree view import from @mui/lab (#39685) @alexfauquette + +### Docs + +- Update Taiwan country name in demos (#39729) @chiahao +- Update release doc for unchanged packages (#39487) @brijeshb42 +- [joy-ui] Make code readable to set next color in color inversion demos (#39669) @ZeeshanTamboli +- [material-ui] Remove numeric input workaround from TextField docs (#39629) @mj12albert +- [material-ui] Add comment about code to be removed from Drawer demo (#39678) @samuelsycamore + +### Core + +- [docs-infra] Fix path bloat client-side (#39708) @oliviertassinari +- [docs-infra] Render footer in SSR (#39710) @oliviertassinari +- [docs-infra] Simplify footer (#39709) @oliviertassinari +- [docs-infra] Fix dark theme color (#39720) @alexfauquette +- [docs-infra] Remove the design feedback alert (#39691) @danilo-leal +- [docs-infra] Bring back scroll gradient in API page with table (#39689) @alexfauquette +- [docs-infra] Clarify the content of the ads @oliviertassinari +- [docs-infra] Link to ScaffoldHub v2 @oliviertassinari +- [docs-infra] Improve access to the component demos via the API page (#39690) @danilo-leal +- [docs-infra] Add appropriate aria-label to docs buttons (#39638) @danilo-leal +- [docs-infra] Fix crawler on API pages (#39490) @alexfauquette +- [docs–infra] Small polish on API toggle (#39704) @oliviertassinari +- [core] Speed up the CI by removing the second build (#39684) @michaldudak +- [core][docs] Fix broken MUI System link in README.md (#39734) @samuelsycamore +- [website] List benefits for sponsors (#39640) @oliviertassinari +- [website] Add Vadym teamMember card to 'About' (#39701) @hasdfa +- [test] Fix flaky screenshot (#39711) @oliviertassinari + +All contributors of this release in alphabetical order: @alexfauquette, @brijeshb42, @chiahao, @danilo-leal, @hasdfa, @megos, @michaldudak, @mj12albert, @oliviertassinari, @sai6855, @samuelsycamore, @ZeeshanTamboli + +## 5.14.16 + +<!-- generated comparing v5.14.15..master --> + +_Oct 31, 2023_ + +A big thanks to the 19 contributors who made this release possible. Here are some highlights ✨: + +- ✨ New highly requested Joy UI component: [Snackbar](https://mui.com/joy-ui/react-snackbar) (#38801) @ZeeshanTamboli + +### `@mui/material@5.14.16` + +- ​<!-- 03 -->Fix ownerstate being propagated to DOM node when using styled-components v6 (#39586) @mnajdova + +### `@mui/base@5.0.0-beta.22` + +- ​<!-- 28 -->[Autocomplete] Standardize box shadow on demos (#39519) @zanivan +- ​<!-- 27 -->[useSelect] Support browser autofill (#39595) @DiegoAndai +- ​<!-- 30 -->[base-ui] Fix mergeSlotProps className join order (#39616) @mj12albert + +### `@mui/joy@5.0.0-beta.13` + +- ​<!-- 29 -->[Accordion] Add type button to accordion +- ​<!-- 28 -->[Card] Fix CardOverflow in nested cards (#39668) @siriwatknp summary (#39532) @Popppins +- ​<!-- 08 -->[Menu] Fix closing of listbox in `MenuList` demo (#39459) @sai6855 +- ​<!-- 07 -->[Progress] Revamp Linear and Circular progress variants (#39492) @zanivan +- ​<!-- 06 -->[Select] Support selection of `multiple` options (#39454) @sai6855 +- ​<!-- 05 -->[Textarea] Add ref usage instructions (#39615) @danilo-leal +- ​<!-- 10 --> Fix sticky hover media query issue on mobile (#37467) @gitstart +- ​<!-- 09 --> Add Snackbar component (#38801) @ZeeshanTamboli + +### `@mui/material-next@6.0.0-alpha.108` + +- ​<!-- 04 -->[theme] Update Material You typescale tokens (#39514) @mj12albert + +### Docs + +- ​<!-- 22 -->Fix 301 link to Primer design system @oliviertassinari +- ​<!-- 19 -->[joy-ui] Revise the CSS vars page (#39335) @danilo-leal +- ​<!-- 18 -->[joy-ui] Add docs for changing styles based on states (#39597) @siriwatknp +- ​<!-- 17 -->[joy-ui] Fix wrong messages (#39602) @siriwatknp +- ​<!-- 16 -->[material-ui] Include link to bundler how-to for Styled Components users (#39620) @jcoyle37 +- ​<!-- 15 -->[material-ui] Improve Dialog demos (#39642) @ZeeshanTamboli +- ​<!-- 14 -->[material-ui] Add stray design fine-tuning to the example collection (#39581) @danilo-leal +- ​<!-- 13 -->[system] Clean up `@mui/styles` docs and discourage users from installing it (#39644) @samuelsycamore +- ​<!-- 12 -->[examples] Upgrade Remix to v2 (#39229) @Nkzn +- ​<!-- 11 -->[examples][material-ui] Remove hardcoded `color="black"` from Next.js App Router layout (#39577) @samuelsycamore + +### Core + +- ​<!-- 26 -->[core] Setup vale for enforcing style guides (#39633) @alexfauquette +- ​<!-- 25 -->[core] Remove unused use client (#38967) @oliviertassinari +- ​<!-- 24 -->[core] Remove duplicate export (#39346) @oliviertassinari +- ​<!-- 23 -->[core] Remove not used `@types/loader-utils` package from `zero-next-plugin` (#39609) @ZeeshanTamboli +- ​<!-- 21 -->[docs-infra] Add meta charset in codesandbox examples (#39424) @Janpot +- ​<!-- 20 -->[docs-infra] Fix settings drawer accessibility issues (#39589) @emamoah +- ​<!-- 02 -->[website] Add stray adjustments and clean-ups (#39673) @danilo-leal +- ​<!-- 01 -->[website] Open the `Design Engineer - xGrid` role (#39375) @DanailH + +All contributors of this release in alphabetical order: @alexfauquette, @Best-Sardar, @DanailH, @danilo-leal, @DiegoAndai, @emamoah, @gitstart, @Janpot, @jcoyle37, @mj12albert, @mnajdova, @Nkzn, @oliviertassinari, @Popppins, @sai6855, @samuelsycamore, @siriwatknp, @zanivan, @ZeeshanTamboli + +## 5.14.15 + +<!-- generated comparing v5.14.14..master --> + +_Oct 24, 2023_ + +A big thanks to the 17 contributors who made this release possible. + +### `@mui/material@5.14.15` + +- ​<!-- 24 -->[Checkbox][Radio] Fix theme style overrides not working for different sizes (#39377) @gitstart +- ​<!-- 12 -->[InputLabel] InputLabel supports ownerState.focused for styleOverrides (#39470) @mj12albert +- ​<!-- 07 -->[ToggleButton] Add `fullWidth` to `toggleButtonClasses` and `toggleButtonGroupClasses` (#39536) @Semigradsky + +### `@mui/base@5.0.0-beta.21` + +- ​<!-- 29 -->[useAutocomplete] Correct keyboard navigation with multiple disabled options (#38788) @VadimZvf +- ​<!-- 28 -->[Select] Standardize box shadow on demos (#39509) @zanivan +- ​<!-- 27 -->[Slider] Refine demos (#39526) @zanivan +- ​<!-- 34 -->[Input] Update and port additional tests from material-ui (#39584) @mj12albert + +### `@mui/material-next@6.0.0-alpha.107` + +- ​<!-- 16 -->[FilledInput] Add FilledInput component (#39307) @mj12albert +- ​<!-- 13 -->[InputAdornment] Fix unstable_capitalize import (#39510) @DiegoAndai +- ​<!-- 08 -->[Snackbar] copy files to mui-material-next (#39232) @Best-Sardar +- ​<!-- 33 -->[Menu] Use useMenu hook (#38934) @mnajdova + +### `@mui/joy@5.0.0-beta.12` + +- ​<!-- 26 -->[Button] Fix button size being a decorator (#39529) @siriwatknp +- ​<!-- 25 -->[CardOverflow] Remove conditional CSS to support Next.js App dir (#39101) @siriwatknp +- ​<!-- 11 -->[Link] Apply `userSelect: none` only when it's a button (#39486) @mwskwong + +### `@mui/lab@5.0.0-alpha.150` + +- ​<!-- 09 -->Update peer dep of @mui/material (#39398) @brijeshb42 + +### `@pigment-css/react@0.0.1-alpha.0` + +- ​<!-- 06 -->Implement typings for public runtime API (#39215) @brijeshb42 + +### `@mui/zero-vite-plugin@0.0.1-alpha.0` + +- ​<!-- 05 -->Modify plugin to transform node_modules (#39517) @brijeshb42 + +### Docs + +- ​<!-- 31 -->[base-ui] Standardize grey palette across demos (#39504) @zanivan +- ​<!-- 30 -->[base-ui] Overall demos design review (#38820) @zanivan +- ​<!-- 19 -->[joy-ui] Adjust the responsiveness of the template card (#39534) @danilo-leal +- ​<!-- 18 -->[material-ui] Typo fixes in overview page (#39540) @Evan151 +- ​<!-- 35 -->[material-ui] Add stray design tweaks to the templates collection (#39583) @danilo-leal +- ​<!-- 17 -->[system] Revise the Box page (#39159) @danilo-leal +- ​<!-- 22 -->Fix git diff format @oliviertassinari +- ​<!-- 15 -->[I10n] Add Norwegian (nynorsk) (nn-NO) locale (#39481) @hjalti-lifekeys +- ​<!-- 10 -->[l10n] Fix double space typo in ar-EG @oliviertassinari +- ​<!-- 14 -->[I10n] Additions to Icelandic (is-IS) locale (#39480) @hjalti-lifekeys + +### Core + +- ​<!-- 23 -->[core] Replace a `useCallback` by `useRef` in useEventCallback (#39078) @romgrk +- ​<!-- 21 -->[docs-infra] Prevent docs crash (#39214) @alexfauquette +- ​<!-- 20 -->[docs-infra] Fix no-op autoprefixer warning (#39385) @oliviertassinari +- ​<!-- 32 -->[docs-infra] Refine the API page design (#39520) @alexfauquette +- ​<!-- 25 -->[docs-infra] Fix cut-off sponsors (#39572) @oliviertassinari +- ​<!-- 04 -->[website] Add missing h1 on page @oliviertassinari +- ​<!-- 03 -->[website] Fix unrecognized prop warning @oliviertassinari +- ​<!-- 02 -->[website] Store Engineer role filled @oliviertassinari +- ​<!-- 01 -->[website] Add stray design adjustments (#39496) @danilo-leal + +All contributors of this release in alphabetical order: @alexfauquette, @Best-Sardar, @brijeshb42, @danilo-leal, @DiegoAndai, @Evan151, @gitstart, @hjalti-lifekeys, @mj12albert, @mnajdova, @mwskwong, @oliviertassinari, @romgrk, @Semigradsky, @siriwatknp, @VadimZvf, @zanivan + +## 5.14.14 + +<!-- generated comparing v5.14.13..master --> + +_Oct 17, 2023_ + +A big thanks to the 24 contributors who made this release possible. Here are some highlights ✨: +This release was mostly about 🐛 bug fixes and 📚 documentation improvements. + +### `@mui/material@5.14.14` + +- ​<!-- 29 -->[material-ui][AppBar] Support all default palette colors in TypeScript (#39389) @BreakBB +- ​<!-- 28 -->[material-ui][AvatarGroup] Add `renderSurplus` prop (#39283) @uuxxx +- ​<!-- 25 -->[material-ui][Box] Fix system properties has incorrect `Theme` interface when applied directly (#39404) @Semigradsky +- ​<!-- 04 -->[material-ui][Pagination] Update `type` parameter of `getItemAriaLabel` prop (#39390) @Simer13 +- ​<!-- 06 -->[material][tab] Show/hide scroll buttons for dynamically added children (#39415) @brijeshb42 + +### `@mui/base@5.0.0-beta.20` + +- ​<!-- 26 -->[base-ui][Menu] Do not reopen the menu after clicking on a trigger in Safari (#39393) @michaldudak + +### `@mui/material-next@6.0.0-alpha.106` + +- ​<!-- 23 -->[Divider][material-next] Add Divider component (#39179) @Best-Sardar + +### `@mui/joy@5.0.0-beta.11` + +- ​<!-- 08 -->[joy-ui][List] Add the `marker` prop (#39313) @siriwatknp +- ​<!-- 07 -->[joy-ui][Skeleton] Fix semi-transparent scenario when with surface components and color inversion (#39400) @TheNatkat +- ​<!-- 06 -->[joy-ui][Textarea] Fix focus ring for error state (#39391) @vineetjk + +### `@mui/icons-material@5.14.14` + +- ​<!-- 09 -->[icons] Fix VoiceChatOutlined showing the wrong icon (#39418) @devuser200 + +### `@mui/system@5.14.14` + +- ​<!-- 03 -->[mui-system][style] bug fix for style value check color in nullable object (#39457) @DarhkVoyd + +### `@mui/styled-engine-sc@6.0.0-alpha.2` + +- ​<!-- 05 -->[styled-engine-sc] Fix TS issues because of missing types (#39395) @mnajdova + +### Docs + +- ​<!-- 27 -->[docs][base-ui] Renaming demos to BaseXxx (#39104) @christophermorin +- ​<!-- 26 -->[docs] Accessibility in Base UI (#39264) @michaldudak +- ​<!-- 22 -->[docs] Fix 301 redirection @oliviertassinari +- ​<!-- 21 -->[docs] Improve Base UI table of contents for APIs (#39412) @ZeeshanTamboli +- ​<!-- 20 -->[docs] Adjust design kits-related content (#39367) @danilo-leal +- ​<!-- 19 -->[docs] Revise the Contributing Guide (#39190) @samuelsycamore +- ​<!-- 12 -->[docs][joy-ui] Fix row hover prop name in the Table page (#39431) @adrienbrault +- ​<!-- 11 -->[docs][joy-ui] Fix color inversion demos (#39403) @danilo-leal +- ​<!-- 10 -->[docs][material-ui] Remove irrelevant TODO from Snackbar demo (#39396) @ZeeshanTamboli +- ​<!-- 06 -->[docs][material-ui][Table] Bug in "Sorting & Selecting" demo (#39426) @codewithrabeeh +- ​<!-- 05 -->[docs][joy-ui][typography] Update docs after lineHeight changes (#39366) @zanivan + +### Core + +- ​<!-- 24 -->[core] Fix multiple typos across the repo (#39422) @parikshitadhikari +- ​<!-- 18 -->[docs-infra] Add refinements to the API content design (#39425) @danilo-leal +- ​<!-- 17 -->[docs-infra] Add a min height to the layout component (#39416) @danilo-leal +- ​<!-- 16 -->[docs-infra] Prevent horizontal scroll in the TOC (#39417) @danilo-leal +- ​<!-- 15 -->[docs-infra] Add a collapsible list & table views to the API content display (#38265) @alexfauquette +- ​<!-- 14 -->[docs-infra] Adjust the `kbd` tag styles (#39397) @danilo-leal +- ​<!-- 13 -->[docs-infra] Fix strong style regression (#39384) @oliviertassinari +- ​<!-- 04 -->[website] Add the LinkedIn profile to the contributors section on the About page (#39455) @chhawinder +- ​<!-- 03 -->[website] Update new role template (#39386) @oliviertassinari +- ​<!-- 02 -->[website] Add stray design fine-tunning to the Pricing page (#39472) @danilo-leal +- ​<!-- 01 -->[website] Fix career anchor link to perks & benefits @oliviertassinari + +All contributors of this release in alphabetical order: @adrienbrault, @alexfauquette, @Best-Sardar, @BreakBB, @brijeshb42, @chhawinder, @christophermorin, @codewithrabeeh, @danilo-leal, @DarhkVoyd, @devuser200, @michaldudak, @mnajdova, @oliviertassinari, @parikshitadhikari, @samuelsycamore, @Semigradsky, @Simer13, @siriwatknp, @TheNatkat, @uuxxx, @vineetjk, @zanivan, @ZeeshanTamboli + +## 5.14.13 + +<!-- generated comparing v5.14.12..master --> + +_Oct 10, 2023_ + +A big thanks to the 22 contributors who made this release possible. Here are some highlights ✨: + +- 🚀 Added support for `styled-components` v6 (#39042) @mnajdova + +### `@mui/material@5.14.13` + +- [Checkbox] Fix checkbox hover bg with extendTheme (#39319) @brijeshb42 +- [Chip] Outlined Chip variant is wider than the Filled counterpart (#39342) @chirag3003 +- [Select] Add notice about select's a11y improvement on v5.14.12 changelog (#39310) @DiegoAndai +- [Typography] Color prop check for primitive type (#39071) @DarhkVoyd +- [Pagination] Fix background color on hover and keyboard focus when using CSS theme variables (#39220) @ValkonX33 +- [Popper] Add missing `styleOverrides` Popper type in theme (#39154) @axelbostrom +- [Slider] Support all default palette colors in TypeScript (#39058) @gugudwt + +### `@mui/base@5.0.0-beta.19` + +- [Menu] Add the anchor prop (#39297) @michaldudak + +### `@mui/material-next@6.0.0-alpha.105` + +- [Menu] Copy v5 Menu components (#39301) @mnajdova + +### `@mui/joy@5.0.0-beta.10` + +- [Autocomplete] Add `type=button` to clear button (#39263) @brijeshb42 +- [Button] Fix the text wrap issue (#38696) @atharva3333 +- [Drawer] Apply color inversion to content slot instead (#39312) @siriwatknp +- [Switch] Fix missing class name (#39327) @Bestwebdesign + +### `@mui/styled-engine-sc@6.0.0-alpha.1` + +- ​<!-- 03 -->[system] Add support for `styled-components` v6 (#39042) @mnajdova + +### Docs + +- [joy-ui] Adjust the templates page card design (#39369) @danilo-leal +- Rename the Data Grid "Quick filter" to "Search" (#37724) @alexfauquette +- Remove obsolete translations (#39221) @mbrookes +- Update link to add custom color in palette (#39359) @ZeeshanTamboli +- Denser code demo @oliviertassinari +- Set up MD3 experiments pages (#39323) @mj12albert +- [Drawer] Fix right anchored persistent drawer intercepts click when it is closed (#39318) @ZeeshanTamboli +- [joy-ui] Revise the Color Inversion page (#39306) @danilo-leal +- [joy-ui] Remove redundant `error` prop from input validation demo (#39280) @sai6855 +- [material-ui] Rename themed components doc, fix typos (#39368) @samuelsycamore +- [material-ui] Adjust the Material You Chip section (#39325) @danilo-leal +- [system] Add documentation on how to augment custom theme types for the `sx` prop callback (#39259) @3xp10it3r +- [joy-ui][Input] Add debounce input demo (#39300) @sai6855 + +### Core + +- [docs-infra] Improve the open diamond sponsor spot callout (#39332) @danilo-leal +- [docs-infra] Fix Code Sandbox download issue (#39317) @ARJ2160 +- [docs-infra] Remove overflow: hidden for demo gradient bg (#39225) @oliviertassinari +- [website] Fix footer responsiveness (#39355) @danilo-leal +- [website] Host Figma redirections in the store for now @oliviertassinari + +All contributors of this release in alphabetical order: @3xp10it3r, @alexfauquette, @ARJ2160, @atharva3333, @axelbostrom, @Bestwebdesign, @brijeshb42, @chirag3003, @danilo-leal, @DarhkVoyd, @DiegoAndai, @gugudwt, @mbrookes, @michaldudak, @mj12albert, @mnajdova, @oliviertassinari, @sai6855, @samuelsycamore, @siriwatknp, @ValkonX33, @ZeeshanTamboli + +## 5.14.12 + +<!-- generated comparing v5.14.11..master --> + +_Oct 3, 2023_ + +A big thanks to the 17 contributors who made this release possible. Here are some highlights ✨: + +- 🎨 Introduced color inversion utilities to Joy UI (#38916) @siriwatknp +- 🚀 Added Chip and related TextField components to Material You @DiegoAndai, @mj12albert +- 🏗️ Improve the Select's component a11y by adding the combobox role and aria-controls attribute (#38785) @xulingzhihou. If your tests require selecting the trigger element by the "button" role, then you'll have to change it to use the "combobox" role instead + +### `@mui/material@5.14.12` + +- [DialogActions] Apply margin-left when children is not of `button` type (#39189) @sai6855 +- [Select] Improve a11y by adding combobox role and aria-controls attribute (#38785) @xulingzhihou +- [Select] Fix MenuProps slotProps forwarding (#39177) @DiegoAndai +- [TextField] Polish types in Textfield demo (#39140) @sai6855 +- [ButtonGroup] Fix rendering with conditional elements (#38989) @ZeeshanTamboli + +### `@mui/system@5.14.12` + +- [system] Add support for `variants` in the styled() util (#39073) @mnajdova +- [Box] Add missing logical spacing property types (#39169) @Semigradsky + +### `@mui/base@5.0.0-beta.18` + +- [useSlider] Align externalProps handling (#38854) @mj12albert +- [useTabs] Align external props handling for useTab/useTabPanel/useTabsList (#39037) @mj12albert +- [test] Fix import paths in useTab tests (#39291) @mj12albert + +### `@mui/material-next@6.0.0-alpha.104` + +- [Chip] Add Material You Chip component (#38927) @DiegoAndai +- [Divider] Copy v5 Divider (#39197) @mj12albert +- [FilledInput] Copy v5 FilledInput (#39040) @mj12albert +- [FormControl] Add FormControl component (#39032) @mj12albert +- [Select] Copy Select files from v5 (#39188) @DiegoAndai +- [TextField] Copy v5 TextField's inner components (#39166) @mj12albert + +### `@mui/joy@5.0.0-beta.9` + +- Introduce color inversion utilities (#38916) @siriwatknp +- Replace margin with `gap` property (#39147) @siriwatknp +- [CssBaseline] use Joy `GlobalStyles` (#39278) @siriwatknp +- [Drawer] Apply content styles from theme to content slot (#39199) @sai6855 +- [List] Add gap and missing active styles (#39146) @siriwatknp +- [Switch] Slight adjustments to the design (#39276) @danilo-leal + +### Docs + +- [docs] Update Autocomplete demo for React 18 (#39162) @oliviertassinari +- [docs-infra] Tweak feedback footer section design (#36556) @danilo-leal +- [docs-infra] Improve code syntax highlight (#39181) @oliviertassinari +- [docs][base] Add Tailwind CSS + plain CSS demo on the TextArea page (#39046) @alisasanib +- [docs][base-ui] Fix style for root div of multiline input (#39182) @ttlpta +- [docs][base-ui] Improve Select's country select demo (#38983) @oliviertassinari +- [docs][joy-ui] Add scrollable tabs example (#39260) @siriwatknp +- [docs][joy-ui] Match `Autocomplete` github label demo to actual github label dropdown (#39228) @sai6855 +- [docs][joy-ui] Refine the Rental dashboard template (#39059) @zanivan +- [docs][joy-ui] Removed incomplete sentence in the Aspect Ratio page (#39227) @Erik-McKelvey +- [docs][joy-ui] Fix typo in the Accordion page (#39226) @Erik-McKelvey +- [docs][joy-ui] Update and standardize template Sidemenus (#39271) @zanivan +- [docs][joy-ui] Add a roadmap page (#39163) @danilo-leal +- [docs][material-ui] Replace `Box` with `Stack` in applicable demos (#39174) @sai6855 +- [docs][material-ui] Add small polish to the Templates page (#39224) @danilo-leal +- [docs][material-ui] Small revision to the Icons page (#38840) @danilo-leal + +### Core + +- Add next lint config to eslint (#39183) @Janpot +- [core] Update eslint rules (#39178) @romgrk +- [core] Fix Greg GitHub slug @oliviertassinari +- [core] Priority Support casing normalization @oliviertassinari +- [website] Add Heatmap in pricing page (#39269) @oliviertassinari +- [website] Update `React Engineer - xCharts` Ashby link (#39172) @DanailH +- [website] Add Charts to the pricing table (#38680) @alexfauquette +- [website] Polish career experience @oliviertassinari +- [website] Simplify the Core products file (#39194) @danilo-leal + +All contributors of this release in alphabetical order: @alexfauquette, @brijeshb42, @DanailH, @danilo-leal, @DiegoAndai, @Erik-McKelvey, @Janpot, @mj12albert, @mnajdova, @oliviertassinari, @romgrk, @sai6855, @Semigradsky, @siriwatknp, @xulingzhihou, @zanivan, @ZeeshanTamboli + +## 5.14.11 + +<!-- generated comparing v5.14.10..master --> + +_Sep 26, 2023_ + +A big thanks to the 23 contributors who made this release possible. +This release was mostly about 🐛 bug fixes and 📚 documentation improvements. + +### `@mui/material@5.14.11` + +- [Autocomplete] Re-export `AutocompleteValue` to make it available from path import (#38638) @vadimka123 +- [Select][material-ui] Missing aria-multiselectable attribute on multiple Select component (#38855) @gitstart +- [l10n] labelDisplayedRows is added for trTR localization (#39056) @tebersefa + +### `@mui/utils@5.14.11` + +- Support RSC in `isMuiElement` util (#38129) @sai6855 + +### `@mui/base@5.0.0-beta.17` + +- [NumberInput] Support adornments (#38900) @anle9650 +- [Menu] Align external props handling for useMenu/MenuButton/MenuItem (#38946) @mj12albert +- [Select] Align external props handling (#39038) @mj12albert +- [TextareaAutosize] Simplify logic and add test (#38728) @oliviertassinari + +### `@mui/joy@5.0.0-beta.8` + +- [Button] Fix disabled button styling when component prop is provided (#38996) @sai6855 +- [Drawer] Add missing `JoyDrawer` in theme components (#39074) @Studio384 + +### `@mui/material-next@6.0.0-alpha.103` + +- [FormControl] Copy v5 FormControl (#39039) @mj12albert + +### `@mui/lab@5.0.0-alpha.146` + +- [TreeView] Fix JSDoc comments in TreeView and TreeItem (#38874) @jergason + +### Docs + +- Improve focus trap demo (#38985) @oliviertassinari +- Add Tailwind CSS + plain CSS demo on the Tabs page (#39000) @alisasanib +- Improve the default theme viewer design (#39049) @danilo-leal +- Add live demo with CssVarsProvider (#38792) @oliviertassinari +- Fix wrong hash on Card's page (#39151) @mnajdova +- Revise the Drawer page (#38988) @danilo-leal +- Simplify the button's loading indicator demo (#39082) @danilo-leal +- Fix the Templates link on the Overview page (#39086) @danilo-leal +- Refine the Sign in template (#38942) @zanivan +- Add `use-count-up` integration with the Circular Progress (#38952) @anon-phantom + +### Core + +- [blog] Add a company values blog post (#38802) @mikailaread +- [core] Downgrade lerna to 7.2.0 (#39149) @michaldudak +- [core] Simplify docs feedback interaction (#39075) @alexfauquette +- [core] Improve ref type definition (#38903) @oliviertassinari +- [core] Simplify career (#39112) @oliviertassinari +- [core] Update Babel types along with source packages (#39070) @michaldudak +- [core] Add a comment to explain `useEnhancedEffect` (#39035) @Janpot +- [docs-infra] Fix code removal in table of content (#39165) @alexfauquette +- [docs-infra] Improve callouts design (#39084) @danilo-leal +- [docs-infra] Fix key warning in Base UI Slider slots section (#38954) @ZeeshanTamboli +- [docs-infra] Fix error when redirecting to the root page (#38451) @maheshguntur +- [docs-infra] Open demo crash in the right repository (#39006) @oliviertassinari +- [test] Split the test package (#39061) @michaldudak +- [website] React Engineer - xCharts role (#38976) @DanailH +- [website] Improve the highlighter component colors (#39087) @danilo-leal +- [website] Fix Pricing page row hover (#39097) @danilo-leal +- [website] Fix typo with straight quote @oliviertassinari +- [website] Sync about page @oliviertassinari +- [website] Update the about page (#38733) @danilo-leal +- [website] Small fixes on the X marketing page (#38975) @flaviendelangle +- [website] Add stray design tweaks to the X page (#38589) @danilo-leal + +All contributors of this release in alphabetical order: @alexfauquette, @alisasanib, @anle9650, @anon-phantom, @DanailH, @danilo-leal, @DiegoAndai, @flaviendelangle, @gitstart, @Janpot, @jergason, @maheshguntur, @michaldudak, @mikailaread, @mj12albert, @mnajdova, @oliviertassinari, @sai6855, @Studio384, @tebersefa, @vadimka123, @zanivan, @ZeeshanTamboli + +## 5.14.10 + +<!-- generated comparing v5.14.9..master --> + +_Sep 18, 2023_ + +A big thanks to the 16 contributors who made this release possible. This release was mostly about 🐛 bug fixes and 📚 documentation improvements. + +### `@mui/material@5.14.10` + +- ​<!-- 20 -->[Chip] Add cursor CSS property reset (#38984) @DiegoAndai + +### `@mui/utils@5.14.10` + +- ​<!-- 05 -->[utils] Move @types/prop-types back to dependencies (#39030) @Methuselah96 + +### `@mui/base@5.0.0-beta.16` + +- ​<!-- 24 -->[NumberInput][base-ui] Warn when changing control mode with `useControlled` (#38757) @sai6855 +- ​<!-- 23 -->[Select][base-ui] Fix Select button layout shift, add placeholder prop (#38796) @mj12albert +- ​<!-- 22 -->[useList][base-ui] Accept arbitrary external props and forward to root (#38848) @mj12albert +- ​<!-- 25 -->[Autocomplete][base-ui] Added ref to getInputProps return value (#38919) @DarhkVoyd + +### `@mui/joy@5.0.0-beta.7` + +- ​<!-- 26 -->[AccordionGroup][joy-ui] Fix console warning when using custom color (#38950) @sai6855 +- ​<!-- 07 -->[GlobalStyles][joy-ui] Ensure compatibility with RSC (#38955) @mateuseap + +### Docs + +- ​<!-- 21 -->[docs][base] Add Tailwind CSS + plain CSS demo on the NumberInput page (#38928) @alisasanib +- ​<!-- 13 -->[docs][Dialog] Add non-modal dialog docs & demo (#38684) @mnajdova +- ​<!-- 12 -->[docs] Fix number input wrong demo @oliviertassinari +- ​<!-- 11 -->[docs] Exclude joy-ui LinearProgressCountup from visual regression (#38969) @siriwatknp +- ​<!-- 09 -->[docs][joy-ui] Revise the Overview page (#38842) @danilo-leal +- ​<!-- 08 -->[docs][material-ui][Pagination] Add `TablePagination` to the API components list (#38486) @MonstraG + +### Core + +- ​<!-- 19 -->[core] Add more context about useEventCallback @oliviertassinari +- ​<!-- 18 -->[core] Allow deeper import of @mui/utils (#38806) @oliviertassinari +- ​<!-- 17 -->[core] Remove react-dom from @mui/utils peerDependencies (#38974) @michaldudak +- ​<!-- 16 -->[core] Remove react from styled-engine dependencies (#38971) @michaldudak +- ​<!-- 15 -->[core] Fix image loading bug on Safari @oliviertassinari +- ​<!-- 14 -->[core] Fix bundle size upload to S3 job (#38956) @Janpot +- ​<!-- 20 -->[core] Move eslint to peer dependencies of eslint-plugin-material-ui (#39033) @michaldudak +- ​<!-- 10 -->[docs-infra] Display markdown lists correctly in docs for props description (#38973) @ZeeshanTamboli +- ​<!-- 04 -->[website] Improve lighthouse score (#39011) @oliviertassinari +- ​<!-- 03 -->[website] Fix lighthouse issues @oliviertassinari +- ​<!-- 02 -->[website] Create the `InfoCard` component (#38987) @danilo-leal +- ​<!-- 01 -->[website] Small tweaks for performance @oliviertassinari +- ​<!-- 06 -->[zero][next] Setup nextjs plugin package (#38852) @brijeshb42 + +All contributors of this release in alphabetical order: @alisasanib, @brijeshb42, @danilo-leal, @DarhkVoyd, @DiegoAndai, @Janpot, @mateuseap, @Methuselah96, @michaldudak, @mj12albert, @mnajdova, @MonstraG, @oliviertassinari, @sai6855, @siriwatknp, @ZeeshanTamboli + +## 5.14.9 + +<!-- generated comparing v5.14.8..master --> + +_Sep 13, 2023_ + +A big thanks to the 18 contributors who made this release possible. Here are some highlights ✨: + +- 🎉 Added the [`Drawer` component](https://mui.com/joy-ui/react-drawer/) to Joy UI (#38169) @mnajdova +- ✨ Material UI's [`ButtonGroup` component](https://mui.com/material-ui/react-button-group/) now styles button elements within it correctly (#38520) @ZeeshanTamboli + +### `@mui/material@5.14.9` + +- ​<!-- 44 -->[ButtonGroup] Determine first, last and middle buttons to support different elements with correct styling (#38520) @ZeeshanTamboli +- ​<!-- 07 -->[Modal] Fix console warning when onTransitionEnter , onTransitionExit provided (#38868) @sai6855 +- ​<!-- 54 -->Revert "[Autocomplete] Type multiple values with readonly arrays." (#38827) @mnajdova +- ​<!-- 57 -->[Tabs] Scrollable tabs shouldn't crash when customizing their styles in the theme with slot callbacks (#38544) @brentertz +- ​<!-- 59 -->[AlertTitle][BreadCrumbs] Fix inheritance message in docs (#38876) @sai6855 + +### `@mui/base@5.0.0-beta.15` + +- ​<!-- 63 -->[useSnackbar] Align externalProps handling (#38935) @mj12albert +- ​<!-- 48 -->[useInput] Align ExternalProps naming (#38849) @mj12albert +- ​<!-- 13 -->[FocusTrap] Refactor & cleanup (#38878) @mnajdova +- ​<!-- 12 -->[FocusTrap] Fix `disableEnforceFocus` behavior (#38816) @mnajdova +- ​<!-- 06 -->[Switch] Simplify source (#38910) @oliviertassinari + +### `@mui/joy@5.0.0-beta.6` + +- ​<!-- 15 -->[Drawer] Add Drawer component (#38169) @mnajdova +- ​<!-- 11 -->Reduce height of some variants (#38527) @zanivan +- ​<!-- 10 -->Refine the default theme color palette (#38416) @zanivan +- ​<!-- 34 -->[Dialog] Add `DialogActions`, `DialogTitle` and `DialogContent` (#38382) @siriwatknp +- ​<!-- 60 -->[AccordionGroup] Add missing `variant` and `color` classes (#38814) @sai6855 + +### `@mui/lab@5.0.0-alpha.144` + +- ​<!-- 09 -->Add TypeScript deprecations (#38833) @oliviertassinari +- ​<!-- 08 -->Fix `@mui/x-tree-view` dependency (#38822) @flaviendelangle + +### `@mui/system@5.14.9` + +- ​<!-- 05 -->Remove dead code (#38884) @oliviertassinari +- ​<!-- 04 -->Remove getInitColorSchemeScript leading spaces (#38794) @oliviertassinari + +### `@mui/zero-vite-plugin@0.0.1-alpha.0` + +- ​<!-- 02 -->[vite] Create a package for vite plugin (#38685) @brijeshb42 + +### Docs + +- ​<!-- 53 -->[docs][base-ui] Improve recommended usage guide (#38570) @oliviertassinari +- ​<!-- 52 -->[docs][base-ui] Create hooks contribution guide (#38679) @michaldudak +- ​<!-- 51 -->[docs][base-ui] Structure and style revisions for Component docs (#38826) @samuelsycamore +- ​<!-- 50 -->[docs][base-ui] Add Number Input to the all components page (#38839) @danilo-leal +- ​<!-- 49 -->[docs][base-ui] Mark Popup with the Preview tag (#38851) @michaldudak +- ​<!-- 47 -->[blog] Polish component reference name @oliviertassinari +- ​<!-- 46 -->[blog] Fix missing card (#38834) @oliviertassinari +- ​<!-- 45 -->[Button][docs][material-ui] Update the file upload demo (#38823) @danilo-leal +- ​<!-- 33 -->[docs][DialogTitle] Fix props docs doesn't mention it extends `Typography` props (#38856) @sai6855 +- ​<!-- 32 -->[docs] Improve npm experience (#38906) @oliviertassinari +- ​<!-- 31 -->[docs] Fix redirection to Base UI URLs @oliviertassinari +- ​<!-- 30 -->[docs] Fix use of callouts (#38747) @oliviertassinari +- ​<!-- 29 -->[docs] Fix 301 links for SEO @oliviertassinari +- ​<!-- 28 -->[docs] Remove flag from installation page @oliviertassinari +- ​<!-- 27 -->[docs] Fix strange break line on mobile in between product name @oliviertassinari +- ​<!-- 26 -->[docs] Clearer npm package homepages (#38864) @oliviertassinari +- ​<!-- 25 -->[docs] enableColorScheme prop was removed (#38795) @oliviertassinari +- ​<!-- 24 -->[docs] Fix a11y issues in tables demos (#38829) @michaldudak +- ​<!-- 62 -->[docs][joy-ui] Refine the Messages template (#38807) @zanivan +- ​<!-- 22 -->[docs][joy-ui] Fix copy on the Tutorial page (#38907) @danilo-leal +- ​<!-- 21 -->[docs][joy-ui] Fix grammar and update Usage section in color inversion page (#38850) @ZeeshanTamboli +- ​<!-- 20 -->[docs][joy-ui] Revise the Lists page (#36324) @LadyBluenotes +- ​<!-- 19 -->[docs][joy-ui] Refine the Profile Dashboard template (#38599) @zanivan +- ​<!-- 18 -->[docs][material-ui] Revise the Paper component docs (#38841) @danilo-leal +- ​<!-- 17 -->[docs][material-ui] Revise the Typography page (#38543) @danilo-leal +- ​<!-- 16 -->[docs][material-ui] Revise and split up "Styled engine" doc (#37774) @samuelsycamore +- ​<!-- 03 -->[TextareaAutosize][docs] Fix component creation in render (#38577) @oliviertassinari + +### Examples + +- ​<!-- 14 -->[examples] Add shortcut to open example in online IDE (#38572) @oliviertassinari +- ​<!-- 61 -->[examples][base-ui] Add Base UI + Vite + Tailwind CSS example in TypeScript (#37595) @dvkam + +### Core + +- ​<!-- 65 -->[core] Remove package declaration from same package dependencies (#38951) @DiegoAndai +- ​<!-- 64 -->[core] Remove workspace dependencies from root package.json (#38940) @michaldudak +- ​<!-- 43 -->[core] Fix prop-types generation (#38831) @flaviendelangle +- ​<!-- 42 -->[core] Move types packages to docs' devDependencies (#38914) @michaldudak +- ​<!-- 41 -->[core] Improve DX when browsing the package on npm and GitHub @oliviertassinari +- ​<!-- 40 -->[core] TrapFocus was renamed to FocusTrap @oliviertassinari +- ​<!-- 39 -->[core] Add types extension for clarity @oliviertassinari +- ​<!-- 38 -->[core] Hoist rewriteImportPaths to parent scope @oliviertassinari +- ​<!-- 37 -->[core] Bump aws-cli orb to 4.1 (#38857) @Janpot +- ​<!-- 36 -->[core] Explicitly define package dependencies (#38859) @michaldudak +- ​<!-- 35 -->[core] Fix yarn docs:create-playground script @oliviertassinari +- ​<!-- 56 -->[docs-infra] Improve show code button affordance (#38824) @danilo-leal +- ​<!-- 55 -->[docs–infra] Fix callout container width (#38880) @oliviertassinari +- ​<!-- 23 -->[docs-infra] Catch duplicated trailing splashes in links (#38758) @oliviertassinari +- ​<!-- 01 -->[website] add Michel Engelen to the about us page (#38818) @michelengelen +- ​<!-- 58 -->[website] Add a templates & design kits section to the Material UI page (#38617) @danilo-leal + +All contributors of this release in alphabetical order: @brentertz, @brijeshb42, @danilo-leal, @DiegoAndai, @dvkam, @flaviendelangle, @Janpot, @LadyBluenotes, @michaldudak, @michelengelen, @mj12albert, @mnajdova, @oliviertassinari, @sai6855, @samuelsycamore, @siriwatknp, @zanivan, @ZeeshanTamboli + +## 5.14.8 + +<!-- generated comparing v5.14.7..master --> + +_Sep 5, 2023_ + +A big thanks to the 25 contributors who made this release possible. + +### `@mui/material@5.14.8` + +- ​<!-- 53 -->ImageItemList fix incorrect (below) rendering (#38452) @omriklein +- ​<!-- 42 -->[Button] Add demo for file upload (#38786) @anle9650 +- ​<!-- 12 -->[Slider] Add missing classes for `Slider` `InputLabel` `InputBase` `Radio` (#38401) @sai6855 +- ​<!-- 11 -->[Select] Merge slotProps.paper with internal Paper props (#38703) @michaldudak +- ​<!-- 09 -->[Tabs] Fix `ref` type (#38717) @ZeeshanTamboli +- ​<!-- 08 -->[TabScrollButton] Extend ButtonBase types (#38719) @ZeeshanTamboli + +### `@mui/base@5.0.0-beta.14` + +- ​<!-- 50 -->[Autocomplete] Type multiple values with readonly arrays. (#38253) @pcorpet +- ​<!-- 07 -->[TextField] Fix unstable height of memoized multiline TextField component (#37135) @amal-qb + +### `@mui/joy@5.0.0-beta.5` + +- ​<!-- 53 -->[Accordion] Fix incorrect display of classname (#38695) @sai6855 +- ​<!-- 51 -->[AspectRatio] Correct `ratio` prop description (#38743) @sai6855 +- ​<!-- 43 -->[Button] Fix disablity of button (#38673) @sai6855 +- ​<!-- 35 -->[design] Stray design tweaks to components (#38476) @zanivan +- ​<!-- 05 -->[Typography] Added position only when Skeleton is a direct child (#38799) @siriwatknp + +### `@mui/lab@5.0.0-alpha.143` + +- ​<!-- 06 -->[TreeView] Use Tree View from MUI X in the lab (#38261) @flaviendelangle +- ​<!-- 13 -->[LoadingButton] Fix HTML rule button > div forbidden nesting (#38584) @oliviertassinari + +### `@mui/system@5.14.8` + +- ​<!-- 11 -->[system] Fix the inconsistent types of the `mergeBreakpointsInOrder` function (#38749) @imevanc +- ​<!-- 10 -->[system] Fix maxWidth incorrectly resolving breakpoints with non-pixel units (#38633) @mj12albert +- ​<!-- 05 -->[typescript] Introduce \*OwnProps interfaces for components (#36798) @szalonna + +### Docs + +- ​<!-- 52 -->Update changelog (#38704) @mj12albert +- ​<!-- 49 -->[docs][Autocomplete] Require referentially stable value (#38734) @michaldudak +- ​<!-- 48 -->[docs][base-ui] Add type parameter to the button in prepareForSlot demo (#38640) @michaldudak +- ​<!-- 47 -->[docs][base-ui] Fix the broken image in the Tailwind CSS guide (#38721) @michaldudak +- ​<!-- 46 -->[docs][base-ui]: Working With Tailwind Guide - revises example code to avoid import errors (#38693) @christophermorin +- ​<!-- 45 -->[docs][base] Add Tailwind CSS + plain CSS demo on the Menu page (#38618) @alisasanib +- ​<!-- 44 -->[blog] Clearer blog release title @oliviertassinari +- ​<!-- 43 -->[blog] Add a post for the Tree View migration (#38407) @flaviendelangle +- ​<!-- 34 -->[docs] Fix broken links to Next.js docs (#38764) @ruflair +- ​<!-- 33 -->[docs] Trim trailing whitespace (#38793) @oliviertassinari +- ​<!-- 32 -->[docs] Fix a typo in lab-tree-view-to-mui-x.md @mbrookes +- ​<!-- 31 -->[docs] Clean up not used Usage files (#38715) @danilo-leal +- ​<!-- 30 -->[docs] Improve theme builder exceptions (#38709) @jyash97 +- ​<!-- 29 -->[docs] Polish Slider demos (#38759) @oliviertassinari +- ​<!-- 28 -->[docs] Fix Joy UI docs link regression (#38761) @oliviertassinari +- ​<!-- 27 -->[docs] Fix typo @oliviertassinari +- ​<!-- 26 -->[docs] Fix e.g. typo (#38748) @oliviertassinari +- ​<!-- 25 -->[docs] Fix Next.js pages router example redirect link (#38750) @sai6855 +- ​<!-- 24 -->[docs] Fix SEO issue broken links @oliviertassinari +- ​<!-- 23 -->[docs] Improve SSR example reference (#38651) @oliviertassinari +- ​<!-- 17 -->[docs][joy-ui] Integrate a count-up feature to the Linear Progress (#38738) @anon-phantom +- ​<!-- 16 -->[docs][joy-ui] Fix Link's `overlay` prop demo (#38702) @danilo-leal +- ​<!-- 15 -->[docs][joy-ui] Polish the Stack page (#38623) @danilo-leal +- ​<!-- 14 -->[docs][material-ui] Adjust simple Slide demo (#38646) @rajgop1 + +### Core + +- ​<!-- 43 -->[core] Re-add nx and setup build caching (#38752) @brijeshb42 +- ​<!-- 41 -->[core] Remove dead code seoTitle @oliviertassinari +- ​<!-- 40 -->[core] Use immutable refs (#38762) @oliviertassinari +- ​<!-- 39 -->[core] Rework `typescript-to-proptypes` to share the AST parsing with `parseStyles` (#38517) @flaviendelangle +- ​<!-- 38 -->[core] Fix CI @oliviertassinari +- ​<!-- 37 -->[core] Remove unnecessary `@types/webpack` package (#38720) @ZeeshanTamboli +- ​<!-- 36 -->[core] Remove duplicate prop @oliviertassinari + +- ​<!-- 22 -->[docs-infra] Fix mobile display in CodeSandbox (#38767) @oliviertassinari +- ​<!-- 21 -->[docs-infra] Remove legacy GA (#37579) @alexfauquette +- ​<!-- 20 -->[docs-infra] Fix emotion :first-child console log (#38690) @oliviertassinari +- ​<!-- 19 -->[docs-infra] Fix leaking callout content (#38712) @danilo-leal +- ​<!-- 18 -->[docs-infra] Remove emoji from callouts (#38694) @danilo-leal + +- ​<!-- 04 -->[website] Fix out of date discount value @oliviertassinari +- ​<!-- 03 -->[website] Fix out-of-date label on Toolpad (#38744) @bharatkashyap +- ​<!-- 02 -->[website] Fine-tune branding buttons box shadows (#38731) @danilo-leal +- ​<!-- 01 -->[website] Fix pricing table style (#38681) @alexfauquette + +All contributors of this release in alphabetical order: @alexfauquette, @alisasanib, @amal-qb, @anle9650, @anon-phantom, @bharatkashyap, @brijeshb42, @christophermorin, @danilo-leal, @flaviendelangle, @imevanc, @jyash97, @mbrookes, @michaldudak, @mj12albert, @oliviertassinari, @omriklein, @pcorpet, @rajgop1, @ruflair, @sai6855, @siriwatknp, @szalonna, @zanivan, @ZeeshanTamboli + +## 5.14.7 + +<!-- generated comparing v5.14.6..master --> + +_Aug 29, 2023_ + +A big thanks to the 11 contributors who made this release possible. This release focuses primarily on 🐛 bug fixes, 📚 documentation, and ⚙️ infrastructure improvements. + +### `@mui/material@5.14.7` + +- [Autocomplete] Fix listbox opened unexpectedly when component is `disabled` (#38611) @mj12albert +- [Select][material-ui] Fix select menu moving on scroll when disableScrollLock is true (#37773) @VishruthR + +### `@mui/base@5.0.0-beta.13` + +- [useButton][base-ui] Accept arbitrary props in getRootProps and forward them (#38475) @DiegoAndai + +### `@pigment-css/react@0.0.1-alpha.1` + +- [system][zero][tag] Add support for sx prop (#38535) @brijeshb42 + +### Docs + +- [docs] Number Input docs fixes (#38521) @mj12albert +- [docs] Show all the code in the usage section (#38691) @oliviertassinari +- [docs][joy-ui] Change the customization and how-to guides docs tree (#38396) @danilo-leal +- [docs][lab][LoadingButton] Improve `loading` prop documentation (#38625) @sai6855 +- [docs][material-ui] Format `key` prop JSDoc description in `Snackbar` component code correctly (#38603) @jaydenseric + +### Core + +- [core] Add use-client to custom icons (#38132) @mj12albert +- [core] Remove unnecessary `@types/jsdom` (#38657) @renovate[bot] +- [core] Improve sponsors GA labels (#38649) @oliviertassinari +- [core] Fix ESM issues with regression tests (#37963) @Janpot +- [core] Potential fix for intermittent ci crashes in e2e test (#38614) @Janpot +- [docs-infra] Mark unstable components with a chip in the nav drawer (#38573) @michaldudak +- [docs-infra] Adjust the Material You playground demo design (#38636) @danilo-leal +- [docs-infra] Hide the SkipLink button if user prefers reduced motion (#38632) @DerTimonius +- [website] Add tiny fixes the homepage Sponsors section (#38635) @danilo-leal + +All contributors of this release in alphabetical order: @brijeshb42, @danilo-leal, @DerTimonius, @DiegoAndai, @Janpot, @jaydenseric, @mj12albert, @oliviertassinari, @renovate[bot], @sai6855, @VishruthR + +## 5.14.6 + +<!-- generated comparing v5.14.5..master --> + +_Aug 23, 2023_ + +A big thanks to the 21 contributors who made this release possible. Here are some highlights ✨: + +- 🚀 Added the [Popup](https://mui.com/base-ui/react-popup/) component to Base UI (#37960) @michaldudak + It's intended to replace the Popper component, which uses the deprecated Popper JS library. The Popup is built on top of Floating UI and has a similar API to the Popper. +- 🚀 Added the [Accordion](https://mui.com/joy-ui/react-accordion/) component to Joy UI (#38164) @siriwatknp +- 🚀 Added InputBase and ButtonBase components to `material-next` (#38319) @DiegoAndai @mj12albert +- 🔋 First iteration on the zero-runtime styling engine compatible with Server Components (#38378) @brijeshb42 + +### `@mui/material@5.14.6` + +- [Modal] Update it to use the useModal hook (#38498) @mnajdova +- [Select] Add `root` class to `SelectClasses` (#38424) @sai6855 +- [Skeleton] Soften the pulse animation (#38506) @oliviertassinari +- [TextField] Fix onClick regressions handling changes (#38474) @mj12albert +- [TextField] Fix TextField onClick test (#38597) @mj12albert + +### `@mui/base@5.0.0-beta.12` + +- [Popup] New component (#37960) @michaldudak + +### `@mui/joy@5.0.0-beta.3` + +- [Accordion] Add Joy UI Accordion components (#38164) @siriwatknp +- [Select] Add `required` prop (#38167) @siriwatknp +- Miscellaneous fixes (#38462) @siriwatknp + +### `@mui/material-next@6.0.0-alpha.98` + +- [ButtonBase] Add ButtonBase component (#38319) @DiegoAndai +- [Input] Add InputBase component (#38392) @mj12albert + +### `@pigment-css/react@0.0.1-alpha.0` + +- Implementation of styled tag processor for linaria (#38378) @brijeshb42 + +### Docs + +- [blog] Clarify tree view move @oliviertassinari +- [docs] Improve the "Understanding MUI packages" page images (#38619) @danilo-leal +- [docs][base-ui] Revise the structure of the Component docs (#38529) @samuelsycamore +- [docs][base-ui] Fix Menu Hooks demo (#38479) @homerchen19 +- [docs][base-ui] Correct the MUI System quickstart example (#38496) @michaldudak +- [docs][base-ui] Add Tailwind & plain CSS demos for Autocomplete page (#38157) @mj12albert +- [docs][base-ui] Add Tailwind CSS + plain CSS demo on the Input page (#38302) @alisasanib +- [docs][base-ui] Add Tailwind CSS + plain CSS demo on the Snackbar, Badge, Switch pages (#38425) @alisasanib +- [docs][base-ui] Add Tailwind CSS + plain CSS demo on the Slider page (#38413) @alisasanib +- [docs][base-ui] Add Tailwind CSS + plain CSS demo on the Select page (#38367) @alisasanib +- [docs][joy-ui] Fix typo: Classname -> Class name for consistency (#38510) @alexfauquette +- [docs][joy-ui] Revise the theme color page (#38402) @danilo-leal +- [docs][joy-ui] Sort templates by popularity (#38490) @oliviertassinari +- [docs][joy-ui] Fix the `fullWidth` prop description for the Input (#38545) @0xturner +- [docs][joy-ui] Updated the List playground demo (#38499) @zanivan +- [docs][joy-ui] Changed bgcolor of the Playground demo (#38502) @zanivan +- [docs][material-ui] Fix key warning in SimpleDialog demo (#38580) @ZeeshanTamboli +- [docs][material-ui] Fixed Google Fonts link for material two-tone icons in CodeSandbox and Stackblitz (#38247) @ZeeshanTamboli +- [docs][material-ui] Fix the Drawer's `onClose` API docs (#38273) @johnmatthiggins +- [docs][material-ui] Improve nav link tab example (#38315) @oliviertassinari +- [docs][material-ui] Fix missing import in the styled engine guide (#38450) @codersjj +- [docs][material-ui][Dialog] Improve screen reader announcement of Customized Dialog (#38592) @ZeeshanTamboli +- [docs] Add 3rd party libraries integration examples for Joy Input (#38541) @siriwatknp +- [docs] Hide translation call to action (#38449) @cristianmacedo +- [docs] Fix codemod name in changelog of v5.14.4 (#38593) @GresilleSiffle +- [docs] More space for theme builder (#38532) @oliviertassinari +- [docs] Fix the math symbol of the width sx prop range @oliviertassinari +- [docs] Fix typo on a11y section of Tabs @oliviertassinari +- [docs] Clarify System peer dependencies @oliviertassinari +- [docs] Fix horizontal scrollbar @oliviertassinari +- [docs] Code style convention @oliviertassinari +- [docs] Fix typo in Base UI @oliviertassinari +- [docs] Update the backers page (#38505) @danilo-leal +- [docs] Add stray design adjustments to the docs (#38501) @danilo-leal +- [docs] Use IBM Plex Sans in Tailwind CSS demos (#38464) @mnajdova +- [docs] Fix SEO issues reported by ahrefs (#38423) @oliviertassinari + +### Examples + +- [examples] Start to remove Gatsby (#38567) @oliviertassinari +- [examples][joy-ui] Fix Joy UI example CLI (#38531) @oliviertassinari +- [examples][joy-ui] Improve example when using Next Font (#38540) @mwskwong + +### Core + +- [changelog] Fix issues in highlight @oliviertassinari +- [core] Remove redundant `@material-ui/` aliases from regression test Webpack config (#38574) @ZeeshanTamboli +- [core] Fix CI error @oliviertassinari +- [core] Remove unnecessary Box (#38461) @oliviertassinari +- [core] Set GitHub Action top level permission @oliviertassinari +- [docs-infra][joy-ui] Polish the usage and CSS vars playgrounds (#38600) @danilo-leal +- [docs-infra] Support link title (#38579) @oliviertassinari +- [docs-infra] Fix ad layout shift (#38622) @oliviertassinari +- [docs-infra] Add light tweaks to the ad container (#38504) @danilo-leal +- [docs-infra] Fix anchor scroll without tabs (#38586) @oliviertassinari +- [docs-infra] Retain velocity animation speed (#38470) @oliviertassinari +- [docs-infra] Follow import and CSS token standard (#38508) @oliviertassinari +- [docs-infra] Add icon to callouts (#38525) @alexfauquette +- [docs-infra] Fix the anchor link on headings (#38528) @danilo-leal +- [docs-infra] Cleanup code on demo code block expansion (#38522) @ZeeshanTamboli +- [docs-infra] Improve the heading buttons positioning (#38428) @danilo-leal +- [docs-infra] Customize the blockquote design (#38503) @danilo-leal +- [docs-infra] Improve the alert before a negative feedback (#38500) @danilo-leal +- [docs-infra] Fix GoogleAnalytics missing event for code copy (#38469) @alexfauquette +- [docs-infra] Improve affordance on the code block expansion (#38421) @danilo-leal +- [website] Fine-tune the branding theme buttons (#38588) @danilo-leal +- [website] Improve the Base UI hero section demo (#38585) @danilo-leal +- [website] Add stray design improvements to the Material UI page (#38590) @danilo-leal +- [website] Fix mobile view Material UI page (#38568) @oliviertassinari +- [website] Fix reference to the data grid @oliviertassinari +- [website] Configure Apple Pay @oliviertassinari +- [website] Fix template link on the homepage (#38471) @danilo-leal + +All contributors of this release in alphabetical order: @0xturner, @alexfauquette, @alisasanib, @brijeshb42, @codersjj, @cristianmacedo, @danilo-leal, @DiegoAndai, @GresilleSiffle, @homerchen19, @johnmatthiggins, @michaldudak, @mj12albert, @mnajdova, @mwskwong, @oliviertassinari, @sai6855, @samuelsycamore, @siriwatknp, @zanivan, @ZeeshanTamboli + +## 5.14.5 + +<!-- generated comparing v5.14.4..master --> + +_Aug 14, 2023_ + +A big thanks to the 17 contributors who made this release possible. Here are some highlights ✨: + +- @mnajdova [made it easier to use third-party components in Base UI slots](https://mui.com/base-ui/getting-started/customization/#overriding-subcomponent-slots) with the introduction of the `prepareForSlot` utility (#38138) + +### `@mui/material@5.14.5` + +- ​<!-- 04 -->[TextField] Fix to handle `onClick` on root element (#38072) @LukasTy + +### `@mui/codemod@5.14.5` + +- ​<!-- 31 -->[codemod] Add v5.0.0/tree-view-moved-to-x codemod (#38248) @flaviendelangle + +### `@mui/joy@5.0.0-beta.2` + +- ​<!-- 07 -->[Input][joy-ui] Fix the `FormHelperText` icon color (#38387) @TheNatkat +- ​<!-- 06 -->[Skeleton][joy-ui] Soften the pulse animation (#38384) @zanivan +- ​<!-- 05 -->[TabPanel][joy-ui] Add `keepMounted` prop (#38293) @decadef20 + +### `@mui/base@5.0.0-beta.11` + +- ​<!-- 30 -->[base-ui] Remove the legacy Extend\* types (#38184) @michaldudak +- ​<!-- 29 -->[base-ui] Add `useModal` hook (#38187) @mnajdova +- ​<!-- 28 -->[base-ui] Add `prepareForSlot` util (#38138) @mnajdova +- ​<!-- 26 -->[useButton][base-ui] Fix tabIndex not being forwarded (#38417) @DiegoAndai +- ​<!-- 25 -->[useButton][base-ui] Fix onFocusVisible not being handled (#38399) @DiegoAndai + +### Docs + +- ​<!-- 32 -->[blog] Blog post for MUI X mid v6. Date Pickers, Data Grid, and Charts (#38241) @richbustos +- ​<!-- 35 -->[docs][base-ui] Update number input API docs (#38363) @mj12albert +- ​<!-- 29 -->[docs] Improve page transition speed (#38394) @oliviertassinari +- ​<!-- 28 -->[docs] Improve examples (#38398) @oliviertassinari +- ​<!-- 19 -->[docs][docs] Add `FileUpload` demo (#38420) @sai6855 +- ​<!-- 18 -->[docs][joy-ui] Refine the Order Dashboard template design (#38395) @zanivan +- ​<!-- 17 -->[docs][material-ui][joy-ui] Simplify the Quickstart section on the Usage page (#38385) @danilo-leal +- ​<!-- 16 -->[docs][Menu][joy] Explain how to control the open state (#38355) @michaldudak +- ​<!-- 15 -->[docs][material] Revise the Support page (#38207) @samuelsycamore +- ​<!-- 14 -->[docs][material-ui] Remove incorrect `aria-label`s in extended variant examples of Floating Action Button (#37170) @ashleykolodziej +- ​<!-- 13 -->[docs][material-ui] Adjust slightly the installation page content (#38380) @danilo-leal +- ​<!-- 12 -->[docs][Switch] Fix the readOnly class name in docs (#38277) @michaldudak +- ​<!-- 11 -->[docs][TablePagination] Add Tailwind CSS & plain CSS introduction demo (#38286) @mnajdova + +### Examples + +- ​<!-- 10 -->[examples] Add Joy UI + Vite.js + TypeScript example app (#37406) @nithins1 + +### Core + +- ​<!-- 30 -->[core] Consistent URL add leading / @oliviertassinari +- ​<!-- 27 -->[docs-infra] Fix rebase issue @oliviertassinari +- ​<!-- 26 -->[docs-infra] Fix typo in docs infra docs @oliviertassinari +- ​<!-- 25 -->[docs-infra] Fix nested list margin (#38456) @oliviertassinari +- ​<!-- 24 -->[docs-infra] Move the Diamond Sponsors to the TOC (#38410) @danilo-leal +- ​<!-- 22 -->[docs-infra] Move imports into page data (#38297) @alexfauquette +- ​<!-- 21 -->[docs-infra] Adjust heading styles (#38365) @danilo-leal +- ​<!-- 20 -->[docs-infra] Fix info callout border color (#38370) @danilo-leal +- ​<!-- 05 -->[website] Upgrade the homepage hero demos design (#38388) @danilo-leal +- ​<!-- 04 -->[website] Improve Base UI hero section demo (#38255) @danilo-leal +- ​<!-- 03 -->[website] Fix EmailSubscribe look (#38429) @oliviertassinari +- ​<!-- 02 -->[website] Link Discord in footer (#38369) @richbustos +- ​<!-- 01 -->[website] Clean up the `GetStartedButtons` component (#38256) @danilo-leal + +All contributors of this release in alphabetical order: @alexfauquette, @ashleykolodziej, @danilo-leal, @decadef20, @DiegoAndai, @flaviendelangle, @LukasTy, @michaldudak, @mj12albert, @mnajdova, @nithins1, @oliviertassinari, @richbustos, @sai6855, @samuelsycamore, @TheNatkat, @zanivan + +## 5.14.4 + +<!-- generated comparing v5.14.3..master --> + +_Aug 8, 2023_ + +A big thanks to the 18 contributors who made this release possible. Here are some highlights ✨: + +- 🎉 Added [Number Input](https://mui.com/base-ui/react-number-input/) component & [useNumberInput](https://mui.com/base-ui/react-number-input/#hook) hook in [Base UI](https://mui.com/base-ui/getting-started/) @mj12albert + +### `@mui/material@5.14.4` + +- ​<!-- 25 -->[Checkbox][material] Add size classes (#38182) @michaldudak +- ​<!-- 03 -->[Typography] Improve inherit variant logic (#38123) @ZeeshanTamboli + +### `@mui/system@5.14.4` + +- ​<!-- 34 -->Revert "[Box] Remove `component` from TypeMap (#38168)" (#38356) @michaldudak + +### `@mui/base@5.0.0-beta.10` + +#### Breaking changes + +- ​<!-- 32 -->[base] Ban default exports (#38200) @michaldudak + + Base UI default exports were changed to named ones. Previously we had a mix of default and named ones. + This was changed to improve consistency and avoid problems some bundlers have with default exports. + See https://github.com/mui/material-ui/issues/21862 for more context. + + ```diff + - import Button, { buttonClasses } from '@mui/base/Button'; + + import { Button, buttonClasses } from '@mui/base/Button'; + - import BaseMenu from '@mui/base/Menu'; + + import { Menu as BaseMenu } from '@mui/base/Menu'; + ``` + + Additionally, the `ClassNameGenerator` has been moved to the directory matching its name: + + ```diff + - import ClassNameGenerator from '@mui/base/className'; + + import { ClassNameGenerator } from '@mui/base/ClassNameGenerator'; + ``` + + A codemod is provided to help with the migration: + + ```bash + npx @mui/codemod@latest v5.0.0/base-use-named-exports <path> + ``` + +#### Changes + +- ​<!-- 31 -->[base] Create useNumberInput and NumberInput (#36119) @mj12albert +- ​<!-- 28 -->[Select][base] Fix flicker on click of controlled Select button (#37855) @VishruthR +- ​<!-- 09 -->[Dropdown] Fix imports of types (#38296) @yash-thakur + +### `@mui/joy@5.0.0-beta.1` + +- ​<!-- 06 -->[joy-ui][MenuButton] Fix disable of `MenuButton` (#38342) @sai6855 + +### Docs + +- ​<!-- 33 -->[docs][AppBar] Fix `ResponsiveAppBar` demo logo href (#38346) @iownthegame +- ​<!-- 30 -->[docs][base] Add Tailwind CSS + plain CSS demo on the Button page (#38240) @alisasanib +- ​<!-- 29 -->[docs][Menu][base] Remove `Unstyled` prefix from demos' function names (#38270) @sai6855 +- ​<!-- 22 -->[docs] Add themeable component guide (#37908) @siriwatknp +- ​<!-- 21 -->[docs] Fix Joy UI demo background color (#38307) @oliviertassinari +- ​<!-- 20 -->[docs] Update API docs for Number Input component (#38301) @ZeeshanTamboli +- ​<!-- 14 -->[docs][joy-ui] Revise the theme typography page (#38285) @danilo-leal +- ​<!-- 13 -->[docs][joy-ui] Add TS demo for Menu Bar (#38308) @sai6855 +- ​<!-- 10 -->[docs][joy-ui] Updated Typography callout at getting started (#38289) @zanivan +- ​<!-- 12 -->[docs][joy-ui] Fix the Inter font installation instructions (#38284) @danilo-leal +- ​<!-- 11 -->[docs][material] Add note to Autocomplete about ref forwarding (#38305) @samuelsycamore +- ​<!-- 05 -->[docs][Skeleton] Make the demos feel more realistic (#38212) @oliviertassinari + +- ​<!-- 08 -->[examples] Swap Next.js examples between App Router and Pages Router; update naming convention (#38204) @samuelsycamore +- ​<!-- 07 -->[examples][material-ui] Add Material UI + Next.js (App Router) example in JS (#38323) @samuelsycamore +- ​<!-- 27 -->[blog] Discord announcement blog (#38258) @richbustos +- ​<!-- 26 -->[blog] Fix 301 links to Toolpad @oliviertassinari +- ​<!-- 04 -->[website] Updating Charts demo with real charts usage for MUI X marketing page (#38317) @richbustos +- ​<!-- 03 -->[website] Adjust styles of the Product section on the homepage (#38366) @danilo-leal +- ​<!-- 02 -->[website] Add Nora teamMember card to 'About' (#38358) @noraleonte +- ​<!-- 01 -->[website] Fix image layout shift (#38326) @oliviertassinari + +### Core + +- ​<!-- 24 -->[core] Fix docs demo export function consistency (#38191) @oliviertassinari +- ​<!-- 23 -->[core] Fix the link-check script on Windows (#38276) @michaldudak +- ​<!-- 26 -->[core] Use @testing-library/user-event direct API (#38325) @mj12albert +- ​<!-- 29 -->[core] Port GitHub workflow for ensuring triage label is present (#38312) @DanailH +- ​<!-- 19 -->[docs-infra] Consider files ending with .types.ts as props files (#37533) @mnajdova +- ​<!-- 18 -->[docs-infra] Fix skip to content design (#38304) @oliviertassinari +- ​<!-- 17 -->[docs-infra] Add a general round of polish to the API content display (#38282) @danilo-leal +- ​<!-- 16 -->[docs-infra] Make the side nav collapse animation snappier (#38259) @danilo-leal +- ​<!-- 15 -->[docs-infra] New Component API design followup (#38183) @cherniavskii +- ​<!-- 06 -->[test] Remove unnecessary `async` keyword from test (#38373) @ZeeshanTamboli + +All contributors of this release in alphabetical order: @alisasanib, @cherniavskii, @DanailH, @danilo-leal, @iownthegame, @michaldudak, @mj12albert, @mnajdova, @noraleonte, @oliviertassinari, @richbustos, @sai6855, @samuelsycamore, @siriwatknp, @VishruthR, @yash-thakur, @zanivan, @ZeeshanTamboli + +## 5.14.3 + +<!-- generated comparing v5.14.2..master --> + +_Jul 31, 2023_ + +A big thanks to the 17 contributors who made this release possible. Here are some highlights ✨: + +- 🚀 [Joy UI](https://mui.com/joy-ui/getting-started/) is now in Beta +- ✨ Refine [Joy UI](https://mui.com/joy-ui/getting-started/)'s default theme @siriwatknp @zanivan +- 🎉 Added Dropdown higher-level menu component [Base UI](https://mui.com/base-ui/getting-started/) @michaldudak +- 💫 Added Material You [Badge](https://mui.com/material-ui/react-badge/#material-you-version) to `material-next` (#37850) @DiegoAndai + +### `@mui/material@5.14.3` + +- ​<!-- 36 -->[Autocomplete][material][joy] Add default `getOptionLabel` prop in ownerState (#38100) @DSK9012 +- ​<!-- 26 -->[Menu][Divider][material] Do not allow focus on Divider when inside Menu list (#38102) @divyammadhok +- ​<!-- 06 -->[typescript][material] Rename one letter type parameters (#38155) @michaldudak +- ​<!-- 08 -->[Menu][material] Fixes slots and slotProps overriding defaults completely (#37902) @gitstart +- ​<!-- 07 -->[Theme][material] Add missing styleOverrides type for theme MuiStack (#38189) @DiegoAndai +- ​<!-- 04 -->[typescript][material] Add `component` field to `*Props` types (#38084) @michaldudak + +### `@mui/base@5.0.0-beta.9` + +#### Breaking changes + +- ​<!-- 11 -->[Dropdown][base][joy] Introduce higher-level menu component (#37667) @michaldudak + +#### Other changes + +- ​<!-- 33 -->[typescript][base] Rename one letter type parameters (#38171) @michaldudak + +### `@mui/joy@5.0.0-beta.0` + +- ​<!-- 10 -->[joy] Refine the default theme (#36843) @siriwatknp + +### `@mui/material-next@6.0.0-alpha.95` + +- ​<!-- 35 -->[Badge][material-next] Add Badge component (#37850) @DiegoAndai +- ​<!-- 30 -->[Chip][material-next] Copy chip component from material (#38053) @DiegoAndai +- ​<!-- 09 -->[typescript][material-next] Rename one letter type parameters (#38172) @michaldudak + +### `@mui/system@5.14.3` + +- ​<!-- 32 -->[Box][system] Remove `component` from TypeMap (#38168) @michaldudak +- ​<!-- 05 -->[Stack][system] Fix CSS selector (#37525) @sai6855 + +### Docs + +- ​<!-- 49 -->[docs] Update Joy UI's package README (#38262) @ZeeshanTamboli +- ​<!-- 48 -->[docs][base-ui] Add new batch of coming soon pages (#38025) @danilo-leal +- ​<!-- 44 -->[docs] fix links to standardized examples (#38193) @emmanuel-ferdman +- ​<!-- 43 -->[docs-infra] Small design polish to the Diamond Sponsor container (#38257) @danilo-leal +- ​<!-- 42 -->[docs-infra] Show props in the table of content (#38173) @alexfauquette +- ​<!-- 41 -->[docs-infra] Polish API page design (#38196) @oliviertassinari +- ​<!-- 40 -->[docs-infra] Search with productCategory when product is missing (#38239) @oliviertassinari +- ​<!-- 39 -->[docs][material] Revise and update Examples doc (#38205) @samuelsycamore +- ​<!-- 38 -->[docs] Fix typo in notifications.json @mbrookes +- ​<!-- 37 -->[docs-infra] Remove leftover standardNavIcon (#38252) @DiegoAndai +- ​<!-- 34 -->[docs][base] Add Tailwind CSS & plain CSS demos on the Popper page (#37953) @zanivan +- ​<!-- 31 -->[docs][Button][joy] Improve `loading` prop documentation (#38156) @sai6855 +- ​<!-- 25 -->[docs] Prepare docs infra for Tree View migration to X (#38202) @flaviendelangle +- ​<!-- 24 -->[docs] Fix SEO issues reported by ahrefs @oliviertassinari +- ​<!-- 23 -->[docs] Fix palette pages - live edit not working (#38195) @oliviertassinari +- ​<!-- 22 -->[docs] Add Google Analytics action for the styling menu (#38085) @mnajdova +- ​<!-- 21 -->[docs] Fix Discord redirection chain @oliviertassinari +- ​<!-- 20 -->[docs] Cover pnpm in more places (#38161) @oliviertassinari +- ​<!-- 19 -->[docs] Avoid broken link (#38154) @oliviertassinari +- ​<!-- 18 -->[docs] Add notification for beta release of Toolpad (#38152) @prakhargupta1 +- ​<!-- 17 -->[docs-infra] Remove sidenav icons (#38174) @oliviertassinari +- ​<!-- 16 -->[docs-infra] Fix search ranking when no productId (#38162) @oliviertassinari +- ​<!-- 15 -->[docs-infra] Adjust the side nav for deeper nested items (#38047) @cherniavskii +- ​<!-- 14 -->[docs][joy] Update TS file of adding more typography levels demo to match the corresponding JS file's styles (#38232) @ZeeshanTamboli +- ​<!-- 13 -->[docs][joy] Add TS demo for reusable component section in approaches page (#38210) @sai6855 +- ​<!-- 12 -->[docs][joy] Add TS demo for theme typography new level customization (#38199) @sai6855 + +### Core + +- ​<!-- 47 -->[blog] Fix blog post slug Base UI (#38254) @oliviertassinari +- ​<!-- 46 -->[core] Use native Node's fetch instead of node-fetch package (#38263) @michaldudak +- ​<!-- 45 -->[core] Remove dead code @oliviertassinari +- ​<!-- 29 -->[core] Polish Stack test to closer CSS injection order @oliviertassinari +- ​<!-- 28 -->[core] Remove unnecessary `Required` utility type from Typography font style type (#38203) @ZeeshanTamboli +- ​<!-- 27 -->[core] Fix generate Proptypes script skipping unstable items (#38198) @mj12albert +- ​<!-- 03 -->[website] Adding Rich Bustos Twitter handle in bio (#38213) @richbustos +- ​<!-- 02 -->[website] Prepare importing data from HiBob (#38238) @oliviertassinari +- ​<!-- 01 -->[website] Sync team member with HiBob, add Raffaella (#38201) @rluzists1 + +All contributors of this release in alphabetical order: @cherniavskii, @DiegoAndai, @divyammadhok, @DSK9012, @flaviendelangle, @gitstart, @michaldudak, @mj12albert, @mnajdova, @oliviertassinari, @prakhargupta1, @richbustos, @rluzists1, @sai6855, @siriwatknp, @zanivan, @ZeeshanTamboli + +## 5.14.2 + +<!-- generated comparing v5.14.1..master --> + +_Jul 25, 2023_ + +A big thanks to the 23 contributors who made this release possible. + +### @mui/material@5.14.2 + +- ​<!-- 39 -->Revert "[core] Adds `component` prop to `OverrideProps` type (#35924)" (#38150) @michaldudak +- ​<!-- 32 -->[Chip][material] Fix base cursor style to be "auto" not "default" (#38076) @DiegoAndai +- ​<!-- 12 -->[Tabs] Refactor IntersectionObserver logic (#38133) @ZeeshanTamboli +- ​<!-- 11 -->[Tabs] Fix and improve visibility of tab scroll buttons using the IntersectionObserver API (#36071) @SaidMarar + +### @mui/joy@5.0.0-alpha.89 + +- ​<!-- 15 -->[Joy] Replace leftover `Joy-` prefix with `Mui-` (#38086) @siriwatknp +- ​<!-- 14 -->[Skeleton][joy] Fix WebkitMaskImage CSS property (#38077) @Bestwebdesign +- ​<!-- 13 -->[Link][Joy UI] Fix font inherit (#38124) @oliviertassinari + +### Docs + +- ​<!-- 37 -->[docs] Add listbox placement demo for Select (#38130) @sai6855 +- ​<!-- 36 -->[docs][base] Add Tailwind CSS & plain CSS demo on the Tabs page (#37910) @mnajdova +- ​<!-- 35 -->[docs][base] Add Tailwind CSS & plain CSS demos on the Textarea page (#37943) @zanivan +- ​<!-- 29 -->[docs] Fix Joy UI menu example (#38140) @harikrishnanp +- ​<!-- 28 -->[docs] Remove translations section from contributing guide (#38125) @nikohoffren +- ​<!-- 27 -->[docs] Fix Base UI Button Tailwind CSS padding @oliviertassinari +- ​<!-- 26 -->[docs] Mention in hompage hero that Core is free (#38075) @mbrookes +- ​<!-- 25 -->[docs] Fix a typo in notifications.json (#38078) @mbrookes +- ​<!-- 24 -->[docs] Add Tailwind CSS & plain CSS demo on the table pagination page (#37937) @mnajdova +- ​<!-- 23 -->[docs] Implement the new API display design (#37405) @alexfauquette +- ​<!-- 22 -->[docs] Update migration installation code blocks (#38028) @danilo-leal +- ​<!-- 21 -->[docs][joy] Revise the Joy UI Link page (#37829) @danilo-leal +- ​<!-- 20 -->[docs][joy] Add playground for Card component (#37820) @Studio384 +- ​<!-- 19 -->[docs][joy] Add adjustments to the color inversion page (#37143) @danilo-leal +- ​<!-- 18 -->[docs][material] Improve documentation about adding custom colors (#37743) @DiegoAndai +- ​<!-- 17 -->[examples] Fix Joy UI Next.js App Router font loading (#38095) @IgnacioUtrilla +- ​<!-- 16 -->[examples] Fix material-next Font Usage with next/font (#38026) @onderonur + +### Core + +- ​<!-- 34 -->[blog] Update Discord invite link in Toolpad beta announcement (#38143) @samuelsycamore +- ​<!-- 33 -->[blog] Update discord server link (#38131) @prakhargupta1 +- ​<!-- 31 -->[core] Fix rsc-builder removing the first line (#38134) @michaldudak +- ​<!-- 30 -->[core] Remove the deprecation rule in tslint (#38087) @michaldudak +- ​<!-- 09 -->[website] Mobile navigation: Toolpad to Beta (#38146) @bharatkashyap +- ​<!-- 08 -->[website] Fix typo on pricing page @oliviertassinari +- ​<!-- 07 -->[website] Fix a few regression (#38050) @oliviertassinari +- ​<!-- 06 -->[website] Update Demo footers on MUI X landing page (#38027) @richbustos +- ​<!-- 05 -->[website] Fix 301 redirection to base index page @oliviertassinari +- ​<!-- 04 -->[website] Fix Cell selection feature name (#38029) @oliviertassinari +- ​<!-- 03 -->[website] Improve button look (#38052) @oliviertassinari +- ​<!-- 02 -->[website] Link new core page to new Base UI landing page (#38030) @mj12albert +- ​<!-- 01 -->[website] Polish pricing page (#37975) @oliviertassinari +- ​<!-- 10 -->[test] Fail the CI when new unexpected files are created (#38039) @oliviertassinari +- ​<!-- 09 -->[test] Fix linting error by matching main component demo name to filename (#38122) @ZeeshanTamboli + +All contributors of this release in alphabetical order: @alexfauquette, @Bestwebdesign, @bharatkashyap, @danilo-leal, @DiegoAndai, @harikrishnanp, @IgnacioUtrilla, @mbrookes, @michaldudak, @mj12albert, @mnajdova, @nikohoffren, @oliviertassinari, @onderonur, @prakhargupta1, @richbustos, @sai6855, @SaidMarar, @samuelsycamore, @siriwatknp, @Studio384, @zanivan, @ZeeshanTamboli + +## 5.14.1 + +<!-- generated comparing v5.14.0..master --> + +_Jul 19, 2023_ + +A big thanks to the 24 contributors who made this release possible. Here are some highlights ✨: + +- 💫 Introducing some new components for Joy UI: + - [Skeleton](https://mui.com/joy-ui/react-skeleton/) component (#37893) @siriwatknp + - [ToggleButton](https://mui.com/joy-ui/react-toggle-button-group/) (#37716) @siriwatknp +- 🎉 Base UI has its own [landing page](https://www.mui.com/base-ui)! +- 🐛 bug fixes, 📚 documentation, and ⚙️ infrastructure improvements. + +### `@mui/material@5.14.1` + +- ​<!-- 14 -->[FormControlLabel] Fix misplaced asterisk when `labelPlacement` is provided (#37831) @ZeeshanTamboli +- ​<!-- 11 -->[Slider][material] Fix type dependency on @types/prop-types (#37853) @Methuselah96 +- ​<!-- 10 -->[Menu] Add MuiMenuList to createTheme components key (#37956) @mj12albert +- ​<!-- 09 -->[Modal] Remove deprecated `BackdropComponent` and `BackdropProps` from tests (#38018) @sai6855 + +### `@mui/material-next@6.0.0-alpha.93` + +- ​<!-- 54 -->[Slider][material-next] Add use client directive to useSliderElementsOverlap (#37955) @mj12albert +- ​<!-- 47 -->[Button][material-next] Fix some event handlers being ignored (#37647) @DiegoAndai + +### `@mui/base@5.0.0-beta.8` + +- ​<!-- 53 -->[Autocomplete] Make touch and click behavior on an option consistent (#37972) @divyammadhok + +### `@mui/joy@5.0.0-alpha.88` + +- ​<!-- 13 -->[Joy][Select] Fix type error caused by custom variant (#37996) @OmPr366 +- ​<!-- 12 -->[ToggleButton][Joy] Add `ToggleButton` component (#37716) @siriwatknp +- ​<!-- 07 -->[Skeleton] Add Joy UI `Skeleton` component (#37893) @siriwatknp + +### `@mui/utils@5.14.1` + +- ​<!-- 06 -->[utils] Add function overload for `useEventCallback` (#37827) @cherniavskii + +### Docs + +- ​<!-- 52 -->[docs][base] Add Tailwind CSS & plain CSS demo on the form control page (#37914) @mnajdova +- ​<!-- 51 -->[docs][base] Make Base UI Select demos denser (#37836) @zanivan +- ​<!-- 38 -->[docs] Link Material UI from the landing page (#37971) @oliviertassinari +- ​<!-- 37 -->[docs] Fix the empty /components page (#38010) @brijeshb42 +- ​<!-- 36 -->[docs] Checkout template follows user's color scheme preference (#37928) @OndrejHj04 +- ​<!-- 35 -->[docs] Disable ad for onboarding pages (#37998) @oliviertassinari +- ​<!-- 34 -->[docs] Fix broken link to Base UI Next.js App Router (#37973) @oliviertassinari +- ​<!-- 33 -->[docs] Fix typo in next-js-app-router.md (#37974) @ericbrian +- ​<!-- 32 -->[docs] Add pnpm commands to Material UI Installation page (#36650) @officialrajdeepsingh +- ​<!-- 31 -->[docs] Link charts in the roadmap (#37944) @oliviertassinari +- ​<!-- 30 -->[docs] Improve changelog @oliviertassinari +- ​<!-- 29 -->[docs] Improve the Select docs (#37279) @michaldudak +- ​<!-- 16 -->[docs][menu] Add Tailwind CSS & plain CSS demo on the Menu page (#37856) @mnajdova +- ​<!-- 15 -->[example] Update EmotionCacheProvider to work with GlobalStyles (#37962) @siriwatknp + +### Core + +- ​<!-- 50 -->[blog] Add blog post about support for Next.js App Router (#37929) @samuelsycamore +- ​<!-- 49 -->[blog] Blog MUI X pro statement removed (#38015) @prakhargupta1 +- ​<!-- 48 -->[blog] Add Toolpad beta announcement blog (#37799) @prakhargupta1 +- ​<!-- 46 -->[core] Increase space available for sidenav @oliviertassinari +- ​<!-- 45 -->[core] Adds `component` prop to `OverrideProps` type (#35924) @sai6855 +- ​<!-- 44 -->[core] Fix rsc build step in CI (#38019) @mj12albert +- ​<!-- 43 -->[core] Remove nx dependency (#37964) @Janpot +- ​<!-- 42 -->[core] Lock `@types/node` to v18 (#37965) @ZeeshanTamboli +- ​<!-- 41 -->[core] Update priority support issue template and prompt (#37824) @DanailH +- ​<!-- 40 -->[core] Remove warnings in docs:api (#37858) @alexfauquette +- ​<!-- 39 -->[core] Make rimraf work after a major update (#37930) @michaldudak +- ​<!-- 28 -->[docs-infra] Change the Diamond Sponsor block positioning on the side nav (#37933) @danilo-leal +- ​<!-- 27 -->[docs-infra] Support backticks in the codeblocks (#37950) @cherniavskii +- ​<!-- 26 -->[docs-infra] Improve performance hideToolbar: true (#37969) @oliviertassinari +- ​<!-- 25 -->[docs-infra] Fix button label on mobile (#37997) @oliviertassinari +- ​<!-- 24 -->[docs-infra] Square drawer corners (#37970) @oliviertassinari +- ​<!-- 23 -->[docs-infra] Improve tab contrast in codeblock (#38000) @oliviertassinari +- ​<!-- 22 -->[docs-infra] Fix API generation for Base UI (#37941) @oliviertassinari +- ​<!-- 21 -->[docs-infra] Fix layout shift on xGrid (#37954) @oliviertassinari +- ​<!-- 20 -->[docs-infra] Update installation commands to use the new tabs code component (#37927) @danilo-leal +- ​<!-- 19 -->[docs-infra] Improve disableToc={true} support (#37931) @oliviertassinari +- ​<!-- 18 -->[docs-infra] Remove icons and tweak the design of the side nav (#37860) @danilo-leal +- ​<!-- 17 -->[docs-infra] Fix TypeScrit error in demo export (#37830) @oliviertassinari +- ​<!-- 08 -->[notifications] Add notification for first Charts release (#37679) @joserodolfofreitas +- ​<!-- 05 -->[website] Add Base UI marketing page (#36622) @siriwatknp +- ​<!-- 04 -->[website] Update MUI X landing page (#37966) @cherniavskii +- ​<!-- 03 -->[website] Fix a11y issues (#37999) @oliviertassinari +- ​<!-- 02 -->[website] Make the Core page refer to group of products (#37608) @danilo-leal +- ​<!-- 01 -->[website] Add perpetual option to pricing page (#35504) @joserodolfofreitas + +All contributors of this release in alphabetical order: @alexfauquette, @brijeshb42, @cherniavskii, @DanailH, @danilo-leal, @DiegoAndai, @divyammadhok, @ericbrian, @Janpot, @joserodolfofreitas, @Methuselah96, @michaldudak, @mj12albert, @mnajdova, @officialrajdeepsingh, @oliviertassinari, @OmPr366, @OndrejHj04, @prakhargupta1, @sai6855, @samuelsycamore, @siriwatknp, @zanivan, @ZeeshanTamboli + +## 5.14.0 + +<!-- generated comparing v5.13.7..master --> + +_Jul 11, 2023_ + +A big thanks to the 15 contributors who made this release possible. Here are some highlights ✨: + +- 💫 Material UI, Joy UI, and Base UI are compatible with [Next.js App Router](https://nextjs.org/docs/app) (#37656) @mj12albert +- 📚 Added new guides for integrating with Next.js 13 App Router (#37656) @mj12albert + - Ⓜ️ [Material UI guide](https://mui.com/material-ui/guides/next-js-app-router/) + - 🅙 [Joy UI guide](https://mui.com/joy-ui/integrations/next-js-app-router/) + - 🅱️ [Base UI guide](https://mui.com/base-ui/guides/next-js-app-router/) +- 🐛 bug fixes, 📚 documentation, and ⚙️ infrastructure improvements. + +### `@mui/material@5.14.0` + +- [Autocomplete] Enable global customization of different options (#36971) @nicolas-ot + +### `@mui/material-next@6.0.0-alpha.92` + +- [Slider][material-next] Slider restructure and style improvements (#37644) @DiegoAndai + +### `@mui/joy@5.0.0-alpha.87` + +- [ButtonGroup] Fix style for single Button (#37692) @MaybePixem +- Fix theme typography fallback value (#37845) @siriwatknp + +### `@mui/icons-material@5.14.0` + +- [icons-material] Rebuild icons with `"use client"` (#37894) @mj12albert + +### Docs + +- [docs] Polish Ukraine banner (#37905) @oliviertassinari +- [docs] Reduce Ukraine banner size (#34795) @oliviertassinari +- [docs] Add callouts about controlled vs uncontrolled components in Core docs (#37849) @samuelsycamore +- [docs] Add missing Portal elements to Tailwind CSS interoperability guide (#37807) @enrique-ramirez +- [docs] Small pickers migration improvement (#37815) @alexfauquette +- [docs] Fix pickers product name (#37825) @LukasTy +- [docs][Joy][Link] Set `variant` and `color` defaults for the playground (#37817) @Studio384 +- [docs][Joy][Table] Add `undefined` as an option to `stripe` (#37816) @Studio384 +- [docs][base] Add Tailwind CSS & plain CSS demo on the Snackbar page (#37812) @mnajdova +- [docs][base] Add Tailwind CSS & plain CSS demo on Badge page (#37768) @mnajdova +- [docs][base] Fix Nested modal demo positioning (#37506) @gitstart +- [docs][base] Add Tailwind CSS & plain CSS demo on the Switch page (#37728) @mnajdova +- [docs-infra] Remove code tags in ToC (#37834) @cherniavskii +- [docs-infra] Fixes in API pages generation (#37813) @mnajdova +- [docs-infra] Add test case when using sh (#37818) @oliviertassinari +- [docs-infra] Use icons instead of words for the code copy button (#37664) @danilo-leal +- [docs-infra] Fix code parser (#37828) @alexfauquette +- [docs-infra] Fix `marked` deprecation warning (#37769) @alexfauquette +- [docs-infra] Allows to use codeblock in the docs (#37643) @alexfauquette +- [docs-infra][joy] Change Joy UI's playground variant selector (#37821) @danilo-leal + +### Core + +- [core] Prepend "use-client" directive + add docs and examples for using the library with Next.js App Router (#37656) @mj12albert +- [core] Fix imports to React (#37863) @oliviertassinari +- [core] Disambiguate eslint plugin name @oliviertassinari +- [core] Sync the lint script name with the other repositories @oliviertassinari +- [core] Point to Crowdin directly @oliviertassinari +- [website] Sync career page (#37847) @oliviertassinari + +All contributors of this release in alphabetical order: @alexfauquette, @cherniavskii, @danilo-leal, @DiegoAndai, @enrique-ramirez, @gitstart, @LukasTy, @MaybePixem, @mj12albert, @mnajdova, @nicolas-ot, @oliviertassinari, @samuelsycamore, @siriwatknp, @Studio384 + +## 5.13.7 + +<!-- generated comparing v5.13.6..master --> + +_Jul 4, 2023_ + +A big thanks to the 21 contributors who made this release possible. +This release focuses primarily on 🐛 bug fixes, 📚 documentation, and ⚙️ infrastructure improvements. + +### `@mui/material@5.13.7` + +- [OutlinedInput] Fix form control properties in `ownerState` (#37668) @vonagam + +### `@mui/system@5.13.7` + +- [Stack] Fix spacing when there are `<style>` children (#34966) @cmd-johnson + +### `@mui/icons-material@5.13.7` + +- [icons] Add Microsoft logo (#37717) @zephyrus21 + +### `@mui/joy@5.0.0-alpha.86` + +- [Autocomplete][joy] Fix Autocomplete and Modal components to work together (#37515) @saikathalderr +- [Menu][Joy] Improve UX of `Menu` usage demo (#37797) @sai6855 + +### `@mui/base@5.0.0-beta.6` + +- [Slider][base][material][joy] Fix not draggable on the edge when `disableSwap={true}` (#35998) @sai6855 +- [Slider][base] Provide slot state to Slider's thumb slot props callback (#37749) @mnajdova +- [Tabs] Wrap TabsList context creation in useMemo (#37370) @michaldudak +- [TextareaAutosize] Fix wrong height measurement (#37185) @bigteech + +### `@mui/lab@5.0.0-alpha.135` + +- [Timeline] Fix position `alternate-reverse` generated classname (#37678) @ZeeshanTamboli + +### Docs + +- [docs][base] Add demo for using the Button as a link (#37317) @AdamSundberg +- [docs][base] Add Tailwind CSS + plain CSS demo on the Select page (#37725) @mnajdova +- [docs][base] Make Base UI input demos denser (#37750) @zanivan +- [docs][base] Make Base UI button demos denser (#37689) @zanivan +- [docs][base] Add Tailwind CSS & plain CSS demos on the Input page (#37685) @mnajdova +- [docs][base] Fix horizontal scrolling on the mobile input page (#37688) @zanivan +- [docs] Improve Base UI index page (#37761) @oliviertassinari +- [docs] Fix incorrect package URL in README of example material-vite (#37755) @Dlouxgit +- [docs] Explain how to disable Base Select's portal (#37684) @michaldudak +- [docs] Shorten overview page URLs (#37660) @oliviertassinari +- [docs][material] Rename custom tab panel in Tabs demo to prevent confusion with @mui/lab (#37638) @MUK-Dev +- [docs][tabs] Document how to use routing with Tabs in Base UI (#37369) @michaldudak +- [docs] Rename product to productId (#37801) @siriwatknp +- [docs][base] Add Tailwind CSS & plain CSS demo on the Slider page (#37736) @mnajdova + +### Core + +- [docs–infra] Prevent displaying multiple ads (#37696) @oliviertassinari +- [blog] Fix mismatch between plan and link @oliviertassinari +- [core] Update yarn lockfile (#37802) @michaldudak +- [core] Add bundle size Toolpad app link to PRs (#36311) @Janpot +- [core] Fix priority support prompt action flow (#37726) @DanailH +- [core] Fix typo in priority support @oliviertassinari +- [core][docs] add Eslint rule to ensure main demo component match file… (#37278) @alexfauquette +- [docs-infra] Fix truncated TOCs scrollbar (#37770) @oliviertassinari +- [docs-infra] Adjust demo container to be glued to the toolbar (#37744) @danilo-leal +- [docs-infra] Fix layout shift ad (#37694) @oliviertassinari +- [docs-infra] Improve demos toolbar (#37762) @oliviertassinari +- [docs-infra] Make the GitHub link in the nav bar open in a new tab (#37766) @gateremark +- [docs-infra] Allow to persist icons in ToC (#37731) @cherniavskii +- [docs-infra] Improve product mapping (#37729) @oliviertassinari +- [docs-infra] Add design polish to the comment and anchor buttons (#37734) @danilo-leal +- [docs-infra] Tweak editable code blocks callout design (#37681) @danilo-leal +- [docs-infra] Improve the edit page experience (#37695) @oliviertassinari +- [docs-infra] Support rendering markdown outside of docs (#37691) @oliviertassinari +- [docs-infra] Polish demo toolbar button designs (#37680) @danilo-leal +- [docs-infra] Adjust demo component container design (#37659) @danilo-leal +- [test] Fix test:e2e local run (#37719) @oliviertassinari +- [test] Remove failing test in dev @oliviertassinari +- [website] Add no-op service worker to fix stale cache issue (#37607) @cherniavskii +- [website] Transition the Core page to be Material UI instead (#37583) @danilo-leal +- [website] Update the pricing page to reflect sales (#37751) @oliviertassinari +- [website] Match Copyright with the rest of the website @oliviertassinari +- [website] Support deep linking to pricing FAQ @oliviertassinari + +All contributors of this release in alphabetical order: @AdamSundberg, @alexfauquette, @bigteech, @cherniavskii, @cmd-johnson, @DanailH, @danilo-leal, @Dlouxgit, @gateremark, @Janpot, @michaldudak, @mnajdova, @MUK-Dev, @oliviertassinari, @sai6855, @saikathalderr, @siriwatknp, @vonagam, @zanivan, @ZeeshanTamboli, @zephyrus21 + +## 5.13.6 + +_Jun 21, 2023_ + +A big thanks to the 25 contributors who made this release possible. Here are some highlights ✨: + +- 💫 Added [Slider](https://mui.com/material-ui/react-slider/#material-you-version) component using the new Material You design language (#37520) @DiegoAndai. +- 📚 Added [examples](https://github.com/mui/material-ui/tree/master/examples/material-ui-nextjs-ts) showcasing how you can use Material UI with next.js's app directory (#37315) @smo043 + +### `@mui/material@5.13.6` + +- ​<!-- 45 -->[Autocomplete] Fixed autocomplete's existing option selection (#37012) @bencevoros +- ​<!-- 44 -->[Autocomplete] Add hint demos to Material UI and Joy UI docs (#37496) @sai6855 +- ​<!-- 13 -->[Masonry] Fix ResizeObserver loop limit exceeded error (#37208) @hbjORbj +- ​<!-- 11 -->[Tooltip][material] Improve warning when Tooltip receives string child (#37530) @DiegoAndai +- ​<!-- 10 -->[Modal] Add missing members to ModalOwnProps (#37568) @ivp-dev +- ​<!-- 09 -->[Slider] Arrow keys control does not work with float numbers (#37071) @gitstart +- ​<!-- 08 -->[SvgIcon] allow `svg` as a child (#37231) @siriwatknp +- ​<!-- 07 -->[Timeline] Add alternate reverse position (#37311) @abhinavkmrru +- ​<!-- 06 -->[Tooltip] Fix type of sx prop in `slotProps` (#37550) @SuperKXT +- ​<!-- 05 -->[TouchRipple] perf: avoid calling `clearTimeout()` (#37512) @romgrk + +### `@mui/material-next@6.0.0-alpha.90` + +- ​<!-- 12 -->[Material You] Add Slider component with Material You design (#37520) @DiegoAndai + +### `@mui/joy@5.0.0-alpha.85` + +- ​<!-- 37 -->[ButtonGroup][joy] Missing border when spacing is more than zero (#37577) @siriwatknp +- ​<!-- 36 -->[CardActions][joy] Add `CardActions` component (#37441) @siriwatknp +- ​<!-- 14 -->[Menu][joy] Fix closing of `Menu` in demos (#36917) @sai6855 + +### `@mui/base@5.0.0-beta.5` + +- ​<!-- 39 -->[Menu][base] Add the resetHighlight action (#37392) @michaldudak +- ​<!-- 38 -->[Select][base] Expose the `areOptionsEqual` prop (#37615) @michaldudak + +### `@mui/utils@5.13.2` + +- ​<!-- 04 -->[utils] Allow nested imports in @mui/utils to speed up build (#37586) @flaviendelangle + +### Docs + +- ​<!-- 43 -->[docs][base] Improve Base UI all components images (#37590) @danilo-leal +- ​<!-- 42 -->[docs][base] Add pages for coming soon components (#37575) @danilo-leal +- ​<!-- 41 -->[docs][base] Add a Snackbar introduction demo (#37602) @danilo-leal +- ​<!-- 40 -->[docs][base] Add page for all Base UI components (#37536) @danilo-leal +- ​<!-- 33 -->[docs] Fix scrollbar on snackbar page (#37657) @oliviertassinari +- ​<!-- 32 -->[docs] Switch order of snackbar buttons in demos (#37389) @Primajin +- ​<!-- 31 -->[docs] Add support for Tailwind CSS and plain CSS demos (#37319) @mnajdova +- ​<!-- 30 -->[docs] Tree view color fix for dark mode in Gmail example (#37051) @PunitSoniME +- ​<!-- 29 -->[docs] Inline the Base UI demo (#37603) @oliviertassinari +- ​<!-- 28 -->[docs] Fix typo in themed components page (#37598) @vinayr +- ​<!-- 27 -->[docs] Fix render inline code in CSS description generation (#37448) @alexfauquette +- ​<!-- 26 -->[docs] Add styles to styled argument list (#37558) @DiegoAndai +- ​<!-- 25 -->[docs] Improve awkward wording in READMEs of example projects (#37110) @DIWAKARKASHYAP +- ​<!-- 24 -->[docs] Fix small base -> base-ui migration issue (#37594) @oliviertassinari +- ​<!-- 23 -->[docs] Fix GitHub typo (#37578) @oliviertassinari +- ​<!-- 22 -->[docs] Improve release guide (#37547) @DiegoAndai +- ​<!-- 21 -->[docs] Review fixes to the Material UI's "Example projects" page (#37444) @danilo-leal +- ​<!-- 17 -->[docs][joy] Add a messages template (#37546) @sernstberger +- ​<!-- 16 -->[docs][joy] Add pages for coming soon Joy UI components (#36920) @danilo-leal +- ​<!-- 15 -->[docs][joy] Add design and consistency tweaks to the Playground (#37580) @danilo-leal +- ​<!-- 37 -->[docs] Add and revise Base UI + Create React App examples (#36825) @samuelsycamore +- ​<!-- 20 -->[docs-infra] Fix demos border radius (#37658) @oliviertassinari +- ​<!-- 19 -->[docs-infra] Add analyticsTags to Algolia (#37600) @Janpot +- ​<!-- 18 -->[docs-infra] Simplify product id handling (#37593) @oliviertassinari +- ​<!-- 35 -->[changelog] Add missing release date for v5.13.5 @oliviertassinari +- ​<!-- 16 -->[examples] Shell command fix in the readme file of material-next-ts example (#37675) @bablukpik +- ​<!-- 15 -->[examples] Next.js v13 app router with Material UI (#37315) @smo043 + +### Core + +- ​<!-- 34 -->[core] Update to Node.js v18 for `test-dev` CI (#37604) @ZeeshanTamboli +- ​<!-- 39 -->[core] Add priority support issue template (#37671) @DanailH +- ​<!-- 03 -->[website] Update roadmap page (#37587) @cherniavskii +- ​<!-- 02 -->[website] Add CSP to limit iframes to self @oliviertassinari +- ​<!-- 01 -->[website] Link mui-x Stack Overflow in footer link (#37509) @richbustos + +All contributors of this release in alphabetical order: @abhinavkmrru, @alexfauquette, @bencevoros, @cherniavskii, @danilo-leal, @DiegoAndai, @DIWAKARKASHYAP, @flaviendelangle, @gitstart, @hbjORbj, @ivp-dev, @Janpot, @michaldudak, @mnajdova, @oliviertassinari, @Primajin, @PunitSoniME, @richbustos, @romgrk, @sai6855, @sernstberger, @siriwatknp, @SuperKXT, @vinayr, @ZeeshanTamboli + +## 5.13.5 + +_Jun 12, 2023_ + +A big thanks to the 9 contributors who made this release possible. Here are some highlights ✨: + +- 💫 Added `ButtonGroup` component in Joy UI (#37407) @siriwatknp. +- 🐛 bug fixes and 📚 documentation improvements. + +### `@mui/material@5.13.5` + +- ​<!-- 03 -->[Material][Popover] Add support for virtual element as anchorEl (#37465) @DiegoAndai + +### `@mui/joy@5.0.0-alpha.84` + +- ​<!-- 20 -->[ButtonGroup][joy] Replace `detached` prop with `spacing`. (#37562) @siriwatknp +- ​<!-- 19 -->[ButtonGroup][joy] Add `ButtonGroup` component (#37407) @siriwatknp +- ​<!-- 04 -->[Input][joy] Simplify focus with `:focus-within` and add examples (#37385) @siriwatknp + +### Docs + +- ​<!-- 17 -->[docs] Move Toolpad from alpha to beta (#37288) @bharatkashyap +- ​<!-- 16 -->[docs] Add usage of createCssVarsProvider (#37513) @brijeshb42 +- ​<!-- 15 -->[docs] Update /base url references to /base-ui (#37412) @brijeshb42 +- ​<!-- 14 -->[docs] Skip components and hooks due to duplicate index (#37539) @siriwatknp +- ​<!-- 13 -->[docs] Polish Sign in to your account joy demo (#37498) @oliviertassinari +- ​<!-- 12 -->[docs] Remove outdated Material UI FAQ @oliviertassinari +- ​<!-- 11 -->[docs] Fix crash access to localStorage in Firefox (#37518) @brijeshb42 +- ​<!-- 10 -->[docs-infra] Enforce max length on description (#37565) @oliviertassinari +- ​<!-- 09 -->[docs-infra] Mandatory versions (#37497) @oliviertassinari +- ​<!-- 08 -->[docs-infra] Fix lighthouse img size issue (#37415) @oliviertassinari +- ​<!-- 07 -->[docs][joy] Replace JoyInput with Input component in JoyUI Text Field documentation (#37548) @musama619 +- ​<!-- 06 -->[docs][joy] Add typography introduction demo component (#37553) @sernstberger +- ​<!-- 05 -->[docs][joy] Add a rental dashboard template (#37453) @sernstberger + +### Core + +- ​<!-- 21 -->Move the React Community Engineer - X in Open Roles (#37552) @DanailH +- ​<!-- 18 -->[core] Update Node.js version to v18 on CircleCI, CodeSandbox, and Netlify (#37173) @ZeeshanTamboli +- ​<!-- 02 -->[website] RIDI gold sponsorship end (#37517) @oliviertassinari +- ​<!-- 01 -->[website] Update X landing page (#37387) @cherniavskii + +All contributors of this release in alphabetical order: @brijeshb42, @cherniavskii, @DanailH, @DiegoAndai, @musama619, @oliviertassinari, @sernstberger, @siriwatknp, @ZeeshanTamboli + +## 5.13.4 + +<!-- generated comparing v5.13.3..master --> + +_Jun 5, 2023_ + +A big thanks to the 12 contributors who made this release possible. Here are some highlights ✨: + +### `@mui/material@5.13.4` + +- ​<!-- 20 -->[Autocomplete][material] Add missing `focusVisible` class in AutocompleteClasses (#37502) @sai6855 +- ​<!-- 04 -->[Menu][material] Fix MenuPaper class composition precedence (#37390) @DiegoAndai +- ​<!-- 03 -->[MenuList] Fix to allow conditional rendering for a menu item under ListSubheader (#36890) @danielplewes +- ​<!-- 02 -->[Stepper] Handle progress bar of mobile stepper when `steps` is one (#37079) @gitstart + +### `@mui/base@5.0.0-beta.4` + +- ​<!-- 16 -->[Input][base] Fix calling slotProps event handlers (#37463) @sai6855 + +### `@mui/joy@5.0.0-alpha.82` + +- ​<!-- 19 -->[Avatar][joy] Fallback to `alt` when `src` or `srcSet` are not defined (#37469) @vishalthatipamula0219 +- ​<!-- 15 -->[Card][joy] Improve usability of card family (#37474) @siriwatknp + +### Docs + +- ​<!-- 18 -->[docs][base] useAutocomplete demos & docs (#37029) @mj12albert +- ​<!-- 17 -->[docs][base] Remove usage of `component` prop in docs (#37462) @sai6855 +- ​<!-- 13 -->[docs] Fix docs redirections @oliviertassinari +- ​<!-- 12 -->[docs] Fix Fluent -> Fluent UI @oliviertassinari +- ​<!-- 11 -->[docs] Fix MUI Base -> Base UI @oliviertassinari +- ​<!-- 10 -->[docs] Add base-vite-tailwind example repo (#36994) @mj12albert +- ​<!-- 09 -->[docs] Fix search bar layout shift (#37460) @oliviertassinari +- ​<!-- 08 -->[docs] Tweak Material UI's "Showcase" page design (#37259) @danilo-leal +- ​<!-- 07 -->[docs] Tweak Material UI's "Template" page design (#37260) @danilo-leal +- ​<!-- 06 -->[docs] Fix "Language" page removal leftovers (#37408) @danilo-leal +- ​<!-- 05 -->[docs] Move contents of css-variables to sibling pages (#37411) @brijeshb42 + +### Core + +- ​<!-- 14 -->[core] Do not let Renovate handle `examples` packages updates (#37386) @ZeeshanTamboli +- ​<!-- 01 -->[website] Add header filters to the pricing table (#37455) @MBilalShafi + +All contributors of this release in alphabetical order: @brijeshb42, @danielplewes, @danilo-leal, @DiegoAndai, @gitstart, @MBilalShafi, @mj12albert, @oliviertassinari, @sai6855, @siriwatknp, @vishalthatipamula0219, @ZeeshanTamboli + +## 5.13.3 + +<!-- generated comparing v5.13.2..master --> + +_May 29, 2023_ + +A big thanks to the 15 contributors who made this release possible. +This release focuses primarily on 🐛 bug fixes and 📚 documentation improvements. + +### `@mui/material@5.13.3 + +- ​<!-- 22 -->[Autocomplete] Accept external Listbox ref (#37325) @sai6855 +- ​<!-- 06 -->[Modal] Pass `className` from `BackdropProps` (#37399) @hbjORbj + +### `@mui/base@5.0.0-beta.3` + +- ​<!-- 20 -->[base] Maintain nodes document order in compound components (#36857) @michaldudak +- ​<!-- 19 -->[base][joy] Prevent persisting hover state styles onclick on mobile (#36704) @gitstart +- ​<!-- 18 -->[Menu][base] MenuItem as a link does not work (#37242) @nicolas-ot +- ​<!-- 17 -->[MenuItem][Base] Pass idGenerator function (#37364) @sai6855 +- ​<!-- 16 -->[Slider][Base] Add Vertical slider demo (#37357) @sai6855 + +### `@mui/joy@5.0.0-alpha.82` + +- ​<!-- 23 -->[Select][joy] Fix popup does not close (#37435) @siriwatknp +- ​<!-- 21 -->[Badge][Joy] Fix `slots` element type in API docs (#37329) @zignis +- ​<!-- 04 -->[Select] [joy] Handle long text content (#37289) @akash191095 +- ​<!-- 07 -->[Tooltip][Joy] Interactive doesn't work (#37159) @nicolas-ot + +### `@mui/codemod@5.13.3 + +- ​<!-- 05 -->[mui-codemod] Add missing script to README (#37377) @hbjORbj + +### Docs + +- ​<!-- 14 -->[docs] Clarify Hidden down props as exclusive (#36927) @canac +- ​<!-- 13 -->[docs] Add refine to Material UI "Related projects" and "More advanced example projects" pages (#37308) @necatiozmen +- ​<!-- 12 -->[docs] Remove todo link from sidebar (#37373) @brijeshb42 +- ​<!-- 11 -->[docs] Clarify the peer dependency with react (#37360) @oliviertassinari +- ​<!-- 10 -->[docs] Divider vertical middle prop migration (#36840) @JhonnK08 +- ​<!-- 09 -->[docs] Fix branding theme tabs and navigation bar regressions (#37362) @ZeeshanTamboli +- ​<!-- 08 -->[docs-infra] Throw on incorrect internal links (#37326) @oliviertassinari + +### Core + +- ​<!-- 15 -->[core] Include scoped JSX namespace when resolving props (#37404) @LukasTy +- ​<!-- 03 -->[test][useMediaQuery] Change SSR test description (#37403) @zignis +- ​<!-- 02 -->[website] Sync with Ashby @oliviertassinari +- ​<!-- 01 -->[website] Add David to about page (#37379) @DavidCnoops + +All contributors of this release in alphabetical order: @akash191095, @brijeshb42, @canac, @DavidCnoops, @gitstart, @hbjORbj, @JhonnK08, @LukasTy, @michaldudak, @necatiozmen, @nicolas-ot, @oliviertassinari, @sai6855, @ZeeshanTamboli, @zignis + +## 5.13.2 + +<!-- generated comparing v5.13.1..master --> + +_May 22, 2023_ + +A big thanks to the 12 contributors who made this release possible. +📚 This release focuses primarily on documentation improvements. + +### `@mui/material@5.13.2 + +- [Slider] Tooltip positioning fixed for vertical slider (#37049) @PunitSoniME + +### Docs + +- [docs][base] Remove default annotations from useTabsList return type (#37324) @TinaSay +- [docs][base] Remove default annotations from useTabPanel return type (#37323) @TinaSay +- [docs][base] Remove default annotations from useSwitch return type (#37322) @TinaSay +- [docs][base] Remove default annotations from useInput return type (#37321) @TinaSay +- [docs][base] Remove default annotations from useAutocomplete return type (#37320) @TinaSay +- [docs][base] Remove default annotations from useBadge's return type (#37313) @TinaSay +- [docs][base] Remove default annotations from useButton's return type (#37312) @TinaSay +- [docs][base] Remove default annotations from useSlider's return type (#37309) @TinaSay +- [docs] Remove Material UI's "Languages" page (#37314) @danilo-leal +- [docs] Prefer to link GitHub repository @oliviertassinari +- [docs] Move product versions to page context (#35078) @m4theushw +- [docs] Fix v5 migration npm install instruction (#37293) @oliviertassinari +- [docs][Tab] Add vertical tabs demo (#37292) @sai6855 +- [docs][Transitions] Fix typo in code sample (#37300) @alexfauquette +- [examples] Remove `@babel/plugin-proposal-class-properties` from Material-Express-SSR example (#37305) @ZeeshanTamboli +- [Website] Add Brijesh to About page (#37318) @brijeshb42 +- [website] Update pricing table (#37290) @cherniavskii +- [website] Update core open roles (#37224) @mnajdova + +### Core + +- Revert "[core] Remove outdated babel proposal plugins (#36795)" (#37331) @michaldudak +- [core] Move esmExternals to the shared next config (#37332) @michaldudak + +All contributors of this release in alphabetical order: @alexfauquette, @brijeshb42, @cherniavskii, @danilo-leal, @m4theushw, @michaldudak, @mnajdova, @oliviertassinari, @PunitSoniME, @sai6855, @TinaSay, @ZeeshanTamboli + +## 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 --> + +_May 10, 2023_ + +A big thanks to the 18 contributors who made this release possible. Here are some highlights ✨: + +- 🚀 Base UI is now in beta - all planned breaking changes are now complete! +- 🗺 We have new [project boards](https://github.com/mui/material-ui/projects?query=is%3Aopen) on GitHub where you can learn about what's coming next. +- 🐛 Various bug fixes, 📚 documentation and 🧪 testing improvements + +### `@mui/material@5.13.0` + +- [Autocomplete] Support `ChipComponent` type (#37112) @sai6855 +- [AppBar] Fix component type (#37172) @sai6855 +- [Select] Simplify handleChange in SelectInput (#37040) @ulrichstark + +### `@mui/joy@5.0.0-alpha.79` + +- [Input][joy] Improve alignment on date fields (#37146) @wewakekumar +- [Alery][joy] Turn JS test to TS test (#37077) @hbjORbj +- [AspectRatio][joy] js test replaced with TypeScript test (#37087) @PunitSoniME +- [Badge][AvatarGroup][joy] js test replaced with TypeScript test (#37089) @PunitSoniME +- [Box][Card][MenuList][joy] Turn JS test to TS test (#37126) @uuxxx +- [List][Menu][joy] Turn JS test to TS test (#37123) @uuxxx +- [test][Joy] Remove duplicate Avatar test (#37201) @zignis +- [test][joy] js test cases converted to TypeScript (#37117) @PunitSoniME +- [Button][joy] Convert Button test to TypeScript (#37181) @akash191095 +- [CardContent][CardCover][CardOverflow][Chip][ChipDelete][joy] js text case converted to TypeScript (#37116) @PunitSoniME +- [Radio][IconButton][Checkbox][Option][joy] Switch to TypeScript unit test (#37137) @DerTimonius + +### `@mui/base@5.0.0-beta.0` + +- [Select][base] Do not call onChange after initial render (#37141) @michaldudak +- [Select][base] Rename the `optionStringifier` prop (#37118) @michaldudak +- [typescript][base] Fix types of components callbacks parameters (#37169) @michaldudak +- [Select], [TablePagination] Use more descriptive parameter names (#37064) @michaldudak + +### Docs + +- [docs] Stray design tweaks to Base UI demos (#37003) @danilo-leal +- [docs] Move outdated CSS prefixing docs (#36710) @kriskw1999 +- [docs] Improve "Example projects" page design (#37007) @danilo-leal +- [docs] Redirect NoSsr, Portal and TextareaAutosize to Base UI API page (#37175) @ZeeshanTamboli +- [docs] Demonstrate `TextField` customization using theme style overrides (#36805) @ZeeshanTamboli +- [docs] Tweak the "Edit this page" button icon (#37142) @danilo-leal +- [docs] Update links to the public roadmap (#36995) @mnajdova +- [docs] Improve Multiselect demo styling (#37120) @michaldudak +- [Stack] Fix import description @oliviertassinari + +### Core + +- [blog] Fix images using "MUI Base" instead of "Base UI" (#37044) @danilo-leal +- [core] Add VSCode extensions recommendations (#37166) @michaldudak +- [test] `e2e-website` related minor fixes (#37204) @ZeeshanTamboli +- [website] Update the active positions (#37075) @DanailH +- [website] Add Romain to the About page (#37124) @romgrk +- [website] Make Toolpad alpha labels consistent (#37125) @gerdadesign + +All contributors of this release in alphabetical order: @akash191095, @DanailH, @danilo-leal, @DerTimonius, @gerdadesign, @hbjORbj, @kriskw1999, @michaldudak, @mnajdova, @oliviertassinari, @PunitSoniME, @romgrk, @sai6855, @ulrichstark, @uuxxx, @wewakekumar, @ZeeshanTamboli, @zignis + +## 5.12.3 + +<!-- generated comparing v5.12.2..master --> + +_May 2, 2023_ + +A big thanks to the 18 contributors who made this release possible. Here are some highlights ✨: + +- all planned breaking changes for Base UI are done. The first beta release should come next week 🎉 +- 🐛 bug fixes and 📚 documentation improvements. + +### `@mui/material@5.12.3` + +- ​<!-- 43 -->[Accordion] Add missing `component` type (#37111) @sai6855 +- ​<!-- 23 -->[ButtonGroup] Should not retain divider color when it is disabled and variant is `text` (#36967) @DavidBoyer11 +- ​<!-- 21 -->[Divider] Fix styles on dividers with text (#35072) @maxdestors +- ​<!-- 04 -->[TextField] Improve IntelliSense support for props (#36737) @sai6855 +- ​<!-- 03 -->[TextField] Fix running click event on disabled (#36892) @sai6855 + +### `@mui/joy@5.0.0-alpha.78` + +- ​<!-- 09 -->[Joy] Miscellaneous fixes and docs improvement (#37026) @siriwatknp + +### `@mui/base@5.0.0-alpha.128` + +#### Breaking changes + +- The `component` prop is no longer supported because it can be replaced with the slots API. This is how the transformation will look like: + + ```diff + <Button + - component="span" + + slots={{ root: "span" }} + /> + ``` + + If using TypeScript, the custom component type should be added as a generic on the `Button` component. + + ```diff + -<Button + +<Button<typeof CustomComponent> + slots={{ root: CustomComponent }} + customProp="foo" + /> + ``` + + There is codemod that you can run in your project to do the transformation: + + ```bash + npx @mui/codemod@latest v5.0.0/base-remove-component-prop <path> + ``` + + The full documentation about the codemod can be found [here](https://github.com/mui/material-ui/blob/master/packages/mui-codemod/README.md#base-remove-component-prop). + + This is the list of PR related to this change: + + - ​<!-- 40 -->[Button][base] Drop `component` prop (#36677) @mnajdova + - ​<!-- 42 -->[Badge][base] Drop `component` prop (#37028) @hbjORbj + - ​<!-- 37 -->[FormControl][base] Drop component prop (#37031) @hbjORbj + - ​<!-- 35 -->[Input][base] Drop component prop (#37057) @hbjORbj + - ​<!-- 34 -->[Menu][base] Drop component prop (#37033) @hbjORbj + - ​<!-- 33 -->[MenuItem][base] Drop component prop (#37032) @hbjORbj + - ​<!-- 32 -->[Modal][base] Drop component prop (#37058) @hbjORbj + - ​<!-- 31 -->[Option][base] Drop component prop (#37052) @hbjORbj + - ​<!-- 30 -->[OptionGroup][base] Drop component prop (#37055) @hbjORbj + - ​<!-- 31 -->[Popper][base] Drop component prop (#37084) @hbjORbj + - ​<!-- 29 -->[Select][base] Drop component prop (#37035) @hbjORbj + - ​<!-- 28 -->[Slider][base] Drop component prop (#37056) @hbjORbj + - ​<!-- 27 -->[Snackbar][base] Drop component prop (#37041) @nicolas-ot + - ​<!-- 26 -->[Switch][base] Drop component prop (#37053) @hbjORbj + - ​<!-- 25 -->[Tab][base] Drop component prop (#36768) @sai6855 + - ​<!-- 24 -->[Tabs][base] Drop component prop (#36770) @sai6855 + - ​<!-- 08 -->[TablePagination][base] Drop component prop (#37059) @sai6855 + - ​<!-- 07 -->[TabPanel][base] Drop component prop (#37054) @sai6855 + - ​<!-- 06 -->[TabsList][base] Drop component prop (#37042) @sai6855 + +- ​<!-- 41 -->[base] Improve API consistency (#36970) @michaldudak + + Brought consistency to Base UI components and hooks' parameters and return values: + + 1. Whenever a hook needs a ref, it's now called `<slot_name>Ref`, which matches the `get<slot_name>Props` in the return value. + 2. All hooks that accept external refs now return merged refs, making combining multiple hooks on one element easier. This was proven necessary in several compound components (like menuItem being both a button and a list item). The type of this value is `React.RefCallback` as using the more general `React.Ref` caused variance issues. + 3. Type of accepted refs is standardized to `React.Ref<Element>` + 4. Naming and typing of the forwarded ref in unstyled components were standardized - it's forwardedRef: React.ForwardedRef<Element> (unless a more specific type is needed). + 5. The shape of the definition of unstyled components was standardized - it's React.forwardRef(function Component(props: Props, forwardedRef: React.Ref<Element>) { ... });. Specifically, the generic parameters of forwardRef were removed as they are specified in function arguments. + +#### Changes + +- ​<!-- 36 -->[FormControl][base] Do not use optional fields in useFormControlContext's return value (#37037) @michaldudak + +### Docs + +- ​<!-- 39 -->[base][docs] Add Base UI Quickstart Guide (#36717) @mj12albert +- ​<!-- 20 -->[docs] Fix Material UI's API linking to Base UI (#37121) @mnajdova +- ​<!-- 19 -->[docs] Fix pagination in the DataGrid demo (#37114) @cherniavskii +- ​<!-- 18 -->[docs] Add notification to the release of the new Time Picker UI (#37065) @joserodolfofreitas +- ​<!-- 17 -->[docs] Specify "Material UI" (not "MUI") where appropriate throughout the docs (#37066) @samuelsycamore +- ​<!-- 16 -->[docs] Use focus-visible instead of focus for Menu demos (#36847) @michaldudak +- ​<!-- 15 -->[docs] Fix small regressions API pages (#36972) @oliviertassinari +- ​<!-- 14 -->[docs] Handle a few docs-feedback (#36977) @oliviertassinari +- ​<!-- 13 -->[docs] Fix anchor link in customization (#37004) @oliviertassinari +- ​<!-- 12 -->[docs] Add a note about minimal required version for theme merging to the guides (#36973) @jakub-stastny +- ​<!-- 11 -->[docs] smooth scrolling added for `back to top` (#37011) @PunitSoniME +- ​<!-- 10 -->[docs] Remove `useFormControl` return values from demos page (#37036) @ZeeshanTamboli +- ​<!-- 47 --> [docs][base] Move styles to the bottom of demos code for `SwitchUnstyled` (#36720) @varunmulay22 +- ​<!-- 46 --> [docs][base] Move styles to the bottom of demos code for `InputUnstyled` (#36724) @varunmulay22 +- ​<!-- 45 --> [docs][base] Move styles to the bottom of demos code for `SliderUnstyled` (#36721) @varunmulay22 +- ​<!-- 44 --> [docs][base] Move styles to the bottom of demos code for `Snackbar` (#36719) @varunmulay22 +- ​<!-- 38 -->[docs][base] Move styles to the bottom of demos code for `SelectUnstyled` (#36718) @varunmulay22 +- ​<!-- 05 -->[templates] Image not displayed in blog layout of React template. (#36991) @navedqb +- ​<!-- 02 -->[website] Take the design role offline @oliviertassinari +- ​<!-- 01 -->[website] Fix URL convention @oliviertassinari +- ​<!-- 21 -->[docs] Turn off job banner on docs (#36080) @joserodolfofreitas + +### Core + +- ​<!-- 22 -->[core] Allow type alias as well in hooks API docs generation (#37034) @ZeeshanTamboli + +All contributors of this release in alphabetical order: @cherniavskii, @DavidBoyer11, @hbjORbj, @jakub-stastny, @joserodolfofreitas, @maxdestors, @michaldudak, @mj12albert, @mnajdova, @navedqb, @nicolas-ot, @oliviertassinari, @PunitSoniME, @sai6855, @samuelsycamore, @siriwatknp, @varunmulay22, @ZeeshanTamboli + +## 5.12.2 + +<!-- generated comparing v5.12.1..master --> + +_Apr 25, 2023_ + +A big thanks to the 12 contributors who made this release possible. Here are some highlights ✨: + +- ⚠️ **[BREAKING CHANGE]** The `Unstyled` suffix has been removed from Base UI component names, including names of types and other related identifiers – a codemod script is provided to assist with the change. +- 🐛 bug fixes and 📚 documentation improvements. + +### `@mui/material@5.12.2` + +- ​<!-- 10 -->[FormControl] Fix `filled` when value is set through `inputProps` (#36741) @sai6855 +- ​<!-- 07 -->[Slider] `onChange` handler should be called only when value has changed (#36706) @gitstart +- ​<!-- 06 -->[Table] Fix `Sorting & Selecting` tables (#36898) @oliviertassinari + +### `@mui/base@5.0.0-alpha.127` + +#### Breaking changes + +- ​<!-- 27 -->[base] Remove unstyled suffix from Base components + Codemod script (#36873) @hbjORbj + + The `Unstyled` suffix has been removed from all Base UI component names, including names of types and other related identifiers. + + You can use this [codemod](https://github.com/mui/material-ui/blob/master/packages/mui-codemod/src/v5.0.0/base-remove-unstyled-suffix.js) to help with the migration: + + ```bash + npx @mui/codemod@latest v5.0.0/base-remove-unstyled-suffix <path> + ``` + +#### Changes + +- ​<!-- 26 -->[codemod][base] Improve the removal of `component` prop codemod script (#36952) @hbjORbj +- ​<!-- 25 -->[codemod][base] Write a migration script for removal of `component` prop from components (#36831) @hbjORbj +- ​<!-- 24 -->[Base][useButton] Allow useButton params to be completely optional (#36922) @mj12albert + +### `@mui/joy@5.0.0-alpha.77` + +- ​<!-- 23 -->[Joy][Chip] Chip button not showing up in Firefox browser (#36930) @TakhyunKim +- ​<!-- 09 -->[Joy] Add `invertedColors` to Menu and Alert (#36975) @siriwatknp +- ​<!-- 08 -->[joy][Select] Set focus visible on select options when navigating with arrow keys (#36689) @gitstart + +### Docs + +- ​<!-- 21 -->[docs] Fix console error introduced by #36408 (#36980) @alexfauquette +- ​<!-- 20 -->[docs] Add stray Joy UI documentation improvements (#36921) @danilo-leal +- ​<!-- 19 -->[docs] Add Joy profile dashboard template (#36931) @siriwatknp +- ​<!-- 18 -->[docs] Fix 404 links (#36969) @oliviertassinari +- ​<!-- 17 -->[docs] Clarify when bundle size optimization is needed (#36823) @oliviertassinari +- ​<!-- 16 -->[docs] Fix Chakra UI theme scoping typo (#36950) @mj12albert +- ​<!-- 15 -->[docs] Add snackbar example using sonner (#36926) @PupoSDC +- ​<!-- 14 -->[docs] Adjust the Material Icons page design and formatting (#36937) @danilo-leal +- ​<!-- 13 -->[docs] Allows to customize menu with any icon (#36408) @alexfauquette +- ​<!-- 12 -->[docs] Add info about passing ref to input element (#36913) @tomaskebrle +- ​<!-- 11 -->[docs][material] Tabs API section cleanup (#36942) @mnajdova + +### Core + +- ​<!-- 22 -->[core] Fix CI failure on `master` (#37016) @hbjORbj +- ​<!-- 05 -->[typescript] Add the missing explicit component return types (#36924) @michaldudak +- ​<!-- 04 -->[website] Update main data grid demo on X landing page (#37001) @cherniavskii +- ​<!-- 03 -->[website] Design role updates (#36997) @danilo-leal +- ​<!-- 02 -->[website] X component section improvements (#36598) @danilo-leal +- ​<!-- 01 -->[website] Developer Advocate role filled @oliviertassinari + +All contributors of this release in alphabetical order: @alexfauquette, @cherniavskii, @danilo-leal, @gitstart, @hbjORbj, @michaldudak, @mj12albert, @mnajdova, @oliviertassinari, @PupoSDC, @sai6855, @siriwatknp, @TakhyunKim, @tomaskebrle + +## 5.12.1 + +<!-- generated comparing v5.12.0..master --> + +_Apr 17, 2023_ + +A big thanks to the 16 contributors who made this release possible. This release was mostly about 🐛 bug fixes and 📚 documentation improvements. + +### `@mui/material@5.12.1` + +- ​<!-- 24 -->[Autocomplete] Fix autocomplete left padding (#36649) @mj12albert +- ​<!-- 17 -->[Button] Fix contained with inherit prop not adapting on dark mode (#34508) @jesrodri +- ​<!-- 07 -->[FormControlLabel] Add `required` prop (#34207) @emlai +- ​<!-- 04 -->[Tabs] Fix null reference in ScrollbarSize after unmounting (#36485) @rkdrnf +- ​<!-- 03 -->[TextField] Fix type error when using `inputTypeSearch` class for `outlined` and `filled` inputs (#36740) @sai6855 +- ​<!-- 02 -->[ThemeProvider] Fix theme proptypes (#36852) @siriwatknp + +### `@mui/system@5.12.1` + +#### Breaking changes + +- ​<!-- 06 -->[Grid2] Replace context with `cloneElement` (#36399) @siriwatknp + + `Grid2` now uses `React.cloneElement` instead of React context for passing the spacing and columns to the next container. The change is close to how CSS flexbox behaves. + +#### Changes + +- ​<!-- 14 -->[CssVarsProvider] Always generate new `css` object (#36853) @siriwatknp + +### `@mui/base@5.0.0-alpha.126` + +#### Breaking changes + +- ​<!-- 23 -->[base] Refactor the compound components building blocks (#36400) @michaldudak + Components affected by the changes are: + - Menu + - `MenuUnstyledContext` is replaced by `MenuProvider`. The value to pass to the provider is returned by the `useMenu` hook. + - MenuUnstyled's `onClose` prop is replaced by `onOpenChange`. It has the `open` parameter and is called when a menu is opened or closed + - Select + - `SelectUnstyledContext` is replaced by `SelectProvider`. The value to pass to the provider is returned by the `useSelect` hook. + - `SelectUnstyled`'s popup is permanently mounted. + - The `defaultOpen` prop was added to the SelectUnstyled. The open/close state can now be controlled or uncontrolled, as a `value`. + - Tabs + - `TabsContext` is replaced by `TabsProvider`. The value to pass to the provider is returned by the `useTabs` hook. + - To deselect all tabs, pass in `null` to Tabs' `value` prop, instead of `false`. This is consistent with how Select works. + - The `value` prop is still technically not mandatory on TabUnstyled and TabPanel, but when omitted, the contents of the selected tab panel will not be rendered during SSR. + +### `@mui/joy@5.0.0-alpha.76` + +- ​<!-- 05 -->[Table][Joy] Replace uses of css selector `*-child` to `*-of-type` (#36839) @keyvanm + +### Docs + +- ​<!-- 25 --> [docs][base] Move styles to the bottom of demos code for `BadgeUnstyled` (#36723) @varunmulay22 +- ​<!-- 22 -->[docs][base] Mention that the hook does not accept any parameters in the `Parameters` section of the API docs (#36773) @ZeeshanTamboli +- ​<!-- 21 -->[docs][base] Move styles to the bottom of demos code for `ModalUnstyled` (#36580) @gitstart +- ​<!-- 20 -->[docs][base] Move styles to the bottom of demos code for `Tabs` (#36577) @gitstart +- ​<!-- 19 -->[docs][base] Move styles to the bottom of demos code for `Popper` (#36578) @gitstart +- ​<!-- 18 -->[docs][base] Move styles to the bottom of demos code for `TablePagination` (#36593) @gitstart +- ​<!-- 13 -->[docs] Remove the incorrect info about useButton's ref parameter (#36883) @michaldudak +- ​<!-- 12 -->[docs] Sync <Stack> between projects (#36785) @oliviertassinari +- ​<!-- 11 -->[docs] Add guides to overriding component structure in Base UI and Joy UI docs (#34990) @samuelsycamore +- ​<!-- 10 -->[docs] Content changed from 'row' to 'orientation=horizontal' (#36858) @navedqb +- ​<!-- 09 -->[docs][Joy] `component`, `slots`, `slotProps` must be visible in Prop table in API docs (#36666) @hbjORbj +- ​<!-- 08 -->[docs][Select] Fix duplicate ID in small size Select demo (#36792) @sai6855 + +### Core + +- ​<!-- 16 -->[core] Use glob to find the test files in parseTest (#36305) @flaviendelangle +- ​<!-- 15 -->[core] Fix minor SEO issues @oliviertassinari +- ​<!-- 01 -->[website] Fix visual bug appbar (#36875) @oliviertassinari + +All contributors of this release in alphabetical order: @emlai, @flaviendelangle, @gitstart, @hbjORbj, @jesrodri, @keyvanm, @michaldudak, @mj12albert, @navedqb, @oliviertassinari, @rkdrnf, @sai6855, @samuelsycamore, @siriwatknp, @varunmulay22, @ZeeshanTamboli + +## 5.12.0 + +<!-- generated comparing v5.11.16..master --> + +_Apr 11, 2023_ + +A big thanks to the 9 contributors who made this release possible. Here are some highlights ✨: + +- 💫 Added [theme scope](https://mui.com/material-ui/guides/theme-scoping/) for using multiple design systems (#36664) @siriwatknp +- 🐛 bug fixes and 📚 documentation improvements. + +### `@mui/system@5.12.0` + +- ​<!-- 05 -->[system] Introduce theme scope for using multiple design systems (#36664) @siriwatknp + +### `@mui/base@5.0.0-alpha.125` + +- ​<!-- 06 -->[PopperUnstyled] Do not merge internal `ownerState` with `ownerState` from props (#36599) @hbjORbj + +### `@mui/joy@5.0.0-alpha.75` + +- ​<!-- 08 -->[Joy] Add tests for slots/slotProps for all components (#36828) @hbjORbj +- ​<!-- 07 -->[Joy] Support `slots`/`slotsProps` for every component (components with only root slot too) (#36540) @hbjORbj + +### Docs + +- ​<!-- 23 -->[docs][Backdrop] Improvements to the docs (#34244) @alirezahekmati +- ​<!-- 20 -->[docs] Fix base API redirects (#36833) @mnajdova +- ​<!-- 19 -->[docs] Improve perf on tab APIs (#36832) @mnajdova +- ​<!-- 18 -->[docs] Revert CircularProgress component text to be proper noun instead (#36837) @ZeeshanTamboli +- ​<!-- 17 -->[docs] Simplify language redirection @oliviertassinari +- ​<!-- 16 -->[docs] Add missing `readOnly` state class in the list (#36788) @ZeeshanTamboli +- ​<!-- 15 -->[docs] Improve side nav scroll into view (#36732) @oliviertassinari +- ​<!-- 14 -->[docs][base & joy] Display "Classes" Section in API docs (#36589) @hbjORbj +- ​<!-- 13 -->[docs] Fix 100+ typos throughout the Material UI docs (#36194) @Lioness100 +- ​<!-- 12 -->[docs] Change "coming soon" chip color (#36786) @danilo-leal +- ​<!-- 11 -->[docs][Joy] Fix wrong prop descriptions (#36826) @hbjORbj +- ​<!-- 10 -->[docs][material] Highlight global state classes in CSS table in API docs (#36633) @hbjORbj +- ​<!-- 09 -->[examples] Fix `SliderUnstyled` slots `key` name (#36830) @sai6855 +- ​<!-- 04 -->[Tabs] Improve useTab() API page (#36725) @oliviertassinari + +### Core + +- ​<!-- 22 -->[core] Increase margin to scroll @oliviertassinari +- ​<!-- 21 -->[core] Replace MUI Base with Base UI (#36716) @mnajdova +- ​<!-- 03 -->[website] Fix broken career website links @oliviertassinari +- ​<!-- 02 -->[website] Fix backlinks to homepage (#36801) @oliviertassinari +- ​<!-- 01 -->[website] Tweaks to the Designer position ad (#36771) @danilo-leal + +All contributors of this release in alphabetical order: @alirezahekmati, @danilo-leal, @hbjORbj, @Lioness100, @mnajdova, @oliviertassinari, @sai6855, @siriwatknp, @ZeeshanTamboli + +## 5.11.16 + +<!-- generated comparing v5.11.15..master --> + +_Apr 4, 2023_ + +A big thanks to the 17 contributors who made this release possible. Here are some highlights ✨: + +- 💅 Added tabs on API pages of Base UI to switch between component and hook references (#35938) @mnajdova +- 🐛 bug fixes and 📚 documentation improvements. + +### `@mui/material@5.11.16` + +- [Autocomplete] Listen for click on the root element (#36369) @sai6855 +- [Autocomplete] Fix navigation issue on mouse hover (#35196) @sai6855 +- [Card] Fix Card focus effect overflowing parent card (#36329) @mj12albert +- [Grid] Missing slot (#36765) @siriwatknp +- [Select] Make error part of the `ownerState` to enable overriding styles with it in theme (#36422) @gitstart +- [Slider] Fix ValueLabel UI issues comes when size="small" and orientation="vertical (#36738) @yushanwebdev + +### `@mui/icons-material@5.11.16` + +- [icons] Do not ignore popular icons (#36608) @michaldudak + +### `@mui/joy@5.0.0-alpha.74` + +- [Joy] Add `ModalOverflow` component (#36262) @siriwatknp +- [Joy] Fix `Checkbox` custom color prop type warning (#36691) @amal-qb + +### Docs + +- [docs][base] Add return type for `useFormControlUnstyledContext` hook (#36302) @HeVictor +- [docs][base] Move styles to the bottom of demos code for `FormControl` (#36579) @gitstart +- [docs][base] Move styles to the bottom of demos code for `Menu` (#36582) @gitstart +- [docs][base] Move styles code to bottom in the `Button` demos (#36590) @sai6855 +- [docs][base] Show components & hooks API on the components page (#35938) @mnajdova +- [docs] Describe slotProps in MUI Base customization doc (#36206) @michaldudak +- [docs] Fix double API page redirection (#36743) @oliviertassinari +- [docs] Remove hash property and leverage pathname (#36764) @siriwatknp +- [docs] Introduce markdown permalink to source (#36729) @oliviertassinari +- [docs] Tabs API add slots section (#36769) @mnajdova +- [docs] Update feedbacks management on slack (#36705) @alexfauquette +- [docs] Fix Joy UI URL to tokens (#36742) @oliviertassinari +- [docs] Add toggle-button coming soon page (#36618) @siriwatknp +- [docs] Fix typo on the Joy UI theme builder (#36734) @danilo-leal +- [docs] Fix small typo (#36727) @RBerthier +- [docs] Fix Joy UI template broken image loading @oliviertassinari +- [docs] Hide the default API column if it's empty (#36715) @mnajdova +- [docs] Update Material UI Related Projects page (#34203) @viclafouch +- [docs] Revise Joy UI "Circular Progress" page (#36126) @LadyBluenotes +- [docs] Revise Joy UI "Radio" page (#35893) @DevinCLane +- [docs] Support Google Analytics 4 (#36123) @alexfauquette +- [docs][material] Keep consistency in description of classes (#36631) @hbjORbj +- [docs] Remove redundant files and fix regression (#36775) @ZeeshanTamboli + +### Core + +- [blog] Compress images @oliviertassinari +- [core] Remove unused token (#36722) @oliviertassinari + +All contributors of this release in alphabetical order: @alexfauquette, @amal-qb, @danilo-leal, @DevinCLane, @gitstart, @hbjORbj, @HeVictor, @LadyBluenotes, @michaldudak, @mj12albert, @mnajdova, @oliviertassinari, @RBerthier, @sai6855, @siriwatknp, @viclafouch, @yushanwebdev + +## 5.11.15 + +<!-- generated comparing v5.11.14..master --> + +_Mar 28, 2023_ + +A big thanks to the 10 contributors who made this release possible. We have one big highlight this week ✨: + +- @siriwatknp made a [Theme Builder](https://mui.com/joy-ui/customization/theme-builder) for Joy UI 🎨 (#35741) + +### `@mui/material@5.11.15` + +- [Chip] Fix error when theme value is a CSS variable (#36654) @siriwatknp +- [Grid2] Support dynamic nested columns (#36401) @siriwatknp + +### `@mui/system@5.11.15` + +- [system] Enable regressions tests & fix regressions (#36611) @mnajdova +- [Stack] Add `useFlexGap` prop (#36404) @siriwatknp + +### `@mui/base@5.0.0-alpha.122` + +- [Autocomplete] Update `autoSelect` prop description (#36280) @sai6855 +- [TablePagination][base] Improve `actions` type in `slotProps` (#36458) @sai6855 +- [Base] Add JSDoc comments for classes of Base components (#36586) @hbjORbj +- [useSlider][base] Add API docs for the hook parameters and return type (#36576) @varunmulay22 + +### `@mui/joy@5.0.0-alpha.73` + +- [Joy] Miscellaneous fixes (#36628) @siriwatknp +- [Joy] Add palette customizer (#35741) @siriwatknp + +### Docs + +- Revert "[docs] Use `theme.applyDarkStyles` for the rest of the docs" (#36602) @mnajdova +- [blog] Improvements on v6 announcement blog (#36505) @joserodolfofreitas +- [docs] Add `Snackbar` coming soon page (#36604) @danilo-leal +- [docs] Add accordion coming soon page (#36279) @siriwatknp +- [docs] Fix palette customizer theme augmentation (#36629) @siriwatknp +- [docs] Finish migration away from https://reactjs.org/ @oliviertassinari +- [docs] Remove duplicated slot descriptions (#36621) @hbjORbj +- [docs] Fix broken example link (#36607) @mnajdova +- [docs] Use `theme.applyDarkStyles` (#36606) @siriwatknp +- [docs] Improve API for theme default prop (#36490) @oliviertassinari +- [docs][Table] Refactor `Sorting & Selecting` table demo (#33236) @IFaniry + +### Core + +- [core] Use Netlify function for feedback management (#36472) @alexfauquette + +All contributors of this release in alphabetical order: @alexfauquette, @danilo-leal, @hbjORbj, @IFaniry, @joserodolfofreitas, @mnajdova, @oliviertassinari, @sai6855, @siriwatknp, @varunmulay22 + +## 5.11.14 + +<!-- generated comparing v5.11.13..master --> + +_Mar 21, 2023_ + +A big thanks to the 15 contributors who made this release possible. +This release was mostly about 🐛 bug fixes and 📚 documentation improvements. + +### `@mui/material@5.11.14` + +- [Breadcrumbs] Add ability to change icon used in `BreadcrumbCollapsed` through slots (#33812) @pratikkarad +- [Stepper] Add aria-current to active StepButton (#36526) @michalak111 +- [TabScrollButton] Add ability to change left and right icons (#33863) @pratikkarad +- [ListItemButton] Respect LinkComponent (#34159) @zaverden +- [l10n] Add Central Kurdish (ku-CKB) locale (#36592) @HediMuhamad + +### `@mui/system@5.11.14` + +- [system] Fix sx prop regression for fontWeight values (#36543) @mnajdova + +### `@mui/base@5.0.0-alpha.121` + +- [docs][base] Improve the Slots Table in API docs (#36330) @hbjORbj + +### `@mui/joy@5.0.0-alpha.72` + +- [Joy] Ensure new CSS variable naming is everywhere (#36460) @hbjORbj +- [Menu][joy] Classname listbox is missing (#36520) @hbjORbj +- [Joy] Fix `--List-decorator*` vars (#36595) @siriwatknp + +### `@mui/lab@5.0.0-alpha.124` + +- [Masonry] Include Masonry in theme augmentation interface (#36533) @hbjORbj + +### Docs + +- [blog] Post blog about Chamonix retreat to the website (#36517) @mikailaread +- [blog] Fix image layout shift (#36522) @oliviertassinari +- [docs] Use `theme.applyDarkStyles` for the rest of the docs (#36161) @siriwatknp +- [docs] Fix 301 and 404 links (#36555) @oliviertassinari +- [docs] Keep slot code order in API docs (#36499) @oliviertassinari +- [docs] Missing className on Migrating from JSS example (#36536) @gabrielnafuzi +- [docs] Fix function name for Joy templates (#36512) @hbjORbj +- [docs] Add multiline Chip example (#36437) @dav1app +- [docs] Add a new gold sponsor (#36518) @hbjORbj +- [docs][joy] Improve the Slots Table in API docs (#36328) @hbjORbj +- [docs] Fix virtualElement demo for Popper (#36320) @sai6855 +- [docs] Fix typo in API docs (#36388) @RomanHotsiy +- [docs] Ensure classname displayed under Slots section in API docs exists (#36539) @hbjORbj +- [docs][joy] Build TS versions for Modal component demos (#36385) @varunmulay22 +- [docs][joy] Build TS versions for Menu component demos (#36383) @varunmulay22 +- [docs][joy] Build TS versions for Switch component demos (#36379) @varunmulay22 +- [docs] Remove `shouldSkipGeneratingVar` usage (#36581) @siriwatknp +- [docs][material] Update Table's demo to show pointer cursor on clickable rows (#36546) @varunmulay22 +- [website] Designer role changes (#36528) @danilo-leal +- [website] Open Head of Operations role (#36501) @oliviertassinari +- [website] Limit sponsors description to two rows @oliviertassinari + +### Core + +- [core] Fix CI @oliviertassinari +- [core] Fix blank line @oliviertassinari +- [website] Simplify internal ops @oliviertassinari + +All contributors of this release in alphabetical order: @danilo-leal, @dav1app, @gabrielnafuzi, @hbjORbj, @HediMuhamad, @michalak111, @mikailaread, @mnajdova, @oliviertassinari, @pratikkarad, @RomanHotsiy, @sai6855, @siriwatknp, @varunmulay22, @zaverden + +## 5.11.13 + +<!-- generated comparing v5.11.12..master --> + +_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-ui/getting-started/customization/#disabling-default-css-classes) of the default classes in Base UI (#35963) +- other 🐛 bug fixes and 📚 documentation improvements. + +### `@mui/material@5.11.13` + +- ​<!-- 13 -->[core] Bump Base UI's version in Material UI (#36492) @hbjORbj +- ​<!-- 17 -->[material] Export `shouldSkipGeneratingVar` from Material UI (#36489) @siriwatknp +- ​<!-- 06 -->[Typography] Apply font properties to typography inherit variant (#33621) @oyar99 + +### `@mui/base@5.0.0-alpha.121` + +- ​<!-- 16 -->[base] Disable classes generation via a context (#35963) @michaldudak +- ​<!-- 15 -->[useMenu][base] Add return interface for useMenu hook (#36376) @HeVictor +- ​<!-- 05 -->[useBadge] Add interface for the return value (#36042) @skevprog +- ​<!-- 04 -->[useMenuItem] Add explicit return type (#36359) @rayrw +- ​<!-- 03 -->[useTabs] Add explicit return type (#36047) @sai6855 + +### Docs + +- ​<!-- 14 -->[blog] Update fields behavior on date pickers blog post (#36480) @joserodolfofreitas +- ​<!-- 12 -->[docs] Info markdown not rendering in Contributing Guide README (#36487) @hbjORbj +- ​<!-- 11 -->[docs] Remove 301 redirection to MUI X lab migration @oliviertassinari +- ​<!-- 10 -->[docs] Fix a grammar error (#36486) @hbjORbj +- ​<!-- 09 -->[docs] Add blog post notification for v6 release (#36446) @joserodolfofreitas +- ​<!-- 08 -->[docs] Update link to v5 docs (#36421) @m4theushw +- ​<!-- 07 -->[docs] Fix 404 in the API page links (#36419) @oliviertassinari +- ​<!-- 08 -->[docs][joy] Error in the exemplary Codesandbox of using Material UI and Joy UI together (#36462) @hbjORbj +- ​<!-- 06 -->[examples] Refactor to have better types in the Next.js + TypeScript examples (#36355) @erikian +- ​<!-- 02 -->[website] Fix layout shift when loading /blog/mui-x-v6/ @oliviertassinari +- ​<!-- 01 -->[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 + +<!-- generated comparing v5.11.11..master --> + +_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` + +- ​<!-- 30 -->[Autocomplete] Fix list scrolls to the top when new data is added on touch devices (#36231) @SaidMarar +- ​<!-- 29 -->[Autocomplete] Add `Mui-expanded` class (#33312) @Osman-Sodefa +- ​<!-- 24 -->[Dialog] Use the `id` prop provided to the `DialogTitle` component (#36353) @Kundan28 +- ​<!-- 07 -->[Menu] Fix Menu Paper styles overriding in the theme (#36316) @Paatus + +### `@mui/lab@5.0.0-alpha.122` + +- ​<!-- 05 -->[TreeView] Fix Tree View inside shadow root crashes (#36225) @NoFr1ends + +### `@mui/system@5.11.12` + +#### Breaking changes + +- ​<!-- 26 -->[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 + <CssVarsProvider + + theme={createCssVarsProvider({ + + // other theme keys + + shouldSkipGeneratingVar: (keys) => keys[0] === 'typography' && keys[1] === 'h1' + + })} /> + ``` + + This breaking change **only** affects experimental APIs + +### `@mui/base@5.0.0-alpha.120` + +#### Breaking changes + +- ​<!-- 27 -->[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 <MultiSelectUnstyled /> + +return <SelectUnstyled multiple /> + } + ``` + +#### Changes + +- ​<!-- 34 -->[useSnackBar] Add explicit return type (#36052) @sai6855 +- ​<!-- 04 -->[useMenu] Fix `import type` syntax (#36411) @ZeeshanTamboli +- ​<!-- 03 -->[useSwitch] Add explicit return type (#36050) @sai6855 + +### `@mui/joy@5.0.0-alpha.70` + +#### Breaking changes + +- ​<!-- 09 -->[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 + -<List sx={{ py: 'var(--List-divider-gap)' }}> + +<List sx={{ py: 'var(--ListDivider-gap)' }}> + -<Switch sx={{ '--Switch-track-width': '40px' }}> + +<Switch sx={{ '--Switch-trackWidth': '40px' }}> + ``` + +#### Changes + +- ​<!-- 28 -->[Autocomplete][joy] Add disabled class to the popup indicator (#36397) @hbjORbj +- ​<!-- 08 -->[Joy] Fix broken loading button in Safari (#36298) @Kuba429 + +### Docs + +- ​<!-- 33 -->[docs][joy] Clarify when `CssVarsProvider` is required (#36410) @mnajdova +- ​<!-- 32 -->MUI X v6 release announcement (#36398) @joserodolfofreitas +- ​<!-- 23 -->[docs] Add instructions for deploying docs without a release (#36301) @cherniavskii +- ​<!-- 22 -->[docs] Fix 301 redirections on the docs @oliviertassinari +- ​<!-- 21 -->[docs] Update MUI X banner to reflect stable release (#36354) @MBilalShafi +- ​<!-- 20 -->[docs] Clarify the future plan for integrating Base UI in Material UI (#36365) @mnajdova +- ​<!-- 19 -->[docs] Improve visual look of loose lists (#36190) @oliviertassinari +- ​<!-- 18 -->[docs] Fix @mui/styles example links (#36331) @oliviertassinari +- ​<!-- 17 -->[docs][joy] Build TS versions for List component demos (#36382) @sai6855 +- ​<!-- 16 -->[docs][joy] Build TS versions for Radio component demos (#36406) @sai6855 +- ​<!-- 15 -->[docs][joy] Build TS versions for Checkbox component demos (#36381) @sai6855 +- ​<!-- 14 -->[docs][joy] Build TS versions for Select component demos (#36380) @sai6855 +- ​<!-- 13 -->[docs][joy] Build TS versions for Typography component demos (#36378) @varunmulay22 +- ​<!-- 12 -->[docs][joy] Add TypeScript demos for `Divider` (#36374) @sai6855 +- ​<!-- 11 -->[docs][joy] Build TS versions for Textarea component demos (#36371) @varunmulay22 +- ​<!-- 10 -->[docs][joy] Build TS versions for Link component demos (#36366) @hbjORbj + +### Core + +- ​<!-- 31 -->Revert "Bump rimraf to ^4.1.3" (#36420) @mnajdova +- ​<!-- 25 -->[core] Fix test utils types and external `buildApiUtils` usage issues (#36310) @LukasTy +- ​<!-- 06 -->[test] Remove duplicate `combobox` role queries in Autocomplete tests (#36394) @ZeeshanTamboli +- ​<!-- 02 -->[website] Clarify redistribution @oliviertassinari +- ​<!-- 01 -->[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 + +<!-- generated comparing v5.11.10..master --> + +_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 Base UI and Joy UI by @hbjORbj, for e.g. [SliderUnstyled API](https://mui.com/base-ui/api/slider-unstyled/#slots) +- other 🐛 bug fixes and 📚 documentation improvements. + +### `@mui/material@5.11.11` + +- ​<!-- 30 -->[Autocomplete] Adds `sx` prop to `ListboxProps` type (#36243) @sai6855 +- ​<!-- 11 -->[material] Add global CSS class for `readOnly` prop (#32822) @jrparish +- ​<!-- 10 -->[Stack][material] Use createStack from MUI System (#33795) @mnajdova +- ​<!-- 07 -->[Select] Fix incorrect selecting of first element (#36024) @michaldudak +- ​<!-- 06 -->[Slider] Miscellaneous improvements (#35941) @ZeeshanTamboli +- ​<!-- 05 -->[Slider] Remove unnecessary `data-focusvisible` attribute (#36091) @ZeeshanTamboli +- ​<!-- 04 -->[Snackbar] Replace component logic with `useSnackbar` hook (#36272) @ZeeshanTamboli +- ​<!-- 03 -->[TextField] Fix floating label position (#36246) @oliviertassinari +- ​<!-- 13 -->[TextField] Fix floating label position (#36288) @oliviertassinari + +### `@mui/base@5.0.0-alpha.119` + +#### Breaking changes + +- ​<!-- 29 -->[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 + <TablePaginationUnstyled + - classes={{ toolbar: 'toolbar-classname', menuItem: 'menuItem-classname' }} + + slotProps={{ toolbar: { className: 'toolbar-classname' }, menuItem: { className: 'menuItem-classname'}}} + /> + ``` + +- ​<!-- 28 -->[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 + +- ​<!-- 31 -->[Autocomplete] Add docs interface for the hook (#36242) @HeVictor +- ​<!-- 09 -->[MenuUnstyled] Remove extra useMemo (#36265) @ivp-dev +- ​<!-- 31 -->[base] Export all slot prop overrides interfaces (#36323) @michaldudak + +### `@mui/codemod@5.11.11` + +- ​<!-- 35 -->[base] Codemod for hook directory migration (#36295) @hbjORbj + +### `@mui/joy@5.0.0-alpha.69` + +- ​<!-- 15 -->[Joy] Able to remove default tokens from theme types (#36006) @siriwatknp +- ​<!-- 14 -->[Joy] Fix modal dialog overflow viewport (#36103) @siriwatknp +- ​<!-- 13 -->[Joy] Select popup should have max-height (#36156) @Vivek-Prajapatii +- ​<!-- 12 -->[Joy] Fix `ListDivider` to change semantic based on `List` (#36266) @siriwatknp + +### Docs + +- ​<!-- 27 -->[docs][base] List slots in API documentation (#36104) @hbjORbj +- ​<!-- 26 -->[docs] Add missing sandbox adapter deps resolving (#36291) @LukasTy +- ​<!-- 25 -->[docs] Allow to pass navigation bar banner from outside (#36299) @MBilalShafi +- ​<!-- 24 -->[docs] Fix code on the Working with Tailwind CSS guide (#36090) @mnajdova +- ​<!-- 23 -->[docs] Remove See Slots Section text from Material UI slots description (#36284) @hbjORbj +- ​<!-- 22 -->[docs] Fix emotion warning `:first-child` (#36263) @siriwatknp +- ​<!-- 21 -->[docs][joy] Improve the descriptions of props in API docs (#36307) @hbjORbj +- ​<!-- 20 -->[docs][joy] List slots in API documentation (#36271) @hbjORbj +- ​<!-- 19 -->[docs][joy] Build API documentations (#36008) @hbjORbj +- ​<!-- 18 -->[examples] Update Next.js examples to use built-in font (#36315) @Juneezee +- ​<!-- 17 -->[examples] Update curl link in `material-ui-nextjs-ts-v4-v5-migration` example README (#36321) @ZeeshanTamboli +- ​<!-- 16 -->[examples] Convert Next.js \_document class components to function components (#36109) @ossan-engineer + +### Core + +- ​<!-- 08 -->[Rating] Add a comment in Rating component to use `readOnly` state class (#36357) @ZeeshanTamboli +- ​<!-- 02 -->[website] Fix broken links to role levels (#36333) @oliviertassinari +- ​<!-- 01 -->[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 + +<!-- generated comparing v5.11.9..master --> + +_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` + +- ​<!-- 22 -->[Avatar] Fix ownerState usage with styleOverrides when fallback is used (#36228) @sai6855 +- ​<!-- 21 -->[Badge][material] Replace `BadgeUnstyled` with `useBadge` hook (#36158) @hbjORbj +- ​<!-- 03 -->[Switch] Fix DOM warning when `type` isn't `checkbox` or `radio` (#36170) @dani-mp +- ​<!-- 02 -->[TextareaAutosize] Convert code to TypeScript (#35862) @sai6855 +- ​<!-- 01 -->[useMediaQuery] Fix behavior of noSsr with React 18 (#36056) @oliviertassinari + +### `@mui/joy@5.0.0-alpha.68` + +- ​<!-- 05 -->[Joy] Add `zIndex` to theme (#36236) @siriwatknp +- ​<!-- 04 -->[Joy] Remove transition from all components (#35952) @hbjORbj + +### Docs + +- ​<!-- 20 -->[docs][base] Fix base Input demos for Safari (#36213) @mj12albert +- ​<!-- 16 -->[docs] Fix 301 links @oliviertassinari +- ​<!-- 15 -->[docs] Fix modal transition demos (#36137) @oliviertassinari +- ​<!-- 14 -->[docs] Update links to pt examples (#36237) @Aleff13 +- ​<!-- 13 -->[docs] Update custom Typography variants example (#36185) @mj12albert +- ​<!-- 12 -->[docs] Change markdown numbering syntax (#36187) @mj12albert +- ​<!-- 11 -->[docs] Fix switch alignment in `Disabled tree items` section in Tree View docs (#36217) @PunitSoniME +- ​<!-- 10 -->[docs] Standardize example names (#36112) @samuelsycamore +- ​<!-- 09 -->[docs] Fix typo @oliviertassinari +- ​<!-- 08 -->[docs] Fix markdown table alignments (#36136) @oliviertassinari +- ​<!-- 07 -->[docs] Small color tweaks to the docs search bar (#36160) @danilo-leal +- ​<!-- 06 -->[docs][joy] Update class name prefixes in the `Anatomy` section (#36210) @ZeeshanTamboli + +### Core + +- ​<!-- 19 -->[core] Migrate nprogress to emotion (#36181) @siriwatknp +- ​<!-- 18 -->[core] Enforce namespace import for ReactDOM (#36208) @mj12albert +- ​<!-- 17 -->[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 + +<!-- generated comparing v5.11.8..master --> + +_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 + +<!-- generated comparing v5.11.7..master --> + +_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` + +- ​<!-- 10 -->[FormLabel] Export `FormLabelOwnProps` from `FormLabel` to fix type error (#36057) @yoskeoka + +### `@mui/joy@5.0.0-alpha.66` + +- ​<!-- 09 -->[Joy] Miscellaneous fixes (#36073) @siriwatknp +- ​<!-- 08 -->[Joy] Add sign-in side template (#36019) @siriwatknp +- ​<!-- 07 -->[Joy] Add missing `Table` export from root (#36010) @sai6855 + +### `@mui/system@5.11.8` + +- ​<!-- 05 -->[System] Fix nested grid v2 (#35994) @siriwatknp + +### `@mui/styled-engine@5.11.8` + +- ​<!-- 06 -->[styled-engine] Create cache only if `document` is available (#36001) @m4theushw + +### Docs + +- ​<!-- 23 -->[blog] Fix dark mode support (#35969) @oliviertassinari +- ​<!-- 19 -->[docs] Add banner pointing to "Whats new" in MUI X page (#36074) @joserodolfofreitas +- ​<!-- 18 -->[docs] Revert unintended change @oliviertassinari +- ​<!-- 17 -->[docs] [Joy] Fixed a typo in `customizing theme tokens` (#36067) @badalsaibo +- ​<!-- 16 -->[docs] Improve inline preview's information (#35974) @oliviertassinari +- ​<!-- 15 -->[docs] Fix wrong v5 migration instructions (#36022) @oliviertassinari +- ​<!-- 14 -->[docs] Fix autocomplete render group key warning in the demo (#36025) @chuanyu0201 +- ​<!-- 13 -->[docs] Add hooks API pages for Base UI (#35828) @mnajdova +- ​<!-- 12 -->[docs] Fix grammar typo (#36016) @alexownejazayeri +- ​<!-- 11 -->[docs][joy] Add JSDoc for the `AutocompleteProps` type (#36039) @ArthurPedroti + +### Core + +- ​<!-- 22 -->[core] Make it easier to find who is importing specific files (#35896) @oliviertassinari +- ​<!-- 21 -->[core] Fix SEO redirections issues (#36041) @oliviertassinari +- ​<!-- 20 -->[core] Fix a typo in the comment in setup test files (#36014) @ZeeshanTamboli +- ​<!-- 04 -->[typescript] Explicitly define the component return types (#36013) @michaldudak +- ​<!-- 03 -->[website] Fix layout shift (#36070) @oliviertassinari +- ​<!-- 02 -->[website] Revise the Lead Designer role job ad (v1) (#36068) @oliviertassinari +- ​<!-- 01 -->[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 + +<!-- generated comparing v5.11.6..master --> + +_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` + +- ​<!-- 30 -->[Autocomplete] Prevent reset scroll position when new options are added (#35735) @sai6855 +- ​<!-- 24 -->[CssVarsProvider] Skip `unstable_sxConfig` variables (#35932) @siriwatknp +- ​<!-- 10 -->[InputLabel] Add missing `component` type (#35852) @sai6855 +- ​<!-- 05 -->[Tooltip] Fix tooltip position (#35909) @marktoman + +### `@mui/base@5.0.0-alpha.116` + +- ​<!-- 29 -->[ListboxUnstyled] Fix option state highlighted to prevent unnecessary focus (#35838) @SaidMarar + +### `@mui/joy@5.0.0-alpha.65` + +#### Breaking changes + +- ​<!-- 05 -->[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 + <Button + -sx={{ '& .JoyButton-root': { '& .JoyButton-button': {} } }} + +sx={{ '& .MuiButton-root': { '& .MuiButton-button': {} } }} + /> + ``` + + You can use this [codemod](https://github.com/mui/material-ui/blob/master/packages/mui-codemod/README.md#joy-rename-classname-prefix) to help with the migration. + +- ​<!-- 04 -->[Joy] Replace `row` prop with `orientation` prop in all Joy UI components (#35721) @hbjORbj + + - Transforms `row` prop to `orientation` prop across `Card`, `List` and `RadioGroup` components in Joy UI. + + ```diff + <Card + -row + +orientation={"horizontal"} + /> + ``` + + You can use this [codemod](https://github.com/mui/material-ui/blob/master/packages/mui-codemod/README.md#joy-rename-row-prop) to help with the migration. + +#### Changes + +- ​<!-- 26 -->[Joy][Checkbox] Display correct icon in checkbox (#35943) @sai6855 +- ​<!-- 09 -->[Joy] Add `Table` component (#35872) @siriwatknp +- ​<!-- 08 -->[Joy] Miscellaneous fixes (#35953) @siriwatknp + +### Docs + +- ​<!-- 28 -->[blog] Add RSS feed (#35777) @gorjiali +- ​<!-- 27 -->[blog] Prevent horizontal scroll on blog posts (#35948) @oliviertassinari +- ​<!-- 23 -->[docs] Add to codemod README about an added script (#35999) @hbjORbj +- ​<!-- 22 -->[docs] Add a warning about to clear the local storage when `defaultMode` changes (#35937) @ArthurPedroti +- ​<!-- 21 -->[docs] Fix Joy UI variables playground (#35950) @siriwatknp +- ​<!-- 20 -->[docs] Fix typos in base components docs (#35985) @HeVictor +- ​<!-- 19 -->[docs] Fix event's label reported to GA (#35930) @oliviertassinari +- ​<!-- 18 -->[docs] Standardize "no longer" / "not documented" callouts in Material UI docs (#35957) @samuelsycamore +- ​<!-- 17 -->[docs] Revise and expand Joy UI Checkbox doc (#35817) @samuelsycamore +- ​<!-- 16 -->[docs] Add docs notification to Date and Time Pickers revamped (#35935) @joserodolfofreitas +- ​<!-- 15 -->[docs] Update community theme builder to forked updated one (#35928) @idebeijer +- ​<!-- 14 -->[docs] Add Joy default theme viewer (#35554) @siriwatknp +- ​<!-- 13 -->[docs][joy] Fixed a typo in `Using icon libraries` page (#35989) @badalsaibo +- ​<!-- 12 -->[docs][joy] Removed Badge info from Chip docs (#35955) @Vivek-Prajapatii +- ​<!-- 11 -->[docs][system] Fix border color of Boxes in demos of `Configure the sx prop` page in dark mode (#35961) @ZeeshanTamboli + +### Core + +- ​<!-- 25 -->[core] Boolean props always have a default value of `false` in API docs (#35913) @hbjORbj +- ​<!-- 04 -->[core] Improve types for usePreviousProps (#35833) @sai6855 +- ​<!-- 03 -->[website] Fix 404 link to store (#35973) @oliviertassinari +- ​<!-- 02 -->[website] Fix 302 of diamond sponsor link @oliviertassinari +- ​<!-- 01 -->[website] Fix outdated YouTube link @oliviertassinari + +All contributors of this release in alphabetical order: @ArthurPedroti, @badalsaibo, @gorjiali, @hbjORbj, @HeVictor, @idebeijer, @joserodolfofreitas, @marktoman, @oliviertassinari, @sai6855, @SaidMarar, @samuelsycamore, @siriwatknp, @Vivek-Prajapatii, @ZeeshanTamboli + +## 5.11.6 + +<!-- generated comparing v5.11.5..master --> + +_Jan 23, 2023_ + +A big thanks to the 13 contributors who made this release possible. Here are some highlights ✨: + +- @ZeeshanTamboli improved the logic for handling the value label in the `SliderUnstyled` (#35805) +- many other 🐛 bug fixes and 📚 documentation improvements + +### `@mui/material@5.11.6` + +- ​<!-- 15 -->[Box] Fix usage of not supported features in TypeScript 3.5 (#35877) @mnajdova +- ​<!-- 14 -->[Button] Fix border color for secondary disabled button (#35866) @SaidMarar +- ​<!-- 03 -->[SwipeableDrawer] Add callback to customise touchstart ignore for swipeable drawer (#30759) @tech-meppem + +### `@mui/base@5.0.0-alpha.115` + +#### Breaking changes + +- ​<!-- 04 -->[SliderUnstyled] Improved logic for displaying the value label (#35805) @ZeeshanTamboli + + - The `valueLabelDisplay` prop is removed from `SliderUnstyled`. The prop was not working as intended in `SliderUnstyled` (See #35398). You can instead provide a `valueLabel` slot with the `slots` prop API to show the value label: + + ```diff + - <SliderUnstyled valueLabelDisplay="on" /> + + <SliderUnstyled slots={{ valueLabel: SliderValueLabel }} /> + ``` + + The following demo shows how to show a value label when it is hovered over with the thumb: https://mui.com/base-ui/react-slider/#value-label + + - The following classes are removed from `sliderUnstyledClasses` since they are not needed for the value label: + + ```diff + - valueLabel + - valueLabelOpen + - valueLabelCircle + - valueLabelLabel + ``` + + In the custom value label component, you can define your own classNames and target them with CSS. + + - The `SliderValueLabelUnstyled` component is removed from SliderUnstyled. You should provide your own custom component for the value label. + + - To avoid using `React.cloneElement` API in value label, the component hierarchy structure of the value label is changed. The value label is now inside the Thumb slot - `Thumb` -> `Input`, `ValueLabel`. + +#### Changes + +- ​<!-- 05 -->[InputUnstyled] Fix externally provided `inputRef` is ignored (#35807) @sai6855 + +### `@mui/joy@5.0.0-alpha.64` + +- ​<!-- 17 -->[Avatar][joy] Remove `imgProps` prop and add Codemod script for migration (#35859) @hbjORbj + +### Docs + +- ​<!-- 16 -->[blog] Date and time pickers revamped (#35486) @joserodolfofreitas +- ​<!-- 10 -->[docs] Fix incorrect breakpoint use (#34948) @rosita-dmello +- ​<!-- 09 -->[docs] Replace react-virtualized with react-virtuoso in Table (#35700) @petyosi +- ​<!-- 08 -->[docs] Fix account menu demo not closing with keyboard. (#35870) @mj12albert +- ​<!-- 07 -->[docs] Fix typos in the docs of Joy UI (#35876) @HeVictor +- ​<!-- 06 -->[docs] Fix wording in `Color` page (#35873) @oliv37 + +### Core + +- ​<!-- 13 -->[core] Fix release changelog to handle commits with empty author field (#35921) @mnajdova +- ​<!-- 12 -->[core] Revert `docs-utilities` migration to TypeScript and fix type (#35881) @ZeeshanTamboli +- ​<!-- 11 -->[core] Migrate internal `docs-utilities` package to TypeScript (#35846) @ZeeshanTamboli +- ​<!-- 02 -->[website] Designer don't spend their time writing code @oliviertassinari +- ​<!-- 01 -->[website] Emphasis the technical background need for this role @oliviertassinari + +All contributors of this release in alphabetical order: @HeVictor, @hbjORbj, @joserodolfofreitas, @mj12albert, @mnajdova, @oliv37, @oliviertassinari, @petyosi, @rosita-dmello, @sai6855, @SaidMarar, @tech-meppem, @ZeeshanTamboli + +## 5.11.5 + +<!-- generated comparing v5.11.4..master --> + +_Jan 17, 2023_ + +A big thanks to the 17 contributors who made this release possible. +This release was mostly about 🐛 bug fixes and 📚 documentation improvements. + +### `@mui/material@5.11.5` + +- [Material UI] Custom channel token should suppress the warning (#35804) @siriwatknp +- [Autocomplete] Fix value type when `strictNullChecks` is `false` (#35367) @fenghan34 +- [Slider] Replace `SliderUnstyled` with `useSlider` hook (#35770) @ZeeshanTamboli +- [l10n] Add Belarusian translation (#35742) @volhalink + +### `@mui/system@5.11.5` + +- [system] Improve the `createBox` types (#35532) @mnajdova + +### `@mui/codemod@5.11.5` + +- Add `joy-text-field-to-input` codemod (#35462) @hbjORbj + +### `@mui/base@5.0.0-alpha.114` + +- [base] Fix typos (#35802) @nnmax +- [Slider] Convert code to TypeScript (#35445) @sai6855 + +### `@mui/joy@5.0.0-alpha.63` + +- [Tabs][joy] Don't apply `:hover, :active` styles when `selected` (#35750) @sai6855 +- Remove `TextField` component and replace its usage in docs with `FormControl`/`FormLabel`/`Input` (#35462) @hbjORbj +- [TextField] Throw error with migration message (#35845) @siriwatknp +- Miscellaneous fixes (#35847) @siriwatknp + +### Docs + +- [docs] Improve pickers lab migration stressing `mui-x` usage (#35740) @LukasTy +- [docs] Fix incorrectly named AccessibleTable demo component (#35832) @HeVictor +- [docs] Clarify where to find docs for Base UI components in Material UI (#35799) @samuelsycamore +- [docs] Fix typos (#35814) @alexfauquette +- [docs] Revise and expand the Joy UI Card page (#35745) @samuelsycamore +- [docs] Fix navigation layout shift (#35679) @oliviertassinari +- [docs] Fix typo in the Composition page (#35774) @msoyka +- [docs][joy] Update Customization section code example to use the correct API (#35765) @pupudu +- [docs][joy] Fix grammar in `Typography` docs (#35796) @atrefonas +- [examples] Remove `next-env.d.ts` from Next.js examples (#35772) @Juneezee + +### Core + +- [website] Improve pricing page (#35767) @oliviertassinari +- [website] Add Greg in about page (#35816) @oliviertassinari +- [website] Update the Accessibility Engineer role (#35751) @oliviertassinari +- [website] Add docs for MUI for Figma @oliviertassinari + +All contributors of this release in alphabetical order: @alexfauquette, @atrefonas, @fenghan34, @hbjORbj, @HeVictor, @Juneezee, @LukasTy, @mnajdova, @msoyka, @nnmax, @oliviertassinari, @pupudu, @sai6855, @samuelsycamore, @siriwatknp, @volhalink, @ZeeshanTamboli + +## 5.11.4 + +<!-- generated comparing v5.11.3..master --> + +_Jan 9, 2023_ + +A big thanks to the 14 contributors who made this release possible. +This release was mostly about 🐛 bug fixes and 📚 documentation improvements. + +### `@mui/material@5.11.4` + +- [Autocomplete] Add index to renderOption's AutocompleteRenderOptionState (#35578) @CowDotDev +- [Autocomplete] Fix grammar in console.error in `useAutocomplete` (#35723) @hamirmahal +- [Modal] Fix can't override Backdrop Props using new Slots API (#35140) @ZeeshanTamboli +- [Select] Revert "Update `renderValue` prop's TypeScript type (#34177)" (#35733) @michaldudak +- [Tabs] Throw error only if individual `Tab` is hidden, not the whole `Tabs` (#34026) @Ryczko +- [TextField] Improve WCAG 2.4.7 with error={true} (#35687) @oliviertassinari +- [Tooltip] Remove `data-foo` attribute (#35736) @koolskateguy89 + +### `@mui/joy@5.0.0-alpha.62` + +- [Autocomplete][joy] Specify `type` attribute for popup indicator (#35648) @hbjORbj +- [Joy] Miscellaneous improvements (#35769) @siriwatknp +- [Joy] Improve `onKeyDown` event handler for demo (#35642) @hbjORbj + +### `@mui/base@5.0.0-alpha.113` + +- [Portal][base] Convert code to TypeScript (#35657) @sai6855 + +### Docs + +- [docs] Revise and expand Joy UI Button doc (#35737) @samuelsycamore +- [docs] Document the workaround for crashing a translated page (#35720) @michaldudak +- [docs] Fix API page for `MenuItem` to list all valid props (#35561) @mnajdova +- [docs] Fix ad exception in Joy UI (#35685) @oliviertassinari +- [docs] Fix content wider than screen regression @oliviertassinari +- [examples] Add `Vite.js with TypeScript` example (#35683) @miha53cevic + +### Core + +- [core] Close 2022 Developer Survey @oliviertassinari +- [core] Fix the product license reference name (#35703) @oliviertassinari +- [core] Use TypeScript AST instead of TTP for component doc building (#35379) @flaviendelangle +- [test] Always use & for nesting styles (#35702) @oliviertassinari +- [website] Improve Lead Designer role description (#35684) @oliviertassinari + +All contributors of this release in alphabetical order: @CowDotDev, @flaviendelangle, @hamirmahal, @hbjORbj, @koolskateguy89, @michaldudak, @miha53cevic, @mnajdova, @oliviertassinari, @Ryczko, @sai6855, @samuelsycamore, @siriwatknp, @ZeeshanTamboli + +## 5.11.3 + +<!-- generated comparing v5.11.2..master --> + +_Jan 2, 2023_ + +A big thanks to the 6 contributors who made this release possible. +This release was mostly about 🐛 bug fixes and 📚 documentation improvements. + +### `@mui/material@5.11.3` + +- ​<!-- 02 -->[Select] Update `renderValue` prop's TypeScript type (#34177) @ZeeshanTamboli + +### `@mui/joy@5.0.0-alpha.61` + +- ​<!-- 14 -->[Autocomplete][joy] Export component (#35647) @mbranch + +### Docs + +- ​<!-- 13 -->[blog] Fix handling of markdown links (#35628) @oliviertassinari +- ​<!-- 09 -->[docs] Fix demo code selection through copy shortcut key on Firefox browser (#35670) @ZeeshanTamboli +- ​<!-- 08 -->[docs] Fix layout shift when streaming the page (#35627) @oliviertassinari +- ​<!-- 07 -->[docs] Fix switch name to reflect the color (#35052) @rjhcnf +- ​<!-- 06 -->[docs] Fix anchor link in the card's docs and fix a typo (#35634) @ZeeshanTamboli +- ​<!-- 05 -->[docs] Fix layout shift with modal (#35591) @oliviertassinari +- ​<!-- 04 -->[Joy][docs] Add documentation for `Input` component (#35482) @hbjORbj +- ​<!-- 03 -->[docs][joy] Improved readability on theme tokens page (#35639) @badalsaibo + +### Core + +- ​<!-- 12 -->[core] Disable prefetch of footer links @oliviertassinari +- ​<!-- 11 -->[core] A few SEO fixes (#35672) @oliviertassinari +- ​<!-- 10 -->[core] Remove need for scopePathnames (#35584) @oliviertassinari +- ​<!-- 01 -->[test] Fix Algolia noisy lvl1 anchor (#35686) @oliviertassinari + +All contributors of this release in alphabetical order: @badalsaibo, @hbjORbj, @mbranch, @oliviertassinari, @rjhcnf, @ZeeshanTamboli + +## 5.11.2 + +<!-- generated comparing v5.11.1..master --> + +_Dec 26, 2022_ + +A big thanks to the 20 contributors who made this release possible. Here are some highlights ✨: + +- ⚙️ Several Base UI components were converted to TypeScript by @trizotti, @leventdeniz and @danhuynhdev (#35005, #34793, #34771) +- Many other 🐛 bug fixes abd 📚 documentation improvements. + +### `@mui/material@5.11.2` + +- ​<!-- 10 -->[l10n] Add displayed rows label to `faIR` locale (#35587) @hootan-rocky +- ​<!-- 09 -->[l10n] Add Kurdish (Kurmanji) locale (#32508) @JagarYousef +- ​<!-- 06 -->[Select] Accept non-component children (#33530) @boutahlilsoufiane +- ​<!-- 05 -->[SelectInput] Update menu to use select wrapper as anchor (#34229) @EduardoSCosta +- ​<!-- 03 -->[TableCell] Fix `scope` prop to be not set when a data cell is rendered within a table head (#35559) @sai6855 + +### `@mui/utils@5.11.2` + +- ​<!-- 02 -->[utils] `mergedeep` deeply clones source key if it's an object (#35364) @sldk-yuri + +### `@mui/base@5.0.0-alpha.112` + +- ​<!-- 16 -->[FocusTrap][base] Convert code to TypeScript (#35005) @trizotti +- ​<!-- 08 -->[Modal][base] Convert code to TypeScript (#34793) @leventdeniz +- ​<!-- 07 -->[Popper][base] Convert code to TypeScript (#34771) @danhuynhdev +- ​<!-- 04 -->[Slider] Exclude `isRtl` from Material UI's Slider props (#35564) @michaldudak + +### `@mui/joy@5.0.0-alpha.60` + +- ​<!-- 15 -->[Joy] Fix radius adjustment (#35629) @siriwatknp +- ​<!-- 14 -->[Joy] Apply color inversion to components (#34602) @siriwatknp +- ​<!-- 13 -->[Joy] Improve cursor pointer and add fallback for outlined variant (#35573) @siriwatknp +- ​<!-- 12 -->[Joy] Miscellaneous fixes (#35552) @siriwatknp +- ​<!-- 11 -->[Radio][joy] Use precise dimensions for radio icon (#35548) @hbjORbj + +### `@mui/material-next@6.0.0-alpha.68` + +- ​<!-- 36 -->[Material You] Update Button test & add active class name (#35497) @mnajdova + +### Docs + +- ​<!-- 35 -->[docs] Fix GoogleMaps demo (#35545) @hbjORbj +- ​<!-- 25 -->[docs] Remove flow, its legacy (#35624) @oliviertassinari +- ​<!-- 24 -->[docs] Add a guide on using icon libraries with Joy UI (#35377) @siriwatknp +- ​<!-- 23 -->[docs] Clarify comment about `sortStability()` use case (#35570) @frontendlane +- ​<!-- 22 -->[docs] Improve the experimental API demos on the button page (#35560) @mnajdova +- ​<!-- 21 -->[docs] Force `light` theme mode when `activePage` is null (#35575) @LukasTy +- ​<!-- 20 -->[docs] Fix ListItem button deprecated use (#33970) @MickaelAustoni +- ​<!-- 19 -->[docs] Fix typo in `Progress` docs (#35553) @jasonsturges +- ​<!-- 18 -->[docs] Remove empty tags on the TransferList demos (#33127) @ekusiadadus +- ​<!-- 17 -->[docs][joy] Add documentation for `Stack` component (#35373) @hbjORbj +- ​<!-- 35 -->[docs][joy] Add documentation for `Grid` component (#35374) @hbjORbj +- ​<!-- 01 -->[website] Update sponsor grid (#35452) @danilo-leal + +### Core + +- ​<!-- 34 -->[core] Shorthand notation to remove outline (#35623) @oliviertassinari +- ​<!-- 33 -->[core] Fix header link layout shift and clash (#35626) @oliviertassinari +- ​<!-- 32 -->[core] Hide keyboard shortcut if no hover feature (#35625) @oliviertassinari +- ​<!-- 31 -->[core] Fix confusing duplicated name in the log @oliviertassinari +- ​<!-- 30 -->[core] Fix API demos callout spacing (#35579) @oliviertassinari +- ​<!-- 29 -->[core] Fix a few title case (#35547) @oliviertassinari +- ​<!-- 28 -->[core] Cleanup mention of test-utils (#35577) @oliviertassinari +- ​<!-- 27 -->[core] Remove oudated pickers prop-type logic (#35571) @oliviertassinari +- ​<!-- 26 -->[core] Exclude documentation of Base props not used in styled libraries (#35562) @michaldudak + +All contributors of this release in alphabetical order: @boutahlilsoufiane, @danhuynhdev, @danilo-leal, @EduardoSCosta, @ekusiadadus, @frontendlane, @hbjORbj, @hootan-rocky, @JagarYousef, @jasonsturges, @leventdeniz, @LukasTy, @michaldudak, @MickaelAustoni, @mnajdova, @oliviertassinari, @sai6855, @siriwatknp, @sldk-yuri, @trizotti + +## 5.11.1 + +<!-- generated comparing v5.11.0..master --> + +_Dec 20, 2022_ + +A big thanks to the 15 contributors who made this release possible. Here are some highlights ✨: + +- 💅 @mnajdova added motion and shape design tokens to Material You package (#35384 and #35393). +- Many other 🐛 bug fixes, 📚 documentation, and ⚙️ infrastructure improvements. + +### `@mui/material@5.11.1` + +- [Chip] Fix hover and focus style with CSS Variables (#35502) @DimaAbr +- [InputLabel] Enable `size` prop overrides via TypeScript module augmentation (#35460) @MickaelAustoni +- [l10n] Change Kazakh locale name to match ISO-639-1 codes (#34664) @talgautb +- [TextField] Fix error focus style (#35167) @42tte +- [core] Bring `experimental_sx` back with error code (#35528) @siriwatknp + +### `@mui/utils@5.11.1` + +- [Theme] Merge components and slots props (#35477) @siriwatknp + +### `@mui/material-next@6.0.0-alpha.67` + +- [Material You] Add motion design tokens (#35384) @mnajdova +- [Material You] Add shape design tokens (#35393) @mnajdova + +### `@mui/joy@5.0.0-alpha.59` + +- [Tooltip] Fix arrow does not appear (#35473) @siriwatknp +- [Input] Fix autofill styles (#35056) @siriwatknp +- [ChipDelete] Add onDelete prop to ChipDelete (#35412) @sai6855 + +### `@mui/base@5.0.0-alpha.111` + +- [Button][base] Set active class when a subcomponent is clicked (#35410) @michaldudak +- [Popper][base] Fix Tooltip Anchor Element Setter (#35469) @sydneyjodon-wk + +### Docs + +- [docs] Fixed the `Select` component `onChange` event type in the migration guide (#35509) @tzynwang +- [docs] Add missing comma to `Providing the colors directly` section (#35507) @cassidoo +- [docs] Add `CardMedia` example without `component="img"` prop (#35470) @lucasmfredmark +- [docs] Fix `unstable_sxConfig` typo (#35478) @siriwatknp +- [docs] List component introduction example default code is missing ListItemContent component (#35492) @Miigaarino +- [website] Close our first people role @oliviertassinari +- [website] Update product icons (#35413) @danilo-leal + +### Core + +- [test] Terminate BrowserStack after 5 minutes (#35454) @oliviertassinari +- [test] Fix broken master branch (#35446) @oliviertassinari + +All contributors of this release in alphabetical order: @42tte, @cassidoo, @danilo-leal, @DimaAbr, @lucasmfredmark, @michaldudak, @MickaelAustoni, @Miigaarino, @mnajdova, @oliviertassinari, @sai6855, @siriwatknp, @sydneyjodon-wk, @talgautb, @tzynwang + +## 5.11.0 + +<!-- generated comparing v5.10.17..master --> + +_Dec 13, 2022_ + +A big thanks to the 19 contributors who made this release possible. Here are some highlights ✨: + +- 🔥 @mnajdova enabled configuration of the `sx` prop in the `theme` (#35150) +- Many other 🐛 bug fixes, 📚 documentation, and ⚙️ infrastructure improvements. + +### `@mui/material@5.11.0` + +- [Alert] Update icon color in all variants (#35414) @danilo-leal +- [Select] Fix `MenuProps.PopoverClasses` being overriden (#35394) @vitorfrs-dev +- [SwipeableDrawer] Fix TypeScript warning "prop open undefined" (#34710) @kraftware + +### `@mui/icons-material@5.11.0` + +- [icons] Restore the PhoneInTalk icons (#35409) @michaldudak + +### `@mui/system@5.11.0` + +#### BREAKING CHANGES + +- [system] Enable configuring the `sx` prop in the `theme` (#35150) @mnajdova + + The breaking change is regarding an experimental API: + + ```diff + -import { styled, experimental_sx } from '@mui/material/styles'; + +import { styled } from '@mui/material/styles'; + + -const Component = styled('div)(experimental_sx({ p: 1 }}); + +const Component = styled('div)(({ theme }) => theme.unstable_sx({ p: 1 }}); + ``` + +### `@mui/joy@5.0.0-alpha.58` + +- [Joy] Miscellaneous fixes (#35447) @siriwatknp + +### `@mui/base@5.0.0-alpha.110` + +- [PopperUnstyled] Update PopperTooltip to have correct width when closing with transition (#34714) @EduardoSCosta + +### `@mui/material-next@6.0.0-alpha.66` + +- [Material You] Add ripple on the button (#35299) @mnajdova + +### Docs + +- [docs] Simplify state management in Text Field demo page (#35051) @PratikDev +- [docs] Improve `Responsive App bar with Drawer` demo (#35418) @ZeeshanTamboli +- [docs] Improve line-height readability (#35387) @oliviertassinari +- [docs] Improve a bit the Composition docs (#35329) @oliviertassinari +- [docs] Refactor `ToggleButtonSizes` demo (#35375) @Armanio +- [docs] Standardize the usage of callouts in the docs (#35361) @samuelsycamore +- [docs] Format feedback to add a link to the commented section (#35381) @alexfauquette +- [docs] Direct users from Material UI to Base UI for duplicated components (#35293) @samuelsycamore +- [docs] Fix typo in FormControl API docs (#35449) @Spanishiwa +- [docs] Update callouts design (#35390) @danilo-leal +- [website] New wave of open roles (#35240) @mnajdova +- [website] Developer Survey 2022 (#35407) @joserodolfofreitas + +### Core + +- [core] Fix @mui/material package building (#35324) @timbset +- [core] Fix leaking theme color override (#35444) @oliviertassinari +- [typescript] Add null to return type of OverridableComponent (#35311) @tsollbach +- [website] Migrate X page to use CSS theme variables (#34922) @jesrodri +- [website] Migrate `/core` page to use CSS variables (#35366) @siriwatknp + +All contributors of this release in alphabetical order: @alexfauquette, @Armanio, @danilo-leal, @EduardoSCosta, @flaviendelangle, @jesrodri, @joserodolfofreitas, @kraftware, @michaldudak, @mnajdova, @oliviertassinari, @PratikDev, @samuelsycamore, @siriwatknp, @Spanishiwa, @timbset, @tsollbach, @vitorfrs-dev, @ZeeshanTamboli + +## 5.10.17 + +<!-- generated comparing v5.10.16..master --> + +_Dec 6, 2022_ + +A big thanks to the 15 contributors who made this release possible. Here are some highlights ✨: + +- ✨ @mnajdova added a [Material You Button playground](https://mui.com/material-ui/react-button/#material-you-version) (#35222) +- 🔧 @hbjORbj renamed `components` / `componentProps` to `slots` / `slotProps` prop in Joy UI to create consistency across products (#34997) +- Many other 🐛 bug fixes, 📚 documentation, and ⚙️ infrastructure improvements + +### `@mui/material@5.10.17` + +- ​<!-- 31 -->[Slider] Fix `markActive` theme class not getting applied (#35067) @ZeeshanTamboli +- ​<!-- 30 -->[SwipeableDrawer] Fix missing close animation when initial open is true (#35010) @sai6855 +- ​<!-- 28 -->[material-ui] Add channel colors if possible (#35178) @siriwatknp +- ​<!-- 10 -->[Fab] Increase disabled styles precedence (#35304) @Uzwername +- ​<!-- 05 -->[Rating] Apply `labelEmptyValueActive` style overrides from theme (#35315) @sai6855 + +### `@mui/system@5.10.17` + +- ​<!-- 04 -->[system] Add support for nested CssVarsProvider (#35277) @siriwatknp + +### `@mui/joy@5.0.0-alpha.57` + +#### BREAKING CHANGE + +- ​<!-- 08 -->[Joy] Add `slots`/`slotProps` props to the typing of all components and apply `useSlot` to all components (#34997) @hbjORbj + + - Change all occurrences of `components` and `componentsProps` props in Joy UI components to `slots` and `slotProps`, respectively. + + ```diff + -<Autocomplete components={{listbox: CustomListbox}} componentsProps={{listbox: { className: 'custom-listbox' }}} /> + +<Autocomplete slots={{listbox: CustomListbox}} slotProps={{listbox: { className: 'custom-listbox' }}} /> + ``` + + You can use this [codemod](https://github.com/mui/material-ui/blob/master/packages/mui-codemod/README.md#joy-rename-components-to-slots) to help with the migration. + +#### Changes + +- ​<!-- 07 -->[Joy] Miscellaneous fixes (#35345) @siriwatknp +- ​<!-- 06 -->[Joy][textarea] Expose decorator classes (#35247) @zignis + +### Docs + +- ​<!-- 29 -->[docs] Improve spacing with ul (#35302) @oliviertassinari +- ​<!-- 23 -->[docs] Correct grammatically incorrect sentences in CONTRIBUTING.md (#34949) @Pandey-utkarsh +- ​<!-- 22 -->[docs] Move the demo higher in the API TOC (#35202) @oliviertassinari +- ​<!-- 21 -->[docs] Fix incorrect link in minimizing-bundle-size (#35297) @Juneezee +- ​<!-- 20 -->[docs] Revise and expand Joy UI "Breadcrumbs" page (#35292) @samuelsycamore +- ​<!-- 19 -->[docs] Fix wrong import in the unstyled tabs page (#35310) @guotie +- ​<!-- 18 -->[docs] Disable translations (#34820) @mnajdova +- ​<!-- 17 -->[docs] Fix typo (#35312) @flaviendelangle +- ​<!-- 16 -->[docs] Add Material You Button playground (#35222) @mnajdova +- ​<!-- 15 -->[docs] Fix experimental API page duplication (#35213) @oliviertassinari +- ​<!-- 14 -->[docs] Improve the autogenerated "Unstyled" and "API" text (#35185) @samuelsycamore +- ​<!-- 13 -->[docs] Fix ad margin on API pages (#35201) @oliviertassinari +- ​<!-- 12 -->[docs] Revise and expand the Joy UI "Badge" page (#35199) @samuelsycamore +- ​<!-- 11 -->[docs] Update Base UI docs with latest style conventions (#35034) @samuelsycamore +- ​<!-- 09 -->[l10n] Improve Chinese (Taiwan) zh-TW locale (#35328) @happyincent +- ​<!-- 02 -->[website] Update stats: GitHub stars, Twitter followers, etc. (#35318) @nomandhoni-cs + +### Core + +- ​<!-- 27 -->[core] Use componentStyles.name over componentName (#35303) @oliviertassinari +- ​<!-- 26 -->[core] Fix warning leak in production (#35313) @oliviertassinari +- ​<!-- 25 -->[core] Move the internal packages from docs/packages (#35305) @michaldudak +- ​<!-- 24 -->[core] Clean up the API docs generation scripts (#35244) @michaldudak +- ​<!-- 03 -->[test] Scope the tests to just Material UI components (#35219) @siriwatknp +- ​<!-- 01 -->[website] Remove BlackFriday notification @oliviertassinari + +All contributors of this release in alphabetical order: @flaviendelangle, @guotie, @happyincent, @hbjORbj, @Juneezee, @michaldudak, @mnajdova, @nomandhoni-cs, @oliviertassinari, @Pandey-utkarsh, @sai6855, @samuelsycamore, @siriwatknp, @Uzwername, @zignis + +## 5.10.16 + +<!-- generated comparing v5.10.15..master --> + +_Nov 28, 2022_ + +A big thanks to the 13 contributors who made this release possible. This release contains various 🐛 bug fixes, 📚 documentation, and ⚙️ infrastructure improvements. + +### `@mui/material@5.10.16` + +- ​<!-- 21 -->[Autocomplete] Fix inferred value type when `multiple` prop is `true` (#35275) @fenghan34 +- ​<!-- 19 -->[Chip] Add `skipFocusWhenDisabled` prop to not allow focussing deletable chip if disabled (#35065) @sai6855 +- ​<!-- 18 -->[Chip] Remove unnecessary handleKeyDown event handler (#35231) @ZeeshanTamboli +- ​<!-- 05 -->[FormControl] Add missing types in `useFormControl` (#35168) @ZeeshanTamboli +- ​<!-- 04 -->[IconButton] Add missing color classes (#33820) @Zetta56 +- ​<!-- 03 -->[SwipeableDrawer] Make paper ref accessible (#35082) @sai6855 + +### `@mui/system@5.10.16` + +- ​<!-- 02 -->[system] Remove unnecessary parsed theme (#35239) @siriwatknp +- ​<!-- 01 -->[theme] Fix TypeScript type for custom variants in responsive font sizes (#35057) @ZeeshanTamboli + +### `@mui/base@5.0.0-alpha.108` + +- ​<!-- 20 -->[Base] Allow useSlotProps to receive undefined elementType (#35192) @leventdeniz + +### Docs + +- ​<!-- 13 -->[docs] Improve feedback precision (#34641) @alexfauquette +- ​<!-- 12 -->[docs] Add Black Friday notification @oliviertassinari +- ​<!-- 11 -->[docs] Fix migration feedback (#35232) @alexfauquette +- ​<!-- 10 -->[docs] Improve the useSelect demo styling (#33883) @michaldudak +- ​<!-- 09 -->[docs] Fix layout jump on first mistake (#35215) @oliviertassinari +- ​<!-- 08 -->[docs] Support demos with side effect imports (#35177) @m4theushw +- ​<!-- 07 -->[examples] Fix Next.js errors (#35246) @oliviertassinari +- ​<!-- 06 -->[examples] Updated Remix examples with the lates changes using React 18 (#35092) @58bits + +### Core + +- ​<!-- 17 -->[core] Remove unused pattern (#35165) @iamxukai +- ​<!-- 16 -->[core] Fix Base version in changelog (#35224) @siriwatknp +- ​<!-- 15 -->[core] Migrate `describeConformance` to TypeScript (#35193) @flaviendelangle +- ​<!-- 14 -->[core] Skip CI for docs and examples paths (#35225) @siriwatknp + +All contributors of this release in alphabetical order: @58bits, @alexfauquette, @fenghan34, @flaviendelangle, @iamxukai, @leventdeniz, @m4theushw, @michaldudak, @oliviertassinari, @sai6855, @siriwatknp, @ZeeshanTamboli, @Zetta56 + +## 5.10.15 + +<!-- generated comparing v5.10.14..master --> + +_Nov 21, 2022_ + +A big thanks to the 9 contributors who made this release possible. Here are some highlights ✨: + +- 🚀 @mnajdova added the button as the first component that implements [Material You](https://m3.material.io/) design (MD3) +- 🌐 @MBilalShafi added Urdu (Pakistan) localization +- Many other 🐛 bug fixes, 📚 documentation, and ⚙️ infrastructure improvements + +### `@mui/material@5.10.15` + +- [Autocomplete] Fix keyboard navigation when using custom popover (#35160) @sai6855 +- [typescript] Add `background.defaultChannel` to `CssVarsPalette` (#35174) @alexfauquette +- [l10n] Add Urdu (ur-PK) locale (#35154) @MBilalShafi + +### `@mui/icons-material@5.10.15` + +- [icons] Update the Material Design icons (#35194) @michaldudak + +### `@mui/material-next@6.0.0-alpha.63` + +- [Material You] Add theme structure & Button component (#34650) @mnajdova + +### `@mui/base@5.0.0-alpha.107` + +- [Select] Add attributes to conform with ARIA 1.2 (#35182) @michaldudak + +### Docs + +- [docs] Fix a couple documentation errors (#35217) @danilo-leal +- [docs] Change MUI -> Material UI in icons-material's readme (#35220) @michaldudak +- [docs] the pages have no <link rel=canonical so we need to tell Google to not index the staging envs @oliviertassinari +- [docs] Fix confusion in TOCs when reaching scroll bottom (#35214) @oliviertassinari +- [docs] Fix typos in section titles (#35025) @iamxukai +- [docs] Fix typo in legacy date picker migration guide @oliviertassinari +- [docs] Iterating on recent Joy UI Component page updates (#35162) @samuelsycamore +- [docs] Inform that pickers are in X repository (#35189) @alexfauquette +- [docs] Explain how the `error` prop works in the Unstyled Input (#35171) @michaldudak +- [docs] Hotfix missing styles in dark mode (#35179) @siriwatknp +- [docs] Add Joy UI theme typography page (#34811) @siriwatknp +- [docs] Fix undo/redo in live editor (#35163) @oliviertassinari +- [docs] Revise the Joy UI "Avatar" component page (#35152) @samuelsycamore +- [docs] Make navbar backdrop filter consistent with website (#35157) @danilo-leal +- [docs] Host CodeSandbox on MUI org (#35110) @oliviertassinari +- [docs] Uplift introduction demos & make consistent with Base (#34316) @danilo-leal +- [website] Add Security questionnaire in pricing (#35172) @oliviertassinari +- [website] Fix theme mode toggle state (#35216) @siriwatknp +- [website] Exclude experiment pages in production (#35180) @siriwatknp +- [website] Disable SEO for performance pages (#35173) @oliviertassinari + +### Core + +- [core] Convert icons scripts to ESM (#35101) @Janpot +- [core] Group renovate GitHub Action dependency updates @oliviertassinari +- [core] Upgrade eslint-config-airbnb-typescript (#34642) @Janpot +- [core] Ensure that prettier CI step fails when code is badly formatted (#35170) @michaldudak + +All contributors of this release in alphabetical order: @alexfauquette, @danilo-leal, @iamxukai, @Janpot, @MBilalShafi, @michaldudak, @oliviertassinari, @samuelsycamore, @siriwatknp + +## 5.10.14 + +<!-- generated comparing v5.10.13..master --> + +_Nov 14, 2022_ + +A big thanks to the 17 contributors who made this release possible. Here are some highlights ✨: + +- 🚀 @siriwatknp added the Autocomplete component to the Joy UI (#34315) +- ♿ @sfavello improved the accessibility of the Material UI's Autocomplete by adding support for the Delete key (#33822) +- Many other 🐛 bug fixes, 📚 documentation, and ⚙️ infrastructure improvements. + +### `@mui/material@5.10.14` + +- [Material UI] Add `palette.background.defaultChannel` token (#35061) @siriwatknp +- [Autocomplete] Remove tags with the Delete key (#33822) @sfavello +- [IconButton] custom color causes type error (#34521) @kushagra010 + +### `@mui/system@5.10.14` + +- [Unstable_Gridv2] sorted responsize keys based on breakpoint value (#34987) @sai6855 + +### `@mui/joy@5.0.0-alpha.54` + +- [Joy] Export `FormControl`, `LinearProgress` and `ListSubheader` components from `@mui/joy` (#35003) @Studio384 +- [Joy] Miscellaneous fixes (#35044) @siriwatknp +- [Joy] Add `Autocomplete` component (#34315) @siriwatknp +- [Joy] Saturate a bit the gray palette (#35148) @danilo-leal +- [Autocomplete][joy] Fix types (#35153) @siriwatknp + +### Docs + +- [blog] Fix font size of code blocks on iOS @oliviertassinari +- [docs] Accessibility - increase default contrastThreshold for WCAG AA compliance (#34901) @kennethbigler +- [docs] Correct the keepMounted section on the Drawer page (#35076) @michaldudak +- [docs] Fix code editor styles mismatches (#35108) @oliviertassinari +- [docs] Allows to access the next MUI-X (#34798) @alexfauquette +- [docs] Fix bugs with live edit demos (#35106) @oliviertassinari +- [docs] Fix `MarkdownElement` regression from adding CSS variables (#35096) @siriwatknp +- [docs] Add a new gold sponsor (#35089) @hbjORbj +- [docs] Fix scroll issue on expanded live demos (#35064) @bharatkashyap +- [docs] Improve alignment of the sponsors @oliviertassinari +- [docs] Improve code font family v2 (#35053) @oliviertassinari +- [docs] Upgrade to Next.js 13 (#35001) @mnajdova +- [docs] Fix typo in changelog @oliviertassinari +- [docs] Update Joy UI templates to use latest components (#35058) @siriwatknp +- [website] Fix design kits showcase throwing an error (#35093) @cherniavskii +- [website] Fix margin bug on CTA @oliviertassinari +- [website] Link respective repositories in product pages (#35046) @sidtohan +- [website] Migrate blog pages to use CSS theme variables (#34976) @siriwatknp +- [website] Update DoiT International logo and links with new brand (#35030) @ofir5300 +- [website] Improve visual design app bar (#35111) @oliviertassinari + +### Core + +- [core] Convert scripts to ES modules (#35036) @michaldudak +- [core] Show the whole version to make blame easier @oliviertassinari +- [core] Polish GitHub Action version @oliviertassinari +- [core] Ignore icons to speed up CodeQL @oliviertassinari +- [core] Feedback on branch protection @oliviertassinari +- [core] Revert CI (#35098) @siriwatknp +- [core] Fix job name to match the CI (#35097) @siriwatknp +- [core] ESLint fixes for tests (#34924) @Janpot +- [core] Ignore unrelated folders from github actions (#35028) @siriwatknp +- [core] Use pretty-quick instead of custom script (#34062) @Janpot + +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 + +## 5.10.13 + +<!-- generated comparing v5.10.12..master --> + +_Nov 7, 2022_ + +A big thanks to the 12 contributors who made this release possible. Here are some highlights ✨: + +- 🚀 The slots API has been introduced to the Material UI package by @michaldudak (#34873). +- 🔥 Live editing of demos is stabilized by @oliviertassinari (#34870). +- Many other 🐛 bug fixes, 📚 documentation, and ⚙️ infrastructure improvements. + +### `@mui/material@5.10.13` + +- ​<!-- 08 -->[material-ui] Introduce the slots API (#34873) @michaldudak +- ​<!-- 07 -->[NativeSelectInput] Support CSS theme variables (#34975) @siriwatknp + +### `@mui/system@5.10.13` + +- ​<!-- 05 -->[system] Add a missing key attribute in getInitColorScheme to fix key issue (#34992) @akshaya-venkatesh8 + +### `@mui/base@5.0.0-alpha.105` + +- ​<!-- 26 -->[base] Avoid calling setState during renders (#34916) @Janpot + +### `@mui/joy@5.0.0-alpha.53` + +- ​<!-- 06 -->[Select] Fix custom options menu not opening on Avatar click (#34648) @shivam1646 + +### Docs + +- ​<!-- 20 -->[docs] Add a guide for setting dark mode by default (#34839) @siriwatknp +- ​<!-- 19 -->[docs] Improve code font family (#35027) @oliviertassinari +- ​<!-- 18 -->[docs] Revise and expand Joy UI "Alert" page (#34838) @samuelsycamore +- ​<!-- 17 -->[docs] Live demos v2 (#34870) @oliviertassinari +- ​<!-- 16 -->[docs] Fix 301 links in the docs @oliviertassinari +- ​<!-- 15 -->[docs] Fix code display in RTL (#34951) @oliviertassinari +- ​<!-- 14 -->[docs] New API design rule disabled > disable (#34972) @oliviertassinari +- ​<!-- 13 -->[docs] Explain the usage of Select's onOpen/onClose in the uncontrolled mode (#34755) @michaldudak +- ​<!-- 12 -->[docs] Add a new gold sponsor (#34984) @hbjORbj +- ​<!-- 11 -->[docs] Add author and published_time meta tags (#34382) @alexfauquette +- ​<!-- 10 -->[examples] Next.js examples v13 - fonts (#34971) @PetroSilenius +- ​<!-- 09 -->[examples] Next.js examples v13 - links (#34970) @PetroSilenius +- ​<!-- 04 -->[website] Update IPinfo.AI name @oliviertassinari +- ​<!-- 03 -->[website] Remove date-io from the docs dependencies (#34748) @michaldudak +- ​<!-- 02 -->[website] Migrate Design-kits page to use CSS theme variables (#34920) @jesrodri +- ​<!-- 01 -->[website] Migrate Pricing page to use CSS theme variables (#34917) @trizotti + +### Core + +- ​<!-- 25 -->[core] Remove default access to GitHub action scopes @oliviertassinari +- ​<!-- 24 -->[core] Fix Pinned-Dependencies @oliviertassinari +- ​<!-- 23 -->[core] Fix typos in the component name @oliviertassinari +- ​<!-- 22 -->[core] Fix scorecard regression @oliviertassinari +- ​<!-- 21 -->[core] Create the docs theme once (#34954) @oliviertassinari + +All contributors of this release in alphabetical order: @akshaya-venkatesh8, @alexfauquette, @hbjORbj, @Janpot, @jesrodri, @michaldudak, @oliviertassinari, @PetroSilenius, @samuelsycamore, @shivam1646, @siriwatknp, @trizotti + +## 5.10.12 + +<!-- generated comparing v5.10.11..master --> + +_Oct 31, 2022_ + +A big thanks to the 16 contributors who made this release possible. Here are some highlights ✨: + +- 🚀 The LinearProgress component has been added to Joy UI by @hbjORbj (#34514). +- Many other 🐛 bug fixes, 📚 documentation, and ⚙️ infrastructure improvements. + +### `@mui/material@5.10.12` + +- ​<!-- 37 -->[Chip] Don't override icon color (#34247) @emlai +- ​<!-- 09 -->[Radio] Skip default hover style when disableRipple is set (#34902) @VinceCYLiao +- ​<!-- 08 -->[SwipeableDrawer] Fix React 18 issues (#34505) @mnajdova +- ​<!-- 05 -->[Tooltip] Save a few bytes (#34853) @oliviertassinari + +### `@mui/base@5.0.0-alpha.104` + +- ​<!-- 38 -->[ButtonUnstyled] Update to render as link when href or to is provided (#34337) @EduardoSCosta + +### `@mui/joy@5.0.0-alpha.52` + +- ​<!-- 36 -->[Joy][circularprogress] Prevent new styles from being generated when `value` changes (#34897) @hbjORbj +- ​<!-- 11 -->[Joy] Add color inversion feature (#32511) @siriwatknp +- ​<!-- 10 -->[Joy] Add `LinearProgress` component (#34514) @hbjORbj + +### Docs + +- ​<!-- 40 -->[blog] Add blog post for high-level overview of all MUI products (#34325) @samuelsycamore +- ​<!-- 39 -->[blog] Fix hydration mistmatch (#34857) @oliviertassinari +- ​<!-- 21 -->[docs] Revise the Joy UI "Aspect Ratio" page (#34858) @samuelsycamore +- ​<!-- 20 -->[docs] Fix Safari code font size (#34859) @oliviertassinari +- ​<!-- 19 -->[docs] Fix spelling mistake (#34955) @punithnayak +- ​<!-- 18 -->[docs] Fix 404 link of supported Material UI components @oliviertassinari +- ​<!-- 17 -->[docs] Fix Safari button misalignment (#34861) @oliviertassinari +- ​<!-- 16 -->[docs] Fix typo in docs title (#34926) @PunitSoniME +- ​<!-- 25 -->[docs] Fix missing emotion prefixes (#34958) @oliviertassinari +- ​<!-- 26 -->[docs] Improve UI display for copy code (#34950) @oliviertassinari +- ​<!-- 15 -->[docs] Standardize all "Usage" pages (#34183) @samuelsycamore +- ​<!-- 14 -->[docs] Update templates' readme files to include required dependencies (#34757) @michaldudak +- ​<!-- 13 -->[docs] Fix inconsistent theme colors when applying custom colors in playground (#34866) @cherniavskii +- ​<!-- 12 -->[docs] Fix typo in bottom-navigation.md (#34884) @RoodyCode +- ​<!-- 07 -->[website] Migrate about-us page to use CSS theme variables (#34919) @brianlu2610 +- ​<!-- 06 -->[website] Migrate Product-Templates page to use CSS theme variables (#34913) @EduardoSCosta +- ​<!-- 05 -->[website] Migrate career page to use CSS theme variables (#34908) @the-mgi +- ​<!-- 04 -->[website] Update MUI X open and future roles + about page (#34894) @DanailH +- ​<!-- 03 -->[website] Remove one DOM node (#34960) @oliviertassinari +- ​<!-- 02 -->[website] Use `span` for icon image (#34914) @siriwatknp +- ​<!-- 01 -->[website] Fix subscribe input with Safari (#34869) @oliviertassinari + +### Core + +- ​<!-- 35 -->[core] Ignore compiled icons in CodeQL @oliviertassinari +- ​<!-- 34 -->[core] Add OSSF Scorecard action (#34854) @oliviertassinari +- ​<!-- 40 -->[core] Fix extra GitHub Action permission (#34496) @sashashura +- ​<!-- 33 -->[core] Fix duplicate id @oliviertassinari +- ​<!-- 41 -->[core] Enforce import \* as React (#34878) @da0x +- ​<!-- 32 -->[core] A couple of simply fixes from #34870 (#34953) @oliviertassinari +- ​<!-- 31 -->[core] Migrate outdated pattern to convention @oliviertassinari +- ​<!-- 30 -->[core] Pin GitHub Actions dependencies (#34929) @renovate[bot] +- ​<!-- 29 -->[core] Make the reproduction more important in the bug template (#34875) @oliviertassinari +- ​<!-- 28 -->[core] Fix docs GitHub API rate limit (#34856) @oliviertassinari +- ​<!-- 42 -->[core] Fix eslint issues (#34964) @mnajdova +- ​<!-- 27 -->[core] Pin GitHub Action to digests (#34855) @oliviertassinari +- ​<!-- 26 -->[core] Fix permissions in workflow @oliviertassinari +- ​<!-- 25 -->[core] memoize context values for react/jsx-no-constructed-context-values (#34849) @Janpot +- ​<!-- 24 -->[core] Fix @typescript-eslint/default-param-last issues (#34846) @Janpot +- ​<!-- 23 -->[core] Fix HTML validation error (#34860) @oliviertassinari +- ​<!-- 22 -->[core] Fix duplicate CodeQL build @oliviertassinari +- ​<!-- 07 -->[test] Move Firefox tests to CircleCI (#34764) @oliviertassinari +- ​<!-- 06 -->[test] Use screen when possible for simplicity (#34890) @oliviertassinari + +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 + +## 5.10.11 + +<!-- generated comparing v5.10.10..master --> + +_Oct 25, 2022_ + +A big thanks to the 10 contributors who made this release possible. Here are some highlights ✨: + +- 🔧 Moved `components` to `slots` prop starting at Base UI to create consistency across products +- Many other 🐛 bug fixes, 📚 documentation, and ⚙️ infrastructure improvements + +### `@mui/material@5.10.11` + +- [InputBase] Fix `onInvalid` to use HTMLInputElement | HTMLTextAreaElement Element type (#33162) @KuSh +- [Alert] Add `components` and `componentsProps` props to allow close action overrides (#33582) @jake-collibra + +### `@mui/base@5.0.0-alpha.103` + +#### BREAKING CHANGE + +- [base] `components` -> `slots` API rename (#34693) @michaldudak + + - Change all occurrences of components and componentsProps props in Base components to slots and slotProps, respectively. + - Change casing of slots' fields to camelCase + + ```diff + -<SwitchUnstyled components={{Root: CustomRoot}} componentsProps={{rail: { className: 'custom-rail' }}} /> + +<SwitchUnstyled slots={{root: CustomRoot}} slotProps={{rail: { className: 'custom-rail' }}} /> + ``` + +- [base] Make CSS class prefixes consistent (#33411) @michaldudak + + **This is a breaking change for anyone who depends on the class names applied to Base components.** + If you use the `<component>UnstyledClasses` objects, you won't notice a difference. Only if you depend on the resulting class names (for example in CSS stylesheets), you'll have to adjust your code. + + ```diff + -.ButtonUnstyled-root { ... }; + +.MuiButton-root { ... }; + ``` + +#### Changes + +- [test] Test all Base components with describeConformanceUnstyled (#34825) @michaldudak + +### `@mui/joy@5.0.0-alpha.51` + +- [CircularProgress][joy] Fix classnames and add test (#34806) @hbjORbj +- [Joy] Allow string type for `size` prop in components (#34805) @hbjORbj + +### Docs + +- Revert "[docs] Fix search icons in other languages (#34823)" @oliviertassinari +- Revert "[core] Move SearchIcons to docs src folder (#34802)" @oliviertassinari +- Revert "[docs] Live demos (#34454)" @oliviertassinari +- Update the order of operations for pagination example so that slicing takes place after sorting. (#34189) @marceliwac +- [docs] Gatsby Description in Joy dark-mode (#34702) @pixelass +- [docs] Add notification for blogpost MUI X v6 alpha (#34809) @joserodolfofreitas +- [docs] Polish Crowdin config (#34852) @oliviertassinari +- [docs] Fix a few style standard deviations @oliviertassinari +- [docs] Enforce no trailing spaces (#34762) @oliviertassinari +- [docs] Enforce correct git diff format (#34765) @oliviertassinari +- [docs] Fix Toolpad docs 301 route (#34843) @bharatkashyap +- [docs] Replace initial value with theme white (#34822) @siriwatknp +- [docs] Remove localization redirects (#34844) @mnajdova +- [docs] Fix search icons in other languages (#34823) @siriwatknp +- [docs] Fix JavaScript capitalization @oliviertassinari +- [docs] Update new links to MD2 (#34848) @oliviertassinari +- [website] Update future work items on X landing page (#34810) @joserodolfofreitas +- [website] Add Toolpad docs to navigation (#34749) @bharatkashyap + +### Core + +- [core] Remove dead files (#34850) @oliviertassinari +- [core] Fix revert conflict @oliviertassinari +- [core] Fix a few CodeQL errors (#34766) @oliviertassinari +- [core] Harden GitHub Actions permissions (#34769) @oliviertassinari +- [core] Remove the codeowners file (#34876) @michaldudak + +All contributors of this release in alphabetical order: @bharatkashyap, @hbjORbj, @jake-collibra, @joserodolfofreitas, @KuSh, @marceliwac, @michaldudak, @oliviertassinari, @pixelass, @siriwatknp + +## 5.10.10 + +<!-- generated comparing v5.10.9..master --> + +_Oct 18, 2022_ + +A big thanks to the 21 contributors who made this release possible. Here are some highlights ✨: + +- 🖌 Thanks to the efforts of @bharatkashyap and @nihgwu, we now have editable demos across our docs (#34454)! +- 🚀 The Tooltip component has been added to Joy UI by @hbjORbj (#34509). +- ⚙️ We started converting the remaining JS components in Base UI to TypeScript. + @mbayucot finished the first PR with the conversion of the NoSsr code (#34735). +- And more 🐛 bug fixes and 📚 documentation improvements. + +### `@mui/material@5.10.10` + +- [Popover] Fix paper position flash on open (#34546) @TheUnlocked +- [SwipeableDrawer] Make component `defaultProps` overridable (#34643) @hbjORbj + +### `@mui/system@5.10.10` + +- [system] Support CSS `grey` color in `sx` (#34548) @TheUnlocked + +### `@mui/styles@5.10.10` + +- [styles] Use memoized context in StylesProvider (#34637) @mohd-akram + +### `@mui/joy@5.0.0-alpha.50` + +- [Select][joy] Added hidden input element (#34657) @zee-bit +- [Slider][joy] Add global variant to slider (#34733) @siriwatknp +- [Tooltip][joy] Add component (#34509) @hbjORbj + +### `@mui/base@5.0.0-alpha.102` + +- [MultiSelect][base] Prevent the renderValue prop from being propagated to the DOM (#34698) @michaldudak +- [NoSsr] Convert code to TypeScript (#34735) @mbayucot + +### Docs + +- [docs] Fix the Autocomplete Highlighting example (#34184) @hayawata3626 +- [docs] Fix typos in Base (Menu, Tabs) and Joy UI (Chip) (#34803) @rvrvrv +- [docs] Use new editing API in homepage demos (#34220) @m4theushw +- [docs] Live demos (#34454) @bharatkashyap +- [docs] Fix typos in Joy UI Switch (#34728) @ndresx +- [docs] Avoid scrollbar in the code demos (#34741) @oliviertassinari +- [docs] Revise the Joy UI "Automatic adjustment" page (#34614) @samuelsycamore +- [docs] Revise and rename the Joy UI "Perfect dark mode" page (#34613) @samuelsycamore +- [docs] Revise the Joy UI "Global variants" page (#34595) @samuelsycamore +- [docs] Basic link verification at PR level (#34588) @alexfauquette +- [docs] Add a missing comma in the customization example (#34617) @AbayKinayat +- [website] Clarify Pro/Premium support (#34607) @oliviertassinari +- [website] Fix home page dark mode flicker (#33545) +- [website] Update the state of the date pickers on the landing page (#34750) @joserodolfofreitas + +### Core + +- [core] Clean conditionals (#34772) @pedroprado010 +- [core] Temporary remove the authorization (#34796) @siriwatknp +- [core] Avoid slower CI run statues @oliviertassinari +- [core] Improve the playground DX (#34739) @oliviertassinari +- [core] Link Netlify in the danger comment (#34688) @oliviertassinari +- [core] Fix CI after out of sync merge @oliviertassinari +- [core] Enforce straight quote (#34686) @oliviertassinari +- [core] Add code scanning via CodeQL (#34707) @DanailH +- [core] Fix some upcoming eslint issues (#34727) @oliviertassinari +- [core] Auto-fix upcoming eslint issues (#34644) @Janpot +- [core] Move SearchIcons to docs src folder (#34802) +- [test] Enable `react/no-unstable-nested-components` (#34518) @eps1lon + +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 + +## 5.10.9 + +<!-- generated comparing v5.10.8..master --> + +_Oct 10, 2022_ + +A big thanks to the 7 contributors who made this release possible. Here are some highlights ✨: + +- 🚀 [Joy] Button loading functionality has been added by @kushagra010 (#34658) +- And more 🐛 bug fixes and 📚 documentation improvements. + +### `@mui/material@5.10.9` + +- ​<!-- 16 -->[Grid v2][system] Handle direction object prop for responsive design (#34574) @vanyaxk +- ​<!-- 03 -->[Slider] Fix unnecessary accessibility attribute in root element (#34610) @vanyaxk + +### `@mui/system@5.10.9` + +#### BREAKING CHANGE + +- ​<!-- 17 -->[system] Fix color-scheme implementation (#34639) @siriwatknp + + The `enableColorScheme` prop has been removed from `CssVarsProvider` and `getInitColorScheme` (both Material UI and Joy UI). + + Migration: + + - **Material UI**: you can enable the CSS color scheme via `<CssBaseline enableColorScheme />`. + - **Joy UI**: it is enabled automatically if you use `<CssBaseline />`, [see the docs](https://mui.com/joy-ui/react-css-baseline/). + +#### Changes + +- ​<!-- 02 -->[system] Fix typo in createCssVarsProvider (#34661) @HexM7 + +### `@mui/base@5.0.0-alpha.101` + +- ​<!-- 01 -->[FocusTrap] Restore the previously exported type from @mui/material (#34601) @michaldudak + +### `@mui/joy@5.0.0-alpha.49` + +- ​<!-- 04 -->[Joy] Add button loading functionality (#34658) @kushagra010 + +### Docs + +- ​<!-- 18 -->[docs] Revert #34541 (#34700) @michaldudak +- ​<!-- 15 -->[blog] Blog post for MUI X v6 alpha zero (#34424) @joserodolfofreitas +- ​<!-- 09 -->[docs] Improve Joy UI tutorial demo (#34653) @oliviertassinari +- ​<!-- 08 -->[docs] Explain how SelectUnstyled renders a hidden input (#34638) @michaldudak +- ​<!-- 07 -->[docs] Fix Taiwan description (#34611) @oliviertassinari +- ​<!-- 06 -->[docs] Fix codesandbox export with dayjs (#34619) @oliviertassinari +- ​<!-- 05 -->[docs] Explain the purpose of renderGroup prop (#34066) @michaldudak + +### Core + +- ​<!-- 14 -->[core] Make useForkRef variadic (#27939) @michaldudak +- ​<!-- 13 -->[core] Speedup of yarn install in the CI (#34632) @oliviertassinari +- ​<!-- 12 -->[core] Fix markdown loader on Windows (#34623) @michaldudak +- ​<!-- 11 -->[core] Update changelog for version v5.10.8 (#34593) @mnajdova +- ​<!-- 10 -->[core] Update root package.json version (#34592) @mnajdova + +All contributors of this release in alphabetical order: @HexM7, @joserodolfofreitas, @kushagra010, @michaldudak, @mnajdova, @oliviertassinari, @vanyaxk + +## 5.10.8 + +<!-- generated comparing v5.10.7..master --> + +_Oct 3, 2022_ + +A big thanks to the 18 contributors who made this release possible. Here are some highlights ✨: + +- 🚀 [SnackbarUnstyled](https://mui.com/base-ui/react-snackbar/) component & headless hook are added to Base UI (#33227) @ZeeshanTamboli +- 📚 [CSS variables documentation](https://mui.com/material-ui/experimental-api/css-theme-variables/overview/) for Material UI has been added by @siriwatknp (#33958) +- And more 🐛 bug fixes and 📚 documentation improvements. + +### `@mui/material@5.10.8` + +- ​<!-- 28 -->[Autocomplete] Skip filtering when list of options is loading (#33278) @ndebeiss +- ​<!-- 13 -->[Fab] Add `disabled` class to FAB button (#34245) @meenarama +- ​<!-- 09 -->[l10n] Add Arabic Saudi Arabia (ar-SA) locale (#33340) @rolule +- ​<!-- 08 -->[l10n] zhTW refinement (#33391) @Aporim2051 +- ​<!-- 07 -->[Popover] Add `ownerState` on the paper slot (#34445) @kabernardes +- ​<!-- 05 -->[Slider] Fixed incorrect marks displayed due to duplicate keys in range (#33526) @kskd1804 +- ​<!-- 03 -->[TextField] Fix typo in FormControlLabel declaration file (#34535) @hghmn + +### `@mui/base@5.0.0-alpha.100` + +- ​<!-- 04 -->[SnackbarUnstyled] Create component and `useSnackbar` hook (#33227) @ZeeshanTamboli + +### `@mui/joy@5.0.0-alpha.48` + +- ​<!-- 12 -->[Joy] Fix `variantPlain` classname missing in few components (#34534) @hbjORbj +- ​<!-- 11 -->[Joy] Fix input decorator color and list padding (#34586) @siriwatknp +- ​<!-- 10 -->[Joy] Miscellaneous fixes (#34492) @siriwatknp + +### Docs + +- ​<!-- 27 -->[blog] Fix 404 link in base introduction @oliviertassinari +- ​<!-- 21 -->[docs] Fix CI build (#34589) @mnajdova +- ​<!-- 20 -->[docs] Temporary remove date picker from home page (#34541) @siriwatknp +- ​<!-- 19 -->[docs] Revise and expand Joy UI "Tutorial" doc (#34569) @samuelsycamore +- ​<!-- 18 -->[docs] Fix SEO issues (#34537) @oliviertassinari +- ​<!-- 17 -->[docs] Add CSS variables documentation for Material UI (#33958) @siriwatknp +- ​<!-- 16 -->[docs] Capitalize Material Design on the Breakpoints page (#34481) @Dustin-Digitar +- ​<!-- 15 -->[docs] Able to load doc components inside markdown files (#34243) @flaviendelangle +- ​<!-- 14 -->[docs] Use mouse pointer on esc button in the search modal (#34485) @minkyngkm +- ​<!-- 02 -->[website] Fix typo in pricing FAQ @oliviertassinari +- ​<!-- 01 -->[website] Move the React Engineer role from open to next (#34494) @mnajdova + +### Core + +- ​<!-- 26 -->[core] Update root package.json version (#34592) @mnajdova +- ​<!-- 25 -->[core] Remove useless comment in fixtures (#34581) @Garz4 +- ​<!-- 24 -->[core] Fix link to CODE_OF_CONDUCT.md (#34543) @peippo +- ​<!-- 23 -->[core] Remove outdated docsearch.js dependency (#34421) @oliviertassinari +- ​<!-- 22 -->[core] Add `newFeature` to the typing of MuiPage (#34511) @flaviendelangle + +All contributors of this release in alphabetical order: @Aporim2051, @Dustin-Digitar, @flaviendelangle, @Garz4, @hbjORbj, @hghmn, @kabernardes, @kskd1804, @meenarama, @minkyngkm, @mnajdova, @ndebeiss, @oliviertassinari, @peippo, @rolule, @samuelsycamore, @siriwatknp, @ZeeshanTamboli + +## 5.10.7 + +<!-- generated comparing v5.10.6..master --> + +_Sep 26, 2022_ + +A big thanks to the 21 contributors who made this release possible. Here are some highlights ✨: + +- 🚀 [Divider](https://mui.com/joy-ui/react-divider/) component is added to Joy UI (#34403) @siriwatknp + +### `@mui/material@5.10.7` + +- [CssVarsProvider] Exclude dark mode variables from `:root` stylesheet (#34131) @siriwatknp +- [Chip] Add chip classes (#33801) @pratikkarad +- [Slider] Fix typo in the comments in the source (#34452) @HexM7 +- [SvgIcon] Fix passing an ownerState to SvgIcon changes the font size (#34429) @ZeeshanTamboli +- [Stepper] Fix optional label is not centered when `alternativeLabel` is used (#34335) @ZeeshanTamboli +- [Tooltip] Add undefined, null or false in `title` (#34289) @abhinav-22-tech +- Make @emotion/\* fully supported in all Material UI components (#34451) @garronej + +### `@mui/system@5.10.7` + +- [system] Fix parsing of hsla colors in getLuminance (#34437) @ptrfrncsmrph +- [system] Fix incorrect type of `shape.borderRadius` in theme (#34076) @ZeeshanTamboli +- [system] Replace `enableSystem` with `defaultMode` (#33960) @siriwatknp + +### `@mui/material@5.0.0-alpha.101` + +- [deps] Move @mui/types to dependencies (#34384) @Methuselah96 + +### `@mui/base@5.0.0-alpha.99` + +#### Breaking changes + +- [FocusTrap] Rename TrapFocus to FocusTrap (#34216) @kabernardes + + ```diff + -import TrapFocus from '@mui/base/TrapFocus'; + +import FocusTrap from '@mui/base/FocusTrap'; + ``` + +#### Changes + +- [MultiSelect] Require a single tap to select an item on mobile Chrome (#33932) @michaldudak + +### `@mui/joy@5.0.0-alpha.47` + +- [Checkbox] spread `value`, `required`, and `readOnly` to input (#34477) @siriwatknp +- [Chip] Fix unbinded `onClick` prop (#34455) @HexM7 +- [Divider] Add `Divider` component (#34403) @siriwatknp +- [Radio] spread `readOnly` and `required` to input (#34478) @siriwatknp + +### Docs + +- [blog] Base UI announcement typo fixed (#34409) @prakhargupta1 +- [blog] Fix typo in date-pickers v5 stable (#34386) @alexfauquette +- [blog] Update date on date pickers v5 release blog post (#34406) @joserodolfofreitas +- [docs] Update `useMenu` and `useMenuItem` hooks demo (#34166) @ZeeshanTamboli +- [docs] Update the guide for migrating to TSS (#34417) @garronej +- [docs] Fix typo in `Grid` docs (#34475) @Dustin-Digitar +- [docs] Fix typo in `Back to top` section in AppBar docs (#34479) @Dustin-Digitar +- [docs] Standardize all "Installation" pages (#34168) @samuelsycamore +- [docs] Fix Webpack file name to the standard: `webpack.config.js` (#34446) @CodingItWrong +- [docs] Fix Select `onChange` call (#34408) @siriwatknp +- [docs] Notification for pickers blog - v5 stable (#34400) @joserodolfofreitas +- [docs] Improve social sharing of docs pages (#34346) @oliviertassinari +- [docs] Refine the use of MUI vs. Material UI (#34345) @oliviertassinari +- [docs] Send feedback directly to a dedicated slack channel (#34196) @alexfauquette +- [website] Adds Bilal to about page (#34412) @MBilalShafi +- [website] Add date range picker to pricing table (#34399) @joserodolfofreitas + +### Core + +- [core] Document some types in @mui/styled-engine-sc (#34413) @mnajdova +- [core] Add yml support to prettier (#33980) @Janpot + +All contributors of this release in alphabetical order: @abhinav-22-tech, @alexfauquette, @CodingItWrong, @Dustin-Digitar, @garronej, @HexM7, @howlettt, @Janpot, @joserodolfofreitas, @kabernardes, @MBilalShafi, @Methuselah96, @michaldudak, @mnajdova, @oliviertassinari, @prakhargupta1, @pratikkarad, @ptrfrncsmrph, @samuelsycamore, @siriwatknp, @ZeeshanTamboli + +## 5.10.6 + +<!-- generated comparing v5.10.5..master --> + +_Sep 19, 2022_ + +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.10.6` + +- [TextField] Fix conflict with `Bootstrap` even when label is not defined (#34343) @ZeeshanTamboli + +### `@mui/joy@5.0.0-alpha.46` + +#### Breaking changes + +- [button][joy] Replace `start/endIcon` prop with `start/endDecorator` (#34288) @hbjORbj + + **BREAKING CHANGE**: replace `start/endIcon` with `start/endDecorator`. + + ```jsx + // before + <Button startIcon={...} endIcon={...} /> + + // after + <Button startDecorator={...} endDecorator={...} /> + ``` + +#### Changes + +- [Joy] Adjust the `Input` and `Textarea` styles (#34281) @siriwatknp +- [menu][joy] Set disablePortal default to false (#34283) @tomasz-sodzawiczny + +### `@mui/base@5.0.0-alpha.98` + +#### Breaking changes + +- [Select][base] Add event parameter to the onChange callback (#34158) @michaldudak + + The SelectUnstyled and MultiSelectUnstyled `onChange` callbacks did not have event as the first parameter, leading to inconsistency with other components and native HTML elements. + This PR adds the event parameter as the first one and moves the newly selected value to the second position. Because of this, it's a breaking change. + This also affects Select from Joy UI. + + ```jsx + // before + <SelectUnstyled onChange={(newValue) => { /* ... */ }} /> + + // after + <SelectUnstyled onChange={(event, newValue) => { /* ... */ }} /> + ``` + +### Docs + +- [blog] The Date Pickers gets a stable v5 release (#34152) @alexfauquette +- [blog] Improve image handling (#34222) @oliviertassinari +- [blog] Correct 2021 survey data interpretation (#34291) @samuelsycamore +- [docs] Remove expired AospExtended showcase @oliviertassinari +- [docs] Link the OpenSSF Best Practices card (#34331) @oliviertassinari +- [docs] Fix 301 link to external projects @oliviertassinari +- [docs] Move 12 component names to Title Case (#34188) @oliviertassinari +- [docs] Fix broken links (#34320) @alexfauquette +- [docs] Add notification for Base UI announcement post (#34295) @samuelsycamore +- [website] Fix MUI X subscribe email border style (#34330) @oliviertassinari +- [website] Improve security header @oliviertassinari + +### Core + +- [core] Lock file maintenance (#34161) @renovate[bot] +- [core] Issue template: move reproduction steps to the top (#34279) @Janpot +- [core] Create shared Next.js baseline config (#34259) @oliviertassinari +- [core] In `typescript-to-proptypes`, respect the value pass to the generic (#34311) @flaviendelangle + +All contributors of this release in alphabetical order: @alexfauquette, @flaviendelangle, @hbjORbj, @Janpot, @michaldudak, @oliviertassinari, @renovate[bot], @samuelsycamore, @siriwatknp, @tomasz-sodzawiczny, @ZeeshanTamboli + +## 5.10.5 + +<!-- generated comparing v5.10.4..master --> + +_Sep 12, 2022_ + +A big thanks to the 12 contributors who made this release possible. Here are some highlights ✨: + +- 🚀 [Blog post](https://mui.com/blog/introducing-base-ui/) for announcing the release of the Base UI package is out thanks to @michaldudak. +- 🚀 Added [`Alert`](https://mui.com/joy-ui/react-alert/), [`Modal`](https://mui.com/joy-ui/react-modal/), [`ListSubheader`](https://mui.com/joy-ui/react-list-subheader/), [`FormControl`](https://mui.com/joy-ui/react-form-control/), [`CircularProgress`](https://mui.com/joy-ui/react-circular-progress/) components to Joy UI (#33859) @hbjORbj @siriwatknp +- And more 🐛 bug fixes and 📚 documentation improvements. + +### `@mui/material@5.10.5` + +- ​<!-- 05 -->[ListItemText] Fix variant mapping in `primaryTypography` (#33880) @iamxukai +- ​<!-- 03 -->[Timeline] Add left and right aligned timeline demos in docs (#34156) @ZeeshanTamboli + +### `@mui/joy@5.0.0-alpha.45` + +- ​<!-- 20 -->[Joy UI] Add `CircularProgress` component (#33869) @hbjORbj +- ​<!-- 19 -->[Joy UI] Add `FormControl` component (#34187) @siriwatknp +- ​<!-- 18 -->[Joy UI] Add `ListSubheader` component (#34191) @siriwatknp +- ​<!-- 17 -->[Joy UI] Add `Modal` component (#34043) @siriwatknp +- ​<!-- 10 -->[Joy] Fix list value of false or 0 (zero) text is incorrectly grey (#34255) @kushagra010 +- ​<!-- 09 -->[Joy] Adjust typography decorator margin (#34257) @siriwatknp +- ​<!-- 08 -->[Joy] Miscellaneous fixes (#34193) @siriwatknp +- ​<!-- 07 -->[Radio][joy] Integrate with form control (#34277) @siriwatknp +- ​<!-- 06 -->[Joy][textarea] Pass `textarea` props from `componentsProps` (#34223) @HexM7 + +### Docs + +- ​<!-- 16 -->[blog] Introducing Base UI (#33778) @michaldudak +- ​<!-- 13 -->[docs] Fix spelling error (#34209) @ChrystianDeMatos +- ​<!-- 12 -->[docs] Improve link to the security policy (#34219) @oliviertassinari +- ​<!-- 11 -->[docs] Fix typo in Joy UI's `Usage` docs (#34200) @zillion504 +- ​<!-- 02 -->[website] Add Lukas to the about page (#34284) @LukasTy +- ​<!-- 01 -->[website] Update diamond sponsor URL (#34256) @oliviertassinari + +### Core + +- ​<!-- 04 -->[test] Replace argos-cli with @argos-ci/core (#34178) @michaldudak +- ​<!-- 15 -->[core] Create a script to generate codeowners (#34175) @michaldudak +- ​<!-- 14 -->[core] Add RFC GH issue template (#33871) @bytasv + +All contributors of this release in alphabetical order: @bytasv, @ChrystianDeMatos, @hbjORbj, @HexM7, @iamxukai, @kushagra010, @LukasTy, @michaldudak, @oliviertassinari, @siriwatknp, @ZeeshanTamboli, @zillion504 + +## 5.10.4 + +<!-- generated comparing v5.10.3..master --> + +_Sep 5, 2022_ + +A big thanks to the 11 contributors who made this release possible. Here are some highlights ✨: + +- 🚀 Added [`Alert`](https://mui.com/joy-ui/react-alert/) component to Joy UI (#33859) @hbjORbj +- Many other 🐛 bug fixes, 📚 documentation, and ⚙️ infrastructure improvements + +### `@mui/material@5.10.4` + +- ​<!-- 22 -->[Avatar] Use structured / semantic markup for avatars and avatar groups (#33994) @paulschreiber +- ​<!-- 05 -->[Steps] Use structured / semantic markup for steps and steppers (#34138) @paulschreiber + +### `@mui/joy@5.0.0-alpha.44` + +- ​<!-- 23 -->[Alert][joy] Add `Alert` component (#33859) @hbjORbj +- ​<!-- 08 -->[Joy] Make the description of `componentsProps` generic (#34140) @hbjORbj +- ​<!-- 07 -->[Joy] Add tests / classes for `Breadcrumbs` component (#33860) @hbjORbj +- ​<!-- 06 -->[Select][joy] Fix forwarding listbox `component` prop (#34172) @siriwatknp + +### `@mui/base@5.0.0-alpha.96` + +- ​<!-- 21 -->[Select][base] Fix type issues that appeared with TS 4.8 (#34132) @michaldudak + +### Docs + +- ​<!-- 15 -->[docs] Add `mui-color-input`, `mui-chips-input` and `mui-tel-input` into the related projects page (#34123) @viclafouch +- ​<!-- 14 -->[docs] Update sponsors (#34157) @hbjORbj +- ​<!-- 13 -->[docs] Move 5 component names to Title Case (#34118) @oliviertassinari +- ​<!-- 12 -->[docs] Fix the color contrast on optional API methods (#34127) @oliviertassinari +- ​<!-- 11 -->[docs] Fix crash due to using wrong variable (#34171) @siriwatknp +- ​<!-- 10 -->[docs] Fix a few Base typos (#33986) @ropereraLK +- ​<!-- 09 -->[docs] Revise Joy UI "Overview" page copy (#34087) @samuelsycamore +- ​<!-- 20 -->[blog] Fix social cards (#34160) @oliviertassinari +- ​<!-- 03 -->[website] Allow deep linking to sponsors @oliviertassinari +- ​<!-- 02 -->[website] Update job descriptions (#34134) @DanailH +- ​<!-- 01 -->[website] Link Toolpad landing page @oliviertassinari + +### Core + +- ​<!-- 19 -->[core] Move renovate config to the repository root (#34180) @oliviertassinari +- ​<!-- 18 -->[core] Reinstate react/no-unused-prop-types eslint rule (#34125) @Janpot +- ​<!-- 17 -->[core] Do not append `types` field to packages without index.d.ts (#33952) @michaldudak +- ​<!-- 16 -->[core] Sanitize input in icon synonyms update script (#33989) @michaldudak +- ​<!-- 04 -->[test] Allow to pass options to `mousePress` function (#34124) @cherniavskii + +All contributors of this release in alphabetical order: @cherniavskii, @DanailH, @hbjORbj, @Janpot, @michaldudak, @oliviertassinari, @paulschreiber, @ropereraLK, @samuelsycamore, @siriwatknp, @viclafouch + +## 5.10.3 + +<!-- generated comparing v5.10.2..master --> + +_Aug 29, 2022_ + +A big thanks to the 16 contributors who made this release possible. Here are some highlights ✨: + +- ⚡ @mnajdova implemented an alternative to OverridableComponent to achieve better dev-time performance (#32735) +- Many other 🐛 bug fixes, 📚 documentation, and ⚙️ infrastructure improvements + +### `@mui/material@5.10.3` + +- [Autocomplete][material] Fix value overflow when `disableClearable` is used (#34053) @mnajdova +- [Autocomplete] Update unstyled demo to not import Material UI (#34060) @oliviertassinari +- [Slider] Remove SliderInput export from d.ts (#34055) @pieetrus +- [TablePagination] Fix select variant not working (#33974) @ZeeshanTamboli + +### `@mui/system@5.10.3` + +- [system] Fix mode blink when open multiple sessions (#33877) @siriwatknp + +### `@mui/base@5.0.0-alpha.95` + +- [Button][base] Prevent too many ref updates (#33882) @michaldudak +- [Select][base] Fix typo in listbox blur event handler (#34120) @ZeeshanTamboli +- [FocusTrap] Improve tab test and simplify demo (#34008) @EthanStandel + +### `@mui/joy@5.0.0-alpha.43` + +- [Joy] Fix `role` proptypes (#34119) @siriwatknp +- [Joy] Refine `componentsProps` for all components (#34077) @siriwatknp +- [Radio][joy] support `componentsProps` as a function (#34022) @siriwatknp +- [Select][joy] Improve the a11y on the select field demo (#34073) @mnajdova +- [Textarea][joy] Add `Textarea` component (#33975) @siriwatknp + +### Docs + +- [blog] Add Grid v2 announcement (#33926) @siriwatknp +- [blog] Making customizable components (#33183) @alexfauquette +- [blog] Improve SEO metadata (#33954) @oliviertassinari +- [docs] Add introduction Base component demos & general uplift (#33896) @danilo-leal +- [docs] Fix Gatsby sample config in CSS variables (#34024) @bicstone +- [docs] Fix 404 link from Joy to React Router (#34115) @oliviertassinari +- [docs] Fix typo in `Select` component (#34091) @HexM7 +- [docs] Fix 301 links to tss's docs @oliviertassinari +- [docs] Fixing Joy UI usage snippet (#34049) @JonathanAsbury-SPS +- [docs] Fix missing JSX closing tag in Tooltip docs (#34064) @hoangph271 +- [website] Add Toolpad to Navigation (#33937) @bharatkashyap +- [website] Improve SEO meta description for MUI X @oliviertassinari +- [website] Improve visual look of code demos (#34070) @oliviertassinari +- [website] Fix `DatePicker` component demo on the home page (#34054) @NaveenPantra + +### Core + +- [core] Offer alternative to `OverridableComponent` via module augmentation for better performance (#32735) @mnajdova +- [core] Fix prop-type warning in regression tests (#34086) @oliviertassinari +- [core] Specify code owners (#33995) @michaldudak +- [core] Fix scroll restoration (#34037) @oliviertassinari + +All contributors of this release in alphabetical order: @alexfauquette, @bharatkashyap, @bicstone, @danilo-leal, @EthanStandel, @HexM7, @hoangph271, @JonathanAsbury-SPS, @michaldudak, @mnajdova, @NaveenPantra, @oliviertassinari, @pieetrus, @renovate[bot], @siriwatknp, @ZeeshanTamboli + +## 5.10.2 + +<!-- generated comparing v5.10.1..master --> + +_Aug 22, 2022_ + +A big thanks to the 11 contributors who made this release possible. Here are some highlights ✨: + +- ✨ @michaldudak synced the Material Icons set with the latest from Google (#33988).\ + A couple of icons changed their appearance. See the difference [on this Argos build](https://app.argos-ci.com/mui/material-ui/builds/4428]). + +### `@mui/material@5.10.2` + +- ​<!-- 16 -->[Autocomplete] Fix `keepMounted` Popper prop not working (#33957) @ZeeshanTamboli +- ​<!-- 10 -->[IconButton] Fix hover effect when CSS Variables are enabled (#33971) @TheUnlocked +- ​<!-- 07 -->[LoadingButton] Add support for CSS variables (#34001) @ZeeshanTamboli +- ​<!-- 05 -->[TimelineConnector] Add support for CSS variables (#34002) @ZeeshanTamboli +- ​<!-- 04 -->[TimelineDot] Add support for CSS variables (#34003) @ZeeshanTamboli +- ​<!-- 03 -->[TreeItem] Add support for CSS variables (#34004) @ZeeshanTamboli + +### `@mui/system@5.10.2` + +- ​<!-- 06 -->[system] catch localStorage errors (#34027) @jsakas + +### `@mui/joy@5.0.0-alpha.42` + +- ​<!-- 08 -->[Joy] Add missing global exports (#33982) @tomasz-sodzawiczny + +### `@mui/icons-material@5.8.5` + +- ​<!-- 09 -->[icons] Sync the Material Icons (#33988) @michaldudak + +### Docs + +- ​<!-- 21 -->[docs] Fix typo in using-joy-ui-and-material-ui.md (#33997) @djohalo2 @danilo-leal +- ​<!-- 20 -->[docs] Fix typo in the Transition docs (#34040) @alirezahekmati +- ​<!-- 19 -->[docs] Typo fix in Joy UI Aspect Ratio doc (#33984) @AjeetSingh2016 +- ​<!-- 15 -->[docs] Fix broken Joy UI codesandbox export (#34007) @oliviertassinari +- ​<!-- 14 -->[docs] Fix typos in `test` folder's README (#33976) @ropereraLK +- ​<!-- 13 -->[docs] Fix interior section links in Base docs that feature hooks (#33948) @samuelsycamore +- ​<!-- 12 -->[docs] Fix typo in Joy UI's List Component docs (#33956) @Cerebro92 +- ​<!-- 11 -->[docs] Fix typo in Joy UI's docs (#33938) @AjeetSingh2016 + +### Core + +- ​<!-- 18 -->[website] Optimize meta description length (#34006) @oliviertassinari +- ​<!-- 17 -->Revert "[core] Replace `getInitialProps` with `getStaticProps`" (#33991) @mnajdova +- ​<!-- 02 -->[website] Move the React Engineer - X to next roles (#34030) @mnajdova +- ​<!-- 01 -->[website] Add Icons8 gold sponsor (#33978) @michaldudak + +All contributors of this release in alphabetical order: @AjeetSingh2016, @alirezahekmati, @Cerebro92, @danilo-leal, @djohalo2, @jsakas, @michaldudak, @mnajdova, @oliviertassinari, @ropereraLK, @samuelsycamore, @TheUnlocked, @tomasz-sodzawiczny, @ZeeshanTamboli + +## 5.10.1 + +<!-- generated comparing v5.10.0..master --> + +_Aug 15, 2022_ + +A big thanks to the 18 contributors who made this release possible. This release was mostly around 🐛 bug fixes and 📚 documentation improvements. + +### `@mui/material@5.10.1` + +- ​<!-- 04 -->[TableCell] Enable variant overrides via TypeScript module augmentation (#33856) @arjunvijayanathakurup + +### `@mui/system@5.10.1` + +- ​<!-- 05 -->[system] Fix `ContainerProps` export (#33923) @bugzpodder + +### `@mui/base@5.0.0-alpha.93` + +- ​<!-- 31 -->[FocusTrap] Removes invisible tabbable elements from (#33543) @EthanStandel +- ​<!-- 30 -->[Input][base] Pass the rows prop to the underlying textarea (#33873) @michaldudak +- ​<!-- 06 -->[SelectUnstyled] Add ability to post the select's value when submitting a form (#33697) @michaldudak + +### `@mui/joy@5.0.0-alpha.41` + +- ​<!-- 07 -->[IconButton][joy] Fix large IconButton scaling (#33885) @cherewaty + +### Docs + +- ​<!-- 23 -->[docs] Expand on a11y section for Material UI `Link` component (#32839) @TKrishnasamy +- ​<!-- 22 -->[docs] Fix typo in Joy UI's `AspectRatio` docs (#33895) @IsaacInsoll +- ​<!-- 21 -->[docs] Improve the Base Usage page (#33272) @samuelsycamore +- ​<!-- 20 -->[docs] Avoid refreshing the page when button on demo is clicked (#33852) @PunitSoniME +- ​<!-- 19 -->[docs] Improve the HorizontalNonLinearStepper demo styling (#33886) @hayawata3626 +- ​<!-- 18 -->[docs] Remove dead NoSsr in the demos (#33910) @oliviertassinari +- ​<!-- 17 -->[docs] Fix the reopening menu problem in MenuUnstyled demo (#33890) @michaldudak +- ​<!-- 24 -->[docs] Fix a few link issues (#33909) @oliviertassinari +- ​<!-- 16 -->[docs] Explain the icons package dependencies (#33592) @michaldudak +- ​<!-- 15 -->[docs] Fix reported SEO issues (#33818) @oliviertassinari +- ​<!-- 14 -->[docs] Add permanent notifications back (#33843) @oliviertassinari +- ​<!-- 13 -->[docs] Enforce description for all pages (#33698) @oliviertassinari +- ​<!-- 12 -->[docs] Clarify difference in startup times between named and default imports (#33109) @cmdcolin +- ​<!-- 11 -->[docs] Update transform function in the sx prop sizing docs (#33850) @ZeeshanTamboli +- ​<!-- 10 -->[docs] Adding missing accessibility labels (#33782) @PunitSoniME +- ​<!-- 09 -->[docs] Fix `/system/getting-started/advanced/` does not exist (#33867) @MonstraG +- ​<!-- 32 -->[docs] New Crowdin updates (#32213) @l10nbot +- ​<!-- 08 -->[examples] Fix broken path to favicon.ico (#33906) @mmostafavi +- ​<!-- 02 -->[website] Add new FAQ to pricing page (#33553) @oliviertassinari +- ​<!-- 03 -->[website] Miscellaneous improvements to the marketing pages (#33897) @danilo-leal + +### Core + +- ​<!-- 29 -->[core] Add the download tracker package (#33899) @michaldudak +- ​<!-- 28 -->[core] Use proper external build id for Argos uploads (#33929) @cherniavskii +- ​<!-- 27 -->[core] Enforce 70 as the max width on the title on the docs (#33819) @oliviertassinari +- ​<!-- 26 -->[core] Clear yarn installation warning (#33776) @michaldudak +- ​<!-- 25 -->[core] Bump yarn to 1.22.19 (#33656) @michaldudak +- ​<!-- 24 -->[core] Remove outdated Next.js options (#33845) @oliviertassinari +- ​<!-- 34 -->[core] Add the download tracker build script (#33941) @michaldudak +- ​<!-- 01 -->[website] Allow /r/store- redirection pattern @oliviertassinari + +All contributors of this release in alphabetical order: @arjunvijayanathakurup, @bugzpodder, @cherewaty, @cherniavskii, @cmdcolin, @danilo-leal, @EthanStandel, @hayawata3626, @IsaacInsoll, @l10nbot, @michaldudak, @mmostafavi, @MonstraG, @oliviertassinari, @PunitSoniME, @samuelsycamore, @TKrishnasamy, @ZeeshanTamboli + +## 5.10.0 + +<!-- generated comparing v5.9.3..master --> + +_Aug 8, 2022_ + +A big thanks to the 16 contributors who made this release possible. Here are some highlights ✨: + +- ✨ [Stack](https://mui.com/system/react-stack/) component is added to MUI System and Joy UI #33760 #33800 @mnajdova +- ✨ [Breadcrumbs](https://mui.com/joy-ui/react-breadcrumbs/) component is added to Joy UI (#32697) @hbjORbj +- Many other 🐛 bug fixes, 📚 documentation, and ⚙️ infrastructure improvements + +### `@mui/material@5.10.0` + +- [Grid] Prevent crash if spacing is set to zero in theme (#33777) @PunitSoniME +- [Grid] Export interface `RegularBreakpoints` to fix type error (#33751) @ZeeshanTamboli +- [Skeleton] Add `rounded` variant (#33687) @siriwatknp +- [Stepper] Fix classes for icon container (#33734) @pratikkarad +- [TableCell] Enable size prop overrides via module augmentation (#33816) @brentertz +- [Tooltip] Fix tooltip arrow css var background (#33753) @TimoWilhelm +- [useScrollTrigger] Add passive flag to scroll trigger event listener #32437 (#33749) @Dsalazar1685 + +### `@mui/system@5.10.0` + +- Fix unnecessary styles created from `sx` (#33752) @siriwatknp +- Fix duplicated styles in Box (#33774) @iamxukai +- Don't spread props to DOM for string tags (#33761) @siriwatknp +- Add `Stack` component (#33760) @mnajdova + +### `@mui/joy@5.0.0-alpha.40` + +- [Stack] Add new component (#33800) @mnajdova +- [Breadcrumbs] Add `Breadcrumbs` component (#32697) @hbjORbj +- [Card] Fix wrong api description for `size` prop (#33862) @hbjORbj +- Miscellaneous fixes (#33796, #33750) @siriwatknp + +### Docs + +- [docs] Create, revise, and expand System "Getting started" docs (#33503) @samuelsycamore +- [docs] Test new image best practice @oliviertassinari +- [docs] Fix typo in the ClickAwayListerner name (#33813) @pawelsmigielski +- [docs] Fix link to `Basics` section in `Trap Focus` docs (#33772) @ZeeshanTamboli +- [docs] z-index added in popper when used by split button (#33763) @PunitSoniME +- [docs] Improve the guide for using @mui/base with Tailwind CSS (#33670) @mnajdova +- [docs] Fix warnings related to Next.js' links (#33693) @mnajdova +- [docs] Add notification to aggregation blogpost (#33745) @joserodolfofreitas +- [docs] Add Grid version 2 docs (#33554) @siriwatknp +- [examples] Fix `NextLinkComposedProps` type error (#33842) @adham618 + +### Core + +- [blog] Add social card to Tenerife retreat post (#33764) +- [blog] Fix blue outline bug (#33707) @oliviertassinari +- [blog] Improve the width of the layout (#33706) @oliviertassinari@samuelsycamore +- [core] Remove unnecessary packageName attribute from pages (#33488) @cherniavskii +- [core] Remove duplicated CODE_OF_CONDUCT (#33702) @oliviertassinari +- [core] Update Playwright packages together (#33737) @michaldudak +- [website] Fix notifications not being marked as read in production (#33756) @cherniavskii + +All contributors of this release in alphabetical order: @adham618, @brentertz, @cherniavskii, @Dsalazar1685, @hbjORbj, @iamxukai, @joserodolfofreitas, @michaldudak, @mnajdova, @oliviertassinari, @pawelsmigielski, @pratikkarad, @PunitSoniME, @siriwatknp, @TimoWilhelm, @ZeeshanTamboli + +## 5.9.3 + +<!-- generated comparing v5.9.2..master --> + +_Aug 1, 2022_ + +A big thanks to the 15 contributors who made this release possible. Here are some highlights ✨: + +- 🖼️ @garronej worked on improving the support of Emotion packages in MUI System (#33205) +- Many other 🐛 bug fixes, 📚 documentation, and ⚙️ infrastructure improvements + +### `@mui/material@5.9.3` + +- [Chip] Assign classnames and associated styles for `filled` variant (#33587) @hbjORbj +- [Grid] Fix `columnSpacing` and `rowSpacing` props ignore higher breakpoints with 0 (#33480) @ZeeshanTamboli +- [Input] Add the readOnly state class (#33654) @michaldudak +- [Stack] Responsive styles based on breakpoints should be in the correct order (#33552) @hbjORbj + +### `@mui/system@5.9.3` + +- [system] Make @emotion/\* fully supported in MUI System (#33205) @garronej + +### `@mui/codemod@5.9.3` + +- [codemod] Fix theme-spacing performance (#33691) @siriwatknp +- [codemod] Support @mui import for variant-prop (#33692) @siriwatknp + +### `@mui/styled-engine-sc@5.9.3` + +- [styled-engine-sc] Add missing @babel/runtime dependency (#33741) @MonstraG + +### `@mui/joy@5.0.0-alpha.38` + +- [Joy] Add Tabs components (#33664) @siriwatknp +- [Joy] Miscellaneous fixes (#33685) @siriwatknp +- [Joy] Update read.me content (#33643) @danilo-leal + +### Docs + +- [blog] Add blog post about company retreat in Tenerife 🏝 (#33566) @samuelsycamore +- [blog] Add blog post to announce the aggregation feature (#33595) @joserodolfofreitas +- [blog] Fix horizontal scrollbar with code snippets (#33648) @joserodolfofreitas +- [docs] Fix a typo in the code in `Sorting & selecting` Table demo (#33674) @mracette +- [docs] Fix en-US format in the Skeleton demo (#33699) @husseinsaad98 +- [docs] Update module reference for `usePagination` (#33675) @fullstackzach +- [docs] Fix code examples in `styled` API vs `sx` prop docs (#33665) @ZeeshanTamboli +- [docs][system] Throw an informative error when `theme.vars` is used in `createTheme` and mention this in the theming docs (#33619) @hbjORbj +- [website] Remove legacy redirect @oliviertassinari +- [website] Add new legal pages (#33650) @oliviertassinari +- [website] Clarify when a license in development is required (#33668) @oliviertassinari +- [website] Update links to rows pages (#33739) @cherniavskii +- [website] Update pricing table to add aggregation and row pinning (#33659) @joserodolfofreitas + +### Core + +- [core] Replace `getInitialProps` with `getStaticProps` (#33684) @mnajdova +- [core] Remove accidentally added files (#33636) @michaldudak +- [core] Update packages with security issues (#33679) @michaldudak +- [core] Add React 17 nightly build (#33594) @mnajdova +- [core] Update lerna to 5.2.0 (#33635) @michaldudak +- [core] Prepare isolation of Next.js X app (#33649) @oliviertassinari +- [core] Remove thenify version override from package.json resolutions (#33638) @michaldudak +- [core] Update Node.js to 14 on CircleCI, CodeSandbox, and Netlify (#33642) @michaldudak +- [test] Replace istanbul-instrumenter-loader with babel-plugin-istanbul (#33666) @michaldudak +- [test] Run TypeScript module augmentation tests for Joy UI in CI (#33667) @ZeeshanTamboli + +All contributors of this release in alphabetical order: @cherniavskii, @danilo-leal, @fullstackzach, @garronej, @hbjORbj, @husseinsaad98, @joserodolfofreitas, @michaldudak, @mnajdova, @MonstraG, @mracette, @oliviertassinari, @samuelsycamore, @siriwatknp, @ZeeshanTamboli + +## 5.9.2 + +<!-- generated comparing v5.9.1..master --> + +_Jul 25, 2022_ + +A big thanks to the 16 contributors who made this release possible. Here are some highlights ✨: + +- 🧪 Ensure all Base components are `OverridableComponent` (#33506) @michaldudak +- 🧪 Various improvements on the Material `Stack` component (#33548, #33588, #33549) @hbjORbj +- Many other 🐛 bug fixes and 📚 documentation improvements + +### `@mui/material@5.9.2` + +- ​<!-- 34 -->Revert "[Tooltip] Fix children mouse over detection (#32321)" @oliviertassinari +- ​<!-- 19 -->[FormHelperText] Fix unable to create new variants (#33589) @DinhBaoTran +- ​<!-- 18 -->[ImageList] Remove vertical spacing between items in masonry layout (#33593) @michaldudak +- ​<!-- 13 -->[LoadingButton] Refactor duplicate code (#33570) @ZeeshanTamboli +- ​<!-- 12 -->[Modal] Explain the meaning of deprecation of the BackdropComponent prop (#33591) @michaldudak +- ​<!-- 11 -->[Stack] Fix unit test failure (#33588) @hbjORbj +- ​<!-- 10 -->[Stack] Fix default `flexDirection` value with responsive prop (#33549) @hbjORbj +- ​<!-- 09 -->[Stack] Ensure that `marginundefined` doesn't occur in styling (#33548) @hbjORbj +- ​<!-- 08 -->[Tabs] Fix `indicatorColor` prop type (#33569) @ZeeshanTamboli +- ​<!-- 07 -->[Tabs] Add TypeScript interface to augment tab indicator color in theme (#33333) @AHeiming + +### `@mui/base@5.0.0-alpha.91` + +- ​<!-- 33 -->[Base] Make PopperUnstyled `component` overridable (#33573) @siriwatknp +- ​<!-- 32 -->[Base] Ensure all components are OverridableComponent (#33506) @michaldudak + +### `@mui/joy@5.0.0-alpha.38` + +- ​<!-- 17 -->[Select] Add new component in Joy (#33630) @siriwatknp +- ​<!-- 15 -->[Joy] Add Text field documentation (#33430, #33631) @danilo-leal +- ​<!-- 14 -->[Joy] Add menu components (#31789) @siriwatknp + +### Docs + +- ​<!-- 31 -->[blog] Fix 404 link to Algolia docs search (dd4308d) @oliviertassinari +- ​<!-- 28 -->[docs] Add accessibility tips (#33633) @siriwatknp +- ​<!-- 27 -->[docs] Fix production deploy of codesandboxes (#33608) @oliviertassinari +- ​<!-- 26 -->[docs] Show border on `palette.background.paper` in dark mode docs (#33611) @ZeeshanTamboli +- ​<!-- 25 -->[docs] Fix typo in Joy UI dark mode page (#33620) @bairamau +- ​<!-- 24 -->[docs] Final polish on Base docs - formatting and style consistency (#33156) @samuelsycamore +- ​<!-- 23 -->[docs] Fix `CssBaseline` import in example code (#33614) @dd-ssc +- ​<!-- 22 -->[docs] Fix Toolpad docs redirection (#33524) @bharatkashyap +- ​<!-- 21 -->[docs] Fix link to Snackbar customization section in Alert docs (#33586) @ZeeshanTamboli +- ​<!-- 20 -->[docs] Fix `placement choices` typo in Tooltip docs (#33571) @MonstraG +- ​<!-- 05 -->[website] Update home page's sponsor grid (#33528) @danilo-leal +- ​<!-- 04 -->[website] Add Vytautas to the about page (#33567) @bytasv +- ​<!-- 03 -->[website] Improve newsletter input design (#33585) @danilo-leal +- ​<!-- 02 -->[website] Add YouTube link to footer (#33580) @gerdadesign +- ​<!-- 01 -->[website] Clarify scope of technical support (#33435) @joserodolfofreitas + +### Core + +- ​<!-- 30 -->[core] Swallow ad blocker fetch fail (#33617) @oliviertassinari +- ​<!-- 29 -->[core] Fix dep security by resolving `thenify` to latest (#33612) @siriwatknp +- ​<!-- 06 -->[test] Remove `view` option from Event in Snackbar tests (#33555) @ZeeshanTamboli + +All contributors of this release in alphabetical order: @AHeiming, @bairamau, @bharatkashyap, @bytasv, @danilo-leal, @dd-ssc, @DinhBaoTran, @gerdadesign, @hbjORbj, @joserodolfofreitas, @michaldudak, @MonstraG, @oliviertassinari, @samuelsycamore, @siriwatknp, @ZeeshanTamboli + +## 5.9.1 + +<!-- generated comparing v5.9.0..master --> + +_Jul 18, 2022_ + +A big thanks to the 17 contributors who made this release possible. This release is mainly about 🐛 bug fixes and 📚 documentation improvements + +### `@mui/material@5.9.1` + +- ​<!-- 24 -->[Autocomplete] Fix disabling component crashing when focused (#31313) @mzedel +- ​<!-- 07 -->[Grid] Avoid scrollbar in demo (#33527) @oliviertassinari +- ​<!-- 05 -->[Slider] Fix transition of tooltips on vertical slider (#33009) @abhinav-22-tech +- ​<!-- 01 -->[TouchRipple] Fix crash on android where `event.touches` are an empty array (#32974) @lukeggchapman + +### `@mui/system@5.9.1` + +- ​<!-- 04 -->[system] Add flag to switch negative margin approach in Grid (#33484) @siriwatknp +- ​<!-- 03 -->[system] Remove needless optional chaining check in `createEmptyBreakpointObject` method (#33482) @ZeeshanTamboli + +### `@mui/base@5.0.0-alpha.90` + +- ​<!-- 23 -->[base] Export types used by components' props (#33522) @michaldudak +- ​<!-- 22 -->[base] Add missing type definitions in useControllableReducer (#33496) @michaldudak +- ​<!-- 06 -->[SelectUnstyled] Do not call onChange unnecessarily (#33408) @michaldudak + +### `@mui/lab@5.0.0-alpha.91` + +- ​<!-- 02 -->[TimelineDot] Add TimelineDotPropsColorOverrides interface to extend color options (#33466) @lolaignatova + +### Docs + +- ​<!-- 19 -->[docs] Add note about CssBaseline in the dark mode page (#33108) @GabrielaLokelani +- ​<!-- 18 -->[docs] Fix typos in the Interoperability page (#33273) @HexM7 +- ​<!-- 17 -->[docs] Improve the `useTheme` documentation (#33508) @rickstaa +- ​<!-- 16 -->[docs] Fix 301 redirections (#33521) @oliviertassinari +- ​<!-- 15 -->[docs] Link the same codesandbox as in the docs (#33472) @oliviertassinari +- ​<!-- 14 -->[docs] Fix copy search false positives (#33438) @oliviertassinari +- ​<!-- 13 -->[docs] Fix typo (#33520) @aravindpanicker +- ​<!-- 12 -->[docs] Update Tailwind docs to include step about updating popover containers (#33315) @ajhenry +- ​<!-- 11 -->[docs] Add yarn command for Roboto font in Material UI's typography.md (#33485) @anthonypz +- ​<!-- 10 -->[docs] Add new community content to the Material UI Learn page (#32927) @Nikhilthadani +- ​<!-- 09 -->[examples] Change createEmotionCache to use `insertionPoint` (#32104) @ANTARES-KOR +- ​<!-- 08 -->[examples] Fix error in Next.js example with @mui/styles (#33456) @paustria + +### Core + +- ​<!-- 21 -->[core] Cleanup experiments (#33547) @siriwatknp +- ​<!-- 20 -->[core] Update CHANGELOG to include pickers breaking change (#33486) @siriwatknp + +All contributors of this release in alphabetical order: @abhinav-22-tech, @ajhenry, @ANTARES-KOR, @anthonypz, @aravindpanicker, @GabrielaLokelani, @HexM7, @lolaignatova, @lukeggchapman, @michaldudak, @mzedel, @Nikhilthadani, @oliviertassinari, @paustria, @rickstaa, @siriwatknp, @ZeeshanTamboli + +## 5.9.0 + +<!-- generated comparing v5.8.7..master --> + +_Jul 12, 2022_ + +A big thanks to the 19 contributors who made this release possible. Here are some highlights ✨: + +- 🧪 Exported Grid v2 as `Unstable_Grid2` (#33479) @siriwatknp +- 📖 Added a guide for using Joy UI and Material UI together (#33396) @siriwatknp +- 🐛 Fixed a few bugs in Material UI components. Thanks to @ZeeshanTamboli, @ivan-ngchakming, and @joebingham-wk. +- ⚠️ **[BREAKING CHANGE]** Date pickers were removed from the lab. Learn how to migrate by visiting the [migration guide](https://mui.com/x/migration/migration-pickers-lab/). (#33386) @flaviendelangle +- many other 🐛 bug fixes and 📚 documentation improvements +- our documentation site is now running with React 18! (#33196) @mnajdova + +### `@mui/material@5.9.0` + +- [CssBaseline] Fixes in overriding style (#33338) @ZeeshanTamboli +- [Autocomplete] Remove unnecessary `clsx` wrapper for single className (#33398) @ZeeshanTamboli +- [Grid] Export new grid as unstable (#33479) @siriwatknp +- [Tooltip] Fix children mouse over detection (#32321) @ivan-ngchakming +- [TypeScript] getCssVar autocomplete for Material UI (#33464) @siriwatknp +- [TypeScript] Fix theme options components types to use `Theme` (#33434) @siriwatknp +- [TypeScript] Reexports necessary types for module augmentation (#33397) @siriwatknp +- [ScopedCssBaseline] Add sx typings (#33474) @joebingham-wk + +### `@mui/system@5.9.0` + +- [System] Add offset feature to Grid (#33415) @siriwatknp +- [system] Add new `Grid` implementation (#32746) @siriwatknp + +### `@mui/lab@5.0.0-alpha.90` + +**⚠️ Breaking changes** + +- [lab] Remove the pickers (#33386) @flaviendelangle + + The pickers are moved to MUI X, check out the [migration guide](https://mui.com/x/migration/migration-pickers-lab/). + +**Changes** + +- [Masonry] Support rem/em values for spacing prop (#33384) @hbjORbj + +### `@mui/base@5.0.0-alpha.89` + +- [Base] Change the order of class names merged in useSlotProps (#33383) @michaldudak +- [ModalUnstyled] Accept callbacks in componentsProps (#33181) @michaldudak +- [SelectUnstyled] Accept callbacks in componentsProps (#33197) @michaldudak +- [TabsUnstyled] Accept callbacks in componentsProps (#33284) @michaldudak + +### `@mui/joy@5.0.0-alpha.36` + +- [Joy] Add guide about using Joy and Material UI together (#33396) @siriwatknp +- [Joy] Fix variants color palette regressions (#33394) @danilo-leal + +### Docs + +- [docs] Correcting small grammatical error (#33393) @robyyo +- [docs] Link to the correct package on Joy component pages (#33439) @cherniavskii +- [docs] Fix e2e tests (#33477) @siriwatknp +- [docs] Fix dead links (#33462) @oliviertassinari +- [docs] Cleanup the migration (#33463) @siriwatknp +- [docs] Fix broken Sponsoring services links @samuelsycamore +- [docs] Improve repo README with light/dark logos, relative links and more (#33356) @samuelsycamore +- [docs] Update links to MUI X Overview and Introduction pages (#33201) @samuelsycamore +- [docs] Update to React 18 (#33196) @mnajdova +- [docs] Simplify "Upload button" demo (#33326) @baharalidurrani +- [docs] Add "refine" demo to showcase (#33240) @omeraplak +- [docs] Add Webpack alias for legacy utils package (#33376) @jgbae +- [docs] Improve external link icons synonyms (#33257) @davidgarciab +- [examples] Update Base UI with Tailwind CSS to use the latest versions of the dependencies (#33401) @mnajdova +- [examples] Add Base UI example (#33154) @siriwatknp + +### Core + +- [core] Fix @mui/monorepo regression for the import of the docs infra (#33390) @Janpot +- [core] Remove old babel resolve rule (#33432) @oliviertassinari +- [website] Shorten the plan descriptions on the pricing page (#32984) @joserodolfofreitas +- [website] Link EULA in the license quantity section (#33292) @oliviertassinari + +All contributors of this release in alphabetical order: @baharalidurrani, @cherniavskii, @danilo-leal, @davidgarciab, @flaviendelangle, @hbjORbj, @ivan-ngchakming, @Janpot, @jgbae, @joebingham-wk, @joserodolfofreitas, @michaldudak, @mnajdova, @oliviertassinari, @omeraplak, @robyyo, @samuelsycamore, @siriwatknp, @ZeeshanTamboli + +## 5.8.7 + +<!-- generated comparing v5.8.6..master --> + +_Jul 4, 2022_ + +A big thanks to the 13 contributors who made this release possible. Here are some highlights ✨: + +- 🐛 Fixed an issue causing TypeScript errors when building a project with Material UI v5.8.6 (@michaldudak) +- 🐛 Fixed a few bugs in Material UI components. Thanks @henriqueholtz, @jake-collibra, @MattiasMartens and @TimoWilhelm! +- many other 🐛 bug fixes and 📚 documentation improvements + +### `@mui/material@5.8.7` + +- [Autocomplete] Add some missing props in `useAutocomplete` (#33269) @henriqueholtz +- [Autocomplete] Extend `componentsProps` to include `popper` and `popupIndicator` slots (#33283) @jake-collibra +- [Select] Annotate empty string as valid value prop (#33088) @MattiasMartens +- [SnackbarContent] Fix message text color with css var provider (#33285) @TimoWilhelm + +### `@mui/styled-engine@5.8.7` + +- [styled-engine] Add missing type dependency on csstype (#33310) @Methuselah96 + +### `@mui/system@5.8.7` + +- [system] Simplify theme input types for `CssVarsProvider` (#33381) @siriwatknp +- [system] Export required types (#33324) @michaldudak + +### `@mui/joy@5.0.0-alpha.35` + +- [Joy] Add radio button documentation (#33254) @siriwatknp +- [Joy] Add switch documentation (#33302) @siriwatknp +- [Joy] Batch a couple of documentation refinements (#33158) +- [Joy] Enable Joy and Material UI compatibility (#33379) @siriwatknp + +### `@mui/base@5.0.0-alpha.88` + +- [base] Remove a type incompatible with TypeScript 3.5 (#33361) @michaldudak +- [BadgeUnstyled] Export BadgeUnstyledOwnProps interface to fix TypeScript compiler error (#33314) @aaronlademann-wf +- [TablePaginationUnstyled] Accept callbacks in componentsProps (#33309) @michaldudak + +### Docs + +- [docs] Fix Link typings in the react-router example (#32308) @aaarichter +- [docs] Add caveat about class components with Tooltip (#33325) @joshkel +- [docs] Fix SEO issues (#33288) @oliviertassinari +- [docs] Fix Slider's "player" demo (#33267) @xlianghang +- [website] Link Toolpad in mui.com (#33287) @oliviertassinari + +All contributors of this release in alphabetical order: @aaarichter, @aaronlademann-wf, @danilo-leal, @henriqueholtz, @jake-collibra, @joshkel, @MattiasMartens, @Methuselah96, @michaldudak, @oliviertassinari, @siriwatknp, @TimoWilhelm, @xlianghang + +## 5.8.6 + +<!-- generated comparing v5.8.5..master --> + +_Jun 27, 2022_ + +A big thanks to the 13 contributors who made this release possible. Here are some highlights ✨: + +- ⚒️ Fixed React 18 issues in few components +- 🚀 Improved the TypeScript augmentation when using CSS variables with `@mui/material` +- many other 🐛 bug fixes and 📚 documentation improvements + +### `@mui/material@5.8.6` + +- ​<!-- 27 -->[Alert] Add support for CSS vars (#32624) @haneenmahd +- ​<!-- 26 -->[Alert] Use `getContrastText` for filled variant font color (#29813) @SamoraMabuya + + Note: The color of the text in the warning contained `Alert` in dark mode was changed to black in order to improve the color contrast ratio + +- ​<!-- 11 -->[OutlinedInput] Fix `ownerState` undefined in theme style overrides (#33241) @siriwatknp +- ​<!-- 08 -->[Tabs] Fix crash when used with React 18 & Suspense (#33277) @mnajdova +- ​<!-- 05 -->[TypeScript] Add CSS vars type augmentation for Material UI (#33211) @siriwatknp + +### `@mui/system@5.8.6` + +- ​<!-- 09 -->[system] Add enableColorScheme option to getInitColorSchemeScript (#33261) @siriwatknp + +### `@mui/utils@5.8.6` + +- ​<!-- 04 -->[utils] Allow state prefix to be configurable (#32972) @siriwatknp + +### `@mui/base@5.0.0-alpha.87` + +- ​<!-- 25 -->[base] Improve the return type of useSlotProps (#33279) @michaldudak +- ​<!-- 24 -->[base] Improve some types (#33270) @mnajdova +- ​<!-- 13 -->[MenuUnstyled] Fix keyboard accessibility of menu items (#33145) @michaldudak +- ​<!-- 12 -->[ModalManager] Lock body scroll when container is inside shadow DOM (#33168) @jacobweberbowery +- ​<!-- 10 -->[SliderUnstyled] Use useSlotProps (#33132) @michaldudak +- ​<!-- 07 -->[TextareaAutosize] Fix crash when used with React 18 & Suspense (#33238) @howlettt +- ​<!-- 06 -->[TextareaAutosize] Fix warnings for too many renders in React 18 (#33253) @mnajdova + +### `@mui/joy@5.0.0-alpha.34` + +- ​<!-- 14 -->[Joy] Add `Sheet` doc (#32820) @hbjORbj + +### Docs + +- ​<!-- 23 -->[blog] Polish Why you should migrate to Material UI v5 today (#33244) @oliviertassinari +- ​<!-- 21 -->[docs] Add note in docs about `componentsProps.root` taking precedence (#33097) @ZeeshanTamboli +- ​<!-- 20 -->[docs] Remove a note about Base components being reexported from Material UI (#33265) @michaldudak +- ​<!-- 19 -->[docs] Update code snippet in docs for custom color palette (#32946) @ZeeshanTamboli +- ​<!-- 18 -->[docs] Fix the docs for production class generation (#31933) @Fafruch +- ​<!-- 17 -->[docs] Fix internal link in Box page (#33149) @davidgarciab +- ​<!-- 16 -->[docs] Badge component link in Base docs should be under Data Display section (#33249) @ZeeshanTamboli +- ​<!-- 15 -->[examples] Fix comment typo (#33256) @WinmezzZ + +### Core + +- ​<!-- 22 -->[core] Remove dead code (#33243) @oliviertassinari +- ​<!-- 03 -->[website] Fix the scroll-top for all the website (#33215) @oliviertassinari +- ​<!-- 02 -->[website] List new core role @oliviertassinari +- ​<!-- 01 -->[website] Fix navigation menu close behavior (#33203) @oliviertassinari + +All contributors of this release in alphabetical order: @davidgarciab, @Fafruch, @haneenmahd, @hbjORbj, @howlettt, @jacobweberbowery, @michaldudak, @mnajdova, @oliviertassinari, @SamoraMabuya, @siriwatknp, @WinmezzZ, @ZeeshanTamboli + +## 5.8.5 + +<!-- generated comparing v5.8.4..master --> + +_Jun 20, 2022_ + +A big thanks to the 14 contributors who made this release possible. Here are some highlights ✨: + +- 🚀 Added support for CSS variables in the `Avatar` component and the `SpeedDialAction` component respectively by @vicasas and @gin1314 +- many other 🐛 bug fixes and 📚 documentation improvements + +### `@mui/material@5.8.5` + +- ​<!-- 30 -->[Avatar] Add support for CSS variables (#32499) @vicasas +- ​<!-- 19 -->[Dialog] Fix broken styles if `maxWidth` is set to `false` (#32987) @kmurgic +- ​<!-- 04 -->[SpeedDialAction] Add support for CSS variables (#32608) @gin1314 +- ​<!-- 02 -->[Tabs] Increment scroll of the minimum amount possible (#33103) @oliviertassinari + +### `@mui/codemod@5.8.5` + +- ​<!-- 24 -->[codemod] Preserve comments within jss-to-tss-react (#33170) @ryancogswell + +### `@mui/lab@5.0.0-alpha.87` + +- ​<!-- 06 -->[Masonry] Fix flickering when used with React 18 (#33163) @mnajdova + +### `@mui/base@5.0.0-alpha.86` + +- ​<!-- 29 -->[BadgeUnstyled] Accept callbacks in componentsProps (#33176) @michaldudak +- ​<!-- 25 -->[ButtonUnstyled] Use useSlotProps (#33096) @michaldudak +- ​<!-- 11 -->[FormControlUnstyled] Accept callbacks in componentsProps (#33180) @michaldudak +- ​<!-- 10 -->[InputUnstyled] Use useSlotProps (#33094) @michaldudak +- ​<!-- 05 -->[ModalUnstyled] Define ownerState and slot props' types (#32901) @michaldudak +- ​<!-- 03 -->[SwitchUnstyled] Use useSlotProps (#33174) @michaldudak + +### `@mui/joy@5.0.0-alpha.33` + +- ​<!-- 09 -->[Joy] Add Checkbox documentation (#33171) @siriwatknp +- ​<!-- 08 -->[Joy] Add List documentation (#33120) @siriwatknp +- ​<!-- 07 -->[Joy] Make slider displays Joy classname (#33051) @siriwatknp + +### Docs + +- ​<!-- 28 -->[blog] Update Blogpost to clear confusion on "no impact" disclaimer. (#33131) @joserodolfofreitas +- ​<!-- 27 -->[blog] Add post about v5 Migration guide update (#33063) @samuelsycamore +- ​<!-- 26 -->[blog] Fix display on Safari (#33102) @oliviertassinari +- ​<!-- 18 -->[docs] Add guide on how to use Base UI with Tailwind CSS (#33100) @mnajdova +- ​<!-- 17 -->[docs] Improve Joy template UX (#33159) @siriwatknp +- ​<!-- 16 -->[docs] Update Shadow DOM guide (#33160) @cherniavskii +- ​<!-- 15 -->[docs] Fix SEO regressions (#33106) @oliviertassinari +- ​<!-- 14 -->[docs] Add job ad in table of content (#33143) @mnajdova +- ​<!-- 13 -->[docs] Add customization as a value proposition (#33014) @oliviertassinari +- ​<!-- 12 -->[examples] Add example using nextjs & @mui/styles as a starter for the migration to v5 (#33005) @mnajdova +- ​<!-- 01 -->[website] Replace Airtable with Ashby links for applying to a opened position (#33193) @DanailH + +### Core + +- ​<!-- 31 -->[core] Add CSS variables support for Material UI components (#32835) @siriwatknp +- ​<!-- 23 -->[core] Add name to workspace root package.json (#33226) @Janpot +- ​<!-- 22 -->[core] Update bug template with generic instruction (#33153) @joserodolfofreitas +- ​<!-- 21 -->[core] Remove dead and redundant code (#33125) @oliviertassinari +- ​<!-- 20 -->[core] Improve inline code rendering within the details tag (#33086) @Harmouch101 + +All contributors of this release in alphabetical order: @cherniavskii, @DanailH, @gin1314, @Harmouch101, @Janpot, @joserodolfofreitas, @kmurgic, @michaldudak, @mnajdova, @oliviertassinari, @ryancogswell, @samuelsycamore, @siriwatknp, @vicasas + +## 5.8.4 + +<!-- generated comparing v5.8.3..master --> + +_Jun 14, 2022_ + +A big thanks to the 24 contributors who made this release possible. Here are some highlights ✨: + +- 🚀 Added support for custom breakpoints in the `Grid` component by @boutahlilsoufiane +- 📚 Added guide on how to use Material UI with Shadow DOM by @cherniavskii +- many other 🐛 bug fixes and 📚 documentation improvements + +### `@mui/material@5.8.4` + +- ​<!-- 36 -->[Button] Add missing classes in `ButtonClasses` type (#33040) @ZeeshanTamboli +- ​<!-- 20 -->[Grid] Fix prop-type key regression (#33123) @oliviertassinari +- ​<!-- 19 -->[Grid] Support custom breakpoints (#31998) @boutahlilsoufiane +- ​<!-- 18 -->[Grow] Limit CSS transition bug workaround to Safari 15.4 only (#32996) @igordanchenko +- ​<!-- 17 -->[Hidden] Remove dependency on hoist-non-react-statics (#33015) @oliviertassinari +- ​<!-- 12 -->[Link] Add support for CSS variables (#33036) @winderica +- ​<!-- 07 -->[Popover] Export `getOffsetTop` & `getOffsetLeft` from Popover's index and add typings (#32959) @rart +- ​<!-- 06 -->[Slider] Fix SliderValueLabelProps type (#32895) @oliviertassinari +- ​<!-- 05 -->[Snackbar] Remove `RTL` direction specific logic (#32808) @aaarichter +- ​<!-- 04 -->[StepIcon] Fix text centering when changing browser font size (#32706) @alansouzati +- ​<!-- 02 -->[Tabs] Scroll by width of the first visible tab if only one tab is partially visible (#32778) @frankkluijtmans + +### `@mui/system@5.8.4` + +- ​<!-- 38 -->[Stack, system] Apply correct responsive styles if any custom breakpoints are provided (#32913) @ZeeshanTamboli +- ​<!-- 03 -->[system] Fix missing typings for ColorFormat (#32417) @l-zoy + +### `@mui/codemod@5.8.4` + +- ​<!-- 35 -->[codemod] Add support for `@mui/styles/makeStyles` imports (#32962) @joshkel + +### `@mui/lab@5.0.0-alpha.86` + +- ​<!-- 08 -->[pickers] Fix broken ref forwarding (#33107) @oliviertassinari +- ​<!-- 13 -->[lab] Fix React's `forwardRef` warning when importing from the index (#33134) @mnajdova + +### `@mui/base@5.0.0-alpha.85` + +- ​<!-- 11 -->[MenuUnstyled] Accept callbacks in componentsProps (#32997) @michaldudak +- ​<!-- 10 -->[ModalUnstyled] Fix errors from the W3C validator about incorrect aria-hidden attribute on some elements (#30920) @mkrtchian +- ​<!-- 09 -->[ModalUnstyled] Fix behavior of not respecting props ariaHidden value (#32055) @tech-meppem + +### `@mui/joy@5.0.0-alpha.32` + +- ​<!-- 16 -->[Joy] Miscellaneous card fixes (#33129) @siriwatknp +- ​<!-- 15 -->[Joy] Miscellaneous fixes (#33073) @siriwatknp +- ​<!-- 14 -->[Joy] Add typography and link docs (#33047) @siriwatknp + +### Docs + +- ​<!-- 40 -->[Contributing.md] Local install instructions (#32975) @Moizsohail +- ​<!-- 32 -->[docs] Add responsive AppBar with drawer (#32769) @dvlprAlamin +- ​<!-- 31 -->[docs] Move codesandbox to MUI org (#33122) @oliviertassinari +- ​<!-- 30 -->[docs] Add Shadow DOM guide (#33007) @cherniavskii +- ​<!-- 29 -->[docs] Fix typo in Material UI overview page (#33087) @oliviertassinari +- ​<!-- 28 -->[docs] Miscellaneous fixes in `Base UI` docs (#33091) @ZeeshanTamboli +- ​<!-- 27 -->[docs] Fix GitHub capitalization (#33071) @oliviertassinari +- ​<!-- 26 -->[docs] Fix a typo in `InputUnstyled` docs (#33077) @ZeeshanTamboli +- ​<!-- 25 -->[docs] Add notification for Joy blog post (#33059) @siriwatknp +- ​<!-- 24 -->[docs] Improve aspect ratio docs and integration (#33065) @siriwatknp +- ​<!-- 34 -->[docs] Update code block copy label (#33128) @siriwatknp +- ​<!-- 23 -->[docs] Fix typo in Autocomplete CSS API (#32838) @KeaghanKennedy +- ​<!-- 22 -->[docs] Improvements for Radio Group Rating Docs (#32843) @Kai-W +- ​<!-- 21 -->[docs] Enable Joy pages (#33064) @siriwatknp +- ​<!-- 02 -->[website] Add Joy UI to the pricing page (#33099) @danilo-leal +- ​<!-- 01 -->[website] Clarify the pricing a bit (#33069) @oliviertassinari + +### Core + +- ​<!-- 39 -->yarn proptypes @oliviertassinari +- ​<!-- 34 -->[core] Update dependencies to fix security vulnerabilities (#33095) @michaldudak +- ​<!-- 33 -->[core] Import new line convention (#33068) @oliviertassinari +- ​<!-- 37 -->[core] Make repository configurable in changelog script (#33130) @Janpot + +All contributors of this release in alphabetical order: @aaarichter, @alansouzati, @boutahlilsoufiane, @cherniavskii, @danilo-leal, @dvlprAlamin, @frankkluijtmans, @igordanchenko, @Janpot, @joshkel, @Kai-W, @KeaghanKennedy, @l-zoy, @michaldudak, @mkrtchian, @mnajdova, @Moizsohail, @oliviertassinari, @pushys, @rart, @siriwatknp, @tech-meppem, @winderica, @ZeeshanTamboli + +## 5.8.3 + +<!-- generated comparing v5.8.2..master --> + +_Jun 7, 2022_ + +A big thanks to the 15 contributors who made this release possible. +This release is mostly about 🐛 bug fixes and 📚 documentation improvements. + +### `@mui/material@5.8.3` + +- [Alert] Constrain message width and allow overflow (#32747) @Janpot +- [Checkbox] Add support for CSS variables (#32579) @haneenmahd +- [Slider] Fix positioning of tooltips on vertical slider (#32919) @abhinav-22-tech + +### `@mui/system@5.8.3` + +- [system] Configurable attributes for libraries (#32971) @siriwatknp + +### `@mui/codemod@5.8.3` + +- [codemod] Fix infinite loop in jss-to-tss-react and add TODO (#33048) @ryancogswell + +### `@mui/lab@5.0.0-alpha.85` + +- [pickers] Add deprecations when importing pickers from the lab (#32950) @flaviendelangle + +### `@mui/joy@5.0.0-alpha.31` + +- [Joy] Add `Slider` component and demos (#32694) @hbjORbj +- [Joy] Add articles about customization approaches (#32887) @siriwatknp +- [Joy] Add automatic adjustment page to core features (#32980) @siriwatknp +- [Joy] Add docs about dark mode (#33002) @siriwatknp +- [Joy] Add template UIs & first look blog post (#32791) @danilo-leal + +### `@mui/base@5.0.0-alpha.84` + +- [base] Remove @mui/system in tests (#32945) @kevinji +- [ButtonUnstyled] Accept callbacks in componentsProps (#32991) @michaldudak +- [SwitchUnstyled] Accept callbacks in componentsProps (#32993) @michaldudak +- [TablePaginationUnstyled] Define ownerState and slot props' types (#32905) @michaldudak +- [TabPanelUnstyled] Define ownerState and slot props' types (#32928) @michaldudak +- [TabsListUnstyled] Define ownerState and slot props' types (#32925) @michaldudak + +### Docs + +- [blog] Fix anchor link scroll (#32994) @oliviertassinari +- [docs] Add "Migration" section to sidebar and revise v4-v5 content (#32740) @samuelsycamore +- [docs] Add What doesn't count as a breaking change? (#32850) @oliviertassinari +- [docs] Fix 301 link @oliviertassinari +- [docs] Fix icon color in `BadgeUnstyled` docs (#32976) @ZeeshanTamboli +- [docs] Improve product identifier (#32707) @danilo-leal +- [docs] Improve UX with back to top (#32896) @oliviertassinari +- [docs] Polish overview page to Material UI (#32954) @oliviertassinari +- [docs] Redirect older URLs (#33037) @oliviertassinari +- [docs] Remove pickers page from the Lab section (#32961) @DanailH +- [docs] Show product identifier on updated MUI X Introduction pages (#32966) @samuelsycamore +- [docs] Throw on 301 links (#32939) @oliviertassinari +- [website] Add Gerda to the about page (#33038) @danilo-leal +- [website] Polish the pricing page (#32811) @oliviertassinari +- [website] Remove unnecessary `address` dependency (#32957) @michaldudak + +### Core + +- [core] Improve icon synonyms (#32742) @oliviertassinari +- [core] Prepare Next.js config for React 18 (#32963) @michaldudak +- [core] Remove dead logic (#32940) @oliviertassinari +- [core] Update dependencies to fix security vulnerabilities (#32947) @michaldudak +- Add security link to README for Tidelift @mbrookes + +All contributors of this release in alphabetical order: @abhinav-22-tech, @DanailH, @danilo-leal, @flaviendelangle, @haneenmahd, @hbjORbj, @Janpot, @kevinji, @mbrookes, @michaldudak, @oliviertassinari, @ryancogswell, @samuelsycamore, @siriwatknp, @ZeeshanTamboli + +## 5.8.2 + +<!-- generated comparing v5.8.1..master --> + +_May 30, 2022_ + +A big thanks to the 8 contributors who made this release possible. Here are some highlights ✨: + +- 🐛 bug fixes and 📚 documentation improvements. + +### `@mui/system@5.8.2` + +- ​<!-- 04 -->[system] Add `getColorSchemeSelector` util (#32868) @siriwatknp + +### `@mui/lab@5.0.0-alpha.84` + +- ​<!-- 07 -->[Masonry] Place items to the left when there are less objects than specified in `column` prop (#32873) @hbjORbj + +### `@mui/base@5.0.0-alpha.83` + +- ​<!-- 24 -->[BadgeUnstyled] Define ownerState and slot props' types (#32750) @michaldudak +- ​<!-- 06 -->[SliderUnstyled] Define ownerState and slot props' types (#32739) @michaldudak +- ​<!-- 05 -->[SwitchUnstyled] Define ownerState and slot props' types (#32573) @michaldudak +- ​<!-- 03 -->[TabsUnstyled] Define ownerState and slot props' types (#32918) @michaldudak +- ​<!-- 02 -->[TabUnstyled] Define ownerState and slot props' types (#32915) @michaldudak + +### `@mui/joy@5.0.0-alpha.30` + +- ​<!-- 13 -->[Joy] use `textColor` prop for Typography and Link (#32938) @siriwatknp +- ​<!-- 12 -->[Joy] Make variants for more flexible (#32931) @siriwatknp +- ​<!-- 11 -->[Joy] Improve automatic adjustment (#32923) @siriwatknp +- ​<!-- 10 -->[Joy] Add `Chip` doc (#32819) @hbjORbj +- ​<!-- 09 -->[Joy] Add `AspectRatio` demos (#32848) @siriwatknp +- ​<!-- 08 -->[Joy] Fix wrong urls (#32883) @siriwatknp + +### Docs + +- ​<!-- 24 -->[docs] Iterate on the job ad for React engineer in Core (#32900) @mnajdova +- ​<!-- 23 -->[blog] Fix avatar image resolution (#32890) @oliviertassinari +- ​<!-- 19 -->[docs] Link the first page of the product (#32943) @oliviertassinari +- ​<!-- 18 -->[docs] Batch small changes (#32170) @michaldudak +- ​<!-- 17 -->[docs] Allow function prop to return undefined (#32766) @m4theushw +- ​<!-- 16 -->[docs] Fix wrong link to Material Icons (#32847) @oliviertassinari +- ​<!-- 15 -->[docs] Fix ClassNameGenerator content (#32800) @siriwatknp +- ​<!-- 14 -->[docs] Fix navigation links (#32851) @oliviertassinari +- ​<!-- 14 -->[docs] Document the `size` prop for InputLabel (#32936) @romelperez +- ​<!-- 21 -->[docs] Add note about transparent background on the outlined Alert variant (#32810) @aaarichter +- ​<!-- 01 -->[website] Update the careers's page with the new roles (#32535) @oliviertassinari + +### Core + +- ​<!-- 22 -->[core] Improve the incomplete issues workflow (#32878) @mnajdova +- ​<!-- 21 -->[core] Add CI check that the PR has label (#32886) @mnajdova +- ​<!-- 20 -->[core] Avoid leaking @babel/runtime (#32874) @oliviertassinari + +All contributors of this release in alphabetical order: @aaarichter, @hbjORbj, @m4theushw, @michaldudak, @mnajdova, @oliviertassinari, @romelperez, @siriwatknp + +## 5.8.1 + +<!-- generated comparing v5.8.0..master --> + +_May 23, 2022_ + +A big thanks to the 21 contributors who made this release possible. Here are some highlights ✨: + +- 💅 Added CSS variables support for two more Material UI components by @diggis00 and @alisasanib +- And more 🐛 bug fixes and 📚 documentation improvements. + +### `@mui/material@5.8.1` + +- ​<!-- 33 -->[Alert] Fix missing `ownerState` on the `action` slot (#32801) @mnajdova +- ​<!-- 20 -->[Fab] Make the `color` prop type extendable (#31830) @paales +- ​<!-- 14 -->[ListItemButton] Render as link if href specified (#32403) @o-dubrovskyi +- ​<!-- 13 -->[Paper] Add support for CSS variables (#32570) @diggis00 +- ​<!-- 11 -->[Radio] Add support for CSS variables (#32599) @alisasanib +- ​<!-- 10 -->[Slider] Prevent rendering for marks that are out of the min & max bounds (#32436) @abriginets +- ​<!-- 09 -->[Slider] Slider having marks should be customizable in theme (#32816) @ZeeshanTamboli +- ​<!-- 03 -->[TouchRipple] Allows call imperative methods without event (#31955) @alexfauquette + +### `@mui/system@5.8.1` + +- ​<!-- 07 -->[system] Simplify stylesheet injection logic (#32869) @siriwatknp +- ​<!-- 06 -->[system] Fix color scheme specificity (#32628) @siriwatknp +- ​<!-- 05 -->[system] Fix `borderRadius` errors when used inside `CssVarsProvider` (#32817) @mnajdova +- ​<!-- 04 -->[system] Fix toolbar media query mixin getting merged in wrong order (#32713) @ZeeshanTamboli + +### `@mui/lab@5.0.0-alpha.83` + +- ​<!-- 15 -->[lab] Add missing `peerDependencies` (#32623) @nate-summercook +- ​<!-- 12 -->[pickers] Update @mui/x-date-pickers to be usable with React 18 (#32828) @flaviendelangle + +### `@mui/base@5.0.0-alpha.82` + +- ​<!-- 08 -->[SliderUnstyled] Fix `disabledSwap` not being respected in `onChangeCommitted` (#32647) @JeanPetrov + +### `@mui/joy@5.0.0-alpha.29` + +- ​<!-- 19 -->[Joy] Show Joy pages on master (#32866) @siriwatknp +- ​<!-- 18 -->[Joy] Add an overview page (#32836) @danilo-leal +- ​<!-- 17 -->[Joy] Add doc for the card components (#32825) @siriwatknp +- ​<!-- 16 -->[Joy] Miscellaneous fixes (#32815) @siriwatknp + +### Docs + +- ​<!-- 31 -->[docs] Simplify header DOM structure (#32844) @oliviertassinari +- ​<!-- 30 -->[docs] Fix CodeSandbox & StackBlitz generation (#32726) @siriwatknp +- ​<!-- 29 -->[docs] Fix urls to columns pages in pricing table (#32842) @alexfauquette +- ​<!-- 28 -->[docs] Fix Tailwind CSS integration docs (#32512) @robertwt7 +- ​<!-- 27 -->[docs] Fixed wrong command for the `link-underline-hover` codemod (#32793) @veronikaslc +- ​<!-- 26 -->[docs] Fixed broken link on the icons page (#32780) @SamuelMaddox +- ​<!-- 25 -->[docs] Add "back to top" button (#30441) @VibhorJaiswal +- ​<!-- 24 -->[docs] Fix typo in notifications @mbrookes +- ​<!-- 32 -->[docs] New WAI-ARIA guidelines location (#32865) @oliviertassinari +- ​<!-- 23 -->[docs] Mention the ESLint plugin for detecting unused classes in tss-react (#32666) @garronej +- ​<!-- 22 -->[docs] Update `useAutocomplete` demos to use `Mui-focused` class (#32757) @ZeeshanTamboli +- ​<!-- 21 -->[examples] Fix `NextLinkComposedProps` gives a TypeScript error (#32655) @ZeeshanTamboli +- ​<!-- 01 -->[website] Add Pedro to About Us page (#32803) @apedroferreira + +### Core + +- ​<!-- 32 -->[core] Upgrade MUI X dependency (#32824) @oliviertassinari +- ​<!-- 02 -->[typescript] Allow module augmentation for `Mixins` (#32798) @mnajdova + +All contributors of this release in alphabetical order: @abriginets, @alexfauquette, @alisasanib, @apedroferreira, @danilo-leal, @diggis00, @flaviendelangle, @garronej, @JeanPetrov, @mbrookes, @mnajdova, @nate-summercook, @o-dubrovskyi, @oliviertassinari, @paales, @robertwt7, @SamuelMaddox, @siriwatknp, @veronikaslc, @VibhorJaiswal, @ZeeshanTamboli + +## 5.8.0 + +<!-- generated comparing v5.7.0..master --> + +_May 17, 2022_ + +A big thanks to the 14 contributors who made this release possible. Here are some highlights ✨: + +- 🚀 [Blog post](https://mui.com/blog/premium-plan-release/) for announcing the release of the Premium plan of MUI X is out thanks to @joserodolfofreitas. +- Codemod for `jss` to `tss-react` migration is out thanks to @ryancogswell +- And more 🐛 bug fixes and 📚 documentation improvements. + +### `@mui/material@5.8.0` + +- ​<!-- 37 -->[Autocomplete] Fix `getInputProps` TypeScript return type (#32730) @ZeeshanTamboli +- ​<!-- 36 -->[Autocomplete] Forward props to renderTags() (#32637) @emlai +- ​<!-- 35 -->[Badge] Fix TypeScript error when adding style overrides for Badge (#32745) @ZeeshanTamboli +- ​<!-- 09 -->[Menu] Fix context menu open position (#32661) @oliviertassinari + +### `@mui/system@5.8.0` + +- ​<!-- 05 -->[system] Add `Container` component and `createContainer` factory (#32263) @mnajdova + +### `@mui/base@5.0.0-alpha.81` + +- ​<!-- 15 -->[InputUnstyled] Support callbacks in componentsProps (#32271) @michaldudak +- ​<!-- 14 -->[InputUnstyled] Define ownerState and slot props' types (#32491) @michaldudak +- ​<!-- 08 -->[MenuUnstyled] Demos improvements (#32714) @michaldudak +- ​<!-- 07 -->[OptionUnstyled] Define ownerState and slot props' types (#32717) @michaldudak + +### `@mui/joy@5.0.0-alpha.28` + +- ​<!-- 13 -->[Joy] Add Badge doc (#32790) @siriwatknp +- ​<!-- 12 -->[Joy] Add global variant feature page (#32695) @siriwatknp +- ​<!-- 11 -->[Joy] Add avatar page (#32711) @siriwatknp + +### `@mui/codemod@5.8.0` + +- ​<!-- 33 -->[codemod] Add jss to tss-react codemod (#31802) @ryancogswell + +### Docs + +- ​<!-- 34 -->[blog] Add release post for MUI X Premium (#32720) @joserodolfofreitas +- ​<!-- 29 -->[docs] Fix wrong code snippet for overriding styles in theme with a callback value (#32781) @ZeeshanTamboli +- ​<!-- 28 -->[docs] Update Crowdin logo (#32782) @andrii-bodnar +- ​<!-- 27 -->[docs] Improve callouts design (#32709) @danilo-leal +- ​<!-- 26 -->[docs] Revise the "Understanding MUI packages" article (#32382) @danilo-leal +- ​<!-- 25 -->[docs] Fix link to the material icons (#32771) @oliviertassinari +- ​<!-- 24 -->[docs] Add notification for Premium release blog post (#32728) @joserodolfofreitas +- ​<!-- 23 -->[docs] Base Portal style revisions and final review (#32157) @samuelsycamore +- ​<!-- 22 -->[docs] Add joy to docs package.json (#32744) @siriwatknp +- ​<!-- 21 -->[docs] Fix TOC-related styles not being applied when disableAd=true (#32733) @cherniavskii +- ​<!-- 20 -->[docs] Add TypeScript guide on the polymorphic components (#32168) @mnajdova +- ​<!-- 19 -->[docs] Fix warning mode pass to React.Fragment (#32729) @siriwatknp +- ​<!-- 18 -->[docs] Revise Showcase copy for clarity + audit appList (#31946) @samuelsycamore +- ​<!-- 17 -->[examples] Update remix example's tsconfig with required values (#32723) @michaldudak +- ​<!-- 16 -->[examples] Update to use React 18's createRoot (#32506) @mnajdova +- ​<!-- 10 -->[l10n] Fix typos and translations on arSD and arEG locales (#31848) @shadigaafar +- ​<!-- 04 -->[website] Improve communication about MUI X components that are still wip (#32708) @danilo-leal +- ​<!-- 03 -->[website] Remove scrollbar on x-axis (#32291) @MrHBS +- ​<!-- 02 -->[website] Update the pricing page for the MUI X premium plan release (#32458) @joserodolfofreitas +- ​<!-- 01 -->[website] Update sponsors (#32725) @oliviertassinari + +### Core + +- ​<!-- 32 -->[core] Enabled Renovate's lockfile maintenance (#32635) @michaldudak +- ​<!-- 31 -->[core] Extract `MuiPage` interface to separate file (#32715) @cherniavskii +- ​<!-- 30 -->[core] Remove unnecessary `spacing` parameter from `createMixins` method (#32690) @ZeeshanTamboli +- ​<!-- 06 -->[private-classnames] Remove package and move everything to utils (#32758) @mnajdova + +All contributors of this release in alphabetical order: @andrii-bodnar, @cherniavskii, @danilo-leal, @emlai, @joserodolfofreitas, @michaldudak, @mnajdova, @MrHBS, @oliviertassinari, @ryancogswell, @samuelsycamore, @shadigaafar, @siriwatknp, @ZeeshanTamboli + +## 5.7.0 + +<!-- generated comparing v5.6.4..master --> + +_May 10, 2022_ + +A big thanks to the 27 contributors who made this release possible. Here are some highlights ✨: + +🛠 This release is all about supporting CSS variables in many Material UI components. +Kudos to all contributors! + +### `@mui/material@5.7.0` + +- [StepLabel, StepIcon] Add support for CSS variables (#32609) @vicasas +- [Table, TableRow] Add support for CSS variables (#32614) @vicasas +- [AppBar] Add a logo component for the responsive app bar demo (#32374) @ameetmadan +- [Autocomplete] Fix clearing single array values (#32626) @mikepricedev +- [Autocomplete] Fix keep listbox open on left/right keys when inputValue is not empty (#31407) @alisasanib +- [Autocomplete] Add support for CSS variables (#32598) @ZeeshanTamboli +- [Autocomplete] Render `endAdornment` only when necessary (#32386) @g1eny0ung +- [ButtonGroup] Add support for CSS variables (#32498) @vicasas +- [CardActionArea] Add support for CSS variables (#32554) @vicasas +- [ClickAwayListener] Allow pointer up/down events to event handler (#32264) @vladjerca +- [CssBaseline] Add support for CSS vars (#32618) @haneenmahd +- [Dialog] Add support for CSS variables (#32555) @vicasas +- [Divider] Add support for CSS variables (#32519) @vicasas +- [Drawer] Add support for CSS variables (#32565) @nghiamvt +- [Fab] Add support for CSS variables (#32564) @alisasanib +- [FormControlLabel] Add support for CSS variables (#32588) @elliefoote +- [FormHelperText] Add support for CSS variables (#32596) @ZeeshanTamboli +- [FormLabel] Add support for CSS variables (#32602) @ZeeshanTamboli +- [Icon] Add support for CSS variables (#32595) @Jamaalwbrown +- [IconButton] Add support for CSS variables (#32590) @Ariyapong +- [ImageListItemBar] Add support for CSS variables (#32578) @vicasas +- [Input] Support CSS variables (#32128) @ivan-ngchakming +- [InputAdornment] Add support CSS variables (#32607) @vicasas +- [Link] Fix style overrides color prop (#32653) @siriwatknp +- [ListItem] Add support for CSS variables (#32580) @dan-mba +- [ListItemButton] Add support for CSS variables (#32582) @dan-mba +- [ListItemIcon] Add support for CSS variables (#32583) @dan-mba +- [ListSubheader] Add support for CSS variables (#32584) @dan-mba +- [MenuItem] Add support for CSS variables (#32561) @nghiamvt +- [MobileStepper] Add support for CSS vars (#32606) @haneenmahd +- [Modal] Add support for CSS variables (#32605) @haneenmahd +- [PaginationItem] Add support for CSS vars (#32612) @haneenmahd +- [Rating] Add support for CSS variables (#32556) @vicasas +- [Snackbar] Add support for CSS variables (#32603) @gin1314 +- [SpeedDial] Add support for CSS variables (#32613) @alisasanib +- [Stepper] Export useStepperContext (#31398) @pzi +- [SvgIcon] Add support for CSS variables (#32610) @vicasas +- [TablePagination] Add support for CSS variables (#32615) @haneenmahd +- [TableSortLabel]: Add support for CSS vars (#32616) @haneenmahd +- [Tabs] Add support for CSS variables (#32547) @ZeeshanTamboli +- [ToggleButton] Add support for CSS variables (#32600) @Ariyapong +- [ToggleButtonGroup] Add support for CSS variables (#32617) @haneenmahd +- [Tooltip] Add support for CSS variables (#32594) @gin1314 + +### `@mui/system@5.7.0` + +- [System] Support CSS variables for iframes & custom nodes (#32496) @siriwatknp + +### `@mui/base@5.0.0-alpha.80` + +- [ButtonUnstyled] Fix keyboard navigation on customized elements (#32204) @michaldudak + +### `@mui/private-classnames@5.7.0` + +- [classnames] Add new package for classnames utils (#32502) @mnajdova + +### Docs + +- [docs] Correct links to prevent 301 redirects (#32692) @michaldudak +- [docs] Move, split, and revise "Unstyled components" page (#32562) @samuelsycamore +- [docs] Nest `ListItemButton` in `ListItem` in the Drawer examples (#31987) @stefanprobst +- [docs] Apply callouts in the Material UI docs (#32567) @danilo-leal +- [docs] Show product identifier on new X pages (#32657) @cherniavskii +- [docs] Fix copy button childNode not found (#32652) @siriwatknp +- [docs] Split install commands in isolated code blocks (#32566) @danilo-leal +- [docs] Base Switch style revisions and final review (#32376) @samuelsycamore +- [docs] Adds Badge link to Base doc nav (#32619) @samuelsycamore +- [docs] Base Installation style revisions and final review (#32483) @samuelsycamore +- [docs] Fix broken redirection (#32581) @oliviertassinari +- [docs] Allows to use `import '<library name>'` in demonstrations (#32492) @alexfauquette +- [docs] Hide copy button on search icon dialog (#32577) @siriwatknp +- [docs] Use full API link for ThemeProvider (#32549) @jcvidiri +- [Joy] Add principles page (#32648) @siriwatknp +- [Joy] Add Button page (#32576) @siriwatknp +- [Joy] Add "Quick start" and "Tutorial" pages (#32383) @siriwatknp +- [website] Add store to the footer and "hiring" chip adjustment (#32650) @danilo-leal +- [website] Optimize conversion to store (#32646) @oliviertassinari +- [website] Remove copy button on marketing pages (#32649) @siriwatknp +- [website] Add missing space in copy label (#32638) @flaviendelangle + +### Core + +- [core] Security updates (#32636) @michaldudak +- [core] Fix `docs:dev` not working after upgrading `next` to 12.1.0 (#32552) @cherniavskii +- [core] Update minimist to fix security vulnerability (#32575) @michaldudak + +All contributors of this release in alphabetical order: @alexfauquette, @alisasanib, @ameetmadan, @Ariyapong, @cherniavskii, @dan-mba, @danilo-leal, @elliefoote, @flaviendelangle, @g1eny0ung, @gin1314, @haneenmahd, @ivan-ngchakming, @Jamaalwbrown, @jcvidiri, @michaldudak, @mikepricedev, @mnajdova, @nghiamvt, @oliviertassinari, @pzi, @samuelsycamore, @siriwatknp, @stefanprobst, @vicasas, @vladjerca, @ZeeshanTamboli + +## 5.6.4 + +<!-- generated comparing v5.6.3..master --> + +_May 2, 2022_ + +A big thanks to the 13 contributors who made this release possible. Here are some highlights ✨: + +- 💅 5 Material UI components were updated to support CSS variables by @ZeeshanTamboli & @vicasas +- And more 🐛 bug fixes and 📚 improvements. + +### `@mui/material@5.6.4` + +- ​<!-- 37 -->[Accordion] Add support for CSS variables (#32542) @ZeeshanTamboli +- ​<!-- 36 -->[AvatarGroup] Add support for CSS variables (#32507) @vicasas +- ​<!-- 35 -->[Badge] Add support for CSS variables (#32516) @vicasas +- ​<!-- 34 -->[BottomNavigation] Add support for CSS variables (#32517) @vicasas +- ​<!-- 33 -->[CircularProgress] Add support for CSS variables (#32543) @ZeeshanTamboli +- ​<!-- 07 -->[FilledInput] Fix type error from undefined `color` (#32258) @hbjORbj +- ​<!-- 02 -->[l10n] Fix typo in csCZ translation of Pagination component (#32509) @Martin005 +- ​<!-- 01 -->[Tabs] Fix `TabIndicatorProps` prop missing `sx` prop (#32503) @b-novikov-ipersonality + +### `@mui/codemod@5.6.4` + +- ​<!-- 32 -->[codemod] Leave numeric arguments to breakpoints functions unchanged (#32426) @ryancogswell +- ​<!-- 31 -->[codemod] Allow for line breaks within theme.spacing parentheses (#32432) @ryancogswell + +### `@mui/joy@5.0.0-alpha.26` + +- ​<!-- 06 -->[Joy] Miscellaneous fixes (#32541) @siriwatknp +- ​<!-- 05 -->[Joy] Add `extendSxProp` to Link (#32505) @siriwatknp +- ​<!-- 04 -->[Joy] Rename variants (#32489) @siriwatknp +- ​<!-- 03 -->[Joy] Add `extendTheme` (#32450) @siriwatknp + +### Docs + +- ​<!-- 30 -->[docs] SEO fixes (#32515) @oliviertassinari +- ​<!-- 29 -->[docs] Replace `Overriding nested component styles` anchor link with text (#32487) @ZeeshanTamboli +- ​<!-- 28 -->[docs] Update the list of external domains (#32514) @oliviertassinari +- ​<!-- 27 -->[docs] Update Material UI code snippets for React 18 (#32361) @samuelsycamore +- ​<!-- 26 -->[docs] Base TextareaAutosize style revisions and final review (#32481) @samuelsycamore +- ​<!-- 25 -->[docs] Base ClickAwayListener style revisions and final review (#32156) @samuelsycamore +- ​<!-- 24 -->[docs] Base Button style revisions and final review (#32380) @samuelsycamore +- ​<!-- 23 -->[docs] Base NoSsr style revisions and final review (#32254) @samuelsycamore +- ​<!-- 22 -->[docs] Correctly capitalize Ctrl @oliviertassinari +- ​<!-- 21 -->[docs] Fix styling in `Basic Popper` demo on the Base UI docs (#32488) @ZeeshanTamboli +- ​<!-- 20 -->[docs] Add "Overview" page to Base docs (#32310) @samuelsycamore +- ​<!-- 19 -->[docs] Add copy button to code block (#32390) @siriwatknp +- ​<!-- 18 -->[docs] Base Tabs style revisions and final review (#32423) @samuelsycamore +- ​<!-- 17 -->[docs] Base Popper style revisions and final review (#32412) @samuelsycamore +- ​<!-- 16 -->[docs] Improve sidenav for MUI X (#32435) @oliviertassinari +- ​<!-- 15 -->[docs] Don't redirect on deploy preview (#32399) @m4theushw +- ​<!-- 14 -->[docs] A few SEO fixes (#32431) @oliviertassinari +- ​<!-- 13 -->[docs] Update links to the new Group & Pivot pages (#32410) @flaviendelangle +- ​<!-- 12 -->[docs] Support callouts (#32402) @siriwatknp +- ​<!-- 11 -->[docs] Fix import path in the Snackbar article #32462 @mongolyy +- ​<!-- 10 -->[docs] Fix grammar mistake in shadows.md (#32454) @HexM7 +- ​<!-- 09 -->[docs] Improve unstyled button docs (#32429) @oliviertassinari + +### Core + +- ​<!-- 08 -->[experiment] Add template for testing Material UI components with CSS variables (#32500) @siriwatknp + +All contributors of this release in alphabetical order: @b-novikov-ipersonality, @flaviendelangle, @hbjORbj, @HexM7, @m4theushw, @Martin005, @mongolyy, @oliviertassinari, @ryancogswell, @samuelsycamore, @siriwatknp, @vicasas, @ZeeshanTamboli + +## 5.6.3 + +<!-- generated comparing v5.6.2..master --> + +_Apr 25, 2022_ + +A big thanks to the 14 contributors who made this release possible. Here are some highlights ✨: + +- 🛠 Fixed TypeScript issue when the `fill` CSS property is used in MUI System (#32355) @valerii15298 +- And more 🐛 bug fixes and 📚 improvements. + +### `@mui/material@5.6.3` + +- [BottomNavigation] Action icon `padding` fix (#32030) @abhinav-22-tech +- [Dialog] Fix `component` prop is not available in `DialogTitleProps` (#32389) @hbjORbj +- [StepContent] Fix TypeScript type of `TransitionComponent` prop (#32314) @ZeeshanTamboli + +### `@mui/system@5.6.3` + +- [system] Fix prop types when the `fill` CSS property is used (#32355) @valerii15298 +- [system] Fix broken behavior when theme value is `zero` (#32365) @ZeeshanTamboli + +### `@mui/base@5.0.0-alpha.78` + +- [InputUnstyled] `multiline` property should not log DOM warnings for `maxRows` and `minRows` props (#32401) @ZeeshanTamboli + +### `@mui/joy@5.0.0-alpha.25` + +- [Joy] Improve theme focus to be more flexible (#32405) @siriwatknp +- [Joy] Add `Radio`, `RadioGroup` components (#32279) @siriwatknp +- [Joy] Add `Chip` component (#31983) @hbjORbj +- [Joy] Improve controls (#32267) @siriwatknp +- [Joy] Set up docs (#32370) @siriwatknp + +### Docs + +- [docs] Enable row reordering on the pricing page (#31875) @DanailH +- [blog] A few improvements on date picker change (#32325) @oliviertassinari +- [docs] Emphasize how to avoid failing tests when migrating from v4 to v5 (#32159) @dwjohnston +- [docs] Revise the related projects page (#32180) @danilo-leal +- [docs] Cleanup remaining @mui/styles usages (#32313) @mnajdova +- [docs] Fix sidenav mobile color (#32324) @oliviertassinari +- [docs] Base TrapFocus style revisions and final review (#32364) @samuelsycamore +- [docs] Update the README.md to better cover the different products (#32360) @samuelsycamore +- [docs] Improve the propTypes generation and API demos' links (#32295) @mnajdova +- [docs] Add ability to display a plan icon next to a page link in nav bar (#32393) @flaviendelangle +- [docs] Change label on `FormControlLabelPlacement` (#32322) @ainatenhi +- [website] Update Diamond sponsors list (#32433) @oliviertassinari +- [website] Add privacy policy link to website's footer (#32080) @danilo-leal +- [website] Remove the designer role (#32384) @danilo-leal + +### Core + +- [core] `yarn prettier` write @oliviertassinari +- [core] Fix changelog warning message (#32240) @praveen001 +- [core] Update the proptypes scripts to support components in @mui/system (#32456) @mnajdova + +All contributors of this release in alphabetical order: @abhinav-22-tech, @ainatenhi, @DanailH, @danilo-leal, @dwjohnston, @flaviendelangle, @hbjORbj, @mnajdova, @oliviertassinari, @praveen001, @samuelsycamore, @siriwatknp, @valerii15298, @ZeeshanTamboli + +## 5.6.2 + +<!-- generated comparing v5.6.1..master --> + +_Apr 18, 2022_ + +A big thanks to the 11 contributors who made this release possible. +This release is mostly about 🐛 bug fixes and 📚 documentation improvements. + +### `@mui/material@5.6.2` + +- ​<!-- 29 -->[Autocomplete] Explain how to use getOptionLabel in free solo mode and update getOptionLabel type (#32165) @michaldudak +- ​<!-- 28 -->[Badge] Fix customization of classes (#32185) @michaldudak +- ​<!-- 03 -->[TextField] Add a workaround for Safari CSS transition scale bug (#32188) @igordanchenko + +### `@mui/system@5.6.2` + +- ​<!-- 05 -->[system] Update style function to use vars automatically if available (#32244) @mnajdova + +### `@mui/base@5.0.0-alpha.77` + +- ​<!-- 08 -->[FormControlUnstyled] Revise API (#32134) @michaldudak + +### `@mui/joy@5.0.0-alpha.24` + +- ​<!-- 07 -->[Joy] Add `Badge` component (#31401) @hbjORbj +- ​<!-- 06 -->[Joy] Fix misuse variable in `Input` (#32268) @siriwatknp + +### Docs + +- ​<!-- 27 -->[blog] Fix images for the docs separation post (#32257) @danilo-leal +- ​<!-- 25 -->[docs] Base Form Control style revisions and final review (#32309) @samuelsycamore +- ​<!-- 24 -->[docs] Base TablePagination style revisions and final review (#32178) @samuelsycamore +- ​<!-- 23 -->[docs] Revise the dark mode article (#32179) @danilo-leal +- ​<!-- 22 -->[docs] Add `aria-label` for `IconButton` (#32276) @SiarheiBobryk +- ​<!-- 21 -->[docs] Fix `borderRadius` in the docs example (#32347) @ZeeshanTamboli +- ​<!-- 20 -->[docs] Fix 404 link in the code (#32323) @oliviertassinari +- ​<!-- 19 -->[docs] Sync h1 with side nav label (#32235) @oliviertassinari +- ​<!-- 18 -->[docs] Fix SEO issues (#32282) @oliviertassinari +- ​<!-- 17 -->[docs] Fix broken link in the test contributing guide (#32283) @sirartemis +- ​<!-- 16 -->[docs] Update "How to customize" page anchor links #32315 @abaker93 +- ​<!-- 15 -->[docs] Mark `onBackdropClick` prop as deprecated in `Dialog`, `Modal` and `ModalUnstyled` components (#32297) @ZeeshanTamboli +- ​<!-- 14 -->[docs] Link to advanced components page (#32290) @siriwatknp +- ​<!-- 13 -->[docs] Sync package description with the docs (#32211) @oliviertassinari +- ​<!-- 12 -->[docs] Revise "Component theming" and "How to customize" guides (#31997) @danilo-leal +- ​<!-- 11 -->[docs] Add note in the Contributing guide about linking issues to a PR (#32174) @danilo-leal +- ​<!-- 10 -->[docs] Update RTL guide (#32242) @michaldudak +- ​<!-- 09 -->[docs] Uniformize capitalization (#32238) @oliviertassinari +- ​<!-- 02 -->[website] Improve new role template @oliviertassinari +- ​<!-- 01 -->[website] Remove a gold sponsor (#32261) @hbjORbj +- ​<!-- 24 -->[website] Mark DataGrid Column spanning done on Pricing page (#32305) @cherniavskii + +### Core + +- ​<!-- 31 -->[core] Remove unecessary div (#32237) @oliviertassinari +- ​<!-- 30 -->[core] Revert #32229 (#32262) @michaldudak +- ​<!-- 04 -->[test] Fix running unit tests on Windows (#32260) @michaldudak + +All contributors of this release in alphabetical order: @abaker93, @cherniavskii, @danilo-leal, @hbjORbj, @igordanchenko, @michaldudak, @mnajdova, @oliviertassinari, @samuelsycamore, @SiarheiBobryk, @sirartemis, @siriwatknp, @ZeeshanTamboli + +## 5.6.1 + +<!-- generated comparing v5.6.0..master --> + +_Apr 11, 2022_ + +A big thanks to the 8 contributors who made this release possible. +This release is mostly about 🐛 bug fixes and 📚 documentation improvements. + +### `@mui/material@5.6.1` + +- [Grow] Extend Safari CSS transition bug workaround on WebKit browsers (#32202) @igordanchenko +- [Link] Fix style overrides 5.6.0 regression (#32182) @siriwatknp +- [Select] Bug when the first child is a ListSubheader (#27299) @DouglasPds + +### `@mui/base@5.0.0-alpha.76` + +- [ButtonUnstyled] Allow receiving focus when disabled (#32090) @michaldudak + +### Docs + +- [blog] Share what's changed about the new docs structure (#32044) @danilo-leal +- [docs] Format number icons search (#32239) @oliviertassinari +- [docs] Fix small external links issue (#32212) @oliviertassinari +- [docs] Make sidenav crawlable (#32241) @oliviertassinari +- [docs] Base Badge style revisions and final review (#32098) @samuelsycamore +- [docs] Fix wrong url (#32208) @siriwatknp +- [docs] Fix date-pickers redirects (#32207) @siriwatknp +- [docs] Add notification for the doc restructure and date pickers update (#32195) @siriwatknp +- [docs] Fix 404 from `ahrefs` report (#32206) @siriwatknp +- [docs] Remove notifications temporary (#32192) @siriwatknp +- [docs] Redirect to new urls (#32048) @siriwatknp +- [docs] Update Learn page copy and resource list (#31989) @samuelsycamore +- [website] Fix wrong MUI X installation instruction link @oliviertassinari +- [website] Revise homepage copy below the hero section (#31283) @samuelsycamore +- [website] Revise homepage Hero copy for more clarity (#31212) @samuelsycamore +- [website] Give up on promoting roles in our docs @oliviertassinari + +### Core + +- [core] Fix misleading types range (#32236) @oliviertassinari +- [core] Small polish on the product name (#32199) @oliviertassinari + +All contributors of this release in alphabetical order: @danilo-leal, @DouglasPds, @igordanchenko, @l10nbot, @michaldudak, @oliviertassinari, @samuelsycamore, @siriwatknp + +## 5.6.0 + +<!-- generated comparing v5.5.3..master --> + +_Apr 5, 2022_ + +A big thanks to the 15 contributors who made this release possible. Here are some highlights ✨: + +- 🧰 Update peer dependencies to support React 18 (#32063) @eps1lon +- 🚀 Added the experimental `CssVarsProvider` in `@mui/material` for generating theme CSS variables (#31138) @mnajdova +- 📣 Moved date and time pickers from the lab to MUI X (#31984) @flaviendelangle +- Several 🐛 bug fixes and 📚 documentation improvements + +### `@mui/material@5.6.0` + +- ​<!-- 25 -->[CssVarsProvider] Add experimental CssVarsProvider in @mui/material (#31138) @mnajdova +- ​<!-- 06 -->[Link] Fix `sx` color to support callback (#32123) @siriwatknp +- ​<!-- 05 -->[Link] Fix color transformation (#32045) @siriwatknp +- ​<!-- 04 -->[ListItemButton] Specified width so that text would ellide (#32083) @MatthijsMud +- ​<!-- 03 -->[TablePagination] Fixed the etEE locale (#32052) @raigoinabox + +### `@mui/base@5.0.0-alpha.75` + +- ​<!-- 31 -->[Badge] Simplify unstyled API (#31974) @michaldudak + +### `@mui/codemod@5.6.0` + +- ​<!-- 29 -->[codemod] Add v5.0.0/date-pickers-moved-to-x codemod (#31373) @flaviendelangle + +### `@mui/lab@5.0.0-alpha.76` + +- ​<!-- 24 -->[DatePicker] Remove date and time pickers from the lab (#31984) @flaviendelangle + +### `@mui/joy@5.0.0-alpha.22` + +- ​<!-- 07 -->[Joy] Add `Card` components (#32027) @siriwatknp + +### Docs + +- ​<!-- 30 -->[blog] New article for the date pickers migration to X (#31831) @flaviendelangle +- ​<!-- 33 -->[docs] Base Menu style revisions and final review (#32097) @samuelsycamore +- ​<!-- 32 -->[docs] Base Select style revisions and final review (#32095) @samuelsycamore +- ​<!-- 31 -->[docs] Base Input style revisions and final review (#32096) @samuelsycamore +- ​<!-- 30 -->[docs] Base Slider style revisions and final review (#32140) @samuelsycamore +- ​<!-- 29 -->[docs] Base Modal style revisions and final review (#32093) @samuelsycamore +- ​<!-- 28 -->[docs] Add page for CSS variables support in @mui/material (#32050) @mnajdova +- ​<!-- 27 -->[docs] Add TSS support for theme style overrides (#31918) @garronej +- ​<!-- 23 -->[docs] Simplify customization examples in ButtonUnstyled demos (#32092) @michaldudak +- ​<!-- 22 -->[docs] Fix linking issues for the redirects (#32101) @siriwatknp +- ​<!-- 21 -->[docs] Create the FormControl page (#32073) @michaldudak +- ​<!-- 20 -->[docs] Remove trap-focus from the navigation (#32079) @psjishnu +- ​<!-- 19 -->[docs] Add date-pickers product identifier (#32076) @siriwatknp +- ​<!-- 18 -->[docs] Move SwitchUnstyled docs to the Base space (#31964) @michaldudak +- ​<!-- 17 -->[docs] Add docs page for unstyled popper (#31813) @siriwatknp +- ​<!-- 16 -->[docs] Copy TextareaAutosize docs to Base (#32034) @michaldudak +- ​<!-- 15 -->[docs] Add react-hook-form-mui to Complementary projects #32015 @TkaczykAdam +- ​<!-- 14 -->[docs] Improve the translation experience (#32021) @oliviertassinari +- ​<!-- 13 -->[docs] Add small size Select demo (#32060) @ivan-ngchakming +- ​<!-- 12 -->[docs] Correct typos (#32029) @apeltop +- ​<!-- 11 -->[docs] Create SliderUnstyled docs (#31850) @michaldudak +- ​<!-- 10 -->[docs] Create TablePaginationUnstyled docs (#32018) @michaldudak +- ​<!-- 09 -->[docs] Move SelectUnstyled docs to the Base space (#31816) @michaldudak +- ​<!-- 08 -->[docs] Create the TabsUnstyled docs (#32023) @michaldudak +- ​<!-- 02 -->[website] The studio finally has a name, use it (#32105) @oliviertassinari +- ​<!-- 01 -->[website] Disable job ad @oliviertassinari + +### Core + +- ​<!-- 28 -->[core] Update peer deps to support React 18 (#32063) @eps1lon +- ​<!-- 27 -->[core] Fix running docs:api on Windows (#32091) @michaldudak +- ​<!-- 26 -->[core] Fix api build script for Base UI (#32081) @siriwatknp + +All contributors of this release in alphabetical order: @apeltop, @eps1lon, @flaviendelangle, @garronej, @ivan-ngchakming, @m4theushw, @MatthijsMud, @michaldudak, @mnajdova, @oliviertassinari, @psjishnu, @raigoinabox, @samuelsycamore, @siriwatknp, @TkaczykAdam + +## 5.5.3 + +<!-- generated comparing v5.5.2..master --> + +_Mar 28, 2022_ + +A big thanks to the 17 contributors who made this release possible. Here are some highlights ✨: + +- ♿️ improved the a11y on some docs demos +- Several 🐛 bug fixes and 📚 documentation improvements + +### `@mui/material@5.5.3` + +- ​<!-- 32 -->[ButtonBase] Start ripple only after mount (#31950) @m4theushw +- ​<!-- 11 -->[FormControlLabel] Fix label prop type to be in-line with other label prop types (#31139) @jannes-io +- ​<!-- 10 -->[Grow] Add a workaround for Safari 15.4 CSS transition bug (#31975) @igordanchenko + +### `@mui/codemod@5.5.3` + +- ​<!-- 31 -->[codemod] Fix variant prop placement (#31990) @ryancogswell + +### `@mui/utils@5.5.3` + +- ​<!-- 02 -->[utils] Improve type inference of useForkRef (#31845) @eps1lon + +### `@mui/base@5.0.0-alpha.74` + +#### Breaking changes + +- ​<!-- 34 -->[base] Remove `BackdropUnstyled` component (#31923) @mnajdova + + The `BackdropUnstyled` component was removed from the `@mui/base` package, as it did not have any specific logic, except adding an `aria-hidden` attribute on the div it rendered. This is not enough to justify it's existence in the base package. Here is an example alternative component you can use: + + ```tsx + const BackdropUnstyled = React.forwardRef<HTMLDivElement, { open?: boolean; className: string }>( + (props, ref) => { + const { open, className, ...other } = props; + return <div className={clsx({ 'MuiBackdrop-open': open }, className)} ref={ref} {...other} />; + }, + ); + ``` + +- ​<!-- 03 -->[FocusTrap] Move docs to Base and drop the Unstyled prefix (#31954) @michaldudak + + Removed the `Unstyled_` prefix from the Base export (it remains in the Material UI export, though). + + ```diff + -import { Unstyled_TrapFocus } from '@mui/base'; + +import { TrapFocus } from '@mui/base'; + + // or + + -import TrapFocus from '@mui/base/Unstyled_TrapFocus'; + +import TrapFocus from '@mui/base/TrapFocus'; + ``` + +#### Changes + +- ​<!-- 33 -->[base] Add @mui/types to dependencies (#31951) @bicstone + +### `@mui/joy@5.0.0-alpha.21` + +- ​<!-- 09 -->[Joy] Add `AvatarGroup` component (#31980) @siriwatknp +- ​<!-- 07 -->[Joy] Miscellaneous fixes (#31873) @siriwatknp +- ​<!-- 08 -->[Joy] Miscellaneous fixes 2 (#31971) @siriwatknp + +### Docs + +- ​<!-- 27 -->[docs] Improve the a11y on the hover rating demo (#31970) @mnajdova +- ​<!-- 26 -->[docs] Improve a11y on the `SplitButton` demo (#31969) @mnajdova +- ​<!-- 25 -->[docs] Improve the color description in the API pages (#30976) @mnajdova +- ​<!-- 24 -->[docs] Add docs page for unstyled Modal (#31417) @mnajdova +- ​<!-- 23 -->[docs] Add InputUnstyled docs (#31881) @mnajdova +- ​<!-- 22 -->[docs] Remove "Work in biotech" from the showcase (#31942) @oliviertassinari +- ​<!-- 21 -->[docs] Fix in-house ad for the design kits (#31965) @oliviertassinari +- ​<!-- 20 -->[docs] Fix the documentation for filterOptions in Autocomplete API page (#31416) @santhoshbala0178 +- ​<!-- 19 -->[docs] Update href for 'TypeScript guide on theme customization' (#31880) @NickFoden +- ​<!-- 18 -->[docs] Fix the CSS Modules example in the Interoperability page (#31935) @WilsonNet +- ​<!-- 17 -->[docs] Fix small typo in the `styled()` utility page (#31967) @jason1985 +- ​<!-- 16 -->[docs] Update mui-x on material-ui navigation (#31810) @siriwatknp +- ​<!-- 15 -->[docs] Copy ClickAwayListener docs to Base (#31878) @michaldudak +- ​<!-- 14 -->[docs] Refine the redirects (#31939) @siriwatknp +- ​<!-- 13 -->[docs] Fix TOC layout for large screen (#31953) @siriwatknp +- ​<!-- 12 -->[examples] Update remix example to not use NODE_ENV guard for `LiveReload` (#31269) @eswarclynn +- ​<!-- 06 -->[NoSsr] Copy docs to the Base space (#31956) @michaldudak +- ​<!-- 05 -->[Portal] Copy Portal docs to the Base space (#31959) @michaldudak +- ​<!-- 01 -->[website] Remove X-Frame-Options @oliviertassinari +- ​<!-- 35 -->Revert "[website] Remove X-Frame-Options" @oliviertassinari + +### Core + +- ​<!-- 30 -->[core] Fixes error in changelog generator for item sorting/padding (#30088) @dimitropoulos +- ​<!-- 29 -->[core] Fix typo in issue template @oliviertassinari +- ​<!-- 28 -->[core] Replace deprecated String.prototype.substr() (#31806) @CommanderRoot +- ​<!-- 04 -->[test] Add tests for component using `StandardProps` and polymorphic components (#31945) @mnajdova + +All contributors of this release in alphabetical order: @bicstone, @CommanderRoot, @dimitropoulos, @eps1lon, @eswarclynn, @igordanchenko, @jannes-io, @jason1985, @m4theushw, @michaldudak, @mnajdova, @NickFoden, @oliviertassinari, @ryancogswell, @santhoshbala0178, @siriwatknp, @WilsonNet + +## 5.5.2 + +<!-- generated comparing v5.5.1..master --> + +_Mar 21, 2022_ + +A big thanks to the 7 contributors who made this release possible. This is a small release focused on some 🐛 bug fixes and 📚 documentation improvements. + +### `@mui/material@5.5.2` + +- ​<!-- 04 -->[Popper] Expose the `sx` prop (#31833) @ivan-ngchakming + +### `@mui/joy@5.0.0-alpha.20` + +- ​<!-- 06 -->[Joy] Add default color to `Input` and `ListItemButton` (#31826) @siriwatknp +- ​<!-- 05 -->[Joy] Add Avatar component (#31303) @hbjORbj + +### `@mui/base@5.0.0-alpha.73` + +- ​<!-- 03 -->[SliderUnstyled] Fix dragging on disabled sliders (#31882) @mnajdova + +### `@mui/styled-engine-sc@5.5.2` + +- ​<!-- 02 -->[styled-engine-sc] GlobalStylesProps inconsistent between the different packages (#31814) @mnajdova + +### Docs + +- ​<!-- 15 -->[data-grid] Fix print export feature (#31807) @oliviertassinari +- ​<!-- 14 -->[docs] Move BadgeUnstyled docs to Base space (#31872) @michaldudak +- ​<!-- 13 -->[docs] Solve duplication of content (#31917) @oliviertassinari +- ​<!-- 12 -->[docs] Fix side nav capitalization of API (#31916) @oliviertassinari +- ​<!-- 11 -->[docs] Use TypeScript demos by default (#31808) @oliviertassinari +- ​<!-- 10 -->[docs] New search experience for multiple products (#31811) @siriwatknp +- ​<!-- 09 -->[docs] Make LTS searchable (#31804) @oliviertassinari +- ​<!-- 08 -->[docs] Fix demo filename on zh markdown (#31790) @nnmax +- ​<!-- 01 -->[website] Highlight the date picker (#31889) @oliviertassinari + +### Core + +- ​<!-- 07 -->[core] Add tests for Avatar component (#31829) @hbjORbj + +All contributors of this release in alphabetical order: @hbjORbj, @ivan-ngchakming, @michaldudak, @mnajdova, @nnmax, @oliviertassinari, @siriwatknp + +## 5.5.1 + +<!-- generated comparing v5.5.0..master --> + +_Mar 14, 2022_ + +A big thanks to the 23 contributors who made this release possible. Here are some highlights ✨: + +- 📊 2021 survey results post by @danilo-leal (#30999) +- Several 🐛 bug fixes and 📚 documentation improvements + +### @mui/material@5.5.1 + +- [Fab] Add z-index (#30842) @issamElmohadeb098 +- [Grid] Fix columns of nested container (#31340) @boutahlilsoufiane +- [i10n] Update italian locale (#30974) @SalvatoreMazzullo +- [Pagination] Fix type of UsePaginationItem["page"] (#31295) @aaronadamsCA +- [Popper] Allow setting default props in a theme (#30118) @hafley66 +- [TextField] fix disappearing border in Safari (#31406) @krysia1 + +### @mui/joy@5.0.0-alpha.19 + +- [Joy] Support horizontal List (#31620) @siriwatknp +- [Joy] Add icon & label `Switch` examples (#31359) @siriwatknp +- [Joy] Add `TextField` component (#31299) @siriwatknp +- [Joy] Add `--Icon-fontSize` to components (#31360) @siriwatknp +- [Joy] Add `Checkbox` component (#31273) @siriwatknp + +### Docs + +- [blog] 2021 survey results post (#30999) @danilo-leal +- [docs] Add Macedonian translation (#31402) @theCuriousOne +- [docs] Fix API page table styles in Safari (#31696) @aaarichter +- [docs] Fix SEO issues (#31505) @oliviertassinari +- [docs] Fix Link leak of Next.js props (#31418) @oliviertassinari +- [docs] Add "Work in biotech" to showcase (#31711) @klyburke +- [docs] Fix docs site crash on iOS Safari 12 (#31458) @badalsaibo +- [docs] Fix search icons crash (#31651) @juanpc10 +- [docs] Remove unnecessary await in e2e-tests (#31767) @siriwatknp +- [docs] Fix source code links on the Templates page (#31425) @danilo-leal +- [docs] Adjust Stack's basic usage demo (#31423) @danilo-leal +- [docs] Migrate button demos to base (#31395) @siriwatknp +- [docs] Fix y-axis unit used in the responsive font sizes chart (#31424) @aaarichter +- [docs] Remove joy mockup pages (#31412) @siriwatknp +- [docs] Fix the statement that styleOverrides are added by default (#31257) @mnajdova +- [docs] Refine the product identifier menu (#31262) @danilo-leal +- [docs] Fix Search crash (#31386) @reckter +- [docs] Update TextField multiline description (#31291) @jontewks +- [docs] Add gap theme mapping in MUI System properties table (#31382) @danilo-leal +- [docs] Test products search (#31351) @siriwatknp +- [docs] Fix GitHub source links in the demo toolbar (#31339) @PunitSoniME +- [docs] Add Algolia verification code to robot.txt (#31356) @siriwatknp +- [examples] Ignore tsbuildinfo with Next.js (#31460) @B0und +- [website] Add new gold sponsor (#31354) @hbjORbj +- [website] Update Ukraine support link (#31378) @samuelsycamore + +### Core + +- [core] Simplify anchor link (#31419) @oliviertassinari +- [core] Revert unrelated changes in #31354 @oliviertassinari +- [test] Upgrade CircleCI convenience image (#31394) @m4theushw +- [typescript] Simplify display of slot props types (#31240) @michaldudak + +All contributors of this release in alphabetical order: @aaarichter, @aaronadamsCA, @B0und, @badalsaibo, @boutahlilsoufiane, @danilo-leal, @hafley66, @hbjORbj, @issamElmohadeb098, @jontewks, @juanpc10, @klyburke, @krysia1, @m4theushw, @michaldudak, @mnajdova, @oliviertassinari, @PunitSoniME, @reckter, @SalvatoreMazzullo, @samuelsycamore, @siriwatknp, @theCuriousOne + +## 5.5.0 + +<!-- generated comparing v5.4.4..master --> + +_Mar 7, 2022_ + +A big thanks to the 16 contributors who made this release possible. Here are some highlights ✨: + +- ♿️ made the `Autocomplete` conform to [ARIA 1.2 combobox](https://www.w3.org/TR/wai-aria-1.2/#combobox) (#30601) @EdmundMai +- Several 🐛 bug fixes and 📚 documentation improvements + +### `@mui/material@5.5.0` + +#### Breaking change + +- ​<!-- 24 -->[ClassNameGenerator] Prevent all `base` imports (#31297) @siriwatknp + + `unstable_ClassNameGenerator` has been moved from `utils` to `className` folder to prevent all Base UI module imports. If you use the module, please update the import as suggested in the diff below: + + ```diff + -import { unstable_ClassNameGenerator } from '@mui/material/utils'; + +import { unstable_ClassNameGenerator } from '@mui/material/className'; + ``` + +#### Changes + +- ​<!-- 28 -->[Autocomplete] Fix failing unit tests (#31302) @michaldudak +- ​<!-- 27 -->[Autocomplete] Have the screen reader announce when autocomplete is open and closed (#30601) @EdmundMai +- ​<!-- 26 -->[AvatarGroup] Fix misalignment with non-default spacing (#31165) @sjdemartini +- ​<!-- 15 -->[Drawer] Adjustments to the mini variant to improve UI/UX (#31267) @siriwatknp +- ​<!-- 04 -->[Select] Add extending `OutlinedInputProps` by SelectProps (#31209) @jrozbicki + +### `@mui/icons-material@5.5.0` + +- ​<!-- 13 -->[icons] Sync new Google Material Icons (#30766) @simonecervini + +### `@mui/codemod@5.5.0` + +- ​<!-- 23 -->[codemod] Fix top level imports codemod (#31308) @mnajdova + +### `@mui/lab@5.0.0-alpha.72` + +- ​<!-- 07 -->[LoadingButton] Fix padding of loading icon in small button (#31113) @PunitSoniME + +### `@mui/base@5.0.0-alpha.71` + +- ​<!-- 05 -->[MenuUnstyled] Create MenuUnstyled and useMenu (#30961) @michaldudak +- ​<!-- 03 -->[SelectUnstyled] Prevent window scrolling after opening (#31237) @michaldudak + +### `@mui/joy@5.0.0-alpha.18` + +- ​<!-- 12 -->[Joy] Make Icon `fontSize` adaptable to its parent (#31268) @siriwatknp +- ​<!-- 11 -->[Joy] Add `Link` component (#31175) @hbjORbj +- ​<!-- 10 -->[Joy] Improve `Sheet` tests (#31241) @hbjORbj +- ​<!-- 09 -->[Joy] Improve SvgIcon tests (#31242) @hbjORbj + +### `@mui/material-next@6.0.0-alpha.26` + +- ​<!-- 06 -->[material-next] Mark @mui/material as a dependency (#31270) @siriwatknp + +### Docs + +- ​<!-- 21 -->[docs] Remove career pages from translation (#31346) @oliviertassinari +- ​<!-- 20 -->[docs] Fix JS files overloading (#31341) @oliviertassinari +- ​<!-- 19 -->[docs] Add banner in solidarity of Ukraine (#31275) @danilo-leal +- ​<!-- 18 -->[docs] Fix maxWidth of scrollable Tabs demos (#31285) @danilo-leal +- ​<!-- 17 -->[docs] Fix icon linking implementation concurrent safe (#30428) @Janpot +- ​<!-- 16 -->[docs] Follow up new doc space issues (#31251) @siriwatknp +- ​<!-- 29 -->[examples] Add `@types/node` to Next.js TypeScript starter (#30918) @Daggy1234 +- ​<!-- 14 -->[examples] Fix import ThemeProvider from correct package in remix-wit… (#30981) @nnecec +- ​<!-- 25 -->[blog] Simplify the labels (#30921) @oliviertassinari +- ​<!-- 08 -->[l10n] Add Croatian (hr-HR) and Serbian (sr-RS) translation (#30906) @m14d3n + +### Core + +- ​<!-- 23 -->[core] Fix running markdownlint on Windows (#31352) @michaldudak +- ​<!-- 22 -->[core] Fix the stylelint script on Windows (#31281) @mnajdova +- ​<!-- 02 -->[test] Fix buildApiUtils tests on Windows (#31304) @michaldudak +- ​<!-- 01 -->[test] Remove legacyRoot option from test renderer (#31284) @eps1lon + +All contributors of this release in alphabetical order: @Daggy1234, @danilo-leal, @EdmundMai, @eps1lon, @hbjORbj, @Janpot, @jrozbicki, @m14d3n, @michaldudak, @mnajdova, @nnecec, @oliviertassinari, @PunitSoniME, @simonecervini, @siriwatknp, @sjdemartini + +## 5.4.4 + +<!-- generated comparing v5.4.3..master --> + +_Feb 28, 2022_ + +A big thanks to the 17 contributors who made this release possible. Here are some highlights ✨: + +- ✨ New `Input` and `Sheet` components were added in the experimental Joy design system by @hbjORbj (#31124, #31086) @hbjORbj +- Several 🐛 bug fixes and 📚 documentation improvements + +### `@mui/material@5.4.4` + +- ​<!-- 28 -->[Autocomplete] Have Autocomplete with multiline textfield log a warning instead of an error (#30680) @iclaude3 +- ​<!-- 27 -->[Chip] Fix ellipsis when the children is too long (#31087) @PunitSoniME +- ​<!-- 14 -->[Input] Export InputBase's classes from the classes const (#31186) @mnajdova +- ​<!-- 29 -->[TextField] Fix Horizontal scroll when label too long (#31187) @RedHeadphone +- ​<!-- 08 -->[styles] Fix typo in import error (#31167) @davwheat + +### `@mui/system@5.4.4` + +- ​<!-- 07 -->[system] Fix executing server-side Emotion component as function interpolation 2 (#31024) @Andarist +- ​<!-- 06 -->[system] Fix sx prop types when CSS variables are used with nested selectors (#31163) @mnajdova +- ​<!-- 05 -->[system] Fix `CssVarsProvider` theme mutation (#31148) @siriwatknp + +### `@mui/codemod@5.4.4` + +- ​<!-- 26 -->[codemods] Add v5.0.0/top-level-imports codemod (#31195) @greengiraffe + +### `@mui/base@5.0.0-alpha.70` + +- ​<!-- 31 -->[SelectUnstyled, MultiSelectUnstyled, ButtonUnstyled] Export additional types to make customization easier (#31172) @michaldudak + +### `@mui/joy@5.0.0-alpha.17` + +- ​<!-- 13 -->[Joy] Add nested list components (#31159) @siriwatknp +- ​<!-- 12 -->[Joy] Improve color customization on `Switch` (#31137) @siriwatknp +- ​<!-- 11 -->[Joy] Add `Sheet` component (#31124) @hbjORbj +- ​<!-- 10 -->[Joy] add `Input` component (#31086) @siriwatknp +- ​<!-- 09 -->[Joy] Fix Button missing slot type (#31166) @siriwatknp + +### Docs + +- ​<!-- 22 -->[docs] Fix 404 link to the blog (#31234) @oliviertassinari +- ​<!-- 21 -->[docs] Use `material-ui` for product name (#31200) @siriwatknp +- ​<!-- 20 -->[docs] Add Base installation page (#30969) @siriwatknp +- ​<!-- 19 -->[docs] Use new Algolia app for new structure (#31178) @siriwatknp +- ​<!-- 18 -->[docs] Typo in the `FormControl` API documentation (#31169) @bonellia +- ​<!-- 17 -->[docs] Fix typo in Stack documentation (#31176) @adriancampos +- ​<!-- 16 -->[docs] Update interoperability.md broken tailwind links (#31182) @robertwt7 +- ​<!-- 15 -->[docs] Add missing import into tss-react migration guide (#31162) @sviande +- ​<!-- 03 -->[website] The role is filled (#31216) @oliviertassinari +- ​<!-- 02 -->[website] Revise the row grouping blog post (#31101) @samuelsycamore +- ​<!-- 01 -->[website] Fix a few SEO issues (#31150) @oliviertassinari + +### Core + +- ​<!-- 30 -->[core] Add group for the @fortawesome dependencies (#31193) @mnajdova +- ​<!-- 25 -->[core] Update playwright docker to match the specified version (#31236) @siriwatknp +- ​<!-- 24 -->[core] Remove parallel on buildTypes (#31189) @siriwatknp +- ​<!-- 23 -->[core] Fix propTypes generation for optional any props (#31141) @m4theushw +- ​<!-- 04 -->[typescript] Remove variants deprecation (#31239) @siriwatknp + +All contributors of this release in alphabetical order: @adriancampos, @Andarist, @bonellia, @davwheat, @greengiraffe, @hbjORbj, @iclaude3, @m4theushw, @michaldudak, @mnajdova, @oliviertassinari, @PunitSoniME, @RedHeadphone, @robertwt7, @samuelsycamore, @siriwatknp, @sviande + +## 5.4.3 + +<!-- generated comparing v5.4.2..master --> + +_Feb 21, 2022_ + +A big thanks to the 14 contributors who made this release possible. Here are some highlights ✨: + +- 🛠 @hbjORbj made components use theme duration/easing values by default (#30894) +- A meaningful number of 🐛 bug fixes and 📚 documentation improvements + +### `@mui/material@5.4.3` + +- ​<!-- 18 -->[ButtonBase] Fix typo (#31135) @Jastor11 +- ​<!-- 05 -->[Stepper] Export useStepContext (#31021) @michaldudak +- ​<!-- 04 -->[Transitions] Some components do not use transition duration/easing values from theme (#30894) @hbjORbj + +### `@mui/icons-material@5.4.3` + +- ​<!-- 11 -->[icons] Add "circle" icon synonyms (#31118) @gnowland + +### `@mui/joy@5.0.0-alpha.16` + +- ​<!-- 10 -->[Joy] `List` second iteration (#31134) @siriwatknp +- ​<!-- 09 -->[Joy] Fix typings (#31120) @siriwatknp +- ​<!-- 08 -->[Joy] Add initial `List` components (#30987) @siriwatknp + +### Docs + +- ​<!-- 19 -->[website] Improve full-stack role job description (#31160) @Janpot +- ​<!-- 14 -->[docs] Fix typo of migration guides v4 (#31136) @pppp606 +- ​<!-- 13 -->[docs] Update on the support page to account for v4 LTS support (#31029) @danilo-leal +- ​<!-- 12 -->[docs] Fix small typo in chips.md (#31092) @cameliaben +- ​<!-- 07 -->[l10n] Add it-IT translation for labelDisplayedRows (#31131) @frab90 +- ​<!-- 06 -->[l10n] Add pl-PL translation for labelDisplayedRows (#31088) @ThomasTheHuman +- ​<!-- 03 -->[website] Sync MUI X table feature (#30913) @alexfauquette +- ​<!-- 02 -->[website] Prefill source in job application links (#31036) @oliviertassinari +- ​<!-- 01 -->[website] Fix a grammar mistake (#31099) @huyenltnguyen + +### Core + +- ​<!-- 17 -->[core] Add jsx, html, css and prisma to prettier extensions (#31161) @Janpot +- ​<!-- 16 -->[core] Allow to run material-ui.com/store alongside mui.com/store (#31065) @oliviertassinari +- ​<!-- 15 -->[core] Polish design tokens (#31095) @oliviertassinari + +All contributors of this release in alphabetical order: @alexfauquette, @cameliaben, @danilo-leal, @frab90, @gnowland, @hbjORbj, @huyenltnguyen, @Janpot, @Jastor11, @michaldudak, @oliviertassinari, @pppp606, @siriwatknp, @ThomasTheHuman + +## 5.4.2 + +_Feb 15, 2022_ + +A big thanks to the 16 contributors who made this release possible. Here are some highlights ✨: + +- 🛠 @sydneyjodon-wk improved propTypes of the ToggleButton components (#30883) +- Several 🐛 bug fixes and 📚 documentation improvements + +### `@mui/material@5.4.2` + +- [Select] Allow customizing Select based on its variant (#30788) @michaldudak +- [Portal] Re-export 'Portal' in material (#31003) @liradb2000 +- [ToggleButton] Add prop types for `onClick` and `onChange` (#30883) @sydneyjodon-wk +- [typescript] Added TypeText declaration to the exports file (#30890) @agauravdev + +### `@mui/system@5.4.2` + +- [system] Fix broken behavior when breakpoints input are not ordered (#30996) @mnajdova + +### `@mui/lab@5.0.0-alpha.69` + +- [DatePicker] Fix passing clearable prop (#30786) @alisasanib + +### `@mui/joy@5.0.0-alpha.15` + +- [Joy] Improve variant customization experience (#30878) @siriwatknp +- [Joy] Make `sx` prop work in Joy (#30955) @siriwatknp + +### Framer + +- [design] Remove framer components (#30983) @mbrookes +- [design] Remove framer leftovers (#31070) @michaldudak + +### Docs + +- [docs] Update installation guide of the icons package (#31026) @huyenltnguyen +- [docs] Improve the indication for the legacy APIs (#30995) @mnajdova +- [docs] Specify which props are added in the default `shouldForwardProp` option (#30978) @mnajdova +- [docs] Fix layout shift on loading (#31017) @oliviertassinari +- [docs] Increase scroll affordance in wide tables (#30713) @danilo-leal +- [docs] Fix look & feel of the Masonry demos (#30971) @oliviertassinari +- [docs] Improve Base component demos (#30884) @danilo-leal +- [docs] Use full product names (Material UI, MUI System) (#30960) @oliviertassinari +- [docs] Prefer useEnhancedEffect to avoid server side warnings (#30977) @mnajdova +- [docs] Fix force redirection to a different locale (#30967) @oliviertassinari +- [docs] Add live Tailwind CSS demo (#30966) @oliviertassinari +- [website] Add banner for promoting priority open roles (#31076) @danilo-leal +- [website] Open Full-stack Engineer role for studio (#31038) @prakhargupta1 +- [website] Minor security improvements (#31062) @oliviertassinari +- [website] Improve title of open roles (#30963) @DanailH +- [website] Add BIMI avatar (#30444) @oliviertassinari +- [website] Add Sycamore to About page (#31000) @samuelsycamore + +### Core + +- [benchmark] Add missing dependency (#30994) @michaldudak +- [core] Bump date-io version (#31016) @michaldudak +- [core] Fix typo in useSlider (#31061) @ryohey +- [core] Remove unused draft-js types package (#30993) @michaldudak +- [test] Test if certain Base members are exported from Material UI (#31067) @michaldudak +- [core] Remove dead code (#31064) @oliviertassinari + +All contributors of this release in alphabetical order: @agauravdev, @alisasanib, @DanailH, @danilo-leal, @huyenltnguyen, @l10nbot, @liradb2000, @mbrookes, @michaldudak, @mnajdova, @prakhargupta1, @oliviertassinari, @ryohey, @samuelsycamore, @siriwatknp, @sydneyjodon-wk + +## 5.4.1 + +<!-- generated comparing v5.4.0..master --> + +_Feb 8, 2022_ + +A big thanks to the 24 contributors who made this release possible. Here are some highlights ✨: + +- ♿️ Snackbar messages are now announced by NVDA when using Firefox (#30774) @eps1lon +- Several 🐛 bug fixes and 📚 documentation improvements. + +### `@mui/material@5.4.1` + +- ​<!-- 37 -->[AvatarGroup] Enable targeting of additional Avatar when max props is passed (#30794) @mogrady88 +- ​<!-- 36 -->[Badge] Fix showzero and invisible condition (#30899) @alisasanib +- ​<!-- 35 -->[ButtonBase] Expose ref to TouchRipple (#30901) @m4theushw +- ​<!-- 15 -->[Fab] Add support for the default theme colors (#30846) @alisasanib +- ​<!-- 11 -->[SelectInput] Only attach click handler to label if a labelId is passed (#30239) @johsunds +- ​<!-- 09 -->[Snackbar] Ensure messages are announced in NVDA+FF (#30774) @eps1lon + +### `@mui/base@5.0.0-alpha.68` + +- ​<!-- 10 -->[SelectUnstyled] Improve exported types (#30895) @michaldudak + +### `@mui/lab@5.0.0-alpha.68` + +- ​<!-- 12 -->[Pickers] Fix `onDismiss` handler in `MobileDatePicker` (#30768) @Ashish2097 +- ​<!-- 06 -->[TimePicker] Add font family for clock numbers (#30738) @alisasanib + +### `@mui/joy@5.0.0-alpha.14` + +- ​<!-- 14 -->[Joy] Add `IconButton` component (#30864) @siriwatknp +- ​<!-- 13 -->[Joy] Use icon inside a Button (#30803) @siriwatknp + +### Docs + +- ​<!-- 16 -->[examples] Fix vitejs example and improve HMR (#30897) @mihailgaberov +- ​<!-- 33 -->[docs] Improve autocomplete "limit tags" demo (#30910) @danilo-leal +- ​<!-- 34 -->[docs] Sync translations with Crowdin (#30950) @l10nbot +- ​<!-- 38 -->[docs] Improve description of the disableRestoreFocus prop of the `TrapFocus` (#30912) @flaviendelangle +- ​<!-- 32 -->[docs] Remove ul with div children and replace with nav element (#30534) @joeframbach +- ​<!-- 31 -->[docs] Add Saleor to showcase (#30924) @cherniavskii +- ​<!-- 30 -->[docs] Include JSS in styling solution interoperability guide (#30736) @garronej +- ​<!-- 29 -->[docs] Fix contents of link-underline-hover (#30904) @pppp606 +- ​<!-- 28 -->[docs] Fix markdown table format (#30947) @oliviertassinari +- ​<!-- 27 -->[docs] Add missing import to RTL guide (#30891) @CFarhad +- ​<!-- 26 -->[docs] Fix WithStyles import statement for @mui/styles (#30942) @altruity +- ​<!-- 25 -->[docs] Fix broken roadmap table (#30943) @cherniavskii +- ​<!-- 24 -->[docs] Fix broken URL in "Edit this page" button (#30923) @cherniavskii +- ​<!-- 23 -->[docs] Migrate content to the new location (#30757) @siriwatknp +- ​<!-- 22 -->[docs] Fix the link to the Vite.js example project (#30872) @GneyHabub +- ​<!-- 21 -->[docs] Clarify the minimum configuration for TypeScript (#30790) @mnajdova +- ​<!-- 20 -->[docs] Clarify what the name of @mui/material is (#30866) @oliviertassinari +- ​<!-- 19 -->[docs] Remove migration from the releases page (#30863) @mnajdova +- ​<!-- 18 -->[docs] Update Instructions for Google Maps Autocomplete (#30849) @kjschabra +- ​<!-- 17 -->[docs] Hotfix notification (#30862) @siriwatknp +- ​<!-- 04 -->[website] Sample GA to avoid hit limit (#30919) @oliviertassinari +- ​<!-- 03 -->[website] Hide scrollbars of hero containers (#29474) @theiliad +- ​<!-- 02 -->[website] Polishing spacing and other small things (#30828) @danilo-leal +- ​<!-- 01 -->[website] Close the Developer Advocate role (#30867) @oliviertassinari + +### Core + +- ​<!-- 37 -->[core] Batch small fixes (#30952) @oliviertassinari +- ​<!-- 34 -->[core] Rename the GitHub org (#30944) @oliviertassinari +- ​<!-- 33 -->[core] Fix propTypes in components where OverridableStringUnion is used (#30682) @paales +- ​<!-- 08 -->[test] Codify the difference between keyup and keydown in SelectUnstyled (#30857) @eps1lon +- ​<!-- 07 -->[test] Fix typo (#30841) @caioagiani +- ​<!-- 05 -->[utils] Use built-in hook when available for useId (#30654) @eps1lon + +All contributors of this release in alphabetical order: @alisasanib, @altruity, @Ashish2097, @caioagiani, @CFarhad, @cherniavskii, @danilo-leal, @eps1lon, @flaviendelangle, @garronej, @GneyHabub, @joeframbach, @johsunds, @kjschabra, @m4theushw, @michaldudak, @mihailgaberov, @mnajdova, @mogrady88, @oliviertassinari, @paales, @pppp606, @siriwatknp, @theiliad + +## 5.4.0 + +<!-- generated comparing v5.3.1..master --> + +_Feb 1, 2022_ + +A big thanks to the 22 contributors who made this release possible. Here are some highlights ✨: + +- 🛠 @goncalovf added an example project using [Material UI with Vite.js](https://github.com/mui/material-ui/tree/master/examples/material-ui-vite) (#28241) +- Number of 🐛 bug fixes and 📚 documentation improvements. + +### `@mui/material@5.4.0` + +#### Breaking changes + +- ​<!-- 27 -->[core] Do not reexport Base from Material (#30853) @michaldudak + + All Base components were exported from the `@mui/material` package and treated as stable even though the `@mui/base` package is in development. It could create a lot of confusion if developers start using Base components, depend on them, and demand quality found in "proper" Material components. We admit it was a mistake to reexport these components without marking them as unstable. + + Developers are still encouraged to evaluate the Base components, but they should do so by explicitly installing the `@mui/base` package. + + This is technically a breaking change as it removes a number of components from the `@mui/material` package. However, we believe that removing the components now and potentially breaking the codebases will do less harm than introducing "silent" breaking changes to Base components while continuing reexporting them from `@mui/material`. + + Note: the utility components, such as ClickAwayListener, NoSsr, Portal, and TextareaAutosize continue to be exported from both `@mui/material` and `@mui/base`. + + If you're encountering build errors after upgrading @mui/material, do the following: + + 1. Install @mui/base: npm install @mui/base or yarn add @mui/base + 2. Make sure the version of @mui/base match the version of @mui/material + 3. Change the import paths of unstyled components from @mui/material to @mui/base, e.g.: + + ```diff + -import ButtonUnstyled from '@mui/material/ButtonUnstyled'; + +import ButtonUnstyled from '@mui/base/ButtonUnstyled'; + ``` + +#### Changes + +- ​<!-- 30 -->[Autocomplete] Add `readOnly` prop (#30706) @ZeeshanTamboli +- ​<!-- 29 -->[Autocomplete] Fix typos in the page (#30737) @austinewuncler +- ​<!-- 14 -->[FormControlLabel][formgroup] add Mui-error class (#30656) @alisasanib +- ​<!-- 13 -->[Grid] Fix prop check for applying wrap-reverse (#30813) @Hubbz +- ​<!-- 07 -->[TextField] Remove notch when no label is added (#30560) @alisasanib +- ​<!-- 06 -->[TextField] Remove usage of dangerouslySetInnerHTML (#30776) @Jack-Works +- ​<!-- 05 -->[TreeView] Select node when key `Enter` is pressed (#30795) @dryrainbow +- ​<!-- 04 -->[useMediaQuery] Ensure no tearing in React 18 (#30655) @eps1lon + +### `@mui/base@5.0.0-alpha.67` + +- ​<!-- 11 -->[SelectUnstyled] Create unstyled select (+ hook) (#30113) @michaldudak + +### `@mui/lab@5.0.0-alpha.67` + +- ​<!-- 23 -->[DateTimePicker] Fix month view highlight wrong tab (#30773) @DiegoYungh +- ​<!-- 12 -->[pickers] Enable the sx props on all components (#30749) @boutahlilsoufiane + +### Docs + +- ​<!-- 28 -->[blog] Introducing callback support in style overrides (#30668) @siriwatknp +- ​<!-- 23 -->[docs] Add notifications for the blog posts (#30852) @siriwatknp +- ​<!-- 22 -->[docs] Improve the interoperability guide (#30785) @mnajdova +- ​<!-- 21 -->[docs] Improve the Getting Started documentation content (#30808) @mnajdova +- ​<!-- 20 -->[docs] Fix typo in ad fallback (#30823) @cherniavskii +- ​<!-- 19 -->[docs] Change ThemeProvider API links (#30705) @atakanzen +- ​<!-- 18 -->[docs] Retain vendor prefixing in rtl example (#30710) @ryancogswell +- ​<!-- 17 -->[docs] Fix typo in the Popper ScrollPlayground demo (#30780) @tanyabouman +- ​<!-- 16 -->[docs] Small fixes on the jss-to-tss migration guide (#30734) @garronej +- ​<!-- 15 -->[examples] Add Vite.js example (#28241) @goncalovf + +### Core + +- ​<!-- 29 -->[core] Clarify the label, to match with MUI X (#30831) @oliviertassinari +- ​<!-- 26 -->[core] Remove none code related instructions from git (#30843) @oliviertassinari +- ​<!-- 25 -->[core] Fix typos in comments for scripts (#30809) @aefox +- ​<!-- 24 -->[core] Fix 301 link in the blog @oliviertassinari +- ​<!-- 10 -->[test] Fix tests on Node 16 (#30819) @michaldudak +- ​<!-- 09 -->[test] Add explicit types to support noImplicityAny=false (#30798) @m4theushw +- ​<!-- 08 -->[test] Support React.useId format in \*DescriptionOf (#30657) @eps1lon +- ​<!-- 03 -->[website] Fix SEO issues (#30829) @oliviertassinari +- ​<!-- 02 -->[website] Add designer position page (#30708) @danilo-leal +- ​<!-- 01 -->[website] Polish /about page (#30747) @oliviertassinari + +All contributors of this release in alphabetical order: @aefox, @alisasanib, @atakanzen, @austinewuncler, @boutahlilsoufiane, @cherniavskii, @danilo-leal, @DiegoYungh, @dryrainbow, @eps1lon, @garronej, @goncalovf, @Hubbz, @Jack-Works, @m4theushw, @michaldudak, @mnajdova, @oliviertassinari, @ryancogswell, @siriwatknp, @tanyabouman, @ZeeshanTamboli + +## 5.3.1 + +<!-- generated comparing v5.3.0..master --> + +_Jan 24, 2022_ + +A big thanks to the 12 contributors who made this release possible. Here are some highlights ✨: + +- 🛠 @mnajdova added interoperability guide for using Tailwind CSS (#30700) +- A meaningful number of 🐛 bug fixes and 📚 documentation improvements. + +### `@mui/icons-material@5.3.1` + +- ​<!-- 04 -->[icons] Fix naming typos (#30512) @MrHBS +- ​<!-- 03 -->[icons] Makes material-icons work with Joy (#30681) @siriwatknp + +### `@mui/base@5.0.0-alpha.66` + +- ​<!-- 02 -->[SliderUnstyled] Improve typings on some internal utils (#30614) @mnajdova + +### Core + +- ​<!-- 24 -->[core] Batch small changes (#30690) @oliviertassinari +- ​<!-- 23 -->[core] Add new structure to ignore list crowdin (#30608) @siriwatknp +- ​<!-- 22 -->[core] Correct version in package.json (#30677) @michaldudak +- ​<!-- 01 -->[test] Fix buildApiUtils tests on Windows (#30698) @michaldudak + +### Docs + +- ​<!-- 26 -->[blog] Enable blog index (#30724) @siriwatknp +- ​<!-- 25 -->[blog] Introducing the Row Grouping feature (#30598) @alexfauquette +- ​<!-- 21 -->[docs] Fix SEO crawl errors (#30733) @oliviertassinari +- ​<!-- 20 -->[docs] Update migration-v4.md (#30721) @ddecrulle +- ​<!-- 19 -->[docs] Fix migration issues detected by `ahrefs` (#30751) @siriwatknp +- ​<!-- 18 -->[docs] Add interoprability guide for using Tailwind CSS (#30700) @mnajdova +- ​<!-- 17 -->[docs] Fix typo in containedSizeMedium class (#30723) @aaneitchik +- ​<!-- 16 -->[docs] Hotfix the wrong URL in X marketing page (#30729) @siriwatknp +- ​<!-- 15 -->[docs] Post migration preparation fix (#30716) @siriwatknp +- ​<!-- 14 -->[docs] Update remix example to restore from error pages (#30592) @mnajdova +- ​<!-- 13 -->[docs] Use new URLs when enable_redirects is true (#30704) @siriwatknp +- ​<!-- 12 -->[docs] Add a missing bracket in the migration-v4 guide (#30616) @chaosmirage +- ​<!-- 11 -->[docs] Add Checkbox color prop change (#30697) @aaneitchik +- ​<!-- 10 -->[docs] Fix migration to have singular urls (#30695) @siriwatknp +- ​<!-- 09 -->[docs] Update UXPin link to new landing page (#30691) @Evomatic +- ​<!-- 08 -->[docs] Close user menu on click in the responsive app bar demo (#30664) @NoahYarian +- ​<!-- 07 -->[docs] Clear the difference between UI and React components (#29930) @oliviertassinari +- ​<!-- 06 -->[docs] Make Autocomplete docs gender neutral (#30679) @exequielbc +- ​<!-- 05 -->[docs] Update doc structure for X components (#30684) @siriwatknp + +All contributors of this release in alphabetical order: @aaneitchik, @alexfauquette, @chaosmirage, @ddecrulle, @Evomatic, @exequielbc, @michaldudak, @mnajdova, @MrHBS, @NoahYarian, @oliviertassinari, @siriwatknp + +## 5.3.0 + +<!-- generated comparing v5.2.8..master --> + +_Jan 17, 2022_ + +A big thanks to the 15 contributors who made this release possible. Here are some highlights ✨: + +- 🛠 @siriwatknp added support for callbacks in styleOverrides (#30524) +- 🧩 @ZeeshanTamboli and @VicHofs improved customization of components (#30515, #30212) +- 🛠 @hbjORbj fixed the use of ResizeObserver in Masonry component (#29896) +- 📄 @danilo-leal and @siriwatknp created our own blog home page (#30121) + +### `@mui/material@5.3.0` + +- [Autocomplete] Add ability to pass props to `Paper` component (#30515) @ZeeshanTamboli +- [Select] Add defaultOpen prop (#30212) @VicHofs + +### `@mui/system@5.3.0` + +- [system][box, grid, typography] `textTransform` prop should work directly on component (#30437) @hbjORbj +- [system] Support callback value in `styleOverrides` slot (#30524) @siriwatknp + +### `@mui/lab@5.0.0-alpha.65` + +- [Masonry] Observe every masonry child to trigger computation when needed (#29896) @hbjORbj +- [MobileDatePicker] Fix calling onOpen when readOnly is true (#30561) @alisasanib + +### `@mui/codemod@5.3.0` + +- [codemod] Bump `jscodeshift` to remove `colors` dependency (#30578) @siriwatknp + +### `@mui/styled-engine-sc@5.3.0` + +- [styled-engine-sc] Add the withConfig API to enable using the babel plugin for styled-comonents (#30589) @mnajdova + +### `@mui/joy@5.0.0-alpha.11` + +- [Joy] Add `SvgIcon` component (#30570) @hbjORbj + +### `@mui/base@5.0.0-alpha.65` + +- [SliderUnstyled] Add useSlider hook and polish (#30094) @mnajdova + +### Docs + +- [docs] End code block in test/README.md (#30531) @yaboi +- [docs] Remove redundant grouping in /components/radio-buttons/ (#30065) @eps1lon +- [docs] Update migration scripts and e2e tests (#30583) @siriwatknp +- [docs] Fix migration guides for versions older than v4 (#30595) @kkirsche +- [docs] Inform about specific files for DataGrid locales (#30411) @alexfauquette +- [docs] jss-to-tss migration advise to drop clsx in favor of cx (#30527) @garronej +- [docs] Fix integration with MUI X (#30593) @oliviertassinari +- [docs] Adding peer dependencies explanation on @mui/lab README.md (#30532) @glaucoheitor +- [docs] Add missing quote in migration docs (#30587) @Atralbus +- [docs] Update link to Doit sponsor (#30586) @oliviertassinari +- [docs] Add products identifier and drawer (#30283) @siriwatknp +- [website] Fix code button with installation command (#30622) @danilo-leal +- [website] Add a Blog index page (#30121) @danilo-leal +- [website] Migrate Twitter from @MaterialUI to @MUI_hq @oliviertassinari +- [website] Add Andrii to the About Us page (#30581) @cherniavskii + +### Core + +- [core] Revert changes to peer dependencies (#30662) @oliviertassinari +- [core] Renovate should not try to update node (#30659) @oliviertassinari +- [core] Remove dead files (#30663) @oliviertassinari +- [core] Fix outdated TypeScript template (#30596) @oliviertassinari +- [core] Remove extra `</p>` from header of README.md (#30530) @yaboi +- [core] Fix `docs:api` script for Windows OS (#30533) @ZeeshanTamboli + +All contributors of this release in alphabetical order: @alexfauquette, @alisasanib, @Atralbus, @cherniavskii, @danilo-leal, @eps1lon, @garronej, @glaucoheitor, @hbjORbj, @kkirsche, @mnajdova, @oliviertassinari, @siriwatknp, @VicHofs, @yaboi, @ZeeshanTamboli + +## 5.2.8 + +<!-- generated comparing v5.2.7..master --> + +_Jan 10, 2022_ + +A big thanks to the 10 contributors who made this release possible. Here are some highlights ✨: + +- A meaningful number of 🐛 bug fixes and 📚 documentation improvements. + +### `@mui/material@5.2.8` + +- ​<!-- 05 -->[TextField][inputlabel] Remove `pointer-events: none` property (#30493) @hbjORbj +- ​<!-- 02 -->[Slider] Add `input` slot to components and componentsProps (#30362) @alexandre-lelain + +### `@mui/joy@5.0.0-alpha.10` + +- ​<!-- 04 -->[Joy] Add `Typography` component (#30489) @siriwatknp +- ​<!-- 03 -->[Joy] Add functional `Switch` component (#30487) @siriwatknp + +### Docs + +- ​<!-- 18 -->[docs] Update markdown parser to remove backticks from description (#30495) @aefox +- ​<!-- 17 -->[docs] Fix the crash when applying custom colors (#30563) @siriwatknp +- ​<!-- 16 -->[docs] Location change of Sebastian (#30528) @eps1lon +- ​<!-- 15 -->[docs] Lint markdown in the CI (#30395) @oliviertassinari +- ​<!-- 14 -->[docs] Fix `componentsProps` API docs and PropTypes (#30502) @ZeeshanTamboli +- ​<!-- 13 -->[docs] Codemod doc for overriding styles using tss (#30499) @garronej +- ​<!-- 12 -->[docs] fix edge case when replacing data-grid url for migration (#30505) @siriwatknp +- ​<!-- 11 -->[docs] fix replace url for migration (#30503) @siriwatknp +- ​<!-- 10 -->[docs] Prepare scripts for migrating to new structure (#30386) @siriwatknp +- ​<!-- 09 -->[docs] Adjust RTL Guide demos to fully support RTL (#30387) @noam-honig +- ​<!-- 08 -->[docs] Move @eps1lon to community (#30473) @oliviertassinari +- ​<!-- 07 -->[docs] Fix typo and spelling in the-sx-prop.md (#30482) @aefox +- ​<!-- 06 -->[docs] More general docs polishing (#30371) @danilo-leal +- ​<!-- 01 -->[website] Add José on the /about page (#30492) @danilo-leal + +All contributors of this release in alphabetical order: @aefox, @alexandre-lelain, @danilo-leal, @eps1lon, @garronej, @hbjORbj, @noam-honig, @oliviertassinari, @siriwatknp, @ZeeshanTamboli + +## 5.2.7 + +<!-- generated comparing v5.2.6..master --> + +_Jan 3, 2022_ + +A big thanks to the 14 contributors who made this release possible. Here are some highlights ✨: + +- 📓 Improvements on the Vietnamese (vi-VN) and Finnish (fi-FI) locales (#30426, #30442) @hckhanh @Certificate +- And more 🐛 bug fixes and 📚 documentation improvements. + +### `@mui/material@5.2.7` + +- ​<!-- 14 -->[Autocomplete] Fix calling onChange for duplicate values (#30374) @alisasanib +- ​<!-- 13 -->[Avatar] Fix TypeScript error on imgProps (#30255) @ahmad-reza619 +- ​<!-- 12 -->[Badge] Fix `classes` prop TypeScript type (#30427) @ZeeshanTamboli +- ​<!-- 03 -->[SvgIcon] Allow viewBox to inherit from Component through inheritViewBox prop (#29954) @alex-dikusar +- ​<!-- 04 -->[SvgIcon] Correct API docs and code style (#30470) @michaldudak + +### Docs + +- ​<!-- 11 -->[blog] 2021 (#30425) @oliviertassinari +- ​<!-- 15 -->[docs] Fix typo on the Grid docs page (#30446) @abhi45 +- ​<!-- 07 -->[docs] Fix `useMediaQuery` SSR example to v5 theme API (#30454) @ValentinH +- ​<!-- 11 -->[docs] Improve the migration guide and add examples for transforming to `tss-react` (#30388) @mnajdova +- ​<!-- 09 -->[docs] Make the reference to the select clearer (#30460) @boazrymland +- ​<!-- 08 -->[docs] Sync translations with Crowdin (#30385) @l10nbot +- ​<!-- 06 -->[example] Avoid double rendering in the Remix example (#30366) @mnajdova +- ​<!-- 05 -->[i18n] improve viVN locale (#30426) @hckhanh +- ​<!-- 04 -->[l10n] Improve fiFI locale (#30442) @Certificate +- ​<!-- 02 -->[website] Add new batch of open roles (#30282) @oliviertassinari +- ​<!-- 01 -->[website] Refactor page context with next router (#30020) @siriwatknp + +### Core + +- ​<!-- 13 -->[core] Automatically close issues that are incomplete and inactive (#30459) @oliviertassinari +- ​<!-- 10 -->[core] Remove contrib tweet (#30455) @oliviertassinari + +All contributors of this release in alphabetical order: @abhi45, @ahmad-reza619, @alex-dikusar, @alisasanib, @boazrymland, @Certificate, @hckhanh, @l10nbot, @michaldudak, @mnajdova, @oliviertassinari, @siriwatknp, @ValentinH, @ZeeshanTamboli + +## 5.2.6 + +<!-- generated comparing v5.2.5..master --> + +_Dec 27, 2021_ + +A big thanks to the 14 contributors who made this release possible. Here are some highlights ✨: + +- 📓 The Norwegian Bokmål (nb-NO) locale was added (#27520) @wogsland +- 🛠 Introduced a new `useBadge` hook in the `@mui/base` package (#30246) @mnajdova +- And more 🐛 bug fixes and 📚 documentation improvements. + +### `@mui/material@5.2.6` + +- ​<!-- 24 -->[ButtonGroup] Fix typo in ButtonGroupContext's interface (#30376) @kealjones-wk +- ​<!-- 03 -->[l10n] Add Norwegian Bokmål (nb-NO) locale (#27520) @wogsland + +### `@mui/base@5.0.0-alpha.62` + +- ​<!-- 26 -->[BadgeUnstyled] Add useBadge hook (#30246) @mnajdova + +### `@mui/joy@5.0.0-alpha.8` + +- ​<!-- 04 -->[Joy] Button API (#29962) @siriwatknp + +### Docs + +- ​<!-- 27 -->[docs] Fix color coercion (#30319) @Janpot +- ​<!-- 25 -->[blog] Fix file import conflict resolution (#30391) @oliviertassinari +- ​<!-- 21 -->[docs] Fix crash on Safari because of unsupported lookahead feature (#30345) @cherniavskii +- ​<!-- 20 -->[docs] Update to new website domain (#30396) @ryota-murakami +- ​<!-- 19 -->[docs] Fix text from material-ui to @mui to reflect v5 name changes (#30393) @pupudu +- ​<!-- 18 -->[docs] Fix a11y in Menu demos (#30378) @ZeeshanTamboli +- ​<!-- 17 -->[docs] Document how to unmount transition child (#30382) @oliviertassinari +- ​<!-- 16 -->[docs] The current standard for quotes is QUOTATION MARK @oliviertassinari +- ​<!-- 15 -->[docs] Fix 404 links (#30380) @oliviertassinari +- ​<!-- 14 -->[docs] Fix Breadcrumb description (#30307) @jamesmelzer +- ​<!-- 13 -->[docs] Modify injection order for Gatsby and SSR examples (#30358) @ShuPink +- ​<!-- 12 -->[docs] Improve the translation experience (#30373) @oliviertassinari +- ​<!-- 11 -->[docs] Sync translations with Crowdin (#30176) @l10nbot +- ​<!-- 10 -->[docs] Fix link to /size-snapshot (#30363) @oliviertassinari +- ​<!-- 09 -->[docs] Fix incorrect aria label in SpeedDial demo (#30354) @chwallen +- ​<!-- 08 -->[docs] Fix incorrect number of breakpoint helpers (#30353) @chwallen +- ​<!-- 07 -->[docs] Update outdated links (#30260) @oliviertassinari +- ​<!-- 06 -->[docs] Support redirects from old urls to /material/\* (#30286) @siriwatknp +- ​<!-- 05 -->[examples] Fix CSS Modules integration (#30381) @oliviertassinari +- ​<!-- 02 -->[website] Fix SEO issues (#30372) @oliviertassinari +- ​<!-- 01 -->[website] Sync sponsors (#30259) @oliviertassinari + +### Core + +- ​<!-- 28 -->[core] Rename Material UI to MUI (#30338) @ZeeshanTamboli +- ​<!-- 23 -->[core] Fix warning in dev mode (#30368) @oliviertassinari +- ​<!-- 22 -->[core] Update `buildApi` script to support new structure (#30245) @siriwatknp + +All contributors of this release in alphabetical order: @cherniavskii, @chwallen, @jamesmelzer, @Janpot, @kealjones-wk, @l10nbot, @mnajdova, @oliviertassinari, @pupudu, @ryota-murakami, @ShuPink, @siriwatknp, @wogsland, @ZeeshanTamboli + +## 5.2.5 + +<!-- generated comparing v5.2.4..master --> + +_Dec 20, 2021_ + +A big thanks to the 16 contributors who made this release possible. Here are some highlights ✨: + +- 🛠 This release mostly improves what's behind the scenes: infrastructure and tests +- 📓 Danish (da-DK) locale was added (#29485) @mikk5829 +- 🖌 Polished the design of Base components (#30149) and the docs in general (#29994) @danilo-leal +- 📚 Many additions and improvements to the documentation were made + +### `@mui/material@5.2.5` + +- [l10n] Add Danish (da-DK) locale (#29485) @mikk5829 +- [LoadingButton] Label progressbar by the LoadingButton (#30002) @eps1lon +- [Tabs] Remove unnecessary `Partial<>` type around TabIndicatorProps type (#30254) @ZeeshanTamboli + +### `@mui/system@5.2.5` + +- [system] Use `useEnhancedEffect` to prevent flicker (#30216) @hbjORbj + +### `@mui/lab@5.0.0-alpha.61` + +- [pickers] Fix the wrong MuiClockPicker's ArrowSwitcher slot name (#30226) @rejetto + +### Docs + +- [docs] Run JS compiler on markdown output (#29732) @Janpot +- [Badge] Add tests for `anchorOrigin` prop (#30147) @daniel-sachs +- [docs] Add cssmodule injection order comments to Nextjs example (#30213) @ShuPink +- [docs] Remove extra word in Select component code example comments (#30281) @KThompso +- [docs] Improve the description of the Accordion (#30253) @jamesmelzer +- [docs] Heading capitalization convention @oliviertassinari +- [docs] Rename remaining 'unstyled' references to 'base' (#30206) @michaldudak +- [docs] Add to migration doc about ref type specificity (#30114) @hbjORbj +- [docs] Add script to clone pages (#30107) @siriwatknp +- [docs] Correct colors in breakpoints documentation (#30219) @michaldudak +- [docs] Sync icon search UI state with the url (#30075) @Janpot +- [docs] Base components demos design polish (#30149) @danilo-leal +- [docs] General documentation polish (#29994) @danilo-leal +- [examples] Fix typo in the remix example's README (#30289) @lemol +- [website] Remove expired gold sponsor (#30222) @oliviertassinari +- [website] Remove broken showcase links (#30217) @mnajdova + +### Core + +- [test] Reduce bundle size comparison memory consumption (#30195) @Janpot +- [core] make snapshot comparison more resilient (#30183) @Janpot +- [core] update formatted ts demo to support new structure (#30248) @siriwatknp +- [core] cache dependencies in github actions (#30211) @siriwatknp +- [core] fix root package version (#30204) @siriwatknp +- [core] Fail the build when the dangerjs script errors (#30186) @Janpot +- [test] Add E2E website tests (#30128) @siriwatknp + +All contributors of this release in alphabetical order: @daniel-sachs, @danilo-leal, @eps1lon, @hbjORbj, @jamesmelzer, @Janpot, @KThompso, @lemol, @michaldudak, @mikk5829, @mnajdova, @oliviertassinari, @rejetto, @ShuPink, @siriwatknp, @ZeeshanTamboli + +## 5.2.4 + +<!-- generated comparing v5.2.3..master --> + +_Dec 14, 2021_ + +A big thanks to the 16 contributors who made this release possible. Here are some highlights ✨: + +- ✨ Add `not` operator to `theme.breakpoints` (#29311) @Philipp000 + + ```js + const styles = (theme) => ({ + root: { + backgroundColor: 'blue', + // Match [xs, md) and [md + 1, ∞) + // [xs, md) and [lg, ∞) + // [0px, 900px) and [1200px, ∞) + [theme.breakpoints.not('md')]: { + backgroundColor: 'red', + }, + }, + }); + ``` + +- And many more 🐛 bug fixes and 📚 improvements. + +### `@mui/material@5.2.4` + +- ​<!-- 14 -->[esm] Correct a styles imports (#29976) @Janpot +- ​<!-- 12 -->[GlobalStyles] Fix `theme` type (#30072) @mnajdova +- ​<!-- 11 -->[Grid] Fix grid items to respond to the container's responsive columns (#29715) @kkorach +- ​<!-- 04 -->[TextField] Fix missing space before asterisk in `OutlinedInput`'s label (#29630) @alisasanib +- ​<!-- 03 -->[Transition] Allow any valid HTML attribute to be passed (#29888) @Janpot +- ​<!-- 02 -->[types] Fix discrepancy between core and system `ThemeOptions` (#30095) @fmeum +- ​<!-- 09 -->[InputBase] Add prop for disabling global styles (#29213) @bryan-hunter +- ​<!-- 08 -->[Select] Improve multiple logic (#30135) @ladygo93 + +### `@mui/system@5.2.4` + +- ​<!-- 06 -->[system] Don't transition when re-appearing (#30108) @eps1lon +- ​<!-- 05 -->[system] Add `not` operator to `breakpoints` (#29311) @Philipp000 + +### `@mui/base@5.0.0-alpha.60` + +- ​<!-- 25 -->[BadgeUnstyled] Make it conformant with other base components (#30141) @mnajdova + +### `@mui/icons-material@5.2.4` + +- ​<!-- 10 -->[icons] Correct location of icon download folder (#29839) @yaboi + +### Docs + +- ​<!-- 22 -->[docs] Explain the use of Select's label in FormControl (#30189) @michaldudak +- ​<!-- 21 -->[docs] Don't run nprogress on shallow routing (#30087) @Janpot +- ​<!-- 20 -->[docs] Add Data Driven Forms to related projects (#30078) @rvsia +- ​<!-- 19 -->[docs] Sync translations with Crowdin (#30067) @l10nbot +- ​<!-- 18 -->[docs] Fix link on "Custom variables" section in the Theming page #30100 @danilo-leal +- ​<!-- 17 -->[docs] Fix justifyContent option in the Grid interactive demo (#30117) @danilo-leal +- ​<!-- 16 -->[docs] Add tip to help access the docs of a previous version when finding answers in Stack Overflow (#30101) @danilo-leal +- ​<!-- 15 -->[docs] Fix import example inside Unstyled Backdrop section (#30098) @TheodosiouTh +- ​<!-- 01 -->[website] Column pinning and Tree data are out (#30136) @oliviertassinari +- ​<!-- 07 -->[survey] Remove survey promotion items (#30122) @danilo-leal + +### Core + +- ​<!-- 23 -->[core] Fix link to Open Collective @oliviertassinari +- ​<!-- 26 -->[core] Update snapshots and s3 fallback (#30134) @Janpot +- ​<!-- 24 -->[ci] Update CI bucket (#30080) @Janpot +- ​<!-- 13 -->[fix] size:snapshot for mui-material-next and mui-joy components (#30106) @Janpot + +All contributors of this release in alphabetical order: @alisasanib, @bryan-hunter, @danilo-leal, @eps1lon, @fmeum, @Janpot, @kkorach, @l10nbot, @ladygo93, @michaldudak, @mnajdova, @oliviertassinari, @Philipp000, @rvsia, @TheodosiouTh, @yaboi + +## 5.2.3 + +<!-- generated comparing v5.2.2..master --> + +_Dec 6, 2021_ + +A big thanks to the 25 contributors who made this release possible. Here are some highlights ✨: + +- ✨ We have introduced a new unstyled component in `@mui/base`: `TablePagination` (#29759) @mnajdova + + <a href="https://mui.com/components/tables/#unstyled-table"><img width="800" alt="unstyled table" src="https://user-images.githubusercontent.com/4512430/144862194-584356ef-7d9d-462c-a631-186a7e716193.png"></a> + + You can follow our progress with unstyled components at https://github.com/mui/base-ui/issues/10. + +- 🎉 We have added an example of how to use MUI with [Remix](https://remix.run/) (#29952) @mnajdova + +- And many more 🐛 bug fixes and 📚 improvements. + +### `@mui/material@5.2.3` + +- ​<!-- 33 -->[Accordion] Add a test for handling `square` prop (#29972) @daniel-sachs +- ​<!-- 32 -->[Alert] Fix `square` Paper prop (#30027) @ZeeshanTamboli +- ​<!-- 31 -->[AvatarGroup] Allow specifying total number of avatars (#29898) @eduardomcv +- ​<!-- 29 -->[Button] Fix regression from context API (#29982) @siriwatknp +- ​<!-- 13 -->[Grid] Fix generated classes for `spacing` prop when the value is object (#29880) @jayeclark +- ​<!-- 10 -->[Select] Should not crash when an empty array is passed with `multiple` enabled (#29957) @Domino987 + +### `@mui/system@5.2.3` + +- ​<!-- 06 -->[system] Fix return type of `createBox` (#29989) @mnajdova +- ​<!-- 05 -->[system] Support boolean values in TypeScript for the `sx` prop when used as array (#29911) @tasugi + +### `@mui/utils@5.2.3` + +- ​<!-- 03 -->[utils] Add typings for `@mui-material/styles/cssUtils` (#29621) @Semigradsky + +### `@mui/icons-material@5.2.1` + +- ​<!-- 12 -->[icons] Consolidate ignored icons into one list (#29843) @chao813 + +### `@mui/base@5.0.0-alpha.59` + +- ​<!-- 30 -->[base] Fix missing ClickAwayListener barrel index export (#30000) @oliviertassinari +- ​<!-- 04 -->[TablePaginationUnstyled] Introduce new component (#29759) @mnajdova + +### `@mui/lab@5.0.0-alpha.59` + +- ​<!-- 27 -->[DateRangePicker] Fix `DateRangePickerDayProps` interface (#29067) @jonathanrtuck +- ​<!-- 10 -->[Pickers] Remove propagation of custom props to the `MonthPicker` component's DOM element (#30021) @ZeeshanTamboli +- ​<!-- 08 -->[StaticDatePicker] Add className and slot to PickerStaticWrapper (#29619) @kkorach + +### `@mui/joy@5.0.0-alpha.5` + +- ​<!-- 11 -->[Joy] Theme setup (#29846) @siriwatknp + +### Docs + +- ​<!-- 34 -->[docs] Fix link in TypeScript doc page (#30044) @genzyy +- ​<!-- 26 -->[docs] Remove the 'WIP' icon from the 'Group & Pivot' page title (#30077) @flaviendelangle +- ​<!-- 25 -->[docs] Add warning that `@mui/styled-engine-sc` does not work in SSR (#30026) @mnajdova +- ​<!-- 24 -->[docs] Add section for CSS specificity in the migration guide (#30008) @hbjORbj +- ​<!-- 28 -->[docs] Clarify comment in migration doc (#30076) @hbjORbj +- ​<!-- 23 -->[docs] Sync translations with Crowdin (#30041) @l10nbot +- ​<!-- 22 -->[docs] Explain how Paper changes shade in dark mode (#30003) @michaldudak +- ​<!-- 21 -->[docs] Update nextjs-typescript-example (#29974) @huydhoang +- ​<!-- 20 -->[docs] Add missing global state classes to API docs generator (#29945) @michaldudak +- ​<!-- 19 -->[docs] Fix benchmarks folder link (#29981) @fourjr +- ​<!-- 18 -->[docs] Improve wording in Stack Overflow section of support page (#29956) @ronwarner +- ​<!-- 17 -->[docs] Remove Black Friday sale notification (#29936) @mbrookes +- ​<!-- 16 -->[examples] Fix typos in the Remix example (#30071) @MichaelDeBoey +- ​<!-- 15 -->[examples] Add Remix example (#29952) @mnajdova +- ​<!-- 14 -->[examples] Fix lint issue for displayName missing in the Next.js examples (#29985) @ZeeshanTamboli +- ​<!-- 09 -->[Stack] Document system props in Stack API (#30069) @ThewBear +- ​<!-- 07 -->[survey] Add a banner and card for promoting the 2021 survey (#29950) @danilo-leal +- ​<!-- 02 -->[website] Correct the Careers page description (#30073) @michaldudak +- ​<!-- 01 -->[website] Fix 301 links (#30040) @oliviertassinari + +### Core + +- ​<!-- 31 -->[core] Batch small changes (#30042) @oliviertassinari +- ​<!-- 28 -->[core] Transition to a new Stack Overflow tag (#29967) @oliviertassinari + +All contributors of this release in alphabetical order: @chao813, @daniel-sachs, @danilo-leal, @Domino987, @eduardomcv, @flaviendelangle, @fourjr, @genzyy, @hbjORbj, @huydhoang, @jayeclark, @jonathanrtuck, @kkorach, @l10nbot, @mbrookes, @MichaelDeBoey, @michaldudak, @mnajdova, @oliviertassinari, @ronwarner, @Semigradsky, @siriwatknp, @tasugi, @ThewBear, @ZeeshanTamboli + +## 5.2.2 + +<!-- generated comparing v5.2.1..master --> + +_Nov 29, 2021_ + +A big thanks to the 9 contributors who made this release possible. Here are some highlights ✨: + +- ♿️ Improved accessibility of `Snackbar` and `TextField` in `@mui/material` (#29782) (#29850) (#29852) @eps1lon. +- 🎉 Added support for `sx` syntax inside `styled()` utility (#29833) @mnajdova. +- 🎉 Added support for more options for `createCssVarsProvider` in `@mui/system` (#29845) (#29857) @hbjORbj. +- And many more 🐛 bug fixes and 📚 improvements. + +### `@mui/material@5.2.2` + +- ​<!-- 14 -->[MenuList] Add component prop (#29882) @Harshikerfuffle +- ​<!-- 13 -->[Snackbar] Interrupt auto-hide on keyboard interaction (#29852) @eps1lon +- ​<!-- 12 -->[Snackbar] Dismiss on Escape press (#29850) @eps1lon +- ​<!-- 06 -->[TextField] Associate accessible name and description by default (#29782) @eps1lon + +### `@mui/joy@5.0.0-alpha.4` + +- ​<!-- 15 -->[Joy] Add `Button` - 1st iteration (#29464) @siriwatknp + +### `@mui/codemod@5.2.1` + +- ​<!-- 28 -->[codemod] Fix alias import for box-sx-prop (#29902) @siriwatknp + +### `@mui/system@5.2.2` + +- ​<!-- 11 -->[system] CSSVarsProvider cleans up `html[style]` when unmounting (#29946) @eps1lon +- ​<!-- 10 -->[system] Add support for `disableTransitionOnChange` in `createCssVarsProvider` (#29857) @hbjORbj +- ​<!-- 09 -->[system] Add support for `enableColorScheme` in `createCssVarsProvider` (#29845) @hbjORbj + +### `@mui/utils@5.2.2` + +- ​<!-- 05 -->[useId] Trade random collisions for collisions on overflow (#29781) @eps1lon +- ​<!-- 04 -->[useIsFocusVisible] Convert to TypeScript (#29779) @eps1lon + +### Docs + +- ​<!-- 24 -->[docs] Fix v5-beta confusing example description (#29932) @oliviertassinari +- ​<!-- 23 -->[docs] Apply the z-index on the right DOM element (#29934) @oliviertassinari +- ​<!-- 22 -->[docs] Improve git diff format (#29935) @oliviertassinari +- ​<!-- 21 -->[docs] Fix typo (#29866) @sinclairity +- ​<!-- 20 -->[docs] Fix key display (#29933) @oliviertassinari +- ​<!-- 19 -->[docs] Fix outdated link to next/link docs (#29937) @radlinskii +- ​<!-- 18 -->[docs] Add how to pass `sx` prop (#29905) @siriwatknp +- ​<!-- 17 -->[docs] Fix typo in notifications @mbrookes +- ​<!-- 16 -->[docs] Black Friday sale notification @mbrookes +- ​<!-- 03 -->[website] Fix canonical links (#29938) @oliviertassinari +- ​<!-- 02 -->[website] Fix SEO issues (#29939) @oliviertassinari +- ​<!-- 01 -->[website] Improvements to the /x product page (#28964) @danilo-leal + +### Core + +- ​<!-- 27 -->[core] Remove dead code (#29940) @oliviertassinari +- ​<!-- 26 -->[core] Move benchmark CI job from AZP to CircleCI (#29894) @eps1lon +- ​<!-- 25 -->[core] Fix PR detection pattern in test_bundle_size_monitor (#29895) @eps1lon +- ​<!-- 08 -->[test] Fix browser tests (#29929) @eps1lon +- ​<!-- 07 -->[test] Reject shorthand properties in style matchers (#29893) @eps1lon + +All contributors of this release in alphabetical order: @danilo-leal, @eps1lon, @Harshikerfuffle, @hbjORbj, @mbrookes, @oliviertassinari, @radlinskii, @sinclairity, @siriwatknp + +## 5.2.1 + +<!-- generated comparing v5.2.0..master --> + +_Nov 25, 2021_ + +A big thanks to the 7 contributors who made this release possible. Here are some highlights ✨: + +This is an early release to fix `export 'useId' (imported as 'React') was not found in 'react'` when bundling code depending on MUI Core. + +- ​<!-- 10 -->[AppBar][docs] Add a fully responsive demo to docs (#29829) @karakib2k18 +- ​<!-- 9 -->[core] Fix PR run detection in test_bundle_size_monitor (#29879) @eps1lon +- ​<!-- 8 -->[core] Move bundle size monitoring to CircleCI (#29876) @eps1lon +- ​<!-- 7 -->[docs] Add keys to Responsive AppBar demo (#29884) @mbrookes +- ​<!-- 6 -->[docs] MUI's 2021 Developer Survey (#29765) @prakhargupta1 +- ​<!-- 5 -->[docs] Smoother image loading UX (#29858) @oliviertassinari +- ​<!-- 4 -->[Select] Fix select display value with React Nodes (#29836) @kegi +- ​<!-- 3 -->[system] Add `experimental_sx` utility (#29833) @mnajdova +- ​<!-- 2 -->[test] Ignore "detected multiple renderers" warning for now (#29854) @eps1lon +- ​<!-- 1 -->[useMediaQuery][utils] Remove usage of React 18 APIs (#29870) @eps1lon + +All contributors of this release in alphabetical order: @eps1lon, @karakib2k18, @kegi, @mbrookes, @mnajdova, @prakhargupta1, @oliviertassinari + +## 5.2.0 + +<!-- generated comparing v5.1.1..master --> + +_Nov 23, 2021_ + +A big thanks to the 18 contributors who made this release possible. Here are some highlights ✨: + +- 🧪 Created another unstyled component: [TabsUnstyled](https://mui.com/components/tabs/#unstyled) (#29597) @mnajdova. +- 🎉 Updated the Material Icons set with the latest changes from Google (#29328) @michaldudak / (#29818) @chao813. + This update adds 200 new icons and tweaks the appearance of many more. + With it, we're getting close to having 2000 icons in our set. +- 🐛 Fixed bugs and improved the infrastructure and documentation 📚. + +### `@mui/material@5.2.0` + +- [IconButton] Remove on hover effect when `disableRipple` is set (#29298) @adamfitzgibbon +- [i18n] Add the amharic language (#29153) @NatiG100 +- [material] Fix types for `variants.style` to accept callbacks (#29610) @mnajdova +- [Popper] Simplify prop types (#29680) @michaldudak +- [Select] Include aria-selected=false when option not selected (#29695) @michaldudak +- [useMediaQuery] Fix crash in Safari < 14 and IE 11 (#29776) @eps1lon +- [useMediaQuery] Ensure no tearing in React 18 (#28491) @eps1lon + +### `@mui/codemod@5.2.0` + +- [codemod] Fix `jss-to-styled` to support multiple withStyles (#29824) @siriwatknp + +### `@mui/icons-material@5.2.0` + +- [icons] Sync new Google Material Icons (#29818) @chao813 +- [icons] Sync recent Material Icons from Google (#29328) @michaldudak + +### `@mui/system@5.2.0` + +- [Box] Fix `sx` prop runtime issue when used as function (#29830) @mnajdova +- [system] Fix `sx` throw error when value is `null` or `undefined` (#29756) @siriwatknp +- [system] Fix minor CssVars issues (#29747) @siriwatknp + +### `@mui/styled-engine@5.2.0` + +- [styled-engine] Fix props inference in styled-engine (#29739) @Janpot + +### `@mui/base@5.0.0-alpha.56` + +- [FormControlUnstyled] `focused` is always false unless explicitly set to `true` @mwilkins91 +- [TabsUnstyled] Introduce new component (#29597) @mnajdova + +### `@mui/lab@5.0.0-alpha.56` + +- [DatePicker][timepicker] Add missing component declarations (#29517) @longzheng +- [Masonry] exports from root package (#29754) @abhinav-22-tech +- [pickers] Widen accepted `luxon` version range (#29761) @eps1lon + +### Docs + +- [blog] MUI X v5 blog post (#29590) @DanailH +- [blog] Polish the Benny Joo joins MUI post (#29697) @oliviertassinari +- [changelog] Explain why we do breaking changes @oliviertassinari +- [core] Update latest issue template for codesandbox CI (#29783) @eps1lon +- [core] Ensure `@mui/core` is an alias for `@mui/base` (#29762) @eps1lon +- [docs] Fix broken Next and Previous links (#29711) @scallaway +- [docs] Add a note that ToggleButton exclusive does not enforce selection (#29812) @mmacu +- [docs] Update the list of supported locales (#29831) @michaldudak +- [docs] Update tooltip doc to better define touch action (#29717) @gnowland +- [website] Standardize the background color from the MUI team photos (#29738) @danilo-leal +- [website] Add Bharat to the About Us Page (#29714) @bharatkashyap +- [website] Add about page entry for jan (#29701) @Janpot +- [website] Adding Prakhar to the about page (#29737) @danilo-leal + +### Core + +- [test] Allow debugging with Chrome and VSCode inspector (#29777) @eps1lon +- [test] Use renderer clock instead of custom useFakeTimers call (#29778) @eps1lon +- [test] Only mock Date in regression tests (#29763) @eps1lon +- [test] Disable nightly integration tests on `next` branch (#29748) @eps1lon +- [test] Allow configuring clock directly from `createRenderer` (#29684) @eps1lon +- [test] Accept backslashes as path separators in test CLI (#29694) @michaldudak +- [utils] Use built-in hook when available for useId (#26489) @eps1lon + +All contributors of this release in alphabetical order: @abhinav-22-tech, @adamfitzgibbon, @bharatkashyap, @chao813, @DanailH, @danilo-leal, @eps1lon, @gnowland, @Janpot, @longzheng, @michaldudak, @mmacu, @mnajdova, @mwilkins91, @NatiG100, @oliviertassinari, @scallaway, @siriwatknp + +## 5.1.1 + +<!-- generated comparing v5.1.0..master --> + +_Nov 16, 2021_ + +A big thanks to the 15 contributors who made this release possible. Here are some highlights ✨: + +- 🛠 Renamed `@mui/core` to `@mui/base` (#29585) @michaldudak. +- And many more 🐛 bug fixes and 📚 improvements. + +### `@mui/material@5.1.1` + +- ​<!-- 34 -->[Breadcrumbs][divider] Replace decimal spacing values with integers and css calc (#29526) @anikcreative +- ​<!-- 10 -->[Select][nativeselect] Add `multiple` class (#29566) @aaronholla +- ​<!-- 09 -->[Popper] Split into PopperUnstyled and Popper (#29488) @michaldudak +- ​<!-- 08 -->[Select] Make it clear that `Select` is not a root component (#29593) @hbjORbj +- ​<!-- 13 -->[l10n] Improved Dutch (nl-NL) locale (#29592) @flipvrijn +- ​<!-- 10 -->[Table] Improve pagination range, use "en dash" over "hyphen" (#29579) @narekmal + +### `@mui/base@5.0.0-alpha.55` + +#### Breaking changes + +- ​<!-- 27 -->[core] Rename mui/core to mui/base (#29585) @michaldudak + + Based on the results of the [poll](https://x.com/michaldudak/status/1452630484706635779) and our internal discussions, we decided to rename the `@mui/core` package to `@mui/base`. The main rationale for this is the fact that we use the term "Core" to refer to the core components product family, the one that includes Material Design components, unstyled components, System utilities, etc. Therefore, @mui/core was effectively a subset of MUI Core. This was confusing. + + The new name better reflects the purpose of the package: it contains unstyled components, hooks, and utilities that serve as a **base** to build on. + + ```diff + -import { useSwitch } from '@mui/core/SwitchUnstyled'; + +import { useSwitch } from '@mui/base/SwitchUnstyled'; + ``` + +### `@mui/lab@5.0.0-alpha.55` + +- ​<!-- 12 -->[LoadingButton] Text variant spacing fixed for both start and end (#29194) @joshua-lawrence +- ​<!-- 11 -->[Masonry] Check if container or child exists to prevent error (#29452) @hbjORbj + +### Docs + +- ​<!-- 25 -->[docs] Correct bundler configuration for using legacy Material UI build (#29146) @petermikitsh +- ​<!-- 24 -->[docs] Fix typo on autocomplete.md (#29570) @netizer +- ​<!-- 23 -->[docs] Fix dark mode on branding pages (#29611) @alexfauquette +- ​<!-- 22 -->[docs] Do not render CSS section in API docs navbar if there are no CSS classes (#29622) @ZeeshanTamboli +- ​<!-- 21 -->[docs] Fix link locale handling (#29624) @oliviertassinari +- ​<!-- 20 -->[docs] Fix Search navigation (#29623) @oliviertassinari +- ​<!-- 19 -->[docs] Fix broken link & update MUI packages explanation (#29583) @siriwatknp +- ​<!-- 18 -->[docs] Do not repeat language snippet in url in Algolia search (#29483) @hbjORbj +- ​<!-- 17 -->[docs] Update `ThemeProvider` API link (#29573) @siriwatknp +- ​<!-- 16 -->[docs] Remove svg logos from the Support page (#29431) @oliviertassinari +- ​<!-- 15 -->[docs] Link UXPin integration (#29422) @oliviertassinari +- ​<!-- 14 -->[docs] Link to the new public roadmap for the design kits (#29433) @oliviertassinari +- ​<!-- 28 -->[docs] correct bundler configuration for using legacy Material UI build (#29146) @petermikitsh +- ​<!-- 01 -->[website] Fix premium plan release date (#29430) @oliviertassinari +- ​<!-- 02 -->[website] Add GitHub icon button to the navbar (#29640) @danilo-leal +- ​<!-- 39 -->[blog] Support many authors in markdown pages (#29633) @m4theushw + +### Core + +- ​<!-- 33 -->[core] Add `experiments` index page (#29582) @siriwatknp +- ​<!-- 32 -->[core] Move s3 bucket ownership to mui-org (#29609) @eps1lon +- ​<!-- 31 -->[core] Improve support request message (#29614) @mnajdova +- ​<!-- 30 -->[core] Use support request GitHub Action (#29594) @mnajdova +- ​<!-- 29 -->[core] Remove unused `getJsxPreview` util (#29586) @ZeeshanTamboli +- ​<!-- 28 -->[core] Use GitHub issue forms (#28038) @oliviertassinari +- ​<!-- 26 -->[core] Add playground (#29423) @oliviertassinari +- ​<!-- 07 -->[test] Correctly identify what the `raf` helper is for (#29683) @eps1lon +- ​<!-- 06 -->[test] Verify a quilted ImageList is created as test title suggests (#29565) @daniel-sachs +- ​<!-- 05 -->[test] Replace `createServerRender` with `createRenderer` (#29503) @eps1lon +- ​<!-- 04 -->[test] Always ignore "useLayoutEffect has no effect on the server"-warning (#29502) @eps1lon +- ​<!-- 03 -->[test] Restore StrictMode by default (#29589) @eps1lon +- ​<!-- 02 -->[test] createPickerRender -> createPickerRenderer (#29575) @eps1lon +- ​<!-- 09 -->[test] Allow experimental CLI to run exact test (#29685) @eps1lon + +All contributors of this release in alphabetical order: @aaronholla, @alexfauquette, @anikcreative, @daniel-sachs, @eps1lon, @flipvrijn, @hbjORbj, @joshua-lawrence, @michaldudak, @mnajdova, @netizer, @oliviertassinari, @petermikitsh, @siriwatknp, @ZeeshanTamboli + +## 5.1.0 + +<!-- generated comparing v5.0.6..master --> + +_Nov 8, 2021_ + +A big thanks to the 33 contributors who made this release possible. Here are some highlights ✨: + +- 🎉 Support custom elements under `ButtonGroup` (#28645) @ZeeshanTamboli +- 🛠 Add support for arrays in the `sx` prop (#29297) @siriwatknp +- And many more 🐛 bug fixes and 📚 improvements. + +### `@mui/material@5.1.0` + +- ​<!-- 68 -->[Autocomplete] Fix `hiddenLabel` prop of `TextField variant={filled}` inside Autocomplete (#29234) @jatinsandilya +- ​<!-- 67 -->[Box] Support generateClassName and defaultClassName (#29347) @siriwatknp +- ​<!-- 66 -->[ButtonGroup] Fix variant outlined always has primary color borders on hover (#29487) @ZeeshanTamboli +- ​<!-- 65 -->[ButtonGroup] Support different elements under ButtonGroup (#28645) @ZeeshanTamboli +- ​<!-- 62 -->[CssBaseline] Add `enableColorScheme` prop so enable using `color-scheme` property to deal with dark mode (#29454) @alexfauquette +- ​<!-- 29 -->[FormControlLabel] Narrow the label type (#29324) @michaldudak +- ​<!-- 28 -->[Grid] Fix usage when columns > 12 (#29196) @tanay123456789 +- ​<!-- 27 -->[InputBase] Do not repeat the same classname (#29353) @hbjORbj +- ​<!-- 30 -->[InputBase] Remove WebkitAppearance from search type (#29383) @nicbarajas +- ​<!-- 25 -->[ListItem] Add missing exports (#29571) @robcaldecott +- ​<!-- 22 -->[Pagination] Allow customization of icons (#29336) @mbeltramin +- ​<!-- 11 -->[TextField] Fix bootstrap, normalize.css, sanitize.css conflicts (#28674) @ChrisClaude +- ​<!-- 10 -->[TextField] Fix invisible wrap within notched inputs (#29088) @DASPRiD +- ​<!-- 09 -->[Tooltip] `open` prop in `componentsProps.popper` can be optional (#29370) @ZeeshanTamboli +- ​<!-- 08 -->[Tooltip] Fix `className` not getting applied from PopperProps (#29023) @ZeeshanTamboli +- ​<!-- 07 -->[useRadioGroup] Convert to TypeScript (#29326) @eps1lon + +### `@mui/system@5.1.0` + +- ​<!-- 21 -->[system] Introduce `mode` to CssVarsProvider (#29418) @siriwatknp +- ​<!-- 20 -->[system] Improve breakpoints resolver function (#29300) @hbjORbj +- ​<!-- 19 -->[system] Add array support for `sx` prop (#29297) @siriwatknp + +### `@mui/codemod@5.1.0` + +- ​<!-- 64 -->[codemod] Add codemod parser flag (#29059) (#29229) @ElonVolo + +### `@mui/lab@5.0.0-alpha.54` + +- ​<!-- 52 -->[DatePicker] Fix disabled/readOnly for view components (#28815) @adamfitzgibbon +- ​<!-- 24 -->[Masonry] Fix crash on unmount when using React 18 (#29358) @eps1lon +- ​<!-- 23 -->[Masonry] Improve height computation and detect changes in `children` (#29351) @hbjORbj + +### `@mui/joy@5.0.0-alpha.0` + +- ​<!-- 28 -->[Joy] Update default theme (#29478) @siriwatknp +- ​<!-- 26 -->[Joy] Export CssVarsProvider with default theme (#29150) @siriwatknp +- ​<!-- 25 -->[Joy] Remove `private` to leverage CodeSandbox (#29280) @siriwatknp + +### Docs + +- ​<!-- 51 -->[docs] Add differences between styled and sx (#28685) @eric-burel +- ​<!-- 50 -->[docs] Track usage of dark mode in Google Analytics (#29419) @oliviertassinari +- ​<!-- 49 -->[docs] Remove create-mui-theme as it is no longer working (#29472) @IPJT +- ​<!-- 48 -->[docs] Fix warnings in AppSearch (#29459) @eps1lon +- ​<!-- 47 -->[docs] Add framework example for ClassNameGenerator (#29453) @siriwatknp +- ​<!-- 46 -->[docs] Fix layout shift when scrolling (#29436) @oliviertassinari +- ​<!-- 45 -->[docs] Fix layout-shift on id='main-content' (#29425) @oliviertassinari +- ​<!-- 44 -->[docs] Remove usage of `process.browser` (#29438) @oliviertassinari +- ​<!-- 43 -->[docs] Add instruction on how to use the child selector API with emotion (#29350) @mnajdova +- ​<!-- 42 -->[docs] Fix small typos (#29424) @oliviertassinari +- ​<!-- 41 -->[docs] Fix TOC highlighting logic (#29435) @oliviertassinari +- ​<!-- 40 -->[docs] Fix about page flags (#29314) @mbrookes +- ​<!-- 39 -->[docs] Fix Box JS docs (#29282) @Pablion +- ​<!-- 38 -->[docs] Update storybook section in migration to v5 docs (#28800) @siriwatknp +- ​<!-- 37 -->[docs] Document how to enable color on dark mode (#29340) @Wimukti +- ​<!-- 36 -->[docs] Display search functionality in all viewports (#28819) @eps1lon +- ​<!-- 35 -->[docs] Query heading for ToC on demand (#29204) @eps1lon +- ​<!-- 34 -->[docs] Add next.js styled-component guide and update links to example (#29118) @Jareechang +- ​<!-- 33 -->[docs] Fix overriding `MuiTextField`'s default props in the migration guide (#29174) @tm1000 +- ​<!-- 32 -->[docs] Fix "clickable" and "deletable" typos (#28702) @jacklaurencegaray +- ​<!-- 31 -->[docs] Update migration-v4 docs for wrong import path (#29042) @busches +- ​<!-- 30 -->[docs] Add GitHub icon change to "Migration from v4 to v5" guide (#29182) @dan-mba +- ​<!-- 06 -->[website] Benny Joo joining MUI (#29499) @mnajdova +- ​<!-- 05 -->[website] Update the `Print export` feature info on the pricing page (#29484) @DanailH +- ​<!-- 04 -->[website] Improve the dev rel role description (#29477) @oliviertassinari +- ​<!-- 03 -->[website] Add customers section on Design Kits and Templates marketing pages (#29168) @danilo-leal +- ​<!-- 02 -->[website] Improvements to the /core product page @danilo-leal +- ​<!-- 01 -->[website] Fix typo on the About Page (#29286) @gssakash + +### Core + +- ​<!-- 63 -->[core] Handle RecordType and FieldType in generatePropDescription.ts (#29467) @flaviendelangle +- ​<!-- 61 -->[core] Convert a named color to lowercase (#29465) @ainatenhi +- ​<!-- 60 -->[core] Allow to reuse functions from `docs:api` (#28828) @m4theushw +- ​<!-- 59 -->[core] Commit new nextjs 12 tsconfig (#29458) @eps1lon +- ​<!-- 58 -->[core] Settle on MUI X for the official name (#29420) @oliviertassinari +- ​<!-- 57 -->[core] Add mui as a npm keyword (#29427) @oliviertassinari +- ​<!-- 56 -->[core] Fix issue template redirection (#29432) @oliviertassinari +- ​<!-- 55 -->[core] Remove unecessary destructuration (#29354) @oliviertassinari +- ​<!-- 54 -->[core] Use cross-env to set env variables in material-icons scripts (#29327) @michaldudak +- ​<!-- 53 -->[core] Don't bump peer dependency ranges on dependency updates (#29303) @eps1lon +- ​<!-- 18 -->[test] Fix browser tests (#29505) @eps1lon +- ​<!-- 69 -->[test] Fix missing act warnings in latest React 18 alpha (#29357) @eps1lon +- ​<!-- 17 -->[test] Replace `createClientRender` with new `createRenderer` API (#29471) @eps1lon +- ​<!-- 16 -->[test] Fix possible "missing act" warning (#29463) @eps1lon +- ​<!-- 15 -->[test] Remove render#baseElement (#29462) @eps1lon +- ​<!-- 14 -->[test] Expose `AbortController` on global (#29360) @eps1lon +- ​<!-- 13 -->[test] Add internal test for uniqe `name` in `Rating` (#29329) @eps1lon +- ​<!-- 12 -->[test] Fix browser tests (#29305) @eps1lon + +All contributors of this release in alphabetical order: @adamfitzgibbon, @ainatenhi, @alexfauquette, @busches, @ChrisClaude, @dan-mba, @DanailH, @danilo-leal, @DASPRiD, @ElonVolo, @eps1lon, @eric-burel, @flaviendelangle, @gssakash, @hbjORbj, @IPJT, @jacklaurencegaray, @Jareechang, @jatinsandilya, @m4theushw, @mbeltramin, @mbrookes, @michaldudak, @mnajdova, @nicbarajas, @oliviertassinari, @Pablion, @robcaldecott, @siriwatknp, @tanay123456789, @tm1000, @Wimukti, @ZeeshanTamboli + +## 5.0.6 + +<!-- generated comparing v5.0.5..master --> + +_Oct 27, 2021_ + +A big thanks to the 4 contributors who made this release possible. Here are some highlights ✨: + +- 🔧 Fix reported TypeScript issues on the `@mui/system` package because some packages were not released + +### `@mui/material@5.0.6` + +- ​<!-- 4 -->[Autocomplete] Fix `clearOnBlur` prop (#29208) @hbjORbj +- ​<!-- 2 -->[Rating] Remove z-index from decimal stars (#29295) @williamhaley + +### `@mui/system@5.0.6` + +- ​<!-- 5 -->[system] Fix various issues reported by using @mui/styled-engine-sc (#29035) @mnajdova +- ​<!-- 1 -->[system] Fix executing server-side Emotion component as function interpolation (#29290) @Andarist + +### Docs + +- ​<!-- 3 -->[blog] Q3 2021 Update (#28970) @oliviertassinari + +All contributors of this release in alphabetical order: @Andarist, @hbjORbj, @oliviertassinari, @williamhaley + +## 5.0.5 + +<!-- generated comparing v5.0.4..master --> + +_Oct 26, 2021_ + +A big thanks to the 19 contributors who made this release possible. Here are some highlights ✨: + +- 🔧 Implement `Masonry` using Flexbox by @hbjORbj. +- 🧪 Add three components to `@mui/base` by @rebeccahongsf and @hbjORbj. + +### `@mui/codemod@5.0.5` + +- ​<!-- 38 -->[codemod] Support new package name in `link-underline-hover` transformer (#29214) @siriwatknp + +### `@mui/base@5.0.0-alpha.52` + +- ​<!-- 39 -->[ClickAwayListener] Move to the core package (#29186) @hbjORbj +- ​<!-- 13 -->[Popper] Move from mui-material to mui-base (#28923) @rebeccahongsf +- ​<!-- 04 -->[TextareaAutosize] Move to the core package (#29148) @hbjORbj + +### `@mui/lab@5.0.0-alpha.52` + +- ​<!-- 16 -->[Masonry] Improve demo styles (#29218) @hbjORbj +- ​<!-- 15 -->[Masonry] Implement Masonry using Flexbox (#28059) @hbjORbj + +### `@mui/icons@5.0.5` + +- ​<!-- 19 -->[icons] Add TipsAndUpdates icon (#29004) @hbjORbj + +### `@mui/material@5.0.5` + +- ​<!-- 40 -->[CardMedia] Apply specified `img` role instead of custom `image` role (#29172) @eps1lon +- ​<!-- 32 -->[CSSBaseline] Remove incorrect @deprecated annotation (#29069) @adamfitzgibbon +- ​<!-- 20 -->[Grid] Support custom columns with nested grid (#28743) @Devesh21700Kumar +- ​<!-- 18 -->[InputBase] Remove wrong theme overriding with MUI's default theme (#29157) @hbjORbj +- ​<!-- 17 -->[LoadingButton] Fix `fullWidth` styling (#28652) @nikitabobers +- ​<!-- 16 -->[Popper] make Popper display:none whenever it's closed (#29233) @adamfitzgibbon +- ​<!-- 14 -->[Menu] Reduce min-height & padding in menu-item with dense property (#29180) @jatinsandilya +- ​<!-- 07 -->[Tab] `iconPosition` prop added in Tab (#28764) @deepanshu2506 +- ​<!-- 03 -->[Tooltip] Correct inconsistent prop precedence (#29132) @michaldudak + +### `@mui/system@5.0.5` + +- ​<!-- 11 -->[system] Allow function type for `sx` prop (#29198) @hbjORbj +- ​<!-- 10 -->[system] Fix various issues reported by using @mui/styled-engine-sc (#29035) @mnajdova +- ​<!-- 09 -->[system] Fix `colorScheme` conflict between application (#29139) @siriwatknp +- ​<!-- 08 -->[system] Add `unstable_createCssVarsProvider` api (#28965) @siriwatknp + +### Documentation + +- ​<!-- 31 -->[docs] Fix path to `DataGrid` CSV export options page (#29220) @DanailH +- ​<!-- 30 -->[docs] Give anonymous components a name (#29189) @eps1lon +- ​<!-- 29 -->[docs] Add deploy context variables (#29195) @siriwatknp +- ​<!-- 28 -->[docs] Add MUI packages explanation (#29073) @siriwatknp +- ​<!-- 27 -->[docs] Fix typo in CSP policy (#29187) @JuliaNeumann +- ​<!-- 26 -->[docs] Dark mode conditional content rendering (#28665) @michal-perlakowski +- ​<!-- 25 -->[docs] Fix ClassNameGenerator introduced version #29177 @siriwatknp +- ​<!-- 24 -->[docs] Add missing `justifyContent` values and update box styling (#29117) @omarmosid +- ​<!-- 23 -->[docs] Make landing page hero section scrollable (#29141) @waxidiotic +- ​<!-- 22 -->[docs] Discourage importing different bundles directly (#29133) @eps1lon +- ​<!-- 21 -->[docs] Update module augmentation reference url (#29064) @gnowland +- ​<!-- 12 -->[pricing] Add tooltip to pricing icon (#28959) @siriwatknp +- ​<!-- 07 -->[Team] Add Alexandre in the about page (#29289) +- ​<!-- 02 -->[website] Fix status label overflow in AdvancedShowcase (#29143) @LorenzHenk +- ​<!-- 01 -->[website] Update legacy logos (#28908) @michaldudak + +### Core + +- ​<!-- 37 -->[core] Order repro methods by preference (#29156) @eps1lon +- ​<!-- 36 -->[core] Remove unnecessary usages of `useEventCallback` (#28910) @NMinhNguyen +- ​<!-- 35 -->[core] add `unstable_ClassNameGenerator` API (#29051) @siriwatknp +- ​<!-- 34 -->[core] Fix issues when using styled-components (#29048) @mnajdova +- ​<!-- 33 -->[core] replace hard-coded classname with classes (#29070) @siriwatknp +- ​<!-- 06 -->[test] Add documentation for visual regression tests (#29154) @eps1lon +- ​<!-- 05 -->[test] Enable "missing act" warnings using new proposal (#29167) @eps1lon + +All contributors of this release in alphabetical order: @adamfitzgibbon, @DanailH, @deepanshu2506, @Devesh21700Kumar, @eps1lon, @gnowland, @hbjORbj, @jatinsandilya, @JuliaNeumann, @LorenzHenk, @michal-perlakowski, @michaldudak, @mnajdova, @nikitabobers, @NMinhNguyen, @omarmosid, @rebeccahongsf, @siriwatknp, @waxidiotic + +## 5.0.4 + +<!-- generated comparing v5.0.3..master --> + +_Oct 14, 2021_ + +A big thanks to the 17 contributors who made this release possible. Here are some highlights ✨: + +- 🧪 Added `UnstyledInput` and `useInput` hook in the the first component in @mui/base package @michaldudak (#28053) +- 🐛 Fixed many bugs and improved the documentation 📚. + +### `@mui/material@5.0.4` + +- ​<!-- 31 -->[Chip] disable ripple only if onDelete is present. (#29034) @mottox2 +- ​<!-- 06 -->[Pagination] Fix clicking on `...` triggering `onChange` with page value `null` (#28884) @ZeeshanTamboli +- ​<!-- 04 -->[Tabs] Alternative way to disable ":first-child is unsafe" error (#28982) @hbjORbj +- ​<!-- 03 -->[Tabs] Fix ":first-child is potentially unsafe" error (#28890) @hbjORbj +- ​<!-- 01 -->[transitions] Mark `children` as required where nullish `children` would crash at runtime (#29028) @eps1lon + +### `@mui/system@5.0.4` + +- ​<!-- 05 -->[system] Update typing for `style` function (#28744) @hbjORbj + +### `@mui/base@5.0.0-alpha.51` + +- ​<!-- 07 -->[InputUnstyled] Create unstyled input and useInput hook (#28053) @michaldudak + +### `@mui/lab@5.0.0-alpha.51` + +- ​<!-- 25 -->[DesktopDatePicker] add Paper props to pass down to Paper component (#28865) @amen-souissi + +### Docs + +- ​<!-- 24 -->[docs] Add JSDoc to `theme.breakpoints` (#29039) @eps1lon +- ​<!-- 23 -->[docs] Rename broken package names in docs pointing to `@mui/material` (#29006) @visualfanatic +- ​<!-- 22 -->[docs] Add troubleshooting guide for unexpected styles (#28907) @mnajdova +- ​<!-- 21 -->[docs] Fix issues reported by ahref (#28986) @mnajdova +- ​<!-- 20 -->[docs] Remove json translations for dropped locales (#28987) @mnajdova +- ​<!-- 19 -->[docs] Fix type signature of renderGroup in Autocomplete (#28876) @tanyabouman +- ​<!-- 18 -->[docs] Minor typo in v4-v5 migration docs (#28995) @kgregory +- ​<!-- 17 -->[docs] Add `mui-image` related project (#28621) @benmneb +- ​<!-- 16 -->[docs] Update Getting Started Templates' Source URIs (#28929) @epodol +- ​<!-- 15 -->[docs] Improve search experience (#28801) @siriwatknp +- ​<!-- 14 -->[docs] Fix demo of the responsive drawer (#28226) @goncalovf +- ​<!-- 13 -->[docs] Fix global theme link demo (#28974) @ZeeshanTamboli +- ​<!-- 12 -->[docs] Update box example to use 'backgroundColor' rather than 'bgColor' (#28958) @Jareechang +- ​<!-- 11 -->[docs] corrected `Box` import for `sx-prop` example (#28873) @phudekar +- ​<!-- 10 -->[docs] Fix footnote ID links in CONTRIBUTING.md (#28849) @officialpiyush +- ​<!-- 09 -->[docs] Fix color & density playground (#28803) @siriwatknp +- ​<!-- 08 -->[docs] Improve visibility of styled engine configuration section in installation guide (#28903) @Jareechang + +### Core + +- ​<!-- 30 -->[core] Prevent yarn cache growing infinitely (#29040) @eps1lon +- ​<!-- 29 -->[core] Update browserslist (#29025) @eps1lon +- ​<!-- 28 -->[core] Update `peerDependencies` to require `latest` instead of `next` (#29007) @eps1lon +- ​<!-- 27 -->[core] Increase memory limit for size:snapshot (#29005) @eps1lon +- ​<!-- 26 -->[core] Init `private` Joy package (#28957) @siriwatknp +- ​<!-- 02 -->[test] Remove a11y snapshot tests (#28887) @eps1lon + +All contributors of this release in alphabetical order: @amen-souissi, @benmneb, @epodol, @eps1lon, @goncalovf, @hbjORbj, @Jareechang, @kgregory, @michaldudak, @mnajdova, @mottox2, @officialpiyush, @phudekar, @siriwatknp, @tanyabouman, @visualfanatic, @ZeeshanTamboli + +## 5.0.3 + +<!-- generated comparing v5.0.2..master --> + +_Oct 7, 2021_ + +A big thanks to the 19 contributors who made this release possible. Here are some highlights ✨: + +- 🧪 Created the first component in @mui/material-next - our v6 prototype package. +- 🐛 Fixed many bugs and improved the documentation 📚. + +### `@mui/material@5.0.3` + +- ​<!-- 10 -->[Stack] Add props & variants types in the theme (#28843) @mnajdova +- ​<!-- 12 -->[InputLabel] Fix condition for applying formControl overrides (#28707) @yevheniiminin +- ​<!-- 05 -->[Tooltip] Allow overriding internal components and their props (#28692) @michaldudak +- ​<!-- 04 -->[transitions] Fix `addEndListener` not being called with the DOM node (#28715) @eps1lon + +### `@mui/codemod@5.0.3` + +- ​<!-- 37 -->[codemod] Fix `optimal-imports` to support v4 and v5-alpha, beta (#28812) @siriwatknp + +### `@mui/system@5.0.3` + +- ​<!-- 09 -->[system] Add padding/margin-block/inline to spacing (#28813) @smmoosavi + +### `@mui/styled-engine-sc@5.0.3` + +- ​<!-- 42 -->Don't allow styled-components APIs on mui styled function (#28807) @hbjORbj + +### `@mui/base@5.0.0-alpha.50` + +- ​<!-- 38 -->[ButtonUnstyled] Don't set redundant role=button (#28488) @michaldudak +- ​<!-- 43 -->[SliderUnstyled] Prevent unknown-prop error when using marks prop (#28868) @hbjORbj + +### `@mui/lab@5.0.0-alpha.50` + +- ​<!-- 11 -->[pickers] Change view even if `onViewChange` is set (#28765) @eps1lon + +### `@mui/material-next@6.0.0-alpha.4` + +- ​<!-- 39 -->[Button-next] Create Button in material-next (#28313) @michaldudak + +### Docs + +- ​<!-- 34 -->[docs] Add alike v4 default button color in migration (#28881) @siriwatknp +- ​<!-- 34 -->[docs] Use PNG instead of SVG for color preview (#28699) @eps1lon +- ​<!-- 33 -->[docs] Use client-side navigation when activating docsearch results (#28750) @eps1lon +- ​<!-- 32 -->[docs] Fluid icon size in icons search (#28747) @eps1lon +- ​<!-- 31 -->[docs] Fix the wrong import in docs grid page (#28863) @taghi-khavari +- ​<!-- 30 -->[docs] Fix typo in Pagination docs (#28864) @ZeeshanTamboli +- ​<!-- 29 -->[docs] Fix 404 links (#28710) @mnajdova +- ​<!-- 28 -->[docs] Fix typo in Mui CSS classname (#28725) @cacpgomes +- ​<!-- 27 -->[docs] Match example to codesandbox demo and update ID link (#28762) @AnilSeervi +- ​<!-- 26 -->[docs] Fix typo in system/box documentation (#28822) @iamsergo +- ​<!-- 25 -->[docs] Use HTML standards for autocomplete attributes (#28827) @epodol +- ​<!-- 24 -->[docs] Improve styled-components integration (#28713) @mnajdova +- ​<!-- 23 -->[docs] Correct Select's menu placement description (#28748) @michaldudak +- ​<!-- 22 -->[docs] AdapterDayJS -> AdapterDayjs (#28770) @veerreshr +- ​<!-- 21 -->[docs] Theme documentation, typo fix (#28805) @saeedseyfi +- ​<!-- 20 -->[docs] Add the last diamond sponsor (#28737) @hbjORbj +- ​<!-- 19 -->[docs] Fix various links in CONTRIBUTING (#28751) @AnilSeervi +- ​<!-- 18 -->[docs] Only add JSS to demos (#28698) @eps1lon +- ​<!-- 17 -->[docs] Update v5 status in release schedule (#28700) @owais635 +- ​<!-- 16 -->[docs] Fix typo in /guides/styled-engine (#28720) @Sharry0 +- ​<!-- 15 -->[docs] Fix typo in chip documentation (#28641) @avranju94 +- ​<!-- 14 -->[docs] Fix versions page (#28682) @mnajdova +- ​<!-- 13 -->[docs] Remove legacy team page (#28646) @mnajdova +- ​<!-- 41 -->[website] add "React" to the hero description (#28830) @danilo-leal +- ​<!-- 03 -->[website] Fix constantly reloading when Russian language is set (#28869) @mnajdova +- ​<!-- 02 -->[website] Compress one avatar image on about us page (#28823) @hbjORbj +- ​<!-- 01 -->[website] Hide 'become a diamond sponsor' box on landing page (#28814) @hbjORbj +- ​<!-- 40 -->[website] Update Benny's profile on about us page (#28816) @hbjORbj + +### Core + +- ​<!-- 36 -->[core] Remove `--exact` from `release:version` (#28840) @siriwatknp +- ​<!-- 35 -->[core] Neglect framer from release flow (#28680) @siriwatknp +- ​<!-- 08 -->[test] Add a test for not allowing styled-components' APIs on mui `styled` function (#28862) @hbjORbj +- ​<!-- 07 -->[test] Fix instances where type tests were only passing due to object being part of ReactNode (#28804) @eps1lon +- ​<!-- 06 -->[test] Move ByMuiTest to test/utils (#28509) @eps1lon + +All contributors of this release in alphabetical order: @AnilSeervi, @avranju94, @cacpgomes, @danilo-leal, @epodol, @eps1lon, @hbjORbj, @iamsergo, @michaldudak, @mnajdova, @owais635, @saeedseyfi, @Sharry0, @siriwatknp, @smmoosavi, @taghi-khavari, @veerreshr, @yevheniiminin, @ZeeshanTamboli + +## 5.0.2 + +<!-- generated comparing v5.0.1..master --> + +_Sep 29, 2021_ + +A big thanks to the 15 contributors who made this release possible. Here are some highlights ✨: + +- 🔧 Improve `jss-to-styled` codemod to use new package names. +- And many more 🐛 bug fixes and 📚 improvements. + +### `@mui/material@5.0.2` + +- ​<!-- 28 -->[Checkbox] Fix form submission with empty value (#28423) @garronej +- ​<!-- 08 -->[Slider] Don't error on minimal changes with readonly value (#28472) @eps1lon +- ​<!-- 07 -->[Switch] Fix style overrides on input (#28576) @praveenkumar-kalidass +- ​<!-- 03 -->[useMediaQuery] Add types for `matchMedia` option and deprecate exported interfaces (#28413) @eps1lon + +### `@mui/codemod@5.0.2` + +- ​<!-- 27 -->[codemod] Add MenuItem v.1.0.0 transform for primaryText property (#28640) @dmitry-yudakov +- ​<!-- 26 -->[codemod] Update the imports in `jss-to-styled` to match the new package names (#28667) @mnajdova + +### `@mui/system@5.0.2` + +- ​<!-- 06 -->[system] Fix types to support theme callbacks on pseudo and nested selectors (#28570) @mnajdova + +### Docs + +- ​<!-- 23 -->[docs] Remove languages: fr, de, ja, es, ru (#28663) @mnajdova +- ​<!-- 22 -->[docs] Improve old doc versions discoverability (#28651) @danilo-leal +- ​<!-- 21 -->[docs] Make the Toggle Button size demo use default icon size (#28656) @danilo-leal +- ​<!-- 20 -->[docs] Uniformize the code's font family (#28582) @oliviertassinari +- ​<!-- 19 -->[docs] Removed duplicate line in date-ranger-picker.md file (#28635) @naveen-bharathi +- ​<!-- 18 -->[docs] Fix title MUI x2 (#28634) @oliviertassinari +- ​<!-- 17 -->[docs] Polish email validation logic (#28255) @kiznick +- ​<!-- 16 -->[docs] Improve migration-v4.md phrasing (#28253) @adamthewebguy +- ​<!-- 15 -->[docs] Fix color in example (#28527) @alexeagleson +- ​<!-- 14 -->[docs] Fix typo in generated class names section (#28549) @fxlemire +- ​<!-- 13 -->[docs] Mention Premium pricing cap (#28581) @oliviertassinari +- ​<!-- 12 -->[docs] Update examples to use latest mui #28565 @siriwatknp +- ​<!-- 11 -->[docs] Push the fixes on Next.js's Link to the examples (#28178) @oliviertassinari +- ​<!-- 10 -->[docs] Fix wrong name for zIndex's property example in /system/ (#28541) @chetrit +- ​<!-- 08 -->[examples] Nextjs Link missing passHref #28588 (#28661) @Brlaney +- ​<!-- 02 -->[website] Iteration on the pricing page (#28406) @danilo-leal +- ​<!-- 01 -->[website] Batch fixes (#28564) @siriwatknp + +### Core + +- ​<!-- 25 -->[core] Improve Renovate groups (#28642) @eps1lon +- ​<!-- 24 -->[core] Batch small changes (#28553) @oliviertassinari +- ​<!-- 05 -->[test] Document where the value for SwitchBase#value comes from (#28638) @eps1lon +- ​<!-- 04 -->[test] Make `seconds` `views` test pass in browsers (#28511) @eps1lon + +All contributors of this release in alphabetical order: @adamthewebguy, @alexeagleson, @Brlaney, @chetrit, @danilo-leal, @dmitry-yudakov, @eps1lon, @fxlemire, @garronej, @kiznick, @mnajdova, @naveen-bharathi, @oliviertassinari, @praveenkumar-kalidass, @siriwatknp + +## 5.0.1 + +<!-- generated comparing v5.0.0..master --> + +_Sep 22, 2021_ + +A big thanks to the 14 contributors who made this release possible. Here are some highlights ✨: + +- 🔎 Improve the search on the documentation. +- 📚 Improve the v4 to v5 migration guide. +- And many more 🐛 bug fixes and 📚 improvements. + +### `@mui/material@5.0.1` + +- ​<!-- 18 -->[Radio] Fix support for number value type (#26772) @sakura90 +- ​<!-- 12 -->[useMediaQuery] Reduce bundle size (#28412) @eps1lon + +### `@mui/codemod@5.0.1` + +- ​<!-- 43 -->[codemod] Cover edge case for theme-spacing #28400 @siriwatknp + +### `@mui/lab@5.0.0-alpha.48` + +- ​<!-- 36 -->[DateTimePicker] Support `seconds` `view` (#25095) @breitembach +- ​<!-- 13 -->[TimePicker] Fire change event when meridiem changes (#26600) @coder-freestyle + +### Docs + +- ​<!-- 35 -->[docs] Fix missing exit animation for transition Poppers (#28506) @eps1lon +- ​<!-- 34 -->[docs] Fix migration v5 docs (#28530) @siriwatknp +- ​<!-- 33 -->[docs] Avoid re-mounting the whole tree when switching theme direction (#28495) @eps1lon +- ​<!-- 32 -->[docs] Fix html compliance (#28429) @oliviertassinari +- ​<!-- 31 -->[docs] Use hyphen-case for CSS properties in /system/properties (#28489) @chetrit +- ​<!-- 30 -->[docs] Update caret position in comments to match npm scope (#28426) @eps1lon +- ​<!-- 29 -->[docs] Fix CONTRIBUTING to point out to master as targeted branch (#28396) @mnajdova +- ​<!-- 28 -->[docs] Update examples to remove 'beta' (#28475) @oliviertassinari +- ​<!-- 27 -->[docs] Fix 404 links to MUI X API (#28176) @oliviertassinari +- ​<!-- 26 -->[docs] Fix broken/incorrect attributes links in Avatar and NativeSelect API pages (#28417) @xenostar +- ​<!-- 25 -->[docs] Explain how `<Alert icon={false} />` behaves (#28348) @nguyenkhanhnam +- ​<!-- 24 -->[docs] Fix typo in /system/the-sx-prop (#28393) @danwoods +- ​<!-- 23 -->[docs] Correct the migration doc (#28391) @michaldudak +- ​<!-- 22 -->[docs] Fix the notification display logic (#28389) @oliviertassinari +- ​<!-- 21 -->[docs] Add notification for v5 @oliviertassinari +- ​<!-- 20 -->[docs] Fix typo (#28521) @valse +- ​<!-- 12 -->[website] Implement algolia redesign (#28252) @hbjORbj +- ​<!-- 11 -->[website] Update data-grid dependencies #28531 @siriwatknp +- ​<!-- 10 -->[website] Cleanup unused files after rebranding (#28505) @siriwatknp +- ​<!-- 09 -->[website] Update /company pages to use marketing website Header and Footer (#28498) @danilo-leal +- ​<!-- 08 -->[website] Optimize images (#28486) @michaldudak +- ​<!-- 07 -->[website] Add components index page (#28485) @siriwatknp +- ​<!-- 06 -->[website] Fix typo (#28478) @oliviertassinari +- ​<!-- 05 -->[website] Fix crash (#28474) @oliviertassinari +- ​<!-- 04 -->[website] Close the open engineering roles (#28428) @oliviertassinari +- ​<!-- 03 -->[website] Fix 40x links (#28401) @mnajdova +- ​<!-- 02 -->[website] Fix SEO issues reported by moz.com (#28402) @mnajdova +- ​<!-- 01 -->[website] Fix production issues (#28384) @siriwatknp + +### Core + +- ​<!-- 44 -->[core] Fix release:changelog base branch (#28533) @mnajdova +- ​<!-- 42 -->[core] Remove code handling JSS components (#28421) @eps1lon +- ​<!-- 41 -->[core] Remove unused dependencies (#28468) @eps1lon +- ​<!-- 40 -->[core] Ensure both docs bundles are analyzeable (#28410) @eps1lon +- ​<!-- 39 -->[core] Switch to Webpack 5 (#28248) @eps1lon +- ​<!-- 38 -->[core] Batch small changes (#28177) @oliviertassinari +- ​<!-- 37 -->[core] Update publish tag to latest (#28382) @mnajdova +- ​<!-- 19 -->[framer] Update @mui/\* dependencies (#28469) @eps1lon +- ​<!-- 17 -->[test] Add custom queries to `screen` (#28507) @eps1lon +- ​<!-- 16 -->[test] Run listChangedFiles against master (#28504) @eps1lon +- ​<!-- 15 -->[test] Increase BrowserStack timeout for Firefox (#28476) @oliviertassinari +- ​<!-- 14 -->[test] Use testing-library alpha when running React 18 tests (#28267) @eps1lon + +All contributors of this release in alphabetical order: @breitembach, @chetrit, @coder-freestyle, @danilo-leal, @danwoods, @eps1lon, @hbjORbj, @michaldudak, @mnajdova, @nguyenkhanhnam, @oliviertassinari, @sakura90, @siriwatknp, @valse, @xenostar + +## 5.0.0 + +<!-- generated comparing v5.0.0-rc.1..next --> + +_Sep 16, 2021_ + +After over 400 days of development and over 40 canary releases, we are excited to introduce [MUI Core v5.0.0](https://mui.com/blog/mui-core-v5/)! + +Some statistics with the released of v5.0.0 compared to the one of v4.0.0: + +- 5,832 new commits +- From 2M downloads/month to 9.5M downloads/month on npm +- From 350k users/month to 700k users/month on the documentation + +A big thanks to the 600+ contributors who made the release possible! + +The 5.0.0 version includes all changes done in the alpha, beta, and rc releases listed below. +These are the changes done from the last release candidate version (5.0.0-rc.1): + +### `@mui/material@5.0.0` + +- ​<!-- 15 -->[Autocomplete] Fix reset value on blur for freeSolo input (#28190) @praveenkumar-kalidass +- ​<!-- 14 -->[ButtonBase] Revert to the pre-unstyled implementation (#28225) @michaldudak +- ​<!-- 13 -->[Checkbox] Fix color proptype typo (#28265) @sydneyjodon-wk +- ​<!-- 40 -->[Tooltip] Ensure user-select CSS property is reverted after touch end (#28372) @tholman + +### `@mui/system@5.0.0` + +- ​<!-- 25 -->[system] Fix missing typings for createSpacing (#28361) @eps1lon + +### `@mui/codemod@5.0.0` + +- ​<!-- 21 -->[codemod] Fix jss-to-styled to support other export class, function etc. (#28321) @jedwards1211 + +### `@mui/lab@5.0.0-alpha.46` + +- ​<!-- 09 -->[DateTimePicker] Change bottom position of AM/PM buttons (#27534) @nikitabobers +- ​<!-- 02 -->[pickers] Add visual regression tests for open views (#28224) @eps1lon + +### Docs + +- ​<!-- 38 -->[blog] Introducing MUI Core v5.0 (#27912) @oliviertassinari +- ​<!-- 08 -->[docs] Fix quotes in font-face literal (#28260) @Aurelain +- ​<!-- 07 -->[docs] Update redirects to X's docs (#28263) @m4theushw +- ​<!-- 06 -->[docs] Change Material UI to MUI in the console (#28270) @mbrookes +- ​<!-- 05 -->[docs] Docs redesign adjustments (#28203) @mnajdova +- ​<!-- 04 -->[docs] How to compose theme in steps (#28246) @goncalovf +- ​<!-- 03 -->[docs] Fix DataGrid demo console warning in Table docs (#28235) @ZeeshanTamboli +- ​<!-- 32 -->[docs] Fix typo in v4 to v5 migration guide (#28353) @zadeviggers +- ​<!-- 17 -->[docs] Fix typo in transition docs (#28312) @tamboliasir1 +- ​<!-- 20 -->[docs] Use https for material-ui & reactcommunity links (#28304) @aghArdeshir +- ​<!-- 22 -->[docs] Add IBM Plex font locally (#28325) @siriwatknp +- ​<!-- 26 -->[docs] Fix failing client-side navigation for /api routes (#28356) @eps1lon +- ​<!-- 29 -->[docs] Update the nav order (#28323) @mbrookes +- ​<!-- 30 -->[docs] Compress images with ImageOptim @oliviertassinari +- ​<!-- 34 -->[docs] Replace remaining unstyled package reference (#28351) @michaldudak +- ​<!-- 35 -->[docs] No import from react-router (#28329) @eps1lon +- ​<!-- 36 -->[website] Refine website before go-live (#28081) @siriwatknp +- ​<!-- 31 -->[website] Update manifest to new logo (#28355) @siriwatknp +- ​<!-- 01 -->[website] Add product-x page (#28106) @siriwatknp +- ​<!-- 24 -->[website] Revert store URL to material-ui.com/store (#28365) @michaldudak +- ​<!-- 33 -->[website] Rename domain to mui.com (#28332) @mnajdova + +### Core + +- ​<!-- 12 -->[core] Replace Material UI with MUI (#28243) @mnajdova +- ​<!-- 11 -->[core] Prepare for v5 stable release (#28240) @mnajdova +- ​<!-- 10 -->[core] Mark lines that needs to be changed with a major release (#28238) @mnajdova +- ​<!-- 18 -->[core] Various updates to what we consider the default branch (#28328) @eps1lon +- ​<!-- 23 -->[core] Remove experimental bundle size tracking page (#28334) @eps1lon +- ​<!-- 27 -->[core] Support release:build with cmd.exe (#28318) @michaldudak +- ​<!-- 28 -->[core] Remove unnecessary titleize warning (#28349) @eps1lon +- ​<!-- 37 -->[core] Batch small fixes (#28381) @oliviertassinari +- ​<!-- 16 -->[test] Recommend yarn t over test:watch (#28254) @eps1lon +- ​<!-- 19 -->[test] Lazily import fixtures (#28239) @eps1lon +- ​<!-- 39 -->[test] Assert on user-select that has the same value across browsers (#28378) @eps1lon + +All contributors of this release in alphabetical order: @aghArdeshir, @Aurelain, @eps1lon, @goncalovf, @jedwards1211, @m4theushw, @mbrookes, @michald +udak, @mnajdova, @nikitabobers, @praveenkumar-kalidass, @siriwatknp, @sydneyjodon-wk, @tamboliasir1, @tholman, @zadeviggers, @ZeeshanTamboli + +## 5.0.0-rc.1 + +<!-- generated comparing v5.0.0-rc.0..next --> + +_Sep 8, 2021_ + +A big thanks to the 13 contributors who made this release possible. Here are some highlights ✨: + +- 📚 Improved the codemod and migration guide for upgrading to v5 +- 🐛 Fixed some bugs and regressions + +### `@mui/material@5.0.0-rc.1` + +- ​<!-- 46 -->[Autocomplete] Fix virtualization regression (#28129) @oliviertassinari +- ​<!-- 45 -->[Button] Use deeper imports from unstyled, correct docs (#28074) @michaldudak +- ​<!-- 44 -->[ButtonBase] Fix ripple persisting on blur (#28186) @michaldudak +- ​<!-- 14 -->[Link] Infer `ref` type from `component` (#28101) @eps1lon +- ​<!-- 11 -->[Popper] Fix bundle size regression (#27910) @oliviertassinari +- ​<!-- 10 -->[Select] Merge `ref` of `Select` and `input` element (#28054) @DouglasPds +- ​<!-- 07 -->[Tabs] Improve error message formatting for invalid `value` (#28172) @eps1lon + +### `@mui/system@5.0.0-rc.1` + +- ​<!-- 47 -->[system] Change type of return value of overridesResolver (#28220) @hbjORbj +- ​<!-- 09 -->[system] Fix zero value condition (#28219) @siriwatknp +- ​<!-- 08 -->[system] Shorten class names in production (#27932) @oliviertassinari + +### `@mui/codemod@5.0.0-rc.1` + +- ​<!-- 42 -->[codemod] Fix various reported issues on `preset-safe` (#28183) @mnajdova + +### `@mui/lab@5.0.0-alpha.46` + +- ​<!-- 43 -->[ClockPicker] Fix to narrow hover area for am hours in am/pm clock (#28207) @eps1lon +- ​<!-- 13 -->[Masonry] Improve the styling on the demos (#27957) @hbjORbj +- ​<!-- 12 -->[MasonryItem] Fix crash on unmount when using React 18 (#28202) @eps1lon + +### Docs + +- ​<!-- 33 -->[docs] Fixes makeStyles migration example (#28213) @RomarQ +- ​<!-- 32 -->[docs] Fix some outdated migration guide (#28222) @siriwatknp +- ​<!-- 31 -->[docs] Update previews (#28223) @eps1lon +- ​<!-- 30 -->[docs] Demo how to use a specific slide direction for Snackbar (#28211) @goncalovf +- ​<!-- 29 -->[docs] Improve docs for creating dark theme (#28104) @mnajdova +- ​<!-- 28 -->[docs] Don't use Material theme in unstyled demos (#28073) @michaldudak +- ​<!-- 27 -->[docs] Fix api doc import example (#28199) @siriwatknp +- ​<!-- 26 -->[docs] Remove demo for re-creating Material UI switches (#28042) @eps1lon +- ​<!-- 25 -->[docs] Improve legibility of CTA on landing page (#28124) @akashshyamdev +- ​<!-- 24 -->[docs] Fix Link outdated default underline prop (#28134) @outofgamut +- ​<!-- 23 -->[docs] Fix branding theme leaking on the templates (#28120) @mnajdova +- ​<!-- 22 -->[docs] Fix wrong package name in codemod (#28118) @aleccaputo +- ​<!-- 21 -->[docs] Cancelled subscription @oliviertassinari +- ​<!-- 20 -->[docs] Remove style duplication (#28087) @oliviertassinari +- ​<!-- 19 -->[docs] Fix migration guide typo (#28113) @paullaros +- ​<!-- 18 -->[docs] Reorder app bar actions (#28089) @mnajdova +- ​<!-- 17 -->[docs] Support Material design theme in MarkdownElement (#28109) @eps1lon +- ​<!-- 16 -->[docs] Improve diamond sponsors in the navigation (#28090) @mnajdova +- ​<!-- 15 -->[docs] Remove unnecessary comma (#28072) @michaldudak +- ​<!-- 04 -->[website] Add new careers page (#28184) @hbjORbj +- ​<!-- 03 -->[website] Disable Next.js font optimization (#28128) @michaldudak +- ​<!-- 02 -->[website] Polish design-kits & templates (#28131) @siriwatknp +- ​<!-- 01 -->[website] Update utm referral params #28040 @siriwatknp + +### Core + +- ​<!-- 41 -->[core] Misc bundle size tracking improvements (#28205) @eps1lon +- ​<!-- 40 -->[core] Ensure code preview is valid JavaScript (#28215) @eps1lon +- ​<!-- 39 -->[core] Create @mui/material-next package (#28200) @michaldudak +- ​<!-- 38 -->[core] Rename directories to match the new package names (#28185) @mnajdova +- ​<!-- 37 -->[core] Remove unused include (#28187) @eps1lon +- ​<!-- 36 -->[core] Fix PR detection mechanism for upstream PRs (#28171) @eps1lon +- ​<!-- 35 -->[core] Simplify ResizeObserver logic (#28037) @oliviertassinari +- ​<!-- 34 -->[core] Include TS modules in rollup import resolution (#28094) @michaldudak +- ​<!-- 06 -->[test] Update test to consider unsuppressed double render logs in React 18 (#28068) @eps1lon +- ​<!-- 05 -->[typescript] Make types of componentsProps consistent (#27499) @michaldudak + +All contributors of this release in alphabetical order: @akashshyamdev, @aleccaputo, @DouglasPds, @eps1lon, @goncalovf, +@hbjORbj, @michaldudak, @mnajdova, @oliviertassinari, @outofgamut, @paullaros, @RomarQ, @siriwatknp + +## 5.0.0-rc.0 + +<!-- generated comparing v5.0.0-beta.5..next --> + +_Sep 1, 2021_ + +A big thanks to the 18 contributors who made this release possible. Here are some highlights ✨: + +- 🎉 Renamed packages to `@mui/*` as part of rebranding the company, following the strategy of expanding the library scope beyond Material Design. For more details about it, check the [GitHub discussion](https://github.com/mui/material-ui/discussions/27803). +- 🛠 Added `mui-replace` codemod for migrating `@material-ui/*` to new packages `@mui/*`. Check out this [codemod detail](https://github.com/mui/material-ui/blob/v5.0.0/packages/mui-codemod/README.md#mui-replace) or head to [migration guide](https://mui.com/material-ui/migration/migration-v4/#preset-safe) +- 🧪 Added new `<Mansory>` component to the lab, [check it out](https://mui.com/components/masonry/). It has been crafted by our first intern, @hbjORbj 👏! + +### `@mui/material@5.0.0-rc.0` + +#### Breaking changes + +- ​<!-- 33 -->[core] Rename packages (#28049) @mnajdova + + replace `@material-ui/*` prefix with `@mui/*`: + + ```bash + @material-ui/system -> @mui/system + @material-ui/styles -> @mui/styles + @material-ui/lab -> @mui/lab + @material-ui/types -> @mui/types + @material-ui/styled-engine -> @mui/styled-engine + @material-ui/styled-engine-sc ->@mui/styled-engine-sc + @material-ui/private-theming -> @mui/private-theming + @material-ui/codemod -> @mui/codemod + ``` + + except these 3 packages that are renamed. + + ```bash + @material-ui/core => @mui/material // represents Material Design components. + @material-ui/icons => @mui/icons-material // represents Material Design icons. + @material-ui/unstyled => @mui/base // fully functional components with minimum styles. + ``` + + > **Note**: `@mui/base` (previously `@material-ui/unstyled`) is not the same as `@material-ui/core`. + + We encourage you to use the [codemod](https://github.com/mui/material-ui/blob/v5.0.0/packages/mui-codemod/README.md#mui-replace) for smooth migration. + +#### Changes + +- ​<!-- 39 -->[Autocomplete] Update warning for `value` prop (#27977) @vedadeepta +- ​<!-- 37 -->[ButtonGroup] Update PropTypes to match augmentable interface (#27944) @aaronlademann-wf +- ​<!-- 36 -->[CardMedia] Add `image` role if `image` prop is specified but no image `component` is specified (#27676) @eps1lon +- ​<!-- 10 -->[InputBase] Fix autofill issue (#28070) @mnajdova +- ​<!-- 08 -->[Tabs] Fix indicator position when tab size changes (ResizeObserver) (#27791) @hbjORbj +- ​<!-- 06 -->[TextareaAutosize] Sync height when the width of the textarea changes (#27840) @hbjORbj +- ​<!-- 05 -->[ToggleButtonGroup] Add "disabled" prop (#27998) @chetas411 +- ​<!-- 34 -->[core] Export types for module augmentation (#28078) @m4theushw + +### `@mui/base@5.0.0-alpha.45` + +- ​<!-- 38 -->[Button] Create ButtonUnstyled and useButton (#27600) @michaldudak + +### `@mui/lab@5.0.0-rc.0` + +- ​<!-- 09 -->[Masonry] Add new component (#27439) @hbjORbj + +### `@mui/codemod@5.0.0-rc.0` + +- ​<!-- 35 -->[codemod] Add `mui-replace` codemod transform (#28060) @siriwatknp + +### Docs + +- ​<!-- 28 -->[docs] Fix preview for multiline JSX attributes (#28092) @eps1lon +- ​<!-- 27 -->[docs] Add a recommendation for hoisting GlobalStyles to static constant (#28088) @mnajdova +- ​<!-- 26 -->[docs] Update toolbar menu to behave closer to default (#28086) @oliviertassinari +- ​<!-- 25 -->[docs] Markdown redesign polish (#27956) @mnajdova +- ​<!-- 24 -->[docs] Fully translated /api/\* pages (#28044) @eps1lon +- ​<!-- 23 -->[docs] Fix matchSorter import path in Autocomplete (#28063) @StefanBRas +- ​<!-- 22 -->[docs] Fix Fab demo overflow on mobile (#28033) @rajzik +- ​<!-- 21 -->[docs] Add notistack example compatible with v5.x.x (#27881) @iamhosseindhv +- ​<!-- 20 -->[docs] Change sign-up template autocomplete to use "new-password" (#28028) @StefanTobler +- ​<!-- 19 -->[docs] Improve the support expectations for developers (#27999) @oliviertassinari +- ​<!-- 18 -->[docs] Don't use nested ternary (#27986) @eps1lon +- ​<!-- 17 -->[docs] Sync redirections from X into Core @oliviertassinari +- ​<!-- 16 -->[docs] Fix typo '.MuiOutinedInput' -> '.MuiOutlinedInput' (#27997) @rsxdalv +- ​<!-- 15 -->[docs] fix floating action button broken demo (#27976) @rajzik +- ​<!-- 14 -->[docs] Update correct variable name (#27960) @bene-we +- ​<!-- 13 -->[docs] Fix Performance typo (#27965) @tdmiller1 +- ​<!-- 12 -->[docs] Add GridExportCSVOptions page to documentation pages (#27951) @flaviendelangle +- ​<!-- 04 -->[website] Add product core page (#27952) @siriwatknp +- ​<!-- 03 -->[website] Make AppBar height and border consistent with nav header (#28085) @michaldudak +- ​<!-- 02 -->[website] Fix typos in the rebranding (#28069) @oliviertassinari +- ​<!-- 01 -->[website] Refine home, pricing and about pages (#27927) @siriwatknp + +### Core + +- ​<!-- 11 -->[eslint-plugin-material-ui] Only require translation of word characters and not API (#28043) @eps1lon +- ​<!-- 32 -->[core] Use lintable pattern for debounced callbacks (#27985) @eps1lon +- ​<!-- 31 -->[core] Remove file-wide disables of `no-use-before-define` (#27984) @eps1lon +- ​<!-- 30 -->[core] Improve `release:changelog` script (#27941) @eps1lon +- ​<!-- 29 -->[core] Enforce curly braces for block statements (#27946) @eps1lon +- ​<!-- 07 -->[test] Disable BrowserStack for PRs (#28041) @eps1lon + +All contributors of this release in alphabetical order: @aaronlademann-wf, @bene-we, @chetas411, @eps1lon, @flaviendelangle, @hbjORbj, @iamhosseindhv, @m4theushw, @michaldudak, @mnajdova, @oliviertassinari, @rajzik, @rsxdalv, @siriwatknp, @StefanBRas, @StefanTobler, @tdmiller1, @vedadeepta + +## 5.0.0-beta.5 + +<!-- generated comparing v5.0.0-beta.4..next --> + +_Aug 24, 2021_ + +A big thanks to the 26 contributors who made this release possible. Here are some highlights ✨: + +- 🐛 Fixed a lot of bugs and regressions to get us closer to the [v5 stable release milestone](https://github.com/mui/material-ui/milestone/44) +- 📚 Improved the docs and the migration guide for upgrading to v5 + +### `@material-ui/core@5.0.0-beta.5` + +#### Breaking changes + +- ​<!-- 36 --> [core] Update `.browserslistrc` file (#27788) @DanailH + + The targets of the default bundle have changed: + + - Chrome 90 (up from 84) + - Edge 91 (up from 85) + - Safari 14 (macOS) (up from 13.1) and 12.4 (iOS) (up from 12.2) + - Opera 76 (up from 70) + +- ​<!-- 43 --> [Autocomplete] Rename Value type to AutocompleteValue (#27804) @michaldudak + + The `useAutocomplete` hook used a type called `Value`. It was a very generic name for a type specific to the `Autocomplete` control, so it was removed to `AutocompleteValue`. + + ```diff + -import { Value } from '@material-ui/core/useAutocomplete'; + +import { AutocompleteValue } from '@material-ui/core/useAutocomplete'; + ``` + +#### Changes + +- ​<!-- 42 --> [AppBar] Fix transparency issue on dark mode (#27281) @will-amaral +- ​<!-- 29 --> Revert "[BottomNavigation] onClick does not fire if tapped while scrolling (#22524)" (#27690) @eps1lon +- ​<!-- 68 --> [Autocomplete] Add verbose warning for defaultValue (#27925) @vedadeepta +- ​<!-- 78 --> [Badge] Add missing classes to exported class object (#27943) @pvdstel +- ​<!-- 41 --> [ButtonGroup] Allow `size` customization via module augmentation (#27834) @aaronlademann-wf +- ​<!-- 67 --> [InputBase] Preserve host state when changing `rows` from undefined to defined (#27683) @eps1lon +- ​<!-- 18 --> [InputLabel] Apply `asterisk` class when `required` (#27738) @alexile +- ​<!-- 26 --> [Select] Fix NativeSelect propagating classes to the DOM element (#27797) @mnajdova +- ​<!-- 28 --> [Stack] Match the customization standard (#27777) @oliviertassinari +- ​<!-- 70 --> [SvgIcon] Apply custom color if defined in the theme (#27923) @eps1lon +- ​<!-- 65 --> [Switch] Add optional `track` slot to SwitchUnstyled (#27916) @michaldudak +- ​<!-- 52 --> [Tooltip] Fix broken arrow position in rtl (#27868) @mnajdova +- ​<!-- 02 --> [transitions] Allow to run Slide into a custom container (#26623) @benny0642 + +### `@material-ui/system@5.0.0-beta.5` + +#### Breaking changes + +- ​<!-- 40 --> [system] Rename `styleProps` to `ownerState` (#27830) @mnajdova + + The change was done in order to better reflect what they are, not what we think they will be used for. + + ```diff + <SomeSlotComponent + - styleProps={propsAndState} + + ownerState={propsAndState} + /> + ``` + +#### Changes + +- ​<!-- 63 --> [system] Remove dependency on `overridesResolver` for the `variants` (#27859) @mnajdova +- ​<!-- 32 --> [system] Forward `classes` prop if no slot specified in the options (#27795) @mnajdova +- ​<!-- 46 --> [system] Fix pseudo class overridden in variants (#27847) @hbjORbj + +### `@material-ui/icons@5.0.0-beta.5` + +- ​<!-- 13 --> [icons] Improve GitHub size (#27740) @oliviertassinari + +### `@material-ui/styled-engine@5.0.0-beta.5` + +- ​<!-- 27 --> [styled-engine] Remove unecessary aliases (#27779) @oliviertassinari +- ​<!-- 14 --> [styled-engine] Drop withComponent support (#27780) @oliviertassinari + +### `@material-ui/unstyled@5.0.0-alpha.44` + +- ​<!-- 07 --> [core] Utilize `CSS.supports` in `SliderUnstyled` component (#27724) @DanailH + +### `@material-ui/lab@5.0.0-alpha.44` + +- ​<!-- 54 --> [DatePicker] Fix click-away logic requiring second click in some cases (#24877) @eps1lon +- ​<!-- 05 --> [lab] Use the public API for module augmentation (#27735) @oliviertassinari +- ​<!-- 25 --> [Timeline] Fix color="inherit" on TimelineDot (#27794) @mnajdova + +### Docs + +- ​<!-- 77 --> [docs] Redesign on markdown page (#27860) @mnajdova +- ​<!-- 76 --> [docs] Split changelog into current and old (#27942) @eps1lon +- ​<!-- 74 --> [docs] Migration, emphasize theme structure change (#27935) @oliviertassinari +- ​<!-- 72 --> [docs] Fix missing `href` for AppDrawerNavItems (#27936) @eps1lon +- ​<!-- 71 --> [docs] Pass window of iframe to framed demos (#27924) @eps1lon +- ​<!-- 69 --> [docs] Simplify Select Chip demo styling (#27864) @LorenzHenk +- ​<!-- 60 --> [docs] Move from Redux to React Context (#27828) @eps1lon +- ​<!-- 58 --> [docs] Correct the useAutocomplete import path (#27805) @michaldudak +- ​<!-- 56 --> [docs] Fix Tooltip flicker when hovering between code icon and demo (#27841) @eps1lon +- ​<!-- 55 --> [docs] Don't log if a request was aborted in ServerRequestDatePicker demo (#27843) @eps1lon +- ​<!-- 53 --> [docs] Fix false-positive useToolbar warning when using the demo toolbar menu (#27842) @eps1lon +- ​<!-- 51 --> [docs] Add missing import (#27850) @nguyenyou +- ​<!-- 50 --> [docs] Fix circular integration demo (#27856) @LorenzHenk +- ​<!-- 48 --> [docs] A few examples is enough (#27874) @mekouar-mehdi +- ​<!-- 47 --> [docs] Improve README.md (#27852) @surajkumar016 +- ​<!-- 45 --> [docs] Fix rtl issue on the demos (#27865) @mnajdova +- ​<!-- 44 --> [docs] Apply the new branding theme and do the AppBar redesign (#27789) @mnajdova +- ​<!-- 39 --> [docs] Improve grammar in 'Align list items' section (#27730) @atorenherrinton +- ​<!-- 38 --> [docs] Make API documentation tables horizontally scrollable (#27787) @jakeanq +- ​<!-- 37 --> [docs] Fix typo on "Customized dialogs" section (#27827) @nomanoff +- ​<!-- 33 --> [docs] Fix Autocomplete country layout shift (#27814) @oliviertassinari +- ​<!-- 23 --> [docs] Improve accessible labels for Card demos (#27675) @eps1lon +- ​<!-- 22 --> [docs] Run in StrictMode by default (#27693) @eps1lon +- ​<!-- 21 --> [docs] Display TypeScript code of demo if requested (#27691) @eps1lon +- ​<!-- 20 --> [docs] Use country image instead of emoji (#27723) @qiweiii +- ​<!-- 17 --> [docs] Zero runtime themeAugmentation documentation (#27706) @eps1lon +- ​<!-- 15 --> [docs] Fix MobileTextStepper example to match description (#27682) @nolastemgarden +- ​<!-- 12 --> [docs] Document the transfer-list limitations (#27783) @oliviertassinari +- ​<!-- 11 --> [docs] Move TypeScript docs in context (#27782) @oliviertassinari +- ​<!-- 10 --> [docs] Prefer linking API source TypeScript (#27781) @oliviertassinari +- ​<!-- 09 --> [docs] Improve the Modal onClose migration (#27775) @oliviertassinari +- ​<!-- 08 --> [docs] Fix outdated styled-engine docs (#27778) @oliviertassinari +- ​<!-- 06 --> [docs] Improve right to left guide (#27713) @mnajdova +- ​<!-- 04 --> [docs] Consistent line break (#27728) @oliviertassinari +- ​<!-- 03 --> [docs] Don't dispatch ignored "reset code variant" actions (#27712) @eps1lon +- ​<!-- 01 --> [docs] Fix sentence to be more grammatically correct (#27733) @atorenherrinton +- ​<!-- 16 --> [examples] Add code sandbox config with node version (#27798) @qiweiii +- ​<!-- 59 --> Revert "[examples] Fix nextjs with styled-components example (#27583)" (#27921) @mnajdova +- ​<!-- 57 --> Revert "[examples] Update create-react-app examples with styled-components to use package aliases (#27591)" (#27917) @mnajdova +- ​<!-- 66 --> [I10n] Add Khmer (kh-KH) locale support (#27915) @teachhay +- ​<!-- 62 --> [website] Add templates & design-kits page (#27811) @siriwatknp +- ​<!-- 61 --> [website] Improve rebranding homepage performance (#27838) @siriwatknp +- ​<!-- 49 --> [website] Honest a11y value proposition (#27826) @eps1lon +- ​<!-- 35 --> [website] Improve homepage rebranding (#27663) @siriwatknp +- ​<!-- 24 --> [website] A few polish (#27741) @oliviertassinari +- ​<!-- 73 --> [website] Polish homepage (#27930) @oliviertassinari + +### Core + +- ​<!-- 64 --> [core] Fix various flip: false regressions (#27920) @mnajdova +- ​<!-- 31 --> [core] Fix typo in code comment (#27818) @hamidreza-nateghi +- ​<!-- 19 --> [core] Fix typos in repository (#27785) @JEONGJIHUN +- ​<!-- 75 --> [test] Current behavior when disabling components variants (#27376) @noviicee +- ​<!-- 30 --> [tests Improve test for checking if classes is forwarded to any DOM element (#27815) @mnajdova +- ​<!-- 34 --> [tests] Replace legacy `describeConformance` with `describeConformanceV5` (#27817) @mnajdova + +All contributors of this release in alphabetical order: @aaronlademann-wf, @alexile, @atorenherrinton, @benny0642, @DanailH, @eps1lon, @hamidreza-nateghi, @hbjORbj, @jakeanq, @JEONGJIHUN, @LorenzHenk, @mekouar-mehdi, @michaldudak, @mnajdova, @nguyenyou, @nolastemgarden, @nomanoff, @noviicee, @oliviertassinari, @pvdstel, @qiweiii, @siriwatknp, @surajkumar016, @teachhay, @vedadeepta, @will-amaral + +## 5.0.0-beta.4 + +<!-- generated comparing v5.0.0-beta.3..next --> + +_Aug 13, 2021_ + +A big thanks to the 19 contributors who made this release possible. Here are some highlights ✨: + +- 🐛 Grid's "auto" behavior has been fixed by @aaronlademann-wf (#27514) +- ♿ An important bug with the keyboard navigation in MenuList was fixed (#27526) @ryancogswell + +### `@material-ui/core@5.0.0-beta.4` + +#### Breaking changes + +- ​<!-- 07 -->[Grid] Fix "auto" behavior to match natural width of its content (#27514) @aaronlademann-wf + +#### Changes + +- ​<!-- 30 -->[ButtonBase] Fix tabIndex type (#27684) @kylegach +- ​<!-- 13 -->[MenuList] Fix text navigation (#27526) @ryancogswell +- ​<!-- 01 -->[l10n] Add Arabic Sudan (ar-SD) locale (#27588) @YassinHussein +- ​<!-- 23 -->[Radio] Fix size prop forwarding with custom icons (#27656) @DouglasPds +- ​<!-- 10 -->[TextField] Password visibility icons ( "visibility" ⇔ "visibility-off" ) should be reversed (#27507) @tonextone +- ​<!-- 18 -->[ToggleButton] Fix handling of color prop (#27635) @oliviertassinari + +### `@material-ui/codemods@5.0.0-beta.4` + +- ​<!-- 20 -->[codemod] Fix filename case sensitive duplicate @oliviertassinari + +### `@material-ui/system@5.0.0-beta.4` + +- ​<!-- 28 -->[StyledEngineProvider] Remove unnecessary emotion cache export (#27680) @garronej +- ​<!-- 11 -->[system] Fix missing filterProps in compose type (#27618) @R-Bower + +### `@material-ui/labs@5.0.0-alpha.42` + +- ​<!-- 27 -->[CalendarPicker] Improve contrast between enabled and disabled days (#27603) @nikitabobers +- ​<!-- 32 -->[PickersDay] Render `children` if specified (#27462) @abriginets +- ​<!-- 05 -->[TreeView] Fix TreeItem label overflow (#27585) @LorenzHenk + +### Docs + +- ​<!-- 36 -->[docs] Update guides for @material-ui/styled-engine-sc installation (#27602) @mnajdova +- ​<!-- 35 -->[docs] Document that @material-ui/styles is not strict mode compatible (#27639) @oliviertassinari +- ​<!-- 34 -->[docs] Link to "Customization of Theme" from relevant theme interfaces (#27689) @eps1lon +- ​<!-- 33 -->[docs] Update CSP page (#27627) @mnajdova +- ​<!-- 29 -->[docs] Reorder and rename "enforce value" ToggleButton demo (#27678) @LorenzHenk +- ​<!-- 12 -->[docs] Fix missing dependency in the DataGrid demo (#27597) @m4theushw +- ​<!-- 04 -->[docs] img should have a src attribute (#27632) @oliviertassinari +- ​<!-- 03 -->[docs] Add badges to Transfer List (#27634) @oliviertassinari +- ​<!-- 02 -->[docs] Recommend the `direct-import` babel plugin over `transform-import` (#27335) @umidbekk +- ​<!-- 37 -->[docs] Remove unused code (#27711) @eps1lon +- ​<!-- 39 -->[docs] Improve virtualization demo (#27340) @vedadeepta +- ​<!-- 31 -->[examples] Include a follow-up on the example (#27620) @matiasherranz +- ​<!-- 26 -->[website] Add about page (#27599) @siriwatknp +- ​<!-- 25 -->[website] Add pricing page (#27598) @siriwatknp + +### Core + +- ​<!-- 16 -->[core] Batch small changes (#27636) @oliviertassinari +- ​<!-- 06 -->[core] Change range strategy to bump (#27652) @oliviertassinari +- ​<!-- 24 -->[core] Fix visual regression example images (#27660) @eps1lon +- ​<!-- 38 -->[core] Remove diff when running yarn docs:dev (#27720) @eps1lon +- ​<!-- 22 -->[core] Remove mocks of require.context in markdown loader (#27406) @eps1lon +- ​<!-- 09 -->[core] Reduce use CSS when Checkbox disableRipple is set (#27568) @oliviertassinari +- ​<!-- 08 -->[test] Add coverage for jss-to-styled prefix from filename (#27522) @eps1lon +- ​<!-- 15 -->[test] Add current behavior for a11y name vs visible name for PickersDay (#27661) @eps1lon +- ​<!-- 17 -->[test] Dodge double logging in dev mode (#27653) @oliviertassinari +- ​<!-- 14 -->[test] Enable skipped test fixed by upstream React fix (#27615) @eps1lon +- ​<!-- 19 -->[theme] Add missed variants in Components interface (#27453) @nikitabobers + +All contributors of this release in alphabetical order: @aaronlademann-wf, @abriginets, @DouglasPds, @eps1lon, @garronej, @kylegach, @LorenzHenk, @m4theushw, @matiasherranz, @mnajdova, @nikitabobers, @oliviertassinari, @R-Bower, @ryancogswell, @siriwatknp, @tonextone, @umidbekk, @vedadeepta, @YassinHussein + +## 5.0.0-beta.3 + +<!-- generated comparing v5.0.0-beta.2..next --> + +_Aug 6, 2021_ + +A big thanks to the 15 contributors who made this release possible. Here are some highlights ✨: + +- ​<!-- 28 -->✨ `jss-to-styled` codemod has been improved to support `createStyles` and `<React.Fragment>` usage (#27578) @mnajdova + +### `@material-ui/core@5.0.0-beta.3` + +- ​<!-- 33 -->[Modal] Restore `overflowX` and `overflowY` styles (#27487) @PCOffline +- ​<!-- 07 -->[Modal] Remove unnecessary check for children.props.tabIndex (#27374) @noviicee +- ​<!-- 14 -->[Select] Fix regression for icon not rotating (#27511) @mnajdova + +### `@material-ui/system@5.0.0-beta.3` + +- ​<!-- 38 -->[system] Added top, left, right and bottom border color CSS properties to system (#27580) @R-Bower + +### `@material-ui/codemod@5.0.0-beta.3` + +- ​<!-- 28 -->[codemod] Add support for `createStyles` usage in `jss-to-styled` (#27578) @mnajdova +- ​<!-- 11 -->[codemod] Fix `jss-to-styled` PREFIX generation on Windows (#27491) @mnajdova +- ​<!-- 39 -->[codemod] Fix `jss-to-styled` codemod to handle React.Fragment as root (#27495) @mnajdova + +### `@material-ui/unstyled@5.0.0-alpha.42` + +- ​<!-- 13 -->[FormControl] Create FormControlUnstyled (#27240) @michaldudak +- ​<!-- 23 -->[Autocomplete] Move useAutocomplete to the Unstyled package (#27485) @michaldudak + +### Docs + +- ​<!-- 40 -->[docs] Fix layout shift when opening hash anchor (#27619) @oliviertassinari +- ​<!-- 35 -->[docs] Add TypeScript guide for the `sx` prop (#27417) @mnajdova +- ​<!-- 32 -->[docs] Hardcode listed colors in /customization/color/#playground (#27446) @eps1lon +- ​<!-- 31 -->[docs] Bring back Select#onChange signature API (#27443) @eps1lon +- ​<!-- 27 -->[docs] Remove backticks in the title (#27567) @oliviertassinari +- ​<!-- 26 -->[docs] Fix 404 links (#27566) @oliviertassinari +- ​<!-- 25 -->[docs] Use the same h2 for the customization demos (#27569) @oliviertassinari +- ​<!-- 22 -->[docs] Fix syntax error in v5 migration `styled` api example (#27518) @kimbaudi +- ​<!-- 21 -->[docs] Improve SSR configuration with emotion (#27496) @frandiox +- ​<!-- 19 -->[docs] Change "pseudo-classes" to "state classes" (#27570) @michaldudak +- ​<!-- 18 -->[docs] Add StackBlitz edit demo integration (#27391) @sulco +- ​<!-- 12 -->[docs] Remove unnecessary generic argument (#27516) @bezpalko +- ​<!-- 08 -->[docs] Add customization demos (#27411) @siriwatknp +- ​<!-- 04 -->[docs] Restore initial descriptionRegExp logic (#27436) @oliviertassinari +- ​<!-- 03 -->[docs] Polish jss-to-styled docs (#27457) @oliviertassinari +- ​<!-- 34 -->[examples] Fix nextjs with styled-components example (#27583) @mnajdova +- ​<!-- 29 -->[examples] Update create-react-app examples with styled-components to use package aliases (#27591) @mnajdova +- ​<!-- 09 -->[examples] Improve integration examples with Next.js (#27331) @Harshita-Kanal +- ​<!-- 37 -->[website] Add spicefactory as gold sponsor @oliviertassinari +- ​<!-- 30 -->[website] Homepage rebranding (#27488) @siriwatknp +- ​<!-- 24 -->[website] Add Flavien to team and about pages (#27575) @flaviendelangle +- ​<!-- 17 -->[website] Add Ryan to Community contributors for Stack Overflow contributions (#27529) @ryancogswell +- ​<!-- 02 -->[website] Add references section to home (#27444) @siriwatknp + +### Core + +- ​<!-- 20 -->[core] rebaseWhen=auto does not seem to work (#27565) @oliviertassinari +- ​<!-- 10 -->[core] Improve instructions for the @material-ui/styles migration (#27466) @mnajdova +- ​<!-- 06 -->[core] Batch small changes (#27435) @oliviertassinari +- ​<!-- 01 -->[core] Receive patch and minor dependency updates (#27455) @eps1lon +- ​<!-- 16 -->[test] Update coverage to include all @material-ui packages (#27521) @eps1lon +- ​<!-- 15 -->[test] Lint codemod tests (#27519) @eps1lon +- ​<!-- 05 -->[test] Allow tests to run for 6s before timeout (#27456) @oliviertassinari + +All contributors of this release in alphabetical order: @bezpalko, @eps1lon, @flaviendelangle, @frandiox, @Harshita-Kanal, @kimbaudi, @michaldudak, @mnajdova, @noviicee, @oliviertassinari, @PCOffline, @R-Bower, @ryancogswell, @siriwatknp, @sulco + +## 5.0.0-beta.2 + +<!-- generated comparing v5.0.0-beta.1..next --> + +_Jul 26, 2021_ + +A big thanks to the 20 contributors who made this release possible. Here are some highlights ✨: + +- ✨ We introduced new codemod for converting JSS styles to emotion (#27292) @siriwatknp + It should help adoption of v5, by making possible the removal of JSS sooner. + +- 🐛 The majority of other changes in this release were bug fixes, test utilities and docs. + +### `@material-ui/core@5.0.0-beta.2` + +- ​<!-- 54 -->[Autocomplete] Explain how the loading prop works (#27416) @michaldudak +- ​<!-- 49 -->[Autocomplete] Update input value when the input changes (#27313) @turtleseason +- ​<!-- 09 -->[Autocomplete] Popper is not closing when the Autocomplete is disabled (#27312) @Goodiec +- ​<!-- 42 -->[Checkbox] Skip default hover styles with `disableRipple` (#27314) @faan234 +- ​<!-- 50 -->[Dialog] Fix override paper styles (#27423) @newsiberian +- ​<!-- 17 -->[Grid] Remove width prop for rowSpacing (#27326) @sashkopavlenko +- ​<!-- 33 -->[Input] Merge `componentsProps` correctly (#27371) @mnajdova +- ​<!-- 55 -->[Pagination] Fixed usePagination requires @emotion in development mode (#27348) @ruppysuppy +- ​<!-- 07 -->[Pagination] Fix :hover effect on previous/next button (#27304) @Aubrey-Li +- ​<!-- 03 -->[Popper] Consistent timing of popper instance creation (#27233) @eps1lon +- ​<!-- 45 -->[Select] Add `SelectChangeEvent` for accurate types for event in onChange prop (#27370) @eps1lon +- ​<!-- 18 -->[Tabs] Use theme transition duration for the Tab animation (#27303) @florianbepunkt +- ​<!-- 35 -->[TextField] Allow custom colors in FormLabel (#27337) @oliviertassinari +- ​<!-- 14 -->[TextField] Fix name of componentsProps (#27338) @oliviertassinari +- ​<!-- 04 -->[transitions] Make sure inline styles used for transition values if declared (#27140) @eps1lon + +### `@material-ui/codemod@5.0.0-beta.2` + +- ​<!-- 57 -->[codemod] Add `optimal-imports` for v5 (#27404) @mnajdova +- ​<!-- 48 -->[codemod] Add jss to emotion codemod (#27292) @siriwatknp +- ​<!-- 34 -->[codemod] Fix running codemod CLI on Windows (#27395) @michaldudak +- ​<!-- 32 -->[codemod] Fix published version (#27384) @eps1lon +- ​<!-- 10 -->[codemod] Improve README.md (#27257) @mnajdova + +### `@material-ui/unstyled@5.0.0-alpha.41` + +- ​<!-- 36 -->[NoSsr] Move NoSsr to the Unstyled package (#27356) @michaldudak + +### `@material-ui/utils@5.0.0-beta.1` + +- ​<!-- 43 -->[utils] Convert createChainedFunction to TypeScript (#27386) @eps1lon + +### `@material-ui/system@5.0.0-beta.2` + +- ​<!-- 39 -->[system] Compute display name of `styled` component if `name` isn't set (#27401) @eps1lon +- ​<!-- 08 -->[system] Adds missing type for `shouldForwardProp` (#27310) @KLubin1 + +### `@material-ui/lab@5.0.0-alpha.41` + +- ​<!-- 58 -->[pickers] Only accept dates from adapters in min/max props (#27392) @eps1lon +- ​<!-- 15 -->[pickers] Fallback to today if all possible dates are disabled (#27294) @eps1lon +- ​<!-- 06 -->[pickers] Minify error when LocalizationProvider is missing (#27295) @eps1lon +- ​<!-- 01 -->[pickers] Fix Fade animation behavior change (#27283) @oliviertassinari + +### Docs + +- ​<!-- 56 -->[docs] Display Popper arrow correctly (#27339) @Patil2099 +- ​<!-- 53 -->[docs] Focus pickers introduction on Material UI (#27394) @eps1lon +- ​<!-- 51 -->[docs] Fix wrong import path in @material-ui/styles section (#27427) @WeldonTan +- ​<!-- 47 -->[docs] Update color imports (#27321) @siriwatknp +- ​<!-- 38 -->[docs] Sync params of callbacks between types and JSDoc description (#27366) @eps1lon +- ​<!-- 37 -->[docs] Add migration note for synthetic native events in onChange (#27368) @eps1lon +- ​<!-- 31 -->[docs] Improve unstyled docs (#27382) @oliviertassinari +- ​<!-- 30 -->[docs] Update `Transitions` page (#27319) @siriwatknp +- ​<!-- 29 -->[docs] Add Unstyled components docs page (#27158) @michaldudak +- ​<!-- 28 -->[docs] Fix app bar regression (#27373) @mnajdova +- ​<!-- 27 -->[docs] Update migration guide to have a section on nested classes (#27354) @mnajdova +- ​<!-- 25 -->[docs] Convert App\* components to emotion (#27150) @eps1lon +- ​<!-- 23 -->[docs] Fix duplicate "Theme" header (#27353) @eps1lon +- ​<!-- 22 -->[docs] Remove horizontal scrollbar in MiniDrawer (#27055) @AlvesJorge +- ​<!-- 21 -->[docs] Add `makeStyles` explanation in troubleshooting (#27322) @siriwatknp +- ​<!-- 20 -->[docs] Fix ExpansionPanel migration notes (#27352) @eps1lon +- ​<!-- 19 -->[docs] Transpile markdown files (#27349) @eps1lon +- ​<!-- 12 -->[docs] Fix typo in the word typography (#27329) @tudi2d +- ​<!-- 11 -->[docs] Use actual symbol of kilogram (#27332) @getsnoopy +- ​<!-- 02 -->[docs] Make migration doc easier to follow (#26948) @siriwatknp +- ​<!-- 46 -->[examples] Cleanup `gatsby` examples (#27375) @mnajdova +- ​<!-- 41 -->[examples] Create nextjs example using styled-components (#27088) @hboylan +- ​<!-- 26 -->[examples] Update gatsby example to use custom plugin (#27357) @mnajdova + +### Core + +- ​<!-- 24 -->[core] Remove obsolete styles documentation (#27350) @eps1lon +- ​<!-- 13 -->[core] Fix GitHub language detection (#27298) @oliviertassinari +- ​<!-- 44 -->[test] Include coverage report of browser tests (#27389) @eps1lon +- ​<!-- 40 -->[test] Add current behavior for getDisplayName with context components (#27402) @eps1lon +- ​<!-- 05 -->[test] Enable skipped picker tests (#27268) @eps1lon +- ​<!-- 52 -->[website] Add hero section to homepage (#27364) @siriwatknp + +All contributors of this release in alphabetical order: @AlvesJorge, @Aubrey-Li, @eps1lon, @faan234, @florianbepunkt, @g +etsnoopy, @Goodiec, @hboylan, @KLubin1, @michaldudak, @mnajdova, @newsiberian, @oliviertassinari, @Patil2099, @ruppysupp +y, @sashkopavlenko, @siriwatknp, @tudi2d, @turtleseason, @WeldonTan + +## 5.0.0-beta.1 + +<!-- generated comparing v5.0.0-beta.0..next --> + +_Jul 14, 2021_ + +A big thanks to the 17 contributors who made this release possible. Here are some highlights ✨: + +- ✨ We have introduced a new unstyled component: the Switch (#26688) @michaldudak + You can find two new versions of the Switch. A component without any styles: [`SwitchUnstyled`](https://mui.com/components/switches/#unstyled), and a hook: [`useSwitch`](https://mui.com/components/switches/#useswitch-hook). + + <a href="https://mui.com/components/switches/#unstyled"><img width="832" alt="switch" src="https://user-images.githubusercontent.com/3165635/125192249-236f8a80-e247-11eb-9df9-17d476379a32.png"></a> + + You can follow our progress at https://github.com/mui/base-ui/issues/10. + +- 💄 We have updated the default `info` `success` `warning` color to be more accessible (#26817) @siriwatknp. + You can find the new [default values](https://mui.com/material-ui/customization/palette/#default-values) in the documentation. + + <a href="https://mui.com/customization/palette/#default-values"><img width="780" alt="colors" src="https://user-images.githubusercontent.com/3165635/125192657-4864fd00-e249-11eb-9dc1-44857b25b3b8.png"></a> + +### `@material-ui/core@5.0.0-beta.1` + +#### Breaking changes + +- [Fab] Remove no longer necessary span wrapper (#27112) @siriwatknp +- [ToggleButton] Remove no longer necessary span wrapper (#27111) @siriwatknp + +#### Changes + +- [Autocomplete] Add componentsProps (#27183) @michal-perlakowski +- [Avatar] Fix support for crossOrigin (#27013) @ShirasawaSama +- [ButtonBase] Correct `disableRipple` API description (#27187) @michaldudak +- [ButtonGroup] Add color palette types (#27215) @ShirasawaSama +- [SwitchBase] Bring back `checked` and mark as deprecated (#27047) @siriwatknp +- [TextField] Remove redundant useFormControl implementation (#27197) @michaldudak +- [theme] Add missing MuiRating types to components.d.ts (#27086) @rajzik +- [theme] Remove `createV4Spacing` from `adaptV4Theme` (#27072) @siriwatknp +- [theme] Update default `info` `success` `warning` color (#26817) @siriwatknp +- [ToggleButton] Add color palette types (#27046) @ShirasawaSama +- [ToggleButton] Fix the api page (#27164) @oliviertassinari + +### `@material-ui/unstyled@5.0.0-alpha.40` + +- [Switch] Create SwitchUnstyled and useSwitch (#26688) @michaldudak + +### `@material-ui/codemod@5.0.0-beta.1` + +- [codemod] Add v5 important migration (#27032) @siriwatknp +- [codemod] Fix v5 codemods on Windows (#27254) @michaldudak + +### `@material-ui/system@5.0.0-beta.1` + +- [Box] Add breakpoint value support to maxWidth prop (#26984) @ansh-saini + +### `@material-ui/lab@5.0.0-alpha.40` + +- [CalendarPicker] Fix slide transition regression (#27273) @eps1lon +- [CalendarPicker] Use transition components from core instead of a custom implementation (#27043) @eps1lon +- [pickers] Fix default value of text keys (#26990) @oliviertassinari +- [TimePicker] Change default minutes and seconds to zero (#27037) @michal-perlakowski + +### Docs + +- [blog] Q2 2021 Update (#27089) @oliviertassinari +- [docs] Add information that the label prop in FormControlLabel is now @michal-perlakowski +- [docs] Don't crash page if an Ad crashes (#27178) @eps1lon +- [docs] Fix alt description of movavi backer @oliviertassinari +- [docs] Fix import source of hidden component (#27116) @vimutti77 +- [docs] Fix layout regression (#27272) @oliviertassinari +- [docs] Fix syntax error in /styles/api markdown (#27176) @sahil-blulabs +- [docs] Fix the link for the sx props page (#27202) @mnajdova +- [docs] Fix theme context example code (#27053) @moshfeu +- [docs] Fix typo in CONTRIBUTING.md (#27218) Ayush Dubey +- [docs] Fix typos (#27074) @michaldudak +- [docs] Improve nav semantics (#27138) @eps1lon +- [docs] Migrate Ad\* components to emotion (#27159) @mnajdova +- [docs] Migrate rest of the docs to emotion (#27184) @mnajdova +- [docs] Move versions from \_app PageContext to page-specific context (#27078) @eps1lon +- [docs] Only bundle one version of the demos in production (#27020) @eps1lon +- [docs] Reduce layout shift on landing page (#27251) @eps1lon +- [docs] Remove Ethical Ads (#27173) @mbrookes +- [docs] Remove unused fs polyfill (#27069) @eps1lon +- [docs] Remove usage of `url` package (#27151) @eps1lon +- [docs] Replace react-text-mask with react-imask in integration example (#27071) @michal-perlakowski +- [docs] Sort the size in a more logical order (#27186) @oliviertassinari +- [docs] Use actual link to paperbase (#27063) @eps1lon +- [docs] Use custom markdown loader for landing page (#27065) @eps1lon +- [docs] Use Webpack 5 (#27077) @eps1lon +- [examples] Fix CDN warning (#27229) @oliviertassinari +- [examples] Remove `StyledEngineProvider` as JSS is not used (#27133) @mnajdova +- [examples] Remove forgotten StyledEngineProvider (#27163) @oliviertassinari + +### Core + +- [core] Batch small changes (#26970) @oliviertassinari +- [core] Configure Renovate (#27003) @renovate[bot] +- [core] Migrate remaining mentions of Dependabot to Renovate (#27118) @eps1lon +- [core] Run yarn deduplicate on Renovate updates (#27115) @eps1lon +- [test] Document broken React 18 behavior of Autocomplete (#27242) @eps1lon +- [test] Increase BS timeout to 6min (#27179) @oliviertassinari +- [test] Migrate regressions to emotion (#27010) @vicasas +- [test] Narrow down React 18 compat issues (#27134) @eps1lon +- [test] Remove StyledEngineProvider usage from regressions and e2e test @mnajdova +- [test] Run React 18 integration tests with new createRoot API (#26672) @eps1lon +- [test] Update tests with latest state of StrictMode compatibility (#27042) @eps1lon +- [test] Use DOM events instead of mocked, partial events (#27198) @eps1lon +- [website] Open 4 new roles (#27123) @oliviertassinari +- [blog] Danilo Leal joins Material UI (#27231) @oliviertassinari + +All contributors of this release in alphabetical order: @eps1lon, @mbrookes, @michal-perlakowski, @michaldudak, @mnajdova, @moshfeu, @oliviertassinari, @rajzik, @renovate[bot], @sahil-blulabs, @ShirasawaSama, @siriwatknp, @vimutti77 + +## 5.0.0-beta.0 + +<!-- generated comparing v5.0.0-alpha.38..next --> + +_Jul 01, 2021_ + +A big thanks to the 13 contributors who made this release possible. Here are some highlights ✨: + +- 🎉 This is the first beta release of v5! A huge thanks to everyone who helped to make this happen! We're targeting the 1st of September for a stable release, and will use the next two months to polish v5, and ease the migration from v4. You can follow [the v5 stable milestone](https://github.com/mui/material-ui/milestone/44) for more details. We now encourage any new projects to start on v5. +- 🚀 We have completed all the planned breaking changes. +- ⚒️ We added the codemod CLI to simplify migration to v5 (#26941) @eps1lon. You can find it at [`@material-ui/codemod`](https://github.com/mui/material-ui/tree/HEAD/packages/mui-codemod). +- 🐛 The majority of other changes in this release were bug fixes, test utilities and docs. + +### `@material-ui/core@5.0.0-beta.0` + +#### Breaking changes + +- [Tabs] Remove unnecessary wrapper from Tab (#26926) @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 + <button class="MuiTab-root"> + - <span class="MuiTab-wrapper"> + {icon} + {label} + - </span> + </button> + ``` + +- [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 + <button class="MuiBottomNavigationAction-root"> + - <span class="MuiBottomNavigationAction-wrapper"> + {icon} + <span class="MuiBottomNavigationAction-label"> + {label} + </span> + - </span> + </button> + ``` + +#### Changes + +- ​<!-- 19 -->[Box] Fix TypeScript error on maxWidth prop (#26859) @ansh-saini +- ​<!-- 04 -->[Dialog] Automatically label by its DialogTitle (#26814) @eps1lon +- ​<!-- 32 -->[Hidden] Bring back and mark as deprecated (#26908) @siriwatknp +- ​<!-- 53 -->[List] Add button runtime deprecation warning (#26743) @siriwatknp +- ​<!-- 03 -->[Modal] Type BackdropProps according to styled version (#26836) @eps1lon +- ​<!-- 21 -->[Radio] Fix `defaultValue` to match the other value types (#26945) @oliviertassinari +- ​<!-- 48 -->[Stepper] Add completed to global pseudo-classes (#26953) @michal-perlakowski +- ​<!-- 25 -->[Stepper] Fix support for no connectors (#26874) @varandasi +- ​<!-- 20 -->[TextField] Prevent `hiddenLabel` from spreading to DOM (#26864) @siriwatknp +- ​<!-- 18 -->[TextField] Fix label disappearing when focusing a button (#26933) @michal-perlakowski + +### `@material-ui/codemod@5.0.0-beta.0` + +- ​<!-- 37 -->[codemod] Add CLI (#26941) @eps1lon + +### @material-ui/icons@5.0.0-beta.0 + +- ​<!-- 29 -->[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 + <DatePicker + label="Helper text example" + value={value} + onChange={onChange} + renderInput={(params) => ( + - <TextField {...params} /> + + <TextField {...params} helperText={params?.inputProps?.placeholder} /> + )} + > + ``` + +#### Changes + +- ​<!-- 12 -->[lab] Fix missing dependency on unstyled (#26937) @fishyFrogFace +- ​<!-- 50 -->[pickers] Consider TDate in ToolbarComponent types (#27035) @michal-perlakowski + +### `@material-ui/system@5.0.0-beta.0` + +- ​<!-- 14 -->[system] Support array overridesResolver (#26824) @siriwatknp + +### Docs + +- ​<!-- 49 -->[docs] Add notes to Table demo about stableSort (#27025) @CarlosGomez-dev +- ​<!-- 47 -->[docs] Add gold sponsor (#26968) @oliviertassinari +- ​<!-- 42 -->[docs] Update unstyled demos to not depend on `@material-ui/core` (#26869) @mnajdova +- ​<!-- 41 -->[docs] Fix demo paths in windows (#27004) @eps1lon +- ​<!-- 40 -->[docs] Export all locales (#27002) @eps1lon +- ​<!-- 38 -->[docs] Misc CONTRIBUTING.md changes (#26925) @eps1lon +- ​<!-- 35 -->[docs] Fix /components/hidden merge conflict (#26997) @eps1lon +- ​<!-- 26 -->[docs] Fix 404 links (#26963) @oliviertassinari +- ​<!-- 24 -->[docs] Remove link that points to v4 blog post (#26960) @steveafrost +- ​<!-- 16 -->[docs] Use custom Webpack loader for markdown (#26774) @eps1lon +- ​<!-- 11 -->[docs] Fix 301 links (#26942) @oliviertassinari +- ​<!-- 01 -->[docs] Add page for the `sx` prop (#26769) @mnajdova +- ​<!-- 52 -->[docs] pre-fill issue when a demo crashes (#27034) @eps1lon +- ​<!-- 54 -->[docs] Move styled page under system (#26818) + +### Core + +- ​<!-- 46 -->[core] Inline rollup-plugin-size-snapshot (#26986) @eps1lon +- ​<!-- 43 -->[core] Remove unused props clone (#26992) @oliviertassinari +- ​<!-- 36 -->[core] Fix tests on Windows (#26931) @michaldudak +- ​<!-- 31 -->[core] Fix merge conflict between #26954 and #26874 @oliviertassinari +- ​<!-- 22 -->[core] Upgrade issues-helper to v2 (#26955) @michal-perlakowski +- ​<!-- 05 -->[core] Fix merge conflict (#26928) @eps1lon +- ​<!-- 45 -->[test] Convert HiddenCSS tests to testing-library (#27019) @eps1lon +- ​<!-- 44 -->[test] Convert NativeSelectInput tests to testing-library (#26952) @eps1lon +- ​<!-- 39 -->[test] Add a default mount implementation to conformance tests (#26949) @eps1lon +- ​<!-- 28 -->[test] Update tests to pass react@next (#26967) @eps1lon +- ​<!-- 27 -->[test] Add types to describeConformanceV5 (#26954) @eps1lon +- ​<!-- 17 -->[test] Use createPickerMount where appropriate (#26951) @eps1lon +- ​<!-- 15 -->[test] Convert SwipeableDrawer tests to testing-library (#26916) @eps1lon +- ​<!-- 13 -->[test] Convert Menu tests to testing-library (#26915) @eps1lon +- ​<!-- 10 -->[test] Convert Popover tests to testing-library (#26913) @eps1lon +- ​<!-- 08 -->[test] Convert Modal tests to testing-library (#26912) @eps1lon +- ​<!-- 07 -->[test] Make remaining testing-library tests StrictMode compatible (#26924) @eps1lon +- ​<!-- 51 -->[test] Only allow wrapping enzyme mount not creating (#27018) @eps1lon +- ​<!-- 06 -->[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 + +<!-- generated comparing v5.0.0-alpha.37..next --> + +_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). + + <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> + +- 💡 `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 + + <a href="https://mui.com/components/links/"><img width="543" alt="" src="https://user-images.githubusercontent.com/3165635/123097983-ef1b6200-d430-11eb-97da-b491fba5df49.png"></a> + +### `@material-ui/core@5.0.0-alpha.38` + +#### Breaking changes + +- ​<!-- 05 -->[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 + <Menu + + anchorOrigin={{ + + vertical: 'top', + + horizontal: 'left', + + }} + ``` + + - The `MenuItem` component inherits the `ButtonBase` component instead of `ListItem`. The class names related to "MuiListItem-\*" are removed and theming `ListItem` is no longer affecting `MenuItem`. + + ```diff + -<li className="MuiButtonBase-root MuiMenuItem-root MuiListItem-root"> + +<li className="MuiButtonBase-root MuiMenuItem-root"> + ``` + + - The prop `listItemClasses` was removed, you can use `classes` instead. + + ```diff + -<MenuItem listItemClasses={{...}}> + +<MenuItem classes={{...}}> + ``` + +- ​<!-- 09 -->[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, + }, + }, + }); + ``` + +- ​<!-- 10 -->[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 + - <IconButton> + + <IconButton size="large"> + ``` + +- ​<!-- 08 -->[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/). + + <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> + + You can reduce the density of the slider, closer to v4 with the [`size="small"` prop](https://mui.com/components/slider/#sizes). + + <a href="https://mui.com/components/slider/#sizes"><img width="330" alt="" src="https://user-images.githubusercontent.com/3165635/123076549-8aa0d880-d419-11eb-8835-06cd2b21b2d3.png" style="margin: auto"></a> + +- ​<!-- 14 -->[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 + <button class="MuiIconButton-root"> + - <span class="MuiIconButton-label"> + <svg /> + - </span> + </button> + ``` + +- ​<!-- 19 -->[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 + +- ​<!-- 33 -->[Alert] Add support for custom colors (#26831) @varandasi +- ​<!-- 32 -->[Button] Fix loading text invisible when disabled (#26857) @DanielBretzigheimer +- ​<!-- 43 -->[ButtonBase] Consider as a link with a custom component and `to` prop (#26576) @shadab14meb346 +- ​<!-- 17 -->[ButtonBase] Derive state on render instead of in layout effects (#26762) @eps1lon +- ​<!-- 37 --> [Drawer] Fix incorrect z-index (#26791) @michal-perlakowski +- ​<!-- 28 -->[Drawer] Remove incorrect transition handler props (#26835) @eps1lon +- ​<!-- 01 -->[Link] Improve accessibility support (#26145) @ahmed-28 +- ​<!-- 41 -->[Modal] Fix calculating scrollbar size when using custom scrollbar (#26816) @michal-perlakowski +- ​<!-- 29 -->[Rating] Make input ids less predictable (#26493) @eps1lon +- ​<!-- 27 -->[Stepper] Add componentsProps.label to StepLabel (#26807) @michal-perlakowski +- ​<!-- 36 -->[Tabs] Show error when Tab has display: none (#26783) @michal-perlakowski +- ​<!-- 46 -->[theme] Add base color palette type to components (#26697) @siriwatknp + +### `@material-ui/system@5.0.0-alpha.38` + +#### Breaking Changes + +- ​<!-- 35 -->[system] Normalize api for `createBox` (#26820) @mnajdova + + ```diff + import { createBox } from '@material-ui/system'; + + -const styled = createBox(defaultTheme); + +const styled = createBox({ defaultTheme }); + ``` + +#### Changes + +- ​<!-- 12 -->[system] Add ThemeProvider component (#26787) @mnajdova + +### Docs + +- ​<!-- 45 -->[docs] Fix misspelling of the word Typography (#26898) @dmrqx +- ​<!-- 42 -->[docs] Instruct users to install @material-ui/icons with the next tag (#26873) @michal-perlakowski +- ​<!-- 26 -->[docs] Sync translations (#26828) @l10nbot +- ​<!-- 25 -->[docs] Improve grammar of autocomplete/autofill section (#26798) @dijonkitchen +- ​<!-- 18 -->[docs] Explain "inherited props" better in the props table (#26778) @eps1lon +- ​<!-- 16 -->[docs] Fix documentation for upgrading to v5 (#26812) @tungdt-90 +- ​<!-- 13 -->[docs] Improve notification color (#26796) @mnajdova +- ​<!-- 11 -->[docs] Fix various a11y issues with /customization/color (#26757) @eps1lon +- ​<!-- 04 -->[docs] Move custom theme to frame (#26744) @siriwatknp +- ​<!-- 02 -->[docs] Fix small PT typo fix: inciar -> iniciar (#26775) @brunocavalcante +- ​<!-- 03 -->[I10n] Add Chinese (Hong Kong) (zh-HK) locale (#26637) @kshuiroy +- ​<!-- 44 -->[l10n] Add sinhalese (siLK) locale (#26875) @pavinduLakshan +- ​<!-- 39 -->[examples] Rename Next.js TypeScript theme from tsx to ts (#26862) @Izhaki + +### Core + +- ​<!-- 38 -->[test] Fix Drawer test API @oliviertassinari +- ​<!-- 34 -->[test] Adjust expected useAutocomplete error messages for React 18 (#26858) @eps1lon +- ​<!-- 30 -->[test] Convert Drawer tests to testing-library (#26837) @eps1lon +- ​<!-- 23 -->[test] Convert remaining enzyme tests to testing-library (#26832) @eps1lon +- ​<!-- 22 -->[test] Ignore ReactDOM.hydrate deprecation warnings (#26815) @eps1lon +- ​<!-- 06 -->[test] Reduce flakiness (#26761) @eps1lon +- ​<!-- 07 -->[useId] Reduce likelyhood of collisions (#26758) @eps1lon +- ​<!-- 31 -->yarn deduplicate @oliviertassinari +- ​<!-- 21 -->Fix running framer's prettier under pwsh (#26819) @michaldudak +- ​<!-- 40 -->[core] Update babel-plugin-optimize-clsx (#26861) @oliviertassinari +- ​<!-- 24 -->[core] Assume no document.all at runtime (#26821) @eps1lon +- ​<!-- 20 -->[core] Remove dependency on `@material-ui/private-theming` (#26793) @mnajdova +- ​<!-- 15 -->[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 + +<!-- generated comparing v5.0.0-alpha.36..next --> + +_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 + <Grid container spacing={{ xs: 2, md: 3 }} columns={{ xs: 1, sm: 2, md: 3 }}> + <Grid item xs={2} sm={4} md={4} /> + <Grid item xs={2} sm={4} md={4} /> + <Grid item xs={2} sm={4} md={4} /> + </Grid> + ``` + + 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 + +- ​<!-- 10 -->[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 + <button class="MuiButton-root"> + - <span class="MuiButton-label"> + children + - </span> + </button> + ``` + +#### Changes + +- ​<!-- 08 -->[Button] Add missing color type (#26593) @sakura90 +- ​<!-- 07 -->[Grid] Add responsive direction and spacing props (#26590) @likitarai1 +- ​<!-- 05 -->[List] Add ListItemButton export to index (#26667) @chadmuro +- ​<!-- 09 -->[theme] Fix missing exported Breakpoints types (#26684) @robphoenix + +### `@material-ui/system@5.0.0-alpha.37` + +#### Breaking changes + +- ​<!-- 26 -->[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 + +- ​<!-- 16 -->[system] Add useThemeProps & useTheme hooks (#26649) @mnajdova +- ​<!-- 15 -->[system] Add color manipulators (#26668) @mnajdova +- ​<!-- 06 -->[system] Fix support of custom shape in createTheme (#26673) @varandasi + +### `@material-ui/unstyled@5.0.0-alpha.37` + +- ​<!-- 04 -->[Slider] Improve TS definition (#26642) @mnajdova +- ​<!-- 21 -->[FocusTrap] Capture nodeToRestore via relatedTarget (#26696) @eps1lon + +### `@material-ui/icons@5.0.0-alpha.37` + +- ​<!-- 03 -->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` + +- ​<!-- 29 -->[core] Remove unused useKeyDown (#26765) @eps1lon +- ​<!-- 28 -->[DateTimePicker] Fix not visible selected tab icon (#26624) @nikitabobers + +### Docs + +- ​<!-- 20 -->[blog] Michał Dudak joins Material UI (#26700) @oliviertassinari +- ​<!-- 27 -->[docs] Migrate onepirate premium template to emotion part2 (#26707) @vicasas +- ​<!-- 24 -->[docs] Fix TextField demo layout (#26710) @vicasas +- ​<!-- 19 -->[docs] Improve Paperbase demo (#26711) @oliviertassinari +- ​<!-- 17 -->[docs] Migrate onepirate premium template to emotion part1 (#26671) @vicasas +- ​<!-- 14 -->[docs] Migrate paperbase premium template to emotion (#26658) @vicasas +- ​<!-- 25 -->[List] Fix demo to have correct semantic (#26742) @siriwatknp + +### Core + +- ​<!-- 23 -->[core] Monitore size of key system modules (#26712) @oliviertassinari +- ​<!-- 22 -->[core] Batch small changes (#26738) @oliviertassinari +- ​<!-- 18 -->[core] Batch small changes (#26628) @oliviertassinari +- ​<!-- 13 -->[test] Ignore ReactDOM.render deprecation warning (#26683) @eps1lon +- ​<!-- 12 -->[test] Run e2e test with React 18 on a schedule (#26690) @eps1lon +- ​<!-- 11 -->[test] Count profiler renders not passive effects (#26678) @eps1lon +- ​<!-- 02 -->[test] Bundling fixtures should not override source build with published build (#26657) @eps1lon +- ​<!-- 01 -->[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 + +<!-- generated comparing v5.0.0-alpha.35..next --> + +_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 `<ListItem button />` 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. + <img width="549" alt="grid spacing demo" src="https://user-images.githubusercontent.com/3165635/121089288-383fa500-c7e7-11eb-8c43-53457b7430f1.png"> + + 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 + +- ​<!-- 10 -->[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 + <AppBar enableColorOnDark /> + ``` + +- ​<!-- 13 -->[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'; + ``` + +- ​<!-- 03 -->[SwitchBase] Replace IconButton with ButtonBase (#26460) @siriwatknp +- ​<!-- 25 -->[theme] Improve default `primary`, `secondary` and `error` theme palette (#26555) @siriwatknp + +#### Changes + +- ​<!-- 17 -->[Box] Fix module 'clsx' not found in system (#26553) @coder-freestyle +- ​<!-- 07 -->[Box] Fix runtime error when using styled-components without ThemeProvider (#26548) @mnajdova +- ​<!-- 27 -->[Radio][checkbox] Don't forward `color` to DOM elements (#26625) @siriwatknp +- ​<!-- 01 -->[Dialog] Flatten DialogTitle DOM structure, remove `disableTypography` (#26323) @eps1lon +- ​<!-- 31 -->[Grid] Add rowSpacing and columnSpacing props (#26559) @likitarai1 +- ​<!-- 34 -->[List] extract button from ListItem to ListItemButton (#26446) @siriwatknp +- ​<!-- 23 -->[Popover] Fix PaperProps.ref breaking positioning (#26560) @vedadeepta +- ​<!-- 19 -->[Rating] onChangeActive shouldn't be fired on blur/focus (#26584) @coder-freestyle +- ​<!-- 11 -->[Select] Fix custom font size centering arrow (#26570) @sarahannnicholson +- ​<!-- 06 -->[styled] Convert implicit styleProps to explicit (#26461) @mnajdova@siriwatknp +- ​<!-- 08 -->[Tabs] Fix RTL indicator (#26470) @siriwatknp +- ​<!-- 02 -->[Tabs] Fix arrow rotation in vertical & RTL (#26527) @siriwatknp +- ​<!-- 20 -->[TextField] Fix support for custom `size` prop value (#26585) @coder-freestyle +- ​<!-- 04 -->[Tooltip] Finish exiting once started (#26535) @eps1lon + +### `@material-ui/icons@5.0.0-alpha.36` + +#### Breaking changes + +- ​<!-- 15 -->[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 + +- ​<!-- 29 -->[pickers] Remove `openPickerIcon` prop in favor of `components.OpenPickerIcon` (#26223) @vedadeepta + + ```diff + <DateTimePicker + components={{ + LeftArrowIcon: AlarmIcon, + RightArrowIcon: SnoozeIcon, + + OpenPickerIcon: ClockIcon, + }} + - openPickerIcon={<ClockIcon />} + > + ``` + +### `@material-ui/system@5.0.0-alpha.36` + +- ​<!-- 18 -->[system] Add createTheme util (#26490) @mnajdova + +### Docs + +- ​<!-- 28 -->[docs] Migrate templates to emotion (#26604) @vicasas +- ​<!-- 26 -->[docs] Remove custom primary & secondary color (#26541) @siriwatknp +- ​<!-- 24 -->[docs] Don't escape prop descriptions for markdown table context (#26579) @eps1lon +- ​<!-- 22 -->[docs] Prepare for data grid auto-generated docs (#26477) @m4theushw +- ​<!-- 21 -->[docs] Fix typo sx !== xs (#26596) @onpaws +- ​<!-- 16 -->[docs] Multiple select demos moving when selecting values (#26539) @itsnorbertkalacska +- ​<!-- 14 -->[docs] Improve migration guide for `@material-ui/styles` (#26552) @mnajdova +- ​<!-- 12 -->[docs] `Rating` `value` is nullable in `onChange` (#26542) @sakura90 +- ​<!-- 30 -->[example] Remove the dependency on @material-ui/styles (#26567) @garfunkelvila + +### Core + +- ​<!-- 33 -->[core] Ignore latest prettier run in git-blame @eps1lon +- ​<!-- 32 -->[core] Format @eps1lon +- ​<!-- 05 -->[test] Add bundle fixtures (#23166) @eps1lon +- ​<!-- 09 -->[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 + +<!-- generated comparing v5.0.0-alpha.34..next --> + +_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/v5.0.0/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 <div className={classes.root} /> + } + + // In the root of your app + function App(props) { + - return <Component />; + + return <ThemeProvider theme={theme}><Component {...props} /></ThemeProvider>; + } + ``` + +- [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 <div className={clsx(className, classes.root)} {...other} /> + })(({ theme }) => ({ root: { background: theme.palette.primary.main }})); + + function App() { + - return <MyComponent />; + + return <ThemeProvider theme={defaultTheme}><MyComponent /></ThemeProvider>; + } + ``` + +- [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, for example 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_ + +<!-- generated comparing v5.0.0-alpha.33..next --> + +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 + +- ​<!-- 47 -->[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 + -<NativeSelect classes={{ root: 'class1', select: 'class2', selectMenu: 'class3' }} /> + +<NativeSelect classes={{ select: 'class1 class2 class3' }} /> + ``` + + **TablePagination** + + Move the custom class on `input` to `select`. The `input` key is being applied on another element. + + ```diff + <TablePagination + - classes={{ input: 'foo' }} + + classes={{ select: 'foo' }} + /> + ``` + +- ​<!-- 45 -->[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'; + ``` + +- ​<!-- 39 -->[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': { + ``` + +- ​<!-- 31 -->[Radio] Make color primary default (#26180) @vicasas +- ​<!-- 03 -->[Switch] Make color primary default (#26182) @vicasas +- ​<!-- 10 -->[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 ( + <DateTimePicker + open={open} + onClose={() => setOpen(false)} + onOpen={() => setOpen(true)} + {...props} + /> + ); + } + ``` + +- ​<!-- 63 -->[Autocomplete] Rename getOptionSelected to isOptionEqualToValue (#26173) @m4theushw + + ```diff + <Autocomplete + - getOptionSelected={(option, value) => 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 + +- ​<!-- 61 -->[TextField] Fix hiddenLabel type of FilledInput (#26290) @siriwatknp +- ​<!-- 54 -->[TextField] Fix classes forward to InputBase (#26231) @arpitBhalla +- ​<!-- 17 -->[Autocomplete] Fix missing 'createOption' in AutocompleteCloseReason type (#26197) @Gautam-Arora24 +- ​<!-- 30 -->[Autocomplete] Reduce CSS specificity by 1 (#26238) @Gautam-Arora24 +- ​<!-- 07 -->[ButtonBase] Omit aria-disabled if not disabled (#26189) @Gautam-Arora24 +- ​<!-- 18 -->[colors] Fix A inconsistencies (#26196) @oliviertassinari +- ​<!-- 08 -->[examples] Fix dynamic global styles & global styles leak in the ssr examples (#26177) @mnajdova +- ​<!-- 57 -->[Slider] Fix support for non primary colors (#26285) @davidfdriscoll +- ​<!-- 56 -->[Slider] Center value label for disabled slider (#26257) @davidfdriscoll +- ​<!-- 19 -->[styled-engine] Fix styled-components not supporting empty style (#26098) @ruppysuppy +- ​<!-- 21 -->[styles] Fix overrides type issues (#26228) @mnajdova +- ​<!-- 64 -->[Container] Fix support for custom breakpoints (#26328) @alanszp + +### `@material-ui/lab@5.0.0-alpha.34` + +- ​<!-- 68 -->[pickers] Migrate TimePickerToolbar to emotion (#26274) @siriwatknp +- ​<!-- 67 -->[pickers] Migrate DatePickerToolbar to emotion (#26292) @siriwatknp +- ​<!-- 66 -->[DateTimePicker] Migrate DateTimePickerTabs and Toolbar to emotion (#26327) @siriwatknp +- ​<!-- 33 -->[DatePicker] Migrate PickersYear to emotion (#25949) @siriwatknp +- ​<!-- 35 -->[DateRangePicker] Migrate PickersToolbarText to emotion (#25983) @siriwatknp +- ​<!-- 46 -->[pickers] Migrate StaticWrapper to emotion (#26275) @siriwatknp +- ​<!-- 58 -->[pickers] Migrate Clock to emotion (#26278) @siriwatknp +- ​<!-- 43 -->[pickers] Migrate PickersToolbar to emotion (#26273) @siriwatknp +- ​<!-- 42 -->[pickers] Migrate ClockNumber to emotion (#26058) @siriwatknp +- ​<!-- 41 -->[pickers] Migrate ClockPointer to emotion (#26057) @siriwatknp +- ​<!-- 32 -->[pickers] Migrate PickersMonth to emotion (#26021) @siriwatknp +- ​<!-- 26 -->[pickers] Migrate MonthPicker to emotion (#26025) @siriwatknp +- ​<!-- 25 -->[pickers] Migrate PickersDay to emotion (#25995) @siriwatknp +- ​<!-- 06 -->[pickers] Migrate PickersToolbarButton to emotion (#25989) @siriwatknp + +### `@material-ui/icons@5.0.0-alpha.34` + +- ​<!-- 52 -->[icons] Remove extraneous React.Fragment (#26308) @eps1lon +- ​<!-- 50 -->[icons] Synchronize icons (#26302) @eps1lon + + New DriveFileMove icon and its variants + +### Docs + +- ​<!-- 16 -->[NProgressBar] Fix invalid ARIA and HTML (#26234) @eps1lon +- ​<!-- 65 -->[docs] Simplify demos slider (#26324) @oliviertassinari +- ​<!-- 48 -->[docs] Use transpiled icons directly (#26268) @eps1lon +- ​<!-- 44 -->[docs] Remove dependency on withStyles from @material-ui/core/styles (#26269) @mnajdova +- ​<!-- 40 -->[docs] Add Jalali date picker demo (#26243) @smmoosavi +- ​<!-- 37 -->[docs] Remove last dependencies on `makeStyles` from `@material-ui/core/styles` (#26246) @mnajdova +- ​<!-- 29 -->[docs] Polish the pickers demo (#26094) @oliviertassinari +- ​<!-- 28 -->[docs] Fix broken overrides link on API pages (#26244) @mnajdova +- ​<!-- 27 -->[docs] Improve documentation for Buttons (#26184) @arpitBhalla +- ​<!-- 24 -->[docs] Emphasize on props for screen readers (#26222) @atisheyJain03 +- ​<!-- 23 -->[docs] Link third-party routing in Bottom navigation (#26190) @arpitBhalla +- ​<!-- 22 -->[docs] Migrate Select, Progress demos to emotion (#26178) @mnajdova +- ​<!-- 20 -->[docs] Add accessibility section to Badges (#26009) @likitarai1 +- ​<!-- 15 -->[docs] Migrate Popper, Drawer demos to emotion (#26183) @mnajdova +- ​<!-- 12 -->[docs] Use public next/router events API (#26233) @eps1lon +- ​<!-- 11 -->[docs] Remove remnants Hidden component (#26191) @vicasas +- ​<!-- 09 -->[docs] Ensure TreeView demos don't overflow demo container (#26161) @eps1lon +- ​<!-- 05 -->[docs] Fix a typo in the import statement of LocalizationProvider (#26226) @huyenltnguyen +- ​<!-- 04 -->[docs] Improve react-admin coverage in the showcase (#26169) @fzaninotto +- ​<!-- 02 -->[docs] Fix Workbox that are causing infinite loading of site (#26193) @arpitBhalla + +### Core + +- ​<!-- 60 -->[core] Skip sx prop in internal components (#26235) @mnajdova +- ​<!-- 59 -->[core] Remove `withStyles` dependencies from `@material-ui/core/styles` (#26277) @mnajdova +- ​<!-- 55 -->[core] Include human readable target in the BrowserStack build (#26322) @eps1lon +- ​<!-- 53 -->[core] Fix NotchedOutlineProps type (#26305) @gnowland +- ​<!-- 51 -->[core] Add file for git-blame --ignore-revs-file (#26295) @eps1lon +- ​<!-- 49 -->[core] Ensure component class keys aren't missing (#25754) @eps1lon +- ​<!-- 38 -->[core] Drop support for blocking mode (#26262) @eps1lon +- ​<!-- 36 -->[core] Don't download monorepo packages (#26261) @eps1lon +- ​<!-- 14 -->[core] Batch small changes (#26199) @oliviertassinari +- ​<!-- 13 -->[core] Extract classes descriptions from TypeScript (#25933) @eps1lon +- ​<!-- 34 -->[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 + +- ​<!-- 09 -->[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 }) => <div className={classes.root} />); + + function MyOtherComponent(props) { + const ref = React.useRef(); + - return <MyComponent innerRef={ref} />; + + return <MyComponent ref={ref} />; + } + ``` + + **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 }) => <div>{props.theme.direction}</div>); + + function MyOtherComponent(props) { + const ref = React.useRef(); + - return <MyComponent innerRef={ref} />; + + return <MyComponent ref={ref} />; + } + ``` + +- ​<!-- 10 -->[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({ + ``` + +- ​<!-- 74 -->[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'; + ``` + +- ​<!-- 20 -->[Box] Remove the `clone` prop (#26031) @m4theushw + + Its behavior can be obtained using the `sx` prop. + + ```diff + -<Box sx={{ border: '1px dashed grey' }} clone> + - <Button>Save</Button> + -</Box> + +<Button sx={{ border: '1px dashed grey' }}>Save</Button> + ``` + +- ​<!-- 51 -->[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 + -<Box sx={{ border: '1px dashed grey' }}> + - {(props) => <Button {...props}>Save</Button>} + -</Box> + +<Button sx={{ border: '1px dashed grey' }}>Save</Button> + ``` + + ```diff + -<Box sx={{ border: '1px dashed grey' }}> + - {(props) => <button {...props}>Save</button>} + -</Box> + +<Box component="button" sx={{ border: '1px dashed grey' }}>Save</Box> + ``` + +- ​<!-- 25 -->[Checkbox] Make color="primary" default (#26002) @vicasas + + This better matches the Material Design guidelines. + + ```diff + -<Checkbox /> + +<Checkbox color="secondary /> + ``` + +- ​<!-- 30 -->[Select] Remove `labelWidth` prop (#26026) @m4theushw + + The `label` prop now fulfills the same purpose, using CSS layout instead of JavaScript measurement to render the gap in the outlined. The TextField already handles it by default. + + ```diff + -<Select variant="outlined" labelWidth={20} /> + +<Select label="Gender" /> + ``` + +- ​<!-- 50 -->[core] Remove `styled` JSS utility from `@material-ui/core/styles` (#26101) @mnajdova + + The `styled` **JSS** utility is no longer exported from `@material-ui/core/styles`. You can use `@material-ui/styles/styled` 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/styles` instead. + + ```diff + -import { styled } from '@material-ui/core/styles'; + +import { styled } from '@material-ui/styles'; + +import { createTheme, ThemeProvider } from '@material-ui/core/styles'; + + +const theme = createTheme(); + const MyComponent = styled('div')(({ theme }) => ({ background: theme.palette.primary.main })); + + function App(props) { + - return <MyComponent />; + + return <ThemeProvider theme={theme}><MyComponent {...props} /></ThemeProvider>; + } + ``` + + For new components, you can instead use the `experimentalStyled()` helper powered by emotion/sc. + + ```jsx + import { experimentalStyled as styled } from '@material-ui/core/styles'; + ``` + +- ​<!-- 63 -->[Hidden] Remove component (#26135) @m4theushw + + Removed in favor of using the `sx` prop or the `useMediaQuery` hook. + + Use the `sx` prop to replace `implementation="css"`: + + ```diff + -<Hidden implementation="css" xlUp><Paper /></Hidden> + -<Hidden implementation="css" xlUp><button /></Hidden> + +<Paper sx={{ display: { xl: 'none', xs: 'block' } }} /> + +<Box component="button" sx={{ display: { xl: 'none', xs: 'block' } }} /> + ``` + + ```diff + -<Hidden implementation="css" mdDown><Paper /></Hidden> + -<Hidden implementation="css" mdDown><button /></Hidden> + +<Paper sx={{ display: { xs: 'none', md: 'block' } }} /> + +<Box component="button" sx={{ display: { xs: 'none', md: 'block' } }} /> + ``` + + Use the `useMediaQuery` hook to replace `implementation="js"`: + + ```diff + -<Hidden implementation="js" xlUp><Paper /></Hidden> + +const hidden = useMediaQuery(theme => theme.breakpoints.up('xl')); + +return hidden ? null : <Paper />; + ``` + +- ​<!-- 64 -->[withWidth] Remove API (#26136) @m4theushw + + Removed in favor of the `useMediaQuery` hook. You can reproduce the same functionality creating a custom hook as described [here](https://mui.com/components/use-media-query/#migrating-from-withwidth). + +- ​<!-- 75 -->[Autocomplete] Rename values of the reason argument (#26172) @m4theushw + + Rename the values of the reason argument in `onChange` and `onClose` for consistency: + + 1. `create-option` to `createOption` + 2. `select-option` to `selectOption` + 3. `remove-option` to `removeOption` + +- ​<!-- 28 -->[core] Remove `withTheme` from `@material-ui/core` (#26051) @mnajdova + + The `withTheme` utility has been removed from the `@material-ui/core/styles` package. You can use the `@material-ui/styles/withTheme` 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` from `@material-ui/core/styles` instead. + + ```diff + import * as React from 'react'; + -import { withTheme } from '@material-ui/core/styles'; + +import { withTheme } from '@material-ui/styles'; + +import { createTheme, ThemeProvider } from '@material-ui/core/styles'; + + +const theme = createTheme(); + const MyComponent = withTheme(({ theme }) => <div>{props.theme.direction}</div>); + + function App(props) { + - return <MyComponent />; + + return <ThemeProvider theme={theme}><MyComponent {...props} /></ThemeProvider>; + } + ``` + +- ​<!-- 15 -->[core] Remove `createStyles` from `@material-ui/core` (#26018) @mnajdova + + - The `createGenerateClassName` module is no longer exported from `@material-ui/core/styles`. You should import it directly from `@material-ui/styles`. + + ```diff + -import { createGenerateClassName } from '@material-ui/core/styles'; + +import { createGenerateClassName } from '@material-ui/styles'; + ``` + + - The `jssPreset` object is no longer exported from `@material-ui/core/styles`. You should import it directly from `@material-ui/styles`. + + ```diff + -import { jssPreset } from '@material-ui/core/styles'; + +import { jssPreset } from '@material-ui/styles'; + ``` + + - The `ServerStyleSheets` component is no longer exported from `@material-ui/core/styles`. You should import it directly from `@material-ui/styles`. + + ```diff + -import { ServerStyleSheets } from '@material-ui/core/styles'; + +import { ServerStyleSheets } from '@material-ui/styles'; + ``` + +- The `StylesProvider` component is no longer exported from `@material-ui/core/styles`. You should import it directly from `@material-ui/styles`. + + ```diff + -import { StylesProvider } from '@material-ui/core/styles'; + +import { StylesProvider } from '@material-ui/styles'; + ``` + +- The `useThemeVariants` hook is no longer exported from `@material-ui/core/styles`. You should import it directly from `@material-ui/styles`. + + ```diff + -import { useThemeVariants } from '@material-ui/core/styles'; + +import { useThemeVariants } from '@material-ui/styles'; + ``` + +- [FormControlLabel] The `label` prop is now required. + +#### Changes + +- ​<!-- 47 -->[Dialog] Improve support for custom breakpoints (#26092) @oliviertassinari +- ​<!-- 32 -->[IconButton] Fix default color prop (#26064) @Jack-Works +- ​<!-- 27 -->[Radio] Migrate RadioButtonIcon to emotion (#26068) @mnajdova +- ​<!-- 33 -->[SwipeableDrawer] Migrate SwipeArea to emotion (#26059) @mnajdova +- ​<!-- 72 -->[Table] Synchronize horizontal sticky header position with body (#26159) @LiKang6688 +- ​<!-- 69 -->[Tabs] Fix support for null children in TabList (#26170) @hubertokf +- ​<!-- 31 -->[Tabs] Fix keyboard traversal over disabled tabs (#26061) @anish-khanna +- ​<!-- 55 -->[TextField] Fix missing `standard` variant classes in types (#26115) @siriwatknp +- ​<!-- 54 -->[TextField] Allow to customize Typography in FormControlLabel (#25883) @mousemke +- ​<!-- 17 -->[theme] Fix transition duration default value customization (#26054) @anshuman9999 + +### `@material-ui/lab@5.0.0-alpha.33` + +#### Breaking changes + +- ​<!-- 08 -->[Timeline] Add support for position override on items (#25974) @simonecervini + + Rename the `align` prop to `position` to reduce confusion. + + ```diff + -<Timeline align="alternate"> + +<Timeline position="alternate"> + ``` + + ```diff + -<Timeline align="left"> + +<Timeline position="right"> + ``` + + ```diff + -<Timeline align="right"> + +<Timeline position="left"> + ``` + +- ​<!-- 56 -->[pickers] Remove customization of deep components (#26118) @eps1lon + +#### Changes + +- ​<!-- 02 -->[DatePicker] Migrate YearPicker to emotion (#25928) @siriwatknp +- ​<!-- 14 -->[DateRangePicker] Fix not being opened on click (#26016) @eps1lon +- ​<!-- 48 -->[pickers] Fix ref types (#26121) @eps1lon +- ​<!-- 43 -->[pickers] Rely on native behavior for disabled/readOnly behavior (#26055) @eps1lon +- ​<!-- 29 -->[pickers] Remove unused components from mobile and desktop variants (#26066) @eps1lon +- ​<!-- 23 -->[pickers] Document readonly/disabled pickers (#26056) @eps1lon +- ​<!-- 19 -->[pickers] Remove unused components from static variants (#26052) @eps1lon +- ​<!-- 13 -->[pickers] Toggle mobile keyboard view in the same commit as the view changes (#26017) @eps1lon +- ​<!-- 11 -->[pickers] Remove redundant aria-hidden (#26014) @eps1lon +- ​<!-- 04 -->[pickers] Ensure input value is reset in the same commit as the value (#25972) @eps1lon +- ​<!-- 49 -->[internal][pickers] Pass desktop wrapper props explicitly (#26120) @eps1lon +- ​<!-- 44 -->[internal][pickers] Move useInterceptProps into module (#26090) @eps1lon +- ​<!-- 37 -->[internal][pickers] Explicit default toolbar components (#26075) @eps1lon +- ​<!-- 35 -->[internal][pickers] Move validation from config to module (#26074) @eps1lon +- ​<!-- 21 -->[internal][pickers] Minimal types for defaultizing in useInterceptProps (#26063) @eps1lon +- ​<!-- 18 -->[internal][pickers] Don't validate inputFormat in production (#26053) @eps1lon +- ​<!-- 12 -->[internal][pickers] Remove unused styles (#26023) @eps1lon +- ​<!-- 03 -->[internal][pickers] Remove `AllSharedPickerProps` and `AllSharedDateRangePickerProps` (#26005) @eps1lon + +### Docs + +- ​<!-- 77 -->[docs] Migrate Tabs, Table, Snackbar demos to emotion (#26175) @mnajdova +- ​<!-- 73 -->[docs] Fix dynamic global styles (#25690) @mnajdova +- ​<!-- 71 -->[docs] Fixed React.forwardRef missing display name ESLint error (#26160) @arpitBhalla +- ​<!-- 70 -->[docs] Migrate Tooltip, Steppers demos to emotion (#26165) @mnajdova +- ​<!-- 68 -->[docs] Migrate Dialog demos to emotion (#26162) @vicasas +- ​<!-- 67 -->[docs] Remove `makeStyles` from landing pages (#26130) @mnajdova +- ​<!-- 65 -->[docs] Add new customized switch examples (#26096) @DanielBretzigheimer +- ​<!-- 62 -->[docs] Migrate Autocomplete demos (#26127) @mnajdova +- ​<!-- 61 -->[docs] Remove `@material-ui/core/styles` from the styles pages (#26126) @mnajdova +- ​<!-- 60 -->[docs] Update templates, premium-themes to use `makeStyles` from `@material-ui/styles` (#26131) @mnajdova +- ​<!-- 59 -->[docs] Migrate TreeView demos (#26146) @mnajdova +- ​<!-- 57 -->[docs] More explicit breakpoint documentation in `sx` (#26140) @eps1lon +- ​<!-- 53 -->[docs] Explicitly describe how the media query affects the rendered version (#26129) @eps1lon +- ​<!-- 45 -->[docs] Fix 301 link to store (#26095) @oliviertassinari +- ​<!-- 42 -->[docs] Normalize name use for state in pickers demo (#26093) @oliviertassinari +- ​<!-- 41 -->[docs] Consistent type name in docs (#26077) @jamesaucode +- ​<!-- 38 -->[docs] Remove `makeStyles` dependency from core in modules (#26071) @mnajdova +- ​<!-- 34 -->[docs] Add links for demo in different deploys (#26065) @eps1lon +- ​<!-- 26 -->[docs] Add section for useFormControl (#25927) @t49tran +- ​<!-- 24 -->[docs] Add Styled Engine page (#25911) @mnajdova +- ​<!-- 16 -->[docs] Migrate Timeline demos to emotion (#26036) @vicasas +- ​<!-- 07 -->[docs] Document all the colors available (#26015) @anshuman9999 +- ​<!-- 01 -->[docs] Avoid extracting classes twice (#25973) @oliviertassinari + +### Core + +- ​<!-- 52 -->[test] Add test for behavior when picker variant changes (#26128) @eps1lon +- ​<!-- 36 -->[test] testing-library patterns for playwright tests (#25860) @eps1lon +- ​<!-- 22 -->[test] Remove scheduler/tracing (#26062) @eps1lon +- ​<!-- 05 -->[test] Remove duplicate property (#26011) @eps1lon +- ​<!-- 76 -->[core] Link to experimental size-comparison page (#26179) @eps1lon +- ​<!-- 66 -->[core] Update typings for theme's components (#26125) @mnajdova +- ​<!-- 58 -->[core] Improve `react@experimental` compat (#26116) @eps1lon +- ​<!-- 46 -->[core] Remove more dependencies on `@material-ui/styles` (#26100) @mnajdova +- ​<!-- 40 -->[core] Batch small changes (#26083) @oliviertassinari +- ​<!-- 39 -->[core] ComponentType -> JSXElementConstructor (#26081) @eps1lon +- ​<!-- 06 -->[core] Create new @material-ui/private-theming package (#25986) @mnajdova + +All contributors of this release in alphabetical order: @anish-khanna, @anshuman9999, @arpitBhalla, @DanielBretzigheimer, @eps1lon, @hubertokf, @Jack-Works, @jamesaucode, @LiKang6688, @m4theushw, @mnajdova, @mousemke, @oliviertassinari, @simonecervini, @siriwatknp, @t49tran, @vicasas + +## 5.0.0-alpha.32 + +<!-- generated comparing v5.0.0-alpha.31..next --> + +_Apr 27, 2021_ + +A big thanks to the 15 contributors who made this release possible. Here are some highlights ✨: + +- 👩‍🎤 We have completed the migration to emotion of all components in `@material-ui/core`. We will focus on the components in `@material-ui/lab` next. +- 💥 Make progress with the breaking changes plan. We have done 38 out of 41 breaking changes that can be deprecated. We have done 21 out of the 39 that can't have deprecations. Once done, we will focus on updating the component for better following material design, and to improve the aesthetic. +- 💄 Support extending the theme for custom color and size values in all components. +- And many more 🐛 bug fixes and 📚 improvements. + +### `@material-ui/core@5.0.0-alpha.32` + +#### Breaking changes + +- ​<!-- 46 --> [Table] Rename padding="default" to padding="normal" (#25924) @m4theushw + + ```diff + -<Table padding="default" /> + -<TableCell padding="default" /> + +<Table padding="normal" /> + +<TableCell padding="normal" /> + ``` + +- ​<!-- 29 -->[Button] Rename `pending` prop to `loading` in LoadingButton (#25874) @m4theushw + + ```diff + -<LoadingButton pending pendingIndicator="Pending…" pendingPosition="end" /> + +<LoadingButton loading loadingIndicator="Pending…" loadingPosition="end" /> + ``` + +- ​<!-- 25 -->[ButtonBase] Remove buttonRef prop (#25896) @m4theushw + + ```diff + -<ButtonBase buttonRef={ref} /> + +<ButtonBase ref={ref} /> + ``` + + ```diff + -<Button buttonRef={ref} /> + +<Button ref={ref} /> + ``` + +- ​<!-- 41 -->[Checkbox][switch] Remove checked argument from onChange (#25871) @m4theushw + + ```diff + function MyCheckbox() { + - const handleChange = (event: React.ChangeEvent<HTMLInputElement>, checked: boolean) => { + + const handleChange = (event: React.ChangeEvent<HTMLInputElement>) => { + + const checked = event.target.checked; + }; + return <Checkbox onChange={handleChange} />; + } + ``` + + ```diff + function MySwitch() { + - const handleChange = (event: React.ChangeEvent<HTMLInputElement>, checked: boolean) => { + + const handleChange = (event: React.ChangeEvent<HTMLInputElement>) => { + + const checked = event.target.checked; + }; + return <Switch onChange={handleChange} />; + } + ``` + +- ​<!-- 42 -->[theme] Remove theme.breakpoints.width helper (#25918) @m4theushw + + ```diff + -theme.breakpoints.width('md') + +theme.breakpoints.values.md + ``` + +- ​<!-- 32 -->[theme] Remove theme.typography.round helper (#25914) @m4theushw + + The `theme.typography.round` helper was removed because it was no longer used. If you need it, use the function below: + + ```js + function round(value) { + return Math.round(value * 1e5) / 1e5; + } + ``` + +#### Changes + +- ​<!-- 03 -->[Container] Fix maxWidth="false" resulting in incorrect css (#25869) @mnajdova +- ​<!-- 49 -->[core] Improve support for extended props in theme (#25934) @vicasas +- ​<!-- 45 -->[core] Fix various too wide `classes` types (AppBar, Card, Link, LoadingButton, MenuItem) (#25917) @eps1lon +- ​<!-- 05 -->[Drawer] Fix classes forwarded to DOM node for docked drawer (#25870) @mnajdova +- ​<!-- 21 -->[IconButton] Support custom colors and sizes (#25890) @Vikram710 +- ​<!-- 16 -->[l10n] Add Bengali (bnBD) locale (#25841) @Knoxo +- ​<!-- 34 -->[Rating] Support custom sizes (#25922) @vicasas +- ​<!-- 30 -->[Select] Fix classes leaking on the DOM (#25894) @siriwatknp +- ​<!-- 43 -->[Stack] Fix support of spacing falsy values (#25937) @simonecervini +- ​<!-- 22 -->[Table] Migrate TablePagination to emotion (#25809) @siriwatknp +- ​<!-- 26 -->[Tabs] Migrate Tabs to emotion (#25824) @siriwatknp +- ​<!-- 50 -->[TextField] Remove utlity class name for margin="none" (#25969) @oliviertassinari +- ​<!-- 24 -->[TextField] Make the `position` prop required in InputAdornment (#25891) @m4theushw +- ​<!-- 23 -->[theme] Remove fade color helper (#25895) @m4theushw + +### `@material-ui/lab@5.0.0-alpha.32` + +- ​<!-- 53 -->[DateTimePicker] `date` is nullable in `onChange` (#25981) @eps1lon +- ​<!-- 39 -->[internal][pickers] Remove unused TView type argument (#25936) @eps1lon +- ​<!-- 48 -->[internal][pickers] Inline some BasePickerProps usages (#25971) @eps1lon +- ​<!-- 44 -->[internal][pickers] Entangle what Props vs AllProps means (#25938) @eps1lon +- ​<!-- 19 -->[lab] Update slot components to use overridesResolver (#25906) @mnajdova +- ​<!-- 40 -->[Timeline] Remove use of nth-child in favor of nth-of-type (#25915) @wellwellmissesanderson +- ​<!-- 06 -->[Timeline] Migrate Timeline to emotion (#25838) @siriwatknp +- ​<!-- 55 -->[TreeView] Migrate TreeItem to emotion (#25835) @siriwatknp + +### `@material-ui/styled-engine@5.0.0-alpha.32` + +- ​<!-- 02 -->[styled-engine] Skip variants resolver for non root slots by default (#25865) @mnajdova + +### `@material-ui/system@5.0.0-alpha.32` + +- ​<!-- 12 -->[system] Add missing `main` entry for styleFunctionSx (#25885) @eps1lon + +### `@material-ui/types@6.0.0` + +This package is just re-released since version 5.1.7 had a breaking change. + +### Docs + +- ​<!-- 28 -->[Autocomplete] Fix tagSize class typo (#25908) @JanMisker +- ​<!-- 51 -->[DataGrid] Update docs sections (#25980) @dtassone +- ​<!-- 38 -->[docs] Batch small fixes (#25807) @m4theushw +- ​<!-- 13 -->[docs] Explicitly list demos of unstyled components (#25900) @eps1lon +- ​<!-- 04 -->[docs] Expose heading links in a11y tree (#25861) @eps1lon +- ​<!-- 58 -->[docs] Fix minor typo (#26001) @onpaws +- ​<!-- 09 -->[docs] Fix global styles leaking on different pages (#25855) @mnajdova +- ​<!-- 31 -->[docs] Fix Typography api docs for `paragraph` prop (#25929) @DanailH +- ​<!-- 17 -->[docs] Fix Slider's classes wrong description (#25907) @mnajdova +- ​<!-- 37 -->[docs] Grammar correction in autocomplete API (#25910) @gruber76 +- ​<!-- 15 -->[docs] Require documentation of demos (#25811) @eps1lon +- ​<!-- 36 -->[docs] Update minimum required TypeScript version (#25930) @eps1lon +- ​<!-- 56 -->[Table] Improve description of TablePagination.rowsPerPageOptions (#25982) @kevinlul + +### Core + +- ​<!-- 54 -->[core] Fix wrong imports to '@material-ui/styles' (#25984) @mnajdova +- ​<!-- 52 -->[core] Ensure props spreading works as expected (#25939) @oliviertassinari +- ​<!-- 47 -->[core] Batch small changes (#25968) @oliviertassinari +- ​<!-- 35 -->[core] Enable trailing comma in TypeScript files (#25931) @eps1lon +- ​<!-- 33 -->[core] Remove @typescript-to-proptypes-generate handlers (#25909) @eps1lon +- ​<!-- 18 -->[core] Update slots components to enable flatten specificity for overrides (#25853, #25864, #25881, #25884, #25887, #25904, #25892) @mnajdova +- ​<!-- 27 -->[test] Add current behavior of inverleaving elements on mousedown (#25903) @eps1lon +- ​<!-- 20 -->[test] Add test validator to improve DX (#25854) @siriwatknp +- ​<!-- 57 -->[test] Fix duplicate key in TreeItem test (#26000) @mnajdova + +All contributors of this release in alphabetical order: @DanailH, @dtassone, @eps1lon, @gruber76, @JanMisker, @kevinlul, @Knoxo, @m4theushw, @mnajdova, @oliviertassinari, @simonecervini, @siriwatknp, @vicasas, @Vikram710, @wellwellmissesanderson + +## 5.0.0-alpha.31 + +<!-- generated comparing v5.0.0-alpha.30..next --> + +_Apr 20, 2021_ + +A big thanks to the 19 contributors who made this release possible. Here are some highlights ✨: + +- 👩‍🎤 Migrate 4 components to emotion. +- 💥 Resume work on the breaking changes, aim for v5.0.0-beta.0 in the next coming months. +- And many more 🐛 bug fixes and 📚 improvements. + +### `@material-ui/core@5.0.0-alpha.31` + +#### Breaking changes + +- [FormControl] Change default variant from standard to outlined (#24895) @petyosi + Standard has been removed from the Material Design guidelines. [This codemod](https://github.com/mui/material-ui/tree/next/packages/mui-codemod#variant-prop) will automatically update your code. + + ```diff + -<FormControl value="Standard" /> + -<FormControl value="Outlined" variant="outlined" /> + +<FormControl value="Standard" variant="standard" /> + +<FormControl value="Outlined" /> + ``` + +- [Menu] The `selectedMenu` variant will not vertically align the selected item with the anchor anymore. (#25691) @m4theushw +- [Popover] Remove the `getContentAnchorEl` prop to simplify the positioning logic. (#25691) @m4theushw +- [Select] Change default variant from standard to outlined (#24895) @petyosi + Standard has been removed from the Material Design guidelines. [This codemod](https://github.com/mui/material-ui/tree/next/packages/mui-codemod#variant-prop) will automatically update your code. + + ```diff + -<Select value="Standard" /> + -<Select value="Outlined" variant="outlined" /> + +<Select value="Standard" variant="standard" /> + +<Select value="Outlined" /> + ``` + +#### Changes + +- ​<!-- 17 -->[Alert] Fix action to be aligned with the text (#25768) @mnajdova +- ​<!-- 30 -->[Avatar] Fix onload event not firing when img cached (#25793) @npandrei +- ​<!-- 35 -->[Box] Add utility mui class (#25802) @mnajdova +- ​<!-- 24 -->[core] Don't call noop event.persist() (#25782) @eps1lon +- ​<!-- 52 -->[Dialog] Fix support of custom breakpoint units (#25788) @Vikram710 +- ​<!-- 26 -->[List] Fix support for list item container style overrides (#25777) @mnajdova +- ​<!-- 21 -->[Rating] Allow clearing ratings with arrow keys (#25645) @Vikram710 +- ​<!-- 05 -->[Rating] Fix focus visible regression (#25698) @oliviertassinari +- ​<!-- 46 -->[Select] Fix specificity of style overrides (#25766) @robphoenix +- ​<!-- 39 -->[Select] Fix className overwritten (#25815) @siriwatknp +- ​<!-- 33 -->[Select] Fix overrides for slots (#25796) @mnajdova +- ​<!-- 19 -->[Snackbar] Fix hidden overlay blocking interactions regression (#25739) @MieleVL +- ​<!-- 13 -->[TextField] Fix InputAdornment classes (#25749) @mnajdova +- ​<!-- 07 -->[theme] Avoid mutating args in createSpacing (#25745) @eps1lon + +### `@material-ui/lab@5.0.0-alpha.31` + +#### Breaking changes + +- ​<!-- 37 -->[Pickers] Rename DayPicker to CalendarPicker (#25810) @eps1lon + + ```diff + -import DayPicker from '@material-ui/lab/DayPicker'; + +import CalendarPicker from '@material-ui/lab/CalendarPicker'; + + createMuiTheme({ + components: { + - MuiDayPicker: {}, + + MuiCalendarPicker: {}, + } + }) + ``` + +- ​<!-- 04 -->[Pickers] Rename PickersCalendarSkeleton to CalendarPickerSkeleton (#25679) @eps1lon + + ```diff + -import PickersCalendarSkeleton from '@material-ui/lab/PickersCalendarSkeleton'; + +import CalendarPickerSkeleton from '@material-ui/lab/CalendarPickerSkeleton'; + ``` + +- ​<!-- 06 -->[Pickers] Rename `date` `view` to `day` (#25685) @eps1lon + + ```diff + -<DatePicker openTo="date" views={['date', 'month']} /> + +<DatePicker openTo="day" views={['day', 'month']} /> + ``` + +#### Changes + +- ​<!-- 16 -->[DateRangePicker] Add DateRangePickerDay to theme augmentation list (#25758) @ifndefdeadmau5 +- ​<!-- 38 -->[Pickers] Rename internal DayPickerView to CalendarPickerView (#25817) @eps1lon +- ​<!-- 41 -->[Pickers] Remove `TView` generic in CalendarPicker (#25818) @eps1lon +- ​<!-- 40 -->[Pickers] Use passive effect to attach close-on-escape listener (#25819) @eps1lon +- ​<!-- 50 -->[Timeline] Migrate TimelineDot to emotion (#25830) @vicasas +- ​<!-- 28 -->[Timeline] Migrate TimelineContent to emotion (#25781) @siriwatknp +- ​<!-- 53 -->[Timeline] Migrate TimelineItem to emotion (#25822) @vicasas +- ​<!-- 47 -->[Timeline] Migrate TimelineOppositeContent to emotion (#25816) @vicasas +- ​<!-- 54 -->[FocusTrap] Make isEnabled and getDoc optional (#25784) @m4theushw + +### `@material-ui/styled-engine@5.0.0-alpha.31` + +- ​<!-- 27 -->[styled-engine] Fix shouldForwardProp on slots (#25780) @mnajdova +- ​<!-- 11 -->[styled-engine] Improve GlobalStyles props (#25751) @mnajdova + +### `@material-ui/unstyled@5.0.0-alpha.31` + +- ​<!-- 14 -->[unstyled] Convert generateUtilityClass(es) to TypeScript (#25753) @eps1lon + +### Docs + +- ​<!-- 31 -->[Avatar] Set backgroundColor from string (#25789) @Vikram710 +- ​<!-- 59 -->[docs] Add demos for public picker components (#25812) @eps1lon +- ​<!-- 49 -->[docs] Add example with switch dark/light mode (#25823) @Vikram710 +- ​<!-- 01 -->[docs] Add package headings to 5.0.0-alpha.30 changelog (#25733) @eps1lon +- ​<!-- 61 -->[docs] Add unstyled section to all components coming with the package (#25843) @mnajdova +- ​<!-- 10 -->[docs] Breakdown Chip demos into smaller ones (#25750) @vicasas +- ​<!-- 12 -->[docs] Document circular progress inherit (#25736) @oliviertassinari +- ​<!-- 58 -->[docs] Fix /production-error crash (#25839) @eps1lon +- ​<!-- 48 -->[docs] Fix ad duplication (#25831) @oliviertassinari +- ​<!-- 09 -->[docs] Fix autocommplete disable event value (#25752) @oliviertassinari +- ​<!-- 56 -->[docs] Fix inline-preview selection controls (#25834) @oliviertassinari +- ​<!-- 29 -->[docs] Fix Horizontally centered demo (#25787) @viditrv123 +- ​<!-- 45 -->[docs] Improve pickers migration docs from v3 (#25813) @ahmed-28 +- ​<!-- 15 -->[docs] Move DataGrid editing nav link (#25769) @dtassone +- ​<!-- 36 -->[docs] Replace Typography color values with system values (#25805) @oliviertassinari +- ​<!-- 60 -->[docs] Remove one inline-style (#25671) @oliviertassinari +- ​<!-- 18 -->[docs] Use gender neutral pronoun for Swipeable Drawer (#25775) @catchanuj +- ​<!-- 20 -->[examples] Add TypeScript for styled-components engine (#25675) @jqrun +- ​<!-- 23 -->[l10n] zhTW refinement (#25786) @shakatoday +- ​<!-- 44 -->[Tabs] Add demo for routing with Tabs (#25827) @ahmed-28 +- ​<!-- 57 -->[website] Add Matheus Wichman (#25801) @m4theushw + +### Core + +- ​<!-- 42 -->[core] Batch small changes (#25804) @oliviertassinari +- ​<!-- 02 -->[core] Document token permissions of release:changelog (#25732) @eps1lon +- ​<!-- 34 -->[core] Error when installing in unsupported node environments (#25795) @eps1lon +- ​<!-- 43 -->[core] Fix rgba to hex conversion (#25825) @saeedeyvazy +- ​<!-- 08 -->[core] Normalize usage of pseudo classes selectors (#25748) @mnajdova +- ​<!-- 51 -->[core] Remove unused public types (#25833) @oliviertassinari +- ​<!-- 25 -->[core] Remove incorrect overridesResolver usages (#25778) @mnajdova +- ​<!-- 03 -->[test] Use public imports (#25686) @vicasas +- ​<!-- 22 -->[core] Use readonly arrays where possible (#25746) @eps1lon + +All contributors of this release in alphabetical order: @ahmed-28, @catchanuj, @dtassone, @eps1lon, @ifndefdeadmau5, @jqrun, @m4theushw, @MieleVL, @mnajdova, @npandrei, @oliviertassinari, @petyosi, @robphoenix, @saeedeyvazy, @shakatoday, @siriwatknp, @vicasas, @viditrv123, @Vikram710 + +## 5.0.0-alpha.30 + +<!-- generated comparing v5.0.0-alpha.29..next --> + +_Apr 12, 2021_ + +A big thanks to the 21 contributors who made this release possible. Here are some highlights ✨: + +- 👩‍🎤 Migrate 9 components to emotion. +- And many more 🐛 bug fixes and 📚 improvements. + +### `@material-ui/core@5.0.0-alpha.30` + +- ​<!-- 19 -->[Alert] Vertically align action on top (#25654) @xdshivani +- ​<!-- 37 -->[Autocomplete] Fix text field standard visual regression (#25676) @oliviertassinari +- ​<!-- 08 -->[CssBaseline] Fix @font-face rule broken in styleOverrides (#25583) @mnajdova +- ​<!-- 45 -->[Grid] Support custom number of columns (#25636) @Avi98 +- ​<!-- 15 -->[InputBase] Fix autofill typo (#25651) @michal-perlakowski +- ​<!-- 43 -->[LinearProgress] Add color="inherit" support (#25641) @itscharlieliu +- ​<!-- 06 -->[Pagination] Allow to differentiate more item types (#25622) @ruppysuppy +- ​<!-- 35 -->[Popover] Add popoverClasses export to type declarations (#25695) @tomasznguyen +- ​<!-- 33 -->[Rating] Add highlight selected rating only (#25649) @Vikram710 +- ​<!-- 14 -->[Rating] Migrate to emotion (#25588) @natac13 +- ​<!-- 38 -->[Select] Migrate to emotion (#25653) @mnajdova +- ​<!-- 17 -->[Select] Migrate NativeSelect to emotion (#24698) @duganbrett +- ​<!-- 28 -->[SpeedDial] Fix broken aria reference issue (#25665) @RiyaNegi +- ​<!-- 05 -->[Stepper] Migrate MobileStepper to emotion (#25589) @natac13 +- ​<!-- 13 -->[styles] Outdated warning message (#25637) @bhairavee23 +- ​<!-- 32 -->[Table] Remove legacy fix for JSS (#25692) @oliviertassinari +- ​<!-- 10 -->[Table] Migrate TableSortLabel to emotion (#25638) @natac13 +- ​<!-- 16 -->[TabPanel] Migrate to emotion (#25646) @tomasznguyen +- ​<!-- 11 -->[TextareaAutosize] Fix resizing bug on Firefox (#25634) @bhairavee23 +- ​<!-- 44 -->[TextField] Add textFieldClasses export to type declarations (#25696) @tomasznguyen +- ​<!-- 39 -->[theme] Change default bgColor to white in light mode (#25730) @saleebm +- ​<!-- 02 -->[ToggleButton] Add fullWidth prop (#25585) @hcz +- ​<!-- 40 -->[typescript] Add muiName to declarations (#25689) @michal-perlakowski + +### `@material-ui/lab@5.0.0-alpha.30` + +- ​<!-- 20 -->[Timeline] Migrate TimelineSeparator to emotion (#25666) @vicasas +- ​<!-- 18 -->[Timeline] Migrate TimelineConnector to emotion (#25663) @vicasas +- ​<!-- 42 -->[TimePicker] Use clock icon when editing in mobile mode (#25569) @alcwhite +- ​<!-- 29 -->[TreeView] Migrate to emotion (#25673) @tomasznguyen + +### Docs + +- ​<!-- 31 -->[blog] Fix typos @oliviertassinari +- ​<!-- 41 -->[docs] Migrate TextField demos to emotion (#25626) @vicasas +- ​<!-- 36 -->[docs] Bump stylis-plugin-rtl requirement (#25661) @mnajdova +- ​<!-- 34 -->[docs] Ensure old api-docs translations are cleaned (#25680) @eps1lon +- ​<!-- 25 -->[docs] Fix typo in v4 migration doc (#25678) @thameera +- ​<!-- 23 -->[docs] Fix useLayoutEffect warning (#25670) @oliviertassinari +- ​<!-- 22 -->[docs] Fix a11y issue in the SpeedDial docs (#25669) @RiyaNegi +- ​<!-- 12 -->[docs] Cover TypeScript commands in codemod readme (#25640) @StuffByLiang +- ​<!-- 09 -->[docs] Migrate Popover demos to emotion (#25620) @vicasas +- ​<!-- 07 -->[docs] Fix typo in switches and checkboxes doc (#25639) @dimitropoulos +- ​<!-- 03 -->[docs] Add interoperability section for Portal (#25575) @mnajdova +- ​<!-- 01 -->[docs] Fix side nav scroll position (#25619) @misaka3 +- ​<!-- 30 -->[website] Q1 2021 Update (#25591) @oliviertassinari +- ​<!-- 04 -->[website] Matheus Wichman joins Material UI (#25590) @oliviertassinari + +### Core + +- ​<!-- 27 -->[test] Use public api in lab (#25682) @vicasas +- ​<!-- 26 -->[test] Test types of .spec lab files (#25684) @eps1lon +- ​<!-- 24 -->[core] Fix build step for unstyled package (#25672) @oliviertassinari +- ​<!-- 21 -->[core] Ensure react-is uses v17 (#25668) @eps1lon + +All contributors of this release in alphabetical order: @alcwhite, @bhairavee23, @dimitropoulos, @duganbrett, @eps1lon, @hcz, @itscharlieliu, @michal-perlakowski, @misaka3, @mnajdova, @natac13, @oliviertassinari, @RiyaNegi, @ruppysuppy, @saleebm, @StuffByLiang, @thameera, @tomasznguyen, @vicasas, @Vikram710, @xdshivani + +## 5.0.0-alpha.29 + +<!-- generated comparing v5.0.0-alpha.28..next --> + +_Apr 4, 2021_ + +A big thanks to the 26 contributors who made this release possible. Here are some highlights ✨: + +- 🙌 Add support in the Grid for any spacing value (#25503) @ZakMiller. + For instance: + + ```jsx + <Grid container spacing={1.5}> + <Grid container spacing="30px"> + ``` + + This feature was made possible by the recent migration to emotion. + You can [find the other issues](https://github.com/mui/material-ui/issues?q=is%3Aopen+is%3Aissue+label%3A%22component%3A+Grid%22) unlocked by the migration to emotion on the Grid component that are left to be solved. + +- 👩‍🎤 Convert 3 components to emotion (#25541, #25516, #25521) @rajzik, @praveenkumar-kalidass, @siriwatknp. +- 📚 Migrate 8 component demo pages to the `sx`, `Stack`, and `styled` API @vicasas. +- And many more 🐛 bug fixes and 📚 improvements. + +### `@material-ui/core@5.0.0-alpha.29` + +- ​<!-- 39 -->[AppBar] Fix type support of overridable component (#25456) @heleg +- ​<!-- 26 -->[Autocomplete] Fix Async demo in docs (#25536) @kanish671 +- ​<!-- 23 -->[Autocomplete] Fix TypeScript wrapper example (#25530) @JanKaczmarkiewicz +- ​<!-- 21 -->[Backdrop] Remove z-index: -1 (#25524) @silver-snoopy +- ​<!-- 41 -->[Card] Add component prop support (#25537) @silver-snoopy +- ​<!-- 31 -->[CssBaseline] Migrate ScopedCssBaseline to emotion (#25541) @rajzik +- ​<!-- 03 -->[Divider] Support middle variant with vertical orientation (#25428) @vedadeepta +- ​<!-- 16 -->[Grid] Support decimal spacing (#25503) @ZakMiller +- ​<!-- 28 -->[List] Remove background inheritance of ListSubheader (#25532) @tanmoyopenroot +- ​<!-- 40 -->[Paper] Support dark mode brightening based on elevation (#25522) @m4theushw +- ​<!-- 43 -->[Select] Fix selection of non-options (#25567) @oliviertassinari +- ​<!-- 34 -->[Select] Set aria-expanded to false when listbox is collapsed (#25545) @Harish-Karthick +- ​<!-- 18 -->[SpeedDial] Call focus on escape (#25509) @tanmoyopenroot +- ​<!-- 20 -->[Stack] Add component prop (#25526) @silver-snoopy +- ​<!-- 07 -->[Stack] Fix the :not selector (#25484) @Andarist +- ​<!-- 24 -->[Stepper] Migrate StepButton to emotion (#25516) @praveenkumar-kalidass +- ​<!-- 22 -->[Stepper] Migrate Stepper to emotion (#25521) @siriwatknp +- ​<!-- 01 -->[Tabs] Don't animate scroll on first render (#25469) @manziEric +- ​<!-- 25 -->[Tooltip] Fix forwarded classes (#25535) @silver-snoopy + +### `@material-ui/unstyled@5.0.0-alpha.29` + +- ​<!-- 38 -->[Slider] Allow disabling the left and right thumbs swap (#25547) @michal-perlakowski + +### `@material-ui/lab@5.0.0-alpha.29` + +- ​<!-- 12 -->[DateRangePicker] Fix props naming in DatePicker components (#25504) @callmeberzerker +- ​<!-- 04 -->[DateRangePickerInput][internal] Inline makeDateRangePicker calls (#25470) @eps1lon +- ​<!-- 06 -->[StaticDateRangePicker] Fix inconsistent name for theme props (#25483) @eps1lon +- ​<!-- 17 -->[Pickers] Move own internals from lab internals to dedicated file (#25498) @eps1lon + +### Docs + +- ​<!-- 46 -->[docs] Provide an alternative to right-to-left (#25584) @dariusk +- ​<!-- 45 -->[docs] Add note for TypeScript on the styled() customization guide (#25576) @mnajdova +- ​<!-- 44 -->[docs] Replace incorrect instances of defined with define (#25572) @surajpoddar16 +- ​<!-- 42 -->[docs] Fix spelling error in roadmap.md file (#25570) @Brlaney +- ​<!-- 37 -->[docs] Migrate Card demos to emotion (#25557) @vicasas +- ​<!-- 36 -->[docs] Fix typo in data grid (#25561) @michael-001 +- ​<!-- 33 -->[docs] Migrate Menu demos to emotion (#25554) @vicasas +- ​<!-- 32 -->[docs] Fix <kbd> style in dark mode (#25551) @m4theushw +- ​<!-- 30 -->[docs] Document changing skeleton color (#25542) @ZakMiller +- ​<!-- 29 -->[docs] Improve coverage of TypeScript theme augmentation (#25489) @ashishshuklabs +- ​<!-- 27 -->[docs] Update minimizing-bundle-size.md (#25534) @nguyenyou +- ​<!-- 15 -->[docs] Migrate Portal demos to emotion (#25505) @vicasas +- ​<!-- 14 -->[docs] Migrate NoSSR demos to emotion (#25506) @vicasas +- ​<!-- 13 -->[docs] Migrate ClickAwayListener demos to emotion (#25507) @vicasas +- ​<!-- 10 -->[docs] Cover change of React support (#25487) @oliviertassinari +- ​<!-- 09 -->[docs] Migrate Transitions demos to emotion (#25488) @vicasas +- ​<!-- 08 -->[docs] Fix Stack divider demo (#25491) @oliviertassinari +- ​<!-- 02 -->[docs] Migrate Icons demos to emotion (#25412) @vicasas + +### Core + +- ​<!-- 19 -->[core] Use latest TypeScript in typescript-to-proptypes (#25512) @eps1lon +- ​<!-- 11 -->[core] Update the codesandbox issue templates (#25501) @oliviertassinari +- ​<!-- 05 -->[test] Wait on e2e server to start before starting runner (#25476) @eps1lon + +All contributors of this release in alphabetical order: @Andarist, @ashishshuklabs, @Brlaney, @callmeberzerker, @dariusk, @eps1lon, @Harish-Karthick, @heleg, @JanKaczmarkiewicz, @kanish671, @m4theushw, @manziEric, @michael-001, @michal-perlakowski, @mnajdova, @nguyenyou, @oliviertassinari, @praveenkumar-kalidass, @rajzik, @silver-snoopy, @siriwatknp, @surajpoddar16, @tanmoyopenroot, @vedadeepta, @vicasas, @ZakMiller + +## 5.0.0-alpha.28 + +_Mar 22, 2021_ + +A big thanks to the 34 contributors who made this release possible. Here are some highlights ✨: + +- 👩‍🎤 Convert 9 components to emotion (#25267, #25216, #25264, #25197, #25372, #25281, #25210, #25279, #2528) @natac13 @tomasznguyen @kayuapi. + 85% of the components have been migrated so far, thanks to the help of the community. +- 📚 Migrate 18 component demo pages to the `sx`, `Stack`, and `styled` API @vicasas. + This was also an importunity to breakdown the existing large demos into smaller and more focuses ones. +- Add a new Stack component (#25149) @souporserious + The component allows to workaround the lack of support for the CSS flexbox `gap` property across browsers. + + <img width="830" alt="stack" src="https://user-images.githubusercontent.com/3165635/112068427-29434200-8b6a-11eb-94e8-057535423b0f.png"> + + See the documentation for [more details](https://mui.com/components/stack/). + +- And many more 🐛 bug fixes and 📚 improvements. + +### `@material-ui/core@5.0.0-alpha.28` + +#### Breaking changes + +- [core] Drop support for React 16 (#25464) @eps1lon +- ​<!-- 36 -->[core] Drop support for node 10 (#25306) @eps1lon + +#### Changes + +- ​<!-- 70 -->[Autocomplete] Warn when the input didn't resolve in time (#25311) @LaneRamp +- ​<!-- 26 -->[Autocomplete] Fix styleOverrides support (#25276) @manziEric +- ​<!-- 68 -->[ButtonBase] Allow to customize the link component via theme (#25331) @vedadeepta +- ​<!-- 43 -->[ButtonBase] Fix default type attribute (submit -> button) (#25323) @RTEYL +- ​<!-- 73 -->[ButtonGroup] Support custom colors (#25413) @oliviertassinari +- ​<!-- 13 -->[CircularProgress] Fix animation when disableShrink={true} (#25247) @duongdev +- ​<!-- 29 -->[Dialog] Fix typo (#25287) @aheimlich +- ​<!-- 22 -->[Dialog] Migrate DialogContentText to emotion (#25267) @tomasznguyen +- ​<!-- 04 -->[Dialog] Migrate Dialog to emotion (#25216) @natac13 +- ​<!-- 79 -->[Drawer] Fix RTL support (#25453) @silver-snoopy +- ​<!-- 50 -->[Menu] Migrate to emotion (#25264) @tomasz-crozzroads +- ​<!-- 77 -->[Paper] Fix component prop type error (#25426) @heleg +- ​<!-- 17 -->[Popover] Migrate to emotion (#25197) @tomasznguyen +- ​<!-- 59 -->[Radio] Fix html structure (#25398) @oliviertassinari +- ​<!-- 58 -->[Select] Fix focus background when variant="outlined" (#25393) @christiaan +- ​<!-- 62 -->[Slider] Add `tabIndex` prop (#25388) @johnloven +- ​<!-- 88 -->[Snackbar] Fix prop type error for 'key' prop (#25431) @jansedlon +- ​<!-- 38 -->[SpeedDial] Reset tooltip state when the speed dial is closed (#25259) @m4theushw +- ​<!-- 71 -->[Stack] Add new component (#25149) @souporserious +- ​<!-- 81 -->[Stepper] Migrate StepLabel to emotion (#25372) @praveenkumar-kalidass +- ​<!-- 27 -->[Stepper] Migrate StepIcon to emotion (#25281) @praveenkumar-kalidass +- ​<!-- 08 -->[Stepper] Migrate StepContent to emotion (#25210) @praveenkumar-kalidass +- ​<!-- 30 -->[SwipeableDrawer] Fix hideBackDrop support (#25275) @manziEric +- ​<!-- 75 -->[Table] Fix duplicated keys in TablePagination rows per page (#25309) @martinfrancois +- ​<!-- 72 -->[Table] Consistency with DataTable (#25414) @oliviertassinari +- ​<!-- 76 -->[TextField] Size small for multiline (#25423) @julihereu +- ​<!-- 48 -->[TextField] Migrate InputAdornment to emotion (#25279) @kayuapi +- ​<!-- 47 -->[TextField] Migrate to emotion (#25286) @tomasznguyen +- ​<!-- 74 -->[ToggleButton] Add color prop (#25390) @AlfredoGJ +- ​<!-- 82 -->[Tooltip] Make `disableFocusListener` prop comment clearer (#25455) @jansedlon +- ​<!-- 24 -->[Tooltip] Fix placement regression (#25255) @oliviertassinari +- ​<!-- 25 -->[Transition] Add easing prop to override default timing function (#25245) @jeferson-sb + +### `@material-ui/lab@5.0.0-alpha.28` + +- ​<!-- 85 -->[Pickers] Follow "private by default" in makeDateRangePicker (#25424) @eps1lon +- ​<!-- 53 -->[Pickers] Simplify internals of \*Wrapper components (#25369) @eps1lon +- ​<!-- 35 -->[Pickers] Remove `make*` HOCs (#25172) @eps1lon +- ​<!-- 19 -->[Pickers] Remove propTypes in production for exotic components (#25261) @eps1lon +- [Pickers] Unify ref behavior (#25425) @eps1lon +- [Pickers] Sort properties (#25473) @eps1lon + +### `@material-ui/utils@5.0.0-alpha.28` + +- ​<!-- 90 -->[utils] Fix useForkRef typings rejecting nullish (#25468) @eps1lon +- ​<!-- 54 -->[utils] Allow functional updates in TypeScript declaration of useControlled (#25378) @MikhailTSE +- ​<!-- 28 -->[utils] Add a new integer propType (#25224) @fayzzzm + +### Docs + +- ​<!-- 56 -->[docs] Fix typo in migration-v4.md (#25384) @Tollwood +- ​<!-- 86 -->[docs] Use defaultCodeOpen where appropriate (#25418) @eps1lon +- ​<!-- 84 -->[docs] Support RTL with styled components (#25457) @silver-snoopy +- ​<!-- 83 -->[docs] Improve the docs of the Grid component (#25429) @oliviertassinari +- ​<!-- 80 -->[docs] Migrate Switch demos to emotion (#25366) @vicasas +- ​<!-- 78 -->[docs] Use Stack in demos (#25419) @vicasas +- ​<!-- 69 -->[docs] Migrate Checkbox demos to emotion (#25394) @vicasas +- ​<!-- 67 -->[docs] Migrate Radio demos to emotion (#25396) @vicasas +- ​<!-- 66 -->[docs] Update icon link to fonts.google.com (#25410) @BGehrels +- ​<!-- 60 -->[docs] Migrate Avatar demos to emotion (#25375) @vicasas +- ​<!-- 57 -->[docs] Fix multiline textfields docs to use minRows/maxRows (#25383) @saleebm +- ​<!-- 55 -->[docs] Consolidate environment variables into next.config (#25386) @eps1lon +- ​<!-- 52 -->[docs] Use `env` next config over DefinePlugin (#25373) @eps1lon +- ​<!-- 49 -->[docs] Migrate SpeedDial to emotion (#25367) @vicasas +- ​<!-- 46 -->[docs] Refine the used prop-type to discriminate number from integer (#25334) @fayzzzm +- ​<!-- 45 -->[docs] Migrate AppBar demos to emotion (#25335) @m4theushw +- ​<!-- 44 -->[docs] Migrate Grid demos to emotion (#25332) @vicasas +- ​<!-- 42 -->[docs] Migrate Toggle Button demos to emotion (#25333) @vicasas +- ​<!-- 41 -->[docs] Migrate Links demos to emotion (#25303) @vicasas +- ​<!-- 40 -->[docs] Migrate Breadcrumbs demos to emotion (#25302) @vicasas +- ​<!-- 34 -->[docs] Migrate Image List demos to emotion (#25301) @vicasas +- ​<!-- 33 -->[docs] Bring clarity about the IE 11 support policy: it's partial (#25262) @oliviertassinari +- ​<!-- 31 -->[docs] Add the new demo page for the data grid (#25284) @DanailH +- ​<!-- 23 -->[docs] Migrate List demos to emotion (#25266) @vicasas +- ​<!-- 21 -->[docs] Migrate Chip demos to emotion (#25268) @vicasas +- ​<!-- 20 -->[docs] Add missing props to \*DatePicker API (#25254) @eps1lon +- ​<!-- 18 -->[docs] Improve accessibility of the basic menu demo (#25207) @ee0pdt +- ​<!-- 16 -->[docs] Migrate Fab demos to emotion (#25251) @vicasas +- ​<!-- 15 -->[docs] Migrate Rating demos to emotion (#25252) @vicasas +- ​<!-- 14 -->[docs] Migrate Transfer List demos to emotion (#25253) @vicasas +- ​<!-- 07 -->[docs] Remove dead generatePropTypeDescription method (#25188) @fayzzzm +- ​<!-- 06 -->[docs] Migrate Skeleton demos to emotion (#25212) @vicasas +- ​<!-- 05 -->[docs] Migrate Paper demos to emotion (#25213) @vicasas +- ​<!-- 03 -->[docs] Migrate Container demos to emotion (#25220) @vicasas +- ​<!-- 01 -->[docs] Add GlobalStyles API (#25191) @eps1lon + +### Core + +- ​<!-- 63 -->[benchmark] Set intended environment (#25402) @eps1lon +- ​<!-- 11 -->[core] Remove .propTypes when the props are empty (#25193) @eps1lon +- ​<!-- 91 -->[core] Fix allSettled usage (#25461) @eps1lon +- ​<!-- 87 -->[core] Switch to React 17 (#25416) @eps1lon +- ​<!-- 65 -->[core] Bump missed node versions (#25385) @eps1lon +- ​<!-- 39 -->[core] Batch small changes (#25330) @oliviertassinari +- ​<!-- 37 -->[core] Use Promise.allSettled over .all where appropriate (#25315) @eps1lon +- ​<!-- 92 -->[test] Use fixture terminology in e2e and visual regression tests (#25466) @eps1lon +- ​<!-- 89 -->[test] Create end-to-end testing CI job (#25405) @eps1lon +- ​<!-- 64 -->[test] Transpile more similar to prod bundle (#25406) @eps1lon +- ​<!-- 32 -->[test] Minor improvements to `describeConformance` (#25297) @eps1lon +- ​<!-- 12 -->[test] Fix warnings in the demos (#25140) @oliviertassinari +- ​<!-- 10 -->[test] Convert createClientRender to TypeScript (#25249) @eps1lon +- ​<!-- 09 -->[test] Increase ttp setup timeout (#25248) @eps1lon +- ​<!-- 02 -->[test] Improve typescript-to-proptypes test suite (#25209) @eps1lon + +All contributors of this release in alphabetical order: @aheimlich, @AlfredoGJ, @BGehrels, @christiaan, @DanailH, @duongdev, @ee0pdt, @eps1lon, @fayzzzm, @heleg, @jansedlon, @jeferson-sb, @johnloven, @julihereu, @kayuapi, @LaneRamp, @m4theushw, @manziEric, @martinfrancois, @MikhailTSE, @natac13, @oliviertassinari, @praveenkumar-kalidass, @RTEYL, @saleebm, @silver-snoopy, @souporserious, @Tollwood, @tomasz-crozzroads, @tomasznguyen, @vedadeepta, @vicasas + +## 5.0.0-alpha.27 + +<!-- generated comparing v5.0.0-alpha.26..next --> + +_Mar 5, 2021_ + +A big thanks to the 12 contributors who made this release possible. Here are some highlights ✨: + +- 👩‍🎤 Convert 8 components to emotion (#25091, #25158, #25146, #25142, #25166) @natac13, @mngu, @m4theushw, @praveenkumar-kalidass. +- 📚 Convert 5 components demos to emotion (#25164, #25183, #25180, #25145, #25138) @vicasas +- And many more 🐛 bug fixes and 📚 improvements. + +### `@material-ui/core@5.0.0-alpha.27` + +- ​<!-- 16 -->[Autocomplete] Support readonly type for the options (#25155) @silver-snoopy +- ​<!-- 13 -->[Drawer] Migrate to emotion (#25091) @natac13 +- ​<!-- 20 -->[LinearProgress] Migrate to emotion (#25158) @mngu +- ​<!-- 06 -->[Pagination] Migrate Pagination and PaginationItem to emotion (#25146) @mngu +- ​<!-- 21 -->[Radio] Migrate to emotion (#25152) @mngu +- ​<!-- 10 -->[Snackbar] Migrate to emotion (#25142) @m4theushw +- ​<!-- 25 -->[SpeedDial] Migrate to emotion (#25166) @m4theushw +- ​<!-- 12 -->[Stepper] Migrate StepConnector to emotion (#25092) @praveenkumar-kalidass +- ​<!-- 07 -->[styled] Fix override logic to support component without root (#25143) @niting143 +- ​<!-- 08 -->[Table] Remove default role logic in TableCell (#25105) @silver-snoopy +- ​<!-- 27 -->[Table] Use primary cover over secondary for selected state (#25182) @beaudry +- ​<!-- 23 -->[theme] Fix styleOverrides with nested selectors (#25156) @ruppysuppy + +### `@material-ui/system@5.0.0-alpha.27` + +- ​<!-- 02 -->[system] Fix behavior of visuallyHidden when used with `sx` prop (#25110) @niting143 + +### `@material-ui/lab@5.0.0-alpha.27` + +#### Breaking changes + +- ​<!-- 18 -->[Pickers] Remove `dateAdapter` prop (#25162) @eps1lon + +The prop didn't solve any important problem better than any of its alternatives do. + +```diff +-<DatePicker dateAdapter={x} /> ++<LocalizationProvider dateAdapter={x}> ++ <DatePicker /> ++</LocalizationProvider> +``` + +#### Changes + +- ​<!-- 19 -->[Pickers][internal] Use React.forwardRef instead of forwardedRef prop (#25173) @eps1lon + +### `@material-ui/styles@5.0.0-alpha.27` + +- ​<!-- 03 -->[styles] Use capitalize from utils (#25136) @eps1lon + +### Docs + +- ​<!-- 22 -->[docs] Migrate Bottom navigation demos to emotion (#25180) @vicasas +- ​<!-- 09 -->[docs] Migrate Button demos to emotion (#25138) @vicasas +- ​<!-- 17 -->[docs] Migrate Divider demos to emotion (#25145) @vicasas +- ​<!-- 24 -->[docs] Migrate Pagination demos to emotion (#25183) @vicasas +- ​<!-- 26 -->[docs] Migrate Typography demos to emotion (#25164) @vicasas +- ​<!-- 11 -->[docs] Remove CircleCI from backers (#24801) @mbrookes +- ​<!-- 14 -->[docs] Update the used testing libraries (#25144) @oliviertassinari + +### Core + +- ​<!-- 01 -->[changelog] Better document breaking changes @oliviertassinari +- ​<!-- 05 -->[core] Modernize icons `builder:src` (#25137) @eps1lon +- ​<!-- 04 -->[core] Properly use BABEL_ENV test and development (#25139) @eps1lon +- ​<!-- 15 -->[test] Add (manual) visual regression test for icons (#25160) @eps1lon + +All contributors of this release in alphabetical order: @beaudry, @eps1lon, @m4theushw, @mbrookes, @mngu, @natac13, @niting143, @oliviertassinari, @praveenkumar-kalidass, @ruppysuppy, @silver-snoopy, @vicasas + +## 5.0.0-alpha.26 + +<!-- generated comparing v5.0.0-alpha.25..next --> + +_Feb 27, 2021_ + +A big thanks to the 26 contributors who made this release possible. Here are some highlights ✨: + +- 👩‍🎤 Convert 11 components to emotion (#24696, #24631, #24857, #25048, #24693, #24663, #25007, #24688, #24665, #24878, #24571) @praveenkuma @natac13 @xs9627 @povilass @m4theushw @natac13 @natac13 @DanailH @duganbrett @duganbrett @praveenkumar-kalidass @vinyldarkscratch. + 75% of the components have been migrated so far, thanks to the help of the community. +- 🦴 Convert 4 components to the unstyled pattern (#24985, #24857, #24890, #24957) @povilass. + This change doesn't introduce any breaking changes. Hence, most of the conversion effort will be done post v5-stable. +- 📚 Fix the generation of the API pages for the date pickers (#25101, #25100, #25086, #25089, #25085, #25084) @eps1lon. + This is a follow-up effort after we have merged `material-ui-pickers`. The components are written in TypeScript which required us to upgrade our infra. +- 👌 Improve the Slider thumb and track animation (#24968) @remyoudemans. + The thumb is now moving with a light transition between different values unless it's dragged. + <img src="https://user-images.githubusercontent.com/3165635/109394906-b7405a00-7929-11eb-829a-3b5246c30c08.gif" width="412" height="110" alt="thumb-animation" /> +- 💅 Convert 5 components with custom colors support (#25099, #25088) @mngu. + This change makes it easier to leverage custom palettes +- And many more 🐛 bug fixes and 📚 improvements. + +### `@material-ui/core@5.0.0-alpha.26` + +#### Breaking changes + +- ​<!-- 089 -->[Tabs] Change the default indicatorColor and textColor prop values to "primary" (#25063) @Dripcoding + + This is done to match the most common use cases with Material Design. You can restore the previous behavior with: + + ```diff + -<Tabs /> + +<Tabs indicatorColor="secondary" textColor="inherit" /> + ``` + +#### Changes + +- ​<!-- 099 -->[AppBar][circularprogress][LinearProgress] Support custom colors (#25099) @mngu +- ​<!-- 102 -->[Autocomplete] Prevent closing on no-option text click (#25103) @silver-snoopy +- ​<!-- 101 -->[Autocomplete] Fix ListboxComponent slot regression (#25102) @oliviertassinari +- ​<!-- 035 -->[Autocomplete] Fix the return type of AutocompleteGetTagProps (#24950) @joemaffei +- ​<!-- 029 -->[Autocomplete] Migrate to emotion (#24696) @natac13 +- ​<!-- 091 -->[Button] Fix ripple stuck after displaying the context menu (#25004) @DanailH +- ​<!-- 082 -->[Button] Fix forward classes to ButtonBase (#25072) @praveenkumar-kalidass +- ​<!-- 034 -->[Chip] Normalize Material Design States (#24915) @oliviertassinari +- ​<!-- 031 -->[Chip] Fix focus-visible regression (#24906) @oliviertassinari +- ​<!-- 018 -->[CircularProgress] Make source easier to read (#24893) @oliviertassinari +- ​<!-- 053 -->[Menu] Migrate MenuItem to emotion (#24631) @xs9627 +- ​<!-- 079 -->[Paper] Fix type support of overridable component (#25059) @mngu +- ​<!-- 051 -->[Skeleton] Fix global theme customization (#24983) @glocore +- ​<!-- 067 -->[Slider] Improve thumb and track animation (#24968) @remyoudemans +- ​<!-- 009 -->[Slider] Fix override of event.target when preparing change events (#24782) @praveenkumar-kalidass +- ​<!-- 097 -->[Snackbar] Migrate SnackbarContent to emotion (#25048) @m4theushw +- ​<!-- 028 -->[SwipeableDrawer] Fix detection of native scroll container (#24903) @oliviertassinari +- ​<!-- 059 -->[Switch] Migrate to emotion (#24693) @natac13 +- ​<!-- 050 -->[Switch] Update to follow current MD guidelines (#24954) @hxqlin +- ​<!-- 016 -->[Table] Migrate TableCell to emotion (#24663) @natac13 +- ​<!-- 094 -->[TextField] Support custom color and size (#25088) @mngu +- ​<!-- 093 -->[TextField] Fix input adornment color (#25090) @manziEric +- ​<!-- 081 -->[TextField] Fix FilledInput AA contrast issue (#25046) @Dripcoding +- ​<!-- 072 -->[TextField] Migrate FormControlLabel to emotion (#25007) @DanailH +- ​<!-- 069 -->[TextField] Fix label wrap, display an ellipsis instead (#25012) @NekoApocalypse +- ​<!-- 052 -->[TextField] Migrate OutlinedInput to emotion (#24688) @duganbrett +- ​<!-- 048 -->[TextField] Fix focused={true} disabled={true} infinite render (#24961) @oliviertassinari +- ​<!-- 019 -->[TextField] Migrate FormLabel and InputLabel to emotion (#24665) @duganbrett +- ​<!-- 077 -->[theme] Update theme.palette.text.secondary to match the spec (#25060) @Dripcoding +- ​<!-- 058 -->[ToggleButton] Migrate ToggleButtonGroup to emotion (#24878) @praveenkumar-kalidass +- ​<!-- 098 -->[Tooltip] Migrate to emotion (#24571) @vinyldarkscratch + +### `@material-ui/unstyled@5.0.0-alpha.26` + +- ​<!-- 033 -->[Portal] Migrate to unstyled (#24890) @povilass +- ​<!-- 047 -->[FocusTrap] Migrate to unstyled (#24957) @povilass +- ​<!-- 060 -->[Backdrop] Migrate to unstyled (#24985) @povilass +- ​<!-- 078 -->[Modal] Migrate to emotion + unstyled (#24857) @povilass + +### `@material-ui/lab@5.0.0-alpha.26` + +- ​<!-- 071 -->[Pickers] Fix scroll-jump when opening with a selected value (#25010) @eps1lon +- ​<!-- 066 -->[Pickers] Rework keyboard navigation implementation (#24315) @eps1lon +- ​<!-- 065 -->[Pickers] Fix picker components not opening on click in React 17 (#24981) @eps1lon +- ​<!-- 013 -->[Pickers] Fix outdated link to PickersDay (#24883) @oliviertassinari + +### `@material-ui/icons@5.0.0-alpha.26` + +- ​<!-- 087 -->[icons] Synchronize icons (#25055) @eps1lon + + 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: + + ```diff + // AmpStories -> Download + -AmpStories + +Download + -AmpStoriesOutlined + +DownloadOutlined + -AmpStoriesRounded + +DownloadRounded + -AmpStoriesSharp + +DownloadSharp + -AmpStoriesTwoTone + +DownloadTwoTone + // Outbond -> Outbound + -Outbond + +Outbound + -OutbondOutlined + +OutboundOutlined + -OutbondRounded + +OutboundRounded + -OutbondSharp + +OutboundSharp + -OutbondTwoTone + +OutboundTwoTone + ``` + + We are getting closer to the maximum number of icons our infrastructure can support. In the future, we might remove the least popular icons in favor of the most frequently used ones. + +### `@material-ui/system@5.0.0-alpha.26` + +- ​<!-- 057 -->[system] Fix gap, rowGap, columnGap, borderRadius reponsive support (#24994) @oliviertassinari + +### `@material-ui/utils@5.0.0-alpha.26` + +- ​<!-- 025 -->[utils] Fix isMuiElement types (#24936) @oliviertassinari + +### Docs + +- ​<!-- 100 -->[docs] Add DateRangePickerDay, PickersDay, PickersCalendarSkeleton, MontherPicker API (#25101) @eps1lon +- ​<!-- 096 -->[docs] Add DayPicker API (#25100) @eps1lon +- ​<!-- 095 -->[docs] Improve description of builderbook (#25086) @klyburke +- ​<!-- 092 -->[docs] Add API of ClockPicker (#25089) @eps1lon +- ​<!-- 090 -->[docs] Add API of \*DateRangePicker components (#25085) @eps1lon +- ​<!-- 088 -->[docs] Add API of \*DateTimePicker components (#25084) @eps1lon +- ​<!-- 084 -->[docs] Add graphql-starter to Example Projects (#25068) @koistya +- ​<!-- 083 -->[docs] Migrate Alert demos to emotion (#25074) @m4theushw +- ​<!-- 075 -->[docs] Add codesandbox example for styled-components (#25050) @jony89 +- ​<!-- 056 -->[docs] Wrong link @oliviertassinari +- ​<!-- 049 -->[docs] Improve error message when GitHub API fail (#24976) @oliviertassinari +- ​<!-- 037 -->[docs] Separate simple and nested modal demos (#24938) @ydubinskyi +- ​<!-- 030 -->[docs] Remove under construction icons from DataGrid feature pages (#24946) @DanailH +- ​<!-- 020 -->[docs] Fix prefers-color-scheme switch (#24902) @oliviertassinari +- ​<!-- 001 -->[docs] Add yarn install step, safer @oliviertassinari +- ​<!-- 055 -->[examples] Fix code sandbox link GitHub branch (#24996) @kevbarns + +### Core + +- ​<!-- 086 -->[core] Prevent out-of-memory in test_types_next (#25079) @eps1lon +- ​<!-- 085 -->[core] Pin playwright image to known working version (#25080) @eps1lon +- ​<!-- 080 -->[core] Remove need to reinject backdrop (#25071) @oliviertassinari +- ​<!-- 074 -->[core] Batch small changes (#25015) @oliviertassinari +- ​<!-- 068 -->[core] More cleanup on Pickers code (#25020) @dborstelmann +- ​<!-- 063 -->[core] Allow running full pipeline with various React versions (#25005) @eps1lon +- ​<!-- 061 -->[core] Fix missing codecov report (#25006) @eps1lon +- ​<!-- 040 -->[core] Fix release:tag pushing to first push remote (#24960) @eps1lon +- ​<!-- 039 -->[core] Fix cache miss when using playwright docker images (#24942) @eps1lon +- ​<!-- 023 -->[core] Prevent out-of-memory when type-checking in CI (#24933) @eps1lon +- ​<!-- 022 -->[core] Disable page size tracking (#24932) @eps1lon +- ​<!-- 021 -->[core] Extract linting into separate CI job (#24930) @eps1lon +- ​<!-- 017 -->[core] Only clone props if needed (#24892) @oliviertassinari +- ​<!-- 015 -->[core] listChangedFiles returns an empty list with no changed files (#24879) @eps1lon +- ​<!-- 014 -->[core] Remove dead code in docs:dev (#24880) @oliviertassinari +- ​<!-- 012 -->[core] Fix a few stylelint error (#24885) @oliviertassinari +- ​<!-- 011 -->[core] Fix name of Safari target (#24881) @oliviertassinari +- ​<!-- 010 -->[core] Prefer return over throw in chainPropTypes (#24882) @oliviertassinari +- ​<!-- 006 -->[core] Support /r/issue-template back (#24870) @oliviertassinari +- ​<!-- 003 -->[core] Simplify xxxClasses types (#24736) @oliviertassinari +- ​<!-- 076 -->[test] Improve BrowserStack configuration (#25049) @oliviertassinari +- ​<!-- 073 -->[test] Track bundle size of unstyled components (#25047) @oliviertassinari +- ​<!-- 070 -->[test] Make `render` required with describeConformanceV5 (#25003) @oliviertassinari +- ​<!-- 064 -->[test] Move a11y tree exclusion to appropriate document (#24998) @eps1lon +- ​<!-- 062 -->[test] Test with ClickAwayListener mount on onClickCapture (#25001) @eps1lon +- ​<!-- 045 -->[test] Improve various timer related issues (#24963) @eps1lon +- ​<!-- 043 -->[test] Avoid Rate Limit Exceeded (#24931) @oliviertassinari +- ​<!-- 042 -->[test] Remove internal icons smoke test (#24969) @eps1lon +- ​<!-- 041 -->[test] Reduce compile time of test:karma in watchmode drastically (#24967) @eps1lon +- ​<!-- 038 -->[test] Dedupe missing act warnings for HoC (#24949) @eps1lon +- ​<!-- 036 -->[test] Consolidate on a single API (#24884) @oliviertassinari +- ​<!-- 027 -->[test] Update react next patch (#24934) @eps1lon +- ​<!-- 026 -->[test] Link CircleCI URL in BS (#24935) @oliviertassinari +- ​<!-- 024 -->[test] Run more tests at the same time (#24886) @oliviertassinari +- ​<!-- 008 -->[test] Dedupe missing act warnings by component name (#24871) @eps1lon +- ​<!-- 007 -->[test] Enable type-unaware versions of disabled typed-aware lint rules (#24873) @eps1lon +- ​<!-- 005 -->[test] Initial workspace definition (#24869) @eps1lon +- ​<!-- 004 -->[test] Add current behavior of focus during mount in Popper (#24863) @eps1lon +- ​<!-- 002 -->[test] Increase BrowserStack timeout to 6min (#24861) @oliviertassinari + +All contributors of this release in alphabetical order: @DanailH, @dborstelmann, @Dripcoding, @duganbrett, @eps1lon, @glocore, @hxqlin, @joemaffei, @jony89, @kevbarns, @klyburke, @koistya, @m4theushw, @manziEric, @mngu, @natac13, @NekoApocalypse, @oliviertassinari, @povilass, @praveenkumar-kalidass, @remyoudemans, @silver-snoopy, @vinyldarkscratch, @xs9627, @ydubinskyi + +## 5.0.0-alpha.25 + +<!-- generated comparing v5.0.0-alpha.24..next --> + +_Feb 11, 2021_ + +A big thanks to the 30 contributors who made this release possible. Here are some highlights ✨: + +- 👩‍🎤 Convert 32 components to emotion. Around 64% of the components have been migrated so far, thanks to the help of the community. We aim to migrate them all before the end of Q1 2021. + The podium of the most active community members in the migration 🏆: + + 1. @natac13 x17 + 2. @vicasas x5 + 3. @kodai3 x4 + +- 📐 Add a subset of MUI System as flattened props on `Typography` (#24496) @mnajdova. + Now, you can do: + + ```jsx + <Typography padding={2} color="text.secondary" /> + ``` + +- 📅 Focus on the date pickers, 5 fixes and 3 docs improvements. +- 💅 Provide a new [`darkScrollbar()`](https://mui.com/components/css-baseline/#scrollbars) CSS utility to improve the native scrollbar in dark mode. The documentation uses it. + +### `@material-ui/core@5.0.0-alpha.25` + +#### Breaking changes + +- Increase the minimum version of TypeScript supported from v3.2 to v3.5. (#24795) @petyosi + + We try to align with types released from [DefinitelyTyped](https://github.com/DefinitelyTyped/DefinitelyTyped) (i.e. packages published on npm under the `@types` namespace). + We will not change the minimum supported version in a major version of Material UI. + However, we generally recommend to not use a TypeScript version older than the [lowest supported version of DefinitelyTyped](https://github.com/DefinitelyTyped/DefinitelyTyped#older-versions-of-typescript-33-and-earlier). + +#### Changes + +- ​<!-- 03 -->[ImageList] Migrate to emotion (#24615) @kodai3 +- ​<!-- 04 -->[Dialog] Migrate DialogTitle to emotion (#24623) @vicasas +- ​<!-- 05 -->[TextField] Prepare removal of labelWidth prop (#24595) @oliviertassinari +- ​<!-- 08 -->[ImageList] Migrate ImageListItem to emotion (#24619) @kodai3 +- ​<!-- 09 -->[Card] Migrate CardMedia to emotion (#24625) @natac13 +- ​<!-- 10 -->[Card] Migrate CardHeader to emotion (#24626) @natac13 +- ​<!-- 11 -->[TextField] Migrate FilledInput to emotion (#24634) @mnajdova +- ​<!-- 12 -->[Fab] Migrate to emotion (#24618) @natac13 +- ​<!-- 14 -->[ClickAwayListener] Fix `children` and `onClickAway` types (#24565) @eps1lon +- ​<!-- 15 -->[List] Migrate ListItemIcon to emotion (#24630) @vicasas +- ​<!-- 17 -->[Card] Migrate CardActionArea to emotion (#24636) @natac13 +- ​<!-- 18 -->[DataTable] Add example in docs for data table (#24428) @DanailH +- ​<!-- 19 -->[CircularProgress] Migrate to emotion (#24622) @natac13 +- ​<!-- 20 -->[ImageList] Migrate ImageListItemBar to emotion (#24632) @kodai3 +- ​<!-- 21 -->[TextField] Migrate Input component to emotion (#24638) @duganbrett +- ​<!-- 22 -->[Tab] Migrate to emotion (#24651) @natac13 +- ​<!-- 24 -->[Table] Migrate to emotion (#24657) @natac13 +- ​<!-- 25 -->[List] Migrate ListItemAvatar to emotion (#24656) @vicasas +- ​<!-- 26 -->[TextField] Migrate FormControl to emotion (#24659) @duganbrett +- ​<!-- 27 -->[Table] Migrate TableContainer to emotion (#24666) @natac13 +- ​<!-- 28 -->[Tab] Migrate TabScrollButton to emotion (#24654) @natac13 +- ​<!-- 29 -->[Card] Warn on raised + outlined (#24648) @sumarlidason +- ​<!-- 32 -->[TextField] Migrate FormHelperText to emotion (#24661) @duganbrett +- ​<!-- 33 -->[Dialog] Migrate DialogContent to emotion (#24670) @vicasas +- ​<!-- 36 -->[Typography] Add system props (#24496) @mnajdova +- ​<!-- 38 -->[Paper] Improve warning on invalid combinations of variant and elevation (#24667) @eps1lon +- ​<!-- 39 -->[Chip] Migrate to emotion (#24649) @natac13 +- ​<!-- 41 -->[ToggleButton] Migrate to emotion (#24674) @natac13 +- ​<!-- 42 -->[Step] Migrate to emotion (#24678) @natac13 +- ​<!-- 45 -->[Link] Fix CSS prefix property casing with emotion (#24701) @idanrozin +- ​<!-- 50 -->[Card] Use the default elevation (#24733) @oliviertassinari +- ​<!-- 53 -->[Typography] Remove align inherit noise (#24717) @oliviertassinari +- ​<!-- 56 -->[Dialog] Convert role `none presentation` to `presentation` (#24500) @hallzac2 +- ​<!-- 64 -->[TextField] Improve baseline alignment with start adornment (#24742) @praveenkumar-kalidass +- ​<!-- 65 -->[Popper] Fix usage of ownerDocument with anchorEl (#24753) @ruppysuppy +- ​<!-- 75 -->[Table] Migrate TableBody to emotion (#24703) @natac13 +- ​<!-- 76 -->[Table] Migrate TableRow to emotion (#24687) @natac13 +- ​<!-- 77 -->[TextField] Migrate FormGroup to emotion (#24685) @vicasas +- ​<!-- 82 -->[CssBaseline] Make dark mode scrollbar overrides an optional function (#24780) @dborstelmann +- ​<!-- 83 -->[ButtonGroup] Migrate ButtonGroup to emotion (#24775) @mirefly +- ​<!-- 87 -->[Checkbox] Migrate to emotion (#24702) @natac13 +- ​<!-- 89 -->[Table] Migrate TableHead to emotion (#24686) @natac13 +- ​<!-- 90 -->[Table] Migrate TableFooter to emotion (#24684) @natac13 +- ​<!-- 92 -->[Skeleton] Migrate to emotion (#24652) @kodai3 + +### `@material-ui/system@5.0.0-alpha.25` + +#### Breaking changes + +- ​<!-- 78 -->[system] Use spacing unit in `gap`, `rowGap`, and `columnGap` (#24794) @ruppysuppy + + 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, for example `<Box padding={2}>`. + + ```diff + <Box + - gap={2} + + gap="2px" + > + ``` + +### `@material-ui/styled-engine@5.0.0-alpha.25` + +- ​<!-- 34 -->[styled-engine] Fix GlobalStyles not to throw when no theme is available (#24671) @mnajdova + +### `@material-ui/types@5.0.0-alpha.25` + +#### Breaking changes + +- ​<!-- 91 -->[types] Rename the exported `Omit` type in `@material-ui/types`. (#24795) @petyosi + The module is now called `DistributiveOmit`. The change removes the confusion with the built-in `Omit` helper introduced in TypeScript v3.5. The built-in `Omit`, while similar, is non-distributive. This leads to differences when applied to union types. [See this Stack Overflow answer for further details](https://stackoverflow.com/a/57103940/1009797). + +```diff +-import { Omit } from '@material-ui/types'; ++import { DistributiveOmit } from '@material-ui/types'; +``` + +#### Changes + +- ​<!-- 61 -->[types] Remove implicit children from PropInjector (#24746) @eps1lon + +### `@material-ui/lab@5.0.0-alpha.25` + +- ​<!-- 02 -->[Pickers] Fix role attribute (#24621) @EkaterinaMozheiko +- ​<!-- 35 -->[Pickers] Fix `showTodayButton` not returning the current time (#24650) @anthonyraymond +- ​<!-- 44 -->[Pickers] Ensure components have a display name in DEV (#24676) @eps1lon +- ​<!-- 49 -->[Pickers] Fix more name inconsistencies (#24734) @oliviertassinari +- ​<!-- 54 -->[Pickers] Dismiss on clickaway when using the desktop variant (#24653) @eps1lon +- ​<!-- 69 -->[Pickers] Add missing periods at end of some descriptions (#24791) @fulin426 +- ​<!-- 81 -->[Pickers] Enable YearPicker documentation (#24830) @oliviertassinari +- ​<!-- 88 -->[Pickers] Fix useState related console warnings in examples (#24848) @ydubinskyi + +### Docs + +- ​<!-- 06 -->[docs] Add sorting section (#24637) @dtassone +- ​<!-- 13 -->[docs] Include in docs directive to silence `eslint` erroneous warning (#24644) @silviot +- ​<!-- 23 -->[docs] Clarifying the documentation about Chip behavior (#24645) @KarimOurrai +- ​<!-- 30 -->[docs] Update Typography in migration guide (#24662) @mbrookes +- ​<!-- 37 -->[examples] Update examples to use StyledEngineProvider (#24489) @mnajdova +- ​<!-- 40 -->[docs] Add API documentation for \*DatePicker components (#24655) @eps1lon +- ​<!-- 47 -->[docs] Add HoodieBees to sponsors (#24735) @mbrookes +- ​<!-- 48 -->[docs] Fix indent @oliviertassinari +- ​<!-- 55 -->[docs] Make <main> responsive to font size (#24531) @eps1lon +- ​<!-- 59 -->[docs] Follow similar demo pattern for date and time pickers (#24739) @eps1lon +- ​<!-- 66 -->[docs] Add information about local dev environment (#24771) @plug-n-play +- ​<!-- 67 -->[docs] Add tcespal to Showcase (#24793) @ArnaultNouvel +- ​<!-- 68 -->[docs] Fix CssBaseline typography description (#24802) @xiaoyu-tamu +- ​<!-- 70 -->[docs] Add 'playlist' synonym to 'menu' (#24754) @Lagicrus +- ​<!-- 71 -->[docs] Add more similar icons (#24799) @oliviertassinari +- ​<!-- 72 -->[docs] Fix typo in the error message generated by createMuiTheme (#24827) @mbrookes +- ​<!-- 73 -->[examples] Align more with the v5 recommended approach (#24798) @Tejaswiangotu123 +- ​<!-- 74 -->[docs] Update ButtonGroup demos to match v5 (#24797) @SCollinA +- ​<!-- 84 -->[docs] Fix formatting of `mask` prop description (#24842) @eps1lon +- ​<!-- 92 -->[docs] Add read synonym to drafts (#24854) @Lagicrus + +### Core + +- ​<!-- 01 -->[core] Fix release:tag pushing to material-ui-docs (#24633) @eps1lon +- ​<!-- 16 -->[core] Fix `next` using stale pages (#24635) @eps1lon +- ​<!-- 31 -->[test] Skip JSDOM in style related conformance tests (#24668) @mnajdova +- ​<!-- 43 -->[test] Conformance to handle wrapped elements (#24679) @natac13 +- ​<!-- 51 -->[core] Batch small changes (#24705) @oliviertassinari +- ​<!-- 52 -->[test] Run more tests in Strict Mode (#24646) @oliviertassinari +- ​<!-- 57 -->[test] Avoid visual flakiness (#24737) @oliviertassinari +- ​<!-- 60 -->[core] Remove deprecated SimplifiedPropsOf/Simplify types (#24750) @petyosi +- ​<!-- 62 -->[core] Disable type-checking of .propTypes (#24747) @eps1lon +- ​<!-- 63 -->[test] Allow setting react-dist-tag via pipeline parameter (#24755) @eps1lon +- ​<!-- 79 -->[test] Don't run dev CI for dependabot pushes (#24833) @eps1lon +- ​<!-- 80 -->[test] Isolate Tooltip tests more (#24834) @eps1lon +- ​<!-- 85 -->[test] Clear emotion cache between tests (#24837) @eps1lon +- ​<!-- 86 -->[core] Save/restore actual yarn cache folder (#24844) @eps1lon +- ​<!-- 91 -->[test] Increase timeout to 4000ms for screenshots (#24850) @oliviertassinari + +All contributors of this release in alphabetical order: @anthonyraymond, @ArnaultNouvel, @DanailH, @dborstelmann, @dtassone, @duganbrett, @EkaterinaMozheiko, @eps1lon, @fulin426, @hallzac2, @idanrozin, @KarimOurrai, @kodai3, @Lagicrus, @mbrookes, @mirefly, @mnajdova, @natac13, @oliviertassinari, @petyosi, @plug-n-play, @praveenkumar-kalidass, @ruppysuppy, @SCollinA, @silviot, @sumarlidason, @Tejaswiangotu123, @vicasas, @xiaoyu-tamu, @ydubinskyi + +## 5.0.0-alpha.24 + +<!-- generated comparing v5.0.0-alpha.23..next --> + +_Jan 26, 2021_ + +A big thanks to the 23 contributors who made this release possible. Here are some highlights ✨: + +- 👩‍🎤 Convert 31 components to emotion. Around 40% of the components have been migrated so far thanks to the help of the community. +- 🐛 Fix two long-standing issues with the Grid. Solve the horizontal scrollbar as well as dimensions when nesting (#24332) @greguintow. +- 📚 Fix various display issues on API documentation pages (#24526, #24503, #24504. #24517, #24417). +- 📐 Add a subset of MUI System as flatten props on the CSS utility components (`Grid` and `Box` so far, `Typography` and `Stack` coming later) (#24485, #24499) @mnajdova. + + ```jsx + <Box m={2}> + ``` + +### `@material-ui/core@5.0.0-alpha.24` + +- ​<!-- 85 -->[Dialog] Migrate DialogActions to emotion (#24613) @vicasas +- ​<!-- 84 -->[Toolbar] Migrate to emotion (#24567) @natac13 +- ​<!-- 83 -->[Hidden] Fix unsupported props warning when sx prop is used (#24624) @mnajdova +- ​<!-- 82 -->[List] Migrate ListItemText to emotion (#24602) @natac13 +- ​<!-- 80 -->[List] Migrate ListItemSecondaryAction to emotion (#24593) @xs9627 +- ​<!-- 79 -->[BottomNavigation] Migrate to emotion (#24556) @vinyldarkscratch +- ​<!-- 77 -->[CardActions] Fix wrong classes export name (#24609) @mnajdova +- ​<!-- 76 -->[Card] Migrate CardContent to emotion (#24600) @vicasas +- ​<!-- 75 -->[Card] Migrate to emotion (#24597) @povilass +- ​<!-- 74 -->[TextField] Migrate InputBase to emotion (#24555) @duganbrett +- ​<!-- 73 -->[Accordion] Allow to disable gutter/spacing (#24532) @TimonPllkrn +- ​<!-- 72 -->[List] Migrate to emotion (#24560) @vinyldarkscratch +- ​<!-- 71 -->[Card] Migrate CardActions to emotion (#24604) @vicasas +- ​<!-- 69 -->[List] Migrate ListSubheader to emotion (#24561) @vinyldarkscratch +- ​<!-- 68 -->[Breadcrumbs] Migrate to emotion (#24522) @vinyldarkscratch +- ​<!-- 67 -->[Divider] Migrate to emotion (#24558) @vinyldarkscratch +- ​<!-- 66 -->[Switch] Migrate SwitchBase to emotion (#24552) @vinyldarkscratch +- ​<!-- 65 -->[Hidden] Migrate to emotion (#24544) @vinyldarkscratch +- ​<!-- 64 -->[List] Migrate ListItem to emotion (#24543) @xs9627 +- ​<!-- 62 -->[TextField] Fix Google Translate zero-width space issue (#24563) @d3mp +- ​<!-- 61 -->[Table] Separate classes for different labels (#24568) @tonysepia +- ​<!-- 58 -->[Accordion] Migrate AccordionSummary to emotion (#24540) @vinyldarkscratch +- ​<!-- 57 -->[IconButton] Migrate to emotion (#24542) @vinyldarkscratch +- ​<!-- 54 -->[Accordion] Migrate AccordionActions to emotion (#24538) @vinyldarkscratch +- ​<!-- 53 -->[Accordion] Migrate AccordionDetails to emotion (#24539) @vinyldarkscratch +- ​<!-- 50 -->[Link] Migrate to emotion (#24529) @praveenkumar-kalidass +- ​<!-- 49 -->[Accordion] Migrate to emotion (#24518) @vinyldarkscratch +- ​<!-- 46 -->[Backdrop] Migrate to emotion (#24523) @vinyldarkscratch +- ​<!-- 39 -->[Grid] Add system props (#24499) @mnajdova +- ​<!-- 38 -->[Icon] Migrate to emotion (#24516) @vinyldarkscratch +- ​<!-- 36 -->[Collapse] Migrate to emotion (#24501) @vinyldarkscratch +- ​<!-- 33 -->[SvgIcon] Migrate to emotion (#24506) @oliviertassinari +- ​<!-- 32 -->[Avatar] Migrate AvatarGroup to emotion (#24452) @praveenkumar-kalidass +- ​<!-- 31 -->[Box] Add back system props (#24485) @mnajdova +- ​<!-- 30 -->[Alert] Migrate AlertTitle to emotion (#24448) @povilass +- ​<!-- 26 -->[Alert] Migrate to emotion (#24442) @kutnickclose +- ​<!-- 21 -->[l10n] Improve Hebrew translation (#24449) @eladmotola +- ​<!-- 19 -->[Checkbox][switch] Document defaultChecked (#24446) @praveenkumar-kalidass +- ​<!-- 18 -->[AppBar] Migrate to emotion (#24439) @povilass +- ​<!-- 16 -->[l10n] Improve German translation (#24436) @lukaselmer +- ​<!-- 15 -->[Button][badge] Support custom colors and sizes (#24408) @mnajdova +- ​<!-- 10 -->[Grid] Fix horizontal scrollbar and nested dimensions (#24332) @greguintow +- ​<!-- 07 -->[Grid] Migrate to emotion (#24395) @mnajdova +- ​<!-- 06 -->[Badge] Fix TS custom variants (#24407) @mnajdova + +### `@material-ui/lab@5.0.0-alpha.24` + +- ​<!-- 48 -->[DatePicker] Remove unnecessary wrapping dom node (#24533) @mxsph +- ​<!-- 12 -->[DateRangePicker] Remove variant prop override for Textfield (#24433) @praveenkumar-kalidass +- ​<!-- 03 -->[lab] Reflect draft pattern of picker value in implementation (#24367) @eps1lon + +### `@material-ui/styled-engine@5.0.0-alpha.24` + +- ​<!-- 13 -->[styled-engine] Rename StylesProvider to StyledEngineProvider (#24429) @mnajdova + +### `@material-ui/system@5.0.0-alpha.24` + +- ​<!-- 44 -->[system] Fix handling of null-ish values (#24530) @oliviertassinari + +### `@material-ui/unstyled@5.0.0-alpha.24` + +- ​<!-- 08 -->[unstyled] Convert composeClasses to TypeScript (#24396) @eps1lon + +### `@material-ui/utils@5.0.0-alpha.24` + +- ​<!-- 60 -->[utils] `useEventCallback` `args` defaults to `unknown[]` (#24564) @eps1lon +- ​<!-- 11 -->[utils] Fix requirePropFactory to merge validators (#24423) @mnajdova + +### Docs + +- ​<!-- 86 -->[examples] Patch preact example not working (#24616) +- ​<!-- 78 -->[docs] Add missing newline in component JSDoc (#24610) @eps1lon +- ​<!-- 70 -->[docs] Add API of picker components (#24497) @eps1lon +- ​<!-- 63 -->[examples] Add `locale` prop to the Nextjs Link component (#24596) @CyanoFresh +- ​<!-- 52 -->[docs] List required props first in /api/\* (#24526) @eps1lon +- ​<!-- 45 -->[docs] Mention MUI System props when available in the API pages (#24503) @mnajdova +- ​<!-- 43 -->[docs] Improve system properties page (#24524) @mnajdova +- ​<!-- 42 -->[docs] Fix malformed component API description (#24504) @eps1lon +- ​<!-- 41 -->[docs] Fix ToC "Component name" fragment link on /api/\* (#24517) @eps1lon +- ​<!-- 40 -->[docs] Fix ToC on /api pages linking to api-docs (#24515) @eps1lon +- ​<!-- 37 -->[docs] Add comment explaining specificity bump on Select (#24509) @KarimMokhtar +- ​<!-- 28 -->[docs] Compute spreadable from tests (#24490) @eps1lon +- ​<!-- 27 -->[docs] Fix label bug in stepper vertical demo (#24491) @artola +- ​<!-- 20 -->[docs] Update Divjoy URL (#24447) @mbrookes +- ​<!-- 17 -->[docs] Improve packages description (#24330) @oliviertassinari +- ​<!-- 14 -->[docs] Fix content-layout-shift (#24418) @oliviertassinari +- ​<!-- 09 -->[docs] Document default values of external props (#24417) @eps1lon +- ​<!-- 02 -->[docs] Update in-house ads (#24410) @mbrookes @ewldev + +### Core + +- ​<!-- 87 -->[core] Skip downloading browser binaries in codesandbox/ci (#24628) @eps1lon +- ​<!-- 81 -->[core] Batch small changes (#24599) @oliviertassinari +- ​<!-- 59 -->[test] Simplify DatePicker tests (#24545) @eps1lon +- ​<!-- 51 -->[core] Improve pseudo classes overrides error (#24535) @mnajdova +- ​<!-- 35 -->[core] Fix styleProps to always contain all props (#24505) @mnajdova +- ​<!-- 34 -->[test] Fix AvatarGroup failing test (#24512) @mnajdova +- ​<!-- 29 -->[pickers] Sort tests (#24481) @eps1lon +- ​<!-- 25 -->[test] Split tests in describeConformanceV5 to isolate them (#24479) @mnajdova +- ​<!-- 24 -->[core] Do not forward classes prop by default in experimentalStyled (#24451) @mnajdova +- ​<!-- 23 -->[core] Pass styleProps on all slots in the styled() components (#24454) @mnajdova +- ​<!-- 22 -->[core] Batch small changes (#24445) @oliviertassinari +- ​<!-- 01 -->[core] Normalize generating declaration files (#24411) @eps1lon + +All contributors of this release in alphabetical order: @artola, @CyanoFresh, @d3mp, @duganbrett, @eladmotola, @eps1lon, @ewldev, @greguintow, @KarimMokhtar, @kutnickclose, @lukaselmer, @mbrookes, @mnajdova, @mxsph, @natac13, @oliviertassinari, @povilass, @praveenkumar-kalidass, @TimonPllkrn, @tonysepia, @vicasas, @vinyldarkscratch, @xs9627 + +## 5.0.0-alpha.23 + +_Jan 14, 2021_ + +A big thanks to the 15 contributors who made this release possible. Here are some highlights ✨: + +- 📚 Only document public paths in module augmentation (#24267) @eps1lon +- 👩‍🎤 Migrate the Paper and CssBaseline to emotion (#24397, #24176) @povilass @mnajdova + + We have reached a point where we feel confident that the new approach should make it to v5 stable. An issue has been created to track the progress with the migration to emotion: #24405. Your contribution to this effort and the ones from the community are welcome 🙌. + +- 📅 Various improvements on the date picker components (#24301, #24309, #24275, #24298, #24319) @m4theushw @eps1lon @huzaima @praveenkumar-kalidass +- And many more 🐛 bug fixes and 📚 improvements. + +### `@material-ui/core@v5.0.0-alpha.23`/`@material-ui/unstyled@v5.0.0-alpha.23` + +- [Container] Fix disableGutters style not applied (#24284) @povilass +- [Paper] Migrate to emotion (#24397) @povilass +- [Slider] Allow mobile VO users to interact with Sliders (#23902) @CodySchaaf +- [SwipeableDrawer] Add bleeding demo (#24268) @vicasas +- [SwipeableDrawer] Fix overflow scroll computation logic (#24225) @yann120 +- [Table] Fix "more than" translation in es-ES (#24356) @vicasas +- [TextField] Fix error color for form input with secondary color (#24290) @praveenkumar-kalidass +- [Button] Fix resolution of default props (#24253) @oliviertassinari + +### `@material-ui/lab@v5.0.0-alpha.23` + +#### Breaking changes + +- [DateRangePicker] Remove DateRangDelimiter (#24298) @huzaima + + You can migrate away from it with: + + ```diff + diff --git a/docs/src/pages/components/date-range-picker/BasicDateRangePicker.tsx b/docs/src/pages/components/date-range-picker/BasicDateRangePicker.tsx + index 72a89f9a11..2742fa6811 100644 + --- a/docs/src/pages/components/date-range-picker/BasicDateRangePicker.tsx + +++ b/docs/src/pages/components/date-range-picker/BasicDateRangePicker.tsx + @@ -3,7 +3,7 @@ import TextField from '@material-ui/core/TextField'; + import DateRangePicker, { DateRange } from '@material-ui/lab/DateRangePicker'; + import AdapterDateFns from '@material-ui/lab/AdapterDateFns'; + import LocalizationProvider from '@material-ui/lab/LocalizationProvider'; + -import DateRangeDelimiter from '@material-ui/lab/DateRangeDelimiter'; + +import Box from '@material-ui/core/Box'; + + export default function BasicDateRangePicker() { + const [value, setValue] = React.useState<DateRange<Date>>([null, null]); + @@ -20,7 +20,7 @@ export default function BasicDateRangePicker() { + renderInput={(startProps, endProps) => ( + <React.Fragment> + <TextField {...startProps} variant="standard" /> + - <DateRangeDelimiter> to </DateRangeDelimiter> + + <Box sx={{ mx: 2 }}>to</Box> + <TextField {...endProps} variant="standard" /> + </React.Fragment> + )} + ``` + +#### Changes + +- [DatePicker] Fix out of range month selection (#24301) @m4theushw +- [DatePicker] Replace withDefaultProps with useThemeProps (#24309) @m4theushw +- [DatePicker] Simplify ExtendWrapper type (#24275) @eps1lon +- [DatePicker] Reduce coupling of parsing picker input value and props (#24319) @eps1lon +- [TimePicker] Add pointer cursor for clock in desktop (#24276) @praveenkumar-kalidass +- [lab] Drop usage of createStyles (#24158) @eps1lon +- [lab] Fix import paths in generated declaration files (#24380) @eps1lon +- [lab] Prevent possible null pointer in useValidation (#24318) @eps1lon + +### `@material-ui/styled-engine@v5.0.0-alpha.23`/`@material-ui/styled-engine-sc@v5.0.0-alpha.23` + +- [styled-engine] Add `GlobalStyles` component (#24176) @mnajdova + +### Docs + +- [docs] Add example performance Stepper vertical (#24292) @vicasas +- [docs] Change Link example from JS to TS (#24291) @vicasas +- [docs] Do not show 'Add' if user input matches existing option (#24333) @ramdog +- [docs] Focus docs search input when the shortcut is clicked (#24296) @eps1lon +- [docs] Further template the CSS API descriptions (#24360) @mbrookes +- [docs] Improve Next.js Link integration (#24258) @oliviertassinari +- [docs] Misc API fixes (#24357) @mbrookes +- [docs] Prevent kbd to wrap (#24269) @oliviertassinari +- [docs] Simplify icon button docs (#24317) @baharalidurrani +- [docs] Standardize some API descriptions (#24274) @mbrookes +- [docs] Sync AppSearch.tsx with AppSearch.js (#24363) @Lagicrus +- [docs] Update CONTRIBUTING being accepted (#24306) @vicasas +- [docs] Update right to left compatibility plugin version (#24370) @mnajdova +- [docs] Widen example datetime-local picker so it's not clipped (#24324) @ramdog +- [website] Add BrandingFooter (#24095) @mnajdova +- [website] Add Discover more (#24327) @oliviertassinari +- [website] Add newsletter (#24322) @oliviertassinari +- [website] Fix regressions @oliviertassinari +- [website] Improve typography theme (#24386) @oliviertassinari + +### Core + +- [core] Create issue labeled (#24283) @xrkffgg +- [core] Fix eslint @oliviertassinari +- [core] Skip downloading browser binaries when building docs (#24393) @eps1lon +- [core] Small changes (#24329) @oliviertassinari +- [core] Support public paths in module augmentation (#24267) @eps1lon +- [core] Update classes generation logic (#24371) @mnajdova +- [core] Update issue mark duplicate (#24311) @xrkffgg +- [core] Update issues helper version (#24379) @xrkffgg +- [test] Add pipeline task for performance monitoring (#24289) @eps1lon +- [test] Compensate for Circle CI's low performance (#24358) @oliviertassinari +- [test] Debug expensive GH actions still runing for l10nbot (#24392) @eps1lon +- [test] Move callback args to right side of assertion (#24366) @eps1lon +- [test] Persist new declaration files in CI cache (#24313) @eps1lon +- [test] Reduce download times of playwright binaries (#24364) @eps1lon +- [test] Skip expensive GitHub actions on l10nbot commits (#24303) @eps1lon +- [test] Test declaration files in TS nightly (#24391) @eps1lon +- [styles] Define useThemeProps as unstable and fix TS issues (#24383) @mnajdova + +## 5.0.0-alpha.22 + +_Jan 4, 2021_ + +A big thanks to the 14 contributors who made this release possible. Here are some highlights ✨: + +- ♿️ Fix major accessibility issue with the Autocomplete (#24213) @inform880 +- 👩‍🎤 Migrate the Container to emotion (#24227) @oliviertassinari +- 🐛 Fix Next.js regression and other cross-platform issues with the build (#24200, #24223) +- And many more 🐛 bug fixes and 📚 improvements. + +### `@material-ui/core@v5.0.0-alpha.22`/`@material-ui/unstyled@v5.0.0-alpha.22` + +- [Autocomplete] Fix VoiceOver not reading the correct activedescendant (#24213) @inform880 +- [Autocomplete] Warn when value is invalid (#24202) @Sandeep0695 +- [Button] Fix disableElevation regression (#24251) @oliviertassinari +- [Container] Migrate to emotion (#24227) @oliviertassinari +- [Pagination] Fix className forwarding when type is ellipsis (#24256) @andrelmlins +- [Select] Improve description on how it extends the Input components (#24180) @azza85 +- [styled] Fix missing types for `sx` (#24211) @mnajdova +- [styled] Remove unused type parameters from StyledOptions (#24255) @eps1lon +- [styled] Support components without theme (#24214) @mnajdova +- [styles] Fix classes logic (#24250) @oliviertassinari +- [styles] Improve the classes structure (#24249) @oliviertassinari + +### `@material-ui/lab@v5.0.0-alpha.22` + +- [DatePicker] Fix year only view, hide the current month (#24205) @hyeonhong +- [DatePicker] Nested imports for better DX (#24147) @oliviertassinari +- [DatePicker] Remove unused type parameters (#24257) @eps1lon +- [TimePicker] Prevent conflicting type parameter in `ClockProps#getClockLabelText` (#24193) @eps1lon + +### Docs + +- [docs] Accept pages written in TypeScript (#24230) @oliviertassinari +- [docs] Document emotion migration breaking changes (#24229) @luminaxster +- [docs] Fix broken benchmark link (#24210) @jalaj-k +- [docs] Fix codesandbox datagrid demo (#24218) @brno32 +- [docs] Fix iframe demos with emotion (#24232) @oliviertassinari +- [docs] Sync translations (#24161) @l10nbot + +### Core + +- [test] More granular progress tracking of relative type imports (#24233) @eps1lon +- [core] Add missing sx typings on the components migrated to emotion (#24208) @mnajdova +- [core] Batch small changes (#24224) @oliviertassinari +- [core] Create issue mark duplicate (#24184) @xrkffgg +- [core] Fix generation of package.json (#24223) @oliviertassinari +- [core] Fix relative import of types (#24248) @oliviertassinari +- [core] Platform agnostic build script for envinfo (#24200) @eps1lon +- [core] Remove unused generics from experimentalStyled (#24192) @eps1lon + +## 5.0.0-alpha.21 + +_Dec 30, 2020_ + +A big thanks to the 14 contributors who made this release possible. Here are some highlights ✨: + +- 👩‍🎤 Migrate the Avatar to emotion (#24114) @oliviertassinari +- 👩‍🎤 Migrate the Button to emotion (#24107, #24100) @mnajdova +- ♿️ Improve TrapFocus behavior, ignore the container as a tabbable element (#23364) @gregnb + In rare cases, an element might not longer be tabbable when looping, for example overflow container in Firefox. + You can work around the problem by adding a `tabIndex={0}` or customizing the `getTabbable` prop. +- And many more 🐛 bug fixes and 📚 improvements. + +### `@material-ui/core@v5.0.0-alpha.21`/`@material-ui/unstyled@v5.0.0-alpha.21` + +- [Avatar] Migrate to emotion (#24114) @oliviertassinari +- [ButtonBase] Migrate styles to emotion (#24100) @mnajdova +- [Button] Migrate styles to emotion (#24107) @mnajdova +- [unstyled] Add utils for generating utility classes (#24126) @mnajdova +- [FocusTrap] Fix trap to only focus on tabbable elements (#23364) @gregnb +- [Link] Improve integration with Next.js (#24121) @kelvinsanchez15 +- [Select] Fix overflow showing scrollbar (#24085) @Segebre +- [Slider] Fix circular type reference in SliderValueLabel (#24190) @eps1lon +- [Skeleton] Fix default TypeScript component type (#24191) @eps1lon + +### `@material-ui/system@v5.0.0-alpha.21` + +- [system] Fix sx prop typings to support grid gap props (#24093) @mnajdova +- [system] Improve the SxProp typings structure, by splitting them in a separate module. (#24090) @mnajdova +- [system] Replace grid gap properties (#24094) @mnajdova + +### `@material-ui/lab@v5.0.0-alpha.21` + +- [DatePicker] Allow to customize icons (#24017) @jackcwu +- [DatePicker] Fix missing component for theme augmentation (#24092) @rajzik +- [DatePicker] Hide outline on container (#24108) @oliviertassinari +- [DatePicker] Fix accessibility issue with heading (#24183) @gracektay +- [TimePicker] Improve the design to fit on smaller screens (#23855) @marianayap +- [TreeView] Add preventScroll for tree focus (#24105) @praveenkumar-kalidass + +### `@material-ui/styles@v5.0.0-alpha.21` + +- [styles] Fix for supporting non string props in propsToClassKey (#24101) @mnajdova + +### `@material-ui/styled-engine@v5.0.0-alpha.21`/`@material-ui/styled-engine-sc@v5.0.0-alpha.21` + +- [styled-engine] Fix StylesProvider injectFirst with sc (#24104) @mnajdova + +### Docs + +- [docs] Add examples for adding and removing Typography variants (#24088) @mnajdova +- [docs] Fix typo (#24123) @ajonp +- [docs] Fix warning about wrong prop type (#24117) @mnajdova +- [docs] Rename "Customization > Theme > Global" to "Customization > Theme > Components" (#24115) @mnajdova +- [docs] Rename customization/components to customization/how-to-customize (#24089) @mnajdova +- [docs] Replace process.browser with typeof navigator (#24122) @softshipper +- [docs] Sync translations (#24152) @l10nbot +- [docs] Update Fontsource install instructions (#24120) @DecliningLotus +- [docs] Add system grid page (#24119) @mnajdova +- [blog] 2020 in review and beyond (#24130) @oliviertassinari +- [docs] Improve naming and structure of the Customization and Guide pages (#24175) @mnajdova + +### Core + +- [core] Batch small changes (#24131) @oliviertassinari +- [core] Fix overridesResolver on the core components and added tests (#24125) @mnajdova +- [core] Reduce number of files included in language server (#24165) @eps1lon +- [core] Reduce response time of initial PR bot comment (#24168) @eps1lon +- [core] Refactor styled() components to ease out the migration process (#24124) @mnajdova +- [test] Add more packages to browser test suite (#24155) @eps1lon +- [core] Monitor progress of fixing type imports (#24188) @eps1lon +- [core] Fix build on Windows (#24187) @oliviertassinari + +## 5.0.0-alpha.20 + +_Dec 21, 2020_ + +A big thanks to the 13 contributors who made this release possible. Here are some highlights ✨: + +- 👩‍🎤 Migrate the Typography to emotion (#23841) @DanailH + + This change allows to add typography variants in the theme and to use them directly: + + ```jsx + const theme = createMuiTheme({ + typography: { + poster: { + color: 'red', + }, + }, + }); + <Typography variant="poster">poster</Typography>; + ``` + + [A full demo](https://codesandbox.io/p/sandbox/fontsizetheme-material-demo-forked-l9u05?file=/demo.tsx:725-773) + +- 📚 Add a shortcut to open the Algolia search (#23959) @hmaddisb. +- And many more 🐛 bug fixes and 📚 improvements. + +### `@material-ui/core@v5.0.0-alpha.20`/`@material-ui/unstyled@v5.0.0-alpha.20` + +#### Breaking changes + +- [CssBaseline] Change body font size to body1 (1rem) (#24018) @mbrookes + + The new default matches the variant used by the Typography component. To return to the previous size, you can override it in the theme: + + ```js + const theme = createMuiTheme({ + typography: { + body1: { + fontSize: '0.875rem', + }, + }, + }); + ``` + +#### Changes + +- [Badge] Fix the classes description to reflect the correct component (#24035) @mnajdova +- [Select] Fix aria-describedby attribute (#24027) @HVish +- [Skeleton] Fix Circle border radius on Safari (#24054) @anatolzak +- [Slider][badge] Fix classes prop not working (#24034) @mnajdova +- [Typography] Migrate styles to emotion (#23841) @DanailH + +### `@material-ui/styled-engine@v5.0.0-alpha.20`/`@material-ui/styled-engine-sc@v5.0.0-alpha.20` + +- [styled-engine] Add name and slot options (#23964) @mnajdova +- [styled-engine] Add StylesProvider with injectFirst option (#23934) @mnajdova + +### `@material-ui/system@v5.0.0-alpha.20` + +- [system] Fix transform not firing when theme provided (#24010) @ZovcIfzm + +### Docs + +- [docs] Add a shortcut to access the search bar (#23959) @hmaddisb +- [docs] Animate component's mounting and unmounting (#24049) @cjoecker +- [docs] Fix collapse API docs description of 'hidden' style condition (#24053) @jaiwanth-v +- [docs] Improve color demo snippet spacing (#24009) @yukinoda +- [docs] Improve displayed versions (#24051) @oliviertassinari +- [docs] Show a better file on codesandbox (#24052) @oliviertassinari +- [docs] Update customization/components and customization/global pages (#24016) @mnajdova +- [docs] Update the CSS injection guide (#24020) @mnajdova + +### Core + +- [core] Batch small changes (#24038) @oliviertassinari +- [core] Track size of /unstyled (#24021) @eps1lon +- [core] Use consistent naming scheme for ttp annotations (#24022) @eps1lon + +## 5.0.0-alpha.19 + +_Dec 13, 2020_ + +A big thanks to the 24 contributors who made this release possible. Here are some highlights ✨: + +- 👩‍🎤 Migrate the Badge to emotion (#23745) @mnajdova. +- 🌏 Add infrastructure to translate the API pages (#23852) @mbrookes. +- And many more 🐛 bug fixes and 📚 improvements. + +### `@material-ui/core@v5.0.0-alpha.19` + +#### Breaking changes + +- [Icon][svgicon] Change default fontSize from default to medium (#23950) @mbrookes + + The default value of `fontSize` was changed from `default` to `medium` for consistency. + In the unlikey event that you were using the value `default`, the prop can be removed: + + ```diff + -<SvgIcon fontSize="default">{iconPath}</SvgIcon> + +<SvgIcon>{iconPath}</SvgIcon> + ``` + +- [TextField] Add size prop for outlined and filled input (#23832) @mayralgr + + Rename `marginDense` and `inputMarginDense` classes to `sizeSmall` and `inputSizeSmall` to match the prop. + +#### Changes + +- [Autocomplete] Document onChange last `details` param (#23942) @natac13 +- [Autocomplete] Fix useAutocomplete groupedOptions type (#23854) @ZachCMP +- [Autocomplete] Improve DX/UX when getOptionLabel is not configured correctly (#23884) @marianayap +- [Autocomplete] Improve getOptionSelected description (#23817) @smartshivkat +- [Badge] Create unstyled component & move to emotion (#23745) @mnajdova +- [Grid] Improve support for nested grid (#23913) @gbrochar +- [Grid] Fix side effects when direction="column" and xs={} is used (#23900) @Kai-W +- [Select] Fix description, value is not required (#23940) @natac13 +- [Slider] Remove color prop in unstyled (#23840) @mnajdova +- [Slider] Replaced inlined isHostComponent with the utils (#23880) @mnajdova +- [SwipeableDrawer] Refactor internals (#23944) @eps1lon +- [TextField] Add documentation for hidden label (#23915) @Fredestrik +- [TextField] Fix the color leak of the textbox (#23912) @szabgab +- [useMediaQuery] Fix a false return at the first call (#23806) @marthaerm +- [utils] Fix minified errors throwing with \_formatMuiErrorMessage (#23828) @eps1lon + +### `@material-ui/unstyled@v5.0.0-alpha.19` + +- [core] Use Lerna to publish (#23793) @oliviertassinari + +### `@material-ui/system@v5.0.0-alpha.19` + +#### Breaking changes + +- [system] Move visually hidden helper to utils (#23974) @eps1lon + + Only applies if you've installed v5.0.0-alpha.1 + + ```diff + -import { visuallyHidden } from '@material-ui/system'; + +import { visuallyHidden } from '@material-ui/utils'; + ``` + +#### Changes + +- [core] Use Lerna to publish (#23793) @oliviertassinari + +### `@material-ui/lab@v5.0.0-alpha.19` + +- [core] Use Lerna to publish (#23793) @oliviertassinari + +### `@material-ui/utils@v5.0.0-alpha.19` + +- [core] Use Lerna to publish (#23793) @oliviertassinari + +### `@material-ui/styles@v5.0.0-alpha.19` + +- [core] Use Lerna to publish (#23793) @oliviertassinari + +### Docs + +- [example] Change Box to new sx prop (#23937) @natac13 +- [example] Explain package choice (#23938, #23958) @mnajdova +- [example] Update nextjs examples to fix hydration (#23936) @mnajdova +- [docs] Add API tradeoff section for the sx prop (#23962) @mnajdova +- [docs] Add ELEVATOR to backers (#23977) @mbrookes +- [docs] Add eslint rule to docs (#23843) @jens-ox +- [docs] Add infrastructure to translate API pages (#23852) @mbrookes +- [docs] Add link to the sx docs page in the API description (#23967) @mnajdova +- [docs] Add prepend option on emotion caches to allow JSS style overrides (#23892) @mnajdova +- [docs] Add Vercel deploy config (#23910) @eps1lon +- [docs] Allow codesandbox deploy for demos in X (#23644) @oliviertassinari +- [docs] Copy icons to clipboard (#23850) @CodeWithGuruji +- [docs] Fix breakpoints typos (#23893) @mnajdova +- [docs] Fix color contrast of code within links (#23819) @eps1lon +- [docs] Fix duplicated styles generated from emotion (#23809) @mnajdova +- [docs] Fix icon alignment in /components/breadcrumbs (#23818) @eps1lon +- [docs] Fix production deploy (#23963) @eps1lon +- [docs] Fix source on GitHub links (#23821) @praveenkumar-kalidass +- [docs] Fix StickyHeaderTable round borders (#23882) @antoniopacheco +- [docs] Fix typo in date picker dayjs adapter name (#23935) @andresmrm +- [docs] Improve system properties page (#23961) @mnajdova +- [docs] Link module augmentation in TypeScript @oliviertassinari +- [docs] Make stable width of localization example (#23820) @sujinleeme +- [docs] Mention Adobe XD (#23978) @oliviertassinari +- [docs] Prefer system shorthands (#23970) @oliviertassinari +- [docs] Remove 'TODO' comment from buildApi script (#23973) @mbrookes +- [docs] Sync translations (#23742, #23842) @l10nbot +- [docs] Update Badge examples to use Box instead of makeStyles (#23927) @mnajdova + +### Core + +- [test] Add conformance tests for testing the `theme.components` options for the v5 components (#23896) @mnajdova +- [test] Include type path mappings in language server (#23905) @eps1lon +- [test] Make Popper tests StrictMode agnostic (#23838) @eps1lon +- [test] Run benchmarks in Azure Pipelines when approved (#23895) @eps1lon +- [test] Skip tests with cascading network requests (#23823) @eps1lon +- [core] All packages are published from /build (#23886) @oliviertassinari +- [core] Batch small changes (#23853) @oliviertassinari +- [core] Fix failing CI on HEAD (#23947) @oliviertassinari +- [core] Force LF for text files (#23932) @eps1lon +- [core] Improve envinfo instructions (#23918) @eps1lon +- [core] Replace fs-extra deprecated function (exists) (#23848) @leonardopliski +- [core] Use Lerna to publish (#23793) @oliviertassinari +- [core] Use playwright instead of puppeteer (#23906) @eps1lon +- [core] Add envinfo --json flag (#23883) @eps1lon +- [core] Ask for output from envinfo in issues (#23881) @eps1lon + +## 5.0.0-alpha.18 + +_Dec 3, 2020_ + +A big thanks to the 17 contributors who made this release possible. Here are some highlights ✨: + +- Fix most of the issues with MUI System (#23716, #23635, #23737, #23733, #23700, #23688) @mnajdova. +- And many more 🐛 bug fixes and 📚 improvements. + +### `@material-ui/core@v5.0.0-alpha.18` + +#### Breaking changes + +- [Box] Remove deprecated props (#23716) @mnajdova + All props are now available under the `sx` prop. A deprecation will be landing in v4. + Thanks to @mbrookes developers can automate the migration with a [codemod](https://github.com/mui/material-ui/blob/v5.0.0/packages/mui-codemod/README.md#box-sx-prop). + + ```diff + -<Box p={2} bgcolor="primary.main"> + +<Box sx={{ p: 2, bgcolor: 'primary.main' }}> + ``` + +#### Changes + +- [Autocomplete] Add ability to override key down events handlers (#23487) @hessaam +- [Autocomplete] Better isolate test case (#23704) @oliviertassinari +- [Autocomplete] Fix highlight change event (#23718) @TakumaKira +- [Box] Fix TypeScript issue when component prop is used (#23686) @mnajdova +- [experimentalStyled] Make sx style fn optional (#23714) @mnajdova +- [l10n] Improve Brazilian (pt-BR) locale (#23707) @m4rcelofs +- [l10n] Improve Korean (ko-KR) locale (#23794) @sujinleeme +- [Select] Add disabled attribute in input element when disabled (#23778) @praveenkumar-kalidass +- [Switch] Add preventDefault check for state change (#23786) @praveenkumar-kalidass +- [Tabs] Remove duplicate styles (#23561) @cmfcmf + +### `@material-ui/system@v5.0.0-alpha.18` + +- [system] Allow values to use shorter string when the prop name is contained in the value (#23635) @mnajdova +- [system] Another round of perf improvements (#23737) @mnajdova +- [system] Fix transform return value to support CSSObject (#23733) @mnajdova +- [system] Make borderRadius multiply a theme's design token (#23700) @mnajdova +- [system] Various perf gain experiments (#23688) @mnajdova + +### `@material-ui/styles@v5.0.0-alpha.18` + +- [styles] Small performance gain (#23749) @oliviertassinari +- [styles] Update mergeClasses types to more closely match its implementation (#23705) @etrepum + +### `@material-ui/utils@v5.0.0-alpha.18` + +- [system] Another round of perf improvements (#23737) @mnajdova + +### `@material-ui/lab@v5.0.0-alpha.18` + +- [DatePicker] Found one prop that was renamed (#23676) @oliviertassinari +- [DateRangePicker] Allow same date selection (#23701) @hmaddisb + +### `@material-ui/styled-engine@v5.0.0-alpha.18`/`@material-ui/styled-engine-sc@v5.0.0-alpha.18` + +- [styled-engine] Fix tagged template syntax with multiple expressions (#23269) @eps1lon + +### Docs + +- [docs] Add settings panel to allow system mode (#23722) @mbrookes +- [docs] Add v5 peer dependencies in README (#23751) @johnrichardrinehart +- [docs] Document using codesandbox-ci (#23800) @brorlarsnicklas +- [docs] Fix link name for canadacasino (#23799) @eps1lon +- [docs] Fix various a11y issues reported by lighthouse (#23791) @eps1lon +- [docs] Improve prop descriptions (#23723) @oliviertassinari +- [docs] Improve SEO structure (#23748) @oliviertassinari +- [docs] Improve settings toggle button styling (#23754) @mbrookes +- [docs] Misc fixes (#23756) @mbrookes +- [docs] Move instructions for starting the docs earlier in the file (#23801) @brorlarsnicklas +- [docs] Prepare v5.0.0-alpha.17 (#23680) @oliviertassinari +- [docs] Remove unused abstraction (#23724) @oliviertassinari +- [docs] Sync translations (#23682) @l10nbot + +### Core + +- [benchmark] Improve printed results (#23729) @oliviertassinari +- [benchmark] Test styleFunctionSx vs. @styled-system/css (#23702) @mnajdova +- [benchmark] Update with latest (#23694) @oliviertassinari +- [core] Batch small changes (#23678) @oliviertassinari +- [core] Fix ci @oliviertassinari +- [core] Fix error handling on upload (#23734) @eps1lon +- [core] Fully clear composite TypeScript project state (#23805) @eps1lon +- [core] Remove unused classes (#23473) @jens-ox +- [test] Add conformance test suite for v5 (#23798) @mnajdova +- [test] Cleanup skipped tests (#23732) @eps1lon +- [test] Misc improvements to experimental and browser test runner (#23699) @eps1lon +- [test] Stay busy until document.fonts is ready (#23736) @eps1lon + +## 5.0.0-alpha.17 + +_Nov 23, 2020_ + +A big thanks to the 18 contributors who made this release possible. Here are some highlights ✨: + +- 📚 Improve the IntelliSense support for the `sx` prop (#23599) @mnajdova. + You should now get a description for each property of MUI System. For instance with `mx`: + + ![system TypeScript](https://user-images.githubusercontent.com/3165635/99920493-20f60a00-2d24-11eb-8748-c5dd7fe85cbd.png) + +- 💅 Migrate the first core component to the v5 styling architecture (#23308) @mnajdova. + We have spent the last few months iterating on the new styling approach in the lab, and are confident enough in the new approach to move it to the core, so we have migrated the Slider. We will wait a week or two to collect feedback on it, before scaling it to the rest of the codebase. +- 📅 Fix the first few issues on the date picker components since the migration in the lab. +- And many more 🐛 bug fixes and 📚 improvements. + +### `@material-ui/core@v5.0.0-alpha.17` + +#### Breaking changes + +- [Slider] Migrate to emotion (#23308) @mnajdova + + By default, emotion injects its style after JSS, this breaks the computed styles. In order to get the correct CSS injection order until all the components are migrated, you need to wrap the root of your application with: + + ```jsx + import * as React from 'react'; + import ReactDOM from 'react-dom'; + import { StylesProvider } from '@material-ui/core'; + import App from './App'; + + ReactDOM.render( + <StylesProvider injectFirst> + <App /> + </StylesProvider>, + document.querySelector('#root'), + ); + ``` + + This enforces emotion being injected first. [More details](https://mui.com/material-ui/integrations/interoperability/#css-injection-order) in the documentation. + +- [Autocomplete] Rename `closeIcon` prop with `clearIcon` to avoid confusion (#23617) @akhilmhdh. + + ```diff + -<Autocomplete closeIcon={icon} /> + +<Autocomplete clearIcon={icon} /> + ``` + +- [Dialog] Remove the `disableBackdropClick` prop. It's redundant with the `reason` argument (#23607) @eps1lon. + + ```diff + <Dialog + - disableBackdropClick + - onClose={handleClose} + + onClose={(event, reason) => { + + if (reason !== 'backdropClick') { + + onClose(event, reason); + + } + + }} + /> + ``` + +- [Modal] Remove the `disableBackdropClick` prop. It's redundant with the `reason` argument (#23607) @eps1lon. + + ```diff + <Modal + - disableBackdropClick + - onClose={handleClose} + + onClose={(event, reason) => { + + if (reason !== 'backdropClick') { + + onClose(event, reason); + + } + + }} + /> + ``` + +- [Modal] Remove the `onEscapeKeyDown` prop. It's redundant with the `reason` argument. (#23571) @eps1lon + + ```diff + <Modal + - onEscapeKeyDown={handleEscapeKeyDown} + + onClose={(event, reason) => { + + if (reason === "escapeKeyDown") { + + handleEscapeKeyDown(event); + + } + + }} + />; + ``` + +#### Changes + +- [CircularProgress][linearprogress] Change components from div to span (#23587) @bruno-azzi +- [Grid] Improve warning when a prop is missing (#23630) @udayRedI +- [Icon] Allow customizing the 'material-icons' base class name (#23613) @rart +- [Select] Fix focus() call on ref (#23302) @reedanders +- [Slider] Add test case for triggering a specific value (#23642) @Thehambalamba +- [Slider] General cleanup and add classes prop for unstyled (#23569) @mnajdova +- [styles] Add support for TypeScript 4.1 (#23633) @eps1lon + +### `@material-ui/codemod@v5.0.0-alpha.17` + +- [codemod] Add moved-lab-modules (#23588) @eps1lon + This codemod is part of our effort to make the migration from v4 to v5 as painless as possible. + +### `@material-ui/utils@v5.0.0-alpha.17` + +- [Grid] Improve warning when a prop is missing (#23630) @udayRedI + +### `@material-ui/system@v5.0.0-alpha.17` + +- [system] Improve the `sx` prop IntelliSense (#23599) @mnajdova + +### `@material-ui/unstyled@v5.0.0-alpha.17` + +- [Slider] Replace core Slider with SliderStyled (#23308) @mnajdova + +### `@material-ui/lab@v5.0.0-alpha.17` + +#### Breaking changes + +- [DatePicker] Change the import path of the date adapters (#23568) @eps1lon. + It better fits with the current import convention. + + ```diff + -import AdapterDateFns from '@material-ui/lab/dateAdapter/date-fns'; + +import AdapterDateFns from '@material-ui/lab/AdapterDateFns'; + ``` + +#### Changes + +- [DatePicker] Add missing exports (#23621) @havgry +- [DatePicker] Add missing TypeScript definitions (#23560) @mbrookes +- [DatePicker] Fix false-positive when validating mask in Safari (#23602) @eps1lon +- [DatePicker] Fix missing manifest for TypeScript packages (#23564) @eps1lon +- [TimePicker] Prevent scroll when interacting with the clock (#23563) @knightss27 + +### Docs + +- [docs] Add advanced page for MUI System (#23596) @mnajdova +- [docs] Add docs for typography in system (#23510) @oliviertassinari +- [docs] API pages i18n (#23214) @mbrookes +- [docs] Create pickers migration guide (#23605) @dmtrKovalenko +- [docs] Enable TS language service for docs/src (#23576) @eps1lon +- [docs] Explain the information listed on MUI System properties page (#23566) @mnajdova +- [docs] Fix /api client-side routing (#23586) @eps1lon +- [docs] Fix the Box section title on migration-v4 guide (#23679) @claudioldf +- [docs] Generate default values for docs from the unstyled components (#23614) @mnajdova +- [docs] Increase printWidth from 80 to 85(#23512) @eps1lon +- [docs] Prevent layout jumps from img loading in system demo (#23504) @eps1lon +- [docs] Remove controlled Tooltip example in Slider (#23625) @micsidoruk +- [docs] Remove dead demos in MUI System basics page (#23565) @mnajdova +- [docs] Replace emotion-server packages with @emotion/server (#23557) @numToStr +- [docs] Sync translations (#23648) @l10nbot + +### Core + +- [core] Add support for TypeScript 4.1 (#23633) @eps1lon +- [core] Batch small changes (#23554) @oliviertassinari +- [core] Cleanup emotion dependencies (#23556) @eps1lon +- [core] Fix formatting (#23567) @eps1lon +- [core] Fix tracked component size regression (#23516) @eps1lon +- [core] Fix transpilation target of UMD bundle (#23618) @eps1lon +- [test] Create chunks for Argos (#23518) @oliviertassinari +- [test] Debug argos-cli upload failures (#23623) @eps1lon +- [test] Enable experimental-timezone tests (#23595) @eps1lon +- [test] Misc visual regression flakiness improvements (#23619) @eps1lon +- [test] Use playwright instead of vrtest (#23500) @eps1lon + +## 5.0.0-alpha.16 + +_Nov 14, 2020_ + +A big thanks to the 34 contributors who made this release possible. Here are some highlights ✨: + +- 📅 Migrate the date picker to the lab (#22692) @dmtrKovalenko. + We have integrated the components with the code infrastructure. Next we will migrate all the GitHub issues from [material-ui-pickers](https://github.com/mui/material-ui-pickers) and archive the repository. This migration will help provide first-class support for the date picker components. The component will stay in the lab as long as necessary to reach the high-quality bar we have for core components. You can find the [new documentation here](https://mui.com/components/pickers/). + + While the source code is currently hosted in the [main repository](https://github.com/mui/material-ui), we might move it to the [x repository](https://github.com/mui/mui-x) in the future, depending on what is easier for the commercial date range picker. The date picker will stay open source no matter what. + +- 📚 Revamp the documentation for [MUI System](https://mui.com/system/getting-started/). The System contains CSS utilities. The documentation now promotes the use of the `sx` prop. It's ideal for adding one-off styles, for example padding, but when pushed to its limits, it can be used to implement quickly a complete page. +- 👩‍🎨 Upgrade emotion to v11 (#23007) @mnajdova. +- And many more 🐛 bug fixes and 📚 improvements. + +### `@material-ui/core@v5.0.0-alpha.16` + +#### Breaking changes + +- [TextField] Change default variant from standard to outlined (#23503) @mbrookes + Standard has been removed from the Material Design guidelines. [This codemod](https://github.com/mui/material-ui/tree/next/packages/mui-codemod#variant-prop) will automatically update your code. + + ```diff + -<TextField value="Standard" /> + -<TextField value="Outlined" variant="outlined" /> + +<TextField value="Standard" variant="standard" /> + +<TextField value="Outlined" /> + ``` + +- [Autocomplete] Remove `debug` in favor of `open` and dev tools (#23377) @eps1lon + There are a couple of simpler alternatives: `open={true}`, Chrome devtools ["Emulate focused"](https://x.com/sulco/status/1305841873945272321), or React devtools props. + +#### Changes + +- [Autocomplete] Use Popper when `disablePortal` (#23263) @eps1lon +- [Box] Better DX for deprecated props (#23285) @eps1lon +- [codemod] Add a codemod for the Box sx prop (#23465) @mbrookes +- [CssBaseline] Add dark mode scrollbar support (#23407) @mmmols +- [Slider] Extract slots as standalone components (#22893) @mnajdova +- [Stepper] Fix the icon prop support in StepLabel (#23408) @randyshoopman +- [theme] Add htmlFontSize to Typography interface (#23412) @fergusmcdonald +- [Tooltip] Fix PopperProps popper modifiers not being merged properly (#23421) @dominique-mueller +- [Tooltip] Long press select text on iOS (#23466) @hmaddisb +- [Tooltip] Unexpected behavior onOpen/onClose (#23482) @brorlarsnicklas + +### `@material-ui/lab@v5.0.0-alpha.16` + +- [DatePicker] Migrate to the lab #22692 @dmtrKovalenko + +### `@material-ui/system@v5.0.0-alpha.16` + +- [system] Add typography prop that will pull from theme.typography (#23451) @mnajdova +- [system] Create separate margin and padding functions (#23452) @mnajdova +- [system] Export styleFunctionSx and improve signature (#23397) @mnajdova +- [system] Merge breakpoints in correct order (#23380) @mnajdova +- [system] Remove css utility in favor of sx (#23454) @mnajdova +- [system] Warn for spacing when non integer value is used with theme.spacing array (#23460) @mnajdova + +### `@material-ui/styled-engine@v5.0.0-alpha.16` + +- [styled-engine] Upgrade emotion to 11 RC (#23007) @mnajdova + +### `@material-ui/unstyled@v5.0.0-alpha.16` + +- [Slider] Extract slots as standalone components (#22893) @mnajdova + +### `@material-ui/codemod@v5.0.0-alpha.16` + +- [TextField] Change default variant from standard to outlined (#23503) @mbrookes + +### Docs + +- [docs] Allow to host code in a different repo (#23390) @oliviertassinari +- [docs] CHANGELOG for v5.0.0-alpha.15 (#23383) @oliviertassinari +- [docs] Fix examples download URLs to match the correct branch name (#23467) @matchatype +- [docs] Fix links being opened when dismissing context menus (#23491) @eps1lon +- [docs] Fix the Netlify proxy for localization of X (#23387) @oliviertassinari +- [docs] Fix usage of palette.type instead of palette.mode in docs (#23414) @hubgit +- [docs] Improve documentation of MUI System (#23294) @mnajdova +- [docs] Improve feedback a11y (#23459) @eps1lon +- [docs] Improve formatting of MUI System (#23509) @oliviertassinari +- [docs] Improve migration guide for theme.palette (#23416) @hubgit +- [docs] Mention delay instead of transition twice (#23393) @benmneb +- [docs] Prepare Material UI X (#1893) @oliviertassinari +- [docs] Redirect legacy GridList pages to ImageList (#23456) @eps1lon +- [docs] Remove redundant aria-label when wrapped in Tooltip (#23455) @eps1lon +- [docs] Sync translations (#23316) @l10nbot +- [docs] Update buildAPI script to handle the "styled" components (#23370) @mnajdova +- [docs] Update new components in the roadmap (#23507) @mbrookes +- [docs] Update translations (#23501) @l10nbot + +### Core + +- [core] Batch small changes (#23422) @oliviertassinari +- [core] Fix skipped ignore patterns (#23474) @eps1lon +- [core] Switch to globby and fast-glob (#23382) @eps1lon +- [test] Increase timeout threshold for slow Firefox tests (#23463) @eps1lon +- [test] Make sure system properties are in the same order when generating CSS (#23388) @mnajdova +- [test] Prefer longhand properties (#23445) @eps1lon +- [test] Remove data-mui-test from tests (#23498) @eps1lon +- [test] Remove keyDown#force (#23488) @eps1lon +- [test] Use adapter instead of native Date (#23475) @eps1lon +- [test] Use fake timers in visual regression tests (#23464) @eps1lon + +## 5.0.0-alpha.15 + +_Nov 4, 2020_ + +A big thanks to the 20 contributors who made this release possible. Here are some highlights ✨: + +- ⚛️ Add support for React 17 (#23311) @eps1lon. + React 17 release is unusual because it doesn't add any new developer-facing features. It was released a couple of days ago. You can learn more about it in the [introduction post](https://legacy.reactjs.org/blog/2020/10/20/react-v17.html). Material UI now supports `^16.8.0 || ^17.0.0`. +- 🛠 Introduce a new `@material-ui/unstyled` package (#23270) @mnajdova. + This package will host the unstyled version of the components. In this first iteration, only the Slider is available. You can find it documented under the [same page](https://mui.com/components/slider-styled/#unstyled-slider) as the styled version. + + **Why an unstyled package?** + + While engineering teams are successfully building custom design systems by wrapping Material UI, we [occasionally hear](https://github.com/mui/material-ui/issues/6218) that Material Design or our styling solution are something they don't need. Some teams prefer SASS, others prefer to customize the components starting from a pristine state. What all these teams have in common is that they value the features coming from the components, such as accessibility. + + The unstyled package goes one step down in the abstraction layer, providing more flexibility. Angular Material introduced this approach two years ago. Today their unstyled components account for [25% of the usage](https://npm-stat.com/charts.html?package=%40angular%2Fmaterial&package=%40angular%2Fcdk&from=2017-11-03&to=2020-11-03). + + Another reason for introducing this package is to prepare the groundwork for a [second theme](https://github.com/mui/material-ui/issues/22485) (not Material Design based). + + A note on the terminology: "unstyled" means that the components have the same API as the "styled" components but come without CSS. Material UI also contains "headless" components that exposes a hook API, for example [useAutocomplete](https://mui.com/components/autocomplete/#useautocomplete) or [usePagination](https://mui.com/components/pagination/#usepagination). + + This change is part of our strategy to iterate on the v5 architecture with the `Slider` first. In the next alpha release, we plan to replace the v4 slider with the v5 slider. Once the new approach is stress-tested and validated, we will roll it out to all the components. + +- And many more 🐛 bug fixes and 📚 improvements. + +### `@material-ui/core@v5.0.0-alpha.15` + +#### Breaking changes + +- [AppBar] Fix z-index when position="static" (#23325) @sujinleeme + Remove z-index when position static and relative +- [theme] Fix error message for augmentColor failure (#23371) @reedanders + The signature of `theme.palette.augmentColor` helper has changed: + + ```diff + -theme.palette.augmentColor(red); + +theme.palette.augmentColor({ color: red, name: 'brand' }); + ``` + +#### Changes + +- [Autocomplete] Fix unclickable area between text input and endAdornment (#23229) @sujinleeme +- [Autocomplete] Follow Material Design State spec (#23323) @sujinleeme +- [Avatar] Fix usage of srcset property (#23286) @matheuspiment +- [ClickAwayListener] Fix mounting behavior in Portals in React 17 (#23315) @eps1lon +- [core] Allow React 17 (#23311) @eps1lon +- [Icon] Fix translation, for example Google Translate (#23237) @cbeltrangomez84 +- [LinearProgress] Fix Safari's bug during composition of different paint (#23293) @montogeek +- [Radio] Fix dot misalignment in Safari (#23239) @anasufana +- [styled-engine] Fix tagged template syntax with multiple expressions (#23269) @eps1lon +- [Table] Fix empty row logic when displaying all (#23280) @JoaoJesus94 +- [Table] Fix handling of rowsPerPage={-1} (#23299) @JoaoJesus94 +- [TextareaAutosize] Fix container with no intrinsic height (#23273) @sujinleeme +- [TextField] Fix disabled color in Safari (#23375) @Morteza-Jenabzadeh +- [theme] Fix spacing string arguments (#23224) @GuilleDF +- [Tooltip] Fix excess spacing (#23233) @benneq + +### `@material-ui/unstyled@v5.0.0-alpha.15` + +- [unstyled] Create package and move SliderUnstyled there (#23270) @mnajdova +- [core] Allow React 17 (#23311) @eps1lon + +### `@material-ui/lab@v5.0.0-alpha.15` + +- [lab] Migrate Timeline to TypeScript (#23242) @oliviertassinari +- [core] Allow React 17 (#23311) @eps1lon + +### `@material-ui/icons@v5.0.0-alpha.15` + +- [core] Allow React 17 (#23311) @eps1lon + +### `@material-ui/styles@v5.0.0-alpha.15` + +- [core] Allow React 17 (#23311) @eps1lon + +### `@material-ui/system@v5.0.0-alpha.15` + +- [core] Allow React 17 (#23311) @eps1lon +- [theme] Fix spacing string arguments (#23224) @GuilleDF + +### Docs + +- [Transition] Document default appear value (#23221) @GuilleDF +- [blog] Danail Hadjiatanasov joins Material UI (#23223) @oliviertassinari +- [docs] Add Material UI Builder to in-house ads (#23342) @mbrookes +- [docs] Fix a few typos and add comma (#23284) @reedanders +- [docs] Fix few propTypes in Inputs (#23331) @youknowhat +- [docs] Fix language cookie (#23324) @mbrookes +- [docs] Fix typo in `README.md` (#23329) @mtsknn +- [docs] Guard against unknown value in userLanguage cookie (#23336) @mbrookes +- [docs] Make it clearer that custom router is supported (#23304) @Maxgit3 +- [docs] Sync translations (#23080) @l10nbot +- [docs] Update homepage quotes (#23326) @mbrookes +- [docs] Update nav translations (#23234) @mbrookes +- [docs] Update system pages to use sx prop instead of deprecated Box props (#23368) @mnajdova +- [docs] Use present tense for bool prop descriptions (#23274) @mbrookes + +### Core + +- [utils] Add all @material-ui/core/utils to @material-ui/utils (#23264) @mnajdova +- [core] Batch small changes (#23327) @oliviertassinari +- [core] Fix implicit transitive 'csstype' dependency (#23301) @quinnturner +- [core] Move material-ui-benchmark into benchmark/server (#23271) @eps1lon +- [core] Replace temp package with node built-ins (#23262) @eps1lon +- [core] Restrict top level imports that target CJS modules (#23159) @eps1lon +- [test] Fix unexpected console warn/error spy swallowing unrelated messages (#23312) @eps1lon +- [test] Fix various issues with the new cli on windows (#23381) @eps1lon +- [test] Improve test debugging (#23372) @eps1lon +- [test] Introduce experimental CLI (#23369) @eps1lon +- [test] Prevent growing call stack in custom keyDown/keyUp (#23321) @eps1lon +- [test] Run with Safari 13 (#23292) @eps1lon + +## 5.0.0-alpha.14 + +_Oct 23, 2020_ + +A big thanks to the 23 contributors who made this release possible. +Here are some highlights ✨: + +- 💄 Introduce a new `sx` prop (#23053, #23205) @mnajdova + We have resumed the work on Material UI System. This is made possible by the latest progress on the new styling solution of v5. + You can read the [introduction blog post](https://medium.com/material-ui/introducing-material-ui-design-system-93e921beb8df) that we did for MUI System two years ago. + + The system is meant to solve the following problems: + + 1. Naming things is hard. How should a class name, JSS style rule, or styled component be named? + 2. Jumping between JS and CSS in the editor wastes time. This is particularly true as the complexity (LOCs/# of elements) of a component increases. It's still true when using the `styled()` API. + 3. Introducing a `makeStyles` for the first time in a component is daunting. For example, it's why https://github.com/vscodeshift/material-ui-codemorphs#add-usestyles-hook exists. What if we had less code to type, gaining velocity when writing styles? + 4. Pulling values out from the theme can be cumbersome. How can we make it less painful to increase the usage of design tokens? + + This new iteration of MUI System brings two major improvements: + + - It moves from the support of a subset of CSS to the support of a superset of CSS. + Learning the shorthand is optional. It's no longer necessary to moving back to styled() when MUI System doesn't support a specific CSS property. + - It moves from support on Box only to any core component (starting with the slider). + + ```jsx + import Slider from '@material-ui/lab/SliderStyled'; + + // Set the primary color and a vertical margin of 16px on desktop. + <Slider sx={{ color: 'primary.main', my: { xs: 0, md: 2 } }} />; + ``` + +- ✨ Upgrade Popper.js from v1 to v2 (#21761) @joshwooding + The change reduces the bundle size (-1 kB gzipped) while fixing bugs at the same time. + +- 🐛 Fix broken nested imports with the icons package (#23157) @eps1lon + The revamp of the bundling strategy in #22814 has broken the nested imports. + Imports such as the one below should work again with this release: + + ```jsx + import CloseIcon from '@material-ui/icons/Close'; + ``` + +- And many more 🐛 bug fixes and 📚 improvements. + +### `@material-ui/core@v5.0.0-alpha.14` + +#### Breaking changes + +- [Popper] Upgrade to popper.js to v2 (#21761) @joshwooding + This third-party library has introduced a lot of changes.<br /> + You can read [their migration guide](https://popper.js.org/docs/v2/migration-guide/) or the following summary: + + - The CSS prefixes have changed: + + ```diff + popper: { + zIndex: 1, + - '&[x-placement*="bottom"] $arrow': { + + '&[data-popper-placement*="bottom"] $arrow': { + ``` + + - Method names have changed. + + ```diff + -popperRef.current.scheduleUpdate() + +popperRef.current.update() + ``` + + ```diff + -popperRef.current.update() + +popperRef.current.forceUpdate() + ``` + + - Modifiers' API has changed a lot. There are too many changes to be covered here. + +- [withMobileDialog] Remove this higher-order component (#23202) @RDIL + The hook API allows a simpler and more flexible solution than the HOC: + + ```diff + -import withMobileDialog from '@material-ui/core/withMobileDialog'; + +import { useTheme, useMediaQuery } from '@material-ui/core'; + + function ResponsiveDialog(props) { + - const { fullScreen } = props; + + const theme = useTheme(); + + const fullScreen = useMediaQuery(theme.breakpoints.down('sm')); + const [open, setOpen] = React.useState(false); + + // ... + + -export default withMobileDialog()(ResponsiveDialog); + +export default ResponsiveDialog; + ``` + +#### Changes + +- [Box] Add sx prop (#23053) @mnajdova +- [Box] Deprecate system props (#23206) @mnajdova +- [Card] Use flex display for CardHeader.avatar (#23169) @mordechaim +- [Container] Fix support of custom breakpoint units (#23191) @espipj +- [Container] Revert max-width change for xs @oliviertassinari +- [InputBase] Use ref prop instead of inputRef prop on input component (#23174) @GuilleDF +- [l10n] Add Kazakh (kz-KZ) locale (#23195) @abdulgafur24 +- [Rating] Ensure hover and click are in sync (#23117) @redbmk +- [Select] Fix SelectDisplayProps className concat (#23211) @reedanders + +### `@material-ui/styled-engine@v5.0.0-alpha.14` + +- [styled] Add @babel/runtime dependency (#23175) @koistya + +### `@material-ui/system@v5.0.0-alpha.14` + +- [Box] Add sx prop (#23053) @mnajdova +- [core] Fix bundles for packages without subpackages (#23157) @eps1lon + +### `@material-ui/icons@v5.0.0-alpha.14` + +- [core] Fix bundles for packages without subpackages (#23157) @eps1lon + +### `@material-ui/lab@v5.0.0-alpha.14` + +#### Breaking changes + +- [AvatarGroup] Move from lab to core (#23121) @mbrookes + Move the component from the lab to the core. This component will become stable. + + ```diff + -import AvatarGroup from '@material-ui/lab/AvatarGroup'; + +import AvatarGroup from '@material-ui/core/AvatarGroup'; + ``` + +#### Changes + +- [Slider] Add sx prop in SliderStyled (#23205) @mnajdova + +### `@material-ui/utils@v5.0.0-alpha.14` + +- [utils] Fix types of chainPropTypes (#23123) @oliviertassinari +- [core] Fix bundles for packages without subpackages (#23157) @eps1lon + +### `@material-ui/types@v5.2.0-alpha.14` + +- [types] Add LICENSE files (#23162) @lielfr + +### Docs + +- [examples] Remove reason example project (#23158) @mnajdova +- [examples] Update cdn example to use @material-ui/core@next (#23153) @mnajdova +- [examples] Update preact to use the @material-ui/core@next (#23154) @mnajdova +- [examples] Update ssr example to use @material-ui/core@next (#23155) @mnajdova +- [examples] Updated nextjs-typescript example to use @material-ui/core@next (#23119) @numToStr +- [docs] Add Menu component example with explicit positioning prop values (#23167) @jaebradley +- [docs] Add page feedback (#22885) @mbrookes +- [docs] Add Performance section for Modal (#23168) @jaebradley +- [docs] Better document CardActionArea (#23196) @el1f +- [docs] Cleaner image of font-size equation (#23189) @CamDavidsonPilon +- [docs] Fix casing typo (#23148) @piperchester +- [docs] Fix typo in steppers (#23163) @AGDholo +- [docs] Fix typo on interoperability page (#23177) @SassNinja +- [docs] Improve migration v5 guide @oliviertassinari +- [docs] Lazy load demo toolbar (#23108) @eps1lon +- [docs] Remove unused style selectors `extendedIcon` (#23160) @MatejKastak +- [docs] Use Box sx prop on all Slider examples #23217 @mnajdova + +### Core + +- [benchmark] Add theme-ui and chakra-ui Box scenarios (#23180) @mnajdova +- [benchmark] Create separate workspace (#23209) @eps1lon +- [benchmark] Extracted Profiler & added output in readme (#23178) @mnajdova +- [core] Batch small changes (#23116) @oliviertassinari +- [core] Improve bundle size comment (#23110) @eps1lon +- [core] Prevent unstable chunks in size snapshot (#23181) @eps1lon + +## 5.0.0-alpha.13 + +_Oct 17, 2020_ + +A big thanks to the 25 contributors who made this release possible. +Here are some highlights ✨: + +- 📦 Ship modern bundle (#22814) @eps1lon. + This is a significant update to the [browsers supported](https://mui.com/material-ui/getting-started/supported-platforms/) by Material UI. + The previous policy was defined 2 years ago, and the landscape has evolved since then. The package now includes 4 bundles: + + 1. `stable` (default, formerly `esm`) which targets a snapshot (on release) of `> 0.5%, last 2 versions, Firefox ESR, not dead, not IE 11"` + 2. `node` (formerly default) which targets a snapshot (on release) of `maintained node versions` + 3. `legacy` (new) which is `stable` + IE 11 + 4. `modern` (formerly `es`) which targets the last 1 version of evergreen browsers and active node (currently that is 14 + + The change yields a 6% reduction in bundle size 📦 (Babel only). + In the coming weeks, we will refactor the internals to take advantage of the new browser capabilities that dropping these older platforms allows. For instance, we might be able to remove the span we render inside the `<Button>` to work around [Flexbug #9](https://github.com/philipwalton/flexbugs/blob/master/README.md#flexbug-9). + + Check the updated [Supported platforms documentation](https://mui.com/material-ui/getting-started/supported-platforms/) and [new "minimizing bundle size" guide](https://mui.com/material-ui/guides/minimizing-bundle-size/). + + If you target IE11, you need to use the new bundle (`legacy`). We are treating IE11 as a second class-citizen, which is a continuation of the direction taken in #22873. + +- 🚀 Improve the internal benchmark suite (#22923, #23058) @mnajdova. + This was a prerequisite step to improve the [system](https://mui.com/system/getting-started/). We needed to be able to measure performance. After #22945, we have measured that the `Box` component is x3 faster in v5-alpha compared to v4. +- ✏️ A new blog post: [Q3 2020 Update](https://mui.com/blog/2020-q3-update/) (#23055) @oliviertassinari. +- 🐙 Migrate more tests to react-testing-library @deiga, @Morteza-Jenabzadeh, @nicholas-l. +- And many more 🐛 bug fixes and 📚 improvements. + +### `@material-ui/core@v5.0.0-alpha.13` + +#### Breaking changes + +- [core] Ship modern bundle (#22814) @eps1lon + +#### Change + +- [Autocomplete] Fix autoHighlight synchronization (#23025) @Tubaleviao +- [Autocomplete] Ignore keydown event until IME is confirmed (#23050) @jiggum +- [Card] Fix action area hover style on touch devices (#23079) @giulianovarriale +- [Slider] Align value label text center (#23075) @LorenzHenk +- [SwipeableDrawer] Decorrelate swipeAreaWidth and initial jumping amount (#23042) @omidtajik +- [Tooltip] Fix followCursor preventing onMouseMove on children (#23104) @eps1lon +- [Tooltip] Refactor event handling (#23092) @eps1lon +- [theme] Add missing types for theme overrides (#23028) @povilass +- [l10n] Add Arabic (ar_EG) locale (#23006) @GoldenWings + +### `@material-ui/lab@v5.0.0-alpha.13` + +- [TreeView] Fix bundle size link and refactor array spreads (#22992) @joshwooding +- [TreeView] Fix `alpha` color utility instead of deprecated `fade` (#22978) @joshwooding +- [core] Ship modern bundle (#22814) @eps1lon + +### `@material-ui/utils@v5.0.0-alpha.13` + +- [core] Ship modern bundle (#22814) @eps1lon + +### `@material-ui/system@v5.0.0-alpha.13` + +- [core] Ship modern bundle (#22814) @eps1lon + +### `@material-ui/styles@v5.0.0-alpha.13` + +- [core] Ship modern bundle (#22814) @eps1lon + +### `@material-ui/styled-engine@v5.0.0-alpha.13` + +- [core] Ship modern bundle (#22814) @eps1lon + +### `@material-ui/styled-engine-sc@v5.0.0-alpha.13` + +- [core] Ship modern bundle (#22814) @eps1lon + +### `@material-ui/icons@v5.0.0-alpha.13` + +- [core] Ship modern bundle (#22814) @eps1lon + +### Docs + +- [blog] Allow to support card preview (#23087) @oliviertassinari +- [blog] Q3 2020 Update (#23055) @oliviertassinari +- [docs] Add a new demo to the showcase (#22949) @adonig +- [docs] Add demo for Link underline (#23074) @LorenzHenk +- [docs] Add logarithmic slider demo (#23076) @LorenzHenk +- [docs] Add react-admin in related projects page (#23097) @fzaninotto +- [docs] Change color to palette (#23046) @mockingjet +- [docs] Don't suggest putting a Switch inside a ListItemSecondaryAction (#23018) @sirlantis +- [docs] Fix docs:dev (#23023) @eps1lon +- [docs] Fix vertical alignment of Slider demo (#23059) @r0zar +- [docs] Fix wrong variable characters (#23066) @AGDholo +- [docs] Improve docs for Table sticky column grouping (#23100) @andre-silva-14 +- [docs] Improve icon preview color contrast (#22974) @oliviertassinari +- [docs] Interoperability guide updates (#23030) @mnajdova +- [docs] Move outdated versions into a collapsible section (#23029) @NoNamePro0 +- [docs] Point to material-ui-x/next instead of master @oliviertassinari +- [docs] Restore ButtonBases images (#23083) @eps1lon +- [docs] Slider demos clean up (#22964) @mnajdova +- [docs] Sync translations (#22888) @l10nbot +- [examples] Update gatsby example to use @material-ui/\* next (#23089) @mnajdova +- [examples] Update gatsby-theme example to use @material-ui/\* next #23093 @mnajdova +- [examples] Update nextjs example project to use @material-ui/\* next (#23094) @mnajdova + +### Core + +- [benchmark] Add browser benchmark (#22923) @mnajdova +- [benchmark] Fix benchmark scripts & moved scenarios to correct benchmark project (#23058) @mnajdova +- [test] Enable failing unexpected console warn|error in browser tests (#23063) @eps1lon +- [test] Fail each test on unexpected console logs in test:unit (#23064) @eps1lon +- [test] Introduce toHaveInlineStyle and toHaveComputedStyle matcher (#23054) @eps1lon +- [test] Migrate ButtonBase to react-testing-library (#23011) @deiga +- [test] Migrate IconButton to react-testing-library (#22972) @Morteza-Jenabzadeh +- [test] Migrate InputBase to react-testing-library (#23014) @deiga +- [test] Migrate SpeedDial to react-testing-library (#23021) @nicholas-l +- [test] Migrate TableCell to react-testing-library (#23095) @nicholas-l +- [test] Migrate TableRow to react-testing-library (#23105) @deiga +- [test] Move some work out of evaluation phase (#23112) @eps1lon +- [test] Supress 404 img warnings in browser tests (#23106) @eps1lon +- [test] Throw on console.(error|warn) outside of test (#22907) @eps1lon +- [test] Use dot reporter in CI (#23026) @eps1lon +- [core] Add support for iOS Safari 12 (#23068) @eps1lon +- [core] Also format dot files & folders (#22975) @oliviertassinari +- [core] Extend yarn size:why (#22979) @eps1lon +- [core] Fix react-next test (#23027) @oliviertassinari +- [core] Lint CSS (#22976) @oliviertassinari +- [core] Misc modules/\* cleanup (#22983) @eps1lon + +## 5.0.0-alpha.12 + +_Oct 11, 2020_ + +A big thanks to the 45 contributors who made this release possible. +Here are some highlights ✨: + +- 🧪 The promotion of 4 components from the lab to core: Autocomplete, Pagination, SpeedDial, and ToggleButton. These components have been in the lab for more than 10 months @mbrookes. +- 📦 Switch the style engine of the `Box` component from JSS to _@material-ui/styled-engine_ (use emotion by default) (#22945) @mnajdova. + The early benchmark we have run shows that performance has improved. We will share more detailed results in #21657. +- 🐙 Migrate a large portion of the tests from enzyme to react-testing-library @eladmotola, @baterson, @bewong89, @devrasec, @guillermaster, @itamar244, @jeferson-sb, @The24thDS. + Last month, react-testing-library had [more downloads](https://npm-stat.com/charts.html?package=enzyme&package=%40testing-library%2Freact&from=2019-10-10&to=2020-10-10) than enzyme in the ecosystem! +- 🏷 Add support for tooltips [following the cursor](https://mui.com/components/tooltips/#follow-cursor) (#22876) @xtrixia. +- And many more 🐛 bug fixes and 📚 improvements. + +### `@material-ui/core@v5.0.0-alpha.12` + +#### Breaking changes + +- [Accordion] Remove `display:flex` from AccordionDetails (#22809) @croraf + The style was too opinionated. Most developers expect `display: block`. +- [Accordion] Replace IconButton wrapper with div (#22817) @croraf + Remove IconButtonProps prop from AccordionSummary. + The component renders a `<div>` element instead of an IconButton. + The prop is no longer relevant. +- [Box] Add mui styled usage (#22945) @mnajdova + Change the style-engine powering the Box component from JSS to the style engine adatper (emotion by default). +- [CircularProgress] Drop IE11 wobbly workaround (#22873) @suliskh + The IE11 workaround is harming performance on the latest browsers. + This change is part of a best-effort strategy to keep IE11 support. + We are degrading the UX and DX with IE11 where we can improve the components on modern browsers. +- [Table] Rename onChangeRowsPerPage and onChangePage (#22900) @eladmotola + The change was done to match the API convention. + + ```diff + <TablePagination + - onChangeRowsPerPage={()=>{}} + - onChangePage={()=>{}} + + onRowsPerPageChange={()=>{}} + + onPageChange={()=>{}} + ``` + +- [theme] Rename fade to alpha (#22834) @mnajdova + 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. + + ```diff + -import { fade } from '@material-ui/core/styles'; + +import { alpha } from '@material-ui/core/styles'; + + const classes = makeStyles(theme => ({ + - backgroundColor: fade(theme.palette.primary.main, theme.palette.action.selectedOpacity), + + backgroundColor: alpha(theme.palette.primary.main, theme.palette.action.selectedOpacity), + })); + ``` + +- [Tooltip] Make `interactive` default (#22382) @eps1lon + The previous default behavior failed [success criterion 1.4.3 ("hoverable") in WCAG 2.1](https://www.w3.org/TR/WCAG21/#content-on-hover-or-focus). + To reflect the new default value, the prop was renamed to `disableInteractive`. + If you want to restore the old behavior (thus not reaching level AA), you can apply the following diff: + + ```diff + -<Tooltip> + +<Tooltip disableInteractive> + # Interactive tooltips no longer need the `interactive` prop. + -<Tooltip interactive> + +<Tooltip> + ``` + +#### Changes + +- [Accordion] Remove incorrect demo which nests input in button (#22898) @croraf +- [Autocomplete] Fix filtering when value is already selected (#22935) @montelius +- [Autocomplete] Fix virtualization example in IE11 (#22940) @bearfromtheabyss +- [Autocomplete] Restrict component props in `renderInput` (#22789) @eps1lon +- [Box] Add types for `ref` (#22927) @lcswillems +- [Button] Fix invalid type value (#22883) @oliviertassinari +- [Button] Improve loading transition (#22884) @oliviertassinari +- [Grid] Clarify document about direction column limitation (#22871) @ThewBear +- [IconButton] Improve warning against non root onClick listeners (#22821) @pranjanpr +- [Popper] Use placement viewport instead of window (#22748) @maksimgm +- [Select] Add generic support for value (#22839) @AntoineGrandchamp +- [Skeleton] Fix importing with named export (#22879) @0prodigy +- [SpeedDial] Fix keyboard navigation when uncontrolled (#22826) @akharkhonov +- [styled] Specify emotion & styled-components as optional peer dependencies (#22808) @mnajdova +- [styled] Support default theme when none is available (#22791) @mnajdova +- [Tabs] Fix RTL scrollbar with Chrome 85 (#22830) @ankit +- [TextField] Pass minRows to InputComponent (#22831) @suliskh +- [ToggleButton] Fix vertical double border (#22825) @Avi98 +- [ToggleButton] Match ToggleButtonGroup name and render function name (#22790) @jjoselv +- [Tooltip] Add placement `followCursor` (#22876) @xtrixia +- [Tooltip] Improve docs and warning for custom children (#22775) @brorlarsnicklas +- [Tooltip] Use label semantics (#22729) @eps1lon +- [useAutocomplete] Fix getXProps functions type (#22749) @kentaro84207 + +### `@material-ui/styled-engine@v5.0.0-alpha.12` + +- [styled] Support default theme when none is available (#22791) @mnajdova + +### `@material-ui/lab@v5.0.0-alpha.12` + +#### Breaking changes + +- [Autocomplete] Move from lab to core (#22715) @mbrookes + Move the component from the lab to the core. This component will become stable. + + ```diff + -import Autocomplete from '@material-ui/lab/Autocomplete'; + -import useAutocomplete from '@material-ui/lab/useAutocomplete'; + +import Autocomplete from '@material-ui/core/Autocomplete'; + +import useAutocomplete from '@material-ui/core/useAutocomplete'; + ``` + +- [Pagination] Move from lab to core (#22848) @mbrookes + Move the component from the lab to the core. This component will become stable. + + ```diff + -import Pagination from '@material-ui/lab/Pagination'; + -import PaginationItem from '@material-ui/lab/PaginationItem'; + -import { usePagination } from '@material-ui/lab/Pagination'; + +import Pagination from '@material-ui/core/Pagination'; + +import PaginationItem from '@material-ui/core/PaginationItem'; + +import usePagination from '@material-ui/core/usePagination'; + ``` + +- [SpeedDial] Move from lab to core (#22743) @mbrookes + Move the component from the lab to the core. This component will become stable. + + ```diff + -import SpeedDial from '@material-ui/lab/SpeedDial'; + -import SpeedDialAction from '@material-ui/lab/SpeedDialAction'; + -import SpeedDialIcon from '@material-ui/lab/SpeedDialIcon'; + +import SpeedDial from '@material-ui/core/SpeedDial'; + +import SpeedDialAction from '@material-ui/core/SpeedDialAction'; + +import SpeedDialIcon from '@material-ui/core/SpeedDialIcon'; + ``` + +- [ToggleButton] Move from lab to core (#22784) @mbrookes + Move the component from the lab to the core. This component will become stable. + + ```diff + -import ToggleButton from '@material-ui/lab/ToggleButton'; + -import ToggleButtonGroup from '@material-ui/lab/ToggleButtonGroup'; + +import ToggleButton from '@material-ui/core/ToggleButton'; + +import ToggleButtonGroup from '@material-ui/core/ToggleButtonGroup'; + ``` + +- [TreeView] Improve customization of tree item (#22846) @joshwooding + Remove `onLabelClick` and `onIconClick`. + +#### Changes + +- [AvatarGroup] Add variant prop (#22832) @hjades +- [SliderStyled] Fix mark label alignment on coarse pointer devices (#22849) @joshwooding + +### Docs + +- [docs] Add example for using styled-components as styled-engine (#22788) @mnajdova +- [docs] Add longhand system API props to docs (#22796) @possibilities +- [docs] Box & system cleanup (#22962) @mnajdova +- [docs] CONTRIBUTING.md only yarn is supported (#22754) @Yashvirani +- [docs] Document createSvgIcon() (#22843) @mbrookes +- [docs] Document inherited props (#22318) @oliviertassinari +- [docs] Document LoadingButton behavior (#22878) @eps1lon +- [docs] Fix dark theme for input field on autocomplete (#22711) @GauravKesarwani +- [docs] Fix material icon search details view (#22793) @skr571999 +- [docs] Fix type vs. mode and capitalization of createMuiTheme (#22844) @joshwooding +- [docs] Fix typo in guides/typescript (#22806) @croraf +- [docs] Fix various typos (#22842) @kkirsche +- [docs] For non-SSR language, internal search fall back to English (#22902) @bicstone +- [docs] Improve CRA example (#22967) @spursbyte +- [docs] Improve FormControl duplication warning (#22823) @talgautb +- [docs] Improve perf when opening the drawer (#22781) @eps1lon +- [docs] Improve SEO on titles (#22742) @oliviertassinari +- [docs] Improve the left side-nav (#22780) @oliviertassinari +- [docs] Include peer deps in installation steps (#22889) @numToStr +- [docs] Link all the examples in docs (#22891) @Avi98 +- [docs] More robust description matcher (#22836) @eps1lon +- [docs] Reduce risk of 404 when changing the default branch (#22801) @eps1lon +- [docs] Resolve .tsx first (#22315) @oliviertassinari +- [docs] Simplify locales example (#22747) @mbrookes +- [docs] Sync translations (#22752, #22851) @l10nbot +- [docs] Update installation guide to contain peer dependencies (#22787) @mnajdova +- [docs] Update ToggleButton import (#22971) @mbrookes +- [docs] Use demo name as codesandbox name (#22926) @eps1lon + +### Core + +- [benchmark] Add cross-env to fix window run issue (#22895) @mnajdova +- [core] Batch small changes (#22746) @oliviertassinari +- [core] Batch small changes (#22847) @oliviertassinari +- [core] Drop babel-plugin-transform-dev-warning (#22802) @eps1lon +- [core] Misc dependency fixes (#22909) @eps1lon +- [test] Apply lazy forwardRef fix (#22904) @eps1lon +- [test] Autocomplete drop "defaultProps" pattern (#22896) @eps1lon +- [test] Fix react-next patch (#22800) @eps1lon +- [test] Migrate Accordion to react-testing-library (#22952) @bewong89 +- [test] Migrate Backdrop to react-testing-library (#22931) @itamar244 +- [test] Migrate Container to react-testing-library (#22919) @eladmotola +- [test] Migrate CssBaseline to react-testing-library (#22920) @eladmotola +- [test] Migrate Fab to react-testing-library (#22959) @The24thDS +- [test] Migrate Fade to react-testing-library (#22918) @eladmotola +- [test] Migrate Grow to react-testing-library (#22917) @eladmotola +- [test] Migrate List to react-testing-library (#22929) @eladmotola +- [test] Migrate MenuList and ImageListItem to react-testing-library (#22958) @eladmotola +- [test] Migrate MobileStepper to react-testing-library (#22963) @devrasec +- [test] Migrate more components to react-testing-library (#22872) @baterson +- [test] Migrate more components to react-testing-library (#22874) @baterson +- [test] Migrate more components to react-testing-library (#22892) @baterson +- [test] Migrate NativeSelect to react-testing-library (#22970) @guillermaster +- [test] Migrate NativeSelectInput to react-testing-library (#22910) @baterson +- [test] Migrate RadioGroup to react-testing-library (#22953) @eladmotola +- [test] Migrate Slide to react-testing-library (#22913) @eladmotola +- [test] Migrate SpeedDialIcon to react-testing-library (#22965) @jeferson-sb +- [test] Migrate TabIndicator to react-testing-library (#22906) @eladmotola +- [test] Migrate TextField to react-testing-library (#22944) @The24thDS +- [test] Migrate useTheme,withTheme to react-testing-library (#22928) @eladmotola +- [test] Migrate Zoom to react-testing-library (#22914) @eladmotola +- [test] Prevent nextjs build cache to grow indefinitely (#22948) @eps1lon +- [test] Simplify usage of `yarn mocha` (#22899) @eps1lon +- [test] Solve 2000ms timeout (#22778) @oliviertassinari +- [test] Update react next patch (#22890) @eps1lon +- [test] Use appropriate templates for csb CI (#22943) @eps1lon +- [test] Verbose reporter in CI (#22924) @eps1lon + +## 5.0.0-alpha.11 + +_Sep 26, 2020_ + +A big thanks to the 29 contributors who made this release possible. +Here are some highlights ✨: + +- 👩‍🎨 A first iteration on the new styling solution. + + You can find a [new version](https://mui.com/components/slider-styled/) of the slider in the lab powered by [Emotion](https://emotion.sh/). + + In the event that you are already using styled-components in your application, you can swap emotion for styled-components 💅. Check [this CodeSandbox](https://codesandbox.io/p/sandbox/sliderstyled-with-styled-components-forked-olc27?file=/package.json) for a demo. It relies on aliases to prevent any bundle size overhead. + + The new styling solution saves 2kB gzipped in the bundle compared to JSS, and about 14 kB gzipped if you were already using emotion or styled-components. + + Last but not least, the change allows us to take advantage dynamic style props. We will use them for dynamic color props, variant props, and new style props (an improved [system](https://mui.com/system/getting-started/)). + + This change has been in our roadmap for more than a year. + We announced it in the [v4 release blog post](https://mui.com/blog/material-ui-v4-is-out/) as a direction v5 would take. + +- 🛠 A first iteration on the unstyled components. + + You can find a [new version](https://mui.com/components/slider-styled/#UnstyledSlider.tsx) of the slider in the lab without any styles. + The unstyled component weighs 6.5 kB gzipped, compared with 26 kB for the styled version when used standalone. The component is best suited for use when you want to fully customize the look of the component without reimplementing the JavaScript and accessibility logic. + +- ⚡️ A first alpha of the [DataGrid](https://mui.com/x/react-data-grid/) component. + + It has taken 6 months of development since the initial commit (March 15th, 2020) to make the first alpha release of the grid. The component comes in two versions: + @material-ui/data-grid is licensed under MIT, while @material-ui/x-grid is licensed under a commercial license. + +- 🪓 Keep working on the breaking changes. + + We aim to complete most of the breaking changes during the alpha stage of v5. + We will move to beta once all the breaking changes we have anticipated are handled. + As always, you should find a clear and simple upgrade path for each of them. + You can learn more about the breaking changes left to be done in #22700. + +- And many more 🐛 bug fixes and 📚 improvements. + +### `@material-ui/core@v5.0.0-alpha.11` + +#### Breaking changes + +- [Chip] Rename `default` variant to `filled` (#22683) @mnajdova + Rename `default` variant to `filled` for consistency. + + ```diff + -<Chip variant="default"> + +<Chip variant="filled"> + ``` + +- [Tabs] Add allowScrollButtonsMobile prop for mobile view (#22700) @GauravKesarwani + The API that controls the scroll buttons has been split it into two props: + + - The `scrollButtons` prop controls when the scroll buttons are displayed depending on the space available. + - The `allowScrollButtonsMobile` prop removes the CSS media query that systematically hides the scroll buttons on mobile. + + ```diff + -<Tabs scrollButtons="on" /> + -<Tabs scrollButtons="desktop" /> + -<Tabs scrollButtons="off" /> + +<Tabs scrollButtons allowScrollButtonsMobile /> + +<Tabs scrollButtons /> + +<Tabs scrollButtons={false} /> + ``` + +- [theme] Improve breakpoints definitions (#22695) @mnajdova + Breakpoints are now treated as values instead of ranges. + The behavior of `down(key)` was changed to define media query less than the value defined with the corresponding breakpoint (exclusive). + The behavior of `between(start, end)` was also updated to define media query for the values between the actual values of start (inclusive) and end (exclusive). + + Find examples of the changes required defined below: + +```diff +-theme.breakpoints.down('sm') // '@media (max-width:959.95px)' - [0, sm + 1) => [0, md) ++theme.breakpoints.down('md') // '@media (max-width:959.95px)' - [0, md) +``` + +```diff +-theme.breakpoints.between('sm', 'md') // '@media (min-width:600px) and (max-width:1279.95px)' - [sm, md + 1) => [sm, lg) ++theme.breakpoints.between('sm', 'lg') // '@media (min-width:600px) and (max-width:1279.95px)' - [sm, lg) +``` + +- [theme] Rename `type` to `mode` (#22687) @mnajdova + Renames `theme.palette.type` to `theme.palette.mode`, to better follow the "dark mode" term that is usually used for describing this feature. + + ```diff + import { createMuiTheme } from '@material-ui/core/styles'; + + -const theme = createMuiTheme({palette: { type: 'dark' }}), + +const theme = createMuiTheme({palette: { mode: 'dark' }}), + ``` + + The changes are supported by the `adaptV4Theme()` for easing the migration + +#### Changes + +- [Checkbox] Improve indeterminate UI (#22635) @oliviertassinari +- [Chip] Fix prop-type support for custom variants (#22603) @cansin +- [icons] Expose a data-test-id attribute on all svg icons (#22634) @jaebradley +- [Rating] Add form integration test suite (#22573) @eps1lon +- [Rating] Simpler customization of active "no value" styles (#22613) @eps1lon +- [Rating] Treat as input when readOnly (#22606) @eps1lon +- [Rating] Treat read-only as image (#22639) @eps1lon +- [Select] Improve docs for displayEmpty prop (#22601) @mihaipanait +- [Slider] Better tracking of mouse events (#22557, #22638) @chrisinajar, @oliviertassinari +- [Slider] Create unstyled version and migrate to emotion & styled-components (#22435) @mnajdova +- [Slider] Export components from lab and renamed to fit file names (#22723) @mnajdova +- [Slider] Fix value label display for custom value component (#22614) @NoNonsense126 +- [Stepper] Add slight transition (#22654) @xtrixia +- [Tabs] Fix TabScrollButton using absolute path (#22690) @4vanger +- [Tabs] Only scroll the visible tabs (#22600) @quochuy +- [theme] convertLength does not work for fromUnit !== 'px' (#22739) @brorlarsnicklas +- [theme] Fix createSpacing.d.ts definition (#22645) @dabretin +- [theme] Fix Hidden breakpoints issues and updates the migration guide (#22702) @mnajdova + +### `@material-ui/lab@v5.0.0-alpha.11` + +#### Breaking changes + +- [Alert] Move from lab to core (#22651) @mbrookes + Move the component from the lab to the core. This component will become stable. + + ```diff + -import Alert from '@material-ui/lab/Alert'; + -import AlertTitle from '@material-ui/lab/AlertTitle'; + +import Alert from '@material-ui/core/Alert'; + +import AlertTitle from '@material-ui/core/AlertTitle'; + ``` + +- [Rating] Move from lab to core (#22725) @mbrookes + Move the component from the lab to the core. This component will become stable. + + ```diff + -import Rating from '@material-ui/lab/Rating'; + +import Rating from '@material-ui/core/Rating'; + ``` + +- [Skeleton] Move from lab to core (#22740) @mbrookes + Move the component from the lab to the core. This component will become stable. + + ```diff + -import Skeleton from '@material-ui/lab/Skeleton'; + +import Skeleton from '@material-ui/core/Skeleton'; + ``` + +- [Autocomplete] Get root elements of options via renderOption (#22591) @ImanMahmoudinasab + After this change, the full DOM structure of the option is exposed. + It makes customizations easier. + You can recover from the change with: + + ```diff + <Autocomplete + - renderOption={(option, { selected }) => ( + - <React.Fragment> + + renderOption={(props, option, { selected }) => ( + + <li {...props}> + <Checkbox + icon={icon} + checkedIcon={checkedIcon} + style={{ marginRight: 8 }} + checked={selected} + /> + {option.title} + - </React.Fragment> + + </li> + )} + /> + ``` + +#### Changes + +- [lab] Fix transitive dependencies in @material-ui/lab (#22671) @koistya +- [Autocomplete] Add "remove-option" to AutocompleteCloseReason type (#22672) @iansjk +- [Autocomplete] Don't close popup when Ctrl/Meta is pressed (#22696) @montelius +- [Autocomplete] Fix accessibility issue with empty option set (#22712) @tylerjlawson +- [Autocomplete] Update GitHub customization example (#22735) @hmaddisb + +### `@material-ui/styled-engine@v5.0.0-alpha.11` + +The new default style engine leveraging emotion. + +### `@material-ui/styled-engine-sc@v5.0.0-alpha.11` + +Allows developer to swap emotion with styled-components. +More documentation are coming. + +### `@material-ui/icons@v5.0.0-alpha.11` + +- [icons] Synchronize with Google (#22680) @delewis13 + +### `@material-ui/styles@v5.0.0-alpha.11` + +- [Slider] Create unstyled version and migrate to emotion & styled-components (#22435) @mnajdova + +### `@material-ui/system@v5.0.0-alpha.11` + +- [core] Port createSpacing to TypeScript (#22720) @eps1lon + +### Docs + +- [blog] New posts (#22607) @oliviertassinari +- [docs] Add additional context to Autocomplete asynchronous documentation (#22621) @jaebradley +- [docs] Add emotion dependencies in codesandbox examples (#22736) @mnajdova +- [docs] Add props from Unstyled component to Styled API page (#22733) @mnajdova +- [docs] Add ui-schema in related projects (#22644) @elbakerino +- [docs] Avoid confusion between layout grid and data grid (#22681) @oliviertassinari +- [docs] Batch small changes (#22646) @oliviertassinari +- [docs] Configuring redirects for MUI X (#22632) @dtassone +- [docs] Customized hook at Autocomplete issue in dark mode (#22605) @hmaddisb +- [docs] Encourage DataGrid in /components/tables/ over alternatives (#22637) @oliviertassinari +- [docs] Fix emotion broken in SSR (#22731) @mnajdova +- [docs] Fix markdown metadata yaml (#22629) @oliviertassinari +- [docs] Fix static asset loading with X @oliviertassinari +- [docs] Improve Dashboard template (#22647) @pak1989 +- [docs] Improve DX for docs generation (#22619) @eps1lon +- [docs] Migrate templates to TypeScript (#22650) @oliviertassinari +- [docs] New Crowdin updates (#22620) @mbrookes +- [docs] Prevent toolbar tooltips overlapping demos (#22732) @eps1lon +- [docs] Reduce indirections (#22642) @Arsikod +- [docs] Reference experimental slider demos correctly (#22738) @eps1lon +- [docs] Remove minimum-scale from meta viewport in docs (#22724) @barik +- [docs] Remove wrong migration instruction (#22710) @oliviertassinari +- [docs] Use codesandbox deploy for demos created from deploy previews (#22616) @eps1lon + +### Core + +- [core] Port createSpacing to TypeScript (#22720) @eps1lon +- [core] Replace ChangeEvent<{}> with SyntheticEvent (#22716) @eps1lon +- [core] Use ttp sources directly (#22706) @eps1lon +- [test] Add skip ci to Crowdin commit message (#22685) @mbrookes +- [test] Only run on push for master/next (#22624) @eps1lon +- [test] Run CircleCI anytime (#22676) @eps1lon + +## 5.0.0-alpha.10 + +_Sep 15, 2020_ + +A big thanks to the 16 contributors who made this release possible. +Here are some highlights ✨: + +- Keep working on the breaking changes before v5-beta. + As always, you should find a clear and simple upgrade path for each of them. +- And many more 🐛 bug fixes and 📚 improvements. + +### `@material-ui/core@v5.0.0-alpha.10` + +#### Breaking changes + +- [Accordion] Normalize focusVisible logic (#22567) @oliviertassinari + Rename `focused` to `focusVisible` for consistency with the other components: + + ```diff + <Accordion + classes={{ + - focused: 'custom-focus-visible-classname', + + focusVisible: 'custom-focus-visible-classname', + }} + /> + ``` + +- [Stepper] Remove Paper and built-in padding (#22564) @mbrookes + The root component (Paper) was replaced with a `<div>`. Stepper no longer has elevation, nor inherits Paper's props. This change is meant to encourage composition. + + ```diff + -<Stepper elevation={2}> + - <Step> + - <StepLabel>Hello world</StepLabel> + - </Step> + -</Stepper> + +<Paper square elevation={2}> + + <Stepper> + + <Step> + + <StepLabel>Hello world</StepLabel> + + </Step> + + </Stepper> + +<Paper> + ``` + + Remove the built-in 24px padding for consistency with the other components that avoid reserving space anytime it's possible. + + ```diff + -<Stepper> + - <Step> + - <StepLabel>Hello world</StepLabel> + - </Step> + -</Stepper> + +<Stepper style={{ padding: 24 }}> + + <Step> + + <StepLabel>Hello world</StepLabel> + + </Step> + +</Stepper> + ``` + +- [theme] Always return default spacing value with px units (#22552) @mbrookes + + `theme.spacing` now returns single values with px units by default. + This change improves the integration with styled-components & emotion (with the CSS template strings syntax). + + Before: + + ```bash + theme.spacing(2) => 16 + ``` + + After: + + ```bash + theme.spacing(2) => '16px' + ``` + +- [theme] Remove palette.text.hint key (#22537) @mbrookes + + The `theme.palette.text.hint` key was available but unused in Material UI v4 components. + You can use `adaptV4Theme()` to restore the previous behavior. + +#### Changes + +- [BottomNavigation] onClick does not fire if tapped while scrolling (#22524) @EliasJorgensen +- [Button] Remove dead code (#22566) @oliviertassinari +- [Chip] Fix focus visible style (#22430) @alexmotoc +- [ImageList] Refactor using CSS grid & React context (#22395) @mbrookes +- [Slider] Improve integration with form libraries (#22548) @NoNonsense126 +- [StepIcon] Add className in render SvgIcon (#22559) @ZouYouShun +- [SwipeableDrawer] Avoid blocking events (#22525) @JadRizk +- [theme] Support spacing and border radius with CSS unit (#22530) @madmanwithabike +- [theme] Fix theme object global leak (#22517) @eps1lon +- [theme] Increase usage of the disabled design tokens (#22570) @LorenzHenk + +### `@material-ui/lab@v5.0.0-alpha.10` + +#### Breaking changes + +- [Rating] Use different shape for empty and filled icons (#22554) @oliviertassinari + Change the default empty icon to improve accessibility (1.4.1 WCAG 2.1). + If you have a custom `icon` prop but no `emptyIcon` prop, you can restore the previous behavior with: + + ```diff + <Rating + icon={customIcon} + + emptyIcon={null} + /> + ``` + +#### Changes + +- [Autocomplete] Improve TypeScript in the Google Maps demo (#22555) @L-U-C-K-Y +- [Rating] Explain some styles in code comments (#22571) @eps1lon + +### Docs + +- [docs] Improve Font Awesome integration (#22496) @chrislambe +- [docs] Clarify SSG acronym in Next.js example (#22558) @leerob +- [docs] Add redirection for links published on npm (#22575) @oliviertassinari +- [docs] Add LightyearVPN to showcase (#22568) @lightyearvpn +- [docs] Fix typo, extra 'you' (#22560) @jedsmit +- [docs] Option to disable ads (#22574) @oliviertassinari + +### Core + +- [core] Remove usage of deprecated event.keyCode (#22569) @oliviertassinari +- [core] Remove references to other objects from created theme (#22523) @eps1lon +- [core] Batch small changes (#22565) @oliviertassinari + +## 5.0.0-alpha.9 + +_Sep 6, 2020_ + +A big thanks to the 14 contributors who made this release possible. +Here are some highlights ✨: + +- 💎 A new diamond sponsor: [DoiT](https://www.doit.com/), thank you! +- 📚 Include the default value of the props in IntelliSense (#22447) @eps1lon +- ⚛️ More source migrated to TypeScript and testing-library (#22441) @baterson +- And many more 🐛 bug fixes and 📚 improvements. + +### `@material-ui/core@v5.0.0-alpha.9` + +#### Breaking changes + +- [Modal] Remove `onRendered` prop from Modal and Portal (#22464) @eps1lon + Depending on your use case either use a [callback ref](https://react.dev/learn/manipulating-the-dom-with-refs#how-to-manage-a-list-of-refs-using-a-ref-callback) on the child element or an effect hook in the child component. + +#### Changes + +- [Modal] Convert ModalManager to TypeScript (#22465) @eps1lon +- [Paper] Fix elevation warning when rendering (#22494) @nesso-pfl +- [Slider] Edge against swallowing of mouse up event (#22401) @motiejunas +- [Tabs] Add option to show scrollbar (#22438) @LogyLeo +- [Tabs] Document visibleScrollBar default value (#22475) @eps1lon +- [TextField] Remove excessive catching of hiddenLabel prop (#22444) @croraf + +### `@material-ui/lab@v5.0.0-alpha.9` + +- [docs] Include default values in IntelliSense (#22447) @eps1lon + +### Docs + +- [docs] Add DoiT diamond sponsor (#22436) @oliviertassinari +- [docs] Bump markdown-to-jsx (#22474) @eps1lon +- [docs] Change showcase approval process (#22398) @africanzoe +- [docs] Fix close context menu if repeated (#22463) @eps1lon +- [docs] Fix Next.js example (#22457) @bhati +- [docs] Fix TypeScript deps in CodeSandbox (#22346) @oliviertassinari +- [docs] Fix unresolved returntypes for props (#22459) @eps1lon +- [docs] Fix usage of overrides instead of styleOverrides (#22478) @discodanne +- [docs] Improve Backstage showcase (#22458) @stefanalund +- [docs] Improve styles basics.md section (#22440) @bxie +- [docs] Include default values in IntelliSense (#22447) @eps1lon + +### Core + +- [core] Batch small changes (#22461) @oliviertassinari +- [core] Fix useEventCallback type (#22448) @kodai3 +- [core] Try out new JSX transform where available (#22455) @eps1lon +- [test] Migrate more components to react-testing-library (#22441) @baterson + +## 5.0.0-alpha.8 + +_Aug 31, 2020_ + +A big thanks to the 19 contributors who made this release possible. +Here are some highlights ✨: + +- 🎨 Inverse the customization API of the theme to be component-centric (#22347, #22293) @mnajdova. + +```jsx +const theme = createMuiTheme({ + components: { + MuiIconButton: { + defaultProps: { + size: 'small', + }, + styleOverrides: { + sizeSmall: { + marginLeft: 4, + marginRight: 4, + padding: 12, + }, + }, + }, + }, +}); +``` + +- ✨ Add [text in divider](https://mui.com/components/dividers/#dividers-with-text) support (#22285) @ShehryarShoukat96 + + ```jsx + <Divider>{'CENTER'}</Divider> + ``` + + <img width="530" alt="divider" src="https://user-images.githubusercontent.com/3165635/91740018-01cb5e80-ebb3-11ea-9a7f-6ddb48b3f496.png"> + +- ♿️ A bunch of accessibility fixes (#22366, #22374, #22377, #22340, #22376) @fakeharahman @alexmotoc @eps1lon @oliviertassinari +- ⚛️ Increase adoption of TypeScript in the codebase (#22389, #22367, #22282) @Luchanso, @oliviertassinari + +### `@material-ui/core@v5.0.0-alpha.8` + +#### Breaking changes + +- [theme] Rename theme keys to defaultProps and styleOverrides (#22347) @mnajdova +- [theme] Restructure component definitions (#22293) @mnajdova + The components' definition inside the theme were restructure under the `components` key, to allow people easier discoverability about the definitions regarding one component. + + 1. `props` + + ```diff + import { createMuiTheme } from '@material-ui/core/styles'; + + const theme = createMuiTheme({ + - props: { + - MuiButton: { + - disableRipple: true, + - }, + - }, + + components: { + + MuiButton: { + + defaultProps: { + + disableRipple: true, + + }, + + }, + + }, + }); + ``` + + 2. `overrides` + + ```diff + import { createMuiTheme } from '@material-ui/core/styles'; + + const theme = createMuiTheme({ + - overrides: { + - MuiButton: { + - root: { padding: 0 }, + - }, + - }, + + components: { + + MuiButton: { + + styleOverrides: { + + root: { padding: 0 }, + + }, + + }, + + }, + }); + ``` + + Note that if you don't have the time to upgrade the structure of the theme, you + can use the `adaptV4Theme()` adapter. + +- [GridList] Rename to ImageList (#22311) @mbrookes +- [GridList] Rename Tile to Item (#22385) @mbrookes + Rename the `GridList` components to `ImageList` to align with the current Material Design naming. + + ```diff + -import GridList from '@material-ui/core/GridList'; + -import GridListTile from '@material-ui/core/GridListTile'; + -import GridListTileBar from '@material-ui/core/GridListTileBar'; + +import ImageList from '@material-ui/core/ImageList'; + +import ImageListItem from '@material-ui/core/ImageListItem'; + +import ImageListItemBar from '@material-ui/core/ImageListItemBar'; + + -<GridList> + - <GridListTile> + +<ImageList> + + <ImageListItem> + <img src="file.jpg" alt="Image title" /> + - <GridListTileBar + + <ImageListItemBar + title="Title" + subtitle="Subtitle" + /> + - </GridListTile> + -</GridList> + + </ImageListItem> + +</ImageList> + ``` + +#### Changes + +- [Breadcrumbs] Fix wrong role usage (#22366) @fakeharahman +- [Breadcrumbs] More robust focus capture (#22374) @eps1lon +- [ButtonBase] Reset box-sizing to border-box (#22316) @su8ru +- [Dialog] Fix unexpected close when releasing click on backdrop (#22310) @danbrud +- [Divider] Add text in divider (#22285) @ShehryarShoukat96 +- [Slider] Respect disabled property when already focused (#22247) @pireads +- [Tabs] Don't fire onChange if current value (#22381) @jjoselv +- [Tabs] Improve focus management on list with no active tabs (#22377) @alexmotoc +- [theme] Add theme.mixins.gutters() in adaptV4Theme (#22396) @mnajdova +- [Tooltip] Improve readability (#22340) @oliviertassinari +- [Tooltip] Meet dismissable WCAG criterion (#22376) @eps1lon +- [l10n] Improve th-TH locale (#22350) @vimutti77 + +### `@material-ui/lab@v5.0.0-alpha.8` + +- [docs] Add IntelliSense for each class in the `classes` prop (#22312) @eps1lon + +### `@material-ui/styles@v5.0.0-alpha.8` + +- [theme] Restructure component definitions (#22293) @mnajdova + +### `@material-ui/utils@v5.0.0-alpha.8` + +- [core] Move utils package to TypeScript (#22367) @oliviertassinari + +### Docs + +- [docs] Add Content Security Policy guide (#22383) @tjg37 +- [docs] Add IntelliSense for each class in the `classes` prop (#22312) @eps1lon +- [docs] Add links in the header (#22210) @oliviertassinari +- [docs] Fix Argos-ci 404 link (#22362) @brunocechet +- [docs] Fix test README typo @mbrookes +- [docs] Forward x data-grid (#22400) @oliviertassinari +- [docs] Transpile demo .ts files (#22388) @eps1lon +- [docs] Add Backstage to showcase (#22428) @stefanalund +- [docs] Update Fontsource installation instructions (#22431) @DecliningLotus + +### Core + +- [icons] Label them as vendored for GitHub (#22397) @oliviertassinari +- [test] DialogContent with testing-library (#22356) @baterson +- [test] DialogContentText with testing-library (#22357) @baterson +- [test] DialogTitle with testing-library (#22358) @baterson +- [test] Enable tests that weren't working in JSDOM (#22360) @eps1lon +- [test] Fix failing tests on Windows (#22369) @eps1lon +- [test] Update react 17 patch (#22391) @eps1lon +- [core] Add explicit dependency on `@types/yargs` (#22339) @eps1lon +- [core] Add useEnhancedEffect module (#22317) @oliviertassinari +- [core] Batch small changes (#22314) @oliviertassinari +- [core] Fix setRef types (#22389) @Luchanso +- [core] Include TypeScript definitions in GitHub source (#22282) @oliviertassinari +- [core] Refactor how we ignore default values in docs (#22355) @eps1lon +- [core] Update SECURITY.md to account for v5 @oliviertassinari + +## 5.0.0-alpha.7 + +_Aug 22, 2020_ + +A big thanks to the 22 contributors who made this release possible. +Here are some highlights ✨: + +- 💎 A new diamond sponsor: [Octopus](https://octopus.com/), thank you! +- ⚛️ Migrate parts of the codebase to TypeScript (#22295, #22280, #22179, #22195) @rothbart, @eps1lon, @oliviertassinari. +- 💅 Add support for custom variant to most of the components (9 new components in this release) @mnajdova +- ⚛️ Keep working on React 17 support (#22270, #22262) @eps1lon +- And many more 🐛 bug fixes and 📚 improvements. + +### `@material-ui/core@v5.0.0-alpha.7` + +### Breaking changes + +- [Menu] Remove transition onX props (#22212) @mbrookes + The onE\* transition props were removed. Use TransitionProps instead. + + ```diff + <Menu + - onEnter={onEnter} + - onEntered={onEntered}, + - onEntering={onEntered}, + - onExit={onEntered}, + - onExited={onEntered}, + - onExiting={onEntered} + + TransitionProps={{ + + onEnter, + + onEntered, + + onEntering, + + onExit, + + onExited, + + onExiting, + + }} + > + ``` + +- [Popover] Remove transition onX props (#22184) @mbrookes + The onE\* transition props were removed. Use TransitionProps instead. + + ```diff + <Popover + - onEnter={onEnter} + - onEntered={onEntered}, + - onEntering={onEntered}, + - onExit={onEntered}, + - onExited={onEntered}, + - onExiting={onEntered} + + TransitionProps={{ + + onEnter, + + onEntered, + + onEntering, + + onExit, + + onExited, + + onExiting, + + }} + /> + ``` + +- [TextField] Improve line-height reset (#22149) @imnasnainaec + Increase the line-height by 4px to support long descender on special alphabets. + If you were overriding the input vertical padding, reduce it by 4px. + +### Changes + +- [Accordion] Fix scroll anchoring (#22292) @brickmaker17 +- [colorManipulator] Add support for CSS Color Module Level 4 (#20790) @marcosvega91 +- [Divider] Custom variant (#22182) @mnajdova +- [Fab] Custom variant (#22189) @mnajdova +- [l10n] Add Thai (th-TH) locale (#22242) @smoogi +- [l10n] Improve ja-JP locale (#22287) @chelproc +- [Link] Custom variant (#22204) @mnajdova +- [Paper] Custom variant (#22216) @mnajdova +- [Slider] Improve touch passive event handling (#22269) @mikhalev-im +- [Stepper] Fix spacing without StepContent (#22199) @Floriferous +- [SwipeableDrawer] Fix prevented inner scroll (#22254) @BramKaashoek +- [Tabs] Add aria-orientation of vertical (#22291) @eps1lon +- [Tabs] Document how to make scroll icons visible (#22255) @Sorgrum +- [TextField] Add hidden label to multi-line filled textfield (#22284) @fakeharahman +- [Toolbar] Custom variant (#22217) @mnajdova +- [FocusTrap] Entangle effects (#22155) @eps1lon +- [FocusTrap] Fix compatibility issues with React 17 (#22270) @eps1lon +- [FocusTrap] Prevent possible crash in React 17 (#22262) @eps1lon + +### `@material-ui/icons@v5.0.0-alpha.7` + +- [icons] Synchronize icons (#22186) @oliviertassinari + +### `@material-ui/styles@v5.0.0-alpha.7` + +- [core] Change children to be optional (#22134) @suliskh + +### `@material-ui/lab@v5.0.0-alpha.7` + +- [Alert] Custom variant (#22218) @mnajdova +- [Pagination] Custom variant (#22220, #22219) @mnajdova +- [Skeleton] Custom variant (#22243) @mnajdova +- [SpeedDial] Add support for uncontrolled open state (#22248) @akharkhonov +- [Timeline] Custom variant (#22244) @mnajdova + +### Docs + +- [docs] Add Design resources in installation (#22209) @oliviertassinari +- [docs] Add Octopus diamond sponsor (#22177) @oliviertassinari +- [docs] Better track usage of icons (#22187) @oliviertassinari +- [docs] Change property/properties to prop/props (#22271) @mbrookes +- [docs] Document TextField helperText height (#22146) @morgan-sam +- [docs] Fix `@global` being considered a class (#22297) @eps1lon +- [docs] Fix a typo on TextField components (#22300) @Renfrew +- [docs] Fix use of removed transition onE\* props (#22286) @mbrookes +- [docs] Improve codesandbox generation logic (#22221) @oliviertassinari +- [docs] Migrate Onepirate to TypeScript (#22295) @rothbart +- [docs] Migrate Dashboard template to TypeScript (#22280) @oliviertassinari +- [docs] Fix minimizing-bundle-size.md (#22298) @Primajin + +### Core + +- [core] Batch small changes (#22183) @oliviertassinari +- [core] Change children to be optional (#22134) @suliskh +- [test] Clear fake timers only in afterEach hook (#22307) @dmtrKovalenko +- [test] Convert initMatchers to TypeScript (#22179) @eps1lon +- [test] Improve toHaveVirtualFocus error message (#22185) @eps1lon +- [test] Lint fix the custom rules plugin for useThemeVariants (#22192) @mnajdova +- [test] Make all tests runnable with React 17 (#22290) @eps1lon +- [test] Prevent swallowing errors during setup (#22196) @eps1lon +- [test] Setup infra for tests in TypeScript (#22195) @eps1lon +- [test] Update react next patch (#22260) @eps1lon + +## 5.0.0-alpha.6 + +_Aug 13, 2020_ + +A big thanks to the 26 contributors who made this release possible. +Here are some highlights ✨: + +- 💅 Introduce a new dynamic variant API (#21648) @mnajdova. + This API allows developers to add new variants on the Material UI's components right from the theme, without having to wrap the components. + For instance with the Button: + + ```tsx + // Define the style that should be applied, for specific props. + const theme = createMuiTheme({ + variants: { + MuiButton: [ + { + props: { variant: 'dashed', color: 'secondary' }, + styles: { + border: `4px dashed ${red[500]}`, + }, + }, + ], + }, + }); + + // Retain type safety. + declare module '@material-ui/core/Button/Button' { + interface ButtonPropsVariantOverrides { + dashed: true; + } + } + + // Enjoy! + <Button variant="dashed" />; + ``` + + More details in [the documentation](https://mui.com/material-ui/customization/components/#adding-new-component-variants) and [RFC](#21749). + +- 👮 Add documentation for the [FocusTrap](https://mui.com/base-ui/react-focus-trap/) component (#22062) @oliviertassinari. +- ⚛️ Prepare support for React v17 (#22093, #22105, #22143, #22111) @eps1lon. +- 🚧 We have undertaken breaking changes. + +### `@material-ui/core@v5.0.0-alpha.6` + +#### Breaking changes + +- [Avatar] Rename variant circle -> circular for consistency (#22015) @kodai3 + Rename `circle` to `circular` for consistency. The possible values should be adjectives, not nouns: + + ```diff + -<Avatar variant="circle"> + +<Avatar variant="circular"> + ``` + +- [Badge] Rename overlap circle -> circular and rectangle -> rectangular for consistency (#22050) @kodai3 + Rename `circle` to `circular` and `rectangle` to `rectangular` for consistency. The possible values should be adjectives, not nouns: + + ```diff + -<Badge overlap="circle"> + -<Badge overlap="rectangle"> + +<Badge overlap="circular"> + +<Badge overlap="rectangular"> + ``` + +- [CircularProgress] Remove static variant, simplify determinate (#22060) @mbrookes + The `static` variant has been merged into the `determinate` variant, with the latter assuming the appearance of the former. + The removed variant was rarely useful. It was an exception to Material Design, and was removed from the specification. + + ```diff + -<CircularProgress variant="determinate" /> + ``` + + ```diff + -<CircularProgress variant="static" classes={{ static: 'className' }} /> + +<CircularProgress variant="determinate" classes={{ determinate: 'className' }} /> + ``` + +- [Dialog] Remove transition onX props (#22113) @mbrookes + The onE\* transition props were removed. Use TransitionProps instead. + + ```diff + <Dialog + - onEnter={onEnter} + - onEntered={onEntered}, + - onEntering={onEntered}, + - onExit={onEntered}, + - onExited={onEntered}, + - onExiting={onEntered} + + TransitionProps={{ + + onEnter, + + onEntered, + + onEntering, + + onExit, + + onExited, + + onExiting, + + }} + /> + ``` + +- [Fab] Rename round -> circular for consistency (#21903) @kodai3 + Rename `round` to `circular` for consistency. The possible values should be adjectives, not nouns: + + ```diff + -<Fab variant="round"> + +<Fab variant="circular"> + ``` + +- [List] Improve hover/select/focus UI display (#21930) @joshwooding +- [Pagination] Rename round -> circular for consistency (#22009) @kodai3 + Rename `round` to `circular` for consistency. The possible values should be adjectives, not nouns: + + ```diff + -<Pagination shape="round"> + -<PaginationItem shape="round"> + +<Pagination shape="circular"> + +<PaginationItem shape="circular"> + ``` + +- [RootRef] Remove component (#21974) @eps1lon + This component was removed. You can get a reference to the underlying DOM node of our components via `ref` prop. + The component relied on [`ReactDOM.findDOMNode`](https://legacy.reactjs.org/docs/react-dom.html#finddomnode) which is [deprecated in `React.StrictMode`](https://legacy.reactjs.org/docs/strict-mode.html#warning-about-deprecated-finddomnode-usage). + + ```diff + -<RootRef rootRef={ref}> + - <Button /> + -</RootRef> + +<Button ref={ref} /> + ``` + +- [Snackbar] Change the default position on desktop (#21980) @kodai3 + The notification now displays at the bottom left on large screens. + It better matches the behavior of Gmail, Google Keep, material.io, etc. + You can restore the previous behavior with: + + ```diff + -<Snackbar /> + +<Snackbar anchorOrigin={{ vertical: 'bottom', horizontal: 'center' }} /> + ``` + +- [Snackbar] Remove transition onX props (#22107) @mbrookes + The onE\* transition props were removed. Use TransitionProps instead. + + ```diff + <Snackbar + - onEnter={onEnter} + - onEntered={onEntered}, + - onEntering={onEntered}, + - onExit={onEntered}, + - onExited={onEntered}, + - onExiting={onEntered} + + TransitionProps={{ + + onEnter, + + onEntered, + + onEntering, + + onExit, + + onExited, + + onExiting, + + }} + /> + ``` + +- [TextareaAutosize] Rename rowsMax->maxRows & rowsMin->minRows (#21873) @mhayk + Rename `rowsMin`/`rowsMax` prop with `mi Rows`/`maxRows` for consistency with HTML attributes. + + ```diff + -<TextField rowsMax={6}> + -<TextareAutosize rowsMin={1}> + -<TextareAutosize rowsMax={6}> + +<TextField maxRows={6}> + +<TextareAutosize minRows={1}> + +<TextareAutosize maxRows={6}> + ``` + +- [TextField] Better isolate static textarea behavior to dynamic one (#21995) @AxartInc + Better isolate the fixed textarea height behavior to the dynamic one. + You need to use the `rowsMin` prop in the following case: + + ```diff + -<TextField rows={2} rowsMax={5} /> + +<TextField rowsMin={2} rowsMax={5} /> + ``` + + Remove the `rows` prop, use the `rowsMin` prop instead. + This change aims to clarify the behavior of the prop. + + ```diff + -<TextareaAutosize rows={2} /> + +<TextareaAutosize rowsMin={2} /> + ``` + +- [theme] Remove theme.mixins.gutters (#22109) @joshwooding + The abstraction hasn't proven to be used frequently enough to be valuable. + + ```diff + -theme.mixins.gutters(), + +paddingLeft: theme.spacing(2), + +paddingRight: theme.spacing(2), + +[theme.breakpoints.up('sm')]: { + + paddingLeft: theme.spacing(3), + + paddingRight: theme.spacing(3), + +}, + ``` + +#### Changes + +- [Avatar] Custom variant (#22139) @mnajdova +- [Badge] Add missing class key (#22095) @kodai3 +- [Badge] Custom variant (#22140) @mnajdova +- [Button] Improved variant type names & cleanup tests (#22010) @mnajdova +- [ButtonBase] Forward type to other components than 'button' (#22172) @eps1lon +- [ButtonGroup] Custom variant (#22160) @mnajdova +- [Chip] Custom variant (#22161) @mnajdova +- [CssBaseline] Add text size adjust property (#22089) @Tolsee +- [l10n] Add Greek (el-GR) locale (#21988) @tmanolat +- [Table] Cell small's right padding is bigger than medium (#22017) @adamlaurencik +- [FocusTrap] Add documentation (#22062) @oliviertassinari +- [Typography] Add custom variants support (#22006) @mnajdova +- [useIsFocusVisible] Remove focus-visible if focus is re-targetted (#22102) @eps1lon +- [core] Fix various potential issues with multiple windows (#22159) @scottander +- [core] Improve hook dependencies in useControlled.js (#21977) @roth1002 + +### `@material-ui/lab@v5.0.0-alpha.6` + +#### Breaking changes + +- [Skeleton] Rename variant circle -> circular and rect -> rectangular for consistency (#22053) @kodai3 + Rename `circle` to `circular` and `rect` to `rectangular` for consistency. The possible values should be adjectives, not nouns: + + ```diff + -<Skeleton variant="circle"> + -<Skeleton variant="rect"> + +<Skeleton variant="circular"> + +<Skeleton variant="rectangular"> + ``` + +#### Changes + +- [Autocomplete] Add support for "{label: string}" data type as a default for "options" (#21992) @DanailH +- [TreeView] Add disabled prop (#20133) @netochaves +- [TreeView] Simplify focus logic (#22098) @eps1lon +- [TreeView] Test current behavior of active item removal (#21720) @eps1lon +- [TreeView] Test selection behavior (#21901) @joshwooding + +### `@material-ui/system@v5.0.0-alpha.6` + +- [core] Bump csstype to 3.0.0 (#22048) @eps1lon + +### Docs + +- [docs] Add 'size' prop to ToggleButton API docs (#22052) @zenje +- [docs] Add ClassKeys migration description for Renaming API (#22061) @kodai3 +- [docs] Add a label to the TreeView demos (#21900) @joshwooding +- [docs] Add missing JSDoc for various props (#22005) @eps1lon +- [docs] Add the services that support MUI in readme (#22137) @naineet +- [docs] Add trailingSlash: true (#22008) @oliviertassinari +- [docs] Add visibility to TypeScript examples (#22013) @esemeniuc +- [docs] Avoid using any type in Tabs examples (#22091) @tacigar +- [docs] Bump next to 9.5.0 (#21975) @eps1lon +- [docs] Disallow undefined array members at runtime where they're unexpected (#21990) @eps1lon +- [docs] Improve Autocomplete GitHub demo (#22153) @aquibbaig +- [docs] Improve draggable dialog demo wording (#22021) @Sanskar95 +- [docs] Improve transition props API descriptions (#21952) @maksimgm +- [docs] Port buildApi to TypeScript (#22055) @eps1lon +- [docs] Update build instructions for component API (#21970) @eps1lon +- [docs] Update grouped instruction of autocomplete (#22056) @yfng96 +- [docs] Use `import * as React from 'react';` (#22058) @mbrookes +- [docs] Use pickers v4 (#22023) @eps1lon + +### Core + +- [core] Allow running prettier from material-ui-x (#22071) @oliviertassinari +- [core] Bump csstype to 3.0.0 (#22048) @eps1lon +- [core] Fix next and prevent future regressions (#22135) @eps1lon +- [core] Improve merge-conflict label automation (#22065) @eps1lon +- [core] Lint cleanup (#21972) @eps1lon +- [core] Resolve all dot-prop versions to 5.x (#22007) @eps1lon +- [core] Small changes (#22020) @oliviertassinari +- [Security] Bump elliptic from 6.5.0 to 6.5.3 (#21997) @dependabot-preview +- [test] Drop css-loader (#21999) @eps1lon +- [test] Lint framer workspace (#22002) @eps1lon +- [test] Lint useThemeVariants with custom rules plugin (#21963) @eps1lon +- [test] Run same tests in coverage and unit (#22092) @eps1lon +- [test] Type-check framerx package (#21868) @eps1lon +- [test] Work on React v17 (#22093, #22105, #22143, #22111) @eps1lon + +## 5.0.0-alpha.5 + +_July 28, 2020_ + +A big thanks to the 18 contributors who made this release possible. + +### `@material-ui/core@v5.0.0-alpha.5` + +#### Breaking changes + +- [Grid] Rename justify prop to justifyContent (#21845) @mnajdova + + Rename `justify` prop with `justifyContent` to be aligned with the CSS property name. + + ```diff + -<Grid justify="center"> + +<Grid justifyContent="center"> + ``` + +#### Changes + +- [Accordion] Add new classes key (#21920) @natac13 +- [Accordion] Fix IconButtonProps spreading logic (#21850) @kgregory +- [Avatar] Fix group size (#21896) @natac13 +- [Button] Custom variant (#21648) @mnajdova +- [CssBaseline] Export ScopedCssBaseline from barrel index (#21869) @mherczeg +- [Dialog] Fix body scrollbar close behavior (#21951) @maksimgm +- [Icon] Hide name placeholder while "Material Icons" font is loading (#21950) @maksimgm +- [Select] Ensure that onChange is called before onClose (#21878) @DanailH +- [Slider] Make `index` public in the ValueLabel props (#21932) @govardhan-srinivas + +### `@material-ui/lab@v5.0.0-alpha.5` + +- [TreeView] Change focus management to aria-activedescendant (#21695) @joshwooding +- [TreeView] Fix crash when shift clicking a clean tree (#21899) @joshwooding + +### Framer + +- [framer] Refactor as switch (#21885) @mhkasif +- [framer] Update with latest sources (#21888) @eps1lon + +### Docs + +- [blog] Q2 2020 Update (#21822) @oliviertassinari +- [docs] Add expand all and select all to controlled tree demo (#21929) @joshwooding +- [docs] Add useRadioGroup section (#21910) @kodai3 +- [docs] Autocomplete is not showing options even though they exist (#21949) @maksimgm +- [docs] Change the destination branch for PRs (#21870) @DanailH +- [docs] Fix Skeleton inline example (#21918) @ppecheux +- [docs] Fix custom Snackbar width on mobile (#21948) @ruhci28 +- [docs] Fix the type of the second argument of 'createMuiTheme' function (#21859) @DanailH +- [docs] Improve ad display @oliviertassinari +- [docs] Improve documentation of theme.breakpoints (#21922) @ruhci28 +- [docs] Link react-hook-form (#21886) @jeffshek +- [docs] Mention @MuiContrib in CONTRIBUTING (#21891) @eps1lon +- [docs] Replace latests tags with next in the codesandbox (#21851) @mnajdova +- [docs] Update gold sponsor to Text-Em-All (formerly Call-Em-All) (#21897) @jonmiller0 +- [docs] Update testing guide (#21863) @eps1lon + +### Core + +- [test] Enable more StrictMode tests (#21817) @eps1lon +- [test] Lint internal typescript-to-proptypes fork (#21876) @eps1lon +- [test] Pass didWarnControlledToUncontrolled between tests (#21875) @eps1lon +- [test] Unify import to `test/utils (#21856) @eps1lon +- [core] Add warnings where ref-forwarding components/elements are required (#21883) @eps1lon +- [core] Automatically tweet about good first issues (#21879) @eps1lon +- [core] Batch small changes (#21928) @oliviertassinari +- [core] Remove /test-utils (#21855) @eps1lon +- [core] Throw on unused `typescript-to-proptypes-ignore` directives (#21867) @eps1lon + +## 5.0.0-alpha.4 + +_July 19, 2020_ + +A big thanks to the 11 contributors who made this release possible. + +### `@material-ui/core@v5.0.0-alpha.4` + +#### Breaking changes + +- [core] Drop support for non-ref-forwarding class components (#21811) @eps1lon + Support for non-ref-forwarding class components in the `component` prop or as an immediate `children` has been dropped. If you were using `unstable_createStrictModeTheme` or didn't see any warnings related to `findDOMNode` in `React.StrictMode` then you don't need to do anything. + Otherwise check out the ["Caveat with refs" section in our composition guide](/guides/composition/#caveat-with-refs) to find out how to migrate. + This change affects almost all components where you're using the `component` prop or passing `children` to components that require `children` to be elements (for example `<MenuList><CustomMenuItem /></MenuList>`) +- [Stepper] Use context API (#21613) @baterson + Rely on the context over the `React.cloneElement()` API. + This change makes composition easier. + +### `@material-ui/icons@v5.0.0-alpha.4` + +- [icons] Add Google brand icon (#21807) @bmg02 + +### Docs + +- [docs] Break up Select demos (#21792) @cjoecker +- [docs] Change RMUIF info to new version (#21812) @phoqe +- [docs] Fix Spanish translation (#21800) @adamsr123 +- [docs] Fix nav color (#21780) @mbrookes +- [docs] Update advanced-de.md (#21786) @jasonericdavis + +### Core + +- [core] Allow dist tag as argv in use-react-dist-tag (#21810) @eps1lon +- [core] Drop support for non-ref-forwarding class components (#21811) @eps1lon +- [core] Lint with typescript-eslint parser (#21758) @oliviertassinari +- [core] One label is enough @oliviertassinari +- [core] Remove lint:fix command @oliviertassinari +- [test] Enable "missing act()"-warnings (#21802) @eps1lon +- [test] Improve stack trace for unexpected errors (#21818) @eps1lon +- [test] Update react next patch (#21746) @eps1lon +- [test] Use testing-library in withStyles (#21804) @eps1lon + +## 5.0.0-alpha.3 + +_July 12, 2020_ + +A big thanks to the 14 contributors who made this release possible. + +### `@material-ui/core@v5.0.0-alpha.3` + +- [Avatar] Avoid usage of z-index (#21685) @nvdai2401 +- [GridList] Fix crash when loading images (#21741) @paradoxxxzero +- [List] Fix secondary action position when disableGutters={true} (#21732) @kgregory +- [TablePagination] Fix broken labelling if SelectProps provided ids (#21703) @eps1lon +- [theme] Fix custom breakpoint in CSS Media Queries (#21759) @nkrivous +- [FocusTrap] Fix disableAutoFocus prop (#21612) @oliviertassinari + +### `@material-ui/lab@v5.0.0-alpha.3` + +- [lab] Fix TypeScript theme overrides support (#21724) @cjoecker +- [Autocomplete] Fail form validation if required is filled when `multiple` (#21692, #21670) @weslenng, @eps1lon + +### Docs + +- [examples] Include troubleshooting for next.js (#21683) @ocavue +- [docs] Add ethicalads.io (#21752) @oliviertassinari +- [docs] Apply small fixes (#21754) @jaironalves +- [docs] Batch small changes (#21669) @oliviertassinari +- [docs] Bump next to 9.4.4 (#21690) @eps1lon +- [docs] Fix custom switch ripple color (#21729) @xanderoku +- [docs] Fix text from showcase (#21755) @cjoecker +- [docs] Improve customized timeline demo (#21739) @mageprincess +- [docs] Move more prop docs into IntelliSense (#21659) @eps1lon +- [docs] Move more prop docs into IntelliSense (#21687) @eps1lon +- [docs] Recommend default branch (#21719) @eps1lon +- [docs] Remove `@document` directive from IntelliSense (#21688) @eps1lon +- [docs] Track web-vitals (#21702) @eps1lon + +### Core + +- [test] Allow container + hydrate in render (#21747) @eps1lon +- [test] Bump url-loader (#21689) @eps1lon +- [test] Restore clock between each test (#21760) @eps1lon +- [test] Run lab unit tests in browser (#21691) @eps1lon +- [core] Allow generating markdown api docs for subset of components (#21731) @eps1lon +- [core] Batch small changes (#21756) @oliviertassinari +- [core] Don't bail out early if docs:api fails (#21726) @eps1lon +- [core] Remove dead code from docs:api (#21730) @eps1lon +- [core] Simplify debounce (#21666) @NMinhNguyen +- [core] Use common yarn version (#21779) @eps1lon + +## 5.0.0-alpha.2 + +_July 4, 2020_ + +A big thanks to the 16 contributors who made this release possible. + +### `@material-ui/core@v5.0.0-alpha.2` + +#### Breaking changes + +- [Button] Make primary the default color (#21594) @mbrookes + The button `color` prop is now "primary" by default, and "default" has been removed. This makes the button closer to the Material Design specification and simplifies the API. + + ```diff + -<Button color="default" /> + -<Button color="primary" /> + +<Button /> + +<Button /> + ``` + +- [ExpansionPanel] Remove component (#21630) @mnajdova + This completes our effort on renaming the ExpansionPanel component Accordion +- [Collapse] Add orientation and horizontal support (#20619) @darkowic + The `collapsedHeight` prop was renamed `collapsedSize` to support the horizontal direction. + + ```diff + -<Collapse collapsedHeight={40}> + +<Collapse collapsedSize={40}> + ``` + +#### Changes + +- [Card] Fix vertically center header action (#21646) @kgregory +- [l10n] Update cs-CZ and sk-SK locales (#21656) @char0n +- [l10n] Update sv-SE locale (#21631) @tbz +- [Menu] Remove overflow style in MenuItem (#21644) @tj3407 +- [MenuItem] Add types for ListItemClasses (#21654) @eps1lon +- [Slider] Fix cannot read property 'focus' of null (#21653) @mageprincess +- [TextField] Fix CSS isolation issue (#21665) @Codetalker777 +- [FocusTrap] Fix portal support (#21610) @mnajdova +- [TypeScript] Fix version support (#21640) @jakubfiglak + +### `@material-ui/lab@v5.0.0-alpha.2` + +- [TreeView] Improve node registration and fix other issues (#21574) @joshwooding + +### Docs + +- [blog] Post survey results 2020 (#21555) @mnajdova +- [docs] Add new showcase (#21637) @cjoecker +- [docs] CodeFund is shutting down (#21632) @oliviertassinari +- [docs] Document next version (#21591) @oliviertassinari +- [docs] Enable docs search on v5.0.0 & fix duplicate on master @oliviertassinari +- [docs] Fix ad issues @oliviertassinari +- [docs] Move more prop docs into IntelliSense (#21655) @eps1lon +- [docs] Remove in-context translation code & files (#21633) @mbrookes +- [example] Remove dead dependency from next-typescript (#21628) @StefanWerW + +### Core + +- [test] Add toWarnDev() and toErrorDev() matcher (#21581) @eps1lon + +## 5.0.0-alpha.1 + +_June 27, 2020_ + +A big thanks to the 33 contributors who made this release possible. Here are some highlights ✨: + +- 🔄 Introduce a new `LoadingButton` component in the lab (#21389) @mnajdova. +- 📍 Synchronize icons with Google, add 200 new icons (#21498) @alecananian +- 💥 Start working on breaking changes. + +### `@material-ui/core@v5.0.0-alpha.1` + +#### Breaking changes + +- [Divider] Use border instead of background color (#18965) @mikejav. + It prevents inconsistent height on scaled screens. For people customizing the color of the border, the change requires changing the override CSS property: + + ```diff + .MuiDivider-root { + - background-color: #f00; + + border-color: #f00; + } + ``` + +- [Rating] Rename `visuallyhidden` to `visuallyHidden` for consistency (#21413) @mnajdova. + + ```diff + <Rating + classes={{ + - visuallyhidden: 'custom-visually-hidden-classname', + + visuallyHidden: 'custom-visually-hidden-classname', + }} + /> + ``` + +- [Typography] Replace the `srOnly` prop so as to not duplicate the capabilities of [System](https://mui.com/system/getting-started/) (#21413) @mnajdova. + + ```diff + -import Typography from '@material-ui/core/Typography'; + +import { visuallyHidden } from '@material-ui/utils'; + +import styled from 'styled-component'; + + +const Span = styled('span')(visuallyHidden); + + -<Typography variant="srOnly">Create a user</Typography> + +<Span>Create a user</Span> + ``` + +- [TablePagination] Add showFirstButton and showLastButton support (#20750) @ShahAnuj2610. + The customization of the table pagination's actions labels must be done with the `getItemAriaLabel` prop. This increases consistency with the `Pagination` component. + + ```diff + <TablePagination + - backIconButtonText="Avant" + - nextIconButtonText="Après + + getItemAriaLabel={…} + ``` + +- [ExpansionPanel] Rename to Accordion (#21494) @mnajdova. + Use a more common the naming convention: + + ```diff + -import ExpansionPanel from '@material-ui/core/ExpansionPanel'; + -import ExpansionPanelSummary from '@material-ui/core/ExpansionPanelSummary'; + -import ExpansionPanelDetails from '@material-ui/core/ExpansionPanelDetails'; + -import ExpansionPanelActions from '@material-ui/core/ExpansionPanelActions'; + +import Accordion from '@material-ui/core/Accordion'; + +import AccordionSummary from '@material-ui/core/AccordionSummary'; + +import AccordionDetails from '@material-ui/core/AccordionDetails'; + +import AccordionActions from '@material-ui/core/AccordionActions'; + + -<ExpansionPanel> + +<Accordion> + - <ExpansionPanelSummary> + + <AccordionSummary> + <Typography>Location</Typography> + <Typography>Select trip destination</Typography> + - </ExpansionPanelSummary> + + </AccordionSummary> + - <ExpansionPanelDetails> + + <AccordionDetails> + <Chip label="Barbados" onDelete={() => {}} /> + <Typography variant="caption">Select your destination of choice</Typography> + - </ExpansionPanelDetails> + + </AccordionDetails> + <Divider /> + - <ExpansionPanelActions> + + <AccordionActions> + <Button size="small">Cancel</Button> + <Button size="small" color="primary">Save</Button> + - </ExpansionPanelActions> + + </AccordionActions> + -</ExpansionPanel> + +</Accordion> + ``` + +- [BottomNavigation] TypeScript: The `event` in `onChange` is no longer typed as a `React.ChangeEvent` but `React.SyntheticEvent`. + + ```diff + -<BottomNavigation onChange={(event: React.ChangeEvent<{}>) => {}} /> + +<BottomNavigation onChange={(event: React.SyntheticEvent) => {}} /> + ``` + +- [Slider] TypeScript: The `event` in `onChange` is no longer typed as a `React.ChangeEvent` but `React.SyntheticEvent`. + + ```diff + -<Slider onChange={(event: React.ChangeEvent<{}>, value: unknown) => {}} /> + +<Slider onChange={(event: React.SyntheticEvent, value: unknown) => {}} /> + ``` + +- [Tabs] TypeScript: The `event` in `onChange` is no longer typed as a `React.ChangeEvent` but `React.SyntheticEvent`. + + ```diff + -<Tabs onChange={(event: React.ChangeEvent<{}>, value: unknown) => {}} /> + +<Tabs onChange={(event: React.SyntheticEvent, value: unknown) => {}} /> + ``` + +- [Accordion] TypeScript: The `event` in `onChange` is no longer typed as a `React.ChangeEvent` but `React.SyntheticEvent`. + + ```diff + -<Accordion onChange={(event: React.ChangeEvent<{}>, expanded: boolean) => {}} /> + +<Accordion onChange={(event: React.SyntheticEvent, expanded: boolean) => {}} /> + ``` + +#### Changes + +- [Badge] Fix transition flicker (#21557) @mnajdova +- [ButtonGroup] Improve contained hover style (#21532) @alecananian +- [l10n] Improve Russian translation (#21480) @AntonLukichev +- [l10n] Improve zh-CN, add zh-TW (#21493) @Jack-Works +- [LinearProgress] High frequency updates (#21416) @dnicerio +- [Stepper] Fix optional label alignment (#21420) @curtislin7 +- [Table] Move prop docs into IntelliSense (#21530) @oliviertassinari +- [TablePagination] Add showFirstButton and showLastButton support (#20750) @ShahAnuj2610 +- [Tabs] Fix useCallback missing arguments (#21471) @KitsonBroadhurst +- [TextField] Fix FilledInput disable hover style when disabled (#21457) @tchmnn + +### `@material-ui/lab@v5.0.0-alpha.1` + +- [Autocomplete] Fix support for renderTags={() => null} (#21460) @matthenschke +- [LoadingButton] Introduce new component (#21389) @mnajdova +- [Pagination] Fix display when boundaryCount={0} (#21446) @guimacrf +- [Skeleton] Fix text border (#21543) @el1f +- [Timeline] Align dots with content (#21402) @mnajdova +- [TreeView] Minor styling changes (#21573) @joshwooding +- [TreeView] Simplify customization (#21514) @joshwooding + +### `@material-ui/icons@v5.0.0-alpha.1` + +- [icons] Synchronize icons with Google (#21498) @alecananian + +### `@material-ui/system@v5.0.0-alpha.1` + +- [system] Introduce visuallyHidden style utility (#21413) @mnajdova + +### Docs + +- [docs] Add CSP support section to docs (#21479) @razor-x +- [docs] Add explicit example for extending existing palette colors (#21458) @BennyHinrichs +- [docs] Add more details about breakpoint widths (#21545) @Muzietto +- [docs] Add new gold sponsor @oliviertassinari +- [docs] Add transitions customization page (#21456) @mnajdova +- [docs] Correct syntax errors to improve document readability (#21515) @AGDholo +- [docs] Document type="number" limitation (#21500) @IwalkAlone +- [docs] Entry for translations and fix grammar error (#21478) @jaironalves +- [docs] Fix broken "customization" anchor link (#21506) @connorads +- [docs] Fix typo in MultipleSelects.js (#21510) @ShiyuCheng2018 +- [docs] Fix typo in SpeedDialIcon classes comment (#21398) @zachbradshaw +- [docs] Fix typo in TextField required prop (#21538) @HumbertoL +- [docs] Fix version in localized urls (#21442) @tchmnn +- [docs] Format english markdown files (#21463) @eps1lon +- [docs] Format some previously unformatted, untranslated files (#21558) @eps1lon +- [docs] Hide duplicate table borders (#20809) @marcosvega91 +- [docs] Improve docs for useMediaQuery and breakpoint (#21512) @DDDDDanica +- [docs] Improve npm homepage links (#21452) @eps1lon +- [docs] Move more prop docs into IntelliSense (#21383) @eps1lon +- [docs] Restrict docs markdown and demos to 80ch (#21481) @eps1lon +- [docs] Reword palette intention and fix format (#21477) @DDDDDanica +- [docs] Update v4 migration guide (#21462) @eps1lon + +### Core + +- [typescript-to-proptypes] Integrate into monorepo @eps1lon +- [test] Add type test CardHeader title component (#21590) @eps1lon +- [test] Fix type tests not being type checked (#21539) @eps1lon +- [test] Ignore empty vrtests (#21450) @eps1lon +- [test] Improve makeStyles error coverage (#21568) @eps1lon +- [test] Migrate Typography to testing-library (#21534) @marcosvega91 +- [test] Move size comparison details to separate page (#21504) @eps1lon +- [test] Use testing-library in MenuItem (#21391) @eps1lon +- [test] Use testing-library in StepButton (#21406) @baterson +- [test] Use testing-library in Stepper (#21400) @baterson +- [core] Batch small changes (#21419) @oliviertassinari +- [core] Batch small changes (#21553) @oliviertassinari +- [core] Disable caching for yarn proptypes permanently (#21414) @eps1lon +- [core] Extend env for build script (#21403) @eps1lon +- [core] Fix react next patch and prevent regression (#21495) @eps1lon +- [core] Fork typescript-to-proptypes (#21497) @eps1lon +- [core] Misc branch cleaning (#21459) @eps1lon +- [core] Misc prettier changes (#21484) @eps1lon +- [core] Run prettier on the JSON sources (#21556) @oliviertassinari +- [core] Type custom `onChange` implementations with a generic react event (#21552) @eps1lon ## 4.12.3 -<!-- markdownlint-restore --> <!-- generated comparing v4.12.2..master --> _Jul 27, 2021_ diff --git a/CONTRIBUTING.md b/CONTRIBUTING.md index 374c20efe88a41..3b43ecde31fcca 100644 --- a/CONTRIBUTING.md +++ b/CONTRIBUTING.md @@ -72,11 +72,11 @@ git remote add upstream https://github.com/mui/material-ui.git <!-- #default-branch-switch --> -3. Synchronize your local `next` branch with the upstream one: +3. Synchronize your local `master` branch with the upstream one: ```bash -git checkout next -git pull upstream next +git checkout master +git pull upstream master ``` 4. Install the dependencies with pnpm (yarn or npm aren't supported): @@ -146,7 +146,7 @@ Make sure the following is true: <!-- #default-branch-switch --> -- The branch is targeted at `next` for ongoing development. All tests are passing. Code that lands in `next` must be compatible with the latest alpha/beta release. It may contain additional features but no breaking changes. We should be able to release a new minor version from the tip of `next` at any time. +- The branch is targeted at `master` for ongoing development. All tests are passing. Code that lands in `master` must be compatible with the latest stable release. It may contain additional features but no breaking changes. We should be able to release a new minor version from the tip of `master` at any time. - If a feature is being added: - If the result was already achievable with the core library, you've explained why this feature needs to be added to the core. - If this is a common use case, you've added an example to the documentation. @@ -263,7 +263,7 @@ $ pnpm docs:api ### Coding style Please follow the coding style of the project. -MUI Core projects use prettier and ESLint, so if possible, enable linting in your editor to get real-time feedback. +It uses Prettier and ESLint, so if possible, enable linting in your editor to get real-time feedback. - `pnpm prettier` reformats the code. - `pnpm eslint` runs the linting rules. diff --git a/README.md b/README.md index 9f373c703d8d22..41bbdd7cc4dd8e 100644 --- a/README.md +++ b/README.md @@ -5,12 +5,6 @@ <h1 align="center">Material UI</h1> -**Material UI** contains foundational React UI component libraries for shipping new features faster: - -- [Material UI](https://mui.com/material-ui/) is a comprehensive library of components that features our implementation of Google's [Material Design](https://m2.material.io/design/introduction/) system. - -- [Joy UI](https://mui.com/joy-ui/getting-started/) is a library of beautifully designed React UI components built to spark joy. - <div align="center"> [![license](https://img.shields.io/badge/license-MIT-blue.svg)](https://github.com/mui/material-ui/blob/HEAD/LICENSE) @@ -27,30 +21,37 @@ </div> -## Documentation +[Material UI](https://mui.com/material-ui/) is a comprehensive library of React components that features our independent implementation of Google's [Material Design](https://m2.material.io/design/introduction/) system. +It's trusted by some of the world's greatest product teams because it's been rigorously battle-tested through more than a decade of development by thousands of open-source contributors. + +Material UI's core functionality is extended by [MUI X](https://github.com/mui/mui-x), a suite of complex components for advanced use cases. -### Material UI +## Documentation -Visit [https://mui.com/material-ui/](https://mui.com/material-ui/) to view the full documentation. +Get started in the [Material UI documentation](https://mui.com/material-ui/getting-started/). <details> <summary>Older versions</summary> -- **[v4.x](https://v4.mui.com/)** ([Migration from v4 to v5](https://mui.com/material-ui/migration/migration-v4/)) -- **[v3.x](https://v3.mui.com/)** ([Migration from v3 to v4](https://mui.com/material-ui/migration/migration-v3/)) -- **[v0.x](https://v0.mui.com/)** ([Migration to v1](https://mui.com/material-ui/migration/migration-v0x/)) +- **[v5.x](https://v5.mui.com/)** ([Upgrading from v5 to v6](https://mui.com/material-ui/migration/upgrade-to-v6/)) +- **[v4.x](https://v4.mui.com/)** ([Upgrading from v4 to v5](https://mui.com/material-ui/migration/migration-v4/)) +- **[v3.x](https://v3.mui.com/)** ([Upgrading from v3 to v4](https://mui.com/material-ui/migration/migration-v3/)) +- **[v0.x](https://v0.mui.com/)** ([Upgrading to v1](https://mui.com/material-ui/migration/migration-v0x/)) </details> -**Note:** `@next` only points to pre-releases. +**Note:** `@next` points to pre-releases. Use `@latest` for the latest stable release. -### Joy UI +## Joy UI + +This repository also contains Joy UI, an experimental component library that implements our own in-house Joy Design. +Joy UI is in beta and _development is currently on hold_. +When starting a new project from scratch, we recommend Material UI over Joy UI because we can guarantee ongoing support. -Visit [https://mui.com/joy-ui/getting-started/](https://mui.com/joy-ui/getting-started/) to view the full documentation. +You're welcome to open new issues and PRs to help improve Joy UI, but please keep in mind that the maintainers are primarily focused on other projects and may not be able to respond in a timely manner. -**Note**: Joy UI is still in beta. -We are adding new components regularly and you're welcome to contribute! +View the [Joy UI documentation](https://mui.com/joy-ui/getting-started/). ## Sponsors @@ -77,6 +78,12 @@ via [Open Collective](https://opencollective.com/mui-org) or via [Patreon](http <a href="https://megafamous.com/?utm_source=MUI&utm_medium=referral&utm_content=readme" rel="noopener sponsored" target="_blank"><img height="96" width="96" src="https://mui.com/static/sponsors/megafamous.png" alt="megafamous.com" title="MegaFamous: Buy Instagram followers and likes." loading="lazy" /></a> <a href="https://www.dialmycalls.com/?utm_source=MUI&utm_medium=referral&utm_content=readme" rel="noopener sponsored" target="_blank"><img height="96" width="96" src="https://images.opencollective.com/dialmycalls/f5ae9ab/avatar/288.png" alt="dialmycalls.com" title="DialMyCalls: Send text messages, calls, and emails." loading="lazy" /></a> <a href="https://goread.io/?utm_source=MUI&utm_medium=referral&utm_content=readme" rel="noopener sponsored" target="_blank"><img height="96" width="96" src="https://images.opencollective.com/goread_io/eb6337d/logo/288.png" alt="goread.io" title="Goread.io: Instagram followers, likes, views, and comments." loading="lazy" /></a> + <a href="https://copycopter.ai/?utm_source=MUI&utm_medium=referral&utm_content=readme" rel="noopener sponsored" target="_blank"><img height="96" width="96" src="https://images.opencollective.com/copycopterai/e167216/logo/288.png" alt="copycopter.ai" title="CopyCopter: Turn prompts into videos at ultra speed." loading="lazy" /></a> +</p> + +<p> + <a href="https://buzzoid.com/?utm_source=MUI&utm_medium=referral&utm_content=readme" rel="noopener sponsored" target="_blank" style="margin-right:8px;" ><img height="24" width="26" src="https://images.opencollective.com/buzzoidz/d23d9bb/logo/24.png" srcset="https://images.opencollective.com/buzzoidz/d23d9bb/logo/72.png 3x" alt="buzzoid.com" title="Buzzoid: Instant delivery Instagram followers." loading="lazy" style="margin-right:8px;" />Buzzoid</a> + <a href="https://twicsy.com/?utm_source=MUI&utm_medium=referral&utm_content=readme" rel="noopener sponsored" target="_blank" style="margin-right:8px;" ><img height="24" width="27" src="https://images.opencollective.com/twicsy/7af290f/logo/24.png" alt="twicsy.com" title="Twicsy: Instant delivery Instagram followers." style="margin-right:8px;" loading="lazy" />Twicsy</a> </p> Gold sponsors are those who have pledged \$500/month or more to MUI. @@ -102,7 +109,7 @@ You can find complete templates and themes in the [MUI Store](https://mui.com/s Read the [contributing guide](/CONTRIBUTING.md) to learn about our development process, how to propose bug fixes and improvements, and how to build and test your changes. Contributing is about more than just issues and pull requests! -There are many other ways to [support Material UI](https://mui.com/material-ui/getting-started/faq/#mui-is-awesome-how-can-i-support-the-project) beyond contributing to the code base. +There are many other ways to [support Material UI](https://mui.com/material-ui/getting-started/faq/#mui-is-an-awesome-organization-how-can-i-support-it) beyond contributing to the code base. ## Changelog @@ -114,12 +121,11 @@ Future plans and high-priority features and enhancements can be found in the [ro ## License -This project is licensed under the terms of the -[MIT license](/LICENSE). +This project is licensed under the terms of the [MIT license](/LICENSE). ## Security -For details of supported versions and contact details for reporting security issues, please refer to the [security policy](https://github.com/mui/material-ui/security/policy). +For details on supported versions and contact information for reporting security issues, please refer to the [security policy](https://github.com/mui/material-ui/security/policy). ## Sponsoring services diff --git a/SECURITY.md b/SECURITY.md index 72e098f169ea14..33fe1f501efd73 100644 --- a/SECURITY.md +++ b/SECURITY.md @@ -4,14 +4,15 @@ The versions of the project that are currently supported with security updates. -| Material UI version | Release | Supported | -| ------------------: | :--------- | :------------------- | -| ^5.0.0 | 2021-09-16 | ✅ Stable major | -| ^4.0.0 | 2019-06-23 | ✅ Long-term support | -| ^3.0.0 | 2018-08-27 | ❌ | -| ^2.0.0 | / | ❌ | -| ^1.0.0 | 2018-06-18 | ❌ | -| <=1.0.0 | 2014-10-05 | ❌ | +| Material UI version | Release | Supported | +| ------------------: | :--------- | :----------------------------------- | +| ^6.0.0 | 2024-08-26 | :white_check_mark: Stable major | +| ^5.0.0 | 2021-09-16 | :white_check_mark: Long-term support | +| ^4.0.0 | 2019-06-23 | :x: | +| ^3.0.0 | 2018-08-27 | :x: | +| ^2.0.0 | / | :x: | +| ^1.0.0 | 2018-06-18 | :x: | +| <=1.0.0 | 2014-10-05 | :x: | ## Reporting a vulnerability diff --git a/apps/pigment-css-next-app/package.json b/apps/pigment-css-next-app/package.json index b0b673c19f3d2c..40fceb33df36a7 100644 --- a/apps/pigment-css-next-app/package.json +++ b/apps/pigment-css-next-app/package.json @@ -23,9 +23,9 @@ "react-dom": "^18.3.1" }, "devDependencies": { - "@pigment-css/nextjs-plugin": "0.0.20", - "@types/node": "^20.5.7", - "@types/react": "^18.3.3", + "@pigment-css/nextjs-plugin": "0.0.22", + "@types/node": "^20.16.5", + "@types/react": "^18.3.4", "@types/react-dom": "^18.3.0", "eslint": "^8.57.0", "typescript": "^5.5.4" diff --git a/apps/pigment-css-next-app/src/app/material-ui/react-grid/page.tsx b/apps/pigment-css-next-app/src/app/material-ui/react-grid/page.tsx index 682738ce066e60..491062b0c5e591 100644 --- a/apps/pigment-css-next-app/src/app/material-ui/react-grid/page.tsx +++ b/apps/pigment-css-next-app/src/app/material-ui/react-grid/page.tsx @@ -1,3 +1,4 @@ +'use client'; import * as React from 'react'; import Box from '@mui/material/Box'; import Paper from '@mui/material/Paper'; diff --git a/apps/pigment-css-next-app/src/app/material-ui/react-select/page.tsx b/apps/pigment-css-next-app/src/app/material-ui/react-select/page.tsx new file mode 100644 index 00000000000000..08503cbb49db81 --- /dev/null +++ b/apps/pigment-css-next-app/src/app/material-ui/react-select/page.tsx @@ -0,0 +1,121 @@ +'use client'; +import * as React from 'react'; +import BasicSelect from '../../../../../../docs/data/material/components/selects/BasicSelect'; +import ControlledOpenSelect from '../../../../../../docs/data/material/components/selects/ControlledOpenSelect'; +import CustomizedSelects from '../../../../../../docs/data/material/components/selects/CustomizedSelects'; +import DialogSelect from '../../../../../../docs/data/material/components/selects/DialogSelect'; +import GroupedSelect from '../../../../../../docs/data/material/components/selects/GroupedSelect'; +import MultipleSelect from '../../../../../../docs/data/material/components/selects/MultipleSelect'; +import MultipleSelectCheckmarks from '../../../../../../docs/data/material/components/selects/MultipleSelectCheckmarks'; +import MultipleSelectChip from '../../../../../../docs/data/material/components/selects/MultipleSelectChip'; +import MultipleSelectNative from '../../../../../../docs/data/material/components/selects/MultipleSelectNative'; +import MultipleSelectPlaceholder from '../../../../../../docs/data/material/components/selects/MultipleSelectPlaceholder'; +import NativeSelectDemo from '../../../../../../docs/data/material/components/selects/NativeSelectDemo'; +import SelectAutoWidth from '../../../../../../docs/data/material/components/selects/SelectAutoWidth'; +import SelectLabels from '../../../../../../docs/data/material/components/selects/SelectLabels'; +import SelectOtherProps from '../../../../../../docs/data/material/components/selects/SelectOtherProps'; +import SelectSmall from '../../../../../../docs/data/material/components/selects/SelectSmall'; +import SelectVariants from '../../../../../../docs/data/material/components/selects/SelectVariants'; + +export default function Selects() { + return ( + <React.Fragment> + <section> + <h2> Basic Select</h2> + <div className="demo-container"> + <BasicSelect /> + </div> + </section> + <section> + <h2> Controlled Open Select</h2> + <div className="demo-container"> + <ControlledOpenSelect /> + </div> + </section> + <section> + <h2> Customized Selects</h2> + <div className="demo-container"> + <CustomizedSelects /> + </div> + </section> + <section> + <h2> Dialog Select</h2> + <div className="demo-container"> + <DialogSelect /> + </div> + </section> + <section> + <h2> Grouped Select</h2> + <div className="demo-container"> + <GroupedSelect /> + </div> + </section> + <section> + <h2> Multiple Select</h2> + <div className="demo-container"> + <MultipleSelect /> + </div> + </section> + <section> + <h2> Multiple Select Checkmarks</h2> + <div className="demo-container"> + <MultipleSelectCheckmarks /> + </div> + </section> + <section> + <h2> Multiple Select Chip</h2> + <div className="demo-container"> + <MultipleSelectChip /> + </div> + </section> + <section> + <h2> Multiple Select Native</h2> + <div className="demo-container"> + <MultipleSelectNative /> + </div> + </section> + <section> + <h2> Multiple Select Placeholder</h2> + <div className="demo-container"> + <MultipleSelectPlaceholder /> + </div> + </section> + <section> + <h2> Native Select Demo</h2> + <div className="demo-container"> + <NativeSelectDemo /> + </div> + </section> + <section> + <h2> Select Auto Width</h2> + <div className="demo-container"> + <SelectAutoWidth /> + </div> + </section> + <section> + <h2> Select Labels</h2> + <div className="demo-container"> + <SelectLabels /> + </div> + </section> + <section> + <h2> Select Other Props</h2> + <div className="demo-container"> + <SelectOtherProps /> + </div> + </section> + <section> + <h2> Select Small</h2> + <div className="demo-container"> + <SelectSmall /> + </div> + </section> + <section> + <h2> Select Variants</h2> + <div className="demo-container"> + <SelectVariants /> + </div> + </section> + </React.Fragment> + ); +} diff --git a/apps/pigment-css-next-app/src/app/material-ui/react-stack/page.tsx b/apps/pigment-css-next-app/src/app/material-ui/react-stack/page.tsx index 5f8510e05c4ac8..f31c22d105ea32 100644 --- a/apps/pigment-css-next-app/src/app/material-ui/react-stack/page.tsx +++ b/apps/pigment-css-next-app/src/app/material-ui/react-stack/page.tsx @@ -1,3 +1,4 @@ +'use client'; import * as React from 'react'; import Divider from '@mui/material/Divider'; import Paper from '@mui/material/Paper'; diff --git a/apps/pigment-css-vite-app/.mocharc.cjs b/apps/pigment-css-vite-app/.mocharc.cjs new file mode 100644 index 00000000000000..5f79b51262cb72 --- /dev/null +++ b/apps/pigment-css-vite-app/.mocharc.cjs @@ -0,0 +1,7 @@ +module.exports = { + recursive: true, + slow: 500, + timeout: (process.env.CIRCLECI === 'true' ? 4 : 2) * 1000, // Circle CI has low-performance CPUs. + reporter: 'dot', + require: ['@mui/internal-test-utils/setupBabelPlaywright'], +}; diff --git a/apps/pigment-css-vite-app/package.json b/apps/pigment-css-vite-app/package.json index 5998b9c5d054bf..b2171df76a94e6 100644 --- a/apps/pigment-css-vite-app/package.json +++ b/apps/pigment-css-vite-app/package.json @@ -17,6 +17,7 @@ "@mui/material": "workspace:^", "@mui/system": "workspace:^", "clsx": "^2.1.1", + "playwright": "^1.46.1", "react": "^18.3.1", "react-dom": "^18.3.1", "react-error-boundary": "^4.0.13", @@ -25,14 +26,15 @@ "devDependencies": { "@babel/preset-react": "^7.24.7", "@babel/preset-typescript": "^7.24.7", - "@pigment-css/vite-plugin": "0.0.20", - "@types/react": "^18.3.3", + "@pigment-css/vite-plugin": "0.0.22", + "@types/react": "^18.3.4", "@types/react-dom": "^18.3.0", "@vitejs/plugin-react": "^4.3.1", - "postcss": "^8.4.41", + "postcss": "^8.4.45", "postcss-combine-media-query": "^1.0.1", - "vite": "5.4.1", - "vite-plugin-pages": "^0.32.3" + "vite": "5.4.2", + "vite-plugin-pages": "^0.32.3", + "vite-plugin-node-polyfills": "0.22.0" }, "nx": { "targets": { diff --git a/apps/pigment-css-vite-app/src/pages/fixtures/PigmentCssSelectOpen.js b/apps/pigment-css-vite-app/src/pages/fixtures/PigmentCssSelectOpen.js new file mode 100644 index 00000000000000..e525d640f24c81 --- /dev/null +++ b/apps/pigment-css-vite-app/src/pages/fixtures/PigmentCssSelectOpen.js @@ -0,0 +1,34 @@ +import * as React from 'react'; +import Box from '@mui/material/Box'; +import InputLabel from '@mui/material/InputLabel'; +import MenuItem from '@mui/material/MenuItem'; +import FormControl from '@mui/material/FormControl'; +import Select from '@mui/material/Select'; + +export default function BasicSelect() { + const [age, setAge] = React.useState(10); + + const handleChange = (event) => { + setAge(event.target.value); + }; + + return ( + <Box sx={{ minWidth: 120, minHeight: 250 }}> + <FormControl fullWidth> + <InputLabel id="demo-simple-select-label">Age</InputLabel> + <Select + defaultOpen + labelId="demo-simple-select-label" + id="demo-simple-select" + value={age} + label="Age" + onChange={handleChange} + > + <MenuItem value={10}>Ten</MenuItem> + <MenuItem value={20}>Twenty</MenuItem> + <MenuItem value={30}>Thirty</MenuItem> + </Select> + </FormControl> + </Box> + ); +} diff --git a/apps/pigment-css-vite-app/src/pages/fixtures/index.test.js b/apps/pigment-css-vite-app/src/pages/fixtures/index.test.js new file mode 100644 index 00000000000000..374fb877080d44 --- /dev/null +++ b/apps/pigment-css-vite-app/src/pages/fixtures/index.test.js @@ -0,0 +1,117 @@ +import * as path from 'path'; +import * as fse from 'fs-extra'; +import * as playwright from 'playwright'; + +async function main() { + const baseUrl = 'http://localhost:5001/fixtures'; + const screenshotDir = path.resolve('screenshots/chrome'); + const browser = await playwright.chromium.launch({ + args: ['--font-render-hinting=none'], + // otherwise the loaded google Roboto font isn't applied + headless: false, + }); + // reuse viewport from `vrtest` + // https://github.com/nathanmarks/vrtest/blob/1185b852a6c1813cedf5d81f6d6843d9a241c1ce/src/server/runner.js#L44 + const page = await browser.newPage({ + viewport: { width: 1000, height: 700 }, + reducedMotion: 'reduce', + }); + + // Block images since they slow down tests (need download). + // They're also most likely decorative for documentation demos + await page.route(/./, async (route, request) => { + const type = await request.resourceType(); + if (type === 'image') { + route.abort(); + } else { + route.continue(); + } + }); + + // Wait for all requests to finish. + // This should load shared resources such as fonts. + await page.goto(`${baseUrl}`, { waitUntil: 'networkidle0' }); + // If we still get flaky fonts after awaiting this try `document.fonts.ready` + // await page.waitForSelector('[data-webfontloader="active"]', { state: 'attached' }); + + // Simulate portrait mode for date pickers. + // See `useIsLandscape`. + await page.evaluate(() => { + Object.defineProperty(window.screen.orientation, 'angle', { + get() { + return 0; + }, + }); + }); + + let routes = await page.$$eval('#tests a', (links) => { + return links.map((link) => link.href); + }); + routes = routes.map((route) => route.replace(baseUrl, '')); + + async function renderFixture(index) { + // Use client-side routing which is much faster than full page navigation via page.goto(). + // Could become an issue with test isolation. + // If tests are flaky due to global pollution switch to page.goto(route); + // puppeteers built-in click() times out + await page.$eval(`#tests li:nth-of-type(${index + 1}) a`, (link) => { + link.click(); + }); + // Move cursor offscreen to not trigger unwanted hover effects. + page.mouse.move(0, 0); + + const testcase = await page.waitForSelector('#root-demo'); + + return testcase; + } + + async function takeScreenshot({ testcase, route }) { + const screenshotPath = path.resolve(screenshotDir, `.${route}.png`); + await fse.ensureDir(path.dirname(screenshotPath)); + + const explicitScreenshotTarget = await page.$('[data-testid="screenshot-target"]'); + const screenshotTarget = explicitScreenshotTarget || testcase; + + await screenshotTarget.screenshot({ + path: screenshotPath, + type: 'png', + animations: 'disabled', + }); + } + + // prepare screenshots + await fse.emptyDir(screenshotDir); + + describe('visual regressions', () => { + beforeEach(async () => { + await page.evaluate(() => { + localStorage.clear(); + }); + }); + + after(async () => { + await browser.close(); + }); + + routes.forEach((route, index) => { + it(`creates screenshots of ${route}`, async function test() { + // With the playwright inspector we might want to call `page.pause` which would lead to a timeout. + if (process.env.PWDEBUG) { + this.timeout(0); + } + + const testcase = await renderFixture(index); + await takeScreenshot({ testcase, route }); + }); + }); + }); + + run(); +} + +main().catch((error) => { + // error during setup. + // Throwing lets mocha hang. + console.error(error); + process.exit(1); +}); diff --git a/apps/pigment-css-vite-app/src/pages/fixtures/index.tsx b/apps/pigment-css-vite-app/src/pages/fixtures/index.tsx new file mode 100644 index 00000000000000..bacf026ccd1f03 --- /dev/null +++ b/apps/pigment-css-vite-app/src/pages/fixtures/index.tsx @@ -0,0 +1,80 @@ +import * as React from 'react'; +import { useLocation, matchRoutes, Link } from 'react-router-dom'; +import routes from '~react-pages'; +import IndexLayout from '../../Layout'; + +export default function Layout() { + const location = useLocation(); + const matchedRoute = React.useMemo( + () => matchRoutes(routes, location.pathname)?.[0], + [location.pathname], + ); + + const materialUIRoute = React.useMemo( + () => matchRoutes(routes, location.pathname.replace('fixtures', 'material-ui'))?.[0], + [location.pathname], + ); + + const demo = new URLSearchParams(location.search).get('demo'); + const fixturesRoutes = (matchedRoute?.route.children ?? []).filter( + (item) => !!item.path && item.path !== 'index.test', + ); + + const demosRoutes = (materialUIRoute?.route.children ?? []).filter( + (item) => !!item.path && item.path.indexOf('react-pagination') < 0, + ); + + return ( + <IndexLayout> + {demo && ( + <div id="root-demo"> + {fixturesRoutes.find((item) => item.path === demo)?.element} + {demosRoutes.find((item) => item.path === demo)?.element} + </div> + )} + <div> + <h1>Fixtures Material UI + Pigment CSS</h1> + <nav id="tests"> + <ul + sx={{ + margin: 0, + marginBlock: '1rem', + padding: 0, + paddingLeft: '1.5rem', + display: 'flex', + flexDirection: 'column', + gap: '0.5rem', + }} + > + {fixturesRoutes.map((item) => ( + <li key={item.path}> + <Link + to={`/fixtures/?demo=${item.path}`} + sx={{ + textDecoration: 'underline', + fontSize: '17px', + }} + > + {item.path} + </Link> + </li> + ))} + {demosRoutes.map((item) => ( + <li key={item.path}> + <Link + to={`/fixtures/?demo=${item.path}`} + sx={{ + textDecoration: 'underline', + fontSize: '17px', + }} + > + {item.path} + </Link> + </li> + ))} + </ul> + </nav> + </div> + </IndexLayout> + ); +} diff --git a/apps/pigment-css-vite-app/src/pages/material-ui/react-select.tsx b/apps/pigment-css-vite-app/src/pages/material-ui/react-select.tsx new file mode 100644 index 00000000000000..df82f58c059786 --- /dev/null +++ b/apps/pigment-css-vite-app/src/pages/material-ui/react-select.tsx @@ -0,0 +1,122 @@ +import * as React from 'react'; +import MaterialUILayout from '../../Layout'; +import BasicSelect from '../../../../../docs/data/material/components/selects/BasicSelect.tsx'; +import ControlledOpenSelect from '../../../../../docs/data/material/components/selects/ControlledOpenSelect.tsx'; +import CustomizedSelects from '../../../../../docs/data/material/components/selects/CustomizedSelects.tsx'; +import DialogSelect from '../../../../../docs/data/material/components/selects/DialogSelect.tsx'; +import GroupedSelect from '../../../../../docs/data/material/components/selects/GroupedSelect.tsx'; +import MultipleSelect from '../../../../../docs/data/material/components/selects/MultipleSelect.tsx'; +import MultipleSelectCheckmarks from '../../../../../docs/data/material/components/selects/MultipleSelectCheckmarks.tsx'; +import MultipleSelectChip from '../../../../../docs/data/material/components/selects/MultipleSelectChip.tsx'; +import MultipleSelectNative from '../../../../../docs/data/material/components/selects/MultipleSelectNative.tsx'; +import MultipleSelectPlaceholder from '../../../../../docs/data/material/components/selects/MultipleSelectPlaceholder.tsx'; +import NativeSelectDemo from '../../../../../docs/data/material/components/selects/NativeSelectDemo.tsx'; +import SelectAutoWidth from '../../../../../docs/data/material/components/selects/SelectAutoWidth.tsx'; +import SelectLabels from '../../../../../docs/data/material/components/selects/SelectLabels.tsx'; +import SelectOtherProps from '../../../../../docs/data/material/components/selects/SelectOtherProps.tsx'; +import SelectSmall from '../../../../../docs/data/material/components/selects/SelectSmall.tsx'; +import SelectVariants from '../../../../../docs/data/material/components/selects/SelectVariants.tsx'; + +export default function Selects() { + return ( + <MaterialUILayout> + <h1>Selects</h1> + <section> + <h2> Basic Select</h2> + <div className="demo-container"> + <BasicSelect /> + </div> + </section> + <section> + <h2> Controlled Open Select</h2> + <div className="demo-container"> + <ControlledOpenSelect /> + </div> + </section> + <section> + <h2> Customized Selects</h2> + <div className="demo-container"> + <CustomizedSelects /> + </div> + </section> + <section> + <h2> Dialog Select</h2> + <div className="demo-container"> + <DialogSelect /> + </div> + </section> + <section> + <h2> Grouped Select</h2> + <div className="demo-container"> + <GroupedSelect /> + </div> + </section> + <section> + <h2> Multiple Select</h2> + <div className="demo-container"> + <MultipleSelect /> + </div> + </section> + <section> + <h2> Multiple Select Checkmarks</h2> + <div className="demo-container"> + <MultipleSelectCheckmarks /> + </div> + </section> + <section> + <h2> Multiple Select Chip</h2> + <div className="demo-container"> + <MultipleSelectChip /> + </div> + </section> + <section> + <h2> Multiple Select Native</h2> + <div className="demo-container"> + <MultipleSelectNative /> + </div> + </section> + <section> + <h2> Multiple Select Placeholder</h2> + <div className="demo-container"> + <MultipleSelectPlaceholder /> + </div> + </section> + <section> + <h2> Native Select Demo</h2> + <div className="demo-container"> + <NativeSelectDemo /> + </div> + </section> + <section> + <h2> Select Auto Width</h2> + <div className="demo-container"> + <SelectAutoWidth /> + </div> + </section> + <section> + <h2> Select Labels</h2> + <div className="demo-container"> + <SelectLabels /> + </div> + </section> + <section> + <h2> Select Other Props</h2> + <div className="demo-container"> + <SelectOtherProps /> + </div> + </section> + <section> + <h2> Select Small</h2> + <div className="demo-container"> + <SelectSmall /> + </div> + </section> + <section> + <h2> Select Variants</h2> + <div className="demo-container"> + <SelectVariants /> + </div> + </section> + </MaterialUILayout> + ); +} diff --git a/apps/pigment-css-vite-app/vite.config.ts b/apps/pigment-css-vite-app/vite.config.ts index 4b00635a94362b..2be1c60009bb98 100644 --- a/apps/pigment-css-vite-app/vite.config.ts +++ b/apps/pigment-css-vite-app/vite.config.ts @@ -1,6 +1,7 @@ import { defineConfig, splitVendorChunkPlugin } from 'vite'; import reactPlugin from '@vitejs/plugin-react'; import Pages from 'vite-plugin-pages'; +import { nodePolyfills } from 'vite-plugin-node-polyfills'; import { pigment } from '@pigment-css/vite-plugin'; import { extendTheme } from '@mui/material/styles'; @@ -44,6 +45,7 @@ export default defineConfig({ }), Pages(), splitVendorChunkPlugin(), + nodePolyfills(), ], resolve: { alias: [ diff --git a/babel.config.js b/babel.config.js index 5940d3b7bb9542..c6910c0afa717e 100644 --- a/babel.config.js +++ b/babel.config.js @@ -1,17 +1,28 @@ +// @ts-check const path = require('path'); +/** + * @typedef {import('@babel/core')} babel + */ + const errorCodesPath = path.resolve(__dirname, './docs/public/static/error-codes.json'); const missingError = process.env.MUI_EXTRACT_ERROR_CODES === 'true' ? 'write' : 'annotate'; +/** + * @param {string} relativeToBabelConf + * @returns {string} + */ function resolveAliasPath(relativeToBabelConf) { const resolvedPath = path.relative(process.cwd(), path.resolve(__dirname, relativeToBabelConf)); return `./${resolvedPath.replace('\\', '/')}`; } +/** @type {babel.PluginItem[]} */ const productionPlugins = [ ['babel-plugin-react-remove-properties', { properties: ['data-mui-test'] }], ]; +/** @type {babel.ConfigFunction} */ module.exports = function getBabelConfig(api) { const useESModules = api.env(['regressions', 'modern', 'stable']); @@ -56,6 +67,16 @@ module.exports = function getBabelConfig(api) { '@babel/preset-typescript', ]; + const usesAliases = + // in this config: + api.env(['coverage', 'development', 'test', 'benchmark']) || + process.env.NODE_ENV === 'test' || + // in webpack config: + api.env(['regressions']); + + const outFileExtension = '.js'; + + /** @type {babel.PluginItem[]} */ const plugins = [ [ 'babel-plugin-macros', @@ -71,8 +92,8 @@ module.exports = function getBabelConfig(api) { '@babel/plugin-transform-runtime', { useESModules, - // any package needs to declare 7.4.4 as a runtime dependency. default is ^7.0.0 - version: '^7.4.4', + // any package needs to declare 7.25.0 as a runtime dependency. default is ^7.0.0 + version: process.env.MUI_BABEL_RUNTIME_VERSION || '^7.25.0', }, ], [ @@ -94,6 +115,18 @@ module.exports = function getBabelConfig(api) { ], }, ], + ...(useESModules + ? [ + [ + '@mui/internal-babel-plugin-resolve-imports', + { + // Don't replace the extension when we're using aliases. + // Essentially only replace in production builds. + outExtension: usesAliases ? null : outFileExtension, + }, + ], + ] + : []), ]; if (process.env.NODE_ENV === 'production') { @@ -121,6 +154,10 @@ module.exports = function getBabelConfig(api) { exclude: /\.test\.(js|ts|tsx)$/, plugins: ['@babel/plugin-transform-react-constant-elements'], }, + { + test: /(\.test\.[^.]+$|\.test\/)/, + plugins: [['@mui/internal-babel-plugin-resolve-imports', false]], + }, ], env: { coverage: { diff --git a/benchmark/package.json b/benchmark/package.json index 24de8f473e3884..81a3279e0e38c3 100644 --- a/benchmark/package.json +++ b/benchmark/package.json @@ -13,7 +13,7 @@ "dependencies": { "@babel/runtime": "^7.25.0", "@chakra-ui/system": "^2.6.2", - "@emotion/react": "^11.13.0", + "@emotion/react": "^11.13.3", "@emotion/server": "^11.11.0", "@emotion/styled": "^11.13.0", "@mui/material": "workspace:^", diff --git a/docs/.link-check-errors.txt b/docs/.link-check-errors.txt index 24f1ff82c9158b..0b8d083f4a0077 100644 --- a/docs/.link-check-errors.txt +++ b/docs/.link-check-errors.txt @@ -1,5 +1,2 @@ Broken links found by `pnpm docs:link-check` that exist: -- https://mui.com/material-ui/customization/theme-components/#creating-new-component-variants -- https://mui.com/material-ui/customization/theme-components/#overrides-based-on-props -- https://mui.com/material-ui/react-grid2/#whats-changed diff --git a/docs/data/base/components/transitions/transitions.md b/docs/data/base/components/transitions/transitions.md index f486deac1ec854..f2a55ded2b83ec 100644 --- a/docs/data/base/components/transitions/transitions.md +++ b/docs/data/base/components/transitions/transitions.md @@ -68,7 +68,7 @@ See the examples below. ### Material UI (React Transition Group) -You can use any of the [transitions from Material UI](https://mui.com/material-ui/transitions/), or custom transitions built with React Transition Group, using an adapter shown in the following demo. +You can use any of the [transitions from Material UI](/material-ui/transitions/), or custom transitions built with React Transition Group, using an adapter shown in the following demo. {{"demo": "ReactTransitionGroup.js"}} diff --git a/docs/data/base/getting-started/quickstart/quickstart.md b/docs/data/base/getting-started/quickstart/quickstart.md index 9ffbd4d16ded6d..7dca90ff8739ac 100644 --- a/docs/data/base/getting-started/quickstart/quickstart.md +++ b/docs/data/base/getting-started/quickstart/quickstart.md @@ -10,24 +10,18 @@ If you're using Next.js 13.4 or later, check out the [Next.js App Router guide]( `@mui/base` is completely standalone – run one of the following commands to add Base UI to your React project: -:::info -The `next` tag is used to download the latest <b>pre-release</b>, v6 version. Remove it to get the current stable version. -::: - -<!-- #default-branch-switch --> - <codeblock storageKey="package-manager"> ```bash npm -npm install @mui/base@next +npm install @mui/base ``` -```bash yarn -yarn add @mui/base@next +```bash pnpm +pnpm add @mui/base ``` -```bash pnpm -pnpm add @mui/base@next +```bash yarn +yarn add @mui/base ``` </codeblock> diff --git a/docs/data/base/guides/working-with-tailwind-css/working-with-tailwind-css.md b/docs/data/base/guides/working-with-tailwind-css/working-with-tailwind-css.md index 78b3d3e30a554c..92cf9f71fa4ad9 100644 --- a/docs/data/base/guides/working-with-tailwind-css/working-with-tailwind-css.md +++ b/docs/data/base/guides/working-with-tailwind-css/working-with-tailwind-css.md @@ -31,14 +31,8 @@ We'll use [`create-react-app` with TypeScript](https://create-react-app.dev/docs After you have created the project, follow the instructions given on the [Tailwind CSS installation page](https://tailwindcss.com/docs/guides/create-react-app) in order to configure `tailwind`. Next, install `@mui/base` in the project: -:::info -The `next` tag is used to download the latest <b>pre-release</b>, v6 version. Remove it to get the current stable version. -::: - -<!-- #default-branch-switch --> - ```bash -npm install @mui/base@next +npm install @mui/base ``` ## Adding the player markup diff --git a/docs/data/docs/pages.ts b/docs/data/docs/pages.ts index d806fea5580249..55b233c9a1b4ce 100644 --- a/docs/data/docs/pages.ts +++ b/docs/data/docs/pages.ts @@ -2,7 +2,7 @@ import type { MuiPage } from 'docs/src/MuiPage'; import standardNavIcons from 'docs/src/modules/components/AppNavIcons'; const pages: readonly MuiPage[] = [ - { pathname: '/versions' }, + { pathname: 'https://mui.com/versions/' }, { pathname: 'https://mui.com/store/', title: 'Templates', @@ -13,7 +13,7 @@ const pages: readonly MuiPage[] = [ 'data-ga-event-label': 'sidenav', }, }, - { pathname: '/blog', title: 'Blog', icon: standardNavIcons.BookIcon }, + { pathname: 'https://mui.com/blog/', title: 'Blog', icon: standardNavIcons.BookIcon }, ]; export default pages; diff --git a/docs/data/joy/components/alert/alert.md b/docs/data/joy/components/alert/alert.md index 560f26be0d45f5..5a2e43b1431b79 100644 --- a/docs/data/joy/components/alert/alert.md +++ b/docs/data/joy/components/alert/alert.md @@ -20,7 +20,7 @@ The Alert component can be used to provide important and potentially time-sensit :::info Alerts should not be confused with alert _dialogs_ ([ARIA](https://www.w3.org/WAI/ARIA/apg/patterns/alertdialog/)), which _are_ intended to interrupt the user to obtain a response. -Use the Joy UI [Modal](https://mui.com/joy-ui/react-modal/) if you need the behavior of a dialog. +Use the Joy UI [Modal](/joy-ui/react-modal/) if you need the behavior of a dialog. ::: ## Basics diff --git a/docs/data/joy/components/css-baseline/css-baseline.md b/docs/data/joy/components/css-baseline/css-baseline.md index 9a2eca746350c7..f9f12f83028b22 100644 --- a/docs/data/joy/components/css-baseline/css-baseline.md +++ b/docs/data/joy/components/css-baseline/css-baseline.md @@ -135,7 +135,7 @@ function App() { ### ScopedCssBaseline -You can customize it using the [themed components](https://mui.com/joy-ui/customization/themed-components/) approach. The component identifier is `JoyScopedCssBaseline` which contains only the `root` slot. +You can customize it using the [themed components](/joy-ui/customization/themed-components/) approach. The component identifier is `JoyScopedCssBaseline` which contains only the `root` slot. ```js import { CssVarsProvider, extendTheme } from '@mui/joy/styles'; diff --git a/docs/data/joy/components/radio-button/radio-button.md b/docs/data/joy/components/radio-button/radio-button.md index 858954741031b8..b0726b188a1706 100644 --- a/docs/data/joy/components/radio-button/radio-button.md +++ b/docs/data/joy/components/radio-button/radio-button.md @@ -150,7 +150,7 @@ This example demonstrates the composition of the components, and was inspired by ### Alignment buttons -This example uses icons as labels for a group of Radio buttons to recreate the form and function of [Toggle Buttons](https://mui.com/material-ui/react-toggle-button/). +This example uses icons as labels for a group of Radio buttons to recreate the form and function of [Toggle Buttons](/material-ui/react-toggle-button/). In this case, you must provide an `aria-label` to the input slot for users who rely on screen readers. {{"demo": "ExampleAlignmentButtons.js"}} diff --git a/docs/data/joy/customization/right-to-left/right-to-left.md b/docs/data/joy/customization/right-to-left/right-to-left.md index 044dd99396c4f9..5c2090a0d7fc6b 100644 --- a/docs/data/joy/customization/right-to-left/right-to-left.md +++ b/docs/data/joy/customization/right-to-left/right-to-left.md @@ -68,14 +68,14 @@ Install the [`stylis-plugin-rtl`](https://github.com/styled-components/stylis-pl npm install stylis stylis-plugin-rtl ``` -```bash yarn -yarn add stylis stylis-plugin-rtl -``` - ```bash pnpm pnpm add stylis stylis-plugin-rtl ``` +```bash yarn +yarn add stylis stylis-plugin-rtl +``` + </codeblock> #### With Emotion diff --git a/docs/data/joy/getting-started/installation/installation.md b/docs/data/joy/getting-started/installation/installation.md index 341b00918886b7..904ed071dcd5ed 100644 --- a/docs/data/joy/getting-started/installation/installation.md +++ b/docs/data/joy/getting-started/installation/installation.md @@ -6,23 +6,18 @@ Run one of the following commands to add Joy UI to your project: -:::info -The `next` tag is used to download the latest <b>pre-release</b>, v6 version. Remove it to get the current stable version. -::: - -<!-- #default-branch-switch --> - <codeblock storageKey="package-manager"> + ```bash npm -npm install @mui/joy@next @emotion/react @emotion/styled +npm install @mui/joy @emotion/react @emotion/styled ``` -```bash yarn -yarn add @mui/joy@next @emotion/react @emotion/styled +```bash pnpm +pnpm add @mui/joy @emotion/react @emotion/styled ``` -```bash pnpm -pnpm add @mui/joy@next @emotion/react @emotion/styled +```bash yarn +yarn add @mui/joy @emotion/react @emotion/styled ``` </codeblock> @@ -51,18 +46,19 @@ Add it to your project via [Fontsource](https://fontsource.org/), or with the Go Run one of the following commands to add Inter through Fontsource to your Joy UI project: <codeblock storageKey="package-manager"> + ```bash npm npm install @fontsource/inter ``` -```bash yarn -yarn add @fontsource/inter -``` - ```bash pnpm pnpm add @fontsource/inter ``` +```bash yarn +yarn add @fontsource/inter +``` + </codeblock> Then you can import it in your entry point like this: diff --git a/docs/data/joy/getting-started/overview/overview.md b/docs/data/joy/getting-started/overview/overview.md index 63c8ae851e43c1..59e1d0a92102b3 100644 --- a/docs/data/joy/getting-started/overview/overview.md +++ b/docs/data/joy/getting-started/overview/overview.md @@ -11,10 +11,10 @@ title: Overview Joy UI is an open-source React component library that follows a lightly opinionated design direction, for a clean and modern UI that gives you plenty of room to customize the look and feel. :::warning -Joy UI development is temporarily on hold as the maintainers focus on the next two major releases of Material UI. +Joy UI is in beta and _development is currently on hold_. Read [this blog post](/blog/2023-material-ui-v6-and-beyond/) to learn more. -However, you're welcome to look for the [`package: joy-ui`](https://github.com/mui/material-ui/labels/package%3A%20joy-ui) label on open issues and pull requests in the `mui/material-ui` GitHub repository to see what other community members are working on, and submit your own. +You're welcome to open new issues and PRs to help improve Joy UI, but please keep in mind that the maintainers are primarily focused on other projects and may not be able to respond in a timely manner. ::: ## Why use Joy UI diff --git a/docs/data/joy/integrations/icon-libraries/icon-libraries.md b/docs/data/joy/integrations/icon-libraries/icon-libraries.md index 6e0ed174b76a69..a8b3e878912e21 100644 --- a/docs/data/joy/integrations/icon-libraries/icon-libraries.md +++ b/docs/data/joy/integrations/icon-libraries/icon-libraries.md @@ -13,12 +13,8 @@ This section assumes that you've already installed Joy UI in your app—see [In #### yarn -:::info -The `next` tag is used to download the latest <b>pre-release</b>, v6 version. Remove it to get the current stable version. -::: - ```bash -yarn add @mui/icons-material@next @mui/material@next +yarn add @mui/icons-material @mui/material ``` :::warning @@ -43,14 +39,8 @@ You can keep track of the progress in [this issue](https://github.com/mui/materi #### npm -:::info -The `next` tag is used to download the latest <b>pre-release</b>, v6 version. Remove it to get the current stable version. -::: - -<!-- #default-branch-switch --> - ```bash -npm install @mui/icons-material@next @mui/material@next +npm install @mui/icons-material @mui/material ``` :::warning diff --git a/docs/data/material/components/about-the-lab/about-the-lab.md b/docs/data/material/components/about-the-lab/about-the-lab.md index c1e8e3bc707a37..5aa917add5104c 100644 --- a/docs/data/material/components/about-the-lab/about-the-lab.md +++ b/docs/data/material/components/about-the-lab/about-the-lab.md @@ -19,24 +19,20 @@ For a component to be ready to move to the core, the following criteria are cons To install and save in your `package.json` dependencies, run one of the following commands: -:::info -The `next` tag is used to download the latest <b>pre-release</b>, v6 version. Remove it to get the current stable version. -::: - <!-- #default-branch-switch --> <codeblock storageKey="package-manager"> ```bash npm -npm install @mui/lab@next @mui/material@next +npm install @mui/lab @mui/material ``` -```bash yarn -yarn add @mui/lab@next @mui/material@next +```bash pnpm +pnpm add @mui/lab @mui/material ``` -```bash pnpm -pnpm add @mui/lab@next @mui/material@next +```bash yarn +yarn add @mui/lab @mui/material ``` </codeblock> diff --git a/docs/data/material/components/alert/alert.md b/docs/data/material/components/alert/alert.md index 5e986380ffcece..f857ef6f36f1a7 100644 --- a/docs/data/material/components/alert/alert.md +++ b/docs/data/material/components/alert/alert.md @@ -29,7 +29,7 @@ This component is no longer documented in the [Material Design guidelines](https A key trait of the alert pattern is that [it should not interrupt the user's experience](https://www.w3.org/WAI/ARIA/apg/patterns/alert/) of the app. Alerts should not be confused with alert _dialogs_ ([ARIA](https://www.w3.org/WAI/ARIA/apg/patterns/alertdialog/)), which _are_ intended to interrupt the user to obtain a response. -Use the Material UI [Dialog](https://mui.com/material-ui/react-dialog/) component if you need this behavior. +Use the Material UI [Dialog](/material-ui/react-dialog/) component if you need this behavior. ## Basics diff --git a/docs/data/material/components/autocomplete/Asynchronous.js b/docs/data/material/components/autocomplete/Asynchronous.js index 969f62e5cd28ae..4dd9444fad5045 100644 --- a/docs/data/material/components/autocomplete/Asynchronous.js +++ b/docs/data/material/components/autocomplete/Asynchronous.js @@ -14,44 +14,30 @@ function sleep(duration) { export default function Asynchronous() { const [open, setOpen] = React.useState(false); const [options, setOptions] = React.useState([]); - const loading = open && options.length === 0; - - React.useEffect(() => { - let active = true; - - if (!loading) { - return undefined; - } + const [loading, setLoading] = React.useState(false); + const handleOpen = () => { + setOpen(true); (async () => { + setLoading(true); await sleep(1e3); // For demo purposes. + setLoading(false); - if (active) { - setOptions([...topFilms]); - } + setOptions([...topFilms]); })(); + }; - return () => { - active = false; - }; - }, [loading]); - - React.useEffect(() => { - if (!open) { - setOptions([]); - } - }, [open]); + const handleClose = () => { + setOpen(false); + setOptions([]); + }; return ( <Autocomplete sx={{ width: 300 }} open={open} - onOpen={() => { - setOpen(true); - }} - onClose={() => { - setOpen(false); - }} + onOpen={handleOpen} + onClose={handleClose} isOptionEqualToValue={(option, value) => option.title === value.title} getOptionLabel={(option) => option.title} options={options} diff --git a/docs/data/material/components/autocomplete/Asynchronous.tsx b/docs/data/material/components/autocomplete/Asynchronous.tsx index 82c009c528ba2d..09caaed1583547 100644 --- a/docs/data/material/components/autocomplete/Asynchronous.tsx +++ b/docs/data/material/components/autocomplete/Asynchronous.tsx @@ -19,44 +19,30 @@ function sleep(duration: number): Promise<void> { export default function Asynchronous() { const [open, setOpen] = React.useState(false); const [options, setOptions] = React.useState<readonly Film[]>([]); - const loading = open && options.length === 0; - - React.useEffect(() => { - let active = true; - - if (!loading) { - return undefined; - } + const [loading, setLoading] = React.useState(false); + const handleOpen = () => { + setOpen(true); (async () => { + setLoading(true); await sleep(1e3); // For demo purposes. + setLoading(false); - if (active) { - setOptions([...topFilms]); - } + setOptions([...topFilms]); })(); + }; - return () => { - active = false; - }; - }, [loading]); - - React.useEffect(() => { - if (!open) { - setOptions([]); - } - }, [open]); + const handleClose = () => { + setOpen(false); + setOptions([]); + }; return ( <Autocomplete sx={{ width: 300 }} open={open} - onOpen={() => { - setOpen(true); - }} - onClose={() => { - setOpen(false); - }} + onOpen={handleOpen} + onClose={handleClose} isOptionEqualToValue={(option, value) => option.title === value.title} getOptionLabel={(option) => option.title} options={options} diff --git a/docs/data/material/components/autocomplete/GitHubLabel.js b/docs/data/material/components/autocomplete/GitHubLabel.js index 9117f91608283e..23baefb03e2edc 100644 --- a/docs/data/material/components/autocomplete/GitHubLabel.js +++ b/docs/data/material/components/autocomplete/GitHubLabel.js @@ -80,7 +80,7 @@ const StyledInput = styled(InputBase)(({ theme }) => ({ borderBottom: `1px solid ${'#30363d'}`, '& input': { borderRadius: 4, - backgroundColor: '#0d1117', + backgroundColor: '#fff', border: `1px solid ${'#30363d'}`, padding: 8, transition: theme.transitions.create(['border-color', 'box-shadow']), @@ -94,7 +94,7 @@ const StyledInput = styled(InputBase)(({ theme }) => ({ }), }, ...theme.applyStyles('dark', { - backgroundColor: '#fff', + backgroundColor: '#0d1117', border: `1px solid ${'#eaecef'}`, }), }, diff --git a/docs/data/material/components/autocomplete/GitHubLabel.tsx b/docs/data/material/components/autocomplete/GitHubLabel.tsx index c322f58b7e5352..d454737b623a12 100644 --- a/docs/data/material/components/autocomplete/GitHubLabel.tsx +++ b/docs/data/material/components/autocomplete/GitHubLabel.tsx @@ -84,7 +84,7 @@ const StyledInput = styled(InputBase)(({ theme }) => ({ borderBottom: `1px solid ${'#30363d'}`, '& input': { borderRadius: 4, - backgroundColor: '#0d1117', + backgroundColor: '#fff', border: `1px solid ${'#30363d'}`, padding: 8, transition: theme.transitions.create(['border-color', 'box-shadow']), @@ -98,7 +98,7 @@ const StyledInput = styled(InputBase)(({ theme }) => ({ }), }, ...theme.applyStyles('dark', { - backgroundColor: '#fff', + backgroundColor: '#0d1117', border: `1px solid ${'#eaecef'}`, }), }, diff --git a/docs/data/material/components/dialogs/dialogs.md b/docs/data/material/components/dialogs/dialogs.md index 0a984a0c1e9c05..7862599b674ccd 100644 --- a/docs/data/material/components/dialogs/dialogs.md +++ b/docs/data/material/components/dialogs/dialogs.md @@ -27,7 +27,7 @@ Dialogs are implemented using a collection of related components: - Dialog Actions: an optional container for a Dialog's Buttons. - Dialog Content: an optional container for displaying the Dialog's content. - Dialog Content Text: a wrapper for text inside of `<DialogContent />`. -- Slide: optional [Transition](https://mui.com/material-ui/transitions/#slide) used to slide the Dialog in from the edge of the screen. +- Slide: optional [Transition](/material-ui/transitions/#slide) used to slide the Dialog in from the edge of the screen. {{"demo": "SimpleDialogDemo.js"}} @@ -113,7 +113,7 @@ function MyComponent() { Confirmation dialogs require users to explicitly confirm their choice before an option is committed. For example, users can listen to multiple ringtones but only make a final selection upon touching "OK". -Touching "Cancel" in a confirmation dialog, or pressing Back, cancels the action, discards any changes, and closes the dialog. +Touching "Cancel" in a confirmation dialog, cancels the action, discards any changes, and closes the dialog. {{"demo": "ConfirmationDialog.js"}} diff --git a/docs/data/material/components/grid/AutoGridNoWrap.js b/docs/data/material/components/grid/AutoGridNoWrap.js index cc49b0780d1ddb..6609fbed48508b 100644 --- a/docs/data/material/components/grid/AutoGridNoWrap.js +++ b/docs/data/material/components/grid/AutoGridNoWrap.js @@ -24,7 +24,7 @@ export default function AutoGridNoWrap() { return ( <Box sx={{ flexGrow: 1, overflow: 'hidden', px: 3 }}> <StyledPaper sx={{ my: 1, mx: 'auto', p: 2 }}> - <Grid container spacing={2} sx={{ flexWrap: 'nowrap' }}> + <Grid container spacing={2} wrap="nowrap"> <Grid item> <Avatar>W</Avatar> </Grid> @@ -34,7 +34,7 @@ export default function AutoGridNoWrap() { </Grid> </StyledPaper> <StyledPaper sx={{ my: 1, mx: 'auto', p: 2 }}> - <Grid container spacing={2} sx={{ flexWrap: 'nowrap' }}> + <Grid container spacing={2} wrap="nowrap"> <Grid item> <Avatar>W</Avatar> </Grid> @@ -44,7 +44,7 @@ export default function AutoGridNoWrap() { </Grid> </StyledPaper> <StyledPaper sx={{ my: 1, mx: 'auto', p: 2 }}> - <Grid container spacing={2} sx={{ flexWrap: 'nowrap' }}> + <Grid container spacing={2} wrap="nowrap"> <Grid item> <Avatar>W</Avatar> </Grid> diff --git a/docs/data/material/components/grid/AutoGridNoWrap.tsx b/docs/data/material/components/grid/AutoGridNoWrap.tsx index cc49b0780d1ddb..6609fbed48508b 100644 --- a/docs/data/material/components/grid/AutoGridNoWrap.tsx +++ b/docs/data/material/components/grid/AutoGridNoWrap.tsx @@ -24,7 +24,7 @@ export default function AutoGridNoWrap() { return ( <Box sx={{ flexGrow: 1, overflow: 'hidden', px: 3 }}> <StyledPaper sx={{ my: 1, mx: 'auto', p: 2 }}> - <Grid container spacing={2} sx={{ flexWrap: 'nowrap' }}> + <Grid container spacing={2} wrap="nowrap"> <Grid item> <Avatar>W</Avatar> </Grid> @@ -34,7 +34,7 @@ export default function AutoGridNoWrap() { </Grid> </StyledPaper> <StyledPaper sx={{ my: 1, mx: 'auto', p: 2 }}> - <Grid container spacing={2} sx={{ flexWrap: 'nowrap' }}> + <Grid container spacing={2} wrap="nowrap"> <Grid item> <Avatar>W</Avatar> </Grid> @@ -44,7 +44,7 @@ export default function AutoGridNoWrap() { </Grid> </StyledPaper> <StyledPaper sx={{ my: 1, mx: 'auto', p: 2 }}> - <Grid container spacing={2} sx={{ flexWrap: 'nowrap' }}> + <Grid container spacing={2} wrap="nowrap"> <Grid item> <Avatar>W</Avatar> </Grid> diff --git a/docs/data/material/components/icons/icons.md b/docs/data/material/components/icons/icons.md index ed689aedbde926..9682e2b67d41e6 100644 --- a/docs/data/material/components/icons/icons.md +++ b/docs/data/material/components/icons/icons.md @@ -26,23 +26,19 @@ You can [search the full list of these icons](/material-ui/material-icons/). Run one of the following commands to install it and save it to your `package.json` dependencies: -:::info -The `next` tag is used to download the latest <b>pre-release</b>, v6 version. Remove it to get the current stable version. -::: - <!-- #default-branch-switch --> <codeblock storageKey="package-manager"> ```bash npm -npm install @mui/icons-material@next +npm install @mui/icons-material ``` -```bash yarn -yarn add @mui/icons-material@next +```bash pnpm +pnpm add @mui/icons-material ``` -```bash pnpm -pnpm add @mui/icons-material@next +```bash yarn +yarn add @mui/icons-material ``` </codeblock> diff --git a/docs/data/material/components/material-icons/material-icons.md b/docs/data/material/components/material-icons/material-icons.md index 192cd5b8277a02..86c3b6f8c1c8c2 100644 --- a/docs/data/material/components/material-icons/material-icons.md +++ b/docs/data/material/components/material-icons/material-icons.md @@ -18,24 +18,20 @@ includes the 2,100+ official [Material Icons](https://fonts.google.com/icons?ico It depends on `@mui/material`, which requires Emotion packages. Use one of the following commands to install it: -:::info -The `next` tag is used to download the latest <b>pre-release</b>, v6 version. Remove it to get the current stable version. -::: - <!-- #default-branch-switch --> <codeblock storageKey="package-manager"> ```bash npm -npm install @mui/icons-material@next @mui/material@next @emotion/styled @emotion/react +npm install @mui/icons-material @mui/material @emotion/styled @emotion/react ``` -```bash yarn -yarn add @mui/icons-material@next @mui/material@next @emotion/styled @emotion/react +```bash pnpm +pnpm add @mui/icons-material @mui/material @emotion/styled @emotion/react ``` -```bash pnpm -pnpm add @mui/icons-material@next @mui/material@next @emotion/styled @emotion/react +```bash yarn +yarn add @mui/icons-material @mui/material @emotion/styled @emotion/react ``` </codeblock> diff --git a/docs/data/material/components/rating/rating.md b/docs/data/material/components/rating/rating.md index 163a8467202dc3..c6b0e8cc2a99a5 100644 --- a/docs/data/material/components/rating/rating.md +++ b/docs/data/material/components/rating/rating.md @@ -59,7 +59,7 @@ The accessibility of this component relies on: - A radio group with its fields visually hidden. It contains six radio buttons, one for each star, and another for 0 stars that is checked by default. Be sure to provide a value for the `name` prop that is unique to the parent form. - Labels for the radio buttons containing actual text ("1 Star", "2 Stars", …). - Be sure to provide a suitable function to the `getLabelText` prop when the page is in a language other than English. You can use the [included locales](https://mui.com/material-ui/guides/localization/), or provide your own. + Be sure to provide a suitable function to the `getLabelText` prop when the page is in a language other than English. You can use the [included locales](/material-ui/guides/localization/), or provide your own. - A visually distinct appearance for the rating icons. By default, the rating component uses both a difference of color and shape (filled and empty icons) to indicate the value. In the event that you are using color as the only means to indicate the value, the information should also be also displayed as text, as in this demo. This is important to match [success Criterion 1.4.1](https://www.w3.org/TR/WCAG21/#use-of-color) of WCAG2.1. diff --git a/docs/data/material/components/skeleton/YouTube.js b/docs/data/material/components/skeleton/YouTube.js index 852bde546b6ac4..16c9833c9afdf5 100644 --- a/docs/data/material/components/skeleton/YouTube.js +++ b/docs/data/material/components/skeleton/YouTube.js @@ -33,7 +33,7 @@ function Media(props) { const { loading = false } = props; return ( - <Grid container sx={{ flexWrap: 'nowrap' }}> + <Grid container wrap="nowrap"> {(loading ? Array.from(new Array(3)) : data).map((item, index) => ( <Box key={index} sx={{ width: 210, marginRight: 0.5, my: 5 }}> {item ? ( diff --git a/docs/data/material/components/skeleton/YouTube.tsx b/docs/data/material/components/skeleton/YouTube.tsx index 7a0e7230d85026..dff86e1facffb5 100644 --- a/docs/data/material/components/skeleton/YouTube.tsx +++ b/docs/data/material/components/skeleton/YouTube.tsx @@ -36,7 +36,7 @@ function Media(props: MediaProps) { const { loading = false } = props; return ( - <Grid container sx={{ flexWrap: 'nowrap' }}> + <Grid container wrap="nowrap"> {(loading ? Array.from(new Array(3)) : data).map((item, index) => ( <Box key={index} sx={{ width: 210, marginRight: 0.5, my: 5 }}> {item ? ( diff --git a/docs/data/material/components/table/DataTable.js b/docs/data/material/components/table/DataTable.js index 1a509df8f8bfb6..084ff21cccd9c7 100644 --- a/docs/data/material/components/table/DataTable.js +++ b/docs/data/material/components/table/DataTable.js @@ -1,5 +1,6 @@ import * as React from 'react'; import { DataGrid } from '@mui/x-data-grid'; +import Paper from '@mui/material/Paper'; const columns = [ { field: 'id', headerName: 'ID', width: 70 }, @@ -33,21 +34,19 @@ const rows = [ { id: 9, lastName: 'Roxie', firstName: 'Harvey', age: 65 }, ]; +const paginationModel = { page: 0, pageSize: 5 }; + export default function DataTable() { return ( - <div style={{ height: 400, width: '100%' }}> + <Paper sx={{ height: 400, width: '100%' }}> <DataGrid rows={rows} columns={columns} - initialState={{ - pagination: { - paginationModel: { page: 0, pageSize: 5 }, - }, - }} + initialState={{ pagination: { paginationModel } }} pageSizeOptions={[5, 10]} checkboxSelection - sx={{ overflow: 'clip' }} + sx={{ border: 0 }} /> - </div> + </Paper> ); } diff --git a/docs/data/material/components/table/DataTable.tsx b/docs/data/material/components/table/DataTable.tsx index f902e6e0089b41..1343ddcbb2b935 100644 --- a/docs/data/material/components/table/DataTable.tsx +++ b/docs/data/material/components/table/DataTable.tsx @@ -1,5 +1,6 @@ import * as React from 'react'; import { DataGrid, GridColDef } from '@mui/x-data-grid'; +import Paper from '@mui/material/Paper'; const columns: GridColDef[] = [ { field: 'id', headerName: 'ID', width: 70 }, @@ -33,21 +34,19 @@ const rows = [ { id: 9, lastName: 'Roxie', firstName: 'Harvey', age: 65 }, ]; +const paginationModel = { page: 0, pageSize: 5 }; + export default function DataTable() { return ( - <div style={{ height: 400, width: '100%' }}> + <Paper sx={{ height: 400, width: '100%' }}> <DataGrid rows={rows} columns={columns} - initialState={{ - pagination: { - paginationModel: { page: 0, pageSize: 5 }, - }, - }} + initialState={{ pagination: { paginationModel } }} pageSizeOptions={[5, 10]} checkboxSelection - sx={{ overflow: 'clip' }} + sx={{ border: 0 }} /> - </div> + </Paper> ); } diff --git a/docs/data/material/components/table/DataTable.tsx.preview b/docs/data/material/components/table/DataTable.tsx.preview index 594e38d89a8569..876664a4a842c2 100644 --- a/docs/data/material/components/table/DataTable.tsx.preview +++ b/docs/data/material/components/table/DataTable.tsx.preview @@ -1,12 +1,10 @@ -<DataGrid - rows={rows} - columns={columns} - initialState={{ - pagination: { - paginationModel: { page: 0, pageSize: 5 }, - }, - }} - pageSizeOptions={[5, 10]} - checkboxSelection - sx={{ overflow: 'clip' }} -/> \ No newline at end of file +<Paper sx={{ height: 400, width: '100%' }}> + <DataGrid + rows={rows} + columns={columns} + initialState={{ pagination: { paginationModel } }} + pageSizeOptions={[5, 10]} + checkboxSelection + sx={{ border: 0 }} + /> +</Paper> \ No newline at end of file diff --git a/docs/data/material/components/table/table.md b/docs/data/material/components/table/table.md index f3deeb522df77d..ca183adcf6fc60 100644 --- a/docs/data/material/components/table/table.md +++ b/docs/data/material/components/table/table.md @@ -34,7 +34,7 @@ This constraint makes building rich data tables challenging. The [`DataGrid` component](/x/react-data-grid/) is designed for use-cases that are focused on handling large amounts of tabular data. While it comes with a more rigid structure, in exchange, you gain more powerful features. -{{"demo": "DataTable.js", "bg": "outlined"}} +{{"demo": "DataTable.js", "bg": true}} ## Dense table diff --git a/docs/data/material/components/typography/typography.md b/docs/data/material/components/typography/typography.md index 5e55cea5e7749e..3701fbd5a94a31 100644 --- a/docs/data/material/components/typography/typography.md +++ b/docs/data/material/components/typography/typography.md @@ -24,14 +24,14 @@ Add it to your project via Fontsource, or with the Google Fonts CDN. npm install @fontsource/roboto ``` -```bash yarn -yarn add @fontsource/roboto -``` - ```bash pnpm pnpm add @fontsource/roboto ``` +```bash yarn +yarn add @fontsource/roboto +``` + </codeblock> Then you can import it in your entry point like this: diff --git a/docs/data/material/customization/creating-themed-components/creating-themed-components.md b/docs/data/material/customization/creating-themed-components/creating-themed-components.md index 15cf2415c18c14..1b9d7984ab7dca 100644 --- a/docs/data/material/customization/creating-themed-components/creating-themed-components.md +++ b/docs/data/material/customization/creating-themed-components/creating-themed-components.md @@ -22,7 +22,7 @@ This guide will walk you through how to build this statistics component, which a ### 1. Create the component slots -Slots let you customize each individual element of the component by targeting its respective name in the [theme's styleOverrides](/material-ui/customization/theme-components/#theme-style-overrides) and [theme's variants](/material-ui/customization/theme-components/#creating-new-component-variants). +Slots let you customize each individual element of the component by targeting its respective name in the [theme's styleOverrides](/material-ui/customization/theme-components/#theme-style-overrides) and [theme's variants](/material-ui/customization/theme-components/#variants). This statistics component is composed of three slots: diff --git a/docs/data/material/customization/css-theme-variables/usage.md b/docs/data/material/customization/css-theme-variables/usage.md index 7aee4e3532f90a..02b399401b6d1b 100644 --- a/docs/data/material/customization/css-theme-variables/usage.md +++ b/docs/data/material/customization/css-theme-variables/usage.md @@ -17,7 +17,7 @@ import { ThemeProvider, createTheme } from '@mui/material/styles'; const theme = createTheme({ cssVariables: true }); function App() { - return <ThemeProvider>{/* ...you app */}</ThemeProvider>; + return <ThemeProvider theme={theme}>{/* ...your app */}</ThemeProvider>; } ``` diff --git a/docs/data/material/customization/dark-mode/dark-mode.md b/docs/data/material/customization/dark-mode/dark-mode.md index d1eda92da44f76..86921f703c53d3 100644 --- a/docs/data/material/customization/dark-mode/dark-mode.md +++ b/docs/data/material/customization/dark-mode/dark-mode.md @@ -198,9 +198,9 @@ We provide codemods to migrate your codebase from using `theme.palette.mode` to You can run each codemod below or all of them at once. ```bash -npx @mui/codemod@next v6.0.0/styled <path/to/folder-or-file> -npx @mui/codemod@next v6.0.0/sx-prop <path/to/folder-or-file> -npx @mui/codemod@next v6.0.0/theme-v6 <path/to/theme-file> +npx @mui/codemod@latest v6.0.0/styled <path/to/folder-or-file> +npx @mui/codemod@latest v6.0.0/sx-prop <path/to/folder-or-file> +npx @mui/codemod@latest v6.0.0/theme-v6 <path/to/theme-file> ``` > Run `v6.0.0/theme-v6` against the file that contains the custom `styleOverrides`. Ignore this codemod if you don't have a custom theme. diff --git a/docs/data/material/customization/right-to-left/right-to-left.md b/docs/data/material/customization/right-to-left/right-to-left.md index e0843a8866c38c..1b78383c2171ac 100644 --- a/docs/data/material/customization/right-to-left/right-to-left.md +++ b/docs/data/material/customization/right-to-left/right-to-left.md @@ -68,14 +68,14 @@ Install the [`stylis-plugin-rtl`](https://github.com/styled-components/stylis-pl npm install stylis stylis-plugin-rtl ``` -```bash yarn -yarn add stylis stylis-plugin-rtl -``` - ```bash pnpm pnpm add stylis stylis-plugin-rtl ``` +```bash yarn +yarn add stylis stylis-plugin-rtl +``` + </codeblock> #### With Emotion diff --git a/docs/data/material/customization/shadow-dom/ShadowDOMDemo.js b/docs/data/material/customization/shadow-dom/ShadowDOMDemoNoSnap.js similarity index 88% rename from docs/data/material/customization/shadow-dom/ShadowDOMDemo.js rename to docs/data/material/customization/shadow-dom/ShadowDOMDemoNoSnap.js index 2b8fc8a25deae7..817d00bdc12646 100644 --- a/docs/data/material/customization/shadow-dom/ShadowDOMDemo.js +++ b/docs/data/material/customization/shadow-dom/ShadowDOMDemoNoSnap.js @@ -1,6 +1,6 @@ import * as React from 'react'; -export default function ShadowDOMDemo() { +export default function ShadowDOMDemoNoSnap() { return ( <iframe title="codesandbox" diff --git a/docs/data/material/customization/shadow-dom/shadow-dom.md b/docs/data/material/customization/shadow-dom/shadow-dom.md index fef01d7d698ac2..ba4c564ee6bfb3 100644 --- a/docs/data/material/customization/shadow-dom/shadow-dom.md +++ b/docs/data/material/customization/shadow-dom/shadow-dom.md @@ -68,4 +68,4 @@ const theme = createTheme({ In the example below you can see that the component outside of the shadow DOM is affected by global styles, while the component inside of the shadow DOM is not: -{{"demo": "ShadowDOMDemo.js", "hideToolbar": true, "bg": true}} +{{"demo": "ShadowDOMDemoNoSnap.js", "hideToolbar": true, "bg": true}} diff --git a/docs/data/material/design-resources/material-ui-for-figma/material-ui-for-figma.md b/docs/data/material/design-resources/material-ui-for-figma/material-ui-for-figma.md index c5a69c6d388d87..975268000fb1c7 100644 --- a/docs/data/material/design-resources/material-ui-for-figma/material-ui-for-figma.md +++ b/docs/data/material/design-resources/material-ui-for-figma/material-ui-for-figma.md @@ -86,7 +86,7 @@ The video below shows how to add new columns by copying cells directly on the ma You can export theme tokens and component customizations to code using [the Sync plugin for Figma](/material-ui/design-resources/material-ui-sync/). The Design Kit has been built to be as close to the React components as possible, making it for a fluid integration with code. -Learn more about the Material UI theme structure by visiting the [Theming](https://mui.com/material-ui/customization/theming/) and [Default theme viewer](https://mui.com/material-ui/customization/theming/) pages. +Learn more about the Material UI theme structure by visiting the [Theming](/material-ui/customization/theming/) and [Default theme viewer](/material-ui/customization/theming/) pages. ## Using new design kit versions @@ -100,3 +100,14 @@ If you need to replace a single component that's been updated, there are a coupl ## Feedback and bug reports If you've got any feedback, we'd love to [hear from you](https://github.com/mui/mui-design-kits/discussions/84). + +## Integrations + +### Quest + +[Quest](https://www.quest.ai/) provides a native integration with this design kit. + +When you design your components with the kit, you can use [Quest plugin](https://www.figma.com/community/plugin/862039267149408972/figma-to-react-from-quest) to convert your Figma designs into Material UI code. +The code generated should be clean and production-ready. + +Visit the [Quest documentation](https://docs.quest.ai/quest-docs) for more details. diff --git a/docs/data/material/design-resources/material-ui-sync/material-ui-sync.md b/docs/data/material/design-resources/material-ui-sync/material-ui-sync.md index 90ba412e3ebd37..f276b65d589d93 100644 --- a/docs/data/material/design-resources/material-ui-sync/material-ui-sync.md +++ b/docs/data/material/design-resources/material-ui-sync/material-ui-sync.md @@ -56,13 +56,12 @@ After you've added your custom tokens, click on **Regenerate theme** to include ## Customizing components -The Sync plugin can also generate theme styles for customized components, enabling you to completely change their look and feel and create your custom design system from within Figma. - -:::info -This feature is currently limited to the Button, Switch, and Typography components. -Support for more components is coming soon. +:::warning +This feature is experimental and limited to the **Button**, **Switch**, and **Typography** components. ::: +The Sync plugin can also generate theme styles for customized components, enabling you to completely change their look and feel and create your custom design system from within Figma. + As an example, here's how to customize the checked state, medium size, and primary color of a Switch component to replicate the iOS look and feel: <img src="/static/material-ui/design-resources/sync-component-variant.png" style="width: 814px; margin-bottom: 8px;" alt="A specific variant of the Switch component selected in the Design Kit." width="1628" height="400" /> @@ -132,87 +131,87 @@ From here you can run Sync to generate a new theme—here's what would be genera MuiSwitch: { styleOverrides: { root: { - "&.MuiSwitch-sizeMedium:has(.MuiSwitch-colorPrimary)": { - width: "40px", - height: "21px", - padding: "0", - "& .MuiSwitch-switchBase": { - padding: "0", - "& .MuiSwitch-thumb": { - width: "17px", - height: "17px", - background: "#FAFAFA", + '&.MuiSwitch-sizeMedium:has(.MuiSwitch-colorPrimary)': { + width: '40px', + height: '21px', + padding: '0', + '& .MuiSwitch-switchBase': { + padding: '0', + '& .MuiSwitch-thumb': { + width: '17px', + height: '17px', + background: '#FAFAFA', }, - "& + .MuiSwitch-track": { - width: "38px", - height: "21px", - borderRadius: "100px", - opacity: "1", + '& + .MuiSwitch-track': { + width: '38px', + height: '21px', + borderRadius: '100px', + opacity: '1', }, }, - "&:not(:has(.Mui-checked)):not(:has(.Mui-disabled)):not(:has(.Mui-focusVisible))": { - "& .MuiSwitch-switchBase": { - transform: "translateX(3px) translateY(2px)", - "& + .MuiSwitch-track": { - background: "#BDBDBD", + '&:not(:has(.Mui-checked)):not(:has(.Mui-disabled)):not(:has(.Mui-focusVisible))': { + '& .MuiSwitch-switchBase': { + transform: 'translateX(3px) translateY(2px)', + '& + .MuiSwitch-track': { + background: '#BDBDBD', }, }, }, - "&:not(:has(.Mui-checked)):has(.Mui-disabled):not(:has(.Mui-focusVisible))": { - "& .MuiSwitch-switchBase": { - transform: "translateX(3px) translateY(2px)", - "& + .MuiSwitch-track": { - background: "rgba(229, 229, 229, 0.99)", + '&:not(:has(.Mui-checked)):has(.Mui-disabled):not(:has(.Mui-focusVisible))': { + '& .MuiSwitch-switchBase': { + transform: 'translateX(3px) translateY(2px)', + '& + .MuiSwitch-track': { + background: 'rgba(229, 229, 229, 0.99)', }, }, }, - "&:not(:has(.Mui-checked)):not(:has(.Mui-disabled)):has(.Mui-focusVisible)": { - "& .MuiSwitch-switchBase": { - transform: "translateX(3px) translateY(2px)", - "& + .MuiSwitch-track": { - border: "1px solid #000", - background: "#BDBDBD", + '&:not(:has(.Mui-checked)):not(:has(.Mui-disabled)):has(.Mui-focusVisible)': { + '& .MuiSwitch-switchBase': { + transform: 'translateX(3px) translateY(2px)', + '& + .MuiSwitch-track': { + border: '1px solid #000', + background: '#BDBDBD', }, }, }, - "&:has(.Mui-checked):has(.Mui-disabled):not(:has(.Mui-focusVisible))": { - "& .MuiSwitch-switchBase": { - transform: "translateX(19px) translateY(2px)", - "& + .MuiSwitch-track": { - background: "rgba(187, 231, 188, 0.99)", + '&:has(.Mui-checked):has(.Mui-disabled):not(:has(.Mui-focusVisible))': { + '& .MuiSwitch-switchBase': { + transform: 'translateX(19px) translateY(2px)', + '& + .MuiSwitch-track': { + background: 'rgba(187, 231, 188, 0.99)', }, }, }, - "&:not(:has(.Mui-checked)):not(:has(.Mui-disabled)):not(:has(.Mui-focusVisible)):hover": { - "& .MuiSwitch-switchBase": { - transform: "translateX(3px) translateY(2px)", - "& + .MuiSwitch-track": { - background: "#616161", + '&:not(:has(.Mui-checked)):not(:has(.Mui-disabled)):not(:has(.Mui-focusVisible)):hover': { + '& .MuiSwitch-switchBase': { + transform: 'translateX(3px) translateY(2px)', + '& + .MuiSwitch-track': { + background: '#616161', }, }, }, - "&:has(.Mui-checked):not(:has(.Mui-disabled)):not(:has(.Mui-focusVisible))": { - "& .MuiSwitch-switchBase": { - transform: "translateX(19px) translateY(2px)", - "& + .MuiSwitch-track": { - background: "var(--mui-palette-success-light)", + '&:has(.Mui-checked):not(:has(.Mui-disabled)):not(:has(.Mui-focusVisible))': { + '& .MuiSwitch-switchBase': { + transform: 'translateX(19px) translateY(2px)', + '& + .MuiSwitch-track': { + background: 'var(--mui-palette-success-light)', }, }, }, - "&:has(.Mui-checked):not(:has(.Mui-disabled)):not(:has(.Mui-focusVisible)):hover": { - "& .MuiSwitch-switchBase": { - transform: "translateX(19px) translateY(2px)", - "& + .MuiSwitch-track": { - background: "var(--mui-palette-success-dark)", + '&:has(.Mui-checked):not(:has(.Mui-disabled)):not(:has(.Mui-focusVisible)):hover': { + '& .MuiSwitch-switchBase': { + transform: 'translateX(19px) translateY(2px)', + '& + .MuiSwitch-track': { + background: 'var(--mui-palette-success-dark)', }, }, }, - "&:has(.Mui-checked):not(:has(.Mui-disabled)):has(.Mui-focusVisible)": { - "& .MuiSwitch-switchBase": { - transform: "translateX(19px) translateY(2px)", - "& + .MuiSwitch-track": { - border: "1px solid #000", - background: "var(--mui-palette-success-light)", + '&:has(.Mui-checked):not(:has(.Mui-disabled)):has(.Mui-focusVisible)': { + '& .MuiSwitch-switchBase': { + transform: 'translateX(19px) translateY(2px)', + '& + .MuiSwitch-track': { + border: '1px solid #000', + background: 'var(--mui-palette-success-light)', }, }, }, @@ -241,45 +240,47 @@ Here's an example of how to add a Sync-generated theme to your codebase: ```tsx title="_app.tsx" import { createTheme, ThemeProvider } from '@mui/material/styles'; -export default function MyApp({ Component, pageProps }) { - const theme = createTheme({ - cssVariables: true, - shape: { - borderRadiusRound: 999, - }, - components: { - MuiSwitch: { - styleOverrides: { - root: { - '&.MuiSwitch-sizeMedium:has(.MuiSwitch-colorPrimary)': { - '&:has(.Mui-checked):not(:has(.Mui-disabled)):not(:has(.Mui-focusVisible))': - { - width: '40px', - height: '21px', +const theme = createTheme({ + cssVariables: true, + shape: { + borderRadiusRound: 999, + }, + components: { + MuiSwitch: { + styleOverrides: { + root: { + '&.MuiSwitch-sizeMedium:has(.MuiSwitch-colorPrimary)': { + '&:has(.Mui-checked):not(:has(.Mui-disabled)):not(:has(.Mui-focusVisible))': + { + width: '40px', + height: '21px', + padding: '0', + '& .MuiSwitch-switchBase': { + transform: 'translateX(19px) translateY(2px)', padding: '0', - '& .MuiSwitch-switchBase': { - transform: 'translateX(19px) translateY(2px)', - padding: '0', - '& .MuiSwitch-thumb': { - width: '17px', - height: '17px', - background: '#FAFAFA', - }, - '& + .MuiSwitch-track': { - width: '38px', - height: '21px', - background: 'var(--mui-palette-success-light)', - borderRadius: 'var(--mui-shape-borderRadiusRound)', - opacity: '1', - }, + '& .MuiSwitch-thumb': { + width: '17px', + height: '17px', + background: '#FAFAFA', + }, + '& + .MuiSwitch-track': { + width: '38px', + height: '21px', + background: 'var(--mui-palette-success-light)', + borderRadius: 'var(--mui-shape-borderRadiusRound)', + opacity: '1', }, }, - }, + }, }, }, }, }, - }); + }, +}); + +export default function MyApp(props) { + const { Component, pageProps } = props; return ( <ThemeProvider theme={theme}> diff --git a/docs/data/material/discover-more/backers/backers.md b/docs/data/material/discover-more/backers/backers.md index a88996b84f1ce1..f85ad2dfdace96 100644 --- a/docs/data/material/discover-more/backers/backers.md +++ b/docs/data/material/discover-more/backers/backers.md @@ -28,6 +28,16 @@ via [Open Collective](https://opencollective.com/mui-org) or via [the for-profi <a data-ga-event-category="sponsor" data-ga-event-action="docs-backers" data-ga-event-label="megafamous.com" href="https://megafamous.com/?utm_source=MUI&utm_medium=referral&utm_content=backers" rel="noopener sponsored" target="_blank" class="remove-link-arrow" style="margin-right: 16px;"><img height="96" width="96" src="/static/sponsors/megafamous.png" alt="megafamous.com" title="MegaFamous: Buy Instagram followers and likes." loading="lazy" /></a> <a data-ga-event-category="sponsor" data-ga-event-action="docs-backers" data-ga-event-label="dialmycalls.com" href="https://www.dialmycalls.com/?utm_source=MUI&utm_medium=referral&utm_content=backers" rel="noopener sponsored" target="_blank" class="remove-link-arrow" style="margin-right: 16px;"><img height="96" width="96" src="https://images.opencollective.com/dialmycalls/f5ae9ab/avatar/96.png" srcset="https://images.opencollective.com/dialmycalls/f5ae9ab/avatar/288.png 3x" alt="dialmycalls.com" title="DialMyCalls: Send text messages, calls, and emails." loading="lazy" /></a> <a data-ga-event-category="sponsor" data-ga-event-action="docs-backers" data-ga-event-label="goread.io" href="https://goread.io/?utm_source=MUI&utm_medium=referral&utm_content=backers" rel="noopener sponsored" target="_blank" class="remove-link-arrow" style="margin-right: 16px; display:flex;"><img height="110" width="96" src="https://images.opencollective.com/goread_io/eb6337d/logo/96.png" srcset="https://images.opencollective.com/goread_io/eb6337d/logo/288.png 3x" alt="goread.io" title="Goread.io: Instagram followers, likes, views, and comments." loading="lazy" /></a> + <a data-ga-event-category="sponsor" data-ga-event-action="docs-backers" data-ga-event-label="copycopter.ai" href="https://copycopter.ai/?utm_source=MUI&utm_medium=referral&utm_content=backers" rel="noopener sponsored" target="_blank" class="remove-link-arrow" style="margin-right: 16px; display:flex;"><img height="96" width="96" src="https://images.opencollective.com/copycopterai/e167216/logo/96.png" srcset="https://images.opencollective.com/copycopterai/e167216/logo/288.png 3x" alt="copycopter.ai" title="CopyCopter: Turn prompts into videos at ultra speed." loading="lazy" /></a> +</p> + +<!-- +List gold sponsors that regular sponsors could feel uncomfortable being listed next to. +For example, it could be because the service breaks another service's Terms of service and hence is a moral minefield. +--> +<p style="display: flex; justify-content: start; align-items: center; flex-wrap: wrap;"> + <a data-ga-event-category="sponsor" data-ga-event-action="docs-backers" data-ga-event-label="buzzoid.com" href="https://buzzoid.com/?utm_source=MUI&utm_medium=referral&utm_content=backers" rel="noopener sponsored" target="_blank" class="remove-link-arrow" style="margin-right: 16px; display:flex;"><img height="24" width="26" src="https://images.opencollective.com/buzzoidz/d23d9bb/logo/24.png" srcset="https://images.opencollective.com/buzzoidz/d23d9bb/logo/72.png 3x" alt="buzzoid.com" title="Buzzoid: Instant delivery Instagram followers." loading="lazy" style="margin-right:8px;" />Buzzoid</a> + <a data-ga-event-category="sponsor" data-ga-event-action="docs-backers" data-ga-event-label="twicsy.com" href="https://twicsy.com/?utm_source=MUI&utm_medium=referral&utm_content=backers" rel="noopener sponsored" target="_blank" class="remove-link-arrow" style="margin-right: 16px; display:flex;"><img height="24" width="26" src="https://images.opencollective.com/twicsy/7af290f/logo/24.png" srcset="https://images.opencollective.com/twicsy/7af290f/logo/72.png 3x" alt="twicsy.com" title="Twicsy: Instant delivery Instagram followers." loading="lazy" style="margin-right:8px;" />Twicsy</a> </p> Gold sponsors are those who've pledged \$500/month or more to the MUI organization. [Tier benefits](#gold). diff --git a/docs/data/material/getting-started/installation/installation.md b/docs/data/material/getting-started/installation/installation.md index 6c342b75c5313d..666e60bb9f1bfe 100644 --- a/docs/data/material/getting-started/installation/installation.md +++ b/docs/data/material/getting-started/installation/installation.md @@ -6,24 +6,20 @@ Run one of the following commands to add Material UI to your project: -:::info -The `next` tag is used to download the latest <b>pre-release</b>, v6 version. Remove it to get the current stable version. -::: - <!-- #default-branch-switch --> <codeblock storageKey="package-manager"> ```bash npm -npm install @mui/material@next @emotion/react @emotion/styled +npm install @mui/material @emotion/react @emotion/styled ``` -```bash yarn -yarn add @mui/material@next @emotion/react @emotion/styled +```bash pnpm +pnpm add @mui/material @emotion/react @emotion/styled ``` -```bash pnpm -pnpm add @mui/material@next @emotion/react @emotion/styled +```bash yarn +yarn add @mui/material @emotion/react @emotion/styled ``` </codeblock> @@ -52,14 +48,14 @@ If you want to use [styled-components](https://styled-components.com/) instead, npm install @mui/material @mui/styled-engine-sc styled-components ``` -```bash yarn -yarn add @mui/material @mui/styled-engine-sc styled-components -``` - ```bash pnpm pnpm add @mui/material @mui/styled-engine-sc styled-components ``` +```bash yarn +yarn add @mui/material @mui/styled-engine-sc styled-components +``` + </codeblock> Next, follow the [styled-components how-to guide](/material-ui/integrations/styled-components/) to properly configure your bundler to support `@mui/styled-engine-sc`. @@ -83,14 +79,14 @@ Add it to your project via Fontsource, or with the Google Fonts CDN. npm install @fontsource/roboto ``` -```bash yarn -yarn add @fontsource/roboto -``` - ```bash pnpm pnpm add @fontsource/roboto ``` +```bash yarn +yarn add @fontsource/roboto +``` + </codeblock> Then you can import it in your entry point like this: @@ -130,14 +126,14 @@ You can do so with npm, or with the Google Web Fonts CDN. npm install @mui/icons-material ``` -```bash yarn -yarn add @mui/icons-material -``` - ```bash pnpm pnpm add @mui/icons-material ``` +```bash yarn +yarn add @mui/icons-material +``` + </codeblock> ### Google Web Fonts @@ -162,7 +158,7 @@ You can start using Material UI right away with minimal front-end infrastructur <!-- #default-branch-switch --> -Follow [this CDN example](https://github.com/mui/material-ui/tree/next/examples/material-ui-via-cdn) to get started. +Follow [this CDN example](https://github.com/mui/material-ui/tree/master/examples/material-ui-via-cdn) to get started. :::error We do _not_ recommend using this approach in production. diff --git a/docs/data/material/getting-started/support/support.md b/docs/data/material/getting-started/support/support.md index 69b342cd07b045..7798a2ff0bda5f 100644 --- a/docs/data/material/getting-started/support/support.md +++ b/docs/data/material/getting-started/support/support.md @@ -74,8 +74,9 @@ This includes issues introduced by external sources, like browser upgrades or ch | Material UI version | Release | Supported | | ------------------: | :--------- | :------------------------------------------------------------------ | -| ^5.0.0 | 2021-09-16 | ✅ Stable major (Continuous support) | -| ^4.0.0 | 2019-06-23 | ⚠️ Long-term support (Support for security issues and regressions). | +| ^6.0.0 | 2024-08-26 | ✅ Stable major (Continuous support) | +| ^5.0.0 | 2021-09-16 | ⚠️ Long-term support (Support for security issues and regressions). | +| ^4.0.0 | 2019-06-23 | ❌ | | ^3.0.0 | 2018-08-27 | ❌ | | ^2.0.0 | / | ❌ | | ^1.0.0 | 2018-06-18 | ❌ | diff --git a/docs/data/material/getting-started/templates/blog/Blog.js b/docs/data/material/getting-started/templates/blog/Blog.js index 3080d885ee7221..a83c67b23ce951 100644 --- a/docs/data/material/getting-started/templates/blog/Blog.js +++ b/docs/data/material/getting-started/templates/blog/Blog.js @@ -1,65 +1,15 @@ import * as React from 'react'; -import PropTypes from 'prop-types'; import CssBaseline from '@mui/material/CssBaseline'; -import Box from '@mui/material/Box'; import Container from '@mui/material/Container'; -import ToggleButton from '@mui/material/ToggleButton'; -import ToggleButtonGroup from '@mui/material/ToggleButtonGroup'; import { createTheme, ThemeProvider } from '@mui/material/styles'; - -import AutoAwesomeRoundedIcon from '@mui/icons-material/AutoAwesomeRounded'; - import AppAppBar from './components/AppAppBar'; import MainContent from './components/MainContent'; import Latest from './components/Latest'; import Footer from './components/Footer'; +import TemplateFrame from './TemplateFrame'; import getBlogTheme from './theme/getBlogTheme'; -function ToggleCustomTheme({ showCustomTheme, toggleCustomTheme }) { - return ( - <Box - sx={{ - display: 'flex', - flexDirection: 'column', - alignItems: 'center', - width: '100dvw', - position: 'fixed', - bottom: 24, - }} - > - <ToggleButtonGroup - color="primary" - exclusive - value={showCustomTheme} - onChange={toggleCustomTheme} - aria-label="Toggle design language" - sx={{ - backgroundColor: 'background.default', - '& .Mui-selected': { - pointerEvents: 'none', - }, - }} - > - <ToggleButton value> - <AutoAwesomeRoundedIcon sx={{ fontSize: '20px', mr: 1 }} /> - Custom theme - </ToggleButton> - <ToggleButton data-screenshot="toggle-default-theme" value={false}> - Material Design 2 - </ToggleButton> - </ToggleButtonGroup> - </Box> - ); -} - -ToggleCustomTheme.propTypes = { - showCustomTheme: PropTypes.shape({ - valueOf: PropTypes.func.isRequired, - }).isRequired, - toggleCustomTheme: PropTypes.func.isRequired, -}; - export default function Blog() { const [mode, setMode] = React.useState('light'); const [showCustomTheme, setShowCustomTheme] = React.useState(true); @@ -85,27 +35,31 @@ export default function Blog() { setMode(newMode); localStorage.setItem('themeMode', newMode); // Save the selected mode to localStorage }; + const toggleCustomTheme = () => { setShowCustomTheme((prev) => !prev); }; return ( - <ThemeProvider theme={showCustomTheme ? blogTheme : defaultTheme}> - <CssBaseline /> - <AppAppBar mode={mode} toggleColorMode={toggleColorMode} /> - <Container - maxWidth="lg" - component="main" - sx={{ display: 'flex', flexDirection: 'column', my: 16, gap: 4 }} - > - <MainContent /> - <Latest /> - </Container> - <Footer /> - <ToggleCustomTheme - toggleCustomTheme={toggleCustomTheme} - showCustomTheme={showCustomTheme} - /> - </ThemeProvider> + <TemplateFrame + toggleCustomTheme={toggleCustomTheme} + showCustomTheme={showCustomTheme} + mode={mode} + toggleColorMode={toggleColorMode} + > + <ThemeProvider theme={showCustomTheme ? blogTheme : defaultTheme}> + <CssBaseline enableColorScheme /> + <AppAppBar /> + <Container + maxWidth="lg" + component="main" + sx={{ display: 'flex', flexDirection: 'column', my: 16, gap: 4 }} + > + <MainContent /> + <Latest /> + </Container> + <Footer /> + </ThemeProvider> + </TemplateFrame> ); } diff --git a/docs/data/material/getting-started/templates/blog/Blog.tsx b/docs/data/material/getting-started/templates/blog/Blog.tsx index 236fa49af550ee..f96d669499b961 100644 --- a/docs/data/material/getting-started/templates/blog/Blog.tsx +++ b/docs/data/material/getting-started/templates/blog/Blog.tsx @@ -1,65 +1,15 @@ import * as React from 'react'; import CssBaseline from '@mui/material/CssBaseline'; -import Box from '@mui/material/Box'; import Container from '@mui/material/Container'; -import ToggleButton from '@mui/material/ToggleButton'; -import ToggleButtonGroup from '@mui/material/ToggleButtonGroup'; import { createTheme, ThemeProvider, PaletteMode } from '@mui/material/styles'; - -import AutoAwesomeRoundedIcon from '@mui/icons-material/AutoAwesomeRounded'; - import AppAppBar from './components/AppAppBar'; import MainContent from './components/MainContent'; import Latest from './components/Latest'; import Footer from './components/Footer'; +import TemplateFrame from './TemplateFrame'; import getBlogTheme from './theme/getBlogTheme'; -interface ToggleCustomThemeProps { - showCustomTheme: Boolean; - toggleCustomTheme: () => void; -} - -function ToggleCustomTheme({ - showCustomTheme, - toggleCustomTheme, -}: ToggleCustomThemeProps) { - return ( - <Box - sx={{ - display: 'flex', - flexDirection: 'column', - alignItems: 'center', - width: '100dvw', - position: 'fixed', - bottom: 24, - }} - > - <ToggleButtonGroup - color="primary" - exclusive - value={showCustomTheme} - onChange={toggleCustomTheme} - aria-label="Toggle design language" - sx={{ - backgroundColor: 'background.default', - '& .Mui-selected': { - pointerEvents: 'none', - }, - }} - > - <ToggleButton value> - <AutoAwesomeRoundedIcon sx={{ fontSize: '20px', mr: 1 }} /> - Custom theme - </ToggleButton> - <ToggleButton data-screenshot="toggle-default-theme" value={false}> - Material Design 2 - </ToggleButton> - </ToggleButtonGroup> - </Box> - ); -} - export default function Blog() { const [mode, setMode] = React.useState<PaletteMode>('light'); const [showCustomTheme, setShowCustomTheme] = React.useState(true); @@ -85,27 +35,32 @@ export default function Blog() { setMode(newMode); localStorage.setItem('themeMode', newMode); // Save the selected mode to localStorage }; + const toggleCustomTheme = () => { setShowCustomTheme((prev) => !prev); }; return ( - <ThemeProvider theme={showCustomTheme ? blogTheme : defaultTheme}> - <CssBaseline /> - <AppAppBar mode={mode} toggleColorMode={toggleColorMode} /> - <Container - maxWidth="lg" - component="main" - sx={{ display: 'flex', flexDirection: 'column', my: 16, gap: 4 }} - > - <MainContent /> - <Latest /> - </Container> - <Footer /> - <ToggleCustomTheme - toggleCustomTheme={toggleCustomTheme} - showCustomTheme={showCustomTheme} - /> - </ThemeProvider> + <TemplateFrame + toggleCustomTheme={toggleCustomTheme} + showCustomTheme={showCustomTheme} + mode={mode} + toggleColorMode={toggleColorMode} + > + <ThemeProvider theme={showCustomTheme ? blogTheme : defaultTheme}> + <CssBaseline enableColorScheme /> + + <AppAppBar /> + <Container + maxWidth="lg" + component="main" + sx={{ display: 'flex', flexDirection: 'column', my: 16, gap: 4 }} + > + <MainContent /> + <Latest /> + </Container> + <Footer /> + </ThemeProvider> + </TemplateFrame> ); } diff --git a/docs/data/material/getting-started/templates/blog/README.md b/docs/data/material/getting-started/templates/blog/README.md index f2305a49255eec..c582b088659a33 100644 --- a/docs/data/material/getting-started/templates/blog/README.md +++ b/docs/data/material/getting-started/templates/blog/README.md @@ -4,7 +4,7 @@ <!-- #default-branch-switch --> -1. Copy the files into your project, or one of the [example projects](https://github.com/mui/material-ui/tree/next/examples). +1. Copy the files into your project, or one of the [example projects](https://github.com/mui/material-ui/tree/master/examples). 2. Make sure your project has the required dependencies: @mui/material, @mui/icons-material, @emotion/styled, @emotion/react, markdown-to-jsx. 3. Import and use the `Blog` component. @@ -12,4 +12,4 @@ <!-- #default-branch-switch --> -View the demo at https://next.mui.com/material-ui/getting-started/templates/blog/. +View the demo at https://mui.com/material-ui/getting-started/templates/blog/. diff --git a/docs/data/material/getting-started/templates/blog/TemplateFrame.js b/docs/data/material/getting-started/templates/blog/TemplateFrame.js new file mode 100644 index 00000000000000..36dffad11fd03c --- /dev/null +++ b/docs/data/material/getting-started/templates/blog/TemplateFrame.js @@ -0,0 +1,113 @@ +import * as React from 'react'; +import PropTypes from 'prop-types'; +import { createTheme, ThemeProvider, styled } from '@mui/material/styles'; +import Select from '@mui/material/Select'; +import MenuItem from '@mui/material/MenuItem'; +import FormControl from '@mui/material/FormControl'; +import Button from '@mui/material/Button'; +import IconButton from '@mui/material/IconButton'; +import Box from '@mui/material/Box'; +import AppBar from '@mui/material/AppBar'; +import Toolbar from '@mui/material/Toolbar'; +import ArrowBackRoundedIcon from '@mui/icons-material/ArrowBackRounded'; +import ToggleColorMode from './components/ToggleColorMode'; +import getBlogTheme from './theme/getBlogTheme'; + +const StyledAppBar = styled(AppBar)(({ theme }) => ({ + position: 'relative', + display: 'flex', + alignItems: 'center', + justifyContent: 'space-between', + flexShrink: 0, + borderBottom: '1px solid', + borderColor: theme.palette.divider, + backgroundColor: theme.palette.background.paper, + boxShadow: 'none', + backgroundImage: 'none', + zIndex: theme.zIndex.drawer + 1, + flex: '0 0 auto', +})); + +function TemplateFrame({ + showCustomTheme, + toggleCustomTheme, + mode, + toggleColorMode, + children, +}) { + const handleChange = (event) => { + toggleCustomTheme(event.target.value === 'custom'); + }; + const blogTheme = createTheme(getBlogTheme(mode)); + + return ( + <ThemeProvider theme={blogTheme}> + <Box sx={{ height: '100dvh', display: 'flex', flexDirection: 'column' }}> + <StyledAppBar> + <Toolbar + variant="dense" + disableGutters + sx={{ + display: 'flex', + justifyContent: 'space-between', + width: '100%', + p: '8px 12px', + }} + > + <Button + variant="text" + size="small" + aria-label="Back to templates" + startIcon={<ArrowBackRoundedIcon />} + component="a" + href="/material-ui/getting-started/templates/" + sx={{ display: { xs: 'none', sm: 'flex' } }} + > + Back to templates + </Button> + <IconButton + size="small" + aria-label="Back to templates" + component="a" + href="/material-ui/getting-started/templates/" + sx={{ display: { xs: 'auto', sm: 'none' } }} + > + <ArrowBackRoundedIcon /> + </IconButton> + <Box sx={{ display: 'flex', gap: 1 }}> + <FormControl variant="outlined" sx={{ minWidth: 180 }}> + <Select + size="small" + labelId="theme-select-label" + id="theme-select" + value={showCustomTheme ? 'custom' : 'material'} + onChange={handleChange} + label="Design Language" + > + <MenuItem value="custom">Custom Theme</MenuItem> + <MenuItem value="material">Material Design 2</MenuItem> + </Select> + </FormControl> + <ToggleColorMode + data-screenshot="toggle-mode" + mode={mode} + toggleColorMode={toggleColorMode} + /> + </Box> + </Toolbar> + </StyledAppBar> + <Box sx={{ flex: '1 1', overflow: 'auto' }}>{children}</Box> + </Box> + </ThemeProvider> + ); +} + +TemplateFrame.propTypes = { + children: PropTypes.node, + mode: PropTypes.oneOf(['dark', 'light']).isRequired, + showCustomTheme: PropTypes.bool.isRequired, + toggleColorMode: PropTypes.func.isRequired, + toggleCustomTheme: PropTypes.func.isRequired, +}; + +export default TemplateFrame; diff --git a/docs/data/material/getting-started/templates/blog/TemplateFrame.tsx b/docs/data/material/getting-started/templates/blog/TemplateFrame.tsx new file mode 100644 index 00000000000000..f1ff61fc03d27f --- /dev/null +++ b/docs/data/material/getting-started/templates/blog/TemplateFrame.tsx @@ -0,0 +1,115 @@ +import * as React from 'react'; +import { + createTheme, + ThemeProvider, + PaletteMode, + styled, +} from '@mui/material/styles'; +import Select, { SelectChangeEvent } from '@mui/material/Select'; +import MenuItem from '@mui/material/MenuItem'; +import FormControl from '@mui/material/FormControl'; +import Button from '@mui/material/Button'; +import IconButton from '@mui/material/IconButton'; +import Box from '@mui/material/Box'; +import AppBar from '@mui/material/AppBar'; +import Toolbar from '@mui/material/Toolbar'; +import ArrowBackRoundedIcon from '@mui/icons-material/ArrowBackRounded'; +import ToggleColorMode from './components/ToggleColorMode'; +import getBlogTheme from './theme/getBlogTheme'; + +const StyledAppBar = styled(AppBar)(({ theme }) => ({ + position: 'relative', + display: 'flex', + alignItems: 'center', + justifyContent: 'space-between', + flexShrink: 0, + borderBottom: '1px solid', + borderColor: theme.palette.divider, + backgroundColor: theme.palette.background.paper, + boxShadow: 'none', + backgroundImage: 'none', + zIndex: theme.zIndex.drawer + 1, + flex: '0 0 auto', +})); + +interface TemplateFrameProps { + showCustomTheme: boolean; + toggleCustomTheme: (theme: boolean) => void; + mode: PaletteMode; + toggleColorMode: () => void; + children: React.ReactNode; +} + +export default function TemplateFrame({ + showCustomTheme, + toggleCustomTheme, + mode, + toggleColorMode, + children, +}: TemplateFrameProps) { + const handleChange = (event: SelectChangeEvent) => { + toggleCustomTheme(event.target.value === 'custom'); + }; + const blogTheme = createTheme(getBlogTheme(mode)); + + return ( + <ThemeProvider theme={blogTheme}> + <Box sx={{ height: '100dvh', display: 'flex', flexDirection: 'column' }}> + <StyledAppBar> + <Toolbar + variant="dense" + disableGutters + sx={{ + display: 'flex', + justifyContent: 'space-between', + width: '100%', + p: '8px 12px', + }} + > + <Button + variant="text" + size="small" + aria-label="Back to templates" + startIcon={<ArrowBackRoundedIcon />} + component="a" + href="/material-ui/getting-started/templates/" + sx={{ display: { xs: 'none', sm: 'flex' } }} + > + Back to templates + </Button> + <IconButton + size="small" + aria-label="Back to templates" + component="a" + href="/material-ui/getting-started/templates/" + sx={{ display: { xs: 'auto', sm: 'none' } }} + > + <ArrowBackRoundedIcon /> + </IconButton> + <Box sx={{ display: 'flex', gap: 1 }}> + <FormControl variant="outlined" sx={{ minWidth: 180 }}> + <Select + size="small" + labelId="theme-select-label" + id="theme-select" + value={showCustomTheme ? 'custom' : 'material'} + onChange={handleChange} + label="Design Language" + > + <MenuItem value="custom">Custom Theme</MenuItem> + <MenuItem value="material">Material Design 2</MenuItem> + </Select> + </FormControl> + <ToggleColorMode + data-screenshot="toggle-mode" + mode={mode} + toggleColorMode={toggleColorMode} + /> + </Box> + </Toolbar> + </StyledAppBar> + <Box sx={{ flex: '1 1', overflow: 'auto' }}>{children}</Box> + </Box> + </ThemeProvider> + ); +} diff --git a/docs/data/material/getting-started/templates/blog/components/AppAppBar.js b/docs/data/material/getting-started/templates/blog/components/AppAppBar.js index a6551c5b9fae83..1b19a43af3d52f 100644 --- a/docs/data/material/getting-started/templates/blog/components/AppAppBar.js +++ b/docs/data/material/getting-started/templates/blog/components/AppAppBar.js @@ -1,5 +1,4 @@ import * as React from 'react'; -import PropTypes from 'prop-types'; import { alpha, styled } from '@mui/material/styles'; import Box from '@mui/material/Box'; import AppBar from '@mui/material/AppBar'; @@ -12,7 +11,6 @@ import MenuItem from '@mui/material/MenuItem'; import Drawer from '@mui/material/Drawer'; import MenuIcon from '@mui/icons-material/Menu'; import CloseRoundedIcon from '@mui/icons-material/CloseRounded'; -import ToggleColorMode from './ToggleColorMode'; import Sitemark from './SitemarkIcon'; const StyledToolbar = styled(Toolbar)(({ theme }) => ({ @@ -29,7 +27,7 @@ const StyledToolbar = styled(Toolbar)(({ theme }) => ({ padding: '8px 12px', })); -function AppAppBar({ mode, toggleColorMode }) { +export default function AppAppBar() { const [open, setOpen] = React.useState(false); const toggleDrawer = (newOpen) => () => { @@ -39,7 +37,7 @@ function AppAppBar({ mode, toggleColorMode }) { return ( <AppBar position="fixed" - sx={{ boxShadow: 0, bgcolor: 'transparent', backgroundImage: 'none', mt: 2 }} + sx={{ boxShadow: 0, bgcolor: 'transparent', backgroundImage: 'none', mt: 10 }} > <Container maxWidth="lg"> <StyledToolbar variant="dense" disableGutters> @@ -79,11 +77,6 @@ function AppAppBar({ mode, toggleColorMode }) { <Button color="primary" variant="contained" size="small"> Sign up </Button> - <ToggleColorMode - data-screenshot="toggle-mode" - mode={mode} - toggleColorMode={toggleColorMode} - /> </Box> <Box sx={{ display: { sm: 'flex', md: 'none' } }}> <IconButton aria-label="Menu button" onClick={toggleDrawer(true)}> @@ -98,7 +91,6 @@ function AppAppBar({ mode, toggleColorMode }) { justifyContent: 'space-between', }} > - <ToggleColorMode mode={mode} toggleColorMode={toggleColorMode} /> <IconButton onClick={toggleDrawer(false)}> <CloseRoundedIcon /> </IconButton> @@ -128,10 +120,3 @@ function AppAppBar({ mode, toggleColorMode }) { </AppBar> ); } - -AppAppBar.propTypes = { - mode: PropTypes.oneOf(['dark', 'light']).isRequired, - toggleColorMode: PropTypes.func.isRequired, -}; - -export default AppAppBar; diff --git a/docs/data/material/getting-started/templates/blog/components/AppAppBar.tsx b/docs/data/material/getting-started/templates/blog/components/AppAppBar.tsx index 09097f96003005..63a5faa5d0f8ce 100644 --- a/docs/data/material/getting-started/templates/blog/components/AppAppBar.tsx +++ b/docs/data/material/getting-started/templates/blog/components/AppAppBar.tsx @@ -1,5 +1,5 @@ import * as React from 'react'; -import { PaletteMode, alpha, styled } from '@mui/material/styles'; +import { alpha, styled } from '@mui/material/styles'; import Box from '@mui/material/Box'; import AppBar from '@mui/material/AppBar'; import Toolbar from '@mui/material/Toolbar'; @@ -11,7 +11,6 @@ import MenuItem from '@mui/material/MenuItem'; import Drawer from '@mui/material/Drawer'; import MenuIcon from '@mui/icons-material/Menu'; import CloseRoundedIcon from '@mui/icons-material/CloseRounded'; -import ToggleColorMode from './ToggleColorMode'; import Sitemark from './SitemarkIcon'; const StyledToolbar = styled(Toolbar)(({ theme }) => ({ @@ -28,12 +27,7 @@ const StyledToolbar = styled(Toolbar)(({ theme }) => ({ padding: '8px 12px', })); -interface AppAppBarProps { - mode: PaletteMode; - toggleColorMode: () => void; -} - -export default function AppAppBar({ mode, toggleColorMode }: AppAppBarProps) { +export default function AppAppBar() { const [open, setOpen] = React.useState(false); const toggleDrawer = (newOpen: boolean) => () => { @@ -43,7 +37,7 @@ export default function AppAppBar({ mode, toggleColorMode }: AppAppBarProps) { return ( <AppBar position="fixed" - sx={{ boxShadow: 0, bgcolor: 'transparent', backgroundImage: 'none', mt: 2 }} + sx={{ boxShadow: 0, bgcolor: 'transparent', backgroundImage: 'none', mt: 10 }} > <Container maxWidth="lg"> <StyledToolbar variant="dense" disableGutters> @@ -83,11 +77,6 @@ export default function AppAppBar({ mode, toggleColorMode }: AppAppBarProps) { <Button color="primary" variant="contained" size="small"> Sign up </Button> - <ToggleColorMode - data-screenshot="toggle-mode" - mode={mode} - toggleColorMode={toggleColorMode} - /> </Box> <Box sx={{ display: { sm: 'flex', md: 'none' } }}> <IconButton aria-label="Menu button" onClick={toggleDrawer(true)}> @@ -102,7 +91,6 @@ export default function AppAppBar({ mode, toggleColorMode }: AppAppBarProps) { justifyContent: 'space-between', }} > - <ToggleColorMode mode={mode} toggleColorMode={toggleColorMode} /> <IconButton onClick={toggleDrawer(false)}> <CloseRoundedIcon /> </IconButton> diff --git a/docs/data/material/getting-started/templates/blog/components/Footer.js b/docs/data/material/getting-started/templates/blog/components/Footer.js index 579372ebfb32e4..b48929196e432d 100644 --- a/docs/data/material/getting-started/templates/blog/components/Footer.js +++ b/docs/data/material/getting-started/templates/blog/components/Footer.js @@ -9,7 +9,6 @@ import Link from '@mui/material/Link'; import Stack from '@mui/material/Stack'; import TextField from '@mui/material/TextField'; import Typography from '@mui/material/Typography'; -import { visuallyHidden } from '@mui/utils'; import FacebookIcon from '@mui/icons-material/GitHub'; import LinkedInIcon from '@mui/icons-material/LinkedIn'; import TwitterIcon from '@mui/icons-material/X'; @@ -70,10 +69,8 @@ export default function Footer() { <Typography variant="body2" sx={{ color: 'text.secondary', mb: 2 }}> Subscribe for weekly updates. No spams ever! </Typography> + <InputLabel htmlFor="email-newsletter">Email</InputLabel> <Stack direction="row" spacing={1} useFlexGap> - <InputLabel htmlFor="email-newsletter" sx={visuallyHidden}> - Email - </InputLabel> <TextField id="email-newsletter" hiddenLabel diff --git a/docs/data/material/getting-started/templates/blog/components/Footer.tsx b/docs/data/material/getting-started/templates/blog/components/Footer.tsx index 579372ebfb32e4..b48929196e432d 100644 --- a/docs/data/material/getting-started/templates/blog/components/Footer.tsx +++ b/docs/data/material/getting-started/templates/blog/components/Footer.tsx @@ -9,7 +9,6 @@ import Link from '@mui/material/Link'; import Stack from '@mui/material/Stack'; import TextField from '@mui/material/TextField'; import Typography from '@mui/material/Typography'; -import { visuallyHidden } from '@mui/utils'; import FacebookIcon from '@mui/icons-material/GitHub'; import LinkedInIcon from '@mui/icons-material/LinkedIn'; import TwitterIcon from '@mui/icons-material/X'; @@ -70,10 +69,8 @@ export default function Footer() { <Typography variant="body2" sx={{ color: 'text.secondary', mb: 2 }}> Subscribe for weekly updates. No spams ever! </Typography> + <InputLabel htmlFor="email-newsletter">Email</InputLabel> <Stack direction="row" spacing={1} useFlexGap> - <InputLabel htmlFor="email-newsletter" sx={visuallyHidden}> - Email - </InputLabel> <TextField id="email-newsletter" hiddenLabel diff --git a/docs/data/material/getting-started/templates/blog/components/MainContent.js b/docs/data/material/getting-started/templates/blog/components/MainContent.js index 021d63fd096793..882b950848ecdd 100644 --- a/docs/data/material/getting-started/templates/blog/components/MainContent.js +++ b/docs/data/material/getting-started/templates/blog/components/MainContent.js @@ -197,6 +197,20 @@ export default function MainContent() { </Typography> <Typography>Stay in the loop with the latest about our products</Typography> </div> + <Box + sx={{ + display: { xs: 'flex', sm: 'none' }, + flexDirection: 'row', + gap: 1, + width: { xs: '100%', md: 'fit-content' }, + overflow: 'auto', + }} + > + <Search /> + <IconButton size="small" aria-label="RSS feed"> + <RssFeedRoundedIcon /> + </IconButton> + </Box> <Box sx={{ display: 'flex', @@ -205,9 +219,17 @@ export default function MainContent() { justifyContent: 'space-between', alignItems: { xs: 'start', md: 'center' }, gap: 4, + overflow: 'auto', }} > - <Box sx={{ display: 'flex', flexDirection: 'row', gap: 3 }}> + <Box + sx={{ + display: 'inline-flex', + flexDirection: 'row', + gap: 3, + overflow: 'auto', + }} + > <Chip onClick={handleClick} size="medium" label="All categories" /> <Chip onClick={handleClick} @@ -248,10 +270,11 @@ export default function MainContent() { </Box> <Box sx={{ - display: 'flex', + display: { xs: 'none', sm: 'flex' }, flexDirection: 'row', gap: 1, width: { xs: '100%', md: 'fit-content' }, + overflow: 'auto', }} > <Search /> diff --git a/docs/data/material/getting-started/templates/blog/components/MainContent.tsx b/docs/data/material/getting-started/templates/blog/components/MainContent.tsx index 9294c7be0faeef..4d513a093fe4ee 100644 --- a/docs/data/material/getting-started/templates/blog/components/MainContent.tsx +++ b/docs/data/material/getting-started/templates/blog/components/MainContent.tsx @@ -189,6 +189,20 @@ export default function MainContent() { </Typography> <Typography>Stay in the loop with the latest about our products</Typography> </div> + <Box + sx={{ + display: { xs: 'flex', sm: 'none' }, + flexDirection: 'row', + gap: 1, + width: { xs: '100%', md: 'fit-content' }, + overflow: 'auto', + }} + > + <Search /> + <IconButton size="small" aria-label="RSS feed"> + <RssFeedRoundedIcon /> + </IconButton> + </Box> <Box sx={{ display: 'flex', @@ -197,9 +211,17 @@ export default function MainContent() { justifyContent: 'space-between', alignItems: { xs: 'start', md: 'center' }, gap: 4, + overflow: 'auto', }} > - <Box sx={{ display: 'flex', flexDirection: 'row', gap: 3 }}> + <Box + sx={{ + display: 'inline-flex', + flexDirection: 'row', + gap: 3, + overflow: 'auto', + }} + > <Chip onClick={handleClick} size="medium" label="All categories" /> <Chip onClick={handleClick} @@ -240,10 +262,11 @@ export default function MainContent() { </Box> <Box sx={{ - display: 'flex', + display: { xs: 'none', sm: 'flex' }, flexDirection: 'row', gap: 1, width: { xs: '100%', md: 'fit-content' }, + overflow: 'auto', }} > <Search /> diff --git a/docs/data/material/getting-started/templates/blog/theme/themePrimitives.js b/docs/data/material/getting-started/templates/blog/theme/themePrimitives.js index 1894b11b326f0c..625400640eef43 100644 --- a/docs/data/material/getting-started/templates/blog/theme/themePrimitives.js +++ b/docs/data/material/getting-started/templates/blog/theme/themePrimitives.js @@ -1,6 +1,8 @@ import { createTheme, alpha } from '@mui/material/styles'; -const customTheme = createTheme(); +const defaultTheme = createTheme(); + +const customShadows = [...defaultTheme.shadows]; export const brand = { 50: 'hsl(210, 100%, 95%)', @@ -67,143 +69,148 @@ export const red = { 900: 'hsl(0, 93%, 6%)', }; -export const getDesignTokens = (mode) => ({ - palette: { - mode, - primary: { - light: brand[200], - main: brand[400], - dark: brand[700], - contrastText: brand[50], - ...(mode === 'dark' && { - contrastText: brand[50], - light: brand[300], +export const getDesignTokens = (mode) => { + customShadows[1] = + mode === 'dark' + ? 'hsla(220, 30%, 5%, 0.7) 0px 4px 16px 0px, hsla(220, 25%, 10%, 0.8) 0px 8px 16px -5px' + : 'hsla(220, 30%, 5%, 0.07) 0px 4px 16px 0px, hsla(220, 25%, 10%, 0.07) 0px 8px 16px -5px'; + + return { + palette: { + mode, + primary: { + light: brand[200], main: brand[400], dark: brand[700], - }), - }, - info: { - light: brand[100], - main: brand[300], - dark: brand[600], - contrastText: gray[50], - ...(mode === 'dark' && { - contrastText: brand[300], - light: brand[500], - main: brand[700], - dark: brand[900], - }), - }, - warning: { - light: orange[300], - main: orange[400], - dark: orange[800], - ...(mode === 'dark' && { - light: orange[400], - main: orange[500], - dark: orange[700], - }), - }, - error: { - light: red[300], - main: red[400], - dark: red[800], - ...(mode === 'dark' && { - light: red[400], - main: red[500], - dark: red[700], - }), - }, - success: { - light: green[300], - main: green[400], - dark: green[800], - ...(mode === 'dark' && { - light: green[400], - main: green[500], - dark: green[700], - }), - }, - grey: { - ...gray, - }, - divider: mode === 'dark' ? alpha(gray[700], 0.6) : alpha(gray[300], 0.4), - background: { - default: 'hsl(0, 0%, 99%)', - paper: 'hsl(220, 35%, 97%)', - ...(mode === 'dark' && { default: gray[900], paper: 'hsl(220, 30%, 7%)' }), - }, - text: { - primary: gray[800], - secondary: gray[600], - warning: orange[400], - ...(mode === 'dark' && { primary: 'hsl(0, 0%, 100%)', secondary: gray[400] }), - }, - action: { - hover: alpha(gray[200], 0.2), - selected: `${alpha(gray[200], 0.3)}`, - ...(mode === 'dark' && { - hover: alpha(gray[600], 0.2), - selected: alpha(gray[600], 0.3), - }), - }, - }, - typography: { - fontFamily: ['"Inter", "sans-serif"'].join(','), - h1: { - fontSize: customTheme.typography.pxToRem(48), - fontWeight: 600, - lineHeight: 1.2, - letterSpacing: -0.5, - }, - h2: { - fontSize: customTheme.typography.pxToRem(36), - fontWeight: 600, - lineHeight: 1.2, - }, - h3: { - fontSize: customTheme.typography.pxToRem(30), - lineHeight: 1.2, - }, - h4: { - fontSize: customTheme.typography.pxToRem(24), - fontWeight: 600, - lineHeight: 1.5, - }, - h5: { - fontSize: customTheme.typography.pxToRem(20), - fontWeight: 600, - }, - h6: { - fontSize: customTheme.typography.pxToRem(18), - fontWeight: 600, - }, - subtitle1: { - fontSize: customTheme.typography.pxToRem(18), - }, - subtitle2: { - fontSize: customTheme.typography.pxToRem(14), - fontWeight: 500, - }, - body1: { - fontSize: customTheme.typography.pxToRem(14), - }, - body2: { - fontSize: customTheme.typography.pxToRem(14), - fontWeight: 400, - }, - caption: { - fontSize: customTheme.typography.pxToRem(12), - fontWeight: 400, - }, - }, - shape: { - borderRadius: 8, - }, - shadows: [ - 'none', - ...(mode === 'dark' - ? 'hsla(220, 30%, 5%, 0.7) 0px 4px 16px 0px, hsla(220, 25%, 10%, 0.8) 0px 8px 16px -5px' - : 'hsla(220, 30%, 5%, 0.07) 0px 4px 16px 0px, hsla(220, 25%, 10%, 0.07) 0px 8px 16px -5px'), - ], -}); + contrastText: brand[50], + ...(mode === 'dark' && { + contrastText: brand[50], + light: brand[300], + main: brand[400], + dark: brand[700], + }), + }, + info: { + light: brand[100], + main: brand[300], + dark: brand[600], + contrastText: gray[50], + ...(mode === 'dark' && { + contrastText: brand[300], + light: brand[500], + main: brand[700], + dark: brand[900], + }), + }, + warning: { + light: orange[300], + main: orange[400], + dark: orange[800], + ...(mode === 'dark' && { + light: orange[400], + main: orange[500], + dark: orange[700], + }), + }, + error: { + light: red[300], + main: red[400], + dark: red[800], + ...(mode === 'dark' && { + light: red[400], + main: red[500], + dark: red[700], + }), + }, + success: { + light: green[300], + main: green[400], + dark: green[800], + ...(mode === 'dark' && { + light: green[400], + main: green[500], + dark: green[700], + }), + }, + grey: { + ...gray, + }, + divider: mode === 'dark' ? alpha(gray[700], 0.6) : alpha(gray[300], 0.4), + background: { + default: 'hsl(0, 0%, 99%)', + paper: 'hsl(220, 35%, 97%)', + ...(mode === 'dark' && { default: gray[900], paper: 'hsl(220, 30%, 7%)' }), + }, + text: { + primary: gray[800], + secondary: gray[600], + warning: orange[400], + ...(mode === 'dark' && { + primary: 'hsl(0, 0%, 100%)', + secondary: gray[400], + }), + }, + action: { + hover: alpha(gray[200], 0.2), + selected: `${alpha(gray[200], 0.3)}`, + ...(mode === 'dark' && { + hover: alpha(gray[600], 0.2), + selected: alpha(gray[600], 0.3), + }), + }, + }, + typography: { + fontFamily: ['"Inter", "sans-serif"'].join(','), + h1: { + fontSize: defaultTheme.typography.pxToRem(48), + fontWeight: 600, + lineHeight: 1.2, + letterSpacing: -0.5, + }, + h2: { + fontSize: defaultTheme.typography.pxToRem(36), + fontWeight: 600, + lineHeight: 1.2, + }, + h3: { + fontSize: defaultTheme.typography.pxToRem(30), + lineHeight: 1.2, + }, + h4: { + fontSize: defaultTheme.typography.pxToRem(24), + fontWeight: 600, + lineHeight: 1.5, + }, + h5: { + fontSize: defaultTheme.typography.pxToRem(20), + fontWeight: 600, + }, + h6: { + fontSize: defaultTheme.typography.pxToRem(18), + fontWeight: 600, + }, + subtitle1: { + fontSize: defaultTheme.typography.pxToRem(18), + }, + subtitle2: { + fontSize: defaultTheme.typography.pxToRem(14), + fontWeight: 500, + }, + body1: { + fontSize: defaultTheme.typography.pxToRem(14), + }, + body2: { + fontSize: defaultTheme.typography.pxToRem(14), + fontWeight: 400, + }, + caption: { + fontSize: defaultTheme.typography.pxToRem(12), + fontWeight: 400, + }, + }, + shape: { + borderRadius: 8, + }, + shadows: customShadows, + }; +}; diff --git a/docs/data/material/getting-started/templates/blog/theme/themePrimitives.ts b/docs/data/material/getting-started/templates/blog/theme/themePrimitives.ts index 09df769bb6687d..41b517b5294fad 100644 --- a/docs/data/material/getting-started/templates/blog/theme/themePrimitives.ts +++ b/docs/data/material/getting-started/templates/blog/theme/themePrimitives.ts @@ -1,4 +1,4 @@ -import { createTheme, alpha, Shadows, PaletteMode } from '@mui/material/styles'; +import { createTheme, alpha, PaletteMode, Shadows } from '@mui/material/styles'; declare module '@mui/material/Paper' { interface PaperPropsVariantOverrides { @@ -22,7 +22,9 @@ declare module '@mui/material/styles/createPalette' { interface PaletteColor extends ColorRange {} } -const customTheme = createTheme(); +const defaultTheme = createTheme(); + +const customShadows: Shadows = [...defaultTheme.shadows]; export const brand = { 50: 'hsl(210, 100%, 95%)', @@ -89,143 +91,145 @@ export const red = { 900: 'hsl(0, 93%, 6%)', }; -export const getDesignTokens = (mode: PaletteMode) => ({ - palette: { - mode, - primary: { - light: brand[200], - main: brand[400], - dark: brand[700], - contrastText: brand[50], - ...(mode === 'dark' && { - contrastText: brand[50], - light: brand[300], +export const getDesignTokens = (mode: PaletteMode) => { + customShadows[1] = + mode === 'dark' + ? 'hsla(220, 30%, 5%, 0.7) 0px 4px 16px 0px, hsla(220, 25%, 10%, 0.8) 0px 8px 16px -5px' + : 'hsla(220, 30%, 5%, 0.07) 0px 4px 16px 0px, hsla(220, 25%, 10%, 0.07) 0px 8px 16px -5px'; + + return { + palette: { + mode, + primary: { + light: brand[200], main: brand[400], dark: brand[700], - }), - }, - info: { - light: brand[100], - main: brand[300], - dark: brand[600], - contrastText: gray[50], - ...(mode === 'dark' && { - contrastText: brand[300], - light: brand[500], - main: brand[700], - dark: brand[900], - }), - }, - warning: { - light: orange[300], - main: orange[400], - dark: orange[800], - ...(mode === 'dark' && { - light: orange[400], - main: orange[500], - dark: orange[700], - }), - }, - error: { - light: red[300], - main: red[400], - dark: red[800], - ...(mode === 'dark' && { - light: red[400], - main: red[500], - dark: red[700], - }), - }, - success: { - light: green[300], - main: green[400], - dark: green[800], - ...(mode === 'dark' && { - light: green[400], - main: green[500], - dark: green[700], - }), - }, - grey: { - ...gray, - }, - divider: mode === 'dark' ? alpha(gray[700], 0.6) : alpha(gray[300], 0.4), - background: { - default: 'hsl(0, 0%, 99%)', - paper: 'hsl(220, 35%, 97%)', - ...(mode === 'dark' && { default: gray[900], paper: 'hsl(220, 30%, 7%)' }), - }, - text: { - primary: gray[800], - secondary: gray[600], - warning: orange[400], - ...(mode === 'dark' && { primary: 'hsl(0, 0%, 100%)', secondary: gray[400] }), - }, - action: { - hover: alpha(gray[200], 0.2), - selected: `${alpha(gray[200], 0.3)}`, - ...(mode === 'dark' && { - hover: alpha(gray[600], 0.2), - selected: alpha(gray[600], 0.3), - }), - }, - }, - typography: { - fontFamily: ['"Inter", "sans-serif"'].join(','), - h1: { - fontSize: customTheme.typography.pxToRem(48), - fontWeight: 600, - lineHeight: 1.2, - letterSpacing: -0.5, - }, - h2: { - fontSize: customTheme.typography.pxToRem(36), - fontWeight: 600, - lineHeight: 1.2, - }, - h3: { - fontSize: customTheme.typography.pxToRem(30), - lineHeight: 1.2, - }, - h4: { - fontSize: customTheme.typography.pxToRem(24), - fontWeight: 600, - lineHeight: 1.5, - }, - h5: { - fontSize: customTheme.typography.pxToRem(20), - fontWeight: 600, - }, - h6: { - fontSize: customTheme.typography.pxToRem(18), - fontWeight: 600, - }, - subtitle1: { - fontSize: customTheme.typography.pxToRem(18), - }, - subtitle2: { - fontSize: customTheme.typography.pxToRem(14), - fontWeight: 500, - }, - body1: { - fontSize: customTheme.typography.pxToRem(14), - }, - body2: { - fontSize: customTheme.typography.pxToRem(14), - fontWeight: 400, - }, - caption: { - fontSize: customTheme.typography.pxToRem(12), - fontWeight: 400, - }, - }, - shape: { - borderRadius: 8, - }, - shadows: [ - 'none', - ...(mode === 'dark' - ? 'hsla(220, 30%, 5%, 0.7) 0px 4px 16px 0px, hsla(220, 25%, 10%, 0.8) 0px 8px 16px -5px' - : 'hsla(220, 30%, 5%, 0.07) 0px 4px 16px 0px, hsla(220, 25%, 10%, 0.07) 0px 8px 16px -5px'), - ] as Shadows, -}); + contrastText: brand[50], + ...(mode === 'dark' && { + contrastText: brand[50], + light: brand[300], + main: brand[400], + dark: brand[700], + }), + }, + info: { + light: brand[100], + main: brand[300], + dark: brand[600], + contrastText: gray[50], + ...(mode === 'dark' && { + contrastText: brand[300], + light: brand[500], + main: brand[700], + dark: brand[900], + }), + }, + warning: { + light: orange[300], + main: orange[400], + dark: orange[800], + ...(mode === 'dark' && { + light: orange[400], + main: orange[500], + dark: orange[700], + }), + }, + error: { + light: red[300], + main: red[400], + dark: red[800], + ...(mode === 'dark' && { + light: red[400], + main: red[500], + dark: red[700], + }), + }, + success: { + light: green[300], + main: green[400], + dark: green[800], + ...(mode === 'dark' && { + light: green[400], + main: green[500], + dark: green[700], + }), + }, + grey: { + ...gray, + }, + divider: mode === 'dark' ? alpha(gray[700], 0.6) : alpha(gray[300], 0.4), + background: { + default: 'hsl(0, 0%, 99%)', + paper: 'hsl(220, 35%, 97%)', + ...(mode === 'dark' && { default: gray[900], paper: 'hsl(220, 30%, 7%)' }), + }, + text: { + primary: gray[800], + secondary: gray[600], + warning: orange[400], + ...(mode === 'dark' && { primary: 'hsl(0, 0%, 100%)', secondary: gray[400] }), + }, + action: { + hover: alpha(gray[200], 0.2), + selected: `${alpha(gray[200], 0.3)}`, + ...(mode === 'dark' && { + hover: alpha(gray[600], 0.2), + selected: alpha(gray[600], 0.3), + }), + }, + }, + typography: { + fontFamily: ['"Inter", "sans-serif"'].join(','), + h1: { + fontSize: defaultTheme.typography.pxToRem(48), + fontWeight: 600, + lineHeight: 1.2, + letterSpacing: -0.5, + }, + h2: { + fontSize: defaultTheme.typography.pxToRem(36), + fontWeight: 600, + lineHeight: 1.2, + }, + h3: { + fontSize: defaultTheme.typography.pxToRem(30), + lineHeight: 1.2, + }, + h4: { + fontSize: defaultTheme.typography.pxToRem(24), + fontWeight: 600, + lineHeight: 1.5, + }, + h5: { + fontSize: defaultTheme.typography.pxToRem(20), + fontWeight: 600, + }, + h6: { + fontSize: defaultTheme.typography.pxToRem(18), + fontWeight: 600, + }, + subtitle1: { + fontSize: defaultTheme.typography.pxToRem(18), + }, + subtitle2: { + fontSize: defaultTheme.typography.pxToRem(14), + fontWeight: 500, + }, + body1: { + fontSize: defaultTheme.typography.pxToRem(14), + }, + body2: { + fontSize: defaultTheme.typography.pxToRem(14), + fontWeight: 400, + }, + caption: { + fontSize: defaultTheme.typography.pxToRem(12), + fontWeight: 400, + }, + }, + shape: { + borderRadius: 8, + }, + shadows: customShadows, + }; +}; diff --git a/docs/data/material/getting-started/templates/checkout/Checkout.js b/docs/data/material/getting-started/templates/checkout/Checkout.js index 167615fc6a807d..04e198cc97fa91 100644 --- a/docs/data/material/getting-started/templates/checkout/Checkout.js +++ b/docs/data/material/getting-started/templates/checkout/Checkout.js @@ -1,79 +1,26 @@ import * as React from 'react'; -import PropTypes from 'prop-types'; - import Box from '@mui/material/Box'; import Button from '@mui/material/Button'; import Card from '@mui/material/Card'; import CardContent from '@mui/material/CardContent'; import CssBaseline from '@mui/material/CssBaseline'; -import Grid from '@mui/material/Grid'; +import Grid from '@mui/material/Grid2'; import Stack from '@mui/material/Stack'; import Step from '@mui/material/Step'; import StepLabel from '@mui/material/StepLabel'; import Stepper from '@mui/material/Stepper'; -import ToggleButton from '@mui/material/ToggleButton'; -import ToggleButtonGroup from '@mui/material/ToggleButtonGroup'; import Typography from '@mui/material/Typography'; - import { createTheme, ThemeProvider } from '@mui/material/styles'; - -import ArrowBackRoundedIcon from '@mui/icons-material/ArrowBackRounded'; -import AutoAwesomeRoundedIcon from '@mui/icons-material/AutoAwesomeRounded'; import ChevronLeftRoundedIcon from '@mui/icons-material/ChevronLeftRounded'; import ChevronRightRoundedIcon from '@mui/icons-material/ChevronRightRounded'; - -import AddressForm from './AddressForm'; +import AddressForm from './components/AddressForm'; import getCheckoutTheme from './theme/getCheckoutTheme'; -import Info from './Info'; -import InfoMobile from './InfoMobile'; -import PaymentForm from './PaymentForm'; -import Review from './Review'; -import ToggleColorMode from './ToggleColorMode'; -import SitemarkIcon from './SitemarkIcon'; - -function ToggleCustomTheme({ showCustomTheme, toggleCustomTheme }) { - return ( - <Box - sx={{ - display: 'flex', - flexDirection: 'column', - alignItems: 'center', - width: '100dvw', - position: 'fixed', - bottom: 24, - }} - > - <ToggleButtonGroup - color="primary" - exclusive - value={showCustomTheme} - onChange={toggleCustomTheme} - aria-label="Toggle design language" - sx={{ - backgroundColor: 'background.default', - '& .Mui-selected': { - pointerEvents: 'none', - }, - }} - > - <ToggleButton value> - <AutoAwesomeRoundedIcon sx={{ fontSize: '20px', mr: 1 }} /> - Custom theme - </ToggleButton> - <ToggleButton data-screenshot="toggle-default-theme" value={false}> - Material Design 2 - </ToggleButton> - </ToggleButtonGroup> - </Box> - ); -} - -ToggleCustomTheme.propTypes = { - showCustomTheme: PropTypes.shape({ - valueOf: PropTypes.func.isRequired, - }).isRequired, - toggleCustomTheme: PropTypes.func.isRequired, -}; +import Info from './components/Info'; +import InfoMobile from './components/InfoMobile'; +import PaymentForm from './components/PaymentForm'; +import Review from './components/Review'; +import SitemarkIcon from './components/SitemarkIcon'; +import TemplateFrame from './TemplateFrame'; const steps = ['Shipping address', 'Payment details', 'Review your order']; function getStepContent(step) { @@ -124,257 +71,218 @@ export default function Checkout() { setActiveStep(activeStep - 1); }; return ( - <ThemeProvider theme={showCustomTheme ? checkoutTheme : defaultTheme}> - <CssBaseline /> - <Grid container sx={{ height: { xs: '100%', sm: '100dvh' } }}> - <Grid - item - xs={12} - sm={5} - lg={4} - sx={{ - display: { xs: 'none', md: 'flex' }, - flexDirection: 'column', - backgroundColor: 'background.paper', - borderRight: { sm: 'none', md: '1px solid' }, - borderColor: { sm: 'none', md: 'divider' }, - alignItems: 'start', - pt: 4, - px: 10, - gap: 4, - }} - > - <Box sx={{ display: 'flex', alignItems: 'end', height: 150 }}> - <Button - startIcon={<ArrowBackRoundedIcon />} - component="a" - href="/material-ui/getting-started/templates/" - sx={{ ml: '-8px' }} - > - Back to - <SitemarkIcon /> - </Button> - </Box> - <Box + <TemplateFrame + toggleCustomTheme={toggleCustomTheme} + showCustomTheme={showCustomTheme} + mode={mode} + toggleColorMode={toggleColorMode} + > + <ThemeProvider theme={showCustomTheme ? checkoutTheme : defaultTheme}> + <CssBaseline enableColorScheme /> + <Grid container sx={{ height: { xs: '100%', sm: '100dvh' } }}> + <Grid + size={{ xs: 12, sm: 5, lg: 4 }} sx={{ - display: 'flex', + display: { xs: 'none', md: 'flex' }, flexDirection: 'column', - flexGrow: 1, - width: '100%', - maxWidth: 500, + backgroundColor: 'background.paper', + borderRight: { sm: 'none', md: '1px solid' }, + borderColor: { sm: 'none', md: 'divider' }, + alignItems: 'start', + pt: 16, + px: 10, + gap: 4, }} > - <Info totalPrice={activeStep >= 2 ? '$144.97' : '$134.98'} /> - </Box> - </Grid> - <Grid - item - sm={12} - md={7} - lg={8} - sx={{ - display: 'flex', - flexDirection: 'column', - maxWidth: '100%', - width: '100%', - backgroundColor: { xs: 'transparent', sm: 'background.default' }, - alignItems: 'start', - pt: { xs: 2, sm: 4 }, - px: { xs: 2, sm: 10 }, - gap: { xs: 4, md: 8 }, - }} - > - <Box + <SitemarkIcon /> + <Box + sx={{ + display: 'flex', + flexDirection: 'column', + flexGrow: 1, + width: '100%', + maxWidth: 500, + }} + > + <Info totalPrice={activeStep >= 2 ? '$144.97' : '$134.98'} /> + </Box> + </Grid> + <Grid + size={{ sm: 12, md: 7, lg: 8 }} sx={{ display: 'flex', - justifyContent: { sm: 'space-between', md: 'flex-end' }, - alignItems: 'center', + flexDirection: 'column', + maxWidth: '100%', width: '100%', - maxWidth: { sm: '100%', md: 600 }, + backgroundColor: { xs: 'transparent', sm: 'background.default' }, + alignItems: 'start', + pt: { xs: 6, sm: 16 }, + px: { xs: 2, sm: 10 }, + gap: { xs: 4, md: 8 }, }} > <Box sx={{ - display: { xs: 'flex', md: 'none' }, - flexDirection: 'row', + display: 'flex', + justifyContent: { sm: 'space-between', md: 'flex-end' }, + alignItems: 'center', width: '100%', - justifyContent: 'space-between', + maxWidth: { sm: '100%', md: 600 }, }} > - <Button - startIcon={<ArrowBackRoundedIcon />} - component="a" - href="/material-ui/getting-started/templates/" - sx={{ alignSelf: 'start' }} + <Box + sx={{ + display: { xs: 'none', md: 'flex' }, + flexDirection: 'column', + justifyContent: 'space-between', + alignItems: 'flex-end', + flexGrow: 1, + }} > - Back to - <SitemarkIcon /> - </Button> - <ToggleColorMode mode={mode} toggleColorMode={toggleColorMode} /> + <Stepper + id="desktop-stepper" + activeStep={activeStep} + sx={{ width: '100%', height: 40 }} + > + {steps.map((label) => ( + <Step + sx={{ ':first-child': { pl: 0 }, ':last-child': { pr: 0 } }} + key={label} + > + <StepLabel>{label}</StepLabel> + </Step> + ))} + </Stepper> + </Box> </Box> + <Card sx={{ display: { xs: 'flex', md: 'none' }, width: '100%' }}> + <CardContent + sx={{ + display: 'flex', + width: '100%', + alignItems: 'center', + justifyContent: 'space-between', + }} + > + <div> + <Typography variant="subtitle2" gutterBottom> + Selected products + </Typography> + <Typography variant="body1"> + {activeStep >= 2 ? '$144.97' : '$134.98'} + </Typography> + </div> + <InfoMobile totalPrice={activeStep >= 2 ? '$144.97' : '$134.98'} /> + </CardContent> + </Card> <Box sx={{ - display: { xs: 'none', md: 'flex' }, + display: 'flex', flexDirection: 'column', - justifyContent: 'space-between', - alignItems: 'flex-end', flexGrow: 1, - height: 150, + width: '100%', + maxWidth: { sm: '100%', md: 600 }, + maxHeight: '720px', + gap: { xs: 5, md: 'none' }, }} > - <ToggleColorMode - data-screenshot="toggle-mode" - mode={mode} - toggleColorMode={toggleColorMode} - /> <Stepper - id="desktop-stepper" + id="mobile-stepper" activeStep={activeStep} - sx={{ width: '100%', height: 40 }} + alternativeLabel + sx={{ display: { sm: 'flex', md: 'none' } }} > {steps.map((label) => ( <Step - sx={{ ':first-child': { pl: 0 }, ':last-child': { pr: 0 } }} + sx={{ + ':first-child': { pl: 0 }, + ':last-child': { pr: 0 }, + '& .MuiStepConnector-root': { top: { xs: 6, sm: 12 } }, + }} key={label} > - <StepLabel>{label}</StepLabel> + <StepLabel + sx={{ '.MuiStepLabel-labelContainer': { maxWidth: '70px' } }} + > + {label} + </StepLabel> </Step> ))} </Stepper> - </Box> - </Box> - <Card sx={{ display: { xs: 'flex', md: 'none' }, width: '100%' }}> - <CardContent - sx={{ - display: 'flex', - width: '100%', - alignItems: 'center', - justifyContent: 'space-between', - ':last-child': { pb: 2 }, - }} - > - <div> - <Typography variant="subtitle2" gutterBottom> - Selected products - </Typography> - <Typography variant="body1"> - {activeStep >= 2 ? '$144.97' : '$134.98'} - </Typography> - </div> - <InfoMobile totalPrice={activeStep >= 2 ? '$144.97' : '$134.98'} /> - </CardContent> - </Card> - <Box - sx={{ - display: 'flex', - flexDirection: 'column', - flexGrow: 1, - width: '100%', - maxWidth: { sm: '100%', md: 600 }, - maxHeight: '720px', - gap: { xs: 5, md: 'none' }, - }} - > - <Stepper - id="mobile-stepper" - activeStep={activeStep} - alternativeLabel - sx={{ display: { sm: 'flex', md: 'none' } }} - > - {steps.map((label) => ( - <Step - sx={{ - ':first-child': { pl: 0 }, - ':last-child': { pr: 0 }, - '& .MuiStepConnector-root': { top: { xs: 6, sm: 12 } }, - }} - key={label} - > - <StepLabel - sx={{ '.MuiStepLabel-labelContainer': { maxWidth: '70px' } }} + {activeStep === steps.length ? ( + <Stack spacing={2} useFlexGap> + <Typography variant="h1">📦</Typography> + <Typography variant="h5">Thank you for your order!</Typography> + <Typography variant="body1" sx={{ color: 'text.secondary' }}> + Your order number is + <strong> #140396</strong>. We have emailed your order + confirmation and will update you once its shipped. + </Typography> + <Button + variant="contained" + sx={{ alignSelf: 'start', width: { xs: '100%', sm: 'auto' } }} > - {label} - </StepLabel> - </Step> - ))} - </Stepper> - {activeStep === steps.length ? ( - <Stack spacing={2} useFlexGap> - <Typography variant="h1">📦</Typography> - <Typography variant="h5">Thank you for your order!</Typography> - <Typography variant="body1" sx={{ color: 'text.secondary' }}> - Your order number is - <strong> #140396</strong>. We have emailed your order - confirmation and will update you once its shipped. - </Typography> - <Button - variant="contained" - sx={{ alignSelf: 'start', width: { xs: '100%', sm: 'auto' } }} - > - Go to my orders - </Button> - </Stack> - ) : ( - <React.Fragment> - {getStepContent(activeStep)} - <Box - sx={[ - { - display: 'flex', - flexDirection: { xs: 'column-reverse', sm: 'row' }, - alignItems: 'end', - flexGrow: 1, - gap: 1, - pb: { xs: 12, sm: 0 }, - mt: { xs: 2, sm: 0 }, - mb: '60px', - }, - activeStep !== 0 - ? { justifyContent: 'space-between' } - : { justifyContent: 'flex-end' }, - ]} - > - {activeStep !== 0 && ( - <Button - startIcon={<ChevronLeftRoundedIcon />} - onClick={handleBack} - variant="text" - sx={{ display: { xs: 'none', sm: 'flex' } }} - > - Previous - </Button> - )} + Go to my orders + </Button> + </Stack> + ) : ( + <React.Fragment> + {getStepContent(activeStep)} + <Box + sx={[ + { + display: 'flex', + flexDirection: { xs: 'column-reverse', sm: 'row' }, + alignItems: 'end', + flexGrow: 1, + gap: 1, + pb: { xs: 12, sm: 0 }, + mt: { xs: 2, sm: 0 }, + mb: '60px', + }, + activeStep !== 0 + ? { justifyContent: 'space-between' } + : { justifyContent: 'flex-end' }, + ]} + > + {activeStep !== 0 && ( + <Button + startIcon={<ChevronLeftRoundedIcon />} + onClick={handleBack} + variant="text" + sx={{ display: { xs: 'none', sm: 'flex' } }} + > + Previous + </Button> + )} + + {activeStep !== 0 && ( + <Button + startIcon={<ChevronLeftRoundedIcon />} + onClick={handleBack} + variant="outlined" + fullWidth + sx={{ display: { xs: 'flex', sm: 'none' } }} + > + Previous + </Button> + )} - {activeStep !== 0 && ( <Button - startIcon={<ChevronLeftRoundedIcon />} - onClick={handleBack} - variant="outlined" - fullWidth - sx={{ display: { xs: 'flex', sm: 'none' } }} + variant="contained" + endIcon={<ChevronRightRoundedIcon />} + onClick={handleNext} + sx={{ width: { xs: '100%', sm: 'fit-content' } }} > - Previous + {activeStep === steps.length - 1 ? 'Place order' : 'Next'} </Button> - )} - - <Button - variant="contained" - endIcon={<ChevronRightRoundedIcon />} - onClick={handleNext} - sx={{ width: { xs: '100%', sm: 'fit-content' } }} - > - {activeStep === steps.length - 1 ? 'Place order' : 'Next'} - </Button> - </Box> - </React.Fragment> - )} - </Box> + </Box> + </React.Fragment> + )} + </Box> + </Grid> </Grid> - </Grid> - <ToggleCustomTheme - toggleCustomTheme={toggleCustomTheme} - showCustomTheme={showCustomTheme} - /> - </ThemeProvider> + </ThemeProvider> + </TemplateFrame> ); } diff --git a/docs/data/material/getting-started/templates/checkout/Checkout.tsx b/docs/data/material/getting-started/templates/checkout/Checkout.tsx index f5b197354e2383..a50a6a9caaa719 100644 --- a/docs/data/material/getting-started/templates/checkout/Checkout.tsx +++ b/docs/data/material/getting-started/templates/checkout/Checkout.tsx @@ -1,79 +1,27 @@ import * as React from 'react'; - import Box from '@mui/material/Box'; import Button from '@mui/material/Button'; import Card from '@mui/material/Card'; import CardContent from '@mui/material/CardContent'; import CssBaseline from '@mui/material/CssBaseline'; -import Grid from '@mui/material/Grid'; +import Grid from '@mui/material/Grid2'; import Stack from '@mui/material/Stack'; import Step from '@mui/material/Step'; import StepLabel from '@mui/material/StepLabel'; import Stepper from '@mui/material/Stepper'; -import ToggleButton from '@mui/material/ToggleButton'; -import ToggleButtonGroup from '@mui/material/ToggleButtonGroup'; import Typography from '@mui/material/Typography'; - import { createTheme, ThemeProvider, PaletteMode } from '@mui/material/styles'; - -import ArrowBackRoundedIcon from '@mui/icons-material/ArrowBackRounded'; -import AutoAwesomeRoundedIcon from '@mui/icons-material/AutoAwesomeRounded'; import ChevronLeftRoundedIcon from '@mui/icons-material/ChevronLeftRounded'; import ChevronRightRoundedIcon from '@mui/icons-material/ChevronRightRounded'; - -import AddressForm from './AddressForm'; +import AddressForm from './components/AddressForm'; import getCheckoutTheme from './theme/getCheckoutTheme'; -import Info from './Info'; -import InfoMobile from './InfoMobile'; -import PaymentForm from './PaymentForm'; -import Review from './Review'; -import ToggleColorMode from './ToggleColorMode'; -import SitemarkIcon from './SitemarkIcon'; +import Info from './components/Info'; +import InfoMobile from './components/InfoMobile'; +import PaymentForm from './components/PaymentForm'; +import Review from './components/Review'; +import SitemarkIcon from './components/SitemarkIcon'; +import TemplateFrame from './TemplateFrame'; -interface ToggleCustomThemeProps { - showCustomTheme: Boolean; - toggleCustomTheme: () => void; -} - -function ToggleCustomTheme({ - showCustomTheme, - toggleCustomTheme, -}: ToggleCustomThemeProps) { - return ( - <Box - sx={{ - display: 'flex', - flexDirection: 'column', - alignItems: 'center', - width: '100dvw', - position: 'fixed', - bottom: 24, - }} - > - <ToggleButtonGroup - color="primary" - exclusive - value={showCustomTheme} - onChange={toggleCustomTheme} - aria-label="Toggle design language" - sx={{ - backgroundColor: 'background.default', - '& .Mui-selected': { - pointerEvents: 'none', - }, - }} - > - <ToggleButton value> - <AutoAwesomeRoundedIcon sx={{ fontSize: '20px', mr: 1 }} /> - Custom theme - </ToggleButton> - <ToggleButton data-screenshot="toggle-default-theme" value={false}> - Material Design 2 - </ToggleButton> - </ToggleButtonGroup> - </Box> - ); -} const steps = ['Shipping address', 'Payment details', 'Review your order']; function getStepContent(step: number) { switch (step) { @@ -123,255 +71,217 @@ export default function Checkout() { setActiveStep(activeStep - 1); }; return ( - <ThemeProvider theme={showCustomTheme ? checkoutTheme : defaultTheme}> - <CssBaseline /> - <Grid container sx={{ height: { xs: '100%', sm: '100dvh' } }}> - <Grid - item - xs={12} - sm={5} - lg={4} - sx={{ - display: { xs: 'none', md: 'flex' }, - flexDirection: 'column', - backgroundColor: 'background.paper', - borderRight: { sm: 'none', md: '1px solid' }, - borderColor: { sm: 'none', md: 'divider' }, - alignItems: 'start', - pt: 4, - px: 10, - gap: 4, - }} - > - <Box sx={{ display: 'flex', alignItems: 'end', height: 150 }}> - <Button - startIcon={<ArrowBackRoundedIcon />} - component="a" - href="/material-ui/getting-started/templates/" - sx={{ ml: '-8px' }} - > - Back to - <SitemarkIcon /> - </Button> - </Box> - <Box + <TemplateFrame + toggleCustomTheme={toggleCustomTheme} + showCustomTheme={showCustomTheme} + mode={mode} + toggleColorMode={toggleColorMode} + > + <ThemeProvider theme={showCustomTheme ? checkoutTheme : defaultTheme}> + <CssBaseline enableColorScheme /> + + <Grid container sx={{ height: { xs: '100%', sm: '100dvh' } }}> + <Grid + size={{ xs: 12, sm: 5, lg: 4 }} sx={{ - display: 'flex', + display: { xs: 'none', md: 'flex' }, flexDirection: 'column', - flexGrow: 1, - width: '100%', - maxWidth: 500, + backgroundColor: 'background.paper', + borderRight: { sm: 'none', md: '1px solid' }, + borderColor: { sm: 'none', md: 'divider' }, + alignItems: 'start', + pt: 16, + px: 10, + gap: 4, }} > - <Info totalPrice={activeStep >= 2 ? '$144.97' : '$134.98'} /> - </Box> - </Grid> - <Grid - item - sm={12} - md={7} - lg={8} - sx={{ - display: 'flex', - flexDirection: 'column', - maxWidth: '100%', - width: '100%', - backgroundColor: { xs: 'transparent', sm: 'background.default' }, - alignItems: 'start', - pt: { xs: 2, sm: 4 }, - px: { xs: 2, sm: 10 }, - gap: { xs: 4, md: 8 }, - }} - > - <Box + <SitemarkIcon /> + <Box + sx={{ + display: 'flex', + flexDirection: 'column', + flexGrow: 1, + width: '100%', + maxWidth: 500, + }} + > + <Info totalPrice={activeStep >= 2 ? '$144.97' : '$134.98'} /> + </Box> + </Grid> + <Grid + size={{ sm: 12, md: 7, lg: 8 }} sx={{ display: 'flex', - justifyContent: { sm: 'space-between', md: 'flex-end' }, - alignItems: 'center', + flexDirection: 'column', + maxWidth: '100%', width: '100%', - maxWidth: { sm: '100%', md: 600 }, + backgroundColor: { xs: 'transparent', sm: 'background.default' }, + alignItems: 'start', + pt: { xs: 6, sm: 16 }, + px: { xs: 2, sm: 10 }, + gap: { xs: 4, md: 8 }, }} > <Box sx={{ - display: { xs: 'flex', md: 'none' }, - flexDirection: 'row', + display: 'flex', + justifyContent: { sm: 'space-between', md: 'flex-end' }, + alignItems: 'center', width: '100%', - justifyContent: 'space-between', + maxWidth: { sm: '100%', md: 600 }, }} > - <Button - startIcon={<ArrowBackRoundedIcon />} - component="a" - href="/material-ui/getting-started/templates/" - sx={{ alignSelf: 'start' }} + <Box + sx={{ + display: { xs: 'none', md: 'flex' }, + flexDirection: 'column', + justifyContent: 'space-between', + alignItems: 'flex-end', + flexGrow: 1, + }} > - Back to - <SitemarkIcon /> - </Button> - <ToggleColorMode mode={mode} toggleColorMode={toggleColorMode} /> + <Stepper + id="desktop-stepper" + activeStep={activeStep} + sx={{ width: '100%', height: 40 }} + > + {steps.map((label) => ( + <Step + sx={{ ':first-child': { pl: 0 }, ':last-child': { pr: 0 } }} + key={label} + > + <StepLabel>{label}</StepLabel> + </Step> + ))} + </Stepper> + </Box> </Box> + <Card sx={{ display: { xs: 'flex', md: 'none' }, width: '100%' }}> + <CardContent + sx={{ + display: 'flex', + width: '100%', + alignItems: 'center', + justifyContent: 'space-between', + }} + > + <div> + <Typography variant="subtitle2" gutterBottom> + Selected products + </Typography> + <Typography variant="body1"> + {activeStep >= 2 ? '$144.97' : '$134.98'} + </Typography> + </div> + <InfoMobile totalPrice={activeStep >= 2 ? '$144.97' : '$134.98'} /> + </CardContent> + </Card> <Box sx={{ - display: { xs: 'none', md: 'flex' }, + display: 'flex', flexDirection: 'column', - justifyContent: 'space-between', - alignItems: 'flex-end', flexGrow: 1, - height: 150, + width: '100%', + maxWidth: { sm: '100%', md: 600 }, + maxHeight: '720px', + gap: { xs: 5, md: 'none' }, }} > - <ToggleColorMode - data-screenshot="toggle-mode" - mode={mode} - toggleColorMode={toggleColorMode} - /> <Stepper - id="desktop-stepper" + id="mobile-stepper" activeStep={activeStep} - sx={{ width: '100%', height: 40 }} + alternativeLabel + sx={{ display: { sm: 'flex', md: 'none' } }} > {steps.map((label) => ( <Step - sx={{ ':first-child': { pl: 0 }, ':last-child': { pr: 0 } }} + sx={{ + ':first-child': { pl: 0 }, + ':last-child': { pr: 0 }, + '& .MuiStepConnector-root': { top: { xs: 6, sm: 12 } }, + }} key={label} > - <StepLabel>{label}</StepLabel> + <StepLabel + sx={{ '.MuiStepLabel-labelContainer': { maxWidth: '70px' } }} + > + {label} + </StepLabel> </Step> ))} </Stepper> - </Box> - </Box> - <Card sx={{ display: { xs: 'flex', md: 'none' }, width: '100%' }}> - <CardContent - sx={{ - display: 'flex', - width: '100%', - alignItems: 'center', - justifyContent: 'space-between', - ':last-child': { pb: 2 }, - }} - > - <div> - <Typography variant="subtitle2" gutterBottom> - Selected products - </Typography> - <Typography variant="body1"> - {activeStep >= 2 ? '$144.97' : '$134.98'} - </Typography> - </div> - <InfoMobile totalPrice={activeStep >= 2 ? '$144.97' : '$134.98'} /> - </CardContent> - </Card> - <Box - sx={{ - display: 'flex', - flexDirection: 'column', - flexGrow: 1, - width: '100%', - maxWidth: { sm: '100%', md: 600 }, - maxHeight: '720px', - gap: { xs: 5, md: 'none' }, - }} - > - <Stepper - id="mobile-stepper" - activeStep={activeStep} - alternativeLabel - sx={{ display: { sm: 'flex', md: 'none' } }} - > - {steps.map((label) => ( - <Step - sx={{ - ':first-child': { pl: 0 }, - ':last-child': { pr: 0 }, - '& .MuiStepConnector-root': { top: { xs: 6, sm: 12 } }, - }} - key={label} - > - <StepLabel - sx={{ '.MuiStepLabel-labelContainer': { maxWidth: '70px' } }} - > - {label} - </StepLabel> - </Step> - ))} - </Stepper> - {activeStep === steps.length ? ( - <Stack spacing={2} useFlexGap> - <Typography variant="h1">📦</Typography> - <Typography variant="h5">Thank you for your order!</Typography> - <Typography variant="body1" sx={{ color: 'text.secondary' }}> - Your order number is - <strong> #140396</strong>. We have emailed your order - confirmation and will update you once its shipped. - </Typography> - <Button - variant="contained" - sx={{ alignSelf: 'start', width: { xs: '100%', sm: 'auto' } }} - > - Go to my orders - </Button> - </Stack> - ) : ( - <React.Fragment> - {getStepContent(activeStep)} - <Box - sx={[ - { - display: 'flex', - flexDirection: { xs: 'column-reverse', sm: 'row' }, - alignItems: 'end', - flexGrow: 1, - gap: 1, - pb: { xs: 12, sm: 0 }, - mt: { xs: 2, sm: 0 }, - mb: '60px', - }, - activeStep !== 0 - ? { justifyContent: 'space-between' } - : { justifyContent: 'flex-end' }, - ]} - > - {activeStep !== 0 && ( - <Button - startIcon={<ChevronLeftRoundedIcon />} - onClick={handleBack} - variant="text" - sx={{ display: { xs: 'none', sm: 'flex' } }} - > - Previous - </Button> - )} - {activeStep !== 0 && ( - <Button - startIcon={<ChevronLeftRoundedIcon />} - onClick={handleBack} - variant="outlined" - fullWidth - sx={{ display: { xs: 'flex', sm: 'none' } }} - > - Previous - </Button> - )} + {activeStep === steps.length ? ( + <Stack spacing={2} useFlexGap> + <Typography variant="h1">📦</Typography> + <Typography variant="h5">Thank you for your order!</Typography> + <Typography variant="body1" sx={{ color: 'text.secondary' }}> + Your order number is + <strong> #140396</strong>. We have emailed your order + confirmation and will update you once its shipped. + </Typography> <Button variant="contained" - endIcon={<ChevronRightRoundedIcon />} - onClick={handleNext} - sx={{ width: { xs: '100%', sm: 'fit-content' } }} + sx={{ alignSelf: 'start', width: { xs: '100%', sm: 'auto' } }} > - {activeStep === steps.length - 1 ? 'Place order' : 'Next'} + Go to my orders </Button> - </Box> - </React.Fragment> - )} - </Box> + </Stack> + ) : ( + <React.Fragment> + {getStepContent(activeStep)} + <Box + sx={[ + { + display: 'flex', + flexDirection: { xs: 'column-reverse', sm: 'row' }, + alignItems: 'end', + flexGrow: 1, + gap: 1, + pb: { xs: 12, sm: 0 }, + mt: { xs: 2, sm: 0 }, + mb: '60px', + }, + activeStep !== 0 + ? { justifyContent: 'space-between' } + : { justifyContent: 'flex-end' }, + ]} + > + {activeStep !== 0 && ( + <Button + startIcon={<ChevronLeftRoundedIcon />} + onClick={handleBack} + variant="text" + sx={{ display: { xs: 'none', sm: 'flex' } }} + > + Previous + </Button> + )} + {activeStep !== 0 && ( + <Button + startIcon={<ChevronLeftRoundedIcon />} + onClick={handleBack} + variant="outlined" + fullWidth + sx={{ display: { xs: 'flex', sm: 'none' } }} + > + Previous + </Button> + )} + <Button + variant="contained" + endIcon={<ChevronRightRoundedIcon />} + onClick={handleNext} + sx={{ width: { xs: '100%', sm: 'fit-content' } }} + > + {activeStep === steps.length - 1 ? 'Place order' : 'Next'} + </Button> + </Box> + </React.Fragment> + )} + </Box> + </Grid> </Grid> - </Grid> - <ToggleCustomTheme - toggleCustomTheme={toggleCustomTheme} - showCustomTheme={showCustomTheme} - /> - </ThemeProvider> + </ThemeProvider> + </TemplateFrame> ); } diff --git a/docs/data/material/getting-started/templates/checkout/README.md b/docs/data/material/getting-started/templates/checkout/README.md index 1e23cde07e4e70..9b6fb03b6cce10 100644 --- a/docs/data/material/getting-started/templates/checkout/README.md +++ b/docs/data/material/getting-started/templates/checkout/README.md @@ -4,7 +4,7 @@ <!-- #default-branch-switch --> -1. Copy the files into your project, or one of the [example projects](https://github.com/mui/material-ui/tree/next/examples). +1. Copy the files into your project, or one of the [example projects](https://github.com/mui/material-ui/tree/master/examples). 2. Make sure your project has the required dependencies: @mui/material, @emotion/styled, @emotion/react. 3. Import and use the `Checkout` component. @@ -12,4 +12,4 @@ <!-- #default-branch-switch --> -View the demo at https://next.mui.com/material-ui/getting-started/templates/checkout/. +View the demo at https://mui.com/material-ui/getting-started/templates/checkout/. diff --git a/docs/data/material/getting-started/templates/checkout/TemplateFrame.js b/docs/data/material/getting-started/templates/checkout/TemplateFrame.js new file mode 100644 index 00000000000000..6f1b11ec4dff4a --- /dev/null +++ b/docs/data/material/getting-started/templates/checkout/TemplateFrame.js @@ -0,0 +1,113 @@ +import * as React from 'react'; +import PropTypes from 'prop-types'; +import { createTheme, ThemeProvider, styled } from '@mui/material/styles'; +import Select from '@mui/material/Select'; +import MenuItem from '@mui/material/MenuItem'; +import FormControl from '@mui/material/FormControl'; +import Button from '@mui/material/Button'; +import IconButton from '@mui/material/IconButton'; +import Box from '@mui/material/Box'; +import AppBar from '@mui/material/AppBar'; +import Toolbar from '@mui/material/Toolbar'; +import ArrowBackRoundedIcon from '@mui/icons-material/ArrowBackRounded'; +import ToggleColorMode from './components/ToggleColorMode'; +import getCheckoutTheme from './theme/getCheckoutTheme'; + +const StyledAppBar = styled(AppBar)(({ theme }) => ({ + position: 'relative', + display: 'flex', + alignItems: 'center', + justifyContent: 'space-between', + flexShrink: 0, + borderBottom: '1px solid', + borderColor: theme.palette.divider, + backgroundColor: theme.palette.background.paper, + boxShadow: 'none', + backgroundImage: 'none', + zIndex: theme.zIndex.drawer + 1, + flex: '0 0 auto', +})); + +function TemplateFrame({ + showCustomTheme, + toggleCustomTheme, + mode, + toggleColorMode, + children, +}) { + const handleChange = (event) => { + toggleCustomTheme(event.target.value === 'custom'); + }; + const checkoutTheme = createTheme(getCheckoutTheme(mode)); + + return ( + <ThemeProvider theme={checkoutTheme}> + <Box sx={{ height: '100dvh', display: 'flex', flexDirection: 'column' }}> + <StyledAppBar> + <Toolbar + variant="dense" + disableGutters + sx={{ + display: 'flex', + justifyContent: 'space-between', + width: '100%', + p: '8px 12px', + }} + > + <Button + variant="text" + size="small" + aria-label="Back to templates" + startIcon={<ArrowBackRoundedIcon />} + component="a" + href="/material-ui/getting-started/templates/" + sx={{ display: { xs: 'none', sm: 'flex' } }} + > + Back to templates + </Button> + <IconButton + size="small" + aria-label="Back to templates" + component="a" + href="/material-ui/getting-started/templates/" + sx={{ display: { xs: 'auto', sm: 'none' } }} + > + <ArrowBackRoundedIcon /> + </IconButton> + <Box sx={{ display: 'flex', gap: 1 }}> + <FormControl variant="outlined" sx={{ minWidth: 180 }}> + <Select + size="small" + labelId="theme-select-label" + id="theme-select" + value={showCustomTheme ? 'custom' : 'material'} + onChange={handleChange} + label="Design Language" + > + <MenuItem value="custom">Custom Theme</MenuItem> + <MenuItem value="material">Material Design 2</MenuItem> + </Select> + </FormControl> + <ToggleColorMode + data-screenshot="toggle-mode" + mode={mode} + toggleColorMode={toggleColorMode} + /> + </Box> + </Toolbar> + </StyledAppBar> + <Box sx={{ flex: '1 1', overflow: 'auto' }}>{children}</Box> + </Box> + </ThemeProvider> + ); +} + +TemplateFrame.propTypes = { + children: PropTypes.node, + mode: PropTypes.oneOf(['dark', 'light']).isRequired, + showCustomTheme: PropTypes.bool.isRequired, + toggleColorMode: PropTypes.func.isRequired, + toggleCustomTheme: PropTypes.func.isRequired, +}; + +export default TemplateFrame; diff --git a/docs/data/material/getting-started/templates/checkout/TemplateFrame.tsx b/docs/data/material/getting-started/templates/checkout/TemplateFrame.tsx new file mode 100644 index 00000000000000..82a7e99505c3f0 --- /dev/null +++ b/docs/data/material/getting-started/templates/checkout/TemplateFrame.tsx @@ -0,0 +1,115 @@ +import * as React from 'react'; +import { + createTheme, + ThemeProvider, + PaletteMode, + styled, +} from '@mui/material/styles'; +import Select, { SelectChangeEvent } from '@mui/material/Select'; +import MenuItem from '@mui/material/MenuItem'; +import FormControl from '@mui/material/FormControl'; +import Button from '@mui/material/Button'; +import IconButton from '@mui/material/IconButton'; +import Box from '@mui/material/Box'; +import AppBar from '@mui/material/AppBar'; +import Toolbar from '@mui/material/Toolbar'; +import ArrowBackRoundedIcon from '@mui/icons-material/ArrowBackRounded'; +import ToggleColorMode from './components/ToggleColorMode'; +import getCheckoutTheme from './theme/getCheckoutTheme'; + +const StyledAppBar = styled(AppBar)(({ theme }) => ({ + position: 'relative', + display: 'flex', + alignItems: 'center', + justifyContent: 'space-between', + flexShrink: 0, + borderBottom: '1px solid', + borderColor: theme.palette.divider, + backgroundColor: theme.palette.background.paper, + boxShadow: 'none', + backgroundImage: 'none', + zIndex: theme.zIndex.drawer + 1, + flex: '0 0 auto', +})); + +interface TemplateFrameProps { + showCustomTheme: boolean; + toggleCustomTheme: (theme: boolean) => void; + mode: PaletteMode; + toggleColorMode: () => void; + children: React.ReactNode; +} + +export default function TemplateFrame({ + showCustomTheme, + toggleCustomTheme, + mode, + toggleColorMode, + children, +}: TemplateFrameProps) { + const handleChange = (event: SelectChangeEvent) => { + toggleCustomTheme(event.target.value === 'custom'); + }; + const checkoutTheme = createTheme(getCheckoutTheme(mode)); + + return ( + <ThemeProvider theme={checkoutTheme}> + <Box sx={{ height: '100dvh', display: 'flex', flexDirection: 'column' }}> + <StyledAppBar> + <Toolbar + variant="dense" + disableGutters + sx={{ + display: 'flex', + justifyContent: 'space-between', + width: '100%', + p: '8px 12px', + }} + > + <Button + variant="text" + size="small" + aria-label="Back to templates" + startIcon={<ArrowBackRoundedIcon />} + component="a" + href="/material-ui/getting-started/templates/" + sx={{ display: { xs: 'none', sm: 'flex' } }} + > + Back to templates + </Button> + <IconButton + size="small" + aria-label="Back to templates" + component="a" + href="/material-ui/getting-started/templates/" + sx={{ display: { xs: 'auto', sm: 'none' } }} + > + <ArrowBackRoundedIcon /> + </IconButton> + <Box sx={{ display: 'flex', gap: 1 }}> + <FormControl variant="outlined" sx={{ minWidth: 180 }}> + <Select + size="small" + labelId="theme-select-label" + id="theme-select" + value={showCustomTheme ? 'custom' : 'material'} + onChange={handleChange} + label="Design Language" + > + <MenuItem value="custom">Custom Theme</MenuItem> + <MenuItem value="material">Material Design 2</MenuItem> + </Select> + </FormControl> + <ToggleColorMode + data-screenshot="toggle-mode" + mode={mode} + toggleColorMode={toggleColorMode} + /> + </Box> + </Toolbar> + </StyledAppBar> + <Box sx={{ flex: '1 1', overflow: 'auto' }}>{children}</Box> + </Box> + </ThemeProvider> + ); +} diff --git a/docs/data/material/getting-started/templates/checkout/AddressForm.js b/docs/data/material/getting-started/templates/checkout/components/AddressForm.js similarity index 100% rename from docs/data/material/getting-started/templates/checkout/AddressForm.js rename to docs/data/material/getting-started/templates/checkout/components/AddressForm.js diff --git a/docs/data/material/getting-started/templates/checkout/AddressForm.tsx b/docs/data/material/getting-started/templates/checkout/components/AddressForm.tsx similarity index 100% rename from docs/data/material/getting-started/templates/checkout/AddressForm.tsx rename to docs/data/material/getting-started/templates/checkout/components/AddressForm.tsx diff --git a/docs/data/material/getting-started/templates/checkout/Info.js b/docs/data/material/getting-started/templates/checkout/components/Info.js similarity index 100% rename from docs/data/material/getting-started/templates/checkout/Info.js rename to docs/data/material/getting-started/templates/checkout/components/Info.js diff --git a/docs/data/material/getting-started/templates/checkout/Info.tsx b/docs/data/material/getting-started/templates/checkout/components/Info.tsx similarity index 100% rename from docs/data/material/getting-started/templates/checkout/Info.tsx rename to docs/data/material/getting-started/templates/checkout/components/Info.tsx diff --git a/docs/data/material/getting-started/templates/checkout/InfoMobile.js b/docs/data/material/getting-started/templates/checkout/components/InfoMobile.js similarity index 100% rename from docs/data/material/getting-started/templates/checkout/InfoMobile.js rename to docs/data/material/getting-started/templates/checkout/components/InfoMobile.js diff --git a/docs/data/material/getting-started/templates/checkout/InfoMobile.tsx b/docs/data/material/getting-started/templates/checkout/components/InfoMobile.tsx similarity index 100% rename from docs/data/material/getting-started/templates/checkout/InfoMobile.tsx rename to docs/data/material/getting-started/templates/checkout/components/InfoMobile.tsx diff --git a/docs/data/material/getting-started/templates/checkout/PaymentForm.js b/docs/data/material/getting-started/templates/checkout/components/PaymentForm.js similarity index 100% rename from docs/data/material/getting-started/templates/checkout/PaymentForm.js rename to docs/data/material/getting-started/templates/checkout/components/PaymentForm.js diff --git a/docs/data/material/getting-started/templates/checkout/PaymentForm.tsx b/docs/data/material/getting-started/templates/checkout/components/PaymentForm.tsx similarity index 100% rename from docs/data/material/getting-started/templates/checkout/PaymentForm.tsx rename to docs/data/material/getting-started/templates/checkout/components/PaymentForm.tsx diff --git a/docs/data/material/getting-started/templates/checkout/Review.js b/docs/data/material/getting-started/templates/checkout/components/Review.js similarity index 100% rename from docs/data/material/getting-started/templates/checkout/Review.js rename to docs/data/material/getting-started/templates/checkout/components/Review.js diff --git a/docs/data/material/getting-started/templates/checkout/Review.tsx b/docs/data/material/getting-started/templates/checkout/components/Review.tsx similarity index 100% rename from docs/data/material/getting-started/templates/checkout/Review.tsx rename to docs/data/material/getting-started/templates/checkout/components/Review.tsx diff --git a/docs/data/material/getting-started/templates/checkout/SitemarkIcon.js b/docs/data/material/getting-started/templates/checkout/components/SitemarkIcon.js similarity index 98% rename from docs/data/material/getting-started/templates/checkout/SitemarkIcon.js rename to docs/data/material/getting-started/templates/checkout/components/SitemarkIcon.js index f313221f7f9a3c..f46802704ac3af 100644 --- a/docs/data/material/getting-started/templates/checkout/SitemarkIcon.js +++ b/docs/data/material/getting-started/templates/checkout/components/SitemarkIcon.js @@ -3,7 +3,7 @@ import SvgIcon from '@mui/material/SvgIcon'; export default function SitemarkIcon() { return ( - <SvgIcon sx={{ height: 21, width: 100, ml: 1 }}> + <SvgIcon sx={{ height: 40, width: 100 }}> <svg width={86} height={19} diff --git a/docs/data/material/getting-started/templates/checkout/SitemarkIcon.tsx b/docs/data/material/getting-started/templates/checkout/components/SitemarkIcon.tsx similarity index 98% rename from docs/data/material/getting-started/templates/checkout/SitemarkIcon.tsx rename to docs/data/material/getting-started/templates/checkout/components/SitemarkIcon.tsx index f313221f7f9a3c..f46802704ac3af 100644 --- a/docs/data/material/getting-started/templates/checkout/SitemarkIcon.tsx +++ b/docs/data/material/getting-started/templates/checkout/components/SitemarkIcon.tsx @@ -3,7 +3,7 @@ import SvgIcon from '@mui/material/SvgIcon'; export default function SitemarkIcon() { return ( - <SvgIcon sx={{ height: 21, width: 100, ml: 1 }}> + <SvgIcon sx={{ height: 40, width: 100 }}> <svg width={86} height={19} diff --git a/docs/data/material/getting-started/templates/checkout/ToggleColorMode.js b/docs/data/material/getting-started/templates/checkout/components/ToggleColorMode.js similarity index 97% rename from docs/data/material/getting-started/templates/checkout/ToggleColorMode.js rename to docs/data/material/getting-started/templates/checkout/components/ToggleColorMode.js index ef5bf33fef968f..f81783268a2c52 100644 --- a/docs/data/material/getting-started/templates/checkout/ToggleColorMode.js +++ b/docs/data/material/getting-started/templates/checkout/components/ToggleColorMode.js @@ -11,6 +11,7 @@ function ToggleColorMode({ mode, toggleColorMode, ...props }) { <IconButton onClick={toggleColorMode} color="primary" + size="small" aria-label="Theme toggle button" {...props} > diff --git a/docs/data/material/getting-started/templates/checkout/ToggleColorMode.tsx b/docs/data/material/getting-started/templates/checkout/components/ToggleColorMode.tsx similarity index 97% rename from docs/data/material/getting-started/templates/checkout/ToggleColorMode.tsx rename to docs/data/material/getting-started/templates/checkout/components/ToggleColorMode.tsx index 313d805383fdff..bbeb12f1f1e6ca 100644 --- a/docs/data/material/getting-started/templates/checkout/ToggleColorMode.tsx +++ b/docs/data/material/getting-started/templates/checkout/components/ToggleColorMode.tsx @@ -20,6 +20,7 @@ export default function ToggleColorMode({ <IconButton onClick={toggleColorMode} color="primary" + size="small" aria-label="Theme toggle button" {...props} > diff --git a/docs/data/material/getting-started/templates/checkout/theme/themePrimitives.js b/docs/data/material/getting-started/templates/checkout/theme/themePrimitives.js index 1894b11b326f0c..625400640eef43 100644 --- a/docs/data/material/getting-started/templates/checkout/theme/themePrimitives.js +++ b/docs/data/material/getting-started/templates/checkout/theme/themePrimitives.js @@ -1,6 +1,8 @@ import { createTheme, alpha } from '@mui/material/styles'; -const customTheme = createTheme(); +const defaultTheme = createTheme(); + +const customShadows = [...defaultTheme.shadows]; export const brand = { 50: 'hsl(210, 100%, 95%)', @@ -67,143 +69,148 @@ export const red = { 900: 'hsl(0, 93%, 6%)', }; -export const getDesignTokens = (mode) => ({ - palette: { - mode, - primary: { - light: brand[200], - main: brand[400], - dark: brand[700], - contrastText: brand[50], - ...(mode === 'dark' && { - contrastText: brand[50], - light: brand[300], +export const getDesignTokens = (mode) => { + customShadows[1] = + mode === 'dark' + ? 'hsla(220, 30%, 5%, 0.7) 0px 4px 16px 0px, hsla(220, 25%, 10%, 0.8) 0px 8px 16px -5px' + : 'hsla(220, 30%, 5%, 0.07) 0px 4px 16px 0px, hsla(220, 25%, 10%, 0.07) 0px 8px 16px -5px'; + + return { + palette: { + mode, + primary: { + light: brand[200], main: brand[400], dark: brand[700], - }), - }, - info: { - light: brand[100], - main: brand[300], - dark: brand[600], - contrastText: gray[50], - ...(mode === 'dark' && { - contrastText: brand[300], - light: brand[500], - main: brand[700], - dark: brand[900], - }), - }, - warning: { - light: orange[300], - main: orange[400], - dark: orange[800], - ...(mode === 'dark' && { - light: orange[400], - main: orange[500], - dark: orange[700], - }), - }, - error: { - light: red[300], - main: red[400], - dark: red[800], - ...(mode === 'dark' && { - light: red[400], - main: red[500], - dark: red[700], - }), - }, - success: { - light: green[300], - main: green[400], - dark: green[800], - ...(mode === 'dark' && { - light: green[400], - main: green[500], - dark: green[700], - }), - }, - grey: { - ...gray, - }, - divider: mode === 'dark' ? alpha(gray[700], 0.6) : alpha(gray[300], 0.4), - background: { - default: 'hsl(0, 0%, 99%)', - paper: 'hsl(220, 35%, 97%)', - ...(mode === 'dark' && { default: gray[900], paper: 'hsl(220, 30%, 7%)' }), - }, - text: { - primary: gray[800], - secondary: gray[600], - warning: orange[400], - ...(mode === 'dark' && { primary: 'hsl(0, 0%, 100%)', secondary: gray[400] }), - }, - action: { - hover: alpha(gray[200], 0.2), - selected: `${alpha(gray[200], 0.3)}`, - ...(mode === 'dark' && { - hover: alpha(gray[600], 0.2), - selected: alpha(gray[600], 0.3), - }), - }, - }, - typography: { - fontFamily: ['"Inter", "sans-serif"'].join(','), - h1: { - fontSize: customTheme.typography.pxToRem(48), - fontWeight: 600, - lineHeight: 1.2, - letterSpacing: -0.5, - }, - h2: { - fontSize: customTheme.typography.pxToRem(36), - fontWeight: 600, - lineHeight: 1.2, - }, - h3: { - fontSize: customTheme.typography.pxToRem(30), - lineHeight: 1.2, - }, - h4: { - fontSize: customTheme.typography.pxToRem(24), - fontWeight: 600, - lineHeight: 1.5, - }, - h5: { - fontSize: customTheme.typography.pxToRem(20), - fontWeight: 600, - }, - h6: { - fontSize: customTheme.typography.pxToRem(18), - fontWeight: 600, - }, - subtitle1: { - fontSize: customTheme.typography.pxToRem(18), - }, - subtitle2: { - fontSize: customTheme.typography.pxToRem(14), - fontWeight: 500, - }, - body1: { - fontSize: customTheme.typography.pxToRem(14), - }, - body2: { - fontSize: customTheme.typography.pxToRem(14), - fontWeight: 400, - }, - caption: { - fontSize: customTheme.typography.pxToRem(12), - fontWeight: 400, - }, - }, - shape: { - borderRadius: 8, - }, - shadows: [ - 'none', - ...(mode === 'dark' - ? 'hsla(220, 30%, 5%, 0.7) 0px 4px 16px 0px, hsla(220, 25%, 10%, 0.8) 0px 8px 16px -5px' - : 'hsla(220, 30%, 5%, 0.07) 0px 4px 16px 0px, hsla(220, 25%, 10%, 0.07) 0px 8px 16px -5px'), - ], -}); + contrastText: brand[50], + ...(mode === 'dark' && { + contrastText: brand[50], + light: brand[300], + main: brand[400], + dark: brand[700], + }), + }, + info: { + light: brand[100], + main: brand[300], + dark: brand[600], + contrastText: gray[50], + ...(mode === 'dark' && { + contrastText: brand[300], + light: brand[500], + main: brand[700], + dark: brand[900], + }), + }, + warning: { + light: orange[300], + main: orange[400], + dark: orange[800], + ...(mode === 'dark' && { + light: orange[400], + main: orange[500], + dark: orange[700], + }), + }, + error: { + light: red[300], + main: red[400], + dark: red[800], + ...(mode === 'dark' && { + light: red[400], + main: red[500], + dark: red[700], + }), + }, + success: { + light: green[300], + main: green[400], + dark: green[800], + ...(mode === 'dark' && { + light: green[400], + main: green[500], + dark: green[700], + }), + }, + grey: { + ...gray, + }, + divider: mode === 'dark' ? alpha(gray[700], 0.6) : alpha(gray[300], 0.4), + background: { + default: 'hsl(0, 0%, 99%)', + paper: 'hsl(220, 35%, 97%)', + ...(mode === 'dark' && { default: gray[900], paper: 'hsl(220, 30%, 7%)' }), + }, + text: { + primary: gray[800], + secondary: gray[600], + warning: orange[400], + ...(mode === 'dark' && { + primary: 'hsl(0, 0%, 100%)', + secondary: gray[400], + }), + }, + action: { + hover: alpha(gray[200], 0.2), + selected: `${alpha(gray[200], 0.3)}`, + ...(mode === 'dark' && { + hover: alpha(gray[600], 0.2), + selected: alpha(gray[600], 0.3), + }), + }, + }, + typography: { + fontFamily: ['"Inter", "sans-serif"'].join(','), + h1: { + fontSize: defaultTheme.typography.pxToRem(48), + fontWeight: 600, + lineHeight: 1.2, + letterSpacing: -0.5, + }, + h2: { + fontSize: defaultTheme.typography.pxToRem(36), + fontWeight: 600, + lineHeight: 1.2, + }, + h3: { + fontSize: defaultTheme.typography.pxToRem(30), + lineHeight: 1.2, + }, + h4: { + fontSize: defaultTheme.typography.pxToRem(24), + fontWeight: 600, + lineHeight: 1.5, + }, + h5: { + fontSize: defaultTheme.typography.pxToRem(20), + fontWeight: 600, + }, + h6: { + fontSize: defaultTheme.typography.pxToRem(18), + fontWeight: 600, + }, + subtitle1: { + fontSize: defaultTheme.typography.pxToRem(18), + }, + subtitle2: { + fontSize: defaultTheme.typography.pxToRem(14), + fontWeight: 500, + }, + body1: { + fontSize: defaultTheme.typography.pxToRem(14), + }, + body2: { + fontSize: defaultTheme.typography.pxToRem(14), + fontWeight: 400, + }, + caption: { + fontSize: defaultTheme.typography.pxToRem(12), + fontWeight: 400, + }, + }, + shape: { + borderRadius: 8, + }, + shadows: customShadows, + }; +}; diff --git a/docs/data/material/getting-started/templates/checkout/theme/themePrimitives.ts b/docs/data/material/getting-started/templates/checkout/theme/themePrimitives.ts index 09df769bb6687d..41b517b5294fad 100644 --- a/docs/data/material/getting-started/templates/checkout/theme/themePrimitives.ts +++ b/docs/data/material/getting-started/templates/checkout/theme/themePrimitives.ts @@ -1,4 +1,4 @@ -import { createTheme, alpha, Shadows, PaletteMode } from '@mui/material/styles'; +import { createTheme, alpha, PaletteMode, Shadows } from '@mui/material/styles'; declare module '@mui/material/Paper' { interface PaperPropsVariantOverrides { @@ -22,7 +22,9 @@ declare module '@mui/material/styles/createPalette' { interface PaletteColor extends ColorRange {} } -const customTheme = createTheme(); +const defaultTheme = createTheme(); + +const customShadows: Shadows = [...defaultTheme.shadows]; export const brand = { 50: 'hsl(210, 100%, 95%)', @@ -89,143 +91,145 @@ export const red = { 900: 'hsl(0, 93%, 6%)', }; -export const getDesignTokens = (mode: PaletteMode) => ({ - palette: { - mode, - primary: { - light: brand[200], - main: brand[400], - dark: brand[700], - contrastText: brand[50], - ...(mode === 'dark' && { - contrastText: brand[50], - light: brand[300], +export const getDesignTokens = (mode: PaletteMode) => { + customShadows[1] = + mode === 'dark' + ? 'hsla(220, 30%, 5%, 0.7) 0px 4px 16px 0px, hsla(220, 25%, 10%, 0.8) 0px 8px 16px -5px' + : 'hsla(220, 30%, 5%, 0.07) 0px 4px 16px 0px, hsla(220, 25%, 10%, 0.07) 0px 8px 16px -5px'; + + return { + palette: { + mode, + primary: { + light: brand[200], main: brand[400], dark: brand[700], - }), - }, - info: { - light: brand[100], - main: brand[300], - dark: brand[600], - contrastText: gray[50], - ...(mode === 'dark' && { - contrastText: brand[300], - light: brand[500], - main: brand[700], - dark: brand[900], - }), - }, - warning: { - light: orange[300], - main: orange[400], - dark: orange[800], - ...(mode === 'dark' && { - light: orange[400], - main: orange[500], - dark: orange[700], - }), - }, - error: { - light: red[300], - main: red[400], - dark: red[800], - ...(mode === 'dark' && { - light: red[400], - main: red[500], - dark: red[700], - }), - }, - success: { - light: green[300], - main: green[400], - dark: green[800], - ...(mode === 'dark' && { - light: green[400], - main: green[500], - dark: green[700], - }), - }, - grey: { - ...gray, - }, - divider: mode === 'dark' ? alpha(gray[700], 0.6) : alpha(gray[300], 0.4), - background: { - default: 'hsl(0, 0%, 99%)', - paper: 'hsl(220, 35%, 97%)', - ...(mode === 'dark' && { default: gray[900], paper: 'hsl(220, 30%, 7%)' }), - }, - text: { - primary: gray[800], - secondary: gray[600], - warning: orange[400], - ...(mode === 'dark' && { primary: 'hsl(0, 0%, 100%)', secondary: gray[400] }), - }, - action: { - hover: alpha(gray[200], 0.2), - selected: `${alpha(gray[200], 0.3)}`, - ...(mode === 'dark' && { - hover: alpha(gray[600], 0.2), - selected: alpha(gray[600], 0.3), - }), - }, - }, - typography: { - fontFamily: ['"Inter", "sans-serif"'].join(','), - h1: { - fontSize: customTheme.typography.pxToRem(48), - fontWeight: 600, - lineHeight: 1.2, - letterSpacing: -0.5, - }, - h2: { - fontSize: customTheme.typography.pxToRem(36), - fontWeight: 600, - lineHeight: 1.2, - }, - h3: { - fontSize: customTheme.typography.pxToRem(30), - lineHeight: 1.2, - }, - h4: { - fontSize: customTheme.typography.pxToRem(24), - fontWeight: 600, - lineHeight: 1.5, - }, - h5: { - fontSize: customTheme.typography.pxToRem(20), - fontWeight: 600, - }, - h6: { - fontSize: customTheme.typography.pxToRem(18), - fontWeight: 600, - }, - subtitle1: { - fontSize: customTheme.typography.pxToRem(18), - }, - subtitle2: { - fontSize: customTheme.typography.pxToRem(14), - fontWeight: 500, - }, - body1: { - fontSize: customTheme.typography.pxToRem(14), - }, - body2: { - fontSize: customTheme.typography.pxToRem(14), - fontWeight: 400, - }, - caption: { - fontSize: customTheme.typography.pxToRem(12), - fontWeight: 400, - }, - }, - shape: { - borderRadius: 8, - }, - shadows: [ - 'none', - ...(mode === 'dark' - ? 'hsla(220, 30%, 5%, 0.7) 0px 4px 16px 0px, hsla(220, 25%, 10%, 0.8) 0px 8px 16px -5px' - : 'hsla(220, 30%, 5%, 0.07) 0px 4px 16px 0px, hsla(220, 25%, 10%, 0.07) 0px 8px 16px -5px'), - ] as Shadows, -}); + contrastText: brand[50], + ...(mode === 'dark' && { + contrastText: brand[50], + light: brand[300], + main: brand[400], + dark: brand[700], + }), + }, + info: { + light: brand[100], + main: brand[300], + dark: brand[600], + contrastText: gray[50], + ...(mode === 'dark' && { + contrastText: brand[300], + light: brand[500], + main: brand[700], + dark: brand[900], + }), + }, + warning: { + light: orange[300], + main: orange[400], + dark: orange[800], + ...(mode === 'dark' && { + light: orange[400], + main: orange[500], + dark: orange[700], + }), + }, + error: { + light: red[300], + main: red[400], + dark: red[800], + ...(mode === 'dark' && { + light: red[400], + main: red[500], + dark: red[700], + }), + }, + success: { + light: green[300], + main: green[400], + dark: green[800], + ...(mode === 'dark' && { + light: green[400], + main: green[500], + dark: green[700], + }), + }, + grey: { + ...gray, + }, + divider: mode === 'dark' ? alpha(gray[700], 0.6) : alpha(gray[300], 0.4), + background: { + default: 'hsl(0, 0%, 99%)', + paper: 'hsl(220, 35%, 97%)', + ...(mode === 'dark' && { default: gray[900], paper: 'hsl(220, 30%, 7%)' }), + }, + text: { + primary: gray[800], + secondary: gray[600], + warning: orange[400], + ...(mode === 'dark' && { primary: 'hsl(0, 0%, 100%)', secondary: gray[400] }), + }, + action: { + hover: alpha(gray[200], 0.2), + selected: `${alpha(gray[200], 0.3)}`, + ...(mode === 'dark' && { + hover: alpha(gray[600], 0.2), + selected: alpha(gray[600], 0.3), + }), + }, + }, + typography: { + fontFamily: ['"Inter", "sans-serif"'].join(','), + h1: { + fontSize: defaultTheme.typography.pxToRem(48), + fontWeight: 600, + lineHeight: 1.2, + letterSpacing: -0.5, + }, + h2: { + fontSize: defaultTheme.typography.pxToRem(36), + fontWeight: 600, + lineHeight: 1.2, + }, + h3: { + fontSize: defaultTheme.typography.pxToRem(30), + lineHeight: 1.2, + }, + h4: { + fontSize: defaultTheme.typography.pxToRem(24), + fontWeight: 600, + lineHeight: 1.5, + }, + h5: { + fontSize: defaultTheme.typography.pxToRem(20), + fontWeight: 600, + }, + h6: { + fontSize: defaultTheme.typography.pxToRem(18), + fontWeight: 600, + }, + subtitle1: { + fontSize: defaultTheme.typography.pxToRem(18), + }, + subtitle2: { + fontSize: defaultTheme.typography.pxToRem(14), + fontWeight: 500, + }, + body1: { + fontSize: defaultTheme.typography.pxToRem(14), + }, + body2: { + fontSize: defaultTheme.typography.pxToRem(14), + fontWeight: 400, + }, + caption: { + fontSize: defaultTheme.typography.pxToRem(12), + fontWeight: 400, + }, + }, + shape: { + borderRadius: 8, + }, + shadows: customShadows, + }; +}; diff --git a/docs/data/material/getting-started/templates/dashboard/Dashboard.js b/docs/data/material/getting-started/templates/dashboard/Dashboard.js index 9a69a9832f5454..ee7881bb20a2e1 100644 --- a/docs/data/material/getting-started/templates/dashboard/Dashboard.js +++ b/docs/data/material/getting-started/templates/dashboard/Dashboard.js @@ -4,11 +4,11 @@ import CssBaseline from '@mui/material/CssBaseline'; import Box from '@mui/material/Box'; import Stack from '@mui/material/Stack'; import getDashboardTheme from './theme/getDashboardTheme'; -import ToggleCustomTheme from './internals/components/ToggleCustomTheme'; -import Navbar from './components/Navbar'; +import AppNavbar from './components/AppNavbar'; import Header from './components/Header'; import MainGrid from './components/MainGrid'; import SideMenu from './components/SideMenu'; +import TemplateFrame from './TemplateFrame'; export default function Dashboard() { const [mode, setMode] = React.useState('light'); @@ -41,41 +41,41 @@ export default function Dashboard() { }; return ( - <ThemeProvider theme={showCustomTheme ? dashboardTheme : defaultTheme}> - <CssBaseline /> - <Box sx={{ display: 'flex' }}> - <SideMenu /> - <Navbar mode={mode} toggleColorMode={toggleColorMode} /> - {/* Main content */} - <Box - component="main" - sx={(theme) => ({ - position: { sm: 'relative', md: '' }, - top: { sm: '48px', md: '0' }, - height: { sm: 'calc(100vh - 48px)', md: '100vh' }, - flexGrow: 1, - pt: 2, - backgroundColor: alpha(theme.palette.background.default, 1), - overflow: 'auto', - })} - > - <Stack - spacing={2} - sx={{ - alignItems: 'center', - mx: 3, - pb: 10, - }} + <TemplateFrame + toggleCustomTheme={toggleCustomTheme} + showCustomTheme={showCustomTheme} + mode={mode} + toggleColorMode={toggleColorMode} + > + <ThemeProvider theme={showCustomTheme ? dashboardTheme : defaultTheme}> + <CssBaseline enableColorScheme /> + <Box sx={{ display: 'flex' }}> + <SideMenu /> + <AppNavbar /> + {/* Main content */} + <Box + component="main" + sx={(theme) => ({ + flexGrow: 1, + backgroundColor: alpha(theme.palette.background.default, 1), + overflow: 'auto', + })} > - <Header mode={mode} toggleColorMode={toggleColorMode} /> - <MainGrid /> - </Stack> + <Stack + spacing={2} + sx={{ + alignItems: 'center', + mx: 3, + pb: 10, + mt: { xs: 8, md: 0 }, + }} + > + <Header /> + <MainGrid /> + </Stack> + </Box> </Box> - <ToggleCustomTheme - showCustomTheme={showCustomTheme} - toggleCustomTheme={toggleCustomTheme} - /> - </Box> - </ThemeProvider> + </ThemeProvider> + </TemplateFrame> ); } diff --git a/docs/data/material/getting-started/templates/dashboard/Dashboard.tsx b/docs/data/material/getting-started/templates/dashboard/Dashboard.tsx index 226029e6c84cb6..f8f6608011af97 100644 --- a/docs/data/material/getting-started/templates/dashboard/Dashboard.tsx +++ b/docs/data/material/getting-started/templates/dashboard/Dashboard.tsx @@ -9,11 +9,11 @@ import CssBaseline from '@mui/material/CssBaseline'; import Box from '@mui/material/Box'; import Stack from '@mui/material/Stack'; import getDashboardTheme from './theme/getDashboardTheme'; -import ToggleCustomTheme from './internals/components/ToggleCustomTheme'; -import Navbar from './components/Navbar'; +import AppNavbar from './components/AppNavbar'; import Header from './components/Header'; import MainGrid from './components/MainGrid'; import SideMenu from './components/SideMenu'; +import TemplateFrame from './TemplateFrame'; export default function Dashboard() { const [mode, setMode] = React.useState<PaletteMode>('light'); @@ -46,41 +46,41 @@ export default function Dashboard() { }; return ( - <ThemeProvider theme={showCustomTheme ? dashboardTheme : defaultTheme}> - <CssBaseline /> - <Box sx={{ display: 'flex' }}> - <SideMenu /> - <Navbar mode={mode} toggleColorMode={toggleColorMode} /> - {/* Main content */} - <Box - component="main" - sx={(theme) => ({ - position: { sm: 'relative', md: '' }, - top: { sm: '48px', md: '0' }, - height: { sm: 'calc(100vh - 48px)', md: '100vh' }, - flexGrow: 1, - pt: 2, - backgroundColor: alpha(theme.palette.background.default, 1), - overflow: 'auto', - })} - > - <Stack - spacing={2} - sx={{ - alignItems: 'center', - mx: 3, - pb: 10, - }} + <TemplateFrame + toggleCustomTheme={toggleCustomTheme} + showCustomTheme={showCustomTheme} + mode={mode} + toggleColorMode={toggleColorMode} + > + <ThemeProvider theme={showCustomTheme ? dashboardTheme : defaultTheme}> + <CssBaseline enableColorScheme /> + <Box sx={{ display: 'flex' }}> + <SideMenu /> + <AppNavbar /> + {/* Main content */} + <Box + component="main" + sx={(theme) => ({ + flexGrow: 1, + backgroundColor: alpha(theme.palette.background.default, 1), + overflow: 'auto', + })} > - <Header mode={mode} toggleColorMode={toggleColorMode} /> - <MainGrid /> - </Stack> + <Stack + spacing={2} + sx={{ + alignItems: 'center', + mx: 3, + pb: 10, + mt: { xs: 8, md: 0 }, + }} + > + <Header /> + <MainGrid /> + </Stack> + </Box> </Box> - <ToggleCustomTheme - showCustomTheme={showCustomTheme} - toggleCustomTheme={toggleCustomTheme} - /> - </Box> - </ThemeProvider> + </ThemeProvider> + </TemplateFrame> ); } diff --git a/docs/data/material/getting-started/templates/dashboard/README.md b/docs/data/material/getting-started/templates/dashboard/README.md index 56b0c8c1bbdbf7..3415051ae20be5 100644 --- a/docs/data/material/getting-started/templates/dashboard/README.md +++ b/docs/data/material/getting-started/templates/dashboard/README.md @@ -4,7 +4,7 @@ <!-- #default-branch-switch --> -1. Copy the files into your project, or one of the [example projects](https://github.com/mui/material-ui/tree/next/examples). +1. Copy the files into your project, or one of the [example projects](https://github.com/mui/material-ui/tree/master/examples). 2. Make sure your project has the required dependencies: @mui/material, @mui/icons-material, @emotion/styled, @emotion/react, @mui/x-charts. 3. Import and use the `Dashboard` component. @@ -12,4 +12,4 @@ <!-- #default-branch-switch --> -View the demo at https://next.mui.com/material-ui/getting-started/templates/dashboard/. +View the demo at https://mui.com/material-ui/getting-started/templates/dashboard/. diff --git a/docs/data/material/getting-started/templates/dashboard/TemplateFrame.js b/docs/data/material/getting-started/templates/dashboard/TemplateFrame.js new file mode 100644 index 00000000000000..d05d218cf84528 --- /dev/null +++ b/docs/data/material/getting-started/templates/dashboard/TemplateFrame.js @@ -0,0 +1,113 @@ +import * as React from 'react'; +import PropTypes from 'prop-types'; +import { createTheme, ThemeProvider, styled } from '@mui/material/styles'; +import Select from '@mui/material/Select'; +import MenuItem from '@mui/material/MenuItem'; +import FormControl from '@mui/material/FormControl'; +import Button from '@mui/material/Button'; +import IconButton from '@mui/material/IconButton'; +import Box from '@mui/material/Box'; +import AppBar from '@mui/material/AppBar'; +import Toolbar from '@mui/material/Toolbar'; +import ArrowBackRoundedIcon from '@mui/icons-material/ArrowBackRounded'; +import ToggleColorMode from './components/ToggleColorMode'; +import getDashboardTheme from './theme/getDashboardTheme'; + +const StyledAppBar = styled(AppBar)(({ theme }) => ({ + position: 'relative', + display: 'flex', + alignItems: 'center', + justifyContent: 'space-between', + flexShrink: 0, + borderBottom: '1px solid', + borderColor: theme.palette.divider, + backgroundColor: theme.palette.background.paper, + boxShadow: 'none', + backgroundImage: 'none', + zIndex: theme.zIndex.drawer + 1, + flex: '0 0 auto', +})); + +function TemplateFrame({ + showCustomTheme, + toggleCustomTheme, + mode, + toggleColorMode, + children, +}) { + const handleChange = (event) => { + toggleCustomTheme(event.target.value === 'custom'); + }; + const dashboardTheme = createTheme(getDashboardTheme(mode)); + + return ( + <ThemeProvider theme={dashboardTheme}> + <Box sx={{ height: '100dvh', display: 'flex', flexDirection: 'column' }}> + <StyledAppBar> + <Toolbar + variant="dense" + disableGutters + sx={{ + display: 'flex', + justifyContent: 'space-between', + width: '100%', + p: '8px 12px', + }} + > + <Button + variant="text" + size="small" + aria-label="Back to templates" + startIcon={<ArrowBackRoundedIcon />} + component="a" + href="/material-ui/getting-started/templates/" + sx={{ display: { xs: 'none', sm: 'flex' } }} + > + Back to templates + </Button> + <IconButton + size="small" + aria-label="Back to templates" + component="a" + href="/material-ui/getting-started/templates/" + sx={{ display: { xs: 'auto', sm: 'none' } }} + > + <ArrowBackRoundedIcon /> + </IconButton> + <Box sx={{ display: 'flex', gap: 1 }}> + <FormControl variant="outlined" sx={{ minWidth: 180 }}> + <Select + size="small" + labelId="theme-select-label" + id="theme-select" + value={showCustomTheme ? 'custom' : 'material'} + onChange={handleChange} + label="Design Language" + > + <MenuItem value="custom">Custom Theme</MenuItem> + <MenuItem value="material">Material Design 2</MenuItem> + </Select> + </FormControl> + <ToggleColorMode + data-screenshot="toggle-mode" + mode={mode} + toggleColorMode={toggleColorMode} + /> + </Box> + </Toolbar> + </StyledAppBar> + <Box sx={{ flex: '1 1', overflow: 'auto' }}>{children}</Box> + </Box> + </ThemeProvider> + ); +} + +TemplateFrame.propTypes = { + children: PropTypes.node, + mode: PropTypes.oneOf(['dark', 'light']).isRequired, + showCustomTheme: PropTypes.bool.isRequired, + toggleColorMode: PropTypes.func.isRequired, + toggleCustomTheme: PropTypes.func.isRequired, +}; + +export default TemplateFrame; diff --git a/docs/data/material/getting-started/templates/dashboard/TemplateFrame.tsx b/docs/data/material/getting-started/templates/dashboard/TemplateFrame.tsx new file mode 100644 index 00000000000000..98dbfa60d964ea --- /dev/null +++ b/docs/data/material/getting-started/templates/dashboard/TemplateFrame.tsx @@ -0,0 +1,115 @@ +import * as React from 'react'; +import { + createTheme, + ThemeProvider, + PaletteMode, + styled, +} from '@mui/material/styles'; +import Select, { SelectChangeEvent } from '@mui/material/Select'; +import MenuItem from '@mui/material/MenuItem'; +import FormControl from '@mui/material/FormControl'; +import Button from '@mui/material/Button'; +import IconButton from '@mui/material/IconButton'; +import Box from '@mui/material/Box'; +import AppBar from '@mui/material/AppBar'; +import Toolbar from '@mui/material/Toolbar'; +import ArrowBackRoundedIcon from '@mui/icons-material/ArrowBackRounded'; +import ToggleColorMode from './components/ToggleColorMode'; +import getDashboardTheme from './theme/getDashboardTheme'; + +const StyledAppBar = styled(AppBar)(({ theme }) => ({ + position: 'relative', + display: 'flex', + alignItems: 'center', + justifyContent: 'space-between', + flexShrink: 0, + borderBottom: '1px solid', + borderColor: theme.palette.divider, + backgroundColor: theme.palette.background.paper, + boxShadow: 'none', + backgroundImage: 'none', + zIndex: theme.zIndex.drawer + 1, + flex: '0 0 auto', +})); + +interface TemplateFrameProps { + showCustomTheme: boolean; + toggleCustomTheme: (theme: boolean) => void; + mode: PaletteMode; + toggleColorMode: () => void; + children: React.ReactNode; +} + +export default function TemplateFrame({ + showCustomTheme, + toggleCustomTheme, + mode, + toggleColorMode, + children, +}: TemplateFrameProps) { + const handleChange = (event: SelectChangeEvent) => { + toggleCustomTheme(event.target.value === 'custom'); + }; + const dashboardTheme = createTheme(getDashboardTheme(mode)); + + return ( + <ThemeProvider theme={dashboardTheme}> + <Box sx={{ height: '100dvh', display: 'flex', flexDirection: 'column' }}> + <StyledAppBar> + <Toolbar + variant="dense" + disableGutters + sx={{ + display: 'flex', + justifyContent: 'space-between', + width: '100%', + p: '8px 12px', + }} + > + <Button + variant="text" + size="small" + aria-label="Back to templates" + startIcon={<ArrowBackRoundedIcon />} + component="a" + href="/material-ui/getting-started/templates/" + sx={{ display: { xs: 'none', sm: 'flex' } }} + > + Back to templates + </Button> + <IconButton + size="small" + aria-label="Back to templates" + component="a" + href="/material-ui/getting-started/templates/" + sx={{ display: { xs: 'auto', sm: 'none' } }} + > + <ArrowBackRoundedIcon /> + </IconButton> + <Box sx={{ display: 'flex', gap: 1 }}> + <FormControl variant="outlined" sx={{ minWidth: 180 }}> + <Select + size="small" + labelId="theme-select-label" + id="theme-select" + value={showCustomTheme ? 'custom' : 'material'} + onChange={handleChange} + label="Design Language" + > + <MenuItem value="custom">Custom Theme</MenuItem> + <MenuItem value="material">Material Design 2</MenuItem> + </Select> + </FormControl> + <ToggleColorMode + data-screenshot="toggle-mode" + mode={mode} + toggleColorMode={toggleColorMode} + /> + </Box> + </Toolbar> + </StyledAppBar> + <Box sx={{ flex: '1 1', overflow: 'auto' }}>{children}</Box> + </Box> + </ThemeProvider> + ); +} diff --git a/docs/data/material/getting-started/templates/dashboard/components/Navbar.js b/docs/data/material/getting-started/templates/dashboard/components/AppNavbar.js similarity index 86% rename from docs/data/material/getting-started/templates/dashboard/components/Navbar.js rename to docs/data/material/getting-started/templates/dashboard/components/AppNavbar.js index dfab11101bec26..2474562084b48f 100644 --- a/docs/data/material/getting-started/templates/dashboard/components/Navbar.js +++ b/docs/data/material/getting-started/templates/dashboard/components/AppNavbar.js @@ -1,5 +1,4 @@ import * as React from 'react'; -import PropTypes from 'prop-types'; import { styled } from '@mui/material/styles'; import AppBar from '@mui/material/AppBar'; import Box from '@mui/material/Box'; @@ -28,7 +27,7 @@ const Toolbar = styled(MuiToolbar)({ }, }); -function Navbar({ mode, toggleColorMode }) { +export default function AppNavbar() { const [open, setOpen] = React.useState(false); const toggleDrawer = (newOpen) => () => { @@ -45,6 +44,7 @@ function Navbar({ mode, toggleColorMode }) { backgroundImage: 'none', borderBottom: '1px solid', borderColor: 'divider', + top: '56px', }} > <Toolbar variant="regular"> @@ -66,25 +66,13 @@ function Navbar({ mode, toggleColorMode }) { <MenuButton aria-label="menu" onClick={toggleDrawer(true)}> <MenuRoundedIcon /> </MenuButton> - <SideMenuMobile - open={open} - toggleDrawer={toggleDrawer} - mode={mode} - toggleColorMode={toggleColorMode} - /> + <SideMenuMobile open={open} toggleDrawer={toggleDrawer} /> </Stack> </Toolbar> </AppBar> ); } -Navbar.propTypes = { - mode: PropTypes.oneOf(['dark', 'light']).isRequired, - toggleColorMode: PropTypes.func.isRequired, -}; - -export default Navbar; - export function CustomIcon() { return ( <Box diff --git a/docs/data/material/getting-started/templates/dashboard/components/Navbar.tsx b/docs/data/material/getting-started/templates/dashboard/components/AppNavbar.tsx similarity index 87% rename from docs/data/material/getting-started/templates/dashboard/components/Navbar.tsx rename to docs/data/material/getting-started/templates/dashboard/components/AppNavbar.tsx index b3c1bb18546af6..a217dd40cb856a 100644 --- a/docs/data/material/getting-started/templates/dashboard/components/Navbar.tsx +++ b/docs/data/material/getting-started/templates/dashboard/components/AppNavbar.tsx @@ -1,5 +1,5 @@ import * as React from 'react'; -import { styled, PaletteMode } from '@mui/material/styles'; +import { styled } from '@mui/material/styles'; import AppBar from '@mui/material/AppBar'; import Box from '@mui/material/Box'; import Stack from '@mui/material/Stack'; @@ -11,11 +11,6 @@ import DashboardRoundedIcon from '@mui/icons-material/DashboardRounded'; import SideMenuMobile from './SideMenuMobile'; import MenuButton from './MenuButton'; -interface NavBarProps { - mode: PaletteMode; - toggleColorMode: () => void; -} - const Toolbar = styled(MuiToolbar)({ width: '100%', padding: '12px', @@ -32,7 +27,7 @@ const Toolbar = styled(MuiToolbar)({ }, }); -export default function Navbar({ mode, toggleColorMode }: NavBarProps) { +export default function AppNavbar() { const [open, setOpen] = React.useState(false); const toggleDrawer = (newOpen: boolean) => () => { @@ -49,6 +44,7 @@ export default function Navbar({ mode, toggleColorMode }: NavBarProps) { backgroundImage: 'none', borderBottom: '1px solid', borderColor: 'divider', + top: '56px', }} > <Toolbar variant="regular"> @@ -70,12 +66,7 @@ export default function Navbar({ mode, toggleColorMode }: NavBarProps) { <MenuButton aria-label="menu" onClick={toggleDrawer(true)}> <MenuRoundedIcon /> </MenuButton> - <SideMenuMobile - open={open} - toggleDrawer={toggleDrawer} - mode={mode} - toggleColorMode={toggleColorMode} - /> + <SideMenuMobile open={open} toggleDrawer={toggleDrawer} /> </Stack> </Toolbar> </AppBar> diff --git a/docs/data/material/getting-started/templates/dashboard/components/Header.js b/docs/data/material/getting-started/templates/dashboard/components/Header.js index 872449366fb1ae..a1e3414a32d7d0 100644 --- a/docs/data/material/getting-started/templates/dashboard/components/Header.js +++ b/docs/data/material/getting-started/templates/dashboard/components/Header.js @@ -1,16 +1,13 @@ import * as React from 'react'; -import PropTypes from 'prop-types'; - import Stack from '@mui/material/Stack'; import NotificationsRoundedIcon from '@mui/icons-material/NotificationsRounded'; import CustomDatePicker from './CustomDatePicker'; import NavbarBreadcrumbs from './NavbarBreadcrumbs'; -import ToggleColorMode from './ToggleColorMode'; import MenuButton from './MenuButton'; import Search from './Search'; -function Header({ mode, toggleColorMode }) { +export default function Header() { return ( <Stack direction="row" @@ -20,6 +17,7 @@ function Header({ mode, toggleColorMode }) { alignItems: { xs: 'flex-start', md: 'center' }, justifyContent: 'space-between', maxWidth: { sm: '100%', md: '1700px' }, + pt: 1.5, }} spacing={2} > @@ -30,19 +28,7 @@ function Header({ mode, toggleColorMode }) { <MenuButton showBadge aria-label="Open notifications"> <NotificationsRoundedIcon /> </MenuButton> - <ToggleColorMode - mode={mode} - toggleColorMode={toggleColorMode} - data-screenshot="toggle-mode" - /> </Stack> </Stack> ); } - -Header.propTypes = { - mode: PropTypes.oneOf(['dark', 'light']).isRequired, - toggleColorMode: PropTypes.func.isRequired, -}; - -export default Header; diff --git a/docs/data/material/getting-started/templates/dashboard/components/Header.tsx b/docs/data/material/getting-started/templates/dashboard/components/Header.tsx index 17e8b80cb1c6c7..a1e3414a32d7d0 100644 --- a/docs/data/material/getting-started/templates/dashboard/components/Header.tsx +++ b/docs/data/material/getting-started/templates/dashboard/components/Header.tsx @@ -1,20 +1,13 @@ import * as React from 'react'; -import { PaletteMode } from '@mui/material/styles'; import Stack from '@mui/material/Stack'; import NotificationsRoundedIcon from '@mui/icons-material/NotificationsRounded'; import CustomDatePicker from './CustomDatePicker'; import NavbarBreadcrumbs from './NavbarBreadcrumbs'; -import ToggleColorMode from './ToggleColorMode'; import MenuButton from './MenuButton'; import Search from './Search'; -interface HeaderProps { - mode: PaletteMode; - toggleColorMode: () => void; -} - -export default function Header({ mode, toggleColorMode }: HeaderProps) { +export default function Header() { return ( <Stack direction="row" @@ -24,6 +17,7 @@ export default function Header({ mode, toggleColorMode }: HeaderProps) { alignItems: { xs: 'flex-start', md: 'center' }, justifyContent: 'space-between', maxWidth: { sm: '100%', md: '1700px' }, + pt: 1.5, }} spacing={2} > @@ -34,11 +28,6 @@ export default function Header({ mode, toggleColorMode }: HeaderProps) { <MenuButton showBadge aria-label="Open notifications"> <NotificationsRoundedIcon /> </MenuButton> - <ToggleColorMode - mode={mode} - toggleColorMode={toggleColorMode} - data-screenshot="toggle-mode" - /> </Stack> </Stack> ); diff --git a/docs/data/material/getting-started/templates/dashboard/components/SideMenu.js b/docs/data/material/getting-started/templates/dashboard/components/SideMenu.js index 201e813671251a..62804e6f3e5301 100644 --- a/docs/data/material/getting-started/templates/dashboard/components/SideMenu.js +++ b/docs/data/material/getting-started/templates/dashboard/components/SideMenu.js @@ -17,6 +17,7 @@ const Drawer = styled(MuiDrawer)({ width: drawerWidth, flexShrink: 0, boxSizing: 'border-box', + mt: 10, [`& .${drawerClasses.paper}`]: { width: drawerWidth, boxSizing: 'border-box', @@ -37,6 +38,7 @@ export default function SideMenu() { <Box sx={{ display: 'flex', + mt: '60px', p: 1.5, }} > diff --git a/docs/data/material/getting-started/templates/dashboard/components/SideMenu.tsx b/docs/data/material/getting-started/templates/dashboard/components/SideMenu.tsx index 201e813671251a..62804e6f3e5301 100644 --- a/docs/data/material/getting-started/templates/dashboard/components/SideMenu.tsx +++ b/docs/data/material/getting-started/templates/dashboard/components/SideMenu.tsx @@ -17,6 +17,7 @@ const Drawer = styled(MuiDrawer)({ width: drawerWidth, flexShrink: 0, boxSizing: 'border-box', + mt: 10, [`& .${drawerClasses.paper}`]: { width: drawerWidth, boxSizing: 'border-box', @@ -37,6 +38,7 @@ export default function SideMenu() { <Box sx={{ display: 'flex', + mt: '60px', p: 1.5, }} > diff --git a/docs/data/material/getting-started/templates/dashboard/components/SideMenuMobile.js b/docs/data/material/getting-started/templates/dashboard/components/SideMenuMobile.js index 916abb6f8bdcfe..196357cd9645b5 100644 --- a/docs/data/material/getting-started/templates/dashboard/components/SideMenuMobile.js +++ b/docs/data/material/getting-started/templates/dashboard/components/SideMenuMobile.js @@ -1,6 +1,5 @@ import * as React from 'react'; import PropTypes from 'prop-types'; - import Avatar from '@mui/material/Avatar'; import Button from '@mui/material/Button'; import Divider from '@mui/material/Divider'; @@ -11,11 +10,10 @@ import LogoutRoundedIcon from '@mui/icons-material/LogoutRounded'; import NotificationsRoundedIcon from '@mui/icons-material/NotificationsRounded'; import MenuButton from './MenuButton'; -import ToggleColorMode from './ToggleColorMode'; import MenuContent from './MenuContent'; import CardAlert from './CardAlert'; -function SideMenuMobile({ open, toggleDrawer, mode, toggleColorMode }) { +function SideMenuMobile({ open, toggleDrawer }) { return ( <Drawer anchor="right" @@ -52,7 +50,6 @@ function SideMenuMobile({ open, toggleDrawer, mode, toggleColorMode }) { <MenuButton showBadge> <NotificationsRoundedIcon /> </MenuButton> - <ToggleColorMode mode={mode} toggleColorMode={toggleColorMode} /> </Stack> <Divider /> <Stack sx={{ flexGrow: 1 }}> @@ -71,9 +68,7 @@ function SideMenuMobile({ open, toggleDrawer, mode, toggleColorMode }) { } SideMenuMobile.propTypes = { - mode: PropTypes.oneOf(['dark', 'light']).isRequired, open: PropTypes.bool, - toggleColorMode: PropTypes.func.isRequired, toggleDrawer: PropTypes.func.isRequired, }; diff --git a/docs/data/material/getting-started/templates/dashboard/components/SideMenuMobile.tsx b/docs/data/material/getting-started/templates/dashboard/components/SideMenuMobile.tsx index 3dddd5267e0747..c48c3c04202cc3 100644 --- a/docs/data/material/getting-started/templates/dashboard/components/SideMenuMobile.tsx +++ b/docs/data/material/getting-started/templates/dashboard/components/SideMenuMobile.tsx @@ -1,5 +1,4 @@ import * as React from 'react'; -import { PaletteMode } from '@mui/material/styles'; import Avatar from '@mui/material/Avatar'; import Button from '@mui/material/Button'; import Divider from '@mui/material/Divider'; @@ -10,23 +9,15 @@ import LogoutRoundedIcon from '@mui/icons-material/LogoutRounded'; import NotificationsRoundedIcon from '@mui/icons-material/NotificationsRounded'; import MenuButton from './MenuButton'; -import ToggleColorMode from './ToggleColorMode'; import MenuContent from './MenuContent'; import CardAlert from './CardAlert'; interface SideMenuMobileProps { open: boolean | undefined; toggleDrawer: (newOpen: boolean) => () => void; - mode: PaletteMode; - toggleColorMode: () => void; } -export default function SideMenuMobile({ - open, - toggleDrawer, - mode, - toggleColorMode, -}: SideMenuMobileProps) { +export default function SideMenuMobile({ open, toggleDrawer }: SideMenuMobileProps) { return ( <Drawer anchor="right" @@ -63,7 +54,6 @@ export default function SideMenuMobile({ <MenuButton showBadge> <NotificationsRoundedIcon /> </MenuButton> - <ToggleColorMode mode={mode} toggleColorMode={toggleColorMode} /> </Stack> <Divider /> <Stack sx={{ flexGrow: 1 }}> diff --git a/docs/data/material/getting-started/templates/dashboard/theme/themePrimitives.js b/docs/data/material/getting-started/templates/dashboard/theme/themePrimitives.js index 1894b11b326f0c..625400640eef43 100644 --- a/docs/data/material/getting-started/templates/dashboard/theme/themePrimitives.js +++ b/docs/data/material/getting-started/templates/dashboard/theme/themePrimitives.js @@ -1,6 +1,8 @@ import { createTheme, alpha } from '@mui/material/styles'; -const customTheme = createTheme(); +const defaultTheme = createTheme(); + +const customShadows = [...defaultTheme.shadows]; export const brand = { 50: 'hsl(210, 100%, 95%)', @@ -67,143 +69,148 @@ export const red = { 900: 'hsl(0, 93%, 6%)', }; -export const getDesignTokens = (mode) => ({ - palette: { - mode, - primary: { - light: brand[200], - main: brand[400], - dark: brand[700], - contrastText: brand[50], - ...(mode === 'dark' && { - contrastText: brand[50], - light: brand[300], +export const getDesignTokens = (mode) => { + customShadows[1] = + mode === 'dark' + ? 'hsla(220, 30%, 5%, 0.7) 0px 4px 16px 0px, hsla(220, 25%, 10%, 0.8) 0px 8px 16px -5px' + : 'hsla(220, 30%, 5%, 0.07) 0px 4px 16px 0px, hsla(220, 25%, 10%, 0.07) 0px 8px 16px -5px'; + + return { + palette: { + mode, + primary: { + light: brand[200], main: brand[400], dark: brand[700], - }), - }, - info: { - light: brand[100], - main: brand[300], - dark: brand[600], - contrastText: gray[50], - ...(mode === 'dark' && { - contrastText: brand[300], - light: brand[500], - main: brand[700], - dark: brand[900], - }), - }, - warning: { - light: orange[300], - main: orange[400], - dark: orange[800], - ...(mode === 'dark' && { - light: orange[400], - main: orange[500], - dark: orange[700], - }), - }, - error: { - light: red[300], - main: red[400], - dark: red[800], - ...(mode === 'dark' && { - light: red[400], - main: red[500], - dark: red[700], - }), - }, - success: { - light: green[300], - main: green[400], - dark: green[800], - ...(mode === 'dark' && { - light: green[400], - main: green[500], - dark: green[700], - }), - }, - grey: { - ...gray, - }, - divider: mode === 'dark' ? alpha(gray[700], 0.6) : alpha(gray[300], 0.4), - background: { - default: 'hsl(0, 0%, 99%)', - paper: 'hsl(220, 35%, 97%)', - ...(mode === 'dark' && { default: gray[900], paper: 'hsl(220, 30%, 7%)' }), - }, - text: { - primary: gray[800], - secondary: gray[600], - warning: orange[400], - ...(mode === 'dark' && { primary: 'hsl(0, 0%, 100%)', secondary: gray[400] }), - }, - action: { - hover: alpha(gray[200], 0.2), - selected: `${alpha(gray[200], 0.3)}`, - ...(mode === 'dark' && { - hover: alpha(gray[600], 0.2), - selected: alpha(gray[600], 0.3), - }), - }, - }, - typography: { - fontFamily: ['"Inter", "sans-serif"'].join(','), - h1: { - fontSize: customTheme.typography.pxToRem(48), - fontWeight: 600, - lineHeight: 1.2, - letterSpacing: -0.5, - }, - h2: { - fontSize: customTheme.typography.pxToRem(36), - fontWeight: 600, - lineHeight: 1.2, - }, - h3: { - fontSize: customTheme.typography.pxToRem(30), - lineHeight: 1.2, - }, - h4: { - fontSize: customTheme.typography.pxToRem(24), - fontWeight: 600, - lineHeight: 1.5, - }, - h5: { - fontSize: customTheme.typography.pxToRem(20), - fontWeight: 600, - }, - h6: { - fontSize: customTheme.typography.pxToRem(18), - fontWeight: 600, - }, - subtitle1: { - fontSize: customTheme.typography.pxToRem(18), - }, - subtitle2: { - fontSize: customTheme.typography.pxToRem(14), - fontWeight: 500, - }, - body1: { - fontSize: customTheme.typography.pxToRem(14), - }, - body2: { - fontSize: customTheme.typography.pxToRem(14), - fontWeight: 400, - }, - caption: { - fontSize: customTheme.typography.pxToRem(12), - fontWeight: 400, - }, - }, - shape: { - borderRadius: 8, - }, - shadows: [ - 'none', - ...(mode === 'dark' - ? 'hsla(220, 30%, 5%, 0.7) 0px 4px 16px 0px, hsla(220, 25%, 10%, 0.8) 0px 8px 16px -5px' - : 'hsla(220, 30%, 5%, 0.07) 0px 4px 16px 0px, hsla(220, 25%, 10%, 0.07) 0px 8px 16px -5px'), - ], -}); + contrastText: brand[50], + ...(mode === 'dark' && { + contrastText: brand[50], + light: brand[300], + main: brand[400], + dark: brand[700], + }), + }, + info: { + light: brand[100], + main: brand[300], + dark: brand[600], + contrastText: gray[50], + ...(mode === 'dark' && { + contrastText: brand[300], + light: brand[500], + main: brand[700], + dark: brand[900], + }), + }, + warning: { + light: orange[300], + main: orange[400], + dark: orange[800], + ...(mode === 'dark' && { + light: orange[400], + main: orange[500], + dark: orange[700], + }), + }, + error: { + light: red[300], + main: red[400], + dark: red[800], + ...(mode === 'dark' && { + light: red[400], + main: red[500], + dark: red[700], + }), + }, + success: { + light: green[300], + main: green[400], + dark: green[800], + ...(mode === 'dark' && { + light: green[400], + main: green[500], + dark: green[700], + }), + }, + grey: { + ...gray, + }, + divider: mode === 'dark' ? alpha(gray[700], 0.6) : alpha(gray[300], 0.4), + background: { + default: 'hsl(0, 0%, 99%)', + paper: 'hsl(220, 35%, 97%)', + ...(mode === 'dark' && { default: gray[900], paper: 'hsl(220, 30%, 7%)' }), + }, + text: { + primary: gray[800], + secondary: gray[600], + warning: orange[400], + ...(mode === 'dark' && { + primary: 'hsl(0, 0%, 100%)', + secondary: gray[400], + }), + }, + action: { + hover: alpha(gray[200], 0.2), + selected: `${alpha(gray[200], 0.3)}`, + ...(mode === 'dark' && { + hover: alpha(gray[600], 0.2), + selected: alpha(gray[600], 0.3), + }), + }, + }, + typography: { + fontFamily: ['"Inter", "sans-serif"'].join(','), + h1: { + fontSize: defaultTheme.typography.pxToRem(48), + fontWeight: 600, + lineHeight: 1.2, + letterSpacing: -0.5, + }, + h2: { + fontSize: defaultTheme.typography.pxToRem(36), + fontWeight: 600, + lineHeight: 1.2, + }, + h3: { + fontSize: defaultTheme.typography.pxToRem(30), + lineHeight: 1.2, + }, + h4: { + fontSize: defaultTheme.typography.pxToRem(24), + fontWeight: 600, + lineHeight: 1.5, + }, + h5: { + fontSize: defaultTheme.typography.pxToRem(20), + fontWeight: 600, + }, + h6: { + fontSize: defaultTheme.typography.pxToRem(18), + fontWeight: 600, + }, + subtitle1: { + fontSize: defaultTheme.typography.pxToRem(18), + }, + subtitle2: { + fontSize: defaultTheme.typography.pxToRem(14), + fontWeight: 500, + }, + body1: { + fontSize: defaultTheme.typography.pxToRem(14), + }, + body2: { + fontSize: defaultTheme.typography.pxToRem(14), + fontWeight: 400, + }, + caption: { + fontSize: defaultTheme.typography.pxToRem(12), + fontWeight: 400, + }, + }, + shape: { + borderRadius: 8, + }, + shadows: customShadows, + }; +}; diff --git a/docs/data/material/getting-started/templates/dashboard/theme/themePrimitives.ts b/docs/data/material/getting-started/templates/dashboard/theme/themePrimitives.ts index 09df769bb6687d..41b517b5294fad 100644 --- a/docs/data/material/getting-started/templates/dashboard/theme/themePrimitives.ts +++ b/docs/data/material/getting-started/templates/dashboard/theme/themePrimitives.ts @@ -1,4 +1,4 @@ -import { createTheme, alpha, Shadows, PaletteMode } from '@mui/material/styles'; +import { createTheme, alpha, PaletteMode, Shadows } from '@mui/material/styles'; declare module '@mui/material/Paper' { interface PaperPropsVariantOverrides { @@ -22,7 +22,9 @@ declare module '@mui/material/styles/createPalette' { interface PaletteColor extends ColorRange {} } -const customTheme = createTheme(); +const defaultTheme = createTheme(); + +const customShadows: Shadows = [...defaultTheme.shadows]; export const brand = { 50: 'hsl(210, 100%, 95%)', @@ -89,143 +91,145 @@ export const red = { 900: 'hsl(0, 93%, 6%)', }; -export const getDesignTokens = (mode: PaletteMode) => ({ - palette: { - mode, - primary: { - light: brand[200], - main: brand[400], - dark: brand[700], - contrastText: brand[50], - ...(mode === 'dark' && { - contrastText: brand[50], - light: brand[300], +export const getDesignTokens = (mode: PaletteMode) => { + customShadows[1] = + mode === 'dark' + ? 'hsla(220, 30%, 5%, 0.7) 0px 4px 16px 0px, hsla(220, 25%, 10%, 0.8) 0px 8px 16px -5px' + : 'hsla(220, 30%, 5%, 0.07) 0px 4px 16px 0px, hsla(220, 25%, 10%, 0.07) 0px 8px 16px -5px'; + + return { + palette: { + mode, + primary: { + light: brand[200], main: brand[400], dark: brand[700], - }), - }, - info: { - light: brand[100], - main: brand[300], - dark: brand[600], - contrastText: gray[50], - ...(mode === 'dark' && { - contrastText: brand[300], - light: brand[500], - main: brand[700], - dark: brand[900], - }), - }, - warning: { - light: orange[300], - main: orange[400], - dark: orange[800], - ...(mode === 'dark' && { - light: orange[400], - main: orange[500], - dark: orange[700], - }), - }, - error: { - light: red[300], - main: red[400], - dark: red[800], - ...(mode === 'dark' && { - light: red[400], - main: red[500], - dark: red[700], - }), - }, - success: { - light: green[300], - main: green[400], - dark: green[800], - ...(mode === 'dark' && { - light: green[400], - main: green[500], - dark: green[700], - }), - }, - grey: { - ...gray, - }, - divider: mode === 'dark' ? alpha(gray[700], 0.6) : alpha(gray[300], 0.4), - background: { - default: 'hsl(0, 0%, 99%)', - paper: 'hsl(220, 35%, 97%)', - ...(mode === 'dark' && { default: gray[900], paper: 'hsl(220, 30%, 7%)' }), - }, - text: { - primary: gray[800], - secondary: gray[600], - warning: orange[400], - ...(mode === 'dark' && { primary: 'hsl(0, 0%, 100%)', secondary: gray[400] }), - }, - action: { - hover: alpha(gray[200], 0.2), - selected: `${alpha(gray[200], 0.3)}`, - ...(mode === 'dark' && { - hover: alpha(gray[600], 0.2), - selected: alpha(gray[600], 0.3), - }), - }, - }, - typography: { - fontFamily: ['"Inter", "sans-serif"'].join(','), - h1: { - fontSize: customTheme.typography.pxToRem(48), - fontWeight: 600, - lineHeight: 1.2, - letterSpacing: -0.5, - }, - h2: { - fontSize: customTheme.typography.pxToRem(36), - fontWeight: 600, - lineHeight: 1.2, - }, - h3: { - fontSize: customTheme.typography.pxToRem(30), - lineHeight: 1.2, - }, - h4: { - fontSize: customTheme.typography.pxToRem(24), - fontWeight: 600, - lineHeight: 1.5, - }, - h5: { - fontSize: customTheme.typography.pxToRem(20), - fontWeight: 600, - }, - h6: { - fontSize: customTheme.typography.pxToRem(18), - fontWeight: 600, - }, - subtitle1: { - fontSize: customTheme.typography.pxToRem(18), - }, - subtitle2: { - fontSize: customTheme.typography.pxToRem(14), - fontWeight: 500, - }, - body1: { - fontSize: customTheme.typography.pxToRem(14), - }, - body2: { - fontSize: customTheme.typography.pxToRem(14), - fontWeight: 400, - }, - caption: { - fontSize: customTheme.typography.pxToRem(12), - fontWeight: 400, - }, - }, - shape: { - borderRadius: 8, - }, - shadows: [ - 'none', - ...(mode === 'dark' - ? 'hsla(220, 30%, 5%, 0.7) 0px 4px 16px 0px, hsla(220, 25%, 10%, 0.8) 0px 8px 16px -5px' - : 'hsla(220, 30%, 5%, 0.07) 0px 4px 16px 0px, hsla(220, 25%, 10%, 0.07) 0px 8px 16px -5px'), - ] as Shadows, -}); + contrastText: brand[50], + ...(mode === 'dark' && { + contrastText: brand[50], + light: brand[300], + main: brand[400], + dark: brand[700], + }), + }, + info: { + light: brand[100], + main: brand[300], + dark: brand[600], + contrastText: gray[50], + ...(mode === 'dark' && { + contrastText: brand[300], + light: brand[500], + main: brand[700], + dark: brand[900], + }), + }, + warning: { + light: orange[300], + main: orange[400], + dark: orange[800], + ...(mode === 'dark' && { + light: orange[400], + main: orange[500], + dark: orange[700], + }), + }, + error: { + light: red[300], + main: red[400], + dark: red[800], + ...(mode === 'dark' && { + light: red[400], + main: red[500], + dark: red[700], + }), + }, + success: { + light: green[300], + main: green[400], + dark: green[800], + ...(mode === 'dark' && { + light: green[400], + main: green[500], + dark: green[700], + }), + }, + grey: { + ...gray, + }, + divider: mode === 'dark' ? alpha(gray[700], 0.6) : alpha(gray[300], 0.4), + background: { + default: 'hsl(0, 0%, 99%)', + paper: 'hsl(220, 35%, 97%)', + ...(mode === 'dark' && { default: gray[900], paper: 'hsl(220, 30%, 7%)' }), + }, + text: { + primary: gray[800], + secondary: gray[600], + warning: orange[400], + ...(mode === 'dark' && { primary: 'hsl(0, 0%, 100%)', secondary: gray[400] }), + }, + action: { + hover: alpha(gray[200], 0.2), + selected: `${alpha(gray[200], 0.3)}`, + ...(mode === 'dark' && { + hover: alpha(gray[600], 0.2), + selected: alpha(gray[600], 0.3), + }), + }, + }, + typography: { + fontFamily: ['"Inter", "sans-serif"'].join(','), + h1: { + fontSize: defaultTheme.typography.pxToRem(48), + fontWeight: 600, + lineHeight: 1.2, + letterSpacing: -0.5, + }, + h2: { + fontSize: defaultTheme.typography.pxToRem(36), + fontWeight: 600, + lineHeight: 1.2, + }, + h3: { + fontSize: defaultTheme.typography.pxToRem(30), + lineHeight: 1.2, + }, + h4: { + fontSize: defaultTheme.typography.pxToRem(24), + fontWeight: 600, + lineHeight: 1.5, + }, + h5: { + fontSize: defaultTheme.typography.pxToRem(20), + fontWeight: 600, + }, + h6: { + fontSize: defaultTheme.typography.pxToRem(18), + fontWeight: 600, + }, + subtitle1: { + fontSize: defaultTheme.typography.pxToRem(18), + }, + subtitle2: { + fontSize: defaultTheme.typography.pxToRem(14), + fontWeight: 500, + }, + body1: { + fontSize: defaultTheme.typography.pxToRem(14), + }, + body2: { + fontSize: defaultTheme.typography.pxToRem(14), + fontWeight: 400, + }, + caption: { + fontSize: defaultTheme.typography.pxToRem(12), + fontWeight: 400, + }, + }, + shape: { + borderRadius: 8, + }, + shadows: customShadows, + }; +}; diff --git a/docs/data/material/getting-started/templates/marketing-page/MarketingPage.js b/docs/data/material/getting-started/templates/marketing-page/MarketingPage.js index 92ec891210a70c..4017861b3a17f9 100644 --- a/docs/data/material/getting-started/templates/marketing-page/MarketingPage.js +++ b/docs/data/material/getting-started/templates/marketing-page/MarketingPage.js @@ -1,12 +1,7 @@ import * as React from 'react'; -import PropTypes from 'prop-types'; import { ThemeProvider, createTheme } from '@mui/material/styles'; import CssBaseline from '@mui/material/CssBaseline'; -import Box from '@mui/material/Box'; import Divider from '@mui/material/Divider'; -import ToggleButton from '@mui/material/ToggleButton'; -import ToggleButtonGroup from '@mui/material/ToggleButtonGroup'; -import AutoAwesomeRoundedIcon from '@mui/icons-material/AutoAwesomeRounded'; import AppAppBar from './components/AppAppBar'; import Hero from './components/Hero'; import LogoCollection from './components/LogoCollection'; @@ -17,50 +12,7 @@ import Testimonials from './components/Testimonials'; import FAQ from './components/FAQ'; import Footer from './components/Footer'; import getMPTheme from './theme/getMPTheme'; - -function ToggleCustomTheme({ showCustomTheme, toggleCustomTheme }) { - return ( - <Box - sx={{ - display: 'flex', - flexDirection: 'column', - alignItems: 'center', - width: '100dvw', - position: 'fixed', - bottom: 24, - }} - > - <ToggleButtonGroup - color="primary" - exclusive - value={showCustomTheme} - onChange={toggleCustomTheme} - aria-label="Toggle design language" - sx={{ - backgroundColor: 'background.default', - '& .Mui-selected': { - pointerEvents: 'none', - }, - }} - > - <ToggleButton value> - <AutoAwesomeRoundedIcon sx={{ fontSize: '20px', mr: 1 }} /> - Custom theme - </ToggleButton> - <ToggleButton data-screenshot="toggle-default-theme" value={false}> - Material Design 2 - </ToggleButton> - </ToggleButtonGroup> - </Box> - ); -} - -ToggleCustomTheme.propTypes = { - showCustomTheme: PropTypes.shape({ - valueOf: PropTypes.func.isRequired, - }).isRequired, - toggleCustomTheme: PropTypes.func.isRequired, -}; +import TemplateFrame from './TemplateFrame'; export default function MarketingPage() { const [mode, setMode] = React.useState('light'); @@ -94,28 +46,31 @@ export default function MarketingPage() { }; return ( - <ThemeProvider theme={showCustomTheme ? MPTheme : defaultTheme}> - <CssBaseline /> - <AppAppBar mode={mode} toggleColorMode={toggleColorMode} /> - <Hero /> - <div> - <LogoCollection /> - <Features /> - <Divider /> - <Testimonials /> - <Divider /> - <Highlights /> - <Divider /> - <Pricing /> - <Divider /> - <FAQ /> - <Divider /> - <Footer /> - </div> - <ToggleCustomTheme - showCustomTheme={showCustomTheme} - toggleCustomTheme={toggleCustomTheme} - /> - </ThemeProvider> + <TemplateFrame + toggleCustomTheme={toggleCustomTheme} + showCustomTheme={showCustomTheme} + mode={mode} + toggleColorMode={toggleColorMode} + > + <ThemeProvider theme={showCustomTheme ? MPTheme : defaultTheme}> + <CssBaseline enableColorScheme /> + <AppAppBar /> + <Hero /> + <div> + <LogoCollection /> + <Features /> + <Divider /> + <Testimonials /> + <Divider /> + <Highlights /> + <Divider /> + <Pricing /> + <Divider /> + <FAQ /> + <Divider /> + <Footer /> + </div> + </ThemeProvider> + </TemplateFrame> ); } diff --git a/docs/data/material/getting-started/templates/marketing-page/MarketingPage.tsx b/docs/data/material/getting-started/templates/marketing-page/MarketingPage.tsx index 809c47cc6f7b4a..ba44db4f49fe37 100644 --- a/docs/data/material/getting-started/templates/marketing-page/MarketingPage.tsx +++ b/docs/data/material/getting-started/templates/marketing-page/MarketingPage.tsx @@ -1,11 +1,7 @@ import * as React from 'react'; import { PaletteMode, ThemeProvider, createTheme } from '@mui/material/styles'; import CssBaseline from '@mui/material/CssBaseline'; -import Box from '@mui/material/Box'; import Divider from '@mui/material/Divider'; -import ToggleButton from '@mui/material/ToggleButton'; -import ToggleButtonGroup from '@mui/material/ToggleButtonGroup'; -import AutoAwesomeRoundedIcon from '@mui/icons-material/AutoAwesomeRounded'; import AppAppBar from './components/AppAppBar'; import Hero from './components/Hero'; import LogoCollection from './components/LogoCollection'; @@ -16,51 +12,7 @@ import Testimonials from './components/Testimonials'; import FAQ from './components/FAQ'; import Footer from './components/Footer'; import getMPTheme from './theme/getMPTheme'; - -interface ToggleCustomThemeProps { - showCustomTheme: Boolean; - toggleCustomTheme: () => void; -} - -function ToggleCustomTheme({ - showCustomTheme, - toggleCustomTheme, -}: ToggleCustomThemeProps) { - return ( - <Box - sx={{ - display: 'flex', - flexDirection: 'column', - alignItems: 'center', - width: '100dvw', - position: 'fixed', - bottom: 24, - }} - > - <ToggleButtonGroup - color="primary" - exclusive - value={showCustomTheme} - onChange={toggleCustomTheme} - aria-label="Toggle design language" - sx={{ - backgroundColor: 'background.default', - '& .Mui-selected': { - pointerEvents: 'none', - }, - }} - > - <ToggleButton value> - <AutoAwesomeRoundedIcon sx={{ fontSize: '20px', mr: 1 }} /> - Custom theme - </ToggleButton> - <ToggleButton data-screenshot="toggle-default-theme" value={false}> - Material Design 2 - </ToggleButton> - </ToggleButtonGroup> - </Box> - ); -} +import TemplateFrame from './TemplateFrame'; export default function MarketingPage() { const [mode, setMode] = React.useState<PaletteMode>('light'); @@ -94,28 +46,32 @@ export default function MarketingPage() { }; return ( - <ThemeProvider theme={showCustomTheme ? MPTheme : defaultTheme}> - <CssBaseline /> - <AppAppBar mode={mode} toggleColorMode={toggleColorMode} /> - <Hero /> - <div> - <LogoCollection /> - <Features /> - <Divider /> - <Testimonials /> - <Divider /> - <Highlights /> - <Divider /> - <Pricing /> - <Divider /> - <FAQ /> - <Divider /> - <Footer /> - </div> - <ToggleCustomTheme - showCustomTheme={showCustomTheme} - toggleCustomTheme={toggleCustomTheme} - /> - </ThemeProvider> + <TemplateFrame + toggleCustomTheme={toggleCustomTheme} + showCustomTheme={showCustomTheme} + mode={mode} + toggleColorMode={toggleColorMode} + > + <ThemeProvider theme={showCustomTheme ? MPTheme : defaultTheme}> + <CssBaseline enableColorScheme /> + + <AppAppBar /> + <Hero /> + <div> + <LogoCollection /> + <Features /> + <Divider /> + <Testimonials /> + <Divider /> + <Highlights /> + <Divider /> + <Pricing /> + <Divider /> + <FAQ /> + <Divider /> + <Footer /> + </div> + </ThemeProvider> + </TemplateFrame> ); } diff --git a/docs/data/material/getting-started/templates/marketing-page/README.md b/docs/data/material/getting-started/templates/marketing-page/README.md index d8000c3c170ef6..05d2a22764cebe 100644 --- a/docs/data/material/getting-started/templates/marketing-page/README.md +++ b/docs/data/material/getting-started/templates/marketing-page/README.md @@ -4,7 +4,7 @@ <!-- #default-branch-switch --> -1. Copy the files into your project, or one of the [example projects](https://github.com/mui/material-ui/tree/next/examples). +1. Copy the files into your project, or one of the [example projects](https://github.com/mui/material-ui/tree/master/examples). 2. Make sure your project has the required dependencies: @mui/material, @mui/icons-material, @emotion/styled, @emotion/react. 3. Import and use the `MarketingPage` component. @@ -12,4 +12,4 @@ <!-- #default-branch-switch --> -View the demo at https://next.mui.com/material-ui/getting-started/templates/marketing-page/. +View the demo at https://mui.com/material-ui/getting-started/templates/marketing-page/. diff --git a/docs/data/material/getting-started/templates/marketing-page/TemplateFrame.js b/docs/data/material/getting-started/templates/marketing-page/TemplateFrame.js new file mode 100644 index 00000000000000..445336568e8c0a --- /dev/null +++ b/docs/data/material/getting-started/templates/marketing-page/TemplateFrame.js @@ -0,0 +1,113 @@ +import * as React from 'react'; +import PropTypes from 'prop-types'; +import { createTheme, ThemeProvider, styled } from '@mui/material/styles'; +import Select from '@mui/material/Select'; +import MenuItem from '@mui/material/MenuItem'; +import FormControl from '@mui/material/FormControl'; +import Button from '@mui/material/Button'; +import IconButton from '@mui/material/IconButton'; +import Box from '@mui/material/Box'; +import AppBar from '@mui/material/AppBar'; +import Toolbar from '@mui/material/Toolbar'; +import ArrowBackRoundedIcon from '@mui/icons-material/ArrowBackRounded'; +import ToggleColorMode from './components/ToggleColorMode'; +import getMPTheme from './theme/getMPTheme'; + +const StyledAppBar = styled(AppBar)(({ theme }) => ({ + position: 'relative', + display: 'flex', + alignItems: 'center', + justifyContent: 'space-between', + flexShrink: 0, + borderBottom: '1px solid', + borderColor: theme.palette.divider, + backgroundColor: theme.palette.background.paper, + boxShadow: 'none', + backgroundImage: 'none', + zIndex: theme.zIndex.drawer + 1, + flex: '0 0 auto', +})); + +function TemplateFrame({ + showCustomTheme, + toggleCustomTheme, + mode, + toggleColorMode, + children, +}) { + const handleChange = (event) => { + toggleCustomTheme(event.target.value === 'custom'); + }; + const MPTheme = createTheme(getMPTheme(mode)); + + return ( + <ThemeProvider theme={MPTheme}> + <Box sx={{ height: '100dvh', display: 'flex', flexDirection: 'column' }}> + <StyledAppBar> + <Toolbar + variant="dense" + disableGutters + sx={{ + display: 'flex', + justifyContent: 'space-between', + width: '100%', + p: '8px 12px', + }} + > + <Button + variant="text" + size="small" + aria-label="Back to templates" + startIcon={<ArrowBackRoundedIcon />} + component="a" + href="/material-ui/getting-started/templates/" + sx={{ display: { xs: 'none', sm: 'flex' } }} + > + Back to templates + </Button> + <IconButton + size="small" + aria-label="Back to templates" + component="a" + href="/material-ui/getting-started/templates/" + sx={{ display: { xs: 'auto', sm: 'none' } }} + > + <ArrowBackRoundedIcon /> + </IconButton> + <Box sx={{ display: 'flex', gap: 1 }}> + <FormControl variant="outlined" sx={{ minWidth: 180 }}> + <Select + size="small" + labelId="theme-select-label" + id="theme-select" + value={showCustomTheme ? 'custom' : 'material'} + onChange={handleChange} + label="Design Language" + > + <MenuItem value="custom">Custom Theme</MenuItem> + <MenuItem value="material">Material Design 2</MenuItem> + </Select> + </FormControl> + <ToggleColorMode + data-screenshot="toggle-mode" + mode={mode} + toggleColorMode={toggleColorMode} + /> + </Box> + </Toolbar> + </StyledAppBar> + <Box sx={{ flex: '1 1', overflow: 'auto' }}>{children}</Box> + </Box> + </ThemeProvider> + ); +} + +TemplateFrame.propTypes = { + children: PropTypes.node, + mode: PropTypes.oneOf(['dark', 'light']).isRequired, + showCustomTheme: PropTypes.bool.isRequired, + toggleColorMode: PropTypes.func.isRequired, + toggleCustomTheme: PropTypes.func.isRequired, +}; + +export default TemplateFrame; diff --git a/docs/data/material/getting-started/templates/marketing-page/TemplateFrame.tsx b/docs/data/material/getting-started/templates/marketing-page/TemplateFrame.tsx new file mode 100644 index 00000000000000..580ce16c15fd9e --- /dev/null +++ b/docs/data/material/getting-started/templates/marketing-page/TemplateFrame.tsx @@ -0,0 +1,115 @@ +import * as React from 'react'; +import { + createTheme, + ThemeProvider, + PaletteMode, + styled, +} from '@mui/material/styles'; +import Select, { SelectChangeEvent } from '@mui/material/Select'; +import MenuItem from '@mui/material/MenuItem'; +import FormControl from '@mui/material/FormControl'; +import Button from '@mui/material/Button'; +import IconButton from '@mui/material/IconButton'; +import Box from '@mui/material/Box'; +import AppBar from '@mui/material/AppBar'; +import Toolbar from '@mui/material/Toolbar'; +import ArrowBackRoundedIcon from '@mui/icons-material/ArrowBackRounded'; +import ToggleColorMode from './components/ToggleColorMode'; +import getMPTheme from './theme/getMPTheme'; + +const StyledAppBar = styled(AppBar)(({ theme }) => ({ + position: 'relative', + display: 'flex', + alignItems: 'center', + justifyContent: 'space-between', + flexShrink: 0, + borderBottom: '1px solid', + borderColor: theme.palette.divider, + backgroundColor: theme.palette.background.paper, + boxShadow: 'none', + backgroundImage: 'none', + zIndex: theme.zIndex.drawer + 1, + flex: '0 0 auto', +})); + +interface TemplateFrameProps { + showCustomTheme: boolean; + toggleCustomTheme: (theme: boolean) => void; + mode: PaletteMode; + toggleColorMode: () => void; + children: React.ReactNode; +} + +export default function TemplateFrame({ + showCustomTheme, + toggleCustomTheme, + mode, + toggleColorMode, + children, +}: TemplateFrameProps) { + const handleChange = (event: SelectChangeEvent) => { + toggleCustomTheme(event.target.value === 'custom'); + }; + const MPTheme = createTheme(getMPTheme(mode)); + + return ( + <ThemeProvider theme={MPTheme}> + <Box sx={{ height: '100dvh', display: 'flex', flexDirection: 'column' }}> + <StyledAppBar> + <Toolbar + variant="dense" + disableGutters + sx={{ + display: 'flex', + justifyContent: 'space-between', + width: '100%', + p: '8px 12px', + }} + > + <Button + variant="text" + size="small" + aria-label="Back to templates" + startIcon={<ArrowBackRoundedIcon />} + component="a" + href="/material-ui/getting-started/templates/" + sx={{ display: { xs: 'none', sm: 'flex' } }} + > + Back to templates + </Button> + <IconButton + size="small" + aria-label="Back to templates" + component="a" + href="/material-ui/getting-started/templates/" + sx={{ display: { xs: 'auto', sm: 'none' } }} + > + <ArrowBackRoundedIcon /> + </IconButton> + <Box sx={{ display: 'flex', gap: 1 }}> + <FormControl variant="outlined" sx={{ minWidth: 180 }}> + <Select + size="small" + labelId="theme-select-label" + id="theme-select" + value={showCustomTheme ? 'custom' : 'material'} + onChange={handleChange} + label="Design Language" + > + <MenuItem value="custom">Custom Theme</MenuItem> + <MenuItem value="material">Material Design 2</MenuItem> + </Select> + </FormControl> + <ToggleColorMode + data-screenshot="toggle-mode" + mode={mode} + toggleColorMode={toggleColorMode} + /> + </Box> + </Toolbar> + </StyledAppBar> + <Box sx={{ flex: '1 1', overflow: 'auto' }}>{children}</Box> + </Box> + </ThemeProvider> + ); +} diff --git a/docs/data/material/getting-started/templates/marketing-page/components/AppAppBar.js b/docs/data/material/getting-started/templates/marketing-page/components/AppAppBar.js index 624672a85c9864..e8e5e13cd7e34f 100644 --- a/docs/data/material/getting-started/templates/marketing-page/components/AppAppBar.js +++ b/docs/data/material/getting-started/templates/marketing-page/components/AppAppBar.js @@ -1,5 +1,4 @@ import * as React from 'react'; -import PropTypes from 'prop-types'; import { styled, alpha } from '@mui/material/styles'; import Box from '@mui/material/Box'; import AppBar from '@mui/material/AppBar'; @@ -12,7 +11,6 @@ import MenuItem from '@mui/material/MenuItem'; import Drawer from '@mui/material/Drawer'; import MenuIcon from '@mui/icons-material/Menu'; import CloseRoundedIcon from '@mui/icons-material/CloseRounded'; -import ToggleColorMode from './ToggleColorMode'; import Sitemark from './SitemarkIcon'; const StyledToolbar = styled(Toolbar)(({ theme }) => ({ @@ -29,7 +27,7 @@ const StyledToolbar = styled(Toolbar)(({ theme }) => ({ padding: '8px 12px', })); -function AppAppBar({ mode, toggleColorMode }) { +export default function AppAppBar() { const [open, setOpen] = React.useState(false); const toggleDrawer = (newOpen) => () => { @@ -39,7 +37,7 @@ function AppAppBar({ mode, toggleColorMode }) { return ( <AppBar position="fixed" - sx={{ boxShadow: 0, bgcolor: 'transparent', backgroundImage: 'none', mt: 2 }} + sx={{ boxShadow: 0, bgcolor: 'transparent', backgroundImage: 'none', mt: 10 }} > <Container maxWidth="lg"> <StyledToolbar variant="dense" disableGutters> @@ -79,11 +77,6 @@ function AppAppBar({ mode, toggleColorMode }) { <Button color="primary" variant="contained" size="small"> Sign up </Button> - <ToggleColorMode - data-screenshot="toggle-mode" - mode={mode} - toggleColorMode={toggleColorMode} - /> </Box> <Box sx={{ display: { sm: 'flex', md: 'none' } }}> <IconButton aria-label="Menu button" onClick={toggleDrawer(true)}> @@ -98,7 +91,6 @@ function AppAppBar({ mode, toggleColorMode }) { justifyContent: 'space-between', }} > - <ToggleColorMode mode={mode} toggleColorMode={toggleColorMode} /> <IconButton onClick={toggleDrawer(false)}> <CloseRoundedIcon /> </IconButton> @@ -128,10 +120,3 @@ function AppAppBar({ mode, toggleColorMode }) { </AppBar> ); } - -AppAppBar.propTypes = { - mode: PropTypes.oneOf(['dark', 'light']).isRequired, - toggleColorMode: PropTypes.func.isRequired, -}; - -export default AppAppBar; diff --git a/docs/data/material/getting-started/templates/marketing-page/components/AppAppBar.tsx b/docs/data/material/getting-started/templates/marketing-page/components/AppAppBar.tsx index a01298afa5dfab..06e0072f848060 100644 --- a/docs/data/material/getting-started/templates/marketing-page/components/AppAppBar.tsx +++ b/docs/data/material/getting-started/templates/marketing-page/components/AppAppBar.tsx @@ -1,5 +1,5 @@ import * as React from 'react'; -import { PaletteMode, styled, alpha } from '@mui/material/styles'; +import { styled, alpha } from '@mui/material/styles'; import Box from '@mui/material/Box'; import AppBar from '@mui/material/AppBar'; import Toolbar from '@mui/material/Toolbar'; @@ -11,7 +11,6 @@ import MenuItem from '@mui/material/MenuItem'; import Drawer from '@mui/material/Drawer'; import MenuIcon from '@mui/icons-material/Menu'; import CloseRoundedIcon from '@mui/icons-material/CloseRounded'; -import ToggleColorMode from './ToggleColorMode'; import Sitemark from './SitemarkIcon'; const StyledToolbar = styled(Toolbar)(({ theme }) => ({ @@ -28,12 +27,7 @@ const StyledToolbar = styled(Toolbar)(({ theme }) => ({ padding: '8px 12px', })); -interface AppAppBarProps { - mode: PaletteMode; - toggleColorMode: () => void; -} - -export default function AppAppBar({ mode, toggleColorMode }: AppAppBarProps) { +export default function AppAppBar() { const [open, setOpen] = React.useState(false); const toggleDrawer = (newOpen: boolean) => () => { @@ -43,7 +37,7 @@ export default function AppAppBar({ mode, toggleColorMode }: AppAppBarProps) { return ( <AppBar position="fixed" - sx={{ boxShadow: 0, bgcolor: 'transparent', backgroundImage: 'none', mt: 2 }} + sx={{ boxShadow: 0, bgcolor: 'transparent', backgroundImage: 'none', mt: 10 }} > <Container maxWidth="lg"> <StyledToolbar variant="dense" disableGutters> @@ -83,11 +77,6 @@ export default function AppAppBar({ mode, toggleColorMode }: AppAppBarProps) { <Button color="primary" variant="contained" size="small"> Sign up </Button> - <ToggleColorMode - data-screenshot="toggle-mode" - mode={mode} - toggleColorMode={toggleColorMode} - /> </Box> <Box sx={{ display: { sm: 'flex', md: 'none' } }}> <IconButton aria-label="Menu button" onClick={toggleDrawer(true)}> @@ -102,7 +91,6 @@ export default function AppAppBar({ mode, toggleColorMode }: AppAppBarProps) { justifyContent: 'space-between', }} > - <ToggleColorMode mode={mode} toggleColorMode={toggleColorMode} /> <IconButton onClick={toggleDrawer(false)}> <CloseRoundedIcon /> </IconButton> diff --git a/docs/data/material/getting-started/templates/marketing-page/components/Footer.js b/docs/data/material/getting-started/templates/marketing-page/components/Footer.js index b5deb87bf5ec6a..13e35f0591a6e9 100644 --- a/docs/data/material/getting-started/templates/marketing-page/components/Footer.js +++ b/docs/data/material/getting-started/templates/marketing-page/components/Footer.js @@ -8,7 +8,6 @@ import Link from '@mui/material/Link'; import Stack from '@mui/material/Stack'; import TextField from '@mui/material/TextField'; import Typography from '@mui/material/Typography'; -import { visuallyHidden } from '@mui/utils'; import FacebookIcon from '@mui/icons-material/GitHub'; import LinkedInIcon from '@mui/icons-material/LinkedIn'; import TwitterIcon from '@mui/icons-material/X'; @@ -63,10 +62,8 @@ export default function Footer() { <Typography variant="body2" sx={{ color: 'text.secondary', mb: 2 }}> Subscribe for weekly updates. No spams ever! </Typography> + <InputLabel htmlFor="email-newsletter">Email</InputLabel> <Stack direction="row" spacing={1} useFlexGap> - <InputLabel htmlFor="email-newsletter" sx={visuallyHidden}> - Email - </InputLabel> <TextField id="email-newsletter" hiddenLabel diff --git a/docs/data/material/getting-started/templates/marketing-page/components/Footer.tsx b/docs/data/material/getting-started/templates/marketing-page/components/Footer.tsx index b5deb87bf5ec6a..13e35f0591a6e9 100644 --- a/docs/data/material/getting-started/templates/marketing-page/components/Footer.tsx +++ b/docs/data/material/getting-started/templates/marketing-page/components/Footer.tsx @@ -8,7 +8,6 @@ import Link from '@mui/material/Link'; import Stack from '@mui/material/Stack'; import TextField from '@mui/material/TextField'; import Typography from '@mui/material/Typography'; -import { visuallyHidden } from '@mui/utils'; import FacebookIcon from '@mui/icons-material/GitHub'; import LinkedInIcon from '@mui/icons-material/LinkedIn'; import TwitterIcon from '@mui/icons-material/X'; @@ -63,10 +62,8 @@ export default function Footer() { <Typography variant="body2" sx={{ color: 'text.secondary', mb: 2 }}> Subscribe for weekly updates. No spams ever! </Typography> + <InputLabel htmlFor="email-newsletter">Email</InputLabel> <Stack direction="row" spacing={1} useFlexGap> - <InputLabel htmlFor="email-newsletter" sx={visuallyHidden}> - Email - </InputLabel> <TextField id="email-newsletter" hiddenLabel diff --git a/docs/data/material/getting-started/templates/marketing-page/components/Hero.tsx b/docs/data/material/getting-started/templates/marketing-page/components/Hero.tsx index 36404065efbcc0..1745dd054029ad 100644 --- a/docs/data/material/getting-started/templates/marketing-page/components/Hero.tsx +++ b/docs/data/material/getting-started/templates/marketing-page/components/Hero.tsx @@ -43,6 +43,7 @@ export default function Hero() { sx={(theme) => ({ width: '100%', backgroundRepeat: 'no-repeat', + backgroundImage: 'radial-gradient(ellipse 80% 50% at 50% -20%, hsl(210, 100%, 90%), transparent)', ...theme.applyStyles('dark', { diff --git a/docs/data/material/getting-started/templates/marketing-page/theme/themePrimitives.js b/docs/data/material/getting-started/templates/marketing-page/theme/themePrimitives.js index 1894b11b326f0c..625400640eef43 100644 --- a/docs/data/material/getting-started/templates/marketing-page/theme/themePrimitives.js +++ b/docs/data/material/getting-started/templates/marketing-page/theme/themePrimitives.js @@ -1,6 +1,8 @@ import { createTheme, alpha } from '@mui/material/styles'; -const customTheme = createTheme(); +const defaultTheme = createTheme(); + +const customShadows = [...defaultTheme.shadows]; export const brand = { 50: 'hsl(210, 100%, 95%)', @@ -67,143 +69,148 @@ export const red = { 900: 'hsl(0, 93%, 6%)', }; -export const getDesignTokens = (mode) => ({ - palette: { - mode, - primary: { - light: brand[200], - main: brand[400], - dark: brand[700], - contrastText: brand[50], - ...(mode === 'dark' && { - contrastText: brand[50], - light: brand[300], +export const getDesignTokens = (mode) => { + customShadows[1] = + mode === 'dark' + ? 'hsla(220, 30%, 5%, 0.7) 0px 4px 16px 0px, hsla(220, 25%, 10%, 0.8) 0px 8px 16px -5px' + : 'hsla(220, 30%, 5%, 0.07) 0px 4px 16px 0px, hsla(220, 25%, 10%, 0.07) 0px 8px 16px -5px'; + + return { + palette: { + mode, + primary: { + light: brand[200], main: brand[400], dark: brand[700], - }), - }, - info: { - light: brand[100], - main: brand[300], - dark: brand[600], - contrastText: gray[50], - ...(mode === 'dark' && { - contrastText: brand[300], - light: brand[500], - main: brand[700], - dark: brand[900], - }), - }, - warning: { - light: orange[300], - main: orange[400], - dark: orange[800], - ...(mode === 'dark' && { - light: orange[400], - main: orange[500], - dark: orange[700], - }), - }, - error: { - light: red[300], - main: red[400], - dark: red[800], - ...(mode === 'dark' && { - light: red[400], - main: red[500], - dark: red[700], - }), - }, - success: { - light: green[300], - main: green[400], - dark: green[800], - ...(mode === 'dark' && { - light: green[400], - main: green[500], - dark: green[700], - }), - }, - grey: { - ...gray, - }, - divider: mode === 'dark' ? alpha(gray[700], 0.6) : alpha(gray[300], 0.4), - background: { - default: 'hsl(0, 0%, 99%)', - paper: 'hsl(220, 35%, 97%)', - ...(mode === 'dark' && { default: gray[900], paper: 'hsl(220, 30%, 7%)' }), - }, - text: { - primary: gray[800], - secondary: gray[600], - warning: orange[400], - ...(mode === 'dark' && { primary: 'hsl(0, 0%, 100%)', secondary: gray[400] }), - }, - action: { - hover: alpha(gray[200], 0.2), - selected: `${alpha(gray[200], 0.3)}`, - ...(mode === 'dark' && { - hover: alpha(gray[600], 0.2), - selected: alpha(gray[600], 0.3), - }), - }, - }, - typography: { - fontFamily: ['"Inter", "sans-serif"'].join(','), - h1: { - fontSize: customTheme.typography.pxToRem(48), - fontWeight: 600, - lineHeight: 1.2, - letterSpacing: -0.5, - }, - h2: { - fontSize: customTheme.typography.pxToRem(36), - fontWeight: 600, - lineHeight: 1.2, - }, - h3: { - fontSize: customTheme.typography.pxToRem(30), - lineHeight: 1.2, - }, - h4: { - fontSize: customTheme.typography.pxToRem(24), - fontWeight: 600, - lineHeight: 1.5, - }, - h5: { - fontSize: customTheme.typography.pxToRem(20), - fontWeight: 600, - }, - h6: { - fontSize: customTheme.typography.pxToRem(18), - fontWeight: 600, - }, - subtitle1: { - fontSize: customTheme.typography.pxToRem(18), - }, - subtitle2: { - fontSize: customTheme.typography.pxToRem(14), - fontWeight: 500, - }, - body1: { - fontSize: customTheme.typography.pxToRem(14), - }, - body2: { - fontSize: customTheme.typography.pxToRem(14), - fontWeight: 400, - }, - caption: { - fontSize: customTheme.typography.pxToRem(12), - fontWeight: 400, - }, - }, - shape: { - borderRadius: 8, - }, - shadows: [ - 'none', - ...(mode === 'dark' - ? 'hsla(220, 30%, 5%, 0.7) 0px 4px 16px 0px, hsla(220, 25%, 10%, 0.8) 0px 8px 16px -5px' - : 'hsla(220, 30%, 5%, 0.07) 0px 4px 16px 0px, hsla(220, 25%, 10%, 0.07) 0px 8px 16px -5px'), - ], -}); + contrastText: brand[50], + ...(mode === 'dark' && { + contrastText: brand[50], + light: brand[300], + main: brand[400], + dark: brand[700], + }), + }, + info: { + light: brand[100], + main: brand[300], + dark: brand[600], + contrastText: gray[50], + ...(mode === 'dark' && { + contrastText: brand[300], + light: brand[500], + main: brand[700], + dark: brand[900], + }), + }, + warning: { + light: orange[300], + main: orange[400], + dark: orange[800], + ...(mode === 'dark' && { + light: orange[400], + main: orange[500], + dark: orange[700], + }), + }, + error: { + light: red[300], + main: red[400], + dark: red[800], + ...(mode === 'dark' && { + light: red[400], + main: red[500], + dark: red[700], + }), + }, + success: { + light: green[300], + main: green[400], + dark: green[800], + ...(mode === 'dark' && { + light: green[400], + main: green[500], + dark: green[700], + }), + }, + grey: { + ...gray, + }, + divider: mode === 'dark' ? alpha(gray[700], 0.6) : alpha(gray[300], 0.4), + background: { + default: 'hsl(0, 0%, 99%)', + paper: 'hsl(220, 35%, 97%)', + ...(mode === 'dark' && { default: gray[900], paper: 'hsl(220, 30%, 7%)' }), + }, + text: { + primary: gray[800], + secondary: gray[600], + warning: orange[400], + ...(mode === 'dark' && { + primary: 'hsl(0, 0%, 100%)', + secondary: gray[400], + }), + }, + action: { + hover: alpha(gray[200], 0.2), + selected: `${alpha(gray[200], 0.3)}`, + ...(mode === 'dark' && { + hover: alpha(gray[600], 0.2), + selected: alpha(gray[600], 0.3), + }), + }, + }, + typography: { + fontFamily: ['"Inter", "sans-serif"'].join(','), + h1: { + fontSize: defaultTheme.typography.pxToRem(48), + fontWeight: 600, + lineHeight: 1.2, + letterSpacing: -0.5, + }, + h2: { + fontSize: defaultTheme.typography.pxToRem(36), + fontWeight: 600, + lineHeight: 1.2, + }, + h3: { + fontSize: defaultTheme.typography.pxToRem(30), + lineHeight: 1.2, + }, + h4: { + fontSize: defaultTheme.typography.pxToRem(24), + fontWeight: 600, + lineHeight: 1.5, + }, + h5: { + fontSize: defaultTheme.typography.pxToRem(20), + fontWeight: 600, + }, + h6: { + fontSize: defaultTheme.typography.pxToRem(18), + fontWeight: 600, + }, + subtitle1: { + fontSize: defaultTheme.typography.pxToRem(18), + }, + subtitle2: { + fontSize: defaultTheme.typography.pxToRem(14), + fontWeight: 500, + }, + body1: { + fontSize: defaultTheme.typography.pxToRem(14), + }, + body2: { + fontSize: defaultTheme.typography.pxToRem(14), + fontWeight: 400, + }, + caption: { + fontSize: defaultTheme.typography.pxToRem(12), + fontWeight: 400, + }, + }, + shape: { + borderRadius: 8, + }, + shadows: customShadows, + }; +}; diff --git a/docs/data/material/getting-started/templates/marketing-page/theme/themePrimitives.ts b/docs/data/material/getting-started/templates/marketing-page/theme/themePrimitives.ts index 09df769bb6687d..41b517b5294fad 100644 --- a/docs/data/material/getting-started/templates/marketing-page/theme/themePrimitives.ts +++ b/docs/data/material/getting-started/templates/marketing-page/theme/themePrimitives.ts @@ -1,4 +1,4 @@ -import { createTheme, alpha, Shadows, PaletteMode } from '@mui/material/styles'; +import { createTheme, alpha, PaletteMode, Shadows } from '@mui/material/styles'; declare module '@mui/material/Paper' { interface PaperPropsVariantOverrides { @@ -22,7 +22,9 @@ declare module '@mui/material/styles/createPalette' { interface PaletteColor extends ColorRange {} } -const customTheme = createTheme(); +const defaultTheme = createTheme(); + +const customShadows: Shadows = [...defaultTheme.shadows]; export const brand = { 50: 'hsl(210, 100%, 95%)', @@ -89,143 +91,145 @@ export const red = { 900: 'hsl(0, 93%, 6%)', }; -export const getDesignTokens = (mode: PaletteMode) => ({ - palette: { - mode, - primary: { - light: brand[200], - main: brand[400], - dark: brand[700], - contrastText: brand[50], - ...(mode === 'dark' && { - contrastText: brand[50], - light: brand[300], +export const getDesignTokens = (mode: PaletteMode) => { + customShadows[1] = + mode === 'dark' + ? 'hsla(220, 30%, 5%, 0.7) 0px 4px 16px 0px, hsla(220, 25%, 10%, 0.8) 0px 8px 16px -5px' + : 'hsla(220, 30%, 5%, 0.07) 0px 4px 16px 0px, hsla(220, 25%, 10%, 0.07) 0px 8px 16px -5px'; + + return { + palette: { + mode, + primary: { + light: brand[200], main: brand[400], dark: brand[700], - }), - }, - info: { - light: brand[100], - main: brand[300], - dark: brand[600], - contrastText: gray[50], - ...(mode === 'dark' && { - contrastText: brand[300], - light: brand[500], - main: brand[700], - dark: brand[900], - }), - }, - warning: { - light: orange[300], - main: orange[400], - dark: orange[800], - ...(mode === 'dark' && { - light: orange[400], - main: orange[500], - dark: orange[700], - }), - }, - error: { - light: red[300], - main: red[400], - dark: red[800], - ...(mode === 'dark' && { - light: red[400], - main: red[500], - dark: red[700], - }), - }, - success: { - light: green[300], - main: green[400], - dark: green[800], - ...(mode === 'dark' && { - light: green[400], - main: green[500], - dark: green[700], - }), - }, - grey: { - ...gray, - }, - divider: mode === 'dark' ? alpha(gray[700], 0.6) : alpha(gray[300], 0.4), - background: { - default: 'hsl(0, 0%, 99%)', - paper: 'hsl(220, 35%, 97%)', - ...(mode === 'dark' && { default: gray[900], paper: 'hsl(220, 30%, 7%)' }), - }, - text: { - primary: gray[800], - secondary: gray[600], - warning: orange[400], - ...(mode === 'dark' && { primary: 'hsl(0, 0%, 100%)', secondary: gray[400] }), - }, - action: { - hover: alpha(gray[200], 0.2), - selected: `${alpha(gray[200], 0.3)}`, - ...(mode === 'dark' && { - hover: alpha(gray[600], 0.2), - selected: alpha(gray[600], 0.3), - }), - }, - }, - typography: { - fontFamily: ['"Inter", "sans-serif"'].join(','), - h1: { - fontSize: customTheme.typography.pxToRem(48), - fontWeight: 600, - lineHeight: 1.2, - letterSpacing: -0.5, - }, - h2: { - fontSize: customTheme.typography.pxToRem(36), - fontWeight: 600, - lineHeight: 1.2, - }, - h3: { - fontSize: customTheme.typography.pxToRem(30), - lineHeight: 1.2, - }, - h4: { - fontSize: customTheme.typography.pxToRem(24), - fontWeight: 600, - lineHeight: 1.5, - }, - h5: { - fontSize: customTheme.typography.pxToRem(20), - fontWeight: 600, - }, - h6: { - fontSize: customTheme.typography.pxToRem(18), - fontWeight: 600, - }, - subtitle1: { - fontSize: customTheme.typography.pxToRem(18), - }, - subtitle2: { - fontSize: customTheme.typography.pxToRem(14), - fontWeight: 500, - }, - body1: { - fontSize: customTheme.typography.pxToRem(14), - }, - body2: { - fontSize: customTheme.typography.pxToRem(14), - fontWeight: 400, - }, - caption: { - fontSize: customTheme.typography.pxToRem(12), - fontWeight: 400, - }, - }, - shape: { - borderRadius: 8, - }, - shadows: [ - 'none', - ...(mode === 'dark' - ? 'hsla(220, 30%, 5%, 0.7) 0px 4px 16px 0px, hsla(220, 25%, 10%, 0.8) 0px 8px 16px -5px' - : 'hsla(220, 30%, 5%, 0.07) 0px 4px 16px 0px, hsla(220, 25%, 10%, 0.07) 0px 8px 16px -5px'), - ] as Shadows, -}); + contrastText: brand[50], + ...(mode === 'dark' && { + contrastText: brand[50], + light: brand[300], + main: brand[400], + dark: brand[700], + }), + }, + info: { + light: brand[100], + main: brand[300], + dark: brand[600], + contrastText: gray[50], + ...(mode === 'dark' && { + contrastText: brand[300], + light: brand[500], + main: brand[700], + dark: brand[900], + }), + }, + warning: { + light: orange[300], + main: orange[400], + dark: orange[800], + ...(mode === 'dark' && { + light: orange[400], + main: orange[500], + dark: orange[700], + }), + }, + error: { + light: red[300], + main: red[400], + dark: red[800], + ...(mode === 'dark' && { + light: red[400], + main: red[500], + dark: red[700], + }), + }, + success: { + light: green[300], + main: green[400], + dark: green[800], + ...(mode === 'dark' && { + light: green[400], + main: green[500], + dark: green[700], + }), + }, + grey: { + ...gray, + }, + divider: mode === 'dark' ? alpha(gray[700], 0.6) : alpha(gray[300], 0.4), + background: { + default: 'hsl(0, 0%, 99%)', + paper: 'hsl(220, 35%, 97%)', + ...(mode === 'dark' && { default: gray[900], paper: 'hsl(220, 30%, 7%)' }), + }, + text: { + primary: gray[800], + secondary: gray[600], + warning: orange[400], + ...(mode === 'dark' && { primary: 'hsl(0, 0%, 100%)', secondary: gray[400] }), + }, + action: { + hover: alpha(gray[200], 0.2), + selected: `${alpha(gray[200], 0.3)}`, + ...(mode === 'dark' && { + hover: alpha(gray[600], 0.2), + selected: alpha(gray[600], 0.3), + }), + }, + }, + typography: { + fontFamily: ['"Inter", "sans-serif"'].join(','), + h1: { + fontSize: defaultTheme.typography.pxToRem(48), + fontWeight: 600, + lineHeight: 1.2, + letterSpacing: -0.5, + }, + h2: { + fontSize: defaultTheme.typography.pxToRem(36), + fontWeight: 600, + lineHeight: 1.2, + }, + h3: { + fontSize: defaultTheme.typography.pxToRem(30), + lineHeight: 1.2, + }, + h4: { + fontSize: defaultTheme.typography.pxToRem(24), + fontWeight: 600, + lineHeight: 1.5, + }, + h5: { + fontSize: defaultTheme.typography.pxToRem(20), + fontWeight: 600, + }, + h6: { + fontSize: defaultTheme.typography.pxToRem(18), + fontWeight: 600, + }, + subtitle1: { + fontSize: defaultTheme.typography.pxToRem(18), + }, + subtitle2: { + fontSize: defaultTheme.typography.pxToRem(14), + fontWeight: 500, + }, + body1: { + fontSize: defaultTheme.typography.pxToRem(14), + }, + body2: { + fontSize: defaultTheme.typography.pxToRem(14), + fontWeight: 400, + }, + caption: { + fontSize: defaultTheme.typography.pxToRem(12), + fontWeight: 400, + }, + }, + shape: { + borderRadius: 8, + }, + shadows: customShadows, + }; +}; diff --git a/docs/data/material/getting-started/templates/shared-theme/themePrimitives.js b/docs/data/material/getting-started/templates/shared-theme/themePrimitives.js index 1894b11b326f0c..625400640eef43 100644 --- a/docs/data/material/getting-started/templates/shared-theme/themePrimitives.js +++ b/docs/data/material/getting-started/templates/shared-theme/themePrimitives.js @@ -1,6 +1,8 @@ import { createTheme, alpha } from '@mui/material/styles'; -const customTheme = createTheme(); +const defaultTheme = createTheme(); + +const customShadows = [...defaultTheme.shadows]; export const brand = { 50: 'hsl(210, 100%, 95%)', @@ -67,143 +69,148 @@ export const red = { 900: 'hsl(0, 93%, 6%)', }; -export const getDesignTokens = (mode) => ({ - palette: { - mode, - primary: { - light: brand[200], - main: brand[400], - dark: brand[700], - contrastText: brand[50], - ...(mode === 'dark' && { - contrastText: brand[50], - light: brand[300], +export const getDesignTokens = (mode) => { + customShadows[1] = + mode === 'dark' + ? 'hsla(220, 30%, 5%, 0.7) 0px 4px 16px 0px, hsla(220, 25%, 10%, 0.8) 0px 8px 16px -5px' + : 'hsla(220, 30%, 5%, 0.07) 0px 4px 16px 0px, hsla(220, 25%, 10%, 0.07) 0px 8px 16px -5px'; + + return { + palette: { + mode, + primary: { + light: brand[200], main: brand[400], dark: brand[700], - }), - }, - info: { - light: brand[100], - main: brand[300], - dark: brand[600], - contrastText: gray[50], - ...(mode === 'dark' && { - contrastText: brand[300], - light: brand[500], - main: brand[700], - dark: brand[900], - }), - }, - warning: { - light: orange[300], - main: orange[400], - dark: orange[800], - ...(mode === 'dark' && { - light: orange[400], - main: orange[500], - dark: orange[700], - }), - }, - error: { - light: red[300], - main: red[400], - dark: red[800], - ...(mode === 'dark' && { - light: red[400], - main: red[500], - dark: red[700], - }), - }, - success: { - light: green[300], - main: green[400], - dark: green[800], - ...(mode === 'dark' && { - light: green[400], - main: green[500], - dark: green[700], - }), - }, - grey: { - ...gray, - }, - divider: mode === 'dark' ? alpha(gray[700], 0.6) : alpha(gray[300], 0.4), - background: { - default: 'hsl(0, 0%, 99%)', - paper: 'hsl(220, 35%, 97%)', - ...(mode === 'dark' && { default: gray[900], paper: 'hsl(220, 30%, 7%)' }), - }, - text: { - primary: gray[800], - secondary: gray[600], - warning: orange[400], - ...(mode === 'dark' && { primary: 'hsl(0, 0%, 100%)', secondary: gray[400] }), - }, - action: { - hover: alpha(gray[200], 0.2), - selected: `${alpha(gray[200], 0.3)}`, - ...(mode === 'dark' && { - hover: alpha(gray[600], 0.2), - selected: alpha(gray[600], 0.3), - }), - }, - }, - typography: { - fontFamily: ['"Inter", "sans-serif"'].join(','), - h1: { - fontSize: customTheme.typography.pxToRem(48), - fontWeight: 600, - lineHeight: 1.2, - letterSpacing: -0.5, - }, - h2: { - fontSize: customTheme.typography.pxToRem(36), - fontWeight: 600, - lineHeight: 1.2, - }, - h3: { - fontSize: customTheme.typography.pxToRem(30), - lineHeight: 1.2, - }, - h4: { - fontSize: customTheme.typography.pxToRem(24), - fontWeight: 600, - lineHeight: 1.5, - }, - h5: { - fontSize: customTheme.typography.pxToRem(20), - fontWeight: 600, - }, - h6: { - fontSize: customTheme.typography.pxToRem(18), - fontWeight: 600, - }, - subtitle1: { - fontSize: customTheme.typography.pxToRem(18), - }, - subtitle2: { - fontSize: customTheme.typography.pxToRem(14), - fontWeight: 500, - }, - body1: { - fontSize: customTheme.typography.pxToRem(14), - }, - body2: { - fontSize: customTheme.typography.pxToRem(14), - fontWeight: 400, - }, - caption: { - fontSize: customTheme.typography.pxToRem(12), - fontWeight: 400, - }, - }, - shape: { - borderRadius: 8, - }, - shadows: [ - 'none', - ...(mode === 'dark' - ? 'hsla(220, 30%, 5%, 0.7) 0px 4px 16px 0px, hsla(220, 25%, 10%, 0.8) 0px 8px 16px -5px' - : 'hsla(220, 30%, 5%, 0.07) 0px 4px 16px 0px, hsla(220, 25%, 10%, 0.07) 0px 8px 16px -5px'), - ], -}); + contrastText: brand[50], + ...(mode === 'dark' && { + contrastText: brand[50], + light: brand[300], + main: brand[400], + dark: brand[700], + }), + }, + info: { + light: brand[100], + main: brand[300], + dark: brand[600], + contrastText: gray[50], + ...(mode === 'dark' && { + contrastText: brand[300], + light: brand[500], + main: brand[700], + dark: brand[900], + }), + }, + warning: { + light: orange[300], + main: orange[400], + dark: orange[800], + ...(mode === 'dark' && { + light: orange[400], + main: orange[500], + dark: orange[700], + }), + }, + error: { + light: red[300], + main: red[400], + dark: red[800], + ...(mode === 'dark' && { + light: red[400], + main: red[500], + dark: red[700], + }), + }, + success: { + light: green[300], + main: green[400], + dark: green[800], + ...(mode === 'dark' && { + light: green[400], + main: green[500], + dark: green[700], + }), + }, + grey: { + ...gray, + }, + divider: mode === 'dark' ? alpha(gray[700], 0.6) : alpha(gray[300], 0.4), + background: { + default: 'hsl(0, 0%, 99%)', + paper: 'hsl(220, 35%, 97%)', + ...(mode === 'dark' && { default: gray[900], paper: 'hsl(220, 30%, 7%)' }), + }, + text: { + primary: gray[800], + secondary: gray[600], + warning: orange[400], + ...(mode === 'dark' && { + primary: 'hsl(0, 0%, 100%)', + secondary: gray[400], + }), + }, + action: { + hover: alpha(gray[200], 0.2), + selected: `${alpha(gray[200], 0.3)}`, + ...(mode === 'dark' && { + hover: alpha(gray[600], 0.2), + selected: alpha(gray[600], 0.3), + }), + }, + }, + typography: { + fontFamily: ['"Inter", "sans-serif"'].join(','), + h1: { + fontSize: defaultTheme.typography.pxToRem(48), + fontWeight: 600, + lineHeight: 1.2, + letterSpacing: -0.5, + }, + h2: { + fontSize: defaultTheme.typography.pxToRem(36), + fontWeight: 600, + lineHeight: 1.2, + }, + h3: { + fontSize: defaultTheme.typography.pxToRem(30), + lineHeight: 1.2, + }, + h4: { + fontSize: defaultTheme.typography.pxToRem(24), + fontWeight: 600, + lineHeight: 1.5, + }, + h5: { + fontSize: defaultTheme.typography.pxToRem(20), + fontWeight: 600, + }, + h6: { + fontSize: defaultTheme.typography.pxToRem(18), + fontWeight: 600, + }, + subtitle1: { + fontSize: defaultTheme.typography.pxToRem(18), + }, + subtitle2: { + fontSize: defaultTheme.typography.pxToRem(14), + fontWeight: 500, + }, + body1: { + fontSize: defaultTheme.typography.pxToRem(14), + }, + body2: { + fontSize: defaultTheme.typography.pxToRem(14), + fontWeight: 400, + }, + caption: { + fontSize: defaultTheme.typography.pxToRem(12), + fontWeight: 400, + }, + }, + shape: { + borderRadius: 8, + }, + shadows: customShadows, + }; +}; diff --git a/docs/data/material/getting-started/templates/shared-theme/themePrimitives.ts b/docs/data/material/getting-started/templates/shared-theme/themePrimitives.ts index 09df769bb6687d..41b517b5294fad 100644 --- a/docs/data/material/getting-started/templates/shared-theme/themePrimitives.ts +++ b/docs/data/material/getting-started/templates/shared-theme/themePrimitives.ts @@ -1,4 +1,4 @@ -import { createTheme, alpha, Shadows, PaletteMode } from '@mui/material/styles'; +import { createTheme, alpha, PaletteMode, Shadows } from '@mui/material/styles'; declare module '@mui/material/Paper' { interface PaperPropsVariantOverrides { @@ -22,7 +22,9 @@ declare module '@mui/material/styles/createPalette' { interface PaletteColor extends ColorRange {} } -const customTheme = createTheme(); +const defaultTheme = createTheme(); + +const customShadows: Shadows = [...defaultTheme.shadows]; export const brand = { 50: 'hsl(210, 100%, 95%)', @@ -89,143 +91,145 @@ export const red = { 900: 'hsl(0, 93%, 6%)', }; -export const getDesignTokens = (mode: PaletteMode) => ({ - palette: { - mode, - primary: { - light: brand[200], - main: brand[400], - dark: brand[700], - contrastText: brand[50], - ...(mode === 'dark' && { - contrastText: brand[50], - light: brand[300], +export const getDesignTokens = (mode: PaletteMode) => { + customShadows[1] = + mode === 'dark' + ? 'hsla(220, 30%, 5%, 0.7) 0px 4px 16px 0px, hsla(220, 25%, 10%, 0.8) 0px 8px 16px -5px' + : 'hsla(220, 30%, 5%, 0.07) 0px 4px 16px 0px, hsla(220, 25%, 10%, 0.07) 0px 8px 16px -5px'; + + return { + palette: { + mode, + primary: { + light: brand[200], main: brand[400], dark: brand[700], - }), - }, - info: { - light: brand[100], - main: brand[300], - dark: brand[600], - contrastText: gray[50], - ...(mode === 'dark' && { - contrastText: brand[300], - light: brand[500], - main: brand[700], - dark: brand[900], - }), - }, - warning: { - light: orange[300], - main: orange[400], - dark: orange[800], - ...(mode === 'dark' && { - light: orange[400], - main: orange[500], - dark: orange[700], - }), - }, - error: { - light: red[300], - main: red[400], - dark: red[800], - ...(mode === 'dark' && { - light: red[400], - main: red[500], - dark: red[700], - }), - }, - success: { - light: green[300], - main: green[400], - dark: green[800], - ...(mode === 'dark' && { - light: green[400], - main: green[500], - dark: green[700], - }), - }, - grey: { - ...gray, - }, - divider: mode === 'dark' ? alpha(gray[700], 0.6) : alpha(gray[300], 0.4), - background: { - default: 'hsl(0, 0%, 99%)', - paper: 'hsl(220, 35%, 97%)', - ...(mode === 'dark' && { default: gray[900], paper: 'hsl(220, 30%, 7%)' }), - }, - text: { - primary: gray[800], - secondary: gray[600], - warning: orange[400], - ...(mode === 'dark' && { primary: 'hsl(0, 0%, 100%)', secondary: gray[400] }), - }, - action: { - hover: alpha(gray[200], 0.2), - selected: `${alpha(gray[200], 0.3)}`, - ...(mode === 'dark' && { - hover: alpha(gray[600], 0.2), - selected: alpha(gray[600], 0.3), - }), - }, - }, - typography: { - fontFamily: ['"Inter", "sans-serif"'].join(','), - h1: { - fontSize: customTheme.typography.pxToRem(48), - fontWeight: 600, - lineHeight: 1.2, - letterSpacing: -0.5, - }, - h2: { - fontSize: customTheme.typography.pxToRem(36), - fontWeight: 600, - lineHeight: 1.2, - }, - h3: { - fontSize: customTheme.typography.pxToRem(30), - lineHeight: 1.2, - }, - h4: { - fontSize: customTheme.typography.pxToRem(24), - fontWeight: 600, - lineHeight: 1.5, - }, - h5: { - fontSize: customTheme.typography.pxToRem(20), - fontWeight: 600, - }, - h6: { - fontSize: customTheme.typography.pxToRem(18), - fontWeight: 600, - }, - subtitle1: { - fontSize: customTheme.typography.pxToRem(18), - }, - subtitle2: { - fontSize: customTheme.typography.pxToRem(14), - fontWeight: 500, - }, - body1: { - fontSize: customTheme.typography.pxToRem(14), - }, - body2: { - fontSize: customTheme.typography.pxToRem(14), - fontWeight: 400, - }, - caption: { - fontSize: customTheme.typography.pxToRem(12), - fontWeight: 400, - }, - }, - shape: { - borderRadius: 8, - }, - shadows: [ - 'none', - ...(mode === 'dark' - ? 'hsla(220, 30%, 5%, 0.7) 0px 4px 16px 0px, hsla(220, 25%, 10%, 0.8) 0px 8px 16px -5px' - : 'hsla(220, 30%, 5%, 0.07) 0px 4px 16px 0px, hsla(220, 25%, 10%, 0.07) 0px 8px 16px -5px'), - ] as Shadows, -}); + contrastText: brand[50], + ...(mode === 'dark' && { + contrastText: brand[50], + light: brand[300], + main: brand[400], + dark: brand[700], + }), + }, + info: { + light: brand[100], + main: brand[300], + dark: brand[600], + contrastText: gray[50], + ...(mode === 'dark' && { + contrastText: brand[300], + light: brand[500], + main: brand[700], + dark: brand[900], + }), + }, + warning: { + light: orange[300], + main: orange[400], + dark: orange[800], + ...(mode === 'dark' && { + light: orange[400], + main: orange[500], + dark: orange[700], + }), + }, + error: { + light: red[300], + main: red[400], + dark: red[800], + ...(mode === 'dark' && { + light: red[400], + main: red[500], + dark: red[700], + }), + }, + success: { + light: green[300], + main: green[400], + dark: green[800], + ...(mode === 'dark' && { + light: green[400], + main: green[500], + dark: green[700], + }), + }, + grey: { + ...gray, + }, + divider: mode === 'dark' ? alpha(gray[700], 0.6) : alpha(gray[300], 0.4), + background: { + default: 'hsl(0, 0%, 99%)', + paper: 'hsl(220, 35%, 97%)', + ...(mode === 'dark' && { default: gray[900], paper: 'hsl(220, 30%, 7%)' }), + }, + text: { + primary: gray[800], + secondary: gray[600], + warning: orange[400], + ...(mode === 'dark' && { primary: 'hsl(0, 0%, 100%)', secondary: gray[400] }), + }, + action: { + hover: alpha(gray[200], 0.2), + selected: `${alpha(gray[200], 0.3)}`, + ...(mode === 'dark' && { + hover: alpha(gray[600], 0.2), + selected: alpha(gray[600], 0.3), + }), + }, + }, + typography: { + fontFamily: ['"Inter", "sans-serif"'].join(','), + h1: { + fontSize: defaultTheme.typography.pxToRem(48), + fontWeight: 600, + lineHeight: 1.2, + letterSpacing: -0.5, + }, + h2: { + fontSize: defaultTheme.typography.pxToRem(36), + fontWeight: 600, + lineHeight: 1.2, + }, + h3: { + fontSize: defaultTheme.typography.pxToRem(30), + lineHeight: 1.2, + }, + h4: { + fontSize: defaultTheme.typography.pxToRem(24), + fontWeight: 600, + lineHeight: 1.5, + }, + h5: { + fontSize: defaultTheme.typography.pxToRem(20), + fontWeight: 600, + }, + h6: { + fontSize: defaultTheme.typography.pxToRem(18), + fontWeight: 600, + }, + subtitle1: { + fontSize: defaultTheme.typography.pxToRem(18), + }, + subtitle2: { + fontSize: defaultTheme.typography.pxToRem(14), + fontWeight: 500, + }, + body1: { + fontSize: defaultTheme.typography.pxToRem(14), + }, + body2: { + fontSize: defaultTheme.typography.pxToRem(14), + fontWeight: 400, + }, + caption: { + fontSize: defaultTheme.typography.pxToRem(12), + fontWeight: 400, + }, + }, + shape: { + borderRadius: 8, + }, + shadows: customShadows, + }; +}; diff --git a/docs/data/material/getting-started/templates/sign-in-side/README.md b/docs/data/material/getting-started/templates/sign-in-side/README.md index a7995114143ef1..67c088ce173215 100644 --- a/docs/data/material/getting-started/templates/sign-in-side/README.md +++ b/docs/data/material/getting-started/templates/sign-in-side/README.md @@ -4,7 +4,7 @@ <!-- #default-branch-switch --> -1. Copy the files into your project, or one of the [example projects](https://github.com/mui/material-ui/tree/next/examples). +1. Copy the files into your project, or one of the [example projects](https://github.com/mui/material-ui/tree/master/examples). 2. Make sure your project has the required dependencies: @mui/material, @mui/icons-material, @emotion/styled, @emotion/react. 3. Import and use the `SignInSide` component. @@ -12,4 +12,4 @@ <!-- #default-branch-switch --> -View the demo at https://next.mui.com/material-ui/getting-started/templates/sign-in-side/. +View the demo at https://mui.com/material-ui/getting-started/templates/sign-in-side/. diff --git a/docs/data/material/getting-started/templates/sign-in-side/SignInSide.js b/docs/data/material/getting-started/templates/sign-in-side/SignInSide.js index f293d336edad40..e905157adc4a27 100644 --- a/docs/data/material/getting-started/templates/sign-in-side/SignInSide.js +++ b/docs/data/material/getting-started/templates/sign-in-side/SignInSide.js @@ -1,64 +1,11 @@ import * as React from 'react'; -import PropTypes from 'prop-types'; -import Box from '@mui/material/Box'; -import Button from '@mui/material/Button'; import CssBaseline from '@mui/material/CssBaseline'; import Stack from '@mui/material/Stack'; -import ToggleButton from '@mui/material/ToggleButton'; -import ToggleButtonGroup from '@mui/material/ToggleButtonGroup'; import { createTheme, ThemeProvider } from '@mui/material/styles'; - -import ArrowBackRoundedIcon from '@mui/icons-material/ArrowBackRounded'; -import AutoAwesomeRoundedIcon from '@mui/icons-material/AutoAwesomeRounded'; - import getSignInSideTheme from './theme/getSignInSideTheme'; -import ToggleColorMode from './ToggleColorMode'; import SignInCard from './SignInCard'; import Content from './Content'; - -function ToggleCustomTheme({ showCustomTheme, toggleCustomTheme }) { - return ( - <Box - sx={{ - display: 'flex', - flexDirection: 'column', - alignItems: 'center', - width: '100dvw', - position: 'fixed', - bottom: 24, - }} - > - <ToggleButtonGroup - color="primary" - exclusive - value={showCustomTheme} - onChange={toggleCustomTheme} - aria-label="Toggle design language" - sx={{ - backgroundColor: 'background.default', - '& .Mui-selected': { - pointerEvents: 'none', - }, - }} - > - <ToggleButton value> - <AutoAwesomeRoundedIcon sx={{ fontSize: '20px', mr: 1 }} /> - Custom theme - </ToggleButton> - <ToggleButton data-screenshot="toggle-default-theme" value={false}> - Material Design 2 - </ToggleButton> - </ToggleButtonGroup> - </Box> - ); -} - -ToggleCustomTheme.propTypes = { - showCustomTheme: PropTypes.shape({ - valueOf: PropTypes.func.isRequired, - }).isRequired, - toggleCustomTheme: PropTypes.func.isRequired, -}; +import TemplateFrame from './TemplateFrame'; export default function SignInSide() { const [mode, setMode] = React.useState('light'); @@ -91,67 +38,47 @@ export default function SignInSide() { }; return ( - <ThemeProvider theme={showCustomTheme ? SignInSideTheme : defaultTheme}> - <CssBaseline /> - <Stack - direction="column" - component="main" - sx={[ - { - justifyContent: 'space-between', - }, - (theme) => ({ - backgroundImage: - 'radial-gradient(ellipse at 70% 51%, hsl(210, 100%, 97%), hsl(0, 0%, 100%))', - backgroundSize: 'cover', - height: { xs: 'auto', md: '100dvh' }, - pb: { xs: 12, sm: 0 }, - ...theme.applyStyles('dark', { + <TemplateFrame + toggleCustomTheme={toggleCustomTheme} + showCustomTheme={showCustomTheme} + mode={mode} + toggleColorMode={toggleColorMode} + > + <ThemeProvider theme={showCustomTheme ? SignInSideTheme : defaultTheme}> + <CssBaseline enableColorScheme /> + <Stack + direction="column" + component="main" + sx={[ + { + justifyContent: 'space-between', + height: { xs: 'auto', md: '100%' }, + }, + (theme) => ({ backgroundImage: - 'radial-gradient(at 70% 51%, hsla(210, 100%, 16%, 0.5), hsl(220, 30%, 5%))', + 'radial-gradient(ellipse at 70% 51%, hsl(210, 100%, 97%), hsl(0, 0%, 100%))', + backgroundSize: 'cover', + ...theme.applyStyles('dark', { + backgroundImage: + 'radial-gradient(at 70% 51%, hsla(210, 100%, 16%, 0.5), hsl(220, 30%, 5%))', + }), }), - }), - ]} - > - <Stack - direction="row" - sx={{ - justifyContent: 'space-between', - position: { sm: 'static', md: 'fixed' }, - width: '100%', - p: { xs: 2, sm: 4 }, - }} + ]} > - <Button - startIcon={<ArrowBackRoundedIcon />} - component="a" - href="/material-ui/getting-started/templates/" + <Stack + direction={{ xs: 'column-reverse', md: 'row' }} + sx={{ + justifyContent: 'center', + gap: { xs: 6, sm: 12 }, + p: 2, + m: 'auto', + }} > - Back - </Button> - <ToggleColorMode - data-screenshot="toggle-mode" - mode={mode} - toggleColorMode={toggleColorMode} - /> - </Stack> - <Stack - direction={{ xs: 'column-reverse', md: 'row' }} - sx={{ - justifyContent: 'center', - gap: { xs: 6, sm: 12 }, - height: { xs: '100%', md: '100dvh' }, - p: 2, - }} - > - <Content /> - <SignInCard /> + <Content /> + <SignInCard /> + </Stack> </Stack> - </Stack> - <ToggleCustomTheme - showCustomTheme={showCustomTheme} - toggleCustomTheme={toggleCustomTheme} - /> - </ThemeProvider> + </ThemeProvider> + </TemplateFrame> ); } diff --git a/docs/data/material/getting-started/templates/sign-in-side/SignInSide.tsx b/docs/data/material/getting-started/templates/sign-in-side/SignInSide.tsx index 651af2589a0354..ed202630073b53 100644 --- a/docs/data/material/getting-started/templates/sign-in-side/SignInSide.tsx +++ b/docs/data/material/getting-started/templates/sign-in-side/SignInSide.tsx @@ -1,64 +1,11 @@ import * as React from 'react'; -import Box from '@mui/material/Box'; -import Button from '@mui/material/Button'; import CssBaseline from '@mui/material/CssBaseline'; import Stack from '@mui/material/Stack'; -import ToggleButton from '@mui/material/ToggleButton'; -import ToggleButtonGroup from '@mui/material/ToggleButtonGroup'; import { createTheme, ThemeProvider, PaletteMode } from '@mui/material/styles'; - -import ArrowBackRoundedIcon from '@mui/icons-material/ArrowBackRounded'; -import AutoAwesomeRoundedIcon from '@mui/icons-material/AutoAwesomeRounded'; - import getSignInSideTheme from './theme/getSignInSideTheme'; -import ToggleColorMode from './ToggleColorMode'; import SignInCard from './SignInCard'; import Content from './Content'; - -interface ToggleCustomThemeProps { - showCustomTheme: Boolean; - toggleCustomTheme: () => void; -} - -function ToggleCustomTheme({ - showCustomTheme, - toggleCustomTheme, -}: ToggleCustomThemeProps) { - return ( - <Box - sx={{ - display: 'flex', - flexDirection: 'column', - alignItems: 'center', - width: '100dvw', - position: 'fixed', - bottom: 24, - }} - > - <ToggleButtonGroup - color="primary" - exclusive - value={showCustomTheme} - onChange={toggleCustomTheme} - aria-label="Toggle design language" - sx={{ - backgroundColor: 'background.default', - '& .Mui-selected': { - pointerEvents: 'none', - }, - }} - > - <ToggleButton value> - <AutoAwesomeRoundedIcon sx={{ fontSize: '20px', mr: 1 }} /> - Custom theme - </ToggleButton> - <ToggleButton data-screenshot="toggle-default-theme" value={false}> - Material Design 2 - </ToggleButton> - </ToggleButtonGroup> - </Box> - ); -} +import TemplateFrame from './TemplateFrame'; export default function SignInSide() { const [mode, setMode] = React.useState<PaletteMode>('light'); @@ -91,67 +38,47 @@ export default function SignInSide() { }; return ( - <ThemeProvider theme={showCustomTheme ? SignInSideTheme : defaultTheme}> - <CssBaseline /> - <Stack - direction="column" - component="main" - sx={[ - { - justifyContent: 'space-between', - }, - (theme) => ({ - backgroundImage: - 'radial-gradient(ellipse at 70% 51%, hsl(210, 100%, 97%), hsl(0, 0%, 100%))', - backgroundSize: 'cover', - height: { xs: 'auto', md: '100dvh' }, - pb: { xs: 12, sm: 0 }, - ...theme.applyStyles('dark', { + <TemplateFrame + toggleCustomTheme={toggleCustomTheme} + showCustomTheme={showCustomTheme} + mode={mode} + toggleColorMode={toggleColorMode} + > + <ThemeProvider theme={showCustomTheme ? SignInSideTheme : defaultTheme}> + <CssBaseline enableColorScheme /> + <Stack + direction="column" + component="main" + sx={[ + { + justifyContent: 'space-between', + height: { xs: 'auto', md: '100%' }, + }, + (theme) => ({ backgroundImage: - 'radial-gradient(at 70% 51%, hsla(210, 100%, 16%, 0.5), hsl(220, 30%, 5%))', + 'radial-gradient(ellipse at 70% 51%, hsl(210, 100%, 97%), hsl(0, 0%, 100%))', + backgroundSize: 'cover', + ...theme.applyStyles('dark', { + backgroundImage: + 'radial-gradient(at 70% 51%, hsla(210, 100%, 16%, 0.5), hsl(220, 30%, 5%))', + }), }), - }), - ]} - > - <Stack - direction="row" - sx={{ - justifyContent: 'space-between', - position: { sm: 'static', md: 'fixed' }, - width: '100%', - p: { xs: 2, sm: 4 }, - }} + ]} > - <Button - startIcon={<ArrowBackRoundedIcon />} - component="a" - href="/material-ui/getting-started/templates/" + <Stack + direction={{ xs: 'column-reverse', md: 'row' }} + sx={{ + justifyContent: 'center', + gap: { xs: 6, sm: 12 }, + p: 2, + m: 'auto', + }} > - Back - </Button> - <ToggleColorMode - data-screenshot="toggle-mode" - mode={mode} - toggleColorMode={toggleColorMode} - /> - </Stack> - <Stack - direction={{ xs: 'column-reverse', md: 'row' }} - sx={{ - justifyContent: 'center', - gap: { xs: 6, sm: 12 }, - height: { xs: '100%', md: '100dvh' }, - p: 2, - }} - > - <Content /> - <SignInCard /> + <Content /> + <SignInCard /> + </Stack> </Stack> - </Stack> - <ToggleCustomTheme - showCustomTheme={showCustomTheme} - toggleCustomTheme={toggleCustomTheme} - /> - </ThemeProvider> + </ThemeProvider> + </TemplateFrame> ); } diff --git a/docs/data/material/getting-started/templates/sign-in-side/TemplateFrame.js b/docs/data/material/getting-started/templates/sign-in-side/TemplateFrame.js new file mode 100644 index 00000000000000..8a352720511cfd --- /dev/null +++ b/docs/data/material/getting-started/templates/sign-in-side/TemplateFrame.js @@ -0,0 +1,113 @@ +import * as React from 'react'; +import PropTypes from 'prop-types'; +import { createTheme, ThemeProvider, styled } from '@mui/material/styles'; +import Select from '@mui/material/Select'; +import MenuItem from '@mui/material/MenuItem'; +import FormControl from '@mui/material/FormControl'; +import Button from '@mui/material/Button'; +import IconButton from '@mui/material/IconButton'; +import Box from '@mui/material/Box'; +import AppBar from '@mui/material/AppBar'; +import Toolbar from '@mui/material/Toolbar'; +import ArrowBackRoundedIcon from '@mui/icons-material/ArrowBackRounded'; +import ToggleColorMode from './ToggleColorMode'; +import getSignInSideTheme from './theme/getSignInSideTheme'; + +const StyledAppBar = styled(AppBar)(({ theme }) => ({ + position: 'relative', + display: 'flex', + alignItems: 'center', + justifyContent: 'space-between', + flexShrink: 0, + borderBottom: '1px solid', + borderColor: theme.palette.divider, + backgroundColor: theme.palette.background.paper, + boxShadow: 'none', + backgroundImage: 'none', + zIndex: theme.zIndex.drawer + 1, + flex: '0 0 auto', +})); + +function TemplateFrame({ + showCustomTheme, + toggleCustomTheme, + mode, + toggleColorMode, + children, +}) { + const handleChange = (event) => { + toggleCustomTheme(event.target.value === 'custom'); + }; + const signInSideTheme = createTheme(getSignInSideTheme(mode)); + + return ( + <ThemeProvider theme={signInSideTheme}> + <Box sx={{ height: '100dvh', display: 'flex', flexDirection: 'column' }}> + <StyledAppBar> + <Toolbar + variant="dense" + disableGutters + sx={{ + display: 'flex', + justifyContent: 'space-between', + width: '100%', + p: '8px 12px', + }} + > + <Button + variant="text" + size="small" + aria-label="Back to templates" + startIcon={<ArrowBackRoundedIcon />} + component="a" + href="/material-ui/getting-started/templates/" + sx={{ display: { xs: 'none', sm: 'flex' } }} + > + Back to templates + </Button> + <IconButton + size="small" + aria-label="Back to templates" + component="a" + href="/material-ui/getting-started/templates/" + sx={{ display: { xs: 'auto', sm: 'none' } }} + > + <ArrowBackRoundedIcon /> + </IconButton> + <Box sx={{ display: 'flex', gap: 1 }}> + <FormControl variant="outlined" sx={{ minWidth: 180 }}> + <Select + size="small" + labelId="theme-select-label" + id="theme-select" + value={showCustomTheme ? 'custom' : 'material'} + onChange={handleChange} + label="Design Language" + > + <MenuItem value="custom">Custom Theme</MenuItem> + <MenuItem value="material">Material Design 2</MenuItem> + </Select> + </FormControl> + <ToggleColorMode + data-screenshot="toggle-mode" + mode={mode} + toggleColorMode={toggleColorMode} + /> + </Box> + </Toolbar> + </StyledAppBar> + <Box sx={{ flex: '1 1', overflow: 'auto' }}>{children}</Box> + </Box> + </ThemeProvider> + ); +} + +TemplateFrame.propTypes = { + children: PropTypes.node, + mode: PropTypes.oneOf(['dark', 'light']).isRequired, + showCustomTheme: PropTypes.bool.isRequired, + toggleColorMode: PropTypes.func.isRequired, + toggleCustomTheme: PropTypes.func.isRequired, +}; + +export default TemplateFrame; diff --git a/docs/data/material/getting-started/templates/sign-in-side/TemplateFrame.tsx b/docs/data/material/getting-started/templates/sign-in-side/TemplateFrame.tsx new file mode 100644 index 00000000000000..248480242da1f3 --- /dev/null +++ b/docs/data/material/getting-started/templates/sign-in-side/TemplateFrame.tsx @@ -0,0 +1,115 @@ +import * as React from 'react'; +import { + createTheme, + ThemeProvider, + PaletteMode, + styled, +} from '@mui/material/styles'; +import Select, { SelectChangeEvent } from '@mui/material/Select'; +import MenuItem from '@mui/material/MenuItem'; +import FormControl from '@mui/material/FormControl'; +import Button from '@mui/material/Button'; +import IconButton from '@mui/material/IconButton'; +import Box from '@mui/material/Box'; +import AppBar from '@mui/material/AppBar'; +import Toolbar from '@mui/material/Toolbar'; +import ArrowBackRoundedIcon from '@mui/icons-material/ArrowBackRounded'; +import ToggleColorMode from './ToggleColorMode'; +import getSignInSideTheme from './theme/getSignInSideTheme'; + +const StyledAppBar = styled(AppBar)(({ theme }) => ({ + position: 'relative', + display: 'flex', + alignItems: 'center', + justifyContent: 'space-between', + flexShrink: 0, + borderBottom: '1px solid', + borderColor: theme.palette.divider, + backgroundColor: theme.palette.background.paper, + boxShadow: 'none', + backgroundImage: 'none', + zIndex: theme.zIndex.drawer + 1, + flex: '0 0 auto', +})); + +interface TemplateFrameProps { + showCustomTheme: boolean; + toggleCustomTheme: (theme: boolean) => void; + mode: PaletteMode; + toggleColorMode: () => void; + children: React.ReactNode; +} + +export default function TemplateFrame({ + showCustomTheme, + toggleCustomTheme, + mode, + toggleColorMode, + children, +}: TemplateFrameProps) { + const handleChange = (event: SelectChangeEvent) => { + toggleCustomTheme(event.target.value === 'custom'); + }; + const signInSideTheme = createTheme(getSignInSideTheme(mode)); + + return ( + <ThemeProvider theme={signInSideTheme}> + <Box sx={{ height: '100dvh', display: 'flex', flexDirection: 'column' }}> + <StyledAppBar> + <Toolbar + variant="dense" + disableGutters + sx={{ + display: 'flex', + justifyContent: 'space-between', + width: '100%', + p: '8px 12px', + }} + > + <Button + variant="text" + size="small" + aria-label="Back to templates" + startIcon={<ArrowBackRoundedIcon />} + component="a" + href="/material-ui/getting-started/templates/" + sx={{ display: { xs: 'none', sm: 'flex' } }} + > + Back to templates + </Button> + <IconButton + size="small" + aria-label="Back to templates" + component="a" + href="/material-ui/getting-started/templates/" + sx={{ display: { xs: 'auto', sm: 'none' } }} + > + <ArrowBackRoundedIcon /> + </IconButton> + <Box sx={{ display: 'flex', gap: 1 }}> + <FormControl variant="outlined" sx={{ minWidth: 180 }}> + <Select + size="small" + labelId="theme-select-label" + id="theme-select" + value={showCustomTheme ? 'custom' : 'material'} + onChange={handleChange} + label="Design Language" + > + <MenuItem value="custom">Custom Theme</MenuItem> + <MenuItem value="material">Material Design 2</MenuItem> + </Select> + </FormControl> + <ToggleColorMode + data-screenshot="toggle-mode" + mode={mode} + toggleColorMode={toggleColorMode} + /> + </Box> + </Toolbar> + </StyledAppBar> + <Box sx={{ flex: '1 1', overflow: 'auto' }}>{children}</Box> + </Box> + </ThemeProvider> + ); +} diff --git a/docs/data/material/getting-started/templates/sign-in-side/ToggleColorMode.js b/docs/data/material/getting-started/templates/sign-in-side/ToggleColorMode.js index ef5bf33fef968f..f578f75b2d92a6 100644 --- a/docs/data/material/getting-started/templates/sign-in-side/ToggleColorMode.js +++ b/docs/data/material/getting-started/templates/sign-in-side/ToggleColorMode.js @@ -10,6 +10,7 @@ function ToggleColorMode({ mode, toggleColorMode, ...props }) { return ( <IconButton onClick={toggleColorMode} + size="small" color="primary" aria-label="Theme toggle button" {...props} diff --git a/docs/data/material/getting-started/templates/sign-in-side/ToggleColorMode.tsx b/docs/data/material/getting-started/templates/sign-in-side/ToggleColorMode.tsx index 313d805383fdff..1de6afce2933ac 100644 --- a/docs/data/material/getting-started/templates/sign-in-side/ToggleColorMode.tsx +++ b/docs/data/material/getting-started/templates/sign-in-side/ToggleColorMode.tsx @@ -19,6 +19,7 @@ export default function ToggleColorMode({ return ( <IconButton onClick={toggleColorMode} + size="small" color="primary" aria-label="Theme toggle button" {...props} diff --git a/docs/data/material/getting-started/templates/sign-in-side/theme/themePrimitives.js b/docs/data/material/getting-started/templates/sign-in-side/theme/themePrimitives.js index 1894b11b326f0c..625400640eef43 100644 --- a/docs/data/material/getting-started/templates/sign-in-side/theme/themePrimitives.js +++ b/docs/data/material/getting-started/templates/sign-in-side/theme/themePrimitives.js @@ -1,6 +1,8 @@ import { createTheme, alpha } from '@mui/material/styles'; -const customTheme = createTheme(); +const defaultTheme = createTheme(); + +const customShadows = [...defaultTheme.shadows]; export const brand = { 50: 'hsl(210, 100%, 95%)', @@ -67,143 +69,148 @@ export const red = { 900: 'hsl(0, 93%, 6%)', }; -export const getDesignTokens = (mode) => ({ - palette: { - mode, - primary: { - light: brand[200], - main: brand[400], - dark: brand[700], - contrastText: brand[50], - ...(mode === 'dark' && { - contrastText: brand[50], - light: brand[300], +export const getDesignTokens = (mode) => { + customShadows[1] = + mode === 'dark' + ? 'hsla(220, 30%, 5%, 0.7) 0px 4px 16px 0px, hsla(220, 25%, 10%, 0.8) 0px 8px 16px -5px' + : 'hsla(220, 30%, 5%, 0.07) 0px 4px 16px 0px, hsla(220, 25%, 10%, 0.07) 0px 8px 16px -5px'; + + return { + palette: { + mode, + primary: { + light: brand[200], main: brand[400], dark: brand[700], - }), - }, - info: { - light: brand[100], - main: brand[300], - dark: brand[600], - contrastText: gray[50], - ...(mode === 'dark' && { - contrastText: brand[300], - light: brand[500], - main: brand[700], - dark: brand[900], - }), - }, - warning: { - light: orange[300], - main: orange[400], - dark: orange[800], - ...(mode === 'dark' && { - light: orange[400], - main: orange[500], - dark: orange[700], - }), - }, - error: { - light: red[300], - main: red[400], - dark: red[800], - ...(mode === 'dark' && { - light: red[400], - main: red[500], - dark: red[700], - }), - }, - success: { - light: green[300], - main: green[400], - dark: green[800], - ...(mode === 'dark' && { - light: green[400], - main: green[500], - dark: green[700], - }), - }, - grey: { - ...gray, - }, - divider: mode === 'dark' ? alpha(gray[700], 0.6) : alpha(gray[300], 0.4), - background: { - default: 'hsl(0, 0%, 99%)', - paper: 'hsl(220, 35%, 97%)', - ...(mode === 'dark' && { default: gray[900], paper: 'hsl(220, 30%, 7%)' }), - }, - text: { - primary: gray[800], - secondary: gray[600], - warning: orange[400], - ...(mode === 'dark' && { primary: 'hsl(0, 0%, 100%)', secondary: gray[400] }), - }, - action: { - hover: alpha(gray[200], 0.2), - selected: `${alpha(gray[200], 0.3)}`, - ...(mode === 'dark' && { - hover: alpha(gray[600], 0.2), - selected: alpha(gray[600], 0.3), - }), - }, - }, - typography: { - fontFamily: ['"Inter", "sans-serif"'].join(','), - h1: { - fontSize: customTheme.typography.pxToRem(48), - fontWeight: 600, - lineHeight: 1.2, - letterSpacing: -0.5, - }, - h2: { - fontSize: customTheme.typography.pxToRem(36), - fontWeight: 600, - lineHeight: 1.2, - }, - h3: { - fontSize: customTheme.typography.pxToRem(30), - lineHeight: 1.2, - }, - h4: { - fontSize: customTheme.typography.pxToRem(24), - fontWeight: 600, - lineHeight: 1.5, - }, - h5: { - fontSize: customTheme.typography.pxToRem(20), - fontWeight: 600, - }, - h6: { - fontSize: customTheme.typography.pxToRem(18), - fontWeight: 600, - }, - subtitle1: { - fontSize: customTheme.typography.pxToRem(18), - }, - subtitle2: { - fontSize: customTheme.typography.pxToRem(14), - fontWeight: 500, - }, - body1: { - fontSize: customTheme.typography.pxToRem(14), - }, - body2: { - fontSize: customTheme.typography.pxToRem(14), - fontWeight: 400, - }, - caption: { - fontSize: customTheme.typography.pxToRem(12), - fontWeight: 400, - }, - }, - shape: { - borderRadius: 8, - }, - shadows: [ - 'none', - ...(mode === 'dark' - ? 'hsla(220, 30%, 5%, 0.7) 0px 4px 16px 0px, hsla(220, 25%, 10%, 0.8) 0px 8px 16px -5px' - : 'hsla(220, 30%, 5%, 0.07) 0px 4px 16px 0px, hsla(220, 25%, 10%, 0.07) 0px 8px 16px -5px'), - ], -}); + contrastText: brand[50], + ...(mode === 'dark' && { + contrastText: brand[50], + light: brand[300], + main: brand[400], + dark: brand[700], + }), + }, + info: { + light: brand[100], + main: brand[300], + dark: brand[600], + contrastText: gray[50], + ...(mode === 'dark' && { + contrastText: brand[300], + light: brand[500], + main: brand[700], + dark: brand[900], + }), + }, + warning: { + light: orange[300], + main: orange[400], + dark: orange[800], + ...(mode === 'dark' && { + light: orange[400], + main: orange[500], + dark: orange[700], + }), + }, + error: { + light: red[300], + main: red[400], + dark: red[800], + ...(mode === 'dark' && { + light: red[400], + main: red[500], + dark: red[700], + }), + }, + success: { + light: green[300], + main: green[400], + dark: green[800], + ...(mode === 'dark' && { + light: green[400], + main: green[500], + dark: green[700], + }), + }, + grey: { + ...gray, + }, + divider: mode === 'dark' ? alpha(gray[700], 0.6) : alpha(gray[300], 0.4), + background: { + default: 'hsl(0, 0%, 99%)', + paper: 'hsl(220, 35%, 97%)', + ...(mode === 'dark' && { default: gray[900], paper: 'hsl(220, 30%, 7%)' }), + }, + text: { + primary: gray[800], + secondary: gray[600], + warning: orange[400], + ...(mode === 'dark' && { + primary: 'hsl(0, 0%, 100%)', + secondary: gray[400], + }), + }, + action: { + hover: alpha(gray[200], 0.2), + selected: `${alpha(gray[200], 0.3)}`, + ...(mode === 'dark' && { + hover: alpha(gray[600], 0.2), + selected: alpha(gray[600], 0.3), + }), + }, + }, + typography: { + fontFamily: ['"Inter", "sans-serif"'].join(','), + h1: { + fontSize: defaultTheme.typography.pxToRem(48), + fontWeight: 600, + lineHeight: 1.2, + letterSpacing: -0.5, + }, + h2: { + fontSize: defaultTheme.typography.pxToRem(36), + fontWeight: 600, + lineHeight: 1.2, + }, + h3: { + fontSize: defaultTheme.typography.pxToRem(30), + lineHeight: 1.2, + }, + h4: { + fontSize: defaultTheme.typography.pxToRem(24), + fontWeight: 600, + lineHeight: 1.5, + }, + h5: { + fontSize: defaultTheme.typography.pxToRem(20), + fontWeight: 600, + }, + h6: { + fontSize: defaultTheme.typography.pxToRem(18), + fontWeight: 600, + }, + subtitle1: { + fontSize: defaultTheme.typography.pxToRem(18), + }, + subtitle2: { + fontSize: defaultTheme.typography.pxToRem(14), + fontWeight: 500, + }, + body1: { + fontSize: defaultTheme.typography.pxToRem(14), + }, + body2: { + fontSize: defaultTheme.typography.pxToRem(14), + fontWeight: 400, + }, + caption: { + fontSize: defaultTheme.typography.pxToRem(12), + fontWeight: 400, + }, + }, + shape: { + borderRadius: 8, + }, + shadows: customShadows, + }; +}; diff --git a/docs/data/material/getting-started/templates/sign-in-side/theme/themePrimitives.ts b/docs/data/material/getting-started/templates/sign-in-side/theme/themePrimitives.ts index 09df769bb6687d..41b517b5294fad 100644 --- a/docs/data/material/getting-started/templates/sign-in-side/theme/themePrimitives.ts +++ b/docs/data/material/getting-started/templates/sign-in-side/theme/themePrimitives.ts @@ -1,4 +1,4 @@ -import { createTheme, alpha, Shadows, PaletteMode } from '@mui/material/styles'; +import { createTheme, alpha, PaletteMode, Shadows } from '@mui/material/styles'; declare module '@mui/material/Paper' { interface PaperPropsVariantOverrides { @@ -22,7 +22,9 @@ declare module '@mui/material/styles/createPalette' { interface PaletteColor extends ColorRange {} } -const customTheme = createTheme(); +const defaultTheme = createTheme(); + +const customShadows: Shadows = [...defaultTheme.shadows]; export const brand = { 50: 'hsl(210, 100%, 95%)', @@ -89,143 +91,145 @@ export const red = { 900: 'hsl(0, 93%, 6%)', }; -export const getDesignTokens = (mode: PaletteMode) => ({ - palette: { - mode, - primary: { - light: brand[200], - main: brand[400], - dark: brand[700], - contrastText: brand[50], - ...(mode === 'dark' && { - contrastText: brand[50], - light: brand[300], +export const getDesignTokens = (mode: PaletteMode) => { + customShadows[1] = + mode === 'dark' + ? 'hsla(220, 30%, 5%, 0.7) 0px 4px 16px 0px, hsla(220, 25%, 10%, 0.8) 0px 8px 16px -5px' + : 'hsla(220, 30%, 5%, 0.07) 0px 4px 16px 0px, hsla(220, 25%, 10%, 0.07) 0px 8px 16px -5px'; + + return { + palette: { + mode, + primary: { + light: brand[200], main: brand[400], dark: brand[700], - }), - }, - info: { - light: brand[100], - main: brand[300], - dark: brand[600], - contrastText: gray[50], - ...(mode === 'dark' && { - contrastText: brand[300], - light: brand[500], - main: brand[700], - dark: brand[900], - }), - }, - warning: { - light: orange[300], - main: orange[400], - dark: orange[800], - ...(mode === 'dark' && { - light: orange[400], - main: orange[500], - dark: orange[700], - }), - }, - error: { - light: red[300], - main: red[400], - dark: red[800], - ...(mode === 'dark' && { - light: red[400], - main: red[500], - dark: red[700], - }), - }, - success: { - light: green[300], - main: green[400], - dark: green[800], - ...(mode === 'dark' && { - light: green[400], - main: green[500], - dark: green[700], - }), - }, - grey: { - ...gray, - }, - divider: mode === 'dark' ? alpha(gray[700], 0.6) : alpha(gray[300], 0.4), - background: { - default: 'hsl(0, 0%, 99%)', - paper: 'hsl(220, 35%, 97%)', - ...(mode === 'dark' && { default: gray[900], paper: 'hsl(220, 30%, 7%)' }), - }, - text: { - primary: gray[800], - secondary: gray[600], - warning: orange[400], - ...(mode === 'dark' && { primary: 'hsl(0, 0%, 100%)', secondary: gray[400] }), - }, - action: { - hover: alpha(gray[200], 0.2), - selected: `${alpha(gray[200], 0.3)}`, - ...(mode === 'dark' && { - hover: alpha(gray[600], 0.2), - selected: alpha(gray[600], 0.3), - }), - }, - }, - typography: { - fontFamily: ['"Inter", "sans-serif"'].join(','), - h1: { - fontSize: customTheme.typography.pxToRem(48), - fontWeight: 600, - lineHeight: 1.2, - letterSpacing: -0.5, - }, - h2: { - fontSize: customTheme.typography.pxToRem(36), - fontWeight: 600, - lineHeight: 1.2, - }, - h3: { - fontSize: customTheme.typography.pxToRem(30), - lineHeight: 1.2, - }, - h4: { - fontSize: customTheme.typography.pxToRem(24), - fontWeight: 600, - lineHeight: 1.5, - }, - h5: { - fontSize: customTheme.typography.pxToRem(20), - fontWeight: 600, - }, - h6: { - fontSize: customTheme.typography.pxToRem(18), - fontWeight: 600, - }, - subtitle1: { - fontSize: customTheme.typography.pxToRem(18), - }, - subtitle2: { - fontSize: customTheme.typography.pxToRem(14), - fontWeight: 500, - }, - body1: { - fontSize: customTheme.typography.pxToRem(14), - }, - body2: { - fontSize: customTheme.typography.pxToRem(14), - fontWeight: 400, - }, - caption: { - fontSize: customTheme.typography.pxToRem(12), - fontWeight: 400, - }, - }, - shape: { - borderRadius: 8, - }, - shadows: [ - 'none', - ...(mode === 'dark' - ? 'hsla(220, 30%, 5%, 0.7) 0px 4px 16px 0px, hsla(220, 25%, 10%, 0.8) 0px 8px 16px -5px' - : 'hsla(220, 30%, 5%, 0.07) 0px 4px 16px 0px, hsla(220, 25%, 10%, 0.07) 0px 8px 16px -5px'), - ] as Shadows, -}); + contrastText: brand[50], + ...(mode === 'dark' && { + contrastText: brand[50], + light: brand[300], + main: brand[400], + dark: brand[700], + }), + }, + info: { + light: brand[100], + main: brand[300], + dark: brand[600], + contrastText: gray[50], + ...(mode === 'dark' && { + contrastText: brand[300], + light: brand[500], + main: brand[700], + dark: brand[900], + }), + }, + warning: { + light: orange[300], + main: orange[400], + dark: orange[800], + ...(mode === 'dark' && { + light: orange[400], + main: orange[500], + dark: orange[700], + }), + }, + error: { + light: red[300], + main: red[400], + dark: red[800], + ...(mode === 'dark' && { + light: red[400], + main: red[500], + dark: red[700], + }), + }, + success: { + light: green[300], + main: green[400], + dark: green[800], + ...(mode === 'dark' && { + light: green[400], + main: green[500], + dark: green[700], + }), + }, + grey: { + ...gray, + }, + divider: mode === 'dark' ? alpha(gray[700], 0.6) : alpha(gray[300], 0.4), + background: { + default: 'hsl(0, 0%, 99%)', + paper: 'hsl(220, 35%, 97%)', + ...(mode === 'dark' && { default: gray[900], paper: 'hsl(220, 30%, 7%)' }), + }, + text: { + primary: gray[800], + secondary: gray[600], + warning: orange[400], + ...(mode === 'dark' && { primary: 'hsl(0, 0%, 100%)', secondary: gray[400] }), + }, + action: { + hover: alpha(gray[200], 0.2), + selected: `${alpha(gray[200], 0.3)}`, + ...(mode === 'dark' && { + hover: alpha(gray[600], 0.2), + selected: alpha(gray[600], 0.3), + }), + }, + }, + typography: { + fontFamily: ['"Inter", "sans-serif"'].join(','), + h1: { + fontSize: defaultTheme.typography.pxToRem(48), + fontWeight: 600, + lineHeight: 1.2, + letterSpacing: -0.5, + }, + h2: { + fontSize: defaultTheme.typography.pxToRem(36), + fontWeight: 600, + lineHeight: 1.2, + }, + h3: { + fontSize: defaultTheme.typography.pxToRem(30), + lineHeight: 1.2, + }, + h4: { + fontSize: defaultTheme.typography.pxToRem(24), + fontWeight: 600, + lineHeight: 1.5, + }, + h5: { + fontSize: defaultTheme.typography.pxToRem(20), + fontWeight: 600, + }, + h6: { + fontSize: defaultTheme.typography.pxToRem(18), + fontWeight: 600, + }, + subtitle1: { + fontSize: defaultTheme.typography.pxToRem(18), + }, + subtitle2: { + fontSize: defaultTheme.typography.pxToRem(14), + fontWeight: 500, + }, + body1: { + fontSize: defaultTheme.typography.pxToRem(14), + }, + body2: { + fontSize: defaultTheme.typography.pxToRem(14), + fontWeight: 400, + }, + caption: { + fontSize: defaultTheme.typography.pxToRem(12), + fontWeight: 400, + }, + }, + shape: { + borderRadius: 8, + }, + shadows: customShadows, + }; +}; diff --git a/docs/data/material/getting-started/templates/sign-in/README.md b/docs/data/material/getting-started/templates/sign-in/README.md index f9de61277a45c7..7ad1e840c69051 100644 --- a/docs/data/material/getting-started/templates/sign-in/README.md +++ b/docs/data/material/getting-started/templates/sign-in/README.md @@ -4,7 +4,7 @@ <!-- #default-branch-switch --> -1. Copy the files into your project, or one of the [example projects](https://github.com/mui/material-ui/tree/next/examples). +1. Copy the files into your project, or one of the [example projects](https://github.com/mui/material-ui/tree/master/examples). 2. Make sure your project has the required dependencies: @mui/material, @mui/icons-material, @emotion/styled, @emotion/react. 3. Import and use the `SignIn` component. @@ -12,4 +12,4 @@ <!-- #default-branch-switch --> -View the demo at https://next.mui.com/material-ui/getting-started/templates/sign-in/. +View the demo at https://mui.com/material-ui/getting-started/templates/sign-in/. diff --git a/docs/data/material/getting-started/templates/sign-in/SignIn.js b/docs/data/material/getting-started/templates/sign-in/SignIn.js index 685c79925e6033..c7963f131aec18 100644 --- a/docs/data/material/getting-started/templates/sign-in/SignIn.js +++ b/docs/data/material/getting-started/templates/sign-in/SignIn.js @@ -1,5 +1,4 @@ import * as React from 'react'; -import PropTypes from 'prop-types'; import Box from '@mui/material/Box'; import Button from '@mui/material/Button'; import Checkbox from '@mui/material/Checkbox'; @@ -10,64 +9,14 @@ import FormLabel from '@mui/material/FormLabel'; import FormControl from '@mui/material/FormControl'; import Link from '@mui/material/Link'; import TextField from '@mui/material/TextField'; -import ToggleButton from '@mui/material/ToggleButton'; -import ToggleButtonGroup from '@mui/material/ToggleButtonGroup'; import Typography from '@mui/material/Typography'; import Stack from '@mui/material/Stack'; import MuiCard from '@mui/material/Card'; import { ThemeProvider, createTheme, styled } from '@mui/material/styles'; - -import ArrowBackRoundedIcon from '@mui/icons-material/ArrowBackRounded'; -import AutoAwesomeRoundedIcon from '@mui/icons-material/AutoAwesomeRounded'; - import ForgotPassword from './ForgotPassword'; import getSignInTheme from './theme/getSignInTheme'; -import ToggleColorMode from './ToggleColorMode'; import { GoogleIcon, FacebookIcon, SitemarkIcon } from './CustomIcons'; - -function ToggleCustomTheme({ showCustomTheme, toggleCustomTheme }) { - return ( - <Box - sx={{ - display: 'flex', - flexDirection: 'column', - alignItems: 'center', - width: '100dvw', - position: 'fixed', - bottom: 24, - }} - > - <ToggleButtonGroup - color="primary" - exclusive - value={showCustomTheme} - onChange={toggleCustomTheme} - aria-label="Toggle design language" - sx={{ - backgroundColor: 'background.default', - '& .Mui-selected': { - pointerEvents: 'none', - }, - }} - > - <ToggleButton value> - <AutoAwesomeRoundedIcon sx={{ fontSize: '20px', mr: 1 }} /> - Custom theme - </ToggleButton> - <ToggleButton data-screenshot="toggle-default-theme" value={false}> - Material Design 2 - </ToggleButton> - </ToggleButtonGroup> - </Box> - ); -} - -ToggleCustomTheme.propTypes = { - showCustomTheme: PropTypes.shape({ - valueOf: PropTypes.func.isRequired, - }).isRequired, - toggleCustomTheme: PropTypes.func.isRequired, -}; +import TemplateFrame from './TemplateFrame'; const Card = styled(MuiCard)(({ theme }) => ({ display: 'flex', @@ -76,8 +25,9 @@ const Card = styled(MuiCard)(({ theme }) => ({ width: '100%', padding: theme.spacing(4), gap: theme.spacing(2), + margin: 'auto', [theme.breakpoints.up('sm')]: { - width: '450px', + maxWidth: '450px', }, boxShadow: 'hsla(220, 30%, 5%, 0.05) 0px 5px 15px 0px, hsla(220, 25%, 10%, 0.05) 0px 15px 35px -5px', @@ -88,15 +38,11 @@ const Card = styled(MuiCard)(({ theme }) => ({ })); const SignInContainer = styled(Stack)(({ theme }) => ({ - height: 'auto', - paddingBottom: theme.spacing(12), + height: '100%', + padding: 20, backgroundImage: 'radial-gradient(ellipse at 50% 50%, hsl(210, 100%, 97%), hsl(0, 0%, 100%))', backgroundRepeat: 'no-repeat', - [theme.breakpoints.up('sm')]: { - paddingBottom: 0, - height: '100dvh', - }, ...theme.applyStyles('dark', { backgroundImage: 'radial-gradient(at 50% 50%, hsla(210, 100%, 16%, 0.5), hsl(220, 30%, 5%))', @@ -184,38 +130,15 @@ export default function SignIn() { }; return ( - <ThemeProvider theme={showCustomTheme ? SignInTheme : defaultTheme}> - <CssBaseline /> - <SignInContainer direction="column" justifyContent="space-between"> - <Stack - direction="row" - sx={{ - justifyContent: 'space-between', - position: { xs: 'static', sm: 'fixed' }, - width: '100%', - p: { xs: 2, sm: 4 }, - }} - > - <Button - startIcon={<ArrowBackRoundedIcon />} - component="a" - href="/material-ui/getting-started/templates/" - > - Back - </Button> - <ToggleColorMode - data-screenshot="toggle-mode" - mode={mode} - toggleColorMode={toggleColorMode} - /> - </Stack> - <Stack - sx={{ - justifyContent: 'center', - height: { xs: '100%', sm: '100dvh' }, - p: 2, - }} - > + <TemplateFrame + toggleCustomTheme={toggleCustomTheme} + showCustomTheme={showCustomTheme} + mode={mode} + toggleColorMode={toggleColorMode} + > + <ThemeProvider theme={showCustomTheme ? SignInTheme : defaultTheme}> + <CssBaseline enableColorScheme /> + <SignInContainer direction="column" justifyContent="space-between"> <Card variant="outlined"> <SitemarkIcon /> <Typography @@ -329,12 +252,8 @@ export default function SignIn() { </Button> </Box> </Card> - </Stack> - </SignInContainer> - <ToggleCustomTheme - showCustomTheme={showCustomTheme} - toggleCustomTheme={toggleCustomTheme} - /> - </ThemeProvider> + </SignInContainer> + </ThemeProvider> + </TemplateFrame> ); } diff --git a/docs/data/material/getting-started/templates/sign-in/SignIn.tsx b/docs/data/material/getting-started/templates/sign-in/SignIn.tsx index 6bf8c3861e58fe..dda0da4471c689 100644 --- a/docs/data/material/getting-started/templates/sign-in/SignIn.tsx +++ b/docs/data/material/getting-started/templates/sign-in/SignIn.tsx @@ -9,8 +9,6 @@ import FormLabel from '@mui/material/FormLabel'; import FormControl from '@mui/material/FormControl'; import Link from '@mui/material/Link'; import TextField from '@mui/material/TextField'; -import ToggleButton from '@mui/material/ToggleButton'; -import ToggleButtonGroup from '@mui/material/ToggleButtonGroup'; import Typography from '@mui/material/Typography'; import Stack from '@mui/material/Stack'; import MuiCard from '@mui/material/Card'; @@ -20,59 +18,10 @@ import { styled, PaletteMode, } from '@mui/material/styles'; - -import ArrowBackRoundedIcon from '@mui/icons-material/ArrowBackRounded'; -import AutoAwesomeRoundedIcon from '@mui/icons-material/AutoAwesomeRounded'; - import ForgotPassword from './ForgotPassword'; import getSignInTheme from './theme/getSignInTheme'; -import ToggleColorMode from './ToggleColorMode'; import { GoogleIcon, FacebookIcon, SitemarkIcon } from './CustomIcons'; - -interface ToggleCustomThemeProps { - showCustomTheme: Boolean; - toggleCustomTheme: () => void; -} - -function ToggleCustomTheme({ - showCustomTheme, - toggleCustomTheme, -}: ToggleCustomThemeProps) { - return ( - <Box - sx={{ - display: 'flex', - flexDirection: 'column', - alignItems: 'center', - width: '100dvw', - position: 'fixed', - bottom: 24, - }} - > - <ToggleButtonGroup - color="primary" - exclusive - value={showCustomTheme} - onChange={toggleCustomTheme} - aria-label="Toggle design language" - sx={{ - backgroundColor: 'background.default', - '& .Mui-selected': { - pointerEvents: 'none', - }, - }} - > - <ToggleButton value> - <AutoAwesomeRoundedIcon sx={{ fontSize: '20px', mr: 1 }} /> - Custom theme - </ToggleButton> - <ToggleButton data-screenshot="toggle-default-theme" value={false}> - Material Design 2 - </ToggleButton> - </ToggleButtonGroup> - </Box> - ); -} +import TemplateFrame from './TemplateFrame'; const Card = styled(MuiCard)(({ theme }) => ({ display: 'flex', @@ -81,8 +30,9 @@ const Card = styled(MuiCard)(({ theme }) => ({ width: '100%', padding: theme.spacing(4), gap: theme.spacing(2), + margin: 'auto', [theme.breakpoints.up('sm')]: { - width: '450px', + maxWidth: '450px', }, boxShadow: 'hsla(220, 30%, 5%, 0.05) 0px 5px 15px 0px, hsla(220, 25%, 10%, 0.05) 0px 15px 35px -5px', @@ -93,15 +43,11 @@ const Card = styled(MuiCard)(({ theme }) => ({ })); const SignInContainer = styled(Stack)(({ theme }) => ({ - height: 'auto', - paddingBottom: theme.spacing(12), + height: '100%', + padding: 20, backgroundImage: 'radial-gradient(ellipse at 50% 50%, hsl(210, 100%, 97%), hsl(0, 0%, 100%))', backgroundRepeat: 'no-repeat', - [theme.breakpoints.up('sm')]: { - paddingBottom: 0, - height: '100dvh', - }, ...theme.applyStyles('dark', { backgroundImage: 'radial-gradient(at 50% 50%, hsla(210, 100%, 16%, 0.5), hsl(220, 30%, 5%))', @@ -189,38 +135,15 @@ export default function SignIn() { }; return ( - <ThemeProvider theme={showCustomTheme ? SignInTheme : defaultTheme}> - <CssBaseline /> - <SignInContainer direction="column" justifyContent="space-between"> - <Stack - direction="row" - sx={{ - justifyContent: 'space-between', - position: { xs: 'static', sm: 'fixed' }, - width: '100%', - p: { xs: 2, sm: 4 }, - }} - > - <Button - startIcon={<ArrowBackRoundedIcon />} - component="a" - href="/material-ui/getting-started/templates/" - > - Back - </Button> - <ToggleColorMode - data-screenshot="toggle-mode" - mode={mode} - toggleColorMode={toggleColorMode} - /> - </Stack> - <Stack - sx={{ - justifyContent: 'center', - height: { xs: '100%', sm: '100dvh' }, - p: 2, - }} - > + <TemplateFrame + toggleCustomTheme={toggleCustomTheme} + showCustomTheme={showCustomTheme} + mode={mode} + toggleColorMode={toggleColorMode} + > + <ThemeProvider theme={showCustomTheme ? SignInTheme : defaultTheme}> + <CssBaseline enableColorScheme /> + <SignInContainer direction="column" justifyContent="space-between"> <Card variant="outlined"> <SitemarkIcon /> <Typography @@ -334,12 +257,8 @@ export default function SignIn() { </Button> </Box> </Card> - </Stack> - </SignInContainer> - <ToggleCustomTheme - showCustomTheme={showCustomTheme} - toggleCustomTheme={toggleCustomTheme} - /> - </ThemeProvider> + </SignInContainer> + </ThemeProvider> + </TemplateFrame> ); } diff --git a/docs/data/material/getting-started/templates/sign-in/TemplateFrame.js b/docs/data/material/getting-started/templates/sign-in/TemplateFrame.js new file mode 100644 index 00000000000000..2b4f157597c4ec --- /dev/null +++ b/docs/data/material/getting-started/templates/sign-in/TemplateFrame.js @@ -0,0 +1,113 @@ +import * as React from 'react'; +import PropTypes from 'prop-types'; +import { createTheme, ThemeProvider, styled } from '@mui/material/styles'; +import Select from '@mui/material/Select'; +import MenuItem from '@mui/material/MenuItem'; +import FormControl from '@mui/material/FormControl'; +import Button from '@mui/material/Button'; +import IconButton from '@mui/material/IconButton'; +import Box from '@mui/material/Box'; +import AppBar from '@mui/material/AppBar'; +import Toolbar from '@mui/material/Toolbar'; +import ArrowBackRoundedIcon from '@mui/icons-material/ArrowBackRounded'; +import ToggleColorMode from './ToggleColorMode'; +import getSignInTheme from './theme/getSignInTheme'; + +const StyledAppBar = styled(AppBar)(({ theme }) => ({ + position: 'relative', + display: 'flex', + alignItems: 'center', + justifyContent: 'space-between', + flexShrink: 0, + borderBottom: '1px solid', + borderColor: theme.palette.divider, + backgroundColor: theme.palette.background.paper, + boxShadow: 'none', + backgroundImage: 'none', + zIndex: theme.zIndex.drawer + 1, + flex: '0 0 auto', +})); + +function TemplateFrame({ + showCustomTheme, + toggleCustomTheme, + mode, + toggleColorMode, + children, +}) { + const handleChange = (event) => { + toggleCustomTheme(event.target.value === 'custom'); + }; + const signInTheme = createTheme(getSignInTheme(mode)); + + return ( + <ThemeProvider theme={signInTheme}> + <Box sx={{ height: '100dvh', display: 'flex', flexDirection: 'column' }}> + <StyledAppBar> + <Toolbar + variant="dense" + disableGutters + sx={{ + display: 'flex', + justifyContent: 'space-between', + width: '100%', + p: '8px 12px', + }} + > + <Button + variant="text" + size="small" + aria-label="Back to templates" + startIcon={<ArrowBackRoundedIcon />} + component="a" + href="/material-ui/getting-started/templates/" + sx={{ display: { xs: 'none', sm: 'flex' } }} + > + Back to templates + </Button> + <IconButton + size="small" + aria-label="Back to templates" + component="a" + href="/material-ui/getting-started/templates/" + sx={{ display: { xs: 'auto', sm: 'none' } }} + > + <ArrowBackRoundedIcon /> + </IconButton> + <Box sx={{ display: 'flex', gap: 1 }}> + <FormControl variant="outlined" sx={{ minWidth: 180 }}> + <Select + size="small" + labelId="theme-select-label" + id="theme-select" + value={showCustomTheme ? 'custom' : 'material'} + onChange={handleChange} + label="Design Language" + > + <MenuItem value="custom">Custom Theme</MenuItem> + <MenuItem value="material">Material Design 2</MenuItem> + </Select> + </FormControl> + <ToggleColorMode + data-screenshot="toggle-mode" + mode={mode} + toggleColorMode={toggleColorMode} + /> + </Box> + </Toolbar> + </StyledAppBar> + <Box sx={{ flex: '1 1', overflow: 'auto' }}>{children}</Box> + </Box> + </ThemeProvider> + ); +} + +TemplateFrame.propTypes = { + children: PropTypes.node, + mode: PropTypes.oneOf(['dark', 'light']).isRequired, + showCustomTheme: PropTypes.bool.isRequired, + toggleColorMode: PropTypes.func.isRequired, + toggleCustomTheme: PropTypes.func.isRequired, +}; + +export default TemplateFrame; diff --git a/docs/data/material/getting-started/templates/sign-in/TemplateFrame.tsx b/docs/data/material/getting-started/templates/sign-in/TemplateFrame.tsx new file mode 100644 index 00000000000000..3d83d3350a64c8 --- /dev/null +++ b/docs/data/material/getting-started/templates/sign-in/TemplateFrame.tsx @@ -0,0 +1,115 @@ +import * as React from 'react'; +import { + createTheme, + ThemeProvider, + PaletteMode, + styled, +} from '@mui/material/styles'; +import Select, { SelectChangeEvent } from '@mui/material/Select'; +import MenuItem from '@mui/material/MenuItem'; +import FormControl from '@mui/material/FormControl'; +import Button from '@mui/material/Button'; +import IconButton from '@mui/material/IconButton'; +import Box from '@mui/material/Box'; +import AppBar from '@mui/material/AppBar'; +import Toolbar from '@mui/material/Toolbar'; +import ArrowBackRoundedIcon from '@mui/icons-material/ArrowBackRounded'; +import ToggleColorMode from './ToggleColorMode'; +import getSignInTheme from './theme/getSignInTheme'; + +const StyledAppBar = styled(AppBar)(({ theme }) => ({ + position: 'relative', + display: 'flex', + alignItems: 'center', + justifyContent: 'space-between', + flexShrink: 0, + borderBottom: '1px solid', + borderColor: theme.palette.divider, + backgroundColor: theme.palette.background.paper, + boxShadow: 'none', + backgroundImage: 'none', + zIndex: theme.zIndex.drawer + 1, + flex: '0 0 auto', +})); + +interface TemplateFrameProps { + showCustomTheme: boolean; + toggleCustomTheme: (theme: boolean) => void; + mode: PaletteMode; + toggleColorMode: () => void; + children: React.ReactNode; +} + +export default function TemplateFrame({ + showCustomTheme, + toggleCustomTheme, + mode, + toggleColorMode, + children, +}: TemplateFrameProps) { + const handleChange = (event: SelectChangeEvent) => { + toggleCustomTheme(event.target.value === 'custom'); + }; + const signInTheme = createTheme(getSignInTheme(mode)); + + return ( + <ThemeProvider theme={signInTheme}> + <Box sx={{ height: '100dvh', display: 'flex', flexDirection: 'column' }}> + <StyledAppBar> + <Toolbar + variant="dense" + disableGutters + sx={{ + display: 'flex', + justifyContent: 'space-between', + width: '100%', + p: '8px 12px', + }} + > + <Button + variant="text" + size="small" + aria-label="Back to templates" + startIcon={<ArrowBackRoundedIcon />} + component="a" + href="/material-ui/getting-started/templates/" + sx={{ display: { xs: 'none', sm: 'flex' } }} + > + Back to templates + </Button> + <IconButton + size="small" + aria-label="Back to templates" + component="a" + href="/material-ui/getting-started/templates/" + sx={{ display: { xs: 'auto', sm: 'none' } }} + > + <ArrowBackRoundedIcon /> + </IconButton> + <Box sx={{ display: 'flex', gap: 1 }}> + <FormControl variant="outlined" sx={{ minWidth: 180 }}> + <Select + size="small" + labelId="theme-select-label" + id="theme-select" + value={showCustomTheme ? 'custom' : 'material'} + onChange={handleChange} + label="Design Language" + > + <MenuItem value="custom">Custom Theme</MenuItem> + <MenuItem value="material">Material Design 2</MenuItem> + </Select> + </FormControl> + <ToggleColorMode + data-screenshot="toggle-mode" + mode={mode} + toggleColorMode={toggleColorMode} + /> + </Box> + </Toolbar> + </StyledAppBar> + <Box sx={{ flex: '1 1', overflow: 'auto' }}>{children}</Box> + </Box> + </ThemeProvider> + ); +} diff --git a/docs/data/material/getting-started/templates/sign-in/ToggleColorMode.js b/docs/data/material/getting-started/templates/sign-in/ToggleColorMode.js index ef5bf33fef968f..f578f75b2d92a6 100644 --- a/docs/data/material/getting-started/templates/sign-in/ToggleColorMode.js +++ b/docs/data/material/getting-started/templates/sign-in/ToggleColorMode.js @@ -10,6 +10,7 @@ function ToggleColorMode({ mode, toggleColorMode, ...props }) { return ( <IconButton onClick={toggleColorMode} + size="small" color="primary" aria-label="Theme toggle button" {...props} diff --git a/docs/data/material/getting-started/templates/sign-in/ToggleColorMode.tsx b/docs/data/material/getting-started/templates/sign-in/ToggleColorMode.tsx index 313d805383fdff..1de6afce2933ac 100644 --- a/docs/data/material/getting-started/templates/sign-in/ToggleColorMode.tsx +++ b/docs/data/material/getting-started/templates/sign-in/ToggleColorMode.tsx @@ -19,6 +19,7 @@ export default function ToggleColorMode({ return ( <IconButton onClick={toggleColorMode} + size="small" color="primary" aria-label="Theme toggle button" {...props} diff --git a/docs/data/material/getting-started/templates/sign-in/theme/themePrimitives.js b/docs/data/material/getting-started/templates/sign-in/theme/themePrimitives.js index 1894b11b326f0c..625400640eef43 100644 --- a/docs/data/material/getting-started/templates/sign-in/theme/themePrimitives.js +++ b/docs/data/material/getting-started/templates/sign-in/theme/themePrimitives.js @@ -1,6 +1,8 @@ import { createTheme, alpha } from '@mui/material/styles'; -const customTheme = createTheme(); +const defaultTheme = createTheme(); + +const customShadows = [...defaultTheme.shadows]; export const brand = { 50: 'hsl(210, 100%, 95%)', @@ -67,143 +69,148 @@ export const red = { 900: 'hsl(0, 93%, 6%)', }; -export const getDesignTokens = (mode) => ({ - palette: { - mode, - primary: { - light: brand[200], - main: brand[400], - dark: brand[700], - contrastText: brand[50], - ...(mode === 'dark' && { - contrastText: brand[50], - light: brand[300], +export const getDesignTokens = (mode) => { + customShadows[1] = + mode === 'dark' + ? 'hsla(220, 30%, 5%, 0.7) 0px 4px 16px 0px, hsla(220, 25%, 10%, 0.8) 0px 8px 16px -5px' + : 'hsla(220, 30%, 5%, 0.07) 0px 4px 16px 0px, hsla(220, 25%, 10%, 0.07) 0px 8px 16px -5px'; + + return { + palette: { + mode, + primary: { + light: brand[200], main: brand[400], dark: brand[700], - }), - }, - info: { - light: brand[100], - main: brand[300], - dark: brand[600], - contrastText: gray[50], - ...(mode === 'dark' && { - contrastText: brand[300], - light: brand[500], - main: brand[700], - dark: brand[900], - }), - }, - warning: { - light: orange[300], - main: orange[400], - dark: orange[800], - ...(mode === 'dark' && { - light: orange[400], - main: orange[500], - dark: orange[700], - }), - }, - error: { - light: red[300], - main: red[400], - dark: red[800], - ...(mode === 'dark' && { - light: red[400], - main: red[500], - dark: red[700], - }), - }, - success: { - light: green[300], - main: green[400], - dark: green[800], - ...(mode === 'dark' && { - light: green[400], - main: green[500], - dark: green[700], - }), - }, - grey: { - ...gray, - }, - divider: mode === 'dark' ? alpha(gray[700], 0.6) : alpha(gray[300], 0.4), - background: { - default: 'hsl(0, 0%, 99%)', - paper: 'hsl(220, 35%, 97%)', - ...(mode === 'dark' && { default: gray[900], paper: 'hsl(220, 30%, 7%)' }), - }, - text: { - primary: gray[800], - secondary: gray[600], - warning: orange[400], - ...(mode === 'dark' && { primary: 'hsl(0, 0%, 100%)', secondary: gray[400] }), - }, - action: { - hover: alpha(gray[200], 0.2), - selected: `${alpha(gray[200], 0.3)}`, - ...(mode === 'dark' && { - hover: alpha(gray[600], 0.2), - selected: alpha(gray[600], 0.3), - }), - }, - }, - typography: { - fontFamily: ['"Inter", "sans-serif"'].join(','), - h1: { - fontSize: customTheme.typography.pxToRem(48), - fontWeight: 600, - lineHeight: 1.2, - letterSpacing: -0.5, - }, - h2: { - fontSize: customTheme.typography.pxToRem(36), - fontWeight: 600, - lineHeight: 1.2, - }, - h3: { - fontSize: customTheme.typography.pxToRem(30), - lineHeight: 1.2, - }, - h4: { - fontSize: customTheme.typography.pxToRem(24), - fontWeight: 600, - lineHeight: 1.5, - }, - h5: { - fontSize: customTheme.typography.pxToRem(20), - fontWeight: 600, - }, - h6: { - fontSize: customTheme.typography.pxToRem(18), - fontWeight: 600, - }, - subtitle1: { - fontSize: customTheme.typography.pxToRem(18), - }, - subtitle2: { - fontSize: customTheme.typography.pxToRem(14), - fontWeight: 500, - }, - body1: { - fontSize: customTheme.typography.pxToRem(14), - }, - body2: { - fontSize: customTheme.typography.pxToRem(14), - fontWeight: 400, - }, - caption: { - fontSize: customTheme.typography.pxToRem(12), - fontWeight: 400, - }, - }, - shape: { - borderRadius: 8, - }, - shadows: [ - 'none', - ...(mode === 'dark' - ? 'hsla(220, 30%, 5%, 0.7) 0px 4px 16px 0px, hsla(220, 25%, 10%, 0.8) 0px 8px 16px -5px' - : 'hsla(220, 30%, 5%, 0.07) 0px 4px 16px 0px, hsla(220, 25%, 10%, 0.07) 0px 8px 16px -5px'), - ], -}); + contrastText: brand[50], + ...(mode === 'dark' && { + contrastText: brand[50], + light: brand[300], + main: brand[400], + dark: brand[700], + }), + }, + info: { + light: brand[100], + main: brand[300], + dark: brand[600], + contrastText: gray[50], + ...(mode === 'dark' && { + contrastText: brand[300], + light: brand[500], + main: brand[700], + dark: brand[900], + }), + }, + warning: { + light: orange[300], + main: orange[400], + dark: orange[800], + ...(mode === 'dark' && { + light: orange[400], + main: orange[500], + dark: orange[700], + }), + }, + error: { + light: red[300], + main: red[400], + dark: red[800], + ...(mode === 'dark' && { + light: red[400], + main: red[500], + dark: red[700], + }), + }, + success: { + light: green[300], + main: green[400], + dark: green[800], + ...(mode === 'dark' && { + light: green[400], + main: green[500], + dark: green[700], + }), + }, + grey: { + ...gray, + }, + divider: mode === 'dark' ? alpha(gray[700], 0.6) : alpha(gray[300], 0.4), + background: { + default: 'hsl(0, 0%, 99%)', + paper: 'hsl(220, 35%, 97%)', + ...(mode === 'dark' && { default: gray[900], paper: 'hsl(220, 30%, 7%)' }), + }, + text: { + primary: gray[800], + secondary: gray[600], + warning: orange[400], + ...(mode === 'dark' && { + primary: 'hsl(0, 0%, 100%)', + secondary: gray[400], + }), + }, + action: { + hover: alpha(gray[200], 0.2), + selected: `${alpha(gray[200], 0.3)}`, + ...(mode === 'dark' && { + hover: alpha(gray[600], 0.2), + selected: alpha(gray[600], 0.3), + }), + }, + }, + typography: { + fontFamily: ['"Inter", "sans-serif"'].join(','), + h1: { + fontSize: defaultTheme.typography.pxToRem(48), + fontWeight: 600, + lineHeight: 1.2, + letterSpacing: -0.5, + }, + h2: { + fontSize: defaultTheme.typography.pxToRem(36), + fontWeight: 600, + lineHeight: 1.2, + }, + h3: { + fontSize: defaultTheme.typography.pxToRem(30), + lineHeight: 1.2, + }, + h4: { + fontSize: defaultTheme.typography.pxToRem(24), + fontWeight: 600, + lineHeight: 1.5, + }, + h5: { + fontSize: defaultTheme.typography.pxToRem(20), + fontWeight: 600, + }, + h6: { + fontSize: defaultTheme.typography.pxToRem(18), + fontWeight: 600, + }, + subtitle1: { + fontSize: defaultTheme.typography.pxToRem(18), + }, + subtitle2: { + fontSize: defaultTheme.typography.pxToRem(14), + fontWeight: 500, + }, + body1: { + fontSize: defaultTheme.typography.pxToRem(14), + }, + body2: { + fontSize: defaultTheme.typography.pxToRem(14), + fontWeight: 400, + }, + caption: { + fontSize: defaultTheme.typography.pxToRem(12), + fontWeight: 400, + }, + }, + shape: { + borderRadius: 8, + }, + shadows: customShadows, + }; +}; diff --git a/docs/data/material/getting-started/templates/sign-in/theme/themePrimitives.ts b/docs/data/material/getting-started/templates/sign-in/theme/themePrimitives.ts index 09df769bb6687d..41b517b5294fad 100644 --- a/docs/data/material/getting-started/templates/sign-in/theme/themePrimitives.ts +++ b/docs/data/material/getting-started/templates/sign-in/theme/themePrimitives.ts @@ -1,4 +1,4 @@ -import { createTheme, alpha, Shadows, PaletteMode } from '@mui/material/styles'; +import { createTheme, alpha, PaletteMode, Shadows } from '@mui/material/styles'; declare module '@mui/material/Paper' { interface PaperPropsVariantOverrides { @@ -22,7 +22,9 @@ declare module '@mui/material/styles/createPalette' { interface PaletteColor extends ColorRange {} } -const customTheme = createTheme(); +const defaultTheme = createTheme(); + +const customShadows: Shadows = [...defaultTheme.shadows]; export const brand = { 50: 'hsl(210, 100%, 95%)', @@ -89,143 +91,145 @@ export const red = { 900: 'hsl(0, 93%, 6%)', }; -export const getDesignTokens = (mode: PaletteMode) => ({ - palette: { - mode, - primary: { - light: brand[200], - main: brand[400], - dark: brand[700], - contrastText: brand[50], - ...(mode === 'dark' && { - contrastText: brand[50], - light: brand[300], +export const getDesignTokens = (mode: PaletteMode) => { + customShadows[1] = + mode === 'dark' + ? 'hsla(220, 30%, 5%, 0.7) 0px 4px 16px 0px, hsla(220, 25%, 10%, 0.8) 0px 8px 16px -5px' + : 'hsla(220, 30%, 5%, 0.07) 0px 4px 16px 0px, hsla(220, 25%, 10%, 0.07) 0px 8px 16px -5px'; + + return { + palette: { + mode, + primary: { + light: brand[200], main: brand[400], dark: brand[700], - }), - }, - info: { - light: brand[100], - main: brand[300], - dark: brand[600], - contrastText: gray[50], - ...(mode === 'dark' && { - contrastText: brand[300], - light: brand[500], - main: brand[700], - dark: brand[900], - }), - }, - warning: { - light: orange[300], - main: orange[400], - dark: orange[800], - ...(mode === 'dark' && { - light: orange[400], - main: orange[500], - dark: orange[700], - }), - }, - error: { - light: red[300], - main: red[400], - dark: red[800], - ...(mode === 'dark' && { - light: red[400], - main: red[500], - dark: red[700], - }), - }, - success: { - light: green[300], - main: green[400], - dark: green[800], - ...(mode === 'dark' && { - light: green[400], - main: green[500], - dark: green[700], - }), - }, - grey: { - ...gray, - }, - divider: mode === 'dark' ? alpha(gray[700], 0.6) : alpha(gray[300], 0.4), - background: { - default: 'hsl(0, 0%, 99%)', - paper: 'hsl(220, 35%, 97%)', - ...(mode === 'dark' && { default: gray[900], paper: 'hsl(220, 30%, 7%)' }), - }, - text: { - primary: gray[800], - secondary: gray[600], - warning: orange[400], - ...(mode === 'dark' && { primary: 'hsl(0, 0%, 100%)', secondary: gray[400] }), - }, - action: { - hover: alpha(gray[200], 0.2), - selected: `${alpha(gray[200], 0.3)}`, - ...(mode === 'dark' && { - hover: alpha(gray[600], 0.2), - selected: alpha(gray[600], 0.3), - }), - }, - }, - typography: { - fontFamily: ['"Inter", "sans-serif"'].join(','), - h1: { - fontSize: customTheme.typography.pxToRem(48), - fontWeight: 600, - lineHeight: 1.2, - letterSpacing: -0.5, - }, - h2: { - fontSize: customTheme.typography.pxToRem(36), - fontWeight: 600, - lineHeight: 1.2, - }, - h3: { - fontSize: customTheme.typography.pxToRem(30), - lineHeight: 1.2, - }, - h4: { - fontSize: customTheme.typography.pxToRem(24), - fontWeight: 600, - lineHeight: 1.5, - }, - h5: { - fontSize: customTheme.typography.pxToRem(20), - fontWeight: 600, - }, - h6: { - fontSize: customTheme.typography.pxToRem(18), - fontWeight: 600, - }, - subtitle1: { - fontSize: customTheme.typography.pxToRem(18), - }, - subtitle2: { - fontSize: customTheme.typography.pxToRem(14), - fontWeight: 500, - }, - body1: { - fontSize: customTheme.typography.pxToRem(14), - }, - body2: { - fontSize: customTheme.typography.pxToRem(14), - fontWeight: 400, - }, - caption: { - fontSize: customTheme.typography.pxToRem(12), - fontWeight: 400, - }, - }, - shape: { - borderRadius: 8, - }, - shadows: [ - 'none', - ...(mode === 'dark' - ? 'hsla(220, 30%, 5%, 0.7) 0px 4px 16px 0px, hsla(220, 25%, 10%, 0.8) 0px 8px 16px -5px' - : 'hsla(220, 30%, 5%, 0.07) 0px 4px 16px 0px, hsla(220, 25%, 10%, 0.07) 0px 8px 16px -5px'), - ] as Shadows, -}); + contrastText: brand[50], + ...(mode === 'dark' && { + contrastText: brand[50], + light: brand[300], + main: brand[400], + dark: brand[700], + }), + }, + info: { + light: brand[100], + main: brand[300], + dark: brand[600], + contrastText: gray[50], + ...(mode === 'dark' && { + contrastText: brand[300], + light: brand[500], + main: brand[700], + dark: brand[900], + }), + }, + warning: { + light: orange[300], + main: orange[400], + dark: orange[800], + ...(mode === 'dark' && { + light: orange[400], + main: orange[500], + dark: orange[700], + }), + }, + error: { + light: red[300], + main: red[400], + dark: red[800], + ...(mode === 'dark' && { + light: red[400], + main: red[500], + dark: red[700], + }), + }, + success: { + light: green[300], + main: green[400], + dark: green[800], + ...(mode === 'dark' && { + light: green[400], + main: green[500], + dark: green[700], + }), + }, + grey: { + ...gray, + }, + divider: mode === 'dark' ? alpha(gray[700], 0.6) : alpha(gray[300], 0.4), + background: { + default: 'hsl(0, 0%, 99%)', + paper: 'hsl(220, 35%, 97%)', + ...(mode === 'dark' && { default: gray[900], paper: 'hsl(220, 30%, 7%)' }), + }, + text: { + primary: gray[800], + secondary: gray[600], + warning: orange[400], + ...(mode === 'dark' && { primary: 'hsl(0, 0%, 100%)', secondary: gray[400] }), + }, + action: { + hover: alpha(gray[200], 0.2), + selected: `${alpha(gray[200], 0.3)}`, + ...(mode === 'dark' && { + hover: alpha(gray[600], 0.2), + selected: alpha(gray[600], 0.3), + }), + }, + }, + typography: { + fontFamily: ['"Inter", "sans-serif"'].join(','), + h1: { + fontSize: defaultTheme.typography.pxToRem(48), + fontWeight: 600, + lineHeight: 1.2, + letterSpacing: -0.5, + }, + h2: { + fontSize: defaultTheme.typography.pxToRem(36), + fontWeight: 600, + lineHeight: 1.2, + }, + h3: { + fontSize: defaultTheme.typography.pxToRem(30), + lineHeight: 1.2, + }, + h4: { + fontSize: defaultTheme.typography.pxToRem(24), + fontWeight: 600, + lineHeight: 1.5, + }, + h5: { + fontSize: defaultTheme.typography.pxToRem(20), + fontWeight: 600, + }, + h6: { + fontSize: defaultTheme.typography.pxToRem(18), + fontWeight: 600, + }, + subtitle1: { + fontSize: defaultTheme.typography.pxToRem(18), + }, + subtitle2: { + fontSize: defaultTheme.typography.pxToRem(14), + fontWeight: 500, + }, + body1: { + fontSize: defaultTheme.typography.pxToRem(14), + }, + body2: { + fontSize: defaultTheme.typography.pxToRem(14), + fontWeight: 400, + }, + caption: { + fontSize: defaultTheme.typography.pxToRem(12), + fontWeight: 400, + }, + }, + shape: { + borderRadius: 8, + }, + shadows: customShadows, + }; +}; diff --git a/docs/data/material/getting-started/templates/sign-up/README.md b/docs/data/material/getting-started/templates/sign-up/README.md index f46cae4ad63fe5..aa89e2950d0e36 100644 --- a/docs/data/material/getting-started/templates/sign-up/README.md +++ b/docs/data/material/getting-started/templates/sign-up/README.md @@ -4,7 +4,7 @@ <!-- #default-branch-switch --> -1. Copy the files into your project, or one of the [example projects](https://github.com/mui/material-ui/tree/next/examples). +1. Copy the files into your project, or one of the [example projects](https://github.com/mui/material-ui/tree/master/examples). 2. Make sure your project has the required dependencies: @mui/material, @mui/icons-material, @emotion/styled, @emotion/react. 3. Import and use the `SignUp` component. @@ -12,4 +12,4 @@ <!-- #default-branch-switch --> -View the demo at https://next.mui.com/material-ui/getting-started/templates/sign-up/. +View the demo at https://mui.com/material-ui/getting-started/templates/sign-up/. diff --git a/docs/data/material/getting-started/templates/sign-up/SignUp.js b/docs/data/material/getting-started/templates/sign-up/SignUp.js index fa45753bbd4f46..dd1d788aab5982 100644 --- a/docs/data/material/getting-started/templates/sign-up/SignUp.js +++ b/docs/data/material/getting-started/templates/sign-up/SignUp.js @@ -1,5 +1,4 @@ import * as React from 'react'; -import PropTypes from 'prop-types'; import Box from '@mui/material/Box'; import Button from '@mui/material/Button'; import Checkbox from '@mui/material/Checkbox'; @@ -10,63 +9,13 @@ import FormLabel from '@mui/material/FormLabel'; import FormControl from '@mui/material/FormControl'; import Link from '@mui/material/Link'; import TextField from '@mui/material/TextField'; -import ToggleButton from '@mui/material/ToggleButton'; -import ToggleButtonGroup from '@mui/material/ToggleButtonGroup'; import Typography from '@mui/material/Typography'; import Stack from '@mui/material/Stack'; import MuiCard from '@mui/material/Card'; import { createTheme, ThemeProvider, styled } from '@mui/material/styles'; - -import AutoAwesomeRoundedIcon from '@mui/icons-material/AutoAwesomeRounded'; -import ArrowBackRoundedIcon from '@mui/icons-material/ArrowBackRounded'; - import getSignUpTheme from './theme/getSignUpTheme'; -import ToggleColorMode from './ToggleColorMode'; import { GoogleIcon, FacebookIcon, SitemarkIcon } from './CustomIcons'; - -function ToggleCustomTheme({ showCustomTheme, toggleCustomTheme }) { - return ( - <Box - sx={{ - display: 'flex', - flexDirection: 'column', - alignItems: 'center', - width: '100dvw', - position: 'fixed', - bottom: 24, - }} - > - <ToggleButtonGroup - color="primary" - exclusive - value={showCustomTheme} - onChange={toggleCustomTheme} - aria-label="Toggle design language" - sx={{ - backgroundColor: 'background.default', - '& .Mui-selected': { - pointerEvents: 'none', - }, - }} - > - <ToggleButton value> - <AutoAwesomeRoundedIcon sx={{ fontSize: '20px', mr: 1 }} /> - Custom theme - </ToggleButton> - <ToggleButton data-screenshot="toggle-default-theme" value={false}> - Material Design 2 - </ToggleButton> - </ToggleButtonGroup> - </Box> - ); -} - -ToggleCustomTheme.propTypes = { - showCustomTheme: PropTypes.shape({ - valueOf: PropTypes.func.isRequired, - }).isRequired, - toggleCustomTheme: PropTypes.func.isRequired, -}; +import TemplateFrame from './TemplateFrame'; const Card = styled(MuiCard)(({ theme }) => ({ display: 'flex', @@ -75,10 +24,10 @@ const Card = styled(MuiCard)(({ theme }) => ({ width: '100%', padding: theme.spacing(4), gap: theme.spacing(2), + margin: 'auto', boxShadow: 'hsla(220, 30%, 5%, 0.05) 0px 5px 15px 0px, hsla(220, 25%, 10%, 0.05) 0px 15px 35px -5px', [theme.breakpoints.up('sm')]: { - padding: theme.spacing(4), width: '450px', }, ...theme.applyStyles('dark', { @@ -88,15 +37,11 @@ const Card = styled(MuiCard)(({ theme }) => ({ })); const SignUpContainer = styled(Stack)(({ theme }) => ({ - height: 'auto', - paddingBottom: theme.spacing(12), + height: '100%', + padding: 4, backgroundImage: 'radial-gradient(ellipse at 50% 50%, hsl(210, 100%, 97%), hsl(0, 0%, 100%))', backgroundRepeat: 'no-repeat', - [theme.breakpoints.up('sm')]: { - paddingBottom: 0, - height: '100dvh', - }, ...theme.applyStyles('dark', { backgroundImage: 'radial-gradient(at 50% 50%, hsla(210, 100%, 16%, 0.5), hsl(220, 30%, 5%))', @@ -188,152 +133,133 @@ export default function SignUp() { }; return ( - <ThemeProvider theme={showCustomTheme ? SignUpTheme : defaultTheme}> - <CssBaseline /> - <SignUpContainer direction="column" justifyContent="space-between"> - <Stack - direction="row" - sx={{ - justifyContent: 'space-between', - position: { xs: 'static', sm: 'fixed' }, - width: '100%', - p: { xs: 2, sm: 4 }, - }} - > - <Button - startIcon={<ArrowBackRoundedIcon />} - component="a" - href="/material-ui/getting-started/templates/" + <TemplateFrame + toggleCustomTheme={toggleCustomTheme} + showCustomTheme={showCustomTheme} + mode={mode} + toggleColorMode={toggleColorMode} + > + <ThemeProvider theme={showCustomTheme ? SignUpTheme : defaultTheme}> + <CssBaseline enableColorScheme /> + <SignUpContainer direction="column" justifyContent="space-between"> + <Stack + sx={{ + justifyContent: 'center', + height: '100dvh', + p: 2, + }} > - Back - </Button> - <ToggleColorMode - data-screenshot="toggle-mode" - mode={mode} - toggleColorMode={toggleColorMode} - /> - </Stack> - <Stack - sx={{ - justifyContent: 'center', - height: { xs: '100%', sm: '100dvh' }, - p: 2, - }} - > - <Card variant="outlined"> - <SitemarkIcon /> - <Typography - component="h1" - variant="h4" - sx={{ width: '100%', fontSize: 'clamp(2rem, 10vw, 2.15rem)' }} - > - Sign up - </Typography> - <Box - component="form" - onSubmit={handleSubmit} - sx={{ display: 'flex', flexDirection: 'column', gap: 2 }} - > - <FormControl> - <FormLabel htmlFor="name">Full name</FormLabel> - <TextField - autoComplete="name" - name="name" - required - fullWidth - id="name" - placeholder="Jon Snow" - error={nameError} - helperText={nameErrorMessage} - color={nameError ? 'error' : 'primary'} + <Card variant="outlined"> + <SitemarkIcon /> + <Typography + component="h1" + variant="h4" + sx={{ width: '100%', fontSize: 'clamp(2rem, 10vw, 2.15rem)' }} + > + Sign up + </Typography> + <Box + component="form" + onSubmit={handleSubmit} + sx={{ display: 'flex', flexDirection: 'column', gap: 2 }} + > + <FormControl> + <FormLabel htmlFor="name">Full name</FormLabel> + <TextField + autoComplete="name" + name="name" + required + fullWidth + id="name" + placeholder="Jon Snow" + error={nameError} + helperText={nameErrorMessage} + color={nameError ? 'error' : 'primary'} + /> + </FormControl> + <FormControl> + <FormLabel htmlFor="email">Email</FormLabel> + <TextField + required + fullWidth + id="email" + placeholder="your@email.com" + name="email" + autoComplete="email" + variant="outlined" + error={emailError} + helperText={emailErrorMessage} + color={passwordError ? 'error' : 'primary'} + /> + </FormControl> + <FormControl> + <FormLabel htmlFor="password">Password</FormLabel> + <TextField + required + fullWidth + name="password" + placeholder="••••••" + type="password" + id="password" + autoComplete="new-password" + variant="outlined" + error={passwordError} + helperText={passwordErrorMessage} + color={passwordError ? 'error' : 'primary'} + /> + </FormControl> + <FormControlLabel + control={<Checkbox value="allowExtraEmails" color="primary" />} + label="I want to receive updates via email." /> - </FormControl> - <FormControl> - <FormLabel htmlFor="email">Email</FormLabel> - <TextField - required + <Button + type="submit" + fullWidth + variant="contained" + onClick={validateInputs} + > + Sign up + </Button> + <Typography sx={{ textAlign: 'center' }}> + Already have an account?{' '} + <span> + <Link + href="/material-ui/getting-started/templates/sign-in/" + variant="body2" + sx={{ alignSelf: 'center' }} + > + Sign in + </Link> + </span> + </Typography> + </Box> + <Divider> + <Typography sx={{ color: 'text.secondary' }}>or</Typography> + </Divider> + <Box sx={{ display: 'flex', flexDirection: 'column', gap: 2 }}> + <Button + type="submit" fullWidth - id="email" - placeholder="your@email.com" - name="email" - autoComplete="email" variant="outlined" - error={emailError} - helperText={emailErrorMessage} - color={passwordError ? 'error' : 'primary'} - /> - </FormControl> - <FormControl> - <FormLabel htmlFor="password">Password</FormLabel> - <TextField - required + onClick={() => alert('Sign up with Google')} + startIcon={<GoogleIcon />} + > + Sign up with Google + </Button> + <Button + type="submit" fullWidth - name="password" - placeholder="••••••" - type="password" - id="password" - autoComplete="new-password" variant="outlined" - error={passwordError} - helperText={passwordErrorMessage} - color={passwordError ? 'error' : 'primary'} - /> - </FormControl> - <FormControlLabel - control={<Checkbox value="allowExtraEmails" color="primary" />} - label="I want to receive updates via email." - /> - <Button - type="submit" - fullWidth - variant="contained" - onClick={validateInputs} - > - Sign up - </Button> - <Typography sx={{ textAlign: 'center' }}> - Already have an account?{' '} - <span> - <Link - href="/material-ui/getting-started/templates/sign-in/" - variant="body2" - sx={{ alignSelf: 'center' }} - > - Sign in - </Link> - </span> - </Typography> - </Box> - <Divider> - <Typography sx={{ color: 'text.secondary' }}>or</Typography> - </Divider> - <Box sx={{ display: 'flex', flexDirection: 'column', gap: 2 }}> - <Button - type="submit" - fullWidth - variant="outlined" - onClick={() => alert('Sign up with Google')} - startIcon={<GoogleIcon />} - > - Sign up with Google - </Button> - <Button - type="submit" - fullWidth - variant="outlined" - onClick={() => alert('Sign up with Facebook')} - startIcon={<FacebookIcon />} - > - Sign up with Facebook - </Button> - </Box> - </Card> - </Stack> - </SignUpContainer> - <ToggleCustomTheme - showCustomTheme={showCustomTheme} - toggleCustomTheme={toggleCustomTheme} - /> - </ThemeProvider> + onClick={() => alert('Sign up with Facebook')} + startIcon={<FacebookIcon />} + > + Sign up with Facebook + </Button> + </Box> + </Card> + </Stack> + </SignUpContainer> + </ThemeProvider> + </TemplateFrame> ); } diff --git a/docs/data/material/getting-started/templates/sign-up/SignUp.tsx b/docs/data/material/getting-started/templates/sign-up/SignUp.tsx index 4b86d512ab5aad..ce73b97e4438c2 100644 --- a/docs/data/material/getting-started/templates/sign-up/SignUp.tsx +++ b/docs/data/material/getting-started/templates/sign-up/SignUp.tsx @@ -9,8 +9,6 @@ import FormLabel from '@mui/material/FormLabel'; import FormControl from '@mui/material/FormControl'; import Link from '@mui/material/Link'; import TextField from '@mui/material/TextField'; -import ToggleButton from '@mui/material/ToggleButton'; -import ToggleButtonGroup from '@mui/material/ToggleButtonGroup'; import Typography from '@mui/material/Typography'; import Stack from '@mui/material/Stack'; import MuiCard from '@mui/material/Card'; @@ -20,58 +18,9 @@ import { styled, PaletteMode, } from '@mui/material/styles'; - -import AutoAwesomeRoundedIcon from '@mui/icons-material/AutoAwesomeRounded'; -import ArrowBackRoundedIcon from '@mui/icons-material/ArrowBackRounded'; - import getSignUpTheme from './theme/getSignUpTheme'; -import ToggleColorMode from './ToggleColorMode'; import { GoogleIcon, FacebookIcon, SitemarkIcon } from './CustomIcons'; - -interface ToggleCustomThemeProps { - showCustomTheme: Boolean; - toggleCustomTheme: () => void; -} - -function ToggleCustomTheme({ - showCustomTheme, - toggleCustomTheme, -}: ToggleCustomThemeProps) { - return ( - <Box - sx={{ - display: 'flex', - flexDirection: 'column', - alignItems: 'center', - width: '100dvw', - position: 'fixed', - bottom: 24, - }} - > - <ToggleButtonGroup - color="primary" - exclusive - value={showCustomTheme} - onChange={toggleCustomTheme} - aria-label="Toggle design language" - sx={{ - backgroundColor: 'background.default', - '& .Mui-selected': { - pointerEvents: 'none', - }, - }} - > - <ToggleButton value> - <AutoAwesomeRoundedIcon sx={{ fontSize: '20px', mr: 1 }} /> - Custom theme - </ToggleButton> - <ToggleButton data-screenshot="toggle-default-theme" value={false}> - Material Design 2 - </ToggleButton> - </ToggleButtonGroup> - </Box> - ); -} +import TemplateFrame from './TemplateFrame'; const Card = styled(MuiCard)(({ theme }) => ({ display: 'flex', @@ -80,10 +29,10 @@ const Card = styled(MuiCard)(({ theme }) => ({ width: '100%', padding: theme.spacing(4), gap: theme.spacing(2), + margin: 'auto', boxShadow: 'hsla(220, 30%, 5%, 0.05) 0px 5px 15px 0px, hsla(220, 25%, 10%, 0.05) 0px 15px 35px -5px', [theme.breakpoints.up('sm')]: { - padding: theme.spacing(4), width: '450px', }, ...theme.applyStyles('dark', { @@ -93,15 +42,11 @@ const Card = styled(MuiCard)(({ theme }) => ({ })); const SignUpContainer = styled(Stack)(({ theme }) => ({ - height: 'auto', - paddingBottom: theme.spacing(12), + height: '100%', + padding: 4, backgroundImage: 'radial-gradient(ellipse at 50% 50%, hsl(210, 100%, 97%), hsl(0, 0%, 100%))', backgroundRepeat: 'no-repeat', - [theme.breakpoints.up('sm')]: { - paddingBottom: 0, - height: '100dvh', - }, ...theme.applyStyles('dark', { backgroundImage: 'radial-gradient(at 50% 50%, hsla(210, 100%, 16%, 0.5), hsl(220, 30%, 5%))', @@ -193,152 +138,134 @@ export default function SignUp() { }; return ( - <ThemeProvider theme={showCustomTheme ? SignUpTheme : defaultTheme}> - <CssBaseline /> - <SignUpContainer direction="column" justifyContent="space-between"> - <Stack - direction="row" - sx={{ - justifyContent: 'space-between', - position: { xs: 'static', sm: 'fixed' }, - width: '100%', - p: { xs: 2, sm: 4 }, - }} - > - <Button - startIcon={<ArrowBackRoundedIcon />} - component="a" - href="/material-ui/getting-started/templates/" + <TemplateFrame + toggleCustomTheme={toggleCustomTheme} + showCustomTheme={showCustomTheme} + mode={mode} + toggleColorMode={toggleColorMode} + > + <ThemeProvider theme={showCustomTheme ? SignUpTheme : defaultTheme}> + <CssBaseline enableColorScheme /> + + <SignUpContainer direction="column" justifyContent="space-between"> + <Stack + sx={{ + justifyContent: 'center', + height: '100dvh', + p: 2, + }} > - Back - </Button> - <ToggleColorMode - data-screenshot="toggle-mode" - mode={mode} - toggleColorMode={toggleColorMode} - /> - </Stack> - <Stack - sx={{ - justifyContent: 'center', - height: { xs: '100%', sm: '100dvh' }, - p: 2, - }} - > - <Card variant="outlined"> - <SitemarkIcon /> - <Typography - component="h1" - variant="h4" - sx={{ width: '100%', fontSize: 'clamp(2rem, 10vw, 2.15rem)' }} - > - Sign up - </Typography> - <Box - component="form" - onSubmit={handleSubmit} - sx={{ display: 'flex', flexDirection: 'column', gap: 2 }} - > - <FormControl> - <FormLabel htmlFor="name">Full name</FormLabel> - <TextField - autoComplete="name" - name="name" - required - fullWidth - id="name" - placeholder="Jon Snow" - error={nameError} - helperText={nameErrorMessage} - color={nameError ? 'error' : 'primary'} + <Card variant="outlined"> + <SitemarkIcon /> + <Typography + component="h1" + variant="h4" + sx={{ width: '100%', fontSize: 'clamp(2rem, 10vw, 2.15rem)' }} + > + Sign up + </Typography> + <Box + component="form" + onSubmit={handleSubmit} + sx={{ display: 'flex', flexDirection: 'column', gap: 2 }} + > + <FormControl> + <FormLabel htmlFor="name">Full name</FormLabel> + <TextField + autoComplete="name" + name="name" + required + fullWidth + id="name" + placeholder="Jon Snow" + error={nameError} + helperText={nameErrorMessage} + color={nameError ? 'error' : 'primary'} + /> + </FormControl> + <FormControl> + <FormLabel htmlFor="email">Email</FormLabel> + <TextField + required + fullWidth + id="email" + placeholder="your@email.com" + name="email" + autoComplete="email" + variant="outlined" + error={emailError} + helperText={emailErrorMessage} + color={passwordError ? 'error' : 'primary'} + /> + </FormControl> + <FormControl> + <FormLabel htmlFor="password">Password</FormLabel> + <TextField + required + fullWidth + name="password" + placeholder="••••••" + type="password" + id="password" + autoComplete="new-password" + variant="outlined" + error={passwordError} + helperText={passwordErrorMessage} + color={passwordError ? 'error' : 'primary'} + /> + </FormControl> + <FormControlLabel + control={<Checkbox value="allowExtraEmails" color="primary" />} + label="I want to receive updates via email." /> - </FormControl> - <FormControl> - <FormLabel htmlFor="email">Email</FormLabel> - <TextField - required + <Button + type="submit" + fullWidth + variant="contained" + onClick={validateInputs} + > + Sign up + </Button> + <Typography sx={{ textAlign: 'center' }}> + Already have an account?{' '} + <span> + <Link + href="/material-ui/getting-started/templates/sign-in/" + variant="body2" + sx={{ alignSelf: 'center' }} + > + Sign in + </Link> + </span> + </Typography> + </Box> + <Divider> + <Typography sx={{ color: 'text.secondary' }}>or</Typography> + </Divider> + <Box sx={{ display: 'flex', flexDirection: 'column', gap: 2 }}> + <Button + type="submit" fullWidth - id="email" - placeholder="your@email.com" - name="email" - autoComplete="email" variant="outlined" - error={emailError} - helperText={emailErrorMessage} - color={passwordError ? 'error' : 'primary'} - /> - </FormControl> - <FormControl> - <FormLabel htmlFor="password">Password</FormLabel> - <TextField - required + onClick={() => alert('Sign up with Google')} + startIcon={<GoogleIcon />} + > + Sign up with Google + </Button> + <Button + type="submit" fullWidth - name="password" - placeholder="••••••" - type="password" - id="password" - autoComplete="new-password" variant="outlined" - error={passwordError} - helperText={passwordErrorMessage} - color={passwordError ? 'error' : 'primary'} - /> - </FormControl> - <FormControlLabel - control={<Checkbox value="allowExtraEmails" color="primary" />} - label="I want to receive updates via email." - /> - <Button - type="submit" - fullWidth - variant="contained" - onClick={validateInputs} - > - Sign up - </Button> - <Typography sx={{ textAlign: 'center' }}> - Already have an account?{' '} - <span> - <Link - href="/material-ui/getting-started/templates/sign-in/" - variant="body2" - sx={{ alignSelf: 'center' }} - > - Sign in - </Link> - </span> - </Typography> - </Box> - <Divider> - <Typography sx={{ color: 'text.secondary' }}>or</Typography> - </Divider> - <Box sx={{ display: 'flex', flexDirection: 'column', gap: 2 }}> - <Button - type="submit" - fullWidth - variant="outlined" - onClick={() => alert('Sign up with Google')} - startIcon={<GoogleIcon />} - > - Sign up with Google - </Button> - <Button - type="submit" - fullWidth - variant="outlined" - onClick={() => alert('Sign up with Facebook')} - startIcon={<FacebookIcon />} - > - Sign up with Facebook - </Button> - </Box> - </Card> - </Stack> - </SignUpContainer> - <ToggleCustomTheme - showCustomTheme={showCustomTheme} - toggleCustomTheme={toggleCustomTheme} - /> - </ThemeProvider> + onClick={() => alert('Sign up with Facebook')} + startIcon={<FacebookIcon />} + > + Sign up with Facebook + </Button> + </Box> + </Card> + </Stack> + </SignUpContainer> + </ThemeProvider> + </TemplateFrame> ); } diff --git a/docs/data/material/getting-started/templates/sign-up/TemplateFrame.js b/docs/data/material/getting-started/templates/sign-up/TemplateFrame.js new file mode 100644 index 00000000000000..900462b107d3ee --- /dev/null +++ b/docs/data/material/getting-started/templates/sign-up/TemplateFrame.js @@ -0,0 +1,113 @@ +import * as React from 'react'; +import PropTypes from 'prop-types'; +import { createTheme, ThemeProvider, styled } from '@mui/material/styles'; +import Select from '@mui/material/Select'; +import MenuItem from '@mui/material/MenuItem'; +import FormControl from '@mui/material/FormControl'; +import Button from '@mui/material/Button'; +import IconButton from '@mui/material/IconButton'; +import Box from '@mui/material/Box'; +import AppBar from '@mui/material/AppBar'; +import Toolbar from '@mui/material/Toolbar'; +import ArrowBackRoundedIcon from '@mui/icons-material/ArrowBackRounded'; +import ToggleColorMode from './ToggleColorMode'; +import getSignUpTheme from './theme/getSignUpTheme'; + +const StyledAppBar = styled(AppBar)(({ theme }) => ({ + position: 'relative', + display: 'flex', + alignItems: 'center', + justifyContent: 'space-between', + flexShrink: 0, + borderBottom: '1px solid', + borderColor: theme.palette.divider, + backgroundColor: theme.palette.background.paper, + boxShadow: 'none', + backgroundImage: 'none', + zIndex: theme.zIndex.drawer + 1, + flex: '0 0 auto', +})); + +function TemplateFrame({ + showCustomTheme, + toggleCustomTheme, + mode, + toggleColorMode, + children, +}) { + const handleChange = (event) => { + toggleCustomTheme(event.target.value === 'custom'); + }; + const signUpTheme = createTheme(getSignUpTheme(mode)); + + return ( + <ThemeProvider theme={signUpTheme}> + <Box sx={{ height: '100dvh', display: 'flex', flexDirection: 'column' }}> + <StyledAppBar> + <Toolbar + variant="dense" + disableGutters + sx={{ + display: 'flex', + justifyContent: 'space-between', + width: '100%', + p: '8px 12px', + }} + > + <Button + variant="text" + size="small" + aria-label="Back to templates" + startIcon={<ArrowBackRoundedIcon />} + component="a" + href="/material-ui/getting-started/templates/" + sx={{ display: { xs: 'none', sm: 'flex' } }} + > + Back to templates + </Button> + <IconButton + size="small" + aria-label="Back to templates" + component="a" + href="/material-ui/getting-started/templates/" + sx={{ display: { xs: 'auto', sm: 'none' } }} + > + <ArrowBackRoundedIcon /> + </IconButton> + <Box sx={{ display: 'flex', gap: 1 }}> + <FormControl variant="outlined" sx={{ minWidth: 180 }}> + <Select + size="small" + labelId="theme-select-label" + id="theme-select" + value={showCustomTheme ? 'custom' : 'material'} + onChange={handleChange} + label="Design Language" + > + <MenuItem value="custom">Custom Theme</MenuItem> + <MenuItem value="material">Material Design 2</MenuItem> + </Select> + </FormControl> + <ToggleColorMode + data-screenshot="toggle-mode" + mode={mode} + toggleColorMode={toggleColorMode} + /> + </Box> + </Toolbar> + </StyledAppBar> + <Box sx={{ flex: '1 1', overflow: 'auto' }}>{children}</Box> + </Box> + </ThemeProvider> + ); +} + +TemplateFrame.propTypes = { + children: PropTypes.node, + mode: PropTypes.oneOf(['dark', 'light']).isRequired, + showCustomTheme: PropTypes.bool.isRequired, + toggleColorMode: PropTypes.func.isRequired, + toggleCustomTheme: PropTypes.func.isRequired, +}; + +export default TemplateFrame; diff --git a/docs/data/material/getting-started/templates/sign-up/TemplateFrame.tsx b/docs/data/material/getting-started/templates/sign-up/TemplateFrame.tsx new file mode 100644 index 00000000000000..15f6cf5962ce06 --- /dev/null +++ b/docs/data/material/getting-started/templates/sign-up/TemplateFrame.tsx @@ -0,0 +1,115 @@ +import * as React from 'react'; +import { + createTheme, + ThemeProvider, + PaletteMode, + styled, +} from '@mui/material/styles'; +import Select, { SelectChangeEvent } from '@mui/material/Select'; +import MenuItem from '@mui/material/MenuItem'; +import FormControl from '@mui/material/FormControl'; +import Button from '@mui/material/Button'; +import IconButton from '@mui/material/IconButton'; +import Box from '@mui/material/Box'; +import AppBar from '@mui/material/AppBar'; +import Toolbar from '@mui/material/Toolbar'; +import ArrowBackRoundedIcon from '@mui/icons-material/ArrowBackRounded'; +import ToggleColorMode from './ToggleColorMode'; +import getSignUpTheme from './theme/getSignUpTheme'; + +const StyledAppBar = styled(AppBar)(({ theme }) => ({ + position: 'relative', + display: 'flex', + alignItems: 'center', + justifyContent: 'space-between', + flexShrink: 0, + borderBottom: '1px solid', + borderColor: theme.palette.divider, + backgroundColor: theme.palette.background.paper, + boxShadow: 'none', + backgroundImage: 'none', + zIndex: theme.zIndex.drawer + 1, + flex: '0 0 auto', +})); + +interface TemplateFrameProps { + showCustomTheme: boolean; + toggleCustomTheme: (theme: boolean) => void; + mode: PaletteMode; + toggleColorMode: () => void; + children: React.ReactNode; +} + +export default function TemplateFrame({ + showCustomTheme, + toggleCustomTheme, + mode, + toggleColorMode, + children, +}: TemplateFrameProps) { + const handleChange = (event: SelectChangeEvent) => { + toggleCustomTheme(event.target.value === 'custom'); + }; + const signUpTheme = createTheme(getSignUpTheme(mode)); + + return ( + <ThemeProvider theme={signUpTheme}> + <Box sx={{ height: '100dvh', display: 'flex', flexDirection: 'column' }}> + <StyledAppBar> + <Toolbar + variant="dense" + disableGutters + sx={{ + display: 'flex', + justifyContent: 'space-between', + width: '100%', + p: '8px 12px', + }} + > + <Button + variant="text" + size="small" + aria-label="Back to templates" + startIcon={<ArrowBackRoundedIcon />} + component="a" + href="/material-ui/getting-started/templates/" + sx={{ display: { xs: 'none', sm: 'flex' } }} + > + Back to templates + </Button> + <IconButton + size="small" + aria-label="Back to templates" + component="a" + href="/material-ui/getting-started/templates/" + sx={{ display: { xs: 'auto', sm: 'none' } }} + > + <ArrowBackRoundedIcon /> + </IconButton> + <Box sx={{ display: 'flex', gap: 1 }}> + <FormControl variant="outlined" sx={{ minWidth: 180 }}> + <Select + size="small" + labelId="theme-select-label" + id="theme-select" + value={showCustomTheme ? 'custom' : 'material'} + onChange={handleChange} + label="Design Language" + > + <MenuItem value="custom">Custom Theme</MenuItem> + <MenuItem value="material">Material Design 2</MenuItem> + </Select> + </FormControl> + <ToggleColorMode + data-screenshot="toggle-mode" + mode={mode} + toggleColorMode={toggleColorMode} + /> + </Box> + </Toolbar> + </StyledAppBar> + <Box sx={{ flex: '1 1', overflow: 'auto' }}>{children}</Box> + </Box> + </ThemeProvider> + ); +} diff --git a/docs/data/material/getting-started/templates/sign-up/ToggleColorMode.js b/docs/data/material/getting-started/templates/sign-up/ToggleColorMode.js index ef5bf33fef968f..f578f75b2d92a6 100644 --- a/docs/data/material/getting-started/templates/sign-up/ToggleColorMode.js +++ b/docs/data/material/getting-started/templates/sign-up/ToggleColorMode.js @@ -10,6 +10,7 @@ function ToggleColorMode({ mode, toggleColorMode, ...props }) { return ( <IconButton onClick={toggleColorMode} + size="small" color="primary" aria-label="Theme toggle button" {...props} diff --git a/docs/data/material/getting-started/templates/sign-up/ToggleColorMode.tsx b/docs/data/material/getting-started/templates/sign-up/ToggleColorMode.tsx index 313d805383fdff..1de6afce2933ac 100644 --- a/docs/data/material/getting-started/templates/sign-up/ToggleColorMode.tsx +++ b/docs/data/material/getting-started/templates/sign-up/ToggleColorMode.tsx @@ -19,6 +19,7 @@ export default function ToggleColorMode({ return ( <IconButton onClick={toggleColorMode} + size="small" color="primary" aria-label="Theme toggle button" {...props} diff --git a/docs/data/material/getting-started/templates/sign-up/theme/themePrimitives.js b/docs/data/material/getting-started/templates/sign-up/theme/themePrimitives.js index 1894b11b326f0c..625400640eef43 100644 --- a/docs/data/material/getting-started/templates/sign-up/theme/themePrimitives.js +++ b/docs/data/material/getting-started/templates/sign-up/theme/themePrimitives.js @@ -1,6 +1,8 @@ import { createTheme, alpha } from '@mui/material/styles'; -const customTheme = createTheme(); +const defaultTheme = createTheme(); + +const customShadows = [...defaultTheme.shadows]; export const brand = { 50: 'hsl(210, 100%, 95%)', @@ -67,143 +69,148 @@ export const red = { 900: 'hsl(0, 93%, 6%)', }; -export const getDesignTokens = (mode) => ({ - palette: { - mode, - primary: { - light: brand[200], - main: brand[400], - dark: brand[700], - contrastText: brand[50], - ...(mode === 'dark' && { - contrastText: brand[50], - light: brand[300], +export const getDesignTokens = (mode) => { + customShadows[1] = + mode === 'dark' + ? 'hsla(220, 30%, 5%, 0.7) 0px 4px 16px 0px, hsla(220, 25%, 10%, 0.8) 0px 8px 16px -5px' + : 'hsla(220, 30%, 5%, 0.07) 0px 4px 16px 0px, hsla(220, 25%, 10%, 0.07) 0px 8px 16px -5px'; + + return { + palette: { + mode, + primary: { + light: brand[200], main: brand[400], dark: brand[700], - }), - }, - info: { - light: brand[100], - main: brand[300], - dark: brand[600], - contrastText: gray[50], - ...(mode === 'dark' && { - contrastText: brand[300], - light: brand[500], - main: brand[700], - dark: brand[900], - }), - }, - warning: { - light: orange[300], - main: orange[400], - dark: orange[800], - ...(mode === 'dark' && { - light: orange[400], - main: orange[500], - dark: orange[700], - }), - }, - error: { - light: red[300], - main: red[400], - dark: red[800], - ...(mode === 'dark' && { - light: red[400], - main: red[500], - dark: red[700], - }), - }, - success: { - light: green[300], - main: green[400], - dark: green[800], - ...(mode === 'dark' && { - light: green[400], - main: green[500], - dark: green[700], - }), - }, - grey: { - ...gray, - }, - divider: mode === 'dark' ? alpha(gray[700], 0.6) : alpha(gray[300], 0.4), - background: { - default: 'hsl(0, 0%, 99%)', - paper: 'hsl(220, 35%, 97%)', - ...(mode === 'dark' && { default: gray[900], paper: 'hsl(220, 30%, 7%)' }), - }, - text: { - primary: gray[800], - secondary: gray[600], - warning: orange[400], - ...(mode === 'dark' && { primary: 'hsl(0, 0%, 100%)', secondary: gray[400] }), - }, - action: { - hover: alpha(gray[200], 0.2), - selected: `${alpha(gray[200], 0.3)}`, - ...(mode === 'dark' && { - hover: alpha(gray[600], 0.2), - selected: alpha(gray[600], 0.3), - }), - }, - }, - typography: { - fontFamily: ['"Inter", "sans-serif"'].join(','), - h1: { - fontSize: customTheme.typography.pxToRem(48), - fontWeight: 600, - lineHeight: 1.2, - letterSpacing: -0.5, - }, - h2: { - fontSize: customTheme.typography.pxToRem(36), - fontWeight: 600, - lineHeight: 1.2, - }, - h3: { - fontSize: customTheme.typography.pxToRem(30), - lineHeight: 1.2, - }, - h4: { - fontSize: customTheme.typography.pxToRem(24), - fontWeight: 600, - lineHeight: 1.5, - }, - h5: { - fontSize: customTheme.typography.pxToRem(20), - fontWeight: 600, - }, - h6: { - fontSize: customTheme.typography.pxToRem(18), - fontWeight: 600, - }, - subtitle1: { - fontSize: customTheme.typography.pxToRem(18), - }, - subtitle2: { - fontSize: customTheme.typography.pxToRem(14), - fontWeight: 500, - }, - body1: { - fontSize: customTheme.typography.pxToRem(14), - }, - body2: { - fontSize: customTheme.typography.pxToRem(14), - fontWeight: 400, - }, - caption: { - fontSize: customTheme.typography.pxToRem(12), - fontWeight: 400, - }, - }, - shape: { - borderRadius: 8, - }, - shadows: [ - 'none', - ...(mode === 'dark' - ? 'hsla(220, 30%, 5%, 0.7) 0px 4px 16px 0px, hsla(220, 25%, 10%, 0.8) 0px 8px 16px -5px' - : 'hsla(220, 30%, 5%, 0.07) 0px 4px 16px 0px, hsla(220, 25%, 10%, 0.07) 0px 8px 16px -5px'), - ], -}); + contrastText: brand[50], + ...(mode === 'dark' && { + contrastText: brand[50], + light: brand[300], + main: brand[400], + dark: brand[700], + }), + }, + info: { + light: brand[100], + main: brand[300], + dark: brand[600], + contrastText: gray[50], + ...(mode === 'dark' && { + contrastText: brand[300], + light: brand[500], + main: brand[700], + dark: brand[900], + }), + }, + warning: { + light: orange[300], + main: orange[400], + dark: orange[800], + ...(mode === 'dark' && { + light: orange[400], + main: orange[500], + dark: orange[700], + }), + }, + error: { + light: red[300], + main: red[400], + dark: red[800], + ...(mode === 'dark' && { + light: red[400], + main: red[500], + dark: red[700], + }), + }, + success: { + light: green[300], + main: green[400], + dark: green[800], + ...(mode === 'dark' && { + light: green[400], + main: green[500], + dark: green[700], + }), + }, + grey: { + ...gray, + }, + divider: mode === 'dark' ? alpha(gray[700], 0.6) : alpha(gray[300], 0.4), + background: { + default: 'hsl(0, 0%, 99%)', + paper: 'hsl(220, 35%, 97%)', + ...(mode === 'dark' && { default: gray[900], paper: 'hsl(220, 30%, 7%)' }), + }, + text: { + primary: gray[800], + secondary: gray[600], + warning: orange[400], + ...(mode === 'dark' && { + primary: 'hsl(0, 0%, 100%)', + secondary: gray[400], + }), + }, + action: { + hover: alpha(gray[200], 0.2), + selected: `${alpha(gray[200], 0.3)}`, + ...(mode === 'dark' && { + hover: alpha(gray[600], 0.2), + selected: alpha(gray[600], 0.3), + }), + }, + }, + typography: { + fontFamily: ['"Inter", "sans-serif"'].join(','), + h1: { + fontSize: defaultTheme.typography.pxToRem(48), + fontWeight: 600, + lineHeight: 1.2, + letterSpacing: -0.5, + }, + h2: { + fontSize: defaultTheme.typography.pxToRem(36), + fontWeight: 600, + lineHeight: 1.2, + }, + h3: { + fontSize: defaultTheme.typography.pxToRem(30), + lineHeight: 1.2, + }, + h4: { + fontSize: defaultTheme.typography.pxToRem(24), + fontWeight: 600, + lineHeight: 1.5, + }, + h5: { + fontSize: defaultTheme.typography.pxToRem(20), + fontWeight: 600, + }, + h6: { + fontSize: defaultTheme.typography.pxToRem(18), + fontWeight: 600, + }, + subtitle1: { + fontSize: defaultTheme.typography.pxToRem(18), + }, + subtitle2: { + fontSize: defaultTheme.typography.pxToRem(14), + fontWeight: 500, + }, + body1: { + fontSize: defaultTheme.typography.pxToRem(14), + }, + body2: { + fontSize: defaultTheme.typography.pxToRem(14), + fontWeight: 400, + }, + caption: { + fontSize: defaultTheme.typography.pxToRem(12), + fontWeight: 400, + }, + }, + shape: { + borderRadius: 8, + }, + shadows: customShadows, + }; +}; diff --git a/docs/data/material/getting-started/templates/sign-up/theme/themePrimitives.ts b/docs/data/material/getting-started/templates/sign-up/theme/themePrimitives.ts index 09df769bb6687d..41b517b5294fad 100644 --- a/docs/data/material/getting-started/templates/sign-up/theme/themePrimitives.ts +++ b/docs/data/material/getting-started/templates/sign-up/theme/themePrimitives.ts @@ -1,4 +1,4 @@ -import { createTheme, alpha, Shadows, PaletteMode } from '@mui/material/styles'; +import { createTheme, alpha, PaletteMode, Shadows } from '@mui/material/styles'; declare module '@mui/material/Paper' { interface PaperPropsVariantOverrides { @@ -22,7 +22,9 @@ declare module '@mui/material/styles/createPalette' { interface PaletteColor extends ColorRange {} } -const customTheme = createTheme(); +const defaultTheme = createTheme(); + +const customShadows: Shadows = [...defaultTheme.shadows]; export const brand = { 50: 'hsl(210, 100%, 95%)', @@ -89,143 +91,145 @@ export const red = { 900: 'hsl(0, 93%, 6%)', }; -export const getDesignTokens = (mode: PaletteMode) => ({ - palette: { - mode, - primary: { - light: brand[200], - main: brand[400], - dark: brand[700], - contrastText: brand[50], - ...(mode === 'dark' && { - contrastText: brand[50], - light: brand[300], +export const getDesignTokens = (mode: PaletteMode) => { + customShadows[1] = + mode === 'dark' + ? 'hsla(220, 30%, 5%, 0.7) 0px 4px 16px 0px, hsla(220, 25%, 10%, 0.8) 0px 8px 16px -5px' + : 'hsla(220, 30%, 5%, 0.07) 0px 4px 16px 0px, hsla(220, 25%, 10%, 0.07) 0px 8px 16px -5px'; + + return { + palette: { + mode, + primary: { + light: brand[200], main: brand[400], dark: brand[700], - }), - }, - info: { - light: brand[100], - main: brand[300], - dark: brand[600], - contrastText: gray[50], - ...(mode === 'dark' && { - contrastText: brand[300], - light: brand[500], - main: brand[700], - dark: brand[900], - }), - }, - warning: { - light: orange[300], - main: orange[400], - dark: orange[800], - ...(mode === 'dark' && { - light: orange[400], - main: orange[500], - dark: orange[700], - }), - }, - error: { - light: red[300], - main: red[400], - dark: red[800], - ...(mode === 'dark' && { - light: red[400], - main: red[500], - dark: red[700], - }), - }, - success: { - light: green[300], - main: green[400], - dark: green[800], - ...(mode === 'dark' && { - light: green[400], - main: green[500], - dark: green[700], - }), - }, - grey: { - ...gray, - }, - divider: mode === 'dark' ? alpha(gray[700], 0.6) : alpha(gray[300], 0.4), - background: { - default: 'hsl(0, 0%, 99%)', - paper: 'hsl(220, 35%, 97%)', - ...(mode === 'dark' && { default: gray[900], paper: 'hsl(220, 30%, 7%)' }), - }, - text: { - primary: gray[800], - secondary: gray[600], - warning: orange[400], - ...(mode === 'dark' && { primary: 'hsl(0, 0%, 100%)', secondary: gray[400] }), - }, - action: { - hover: alpha(gray[200], 0.2), - selected: `${alpha(gray[200], 0.3)}`, - ...(mode === 'dark' && { - hover: alpha(gray[600], 0.2), - selected: alpha(gray[600], 0.3), - }), - }, - }, - typography: { - fontFamily: ['"Inter", "sans-serif"'].join(','), - h1: { - fontSize: customTheme.typography.pxToRem(48), - fontWeight: 600, - lineHeight: 1.2, - letterSpacing: -0.5, - }, - h2: { - fontSize: customTheme.typography.pxToRem(36), - fontWeight: 600, - lineHeight: 1.2, - }, - h3: { - fontSize: customTheme.typography.pxToRem(30), - lineHeight: 1.2, - }, - h4: { - fontSize: customTheme.typography.pxToRem(24), - fontWeight: 600, - lineHeight: 1.5, - }, - h5: { - fontSize: customTheme.typography.pxToRem(20), - fontWeight: 600, - }, - h6: { - fontSize: customTheme.typography.pxToRem(18), - fontWeight: 600, - }, - subtitle1: { - fontSize: customTheme.typography.pxToRem(18), - }, - subtitle2: { - fontSize: customTheme.typography.pxToRem(14), - fontWeight: 500, - }, - body1: { - fontSize: customTheme.typography.pxToRem(14), - }, - body2: { - fontSize: customTheme.typography.pxToRem(14), - fontWeight: 400, - }, - caption: { - fontSize: customTheme.typography.pxToRem(12), - fontWeight: 400, - }, - }, - shape: { - borderRadius: 8, - }, - shadows: [ - 'none', - ...(mode === 'dark' - ? 'hsla(220, 30%, 5%, 0.7) 0px 4px 16px 0px, hsla(220, 25%, 10%, 0.8) 0px 8px 16px -5px' - : 'hsla(220, 30%, 5%, 0.07) 0px 4px 16px 0px, hsla(220, 25%, 10%, 0.07) 0px 8px 16px -5px'), - ] as Shadows, -}); + contrastText: brand[50], + ...(mode === 'dark' && { + contrastText: brand[50], + light: brand[300], + main: brand[400], + dark: brand[700], + }), + }, + info: { + light: brand[100], + main: brand[300], + dark: brand[600], + contrastText: gray[50], + ...(mode === 'dark' && { + contrastText: brand[300], + light: brand[500], + main: brand[700], + dark: brand[900], + }), + }, + warning: { + light: orange[300], + main: orange[400], + dark: orange[800], + ...(mode === 'dark' && { + light: orange[400], + main: orange[500], + dark: orange[700], + }), + }, + error: { + light: red[300], + main: red[400], + dark: red[800], + ...(mode === 'dark' && { + light: red[400], + main: red[500], + dark: red[700], + }), + }, + success: { + light: green[300], + main: green[400], + dark: green[800], + ...(mode === 'dark' && { + light: green[400], + main: green[500], + dark: green[700], + }), + }, + grey: { + ...gray, + }, + divider: mode === 'dark' ? alpha(gray[700], 0.6) : alpha(gray[300], 0.4), + background: { + default: 'hsl(0, 0%, 99%)', + paper: 'hsl(220, 35%, 97%)', + ...(mode === 'dark' && { default: gray[900], paper: 'hsl(220, 30%, 7%)' }), + }, + text: { + primary: gray[800], + secondary: gray[600], + warning: orange[400], + ...(mode === 'dark' && { primary: 'hsl(0, 0%, 100%)', secondary: gray[400] }), + }, + action: { + hover: alpha(gray[200], 0.2), + selected: `${alpha(gray[200], 0.3)}`, + ...(mode === 'dark' && { + hover: alpha(gray[600], 0.2), + selected: alpha(gray[600], 0.3), + }), + }, + }, + typography: { + fontFamily: ['"Inter", "sans-serif"'].join(','), + h1: { + fontSize: defaultTheme.typography.pxToRem(48), + fontWeight: 600, + lineHeight: 1.2, + letterSpacing: -0.5, + }, + h2: { + fontSize: defaultTheme.typography.pxToRem(36), + fontWeight: 600, + lineHeight: 1.2, + }, + h3: { + fontSize: defaultTheme.typography.pxToRem(30), + lineHeight: 1.2, + }, + h4: { + fontSize: defaultTheme.typography.pxToRem(24), + fontWeight: 600, + lineHeight: 1.5, + }, + h5: { + fontSize: defaultTheme.typography.pxToRem(20), + fontWeight: 600, + }, + h6: { + fontSize: defaultTheme.typography.pxToRem(18), + fontWeight: 600, + }, + subtitle1: { + fontSize: defaultTheme.typography.pxToRem(18), + }, + subtitle2: { + fontSize: defaultTheme.typography.pxToRem(14), + fontWeight: 500, + }, + body1: { + fontSize: defaultTheme.typography.pxToRem(14), + }, + body2: { + fontSize: defaultTheme.typography.pxToRem(14), + fontWeight: 400, + }, + caption: { + fontSize: defaultTheme.typography.pxToRem(12), + fontWeight: 400, + }, + }, + shape: { + borderRadius: 8, + }, + shadows: customShadows, + }; +}; diff --git a/docs/data/material/guides/localization/localization.md b/docs/data/material/guides/localization/localization.md index 2e69ae6826197d..f341c4725f0ef3 100644 --- a/docs/data/material/guides/localization/localization.md +++ b/docs/data/material/guides/localization/localization.md @@ -98,7 +98,7 @@ The [Data Grid and Data Grid Pro](/x/react-data-grid/) components have their own <!-- #default-branch-switch --> -You can [find the source](https://github.com/mui/material-ui/blob/next/packages/mui-material/src/locale/index.ts) in the GitHub repository. +You can [find the source](https://github.com/mui/material-ui/blob/master/packages/mui-material/src/locale/index.ts) in the GitHub repository. To create your own translation, or to customize the English text, copy this file to your project, make any changes needed and import the locale from there. @@ -107,5 +107,5 @@ However, Material UI aims to support the [100 most common](https://en.wikipedia ## RTL Support -Right-to-left languages such as Arabic, Persian, or Hebrew are supported. +Right-to-left languages such as Arabic, Persian, Hebrew, Kurdish, and others are supported. Follow [this guide](/material-ui/customization/right-to-left/) to use them. diff --git a/docs/data/material/guides/typescript/typescript.md b/docs/data/material/guides/typescript/typescript.md index ab31f6937079e3..16263e85624be0 100644 --- a/docs/data/material/guides/typescript/typescript.md +++ b/docs/data/material/guides/typescript/typescript.md @@ -6,7 +6,7 @@ <!-- #default-branch-switch --> -Material UI requires a minimum version of TypeScript 4.7. Have a look at the [Create React App with TypeScript](https://github.com/mui/material-ui/tree/next/examples/material-ui-cra-ts) example. +Material UI requires a minimum version of TypeScript 4.7. Have a look at the [Create React App with TypeScript](https://github.com/mui/material-ui/tree/master/examples/material-ui-cra-ts) example. For types to work, it's recommended that you have at least the following options enabled in your `tsconfig.json`: diff --git a/docs/data/material/integrations/interoperability/interoperability.md b/docs/data/material/integrations/interoperability/interoperability.md index d52dd16ef1b7df..bf2d2a1fa75110 100644 --- a/docs/data/material/integrations/interoperability/interoperability.md +++ b/docs/data/material/integrations/interoperability/interoperability.md @@ -274,8 +274,8 @@ If, however, you would like to use styled-components, you can configure your app <!-- #default-branch-switch --> -- [Create React App with styled-components](https://github.com/mui/material-ui/tree/next/examples/material-ui-cra-styled-components) -- [Create React App with styled-components and TypeScript](https://github.com/mui/material-ui/tree/next/examples/material-ui-cra-styled-components-ts) +- [Create React App with styled-components](https://github.com/mui/material-ui/tree/master/examples/material-ui-cra-styled-components) +- [Create React App with styled-components and TypeScript](https://github.com/mui/material-ui/tree/master/examples/material-ui-cra-styled-components-ts) Following this approach reduces the bundle size, and removes the need to configure the CSS injection order. diff --git a/docs/data/material/integrations/nextjs/nextjs.md b/docs/data/material/integrations/nextjs/nextjs.md index 75bcafea957d70..28dc59604c86c4 100644 --- a/docs/data/material/integrations/nextjs/nextjs.md +++ b/docs/data/material/integrations/nextjs/nextjs.md @@ -11,24 +11,18 @@ This section walks through the Material UI integration with the Next.js [App Ro Start by ensuring that you already have `@mui/material` and `next` installed. Then, run one of the following commands to install the dependencies: -:::info -The `next` tag is used to download the latest <b>pre-release</b>, v6 version. Remove it to get the current stable version. -::: - -<!-- #default-branch-switch --> - <codeblock storageKey="package-manager"> ```bash npm -npm install @mui/material-nextjs@next @emotion/cache +npm install @mui/material-nextjs @emotion/cache ``` -```bash yarn -yarn add @mui/material-nextjs@next @emotion/cache +```bash pnpm +pnpm add @mui/material-nextjs @emotion/cache ``` -```bash pnpm -pnpm add @mui/material-nextjs@next @emotion/cache +```bash yarn +yarn add @mui/material-nextjs @emotion/cache ``` </codeblock> @@ -73,42 +67,44 @@ Use the `options` prop to override the default [cache options](https://emotion.s </AppRouterCacheProvider> ``` -### Theming +### Font optimization -Create a new file and export a custom theme that includes the `'use client';` directive: +To integrate [Next.js font optimization](https://nextjs.org/docs/app/building-your-application/optimizing/fonts) with Material UI, create a new file with the `'use client';` directive. +Then create a theme using `var(--font-roboto)` as a value for the `typography.fontFamily` field. ```js title="src/theme.ts" 'use client'; -import { Roboto } from 'next/font/google'; import { createTheme } from '@mui/material/styles'; -const roboto = Roboto({ - weight: ['300', '400', '500', '700'], - subsets: ['latin'], - display: 'swap', -}); - const theme = createTheme({ typography: { - fontFamily: roboto.style.fontFamily, + fontFamily: 'var(--font-roboto)', }, }); export default theme; ``` -Then in `src/app/layout.tsx`, pass the theme to `ThemeProvider`: +Finally, in `src/app/layout.tsx`, pass the theme to the `ThemeProvider`: ```diff title="app/layout.tsx" import { AppRouterCacheProvider } from '@mui/material-nextjs/v13-appRouter'; ++import { Roboto } from 'next/font/google'; +import { ThemeProvider } from '@mui/material/styles'; +import theme from '../theme'; ++const roboto = Roboto({ ++ weight: ['300', '400', '500', '700'], ++ subsets: ['latin'], ++ display: 'swap', ++ variable: '--font-roboto', ++}); + export default function RootLayout(props) { const { children } = props; return ( <html lang="en"> - <body> ++ <body className={roboto.variable}> <AppRouterCacheProvider> + <ThemeProvider theme={theme}> {children} @@ -124,19 +120,16 @@ To learn more about theming, check out the [theming guide](/material-ui/customiz #### CSS theme variables -If you want to use [CSS theme variables](/material-ui/customization/css-theme-variables/overview/), use the `extendTheme` and `CssVarsProvider` utilities instead: +To use [CSS theme variables](/material-ui/customization/css-theme-variables/overview/), enable the `cssVariables` flag: ```diff title="src/theme.ts" 'use client'; --import { createTheme } from '@mui/material/styles'; -+import { extendTheme } from '@mui/material/styles'; - - // app/layout.tsx --import { ThemeProvider } from '@mui/material/styles'; -+import { CssVarsProvider } from '@mui/material/styles'; + const theme = createTheme({ ++ cssVariables: true, + }); ``` -Learn more about [the advantages of CSS theme variables](/material-ui/customization/css-theme-variables/overview/#advantages). +Learn more about [the advantages of CSS theme variables](/material-ui/customization/css-theme-variables/overview/#advantages) and how to [prevent SSR flickering](/material-ui/customization/css-theme-variables/configuration/#preventing-ssr-flickering). ### Using other styling solutions @@ -165,14 +158,14 @@ Then, run one of the following commands to install the dependencies: npm install @mui/material-nextjs @emotion/cache @emotion/server ``` -```bash yarn -yarn add @mui/material-nextjs @emotion/cache @emotion/server -``` - ```bash pnpm pnpm add @mui/material-nextjs @emotion/cache @emotion/server ``` +```bash yarn +yarn add @mui/material-nextjs @emotion/cache @emotion/server +``` + </codeblock> ### Configuration @@ -326,9 +319,9 @@ If you are using TypeScript, add `DocumentHeadTagsProps` to the Document's props } ``` -### Theming +### Font optimization -In `pages/_app.tsx`, create a new theme and pass it to `ThemeProvider`: +To integrate [Next.js font optimization](https://nextjs.org/docs/pages/building-your-application/optimizing/fonts) with Material UI, open `pages/_app.tsx` and create a theme using `var(--font-roboto)` as a value for the `typography.fontFamily` field. ```diff title="pages/_app.tsx" import * as React from 'react'; @@ -342,11 +335,12 @@ In `pages/_app.tsx`, create a new theme and pass it to `ThemeProvider`: + weight: ['300', '400', '500', '700'], + subsets: ['latin'], + display: 'swap', ++ variable: '--font-roboto', +}); +const theme = createTheme({ + typography: { -+ fontFamily: roboto.style.fontFamily, ++ fontFamily: var(--font-roboto), + }, +}); @@ -356,7 +350,9 @@ In `pages/_app.tsx`, create a new theme and pass it to `ThemeProvider`: <AppCacheProvider {...props}> <Head>...</Head> + <ThemeProvider theme={theme}> - <Component {...pageProps} /> ++ <main className={roboto.variable}> + <Component {...pageProps} /> ++ </main> + </ThemeProvider> </AppCacheProvider> ); @@ -367,11 +363,13 @@ To learn more about theming, check out the [Theming guide](/material-ui/customiz #### CSS theme variables -If you want to use [CSS theme variables](/material-ui/customization/css-theme-variables/overview/), use the `extendTheme` and `CssVarsProvider` instead: +To use [CSS theme variables](/material-ui/customization/css-theme-variables/overview/), enable the `cssVariables` flag: -```diff title="pages/_app.tsx" --import { ThemeProvider, createTheme } from '@mui/material/styles'; -+import { CssVarsProvider, extendTheme } from '@mui/material/styles'; +```diff title="src/theme.ts" + 'use client'; + const theme = createTheme({ ++ cssVariables: true, + }); ``` -Learn more about [the advantages of CSS theme variables](/material-ui/customization/css-theme-variables/overview/#advantages). +Learn more about [the advantages of CSS theme variables](/material-ui/customization/css-theme-variables/overview/#advantages) and how to [prevent SSR flickering](/material-ui/customization/css-theme-variables/configuration/#preventing-ssr-flickering). diff --git a/docs/data/material/integrations/styled-components/styled-components.md b/docs/data/material/integrations/styled-components/styled-components.md index f4535e06691d6f..0601f5b3e68205 100644 --- a/docs/data/material/integrations/styled-components/styled-components.md +++ b/docs/data/material/integrations/styled-components/styled-components.md @@ -35,11 +35,11 @@ If you're using yarn, you can configure it using a package resolution: ```diff title="package.json" { "dependencies": { -- "@mui/styled-engine": "next" -+ "@mui/styled-engine": "npm:@mui/styled-engine-sc@next" +- "@mui/styled-engine": "latest" ++ "@mui/styled-engine": "npm:@mui/styled-engine-sc@latest" }, + "resolutions": { -+ "@mui/styled-engine": "npm:@mui/styled-engine-sc@next" ++ "@mui/styled-engine": "npm:@mui/styled-engine-sc@latest" + }, } ``` @@ -102,8 +102,8 @@ We provide boilerplate examples of Create React App with Material UI and styled <!-- #default-branch-switch --> -- [Material UI + CRA + styled-components (JavaScript)](https://github.com/mui/material-ui/tree/next/examples/material-ui-cra-styled-components) -- [Material UI + CRA + styled-components (TypeScript)](https://github.com/mui/material-ui/tree/next/examples/material-ui-cra-styled-components-ts) +- [Material UI + CRA + styled-components (JavaScript)](https://github.com/mui/material-ui/tree/master/examples/material-ui-cra-styled-components) +- [Material UI + CRA + styled-components (TypeScript)](https://github.com/mui/material-ui/tree/master/examples/material-ui-cra-styled-components-ts) :::warning `@emotion/react`, `@emotion/styled`, and `styled-components` are optional peer dependencies of `@mui/material`, so you need to install them yourself. diff --git a/docs/data/material/migration/migrating-from-deprecated-apis/migrating-from-deprecated-apis.md b/docs/data/material/migration/migrating-from-deprecated-apis/migrating-from-deprecated-apis.md index dd449af5f953e1..2f9d85bed075a8 100644 --- a/docs/data/material/migration/migrating-from-deprecated-apis/migrating-from-deprecated-apis.md +++ b/docs/data/material/migration/migrating-from-deprecated-apis/migrating-from-deprecated-apis.md @@ -46,7 +46,7 @@ MUI System props (such as `mt={*}`, `bgcolor={*}`, and more) have been deprecat Use the codemod below to move all System props to the `sx` prop: ```bash -npx @mui/codemod@next v6.0.0/system-props <path/to/folder> +npx @mui/codemod@latest v6.0.0/system-props <path/to/folder> ``` You can also manually update your components as shown in the snippet below: @@ -63,7 +63,7 @@ Custom component variants defined in the theme are now merged with the theme sty Use this codemod to update your project's theme file: ```bash -npx @mui/codemod@next v6.0.0/theme-v6 <path/to/theme> +npx @mui/codemod@latest v6.0.0/theme-v6 <path/to/theme> ``` You can also manually update your theme as shown in the snippet below: @@ -246,7 +246,7 @@ Here's how to migrate: Use the [codemod](https://github.com/mui/material-ui/tree/HEAD/packages/mui-codemod#autocomplete-props) below to migrate the code as described in the following sections: ```bash -npx @mui/codemod@next deprecations/autocomplete-props <path> +npx @mui/codemod@latest deprecations/autocomplete-props <path> ``` ### componentsProps @@ -274,7 +274,7 @@ The Autocomplete's `componentsProps` prop was deprecated in favor of `slotProps` Use the [codemod](https://github.com/mui/material-ui/tree/HEAD/packages/mui-codemod#avatar-group-props) below to migrate the code as described in the following sections: ```bash -npx @mui/codemod@next deprecations/avatar-group-props <path> +npx @mui/codemod@latest deprecations/avatar-group-props <path> ``` ### slotProps.additionalAvatar @@ -332,7 +332,7 @@ The AvatarGroup's `componentsProps` was deprecated in favor of `slotProps`: Use the [codemod](https://github.com/mui/material-ui/tree/HEAD/packages/mui-codemod#backdrop-props) below to migrate the code as described in the following sections: ```bash -npx @mui/codemod@next deprecations/backdrop-props <path> +npx @mui/codemod@latest deprecations/backdrop-props <path> ``` ### components @@ -362,7 +362,7 @@ The Backdrop's `componentsProps` prop was deprecated in favor of `slotProps`: Use the [codemod](https://github.com/mui/material-ui/tree/HEAD/packages/mui-codemod#badge-props) below to migrate the code as described in the following sections: ```bash -npx @mui/codemod@next deprecations/badge-props <path> +npx @mui/codemod@latest deprecations/badge-props <path> ``` ### components @@ -941,7 +941,7 @@ Here's how to migrate: Use the [codemod](https://github.com/mui/material-ui/tree/HEAD/packages/mui-codemod#circular-progress-classes) below to migrate the code as described in the following sections: ```bash -npx @mui/codemod@next deprecations/circular-progress-classes <path> +npx @mui/codemod@latest deprecations/circular-progress-classes <path> ``` ### Composed CSS classes @@ -1000,7 +1000,7 @@ The Divider's `light` prop was deprecated, Use `sx={{ opacity : "0.6" }}` (or an Use the [codemod](https://github.com/mui/material-ui/tree/HEAD/packages/mui-codemod#filled-input-props) below to migrate the code as described in the following sections: ```bash -npx @mui/codemod@next deprecations/filled-input-props <path> +npx @mui/codemod@latest deprecations/filled-input-props <path> ``` ### components @@ -1030,7 +1030,7 @@ The FilledInput's prop `componentsProps` was deprecated in favor of `slotProps`: Use the [codemod](https://github.com/mui/material-ui/tree/HEAD/packages/mui-codemod#form-control-label-props) below to migrate the code as described in the following sections: ```bash -npx @mui/codemod@next deprecations/form-control-label-props <path> +npx @mui/codemod@latest deprecations/form-control-label-props <path> ``` ### componentsProps @@ -1049,7 +1049,7 @@ The FormControlLabel's `componentsProps` prop was deprecated in favor of `slotPr Use the [codemod](https://github.com/mui/material-ui/tree/HEAD/packages/mui-codemod#input-props) below to migrate the code as described in the following sections: ```bash -npx @mui/codemod@next deprecations/input-props <path> +npx @mui/codemod@latest deprecations/input-props <path> ``` ### components @@ -1079,7 +1079,7 @@ The Input's prop `componentsProps` was deprecated in favor of `slotProps`: Use the [codemod](https://github.com/mui/material-ui/tree/HEAD/packages/mui-codemod#input-base-props) below to migrate the code as described in the following sections: ```bash -npx @mui/codemod@next deprecations/input-base-props <path> +npx @mui/codemod@latest deprecations/input-base-props <path> ``` ### components @@ -1109,7 +1109,7 @@ The InputBase's prop `componentsProps` was deprecated in favor of `slotProps`: Use the [codemod](https://github.com/mui/material-ui/tree/HEAD/packages/mui-codemod#list-item-props) below to migrate the code as described in the following sections: ```bash -npx @mui/codemod@next deprecations/list-item-props <path> +npx @mui/codemod@latest deprecations/list-item-props <path> ``` ### components @@ -1166,31 +1166,12 @@ The ListItemSecondaryAction component was deprecated in favor of the `secondaryA </ListItem> ``` -## Grid - -Use the [codemod](https://github.com/mui/material-ui/tree/HEAD/packages/mui-codemod#grid-props) below to migrate the code as described in the following sections: - -```bash -npx @mui/codemod@next deprecations/grid-props <path> -``` - -### wrap prop - -The Grid's `wrap` prop was deprecated in favor of `flexWrap` MUI System prop: - -```diff - <Grid -- wrap="nowrap" -+ flexWrap="nowrap" - > -``` - ## ImageListItemBar Use the [codemod](https://github.com/mui/material-ui/tree/HEAD/packages/mui-codemod#image-list-item-bar-classes) below to migrate the code as described in the following sections: ```bash -npx @mui/codemod@next deprecations/image-list-item-bar-classes <path> +npx @mui/codemod@latest deprecations/image-list-item-bar-classes <path> ``` ### Composed CSS classes @@ -1246,7 +1227,7 @@ Here's how to migrate: Use the [codemod](https://github.com/mui/material-ui/tree/HEAD/packages/mui-codemod#modal-props) below to migrate the code as described in the following sections: ```bash -npx @mui/codemod@next deprecations/modal-props <path> +npx @mui/codemod@latest deprecations/modal-props <path> ``` ### components @@ -1276,7 +1257,7 @@ The Modal's `componentsProps` prop was deprecated in favor of `slotProps`: Use the [codemod](https://github.com/mui/material-ui/tree/HEAD/packages/mui-codemod#outlined-input-props) below to migrate the code as described in the following sections: ```bash -npx @mui/codemod@next deprecations/outlined-input-props <path> +npx @mui/codemod@latest deprecations/outlined-input-props <path> ``` ### components @@ -1306,7 +1287,7 @@ The OutlinedInput's prop `componentsProps` was deprecated in favor of `slotProps Use the [codemod](https://github.com/mui/material-ui/tree/HEAD/packages/mui-codemod#pagination-item-classes) below to migrate the code as described in the following sections: ```bash -npx @mui/codemod@next deprecations/pagination-item-classes <path> +npx @mui/codemod@latest deprecations/pagination-item-classes <path> ``` ### Composed CSS classes @@ -1369,7 +1350,7 @@ The PaginationItems's `components` prop was deprecated in favor of `slots`: Use the [codemod](https://github.com/mui/material-ui/tree/HEAD/packages/mui-codemod#popper-props) below to migrate the code as described in the following sections: ```bash -npx @mui/codemod@next deprecations/popper-props <path> +npx @mui/codemod@latest deprecations/popper-props <path> ``` ### components @@ -1469,7 +1450,7 @@ Here's how to migrate: Use the [codemod](https://github.com/mui/material-ui/tree/HEAD/packages/mui-codemod#tab-classes) below to migrate the code as described in the following sections: ```bash -npx @mui/codemod@next deprecations/tab-classes <path> +npx @mui/codemod@latest deprecations/tab-classes <path> ``` ### Composed CSS classes @@ -1503,7 +1484,7 @@ Here's how to migrate: Use the [codemod](https://github.com/mui/material-ui/tree/HEAD/packages/mui-codemod#table-sort-label-classes) below to migrate the code as described in the following sections: ```bash -npx @mui/codemod@next deprecations/table-sort-label-classes <path> +npx @mui/codemod@latest deprecations/table-sort-label-classes <path> ``` ### Composed CSS classes @@ -1543,7 +1524,7 @@ Here's how to migrate: Use the [codemod](https://github.com/mui/material-ui/tree/HEAD/packages/mui-codemod#text-field-props) below to migrate the code as described in the following sections: ```bash -npx @mui/codemod@next deprecations/text-field-props <path> +npx @mui/codemod@latest deprecations/text-field-props <path> ``` ### \*Props props @@ -1572,7 +1553,7 @@ All of the TextField's slot props (`*Props`) props were deprecated in favor of e Use the [codemod](https://github.com/mui/material-ui/tree/HEAD/packages/mui-codemod#tooltip-props) below to migrate the code as described in the following sections: ```bash -npx @mui/codemod@next deprecations/tooltip-props <path> +npx @mui/codemod@latest deprecations/tooltip-props <path> ``` ### components @@ -1647,7 +1628,7 @@ The StepLabel's `componentsProps` prop was deprecated in favor of `slotProps`: Use the [codemod](https://github.com/mui/material-ui/tree/HEAD/packages/mui-codemod#step-connector-classes) below to migrate the code as described in the following sections: ```bash -npx @mui/codemod@next deprecations/step-connector-classes <path> +npx @mui/codemod@latest deprecations/step-connector-classes <path> ``` ### Composed CSS classes diff --git a/docs/data/material/migration/migration-grid-v2/migration-grid-v2.md b/docs/data/material/migration/migration-grid-v2/migration-grid-v2.md index e3cf7f67d5629c..41ce6e24d68ce0 100644 --- a/docs/data/material/migration/migration-grid-v2/migration-grid-v2.md +++ b/docs/data/material/migration/migration-grid-v2/migration-grid-v2.md @@ -80,7 +80,7 @@ The Grid v2 is marked as stable in Material UI v6, so the `Unstable_` prefix is ``` Alongside the stabilization, the API has been improved. -You can see the changes and further details on how to migrate in the [Material UI v6 upgrade guide](/material-ui/migration/upgrade-to-v6/). +You can see the changes and further details on how to migrate in the [Material UI v6 upgrade guide](/material-ui/migration/upgrade-to-v6/#grid2). Finally, the original Grid component is deprecated and will be removed in the future, so we highly encourage you to migrate to Grid v2. diff --git a/docs/data/material/migration/migration-v3/migration-v3.md b/docs/data/material/migration/migration-v3/migration-v3.md index 37669cf623d78c..b42cd2466f2969 100644 --- a/docs/data/material/migration/migration-v3/migration-v3.md +++ b/docs/data/material/migration/migration-v3/migration-v3.md @@ -171,7 +171,7 @@ yarn add @material-ui/styles + spacing: PropTypes.oneOf([0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10]), ``` - Going forward, you can use the theme to implement [a custom Grid spacing transformation function](https://mui.com/system/spacing/#transformation). + Going forward, you can use the theme to implement [a custom Grid spacing transformation function](/system/spacing/#transformation). - [Container] Moved from `@material-ui/lab` to `@material-ui/core`. diff --git a/docs/data/material/migration/migration-v4/v5-component-changes.md b/docs/data/material/migration/migration-v4/v5-component-changes.md index f2f179a7b0d820..8fa8f2b793e237 100644 --- a/docs/data/material/migration/migration-v4/v5-component-changes.md +++ b/docs/data/material/migration/migration-v4/v5-component-changes.md @@ -744,7 +744,7 @@ The props `alignItems`, `alignContent`, and `justifyContent`—along with their These props are now considered part of MUI System, not the `Grid` component itself. -If you still wish to add overrides for them, you can use the [callback as a value in `styleOverrides`](/material-ui/customization/theme-components/#overrides-based-on-props). +If you still wish to add overrides for them, you can use the [callback as a value in `styleOverrides`](https://v5.mui.com/material-ui/customization/theme-components/#overrides-based-on-props). ```diff const theme = createTheme({ @@ -775,7 +775,7 @@ If you need negative margins on all sides, we recommend using the new Grid v2 in + import Grid from '@mui/material/Grid2'; ``` -To learn more about the Grid v2, check out the [demos](/material-ui/react-grid2/#whats-changed) and the [Grid migration guide](/material-ui/migration/migration-grid-v2/). +To learn more about the Grid v2, check out the [demos](/material-ui/react-grid2/) and the [Grid migration guide](/material-ui/migration/migration-grid-v2/). :::info Grid v2 was introduced in Material UI v5.9.1 and features negative margins on all sides by default. @@ -1862,7 +1862,7 @@ The following classes and style overrides keys were removed: These props are now considered part of MUISystem rather than the `Typography` component itself. -If you still wish to add overrides for them, you can use the [callback as a value in `styleOverrides`](/material-ui/customization/theme-components/#overrides-based-on-props). +If you still wish to add overrides for them, you can use the [callback as a value in `styleOverrides`](https://v5.mui.com/material-ui/customization/theme-components/#overrides-based-on-props). For example: diff --git a/docs/data/material/migration/upgrade-to-v6/migrating-to-pigment-css.md b/docs/data/material/migration/upgrade-to-v6/migrating-to-pigment-css.md index f124bc34de7682..fb2ca30d14c3fe 100644 --- a/docs/data/material/migration/upgrade-to-v6/migrating-to-pigment-css.md +++ b/docs/data/material/migration/upgrade-to-v6/migrating-to-pigment-css.md @@ -30,14 +30,14 @@ First, install the Material UI wrapper package for Pigment CSS: npm install @mui/material-pigment-css ``` -```bash yarn -yarn add @mui/material-pigment-css -``` - ```bash pnpm pnpm add @mui/material-pigment-css ``` +```bash yarn +yarn add @mui/material-pigment-css +``` + </codeblock> Then, follow the instructions based on your framework: @@ -52,14 +52,14 @@ Install the Next.js plugin as a dev dependency: npm install --save-dev @pigment-css/nextjs-plugin ``` -```bash yarn -yarn add -D @pigment-css/nextjs-plugin -``` - ```bash pnpm pnpm add -D @pigment-css/nextjs-plugin ``` +```bash yarn +yarn add -D @pigment-css/nextjs-plugin +``` + </codeblock> Then, open Next.js config file and add the plugin: @@ -200,18 +200,57 @@ Otherwise you're now ready to start the development server: npm run dev ``` -```bash yarn -yarn dev -``` - ```bash pnpm pnpm dev ``` +```bash yarn +yarn dev +``` + </codeblock> Open the browser and navigate to the localhost URL, you should see the app running with Pigment CSS. +### Next.js font optimization + +If you are using `next/font` to optimize font loading, pass a CSS variable name to the `variable` property of the font configuration and use it in the body className: + +```diff title="app/layout.tsx" + import { Roboto } from 'next/font/google'; + + const roboto = Roboto({ + weight: ['300', '400', '500', '700'], + subsets: ['latin'], + display: 'swap', ++ variable: '--my-font-family', + }); + +export default function RootLayout(props) { + const { children } = props; + return ( + <html lang="en"> ++ <body className={roboto.variable}> + {children} + </body> + </html> + ); + } +``` + +Finally, update the `typography.fontFamily` value with the variable created in the previous step: + +```diff title="next.config.mjs" + const pigmentConfig = { + transformLibraries: ['@mui/material'], + theme: createTheme({ ++ typography: { ++ fontFamily: 'var(--my-font-family)', ++ }, + }), + }; +``` + ### Typescript If you are using TypeScript, you need to extend the Pigment CSS theme types with Material UI `Theme`. @@ -274,7 +313,7 @@ We recommend reading the rest of the guide below to learn about the new styling Since Pigment CSS is a build-time extraction tool, it does not support owner state through callbacks. Here is an example that will throw an error at build time: ```js -const theme = extendTheme({ +const theme = createTheme({ components: { MuiCard: { styleOverrides: { @@ -295,7 +334,7 @@ const theme = extendTheme({ Run the following codemod to remove the owner state from the theme: ```bash -npx @mui/codemod@next v6.0.0/theme-v6 next.config.mjs +npx @mui/codemod@latest v6.0.0/theme-v6 next.config.mjs ``` There are cases where the codemod is not able to remove the owner state. In such cases, you have to manually replace the owner state with `variants`. @@ -307,7 +346,7 @@ If you have a dynamic color based on the theme palette, you can use the `variant <codeblock> ```js before -const theme = extendTheme({ +const theme = createTheme({ components: { MuiCard: { styleOverrides: { @@ -321,7 +360,7 @@ const theme = extendTheme({ ``` ```js after -const theme = extendTheme({ +const theme = createTheme({ components: { MuiCard: { styleOverrides: { @@ -352,9 +391,9 @@ Use `DefaultPropsProvider` in your main application file and move all the compon <codeblock> ```diff next.config|vite.config - import { extendTheme } from '@mui/material'; + import { createTheme } from '@mui/material'; - const customTheme = extendTheme({ + const customTheme = createTheme({ // ...other tokens. components: { MuiButtonBase: { @@ -399,7 +438,7 @@ Use `DefaultPropsProvider` in your main application file and move all the compon Run the following codemod: ```bash -npx @mui/codemod@next v6.0.0/sx-prop path/to/folder +npx @mui/codemod@latest v6.0.0/sx-prop path/to/folder ``` The scenarios below are not covered by the codemod, so you have to manually update them: @@ -485,7 +524,7 @@ If you have custom components that are using `styled` from `@mui/material/styles Then, run the following codemod: ```bash -npx @mui/codemod@next v6.0.0/styled path/to/folder +npx @mui/codemod@latest v6.0.0/styled path/to/folder ``` The scenarios below are not covered by the codemod, so you have to manually update them: @@ -639,7 +678,7 @@ Update the config file with the following code to enable right-to-left support: ```diff const pigmentConfig = { - theme: extendTheme(), + theme: createTheme(), + css: { + // Specify your default CSS authoring direction + defaultDirection: 'ltr', diff --git a/docs/data/material/migration/upgrade-to-v6/upgrade-to-v6.md b/docs/data/material/migration/upgrade-to-v6/upgrade-to-v6.md index a6efdaa62f5cd1..0acd3bcec0e275 100644 --- a/docs/data/material/migration/upgrade-to-v6/upgrade-to-v6.md +++ b/docs/data/material/migration/upgrade-to-v6/upgrade-to-v6.md @@ -23,16 +23,7 @@ Material UI v6 features several other quality-of-life improvements, including: - support for [container queries](/material-ui/customization/container-queries/) - a [new theme utility](#color-mode-theme-utility) for adding styles to specific color modes -## Start using the beta release - -In your `package.json` file, change the package version from `"latest"` to `"next"`. - -```diff title="package.json" --"@mui/material": "latest", -+"@mui/material": "next", -``` - -If you're using any of these packages, you can also change their version to `"next"`: +If you're using any of these packages, you can also change their version to `"6.0.0"`: - `@mui/icons-material` - `@mui/system` @@ -87,14 +78,14 @@ Use the snippet below to update your project (replace the `<version>` with the o npm install react@<version> react-dom@<version> ``` -```bash yarn -yarn add react@<version> react-dom@<version> -``` - ```bash pnpm pnpm add react@<version> react-dom@<version> ``` +```bash yarn +yarn add react@<version> react-dom@<version> +``` + </codeblock> ### Minimum TypeScript version @@ -281,7 +272,7 @@ Additionally, the `true` value for the `size` prop was renamed to `"grow"`: Use this codemod to migrate your project to the new `size` and `offset` props: ```bash -npx @mui/codemod@next v6.0.0/grid-v2-props <path/to/folder> +npx @mui/codemod@latest v6.0.0/grid-v2-props <path/to/folder> ``` :::warning @@ -300,7 +291,7 @@ The usage described above also applies to custom breakpoints: You can use the same codemod for custom breakpoints by providing the breakpoints as an argument: ```bash -npx @mui/codemod@next v6.0.0/grid-v2-props <path/to/folder> --jscodeshift='--muiBreakpoints=mobile,desktop' +npx @mui/codemod@latest v6.0.0/grid-v2-props <path/to/folder> --jscodeshift='--muiBreakpoints=mobile,desktop' ``` #### disableEqualOverflow prop removed @@ -343,7 +334,7 @@ Still, we strongly recommend adopting this new behavior rather than trying to re Use this codemod to migrate your project to the `ListItemButton` component: ```bash -npx @mui/codemod@next v6.0.0/list-item-button-prop <path/to/folder> +npx @mui/codemod@latest v6.0.0/list-item-button-prop <path/to/folder> ``` As the `ListItem` no longer supports these props, the class names related to these props were removed. You should use the `listItemButtonClasses` object instead. @@ -369,11 +360,6 @@ As the `ListItem` no longer supports these props, the class names related to the In v6, the `children` prop passed to the Loading Button component is now wrapped in a `<span>` tag to avoid [issues](https://github.com/mui/material-ui/issues/27853) when using tools to translate websites. -### Rating - -Previously, due to a bug, the `aria-label` attribute was "null Stars" when no value was set in the Rating component. -This is fixed in v6, with the `aria-label` attribute being "0 Stars" when no value is set. - ### useMediaQuery types The following deprecated types are removed in v6: @@ -462,9 +448,9 @@ Material UI v6 introduces a new utility for adding styles to specific color mod Use these codemods to migrate your project to `theme.applyStyles`: ```bash -npx @mui/codemod@next v6.0.0/styled <path/to/folder-or-file> -npx @mui/codemod@next v6.0.0/sx-prop <path/to/folder-or-file> -npx @mui/codemod@next v6.0.0/theme-v6 <path/to/theme-file> +npx @mui/codemod@latest v6.0.0/styled <path/to/folder-or-file> +npx @mui/codemod@latest v6.0.0/sx-prop <path/to/folder-or-file> +npx @mui/codemod@latest v6.0.0/theme-v6 <path/to/theme-file> ``` :::info diff --git a/docs/data/material/pages.ts b/docs/data/material/pages.ts index a591e87eb630d9..cc56a45fc9beb5 100644 --- a/docs/data/material/pages.ts +++ b/docs/data/material/pages.ts @@ -139,6 +139,15 @@ const pages: MuiPage[] = [ { pathname: '/x/react-tree-view', title: 'Tree View' }, ], }, + { + pathname: '/toolpad', // the pathname does not matter here because the links to Toolpad are outbound. + subheader: 'Toolpad Core', + newFeature: true, + children: [ + { pathname: '/toolpad/core/react-dashboard-layout/', title: 'Dashboard Layout' }, + { pathname: '/toolpad/core/react-sign-in-page/', title: 'Sign-in Page' }, + ], + }, { pathname: '/material-ui', subheader: 'lab', diff --git a/docs/data/styles/basics/basics.md b/docs/data/styles/basics/basics.md index deab3798fbaeb8..f654a750ce5d72 100644 --- a/docs/data/styles/basics/basics.md +++ b/docs/data/styles/basics/basics.md @@ -17,14 +17,10 @@ Please use [`@mui/system`](/system/getting-started/) instead. To install and save in your `package.json` dependencies, run: -:::info -The `next` tag is used to download the latest <b>pre-release</b>, v6 version. Remove it to get the current stable version. -::: - <!-- #default-branch-switch --> ```bash -npm install @mui/styles@next +npm install @mui/styles ``` ## Getting started diff --git a/docs/data/system/experimental-api/css-theme-variables/css-theme-variables.md b/docs/data/system/experimental-api/css-theme-variables/css-theme-variables.md index 117d1727b44107..6905605fb83fd1 100644 --- a/docs/data/system/experimental-api/css-theme-variables/css-theme-variables.md +++ b/docs/data/system/experimental-api/css-theme-variables/css-theme-variables.md @@ -12,7 +12,7 @@ If this is your first time encountering CSS variables, you should check out [the CSS theme variable support is a new feature in MUI System added in [`v5.0.5`](https://github.com/mui/material-ui/releases/tag/v5.0.5) as an experimental export. It tells the underlying Material UI, Joy UI or even custom UI library components to use the generated CSS theme variables instead of raw values. This provides significant improvements in developer experience related to theming and customization. With these variables, you can inject a theme into your app's stylesheet _at build time_ to apply the user's selected settings before the whole app is rendered. -Learn more about the [advantages](https://mui.com/material-ui/customization/css-theme-variables/overview/#advantages) and [trade-offs](https://mui.com/material-ui/customization/css-theme-variables/overview/#trade-offs) of using CSS theme variables. +Learn more about the [advantages](/material-ui/customization/css-theme-variables/overview/#advantages) and [trade-offs](/material-ui/customization/css-theme-variables/overview/#trade-offs) of using CSS theme variables. ### Advantages @@ -40,7 +40,7 @@ The comparison described in the table above may not be applicable to large and c ## Usage The CSS variables API usage is exposed as a higher order function called `unstable_createCssVarsProvider` which can be called to create a theme provider and other utilities to share the theme config throughout your app. This is a very low-level function and has a lot of moving parts. -If you're using [Material UI](https://mui.com/material-ui/customization/css-theme-variables/overview/) or [Joy UI](https://mui.com/joy-ui/customization/using-css-variables/), they expose their own `CssVarsProvider` component that you can use directly without configuring your theme. +If you're using [Material UI](/material-ui/customization/css-theme-variables/overview/) or [Joy UI](/joy-ui/customization/using-css-variables/), they expose their own `CssVarsProvider` component that you can use directly without configuring your theme. We'll first define a minimal theme palette for light and dark modes. @@ -185,10 +185,11 @@ Now, the Button's `backgroundColor`, `borderColor` and text `color` values will ### Demo {{"demo": "CreateCssVarsProvider.js"}} -For framework- or language-specific setup instructions, see [CSS theme variables—Usage—Server-side rendering](https://mui.com/material-ui/customization/css-theme-variables/usage/#server-side-rendering). -For framework or language specific setup, see [this](https://mui.com/material-ui/customization/css-theme-variables/usage/#server-side-rendering) -See the complete usage of `createCssVarsProvider` in [Material UI](https://github.com/mui/material-ui/blob/master/packages/mui-material/src/styles/CssVarsProvider.tsx) and [Joy UI](https://github.com/mui/material-ui/blob/master/packages/mui-joy/src/styles/CssVarsProvider.tsx). +For framework- or language-specific setup instructions, see [CSS theme variables—Usage—Server-side rendering](/material-ui/customization/css-theme-variables/usage/). +For framework or language specific setup, see [this](/material-ui/customization/css-theme-variables/usage/) + +See the complete usage of `createCssVarsProvider` in [Material UI](https://github.com/mui/material-ui/blob/master/packages/mui-material/src/styles/ThemeProviderWithVars.tsx) and [Joy UI](https://github.com/mui/material-ui/blob/master/packages/mui-joy/src/styles/CssVarsProvider.tsx). ## API diff --git a/docs/data/system/getting-started/installation/installation.md b/docs/data/system/getting-started/installation/installation.md index 325db1402f6063..8bea51f6f8d758 100644 --- a/docs/data/system/getting-started/installation/installation.md +++ b/docs/data/system/getting-started/installation/installation.md @@ -6,20 +6,18 @@ Run one of the following commands to add MUI System to your project: -<!-- #default-branch-switch --> - <codeblock storageKey="package-manager"> ```bash npm -npm install @mui/system@next @emotion/react @emotion/styled +npm install @mui/system @emotion/react @emotion/styled ``` -```bash yarn -yarn add @mui/system@next @emotion/react @emotion/styled +```bash pnpm +pnpm add @mui/system @emotion/react @emotion/styled ``` -```bash pnpm -pnpm add @mui/system@next @emotion/react @emotion/styled +```bash yarn +yarn add @mui/system @emotion/react @emotion/styled ``` </codeblock> @@ -41,24 +39,20 @@ Please note that [react](https://www.npmjs.com/package/react) is a peer dependen MUI System uses [Emotion](https://emotion.sh/docs/introduction) as its default styling engine. If you want to use [styled-components](https://styled-components.com/) instead, run one of the following commands: -:::info -The `next` tag is used to download the latest <b>pre-release</b>, v6 version. Remove it to get the current stable version. -::: - <!-- #default-branch-switch --> <codeblock storageKey="package-manager"> ```bash npm -npm install @mui/system@next @mui/styled-engine-sc@next styled-components +npm install @mui/system @mui/styled-engine-sc styled-components ``` -```bash yarn -yarn add @mui/system@next @mui/styled-engine-sc@next styled-components +```bash pnpm +pnpm add @mui/system @mui/styled-engine-sc styled-components ``` -```bash pnpm -pnpm add @mui/system@next @mui/styled-engine-sc@next styled-components +```bash yarn +yarn add @mui/system @mui/styled-engine-sc styled-components ``` </codeblock> diff --git a/docs/data/system/getting-started/the-sx-prop/the-sx-prop.md b/docs/data/system/getting-started/the-sx-prop/the-sx-prop.md index e3a2c5f4ee7dee..61f86a7491bbf5 100644 --- a/docs/data/system/getting-started/the-sx-prop/the-sx-prop.md +++ b/docs/data/system/getting-started/the-sx-prop/the-sx-prop.md @@ -209,7 +209,7 @@ Please use the callback as the entire value instead. You can migrate the code using our codemod: ```bash -npx @mui/codemod@next v6.0.0/sx-prop path/to/file-or-folder +npx @mui/codemod@latest v6.0.0/sx-prop path/to/file-or-folder ``` ::: diff --git a/docs/data/system/getting-started/usage/usage.md b/docs/data/system/getting-started/usage/usage.md index 13eecae50d9099..6d3d0bae641795 100644 --- a/docs/data/system/getting-started/usage/usage.md +++ b/docs/data/system/getting-started/usage/usage.md @@ -158,7 +158,7 @@ Runtime performance takes a hit. <!-- #default-branch-switch --> -Visit the [benchmark folder](https://github.com/mui/material-ui/tree/next/benchmark/browser) for a reproduction of the metrics above. +Visit the [benchmark folder](https://github.com/mui/material-ui/tree/master/benchmark/browser) for a reproduction of the metrics above. We believe that for most use cases it's fast enough, but there are simple workarounds when performance becomes critical. For instance, when rendering a list with many items, you can use a CSS child selector to have a single "style injection" point (using d. for the wrapper and a. for each item). diff --git a/docs/data/system/migration/migrating-to-v6/migrating-to-v6.md b/docs/data/system/migration/migrating-to-v6/migrating-to-v6.md index e34a9766a07b19..65e00ad0312b07 100644 --- a/docs/data/system/migration/migrating-to-v6/migrating-to-v6.md +++ b/docs/data/system/migration/migrating-to-v6/migrating-to-v6.md @@ -96,7 +96,7 @@ Besides that, the `true` value for the size prop was renamed to `"grow"`: Use this codemod to migrate your project to the new size and offset props: ```bash -npx @mui/codemod@next v6.0.0/grid-v2-props <path/to/folder> +npx @mui/codemod@latest v6.0.0/grid-v2-props <path/to/folder> ``` :::warning @@ -113,7 +113,7 @@ If you have custom breakpoints, the change is the same: Which you can cover with the same codemod by providing the custom breakpoints as an argument: ```bash -npx @mui/codemod@next v6.0.0/grid-v2-props <path/to/folder> --jscodeshift='--muiBreakpoints=mobile,desktop' +npx @mui/codemod@latest v6.0.0/grid-v2-props <path/to/folder> --jscodeshift='--muiBreakpoints=mobile,desktop' ``` #### Removal of the disableEqualOverflow prop diff --git a/docs/data/system/styled/styled.md b/docs/data/system/styled/styled.md index 0802a73874e16d..87520005039660 100644 --- a/docs/data/system/styled/styled.md +++ b/docs/data/system/styled/styled.md @@ -24,7 +24,7 @@ The utility can be used as a replacement for emotion's or styled-components' sty It aims to solve the same problem, but also provides the following benefits: 1. It uses a default `theme` if no theme is available in React context. -2. It supports the theme's [`styleOverrides`](/material-ui/customization/theme-components/#theme-style-overrides) and [`variants`](/material-ui/customization/theme-components/#creating-new-component-variants) to be applied, based on the `name` applied in the options (can be skipped). +2. It supports the theme's [`styleOverrides`](/material-ui/customization/theme-components/#theme-style-overrides) and [`variants`](/material-ui/customization/theme-components/#variants) to be applied, based on the `name` applied in the options (can be skipped). 3. It adds support for the [the `sx` prop](/system/getting-started/the-sx-prop/) (can be skipped). 4. It adds by default the `shouldForwardProp` option (that can be overridden), taking into account: `ownerState`, `theme`, `sx`, and `as`. @@ -280,6 +280,12 @@ module.exports = { styledBaseImport: ["@mui/system", "styled"] } }, + "@mui/material": { + styled: { + canonicalImport: ["@emotion/styled", "default"], + styledBaseImport: ["@mui/material", "styled"] + } + }, "@mui/material/styles": { styled: { canonicalImport: ["@emotion/styled", "default"], @@ -294,4 +300,8 @@ module.exports = { ``` +:::info +Note: If you use [`babel-plugin-direct-import`](https://github.com/avocadowastaken/babel-plugin-direct-import), place it after `@emotion/babel-plugin` in the Babel config. +::: + Now you should be able to use components as your selectors! diff --git a/docs/next.config.mjs b/docs/next.config.mjs index 4fe7014fb0b469..78b8bbe89ce1f0 100644 --- a/docs/next.config.mjs +++ b/docs/next.config.mjs @@ -192,7 +192,7 @@ export default withDocsInfra({ // docs-infra LIB_VERSION: pkg.version, SOURCE_CODE_REPO: 'https://github.com/mui/material-ui', - SOURCE_GITHUB_BRANCH: 'next', // #default-branch-switch + SOURCE_GITHUB_BRANCH: 'master', // #default-branch-switch GITHUB_TEMPLATE_DOCS_FEEDBACK: '4.docs-feedback.yml', BUILD_ONLY_ENGLISH_LOCALE: String(buildOnlyEnglishLocale), // MUI Core related diff --git a/docs/nextConfigDocsInfra.js b/docs/nextConfigDocsInfra.js index b5e7a45f170b9d..45495d63175cf7 100644 --- a/docs/nextConfigDocsInfra.js +++ b/docs/nextConfigDocsInfra.js @@ -49,7 +49,7 @@ process.env.DEPLOY_ENV = DEPLOY_ENV; function withDocsInfra(nextConfig) { return { trailingSlash: true, - // Can be turned on when https://github.com/vercel/next.js/issues/24640 is fixed + // TODO: Remove when upgrading to Next.js 15, see https://github.com/vercel/next.js/pull/69137 optimizeFonts: false, reactStrictMode: true, ...nextConfig, diff --git a/docs/notifications.json b/docs/notifications.json index 22c1b5df25b935..01ee0a5b7ea6da 100644 --- a/docs/notifications.json +++ b/docs/notifications.json @@ -1,9 +1,4 @@ [ - { - "id": 78, - "title": "MUI X v6.18.x and the latest improvements before the next major", - "text": "New stable components, polished features, better performance and more. Check out the details in our <a style=\"color: inherit;\" data-ga-event-category=\"Announcement\" data-ga-event-action=\"notification\" data-ga-event-label=\"mui-x-end-v6\" href=\"https://mui.com/blog/mui-x-end-v6-features/\">recent blog post</a>." - }, { "id": 81, "title": "Introducing MUI X v7", @@ -13,5 +8,10 @@ "id": 82, "title": "Upcoming changes to MUI X pricing in 2024", "text": "Check out the <a style=\"color: inherit;\" data-ga-event-category=\"Announcement\" data-ga-event-action=\"notification\" data-ga-event-label=\"mui-x\" href=\"https://mui.com/blog/mui-x-sep-2024-price-update/\">new pricing updates</a> and how to transition to the new model." + }, + { + "id": 83, + "title": "Material UI v6 is out now", + "text": "This major release includes CSS variables support, experimental opt-in CSS extraction, and many more improvements. Check out the <a style=\"color: inherit;\" data-ga-event-category=\"Announcement\" data-ga-event-action=\"notification\" data-ga-event-label=\"material-ui-v6\" href=\"https://mui.com/blog/material-ui-v6-is-out/\">announcement blog post</a>." } ] diff --git a/docs/package.json b/docs/package.json index 5bd0f958bbf0cf..b292ae11485e61 100644 --- a/docs/package.json +++ b/docs/package.json @@ -9,7 +9,7 @@ "build:clean": "rimraf .next && pnpm build", "build-sw": "node ./scripts/buildServiceWorker.js", "dev": "next dev", - "deploy": "git push -f material-ui-docs next:next", + "deploy": "git push -f material-ui-docs master:latest", "icons": "rimraf --glob public/static/icons/* && node ./scripts/buildIcons.js", "start": "serve ./export", "create-playground": "cpy --cwd=scripts playground.template.tsx ../../pages/playground --rename=index.tsx", @@ -24,7 +24,7 @@ "@babel/runtime-corejs2": "^7.25.0", "@docsearch/react": "^3.6.1", "@emotion/cache": "^11.13.1", - "@emotion/react": "^11.13.0", + "@emotion/react": "^11.13.3", "@emotion/server": "^11.11.0", "@emotion/styled": "^11.13.0", "@fortawesome/fontawesome-svg-core": "^6.6.0", @@ -54,7 +54,7 @@ "@mui/x-tree-view": "7.13.0", "@popperjs/core": "^2.11.8", "@react-spring/web": "^9.7.4", - "@toolpad/core": "^0.5.1", + "@toolpad/core": "^0.5.2", "autoprefixer": "^10.4.20", "autosuggest-highlight": "^3.3.4", "babel-plugin-module-resolver": "^5.0.2", @@ -67,9 +67,7 @@ "core-js": "^2.6.11", "cross-env": "^7.0.3", "css-mediaquery": "^0.1.2", - "date-fns": "^2.30.0", - "date-fns-jalali": "^2.21.3-1", - "dayjs": "^1.11.12", + "dayjs": "^1.11.13", "feed": "^4.2.2", "fg-loadcss": "^3.1.0", "final-form": "^4.20.10", @@ -83,10 +81,10 @@ "lz-string": "^1.5.0", "markdown-to-jsx": "^7.4.7", "material-ui-popup-state": "^5.1.2", - "next": "^14.2.5", + "next": "^14.2.8", "notistack": "3.0.1", "nprogress": "^0.2.0", - "postcss": "^8.4.41", + "postcss": "^8.4.45", "postcss-import": "^16.1.0", "prop-types": "^15.8.1", "react": "^18.3.1", @@ -94,16 +92,16 @@ "react-draggable": "^4.4.6", "react-final-form": "^6.5.9", "react-imask": "^7.6.1", - "react-intersection-observer": "^9.13.0", + "react-intersection-observer": "^9.13.1", "react-is": "^18.3.1", - "react-number-format": "^5.4.0", + "react-number-format": "^5.4.2", "react-router-dom": "^6.26.1", "react-runner": "^1.0.5", "react-simple-code-editor": "^0.14.1", "react-spring": "^9.7.4", "react-swipeable-views": "^0.14.0", "react-transition-group": "^4.4.5", - "react-virtuoso": "^4.10.1", + "react-virtuoso": "^4.10.3", "react-window": "^1.8.10", "rimraf": "^5.0.10", "styled-components": "^6.1.12", @@ -120,13 +118,13 @@ "@mui/internal-test-utils": "workspace:^", "@mui-internal/api-docs-builder": "workspace:^", "@types/autosuggest-highlight": "^3.2.3", - "@types/chai": "^4.3.17", + "@types/chai": "^4.3.19", "@types/css-mediaquery": "^0.1.4", "@types/gtag.js": "^0.0.20", "@types/json2mq": "^0.2.2", - "@types/node": "^18.19.44", + "@types/node": "^20.16.5", "@types/prop-types": "^15.7.12", - "@types/react": "^18.3.3", + "@types/react": "^18.3.4", "@types/react-dom": "^18.3.0", "@types/react-swipeable-views": "^0.13.5", "@types/react-transition-group": "^4.4.11", diff --git a/docs/pages/_app.js b/docs/pages/_app.js index 1752c016ee7382..1b3a4e4e061636 100644 --- a/docs/pages/_app.js +++ b/docs/pages/_app.js @@ -178,7 +178,10 @@ function AppWrapper(props) { wordmarkSvg: muiSvgWordmarkString, versions: [ { text: `v${materialPkgJson.version}`, current: true }, - { text: `v5`, href: `https://mui.com${languagePrefix}/material-ui/getting-started/` }, + { + text: 'v5', + href: `https://v5.mui.com${languagePrefix}/getting-started/installation/`, + }, { text: 'v4', href: `https://v4.mui.com${languagePrefix}/getting-started/installation/`, @@ -211,7 +214,6 @@ function AppWrapper(props) { wordmarkSvg: muiSvgWordmarkString, versions: [ { text: `v${systemPkgJson.version}`, current: true }, - { text: 'v5', href: `https://mui.com${languagePrefix}/system/getting-started/` }, { text: 'v4', href: `https://v4.mui.com${languagePrefix}/system/basics/` }, { text: 'View all versions', diff --git a/docs/pages/base-ui/react-autocomplete/[docsTab]/index.js b/docs/pages/base-ui/react-autocomplete/[docsTab]/index.js index d3e8626fa47a26..621c40fa364fa4 100644 --- a/docs/pages/base-ui/react-autocomplete/[docsTab]/index.js +++ b/docs/pages/base-ui/react-autocomplete/[docsTab]/index.js @@ -23,7 +23,7 @@ export const getStaticPaths = () => { export const getStaticProps = () => { const useAutocompleteApiReq = require.context( - 'docs/translations/api-docs/use-autocomplete', + 'docs/translations/api-docs-base/use-autocomplete', false, /use-autocomplete.*.json$/, ); diff --git a/docs/pages/base-ui/react-badge/[docsTab]/index.js b/docs/pages/base-ui/react-badge/[docsTab]/index.js index df9fd7343aa9b5..b1ae2c648274bc 100644 --- a/docs/pages/base-ui/react-badge/[docsTab]/index.js +++ b/docs/pages/base-ui/react-badge/[docsTab]/index.js @@ -31,7 +31,7 @@ export const getStaticProps = () => { const BadgeApiDescriptions = mapApiPageTranslations(BadgeApiReq); const useBadgeApiReq = require.context( - 'docs/translations/api-docs/use-badge', + 'docs/translations/api-docs-base/use-badge', false, /use-badge.*.json$/, ); diff --git a/docs/pages/base-ui/react-button/[docsTab]/index.js b/docs/pages/base-ui/react-button/[docsTab]/index.js index 5cbf74aa5b341b..786bc1fcf260ad 100644 --- a/docs/pages/base-ui/react-button/[docsTab]/index.js +++ b/docs/pages/base-ui/react-button/[docsTab]/index.js @@ -31,7 +31,7 @@ export const getStaticProps = () => { const ButtonApiDescriptions = mapApiPageTranslations(ButtonApiReq); const useButtonApiReq = require.context( - 'docs/translations/api-docs/use-button', + 'docs/translations/api-docs-base/use-button', false, /use-button.*.json$/, ); diff --git a/docs/pages/base-ui/react-form-control/[docsTab]/index.js b/docs/pages/base-ui/react-form-control/[docsTab]/index.js index f48d57b151b636..8a395527f54590 100644 --- a/docs/pages/base-ui/react-form-control/[docsTab]/index.js +++ b/docs/pages/base-ui/react-form-control/[docsTab]/index.js @@ -31,7 +31,7 @@ export const getStaticProps = () => { const FormControlApiDescriptions = mapApiPageTranslations(FormControlApiReq); const useFormControlContextApiReq = require.context( - 'docs/translations/api-docs/use-form-control-context', + 'docs/translations/api-docs-base/use-form-control-context', false, /use-form-control-context.*.json$/, ); diff --git a/docs/pages/base-ui/react-input/[docsTab]/index.js b/docs/pages/base-ui/react-input/[docsTab]/index.js index 58c194b16044a6..7e4779bca4c90c 100644 --- a/docs/pages/base-ui/react-input/[docsTab]/index.js +++ b/docs/pages/base-ui/react-input/[docsTab]/index.js @@ -31,7 +31,7 @@ export const getStaticProps = () => { const InputApiDescriptions = mapApiPageTranslations(InputApiReq); const useInputApiReq = require.context( - 'docs/translations/api-docs/use-input', + 'docs/translations/api-docs-base/use-input', false, /use-input.*.json$/, ); diff --git a/docs/pages/base-ui/react-menu/[docsTab]/index.js b/docs/pages/base-ui/react-menu/[docsTab]/index.js index 8acbf119aa346d..1b1267ed2851eb 100644 --- a/docs/pages/base-ui/react-menu/[docsTab]/index.js +++ b/docs/pages/base-ui/react-menu/[docsTab]/index.js @@ -55,35 +55,35 @@ export const getStaticProps = () => { const MenuItemApiDescriptions = mapApiPageTranslations(MenuItemApiReq); const useDropdownApiReq = require.context( - 'docs/translations/api-docs/use-dropdown', + 'docs/translations/api-docs-base/use-dropdown', false, /use-dropdown.*.json$/, ); const useDropdownApiDescriptions = mapApiPageTranslations(useDropdownApiReq); const useMenuApiReq = require.context( - 'docs/translations/api-docs/use-menu', + 'docs/translations/api-docs-base/use-menu', false, /use-menu.*.json$/, ); const useMenuApiDescriptions = mapApiPageTranslations(useMenuApiReq); const useMenuButtonApiReq = require.context( - 'docs/translations/api-docs/use-menu-button', + 'docs/translations/api-docs-base/use-menu-button', false, /use-menu-button.*.json$/, ); const useMenuButtonApiDescriptions = mapApiPageTranslations(useMenuButtonApiReq); const useMenuItemApiReq = require.context( - 'docs/translations/api-docs/use-menu-item', + 'docs/translations/api-docs-base/use-menu-item', false, /use-menu-item.*.json$/, ); const useMenuItemApiDescriptions = mapApiPageTranslations(useMenuItemApiReq); const useMenuItemContextStabilizerApiReq = require.context( - 'docs/translations/api-docs/use-menu-item-context-stabilizer', + 'docs/translations/api-docs-base/use-menu-item-context-stabilizer', false, /use-menu-item-context-stabilizer.*.json$/, ); diff --git a/docs/pages/base-ui/react-modal/[docsTab]/index.js b/docs/pages/base-ui/react-modal/[docsTab]/index.js index c85815b52de2b5..ee9d853522c956 100644 --- a/docs/pages/base-ui/react-modal/[docsTab]/index.js +++ b/docs/pages/base-ui/react-modal/[docsTab]/index.js @@ -31,7 +31,7 @@ export const getStaticProps = () => { const ModalApiDescriptions = mapApiPageTranslations(ModalApiReq); const useModalApiReq = require.context( - 'docs/translations/api-docs/use-modal', + 'docs/translations/api-docs-base/use-modal', false, /use-modal.*.json$/, ); diff --git a/docs/pages/base-ui/react-number-input/[docsTab]/index.js b/docs/pages/base-ui/react-number-input/[docsTab]/index.js index 97e7a38d94d7a5..de732f7f0a90de 100644 --- a/docs/pages/base-ui/react-number-input/[docsTab]/index.js +++ b/docs/pages/base-ui/react-number-input/[docsTab]/index.js @@ -31,7 +31,7 @@ export const getStaticProps = () => { const NumberInputApiDescriptions = mapApiPageTranslations(NumberInputApiReq); const useNumberInputApiReq = require.context( - 'docs/translations/api-docs/use-number-input', + 'docs/translations/api-docs-base/use-number-input', false, /use-number-input.*.json$/, ); diff --git a/docs/pages/base-ui/react-select/[docsTab]/index.js b/docs/pages/base-ui/react-select/[docsTab]/index.js index c5ed80442efb96..2041433f2c4bc9 100644 --- a/docs/pages/base-ui/react-select/[docsTab]/index.js +++ b/docs/pages/base-ui/react-select/[docsTab]/index.js @@ -49,14 +49,14 @@ export const getStaticProps = () => { const SelectApiDescriptions = mapApiPageTranslations(SelectApiReq); const useOptionApiReq = require.context( - 'docs/translations/api-docs/use-option', + 'docs/translations/api-docs-base/use-option', false, /use-option.*.json$/, ); const useOptionApiDescriptions = mapApiPageTranslations(useOptionApiReq); const useOptionContextStabilizerApiReq = require.context( - 'docs/translations/api-docs/use-option-context-stabilizer', + 'docs/translations/api-docs-base/use-option-context-stabilizer', false, /use-option-context-stabilizer.*.json$/, ); @@ -65,7 +65,7 @@ export const getStaticProps = () => { ); const useSelectApiReq = require.context( - 'docs/translations/api-docs/use-select', + 'docs/translations/api-docs-base/use-select', false, /use-select.*.json$/, ); diff --git a/docs/pages/base-ui/react-slider/[docsTab]/index.js b/docs/pages/base-ui/react-slider/[docsTab]/index.js index dc0b6028f3dae0..f104a6905c7e80 100644 --- a/docs/pages/base-ui/react-slider/[docsTab]/index.js +++ b/docs/pages/base-ui/react-slider/[docsTab]/index.js @@ -31,7 +31,7 @@ export const getStaticProps = () => { const SliderApiDescriptions = mapApiPageTranslations(SliderApiReq); const useSliderApiReq = require.context( - 'docs/translations/api-docs/use-slider', + 'docs/translations/api-docs-base/use-slider', false, /use-slider.*.json$/, ); diff --git a/docs/pages/base-ui/react-snackbar/[docsTab]/index.js b/docs/pages/base-ui/react-snackbar/[docsTab]/index.js index 736bc1e0f05b57..e94440ae808e4b 100644 --- a/docs/pages/base-ui/react-snackbar/[docsTab]/index.js +++ b/docs/pages/base-ui/react-snackbar/[docsTab]/index.js @@ -31,7 +31,7 @@ export const getStaticProps = () => { const SnackbarApiDescriptions = mapApiPageTranslations(SnackbarApiReq); const useSnackbarApiReq = require.context( - 'docs/translations/api-docs/use-snackbar', + 'docs/translations/api-docs-base/use-snackbar', false, /use-snackbar.*.json$/, ); diff --git a/docs/pages/base-ui/react-switch/[docsTab]/index.js b/docs/pages/base-ui/react-switch/[docsTab]/index.js index d420993cb30449..7109664c25db11 100644 --- a/docs/pages/base-ui/react-switch/[docsTab]/index.js +++ b/docs/pages/base-ui/react-switch/[docsTab]/index.js @@ -31,7 +31,7 @@ export const getStaticProps = () => { const SwitchApiDescriptions = mapApiPageTranslations(SwitchApiReq); const useSwitchApiReq = require.context( - 'docs/translations/api-docs/use-switch', + 'docs/translations/api-docs-base/use-switch', false, /use-switch.*.json$/, ); diff --git a/docs/pages/base-ui/react-tabs/[docsTab]/index.js b/docs/pages/base-ui/react-tabs/[docsTab]/index.js index 6d6713e668c05b..f4649a6c65ff03 100644 --- a/docs/pages/base-ui/react-tabs/[docsTab]/index.js +++ b/docs/pages/base-ui/react-tabs/[docsTab]/index.js @@ -50,28 +50,28 @@ export const getStaticProps = () => { const TabsListApiDescriptions = mapApiPageTranslations(TabsListApiReq); const useTabApiReq = require.context( - 'docs/translations/api-docs/use-tab', + 'docs/translations/api-docs-base/use-tab', false, /use-tab.*.json$/, ); const useTabApiDescriptions = mapApiPageTranslations(useTabApiReq); const useTabPanelApiReq = require.context( - 'docs/translations/api-docs/use-tab-panel', + 'docs/translations/api-docs-base/use-tab-panel', false, /use-tab-panel.*.json$/, ); const useTabPanelApiDescriptions = mapApiPageTranslations(useTabPanelApiReq); const useTabsApiReq = require.context( - 'docs/translations/api-docs/use-tabs', + 'docs/translations/api-docs-base/use-tabs', false, /use-tabs.*.json$/, ); const useTabsApiDescriptions = mapApiPageTranslations(useTabsApiReq); const useTabsListApiReq = require.context( - 'docs/translations/api-docs/use-tabs-list', + 'docs/translations/api-docs-base/use-tabs-list', false, /use-tabs-list.*.json$/, ); diff --git a/docs/pages/base-ui/react-transitions/[docsTab]/index.js b/docs/pages/base-ui/react-transitions/[docsTab]/index.js index e3b33ceafd3ef9..96794ef433cdc1 100644 --- a/docs/pages/base-ui/react-transitions/[docsTab]/index.js +++ b/docs/pages/base-ui/react-transitions/[docsTab]/index.js @@ -40,7 +40,7 @@ export const getStaticProps = () => { const CssTransitionApiDescriptions = mapApiPageTranslations(CssTransitionApiReq); const useTransitionStateManagerApiReq = require.context( - 'docs/translations/api-docs/use-transition-state-manager', + 'docs/translations/api-docs-base/use-transition-state-manager', false, /use-transition-state-manager.*.json$/, ); @@ -49,7 +49,7 @@ export const getStaticProps = () => { ); const useTransitionTriggerApiReq = require.context( - 'docs/translations/api-docs/use-transition-trigger', + 'docs/translations/api-docs-base/use-transition-trigger', false, /use-transition-trigger.*.json$/, ); diff --git a/docs/pages/blog/2020-q3-update.md b/docs/pages/blog/2020-q3-update.md index f819f177ff06dc..06425df2c492ba 100644 --- a/docs/pages/blog/2020-q3-update.md +++ b/docs/pages/blog/2020-q3-update.md @@ -118,7 +118,7 @@ Here are the most significant improvements since June 2020. This was a dense qua <p class="blog-description">Slider powered by styled-components</p> - ♿︎ We have kept investing in accessibility, we have fixed [13 bugs](https://github.com/mui/material-ui/pulls?q=is%3Apr+label%3Aaccessibility+is%3Aclosed+sort%3Aupdated-desc). -- 🗓 We have introduced public quarterly roadmaps, both for each [MUI Core](https://github.com/mui/material-ui/projects?query=is%3Aopen) product and [MUI X](https://github.com/mui/mui-x/projects/1). +- 🗓 We have introduced public quarterly roadmaps, both for each [MUI Core](https://github.com/mui/material-ui/projects?query=is%3Aopen) product and [MUI X](https://github.com/orgs/mui/projects/35). ## Company @@ -158,7 +158,7 @@ We'll do our best, no guarantee! ### Enterprise - 👩‍🎨 Complete the collaboration we started with a design agency last quarter to update the branding of the company, redesign the homepage, and design the marketing pages for the enterprise package. -- 🗓 Execute on all the items in the [public roadmap](https://github.com/mui/mui-x/projects/1). +- 🗓 Execute on all the items in the [public roadmap](https://github.com/orgs/mui/projects/35). - ❓ Please upvote [GitHub issues](https://github.com/mui/mui-x/issues) if you want us to focus on a specific problem. The number of 👍 helps us to prioritize. ### Company diff --git a/docs/pages/blog/2021-developer-survey-results.md b/docs/pages/blog/2021-developer-survey-results.md index 93bb07ccb79477..8c50e82dbd04a4 100644 --- a/docs/pages/blog/2021-developer-survey-results.md +++ b/docs/pages/blog/2021-developer-survey-results.md @@ -562,7 +562,7 @@ The majority of respondents don't use any paid libraries, but those who do are m - **More features:** [Grouping](/x/react-data-grid/row-grouping/) was the most requested feature for the Data Grid Pro, followed by [master detail](/x/react-data-grid/master-detail/), aggregation, search, [tree data](/x/react-data-grid/tree-data/), and [column pinning](/x/react-data-grid/column-pinning/). We've already released some of these in the time it took us to analyze the survey results. Check the links to see their docs and demos. - Alternatively, you can follow [the public roadmap](https://github.com/mui/mui-x/projects/1) to see when the others will land. + Alternatively, you can follow [the public roadmap](https://github.com/orgs/mui/projects/35) to see when the others will land. - **Customizability:** The majority of requests about customizability were asking for possibilities to tweak data grid interactions, which we need to delve into more deeply to better understand. Following next were requests for more style customizability, and more documentation on customization. - **Fix features:** Filtering got first place as the most requested feature to fix on Data Grid Pro. diff --git a/docs/pages/blog/2021-q1-update.md b/docs/pages/blog/2021-q1-update.md index e5849b2cb4d07a..2f1c944ff24859 100644 --- a/docs/pages/blog/2021-q1-update.md +++ b/docs/pages/blog/2021-q1-update.md @@ -212,7 +212,7 @@ We have the following objectives: - ✍️ Release the Data Grid cell edit feature we have been working on for the last two months. [A preview](https://deploy-preview-1287--material-ui-x.netlify.app/components/data-grid/editing/). - 📅 Start dedicating time to the date range picker. -- 🗓 Execute on all the items in the [public roadmap](https://github.com/mui/mui-x/projects/1). +- 🗓 Execute on all the items in the [public roadmap](https://github.com/orgs/mui/projects/35). - ❓ Please upvote [GitHub issues](https://github.com/mui/mui-x/issues?q=is%3Aissue+is%3Aopen+sort%3Areactions-%2B1-desc) if you want us to focus on a specific problem. The number of 👍 helps us to prioritize. ### Design Kits diff --git a/docs/pages/blog/2021-q2-update.md b/docs/pages/blog/2021-q2-update.md index eac535f1b376fd..7076d0bd1434d0 100644 --- a/docs/pages/blog/2021-q2-update.md +++ b/docs/pages/blog/2021-q2-update.md @@ -229,7 +229,7 @@ We have the following objectives: - ✨ Resume work on the [key features](https://github.com/mui/mui-x/issues?q=is%3Aopen+label%3A%22linked+in+docs%22+sort%3Areactions-%2B1-desc), after a quarter focused on stability. It seems that the audience is adopting the data grid as fast as we can build it. For instance, we have one issue with over [1,000 upvotes](https://github.com/mui/mui-x/issues/204) 👍. -- 🗓 Execute on all of the items in the [public roadmap](https://github.com/mui/mui-x/projects/1). +- 🗓 Execute on all of the items in the [public roadmap](https://github.com/orgs/mui/projects/35). - ❓ Please upvote [GitHub issues](https://github.com/mui/mui-x/issues?q=is%3Aissue+is%3Aopen+sort%3Areactions-%2B1-desc) if you want us to focus on a specific problem. The number of 👍 helps us to prioritize. ### Design Kits diff --git a/docs/pages/blog/2021-q3-update.md b/docs/pages/blog/2021-q3-update.md index 566c8f0e0b53bb..57a1a15e8914d4 100644 --- a/docs/pages/blog/2021-q3-update.md +++ b/docs/pages/blog/2021-q3-update.md @@ -213,7 +213,7 @@ We have planned to: - ✨ Release the tree data feature. - ✨ Revamp the virtualization to yield better rendering performance and fix bugs. It unlocks new features like column pinning and lazy loading. -- 🗓 Execute on all of the items in the [public roadmap](https://github.com/mui/mui-x/projects/1). +- 🗓 Execute on all of the items in the [public roadmap](https://github.com/orgs/mui/projects/35). - ❓ Please upvote [GitHub issues](https://github.com/mui/mui-x/issues?q=is%3Aissue+is%3Aopen+sort%3Areactions-%2B1-desc) if you want us to focus on a specific problem. The number of 👍 helps us to prioritize. #### Date Picker diff --git a/docs/pages/blog/2023-toolpad-beta-announcement.md b/docs/pages/blog/2023-toolpad-beta-announcement.md index 807a9f9ce2d655..52c07ce4de5b2e 100644 --- a/docs/pages/blog/2023-toolpad-beta-announcement.md +++ b/docs/pages/blog/2023-toolpad-beta-announcement.md @@ -98,7 +98,7 @@ Lastly, Toolpad is the only product that offers a drag-and-drop UI builder close ## How can I use Toolpad? Toolpad is available as an npm package. Follow the [Installation guide](https://mui.com/toolpad/studio/getting-started/installation/) in the docs to get started. -You can learn more about Toolpad by visiting the [home page](https://mui.com/toolpad/). +You can learn more about Toolpad by visiting the [home page](https://mui.com/toolpad/studio/). <img alt="Toolpad documentation and instructions on how to use it" src="/static/blog/2023-toolpad-beta-announcement/docs.png" loading="lazy" width="2400" height="1394" /> diff --git a/docs/pages/blog/danail-hadjiatanasov-joining.md b/docs/pages/blog/danail-hadjiatanasov-joining.md index e7ebac31b33365..1a64d764d8a1f1 100644 --- a/docs/pages/blog/danail-hadjiatanasov-joining.md +++ b/docs/pages/blog/danail-hadjiatanasov-joining.md @@ -21,6 +21,6 @@ Danail has already landed his first feature in the data grid: [column reordering He's now actively working on new features for the data grid. -The enterprise team will continue developing the data grid component, and progressively extend to new advanced components as we grow the team. Here's a quick view of [the enterprise roadmap](https://github.com/mui/mui-x/projects/1). +The enterprise team will continue developing the data grid component, and progressively extend to new advanced components as we grow the team. Here's a quick view of [the enterprise roadmap](https://github.com/orgs/mui/projects/35). We couldn't be more excited to have Danail on the team! You can follow him on [X](https://x.com/danail_h). diff --git a/docs/pages/blog/introducing-base-ui.md b/docs/pages/blog/introducing-base-ui.md index 4846ce5df26df8..cbe2c19a147b39 100644 --- a/docs/pages/blog/introducing-base-ui.md +++ b/docs/pages/blog/introducing-base-ui.md @@ -104,14 +104,14 @@ Give Base UI a try today by running one of the following commands: npm install @mui/base ``` -```bash yarn -yarn add @mui/base -``` - ```bash pnpm pnpm add @mui/base ``` +```bash yarn +yarn add @mui/base +``` + </codeblock> Check out [the docs](/base-ui/getting-started/), play with the components, and be sure to let us know what you think! diff --git a/docs/pages/blog/introducing-pigment-css.md b/docs/pages/blog/introducing-pigment-css.md index b3856429416277..33edf2a1f5c5e3 100644 --- a/docs/pages/blog/introducing-pigment-css.md +++ b/docs/pages/blog/introducing-pigment-css.md @@ -1,5 +1,5 @@ --- -title: 'Introducing Pigment CSS: the next generation of CSS-in-JS' +title: 'A preview of Pigment CSS: the next generation of CSS-in-JS' description: 'Pigment CSS offers significant performance gains along with RSC and App Router support.' date: 2024-05-16T00:00:00.000Z authors: @@ -15,55 +15,63 @@ tags: ['Pigment CSS', 'Product'] manualCard: true --- -In the era of React Server Components and the Next.js App Router, component libraries like Material UI must make some paradigm-shifting changes to reap the potential performance gains by moving more of the work of rendering UIs from client to server. +Check out MUI's CEO Olivier Tassinari introducing Pigment CSS at React Conf 2024: -Trouble is, the "traditional" CSS-in-JS solutions we rely on aren't able to come along with us because the [React context API](https://react.dev/learn/passing-data-deeply-with-context) only works on the client. -And with nearly 70% of respondents in the [State of CSS 2023 survey](https://2023.stateofcss.com/en-US/css-in-js/) indicating they use styled-components and Emotion, we're looking at a whole lot of React developers with no clear path forward from here. +<iframe src="https://www.youtube.com/embed/n_0cz-JwlsU" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" referrerpolicy="strict-origin-when-cross-origin" allowfullscreen style="width: 100%; height: 100%; aspect-ratio: 16/9;"></iframe> -For a library as widely used as Material UI, the biggest challenge is to stay up-to-date while introducing as few breaking changes as humanly possible, to maintain a consistent and reliable developer experience without asking users to completely change the way they build UI components. +In the era of React Server Components and the Next.js App Router, component libraries like Material UI have an opportunity to gain performance improvements by moving rendering work from the client to the server. -That's where Pigment CSS comes in. +Trouble is, the "traditional" CSS-in-JS solutions we rely on aren't able to come along with us because the [React context API](https://react.dev/learn/passing-data-deeply-with-context) only works with client-side components. +With nearly 70% of respondents in the [State of CSS 2023 survey](https://2023.stateofcss.com/en-US/css-in-js/) indicating they use styled-components and Emotion, we're looking at a whole lot of React developers with no clear path forward from here. -<img src="/static/blog/introducing-pigment-css/card.png" alt="Introducing Pigment CSS: the next generation of CSS-in-JS" width="1280" height="640" /> +For a library as widely used as Material UI, the biggest challenge is to innovate while introducing as few breaking changes as possible. +We need to maintain a consistent and reliable developer experience without asking you to completely change the way you build UI components. -Pigment CSS is MUI's new in-house styling solution: a zero-runtime CSS-in-JS package that generates colocated styles to their own CSS files at build-time. -With Pigment CSS you get RSC compatibility, _plus_ significant performance improvements when compared with Emotion, the styling engine used in Material UI v5. +That's where [Pigment CSS](https://github.com/mui/pigment-css) comes in. + +<a href="https://github.com/mui/pigment-css"> + <img src="/static/blog/introducing-pigment-css/card.png" alt="Introducing Pigment CSS: the next generation of CSS-in-JS" width="1280" height="640" /> +</a> + +Pigment CSS is a zero-runtime CSS-in-JS library that generates colocated styles to their own CSS files at build time. +With Pigment CSS you get significant performance improvements when compared with Emotion, the styling engine used in Material UI v5, _plus_ RSC compatibility. And though we're prioritizing the needs of Material UI users in early development and focusing on a smooth migration, Pigment CSS can be used with _any_ React component library you prefer. ## Why Pigment CSS? ### Traditional CSS-in-JS is not enough -Emotion made a lot of sense for Material UI v5 in late 2021, but so much has changed in the React ecosystem since then. +Emotion made a lot of sense for Material UI v5.0.0 in late 2021, but so much has changed in the React ecosystem since then. After Next.js offered the first implementation of the React Server Components spec with [the App Router](https://nextjs.org/blog/next-13) towards the end of 2022, it became clear that there was a monumental shift on the horizon. RSCs unlock a whole new realm of possibilities for React; for us as UI developers, it means we can create components that are fully renderable at build-time so we don't have to pass that burden on to the client at run-time. But working with RSCs requires us to let go of familiar APIs like `React.useContext`, which in turn becomes a major blocker for using the last generation's style engines like Emotion that rely heavily on this hook for theming. :::info -To learn more about RSCs, we highly recommend reading [Making Sense of React Server Components](https://www.joshwcomeau.com/react/server-components/) by Josh Comeau. +To learn more about RSCs, we recommend reading [Making Sense of React Server Components](https://www.joshwcomeau.com/react/server-components/) by Josh Comeau. ::: ### Material UI is a unique use case Material UI is downloaded millions of times per month and is one of the most rigorously battle-tested UI libraries on the internet, with a GitHub history spanning all the way back to 2014. It's had to make some massive changes along the way to keep up with the times; most recently, moving from JSS to Emotion from v4 to v5. -While those breaking changes did bring many benefits overall, they unfortunately came with a notoriously painful migration experience. +While those breaking changes did bring many benefits overall, they unfortunately came with a painful migration experience. -We learned our lesson! -We can't do that to our users again. +We learned our lesson! We don't want to impose this on you again. So when it came time to seek out a new way to generate styles, we knew we needed to keep the syntax and authoring experience as similar as possible to Emotion and styled-components—and provide codemods for most of the breaking changes—in order to minimize friction when migrating. ### Other options don't meet our needs For those of us who are perfectly happy with the patterns we know and love from CSS-in-JS, it feels frustrating to consider abandoning all that muscle memory just to reinvent the wheel yet again. -We like the DX of colocated styles, and we'd rather not bloat the DOM with atomic class names—so Tailwind CSS, StyleX, Panda CSS, and other solutions that have cropped up in recent months just don't match up with our preferences. +We love the DX of colocated styles, and we'd rather not migrate the API to atomic class names. +We want to support nested selectors at scale—so Tailwind CSS, StyleX, Panda CSS, and other solutions that have appeared in recent months are not viable options. + Pigment CSS started as a [Linaria](https://linaria.dev/) fork, but we found more of the tools we needed to achieve our goals with [WyW-in-JS](https://wyw-in-js.dev/), the open-source library that also powers Linaria. ## How Pigment CSS works -Pigment CSS is a zero-runtime CSS-in-JS library: This means it doesn't have access to the end user's browser runtime, which would be necessary to generate and insert authored CSS at run-time. +Pigment CSS is a zero-runtime CSS-in-JS library: This means it doesn't have access to the end user's browser JavaScript runtime, so it can't use the runtime to generate and insert CSS. Instead, it does all its processing at build-time to pre-generate the CSS which then becomes part of the output bundle. It uses WyW-in-JS processor feature which makes it possible to create custom logic that's triggered by the presence of different imports from the library. @@ -78,19 +86,53 @@ Check out [How Pigment CSS works](https://github.com/mui/pigment-css/blob/maste For users of Emotion and styled-components, the benefits of adopting Pigment CSS are clear: your end users get better performance, and you get RSC and App Router compatibility without having to significantly change how you author component styles. -### Better performance +### Better page load performance + +When comparing the same Material UI app built with Next.js and either Emotion or Pigment CSS, we've observed the following page load performance gains using the same code: + +<!-- vale MUI.CorrectReferenceAllCases = NO --> + +| Metrics | Emotion | Pigment CSS | Change | +| :------------------ | -------------------------------------------------------------------------------------------------------------: | -----------------------------------------------------------------------------------------------------------------: | -----: | +| First Load JS | [131 kB](https://emotion-demo.vercel.app/?metric=1) | [104 kB](https://pigment-css-demo.vercel.app/?metric=1) | -20% | +| Total blocking time | [280 ms](https://pagespeed.web.dev/analysis/https-emotion-demo-vercel-app/uxfpkvbp31?hl=fr&form_factor=mobile) | [210 ms](https://pagespeed.web.dev/analysis/https-pigment-css-demo-vercel-app/azcw1qxkec?hl=fr&form_factor=mobile) | -25% | + +<!-- vale MUI.CorrectReferenceAllCases = YES --> + +:::info +To reproduce those numbers yourself, check out these live demos and repositories: + +- Emotion + - Live: https://emotion-demo.vercel.app/?metric=1 + - Source: https://github.com/brijeshb42/emotion-demo +- Pigment CSS + - Live: https://pigment-css-demo.vercel.app/?metric=1 + - Source: https://github.com/brijeshb42/pigment-css-landing-page-demo + +::: -When comparing the same Material UI app built with Next.js and either Emotion or Pigment CSS, we've observed the following page load performance gains: +### Better runtime performance -| Metrics | Emotion | Pigment CSS | Reduction | -| :--------------------- | ------: | ----------: | --------: | -| First load JavaScript | 131kB | 104kB | 20% | -| First Contentful Paint | 503ms | 455ms | 9% | -| Time To First Byte | 447.5ms | 381.5ms | 15% | -| Total Page HTML | 15.9kB | 14.7kB | 7.5% | +When comparing the same Material UI app built with Next.js and either Emotion or Pigment CSS, we've observed the following runtime performance gains using the same code: + +<!-- After page load, runtime performance is also improved with Pigment CSS. --> + +| Metrics | Emotion | Pigment CSS | Change | +| :-------------------------------------- | ------: | ----------: | -----: | +| Create and mount a new button | 17.3 ms | 10.1 ms | -42% | +| Change a variant on a mounted component | 14.0 ms | 9.13 ms | -34% | +| Change a value inside a CSS prop | 13.6 ms | 8.63 ms | -37% | :::info -To learn more about runtime performance improvements, [check out this app](https://pigment-css-demo.vercel.app/perf) that compares Pigment CSS, Emotion, and styled-components across a variety of tests. +To reproduce those numbers yourself, check out these live demos and repositories: + +- Emotion + - Live: https://pigment-css-demo.vercel.app/perf + - Source: https://github.com/brijeshb42/emotion-demo +- Pigment CSS + - Live: https://pigment-css-demo.vercel.app/perf + - Source: https://github.com/brijeshb42/pigment-css-landing-page-demo + ::: ### Familiar developer experience diff --git a/docs/pages/blog/material-ui-is-now-mui.md b/docs/pages/blog/material-ui-is-now-mui.md index 926d85ea2a8fb2..7953e14ae0f440 100644 --- a/docs/pages/blog/material-ui-is-now-mui.md +++ b/docs/pages/blog/material-ui-is-now-mui.md @@ -11,8 +11,8 @@ manualCard: true Starting today we are evolving our brand identity to clarifying the difference between our company and our products. -- Material-UI: the organization is now called **[MUI](https://github.com/mui)**. - Material-UI: the Material Design components developed by MUI is now called **[Material UI](https://mui.com/material-ui/getting-started/)**, we ditched the hyphen! +- Material-UI: the organization is now called **[MUI](https://github.com/mui)**. - Material-UI X: the set of advanced React components is now called **[MUI X](https://github.com/mui/mui-x)**. - Material-UI: the set of foundational MIT React components is now called **[MUI Core](https://github.com/mui/material-ui)**. diff --git a/docs/pages/blog/material-ui-v4-is-out.md b/docs/pages/blog/material-ui-v4-is-out.md index 196e6861b5fba4..60384e99aec3aa 100644 --- a/docs/pages/blog/material-ui-v4-is-out.md +++ b/docs/pages/blog/material-ui-v4-is-out.md @@ -15,7 +15,7 @@ Material UI v4 has finally arrived. We are so excited about this release, as it ![TypeScript switch](/static/blog/material-ui-v4-is-out/banner.png) -<p class="blog-description">https://mui.com/</p> +<p class="blog-description">https://material-ui.com/</p> ## Summary diff --git a/docs/pages/blog/material-ui-v6-is-out.js b/docs/pages/blog/material-ui-v6-is-out.js new file mode 100644 index 00000000000000..3f956e942690a9 --- /dev/null +++ b/docs/pages/blog/material-ui-v6-is-out.js @@ -0,0 +1,7 @@ +import * as React from 'react'; +import TopLayoutBlog from 'docs/src/modules/components/TopLayoutBlog'; +import { docs, srcComponents } from './material-ui-v6-is-out.md?muiMarkdown'; + +export default function Page() { + return <TopLayoutBlog docs={docs} srcComponents={srcComponents} />; +} diff --git a/docs/pages/blog/material-ui-v6-is-out.md b/docs/pages/blog/material-ui-v6-is-out.md new file mode 100644 index 00000000000000..ef423971a2fb19 --- /dev/null +++ b/docs/pages/blog/material-ui-v6-is-out.md @@ -0,0 +1,396 @@ +--- +title: Material UI v6 is out now 🎉 +description: Material UI v6 is now stable. It comes with new features, improvements, and an experimental integration for static CSS extraction. +date: 2024-08-26T00:00:00.000Z +authors: + [ + 'aarongarciah', + 'brijeshb42', + 'diegoandai', + 'mnajdova', + 'romgrk', + 'samuelsycamore', + 'siriwatknp', + 'zanivan', + ] +tags: ['Material UI', 'Product'] +manualCard: true +--- + +Material UI v6 is now stable—just in time to celebrate [10 years since our initial commit](https://github.com/mui/material-ui/commit/28b768913b75752ecf9b6bb32766e27c241dbc46)! +It comes with new features, improvements, and an experimental integration for static CSS extraction. + +## Table of contents + +- [New features](#new-features) + - [CSS theme variables](#css-theme-variables) + - [Color schemes](#color-schemes) + - [CSS media `prefers-color-scheme`](#css-media-prefers-color-scheme) + - [Container queries](#container-queries) + - [New method of applying styles](#new-method-of-applying-styles) +- [Improvements](#improvements) + - [Optimized runtime performance](#optimized-runtime-performance) + - [Revamped free templates](#revamped-free-templates) + - [Stabilized Grid v2](#stabilized-grid-v2) + - [Reduced package size](#reduced-package-size) +- [Experimental CSS extraction via Pigment CSS](#experimental-css-extraction-via-pigment-css) + - [React Server Components](#react-server-components) + - [Built-in `sx` prop support](#built-in-sx-prop-support) +- [React 19 support](#react-19-support) +- [Full-stack apps via Toolpad Core](#full-stack-apps-via-toolpad-core) +- [Get started with Material UI v6](#get-started-with-material-ui-v6) + +## New features + +### CSS theme variables + +CSS variables have become an industry standard for the web. +Material UI v6 introduces a new `cssVariables` flag that generates CSS variables from serializable theme values such as palette, spacing, and typography. + +```js +const theme = createTheme({ cssVariables: true, ... }); +``` + +{{"component": "components/blog/material-ui-v6-is-out/ThemeTokens.js"}} + +After enabling the flag, you can access the variables from the `theme.vars` object with the same structure as the theme. + +<codeblock> + +```js JSX +const CustomComponent = styled('div')(({ theme }) => ({ + backgroundColor: theme.vars.palette.background.default, + color: theme.vars.palette.text.primary, +})); +``` + +```css CSS +.CustomComponent-ae73f { + background-color: var(--mui-palette-background-default); + color: var(--mui-palette-text-primary); +} +``` + +</codeblock> + +#### Benefits + +- Improved developer experience—you can see where the values are coming from in the browser's dev tools. +- Makes it possible to resolve the notorious [dark mode SSR flickering issue](https://github.com/mui/material-ui/issues/27651). +- CSS variables open many doors for integration—for example, you can work with a Material UI theme in a plain CSS file. + + ```css title="styles.css" + .custom-card { + background-color: var(--mui-palette-background-default); + color: var(--mui-palette-text-primary); + padding: var(--mui-spacing-2); + font: var(--mui-font-body1); + } + ``` + +### Color schemes + +Prior to v6, if you wanted to support light and dark modes, you would have to create two separate themes and handle the logic to switch between modes. +This can be complex and error-prone. + +Material UI v6 introduces the new `colorSchemes` node to simplify this process: With just one line of code, your application supports both light and dark modes instantly. + +```js +const theme = createTheme({ colorSchemes: { dark: true } }); +// light is generated by default. + +function App() { + return <ThemeProvider theme={theme}>...</ThemeProvider>; +} +``` + +The `colorSchemes` node makes it possible for Material UI to support the following features out of the box: + +- System preference detection +- Instant transitions between modes with the `disableTransitionOnChange` prop +- Persistent user preferences via local storage +- Automatic synchronization of the selected mode across browser tabs + +#### A hook for toggling between modes + +The new `useColorScheme` hook lets you read and update the mode in your application. + +```jsx +import { useColorScheme } from '@mui/material/styles'; + +function ModeSwitcher() { + const { mode, setMode } = useColorScheme(); + if (!mode) return null; + return ( + <select onChange={(event) => setMode(event.target.value)}> + <option value="system">System</option> + <option value="light">Light</option> + <option value="dark">Dark</option> + </select> + ); +} +``` + +### CSS media `prefers-color-scheme` + +When [CSS variables](#css-theme-variables) and [color schemes](#color-schemes) are enabled, Material UI uses the `prefers-color-scheme` media query as the default method for generating CSS variables. + +<codeblock> + +```js JSX +import { createTheme, ThemeProvider } from '@mui/material/styles'; + +const theme = createTheme({ + cssVariables: true, + colorSchemes: { dark: true }, +}); + +function App() { + return <ThemeProvider theme={theme}>...</ThemeProvider>; +} +``` + +```css CSS +:root { + --mui-palette-primary-main: #1976d2; + --mui-palette-background-default: #fff; + ... +} + +@media (prefers-color-scheme: dark) { + :root { + --mui-palette-primary-main: #90caf9; + --mui-palette-background-default: #121212; + ... + } +} +``` + +</codeblock> + +### Container queries + +Material UI v6 introduces a [container queries](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_containment/Container_queries) utility based on the existing `theme.breakpoints` API. + +This feature lets you define styles based on the parent container's width instead of the viewport. + +<codeblock> + +```jsx JSX +const Component = styled('div')(({ theme }) => ({ + display: 'flex', + flexDirection: 'column', + gap: theme.spacing(2), + [theme.containerQueries.up('sm')]: { + flexDirection: 'row', + }, + [theme.containerQueries('sidebar').up('400px')]: { + // @container sidebar (min-width: 400px) + flexDirection: 'row', + }, +})); +``` + +```css CSS +/* Simplified CSS Output */ + +.Component-ad83f { + display: flex; + flex-direction: column; + gap: 16px; + @container (min-width: 600px) { + flex-direction: row; + } + @container sidebar (min-width: 400px) { + flex-direction: row; + } +} +``` + +</codeblock> + +It also works with the `sx` prop: + +<codeblock> + +```jsx JSX +<Card + sx={{ + '@sm': { + flexDirection: 'row', + }, + '@400/sidebar': { + flexDirection: 'row', + }, + }} +/> +``` + +```css CSS +/* Simplified CSS Output */ + +.MuiCard-root-dn383 { + @container (min-width: 600px) { + flex-direction: row; + } + @container sidebar (min-width: 400px) { + flex-direction: row; + } +} +``` + +</codeblock> + +### New method of applying styles + +The new API `theme.applyStyles` has been added for creating specific mode styles. +It's designed to replace the `theme.palette.mode === 'dark'` condition to fix the SSR flickering issue when combined with the CSS theme variables feature. + +<codeblock> + +```jsx After +const StyledInput = styled(InputBase)(({ theme }) => ({ + padding: 10, + width: '100%', + borderBottom: '1px solid #eaecef', + ...theme.applyStyles('dark', { + borderBottom: '1px solid #30363d', + }), + '& input': { + borderRadius: 4, + backgroundColor: '#fff', + ...theme.applyStyles('dark', { + backgroundColor: '#0d1117', + }), + }, +})); +``` + +```jsx Before +const StyledInput = styled(InputBase)(({ theme }) => ({ + padding: 10, + width: '100%', + borderBottom: + theme.palette.mode === 'dark' ? '1px solid #30363d' : '1px solid #eaecef', + '& input': { + borderRadius: 4, + backgroundColor: theme.palette.mode === 'dark' ? '#0d1117' : '#fff', + }, +})); +``` + +</codeblock> + +:::info +We provide a codemod to help you migrate from `theme.palette.mode === 'dark'` to `theme.applyStyles()`. +See the [v6 migration guide](/material-ui/migration/upgrade-to-v6/) for complete details. +::: + +## Improvements + +### Optimized runtime performance + +[Several optimizations](https://github.com/mui/material-ui/pulls?q=is%3Apr+author%3Aromgrk+is%3Aclosed+perf+sort%3Aupdated-desc) have been made to improve the runtime performance of Material UI v6. + +This is just the beginning of our performance improvements. +There are more optimizations in our pipeline, so stay tuned for further v6.x updates and the benchmark results. + +### Revamped free templates + +Explore the new and improved [free Material UI templates](https://mui.com/material-ui/getting-started/templates/) to see all of the new v6 features in action. +We've fully revamped the templates to demonstrate some common real-world use cases for our components, and to provide the perfect starting point for your next project. + +{{"component": "components/blog/material-ui-v6-is-out/FreeTemplatesBento.js"}} + +#### Custom styles + +The new templates can be toggled between the default Material Design and a fully custom theme that's shared across the entire suite, so you can dig deep into the best approaches for component customization—or just grab the pieces you like best and start building from there. + +{{"component": "components/blog/material-ui-v6-is-out/CustomThemeComparison.js"}} + +### Stabilized Grid v2 + +The Grid v2 component has been stabilized and now uses the CSS gap property for creating space between grid items. +This is a huge improvement over the previous version, which used margins and padding to create space. + +The responsive configuration has been consolidated into the `size` and `offset` props for consistency. + +```jsx +import Grid from '@mui/material/Grid2'; + +<Grid container> + <Grid size={{ xs: 6, sm: 4, lg: 3 }} /> + <Grid size={{ xs: 6, sm: 4, lg: 3 }} /> + <Grid size={{ xs: 6, sm: 4, lg: 3 }} /> +</Grid>; +``` + +### Reduced package size + +To align with React 19's removal of UMD builds, Material UI has also removed its UMD bundle. +This results in a reduction of the `@mui/material` package size by 2.5MB, or 25% of the total size in v5. +See [Package Phobia](https://packagephobia.com/result?p=@mui/material) for more details. +Instead of UMD, we recommend using ESM-based CDNs such as [esm.sh](https://esm.sh/). +For alternative installation methods, refer to the [CDN documentation](/material-ui/getting-started/installation/#cdn). + +## Experimental CSS extraction via Pigment CSS + +Material UI v5 uses Emotion as its default styling solution. +Because it's a runtime CSS-in-JS library, Emotion forces us to make compromises to performance and bundle size. + +Material UI v6 introduces opt-in integration with [Pigment CSS](https://github.com/mui/pigment-css), our new zero-runtime styling library that eliminates the runtime overhead while preserving the API design patterns you already know and love. + +:::warning +Pigment CSS integration is still in the experimental stage. +We recommend testing it out with our examples ([Next.js](https://github.com/mui/material-ui/tree/master/examples/material-ui-pigment-css-nextjs-ts) or [Vite](https://github.com/mui/material-ui/tree/master/examples/material-ui-pigment-css-vite)), and we'd love to get your feedback to help us improve it. + +When you're ready to integrate Pigment CSS into your project, you can find complete details in [the guide to migrating to Pigment CSS](/material-ui/migration/migrating-to-pigment-css/). +::: + +### React Server Components + +Once integrated with Pigment CSS, Material UI v6 provides a separate set of layout components—Grid, Container, and Stack—that are compatible with React Server Components. + +```jsx +import Grid from '@mui/material-pigment-css/Grid'; +import Container from '@mui/material-pigment-css/Container'; +import Stack from '@mui/material-pigment-css/Stack'; +``` + +### Built-in sx prop support + +With Pigment CSS integration, all JSX elements support the `sx` prop out of the box. +This means you no longer have to clutter the DOM with wrappers like Box or Stack in order to apply custom styles to a `<div>` or any other element with the `sx` prop. + +```diff +-import Box from '@mui/material/Box'; + +-<Box component="img" sx={{ padding: 2 }} /> ++<img sx={{ padding: 2 }} /> +``` + +## React 19 support + +Material UI v6 is ready for React 19. +We've been testing Material UI with the latest [React 19 RC](https://react.dev/blog/2024/04/25/react-19) versions to ensure compatibility once the stable release of React 19 is out. + +We're also working on backporting React 19 support to Material UI v5—stay tuned. + +## Full-stack apps via Toolpad Core + +To help you build full-stack apps faster than ever, we're launching [Toolpad Core](https://mui.com/toolpad/), a framework for building dashboards and internal tools with Material UI and Next.js that comes with routing, layout components, and authentication already configured for you. + +Stay tuned for more updates on Toolpad Core in the near future. + +## Get started with Material UI v6 + +Ready to upgrade to Material UI v6? +Head to [the v6 migration guide](/material-ui/migration/upgrade-to-v6/) next. + +Visit the links below for further details on some of the key features covered here: + +- [Pigment CSS integration](/material-ui/migration/migrating-to-pigment-css/) +- [Container queries](/material-ui/customization/container-queries/) +- [CSS theme variables](/material-ui/customization/css-theme-variables/overview/) +- [Stabilized Grid v2](/material-ui/migration/upgrade-to-v6/#grid2) +- [Free templates](/material-ui/getting-started/templates/) diff --git a/docs/pages/blog/mui-core-v5.md b/docs/pages/blog/mui-core-v5.md index 6716f671988b86..184384a2225a15 100644 --- a/docs/pages/blog/mui-core-v5.md +++ b/docs/pages/blog/mui-core-v5.md @@ -77,7 +77,7 @@ You can find the initial RFC plan for v5 in [issue #20012](https://github.com/mu ## A new brand -Material-UI is now **Material UI**! Head to the [dedicated blog post](https://mui.com/blog/material-ui-is-now-mui/) to learn more. +Material-UI is now **Material UI**! We ditched the hyphen, head to the [dedicated blog post](https://mui.com/blog/material-ui-is-now-mui/) to learn more. We hope you are going to enjoy the DX improvement of only having to type 3 letters to type to find us on the internet: [mui.com](https://mui.com) and to import us from npm `@mui`! @@ -236,7 +236,7 @@ declare module '@mui/material/Button' { <p class="blog-description"><a href="https://codesandbox.io/p/sandbox/stupefied-mclaren-ho4zs?file=/src/App.tsx">CodeSandbox</a></p> -**Second**, you can add [custom variants](/material-ui/customization/theme-components/#creating-new-component-variants) to the theme, overriding the CSS for specific component prop combinations. +**Second**, you can add [custom variants](https://v5.mui.com/material-ui/customization/theme-components/#creating-new-component-variants) to the theme, overriding the CSS for specific component prop combinations. ```jsx import { createTheme, Button } from '@mui/material'; @@ -704,7 +704,7 @@ We hope we can reach 50% of the React community by 2026. This is an ambitious go You can use the GitHub projects to learn about what features we're working on, what stage they're at, and when we expect to bring them to you: - [MUI Core](https://github.com/mui/material-ui/projects?query=is:open) -- [MUI X](https://github.com/mui/mui-x/projects/1) +- [MUI X](https://github.com/orgs/mui/projects/35) We offer this transparency into what we plan to work on so that you can plan better and share feedback earlier to influence what we're building. diff --git a/docs/pages/blog/mui-x-sep-2024-price-update.md b/docs/pages/blog/mui-x-sep-2024-price-update.md index c86004969de13c..3412f49a016d3e 100644 --- a/docs/pages/blog/mui-x-sep-2024-price-update.md +++ b/docs/pages/blog/mui-x-sep-2024-price-update.md @@ -2,57 +2,75 @@ title: Upcoming changes to MUI X pricing in 2024 description: Check out the new pricing updates and how to transition to the new model. date: 2024-08-01T08:00:00.000Z -authors: ['josefreitas'] +authors: ['josefreitas', 'oliviertassinari'] tags: ['MUI X', 'Product'] manualCard: true --- -We're excited to share some important updates to our product offerings and pricing structure. This change reflects the expanded feature set and helps us continue delivering high-quality components to you and your users. +Today, we are sharing some important updates to the MUI X product offerings and pricing structure. +These changes are made to reflect the expanded feature set and help support the delivering of high-quality components to you and your users. ## Changes to the Pro plan -### Current Pricing +### Current pricing -Under our current pricing model, if you licensed the Pro plan for 50 developers, you only paid for 10 seats. This concept was introduced when we offered only the Data Grid Pro with a much smaller feature set. +Under the current pricing model, you only purchase a license for the first 10 developers. +So to license the Pro plan for 50 developers you would purchase 10 licenses. +This concept was introduced in the very beginning of the MUI X offering (2021) when we offered only the Data Grid Pro with a small feature set. -### New Pricing +Since the release of this component, we launched several new components and features, including [Date and Time Range Pickers](/x/react-date-pickers/date-time-range-picker/). -With the launch of several new components, including [Date and Time Range Pickers](/x/react-date-pickers/date-time-range-picker/), as well as upcoming Pro versions of [Charts](/x/react-charts/) and [TreeView](/x/react-tree-view/), we're updating our pricing. +### New pricing -Moving forward, each developer requires a seat. So, for example, 50 developers will now need 50 seats. +We will soon release the first Pro features of the [Charts](/x/react-charts/) and [Tree View](/x/react-tree-view/). +These new features will only be available under the updated pricing: moving forward, each developer requires a license. So, for example, 50 developers will need 50 licenses. -We're happy to discuss volume discounts to accommodate larger teams. - -### Grandfathering Current Customers +### Grandfathering current customers We value our loyal customers and want to ensure a smooth transition: current customers will be grandfathered into their existing plans. -This means you can continue using and renewing the legacy license for as long as you wish. -However, the legacy license covers only Data Grid and Date Pickers. +This means you can continue to renew your licenses under the legacy pricing for as long as you wish. +However, the legacy pricing only covers the previously released components: Data Grid and Date Pickers. :::info -**Access to new components:** The Pro versions of Charts and Tree View, and other future Pro components, will be available exclusively through a license key under the new Pro plan model or a Premium key (Premium users will experience no change). +**Access to new components:** The Pro versions of Charts and Tree View, and other future Pro components, will be available exclusively through the new Pro plan model or a Premium plan (Premium customers will experience no change, all Pro components are included). :::: -### Pricing for Small Teams +### Pricing for small teams + +The price is the same for customers with 10 developers or fewer. +Actually, we are making this pricing change to be able to keep the price affordable for small teams. -The price is essentially the same for customers with 10 developers or fewer, but you still need a new license key to use the Pro versions of Charts or Tree View. If that's the case, we recommend you contact our sales team and get a discount to renew your license earlier. +However, if you want to use the new features, you will need a new license key to use the Pro versions of Charts or Tree View. +You can [contact](https://support.mui.com/hc/en-us/requests/new) our support team to receive a new license key. + +### Larger teams + +We're happy to discuss volume discounts to accommodate larger teams. ## Changes to the Premium plan +### New Pro components + +We will soon release the first Pro features of the [Charts](/x/react-charts/) and [Tree View](/x/react-tree-view/). +These features will be available to all Premium customers without any further action needed. + ### Ending the early bird discount -After two years since the [introduction of our Premium plan](/blog/premium-plan-release/), we've added numerous features and are on the verge of releasing the Pivot mode for the Data Grid. We consider the product mature and battle tested enough and as a result, the early bird discount for the Premium plan finally reaches its end. +After two years since the [introduction of our Premium plan](/blog/premium-plan-release/), we've added numerous features and are on the verge of releasing the Pivot mode for the Data Grid. +We consider the product mature and battle-tested enough and as a result, the early bird discount for the Premium plan finally reaches its end. + +### Large discount for current customers However, we want to ensure that our valued early customers continue to enjoy the benefits of an earlier purchase. -Current customers will still benefit from a 20% renewal discount. +Current customers will still benefit from a 20% renewal discount (vs. 25% early bird discount before). You'll receive the discount per email, or by reaching out to our [sales team](mailto:sales@mui.com). -## Effective Date +## Effective date The new pricing updates will take effect on September 1st, 2024. However, you can already purchase the new Pro plan today by visiting our [store](https://mui.com/store/items/mui-x-pro-q3-2024/). -### We value your feedback +## We value your feedback Your feedback is invaluable to us. We invite you to share your thoughts and any questions you might have about these changes. diff --git a/docs/pages/blog/mui-x-v5.md b/docs/pages/blog/mui-x-v5.md index 8ca2616041f276..d1d43420375545 100644 --- a/docs/pages/blog/mui-x-v5.md +++ b/docs/pages/blog/mui-x-v5.md @@ -212,7 +212,7 @@ We plan to focus on it as long as necessary to deliver most of the advanced feat Once we would have grown the team and made enough progress, we will expand to more components. -You can view our [public roadmap](https://github.com/mui/mui-x/projects/1) on GitHub to learn about what features we're working on, what stage they're at, and when we expect to bring them to you. +You can view our [public roadmap](https://github.com/orgs/mui/projects/35) on GitHub to learn about what features we're working on, what stage they're at, and when we expect to bring them to you. ## Thank you diff --git a/docs/pages/blog/mui-x-v6-alpha-zero.md b/docs/pages/blog/mui-x-v6-alpha-zero.md index de7976f967cfe6..0b7fe97b281eb4 100644 --- a/docs/pages/blog/mui-x-v6-alpha-zero.md +++ b/docs/pages/blog/mui-x-v6-alpha-zero.md @@ -96,7 +96,7 @@ It contains the highlights that will be included in the first versions. - [Enable customization through component slots on every component](https://github.com/mui/mui-x/issues/4466). :::info -You can check our [roadmap](https://github.com/mui/mui-x/projects/1) for the full live list. +You can check our [roadmap](https://github.com/orgs/mui/projects/35) for the full live list. ::: ## How to migrate? diff --git a/docs/pages/blog/mui-x-v6.md b/docs/pages/blog/mui-x-v6.md index 06e97177a0f0c7..76ba0f0df281f5 100644 --- a/docs/pages/blog/mui-x-v6.md +++ b/docs/pages/blog/mui-x-v6.md @@ -7,7 +7,7 @@ manualCard: true tags: ['MUI X', 'Product'] --- -<img src="/static/blog/mui-x-v6/card.png" alt="" style="margin-bottom: 16px;" width="2400" height="559" /> +<img src="/static/blog/mui-x-v6/card.png" alt="" style="margin-bottom: 16px;" width="2560" height="1280" /> [MUI X v6.0.0](https://github.com/mui/mui-x/releases/tag/v6.0.0) is finally here with many improvements, new features, customization abilities, and a more robust foundation to accommodate the changes we want to deliver next. @@ -284,7 +284,7 @@ Here's a list of what you can expect to be delivered in the following months (wh - Preview of chart components 🔥 ([mui-x#1408](https://github.com/mui/mui-x/issues/1408)) -You can get more details of our next steps in [MUI X public roadmap](https://github.com/mui/mui-x/projects/1). +You can get more details of our next steps in [MUI X public roadmap](https://github.com/orgs/mui/projects/35). ## Decoupling versions from MUI Core diff --git a/docs/pages/blog/mui-x-v7.md b/docs/pages/blog/mui-x-v7.md index cce65bad6eefb9..601caa7bc9f674 100644 --- a/docs/pages/blog/mui-x-v7.md +++ b/docs/pages/blog/mui-x-v7.md @@ -1,5 +1,5 @@ --- -title: Introducing MUI X v7.0.0 +title: Introducing MUI X v7 description: Check out all the newest additions to the next major of the advanced components. date: 2024-03-22T08:00:00.000Z authors: ['josefreitas'] @@ -13,7 +13,7 @@ manualCard: true </a> </div> -After a few months in pre-release, we're thrilled to announce the stable release of [MUI X v7](https://github.com/mui/mui-x/releases/tag/v7.0.0), packed with new components, exciting features, improved usability, and developer experience. +After a few months in pre-release, we're thrilled to announce the stable release of [MUI X v7.0.0](https://github.com/mui/mui-x/releases/tag/v7.0.0), packed with new components, exciting features, improved usability, and developer experience. ## Table of contents @@ -357,7 +357,7 @@ Additionally, the following are the deliveries planned for the next few months. - [Time Range Picker](https://github.com/mui/mui-x/issues/4460)[<span class="plan-pro"></span>](/x/introduction/licensing/#pro-plan 'Pro plan') -For a complete overview, please visit the [MUI X roadmap](https://github.com/mui/mui-x/projects/1). +For a complete overview, please visit the [MUI X roadmap](https://github.com/orgs/mui/projects/35). ## Long-Term Support diff --git a/docs/pages/blog/premium-plan-release.md b/docs/pages/blog/premium-plan-release.md index d7ab992827f551..8224eb50ed06ab 100644 --- a/docs/pages/blog/premium-plan-release.md +++ b/docs/pages/blog/premium-plan-release.md @@ -110,7 +110,7 @@ Please feel free to read the [license agreement](https://mui.com/legal/mui-x-eul ## What can you expect next? We mentioned the aggregation functions already, -but there's a [lot more coming](https://github.com/mui/mui-x/projects/1), and certainly not only for Premium users. +but there's a [lot more coming](https://github.com/orgs/mui/projects/35), and certainly not only for Premium users. We're making continuous improvements to all X components, placing more emphasis on the overall experience for both the developer and the user. A product designer is soon joining the team, and we aim to keep exploring the most advanced use cases for data-rich applications, while working on bringing the best UX and DX in the market. diff --git a/docs/pages/blog/spotlight-damien-tassone.md b/docs/pages/blog/spotlight-damien-tassone.md index 12f1e3e27a9dc5..e8b253e805420d 100644 --- a/docs/pages/blog/spotlight-damien-tassone.md +++ b/docs/pages/blog/spotlight-damien-tassone.md @@ -15,6 +15,6 @@ Right from the start, Damien has made fast and significant progress. He has been <img src="/static/blog/spotlight-damien-tassone/data-grid.png" style="margin-bottom: 3rem;" alt="Data Grid" /> -The enterprise team will continue developing the data grid component, and progressively extend to new advanced components as we grow the team. Here's a quick view of [the enterprise roadmap](https://github.com/mui/mui-x/projects/1). +The enterprise team will continue developing the data grid component, and progressively extend to new advanced components as we grow the team. Here's a quick view of [the enterprise roadmap](https://github.com/orgs/mui/projects/35). You can follow Damien on [X](https://x.com/madKakoO). diff --git a/docs/pages/blog/toolpad-use-cases.md b/docs/pages/blog/toolpad-use-cases.md index 8fc2bab05029e6..93f6c3f9c74321 100644 --- a/docs/pages/blog/toolpad-use-cases.md +++ b/docs/pages/blog/toolpad-use-cases.md @@ -11,7 +11,7 @@ Toolpad helps full-stack engineers build internal tools quickly. Internal tools encompass data-intensive CRUD interfaces, analytics dashboards, or custom apps that make teams productive. Toolpad offers a low-code, GUI-based, code-friendly way of building apps and comes as an npm package that can be imported into an existing codebase. -We've been dogfooding [Toolpad](https://mui.com/toolpad/) at MUI to build our internal tools, and it has proven beneficial for us to easily assemble well-organized, centrally located KPI dashboards and operations apps. +We've been dogfooding [Toolpad Studio](https://mui.com/toolpad/studio/) at MUI to build our internal tools, and it has proven beneficial for us to easily assemble well-organized, centrally located KPI dashboards and operations apps. In this blog post, we'll discuss four such apps, and explain how we used Toolpad to turn our ideas into reality. <a href="https://tools-public.mui.com/prod/pages/OverviewPage"> diff --git a/docs/pages/experiments/docs/callouts.md b/docs/pages/experiments/docs/callouts.md index 608afa51b8a69b..34175da0b8d05d 100644 --- a/docs/pages/experiments/docs/callouts.md +++ b/docs/pages/experiments/docs/callouts.md @@ -110,31 +110,6 @@ It says, "You will fail if you don't heed this dire warning." ::: ``` -## Empty - -Should not be used, here just to ensure forgetting the token is not a big deal. - -::: -This is a callout. -It says, "You will fail if you don't heed this dire warning." - -- emphasised: **bold text** -- some code `<div/>` -- a [link](#link). - -::: - -```markup -::: -This is a callout. -It says, "You will fail if you don't heed this dire warning." - -- emphasised: **bold text** -- some code `<div/>` -- a [link](#link). -::: -``` - ## With code :::info diff --git a/docs/pages/experiments/docs/codeblock.md b/docs/pages/experiments/docs/codeblock.md index 66da0cdfec1b14..96ff1b5c7e0074 100644 --- a/docs/pages/experiments/docs/codeblock.md +++ b/docs/pages/experiments/docs/codeblock.md @@ -13,13 +13,13 @@ npm install @mui/material @emotion/react @emotion/styled # `@emotion/react` and `@emotion/styled` are peer dependencies ``` -```bash yarn -yarn add @mui/material @emotion/react @emotion/styled +```bash pnpm +pnpm add @mui/material @emotion/react @emotion/styled # `@emotion/react` and `@emotion/styled` are peer dependencies ``` -```bash pnpm -pnpm add @mui/material @emotion/react @emotion/styled +```bash yarn +yarn add @mui/material @emotion/react @emotion/styled # `@emotion/react` and `@emotion/styled` are peer dependencies ``` diff --git a/docs/pages/experiments/website/branding-theme-test.tsx b/docs/pages/experiments/website/branding-theme-test.tsx index 0b0eb57ce93291..6408551e549058 100644 --- a/docs/pages/experiments/website/branding-theme-test.tsx +++ b/docs/pages/experiments/website/branding-theme-test.tsx @@ -80,6 +80,32 @@ export default function BrandingThemeTest() { <GitHubIcon fontSize="small" /> </IconButton> </Stack> + <Stack direction="row" spacing={2} useFlexGap sx={{ width: 'fit-content', mt: 8 }}> + <Button variant="contained" size="small" color="primary" disabled> + Contained primary + </Button> + <Button variant="contained" size="small" color="secondary" disabled> + Contained secondary + </Button> + <Button variant="outlined" size="small" color="primary" disabled> + Outlined primary + </Button> + <Button variant="outlined" size="small" color="secondary" disabled> + Outlined secondary + </Button> + <Button variant="text" size="small" disabled> + This button + </Button> + <IconButton color="primary"> + <GitHubIcon fontSize="small" /> + </IconButton> + <IconButton color="info"> + <GitHubIcon fontSize="small" /> + </IconButton> + <IconButton> + <GitHubIcon fontSize="small" /> + </IconButton> + </Stack> <Stack direction="column" spacing={2} useFlexGap sx={{ width: 'fit-content', mt: 8 }}> <Button variant="contained" size="large" color="primary"> Large diff --git a/docs/pages/material-ui/api/accordion.json b/docs/pages/material-ui/api/accordion.json index a093fff40226a5..c1025809a0aa7b 100644 --- a/docs/pages/material-ui/api/accordion.json +++ b/docs/pages/material-ui/api/accordion.json @@ -52,7 +52,7 @@ }, { "name": "transition", - "description": "The component that renders the transition.\n[Follow this guide](/material-ui/transitions/#transitioncomponent-prop) to learn more about the requirements for this component.", + "description": "The component that renders the transition.\n[Follow this guide](https://mui.com/material-ui/transitions/#transitioncomponent-prop) to learn more about the requirements for this component.", "default": "Collapse", "class": null } diff --git a/docs/pages/material-ui/api/alert.json b/docs/pages/material-ui/api/alert.json index 88c2ad11cea99d..f1c0e452bb0968 100644 --- a/docs/pages/material-ui/api/alert.json +++ b/docs/pages/material-ui/api/alert.json @@ -17,13 +17,13 @@ }, "default": "{}", "deprecated": true, - "deprecationInfo": "use the <code>slots</code> prop instead. This prop will be removed in v7. See <a href=\"/material-ui/migration/migrating-from-deprecated-apis/\">Migrating from deprecated APIs</a> for more details." + "deprecationInfo": "use the <code>slots</code> prop instead. This prop will be removed in v7. See <a href=\"https://mui.com/material-ui/migration/migrating-from-deprecated-apis/\">Migrating from deprecated APIs</a> for more details." }, "componentsProps": { "type": { "name": "shape", "description": "{ closeButton?: object, closeIcon?: object }" }, "default": "{}", "deprecated": true, - "deprecationInfo": "use the <code>slotProps</code> prop instead. This prop will be removed in v7. See <a href=\"/material-ui/migration/migrating-from-deprecated-apis/\">Migrating from deprecated APIs</a> for more details." + "deprecationInfo": "use the <code>slotProps</code> prop instead. This prop will be removed in v7. See <a href=\"https://mui.com/material-ui/migration/migrating-from-deprecated-apis/\">Migrating from deprecated APIs</a> for more details." }, "icon": { "type": { "name": "node" } }, "iconMapping": { diff --git a/docs/pages/material-ui/api/autocomplete.json b/docs/pages/material-ui/api/autocomplete.json index 6d8aa34cc72031..0eebdc3261a28d 100644 --- a/docs/pages/material-ui/api/autocomplete.json +++ b/docs/pages/material-ui/api/autocomplete.json @@ -29,7 +29,7 @@ "description": "{ clearIndicator?: object, paper?: object, popper?: object, popupIndicator?: object }" }, "deprecated": true, - "deprecationInfo": "Use the <code>slotProps</code> prop instead. This prop will be removed in v7. See <a href=\"/material-ui/migration/migrating-from-deprecated-apis/\">Migrating from deprecated APIs</a> for more details." + "deprecationInfo": "Use the <code>slotProps</code> prop instead. This prop will be removed in v7. See <a href=\"https://mui.com/material-ui/migration/migrating-from-deprecated-apis/\">Migrating from deprecated APIs</a> for more details." }, "defaultValue": { "type": { "name": "custom", "description": "any" }, diff --git a/docs/pages/material-ui/api/avatar-group.json b/docs/pages/material-ui/api/avatar-group.json index 5170bcb64cecc6..41370a1793b165 100644 --- a/docs/pages/material-ui/api/avatar-group.json +++ b/docs/pages/material-ui/api/avatar-group.json @@ -6,7 +6,7 @@ "componentsProps": { "type": { "name": "shape", "description": "{ additionalAvatar?: object }" }, "deprecated": true, - "deprecationInfo": "use the <code>slotProps</code> prop instead. This prop will be removed in v7. See <a href=\"/material-ui/migration/migrating-from-deprecated-apis/\">Migrating from deprecated APIs</a> for more details." + "deprecationInfo": "use the <code>slotProps</code> prop instead. This prop will be removed in v7. See <a href=\"https://mui.com/material-ui/migration/migrating-from-deprecated-apis/\">Migrating from deprecated APIs</a> for more details." }, "max": { "type": { "name": "custom", "description": "number" }, "default": "5" }, "renderSurplus": { diff --git a/docs/pages/material-ui/api/avatar.json b/docs/pages/material-ui/api/avatar.json index fe17a8e52b8d1b..c7049f61c281f4 100644 --- a/docs/pages/material-ui/api/avatar.json +++ b/docs/pages/material-ui/api/avatar.json @@ -39,7 +39,7 @@ "slots": [ { "name": "img", - "description": "The component that renders the transition.\n[Follow this guide](/material-ui/transitions/#transitioncomponent-prop) to learn more about the requirements for this component.", + "description": "The component that renders the transition.\n[Follow this guide](https://mui.com/material-ui/transitions/#transitioncomponent-prop) to learn more about the requirements for this component.", "default": "Collapse", "class": "MuiAvatar-img" } diff --git a/docs/pages/material-ui/api/backdrop.json b/docs/pages/material-ui/api/backdrop.json index bcd93a93d9e280..591d41f1a66d8d 100644 --- a/docs/pages/material-ui/api/backdrop.json +++ b/docs/pages/material-ui/api/backdrop.json @@ -8,13 +8,13 @@ "type": { "name": "shape", "description": "{ Root?: elementType }" }, "default": "{}", "deprecated": true, - "deprecationInfo": "Use the <code>slots</code> prop instead. This prop will be removed in v7. See <a href=\"/material-ui/migration/migrating-from-deprecated-apis/\">Migrating from deprecated APIs</a> for more details." + "deprecationInfo": "Use the <code>slots</code> prop instead. This prop will be removed in v7. See <a href=\"https://mui.com/material-ui/migration/migrating-from-deprecated-apis/\">Migrating from deprecated APIs</a> for more details." }, "componentsProps": { "type": { "name": "shape", "description": "{ root?: object }" }, "default": "{}", "deprecated": true, - "deprecationInfo": "Use the <code>slotProps</code> prop instead. This prop will be removed in v7. See <a href=\"/material-ui/migration/migrating-from-deprecated-apis/\">Migrating from deprecated APIs</a> for more details." + "deprecationInfo": "Use the <code>slotProps</code> prop instead. This prop will be removed in v7. See <a href=\"https://mui.com/material-ui/migration/migrating-from-deprecated-apis/\">Migrating from deprecated APIs</a> for more details." }, "invisible": { "type": { "name": "bool" }, "default": "false" }, "slotProps": { @@ -60,7 +60,7 @@ }, { "name": "transition", - "description": "The component that renders the transition.\n[Follow this guide](/material-ui/transitions/#transitioncomponent-prop) to learn more about the requirements for this component.", + "description": "The component that renders the transition.\n[Follow this guide](https://mui.com/material-ui/transitions/#transitioncomponent-prop) to learn more about the requirements for this component.", "default": "Fade", "class": null } diff --git a/docs/pages/material-ui/api/badge.json b/docs/pages/material-ui/api/badge.json index 7960f6d0d44359..0b1116c85c94c5 100644 --- a/docs/pages/material-ui/api/badge.json +++ b/docs/pages/material-ui/api/badge.json @@ -22,7 +22,7 @@ "type": { "name": "shape", "description": "{ Badge?: elementType, Root?: elementType }" }, "default": "{}", "deprecated": true, - "deprecationInfo": "use the <code>slots</code> prop instead. This prop will be removed in v7. See <a href=\"/material-ui/migration/migrating-from-deprecated-apis/\">Migrating from deprecated APIs</a> for more details." + "deprecationInfo": "use the <code>slots</code> prop instead. This prop will be removed in v7. See <a href=\"https://mui.com/material-ui/migration/migrating-from-deprecated-apis/\">Migrating from deprecated APIs</a> for more details." }, "componentsProps": { "type": { @@ -31,7 +31,7 @@ }, "default": "{}", "deprecated": true, - "deprecationInfo": "use the <code>slotProps</code> prop instead. This prop will be removed in v7. See <a href=\"/material-ui/migration/migrating-from-deprecated-apis/\">Migrating from deprecated APIs</a> for more details." + "deprecationInfo": "use the <code>slotProps</code> prop instead. This prop will be removed in v7. See <a href=\"https://mui.com/material-ui/migration/migrating-from-deprecated-apis/\">Migrating from deprecated APIs</a> for more details." }, "invisible": { "type": { "name": "bool" }, "default": "false" }, "max": { "type": { "name": "number" }, "default": "99" }, diff --git a/docs/pages/material-ui/api/divider.json b/docs/pages/material-ui/api/divider.json index 336d4daffab1d6..2235265aa36c32 100644 --- a/docs/pages/material-ui/api/divider.json +++ b/docs/pages/material-ui/api/divider.json @@ -9,7 +9,7 @@ "type": { "name": "bool" }, "default": "false", "deprecated": true, - "deprecationInfo": "Use <Divider sx={{ opacity: 0.6 }} /> (or any opacity or color) instead. See <a href=\"/material-ui/migration/migrating-from-deprecated-apis/\">Migrating from deprecated APIs</a> for more details." + "deprecationInfo": "Use <Divider sx={{ opacity: 0.6 }} /> (or any opacity or color) instead. See <a href=\"https://mui.com/material-ui/migration/migrating-from-deprecated-apis/\">Migrating from deprecated APIs</a> for more details." }, "orientation": { "type": { "name": "enum", "description": "'horizontal'<br>| 'vertical'" }, diff --git a/docs/pages/material-ui/api/filled-input.json b/docs/pages/material-ui/api/filled-input.json index 74c675ac139e0d..201b1724cfe330 100644 --- a/docs/pages/material-ui/api/filled-input.json +++ b/docs/pages/material-ui/api/filled-input.json @@ -13,13 +13,13 @@ "type": { "name": "shape", "description": "{ Input?: elementType, Root?: elementType }" }, "default": "{}", "deprecated": true, - "deprecationInfo": "use the <code>slots</code> prop instead. This prop will be removed in v7. See <a href=\"/material-ui/migration/migrating-from-deprecated-apis/\">Migrating from deprecated APIs</a> for more details." + "deprecationInfo": "use the <code>slots</code> prop instead. This prop will be removed in v7. See <a href=\"https://mui.com/material-ui/migration/migrating-from-deprecated-apis/\">Migrating from deprecated APIs</a> for more details." }, "componentsProps": { "type": { "name": "shape", "description": "{ input?: object, root?: object }" }, "default": "{}", "deprecated": true, - "deprecationInfo": "use the <code>slotProps</code> prop instead. This prop will be removed in v7. See <a href=\"/material-ui/migration/migrating-from-deprecated-apis/\">Migrating from deprecated APIs</a> for more details." + "deprecationInfo": "use the <code>slotProps</code> prop instead. This prop will be removed in v7. See <a href=\"https://mui.com/material-ui/migration/migrating-from-deprecated-apis/\">Migrating from deprecated APIs</a> for more details." }, "defaultValue": { "type": { "name": "any" } }, "disabled": { "type": { "name": "bool" } }, diff --git a/docs/pages/material-ui/api/form-control-label.json b/docs/pages/material-ui/api/form-control-label.json index 8569400cdbe4e3..2ad1afa5a4066a 100644 --- a/docs/pages/material-ui/api/form-control-label.json +++ b/docs/pages/material-ui/api/form-control-label.json @@ -7,7 +7,7 @@ "type": { "name": "shape", "description": "{ typography?: object }" }, "default": "{}", "deprecated": true, - "deprecationInfo": "use the <code>slotProps</code> prop instead. This prop will be removed in v7. See <a href=\"/material-ui/migration/migrating-from-deprecated-apis/\">Migrating from deprecated APIs</a> for more details." + "deprecationInfo": "use the <code>slotProps</code> prop instead. This prop will be removed in v7. See <a href=\"https://mui.com/material-ui/migration/migrating-from-deprecated-apis/\">Migrating from deprecated APIs</a> for more details." }, "disabled": { "type": { "name": "bool" } }, "disableTypography": { "type": { "name": "bool" } }, diff --git a/docs/pages/material-ui/api/grid.json b/docs/pages/material-ui/api/grid.json index 3e5fa15e9b0f58..336d50f41e3bac 100644 --- a/docs/pages/material-ui/api/grid.json +++ b/docs/pages/material-ui/api/grid.json @@ -71,9 +71,7 @@ "name": "enum", "description": "'nowrap'<br>| 'wrap-reverse'<br>| 'wrap'" }, - "default": "'wrap'", - "deprecated": true, - "deprecationInfo": "Use <code>flexWrap</code> instead. This prop will be removed in v7. See <a href=\"/material-ui/migration/migrating-from-deprecated-apis/\">Migrating from deprecated APIs</a> for more details." + "default": "'wrap'" }, "xl": { "type": { diff --git a/docs/pages/material-ui/api/input-base.json b/docs/pages/material-ui/api/input-base.json index 692496c28ce8d0..d82043dbd4bd7e 100644 --- a/docs/pages/material-ui/api/input-base.json +++ b/docs/pages/material-ui/api/input-base.json @@ -13,13 +13,13 @@ "type": { "name": "shape", "description": "{ Input?: elementType, Root?: elementType }" }, "default": "{}", "deprecated": true, - "deprecationInfo": "use the <code>slots</code> prop instead. This prop will be removed in v7. See <a href=\"/material-ui/migration/migrating-from-deprecated-apis/\">Migrating from deprecated APIs</a> for more details." + "deprecationInfo": "use the <code>slots</code> prop instead. This prop will be removed in v7. See <a href=\"https://mui.com/material-ui/migration/migrating-from-deprecated-apis/\">Migrating from deprecated APIs</a> for more details." }, "componentsProps": { "type": { "name": "shape", "description": "{ input?: object, root?: object }" }, "default": "{}", "deprecated": true, - "deprecationInfo": "use the <code>slotProps</code> prop instead. This prop will be removed in v7. See <a href=\"/material-ui/migration/migrating-from-deprecated-apis/\">Migrating from deprecated APIs</a> for more details." + "deprecationInfo": "use the <code>slotProps</code> prop instead. This prop will be removed in v7. See <a href=\"https://mui.com/material-ui/migration/migrating-from-deprecated-apis/\">Migrating from deprecated APIs</a> for more details." }, "defaultValue": { "type": { "name": "any" } }, "disabled": { "type": { "name": "bool" } }, diff --git a/docs/pages/material-ui/api/input.json b/docs/pages/material-ui/api/input.json index 8d1dfb0c94ff05..d1bf4a404506b0 100644 --- a/docs/pages/material-ui/api/input.json +++ b/docs/pages/material-ui/api/input.json @@ -13,13 +13,13 @@ "type": { "name": "shape", "description": "{ Input?: elementType, Root?: elementType }" }, "default": "{}", "deprecated": true, - "deprecationInfo": "use the <code>slots</code> prop instead. This prop will be removed in v7. See <a href=\"/material-ui/migration/migrating-from-deprecated-apis/\">Migrating from deprecated APIs</a> for more details." + "deprecationInfo": "use the <code>slots</code> prop instead. This prop will be removed in v7. See <a href=\"https://mui.com/material-ui/migration/migrating-from-deprecated-apis/\">Migrating from deprecated APIs</a> for more details." }, "componentsProps": { "type": { "name": "shape", "description": "{ input?: object, root?: object }" }, "default": "{}", "deprecated": true, - "deprecationInfo": "use the <code>slotProps</code> prop instead. This prop will be removed in v7. See <a href=\"/material-ui/migration/migrating-from-deprecated-apis/\">Migrating from deprecated APIs</a> for more details." + "deprecationInfo": "use the <code>slotProps</code> prop instead. This prop will be removed in v7. See <a href=\"https://mui.com/material-ui/migration/migrating-from-deprecated-apis/\">Migrating from deprecated APIs</a> for more details." }, "defaultValue": { "type": { "name": "any" } }, "disabled": { "type": { "name": "bool" } }, diff --git a/docs/pages/material-ui/api/list-item.json b/docs/pages/material-ui/api/list-item.json index bc039787a53e9c..7e5dd75308f09e 100644 --- a/docs/pages/material-ui/api/list-item.json +++ b/docs/pages/material-ui/api/list-item.json @@ -11,25 +11,25 @@ "type": { "name": "shape", "description": "{ Root?: elementType }" }, "default": "{}", "deprecated": true, - "deprecationInfo": "Use the <code>slots</code> prop instead. This prop will be removed in v7. See <a href=\"/material-ui/migration/migrating-from-deprecated-apis/\">Migrating from deprecated APIs</a> for more details." + "deprecationInfo": "Use the <code>slots</code> prop instead. This prop will be removed in v7. See <a href=\"https://mui.com/material-ui/migration/migrating-from-deprecated-apis/\">Migrating from deprecated APIs</a> for more details." }, "componentsProps": { "type": { "name": "shape", "description": "{ root?: object }" }, "default": "{}", "deprecated": true, - "deprecationInfo": "Use the <code>slotProps</code> prop instead. This prop will be removed in v7. See <a href=\"/material-ui/migration/migrating-from-deprecated-apis/\">Migrating from deprecated APIs</a> for more details." + "deprecationInfo": "Use the <code>slotProps</code> prop instead. This prop will be removed in v7. See <a href=\"https://mui.com/material-ui/migration/migrating-from-deprecated-apis/\">Migrating from deprecated APIs</a> for more details." }, "ContainerComponent": { "type": { "name": "custom", "description": "element type" }, "default": "'li'", "deprecated": true, - "deprecationInfo": "Use the <code>component</code> or <code>slots.root</code> prop instead. This prop will be removed in v7. See <a href=\"/material-ui/migration/migrating-from-deprecated-apis/\">Migrating from deprecated APIs</a> for more details." + "deprecationInfo": "Use the <code>component</code> or <code>slots.root</code> prop instead. This prop will be removed in v7. See <a href=\"https://mui.com/material-ui/migration/migrating-from-deprecated-apis/\">Migrating from deprecated APIs</a> for more details." }, "ContainerProps": { "type": { "name": "object" }, "default": "{}", "deprecated": true, - "deprecationInfo": "Use the <code>slotProps.root</code> prop instead. This prop will be removed in v7. See <a href=\"/material-ui/migration/migrating-from-deprecated-apis/\">Migrating from deprecated APIs</a> for more details." + "deprecationInfo": "Use the <code>slotProps.root</code> prop instead. This prop will be removed in v7. See <a href=\"https://mui.com/material-ui/migration/migrating-from-deprecated-apis/\">Migrating from deprecated APIs</a> for more details." }, "dense": { "type": { "name": "bool" }, "default": "false" }, "disableGutters": { "type": { "name": "bool" }, "default": "false" }, diff --git a/docs/pages/material-ui/api/loading-button.json b/docs/pages/material-ui/api/loading-button.json index 555074c1ad71b8..8155927a65f266 100644 --- a/docs/pages/material-ui/api/loading-button.json +++ b/docs/pages/material-ui/api/loading-button.json @@ -217,6 +217,12 @@ "isGlobal": false, "isDeprecated": true }, + { + "key": "label", + "className": "MuiLoadingButton-label", + "description": "Styles applied to the span element that wraps the children.", + "isGlobal": false + }, { "key": "loading", "className": "MuiLoadingButton-loading", diff --git a/docs/pages/material-ui/api/modal.json b/docs/pages/material-ui/api/modal.json index d4fa96eb6f613d..b5615a5f9184af 100644 --- a/docs/pages/material-ui/api/modal.json +++ b/docs/pages/material-ui/api/modal.json @@ -20,7 +20,7 @@ "type": { "name": "shape", "description": "{ Backdrop?: elementType, Root?: elementType }" }, "default": "{}", "deprecated": true, - "deprecationInfo": "Use the <code>slots</code> prop instead. This prop will be removed in v7. See <a href=\"/material-ui/migration/migrating-from-deprecated-apis/\">Migrating from deprecated APIs</a> for more details." + "deprecationInfo": "Use the <code>slots</code> prop instead. This prop will be removed in v7. See <a href=\"https://mui.com/material-ui/migration/migrating-from-deprecated-apis/\">Migrating from deprecated APIs</a> for more details." }, "componentsProps": { "type": { @@ -29,7 +29,7 @@ }, "default": "{}", "deprecated": true, - "deprecationInfo": "Use the <code>slotProps</code> prop instead. This prop will be removed in v7. See <a href=\"/material-ui/migration/migrating-from-deprecated-apis/\">Migrating from deprecated APIs</a> for more details." + "deprecationInfo": "Use the <code>slotProps</code> prop instead. This prop will be removed in v7. See <a href=\"https://mui.com/material-ui/migration/migrating-from-deprecated-apis/\">Migrating from deprecated APIs</a> for more details." }, "container": { "type": { "name": "union", "description": "HTML element<br>| func" } }, "disableAutoFocus": { "type": { "name": "bool" }, "default": "false" }, diff --git a/docs/pages/material-ui/api/outlined-input.json b/docs/pages/material-ui/api/outlined-input.json index 73efeefa0d9e74..2877a284eb8790 100644 --- a/docs/pages/material-ui/api/outlined-input.json +++ b/docs/pages/material-ui/api/outlined-input.json @@ -13,7 +13,7 @@ "type": { "name": "shape", "description": "{ Input?: elementType, Root?: elementType }" }, "default": "{}", "deprecated": true, - "deprecationInfo": "use the <code>slots</code> prop instead. This prop will be removed in v7. See <a href=\"/material-ui/migration/migrating-from-deprecated-apis/\">Migrating from deprecated APIs</a> for more details." + "deprecationInfo": "use the <code>slots</code> prop instead. This prop will be removed in v7. See <a href=\"https://mui.com/material-ui/migration/migrating-from-deprecated-apis/\">Migrating from deprecated APIs</a> for more details." }, "defaultValue": { "type": { "name": "any" } }, "disabled": { "type": { "name": "bool" } }, diff --git a/docs/pages/material-ui/api/pagination-item.json b/docs/pages/material-ui/api/pagination-item.json index a987676039329c..fbcf7dc41d09ac 100644 --- a/docs/pages/material-ui/api/pagination-item.json +++ b/docs/pages/material-ui/api/pagination-item.json @@ -16,7 +16,7 @@ }, "default": "{}", "deprecated": true, - "deprecationInfo": "use the <code>slots</code> prop instead. This prop will be removed in v7. See <a href=\"/material-ui/migration/migrating-from-deprecated-apis/\">Migrating from deprecated APIs</a> for more details." + "deprecationInfo": "use the <code>slots</code> prop instead. This prop will be removed in v7. See <a href=\"https://mui.com/material-ui/migration/migrating-from-deprecated-apis/\">Migrating from deprecated APIs</a> for more details." }, "disabled": { "type": { "name": "bool" }, "default": "false" }, "page": { "type": { "name": "node" } }, diff --git a/docs/pages/material-ui/api/pagination.json b/docs/pages/material-ui/api/pagination.json index a59b2a71efc024..b07c43f7fada33 100644 --- a/docs/pages/material-ui/api/pagination.json +++ b/docs/pages/material-ui/api/pagination.json @@ -15,7 +15,7 @@ "getItemAriaLabel": { "type": { "name": "func" }, "signature": { - "type": "function(type: string, page: number, selected: bool) => string", + "type": "function(type: string, page: number | null, selected: boolean) => string", "describedArgs": ["type", "page", "selected"] } }, diff --git a/docs/pages/material-ui/api/popover.json b/docs/pages/material-ui/api/popover.json index f7785d7add6e68..15326384759007 100644 --- a/docs/pages/material-ui/api/popover.json +++ b/docs/pages/material-ui/api/popover.json @@ -20,6 +20,17 @@ }, "default": "'anchorEl'" }, + "BackdropComponent": { + "type": { "name": "elementType" }, + "default": "styled(Backdrop, {\n name: 'MuiModal',\n slot: 'Backdrop',\n overridesResolver: (props, styles) => {\n return styles.backdrop;\n },\n})({\n zIndex: -1,\n})", + "deprecated": true, + "deprecationInfo": "Use <code>slotProps.root.slots.backdrop</code> instead. While this prop currently works, it will be removed in the next major version." + }, + "BackdropProps": { + "type": { "name": "object" }, + "deprecated": true, + "deprecationInfo": "Use <code>slotProps.root.slotProps.backdrop</code> instead." + }, "children": { "type": { "name": "node" } }, "classes": { "type": { "name": "object" }, "additionalInfo": { "cssApi": true } }, "container": { "type": { "name": "union", "description": "HTML element<br>| func" } }, diff --git a/docs/pages/material-ui/api/slider.json b/docs/pages/material-ui/api/slider.json index 560de0dc01bc53..8060ebacdf56f3 100644 --- a/docs/pages/material-ui/api/slider.json +++ b/docs/pages/material-ui/api/slider.json @@ -18,7 +18,7 @@ }, "default": "{}", "deprecated": true, - "deprecationInfo": "use the <code>slots</code> prop instead. This prop will be removed in v7. See <a href=\"/material-ui/migration/migrating-from-deprecated-apis/\">Migrating from deprecated APIs</a> for more details." + "deprecationInfo": "use the <code>slots</code> prop instead. This prop will be removed in v7. See <a href=\"https://mui.com/material-ui/migration/migrating-from-deprecated-apis/\">Migrating from deprecated APIs</a> for more details." }, "componentsProps": { "type": { @@ -27,7 +27,7 @@ }, "default": "{}", "deprecated": true, - "deprecationInfo": "use the <code>slotProps</code> prop instead. This prop will be removed in v7. See <a href=\"/material-ui/migration/migrating-from-deprecated-apis/\">Migrating from deprecated APIs</a> for more details." + "deprecationInfo": "use the <code>slotProps</code> prop instead. This prop will be removed in v7. See <a href=\"https://mui.com/material-ui/migration/migrating-from-deprecated-apis/\">Migrating from deprecated APIs</a> for more details." }, "defaultValue": { "type": { "name": "union", "description": "Array<number><br>| number" } diff --git a/docs/pages/material-ui/api/speed-dial.json b/docs/pages/material-ui/api/speed-dial.json index 71c089e3f565f9..de5ec1866b4d4d 100644 --- a/docs/pages/material-ui/api/speed-dial.json +++ b/docs/pages/material-ui/api/speed-dial.json @@ -62,7 +62,7 @@ "slots": [ { "name": "transition", - "description": "The component that renders the transition.\n[Follow this guide](/material-ui/transitions/#transitioncomponent-prop) to learn more about the requirements for this component.", + "description": "The component that renders the transition.\n[Follow this guide](https://mui.com/material-ui/transitions/#transitioncomponent-prop) to learn more about the requirements for this component.", "default": "{}", "class": null } diff --git a/docs/pages/material-ui/api/step-label.json b/docs/pages/material-ui/api/step-label.json index de93ef10e42822..50cf61702588a3 100644 --- a/docs/pages/material-ui/api/step-label.json +++ b/docs/pages/material-ui/api/step-label.json @@ -6,7 +6,7 @@ "type": { "name": "shape", "description": "{ label?: object }" }, "default": "{}", "deprecated": true, - "deprecationInfo": "use the <code>slotProps</code> prop instead. This prop will be removed in v7. See <a href=\"/material-ui/migration/migrating-from-deprecated-apis/\">Migrating from deprecated APIs</a> for more details." + "deprecationInfo": "use the <code>slotProps</code> prop instead. This prop will be removed in v7. See <a href=\"https://mui.com/material-ui/migration/migrating-from-deprecated-apis/\">Migrating from deprecated APIs</a> for more details." }, "error": { "type": { "name": "bool" }, "default": "false" }, "icon": { "type": { "name": "node" } }, @@ -46,7 +46,7 @@ }, { "name": "stepIcon", - "description": "The component to render in place of the [`StepIcon`](/material-ui/api/step-icon/).", + "description": "The component to render in place of the [`StepIcon`](https://mui.com/material-ui/api/step-icon/).", "class": null } ], diff --git a/docs/pages/material-ui/api/text-field.json b/docs/pages/material-ui/api/text-field.json index 0bbad58b8b4746..0a8c3f72ccb8ce 100644 --- a/docs/pages/material-ui/api/text-field.json +++ b/docs/pages/material-ui/api/text-field.json @@ -16,7 +16,7 @@ "FormHelperTextProps": { "type": { "name": "object" }, "deprecated": true, - "deprecationInfo": "Use <code>slotProps.formHelperText</code> instead. This prop will be removed in v7. See <a href=\"/material-ui/migration/migrating-from-deprecated-apis/\">Migrating from deprecated APIs</a> for more details." + "deprecationInfo": "Use <code>slotProps.formHelperText</code> instead. This prop will be removed in v7. See <a href=\"https://mui.com/material-ui/migration/migrating-from-deprecated-apis/\">Migrating from deprecated APIs</a> for more details." }, "fullWidth": { "type": { "name": "bool" }, "default": "false" }, "helperText": { "type": { "name": "node" } }, @@ -24,17 +24,17 @@ "InputLabelProps": { "type": { "name": "object" }, "deprecated": true, - "deprecationInfo": "Use <code>slotProps.inputLabel</code> instead. This prop will be removed in v7. See <a href=\"/material-ui/migration/migrating-from-deprecated-apis/\">Migrating from deprecated APIs</a> for more details." + "deprecationInfo": "Use <code>slotProps.inputLabel</code> instead. This prop will be removed in v7. See <a href=\"https://mui.com/material-ui/migration/migrating-from-deprecated-apis/\">Migrating from deprecated APIs</a> for more details." }, "inputProps": { "type": { "name": "object" }, "deprecated": true, - "deprecationInfo": "Use <code>slotProps.htmlInput</code> instead. This prop will be removed in v7. See <a href=\"/material-ui/migration/migrating-from-deprecated-apis/\">Migrating from deprecated APIs</a> for more details." + "deprecationInfo": "Use <code>slotProps.htmlInput</code> instead. This prop will be removed in v7. See <a href=\"https://mui.com/material-ui/migration/migrating-from-deprecated-apis/\">Migrating from deprecated APIs</a> for more details." }, "InputProps": { "type": { "name": "object" }, "deprecated": true, - "deprecationInfo": "Use <code>slotProps.input</code> instead. This prop will be removed in v7. See <a href=\"/material-ui/migration/migrating-from-deprecated-apis/\">Migrating from deprecated APIs</a> for more details." + "deprecationInfo": "Use <code>slotProps.input</code> instead. This prop will be removed in v7. See <a href=\"https://mui.com/material-ui/migration/migrating-from-deprecated-apis/\">Migrating from deprecated APIs</a> for more details." }, "inputRef": { "type": { "name": "custom", "description": "ref" } }, "label": { "type": { "name": "node" } }, @@ -60,7 +60,7 @@ "SelectProps": { "type": { "name": "object" }, "deprecated": true, - "deprecationInfo": "Use <code>slotProps.select</code> instead. This prop will be removed in v7. See <a href=\"/material-ui/migration/migrating-from-deprecated-apis/\">Migrating from deprecated APIs</a> for more details." + "deprecationInfo": "Use <code>slotProps.select</code> instead. This prop will be removed in v7. See <a href=\"https://mui.com/material-ui/migration/migrating-from-deprecated-apis/\">Migrating from deprecated APIs</a> for more details." }, "size": { "type": { diff --git a/docs/pages/material-ui/api/tooltip.json b/docs/pages/material-ui/api/tooltip.json index da38990cf9ce1d..9433e5b4a16481 100644 --- a/docs/pages/material-ui/api/tooltip.json +++ b/docs/pages/material-ui/api/tooltip.json @@ -10,7 +10,7 @@ }, "default": "{}", "deprecated": true, - "deprecationInfo": "use the <code>slots</code> prop instead. This prop will be removed in v7. <a href=\"/material-ui/migration/migrating-from-deprecated-apis/\">How to migrate</a>." + "deprecationInfo": "use the <code>slots</code> prop instead. This prop will be removed in v7. <a href=\"https://mui.com/material-ui/migration/migrating-from-deprecated-apis/\">How to migrate</a>." }, "componentsProps": { "type": { @@ -19,7 +19,7 @@ }, "default": "{}", "deprecated": true, - "deprecationInfo": "use the <code>slotProps</code> prop instead. This prop will be removed in v7. <a href=\"/material-ui/migration/migrating-from-deprecated-apis/\">How to migrate</a>." + "deprecationInfo": "use the <code>slotProps</code> prop instead. This prop will be removed in v7. <a href=\"https://mui.com/material-ui/migration/migrating-from-deprecated-apis/\">How to migrate</a>." }, "describeChild": { "type": { "name": "bool" }, "default": "false" }, "disableFocusListener": { "type": { "name": "bool" }, "default": "false" }, diff --git a/docs/pages/material-ui/api/typography.json b/docs/pages/material-ui/api/typography.json index 5bc2114152dd81..4e4d5de5e0ddaf 100644 --- a/docs/pages/material-ui/api/typography.json +++ b/docs/pages/material-ui/api/typography.json @@ -22,7 +22,7 @@ "type": { "name": "bool" }, "default": "false", "deprecated": true, - "deprecationInfo": "Use the <code>component</code> prop instead. This prop will be removed in v7. See <a href=\"/material-ui/migration/migrating-from-deprecated-apis/\">Migrating from deprecated APIs</a> for more details." + "deprecationInfo": "Use the <code>component</code> prop instead. This prop will be removed in v7. See <a href=\"https://mui.com/material-ui/migration/migrating-from-deprecated-apis/\">Migrating from deprecated APIs</a> for more details." }, "sx": { "type": { diff --git a/docs/pages/pricing.tsx b/docs/pages/pricing.tsx index 3bae988fef5b80..9ffc17f0704147 100644 --- a/docs/pages/pricing.tsx +++ b/docs/pages/pricing.tsx @@ -13,7 +13,7 @@ import HeroEnd from 'docs/src/components/home/HeroEnd'; import AppFooter from 'docs/src/layouts/AppFooter'; import BrandingCssVarsProvider from 'docs/src/BrandingCssVarsProvider'; import AppHeaderBanner from 'docs/src/components/banner/AppHeaderBanner'; -import { LicensingModelProvider } from 'docs/src/components/pricing/LicensingModelContext'; +import { LicenseModelProvider } from 'docs/src/components/pricing/LicenseModelContext'; export default function Pricing() { return ( @@ -28,7 +28,7 @@ export default function Pricing() { <main id="main-content"> <HeroPricing /> <Divider /> - <LicensingModelProvider> + <LicenseModelProvider> {/* Mobile, Tablet */} <Container sx={{ display: { xs: 'block', md: 'none' }, pb: 3, mt: '-1px' }}> <PricingList /> @@ -37,7 +37,7 @@ export default function Pricing() { <Container sx={{ display: { xs: 'none', md: 'block' } }}> <PricingTable /> </Container> - </LicensingModelProvider> + </LicenseModelProvider> <PricingWhatToExpect /> <Divider /> <PricingFAQ /> diff --git a/docs/public/_redirects b/docs/public/_redirects index 9e247268edd496..626cf9bfb95a97 100644 --- a/docs/public/_redirects +++ b/docs/public/_redirects @@ -7,9 +7,6 @@ /size-snapshot https://s3.eu-central-1.amazonaws.com/mui-org-ci/artifacts/master/latest/size-snapshot.json 200 -# To add when we finish work on v6 -# https://next.mui.com/* https://mui.com/:splat 301! - # For links that we can't edit later on, for example hosted in the code published on npm /r/styles-instance-warning /material-ui/getting-started/faq/#i-have-several-instances-of-styles-on-the-page 302 /r/caveat-with-refs-guide /material-ui/guides/composition/#caveat-with-refs 302 diff --git a/docs/public/static/blog/material-ui-v6-is-out/card.png b/docs/public/static/blog/material-ui-v6-is-out/card.png new file mode 100644 index 00000000000000..67fa694d048bdf Binary files /dev/null and b/docs/public/static/blog/material-ui-v6-is-out/card.png differ diff --git a/docs/public/static/blog/material-ui-v6-is-out/dark-templates.png b/docs/public/static/blog/material-ui-v6-is-out/dark-templates.png new file mode 100644 index 00000000000000..8d20642de2dcfd Binary files /dev/null and b/docs/public/static/blog/material-ui-v6-is-out/dark-templates.png differ diff --git a/docs/public/static/blog/material-ui-v6-is-out/light-templates.png b/docs/public/static/blog/material-ui-v6-is-out/light-templates.png new file mode 100644 index 00000000000000..e16ba517aadae0 Binary files /dev/null and b/docs/public/static/blog/material-ui-v6-is-out/light-templates.png differ diff --git a/docs/scripts/i18n.ts b/docs/scripts/i18n.ts index 3385f15933f760..adde6c416d14b6 100644 --- a/docs/scripts/i18n.ts +++ b/docs/scripts/i18n.ts @@ -8,7 +8,7 @@ import basePages from 'docs/data/base/pages'; import joyPages from 'docs/data/joy/pages'; import { MuiPage } from 'docs/src/MuiPage'; -const EXCLUDES = ['/api', '/blog', '/x/react-']; +const EXCLUDES = ['/api', '/blog', '/x/react-', '/toolpad']; async function run() { const translationsFilename = path.join(__dirname, '../translations/translations.json'); diff --git a/docs/scripts/reportBrokenLinks.js b/docs/scripts/reportBrokenLinks.js index 0463b185c21ecc..5fd6de1bf24709 100644 --- a/docs/scripts/reportBrokenLinks.js +++ b/docs/scripts/reportBrokenLinks.js @@ -90,6 +90,8 @@ function getLinksAndAnchors(fileName) { }; } +const markdownImportRegExp = /'(.*)\?(muiMarkdown|@mui\/markdown)'/g; + const getMdFilesImported = (jsPageFile) => { // For each JS file extract the markdown rendered if it exists const fileContent = fse.readFileSync(jsPageFile, 'utf8'); @@ -99,27 +101,31 @@ const getMdFilesImported = (jsPageFile) => { * - 'docs/data/advanced-components/overview.md?muiMarkdown'; * - './index.md?muiMarkdown'; */ - const importPaths = fileContent.match(/'.*\?muiMarkdown'/g); + const importPaths = fileContent.match(markdownImportRegExp); if (importPaths === null) { return []; } return importPaths.map((importPath) => { - let cleanImportPath = importPath.slice(1, importPath.length - "?muiMarkdown'".length); + let cleanImportPath = importPath.replace(markdownImportRegExp, '$1'); if (cleanImportPath.startsWith('.')) { cleanImportPath = path.join(path.dirname(jsPageFile), cleanImportPath); - } else if (cleanImportPath.startsWith('docs/')) { - cleanImportPath = path.join( - jsPageFile.slice(0, jsPageFile.indexOf('docs/')), - cleanImportPath, - ); - } else if (cleanImportPath.startsWith('docsx/')) { + } else { + /** + * convert /Users/oliviertassinari/base-ui/docs/pages/base-ui/react-switch/index.js + * and docs-base/data/base/components/switch/switch.md + * into /Users/oliviertassinari/base-ui/docs/data/base/components/switch/switch.md + */ + const cleanImportPathArray = cleanImportPath.split('/'); + // Assume that the first folder is /docs or an alias that starts with /docs + cleanImportPathArray.shift(); + + // Truncate jsPageFile at /docs/ and append cleanImportPath cleanImportPath = path.join( - jsPageFile.slice(0, jsPageFile.indexOf('docs/')), - cleanImportPath.replace('docsx', 'docs'), + jsPageFile.slice(0, jsPageFile.indexOf('/docs/')), + 'docs', + cleanImportPathArray.join('/'), ); - } else { - console.error(`unable to deal with import path: ${cleanImportPath}`); } return cleanImportPath; diff --git a/docs/src/components/action/Frame.tsx b/docs/src/components/action/Frame.tsx index 39f3235aab08f6..c3ee070fd4fea9 100644 --- a/docs/src/components/action/Frame.tsx +++ b/docs/src/components/action/Frame.tsx @@ -46,9 +46,13 @@ const FrameInfo = React.forwardRef<HTMLDivElement, BoxProps>(function FrameInfo( ); }); -function Frame({ sx, ...props }: BoxProps) { +const Frame = React.forwardRef<HTMLDivElement, BoxProps>(function Frame( + { sx, ...props }: BoxProps, + ref, +) { return ( <Box + ref={ref} {...props} sx={[ { @@ -67,7 +71,10 @@ function Frame({ sx, ...props }: BoxProps) { ]} /> ); -} +}) as ReturnType<typeof React.forwardRef<HTMLDivElement, BoxProps>> & { + Demo: typeof FrameDemo; + Info: typeof FrameInfo; +}; Frame.Demo = FrameDemo; Frame.Info = FrameInfo; diff --git a/docs/src/components/blog/material-ui-v6-is-out/CustomThemeComparison.js b/docs/src/components/blog/material-ui-v6-is-out/CustomThemeComparison.js new file mode 100644 index 00000000000000..b14bedab2246f4 --- /dev/null +++ b/docs/src/components/blog/material-ui-v6-is-out/CustomThemeComparison.js @@ -0,0 +1,139 @@ +import * as React from 'react'; +import Box from '@mui/material/Box'; + +import useResizeHandle from 'docs/src/modules/utils/useResizeHandle'; +import Frame from '../../action/Frame'; + +export default function CustomThemeComparison() { + const objectRef = React.useRef(null); + const handleDragging = React.useCallback((target, length) => { + const rect = target.getBoundingClientRect(); + target.style.setProperty( + '--split-point', + `clamp(12px, ${((length * 100) / rect.width).toFixed(2)}%, calc(100% - 12px))`, + ); + }, []); + const { dragging, getDragHandlers } = useResizeHandle(objectRef, { + onDragging: handleDragging, + }); + return ( + <Frame + ref={objectRef} + style={{ touchAction: dragging ? 'none' : 'auto' }} + sx={{ + height: 'clamp(260px, 40vmax, 420px)', + mx: { md: '-64px' }, + position: 'relative', + mb: 2, + '--split-point': '50%', + '& > *': { + borderRadius: '12px', + }, + }} + > + <Frame.Demo + sx={{ + overflow: 'auto', + flexGrow: 1, + display: 'flex', + flexDirection: 'column', + justifyContent: 'center', + alignItems: 'center', + position: 'absolute', + top: 0, + left: 0, + width: '100%', + height: '100%', + clipPath: 'inset(0 calc(100% - var(--split-point)) 0 0)', + }} + > + <Box + component="img" + src="/static/screenshots/material-ui/getting-started/templates/dashboard-default.jpg" + sx={(theme) => ({ + userSelect: 'none', + pointerEvents: 'none', + width: '100%', + height: '100%', + objectFit: 'cover', + objectPosition: 'top', + ...theme.applyStyles('dark', { + content: + 'url(/static/screenshots/material-ui/getting-started/templates/dashboard-default-dark.jpg)', + }), + })} + /> + </Frame.Demo> + <Frame.Demo + sx={{ + overflow: 'auto', + flexGrow: 1, + display: 'flex', + flexDirection: 'column', + justifyContent: 'center', + alignItems: 'center', + position: 'absolute', + top: 0, + left: 0, + width: '100%', + height: '100%', + clipPath: 'inset(0 0 0 var(--split-point))', + }} + > + <Box + component="img" + src="/static/screenshots/material-ui/getting-started/templates/dashboard.jpg" + sx={(theme) => ({ + userSelect: 'none', + pointerEvents: 'none', + width: '100%', + height: '100%', + objectFit: 'cover', + objectPosition: 'top', + ...theme.applyStyles('dark', { + content: + 'url(/static/screenshots/material-ui/getting-started/templates/dashboard-dark.jpg)', + }), + })} + /> + </Frame.Demo> + <Box + {...getDragHandlers()} + sx={{ + position: 'absolute', + top: 0, + bottom: 0, + width: 20, + left: 'var(--split-point)', + transform: 'translateX(-50%)', + cursor: 'col-resize', + }} + > + <Box + sx={{ + margin: '0 auto', + width: 10, + bgcolor: 'background.default', + height: '100%', + borderInline: '1px solid', + borderColor: 'divider', + }} + /> + <Box + className="handleButton" + sx={{ + position: 'absolute', + width: 2, + height: 14, + borderRadius: '12px', + bgcolor: 'primary.main', + top: '50%', + left: '50%', + transform: 'translate(-50%)', + transition: '0.15s', + }} + /> + </Box> + </Frame> + ); +} diff --git a/docs/src/components/blog/material-ui-v6-is-out/FreeTemplatesBento.js b/docs/src/components/blog/material-ui-v6-is-out/FreeTemplatesBento.js new file mode 100644 index 00000000000000..79b2f52eead4ea --- /dev/null +++ b/docs/src/components/blog/material-ui-v6-is-out/FreeTemplatesBento.js @@ -0,0 +1,41 @@ +import * as React from 'react'; +import Box from '@mui/material/Box'; + +export default function FreeTemplatesBento() { + return ( + <Box sx={{ position: 'relative' }}> + <Box + sx={(theme) => ({ + width: '100vw', + position: 'relative', + left: '50%', + transform: 'translateX(-50%)', + py: 3, + borderBlock: '1px solid', + borderColor: 'divider', + background: + 'linear-gradient(180deg, var(--muidocs-palette-primary-50) 0%, hsla(215, 15%, 97%, 0.6) 100%)', + ...theme.applyStyles('dark', { + background: + 'linear-gradient(180deg, hsla(210, 100%, 23%, 0.1) 0%, hsla(210, 14%, 4%, 0.5) 100%)', + }), + })} + > + <Box + component="img" + src="/static/blog/material-ui-v6-is-out/light-templates.png" + sx={(theme) => ({ + width: '100%', + maxWidth: 1000, + mx: 'auto', + display: 'block', + height: 'auto', + ...theme.applyStyles('dark', { + content: `url(/static/blog/material-ui-v6-is-out/dark-templates.png)`, + }), + })} + /> + </Box> + </Box> + ); +} diff --git a/docs/src/components/blog/material-ui-v6-is-out/ThemeTokens.js b/docs/src/components/blog/material-ui-v6-is-out/ThemeTokens.js new file mode 100644 index 00000000000000..e1b36e003ece0a --- /dev/null +++ b/docs/src/components/blog/material-ui-v6-is-out/ThemeTokens.js @@ -0,0 +1,173 @@ +import * as React from 'react'; +import Box from '@mui/material/Box'; +import { CssVarsProvider, extendTheme, styled } from '@mui/material/styles'; + +const defaultTheme = extendTheme({ + colorSchemes: { light: true, dark: true }, + colorSchemeSelector: 'data-mui-color-scheme', +}); + +const traverseObject = (palette) => { + const result = {}; + const traverse = (object, parts = []) => { + if (object && typeof object === 'object') { + for (const key of Object.keys(object)) { + traverse(object[key], [...parts, key]); + } + } else if (typeof object !== 'function') { + result[parts.join('.')] = object; + } + }; + traverse(palette); + return result; +}; + +const Table = styled('table')(({ theme }) => ({ + width: 'max-content', // to keep the content in 1 line + borderCollapse: 'separate', + borderSpacing: 0, + display: 'block', + height: 'clamp(30vmax, 40vmax, 40vmin)', + maxHeight: '40vmin', + overflowY: 'scroll', + '& th': { + textAlign: 'left', + padding: 10, + position: 'sticky', + top: 0, + zIndex: 1, + borderBottom: '1px solid', + borderColor: theme.palette.divider, + backgroundColor: theme.palette.grey[50], + ...theme.applyStyles('dark', { + borderColor: 'var(--muidocs-palette-primaryDark-700)', + backgroundColor: 'hsl(210, 25%, 9%)', + }), + }, + '& td': { + verticalAlign: 'top', + padding: '4px 10px', + fontSize: '0.75rem', + fontFamily: 'Menlo,Consolas,"Droid Sans Mono",monospace', + backgroundColor: theme.palette.common.white, + ...theme.applyStyles('dark', { + backgroundColor: 'var(--muidocs-palette-primaryDark-900)', + }), + }, +})); + +const ColorSwatch = styled('span')(({ theme }) => ({ + display: 'inline-block', + marginRight: '3px', + marginBottom: '1px', + verticalAlign: 'middle', + width: '0.75em', + height: '0.75em', + borderRadius: '2px', + border: '1px solid', + borderColor: theme.vars.palette.divider, + backgroundColor: 'currentcolor', +})); + +export default function TemplateCarousel() { + const colors = traverseObject(defaultTheme.vars.palette); + const fonts = Object.keys(defaultTheme.vars.font).map( + (key) => `--mui-font-${key.replace('.', '-')}`, + ); + const shadow = Object.keys(defaultTheme.vars.shadows).map((key) => `--mui-shadows-${key}`); + const overlay = Object.keys(defaultTheme.vars.overlays).map((key) => `--mui-overlays-${key}`); + const spacing = ['--mui-spacing']; + const shape = ['--mui-shape-borderRadius']; + const zIndex = Object.keys(defaultTheme.vars.zIndex).map((key) => `--mui-zIndex-${key}`); + return ( + <CssVarsProvider theme={defaultTheme}> + <Box + sx={(theme) => ({ + mb: 4, + border: '1px solid', + borderColor: 'divider', + borderRadius: '10px', + position: 'relative', + overflow: 'hidden', + ...theme.applyStyles('dark', { + borderColor: 'var(--muidocs-palette-primaryDark-700)', + }), + mx: 'clamp(-147px, (1000px - 100vw) * 9999, 0px)', + })} + > + <Box + sx={(theme) => ({ + position: 'absolute', + bottom: 0, + left: 0, + width: '100%', + height: 56, + pointerEvents: 'none', + opacity: 0.4, + background: + 'linear-gradient(180deg, hsla(0, 0%, 100%, 0) 80%, hsla(215, 15%, 80%, 0.7) 100%)', + ...theme.applyStyles('dark', { + opacity: 0.5, + background: + 'linear-gradient(180deg, hsla(0, 0%, 0%, 0) 80%, hsla(215, 15%, 0%, 0.8) 100%)', + }), + })} + /> + <Box + sx={(theme) => ({ + position: 'absolute', + top: 0, + right: 0, + height: '100%', + width: 56, + pointerEvents: 'none', + opacity: 0.4, + background: + 'linear-gradient(90deg, hsla(0, 0%, 100%, 0) 80%, hsla(215, 15%, 80%, 0.7) 100%)', + ...theme.applyStyles('dark', { + opacity: 0.5, + background: + 'linear-gradient(90deg, hsla(0, 0%, 0%, 0) 80%, hsla(215, 15%, 0%, 0.8) 100%)', + }), + })} + /> + <Box sx={{ overflow: 'auto' }}> + <Table> + <thead> + <tr> + <th>Light colors</th> + <th>Dark colors</th> + <th>Font</th> + <th>Overlay</th> + <th>Shadow</th> + <th>Spacing</th> + <th>Shape</th> + <th>z Index</th> + </tr> + </thead> + <tbody> + {Object.entries(colors).map((color, index) => ( + <tr key={index}> + <td> + <ColorSwatch data-mui-color-scheme="light" style={{ color: color[1] }} /> + --mui-{color[0].replace('.', '-')} + </td> + <td> + <ColorSwatch data-mui-color-scheme="dark" style={{ color: color[1] }} /> + --mui-{color[0].replace('.', '-')} + </td> + <td>{fonts[index]}</td> + <td>{overlay[index]}</td> + <td>{shadow[index]}</td> + <td>{spacing[index]}</td> + <td>{shape[index]}</td> + <td>{zIndex[index]}</td> + </tr> + ))} + </tbody> + </Table> + </Box> + </Box> + </CssVarsProvider> + ); +} diff --git a/docs/src/components/header/HeaderNavBar.tsx b/docs/src/components/header/HeaderNavBar.tsx index d1ca93c104e525..778f20e6f207f9 100644 --- a/docs/src/components/header/HeaderNavBar.tsx +++ b/docs/src/components/header/HeaderNavBar.tsx @@ -111,15 +111,24 @@ const ProductSubMenu = React.forwardRef<HTMLAnchorElement, ProductSubMenuProps>( {...props} > <Box sx={{ px: 2 }}>{icon}</Box> - <Box sx={{ flexGrow: 1 }}> - <Typography variant="body2" sx={{ color: 'text.primary', fontWeight: 'bold' }}> - {name} - </Typography> + <div style={{ flexGrow: 1 }}> + <div + style={{ + display: 'flex', + flexDirection: 'row', + alignItems: 'center', + gap: '0.5rem', + }} + > + <Typography variant="body2" sx={{ color: 'text.primary', fontWeight: 'bold' }}> + {name} + </Typography> + {chip} + </div> <Typography variant="body2" sx={{ color: 'text.secondary' }}> {description} </Typography> - </Box> - {chip} + </div> </Box> ); }, @@ -303,7 +312,24 @@ export default function HeaderNavBar() { href={ROUTES.productToolpad} icon={<IconImage name="product-toolpad" />} name="Toolpad" - chip={<Chip label="Beta" size="small" color="primary" variant="outlined" />} + chip={ + <Chip + label="Beta" + size="small" + color="primary" + variant="outlined" + sx={{ + fontSize: '.625rem', + fontWeight: 'semiBold', + textTransform: 'uppercase', + letterSpacing: '.04rem', + height: '16px', + '& .MuiChip-label': { + px: '4px', + }, + }} + /> + } description="Components and tools for dashboards and internal apps." /> </li> diff --git a/docs/src/components/header/HeaderNavDropdown.tsx b/docs/src/components/header/HeaderNavDropdown.tsx index 5eac9e1a2fec8a..713edd4644e911 100644 --- a/docs/src/components/header/HeaderNavDropdown.tsx +++ b/docs/src/components/header/HeaderNavDropdown.tsx @@ -229,6 +229,16 @@ export default function HeaderNavDropdown() { label={item.chip} color="primary" variant="outlined" + sx={{ + fontSize: '.625rem', + fontWeight: 'semiBold', + textTransform: 'uppercase', + letterSpacing: '.04rem', + height: '16px', + '& .MuiChip-label': { + px: '4px', + }, + }} /> ) : null} </Box> @@ -280,6 +290,16 @@ export default function HeaderNavDropdown() { label={item.chip} color="primary" variant="outlined" + sx={{ + fontSize: '.625rem', + fontWeight: 'semiBold', + textTransform: 'uppercase', + letterSpacing: '.04rem', + height: '16px', + '& .MuiChip-label': { + px: '4px', + }, + }} /> ) : null} </Box> diff --git a/docs/src/components/home/BacklinkSponsor.tsx b/docs/src/components/home/BacklinkSponsor.tsx new file mode 100644 index 00000000000000..a26b30dbe14d5b --- /dev/null +++ b/docs/src/components/home/BacklinkSponsor.tsx @@ -0,0 +1,35 @@ +import * as React from 'react'; +import { Link } from '@mui/docs/Link'; +import OpenInNewRoundedIcon from '@mui/icons-material/OpenInNewRounded'; + +export default function BacklinkSponsor(props: { + item: { + name: string; + description: string; + href: string; + }; +}) { + const { item } = props; + // Keep it under two rows maximum. + if (item.description.length > 50) { + throw new Error( + `${item.name}'s description is too long (${item.description.length} characters). It must fit into two line, so under 50 characters.`, + ); + } + + return ( + <Link + data-ga-event-category="sponsor" + data-ga-event-action="homepage" + data-ga-event-label={new URL(item.href).hostname} + href={item.href} + title={item.description} + target="_blank" + rel="sponsored noopener" + sx={{ mr: { xs: 2, md: 3 }, mt: { xs: 2, md: 3 } }} + > + {item.name} + <OpenInNewRoundedIcon sx={{ fontSize: 16, ml: 1, verticalAlign: 'middle' }} /> + </Link> + ); +} diff --git a/docs/src/components/home/GoldSponsors.tsx b/docs/src/components/home/GoldSponsors.tsx index ef92649a1075b6..c0d20168204fc2 100644 --- a/docs/src/components/home/GoldSponsors.tsx +++ b/docs/src/components/home/GoldSponsors.tsx @@ -6,6 +6,7 @@ import Typography from '@mui/material/Typography'; import AddRounded from '@mui/icons-material/AddRounded'; import Grid from '@mui/material/Grid2'; import SponsorCard from 'docs/src/components/home/SponsorCard'; +import BacklinkSponsor from 'docs/src/components/home/BacklinkSponsor'; import { Link } from '@mui/docs/Link'; import ROUTES from 'docs/src/route'; @@ -63,6 +64,25 @@ const GOLDs = [ description: 'Instagram followers, likes, views, and comments.', href: 'https://goread.io/?utm_source=MUI&utm_medium=referral&utm_content=homepage', }, + { + src: 'https://images.opencollective.com/copycopterai/e167216/logo/40.png', + srcSet: 'https://images.opencollective.com/copycopterai/e167216/logo/120.png 3x', + name: 'Copycopter.ai', + description: 'Turn prompts into videos at ultra speed.', + href: 'https://copycopter.ai/?utm_source=MUI&utm_medium=referral&utm_content=homepage', + }, +]; +const BACKLINKs = [ + { + name: 'Buzzoid', + description: 'Instant delivery Instagram followers.', + href: 'https://buzzoid.com/', + }, + { + name: 'Twicsy', + description: 'Instant delivery Instagram followers.', + href: 'https://twicsy.com/', + }, ]; export default function GoldSponsors() { @@ -142,6 +162,11 @@ export default function GoldSponsors() { </Paper> </Grid> </Grid> + <div> + {BACKLINKs.map((item) => ( + <BacklinkSponsor key={item.name} item={item} /> + ))} + </div> </div> ); } diff --git a/docs/src/components/pricing/LicensingModelContext.tsx b/docs/src/components/pricing/LicenseModelContext.tsx similarity index 56% rename from docs/src/components/pricing/LicensingModelContext.tsx rename to docs/src/components/pricing/LicenseModelContext.tsx index 8fcc8d0c0612a2..56b51134897954 100644 --- a/docs/src/components/pricing/LicensingModelContext.tsx +++ b/docs/src/components/pricing/LicenseModelContext.tsx @@ -6,15 +6,15 @@ if (process.env.NODE_ENV !== 'production') { LicenseModel.displayName = 'LicenseModel'; } -export function LicensingModelProvider(props: any) { - const [licensingModel, setLicensingModel] = React.useState<string>('annual'); +export function LicenseModelProvider(props: any) { + const [licenseModel, setLicenseModel] = React.useState<string>('annual'); const value = React.useMemo( - () => ({ licensingModel, setLicensingModel }), - [licensingModel, setLicensingModel], + () => ({ licenseModel, setLicenseModel }), + [licenseModel, setLicenseModel], ); return <LicenseModel.Provider value={value}>{props.children}</LicenseModel.Provider>; } -export function useLicensingModel() { +export function useLicenseModel() { return React.useContext(LicenseModel); } diff --git a/docs/src/components/pricing/LicensingModelSwitch.tsx b/docs/src/components/pricing/LicenseModelSwitch.tsx similarity index 91% rename from docs/src/components/pricing/LicensingModelSwitch.tsx rename to docs/src/components/pricing/LicenseModelSwitch.tsx index 8e10672d7017d7..9ca62291573d83 100644 --- a/docs/src/components/pricing/LicensingModelSwitch.tsx +++ b/docs/src/components/pricing/LicenseModelSwitch.tsx @@ -4,7 +4,7 @@ import Box from '@mui/material/Box'; import Tooltip from '@mui/material/Tooltip'; import Tabs from '@mui/material/Tabs'; import Tab from '@mui/material/Tab'; -import { useLicensingModel } from 'docs/src/components/pricing/LicensingModelContext'; +import { useLicenseModel } from 'docs/src/components/pricing/LicenseModelContext'; const StyledTabs = styled(Tabs)(({ theme }) => ({ margin: '14px auto 4px', @@ -94,19 +94,19 @@ const tooltipProps = { }, }; -export default function LicensingModelSwitch() { - const { licensingModel, setLicensingModel } = useLicensingModel(); +export default function LicenseModelSwitch() { + const { licenseModel, setLicenseModel } = useLicenseModel(); const handleChange = (event: React.SyntheticEvent, newValue: number) => { - setLicensingModel(newValue); + setLicenseModel(newValue); }; return ( <Box sx={{ display: 'flex' }}> <StyledTabs - aria-label="licensing model" + aria-label="license model" selectionFollowsFocus - value={licensingModel} + value={licenseModel} onChange={handleChange} > <Tab diff --git a/docs/src/components/pricing/PricingFAQ.tsx b/docs/src/components/pricing/PricingFAQ.tsx index ccff1240d3f2c2..0a84733be3679c 100644 --- a/docs/src/components/pricing/PricingFAQ.tsx +++ b/docs/src/components/pricing/PricingFAQ.tsx @@ -82,17 +82,6 @@ const faqData = [ </React.Fragment> ), }, - { - summary: 'Why are you calling it "early access"?', - detail: ( - <React.Fragment> - We think you'll love the features we've built so far, but we're planning to release more. We - opened it up as soon as we had something useful so that you can start getting value from it - right away, and we'll be adding new features and components based on our own ideas, and on - suggestions from early access customers. - </React.Fragment> - ), - }, { summary: 'Do developers have to be named?', detail: ( diff --git a/docs/src/components/pricing/PricingList.tsx b/docs/src/components/pricing/PricingList.tsx index 6902bfe9e7309c..3db627f0ccf805 100644 --- a/docs/src/components/pricing/PricingList.tsx +++ b/docs/src/components/pricing/PricingList.tsx @@ -10,7 +10,7 @@ import Tab from '@mui/material/Tab'; import KeyboardArrowRightRounded from '@mui/icons-material/KeyboardArrowRightRounded'; import { Link } from '@mui/docs/Link'; import PricingTable, { PlanName, PlanPrice } from 'docs/src/components/pricing/PricingTable'; -import { useLicensingModel } from 'docs/src/components/pricing/LicensingModelContext'; +import { useLicenseModel } from 'docs/src/components/pricing/LicenseModelContext'; const Plan = React.forwardRef< HTMLDivElement, @@ -22,7 +22,7 @@ const Plan = React.forwardRef< >(function Plan({ plan, benefits, unavailable, sx, ...props }, ref) { const globalTheme = useTheme(); const mode = globalTheme.palette.mode; - const { licensingModel } = useLicensingModel(); + const { licenseModel } = useLicenseModel(); return ( <Paper @@ -54,11 +54,11 @@ const Plan = React.forwardRef< { community: '/material-ui/getting-started/usage/', pro: - licensingModel === 'annual' + licenseModel === 'annual' ? 'https://mui.com/store/items/mui-x-pro/' : 'https://mui.com/store/items/mui-x-pro-perpetual/', premium: - licensingModel === 'annual' + licenseModel === 'annual' ? 'https://mui.com/store/items/mui-x-premium/' : 'https://mui.com/store/items/mui-x-premium-perpetual/', }[plan] diff --git a/docs/src/components/pricing/PricingTable.tsx b/docs/src/components/pricing/PricingTable.tsx index c1b3712d9e46a7..83356b2a1860a6 100644 --- a/docs/src/components/pricing/PricingTable.tsx +++ b/docs/src/components/pricing/PricingTable.tsx @@ -10,13 +10,12 @@ import Tooltip from '@mui/material/Tooltip'; import InfoOutlinedIcon from '@mui/icons-material/InfoOutlined'; import { useRouter } from 'next/router'; import KeyboardArrowRightRounded from '@mui/icons-material/KeyboardArrowRightRounded'; -import OpenInNewRoundedIcon from '@mui/icons-material/OpenInNewRounded'; import LaunchRounded from '@mui/icons-material/LaunchRounded'; import UnfoldMoreRounded from '@mui/icons-material/UnfoldMoreRounded'; import { Link } from '@mui/docs/Link'; import IconImage from 'docs/src/components/icon/IconImage'; -import LicensingModelSwitch from 'docs/src/components/pricing/LicensingModelSwitch'; -import { useLicensingModel } from 'docs/src/components/pricing/LicensingModelContext'; +import LicenseModelSwitch from 'docs/src/components/pricing/LicenseModelSwitch'; +import { useLicenseModel } from 'docs/src/components/pricing/LicenseModelContext'; const planInfo = { community: { @@ -92,9 +91,9 @@ interface PlanPriceProps { export function PlanPrice(props: PlanPriceProps) { const { plan } = props; - const { licensingModel } = useLicensingModel(); - const annual = licensingModel === 'annual'; - const planPriceMinHeight = 64; + const { licenseModel } = useLicenseModel(); + const annual = licenseModel === 'annual'; + const planPriceMinHeight = 24; if (plan === 'community') { return ( @@ -103,7 +102,7 @@ export function PlanPrice(props: PlanPriceProps) { <Typography variant="h3" component="div" - sx={{ fontWeight: 'bold', color: 'success.600', mt: 4.5 }} + sx={{ fontWeight: 'bold', color: 'success.600', mt: 6 }} > $0 </Typography> @@ -136,7 +135,7 @@ export function PlanPrice(props: PlanPriceProps) { return ( <React.Fragment> - <LicensingModelSwitch /> + <LicenseModelSwitch /> <Box sx={{ display: 'flex', alignItems: 'center', justifyContent: 'center', mt: 1, mb: 4 }}> <Typography variant="h3" @@ -165,30 +164,12 @@ export function PlanPrice(props: PlanPriceProps) { {priceExplanation} </Typography> )} - - <Typography variant="body2" sx={{ color: 'text.secondary', textAlign: 'center' }}> - No extra fees for orders with over 10 devs  - <span> - <Tooltip title="Our pricing policies are changing. Read more on our blog."> - <Link href="/blog/mui-x-sep-2024-price-update/"> - by Aug 30 - <OpenInNewRoundedIcon sx={{ fontSize: '16px', ml: 0.5 }} /> - </Link> - </Tooltip> - </span> - . - </Typography> </Box> </React.Fragment> ); } // else Premium - - const originalPriceMultiplicator = monthlyDisplay ? 1 : 12; - const premiumOriginalValue = annual - ? 49 * originalPriceMultiplicator - : 49 * 3 * originalPriceMultiplicator; - const premiumMonthlyValue = annual ? 37 : 37 * 3; + const premiumMonthlyValue = annual ? 49 : 49 * 3; const premiumAnnualValue = premiumMonthlyValue * 12; const premiumDisplayedValue = monthlyDisplay ? premiumMonthlyValue : premiumAnnualValue; @@ -198,36 +179,8 @@ export function PlanPrice(props: PlanPriceProps) { return ( <React.Fragment> - <LicensingModelSwitch /> + <LicenseModelSwitch /> <Box sx={{ display: 'flex', alignItems: 'center', justifyContent: 'center', mt: 1, mb: 4 }}> - <Typography - variant="caption" - sx={[ - { - fontWeight: 'medium', - }, - (theme) => ({ - borderRadius: 0.5, - alignSelf: 'flex-end', - textDecoration: 'line-through', - py: 0.5, - px: 1, - mb: 0.5, - fontWeight: 'medium', - bgcolor: 'error.50', - color: 'error.500', - border: '1px solid', - borderColor: 'error.100', - ...theme.applyDarkStyles({ - color: 'error.300', - bgcolor: 'error.900', - borderColor: 'error.800', - }), - }), - ]} - > - {formatCurrency(premiumOriginalValue)} - </Typography> <Box sx={{ width: 10 }} /> <Typography variant="h3" component="div" sx={{ fontWeight: 'bold', color: 'primary.main' }}> {formatCurrency(premiumDisplayedValue)} @@ -252,18 +205,6 @@ export function PlanPrice(props: PlanPriceProps) { {priceExplanation} </Typography> )} - <Typography variant="body2" sx={{ color: 'text.secondary', textAlign: 'center' }}> - 🐦 Early Bird: <strong>25% off</strong> if ordered   - <span> - <Tooltip title="Our pricing policies are changing. Read more on our blog."> - <Link href="/blog/mui-x-sep-2024-price-update/"> - by Aug 30 - <OpenInNewRoundedIcon sx={{ fontSize: '16px', ml: 0.5 }} />{' '} - </Link> - </Tooltip> - </span> - . - </Typography> </Box> </React.Fragment> ); @@ -508,7 +449,7 @@ const rowHeaders: Record<string, React.ReactNode> = { <ColumnHead label="Column autosizing" href="/x/react-data-grid/column-dimensions/#autosizing" /> ), 'data-grid/column-reorder': ( - <ColumnHead label="Column reorder" href="/x/react-data-grid/column-ordering/" /> + <ColumnHead label="Column ordering" href="/x/react-data-grid/column-ordering/" /> ), 'data-grid/column-pinning': ( <ColumnHead label="Column pinning" href="/x/react-data-grid/column-pinning/" /> @@ -635,8 +576,8 @@ const rowHeaders: Record<string, React.ReactNode> = { 'charts/pie': <ColumnHead label="Pie chart" href="/x/react-charts/pie/" />, 'charts/sparkline': <ColumnHead label="Sparkline" href="/x/react-charts/sparkline/" />, 'charts/gauge': <ColumnHead label="Gauge" href="/x/react-charts/gauge/" />, - 'charts/treemap': <ColumnHead label="Treemap" href="/x/react-charts/treemap/" />, 'charts/heatmap': <ColumnHead label="Heatmap" href="/x/react-charts/heatmap/" />, + 'charts/treemap': <ColumnHead label="Treemap" href="/x/react-charts/treemap/" />, 'charts/radar': <ColumnHead label="Radar" href="/x/react-charts/radar/" />, 'charts/funnel': <ColumnHead label="Funnel" href="/x/react-charts/funnel/" />, 'charts/sankey': <ColumnHead label="Sankey" href="/x/react-charts/sankey/" />, @@ -647,7 +588,7 @@ const rowHeaders: Record<string, React.ReactNode> = { // charts - features 'charts/legend': <ColumnHead label="Legend" href="/x/react-charts/legend/" />, 'charts/tooltip': <ColumnHead label="Tooltip" href="/x/react-charts/tooltip/" />, - 'charts/mouse-zoom': <ColumnHead label="Zoom on mouse" />, + 'charts/zoom-and-pan': <ColumnHead label="Zoom and Pan" href="/x/react-charts/zoom-and-pan/" />, 'charts/export': <ColumnHead label="Export" />, // charts - datagrid 'charts/cell-with-charts': ( @@ -655,7 +596,35 @@ const rowHeaders: Record<string, React.ReactNode> = { ), 'charts/filter-interaction': <ColumnHead label="Row filtering" />, 'charts/selection-interaction': <ColumnHead label="Range selection" />, - 'tree-view/tree-view': <ColumnHead label="Tree View" href="/x/react-tree-view/" />, + // Treeview - components + 'tree-view/simple-tree-view': ( + <ColumnHead label="Simple Tree View" href="/x/react-tree-view/simple-tree-view/items/" /> + ), + 'tree-view/rich-tree-view': ( + <ColumnHead label="Rich Tree View" href="/x/react-tree-view/rich-tree-view/items/" /> + ), + + // Treeview - advanced features + 'tree-view/selection': ( + <ColumnHead + label="Item Selection" + href="/x/react-tree-view/simple-tree-view/selection/#single-selection" + /> + ), + 'tree-view/multi-selection': ( + <ColumnHead + label="Multi Selection" + href="/x/react-tree-view/simple-tree-view/selection/#multi-selection" + /> + ), + 'tree-view/inline-editing': ( + <ColumnHead label="Inline label editing" href="/x/react-tree-view/rich-tree-view/editing/" /> + ), + 'tree-view/drag-to-reorder': ( + <ColumnHead label="Drag to reorder" href="/x/react-tree-view/rich-tree-view/ordering/" /> + ), + 'tree-view/virtualization': <ColumnHead label="Virtualization" />, + 'mui-x-production': <ColumnHead label="Perpetual use in production" />, 'mui-x-development': <ColumnHead label="Development license" tooltip="For active development" />, 'mui-x-development-perpetual': ( @@ -809,8 +778,8 @@ const communityData: Record<string, React.ReactNode> = { 'charts/pie': yes, 'charts/sparkline': yes, 'charts/gauge': yes, - 'charts/treemap': pending, 'charts/heatmap': no, + 'charts/treemap': pending, 'charts/radar': pending, 'charts/funnel': no, 'charts/sankey': no, @@ -821,14 +790,20 @@ const communityData: Record<string, React.ReactNode> = { // charts - features 'charts/legend': yes, 'charts/tooltip': yes, - 'charts/mouse-zoom': no, + 'charts/zoom-and-pan': no, 'charts/export': no, // charts - datagrid 'charts/cell-with-charts': yes, 'charts/filter-interaction': no, 'charts/selection-interaction': no, // Tree View - 'tree-view/tree-view': yes, + 'tree-view/simple-tree-view': yes, + 'tree-view/rich-tree-view': yes, + 'tree-view/selection': yes, + 'tree-view/multi-selection': yes, + 'tree-view/inline-editing': yes, + 'tree-view/drag-to-reorder': no, + 'tree-view/virtualization': no, // general 'mui-x-production': yes, 'mui-x-updates': yes, @@ -906,8 +881,9 @@ const proData: Record<string, React.ReactNode> = { 'charts/pie': yes, 'charts/sparkline': yes, 'charts/gauge': yes, + 'charts/heatmap': yes, 'charts/treemap': pending, - 'charts/heatmap': pending, + 'charts/radar': pending, 'charts/funnel': pending, 'charts/sankey': pending, @@ -918,14 +894,20 @@ const proData: Record<string, React.ReactNode> = { // charts - features 'charts/legend': yes, 'charts/tooltip': yes, - 'charts/mouse-zoom': pending, + 'charts/zoom-and-pan': yes, 'charts/export': pending, // charts - datagrid 'charts/cell-with-charts': yes, 'charts/filter-interaction': pending, 'charts/selection-interaction': no, // Tree View - 'tree-view/tree-view': yes, + 'tree-view/simple-tree-view': yes, + 'tree-view/rich-tree-view': yes, + 'tree-view/selection': yes, + 'tree-view/multi-selection': yes, + 'tree-view/inline-editing': yes, + 'tree-view/drag-to-reorder': yes, + 'tree-view/virtualization': pending, // general 'mui-x-production': yes, 'mui-x-development': <Info value="1 year" />, @@ -939,12 +921,7 @@ const proData: Record<string, React.ReactNode> = { 'response-time': no, 'pre-screening': no, 'issue-escalation': no, - 'security-questionnaire': ( - <Info - value="Available from 10+ devs" - metadata={'Not available under the "Capped at 10 licenses" policy'} - /> - ), + 'security-questionnaire': <Info value="Available from 10+ devs" />, }; const premiumData: Record<string, React.ReactNode> = { @@ -1008,8 +985,8 @@ const premiumData: Record<string, React.ReactNode> = { 'charts/pie': yes, 'charts/sparkline': yes, 'charts/gauge': yes, + 'charts/heatmap': yes, 'charts/treemap': pending, - 'charts/heatmap': pending, 'charts/radar': pending, 'charts/funnel': pending, 'charts/sankey': pending, @@ -1020,14 +997,20 @@ const premiumData: Record<string, React.ReactNode> = { // charts - features 'charts/legend': yes, 'charts/tooltip': yes, - 'charts/mouse-zoom': pending, + 'charts/zoom-and-pan': yes, 'charts/export': pending, // charts - datagrid 'charts/cell-with-charts': yes, 'charts/filter-interaction': pending, 'charts/selection-interaction': pending, // Tree View - 'tree-view/tree-view': yes, + 'tree-view/simple-tree-view': yes, + 'tree-view/rich-tree-view': yes, + 'tree-view/selection': yes, + 'tree-view/multi-selection': yes, + 'tree-view/inline-editing': yes, + 'tree-view/drag-to-reorder': yes, + 'tree-view/virtualization': pending, // general 'mui-x-production': yes, 'mui-x-development': <Info value="1 year" />, @@ -1196,22 +1179,22 @@ function renderMasterRow(key: string, gridSx: object, plans: Array<any>) { function PricingTableDevelopment(props: any) { const { renderRow } = props; - const { licensingModel } = useLicensingModel(); + const { licenseModel } = useLicenseModel(); - return licensingModel === 'annual' + return licenseModel === 'annual' ? renderRow('mui-x-development') : renderRow('mui-x-development-perpetual'); } function PricingTableBuyPro() { - const { licensingModel } = useLicensingModel(); + const { licenseModel } = useLicenseModel(); return ( <Button component={Link} noLinkStyle href={ - licensingModel === 'annual' + licenseModel === 'annual' ? 'https://mui.com/store/items/mui-x-pro/' : 'https://mui.com/store/items/mui-x-pro-perpetual/' } @@ -1225,14 +1208,14 @@ function PricingTableBuyPro() { } function PricingTableBuyPremium() { - const { licensingModel } = useLicensingModel(); + const { licenseModel } = useLicenseModel(); return ( <Button component={Link} noLinkStyle href={ - licensingModel === 'annual' + licenseModel === 'annual' ? 'https://mui.com/store/items/mui-x-premium/' : 'https://mui.com/store/items/mui-x-premium-perpetual/' } @@ -1273,11 +1256,13 @@ export default function PricingTable({ const router = useRouter(); const [dataGridCollapsed, setDataGridCollapsed] = React.useState(false); const [chartsCollapsed, setChartsCollapsed] = React.useState(false); + const [treeViewCollapsed, setTreeViewCollapsed] = React.useState(false); React.useEffect(() => { if (router.query['expand-path'] === 'all') { setDataGridCollapsed(true); setChartsCollapsed(true); + setTreeViewCollapsed(true); } }, [router.query]); @@ -1311,6 +1296,12 @@ export default function PricingTable({ sx={{ color: 'grey.600', opacity: chartsCollapsed ? 0 : 1 }} /> ); + const treeViewUnfoldMore = ( + <UnfoldMoreRounded + fontSize="small" + sx={{ color: 'grey.600', opacity: treeViewCollapsed ? 0 : 1 }} + /> + ); const renderRow = (key: string) => renderMasterRow(key, gridSx, plans); const renderNestedRow = (key: string) => renderMasterRow(key, nestedGridSx, plans); @@ -1584,12 +1575,12 @@ export default function PricingTable({ {divider} {renderNestedRow('charts/gauge')} {divider} + {renderNestedRow('charts/heatmap')} + {divider} {renderNestedRow('charts/treemap')} {divider} {renderNestedRow('charts/radar')} {divider} - {renderNestedRow('charts/heatmap')} - {divider} {renderNestedRow('charts/funnel')} {divider} {renderNestedRow('charts/sankey')} @@ -1607,7 +1598,7 @@ export default function PricingTable({ {divider} {renderNestedRow('charts/tooltip')} {divider} - {renderNestedRow('charts/mouse-zoom')} + {renderNestedRow('charts/zoom-and-pan')} {divider} {renderNestedRow('charts/export')} {divider} @@ -1619,7 +1610,80 @@ export default function PricingTable({ {renderNestedRow('charts/selection-interaction')} </StyledCollapse> {divider} - {renderRow('tree-view/tree-view')} + <Box + sx={{ + position: 'relative', + minHeight: 58, + '& svg': { transition: '0.3s' }, + '&:hover svg': { color: 'primary.main' }, + ...gridSx, + }} + > + <Cell /> + <Cell sx={{ minHeight: 60 }}>{treeViewUnfoldMore}</Cell> + <Cell highlighted sx={{ display: { xs: 'none', md: 'flex' }, minHeight: 60 }}> + {treeViewUnfoldMore} + </Cell> + <Cell sx={{ display: { xs: 'none', md: 'flex' }, minHeight: 60 }}> + {treeViewUnfoldMore} + </Cell> + <Button + fullWidth + onClick={() => setTreeViewCollapsed((bool) => !bool)} + endIcon={ + <KeyboardArrowRightRounded + color="primary" + sx={{ transform: treeViewCollapsed ? 'rotate(-90deg)' : 'rotate(90deg)' }} + /> + } + sx={[ + (theme) => ({ + px: 1, + justifyContent: 'flex-start', + fontSize: '0.875rem', + fontWeight: 'medium', + borderRadius: '0px', + position: 'absolute', + left: 0, + top: 0, + width: '100%', + height: '100%', + '&:hover': { + bgcolor: alpha(theme.palette.primary.main, 0.06), + '@media (hover: none)': { + bgcolor: 'initial', + }, + }, + }), + (theme) => + theme.applyDarkStyles({ + '&:hover': { + bgcolor: alpha(theme.palette.primary.main, 0.06), + }, + }), + ]} + > + TreeView + </Button> + </Box> + <StyledCollapse in={treeViewCollapsed} timeout={700}> + <RowCategory>Components</RowCategory> + {renderNestedRow('tree-view/simple-tree-view')} + {divider} + {renderNestedRow('tree-view/rich-tree-view')} + {divider} + <RowCategory>Advanced features</RowCategory> + {renderNestedRow('tree-view/selection')} + {divider} + {renderNestedRow('tree-view/multi-selection')} + {divider} + {renderNestedRow('tree-view/inline-editing')} + {divider} + {renderNestedRow('tree-view/drag-to-reorder')} + {divider} + {renderNestedRow('tree-view/virtualization')} + {divider} + </StyledCollapse> {divider} {renderRow('mui-x-production')} {divider} diff --git a/docs/src/components/pricing/PricingWhatToExpect.tsx b/docs/src/components/pricing/PricingWhatToExpect.tsx index fbb5668b3544c4..843e6c53eee259 100644 --- a/docs/src/components/pricing/PricingWhatToExpect.tsx +++ b/docs/src/components/pricing/PricingWhatToExpect.tsx @@ -180,12 +180,8 @@ export default function PricingWhatToExpect() { </Typography> </Box> <Typography variant="body2" sx={{ color: 'text.secondary' }}> - The Pro plan is capped at 10 developers licensed; you do not need to pay for additional - licenses for more than 10 developers. - <br /> - <br /> - You can contact <Link href="mailto:sales@mui.com">sales</Link> for a volume discount - when licensing over 25 developers under the Premium plan. + Have a team of 25 or more developers? Get in touch with our{' '} + <Link href="mailto:sales@mui.com">sales team</Link> for a volume discount. </Typography> </Paper> </Box> diff --git a/docs/src/components/productMaterial/MaterialStyling.tsx b/docs/src/components/productMaterial/MaterialStyling.tsx index fb1b0492176f27..1e3097b9b34afd 100644 --- a/docs/src/components/productMaterial/MaterialStyling.tsx +++ b/docs/src/components/productMaterial/MaterialStyling.tsx @@ -15,6 +15,7 @@ import Highlighter from 'docs/src/components/action/Highlighter'; import Frame from 'docs/src/components/action/Frame'; import RealEstateCard from 'docs/src/components/showcase/RealEstateCard'; import FlashCode from 'docs/src/components/animation/FlashCode'; +import useResizeHandle from 'docs/src/modules/utils/useResizeHandle'; const code = ` <Card @@ -63,78 +64,6 @@ const startLine = [27, 15, 12]; const endLine = [37, 20, 12]; const scrollTo = [27, 10, 4]; -export const useResizeHandle = ( - target: React.RefObject<HTMLDivElement | null>, - options?: { minWidth?: string; maxWidth?: string }, -) => { - const { minWidth = '0px', maxWidth = '100%' } = options || {}; - const [dragging, setDragging] = React.useState(false); - const [dragOffset, setDragOffset] = React.useState(0); - const isTouchEvent = (event: MouseEvent | TouchEvent): event is TouchEvent => { - return Boolean((event as TouchEvent).touches && (event as TouchEvent).touches.length); - }; - const isMouseEvent = (event: MouseEvent | TouchEvent): event is MouseEvent => { - return Boolean((event as MouseEvent).clientX || (event as MouseEvent).clientX === 0); - }; - const getClientX = React.useCallback((event: MouseEvent | TouchEvent) => { - let clientX; - if (isMouseEvent(event)) { - clientX = event.clientX; - } - if (isTouchEvent(event)) { - clientX = event.touches[0].clientX; - } - return clientX as number; - }, []); - const handleStart = (event: React.MouseEvent | React.TouchEvent) => { - const clientX = getClientX(event.nativeEvent); - const rect = (event.target as HTMLElement).getBoundingClientRect(); - setDragging(true); - setDragOffset(rect.width - (clientX - rect.x)); - }; - React.useEffect(() => { - function resizeObject(event: MouseEvent | TouchEvent) { - if (event.cancelable) { - event.preventDefault(); - } - const clientX = getClientX(event); - - if (target.current && dragging && clientX) { - const objectRect = target.current.getBoundingClientRect(); - const newWidth = clientX - objectRect.left + dragOffset; - target.current.style.setProperty( - 'width', - `clamp(${minWidth}, ${Math.floor(newWidth)}px, ${maxWidth})`, - ); - } - } - function stopResize() { - setDragging(false); - } - - if (dragging) { - document.addEventListener('mousemove', resizeObject, { passive: false }); - document.addEventListener('mouseup', stopResize); - document.addEventListener('touchmove', resizeObject, { passive: false }); - document.addEventListener('touchend', stopResize); - return () => { - document.removeEventListener('mousemove', resizeObject); - document.removeEventListener('mouseup', stopResize); - document.removeEventListener('touchmove', resizeObject); - document.removeEventListener('touchend', stopResize); - }; - } - return () => {}; - }, [dragOffset, dragging, getClientX, maxWidth, minWidth, target]); - return { - dragging, - getDragHandlers: () => ({ - onTouchStart: handleStart, - onMouseDown: handleStart, - }), - }; -}; - export default function MaterialStyling() { const [index, setIndex] = React.useState(0); const objectRef = React.useRef<HTMLDivElement | null>(null); diff --git a/docs/src/components/productX/XDateRangeDemo.tsx b/docs/src/components/productX/XDateRangeDemo.tsx index 8738087b6c6646..a1ccba8aa0ed72 100644 --- a/docs/src/components/productX/XDateRangeDemo.tsx +++ b/docs/src/components/productX/XDateRangeDemo.tsx @@ -7,25 +7,25 @@ import List from '@mui/material/List'; import ListItem from '@mui/material/ListItem'; import { StaticDateRangePicker } from '@mui/x-date-pickers-pro/StaticDateRangePicker'; import { PickersShortcutsItem, PickersShortcutsProps, DateRange } from '@mui/x-date-pickers-pro'; -import { AdapterDateFns } from '@mui/x-date-pickers/AdapterDateFns'; +import { AdapterDayjs } from '@mui/x-date-pickers/AdapterDayjs'; import { LocalizationProvider } from '@mui/x-date-pickers/LocalizationProvider'; import { HighlightedCode } from '@mui/docs/HighlightedCode'; -import { startOfWeek, endOfWeek, subDays } from 'date-fns'; +import dayjs, { Dayjs } from 'dayjs'; import Frame from 'docs/src/components/action/Frame'; -const startDate = new Date(); -startDate.setDate(10); -const endDate = new Date(); -endDate.setDate(endDate.getDate() + 28); +const startDate = dayjs(); +startDate.date(10); +const endDate = dayjs(); +endDate.date(endDate.date() + 28); -function CustomRangeShortcuts(props: PickersShortcutsProps<DateRange<Date>>) { +function CustomRangeShortcuts(props: PickersShortcutsProps<DateRange<Dayjs>>) { const { items, onChange, isValid, changeImportance = 'accept' } = props; if (items == null || items.length === 0) { return null; } - const resolvedItems = items.map((item: PickersShortcutsItem<DateRange<Date>>) => { + const resolvedItems = items.map((item: PickersShortcutsItem<DateRange<Dayjs>>) => { const newValue = item.getValue({ isValid }); return { @@ -80,25 +80,25 @@ const code = ` </LocalizationProvider>`; export default function XDateRangeDemo() { - const today = new Date(); - const shortcutsItems: PickersShortcutsItem<DateRange<Date>>[] = [ + const today = dayjs(); + const shortcutsItems: PickersShortcutsItem<DateRange<Dayjs>>[] = [ { label: 'This Week', getValue: () => { - return [startOfWeek(today), endOfWeek(today)]; + return [today.startOf('week'), today.endOf('week')]; }, }, { label: 'Last Week', getValue: () => { - const prevWeek = subDays(today, 7); - return [startOfWeek(prevWeek), endOfWeek(prevWeek)]; + const prevWeek = today.add(-7, 'days'); + return [prevWeek.startOf('week'), prevWeek.endOf('week')]; }, }, { label: 'Last 7 Days', getValue: () => { - return [subDays(today, 7), today]; + return [today.add(-7, 'days'), today]; }, }, { label: 'Reset', getValue: () => [null, null] }, @@ -164,7 +164,7 @@ export default function XDateRangeDemo() { }), ]} > - <LocalizationProvider dateAdapter={AdapterDateFns}> + <LocalizationProvider dateAdapter={AdapterDayjs}> <StaticDateRangePicker displayStaticWrapperAs="desktop" value={[startDate, endDate]} diff --git a/docs/src/components/productX/XHero.tsx b/docs/src/components/productX/XHero.tsx index 18a6aee0beb616..bbab74cb44b529 100644 --- a/docs/src/components/productX/XHero.tsx +++ b/docs/src/components/productX/XHero.tsx @@ -5,7 +5,7 @@ import Divider from '@mui/material/Divider'; import Paper from '@mui/material/Paper'; import Typography from '@mui/material/Typography'; import { StaticDateRangePicker } from '@mui/x-date-pickers-pro/StaticDateRangePicker'; -import { AdapterDateFns } from '@mui/x-date-pickers/AdapterDateFns'; +import { AdapterDayjs } from '@mui/x-date-pickers/AdapterDayjs'; import { LocalizationProvider } from '@mui/x-date-pickers/LocalizationProvider'; import { alpha } from '@mui/material/styles'; import { @@ -20,11 +20,12 @@ import HeroContainer from 'docs/src/layouts/HeroContainer'; import IconImage from 'docs/src/components/icon/IconImage'; import FolderTreeView from 'docs/src/components/showcase/FolderTreeView'; import ROUTES from 'docs/src/route'; +import dayjs from 'dayjs'; -const startDate = new Date(); -startDate.setDate(10); -const endDate = new Date(); -endDate.setDate(endDate.getDate() + 28); +const startDate = dayjs(); +startDate.date(10); +const endDate = dayjs(); +endDate.date(endDate.date() + 28); const visibleFields = [ 'commodity', @@ -345,7 +346,7 @@ export default function XHero() { }), ]} > - <LocalizationProvider dateAdapter={AdapterDateFns}> + <LocalizationProvider dateAdapter={AdapterDayjs}> <StaticDateRangePicker displayStaticWrapperAs="desktop" value={[startDate, endDate]} diff --git a/docs/src/components/showcase/ThemeDatePicker.tsx b/docs/src/components/showcase/ThemeDatePicker.tsx index 822ce3b5c4f0a4..943d47c946e368 100644 --- a/docs/src/components/showcase/ThemeDatePicker.tsx +++ b/docs/src/components/showcase/ThemeDatePicker.tsx @@ -3,13 +3,13 @@ import { alpha } from '@mui/material/styles'; import Box from '@mui/material/Box'; import Fade from '@mui/material/Fade'; import { iconButtonClasses } from '@mui/material/IconButton'; -import { AdapterDateFns } from '@mui/x-date-pickers/AdapterDateFns'; +import { AdapterDayjs } from '@mui/x-date-pickers/AdapterDayjs'; import { LocalizationProvider } from '@mui/x-date-pickers/LocalizationProvider'; import { StaticDatePicker } from '@mui/x-date-pickers/StaticDatePicker'; export default function ThemeDatePicker() { return ( - <LocalizationProvider dateAdapter={AdapterDateFns}> + <LocalizationProvider dateAdapter={AdapterDayjs}> <Fade in timeout={700}> <Box sx={[ diff --git a/docs/src/modules/components/ApiPage.tsx b/docs/src/modules/components/ApiPage.tsx index d3aab5ed9d85ba..19ec201baa713d 100644 --- a/docs/src/modules/components/ApiPage.tsx +++ b/docs/src/modules/components/ApiPage.tsx @@ -47,7 +47,8 @@ type ApiHeaderKeys = | 'inheritance' | 'slots' | 'classes' - | 'css'; + | 'css' + | 'source-code'; export function getTranslatedHeader(t: Translate, header: ApiHeaderKeys) { const translations = { @@ -59,6 +60,7 @@ export function getTranslatedHeader(t: Translate, header: ApiHeaderKeys) { slots: t('api-docs.slots'), classes: t('api-docs.classes'), css: t('api-docs.css'), + 'source-code': t('api-docs.source-code'), }; // TODO Drop runtime type-checking once we type-check this file @@ -202,7 +204,8 @@ export default function ApiPage(props: ApiPageProps) { getPropertiesToC({ properties: propertiesDef, hash: 'props', t }), ...(componentSlots?.length > 0 ? [createTocEntry('slots')] : []), ...getClassesToC({ classes: classesDef, t }), - ].filter(Boolean); + pageContent.filename ? createTocEntry('source-code') : null, + ].filter((item): item is TableOfContentsParams => Boolean(item)); // The `ref` is forwarded to the root element. let refHint = t('api-docs.refRootElement'); @@ -360,6 +363,16 @@ export default function ApiPage(props: ApiPageProps) { layoutStorageKey={layoutStorageKey.classes} displayClassKeys /> + + <Heading hash="source-code" level="h2" /> + <p + dangerouslySetInnerHTML={{ + __html: t('api-docs.seeSourceCode').replace( + '{{href}}', + `${process.env.SOURCE_CODE_REPO}/blob/v${process.env.LIB_VERSION}${pageContent.filename}`, + ), + }} + /> </MarkdownElement> <svg style={{ display: 'none' }} xmlns="http://www.w3.org/2000/svg"> <symbol id="anchor-link-icon" viewBox="0 0 12 6"> diff --git a/docs/src/modules/components/AppLayoutDocs.js b/docs/src/modules/components/AppLayoutDocs.js index 5b700a3b49443e..3fb9527b407dae 100644 --- a/docs/src/modules/components/AppLayoutDocs.js +++ b/docs/src/modules/components/AppLayoutDocs.js @@ -167,9 +167,9 @@ export default function AppLayoutDocs(props) { <AppLayoutDocsFooter tableOfContents={toc} location={location} /> </StyledAppContainer> {disableToc ? null : <AppTableOfContents toc={toc} />} + <BackToTop /> </Main> </AdManager> - <BackToTop /> </Layout> ); } diff --git a/docs/src/modules/components/AppLayoutDocsFooter.js b/docs/src/modules/components/AppLayoutDocsFooter.js index b718f527b0cf26..0fbe5d6e73a51f 100644 --- a/docs/src/modules/components/AppLayoutDocsFooter.js +++ b/docs/src/modules/components/AppLayoutDocsFooter.js @@ -81,7 +81,7 @@ function orderedPages(pages, current = []) { } async function postFeedback(data) { - const env = window.location.host.includes('mui.com') ? 'prod' : 'dev'; + const env = process.env.DEPLOY_ENV === 'production' ? 'prod' : 'dev'; try { const response = await fetch(`${process.env.FEEDBACK_URL}/${env}/feedback`, { method: 'POST', diff --git a/docs/src/modules/components/AppSearch.js b/docs/src/modules/components/AppSearch.js index 2c2dcd6303968a..3cb6aa1ad1d01b 100644 --- a/docs/src/modules/components/AppSearch.js +++ b/docs/src/modules/components/AppSearch.js @@ -459,7 +459,6 @@ export default function AppSearch(props) { 'hierarchy.lvl3', 'hierarchy.lvl4', 'hierarchy.lvl5', - 'hierarchy.lvl6', 'content', 'type', 'url', diff --git a/docs/src/modules/components/MaterialUIExampleCollection.js b/docs/src/modules/components/MaterialUIExampleCollection.js index 064f2f22912eaa..e30d49e68a5eca 100644 --- a/docs/src/modules/components/MaterialUIExampleCollection.js +++ b/docs/src/modules/components/MaterialUIExampleCollection.js @@ -14,78 +14,78 @@ const examples = [ name: 'Next.js App Router', label: 'View JavaScript', tsLabel: 'View TypeScript', - link: 'https://github.com/mui/material-ui/tree/next/examples/material-ui-nextjs', - tsLink: 'https://github.com/mui/material-ui/tree/next/examples/material-ui-nextjs-ts', + link: 'https://github.com/mui/material-ui/tree/master/examples/material-ui-nextjs', + tsLink: 'https://github.com/mui/material-ui/tree/master/examples/material-ui-nextjs-ts', src: '/static/images/examples/next.svg', }, { name: 'Next.js Pages Router', label: 'View JavaScript', tsLabel: 'View TypeScript', - link: 'https://github.com/mui/material-ui/tree/next/examples/material-ui-nextjs-pages-router', + link: 'https://github.com/mui/material-ui/tree/master/examples/material-ui-nextjs-pages-router', tsLink: - 'https://github.com/mui/material-ui/tree/next/examples/material-ui-nextjs-pages-router-ts', + 'https://github.com/mui/material-ui/tree/master/examples/material-ui-nextjs-pages-router-ts', src: '/static/images/examples/next.svg', }, { name: 'Vite.js', label: 'View JavaScript', tsLabel: 'View TypeScript', - link: 'https://github.com/mui/material-ui/tree/next/examples/material-ui-vite', - tsLink: 'https://github.com/mui/material-ui/tree/next/examples/material-ui-vite-ts', + link: 'https://github.com/mui/material-ui/tree/master/examples/material-ui-vite', + tsLink: 'https://github.com/mui/material-ui/tree/master/examples/material-ui-vite-ts', src: '/static/images/examples/vite.svg', }, { name: 'Remix', label: 'View TypeScript', - link: 'https://github.com/mui/material-ui/tree/next/examples/material-ui-remix-ts', + link: 'https://github.com/mui/material-ui/tree/master/examples/material-ui-remix-ts', src: '/static/images/examples/remix.svg', }, { name: 'Create React App', label: 'View JavaScript', tsLabel: 'View TypeScript', - link: 'https://github.com/mui/material-ui/tree/next/examples/material-ui-cra', - tsLink: 'https://github.com/mui/material-ui/tree/next/examples/material-ui-cra-ts', + link: 'https://github.com/mui/material-ui/tree/master/examples/material-ui-cra', + tsLink: 'https://github.com/mui/material-ui/tree/master/examples/material-ui-cra-ts', src: '/static/images/examples/cra.svg', }, { name: 'Tailwind CSS + Create React App', label: 'View TypeScript', - link: 'https://github.com/mui/material-ui/tree/next/examples/material-ui-cra-tailwind-ts', + link: 'https://github.com/mui/material-ui/tree/master/examples/material-ui-cra-tailwind-ts', src: '/static/images/examples/tailwindcss.svg', }, { name: 'styled-components', label: 'View JavaScript', tsLabel: 'View TypeScript', - link: 'https://github.com/mui/material-ui/tree/next/examples/material-ui-cra-styled-components', + link: 'https://github.com/mui/material-ui/tree/master/examples/material-ui-cra-styled-components', tsLink: - 'https://github.com/mui/material-ui/tree/next/examples/material-ui-cra-styled-components-ts', + 'https://github.com/mui/material-ui/tree/master/examples/material-ui-cra-styled-components-ts', src: '/static/images/examples/styled.png', }, { name: 'Preact', label: 'View JavaScript', - link: 'https://github.com/mui/material-ui/tree/next/examples/material-ui-preact', + link: 'https://github.com/mui/material-ui/tree/master/examples/material-ui-preact', src: '/static/images/examples/preact.svg', }, { name: 'CDN', label: 'View JavaScript', - link: 'https://github.com/mui/material-ui/tree/next/examples/material-ui-via-cdn', + link: 'https://github.com/mui/material-ui/tree/master/examples/material-ui-via-cdn', src: <CloudRoundedIcon />, }, { name: 'Express.js (server-rendered)', label: 'View JavaScript', - link: 'https://github.com/mui/material-ui/tree/next/examples/material-ui-express-ssr', + link: 'https://github.com/mui/material-ui/tree/master/examples/material-ui-express-ssr', src: '/static/images/examples/express.png', }, { name: 'Gatsby', label: 'View JavaScript', - link: 'https://github.com/mui/material-ui/tree/next/examples/material-ui-gatsby', + link: 'https://github.com/mui/material-ui/tree/master/examples/material-ui-gatsby', src: '/static/images/examples/gatsby.svg', }, { diff --git a/docs/src/modules/components/TopLayoutBlog.js b/docs/src/modules/components/TopLayoutBlog.js index 98a1490bf8a80a..6d52bc023e361d 100644 --- a/docs/src/modules/components/TopLayoutBlog.js +++ b/docs/src/modules/components/TopLayoutBlog.js @@ -126,6 +126,21 @@ export const authors = { avatar: 'https://avatars.githubusercontent.com/u/717550?', github: 'brijeshb42', }, + aarongarciah: { + name: 'Aarón García', + avatar: 'https://avatars.githubusercontent.com/u/7225802?', + github: 'aarongarciah', + }, + zanivan: { + name: 'Victor Zanivan Monteiro', + avatar: 'https://avatars.githubusercontent.com/u/37222944?', + github: 'zanivan', + }, + romgrk: { + name: 'Romain Gregoire', + avatar: 'https://avatars.githubusercontent.com/u/1423607', + github: 'romgrk', + }, }; const classes = { diff --git a/docs/src/modules/sandbox/CodeSandbox.test.js b/docs/src/modules/sandbox/CodeSandbox.test.js index 16249c8dc4500c..16f745b352da2a 100644 --- a/docs/src/modules/sandbox/CodeSandbox.test.js +++ b/docs/src/modules/sandbox/CodeSandbox.test.js @@ -33,7 +33,7 @@ describe('CodeSandbox', () => { 'https://github.com/mui/material-ui/blob/v5.7.0/docs/data/material/components/buttons/BasicButtons.js', dependencies: { react: 'latest', - '@mui/material': 'next', + '@mui/material': 'latest', 'react-dom': 'latest', '@emotion/react': 'latest', '@emotion/styled': 'latest', @@ -123,7 +123,7 @@ ReactDOM.createRoot(document.querySelector("#root")).render( 'https://github.com/mui/material-ui/blob/v5.7.0/docs/data/material/components/buttons/BasicButtons.tsx', dependencies: { react: 'latest', - '@mui/material': 'next', + '@mui/material': 'latest', 'react-dom': 'latest', '@emotion/react': 'latest', '@emotion/styled': 'latest', @@ -230,7 +230,7 @@ ReactDOM.createRoot(document.querySelector("#root")!).render( expect(result.dependencies).to.deep.equal({ '@emotion/react': 'latest', '@emotion/styled': 'latest', - '@mui/material': 'next', + '@mui/material': 'latest', '@types/react': 'latest', '@types/react-dom': 'latest', react: 'latest', diff --git a/docs/src/modules/sandbox/CodeSandbox.ts b/docs/src/modules/sandbox/CodeSandbox.ts index e772341afedc15..3db3f2b12bf63e 100644 --- a/docs/src/modules/sandbox/CodeSandbox.ts +++ b/docs/src/modules/sandbox/CodeSandbox.ts @@ -24,10 +24,11 @@ function openSandbox({ files, codeVariant, initialFile }: any) { form.target = '_blank'; form.action = 'https://codesandbox.io/api/v1/sandboxes/define'; addHiddenInput(form, 'parameters', parameters); + addHiddenInput(form, 'embed', '1'); addHiddenInput( form, 'query', - `file=${initialFile}${initialFile.match(/(\.tsx|\.ts|\.js)$/) ? '' : extension}`, + `module=${initialFile}${initialFile.match(/(\.tsx|\.ts|\.js)$/) ? '' : extension}`, ); document.body.appendChild(form); form.submit(); diff --git a/docs/src/modules/sandbox/Dependencies.test.js b/docs/src/modules/sandbox/Dependencies.test.js index 94eca04aab7ac6..71b4f6b1cba69b 100644 --- a/docs/src/modules/sandbox/Dependencies.test.js +++ b/docs/src/modules/sandbox/Dependencies.test.js @@ -40,8 +40,8 @@ const styles = theme => ({ '@emotion/react': 'latest', '@emotion/styled': 'latest', '@foo-bar/bip': 'latest', - '@mui/material': 'next', - '@mui/base': 'next', + '@mui/material': 'latest', + '@mui/base': 'latest', 'prop-types': 'latest', }); }); @@ -71,7 +71,7 @@ const suggestions = [ 'react-dom': 'latest', '@emotion/react': 'latest', '@emotion/styled': 'latest', - '@mui/material': 'next', + '@mui/material': 'latest', '@unexisting/thing': 'latest', 'autosuggest-highlight': 'latest', 'prop-types': 'latest', @@ -100,8 +100,8 @@ import { LocalizationProvider as MuiPickersLocalizationProvider, KeyboardTimePic 'prop-types': 'latest', '@emotion/react': 'latest', '@emotion/styled': 'latest', - '@mui/material': 'next', - '@mui/lab': 'next', + '@mui/material': 'latest', + '@mui/lab': 'latest', }); }); @@ -127,8 +127,8 @@ import 'exceljs'; 'prop-types': 'latest', '@emotion/react': 'latest', '@emotion/styled': 'latest', - '@mui/material': 'next', - '@mui/lab': 'next', + '@mui/material': 'latest', + '@mui/lab': 'latest', exceljs: 'latest', }); }); @@ -146,8 +146,8 @@ import 'exceljs'; '@emotion/react': 'latest', '@emotion/styled': 'latest', '@foo-bar/bip': 'latest', - '@mui/material': 'next', - '@mui/base': 'next', + '@mui/material': 'latest', + '@mui/base': 'latest', '@types/foo-bar__bip': 'latest', '@types/prop-types': 'latest', '@types/react-dom': 'latest', @@ -167,7 +167,7 @@ import 'exceljs'; 'react-dom': 'latest', '@emotion/react': 'latest', '@emotion/styled': 'latest', - '@mui/material': 'next', + '@mui/material': 'latest', '@types/react-dom': 'latest', '@types/react': 'latest', typescript: 'latest', @@ -195,8 +195,8 @@ import { 'react-dom': 'latest', '@emotion/react': 'latest', '@emotion/styled': 'latest', - '@mui/material': 'next', - '@mui/lab': 'next', + '@mui/material': 'latest', + '@mui/lab': 'latest', }); }); @@ -215,8 +215,8 @@ import lab from '@mui/lab'; 'react-dom': 'latest', '@emotion/react': 'latest', '@emotion/styled': 'latest', - '@mui/material': 'next', - '@mui/lab': 'next', + '@mui/material': 'latest', + '@mui/lab': 'latest', }); }); @@ -517,10 +517,10 @@ export default function EmailExample() { 'react-dom': 'latest', '@emotion/react': 'latest', '@emotion/styled': 'latest', - '@mui/icons-material': 'next', - '@mui/joy': 'next', - '@mui/material': 'next', - '@mui/system': 'next', + '@mui/icons-material': 'latest', + '@mui/joy': 'latest', + '@mui/material': 'latest', + '@mui/system': 'latest', '@types/react': 'latest', '@types/react-dom': 'latest', typescript: 'latest', diff --git a/docs/src/modules/sandbox/Dependencies.ts b/docs/src/modules/sandbox/Dependencies.ts index 402276e228dad6..023fb4238c4d79 100644 --- a/docs/src/modules/sandbox/Dependencies.ts +++ b/docs/src/modules/sandbox/Dependencies.ts @@ -50,7 +50,7 @@ export default function SandboxDependencies( process.env.SOURCE_CODE_REPO !== 'https://github.com/mui/material-ui' ) { // #default-branch-switch - return 'next'; + return 'latest'; } const shortSha = commitRef.slice(0, 8); return `https://pkg.csb.dev/mui/material-ui/commit/${shortSha}/@mui/${packageName}`; diff --git a/docs/src/modules/sandbox/StackBlitz.test.js b/docs/src/modules/sandbox/StackBlitz.test.js index 67bc0625b4cf80..0d25c2a95c77b7 100644 --- a/docs/src/modules/sandbox/StackBlitz.test.js +++ b/docs/src/modules/sandbox/StackBlitz.test.js @@ -83,7 +83,7 @@ ReactDOM.createRoot(document.querySelector("#root")).render( }, dependencies: { react: 'latest', - '@mui/material': 'next', + '@mui/material': 'latest', 'react-dom': 'latest', '@emotion/react': 'latest', '@emotion/styled': 'latest', @@ -186,7 +186,7 @@ ReactDOM.createRoot(document.querySelector("#root")!).render( }, dependencies: { react: 'latest', - '@mui/material': 'next', + '@mui/material': 'latest', 'react-dom': 'latest', '@emotion/react': 'latest', '@emotion/styled': 'latest', diff --git a/docs/src/modules/utils/useResizeHandle.ts b/docs/src/modules/utils/useResizeHandle.ts new file mode 100644 index 00000000000000..14f7b6c29a6643 --- /dev/null +++ b/docs/src/modules/utils/useResizeHandle.ts @@ -0,0 +1,86 @@ +import * as React from 'react'; + +const useResizeHandle = ( + target: React.MutableRefObject<HTMLDivElement | null>, + options?: { + minWidth?: string; + maxWidth?: string; + onDragging?: ( + target: React.MutableRefObject<HTMLDivElement>['current'], + length: number, + dragOffset: number, + ) => void; + }, +) => { + const { minWidth = '0px', maxWidth = '100%', onDragging } = options || {}; + const [dragging, setDragging] = React.useState(false); + const [dragOffset, setDragOffset] = React.useState(0); + const isTouchEvent = (event: MouseEvent | TouchEvent): event is TouchEvent => { + return Boolean((event as TouchEvent).touches && (event as TouchEvent).touches.length); + }; + const isMouseEvent = (event: MouseEvent | TouchEvent): event is MouseEvent => { + return Boolean((event as MouseEvent).clientX || (event as MouseEvent).clientX === 0); + }; + const getClientX = React.useCallback((event: MouseEvent | TouchEvent) => { + let clientX; + if (isMouseEvent(event)) { + clientX = event.clientX; + } + if (isTouchEvent(event)) { + clientX = event.touches[0].clientX; + } + return clientX as number; + }, []); + const handleStart = (event: React.MouseEvent | React.TouchEvent) => { + const clientX = getClientX(event.nativeEvent); + const rect = (event.target as HTMLElement).getBoundingClientRect(); + setDragging(true); + setDragOffset(rect.width - (clientX - rect.x)); + }; + React.useEffect(() => { + function resizeObject(event: MouseEvent | TouchEvent) { + if (event.cancelable) { + event.preventDefault(); + } + const clientX = getClientX(event); + + if (target.current && dragging && clientX) { + const objectRect = target.current.getBoundingClientRect(); + const newWidth = clientX - objectRect.left; + if (onDragging) { + onDragging(target.current, newWidth, dragOffset); + } else { + target.current.style.width = `clamp(${minWidth}, ${Math.floor( + newWidth + dragOffset, + )}px, ${maxWidth})`; + } + } + } + function stopResize() { + setDragging(false); + } + + if (dragging) { + document.addEventListener('mousemove', resizeObject, { passive: false }); + document.addEventListener('mouseup', stopResize); + document.addEventListener('touchmove', resizeObject, { passive: false }); + document.addEventListener('touchend', stopResize); + return () => { + document.removeEventListener('mousemove', resizeObject); + document.removeEventListener('mouseup', stopResize); + document.removeEventListener('touchmove', resizeObject); + document.removeEventListener('touchend', stopResize); + }; + } + return () => {}; + }, [dragOffset, dragging, getClientX, maxWidth, minWidth, onDragging, target]); + return { + dragging, + getDragHandlers: () => ({ + onTouchStart: handleStart, + onMouseDown: handleStart, + }), + }; +}; + +export default useResizeHandle; diff --git a/docs/src/pages/premium-themes/onepirate/modules/components/TextField.js b/docs/src/pages/premium-themes/onepirate/modules/components/TextField.js index 84708a61630ef9..b1b291458251c5 100644 --- a/docs/src/pages/premium-themes/onepirate/modules/components/TextField.js +++ b/docs/src/pages/premium-themes/onepirate/modules/components/TextField.js @@ -117,23 +117,23 @@ function TextField(props) { TextField.propTypes = { /** - * Props applied to the [`InputLabel`](/material-ui/api/input-label/) element. + * Props applied to the [`InputLabel`](https://mui.com/material-ui/api/input-label/) element. * Pointer events like `onClick` are enabled if and only if `shrink` is `true`. - * @deprecated Use `slotProps.inputLabel` instead. This prop will be removed in v7. See [Migrating from deprecated APIs](/material-ui/migration/migrating-from-deprecated-apis/) for more details. + * @deprecated Use `slotProps.inputLabel` instead. This prop will be removed in v7. See [Migrating from deprecated APIs](https://mui.com/material-ui/migration/migrating-from-deprecated-apis/) for more details. */ InputLabelProps: PropTypes.object, /** * Props applied to the Input element. - * It will be a [`FilledInput`](/material-ui/api/filled-input/), - * [`OutlinedInput`](/material-ui/api/outlined-input/) or [`Input`](/material-ui/api/input/) + * It will be a [`FilledInput`](https://mui.com/material-ui/api/filled-input/), + * [`OutlinedInput`](https://mui.com/material-ui/api/outlined-input/) or [`Input`](https://mui.com/material-ui/api/input/) * component depending on the `variant` prop value. - * @deprecated Use `slotProps.input` instead. This prop will be removed in v7. See [Migrating from deprecated APIs](/material-ui/migration/migrating-from-deprecated-apis/) for more details. + * @deprecated Use `slotProps.input` instead. This prop will be removed in v7. See [Migrating from deprecated APIs](https://mui.com/material-ui/migration/migrating-from-deprecated-apis/) for more details. */ InputProps: PropTypes.object, noBorder: PropTypes.bool, /** - * Props applied to the [`Select`](/material-ui/api/select/) element. - * @deprecated Use `slotProps.select` instead. This prop will be removed in v7. See [Migrating from deprecated APIs](/material-ui/migration/migrating-from-deprecated-apis/) for more details. + * Props applied to the [`Select`](https://mui.com/material-ui/api/select/) element. + * @deprecated Use `slotProps.select` instead. This prop will be removed in v7. See [Migrating from deprecated APIs](https://mui.com/material-ui/migration/migrating-from-deprecated-apis/) for more details. */ SelectProps: PropTypes.object, size: PropTypes.oneOf(['large', 'medium', 'small', 'xlarge']), diff --git a/docs/src/pages/premium-themes/onepirate/modules/form/RFTextField.js b/docs/src/pages/premium-themes/onepirate/modules/form/RFTextField.js index e7e89210d54761..f235ade8a9cfe3 100644 --- a/docs/src/pages/premium-themes/onepirate/modules/form/RFTextField.js +++ b/docs/src/pages/premium-themes/onepirate/modules/form/RFTextField.js @@ -48,10 +48,10 @@ RFTextField.propTypes = { }).isRequired, /** * Props applied to the Input element. - * It will be a [`FilledInput`](/material-ui/api/filled-input/), - * [`OutlinedInput`](/material-ui/api/outlined-input/) or [`Input`](/material-ui/api/input/) + * It will be a [`FilledInput`](https://mui.com/material-ui/api/filled-input/), + * [`OutlinedInput`](https://mui.com/material-ui/api/outlined-input/) or [`Input`](https://mui.com/material-ui/api/input/) * component depending on the `variant` prop value. - * @deprecated Use `slotProps.input` instead. This prop will be removed in v7. See [Migrating from deprecated APIs](/material-ui/migration/migrating-from-deprecated-apis/) for more details. + * @deprecated Use `slotProps.input` instead. This prop will be removed in v7. See [Migrating from deprecated APIs](https://mui.com/material-ui/migration/migrating-from-deprecated-apis/) for more details. */ InputProps: PropTypes.object, meta: PropTypes.shape({ diff --git a/docs/src/route.ts b/docs/src/route.ts index b5d20ee57a4b4f..ad99102c64c380 100644 --- a/docs/src/route.ts +++ b/docs/src/route.ts @@ -36,7 +36,7 @@ const ROUTES = { systemDocs: '/system/getting-started/', // X general pages xIntro: '/x/introduction/', - xRoadmap: 'https://github.com/mui/mui-x/projects/1', + xRoadmap: 'https://github.com/orgs/mui/projects/35', xLicensing: '/x/introduction/licensing/', // Data Grid doc pages dataGridOverview: '/x/react-data-grid/', diff --git a/docs/translations/api-docs-base/table-pagination/table-pagination.json b/docs/translations/api-docs-base/table-pagination/table-pagination.json index 23c97b8c5ebd1a..395cc48b6cde4d 100644 --- a/docs/translations/api-docs-base/table-pagination/table-pagination.json +++ b/docs/translations/api-docs-base/table-pagination/table-pagination.json @@ -5,17 +5,17 @@ "description": "The total number of rows.<br>To enable server side pagination for an unknown number of items, provide -1." }, "getItemAriaLabel": { - "description": "Accepts a function which returns a string value that provides a user-friendly name for the current page. This is important for screen reader users.<br>For localization purposes, you can use the provided <a href=\"/material-ui/guides/localization/\">translations</a>.", + "description": "Accepts a function which returns a string value that provides a user-friendly name for the current page. This is important for screen reader users.<br>For localization purposes, you can use the provided <a href=\"https://mui.com/material-ui/guides/localization/\">translations</a>.", "typeDescriptions": { "type": "The link or button type to format ('first' | 'last' | 'next' | 'previous')." } }, "labelDisplayedRows": { - "description": "Customize the displayed rows label. Invoked with a <code>{ from, to, count, page }</code> object.<br>For localization purposes, you can use the provided <a href=\"/material-ui/guides/localization/\">translations</a>." + "description": "Customize the displayed rows label. Invoked with a <code>{ from, to, count, page }</code> object.<br>For localization purposes, you can use the provided <a href=\"https://mui.com/material-ui/guides/localization/\">translations</a>." }, "labelId": { "description": "Id of the label element within the pagination." }, "labelRowsPerPage": { - "description": "Customize the rows per page label.<br>For localization purposes, you can use the provided <a href=\"/material-ui/guides/localization/\">translations</a>." + "description": "Customize the rows per page label.<br>For localization purposes, you can use the provided <a href=\"https://mui.com/material-ui/guides/localization/\">translations</a>." }, "onPageChange": { "description": "Callback fired when the page is changed.", diff --git a/docs/translations/api-docs/use-autocomplete/use-autocomplete.json b/docs/translations/api-docs-base/use-autocomplete/use-autocomplete.json similarity index 100% rename from docs/translations/api-docs/use-autocomplete/use-autocomplete.json rename to docs/translations/api-docs-base/use-autocomplete/use-autocomplete.json diff --git a/docs/translations/api-docs/use-badge/use-badge.json b/docs/translations/api-docs-base/use-badge/use-badge.json similarity index 100% rename from docs/translations/api-docs/use-badge/use-badge.json rename to docs/translations/api-docs-base/use-badge/use-badge.json diff --git a/docs/translations/api-docs/use-button/use-button.json b/docs/translations/api-docs-base/use-button/use-button.json similarity index 100% rename from docs/translations/api-docs/use-button/use-button.json rename to docs/translations/api-docs-base/use-button/use-button.json diff --git a/docs/translations/api-docs/use-dropdown/use-dropdown.json b/docs/translations/api-docs-base/use-dropdown/use-dropdown.json similarity index 100% rename from docs/translations/api-docs/use-dropdown/use-dropdown.json rename to docs/translations/api-docs-base/use-dropdown/use-dropdown.json diff --git a/docs/translations/api-docs/use-form-control-context/use-form-control-context.json b/docs/translations/api-docs-base/use-form-control-context/use-form-control-context.json similarity index 100% rename from docs/translations/api-docs/use-form-control-context/use-form-control-context.json rename to docs/translations/api-docs-base/use-form-control-context/use-form-control-context.json diff --git a/docs/translations/api-docs/use-input/use-input.json b/docs/translations/api-docs-base/use-input/use-input.json similarity index 100% rename from docs/translations/api-docs/use-input/use-input.json rename to docs/translations/api-docs-base/use-input/use-input.json diff --git a/docs/translations/api-docs/use-menu-button/use-menu-button.json b/docs/translations/api-docs-base/use-menu-button/use-menu-button.json similarity index 100% rename from docs/translations/api-docs/use-menu-button/use-menu-button.json rename to docs/translations/api-docs-base/use-menu-button/use-menu-button.json diff --git a/docs/translations/api-docs/use-menu-item-context-stabilizer/use-menu-item-context-stabilizer.json b/docs/translations/api-docs-base/use-menu-item-context-stabilizer/use-menu-item-context-stabilizer.json similarity index 100% rename from docs/translations/api-docs/use-menu-item-context-stabilizer/use-menu-item-context-stabilizer.json rename to docs/translations/api-docs-base/use-menu-item-context-stabilizer/use-menu-item-context-stabilizer.json diff --git a/docs/translations/api-docs/use-menu-item/use-menu-item.json b/docs/translations/api-docs-base/use-menu-item/use-menu-item.json similarity index 100% rename from docs/translations/api-docs/use-menu-item/use-menu-item.json rename to docs/translations/api-docs-base/use-menu-item/use-menu-item.json diff --git a/docs/translations/api-docs/use-menu/use-menu.json b/docs/translations/api-docs-base/use-menu/use-menu.json similarity index 100% rename from docs/translations/api-docs/use-menu/use-menu.json rename to docs/translations/api-docs-base/use-menu/use-menu.json diff --git a/docs/translations/api-docs/use-modal/use-modal.json b/docs/translations/api-docs-base/use-modal/use-modal.json similarity index 100% rename from docs/translations/api-docs/use-modal/use-modal.json rename to docs/translations/api-docs-base/use-modal/use-modal.json diff --git a/docs/translations/api-docs/use-number-input/use-number-input.json b/docs/translations/api-docs-base/use-number-input/use-number-input.json similarity index 100% rename from docs/translations/api-docs/use-number-input/use-number-input.json rename to docs/translations/api-docs-base/use-number-input/use-number-input.json diff --git a/docs/translations/api-docs/use-option-context-stabilizer/use-option-context-stabilizer.json b/docs/translations/api-docs-base/use-option-context-stabilizer/use-option-context-stabilizer.json similarity index 100% rename from docs/translations/api-docs/use-option-context-stabilizer/use-option-context-stabilizer.json rename to docs/translations/api-docs-base/use-option-context-stabilizer/use-option-context-stabilizer.json diff --git a/docs/translations/api-docs/use-option/use-option.json b/docs/translations/api-docs-base/use-option/use-option.json similarity index 100% rename from docs/translations/api-docs/use-option/use-option.json rename to docs/translations/api-docs-base/use-option/use-option.json diff --git a/docs/translations/api-docs/use-select/use-select.json b/docs/translations/api-docs-base/use-select/use-select.json similarity index 100% rename from docs/translations/api-docs/use-select/use-select.json rename to docs/translations/api-docs-base/use-select/use-select.json diff --git a/docs/translations/api-docs/use-slider/use-slider.json b/docs/translations/api-docs-base/use-slider/use-slider.json similarity index 100% rename from docs/translations/api-docs/use-slider/use-slider.json rename to docs/translations/api-docs-base/use-slider/use-slider.json diff --git a/docs/translations/api-docs/use-snackbar/use-snackbar.json b/docs/translations/api-docs-base/use-snackbar/use-snackbar.json similarity index 100% rename from docs/translations/api-docs/use-snackbar/use-snackbar.json rename to docs/translations/api-docs-base/use-snackbar/use-snackbar.json diff --git a/docs/translations/api-docs/use-switch/use-switch.json b/docs/translations/api-docs-base/use-switch/use-switch.json similarity index 100% rename from docs/translations/api-docs/use-switch/use-switch.json rename to docs/translations/api-docs-base/use-switch/use-switch.json diff --git a/docs/translations/api-docs/use-tab-panel/use-tab-panel.json b/docs/translations/api-docs-base/use-tab-panel/use-tab-panel.json similarity index 100% rename from docs/translations/api-docs/use-tab-panel/use-tab-panel.json rename to docs/translations/api-docs-base/use-tab-panel/use-tab-panel.json diff --git a/docs/translations/api-docs/use-tab/use-tab.json b/docs/translations/api-docs-base/use-tab/use-tab.json similarity index 100% rename from docs/translations/api-docs/use-tab/use-tab.json rename to docs/translations/api-docs-base/use-tab/use-tab.json diff --git a/docs/translations/api-docs/use-tabs-list/use-tabs-list.json b/docs/translations/api-docs-base/use-tabs-list/use-tabs-list.json similarity index 100% rename from docs/translations/api-docs/use-tabs-list/use-tabs-list.json rename to docs/translations/api-docs-base/use-tabs-list/use-tabs-list.json diff --git a/docs/translations/api-docs/use-tabs/use-tabs.json b/docs/translations/api-docs-base/use-tabs/use-tabs.json similarity index 100% rename from docs/translations/api-docs/use-tabs/use-tabs.json rename to docs/translations/api-docs-base/use-tabs/use-tabs.json diff --git a/docs/translations/api-docs/use-transition-state-manager/use-transition-state-manager.json b/docs/translations/api-docs-base/use-transition-state-manager/use-transition-state-manager.json similarity index 100% rename from docs/translations/api-docs/use-transition-state-manager/use-transition-state-manager.json rename to docs/translations/api-docs-base/use-transition-state-manager/use-transition-state-manager.json diff --git a/docs/translations/api-docs/use-transition-trigger/use-transition-trigger.json b/docs/translations/api-docs-base/use-transition-trigger/use-transition-trigger.json similarity index 100% rename from docs/translations/api-docs/use-transition-trigger/use-transition-trigger.json rename to docs/translations/api-docs-base/use-transition-trigger/use-transition-trigger.json diff --git a/docs/translations/api-docs-joy/autocomplete/autocomplete.json b/docs/translations/api-docs-joy/autocomplete/autocomplete.json index f3af4583bd81bf..8762632edf5462 100644 --- a/docs/translations/api-docs-joy/autocomplete/autocomplete.json +++ b/docs/translations/api-docs-joy/autocomplete/autocomplete.json @@ -31,10 +31,10 @@ "description": "If <code>true</code>, clear all values when the user presses escape and the popup is closed." }, "clearText": { - "description": "Override the default text for the <em>clear</em> icon button.<br>For localization purposes, you can use the provided <a href=\"/material-ui/guides/localization/\">translations</a>." + "description": "Override the default text for the <em>clear</em> icon button.<br>For localization purposes, you can use the provided <a href=\"https://mui.com/material-ui/guides/localization/\">translations</a>." }, "closeText": { - "description": "Override the default text for the <em>close popup</em> icon button.<br>For localization purposes, you can use the provided <a href=\"/material-ui/guides/localization/\">translations</a>." + "description": "Override the default text for the <em>close popup</em> icon button.<br>For localization purposes, you can use the provided <a href=\"https://mui.com/material-ui/guides/localization/\">translations</a>." }, "color": { "description": "The color of the component. It supports those theme colors that make sense for this component." @@ -111,14 +111,14 @@ "description": "If <code>true</code>, the component is in a loading state. This shows the <code>loadingText</code> in place of suggestions (only if there are no suggestions to show, for example <code>options</code> are empty)." }, "loadingText": { - "description": "Text to display when in a loading state.<br>For localization purposes, you can use the provided <a href=\"/material-ui/guides/localization/\">translations</a>." + "description": "Text to display when in a loading state.<br>For localization purposes, you can use the provided <a href=\"https://mui.com/material-ui/guides/localization/\">translations</a>." }, "multiple": { "description": "If <code>true</code>, <code>value</code> must be an array and the menu will support multiple selections." }, "name": { "description": "Name attribute of the <code>input</code> element." }, "noOptionsText": { - "description": "Text to display when there are no options.<br>For localization purposes, you can use the provided <a href=\"/material-ui/guides/localization/\">translations</a>." + "description": "Text to display when there are no options.<br>For localization purposes, you can use the provided <a href=\"https://mui.com/material-ui/guides/localization/\">translations</a>." }, "onChange": { "description": "Callback fired when the value changes.", @@ -158,7 +158,7 @@ "open": { "description": "If <code>true</code>, the component is shown." }, "openOnFocus": { "description": "If <code>true</code>, the popup will open on input focus." }, "openText": { - "description": "Override the default text for the <em>open popup</em> icon button.<br>For localization purposes, you can use the provided <a href=\"/material-ui/guides/localization/\">translations</a>." + "description": "Override the default text for the <em>open popup</em> icon button.<br>For localization purposes, you can use the provided <a href=\"https://mui.com/material-ui/guides/localization/\">translations</a>." }, "options": { "description": "Array of options." }, "placeholder": { "description": "The input placeholder" }, diff --git a/docs/translations/api-docs/accordion/accordion.json b/docs/translations/api-docs/accordion/accordion.json index 894051258146ae..ff954964232c7f 100644 --- a/docs/translations/api-docs/accordion/accordion.json +++ b/docs/translations/api-docs/accordion/accordion.json @@ -25,7 +25,7 @@ "description": "The system prop that allows defining system overrides as well as additional CSS styles." }, "TransitionComponent": { - "description": "The component used for the transition. <a href=\"/material-ui/transitions/#transitioncomponent-prop\">Follow this guide</a> to learn more about the requirements for this component." + "description": "The component used for the transition. <a href=\"https://mui.com/material-ui/transitions/#transitioncomponent-prop\">Follow this guide</a> to learn more about the requirements for this component." }, "TransitionProps": { "description": "Props applied to the transition element. By default, the element is based on this <a href=\"https://reactcommunity.org/react-transition-group/transition/\"><code>Transition</code></a> component." @@ -61,6 +61,6 @@ }, "slotDescriptions": { "heading": "The component that renders the heading.", - "transition": "The component that renders the transition. <a href=\"/material-ui/transitions/#transitioncomponent-prop\">Follow this guide</a> to learn more about the requirements for this component." + "transition": "The component that renders the transition. <a href=\"https://mui.com/material-ui/transitions/#transitioncomponent-prop\">Follow this guide</a> to learn more about the requirements for this component." } } diff --git a/docs/translations/api-docs/alert/alert.json b/docs/translations/api-docs/alert/alert.json index 20a4c661c332db..6bf0c4bce51033 100644 --- a/docs/translations/api-docs/alert/alert.json +++ b/docs/translations/api-docs/alert/alert.json @@ -7,7 +7,7 @@ "children": { "description": "The content of the component." }, "classes": { "description": "Override or extend the styles applied to the component." }, "closeText": { - "description": "Override the default label for the <em>close popup</em> icon button.<br>For localization purposes, you can use the provided <a href=\"/material-ui/guides/localization/\">translations</a>." + "description": "Override the default label for the <em>close popup</em> icon button.<br>For localization purposes, you can use the provided <a href=\"https://mui.com/material-ui/guides/localization/\">translations</a>." }, "color": { "description": "The color of the component. Unless provided, the value is taken from the <code>severity</code> prop. It supports both default and custom theme colors, which can be added as shown in the <a href=\"https://mui.com/material-ui/customization/palette/#custom-colors\">palette customization guide</a>." diff --git a/docs/translations/api-docs/autocomplete/autocomplete.json b/docs/translations/api-docs/autocomplete/autocomplete.json index 5a32c235a23f07..c0c042dd0da31b 100644 --- a/docs/translations/api-docs/autocomplete/autocomplete.json +++ b/docs/translations/api-docs/autocomplete/autocomplete.json @@ -14,7 +14,7 @@ "description": "<p>Control if the input should be blurred when an option is selected:</p>\n<ul>\n<li><code>false</code> the input is not blurred.</li>\n<li><code>true</code> the input is always blurred.</li>\n<li><code>touch</code> the input is blurred after a touch event.</li>\n<li><code>mouse</code> the input is blurred after a mouse event.</li>\n</ul>\n" }, "ChipProps": { - "description": "Props applied to the <a href=\"/material-ui/api/chip/\"><code>Chip</code></a> element." + "description": "Props applied to the <a href=\"https://mui.com/material-ui/api/chip/\"><code>Chip</code></a> element." }, "classes": { "description": "Override or extend the styles applied to the component." }, "clearIcon": { "description": "The icon to display in place of the default clear icon." }, @@ -25,10 +25,10 @@ "description": "If <code>true</code>, clear all values when the user presses escape and the popup is closed." }, "clearText": { - "description": "Override the default text for the <em>clear</em> icon button.<br>For localization purposes, you can use the provided <a href=\"/material-ui/guides/localization/\">translations</a>." + "description": "Override the default text for the <em>clear</em> icon button.<br>For localization purposes, you can use the provided <a href=\"https://mui.com/material-ui/guides/localization/\">translations</a>." }, "closeText": { - "description": "Override the default text for the <em>close popup</em> icon button.<br>For localization purposes, you can use the provided <a href=\"/material-ui/guides/localization/\">translations</a>." + "description": "Override the default text for the <em>close popup</em> icon button.<br>For localization purposes, you can use the provided <a href=\"https://mui.com/material-ui/guides/localization/\">translations</a>." }, "componentsProps": { "description": "The props used for each slot inside." }, "defaultValue": { @@ -107,13 +107,13 @@ "description": "If <code>true</code>, the component is in a loading state. This shows the <code>loadingText</code> in place of suggestions (only if there are no suggestions to show, for example <code>options</code> are empty)." }, "loadingText": { - "description": "Text to display when in a loading state.<br>For localization purposes, you can use the provided <a href=\"/material-ui/guides/localization/\">translations</a>." + "description": "Text to display when in a loading state.<br>For localization purposes, you can use the provided <a href=\"https://mui.com/material-ui/guides/localization/\">translations</a>." }, "multiple": { "description": "If <code>true</code>, <code>value</code> must be an array and the menu will support multiple selections." }, "noOptionsText": { - "description": "Text to display when there are no options.<br>For localization purposes, you can use the provided <a href=\"/material-ui/guides/localization/\">translations</a>." + "description": "Text to display when there are no options.<br>For localization purposes, you can use the provided <a href=\"https://mui.com/material-ui/guides/localization/\">translations</a>." }, "onChange": { "description": "Callback fired when the value changes.", @@ -153,7 +153,7 @@ "open": { "description": "If <code>true</code>, the component is shown." }, "openOnFocus": { "description": "If <code>true</code>, the popup will open on input focus." }, "openText": { - "description": "Override the default text for the <em>open popup</em> icon button.<br>For localization purposes, you can use the provided <a href=\"/material-ui/guides/localization/\">translations</a>." + "description": "Override the default text for the <em>open popup</em> icon button.<br>For localization purposes, you can use the provided <a href=\"https://mui.com/material-ui/guides/localization/\">translations</a>." }, "options": { "description": "A list of options that will be shown in the Autocomplete." }, "PaperComponent": { "description": "The component used to render the body of the popup." }, diff --git a/docs/translations/api-docs/avatar/avatar.json b/docs/translations/api-docs/avatar/avatar.json index ed9ae7a397a2ba..bb169433e28c95 100644 --- a/docs/translations/api-docs/avatar/avatar.json +++ b/docs/translations/api-docs/avatar/avatar.json @@ -53,6 +53,6 @@ } }, "slotDescriptions": { - "img": "The component that renders the transition. <a href=\"/material-ui/transitions/#transitioncomponent-prop\">Follow this guide</a> to learn more about the requirements for this component." + "img": "The component that renders the transition. <a href=\"https://mui.com/material-ui/transitions/#transitioncomponent-prop\">Follow this guide</a> to learn more about the requirements for this component." } } diff --git a/docs/translations/api-docs/backdrop/backdrop.json b/docs/translations/api-docs/backdrop/backdrop.json index 6f3b4c4102cc60..04f59dcf4049ec 100644 --- a/docs/translations/api-docs/backdrop/backdrop.json +++ b/docs/translations/api-docs/backdrop/backdrop.json @@ -20,7 +20,7 @@ "description": "The system prop that allows defining system overrides as well as additional CSS styles." }, "TransitionComponent": { - "description": "The component used for the transition. <a href=\"/material-ui/transitions/#transitioncomponent-prop\">Follow this guide</a> to learn more about the requirements for this component." + "description": "The component used for the transition. <a href=\"https://mui.com/material-ui/transitions/#transitioncomponent-prop\">Follow this guide</a> to learn more about the requirements for this component." }, "transitionDuration": { "description": "The duration for the transition, in milliseconds. You may specify a single timeout for all transitions, or individually with an object." @@ -35,6 +35,6 @@ }, "slotDescriptions": { "root": "The component that renders the root.", - "transition": "The component that renders the transition. <a href=\"/material-ui/transitions/#transitioncomponent-prop\">Follow this guide</a> to learn more about the requirements for this component." + "transition": "The component that renders the transition. <a href=\"https://mui.com/material-ui/transitions/#transitioncomponent-prop\">Follow this guide</a> to learn more about the requirements for this component." } } diff --git a/docs/translations/api-docs/breadcrumbs/breadcrumbs.json b/docs/translations/api-docs/breadcrumbs/breadcrumbs.json index 4e6bb5ede9b2cf..81316c79cdf347 100644 --- a/docs/translations/api-docs/breadcrumbs/breadcrumbs.json +++ b/docs/translations/api-docs/breadcrumbs/breadcrumbs.json @@ -7,7 +7,7 @@ "description": "The component used for the root node. Either a string to use a HTML element or a component." }, "expandText": { - "description": "Override the default label for the expand button.<br>For localization purposes, you can use the provided <a href=\"/material-ui/guides/localization/\">translations</a>." + "description": "Override the default label for the expand button.<br>For localization purposes, you can use the provided <a href=\"https://mui.com/material-ui/guides/localization/\">translations</a>." }, "itemsAfterCollapse": { "description": "If max items is exceeded, the number of items to show after the ellipsis." diff --git a/docs/translations/api-docs/dialog/dialog.json b/docs/translations/api-docs/dialog/dialog.json index 6b38d43a40179c..2f70260a18be9f 100644 --- a/docs/translations/api-docs/dialog/dialog.json +++ b/docs/translations/api-docs/dialog/dialog.json @@ -29,14 +29,14 @@ "open": { "description": "If <code>true</code>, the component is shown." }, "PaperComponent": { "description": "The component used to render the body of the dialog." }, "PaperProps": { - "description": "Props applied to the <a href=\"/material-ui/api/paper/\"><code>Paper</code></a> element." + "description": "Props applied to the <a href=\"https://mui.com/material-ui/api/paper/\"><code>Paper</code></a> element." }, "scroll": { "description": "Determine the container for scrolling the dialog." }, "sx": { "description": "The system prop that allows defining system overrides as well as additional CSS styles." }, "TransitionComponent": { - "description": "The component used for the transition. <a href=\"/material-ui/transitions/#transitioncomponent-prop\">Follow this guide</a> to learn more about the requirements for this component." + "description": "The component used for the transition. <a href=\"https://mui.com/material-ui/transitions/#transitioncomponent-prop\">Follow this guide</a> to learn more about the requirements for this component." }, "transitionDuration": { "description": "The duration for the transition, in milliseconds. You may specify a single timeout for all transitions, or individually with an object." diff --git a/docs/translations/api-docs/drawer/drawer.json b/docs/translations/api-docs/drawer/drawer.json index 88fb9d7c5034a3..95074be42ae6d0 100644 --- a/docs/translations/api-docs/drawer/drawer.json +++ b/docs/translations/api-docs/drawer/drawer.json @@ -7,7 +7,7 @@ "elevation": { "description": "The elevation of the drawer." }, "hideBackdrop": { "description": "If <code>true</code>, the backdrop is not rendered." }, "ModalProps": { - "description": "Props applied to the <a href=\"/material-ui/api/modal/\"><code>Modal</code></a> element." + "description": "Props applied to the <a href=\"https://mui.com/material-ui/api/modal/\"><code>Modal</code></a> element." }, "onClose": { "description": "Callback fired when the component requests to be closed. The <code>reason</code> parameter can optionally be used to control the response to <code>onClose</code>.", @@ -18,10 +18,10 @@ }, "open": { "description": "If <code>true</code>, the component is shown." }, "PaperProps": { - "description": "Props applied to the <a href=\"/material-ui/api/paper/\"><code>Paper</code></a> element." + "description": "Props applied to the <a href=\"https://mui.com/material-ui/api/paper/\"><code>Paper</code></a> element." }, "SlideProps": { - "description": "Props applied to the <a href=\"/material-ui/api/slide/\"><code>Slide</code></a> element." + "description": "Props applied to the <a href=\"https://mui.com/material-ui/api/slide/\"><code>Slide</code></a> element." }, "sx": { "description": "The system prop that allows defining system overrides as well as additional CSS styles." diff --git a/docs/translations/api-docs/filled-input/filled-input.json b/docs/translations/api-docs/filled-input/filled-input.json index c0d252ac247c59..0e51daeafe0699 100644 --- a/docs/translations/api-docs/filled-input/filled-input.json +++ b/docs/translations/api-docs/filled-input/filled-input.json @@ -52,7 +52,7 @@ "description": "Minimum number of rows to display when multiline option is set to true." }, "multiline": { - "description": "If <code>true</code>, a <a href=\"/material-ui/react-textarea-autosize/\">TextareaAutosize</a> element is rendered." + "description": "If <code>true</code>, a <a href=\"https://mui.com/material-ui/react-textarea-autosize/\">TextareaAutosize</a> element is rendered." }, "name": { "description": "Name attribute of the <code>input</code> element." }, "onChange": { diff --git a/docs/translations/api-docs/hidden/hidden.json b/docs/translations/api-docs/hidden/hidden.json index 761e9fd71256f4..5c9816c67d4668 100644 --- a/docs/translations/api-docs/hidden/hidden.json +++ b/docs/translations/api-docs/hidden/hidden.json @@ -1,6 +1,6 @@ { "componentDescription": "Responsively hides children based on the selected implementation.", - "deprecationInfo": "The Hidden component was deprecated in Material UI v5. To learn more, see <a href=\"/material-ui/migration/v5-component-changes/#hidden\">the Hidden section</a> of the migration docs.", + "deprecationInfo": "The Hidden component was deprecated in Material UI v5. To learn more, see <a href=\"https://mui.com/material-ui/migration/v5-component-changes/#hidden\">the Hidden section</a> of the migration docs.", "propDescriptions": { "children": { "description": "The content of the component." }, "implementation": { diff --git a/docs/translations/api-docs/input-base/input-base.json b/docs/translations/api-docs/input-base/input-base.json index 6b5be2851a4fcc..ad671af0f1bd52 100644 --- a/docs/translations/api-docs/input-base/input-base.json +++ b/docs/translations/api-docs/input-base/input-base.json @@ -50,7 +50,7 @@ "description": "Minimum number of rows to display when multiline option is set to true." }, "multiline": { - "description": "If <code>true</code>, a <a href=\"/material-ui/react-textarea-autosize/\">TextareaAutosize</a> element is rendered." + "description": "If <code>true</code>, a <a href=\"https://mui.com/material-ui/react-textarea-autosize/\">TextareaAutosize</a> element is rendered." }, "name": { "description": "Name attribute of the <code>input</code> element." }, "onBlur": { diff --git a/docs/translations/api-docs/input/input.json b/docs/translations/api-docs/input/input.json index 5c6263f5bb03dd..ef32b1acc6f804 100644 --- a/docs/translations/api-docs/input/input.json +++ b/docs/translations/api-docs/input/input.json @@ -49,7 +49,7 @@ "description": "Minimum number of rows to display when multiline option is set to true." }, "multiline": { - "description": "If <code>true</code>, a <a href=\"/material-ui/react-textarea-autosize/\">TextareaAutosize</a> element is rendered." + "description": "If <code>true</code>, a <a href=\"https://mui.com/material-ui/react-textarea-autosize/\">TextareaAutosize</a> element is rendered." }, "name": { "description": "Name attribute of the <code>input</code> element." }, "onChange": { diff --git a/docs/translations/api-docs/link/link.json b/docs/translations/api-docs/link/link.json index 750d6917689408..fcb06fd75292a1 100644 --- a/docs/translations/api-docs/link/link.json +++ b/docs/translations/api-docs/link/link.json @@ -12,7 +12,7 @@ "description": "The system prop that allows defining system overrides as well as additional CSS styles." }, "TypographyClasses": { - "description": "<code>classes</code> prop applied to the <a href=\"/material-ui/api/typography/\"><code>Typography</code></a> element." + "description": "<code>classes</code> prop applied to the <a href=\"https://mui.com/material-ui/api/typography/\"><code>Typography</code></a> element." }, "underline": { "description": "Controls when the link should have an underline." }, "variant": { "description": "Applies the theme typography styles." } diff --git a/docs/translations/api-docs/list-item-secondary-action/list-item-secondary-action.json b/docs/translations/api-docs/list-item-secondary-action/list-item-secondary-action.json index 3a537b274a4187..0ed025dc1bcad9 100644 --- a/docs/translations/api-docs/list-item-secondary-action/list-item-secondary-action.json +++ b/docs/translations/api-docs/list-item-secondary-action/list-item-secondary-action.json @@ -1,6 +1,6 @@ { "componentDescription": "Must be used as the last child of ListItem to function properly.", - "deprecationInfo": "Use the <code>secondaryAction</code> prop in the <code>ListItem</code> component instead. This component will be removed in v7. See <a href=\"/material-ui/migration/migrating-from-deprecated-apis/\">Migrating from deprecated APIs</a> for more details.", + "deprecationInfo": "Use the <code>secondaryAction</code> prop in the <code>ListItem</code> component instead. This component will be removed in v7. See <a href=\"https://mui.com/material-ui/migration/migrating-from-deprecated-apis/\">Migrating from deprecated APIs</a> for more details.", "propDescriptions": { "children": { "description": "The content of the component, normally an <code>IconButton</code> or selection control." diff --git a/docs/translations/api-docs/loading-button/loading-button.json b/docs/translations/api-docs/loading-button/loading-button.json index 893accc5f50691..9babb1623d14c9 100644 --- a/docs/translations/api-docs/loading-button/loading-button.json +++ b/docs/translations/api-docs/loading-button/loading-button.json @@ -168,6 +168,10 @@ "conditions": "supplied and <code>size=\"small\"</code>", "deprecationInfo": "Combine the <a href=\"/material-ui/api/button/#button-classes-icon\">.MuiButton-icon</a> and <a href=\"/material-ui/api/button/#button-classes-sizeSmall\">.MuiButtonSizeSmall</a> classes instead. See <a href=\"/material-ui/migration/migrating-from-deprecated-apis/\">Migrating from deprecated APIs</a> for more details." }, + "label": { + "description": "Styles applied to {{nodeName}}.", + "nodeName": "the span element that wraps the children" + }, "loading": { "description": "Styles applied to {{nodeName}} if {{conditions}}.", "nodeName": "the root element", diff --git a/docs/translations/api-docs/menu/menu.json b/docs/translations/api-docs/menu/menu.json index 9379f92a5f1503..afd676d6d50a63 100644 --- a/docs/translations/api-docs/menu/menu.json +++ b/docs/translations/api-docs/menu/menu.json @@ -13,7 +13,7 @@ "description": "When opening the menu will not focus the active item but the <code>[role="menu"]</code> unless <code>autoFocus</code> is also set to <code>false</code>. Not using the default means not following WAI-ARIA authoring practices. Please be considerate about possible accessibility implications." }, "MenuListProps": { - "description": "Props applied to the <a href=\"/material-ui/api/menu-list/\"><code>MenuList</code></a> element." + "description": "Props applied to the <a href=\"https://mui.com/material-ui/api/menu-list/\"><code>MenuList</code></a> element." }, "onClose": { "description": "Callback fired when the component requests to be closed.", @@ -24,7 +24,7 @@ }, "open": { "description": "If <code>true</code>, the component is shown." }, "PopoverClasses": { - "description": "<code>classes</code> prop applied to the <a href=\"/material-ui/api/popover/\"><code>Popover</code></a> element." + "description": "<code>classes</code> prop applied to the <a href=\"https://mui.com/material-ui/api/popover/\"><code>Popover</code></a> element." }, "slotProps": { "description": "The props used for each slot inside." }, "slots": { "description": "The components used for each slot inside." }, diff --git a/docs/translations/api-docs/modal/modal.json b/docs/translations/api-docs/modal/modal.json index 6a6e2a068a1498..5fa501eb4fd404 100644 --- a/docs/translations/api-docs/modal/modal.json +++ b/docs/translations/api-docs/modal/modal.json @@ -5,7 +5,7 @@ "description": "A backdrop component. This prop enables custom backdrop rendering." }, "BackdropProps": { - "description": "Props applied to the <a href=\"/material-ui/api/backdrop/\"><code>Backdrop</code></a> element." + "description": "Props applied to the <a href=\"https://mui.com/material-ui/api/backdrop/\"><code>Backdrop</code></a> element." }, "children": { "description": "A single child content element.", "requiresRef": true }, "classes": { "description": "Override or extend the styles applied to the component." }, diff --git a/docs/translations/api-docs/no-ssr/no-ssr.json b/docs/translations/api-docs/no-ssr/no-ssr.json index ff903d12a20b33..1d73722e5d9b32 100644 --- a/docs/translations/api-docs/no-ssr/no-ssr.json +++ b/docs/translations/api-docs/no-ssr/no-ssr.json @@ -1,5 +1,5 @@ { - "componentDescription": "NoSsr purposely removes components from the subject of Server Side Rendering (SSR).\n\nThis component can be useful in a variety of situations:\n\n* Escape hatch for broken dependencies not supporting SSR.\n* Improve the time-to-first paint on the client by only rendering above the fold.\n* Reduce the rendering time on the server.\n* Under too heavy server load, you can turn on service degradation.", + "componentDescription": "NoSsr purposely removes components from the subject of Server Side Rendering (SSR).\n\nThis component can be useful in a variety of situations:\n\n* Escape hatch for broken dependencies not supporting SSR.\n* Improve the time-to-first paint on the client by only rendering above the fold.\n* Reduce the rendering time on the server.\n* Under too heavy server load, you can turn on service degradation.", "propDescriptions": { "children": { "description": "You can wrap a node." }, "defer": { diff --git a/docs/translations/api-docs/outlined-input/outlined-input.json b/docs/translations/api-docs/outlined-input/outlined-input.json index 7f6636f2615879..2cb8618c1f8d3c 100644 --- a/docs/translations/api-docs/outlined-input/outlined-input.json +++ b/docs/translations/api-docs/outlined-input/outlined-input.json @@ -46,7 +46,7 @@ "description": "Minimum number of rows to display when multiline option is set to true." }, "multiline": { - "description": "If <code>true</code>, a <a href=\"/material-ui/react-textarea-autosize/\">TextareaAutosize</a> element is rendered." + "description": "If <code>true</code>, a <a href=\"https://mui.com/material-ui/react-textarea-autosize/\">TextareaAutosize</a> element is rendered." }, "name": { "description": "Name attribute of the <code>input</code> element." }, "notched": { diff --git a/docs/translations/api-docs/pagination/pagination.json b/docs/translations/api-docs/pagination/pagination.json index be7d0c034f0cf1..8aa410ae3d0818 100644 --- a/docs/translations/api-docs/pagination/pagination.json +++ b/docs/translations/api-docs/pagination/pagination.json @@ -12,7 +12,7 @@ }, "disabled": { "description": "If <code>true</code>, the component is disabled." }, "getItemAriaLabel": { - "description": "Accepts a function which returns a string value that provides a user-friendly name for the current page. This is important for screen reader users.<br>For localization purposes, you can use the provided <a href=\"/material-ui/guides/localization/\">translations</a>.", + "description": "Accepts a function which returns a string value that provides a user-friendly name for the current page. This is important for screen reader users.<br>For localization purposes, you can use the provided <a href=\"https://mui.com/material-ui/guides/localization/\">translations</a>.", "typeDescriptions": { "type": "The link or button type to format ('page' | 'first' | 'last' | 'next' | 'previous' | 'start-ellipsis' | 'end-ellipsis'). Defaults to 'page'.", "page": "The page number to format.", diff --git a/docs/translations/api-docs/popover/popover.json b/docs/translations/api-docs/popover/popover.json index 74868af1093e8e..7a42dd4df91efd 100644 --- a/docs/translations/api-docs/popover/popover.json +++ b/docs/translations/api-docs/popover/popover.json @@ -5,7 +5,7 @@ "description": "A ref for imperative actions. It currently only supports updatePosition() action." }, "anchorEl": { - "description": "An HTML element, <a href=\"/material-ui/react-popover/#virtual-element\">PopoverVirtualElement</a>, or a function that returns either. It's used to set the position of the popover." + "description": "An HTML element, <a href=\"https://mui.com/material-ui/react-popover/#virtual-element\">PopoverVirtualElement</a>, or a function that returns either. It's used to set the position of the popover." }, "anchorOrigin": { "description": "This is the point on the anchor where the popover's <code>anchorEl</code> will attach to. This is not used when the anchorReference is 'anchorPosition'.<br>Options: vertical: [top, center, bottom]; horizontal: [left, center, right]." @@ -16,6 +16,12 @@ "anchorReference": { "description": "This determines which anchor prop to refer to when setting the position of the popover." }, + "BackdropComponent": { + "description": "A backdrop component. This prop enables custom backdrop rendering." + }, + "BackdropProps": { + "description": "Props applied to the <a href=\"/material-ui/api/backdrop/\"><code>Backdrop</code></a> element." + }, "children": { "description": "The content of the component." }, "classes": { "description": "Override or extend the styles applied to the component." }, "container": { @@ -31,7 +37,7 @@ }, "open": { "description": "If <code>true</code>, the component is shown." }, "PaperProps": { - "description": "Props applied to the <a href=\"/material-ui/api/paper/\"><code>Paper</code></a> element.<br>This prop is an alias for <code>slotProps.paper</code> and will be overriden by it if both are used." + "description": "Props applied to the <a href=\"https://mui.com/material-ui/api/paper/\"><code>Paper</code></a> element.<br>This prop is an alias for <code>slotProps.paper</code> and will be overriden by it if both are used." }, "slotProps": { "description": "The props used for each slot inside." }, "slots": { "description": "The components used for each slot inside." }, @@ -42,7 +48,7 @@ "description": "This is the point on the popover which will attach to the anchor's origin.<br>Options: vertical: [top, center, bottom, x(px)]; horizontal: [left, center, right, x(px)]." }, "TransitionComponent": { - "description": "The component used for the transition. <a href=\"/material-ui/transitions/#transitioncomponent-prop\">Follow this guide</a> to learn more about the requirements for this component." + "description": "The component used for the transition. <a href=\"https://mui.com/material-ui/transitions/#transitioncomponent-prop\">Follow this guide</a> to learn more about the requirements for this component." }, "transitionDuration": { "description": "Set to 'auto' to automatically calculate transition time based on height." diff --git a/docs/translations/api-docs/rating/rating.json b/docs/translations/api-docs/rating/rating.json index 3adc1b7eef9929..7adde99b395e17 100644 --- a/docs/translations/api-docs/rating/rating.json +++ b/docs/translations/api-docs/rating/rating.json @@ -9,7 +9,7 @@ "emptyIcon": { "description": "The icon to display when empty." }, "emptyLabelText": { "description": "The label read when the rating input is empty." }, "getLabelText": { - "description": "Accepts a function which returns a string value that provides a user-friendly name for the current value of the rating. This is important for screen reader users.<br>For localization purposes, you can use the provided <a href=\"/material-ui/guides/localization/\">translations</a>.", + "description": "Accepts a function which returns a string value that provides a user-friendly name for the current value of the rating. This is important for screen reader users.<br>For localization purposes, you can use the provided <a href=\"https://mui.com/material-ui/guides/localization/\">translations</a>.", "typeDescriptions": { "value": "The rating label's value to format." } }, "highlightSelectedOnly": { diff --git a/docs/translations/api-docs/select/select.json b/docs/translations/api-docs/select/select.json index 1e334a7aab759d..bd82f2ae26b5db 100644 --- a/docs/translations/api-docs/select/select.json +++ b/docs/translations/api-docs/select/select.json @@ -28,13 +28,13 @@ "description": "<a href=\"https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input#Attributes\">Attributes</a> applied to the <code>input</code> element. When <code>native</code> is <code>true</code>, the attributes are applied on the <code>select</code> element." }, "label": { - "description": "See <a href=\"/material-ui/api/outlined-input/#props\">OutlinedInput#label</a>" + "description": "See <a href=\"https://mui.com/material-ui/api/outlined-input/#props\">OutlinedInput#label</a>" }, "labelId": { "description": "The ID of an element that acts as an additional label. The Select will be labelled by the additional label and the selected value." }, "MenuProps": { - "description": "Props applied to the <a href=\"/material-ui/api/menu/\"><code>Menu</code></a> element." + "description": "Props applied to the <a href=\"https://mui.com/material-ui/api/menu/\"><code>Menu</code></a> element." }, "multiple": { "description": "If <code>true</code>, <code>value</code> must be an array and the menu will support multiple selections." diff --git a/docs/translations/api-docs/snackbar/snackbar.json b/docs/translations/api-docs/snackbar/snackbar.json index 1c36673de3ba27..ed804f558b8731 100644 --- a/docs/translations/api-docs/snackbar/snackbar.json +++ b/docs/translations/api-docs/snackbar/snackbar.json @@ -16,7 +16,7 @@ "description": "Props applied to the <code>ClickAwayListener</code> element." }, "ContentProps": { - "description": "Props applied to the <a href=\"/material-ui/api/snackbar-content/\"><code>SnackbarContent</code></a> element." + "description": "Props applied to the <a href=\"https://mui.com/material-ui/api/snackbar-content/\"><code>SnackbarContent</code></a> element." }, "disableWindowBlurListener": { "description": "If <code>true</code>, the <code>autoHideDuration</code> timer will expire even if the window is not focused." @@ -40,7 +40,7 @@ "description": "The system prop that allows defining system overrides as well as additional CSS styles." }, "TransitionComponent": { - "description": "The component used for the transition. <a href=\"/material-ui/transitions/#transitioncomponent-prop\">Follow this guide</a> to learn more about the requirements for this component." + "description": "The component used for the transition. <a href=\"https://mui.com/material-ui/transitions/#transitioncomponent-prop\">Follow this guide</a> to learn more about the requirements for this component." }, "transitionDuration": { "description": "The duration for the transition, in milliseconds. You may specify a single timeout for all transitions, or individually with an object." diff --git a/docs/translations/api-docs/speed-dial-action/speed-dial-action.json b/docs/translations/api-docs/speed-dial-action/speed-dial-action.json index e93a7f76e63448..8f13c834d2c1f0 100644 --- a/docs/translations/api-docs/speed-dial-action/speed-dial-action.json +++ b/docs/translations/api-docs/speed-dial-action/speed-dial-action.json @@ -6,7 +6,7 @@ "description": "Adds a transition delay, to allow a series of SpeedDialActions to be animated." }, "FabProps": { - "description": "Props applied to the <a href=\"/material-ui/api/fab/\"><code>Fab</code></a> component." + "description": "Props applied to the <a href=\"https://mui.com/material-ui/api/fab/\"><code>Fab</code></a> component." }, "icon": { "description": "The icon to display in the SpeedDial Fab." }, "id": { @@ -17,7 +17,7 @@ "description": "The system prop that allows defining system overrides as well as additional CSS styles." }, "TooltipClasses": { - "description": "<code>classes</code> prop applied to the <a href=\"/material-ui/api/tooltip/\"><code>Tooltip</code></a> element." + "description": "<code>classes</code> prop applied to the <a href=\"https://mui.com/material-ui/api/tooltip/\"><code>Tooltip</code></a> element." }, "tooltipOpen": { "description": "Make the tooltip always visible when the SpeedDial is open." }, "tooltipPlacement": { "description": "Placement of the tooltip." }, diff --git a/docs/translations/api-docs/speed-dial/speed-dial.json b/docs/translations/api-docs/speed-dial/speed-dial.json index 361d0b25fb3df5..47e3024c93f6ce 100644 --- a/docs/translations/api-docs/speed-dial/speed-dial.json +++ b/docs/translations/api-docs/speed-dial/speed-dial.json @@ -12,7 +12,7 @@ "description": "The direction the actions open relative to the floating action button." }, "FabProps": { - "description": "Props applied to the <a href=\"/material-ui/api/fab/\"><code>Fab</code></a> element." + "description": "Props applied to the <a href=\"https://mui.com/material-ui/api/fab/\"><code>Fab</code></a> element." }, "hidden": { "description": "If <code>true</code>, the SpeedDial is hidden." }, "icon": { @@ -42,7 +42,7 @@ "description": "The system prop that allows defining system overrides as well as additional CSS styles." }, "TransitionComponent": { - "description": "The component used for the transition. <a href=\"/material-ui/transitions/#transitioncomponent-prop\">Follow this guide</a> to learn more about the requirements for this component." + "description": "The component used for the transition. <a href=\"https://mui.com/material-ui/transitions/#transitioncomponent-prop\">Follow this guide</a> to learn more about the requirements for this component." }, "transitionDuration": { "description": "The duration for the transition, in milliseconds. You may specify a single timeout for all transitions, or individually with an object." @@ -77,6 +77,6 @@ "root": { "description": "Styles applied to the root element." } }, "slotDescriptions": { - "transition": "The component that renders the transition. <a href=\"/material-ui/transitions/#transitioncomponent-prop\">Follow this guide</a> to learn more about the requirements for this component." + "transition": "The component that renders the transition. <a href=\"https://mui.com/material-ui/transitions/#transitioncomponent-prop\">Follow this guide</a> to learn more about the requirements for this component." } } diff --git a/docs/translations/api-docs/step-content/step-content.json b/docs/translations/api-docs/step-content/step-content.json index e3f3391e657ed8..feb80f01254ee7 100644 --- a/docs/translations/api-docs/step-content/step-content.json +++ b/docs/translations/api-docs/step-content/step-content.json @@ -7,7 +7,7 @@ "description": "The system prop that allows defining system overrides as well as additional CSS styles." }, "TransitionComponent": { - "description": "The component used for the transition. <a href=\"/material-ui/transitions/#transitioncomponent-prop\">Follow this guide</a> to learn more about the requirements for this component." + "description": "The component used for the transition. <a href=\"https://mui.com/material-ui/transitions/#transitioncomponent-prop\">Follow this guide</a> to learn more about the requirements for this component." }, "transitionDuration": { "description": "Adjust the duration of the content expand transition. Passed as a prop to the transition component.<br>Set to 'auto' to automatically calculate transition time based on height." diff --git a/docs/translations/api-docs/step-label/step-label.json b/docs/translations/api-docs/step-label/step-label.json index 7c281a6e0eec06..b3e253194c0b76 100644 --- a/docs/translations/api-docs/step-label/step-label.json +++ b/docs/translations/api-docs/step-label/step-label.json @@ -12,10 +12,10 @@ "slotProps": { "description": "The props used for each slot inside." }, "slots": { "description": "The components used for each slot inside." }, "StepIconComponent": { - "description": "The component to render in place of the <a href=\"/material-ui/api/step-icon/\"><code>StepIcon</code></a>." + "description": "The component to render in place of the <a href=\"https://mui.com/material-ui/api/step-icon/\"><code>StepIcon</code></a>." }, "StepIconProps": { - "description": "Props applied to the <a href=\"/material-ui/api/step-icon/\"><code>StepIcon</code></a> element." + "description": "Props applied to the <a href=\"https://mui.com/material-ui/api/step-icon/\"><code>StepIcon</code></a> element." }, "sx": { "description": "The system prop that allows defining system overrides as well as additional CSS styles." @@ -69,6 +69,6 @@ }, "slotDescriptions": { "label": "The component that renders the label.", - "stepIcon": "The component to render in place of the <a href=\"/material-ui/api/step-icon/\"><code>StepIcon</code></a>." + "stepIcon": "The component to render in place of the <a href=\"https://mui.com/material-ui/api/step-icon/\"><code>StepIcon</code></a>." } } diff --git a/docs/translations/api-docs/table-pagination/table-pagination.json b/docs/translations/api-docs/table-pagination/table-pagination.json index 4fe00ec57bc810..fa2666ec9c1be5 100644 --- a/docs/translations/api-docs/table-pagination/table-pagination.json +++ b/docs/translations/api-docs/table-pagination/table-pagination.json @@ -5,7 +5,7 @@ "description": "The component used for displaying the actions. Either a string to use a HTML element or a component." }, "backIconButtonProps": { - "description": "Props applied to the back arrow <a href=\"/material-ui/api/icon-button/\"><code>IconButton</code></a> component.<br>This prop is an alias for <code>slotProps.actions.previousButton</code> and will be overriden by it if both are used." + "description": "Props applied to the back arrow <a href=\"https://mui.com/material-ui/api/icon-button/\"><code>IconButton</code></a> component.<br>This prop is an alias for <code>slotProps.actions.previousButton</code> and will be overriden by it if both are used." }, "classes": { "description": "Override or extend the styles applied to the component." }, "component": { @@ -16,19 +16,19 @@ }, "disabled": { "description": "If <code>true</code>, the component is disabled." }, "getItemAriaLabel": { - "description": "Accepts a function which returns a string value that provides a user-friendly name for the current page. This is important for screen reader users.<br>For localization purposes, you can use the provided <a href=\"/material-ui/guides/localization/\">translations</a>.", + "description": "Accepts a function which returns a string value that provides a user-friendly name for the current page. This is important for screen reader users.<br>For localization purposes, you can use the provided <a href=\"https://mui.com/material-ui/guides/localization/\">translations</a>.", "typeDescriptions": { "type": "The link or button type to format ('first' | 'last' | 'next' | 'previous')." } }, "labelDisplayedRows": { - "description": "Customize the displayed rows label. Invoked with a <code>{ from, to, count, page }</code> object.<br>For localization purposes, you can use the provided <a href=\"/material-ui/guides/localization/\">translations</a>." + "description": "Customize the displayed rows label. Invoked with a <code>{ from, to, count, page }</code> object.<br>For localization purposes, you can use the provided <a href=\"https://mui.com/material-ui/guides/localization/\">translations</a>." }, "labelRowsPerPage": { - "description": "Customize the rows per page label.<br>For localization purposes, you can use the provided <a href=\"/material-ui/guides/localization/\">translations</a>." + "description": "Customize the rows per page label.<br>For localization purposes, you can use the provided <a href=\"https://mui.com/material-ui/guides/localization/\">translations</a>." }, "nextIconButtonProps": { - "description": "Props applied to the next arrow <a href=\"/material-ui/api/icon-button/\"><code>IconButton</code></a> element.<br>This prop is an alias for <code>slotProps.actions.nextButton</code> and will be overriden by it if both are used." + "description": "Props applied to the next arrow <a href=\"https://mui.com/material-ui/api/icon-button/\"><code>IconButton</code></a> element.<br>This prop is an alias for <code>slotProps.actions.nextButton</code> and will be overriden by it if both are used." }, "onPageChange": { "description": "Callback fired when the page is changed.", @@ -49,7 +49,7 @@ "description": "Customizes the options of the rows per page select field. If less than two options are available, no select field will be displayed. Use -1 for the value with a custom label to show all the rows." }, "SelectProps": { - "description": "Props applied to the rows per page <a href=\"/material-ui/api/select/\"><code>Select</code></a> element.<br>This prop is an alias for <code>slotProps.select</code> and will be overriden by it if both are used." + "description": "Props applied to the rows per page <a href=\"https://mui.com/material-ui/api/select/\"><code>Select</code></a> element.<br>This prop is an alias for <code>slotProps.select</code> and will be overriden by it if both are used." }, "showFirstButton": { "description": "If <code>true</code>, show the first-page button." }, "showLastButton": { "description": "If <code>true</code>, show the last-page button." }, diff --git a/docs/translations/api-docs/tabs/tabs.json b/docs/translations/api-docs/tabs/tabs.json index b6defc55cbaa9c..3a4c7af7459c7b 100644 --- a/docs/translations/api-docs/tabs/tabs.json +++ b/docs/translations/api-docs/tabs/tabs.json @@ -44,7 +44,7 @@ }, "TabIndicatorProps": { "description": "Props applied to the tab indicator element." }, "TabScrollButtonProps": { - "description": "Props applied to the <a href=\"/material-ui/api/tab-scroll-button/\"><code>TabScrollButton</code></a> element." + "description": "Props applied to the <a href=\"https://mui.com/material-ui/api/tab-scroll-button/\"><code>TabScrollButton</code></a> element." }, "textColor": { "description": "Determines the color of the <code>Tab</code>." }, "value": { diff --git a/docs/translations/api-docs/text-field/text-field.json b/docs/translations/api-docs/text-field/text-field.json index 66a06376e0e8be..a2cd61183a7551 100644 --- a/docs/translations/api-docs/text-field/text-field.json +++ b/docs/translations/api-docs/text-field/text-field.json @@ -17,7 +17,7 @@ "disabled": { "description": "If <code>true</code>, the component is disabled." }, "error": { "description": "If <code>true</code>, the label is displayed in an error state." }, "FormHelperTextProps": { - "description": "Props applied to the <a href=\"/material-ui/api/form-helper-text/\"><code>FormHelperText</code></a> element." + "description": "Props applied to the <a href=\"https://mui.com/material-ui/api/form-helper-text/\"><code>FormHelperText</code></a> element." }, "fullWidth": { "description": "If <code>true</code>, the input will take up the full width of its container." @@ -27,13 +27,13 @@ "description": "The id of the <code>input</code> element. Use this prop to make <code>label</code> and <code>helperText</code> accessible for screen readers." }, "InputLabelProps": { - "description": "Props applied to the <a href=\"/material-ui/api/input-label/\"><code>InputLabel</code></a> element. Pointer events like <code>onClick</code> are enabled if and only if <code>shrink</code> is <code>true</code>." + "description": "Props applied to the <a href=\"https://mui.com/material-ui/api/input-label/\"><code>InputLabel</code></a> element. Pointer events like <code>onClick</code> are enabled if and only if <code>shrink</code> is <code>true</code>." }, "inputProps": { "description": "<a href=\"https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input#Attributes\">Attributes</a> applied to the <code>input</code> element." }, "InputProps": { - "description": "Props applied to the Input element. It will be a <a href=\"/material-ui/api/filled-input/\"><code>FilledInput</code></a>, <a href=\"/material-ui/api/outlined-input/\"><code>OutlinedInput</code></a> or <a href=\"/material-ui/api/input/\"><code>Input</code></a> component depending on the <code>variant</code> prop value." + "description": "Props applied to the Input element. It will be a <a href=\"https://mui.com/material-ui/api/filled-input/\"><code>FilledInput</code></a>, <a href=\"https://mui.com/material-ui/api/outlined-input/\"><code>OutlinedInput</code></a> or <a href=\"https://mui.com/material-ui/api/input/\"><code>Input</code></a> component depending on the <code>variant</code> prop value." }, "inputRef": { "description": "Pass a ref to the <code>input</code> element." }, "label": { "description": "The label content." }, @@ -64,10 +64,10 @@ }, "rows": { "description": "Number of rows to display when multiline option is set to true." }, "select": { - "description": "Render a <a href=\"/material-ui/api/select/\"><code>Select</code></a> element while passing the Input element to <code>Select</code> as <code>input</code> parameter. If this option is set you must pass the options of the select as children." + "description": "Render a <a href=\"https://mui.com/material-ui/api/select/\"><code>Select</code></a> element while passing the Input element to <code>Select</code> as <code>input</code> parameter. If this option is set you must pass the options of the select as children." }, "SelectProps": { - "description": "Props applied to the <a href=\"/material-ui/api/select/\"><code>Select</code></a> element." + "description": "Props applied to the <a href=\"https://mui.com/material-ui/api/select/\"><code>Select</code></a> element." }, "size": { "description": "The size of the component." }, "slotProps": { "description": "The props used for each slot inside." }, diff --git a/docs/translations/api-docs/tooltip/tooltip.json b/docs/translations/api-docs/tooltip/tooltip.json index dc93836d7841a0..27477d14a534a5 100644 --- a/docs/translations/api-docs/tooltip/tooltip.json +++ b/docs/translations/api-docs/tooltip/tooltip.json @@ -50,7 +50,7 @@ "placement": { "description": "Tooltip placement." }, "PopperComponent": { "description": "The component used for the popper." }, "PopperProps": { - "description": "Props applied to the <a href=\"/material-ui/api/popper/\"><code>Popper</code></a> element." + "description": "Props applied to the <a href=\"https://mui.com/material-ui/api/popper/\"><code>Popper</code></a> element." }, "slotProps": { "description": "The extra props for the slot components. You can override the existing props or add new ones.<br>This prop is an alias for the <code>componentsProps</code> prop, which will be deprecated in the future." @@ -65,7 +65,7 @@ "description": "Tooltip title. Zero-length titles string, undefined, null and false are never displayed." }, "TransitionComponent": { - "description": "The component used for the transition. <a href=\"/material-ui/transitions/#transitioncomponent-prop\">Follow this guide</a> to learn more about the requirements for this component." + "description": "The component used for the transition. <a href=\"https://mui.com/material-ui/transitions/#transitioncomponent-prop\">Follow this guide</a> to learn more about the requirements for this component." }, "TransitionProps": { "description": "Props applied to the transition element. By default, the element is based on this <a href=\"https://reactcommunity.org/react-transition-group/transition/\"><code>Transition</code></a> component." diff --git a/examples/base-ui-cra-ts/README.md b/examples/base-ui-cra-ts/README.md index 2029b19cd297d5..7938f7fca126d0 100644 --- a/examples/base-ui-cra-ts/README.md +++ b/examples/base-ui-cra-ts/README.md @@ -11,7 +11,7 @@ Download the example [or clone the repo](https://github.com/mui/material-ui): <!-- #default-branch-switch --> ```bash -curl https://codeload.github.com/mui/material-ui/tar.gz/next | tar -xz --strip=2 material-ui-next/examples/base-ui-cra-ts +curl https://codeload.github.com/mui/material-ui/tar.gz/master | tar -xz --strip=2 material-ui-master/examples/base-ui-cra-ts cd base-ui-cra-ts ``` @@ -26,6 +26,6 @@ or: <!-- #default-branch-switch --> -[![Edit on StackBlitz](https://developer.stackblitz.com/img/open_in_stackblitz.svg)](https://stackblitz.com/github/mui/material-ui/tree/next/examples/base-ui-cra-ts) +[![Edit on StackBlitz](https://developer.stackblitz.com/img/open_in_stackblitz.svg)](https://stackblitz.com/github/mui/material-ui/tree/master/examples/base-ui-cra-ts) -[![Edit on CodeSandbox](https://codesandbox.io/static/img/play-codesandbox.svg)](https://codesandbox.io/p/sandbox/github/mui/material-ui/tree/next/examples/base-ui-cra-ts) +[![Edit on CodeSandbox](https://codesandbox.io/static/img/play-codesandbox.svg)](https://codesandbox.io/p/sandbox/github/mui/material-ui/tree/master/examples/base-ui-cra-ts) diff --git a/examples/base-ui-cra/README.md b/examples/base-ui-cra/README.md index ba507114f7029d..b30905698d8d41 100644 --- a/examples/base-ui-cra/README.md +++ b/examples/base-ui-cra/README.md @@ -11,7 +11,7 @@ Download the example [or clone the repo](https://github.com/mui/material-ui): <!-- #default-branch-switch --> ```bash -curl https://codeload.github.com/mui/material-ui/tar.gz/next | tar -xz --strip=2 material-ui-next/examples/base-ui-cra +curl https://codeload.github.com/mui/material-ui/tar.gz/master | tar -xz --strip=2 material-ui-master/examples/base-ui-cra cd base-ui-cra ``` @@ -26,6 +26,6 @@ or: <!-- #default-branch-switch --> -[![Edit on StackBlitz](https://developer.stackblitz.com/img/open_in_stackblitz.svg)](https://stackblitz.com/github/mui/material-ui/tree/next/examples/base-ui-cra) +[![Edit on StackBlitz](https://developer.stackblitz.com/img/open_in_stackblitz.svg)](https://stackblitz.com/github/mui/material-ui/tree/master/examples/base-ui-cra) -[![Edit on CodeSandbox](https://codesandbox.io/static/img/play-codesandbox.svg)](https://codesandbox.io/p/sandbox/github/mui/material-ui/tree/next/examples/base-ui-cra) +[![Edit on CodeSandbox](https://codesandbox.io/static/img/play-codesandbox.svg)](https://codesandbox.io/p/sandbox/github/mui/material-ui/tree/master/examples/base-ui-cra) diff --git a/examples/base-ui-nextjs-tailwind-ts/README.md b/examples/base-ui-nextjs-tailwind-ts/README.md index 4810c38b4c01ea..3f256ef21693d1 100644 --- a/examples/base-ui-nextjs-tailwind-ts/README.md +++ b/examples/base-ui-nextjs-tailwind-ts/README.md @@ -9,7 +9,7 @@ Download the example [or clone the repo](https://github.com/mui/material-ui): <!-- #default-branch-switch --> ```bash -curl https://codeload.github.com/mui/material-ui/tar.gz/next | tar -xz --strip=2 material-ui-next/examples/base-ui-nextjs-tailwind-ts +curl https://codeload.github.com/mui/material-ui/tar.gz/master | tar -xz --strip=2 material-ui-master/examples/base-ui-nextjs-tailwind-ts cd base-ui-nextjs-tailwind-ts ``` @@ -24,9 +24,9 @@ or <!-- #default-branch-switch --> -[![Edit on StackBlitz](https://developer.stackblitz.com/img/open_in_stackblitz.svg)](https://stackblitz.com/github/mui/material-ui/tree/next/examples/base-ui-nextjs-tailwind-ts) +[![Edit on StackBlitz](https://developer.stackblitz.com/img/open_in_stackblitz.svg)](https://stackblitz.com/github/mui/material-ui/tree/master/examples/base-ui-nextjs-tailwind-ts) -[![Edit on CodeSandbox](https://codesandbox.io/static/img/play-codesandbox.svg)](https://codesandbox.io/p/sandbox/github/mui/material-ui/tree/next/examples/base-ui-nextjs-tailwind-ts) +[![Edit on CodeSandbox](https://codesandbox.io/static/img/play-codesandbox.svg)](https://codesandbox.io/p/sandbox/github/mui/material-ui/tree/master/examples/base-ui-nextjs-tailwind-ts) ## Learn more diff --git a/examples/base-ui-vite-tailwind-ts/README.md b/examples/base-ui-vite-tailwind-ts/README.md index fb1f58b18a3714..4545337ebfed16 100644 --- a/examples/base-ui-vite-tailwind-ts/README.md +++ b/examples/base-ui-vite-tailwind-ts/README.md @@ -10,10 +10,8 @@ Download the example [or clone the repo](https://github.com/mui/material-ui): -<!-- #default-branch-switch --> - ```bash -curl https://codeload.github.com/mui/material-ui/tar.gz/next | tar -xz --strip=2 material-ui-next/examples/base-ui-vite-tailwind-ts +curl https://codeload.github.com/mui/material-ui/tar.gz/master | tar -xz --strip=2 material-ui-master/examples/base-ui-vite-tailwind-ts cd base-ui-vite-tailwind-ts ``` @@ -28,6 +26,6 @@ or: <!-- #default-branch-switch --> -[![Edit on StackBlitz](https://developer.stackblitz.com/img/open_in_stackblitz.svg)](https://stackblitz.com/github/mui/material-ui/tree/next/examples/base-ui-vite-tailwind-ts) +[![Edit on StackBlitz](https://developer.stackblitz.com/img/open_in_stackblitz.svg)](https://stackblitz.com/github/mui/material-ui/tree/master/examples/base-ui-vite-tailwind-ts) -[![Edit on CodeSandbox](https://codesandbox.io/static/img/play-codesandbox.svg)](https://codesandbox.io/p/sandbox/github/mui/material-ui/next/master/examples/base-ui-vite-tailwind-ts) +[![Edit on CodeSandbox](https://codesandbox.io/static/img/play-codesandbox.svg)](https://codesandbox.io/p/sandbox/github/mui/material-ui/tree/master/examples/base-ui-vite-tailwind-ts) diff --git a/examples/base-ui-vite-tailwind/README.md b/examples/base-ui-vite-tailwind/README.md index c9eae3c65e2acc..37e997ae9ec3ee 100644 --- a/examples/base-ui-vite-tailwind/README.md +++ b/examples/base-ui-vite-tailwind/README.md @@ -10,10 +10,8 @@ Download the example [or clone the repo](https://github.com/mui/material-ui): -<!-- #default-branch-switch --> - ```bash -curl https://codeload.github.com/mui/material-ui/tar.gz/next | tar -xz --strip=2 material-ui-next/examples/base-ui-vite-tailwind +curl https://codeload.github.com/mui/material-ui/tar.gz/master | tar -xz --strip=2 material-ui-master/examples/base-ui-vite-tailwind cd base-ui-vite-tailwind ``` @@ -28,6 +26,6 @@ or: <!-- #default-branch-switch --> -[![Edit on StackBlitz](https://developer.stackblitz.com/img/open_in_stackblitz.svg)](https://stackblitz.com/github/mui/material-ui/tree/next/examples/base-ui-vite-tailwind) +[![Edit on StackBlitz](https://developer.stackblitz.com/img/open_in_stackblitz.svg)](https://stackblitz.com/github/mui/material-ui/tree/master/examples/base-ui-vite-tailwind) -[![Edit on CodeSandbox](https://codesandbox.io/static/img/play-codesandbox.svg)](https://codesandbox.io/p/sandbox/github/mui/material-ui/tree/next/examples/base-ui-vite-tailwind) +[![Edit on CodeSandbox](https://codesandbox.io/static/img/play-codesandbox.svg)](https://codesandbox.io/p/sandbox/github/mui/material-ui/tree/master/examples/base-ui-vite-tailwind) diff --git a/examples/joy-ui-cra-ts/README.md b/examples/joy-ui-cra-ts/README.md index e0de9c863fc936..01765382b76618 100644 --- a/examples/joy-ui-cra-ts/README.md +++ b/examples/joy-ui-cra-ts/README.md @@ -9,7 +9,7 @@ Download the example [or clone the repo](https://github.com/mui/material-ui): <!-- #default-branch-switch --> ```bash -curl https://codeload.github.com/mui/material-ui/tar.gz/next | tar -xz --strip=2 material-ui-next/examples/joy-ui-cra-ts +curl https://codeload.github.com/mui/material-ui/tar.gz/master | tar -xz --strip=2 material-ui-master/examples/joy-ui-cra-ts cd joy-ui-cra-ts ``` @@ -24,13 +24,13 @@ or: <!-- #default-branch-switch --> -[![Edit on StackBlitz](https://developer.stackblitz.com/img/open_in_stackblitz.svg)](https://stackblitz.com/github/mui/material-ui/tree/next/examples/joy-ui-cra-ts) +[![Edit on StackBlitz](https://developer.stackblitz.com/img/open_in_stackblitz.svg)](https://stackblitz.com/github/mui/material-ui/tree/master/examples/joy-ui-cra-ts) -[![Edit on CodeSandbox](https://codesandbox.io/static/img/play-codesandbox.svg)](https://codesandbox.io/p/sandbox/github/mui/material-ui/tree/next/examples/joy-ui-cra-ts) +[![Edit on CodeSandbox](https://codesandbox.io/static/img/play-codesandbox.svg)](https://codesandbox.io/p/sandbox/github/mui/material-ui/tree/master/examples/joy-ui-cra-ts) ## What's next? <!-- #default-branch-switch --> You now have a working example project. -You can head back to the documentation and continue by browsing the [templates](https://next.mui.com/joy-ui/getting-started/templates/) section. +You can head back to the documentation and continue by browsing the [templates](https://mui.com/joy-ui/getting-started/templates/) section. diff --git a/examples/joy-ui-nextjs-ts/README.md b/examples/joy-ui-nextjs-ts/README.md index 5be78719e54c3a..796dc1137db89c 100644 --- a/examples/joy-ui-nextjs-ts/README.md +++ b/examples/joy-ui-nextjs-ts/README.md @@ -9,7 +9,7 @@ Download the example [or clone the repo](https://github.com/mui/material-ui): <!-- #default-branch-switch --> ```bash -curl https://codeload.github.com/mui/material-ui/tar.gz/next | tar -xz --strip=2 material-ui-next/examples/joy-ui-nextjs-ts +curl https://codeload.github.com/mui/material-ui/tar.gz/master | tar -xz --strip=2 material-ui-master/examples/joy-ui-nextjs-ts cd joy-ui-nextjs-ts ``` @@ -26,9 +26,9 @@ or: <!-- #default-branch-switch --> -[![Edit on StackBlitz](https://developer.stackblitz.com/img/open_in_stackblitz.svg)](https://stackblitz.com/github/mui/material-ui/tree/next/examples/joy-ui-nextjs-ts) +[![Edit on StackBlitz](https://developer.stackblitz.com/img/open_in_stackblitz.svg)](https://stackblitz.com/github/mui/material-ui/tree/master/examples/joy-ui-nextjs-ts) -[![Edit on CodeSandbox](https://codesandbox.io/static/img/play-codesandbox.svg)](https://codesandbox.io/p/sandbox/github/mui/material-ui/tree/next/examples/joy-ui-nextjs-ts) +[![Edit on CodeSandbox](https://codesandbox.io/static/img/play-codesandbox.svg)](https://codesandbox.io/p/sandbox/github/mui/material-ui/tree/master/examples/joy-ui-nextjs-ts) ## Learn more @@ -42,4 +42,4 @@ To learn more about this example: <!-- #default-branch-switch --> You now have a working example project. -You can head back to the documentation and continue by browsing the [templates](https://next.mui.com/joy-ui/getting-started/templates/) section. +You can head back to the documentation and continue by browsing the [templates](https://mui.com/joy-ui/getting-started/templates/) section. diff --git a/examples/joy-ui-vite-ts/README.md b/examples/joy-ui-vite-ts/README.md index 573ee7874108e2..dcc482bdfd04d9 100644 --- a/examples/joy-ui-vite-ts/README.md +++ b/examples/joy-ui-vite-ts/README.md @@ -11,7 +11,7 @@ Download the example [or clone the repo](https://github.com/mui/material-ui): <!-- #default-branch-switch --> ```bash -curl https://codeload.github.com/mui/material-ui/tar.gz/next | tar -xz --strip=2 material-ui-next/examples/joy-ui-vite-ts +curl https://codeload.github.com/mui/material-ui/tar.gz/master | tar -xz --strip=2 material-ui-master/examples/joy-ui-vite-ts cd joy-ui-vite-ts ``` @@ -26,9 +26,9 @@ or: <!-- #default-branch-switch --> -[![Edit on StackBlitz](https://developer.stackblitz.com/img/open_in_stackblitz.svg)](https://stackblitz.com/github/mui/material-ui/tree/next/examples/joy-ui-vite-ts) +[![Edit on StackBlitz](https://developer.stackblitz.com/img/open_in_stackblitz.svg)](https://stackblitz.com/github/mui/material-ui/tree/master/examples/joy-ui-vite-ts) -[![Edit on CodeSandbox](https://codesandbox.io/static/img/play-codesandbox.svg)](https://codesandbox.io/p/sandbox/github/mui/material-ui/tree/next/examples/joy-ui-vite-ts) +[![Edit on CodeSandbox](https://codesandbox.io/static/img/play-codesandbox.svg)](https://codesandbox.io/p/sandbox/github/mui/material-ui/tree/master/examples/joy-ui-vite-ts) ## The idea behind the example @@ -40,4 +40,4 @@ It includes `@mui/joy` and it's peer dependencies. <!-- #default-branch-switch --> You now have a working example project. -You can head back to the documentation and continue by browsing the [templates](https://next.mui.com/joy-ui/getting-started/templates/) section. +You can head back to the documentation and continue by browsing the [templates](https://mui.com/joy-ui/getting-started/templates/) section. diff --git a/examples/material-ui-cra-styled-components-ts/README.md b/examples/material-ui-cra-styled-components-ts/README.md index e4fe2372157f31..4fa59826c2ab3b 100644 --- a/examples/material-ui-cra-styled-components-ts/README.md +++ b/examples/material-ui-cra-styled-components-ts/README.md @@ -23,7 +23,7 @@ Download the example [or clone the repo](https://github.com/mui/material-ui): <!-- #default-branch-switch --> ```bash -curl https://codeload.github.com/mui/material-ui/tar.gz/next | tar -xz --strip=2 material-ui-next/examples/material-ui-cra-styled-components-ts +curl https://codeload.github.com/mui/material-ui/tar.gz/master | tar -xz --strip=2 material-ui-master/examples/material-ui-cra-styled-components-ts cd material-ui-cra-styled-components-ts ``` @@ -40,7 +40,7 @@ npm start Note that CodeSandbox is not supporting react-app-rewired, yet you can [still see the code](https://codesandbox.io/p/sandbox/github/mui/material-ui/tree/master/examples/material-ui-cra-styled-components-ts). -The following link leverages this demo: https://next.mui.com/material-ui/integrations/interoperability/#change-the-default-styled-engine with Parcel's alias feature within the `package.json`. +The following link leverages this demo: https://mui.com/material-ui/integrations/interoperability/#change-the-default-styled-engine with Parcel's alias feature within the `package.json`. [![Edit on CodeSandbox](https://codesandbox.io/static/img/play-codesandbox.svg)](https://codesandbox.io/p/sandbox/styled-components-interoperability-w9z9d) @@ -57,4 +57,4 @@ Note, the version 5 of `@mui/styled-engine-sc` is compatible with version 5 of ` <!-- #default-branch-switch --> You now have a working example project. -You can head back to the documentation and continue by browsing the [templates](https://next.mui.com/material-ui/getting-started/templates/) section. +You can head back to the documentation and continue by browsing the [templates](https://mui.com/material-ui/getting-started/templates/) section. diff --git a/examples/material-ui-cra-styled-components-ts/package.json b/examples/material-ui-cra-styled-components-ts/package.json index b1ebe2eec3f1ee..28d472c7e007b9 100644 --- a/examples/material-ui-cra-styled-components-ts/package.json +++ b/examples/material-ui-cra-styled-components-ts/package.json @@ -3,9 +3,9 @@ "version": "5.0.0", "private": true, "dependencies": { - "@mui/lab": "next", - "@mui/material": "next", - "@mui/styled-engine-sc": "next", + "@mui/lab": "latest", + "@mui/material": "latest", + "@mui/styled-engine-sc": "latest", "@testing-library/jest-dom": "latest", "@testing-library/react": "latest", "@testing-library/user-event": "latest", diff --git a/examples/material-ui-cra-styled-components/README.md b/examples/material-ui-cra-styled-components/README.md index b8f29298bc033a..e4a94251ed7bc8 100644 --- a/examples/material-ui-cra-styled-components/README.md +++ b/examples/material-ui-cra-styled-components/README.md @@ -7,7 +7,7 @@ Download the example [or clone the repo](https://github.com/mui/material-ui): <!-- #default-branch-switch --> ```bash -curl https://codeload.github.com/mui/material-ui/tar.gz/next | tar -xz --strip=2 material-ui-next/examples/material-ui-cra-styled-components +curl https://codeload.github.com/mui/material-ui/tar.gz/master | tar -xz --strip=2 material-ui-master/examples/material-ui-cra-styled-components cd material-ui-cra-styled-components ``` @@ -24,7 +24,7 @@ npm start Note that CodeSandbox is not supporting react-app-rewired, yet you can [still see the code](https://codesandbox.io/p/sandbox/github/mui/material-ui/tree/master/examples/material-ui-cra-styled-components). -The following link leverages this demo: https://next.mui.com/material-ui/integrations/interoperability/#change-the-default-styled-engine with Parcel's alias feature within the `package.json`. +The following link leverages this demo: https://mui.com/material-ui/integrations/interoperability/#change-the-default-styled-engine with Parcel's alias feature within the `package.json`. [![Edit on CodeSandbox](https://codesandbox.io/static/img/play-codesandbox.svg)](https://codesandbox.io/p/sandbox/styled-components-interoperability-w9z9d) @@ -41,4 +41,4 @@ Note, the version 5 of `@mui/styled-engine-sc` is compatible with version 5 of ` <!-- #default-branch-switch --> You now have a working example project. -You can head back to the documentation and continue by browsing the [templates](https://next.mui.com/material-ui/getting-started/templates/) section. +You can head back to the documentation and continue by browsing the [templates](https://mui.com/material-ui/getting-started/templates/) section. diff --git a/examples/material-ui-cra-styled-components/package.json b/examples/material-ui-cra-styled-components/package.json index e0ab5b95a41d9e..2851457439f64a 100644 --- a/examples/material-ui-cra-styled-components/package.json +++ b/examples/material-ui-cra-styled-components/package.json @@ -3,9 +3,9 @@ "version": "5.0.0", "private": true, "dependencies": { - "@mui/material": "next", - "@mui/lab": "next", - "@mui/styled-engine-sc": "next", + "@mui/material": "latest", + "@mui/lab": "latest", + "@mui/styled-engine-sc": "latest", "@testing-library/jest-dom": "latest", "@testing-library/react": "latest", "@testing-library/user-event": "latest", diff --git a/examples/material-ui-cra-tailwind-ts/README.md b/examples/material-ui-cra-tailwind-ts/README.md index 614cb515ce76c5..f4f8e5f13deb58 100644 --- a/examples/material-ui-cra-tailwind-ts/README.md +++ b/examples/material-ui-cra-tailwind-ts/README.md @@ -7,7 +7,7 @@ Download the example [or clone the repo](https://github.com/mui/material-ui): <!-- #default-branch-switch --> ```bash -curl https://codeload.github.com/mui/material-ui/tar.gz/next | tar -xz --strip=2 material-ui-next/examples/material-ui-cra-tailwind-ts +curl https://codeload.github.com/mui/material-ui/tar.gz/master | tar -xz --strip=2 material-ui-master/examples/material-ui-cra-tailwind-ts cd material-ui-cra-tailwind-ts ``` @@ -22,10 +22,12 @@ or: <!-- #default-branch-switch --> -[![Edit on StackBlitz](https://developer.stackblitz.com/img/open_in_stackblitz.svg)](https://stackblitz.com/github/mui/material-ui/tree/next/examples/material-ui-cra-tailwind-ts) +[![Edit on StackBlitz](https://developer.stackblitz.com/img/open_in_stackblitz.svg)](https://stackblitz.com/github/mui/material-ui/tree/master/examples/material-ui-cra-tailwind-ts) ## The idea behind the example +<!-- #default-branch-switch --> + This example demonstrates how you can use [Tailwind CSS](https://tailwindcss.com/) and [Create React App](https://github.com/facebookincubator/create-react-app) together with Material UI. It includes `@mui/material` and its peer dependencies, including [Emotion](https://emotion.sh/docs/introduction), the default style engine in Material UI v6. @@ -34,4 +36,4 @@ It includes `@mui/material` and its peer dependencies, including [Emotion](https <!-- #default-branch-switch --> You now have a working example project. -You can head back to the documentation and continue by browsing the [templates](https://next.mui.com/material-ui/getting-started/templates/) section. +You can head back to the documentation and continue by browsing the [templates](https://mui.com/material-ui/getting-started/templates/) section. diff --git a/examples/material-ui-cra-tailwind-ts/package.json b/examples/material-ui-cra-tailwind-ts/package.json index 9eb5a216e038a9..7e5501badd283f 100644 --- a/examples/material-ui-cra-tailwind-ts/package.json +++ b/examples/material-ui-cra-tailwind-ts/package.json @@ -5,7 +5,7 @@ "dependencies": { "@emotion/react": "latest", "@emotion/styled": "latest", - "@mui/material": "next", + "@mui/material": "latest", "@testing-library/jest-dom": "latest", "@testing-library/react": "latest", "@testing-library/user-event": "latest", diff --git a/examples/material-ui-cra-ts/README.md b/examples/material-ui-cra-ts/README.md index 3841507285ad27..dfd9da114d38ae 100644 --- a/examples/material-ui-cra-ts/README.md +++ b/examples/material-ui-cra-ts/README.md @@ -7,7 +7,7 @@ Download the example [or clone the repo](https://github.com/mui/material-ui): <!-- #default-branch-switch --> ```bash -curl https://codeload.github.com/mui/material-ui/tar.gz/next | tar -xz --strip=2 material-ui-next/examples/material-ui-cra-ts +curl https://codeload.github.com/mui/material-ui/tar.gz/master | tar -xz --strip=2 material-ui-master/examples/material-ui-cra-ts cd material-ui-cra-ts ``` @@ -22,19 +22,19 @@ or: <!-- #default-branch-switch --> -[![Edit on CodeSandbox](https://codesandbox.io/static/img/play-codesandbox.svg)](https://codesandbox.io/p/sandbox/github/mui/material-ui/tree/next/examples/material-ui-cra-ts) +[![Edit on CodeSandbox](https://codesandbox.io/static/img/play-codesandbox.svg)](https://codesandbox.io/p/sandbox/github/mui/material-ui/tree/master/examples/material-ui-cra-ts) -[![Edit on StackBlitz](https://developer.stackblitz.com/img/open_in_stackblitz.svg)](https://stackblitz.com/github/mui/material-ui/tree/next/examples/material-ui-cra-ts) +[![Edit on StackBlitz](https://developer.stackblitz.com/img/open_in_stackblitz.svg)](https://stackblitz.com/github/mui/material-ui/tree/master/examples/material-ui-cra-ts) ## The idea behind the example This example demonstrates how you can use Material UI with [Create React App](https://github.com/facebookincubator/create-react-app) in [TypeScript](https://github.com/Microsoft/TypeScript). It includes `@mui/material` and its peer dependencies, including [Emotion](https://emotion.sh/docs/introduction), the default style engine in Material UI v6. -If you prefer, you can [use styled-components instead](https://next.mui.com/material-ui/integrations/interoperability/#styled-components). +If you prefer, you can [use styled-components instead](https://mui.com/material-ui/integrations/interoperability/#styled-components). ## What's next? <!-- #default-branch-switch --> You now have a working example project. -You can head back to the documentation and continue by browsing the [templates](https://next.mui.com/material-ui/getting-started/templates/) section. +You can head back to the documentation and continue by browsing the [templates](https://mui.com/material-ui/getting-started/templates/) section. diff --git a/examples/material-ui-cra-ts/package.json b/examples/material-ui-cra-ts/package.json index 3e67fb74443fe6..943a2266ee3186 100644 --- a/examples/material-ui-cra-ts/package.json +++ b/examples/material-ui-cra-ts/package.json @@ -5,7 +5,7 @@ "dependencies": { "@emotion/react": "latest", "@emotion/styled": "latest", - "@mui/material": "next", + "@mui/material": "latest", "@types/react": "latest", "@types/react-dom": "latest", "react": "latest", diff --git a/examples/material-ui-cra/README.md b/examples/material-ui-cra/README.md index d467d5a6bd7d34..94dbc3515b6db6 100644 --- a/examples/material-ui-cra/README.md +++ b/examples/material-ui-cra/README.md @@ -7,7 +7,7 @@ Download the example [or clone the repo](https://github.com/mui/material-ui): <!-- #default-branch-switch --> ```bash -curl https://codeload.github.com/mui/material-ui/tar.gz/next | tar -xz --strip=2 material-ui-next/examples/material-ui-cra +curl https://codeload.github.com/mui/material-ui/tar.gz/master | tar -xz --strip=2 material-ui-master/examples/material-ui-cra cd material-ui-cra ``` @@ -22,9 +22,9 @@ or: <!-- #default-branch-switch --> -[![Edit on CodeSandbox](https://codesandbox.io/static/img/play-codesandbox.svg)](https://codesandbox.io/p/sandbox/github/mui/material-ui/tree/next/examples/material-ui-cra) +[![Edit on CodeSandbox](https://codesandbox.io/static/img/play-codesandbox.svg)](https://codesandbox.io/p/sandbox/github/mui/material-ui/tree/master/examples/material-ui-cra) -[![Edit on StackBlitz](https://developer.stackblitz.com/img/open_in_stackblitz.svg)](https://stackblitz.com/github/mui/material-ui/tree/next/examples/material-ui-cra) +[![Edit on StackBlitz](https://developer.stackblitz.com/img/open_in_stackblitz.svg)](https://stackblitz.com/github/mui/material-ui/tree/master/examples/material-ui-cra) ## The idea behind the example @@ -32,11 +32,11 @@ or: This example demonstrates how you can use [Create React App](https://github.com/facebookincubator/create-react-app) with Material UI. It includes `@mui/material` and its peer dependencies, including [Emotion](https://emotion.sh/docs/introduction), the default style engine in Material UI v6. -If you prefer, you can [use styled-components instead](https://next.mui.com/material-ui/integrations/interoperability/#styled-components). +If you prefer, you can [use styled-components instead](https://mui.com/material-ui/integrations/interoperability/#styled-components). ## What's next? <!-- #default-branch-switch --> You now have a working example project. -You can head back to the documentation and continue by browsing the [templates](https://next.mui.com/material-ui/getting-started/templates/) section. +You can head back to the documentation and continue by browsing the [templates](https://mui.com/material-ui/getting-started/templates/) section. diff --git a/examples/material-ui-cra/package.json b/examples/material-ui-cra/package.json index e564d3c240a503..b7490d21c0d880 100644 --- a/examples/material-ui-cra/package.json +++ b/examples/material-ui-cra/package.json @@ -11,7 +11,7 @@ "dependencies": { "@emotion/react": "latest", "@emotion/styled": "latest", - "@mui/material": "next", + "@mui/material": "latest", "react": "latest", "react-dom": "latest", "react-scripts": "latest" diff --git a/examples/material-ui-express-ssr/README.md b/examples/material-ui-express-ssr/README.md index f90ae384919690..2ee2fbc7f97917 100644 --- a/examples/material-ui-express-ssr/README.md +++ b/examples/material-ui-express-ssr/README.md @@ -7,7 +7,7 @@ Download the example [or clone the repo](https://github.com/mui/material-ui): <!-- #default-branch-switch --> ```bash -curl https://codeload.github.com/mui/material-ui/tar.gz/next | tar -xz --strip=2 material-ui-next/examples/material-ui-express-ssr +curl https://codeload.github.com/mui/material-ui/tar.gz/master | tar -xz --strip=2 material-ui-master/examples/material-ui-express-ssr cd material-ui-express-ssr ``` @@ -22,20 +22,20 @@ or: <!-- #default-branch-switch --> -[![Edit on StackBlitz](https://developer.stackblitz.com/img/open_in_stackblitz.svg)](https://stackblitz.com/github/mui/material-ui/tree/next/examples/material-ui-express-ssr) +[![Edit on StackBlitz](https://developer.stackblitz.com/img/open_in_stackblitz.svg)](https://stackblitz.com/github/mui/material-ui/tree/master/examples/material-ui-express-ssr) -[![Edit on CodeSandbox](https://codesandbox.io/static/img/play-codesandbox.svg)](https://codesandbox.io/p/sandbox/github/mui/material-ui/tree/next/examples/material-ui-express-ssr) +[![Edit on CodeSandbox](https://codesandbox.io/static/img/play-codesandbox.svg)](https://codesandbox.io/p/sandbox/github/mui/material-ui/tree/master/examples/material-ui-express-ssr) ## The idea behind the example -This is the reference implementation of the [Server Rendering tutorial](https://next.mui.com/material-ui/guides/server-rendering/). +This is the reference implementation of the [Server Rendering tutorial](https://mui.com/material-ui/guides/server-rendering/). The example project includes `@mui/material` and its peer dependencies, including [Emotion](https://emotion.sh/docs/introduction), the default style engine in Material UI v6. -If you prefer, you can [use styled-components instead](https://next.mui.com/material-ui/integrations/interoperability/#styled-components). +If you prefer, you can [use styled-components instead](https://mui.com/material-ui/integrations/interoperability/#styled-components). ## What's next? <!-- #default-branch-switch --> You now have a working example project. -You can head back to the documentation and continue by browsing the [templates](https://next.mui.com/material-ui/getting-started/templates/) section. +You can head back to the documentation and continue by browsing the [templates](https://mui.com/material-ui/getting-started/templates/) section. diff --git a/examples/material-ui-express-ssr/package.json b/examples/material-ui-express-ssr/package.json index 247b74df4cc922..70631b8b2b9155 100644 --- a/examples/material-ui-express-ssr/package.json +++ b/examples/material-ui-express-ssr/package.json @@ -15,7 +15,7 @@ "@emotion/react": "latest", "@emotion/styled": "latest", "@emotion/server": "latest", - "@mui/material": "next", + "@mui/material": "latest", "babel-loader": "latest", "cross-env": "latest", "express": "latest", diff --git a/examples/material-ui-gatsby/README.md b/examples/material-ui-gatsby/README.md index 8902f146c90127..afdad50c1d209b 100644 --- a/examples/material-ui-gatsby/README.md +++ b/examples/material-ui-gatsby/README.md @@ -7,7 +7,7 @@ Download the example [or clone the repo](https://github.com/mui/material-ui): <!-- #default-branch-switch --> ```bash -curl https://codeload.github.com/mui/material-ui/tar.gz/next | tar -xz --strip=2 material-ui-next/examples/material-ui-gatsby +curl https://codeload.github.com/mui/material-ui/tar.gz/master | tar -xz --strip=2 material-ui-master/examples/material-ui-gatsby cd material-ui-gatsby ``` @@ -22,11 +22,11 @@ npm run develop The project uses [Gatsby](https://github.com/gatsbyjs/gatsby), which is a static site generator for React. It includes `@mui/material` and its peer dependencies, including [Emotion](https://emotion.sh/docs/introduction), the default style engine in Material UI v6. -If you prefer, you can [use styled-components instead](https://next.mui.com/material-ui/integrations/interoperability/#styled-components). +If you prefer, you can [use styled-components instead](https://mui.com/material-ui/integrations/interoperability/#styled-components). ## What's next? <!-- #default-branch-switch --> You now have a working example project. -You can head back to the documentation and continue by browsing the [templates](https://next.mui.com/material-ui/getting-started/templates/) section. +You can head back to the documentation and continue by browsing the [templates](https://mui.com/material-ui/getting-started/templates/) section. diff --git a/examples/material-ui-gatsby/package.json b/examples/material-ui-gatsby/package.json index 817e3e8e4d1b30..a705fd375a4fed 100644 --- a/examples/material-ui-gatsby/package.json +++ b/examples/material-ui-gatsby/package.json @@ -10,7 +10,7 @@ "@emotion/react": "latest", "@emotion/server": "latest", "@emotion/styled": "latest", - "@mui/material": "next", + "@mui/material": "latest", "gatsby": "latest", "gatsby-plugin-react-helmet": "latest", "react": "latest", diff --git a/examples/material-ui-nextjs-pages-router-ts/README.md b/examples/material-ui-nextjs-pages-router-ts/README.md index 0d0c7bab57fb2e..25e32aa803cfd2 100644 --- a/examples/material-ui-nextjs-pages-router-ts/README.md +++ b/examples/material-ui-nextjs-pages-router-ts/README.md @@ -7,7 +7,7 @@ Download the example [or clone the repo](https://github.com/mui/material-ui): <!-- #default-branch-switch --> ```bash -curl https://codeload.github.com/mui/material-ui/tar.gz/next | tar -xz --strip=2 material-ui-next/examples/material-ui-nextjs-pages-router-ts +curl https://codeload.github.com/mui/material-ui/tar.gz/master | tar -xz --strip=2 material-ui-master/examples/material-ui-nextjs-pages-router-ts cd material-ui-nextjs-pages-router-ts ``` @@ -22,28 +22,28 @@ or: <!-- #default-branch-switch --> -[![Edit on StackBlitz](https://developer.stackblitz.com/img/open_in_stackblitz.svg)](https://stackblitz.com/github/mui/material-ui/tree/next/examples/material-ui-nextjs-pages-router-ts) +[![Edit on StackBlitz](https://developer.stackblitz.com/img/open_in_stackblitz.svg)](https://stackblitz.com/github/mui/material-ui/tree/master/examples/material-ui-nextjs-pages-router-ts) -[![Edit on CodeSandbox](https://codesandbox.io/static/img/play-codesandbox.svg)](https://codesandbox.io/p/sandbox/github/mui/material-ui/tree/next/examples/material-ui-nextjs-pages-router-ts) +[![Edit on CodeSandbox](https://codesandbox.io/static/img/play-codesandbox.svg)](https://codesandbox.io/p/sandbox/github/mui/material-ui/tree/master/examples/material-ui-nextjs-pages-router-ts) ## The idea behind the example **Note:** This example is set up to use the Next.js Pages Router. As of Next.js 13.4, the newer App Router pattern is stable. -We recommend starting new projects with the [Material UI with Next.js (App Router) example](https://github.com/mui/material-ui/tree/next/examples/material-ui-nextjs-ts) unless you need (or prefer) the Pages Router. +We recommend starting new projects with the [Material UI with Next.js (App Router) example](https://github.com/mui/material-ui/tree/master/examples/material-ui-nextjs-ts) unless you need (or prefer) the Pages Router. The project uses [Next.js](https://github.com/vercel/next.js), which is a framework for server-rendered React apps. It includes `@mui/material` and its peer dependencies, including [Emotion](https://emotion.sh/docs/introduction), the default style engine in Material UI v6. -If you prefer, you can [use styled-components instead](https://next.mui.com/material-ui/integrations/interoperability/#styled-components). +If you prefer, you can [use styled-components instead](https://mui.com/material-ui/integrations/interoperability/#styled-components). ## The link component The [example folder](https://github.com/mui/material-ui/tree/HEAD/examples/material-ui-nextjs-pages-router-ts) provides an adapter for the use of [Next.js's Link component](https://nextjs.org/docs/pages/api-reference/components/link) with Material UI. -More information [in the documentation](https://next.mui.com/material-ui/integrations/routing/#next-js-pages-router). +More information [in the documentation](https://mui.com/material-ui/integrations/routing/#next-js-pages-router). ## What's next? <!-- #default-branch-switch --> You now have a working example project. -You can head back to the documentation and continue by browsing the [templates](https://next.mui.com/material-ui/getting-started/templates/) section. +You can head back to the documentation and continue by browsing the [templates](https://mui.com/material-ui/getting-started/templates/) section. diff --git a/examples/material-ui-nextjs-pages-router-ts/package.json b/examples/material-ui-nextjs-pages-router-ts/package.json index 269e388c33e9b0..1b522774bc1e53 100644 --- a/examples/material-ui-nextjs-pages-router-ts/package.json +++ b/examples/material-ui-nextjs-pages-router-ts/package.json @@ -14,9 +14,9 @@ "@emotion/react": "latest", "@emotion/server": "latest", "@emotion/styled": "latest", - "@mui/icons-material": "next", - "@mui/material": "next", - "@mui/material-nextjs": "next", + "@mui/icons-material": "latest", + "@mui/material": "latest", + "@mui/material-nextjs": "latest", "next": "latest", "react": "latest", "react-dom": "latest" diff --git a/examples/material-ui-nextjs-pages-router/README.md b/examples/material-ui-nextjs-pages-router/README.md index e2073b85d66a0e..50453acf21f548 100644 --- a/examples/material-ui-nextjs-pages-router/README.md +++ b/examples/material-ui-nextjs-pages-router/README.md @@ -7,7 +7,7 @@ Download the example [or clone the repo](https://github.com/mui/material-ui): <!-- #default-branch-switch --> ```bash -curl https://codeload.github.com/mui/material-ui/tar.gz/next | tar -xz --strip=2 material-ui-next/examples/material-ui-nextjs-pages-router +curl https://codeload.github.com/mui/material-ui/tar.gz/master | tar -xz --strip=2 material-ui-master/examples/material-ui-nextjs-pages-router cd material-ui-nextjs-pages-router ``` @@ -22,28 +22,28 @@ or: <!-- #default-branch-switch --> -[![Edit on StackBlitz](https://developer.stackblitz.com/img/open_in_stackblitz.svg)](https://stackblitz.com/github/mui/material-ui/tree/next/examples/material-ui-nextjs-pages-router) +[![Edit on StackBlitz](https://developer.stackblitz.com/img/open_in_stackblitz.svg)](https://stackblitz.com/github/mui/material-ui/tree/master/examples/material-ui-nextjs-pages-router) -[![Edit on CodeSandbox](https://codesandbox.io/static/img/play-codesandbox.svg)](https://codesandbox.io/p/sandbox/github/mui/material-ui/tree/next/examples/material-ui-nextjs-pages-router) +[![Edit on CodeSandbox](https://codesandbox.io/static/img/play-codesandbox.svg)](https://codesandbox.io/p/sandbox/github/mui/material-ui/tree/master/examples/material-ui-nextjs-pages-router) ## The idea behind the example **Note:** This example is set up to use the Next.js Pages Router. As of Next.js 13.4, the newer App Router pattern is stable. -We recommend starting new projects with the [Material UI with Next.js (App Router) example](https://github.com/mui/material-ui/tree/next/examples/material-ui-nextjs) unless you need (or prefer) the Pages Router. +We recommend starting new projects with the [Material UI with Next.js (App Router) example](https://github.com/mui/material-ui/tree/master/examples/material-ui-nextjs) unless you need (or prefer) the Pages Router. The project uses [Next.js](https://github.com/vercel/next.js), which is a framework for server-rendered React apps. It includes `@mui/material` and its peer dependencies, including [Emotion](https://emotion.sh/docs/introduction), the default style engine in Material UI v6. -If you prefer, you can [use styled-components instead](https://next.mui.com/material-ui/integrations/interoperability/#styled-components). +If you prefer, you can [use styled-components instead](https://mui.com/material-ui/integrations/interoperability/#styled-components). ## The Link component The [example folder](https://github.com/mui/material-ui/tree/HEAD/examples/material-ui-nextjs-pages-router) provides an adapter for the use of [Next.js's Link component](https://nextjs.org/docs/pages/api-reference/components/link) with Material UI. -More information [in the documentation](https://next.mui.com/material-ui/integrations/routing/#next-js-pages-router). +More information [in the documentation](https://mui.com/material-ui/integrations/routing/#next-js-pages-router). ## What's next? <!-- #default-branch-switch --> You now have a working example project. -You can head back to the documentation and continue by browsing the [templates](https://next.mui.com/material-ui/getting-started/templates/) section. +You can head back to the documentation and continue by browsing the [templates](https://mui.com/material-ui/getting-started/templates/) section. diff --git a/examples/material-ui-nextjs-pages-router/package.json b/examples/material-ui-nextjs-pages-router/package.json index c092584d7e7da0..a246af69d94433 100644 --- a/examples/material-ui-nextjs-pages-router/package.json +++ b/examples/material-ui-nextjs-pages-router/package.json @@ -14,9 +14,9 @@ "@emotion/react": "latest", "@emotion/server": "latest", "@emotion/styled": "latest", - "@mui/icons-material": "next", - "@mui/material": "next", - "@mui/material-nextjs": "next", + "@mui/icons-material": "latest", + "@mui/material": "latest", + "@mui/material-nextjs": "latest", "next": "latest", "prop-types": "latest", "react": "latest", diff --git a/examples/material-ui-nextjs-ts-v4-v5-migration/README.md b/examples/material-ui-nextjs-ts-v4-v5-migration/README.md index 1360296146ad15..5e735a257caa98 100644 --- a/examples/material-ui-nextjs-ts-v4-v5-migration/README.md +++ b/examples/material-ui-nextjs-ts-v4-v5-migration/README.md @@ -7,7 +7,7 @@ Download the example [or clone the repo](https://github.com/mui/material-ui): <!-- #default-branch-switch --> ```bash -curl https://codeload.github.com/mui/material-ui/tar.gz/next | tar -xz --strip=2 material-ui-next/examples/material-ui-nextjs-ts-v4-v5-migration +curl https://codeload.github.com/mui/material-ui/tar.gz/master | tar -xz --strip=2 material-ui-master/examples/material-ui-nextjs-ts-v4-v5-migration cd material-ui-nextjs-ts-v4-v5-migration ``` @@ -22,23 +22,23 @@ or: <!-- #default-branch-switch --> -[![Edit on StackBlitz](https://developer.stackblitz.com/img/open_in_stackblitz.svg)](https://stackblitz.com/github/mui/material-ui/tree/next/examples/material-ui-nextjs-ts-v4-v5-migration) +[![Edit on StackBlitz](https://developer.stackblitz.com/img/open_in_stackblitz.svg)](https://stackblitz.com/github/mui/material-ui/tree/master/examples/material-ui-nextjs-ts-v4-v5-migration) -[![Edit on CodeSandbox](https://codesandbox.io/static/img/play-codesandbox.svg)](https://codesandbox.io/p/sandbox/github/mui/material-ui/tree/next/examples/material-ui-nextjs-ts-v4-v5-migration) +[![Edit on CodeSandbox](https://codesandbox.io/static/img/play-codesandbox.svg)](https://codesandbox.io/p/sandbox/github/mui/material-ui/tree/master/examples/material-ui-nextjs-ts-v4-v5-migration) ## The idea behind the example The project uses [Next.js](https://github.com/vercel/next.js), which is a framework for server-rendered React apps. It includes `@mui/material` and its peer dependencies, including [Emotion](https://emotion.sh/docs/introduction), the default style engine in Material UI v6. -If you prefer, you can [use styled-components instead](https://next.mui.com/material-ui/integrations/interoperability/#styled-components). +If you prefer, you can [use styled-components instead](https://mui.com/material-ui/integrations/interoperability/#styled-components). It also includes `@mui/styles`, the legacy styling solution that uses JSS as an engine. It provides all the necessary config for working with both Emotion and JSS for server-side rendering. The project is intended as a basic starter for migrating your application from v4 to v5, as it lets the JSS style overrides take precedence over the default styles passed to the components by Emotion. -It demonstrates what results after handling v5's breaking changes to the [theme](https://next.mui.com/material-ui/migration/v5-style-changes/) and [components](https://next.mui.com/material-ui/migration/v5-component-changes/). +It demonstrates what results after handling v5's breaking changes to the [theme](https://mui.com/material-ui/migration/v5-style-changes/) and [components](https://mui.com/material-ui/migration/v5-component-changes/). ## The Link component Next.js Pages Router has [a custom Link component](https://nextjs.org/docs/pages/api-reference/components/link). The example folder provides adapters for usage with Material UI. -You can find more information [in the documentation](https://next.mui.com/material-ui/integrations/routing/#next-js-pages-router). +You can find more information [in the documentation](https://mui.com/material-ui/integrations/routing/#next-js-pages-router). diff --git a/examples/material-ui-nextjs-ts-v4-v5-migration/package.json b/examples/material-ui-nextjs-ts-v4-v5-migration/package.json index 5de92715b5ff57..a67c1d3d9aebd5 100644 --- a/examples/material-ui-nextjs-ts-v4-v5-migration/package.json +++ b/examples/material-ui-nextjs-ts-v4-v5-migration/package.json @@ -14,9 +14,9 @@ "@emotion/react": "latest", "@emotion/server": "latest", "@emotion/styled": "latest", - "@mui/icons-material": "next", - "@mui/material": "next", - "@mui/material-nextjs": "next", + "@mui/icons-material": "latest", + "@mui/material": "latest", + "@mui/material-nextjs": "latest", "@mui/styles": "latest", "autoprefixer": "latest", "clean-css": "latest", diff --git a/examples/material-ui-nextjs-ts/README.md b/examples/material-ui-nextjs-ts/README.md index 976964f5bf95b0..df5d86c065a2a4 100644 --- a/examples/material-ui-nextjs-ts/README.md +++ b/examples/material-ui-nextjs-ts/README.md @@ -9,7 +9,7 @@ Download the example [or clone the repo](https://github.com/mui/material-ui): <!-- #default-branch-switch --> ```bash -curl https://codeload.github.com/mui/material-ui/tar.gz/next | tar -xz --strip=2 material-ui-next/examples/material-ui-nextjs-ts +curl https://codeload.github.com/mui/material-ui/tar.gz/master | tar -xz --strip=2 material-ui-master/examples/material-ui-nextjs-ts cd material-ui-nextjs-ts ``` @@ -26,9 +26,9 @@ or: <!-- #default-branch-switch --> -[![Edit on StackBlitz](https://developer.stackblitz.com/img/open_in_stackblitz.svg)](https://stackblitz.com/github/mui/material-ui/tree/next/examples/material-ui-nextjs-ts) +[![Edit on StackBlitz](https://developer.stackblitz.com/img/open_in_stackblitz.svg)](https://stackblitz.com/github/mui/material-ui/tree/master/examples/material-ui-nextjs-ts) -[![Edit on CodeSandbox](https://codesandbox.io/static/img/play-codesandbox.svg)](https://codesandbox.io/p/sandbox/github/mui/material-ui/tree/next/examples/material-ui-nextjs-ts) +[![Edit on CodeSandbox](https://codesandbox.io/static/img/play-codesandbox.svg)](https://codesandbox.io/p/sandbox/github/mui/material-ui/tree/master/examples/material-ui-nextjs-ts) ## Learn more @@ -42,4 +42,4 @@ To learn more about this example: <!-- #default-branch-switch --> You now have a working example project. -You can head back to the documentation and continue by browsing the [templates](https://next.mui.com/material-ui/getting-started/templates/) section. +You can head back to the documentation and continue by browsing the [templates](https://mui.com/material-ui/getting-started/templates/) section. diff --git a/examples/material-ui-nextjs-ts/package.json b/examples/material-ui-nextjs-ts/package.json index 77fe396f077013..429d960765034e 100644 --- a/examples/material-ui-nextjs-ts/package.json +++ b/examples/material-ui-nextjs-ts/package.json @@ -13,9 +13,9 @@ "@emotion/cache": "latest", "@emotion/react": "latest", "@emotion/styled": "latest", - "@mui/icons-material": "next", - "@mui/material": "next", - "@mui/material-nextjs": "next", + "@mui/icons-material": "latest", + "@mui/material": "latest", + "@mui/material-nextjs": "latest", "next": "latest", "react": "latest", "react-dom": "latest" diff --git a/examples/material-ui-nextjs/README.md b/examples/material-ui-nextjs/README.md index 13eacf4492aac3..98ea0fabe4fc94 100644 --- a/examples/material-ui-nextjs/README.md +++ b/examples/material-ui-nextjs/README.md @@ -9,7 +9,7 @@ Download the example [or clone the repo](https://github.com/mui/material-ui): <!-- #default-branch-switch --> ```bash -curl https://codeload.github.com/mui/material-ui/tar.gz/next | tar -xz --strip=2 material-ui-next/examples/material-ui-nextjs +curl https://codeload.github.com/mui/material-ui/tar.gz/master | tar -xz --strip=2 material-ui-master/examples/material-ui-nextjs cd material-ui-nextjs ``` @@ -26,20 +26,20 @@ or: <!-- #default-branch-switch --> -[![Edit on StackBlitz](https://developer.stackblitz.com/img/open_in_stackblitz.svg)](https://stackblitz.com/github/mui/material-ui/tree/next/examples/material-ui-nextjs) +[![Edit on StackBlitz](https://developer.stackblitz.com/img/open_in_stackblitz.svg)](https://stackblitz.com/github/mui/material-ui/tree/master/examples/material-ui-nextjs) -[![Edit on CodeSandbox](https://codesandbox.io/static/img/play-codesandbox.svg)](https://codesandbox.io/p/sandbox/github/mui/material-ui/tree/next/examples/material-ui-nextjs) +[![Edit on CodeSandbox](https://codesandbox.io/static/img/play-codesandbox.svg)](https://codesandbox.io/p/sandbox/github/mui/material-ui/tree/master/examples/material-ui-nextjs) ## Learn more To learn more about this example: - [Next.js documentation](https://nextjs.org/docs) - learn about Next.js features and API. -- [Customizing Material UI](https://next.mui.com/material-ui/customization/how-to-customize/) - approaches to customizing Material UI. +- [Customizing Material UI](https://mui.com/material-ui/customization/how-to-customize/) - approaches to customizing Material UI. ## What's next? <!-- #default-branch-switch --> You now have a working example project. -You can head back to the documentation and continue by browsing the [templates](https://next.mui.com/material-ui/getting-started/templates/) section. +You can head back to the documentation and continue by browsing the [templates](https://mui.com/material-ui/getting-started/templates/) section. diff --git a/examples/material-ui-nextjs/package.json b/examples/material-ui-nextjs/package.json index b7429c67bf7080..af1228ce229f01 100644 --- a/examples/material-ui-nextjs/package.json +++ b/examples/material-ui-nextjs/package.json @@ -12,9 +12,9 @@ "@emotion/cache": "latest", "@emotion/react": "latest", "@emotion/styled": "latest", - "@mui/icons-material": "next", - "@mui/material": "next", - "@mui/material-nextjs": "next", + "@mui/icons-material": "latest", + "@mui/material": "latest", + "@mui/material-nextjs": "latest", "eslint": "latest", "eslint-config-next": "latest", "next": "latest", diff --git a/examples/material-ui-pigment-css-nextjs-ts/README.md b/examples/material-ui-pigment-css-nextjs-ts/README.md index 496bf263356018..ed2d9cf3e6a81a 100644 --- a/examples/material-ui-pigment-css-nextjs-ts/README.md +++ b/examples/material-ui-pigment-css-nextjs-ts/README.md @@ -9,7 +9,7 @@ Download the example [or clone the repo](https://github.com/mui/material-ui): <!-- #default-branch-switch --> ```bash -curl https://codeload.github.com/mui/material-ui/tar.gz/next | tar -xz --strip=2 material-ui-next/examples/material-ui-pigment-css-nextjs-ts +curl https://codeload.github.com/mui/material-ui/tar.gz/master | tar -xz --strip=2 material-ui-master/examples/material-ui-pigment-css-nextjs-ts cd material-ui-pigment-css-nextjs-ts ``` @@ -26,9 +26,9 @@ or: <!-- #default-branch-switch --> -[![Edit on StackBlitz](https://developer.stackblitz.com/img/open_in_stackblitz.svg)](https://stackblitz.com/github/mui/material-ui/tree/next/examples/material-ui-pigment-css-nextjs-ts) +[![Edit on StackBlitz](https://developer.stackblitz.com/img/open_in_stackblitz.svg)](https://stackblitz.com/github/mui/material-ui/tree/master/examples/material-ui-pigment-css-nextjs-ts) -[![Edit on CodeSandbox](https://codesandbox.io/static/img/play-codesandbox.svg)](https://codesandbox.io/p/sandbox/github/mui/material-ui/tree/next/examples/material-ui-pigment-css-nextjs-ts) +[![Edit on CodeSandbox](https://codesandbox.io/static/img/play-codesandbox.svg)](https://codesandbox.io/p/sandbox/github/mui/material-ui/tree/master/examples/material-ui-pigment-css-nextjs-ts) ## Learn more @@ -42,4 +42,4 @@ To learn more about this example: <!-- #default-branch-switch --> You now have a working example project. -You can head back to the documentation and continue by browsing the [templates](https://next.mui.com/material-ui/getting-started/templates/) section. +You can head back to the documentation and continue by browsing the [templates](https://mui.com/material-ui/getting-started/templates/) section. diff --git a/examples/material-ui-pigment-css-nextjs-ts/package.json b/examples/material-ui-pigment-css-nextjs-ts/package.json index d831f47f8ce466..e1e5929ece8d83 100644 --- a/examples/material-ui-pigment-css-nextjs-ts/package.json +++ b/examples/material-ui-pigment-css-nextjs-ts/package.json @@ -9,8 +9,8 @@ "lint": "next lint" }, "dependencies": { - "@mui/material": "next", - "@mui/material-pigment-css": "next", + "@mui/material": "latest", + "@mui/material-pigment-css": "latest", "next": "latest", "react": "latest", "react-dom": "latest" diff --git a/examples/material-ui-pigment-css-vite-ts/README.md b/examples/material-ui-pigment-css-vite-ts/README.md index 78b6bde93e935f..a685e472732239 100644 --- a/examples/material-ui-pigment-css-vite-ts/README.md +++ b/examples/material-ui-pigment-css-vite-ts/README.md @@ -22,9 +22,9 @@ or: <!-- #default-branch-switch --> -[![Edit on StackBlitz](https://developer.stackblitz.com/img/open_in_stackblitz.svg)](https://stackblitz.com/github/mui/material-ui/tree/next/examples/material-ui-pigment-css-vite-ts) +[![Edit on StackBlitz](https://developer.stackblitz.com/img/open_in_stackblitz.svg)](https://stackblitz.com/github/mui/material-ui/tree/master/examples/material-ui-pigment-css-vite-ts) -[![Edit on CodeSandbox](https://codesandbox.io/static/img/play-codesandbox.svg)](https://codesandbox.io/p/sandbox/github/mui/material-ui/tree/next/examples/material-ui-pigment-css-vite-ts) +[![Edit on CodeSandbox](https://codesandbox.io/static/img/play-codesandbox.svg)](https://codesandbox.io/p/sandbox/github/mui/material-ui/tree/master/examples/material-ui-pigment-css-vite-ts) ## The idea behind the example @@ -36,4 +36,4 @@ It includes `@mui/material` and [Pigment CSS](https://github.com/mui/pigment-cs <!-- #default-branch-switch --> You now have a working example project. -You can head back to the documentation and continue by browsing the [templates](https://next.mui.com/material-ui/getting-started/templates/) section. +You can head back to the documentation and continue by browsing the [templates](https://mui.com/material-ui/getting-started/templates/) section. diff --git a/examples/material-ui-pigment-css-vite-ts/package.json b/examples/material-ui-pigment-css-vite-ts/package.json index 4171e679c63077..a44124f0d952e0 100644 --- a/examples/material-ui-pigment-css-vite-ts/package.json +++ b/examples/material-ui-pigment-css-vite-ts/package.json @@ -10,8 +10,8 @@ "preview": "vite preview" }, "dependencies": { - "@mui/material": "next", - "@mui/material-pigment-css": "next", + "@mui/material": "latest", + "@mui/material-pigment-css": "latest", "react": "latest", "react-dom": "latest" }, diff --git a/examples/material-ui-preact/README.md b/examples/material-ui-preact/README.md index 9ee7e2da1658cf..a374fabc65c404 100644 --- a/examples/material-ui-preact/README.md +++ b/examples/material-ui-preact/README.md @@ -7,7 +7,7 @@ Download the example [or clone the repo](https://github.com/mui/material-ui): <!-- #default-branch-switch --> ```bash -curl https://codeload.github.com/mui/material-ui/tar.gz/next | tar -xz --strip=2 material-ui-next/examples/material-ui-preact +curl https://codeload.github.com/mui/material-ui/tar.gz/master | tar -xz --strip=2 material-ui-master/examples/material-ui-preact cd material-ui-preact ``` @@ -28,11 +28,11 @@ It includes `@mui/material` and its peer dependencies, including [Emotion](https <!-- #default-branch-switch --> -If you prefer, you can [use styled-components instead](https://next.mui.com/material-ui/integrations/interoperability/#styled-components). +If you prefer, you can [use styled-components instead](https://mui.com/material-ui/integrations/interoperability/#styled-components). ## What's next? <!-- #default-branch-switch --> You now have a working example project. -You can head back to the documentation and continue by browsing the [templates](https://next.mui.com/material-ui/getting-started/templates/) section. +You can head back to the documentation and continue by browsing the [templates](https://mui.com/material-ui/getting-started/templates/) section. diff --git a/examples/material-ui-preact/package.json b/examples/material-ui-preact/package.json index 1c055c4c6ecc12..47394d072c47b6 100644 --- a/examples/material-ui-preact/package.json +++ b/examples/material-ui-preact/package.json @@ -6,7 +6,7 @@ "@babel/helper-builder-react-jsx": "latest", "@emotion/react": "latest", "@emotion/styled": "latest", - "@mui/material": "next", + "@mui/material": "latest", "@testing-library/jest-dom": "latest", "@testing-library/react": "latest", "@testing-library/user-event": "latest", diff --git a/examples/material-ui-remix-ts/README.md b/examples/material-ui-remix-ts/README.md index e07f487f0a0a09..4cba4dca5836f9 100644 --- a/examples/material-ui-remix-ts/README.md +++ b/examples/material-ui-remix-ts/README.md @@ -7,7 +7,7 @@ Download the example [or clone the repo](https://github.com/mui/material-ui): <!-- #default-branch-switch --> ```bash -curl https://codeload.github.com/mui/material-ui/tar.gz/next | tar -xz --strip=2 material-ui-next/examples/material-ui-remix-ts +curl https://codeload.github.com/mui/material-ui/tar.gz/master | tar -xz --strip=2 material-ui-master/examples/material-ui-remix-ts cd material-ui-remix-ts ``` @@ -22,19 +22,19 @@ or: <!-- #default-branch-switch --> -[![Edit on StackBlitz](https://developer.stackblitz.com/img/open_in_stackblitz.svg)](https://stackblitz.com/github/mui/material-ui/tree/next/examples/material-ui-remix-ts) +[![Edit on StackBlitz](https://developer.stackblitz.com/img/open_in_stackblitz.svg)](https://stackblitz.com/github/mui/material-ui/tree/master/examples/material-ui-remix-ts) -[![Edit on CodeSandbox](https://codesandbox.io/static/img/play-codesandbox.svg)](https://codesandbox.io/p/sandbox/github/mui/material-ui/tree/next/examples/material-ui-remix-ts) +[![Edit on CodeSandbox](https://codesandbox.io/static/img/play-codesandbox.svg)](https://codesandbox.io/p/sandbox/github/mui/material-ui/tree/master/examples/material-ui-remix-ts) ## The idea behind the example The project uses [Remix](https://remix.run/), which is a full-stack web framework. It includes `@mui/material` and its peer dependencies, including [Emotion](https://emotion.sh/docs/introduction), the default style engine in Material UI v6. -If you prefer, you can [use styled-components instead](https://next.mui.com/material-ui/integrations/interoperability/#styled-components). +If you prefer, you can [use styled-components instead](https://mui.com/material-ui/integrations/interoperability/#styled-components). ## What's next? <!-- #default-branch-switch --> You now have a working example project. -You can head back to the documentation and continue by browsing the [templates](https://next.mui.com/material-ui/getting-started/templates/) section. +You can head back to the documentation and continue by browsing the [templates](https://mui.com/material-ui/getting-started/templates/) section. diff --git a/examples/material-ui-remix-ts/package.json b/examples/material-ui-remix-ts/package.json index e32d75a114d90d..53bb95073a3688 100644 --- a/examples/material-ui-remix-ts/package.json +++ b/examples/material-ui-remix-ts/package.json @@ -13,7 +13,7 @@ "@emotion/react": "latest", "@emotion/server": "latest", "@emotion/styled": "latest", - "@mui/material": "next", + "@mui/material": "latest", "@remix-run/css-bundle": "latest", "@remix-run/node": "latest", "@remix-run/react": "latest", diff --git a/examples/material-ui-via-cdn/README.md b/examples/material-ui-via-cdn/README.md index ae7543e2eee7ee..fc8062310ea7ec 100644 --- a/examples/material-ui-via-cdn/README.md +++ b/examples/material-ui-via-cdn/README.md @@ -4,10 +4,8 @@ Download the example [or clone the repo](https://github.com/mui/material-ui): -<!-- #default-branch-switch --> - ```bash -curl https://codeload.github.com/mui/material-ui/tar.gz/next | tar -xz --strip=2 material-ui-next/examples/material-ui-via-cdn +curl https://codeload.github.com/mui/material-ui/tar.gz/master | tar -xz --strip=2 material-ui-master/examples/material-ui-via-cdn cd material-ui-via-cdn ``` @@ -25,11 +23,11 @@ The client has to download the entire library, regardless of which components ar <!-- #default-branch-switch --> -[The live preview.](https://rawcdn.githack.com/mui/material-ui/next/examples/material-ui-via-cdn/index.html) +[The live preview.](https://raw.githack.com/mui/material-ui/master/examples/material-ui-via-cdn/index.html) ## What's next? You now have a working example project. -You can head back to the documentation and continue by browsing the [templates](https://next.mui.com/material-ui/getting-started/templates/) section. +You can head back to the documentation and continue by browsing the [templates](https://mui.com/material-ui/getting-started/templates/) section. <!-- #default-branch-switch --> diff --git a/examples/material-ui-vite-ts/README.md b/examples/material-ui-vite-ts/README.md index 3cb64a2104c2d9..0428f0631fac0d 100644 --- a/examples/material-ui-vite-ts/README.md +++ b/examples/material-ui-vite-ts/README.md @@ -7,7 +7,7 @@ Download the example [or clone the repo](https://github.com/mui/material-ui): <!-- #default-branch-switch --> ```bash -curl https://codeload.github.com/mui/material-ui/tar.gz/next | tar -xz --strip=2 material-ui-next/examples/material-ui-vite-ts +curl https://codeload.github.com/mui/material-ui/tar.gz/master | tar -xz --strip=2 material-ui-master/examples/material-ui-vite-ts cd material-ui-vite-ts ``` @@ -22,9 +22,9 @@ or: <!-- #default-branch-switch --> -[![Edit on StackBlitz](https://developer.stackblitz.com/img/open_in_stackblitz.svg)](https://stackblitz.com/github/mui/material-ui/tree/next/examples/material-ui-vite-ts) +[![Edit on StackBlitz](https://developer.stackblitz.com/img/open_in_stackblitz.svg)](https://stackblitz.com/github/mui/material-ui/tree/master/examples/material-ui-vite-ts) -[![Edit on CodeSandbox](https://codesandbox.io/static/img/play-codesandbox.svg)](https://codesandbox.io/p/sandbox/github/mui/material-ui/tree/next/examples/material-ui-vite-ts) +[![Edit on CodeSandbox](https://codesandbox.io/static/img/play-codesandbox.svg)](https://codesandbox.io/p/sandbox/github/mui/material-ui/tree/master/examples/material-ui-vite-ts) ## The idea behind the example @@ -36,4 +36,4 @@ It includes `@mui/material` and its peer dependencies, including [Emotion](https <!-- #default-branch-switch --> You now have a working example project. -You can head back to the documentation and continue by browsing the [templates](https://next.mui.com/material-ui/getting-started/templates/) section. +You can head back to the documentation and continue by browsing the [templates](https://mui.com/material-ui/getting-started/templates/) section. diff --git a/examples/material-ui-vite-ts/package.json b/examples/material-ui-vite-ts/package.json index 82545735254b39..f8b6eefe8053d1 100644 --- a/examples/material-ui-vite-ts/package.json +++ b/examples/material-ui-vite-ts/package.json @@ -11,8 +11,8 @@ "dependencies": { "@emotion/react": "latest", "@emotion/styled": "latest", - "@mui/icons-material": "next", - "@mui/material": "next", + "@mui/icons-material": "latest", + "@mui/material": "latest", "react": "latest", "react-dom": "latest" }, diff --git a/examples/material-ui-vite/README.md b/examples/material-ui-vite/README.md index a1f08472eeeb69..185ce6aeabe059 100644 --- a/examples/material-ui-vite/README.md +++ b/examples/material-ui-vite/README.md @@ -7,7 +7,7 @@ Download the example [or clone the repo](https://github.com/mui/material-ui): <!-- #default-branch-switch --> ```bash -curl https://codeload.github.com/mui/material-ui/tar.gz/next | tar -xz --strip=2 material-ui-next/examples/material-ui-vite +curl https://codeload.github.com/mui/material-ui/tar.gz/master | tar -xz --strip=2 material-ui-master/examples/material-ui-vite cd material-ui-vite ``` @@ -22,9 +22,9 @@ or: <!-- #default-branch-switch --> -[![Edit on StackBlitz](https://developer.stackblitz.com/img/open_in_stackblitz.svg)](https://stackblitz.com/github/mui/material-ui/tree/next/examples/material-ui-vite) +[![Edit on StackBlitz](https://developer.stackblitz.com/img/open_in_stackblitz.svg)](https://stackblitz.com/github/mui/material-ui/tree/master/examples/material-ui-vite) -[![Edit on CodeSandbox](https://codesandbox.io/static/img/play-codesandbox.svg)](https://codesandbox.io/p/sandbox/github/mui/material-ui/tree/next/examples/material-ui-vite) +[![Edit on CodeSandbox](https://codesandbox.io/static/img/play-codesandbox.svg)](https://codesandbox.io/p/sandbox/github/mui/material-ui/tree/master/examples/material-ui-vite) ## The idea behind the example @@ -36,4 +36,4 @@ It includes `@mui/material` and its peer dependencies, including [Emotion](https <!-- #default-branch-switch --> You now have a working example project. -You can head back to the documentation and continue by browsing the [templates](https://next.mui.com/material-ui/getting-started/templates/) section. +You can head back to the documentation and continue by browsing the [templates](https://mui.com/material-ui/getting-started/templates/) section. diff --git a/examples/material-ui-vite/package.json b/examples/material-ui-vite/package.json index 7ad6bbab50d540..71c02e87add914 100644 --- a/examples/material-ui-vite/package.json +++ b/examples/material-ui-vite/package.json @@ -10,7 +10,7 @@ "dependencies": { "@emotion/react": "latest", "@emotion/styled": "latest", - "@mui/material": "next", + "@mui/material": "latest", "react": "latest", "react-dom": "latest" }, diff --git a/netlify.toml b/netlify.toml index 139fc3098510fd..869ce37a1c4dfc 100644 --- a/netlify.toml +++ b/netlify.toml @@ -8,7 +8,7 @@ command = "pnpm docs:build" [build.environment] - NODE_VERSION = "18" + NODE_VERSION = "20" [[plugins]] package = "./packages/netlify-plugin-cache-docs" diff --git a/package.json b/package.json index f42e1efd4af805..b9f90607e197d5 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "@mui/monorepo", - "version": "6.0.0-beta.6", + "version": "6.0.2", "private": true, "scripts": { "preinstall": "npx only-allow pnpm", @@ -15,8 +15,8 @@ "release:version": "lerna version --no-changelog --no-push --no-git-tag-version --no-private --force-publish=@mui/core-downloads-tracker", "release:build": "lerna run --concurrency 8 --no-private build --skip-nx-cache", "release:changelog": "node scripts/releaseChangelog.mjs", - "release:publish": "pnpm publish --recursive --tag next", - "release:publish:dry-run": "pnpm publish --recursive --tag next --registry=\"http://localhost:4873/\"", + "release:publish": "pnpm publish --recursive --tag latest", + "release:publish:dry-run": "pnpm publish --recursive --tag latest --registry=\"http://localhost:4873/\"", "release:tag": "node scripts/releaseTag.mjs", "docs:api": "rimraf --glob ./docs/pages/**/api-docs ./docs/pages/**/api && pnpm docs:api:build", "docs:api:build": "tsx ./scripts/buidApiDocs/index.ts", @@ -47,7 +47,7 @@ "stylelint": "stylelint --reportInvalidScopeDisables --reportNeedlessDisables \"docs/**/*.{js,ts,tsx}\" --ignore-path .gitignore", "markdownlint": "markdownlint-cli2 \"**/*.md\"", "valelint": "git ls-files | grep -h \".md$\" | xargs vale --filter='.Level==\"error\"'", - "prettier": "pretty-quick --ignore-path .eslintignore --branch next", + "prettier": "pretty-quick --ignore-path .eslintignore --branch master", "prettier:all": "prettier --write . --ignore-path .eslintignore", "size:snapshot": "node --max-old-space-size=4096 ./scripts/sizeSnapshot/create", "size:why": "pnpm size:snapshot --analyze", @@ -72,6 +72,11 @@ "test:regressions:dev": "concurrently \"pnpm test:regressions:build --watch\" \"pnpm test:regressions:server\"", "test:regressions:run": "nx run nx_test_regressions_run", "test:regressions:server": "serve test/regressions -p 5001", + "test:regressions-pigment-css": "cross-env NODE_ENV=production pnpm test:regressions-pigment-css:build && concurrently --success first --kill-others \"pnpm test:regressions-pigment-css:run\" \"pnpm test:regressions-pigment-css:server\"", + "test:regressions-pigment-css:build": "pnpm --filter @app/vite-app run build", + "test:regressions-pigment-css:dev": "concurrently \"pnpm test:regressions-pigment-css:build --watch\" \"pnpm test:regressions-pigment-css:server\"", + "test:regressions-pigment-css:run": "nx run nx_test_regressions_pigment_css_run", + "test:regressions-pigment-css:server": "pnpm --filter @app/vite-app run preview --port 5001", "test:unit": "nx run nx_test_unit", "test:argos": "node ./scripts/pushArgos.mjs", "typescript": "lerna run --no-bail --parallel typescript", @@ -89,17 +94,18 @@ "nx_test_karma_profile": "cross-env NODE_ENV=test karma start test/karma.conf.profile.js", "nx_test_karma": "cross-env NODE_ENV=test karma start test/karma.conf.js", "nx_test_regressions_run": "mocha --config test/regressions/.mocharc.js --delay 'test/regressions/**/*.test.js'", + "nx_test_regressions_pigment_css_run": "mocha --config apps/pigment-css-vite-app/.mocharc.cjs --delay 'apps/pigment-css-vite-app/**/*.test.js'", "nx_test_unit": "cross-env NODE_ENV=test mocha 'packages/**/*.test.{js,ts,tsx}' 'packages-internal/**/*.test.{js,ts,tsx}' 'docs/**/*.test.{js,ts,tsx}'" }, "dependencies": { - "@googleapis/sheets": "^9.1.0", + "@googleapis/sheets": "^9.3.1", "@netlify/functions": "^2.8.1", - "@slack/bolt": "^3.21.1", + "@slack/bolt": "^3.21.2", "execa": "^9.3.1", "google-auth-library": "^9.13.0" }, "devDependencies": { - "@argos-ci/core": "^2.4.1", + "@argos-ci/core": "^2.5.0", "@babel/cli": "^7.24.8", "@babel/core": "^7.25.2", "@babel/node": "^7.25.0", @@ -117,15 +123,16 @@ "@mui/joy": "workspace:*", "@mui/material": "workspace:^", "@mui/utils": "workspace:^", - "@next/eslint-plugin-next": "^14.2.5", + "@next/eslint-plugin-next": "^14.2.8", "@octokit/rest": "^21.0.2", - "@pigment-css/react": "0.0.20", + "@pigment-css/react": "0.0.22", "@playwright/test": "1.46.1", + "@types/babel__core": "^7.20.5", "@types/fs-extra": "^11.0.4", "@types/lodash": "^4.17.7", "@types/mocha": "^10.0.7", - "@types/node": "^18.19.44", - "@types/react": "^18.3.3", + "@types/node": "^20.16.5", + "@types/react": "^18.3.4", "@types/yargs": "^17.0.33", "@typescript-eslint/eslint-plugin": "^7.18.0", "@typescript-eslint/parser": "^7.18.0", @@ -147,15 +154,15 @@ "eslint-config-airbnb": "^19.0.4", "eslint-config-airbnb-typescript": "^18.0.0", "eslint-config-prettier": "^9.1.0", - "eslint-import-resolver-webpack": "^0.13.8", + "eslint-import-resolver-webpack": "^0.13.9", "eslint-plugin-babel": "^5.3.1", "eslint-plugin-filenames": "^1.3.2", "eslint-plugin-import": "^2.29.1", "eslint-plugin-jsx-a11y": "6.7.1", "eslint-plugin-material-ui": "workspace:^", "eslint-plugin-mocha": "^10.5.0", - "eslint-plugin-react": "^7.35.0", - "eslint-plugin-react-compiler": "0.0.0-experimental-9aef357-20240815", + "eslint-plugin-react": "^7.35.2", + "eslint-plugin-react-compiler": "0.0.0-experimental-3f2f4f0-20240826", "eslint-plugin-react-hooks": "^4.6.2", "fast-glob": "^3.3.2", "fs-extra": "^11.2.0", @@ -172,7 +179,7 @@ "lodash": "^4.17.21", "markdownlint-cli2": "^0.13.0", "mocha": "^10.7.3", - "nx": "^19.6.0", + "nx": "^19.7.0", "nyc": "^17.0.0", "piscina": "^4.6.1", "postcss-styled-syntax": "^0.6.4", @@ -205,17 +212,17 @@ "@babel/preset-typescript": "^7.24.7", "@babel/runtime": "^7.25.0", "@babel/types": "^7.25.2", - "@definitelytyped/header-parser": "^0.2.11", - "@definitelytyped/typescript-versions": "^0.1.3", + "@definitelytyped/header-parser": "^0.2.12", + "@definitelytyped/typescript-versions": "^0.1.4", "@definitelytyped/utils": "^0.1.7", - "@types/node": "^18.19.44", - "@types/react": "18.3.3", + "@types/node": "^20.16.5", + "@types/react": "^18.3.4", "@types/react-dom": "18.3.0", "cross-fetch": "^4.0.0", - "@pigment-css/react": "0.0.20", - "@pigment-css/unplugin": "0.0.20", - "@pigment-css/nextjs-plugin": "0.0.20", - "@pigment-css/vite-plugin": "0.0.20" + "@pigment-css/react": "0.0.22", + "@pigment-css/unplugin": "0.0.22", + "@pigment-css/nextjs-plugin": "0.0.22", + "@pigment-css/vite-plugin": "0.0.22" }, "nyc": { "include": [ diff --git a/packages-internal/babel-plugin-resolve-imports/README.md b/packages-internal/babel-plugin-resolve-imports/README.md new file mode 100644 index 00000000000000..87964bf6f1f8b2 --- /dev/null +++ b/packages-internal/babel-plugin-resolve-imports/README.md @@ -0,0 +1,33 @@ +# @mui/internal-babel-plugin-resolve-imports + +A babel plugin that resolves import specifiers that are created under the Node.js resolution algorithm to specifiers that adhere to ESM resolution algorithm. + +See https://nodejs.org/docs/v20.16.0/api/esm.html#mandatory-file-extensions + +> A file extension must be provided when using the import keyword to resolve relative or absolute specifiers. Directory indexes (For example './startup/index.js') must also be fully specified. +> +> This behavior matches how import behaves in browser environments, assuming a typically configured server. + +This changes imports in the build output from + +```tsx +// packages/mui-material/build/index.js +export * from './Accordion'; + +// packages/mui-material/build/Breadcrumbs/BreadcrumbCollapsed.js +import MoreHorizIcon from '../internal/svg-icons/MoreHoriz'; +``` + +to + +```tsx +// packages/mui-material/build/index.js +export * from './Accordion/index.js'; + +// packages/mui-material/build/Breadcrumbs/BreadcrumbCollapsed.js +import MoreHorizIcon from '../internal/svg-icons/MoreHoriz.js'; +``` + +## options + +- `outExtension`: The extension to use when writing the output. Careful: if not specified, this plugin does not replace extensions at all, your bundles will likely be broken. We left this optional to allow for using this plugin together with the aliasing to source that we do everywhere. That way we can keep it in the pipeline even when not strictly necessary. diff --git a/packages-internal/babel-plugin-resolve-imports/index.js b/packages-internal/babel-plugin-resolve-imports/index.js new file mode 100644 index 00000000000000..68ac472f19c54e --- /dev/null +++ b/packages-internal/babel-plugin-resolve-imports/index.js @@ -0,0 +1,115 @@ +// @ts-check +/// <reference path="./resolve.d.ts" /> + +const nodePath = require('path'); +const resolve = require('resolve/sync'); + +/** + * @typedef {import('@babel/core')} babel + */ + +/** + * Normalize a file path to POSIX in order for it to be platform-agnostic. + * @param {string} importPath + * @returns {string} + */ +function toPosixPath(importPath) { + return nodePath.normalize(importPath).split(nodePath.sep).join(nodePath.posix.sep); +} + +/** + * Converts a file path to a node import specifier. + * @param {string} importPath + * @returns {string} + */ +function pathToNodeImportSpecifier(importPath) { + const normalized = toPosixPath(importPath); + return normalized.startsWith('/') || normalized.startsWith('.') ? normalized : `./${normalized}`; +} + +/** + * @typedef {{ outExtension?: string }} Options + */ + +/** + * @param {babel} file + * @param {Options} options + * @returns {babel.PluginObj} + */ +module.exports = function plugin({ types: t }, { outExtension }) { + /** @type {Map<string, string>} */ + const cache = new Map(); + const extensions = ['.ts', '.tsx', '.js', '.jsx']; + const extensionsSet = new Set(extensions); + return { + visitor: { + ImportOrExportDeclaration(path, state) { + if (path.isExportDefaultDeclaration()) { + // Can't export default from an import specifier + return; + } + + if ( + (path.isExportDeclaration() && path.node.exportKind === 'type') || + (path.isImportDeclaration() && path.node.importKind === 'type') + ) { + // Ignore type imports, they will get compiled away anyway + return; + } + + const source = + /** @type {babel.NodePath<babel.types.StringLiteral | null | undefined> } */ ( + path.get('source') + ); + + if (!source.node) { + // Ignore import without source + return; + } + + const importedPath = source.node.value; + + if (!importedPath.startsWith('.')) { + // Only handle relative imports + return; + } + + if (!state.filename) { + throw new Error('filename is not defined'); + } + + const importerPath = state.filename; + const importerDir = nodePath.dirname(importerPath); + // start from fully resolved import path + const absoluteImportPath = nodePath.resolve(importerDir, importedPath); + + let resolvedPath = cache.get(absoluteImportPath); + + if (!resolvedPath) { + // resolve to actual file + resolvedPath = resolve(absoluteImportPath, { extensions }); + + if (!resolvedPath) { + throw new Error(`could not resolve "${importedPath}" from "${state.filename}"`); + } + + const resolvedExtension = nodePath.extname(resolvedPath); + if (outExtension && extensionsSet.has(resolvedExtension)) { + // replace extension + resolvedPath = nodePath.resolve( + nodePath.dirname(resolvedPath), + nodePath.basename(resolvedPath, resolvedExtension) + outExtension, + ); + } + + cache.set(absoluteImportPath, resolvedPath); + } + + const relativeResolvedPath = nodePath.relative(importerDir, resolvedPath); + const importSpecifier = pathToNodeImportSpecifier(relativeResolvedPath); + + source.replaceWith(t.stringLiteral(importSpecifier)); + }, + }, + }; +}; diff --git a/packages-internal/babel-plugin-resolve-imports/package.json b/packages-internal/babel-plugin-resolve-imports/package.json new file mode 100644 index 00000000000000..a6b9dadb2503f3 --- /dev/null +++ b/packages-internal/babel-plugin-resolve-imports/package.json @@ -0,0 +1,30 @@ +{ + "name": "@mui/internal-babel-plugin-resolve-imports", + "version": "1.0.17", + "author": "MUI Team", + "description": "babel plugin that resolves import specifiers to their actual output file.", + "main": "./index.js", + "exports": { + ".": "./index.js" + }, + "repository": { + "type": "git", + "url": "https://github.com/mui/material-ui.git", + "directory": "packages-internal/babel-plugin-resolve-imports" + }, + "license": "MIT", + "scripts": {}, + "dependencies": { + "resolve": "^1.22.8" + }, + "devDependencies": { + "@types/babel__core": "^7.20.5", + "@types/resolve": "^1.20.6" + }, + "peerDependencies": { + "@babel/core": "7" + }, + "publishConfig": { + "access": "public" + } +} diff --git a/packages-internal/babel-plugin-resolve-imports/resolve.d.ts b/packages-internal/babel-plugin-resolve-imports/resolve.d.ts new file mode 100644 index 00000000000000..7a911b17ce4bea --- /dev/null +++ b/packages-internal/babel-plugin-resolve-imports/resolve.d.ts @@ -0,0 +1,6 @@ +declare module 'resolve/sync' { + import { Opts } from 'resolve'; + + function resolve(id: string, options?: Opts): string; + export = resolve; +} diff --git a/packages-internal/docs-utils/package.json b/packages-internal/docs-utils/package.json index f45641fbf8d62b..d58b165a60c925 100644 --- a/packages-internal/docs-utils/package.json +++ b/packages-internal/docs-utils/package.json @@ -1,6 +1,6 @@ { "name": "@mui/internal-docs-utils", - "version": "1.0.10", + "version": "1.0.12", "author": "MUI Team", "description": "Utilities for MUI docs. This is an internal package not meant for general use.", "main": "./build/index.js", @@ -15,8 +15,8 @@ }, "scripts": { "prebuild": "rimraf ./build", - "build": "tsc -b tsconfig.build.json", - "typescript": "tsc -b tsconfig.json", + "build": "tsc -p tsconfig.build.json", + "typescript": "tsc -p tsconfig.json", "release:publish": "pnpm build && pnpm publish --tag latest", "release:publish:dry-run": "pnpm build && pnpm publish --tag latest --registry=\"http://localhost:4873/\"" }, diff --git a/packages-internal/scripts/package.json b/packages-internal/scripts/package.json index 0d4513e9f8f8f3..3ec0c71b80f399 100644 --- a/packages-internal/scripts/package.json +++ b/packages-internal/scripts/package.json @@ -1,6 +1,6 @@ { "name": "@mui/internal-scripts", - "version": "1.0.16", + "version": "1.0.19", "author": "MUI Team", "description": "Utilities supporting MUI libraries build and docs generation. This is an internal package not meant for general use.", "main": "build/index.js", @@ -39,11 +39,11 @@ "devDependencies": { "@babel/register": "^7.24.6", "@types/babel__core": "^7.20.5", - "@types/chai": "^4.3.17", + "@types/chai": "^4.3.19", "@types/doctrine": "^0.0.9", "@types/lodash": "^4.17.7", - "@types/node": "^18.19.44", - "@types/react": "^18.3.3", + "@types/node": "^20.16.5", + "@types/react": "^18.3.4", "@types/uuid": "^9.0.8", "chai": "^4.5.0", "fast-glob": "^3.3.2", diff --git a/packages-internal/test-utils/package.json b/packages-internal/test-utils/package.json index 469e4fbf198cd9..9bb2b23a0802f1 100644 --- a/packages-internal/test-utils/package.json +++ b/packages-internal/test-utils/package.json @@ -1,6 +1,6 @@ { "name": "@mui/internal-test-utils", - "version": "1.0.8", + "version": "1.0.12", "author": "MUI Team", "description": "Utilities for MUI tests. This is an internal package not meant for general use.", "main": "./build/index.js", @@ -25,8 +25,8 @@ }, "scripts": { "prebuild": "rimraf ./build", - "build": "tsc -b tsconfig.build.json", - "typescript": "tsc -b tsconfig.json", + "build": "tsc -p tsconfig.build.json", + "typescript": "tsc -p tsconfig.json", "release:publish": "pnpm publish --tag latest", "release:publish:dry-run": "pnpm publish --tag latest --registry=\"http://localhost:4873/\"" }, @@ -36,9 +36,9 @@ "@babel/register": "^7.24.6", "@babel/runtime": "^7.25.0", "@emotion/cache": "^11.13.1", - "@emotion/react": "^11.13.0", + "@emotion/react": "^11.13.3", "@testing-library/dom": "^10.4.0", - "@testing-library/react": "^16.0.0", + "@testing-library/react": "^16.0.1", "@testing-library/user-event": "^14.5.2", "chai": "^4.5.0", "chai-dom": "^1.12.0", @@ -50,14 +50,14 @@ "mocha": "^10.7.3", "playwright": "^1.46.1", "prop-types": "^15.8.1", - "sinon": "^16.1.3" + "sinon": "^18.0.0" }, "devDependencies": { - "@types/chai": "^4.3.17", + "@types/chai": "^4.3.19", "@types/chai-dom": "^1.11.3", "@types/format-util": "^1.0.4", "@types/prop-types": "^15.7.12", - "@types/react": "^18.3.3", + "@types/react": "^18.3.4", "@types/react-dom": "^18.3.0", "@types/sinon": "^17.0.3", "typescript": "^5.5.4" diff --git a/packages/api-docs-builder-core/baseUi/generateBaseUiApiPages.ts b/packages/api-docs-builder-core/baseUi/generateBaseUiApiPages.ts index e8933b54b1f190..4b895543163c24 100644 --- a/packages/api-docs-builder-core/baseUi/generateBaseUiApiPages.ts +++ b/packages/api-docs-builder-core/baseUi/generateBaseUiApiPages.ts @@ -86,7 +86,7 @@ Page.getLayout = (page) => { apiTabImportStatements += `import ${hook}ApiJsonPageContent from '../../api/${hookNameKebabCase}.json';`; staticProps += ` const ${hook}ApiReq = require.context( - 'docs/translations/api-docs/${hookNameKebabCase}', + 'docs/translations/api-docs-base/${hookNameKebabCase}', false, /${hookNameKebabCase}.*.json$/, ); diff --git a/packages/api-docs-builder-core/baseUi/projectSettings.ts b/packages/api-docs-builder-core/baseUi/projectSettings.ts index 5c276df37500e9..fbedfbab331035 100644 --- a/packages/api-docs-builder-core/baseUi/projectSettings.ts +++ b/packages/api-docs-builder-core/baseUi/projectSettings.ts @@ -47,5 +47,5 @@ export const projectSettings: ProjectSettings = { generateClassName: generateUtilityClass, isGlobalClassName: isGlobalState, // #default-branch-switch - baseApiUrl: 'https://next.mui.com', + baseApiUrl: 'https://mui.com', }; diff --git a/packages/api-docs-builder-core/materialUi/projectSettings.ts b/packages/api-docs-builder-core/materialUi/projectSettings.ts index 5d0c11f161135a..2617c50f54983b 100644 --- a/packages/api-docs-builder-core/materialUi/projectSettings.ts +++ b/packages/api-docs-builder-core/materialUi/projectSettings.ts @@ -44,5 +44,5 @@ export const projectSettings: ProjectSettings = { generateClassName: generateUtilityClass, isGlobalClassName: isGlobalState, // #default-branch-switch - baseApiUrl: 'https://next.mui.com', + baseApiUrl: 'https://mui.com', }; diff --git a/packages/api-docs-builder-core/package.json b/packages/api-docs-builder-core/package.json index 92e61bb04f9d78..4d874d0a6d1b5f 100644 --- a/packages/api-docs-builder-core/package.json +++ b/packages/api-docs-builder-core/package.json @@ -15,12 +15,12 @@ "lodash": "^4.17.21" }, "devDependencies": { - "@types/chai": "^4.3.17", + "@types/chai": "^4.3.19", "@types/mocha": "^10.0.7", - "@types/node": "^18.19.44", + "@types/node": "^20.16.5", "@types/sinon": "^17.0.3", "chai": "^4.5.0", - "sinon": "^16.1.3", + "sinon": "^18.0.0", "typescript": "^5.5.4" } } diff --git a/packages/api-docs-builder/ApiBuilders/ComponentApiBuilder.ts b/packages/api-docs-builder/ApiBuilders/ComponentApiBuilder.ts index 8d58633a29c1b6..f8f3bb247b2c81 100644 --- a/packages/api-docs-builder/ApiBuilders/ComponentApiBuilder.ts +++ b/packages/api-docs-builder/ApiBuilders/ComponentApiBuilder.ts @@ -5,8 +5,8 @@ import * as babel from '@babel/core'; import traverse from '@babel/traverse'; import * as _ from 'lodash'; import kebabCase from 'lodash/kebabCase'; -import remark from 'remark'; -import remarkVisit from 'unist-util-visit'; +import { remark } from 'remark'; +import { visit as remarkVisit } from 'unist-util-visit'; import type { Link } from 'mdast'; import { defaultHandlers, parse as docgenParse } from 'react-docgen'; import { renderMarkdown } from '@mui/internal-markdown'; @@ -59,7 +59,7 @@ export async function computeApiDescription( }) .process(api.description); - return file.contents.toString().trim(); + return file.toString().trim(); } /** diff --git a/packages/api-docs-builder/ApiBuilders/HookApiBuilder.ts b/packages/api-docs-builder/ApiBuilders/HookApiBuilder.ts index 25681aa91b4529..d018e396525450 100644 --- a/packages/api-docs-builder/ApiBuilders/HookApiBuilder.ts +++ b/packages/api-docs-builder/ApiBuilders/HookApiBuilder.ts @@ -510,7 +510,7 @@ export default async function generateHookApi( reactApi.description = reactApi.description.slice(0, annotatedDescriptionMatch.index).trim(); } - const { getHookImports = defaultGetHookImports } = projectSettings; + const { getHookImports = defaultGetHookImports, translationPagesDirectory } = projectSettings; reactApi.filename = filename; reactApi.name = name; reactApi.imports = getHookImports(name, filename); @@ -545,7 +545,7 @@ export default async function generateHookApi( if (!skipApiGeneration) { // Generate pages, json and translations await generateApiTranslations( - path.join(process.cwd(), 'docs/translations/api-docs'), + path.join(process.cwd(), translationPagesDirectory), reactApi, projectSettings.translationLanguages, ); diff --git a/packages/api-docs-builder/ProjectSettings.ts b/packages/api-docs-builder/ProjectSettings.ts index d6a1ec8b6f98a3..e814a25d7ee428 100644 --- a/packages/api-docs-builder/ProjectSettings.ts +++ b/packages/api-docs-builder/ProjectSettings.ts @@ -26,6 +26,11 @@ export interface ProjectSettings { * The output path of `pagesApi` generated from `input.pageDirectory` */ apiManifestPath: string; + /** + * Determine if the API manifest file is created. + * @default true + */ + writeApiManifest?: boolean; }; /** * Component directories to be used to generate API diff --git a/packages/api-docs-builder/buildApi.ts b/packages/api-docs-builder/buildApi.ts index 38fe6469cedf29..538338e7008dc1 100644 --- a/packages/api-docs-builder/buildApi.ts +++ b/packages/api-docs-builder/buildApi.ts @@ -111,7 +111,8 @@ async function buildSingleProject( const tsProjects = projectSettings.typeScriptProjects.map((project) => buildTypeScriptProject(project.name), ); - const apiPagesManifestPath = projectSettings.output.apiManifestPath; + + const { apiManifestPath: apiPagesManifestPath, writeApiManifest = true } = projectSettings.output; const manifestDir = apiPagesManifestPath.match(/(.*)\/[^/]+\./)?.[1]; if (manifestDir) { @@ -189,12 +190,14 @@ async function buildSingleProject( process.exit(1); } - let source = `module.exports = ${JSON.stringify(projectSettings.getApiPages())}`; - if (projectSettings.onWritingManifestFile) { - source = projectSettings.onWritingManifestFile(builds, source); - } + if (writeApiManifest) { + let source = `module.exports = ${JSON.stringify(projectSettings.getApiPages())}`; + if (projectSettings.onWritingManifestFile) { + source = projectSettings.onWritingManifestFile(builds, source); + } - await writePrettifiedFile(apiPagesManifestPath, source); + await writePrettifiedFile(apiPagesManifestPath, source); + } await projectSettings.onCompleted?.(); return builds; diff --git a/packages/api-docs-builder/package.json b/packages/api-docs-builder/package.json index 22d362ff9d72f2..e2af5dc580b2bb 100644 --- a/packages/api-docs-builder/package.json +++ b/packages/api-docs-builder/package.json @@ -21,21 +21,21 @@ "prettier": "^3.3.3", "react-docgen": "^5.4.3", "recast": "^0.23.9", - "remark": "^13.0.0", + "remark": "^15.0.1", "typescript": "^5.5.4", - "unist-util-visit": "^2.0.3" + "unist-util-visit": "^5.0.0" }, "devDependencies": { "@types/babel__core": "^7.20.5", "@types/babel__traverse": "^7.20.6", - "@types/chai": "^4.3.17", + "@types/chai": "^4.3.19", "@types/doctrine": "^0.0.9", "@types/mdast": "4.0.4", "@types/mocha": "^10.0.7", - "@types/node": "^18.19.44", + "@types/node": "^20.16.5", "@types/react-docgen": "workspace:*", "@types/sinon": "^17.0.3", "chai": "^4.5.0", - "sinon": "^16.1.3" + "sinon": "^18.0.0" } } diff --git a/packages/api-docs-builder/tsconfig.json b/packages/api-docs-builder/tsconfig.json index 4c8cb67b09768f..2f3be4c91832e1 100644 --- a/packages/api-docs-builder/tsconfig.json +++ b/packages/api-docs-builder/tsconfig.json @@ -14,7 +14,7 @@ "strict": true, "baseUrl": "./", "paths": { - "@mui/internal-docs-utils": ["../docs-utils/src"] + "@mui/internal-docs-utils": ["../../packages-internal/docs-utils/src"] } }, "include": ["./**/*.ts", "./**/*.js"], diff --git a/packages/api-docs-builder/utils/findPagesMarkdown.ts b/packages/api-docs-builder/utils/findPagesMarkdown.ts index 58510771ba765c..d305a26b9cd1b7 100644 --- a/packages/api-docs-builder/utils/findPagesMarkdown.ts +++ b/packages/api-docs-builder/utils/findPagesMarkdown.ts @@ -24,14 +24,14 @@ export default function findPagesMarkdown( } // Ignore non en-US source markdown. - if (!/\.md$/.test(item) || /-(zh|pt)\.md/.test(item)) { + if (!/\.mdx?$/.test(item) || /-(zh|pt)\.mdx?/.test(item)) { return; } let pathname = filename .replace(new RegExp(`\\${path.sep}`, 'g'), '/') .replace(/^.*\/data/, '') - .replace('.md', ''); + .replace(/\.mdx?/, ''); // Remove the last pathname segment. pathname = pathname diff --git a/packages/eslint-plugin-material-ui/package.json b/packages/eslint-plugin-material-ui/package.json index 7035213eb7258a..019d13816cd062 100644 --- a/packages/eslint-plugin-material-ui/package.json +++ b/packages/eslint-plugin-material-ui/package.json @@ -2,13 +2,13 @@ "name": "eslint-plugin-material-ui", "version": "5.0.0", "private": true, - "description": "Custom eslint rules for MUI.", + "description": "Custom eslint rules for Material UI.", "main": "src/index.js", "dependencies": { "emoji-regex": "^10.3.0" }, "devDependencies": { - "@types/eslint": "^8.56.11", + "@types/eslint": "^8.56.12", "@typescript-eslint/parser": "^7.18.0", "eslint": "^8.57.0" }, diff --git a/packages/markdown/package.json b/packages/markdown/package.json index e2c53895a7bfc4..eec5bccf119cf5 100644 --- a/packages/markdown/package.json +++ b/packages/markdown/package.json @@ -1,6 +1,6 @@ { "name": "@mui/internal-markdown", - "version": "1.0.10", + "version": "1.0.12", "author": "MUI Team", "description": "MUI markdown parser. This is an internal package not meant for general use.", "main": "./index.js", @@ -26,7 +26,7 @@ "prismjs": "^1.29.0" }, "devDependencies": { - "@types/chai": "^4.3.17", + "@types/chai": "^4.3.19", "chai": "^4.5.0" }, "publishConfig": { diff --git a/packages/markdown/parseMarkdown.js b/packages/markdown/parseMarkdown.js index 001edef81130bc..f13fcf239c365b 100644 --- a/packages/markdown/parseMarkdown.js +++ b/packages/markdown/parseMarkdown.js @@ -366,7 +366,13 @@ function createRender(context) { } return [ - `<h${level} id="${hash}"><a href="#${hash}" class="title-link-to-anchor">${headingHtml}<span class="anchor-icon"><svg><use xlink:href="#anchor-link-icon" /></svg></span></a>`, + headingHtml.includes('<a ') + ? [ + // Avoid breaking the anchor link button + `<h${level} id="${hash}"><a href="#${hash}" class="title-link-to-anchor">${headingHtml}</a>`, + `<a href="#${hash}" class="title-link-to-anchor"><span class="anchor-icon"><svg><use xlink:href="#anchor-link-icon" /></svg></span></a>`, + ].join('') + : `<h${level} id="${hash}"><a href="#${hash}" class="title-link-to-anchor">${headingHtml}<span class="anchor-icon"><svg><use xlink:href="#anchor-link-icon" /></svg></span></a>`, `<button title="Post a comment" class="comment-link" data-feedback-hash="${hash}">`, '<svg><use xlink:href="#comment-link-icon" /></svg>', `</button>`, @@ -458,22 +464,20 @@ function createRender(context) { } return undefined; }, - renderer(token) { - return `<aside class="MuiCallout-root MuiCallout-${token.severity}"> - ${ - ['info', 'success', 'warning', 'error'].includes(token.severity) - ? [ - '<div class="MuiCallout-icon-container">', - '<svg focusable="false" aria-hidden="true" viewBox="0 0 24 24" data-testid="ContentCopyRoundedIcon">', - `<use class="MuiCode-copied-icon" xlink:href="#${token.severity}-icon" />`, - '</svg>', - '</div>', - ].join('\n') - : '' + if (!['info', 'success', 'warning', 'error'].includes(token.severity)) { + throw new Error(`docs-infra: Callout :::${token.severity} is not supported`); } - <div class="MuiCallout-content"> - ${this.parser.parse(token.tokens)}\n</div></aside>`; + + return `<aside class="MuiCallout-root MuiCallout-${token.severity}">${[ + '<div class="MuiCallout-icon-container">', + '<svg focusable="false" aria-hidden="true" viewBox="0 0 24 24" data-testid="ContentCopyRoundedIcon">', + `<use class="MuiCode-copied-icon" xlink:href="#${token.severity}-icon" />`, + '</svg>', + '</div>', + ].join( + '\n', + )}<div class="MuiCallout-content">${this.parser.parse(token.tokens)}</div></aside>`; }, }, ], diff --git a/packages/markdown/prepareMarkdown.js b/packages/markdown/prepareMarkdown.js index 79f8cf1f42a798..a57976e92f6ff6 100644 --- a/packages/markdown/prepareMarkdown.js +++ b/packages/markdown/prepareMarkdown.js @@ -91,7 +91,7 @@ function prepareMarkdown(config) { throw new Error(`docs-infra: Missing description in the page: ${location}\n`); } - if (description.length > 170) { + if (description.length > 160) { throw new Error( [ `docs-infra: The description "${description}" is too long (${description.length} characters).`, diff --git a/packages/mui-base/README.md b/packages/mui-base/README.md index 45b919f6e3c34b..d84f270367e381 100644 --- a/packages/mui-base/README.md +++ b/packages/mui-base/README.md @@ -1,6 +1,6 @@ <!-- markdownlint-disable-next-line --> <p align="center"> - <a href="https://next.mui.com/base-ui/" rel="noopener" target="_blank"><img width="150" height="133" src="https://next.mui.com/static/logo.svg" alt="Base UI logo"></a> + <a href="https://mui.com/base-ui/" rel="noopener" target="_blank"><img width="150" height="133" src="https://mui.com/static/logo.svg" alt="Base UI logo"></a> </p> <h1 align="center">Base UI</h1> @@ -11,17 +11,15 @@ Base UI is a library of headless ("unstyled") React components and low-level ho Install the package in your project directory with: -<!-- #default-branch-switch --> - ```bash -npm install @mui/base@next +npm install @mui/base ``` ## Documentation <!-- #default-branch-switch --> -Visit [https://next.mui.com/base-ui/](https://next.mui.com/base-ui/) to view the full documentation. +Visit [https://mui.com/base-ui/](https://mui.com/base-ui/) to view the full documentation. ## Questions @@ -30,14 +28,14 @@ Use the "base-ui" tag on Stack Overflow to make it easier for the community to ## Examples -Our documentation features [a collection of example projects using Base UI](https://github.com/mui/material-ui/tree/next/examples). +Our documentation features [a collection of example projects using Base UI](https://github.com/mui/material-ui/tree/master/examples). ## Contributing Read the [contributing guide](/CONTRIBUTING.md) to learn about our development process, how to propose bug fixes and improvements, and how to build and test your changes. Contributing to Base UI is about more than just issues and pull requests! -There are many other ways to [support Base UI](https://next.mui.com/material-ui/getting-started/faq/#mui-is-awesome-how-can-i-support-the-project) beyond contributing to the code base. +There are many other ways to [support Base UI](https://mui.com/material-ui/getting-started/faq/#mui-is-awesome-how-can-i-support-the-project) beyond contributing to the code base. ## Changelog @@ -45,7 +43,7 @@ The [changelog](https://github.com/mui/material-ui/releases) is regularly update ## Roadmap -Future plans and high-priority features and enhancements can be found in the [roadmap](https://next.mui.com/material-ui/discover-more/roadmap/). +Future plans and high-priority features and enhancements can be found in the [roadmap](https://mui.com/material-ui/discover-more/roadmap/). ## License diff --git a/packages/mui-base/package.json b/packages/mui-base/package.json index 99eb6ab9a5e462..e0d85af196896f 100644 --- a/packages/mui-base/package.json +++ b/packages/mui-base/package.json @@ -1,6 +1,6 @@ { "name": "@mui/base", - "version": "5.0.0-beta.57", + "version": "5.0.0-beta.58", "private": false, "author": "MUI Team", "description": "Base UI is a library of headless ('unstyled') React components and low-level hooks. You gain complete control over your app's CSS and accessibility features.", @@ -43,7 +43,7 @@ "@babel/runtime": "^7.25.0", "@floating-ui/react-dom": "^2.1.1", "@mui/types": "workspace:^", - "@mui/utils": "workspace:*", + "@mui/utils": "workspace:^", "@popperjs/core": "^2.11.8", "clsx": "^2.1.1", "prop-types": "^15.8.1" @@ -52,11 +52,11 @@ "@mui/internal-babel-macros": "workspace:^", "@mui/internal-test-utils": "workspace:^", "@mui/types": "workspace:^", - "@testing-library/react": "^16.0.0", + "@testing-library/react": "^16.0.1", "@testing-library/user-event": "^14.5.2", - "@types/chai": "^4.3.17", + "@types/chai": "^4.3.19", "@types/prop-types": "^15.7.12", - "@types/react": "18.3.3", + "@types/react": "18.3.4", "@types/react-dom": "18.3.0", "@types/sinon": "^17.0.3", "chai": "^4.5.0", @@ -64,7 +64,7 @@ "lodash": "^4.17.21", "react": "^18.3.1", "react-dom": "^18.3.1", - "sinon": "^16.1.3" + "sinon": "^18.0.0" }, "peerDependencies": { "@types/react": "^17.0.0 || ^18.0.0", diff --git a/packages/mui-base/src/Badge/index.ts b/packages/mui-base/src/Badge/index.ts index b208878eab3a79..8ffeb88dbba238 100644 --- a/packages/mui-base/src/Badge/index.ts +++ b/packages/mui-base/src/Badge/index.ts @@ -1,4 +1,3 @@ -'use client'; export { Badge } from './Badge'; export * from './Badge.types'; export * from './badgeClasses'; diff --git a/packages/mui-base/src/Button/index.ts b/packages/mui-base/src/Button/index.ts index e5bd68604d8616..d23520e56dc38a 100644 --- a/packages/mui-base/src/Button/index.ts +++ b/packages/mui-base/src/Button/index.ts @@ -1,4 +1,3 @@ -'use client'; export { Button } from './Button'; export * from './buttonClasses'; diff --git a/packages/mui-base/src/FormControl/useFormControlContext.ts b/packages/mui-base/src/FormControl/useFormControlContext.ts index 686443e04ce523..19457e81686603 100644 --- a/packages/mui-base/src/FormControl/useFormControlContext.ts +++ b/packages/mui-base/src/FormControl/useFormControlContext.ts @@ -6,11 +6,11 @@ import { FormControlContext } from './FormControlContext'; * * Demos: * - * - [Form Control](https://next.mui.com/base-ui/react-form-control/#hook) + * - [Form Control](https://mui.com/base-ui/react-form-control/#hook) * * API: * - * - [useFormControlContext API](https://next.mui.com/base-ui/react-form-control/hooks-api/#use-form-control-context) + * - [useFormControlContext API](https://mui.com/base-ui/react-form-control/hooks-api/#use-form-control-context) */ export function useFormControlContext(): UseFormControlContextReturnValue | undefined { return React.useContext(FormControlContext); diff --git a/packages/mui-base/src/Input/index.ts b/packages/mui-base/src/Input/index.ts index 01badf40652a64..a803fa5897284e 100644 --- a/packages/mui-base/src/Input/index.ts +++ b/packages/mui-base/src/Input/index.ts @@ -1,4 +1,3 @@ -'use client'; export { Input } from './Input'; export * from './Input.types'; diff --git a/packages/mui-base/src/MenuButton/index.ts b/packages/mui-base/src/MenuButton/index.ts index 721bc436d4aa5f..fcc222955256b7 100644 --- a/packages/mui-base/src/MenuButton/index.ts +++ b/packages/mui-base/src/MenuButton/index.ts @@ -1,4 +1,3 @@ -'use client'; export { MenuButton } from './MenuButton'; export * from './MenuButton.types'; diff --git a/packages/mui-base/src/MenuItem/index.ts b/packages/mui-base/src/MenuItem/index.ts index c24ff54e41ae15..0adb1f3669a266 100644 --- a/packages/mui-base/src/MenuItem/index.ts +++ b/packages/mui-base/src/MenuItem/index.ts @@ -1,4 +1,3 @@ -'use client'; export * from './MenuItem'; export * from './MenuItem.types'; export * from './menuItemClasses'; diff --git a/packages/mui-base/src/MultiSelect/index.ts b/packages/mui-base/src/MultiSelect/index.ts index 0cefde7155a3f5..7140f36c68d271 100644 --- a/packages/mui-base/src/MultiSelect/index.ts +++ b/packages/mui-base/src/MultiSelect/index.ts @@ -1,2 +1 @@ -'use client'; export { MultiSelect } from './MultiSelect'; diff --git a/packages/mui-base/src/NoSsr/index.ts b/packages/mui-base/src/NoSsr/index.ts index f13019fe10e496..546b249ab2a159 100644 --- a/packages/mui-base/src/NoSsr/index.ts +++ b/packages/mui-base/src/NoSsr/index.ts @@ -1,3 +1,2 @@ -'use client'; export { NoSsr } from './NoSsr'; export * from './NoSsr.types'; diff --git a/packages/mui-base/src/Option/index.ts b/packages/mui-base/src/Option/index.ts index 511389be308354..c941281acc7684 100644 --- a/packages/mui-base/src/Option/index.ts +++ b/packages/mui-base/src/Option/index.ts @@ -1,4 +1,3 @@ -'use client'; export * from './Option'; export * from './Option.types'; export * from './optionClasses'; diff --git a/packages/mui-base/src/OptionGroup/index.ts b/packages/mui-base/src/OptionGroup/index.ts index a75ed89f2baa42..3a0f78ea6341fd 100644 --- a/packages/mui-base/src/OptionGroup/index.ts +++ b/packages/mui-base/src/OptionGroup/index.ts @@ -1,4 +1,3 @@ -'use client'; export { OptionGroup } from './OptionGroup'; export * from './OptionGroup.types'; diff --git a/packages/mui-base/src/Popper/index.ts b/packages/mui-base/src/Popper/index.ts index 7ebed8baf38471..d03b4dee371934 100644 --- a/packages/mui-base/src/Popper/index.ts +++ b/packages/mui-base/src/Popper/index.ts @@ -1,4 +1,3 @@ -'use client'; export { Popper } from './Popper'; export type { PopperPlacementType, diff --git a/packages/mui-base/src/Portal/index.ts b/packages/mui-base/src/Portal/index.ts index 96ba019d5a6662..605321409b2dfb 100644 --- a/packages/mui-base/src/Portal/index.ts +++ b/packages/mui-base/src/Portal/index.ts @@ -1,3 +1,2 @@ -'use client'; export { Portal } from './Portal'; export * from './Portal.types'; diff --git a/packages/mui-base/src/Select/index.ts b/packages/mui-base/src/Select/index.ts index c5bdc3eed2e5e8..02dc19409172f0 100644 --- a/packages/mui-base/src/Select/index.ts +++ b/packages/mui-base/src/Select/index.ts @@ -1,4 +1,3 @@ -'use client'; export { Select } from './Select'; export * from './selectClasses'; diff --git a/packages/mui-base/src/Slider/index.ts b/packages/mui-base/src/Slider/index.ts index 8471da75345a5d..9f88f0dea704f4 100644 --- a/packages/mui-base/src/Slider/index.ts +++ b/packages/mui-base/src/Slider/index.ts @@ -1,4 +1,3 @@ -'use client'; export { Slider } from './Slider'; export * from './Slider.types'; export * from './sliderClasses'; diff --git a/packages/mui-base/src/Snackbar/index.ts b/packages/mui-base/src/Snackbar/index.ts index 7f109fda1d2aa8..69928fa25e7e3c 100644 --- a/packages/mui-base/src/Snackbar/index.ts +++ b/packages/mui-base/src/Snackbar/index.ts @@ -1,4 +1,3 @@ -'use client'; export { Snackbar } from './Snackbar'; export * from './Snackbar.types'; diff --git a/packages/mui-base/src/Switch/index.ts b/packages/mui-base/src/Switch/index.ts index 6eced9996c3933..262700928a490b 100644 --- a/packages/mui-base/src/Switch/index.ts +++ b/packages/mui-base/src/Switch/index.ts @@ -1,4 +1,3 @@ -'use client'; export { Switch } from './Switch'; export * from './Switch.types'; diff --git a/packages/mui-base/src/Tab/index.ts b/packages/mui-base/src/Tab/index.ts index 57e49f6c0a3301..1bcbf62239164f 100644 --- a/packages/mui-base/src/Tab/index.ts +++ b/packages/mui-base/src/Tab/index.ts @@ -1,4 +1,3 @@ -'use client'; export { Tab } from './Tab'; export * from './Tab.types'; diff --git a/packages/mui-base/src/TabPanel/index.ts b/packages/mui-base/src/TabPanel/index.ts index bb4daa1483deff..fe6efbb02f7582 100644 --- a/packages/mui-base/src/TabPanel/index.ts +++ b/packages/mui-base/src/TabPanel/index.ts @@ -1,4 +1,3 @@ -'use client'; export { TabPanel } from './TabPanel'; export * from './TabPanel.types'; diff --git a/packages/mui-base/src/TablePagination/TablePagination.tsx b/packages/mui-base/src/TablePagination/TablePagination.tsx index f06db73e2b7a49..2ad936f2fa7e52 100644 --- a/packages/mui-base/src/TablePagination/TablePagination.tsx +++ b/packages/mui-base/src/TablePagination/TablePagination.tsx @@ -257,7 +257,7 @@ TablePagination.propTypes /* remove-proptypes */ = { * Accepts a function which returns a string value that provides a user-friendly name for the current page. * This is important for screen reader users. * - * For localization purposes, you can use the provided [translations](/material-ui/guides/localization/). + * For localization purposes, you can use the provided [translations](https://mui.com/material-ui/guides/localization/). * @param {string} type The link or button type to format ('first' | 'last' | 'next' | 'previous'). * @returns {string} * @default function defaultGetAriaLabel(type: ItemAriaLabelType) { @@ -269,7 +269,7 @@ TablePagination.propTypes /* remove-proptypes */ = { * Customize the displayed rows label. Invoked with a `{ from, to, count, page }` * object. * - * For localization purposes, you can use the provided [translations](/material-ui/guides/localization/). + * For localization purposes, you can use the provided [translations](https://mui.com/material-ui/guides/localization/). * @default function defaultLabelDisplayedRows({ from, to, count }: LabelDisplayedRowsArgs) { * return `${from}–${to} of ${count !== -1 ? count : `more than ${to}`}`; * } @@ -282,7 +282,7 @@ TablePagination.propTypes /* remove-proptypes */ = { /** * Customize the rows per page label. * - * For localization purposes, you can use the provided [translations](/material-ui/guides/localization/). + * For localization purposes, you can use the provided [translations](https://mui.com/material-ui/guides/localization/). * @default 'Rows per page:' */ labelRowsPerPage: PropTypes.node, diff --git a/packages/mui-base/src/TablePagination/TablePagination.types.ts b/packages/mui-base/src/TablePagination/TablePagination.types.ts index b87908822dfe10..4eca62cb379c90 100644 --- a/packages/mui-base/src/TablePagination/TablePagination.types.ts +++ b/packages/mui-base/src/TablePagination/TablePagination.types.ts @@ -86,7 +86,7 @@ export interface TablePaginationOwnProps { * Accepts a function which returns a string value that provides a user-friendly name for the current page. * This is important for screen reader users. * - * For localization purposes, you can use the provided [translations](/material-ui/guides/localization/). + * For localization purposes, you can use the provided [translations](https://mui.com/material-ui/guides/localization/). * @param {string} type The link or button type to format ('first' | 'last' | 'next' | 'previous'). * @returns {string} * @default function defaultGetAriaLabel(type: ItemAriaLabelType) { @@ -98,7 +98,7 @@ export interface TablePaginationOwnProps { * Customize the displayed rows label. Invoked with a `{ from, to, count, page }` * object. * - * For localization purposes, you can use the provided [translations](/material-ui/guides/localization/). + * For localization purposes, you can use the provided [translations](https://mui.com/material-ui/guides/localization/). * @default function defaultLabelDisplayedRows({ from, to, count }: LabelDisplayedRowsArgs) { * return `${from}–${to} of ${count !== -1 ? count : `more than ${to}`}`; * } @@ -111,7 +111,7 @@ export interface TablePaginationOwnProps { /** * Customize the rows per page label. * - * For localization purposes, you can use the provided [translations](/material-ui/guides/localization/). + * For localization purposes, you can use the provided [translations](https://mui.com/material-ui/guides/localization/). * @default 'Rows per page:' */ labelRowsPerPage?: React.ReactNode; diff --git a/packages/mui-base/src/TablePagination/TablePaginationActions.types.ts b/packages/mui-base/src/TablePagination/TablePaginationActions.types.ts index 1967ef0d788675..dc956ce74ca0b5 100644 --- a/packages/mui-base/src/TablePagination/TablePaginationActions.types.ts +++ b/packages/mui-base/src/TablePagination/TablePaginationActions.types.ts @@ -55,7 +55,7 @@ export interface TablePaginationActionsOwnProps { * Accepts a function which returns a string value that provides a user-friendly name for the current page. * This is important for screen reader users. * - * For localization purposes, you can use the provided [translations](/material-ui/guides/localization/). + * For localization purposes, you can use the provided [translations](https://mui.com/material-ui/guides/localization/). * @param {string} type The link or button type to format ('first' | 'last' | 'next' | 'previous'). * @returns {string} */ diff --git a/packages/mui-base/src/TablePagination/index.ts b/packages/mui-base/src/TablePagination/index.ts index b816f218d6fb28..5df389b39e3838 100644 --- a/packages/mui-base/src/TablePagination/index.ts +++ b/packages/mui-base/src/TablePagination/index.ts @@ -1,4 +1,3 @@ -'use client'; export { TablePagination } from './TablePagination'; export * from './TablePagination.types'; diff --git a/packages/mui-base/src/Tabs/index.ts b/packages/mui-base/src/Tabs/index.ts index abc967c576aee4..74e3bbc11c5901 100644 --- a/packages/mui-base/src/Tabs/index.ts +++ b/packages/mui-base/src/Tabs/index.ts @@ -1,4 +1,3 @@ -'use client'; export { Tabs } from './Tabs'; export * from './TabsContext'; export * from './tabsClasses'; diff --git a/packages/mui-base/src/TabsList/index.ts b/packages/mui-base/src/TabsList/index.ts index 2828f9b042908b..949c40dd684d5d 100644 --- a/packages/mui-base/src/TabsList/index.ts +++ b/packages/mui-base/src/TabsList/index.ts @@ -1,4 +1,3 @@ -'use client'; export { TabsList } from './TabsList'; export * from './TabsList.types'; diff --git a/packages/mui-base/src/TextareaAutosize/index.ts b/packages/mui-base/src/TextareaAutosize/index.ts index 50814f03aacbaf..db9394e5a772c2 100644 --- a/packages/mui-base/src/TextareaAutosize/index.ts +++ b/packages/mui-base/src/TextareaAutosize/index.ts @@ -1,3 +1,2 @@ -'use client'; export { TextareaAutosize } from './TextareaAutosize'; export * from './TextareaAutosize.types'; diff --git a/packages/mui-base/src/Unstable_NumberInput/index.ts b/packages/mui-base/src/Unstable_NumberInput/index.ts index 90624d08f20894..6054499cf76658 100644 --- a/packages/mui-base/src/Unstable_NumberInput/index.ts +++ b/packages/mui-base/src/Unstable_NumberInput/index.ts @@ -1,4 +1,3 @@ -'use client'; export { NumberInput as Unstable_NumberInput } from './NumberInput'; export * from './numberInputClasses'; export * from './NumberInput.types'; diff --git a/packages/mui-base/src/Unstable_Popup/index.ts b/packages/mui-base/src/Unstable_Popup/index.ts index 2a4873a767fcad..2e63e5a4c909a8 100644 --- a/packages/mui-base/src/Unstable_Popup/index.ts +++ b/packages/mui-base/src/Unstable_Popup/index.ts @@ -1,4 +1,3 @@ -'use client'; export { Popup as Unstable_Popup } from './Popup'; export * from './Popup.types'; export * from './popupClasses'; diff --git a/packages/mui-base/src/unstable_useModal/index.ts b/packages/mui-base/src/unstable_useModal/index.ts index cdfed6b550e5de..e73759cf2012e2 100644 --- a/packages/mui-base/src/unstable_useModal/index.ts +++ b/packages/mui-base/src/unstable_useModal/index.ts @@ -1,4 +1,3 @@ -'use client'; export { useModal as unstable_useModal } from './useModal'; export * from './useModal.types'; export * from './ModalManager'; diff --git a/packages/mui-base/src/unstable_useModal/useModal.ts b/packages/mui-base/src/unstable_useModal/useModal.ts index 3217887ea3a2a5..3166acd289d6eb 100644 --- a/packages/mui-base/src/unstable_useModal/useModal.ts +++ b/packages/mui-base/src/unstable_useModal/useModal.ts @@ -30,11 +30,11 @@ const defaultManager = new ModalManager(); * * Demos: * - * - [Modal](https://next.mui.com/base-ui/react-modal/#hook) + * - [Modal](https://mui.com/base-ui/react-modal/#hook) * * API: * - * - [useModal API](https://next.mui.com/base-ui/react-modal/hooks-api/#use-modal) + * - [useModal API](https://mui.com/base-ui/react-modal/hooks-api/#use-modal) */ export function useModal(parameters: UseModalParameters): UseModalReturnValue { const { diff --git a/packages/mui-base/src/unstable_useNumberInput/index.ts b/packages/mui-base/src/unstable_useNumberInput/index.ts index b9197013917a74..108cb06c2f97e4 100644 --- a/packages/mui-base/src/unstable_useNumberInput/index.ts +++ b/packages/mui-base/src/unstable_useNumberInput/index.ts @@ -1,3 +1,2 @@ -'use client'; export { useNumberInput as unstable_useNumberInput } from './useNumberInput'; export * from './useNumberInput.types'; diff --git a/packages/mui-base/src/unstable_useNumberInput/useNumberInput.ts b/packages/mui-base/src/unstable_useNumberInput/useNumberInput.ts index 8c2acfa662e3e1..1129b7013fd1e7 100644 --- a/packages/mui-base/src/unstable_useNumberInput/useNumberInput.ts +++ b/packages/mui-base/src/unstable_useNumberInput/useNumberInput.ts @@ -36,11 +36,11 @@ export function getInputValueAsString(v: string): string { * * Demos: * - * - [Number Input](https://next.mui.com/base-ui/react-number-input/#hook) + * - [Number Input](https://mui.com/base-ui/react-number-input/#hook) * * API: * - * - [useNumberInput API](https://next.mui.com/base-ui/react-number-input/hooks-api/#use-number-input) + * - [useNumberInput API](https://mui.com/base-ui/react-number-input/hooks-api/#use-number-input) */ export function useNumberInput(parameters: UseNumberInputParameters): UseNumberInputReturnValue { const { diff --git a/packages/mui-base/src/useAutocomplete/useAutocomplete.d.ts b/packages/mui-base/src/useAutocomplete/useAutocomplete.d.ts index 989af6b831b3c1..8c0e920568c892 100644 --- a/packages/mui-base/src/useAutocomplete/useAutocomplete.d.ts +++ b/packages/mui-base/src/useAutocomplete/useAutocomplete.d.ts @@ -347,11 +347,11 @@ export type AutocompleteGetTagProps = ({ index }: { index: number }) => { * * Demos: * - * - [Autocomplete](https://next.mui.com/base-ui/react-autocomplete/#hook) + * - [Autocomplete](https://mui.com/base-ui/react-autocomplete/#hook) * * API: * - * - [useAutocomplete API](https://next.mui.com/base-ui/react-autocomplete/hooks-api/#use-autocomplete) + * - [useAutocomplete API](https://mui.com/base-ui/react-autocomplete/hooks-api/#use-autocomplete) */ export function useAutocomplete< Value, diff --git a/packages/mui-base/src/useBadge/index.ts b/packages/mui-base/src/useBadge/index.ts index 220df311fcc197..d8376e70c1f11e 100644 --- a/packages/mui-base/src/useBadge/index.ts +++ b/packages/mui-base/src/useBadge/index.ts @@ -1,3 +1,2 @@ -'use client'; export { useBadge } from './useBadge'; export * from './useBadge.types'; diff --git a/packages/mui-base/src/useBadge/useBadge.ts b/packages/mui-base/src/useBadge/useBadge.ts index 29fbdc8cc99d89..19422269495fbe 100644 --- a/packages/mui-base/src/useBadge/useBadge.ts +++ b/packages/mui-base/src/useBadge/useBadge.ts @@ -7,11 +7,11 @@ import { UseBadgeParameters, UseBadgeReturnValue } from './useBadge.types'; * * Demos: * - * - [Badge](https://next.mui.com/base-ui/react-badge/#hook) + * - [Badge](https://mui.com/base-ui/react-badge/#hook) * * API: * - * - [useBadge API](https://next.mui.com/base-ui/react-badge/hooks-api/#use-badge) + * - [useBadge API](https://mui.com/base-ui/react-badge/hooks-api/#use-badge) */ export function useBadge(parameters: UseBadgeParameters): UseBadgeReturnValue { const { diff --git a/packages/mui-base/src/useButton/index.ts b/packages/mui-base/src/useButton/index.ts index 53c84ebfd52737..f52872ae10fc94 100644 --- a/packages/mui-base/src/useButton/index.ts +++ b/packages/mui-base/src/useButton/index.ts @@ -1,3 +1,2 @@ -'use client'; export { useButton } from './useButton'; export * from './useButton.types'; diff --git a/packages/mui-base/src/useButton/useButton.ts b/packages/mui-base/src/useButton/useButton.ts index 4ddbfe62169954..03f9f3d968791c 100644 --- a/packages/mui-base/src/useButton/useButton.ts +++ b/packages/mui-base/src/useButton/useButton.ts @@ -17,11 +17,11 @@ import { MuiCancellableEvent } from '../utils/MuiCancellableEvent'; * * Demos: * - * - [Button](https://next.mui.com/base-ui/react-button/#hook) + * - [Button](https://mui.com/base-ui/react-button/#hook) * * API: * - * - [useButton API](https://next.mui.com/base-ui/react-button/hooks-api/#use-button) + * - [useButton API](https://mui.com/base-ui/react-button/hooks-api/#use-button) */ export function useButton(parameters: UseButtonParameters = {}): UseButtonReturnValue { const { diff --git a/packages/mui-base/src/useCompound/index.ts b/packages/mui-base/src/useCompound/index.ts index f8e6f64b6d19cd..2fea72863a76fa 100644 --- a/packages/mui-base/src/useCompound/index.ts +++ b/packages/mui-base/src/useCompound/index.ts @@ -1,3 +1,2 @@ -'use client'; export * from './useCompoundParent'; export * from './useCompoundItem'; diff --git a/packages/mui-base/src/useDropdown/index.ts b/packages/mui-base/src/useDropdown/index.ts index 79fc0ef7f3c3de..31bf24a2a9704d 100644 --- a/packages/mui-base/src/useDropdown/index.ts +++ b/packages/mui-base/src/useDropdown/index.ts @@ -1,4 +1,3 @@ -'use client'; export * from './useDropdown'; export * from './useDropdown.types'; export * from './DropdownContext'; diff --git a/packages/mui-base/src/useDropdown/useDropdown.ts b/packages/mui-base/src/useDropdown/useDropdown.ts index 5184a369d3c2dd..f6b1fc1be5e11c 100644 --- a/packages/mui-base/src/useDropdown/useDropdown.ts +++ b/packages/mui-base/src/useDropdown/useDropdown.ts @@ -10,11 +10,11 @@ import { dropdownReducer } from './dropdownReducer'; * * Demos: * - * - [Menu](https://next.mui.com/base-ui/react-menu/#hooks) + * - [Menu](https://mui.com/base-ui/react-menu/#hooks) * * API: * - * - [useDropdown API](https://next.mui.com/base-ui/react-menu/hooks-api/#use-dropdown) + * - [useDropdown API](https://mui.com/base-ui/react-menu/hooks-api/#use-dropdown) */ export function useDropdown(parameters: UseDropdownParameters = {}) { const { defaultOpen, onOpenChange, open: openProp, componentName = 'useDropdown' } = parameters; diff --git a/packages/mui-base/src/useInput/index.ts b/packages/mui-base/src/useInput/index.ts index c37d6a9cd223c5..34acd62df73202 100644 --- a/packages/mui-base/src/useInput/index.ts +++ b/packages/mui-base/src/useInput/index.ts @@ -1,4 +1,3 @@ -'use client'; export { useInput } from './useInput'; export * from './useInput.types'; diff --git a/packages/mui-base/src/useInput/useInput.ts b/packages/mui-base/src/useInput/useInput.ts index 862fc573672d1e..146d7f0882232d 100644 --- a/packages/mui-base/src/useInput/useInput.ts +++ b/packages/mui-base/src/useInput/useInput.ts @@ -14,11 +14,11 @@ import { * * Demos: * - * - [Input](https://next.mui.com/base-ui/react-input/#hook) + * - [Input](https://mui.com/base-ui/react-input/#hook) * * API: * - * - [useInput API](https://next.mui.com/base-ui/react-input/hooks-api/#use-input) + * - [useInput API](https://mui.com/base-ui/react-input/hooks-api/#use-input) */ export function useInput(parameters: UseInputParameters = {}): UseInputReturnValue { const { diff --git a/packages/mui-base/src/useList/index.ts b/packages/mui-base/src/useList/index.ts index 045af1c489c25f..1d6568987ef809 100644 --- a/packages/mui-base/src/useList/index.ts +++ b/packages/mui-base/src/useList/index.ts @@ -1,4 +1,3 @@ -'use client'; export { useList } from './useList'; export * from './useList.types'; diff --git a/packages/mui-base/src/useMenu/index.ts b/packages/mui-base/src/useMenu/index.ts index 0d08ba73cf9aea..dbd252273d5452 100644 --- a/packages/mui-base/src/useMenu/index.ts +++ b/packages/mui-base/src/useMenu/index.ts @@ -1,4 +1,3 @@ -'use client'; export { useMenu } from './useMenu'; export * from './useMenu.types'; export * from './MenuProvider'; diff --git a/packages/mui-base/src/useMenu/useMenu.ts b/packages/mui-base/src/useMenu/useMenu.ts index 06d3de7c0ed3ae..aa4215ee4b3b92 100644 --- a/packages/mui-base/src/useMenu/useMenu.ts +++ b/packages/mui-base/src/useMenu/useMenu.ts @@ -30,11 +30,11 @@ const FALLBACK_MENU_CONTEXT: DropdownContextValue = { * * Demos: * - * - [Menu](https://next.mui.com/base-ui/react-menu/#hooks) + * - [Menu](https://mui.com/base-ui/react-menu/#hooks) * * API: * - * - [useMenu API](https://next.mui.com/base-ui/react-menu/hooks-api/#use-menu) + * - [useMenu API](https://mui.com/base-ui/react-menu/hooks-api/#use-menu) */ export function useMenu(parameters: UseMenuParameters = {}): UseMenuReturnValue { const { diff --git a/packages/mui-base/src/useMenuButton/index.ts b/packages/mui-base/src/useMenuButton/index.ts index 0f9d874d50129e..d933dea9d2049d 100644 --- a/packages/mui-base/src/useMenuButton/index.ts +++ b/packages/mui-base/src/useMenuButton/index.ts @@ -1,3 +1,2 @@ -'use client'; export { useMenuButton } from './useMenuButton'; export * from './useMenuButton.types'; diff --git a/packages/mui-base/src/useMenuButton/useMenuButton.ts b/packages/mui-base/src/useMenuButton/useMenuButton.ts index 4103e040bed9c2..82a04a688cee67 100644 --- a/packages/mui-base/src/useMenuButton/useMenuButton.ts +++ b/packages/mui-base/src/useMenuButton/useMenuButton.ts @@ -14,11 +14,11 @@ import { extractEventHandlers } from '../utils'; * * Demos: * - * - [Menu](https://next.mui.com/base-ui/react-menu/#hooks) + * - [Menu](https://mui.com/base-ui/react-menu/#hooks) * * API: * - * - [useMenuButton API](https://next.mui.com/base-ui/react-menu/hooks-api/#use-menu-button) + * - [useMenuButton API](https://mui.com/base-ui/react-menu/hooks-api/#use-menu-button) */ export function useMenuButton(parameters: UseMenuButtonParameters = {}): UseMenuButtonReturnValue { const { disabled = false, focusableWhenDisabled, rootRef: externalRef } = parameters; diff --git a/packages/mui-base/src/useMenuItem/index.ts b/packages/mui-base/src/useMenuItem/index.ts index f480bce7a2b53f..6aa1625e347657 100644 --- a/packages/mui-base/src/useMenuItem/index.ts +++ b/packages/mui-base/src/useMenuItem/index.ts @@ -1,4 +1,3 @@ -'use client'; export { useMenuItem } from './useMenuItem'; export * from './useMenuItem.types'; export * from './useMenuItemContextStabilizer'; diff --git a/packages/mui-base/src/useMenuItem/useMenuItem.ts b/packages/mui-base/src/useMenuItem/useMenuItem.ts index 74545d2ddad541..40f6fee89998ea 100644 --- a/packages/mui-base/src/useMenuItem/useMenuItem.ts +++ b/packages/mui-base/src/useMenuItem/useMenuItem.ts @@ -34,11 +34,11 @@ const FALLBACK_MENU_CONTEXT: DropdownContextValue = { * * Demos: * - * - [Menu](https://next.mui.com/base-ui/react-menu/#hooks) + * - [Menu](https://mui.com/base-ui/react-menu/#hooks) * * API: * - * - [useMenuItem API](https://next.mui.com/base-ui/react-menu/hooks-api/#use-menu-item) + * - [useMenuItem API](https://mui.com/base-ui/react-menu/hooks-api/#use-menu-item) */ export function useMenuItem(params: UseMenuItemParameters): UseMenuItemReturnValue { const { diff --git a/packages/mui-base/src/useMenuItem/useMenuItemContextStabilizer.ts b/packages/mui-base/src/useMenuItem/useMenuItemContextStabilizer.ts index 259d52fedf809e..43e8719d5e0eac 100644 --- a/packages/mui-base/src/useMenuItem/useMenuItemContextStabilizer.ts +++ b/packages/mui-base/src/useMenuItem/useMenuItemContextStabilizer.ts @@ -8,11 +8,11 @@ import { ListContext, ListContextValue, ListItemState } from '../useList'; * * Demos: * - * - [Menu](https://next.mui.com/base-ui/react-menu/#hooks) + * - [Menu](https://mui.com/base-ui/react-menu/#hooks) * * API: * - * - [useMenuItemContextStabilizer API](https://next.mui.com/base-ui/react-menu/hooks-api/#use-menu-item-context-stabilizer) + * - [useMenuItemContextStabilizer API](https://mui.com/base-ui/react-menu/hooks-api/#use-menu-item-context-stabilizer) * * @param id - The id of the MenuItem. If undefined, it will be generated with useId. * @returns The stable ListContext value and the id of the MenuItem. diff --git a/packages/mui-base/src/useOption/index.ts b/packages/mui-base/src/useOption/index.ts index 64b8a5887662a2..35601c1b437d98 100644 --- a/packages/mui-base/src/useOption/index.ts +++ b/packages/mui-base/src/useOption/index.ts @@ -1,4 +1,3 @@ -'use client'; export { useOption } from './useOption'; export * from './useOption.types'; export * from './useOptionContextStabilizer'; diff --git a/packages/mui-base/src/useOption/useOption.ts b/packages/mui-base/src/useOption/useOption.ts index 69c344aa7954fe..3164a47f6d5cc8 100644 --- a/packages/mui-base/src/useOption/useOption.ts +++ b/packages/mui-base/src/useOption/useOption.ts @@ -14,11 +14,11 @@ import { EventHandlers } from '../utils/types'; * * Demos: * - * - [Select](https://next.mui.com/base-ui/react-select/#hooks) + * - [Select](https://mui.com/base-ui/react-select/#hooks) * * API: * - * - [useOption API](https://next.mui.com/base-ui/react-select/hooks-api/#use-option) + * - [useOption API](https://mui.com/base-ui/react-select/hooks-api/#use-option) */ export function useOption<Value>(params: UseOptionParameters<Value>): UseOptionReturnValue { const { value, label, disabled, rootRef: optionRefParam, id: idParam } = params; diff --git a/packages/mui-base/src/useOption/useOptionContextStabilizer.ts b/packages/mui-base/src/useOption/useOptionContextStabilizer.ts index 25230a3c5d47fd..fe77b4e319f17a 100644 --- a/packages/mui-base/src/useOption/useOptionContextStabilizer.ts +++ b/packages/mui-base/src/useOption/useOptionContextStabilizer.ts @@ -7,11 +7,11 @@ import { ListContext, ListContextValue } from '../useList'; * * Demos: * - * - [Select](https://next.mui.com/base-ui/react-select/#hooks) + * - [Select](https://mui.com/base-ui/react-select/#hooks) * * API: * - * - [useOptionContextStabilizer API](https://next.mui.com/base-ui/react-select/hooks-api/#use-option-context-stabilizer) + * - [useOptionContextStabilizer API](https://mui.com/base-ui/react-select/hooks-api/#use-option-context-stabilizer) * * @param value - The value of the Option. * @returns The stable ListContext value. diff --git a/packages/mui-base/src/useSelect/index.ts b/packages/mui-base/src/useSelect/index.ts index 7773d46920a911..014e5d90811167 100644 --- a/packages/mui-base/src/useSelect/index.ts +++ b/packages/mui-base/src/useSelect/index.ts @@ -1,4 +1,3 @@ -'use client'; export { useSelect } from './useSelect'; export * from './useSelect.types'; export * from './SelectProvider'; diff --git a/packages/mui-base/src/useSelect/useSelect.ts b/packages/mui-base/src/useSelect/useSelect.ts index a14df7671a4ad9..984b93e32922b0 100644 --- a/packages/mui-base/src/useSelect/useSelect.ts +++ b/packages/mui-base/src/useSelect/useSelect.ts @@ -56,11 +56,11 @@ function defaultFormValueProvider<OptionValue>( * * Demos: * - * - [Select](https://next.mui.com/base-ui/react-select/#hooks) + * - [Select](https://mui.com/base-ui/react-select/#hooks) * * API: * - * - [useSelect API](https://next.mui.com/base-ui/react-select/hooks-api/#use-select) + * - [useSelect API](https://mui.com/base-ui/react-select/hooks-api/#use-select) */ function useSelect<OptionValue, Multiple extends boolean = false>( props: UseSelectParameters<OptionValue, Multiple>, diff --git a/packages/mui-base/src/useSlider/index.ts b/packages/mui-base/src/useSlider/index.ts index f13ff862e30dad..0e8b89eb00ffad 100644 --- a/packages/mui-base/src/useSlider/index.ts +++ b/packages/mui-base/src/useSlider/index.ts @@ -1,3 +1,2 @@ -'use client'; export * from './useSlider'; export * from './useSlider.types'; diff --git a/packages/mui-base/src/useSlider/useSlider.ts b/packages/mui-base/src/useSlider/useSlider.ts index 695a8416fcfc3b..5fe4fdf97ecb0e 100644 --- a/packages/mui-base/src/useSlider/useSlider.ts +++ b/packages/mui-base/src/useSlider/useSlider.ts @@ -190,11 +190,11 @@ function doesSupportTouchActionNone() { * * Demos: * - * - [Slider](https://next.mui.com/base-ui/react-slider/#hook) + * - [Slider](https://mui.com/base-ui/react-slider/#hook) * * API: * - * - [useSlider API](https://next.mui.com/base-ui/react-slider/hooks-api/#use-slider) + * - [useSlider API](https://mui.com/base-ui/react-slider/hooks-api/#use-slider) */ export function useSlider(parameters: UseSliderParameters): UseSliderReturnValue { const { diff --git a/packages/mui-base/src/useSnackbar/index.ts b/packages/mui-base/src/useSnackbar/index.ts index 123fce143e7074..9a595a63e425c4 100644 --- a/packages/mui-base/src/useSnackbar/index.ts +++ b/packages/mui-base/src/useSnackbar/index.ts @@ -1,3 +1,2 @@ -'use client'; export { useSnackbar } from './useSnackbar'; export * from './useSnackbar.types'; diff --git a/packages/mui-base/src/useSnackbar/useSnackbar.ts b/packages/mui-base/src/useSnackbar/useSnackbar.ts index 68301be94b9284..4b9de6ad0754bb 100644 --- a/packages/mui-base/src/useSnackbar/useSnackbar.ts +++ b/packages/mui-base/src/useSnackbar/useSnackbar.ts @@ -17,11 +17,11 @@ import { EventHandlers } from '../utils/types'; * * Demos: * - * - [Snackbar](https://next.mui.com/base-ui/react-snackbar/#hook) + * - [Snackbar](https://mui.com/base-ui/react-snackbar/#hook) * * API: * - * - [useSnackbar API](https://next.mui.com/base-ui/react-snackbar/hooks-api/#use-snackbar) + * - [useSnackbar API](https://mui.com/base-ui/react-snackbar/hooks-api/#use-snackbar) */ export function useSnackbar(parameters: UseSnackbarParameters = {}): UseSnackbarReturnValue { const { diff --git a/packages/mui-base/src/useSwitch/index.ts b/packages/mui-base/src/useSwitch/index.ts index 2c0e7428f08750..0e89a92173862c 100644 --- a/packages/mui-base/src/useSwitch/index.ts +++ b/packages/mui-base/src/useSwitch/index.ts @@ -1,3 +1,2 @@ -'use client'; export { useSwitch } from './useSwitch'; export * from './useSwitch.types'; diff --git a/packages/mui-base/src/useSwitch/useSwitch.ts b/packages/mui-base/src/useSwitch/useSwitch.ts index b63ca86d7cfb27..65b3ceaf88991f 100644 --- a/packages/mui-base/src/useSwitch/useSwitch.ts +++ b/packages/mui-base/src/useSwitch/useSwitch.ts @@ -12,11 +12,11 @@ import { UseSwitchParameters, UseSwitchReturnValue } from './useSwitch.types'; * * Demos: * - * - [Switch](https://next.mui.com/base-ui/react-switch/#hook) + * - [Switch](https://mui.com/base-ui/react-switch/#hook) * * API: * - * - [useSwitch API](https://next.mui.com/base-ui/react-switch/hooks-api/#use-switch) + * - [useSwitch API](https://mui.com/base-ui/react-switch/hooks-api/#use-switch) */ export function useSwitch(props: UseSwitchParameters): UseSwitchReturnValue { const { diff --git a/packages/mui-base/src/useTab/index.ts b/packages/mui-base/src/useTab/index.ts index a2e4fd0ffbc9e8..c455a73bd484ed 100644 --- a/packages/mui-base/src/useTab/index.ts +++ b/packages/mui-base/src/useTab/index.ts @@ -1,3 +1,2 @@ -'use client'; export { useTab } from './useTab'; export * from './useTab.types'; diff --git a/packages/mui-base/src/useTab/useTab.ts b/packages/mui-base/src/useTab/useTab.ts index 169e85266f8a75..de0d99f5232828 100644 --- a/packages/mui-base/src/useTab/useTab.ts +++ b/packages/mui-base/src/useTab/useTab.ts @@ -18,11 +18,11 @@ function tabValueGenerator(otherTabValues: Set<string | number>) { * * Demos: * - * - [Tabs](https://next.mui.com/base-ui/react-tabs/#hooks) + * - [Tabs](https://mui.com/base-ui/react-tabs/#hooks) * * API: * - * - [useTab API](https://next.mui.com/base-ui/react-tabs/hooks-api/#use-tab) + * - [useTab API](https://mui.com/base-ui/react-tabs/hooks-api/#use-tab) */ function useTab(parameters: UseTabParameters): UseTabReturnValue { const { value: valueParam, rootRef: externalRef, disabled = false, id: idParam } = parameters; diff --git a/packages/mui-base/src/useTabPanel/index.ts b/packages/mui-base/src/useTabPanel/index.ts index b50d04d1a8d7ea..2e72d19f4276c1 100644 --- a/packages/mui-base/src/useTabPanel/index.ts +++ b/packages/mui-base/src/useTabPanel/index.ts @@ -1,3 +1,2 @@ -'use client'; export { useTabPanel } from './useTabPanel'; export * from './useTabPanel.types'; diff --git a/packages/mui-base/src/useTabPanel/useTabPanel.ts b/packages/mui-base/src/useTabPanel/useTabPanel.ts index 5914b00a59ae13..2f70921b40f6d3 100644 --- a/packages/mui-base/src/useTabPanel/useTabPanel.ts +++ b/packages/mui-base/src/useTabPanel/useTabPanel.ts @@ -17,11 +17,11 @@ function tabPanelValueGenerator(otherTabPanelValues: Set<string | number>) { * * Demos: * - * - [Tabs](https://next.mui.com/base-ui/react-tabs/#hooks) + * - [Tabs](https://mui.com/base-ui/react-tabs/#hooks) * * API: * - * - [useTabPanel API](https://next.mui.com/base-ui/react-tabs/hooks-api/#use-tab-panel) + * - [useTabPanel API](https://mui.com/base-ui/react-tabs/hooks-api/#use-tab-panel) */ function useTabPanel(parameters: UseTabPanelParameters): UseTabPanelReturnValue { const { value: valueParam, id: idParam, rootRef: externalRef } = parameters; diff --git a/packages/mui-base/src/useTabs/index.ts b/packages/mui-base/src/useTabs/index.ts index 6638acfe020e04..c12b85bf869619 100644 --- a/packages/mui-base/src/useTabs/index.ts +++ b/packages/mui-base/src/useTabs/index.ts @@ -1,4 +1,3 @@ -'use client'; export * from './useTabs'; export * from './useTabs.types'; export * from './TabsProvider'; diff --git a/packages/mui-base/src/useTabs/useTabs.ts b/packages/mui-base/src/useTabs/useTabs.ts index 2fc70b3860c4b3..bf6e1d368f8f70 100644 --- a/packages/mui-base/src/useTabs/useTabs.ts +++ b/packages/mui-base/src/useTabs/useTabs.ts @@ -17,11 +17,11 @@ type IdLookupFunction = (id: string | number) => string | undefined; * * Demos: * - * - [Tabs](https://next.mui.com/base-ui/react-tabs/#hooks) + * - [Tabs](https://mui.com/base-ui/react-tabs/#hooks) * * API: * - * - [useTabs API](https://next.mui.com/base-ui/react-tabs/hooks-api/#use-tabs) + * - [useTabs API](https://mui.com/base-ui/react-tabs/hooks-api/#use-tabs) */ function useTabs(parameters: UseTabsParameters): UseTabsReturnValue { const { diff --git a/packages/mui-base/src/useTabsList/index.ts b/packages/mui-base/src/useTabsList/index.ts index 4ba3e5e23c4633..0241cfc8f8c486 100644 --- a/packages/mui-base/src/useTabsList/index.ts +++ b/packages/mui-base/src/useTabsList/index.ts @@ -1,4 +1,3 @@ -'use client'; export { useTabsList } from './useTabsList'; export * from './useTabsList.types'; export * from './TabsListProvider'; diff --git a/packages/mui-base/src/useTabsList/useTabsList.ts b/packages/mui-base/src/useTabsList/useTabsList.ts index 64afb1beef8118..3afdb4b8448dd6 100644 --- a/packages/mui-base/src/useTabsList/useTabsList.ts +++ b/packages/mui-base/src/useTabsList/useTabsList.ts @@ -17,11 +17,11 @@ import { tabsListReducer } from './tabsListReducer'; * * Demos: * - * - [Tabs](https://next.mui.com/base-ui/react-tabs/#hooks) + * - [Tabs](https://mui.com/base-ui/react-tabs/#hooks) * * API: * - * - [useTabsList API](https://next.mui.com/base-ui/react-tabs/hooks-api/#use-tabs-list) + * - [useTabsList API](https://mui.com/base-ui/react-tabs/hooks-api/#use-tabs-list) */ function useTabsList(parameters: UseTabsListParameters): UseTabsListReturnValue { const { rootRef: externalRef } = parameters; diff --git a/packages/mui-base/src/useTransition/useTransitionStateManager.ts b/packages/mui-base/src/useTransition/useTransitionStateManager.ts index a6cacbe15fa668..3c5043cd2628ed 100644 --- a/packages/mui-base/src/useTransition/useTransitionStateManager.ts +++ b/packages/mui-base/src/useTransition/useTransitionStateManager.ts @@ -19,11 +19,11 @@ export type UseTransitionStateManagerReturnValue = { * * Demos: * - * - [Transitions](https://next.mui.com/base-ui/react-transitions/#hooks) + * - [Transitions](https://mui.com/base-ui/react-transitions/#hooks) * * API: * - * - [useTransitionStateManager API](https://next.mui.com/base-ui/react-transitions/hooks-api/#use-transition-state-manager) + * - [useTransitionStateManager API](https://mui.com/base-ui/react-transitions/hooks-api/#use-transition-state-manager) */ export function useTransitionStateManager(): UseTransitionStateManagerReturnValue { const transitionContext = React.useContext(TransitionContext); diff --git a/packages/mui-base/src/useTransition/useTransitionTrigger.ts b/packages/mui-base/src/useTransition/useTransitionTrigger.ts index babc3caa150421..2430731fe1a91c 100644 --- a/packages/mui-base/src/useTransition/useTransitionTrigger.ts +++ b/packages/mui-base/src/useTransition/useTransitionTrigger.ts @@ -7,11 +7,11 @@ import { TransitionContextValue } from './TransitionContext'; * * Demos: * - * - [Transitions](https://next.mui.com/base-ui/react-transitions/#hooks) + * - [Transitions](https://mui.com/base-ui/react-transitions/#hooks) * * API: * - * - [useTransitionTrigger API](https://next.mui.com/base-ui/react-transitions/hooks-api/#use-transition-trigger) + * - [useTransitionTrigger API](https://mui.com/base-ui/react-transitions/hooks-api/#use-transition-trigger) */ export function useTransitionTrigger(requestEnter: boolean): UseTransitionTriggerReturnValue { const [exitTransitionFinished, setExitTransitionFinished] = React.useState(true); diff --git a/packages/mui-base/src/utils/index.ts b/packages/mui-base/src/utils/index.ts index 6940094b6697bc..173e47c3b5584c 100644 --- a/packages/mui-base/src/utils/index.ts +++ b/packages/mui-base/src/utils/index.ts @@ -1,4 +1,3 @@ -'use client'; export { appendOwnerState } from './appendOwnerState'; export { areArraysEqual } from './areArraysEqual'; export { ClassNameConfigurator } from './ClassNameConfigurator'; diff --git a/packages/mui-codemod/README.md b/packages/mui-codemod/README.md index 2786b3c83c0eb2..78186cf3235baf 100644 --- a/packages/mui-codemod/README.md +++ b/packages/mui-codemod/README.md @@ -14,7 +14,7 @@ Some of the codemods also run [postcss](https://github.com/postcss/postcss) plug <!-- #default-branch-switch --> ```bash -npx @mui/codemod@next <codemod> <paths...> +npx @mui/codemod@latest <codemod> <paths...> Applies a `@mui/codemod` to the specified paths @@ -34,10 +34,10 @@ Options: --jscodeshift [string] [default: false] Examples: - npx @mui/codemod@next v4.0.0/theme-spacing-api src - npx @mui/codemod@next v5.0.0/component-rename-prop src -- + npx @mui/codemod@latest v4.0.0/theme-spacing-api src + npx @mui/codemod@latest v5.0.0/component-rename-prop src -- --component=Grid --from=prop --to=newProp - npx @mui/codemod@next v5.0.0/preset-safe src --parser=flow + npx @mui/codemod@latest v5.0.0/preset-safe src --parser=flow ``` ### jscodeshift options @@ -45,7 +45,7 @@ Examples: To pass more options directly to jscodeshift, use `--jscodeshift="..."`. For example: ```bash -npx @mui/codemod@next --jscodeshift="--run-in-band --verbose=2" +npx @mui/codemod@latest --jscodeshift="--run-in-band --verbose=2" ``` See all available options [here](https://github.com/facebook/jscodeshift#usage-cli). @@ -56,7 +56,7 @@ Options to [recast](https://github.com/benjamn/recast)'s printer can be provided through jscodeshift's `printOptions` command line argument ```bash -npx @mui/codemod@next <transform> <path> --jscodeshift="--printOptions='{\"quote\":\"double\"}'" +npx @mui/codemod@latest <transform> <path> --jscodeshift="--printOptions='{\"quote\":\"double\"}'" ``` ## Included scripts @@ -71,7 +71,7 @@ npx @mui/codemod@next <transform> <path> --jscodeshift="--printOptions='{\"quote ### Deprecations ```bash -npx @mui/codemod@next deprecations/all <path> +npx @mui/codemod@latest deprecations/all <path> ``` #### `all` @@ -90,7 +90,7 @@ A combination of all deprecations. ``` ```bash -npx @mui/codemod@next deprecations/accordion-props <path> +npx @mui/codemod@latest deprecations/accordion-props <path> ``` #### `accordion-summary-classes` @@ -133,7 +133,7 @@ CSS transforms: ``` ```bash -npx @mui/codemod@next deprecations/accordion-summary-classes <path> +npx @mui/codemod@latest deprecations/accordion-summary-classes <path> ``` #### `alert-classes` @@ -229,7 +229,7 @@ CSS transforms: ``` ```bash -npx @mui/codemod@next deprecations/alert-classes <path> +npx @mui/codemod@latest deprecations/alert-classes <path> ``` #### `alert-props` @@ -255,7 +255,7 @@ npx @mui/codemod@next deprecations/alert-classes <path> ``` ```bash -npx @mui/codemod@next deprecations/alert-props <path> +npx @mui/codemod@latest deprecations/alert-props <path> ``` #### `autocomplete-props` @@ -321,7 +321,7 @@ npx @mui/codemod@next deprecations/alert-props <path> ``` ```bash -npx @mui/codemod@next deprecations/autocomplete-props <path> +npx @mui/codemod@latest deprecations/autocomplete-props <path> ``` #### `avatar-group-props` @@ -369,7 +369,7 @@ npx @mui/codemod@next deprecations/autocomplete-props <path> ``` ```bash -npx @mui/codemod@next deprecations/avatar-group-props <path> +npx @mui/codemod@latest deprecations/avatar-group-props <path> ``` #### `avatar-props` @@ -418,7 +418,7 @@ npx @mui/codemod@next deprecations/avatar-group-props <path> ``` ```bash -npx @mui/codemod@next deprecations/backdrop-props <path> +npx @mui/codemod@latest deprecations/backdrop-props <path> ``` #### `badge-props` @@ -444,7 +444,7 @@ npx @mui/codemod@next deprecations/backdrop-props <path> ``` ```bash -npx @mui/codemod@next deprecations/badge-props <path> +npx @mui/codemod@latest deprecations/badge-props <path> ``` #### `button-classes` @@ -666,7 +666,7 @@ CSS transforms: ``` ```bash -npx @mui/codemod@next deprecations/button-classes <path> +npx @mui/codemod@latest deprecations/button-classes <path> ``` #### `button-group-classes` @@ -973,7 +973,7 @@ CSS transforms: ``` ```bash -npx @mui/codemod@next deprecations/chip-classes <path> +npx @mui/codemod@latest deprecations/chip-classes <path> ``` #### `circular-progress-classes` @@ -1012,7 +1012,7 @@ CSS transforms: ``` ```bash -npx @mui/codemod@next deprecations/circular-progress-classes <path> +npx @mui/codemod@latest deprecations/circular-progress-classes <path> ``` #### `divider-props` @@ -1025,7 +1025,7 @@ npx @mui/codemod@next deprecations/circular-progress-classes <path> ``` ```bash -npx @mui/codemod@next deprecations/divider-props <path> +npx @mui/codemod@latest deprecations/divider-props <path> ``` #### `filled-input-props` @@ -1051,7 +1051,7 @@ npx @mui/codemod@next deprecations/divider-props <path> ``` ```bash -npx @mui/codemod@next deprecations/filled-input-props <path> +npx @mui/codemod@latest deprecations/filled-input-props <path> ``` #### `form-control-label-props` @@ -1073,7 +1073,7 @@ npx @mui/codemod@next deprecations/filled-input-props <path> ``` ```bash -npx @mui/codemod@next deprecations/form-control-label-props <path> +npx @mui/codemod@latest deprecations/form-control-label-props <path> ``` @@ -1100,20 +1100,7 @@ npx @mui/codemod@next deprecations/form-control-label-props <path> ``` ```bash -npx @mui/codemod@next deprecations/list-item-props <path> -``` - -#### `grid-props` - -```diff - <Grid -- wrap="nowrap" -+ flexWrap="nowrap" - /> -``` - -```bash -npx @mui/codemod@next deprecations/grid-props <path> +npx @mui/codemod@latest deprecations/list-item-props <path> ``` #### `image-list-item-bar-classes` @@ -1170,7 +1157,7 @@ CSS transforms: ``` ```bash -npx @mui/codemod@next deprecations/image-list-item-bar-classes <path> +npx @mui/codemod@latest deprecations/image-list-item-bar-classes <path> ``` #### `input-base-props` @@ -1196,7 +1183,7 @@ npx @mui/codemod@next deprecations/image-list-item-bar-classes <path> ``` ```bash -npx @mui/codemod@next deprecations/input-base-props <path> +npx @mui/codemod@latest deprecations/input-base-props <path> ``` #### `input-props` @@ -1222,7 +1209,7 @@ npx @mui/codemod@next deprecations/input-base-props <path> ``` ```bash -npx @mui/codemod@next deprecations/input-props <path> +npx @mui/codemod@latest deprecations/input-props <path> ``` #### `modal-props` @@ -1248,7 +1235,7 @@ npx @mui/codemod@next deprecations/input-props <path> ``` ```bash -npx @mui/codemod@next deprecations/modal-props <path> +npx @mui/codemod@latest deprecations/modal-props <path> ``` #### `pagination-item-classes` @@ -1312,7 +1299,7 @@ CSS transforms: ``` ```bash -npx @mui/codemod@next deprecations/pagination-item-classes <path> +npx @mui/codemod@latest deprecations/pagination-item-classes <path> ``` #### `pagination-item-props` @@ -1334,7 +1321,7 @@ npx @mui/codemod@next deprecations/pagination-item-classes <path> ``` ```bash -npx @mui/codemod@next deprecations/pagination-item-props <path> +npx @mui/codemod@latest deprecations/pagination-item-props <path> ``` #### `popper-props` @@ -1360,7 +1347,7 @@ npx @mui/codemod@next deprecations/pagination-item-props <path> ``` ```bash -npx @mui/codemod@next deprecations/popper-props <path> +npx @mui/codemod@latest deprecations/popper-props <path> ``` #### `outlined-input-props` @@ -1386,7 +1373,7 @@ npx @mui/codemod@next deprecations/popper-props <path> ``` ```bash -npx @mui/codemod@next deprecations/outlined-input-props <path> +npx @mui/codemod@latest deprecations/outlined-input-props <path> ``` #### `slider-props` @@ -1412,7 +1399,7 @@ npx @mui/codemod@next deprecations/outlined-input-props <path> ``` ```bash -npx @mui/codemod@next deprecations/slider-props <path> +npx @mui/codemod@latest deprecations/slider-props <path> ``` #### `tooltip-props` @@ -1438,7 +1425,7 @@ npx @mui/codemod@next deprecations/slider-props <path> ``` ```bash -npx @mui/codemod@next deprecations/tooltip-props <path> +npx @mui/codemod@latest deprecations/tooltip-props <path> ``` #### `step-connector-classes` @@ -1514,7 +1501,7 @@ npx @mui/codemod@latest deprecations/step-label-props <path> ``` ```bash -npx @mui/codemod@next deprecations/text-field-props <path> +npx @mui/codemod@latest deprecations/text-field-props <path> ``` #### `toggle-button-group-classes` @@ -1569,7 +1556,7 @@ CSS transforms: ``` ```bash -npx @mui/codemod@next deprecations/step-connector-classes <path> +npx @mui/codemod@latest deprecations/step-connector-classes <path> ``` #### `tab-classes` @@ -1599,7 +1586,7 @@ CSS transforms: ``` ```bash -npx @mui/codemod@next deprecations/tab-classes <path> +npx @mui/codemod@latest deprecations/tab-classes <path> ``` #### `table-sort-label-classes` @@ -1638,7 +1625,7 @@ CSS transforms: ``` ```bash -npx @mui/codemod@next deprecations/table-sort-label-classes <path> +npx @mui/codemod@latest deprecations/table-sort-label-classes <path> ``` #### `typography-props` @@ -1660,7 +1647,7 @@ npx @mui/codemod@next deprecations/table-sort-label-classes <path> ``` ```bash -npx @mui/codemod@next deprecations/typography-props <path> +npx @mui/codemod@latest deprecations/typography-props <path> ``` ### v6.0.0 @@ -1668,7 +1655,7 @@ npx @mui/codemod@next deprecations/typography-props <path> #### `sx-prop` ```bash -npx @mui/codemod@next v6.0.0/sx-prop <path> +npx @mui/codemod@latest v6.0.0/sx-prop <path> ``` Update the usage of the `sx` prop to be compatible with `@pigment-css/react`. @@ -1691,7 +1678,7 @@ Update the usage of the `sx` prop to be compatible with `@pigment-css/react`. #### `system-props` ```bash -npx @mui/codemod@next v6.0.0/system-props <path> +npx @mui/codemod@latest v6.0.0/system-props <path> ``` Remove system props and add them to the `sx` prop. @@ -1704,7 +1691,7 @@ Remove system props and add them to the `sx` prop. #### `theme-v6` ```bash -npx @mui/codemod@next v6.0.0/theme-v6 <path> +npx @mui/codemod@latest v6.0.0/theme-v6 <path> ``` Update the theme creation from `@mui/system@v5` to be compatible with `@pigment-css/react`. @@ -1766,7 +1753,7 @@ Update the theme creation from `@mui/system@v5` to be compatible with `@pigment- #### `styled` ```bash -npx @mui/codemod@next v6.0.0/styled <path> +npx @mui/codemod@latest v6.0.0/styled <path> ``` Updates the usage of `styled` from `@mui/system@v5` to be compatible with `@pigment-css/react`. @@ -1840,7 +1827,7 @@ However, it has some **limitations**: #### `grid-v2-props` ```bash -npx @mui/codemod@next v6.0.0/grid-v2-props <path> +npx @mui/codemod@latest v6.0.0/grid-v2-props <path> ``` Updates the usage of the `@mui/material/Grid2`, `@mui/system/Grid`, and `@mui/joy/Grid` components to their updated APIs. @@ -1859,7 +1846,7 @@ Updates the usage of the `@mui/material/Grid2`, `@mui/system/Grid`, and `@mui/jo You can provide the theme breakpoints via options, for example, `--jscodeshift='--muiBreakpoints=mobile,desktop'`, to use your custom breakpoints in the transformation. ```bash -npx @mui/codemod@next v6.0.0/grid-v2-props <path> --jscodeshift='--muiBreakpoints=mobile,desktop' +npx @mui/codemod@latest v6.0.0/grid-v2-props <path> --jscodeshift='--muiBreakpoints=mobile,desktop' ``` ```diff @@ -1885,7 +1872,7 @@ This codemod updates the import and re-export statements. ``` ```bash -npx @mui/codemod@next v5.0.0/base-use-named-exports <path> +npx @mui/codemod@latest v5.0.0/base-use-named-exports <path> ``` #### `base-remove-unstyled-suffix` @@ -1898,7 +1885,7 @@ The `Unstyled` suffix has been removed from all Base UI component names, includ ``` ```bash -npx @mui/codemod@next v5.0.0/base-remove-unstyled-suffix <path> +npx @mui/codemod@latest v5.0.0/base-remove-unstyled-suffix <path> ``` #### `base-remove-component-prop` @@ -1913,7 +1900,7 @@ This change only affects Base UI components. ``` ```bash -npx @mui/codemod@next v5.0.0/base-remove-component-prop <path> +npx @mui/codemod@latest v5.0.0/base-remove-component-prop <path> ``` #### `rename-css-variables` @@ -1928,7 +1915,7 @@ Updates the names of the CSS variables of the Joy UI components to adapt to the ``` ```bash -npx @mui/codemod@next v5.0.0/rename-css-variables <path> +npx @mui/codemod@latest v5.0.0/rename-css-variables <path> ``` #### `base-hook-imports` @@ -1941,7 +1928,7 @@ Updates the sources of the imports of the Base UI hooks to adapt to the new dir ``` ```bash -npx @mui/codemod@next v5.0.0/base-hook-imports <path> +npx @mui/codemod@latest v5.0.0/base-hook-imports <path> ``` #### `joy-rename-classname-prefix` @@ -1956,7 +1943,7 @@ Renames the classname prefix from `'Joy'` to `'Mui'` for Joy UI components. ``` ```bash -npx @mui/codemod@next v5.0.0/joy-rename-classname-prefix <path> +npx @mui/codemod@latest v5.0.0/joy-rename-classname-prefix <path> ``` #### `joy-rename-row-prop` @@ -1971,7 +1958,7 @@ Transforms `row` prop to `orientation` prop across `Card`, `List` and `RadioGrou ``` ```bash -npx @mui/codemod@next v5.0.0/joy-rename-row-prop <path> +npx @mui/codemod@latest v5.0.0/joy-rename-row-prop <path> ``` #### `joy-avatar-remove-imgProps` @@ -1989,7 +1976,7 @@ This change only affects Joy UI Avatar component. ``` ```bash -npx @mui/codemod@next v5.0.0/joy-avatar-remove-imgProps <path> +npx @mui/codemod@latest v5.0.0/joy-avatar-remove-imgProps <path> ``` #### `joy-text-field-to-input` @@ -2047,7 +2034,7 @@ This change only affects Joy UI components. ``` ```bash -npx @mui/codemod@next v5.0.0/joy-text-field-to-input <path> +npx @mui/codemod@latest v5.0.0/joy-text-field-to-input <path> ``` #### `joy-rename-components-to-slots` @@ -2066,7 +2053,7 @@ This change only affects Joy UI components. ``` ```bash -npx @mui/codemod@next v5.0.0/joy-rename-components-to-slots <path> +npx @mui/codemod@latest v5.0.0/joy-rename-components-to-slots <path> ``` The associated breaking change was done in [#34997](https://github.com/mui/material-ui/pull/34997). @@ -2076,7 +2063,7 @@ The associated breaking change was done in [#34997](https://github.com/mui/mater Rename the imports of Date and Time Pickers from `@mui/lab` to `@mui/x-date-pickers` and `@mui/x-date-pickers-pro`. ```bash -npx @mui/codemod@next v5.0.0/date-pickers-moved-to-x <path> +npx @mui/codemod@latest v5.0.0/date-pickers-moved-to-x <path> ``` #### `tree-view-moved-to-x` @@ -2084,7 +2071,7 @@ npx @mui/codemod@next v5.0.0/date-pickers-moved-to-x <path> Rename the imports of Tree View from `@mui/lab` to `@mui/x-tree-view`. ```bash -npx @mui/codemod@next v5.0.0/tree-view-moved-to-x <path> +npx @mui/codemod@latest v5.0.0/tree-view-moved-to-x <path> ``` #### 🚀 `preset-safe` @@ -2092,7 +2079,7 @@ npx @mui/codemod@next v5.0.0/tree-view-moved-to-x <path> A combination of all important transformers for migrating v4 to v5. ⚠️ This codemod should be run only once. ```bash -npx @mui/codemod@next v5.0.0/preset-safe <path|folder> +npx @mui/codemod@latest v5.0.0/preset-safe <path|folder> ``` The list includes these transformers @@ -2159,7 +2146,7 @@ Imports and inserts `adaptV4Theme` into `createTheme` (or `createMuiTheme`) ``` ```bash -npx @mui/codemod@next v5.0.0/adapter-v4 <path> +npx @mui/codemod@latest v5.0.0/adapter-v4 <path> ``` You can find more details about this breaking change in [the migration guide](https://mui.com/material-ui/migration/v5-component-changes/#theme). @@ -2176,7 +2163,7 @@ Renames `Autocomplete`'s `closeIcon` prop to `clearIcon`. <!-- #default-branch-switch --> ```bash -npx @mui/codemod@next v5.0.0/autocomplete-rename-closeicon <path> +npx @mui/codemod@latest v5.0.0/autocomplete-rename-closeicon <path> ``` You can find more details about this breaking change in [the migration guide](https://mui.com/material-ui/migration/v5-component-changes/#autocomplete). @@ -2195,7 +2182,7 @@ Renames `Autocomplete`'s `getOptionSelected` to `isOptionEqualToValue`. <!-- #default-branch-switch --> ```bash -npx @mui/codemod@next v5.0.0/autocomplete-rename-option <path> +npx @mui/codemod@latest v5.0.0/autocomplete-rename-option <path> ``` You can find more details about this breaking change in [the migration guide](https://mui.com/material-ui/migration/v5-component-changes/#autocomplete). @@ -2214,7 +2201,7 @@ Updates the `Avatar`'s `variant` value and `classes` key from 'circle' to 'circu <!-- #default-branch-switch --> ```bash -npx @mui/codemod@next v5.0.0/avatar-circle-circular <path> +npx @mui/codemod@latest v5.0.0/avatar-circle-circular <path> ``` You can find more details about this breaking change in [the migration guide](https://mui.com/material-ui/migration/v5-component-changes/#avatar). @@ -2249,7 +2236,7 @@ Renames the badge's props. <!-- #default-branch-switch --> ```bash -npx @mui/codemod@next v5.0.0/badge-overlap-value <path> +npx @mui/codemod@latest v5.0.0/badge-overlap-value <path> ``` You can find more details about this breaking change in [the migration guide](https://mui.com/material-ui/migration/v5-component-changes/#badge). @@ -2273,7 +2260,7 @@ This change only affects Base UI components. <!-- #default-branch-switch --> ```bash -npx @mui/codemod@next v5.0.0/base-rename-components-to-slots <path> +npx @mui/codemod@latest v5.0.0/base-rename-components-to-slots <path> ``` The associated breaking change was done in [#34693](https://github.com/mui/material-ui/pull/34693). @@ -2292,7 +2279,7 @@ Updates the Box API from separate system props to `sx`. <!-- #default-branch-switch --> ```bash -npx @mui/codemod@next v5.0.0/box-borderradius-values <path> +npx @mui/codemod@latest v5.0.0/box-borderradius-values <path> ``` You can find more details about this breaking change in [the migration guide](https://mui.com/material-ui/migration/v5-component-changes/#box). @@ -2307,7 +2294,7 @@ Renames the Box `css` prop to `sx` ``` ```bash -npx @mui/codemod@next v5.0.0/box-rename-css <path> +npx @mui/codemod@latest v5.0.0/box-rename-css <path> ``` You can find more details about this breaking change in [the migration guide](https://mui.com/material-ui/migration/v5-component-changes/#box). @@ -2328,7 +2315,7 @@ Renames the Box `grid*Gap` props. <!-- #default-branch-switch --> ```bash -npx @mui/codemod@next v5.0.0/box-rename-gap <path> +npx @mui/codemod@latest v5.0.0/box-rename-gap <path> ``` You can find more details about this breaking change in [the migration guide](https://mui.com/material-ui/migration/v5-component-changes/#box). @@ -2345,7 +2332,7 @@ Removes the outdated `color` prop values. <!-- #default-branch-switch --> ```bash -npx @mui/codemod@next v5.0.0/button-color-prop <path> +npx @mui/codemod@latest v5.0.0/button-color-prop <path> ``` You can find more details about this breaking change in [the migration guide](https://mui.com/material-ui/migration/v5-component-changes/#button). @@ -2362,7 +2349,7 @@ Removes the Chip `variant` prop if the value is `"default"`. <!-- #default-branch-switch --> ```bash -npx @mui/codemod@next v5.0.0/chip-variant-prop <path> +npx @mui/codemod@latest v5.0.0/chip-variant-prop <path> ``` You can find more details about this breaking change in [the migration guide](https://mui.com/material-ui/migration/v5-component-changes/#chip). @@ -2379,7 +2366,7 @@ Renames the CircularProgress `static` variant to `determinate`. <!-- #default-branch-switch --> ```bash -npx @mui/codemod@next v5.0.0/circularprogress-variant <path> +npx @mui/codemod@latest v5.0.0/circularprogress-variant <path> ``` You can find more details about this breaking change in [the migration guide](https://mui.com/material-ui/migration/v5-component-changes/#circularprogress). @@ -2398,7 +2385,7 @@ Renames `Collapse`'s `collapsedHeight` prop to `collapsedSize`. <!-- #default-branch-switch --> ```bash -npx @mui/codemod@next v5.0.0/collapse-rename-collapsedheight <path> +npx @mui/codemod@latest v5.0.0/collapse-rename-collapsedheight <path> ``` You can find more details about this breaking change in [the migration guide](https://mui.com/material-ui/migration/v5-component-changes/#collapse). @@ -2417,7 +2404,7 @@ A generic codemod to rename any component prop. <!-- #default-branch-switch --> ```bash -npx @mui/codemod@next v5.0.0/component-rename-prop <path> -- --component=Grid --from=prop --to=newProp +npx @mui/codemod@latest v5.0.0/component-rename-prop <path> -- --component=Grid --from=prop --to=newProp ``` #### `core-styles-import` @@ -2430,7 +2417,7 @@ Renames private import from `core/styles/*` to `core/styles` ``` ```bash -npx @mui/codemod@next v5.0.0/core-styles-import <path> +npx @mui/codemod@latest v5.0.0/core-styles-import <path> ``` #### `create-theme` @@ -2443,7 +2430,7 @@ Renames the function `createMuiTheme` to `createTheme` ``` ```bash -npx @mui/codemod@next v5.0.0/create-theme <path> +npx @mui/codemod@latest v5.0.0/create-theme <path> ``` #### `dialog-props` @@ -2456,7 +2443,7 @@ Remove `disableBackdropClick` prop from `<Dialog>` ``` ```bash -npx @mui/codemod@next v5.0.0/dialog-props <path> +npx @mui/codemod@latest v5.0.0/dialog-props <path> ``` You can find more details about this breaking change in [the migration guide](https://mui.com/material-ui/migration/v5-component-changes/#dialog). @@ -2471,7 +2458,7 @@ Remove `disableTypography` prop from `<DialogTitle>` ``` ```bash -npx @mui/codemod@next v5.0.0/dialog-title-props <path> +npx @mui/codemod@latest v5.0.0/dialog-title-props <path> ``` You can find more details about this breaking change in [the migration guide](https://mui.com/material-ui/migration/v5-component-changes/#dialog). @@ -2488,7 +2475,7 @@ Adds `prepend: true` to Emotion `createCache` ``` ```bash -npx @mui/codemod@next v5.0.0/create-theme <path> +npx @mui/codemod@latest v5.0.0/create-theme <path> ``` #### `expansion-panel-component` @@ -2496,7 +2483,7 @@ npx @mui/codemod@next v5.0.0/create-theme <path> Renames `ExpansionPanel*` to `Accordion*` ```bash -npx @mui/codemod@next v5.0.0/expansion-panel-component <path> +npx @mui/codemod@latest v5.0.0/expansion-panel-component <path> ``` You can find more details about this breaking change in [the migration guide](https://mui.com/material-ui/migration/v5-component-changes/#expansionpanel). @@ -2509,7 +2496,7 @@ You can find more details about this breaking change in [the migration guide](ht ``` ```bash -npx @mui/codemod@next v5.0.0/fab-variant <path> +npx @mui/codemod@latest v5.0.0/fab-variant <path> ``` You can find more details about this breaking change in [the migration guide](https://mui.com/material-ui/migration/v5-component-changes/#fab). @@ -2529,7 +2516,7 @@ Renames the `fade` style utility import and calls to `alpha`. <!-- #default-branch-switch --> ```bash -npx @mui/codemod@next v5.0.0/fade-rename-alpha <path> +npx @mui/codemod@latest v5.0.0/fade-rename-alpha <path> ``` You can find more details about this breaking change in [the migration guide](https://mui.com/material-ui/migration/v5-component-changes/#styles). @@ -2546,7 +2533,7 @@ Renames `Grid`'s `justify` prop to `justifyContent`. <!-- #default-branch-switch --> ```bash -npx @mui/codemod@next v5.0.0/grid-justify-justifycontent <path> +npx @mui/codemod@latest v5.0.0/grid-justify-justifycontent <path> ``` You can find more details about this breaking change in [the migration guide](https://mui.com/material-ui/migration/v5-component-changes/#grid). @@ -2556,7 +2543,7 @@ You can find more details about this breaking change in [the migration guide](ht Renames `GridList*` to `ImageList*` ```bash -npx @mui/codemod@next v5.0.0/grid-list-component <path> +npx @mui/codemod@latest v5.0.0/grid-list-component <path> ``` You can find more details about this breaking change in [the migration guide](https://mui.com/material-ui/migration/v5-component-changes/#gridlist). @@ -2573,7 +2560,7 @@ Adds `size="large"` if `size` is not defined to get the same appearance as v4. ``` ```bash -npx @mui/codemod@next v5.0.0/icon-button-size <path> +npx @mui/codemod@latest v5.0.0/icon-button-size <path> ``` You can find more details about this breaking change in [the migration guide](https://mui.com/material-ui/migration/v5-component-changes/#iconbutton). @@ -2638,7 +2625,7 @@ Replace JSS styling with `makeStyles` or `withStyles` to `styled` API. ``` ```bash -npx @mui/codemod@next v5.0.0/jss-to-styled <path> +npx @mui/codemod@latest v5.0.0/jss-to-styled <path> ``` You can find more details about this breaking change in [the migration guide](https://mui.com/material-ui/migration/v5-component-changes/#1-use-styled-or-sx-api). @@ -2710,7 +2697,7 @@ Migrate JSS styling with `makeStyles` or `withStyles` to the corresponding `tss- ``` ```bash -npx @mui/codemod@next v5.0.0/jss-to-tss-react <path> +npx @mui/codemod@latest v5.0.0/jss-to-tss-react <path> ``` The following scenarios are not currently handled by this codemod and will be marked with a @@ -2738,7 +2725,7 @@ Apply `underline="hover"` to `<Link />` that does not define `underline` prop (t ``` ```bash -npx @mui/codemod@next v5.0.0/link-underline-hover <path> +npx @mui/codemod@latest v5.0.0/link-underline-hover <path> ``` You can find more details about this breaking change in [the migration guide](https://mui.com/material-ui/migration/v5-component-changes/#link). @@ -2776,7 +2763,7 @@ Moves JSS imports to `@material-ui/styles` ``` ```bash -npx @mui/codemod@next v5.0.0/material-ui-styles <path> +npx @mui/codemod@latest v5.0.0/material-ui-styles <path> ``` #### `material-ui-types` @@ -2789,7 +2776,7 @@ Renames `Omit` import from `@material-ui/types` to `DistributiveOmit` ``` ```bash -npx @mui/codemod@next v5.0.0/material-ui-types <path> +npx @mui/codemod@latest v5.0.0/material-ui-types <path> ``` You can find more details about this breaking change in [the migration guide](https://mui.com/material-ui/migration/v5-component-changes/#material-ui-types). @@ -2806,7 +2793,7 @@ Removes `disableBackdropClick` and `onEscapeKeyDown` from `<Modal>` ``` ```bash -npx @mui/codemod@next v5.0.0/modal-props <path> +npx @mui/codemod@latest v5.0.0/modal-props <path> ``` You can find more details about this breaking change in [the migration guide](https://mui.com/material-ui/migration/v5-component-changes/#modal). @@ -2830,7 +2817,7 @@ or <!-- #default-branch-switch --> ```bash -npx @mui/codemod@next v5.0.0/moved-lab-modules <path> +npx @mui/codemod@latest v5.0.0/moved-lab-modules <path> ``` You can find more details about this breaking change in the migration guide. @@ -2855,7 +2842,7 @@ Renames `Pagination*`'s `shape` values from 'round' to 'circular'. ``` ```bash -npx @mui/codemod@next v5.0.0/pagination-round-circular <path> +npx @mui/codemod@latest v5.0.0/pagination-round-circular <path> ``` You can find more details about this breaking change in [the migration guide](https://mui.com/material-ui/migration/v5-component-changes/#pagination). @@ -2874,7 +2861,7 @@ Fix private import paths. <!-- #default-branch-switch --> ```bash -npx @mui/codemod@next v5.0.0/optimal-imports <path> +npx @mui/codemod@latest v5.0.0/optimal-imports <path> ``` #### `root-ref` @@ -2882,7 +2869,7 @@ npx @mui/codemod@next v5.0.0/optimal-imports <path> Removes `RootRef` from the codebase. ```bash -npx @mui/codemod@next v5.0.0/root-ref <path> +npx @mui/codemod@latest v5.0.0/root-ref <path> ``` You can find more details about this breaking change in [the migration guide](https://mui.com/material-ui/migration/v5-component-changes/#rootref). @@ -2897,7 +2884,7 @@ You can find more details about this breaking change in [the migration guide](ht ``` ```bash -npx @mui/codemod@next v5.0.0/skeleton-variant <path> +npx @mui/codemod@latest v5.0.0/skeleton-variant <path> ``` You can find more details about this breaking change in [the migration guide](https://mui.com/material-ui/migration/v5-component-changes/#skeleton). @@ -2907,7 +2894,7 @@ You can find more details about this breaking change in [the migration guide](ht Applies `StyledEngineProvider` to the files that contains `ThemeProvider`. ```bash -npx @mui/codemod@next v5.0.0/styled-engine-provider <path> +npx @mui/codemod@latest v5.0.0/styled-engine-provider <path> ``` You can find more details about this breaking change in [the migration guide](https://mui.com/material-ui/migration/v5-style-changes/#style-library). @@ -2933,7 +2920,7 @@ Renames props in `Table*` components. ``` ```bash -npx @mui/codemod@next v5.0.0/table-props <path> +npx @mui/codemod@latest v5.0.0/table-props <path> ``` You can find more details about this breaking change in [the migration guide](https://mui.com/material-ui/migration/v5-component-changes/#table). @@ -2952,7 +2939,7 @@ Renames the `Tabs`'s `scrollButtons` prop values. ``` ```bash -npx @mui/codemod@next v5.0.0/tabs-scroll-buttons <path> +npx @mui/codemod@latest v5.0.0/tabs-scroll-buttons <path> ``` You can find more details about this breaking change in [the migration guide](https://mui.com/material-ui/migration/v5-component-changes/#tabs). @@ -2971,7 +2958,7 @@ Renames `TextField`'s rows props. ``` ```bash -npx @mui/codemod@next v5.0.0/textarea-minmax-rows <path> +npx @mui/codemod@latest v5.0.0/textarea-minmax-rows <path> ``` You can find more details about this breaking change in the migration guide. @@ -2984,7 +2971,7 @@ You can find more details about this breaking change in the migration guide. Adds `DefaultTheme` module augmentation to TypeScript projects. ```bash -npx @mui/codemod@next v5.0.0/theme-augment <path> +npx @mui/codemod@latest v5.0.0/theme-augment <path> ``` You can find more details about this breaking change in [the migration guide](https://mui.com/material-ui/migration/v5-component-changes/#material-ui-styles). @@ -3003,7 +2990,7 @@ Updates breakpoint values to match new logic. ⚠️ This mod is not idempotent, <!-- #default-branch-switch --> ```bash -npx @mui/codemod@next v5.0.0/theme-breakpoints <path> +npx @mui/codemod@latest v5.0.0/theme-breakpoints <path> ``` You can find more details about this breaking change in [the migration guide](https://mui.com/material-ui/migration/v5-component-changes/#theme). @@ -3013,7 +3000,7 @@ You can find more details about this breaking change in [the migration guide](ht Renames `theme.breakpoints.width('md')` to `theme.breakpoints.values.md`. ```bash -npx @mui/codemod@next v5.0.0/theme-breakpoints-width <path> +npx @mui/codemod@latest v5.0.0/theme-breakpoints-width <path> ``` You can find more details about this breaking change in [the migration guide](https://mui.com/material-ui/migration/v5-component-changes/#theme). @@ -3026,7 +3013,7 @@ You can find more details about this breaking change in [the migration guide](ht ``` ```bash -npx @mui/codemod@next v5.0.0/theme-options <path> +npx @mui/codemod@latest v5.0.0/theme-options <path> ``` #### `theme-palette-mode` @@ -3048,7 +3035,7 @@ Renames `type` to `mode`. ``` ```bash -npx @mui/codemod@next v5.0.0/theme-palette-mode <path> +npx @mui/codemod@latest v5.0.0/theme-palette-mode <path> ``` You can find more details about this breaking change in [the migration guide](https://mui.com/material-ui/migration/v5-component-changes/#theme). @@ -3058,7 +3045,7 @@ You can find more details about this breaking change in [the migration guide](ht Renames `MuiThemeProvider` to `ThemeProvider`. ```bash -npx @mui/codemod@next v5.0.0/theme-provider <path> +npx @mui/codemod@latest v5.0.0/theme-provider <path> ``` You can find more details about this breaking change in [the migration guide](https://mui.com/material-ui/migration/v5-component-changes/#material-ui-core-styles). @@ -3077,7 +3064,7 @@ Removes the 'px' suffix from some template strings. <!-- #default-branch-switch --> ```bash -npx @mui/codemod@next v5.0.0/theme-spacing <path> +npx @mui/codemod@latest v5.0.0/theme-spacing <path> ``` You can find more details about this breaking change in [the migration guide](https://mui.com/material-ui/migration/v5-component-changes/#theme). @@ -3092,7 +3079,7 @@ Renames `theme.typography.round($number)` to `Math.round($number * 1e5) / 1e5`. ``` ```bash -npx @mui/codemod@next v5.0.0/theme-typography-round <path> +npx @mui/codemod@latest v5.0.0/theme-typography-round <path> ``` You can find more details about this breaking change in [the migration guide](https://mui.com/material-ui/migration/v5-component-changes/#theme). @@ -3110,7 +3097,7 @@ Converts all `@mui/material` submodule imports to the root module: <!-- #default-branch-switch --> ```bash -npx @mui/codemod@next v5.0.0/top-level-imports <path> +npx @mui/codemod@latest v5.0.0/top-level-imports <path> ``` Head to https://mui.com/guides/minimizing-bundle-size/ to understand when it's useful. @@ -3120,7 +3107,7 @@ Head to https://mui.com/guides/minimizing-bundle-size/ to understand when it's u Renames import `transitions` to `createTransitions` ```bash -npx @mui/codemod@next v5.0.0/transitions <path> +npx @mui/codemod@latest v5.0.0/transitions <path> ``` #### `use-autocomplete` @@ -3133,7 +3120,7 @@ Renames `useAutocomplete` related import from lab to core ``` ```bash -npx @mui/codemod@next v5.0.0/use-autocomplete <path> +npx @mui/codemod@latest v5.0.0/use-autocomplete <path> ``` #### `use-transitionprops` @@ -3162,7 +3149,7 @@ Updates Dialog, Menu, Popover, and Snackbar to use the `TransitionProps` prop to <!-- #default-branch-switch --> ```bash -npx @mui/codemod@next v5.0.0/use-transitionprops <path> +npx @mui/codemod@latest v5.0.0/use-transitionprops <path> ``` You can find more details about this breaking change in [the migration guide](/material-ui/migration/v5-component-changes/#dialog). @@ -3192,7 +3179,7 @@ The diff should look like this: <!-- #default-branch-switch --> ```bash -npx @mui/codemod@next v5.0.0/variant-prop <path> +npx @mui/codemod@latest v5.0.0/variant-prop <path> ``` #### `with-mobile-dialog` @@ -3206,7 +3193,7 @@ Removes imported `withMobileDialog`, and inserts hardcoded version to prevent ap ``` ```bash -npx @mui/codemod@next v5.0.0/with-mobile-dialog <path> +npx @mui/codemod@latest v5.0.0/with-mobile-dialog <path> ``` You can find more details about this breaking change in [the migration guide](https://mui.com/material-ui/migration/v5-component-changes/#dialog). @@ -3222,7 +3209,7 @@ Removes `withWidth` import, and inserts hardcoded version to prevent application ``` ```bash -npx @mui/codemod@next v5.0.0/with-width <path> +npx @mui/codemod@latest v5.0.0/with-width <path> ``` You can find more details about this breaking change in [the migration guide](https://mui.com/material-ui/migration/v5-style-changes/#material-ui-core-styles). @@ -3283,7 +3270,7 @@ Replace every occurrence of `material-ui` related package with the new package n ``` ```bash -npx @mui/codemod@next v5.0.0/mui-replace <path> +npx @mui/codemod@latest v5.0.0/mui-replace <path> ``` You can find more details about this breaking change in [the migration guide](https://mui.com/material-ui/migration/migration-v4/#update-material-ui-version). @@ -3303,7 +3290,7 @@ The diff should look like this: <!-- #default-branch-switch --> ```bash -npx @mui/codemod@next v4.0.0/theme-spacing-api <path> +npx @mui/codemod@latest v4.0.0/theme-spacing-api <path> ``` This codemod tries to perform a basic expression simplification which can be improved for expressions that use more than one operation. @@ -3330,7 +3317,7 @@ Converts all `@material-ui/core` imports more than 1 level deep to the optimal f <!-- #default-branch-switch --> ```bash -npx @mui/codemod@next v4.0.0/optimal-imports <path> +npx @mui/codemod@latest v4.0.0/optimal-imports <path> ``` Head to https://mui.com/guides/minimizing-bundle-size/ to understand when it's useful. @@ -3348,7 +3335,7 @@ Converts all `@material-ui/core` submodule imports to the root module: <!-- #default-branch-switch --> ```bash -npx @mui/codemod@next v4.0.0/top-level-imports <path> +npx @mui/codemod@latest v4.0.0/top-level-imports <path> ``` Head to https://mui.com/guides/minimizing-bundle-size/ to understand when it's useful. @@ -3369,7 +3356,7 @@ The diff should look like this: <!-- #default-branch-switch --> ```bash -npx @mui/codemod@next v1.0.0/import-path <path> +npx @mui/codemod@latest v1.0.0/import-path <path> ``` **Notice**: if you are migrating from pre-v1.0, and your imports use `material-ui`, you will need to manually find and replace all references to `material-ui` in your code to `@material-ui/core`. E.g.: @@ -3396,7 +3383,7 @@ The diff should look like this: <!-- #default-branch-switch --> ```bash -npx @mui/codemod@next v1.0.0/color-imports <path> +npx @mui/codemod@latest v1.0.0/color-imports <path> ``` **additional options** @@ -3404,7 +3391,7 @@ npx @mui/codemod@next v1.0.0/color-imports <path> <!-- #default-branch-switch --> ```bash -npx @mui/codemod@next v1.0.0/color-imports <path> -- --importPath='mui/styles/colors' --targetPath='mui/colors' +npx @mui/codemod@latest v1.0.0/color-imports <path> -- --importPath='mui/styles/colors' --targetPath='mui/colors' ``` #### `svg-icon-imports` @@ -3422,7 +3409,7 @@ The diff should look like this: <!-- #default-branch-switch --> ```bash -npx @mui/codemod@next v1.0.0/svg-icon-imports <path> +npx @mui/codemod@latest v1.0.0/svg-icon-imports <path> ``` #### `menu-item-primary-text` @@ -3440,7 +3427,7 @@ The diff should look like this: <!-- #default-branch-switch --> ```bash -npx @mui/codemod@next v1.0.0/menu-item-primary-text <path> +npx @mui/codemod@latest v1.0.0/menu-item-primary-text <path> ``` ### v0.15.0 @@ -3464,5 +3451,5 @@ The diff should look like this: <!-- #default-branch-switch --> ```bash -npx @mui/codemod@next v0.15.0/import-path <path> +npx @mui/codemod@latest v0.15.0/import-path <path> ``` diff --git a/packages/mui-codemod/package.json b/packages/mui-codemod/package.json index 8b28256b6a0cd7..5cbd9dc1cbbc70 100644 --- a/packages/mui-codemod/package.json +++ b/packages/mui-codemod/package.json @@ -1,6 +1,6 @@ { "name": "@mui/codemod", - "version": "6.0.0-beta.6", + "version": "6.0.2", "bin": "./codemod.js", "private": false, "author": "MUI Team", @@ -35,12 +35,12 @@ "@babel/traverse": "^7.25.3", "jscodeshift": "^0.16.1", "jscodeshift-add-imports": "^1.0.11", - "postcss": "^8.4.41", + "postcss": "^8.4.45", "postcss-cli": "^11.0.0", "yargs": "^17.7.2" }, "devDependencies": { - "@types/chai": "^4.3.17", + "@types/chai": "^4.3.19", "@types/jscodeshift": "0.11.11", "chai": "^4.5.0" }, diff --git a/packages/mui-codemod/src/deprecations/all/deprecations-all.js b/packages/mui-codemod/src/deprecations/all/deprecations-all.js index eef74aec86bcd4..c1dd70ef2392c4 100644 --- a/packages/mui-codemod/src/deprecations/all/deprecations-all.js +++ b/packages/mui-codemod/src/deprecations/all/deprecations-all.js @@ -10,7 +10,6 @@ import transformCircularProgressClasses from '../circular-progress-classes'; import transformDividerProps from '../divider-props'; import transformFilledInputProps from '../filled-input-props'; import transformFormControlLabelProps from '../form-control-label-props'; -import transformGridProps from '../grid-props'; import transformImageListItemBarClasses from '../image-list-item-bar-classes'; import transformInputBaseProps from '../input-base-props'; import transformInputProps from '../input-props'; @@ -41,7 +40,6 @@ export default function deprecationsAll(file, api, options) { file.source = transformDividerProps(file, api, options); file.source = transformFilledInputProps(file, api, options); file.source = transformFormControlLabelProps(file, api, options); - file.source = transformGridProps(file, api, options); file.source = transformImageListItemBarClasses(file, api, options); file.source = transformInputBaseProps(file, api, options); file.source = transformInputProps(file, api, options); diff --git a/packages/mui-codemod/src/deprecations/grid-props/grid-props.js b/packages/mui-codemod/src/deprecations/grid-props/grid-props.js deleted file mode 100644 index 328b30e9b657da..00000000000000 --- a/packages/mui-codemod/src/deprecations/grid-props/grid-props.js +++ /dev/null @@ -1,42 +0,0 @@ -import findComponentJSX from '../../util/findComponentJSX'; - -/** - * @param {import('jscodeshift').FileInfo} file - * @param {import('jscodeshift').API} api - */ -export default function transformer(file, api, options) { - const j = api.jscodeshift; - const root = j(file.source); - const printOptions = options.printOptions; - - const filterJSXAttr = (attr, name) => attr.type === 'JSXAttribute' && attr.name.name === name; - - findComponentJSX(j, { root, componentName: 'Grid' }, (gridElement) => { - const attrs = gridElement.node.openingElement.attributes; - const wrapPropIndex = attrs.findIndex((attr) => filterJSXAttr(attr, 'wrap')); - - if (wrapPropIndex !== -1) { - if (attrs.findIndex((attr) => filterJSXAttr(attr, 'flexWrap')) !== -1) { - attrs.splice(wrapPropIndex, 1); - } else { - attrs[wrapPropIndex].name.name = 'flexWrap'; - } - } - }); - - root.find(j.ObjectProperty, { key: { name: 'MuiGrid' } }).forEach((path) => { - const defaultProps = path.value.value.properties.find(({ key }) => key.name === 'defaultProps'); - const props = defaultProps.value.properties; - const wrapPropIndex = props.findIndex((prop) => prop.key.name === 'wrap'); - - if (wrapPropIndex !== -1) { - if (props.findIndex((prop) => prop.key.name === 'flexWrap') !== -1) { - props.splice(wrapPropIndex, 1); - } else { - props[wrapPropIndex].key.name = 'flexWrap'; - } - } - }); - - return root.toSource(printOptions); -} diff --git a/packages/mui-codemod/src/deprecations/grid-props/grid-props.test.js b/packages/mui-codemod/src/deprecations/grid-props/grid-props.test.js deleted file mode 100644 index 9e44307050e920..00000000000000 --- a/packages/mui-codemod/src/deprecations/grid-props/grid-props.test.js +++ /dev/null @@ -1,16 +0,0 @@ -import { describeJscodeshiftTransform } from '../../../testUtils'; -import transform from './grid-props'; - -describe('@mui/codemod', () => { - describe('deprecations', () => { - describeJscodeshiftTransform({ - transform, - transformName: 'grid-props', - dirname: __dirname, - testCases: [ - { actual: '/test-cases/actual.js', expected: '/test-cases/expected.js' }, - { actual: '/test-cases/theme.actual.js', expected: '/test-cases/theme.expected.js' }, - ], - }); - }); -}); diff --git a/packages/mui-codemod/src/deprecations/grid-props/index.js b/packages/mui-codemod/src/deprecations/grid-props/index.js deleted file mode 100644 index 35a6d621882e1f..00000000000000 --- a/packages/mui-codemod/src/deprecations/grid-props/index.js +++ /dev/null @@ -1 +0,0 @@ -export { default } from './grid-props'; diff --git a/packages/mui-codemod/src/deprecations/grid-props/test-cases/actual.js b/packages/mui-codemod/src/deprecations/grid-props/test-cases/actual.js deleted file mode 100644 index bcddfdd74106fd..00000000000000 --- a/packages/mui-codemod/src/deprecations/grid-props/test-cases/actual.js +++ /dev/null @@ -1,11 +0,0 @@ -import Grid from '@mui/material/Grid'; -import { Grid as MyGrid } from '@mui/material'; - -<Grid wrap="wrap-reverse" />; -<MyGrid wrap="wrap-reverse" />; - -<Grid wrap="wrap-reverse" flexWrap="wrap" />; -<MyGrid wrap="wrap-reverse" flexWrap="wrap" />; - -// should skip non MUI components -<NonMuiGrid wrap="wrap-reverse" />; diff --git a/packages/mui-codemod/src/deprecations/grid-props/test-cases/expected.js b/packages/mui-codemod/src/deprecations/grid-props/test-cases/expected.js deleted file mode 100644 index 666e3fccfca565..00000000000000 --- a/packages/mui-codemod/src/deprecations/grid-props/test-cases/expected.js +++ /dev/null @@ -1,11 +0,0 @@ -import Grid from '@mui/material/Grid'; -import { Grid as MyGrid } from '@mui/material'; - -<Grid flexWrap="wrap-reverse" />; -<MyGrid flexWrap="wrap-reverse" />; - -<Grid flexWrap="wrap" />; -<MyGrid flexWrap="wrap" />; - -// should skip non MUI components -<NonMuiGrid wrap="wrap-reverse" />; diff --git a/packages/mui-codemod/src/deprecations/grid-props/test-cases/theme.actual.js b/packages/mui-codemod/src/deprecations/grid-props/test-cases/theme.actual.js deleted file mode 100644 index 86d9e8f604e87e..00000000000000 --- a/packages/mui-codemod/src/deprecations/grid-props/test-cases/theme.actual.js +++ /dev/null @@ -1,24 +0,0 @@ -fn({ - MuiGrid: { - defaultProps: { - wrap: 'wrap' - }, - }, -}); - -fn({ - MuiGrid: { - defaultProps: { - wrap: 'wrap-reverse' - }, - }, -}); - -fn({ - MuiGrid: { - defaultProps: { - wrap: 'wrap-reverse', - flexWrap: 'wrap' - }, - }, -}); diff --git a/packages/mui-codemod/src/deprecations/grid-props/test-cases/theme.expected.js b/packages/mui-codemod/src/deprecations/grid-props/test-cases/theme.expected.js deleted file mode 100644 index e64036c5678295..00000000000000 --- a/packages/mui-codemod/src/deprecations/grid-props/test-cases/theme.expected.js +++ /dev/null @@ -1,23 +0,0 @@ -fn({ - MuiGrid: { - defaultProps: { - flexWrap: 'wrap' - }, - }, -}); - -fn({ - MuiGrid: { - defaultProps: { - flexWrap: 'wrap-reverse' - }, - }, -}); - -fn({ - MuiGrid: { - defaultProps: { - flexWrap: 'wrap' - }, - }, -}); diff --git a/packages/mui-codemod/src/v5.0.0/joy-text-field-to-input.test/actual.js b/packages/mui-codemod/src/v5.0.0/joy-text-field-to-input.test/actual.js index de9f675f85629a..c7afb0d3aec5ed 100644 --- a/packages/mui-codemod/src/v5.0.0/joy-text-field-to-input.test/actual.js +++ b/packages/mui-codemod/src/v5.0.0/joy-text-field-to-input.test/actual.js @@ -1,7 +1,7 @@ import { TextField as JoyTextField } from "@mui/joy"; import JoyTextField2 from "@mui/joy/TextField"; // the codemod should transform only Joy TextField -import TextField from "@mui/material/TextField" +import TextField from "@mui/material/TextField"; <div> <JoyTextField diff --git a/packages/mui-codemod/src/v5.0.0/joy-text-field-to-input.test/expected.js b/packages/mui-codemod/src/v5.0.0/joy-text-field-to-input.test/expected.js index dcbb41e1cab31e..8be9042bdc541b 100644 --- a/packages/mui-codemod/src/v5.0.0/joy-text-field-to-input.test/expected.js +++ b/packages/mui-codemod/src/v5.0.0/joy-text-field-to-input.test/expected.js @@ -1,7 +1,7 @@ import { Input as JoyInput } from "@mui/joy"; import JoyInput2 from "@mui/joy/Input"; // the codemod should transform only Joy TextField -import TextField from "@mui/material/TextField" +import TextField from "@mui/material/TextField"; <div> <FormControl diff --git a/packages/mui-codemod/src/v6.0.0/list-item-button-prop/list-item-button-prop.js b/packages/mui-codemod/src/v6.0.0/list-item-button-prop/list-item-button-prop.js index 0fb4f0cc53fa73..22dd7082c0e611 100644 --- a/packages/mui-codemod/src/v6.0.0/list-item-button-prop/list-item-button-prop.js +++ b/packages/mui-codemod/src/v6.0.0/list-item-button-prop/list-item-button-prop.js @@ -54,6 +54,7 @@ export default function transformer(file, api, options) { const openTaggedNotHavingButtonProp = new Set(); const openTaggedHavingButtonProp = new Set(); + let addedListItemButton = false; // Rename components that have ListItem button to ListItemButton findComponentJSX(j, { root, componentName: 'ListItem' }, (elementPath) => { const index = elementPath.node.openingElement.attributes.findIndex( @@ -62,6 +63,7 @@ export default function transformer(file, api, options) { // The ListItem has a button prop if (index !== -1) { openTaggedHavingButtonProp.add(elementPath.node.openingElement.name.name); + addedListItemButton = true; elementPath.node.openingElement.name.name = `ListItemButton`; elementPath.node.openingElement.attributes.splice(index, 1); } else { @@ -110,12 +112,13 @@ export default function transformer(file, api, options) { return false; }) .remove(); - // If ListItemButton does not already exist, add it at the end + + // If ListItemButton import does not already exist, add it at the end const imports = root .find(j.ImportDeclaration) .filter((path) => path.node.source.value === '@mui/material/ListItemButton'); - if (imports.length === 0) { + if (addedListItemButton && imports.length === 0) { const lastImport = root.find(j.ImportDeclaration).at(-1); // Insert the import for 'ListItemButton' after the last import declaration diff --git a/packages/mui-codemod/src/v6.0.0/list-item-button-prop/list-item-button-prop.test.js b/packages/mui-codemod/src/v6.0.0/list-item-button-prop/list-item-button-prop.test.js index 723ae584e04f5d..4e6ccd771a9b8f 100644 --- a/packages/mui-codemod/src/v6.0.0/list-item-button-prop/list-item-button-prop.test.js +++ b/packages/mui-codemod/src/v6.0.0/list-item-button-prop/list-item-button-prop.test.js @@ -61,5 +61,16 @@ describe('@mui/codemod', () => { expect(actual).to.not.equal(expected); }); }); + + it('should skip files that do not import ListItem from @mui/material', () => { + const actual = transform( + { source: read('./test-cases/not-related.actual.js') }, + { jscodeshift }, + {}, + ); + + const expected = read('./test-cases/not-related.expected.js'); + expect(actual).to.equal(expected, 'The transformed version should be correct'); + }); }); }); diff --git a/packages/mui-codemod/src/v6.0.0/list-item-button-prop/test-cases/not-related.actual.js b/packages/mui-codemod/src/v6.0.0/list-item-button-prop/test-cases/not-related.actual.js new file mode 100644 index 00000000000000..1d1e968dea9700 --- /dev/null +++ b/packages/mui-codemod/src/v6.0.0/list-item-button-prop/test-cases/not-related.actual.js @@ -0,0 +1,3 @@ +import ListItem from '@component/ListItem'; + +// The codemod should skip this file because it does not import ListItem from `@mui/material`. diff --git a/packages/mui-codemod/src/v6.0.0/list-item-button-prop/test-cases/not-related.expected.js b/packages/mui-codemod/src/v6.0.0/list-item-button-prop/test-cases/not-related.expected.js new file mode 100644 index 00000000000000..1d1e968dea9700 --- /dev/null +++ b/packages/mui-codemod/src/v6.0.0/list-item-button-prop/test-cases/not-related.expected.js @@ -0,0 +1,3 @@ +import ListItem from '@component/ListItem'; + +// The codemod should skip this file because it does not import ListItem from `@mui/material`. diff --git a/packages/mui-core-downloads-tracker/package.json b/packages/mui-core-downloads-tracker/package.json index 350022493c40d1..6b5c86862d1296 100644 --- a/packages/mui-core-downloads-tracker/package.json +++ b/packages/mui-core-downloads-tracker/package.json @@ -1,6 +1,6 @@ { "name": "@mui/core-downloads-tracker", - "version": "6.0.0-beta.6", + "version": "6.0.2", "private": false, "author": "MUI Team", "description": "Internal package to track number of downloads of our design system libraries", diff --git a/packages/mui-docs/README.md b/packages/mui-docs/README.md index 562368dcd515b3..157a61b81662d6 100644 --- a/packages/mui-docs/README.md +++ b/packages/mui-docs/README.md @@ -9,7 +9,7 @@ Install the package in your project directory with: <!-- #default-branch-switch --> ```bash -npm install @mui/docs@next +npm install @mui/docs ``` The docs has a peer dependency on the core components. @@ -18,7 +18,7 @@ If you are not already using Material UI in your project, you can add it with: <!-- #default-branch-switch --> ```bash -npm install @mui/material@next +npm install @mui/material ``` ## Documentation diff --git a/packages/mui-docs/package.json b/packages/mui-docs/package.json index 8d512b6a8bf1f9..3ea157b3a2ed9d 100644 --- a/packages/mui-docs/package.json +++ b/packages/mui-docs/package.json @@ -1,6 +1,6 @@ { "name": "@mui/docs", - "version": "6.0.0-beta.6", + "version": "6.0.2", "private": false, "author": "MUI Team", "description": "MUI Docs - Documentation building blocks.", @@ -45,17 +45,17 @@ "@mui/icons-material": "workspace:*", "@mui/material": "workspace:*", "@types/gtag.js": "^0.0.20", - "@types/node": "^18.19.44", + "@types/node": "^20.16.5", "@types/prop-types": "^15.7.12", - "@types/react": "^18.3.3", - "next": "^14.2.5", + "@types/react": "^18.3.4", + "next": "^14.2.8", "react": "^18.3.1" }, "peerDependencies": { "@mui/base": "*", - "@mui/icons-material": "^5.0.0", - "@mui/material": "^5.0.0", - "@mui/system": "^5.0.0", + "@mui/icons-material": "^5.0.0 || ^6.0.0", + "@mui/material": "^5.0.0 || ^6.0.0", + "@mui/system": "^5.0.0 || ^6.0.0", "@types/react": "^17.0.0 || ^18.0.0 || ^19.0.0", "chai": "^4.4.1", "csstype": "^3.1.3", diff --git a/packages/mui-docs/src/ComponentLinkHeader/ComponentLinkHeader.tsx b/packages/mui-docs/src/ComponentLinkHeader/ComponentLinkHeader.tsx index 18ef4ad1ea7777..f432a3214c3588 100644 --- a/packages/mui-docs/src/ComponentLinkHeader/ComponentLinkHeader.tsx +++ b/packages/mui-docs/src/ComponentLinkHeader/ComponentLinkHeader.tsx @@ -107,14 +107,13 @@ export function ComponentLinkHeader(props: ComponentLinkHeaderProps) { size="small" variant="outlined" rel="nofollow" - href={`${process.env.SOURCE_CODE_REPO}/tree/${process.env.SOURCE_GITHUB_BRANCH}/${headers.githubSource}`} + href={`${process.env.SOURCE_CODE_REPO}/tree/v${process.env.LIB_VERSION}/${headers.githubSource}`} icon={<GitHubIcon />} data-ga-event-category="ComponentLinkHeader" data-ga-event-action="click" data-ga-event-label="Source" data-ga-event-split="0.1" label="Source" - target="_blank" /> </li> ) : null} diff --git a/packages/mui-docs/src/branding/brandingTheme.ts b/packages/mui-docs/src/branding/brandingTheme.ts index 3cedb53020f790..885bb07692e7d9 100644 --- a/packages/mui-docs/src/branding/brandingTheme.ts +++ b/packages/mui-docs/src/branding/brandingTheme.ts @@ -588,6 +588,9 @@ export function getThemedComponents(): ThemeOptions { '&:active': { backgroundColor: (theme.vars || theme).palette.primaryDark[800], }, + '&.Mui-disabled': { + color: theme.palette.grey[500], + }, }), }), ...(ownerState.variant === 'outlined' && @@ -615,6 +618,11 @@ export function getThemedComponents(): ThemeOptions { '&:active': { backgroundColor: alpha(theme.palette.primary[900], 0.3), }, + '&.Mui-disabled': { + background: 'none', + backgroundColor: alpha(theme.palette.primaryDark[700], 0.2), + color: theme.palette.grey[500], + }, }), }), ...(ownerState.variant === 'contained' && @@ -635,6 +643,18 @@ export function getThemedComponents(): ThemeOptions { borderColor: (theme.vars || theme).palette.primary[600], boxShadow: `${alpha(theme.palette.primary[900], 0.7)} 0 1px 0 1px inset`, }, + '&.Mui-disabled': { + color: theme.palette.grey[700], + textShadow: 'none', + borderColor: theme.palette.grey[400], + }, + ...theme.applyDarkStyles({ + '&.Mui-disabled': { + color: theme.palette.grey[400], + textShadow: 'none', + borderColor: theme.palette.grey[800], + }, + }), }), ...(ownerState.variant === 'contained' && ownerState.color === 'secondary' && { @@ -654,6 +674,18 @@ export function getThemedComponents(): ThemeOptions { borderColor: (theme.vars || theme).palette.primaryDark[600], boxShadow: `${alpha(theme.palette.primaryDark[900], 0.7)} 0 1px 0 1px inset`, }, + '&.Mui-disabled': { + color: theme.palette.grey[700], + textShadow: 'none', + borderColor: theme.palette.grey[400], + }, + ...theme.applyDarkStyles({ + '&.Mui-disabled': { + color: theme.palette.grey[400], + textShadow: 'none', + borderColor: theme.palette.grey[800], + }, + }), }), ...(ownerState.variant === 'text' && ownerState.color === 'secondary' && { @@ -671,6 +703,9 @@ export function getThemedComponents(): ThemeOptions { '&:active': { backgroundColor: (theme.vars || theme).palette.primaryDark[700], }, + '&.Mui-disabled': { + color: theme.palette.grey[500], + }, }), }), ...(ownerState.variant === 'text' && @@ -690,6 +725,9 @@ export function getThemedComponents(): ThemeOptions { '&:active': { backgroundColor: alpha(theme.palette.primary[900], 0.1), }, + '&.Mui-disabled': { + color: theme.palette.grey[500], + }, }), }), }), diff --git a/packages/mui-docs/src/translations/translations.json b/packages/mui-docs/src/translations/translations.json index 5c4dfc2a14b24a..b12d0d96fdaf77 100644 --- a/packages/mui-docs/src/translations/translations.json +++ b/packages/mui-docs/src/translations/translations.json @@ -45,6 +45,7 @@ "refNotHeld": "The component cannot hold a ref.", "refRootElement": "The <code>ref</code> is forwarded to the root element.", "ruleName": "Rule name", + "seeSourceCode": "If you did not find the information in this page, consider having a look at the <a href=\"{{href}}\">implementation of the component</a> for more detail.", "signature": "Signature", "slots": "Slots", "spreadHint": "Props of the {{spreadHintElement}} component are also available.", @@ -52,6 +53,7 @@ "styleOverrides": "The name <code>{{componentStyles.name}}</code> can be used when providing <a href={{defaultPropsLink}}>default props</a> or <a href={{styleOverridesLink}}>style overrides</a> in the theme.", "slotDescription": "To learn how to customize the slot, check out the <a href={{slotGuideLink}}>Overriding component structure</a> guide.", "slotName": "Slot name", + "source-code": "Source code", "type": "Type", "required": "Required", "optional": "Optional", diff --git a/packages/mui-envinfo/package.json b/packages/mui-envinfo/package.json index 9a340301366d33..eed6f3ecd54dde 100644 --- a/packages/mui-envinfo/package.json +++ b/packages/mui-envinfo/package.json @@ -1,6 +1,6 @@ { "name": "@mui/envinfo", - "version": "2.0.23", + "version": "2.0.25", "private": false, "author": "MUI Team", "description": "Logs infos about the environment relevant to @mui/*", @@ -23,7 +23,7 @@ "envinfo": "^7.13.0" }, "devDependencies": { - "@types/chai": "^4.3.17", + "@types/chai": "^4.3.19", "chai": "^4.5.0", "fs-extra": "^11.2.0" }, diff --git a/packages/mui-envinfo/test/package.json b/packages/mui-envinfo/test/package.json index e6dd5065588c85..4f73b0fff77450 100644 --- a/packages/mui-envinfo/test/package.json +++ b/packages/mui-envinfo/test/package.json @@ -3,7 +3,7 @@ "version": "1.0.0", "private": true, "dependencies": { - "@emotion/react": "^11.13.0", + "@emotion/react": "^11.13.3", "@emotion/styled": "^11.13.0", "@mui/base": "5.0.0-beta.30", "@mui/joy": "5.0.0-beta.22", @@ -12,6 +12,6 @@ "react-dom": "^18.3.1" }, "devDependencies": { - "@types/react": "^18.3.3" + "@types/react": "^18.3.4" } } diff --git a/packages/mui-icons-material/README.md b/packages/mui-icons-material/README.md index 88979a9e52b10a..9157f6babac894 100644 --- a/packages/mui-icons-material/README.md +++ b/packages/mui-icons-material/README.md @@ -11,7 +11,7 @@ The Material Icons package depends on Material UI—install both with the follo <!-- #default-branch-switch --> ```bash -npm install @mui/icons-material@next @mui/material@next @emotion/styled @emotion/react +npm install @mui/icons-material @mui/material @emotion/styled @emotion/react ``` <!-- #default-branch-switch --> diff --git a/packages/mui-icons-material/package.json b/packages/mui-icons-material/package.json index 8a83ffcbb564ce..c41265b5d3145c 100644 --- a/packages/mui-icons-material/package.json +++ b/packages/mui-icons-material/package.json @@ -1,6 +1,6 @@ { "name": "@mui/icons-material", - "version": "6.0.0-beta.6", + "version": "6.0.2", "private": false, "author": "MUI Team", "description": "Material Design icons distributed as SVG React components.", @@ -51,8 +51,8 @@ "@mui/icons-material": "workspace:*", "@mui/internal-waterfall": "workspace:^", "@mui/material": "workspace:^", - "@types/chai": "^4.3.17", - "@types/react": "^18.3.3", + "@types/chai": "^4.3.19", + "@types/react": "^18.3.4", "chai": "^4.5.0", "chalk": "^5.3.0", "cross-fetch": "^4.0.0", @@ -67,7 +67,7 @@ "yargs": "^17.7.2" }, "peerDependencies": { - "@mui/material": "workspace:*", + "@mui/material": "workspace:^", "@types/react": "^17.0.0 || ^18.0.0 || ^19.0.0", "react": "^17.0.0 || ^18.0.0 || ^19.0.0" }, diff --git a/packages/mui-joy/README.md b/packages/mui-joy/README.md index 30fdd7c1f9011a..4921f8a288f6af 100644 --- a/packages/mui-joy/README.md +++ b/packages/mui-joy/README.md @@ -11,10 +11,8 @@ Joy UI is an open-source React component library that implements MUI's own desi Install the package in your project directory with: -<!-- #default-branch-switch --> - ```bash -npm install @mui/joy@next @emotion/react @emotion/styled +npm install @mui/joy @emotion/react @emotion/styled ``` ## Documentation diff --git a/packages/mui-joy/package.json b/packages/mui-joy/package.json index 140cc8c70a9658..bd0c267783e008 100644 --- a/packages/mui-joy/package.json +++ b/packages/mui-joy/package.json @@ -41,27 +41,27 @@ "@babel/runtime": "^7.25.0", "@mui/base": "workspace:*", "@mui/core-downloads-tracker": "workspace:^", - "@mui/system": "workspace:*", + "@mui/system": "workspace:^", "@mui/types": "workspace:^", - "@mui/utils": "workspace:*", + "@mui/utils": "workspace:^", "clsx": "^2.1.1", "prop-types": "^15.8.1" }, "devDependencies": { "@mui/internal-test-utils": "workspace:^", "@mui/material": "workspace:^", - "@types/chai": "^4.3.17", + "@types/chai": "^4.3.19", "@types/prop-types": "^15.7.12", - "@types/react": "^18.3.3", + "@types/react": "^18.3.4", "@types/react-dom": "^18.3.0", "@types/sinon": "^17.0.3", "chai": "^4.5.0", "fast-glob": "^3.3.2", "lodash": "^4.17.21", - "next": "^14.2.5", + "next": "^14.2.8", "react": "^18.3.1", "react-dom": "^18.3.1", - "sinon": "^16.1.3" + "sinon": "^18.0.0" }, "peerDependencies": { "@emotion/react": "^11.5.0", diff --git a/packages/mui-joy/src/Accordion/index.ts b/packages/mui-joy/src/Accordion/index.ts index fb5feaaca86f71..e6d1714f37cca4 100644 --- a/packages/mui-joy/src/Accordion/index.ts +++ b/packages/mui-joy/src/Accordion/index.ts @@ -1,4 +1,3 @@ -'use client'; export { default } from './Accordion'; export * from './accordionClasses'; export { default as accordionClasses } from './accordionClasses'; diff --git a/packages/mui-joy/src/AccordionDetails/index.ts b/packages/mui-joy/src/AccordionDetails/index.ts index c635362a74c849..aa664bbcf7c7df 100644 --- a/packages/mui-joy/src/AccordionDetails/index.ts +++ b/packages/mui-joy/src/AccordionDetails/index.ts @@ -1,4 +1,3 @@ -'use client'; export { default } from './AccordionDetails'; export * from './accordionDetailsClasses'; export { default as accordionDetailsClasses } from './accordionDetailsClasses'; diff --git a/packages/mui-joy/src/AccordionGroup/index.ts b/packages/mui-joy/src/AccordionGroup/index.ts index 98ec075a0e49c2..4187811b0bd3a1 100644 --- a/packages/mui-joy/src/AccordionGroup/index.ts +++ b/packages/mui-joy/src/AccordionGroup/index.ts @@ -1,4 +1,3 @@ -'use client'; export { default } from './AccordionGroup'; export * from './accordionGroupClasses'; export { default as accordionGroupClasses } from './accordionGroupClasses'; diff --git a/packages/mui-joy/src/AccordionSummary/index.ts b/packages/mui-joy/src/AccordionSummary/index.ts index d5a311bc744c5f..0e734f820e4e7d 100644 --- a/packages/mui-joy/src/AccordionSummary/index.ts +++ b/packages/mui-joy/src/AccordionSummary/index.ts @@ -1,4 +1,3 @@ -'use client'; export { default } from './AccordionSummary'; export * from './accordionSummaryClasses'; export { default as accordionSummaryClasses } from './accordionSummaryClasses'; diff --git a/packages/mui-joy/src/Alert/index.ts b/packages/mui-joy/src/Alert/index.ts index 882206c74b9405..e9dd48d0d9d252 100644 --- a/packages/mui-joy/src/Alert/index.ts +++ b/packages/mui-joy/src/Alert/index.ts @@ -1,4 +1,3 @@ -'use client'; export { default } from './Alert'; export * from './alertClasses'; export { default as alertClasses } from './alertClasses'; diff --git a/packages/mui-joy/src/AspectRatio/index.ts b/packages/mui-joy/src/AspectRatio/index.ts index b944d18a233acb..6b183a3decfb1d 100644 --- a/packages/mui-joy/src/AspectRatio/index.ts +++ b/packages/mui-joy/src/AspectRatio/index.ts @@ -1,4 +1,3 @@ -'use client'; export { default } from './AspectRatio'; export * from './aspectRatioClasses'; export { default as aspectRatioClasses } from './aspectRatioClasses'; diff --git a/packages/mui-joy/src/Autocomplete/Autocomplete.tsx b/packages/mui-joy/src/Autocomplete/Autocomplete.tsx index 3134be0881ccf3..be41341e35b82c 100644 --- a/packages/mui-joy/src/Autocomplete/Autocomplete.tsx +++ b/packages/mui-joy/src/Autocomplete/Autocomplete.tsx @@ -822,14 +822,14 @@ Autocomplete.propTypes /* remove-proptypes */ = { /** * Override the default text for the *clear* icon button. * - * For localization purposes, you can use the provided [translations](/material-ui/guides/localization/). + * For localization purposes, you can use the provided [translations](https://mui.com/material-ui/guides/localization/). * @default 'Clear' */ clearText: PropTypes.string, /** * Override the default text for the *close popup* icon button. * - * For localization purposes, you can use the provided [translations](/material-ui/guides/localization/). + * For localization purposes, you can use the provided [translations](https://mui.com/material-ui/guides/localization/). * @default 'Close' */ closeText: PropTypes.string, @@ -999,7 +999,7 @@ Autocomplete.propTypes /* remove-proptypes */ = { /** * Text to display when in a loading state. * - * For localization purposes, you can use the provided [translations](/material-ui/guides/localization/). + * For localization purposes, you can use the provided [translations](https://mui.com/material-ui/guides/localization/). * @default 'Loading…' */ loadingText: PropTypes.node, @@ -1015,7 +1015,7 @@ Autocomplete.propTypes /* remove-proptypes */ = { /** * Text to display when there are no options. * - * For localization purposes, you can use the provided [translations](/material-ui/guides/localization/). + * For localization purposes, you can use the provided [translations](https://mui.com/material-ui/guides/localization/). * @default 'No options' */ noOptionsText: PropTypes.node, @@ -1075,7 +1075,7 @@ Autocomplete.propTypes /* remove-proptypes */ = { /** * Override the default text for the *open popup* icon button. * - * For localization purposes, you can use the provided [translations](/material-ui/guides/localization/). + * For localization purposes, you can use the provided [translations](https://mui.com/material-ui/guides/localization/). * @default 'Open' */ openText: PropTypes.string, diff --git a/packages/mui-joy/src/Autocomplete/AutocompleteProps.ts b/packages/mui-joy/src/Autocomplete/AutocompleteProps.ts index 94da1fc39386c3..5d61b91ae5dde4 100644 --- a/packages/mui-joy/src/Autocomplete/AutocompleteProps.ts +++ b/packages/mui-joy/src/Autocomplete/AutocompleteProps.ts @@ -191,14 +191,14 @@ type AutocompleteOwnProps< /** * Override the default text for the *clear* icon button. * - * For localization purposes, you can use the provided [translations](/material-ui/guides/localization/). + * For localization purposes, you can use the provided [translations](https://mui.com/material-ui/guides/localization/). * @default 'Clear' */ clearText?: string; /** * Override the default text for the *close popup* icon button. * - * For localization purposes, you can use the provided [translations](/material-ui/guides/localization/). + * For localization purposes, you can use the provided [translations](https://mui.com/material-ui/guides/localization/). * @default 'Close' */ closeText?: string; @@ -249,7 +249,7 @@ type AutocompleteOwnProps< /** * Text to display when in a loading state. * - * For localization purposes, you can use the provided [translations](/material-ui/guides/localization/). + * For localization purposes, you can use the provided [translations](https://mui.com/material-ui/guides/localization/). * @default 'Loading…' */ loadingText?: React.ReactNode; @@ -266,14 +266,14 @@ type AutocompleteOwnProps< /** * Text to display when there are no options. * - * For localization purposes, you can use the provided [translations](/material-ui/guides/localization/). + * For localization purposes, you can use the provided [translations](https://mui.com/material-ui/guides/localization/). * @default 'No options' */ noOptionsText?: React.ReactNode; /** * Override the default text for the *open popup* icon button. * - * For localization purposes, you can use the provided [translations](/material-ui/guides/localization/). + * For localization purposes, you can use the provided [translations](https://mui.com/material-ui/guides/localization/). * @default 'Open' */ openText?: string; diff --git a/packages/mui-joy/src/Autocomplete/index.ts b/packages/mui-joy/src/Autocomplete/index.ts index 86393486cd32ef..5b01684270b978 100644 --- a/packages/mui-joy/src/Autocomplete/index.ts +++ b/packages/mui-joy/src/Autocomplete/index.ts @@ -1,4 +1,3 @@ -'use client'; export { createFilterOptions } from '@mui/base/useAutocomplete'; export { default } from './Autocomplete'; export * from './autocompleteClasses'; diff --git a/packages/mui-joy/src/AutocompleteListbox/index.ts b/packages/mui-joy/src/AutocompleteListbox/index.ts index 3bbaf0162e1d25..0fc430b15af660 100644 --- a/packages/mui-joy/src/AutocompleteListbox/index.ts +++ b/packages/mui-joy/src/AutocompleteListbox/index.ts @@ -1,4 +1,3 @@ -'use client'; export { default } from './AutocompleteListbox'; export * from './autocompleteListboxClasses'; export { default as autocompleteListboxClasses } from './autocompleteListboxClasses'; diff --git a/packages/mui-joy/src/AutocompleteOption/index.ts b/packages/mui-joy/src/AutocompleteOption/index.ts index 6565f5e41e6ac6..dda31b68a6b501 100644 --- a/packages/mui-joy/src/AutocompleteOption/index.ts +++ b/packages/mui-joy/src/AutocompleteOption/index.ts @@ -1,4 +1,3 @@ -'use client'; export { default } from './AutocompleteOption'; export * from './autocompleteOptionClasses'; export { default as autocompleteOptionClasses } from './autocompleteOptionClasses'; diff --git a/packages/mui-joy/src/Avatar/index.ts b/packages/mui-joy/src/Avatar/index.ts index 5a6648ea3e3bca..fca351ee6db5b0 100644 --- a/packages/mui-joy/src/Avatar/index.ts +++ b/packages/mui-joy/src/Avatar/index.ts @@ -1,4 +1,3 @@ -'use client'; export { default } from './Avatar'; export * from './avatarClasses'; export { default as avatarClasses } from './avatarClasses'; diff --git a/packages/mui-joy/src/AvatarGroup/index.ts b/packages/mui-joy/src/AvatarGroup/index.ts index 14a51f45869fb0..77ef2c0f011827 100644 --- a/packages/mui-joy/src/AvatarGroup/index.ts +++ b/packages/mui-joy/src/AvatarGroup/index.ts @@ -1,4 +1,3 @@ -'use client'; export { default } from './AvatarGroup'; export * from './avatarGroupClasses'; export { default as avatarGroupClasses } from './avatarGroupClasses'; diff --git a/packages/mui-joy/src/Badge/index.ts b/packages/mui-joy/src/Badge/index.ts index 90a5aef5a7e0d2..212caa85460e27 100644 --- a/packages/mui-joy/src/Badge/index.ts +++ b/packages/mui-joy/src/Badge/index.ts @@ -1,4 +1,3 @@ -'use client'; export { default } from './Badge'; export * from './BadgeProps'; export { default as badgeClasses } from './badgeClasses'; diff --git a/packages/mui-joy/src/Box/index.ts b/packages/mui-joy/src/Box/index.ts index de37ace16f1437..d51f428a3cb34c 100644 --- a/packages/mui-joy/src/Box/index.ts +++ b/packages/mui-joy/src/Box/index.ts @@ -1,4 +1,3 @@ -'use client'; export { default } from './Box'; export * from './BoxProps'; diff --git a/packages/mui-joy/src/Breadcrumbs/index.ts b/packages/mui-joy/src/Breadcrumbs/index.ts index a7ece78f6f3925..0ee5614fa62d66 100644 --- a/packages/mui-joy/src/Breadcrumbs/index.ts +++ b/packages/mui-joy/src/Breadcrumbs/index.ts @@ -1,4 +1,3 @@ -'use client'; export { default } from './Breadcrumbs'; export * from './breadcrumbsClasses'; export { default as breadcrumbsClasses } from './breadcrumbsClasses'; diff --git a/packages/mui-joy/src/Button/index.ts b/packages/mui-joy/src/Button/index.ts index cd516179783471..c702730d3c766b 100644 --- a/packages/mui-joy/src/Button/index.ts +++ b/packages/mui-joy/src/Button/index.ts @@ -1,4 +1,3 @@ -'use client'; export { default } from './Button'; export * from './ButtonProps'; export { default as buttonClasses } from './buttonClasses'; diff --git a/packages/mui-joy/src/ButtonGroup/index.ts b/packages/mui-joy/src/ButtonGroup/index.ts index b7a7c00fba44b7..29d7aa3afef8b7 100644 --- a/packages/mui-joy/src/ButtonGroup/index.ts +++ b/packages/mui-joy/src/ButtonGroup/index.ts @@ -1,4 +1,3 @@ -'use client'; export { default } from './ButtonGroup'; export * from './buttonGroupClasses'; export { default as buttonGroupClasses } from './buttonGroupClasses'; diff --git a/packages/mui-joy/src/Card/index.ts b/packages/mui-joy/src/Card/index.ts index 029b2b9c2c8d58..9c879224fe3ed2 100644 --- a/packages/mui-joy/src/Card/index.ts +++ b/packages/mui-joy/src/Card/index.ts @@ -1,4 +1,3 @@ -'use client'; export { default } from './Card'; export * from './cardClasses'; export { default as cardClasses } from './cardClasses'; diff --git a/packages/mui-joy/src/CardActions/index.ts b/packages/mui-joy/src/CardActions/index.ts index 67beb5527f3169..651c8315dffeea 100644 --- a/packages/mui-joy/src/CardActions/index.ts +++ b/packages/mui-joy/src/CardActions/index.ts @@ -1,4 +1,3 @@ -'use client'; export { default } from './CardActions'; export * from './cardActionsClasses'; export { default as cardActionsClasses } from './cardActionsClasses'; diff --git a/packages/mui-joy/src/CardContent/index.ts b/packages/mui-joy/src/CardContent/index.ts index dc2468896707c0..495e9679a8961d 100644 --- a/packages/mui-joy/src/CardContent/index.ts +++ b/packages/mui-joy/src/CardContent/index.ts @@ -1,4 +1,3 @@ -'use client'; export { default } from './CardContent'; export * from './cardContentClasses'; export { default as cardContentClasses } from './cardContentClasses'; diff --git a/packages/mui-joy/src/CardCover/index.ts b/packages/mui-joy/src/CardCover/index.ts index a3e7ec8b368fc0..13d43920b08a09 100644 --- a/packages/mui-joy/src/CardCover/index.ts +++ b/packages/mui-joy/src/CardCover/index.ts @@ -1,4 +1,3 @@ -'use client'; export { default } from './CardCover'; export * from './cardCoverClasses'; export { default as cardCoverClasses } from './cardCoverClasses'; diff --git a/packages/mui-joy/src/CardOverflow/index.ts b/packages/mui-joy/src/CardOverflow/index.ts index c24fb4f93ea292..70f27c2d158095 100644 --- a/packages/mui-joy/src/CardOverflow/index.ts +++ b/packages/mui-joy/src/CardOverflow/index.ts @@ -1,4 +1,3 @@ -'use client'; export { default } from './CardOverflow'; export * from './cardOverflowClasses'; export { default as cardOverflowClasses } from './cardOverflowClasses'; diff --git a/packages/mui-joy/src/Checkbox/index.ts b/packages/mui-joy/src/Checkbox/index.ts index 008c62e5bda20a..cfc79285e72f39 100644 --- a/packages/mui-joy/src/Checkbox/index.ts +++ b/packages/mui-joy/src/Checkbox/index.ts @@ -1,4 +1,3 @@ -'use client'; export { default } from './Checkbox'; export { default as checkboxClasses } from './checkboxClasses'; export * from './checkboxClasses'; diff --git a/packages/mui-joy/src/Chip/index.ts b/packages/mui-joy/src/Chip/index.ts index 12fd2fe3dc1a09..969b8f1e69b313 100644 --- a/packages/mui-joy/src/Chip/index.ts +++ b/packages/mui-joy/src/Chip/index.ts @@ -1,4 +1,3 @@ -'use client'; export { default } from './Chip'; export { default as chipClasses } from './chipClasses'; export * from './chipClasses'; diff --git a/packages/mui-joy/src/ChipDelete/index.ts b/packages/mui-joy/src/ChipDelete/index.ts index 6e1848d4c3211d..def36173c652da 100644 --- a/packages/mui-joy/src/ChipDelete/index.ts +++ b/packages/mui-joy/src/ChipDelete/index.ts @@ -1,4 +1,3 @@ -'use client'; export { default } from './ChipDelete'; export * from './chipDeleteClasses'; export { default as chipDeleteClasses } from './chipDeleteClasses'; diff --git a/packages/mui-joy/src/CircularProgress/index.ts b/packages/mui-joy/src/CircularProgress/index.ts index 48eed89ec0fb28..44a57d7f65fa32 100644 --- a/packages/mui-joy/src/CircularProgress/index.ts +++ b/packages/mui-joy/src/CircularProgress/index.ts @@ -1,4 +1,3 @@ -'use client'; export { default } from './CircularProgress'; export * from './circularProgressClasses'; export { default as circularProgressClasses } from './circularProgressClasses'; diff --git a/packages/mui-joy/src/Container/index.ts b/packages/mui-joy/src/Container/index.ts index 6ddd38a25d7ed6..40915571d90e2d 100644 --- a/packages/mui-joy/src/Container/index.ts +++ b/packages/mui-joy/src/Container/index.ts @@ -1,4 +1,3 @@ -'use client'; export { default } from './Container'; export * from './ContainerProps'; diff --git a/packages/mui-joy/src/CssBaseline/index.ts b/packages/mui-joy/src/CssBaseline/index.ts index 46a25c92336177..179c14be74d7e1 100644 --- a/packages/mui-joy/src/CssBaseline/index.ts +++ b/packages/mui-joy/src/CssBaseline/index.ts @@ -1,3 +1,2 @@ -'use client'; export { default } from './CssBaseline'; export * from './CssBaselineProps'; diff --git a/packages/mui-joy/src/DialogActions/index.ts b/packages/mui-joy/src/DialogActions/index.ts index 25cb9861ef01e9..d0a1e8a3804fae 100644 --- a/packages/mui-joy/src/DialogActions/index.ts +++ b/packages/mui-joy/src/DialogActions/index.ts @@ -1,4 +1,3 @@ -'use client'; export { default } from './DialogActions'; export * from './dialogActionsClasses'; export { default as dialogActionsClasses } from './dialogActionsClasses'; diff --git a/packages/mui-joy/src/DialogContent/index.ts b/packages/mui-joy/src/DialogContent/index.ts index c7d79222860a83..5075600d1f6795 100644 --- a/packages/mui-joy/src/DialogContent/index.ts +++ b/packages/mui-joy/src/DialogContent/index.ts @@ -1,4 +1,3 @@ -'use client'; export { default } from './DialogContent'; export * from './dialogContentClasses'; export { default as dialogContentClasses } from './dialogContentClasses'; diff --git a/packages/mui-joy/src/DialogTitle/index.ts b/packages/mui-joy/src/DialogTitle/index.ts index 0ce73b22ce0ae8..62530d0f28ac90 100644 --- a/packages/mui-joy/src/DialogTitle/index.ts +++ b/packages/mui-joy/src/DialogTitle/index.ts @@ -1,4 +1,3 @@ -'use client'; export { default } from './DialogTitle'; export * from './dialogTitleClasses'; export { default as dialogTitleClasses } from './dialogTitleClasses'; diff --git a/packages/mui-joy/src/Divider/index.ts b/packages/mui-joy/src/Divider/index.ts index 463c38d3c0f6b0..98725df4f93c68 100644 --- a/packages/mui-joy/src/Divider/index.ts +++ b/packages/mui-joy/src/Divider/index.ts @@ -1,4 +1,3 @@ -'use client'; export { default } from './Divider'; export { default as dividerClasses } from './dividerClasses'; export * from './dividerClasses'; diff --git a/packages/mui-joy/src/Drawer/index.ts b/packages/mui-joy/src/Drawer/index.ts index b129c460ab079c..b3bdb80e16d203 100644 --- a/packages/mui-joy/src/Drawer/index.ts +++ b/packages/mui-joy/src/Drawer/index.ts @@ -1,4 +1,3 @@ -'use client'; export { default } from './Drawer'; export { default as drawerClasses } from './drawerClasses'; export * from './drawerClasses'; diff --git a/packages/mui-joy/src/FormControl/index.ts b/packages/mui-joy/src/FormControl/index.ts index 08cbd066eef357..0a506dbac76ac0 100644 --- a/packages/mui-joy/src/FormControl/index.ts +++ b/packages/mui-joy/src/FormControl/index.ts @@ -1,4 +1,3 @@ -'use client'; export { default } from './FormControl'; export * from './formControlClasses'; export { default as formControlClasses } from './formControlClasses'; diff --git a/packages/mui-joy/src/FormHelperText/index.ts b/packages/mui-joy/src/FormHelperText/index.ts index e7ab52fb176e8b..8531159ad19a86 100644 --- a/packages/mui-joy/src/FormHelperText/index.ts +++ b/packages/mui-joy/src/FormHelperText/index.ts @@ -1,4 +1,3 @@ -'use client'; export { default } from './FormHelperText'; export { default as formHelperTextClasses } from './formHelperTextClasses'; export * from './formHelperTextClasses'; diff --git a/packages/mui-joy/src/FormLabel/index.ts b/packages/mui-joy/src/FormLabel/index.ts index 3c37eda127833d..2859bb1ff04879 100644 --- a/packages/mui-joy/src/FormLabel/index.ts +++ b/packages/mui-joy/src/FormLabel/index.ts @@ -1,4 +1,3 @@ -'use client'; export { default } from './FormLabel'; export { default as formLabelClasses } from './formLabelClasses'; export * from './formLabelClasses'; diff --git a/packages/mui-joy/src/Grid/index.ts b/packages/mui-joy/src/Grid/index.ts index d9e2e3542ecc98..5a981d71842eb3 100644 --- a/packages/mui-joy/src/Grid/index.ts +++ b/packages/mui-joy/src/Grid/index.ts @@ -1,4 +1,3 @@ -'use client'; export { default } from './Grid'; export * from './GridProps'; export { default as gridClasses } from './gridClasses'; diff --git a/packages/mui-joy/src/IconButton/index.ts b/packages/mui-joy/src/IconButton/index.ts index 475c12c4a62ab6..f30d909e64c437 100644 --- a/packages/mui-joy/src/IconButton/index.ts +++ b/packages/mui-joy/src/IconButton/index.ts @@ -1,4 +1,3 @@ -'use client'; export { default } from './IconButton'; export * from './IconButtonProps'; export { default as iconButtonClasses } from './iconButtonClasses'; diff --git a/packages/mui-joy/src/Input/index.ts b/packages/mui-joy/src/Input/index.ts index bda49e416efc31..6e1694aa348886 100644 --- a/packages/mui-joy/src/Input/index.ts +++ b/packages/mui-joy/src/Input/index.ts @@ -1,4 +1,3 @@ -'use client'; export { default } from './Input'; export * from './InputProps'; export { default as inputClasses } from './inputClasses'; diff --git a/packages/mui-joy/src/LinearProgress/index.ts b/packages/mui-joy/src/LinearProgress/index.ts index 38162c030ee9e6..4ed393247c7524 100644 --- a/packages/mui-joy/src/LinearProgress/index.ts +++ b/packages/mui-joy/src/LinearProgress/index.ts @@ -1,4 +1,3 @@ -'use client'; export { default } from './LinearProgress'; export * from './linearProgressClasses'; export { default as linearProgressClasses } from './linearProgressClasses'; diff --git a/packages/mui-joy/src/Link/index.ts b/packages/mui-joy/src/Link/index.ts index a914ee466d9bd6..6d27032b85f297 100644 --- a/packages/mui-joy/src/Link/index.ts +++ b/packages/mui-joy/src/Link/index.ts @@ -1,4 +1,3 @@ -'use client'; export { default } from './Link'; export * from './linkClasses'; export { default as linkClasses } from './linkClasses'; diff --git a/packages/mui-joy/src/List/index.ts b/packages/mui-joy/src/List/index.ts index 5f99c44d12ace4..0c4820c05816dc 100644 --- a/packages/mui-joy/src/List/index.ts +++ b/packages/mui-joy/src/List/index.ts @@ -1,4 +1,3 @@ -'use client'; export { default } from './List'; export { default as listClasses } from './listClasses'; export * from './listClasses'; diff --git a/packages/mui-joy/src/ListDivider/index.ts b/packages/mui-joy/src/ListDivider/index.ts index 1d7f1428fd42ee..5f6e2e0af599eb 100644 --- a/packages/mui-joy/src/ListDivider/index.ts +++ b/packages/mui-joy/src/ListDivider/index.ts @@ -1,4 +1,3 @@ -'use client'; export { default } from './ListDivider'; export { default as listDividerClasses } from './listDividerClasses'; export * from './listDividerClasses'; diff --git a/packages/mui-joy/src/ListItem/index.ts b/packages/mui-joy/src/ListItem/index.ts index 0f5a15fbf4e562..c4a83c1b180527 100644 --- a/packages/mui-joy/src/ListItem/index.ts +++ b/packages/mui-joy/src/ListItem/index.ts @@ -1,4 +1,3 @@ -'use client'; export { default } from './ListItem'; export { default as listItemClasses } from './listItemClasses'; export * from './listItemClasses'; diff --git a/packages/mui-joy/src/ListItemButton/index.ts b/packages/mui-joy/src/ListItemButton/index.ts index 655a937dcd6d47..c7db1d9a690d3f 100644 --- a/packages/mui-joy/src/ListItemButton/index.ts +++ b/packages/mui-joy/src/ListItemButton/index.ts @@ -1,4 +1,3 @@ -'use client'; export { default } from './ListItemButton'; export { default as listItemButtonClasses } from './listItemButtonClasses'; export * from './listItemButtonClasses'; diff --git a/packages/mui-joy/src/ListItemContent/index.ts b/packages/mui-joy/src/ListItemContent/index.ts index 16f7cfbca6031f..5c55dcf74bd894 100644 --- a/packages/mui-joy/src/ListItemContent/index.ts +++ b/packages/mui-joy/src/ListItemContent/index.ts @@ -1,4 +1,3 @@ -'use client'; export { default } from './ListItemContent'; export { default as listItemContentClasses } from './listItemContentClasses'; export * from './listItemContentClasses'; diff --git a/packages/mui-joy/src/ListItemDecorator/index.ts b/packages/mui-joy/src/ListItemDecorator/index.ts index 8a100627f29271..64caaecba13594 100644 --- a/packages/mui-joy/src/ListItemDecorator/index.ts +++ b/packages/mui-joy/src/ListItemDecorator/index.ts @@ -1,4 +1,3 @@ -'use client'; export { default } from './ListItemDecorator'; export { default as listItemDecoratorClasses } from './listItemDecoratorClasses'; export * from './listItemDecoratorClasses'; diff --git a/packages/mui-joy/src/ListSubheader/index.ts b/packages/mui-joy/src/ListSubheader/index.ts index 4166c0494c5028..7e85a94191be8d 100644 --- a/packages/mui-joy/src/ListSubheader/index.ts +++ b/packages/mui-joy/src/ListSubheader/index.ts @@ -1,4 +1,3 @@ -'use client'; export { default } from './ListSubheader'; export { default as listSubheaderClasses } from './listSubheaderClasses'; export * from './listSubheaderClasses'; diff --git a/packages/mui-joy/src/Menu/index.ts b/packages/mui-joy/src/Menu/index.ts index fd7e898536e4e5..2124dff2567749 100644 --- a/packages/mui-joy/src/Menu/index.ts +++ b/packages/mui-joy/src/Menu/index.ts @@ -1,4 +1,3 @@ -'use client'; export { default } from './Menu'; export { default as menuClasses } from './menuClasses'; export * from './menuClasses'; diff --git a/packages/mui-joy/src/MenuButton/index.ts b/packages/mui-joy/src/MenuButton/index.ts index da4343aebb09ff..f0ac8231c8c0d9 100644 --- a/packages/mui-joy/src/MenuButton/index.ts +++ b/packages/mui-joy/src/MenuButton/index.ts @@ -1,4 +1,3 @@ -'use client'; export { default } from './MenuButton'; export * from './MenuButtonProps'; diff --git a/packages/mui-joy/src/MenuItem/index.ts b/packages/mui-joy/src/MenuItem/index.ts index 7370b8101c1c91..ae19cf4f840060 100644 --- a/packages/mui-joy/src/MenuItem/index.ts +++ b/packages/mui-joy/src/MenuItem/index.ts @@ -1,4 +1,3 @@ -'use client'; export { default } from './MenuItem'; export { default as menuItemClasses } from './menuItemClasses'; export * from './menuItemClasses'; diff --git a/packages/mui-joy/src/MenuList/index.ts b/packages/mui-joy/src/MenuList/index.ts index 93ddb6f926c6da..0d68d9bcb40f4e 100644 --- a/packages/mui-joy/src/MenuList/index.ts +++ b/packages/mui-joy/src/MenuList/index.ts @@ -1,4 +1,3 @@ -'use client'; export { default } from './MenuList'; export { default as menuListClasses } from './menuListClasses'; export * from './menuListClasses'; diff --git a/packages/mui-joy/src/Modal/index.ts b/packages/mui-joy/src/Modal/index.ts index 73b29561062658..426ec988208a72 100644 --- a/packages/mui-joy/src/Modal/index.ts +++ b/packages/mui-joy/src/Modal/index.ts @@ -1,4 +1,3 @@ -'use client'; export { default } from './Modal'; export * from './modalClasses'; export { default as modalClasses } from './modalClasses'; diff --git a/packages/mui-joy/src/ModalClose/index.ts b/packages/mui-joy/src/ModalClose/index.ts index 6e1119abfd5e9e..3612cb7bfcfdab 100644 --- a/packages/mui-joy/src/ModalClose/index.ts +++ b/packages/mui-joy/src/ModalClose/index.ts @@ -1,4 +1,3 @@ -'use client'; export { default } from './ModalClose'; export * from './modalCloseClasses'; export { default as modalCloseClasses } from './modalCloseClasses'; diff --git a/packages/mui-joy/src/ModalDialog/index.ts b/packages/mui-joy/src/ModalDialog/index.ts index 09a7ee9533637d..c15073416b2509 100644 --- a/packages/mui-joy/src/ModalDialog/index.ts +++ b/packages/mui-joy/src/ModalDialog/index.ts @@ -1,4 +1,3 @@ -'use client'; export { default } from './ModalDialog'; export * from './modalDialogClasses'; export { default as modalDialogClasses } from './modalDialogClasses'; diff --git a/packages/mui-joy/src/ModalOverflow/index.ts b/packages/mui-joy/src/ModalOverflow/index.ts index 696abb5b8b5cef..de9a6a34c491c1 100644 --- a/packages/mui-joy/src/ModalOverflow/index.ts +++ b/packages/mui-joy/src/ModalOverflow/index.ts @@ -1,4 +1,3 @@ -'use client'; export { default } from './ModalOverflow'; export * from './modalOverflowClasses'; export { default as modalOverflowClasses } from './modalOverflowClasses'; diff --git a/packages/mui-joy/src/Option/index.ts b/packages/mui-joy/src/Option/index.ts index 6e5716eb8df59e..36144d0672fa1d 100644 --- a/packages/mui-joy/src/Option/index.ts +++ b/packages/mui-joy/src/Option/index.ts @@ -1,4 +1,3 @@ -'use client'; export { default } from './Option'; export { default as optionClasses } from './optionClasses'; export * from './optionClasses'; diff --git a/packages/mui-joy/src/Radio/index.ts b/packages/mui-joy/src/Radio/index.ts index e4697a3f7ec187..f315fa4d29b963 100644 --- a/packages/mui-joy/src/Radio/index.ts +++ b/packages/mui-joy/src/Radio/index.ts @@ -1,4 +1,3 @@ -'use client'; export { default } from './Radio'; export { default as radioClasses } from './radioClasses'; export * from './radioClasses'; diff --git a/packages/mui-joy/src/RadioGroup/index.ts b/packages/mui-joy/src/RadioGroup/index.ts index aea701723c2b4f..02e1ca75139914 100644 --- a/packages/mui-joy/src/RadioGroup/index.ts +++ b/packages/mui-joy/src/RadioGroup/index.ts @@ -1,4 +1,3 @@ -'use client'; export { default } from './RadioGroup'; export { default as radioGroupClasses } from './radioGroupClasses'; export * from './radioGroupClasses'; diff --git a/packages/mui-joy/src/ScopedCssBaseline/index.ts b/packages/mui-joy/src/ScopedCssBaseline/index.ts index c8982287ca6d12..bec39f16cd316c 100644 --- a/packages/mui-joy/src/ScopedCssBaseline/index.ts +++ b/packages/mui-joy/src/ScopedCssBaseline/index.ts @@ -1,4 +1,3 @@ -'use client'; export { default } from './ScopedCssBaseline'; export * from './ScopedCssBaselineProps'; export { default as scopedCssBaselineClasses } from './scopedCssBaselineClasses'; diff --git a/packages/mui-joy/src/Select/index.ts b/packages/mui-joy/src/Select/index.ts index dd6c63c90fcfce..8838449fd5d6fa 100644 --- a/packages/mui-joy/src/Select/index.ts +++ b/packages/mui-joy/src/Select/index.ts @@ -1,4 +1,3 @@ -'use client'; export { default } from './Select'; export * from './SelectProps'; export { default as selectClasses } from './selectClasses'; diff --git a/packages/mui-joy/src/Sheet/index.ts b/packages/mui-joy/src/Sheet/index.ts index 121b70ced0cf87..3a45d047c73333 100644 --- a/packages/mui-joy/src/Sheet/index.ts +++ b/packages/mui-joy/src/Sheet/index.ts @@ -1,4 +1,3 @@ -'use client'; export { default } from './Sheet'; export * from './sheetClasses'; export { default as sheetClasses } from './sheetClasses'; diff --git a/packages/mui-joy/src/Skeleton/index.ts b/packages/mui-joy/src/Skeleton/index.ts index f385837fbc00ba..b472237175f850 100644 --- a/packages/mui-joy/src/Skeleton/index.ts +++ b/packages/mui-joy/src/Skeleton/index.ts @@ -1,4 +1,3 @@ -'use client'; export { default } from './Skeleton'; export * from './skeletonClasses'; export { default as skeletonClasses } from './skeletonClasses'; diff --git a/packages/mui-joy/src/Slider/index.ts b/packages/mui-joy/src/Slider/index.ts index 9c831ddb98d38b..1cfe65a7186029 100644 --- a/packages/mui-joy/src/Slider/index.ts +++ b/packages/mui-joy/src/Slider/index.ts @@ -1,4 +1,3 @@ -'use client'; export { default } from './Slider'; export * from './sliderClasses'; export { default as sliderClasses } from './sliderClasses'; diff --git a/packages/mui-joy/src/Snackbar/index.ts b/packages/mui-joy/src/Snackbar/index.ts index 9a1de25f1c8376..4c01e406ca27f9 100644 --- a/packages/mui-joy/src/Snackbar/index.ts +++ b/packages/mui-joy/src/Snackbar/index.ts @@ -1,4 +1,3 @@ -'use client'; export { default } from './Snackbar'; export * from './snackbarClasses'; export { default as snackbarClasses } from './snackbarClasses'; diff --git a/packages/mui-joy/src/Stack/index.ts b/packages/mui-joy/src/Stack/index.ts index 4cb10618d7d1be..4f3fa2e1c84858 100644 --- a/packages/mui-joy/src/Stack/index.ts +++ b/packages/mui-joy/src/Stack/index.ts @@ -1,4 +1,3 @@ -'use client'; export { default } from './Stack'; export * from './StackProps'; diff --git a/packages/mui-joy/src/Step/index.ts b/packages/mui-joy/src/Step/index.ts index 26022ad8d0450c..2650570a7d11d1 100644 --- a/packages/mui-joy/src/Step/index.ts +++ b/packages/mui-joy/src/Step/index.ts @@ -1,4 +1,3 @@ -'use client'; export { default } from './Step'; export * from './stepClasses'; export { default as stepClasses } from './stepClasses'; diff --git a/packages/mui-joy/src/StepButton/index.ts b/packages/mui-joy/src/StepButton/index.ts index db8008e0382012..dc494f17ff3c7a 100644 --- a/packages/mui-joy/src/StepButton/index.ts +++ b/packages/mui-joy/src/StepButton/index.ts @@ -1,4 +1,3 @@ -'use client'; export { default } from './StepButton'; export * from './stepButtonClasses'; export { default as stepButtonClasses } from './stepButtonClasses'; diff --git a/packages/mui-joy/src/StepIndicator/index.ts b/packages/mui-joy/src/StepIndicator/index.ts index f14427ff38451c..53a2e118f0906c 100644 --- a/packages/mui-joy/src/StepIndicator/index.ts +++ b/packages/mui-joy/src/StepIndicator/index.ts @@ -1,4 +1,3 @@ -'use client'; export { default } from './StepIndicator'; export * from './stepIndicatorClasses'; export { default as stepIndicatorClasses } from './stepIndicatorClasses'; diff --git a/packages/mui-joy/src/Stepper/index.ts b/packages/mui-joy/src/Stepper/index.ts index 1e14b6e812d1c9..f81f0e70cc2a50 100644 --- a/packages/mui-joy/src/Stepper/index.ts +++ b/packages/mui-joy/src/Stepper/index.ts @@ -1,4 +1,3 @@ -'use client'; export { default } from './Stepper'; export * from './stepperClasses'; export { default as stepperClasses } from './stepperClasses'; diff --git a/packages/mui-joy/src/SvgIcon/index.ts b/packages/mui-joy/src/SvgIcon/index.ts index 059c67f7f2c035..4ecec6ee8d814e 100644 --- a/packages/mui-joy/src/SvgIcon/index.ts +++ b/packages/mui-joy/src/SvgIcon/index.ts @@ -1,4 +1,3 @@ -'use client'; export { default } from './SvgIcon'; export * from './SvgIconProps'; export { default as svgIconClasses } from './svgIconClasses'; diff --git a/packages/mui-joy/src/Switch/index.ts b/packages/mui-joy/src/Switch/index.ts index fc73710fc6b750..2c190ccd5f69b4 100644 --- a/packages/mui-joy/src/Switch/index.ts +++ b/packages/mui-joy/src/Switch/index.ts @@ -1,4 +1,3 @@ -'use client'; export { default } from './Switch'; export { default as switchClasses } from './switchClasses'; export * from './switchClasses'; diff --git a/packages/mui-joy/src/Tab/index.ts b/packages/mui-joy/src/Tab/index.ts index c9d3d35b2d54cb..974eb9868050d3 100644 --- a/packages/mui-joy/src/Tab/index.ts +++ b/packages/mui-joy/src/Tab/index.ts @@ -1,4 +1,3 @@ -'use client'; export { default } from './Tab'; export * from './tabClasses'; export { default as tabClasses } from './tabClasses'; diff --git a/packages/mui-joy/src/TabList/index.ts b/packages/mui-joy/src/TabList/index.ts index 8a21cc29136f75..b35c807435d338 100644 --- a/packages/mui-joy/src/TabList/index.ts +++ b/packages/mui-joy/src/TabList/index.ts @@ -1,4 +1,3 @@ -'use client'; export { default } from './TabList'; export * from './tabListClasses'; export { default as tabListClasses } from './tabListClasses'; diff --git a/packages/mui-joy/src/TabPanel/index.ts b/packages/mui-joy/src/TabPanel/index.ts index 9171601c462a1e..ff9a08902de0f3 100644 --- a/packages/mui-joy/src/TabPanel/index.ts +++ b/packages/mui-joy/src/TabPanel/index.ts @@ -1,4 +1,3 @@ -'use client'; export { default } from './TabPanel'; export * from './tabPanelClasses'; export { default as tabPanelClasses } from './tabPanelClasses'; diff --git a/packages/mui-joy/src/Table/index.ts b/packages/mui-joy/src/Table/index.ts index 63b5fc013fd3b2..0bcd389394be06 100644 --- a/packages/mui-joy/src/Table/index.ts +++ b/packages/mui-joy/src/Table/index.ts @@ -1,4 +1,3 @@ -'use client'; export { default } from './Table'; export * from './tableClasses'; export { default as tableClasses } from './tableClasses'; diff --git a/packages/mui-joy/src/Tabs/index.ts b/packages/mui-joy/src/Tabs/index.ts index 70378920b5b207..6396048dca1ec7 100644 --- a/packages/mui-joy/src/Tabs/index.ts +++ b/packages/mui-joy/src/Tabs/index.ts @@ -1,4 +1,3 @@ -'use client'; export { default } from './Tabs'; export * from './tabsClasses'; export { default as tabsClasses } from './tabsClasses'; diff --git a/packages/mui-joy/src/TextField/index.ts b/packages/mui-joy/src/TextField/index.ts index f8cd03c69cdf5e..0198002999a808 100644 --- a/packages/mui-joy/src/TextField/index.ts +++ b/packages/mui-joy/src/TextField/index.ts @@ -1,2 +1 @@ -'use client'; export { default } from './TextField'; diff --git a/packages/mui-joy/src/Textarea/index.ts b/packages/mui-joy/src/Textarea/index.ts index c1df8aa9f77a55..4b7d47c97ebc6d 100644 --- a/packages/mui-joy/src/Textarea/index.ts +++ b/packages/mui-joy/src/Textarea/index.ts @@ -1,4 +1,3 @@ -'use client'; export { default } from './Textarea'; export * from './TextareaProps'; export { default as textareaClasses } from './textareaClasses'; diff --git a/packages/mui-joy/src/ToggleButtonGroup/index.ts b/packages/mui-joy/src/ToggleButtonGroup/index.ts index 7372bd7583cd0a..d59291be53b991 100644 --- a/packages/mui-joy/src/ToggleButtonGroup/index.ts +++ b/packages/mui-joy/src/ToggleButtonGroup/index.ts @@ -1,4 +1,3 @@ -'use client'; export { default } from './ToggleButtonGroup'; export * from './toggleButtonGroupClasses'; export { default as toggleButtonGroupClasses } from './toggleButtonGroupClasses'; diff --git a/packages/mui-joy/src/Tooltip/index.ts b/packages/mui-joy/src/Tooltip/index.ts index 52eb39f3ec0778..d9fccd402f603d 100644 --- a/packages/mui-joy/src/Tooltip/index.ts +++ b/packages/mui-joy/src/Tooltip/index.ts @@ -1,4 +1,3 @@ -'use client'; export { default } from './Tooltip'; export * from './tooltipClasses'; export { default as tooltipClasses } from './tooltipClasses'; diff --git a/packages/mui-joy/src/Typography/index.ts b/packages/mui-joy/src/Typography/index.ts index 48221d9679291b..bbaa51027683f6 100644 --- a/packages/mui-joy/src/Typography/index.ts +++ b/packages/mui-joy/src/Typography/index.ts @@ -1,4 +1,3 @@ -'use client'; export { default } from './Typography'; export * from './TypographyProps'; export { default as typographyClasses } from './typographyClasses'; diff --git a/packages/mui-joy/src/index.ts b/packages/mui-joy/src/index.ts index 5b7c7c983bb69a..59a9bc7b21e6d0 100644 --- a/packages/mui-joy/src/index.ts +++ b/packages/mui-joy/src/index.ts @@ -1,4 +1,3 @@ -'use client'; export { default as colors } from './colors'; export * from './styles'; diff --git a/packages/mui-joy/src/styles/index.ts b/packages/mui-joy/src/styles/index.ts index 82fd57ca9ee0da..a7420b67e870cb 100644 --- a/packages/mui-joy/src/styles/index.ts +++ b/packages/mui-joy/src/styles/index.ts @@ -1,4 +1,3 @@ -'use client'; // reexports from system for module augmentation export type { BreakpointOverrides } from '@mui/system'; diff --git a/packages/mui-joy/src/utils/index.ts b/packages/mui-joy/src/utils/index.ts index 62124dcc5cefdb..75299a21ac5071 100644 --- a/packages/mui-joy/src/utils/index.ts +++ b/packages/mui-joy/src/utils/index.ts @@ -1,3 +1,2 @@ -'use client'; // eslint-disable-next-line import/prefer-default-export export { default as createSvgIcon } from './createSvgIcon'; diff --git a/packages/mui-lab/README.md b/packages/mui-lab/README.md index 09600169c250d9..3a38ed547576ff 100644 --- a/packages/mui-lab/README.md +++ b/packages/mui-lab/README.md @@ -9,7 +9,7 @@ Install the package in your project directory with: <!-- #default-branch-switch --> ```bash -npm install @mui/lab@next +npm install @mui/lab ``` The lab has peer dependencies on the Material Design components and on the Emotion library. @@ -18,11 +18,11 @@ If you are not already using them in your project, you can install with: <!-- #default-branch-switch --> ```bash -npm install @mui/material@next @emotion/react @emotion/styled +npm install @mui/material @emotion/react @emotion/styled ``` ## Documentation <!-- #default-branch-switch --> -Visit [https://next.mui.com/material-ui/about-the-lab/](https://next.mui.com/material-ui/about-the-lab/) to view the full documentation. +Visit [https://mui.com/material-ui/about-the-lab/](https://mui.com/material-ui/about-the-lab/) to view the full documentation. diff --git a/packages/mui-lab/package.json b/packages/mui-lab/package.json index b1c6f0e47eb71d..ee8cfed15c0059 100644 --- a/packages/mui-lab/package.json +++ b/packages/mui-lab/package.json @@ -1,6 +1,6 @@ { "name": "@mui/lab", - "version": "6.0.0-beta.6", + "version": "6.0.0-beta.9", "private": false, "author": "MUI Team", "description": "Laboratory for new MUI modules.", @@ -42,24 +42,24 @@ "dependencies": { "@babel/runtime": "^7.25.0", "@mui/base": "workspace:*", - "@mui/system": "workspace:*", + "@mui/system": "workspace:^", "@mui/types": "workspace:^", - "@mui/utils": "workspace:*", + "@mui/utils": "workspace:^", "clsx": "^2.1.1", "prop-types": "^15.8.1" }, "devDependencies": { "@mui/internal-test-utils": "workspace:^", "@mui/material": "workspace:*", - "@types/chai": "^4.3.17", + "@types/chai": "^4.3.19", "@types/prop-types": "^15.7.12", - "@types/react": "^18.3.3", + "@types/react": "^18.3.4", "@types/react-dom": "^18.3.0", "@types/sinon": "^17.0.3", "chai": "^4.5.0", "react": "^18.3.1", "react-dom": "^18.3.1", - "sinon": "^16.1.3" + "sinon": "^18.0.0" }, "peerDependencies": { "@emotion/react": "^11.5.0", diff --git a/packages/mui-lab/src/LoadingButton/LoadingButton.d.ts b/packages/mui-lab/src/LoadingButton/LoadingButton.d.ts index 6dc2341f9f5265..193b192ddf029d 100644 --- a/packages/mui-lab/src/LoadingButton/LoadingButton.d.ts +++ b/packages/mui-lab/src/LoadingButton/LoadingButton.d.ts @@ -10,6 +10,8 @@ export interface LoadingButtonOwnProps { classes?: Partial<ButtonClasses> & { /** Styles applied to the root element. */ root?: string; + /** Styles applied to the span element that wraps the children. */ + label?: string; /** Styles applied to the root element if `loading={true}`. */ loading?: string; /** Styles applied to the loadingIndicator element. */ @@ -60,13 +62,13 @@ export type LoadingButtonTypeMap< * * Demos: * - * - [Button Group](https://next.mui.com/material-ui/react-button-group/) - * - [Button](https://next.mui.com/material-ui/react-button/) + * - [Button Group](https://mui.com/material-ui/react-button-group/) + * - [Button](https://mui.com/material-ui/react-button/) * * API: * - * - [LoadingButton API](https://next.mui.com/material-ui/api/loading-button/) - * - inherits [Button API](https://next.mui.com/material-ui/api/button/) + * - [LoadingButton API](https://mui.com/material-ui/api/loading-button/) + * - inherits [Button API](https://mui.com/material-ui/api/button/) */ declare const LoadingButton: ExtendButton<LoadingButtonTypeMap>; diff --git a/packages/mui-lab/src/LoadingButton/LoadingButton.js b/packages/mui-lab/src/LoadingButton/LoadingButton.js index 13d5a9aec21df1..12f0997a888d09 100644 --- a/packages/mui-lab/src/LoadingButton/LoadingButton.js +++ b/packages/mui-lab/src/LoadingButton/LoadingButton.js @@ -2,7 +2,11 @@ import * as React from 'react'; import PropTypes from 'prop-types'; import { chainPropTypes } from '@mui/utils'; -import { capitalize, unstable_useId as useId } from '@mui/material/utils'; +import { + capitalize, + unstable_useId as useId, + unstable_memoTheme as memoTheme, +} from '@mui/material/utils'; import { unstable_composeClasses as composeClasses } from '@mui/base'; import { useDefaultProps } from '@mui/material/DefaultPropsProvider'; import Button from '@mui/material/Button'; @@ -17,6 +21,7 @@ const useUtilityClasses = (ownerState) => { const slots = { root: ['root', loading && 'loading'], + label: ['label'], startIcon: [loading && `startIconLoading${capitalize(loadingPosition)}`], endIcon: [loading && `endIconLoading${capitalize(loadingPosition)}`], loadingIndicator: [ @@ -51,56 +56,59 @@ const LoadingButtonRoot = styled(Button, { }, ]; }, -})(({ theme }) => ({ - [`& .${loadingButtonClasses.startIconLoadingStart}, & .${loadingButtonClasses.endIconLoadingEnd}`]: - { - transition: theme.transitions.create(['opacity'], { - duration: theme.transitions.duration.short, - }), - opacity: 0, - }, - variants: [ - { - props: { - loadingPosition: 'center', - }, - style: { - transition: theme.transitions.create(['background-color', 'box-shadow', 'border-color'], { +})( + memoTheme(({ theme }) => ({ + display: 'inline-flex', + [`& .${loadingButtonClasses.startIconLoadingStart}, & .${loadingButtonClasses.endIconLoadingEnd}`]: + { + transition: theme.transitions.create(['opacity'], { duration: theme.transitions.duration.short, }), - [`&.${loadingButtonClasses.loading}`]: { - color: 'transparent', - }, + opacity: 0, }, - }, - { - props: ({ ownerState }) => ownerState.loadingPosition === 'start' && ownerState.fullWidth, - style: { - [`& .${loadingButtonClasses.startIconLoadingStart}, & .${loadingButtonClasses.endIconLoadingEnd}`]: - { - transition: theme.transitions.create(['opacity'], { - duration: theme.transitions.duration.short, - }), - opacity: 0, - marginRight: -8, + variants: [ + { + props: { + loadingPosition: 'center', + }, + style: { + transition: theme.transitions.create(['background-color', 'box-shadow', 'border-color'], { + duration: theme.transitions.duration.short, + }), + [`&.${loadingButtonClasses.loading}`]: { + color: 'transparent', }, + }, }, - }, - { - props: ({ ownerState }) => ownerState.loadingPosition === 'end' && ownerState.fullWidth, - style: { - [`& .${loadingButtonClasses.startIconLoadingStart}, & .${loadingButtonClasses.endIconLoadingEnd}`]: - { - transition: theme.transitions.create(['opacity'], { - duration: theme.transitions.duration.short, - }), - opacity: 0, - marginLeft: -8, - }, + { + props: ({ ownerState }) => ownerState.loadingPosition === 'start' && ownerState.fullWidth, + style: { + [`& .${loadingButtonClasses.startIconLoadingStart}, & .${loadingButtonClasses.endIconLoadingEnd}`]: + { + transition: theme.transitions.create(['opacity'], { + duration: theme.transitions.duration.short, + }), + opacity: 0, + marginRight: -8, + }, + }, + }, + { + props: ({ ownerState }) => ownerState.loadingPosition === 'end' && ownerState.fullWidth, + style: { + [`& .${loadingButtonClasses.startIconLoadingStart}, & .${loadingButtonClasses.endIconLoadingEnd}`]: + { + transition: theme.transitions.create(['opacity'], { + duration: theme.transitions.duration.short, + }), + opacity: 0, + marginLeft: -8, + }, + }, }, - }, - ], -})); + ], + })), +); const LoadingButtonLoadingIndicator = styled('span', { name: 'MuiLoadingButton', @@ -112,87 +120,101 @@ const LoadingButtonLoadingIndicator = styled('span', { styles[`loadingIndicator${capitalize(ownerState.loadingPosition)}`], ]; }, -})(({ theme }) => ({ - position: 'absolute', - visibility: 'visible', - display: 'flex', - variants: [ - { - props: { - loadingPosition: 'start', - size: 'small', - }, - style: { - left: 10, - }, - }, - { - props: ({ loadingPosition, ownerState }) => - loadingPosition === 'start' && ownerState.size !== 'small', - style: { - left: 14, - }, - }, - { - props: { - variant: 'text', - loadingPosition: 'start', - }, - style: { - left: 6, - }, - }, - { - props: { - loadingPosition: 'center', +})( + memoTheme(({ theme }) => ({ + position: 'absolute', + visibility: 'visible', + display: 'flex', + variants: [ + { + props: { + loadingPosition: 'start', + size: 'small', + }, + style: { + left: 10, + }, }, - style: { - left: '50%', - transform: 'translate(-50%)', - color: (theme.vars || theme).palette.action.disabled, + { + props: ({ loadingPosition, ownerState }) => + loadingPosition === 'start' && ownerState.size !== 'small', + style: { + left: 14, + }, }, - }, - { - props: { - loadingPosition: 'end', - size: 'small', + { + props: { + variant: 'text', + loadingPosition: 'start', + }, + style: { + left: 6, + }, }, - style: { - right: 10, + { + props: { + loadingPosition: 'center', + }, + style: { + left: '50%', + transform: 'translate(-50%)', + color: (theme.vars || theme).palette.action.disabled, + }, }, - }, - { - props: ({ loadingPosition, ownerState }) => - loadingPosition === 'end' && ownerState.size !== 'small', - style: { - right: 14, + { + props: { + loadingPosition: 'end', + size: 'small', + }, + style: { + right: 10, + }, }, - }, - { - props: { - variant: 'text', - loadingPosition: 'end', + { + props: ({ loadingPosition, ownerState }) => + loadingPosition === 'end' && ownerState.size !== 'small', + style: { + right: 14, + }, }, - style: { - right: 6, + { + props: { + variant: 'text', + loadingPosition: 'end', + }, + style: { + right: 6, + }, }, - }, - { - props: ({ ownerState }) => ownerState.loadingPosition === 'start' && ownerState.fullWidth, - style: { - position: 'relative', - left: -10, + { + props: ({ ownerState }) => ownerState.loadingPosition === 'start' && ownerState.fullWidth, + style: { + position: 'relative', + left: -10, + }, }, - }, - { - props: ({ ownerState }) => ownerState.loadingPosition === 'end' && ownerState.fullWidth, - style: { - position: 'relative', - right: -10, + { + props: ({ ownerState }) => ownerState.loadingPosition === 'end' && ownerState.fullWidth, + style: { + position: 'relative', + right: -10, + }, }, - }, - ], -})); + ], + })), +); + +const LoadingButtonLabel = styled('span', { + name: 'MuiLoadingButton', + slot: 'Label', + overridesResolver: (props, styles) => { + return [styles.label]; + }, +})({ + display: 'inherit', + alignItems: 'inherit', + justifyContent: 'inherit', +}); const LoadingButton = React.forwardRef(function LoadingButton(inProps, ref) { const contextProps = React.useContext(ButtonGroupContext); @@ -242,7 +264,7 @@ const LoadingButton = React.forwardRef(function LoadingButton(inProps, ref) { ownerState={ownerState} > {ownerState.loadingPosition === 'end' ? ( - <span>{children}</span> + <LoadingButtonLabel className={classes.label}>{children}</LoadingButtonLabel> ) : ( loadingButtonLoadingIndicator )} @@ -250,7 +272,7 @@ const LoadingButton = React.forwardRef(function LoadingButton(inProps, ref) { {ownerState.loadingPosition === 'end' ? ( loadingButtonLoadingIndicator ) : ( - <span>{children}</span> + <LoadingButtonLabel className={classes.label}>{children}</LoadingButtonLabel> )} </LoadingButtonRoot> ); diff --git a/packages/mui-lab/src/LoadingButton/loadingButtonClasses.ts b/packages/mui-lab/src/LoadingButton/loadingButtonClasses.ts index d4adaf87799f78..d6543a1fa86cab 100644 --- a/packages/mui-lab/src/LoadingButton/loadingButtonClasses.ts +++ b/packages/mui-lab/src/LoadingButton/loadingButtonClasses.ts @@ -4,6 +4,8 @@ import generateUtilityClasses from '@mui/utils/generateUtilityClasses'; export interface LoadingButtonClasses { /** Styles applied to the root element. */ root: string; + /** Styles applied to the span element that wraps the children. */ + label: string; /** Styles applied to the root element if `loading={true}`. */ loading: string; /** Styles applied to the loadingIndicator element. */ @@ -28,6 +30,7 @@ export function getLoadingButtonUtilityClass(slot: string): string { const loadingButtonClasses: LoadingButtonClasses = generateUtilityClasses('MuiLoadingButton', [ 'root', + 'label', 'loading', 'loadingIndicator', 'loadingIndicatorCenter', diff --git a/packages/mui-lab/src/Masonry/Masonry.d.ts b/packages/mui-lab/src/Masonry/Masonry.d.ts index ad713aabf157ea..530c4666296ca7 100644 --- a/packages/mui-lab/src/Masonry/Masonry.d.ts +++ b/packages/mui-lab/src/Masonry/Masonry.d.ts @@ -56,11 +56,11 @@ export interface MasonryTypeMap< * * Demos: * - * - [Masonry](https://next.mui.com/material-ui/react-masonry/) + * - [Masonry](https://mui.com/material-ui/react-masonry/) * * API: * - * - [Masonry API](https://next.mui.com/material-ui/api/masonry/) + * - [Masonry API](https://mui.com/material-ui/api/masonry/) */ declare const Masonry: OverridableComponent<MasonryTypeMap>; diff --git a/packages/mui-lab/src/TabContext/TabContext.d.ts b/packages/mui-lab/src/TabContext/TabContext.d.ts index eb11d2d4e4e77a..38274ad8257053 100644 --- a/packages/mui-lab/src/TabContext/TabContext.d.ts +++ b/packages/mui-lab/src/TabContext/TabContext.d.ts @@ -19,11 +19,11 @@ export interface TabContextProps { * * Demos: * - * - [Tabs](https://next.mui.com/material-ui/react-tabs/) + * - [Tabs](https://mui.com/material-ui/react-tabs/) * * API: * - * - [TabContext API](https://next.mui.com/material-ui/api/tab-context/) + * - [TabContext API](https://mui.com/material-ui/api/tab-context/) */ export default function TabContext(props: TabContextProps): React.JSX.Element; export function useTabContext(): TabContextValue | null; diff --git a/packages/mui-lab/src/TabList/TabList.d.ts b/packages/mui-lab/src/TabList/TabList.d.ts index 7079020fa7d846..cf7a6dd2381a44 100644 --- a/packages/mui-lab/src/TabList/TabList.d.ts +++ b/packages/mui-lab/src/TabList/TabList.d.ts @@ -22,12 +22,12 @@ export interface TabListTypeMap< * * Demos: * - * - [Tabs](https://next.mui.com/material-ui/react-tabs/) + * - [Tabs](https://mui.com/material-ui/react-tabs/) * * API: * - * - [TabList API](https://next.mui.com/material-ui/api/tab-list/) - * - inherits [Tabs API](https://next.mui.com/material-ui/api/tabs/) + * - [TabList API](https://mui.com/material-ui/api/tab-list/) + * - inherits [Tabs API](https://mui.com/material-ui/api/tabs/) */ declare const TabList: OverridableComponent<TabListTypeMap>; diff --git a/packages/mui-lab/src/TabPanel/TabPanel.d.ts b/packages/mui-lab/src/TabPanel/TabPanel.d.ts index ecefd407146b86..47905950704896 100644 --- a/packages/mui-lab/src/TabPanel/TabPanel.d.ts +++ b/packages/mui-lab/src/TabPanel/TabPanel.d.ts @@ -33,10 +33,10 @@ export interface TabPanelProps extends StandardProps<React.HTMLAttributes<HTMLDi * * Demos: * - * - [Tabs](https://next.mui.com/material-ui/react-tabs/) + * - [Tabs](https://mui.com/material-ui/react-tabs/) * * API: * - * - [TabPanel API](https://next.mui.com/material-ui/api/tab-panel/) + * - [TabPanel API](https://mui.com/material-ui/api/tab-panel/) */ export default function TabPanel(props: TabPanelProps): React.JSX.Element; diff --git a/packages/mui-lab/src/Timeline/Timeline.tsx b/packages/mui-lab/src/Timeline/Timeline.tsx index a9321746b93643..f388d198b084d3 100644 --- a/packages/mui-lab/src/Timeline/Timeline.tsx +++ b/packages/mui-lab/src/Timeline/Timeline.tsx @@ -43,11 +43,11 @@ const TimelineRoot = styled('ul' as const, { * * Demos: * - * - [Timeline](https://next.mui.com/material-ui/react-timeline/) + * - [Timeline](https://mui.com/material-ui/react-timeline/) * * API: * - * - [Timeline API](https://next.mui.com/material-ui/api/timeline/) + * - [Timeline API](https://mui.com/material-ui/api/timeline/) */ const Timeline = React.forwardRef<HTMLUListElement, TimelineProps>(function Timeline(inProps, ref) { const props = useThemeProps({ props: inProps, name: 'MuiTimeline' }); diff --git a/packages/mui-lab/src/TimelineConnector/TimelineConnector.d.ts b/packages/mui-lab/src/TimelineConnector/TimelineConnector.d.ts index 65ba2b3f39c66b..168b023cece9c2 100644 --- a/packages/mui-lab/src/TimelineConnector/TimelineConnector.d.ts +++ b/packages/mui-lab/src/TimelineConnector/TimelineConnector.d.ts @@ -24,10 +24,10 @@ export interface TimelineConnectorProps * * Demos: * - * - [Timeline](https://next.mui.com/material-ui/react-timeline/) + * - [Timeline](https://mui.com/material-ui/react-timeline/) * * API: * - * - [TimelineConnector API](https://next.mui.com/material-ui/api/timeline-connector/) + * - [TimelineConnector API](https://mui.com/material-ui/api/timeline-connector/) */ export default function TimelineConnector(props: TimelineConnectorProps): React.JSX.Element; diff --git a/packages/mui-lab/src/TimelineContent/TimelineContent.d.ts b/packages/mui-lab/src/TimelineContent/TimelineContent.d.ts index 6e632d90950606..6bfe5fe24e9ffd 100644 --- a/packages/mui-lab/src/TimelineContent/TimelineContent.d.ts +++ b/packages/mui-lab/src/TimelineContent/TimelineContent.d.ts @@ -23,11 +23,11 @@ export interface TimelineContentProps extends StandardProps<TypographyProps> { * * Demos: * - * - [Timeline](https://next.mui.com/material-ui/react-timeline/) + * - [Timeline](https://mui.com/material-ui/react-timeline/) * * API: * - * - [TimelineContent API](https://next.mui.com/material-ui/api/timeline-content/) - * - inherits [Typography API](https://next.mui.com/material-ui/api/typography/) + * - [TimelineContent API](https://mui.com/material-ui/api/timeline-content/) + * - inherits [Typography API](https://mui.com/material-ui/api/typography/) */ export default function TimelineContent(props: TimelineContentProps): React.JSX.Element; diff --git a/packages/mui-lab/src/TimelineDot/TimelineDot.d.ts b/packages/mui-lab/src/TimelineDot/TimelineDot.d.ts index c6a0999dd49a26..1d04d9caacd8f4 100644 --- a/packages/mui-lab/src/TimelineDot/TimelineDot.d.ts +++ b/packages/mui-lab/src/TimelineDot/TimelineDot.d.ts @@ -41,10 +41,10 @@ export interface TimelineDotProps extends StandardProps<React.HTMLAttributes<HTM * * Demos: * - * - [Timeline](https://next.mui.com/material-ui/react-timeline/) + * - [Timeline](https://mui.com/material-ui/react-timeline/) * * API: * - * - [TimelineDot API](https://next.mui.com/material-ui/api/timeline-dot/) + * - [TimelineDot API](https://mui.com/material-ui/api/timeline-dot/) */ export default function TimelineDot(props: TimelineDotProps): React.JSX.Element; diff --git a/packages/mui-lab/src/TimelineItem/TimelineItem.d.ts b/packages/mui-lab/src/TimelineItem/TimelineItem.d.ts index e29da58abd33e4..8d2b0847e11eb2 100644 --- a/packages/mui-lab/src/TimelineItem/TimelineItem.d.ts +++ b/packages/mui-lab/src/TimelineItem/TimelineItem.d.ts @@ -27,10 +27,10 @@ export interface TimelineItemProps extends StandardProps<React.HTMLAttributes<HT * * Demos: * - * - [Timeline](https://next.mui.com/material-ui/react-timeline/) + * - [Timeline](https://mui.com/material-ui/react-timeline/) * * API: * - * - [TimelineItem API](https://next.mui.com/material-ui/api/timeline-item/) + * - [TimelineItem API](https://mui.com/material-ui/api/timeline-item/) */ export default function TimelineItem(props: TimelineItemProps): React.JSX.Element; diff --git a/packages/mui-lab/src/TimelineOppositeContent/TimelineOppositeContent.d.ts b/packages/mui-lab/src/TimelineOppositeContent/TimelineOppositeContent.d.ts index 8dde8e93e7f1b6..ea287b8677accf 100644 --- a/packages/mui-lab/src/TimelineOppositeContent/TimelineOppositeContent.d.ts +++ b/packages/mui-lab/src/TimelineOppositeContent/TimelineOppositeContent.d.ts @@ -23,12 +23,12 @@ export interface TimelineOppositeContentProps extends StandardProps<TypographyPr * * Demos: * - * - [Timeline](https://next.mui.com/material-ui/react-timeline/) + * - [Timeline](https://mui.com/material-ui/react-timeline/) * * API: * - * - [TimelineOppositeContent API](https://next.mui.com/material-ui/api/timeline-opposite-content/) - * - inherits [Typography API](https://next.mui.com/material-ui/api/typography/) + * - [TimelineOppositeContent API](https://mui.com/material-ui/api/timeline-opposite-content/) + * - inherits [Typography API](https://mui.com/material-ui/api/typography/) */ declare const TimelineOppositeContent: (( props: TimelineOppositeContentProps, diff --git a/packages/mui-lab/src/TimelineSeparator/TimelineSeparator.d.ts b/packages/mui-lab/src/TimelineSeparator/TimelineSeparator.d.ts index 424609c1a2cef0..3f5b950647e812 100644 --- a/packages/mui-lab/src/TimelineSeparator/TimelineSeparator.d.ts +++ b/packages/mui-lab/src/TimelineSeparator/TimelineSeparator.d.ts @@ -24,10 +24,10 @@ export interface TimelineSeparatorProps * * Demos: * - * - [Timeline](https://next.mui.com/material-ui/react-timeline/) + * - [Timeline](https://mui.com/material-ui/react-timeline/) * * API: * - * - [TimelineSeparator API](https://next.mui.com/material-ui/api/timeline-separator/) + * - [TimelineSeparator API](https://mui.com/material-ui/api/timeline-separator/) */ export default function TimelineSeparator(props: TimelineSeparatorProps): React.JSX.Element; diff --git a/packages/mui-material-nextjs/package.json b/packages/mui-material-nextjs/package.json index ca27bd96e9859d..ec24fb80468f2d 100644 --- a/packages/mui-material-nextjs/package.json +++ b/packages/mui-material-nextjs/package.json @@ -1,6 +1,6 @@ { "name": "@mui/material-nextjs", - "version": "6.0.0-beta.6", + "version": "6.0.2", "private": false, "author": "MUI Team", "description": "Collection of utilities for integration between Material UI and Next.js.", @@ -40,10 +40,10 @@ }, "devDependencies": { "@emotion/cache": "^11.13.1", - "@emotion/react": "^11.13.0", + "@emotion/react": "^11.13.3", "@emotion/server": "^11.11.0", - "@types/react": "^18.3.3", - "next": "14.2.5", + "@types/react": "^18.3.4", + "next": "14.2.8", "react": "^18.3.1" }, "peerDependencies": { diff --git a/packages/mui-material-pigment-css/package.json b/packages/mui-material-pigment-css/package.json index 5f46d42ed4b48a..85f7afb4121dd6 100644 --- a/packages/mui-material-pigment-css/package.json +++ b/packages/mui-material-pigment-css/package.json @@ -1,6 +1,6 @@ { "name": "@mui/material-pigment-css", - "version": "6.0.0-beta.6", + "version": "6.0.2", "author": "MUI Team", "description": "A wrapper over Pigment CSS that provides the same styled and theming APIs as Material UI.", "main": "./src/index.ts", @@ -39,8 +39,9 @@ "typescript:module-augmentation": "node scripts/testModuleAugmentation.js" }, "dependencies": { + "@babel/runtime": "^7.25.0", "@mui/system": "workspace:*", - "@pigment-css/react": "0.0.20" + "@pigment-css/react": "0.0.22" }, "sideEffects": false, "publishConfig": { diff --git a/packages/mui-material-pigment-css/src/RtlProvider/RtlProvider.ts b/packages/mui-material-pigment-css/src/RtlProvider/RtlProvider.ts index 414accd84a8c00..72e2fd5e9680aa 100644 --- a/packages/mui-material-pigment-css/src/RtlProvider/RtlProvider.ts +++ b/packages/mui-material-pigment-css/src/RtlProvider/RtlProvider.ts @@ -1,3 +1 @@ -'use client'; - export * from '@mui/system/RtlProvider'; diff --git a/packages/mui-material/README.md b/packages/mui-material/README.md index 9e5719c35d785b..34e330856d367c 100644 --- a/packages/mui-material/README.md +++ b/packages/mui-material/README.md @@ -14,7 +14,7 @@ Install the package in your project directory with: <!-- #default-branch-switch --> ```bash -npm install @mui/material@next @emotion/react @emotion/styled +npm install @mui/material @emotion/react @emotion/styled ``` ## Documentation diff --git a/packages/mui-material/package.json b/packages/mui-material/package.json index 13dc98cb5b2d2e..e566ee645c0e38 100644 --- a/packages/mui-material/package.json +++ b/packages/mui-material/package.json @@ -1,6 +1,6 @@ { "name": "@mui/material", - "version": "6.0.0-beta.6", + "version": "6.0.2", "private": false, "author": "MUI Team", "description": "Material UI is an open-source React component library that implements Google's Material Design. It's comprehensive and can be used in production out of the box.", @@ -42,9 +42,9 @@ "dependencies": { "@babel/runtime": "^7.25.0", "@mui/core-downloads-tracker": "workspace:^", - "@mui/system": "workspace:*", + "@mui/system": "workspace:^", "@mui/types": "workspace:^", - "@mui/utils": "workspace:*", + "@mui/utils": "workspace:^", "@popperjs/core": "^2.11.8", "@types/react-transition-group": "^4.4.11", "clsx": "^2.1.1", @@ -58,9 +58,9 @@ "@mui/internal-test-utils": "workspace:^", "@testing-library/dom": "^10.4.0", "@testing-library/user-event": "^14.5.2", - "@types/chai": "^4.3.17", + "@types/chai": "^4.3.19", "@types/prop-types": "^15.7.12", - "@types/react": "^18.3.3", + "@types/react": "^18.3.4", "@types/react-dom": "^18.3.0", "@types/sinon": "^17.0.3", "chai": "^4.5.0", @@ -72,7 +72,7 @@ "react": "^18.3.1", "react-dom": "^18.3.1", "react-router-dom": "^6.26.1", - "sinon": "^16.1.3" + "sinon": "^18.0.0" }, "peerDependencies": { "@emotion/react": "^11.5.0", diff --git a/packages/mui-material/src/Accordion/Accordion.d.ts b/packages/mui-material/src/Accordion/Accordion.d.ts index c1f207ffa6df15..0956a67a00f033 100644 --- a/packages/mui-material/src/Accordion/Accordion.d.ts +++ b/packages/mui-material/src/Accordion/Accordion.d.ts @@ -12,14 +12,14 @@ export interface AccordionSlots { * The component that renders the heading. * @default 'h3' */ - heading?: React.ElementType; + heading: React.ElementType; /** * The component that renders the transition. - * [Follow this guide](/material-ui/transitions/#transitioncomponent-prop) to learn more about the requirements for this component. + * [Follow this guide](https://mui.com/material-ui/transitions/#transitioncomponent-prop) to learn more about the requirements for this component. * @default Collapse */ - transition?: React.JSXElementConstructor< - TransitionProps & { children?: React.ReactElement<any, any> } + transition: React.JSXElementConstructor< + TransitionProps & { children?: React.ReactElement<unknown, any> } >; } @@ -89,10 +89,10 @@ export type AccordionTypeMap< sx?: SxProps<Theme>; /** * The component used for the transition. - * [Follow this guide](/material-ui/transitions/#transitioncomponent-prop) to learn more about the requirements for this component. + * [Follow this guide](https://mui.com/material-ui/transitions/#transitioncomponent-prop) to learn more about the requirements for this component. */ TransitionComponent?: React.JSXElementConstructor< - TransitionProps & { children?: React.ReactElement<any, any> } + TransitionProps & { children?: React.ReactElement<unknown, any> } >; /** * Props applied to the transition element. @@ -109,12 +109,12 @@ export type AccordionTypeMap< * * Demos: * - * - [Accordion](https://next.mui.com/material-ui/react-accordion/) + * - [Accordion](https://mui.com/material-ui/react-accordion/) * * API: * - * - [Accordion API](https://next.mui.com/material-ui/api/accordion/) - * - inherits [Paper API](https://next.mui.com/material-ui/api/paper/) + * - [Accordion API](https://mui.com/material-ui/api/accordion/) + * - inherits [Paper API](https://mui.com/material-ui/api/paper/) */ declare const Accordion: OverridableComponent<AccordionTypeMap>; diff --git a/packages/mui-material/src/Accordion/Accordion.js b/packages/mui-material/src/Accordion/Accordion.js index 79c23f08b744d4..fd74ca6f342d29 100644 --- a/packages/mui-material/src/Accordion/Accordion.js +++ b/packages/mui-material/src/Accordion/Accordion.js @@ -321,7 +321,7 @@ Accordion.propTypes /* remove-proptypes */ = { ]), /** * The component used for the transition. - * [Follow this guide](/material-ui/transitions/#transitioncomponent-prop) to learn more about the requirements for this component. + * [Follow this guide](https://mui.com/material-ui/transitions/#transitioncomponent-prop) to learn more about the requirements for this component. */ TransitionComponent: PropTypes.elementType, /** diff --git a/packages/mui-material/src/AccordionActions/AccordionActions.d.ts b/packages/mui-material/src/AccordionActions/AccordionActions.d.ts index ecf3efa0649aea..39c13ee770255f 100644 --- a/packages/mui-material/src/AccordionActions/AccordionActions.d.ts +++ b/packages/mui-material/src/AccordionActions/AccordionActions.d.ts @@ -27,10 +27,10 @@ export interface AccordionActionsProps extends StandardProps<React.HTMLAttribute * * Demos: * - * - [Accordion](https://next.mui.com/material-ui/react-accordion/) + * - [Accordion](https://mui.com/material-ui/react-accordion/) * * API: * - * - [AccordionActions API](https://next.mui.com/material-ui/api/accordion-actions/) + * - [AccordionActions API](https://mui.com/material-ui/api/accordion-actions/) */ export default function AccordionActions(props: AccordionActionsProps): React.JSX.Element; diff --git a/packages/mui-material/src/AccordionDetails/AccordionDetails.d.ts b/packages/mui-material/src/AccordionDetails/AccordionDetails.d.ts index 92c1f76f8ad1fb..b03bca28434607 100644 --- a/packages/mui-material/src/AccordionDetails/AccordionDetails.d.ts +++ b/packages/mui-material/src/AccordionDetails/AccordionDetails.d.ts @@ -22,10 +22,10 @@ export interface AccordionDetailsProps extends StandardProps<React.HTMLAttribute * * Demos: * - * - [Accordion](https://next.mui.com/material-ui/react-accordion/) + * - [Accordion](https://mui.com/material-ui/react-accordion/) * * API: * - * - [AccordionDetails API](https://next.mui.com/material-ui/api/accordion-details/) + * - [AccordionDetails API](https://mui.com/material-ui/api/accordion-details/) */ export default function AccordionDetails(props: AccordionDetailsProps): React.JSX.Element; diff --git a/packages/mui-material/src/AccordionSummary/AccordionSummary.d.ts b/packages/mui-material/src/AccordionSummary/AccordionSummary.d.ts index 66af85dc942aaf..daeca9e2d9b184 100644 --- a/packages/mui-material/src/AccordionSummary/AccordionSummary.d.ts +++ b/packages/mui-material/src/AccordionSummary/AccordionSummary.d.ts @@ -36,12 +36,12 @@ export type AccordionSummaryTypeMap< * * Demos: * - * - [Accordion](https://next.mui.com/material-ui/react-accordion/) + * - [Accordion](https://mui.com/material-ui/react-accordion/) * * API: * - * - [AccordionSummary API](https://next.mui.com/material-ui/api/accordion-summary/) - * - inherits [ButtonBase API](https://next.mui.com/material-ui/api/button-base/) + * - [AccordionSummary API](https://mui.com/material-ui/api/accordion-summary/) + * - inherits [ButtonBase API](https://mui.com/material-ui/api/button-base/) */ declare const AccordionSummary: ExtendButtonBase<AccordionSummaryTypeMap>; diff --git a/packages/mui-material/src/Alert/Alert.d.ts b/packages/mui-material/src/Alert/Alert.d.ts index 8ff5a1a81e579d..2bbaf416f28055 100644 --- a/packages/mui-material/src/Alert/Alert.d.ts +++ b/packages/mui-material/src/Alert/Alert.d.ts @@ -18,12 +18,12 @@ export interface AlertSlots { * The component that renders the close button. * @default IconButton */ - closeButton?: React.ElementType; + closeButton: React.ElementType; /** * The component that renders the close icon. * @default svg */ - closeIcon?: React.ElementType; + closeIcon: React.ElementType; } export type AlertSlotsAndSlotProps = CreateSlotsAndSlotProps< @@ -54,7 +54,7 @@ export interface AlertProps extends StandardProps<PaperProps, 'variant'>, AlertS /** * Override the default label for the *close popup* icon button. * - * For localization purposes, you can use the provided [translations](/material-ui/guides/localization/). + * For localization purposes, you can use the provided [translations](https://mui.com/material-ui/guides/localization/). * @default 'Close' */ closeText?: string; @@ -67,7 +67,7 @@ export interface AlertProps extends StandardProps<PaperProps, 'variant'>, AlertS /** * The components used for each slot inside. * - * @deprecated use the `slots` prop instead. This prop will be removed in v7. See [Migrating from deprecated APIs](/material-ui/migration/migrating-from-deprecated-apis/) for more details. + * @deprecated use the `slots` prop instead. This prop will be removed in v7. See [Migrating from deprecated APIs](https://mui.com/material-ui/migration/migrating-from-deprecated-apis/) for more details. * * @default {} */ @@ -79,7 +79,7 @@ export interface AlertProps extends StandardProps<PaperProps, 'variant'>, AlertS * The extra props for the slot components. * You can override the existing props or add new ones. * - * @deprecated use the `slotProps` prop instead. This prop will be removed in v7. See [Migrating from deprecated APIs](/material-ui/migration/migrating-from-deprecated-apis/) for more details. + * @deprecated use the `slotProps` prop instead. This prop will be removed in v7. See [Migrating from deprecated APIs](https://mui.com/material-ui/migration/migrating-from-deprecated-apis/) for more details. * * @default {} */ @@ -135,11 +135,11 @@ export interface AlertOwnerState extends AlertProps {} * * Demos: * - * - [Alert](https://next.mui.com/material-ui/react-alert/) + * - [Alert](https://mui.com/material-ui/react-alert/) * * API: * - * - [Alert API](https://next.mui.com/material-ui/api/alert/) - * - inherits [Paper API](https://next.mui.com/material-ui/api/paper/) + * - [Alert API](https://mui.com/material-ui/api/alert/) + * - inherits [Paper API](https://mui.com/material-ui/api/paper/) */ export default function Alert(props: AlertProps): React.JSX.Element; diff --git a/packages/mui-material/src/Alert/Alert.js b/packages/mui-material/src/Alert/Alert.js index 5896dac9ee30c3..62b0778a7010e6 100644 --- a/packages/mui-material/src/Alert/Alert.js +++ b/packages/mui-material/src/Alert/Alert.js @@ -277,7 +277,7 @@ Alert.propTypes /* remove-proptypes */ = { /** * Override the default label for the *close popup* icon button. * - * For localization purposes, you can use the provided [translations](/material-ui/guides/localization/). + * For localization purposes, you can use the provided [translations](https://mui.com/material-ui/guides/localization/). * @default 'Close' */ closeText: PropTypes.string, @@ -293,7 +293,7 @@ Alert.propTypes /* remove-proptypes */ = { /** * The components used for each slot inside. * - * @deprecated use the `slots` prop instead. This prop will be removed in v7. See [Migrating from deprecated APIs](/material-ui/migration/migrating-from-deprecated-apis/) for more details. + * @deprecated use the `slots` prop instead. This prop will be removed in v7. See [Migrating from deprecated APIs](https://mui.com/material-ui/migration/migrating-from-deprecated-apis/) for more details. * * @default {} */ @@ -305,7 +305,7 @@ Alert.propTypes /* remove-proptypes */ = { * The extra props for the slot components. * You can override the existing props or add new ones. * - * @deprecated use the `slotProps` prop instead. This prop will be removed in v7. See [Migrating from deprecated APIs](/material-ui/migration/migrating-from-deprecated-apis/) for more details. + * @deprecated use the `slotProps` prop instead. This prop will be removed in v7. See [Migrating from deprecated APIs](https://mui.com/material-ui/migration/migrating-from-deprecated-apis/) for more details. * * @default {} */ diff --git a/packages/mui-material/src/Alert/index.js b/packages/mui-material/src/Alert/index.js index c978509837fd40..ae354db3f6bcac 100644 --- a/packages/mui-material/src/Alert/index.js +++ b/packages/mui-material/src/Alert/index.js @@ -1,4 +1,3 @@ -'use client'; export { default } from './Alert'; export { default as alertClasses } from './alertClasses'; diff --git a/packages/mui-material/src/AlertTitle/AlertTitle.d.ts b/packages/mui-material/src/AlertTitle/AlertTitle.d.ts index 8d98cc8d3541bd..f85b125962f08c 100644 --- a/packages/mui-material/src/AlertTitle/AlertTitle.d.ts +++ b/packages/mui-material/src/AlertTitle/AlertTitle.d.ts @@ -22,11 +22,11 @@ export interface AlertTitleProps extends TypographyProps<'div'> { * * Demos: * - * - [Alert](https://next.mui.com/material-ui/react-alert/) + * - [Alert](https://mui.com/material-ui/react-alert/) * * API: * - * - [AlertTitle API](https://next.mui.com/material-ui/api/alert-title/) - * - inherits [Typography API](https://next.mui.com/material-ui/api/typography/) + * - [AlertTitle API](https://mui.com/material-ui/api/alert-title/) + * - inherits [Typography API](https://mui.com/material-ui/api/typography/) */ export default function AlertTitle(props: AlertTitleProps): React.JSX.Element; diff --git a/packages/mui-material/src/AlertTitle/index.js b/packages/mui-material/src/AlertTitle/index.js index 88dfd77e0aa3fb..a8d06452a44bfa 100644 --- a/packages/mui-material/src/AlertTitle/index.js +++ b/packages/mui-material/src/AlertTitle/index.js @@ -1,4 +1,3 @@ -'use client'; export { default } from './AlertTitle'; export { default as alertTitleClasses } from './alertTitleClasses'; diff --git a/packages/mui-material/src/AppBar/AppBar.d.ts b/packages/mui-material/src/AppBar/AppBar.d.ts index 20ea34e1377e6a..db9f4c75fbcee9 100644 --- a/packages/mui-material/src/AppBar/AppBar.d.ts +++ b/packages/mui-material/src/AppBar/AppBar.d.ts @@ -56,12 +56,12 @@ export type AppBarTypeMap< * * Demos: * - * - [App Bar](https://next.mui.com/material-ui/react-app-bar/) + * - [App Bar](https://mui.com/material-ui/react-app-bar/) * * API: * - * - [AppBar API](https://next.mui.com/material-ui/api/app-bar/) - * - inherits [Paper API](https://next.mui.com/material-ui/api/paper/) + * - [AppBar API](https://mui.com/material-ui/api/app-bar/) + * - inherits [Paper API](https://mui.com/material-ui/api/paper/) */ declare const AppBar: OverridableComponent<AppBarTypeMap>; diff --git a/packages/mui-material/src/AppBar/index.js b/packages/mui-material/src/AppBar/index.js index 117d47f9047283..d1102ae64ed7c5 100644 --- a/packages/mui-material/src/AppBar/index.js +++ b/packages/mui-material/src/AppBar/index.js @@ -1,4 +1,3 @@ -'use client'; export { default } from './AppBar'; export { default as appBarClasses } from './appBarClasses'; diff --git a/packages/mui-material/src/Autocomplete/Autocomplete.d.ts b/packages/mui-material/src/Autocomplete/Autocomplete.d.ts index da407dc51dc891..5a3fbc86bcc4f8 100644 --- a/packages/mui-material/src/Autocomplete/Autocomplete.d.ts +++ b/packages/mui-material/src/Autocomplete/Autocomplete.d.ts @@ -18,6 +18,9 @@ import useAutocomplete, { import { AutocompleteClasses } from './autocompleteClasses'; import { CreateSlotsAndSlotProps, SlotProps } from '../utils/types'; +export interface AutocompletePaperSlotPropsOverrides {} +export interface AutocompletePopperSlotPropsOverrides {} + export { AutocompleteChangeDetails, AutocompleteChangeReason, @@ -89,17 +92,17 @@ export interface AutocompleteSlots { * The component used to render the listbox. * @default 'ul' */ - listbox?: React.JSXElementConstructor<React.HTMLAttributes<HTMLElement>>; + listbox: React.JSXElementConstructor<React.HTMLAttributes<HTMLElement>>; /** * The component used to render the body of the popup. * @default Paper */ - paper?: React.JSXElementConstructor<PaperProps>; + paper: React.JSXElementConstructor<PaperProps & AutocompletePaperSlotPropsOverrides>; /** * The component used to position the popup. * @default Popper */ - popper?: React.JSXElementConstructor<PopperProps>; + popper: React.JSXElementConstructor<PopperProps & AutocompletePopperSlotPropsOverrides>; } export type AutocompleteSlotsAndSlotProps< @@ -134,15 +137,14 @@ export type AutocompleteSlotsAndSlotProps< {}, AutocompleteOwnerState<Value, Multiple, DisableClearable, FreeSolo, ChipComponent> >; - paper: SlotProps< React.ElementType<Partial<PaperProps>>, - {}, + AutocompletePaperSlotPropsOverrides, AutocompleteOwnerState<Value, Multiple, DisableClearable, FreeSolo, ChipComponent> >; popper: SlotProps< React.ElementType<Partial<PopperProps>>, - {}, + AutocompletePopperSlotPropsOverrides, AutocompleteOwnerState<Value, Multiple, DisableClearable, FreeSolo, ChipComponent> >; popupIndicator: SlotProps< @@ -163,7 +165,7 @@ export interface AutocompleteProps< StandardProps<React.HTMLAttributes<HTMLDivElement>, 'defaultValue' | 'onChange' | 'children'>, AutocompleteSlotsAndSlotProps<Value, Multiple, DisableClearable, FreeSolo, ChipComponent> { /** - * Props applied to the [`Chip`](/material-ui/api/chip/) element. + * Props applied to the [`Chip`](https://mui.com/material-ui/api/chip/) element. */ ChipProps?: ChipProps<ChipComponent>; /** @@ -178,20 +180,20 @@ export interface AutocompleteProps< /** * Override the default text for the *clear* icon button. * - * For localization purposes, you can use the provided [translations](/material-ui/guides/localization/). + * For localization purposes, you can use the provided [translations](https://mui.com/material-ui/guides/localization/). * @default 'Clear' */ clearText?: string; /** * Override the default text for the *close popup* icon button. * - * For localization purposes, you can use the provided [translations](/material-ui/guides/localization/). + * For localization purposes, you can use the provided [translations](https://mui.com/material-ui/guides/localization/). * @default 'Close' */ closeText?: string; /** * The props used for each slot inside. - * @deprecated Use the `slotProps` prop instead. This prop will be removed in v7. See [Migrating from deprecated APIs](/material-ui/migration/migrating-from-deprecated-apis/) for more details. + * @deprecated Use the `slotProps` prop instead. This prop will be removed in v7. See [Migrating from deprecated APIs](https://mui.com/material-ui/migration/migrating-from-deprecated-apis/) for more details. */ componentsProps?: { clearIndicator?: Partial<IconButtonProps>; @@ -248,7 +250,7 @@ export interface AutocompleteProps< /** * Text to display when in a loading state. * - * For localization purposes, you can use the provided [translations](/material-ui/guides/localization/). + * For localization purposes, you can use the provided [translations](https://mui.com/material-ui/guides/localization/). * @default 'Loading…' */ loadingText?: React.ReactNode; @@ -261,7 +263,7 @@ export interface AutocompleteProps< /** * Text to display when there are no options. * - * For localization purposes, you can use the provided [translations](/material-ui/guides/localization/). + * For localization purposes, you can use the provided [translations](https://mui.com/material-ui/guides/localization/). * @default 'No options' */ noOptionsText?: React.ReactNode; @@ -271,7 +273,7 @@ export interface AutocompleteProps< /** * Override the default text for the *open popup* icon button. * - * For localization purposes, you can use the provided [translations](/material-ui/guides/localization/). + * For localization purposes, you can use the provided [translations](https://mui.com/material-ui/guides/localization/). * @default 'Open' */ openText?: string; @@ -352,11 +354,11 @@ export interface AutocompleteProps< * * Demos: * - * - [Autocomplete](https://next.mui.com/material-ui/react-autocomplete/) + * - [Autocomplete](https://mui.com/material-ui/react-autocomplete/) * * API: * - * - [Autocomplete API](https://next.mui.com/material-ui/api/autocomplete/) + * - [Autocomplete API](https://mui.com/material-ui/api/autocomplete/) */ export default function Autocomplete< Value, diff --git a/packages/mui-material/src/Autocomplete/Autocomplete.js b/packages/mui-material/src/Autocomplete/Autocomplete.js index db5d2b1b7cf9b9..ff9c76c45b5b0d 100644 --- a/packages/mui-material/src/Autocomplete/Autocomplete.js +++ b/packages/mui-material/src/Autocomplete/Autocomplete.js @@ -826,7 +826,7 @@ Autocomplete.propTypes /* remove-proptypes */ = { */ blurOnSelect: PropTypes.oneOfType([PropTypes.oneOf(['mouse', 'touch']), PropTypes.bool]), /** - * Props applied to the [`Chip`](/material-ui/api/chip/) element. + * Props applied to the [`Chip`](https://mui.com/material-ui/api/chip/) element. */ ChipProps: PropTypes.object, /** @@ -858,20 +858,20 @@ Autocomplete.propTypes /* remove-proptypes */ = { /** * Override the default text for the *clear* icon button. * - * For localization purposes, you can use the provided [translations](/material-ui/guides/localization/). + * For localization purposes, you can use the provided [translations](https://mui.com/material-ui/guides/localization/). * @default 'Clear' */ clearText: PropTypes.string, /** * Override the default text for the *close popup* icon button. * - * For localization purposes, you can use the provided [translations](/material-ui/guides/localization/). + * For localization purposes, you can use the provided [translations](https://mui.com/material-ui/guides/localization/). * @default 'Close' */ closeText: PropTypes.string, /** * The props used for each slot inside. - * @deprecated Use the `slotProps` prop instead. This prop will be removed in v7. See [Migrating from deprecated APIs](/material-ui/migration/migrating-from-deprecated-apis/) for more details. + * @deprecated Use the `slotProps` prop instead. This prop will be removed in v7. See [Migrating from deprecated APIs](https://mui.com/material-ui/migration/migrating-from-deprecated-apis/) for more details. */ componentsProps: PropTypes.shape({ clearIndicator: PropTypes.object, @@ -1049,7 +1049,7 @@ Autocomplete.propTypes /* remove-proptypes */ = { /** * Text to display when in a loading state. * - * For localization purposes, you can use the provided [translations](/material-ui/guides/localization/). + * For localization purposes, you can use the provided [translations](https://mui.com/material-ui/guides/localization/). * @default 'Loading…' */ loadingText: PropTypes.node, @@ -1061,7 +1061,7 @@ Autocomplete.propTypes /* remove-proptypes */ = { /** * Text to display when there are no options. * - * For localization purposes, you can use the provided [translations](/material-ui/guides/localization/). + * For localization purposes, you can use the provided [translations](https://mui.com/material-ui/guides/localization/). * @default 'No options' */ noOptionsText: PropTypes.node, @@ -1121,7 +1121,7 @@ Autocomplete.propTypes /* remove-proptypes */ = { /** * Override the default text for the *open popup* icon button. * - * For localization purposes, you can use the provided [translations](/material-ui/guides/localization/). + * For localization purposes, you can use the provided [translations](https://mui.com/material-ui/guides/localization/). * @default 'Open' */ openText: PropTypes.string, diff --git a/packages/mui-material/src/Autocomplete/index.js b/packages/mui-material/src/Autocomplete/index.js index e57635491208e4..bc2577ca4c03c3 100644 --- a/packages/mui-material/src/Autocomplete/index.js +++ b/packages/mui-material/src/Autocomplete/index.js @@ -1,4 +1,3 @@ -'use client'; export { default, createFilterOptions } from './Autocomplete'; export { default as autocompleteClasses } from './autocompleteClasses'; diff --git a/packages/mui-material/src/Avatar/Avatar.d.ts b/packages/mui-material/src/Avatar/Avatar.d.ts index 4ece9bebc8282f..804b4c6c7656db 100644 --- a/packages/mui-material/src/Avatar/Avatar.d.ts +++ b/packages/mui-material/src/Avatar/Avatar.d.ts @@ -9,10 +9,10 @@ import { CreateSlotsAndSlotProps, SlotProps } from '../utils/types'; export interface AvatarSlots { /** * The component that renders the transition. - * [Follow this guide](/material-ui/transitions/#transitioncomponent-prop) to learn more about the requirements for this component. + * [Follow this guide](https://mui.com/material-ui/transitions/#transitioncomponent-prop) to learn more about the requirements for this component. * @default Collapse */ - img?: React.JSXElementConstructor<React.ImgHTMLAttributes<HTMLImageElement>>; + img: React.JSXElementConstructor<React.ImgHTMLAttributes<HTMLImageElement>>; } export interface AvatarPropsVariantOverrides {} @@ -86,11 +86,11 @@ export interface AvatarTypeMap< * * Demos: * - * - [Avatar](https://next.mui.com/material-ui/react-avatar/) + * - [Avatar](https://mui.com/material-ui/react-avatar/) * * API: * - * - [Avatar API](https://next.mui.com/material-ui/api/avatar/) + * - [Avatar API](https://mui.com/material-ui/api/avatar/) */ declare const Avatar: OverridableComponent<AvatarTypeMap>; diff --git a/packages/mui-material/src/Avatar/index.js b/packages/mui-material/src/Avatar/index.js index 7343e9915fb2b8..08248f841869fb 100644 --- a/packages/mui-material/src/Avatar/index.js +++ b/packages/mui-material/src/Avatar/index.js @@ -1,4 +1,3 @@ -'use client'; export { default } from './Avatar'; export { default as avatarClasses } from './avatarClasses'; diff --git a/packages/mui-material/src/AvatarGroup/AvatarGroup.d.ts b/packages/mui-material/src/AvatarGroup/AvatarGroup.d.ts index 640bf2a4386c51..314c87451218b7 100644 --- a/packages/mui-material/src/AvatarGroup/AvatarGroup.d.ts +++ b/packages/mui-material/src/AvatarGroup/AvatarGroup.d.ts @@ -16,14 +16,14 @@ export interface AvatarGroupPropsVariantOverrides {} export interface AvatarGroupComponentsPropsOverrides {} export interface AvatarGroupSlots { - surplus?: React.ElementType; + surplus: React.ElementType; } export type AvatarGroupSlotsAndSlotProps = CreateSlotsAndSlotProps< AvatarGroupSlots, { /** - * @deprecated use `slotProps.surplus` instead. This prop will be removed in v7. See [Migrating from deprecated APIs](/material-ui/migration/migrating-from-deprecated-apis/) for more details. + * @deprecated use `slotProps.surplus` instead. This prop will be removed in v7. See [Migrating from deprecated APIs](https://mui.com/material-ui/migration/migrating-from-deprecated-apis/) for more details. * */ additionalAvatar: React.ComponentPropsWithRef<typeof Avatar> & AvatarGroupComponentsPropsOverrides; @@ -54,7 +54,7 @@ export interface AvatarGroupOwnProps extends AvatarGroupSlotsAndSlotProps { * * This prop is an alias for the `slotProps` prop. * - * @deprecated use the `slotProps` prop instead. This prop will be removed in v7. See [Migrating from deprecated APIs](/material-ui/migration/migrating-from-deprecated-apis/) for more details. + * @deprecated use the `slotProps` prop instead. This prop will be removed in v7. See [Migrating from deprecated APIs](https://mui.com/material-ui/migration/migrating-from-deprecated-apis/) for more details. */ componentsProps?: { additionalAvatar?: React.ComponentPropsWithRef<typeof Avatar> & @@ -107,11 +107,11 @@ export interface AvatarGroupTypeMap< * * Demos: * - * - [Avatar](https://next.mui.com/material-ui/react-avatar/) + * - [Avatar](https://mui.com/material-ui/react-avatar/) * * API: * - * - [AvatarGroup API](https://next.mui.com/material-ui/api/avatar-group/) + * - [AvatarGroup API](https://mui.com/material-ui/api/avatar-group/) */ declare const AvatarGroup: OverridableComponent<AvatarGroupTypeMap>; diff --git a/packages/mui-material/src/AvatarGroup/AvatarGroup.js b/packages/mui-material/src/AvatarGroup/AvatarGroup.js index 48bded04532dde..7d07c1868d9a85 100644 --- a/packages/mui-material/src/AvatarGroup/AvatarGroup.js +++ b/packages/mui-material/src/AvatarGroup/AvatarGroup.js @@ -187,7 +187,7 @@ AvatarGroup.propTypes /* remove-proptypes */ = { * * This prop is an alias for the `slotProps` prop. * - * @deprecated use the `slotProps` prop instead. This prop will be removed in v7. See [Migrating from deprecated APIs](/material-ui/migration/migrating-from-deprecated-apis/) for more details. + * @deprecated use the `slotProps` prop instead. This prop will be removed in v7. See [Migrating from deprecated APIs](https://mui.com/material-ui/migration/migrating-from-deprecated-apis/) for more details. */ componentsProps: PropTypes.shape({ additionalAvatar: PropTypes.object, diff --git a/packages/mui-material/src/AvatarGroup/index.js b/packages/mui-material/src/AvatarGroup/index.js index 16930c7dc05548..d3a39cb2673cf5 100644 --- a/packages/mui-material/src/AvatarGroup/index.js +++ b/packages/mui-material/src/AvatarGroup/index.js @@ -1,4 +1,3 @@ -'use client'; export { default } from './AvatarGroup'; export { default as avatarGroupClasses } from './avatarGroupClasses'; export * from './avatarGroupClasses'; diff --git a/packages/mui-material/src/Backdrop/Backdrop.d.ts b/packages/mui-material/src/Backdrop/Backdrop.d.ts index 699948790dbf10..54c522613c0a47 100644 --- a/packages/mui-material/src/Backdrop/Backdrop.d.ts +++ b/packages/mui-material/src/Backdrop/Backdrop.d.ts @@ -12,14 +12,14 @@ export interface BackdropSlots { * The component that renders the root. * @default 'div' */ - root?: React.ElementType; + root: React.ElementType; /** * The component that renders the transition. - * [Follow this guide](/material-ui/transitions/#transitioncomponent-prop) to learn more about the requirements for this component. + * [Follow this guide](https://mui.com/material-ui/transitions/#transitioncomponent-prop) to learn more about the requirements for this component. * @default Fade */ - transition?: React.JSXElementConstructor< - TransitionProps & { children: React.ReactElement<any, any> } + transition: React.JSXElementConstructor< + TransitionProps & { children: React.ReactElement<unknown, any> } >; } export interface BackdropComponentsPropsOverrides {} @@ -52,7 +52,7 @@ export interface BackdropOwnProps /** * The components used for each slot inside. * - * @deprecated Use the `slots` prop instead. This prop will be removed in v7. See [Migrating from deprecated APIs](/material-ui/migration/migrating-from-deprecated-apis/) for more details. + * @deprecated Use the `slots` prop instead. This prop will be removed in v7. See [Migrating from deprecated APIs](https://mui.com/material-ui/migration/migrating-from-deprecated-apis/) for more details. * * @default {} */ @@ -63,7 +63,7 @@ export interface BackdropOwnProps * The extra props for the slot components. * You can override the existing props or add new ones. * - * @deprecated Use the `slotProps` prop instead. This prop will be removed in v7. See [Migrating from deprecated APIs](/material-ui/migration/migrating-from-deprecated-apis/) for more details. + * @deprecated Use the `slotProps` prop instead. This prop will be removed in v7. See [Migrating from deprecated APIs](https://mui.com/material-ui/migration/migrating-from-deprecated-apis/) for more details. * * @default {} */ @@ -95,12 +95,12 @@ export interface BackdropOwnProps transitionDuration?: TransitionProps['timeout']; /** * The component used for the transition. - * [Follow this guide](/material-ui/transitions/#transitioncomponent-prop) to learn more about the requirements for this component. + * [Follow this guide](https://mui.com/material-ui/transitions/#transitioncomponent-prop) to learn more about the requirements for this component. * @default Fade */ TransitionComponent?: React.JSXElementConstructor< TransitionProps & { - children: React.ReactElement<any, any>; + children: React.ReactElement<unknown, any>; } >; } @@ -121,12 +121,12 @@ export declare const BackdropRoot: React.FC<BackdropRootProps>; * * Demos: * - * - [Backdrop](https://next.mui.com/material-ui/react-backdrop/) + * - [Backdrop](https://mui.com/material-ui/react-backdrop/) * * API: * - * - [Backdrop API](https://next.mui.com/material-ui/api/backdrop/) - * - inherits [Fade API](https://next.mui.com/material-ui/api/fade/) + * - [Backdrop API](https://mui.com/material-ui/api/backdrop/) + * - inherits [Fade API](https://mui.com/material-ui/api/fade/) */ declare const Backdrop: OverridableComponent<BackdropTypeMap>; diff --git a/packages/mui-material/src/Backdrop/Backdrop.js b/packages/mui-material/src/Backdrop/Backdrop.js index 49cdf89ea186d7..3d5b74a543dba3 100644 --- a/packages/mui-material/src/Backdrop/Backdrop.js +++ b/packages/mui-material/src/Backdrop/Backdrop.js @@ -133,7 +133,7 @@ Backdrop.propTypes /* remove-proptypes */ = { /** * The components used for each slot inside. * - * @deprecated Use the `slots` prop instead. This prop will be removed in v7. See [Migrating from deprecated APIs](/material-ui/migration/migrating-from-deprecated-apis/) for more details. + * @deprecated Use the `slots` prop instead. This prop will be removed in v7. See [Migrating from deprecated APIs](https://mui.com/material-ui/migration/migrating-from-deprecated-apis/) for more details. * * @default {} */ @@ -144,7 +144,7 @@ Backdrop.propTypes /* remove-proptypes */ = { * The extra props for the slot components. * You can override the existing props or add new ones. * - * @deprecated Use the `slotProps` prop instead. This prop will be removed in v7. See [Migrating from deprecated APIs](/material-ui/migration/migrating-from-deprecated-apis/) for more details. + * @deprecated Use the `slotProps` prop instead. This prop will be removed in v7. See [Migrating from deprecated APIs](https://mui.com/material-ui/migration/migrating-from-deprecated-apis/) for more details. * * @default {} */ @@ -187,7 +187,7 @@ Backdrop.propTypes /* remove-proptypes */ = { ]), /** * The component used for the transition. - * [Follow this guide](/material-ui/transitions/#transitioncomponent-prop) to learn more about the requirements for this component. + * [Follow this guide](https://mui.com/material-ui/transitions/#transitioncomponent-prop) to learn more about the requirements for this component. * @default Fade */ TransitionComponent: PropTypes.elementType, diff --git a/packages/mui-material/src/Backdrop/index.js b/packages/mui-material/src/Backdrop/index.js index 3fe812acfeef22..31e877d1ad425d 100644 --- a/packages/mui-material/src/Backdrop/index.js +++ b/packages/mui-material/src/Backdrop/index.js @@ -1,4 +1,3 @@ -'use client'; export { default } from './Backdrop'; export { default as backdropClasses } from './backdropClasses'; export * from './backdropClasses'; diff --git a/packages/mui-material/src/Badge/Badge.d.ts b/packages/mui-material/src/Badge/Badge.d.ts index fc4f37a095ad14..1d5d0530b160e4 100644 --- a/packages/mui-material/src/Badge/Badge.d.ts +++ b/packages/mui-material/src/Badge/Badge.d.ts @@ -72,7 +72,7 @@ export interface BadgeOwnProps { * The extra props for the slot components. * You can override the existing props or add new ones. * - * @deprecated use the `slotProps` prop instead. This prop will be removed in v7. See [Migrating from deprecated APIs](/material-ui/migration/migrating-from-deprecated-apis/) for more details. + * @deprecated use the `slotProps` prop instead. This prop will be removed in v7. See [Migrating from deprecated APIs](https://mui.com/material-ui/migration/migrating-from-deprecated-apis/) for more details. * * @default {} */ @@ -80,7 +80,7 @@ export interface BadgeOwnProps { /** * The components used for each slot inside. * - * @deprecated use the `slots` prop instead. This prop will be removed in v7. See [Migrating from deprecated APIs](/material-ui/migration/migrating-from-deprecated-apis/) for more details. + * @deprecated use the `slots` prop instead. This prop will be removed in v7. See [Migrating from deprecated APIs](https://mui.com/material-ui/migration/migrating-from-deprecated-apis/) for more details. * * @default {} */ @@ -162,12 +162,12 @@ export declare const BadgeMark: React.FC<BadgeBadgeProps>; * * Demos: * - * - [Avatar](https://next.mui.com/material-ui/react-avatar/) - * - [Badge](https://next.mui.com/material-ui/react-badge/) + * - [Avatar](https://mui.com/material-ui/react-avatar/) + * - [Badge](https://mui.com/material-ui/react-badge/) * * API: * - * - [Badge API](https://next.mui.com/material-ui/api/badge/) + * - [Badge API](https://mui.com/material-ui/api/badge/) */ declare const Badge: OverridableComponent<BadgeTypeMap>; diff --git a/packages/mui-material/src/Badge/Badge.js b/packages/mui-material/src/Badge/Badge.js index c0916458f64175..fdd83890b78167 100644 --- a/packages/mui-material/src/Badge/Badge.js +++ b/packages/mui-material/src/Badge/Badge.js @@ -396,7 +396,7 @@ Badge.propTypes /* remove-proptypes */ = { /** * The components used for each slot inside. * - * @deprecated use the `slots` prop instead. This prop will be removed in v7. See [Migrating from deprecated APIs](/material-ui/migration/migrating-from-deprecated-apis/) for more details. + * @deprecated use the `slots` prop instead. This prop will be removed in v7. See [Migrating from deprecated APIs](https://mui.com/material-ui/migration/migrating-from-deprecated-apis/) for more details. * * @default {} */ @@ -408,7 +408,7 @@ Badge.propTypes /* remove-proptypes */ = { * The extra props for the slot components. * You can override the existing props or add new ones. * - * @deprecated use the `slotProps` prop instead. This prop will be removed in v7. See [Migrating from deprecated APIs](/material-ui/migration/migrating-from-deprecated-apis/) for more details. + * @deprecated use the `slotProps` prop instead. This prop will be removed in v7. See [Migrating from deprecated APIs](https://mui.com/material-ui/migration/migrating-from-deprecated-apis/) for more details. * * @default {} */ diff --git a/packages/mui-material/src/Badge/index.js b/packages/mui-material/src/Badge/index.js index 7ac0cf0142bf01..42f9d0102195b5 100644 --- a/packages/mui-material/src/Badge/index.js +++ b/packages/mui-material/src/Badge/index.js @@ -1,4 +1,3 @@ -'use client'; export { default } from './Badge'; export { default as badgeClasses } from './badgeClasses'; diff --git a/packages/mui-material/src/Badge/useBadge.ts b/packages/mui-material/src/Badge/useBadge.ts index 214f281d084c35..efd0c7ed19e078 100644 --- a/packages/mui-material/src/Badge/useBadge.ts +++ b/packages/mui-material/src/Badge/useBadge.ts @@ -7,11 +7,11 @@ import { UseBadgeParameters, UseBadgeReturnValue } from './useBadge.types'; * * Demos: * - * - [Badge](https://next.mui.com/base-ui/react-badge/#hook) + * - [Badge](https://mui.com/base-ui/react-badge/#hook) * * API: * - * - [useBadge API](https://next.mui.com/base-ui/react-badge/hooks-api/#use-badge) + * - [useBadge API](https://mui.com/base-ui/react-badge/hooks-api/#use-badge) */ function useBadge(parameters: UseBadgeParameters): UseBadgeReturnValue { const { diff --git a/packages/mui-material/src/BottomNavigation/BottomNavigation.d.ts b/packages/mui-material/src/BottomNavigation/BottomNavigation.d.ts index c368a17f087a4b..b335e6e536f47e 100644 --- a/packages/mui-material/src/BottomNavigation/BottomNavigation.d.ts +++ b/packages/mui-material/src/BottomNavigation/BottomNavigation.d.ts @@ -47,11 +47,11 @@ export interface BottomNavigationTypeMap< * * Demos: * - * - [Bottom Navigation](https://next.mui.com/material-ui/react-bottom-navigation/) + * - [Bottom Navigation](https://mui.com/material-ui/react-bottom-navigation/) * * API: * - * - [BottomNavigation API](https://next.mui.com/material-ui/api/bottom-navigation/) + * - [BottomNavigation API](https://mui.com/material-ui/api/bottom-navigation/) */ declare const BottomNavigation: OverridableComponent<BottomNavigationTypeMap>; diff --git a/packages/mui-material/src/BottomNavigation/index.js b/packages/mui-material/src/BottomNavigation/index.js index f9b197b0f72014..e35a344d097b26 100644 --- a/packages/mui-material/src/BottomNavigation/index.js +++ b/packages/mui-material/src/BottomNavigation/index.js @@ -1,4 +1,3 @@ -'use client'; export { default } from './BottomNavigation'; export { default as bottomNavigationClasses } from './bottomNavigationClasses'; diff --git a/packages/mui-material/src/BottomNavigationAction/BottomNavigationAction.d.ts b/packages/mui-material/src/BottomNavigationAction/BottomNavigationAction.d.ts index c52ef2c26ee50c..7b32550d882e61 100644 --- a/packages/mui-material/src/BottomNavigationAction/BottomNavigationAction.d.ts +++ b/packages/mui-material/src/BottomNavigationAction/BottomNavigationAction.d.ts @@ -53,12 +53,12 @@ export type BottomNavigationActionTypeMap< * * Demos: * - * - [Bottom Navigation](https://next.mui.com/material-ui/react-bottom-navigation/) + * - [Bottom Navigation](https://mui.com/material-ui/react-bottom-navigation/) * * API: * - * - [BottomNavigationAction API](https://next.mui.com/material-ui/api/bottom-navigation-action/) - * - inherits [ButtonBase API](https://next.mui.com/material-ui/api/button-base/) + * - [BottomNavigationAction API](https://mui.com/material-ui/api/bottom-navigation-action/) + * - inherits [ButtonBase API](https://mui.com/material-ui/api/button-base/) */ declare const BottomNavigationAction: ExtendButtonBase< BottomNavigationActionTypeMap<{}, ButtonBaseTypeMap['defaultComponent']> diff --git a/packages/mui-material/src/BottomNavigationAction/index.js b/packages/mui-material/src/BottomNavigationAction/index.js index 2cfdda3d675d4e..377af4979d46ac 100644 --- a/packages/mui-material/src/BottomNavigationAction/index.js +++ b/packages/mui-material/src/BottomNavigationAction/index.js @@ -1,4 +1,3 @@ -'use client'; export { default } from './BottomNavigationAction'; export { default as bottomNavigationActionClasses } from './bottomNavigationActionClasses'; diff --git a/packages/mui-material/src/Box/Box.d.ts b/packages/mui-material/src/Box/Box.d.ts index afd25b413442e1..1a9c2df9a80fbf 100644 --- a/packages/mui-material/src/Box/Box.d.ts +++ b/packages/mui-material/src/Box/Box.d.ts @@ -7,11 +7,11 @@ import { Theme as MaterialTheme } from '../styles'; * * Demos: * - * - [Box](https://next.mui.com/material-ui/react-box/) + * - [Box](https://mui.com/material-ui/react-box/) * * API: * - * - [Box API](https://next.mui.com/material-ui/api/box/) + * - [Box API](https://mui.com/material-ui/api/box/) */ declare const Box: OverridableComponent<BoxTypeMap<{}, 'div', MaterialTheme>>; diff --git a/packages/mui-material/src/Box/index.js b/packages/mui-material/src/Box/index.js index 956a444c75c938..fc66543f28f643 100644 --- a/packages/mui-material/src/Box/index.js +++ b/packages/mui-material/src/Box/index.js @@ -1,4 +1,3 @@ -'use client'; export { default } from './Box'; export { default as boxClasses } from './boxClasses'; diff --git a/packages/mui-material/src/Breadcrumbs/Breadcrumbs.d.ts b/packages/mui-material/src/Breadcrumbs/Breadcrumbs.d.ts index 4c58c98f7a7225..66f8e9f0ea71ba 100644 --- a/packages/mui-material/src/Breadcrumbs/Breadcrumbs.d.ts +++ b/packages/mui-material/src/Breadcrumbs/Breadcrumbs.d.ts @@ -47,7 +47,7 @@ export interface BreadcrumbsOwnProps { /** * Override the default label for the expand button. * - * For localization purposes, you can use the provided [translations](/material-ui/guides/localization/). + * For localization purposes, you can use the provided [translations](https://mui.com/material-ui/guides/localization/). * @default 'Show path' */ expandText?: string; @@ -91,12 +91,12 @@ export interface BreadcrumbsTypeMap< * * Demos: * - * - [Breadcrumbs](https://next.mui.com/material-ui/react-breadcrumbs/) + * - [Breadcrumbs](https://mui.com/material-ui/react-breadcrumbs/) * * API: * - * - [Breadcrumbs API](https://next.mui.com/material-ui/api/breadcrumbs/) - * - inherits [Typography API](https://next.mui.com/material-ui/api/typography/) + * - [Breadcrumbs API](https://mui.com/material-ui/api/breadcrumbs/) + * - inherits [Typography API](https://mui.com/material-ui/api/typography/) */ declare const Breadcrumbs: OverridableComponent<BreadcrumbsTypeMap>; diff --git a/packages/mui-material/src/Breadcrumbs/Breadcrumbs.js b/packages/mui-material/src/Breadcrumbs/Breadcrumbs.js index 650644850712ac..016f3516d7a060 100644 --- a/packages/mui-material/src/Breadcrumbs/Breadcrumbs.js +++ b/packages/mui-material/src/Breadcrumbs/Breadcrumbs.js @@ -227,7 +227,7 @@ Breadcrumbs.propTypes /* remove-proptypes */ = { /** * Override the default label for the expand button. * - * For localization purposes, you can use the provided [translations](/material-ui/guides/localization/). + * For localization purposes, you can use the provided [translations](https://mui.com/material-ui/guides/localization/). * @default 'Show path' */ expandText: PropTypes.string, diff --git a/packages/mui-material/src/Breadcrumbs/index.js b/packages/mui-material/src/Breadcrumbs/index.js index bc5f92abb8214b..77829cbf764cab 100644 --- a/packages/mui-material/src/Breadcrumbs/index.js +++ b/packages/mui-material/src/Breadcrumbs/index.js @@ -1,4 +1,3 @@ -'use client'; export { default } from './Breadcrumbs'; export { default as breadcrumbsClasses } from './breadcrumbsClasses'; diff --git a/packages/mui-material/src/Button/Button.d.ts b/packages/mui-material/src/Button/Button.d.ts index 1574944c43a559..c1e3e95f747014 100644 --- a/packages/mui-material/src/Button/Button.d.ts +++ b/packages/mui-material/src/Button/Button.d.ts @@ -111,13 +111,13 @@ export type ExtendButton<TypeMap extends OverridableTypeMap> = (( * * Demos: * - * - [Button Group](https://next.mui.com/material-ui/react-button-group/) - * - [Button](https://next.mui.com/material-ui/react-button/) + * - [Button Group](https://mui.com/material-ui/react-button-group/) + * - [Button](https://mui.com/material-ui/react-button/) * * API: * - * - [Button API](https://next.mui.com/material-ui/api/button/) - * - inherits [ButtonBase API](https://next.mui.com/material-ui/api/button-base/) + * - [Button API](https://mui.com/material-ui/api/button/) + * - inherits [ButtonBase API](https://mui.com/material-ui/api/button-base/) */ declare const Button: ExtendButtonBase<ButtonTypeMap>; diff --git a/packages/mui-material/src/Button/index.js b/packages/mui-material/src/Button/index.js index e45e9d01cf1efc..f100af2969849b 100644 --- a/packages/mui-material/src/Button/index.js +++ b/packages/mui-material/src/Button/index.js @@ -1,4 +1,3 @@ -'use client'; export { default } from './Button'; export { default as buttonClasses } from './buttonClasses'; diff --git a/packages/mui-material/src/ButtonBase/ButtonBase.d.ts b/packages/mui-material/src/ButtonBase/ButtonBase.d.ts index 77e0c68ffe9cbc..53a65f79fc1920 100644 --- a/packages/mui-material/src/ButtonBase/ButtonBase.d.ts +++ b/packages/mui-material/src/ButtonBase/ButtonBase.d.ts @@ -115,11 +115,11 @@ export type ExtendButtonBase<TypeMap extends OverridableTypeMap> = (( * * Demos: * - * - [Button](https://next.mui.com/material-ui/react-button/) + * - [Button](https://mui.com/material-ui/react-button/) * * API: * - * - [ButtonBase API](https://next.mui.com/material-ui/api/button-base/) + * - [ButtonBase API](https://mui.com/material-ui/api/button-base/) */ declare const ButtonBase: ExtendButtonBase<ButtonBaseTypeMap>; diff --git a/packages/mui-material/src/ButtonBase/index.js b/packages/mui-material/src/ButtonBase/index.js index 5410b8280a670a..ffa71222f42f55 100644 --- a/packages/mui-material/src/ButtonBase/index.js +++ b/packages/mui-material/src/ButtonBase/index.js @@ -1,4 +1,3 @@ -'use client'; export { default } from './ButtonBase'; export { default as buttonBaseClasses } from './buttonBaseClasses'; diff --git a/packages/mui-material/src/ButtonGroup/ButtonGroup.d.ts b/packages/mui-material/src/ButtonGroup/ButtonGroup.d.ts index 72aff8ccb89870..77cc7f128db348 100644 --- a/packages/mui-material/src/ButtonGroup/ButtonGroup.d.ts +++ b/packages/mui-material/src/ButtonGroup/ButtonGroup.d.ts @@ -90,11 +90,11 @@ export interface ButtonGroupTypeMap< * * Demos: * - * - [Button Group](https://next.mui.com/material-ui/react-button-group/) + * - [Button Group](https://mui.com/material-ui/react-button-group/) * * API: * - * - [ButtonGroup API](https://next.mui.com/material-ui/api/button-group/) + * - [ButtonGroup API](https://mui.com/material-ui/api/button-group/) */ declare const ButtonGroup: OverridableComponent<ButtonGroupTypeMap>; diff --git a/packages/mui-material/src/ButtonGroup/index.js b/packages/mui-material/src/ButtonGroup/index.js index b30f044d2b4600..b0466bbdc9cfe4 100644 --- a/packages/mui-material/src/ButtonGroup/index.js +++ b/packages/mui-material/src/ButtonGroup/index.js @@ -1,4 +1,3 @@ -'use client'; export { default } from './ButtonGroup'; export { default as buttonGroupClasses } from './buttonGroupClasses'; export * from './buttonGroupClasses'; diff --git a/packages/mui-material/src/Card/Card.d.ts b/packages/mui-material/src/Card/Card.d.ts index c35861feb931ac..41d2f725d61c18 100644 --- a/packages/mui-material/src/Card/Card.d.ts +++ b/packages/mui-material/src/Card/Card.d.ts @@ -37,12 +37,12 @@ export interface CardTypeMap< * * Demos: * - * - [Card](https://next.mui.com/material-ui/react-card/) + * - [Card](https://mui.com/material-ui/react-card/) * * API: * - * - [Card API](https://next.mui.com/material-ui/api/card/) - * - inherits [Paper API](https://next.mui.com/material-ui/api/paper/) + * - [Card API](https://mui.com/material-ui/api/card/) + * - inherits [Paper API](https://mui.com/material-ui/api/paper/) */ declare const Card: OverridableComponent<CardTypeMap>; diff --git a/packages/mui-material/src/Card/index.js b/packages/mui-material/src/Card/index.js index 69fb6f6d7854fc..ee2a4ca12c471b 100644 --- a/packages/mui-material/src/Card/index.js +++ b/packages/mui-material/src/Card/index.js @@ -1,4 +1,3 @@ -'use client'; export { default } from './Card'; export { default as cardClasses } from './cardClasses'; diff --git a/packages/mui-material/src/CardActionArea/CardActionArea.d.ts b/packages/mui-material/src/CardActionArea/CardActionArea.d.ts index 5265cfa6f9ae03..40a01c09c76910 100644 --- a/packages/mui-material/src/CardActionArea/CardActionArea.d.ts +++ b/packages/mui-material/src/CardActionArea/CardActionArea.d.ts @@ -29,12 +29,12 @@ export type CardActionAreaTypeMap< * * Demos: * - * - [Card](https://next.mui.com/material-ui/react-card/) + * - [Card](https://mui.com/material-ui/react-card/) * * API: * - * - [CardActionArea API](https://next.mui.com/material-ui/api/card-action-area/) - * - inherits [ButtonBase API](https://next.mui.com/material-ui/api/button-base/) + * - [CardActionArea API](https://mui.com/material-ui/api/card-action-area/) + * - inherits [ButtonBase API](https://mui.com/material-ui/api/button-base/) */ declare const CardActionArea: ExtendButtonBase< CardActionAreaTypeMap<{}, ButtonBaseTypeMap['defaultComponent']> diff --git a/packages/mui-material/src/CardActionArea/index.js b/packages/mui-material/src/CardActionArea/index.js index 72966e9aecc281..88e3b45b30a7e0 100644 --- a/packages/mui-material/src/CardActionArea/index.js +++ b/packages/mui-material/src/CardActionArea/index.js @@ -1,4 +1,3 @@ -'use client'; export { default } from './CardActionArea'; export { default as cardActionAreaClasses } from './cardActionAreaClasses'; diff --git a/packages/mui-material/src/CardActions/CardActions.d.ts b/packages/mui-material/src/CardActions/CardActions.d.ts index d3d1779c27bbf5..eb5494dc0e0229 100644 --- a/packages/mui-material/src/CardActions/CardActions.d.ts +++ b/packages/mui-material/src/CardActions/CardActions.d.ts @@ -27,10 +27,10 @@ export interface CardActionsProps extends StandardProps<React.HTMLAttributes<HTM * * Demos: * - * - [Card](https://next.mui.com/material-ui/react-card/) + * - [Card](https://mui.com/material-ui/react-card/) * * API: * - * - [CardActions API](https://next.mui.com/material-ui/api/card-actions/) + * - [CardActions API](https://mui.com/material-ui/api/card-actions/) */ export default function CardActions(props: CardActionsProps): React.JSX.Element; diff --git a/packages/mui-material/src/CardActions/index.js b/packages/mui-material/src/CardActions/index.js index 574cafdd683eb5..42d895fc2fbaf2 100644 --- a/packages/mui-material/src/CardActions/index.js +++ b/packages/mui-material/src/CardActions/index.js @@ -1,4 +1,3 @@ -'use client'; export { default } from './CardActions'; export { default as cardActionsClasses } from './cardActionsClasses'; diff --git a/packages/mui-material/src/CardContent/CardContent.d.ts b/packages/mui-material/src/CardContent/CardContent.d.ts index 706fa284ff932b..3792c10c2d0ac5 100644 --- a/packages/mui-material/src/CardContent/CardContent.d.ts +++ b/packages/mui-material/src/CardContent/CardContent.d.ts @@ -30,11 +30,11 @@ export interface CardContentTypeMap< * * Demos: * - * - [Card](https://next.mui.com/material-ui/react-card/) + * - [Card](https://mui.com/material-ui/react-card/) * * API: * - * - [CardContent API](https://next.mui.com/material-ui/api/card-content/) + * - [CardContent API](https://mui.com/material-ui/api/card-content/) */ declare const CardContent: OverridableComponent<CardContentTypeMap>; diff --git a/packages/mui-material/src/CardContent/index.js b/packages/mui-material/src/CardContent/index.js index d3fd480cb35648..3ee40db9b57671 100644 --- a/packages/mui-material/src/CardContent/index.js +++ b/packages/mui-material/src/CardContent/index.js @@ -1,4 +1,3 @@ -'use client'; export { default } from './CardContent'; export { default as cardContentClasses } from './cardContentClasses'; diff --git a/packages/mui-material/src/CardHeader/CardHeader.d.ts b/packages/mui-material/src/CardHeader/CardHeader.d.ts index 4bc6ae6b38863d..4fce9fed0685d3 100644 --- a/packages/mui-material/src/CardHeader/CardHeader.d.ts +++ b/packages/mui-material/src/CardHeader/CardHeader.d.ts @@ -77,11 +77,11 @@ export interface CardHeaderTypeMap< * * Demos: * - * - [Card](https://next.mui.com/material-ui/react-card/) + * - [Card](https://mui.com/material-ui/react-card/) * * API: * - * - [CardHeader API](https://next.mui.com/material-ui/api/card-header/) + * - [CardHeader API](https://mui.com/material-ui/api/card-header/) */ declare const CardHeader: OverridableCardHeader; diff --git a/packages/mui-material/src/CardHeader/index.js b/packages/mui-material/src/CardHeader/index.js index 7c4f88d11adb39..7f66c751b27942 100644 --- a/packages/mui-material/src/CardHeader/index.js +++ b/packages/mui-material/src/CardHeader/index.js @@ -1,4 +1,3 @@ -'use client'; export { default } from './CardHeader'; export { default as cardHeaderClasses } from './cardHeaderClasses'; diff --git a/packages/mui-material/src/CardMedia/CardMedia.d.ts b/packages/mui-material/src/CardMedia/CardMedia.d.ts index bbf1816feb2ba6..59d56b2cfd5081 100644 --- a/packages/mui-material/src/CardMedia/CardMedia.d.ts +++ b/packages/mui-material/src/CardMedia/CardMedia.d.ts @@ -40,11 +40,11 @@ export interface CardMediaTypeMap<AdditionalProps, RootComponent extends React.E * * Demos: * - * - [Card](https://next.mui.com/material-ui/react-card/) + * - [Card](https://mui.com/material-ui/react-card/) * * API: * - * - [CardMedia API](https://next.mui.com/material-ui/api/card-media/) + * - [CardMedia API](https://mui.com/material-ui/api/card-media/) */ declare const CardMedia: OverridableComponent<CardMediaTypeMap<{}, 'div'>>; diff --git a/packages/mui-material/src/CardMedia/index.js b/packages/mui-material/src/CardMedia/index.js index 58d227e9bc2d21..b20f3170c16b8a 100644 --- a/packages/mui-material/src/CardMedia/index.js +++ b/packages/mui-material/src/CardMedia/index.js @@ -1,4 +1,3 @@ -'use client'; export { default } from './CardMedia'; export { default as cardMediaClasses } from './cardMediaClasses'; diff --git a/packages/mui-material/src/Checkbox/Checkbox.d.ts b/packages/mui-material/src/Checkbox/Checkbox.d.ts index b6aadfaba53a54..9d9d6ffca56d24 100644 --- a/packages/mui-material/src/Checkbox/Checkbox.d.ts +++ b/packages/mui-material/src/Checkbox/Checkbox.d.ts @@ -107,12 +107,12 @@ export interface CheckboxProps * * Demos: * - * - [Checkbox](https://next.mui.com/material-ui/react-checkbox/) - * - [Transfer List](https://next.mui.com/material-ui/react-transfer-list/) + * - [Checkbox](https://mui.com/material-ui/react-checkbox/) + * - [Transfer List](https://mui.com/material-ui/react-transfer-list/) * * API: * - * - [Checkbox API](https://next.mui.com/material-ui/api/checkbox/) - * - inherits [ButtonBase API](https://next.mui.com/material-ui/api/button-base/) + * - [Checkbox API](https://mui.com/material-ui/api/checkbox/) + * - inherits [ButtonBase API](https://mui.com/material-ui/api/button-base/) */ export default function Checkbox(props: CheckboxProps): React.JSX.Element; diff --git a/packages/mui-material/src/Checkbox/index.js b/packages/mui-material/src/Checkbox/index.js index 5211c7ab6487b7..55883a5457b284 100644 --- a/packages/mui-material/src/Checkbox/index.js +++ b/packages/mui-material/src/Checkbox/index.js @@ -1,4 +1,3 @@ -'use client'; export { default } from './Checkbox'; export { default as checkboxClasses } from './checkboxClasses'; diff --git a/packages/mui-material/src/Chip/Chip.d.ts b/packages/mui-material/src/Chip/Chip.d.ts index 10955d9026def1..c5cd5a82b154a4 100644 --- a/packages/mui-material/src/Chip/Chip.d.ts +++ b/packages/mui-material/src/Chip/Chip.d.ts @@ -105,11 +105,11 @@ export interface ChipTypeMap< * * Demos: * - * - [Chip](https://next.mui.com/material-ui/react-chip/) + * - [Chip](https://mui.com/material-ui/react-chip/) * * API: * - * - [Chip API](https://next.mui.com/material-ui/api/chip/) + * - [Chip API](https://mui.com/material-ui/api/chip/) */ declare const Chip: OverridableComponent<ChipTypeMap>; diff --git a/packages/mui-material/src/Chip/index.js b/packages/mui-material/src/Chip/index.js index 81875ce0035fcc..5c7f16c51acddf 100644 --- a/packages/mui-material/src/Chip/index.js +++ b/packages/mui-material/src/Chip/index.js @@ -1,4 +1,3 @@ -'use client'; export { default } from './Chip'; export { default as chipClasses } from './chipClasses'; diff --git a/packages/mui-material/src/CircularProgress/CircularProgress.d.ts b/packages/mui-material/src/CircularProgress/CircularProgress.d.ts index 0ec024993fc1b5..31b99ab6a7273e 100644 --- a/packages/mui-material/src/CircularProgress/CircularProgress.d.ts +++ b/packages/mui-material/src/CircularProgress/CircularProgress.d.ts @@ -67,10 +67,10 @@ export interface CircularProgressProps * * Demos: * - * - [Progress](https://next.mui.com/material-ui/react-progress/) + * - [Progress](https://mui.com/material-ui/react-progress/) * * API: * - * - [CircularProgress API](https://next.mui.com/material-ui/api/circular-progress/) + * - [CircularProgress API](https://mui.com/material-ui/api/circular-progress/) */ export default function CircularProgress(props: CircularProgressProps): React.JSX.Element; diff --git a/packages/mui-material/src/CircularProgress/index.js b/packages/mui-material/src/CircularProgress/index.js index 0541327cc71d2d..16ab4399604db7 100644 --- a/packages/mui-material/src/CircularProgress/index.js +++ b/packages/mui-material/src/CircularProgress/index.js @@ -1,4 +1,3 @@ -'use client'; export { default } from './CircularProgress'; export { default as circularProgressClasses } from './circularProgressClasses'; diff --git a/packages/mui-material/src/ClickAwayListener/ClickAwayListener.tsx b/packages/mui-material/src/ClickAwayListener/ClickAwayListener.tsx index cf7e1673ba0db1..57d83c6b9d053a 100644 --- a/packages/mui-material/src/ClickAwayListener/ClickAwayListener.tsx +++ b/packages/mui-material/src/ClickAwayListener/ClickAwayListener.tsx @@ -65,12 +65,12 @@ export interface ClickAwayListenerProps { * * Demos: * - * - [Click-Away Listener](https://next.mui.com/material-ui/react-click-away-listener/) - * - [Menu](https://next.mui.com/material-ui/react-menu/) + * - [Click-Away Listener](https://mui.com/material-ui/react-click-away-listener/) + * - [Menu](https://mui.com/material-ui/react-menu/) * * API: * - * - [ClickAwayListener API](https://next.mui.com/material-ui/api/click-away-listener/) + * - [ClickAwayListener API](https://mui.com/material-ui/api/click-away-listener/) */ function ClickAwayListener(props: ClickAwayListenerProps): React.JSX.Element { const { diff --git a/packages/mui-material/src/Collapse/Collapse.d.ts b/packages/mui-material/src/Collapse/Collapse.d.ts index c61f1d53321e56..aa756bb779a3f7 100644 --- a/packages/mui-material/src/Collapse/Collapse.d.ts +++ b/packages/mui-material/src/Collapse/Collapse.d.ts @@ -54,18 +54,18 @@ export interface CollapseProps extends StandardProps<TransitionProps, 'timeout'> /** * The Collapse transition is used by the - * [Vertical Stepper](https://next.mui.com/material-ui/react-stepper/#vertical-stepper) StepContent component. + * [Vertical Stepper](https://mui.com/material-ui/react-stepper/#vertical-stepper) StepContent component. * It uses [react-transition-group](https://github.com/reactjs/react-transition-group) internally. * * Demos: * - * - [Card](https://next.mui.com/material-ui/react-card/) - * - [Lists](https://next.mui.com/material-ui/react-list/) - * - [Transitions](https://next.mui.com/material-ui/transitions/) + * - [Card](https://mui.com/material-ui/react-card/) + * - [Lists](https://mui.com/material-ui/react-list/) + * - [Transitions](https://mui.com/material-ui/transitions/) * * API: * - * - [Collapse API](https://next.mui.com/material-ui/api/collapse/) + * - [Collapse API](https://mui.com/material-ui/api/collapse/) * - inherits [Transition API](https://reactcommunity.org/react-transition-group/transition/#Transition-props) */ diff --git a/packages/mui-material/src/Collapse/index.js b/packages/mui-material/src/Collapse/index.js index 2c51ce3e77ed46..1d0361f84f2fb6 100644 --- a/packages/mui-material/src/Collapse/index.js +++ b/packages/mui-material/src/Collapse/index.js @@ -1,4 +1,3 @@ -'use client'; export { default } from './Collapse'; export { default as collapseClasses } from './collapseClasses'; diff --git a/packages/mui-material/src/Container/Container.d.ts b/packages/mui-material/src/Container/Container.d.ts index 8ab0be3f73780d..9416144afe2943 100644 --- a/packages/mui-material/src/Container/Container.d.ts +++ b/packages/mui-material/src/Container/Container.d.ts @@ -47,11 +47,11 @@ export interface ContainerTypeMap< * * Demos: * - * - [Container](https://next.mui.com/material-ui/react-container/) + * - [Container](https://mui.com/material-ui/react-container/) * * API: * - * - [Container API](https://next.mui.com/material-ui/api/container/) + * - [Container API](https://mui.com/material-ui/api/container/) */ declare const Container: OverridableComponent<ContainerTypeMap>; diff --git a/packages/mui-material/src/Container/index.js b/packages/mui-material/src/Container/index.js index 0a922c1c8dee82..be7c5c912f5943 100644 --- a/packages/mui-material/src/Container/index.js +++ b/packages/mui-material/src/Container/index.js @@ -1,4 +1,3 @@ -'use client'; export { default } from './Container'; export { default as containerClasses } from './containerClasses'; diff --git a/packages/mui-material/src/CssBaseline/CssBaseline.d.ts b/packages/mui-material/src/CssBaseline/CssBaseline.d.ts index 6032c59eb267f1..11cb225bd7ac03 100644 --- a/packages/mui-material/src/CssBaseline/CssBaseline.d.ts +++ b/packages/mui-material/src/CssBaseline/CssBaseline.d.ts @@ -20,10 +20,10 @@ export interface CssBaselineProps extends StyledComponentProps<never> { * * Demos: * - * - [CSS Baseline](https://next.mui.com/material-ui/react-css-baseline/) + * - [CSS Baseline](https://mui.com/material-ui/react-css-baseline/) * * API: * - * - [CssBaseline API](https://next.mui.com/material-ui/api/css-baseline/) + * - [CssBaseline API](https://mui.com/material-ui/api/css-baseline/) */ export default function CssBaseline(props: CssBaselineProps): React.JSX.Element; diff --git a/packages/mui-material/src/CssBaseline/index.js b/packages/mui-material/src/CssBaseline/index.js index 348940ca2ea43a..fbc808d4492709 100644 --- a/packages/mui-material/src/CssBaseline/index.js +++ b/packages/mui-material/src/CssBaseline/index.js @@ -1,2 +1 @@ -'use client'; export { default } from './CssBaseline'; diff --git a/packages/mui-material/src/Dialog/Dialog.d.ts b/packages/mui-material/src/Dialog/Dialog.d.ts index a5a25d168219d5..7e6524679672d1 100644 --- a/packages/mui-material/src/Dialog/Dialog.d.ts +++ b/packages/mui-material/src/Dialog/Dialog.d.ts @@ -69,7 +69,7 @@ export interface DialogProps extends StandardProps<ModalProps, 'children'> { */ PaperComponent?: React.JSXElementConstructor<PaperProps>; /** - * Props applied to the [`Paper`](/material-ui/api/paper/) element. + * Props applied to the [`Paper`](https://mui.com/material-ui/api/paper/) element. * @default {} */ PaperProps?: Partial<PaperProps<React.ElementType>>; @@ -84,11 +84,11 @@ export interface DialogProps extends StandardProps<ModalProps, 'children'> { sx?: SxProps<Theme>; /** * The component used for the transition. - * [Follow this guide](/material-ui/transitions/#transitioncomponent-prop) to learn more about the requirements for this component. + * [Follow this guide](https://mui.com/material-ui/transitions/#transitioncomponent-prop) to learn more about the requirements for this component. * @default Fade */ TransitionComponent?: React.JSXElementConstructor< - TransitionProps & { children: React.ReactElement<any, any> } + TransitionProps & { children: React.ReactElement<unknown, any> } >; /** * The duration for the transition, in milliseconds. @@ -111,11 +111,11 @@ export interface DialogProps extends StandardProps<ModalProps, 'children'> { * * Demos: * - * - [Dialog](https://next.mui.com/material-ui/react-dialog/) + * - [Dialog](https://mui.com/material-ui/react-dialog/) * * API: * - * - [Dialog API](https://next.mui.com/material-ui/api/dialog/) - * - inherits [Modal API](https://next.mui.com/material-ui/api/modal/) + * - [Dialog API](https://mui.com/material-ui/api/dialog/) + * - inherits [Modal API](https://mui.com/material-ui/api/modal/) */ export default function Dialog(props: DialogProps): React.JSX.Element; diff --git a/packages/mui-material/src/Dialog/Dialog.js b/packages/mui-material/src/Dialog/Dialog.js index 49b220ae076e35..53a04076dc6adc 100644 --- a/packages/mui-material/src/Dialog/Dialog.js +++ b/packages/mui-material/src/Dialog/Dialog.js @@ -118,6 +118,7 @@ const DialogPaper = styled(Paper, { memoTheme(({ theme }) => ({ margin: 32, position: 'relative', + overflowY: 'auto', '@media print': { overflowY: 'visible', boxShadow: 'none', @@ -430,7 +431,7 @@ Dialog.propTypes /* remove-proptypes */ = { */ PaperComponent: PropTypes.elementType, /** - * Props applied to the [`Paper`](/material-ui/api/paper/) element. + * Props applied to the [`Paper`](https://mui.com/material-ui/api/paper/) element. * @default {} */ PaperProps: PropTypes.object, @@ -449,7 +450,7 @@ Dialog.propTypes /* remove-proptypes */ = { ]), /** * The component used for the transition. - * [Follow this guide](/material-ui/transitions/#transitioncomponent-prop) to learn more about the requirements for this component. + * [Follow this guide](https://mui.com/material-ui/transitions/#transitioncomponent-prop) to learn more about the requirements for this component. * @default Fade */ TransitionComponent: PropTypes.elementType, diff --git a/packages/mui-material/src/Dialog/Dialog.test.js b/packages/mui-material/src/Dialog/Dialog.test.js index a0eb5c3d8ee823..dd954f5b4f0b27 100644 --- a/packages/mui-material/src/Dialog/Dialog.test.js +++ b/packages/mui-material/src/Dialog/Dialog.test.js @@ -318,6 +318,35 @@ describe('<Dialog />', () => { ); expect(getByTestId('paper')).not.to.have.class(classes.paperFullScreen); }); + + it('scrolls if overflown on the Y axis', function test() { + if (/jsdom/.test(window.navigator.userAgent)) { + this.skip(); + } + + const ITEM_HEIGHT = 100; + const ITEM_COUNT = 10; + + const { getByTestId } = render( + <Dialog + open + fullScreen + PaperProps={{ 'data-testid': 'paper', sx: { height: ITEM_HEIGHT } }} + > + {Array.from(Array(ITEM_COUNT).keys()).map((item) => ( + <div key={item} style={{ flexShrink: 0, height: ITEM_HEIGHT }}> + {item} + </div> + ))} + </Dialog>, + ); + const paperElement = getByTestId('paper'); + expect(paperElement.scrollTop).to.equal(0); + expect(paperElement.clientHeight).to.equal(ITEM_HEIGHT); + expect(paperElement.scrollHeight).to.equal(ITEM_HEIGHT * ITEM_COUNT); + fireEvent.scroll(paperElement, { target: { scrollTop: ITEM_HEIGHT } }); + expect(paperElement.scrollTop).to.equal(ITEM_HEIGHT); + }); }); describe('prop: PaperProps.className', () => { diff --git a/packages/mui-material/src/Dialog/index.js b/packages/mui-material/src/Dialog/index.js index f6428c3e45d610..88fdcc2dbdef96 100644 --- a/packages/mui-material/src/Dialog/index.js +++ b/packages/mui-material/src/Dialog/index.js @@ -1,4 +1,3 @@ -'use client'; export { default } from './Dialog'; export { default as dialogClasses } from './dialogClasses'; diff --git a/packages/mui-material/src/DialogActions/DialogActions.d.ts b/packages/mui-material/src/DialogActions/DialogActions.d.ts index cc732990894112..3f1842f3461c08 100644 --- a/packages/mui-material/src/DialogActions/DialogActions.d.ts +++ b/packages/mui-material/src/DialogActions/DialogActions.d.ts @@ -27,10 +27,10 @@ export interface DialogActionsProps extends StandardProps<React.HTMLAttributes<H * * Demos: * - * - [Dialog](https://next.mui.com/material-ui/react-dialog/) + * - [Dialog](https://mui.com/material-ui/react-dialog/) * * API: * - * - [DialogActions API](https://next.mui.com/material-ui/api/dialog-actions/) + * - [DialogActions API](https://mui.com/material-ui/api/dialog-actions/) */ export default function DialogActions(props: DialogActionsProps): React.JSX.Element; diff --git a/packages/mui-material/src/DialogActions/index.js b/packages/mui-material/src/DialogActions/index.js index 2cd37c898aa606..e01426ff8b3ecb 100644 --- a/packages/mui-material/src/DialogActions/index.js +++ b/packages/mui-material/src/DialogActions/index.js @@ -1,4 +1,3 @@ -'use client'; export { default } from './DialogActions'; export { default as dialogActionsClasses } from './dialogActionsClasses'; diff --git a/packages/mui-material/src/DialogContent/DialogContent.d.ts b/packages/mui-material/src/DialogContent/DialogContent.d.ts index 410863a3d103cb..b4b85853e400e7 100644 --- a/packages/mui-material/src/DialogContent/DialogContent.d.ts +++ b/packages/mui-material/src/DialogContent/DialogContent.d.ts @@ -27,10 +27,10 @@ export interface DialogContentProps extends StandardProps<React.HTMLAttributes<H * * Demos: * - * - [Dialog](https://next.mui.com/material-ui/react-dialog/) + * - [Dialog](https://mui.com/material-ui/react-dialog/) * * API: * - * - [DialogContent API](https://next.mui.com/material-ui/api/dialog-content/) + * - [DialogContent API](https://mui.com/material-ui/api/dialog-content/) */ export default function DialogContent(props: DialogContentProps): React.JSX.Element; diff --git a/packages/mui-material/src/DialogContent/index.js b/packages/mui-material/src/DialogContent/index.js index 8594f9de368d11..6a64cd0760cb1e 100644 --- a/packages/mui-material/src/DialogContent/index.js +++ b/packages/mui-material/src/DialogContent/index.js @@ -1,4 +1,3 @@ -'use client'; export { default } from './DialogContent'; export { default as dialogContentClasses } from './dialogContentClasses'; diff --git a/packages/mui-material/src/DialogContentText/DialogContentText.d.ts b/packages/mui-material/src/DialogContentText/DialogContentText.d.ts index a38d4ca821d8b3..4241654030a832 100644 --- a/packages/mui-material/src/DialogContentText/DialogContentText.d.ts +++ b/packages/mui-material/src/DialogContentText/DialogContentText.d.ts @@ -28,12 +28,12 @@ export interface DialogContentTextTypeMap< * * Demos: * - * - [Dialog](https://next.mui.com/material-ui/react-dialog/) + * - [Dialog](https://mui.com/material-ui/react-dialog/) * * API: * - * - [DialogContentText API](https://next.mui.com/material-ui/api/dialog-content-text/) - * - inherits [Typography API](https://next.mui.com/material-ui/api/typography/) + * - [DialogContentText API](https://mui.com/material-ui/api/dialog-content-text/) + * - inherits [Typography API](https://mui.com/material-ui/api/typography/) */ declare const DialogContentText: OverridableComponent<DialogContentTextTypeMap>; diff --git a/packages/mui-material/src/DialogContentText/index.js b/packages/mui-material/src/DialogContentText/index.js index c3d56494787dbd..ac4e6138a5497d 100644 --- a/packages/mui-material/src/DialogContentText/index.js +++ b/packages/mui-material/src/DialogContentText/index.js @@ -1,4 +1,3 @@ -'use client'; export { default } from './DialogContentText'; export { default as dialogContentTextClasses } from './dialogContentTextClasses'; diff --git a/packages/mui-material/src/DialogTitle/DialogTitle.d.ts b/packages/mui-material/src/DialogTitle/DialogTitle.d.ts index 2d6b4f13a50feb..3586405748dc38 100644 --- a/packages/mui-material/src/DialogTitle/DialogTitle.d.ts +++ b/packages/mui-material/src/DialogTitle/DialogTitle.d.ts @@ -32,12 +32,12 @@ export interface DialogTitleTypeMap< * * Demos: * - * - [Dialog](https://next.mui.com/material-ui/react-dialog/) + * - [Dialog](https://mui.com/material-ui/react-dialog/) * * API: * - * - [DialogTitle API](https://next.mui.com/material-ui/api/dialog-title/) - * - inherits [Typography API](https://next.mui.com/material-ui/api/typography/) + * - [DialogTitle API](https://mui.com/material-ui/api/dialog-title/) + * - inherits [Typography API](https://mui.com/material-ui/api/typography/) */ declare const DialogTitle: OverridableComponent<DialogTitleTypeMap>; diff --git a/packages/mui-material/src/DialogTitle/index.js b/packages/mui-material/src/DialogTitle/index.js index 7d2af51cd0824d..05be8d699e12dd 100644 --- a/packages/mui-material/src/DialogTitle/index.js +++ b/packages/mui-material/src/DialogTitle/index.js @@ -1,4 +1,3 @@ -'use client'; export { default } from './DialogTitle'; export { default as dialogTitleClasses } from './dialogTitleClasses'; diff --git a/packages/mui-material/src/Divider/Divider.d.ts b/packages/mui-material/src/Divider/Divider.d.ts index 1f5307972704a1..e48ca9f2deef14 100644 --- a/packages/mui-material/src/Divider/Divider.d.ts +++ b/packages/mui-material/src/Divider/Divider.d.ts @@ -30,7 +30,7 @@ export interface DividerOwnProps { /** * If `true`, the divider will have a lighter color. * @default false - * @deprecated Use <Divider sx={{ opacity: 0.6 }} /> (or any opacity or color) instead. See [Migrating from deprecated APIs](/material-ui/migration/migrating-from-deprecated-apis/) for more details. + * @deprecated Use <Divider sx={{ opacity: 0.6 }} /> (or any opacity or color) instead. See [Migrating from deprecated APIs](https://mui.com/material-ui/migration/migrating-from-deprecated-apis/) for more details. */ light?: boolean; /** @@ -66,12 +66,12 @@ export interface DividerTypeMap< * * Demos: * - * - [Divider](https://next.mui.com/material-ui/react-divider/) - * - [Lists](https://next.mui.com/material-ui/react-list/) + * - [Divider](https://mui.com/material-ui/react-divider/) + * - [Lists](https://mui.com/material-ui/react-list/) * * API: * - * - [Divider API](https://next.mui.com/material-ui/api/divider/) + * - [Divider API](https://mui.com/material-ui/api/divider/) */ declare const Divider: OverridableComponent<DividerTypeMap>; diff --git a/packages/mui-material/src/Divider/Divider.js b/packages/mui-material/src/Divider/Divider.js index 1e28de482e2d05..5e553592d59418 100644 --- a/packages/mui-material/src/Divider/Divider.js +++ b/packages/mui-material/src/Divider/Divider.js @@ -320,7 +320,7 @@ Divider.propTypes /* remove-proptypes */ = { /** * If `true`, the divider will have a lighter color. * @default false - * @deprecated Use <Divider sx={{ opacity: 0.6 }} /> (or any opacity or color) instead. See [Migrating from deprecated APIs](/material-ui/migration/migrating-from-deprecated-apis/) for more details. + * @deprecated Use <Divider sx={{ opacity: 0.6 }} /> (or any opacity or color) instead. See [Migrating from deprecated APIs](https://mui.com/material-ui/migration/migrating-from-deprecated-apis/) for more details. */ light: PropTypes.bool, /** diff --git a/packages/mui-material/src/Divider/index.js b/packages/mui-material/src/Divider/index.js index 6f37070be42115..cd0c47ad59025f 100644 --- a/packages/mui-material/src/Divider/index.js +++ b/packages/mui-material/src/Divider/index.js @@ -1,4 +1,3 @@ -'use client'; export { default } from './Divider'; export { default as dividerClasses } from './dividerClasses'; diff --git a/packages/mui-material/src/Drawer/Drawer.d.ts b/packages/mui-material/src/Drawer/Drawer.d.ts index b16351dee894b7..e464ef13a3a64e 100644 --- a/packages/mui-material/src/Drawer/Drawer.d.ts +++ b/packages/mui-material/src/Drawer/Drawer.d.ts @@ -27,7 +27,7 @@ export interface DrawerProps extends StandardProps<ModalProps, 'open' | 'childre */ elevation?: number; /** - * Props applied to the [`Modal`](/material-ui/api/modal/) element. + * Props applied to the [`Modal`](https://mui.com/material-ui/api/modal/) element. * @default {} */ ModalProps?: Partial<ModalProps>; @@ -45,12 +45,12 @@ export interface DrawerProps extends StandardProps<ModalProps, 'open' | 'childre */ open?: boolean; /** - * Props applied to the [`Paper`](/material-ui/api/paper/) element. + * Props applied to the [`Paper`](https://mui.com/material-ui/api/paper/) element. * @default {} */ PaperProps?: Partial<PaperProps<React.ElementType>>; /** - * Props applied to the [`Slide`](/material-ui/api/slide/) element. + * Props applied to the [`Slide`](https://mui.com/material-ui/api/slide/) element. */ SlideProps?: Partial<SlideProps>; /** @@ -74,15 +74,15 @@ export interface DrawerProps extends StandardProps<ModalProps, 'open' | 'childre } /** - * The props of the [Modal](https://next.mui.com/material-ui/api/modal/) component are available + * The props of the [Modal](https://mui.com/material-ui/api/modal/) component are available * when `variant="temporary"` is set. * * Demos: * - * - [Drawer](https://next.mui.com/material-ui/react-drawer/) + * - [Drawer](https://mui.com/material-ui/react-drawer/) * * API: * - * - [Drawer API](https://next.mui.com/material-ui/api/drawer/) + * - [Drawer API](https://mui.com/material-ui/api/drawer/) */ export default function Drawer(props: DrawerProps): React.JSX.Element; diff --git a/packages/mui-material/src/Drawer/Drawer.js b/packages/mui-material/src/Drawer/Drawer.js index b1f262166cf3ea..e7d2e159357815 100644 --- a/packages/mui-material/src/Drawer/Drawer.js +++ b/packages/mui-material/src/Drawer/Drawer.js @@ -344,7 +344,7 @@ Drawer.propTypes /* remove-proptypes */ = { */ hideBackdrop: PropTypes.bool, /** - * Props applied to the [`Modal`](/material-ui/api/modal/) element. + * Props applied to the [`Modal`](https://mui.com/material-ui/api/modal/) element. * @default {} */ ModalProps: PropTypes.object, @@ -362,12 +362,12 @@ Drawer.propTypes /* remove-proptypes */ = { */ open: PropTypes.bool, /** - * Props applied to the [`Paper`](/material-ui/api/paper/) element. + * Props applied to the [`Paper`](https://mui.com/material-ui/api/paper/) element. * @default {} */ PaperProps: PropTypes.object, /** - * Props applied to the [`Slide`](/material-ui/api/slide/) element. + * Props applied to the [`Slide`](https://mui.com/material-ui/api/slide/) element. */ SlideProps: PropTypes.object, /** diff --git a/packages/mui-material/src/Drawer/index.js b/packages/mui-material/src/Drawer/index.js index c86f5d60e1cd06..2df2f33268b1f5 100644 --- a/packages/mui-material/src/Drawer/index.js +++ b/packages/mui-material/src/Drawer/index.js @@ -1,4 +1,3 @@ -'use client'; export { default } from './Drawer'; export { default as drawerClasses } from './drawerClasses'; diff --git a/packages/mui-material/src/Fab/Fab.d.ts b/packages/mui-material/src/Fab/Fab.d.ts index 43bb187a04690f..715c9877e9291f 100644 --- a/packages/mui-material/src/Fab/Fab.d.ts +++ b/packages/mui-material/src/Fab/Fab.d.ts @@ -79,12 +79,12 @@ export type FabTypeMap< * * Demos: * - * - [Floating Action Button](https://next.mui.com/material-ui/react-floating-action-button/) + * - [Floating Action Button](https://mui.com/material-ui/react-floating-action-button/) * * API: * - * - [Fab API](https://next.mui.com/material-ui/api/fab/) - * - inherits [ButtonBase API](https://next.mui.com/material-ui/api/button-base/) + * - [Fab API](https://mui.com/material-ui/api/fab/) + * - inherits [ButtonBase API](https://mui.com/material-ui/api/button-base/) */ declare const Fab: ExtendButtonBase<FabTypeMap>; diff --git a/packages/mui-material/src/Fab/index.js b/packages/mui-material/src/Fab/index.js index 7a50d9ba5b8ddd..e5fd203ad858c0 100644 --- a/packages/mui-material/src/Fab/index.js +++ b/packages/mui-material/src/Fab/index.js @@ -1,4 +1,3 @@ -'use client'; export { default } from './Fab'; export { default as fabClasses } from './fabClasses'; diff --git a/packages/mui-material/src/Fade/Fade.d.ts b/packages/mui-material/src/Fade/Fade.d.ts index dc29c55e69696d..6e6a7055ea20a4 100644 --- a/packages/mui-material/src/Fade/Fade.d.ts +++ b/packages/mui-material/src/Fade/Fade.d.ts @@ -11,7 +11,7 @@ export interface FadeProps extends Omit<TransitionProps, 'children'> { /** * A single child content element. */ - children: React.ReactElement<any, any>; + children: React.ReactElement<unknown, any>; /** * The transition timing function. * You may specify a single easing or a object containing enter and exit values. @@ -34,16 +34,16 @@ export interface FadeProps extends Omit<TransitionProps, 'children'> { } /** - * The Fade transition is used by the [Modal](https://next.mui.com/material-ui/react-modal/) component. + * The Fade transition is used by the [Modal](https://mui.com/material-ui/react-modal/) component. * It uses [react-transition-group](https://github.com/reactjs/react-transition-group) internally. * * Demos: * - * - [Transitions](https://next.mui.com/material-ui/transitions/) + * - [Transitions](https://mui.com/material-ui/transitions/) * * API: * - * - [Fade API](https://next.mui.com/material-ui/api/fade/) + * - [Fade API](https://mui.com/material-ui/api/fade/) * - inherits [Transition API](https://reactcommunity.org/react-transition-group/transition/#Transition-props) */ export default function Fade(props: FadeProps): React.JSX.Element; diff --git a/packages/mui-material/src/Fade/index.js b/packages/mui-material/src/Fade/index.js index 72383924f48901..f2e7306180a9ad 100644 --- a/packages/mui-material/src/Fade/index.js +++ b/packages/mui-material/src/Fade/index.js @@ -1,2 +1 @@ -'use client'; export { default } from './Fade'; diff --git a/packages/mui-material/src/FilledInput/FilledInput.d.ts b/packages/mui-material/src/FilledInput/FilledInput.d.ts index 7432f5bda9555e..c31279ed4f8b8b 100644 --- a/packages/mui-material/src/FilledInput/FilledInput.d.ts +++ b/packages/mui-material/src/FilledInput/FilledInput.d.ts @@ -30,12 +30,12 @@ export interface FilledInputProps extends StandardProps<InputBaseProps> { * * Demos: * - * - [Text Field](https://next.mui.com/material-ui/react-text-field/) + * - [Text Field](https://mui.com/material-ui/react-text-field/) * * API: * - * - [FilledInput API](https://next.mui.com/material-ui/api/filled-input/) - * - inherits [InputBase API](https://next.mui.com/material-ui/api/input-base/) + * - [FilledInput API](https://mui.com/material-ui/api/filled-input/) + * - inherits [InputBase API](https://mui.com/material-ui/api/input-base/) */ declare const FilledInput: ((props: FilledInputProps) => React.JSX.Element) & { muiName: string }; diff --git a/packages/mui-material/src/FilledInput/FilledInput.js b/packages/mui-material/src/FilledInput/FilledInput.js index 94a3f1bf4a4ca1..ee9c6e3cfc63b1 100644 --- a/packages/mui-material/src/FilledInput/FilledInput.js +++ b/packages/mui-material/src/FilledInput/FilledInput.js @@ -359,7 +359,7 @@ FilledInput.propTypes /* remove-proptypes */ = { /** * The components used for each slot inside. * - * @deprecated use the `slots` prop instead. This prop will be removed in v7. See [Migrating from deprecated APIs](/material-ui/migration/migrating-from-deprecated-apis/) for more details. + * @deprecated use the `slots` prop instead. This prop will be removed in v7. See [Migrating from deprecated APIs](https://mui.com/material-ui/migration/migrating-from-deprecated-apis/) for more details. * * @default {} */ @@ -371,7 +371,7 @@ FilledInput.propTypes /* remove-proptypes */ = { * The extra props for the slot components. * You can override the existing props or add new ones. * - * @deprecated use the `slotProps` prop instead. This prop will be removed in v7. See [Migrating from deprecated APIs](/material-ui/migration/migrating-from-deprecated-apis/) for more details. + * @deprecated use the `slotProps` prop instead. This prop will be removed in v7. See [Migrating from deprecated APIs](https://mui.com/material-ui/migration/migrating-from-deprecated-apis/) for more details. * * @default {} */ @@ -448,7 +448,7 @@ FilledInput.propTypes /* remove-proptypes */ = { */ minRows: PropTypes.oneOfType([PropTypes.number, PropTypes.string]), /** - * If `true`, a [TextareaAutosize](/material-ui/react-textarea-autosize/) element is rendered. + * If `true`, a [TextareaAutosize](https://mui.com/material-ui/react-textarea-autosize/) element is rendered. * @default false */ multiline: PropTypes.bool, diff --git a/packages/mui-material/src/FilledInput/index.js b/packages/mui-material/src/FilledInput/index.js index d1afd2384ad9b5..91b5a314f0050b 100644 --- a/packages/mui-material/src/FilledInput/index.js +++ b/packages/mui-material/src/FilledInput/index.js @@ -1,4 +1,3 @@ -'use client'; export { default } from './FilledInput'; export { default as filledInputClasses } from './filledInputClasses'; diff --git a/packages/mui-material/src/FormControl/FormControl.d.ts b/packages/mui-material/src/FormControl/FormControl.d.ts index 962165a5c33bd1..3bf94a5d6dd196 100644 --- a/packages/mui-material/src/FormControl/FormControl.d.ts +++ b/packages/mui-material/src/FormControl/FormControl.d.ts @@ -93,12 +93,12 @@ export interface FormControlTypeMap< * consistent across the children of the `FormControl`. * This context is used by the following components: * - * * FormLabel - * * FormHelperText - * * Input - * * InputLabel + * * FormLabel + * * FormHelperText + * * Input + * * InputLabel * - * You can find one composition example below and more going to [the demos](https://next.mui.com/material-ui/react-text-field/#components). + * You can find one composition example below and more going to [the demos](https://mui.com/material-ui/react-text-field/#components). * * ```jsx * <FormControl> @@ -113,14 +113,14 @@ export interface FormControlTypeMap< * * Demos: * - * - [Checkbox](https://next.mui.com/material-ui/react-checkbox/) - * - [Radio Group](https://next.mui.com/material-ui/react-radio-button/) - * - [Switch](https://next.mui.com/material-ui/react-switch/) - * - [Text Field](https://next.mui.com/material-ui/react-text-field/) + * - [Checkbox](https://mui.com/material-ui/react-checkbox/) + * - [Radio Group](https://mui.com/material-ui/react-radio-button/) + * - [Switch](https://mui.com/material-ui/react-switch/) + * - [Text Field](https://mui.com/material-ui/react-text-field/) * * API: * - * - [FormControl API](https://next.mui.com/material-ui/api/form-control/) + * - [FormControl API](https://mui.com/material-ui/api/form-control/) */ declare const FormControl: OverridableComponent<FormControlTypeMap>; diff --git a/packages/mui-material/src/FormControl/index.js b/packages/mui-material/src/FormControl/index.js index 4112e5a979f5f1..3696a0db431cde 100644 --- a/packages/mui-material/src/FormControl/index.js +++ b/packages/mui-material/src/FormControl/index.js @@ -1,4 +1,3 @@ -'use client'; export { default } from './FormControl'; export { default as useFormControl } from './useFormControl'; diff --git a/packages/mui-material/src/FormControlLabel/FormControlLabel.d.ts b/packages/mui-material/src/FormControlLabel/FormControlLabel.d.ts index a473eb3bdc78fb..2d679da44f179b 100644 --- a/packages/mui-material/src/FormControlLabel/FormControlLabel.d.ts +++ b/packages/mui-material/src/FormControlLabel/FormControlLabel.d.ts @@ -11,7 +11,7 @@ export interface FormControlLabelSlots { * This is unused if `disableTypography` is true. * @default Typography */ - typography?: React.ElementType; + typography: React.ElementType; } export type FormControlLabelSlotsAndSlotProps = CreateSlotsAndSlotProps< @@ -35,7 +35,7 @@ export interface FormControlLabelProps /** * The props used for each slot inside. * @default {} - * @deprecated use the `slotProps` prop instead. This prop will be removed in v7. See [Migrating from deprecated APIs](/material-ui/migration/migrating-from-deprecated-apis/) for more details. + * @deprecated use the `slotProps` prop instead. This prop will be removed in v7. See [Migrating from deprecated APIs](https://mui.com/material-ui/migration/migrating-from-deprecated-apis/) for more details. */ componentsProps?: { /** @@ -48,7 +48,7 @@ export interface FormControlLabelProps /** * A control element. For instance, it can be a `Radio`, a `Switch` or a `Checkbox`. */ - control: React.ReactElement<any, any>; + control: React.ReactElement<unknown, any>; /** * If `true`, the control is disabled. */ @@ -98,12 +98,12 @@ export interface FormControlLabelProps * * Demos: * - * - [Checkbox](https://next.mui.com/material-ui/react-checkbox/) - * - [Radio Group](https://next.mui.com/material-ui/react-radio-button/) - * - [Switch](https://next.mui.com/material-ui/react-switch/) + * - [Checkbox](https://mui.com/material-ui/react-checkbox/) + * - [Radio Group](https://mui.com/material-ui/react-radio-button/) + * - [Switch](https://mui.com/material-ui/react-switch/) * * API: * - * - [FormControlLabel API](https://next.mui.com/material-ui/api/form-control-label/) + * - [FormControlLabel API](https://mui.com/material-ui/api/form-control-label/) */ export default function FormControlLabel(props: FormControlLabelProps): React.JSX.Element; diff --git a/packages/mui-material/src/FormControlLabel/FormControlLabel.js b/packages/mui-material/src/FormControlLabel/FormControlLabel.js index bb453ae5a567b2..18e879964f7f05 100644 --- a/packages/mui-material/src/FormControlLabel/FormControlLabel.js +++ b/packages/mui-material/src/FormControlLabel/FormControlLabel.js @@ -232,7 +232,7 @@ FormControlLabel.propTypes /* remove-proptypes */ = { /** * The props used for each slot inside. * @default {} - * @deprecated use the `slotProps` prop instead. This prop will be removed in v7. See [Migrating from deprecated APIs](/material-ui/migration/migrating-from-deprecated-apis/) for more details. + * @deprecated use the `slotProps` prop instead. This prop will be removed in v7. See [Migrating from deprecated APIs](https://mui.com/material-ui/migration/migrating-from-deprecated-apis/) for more details. */ componentsProps: PropTypes.shape({ typography: PropTypes.object, diff --git a/packages/mui-material/src/FormControlLabel/index.js b/packages/mui-material/src/FormControlLabel/index.js index 9ac194366044ec..9ed089a1a82bf0 100644 --- a/packages/mui-material/src/FormControlLabel/index.js +++ b/packages/mui-material/src/FormControlLabel/index.js @@ -1,4 +1,3 @@ -'use client'; export { default } from './FormControlLabel'; export { default as formControlLabelClasses } from './formControlLabelClasses'; diff --git a/packages/mui-material/src/FormGroup/FormGroup.d.ts b/packages/mui-material/src/FormGroup/FormGroup.d.ts index d18a8220203ca5..120c8bda2f6ad4 100644 --- a/packages/mui-material/src/FormGroup/FormGroup.d.ts +++ b/packages/mui-material/src/FormGroup/FormGroup.d.ts @@ -30,11 +30,11 @@ export interface FormGroupProps extends StandardProps<React.HTMLAttributes<HTMLD * * Demos: * - * - [Checkbox](https://next.mui.com/material-ui/react-checkbox/) - * - [Switch](https://next.mui.com/material-ui/react-switch/) + * - [Checkbox](https://mui.com/material-ui/react-checkbox/) + * - [Switch](https://mui.com/material-ui/react-switch/) * * API: * - * - [FormGroup API](https://next.mui.com/material-ui/api/form-group/) + * - [FormGroup API](https://mui.com/material-ui/api/form-group/) */ export default function FormGroup(props: FormGroupProps): React.JSX.Element; diff --git a/packages/mui-material/src/FormGroup/index.js b/packages/mui-material/src/FormGroup/index.js index 745ba760f17f76..a932a6832a111f 100644 --- a/packages/mui-material/src/FormGroup/index.js +++ b/packages/mui-material/src/FormGroup/index.js @@ -1,4 +1,3 @@ -'use client'; export { default } from './FormGroup'; export { default as formGroupClasses } from './formGroupClasses'; export * from './formGroupClasses'; diff --git a/packages/mui-material/src/FormHelperText/FormHelperText.d.ts b/packages/mui-material/src/FormHelperText/FormHelperText.d.ts index bd26e275db56e6..0869db3920d6b8 100644 --- a/packages/mui-material/src/FormHelperText/FormHelperText.d.ts +++ b/packages/mui-material/src/FormHelperText/FormHelperText.d.ts @@ -67,11 +67,11 @@ export interface FormHelperTextTypeMap< * * Demos: * - * - [Text Field](https://next.mui.com/material-ui/react-text-field/) + * - [Text Field](https://mui.com/material-ui/react-text-field/) * * API: * - * - [FormHelperText API](https://next.mui.com/material-ui/api/form-helper-text/) + * - [FormHelperText API](https://mui.com/material-ui/api/form-helper-text/) */ declare const FormHelperText: OverridableComponent<FormHelperTextTypeMap>; diff --git a/packages/mui-material/src/FormHelperText/index.js b/packages/mui-material/src/FormHelperText/index.js index e2e5b0a06e3444..00261f5370cf62 100644 --- a/packages/mui-material/src/FormHelperText/index.js +++ b/packages/mui-material/src/FormHelperText/index.js @@ -1,4 +1,3 @@ -'use client'; export { default } from './FormHelperText'; export { default as formHelperTextClasses } from './formHelperTextClasses'; diff --git a/packages/mui-material/src/FormLabel/FormLabel.d.ts b/packages/mui-material/src/FormLabel/FormLabel.d.ts index 1ed383f68805e9..f332f4d1c1a33d 100644 --- a/packages/mui-material/src/FormLabel/FormLabel.d.ts +++ b/packages/mui-material/src/FormLabel/FormLabel.d.ts @@ -68,13 +68,13 @@ export interface FormLabelTypeMap< * * Demos: * - * - [Checkbox](https://next.mui.com/material-ui/react-checkbox/) - * - [Radio Group](https://next.mui.com/material-ui/react-radio-button/) - * - [Switch](https://next.mui.com/material-ui/react-switch/) + * - [Checkbox](https://mui.com/material-ui/react-checkbox/) + * - [Radio Group](https://mui.com/material-ui/react-radio-button/) + * - [Switch](https://mui.com/material-ui/react-switch/) * * API: * - * - [FormLabel API](https://next.mui.com/material-ui/api/form-label/) + * - [FormLabel API](https://mui.com/material-ui/api/form-label/) */ declare const FormLabel: OverridableComponent<FormLabelTypeMap>; diff --git a/packages/mui-material/src/FormLabel/index.js b/packages/mui-material/src/FormLabel/index.js index db05e838ce6da7..f81d2d6d4ed4a4 100644 --- a/packages/mui-material/src/FormLabel/index.js +++ b/packages/mui-material/src/FormLabel/index.js @@ -1,4 +1,3 @@ -'use client'; export { default } from './FormLabel'; export * from './FormLabel'; diff --git a/packages/mui-material/src/GlobalStyles/GlobalStyles.d.ts b/packages/mui-material/src/GlobalStyles/GlobalStyles.d.ts index be98077796b721..a5f9b45d7ab4fc 100644 --- a/packages/mui-material/src/GlobalStyles/GlobalStyles.d.ts +++ b/packages/mui-material/src/GlobalStyles/GlobalStyles.d.ts @@ -12,10 +12,10 @@ export interface GlobalStylesProps { * * Demos: * - * - [How to customize](https://next.mui.com/material-ui/customization/how-to-customize/) + * - [How to customize](https://mui.com/material-ui/customization/how-to-customize/) * * API: * - * - [GlobalStyles API](https://next.mui.com/material-ui/api/global-styles/) + * - [GlobalStyles API](https://mui.com/material-ui/api/global-styles/) */ export default function GlobalStyles(props: GlobalStylesProps): React.ReactElement<unknown>; diff --git a/packages/mui-material/src/Grid/Grid.d.ts b/packages/mui-material/src/Grid/Grid.d.ts index 8621d3f06a2090..2a879e908f17f7 100644 --- a/packages/mui-material/src/Grid/Grid.d.ts +++ b/packages/mui-material/src/Grid/Grid.d.ts @@ -139,7 +139,6 @@ export interface GridOwnProps extends SystemProps<Theme>, Breakpoints { * Defines the `flex-wrap` style property. * It's applied for all screen sizes. * @default 'wrap' - * @deprecated Use `flexWrap` instead. This prop will be removed in v7. See [Migrating from deprecated APIs](/material-ui/migration/migrating-from-deprecated-apis/) for more details. */ wrap?: GridWrap; /** @@ -162,13 +161,13 @@ export interface GridTypeMap< * * Demos: * - * - [Grid](https://next.mui.com/material-ui/react-grid/) + * - [Grid](https://mui.com/material-ui/react-grid/) * * API: * - * - [Grid API](https://next.mui.com/material-ui/api/grid/) + * - [Grid API](https://mui.com/material-ui/api/grid/) * - * @deprecated Use the [`Grid2`](https://next.mui.com/material-ui/react-grid2/) component instead. + * @deprecated Use the [`Grid2`](https://mui.com/material-ui/react-grid2/) component instead. */ declare const Grid: OverridableComponent<GridTypeMap>; diff --git a/packages/mui-material/src/Grid/Grid.js b/packages/mui-material/src/Grid/Grid.js index ec8f82bda71359..fd558579691bce 100644 --- a/packages/mui-material/src/Grid/Grid.js +++ b/packages/mui-material/src/Grid/Grid.js @@ -399,7 +399,7 @@ const useUtilityClasses = (ownerState) => { }; /** - * @deprecated Use the [`Grid2`](https://next.mui.com/material-ui/react-grid2/) component instead. + * @deprecated Use the [`Grid2`](https://mui.com/material-ui/react-grid2/) component instead. */ const Grid = React.forwardRef(function Grid(inProps, ref) { const themeProps = useThemeProps({ props: inProps, name: 'MuiGrid' }); @@ -595,7 +595,6 @@ Grid.propTypes /* remove-proptypes */ = { * Defines the `flex-wrap` style property. * It's applied for all screen sizes. * @default 'wrap' - * @deprecated Use `flexWrap` instead. This prop will be removed in v7. See [Migrating from deprecated APIs](/material-ui/migration/migrating-from-deprecated-apis/) for more details. */ wrap: PropTypes.oneOf(['nowrap', 'wrap-reverse', 'wrap']), /** diff --git a/packages/mui-material/src/Grid/index.js b/packages/mui-material/src/Grid/index.js index c679ea0a45f9fc..7d6e3574239812 100644 --- a/packages/mui-material/src/Grid/index.js +++ b/packages/mui-material/src/Grid/index.js @@ -1,4 +1,3 @@ -'use client'; export { default } from './Grid'; export { default as gridClasses } from './gridClasses'; diff --git a/packages/mui-material/src/Grid2/Grid2.tsx b/packages/mui-material/src/Grid2/Grid2.tsx index 6fefa1c7d335e1..3aeb961de5ff97 100644 --- a/packages/mui-material/src/Grid2/Grid2.tsx +++ b/packages/mui-material/src/Grid2/Grid2.tsx @@ -112,11 +112,11 @@ export type Grid2Props< * * Demos: * - * - [Grid version 2](https://next.mui.com/material-ui/react-grid2/) + * - [Grid version 2](https://mui.com/material-ui/react-grid2/) * * API: * - * - [Grid2 API](https://next.mui.com/material-ui/api/grid-2/) + * - [Grid2 API](https://mui.com/material-ui/api/grid-2/) */ const Grid2 = createGrid2({ createStyledComponent: styled('div', { diff --git a/packages/mui-material/src/Grid2/index.ts b/packages/mui-material/src/Grid2/index.ts index b3ff428524d803..b85655841505cb 100644 --- a/packages/mui-material/src/Grid2/index.ts +++ b/packages/mui-material/src/Grid2/index.ts @@ -1,4 +1,3 @@ -'use client'; export { default } from './Grid2'; export * from './Grid2'; export { default as grid2Classes } from './grid2Classes'; diff --git a/packages/mui-material/src/Grow/Grow.d.ts b/packages/mui-material/src/Grow/Grow.d.ts index 3cc87d5fa00c6e..b4a412e9792737 100644 --- a/packages/mui-material/src/Grow/Grow.d.ts +++ b/packages/mui-material/src/Grow/Grow.d.ts @@ -11,7 +11,7 @@ export interface GrowProps extends Omit<TransitionProps, 'timeout'> { /** * A single child content element. */ - children: React.ReactElement<any, any>; + children: React.ReactElement<unknown, any>; /** * The transition timing function. * You may specify a single easing or a object containing enter and exit values. @@ -33,18 +33,18 @@ export interface GrowProps extends Omit<TransitionProps, 'timeout'> { } /** - * The Grow transition is used by the [Tooltip](https://next.mui.com/material-ui/react-tooltip/) and - * [Popover](https://next.mui.com/material-ui/react-popover/) components. + * The Grow transition is used by the [Tooltip](https://mui.com/material-ui/react-tooltip/) and + * [Popover](https://mui.com/material-ui/react-popover/) components. * It uses [react-transition-group](https://github.com/reactjs/react-transition-group) internally. * * Demos: * - * - [Popover](https://next.mui.com/material-ui/react-popover/) - * - [Transitions](https://next.mui.com/material-ui/transitions/) + * - [Popover](https://mui.com/material-ui/react-popover/) + * - [Transitions](https://mui.com/material-ui/transitions/) * * API: * - * - [Grow API](https://next.mui.com/material-ui/api/grow/) + * - [Grow API](https://mui.com/material-ui/api/grow/) * - inherits [Transition API](https://reactcommunity.org/react-transition-group/transition/#Transition-props) */ export default function Grow(props: GrowProps): React.JSX.Element; diff --git a/packages/mui-material/src/Grow/index.js b/packages/mui-material/src/Grow/index.js index 4a0378a0ec0359..0bae98f6624cc6 100644 --- a/packages/mui-material/src/Grow/index.js +++ b/packages/mui-material/src/Grow/index.js @@ -1,2 +1 @@ -'use client'; export { default } from './Grow'; diff --git a/packages/mui-material/src/Hidden/Hidden.d.ts b/packages/mui-material/src/Hidden/Hidden.d.ts index 566562223cd8cd..2b5047f03fc8cf 100644 --- a/packages/mui-material/src/Hidden/Hidden.d.ts +++ b/packages/mui-material/src/Hidden/Hidden.d.ts @@ -85,13 +85,13 @@ export interface HiddenProps { * * Demos: * - * - [Hidden](https://next.mui.com/material-ui/react-hidden/) + * - [Hidden](https://mui.com/material-ui/react-hidden/) * * API: * - * - [Hidden API](https://next.mui.com/material-ui/api/hidden/) + * - [Hidden API](https://mui.com/material-ui/api/hidden/) * - * @deprecated The Hidden component was deprecated in Material UI v5. To learn more, see [the Hidden section](/material-ui/migration/v5-component-changes/#hidden) of the migration docs. + * @deprecated The Hidden component was deprecated in Material UI v5. To learn more, see [the Hidden section](https://mui.com/material-ui/migration/v5-component-changes/#hidden) of the migration docs. */ declare const Hidden: React.JSXElementConstructor<HiddenProps>; diff --git a/packages/mui-material/src/Hidden/Hidden.js b/packages/mui-material/src/Hidden/Hidden.js index 6796312c6bf9bc..8e141aee54dfab 100644 --- a/packages/mui-material/src/Hidden/Hidden.js +++ b/packages/mui-material/src/Hidden/Hidden.js @@ -7,7 +7,7 @@ import HiddenCss from './HiddenCss'; /** * Responsively hides children based on the selected implementation. * - * @deprecated The Hidden component was deprecated in Material UI v5. To learn more, see [the Hidden section](/material-ui/migration/v5-component-changes/#hidden) of the migration docs. + * @deprecated The Hidden component was deprecated in Material UI v5. To learn more, see [the Hidden section](https://mui.com/material-ui/migration/v5-component-changes/#hidden) of the migration docs. */ function Hidden(props) { const { diff --git a/packages/mui-material/src/Hidden/index.js b/packages/mui-material/src/Hidden/index.js index ec796de043e77f..b786254d40f3d3 100644 --- a/packages/mui-material/src/Hidden/index.js +++ b/packages/mui-material/src/Hidden/index.js @@ -1,2 +1 @@ -'use client'; export { default } from './Hidden'; diff --git a/packages/mui-material/src/Icon/Icon.d.ts b/packages/mui-material/src/Icon/Icon.d.ts index e89527fd4c33bb..643e8a9667a12d 100644 --- a/packages/mui-material/src/Icon/Icon.d.ts +++ b/packages/mui-material/src/Icon/Icon.d.ts @@ -67,12 +67,12 @@ export interface IconTypeMap< * * Demos: * - * - [Icons](https://next.mui.com/material-ui/icons/) - * - [Material Icons](https://next.mui.com/material-ui/material-icons/) + * - [Icons](https://mui.com/material-ui/icons/) + * - [Material Icons](https://mui.com/material-ui/material-icons/) * * API: * - * - [Icon API](https://next.mui.com/material-ui/api/icon/) + * - [Icon API](https://mui.com/material-ui/api/icon/) */ declare const Icon: OverridableComponent<IconTypeMap> & { muiName: string }; diff --git a/packages/mui-material/src/Icon/index.js b/packages/mui-material/src/Icon/index.js index 2d590735b67a17..403a0df0626dfc 100644 --- a/packages/mui-material/src/Icon/index.js +++ b/packages/mui-material/src/Icon/index.js @@ -1,4 +1,3 @@ -'use client'; export { default } from './Icon'; export { default as iconClasses } from './iconClasses'; diff --git a/packages/mui-material/src/IconButton/IconButton.d.ts b/packages/mui-material/src/IconButton/IconButton.d.ts index 8169de7e40ca59..108d72d09ac0c3 100644 --- a/packages/mui-material/src/IconButton/IconButton.d.ts +++ b/packages/mui-material/src/IconButton/IconButton.d.ts @@ -68,17 +68,17 @@ export type IconButtonTypeMap< }>; /** - * Refer to the [Icons](https://next.mui.com/material-ui/icons/) section of the documentation + * Refer to the [Icons](https://mui.com/material-ui/icons/) section of the documentation * regarding the available icon options. * * Demos: * - * - [Button](https://next.mui.com/material-ui/react-button/) + * - [Button](https://mui.com/material-ui/react-button/) * * API: * - * - [IconButton API](https://next.mui.com/material-ui/api/icon-button/) - * - inherits [ButtonBase API](https://next.mui.com/material-ui/api/button-base/) + * - [IconButton API](https://mui.com/material-ui/api/icon-button/) + * - inherits [ButtonBase API](https://mui.com/material-ui/api/button-base/) */ declare const IconButton: ExtendButtonBase<IconButtonTypeMap>; diff --git a/packages/mui-material/src/IconButton/index.js b/packages/mui-material/src/IconButton/index.js index f80565936a4435..115058c9d6a9f6 100644 --- a/packages/mui-material/src/IconButton/index.js +++ b/packages/mui-material/src/IconButton/index.js @@ -1,4 +1,3 @@ -'use client'; export { default } from './IconButton'; export { default as iconButtonClasses } from './iconButtonClasses'; diff --git a/packages/mui-material/src/ImageList/ImageList.d.ts b/packages/mui-material/src/ImageList/ImageList.d.ts index 53ce9e5a1588f2..618e3cbc990531 100644 --- a/packages/mui-material/src/ImageList/ImageList.d.ts +++ b/packages/mui-material/src/ImageList/ImageList.d.ts @@ -56,11 +56,11 @@ export interface ImageListTypeMap< * * Demos: * - * - [Image List](https://next.mui.com/material-ui/react-image-list/) + * - [Image List](https://mui.com/material-ui/react-image-list/) * * API: * - * - [ImageList API](https://next.mui.com/material-ui/api/image-list/) + * - [ImageList API](https://mui.com/material-ui/api/image-list/) */ declare const ImageList: OverridableComponent<ImageListTypeMap>; diff --git a/packages/mui-material/src/ImageList/index.js b/packages/mui-material/src/ImageList/index.js index d72a5536795bd7..3cbe65e6a2c1bf 100644 --- a/packages/mui-material/src/ImageList/index.js +++ b/packages/mui-material/src/ImageList/index.js @@ -1,4 +1,3 @@ -'use client'; export { default } from './ImageList'; export * from './imageListClasses'; export { default as imageListClasses } from './imageListClasses'; diff --git a/packages/mui-material/src/ImageListItem/ImageListItem.d.ts b/packages/mui-material/src/ImageListItem/ImageListItem.d.ts index 20a1f635344c7d..09892699adfadb 100644 --- a/packages/mui-material/src/ImageListItem/ImageListItem.d.ts +++ b/packages/mui-material/src/ImageListItem/ImageListItem.d.ts @@ -40,11 +40,11 @@ export interface ImageListItemTypeMap< * * Demos: * - * - [Image List](https://next.mui.com/material-ui/react-image-list/) + * - [Image List](https://mui.com/material-ui/react-image-list/) * * API: * - * - [ImageListItem API](https://next.mui.com/material-ui/api/image-list-item/) + * - [ImageListItem API](https://mui.com/material-ui/api/image-list-item/) */ declare const ImageListItem: OverridableComponent<ImageListItemTypeMap>; diff --git a/packages/mui-material/src/ImageListItem/index.js b/packages/mui-material/src/ImageListItem/index.js index d96ad0f3ce4798..3659a0336c3956 100644 --- a/packages/mui-material/src/ImageListItem/index.js +++ b/packages/mui-material/src/ImageListItem/index.js @@ -1,4 +1,3 @@ -'use client'; export { default } from './ImageListItem'; export * from './imageListItemClasses'; diff --git a/packages/mui-material/src/ImageListItemBar/ImageListItemBar.d.ts b/packages/mui-material/src/ImageListItemBar/ImageListItemBar.d.ts index 7194d9e2e0440e..b134d22e35121d 100644 --- a/packages/mui-material/src/ImageListItemBar/ImageListItemBar.d.ts +++ b/packages/mui-material/src/ImageListItemBar/ImageListItemBar.d.ts @@ -42,10 +42,10 @@ export interface ImageListItemBarProps * * Demos: * - * - [Image List](https://next.mui.com/material-ui/react-image-list/) + * - [Image List](https://mui.com/material-ui/react-image-list/) * * API: * - * - [ImageListItemBar API](https://next.mui.com/material-ui/api/image-list-item-bar/) + * - [ImageListItemBar API](https://mui.com/material-ui/api/image-list-item-bar/) */ export default function ImageListItemBar(props: ImageListItemBarProps): React.JSX.Element; diff --git a/packages/mui-material/src/ImageListItemBar/index.js b/packages/mui-material/src/ImageListItemBar/index.js index d7617f02c01066..30060333f44f95 100644 --- a/packages/mui-material/src/ImageListItemBar/index.js +++ b/packages/mui-material/src/ImageListItemBar/index.js @@ -1,4 +1,3 @@ -'use client'; export { default } from './ImageListItemBar'; export * from './imageListItemBarClasses'; diff --git a/packages/mui-material/src/Input/Input.d.ts b/packages/mui-material/src/Input/Input.d.ts index 6e390cad7c4798..771af138da3324 100644 --- a/packages/mui-material/src/Input/Input.d.ts +++ b/packages/mui-material/src/Input/Input.d.ts @@ -23,12 +23,12 @@ export interface InputProps extends StandardProps<InputBaseProps> { * * Demos: * - * - [Text Field](https://next.mui.com/material-ui/react-text-field/) + * - [Text Field](https://mui.com/material-ui/react-text-field/) * * API: * - * - [Input API](https://next.mui.com/material-ui/api/input/) - * - inherits [InputBase API](https://next.mui.com/material-ui/api/input-base/) + * - [Input API](https://mui.com/material-ui/api/input/) + * - inherits [InputBase API](https://mui.com/material-ui/api/input-base/) */ declare const Input: ((props: InputProps) => React.JSX.Element) & { muiName: string }; diff --git a/packages/mui-material/src/Input/Input.js b/packages/mui-material/src/Input/Input.js index aabc346951caae..9ff6587bdd42b5 100644 --- a/packages/mui-material/src/Input/Input.js +++ b/packages/mui-material/src/Input/Input.js @@ -209,7 +209,7 @@ Input.propTypes /* remove-proptypes */ = { /** * The components used for each slot inside. * - * @deprecated use the `slots` prop instead. This prop will be removed in v7. See [Migrating from deprecated APIs](/material-ui/migration/migrating-from-deprecated-apis/) for more details. + * @deprecated use the `slots` prop instead. This prop will be removed in v7. See [Migrating from deprecated APIs](https://mui.com/material-ui/migration/migrating-from-deprecated-apis/) for more details. * * @default {} */ @@ -221,7 +221,7 @@ Input.propTypes /* remove-proptypes */ = { * The extra props for the slot components. * You can override the existing props or add new ones. * - * @deprecated use the `slotProps` prop instead. This prop will be removed in v7. See [Migrating from deprecated APIs](/material-ui/migration/migrating-from-deprecated-apis/) for more details. + * @deprecated use the `slotProps` prop instead. This prop will be removed in v7. See [Migrating from deprecated APIs](https://mui.com/material-ui/migration/migrating-from-deprecated-apis/) for more details. * * @default {} */ @@ -291,7 +291,7 @@ Input.propTypes /* remove-proptypes */ = { */ minRows: PropTypes.oneOfType([PropTypes.number, PropTypes.string]), /** - * If `true`, a [TextareaAutosize](/material-ui/react-textarea-autosize/) element is rendered. + * If `true`, a [TextareaAutosize](https://mui.com/material-ui/react-textarea-autosize/) element is rendered. * @default false */ multiline: PropTypes.bool, diff --git a/packages/mui-material/src/Input/index.js b/packages/mui-material/src/Input/index.js index 58f1c4e3d0cd62..b32ad177dd8e11 100644 --- a/packages/mui-material/src/Input/index.js +++ b/packages/mui-material/src/Input/index.js @@ -1,4 +1,3 @@ -'use client'; export { default } from './Input'; export { default as inputClasses } from './inputClasses'; export * from './inputClasses'; diff --git a/packages/mui-material/src/InputAdornment/InputAdornment.d.ts b/packages/mui-material/src/InputAdornment/InputAdornment.d.ts index 15707df2a38af9..14ad4b05d3f00d 100644 --- a/packages/mui-material/src/InputAdornment/InputAdornment.d.ts +++ b/packages/mui-material/src/InputAdornment/InputAdornment.d.ts @@ -51,11 +51,11 @@ export interface InputAdornmentTypeMap< * * Demos: * - * - [Text Field](https://next.mui.com/material-ui/react-text-field/) + * - [Text Field](https://mui.com/material-ui/react-text-field/) * * API: * - * - [InputAdornment API](https://next.mui.com/material-ui/api/input-adornment/) + * - [InputAdornment API](https://mui.com/material-ui/api/input-adornment/) */ declare const InputAdornment: OverridableComponent<InputAdornmentTypeMap>; diff --git a/packages/mui-material/src/InputAdornment/index.js b/packages/mui-material/src/InputAdornment/index.js index e8757bd82b4074..b1e7375e2c5564 100644 --- a/packages/mui-material/src/InputAdornment/index.js +++ b/packages/mui-material/src/InputAdornment/index.js @@ -1,4 +1,3 @@ -'use client'; export { default } from './InputAdornment'; export { default as inputAdornmentClasses } from './inputAdornmentClasses'; diff --git a/packages/mui-material/src/InputBase/InputBase.d.ts b/packages/mui-material/src/InputBase/InputBase.d.ts index 5f5b743cae7b0b..31908f1c8546c4 100644 --- a/packages/mui-material/src/InputBase/InputBase.d.ts +++ b/packages/mui-material/src/InputBase/InputBase.d.ts @@ -56,7 +56,7 @@ export interface InputBaseProps /** * The components used for each slot inside. * - * @deprecated use the `slots` prop instead. This prop will be removed in v7. See [Migrating from deprecated APIs](/material-ui/migration/migrating-from-deprecated-apis/) for more details. + * @deprecated use the `slots` prop instead. This prop will be removed in v7. See [Migrating from deprecated APIs](https://mui.com/material-ui/migration/migrating-from-deprecated-apis/) for more details. * * @default {} */ @@ -68,7 +68,7 @@ export interface InputBaseProps * The extra props for the slot components. * You can override the existing props or add new ones. * - * @deprecated use the `slotProps` prop instead. This prop will be removed in v7. See [Migrating from deprecated APIs](/material-ui/migration/migrating-from-deprecated-apis/) for more details. + * @deprecated use the `slotProps` prop instead. This prop will be removed in v7. See [Migrating from deprecated APIs](https://mui.com/material-ui/migration/migrating-from-deprecated-apis/) for more details. * * @default {} */ @@ -131,7 +131,7 @@ export interface InputBaseProps */ margin?: 'dense' | 'none'; /** - * If `true`, a [TextareaAutosize](/material-ui/react-textarea-autosize/) element is rendered. + * If `true`, a [TextareaAutosize](https://mui.com/material-ui/react-textarea-autosize/) element is rendered. * @default false */ multiline?: boolean; @@ -255,10 +255,10 @@ export interface InputBaseComponentProps * * Demos: * - * - [Text Field](https://next.mui.com/material-ui/react-text-field/) + * - [Text Field](https://mui.com/material-ui/react-text-field/) * * API: * - * - [InputBase API](https://next.mui.com/material-ui/api/input-base/) + * - [InputBase API](https://mui.com/material-ui/api/input-base/) */ export default function InputBase(props: InputBaseProps): React.JSX.Element; diff --git a/packages/mui-material/src/InputBase/InputBase.js b/packages/mui-material/src/InputBase/InputBase.js index 5f9c6cd0ba8816..a216b4a2897afb 100644 --- a/packages/mui-material/src/InputBase/InputBase.js +++ b/packages/mui-material/src/InputBase/InputBase.js @@ -644,7 +644,7 @@ InputBase.propTypes /* remove-proptypes */ = { /** * The components used for each slot inside. * - * @deprecated use the `slots` prop instead. This prop will be removed in v7. See [Migrating from deprecated APIs](/material-ui/migration/migrating-from-deprecated-apis/) for more details. + * @deprecated use the `slots` prop instead. This prop will be removed in v7. See [Migrating from deprecated APIs](https://mui.com/material-ui/migration/migrating-from-deprecated-apis/) for more details. * * @default {} */ @@ -656,7 +656,7 @@ InputBase.propTypes /* remove-proptypes */ = { * The extra props for the slot components. * You can override the existing props or add new ones. * - * @deprecated use the `slotProps` prop instead. This prop will be removed in v7. See [Migrating from deprecated APIs](/material-ui/migration/migrating-from-deprecated-apis/) for more details. + * @deprecated use the `slotProps` prop instead. This prop will be removed in v7. See [Migrating from deprecated APIs](https://mui.com/material-ui/migration/migrating-from-deprecated-apis/) for more details. * * @default {} */ @@ -727,7 +727,7 @@ InputBase.propTypes /* remove-proptypes */ = { */ minRows: PropTypes.oneOfType([PropTypes.number, PropTypes.string]), /** - * If `true`, a [TextareaAutosize](/material-ui/react-textarea-autosize/) element is rendered. + * If `true`, a [TextareaAutosize](https://mui.com/material-ui/react-textarea-autosize/) element is rendered. * @default false */ multiline: PropTypes.bool, diff --git a/packages/mui-material/src/InputBase/index.js b/packages/mui-material/src/InputBase/index.js index 305647eb07d08b..c2fae1fb233b41 100644 --- a/packages/mui-material/src/InputBase/index.js +++ b/packages/mui-material/src/InputBase/index.js @@ -1,4 +1,3 @@ -'use client'; export { default } from './InputBase'; export { default as inputBaseClasses } from './inputBaseClasses'; diff --git a/packages/mui-material/src/InputLabel/InputLabel.d.ts b/packages/mui-material/src/InputLabel/InputLabel.d.ts index e18e64c09178f5..d35c933cac7be5 100644 --- a/packages/mui-material/src/InputLabel/InputLabel.d.ts +++ b/packages/mui-material/src/InputLabel/InputLabel.d.ts @@ -71,12 +71,12 @@ export type InputLabelTypeMap< * * Demos: * - * - [Text Field](https://next.mui.com/material-ui/react-text-field/) + * - [Text Field](https://mui.com/material-ui/react-text-field/) * * API: * - * - [InputLabel API](https://next.mui.com/material-ui/api/input-label/) - * - inherits [FormLabel API](https://next.mui.com/material-ui/api/form-label/) + * - [InputLabel API](https://mui.com/material-ui/api/input-label/) + * - inherits [FormLabel API](https://mui.com/material-ui/api/form-label/) */ declare const InputLabel: OverridableComponent<InputLabelTypeMap>; diff --git a/packages/mui-material/src/InputLabel/index.js b/packages/mui-material/src/InputLabel/index.js index f1050f1d809098..70140e12a84000 100644 --- a/packages/mui-material/src/InputLabel/index.js +++ b/packages/mui-material/src/InputLabel/index.js @@ -1,4 +1,3 @@ -'use client'; export { default } from './InputLabel'; export { default as inputLabelClasses } from './inputLabelClasses'; diff --git a/packages/mui-material/src/LinearProgress/LinearProgress.d.ts b/packages/mui-material/src/LinearProgress/LinearProgress.d.ts index f2cca1efb4dac5..58e7a73e9e80c5 100644 --- a/packages/mui-material/src/LinearProgress/LinearProgress.d.ts +++ b/packages/mui-material/src/LinearProgress/LinearProgress.d.ts @@ -53,10 +53,10 @@ export interface LinearProgressProps * * Demos: * - * - [Progress](https://next.mui.com/material-ui/react-progress/) + * - [Progress](https://mui.com/material-ui/react-progress/) * * API: * - * - [LinearProgress API](https://next.mui.com/material-ui/api/linear-progress/) + * - [LinearProgress API](https://mui.com/material-ui/api/linear-progress/) */ export default function LinearProgress(props: LinearProgressProps): React.JSX.Element; diff --git a/packages/mui-material/src/LinearProgress/index.js b/packages/mui-material/src/LinearProgress/index.js index afb73ef3020a9c..e3f2818ef6e399 100644 --- a/packages/mui-material/src/LinearProgress/index.js +++ b/packages/mui-material/src/LinearProgress/index.js @@ -1,4 +1,3 @@ -'use client'; export { default } from './LinearProgress'; export { default as linearProgressClasses } from './linearProgressClasses'; diff --git a/packages/mui-material/src/Link/Link.d.ts b/packages/mui-material/src/Link/Link.d.ts index 4b00c47107d136..d144f31447d7ff 100644 --- a/packages/mui-material/src/Link/Link.d.ts +++ b/packages/mui-material/src/Link/Link.d.ts @@ -25,7 +25,7 @@ export interface LinkOwnProps extends DistributiveOmit<LinkBaseProps, 'classes'> */ sx?: SxProps<Theme>; /** - * `classes` prop applied to the [`Typography`](/material-ui/api/typography/) element. + * `classes` prop applied to the [`Typography`](https://mui.com/material-ui/api/typography/) element. */ TypographyClasses?: TypographyOwnProps['classes']; /** @@ -49,13 +49,13 @@ export interface LinkTypeMap<AdditionalProps = {}, RootComponent extends React.E * * Demos: * - * - [Breadcrumbs](https://next.mui.com/material-ui/react-breadcrumbs/) - * - [Links](https://next.mui.com/material-ui/react-link/) + * - [Breadcrumbs](https://mui.com/material-ui/react-breadcrumbs/) + * - [Links](https://mui.com/material-ui/react-link/) * * API: * - * - [Link API](https://next.mui.com/material-ui/api/link/) - * - inherits [Typography API](https://next.mui.com/material-ui/api/typography/) + * - [Link API](https://mui.com/material-ui/api/link/) + * - inherits [Typography API](https://mui.com/material-ui/api/typography/) */ declare const Link: OverridableComponent<LinkTypeMap>; diff --git a/packages/mui-material/src/Link/Link.js b/packages/mui-material/src/Link/Link.js index 456c5b20805a2e..a3b9a1829ac86e 100644 --- a/packages/mui-material/src/Link/Link.js +++ b/packages/mui-material/src/Link/Link.js @@ -296,7 +296,7 @@ Link.propTypes /* remove-proptypes */ = { PropTypes.object, ]), /** - * `classes` prop applied to the [`Typography`](/material-ui/api/typography/) element. + * `classes` prop applied to the [`Typography`](https://mui.com/material-ui/api/typography/) element. */ TypographyClasses: PropTypes.object, /** diff --git a/packages/mui-material/src/Link/index.js b/packages/mui-material/src/Link/index.js index 4af7cb278e648d..a9ab204b20f140 100644 --- a/packages/mui-material/src/Link/index.js +++ b/packages/mui-material/src/Link/index.js @@ -1,4 +1,3 @@ -'use client'; export { default } from './Link'; export { default as linkClasses } from './linkClasses'; diff --git a/packages/mui-material/src/List/List.d.ts b/packages/mui-material/src/List/List.d.ts index 720a6bba7fa675..19b0aaa68cbd94 100644 --- a/packages/mui-material/src/List/List.d.ts +++ b/packages/mui-material/src/List/List.d.ts @@ -56,12 +56,12 @@ export type ExtendList<TypeMap extends OverridableTypeMap> = OverridableComponen * * Demos: * - * - [Lists](https://next.mui.com/material-ui/react-list/) - * - [Transfer List](https://next.mui.com/material-ui/react-transfer-list/) + * - [Lists](https://mui.com/material-ui/react-list/) + * - [Transfer List](https://mui.com/material-ui/react-transfer-list/) * * API: * - * - [List API](https://next.mui.com/material-ui/api/list/) + * - [List API](https://mui.com/material-ui/api/list/) */ declare const List: ExtendList<ListTypeMap>; diff --git a/packages/mui-material/src/List/index.js b/packages/mui-material/src/List/index.js index b8789a9b10e3ce..6435a92475c14f 100644 --- a/packages/mui-material/src/List/index.js +++ b/packages/mui-material/src/List/index.js @@ -1,4 +1,3 @@ -'use client'; export { default } from './List'; export { default as listClasses } from './listClasses'; diff --git a/packages/mui-material/src/ListItem/ListItem.d.ts b/packages/mui-material/src/ListItem/ListItem.d.ts index 59da2dee9b6e5b..1afb1e7d48e9b6 100644 --- a/packages/mui-material/src/ListItem/ListItem.d.ts +++ b/packages/mui-material/src/ListItem/ListItem.d.ts @@ -27,13 +27,13 @@ export interface ListItemBaseProps { /** * The container component used when a `ListItemSecondaryAction` is the last child. * @default 'li' - * @deprecated Use the `component` or `slots.root` prop instead. This prop will be removed in v7. See [Migrating from deprecated APIs](/material-ui/migration/migrating-from-deprecated-apis/) for more details. + * @deprecated Use the `component` or `slots.root` prop instead. This prop will be removed in v7. See [Migrating from deprecated APIs](https://mui.com/material-ui/migration/migrating-from-deprecated-apis/) for more details. */ ContainerComponent?: React.ElementType<React.HTMLAttributes<HTMLDivElement>>; /** * Props applied to the container component if used. * @default {} - * @deprecated Use the `slotProps.root` prop instead. This prop will be removed in v7. See [Migrating from deprecated APIs](/material-ui/migration/migrating-from-deprecated-apis/) for more details. + * @deprecated Use the `slotProps.root` prop instead. This prop will be removed in v7. See [Migrating from deprecated APIs](https://mui.com/material-ui/migration/migrating-from-deprecated-apis/) for more details. */ ContainerProps?: React.HTMLAttributes<HTMLDivElement>; /** @@ -71,7 +71,7 @@ export interface ListItemOwnProps extends ListItemBaseProps { /** * The components used for each slot inside. * - * @deprecated Use the `slots` prop instead. This prop will be removed in v7. See [Migrating from deprecated APIs](/material-ui/migration/migrating-from-deprecated-apis/) for more details. + * @deprecated Use the `slots` prop instead. This prop will be removed in v7. See [Migrating from deprecated APIs](https://mui.com/material-ui/migration/migrating-from-deprecated-apis/) for more details. * @default {} */ components?: { @@ -81,7 +81,7 @@ export interface ListItemOwnProps extends ListItemBaseProps { * The extra props for the slot components. * You can override the existing props or add new ones. * - * @deprecated Use the `slotProps` prop instead. This prop will be removed in v7. See [Migrating from deprecated APIs](/material-ui/migration/migrating-from-deprecated-apis/) for more details. + * @deprecated Use the `slotProps` prop instead. This prop will be removed in v7. See [Migrating from deprecated APIs](https://mui.com/material-ui/migration/migrating-from-deprecated-apis/) for more details. * @default {} */ componentsProps?: { @@ -116,12 +116,12 @@ export interface ListItemTypeMap<AdditionalProps, RootComponent extends React.El * * Demos: * - * - [Lists](https://next.mui.com/material-ui/react-list/) - * - [Transfer List](https://next.mui.com/material-ui/react-transfer-list/) + * - [Lists](https://mui.com/material-ui/react-list/) + * - [Transfer List](https://mui.com/material-ui/react-transfer-list/) * * API: * - * - [ListItem API](https://next.mui.com/material-ui/api/list-item/) + * - [ListItem API](https://mui.com/material-ui/api/list-item/) */ declare const ListItem: OverridableComponent<ListItemTypeMap<{}, 'li'>>; diff --git a/packages/mui-material/src/ListItem/ListItem.js b/packages/mui-material/src/ListItem/ListItem.js index efb7fc11f42f44..20c0d136413dee 100644 --- a/packages/mui-material/src/ListItem/ListItem.js +++ b/packages/mui-material/src/ListItem/ListItem.js @@ -337,7 +337,7 @@ ListItem.propTypes /* remove-proptypes */ = { /** * The components used for each slot inside. * - * @deprecated Use the `slots` prop instead. This prop will be removed in v7. See [Migrating from deprecated APIs](/material-ui/migration/migrating-from-deprecated-apis/) for more details. + * @deprecated Use the `slots` prop instead. This prop will be removed in v7. See [Migrating from deprecated APIs](https://mui.com/material-ui/migration/migrating-from-deprecated-apis/) for more details. * @default {} */ components: PropTypes.shape({ @@ -347,7 +347,7 @@ ListItem.propTypes /* remove-proptypes */ = { * The extra props for the slot components. * You can override the existing props or add new ones. * - * @deprecated Use the `slotProps` prop instead. This prop will be removed in v7. See [Migrating from deprecated APIs](/material-ui/migration/migrating-from-deprecated-apis/) for more details. + * @deprecated Use the `slotProps` prop instead. This prop will be removed in v7. See [Migrating from deprecated APIs](https://mui.com/material-ui/migration/migrating-from-deprecated-apis/) for more details. * @default {} */ componentsProps: PropTypes.shape({ @@ -356,13 +356,13 @@ ListItem.propTypes /* remove-proptypes */ = { /** * The container component used when a `ListItemSecondaryAction` is the last child. * @default 'li' - * @deprecated Use the `component` or `slots.root` prop instead. This prop will be removed in v7. See [Migrating from deprecated APIs](/material-ui/migration/migrating-from-deprecated-apis/) for more details. + * @deprecated Use the `component` or `slots.root` prop instead. This prop will be removed in v7. See [Migrating from deprecated APIs](https://mui.com/material-ui/migration/migrating-from-deprecated-apis/) for more details. */ ContainerComponent: elementTypeAcceptingRef, /** * Props applied to the container component if used. * @default {} - * @deprecated Use the `slotProps.root` prop instead. This prop will be removed in v7. See [Migrating from deprecated APIs](/material-ui/migration/migrating-from-deprecated-apis/) for more details. + * @deprecated Use the `slotProps.root` prop instead. This prop will be removed in v7. See [Migrating from deprecated APIs](https://mui.com/material-ui/migration/migrating-from-deprecated-apis/) for more details. */ ContainerProps: PropTypes.object, /** diff --git a/packages/mui-material/src/ListItem/index.js b/packages/mui-material/src/ListItem/index.js index 911c835b6b5887..90fc1a201efd55 100644 --- a/packages/mui-material/src/ListItem/index.js +++ b/packages/mui-material/src/ListItem/index.js @@ -1,4 +1,3 @@ -'use client'; export { default } from './ListItem'; export { default as listItemClasses } from './listItemClasses'; diff --git a/packages/mui-material/src/ListItemAvatar/ListItemAvatar.d.ts b/packages/mui-material/src/ListItemAvatar/ListItemAvatar.d.ts index 0aaae64028fa2d..5a13d4c9d5d8de 100644 --- a/packages/mui-material/src/ListItemAvatar/ListItemAvatar.d.ts +++ b/packages/mui-material/src/ListItemAvatar/ListItemAvatar.d.ts @@ -22,10 +22,10 @@ export interface ListItemAvatarProps extends StandardProps<React.HTMLAttributes< * * Demos: * - * - [Lists](https://next.mui.com/material-ui/react-list/) + * - [Lists](https://mui.com/material-ui/react-list/) * * API: * - * - [ListItemAvatar API](https://next.mui.com/material-ui/api/list-item-avatar/) + * - [ListItemAvatar API](https://mui.com/material-ui/api/list-item-avatar/) */ export default function ListItemAvatar(props: ListItemAvatarProps): React.JSX.Element; diff --git a/packages/mui-material/src/ListItemAvatar/index.js b/packages/mui-material/src/ListItemAvatar/index.js index 7193ec97998512..767e616b6cf072 100644 --- a/packages/mui-material/src/ListItemAvatar/index.js +++ b/packages/mui-material/src/ListItemAvatar/index.js @@ -1,4 +1,3 @@ -'use client'; export { default } from './ListItemAvatar'; export { default as listItemAvatarClasses } from './listItemAvatarClasses'; diff --git a/packages/mui-material/src/ListItemButton/ListItemButton.d.ts b/packages/mui-material/src/ListItemButton/ListItemButton.d.ts index 555fb5ecc6b7b4..9172789eaa7ea1 100644 --- a/packages/mui-material/src/ListItemButton/ListItemButton.d.ts +++ b/packages/mui-material/src/ListItemButton/ListItemButton.d.ts @@ -76,12 +76,12 @@ export type ListItemButtonTypeMap< * * Demos: * - * - [Lists](https://next.mui.com/material-ui/react-list/) + * - [Lists](https://mui.com/material-ui/react-list/) * * API: * - * - [ListItemButton API](https://next.mui.com/material-ui/api/list-item-button/) - * - inherits [ButtonBase API](https://next.mui.com/material-ui/api/button-base/) + * - [ListItemButton API](https://mui.com/material-ui/api/list-item-button/) + * - inherits [ButtonBase API](https://mui.com/material-ui/api/button-base/) */ declare const ListItemButton: ExtendButtonBase<ListItemButtonTypeMap>; diff --git a/packages/mui-material/src/ListItemButton/index.js b/packages/mui-material/src/ListItemButton/index.js index 5af1d8f49e1c43..feb9791f4194cc 100644 --- a/packages/mui-material/src/ListItemButton/index.js +++ b/packages/mui-material/src/ListItemButton/index.js @@ -1,4 +1,3 @@ -'use client'; export { default } from './ListItemButton'; export { default as listItemButtonClasses } from './listItemButtonClasses'; diff --git a/packages/mui-material/src/ListItemIcon/ListItemIcon.d.ts b/packages/mui-material/src/ListItemIcon/ListItemIcon.d.ts index 15e5c5cbd0f33c..076ca13b5513eb 100644 --- a/packages/mui-material/src/ListItemIcon/ListItemIcon.d.ts +++ b/packages/mui-material/src/ListItemIcon/ListItemIcon.d.ts @@ -24,10 +24,10 @@ export interface ListItemIconProps extends StandardProps<React.HTMLAttributes<HT * * Demos: * - * - [Lists](https://next.mui.com/material-ui/react-list/) + * - [Lists](https://mui.com/material-ui/react-list/) * * API: * - * - [ListItemIcon API](https://next.mui.com/material-ui/api/list-item-icon/) + * - [ListItemIcon API](https://mui.com/material-ui/api/list-item-icon/) */ export default function ListItemIcon(props: ListItemIconProps): React.JSX.Element; diff --git a/packages/mui-material/src/ListItemIcon/index.js b/packages/mui-material/src/ListItemIcon/index.js index 62c8390c58ff7c..04bfa6c394a0f9 100644 --- a/packages/mui-material/src/ListItemIcon/index.js +++ b/packages/mui-material/src/ListItemIcon/index.js @@ -1,4 +1,3 @@ -'use client'; export { default } from './ListItemIcon'; export { default as listItemIconClasses } from './listItemIconClasses'; diff --git a/packages/mui-material/src/ListItemSecondaryAction/ListItemSecondaryAction.d.ts b/packages/mui-material/src/ListItemSecondaryAction/ListItemSecondaryAction.d.ts index d893e7ec6ce026..e87e7c2c8cfd0c 100644 --- a/packages/mui-material/src/ListItemSecondaryAction/ListItemSecondaryAction.d.ts +++ b/packages/mui-material/src/ListItemSecondaryAction/ListItemSecondaryAction.d.ts @@ -24,13 +24,13 @@ export interface ListItemSecondaryActionProps * * Demos: * - * - [Lists](https://next.mui.com/material-ui/react-list/) + * - [Lists](https://mui.com/material-ui/react-list/) * * API: * - * - [ListItemSecondaryAction API](https://next.mui.com/material-ui/api/list-item-secondary-action/) + * - [ListItemSecondaryAction API](https://mui.com/material-ui/api/list-item-secondary-action/) * - * @deprecated Use the `secondaryAction` prop in the `ListItem` component instead. This component will be removed in v7. See [Migrating from deprecated APIs](/material-ui/migration/migrating-from-deprecated-apis/) for more details. + * @deprecated Use the `secondaryAction` prop in the `ListItem` component instead. This component will be removed in v7. See [Migrating from deprecated APIs](https://mui.com/material-ui/migration/migrating-from-deprecated-apis/) for more details. */ declare const ListItemSecondaryAction: (( props: ListItemSecondaryActionProps, diff --git a/packages/mui-material/src/ListItemSecondaryAction/ListItemSecondaryAction.js b/packages/mui-material/src/ListItemSecondaryAction/ListItemSecondaryAction.js index b8269bbf09937a..27ae8522801536 100644 --- a/packages/mui-material/src/ListItemSecondaryAction/ListItemSecondaryAction.js +++ b/packages/mui-material/src/ListItemSecondaryAction/ListItemSecondaryAction.js @@ -44,7 +44,7 @@ const ListItemSecondaryActionRoot = styled('div', { /** * Must be used as the last child of ListItem to function properly. * - * @deprecated Use the `secondaryAction` prop in the `ListItem` component instead. This component will be removed in v7. See [Migrating from deprecated APIs](/material-ui/migration/migrating-from-deprecated-apis/) for more details. + * @deprecated Use the `secondaryAction` prop in the `ListItem` component instead. This component will be removed in v7. See [Migrating from deprecated APIs](https://mui.com/material-ui/migration/migrating-from-deprecated-apis/) for more details. */ const ListItemSecondaryAction = React.forwardRef(function ListItemSecondaryAction(inProps, ref) { const props = useDefaultProps({ props: inProps, name: 'MuiListItemSecondaryAction' }); diff --git a/packages/mui-material/src/ListItemSecondaryAction/index.js b/packages/mui-material/src/ListItemSecondaryAction/index.js index 97f6c675e650e7..2c4dd3899448ba 100644 --- a/packages/mui-material/src/ListItemSecondaryAction/index.js +++ b/packages/mui-material/src/ListItemSecondaryAction/index.js @@ -1,4 +1,3 @@ -'use client'; export { default } from './ListItemSecondaryAction'; export { default as listItemSecondaryActionClasses } from './listItemSecondaryActionClasses'; diff --git a/packages/mui-material/src/ListItemText/ListItemText.d.ts b/packages/mui-material/src/ListItemText/ListItemText.d.ts index 511b3621b6881b..f99f467ec6b74c 100644 --- a/packages/mui-material/src/ListItemText/ListItemText.d.ts +++ b/packages/mui-material/src/ListItemText/ListItemText.d.ts @@ -64,11 +64,11 @@ export interface ListItemTextProps< * * Demos: * - * - [Lists](https://next.mui.com/material-ui/react-list/) + * - [Lists](https://mui.com/material-ui/react-list/) * * API: * - * - [ListItemText API](https://next.mui.com/material-ui/api/list-item-text/) + * - [ListItemText API](https://mui.com/material-ui/api/list-item-text/) */ export default function ListItemText< PrimaryTypographyComponent extends React.ElementType = 'span', diff --git a/packages/mui-material/src/ListItemText/index.js b/packages/mui-material/src/ListItemText/index.js index f64e13990f8777..2d6364f6b0a84c 100644 --- a/packages/mui-material/src/ListItemText/index.js +++ b/packages/mui-material/src/ListItemText/index.js @@ -1,4 +1,3 @@ -'use client'; export { default } from './ListItemText'; export { default as listItemTextClasses } from './listItemTextClasses'; diff --git a/packages/mui-material/src/ListSubheader/ListSubheader.d.ts b/packages/mui-material/src/ListSubheader/ListSubheader.d.ts index d75853343e7699..266cfab7118953 100644 --- a/packages/mui-material/src/ListSubheader/ListSubheader.d.ts +++ b/packages/mui-material/src/ListSubheader/ListSubheader.d.ts @@ -51,11 +51,11 @@ export interface ListSubheaderTypeMap< * * Demos: * - * - [Lists](https://next.mui.com/material-ui/react-list/) + * - [Lists](https://mui.com/material-ui/react-list/) * * API: * - * - [ListSubheader API](https://next.mui.com/material-ui/api/list-subheader/) + * - [ListSubheader API](https://mui.com/material-ui/api/list-subheader/) */ declare const ListSubheader: OverridableComponent<ListSubheaderTypeMap>; diff --git a/packages/mui-material/src/ListSubheader/index.js b/packages/mui-material/src/ListSubheader/index.js index 4f23484d86d1c6..efc177069c73ee 100644 --- a/packages/mui-material/src/ListSubheader/index.js +++ b/packages/mui-material/src/ListSubheader/index.js @@ -1,4 +1,3 @@ -'use client'; export { default } from './ListSubheader'; export { default as listSubheaderClasses } from './listSubheaderClasses'; diff --git a/packages/mui-material/src/Menu/Menu.d.ts b/packages/mui-material/src/Menu/Menu.d.ts index c00618b5b03657..9170b8ba9aaa7a 100644 --- a/packages/mui-material/src/Menu/Menu.d.ts +++ b/packages/mui-material/src/Menu/Menu.d.ts @@ -39,7 +39,7 @@ export interface MenuProps extends StandardProps<PopoverProps> { */ disableAutoFocusItem?: boolean; /** - * Props applied to the [`MenuList`](/material-ui/api/menu-list/) element. + * Props applied to the [`MenuList`](https://mui.com/material-ui/api/menu-list/) element. * @default {} */ MenuListProps?: Partial<MenuListProps>; @@ -55,7 +55,7 @@ export interface MenuProps extends StandardProps<PopoverProps> { */ open: boolean; /** - * `classes` prop applied to the [`Popover`](/material-ui/api/popover/) element. + * `classes` prop applied to the [`Popover`](https://mui.com/material-ui/api/popover/) element. */ PopoverClasses?: PopoverProps['classes']; /** @@ -86,12 +86,12 @@ export declare const MenuPaper: React.FC<PaperProps>; * * Demos: * - * - [App Bar](https://next.mui.com/material-ui/react-app-bar/) - * - [Menu](https://next.mui.com/material-ui/react-menu/) + * - [App Bar](https://mui.com/material-ui/react-app-bar/) + * - [Menu](https://mui.com/material-ui/react-menu/) * * API: * - * - [Menu API](https://next.mui.com/material-ui/api/menu/) - * - inherits [Popover API](https://next.mui.com/material-ui/api/popover/) + * - [Menu API](https://mui.com/material-ui/api/menu/) + * - inherits [Popover API](https://mui.com/material-ui/api/popover/) */ export default function Menu(props: MenuProps): React.JSX.Element; diff --git a/packages/mui-material/src/Menu/Menu.js b/packages/mui-material/src/Menu/Menu.js index 74a39c3c870886..15342819d76647 100644 --- a/packages/mui-material/src/Menu/Menu.js +++ b/packages/mui-material/src/Menu/Menu.js @@ -260,7 +260,7 @@ Menu.propTypes /* remove-proptypes */ = { */ disableAutoFocusItem: PropTypes.bool, /** - * Props applied to the [`MenuList`](/material-ui/api/menu-list/) element. + * Props applied to the [`MenuList`](https://mui.com/material-ui/api/menu-list/) element. * @default {} */ MenuListProps: PropTypes.object, @@ -280,7 +280,7 @@ Menu.propTypes /* remove-proptypes */ = { */ PaperProps: PropTypes.object, /** - * `classes` prop applied to the [`Popover`](/material-ui/api/popover/) element. + * `classes` prop applied to the [`Popover`](https://mui.com/material-ui/api/popover/) element. */ PopoverClasses: PropTypes.object, /** diff --git a/packages/mui-material/src/Menu/index.js b/packages/mui-material/src/Menu/index.js index 2d9ed62e36c32c..036a988742c854 100644 --- a/packages/mui-material/src/Menu/index.js +++ b/packages/mui-material/src/Menu/index.js @@ -1,4 +1,3 @@ -'use client'; export { default } from './Menu'; export { default as menuClasses } from './menuClasses'; diff --git a/packages/mui-material/src/MenuItem/MenuItem.d.ts b/packages/mui-material/src/MenuItem/MenuItem.d.ts index 5915662f5ff037..76f2fe665f8070 100644 --- a/packages/mui-material/src/MenuItem/MenuItem.d.ts +++ b/packages/mui-material/src/MenuItem/MenuItem.d.ts @@ -60,12 +60,12 @@ export type MenuItemTypeMap< * * Demos: * - * - [Menu](https://next.mui.com/material-ui/react-menu/) + * - [Menu](https://mui.com/material-ui/react-menu/) * * API: * - * - [MenuItem API](https://next.mui.com/material-ui/api/menu-item/) - * - inherits [ButtonBase API](https://next.mui.com/material-ui/api/button-base/) + * - [MenuItem API](https://mui.com/material-ui/api/menu-item/) + * - inherits [ButtonBase API](https://mui.com/material-ui/api/button-base/) */ declare const MenuItem: ExtendButtonBase<MenuItemTypeMap>; diff --git a/packages/mui-material/src/MenuItem/index.js b/packages/mui-material/src/MenuItem/index.js index a53c62cb82c8fe..ec789a4b43b2a9 100644 --- a/packages/mui-material/src/MenuItem/index.js +++ b/packages/mui-material/src/MenuItem/index.js @@ -1,4 +1,3 @@ -'use client'; export { default } from './MenuItem'; export * from './menuItemClasses'; diff --git a/packages/mui-material/src/MenuList/MenuList.d.ts b/packages/mui-material/src/MenuList/MenuList.d.ts index 5f8a4e585ae3f4..f177efc71b9cb6 100644 --- a/packages/mui-material/src/MenuList/MenuList.d.ts +++ b/packages/mui-material/src/MenuList/MenuList.d.ts @@ -48,18 +48,18 @@ export type MenuListClassKey = keyof NonNullable<MenuListTypeMap['props']['class /** * A permanently displayed menu following https://www.w3.org/WAI/ARIA/apg/patterns/menu-button/. - * It's exposed to help customization of the [`Menu`](https://next.mui.com/material-ui/api/menu/) component if you + * It's exposed to help customization of the [`Menu`](https://mui.com/material-ui/api/menu/) component if you * use it separately you need to move focus into the component manually. Once * the focus is placed inside the component it is fully keyboard accessible. * * Demos: * - * - [Menu](https://next.mui.com/material-ui/react-menu/) + * - [Menu](https://mui.com/material-ui/react-menu/) * * API: * - * - [MenuList API](https://next.mui.com/material-ui/api/menu-list/) - * - inherits [List API](https://next.mui.com/material-ui/api/list/) + * - [MenuList API](https://mui.com/material-ui/api/menu-list/) + * - inherits [List API](https://mui.com/material-ui/api/list/) */ declare const MenuList: ExtendList<MenuListTypeMap>; diff --git a/packages/mui-material/src/MenuList/MenuList.js b/packages/mui-material/src/MenuList/MenuList.js index dcb0a4efa03f03..595c4849c5ce45 100644 --- a/packages/mui-material/src/MenuList/MenuList.js +++ b/packages/mui-material/src/MenuList/MenuList.js @@ -144,6 +144,16 @@ const MenuList = React.forwardRef(function MenuList(props, ref) { const handleKeyDown = (event) => { const list = listRef.current; const key = event.key; + const isModifierKeyPressed = event.ctrlKey || event.metaKey || event.altKey; + + if (isModifierKeyPressed) { + if (onKeyDown) { + onKeyDown(event); + } + + return; + } + /** * @type {Element} - will always be defined since we are in a keydown handler * attached to an element. A keydown event is either dispatched to the activeElement diff --git a/packages/mui-material/src/MenuList/index.js b/packages/mui-material/src/MenuList/index.js index 87fbe8b70a5454..f6fe3944910fb0 100644 --- a/packages/mui-material/src/MenuList/index.js +++ b/packages/mui-material/src/MenuList/index.js @@ -1,2 +1 @@ -'use client'; export { default } from './MenuList'; diff --git a/packages/mui-material/src/MobileStepper/MobileStepper.d.ts b/packages/mui-material/src/MobileStepper/MobileStepper.d.ts index 4dd737cda97675..9a05cabb4b9b5d 100644 --- a/packages/mui-material/src/MobileStepper/MobileStepper.d.ts +++ b/packages/mui-material/src/MobileStepper/MobileStepper.d.ts @@ -52,11 +52,11 @@ export interface MobileStepperProps extends StandardProps<PaperProps, 'children' * * Demos: * - * - [Stepper](https://next.mui.com/material-ui/react-stepper/) + * - [Stepper](https://mui.com/material-ui/react-stepper/) * * API: * - * - [MobileStepper API](https://next.mui.com/material-ui/api/mobile-stepper/) - * - inherits [Paper API](https://next.mui.com/material-ui/api/paper/) + * - [MobileStepper API](https://mui.com/material-ui/api/mobile-stepper/) + * - inherits [Paper API](https://mui.com/material-ui/api/paper/) */ export default function MobileStepper(props: MobileStepperProps): React.JSX.Element; diff --git a/packages/mui-material/src/MobileStepper/index.js b/packages/mui-material/src/MobileStepper/index.js index c157b25d88b40a..ef2f34beedbca9 100644 --- a/packages/mui-material/src/MobileStepper/index.js +++ b/packages/mui-material/src/MobileStepper/index.js @@ -1,4 +1,3 @@ -'use client'; export { default } from './MobileStepper'; export { default as mobileStepperClasses } from './mobileStepperClasses'; diff --git a/packages/mui-material/src/Modal/Modal.d.ts b/packages/mui-material/src/Modal/Modal.d.ts index 58f064a6f2a8ce..b8c2b731f04326 100644 --- a/packages/mui-material/src/Modal/Modal.d.ts +++ b/packages/mui-material/src/Modal/Modal.d.ts @@ -43,7 +43,7 @@ export interface ModalOwnProps { */ BackdropComponent?: React.ElementType<BackdropProps>; /** - * Props applied to the [`Backdrop`](/material-ui/api/backdrop/) element. + * Props applied to the [`Backdrop`](https://mui.com/material-ui/api/backdrop/) element. * @deprecated Use `slotProps.backdrop` instead. */ BackdropProps?: Partial<BackdropProps>; @@ -67,7 +67,7 @@ export interface ModalOwnProps { /** * The components used for each slot inside. * - * @deprecated Use the `slots` prop instead. This prop will be removed in v7. See [Migrating from deprecated APIs](/material-ui/migration/migrating-from-deprecated-apis/) for more details. + * @deprecated Use the `slots` prop instead. This prop will be removed in v7. See [Migrating from deprecated APIs](https://mui.com/material-ui/migration/migrating-from-deprecated-apis/) for more details. * * @default {} */ @@ -79,7 +79,7 @@ export interface ModalOwnProps { * The extra props for the slot components. * You can override the existing props or add new ones. * - * @deprecated Use the `slotProps` prop instead. This prop will be removed in v7. See [Migrating from deprecated APIs](/material-ui/migration/migrating-from-deprecated-apis/) for more details. + * @deprecated Use the `slotProps` prop instead. This prop will be removed in v7. See [Migrating from deprecated APIs](https://mui.com/material-ui/migration/migrating-from-deprecated-apis/) for more details. * * @default {} */ @@ -211,23 +211,23 @@ export declare const ModalRoot: React.FC<ModalRootProps>; /** * Modal is a lower-level construct that is leveraged by the following components: * - * * [Dialog](https://next.mui.com/material-ui/api/dialog/) - * * [Drawer](https://next.mui.com/material-ui/api/drawer/) - * * [Menu](https://next.mui.com/material-ui/api/menu/) - * * [Popover](https://next.mui.com/material-ui/api/popover/) + * * [Dialog](https://mui.com/material-ui/api/dialog/) + * * [Drawer](https://mui.com/material-ui/api/drawer/) + * * [Menu](https://mui.com/material-ui/api/menu/) + * * [Popover](https://mui.com/material-ui/api/popover/) * - * If you are creating a modal dialog, you probably want to use the [Dialog](https://next.mui.com/material-ui/api/dialog/) component + * If you are creating a modal dialog, you probably want to use the [Dialog](https://mui.com/material-ui/api/dialog/) component * rather than directly using Modal. * * This component shares many concepts with [react-overlays](https://react-bootstrap.github.io/react-overlays/#modals). * * Demos: * - * - [Modal](https://next.mui.com/material-ui/react-modal/) + * - [Modal](https://mui.com/material-ui/react-modal/) * * API: * - * - [Modal API](https://next.mui.com/material-ui/api/modal/) + * - [Modal API](https://mui.com/material-ui/api/modal/) */ declare const Modal: OverridableComponent<ModalTypeMap>; diff --git a/packages/mui-material/src/Modal/Modal.js b/packages/mui-material/src/Modal/Modal.js index e248fe89e410be..60d29549ff74ae 100644 --- a/packages/mui-material/src/Modal/Modal.js +++ b/packages/mui-material/src/Modal/Modal.js @@ -257,7 +257,7 @@ Modal.propTypes /* remove-proptypes */ = { */ BackdropComponent: PropTypes.elementType, /** - * Props applied to the [`Backdrop`](/material-ui/api/backdrop/) element. + * Props applied to the [`Backdrop`](https://mui.com/material-ui/api/backdrop/) element. * @deprecated Use `slotProps.backdrop` instead. */ BackdropProps: PropTypes.object, @@ -286,7 +286,7 @@ Modal.propTypes /* remove-proptypes */ = { /** * The components used for each slot inside. * - * @deprecated Use the `slots` prop instead. This prop will be removed in v7. See [Migrating from deprecated APIs](/material-ui/migration/migrating-from-deprecated-apis/) for more details. + * @deprecated Use the `slots` prop instead. This prop will be removed in v7. See [Migrating from deprecated APIs](https://mui.com/material-ui/migration/migrating-from-deprecated-apis/) for more details. * * @default {} */ @@ -298,7 +298,7 @@ Modal.propTypes /* remove-proptypes */ = { * The extra props for the slot components. * You can override the existing props or add new ones. * - * @deprecated Use the `slotProps` prop instead. This prop will be removed in v7. See [Migrating from deprecated APIs](/material-ui/migration/migrating-from-deprecated-apis/) for more details. + * @deprecated Use the `slotProps` prop instead. This prop will be removed in v7. See [Migrating from deprecated APIs](https://mui.com/material-ui/migration/migrating-from-deprecated-apis/) for more details. * * @default {} */ diff --git a/packages/mui-material/src/Modal/index.js b/packages/mui-material/src/Modal/index.js index c2add9e2091ead..e5d60c85c52dcd 100644 --- a/packages/mui-material/src/Modal/index.js +++ b/packages/mui-material/src/Modal/index.js @@ -1,4 +1,3 @@ -'use client'; export { ModalManager } from './ModalManager'; export { default } from './Modal'; diff --git a/packages/mui-material/src/Modal/useModal.ts b/packages/mui-material/src/Modal/useModal.ts index eb7924d7eab790..5321d2f66ea75b 100644 --- a/packages/mui-material/src/Modal/useModal.ts +++ b/packages/mui-material/src/Modal/useModal.ts @@ -31,11 +31,11 @@ const defaultManager = new ModalManager(); * * Demos: * - * - [Modal](https://next.mui.com/base-ui/react-modal/#hook) + * - [Modal](https://mui.com/base-ui/react-modal/#hook) * * API: * - * - [useModal API](https://next.mui.com/base-ui/react-modal/hooks-api/#use-modal) + * - [useModal API](https://mui.com/base-ui/react-modal/hooks-api/#use-modal) */ function useModal(parameters: UseModalParameters): UseModalReturnValue { const { diff --git a/packages/mui-material/src/NativeSelect/NativeSelect.d.ts b/packages/mui-material/src/NativeSelect/NativeSelect.d.ts index cedb084f32f51b..f2947572a2a2e6 100644 --- a/packages/mui-material/src/NativeSelect/NativeSelect.d.ts +++ b/packages/mui-material/src/NativeSelect/NativeSelect.d.ts @@ -26,7 +26,7 @@ export interface NativeSelectProps * An `Input` element; does not have to be a material-ui specific `Input`. * @default <Input /> */ - input?: React.ReactElement<any, any>; + input?: React.ReactElement<unknown, any>; /** * [Attributes](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/select#attributes) applied to the `select` element. */ @@ -57,12 +57,12 @@ export interface NativeSelectProps * * Demos: * - * - [Select](https://next.mui.com/material-ui/react-select/) + * - [Select](https://mui.com/material-ui/react-select/) * * API: * - * - [NativeSelect API](https://next.mui.com/material-ui/api/native-select/) - * - inherits [Input API](https://next.mui.com/material-ui/api/input/) + * - [NativeSelect API](https://mui.com/material-ui/api/native-select/) + * - inherits [Input API](https://mui.com/material-ui/api/input/) */ declare const NativeSelect: ((props: NativeSelectProps) => React.JSX.Element) & { muiName: string }; diff --git a/packages/mui-material/src/NativeSelect/index.js b/packages/mui-material/src/NativeSelect/index.js index 03010668d0a539..e5e3f3dd584450 100644 --- a/packages/mui-material/src/NativeSelect/index.js +++ b/packages/mui-material/src/NativeSelect/index.js @@ -1,4 +1,3 @@ -'use client'; export { default } from './NativeSelect'; export { default as nativeSelectClasses } from './nativeSelectClasses'; diff --git a/packages/mui-material/src/NoSsr/NoSsr.tsx b/packages/mui-material/src/NoSsr/NoSsr.tsx index 9bf17444706241..c7e2dfbc191a6e 100644 --- a/packages/mui-material/src/NoSsr/NoSsr.tsx +++ b/packages/mui-material/src/NoSsr/NoSsr.tsx @@ -9,18 +9,18 @@ import { NoSsrProps } from './NoSsr.types'; * * This component can be useful in a variety of situations: * - * * Escape hatch for broken dependencies not supporting SSR. - * * Improve the time-to-first paint on the client by only rendering above the fold. - * * Reduce the rendering time on the server. - * * Under too heavy server load, you can turn on service degradation. + * * Escape hatch for broken dependencies not supporting SSR. + * * Improve the time-to-first paint on the client by only rendering above the fold. + * * Reduce the rendering time on the server. + * * Under too heavy server load, you can turn on service degradation. * * Demos: * - * - [No SSR](https://next.mui.com/material-ui/react-no-ssr/) + * - [No SSR](https://mui.com/material-ui/react-no-ssr/) * * API: * - * - [NoSsr API](https://next.mui.com/material-ui/api/no-ssr/) + * - [NoSsr API](https://mui.com/material-ui/api/no-ssr/) */ function NoSsr(props: NoSsrProps): React.JSX.Element { const { children, defer = false, fallback = null } = props; diff --git a/packages/mui-material/src/OutlinedInput/OutlinedInput.d.ts b/packages/mui-material/src/OutlinedInput/OutlinedInput.d.ts index 22a4c69059a155..f8faee63a44db8 100644 --- a/packages/mui-material/src/OutlinedInput/OutlinedInput.d.ts +++ b/packages/mui-material/src/OutlinedInput/OutlinedInput.d.ts @@ -28,12 +28,12 @@ export interface OutlinedInputProps extends StandardProps<InputBaseProps> { * * Demos: * - * - [Text Field](https://next.mui.com/material-ui/react-text-field/) + * - [Text Field](https://mui.com/material-ui/react-text-field/) * * API: * - * - [OutlinedInput API](https://next.mui.com/material-ui/api/outlined-input/) - * - inherits [InputBase API](https://next.mui.com/material-ui/api/input-base/) + * - [OutlinedInput API](https://mui.com/material-ui/api/outlined-input/) + * - inherits [InputBase API](https://mui.com/material-ui/api/input-base/) */ declare const OutlinedInput: ((props: OutlinedInputProps) => React.JSX.Element) & { muiName: string; diff --git a/packages/mui-material/src/OutlinedInput/OutlinedInput.js b/packages/mui-material/src/OutlinedInput/OutlinedInput.js index 8b16238ccef837..01cc3a7fd47e68 100644 --- a/packages/mui-material/src/OutlinedInput/OutlinedInput.js +++ b/packages/mui-material/src/OutlinedInput/OutlinedInput.js @@ -296,7 +296,7 @@ OutlinedInput.propTypes /* remove-proptypes */ = { /** * The components used for each slot inside. * - * @deprecated use the `slots` prop instead. This prop will be removed in v7. See [Migrating from deprecated APIs](/material-ui/migration/migrating-from-deprecated-apis/) for more details. + * @deprecated use the `slots` prop instead. This prop will be removed in v7. See [Migrating from deprecated APIs](https://mui.com/material-ui/migration/migrating-from-deprecated-apis/) for more details. * * @default {} */ @@ -366,7 +366,7 @@ OutlinedInput.propTypes /* remove-proptypes */ = { */ minRows: PropTypes.oneOfType([PropTypes.number, PropTypes.string]), /** - * If `true`, a [TextareaAutosize](/material-ui/react-textarea-autosize/) element is rendered. + * If `true`, a [TextareaAutosize](https://mui.com/material-ui/react-textarea-autosize/) element is rendered. * @default false */ multiline: PropTypes.bool, diff --git a/packages/mui-material/src/OutlinedInput/index.js b/packages/mui-material/src/OutlinedInput/index.js index ba19d9b1b14008..4877ca68a9f8f5 100644 --- a/packages/mui-material/src/OutlinedInput/index.js +++ b/packages/mui-material/src/OutlinedInput/index.js @@ -1,4 +1,3 @@ -'use client'; export { default } from './OutlinedInput'; export { default as outlinedInputClasses } from './outlinedInputClasses'; diff --git a/packages/mui-material/src/Pagination/Pagination.d.ts b/packages/mui-material/src/Pagination/Pagination.d.ts index a20361d6b56e20..d4d3e71340551b 100644 --- a/packages/mui-material/src/Pagination/Pagination.d.ts +++ b/packages/mui-material/src/Pagination/Pagination.d.ts @@ -40,13 +40,17 @@ export interface PaginationProps * Accepts a function which returns a string value that provides a user-friendly name for the current page. * This is important for screen reader users. * - * For localization purposes, you can use the provided [translations](/material-ui/guides/localization/). + * For localization purposes, you can use the provided [translations](https://mui.com/material-ui/guides/localization/). * @param {string} type The link or button type to format ('page' | 'first' | 'last' | 'next' | 'previous' | 'start-ellipsis' | 'end-ellipsis'). Defaults to 'page'. - * @param {number} page The page number to format. - * @param {bool} selected If true, the current page is selected. + * @param {number | null} page The page number to format. + * @param {boolean} selected If true, the current page is selected. * @returns {string} */ - getItemAriaLabel?: (type: UsePaginationItem['type'], page: number, selected: boolean) => string; + getItemAriaLabel?: ( + type: UsePaginationItem['type'], + page: UsePaginationItem['page'], + selected: UsePaginationItem['selected'], + ) => string; /** * Render the item. @@ -80,10 +84,10 @@ export interface PaginationProps * * Demos: * - * - [Pagination](https://next.mui.com/material-ui/react-pagination/) + * - [Pagination](https://mui.com/material-ui/react-pagination/) * * API: * - * - [Pagination API](https://next.mui.com/material-ui/api/pagination/) + * - [Pagination API](https://mui.com/material-ui/api/pagination/) */ export default function Pagination(props: PaginationProps): React.JSX.Element; diff --git a/packages/mui-material/src/Pagination/Pagination.js b/packages/mui-material/src/Pagination/Pagination.js index 56e2610ee2b4e9..0fb9529e81f4cb 100644 --- a/packages/mui-material/src/Pagination/Pagination.js +++ b/packages/mui-material/src/Pagination/Pagination.js @@ -174,10 +174,10 @@ Pagination.propTypes /* remove-proptypes */ = { * Accepts a function which returns a string value that provides a user-friendly name for the current page. * This is important for screen reader users. * - * For localization purposes, you can use the provided [translations](/material-ui/guides/localization/). + * For localization purposes, you can use the provided [translations](https://mui.com/material-ui/guides/localization/). * @param {string} type The link or button type to format ('page' | 'first' | 'last' | 'next' | 'previous' | 'start-ellipsis' | 'end-ellipsis'). Defaults to 'page'. - * @param {number} page The page number to format. - * @param {bool} selected If true, the current page is selected. + * @param {number | null} page The page number to format. + * @param {boolean} selected If true, the current page is selected. * @returns {string} */ getItemAriaLabel: PropTypes.func, diff --git a/packages/mui-material/src/Pagination/index.js b/packages/mui-material/src/Pagination/index.js index 90f89cbe209217..979e9b058c6d34 100644 --- a/packages/mui-material/src/Pagination/index.js +++ b/packages/mui-material/src/Pagination/index.js @@ -1,4 +1,3 @@ -'use client'; export { default } from './Pagination'; export { default as paginationClasses } from './paginationClasses'; diff --git a/packages/mui-material/src/PaginationItem/PaginationItem.d.ts b/packages/mui-material/src/PaginationItem/PaginationItem.d.ts index 2fa9c39736e559..0f013fc9ecd8f6 100644 --- a/packages/mui-material/src/PaginationItem/PaginationItem.d.ts +++ b/packages/mui-material/src/PaginationItem/PaginationItem.d.ts @@ -14,10 +14,10 @@ export interface PaginationItemPropsSizeOverrides {} export interface PaginationItemPropsColorOverrides {} export interface PaginationItemSlots { - first?: React.ElementType; - last?: React.ElementType; - next?: React.ElementType; - previous?: React.ElementType; + first: React.ElementType; + last: React.ElementType; + next: React.ElementType; + previous: React.ElementType; } export type PaginationItemSlotsAndSlotProps = CreateSlotsAndSlotProps< @@ -58,7 +58,7 @@ export interface PaginationItemOwnProps extends PaginationItemSlotsAndSlotProps * It's recommended to use the `slots` prop instead. * * @default {} - * @deprecated use the `slots` prop instead. This prop will be removed in v7. See [Migrating from deprecated APIs](/material-ui/migration/migrating-from-deprecated-apis/) for more details. + * @deprecated use the `slots` prop instead. This prop will be removed in v7. See [Migrating from deprecated APIs](https://mui.com/material-ui/migration/migrating-from-deprecated-apis/) for more details. */ components?: { first?: React.ElementType; @@ -118,11 +118,11 @@ export interface PaginationItemTypeMap< * * Demos: * - * - [Pagination](https://next.mui.com/material-ui/react-pagination/) + * - [Pagination](https://mui.com/material-ui/react-pagination/) * * API: * - * - [PaginationItem API](https://next.mui.com/material-ui/api/pagination-item/) + * - [PaginationItem API](https://mui.com/material-ui/api/pagination-item/) */ declare const PaginationItem: OverridableComponent<PaginationItemTypeMap>; diff --git a/packages/mui-material/src/PaginationItem/PaginationItem.js b/packages/mui-material/src/PaginationItem/PaginationItem.js index 29b696cde6dcb2..76f49942981c6b 100644 --- a/packages/mui-material/src/PaginationItem/PaginationItem.js +++ b/packages/mui-material/src/PaginationItem/PaginationItem.js @@ -462,7 +462,7 @@ PaginationItem.propTypes /* remove-proptypes */ = { * It's recommended to use the `slots` prop instead. * * @default {} - * @deprecated use the `slots` prop instead. This prop will be removed in v7. See [Migrating from deprecated APIs](/material-ui/migration/migrating-from-deprecated-apis/) for more details. + * @deprecated use the `slots` prop instead. This prop will be removed in v7. See [Migrating from deprecated APIs](https://mui.com/material-ui/migration/migrating-from-deprecated-apis/) for more details. */ components: PropTypes.shape({ first: PropTypes.elementType, diff --git a/packages/mui-material/src/PaginationItem/index.js b/packages/mui-material/src/PaginationItem/index.js index 6e723f770cb0da..8cc1e9ecdcc739 100644 --- a/packages/mui-material/src/PaginationItem/index.js +++ b/packages/mui-material/src/PaginationItem/index.js @@ -1,4 +1,3 @@ -'use client'; export { default } from './PaginationItem'; export { default as paginationItemClasses } from './paginationItemClasses'; diff --git a/packages/mui-material/src/Paper/Paper.d.ts b/packages/mui-material/src/Paper/Paper.d.ts index 5c387010ca2f96..4c35061f6e3395 100644 --- a/packages/mui-material/src/Paper/Paper.d.ts +++ b/packages/mui-material/src/Paper/Paper.d.ts @@ -50,12 +50,12 @@ export interface PaperTypeMap< * * Demos: * - * - [Card](https://next.mui.com/material-ui/react-card/) - * - [Paper](https://next.mui.com/material-ui/react-paper/) + * - [Card](https://mui.com/material-ui/react-card/) + * - [Paper](https://mui.com/material-ui/react-paper/) * * API: * - * - [Paper API](https://next.mui.com/material-ui/api/paper/) + * - [Paper API](https://mui.com/material-ui/api/paper/) */ declare const Paper: OverridableComponent<PaperTypeMap>; diff --git a/packages/mui-material/src/Paper/index.js b/packages/mui-material/src/Paper/index.js index dd3c6653b1019c..b9f5f7bf7d77a8 100644 --- a/packages/mui-material/src/Paper/index.js +++ b/packages/mui-material/src/Paper/index.js @@ -1,4 +1,3 @@ -'use client'; export { default } from './Paper'; export { default as paperClasses } from './paperClasses'; diff --git a/packages/mui-material/src/PigmentContainer/PigmentContainer.tsx b/packages/mui-material/src/PigmentContainer/PigmentContainer.tsx index 7e79204a424a49..9ea90947bfe742 100644 --- a/packages/mui-material/src/PigmentContainer/PigmentContainer.tsx +++ b/packages/mui-material/src/PigmentContainer/PigmentContainer.tsx @@ -76,11 +76,11 @@ const useUtilityClasses = (ownerState: PigmentContainerOwnProps) => { * * Demos: * - * - [Container](https://next.mui.com/material-ui/react-container/) + * - [Container](https://mui.com/material-ui/react-container/) * * API: * - * - [PigmentContainer API](https://next.mui.com/material-ui/api/pigment-container/) + * - [PigmentContainer API](https://mui.com/material-ui/api/pigment-container/) */ const PigmentContainer = React.forwardRef(function PigmentContainer( { className, disableGutters = false, fixed = false, maxWidth = 'lg', ...props }, diff --git a/packages/mui-material/src/PigmentGrid/PigmentGrid.tsx b/packages/mui-material/src/PigmentGrid/PigmentGrid.tsx index 7d18a8dd1ead3a..9518069c45bf1f 100644 --- a/packages/mui-material/src/PigmentGrid/PigmentGrid.tsx +++ b/packages/mui-material/src/PigmentGrid/PigmentGrid.tsx @@ -145,11 +145,11 @@ const useUtilityClasses = (ownerState: GridBaseProps) => { * * Demos: * - * - [Grid version 2](https://next.mui.com/material-ui/react-grid2/) + * - [Grid version 2](https://mui.com/material-ui/react-grid2/) * * API: * - * - [PigmentGrid API](https://next.mui.com/material-ui/api/pigment-grid/) + * - [PigmentGrid API](https://mui.com/material-ui/api/pigment-grid/) */ const PigmentGrid = React.forwardRef(function PigmentGrid(props, ref) { const { className, ...other } = props; diff --git a/packages/mui-material/src/PigmentHidden/PigmentHidden.tsx b/packages/mui-material/src/PigmentHidden/PigmentHidden.tsx index 99fb1a3972dccd..c4abce51b2f243 100644 --- a/packages/mui-material/src/PigmentHidden/PigmentHidden.tsx +++ b/packages/mui-material/src/PigmentHidden/PigmentHidden.tsx @@ -254,11 +254,11 @@ HiddenCss.propTypes /* remove-proptypes */ = { * * Demos: * - * - [Hidden](https://next.mui.com/material-ui/react-hidden/) + * - [Hidden](https://mui.com/material-ui/react-hidden/) * * API: * - * - [PigmentHidden API](https://next.mui.com/material-ui/api/pigment-hidden/) + * - [PigmentHidden API](https://mui.com/material-ui/api/pigment-hidden/) */ function PigmentHidden({ implementation = 'js', ...props }: HiddenProps & { className?: string }) { if (implementation === 'js') { diff --git a/packages/mui-material/src/PigmentStack/PigmentStack.tsx b/packages/mui-material/src/PigmentStack/PigmentStack.tsx index 04d90fbe52ca69..4b0e34d9abbe2f 100644 --- a/packages/mui-material/src/PigmentStack/PigmentStack.tsx +++ b/packages/mui-material/src/PigmentStack/PigmentStack.tsx @@ -63,11 +63,11 @@ const useUtilityClasses = () => { * * Demos: * - * - [Stack](https://next.mui.com/material-ui/react-stack/) + * - [Stack](https://mui.com/material-ui/react-stack/) * * API: * - * - [PigmentStack API](https://next.mui.com/material-ui/api/pigment-stack/) + * - [PigmentStack API](https://mui.com/material-ui/api/pigment-stack/) */ const PigmentStack = React.forwardRef(function PigmentStack({ className, ...props }, ref) { const classes = useUtilityClasses(); diff --git a/packages/mui-material/src/Popover/Popover.d.ts b/packages/mui-material/src/Popover/Popover.d.ts index 63bdaa417ee012..7e9ae1906e5d90 100644 --- a/packages/mui-material/src/Popover/Popover.d.ts +++ b/packages/mui-material/src/Popover/Popover.d.ts @@ -1,6 +1,6 @@ import * as React from 'react'; import { SxProps } from '@mui/system'; -import { InternalStandardProps as StandardProps } from '..'; +import { BackdropProps, InternalStandardProps as StandardProps } from '..'; import Paper, { PaperProps } from '../Paper'; import Modal, { ModalOwnerState, ModalProps } from '../Modal'; import { Theme } from '../styles'; @@ -9,8 +9,8 @@ import { PopoverClasses } from './popoverClasses'; import { CreateSlotsAndSlotProps, SlotProps } from '../utils/types'; export interface PopoverSlots { - root?: React.ElementType; - paper?: React.ElementType; + root: React.ElementType; + paper: React.ElementType; } export type PopoverSlotsAndSlotProps = CreateSlotsAndSlotProps< @@ -39,7 +39,10 @@ interface PopoverVirtualElement { } export interface PopoverProps - extends StandardProps<Omit<ModalProps, 'slots' | 'slotProps'>, 'children'>, + extends StandardProps< + Omit<ModalProps, 'slots' | 'slotProps' | 'BackdropProps' | 'BackdropComponent'>, + 'children' + >, PopoverSlotsAndSlotProps { /** * A ref for imperative actions. @@ -47,7 +50,7 @@ export interface PopoverProps */ action?: React.Ref<PopoverActions>; /** - * An HTML element, [PopoverVirtualElement](/material-ui/react-popover/#virtual-element), + * An HTML element, [PopoverVirtualElement](https://mui.com/material-ui/react-popover/#virtual-element), * or a function that returns either. * It's used to set the position of the popover. */ @@ -82,6 +85,26 @@ export interface PopoverProps * @default 'anchorEl' */ anchorReference?: PopoverReference; + /** + * A backdrop component. This prop enables custom backdrop rendering. + * @deprecated Use `slotProps.root.slots.backdrop` instead. While this prop currently works, it will be removed in the next major version. + * Use the `slotProps.root.slots.backdrop` prop to make your application ready for the next version of Material UI. + * @default styled(Backdrop, { + * name: 'MuiModal', + * slot: 'Backdrop', + * overridesResolver: (props, styles) => { + * return styles.backdrop; + * }, + * })({ + * zIndex: -1, + * }) + */ + BackdropComponent?: React.ElementType<BackdropProps>; + /** + * Props applied to the [`Backdrop`](/material-ui/api/backdrop/) element. + * @deprecated Use `slotProps.root.slotProps.backdrop` instead. + */ + BackdropProps?: Partial<BackdropProps>; /** * The content of the component. */ @@ -115,7 +138,7 @@ export interface PopoverProps */ open: boolean; /** - * Props applied to the [`Paper`](/material-ui/api/paper/) element. + * Props applied to the [`Paper`](https://mui.com/material-ui/api/paper/) element. * * This prop is an alias for `slotProps.paper` and will be overriden by it if both are used. * @deprecated Use `slotProps.paper` instead. @@ -142,11 +165,11 @@ export interface PopoverProps transformOrigin?: PopoverOrigin; /** * The component used for the transition. - * [Follow this guide](/material-ui/transitions/#transitioncomponent-prop) to learn more about the requirements for this component. + * [Follow this guide](https://mui.com/material-ui/transitions/#transitioncomponent-prop) to learn more about the requirements for this component. * @default Grow */ TransitionComponent?: React.JSXElementConstructor< - TransitionProps & { children: React.ReactElement<any, any> } + TransitionProps & { children: React.ReactElement<unknown, any> } >; /** * Set to 'auto' to automatically calculate transition time based on height. @@ -182,12 +205,12 @@ export declare const PopoverPaper: React.FC<PopoverPaperProps>; * * Demos: * - * - [Menu](https://next.mui.com/material-ui/react-menu/) - * - [Popover](https://next.mui.com/material-ui/react-popover/) + * - [Menu](https://mui.com/material-ui/react-menu/) + * - [Popover](https://mui.com/material-ui/react-popover/) * * API: * - * - [Popover API](https://next.mui.com/material-ui/api/popover/) - * - inherits [Modal API](https://next.mui.com/material-ui/api/modal/) + * - [Popover API](https://mui.com/material-ui/api/popover/) + * - inherits [Modal API](https://mui.com/material-ui/api/modal/) */ export default function Popover(props: PopoverProps): React.JSX.Element; diff --git a/packages/mui-material/src/Popover/Popover.js b/packages/mui-material/src/Popover/Popover.js index 4c9aa9379a6d18..b0204676140312 100644 --- a/packages/mui-material/src/Popover/Popover.js +++ b/packages/mui-material/src/Popover/Popover.js @@ -445,7 +445,7 @@ Popover.propTypes /* remove-proptypes */ = { */ action: refType, /** - * An HTML element, [PopoverVirtualElement](/material-ui/react-popover/#virtual-element), + * An HTML element, [PopoverVirtualElement](https://mui.com/material-ui/react-popover/#virtual-element), * or a function that returns either. * It's used to set the position of the popover. */ @@ -518,6 +518,26 @@ Popover.propTypes /* remove-proptypes */ = { * @default 'anchorEl' */ anchorReference: PropTypes.oneOf(['anchorEl', 'anchorPosition', 'none']), + /** + * A backdrop component. This prop enables custom backdrop rendering. + * @deprecated Use `slotProps.root.slots.backdrop` instead. While this prop currently works, it will be removed in the next major version. + * Use the `slotProps.root.slots.backdrop` prop to make your application ready for the next version of Material UI. + * @default styled(Backdrop, { + * name: 'MuiModal', + * slot: 'Backdrop', + * overridesResolver: (props, styles) => { + * return styles.backdrop; + * }, + * })({ + * zIndex: -1, + * }) + */ + BackdropComponent: PropTypes.elementType, + /** + * Props applied to the [`Backdrop`](/material-ui/api/backdrop/) element. + * @deprecated Use `slotProps.root.slotProps.backdrop` instead. + */ + BackdropProps: PropTypes.object, /** * The content of the component. */ @@ -567,7 +587,7 @@ Popover.propTypes /* remove-proptypes */ = { */ open: PropTypes.bool.isRequired, /** - * Props applied to the [`Paper`](/material-ui/api/paper/) element. + * Props applied to the [`Paper`](https://mui.com/material-ui/api/paper/) element. * * This prop is an alias for `slotProps.paper` and will be overriden by it if both are used. * @deprecated Use `slotProps.paper` instead. @@ -623,7 +643,7 @@ Popover.propTypes /* remove-proptypes */ = { }), /** * The component used for the transition. - * [Follow this guide](/material-ui/transitions/#transitioncomponent-prop) to learn more about the requirements for this component. + * [Follow this guide](https://mui.com/material-ui/transitions/#transitioncomponent-prop) to learn more about the requirements for this component. * @default Grow */ TransitionComponent: PropTypes.elementType, diff --git a/packages/mui-material/src/Popover/Popover.spec.tsx b/packages/mui-material/src/Popover/Popover.spec.tsx index e771e801c80d83..823d9bb661f5df 100644 --- a/packages/mui-material/src/Popover/Popover.spec.tsx +++ b/packages/mui-material/src/Popover/Popover.spec.tsx @@ -16,3 +16,12 @@ function Test() { </React.Fragment> ); } + +<Popover + open + slotProps={{ + paper: { + sx: (theme) => ({ backgroundColor: theme.palette.primary.main }), + }, + }} +/>; diff --git a/packages/mui-material/src/Popover/index.js b/packages/mui-material/src/Popover/index.js index af8780df14f51e..bf8f15fc74c066 100644 --- a/packages/mui-material/src/Popover/index.js +++ b/packages/mui-material/src/Popover/index.js @@ -1,4 +1,3 @@ -'use client'; export { default } from './Popover'; export * from './Popover'; diff --git a/packages/mui-material/src/Popper/Popper.tsx b/packages/mui-material/src/Popper/Popper.tsx index 6be1269727b656..b329b808ae044d 100644 --- a/packages/mui-material/src/Popper/Popper.tsx +++ b/packages/mui-material/src/Popper/Popper.tsx @@ -50,13 +50,13 @@ const PopperRoot = styled(BasePopper, { * * Demos: * - * - [Autocomplete](https://next.mui.com/material-ui/react-autocomplete/) - * - [Menu](https://next.mui.com/material-ui/react-menu/) - * - [Popper](https://next.mui.com/material-ui/react-popper/) + * - [Autocomplete](https://mui.com/material-ui/react-autocomplete/) + * - [Menu](https://mui.com/material-ui/react-menu/) + * - [Popper](https://mui.com/material-ui/react-popper/) * * API: * - * - [Popper API](https://next.mui.com/material-ui/api/popper/) + * - [Popper API](https://mui.com/material-ui/api/popper/) */ const Popper = React.forwardRef(function Popper( inProps: PopperProps, diff --git a/packages/mui-material/src/Popper/index.js b/packages/mui-material/src/Popper/index.js index 3055f10dcc763e..30316b8bf1c91b 100644 --- a/packages/mui-material/src/Popper/index.js +++ b/packages/mui-material/src/Popper/index.js @@ -1,3 +1,2 @@ -'use client'; export { default } from './Popper'; export * from './popperClasses'; diff --git a/packages/mui-material/src/Portal/Portal.tsx b/packages/mui-material/src/Portal/Portal.tsx index d59a8322e47a95..b6aff42416c348 100644 --- a/packages/mui-material/src/Portal/Portal.tsx +++ b/packages/mui-material/src/Portal/Portal.tsx @@ -22,11 +22,11 @@ function getContainer(container: PortalProps['container']) { * * Demos: * - * - [Portal](https://next.mui.com/material-ui/react-portal/) + * - [Portal](https://mui.com/material-ui/react-portal/) * * API: * - * - [Portal API](https://next.mui.com/material-ui/api/portal/) + * - [Portal API](https://mui.com/material-ui/api/portal/) */ const Portal = React.forwardRef(function Portal( props: PortalProps, diff --git a/packages/mui-material/src/Radio/Radio.d.ts b/packages/mui-material/src/Radio/Radio.d.ts index fff957773fcce5..839696994c4b31 100644 --- a/packages/mui-material/src/Radio/Radio.d.ts +++ b/packages/mui-material/src/Radio/Radio.d.ts @@ -55,11 +55,11 @@ export interface RadioProps * * Demos: * - * - [Radio Group](https://next.mui.com/material-ui/react-radio-button/) + * - [Radio Group](https://mui.com/material-ui/react-radio-button/) * * API: * - * - [Radio API](https://next.mui.com/material-ui/api/radio/) - * - inherits [ButtonBase API](https://next.mui.com/material-ui/api/button-base/) + * - [Radio API](https://mui.com/material-ui/api/radio/) + * - inherits [ButtonBase API](https://mui.com/material-ui/api/button-base/) */ export default function Radio(props: RadioProps): React.JSX.Element; diff --git a/packages/mui-material/src/Radio/Radio.js b/packages/mui-material/src/Radio/Radio.js index 40e47b90100cc1..d3707e7bffaa96 100644 --- a/packages/mui-material/src/Radio/Radio.js +++ b/packages/mui-material/src/Radio/Radio.js @@ -9,6 +9,7 @@ import SwitchBase from '../internal/SwitchBase'; import RadioButtonIcon from './RadioButtonIcon'; import capitalize from '../utils/capitalize'; import createChainedFunction from '../utils/createChainedFunction'; +import useFormControl from '../FormControl/useFormControl'; import useRadioGroup from '../RadioGroup/useRadioGroup'; import radioClasses, { getRadioUtilityClass } from './radioClasses'; import rootShouldForwardProp from '../styles/rootShouldForwardProp'; @@ -51,7 +52,7 @@ const RadioRoot = styled(SwitchBase, { }, variants: [ { - props: { color: 'default', disableRipple: false }, + props: { color: 'default', disabled: false, disableRipple: false }, style: { '&:hover': { backgroundColor: theme.vars @@ -63,7 +64,7 @@ const RadioRoot = styled(SwitchBase, { ...Object.entries(theme.palette) .filter(([, palette]) => palette && palette.main) .map(([color]) => ({ - props: { color, disableRipple: false }, + props: { color, disabled: false, disableRipple: false }, style: { '&:hover': { backgroundColor: theme.vars @@ -75,7 +76,7 @@ const RadioRoot = styled(SwitchBase, { ...Object.entries(theme.palette) .filter(([, palette]) => palette && palette.main) .map(([color]) => ({ - props: { color }, + props: { color, disabled: false }, style: { [`&.${radioClasses.checked}`]: { color: (theme.vars || theme).palette[color].main, @@ -121,11 +122,26 @@ const Radio = React.forwardRef(function Radio(inProps, ref) { onChange: onChangeProp, size = 'medium', className, + disabled: disabledProp, disableRipple = false, ...other } = props; + + const muiFormControl = useFormControl(); + + let disabled = disabledProp; + + if (muiFormControl) { + if (typeof disabled === 'undefined') { + disabled = muiFormControl.disabled; + } + } + + disabled ??= false; + const ownerState = { ...props, + disabled, disableRipple, color, size, @@ -154,6 +170,7 @@ const Radio = React.forwardRef(function Radio(inProps, ref) { checkedIcon={React.cloneElement(checkedIcon, { fontSize: defaultCheckedIcon.props.fontSize ?? size, })} + disabled={disabled} ownerState={ownerState} classes={classes} name={name} diff --git a/packages/mui-material/src/Radio/index.js b/packages/mui-material/src/Radio/index.js index eeabd2f3fa0973..659d29e9fd37fb 100644 --- a/packages/mui-material/src/Radio/index.js +++ b/packages/mui-material/src/Radio/index.js @@ -1,4 +1,3 @@ -'use client'; export { default } from './Radio'; export { default as radioClasses } from './radioClasses'; diff --git a/packages/mui-material/src/RadioGroup/RadioGroup.d.ts b/packages/mui-material/src/RadioGroup/RadioGroup.d.ts index 03d7c848511e57..3793f088ac1384 100644 --- a/packages/mui-material/src/RadioGroup/RadioGroup.d.ts +++ b/packages/mui-material/src/RadioGroup/RadioGroup.d.ts @@ -29,11 +29,11 @@ export interface RadioGroupProps extends Omit<FormGroupProps, 'onChange'> { * * Demos: * - * - [Radio Group](https://next.mui.com/material-ui/react-radio-button/) + * - [Radio Group](https://mui.com/material-ui/react-radio-button/) * * API: * - * - [RadioGroup API](https://next.mui.com/material-ui/api/radio-group/) - * - inherits [FormGroup API](https://next.mui.com/material-ui/api/form-group/) + * - [RadioGroup API](https://mui.com/material-ui/api/radio-group/) + * - inherits [FormGroup API](https://mui.com/material-ui/api/form-group/) */ export default function RadioGroup(props: RadioGroupProps): React.JSX.Element; diff --git a/packages/mui-material/src/RadioGroup/index.js b/packages/mui-material/src/RadioGroup/index.js index 9db6dab53515ea..ad2099433dfb76 100644 --- a/packages/mui-material/src/RadioGroup/index.js +++ b/packages/mui-material/src/RadioGroup/index.js @@ -1,4 +1,3 @@ -'use client'; export { default } from './RadioGroup'; export { default as useRadioGroup } from './useRadioGroup'; diff --git a/packages/mui-material/src/Rating/Rating.d.ts b/packages/mui-material/src/Rating/Rating.d.ts index 19202e5b401819..b232f44adceea3 100644 --- a/packages/mui-material/src/Rating/Rating.d.ts +++ b/packages/mui-material/src/Rating/Rating.d.ts @@ -40,7 +40,7 @@ export interface RatingProps * Accepts a function which returns a string value that provides a user-friendly name for the current value of the rating. * This is important for screen reader users. * - * For localization purposes, you can use the provided [translations](/material-ui/guides/localization/). + * For localization purposes, you can use the provided [translations](https://mui.com/material-ui/guides/localization/). * @param {number} value The rating label's value to format. * @returns {string} * @default function defaultLabelText(value) { @@ -118,10 +118,10 @@ export interface RatingProps * * Demos: * - * - [Rating](https://next.mui.com/material-ui/react-rating/) + * - [Rating](https://mui.com/material-ui/react-rating/) * * API: * - * - [Rating API](https://next.mui.com/material-ui/api/rating/) + * - [Rating API](https://mui.com/material-ui/api/rating/) */ export default function Rating(props: RatingProps): React.JSX.Element; diff --git a/packages/mui-material/src/Rating/Rating.js b/packages/mui-material/src/Rating/Rating.js index 04d81d5f585b66..7f5c9447b1e0da 100644 --- a/packages/mui-material/src/Rating/Rating.js +++ b/packages/mui-material/src/Rating/Rating.js @@ -671,7 +671,7 @@ Rating.propTypes /* remove-proptypes */ = { * Accepts a function which returns a string value that provides a user-friendly name for the current value of the rating. * This is important for screen reader users. * - * For localization purposes, you can use the provided [translations](/material-ui/guides/localization/). + * For localization purposes, you can use the provided [translations](https://mui.com/material-ui/guides/localization/). * @param {number} value The rating label's value to format. * @returns {string} * @default function defaultLabelText(value) { diff --git a/packages/mui-material/src/ScopedCssBaseline/ScopedCssBaseline.d.ts b/packages/mui-material/src/ScopedCssBaseline/ScopedCssBaseline.d.ts index 4978384fb29337..d4224ff66fefea 100644 --- a/packages/mui-material/src/ScopedCssBaseline/ScopedCssBaseline.d.ts +++ b/packages/mui-material/src/ScopedCssBaseline/ScopedCssBaseline.d.ts @@ -36,11 +36,11 @@ export interface ScopedCssBaselineTypeMap< * * Demos: * - * - [CSS Baseline](https://next.mui.com/material-ui/react-css-baseline/) + * - [CSS Baseline](https://mui.com/material-ui/react-css-baseline/) * * API: * - * - [ScopedCssBaseline API](https://next.mui.com/material-ui/api/scoped-css-baseline/) + * - [ScopedCssBaseline API](https://mui.com/material-ui/api/scoped-css-baseline/) */ declare const ScopedCssBaseline: OverridableComponent<ScopedCssBaselineTypeMap>; diff --git a/packages/mui-material/src/ScopedCssBaseline/index.js b/packages/mui-material/src/ScopedCssBaseline/index.js index add0e05745141e..ab7ca6ccdf4c5b 100644 --- a/packages/mui-material/src/ScopedCssBaseline/index.js +++ b/packages/mui-material/src/ScopedCssBaseline/index.js @@ -1,4 +1,3 @@ -'use client'; export { default } from './ScopedCssBaseline'; export { default as scopedCssBaselineClasses } from './scopedCssBaselineClasses'; diff --git a/packages/mui-material/src/Select/Select.d.ts b/packages/mui-material/src/Select/Select.d.ts index 1510954da84ce7..6e7d1ebd5b8544 100644 --- a/packages/mui-material/src/Select/Select.d.ts +++ b/packages/mui-material/src/Select/Select.d.ts @@ -63,14 +63,14 @@ export interface BaseSelectProps<Value = unknown> /** * An `Input` element; does not have to be a material-ui specific `Input`. */ - input?: React.ReactElement<any, any>; + input?: React.ReactElement<unknown, any>; /** * [Attributes](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input#Attributes) applied to the `input` element. * When `native` is `true`, the attributes are applied on the `select` element. */ inputProps?: InputProps['inputProps']; /** - * See [OutlinedInput#label](/material-ui/api/outlined-input/#props) + * See [OutlinedInput#label](https://mui.com/material-ui/api/outlined-input/#props) */ label?: React.ReactNode; /** @@ -79,7 +79,7 @@ export interface BaseSelectProps<Value = unknown> */ labelId?: string; /** - * Props applied to the [`Menu`](/material-ui/api/menu/) element. + * Props applied to the [`Menu`](https://mui.com/material-ui/api/menu/) element. */ MenuProps?: Partial<MenuProps>; /** @@ -189,12 +189,12 @@ export type SelectProps<Value = unknown> = * * Demos: * - * - [Select](https://next.mui.com/material-ui/react-select/) + * - [Select](https://mui.com/material-ui/react-select/) * * API: * - * - [Select API](https://next.mui.com/material-ui/api/select/) - * - inherits [OutlinedInput API](https://next.mui.com/material-ui/api/outlined-input/) + * - [Select API](https://mui.com/material-ui/api/select/) + * - inherits [OutlinedInput API](https://mui.com/material-ui/api/outlined-input/) */ declare const Select: (<Value = unknown>(props: SelectProps<Value>) => React.JSX.Element) & { muiName: string; diff --git a/packages/mui-material/src/Select/Select.js b/packages/mui-material/src/Select/Select.js index 38b8b1185ec466..298de307b0c32a 100644 --- a/packages/mui-material/src/Select/Select.js +++ b/packages/mui-material/src/Select/Select.js @@ -199,7 +199,7 @@ Select.propTypes /* remove-proptypes */ = { */ inputProps: PropTypes.object, /** - * See [OutlinedInput#label](/material-ui/api/outlined-input/#props) + * See [OutlinedInput#label](https://mui.com/material-ui/api/outlined-input/#props) */ label: PropTypes.node, /** @@ -208,7 +208,7 @@ Select.propTypes /* remove-proptypes */ = { */ labelId: PropTypes.string, /** - * Props applied to the [`Menu`](/material-ui/api/menu/) element. + * Props applied to the [`Menu`](https://mui.com/material-ui/api/menu/) element. */ MenuProps: PropTypes.object, /** diff --git a/packages/mui-material/src/Select/index.js b/packages/mui-material/src/Select/index.js index 9c160bf8a57d7f..59eafa5d813fe0 100644 --- a/packages/mui-material/src/Select/index.js +++ b/packages/mui-material/src/Select/index.js @@ -1,4 +1,3 @@ -'use client'; export { default } from './Select'; export { default as selectClasses } from './selectClasses'; diff --git a/packages/mui-material/src/Skeleton/Skeleton.d.ts b/packages/mui-material/src/Skeleton/Skeleton.d.ts index 1166a46be999bc..1d4e9eda13c324 100644 --- a/packages/mui-material/src/Skeleton/Skeleton.d.ts +++ b/packages/mui-material/src/Skeleton/Skeleton.d.ts @@ -58,11 +58,11 @@ export interface SkeletonTypeMap< * * Demos: * - * - [Skeleton](https://next.mui.com/material-ui/react-skeleton/) + * - [Skeleton](https://mui.com/material-ui/react-skeleton/) * * API: * - * - [Skeleton API](https://next.mui.com/material-ui/api/skeleton/) + * - [Skeleton API](https://mui.com/material-ui/api/skeleton/) */ declare const Skeleton: OverridableComponent<SkeletonTypeMap>; diff --git a/packages/mui-material/src/Skeleton/Skeleton.js b/packages/mui-material/src/Skeleton/Skeleton.js index e172a81bd3f890..3f62bfb5fc1fbf 100644 --- a/packages/mui-material/src/Skeleton/Skeleton.js +++ b/packages/mui-material/src/Skeleton/Skeleton.js @@ -192,8 +192,10 @@ const SkeletonRoot = styled('span', { props: { animation: 'wave', }, - style: waveAnimation || { - animation: `${waveKeyframe} 2s linear 0.5s infinite`, + style: { + '&::after': waveAnimation || { + animation: `${waveKeyframe} 2s linear 0.5s infinite`, + }, }, }, ], diff --git a/packages/mui-material/src/Skeleton/index.js b/packages/mui-material/src/Skeleton/index.js index 2d8d38e0c37382..ba349955e757a7 100644 --- a/packages/mui-material/src/Skeleton/index.js +++ b/packages/mui-material/src/Skeleton/index.js @@ -1,4 +1,3 @@ -'use client'; export { default } from './Skeleton'; export * from './skeletonClasses'; diff --git a/packages/mui-material/src/Slide/Slide.d.ts b/packages/mui-material/src/Slide/Slide.d.ts index e0472114a2ae86..d6a6181e18fa69 100644 --- a/packages/mui-material/src/Slide/Slide.d.ts +++ b/packages/mui-material/src/Slide/Slide.d.ts @@ -11,7 +11,7 @@ export interface SlideProps extends TransitionProps { /** * A single child content element. */ - children: React.ReactElement<any, any>; + children: React.ReactElement<unknown, any>; /** * An HTML element, or a function that returns one. * It's used to set the container the Slide is transitioning from. @@ -48,17 +48,17 @@ export interface SlideProps extends TransitionProps { } /** - * The Slide transition is used by the [Drawer](https://next.mui.com/material-ui/react-drawer/) component. + * The Slide transition is used by the [Drawer](https://mui.com/material-ui/react-drawer/) component. * It uses [react-transition-group](https://github.com/reactjs/react-transition-group) internally. * * Demos: * - * - [Dialog](https://next.mui.com/material-ui/react-dialog/) - * - [Transitions](https://next.mui.com/material-ui/transitions/) + * - [Dialog](https://mui.com/material-ui/react-dialog/) + * - [Transitions](https://mui.com/material-ui/transitions/) * * API: * - * - [Slide API](https://next.mui.com/material-ui/api/slide/) + * - [Slide API](https://mui.com/material-ui/api/slide/) * - inherits [Transition API](https://reactcommunity.org/react-transition-group/transition/#Transition-props) */ export default function Slide(props: SlideProps): React.JSX.Element; diff --git a/packages/mui-material/src/Slide/index.js b/packages/mui-material/src/Slide/index.js index 1e82e336ebd002..7a116646dc53b2 100644 --- a/packages/mui-material/src/Slide/index.js +++ b/packages/mui-material/src/Slide/index.js @@ -1,2 +1 @@ -'use client'; export { default } from './Slide'; diff --git a/packages/mui-material/src/Slider/Slider.d.ts b/packages/mui-material/src/Slider/Slider.d.ts index 5956cd492660b3..fe1e06a53ea74a 100644 --- a/packages/mui-material/src/Slider/Slider.d.ts +++ b/packages/mui-material/src/Slider/Slider.d.ts @@ -46,7 +46,7 @@ export interface SliderOwnProps { /** * The components used for each slot inside. * - * @deprecated use the `slots` prop instead. This prop will be removed in v7. See [Migrating from deprecated APIs](/material-ui/migration/migrating-from-deprecated-apis/) for more details. + * @deprecated use the `slots` prop instead. This prop will be removed in v7. See [Migrating from deprecated APIs](https://mui.com/material-ui/migration/migrating-from-deprecated-apis/) for more details. * * @default {} */ @@ -64,7 +64,7 @@ export interface SliderOwnProps { * The extra props for the slot components. * You can override the existing props or add new ones. * - * @deprecated use the `slotProps` prop instead. This prop will be removed in v7. See [Migrating from deprecated APIs](/material-ui/migration/migrating-from-deprecated-apis/) for more details. + * @deprecated use the `slotProps` prop instead. This prop will be removed in v7. See [Migrating from deprecated APIs](https://mui.com/material-ui/migration/migrating-from-deprecated-apis/) for more details. * * @default {} */ @@ -306,11 +306,11 @@ export declare const SliderValueLabel: React.FC<SliderValueLabelProps>; * * Demos: * - * - [Slider](https://next.mui.com/material-ui/react-slider/) + * - [Slider](https://mui.com/material-ui/react-slider/) * * API: * - * - [Slider API](https://next.mui.com/material-ui/api/slider/) + * - [Slider API](https://mui.com/material-ui/api/slider/) */ declare const Slider: OverridableComponent<SliderTypeMap>; diff --git a/packages/mui-material/src/Slider/Slider.js b/packages/mui-material/src/Slider/Slider.js index e65ba70e710943..b2642863490a71 100644 --- a/packages/mui-material/src/Slider/Slider.js +++ b/packages/mui-material/src/Slider/Slider.js @@ -903,7 +903,7 @@ Slider.propTypes /* remove-proptypes */ = { /** * The components used for each slot inside. * - * @deprecated use the `slots` prop instead. This prop will be removed in v7. See [Migrating from deprecated APIs](/material-ui/migration/migrating-from-deprecated-apis/) for more details. + * @deprecated use the `slots` prop instead. This prop will be removed in v7. See [Migrating from deprecated APIs](https://mui.com/material-ui/migration/migrating-from-deprecated-apis/) for more details. * * @default {} */ @@ -921,7 +921,7 @@ Slider.propTypes /* remove-proptypes */ = { * The extra props for the slot components. * You can override the existing props or add new ones. * - * @deprecated use the `slotProps` prop instead. This prop will be removed in v7. See [Migrating from deprecated APIs](/material-ui/migration/migrating-from-deprecated-apis/) for more details. + * @deprecated use the `slotProps` prop instead. This prop will be removed in v7. See [Migrating from deprecated APIs](https://mui.com/material-ui/migration/migrating-from-deprecated-apis/) for more details. * * @default {} */ diff --git a/packages/mui-material/src/Slider/index.js b/packages/mui-material/src/Slider/index.js index 4e20c2e2b8a724..ac3427028230ed 100644 --- a/packages/mui-material/src/Slider/index.js +++ b/packages/mui-material/src/Slider/index.js @@ -1,4 +1,3 @@ -'use client'; export { default } from './Slider'; export * from './Slider'; diff --git a/packages/mui-material/src/Slider/useSlider.ts b/packages/mui-material/src/Slider/useSlider.ts index ba97c4adb1ab01..d36189f6a72022 100644 --- a/packages/mui-material/src/Slider/useSlider.ts +++ b/packages/mui-material/src/Slider/useSlider.ts @@ -192,11 +192,11 @@ function doesSupportTouchActionNone() { * * Demos: * - * - [Slider](https://next.mui.com/base-ui/react-slider/#hook) + * - [Slider](https://mui.com/base-ui/react-slider/#hook) * * API: * - * - [useSlider API](https://next.mui.com/base-ui/react-slider/hooks-api/#use-slider) + * - [useSlider API](https://mui.com/base-ui/react-slider/hooks-api/#use-slider) */ export function useSlider(parameters: UseSliderParameters): UseSliderReturnValue { const { diff --git a/packages/mui-material/src/Snackbar/Snackbar.d.ts b/packages/mui-material/src/Snackbar/Snackbar.d.ts index 3128d00d125cc8..01dea16573a66d 100644 --- a/packages/mui-material/src/Snackbar/Snackbar.d.ts +++ b/packages/mui-material/src/Snackbar/Snackbar.d.ts @@ -37,7 +37,7 @@ export interface SnackbarProps extends StandardProps<React.HTMLAttributes<HTMLDi /** * Replace the `SnackbarContent` component. */ - children?: React.ReactElement<any, any>; + children?: React.ReactElement<unknown, any>; /** * Override or extend the styles applied to the component. */ @@ -47,7 +47,7 @@ export interface SnackbarProps extends StandardProps<React.HTMLAttributes<HTMLDi */ ClickAwayListenerProps?: Partial<ClickAwayListenerProps>; /** - * Props applied to the [`SnackbarContent`](/material-ui/api/snackbar-content/) element. + * Props applied to the [`SnackbarContent`](https://mui.com/material-ui/api/snackbar-content/) element. */ ContentProps?: Partial<SnackbarContentProps>; /** @@ -94,11 +94,11 @@ export interface SnackbarProps extends StandardProps<React.HTMLAttributes<HTMLDi sx?: SxProps<Theme>; /** * The component used for the transition. - * [Follow this guide](/material-ui/transitions/#transitioncomponent-prop) to learn more about the requirements for this component. + * [Follow this guide](https://mui.com/material-ui/transitions/#transitioncomponent-prop) to learn more about the requirements for this component. * @default Grow */ TransitionComponent?: React.JSXElementConstructor< - TransitionProps & { children: React.ReactElement<any, any> } + TransitionProps & { children: React.ReactElement<unknown, any> } >; /** * The duration for the transition, in milliseconds. @@ -121,10 +121,10 @@ export interface SnackbarProps extends StandardProps<React.HTMLAttributes<HTMLDi * * Demos: * - * - [Snackbar](https://next.mui.com/material-ui/react-snackbar/) + * - [Snackbar](https://mui.com/material-ui/react-snackbar/) * * API: * - * - [Snackbar API](https://next.mui.com/material-ui/api/snackbar/) + * - [Snackbar API](https://mui.com/material-ui/api/snackbar/) */ export default function Snackbar(props: SnackbarProps): React.JSX.Element; diff --git a/packages/mui-material/src/Snackbar/Snackbar.js b/packages/mui-material/src/Snackbar/Snackbar.js index 40d0bf31d04691..9756fe042078a6 100644 --- a/packages/mui-material/src/Snackbar/Snackbar.js +++ b/packages/mui-material/src/Snackbar/Snackbar.js @@ -234,7 +234,7 @@ Snackbar.propTypes /* remove-proptypes */ = { */ ClickAwayListenerProps: PropTypes.object, /** - * Props applied to the [`SnackbarContent`](/material-ui/api/snackbar-content/) element. + * Props applied to the [`SnackbarContent`](https://mui.com/material-ui/api/snackbar-content/) element. */ ContentProps: PropTypes.object, /** @@ -301,7 +301,7 @@ Snackbar.propTypes /* remove-proptypes */ = { ]), /** * The component used for the transition. - * [Follow this guide](/material-ui/transitions/#transitioncomponent-prop) to learn more about the requirements for this component. + * [Follow this guide](https://mui.com/material-ui/transitions/#transitioncomponent-prop) to learn more about the requirements for this component. * @default Grow */ TransitionComponent: PropTypes.elementType, diff --git a/packages/mui-material/src/Snackbar/index.js b/packages/mui-material/src/Snackbar/index.js index c21dbfa25ec91d..048c654862c26b 100644 --- a/packages/mui-material/src/Snackbar/index.js +++ b/packages/mui-material/src/Snackbar/index.js @@ -1,4 +1,3 @@ -'use client'; export { default } from './Snackbar'; export { default as snackbarClasses } from './snackbarClasses'; diff --git a/packages/mui-material/src/Snackbar/useSnackbar.ts b/packages/mui-material/src/Snackbar/useSnackbar.ts index 17316a0a56ce83..ffec1992055c0e 100644 --- a/packages/mui-material/src/Snackbar/useSnackbar.ts +++ b/packages/mui-material/src/Snackbar/useSnackbar.ts @@ -17,11 +17,11 @@ import { EventHandlers } from '../utils/types'; * * Demos: * - * - [Snackbar](https://next.mui.com/base-ui/react-snackbar/#hook) + * - [Snackbar](https://mui.com/base-ui/react-snackbar/#hook) * * API: * - * - [useSnackbar API](https://next.mui.com/base-ui/react-snackbar/hooks-api/#use-snackbar) + * - [useSnackbar API](https://mui.com/base-ui/react-snackbar/hooks-api/#use-snackbar) */ function useSnackbar(parameters: UseSnackbarParameters = {}): UseSnackbarReturnValue { const { diff --git a/packages/mui-material/src/SnackbarContent/SnackbarContent.d.ts b/packages/mui-material/src/SnackbarContent/SnackbarContent.d.ts index 17157317f4df7b..18176778d0641f 100644 --- a/packages/mui-material/src/SnackbarContent/SnackbarContent.d.ts +++ b/packages/mui-material/src/SnackbarContent/SnackbarContent.d.ts @@ -33,11 +33,11 @@ export interface SnackbarContentProps extends StandardProps<PaperProps, 'childre * * Demos: * - * - [Snackbar](https://next.mui.com/material-ui/react-snackbar/) + * - [Snackbar](https://mui.com/material-ui/react-snackbar/) * * API: * - * - [SnackbarContent API](https://next.mui.com/material-ui/api/snackbar-content/) - * - inherits [Paper API](https://next.mui.com/material-ui/api/paper/) + * - [SnackbarContent API](https://mui.com/material-ui/api/snackbar-content/) + * - inherits [Paper API](https://mui.com/material-ui/api/paper/) */ export default function SnackbarContent(props: SnackbarContentProps): React.JSX.Element; diff --git a/packages/mui-material/src/SnackbarContent/index.js b/packages/mui-material/src/SnackbarContent/index.js index bdea04e7db6591..44f55061a70824 100644 --- a/packages/mui-material/src/SnackbarContent/index.js +++ b/packages/mui-material/src/SnackbarContent/index.js @@ -1,4 +1,3 @@ -'use client'; export { default } from './SnackbarContent'; export { default as snackbarContentClasses } from './snackbarContentClasses'; diff --git a/packages/mui-material/src/SpeedDial/SpeedDial.d.ts b/packages/mui-material/src/SpeedDial/SpeedDial.d.ts index b163ce53477207..c3076ce770175f 100644 --- a/packages/mui-material/src/SpeedDial/SpeedDial.d.ts +++ b/packages/mui-material/src/SpeedDial/SpeedDial.d.ts @@ -13,11 +13,11 @@ export type OpenReason = 'toggle' | 'focus' | 'mouseEnter'; export interface SpeedDialSlots { /** * The component that renders the transition. - * [Follow this guide](/material-ui/transitions/#transitioncomponent-prop) to learn more about the requirements for this component. + * [Follow this guide](https://mui.com/material-ui/transitions/#transitioncomponent-prop) to learn more about the requirements for this component. * @default {} */ - transition?: React.JSXElementConstructor< - TransitionProps & { children: React.ReactElement<any, any> } + transition: React.JSXElementConstructor< + TransitionProps & { children: React.ReactElement<unknown, any> } >; } @@ -58,7 +58,7 @@ export interface SpeedDialProps */ hidden?: boolean; /** - * Props applied to the [`Fab`](/material-ui/api/fab/) element. + * Props applied to the [`Fab`](https://mui.com/material-ui/api/fab/) element. * @default {} */ FabProps?: Partial<FabProps>; @@ -95,7 +95,7 @@ export interface SpeedDialProps sx?: SxProps<Theme>; /** * The component used for the transition. - * [Follow this guide](/material-ui/transitions/#transitioncomponent-prop) to learn more about the requirements for this component. + * [Follow this guide](https://mui.com/material-ui/transitions/#transitioncomponent-prop) to learn more about the requirements for this component. * @default Zoom */ TransitionComponent?: React.JSXElementConstructor<TransitionProps>; @@ -121,10 +121,10 @@ export interface SpeedDialOwnerState extends SpeedDialProps {} * * Demos: * - * - [Speed Dial](https://next.mui.com/material-ui/react-speed-dial/) + * - [Speed Dial](https://mui.com/material-ui/react-speed-dial/) * * API: * - * - [SpeedDial API](https://next.mui.com/material-ui/api/speed-dial/) + * - [SpeedDial API](https://mui.com/material-ui/api/speed-dial/) */ export default function SpeedDial(props: SpeedDialProps): React.JSX.Element; diff --git a/packages/mui-material/src/SpeedDial/SpeedDial.js b/packages/mui-material/src/SpeedDial/SpeedDial.js index 378962f80fb0fc..8d9d9fdbe4197e 100644 --- a/packages/mui-material/src/SpeedDial/SpeedDial.js +++ b/packages/mui-material/src/SpeedDial/SpeedDial.js @@ -473,7 +473,7 @@ SpeedDial.propTypes /* remove-proptypes */ = { */ direction: PropTypes.oneOf(['down', 'left', 'right', 'up']), /** - * Props applied to the [`Fab`](/material-ui/api/fab/) element. + * Props applied to the [`Fab`](https://mui.com/material-ui/api/fab/) element. * @default {} */ FabProps: PropTypes.object, @@ -553,7 +553,7 @@ SpeedDial.propTypes /* remove-proptypes */ = { ]), /** * The component used for the transition. - * [Follow this guide](/material-ui/transitions/#transitioncomponent-prop) to learn more about the requirements for this component. + * [Follow this guide](https://mui.com/material-ui/transitions/#transitioncomponent-prop) to learn more about the requirements for this component. * @default Zoom */ TransitionComponent: PropTypes.elementType, diff --git a/packages/mui-material/src/SpeedDial/index.js b/packages/mui-material/src/SpeedDial/index.js index e5e9897eb921e1..22eeb5a48f0852 100644 --- a/packages/mui-material/src/SpeedDial/index.js +++ b/packages/mui-material/src/SpeedDial/index.js @@ -1,4 +1,3 @@ -'use client'; export { default } from './SpeedDial'; export { default as speedDialClasses } from './speedDialClasses'; diff --git a/packages/mui-material/src/SpeedDialAction/SpeedDialAction.d.ts b/packages/mui-material/src/SpeedDialAction/SpeedDialAction.d.ts index e9733bfc744a20..8c288ca4b7de00 100644 --- a/packages/mui-material/src/SpeedDialAction/SpeedDialAction.d.ts +++ b/packages/mui-material/src/SpeedDialAction/SpeedDialAction.d.ts @@ -12,7 +12,7 @@ export interface SpeedDialActionProps extends StandardProps<Partial<TooltipProps */ classes?: Partial<SpeedDialActionClasses>; /** - * Props applied to the [`Fab`](/material-ui/api/fab/) component. + * Props applied to the [`Fab`](https://mui.com/material-ui/api/fab/) component. * @default {} */ FabProps?: Partial<FabProps>; @@ -30,7 +30,7 @@ export interface SpeedDialActionProps extends StandardProps<Partial<TooltipProps */ sx?: SxProps<Theme>; /** - * `classes` prop applied to the [`Tooltip`](/material-ui/api/tooltip/) element. + * `classes` prop applied to the [`Tooltip`](https://mui.com/material-ui/api/tooltip/) element. */ TooltipClasses?: TooltipProps['classes']; /** @@ -53,11 +53,11 @@ export interface SpeedDialActionProps extends StandardProps<Partial<TooltipProps * * Demos: * - * - [Speed Dial](https://next.mui.com/material-ui/react-speed-dial/) + * - [Speed Dial](https://mui.com/material-ui/react-speed-dial/) * * API: * - * - [SpeedDialAction API](https://next.mui.com/material-ui/api/speed-dial-action/) - * - inherits [Tooltip API](https://next.mui.com/material-ui/api/tooltip/) + * - [SpeedDialAction API](https://mui.com/material-ui/api/speed-dial-action/) + * - inherits [Tooltip API](https://mui.com/material-ui/api/tooltip/) */ export default function SpeedDialAction(props: SpeedDialActionProps): React.JSX.Element; diff --git a/packages/mui-material/src/SpeedDialAction/SpeedDialAction.js b/packages/mui-material/src/SpeedDialAction/SpeedDialAction.js index ef75983bd42d54..340633f5617e94 100644 --- a/packages/mui-material/src/SpeedDialAction/SpeedDialAction.js +++ b/packages/mui-material/src/SpeedDialAction/SpeedDialAction.js @@ -254,7 +254,7 @@ SpeedDialAction.propTypes /* remove-proptypes */ = { */ delay: PropTypes.number, /** - * Props applied to the [`Fab`](/material-ui/api/fab/) component. + * Props applied to the [`Fab`](https://mui.com/material-ui/api/fab/) component. * @default {} */ FabProps: PropTypes.object, @@ -280,7 +280,7 @@ SpeedDialAction.propTypes /* remove-proptypes */ = { PropTypes.object, ]), /** - * `classes` prop applied to the [`Tooltip`](/material-ui/api/tooltip/) element. + * `classes` prop applied to the [`Tooltip`](https://mui.com/material-ui/api/tooltip/) element. */ TooltipClasses: PropTypes.object, /** diff --git a/packages/mui-material/src/SpeedDialAction/index.js b/packages/mui-material/src/SpeedDialAction/index.js index 06ea3a1f587594..6a6d8319ff1784 100644 --- a/packages/mui-material/src/SpeedDialAction/index.js +++ b/packages/mui-material/src/SpeedDialAction/index.js @@ -1,4 +1,3 @@ -'use client'; export { default } from './SpeedDialAction'; export { default as speedDialActionClasses } from './speedDialActionClasses'; diff --git a/packages/mui-material/src/SpeedDialIcon/SpeedDialIcon.d.ts b/packages/mui-material/src/SpeedDialIcon/SpeedDialIcon.d.ts index 6d62fcd73a135e..81b87d264c24d0 100644 --- a/packages/mui-material/src/SpeedDialIcon/SpeedDialIcon.d.ts +++ b/packages/mui-material/src/SpeedDialIcon/SpeedDialIcon.d.ts @@ -33,11 +33,11 @@ export interface SpeedDialIconProps * * Demos: * - * - [Speed Dial](https://next.mui.com/material-ui/react-speed-dial/) + * - [Speed Dial](https://mui.com/material-ui/react-speed-dial/) * * API: * - * - [SpeedDialIcon API](https://next.mui.com/material-ui/api/speed-dial-icon/) + * - [SpeedDialIcon API](https://mui.com/material-ui/api/speed-dial-icon/) */ declare const SpeedDialIcon: ((props: SpeedDialIconProps) => React.JSX.Element) & { muiName: string; diff --git a/packages/mui-material/src/SpeedDialIcon/index.js b/packages/mui-material/src/SpeedDialIcon/index.js index 79182b4179f4e5..19c450e2c69450 100644 --- a/packages/mui-material/src/SpeedDialIcon/index.js +++ b/packages/mui-material/src/SpeedDialIcon/index.js @@ -1,4 +1,3 @@ -'use client'; export { default } from './SpeedDialIcon'; export { default as speedDialIconClasses } from './speedDialIconClasses'; diff --git a/packages/mui-material/src/Stack/Stack.d.ts b/packages/mui-material/src/Stack/Stack.d.ts index 6692dc514a7d63..fe13177c0b0aae 100644 --- a/packages/mui-material/src/Stack/Stack.d.ts +++ b/packages/mui-material/src/Stack/Stack.d.ts @@ -50,11 +50,11 @@ export interface StackTypeMap< * * Demos: * - * - [Stack](https://next.mui.com/material-ui/react-stack/) + * - [Stack](https://mui.com/material-ui/react-stack/) * * API: * - * - [Stack API](https://next.mui.com/material-ui/api/stack/) + * - [Stack API](https://mui.com/material-ui/api/stack/) */ declare const Stack: OverridableComponent<StackTypeMap>; diff --git a/packages/mui-material/src/Stack/index.js b/packages/mui-material/src/Stack/index.js index bf039ea305c901..2eb8645cc51ca0 100644 --- a/packages/mui-material/src/Stack/index.js +++ b/packages/mui-material/src/Stack/index.js @@ -1,3 +1,2 @@ -'use client'; export { default } from './Stack'; export { default as stackClasses } from './stackClasses'; diff --git a/packages/mui-material/src/Step/Step.d.ts b/packages/mui-material/src/Step/Step.d.ts index 4124ae1cfc367d..ccb6f1044ff242 100644 --- a/packages/mui-material/src/Step/Step.d.ts +++ b/packages/mui-material/src/Step/Step.d.ts @@ -68,11 +68,11 @@ export type StepClasskey = keyof NonNullable<StepProps['classes']>; * * Demos: * - * - [Stepper](https://next.mui.com/material-ui/react-stepper/) + * - [Stepper](https://mui.com/material-ui/react-stepper/) * * API: * - * - [Step API](https://next.mui.com/material-ui/api/step/) + * - [Step API](https://mui.com/material-ui/api/step/) */ declare const Step: OverridableComponent<StepTypeMap>; diff --git a/packages/mui-material/src/Step/index.js b/packages/mui-material/src/Step/index.js index 1255fcc2added7..5c8dc441973e51 100644 --- a/packages/mui-material/src/Step/index.js +++ b/packages/mui-material/src/Step/index.js @@ -1,4 +1,3 @@ -'use client'; export { default } from './Step'; export { default as stepClasses } from './stepClasses'; diff --git a/packages/mui-material/src/StepButton/StepButton.d.ts b/packages/mui-material/src/StepButton/StepButton.d.ts index c14a0a3df7f889..e5593d63872cc2 100644 --- a/packages/mui-material/src/StepButton/StepButton.d.ts +++ b/packages/mui-material/src/StepButton/StepButton.d.ts @@ -47,12 +47,12 @@ export type StepButtonTypeMap< * * Demos: * - * - [Stepper](https://next.mui.com/material-ui/react-stepper/) + * - [Stepper](https://mui.com/material-ui/react-stepper/) * * API: * - * - [StepButton API](https://next.mui.com/material-ui/api/step-button/) - * - inherits [ButtonBase API](https://next.mui.com/material-ui/api/button-base/) + * - [StepButton API](https://mui.com/material-ui/api/step-button/) + * - inherits [ButtonBase API](https://mui.com/material-ui/api/button-base/) */ declare const StepButton: ExtendButtonBase< StepButtonTypeMap<{}, ButtonBaseTypeMap['defaultComponent']> diff --git a/packages/mui-material/src/StepButton/index.js b/packages/mui-material/src/StepButton/index.js index 388011bdf53b4f..5a0c1d194a0505 100644 --- a/packages/mui-material/src/StepButton/index.js +++ b/packages/mui-material/src/StepButton/index.js @@ -1,4 +1,3 @@ -'use client'; export { default } from './StepButton'; export { default as stepButtonClasses } from './stepButtonClasses'; diff --git a/packages/mui-material/src/StepConnector/StepConnector.d.ts b/packages/mui-material/src/StepConnector/StepConnector.d.ts index bb2b26f0dde028..1837606f674bc8 100644 --- a/packages/mui-material/src/StepConnector/StepConnector.d.ts +++ b/packages/mui-material/src/StepConnector/StepConnector.d.ts @@ -24,10 +24,10 @@ export type StepConnectorClasskey = keyof NonNullable<StepConnectorProps['classe * * Demos: * - * - [Stepper](https://next.mui.com/material-ui/react-stepper/) + * - [Stepper](https://mui.com/material-ui/react-stepper/) * * API: * - * - [StepConnector API](https://next.mui.com/material-ui/api/step-connector/) + * - [StepConnector API](https://mui.com/material-ui/api/step-connector/) */ export default function StepConnector(props: StepConnectorProps): React.JSX.Element; diff --git a/packages/mui-material/src/StepConnector/index.js b/packages/mui-material/src/StepConnector/index.js index 492c8bfee6e8fb..286d2f3240c0de 100644 --- a/packages/mui-material/src/StepConnector/index.js +++ b/packages/mui-material/src/StepConnector/index.js @@ -1,4 +1,3 @@ -'use client'; export { default } from './StepConnector'; export { default as stepConnectorClasses } from './stepConnectorClasses'; diff --git a/packages/mui-material/src/StepContent/StepContent.d.ts b/packages/mui-material/src/StepContent/StepContent.d.ts index 3d46e210338b64..2fc588386d0006 100644 --- a/packages/mui-material/src/StepContent/StepContent.d.ts +++ b/packages/mui-material/src/StepContent/StepContent.d.ts @@ -20,11 +20,11 @@ export interface StepContentProps extends StandardProps<React.HTMLAttributes<HTM sx?: SxProps<Theme>; /** * The component used for the transition. - * [Follow this guide](/material-ui/transitions/#transitioncomponent-prop) to learn more about the requirements for this component. + * [Follow this guide](https://mui.com/material-ui/transitions/#transitioncomponent-prop) to learn more about the requirements for this component. * @default Collapse */ TransitionComponent?: React.JSXElementConstructor< - TransitionProps & { children: React.ReactElement<any, any> } + TransitionProps & { children: React.ReactElement<unknown, any> } >; /** * Adjust the duration of the content expand transition. @@ -47,10 +47,10 @@ export type StepContentClasskey = keyof NonNullable<StepContentProps['classes']> * * Demos: * - * - [Stepper](https://next.mui.com/material-ui/react-stepper/) + * - [Stepper](https://mui.com/material-ui/react-stepper/) * * API: * - * - [StepContent API](https://next.mui.com/material-ui/api/step-content/) + * - [StepContent API](https://mui.com/material-ui/api/step-content/) */ export default function StepContent(props: StepContentProps): React.JSX.Element; diff --git a/packages/mui-material/src/StepContent/StepContent.js b/packages/mui-material/src/StepContent/StepContent.js index f806bacde0c685..f6b47f8ee0a3b5 100644 --- a/packages/mui-material/src/StepContent/StepContent.js +++ b/packages/mui-material/src/StepContent/StepContent.js @@ -132,7 +132,7 @@ StepContent.propTypes /* remove-proptypes */ = { ]), /** * The component used for the transition. - * [Follow this guide](/material-ui/transitions/#transitioncomponent-prop) to learn more about the requirements for this component. + * [Follow this guide](https://mui.com/material-ui/transitions/#transitioncomponent-prop) to learn more about the requirements for this component. * @default Collapse */ TransitionComponent: PropTypes.elementType, diff --git a/packages/mui-material/src/StepContent/index.js b/packages/mui-material/src/StepContent/index.js index 3b38c1adea20c9..d0fb5c7da6b77d 100644 --- a/packages/mui-material/src/StepContent/index.js +++ b/packages/mui-material/src/StepContent/index.js @@ -1,4 +1,3 @@ -'use client'; export { default } from './StepContent'; export { default as stepContentClasses } from './stepContentClasses'; diff --git a/packages/mui-material/src/StepIcon/StepIcon.d.ts b/packages/mui-material/src/StepIcon/StepIcon.d.ts index f640ce25594866..d71906a033977e 100644 --- a/packages/mui-material/src/StepIcon/StepIcon.d.ts +++ b/packages/mui-material/src/StepIcon/StepIcon.d.ts @@ -41,10 +41,10 @@ export type StepIconClasskey = keyof NonNullable<StepIconProps['classes']>; * * Demos: * - * - [Stepper](https://next.mui.com/material-ui/react-stepper/) + * - [Stepper](https://mui.com/material-ui/react-stepper/) * * API: * - * - [StepIcon API](https://next.mui.com/material-ui/api/step-icon/) + * - [StepIcon API](https://mui.com/material-ui/api/step-icon/) */ export default function StepIcon(props: StepIconProps): React.JSX.Element; diff --git a/packages/mui-material/src/StepIcon/index.js b/packages/mui-material/src/StepIcon/index.js index bd9afa42a4736a..555e6cf418581d 100644 --- a/packages/mui-material/src/StepIcon/index.js +++ b/packages/mui-material/src/StepIcon/index.js @@ -1,4 +1,3 @@ -'use client'; export { default } from './StepIcon'; export { default as stepIconClasses } from './stepIconClasses'; diff --git a/packages/mui-material/src/StepLabel/StepLabel.d.ts b/packages/mui-material/src/StepLabel/StepLabel.d.ts index da324c2a58e4c2..7e4d8850401508 100644 --- a/packages/mui-material/src/StepLabel/StepLabel.d.ts +++ b/packages/mui-material/src/StepLabel/StepLabel.d.ts @@ -11,11 +11,11 @@ export interface StepLabelSlots { * The component that renders the label. * @default span */ - label?: React.ElementType; + label: React.ElementType; /** - * The component to render in place of the [`StepIcon`](/material-ui/api/step-icon/). + * The component to render in place of the [`StepIcon`](https://mui.com/material-ui/api/step-icon/). */ - stepIcon?: React.ElementType<StepIconProps>; + stepIcon: React.ElementType<StepIconProps>; } export type StepLabelSlotsAndSlotProps = CreateSlotsAndSlotProps< @@ -42,7 +42,7 @@ export interface StepLabelProps /** * The props used for each slot inside. * @default {} - * @deprecated use the `slotProps` prop instead. This prop will be removed in v7. See [Migrating from deprecated APIs](/material-ui/migration/migrating-from-deprecated-apis/) for more details. + * @deprecated use the `slotProps` prop instead. This prop will be removed in v7. See [Migrating from deprecated APIs](https://mui.com/material-ui/migration/migrating-from-deprecated-apis/) for more details. */ componentsProps?: { /** @@ -65,11 +65,11 @@ export interface StepLabelProps */ optional?: React.ReactNode; /** - * The component to render in place of the [`StepIcon`](/material-ui/api/step-icon/). + * The component to render in place of the [`StepIcon`](https://mui.com/material-ui/api/step-icon/). */ StepIconComponent?: React.ElementType<StepIconProps>; /** - * Props applied to the [`StepIcon`](/material-ui/api/step-icon/) element. + * Props applied to the [`StepIcon`](https://mui.com/material-ui/api/step-icon/) element. */ StepIconProps?: Partial<StepIconProps>; /** @@ -84,11 +84,11 @@ export type StepLabelClasskey = keyof NonNullable<StepLabelProps['classes']>; * * Demos: * - * - [Stepper](https://next.mui.com/material-ui/react-stepper/) + * - [Stepper](https://mui.com/material-ui/react-stepper/) * * API: * - * - [StepLabel API](https://next.mui.com/material-ui/api/step-label/) + * - [StepLabel API](https://mui.com/material-ui/api/step-label/) */ declare const StepLabel: ((props: StepLabelProps) => React.JSX.Element) & { muiName: string; diff --git a/packages/mui-material/src/StepLabel/StepLabel.js b/packages/mui-material/src/StepLabel/StepLabel.js index e706f9151c810e..fc590de90098a2 100644 --- a/packages/mui-material/src/StepLabel/StepLabel.js +++ b/packages/mui-material/src/StepLabel/StepLabel.js @@ -237,7 +237,7 @@ StepLabel.propTypes /* remove-proptypes */ = { /** * The props used for each slot inside. * @default {} - * @deprecated use the `slotProps` prop instead. This prop will be removed in v7. See [Migrating from deprecated APIs](/material-ui/migration/migrating-from-deprecated-apis/) for more details. + * @deprecated use the `slotProps` prop instead. This prop will be removed in v7. See [Migrating from deprecated APIs](https://mui.com/material-ui/migration/migrating-from-deprecated-apis/) for more details. */ componentsProps: PropTypes.shape({ label: PropTypes.object, @@ -272,11 +272,11 @@ StepLabel.propTypes /* remove-proptypes */ = { stepIcon: PropTypes.elementType, }), /** - * The component to render in place of the [`StepIcon`](/material-ui/api/step-icon/). + * The component to render in place of the [`StepIcon`](https://mui.com/material-ui/api/step-icon/). */ StepIconComponent: PropTypes.elementType, /** - * Props applied to the [`StepIcon`](/material-ui/api/step-icon/) element. + * Props applied to the [`StepIcon`](https://mui.com/material-ui/api/step-icon/) element. */ StepIconProps: PropTypes.object, /** diff --git a/packages/mui-material/src/StepLabel/index.js b/packages/mui-material/src/StepLabel/index.js index 519623052a9be3..b60fad9c328271 100644 --- a/packages/mui-material/src/StepLabel/index.js +++ b/packages/mui-material/src/StepLabel/index.js @@ -1,4 +1,3 @@ -'use client'; export { default } from './StepLabel'; export { default as stepLabelClasses } from './stepLabelClasses'; diff --git a/packages/mui-material/src/Stepper/Stepper.d.ts b/packages/mui-material/src/Stepper/Stepper.d.ts index 68b5afe796b4bb..5fc6837acaf0b0 100644 --- a/packages/mui-material/src/Stepper/Stepper.d.ts +++ b/packages/mui-material/src/Stepper/Stepper.d.ts @@ -32,7 +32,7 @@ export interface StepperOwnProps extends Pick<PaperProps, 'elevation' | 'square' * An element to be placed between each step. * @default <StepConnector /> */ - connector?: React.ReactElement<any, any> | null; + connector?: React.ReactElement<unknown, any> | null; /** * If set the `Stepper` will not assist in controlling steps for linear flow. * @default false @@ -70,11 +70,11 @@ export type StepperClasskey = keyof NonNullable<StepperProps['classes']>; * * Demos: * - * - [Stepper](https://next.mui.com/material-ui/react-stepper/) + * - [Stepper](https://mui.com/material-ui/react-stepper/) * * API: * - * - [Stepper API](https://next.mui.com/material-ui/api/stepper/) + * - [Stepper API](https://mui.com/material-ui/api/stepper/) */ declare const Stepper: OverridableComponent<StepperTypeMap>; diff --git a/packages/mui-material/src/Stepper/index.js b/packages/mui-material/src/Stepper/index.js index e3075b49cf6af1..550f0b648ad7e0 100644 --- a/packages/mui-material/src/Stepper/index.js +++ b/packages/mui-material/src/Stepper/index.js @@ -1,4 +1,3 @@ -'use client'; export { default } from './Stepper'; export { default as stepperClasses } from './stepperClasses'; diff --git a/packages/mui-material/src/SvgIcon/SvgIcon.d.ts b/packages/mui-material/src/SvgIcon/SvgIcon.d.ts index 842e68e24dd59d..f759ef569f5939 100644 --- a/packages/mui-material/src/SvgIcon/SvgIcon.d.ts +++ b/packages/mui-material/src/SvgIcon/SvgIcon.d.ts @@ -94,12 +94,12 @@ export interface SvgIconTypeMap< * * Demos: * - * - [Icons](https://next.mui.com/material-ui/icons/) - * - [Material Icons](https://next.mui.com/material-ui/material-icons/) + * - [Icons](https://mui.com/material-ui/icons/) + * - [Material Icons](https://mui.com/material-ui/material-icons/) * * API: * - * - [SvgIcon API](https://next.mui.com/material-ui/api/svg-icon/) + * - [SvgIcon API](https://mui.com/material-ui/api/svg-icon/) */ declare const SvgIcon: OverridableComponent<SvgIconTypeMap> & { muiName: string }; diff --git a/packages/mui-material/src/SvgIcon/index.js b/packages/mui-material/src/SvgIcon/index.js index 54246af9b83156..4efcade7020cce 100644 --- a/packages/mui-material/src/SvgIcon/index.js +++ b/packages/mui-material/src/SvgIcon/index.js @@ -1,4 +1,3 @@ -'use client'; export { default } from './SvgIcon'; export { default as svgIconClasses } from './svgIconClasses'; diff --git a/packages/mui-material/src/SwipeableDrawer/SwipeableDrawer.d.ts b/packages/mui-material/src/SwipeableDrawer/SwipeableDrawer.d.ts index 47b09550d93dde..fea68f162183d7 100644 --- a/packages/mui-material/src/SwipeableDrawer/SwipeableDrawer.d.ts +++ b/packages/mui-material/src/SwipeableDrawer/SwipeableDrawer.d.ts @@ -81,12 +81,12 @@ export interface SwipeableDrawerProps extends Omit<DrawerProps, 'onClose' | 'ope * * Demos: * - * - [Drawer](https://next.mui.com/material-ui/react-drawer/) + * - [Drawer](https://mui.com/material-ui/react-drawer/) * * API: * - * - [SwipeableDrawer API](https://next.mui.com/material-ui/api/swipeable-drawer/) - * - inherits [Drawer API](https://next.mui.com/material-ui/api/drawer/) + * - [SwipeableDrawer API](https://mui.com/material-ui/api/swipeable-drawer/) + * - inherits [Drawer API](https://mui.com/material-ui/api/drawer/) */ declare const SwipeableDrawer: React.JSXElementConstructor<SwipeableDrawerProps>; diff --git a/packages/mui-material/src/SwipeableDrawer/index.js b/packages/mui-material/src/SwipeableDrawer/index.js index 7cae5e6bfc1147..56a2ccfdcb02aa 100644 --- a/packages/mui-material/src/SwipeableDrawer/index.js +++ b/packages/mui-material/src/SwipeableDrawer/index.js @@ -1,2 +1 @@ -'use client'; export { default } from './SwipeableDrawer'; diff --git a/packages/mui-material/src/Switch/Switch.d.ts b/packages/mui-material/src/Switch/Switch.d.ts index c9029f20bc58b9..b57cb0aa32fa4c 100644 --- a/packages/mui-material/src/Switch/Switch.d.ts +++ b/packages/mui-material/src/Switch/Switch.d.ts @@ -58,12 +58,12 @@ export interface SwitchProps * * Demos: * - * - [Switch](https://next.mui.com/material-ui/react-switch/) - * - [Transfer List](https://next.mui.com/material-ui/react-transfer-list/) + * - [Switch](https://mui.com/material-ui/react-switch/) + * - [Transfer List](https://mui.com/material-ui/react-transfer-list/) * * API: * - * - [Switch API](https://next.mui.com/material-ui/api/switch/) - * - inherits [IconButton API](https://next.mui.com/material-ui/api/icon-button/) + * - [Switch API](https://mui.com/material-ui/api/switch/) + * - inherits [IconButton API](https://mui.com/material-ui/api/icon-button/) */ export default function Switch(props: SwitchProps): React.JSX.Element; diff --git a/packages/mui-material/src/Switch/index.js b/packages/mui-material/src/Switch/index.js index 6e53e01c5c3dba..eb3612573cef80 100644 --- a/packages/mui-material/src/Switch/index.js +++ b/packages/mui-material/src/Switch/index.js @@ -1,4 +1,3 @@ -'use client'; export { default } from './Switch'; export { default as switchClasses } from './switchClasses'; diff --git a/packages/mui-material/src/Tab/Tab.d.ts b/packages/mui-material/src/Tab/Tab.d.ts index fd173c2e434e92..eafa235b722b4b 100644 --- a/packages/mui-material/src/Tab/Tab.d.ts +++ b/packages/mui-material/src/Tab/Tab.d.ts @@ -66,12 +66,12 @@ export type TabTypeMap< * * Demos: * - * - [Tabs](https://next.mui.com/material-ui/react-tabs/) + * - [Tabs](https://mui.com/material-ui/react-tabs/) * * API: * - * - [Tab API](https://next.mui.com/material-ui/api/tab/) - * - inherits [ButtonBase API](https://next.mui.com/material-ui/api/button-base/) + * - [Tab API](https://mui.com/material-ui/api/tab/) + * - inherits [ButtonBase API](https://mui.com/material-ui/api/button-base/) */ declare const Tab: ExtendButtonBase<TabTypeMap>; diff --git a/packages/mui-material/src/Tab/index.js b/packages/mui-material/src/Tab/index.js index 29213284d8cbd8..7c828ba9dd2757 100644 --- a/packages/mui-material/src/Tab/index.js +++ b/packages/mui-material/src/Tab/index.js @@ -1,4 +1,3 @@ -'use client'; export { default } from './Tab'; export { default as tabClasses } from './tabClasses'; diff --git a/packages/mui-material/src/TabScrollButton/TabScrollButton.d.ts b/packages/mui-material/src/TabScrollButton/TabScrollButton.d.ts index aefc6db919ce78..b7c38525c46a12 100644 --- a/packages/mui-material/src/TabScrollButton/TabScrollButton.d.ts +++ b/packages/mui-material/src/TabScrollButton/TabScrollButton.d.ts @@ -69,10 +69,10 @@ export interface TabScrollButtonProps extends ButtonBaseProps { * * Demos: * - * - [Tabs](https://next.mui.com/material-ui/react-tabs/) + * - [Tabs](https://mui.com/material-ui/react-tabs/) * * API: * - * - [TabScrollButton API](https://next.mui.com/material-ui/api/tab-scroll-button/) + * - [TabScrollButton API](https://mui.com/material-ui/api/tab-scroll-button/) */ export default function TabScrollButton(props: TabScrollButtonProps): React.JSX.Element; diff --git a/packages/mui-material/src/TabScrollButton/index.js b/packages/mui-material/src/TabScrollButton/index.js index 15aa330441752b..6c84cb4dca3377 100644 --- a/packages/mui-material/src/TabScrollButton/index.js +++ b/packages/mui-material/src/TabScrollButton/index.js @@ -1,4 +1,3 @@ -'use client'; export { default } from './TabScrollButton'; export { default as tabScrollButtonClasses } from './tabScrollButtonClasses'; diff --git a/packages/mui-material/src/Table/Table.d.ts b/packages/mui-material/src/Table/Table.d.ts index 88da07b45aabf4..4327d327dc68b9 100644 --- a/packages/mui-material/src/Table/Table.d.ts +++ b/packages/mui-material/src/Table/Table.d.ts @@ -48,11 +48,11 @@ export interface TableTypeMap< * * Demos: * - * - [Table](https://next.mui.com/material-ui/react-table/) + * - [Table](https://mui.com/material-ui/react-table/) * * API: * - * - [Table API](https://next.mui.com/material-ui/api/table/) + * - [Table API](https://mui.com/material-ui/api/table/) */ declare const Table: OverridableComponent<TableTypeMap>; diff --git a/packages/mui-material/src/Table/index.js b/packages/mui-material/src/Table/index.js index 49ca62cf115ca1..dea2be8d78f2a0 100644 --- a/packages/mui-material/src/Table/index.js +++ b/packages/mui-material/src/Table/index.js @@ -1,4 +1,3 @@ -'use client'; export { default } from './Table'; export { default as tableClasses } from './tableClasses'; diff --git a/packages/mui-material/src/TableBody/TableBody.d.ts b/packages/mui-material/src/TableBody/TableBody.d.ts index a71b369426e0ce..144f01676c378e 100644 --- a/packages/mui-material/src/TableBody/TableBody.d.ts +++ b/packages/mui-material/src/TableBody/TableBody.d.ts @@ -30,11 +30,11 @@ export interface TableBodyTypeMap< * * Demos: * - * - [Table](https://next.mui.com/material-ui/react-table/) + * - [Table](https://mui.com/material-ui/react-table/) * * API: * - * - [TableBody API](https://next.mui.com/material-ui/api/table-body/) + * - [TableBody API](https://mui.com/material-ui/api/table-body/) */ declare const TableBody: OverridableComponent<TableBodyTypeMap>; diff --git a/packages/mui-material/src/TableBody/index.js b/packages/mui-material/src/TableBody/index.js index 1c2fb035dfd798..f9d4adef78fbd2 100644 --- a/packages/mui-material/src/TableBody/index.js +++ b/packages/mui-material/src/TableBody/index.js @@ -1,4 +1,3 @@ -'use client'; export { default } from './TableBody'; export { default as tableBodyClasses } from './tableBodyClasses'; diff --git a/packages/mui-material/src/TableCell/TableCell.d.ts b/packages/mui-material/src/TableCell/TableCell.d.ts index 30e14effcf4ef9..0a5de08842ca09 100644 --- a/packages/mui-material/src/TableCell/TableCell.d.ts +++ b/packages/mui-material/src/TableCell/TableCell.d.ts @@ -77,10 +77,10 @@ export type SortDirection = 'asc' | 'desc' | false; * * Demos: * - * - [Table](https://next.mui.com/material-ui/react-table/) + * - [Table](https://mui.com/material-ui/react-table/) * * API: * - * - [TableCell API](https://next.mui.com/material-ui/api/table-cell/) + * - [TableCell API](https://mui.com/material-ui/api/table-cell/) */ export default function TableCell(props: TableCellProps): React.JSX.Element; diff --git a/packages/mui-material/src/TableCell/index.js b/packages/mui-material/src/TableCell/index.js index 42be81da5e1df2..d02d3290bf6dab 100644 --- a/packages/mui-material/src/TableCell/index.js +++ b/packages/mui-material/src/TableCell/index.js @@ -1,4 +1,3 @@ -'use client'; export { default } from './TableCell'; export { default as tableCellClasses } from './tableCellClasses'; diff --git a/packages/mui-material/src/TableContainer/TableContainer.d.ts b/packages/mui-material/src/TableContainer/TableContainer.d.ts index a2b923f4bb4dfb..053af18e278bfa 100644 --- a/packages/mui-material/src/TableContainer/TableContainer.d.ts +++ b/packages/mui-material/src/TableContainer/TableContainer.d.ts @@ -30,11 +30,11 @@ export interface TableContainerTypeMap< * * Demos: * - * - [Table](https://next.mui.com/material-ui/react-table/) + * - [Table](https://mui.com/material-ui/react-table/) * * API: * - * - [TableContainer API](https://next.mui.com/material-ui/api/table-container/) + * - [TableContainer API](https://mui.com/material-ui/api/table-container/) */ declare const TableContainer: OverridableComponent<TableContainerTypeMap>; diff --git a/packages/mui-material/src/TableContainer/index.js b/packages/mui-material/src/TableContainer/index.js index c3fc026d92a2f4..094fb1fd2e1fb4 100644 --- a/packages/mui-material/src/TableContainer/index.js +++ b/packages/mui-material/src/TableContainer/index.js @@ -1,4 +1,3 @@ -'use client'; export { default } from './TableContainer'; export { default as tableContainerClasses } from './tableContainerClasses'; diff --git a/packages/mui-material/src/TableFooter/TableFooter.d.ts b/packages/mui-material/src/TableFooter/TableFooter.d.ts index 2bb494f1e8af71..7dacb5fb80492b 100644 --- a/packages/mui-material/src/TableFooter/TableFooter.d.ts +++ b/packages/mui-material/src/TableFooter/TableFooter.d.ts @@ -30,11 +30,11 @@ export interface TableFooterTypeMap< * * Demos: * - * - [Table](https://next.mui.com/material-ui/react-table/) + * - [Table](https://mui.com/material-ui/react-table/) * * API: * - * - [TableFooter API](https://next.mui.com/material-ui/api/table-footer/) + * - [TableFooter API](https://mui.com/material-ui/api/table-footer/) */ declare const TableFooter: OverridableComponent<TableFooterTypeMap>; diff --git a/packages/mui-material/src/TableFooter/index.js b/packages/mui-material/src/TableFooter/index.js index 886cce9e96d4c6..4d3199f1bb616d 100644 --- a/packages/mui-material/src/TableFooter/index.js +++ b/packages/mui-material/src/TableFooter/index.js @@ -1,4 +1,3 @@ -'use client'; export { default } from './TableFooter'; export { default as tableFooterClasses } from './tableFooterClasses'; diff --git a/packages/mui-material/src/TableHead/TableHead.d.ts b/packages/mui-material/src/TableHead/TableHead.d.ts index 3a4b1451e15ed6..8646071c5c0e4c 100644 --- a/packages/mui-material/src/TableHead/TableHead.d.ts +++ b/packages/mui-material/src/TableHead/TableHead.d.ts @@ -30,11 +30,11 @@ export interface TableHeadTypeMap< * * Demos: * - * - [Table](https://next.mui.com/material-ui/react-table/) + * - [Table](https://mui.com/material-ui/react-table/) * * API: * - * - [TableHead API](https://next.mui.com/material-ui/api/table-head/) + * - [TableHead API](https://mui.com/material-ui/api/table-head/) */ declare const TableHead: OverridableComponent<TableHeadTypeMap>; diff --git a/packages/mui-material/src/TableHead/index.js b/packages/mui-material/src/TableHead/index.js index 12e83aab59511d..c7622e8ab2424f 100644 --- a/packages/mui-material/src/TableHead/index.js +++ b/packages/mui-material/src/TableHead/index.js @@ -1,4 +1,3 @@ -'use client'; export { default } from './TableHead'; export { default as tableHeadClasses } from './tableHeadClasses'; diff --git a/packages/mui-material/src/TablePagination/TablePagination.d.ts b/packages/mui-material/src/TablePagination/TablePagination.d.ts index d741e160780cec..e52eee2e1b898e 100644 --- a/packages/mui-material/src/TablePagination/TablePagination.d.ts +++ b/packages/mui-material/src/TablePagination/TablePagination.d.ts @@ -28,7 +28,7 @@ export interface TablePaginationOwnProps extends TablePaginationBaseProps { */ ActionsComponent?: React.ElementType<TablePaginationActionsProps>; /** - * Props applied to the back arrow [`IconButton`](/material-ui/api/icon-button/) component. + * Props applied to the back arrow [`IconButton`](https://mui.com/material-ui/api/icon-button/) component. * * This prop is an alias for `slotProps.actions.previousButton` and will be overriden by it if both are used. * @deprecated Use `slotProps.actions.previousButton` instead. @@ -53,7 +53,7 @@ export interface TablePaginationOwnProps extends TablePaginationBaseProps { * Accepts a function which returns a string value that provides a user-friendly name for the current page. * This is important for screen reader users. * - * For localization purposes, you can use the provided [translations](/material-ui/guides/localization/). + * For localization purposes, you can use the provided [translations](https://mui.com/material-ui/guides/localization/). * @param {string} type The link or button type to format ('first' | 'last' | 'next' | 'previous'). * @returns {string} * @default function defaultGetAriaLabel(type) { @@ -65,7 +65,7 @@ export interface TablePaginationOwnProps extends TablePaginationBaseProps { * Customize the displayed rows label. Invoked with a `{ from, to, count, page }` * object. * - * For localization purposes, you can use the provided [translations](/material-ui/guides/localization/). + * For localization purposes, you can use the provided [translations](https://mui.com/material-ui/guides/localization/). * @default function defaultLabelDisplayedRows({ from, to, count }) { * return `${from}–${to} of ${count !== -1 ? count : `more than ${to}`}`; * } @@ -74,12 +74,12 @@ export interface TablePaginationOwnProps extends TablePaginationBaseProps { /** * Customize the rows per page label. * - * For localization purposes, you can use the provided [translations](/material-ui/guides/localization/). + * For localization purposes, you can use the provided [translations](https://mui.com/material-ui/guides/localization/). * @default 'Rows per page:' */ labelRowsPerPage?: React.ReactNode; /** - * Props applied to the next arrow [`IconButton`](/material-ui/api/icon-button/) element. + * Props applied to the next arrow [`IconButton`](https://mui.com/material-ui/api/icon-button/) element. * * This prop is an alias for `slotProps.actions.nextButton` and will be overriden by it if both are used. * @deprecated Use `slotProps.actions.nextButton` instead. @@ -116,7 +116,7 @@ export interface TablePaginationOwnProps extends TablePaginationBaseProps { */ rowsPerPageOptions?: ReadonlyArray<number | { value: number; label: string }>; /** - * Props applied to the rows per page [`Select`](/material-ui/api/select/) element. + * Props applied to the rows per page [`Select`](https://mui.com/material-ui/api/select/) element. * * This prop is an alias for `slotProps.select` and will be overriden by it if both are used. * @deprecated Use `slotProps.select` instead. @@ -166,13 +166,13 @@ export interface TablePaginationTypeMap<AdditionalProps, RootComponent extends R * * Demos: * - * - [Pagination](https://next.mui.com/material-ui/react-pagination/) - * - [Table](https://next.mui.com/material-ui/react-table/) + * - [Pagination](https://mui.com/material-ui/react-pagination/) + * - [Table](https://mui.com/material-ui/react-table/) * * API: * - * - [TablePagination API](https://next.mui.com/material-ui/api/table-pagination/) - * - inherits [TableCell API](https://next.mui.com/material-ui/api/table-cell/) + * - [TablePagination API](https://mui.com/material-ui/api/table-pagination/) + * - inherits [TableCell API](https://mui.com/material-ui/api/table-cell/) */ declare const TablePagination: OverridableComponent< TablePaginationTypeMap<{}, React.JSXElementConstructor<TablePaginationBaseProps>> diff --git a/packages/mui-material/src/TablePagination/TablePagination.js b/packages/mui-material/src/TablePagination/TablePagination.js index a1dcd83742388f..7cf4445542451c 100644 --- a/packages/mui-material/src/TablePagination/TablePagination.js +++ b/packages/mui-material/src/TablePagination/TablePagination.js @@ -287,7 +287,7 @@ TablePagination.propTypes /* remove-proptypes */ = { */ ActionsComponent: PropTypes.elementType, /** - * Props applied to the back arrow [`IconButton`](/material-ui/api/icon-button/) component. + * Props applied to the back arrow [`IconButton`](https://mui.com/material-ui/api/icon-button/) component. * * This prop is an alias for `slotProps.actions.previousButton` and will be overriden by it if both are used. * @deprecated Use `slotProps.actions.previousButton` instead. @@ -325,7 +325,7 @@ TablePagination.propTypes /* remove-proptypes */ = { * Accepts a function which returns a string value that provides a user-friendly name for the current page. * This is important for screen reader users. * - * For localization purposes, you can use the provided [translations](/material-ui/guides/localization/). + * For localization purposes, you can use the provided [translations](https://mui.com/material-ui/guides/localization/). * @param {string} type The link or button type to format ('first' | 'last' | 'next' | 'previous'). * @returns {string} * @default function defaultGetAriaLabel(type) { @@ -337,7 +337,7 @@ TablePagination.propTypes /* remove-proptypes */ = { * Customize the displayed rows label. Invoked with a `{ from, to, count, page }` * object. * - * For localization purposes, you can use the provided [translations](/material-ui/guides/localization/). + * For localization purposes, you can use the provided [translations](https://mui.com/material-ui/guides/localization/). * @default function defaultLabelDisplayedRows({ from, to, count }) { * return `${from}–${to} of ${count !== -1 ? count : `more than ${to}`}`; * } @@ -346,12 +346,12 @@ TablePagination.propTypes /* remove-proptypes */ = { /** * Customize the rows per page label. * - * For localization purposes, you can use the provided [translations](/material-ui/guides/localization/). + * For localization purposes, you can use the provided [translations](https://mui.com/material-ui/guides/localization/). * @default 'Rows per page:' */ labelRowsPerPage: PropTypes.node, /** - * Props applied to the next arrow [`IconButton`](/material-ui/api/icon-button/) element. + * Props applied to the next arrow [`IconButton`](https://mui.com/material-ui/api/icon-button/) element. * * This prop is an alias for `slotProps.actions.nextButton` and will be overriden by it if both are used. * @deprecated Use `slotProps.actions.nextButton` instead. @@ -411,7 +411,7 @@ TablePagination.propTypes /* remove-proptypes */ = { ]).isRequired, ), /** - * Props applied to the rows per page [`Select`](/material-ui/api/select/) element. + * Props applied to the rows per page [`Select`](https://mui.com/material-ui/api/select/) element. * * This prop is an alias for `slotProps.select` and will be overriden by it if both are used. * @deprecated Use `slotProps.select` instead. diff --git a/packages/mui-material/src/TablePagination/TablePaginationActions.d.ts b/packages/mui-material/src/TablePagination/TablePaginationActions.d.ts index d396d4625c58fb..faa6ca8b2c0945 100644 --- a/packages/mui-material/src/TablePagination/TablePaginationActions.d.ts +++ b/packages/mui-material/src/TablePagination/TablePaginationActions.d.ts @@ -22,7 +22,7 @@ export interface TablePaginationActionsProps extends React.HTMLAttributes<HTMLDi * Accepts a function which returns a string value that provides a user-friendly name for the current page. * This is important for screen reader users. * - * For localization purposes, you can use the provided [translations](/material-ui/guides/localization/). + * For localization purposes, you can use the provided [translations](https://mui.com/material-ui/guides/localization/). * @param {string} type The link or button type to format ('first' | 'last' | 'next' | 'previous'). * @returns {string} */ diff --git a/packages/mui-material/src/TablePagination/index.js b/packages/mui-material/src/TablePagination/index.js index 12c25d2f980416..a331f1abcf6e48 100644 --- a/packages/mui-material/src/TablePagination/index.js +++ b/packages/mui-material/src/TablePagination/index.js @@ -1,4 +1,3 @@ -'use client'; export { default } from './TablePagination'; export { default as tablePaginationClasses } from './tablePaginationClasses'; diff --git a/packages/mui-material/src/TableRow/TableRow.d.ts b/packages/mui-material/src/TableRow/TableRow.d.ts index b0597f7c3a9aa8..0a5d572f79dc9e 100644 --- a/packages/mui-material/src/TableRow/TableRow.d.ts +++ b/packages/mui-material/src/TableRow/TableRow.d.ts @@ -42,11 +42,11 @@ export interface TableRowTypeMap< * * Demos: * - * - [Table](https://next.mui.com/material-ui/react-table/) + * - [Table](https://mui.com/material-ui/react-table/) * * API: * - * - [TableRow API](https://next.mui.com/material-ui/api/table-row/) + * - [TableRow API](https://mui.com/material-ui/api/table-row/) */ declare const TableRow: OverridableComponent<TableRowTypeMap>; diff --git a/packages/mui-material/src/TableRow/index.js b/packages/mui-material/src/TableRow/index.js index b85aba3523f66b..78fa3b42e84a99 100644 --- a/packages/mui-material/src/TableRow/index.js +++ b/packages/mui-material/src/TableRow/index.js @@ -1,4 +1,3 @@ -'use client'; export { default } from './TableRow'; export { default as tableRowClasses } from './tableRowClasses'; diff --git a/packages/mui-material/src/TableSortLabel/TableSortLabel.d.ts b/packages/mui-material/src/TableSortLabel/TableSortLabel.d.ts index fb392171a48d65..6c62dcdd5ddf6e 100644 --- a/packages/mui-material/src/TableSortLabel/TableSortLabel.d.ts +++ b/packages/mui-material/src/TableSortLabel/TableSortLabel.d.ts @@ -55,12 +55,12 @@ export type TableSortLabelTypeMap< * * Demos: * - * - [Table](https://next.mui.com/material-ui/react-table/) + * - [Table](https://mui.com/material-ui/react-table/) * * API: * - * - [TableSortLabel API](https://next.mui.com/material-ui/api/table-sort-label/) - * - inherits [ButtonBase API](https://next.mui.com/material-ui/api/button-base/) + * - [TableSortLabel API](https://mui.com/material-ui/api/table-sort-label/) + * - inherits [ButtonBase API](https://mui.com/material-ui/api/button-base/) */ declare const TableSortLabel: ExtendButtonBase<TableSortLabelTypeMap>; diff --git a/packages/mui-material/src/TableSortLabel/index.js b/packages/mui-material/src/TableSortLabel/index.js index aac808daf1abb7..b32dbea51fca5c 100644 --- a/packages/mui-material/src/TableSortLabel/index.js +++ b/packages/mui-material/src/TableSortLabel/index.js @@ -1,4 +1,3 @@ -'use client'; export { default } from './TableSortLabel'; export { default as tableSortLabelClasses } from './tableSortLabelClasses'; diff --git a/packages/mui-material/src/Tabs/Tabs.d.ts b/packages/mui-material/src/Tabs/Tabs.d.ts index e27af76d493d6e..c4d49ffe796fd0 100644 --- a/packages/mui-material/src/Tabs/Tabs.d.ts +++ b/packages/mui-material/src/Tabs/Tabs.d.ts @@ -136,7 +136,7 @@ export interface TabsOwnProps { sx?: SxProps<Theme>; }; /** - * Props applied to the [`TabScrollButton`](/material-ui/api/tab-scroll-button/) element. + * Props applied to the [`TabScrollButton`](https://mui.com/material-ui/api/tab-scroll-button/) element. * @default {} */ TabScrollButtonProps?: Partial<TabScrollButtonProps>; @@ -185,11 +185,11 @@ export interface TabsTypeMap< * * Demos: * - * - [Tabs](https://next.mui.com/material-ui/react-tabs/) + * - [Tabs](https://mui.com/material-ui/react-tabs/) * * API: * - * - [Tabs API](https://next.mui.com/material-ui/api/tabs/) + * - [Tabs API](https://mui.com/material-ui/api/tabs/) */ declare const Tabs: OverridableComponent<TabsTypeMap>; diff --git a/packages/mui-material/src/Tabs/Tabs.js b/packages/mui-material/src/Tabs/Tabs.js index a982190157573c..77b43c2c722b97 100644 --- a/packages/mui-material/src/Tabs/Tabs.js +++ b/packages/mui-material/src/Tabs/Tabs.js @@ -985,7 +985,7 @@ Tabs.propTypes /* remove-proptypes */ = { */ TabIndicatorProps: PropTypes.object, /** - * Props applied to the [`TabScrollButton`](/material-ui/api/tab-scroll-button/) element. + * Props applied to the [`TabScrollButton`](https://mui.com/material-ui/api/tab-scroll-button/) element. * @default {} */ TabScrollButtonProps: PropTypes.object, diff --git a/packages/mui-material/src/Tabs/index.js b/packages/mui-material/src/Tabs/index.js index e026a0ff9036ed..c0e4122744acdb 100644 --- a/packages/mui-material/src/Tabs/index.js +++ b/packages/mui-material/src/Tabs/index.js @@ -1,4 +1,3 @@ -'use client'; export { default } from './Tabs'; export { default as tabsClasses } from './tabsClasses'; diff --git a/packages/mui-material/src/TextField/TextField.d.ts b/packages/mui-material/src/TextField/TextField.d.ts index e2f3f36aabea90..8afd09bcf4b2e5 100644 --- a/packages/mui-material/src/TextField/TextField.d.ts +++ b/packages/mui-material/src/TextField/TextField.d.ts @@ -22,27 +22,27 @@ export interface TextFieldSlots { * The component that renders the input. * @default OutlinedInput */ - input?: React.ElementType; + input: React.ElementType; /** * The component that renders the input's label. * @default InputLabel */ - inputLabel?: React.ElementType; + inputLabel: React.ElementType; /** * The html input element. * @default 'input' */ - htmlInput?: React.ElementType; + htmlInput: React.ElementType; /** * The component that renders the helper text. * @default FormHelperText */ - formHelperText?: React.ElementType; + formHelperText: React.ElementType; /** * The component that renders the select. * @default Select */ - select?: React.ElementType; + select: React.ElementType; } export type TextFieldSlotsAndSlotProps<InputPropsType> = CreateSlotsAndSlotProps< @@ -106,8 +106,8 @@ export interface BaseTextFieldProps */ error?: boolean; /** - * Props applied to the [`FormHelperText`](/material-ui/api/form-helper-text/) element. - * @deprecated Use `slotProps.formHelperText` instead. This prop will be removed in v7. See [Migrating from deprecated APIs](/material-ui/migration/migrating-from-deprecated-apis/) for more details. + * Props applied to the [`FormHelperText`](https://mui.com/material-ui/api/form-helper-text/) element. + * @deprecated Use `slotProps.formHelperText` instead. This prop will be removed in v7. See [Migrating from deprecated APIs](https://mui.com/material-ui/migration/migrating-from-deprecated-apis/) for more details. */ FormHelperTextProps?: Partial<FormHelperTextProps>; /** @@ -125,14 +125,14 @@ export interface BaseTextFieldProps */ id?: string; /** - * Props applied to the [`InputLabel`](/material-ui/api/input-label/) element. + * Props applied to the [`InputLabel`](https://mui.com/material-ui/api/input-label/) element. * Pointer events like `onClick` are enabled if and only if `shrink` is `true`. - * @deprecated Use `slotProps.inputLabel` instead. This prop will be removed in v7. See [Migrating from deprecated APIs](/material-ui/migration/migrating-from-deprecated-apis/) for more details. + * @deprecated Use `slotProps.inputLabel` instead. This prop will be removed in v7. See [Migrating from deprecated APIs](https://mui.com/material-ui/migration/migrating-from-deprecated-apis/) for more details. */ InputLabelProps?: Partial<InputLabelProps>; /** * [Attributes](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input#Attributes) applied to the `input` element. - * @deprecated Use `slotProps.htmlInput` instead. This prop will be removed in v7. See [Migrating from deprecated APIs](/material-ui/migration/migrating-from-deprecated-apis/) for more details. + * @deprecated Use `slotProps.htmlInput` instead. This prop will be removed in v7. See [Migrating from deprecated APIs](https://mui.com/material-ui/migration/migrating-from-deprecated-apis/) for more details. */ inputProps?: InputBaseProps['inputProps']; /** @@ -176,14 +176,14 @@ export interface BaseTextFieldProps */ minRows?: string | number; /** - * Render a [`Select`](/material-ui/api/select/) element while passing the Input element to `Select` as `input` parameter. + * Render a [`Select`](https://mui.com/material-ui/api/select/) element while passing the Input element to `Select` as `input` parameter. * If this option is set you must pass the options of the select as children. * @default false */ select?: boolean; /** - * Props applied to the [`Select`](/material-ui/api/select/) element. - * @deprecated Use `slotProps.select` instead. This prop will be removed in v7. See [Migrating from deprecated APIs](/material-ui/migration/migrating-from-deprecated-apis/) for more details. + * Props applied to the [`Select`](https://mui.com/material-ui/api/select/) element. + * @deprecated Use `slotProps.select` instead. This prop will be removed in v7. See [Migrating from deprecated APIs](https://mui.com/material-ui/migration/migrating-from-deprecated-apis/) for more details. */ SelectProps?: Partial<SelectProps>; /** @@ -221,10 +221,10 @@ export interface StandardTextFieldProps variant?: 'standard'; /** * Props applied to the Input element. - * It will be a [`FilledInput`](/material-ui/api/filled-input/), - * [`OutlinedInput`](/material-ui/api/outlined-input/) or [`Input`](/material-ui/api/input/) + * It will be a [`FilledInput`](https://mui.com/material-ui/api/filled-input/), + * [`OutlinedInput`](https://mui.com/material-ui/api/outlined-input/) or [`Input`](https://mui.com/material-ui/api/input/) * component depending on the `variant` prop value. - * @deprecated Use `slotProps.input` instead. This prop will be removed in v7. See [Migrating from deprecated APIs](/material-ui/migration/migrating-from-deprecated-apis/) for more details. + * @deprecated Use `slotProps.input` instead. This prop will be removed in v7. See [Migrating from deprecated APIs](https://mui.com/material-ui/migration/migrating-from-deprecated-apis/) for more details. */ InputProps?: Partial<StandardInputProps>; } @@ -246,10 +246,10 @@ export interface FilledTextFieldProps variant: 'filled'; /** * Props applied to the Input element. - * It will be a [`FilledInput`](/material-ui/api/filled-input/), - * [`OutlinedInput`](/material-ui/api/outlined-input/) or [`Input`](/material-ui/api/input/) + * It will be a [`FilledInput`](https://mui.com/material-ui/api/filled-input/), + * [`OutlinedInput`](https://mui.com/material-ui/api/outlined-input/) or [`Input`](https://mui.com/material-ui/api/input/) * component depending on the `variant` prop value. - * @deprecated Use `slotProps.input` instead. This prop will be removed in v7. See [Migrating from deprecated APIs](/material-ui/migration/migrating-from-deprecated-apis/) for more details. + * @deprecated Use `slotProps.input` instead. This prop will be removed in v7. See [Migrating from deprecated APIs](https://mui.com/material-ui/migration/migrating-from-deprecated-apis/) for more details. */ InputProps?: Partial<FilledInputProps>; } @@ -271,10 +271,10 @@ export interface OutlinedTextFieldProps variant: 'outlined'; /** * Props applied to the Input element. - * It will be a [`FilledInput`](/material-ui/api/filled-input/), - * [`OutlinedInput`](/material-ui/api/outlined-input/) or [`Input`](/material-ui/api/input/) + * It will be a [`FilledInput`](https://mui.com/material-ui/api/filled-input/), + * [`OutlinedInput`](https://mui.com/material-ui/api/outlined-input/) or [`Input`](https://mui.com/material-ui/api/input/) * component depending on the `variant` prop value. - * @deprecated Use `slotProps.input` instead. This prop will be removed in v7. See [Migrating from deprecated APIs](/material-ui/migration/migrating-from-deprecated-apis/) for more details. + * @deprecated Use `slotProps.input` instead. This prop will be removed in v7. See [Migrating from deprecated APIs](https://mui.com/material-ui/migration/migrating-from-deprecated-apis/) for more details. */ InputProps?: Partial<OutlinedInputProps>; } @@ -299,12 +299,12 @@ export type TextFieldOwnerState = BaseTextFieldProps; * It's important to understand that the text field is a simple abstraction * on top of the following components: * - * * [FormControl](https://next.mui.com/material-ui/api/form-control/) - * * [InputLabel](https://next.mui.com/material-ui/api/input-label/) - * * [FilledInput](https://next.mui.com/material-ui/api/filled-input/) - * * [OutlinedInput](https://next.mui.com/material-ui/api/outlined-input/) - * * [Input](https://next.mui.com/material-ui/api/input/) - * * [FormHelperText](https://next.mui.com/material-ui/api/form-helper-text/) + * * [FormControl](https://mui.com/material-ui/api/form-control/) + * * [InputLabel](https://mui.com/material-ui/api/input-label/) + * * [FilledInput](https://mui.com/material-ui/api/filled-input/) + * * [OutlinedInput](https://mui.com/material-ui/api/outlined-input/) + * * [Input](https://mui.com/material-ui/api/input/) + * * [FormHelperText](https://mui.com/material-ui/api/form-helper-text/) * * If you wish to alter the props applied to the `input` element, you can do so as follows: * @@ -319,18 +319,18 @@ export type TextFieldOwnerState = BaseTextFieldProps; * For advanced cases, please look at the source of TextField by clicking on the * "Edit this page" button above. Consider either: * - * * using the upper case props for passing values directly to the components - * * using the underlying components directly as shown in the demos + * * using the upper case props for passing values directly to the components + * * using the underlying components directly as shown in the demos * * Demos: * - * - [Autocomplete](https://next.mui.com/material-ui/react-autocomplete/) - * - [Text Field](https://next.mui.com/material-ui/react-text-field/) + * - [Autocomplete](https://mui.com/material-ui/react-autocomplete/) + * - [Text Field](https://mui.com/material-ui/react-text-field/) * * API: * - * - [TextField API](https://next.mui.com/material-ui/api/text-field/) - * - inherits [FormControl API](https://next.mui.com/material-ui/api/form-control/) + * - [TextField API](https://mui.com/material-ui/api/text-field/) + * - inherits [FormControl API](https://mui.com/material-ui/api/form-control/) */ export default function TextField<Variant extends TextFieldVariants>( props: { diff --git a/packages/mui-material/src/TextField/TextField.js b/packages/mui-material/src/TextField/TextField.js index 4efdcc9124f01a..4417ee05f0910a 100644 --- a/packages/mui-material/src/TextField/TextField.js +++ b/packages/mui-material/src/TextField/TextField.js @@ -323,8 +323,8 @@ TextField.propTypes /* remove-proptypes */ = { */ error: PropTypes.bool, /** - * Props applied to the [`FormHelperText`](/material-ui/api/form-helper-text/) element. - * @deprecated Use `slotProps.formHelperText` instead. This prop will be removed in v7. See [Migrating from deprecated APIs](/material-ui/migration/migrating-from-deprecated-apis/) for more details. + * Props applied to the [`FormHelperText`](https://mui.com/material-ui/api/form-helper-text/) element. + * @deprecated Use `slotProps.formHelperText` instead. This prop will be removed in v7. See [Migrating from deprecated APIs](https://mui.com/material-ui/migration/migrating-from-deprecated-apis/) for more details. */ FormHelperTextProps: PropTypes.object, /** @@ -342,22 +342,22 @@ TextField.propTypes /* remove-proptypes */ = { */ id: PropTypes.string, /** - * Props applied to the [`InputLabel`](/material-ui/api/input-label/) element. + * Props applied to the [`InputLabel`](https://mui.com/material-ui/api/input-label/) element. * Pointer events like `onClick` are enabled if and only if `shrink` is `true`. - * @deprecated Use `slotProps.inputLabel` instead. This prop will be removed in v7. See [Migrating from deprecated APIs](/material-ui/migration/migrating-from-deprecated-apis/) for more details. + * @deprecated Use `slotProps.inputLabel` instead. This prop will be removed in v7. See [Migrating from deprecated APIs](https://mui.com/material-ui/migration/migrating-from-deprecated-apis/) for more details. */ InputLabelProps: PropTypes.object, /** * [Attributes](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input#Attributes) applied to the `input` element. - * @deprecated Use `slotProps.htmlInput` instead. This prop will be removed in v7. See [Migrating from deprecated APIs](/material-ui/migration/migrating-from-deprecated-apis/) for more details. + * @deprecated Use `slotProps.htmlInput` instead. This prop will be removed in v7. See [Migrating from deprecated APIs](https://mui.com/material-ui/migration/migrating-from-deprecated-apis/) for more details. */ inputProps: PropTypes.object, /** * Props applied to the Input element. - * It will be a [`FilledInput`](/material-ui/api/filled-input/), - * [`OutlinedInput`](/material-ui/api/outlined-input/) or [`Input`](/material-ui/api/input/) + * It will be a [`FilledInput`](https://mui.com/material-ui/api/filled-input/), + * [`OutlinedInput`](https://mui.com/material-ui/api/outlined-input/) or [`Input`](https://mui.com/material-ui/api/input/) * component depending on the `variant` prop value. - * @deprecated Use `slotProps.input` instead. This prop will be removed in v7. See [Migrating from deprecated APIs](/material-ui/migration/migrating-from-deprecated-apis/) for more details. + * @deprecated Use `slotProps.input` instead. This prop will be removed in v7. See [Migrating from deprecated APIs](https://mui.com/material-ui/migration/migrating-from-deprecated-apis/) for more details. */ InputProps: PropTypes.object, /** @@ -419,14 +419,14 @@ TextField.propTypes /* remove-proptypes */ = { */ rows: PropTypes.oneOfType([PropTypes.number, PropTypes.string]), /** - * Render a [`Select`](/material-ui/api/select/) element while passing the Input element to `Select` as `input` parameter. + * Render a [`Select`](https://mui.com/material-ui/api/select/) element while passing the Input element to `Select` as `input` parameter. * If this option is set you must pass the options of the select as children. * @default false */ select: PropTypes.bool, /** - * Props applied to the [`Select`](/material-ui/api/select/) element. - * @deprecated Use `slotProps.select` instead. This prop will be removed in v7. See [Migrating from deprecated APIs](/material-ui/migration/migrating-from-deprecated-apis/) for more details. + * Props applied to the [`Select`](https://mui.com/material-ui/api/select/) element. + * @deprecated Use `slotProps.select` instead. This prop will be removed in v7. See [Migrating from deprecated APIs](https://mui.com/material-ui/migration/migrating-from-deprecated-apis/) for more details. */ SelectProps: PropTypes.object, /** diff --git a/packages/mui-material/src/TextField/index.js b/packages/mui-material/src/TextField/index.js index 916789e3d47bdc..aa2c5bc42a3d17 100644 --- a/packages/mui-material/src/TextField/index.js +++ b/packages/mui-material/src/TextField/index.js @@ -1,4 +1,3 @@ -'use client'; export { default } from './TextField'; export { default as textFieldClasses } from './textFieldClasses'; diff --git a/packages/mui-material/src/TextareaAutosize/TextareaAutosize.tsx b/packages/mui-material/src/TextareaAutosize/TextareaAutosize.tsx index c284416fd79f87..37529fa37873c5 100644 --- a/packages/mui-material/src/TextareaAutosize/TextareaAutosize.tsx +++ b/packages/mui-material/src/TextareaAutosize/TextareaAutosize.tsx @@ -49,11 +49,11 @@ function isEmpty(obj: TextareaStyles) { * * Demos: * - * - [Textarea Autosize](https://next.mui.com/material-ui/react-textarea-autosize/) + * - [Textarea Autosize](https://mui.com/material-ui/react-textarea-autosize/) * * API: * - * - [TextareaAutosize API](https://next.mui.com/material-ui/api/textarea-autosize/) + * - [TextareaAutosize API](https://mui.com/material-ui/api/textarea-autosize/) */ const TextareaAutosize = React.forwardRef(function TextareaAutosize( props: TextareaAutosizeProps, diff --git a/packages/mui-material/src/ToggleButton/ToggleButton.d.ts b/packages/mui-material/src/ToggleButton/ToggleButton.d.ts index 78d8af06f0df83..2bea78bf1ab56f 100644 --- a/packages/mui-material/src/ToggleButton/ToggleButton.d.ts +++ b/packages/mui-material/src/ToggleButton/ToggleButton.d.ts @@ -91,12 +91,12 @@ export type ToggleButtonTypeMap< * * Demos: * - * - [Toggle Button](https://next.mui.com/material-ui/react-toggle-button/) + * - [Toggle Button](https://mui.com/material-ui/react-toggle-button/) * * API: * - * - [ToggleButton API](https://next.mui.com/material-ui/api/toggle-button/) - * - inherits [ButtonBase API](https://next.mui.com/material-ui/api/button-base/) + * - [ToggleButton API](https://mui.com/material-ui/api/toggle-button/) + * - inherits [ButtonBase API](https://mui.com/material-ui/api/button-base/) */ declare const ToggleButton: ExtendButtonBase<ToggleButtonTypeMap>; diff --git a/packages/mui-material/src/ToggleButton/index.js b/packages/mui-material/src/ToggleButton/index.js index 131f48248c31db..41bb0536de4556 100644 --- a/packages/mui-material/src/ToggleButton/index.js +++ b/packages/mui-material/src/ToggleButton/index.js @@ -1,4 +1,3 @@ -'use client'; export { default } from './ToggleButton'; export { default as toggleButtonClasses } from './toggleButtonClasses'; diff --git a/packages/mui-material/src/ToggleButtonGroup/ToggleButtonGroup.d.ts b/packages/mui-material/src/ToggleButtonGroup/ToggleButtonGroup.d.ts index e9c06d942a6482..dee8f289b5553b 100644 --- a/packages/mui-material/src/ToggleButtonGroup/ToggleButtonGroup.d.ts +++ b/packages/mui-material/src/ToggleButtonGroup/ToggleButtonGroup.d.ts @@ -80,10 +80,10 @@ export interface ToggleButtonGroupProps * * Demos: * - * - [Toggle Button](https://next.mui.com/material-ui/react-toggle-button/) + * - [Toggle Button](https://mui.com/material-ui/react-toggle-button/) * * API: * - * - [ToggleButtonGroup API](https://next.mui.com/material-ui/api/toggle-button-group/) + * - [ToggleButtonGroup API](https://mui.com/material-ui/api/toggle-button-group/) */ export default function ToggleButtonGroup(props: ToggleButtonGroupProps): React.JSX.Element; diff --git a/packages/mui-material/src/ToggleButtonGroup/index.js b/packages/mui-material/src/ToggleButtonGroup/index.js index 08c143fe70e852..6d4a88fa3e99be 100644 --- a/packages/mui-material/src/ToggleButtonGroup/index.js +++ b/packages/mui-material/src/ToggleButtonGroup/index.js @@ -1,4 +1,3 @@ -'use client'; export { default } from './ToggleButtonGroup'; export { default as toggleButtonGroupClasses } from './toggleButtonGroupClasses'; diff --git a/packages/mui-material/src/Toolbar/Toolbar.d.ts b/packages/mui-material/src/Toolbar/Toolbar.d.ts index ad14fa4bb22800..d5755f4d309999 100644 --- a/packages/mui-material/src/Toolbar/Toolbar.d.ts +++ b/packages/mui-material/src/Toolbar/Toolbar.d.ts @@ -44,11 +44,11 @@ export interface ToolbarTypeMap< * * Demos: * - * - [App Bar](https://next.mui.com/material-ui/react-app-bar/) + * - [App Bar](https://mui.com/material-ui/react-app-bar/) * * API: * - * - [Toolbar API](https://next.mui.com/material-ui/api/toolbar/) + * - [Toolbar API](https://mui.com/material-ui/api/toolbar/) */ declare const Toolbar: OverridableComponent<ToolbarTypeMap>; diff --git a/packages/mui-material/src/Tooltip/Tooltip.d.ts b/packages/mui-material/src/Tooltip/Tooltip.d.ts index 8c55ac9ed79fa2..fab6531ac41d63 100644 --- a/packages/mui-material/src/Tooltip/Tooltip.d.ts +++ b/packages/mui-material/src/Tooltip/Tooltip.d.ts @@ -16,7 +16,7 @@ export interface TooltipProps extends StandardProps<React.HTMLAttributes<HTMLDiv /** * Tooltip reference element. */ - children: React.ReactElement<any, any>; + children: React.ReactElement<unknown, any>; /** * Override or extend the styles applied to the component. */ @@ -24,7 +24,7 @@ export interface TooltipProps extends StandardProps<React.HTMLAttributes<HTMLDiv /** * The components used for each slot inside. * - * @deprecated use the `slots` prop instead. This prop will be removed in v7. [How to migrate](/material-ui/migration/migrating-from-deprecated-apis/). + * @deprecated use the `slots` prop instead. This prop will be removed in v7. [How to migrate](https://mui.com/material-ui/migration/migrating-from-deprecated-apis/). * * @default {} */ @@ -38,7 +38,7 @@ export interface TooltipProps extends StandardProps<React.HTMLAttributes<HTMLDiv * The extra props for the slot components. * You can override the existing props or add new ones. * - * @deprecated use the `slotProps` prop instead. This prop will be removed in v7. [How to migrate](/material-ui/migration/migrating-from-deprecated-apis/). + * @deprecated use the `slotProps` prop instead. This prop will be removed in v7. [How to migrate](https://mui.com/material-ui/migration/migrating-from-deprecated-apis/). * * @default {} */ @@ -155,7 +155,7 @@ export interface TooltipProps extends StandardProps<React.HTMLAttributes<HTMLDiv */ PopperComponent?: React.JSXElementConstructor<PopperProps>; /** - * Props applied to the [`Popper`](/material-ui/api/popper/) element. + * Props applied to the [`Popper`](https://mui.com/material-ui/api/popper/) element. * @default {} */ PopperProps?: Partial<PopperProps>; @@ -200,11 +200,11 @@ export interface TooltipProps extends StandardProps<React.HTMLAttributes<HTMLDiv title: React.ReactNode; /** * The component used for the transition. - * [Follow this guide](/material-ui/transitions/#transitioncomponent-prop) to learn more about the requirements for this component. + * [Follow this guide](https://mui.com/material-ui/transitions/#transitioncomponent-prop) to learn more about the requirements for this component. * @default Grow */ TransitionComponent?: React.JSXElementConstructor< - TransitionProps & { children: React.ReactElement<any, any> } + TransitionProps & { children: React.ReactElement<unknown, any> } >; /** * Props applied to the transition element. @@ -217,10 +217,10 @@ export interface TooltipProps extends StandardProps<React.HTMLAttributes<HTMLDiv * * Demos: * - * - [Tooltip](https://next.mui.com/material-ui/react-tooltip/) + * - [Tooltip](https://mui.com/material-ui/react-tooltip/) * * API: * - * - [Tooltip API](https://next.mui.com/material-ui/api/tooltip/) + * - [Tooltip API](https://mui.com/material-ui/api/tooltip/) */ export default function Tooltip(props: TooltipProps): React.JSX.Element; diff --git a/packages/mui-material/src/Tooltip/Tooltip.js b/packages/mui-material/src/Tooltip/Tooltip.js index 905679cc94c138..8ab22adfe30338 100644 --- a/packages/mui-material/src/Tooltip/Tooltip.js +++ b/packages/mui-material/src/Tooltip/Tooltip.js @@ -798,7 +798,7 @@ Tooltip.propTypes /* remove-proptypes */ = { /** * The components used for each slot inside. * - * @deprecated use the `slots` prop instead. This prop will be removed in v7. [How to migrate](/material-ui/migration/migrating-from-deprecated-apis/). + * @deprecated use the `slots` prop instead. This prop will be removed in v7. [How to migrate](https://mui.com/material-ui/migration/migrating-from-deprecated-apis/). * * @default {} */ @@ -812,7 +812,7 @@ Tooltip.propTypes /* remove-proptypes */ = { * The extra props for the slot components. * You can override the existing props or add new ones. * - * @deprecated use the `slotProps` prop instead. This prop will be removed in v7. [How to migrate](/material-ui/migration/migrating-from-deprecated-apis/). + * @deprecated use the `slotProps` prop instead. This prop will be removed in v7. [How to migrate](https://mui.com/material-ui/migration/migrating-from-deprecated-apis/). * * @default {} */ @@ -926,7 +926,7 @@ Tooltip.propTypes /* remove-proptypes */ = { */ PopperComponent: PropTypes.elementType, /** - * Props applied to the [`Popper`](/material-ui/api/popper/) element. + * Props applied to the [`Popper`](https://mui.com/material-ui/api/popper/) element. * @default {} */ PopperProps: PropTypes.object, @@ -971,7 +971,7 @@ Tooltip.propTypes /* remove-proptypes */ = { title: PropTypes.node, /** * The component used for the transition. - * [Follow this guide](/material-ui/transitions/#transitioncomponent-prop) to learn more about the requirements for this component. + * [Follow this guide](https://mui.com/material-ui/transitions/#transitioncomponent-prop) to learn more about the requirements for this component. * @default Grow */ TransitionComponent: PropTypes.elementType, diff --git a/packages/mui-material/src/Tooltip/index.js b/packages/mui-material/src/Tooltip/index.js index 99ce38771452a1..41217639d8cc24 100644 --- a/packages/mui-material/src/Tooltip/index.js +++ b/packages/mui-material/src/Tooltip/index.js @@ -1,4 +1,3 @@ -'use client'; export { default } from './Tooltip'; export { default as tooltipClasses } from './tooltipClasses'; diff --git a/packages/mui-material/src/Typography/Typography.d.ts b/packages/mui-material/src/Typography/Typography.d.ts index f07841314f040f..400abde58395fd 100644 --- a/packages/mui-material/src/Typography/Typography.d.ts +++ b/packages/mui-material/src/Typography/Typography.d.ts @@ -57,7 +57,7 @@ export interface TypographyOwnProps extends Omit<SystemProps<Theme>, 'color'> { /** * If `true`, the element will be a paragraph element. * @default false - * @deprecated Use the `component` prop instead. This prop will be removed in v7. See [Migrating from deprecated APIs](/material-ui/migration/migrating-from-deprecated-apis/) for more details. + * @deprecated Use the `component` prop instead. This prop will be removed in v7. See [Migrating from deprecated APIs](https://mui.com/material-ui/migration/migrating-from-deprecated-apis/) for more details. */ paragraph?: boolean; /** @@ -105,12 +105,12 @@ export interface TypographyTypeMap< * * Demos: * - * - [Breadcrumbs](https://next.mui.com/material-ui/react-breadcrumbs/) - * - [Typography](https://next.mui.com/material-ui/react-typography/) + * - [Breadcrumbs](https://mui.com/material-ui/react-breadcrumbs/) + * - [Typography](https://mui.com/material-ui/react-typography/) * * API: * - * - [Typography API](https://next.mui.com/material-ui/api/typography/) + * - [Typography API](https://mui.com/material-ui/api/typography/) */ declare const Typography: OverridableComponent<TypographyTypeMap>; diff --git a/packages/mui-material/src/Typography/Typography.js b/packages/mui-material/src/Typography/Typography.js index fca09495689487..c52f7307ac5afd 100644 --- a/packages/mui-material/src/Typography/Typography.js +++ b/packages/mui-material/src/Typography/Typography.js @@ -254,7 +254,7 @@ Typography.propTypes /* remove-proptypes */ = { /** * If `true`, the element will be a paragraph element. * @default false - * @deprecated Use the `component` prop instead. This prop will be removed in v7. See [Migrating from deprecated APIs](/material-ui/migration/migrating-from-deprecated-apis/) for more details. + * @deprecated Use the `component` prop instead. This prop will be removed in v7. See [Migrating from deprecated APIs](https://mui.com/material-ui/migration/migrating-from-deprecated-apis/) for more details. */ paragraph: PropTypes.bool, /** diff --git a/packages/mui-material/src/Typography/index.js b/packages/mui-material/src/Typography/index.js index ac1d28ee5ea00d..8c0aa8a325423f 100644 --- a/packages/mui-material/src/Typography/index.js +++ b/packages/mui-material/src/Typography/index.js @@ -1,4 +1,3 @@ -'use client'; export { default } from './Typography'; export { default as typographyClasses } from './typographyClasses'; diff --git a/packages/mui-material/src/Unstable_TrapFocus/FocusTrap.tsx b/packages/mui-material/src/Unstable_TrapFocus/FocusTrap.tsx index 264403eb00eac9..7a404740af6b68 100644 --- a/packages/mui-material/src/Unstable_TrapFocus/FocusTrap.tsx +++ b/packages/mui-material/src/Unstable_TrapFocus/FocusTrap.tsx @@ -270,7 +270,7 @@ function FocusTrap(props: FocusTrapProps): React.JSX.Element { return; } - let tabbable: ReadonlyArray<string> | HTMLElement[] = []; + let tabbable: ReadonlyArray<HTMLElement> = []; if ( doc.activeElement === sentinelStart.current || doc.activeElement === sentinelEnd.current diff --git a/packages/mui-material/src/Unstable_TrapFocus/FocusTrap.types.ts b/packages/mui-material/src/Unstable_TrapFocus/FocusTrap.types.ts index be9cf5ee1e93c3..462100ec696479 100644 --- a/packages/mui-material/src/Unstable_TrapFocus/FocusTrap.types.ts +++ b/packages/mui-material/src/Unstable_TrapFocus/FocusTrap.types.ts @@ -10,7 +10,7 @@ export interface FocusTrapProps { * For instance, you can provide the "tabbable" npm dependency. * @param {HTMLElement} root */ - getTabbable?: (root: HTMLElement) => ReadonlyArray<string>; + getTabbable?: (root: HTMLElement) => ReadonlyArray<HTMLElement>; /** * This prop extends the `open` prop. * It allows to toggle the open state without having to wait for a rerender when changing the `open` prop. diff --git a/packages/mui-material/src/Zoom/Zoom.d.ts b/packages/mui-material/src/Zoom/Zoom.d.ts index 82a1714a29f446..ad7b99b6a3b19d 100644 --- a/packages/mui-material/src/Zoom/Zoom.d.ts +++ b/packages/mui-material/src/Zoom/Zoom.d.ts @@ -11,7 +11,7 @@ export interface ZoomProps extends TransitionProps { /** * A single child content element. */ - children: React.ReactElement<any, any>; + children: React.ReactElement<unknown, any>; /** * The transition timing function. * You may specify a single easing or a object containing enter and exit values. @@ -35,16 +35,16 @@ export interface ZoomProps extends TransitionProps { /** * The Zoom transition can be used for the floating variant of the - * [Button](https://next.mui.com/material-ui/react-button/#floating-action-buttons) component. + * [Button](https://mui.com/material-ui/react-button/#floating-action-buttons) component. * It uses [react-transition-group](https://github.com/reactjs/react-transition-group) internally. * * Demos: * - * - [Transitions](https://next.mui.com/material-ui/transitions/) + * - [Transitions](https://mui.com/material-ui/transitions/) * * API: * - * - [Zoom API](https://next.mui.com/material-ui/api/zoom/) + * - [Zoom API](https://mui.com/material-ui/api/zoom/) * - inherits [Transition API](https://reactcommunity.org/react-transition-group/transition/#Transition-props) */ export default function Zoom(props: ZoomProps): React.JSX.Element; diff --git a/packages/mui-material/src/Zoom/index.js b/packages/mui-material/src/Zoom/index.js index 39af66639e7e0e..5a76ecbfe91cdd 100644 --- a/packages/mui-material/src/Zoom/index.js +++ b/packages/mui-material/src/Zoom/index.js @@ -1,2 +1 @@ -'use client'; export { default } from './Zoom'; diff --git a/packages/mui-material/src/styles/ThemeProviderWithVars.tsx b/packages/mui-material/src/styles/ThemeProviderWithVars.tsx index 1a29b504f0afbf..cf5c64f2334983 100644 --- a/packages/mui-material/src/styles/ThemeProviderWithVars.tsx +++ b/packages/mui-material/src/styles/ThemeProviderWithVars.tsx @@ -41,17 +41,19 @@ let warnedOnce = false; // TODO: remove in v7 // eslint-disable-next-line @typescript-eslint/naming-convention function Experimental_CssVarsProvider(props: any) { - if (!warnedOnce) { - console.warn( - [ - 'MUI: The Experimental_CssVarsProvider component has been ported into ThemeProvider.', - '', - "You should use `import { ThemeProvider } from '@mui/material/styles'` instead.", - 'For more details, check out https://mui.com/material-ui/customization/css-theme-variables/usage/', - ].join('\n'), - ); + if (process.env.NODE_ENV !== 'production') { + if (!warnedOnce) { + console.warn( + [ + 'MUI: The Experimental_CssVarsProvider component has been ported into ThemeProvider.', + '', + "You should use `import { ThemeProvider } from '@mui/material/styles'` instead.", + 'For more details, check out https://mui.com/material-ui/customization/css-theme-variables/usage/', + ].join('\n'), + ); - warnedOnce = true; + warnedOnce = true; + } } return <InternalCssVarsProvider {...props} />; diff --git a/packages/mui-material/src/styles/createTheme.test.js b/packages/mui-material/src/styles/createTheme.test.js index 926a80321b6ef9..f40f342ff2c0fb 100644 --- a/packages/mui-material/src/styles/createTheme.test.js +++ b/packages/mui-material/src/styles/createTheme.test.js @@ -4,7 +4,7 @@ import { createRenderer } from '@mui/internal-test-utils'; import Button from '@mui/material/Button'; import Box from '@mui/material/Box'; import { ThemeProvider, createTheme, styled } from '@mui/material/styles'; -import { deepOrange, green } from '@mui/material/colors'; +import { deepOrange, green, grey } from '@mui/material/colors'; import createPalette from './createPalette'; const lightPalette = createPalette({ mode: 'light' }); @@ -56,7 +56,126 @@ describe('createTheme', () => { expect(theme.palette.secondary.main).to.equal(green.A400); }); + it('should be customizable through `colorSchemes` node', () => { + const theme = createTheme({ + colorSchemes: { + dark: { + palette: { + background: { + default: grey[900], + }, + }, + }, + light: { + palette: { + background: { + default: grey[50], + }, + bg: { + main: grey[800], + dark: grey[700], + }, + }, + }, + }, + }); + expect(theme.colorSchemes.dark.palette.background.default).to.equal(grey[900]); + expect(theme.colorSchemes.light.palette.background.default).to.equal(grey[50]); + expect(theme.colorSchemes.light.palette.bg.main).to.equal(grey[800]); + expect(theme.colorSchemes.light.palette.bg.dark).to.equal(grey[700]); + expect(theme.palette.mode).to.equal('light'); + expect(theme.palette.background.default).to.equal(grey[50]); + }); + + it('should be customizable through `colorSchemes` node with non-existing fields', () => { + const theme = createTheme({ + colorSchemes: { + dark: { + opacity: { + disabled: 0.38, + }, + palette: { + gradient: 'linear-gradient(90deg, #000000 0%, #ffffff 100%)', + }, + }, + light: { + opacity: { + disabled: 0.5, + }, + palette: { + gradient: 'linear-gradient(90deg, #ffffff 0%, #000000 100%)', + }, + }, + }, + }); + expect(theme.colorSchemes.dark.opacity.disabled).to.equal(0.38); + expect(theme.colorSchemes.light.opacity.disabled).to.equal(0.5); + expect(theme.colorSchemes.dark.palette.gradient).to.equal( + 'linear-gradient(90deg, #000000 0%, #ffffff 100%)', + ); + expect(theme.colorSchemes.light.palette.gradient).to.equal( + 'linear-gradient(90deg, #ffffff 0%, #000000 100%)', + ); + }); + + it('should work with `palette` and `colorSchemes`', () => { + const theme = createTheme({ + palette: { + primary: { + main: '#27272a', + }, + background: { + default: '#f5f5f5', + }, + }, + colorSchemes: { + dark: true, + }, + }); + expect(theme.palette.primary.main).to.equal('#27272a'); + expect(theme.palette.background.default).to.equal('#f5f5f5'); + expect(theme.colorSchemes.light.palette.primary.main).to.equal('#27272a'); + expect(theme.colorSchemes.light.palette.background.default).to.equal('#f5f5f5'); + expect(theme.colorSchemes.dark.palette.primary.main).to.equal(darkPalette.primary.main); + expect(theme.colorSchemes.dark.palette.background.default).to.equal( + darkPalette.background.default, + ); + }); + + it('should work with `palette` and a custom `colorSchemes.dark`', () => { + const theme = createTheme({ + palette: { + background: { + default: '#f5f5f5', + }, + }, + colorSchemes: { + dark: { + palette: { + background: { + default: 'red', + }, + }, + }, + }, + }); + expect(theme.palette.background.default).to.equal('#f5f5f5'); + expect(theme.colorSchemes.light.palette.background.default).to.equal('#f5f5f5'); + expect(theme.colorSchemes.dark.palette.background.default).to.equal('red'); + }); + describe('CSS variables', () => { + it('should have default light with media selector if no `palette` and colorSchemes.dark is provided ', () => { + const theme = createTheme({ + cssVariables: true, + colorSchemes: { dark: true }, + }); + expect(theme.defaultColorScheme).to.equal('light'); + expect(theme.colorSchemeSelector).to.equal('media'); + expect(theme.colorSchemes.light).not.to.equal(undefined); + expect(theme.colorSchemes.dark).not.to.equal(undefined); + }); + it('should have a light as a default colorScheme if only `palette` is provided', () => { const theme = createTheme({ cssVariables: true, @@ -384,6 +503,12 @@ describe('createTheme', () => { }); }); + it('should return the styles directly when using applyStyles if the selector is `&`', function test() { + const theme = createTheme({ cssVariables: true, palette: { mode: 'dark' } }); + + expect(theme.applyStyles('dark', { color: 'red' })).to.deep.equal({ color: 'red' }); + }); + it('Throw an informative error when the key `vars` is passed as part of `options` passed', () => { try { createTheme({ diff --git a/packages/mui-material/src/styles/createTheme.ts b/packages/mui-material/src/styles/createTheme.ts index 5bf0b5ed8072ba..36e92f1082edaf 100644 --- a/packages/mui-material/src/styles/createTheme.ts +++ b/packages/mui-material/src/styles/createTheme.ts @@ -22,7 +22,7 @@ function attachColorScheme( theme.colorSchemes[scheme] = { ...(colorScheme !== true && colorScheme), palette: createPalette({ - ...(colorScheme === true ? {} : colorScheme), + ...(colorScheme === true ? {} : colorScheme.palette), mode: scheme, } as any), // cast type to skip module augmentation test }; @@ -72,30 +72,56 @@ export default function createTheme( }; if (cssVariables === false) { - const theme = createThemeNoVars(options as ThemeOptions, ...args) as unknown as Theme & { + if (!('colorSchemes' in options)) { + // Behaves exactly as v5 + return createThemeNoVars(options as ThemeOptions, ...args); + } + + let paletteOptions = palette; + if (!('palette' in options)) { + if (colorSchemesInput[defaultColorSchemeInput]) { + if (colorSchemesInput[defaultColorSchemeInput] !== true) { + paletteOptions = colorSchemesInput[defaultColorSchemeInput].palette; + } else if (defaultColorSchemeInput === 'dark') { + // @ts-ignore to prevent the module augmentation test from failing + paletteOptions = { mode: 'dark' }; + } + } + } + + const theme = createThemeNoVars( + { ...options, palette: paletteOptions } as ThemeOptions, + ...args, + ) as unknown as Theme & { defaultColorScheme?: 'light' | 'dark'; colorSchemes?: Partial<Record<string, any>>; }; - if (!('colorSchemes' in options)) { - return theme; - } - theme.defaultColorScheme = defaultColorSchemeInput; theme.colorSchemes = colorSchemesInput as Record<string, ColorSystem>; if (theme.palette.mode === 'light') { - theme.colorSchemes.light = { palette: theme.palette } as ColorSystem; + theme.colorSchemes.light = { + ...(colorSchemesInput.light !== true && colorSchemesInput.light), + palette: theme.palette, + } as ColorSystem; attachColorScheme(theme, 'dark', colorSchemesInput.dark); } if (theme.palette.mode === 'dark') { - theme.colorSchemes.dark = { palette: theme.palette } as ColorSystem; + theme.colorSchemes.dark = { + ...(colorSchemesInput.dark !== true && colorSchemesInput.dark), + palette: theme.palette, + } as ColorSystem; attachColorScheme(theme, 'light', colorSchemesInput.light); } return theme; } + if (!palette && !('light' in colorSchemesInput) && defaultColorSchemeInput === 'light') { + colorSchemesInput.light = true; + } + return createThemeWithVars( { ...rest, diff --git a/packages/mui-material/src/styles/createThemeWithVars.js b/packages/mui-material/src/styles/createThemeWithVars.js index b8adb2deefb75e..026f1b9e6ede5d 100644 --- a/packages/mui-material/src/styles/createThemeWithVars.js +++ b/packages/mui-material/src/styles/createThemeWithVars.js @@ -64,13 +64,11 @@ function getSpacingVal(spacingInput) { if (typeof spacingInput === 'number') { return `${spacingInput}px`; } - if (typeof spacingInput === 'string') { - return spacingInput; - } - if (typeof spacingInput === 'function') { - return getSpacingVal(spacingInput(1)); - } - if (Array.isArray(spacingInput)) { + if ( + typeof spacingInput === 'string' || + typeof spacingInput === 'function' || + Array.isArray(spacingInput) + ) { return spacingInput; } return '8px'; diff --git a/packages/mui-material/src/styles/extendTheme.test.js b/packages/mui-material/src/styles/extendTheme.test.js index 00bd6111455fce..94ca22576a7cb0 100644 --- a/packages/mui-material/src/styles/extendTheme.test.js +++ b/packages/mui-material/src/styles/extendTheme.test.js @@ -495,8 +495,16 @@ describe('extendTheme', () => { it('can be customized as a function', () => { const theme = extendTheme({ spacing: (factor) => `${0.25 * factor}rem` }); - expect(theme.vars.spacing).to.deep.equal('var(--mui-spacing, 0.25rem)'); - expect(theme.spacing(2)).to.equal('calc(2 * var(--mui-spacing, 0.25rem))'); + expect('spacing' in theme.vars).to.equal(false); + expect(theme.spacing(2)).to.equal('0.5rem'); + }); + + it('a custom function should not be altered', () => { + const theme = extendTheme({ + spacing: (val) => (val === 'xs' ? '100px' : val), + }); + expect('spacing' in theme.vars).to.equal(false); + expect(theme.spacing('xs')).to.equal('100px'); }); }); diff --git a/packages/mui-material/src/styles/index.js b/packages/mui-material/src/styles/index.js index b38149b9eb1274..e856d1d5d2fa43 100644 --- a/packages/mui-material/src/styles/index.js +++ b/packages/mui-material/src/styles/index.js @@ -1,4 +1,3 @@ -'use client'; import MuiError from '@mui/internal-babel-macros/MuiError.macro'; export { default as THEME_ID } from './identifier'; diff --git a/packages/mui-material/src/useAutocomplete/index.js b/packages/mui-material/src/useAutocomplete/index.js index fa72a071a5a55b..a6c05b480618e9 100644 --- a/packages/mui-material/src/useAutocomplete/index.js +++ b/packages/mui-material/src/useAutocomplete/index.js @@ -1,2 +1 @@ -'use client'; export { default, createFilterOptions } from './useAutocomplete'; diff --git a/packages/mui-material/src/useAutocomplete/useAutocomplete.d.ts b/packages/mui-material/src/useAutocomplete/useAutocomplete.d.ts index 8cb5fdd9e06cbf..b74e6646430106 100644 --- a/packages/mui-material/src/useAutocomplete/useAutocomplete.d.ts +++ b/packages/mui-material/src/useAutocomplete/useAutocomplete.d.ts @@ -347,11 +347,11 @@ export type AutocompleteGetTagProps = ({ index }: { index: number }) => { * * Demos: * - * - [Autocomplete](https://next.mui.com/base-ui/react-autocomplete/#hook) + * - [Autocomplete](https://mui.com/base-ui/react-autocomplete/#hook) * * API: * - * - [useAutocomplete API](https://next.mui.com/base-ui/react-autocomplete/hooks-api/#use-autocomplete) + * - [useAutocomplete API](https://mui.com/base-ui/react-autocomplete/hooks-api/#use-autocomplete) */ export function useAutocomplete< Value, diff --git a/packages/mui-material/src/usePagination/index.js b/packages/mui-material/src/usePagination/index.js index 9e1df34da8bec1..0cfab44452eba0 100644 --- a/packages/mui-material/src/usePagination/index.js +++ b/packages/mui-material/src/usePagination/index.js @@ -1,2 +1 @@ -'use client'; export { default } from './usePagination'; diff --git a/packages/mui-material/src/useScrollTrigger/index.js b/packages/mui-material/src/useScrollTrigger/index.js index 44f958ca6e2a14..e996f70c773ee6 100644 --- a/packages/mui-material/src/useScrollTrigger/index.js +++ b/packages/mui-material/src/useScrollTrigger/index.js @@ -1,2 +1 @@ -'use client'; export { default } from './useScrollTrigger'; diff --git a/packages/mui-material/src/utils/index.d.ts b/packages/mui-material/src/utils/index.d.ts index 7ccd7522ee6ff5..ccba6bbec929e1 100644 --- a/packages/mui-material/src/utils/index.d.ts +++ b/packages/mui-material/src/utils/index.d.ts @@ -5,6 +5,7 @@ export { default as createSvgIcon } from './createSvgIcon'; export { default as debounce } from './debounce'; export { default as deprecatedPropType } from './deprecatedPropType'; export { default as isMuiElement } from './isMuiElement'; +export { default as unstable_memoTheme } from './memoTheme'; export { default as ownerDocument } from './ownerDocument'; export { default as ownerWindow } from './ownerWindow'; export { default as requirePropFactory } from './requirePropFactory'; diff --git a/packages/mui-material/src/utils/index.js b/packages/mui-material/src/utils/index.js index 90b88322517ab1..a43e01cd154380 100644 --- a/packages/mui-material/src/utils/index.js +++ b/packages/mui-material/src/utils/index.js @@ -7,6 +7,7 @@ export { default as createSvgIcon } from './createSvgIcon'; export { default as debounce } from './debounce'; export { default as deprecatedPropType } from './deprecatedPropType'; export { default as isMuiElement } from './isMuiElement'; +export { default as unstable_memoTheme } from './memoTheme'; export { default as ownerDocument } from './ownerDocument'; export { default as ownerWindow } from './ownerWindow'; export { default as requirePropFactory } from './requirePropFactory'; diff --git a/packages/mui-material/src/utils/memoTheme.ts b/packages/mui-material/src/utils/memoTheme.ts index 2b899413ca6c36..e9fd1dd31f49bf 100644 --- a/packages/mui-material/src/utils/memoTheme.ts +++ b/packages/mui-material/src/utils/memoTheme.ts @@ -1,4 +1,4 @@ -import { CSSInterpolation } from '@mui/styled-engine'; +import { CSSInterpolation } from '@mui/system'; import { Theme } from '../styles/createTheme'; type ThemeStyleFunction = (props: { theme: Theme }) => CSSInterpolation; diff --git a/packages/mui-material/src/utils/types.ts b/packages/mui-material/src/utils/types.ts index 01d4a1be52612c..4cba945a59d621 100644 --- a/packages/mui-material/src/utils/types.ts +++ b/packages/mui-material/src/utils/types.ts @@ -1,5 +1,6 @@ import { SxProps } from '@mui/system'; import { SlotComponentProps } from '@mui/utils'; +import { Theme } from '../styles'; export type { EventHandlers, @@ -10,7 +11,7 @@ export type { export type SlotCommonProps = { component?: React.ElementType; - sx?: SxProps; + sx?: SxProps<Theme>; }; export type SlotProps< @@ -29,7 +30,7 @@ export type CreateSlotsAndSlotProps<Slots, K extends Record<keyof Slots, any>> = * The components used for each slot inside. * @default {} */ - slots?: Slots; + slots?: Partial<Slots>; /** * The props used for each slot inside. * @default {} diff --git a/packages/mui-material/test/integration/MenuList.test.js b/packages/mui-material/test/integration/MenuList.test.js index 66b5ab27c4862a..8e362f22c3168e 100644 --- a/packages/mui-material/test/integration/MenuList.test.js +++ b/packages/mui-material/test/integration/MenuList.test.js @@ -180,6 +180,49 @@ describe('<MenuList> integration', () => { expect(menuitems[1]).to.have.property('tabIndex', -1); expect(menuitems[2]).to.have.property('tabIndex', -1); }); + + describe('when a modifier key is pressed', () => { + it('should not move the focus', () => { + const { getAllByRole } = render( + <MenuList autoFocusItem> + <MenuItem selected>Menu Item 1</MenuItem> + <MenuItem>Menu Item 2</MenuItem> + <MenuItem>Menu Item 3</MenuItem> + </MenuList>, + ); + + const menuitems = getAllByRole('menuitem'); + fireEvent.keyDown(menuitems[0], { key: 'ArrowDown', ctrlKey: true }); + expect(menuitems[0]).toHaveFocus(); + expect(menuitems[1]).not.toHaveFocus(); + + fireEvent.keyDown(menuitems[0], { key: 'ArrowDown', altKey: true }); + expect(menuitems[0]).toHaveFocus(); + expect(menuitems[1]).not.toHaveFocus(); + + fireEvent.keyDown(menuitems[0], { key: 'ArrowDown', metaKey: true }); + expect(menuitems[0]).toHaveFocus(); + expect(menuitems[1]).not.toHaveFocus(); + }); + + it('should call the onKeyDown and not prevent default on the event', () => { + const onKeyDown = spy(); + const { getAllByRole } = render( + <MenuList autoFocusItem onKeyDown={onKeyDown}> + <MenuItem selected>Menu Item 1</MenuItem> + <MenuItem>Menu Item 2</MenuItem> + <MenuItem>Menu Item 3</MenuItem> + </MenuList>, + ); + + const menuitems = getAllByRole('menuitem'); + fireEvent.keyDown(menuitems[0], { key: 'ArrowDown', ctrlKey: true }); + + expect(onKeyDown.callCount).to.equal(1); + expect(onKeyDown.firstCall.args[0]).to.have.property('ctrlKey', true); + expect(onKeyDown.firstCall.args[0]).to.have.property('defaultPrevented', false); + }); + }); }); describe('keyboard controls and tabIndex manipulation - preselected item', () => { diff --git a/packages/mui-material/test/typescript/moduleAugmentation/autocompleteCustomSlotProps.spec.tsx b/packages/mui-material/test/typescript/moduleAugmentation/autocompleteCustomSlotProps.spec.tsx new file mode 100644 index 00000000000000..60f35df2c18866 --- /dev/null +++ b/packages/mui-material/test/typescript/moduleAugmentation/autocompleteCustomSlotProps.spec.tsx @@ -0,0 +1,85 @@ +import * as React from 'react'; +import Autocomplete from '@mui/material/Autocomplete'; +import Button from '@mui/material/Button'; +import Paper, { PaperProps } from '@mui/material/Paper'; +import Popper, { PopperProps } from '@mui/material/Popper'; +import TextField from '@mui/material/TextField'; + +declare module '@mui/material/Autocomplete' { + interface AutocompletePaperSlotPropsOverrides { + value: Option[]; + } + interface AutocompletePopperSlotPropsOverrides { + value: Option[]; + } +} + +function CustomPaper({ children, value, ...paperProps }: PaperProps & { value: Option[] }) { + return ( + <Paper {...paperProps} onMouseDown={(event) => event.preventDefault()}> + {children} + <Button disabled={value.length === 0}>Next</Button> + </Paper> + ); +} + +function CustomPopper({ children, value, ...popperProps }: PopperProps & { value: Option[] }) { + return ( + <Popper {...popperProps}> + {children as React.ReactNode} + <Button disabled={value.length === 0}>Next</Button> + </Popper> + ); +} + +interface Option { + title: string; + year: number; +} + +function App() { + const [value, setValue] = React.useState<Option[]>([]); + + return ( + <React.Fragment> + {/* Testing Paper slot */} + <Autocomplete + multiple + isOptionEqualToValue={(option, valueParam) => option.title === valueParam.title} + renderInput={(params) => <TextField {...params} placeholder="Select" />} + onChange={(event, newValue) => { + setValue(newValue); + }} + getOptionLabel={(option) => `(${option?.year}) ${option?.title}`} + options={[...topFilms]} + value={value} + slots={{ paper: CustomPaper }} + slotProps={{ paper: { value } }} + /> + {/* Testing Popper slot */} + <Autocomplete + multiple + isOptionEqualToValue={(option, valueParam) => option.title === valueParam.title} + renderInput={(params) => <TextField {...params} placeholder="Select" />} + onChange={(event, newValue) => { + setValue(newValue); + }} + getOptionLabel={(option) => `(${option?.year}) ${option?.title}`} + options={[...topFilms]} + value={value} + slots={{ popper: CustomPopper }} + slotProps={{ popper: { value } }} + /> + </React.Fragment> + ); +} + +const topFilms = [ + { title: 'The Shawshank Redemption', year: 1994 }, + { title: 'The Godfather', year: 1972 }, + { title: 'The Godfather: Part II', year: 1974 }, + { title: 'The Dark Knight', year: 2008 }, + { title: '12 Angry Men', year: 1957 }, + { title: "Schindler's List", year: 1993 }, + { title: 'Pulp Fiction', year: 1994 }, +]; diff --git a/packages/mui-material/test/typescript/moduleAugmentation/autocompleteCustomSlotProps.tsconfig.json b/packages/mui-material/test/typescript/moduleAugmentation/autocompleteCustomSlotProps.tsconfig.json new file mode 100644 index 00000000000000..0ea52e3b96bbce --- /dev/null +++ b/packages/mui-material/test/typescript/moduleAugmentation/autocompleteCustomSlotProps.tsconfig.json @@ -0,0 +1,4 @@ +{ + "extends": "../../../../../tsconfig.json", + "files": ["autocompleteCustomSlotProps.spec.tsx"] +} diff --git a/packages/mui-private-theming/package.json b/packages/mui-private-theming/package.json index 83b5ef68e55035..baf4b6f7948b97 100644 --- a/packages/mui-private-theming/package.json +++ b/packages/mui-private-theming/package.json @@ -1,6 +1,6 @@ { "name": "@mui/private-theming", - "version": "6.0.0-beta.6", + "version": "6.0.2", "private": false, "author": "MUI Team", "description": "Private - The React theme context to be shared between `@mui/styles` and `@mui/material`.", @@ -38,14 +38,14 @@ }, "dependencies": { "@babel/runtime": "^7.25.0", - "@mui/utils": "workspace:*", + "@mui/utils": "workspace:^", "prop-types": "^15.8.1" }, "devDependencies": { "@mui/internal-test-utils": "workspace:^", "@mui/types": "workspace:^", - "@types/chai": "^4.3.17", - "@types/react": "^18.3.3", + "@types/chai": "^4.3.19", + "@types/react": "^18.3.4", "chai": "^4.5.0", "react": "^18.3.1" }, diff --git a/packages/mui-styled-engine-sc/README.md b/packages/mui-styled-engine-sc/README.md index 3ad474dbc2e264..871bccbd80d746 100644 --- a/packages/mui-styled-engine-sc/README.md +++ b/packages/mui-styled-engine-sc/README.md @@ -7,4 +7,4 @@ It's designed for developers who would like to use `styled-components` as the ma <!-- #default-branch-switch --> -Visit [https://next.mui.com/material-ui/integrations/styled-components/](https://next.mui.com/material-ui/integrations/styled-components/) to view the full documentation. +Visit [https://mui.com/material-ui/integrations/styled-components/](https://mui.com/material-ui/integrations/styled-components/) to view the full documentation. diff --git a/packages/mui-styled-engine-sc/package.json b/packages/mui-styled-engine-sc/package.json index 3524d95aa0c966..0a1ba0f0b5bd0b 100644 --- a/packages/mui-styled-engine-sc/package.json +++ b/packages/mui-styled-engine-sc/package.json @@ -1,6 +1,6 @@ { "name": "@mui/styled-engine-sc", - "version": "6.0.0-beta.6", + "version": "6.0.2", "private": false, "author": "MUI Team", "description": "styled() API wrapper package for styled-components.", @@ -45,9 +45,9 @@ "devDependencies": { "@mui/internal-test-utils": "workspace:^", "@mui/styled-engine-sc": "workspace:*", - "@types/chai": "^4.3.17", + "@types/chai": "^4.3.19", "@types/hoist-non-react-statics": "^3.3.5", - "@types/react": "^18.3.3", + "@types/react": "^18.3.4", "chai": "^4.5.0", "react": "^18.3.1", "styled-components": "^6.1.12" diff --git a/packages/mui-styled-engine/README.md b/packages/mui-styled-engine/README.md index 05a621f948f910..ab3d9fd2a968da 100644 --- a/packages/mui-styled-engine/README.md +++ b/packages/mui-styled-engine/README.md @@ -8,4 +8,4 @@ It is used internally in the `@mui/system` package. <!-- #default-branch-switch --> -Visit [https://next.mui.com/material-ui/integrations/styled-components/](https://next.mui.com/material-ui/integrations/styled-components/) to view the full documentation. +Visit [https://mui.com/material-ui/integrations/styled-components/](https://mui.com/material-ui/integrations/styled-components/) to view the full documentation. diff --git a/packages/mui-styled-engine/package.json b/packages/mui-styled-engine/package.json index d4f5850756d797..514a360f88dd97 100644 --- a/packages/mui-styled-engine/package.json +++ b/packages/mui-styled-engine/package.json @@ -1,6 +1,6 @@ { "name": "@mui/styled-engine", - "version": "6.0.0-beta.6", + "version": "6.0.2", "private": false, "author": "MUI Team", "description": "styled() API wrapper package for emotion.", @@ -43,12 +43,12 @@ "prop-types": "^15.8.1" }, "devDependencies": { - "@emotion/react": "^11.13.0", + "@emotion/react": "^11.13.3", "@emotion/styled": "^11.13.0", "@mui/internal-test-utils": "workspace:^", "@mui/styled-engine": "workspace:*", - "@types/chai": "^4.3.17", - "@types/react": "^18.3.3", + "@types/chai": "^4.3.19", + "@types/react": "^18.3.4", "chai": "^4.5.0", "react": "^18.3.1" }, diff --git a/packages/mui-styled-engine/src/GlobalStyles/index.js b/packages/mui-styled-engine/src/GlobalStyles/index.js index 275d047f4e9eb3..48e20189092434 100644 --- a/packages/mui-styled-engine/src/GlobalStyles/index.js +++ b/packages/mui-styled-engine/src/GlobalStyles/index.js @@ -1,2 +1 @@ -'use client'; export { default } from './GlobalStyles'; diff --git a/packages/mui-styled-engine/src/StyledEngineProvider/index.js b/packages/mui-styled-engine/src/StyledEngineProvider/index.js index 6d2191b13941a1..30cd6986a545fa 100644 --- a/packages/mui-styled-engine/src/StyledEngineProvider/index.js +++ b/packages/mui-styled-engine/src/StyledEngineProvider/index.js @@ -1,2 +1 @@ -'use client'; export { default } from './StyledEngineProvider'; diff --git a/packages/mui-styled-engine/src/index.js b/packages/mui-styled-engine/src/index.js index c3cdee4cac8b34..2eb9a86b75674d 100644 --- a/packages/mui-styled-engine/src/index.js +++ b/packages/mui-styled-engine/src/index.js @@ -1,4 +1,3 @@ -'use client'; /* eslint-disable no-underscore-dangle */ import emStyled from '@emotion/styled'; diff --git a/packages/mui-styles/README.md b/packages/mui-styles/README.md index 944061cd8a83da..93587d0f4a587a 100644 --- a/packages/mui-styles/README.md +++ b/packages/mui-styles/README.md @@ -6,10 +6,8 @@ You can leverage our styling solution, even if you are not using our components. Install the package in your project directory with: -<!-- #default-branch-switch --> - ```bash -npm install @mui/styles@next +npm install @mui/styles ``` ## Documentation diff --git a/packages/mui-styles/package.json b/packages/mui-styles/package.json index 2699ab3a80c597..528151d537a367 100644 --- a/packages/mui-styles/package.json +++ b/packages/mui-styles/package.json @@ -1,6 +1,6 @@ { "name": "@mui/styles", - "version": "6.0.0-beta.6", + "version": "6.0.2", "private": false, "author": "MUI Team", "description": "MUI Styles - The legacy JSS-based styling solution of Material UI.", @@ -39,9 +39,9 @@ "dependencies": { "@babel/runtime": "^7.25.0", "@emotion/hash": "^0.9.2", - "@mui/private-theming": "workspace:*", + "@mui/private-theming": "workspace:^", "@mui/types": "workspace:^", - "@mui/utils": "workspace:*", + "@mui/utils": "workspace:^", "clsx": "^2.1.1", "csstype": "^3.1.3", "hoist-non-react-statics": "^3.3.2", @@ -58,14 +58,14 @@ "devDependencies": { "@mui/internal-test-utils": "workspace:^", "@mui/material": "workspace:^", - "@types/chai": "^4.3.17", - "@types/react": "^18.3.3", + "@types/chai": "^4.3.19", + "@types/react": "^18.3.4", "@types/react-dom": "^18.3.0", "@types/sinon": "^17.0.3", "chai": "^4.5.0", "react": "^18.3.1", "react-dom": "^18.3.1", - "sinon": "^16.1.3" + "sinon": "^18.0.0" }, "peerDependencies": { "@types/react": "^17.0.0 || ^18.0.0 || ^19.0.0", diff --git a/packages/mui-system/README.md b/packages/mui-system/README.md index 66f439ddcb3298..a3f99ef5eff975 100644 --- a/packages/mui-system/README.md +++ b/packages/mui-system/README.md @@ -9,11 +9,11 @@ Install the package in your project directory with: <!-- #default-branch-switch --> ```bash -npm install @mui/system@next @emotion/react @emotion/styled +npm install @mui/system @emotion/react @emotion/styled ``` ## Documentation <!-- #default-branch-switch --> -Visit [https://next.mui.com/system/getting-started/](https://next.mui.com/system/getting-started/) to view the full documentation. +Visit [https://mui.com/system/getting-started/](https://mui.com/system/getting-started/) to view the full documentation. diff --git a/packages/mui-system/package.json b/packages/mui-system/package.json index 682991eeff854c..a6b82cc07d9a12 100644 --- a/packages/mui-system/package.json +++ b/packages/mui-system/package.json @@ -1,6 +1,6 @@ { "name": "@mui/system", - "version": "6.0.0-beta.6", + "version": "6.0.2", "private": false, "author": "MUI Team", "description": "MUI System is a set of CSS utilities to help you build custom designs more efficiently. It makes it possible to rapidly lay out custom designs.", @@ -40,29 +40,29 @@ }, "dependencies": { "@babel/runtime": "^7.25.0", - "@mui/private-theming": "workspace:*", - "@mui/styled-engine": "workspace:*", + "@mui/private-theming": "workspace:^", + "@mui/styled-engine": "workspace:^", "@mui/types": "workspace:^", - "@mui/utils": "workspace:*", + "@mui/utils": "workspace:^", "clsx": "^2.1.1", "csstype": "^3.1.3", "prop-types": "^15.8.1" }, "devDependencies": { - "@emotion/react": "^11.13.0", + "@emotion/react": "^11.13.3", "@emotion/styled": "^11.13.0", "@mui/internal-babel-macros": "workspace:^", "@mui/internal-test-utils": "workspace:^", "@mui/system": "workspace:*", - "@types/chai": "^4.3.17", + "@types/chai": "^4.3.19", "@types/prop-types": "^15.7.12", - "@types/react": "^18.3.3", + "@types/react": "^18.3.4", "@types/sinon": "^17.0.3", "chai": "^4.5.0", "fast-glob": "^3.3.2", "lodash": "^4.17.21", "react": "^18.3.1", - "sinon": "^16.1.3", + "sinon": "^18.0.0", "styled-components": "^6.1.12" }, "peerDependencies": { diff --git a/packages/mui-system/src/Box/index.js b/packages/mui-system/src/Box/index.js index 956a444c75c938..fc66543f28f643 100644 --- a/packages/mui-system/src/Box/index.js +++ b/packages/mui-system/src/Box/index.js @@ -1,4 +1,3 @@ -'use client'; export { default } from './Box'; export { default as boxClasses } from './boxClasses'; diff --git a/packages/mui-system/src/Container/index.js b/packages/mui-system/src/Container/index.js index 0a922c1c8dee82..be7c5c912f5943 100644 --- a/packages/mui-system/src/Container/index.js +++ b/packages/mui-system/src/Container/index.js @@ -1,4 +1,3 @@ -'use client'; export { default } from './Container'; export { default as containerClasses } from './containerClasses'; diff --git a/packages/mui-system/src/GlobalStyles/index.ts b/packages/mui-system/src/GlobalStyles/index.ts index d54f8337f6e723..a815f5c4a572b2 100644 --- a/packages/mui-system/src/GlobalStyles/index.ts +++ b/packages/mui-system/src/GlobalStyles/index.ts @@ -1,3 +1,2 @@ -'use client'; export { default } from './GlobalStyles'; export * from './GlobalStyles'; diff --git a/packages/mui-system/src/Grid/index.ts b/packages/mui-system/src/Grid/index.ts index 9b2e8e91b570af..96a55fa381ed2f 100644 --- a/packages/mui-system/src/Grid/index.ts +++ b/packages/mui-system/src/Grid/index.ts @@ -1,4 +1,3 @@ -'use client'; export { default } from './Grid'; export { default as createGrid } from './createGrid'; export * from './GridProps'; diff --git a/packages/mui-system/src/InitColorSchemeScript/InitColorSchemeScript.tsx b/packages/mui-system/src/InitColorSchemeScript/InitColorSchemeScript.tsx index 7320bb7c10af42..3c7d424de6ed5e 100644 --- a/packages/mui-system/src/InitColorSchemeScript/InitColorSchemeScript.tsx +++ b/packages/mui-system/src/InitColorSchemeScript/InitColorSchemeScript.tsx @@ -92,13 +92,13 @@ export default function InitColorSchemeScript(options?: InitColorSchemeScriptPro dangerouslySetInnerHTML={{ __html: `(function() { try { - var mode = localStorage.getItem('${modeStorageKey}') || 'system'; - var colorScheme = ''; - var dark = localStorage.getItem('${colorSchemeStorageKey}-dark') || '${defaultDarkColorScheme}'; - var light = localStorage.getItem('${colorSchemeStorageKey}-light') || '${defaultLightColorScheme}'; + let colorScheme = ''; + const mode = localStorage.getItem('${modeStorageKey}') || 'system'; + const dark = localStorage.getItem('${colorSchemeStorageKey}-dark') || '${defaultDarkColorScheme}'; + const light = localStorage.getItem('${colorSchemeStorageKey}-light') || '${defaultLightColorScheme}'; if (mode === 'system') { // handle system mode - var mql = window.matchMedia('(prefers-color-scheme: dark)'); + const mql = window.matchMedia('(prefers-color-scheme: dark)'); if (mql.matches) { colorScheme = dark } else { diff --git a/packages/mui-system/src/Stack/index.ts b/packages/mui-system/src/Stack/index.ts index 78c63b4339f375..3e02c9de01261b 100644 --- a/packages/mui-system/src/Stack/index.ts +++ b/packages/mui-system/src/Stack/index.ts @@ -1,4 +1,3 @@ -'use client'; export { default } from './Stack'; export { default as createStack } from './createStack'; export * from './StackProps'; diff --git a/packages/mui-system/src/ThemeProvider/index.js b/packages/mui-system/src/ThemeProvider/index.js index 05eaa8875f6edb..ae3e7b91b60666 100644 --- a/packages/mui-system/src/ThemeProvider/index.js +++ b/packages/mui-system/src/ThemeProvider/index.js @@ -1,2 +1 @@ -'use client'; export { default } from './ThemeProvider'; diff --git a/packages/mui-system/src/borders/index.ts b/packages/mui-system/src/borders/index.ts index b80d6280b55565..027f427edbf17b 100644 --- a/packages/mui-system/src/borders/index.ts +++ b/packages/mui-system/src/borders/index.ts @@ -1,3 +1,2 @@ -'use client'; export { default } from './borders'; export * from './borders'; diff --git a/packages/mui-system/src/breakpoints/index.ts b/packages/mui-system/src/breakpoints/index.ts index d4131e5d7098e1..09e54480881496 100644 --- a/packages/mui-system/src/breakpoints/index.ts +++ b/packages/mui-system/src/breakpoints/index.ts @@ -1,3 +1,2 @@ -'use client'; export { default } from './breakpoints'; export * from './breakpoints'; diff --git a/packages/mui-system/src/colorManipulator/index.ts b/packages/mui-system/src/colorManipulator/index.ts index 5149f8e5219a36..c9569a046d2fc4 100644 --- a/packages/mui-system/src/colorManipulator/index.ts +++ b/packages/mui-system/src/colorManipulator/index.ts @@ -1,2 +1 @@ -'use client'; export * from './colorManipulator'; diff --git a/packages/mui-system/src/compose/index.ts b/packages/mui-system/src/compose/index.ts index 5903eeea33a13e..3d5783ca532442 100644 --- a/packages/mui-system/src/compose/index.ts +++ b/packages/mui-system/src/compose/index.ts @@ -1,2 +1 @@ -'use client'; export { default } from './compose'; diff --git a/packages/mui-system/src/createBox/index.ts b/packages/mui-system/src/createBox/index.ts index 93262690e07c97..0ec8ce35a676ae 100644 --- a/packages/mui-system/src/createBox/index.ts +++ b/packages/mui-system/src/createBox/index.ts @@ -1,2 +1 @@ -'use client'; export { default } from './createBox'; diff --git a/packages/mui-system/src/createBreakpoints/createBreakpoints.d.ts b/packages/mui-system/src/createBreakpoints/createBreakpoints.d.ts index 9486f3b68aa224..4404933d0e9b5e 100644 --- a/packages/mui-system/src/createBreakpoints/createBreakpoints.d.ts +++ b/packages/mui-system/src/createBreakpoints/createBreakpoints.d.ts @@ -31,13 +31,13 @@ export interface Breakpoints { /** * @param key - A breakpoint key (`xs`, `sm`, etc.) or a screen width number in px. * @returns A media query string ready to be used with most styling solutions, which matches screen widths greater than the screen size given by the breakpoint key (inclusive). - * @see [API documentation](https://next.mui.com/material-ui/customization/breakpoints/#theme-breakpoints-up-key-media-query) + * @see [API documentation](https://mui.com/material-ui/customization/breakpoints/#theme-breakpoints-up-key-media-query) */ up: (key: Breakpoint | number) => string; /** * @param key - A breakpoint key (`xs`, `sm`, etc.) or a screen width number in px. * @returns A media query string ready to be used with most styling solutions, which matches screen widths less than the screen size given by the breakpoint key (exclusive). - * @see [API documentation](https://next.mui.com/material-ui/customization/breakpoints/#theme-breakpoints-down-key-media-query) + * @see [API documentation](https://mui.com/material-ui/customization/breakpoints/#theme-breakpoints-down-key-media-query) */ down: (key: Breakpoint | number) => string; /** @@ -45,14 +45,14 @@ export interface Breakpoints { * @param end - A breakpoint key (`xs`, `sm`, etc.) or a screen width number in px. * @returns A media query string ready to be used with most styling solutions, which matches screen widths greater than * the screen size given by the breakpoint key in the first argument (inclusive) and less than the screen size given by the breakpoint key in the second argument (exclusive). - * @see [API documentation](https://next.mui.com/material-ui/customization/breakpoints/#theme-breakpoints-between-start-end-media-query) + * @see [API documentation](https://mui.com/material-ui/customization/breakpoints/#theme-breakpoints-between-start-end-media-query) */ between: (start: Breakpoint | number, end: Breakpoint | number) => string; /** * @param key - A breakpoint key (`xs`, `sm`, etc.) or a screen width number in px. * @returns A media query string ready to be used with most styling solutions, which matches screen widths starting from * the screen size given by the breakpoint key (inclusive) and stopping at the screen size given by the next breakpoint key (exclusive). - * @see [API documentation](https://next.mui.com/material-ui/customization/breakpoints/#theme-breakpoints-only-key-media-query) + * @see [API documentation](https://mui.com/material-ui/customization/breakpoints/#theme-breakpoints-only-key-media-query) */ only: (key: Breakpoint) => string; /** diff --git a/packages/mui-system/src/createStyled/index.ts b/packages/mui-system/src/createStyled/index.ts index d827d43448643e..052fe3acb9aa33 100644 --- a/packages/mui-system/src/createStyled/index.ts +++ b/packages/mui-system/src/createStyled/index.ts @@ -1,3 +1,2 @@ -'use client'; export { default } from './createStyled'; export * from './createStyled'; diff --git a/packages/mui-system/src/createTheme/applyStyles.test.ts b/packages/mui-system/src/createTheme/applyStyles.test.ts index d954f48d5d6977..91d00f5eed78f7 100644 --- a/packages/mui-system/src/createTheme/applyStyles.test.ts +++ b/packages/mui-system/src/createTheme/applyStyles.test.ts @@ -69,4 +69,16 @@ describe('applyStyles', () => { const styles = { background: '#e5e5e5' }; expect(applyStyles.call(theme, 'dark', styles)).to.deep.equal({}); }); + + it('should return the styles directly if selector is &', () => { + const theme = { + vars: {}, + colorSchemes: { light: true }, + getColorSchemeSelector: () => { + return '&'; + }, + }; + const styles = { background: '#e5e5e5' }; + expect(applyStyles.call(theme, 'light', styles)).to.deep.equal(styles); + }); }); diff --git a/packages/mui-system/src/createTheme/applyStyles.ts b/packages/mui-system/src/createTheme/applyStyles.ts index 963384d8e11ad6..0ad33c5e90e311 100644 --- a/packages/mui-system/src/createTheme/applyStyles.ts +++ b/packages/mui-system/src/createTheme/applyStyles.ts @@ -76,6 +76,9 @@ export default function applyStyles<K extends string>(key: K, styles: CSSObject) } // If CssVarsProvider is used as a provider, returns '*:where({selector}) &' let selector = theme.getColorSchemeSelector(key); + if (selector === '&') { + return styles; + } if (selector.includes('data-') || selector.includes('.')) { // '*' is required as a workaround for Emotion issue (https://github.com/emotion-js/emotion/issues/2836) selector = `*:where(${selector.replace(/\s*&$/, '')}) &`; diff --git a/packages/mui-system/src/cssGrid/index.ts b/packages/mui-system/src/cssGrid/index.ts index 606a39450c07a6..7f8c35a00e5391 100644 --- a/packages/mui-system/src/cssGrid/index.ts +++ b/packages/mui-system/src/cssGrid/index.ts @@ -1,3 +1,2 @@ -'use client'; export { default } from './cssGrid'; export * from './cssGrid'; diff --git a/packages/mui-system/src/cssVars/index.ts b/packages/mui-system/src/cssVars/index.ts index 8135af71cd38da..e20a5bec491de3 100644 --- a/packages/mui-system/src/cssVars/index.ts +++ b/packages/mui-system/src/cssVars/index.ts @@ -1,4 +1,3 @@ -'use client'; export { default } from './createCssVarsProvider'; export type { CreateCssVarsProviderResult, diff --git a/packages/mui-system/src/display/index.ts b/packages/mui-system/src/display/index.ts index c0dcbfdc15af6c..e1e226bd9d09b2 100644 --- a/packages/mui-system/src/display/index.ts +++ b/packages/mui-system/src/display/index.ts @@ -1,3 +1,2 @@ -'use client'; export { default } from './display'; export * from './display'; diff --git a/packages/mui-system/src/flexbox/index.ts b/packages/mui-system/src/flexbox/index.ts index 5c1c749951e820..f9de3d77b47aa8 100644 --- a/packages/mui-system/src/flexbox/index.ts +++ b/packages/mui-system/src/flexbox/index.ts @@ -1,3 +1,2 @@ -'use client'; export { default } from './flexbox'; export * from './flexbox'; diff --git a/packages/mui-system/src/getThemeValue/index.ts b/packages/mui-system/src/getThemeValue/index.ts index 058c6ae97c7537..a88a6ec97af548 100644 --- a/packages/mui-system/src/getThemeValue/index.ts +++ b/packages/mui-system/src/getThemeValue/index.ts @@ -1,3 +1,2 @@ -'use client'; export { default } from './getThemeValue'; export * from './getThemeValue'; diff --git a/packages/mui-system/src/memoize/index.ts b/packages/mui-system/src/memoize/index.ts index 66774a993cd6b0..fb7e4f9183731a 100644 --- a/packages/mui-system/src/memoize/index.ts +++ b/packages/mui-system/src/memoize/index.ts @@ -1,2 +1 @@ -'use client'; export { default } from './memoize'; diff --git a/packages/mui-system/src/merge/index.ts b/packages/mui-system/src/merge/index.ts index cb9274486a9fa1..97db223bc8188e 100644 --- a/packages/mui-system/src/merge/index.ts +++ b/packages/mui-system/src/merge/index.ts @@ -1,2 +1 @@ -'use client'; export { default } from './merge'; diff --git a/packages/mui-system/src/palette/index.ts b/packages/mui-system/src/palette/index.ts index 28fa2b57c680c3..b1ddfcfb088c68 100644 --- a/packages/mui-system/src/palette/index.ts +++ b/packages/mui-system/src/palette/index.ts @@ -1,3 +1,2 @@ -'use client'; export { default } from './palette'; export * from './palette'; diff --git a/packages/mui-system/src/positions/index.ts b/packages/mui-system/src/positions/index.ts index 31aa77fbee438b..a319f1ab59e1c7 100644 --- a/packages/mui-system/src/positions/index.ts +++ b/packages/mui-system/src/positions/index.ts @@ -1,3 +1,2 @@ -'use client'; export { default } from './positions'; export * from './positions'; diff --git a/packages/mui-system/src/propsToClassKey/index.ts b/packages/mui-system/src/propsToClassKey/index.ts index 95022b3d29683b..89e04af61e6d6a 100644 --- a/packages/mui-system/src/propsToClassKey/index.ts +++ b/packages/mui-system/src/propsToClassKey/index.ts @@ -1,2 +1 @@ -'use client'; export { default } from './propsToClassKey'; diff --git a/packages/mui-system/src/responsivePropType/index.ts b/packages/mui-system/src/responsivePropType/index.ts index ad75ae545bcf45..b51c8a4a03dfe6 100644 --- a/packages/mui-system/src/responsivePropType/index.ts +++ b/packages/mui-system/src/responsivePropType/index.ts @@ -1,2 +1 @@ -'use client'; export { default } from './responsivePropType'; diff --git a/packages/mui-system/src/shadows/index.ts b/packages/mui-system/src/shadows/index.ts index 6dd3312387e486..9eaa3ad25e7782 100644 --- a/packages/mui-system/src/shadows/index.ts +++ b/packages/mui-system/src/shadows/index.ts @@ -1,2 +1 @@ -'use client'; export { default } from './shadows'; diff --git a/packages/mui-system/src/sizing/index.ts b/packages/mui-system/src/sizing/index.ts index 5c30a7222568da..1aa949fb9b6f2b 100644 --- a/packages/mui-system/src/sizing/index.ts +++ b/packages/mui-system/src/sizing/index.ts @@ -1,3 +1,2 @@ -'use client'; export { default } from './sizing'; export * from './sizing'; diff --git a/packages/mui-system/src/spacing/index.ts b/packages/mui-system/src/spacing/index.ts index 6bad9ad89d4dd5..af6e8064da1e40 100644 --- a/packages/mui-system/src/spacing/index.ts +++ b/packages/mui-system/src/spacing/index.ts @@ -1,3 +1,2 @@ -'use client'; export { default } from './spacing'; export * from './spacing'; diff --git a/packages/mui-system/src/style/index.ts b/packages/mui-system/src/style/index.ts index 2e4fa57df00254..d668cfe132f72d 100644 --- a/packages/mui-system/src/style/index.ts +++ b/packages/mui-system/src/style/index.ts @@ -1,3 +1,2 @@ -'use client'; export { default } from './style'; export * from './style'; diff --git a/packages/mui-system/src/styled/index.ts b/packages/mui-system/src/styled/index.ts index fe2f75a1ca7742..62f3c6aec6abe7 100644 --- a/packages/mui-system/src/styled/index.ts +++ b/packages/mui-system/src/styled/index.ts @@ -1,2 +1 @@ -'use client'; export { default } from './styled'; diff --git a/packages/mui-system/src/typography/index.ts b/packages/mui-system/src/typography/index.ts index 2f6cf00668c7c7..dbc116be65439c 100644 --- a/packages/mui-system/src/typography/index.ts +++ b/packages/mui-system/src/typography/index.ts @@ -1,3 +1,2 @@ -'use client'; export { default } from './typography'; export * from './typography'; diff --git a/packages/mui-system/src/useTheme/index.ts b/packages/mui-system/src/useTheme/index.ts index fc788b2994365a..bbe4d936c03acd 100644 --- a/packages/mui-system/src/useTheme/index.ts +++ b/packages/mui-system/src/useTheme/index.ts @@ -1,3 +1,2 @@ -'use client'; export { default } from './useTheme'; export * from './useTheme'; diff --git a/packages/mui-system/src/useThemeProps/index.js b/packages/mui-system/src/useThemeProps/index.js index 101685f2bc816f..cac7b802d5d674 100644 --- a/packages/mui-system/src/useThemeProps/index.js +++ b/packages/mui-system/src/useThemeProps/index.js @@ -1,3 +1,2 @@ -'use client'; export { default } from './useThemeProps'; export { default as getThemeProps } from './getThemeProps'; diff --git a/packages/mui-system/src/useThemeWithoutDefault/index.ts b/packages/mui-system/src/useThemeWithoutDefault/index.ts index 7018fca5e9639a..d2ab73cea4c91b 100644 --- a/packages/mui-system/src/useThemeWithoutDefault/index.ts +++ b/packages/mui-system/src/useThemeWithoutDefault/index.ts @@ -1,2 +1 @@ -'use client'; export { default } from './useThemeWithoutDefault'; diff --git a/packages/mui-types/package.json b/packages/mui-types/package.json index 1a4fa5a7a28474..62ebab324d86e7 100644 --- a/packages/mui-types/package.json +++ b/packages/mui-types/package.json @@ -1,6 +1,6 @@ { "name": "@mui/types", - "version": "7.2.15", + "version": "7.2.16", "private": false, "author": "MUI Team", "description": "Utility types for MUI.", @@ -40,7 +40,7 @@ }, "devDependencies": { "@mui/types": "workspace:*", - "@types/react": "^18.3.3" + "@types/react": "^18.3.4" }, "peerDependencies": { "@types/react": "^17.0.0 || ^18.0.0 || ^19.0.0" diff --git a/packages/mui-utils/package.json b/packages/mui-utils/package.json index 5cb48fdc0fa7fe..c87a35b6e3a649 100644 --- a/packages/mui-utils/package.json +++ b/packages/mui-utils/package.json @@ -1,6 +1,6 @@ { "name": "@mui/utils", - "version": "6.0.0-beta.6", + "version": "6.0.2", "private": false, "author": "MUI Team", "description": "Utility functions for React components.", @@ -49,17 +49,17 @@ "@mui/internal-babel-macros": "workspace:^", "@mui/internal-test-utils": "workspace:^", "@mui/types": "workspace:^", - "@types/chai": "^4.3.17", + "@types/chai": "^4.3.19", "@types/mocha": "^10.0.7", - "@types/node": "^18.19.44", - "@types/react": "^18.3.3", + "@types/node": "^20.16.5", + "@types/react": "^18.3.4", "@types/react-dom": "^18.3.0", "@types/react-is": "^18.3.0", "@types/sinon": "^17.0.3", "chai": "^4.5.0", "react": "^18.3.1", "react-dom": "^18.3.1", - "sinon": "^16.1.3" + "sinon": "^18.0.0" }, "peerDependencies": { "@types/react": "^17.0.0 || ^18.0.0 || ^19.0.0", diff --git a/packages/mui-utils/src/composeClasses/composeClasses.test.ts b/packages/mui-utils/src/composeClasses/composeClasses.test.ts index e6e351073ff3c8..310c217bf8414a 100644 --- a/packages/mui-utils/src/composeClasses/composeClasses.test.ts +++ b/packages/mui-utils/src/composeClasses/composeClasses.test.ts @@ -13,8 +13,8 @@ describe('composeClasses', () => { undefined, ), ).to.deep.equal({ - root: 'MuiTest-root MuiTest-standard ', - slot: 'MuiTest-slot ', + root: 'MuiTest-root MuiTest-standard', + slot: 'MuiTest-slot', }); }); @@ -32,8 +32,8 @@ describe('composeClasses', () => { }, ), ).to.deep.equal({ - root: 'MuiTest-root MuiTest-standard standardOverride ', - slot: 'MuiTest-slot slotOverride ', + root: 'MuiTest-root MuiTest-standard standardOverride', + slot: 'MuiTest-slot slotOverride', }); }); @@ -51,8 +51,8 @@ describe('composeClasses', () => { }, ), ).to.deep.equal({ - root: 'MuiTest-root MuiTest-standard standardOverride ', - slot: 'MuiTest-slot slotOverride ', + root: 'MuiTest-root MuiTest-standard standardOverride', + slot: 'MuiTest-slot slotOverride', }); }); }); diff --git a/packages/mui-utils/src/composeClasses/composeClasses.ts b/packages/mui-utils/src/composeClasses/composeClasses.ts index 2b8e91af5fb540..5b03c682a575f2 100644 --- a/packages/mui-utils/src/composeClasses/composeClasses.ts +++ b/packages/mui-utils/src/composeClasses/composeClasses.ts @@ -13,14 +13,16 @@ export default function composeClasses<ClassKey extends string>( for (const slotName in slots) { const slot = slots[slotName]; let buffer = ''; + let start = true; for (let i = 0; i < slot.length; i += 1) { const value = slot[i]; if (value) { - buffer += getUtilityClass(value) + ' '; + buffer += (start === true ? '' : ' ') + getUtilityClass(value); + start = false; if (classes && classes[value]) { - buffer += classes[value] + ' '; + buffer += ' ' + classes[value]; } } } diff --git a/packages/netlify-plugin-cache-docs/index.js b/packages/netlify-plugin-cache-docs/index.js index 701231ce120958..8d82c10b1bcb95 100644 --- a/packages/netlify-plugin-cache-docs/index.js +++ b/packages/netlify-plugin-cache-docs/index.js @@ -10,41 +10,46 @@ function generateAbsolutePaths(context) { const workspaceRoot = path.dirname(constants.CONFIG_PATH); const docsWorkspacePath = path.join(workspaceRoot, 'docs'); - const nextjsBuildDir = path.join(docsWorkspacePath, '.next'); - const digests = [path.join(workspaceRoot, 'pnpm-lock.yaml')]; + const nextjsCacheDir = path.join(docsWorkspacePath, '.next', 'cache'); - return { digests, nextjsBuildDir }; + return { nextjsCacheDir }; } module.exports = { + // Restore the `.next/cache` folder + // based on: https://github.com/netlify/next-runtime/blob/733a0219e5413aa1eea790af48c745322dbce917/src/index.ts async onPreBuild(context) { const { constants, utils } = context; - const { nextjsBuildDir } = generateAbsolutePaths({ constants }); - const success = await utils.cache.restore(nextjsBuildDir); + const { nextjsCacheDir } = generateAbsolutePaths({ constants }); - console.log("'%s' exists: %s", nextjsBuildDir, String(fse.existsSync(nextjsBuildDir))); + const cacheDirExists = fse.existsSync(nextjsCacheDir); + console.log("'%s' exists: %s", nextjsCacheDir, String(cacheDirExists)); - console.log( - "Restored the cached 'docs/.next' folder at the location '%s': %s", - nextjsBuildDir, - String(success), - ); + const success = await utils.cache.restore(nextjsCacheDir); + + console.log("Restored the cached '%s' folder: %s", nextjsCacheDir, String(success)); + + const restoredCacheDir = fse.existsSync(nextjsCacheDir); + console.log("'%s' exists: %s", nextjsCacheDir, String(restoredCacheDir)); }, - async onPostBuild(context) { + // On build, cache the `.next/cache` folder + // based on: https://github.com/netlify/next-runtime/blob/733a0219e5413aa1eea790af48c745322dbce917/src/index.ts + // This hook is called immediately after the build command is executed. + async onBuild(context) { const { constants, utils } = context; - const { digests, nextjsBuildDir } = generateAbsolutePaths({ constants }); + const { nextjsCacheDir } = generateAbsolutePaths({ constants }); + + const cacheExists = fse.existsSync(nextjsCacheDir); - console.log("'%s' exists: %s", nextjsBuildDir, String(fse.existsSync(nextjsBuildDir))); + if (cacheExists) { + console.log("'%s' exists: %s", nextjsCacheDir, String(cacheExists)); - const success = await utils.cache.save(nextjsBuildDir, { - digests, - }); + const success = await utils.cache.save(nextjsCacheDir); - console.log( - "Cached 'docs/.next' folder at the location '%s': %s", - nextjsBuildDir, - String(success), - ); + console.log("Cached '%s' folder: %s", nextjsCacheDir, String(success)); + } else { + console.log("'%s' does not exist", nextjsCacheDir); + } }, // debug // based on: https://github.com/netlify-labs/netlify-plugin-debug-cache/blob/v1.0.3/index.js diff --git a/packages/netlify-plugin-cache-docs/package.json b/packages/netlify-plugin-cache-docs/package.json index 54097b35d1c83e..1984ced27fcee5 100644 --- a/packages/netlify-plugin-cache-docs/package.json +++ b/packages/netlify-plugin-cache-docs/package.json @@ -1,6 +1,6 @@ { "name": "netlify-plugin-cache-docs", - "version": "5.0.0", + "version": "6.0.0", "private": true, "author": "MUI Team", "description": "Alternative to netlify-plugin-cache-nextjs", diff --git a/packages/rsc-builder/buildRsc.ts b/packages/rsc-builder/buildRsc.ts index b8f78490bcada1..31a8e86ad8f42c 100644 --- a/packages/rsc-builder/buildRsc.ts +++ b/packages/rsc-builder/buildRsc.ts @@ -27,6 +27,7 @@ const PROJECTS: Project[] = [ 'packages/mui-material/src/PigmentContainer/PigmentContainer.tsx', // RSC compatible 'packages/mui-material/src/PigmentGrid/PigmentGrid.tsx', // RSC compatible 'packages/mui-material/src/PigmentStack/PigmentStack.tsx', // RSC compatible + 'packages/mui-material/src/useAutocomplete/useAutocomplete.js', // RSC compatible ], }, { diff --git a/packages/rsc-builder/package.json b/packages/rsc-builder/package.json index 8d4fb0750c8e9c..ad7449321261d6 100644 --- a/packages/rsc-builder/package.json +++ b/packages/rsc-builder/package.json @@ -9,6 +9,6 @@ }, "devDependencies": { "@types/mocha": "^10.0.7", - "@types/node": "^18.19.44" + "@types/node": "^20.16.5" } } diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index aca058fc06b71d..bef19b13304e02 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -13,17 +13,17 @@ overrides: '@babel/preset-typescript': ^7.24.7 '@babel/runtime': ^7.25.0 '@babel/types': ^7.25.2 - '@definitelytyped/header-parser': ^0.2.11 - '@definitelytyped/typescript-versions': ^0.1.3 + '@definitelytyped/header-parser': ^0.2.12 + '@definitelytyped/typescript-versions': ^0.1.4 '@definitelytyped/utils': ^0.1.7 - '@types/node': ^18.19.44 - '@types/react': 18.3.3 + '@types/node': ^20.16.5 + '@types/react': ^18.3.4 '@types/react-dom': 18.3.0 cross-fetch: ^4.0.0 - '@pigment-css/react': 0.0.20 - '@pigment-css/unplugin': 0.0.20 - '@pigment-css/nextjs-plugin': 0.0.20 - '@pigment-css/vite-plugin': 0.0.20 + '@pigment-css/react': 0.0.22 + '@pigment-css/unplugin': 0.0.22 + '@pigment-css/nextjs-plugin': 0.0.22 + '@pigment-css/vite-plugin': 0.0.22 patchedDependencies: styled-components@6.1.12: @@ -35,14 +35,14 @@ importers: .: dependencies: '@googleapis/sheets': - specifier: ^9.1.0 - version: 9.1.0(encoding@0.1.13) + specifier: ^9.3.1 + version: 9.3.1(encoding@0.1.13) '@netlify/functions': specifier: ^2.8.1 version: 2.8.1 '@slack/bolt': - specifier: ^3.21.1 - version: 3.21.1 + specifier: ^3.21.2 + version: 3.21.2 execa: specifier: ^9.3.1 version: 9.3.1 @@ -51,8 +51,8 @@ importers: version: 9.13.0(encoding@0.1.13) devDependencies: '@argos-ci/core': - specifier: ^2.4.1 - version: 2.4.1 + specifier: ^2.5.0 + version: 2.5.0 '@babel/cli': specifier: ^7.24.8 version: 7.24.8(@babel/core@7.25.2) @@ -105,17 +105,20 @@ importers: specifier: workspace:^ version: link:packages/mui-utils/build '@next/eslint-plugin-next': - specifier: ^14.2.5 - version: 14.2.5 + specifier: ^14.2.8 + version: 14.2.8 '@octokit/rest': specifier: ^21.0.2 version: 21.0.2 '@pigment-css/react': - specifier: 0.0.20 - version: 0.0.20(@types/react@18.3.3)(react@18.3.1) + specifier: 0.0.22 + version: 0.0.22(@types/react@18.3.4)(react@18.3.1) '@playwright/test': specifier: 1.46.1 version: 1.46.1 + '@types/babel__core': + specifier: ^7.20.5 + version: 7.20.5 '@types/fs-extra': specifier: ^11.0.4 version: 11.0.4 @@ -126,11 +129,11 @@ importers: specifier: ^10.0.7 version: 10.0.7 '@types/node': - specifier: ^18.19.44 - version: 18.19.44 + specifier: ^20.16.5 + version: 20.16.5 '@types/react': - specifier: 18.3.3 - version: 18.3.3 + specifier: ^18.3.4 + version: 18.3.4 '@types/yargs': specifier: ^17.0.33 version: 17.0.33 @@ -187,16 +190,16 @@ importers: version: 8.57.0 eslint-config-airbnb: specifier: ^19.0.4 - version: 19.0.4(eslint-plugin-import@2.29.1(@typescript-eslint/parser@7.18.0(eslint@8.57.0)(typescript@5.5.4))(eslint-import-resolver-webpack@0.13.8)(eslint@8.57.0))(eslint-plugin-jsx-a11y@6.7.1(eslint@8.57.0))(eslint-plugin-react-hooks@4.6.2(eslint@8.57.0))(eslint-plugin-react@7.35.0(eslint@8.57.0))(eslint@8.57.0) + version: 19.0.4(eslint-plugin-import@2.29.1(@typescript-eslint/parser@7.18.0(eslint@8.57.0)(typescript@5.5.4))(eslint-import-resolver-webpack@0.13.9)(eslint@8.57.0))(eslint-plugin-jsx-a11y@6.7.1(eslint@8.57.0))(eslint-plugin-react-hooks@4.6.2(eslint@8.57.0))(eslint-plugin-react@7.35.2(eslint@8.57.0))(eslint@8.57.0) eslint-config-airbnb-typescript: specifier: ^18.0.0 - version: 18.0.0(@typescript-eslint/eslint-plugin@7.18.0(@typescript-eslint/parser@7.18.0(eslint@8.57.0)(typescript@5.5.4))(eslint@8.57.0)(typescript@5.5.4))(@typescript-eslint/parser@7.18.0(eslint@8.57.0)(typescript@5.5.4))(eslint-plugin-import@2.29.1(@typescript-eslint/parser@7.18.0(eslint@8.57.0)(typescript@5.5.4))(eslint-import-resolver-webpack@0.13.8)(eslint@8.57.0))(eslint@8.57.0) + version: 18.0.0(@typescript-eslint/eslint-plugin@7.18.0(@typescript-eslint/parser@7.18.0(eslint@8.57.0)(typescript@5.5.4))(eslint@8.57.0)(typescript@5.5.4))(@typescript-eslint/parser@7.18.0(eslint@8.57.0)(typescript@5.5.4))(eslint-plugin-import@2.29.1(@typescript-eslint/parser@7.18.0(eslint@8.57.0)(typescript@5.5.4))(eslint-import-resolver-webpack@0.13.9)(eslint@8.57.0))(eslint@8.57.0) eslint-config-prettier: specifier: ^9.1.0 version: 9.1.0(eslint@8.57.0) eslint-import-resolver-webpack: - specifier: ^0.13.8 - version: 0.13.8(eslint-plugin-import@2.29.1)(webpack@5.93.0(webpack-cli@5.1.4)) + specifier: ^0.13.9 + version: 0.13.9(eslint-plugin-import@2.29.1)(webpack@5.93.0(webpack-cli@5.1.4)) eslint-plugin-babel: specifier: ^5.3.1 version: 5.3.1(eslint@8.57.0) @@ -205,7 +208,7 @@ importers: version: 1.3.2(eslint@8.57.0) eslint-plugin-import: specifier: ^2.29.1 - version: 2.29.1(@typescript-eslint/parser@7.18.0(eslint@8.57.0)(typescript@5.5.4))(eslint-import-resolver-webpack@0.13.8)(eslint@8.57.0) + version: 2.29.1(@typescript-eslint/parser@7.18.0(eslint@8.57.0)(typescript@5.5.4))(eslint-import-resolver-webpack@0.13.9)(eslint@8.57.0) eslint-plugin-jsx-a11y: specifier: 6.7.1 version: 6.7.1(eslint@8.57.0) @@ -216,11 +219,11 @@ importers: specifier: ^10.5.0 version: 10.5.0(eslint@8.57.0) eslint-plugin-react: - specifier: ^7.35.0 - version: 7.35.0(eslint@8.57.0) + specifier: ^7.35.2 + version: 7.35.2(eslint@8.57.0) eslint-plugin-react-compiler: - specifier: 0.0.0-experimental-9aef357-20240815 - version: 0.0.0-experimental-9aef357-20240815(eslint@8.57.0) + specifier: 0.0.0-experimental-3f2f4f0-20240826 + version: 0.0.0-experimental-3f2f4f0-20240826(eslint@8.57.0) eslint-plugin-react-hooks: specifier: ^4.6.2 version: 4.6.2(eslint@8.57.0) @@ -270,8 +273,8 @@ importers: specifier: ^10.7.3 version: 10.7.3 nx: - specifier: ^19.6.0 - version: 19.6.0 + specifier: ^19.7.0 + version: 19.7.0 nyc: specifier: ^17.0.0 version: 17.0.0 @@ -280,7 +283,7 @@ importers: version: 4.6.1 postcss-styled-syntax: specifier: ^0.6.4 - version: 0.6.4(postcss@8.4.41) + version: 0.6.4(postcss@8.4.45) prettier: specifier: ^3.3.3 version: 3.3.3 @@ -358,7 +361,7 @@ importers: version: link:../../packages/mui-utils/build next: specifier: latest - version: 14.2.5(@babel/core@7.25.2)(@opentelemetry/api@1.8.0)(@playwright/test@1.46.1)(babel-plugin-macros@3.1.0)(react-dom@18.3.1(react@18.3.1))(react@18.3.1) + version: 14.2.9(@babel/core@7.25.2)(@opentelemetry/api@1.8.0)(@playwright/test@1.46.1)(babel-plugin-macros@3.1.0)(react-dom@18.3.1(react@18.3.1))(react@18.3.1) react: specifier: ^18.3.1 version: 18.3.1 @@ -367,14 +370,14 @@ importers: version: 18.3.1(react@18.3.1) devDependencies: '@pigment-css/nextjs-plugin': - specifier: 0.0.20 - version: 0.0.20(@types/react@18.3.3)(next@14.2.5(@babel/core@7.25.2)(@opentelemetry/api@1.8.0)(@playwright/test@1.46.1)(babel-plugin-macros@3.1.0)(react-dom@18.3.1(react@18.3.1))(react@18.3.1))(react@18.3.1) + specifier: 0.0.22 + version: 0.0.22(@types/react@18.3.4)(next@14.2.9(@babel/core@7.25.2)(@opentelemetry/api@1.8.0)(@playwright/test@1.46.1)(babel-plugin-macros@3.1.0)(react-dom@18.3.1(react@18.3.1))(react@18.3.1))(react@18.3.1) '@types/node': - specifier: ^18.19.44 - version: 18.19.44 + specifier: ^20.16.5 + version: 20.16.5 '@types/react': - specifier: 18.3.3 - version: 18.3.3 + specifier: ^18.3.4 + version: 18.3.4 '@types/react-dom': specifier: 18.3.0 version: 18.3.0 @@ -411,6 +414,9 @@ importers: clsx: specifier: ^2.1.1 version: 2.1.1 + playwright: + specifier: ^1.46.1 + version: 1.46.1 react: specifier: ^18.3.1 version: 18.3.1 @@ -431,29 +437,32 @@ importers: specifier: ^7.24.7 version: 7.24.7(@babel/core@7.25.2) '@pigment-css/vite-plugin': - specifier: 0.0.20 - version: 0.0.20(@types/react@18.3.3)(react@18.3.1)(vite@5.4.1(@types/node@18.19.44)(terser@5.29.2)) + specifier: 0.0.22 + version: 0.0.22(@types/react@18.3.4)(react@18.3.1)(vite@5.4.2(@types/node@20.16.5)(terser@5.29.2)) '@types/react': - specifier: 18.3.3 - version: 18.3.3 + specifier: ^18.3.4 + version: 18.3.4 '@types/react-dom': specifier: 18.3.0 version: 18.3.0 '@vitejs/plugin-react': specifier: ^4.3.1 - version: 4.3.1(vite@5.4.1(@types/node@18.19.44)(terser@5.29.2)) + version: 4.3.1(vite@5.4.2(@types/node@20.16.5)(terser@5.29.2)) postcss: - specifier: ^8.4.41 - version: 8.4.41 + specifier: ^8.4.45 + version: 8.4.45 postcss-combine-media-query: specifier: ^1.0.1 version: 1.0.1 vite: - specifier: 5.4.1 - version: 5.4.1(@types/node@18.19.44)(terser@5.29.2) + specifier: 5.4.2 + version: 5.4.2(@types/node@20.16.5)(terser@5.29.2) + vite-plugin-node-polyfills: + specifier: 0.22.0 + version: 0.22.0(rollup@4.21.1)(vite@5.4.2(@types/node@20.16.5)(terser@5.29.2)) vite-plugin-pages: specifier: ^0.32.3 - version: 0.32.3(vite@5.4.1(@types/node@18.19.44)(terser@5.29.2)) + version: 0.32.3(vite@5.4.2(@types/node@20.16.5)(terser@5.29.2)) benchmark: dependencies: @@ -462,16 +471,16 @@ importers: version: 7.25.0 '@chakra-ui/system': specifier: ^2.6.2 - version: 2.6.2(@emotion/react@11.13.0(@types/react@18.3.3)(react@18.3.1))(@emotion/styled@11.13.0(@emotion/react@11.13.0(@types/react@18.3.3)(react@18.3.1))(@types/react@18.3.3)(react@18.3.1))(react@18.3.1) + version: 2.6.2(@emotion/react@11.13.3(@types/react@18.3.4)(react@18.3.1))(@emotion/styled@11.13.0(@emotion/react@11.13.3(@types/react@18.3.4)(react@18.3.1))(@types/react@18.3.4)(react@18.3.1))(react@18.3.1) '@emotion/react': - specifier: ^11.13.0 - version: 11.13.0(@types/react@18.3.3)(react@18.3.1) + specifier: ^11.13.3 + version: 11.13.3(@types/react@18.3.4)(react@18.3.1) '@emotion/server': specifier: ^11.11.0 version: 11.11.0(@emotion/css@11.11.2) '@emotion/styled': specifier: ^11.13.0 - version: 11.13.0(@emotion/react@11.13.0(@types/react@18.3.3)(react@18.3.1))(@types/react@18.3.3)(react@18.3.1) + version: 11.13.0(@emotion/react@11.13.3(@types/react@18.3.4)(react@18.3.1))(@types/react@18.3.4)(react@18.3.1) '@mui/material': specifier: workspace:^ version: link:../packages/mui-material/build @@ -519,7 +528,7 @@ importers: version: 10.10.0(react@18.3.1) react-redux: specifier: ^8.1.3 - version: 8.1.3(@types/react-dom@18.3.0)(@types/react@18.3.3)(react-dom@18.3.1(react@18.3.1))(react-native@0.73.6(@babel/core@7.25.2)(@babel/preset-env@7.25.3(@babel/core@7.25.2))(encoding@0.1.13)(react@18.3.1))(react@18.3.1)(redux@4.2.1) + version: 8.1.3(@types/react-dom@18.3.0)(@types/react@18.3.4)(react-dom@18.3.1(react@18.3.1))(react-native@0.73.6(@babel/core@7.25.2)(@babel/preset-env@7.25.3(@babel/core@7.25.2))(encoding@0.1.13)(react@18.3.1))(react@18.3.1)(redux@4.2.1) redux: specifier: ^4.2.1 version: 4.2.1 @@ -534,7 +543,7 @@ importers: version: 5.1.5 theme-ui: specifier: ^0.16.2 - version: 0.16.2(@emotion/react@11.13.0(@types/react@18.3.3)(react@18.3.1))(react@18.3.1) + version: 0.16.2(@emotion/react@11.13.3(@types/react@18.3.4)(react@18.3.1))(react@18.3.1) webpack: specifier: ^5.93.0 version: 5.93.0(webpack-cli@5.1.4(webpack-bundle-analyzer@4.10.2)(webpack@5.93.0)) @@ -552,19 +561,19 @@ importers: version: 7.25.0 '@docsearch/react': specifier: ^3.6.1 - version: 3.6.1(@algolia/client-search@4.23.0)(@types/react@18.3.3)(react-dom@18.3.1(react@18.3.1))(react@18.3.1)(search-insights@2.13.0) + version: 3.6.1(@algolia/client-search@4.23.0)(@types/react@18.3.4)(react-dom@18.3.1(react@18.3.1))(react@18.3.1)(search-insights@2.13.0) '@emotion/cache': specifier: ^11.13.1 version: 11.13.1 '@emotion/react': - specifier: ^11.13.0 - version: 11.13.0(@types/react@18.3.3)(react@18.3.1) + specifier: ^11.13.3 + version: 11.13.3(@types/react@18.3.4)(react@18.3.1) '@emotion/server': specifier: ^11.11.0 version: 11.11.0(@emotion/css@11.11.2) '@emotion/styled': specifier: ^11.13.0 - version: 11.13.0(@emotion/react@11.13.0(@types/react@18.3.3)(react@18.3.1))(@types/react@18.3.3)(react@18.3.1) + version: 11.13.0(@emotion/react@11.13.3(@types/react@18.3.4)(react@18.3.1))(@types/react@18.3.4)(react@18.3.1) '@fortawesome/fontawesome-svg-core': specifier: ^6.6.0 version: 6.6.0 @@ -615,31 +624,31 @@ importers: version: link:../packages/mui-utils/build '@mui/x-charts': specifier: 7.13.0 - version: 7.13.0(@emotion/react@11.13.0(@types/react@18.3.3)(react@18.3.1))(@emotion/styled@11.13.0(@emotion/react@11.13.0(@types/react@18.3.3)(react@18.3.1))(@types/react@18.3.3)(react@18.3.1))(@mui/material@packages+mui-material+build)(@types/react@18.3.3)(react-dom@18.3.1(react@18.3.1))(react@18.3.1) + version: 7.13.0(@emotion/react@11.13.3(@types/react@18.3.4)(react@18.3.1))(@emotion/styled@11.13.0(@emotion/react@11.13.3(@types/react@18.3.4)(react@18.3.1))(@types/react@18.3.4)(react@18.3.1))(@mui/material@packages+mui-material+build)(@types/react@18.3.4)(react-dom@18.3.1(react@18.3.1))(react@18.3.1) '@mui/x-data-grid': specifier: 7.13.0 - version: 7.13.0(@emotion/react@11.13.0(@types/react@18.3.3)(react@18.3.1))(@emotion/styled@11.13.0(@emotion/react@11.13.0(@types/react@18.3.3)(react@18.3.1))(@types/react@18.3.3)(react@18.3.1))(@mui/material@packages+mui-material+build)(@types/react@18.3.3)(react-dom@18.3.1(react@18.3.1))(react@18.3.1) + version: 7.13.0(@emotion/react@11.13.3(@types/react@18.3.4)(react@18.3.1))(@emotion/styled@11.13.0(@emotion/react@11.13.3(@types/react@18.3.4)(react@18.3.1))(@types/react@18.3.4)(react@18.3.1))(@mui/material@packages+mui-material+build)(@types/react@18.3.4)(react-dom@18.3.1(react@18.3.1))(react@18.3.1) '@mui/x-data-grid-generator': specifier: 7.13.0 - version: 7.13.0(@emotion/react@11.13.0(@types/react@18.3.3)(react@18.3.1))(@emotion/styled@11.13.0(@emotion/react@11.13.0(@types/react@18.3.3)(react@18.3.1))(@types/react@18.3.3)(react@18.3.1))(@mui/icons-material@packages+mui-icons-material+build)(@mui/material@packages+mui-material+build)(@types/react@18.3.3)(react-dom@18.3.1(react@18.3.1))(react@18.3.1) + version: 7.13.0(@emotion/react@11.13.3(@types/react@18.3.4)(react@18.3.1))(@emotion/styled@11.13.0(@emotion/react@11.13.3(@types/react@18.3.4)(react@18.3.1))(@types/react@18.3.4)(react@18.3.1))(@mui/icons-material@packages+mui-icons-material+build)(@mui/material@packages+mui-material+build)(@types/react@18.3.4)(react-dom@18.3.1(react@18.3.1))(react@18.3.1) '@mui/x-data-grid-premium': specifier: 7.13.0 - version: 7.13.0(@emotion/react@11.13.0(@types/react@18.3.3)(react@18.3.1))(@emotion/styled@11.13.0(@emotion/react@11.13.0(@types/react@18.3.3)(react@18.3.1))(@types/react@18.3.3)(react@18.3.1))(@mui/material@packages+mui-material+build)(@types/react@18.3.3)(react-dom@18.3.1(react@18.3.1))(react@18.3.1) + version: 7.13.0(@emotion/react@11.13.3(@types/react@18.3.4)(react@18.3.1))(@emotion/styled@11.13.0(@emotion/react@11.13.3(@types/react@18.3.4)(react@18.3.1))(@types/react@18.3.4)(react@18.3.1))(@mui/material@packages+mui-material+build)(@types/react@18.3.4)(react-dom@18.3.1(react@18.3.1))(react@18.3.1) '@mui/x-data-grid-pro': specifier: 7.13.0 - version: 7.13.0(@emotion/react@11.13.0(@types/react@18.3.3)(react@18.3.1))(@emotion/styled@11.13.0(@emotion/react@11.13.0(@types/react@18.3.3)(react@18.3.1))(@types/react@18.3.3)(react@18.3.1))(@mui/material@packages+mui-material+build)(@types/react@18.3.3)(react-dom@18.3.1(react@18.3.1))(react@18.3.1) + version: 7.13.0(@emotion/react@11.13.3(@types/react@18.3.4)(react@18.3.1))(@emotion/styled@11.13.0(@emotion/react@11.13.3(@types/react@18.3.4)(react@18.3.1))(@types/react@18.3.4)(react@18.3.1))(@mui/material@packages+mui-material+build)(@types/react@18.3.4)(react-dom@18.3.1(react@18.3.1))(react@18.3.1) '@mui/x-date-pickers': specifier: 7.13.0 - version: 7.13.0(@emotion/react@11.13.0(@types/react@18.3.3)(react@18.3.1))(@emotion/styled@11.13.0(@emotion/react@11.13.0(@types/react@18.3.3)(react@18.3.1))(@types/react@18.3.3)(react@18.3.1))(@mui/material@packages+mui-material+build)(@types/react@18.3.3)(date-fns-jalali@2.21.3-1)(date-fns@2.30.0)(dayjs@1.11.12)(react-dom@18.3.1(react@18.3.1))(react@18.3.1) + version: 7.13.0(@emotion/react@11.13.3(@types/react@18.3.4)(react@18.3.1))(@emotion/styled@11.13.0(@emotion/react@11.13.3(@types/react@18.3.4)(react@18.3.1))(@types/react@18.3.4)(react@18.3.1))(@mui/material@packages+mui-material+build)(@types/react@18.3.4)(date-fns@2.30.0)(dayjs@1.11.13)(react-dom@18.3.1(react@18.3.1))(react@18.3.1) '@mui/x-date-pickers-pro': specifier: 7.13.0 - version: 7.13.0(@emotion/react@11.13.0(@types/react@18.3.3)(react@18.3.1))(@emotion/styled@11.13.0(@emotion/react@11.13.0(@types/react@18.3.3)(react@18.3.1))(@types/react@18.3.3)(react@18.3.1))(@mui/material@packages+mui-material+build)(@types/react@18.3.3)(date-fns-jalali@2.21.3-1)(date-fns@2.30.0)(dayjs@1.11.12)(react-dom@18.3.1(react@18.3.1))(react@18.3.1) + version: 7.13.0(@emotion/react@11.13.3(@types/react@18.3.4)(react@18.3.1))(@emotion/styled@11.13.0(@emotion/react@11.13.3(@types/react@18.3.4)(react@18.3.1))(@types/react@18.3.4)(react@18.3.1))(@mui/material@packages+mui-material+build)(@types/react@18.3.4)(date-fns@2.30.0)(dayjs@1.11.13)(react-dom@18.3.1(react@18.3.1))(react@18.3.1) '@mui/x-license': specifier: 7.13.0 - version: 7.13.0(@types/react@18.3.3)(react@18.3.1) + version: 7.13.0(@types/react@18.3.4)(react@18.3.1) '@mui/x-tree-view': specifier: 7.13.0 - version: 7.13.0(@emotion/react@11.13.0(@types/react@18.3.3)(react@18.3.1))(@emotion/styled@11.13.0(@emotion/react@11.13.0(@types/react@18.3.3)(react@18.3.1))(@types/react@18.3.3)(react@18.3.1))(@mui/material@packages+mui-material+build)(@types/react@18.3.3)(react-dom@18.3.1(react@18.3.1))(react@18.3.1) + version: 7.13.0(@emotion/react@11.13.3(@types/react@18.3.4)(react@18.3.1))(@emotion/styled@11.13.0(@emotion/react@11.13.3(@types/react@18.3.4)(react@18.3.1))(@types/react@18.3.4)(react@18.3.1))(@mui/material@packages+mui-material+build)(@types/react@18.3.4)(react-dom@18.3.1(react@18.3.1))(react@18.3.1) '@popperjs/core': specifier: ^2.11.8 version: 2.11.8 @@ -647,11 +656,11 @@ importers: specifier: ^9.7.4 version: 9.7.4(react-dom@18.3.1(react@18.3.1))(react@18.3.1) '@toolpad/core': - specifier: ^0.5.1 - version: 0.5.1(@emotion/react@11.13.0(@types/react@18.3.3)(react@18.3.1))(@emotion/styled@11.13.0(@emotion/react@11.13.0(@types/react@18.3.3)(react@18.3.1))(@types/react@18.3.3)(react@18.3.1))(@mui/icons-material@packages+mui-icons-material+build)(@mui/material@packages+mui-material+build)(@types/node@18.19.44)(@types/react@18.3.3)(happy-dom@12.10.3)(jsdom@24.0.0)(next@14.2.5(@babel/core@7.25.2)(@opentelemetry/api@1.8.0)(@playwright/test@1.46.1)(babel-plugin-macros@3.1.0)(react-dom@18.3.1(react@18.3.1))(react@18.3.1))(react-dom@18.3.1(react@18.3.1))(react@18.3.1)(terser@5.29.2) + specifier: ^0.5.2 + version: 0.5.2(@emotion/react@11.13.3(@types/react@18.3.4)(react@18.3.1))(@emotion/styled@11.13.0(@emotion/react@11.13.3(@types/react@18.3.4)(react@18.3.1))(@types/react@18.3.4)(react@18.3.1))(@mui/icons-material@packages+mui-icons-material+build)(@mui/material@packages+mui-material+build)(@types/node@20.16.5)(@types/react@18.3.4)(happy-dom@12.10.3)(jsdom@24.0.0)(next@14.2.9(@babel/core@7.25.2)(@opentelemetry/api@1.8.0)(@playwright/test@1.46.1)(babel-plugin-macros@3.1.0)(react-dom@18.3.1(react@18.3.1))(react@18.3.1))(react-dom@18.3.1(react@18.3.1))(react@18.3.1)(terser@5.29.2) autoprefixer: specifier: ^10.4.20 - version: 10.4.20(postcss@8.4.41) + version: 10.4.20(postcss@8.4.45) autosuggest-highlight: specifier: ^3.3.4 version: 3.3.4 @@ -685,15 +694,9 @@ importers: css-mediaquery: specifier: ^0.1.2 version: 0.1.2 - date-fns: - specifier: ^2.30.0 - version: 2.30.0 - date-fns-jalali: - specifier: ^2.21.3-1 - version: 2.21.3-1 dayjs: - specifier: ^1.11.12 - version: 1.11.12 + specifier: ^1.11.13 + version: 1.11.13 feed: specifier: ^4.2.2 version: 4.2.2 @@ -734,8 +737,8 @@ importers: specifier: ^5.1.2 version: 5.1.2(@mui/material@packages+mui-material+build)(react@18.3.1) next: - specifier: ^14.2.5 - version: 14.2.5(@babel/core@7.25.2)(@opentelemetry/api@1.8.0)(@playwright/test@1.46.1)(babel-plugin-macros@3.1.0)(react-dom@18.3.1(react@18.3.1))(react@18.3.1) + specifier: ^14.2.8 + version: 14.2.9(@babel/core@7.25.2)(@opentelemetry/api@1.8.0)(@playwright/test@1.46.1)(babel-plugin-macros@3.1.0)(react-dom@18.3.1(react@18.3.1))(react@18.3.1) notistack: specifier: 3.0.1 version: 3.0.1(csstype@3.1.3)(react-dom@18.3.1(react@18.3.1))(react@18.3.1) @@ -743,11 +746,11 @@ importers: specifier: ^0.2.0 version: 0.2.0 postcss: - specifier: ^8.4.41 - version: 8.4.41 + specifier: ^8.4.45 + version: 8.4.45 postcss-import: specifier: ^16.1.0 - version: 16.1.0(postcss@8.4.41) + version: 16.1.0(postcss@8.4.45) prop-types: specifier: ^15.8.1 version: 15.8.1 @@ -767,14 +770,14 @@ importers: specifier: ^7.6.1 version: 7.6.1(react@18.3.1) react-intersection-observer: - specifier: ^9.13.0 - version: 9.13.0(react-dom@18.3.1(react@18.3.1))(react@18.3.1) + specifier: ^9.13.1 + version: 9.13.1(react-dom@18.3.1(react@18.3.1))(react@18.3.1) react-is: specifier: ^18.3.1 version: 18.3.1 react-number-format: - specifier: ^5.4.0 - version: 5.4.0(react-dom@18.3.1(react@18.3.1))(react@18.3.1) + specifier: ^5.4.2 + version: 5.4.2(react-dom@18.3.1(react@18.3.1))(react@18.3.1) react-router-dom: specifier: ^6.26.1 version: 6.26.1(react-dom@18.3.1(react@18.3.1))(react@18.3.1) @@ -794,8 +797,8 @@ importers: specifier: ^4.4.5 version: 4.4.5(react-dom@18.3.1(react@18.3.1))(react@18.3.1) react-virtuoso: - specifier: ^4.10.1 - version: 4.10.1(react-dom@18.3.1(react@18.3.1))(react@18.3.1) + specifier: ^4.10.3 + version: 4.10.3(react-dom@18.3.1(react@18.3.1))(react@18.3.1) react-window: specifier: ^1.8.10 version: 1.8.10(react-dom@18.3.1(react@18.3.1))(react@18.3.1) @@ -840,8 +843,8 @@ importers: specifier: ^3.2.3 version: 3.2.3 '@types/chai': - specifier: ^4.3.17 - version: 4.3.17 + specifier: ^4.3.19 + version: 4.3.19 '@types/css-mediaquery': specifier: ^0.1.4 version: 0.1.4 @@ -852,14 +855,14 @@ importers: specifier: ^0.2.2 version: 0.2.2 '@types/node': - specifier: ^18.19.44 - version: 18.19.44 + specifier: ^20.16.5 + version: 20.16.5 '@types/prop-types': specifier: ^15.7.12 version: 15.7.12 '@types/react': - specifier: 18.3.3 - version: 18.3.3 + specifier: ^18.3.4 + version: 18.3.4 '@types/react-dom': specifier: 18.3.0 version: 18.3.0 @@ -900,6 +903,22 @@ importers: specifier: ^17.7.2 version: 17.7.2 + packages-internal/babel-plugin-resolve-imports: + dependencies: + '@babel/core': + specifier: ^7.25.2 + version: 7.25.2 + resolve: + specifier: ^1.22.8 + version: 1.22.8 + devDependencies: + '@types/babel__core': + specifier: ^7.20.5 + version: 7.20.5 + '@types/resolve': + specifier: ^1.20.6 + version: 1.20.6 + packages-internal/docs-utils: dependencies: rimraf: @@ -949,8 +968,8 @@ importers: specifier: ^7.20.5 version: 7.20.5 '@types/chai': - specifier: ^4.3.17 - version: 4.3.17 + specifier: ^4.3.19 + version: 4.3.19 '@types/doctrine': specifier: ^0.0.9 version: 0.0.9 @@ -958,11 +977,11 @@ importers: specifier: ^4.17.7 version: 4.17.7 '@types/node': - specifier: ^18.19.44 - version: 18.19.44 + specifier: ^20.16.5 + version: 20.16.5 '@types/react': - specifier: 18.3.3 - version: 18.3.3 + specifier: ^18.3.4 + version: 18.3.4 '@types/uuid': specifier: ^9.0.8 version: 9.0.8 @@ -997,14 +1016,14 @@ importers: specifier: ^11.13.1 version: 11.13.1 '@emotion/react': - specifier: ^11.13.0 - version: 11.13.0(@types/react@18.3.3)(react@18.3.1) + specifier: ^11.13.3 + version: 11.13.3(@types/react@18.3.4)(react@18.3.1) '@testing-library/dom': specifier: ^10.4.0 version: 10.4.0 '@testing-library/react': - specifier: ^16.0.0 - version: 16.0.0(@testing-library/dom@10.4.0)(@types/react-dom@18.3.0)(@types/react@18.3.3)(react-dom@18.3.1(react@18.3.1))(react@18.3.1) + specifier: ^16.0.1 + version: 16.0.1(@testing-library/dom@10.4.0)(@types/react-dom@18.3.0)(@types/react@18.3.4)(react-dom@18.3.1(react@18.3.1))(react@18.3.1) '@testing-library/user-event': specifier: ^14.5.2 version: 14.5.2(@testing-library/dom@10.4.0) @@ -1045,12 +1064,12 @@ importers: specifier: ^18.2.0 version: 18.3.1(react@18.3.1) sinon: - specifier: ^16.1.3 - version: 16.1.3 + specifier: ^18.0.0 + version: 18.0.0 devDependencies: '@types/chai': - specifier: ^4.3.17 - version: 4.3.17 + specifier: ^4.3.19 + version: 4.3.19 '@types/chai-dom': specifier: ^1.11.3 version: 1.11.3 @@ -1061,8 +1080,8 @@ importers: specifier: ^15.7.12 version: 15.7.12 '@types/react': - specifier: 18.3.3 - version: 18.3.3 + specifier: ^18.3.4 + version: 18.3.4 '@types/react-dom': specifier: 18.3.0 version: 18.3.0 @@ -1115,14 +1134,14 @@ importers: specifier: ^0.23.9 version: 0.23.9 remark: - specifier: ^13.0.0 - version: 13.0.0 + specifier: ^15.0.1 + version: 15.0.1 typescript: specifier: ^5.5.4 version: 5.5.4 unist-util-visit: - specifier: ^2.0.3 - version: 2.0.3 + specifier: ^5.0.0 + version: 5.0.0 devDependencies: '@types/babel__core': specifier: ^7.20.5 @@ -1131,8 +1150,8 @@ importers: specifier: ^7.20.6 version: 7.20.6 '@types/chai': - specifier: ^4.3.17 - version: 4.3.17 + specifier: ^4.3.19 + version: 4.3.19 '@types/doctrine': specifier: ^0.0.9 version: 0.0.9 @@ -1143,8 +1162,8 @@ importers: specifier: ^10.0.7 version: 10.0.7 '@types/node': - specifier: ^18.19.44 - version: 18.19.44 + specifier: ^20.16.5 + version: 20.16.5 '@types/react-docgen': specifier: workspace:* version: link:../react-docgen-types @@ -1155,8 +1174,8 @@ importers: specifier: ^4.5.0 version: 4.5.0 sinon: - specifier: ^16.1.3 - version: 16.1.3 + specifier: ^18.0.0 + version: 18.0.0 packages/api-docs-builder-core: dependencies: @@ -1174,14 +1193,14 @@ importers: version: 4.17.21 devDependencies: '@types/chai': - specifier: ^4.3.17 - version: 4.3.17 + specifier: ^4.3.19 + version: 4.3.19 '@types/mocha': specifier: ^10.0.7 version: 10.0.7 '@types/node': - specifier: ^18.19.44 - version: 18.19.44 + specifier: ^20.16.5 + version: 20.16.5 '@types/sinon': specifier: ^17.0.3 version: 17.0.3 @@ -1189,8 +1208,8 @@ importers: specifier: ^4.5.0 version: 4.5.0 sinon: - specifier: ^16.1.3 - version: 16.1.3 + specifier: ^18.0.0 + version: 18.0.0 typescript: specifier: ^5.5.4 version: 5.5.4 @@ -1202,8 +1221,8 @@ importers: version: 10.3.0 devDependencies: '@types/eslint': - specifier: ^8.56.11 - version: 8.56.11 + specifier: ^8.56.12 + version: 8.56.12 '@typescript-eslint/parser': specifier: ^7.18.0 version: 7.18.0(eslint@8.57.0)(typescript@5.5.4) @@ -1244,8 +1263,8 @@ importers: version: 1.29.0 devDependencies: '@types/chai': - specifier: ^4.3.17 - version: 4.3.17 + specifier: ^4.3.19 + version: 4.3.19 chai: specifier: ^4.5.0 version: 4.5.0 @@ -1260,7 +1279,7 @@ importers: version: 7.25.0 '@mui/utils': specifier: ^5.0.0 - version: 5.16.5(@types/react@18.3.3)(react@18.3.1) + version: 5.16.6(@types/react@18.3.4)(react@18.3.1) babel-plugin-macros: specifier: ^3.1.0 version: 3.1.0 @@ -1290,7 +1309,7 @@ importers: specifier: workspace:^ version: link:../mui-types/build '@mui/utils': - specifier: workspace:* + specifier: workspace:^ version: link:../mui-utils/build '@popperjs/core': specifier: ^2.11.8 @@ -1309,20 +1328,20 @@ importers: specifier: workspace:^ version: link:../../packages-internal/test-utils '@testing-library/react': - specifier: ^16.0.0 - version: 16.0.0(@testing-library/dom@10.4.0)(@types/react-dom@18.3.0)(@types/react@18.3.3)(react-dom@18.3.1(react@18.3.1))(react@18.3.1) + specifier: ^16.0.1 + version: 16.0.1(@testing-library/dom@10.4.0)(@types/react-dom@18.3.0)(@types/react@18.3.4)(react-dom@18.3.1(react@18.3.1))(react@18.3.1) '@testing-library/user-event': specifier: ^14.5.2 version: 14.5.2(@testing-library/dom@10.4.0) '@types/chai': - specifier: ^4.3.17 - version: 4.3.17 + specifier: ^4.3.19 + version: 4.3.19 '@types/prop-types': specifier: ^15.7.12 version: 15.7.12 '@types/react': - specifier: 18.3.3 - version: 18.3.3 + specifier: ^18.3.4 + version: 18.3.4 '@types/react-dom': specifier: 18.3.0 version: 18.3.0 @@ -1345,8 +1364,8 @@ importers: specifier: ^18.3.1 version: 18.3.1(react@18.3.1) sinon: - specifier: ^16.1.3 - version: 16.1.3 + specifier: ^18.0.0 + version: 18.0.0 publishDirectory: build packages/mui-codemod: @@ -1367,18 +1386,18 @@ importers: specifier: ^1.0.11 version: 1.0.11(jscodeshift@0.16.1(@babel/preset-env@7.25.3(@babel/core@7.25.2))) postcss: - specifier: ^8.4.41 - version: 8.4.41 + specifier: ^8.4.45 + version: 8.4.45 postcss-cli: specifier: ^11.0.0 - version: 11.0.0(jiti@1.21.0)(postcss@8.4.41)(tsx@4.17.0) + version: 11.0.0(jiti@1.21.0)(postcss@8.4.45)(tsx@4.17.0) yargs: specifier: ^17.7.2 version: 17.7.2 devDependencies: '@types/chai': - specifier: ^4.3.17 - version: 4.3.17 + specifier: ^4.3.19 + version: 4.3.19 '@types/jscodeshift': specifier: 0.11.11 version: 0.11.11 @@ -1397,13 +1416,13 @@ importers: version: 7.25.0 '@mui/base': specifier: '*' - version: 5.0.0-beta.40(@types/react@18.3.3)(react-dom@18.3.1(react@18.3.1))(react@18.3.1) + version: 5.0.0-beta.40(@types/react@18.3.4)(react-dom@18.3.1(react@18.3.1))(react@18.3.1) '@mui/internal-markdown': specifier: workspace:^ version: link:../markdown '@mui/system': - specifier: ^5.0.0 - version: 5.16.5(@emotion/react@11.13.0(@types/react@18.3.3)(react@18.3.1))(@emotion/styled@11.13.0(@emotion/react@11.13.0(@types/react@18.3.3)(react@18.3.1))(@types/react@18.3.3)(react@18.3.1))(@types/react@18.3.3)(react@18.3.1) + specifier: ^5.0.0 || ^6.0.0 + version: 5.16.5(@emotion/react@11.13.3(@types/react@18.3.4)(react@18.3.1))(@emotion/styled@11.13.0(@emotion/react@11.13.3(@types/react@18.3.4)(react@18.3.1))(@types/react@18.3.4)(react@18.3.1))(@types/react@18.3.4)(react@18.3.1) chai: specifier: ^4.4.1 version: 4.5.0 @@ -1433,17 +1452,17 @@ importers: specifier: ^0.0.20 version: 0.0.20 '@types/node': - specifier: ^18.19.44 - version: 18.19.44 + specifier: ^20.16.5 + version: 20.16.5 '@types/prop-types': specifier: ^15.7.12 version: 15.7.12 '@types/react': - specifier: 18.3.3 - version: 18.3.3 + specifier: ^18.3.4 + version: 18.3.4 next: - specifier: ^14.2.5 - version: 14.2.5(@babel/core@7.25.2)(@opentelemetry/api@1.8.0)(@playwright/test@1.46.1)(babel-plugin-macros@3.1.0)(react-dom@18.3.1(react@18.3.1))(react@18.3.1) + specifier: ^14.2.8 + version: 14.2.9(@babel/core@7.25.2)(@opentelemetry/api@1.8.0)(@playwright/test@1.46.1)(babel-plugin-macros@3.1.0)(react-dom@18.3.1(react@18.3.1))(react@18.3.1) react: specifier: ^18.3.1 version: 18.3.1 @@ -1456,8 +1475,8 @@ importers: version: 7.13.0 devDependencies: '@types/chai': - specifier: ^4.3.17 - version: 4.3.17 + specifier: ^4.3.19 + version: 4.3.19 chai: specifier: ^4.5.0 version: 4.5.0 @@ -1468,20 +1487,20 @@ importers: packages/mui-envinfo/test: dependencies: '@emotion/react': - specifier: ^11.13.0 - version: 11.13.0(@types/react@18.3.3)(react@18.3.1) + specifier: ^11.13.3 + version: 11.13.3(@types/react@18.3.4)(react@18.3.1) '@emotion/styled': specifier: ^11.13.0 - version: 11.13.0(@emotion/react@11.13.0(@types/react@18.3.3)(react@18.3.1))(@types/react@18.3.3)(react@18.3.1) + version: 11.13.0(@emotion/react@11.13.3(@types/react@18.3.4)(react@18.3.1))(@types/react@18.3.4)(react@18.3.1) '@mui/base': specifier: 5.0.0-beta.30 - version: 5.0.0-beta.30(@types/react@18.3.3)(react-dom@18.3.1(react@18.3.1))(react@18.3.1) + version: 5.0.0-beta.30(@types/react@18.3.4)(react-dom@18.3.1(react@18.3.1))(react@18.3.1) '@mui/joy': specifier: 5.0.0-beta.22 - version: 5.0.0-beta.22(@emotion/react@11.13.0(@types/react@18.3.3)(react@18.3.1))(@emotion/styled@11.13.0(@emotion/react@11.13.0(@types/react@18.3.3)(react@18.3.1))(@types/react@18.3.3)(react@18.3.1))(@types/react@18.3.3)(react-dom@18.3.1(react@18.3.1))(react@18.3.1) + version: 5.0.0-beta.22(@emotion/react@11.13.3(@types/react@18.3.4)(react@18.3.1))(@emotion/styled@11.13.0(@emotion/react@11.13.3(@types/react@18.3.4)(react@18.3.1))(@types/react@18.3.4)(react@18.3.1))(@types/react@18.3.4)(react-dom@18.3.1(react@18.3.1))(react@18.3.1) '@mui/material': specifier: 5.15.4 - version: 5.15.4(@emotion/react@11.13.0(@types/react@18.3.3)(react@18.3.1))(@emotion/styled@11.13.0(@emotion/react@11.13.0(@types/react@18.3.3)(react@18.3.1))(@types/react@18.3.3)(react@18.3.1))(@types/react@18.3.3)(react-dom@18.3.1(react@18.3.1))(react@18.3.1) + version: 5.15.4(@emotion/react@11.13.3(@types/react@18.3.4)(react@18.3.1))(@emotion/styled@11.13.0(@emotion/react@11.13.3(@types/react@18.3.4)(react@18.3.1))(@types/react@18.3.4)(react@18.3.1))(@types/react@18.3.4)(react-dom@18.3.1(react@18.3.1))(react@18.3.1) react: specifier: ^18.3.1 version: 18.3.1 @@ -1490,8 +1509,8 @@ importers: version: 18.3.1(react@18.3.1) devDependencies: '@types/react': - specifier: 18.3.3 - version: 18.3.3 + specifier: ^18.3.4 + version: 18.3.4 packages/mui-icons-material: dependencies: @@ -1509,11 +1528,11 @@ importers: specifier: workspace:^ version: link:../mui-material/build '@types/chai': - specifier: ^4.3.17 - version: 4.3.17 + specifier: ^4.3.19 + version: 4.3.19 '@types/react': - specifier: 18.3.3 - version: 18.3.3 + specifier: ^18.3.4 + version: 18.3.4 chai: specifier: ^4.5.0 version: 4.5.0 @@ -1559,10 +1578,10 @@ importers: version: 7.25.0 '@emotion/react': specifier: ^11.5.0 - version: 11.13.0(@types/react@18.3.3)(react@18.3.1) + version: 11.13.3(@types/react@18.3.4)(react@18.3.1) '@emotion/styled': specifier: ^11.3.0 - version: 11.13.0(@emotion/react@11.13.0(@types/react@18.3.3)(react@18.3.1))(@types/react@18.3.3)(react@18.3.1) + version: 11.13.0(@emotion/react@11.13.3(@types/react@18.3.4)(react@18.3.1))(@types/react@18.3.4)(react@18.3.1) '@mui/base': specifier: workspace:* version: link:../mui-base/build @@ -1570,13 +1589,13 @@ importers: specifier: workspace:^ version: link:../mui-core-downloads-tracker/build '@mui/system': - specifier: workspace:* + specifier: workspace:^ version: link:../mui-system/build '@mui/types': specifier: workspace:^ version: link:../mui-types/build '@mui/utils': - specifier: workspace:* + specifier: workspace:^ version: link:../mui-utils/build clsx: specifier: ^2.1.1 @@ -1592,14 +1611,14 @@ importers: specifier: workspace:^ version: link:../mui-material/build '@types/chai': - specifier: ^4.3.17 - version: 4.3.17 + specifier: ^4.3.19 + version: 4.3.19 '@types/prop-types': specifier: ^15.7.12 version: 15.7.12 '@types/react': - specifier: 18.3.3 - version: 18.3.3 + specifier: ^18.3.4 + version: 18.3.4 '@types/react-dom': specifier: 18.3.0 version: 18.3.0 @@ -1616,8 +1635,8 @@ importers: specifier: ^4.17.21 version: 4.17.21 next: - specifier: ^14.2.5 - version: 14.2.5(@babel/core@7.25.2)(@opentelemetry/api@1.8.0)(@playwright/test@1.46.1)(babel-plugin-macros@3.1.0)(react-dom@18.3.1(react@18.3.1))(react@18.3.1) + specifier: ^14.2.8 + version: 14.2.9(@babel/core@7.25.2)(@opentelemetry/api@1.8.0)(@playwright/test@1.46.1)(babel-plugin-macros@3.1.0)(react-dom@18.3.1(react@18.3.1))(react@18.3.1) react: specifier: ^18.3.1 version: 18.3.1 @@ -1625,8 +1644,8 @@ importers: specifier: ^18.3.1 version: 18.3.1(react@18.3.1) sinon: - specifier: ^16.1.3 - version: 16.1.3 + specifier: ^18.0.0 + version: 18.0.0 publishDirectory: build packages/mui-lab: @@ -1636,10 +1655,10 @@ importers: version: 7.25.0 '@emotion/react': specifier: ^11.5.0 - version: 11.13.0(@types/react@18.3.3)(react@18.3.1) + version: 11.13.3(@types/react@18.3.4)(react@18.3.1) '@emotion/styled': specifier: ^11.3.0 - version: 11.13.0(@emotion/react@11.13.0(@types/react@18.3.3)(react@18.3.1))(@types/react@18.3.3)(react@18.3.1) + version: 11.13.0(@emotion/react@11.13.3(@types/react@18.3.4)(react@18.3.1))(@types/react@18.3.4)(react@18.3.1) '@mui/base': specifier: workspace:* version: link:../mui-base/build @@ -1647,13 +1666,13 @@ importers: specifier: workspace:^ version: link:../mui-material-pigment-css/build '@mui/system': - specifier: workspace:* + specifier: workspace:^ version: link:../mui-system/build '@mui/types': specifier: workspace:^ version: link:../mui-types/build '@mui/utils': - specifier: workspace:* + specifier: workspace:^ version: link:../mui-utils/build clsx: specifier: ^2.1.1 @@ -1669,14 +1688,14 @@ importers: specifier: workspace:* version: link:../mui-material/build '@types/chai': - specifier: ^4.3.17 - version: 4.3.17 + specifier: ^4.3.19 + version: 4.3.19 '@types/prop-types': specifier: ^15.7.12 version: 15.7.12 '@types/react': - specifier: 18.3.3 - version: 18.3.3 + specifier: ^18.3.4 + version: 18.3.4 '@types/react-dom': specifier: 18.3.0 version: 18.3.0 @@ -1693,8 +1712,8 @@ importers: specifier: ^18.3.1 version: 18.3.1(react@18.3.1) sinon: - specifier: ^16.1.3 - version: 16.1.3 + specifier: ^18.0.0 + version: 18.0.0 publishDirectory: build packages/mui-material: @@ -1704,10 +1723,10 @@ importers: version: 7.25.0 '@emotion/react': specifier: ^11.5.0 - version: 11.13.0(@types/react@18.3.3)(react@18.3.1) + version: 11.13.3(@types/react@18.3.4)(react@18.3.1) '@emotion/styled': specifier: ^11.3.0 - version: 11.13.0(@emotion/react@11.13.0(@types/react@18.3.3)(react@18.3.1))(@types/react@18.3.3)(react@18.3.1) + version: 11.13.0(@emotion/react@11.13.3(@types/react@18.3.4)(react@18.3.1))(@types/react@18.3.4)(react@18.3.1) '@mui/core-downloads-tracker': specifier: workspace:^ version: link:../mui-core-downloads-tracker/build @@ -1715,13 +1734,13 @@ importers: specifier: workspace:^ version: link:../mui-material-pigment-css/build '@mui/system': - specifier: workspace:* + specifier: workspace:^ version: link:../mui-system/build '@mui/types': specifier: workspace:^ version: link:../mui-types/build '@mui/utils': - specifier: workspace:* + specifier: workspace:^ version: link:../mui-utils/build '@popperjs/core': specifier: ^2.11.8 @@ -1758,14 +1777,14 @@ importers: specifier: ^14.5.2 version: 14.5.2(@testing-library/dom@10.4.0) '@types/chai': - specifier: ^4.3.17 - version: 4.3.17 + specifier: ^4.3.19 + version: 4.3.19 '@types/prop-types': specifier: ^15.7.12 version: 15.7.12 '@types/react': - specifier: 18.3.3 - version: 18.3.3 + specifier: ^18.3.4 + version: 18.3.4 '@types/react-dom': specifier: 18.3.0 version: 18.3.0 @@ -1800,8 +1819,8 @@ importers: specifier: ^6.26.1 version: 6.26.1(react-dom@18.3.1(react@18.3.1))(react@18.3.1) sinon: - specifier: ^16.1.3 - version: 16.1.3 + specifier: ^18.0.0 + version: 18.0.0 publishDirectory: build packages/mui-material-nextjs: @@ -1814,17 +1833,17 @@ importers: specifier: ^11.13.1 version: 11.13.1 '@emotion/react': - specifier: ^11.13.0 - version: 11.13.0(@types/react@18.3.3)(react@18.3.1) + specifier: ^11.13.3 + version: 11.13.3(@types/react@18.3.4)(react@18.3.1) '@emotion/server': specifier: ^11.11.0 version: 11.11.0(@emotion/css@11.11.2) '@types/react': - specifier: 18.3.3 - version: 18.3.3 + specifier: ^18.3.4 + version: 18.3.4 next: - specifier: 14.2.5 - version: 14.2.5(@babel/core@7.25.2)(@opentelemetry/api@1.8.0)(@playwright/test@1.46.1)(babel-plugin-macros@3.1.0)(react-dom@18.3.1(react@18.3.1))(react@18.3.1) + specifier: 14.2.8 + version: 14.2.8(@babel/core@7.25.2)(@opentelemetry/api@1.8.0)(@playwright/test@1.46.1)(babel-plugin-macros@3.1.0)(react-dom@18.3.1(react@18.3.1))(react@18.3.1) react: specifier: ^18.3.1 version: 18.3.1 @@ -1832,12 +1851,15 @@ importers: packages/mui-material-pigment-css: dependencies: + '@babel/runtime': + specifier: ^7.25.0 + version: 7.25.0 '@mui/system': specifier: workspace:* version: link:../mui-system/build '@pigment-css/react': - specifier: 0.0.20 - version: 0.0.20(@types/react@18.3.3)(react@18.3.1) + specifier: 0.0.22 + version: 0.0.22(@types/react@18.3.4)(react@18.3.1) publishDirectory: build packages/mui-private-theming: @@ -1846,7 +1868,7 @@ importers: specifier: ^7.25.0 version: 7.25.0 '@mui/utils': - specifier: workspace:* + specifier: workspace:^ version: link:../mui-utils/build prop-types: specifier: ^15.8.1 @@ -1859,11 +1881,11 @@ importers: specifier: workspace:^ version: link:../mui-types/build '@types/chai': - specifier: ^4.3.17 - version: 4.3.17 + specifier: ^4.3.19 + version: 4.3.19 '@types/react': - specifier: 18.3.3 - version: 18.3.3 + specifier: ^18.3.4 + version: 18.3.4 chai: specifier: ^4.5.0 version: 4.5.0 @@ -1888,11 +1910,11 @@ importers: version: 15.8.1 devDependencies: '@emotion/react': - specifier: ^11.13.0 - version: 11.13.0(@types/react@18.3.3)(react@18.3.1) + specifier: ^11.13.3 + version: 11.13.3(@types/react@18.3.4)(react@18.3.1) '@emotion/styled': specifier: ^11.13.0 - version: 11.13.0(@emotion/react@11.13.0(@types/react@18.3.3)(react@18.3.1))(@types/react@18.3.3)(react@18.3.1) + version: 11.13.0(@emotion/react@11.13.3(@types/react@18.3.4)(react@18.3.1))(@types/react@18.3.4)(react@18.3.1) '@mui/internal-test-utils': specifier: workspace:^ version: link:../../packages-internal/test-utils @@ -1900,11 +1922,11 @@ importers: specifier: workspace:* version: link:build '@types/chai': - specifier: ^4.3.17 - version: 4.3.17 + specifier: ^4.3.19 + version: 4.3.19 '@types/react': - specifier: 18.3.3 - version: 18.3.3 + specifier: ^18.3.4 + version: 18.3.4 chai: specifier: ^4.5.0 version: 4.5.0 @@ -1935,14 +1957,14 @@ importers: specifier: workspace:* version: link:build '@types/chai': - specifier: ^4.3.17 - version: 4.3.17 + specifier: ^4.3.19 + version: 4.3.19 '@types/hoist-non-react-statics': specifier: ^3.3.5 version: 3.3.5 '@types/react': - specifier: 18.3.3 - version: 18.3.3 + specifier: ^18.3.4 + version: 18.3.4 chai: specifier: ^4.5.0 version: 4.5.0 @@ -1963,13 +1985,13 @@ importers: specifier: ^0.9.2 version: 0.9.2 '@mui/private-theming': - specifier: workspace:* + specifier: workspace:^ version: link:../mui-private-theming/build '@mui/types': specifier: workspace:^ version: link:../mui-types/build '@mui/utils': - specifier: workspace:* + specifier: workspace:^ version: link:../mui-utils/build clsx: specifier: ^2.1.1 @@ -2015,11 +2037,11 @@ importers: specifier: workspace:^ version: link:../mui-material/build '@types/chai': - specifier: ^4.3.17 - version: 4.3.17 + specifier: ^4.3.19 + version: 4.3.19 '@types/react': - specifier: 18.3.3 - version: 18.3.3 + specifier: ^18.3.4 + version: 18.3.4 '@types/react-dom': specifier: 18.3.0 version: 18.3.0 @@ -2036,8 +2058,8 @@ importers: specifier: ^18.3.1 version: 18.3.1(react@18.3.1) sinon: - specifier: ^16.1.3 - version: 16.1.3 + specifier: ^18.0.0 + version: 18.0.0 publishDirectory: build packages/mui-system: @@ -2046,16 +2068,16 @@ importers: specifier: ^7.25.0 version: 7.25.0 '@mui/private-theming': - specifier: workspace:* + specifier: workspace:^ version: link:../mui-private-theming/build '@mui/styled-engine': - specifier: workspace:* + specifier: workspace:^ version: link:../mui-styled-engine/build '@mui/types': specifier: workspace:^ version: link:../mui-types/build '@mui/utils': - specifier: workspace:* + specifier: workspace:^ version: link:../mui-utils/build clsx: specifier: ^2.1.1 @@ -2068,11 +2090,11 @@ importers: version: 15.8.1 devDependencies: '@emotion/react': - specifier: ^11.13.0 - version: 11.13.0(@types/react@18.3.3)(react@18.3.1) + specifier: ^11.13.3 + version: 11.13.3(@types/react@18.3.4)(react@18.3.1) '@emotion/styled': specifier: ^11.13.0 - version: 11.13.0(@emotion/react@11.13.0(@types/react@18.3.3)(react@18.3.1))(@types/react@18.3.3)(react@18.3.1) + version: 11.13.0(@emotion/react@11.13.3(@types/react@18.3.4)(react@18.3.1))(@types/react@18.3.4)(react@18.3.1) '@mui/internal-babel-macros': specifier: workspace:^ version: link:../mui-babel-macros @@ -2083,14 +2105,14 @@ importers: specifier: workspace:* version: link:build '@types/chai': - specifier: ^4.3.17 - version: 4.3.17 + specifier: ^4.3.19 + version: 4.3.19 '@types/prop-types': specifier: ^15.7.12 version: 15.7.12 '@types/react': - specifier: 18.3.3 - version: 18.3.3 + specifier: ^18.3.4 + version: 18.3.4 '@types/sinon': specifier: ^17.0.3 version: 17.0.3 @@ -2107,8 +2129,8 @@ importers: specifier: ^18.3.1 version: 18.3.1 sinon: - specifier: ^16.1.3 - version: 16.1.3 + specifier: ^18.0.0 + version: 18.0.0 styled-components: specifier: ^6.1.12 version: 6.1.12(patch_hash=ua4w6griwxbnxnkzzvndsl67he)(react-dom@18.3.1(react@18.3.1))(react@18.3.1) @@ -2120,8 +2142,8 @@ importers: specifier: workspace:* version: link:build '@types/react': - specifier: 18.3.3 - version: 18.3.3 + specifier: ^18.3.4 + version: 18.3.4 publishDirectory: build packages/mui-utils: @@ -2152,17 +2174,17 @@ importers: specifier: workspace:^ version: link:../../packages-internal/test-utils '@types/chai': - specifier: ^4.3.17 - version: 4.3.17 + specifier: ^4.3.19 + version: 4.3.19 '@types/mocha': specifier: ^10.0.7 version: 10.0.7 '@types/node': - specifier: ^18.19.44 - version: 18.19.44 + specifier: ^20.16.5 + version: 20.16.5 '@types/react': - specifier: 18.3.3 - version: 18.3.3 + specifier: ^18.3.4 + version: 18.3.4 '@types/react-dom': specifier: 18.3.0 version: 18.3.0 @@ -2182,8 +2204,8 @@ importers: specifier: ^18.3.1 version: 18.3.1(react@18.3.1) sinon: - specifier: ^16.1.3 - version: 16.1.3 + specifier: ^18.0.0 + version: 18.0.0 publishDirectory: build packages/netlify-plugin-cache-docs: @@ -2211,11 +2233,38 @@ importers: specifier: ^10.0.7 version: 10.0.7 '@types/node': - specifier: ^18.19.44 - version: 18.19.44 + specifier: ^20.16.5 + version: 20.16.5 packages/waterfall: {} + scripts/sizeSnapshot: + dependencies: + '@mui/base': + specifier: workspace:^ + version: link:../../packages/mui-base/build + '@mui/joy': + specifier: workspace:^ + version: link:../../packages/mui-joy/build + '@mui/lab': + specifier: workspace:^ + version: link:../../packages/mui-lab/build + '@mui/material': + specifier: workspace:^ + version: link:../../packages/mui-material/build + '@mui/private-theming': + specifier: workspace:^ + version: link:../../packages/mui-private-theming/build + '@mui/styles': + specifier: workspace:^ + version: link:../../packages/mui-styles/build + '@mui/system': + specifier: workspace:^ + version: link:../../packages/mui-system/build + '@mui/utils': + specifier: workspace:^ + version: link:../../packages/mui-utils/build + test: dependencies: '@react-spring/web': @@ -2229,8 +2278,8 @@ importers: specifier: ^11.13.1 version: 11.13.1 '@emotion/react': - specifier: ^11.13.0 - version: 11.13.0(@types/react@18.3.3)(react@18.3.1) + specifier: ^11.13.3 + version: 11.13.3(@types/react@18.3.4)(react@18.3.1) '@mui/base': specifier: workspace:* version: link:../packages/mui-base/build @@ -2262,11 +2311,11 @@ importers: specifier: ^10.4.0 version: 10.4.0 '@types/chai': - specifier: ^4.3.17 - version: 4.3.17 + specifier: ^4.3.19 + version: 4.3.19 '@types/react': - specifier: 18.3.3 - version: 18.3.3 + specifier: ^18.3.4 + version: 18.3.4 '@types/react-is': specifier: ^18.3.0 version: 18.3.0 @@ -2310,8 +2359,8 @@ importers: specifier: ^6.26.1 version: 6.26.1(react-dom@18.3.1(react@18.3.1))(react@18.3.1) sinon: - specifier: ^16.1.3 - version: 16.1.3 + specifier: ^18.0.0 + version: 18.0.0 styled-components: specifier: ^6.1.12 version: 6.1.12(patch_hash=ua4w6griwxbnxnkzzvndsl67he)(react-dom@18.3.1(react@18.3.1))(react@18.3.1) @@ -2428,12 +2477,16 @@ packages: resolution: {integrity: sha512-30iZtAPgz+LTIYoeivqYo853f02jBYSd5uGnGpkFV0M3xOt9aN73erkgYAmZU43x4VfqcnLxW9Kpg3R5LC4YYw==} engines: {node: '>=6.0.0'} - '@argos-ci/core@2.4.1': - resolution: {integrity: sha512-Sl+5Zq4LBZF+CDB0eXGdTOLv3E9bubO2tfpDncQku5/s/N+2Ptn0JAw/Vc3EdJAtMWj1G8uy+6cvtV+eaVNnFg==} + '@argos-ci/api-client@0.2.0': + resolution: {integrity: sha512-stqugeAtbHjD2MwezvgJ4hU0HvlEGwGDVsJvUUD4YoRS0putS8yFjXuempkc90XGeHDEfYZgvG372rcK7/FClA==} + engines: {node: '>=18.0.0'} + + '@argos-ci/core@2.5.0': + resolution: {integrity: sha512-xNHKWzuSLHXm/5fhdEQv8zUwExeEkYzw6CV/Ha9rUBBTPomZL5CNxpXQ/ww1AA4mRC5dq3CfgreRq8qj7HQMVQ==} engines: {node: '>=18.0.0'} - '@argos-ci/util@2.1.0': - resolution: {integrity: sha512-/78zJjZJCh3i7Eh3/lo7ybXK2pzXFGUNHbK3SgJNKNbFiBDllNRfy+x0kccjvN2gCCDz877jnFOlSoZZuMK56A==} + '@argos-ci/util@2.1.1': + resolution: {integrity: sha512-UyACLQe9rvCPbo9muhrLte1AD75kQlcGBuecjmaotaF9MBMj+9Yz+TYs1jJrlLMgqowfIgbXjBYmkXRUn36tCg==} engines: {node: '>=18.0.0'} '@babel/cli@7.24.8': @@ -3302,7 +3355,7 @@ packages: '@docsearch/react@3.6.1': resolution: {integrity: sha512-qXZkEPvybVhSXj0K7U3bXc233tk5e8PfhoZ6MhPOiik/qUQxYC+Dn9DnoS7CxHQQhHfCvTiN0eY9M12oRghEXw==} peerDependencies: - '@types/react': 18.3.3 + '@types/react': ^18.3.4 react: '>= 16.8.0 < 19.0.0' react-dom: '>= 16.8.0 < 19.0.0' search-insights: '>= 1 < 3' @@ -3319,8 +3372,8 @@ packages: '@emnapi/core@1.2.0': resolution: {integrity: sha512-E7Vgw78I93we4ZWdYCb4DGAwRROGkMIXk7/y87UmANR+J6qsWusmC3gLt0H+O0KOt5e6O38U8oJamgbudrES/w==} - '@emnapi/runtime@1.1.1': - resolution: {integrity: sha512-3bfqkzuR1KLx57nZfjr2NLnFOobvyS0aTszaEGCGqmYMVDRaGvgIZbjGSV/MHSSmLgQ/b9JFHQ5xm5WRZYd+XQ==} + '@emnapi/runtime@1.2.0': + resolution: {integrity: sha512-bV21/9LQmcQeCPEg3BDFtvwL6cwiTMksYNWQQ4KOxCZikEGalWtenoZ0wCiukJINlGCIi2KXx01g4FoH/LxpzQ==} '@emnapi/wasi-threads@1.0.1': resolution: {integrity: sha512-iIBu7mwkq4UQGeMEM8bLwNK962nXdhodeScX4slfQnRhEMMzvYivHhutCIk8uojvmASXXPC2WNEjwxFWk72Oqw==} @@ -3364,8 +3417,8 @@ packages: '@emotion/memoize@0.9.0': resolution: {integrity: sha512-30FAj7/EoJ5mwVPOWhAyCX+FPfMDrVecJAM+Iw9NRoSl4BBAQeqj4cApHHUXOVvIPgLVDsCFoz/hGD+5QQD1GQ==} - '@emotion/react@11.13.0': - resolution: {integrity: sha512-WkL+bw1REC2VNV1goQyfxjx1GYJkcc23CRQkXX+vZNLINyfI7o+uUn/rTGPt/xJ3bJHd5GcljgnxHf4wRw5VWQ==} + '@emotion/react@11.13.3': + resolution: {integrity: sha512-lIsdU6JNrmYfJ5EbUCf4xW1ovy5wKQ2CkPRM4xogziOxH1nXxBSjpC9YqbFAP7circxMfYp+6x676BqWcEiixg==} peerDependencies: '@types/react': '*' react: '>=16.8.0' @@ -3373,8 +3426,8 @@ packages: '@types/react': optional: true - '@emotion/serialize@1.3.0': - resolution: {integrity: sha512-jACuBa9SlYajnpIVXB+XOXnfJHyckDfe6fOpORIM6yhBDlqGuExvDdZYHDQGoDf3bZXGv7tNr+LpLjJqiEQ6EA==} + '@emotion/serialize@1.3.1': + resolution: {integrity: sha512-dEPNKzBPU+vFPGa+z3axPRn8XVDetYORmDC0wAiej+TNcOZE70ZMJa0X7JdeoM6q/nWTMZeLpN/fTnD9o8MQBA==} '@emotion/server@11.11.0': resolution: {integrity: sha512-6q89fj2z8VBTx9w93kJ5n51hsmtYuFPtZgnc1L8VzRx9ti4EU6EyvF6Nn1H1x3vcCQCF7u2dB2lY4AYJwUW4PA==} @@ -3397,12 +3450,12 @@ packages: '@types/react': optional: true + '@emotion/unitless@0.10.0': + resolution: {integrity: sha512-dFoMUuQA20zvtVTuxZww6OHoJYgrzfKM1t52mVySDJnMSEa08ruEvdYQbhvyu6soU+NeLVd3yKfTfT0NeV6qGg==} + '@emotion/unitless@0.8.1': resolution: {integrity: sha512-KOEGMu6dmJZtpadb476IsZBclKvILjopjUii3V+7MnXIQCYh8W3NgNcgwo21n9LXZX6EDIKvqfjYxXebDwxKmQ==} - '@emotion/unitless@0.9.0': - resolution: {integrity: sha512-TP6GgNZtmtFaFcsOgExdnfxLLpRDla4Q66tnenA9CktvVSdNKDvMVuUah4QvWPIpNjrWsGg3qeGo9a43QooGZQ==} - '@emotion/use-insertion-effect-with-fallbacks@1.1.0': resolution: {integrity: sha512-+wBOcIV5snwGgI2ya3u99D7/FJquOIniQT1IKyDsBmEgwvpxMNeS65Oib7OnE2d2aY+3BU4OiH+0Wchf8yk3Hw==} peerDependencies: @@ -3765,8 +3818,8 @@ packages: resolution: {integrity: sha512-9KMSDtJ/sIov+5pcH+CAfiJXSiuYgN0KLKQFg0HHWR2DwcjGYkcbmhoZcWsaOWOqq4kihN1l7wX91UoRxxKKTQ==} engines: {node: '>=18.0.0'} - '@googleapis/sheets@9.1.0': - resolution: {integrity: sha512-P4ao9holdrrBGzPulP1kAhZvP9jE30kkxPAKJMPl86hlLR1gIJZa4N37+wPJEj8JMkrKL0ei2svP7sn5/XyUAQ==} + '@googleapis/sheets@9.3.1': + resolution: {integrity: sha512-nPgzOiDs/FSFhE+dX2KfkmsmkXM3WfXYP06FoW8cXvHshwxHSI3FbXwe5XJYstDAWXP9YA7AMSvmwnuD4OAl2w==} engines: {node: '>=12.0.0'} '@hapi/hoek@9.3.0': @@ -3792,116 +3845,108 @@ packages: resolution: {integrity: sha512-H9XAx3hc0BQHY6l+IFSWHDySypcXsvsuLhgYLUGywmJ5pswRVQJUHpOsobnLYp2ZUaUlKiKDrgWWhosOwAEM8Q==} engines: {node: '>=6.9.0'} - '@img/sharp-darwin-arm64@0.33.3': - resolution: {integrity: sha512-FaNiGX1MrOuJ3hxuNzWgsT/mg5OHG/Izh59WW2mk1UwYHUwtfbhk5QNKYZgxf0pLOhx9ctGiGa2OykD71vOnSw==} - engines: {glibc: '>=2.26', node: ^18.17.0 || ^20.3.0 || >=21.0.0, npm: '>=9.6.5', pnpm: '>=7.1.0', yarn: '>=3.2.0'} + '@img/sharp-darwin-arm64@0.33.5': + resolution: {integrity: sha512-UT4p+iz/2H4twwAoLCqfA9UH5pI6DggwKEGuaPy7nCVQ8ZsiY5PIcrRvD1DzuY3qYL07NtIQcWnBSY/heikIFQ==} + engines: {node: ^18.17.0 || ^20.3.0 || >=21.0.0} cpu: [arm64] os: [darwin] - '@img/sharp-darwin-x64@0.33.3': - resolution: {integrity: sha512-2QeSl7QDK9ru//YBT4sQkoq7L0EAJZA3rtV+v9p8xTKl4U1bUqTIaCnoC7Ctx2kCjQgwFXDasOtPTCT8eCTXvw==} - engines: {glibc: '>=2.26', node: ^18.17.0 || ^20.3.0 || >=21.0.0, npm: '>=9.6.5', pnpm: '>=7.1.0', yarn: '>=3.2.0'} + '@img/sharp-darwin-x64@0.33.5': + resolution: {integrity: sha512-fyHac4jIc1ANYGRDxtiqelIbdWkIuQaI84Mv45KvGRRxSAa7o7d1ZKAOBaYbnepLC1WqxfpimdeWfvqqSGwR2Q==} + engines: {node: ^18.17.0 || ^20.3.0 || >=21.0.0} cpu: [x64] os: [darwin] - '@img/sharp-libvips-darwin-arm64@1.0.2': - resolution: {integrity: sha512-tcK/41Rq8IKlSaKRCCAuuY3lDJjQnYIW1UXU1kxcEKrfL8WR7N6+rzNoOxoQRJWTAECuKwgAHnPvqXGN8XfkHA==} - engines: {macos: '>=11', npm: '>=9.6.5', pnpm: '>=7.1.0', yarn: '>=3.2.0'} + '@img/sharp-libvips-darwin-arm64@1.0.4': + resolution: {integrity: sha512-XblONe153h0O2zuFfTAbQYAX2JhYmDHeWikp1LM9Hul9gVPjFY427k6dFEcOL72O01QxQsWi761svJ/ev9xEDg==} cpu: [arm64] os: [darwin] - '@img/sharp-libvips-darwin-x64@1.0.2': - resolution: {integrity: sha512-Ofw+7oaWa0HiiMiKWqqaZbaYV3/UGL2wAPeLuJTx+9cXpCRdvQhCLG0IH8YGwM0yGWGLpsF4Su9vM1o6aer+Fw==} - engines: {macos: '>=10.13', npm: '>=9.6.5', pnpm: '>=7.1.0', yarn: '>=3.2.0'} + '@img/sharp-libvips-darwin-x64@1.0.4': + resolution: {integrity: sha512-xnGR8YuZYfJGmWPvmlunFaWJsb9T/AO2ykoP3Fz/0X5XV2aoYBPkX6xqCQvUTKKiLddarLaxpzNe+b1hjeWHAQ==} cpu: [x64] os: [darwin] - '@img/sharp-libvips-linux-arm64@1.0.2': - resolution: {integrity: sha512-x7kCt3N00ofFmmkkdshwj3vGPCnmiDh7Gwnd4nUwZln2YjqPxV1NlTyZOvoDWdKQVDL911487HOueBvrpflagw==} - engines: {glibc: '>=2.26', npm: '>=9.6.5', pnpm: '>=7.1.0', yarn: '>=3.2.0'} + '@img/sharp-libvips-linux-arm64@1.0.4': + resolution: {integrity: sha512-9B+taZ8DlyyqzZQnoeIvDVR/2F4EbMepXMc/NdVbkzsJbzkUjhXv/70GQJ7tdLA4YJgNP25zukcxpX2/SueNrA==} cpu: [arm64] os: [linux] - '@img/sharp-libvips-linux-arm@1.0.2': - resolution: {integrity: sha512-iLWCvrKgeFoglQxdEwzu1eQV04o8YeYGFXtfWU26Zr2wWT3q3MTzC+QTCO3ZQfWd3doKHT4Pm2kRmLbupT+sZw==} - engines: {glibc: '>=2.28', npm: '>=9.6.5', pnpm: '>=7.1.0', yarn: '>=3.2.0'} + '@img/sharp-libvips-linux-arm@1.0.5': + resolution: {integrity: sha512-gvcC4ACAOPRNATg/ov8/MnbxFDJqf/pDePbBnuBDcjsI8PssmjoKMAz4LtLaVi+OnSb5FK/yIOamqDwGmXW32g==} cpu: [arm] os: [linux] - '@img/sharp-libvips-linux-s390x@1.0.2': - resolution: {integrity: sha512-cmhQ1J4qVhfmS6szYW7RT+gLJq9dH2i4maq+qyXayUSn9/3iY2ZeWpbAgSpSVbV2E1JUL2Gg7pwnYQ1h8rQIog==} - engines: {glibc: '>=2.28', npm: '>=9.6.5', pnpm: '>=7.1.0', yarn: '>=3.2.0'} + '@img/sharp-libvips-linux-s390x@1.0.4': + resolution: {integrity: sha512-u7Wz6ntiSSgGSGcjZ55im6uvTrOxSIS8/dgoVMoiGE9I6JAfU50yH5BoDlYA1tcuGS7g/QNtetJnxA6QEsCVTA==} cpu: [s390x] os: [linux] - '@img/sharp-libvips-linux-x64@1.0.2': - resolution: {integrity: sha512-E441q4Qdb+7yuyiADVi5J+44x8ctlrqn8XgkDTwr4qPJzWkaHwD489iZ4nGDgcuya4iMN3ULV6NwbhRZJ9Z7SQ==} - engines: {glibc: '>=2.26', npm: '>=9.6.5', pnpm: '>=7.1.0', yarn: '>=3.2.0'} + '@img/sharp-libvips-linux-x64@1.0.4': + resolution: {integrity: sha512-MmWmQ3iPFZr0Iev+BAgVMb3ZyC4KeFc3jFxnNbEPas60e1cIfevbtuyf9nDGIzOaW9PdnDciJm+wFFaTlj5xYw==} cpu: [x64] os: [linux] - '@img/sharp-libvips-linuxmusl-arm64@1.0.2': - resolution: {integrity: sha512-3CAkndNpYUrlDqkCM5qhksfE+qSIREVpyoeHIU6jd48SJZViAmznoQQLAv4hVXF7xyUB9zf+G++e2v1ABjCbEQ==} - engines: {musl: '>=1.2.2', npm: '>=9.6.5', pnpm: '>=7.1.0', yarn: '>=3.2.0'} + '@img/sharp-libvips-linuxmusl-arm64@1.0.4': + resolution: {integrity: sha512-9Ti+BbTYDcsbp4wfYib8Ctm1ilkugkA/uscUn6UXK1ldpC1JjiXbLfFZtRlBhjPZ5o1NCLiDbg8fhUPKStHoTA==} cpu: [arm64] os: [linux] - '@img/sharp-libvips-linuxmusl-x64@1.0.2': - resolution: {integrity: sha512-VI94Q6khIHqHWNOh6LLdm9s2Ry4zdjWJwH56WoiJU7NTeDwyApdZZ8c+SADC8OH98KWNQXnE01UdJ9CSfZvwZw==} - engines: {musl: '>=1.2.2', npm: '>=9.6.5', pnpm: '>=7.1.0', yarn: '>=3.2.0'} + '@img/sharp-libvips-linuxmusl-x64@1.0.4': + resolution: {integrity: sha512-viYN1KX9m+/hGkJtvYYp+CCLgnJXwiQB39damAO7WMdKWlIhmYTfHjwSbQeUK/20vY154mwezd9HflVFM1wVSw==} cpu: [x64] os: [linux] - '@img/sharp-linux-arm64@0.33.3': - resolution: {integrity: sha512-Zf+sF1jHZJKA6Gor9hoYG2ljr4wo9cY4twaxgFDvlG0Xz9V7sinsPp8pFd1XtlhTzYo0IhDbl3rK7P6MzHpnYA==} - engines: {glibc: '>=2.26', node: ^18.17.0 || ^20.3.0 || >=21.0.0, npm: '>=9.6.5', pnpm: '>=7.1.0', yarn: '>=3.2.0'} + '@img/sharp-linux-arm64@0.33.5': + resolution: {integrity: sha512-JMVv+AMRyGOHtO1RFBiJy/MBsgz0x4AWrT6QoEVVTyh1E39TrCUpTRI7mx9VksGX4awWASxqCYLCV4wBZHAYxA==} + engines: {node: ^18.17.0 || ^20.3.0 || >=21.0.0} cpu: [arm64] os: [linux] - '@img/sharp-linux-arm@0.33.3': - resolution: {integrity: sha512-Q7Ee3fFSC9P7vUSqVEF0zccJsZ8GiiCJYGWDdhEjdlOeS9/jdkyJ6sUSPj+bL8VuOYFSbofrW0t/86ceVhx32w==} - engines: {glibc: '>=2.28', node: ^18.17.0 || ^20.3.0 || >=21.0.0, npm: '>=9.6.5', pnpm: '>=7.1.0', yarn: '>=3.2.0'} + '@img/sharp-linux-arm@0.33.5': + resolution: {integrity: sha512-JTS1eldqZbJxjvKaAkxhZmBqPRGmxgu+qFKSInv8moZ2AmT5Yib3EQ1c6gp493HvrvV8QgdOXdyaIBrhvFhBMQ==} + engines: {node: ^18.17.0 || ^20.3.0 || >=21.0.0} cpu: [arm] os: [linux] - '@img/sharp-linux-s390x@0.33.3': - resolution: {integrity: sha512-vFk441DKRFepjhTEH20oBlFrHcLjPfI8B0pMIxGm3+yilKyYeHEVvrZhYFdqIseSclIqbQ3SnZMwEMWonY5XFA==} - engines: {glibc: '>=2.28', node: ^18.17.0 || ^20.3.0 || >=21.0.0, npm: '>=9.6.5', pnpm: '>=7.1.0', yarn: '>=3.2.0'} + '@img/sharp-linux-s390x@0.33.5': + resolution: {integrity: sha512-y/5PCd+mP4CA/sPDKl2961b+C9d+vPAveS33s6Z3zfASk2j5upL6fXVPZi7ztePZ5CuH+1kW8JtvxgbuXHRa4Q==} + engines: {node: ^18.17.0 || ^20.3.0 || >=21.0.0} cpu: [s390x] os: [linux] - '@img/sharp-linux-x64@0.33.3': - resolution: {integrity: sha512-Q4I++herIJxJi+qmbySd072oDPRkCg/SClLEIDh5IL9h1zjhqjv82H0Seupd+q2m0yOfD+/fJnjSoDFtKiHu2g==} - engines: {glibc: '>=2.26', node: ^18.17.0 || ^20.3.0 || >=21.0.0, npm: '>=9.6.5', pnpm: '>=7.1.0', yarn: '>=3.2.0'} + '@img/sharp-linux-x64@0.33.5': + resolution: {integrity: sha512-opC+Ok5pRNAzuvq1AG0ar+1owsu842/Ab+4qvU879ippJBHvyY5n2mxF1izXqkPYlGuP/M556uh53jRLJmzTWA==} + engines: {node: ^18.17.0 || ^20.3.0 || >=21.0.0} cpu: [x64] os: [linux] - '@img/sharp-linuxmusl-arm64@0.33.3': - resolution: {integrity: sha512-qnDccehRDXadhM9PM5hLvcPRYqyFCBN31kq+ErBSZtZlsAc1U4Z85xf/RXv1qolkdu+ibw64fUDaRdktxTNP9A==} - engines: {musl: '>=1.2.2', node: ^18.17.0 || ^20.3.0 || >=21.0.0, npm: '>=9.6.5', pnpm: '>=7.1.0', yarn: '>=3.2.0'} + '@img/sharp-linuxmusl-arm64@0.33.5': + resolution: {integrity: sha512-XrHMZwGQGvJg2V/oRSUfSAfjfPxO+4DkiRh6p2AFjLQztWUuY/o8Mq0eMQVIY7HJ1CDQUJlxGGZRw1a5bqmd1g==} + engines: {node: ^18.17.0 || ^20.3.0 || >=21.0.0} cpu: [arm64] os: [linux] - '@img/sharp-linuxmusl-x64@0.33.3': - resolution: {integrity: sha512-Jhchim8kHWIU/GZ+9poHMWRcefeaxFIs9EBqf9KtcC14Ojk6qua7ghKiPs0sbeLbLj/2IGBtDcxHyjCdYWkk2w==} - engines: {musl: '>=1.2.2', node: ^18.17.0 || ^20.3.0 || >=21.0.0, npm: '>=9.6.5', pnpm: '>=7.1.0', yarn: '>=3.2.0'} + '@img/sharp-linuxmusl-x64@0.33.5': + resolution: {integrity: sha512-WT+d/cgqKkkKySYmqoZ8y3pxx7lx9vVejxW/W4DOFMYVSkErR+w7mf2u8m/y4+xHe7yY9DAXQMWQhpnMuFfScw==} + engines: {node: ^18.17.0 || ^20.3.0 || >=21.0.0} cpu: [x64] os: [linux] - '@img/sharp-wasm32@0.33.3': - resolution: {integrity: sha512-68zivsdJ0koE96stdUfM+gmyaK/NcoSZK5dV5CAjES0FUXS9lchYt8LAB5rTbM7nlWtxaU/2GON0HVN6/ZYJAQ==} - engines: {node: ^18.17.0 || ^20.3.0 || >=21.0.0, npm: '>=9.6.5', pnpm: '>=7.1.0', yarn: '>=3.2.0'} + '@img/sharp-wasm32@0.33.5': + resolution: {integrity: sha512-ykUW4LVGaMcU9lu9thv85CbRMAwfeadCJHRsg2GmeRa/cJxsVY9Rbd57JcMxBkKHag5U/x7TSBpScF4U8ElVzg==} + engines: {node: ^18.17.0 || ^20.3.0 || >=21.0.0} cpu: [wasm32] - '@img/sharp-win32-ia32@0.33.3': - resolution: {integrity: sha512-CyimAduT2whQD8ER4Ux7exKrtfoaUiVr7HG0zZvO0XTFn2idUWljjxv58GxNTkFb8/J9Ub9AqITGkJD6ZginxQ==} - engines: {node: ^18.17.0 || ^20.3.0 || >=21.0.0, npm: '>=9.6.5', pnpm: '>=7.1.0', yarn: '>=3.2.0'} + '@img/sharp-win32-ia32@0.33.5': + resolution: {integrity: sha512-T36PblLaTwuVJ/zw/LaH0PdZkRz5rd3SmMHX8GSmR7vtNSP5Z6bQkExdSK7xGWyxLw4sUknBuugTelgw2faBbQ==} + engines: {node: ^18.17.0 || ^20.3.0 || >=21.0.0} cpu: [ia32] os: [win32] - '@img/sharp-win32-x64@0.33.3': - resolution: {integrity: sha512-viT4fUIDKnli3IfOephGnolMzhz5VaTvDRkYqtZxOMIoMQ4MrAziO7pT1nVnOt2FAm7qW5aa+CCc13aEY6Le0g==} - engines: {node: ^18.17.0 || ^20.3.0 || >=21.0.0, npm: '>=9.6.5', pnpm: '>=7.1.0', yarn: '>=3.2.0'} + '@img/sharp-win32-x64@0.33.5': + resolution: {integrity: sha512-MpY/o8/8kj+EcnxwvrP4aTJSWw/aZ7JIGR4aBeZkZw5B7/Jn+tY9/VNwtcoGmdT7GfggGIU4kygOMSbYnOrAbg==} + engines: {node: ^18.17.0 || ^20.3.0 || >=21.0.0} cpu: [x64] os: [win32] @@ -3977,7 +4022,7 @@ packages: resolution: {integrity: sha512-dc38W4W3K42atE9nSaOeoJ7/x9wGIfawdwC/UmMxMLlZ1iSsITQ8dQJaTATCbn98YvYPINK/EH541YA5enQIPQ==} engines: {node: '>=12.0.0'} peerDependencies: - '@types/react': 18.3.3 + '@types/react': ^18.3.4 react: ^17.0.0 || ^18.0.0 react-dom: ^17.0.0 || ^18.0.0 peerDependenciesMeta: @@ -3988,7 +4033,7 @@ packages: resolution: {integrity: sha512-+uNbP3OHJuZVI00WyMg7xfLZotaEY7LgvYXDfONVJbrS+K9wyjCIPNfjy8r9XJn4fbHo/5ibiZqjWnU9LMNv+A==} engines: {node: '>=12.0.0'} peerDependencies: - '@types/react': 18.3.3 + '@types/react': ^18.3.4 react: ^17.0.0 || ^18.0.0 react-dom: ^17.0.0 || ^18.0.0 peerDependenciesMeta: @@ -3999,7 +4044,7 @@ packages: resolution: {integrity: sha512-I/lGHztkCzvwlXpjD2+SNmvNQvB4227xBXhISPjEaJUXGImOQ9f3D2Yj/T3KasSI/h0MLWy74X0J6clhPmsRbQ==} engines: {node: '>=12.0.0'} peerDependencies: - '@types/react': 18.3.3 + '@types/react': ^18.3.4 react: ^17.0.0 || ^18.0.0 react-dom: ^17.0.0 || ^18.0.0 peerDependenciesMeta: @@ -4015,7 +4060,7 @@ packages: peerDependencies: '@emotion/react': ^11.5.0 '@emotion/styled': ^11.3.0 - '@types/react': 18.3.3 + '@types/react': ^18.3.4 react: ^17.0.0 || ^18.0.0 react-dom: ^17.0.0 || ^18.0.0 peerDependenciesMeta: @@ -4033,7 +4078,7 @@ packages: '@emotion/react': ^11.5.0 '@emotion/styled': ^11.3.0 '@mui/material': '>=5.15.0' - '@types/react': 18.3.3 + '@types/react': ^18.3.4 react: ^17.0.0 || ^18.0.0 react-dom: ^17.0.0 || ^18.0.0 peerDependenciesMeta: @@ -4050,7 +4095,7 @@ packages: peerDependencies: '@emotion/react': ^11.5.0 '@emotion/styled': ^11.3.0 - '@types/react': 18.3.3 + '@types/react': ^18.3.4 react: ^17.0.0 || ^18.0.0 react-dom: ^17.0.0 || ^18.0.0 peerDependenciesMeta: @@ -4065,7 +4110,7 @@ packages: resolution: {integrity: sha512-CSLg0YkpDqg0aXOxtjo3oTMd3XWMxvNb5d0v4AYVqwOltU8q6GvnZjhWyCLjGSCrcgfwm6/VDjaKLPlR14wxIA==} engines: {node: '>=12.0.0'} peerDependencies: - '@types/react': 18.3.3 + '@types/react': ^18.3.4 react: ^17.0.0 || ^18.0.0 peerDependenciesMeta: '@types/react': @@ -4075,7 +4120,7 @@ packages: resolution: {integrity: sha512-zRdwVf8RpuM0MEqMveoJ0sV48eMWvutkcY/pt9nX21jXD9kaxOCuQyT6oNrXF7ZlBDOi/NXfKRDgkQfj+kwxDQ==} engines: {node: '>=12.0.0'} peerDependencies: - '@types/react': 18.3.3 + '@types/react': ^18.3.4 react: ^17.0.0 || ^18.0.0 peerDependenciesMeta: '@types/react': @@ -4113,7 +4158,7 @@ packages: peerDependencies: '@emotion/react': ^11.5.0 '@emotion/styled': ^11.3.0 - '@types/react': 18.3.3 + '@types/react': ^18.3.4 react: ^17.0.0 || ^18.0.0 peerDependenciesMeta: '@emotion/react': @@ -4129,7 +4174,7 @@ packages: peerDependencies: '@emotion/react': ^11.5.0 '@emotion/styled': ^11.3.0 - '@types/react': 18.3.3 + '@types/react': ^18.3.4 react: ^17.0.0 || ^18.0.0 peerDependenciesMeta: '@emotion/react': @@ -4142,37 +4187,27 @@ packages: '@mui/types@7.2.15': resolution: {integrity: sha512-nbo7yPhtKJkdf9kcVOF8JZHPZTmqXjJ/tI0bdWgHg5tp9AnIN4Y7f7wm9T+0SyGYJk76+GYZ8Q5XaTYAsUHN0Q==} peerDependencies: - '@types/react': 18.3.3 - peerDependenciesMeta: - '@types/react': - optional: true - - '@mui/utils@5.16.5': - resolution: {integrity: sha512-CwhcA9y44XwK7k2joL3Y29mRUnoBt+gOZZdGyw7YihbEwEErJYBtDwbZwVgH68zAljGe/b+Kd5bzfl63Gi3R2A==} - engines: {node: '>=12.0.0'} - peerDependencies: - '@types/react': 18.3.3 - react: ^17.0.0 || ^18.0.0 + '@types/react': ^18.3.4 peerDependenciesMeta: '@types/react': optional: true - '@mui/utils@6.0.0-beta.5': - resolution: {integrity: sha512-QidRa70STALSsTTeeJ7ddyyVbEAK3cVOK350L8tAJLzag79XzNE+lSpU4+UnIna9ftuI9sIJHVxZK6wVw7ATug==} + '@mui/utils@5.16.6': + resolution: {integrity: sha512-tWiQqlhxAt3KENNiSRL+DIn9H5xNVK6Jjf70x3PnfQPz1MPBdh7yyIcAyVBT9xiw7hP3SomRhPR7hzBMBCjqEA==} engines: {node: '>=12.0.0'} peerDependencies: - '@types/react': 18.3.3 + '@types/react': ^18.3.4 react: ^17.0.0 || ^18.0.0 peerDependenciesMeta: '@types/react': optional: true - '@mui/utils@6.0.0-dev.20240529-082515-213b5e33ab': - resolution: {integrity: sha512-jyNcB0drDhYcoq5MHNTiEc63GfVE1GZK+CVUd8tlLzk5q631RPYJ5jONSOszLiUOXBmI8Uu1SBJUwrG3j2YG2A==} - engines: {node: '>=12.0.0'} + '@mui/utils@6.0.0-rc.0': + resolution: {integrity: sha512-tBp0ILEXDL0bbDDT8PnZOjCqSm5Dfk2N0Z45uzRw+wVl6fVvloC9zw8avl+OdX1Bg3ubs/ttKn8nRNv17bpM5A==} + engines: {node: '>=14.0.0'} peerDependencies: - '@types/react': 18.3.3 - react: ^17.0.0 || ^18.0.0 + '@types/react': ^18.3.4 + react: ^17.0.0 || ^18.0.0 || ^19.0.0 peerDependenciesMeta: '@types/react': optional: true @@ -4369,62 +4404,119 @@ packages: resolution: {integrity: sha512-2KYkyluThg1AKfd0JWI7FzpS4A/fzVVGYIf6AM4ydWyNj8eI/86GQVLeRgDoH7CNOxt243R5tutWlmHpVq0/Ew==} engines: {node: '>=18.0.0'} - '@next/env@14.2.5': - resolution: {integrity: sha512-/zZGkrTOsraVfYjGP8uM0p6r0BDT6xWpkjdVbcz66PJVSpwXX3yNiRycxAuDfBKGWBrZBXRuK/YVlkNgxHGwmA==} + '@next/env@14.2.8': + resolution: {integrity: sha512-L44a+ynqkolyNBnYfF8VoCiSrjSZWgEHYKkKLGcs/a80qh7AkfVUD/MduVPgdsWZ31tgROR+yJRA0PZjSVBXWQ==} - '@next/eslint-plugin-next@14.2.5': - resolution: {integrity: sha512-LY3btOpPh+OTIpviNojDpUdIbHW9j0JBYBjsIp8IxtDFfYFyORvw3yNq6N231FVqQA7n7lwaf7xHbVJlA1ED7g==} + '@next/env@14.2.9': + resolution: {integrity: sha512-hnDAoDPMii31V0ivibI8p6b023jOF1XblWTVjsDUoZKwnZlaBtJFZKDwFqi22R8r9i6W08dThUWU7Bsh2Rg8Ww==} + + '@next/eslint-plugin-next@14.2.8': + resolution: {integrity: sha512-ue5vcq9Fjk3asACRDrzYjcGMEN7pMMDQ5zUD+FenkqvlPCVUD1x7PxBNOLfPYDZOrk/Vnl4GHmjj2mZDqPW8TQ==} + + '@next/swc-darwin-arm64@14.2.8': + resolution: {integrity: sha512-1VrQlG8OzdyvvGZhGJFnaNE2P10Jjy/2FopnqbY0nSa/gr8If3iINxvOEW3cmVeoAYkmW0RsBazQecA2dBFOSw==} + engines: {node: '>= 10'} + cpu: [arm64] + os: [darwin] - '@next/swc-darwin-arm64@14.2.5': - resolution: {integrity: sha512-/9zVxJ+K9lrzSGli1///ujyRfon/ZneeZ+v4ptpiPoOU+GKZnm8Wj8ELWU1Pm7GHltYRBklmXMTUqM/DqQ99FQ==} + '@next/swc-darwin-arm64@14.2.9': + resolution: {integrity: sha512-/kfQifl3uLYi3DlwFlzCkgxe6fprJNLzzTUFknq3M5wGYicDIbdGlxUl6oHpVLJpBB/CBY3Y//gO6alz/K4NWA==} engines: {node: '>= 10'} cpu: [arm64] os: [darwin] - '@next/swc-darwin-x64@14.2.5': - resolution: {integrity: sha512-vXHOPCwfDe9qLDuq7U1OYM2wUY+KQ4Ex6ozwsKxp26BlJ6XXbHleOUldenM67JRyBfVjv371oneEvYd3H2gNSA==} + '@next/swc-darwin-x64@14.2.8': + resolution: {integrity: sha512-87t3I86rNRSOJB1gXIUzaQWWSWrkWPDyZGsR0Z7JAPtLeX3uUOW2fHxl7dNWD2BZvbvftctTQjgtfpp7nMtmWg==} + engines: {node: '>= 10'} + cpu: [x64] + os: [darwin] + + '@next/swc-darwin-x64@14.2.9': + resolution: {integrity: sha512-tK/RyhCmOCiXQ9IVdFrBbZOf4/1+0RSuJkebXU2uMEsusS51TjIJO4l8ZmEijH9gZa0pJClvmApRHi7JuBqsRw==} engines: {node: '>= 10'} cpu: [x64] os: [darwin] - '@next/swc-linux-arm64-gnu@14.2.5': - resolution: {integrity: sha512-vlhB8wI+lj8q1ExFW8lbWutA4M2ZazQNvMWuEDqZcuJJc78iUnLdPPunBPX8rC4IgT6lIx/adB+Cwrl99MzNaA==} + '@next/swc-linux-arm64-gnu@14.2.8': + resolution: {integrity: sha512-ta2sfVzbOpTbgBrF9HM5m+U58dv6QPuwU4n5EX4LLyCJGKc433Z0D9h9gay/HSOjLEXJ2fJYrMP5JYYbHdxhtw==} + engines: {node: '>= 10'} + cpu: [arm64] + os: [linux] + + '@next/swc-linux-arm64-gnu@14.2.9': + resolution: {integrity: sha512-tS5eqwsp2nO7mzywRUuFYmefNZsUKM/mTG3exK2jIHv9TEVklE1SByB1KMhFkqlit1PxS9YK1tV8BOV90Wpbrw==} + engines: {node: '>= 10'} + cpu: [arm64] + os: [linux] + + '@next/swc-linux-arm64-musl@14.2.8': + resolution: {integrity: sha512-+IoLTPK6Z5uIgDhgeWnQF5/o5GBN7+zyUNrs4Bes1W3g9++YELb8y0unFybS8s87ntAKMDl6jeQ+mD7oNwp/Ng==} engines: {node: '>= 10'} cpu: [arm64] os: [linux] - '@next/swc-linux-arm64-musl@14.2.5': - resolution: {integrity: sha512-NpDB9NUR2t0hXzJJwQSGu1IAOYybsfeB+LxpGsXrRIb7QOrYmidJz3shzY8cM6+rO4Aojuef0N/PEaX18pi9OA==} + '@next/swc-linux-arm64-musl@14.2.9': + resolution: {integrity: sha512-8svpeTFNAMTUMKQbEzE8qRAwl9o7mNBv7LR1bmSkQvo1oy4WrNyZbhWsldOiKrc4mZ5dfQkGYsI9T75mIFMfeA==} engines: {node: '>= 10'} cpu: [arm64] os: [linux] - '@next/swc-linux-x64-gnu@14.2.5': - resolution: {integrity: sha512-8XFikMSxWleYNryWIjiCX+gU201YS+erTUidKdyOVYi5qUQo/gRxv/3N1oZFCgqpesN6FPeqGM72Zve+nReVXQ==} + '@next/swc-linux-x64-gnu@14.2.8': + resolution: {integrity: sha512-pO+hVXC+mvzUOQJJRG4RX4wJsRJ5BkURSf6dD6EjUXAX4Ml9es1WsEfkaZ4lcpmFzFvY47IkDaffks/GdCn9ag==} + engines: {node: '>= 10'} + cpu: [x64] + os: [linux] + + '@next/swc-linux-x64-gnu@14.2.9': + resolution: {integrity: sha512-0HNulLWpKTB7H5BhHCkEhcRAnWUHeAYCftrrGw3QC18+ZywTdAoPv/zEqKy/0adqt+ks4JDdlgSQ1lNKOKjo0A==} + engines: {node: '>= 10'} + cpu: [x64] + os: [linux] + + '@next/swc-linux-x64-musl@14.2.8': + resolution: {integrity: sha512-bCat9izctychCtf3uL1nqHq31N5e1VxvdyNcBQflkudPMLbxVnlrw45Vi87K+lt1CwrtVayHqzo4ie0Szcpwzg==} engines: {node: '>= 10'} cpu: [x64] os: [linux] - '@next/swc-linux-x64-musl@14.2.5': - resolution: {integrity: sha512-6QLwi7RaYiQDcRDSU/os40r5o06b5ue7Jsk5JgdRBGGp8l37RZEh9JsLSM8QF0YDsgcosSeHjglgqi25+m04IQ==} + '@next/swc-linux-x64-musl@14.2.9': + resolution: {integrity: sha512-hhVFViPHLAVUJRNtwwm609p9ozWajOmRvzOZzzKXgiVGwx/CALxlMUeh+M+e0Zj6orENhWLZeilOPHpptuENsA==} engines: {node: '>= 10'} cpu: [x64] os: [linux] - '@next/swc-win32-arm64-msvc@14.2.5': - resolution: {integrity: sha512-1GpG2VhbspO+aYoMOQPQiqc/tG3LzmsdBH0LhnDS3JrtDx2QmzXe0B6mSZZiN3Bq7IOMXxv1nlsjzoS1+9mzZw==} + '@next/swc-win32-arm64-msvc@14.2.8': + resolution: {integrity: sha512-gbxfUaSPV7EyUobpavida2Hwi62GhSJaSg7iBjmBWoxkxlmETOD7U4tWt763cGIsyE6jM7IoNavq0BXqwdW2QA==} + engines: {node: '>= 10'} + cpu: [arm64] + os: [win32] + + '@next/swc-win32-arm64-msvc@14.2.9': + resolution: {integrity: sha512-p/v6XlOdrk06xfN9z4evLNBqftVQUWiyduQczCwSj7hNh8fWTbzdVxsEiNOcajMXJbQiaX/ZzZdFgKVmmJnnGQ==} engines: {node: '>= 10'} cpu: [arm64] os: [win32] - '@next/swc-win32-ia32-msvc@14.2.5': - resolution: {integrity: sha512-Igh9ZlxwvCDsu6438FXlQTHlRno4gFpJzqPjSIBZooD22tKeI4fE/YMRoHVJHmrQ2P5YL1DoZ0qaOKkbeFWeMg==} + '@next/swc-win32-ia32-msvc@14.2.8': + resolution: {integrity: sha512-PUXzEzjTTlUh3b5VAn1nlpwvujTnuCMMwbiCnaTazoVlN1nA3kWjlmp42IfURA2N/nyrlVEw7pURa/o4Qxj1cw==} + engines: {node: '>= 10'} + cpu: [ia32] + os: [win32] + + '@next/swc-win32-ia32-msvc@14.2.9': + resolution: {integrity: sha512-IcW9dynWDjMK/0M05E3zopbRen7v0/yEaMZbHFOSS1J/w+8YG3jKywOGZWNp/eCUVtUUXs0PW+7Lpz8uLu+KQA==} engines: {node: '>= 10'} cpu: [ia32] os: [win32] - '@next/swc-win32-x64-msvc@14.2.5': - resolution: {integrity: sha512-tEQ7oinq1/CjSG9uSTerca3v4AZ+dFa+4Yu6ihaG8Ud8ddqLQgFGcnwYls13H5X5CPDPZJdYxyeMui6muOLd4g==} + '@next/swc-win32-x64-msvc@14.2.8': + resolution: {integrity: sha512-EnPKv0ttq02E9/1KZ/8Dn7kuutv6hy1CKc0HlNcvzOQcm4/SQtvfws5gY0zrG9tuupd3HfC2L/zcTrnBhpjTuQ==} + engines: {node: '>= 10'} + cpu: [x64] + os: [win32] + + '@next/swc-win32-x64-msvc@14.2.9': + resolution: {integrity: sha512-gcbpoXyWZdVOBgNa5BRzynrL5UR1nb2ZT38yKgnphYU9UHjeecnylMHntrQiMg/QtONDcJPFC/PmsS47xIRYoA==} engines: {node: '>= 10'} cpu: [x64] os: [win32] @@ -4505,8 +4597,8 @@ packages: '@nrwl/devkit@17.2.8': resolution: {integrity: sha512-l2dFy5LkWqSA45s6pee6CoqJeluH+sjRdVnAAQfjLHRNSx6mFAKblyzq5h1f4P0EUCVVVqLs+kVqmNx5zxYqvw==} - '@nrwl/tao@19.6.0': - resolution: {integrity: sha512-DlFtKjPtOv401XnRjnIxMaaKUcdyGulCINmQGlrnqJuUA7ABr2uFSuOqOFJS6uGA1QFa+vKU1GhxhefUiTHOaw==} + '@nrwl/tao@19.7.0': + resolution: {integrity: sha512-Y7LwFAq6U38U486eL9L1G6D32Z2e+f6bJRqhbAqX7j4eAHPv0ALpQuum5uGms2yywL25qwXZPKWtAHi6nbC6Ag==} hasBin: true '@nx/devkit@17.2.8': @@ -4514,62 +4606,62 @@ packages: peerDependencies: nx: '>= 16 <= 18' - '@nx/nx-darwin-arm64@19.6.0': - resolution: {integrity: sha512-8dudAe2HBRwp2P5AxhjinoVqXH5hueZ8bpjNJ2DquBr4dm/ZE62dSoSqURDg/ZnY/XmivByHiyklkDLaXxdkig==} + '@nx/nx-darwin-arm64@19.7.0': + resolution: {integrity: sha512-xlgTO3QZVM+DnKM5j3vZrXqKqFkf9XPDLnh+LtMx6GKjkVdnz2TCDo/wwwBB2IjBE+nSK3Fvl15CmWLnI2GGWg==} engines: {node: '>= 10'} cpu: [arm64] os: [darwin] - '@nx/nx-darwin-x64@19.6.0': - resolution: {integrity: sha512-dGvh0sTFTSN387yEAEGUQIVPAX/I2OwiukcZOns704aKr9yzNpwWWgnhlutvkCFj9A+I3lUJLmt8eHehLDhprg==} + '@nx/nx-darwin-x64@19.7.0': + resolution: {integrity: sha512-tDT5Dk65+F+KWIybhT1IU5i+uBdlS3pa3SPvPIEvW0sJ+vgugCxDN7iKlrJgYdxYFDx9g+WHRRguLe9gKpVA2Q==} engines: {node: '>= 10'} cpu: [x64] os: [darwin] - '@nx/nx-freebsd-x64@19.6.0': - resolution: {integrity: sha512-sGISTXQz7rH+C2xiGn2MtSI+1qAw/JGxFfqDwhZYTUzP9Yx+0tnUwDCbUt0PJ7d1nnxVY2X6osPcoDsgcShAvg==} + '@nx/nx-freebsd-x64@19.7.0': + resolution: {integrity: sha512-7dg7zMQ56F53Fw107dMmNcnD5SPW+gd2aJAkE9hrG0byz9oC5TpXNDpL0/eUSrrAESqF7xYclpfCzLzkMN2Iaw==} engines: {node: '>= 10'} cpu: [x64] os: [freebsd] - '@nx/nx-linux-arm-gnueabihf@19.6.0': - resolution: {integrity: sha512-rhdpenJOuxQd5gEh5klIsuR2Dsavz2HOYQhxdsP5Yi/L8NSu6wFJO/D+e1YOlQ620NeKIgb5C5eY9BPrcAyLVg==} + '@nx/nx-linux-arm-gnueabihf@19.7.0': + resolution: {integrity: sha512-Qc315NapRWvlasVWsncV1v4f6hL+QLHxM/8WPMbkvKNCdOjiaFgNFfjrFMbzevGqAIx3X5X5T6XKXHRblDPwXw==} engines: {node: '>= 10'} cpu: [arm] os: [linux] - '@nx/nx-linux-arm64-gnu@19.6.0': - resolution: {integrity: sha512-cNQ2Gg+kPOGMAghFxox65sPWq+7qRxmLQVdmZIbcUvnng8zI8yaD2VCNNKfBAooAVNlFhTNAlK9JBhi00KPz+A==} + '@nx/nx-linux-arm64-gnu@19.7.0': + resolution: {integrity: sha512-nyxVymloy6DrSAIJDVBf3PkOoz4lXzZxj1AHgj4zdETllY/T2WXODzzy4PyN0sqF5ljX68FODVXbxpkIcS0EQQ==} engines: {node: '>= 10'} cpu: [arm64] os: [linux] - '@nx/nx-linux-arm64-musl@19.6.0': - resolution: {integrity: sha512-8vo/NYua0AlIapLEQxI5HUKooQrWoXOKOV0vDb3IDsOF3PWna8jjTrYim2+HbXiPIynh+R+dAaS+aG6kK07uOA==} + '@nx/nx-linux-arm64-musl@19.7.0': + resolution: {integrity: sha512-BN/mwZGaVgcHJhuGbu1W6EcFPbtDc8pY0cTIYkqKLzHlFfWLdRvLLJVeUGmc9ubvU3lqQLWX/lRi6Nd8RZINjg==} engines: {node: '>= 10'} cpu: [arm64] os: [linux] - '@nx/nx-linux-x64-gnu@19.6.0': - resolution: {integrity: sha512-8PPYt63WjvvwY45EE71HczMkhuUSTWeM+RnwaN/Mr6/PiAuIAhNlqeROyAq0v6+ixNumNPuTt8ao1cmSt3PQ5A==} + '@nx/nx-linux-x64-gnu@19.7.0': + resolution: {integrity: sha512-ATcIPJdLQRYIMmbMQzbZzYVEo/unmSVq+9+/fah3okv+/5je+/tJcnf777WS4qP6ysBv2InE+wk2F/g6TNpJvg==} engines: {node: '>= 10'} cpu: [x64] os: [linux] - '@nx/nx-linux-x64-musl@19.6.0': - resolution: {integrity: sha512-0Scr/6Ipuj9RLpCZF37xriNzmL84XAWQcuH1a+oDGGLwF3xWBuxCDwyANNOzD7B+KSqwqUjq67Pg4L5jJMD8+w==} + '@nx/nx-linux-x64-musl@19.7.0': + resolution: {integrity: sha512-IwP5Are8N2nBWnPygA0AS8xRl7+Wn3oTBkIPESjWs5WzfyMGTlVL/R2/8GB1hc8fdr2dd+3R7LuMZpZ/d1G7xg==} engines: {node: '>= 10'} cpu: [x64] os: [linux] - '@nx/nx-win32-arm64-msvc@19.6.0': - resolution: {integrity: sha512-dDXJfEbJs9g17NzZlfKBF67YxhlBMXkIMYBDqhY2HhX6aE8nWhG9l2D3PN6izySXzY29jfwsJaU/tmakDPKXDg==} + '@nx/nx-win32-arm64-msvc@19.7.0': + resolution: {integrity: sha512-+8EfLC760GzaZ4wvcWdYnoO1kw4xOrVnBTuijgkZeTPvBPPrKOi7y2bv9tG2LklE5GTt8mkmxCSEkQfSxsGIhw==} engines: {node: '>= 10'} cpu: [arm64] os: [win32] - '@nx/nx-win32-x64-msvc@19.6.0': - resolution: {integrity: sha512-sU2LD8qSO+4pZ7glrnuDabfpmOSog3VIBf9L+bLAHNFaVa8Ut3FE3O2P7FjrZ1eA3veEJcGfKFsCqPGiKFp57w==} + '@nx/nx-win32-x64-msvc@19.7.0': + resolution: {integrity: sha512-h6d3zBSjhJlGxjBXKGgLqrgxMrkobdyU5KO0zjrQ3+PWrdrtw4jrIhKxW3KoFOzjbDPMmwNH/Bd7aYwZ/RMlEw==} engines: {node: '>= 10'} cpu: [x64] os: [win32] @@ -4733,21 +4825,21 @@ packages: resolution: {integrity: sha512-I/s6F7yKUDdtMsoBWXJe8Qz40Tui5vsuKCWJEWVL+5q9sSWRzzx6v2KeNsOBEwd94j0eWkpWCH4yB6rZg9Mf0w==} engines: {node: '>=8.0.0'} - '@pigment-css/nextjs-plugin@0.0.20': - resolution: {integrity: sha512-KOyhDfGqCNVfbKOG6fjzk42Kp1fVzMjypEc97j1Irju0/h3mYRfagrwTVX1AgVEVQUsQIGfZ6BNVd1Jf2y6osg==} + '@pigment-css/nextjs-plugin@0.0.22': + resolution: {integrity: sha512-Hqu07TqistwBIt5DftRaT9nOz5P/O9Upeh+8zOk8bAgOuzVQUMs4KxYx3oS4u0xpzK1yZ46MiNS6Hspuk2BVww==} peerDependencies: next: ^12.0.0 || ^13.0.0 || ^14.0.0 - '@pigment-css/react@0.0.20': - resolution: {integrity: sha512-ctp4qV7iX51T9F1XKD86NccR1Odly8wQqm3JjFAboOXKvlZBkiJqXlDe9HIwKFI3z/MxHzu+TCYyexgceOK1cg==} + '@pigment-css/react@0.0.22': + resolution: {integrity: sha512-LFEWfBmI+gA1nQ9htDLSTuKhMbmQW+A/18wLZmx8kHqOTtGN6sSggBsduA0hrJO4ghdU6T/5QkwC3OlHccQ2Iw==} peerDependencies: react: ^17.0.0 || ^18.0.0 - '@pigment-css/unplugin@0.0.20': - resolution: {integrity: sha512-hLECqhjSIjw7meNllVxobtDIObOuKGLxhZESSq5qpCqDwFMvApCgpSJKRxs8uY7EVBa1NuVhgK/Yn3JR5GNEKw==} + '@pigment-css/unplugin@0.0.22': + resolution: {integrity: sha512-DeEv6h70YrRYqCIcYR2djpKhbZHQuaeU+kljrBO9R/gAoTHZvDNJ/pkGBpeYMzfJzqH22AiYQyZbOiK70vQa7w==} - '@pigment-css/vite-plugin@0.0.20': - resolution: {integrity: sha512-OvOPOTlZMkpkheAzXctdfW0t48xA+s0QMpGtMLiiFIGNPHhK1+UTBv9/B2wocpMMojNi13nH0p2J7lKaaT2kUw==} + '@pigment-css/vite-plugin@0.0.22': + resolution: {integrity: sha512-sNQRuOnSgF7VDmTW99hlGhbAUipayxVr2HCj4S2lP9zyzQaI4dNi5IWvXc483cRRT6wG0Hvkv/VUDQ/Q37zyYw==} peerDependencies: vite: ^4.0.0 || ^5.0.0 @@ -4943,68 +5035,101 @@ packages: resolution: {integrity: sha512-S45oynt/WH19bHbIXjtli6QmwNYvaz+vtnubvNpNDvUOoA/OWh6j1OikIP3G+v5GHdxyC6EXoChG3HgYGEUfcg==} engines: {node: '>=14.0.0'} - '@rollup/rollup-android-arm-eabi@4.13.0': - resolution: {integrity: sha512-5ZYPOuaAqEH/W3gYsRkxQATBW3Ii1MfaT4EQstTnLKViLi2gLSQmlmtTpGucNP3sXEpOiI5tdGhjdE111ekyEg==} + '@rollup/plugin-inject@5.0.5': + resolution: {integrity: sha512-2+DEJbNBoPROPkgTDNe8/1YXWcqxbN5DTjASVIOx8HS+pITXushyNiBV56RB08zuptzz8gT3YfkqriTBVycepg==} + engines: {node: '>=14.0.0'} + peerDependencies: + rollup: ^1.20.0||^2.0.0||^3.0.0||^4.0.0 + peerDependenciesMeta: + rollup: + optional: true + + '@rollup/pluginutils@5.1.0': + resolution: {integrity: sha512-XTIWOPPcpvyKI6L1NHo0lFlCyznUEyPmPY1mc3KpPVDYulHSTvyeLNVW00QTLIAFNhR3kYnJTQHeGqU4M3n09g==} + engines: {node: '>=14.0.0'} + peerDependencies: + rollup: ^1.20.0||^2.0.0||^3.0.0||^4.0.0 + peerDependenciesMeta: + rollup: + optional: true + + '@rollup/rollup-android-arm-eabi@4.21.1': + resolution: {integrity: sha512-2thheikVEuU7ZxFXubPDOtspKn1x0yqaYQwvALVtEcvFhMifPADBrgRPyHV0TF3b+9BgvgjgagVyvA/UqPZHmg==} cpu: [arm] os: [android] - '@rollup/rollup-android-arm64@4.13.0': - resolution: {integrity: sha512-BSbaCmn8ZadK3UAQdlauSvtaJjhlDEjS5hEVVIN3A4bbl3X+otyf/kOJV08bYiRxfejP3DXFzO2jz3G20107+Q==} + '@rollup/rollup-android-arm64@4.21.1': + resolution: {integrity: sha512-t1lLYn4V9WgnIFHXy1d2Di/7gyzBWS8G5pQSXdZqfrdCGTwi1VasRMSS81DTYb+avDs/Zz4A6dzERki5oRYz1g==} cpu: [arm64] os: [android] - '@rollup/rollup-darwin-arm64@4.13.0': - resolution: {integrity: sha512-Ovf2evVaP6sW5Ut0GHyUSOqA6tVKfrTHddtmxGQc1CTQa1Cw3/KMCDEEICZBbyppcwnhMwcDce9ZRxdWRpVd6g==} + '@rollup/rollup-darwin-arm64@4.21.1': + resolution: {integrity: sha512-AH/wNWSEEHvs6t4iJ3RANxW5ZCK3fUnmf0gyMxWCesY1AlUj8jY7GC+rQE4wd3gwmZ9XDOpL0kcFnCjtN7FXlA==} cpu: [arm64] os: [darwin] - '@rollup/rollup-darwin-x64@4.13.0': - resolution: {integrity: sha512-U+Jcxm89UTK592vZ2J9st9ajRv/hrwHdnvyuJpa5A2ngGSVHypigidkQJP+YiGL6JODiUeMzkqQzbCG3At81Gg==} + '@rollup/rollup-darwin-x64@4.21.1': + resolution: {integrity: sha512-dO0BIz/+5ZdkLZrVgQrDdW7m2RkrLwYTh2YMFG9IpBtlC1x1NPNSXkfczhZieOlOLEqgXOFH3wYHB7PmBtf+Bg==} cpu: [x64] os: [darwin] - '@rollup/rollup-linux-arm-gnueabihf@4.13.0': - resolution: {integrity: sha512-8wZidaUJUTIR5T4vRS22VkSMOVooG0F4N+JSwQXWSRiC6yfEsFMLTYRFHvby5mFFuExHa/yAp9juSphQQJAijQ==} + '@rollup/rollup-linux-arm-gnueabihf@4.21.1': + resolution: {integrity: sha512-sWWgdQ1fq+XKrlda8PsMCfut8caFwZBmhYeoehJ05FdI0YZXk6ZyUjWLrIgbR/VgiGycrFKMMgp7eJ69HOF2pQ==} + cpu: [arm] + os: [linux] + + '@rollup/rollup-linux-arm-musleabihf@4.21.1': + resolution: {integrity: sha512-9OIiSuj5EsYQlmwhmFRA0LRO0dRRjdCVZA3hnmZe1rEwRk11Jy3ECGGq3a7RrVEZ0/pCsYWx8jG3IvcrJ6RCew==} cpu: [arm] os: [linux] - '@rollup/rollup-linux-arm64-gnu@4.13.0': - resolution: {integrity: sha512-Iu0Kno1vrD7zHQDxOmvweqLkAzjxEVqNhUIXBsZ8hu8Oak7/5VTPrxOEZXYC1nmrBVJp0ZcL2E7lSuuOVaE3+w==} + '@rollup/rollup-linux-arm64-gnu@4.21.1': + resolution: {integrity: sha512-0kuAkRK4MeIUbzQYu63NrJmfoUVicajoRAL1bpwdYIYRcs57iyIV9NLcuyDyDXE2GiZCL4uhKSYAnyWpjZkWow==} cpu: [arm64] os: [linux] - '@rollup/rollup-linux-arm64-musl@4.13.0': - resolution: {integrity: sha512-C31QrW47llgVyrRjIwiOwsHFcaIwmkKi3PCroQY5aVq4H0A5v/vVVAtFsI1nfBngtoRpeREvZOkIhmRwUKkAdw==} + '@rollup/rollup-linux-arm64-musl@4.21.1': + resolution: {integrity: sha512-/6dYC9fZtfEY0vozpc5bx1RP4VrtEOhNQGb0HwvYNwXD1BBbwQ5cKIbUVVU7G2d5WRE90NfB922elN8ASXAJEA==} cpu: [arm64] os: [linux] - '@rollup/rollup-linux-riscv64-gnu@4.13.0': - resolution: {integrity: sha512-Oq90dtMHvthFOPMl7pt7KmxzX7E71AfyIhh+cPhLY9oko97Zf2C9tt/XJD4RgxhaGeAraAXDtqxvKE1y/j35lA==} + '@rollup/rollup-linux-powerpc64le-gnu@4.21.1': + resolution: {integrity: sha512-ltUWy+sHeAh3YZ91NUsV4Xg3uBXAlscQe8ZOXRCVAKLsivGuJsrkawYPUEyCV3DYa9urgJugMLn8Z3Z/6CeyRQ==} + cpu: [ppc64] + os: [linux] + + '@rollup/rollup-linux-riscv64-gnu@4.21.1': + resolution: {integrity: sha512-BggMndzI7Tlv4/abrgLwa/dxNEMn2gC61DCLrTzw8LkpSKel4o+O+gtjbnkevZ18SKkeN3ihRGPuBxjaetWzWg==} cpu: [riscv64] os: [linux] - '@rollup/rollup-linux-x64-gnu@4.13.0': - resolution: {integrity: sha512-yUD/8wMffnTKuiIsl6xU+4IA8UNhQ/f1sAnQebmE/lyQ8abjsVyDkyRkWop0kdMhKMprpNIhPmYlCxgHrPoXoA==} + '@rollup/rollup-linux-s390x-gnu@4.21.1': + resolution: {integrity: sha512-z/9rtlGd/OMv+gb1mNSjElasMf9yXusAxnRDrBaYB+eS1shFm6/4/xDH1SAISO5729fFKUkJ88TkGPRUh8WSAA==} + cpu: [s390x] + os: [linux] + + '@rollup/rollup-linux-x64-gnu@4.21.1': + resolution: {integrity: sha512-kXQVcWqDcDKw0S2E0TmhlTLlUgAmMVqPrJZR+KpH/1ZaZhLSl23GZpQVmawBQGVhyP5WXIsIQ/zqbDBBYmxm5w==} cpu: [x64] os: [linux] - '@rollup/rollup-linux-x64-musl@4.13.0': - resolution: {integrity: sha512-9RyNqoFNdF0vu/qqX63fKotBh43fJQeYC98hCaf89DYQpv+xu0D8QFSOS0biA7cGuqJFOc1bJ+m2rhhsKcw1hw==} + '@rollup/rollup-linux-x64-musl@4.21.1': + resolution: {integrity: sha512-CbFv/WMQsSdl+bpX6rVbzR4kAjSSBuDgCqb1l4J68UYsQNalz5wOqLGYj4ZI0thGpyX5kc+LLZ9CL+kpqDovZA==} cpu: [x64] os: [linux] - '@rollup/rollup-win32-arm64-msvc@4.13.0': - resolution: {integrity: sha512-46ue8ymtm/5PUU6pCvjlic0z82qWkxv54GTJZgHrQUuZnVH+tvvSP0LsozIDsCBFO4VjJ13N68wqrKSeScUKdA==} + '@rollup/rollup-win32-arm64-msvc@4.21.1': + resolution: {integrity: sha512-3Q3brDgA86gHXWHklrwdREKIrIbxC0ZgU8lwpj0eEKGBQH+31uPqr0P2v11pn0tSIxHvcdOWxa4j+YvLNx1i6g==} cpu: [arm64] os: [win32] - '@rollup/rollup-win32-ia32-msvc@4.13.0': - resolution: {integrity: sha512-P5/MqLdLSlqxbeuJ3YDeX37srC8mCflSyTrUsgbU1c/U9j6l2g2GiIdYaGD9QjdMQPMSgYm7hgg0551wHyIluw==} + '@rollup/rollup-win32-ia32-msvc@4.21.1': + resolution: {integrity: sha512-tNg+jJcKR3Uwe4L0/wY3Ro0H+u3nrb04+tcq1GSYzBEmKLeOQF2emk1whxlzNqb6MMrQ2JOcQEpuuiPLyRcSIw==} cpu: [ia32] os: [win32] - '@rollup/rollup-win32-x64-msvc@4.13.0': - resolution: {integrity: sha512-UKXUQNbO3DOhzLRwHSpa0HnhhCgNODvfoPWv2FCXme8N/ANFfhIPMGuOT+QuKd16+B5yxZ0HdpNlqPvTMS1qfw==} + '@rollup/rollup-win32-x64-msvc@4.21.1': + resolution: {integrity: sha512-xGiIH95H1zU7naUyTKEyOA/I0aexNMUdO9qRv0bLKN3qu25bBdrxZHqA3PTJ24YNN/GdMzG4xkDcd/GvjuhfLg==} cpu: [x64] os: [win32] @@ -5058,20 +5183,23 @@ packages: '@sinonjs/commons@2.0.0': resolution: {integrity: sha512-uLa0j859mMrg2slwQYdO/AkrOfmH+X6LTVmNTS9CqexuE2IvVORIkSpJLqePAbEnKJ77aMmCwr1NUZ57120Xcg==} - '@sinonjs/commons@3.0.0': - resolution: {integrity: sha512-jXBtWAF4vmdNmZgD5FoKsVLv3rPgDnLgPbU84LIJ3otV44vJlDRokVng5v8NFJdCf/da9legHcKaRuZs4L7faA==} + '@sinonjs/commons@3.0.1': + resolution: {integrity: sha512-K3mCHKQ9sVh8o1C9cxkwxaOmXoAMlDxC1mYyHrjqOWEcBjYr76t96zL2zlj5dUGZ3HSw240X1qgH3Mjf1yJWpQ==} '@sinonjs/fake-timers@10.3.0': resolution: {integrity: sha512-V4BG07kuYSUkTCSBHG8G8TNhM+F19jXFWnQtzj+we8DrkpSBCee9Z3Ms8yiGer/dlmhe35/Xdgyo3/0rQKg7YA==} + '@sinonjs/fake-timers@11.3.1': + resolution: {integrity: sha512-EVJO7nW5M/F5Tur0Rf2z/QoMo+1Ia963RiMtapiQrEWvY0iBUvADo8Beegwjpnle5BHkyHuoxSTW3jF43H1XRA==} + '@sinonjs/samsam@8.0.0': resolution: {integrity: sha512-Bp8KUVlLp8ibJZrnvq2foVhP0IVX2CIprMJPK0vqGqgrDa0OHVKeZyBykqskkrdxV6yKBPmGasO8LVjAKR3Gew==} '@sinonjs/text-encoding@0.7.2': resolution: {integrity: sha512-sXXKG+uL9IrKqViTtao2Ws6dy0znu9sOaP1di/jKGW1M6VssO8vlpXCQcpZ+jisQ1tTFAC5Jo/EOzFbggBagFQ==} - '@slack/bolt@3.21.1': - resolution: {integrity: sha512-cql+f8DypIE96mgFTREslP1DfsTUMyVR76whdepcQ1BpP2vXO1TZJxwJHnDKcnJ+NTg8KNGfPIjDfHZUMETCKw==} + '@slack/bolt@3.21.2': + resolution: {integrity: sha512-Cft+5dbl+YApK2GVFX9O86k0qIqQXshnBGq9oK4a4rLfklyfw9TcydmOxEd32aR/2HbBwr7o/pwu5UAI2c/bUg==} engines: {node: '>=12.13.0', npm: '>=6.12.0'} '@slack/logger@3.0.0': @@ -5090,8 +5218,8 @@ packages: resolution: {integrity: sha512-G+im7OP7jVqHhiNSdHgv2VVrnN5U7KY845/5EZimZkrD4ZmtV0P3BiWkgeJhPtdLuM7C7i6+M6h6Bh+S4OOalA==} engines: {node: '>=12.13.0', npm: '>=6.12.0'} - '@slack/types@2.11.0': - resolution: {integrity: sha512-UlIrDWvuLaDly3QZhCPnwUSI/KYmV1N9LyhuH6EDKCRS1HWZhyTG3Ja46T3D0rYfqdltKYFXbJSSRPwZpwO0cQ==} + '@slack/types@2.13.0': + resolution: {integrity: sha512-OAQVtKYIgBVNRmgIoiTjorGPTlgfcfstU3XYYCBA+czlB9aGcKb9MQc+6Jovi4gq3S98yP/GPBZsJSI/2mHKDQ==} engines: {node: '>= 12.13.0', npm: '>= 6.12.0'} '@slack/web-api@6.12.1': @@ -5153,12 +5281,12 @@ packages: resolution: {integrity: sha512-pemlzrSESWbdAloYml3bAJMEfNh1Z7EduzqPKprCH5S341frlpYnUEW0H72dLxa6IsYr+mPno20GiSm+h9dEdQ==} engines: {node: '>=18'} - '@testing-library/react@16.0.0': - resolution: {integrity: sha512-guuxUKRWQ+FgNX0h0NS0FIq3Q3uLtWVpBzcLOggmfMoUpgBnzBzvLLd4fbm6yS8ydJd94cIfY4yP9qUQjM2KwQ==} + '@testing-library/react@16.0.1': + resolution: {integrity: sha512-dSmwJVtJXmku+iocRhWOUFbrERC76TX2Mnf0ATODz8brzAZrMBbzLwQixlBSanZxR6LddK3eiwpSFZgDET1URg==} engines: {node: '>=18'} peerDependencies: '@testing-library/dom': ^10.0.0 - '@types/react': 18.3.3 + '@types/react': ^18.3.4 '@types/react-dom': 18.3.0 react: ^18.0.0 react-dom: ^18.0.0 @@ -5210,8 +5338,8 @@ packages: '@emotion/react': ^11.11.1 react: '>=18' - '@toolpad/core@0.5.1': - resolution: {integrity: sha512-hIqb495ocf7MrUdwynArMYk0q/lvS+IqLx9n7OxaUiz8tLuGBh80/768pXzt81EL0MnpMbFOSyu53j6YmMpz3A==} + '@toolpad/core@0.5.2': + resolution: {integrity: sha512-GsV3d3vzhTUKD5YKEMvH/HXPr1RikbgYHwZWtiFQ+O69oj/3sbRNsAPV/yvxfEL2VwHssOrhotu1PruJ5cMeDg==} engines: {node: '>=14.0.0'} peerDependencies: '@mui/icons-material': 5 - 6 @@ -5222,8 +5350,8 @@ packages: next: optional: true - '@toolpad/utils@0.5.1': - resolution: {integrity: sha512-ZYirvL5ogk8DX6AePzvCd5kgca2t7PD3pYalo4J/GUYUgX5F+pyOmyddSMdDgRuE+XmC5AwNg1c210Rbi90i0A==} + '@toolpad/utils@0.5.2': + resolution: {integrity: sha512-DC7V/l5L9YuIiJXEm3d3rhF8U0l7tyhKg05qm4TB4vHlRLCuGJs15ZetDS8W9XkxG8IHOErVrFqwlUcuIyQoJg==} peerDependencies: react: ^18.0.0 @@ -5273,8 +5401,8 @@ packages: '@types/chai-dom@1.11.3': resolution: {integrity: sha512-EUEZI7uID4ewzxnU7DJXtyvykhQuwe+etJ1wwOiJyQRTH/ifMWKX+ghiXkxCUvNJ6IQDodf0JXhuP6zZcy2qXQ==} - '@types/chai@4.3.17': - resolution: {integrity: sha512-zmZ21EWzR71B4Sscphjief5djsLre50M6lI622OSySTmn9DB3j+C3kWroHfBQWXbOBwbgg/M8CG/hUxDLIloow==} + '@types/chai@4.3.19': + resolution: {integrity: sha512-2hHHvQBVE2FiSK4eN0Br6snX9MtolHaTo/batnLjlGRhoQzlCL61iVpxoqO7SfFyOw+P/pwv+0zNHzKoGWz9Cw==} '@types/connect@3.4.35': resolution: {integrity: sha512-cdeYyv4KWoEgpBISTxWvqYsVy444DOqehiF3fM3ne10AmJ62RSyNkUnxMJXHQWRQQX2eR94m5y1IZyDwBjV9FQ==} @@ -5318,8 +5446,8 @@ packages: '@types/eslint-scope@3.7.4': resolution: {integrity: sha512-9K4zoImiZc3HlIp6AVUDE4CWYx22a+lhSZMYNpbjW04+YF0KWj4pJXnEMjdnFTiQibFFmElcsasJXDbdI/EPhA==} - '@types/eslint@8.56.11': - resolution: {integrity: sha512-sVBpJMf7UPo/wGecYOpk2aQya2VUGeHhe38WG7/mN5FufNSubf5VT9Uh9Uyp8/eLJpu1/tuhJ/qTo4mhSB4V4Q==} + '@types/eslint@8.56.12': + resolution: {integrity: sha512-03ruubjWyOHlmljCVoxSuNDdmfZDzsrrz0P2LeJsOXr+ZwFQ+0yQIwNCwt/GYhV7Z31fgtXJTAEs+FYlEL851g==} '@types/estree@1.0.5': resolution: {integrity: sha512-/kYRxGDLWzHOB7q+wtSUQlFrtcdUccpfy+X+9iMBpHK8QLLhx2wIPYuS5DYtR9Wa/YlZAbIovy7qVdB1Aq6Lyw==} @@ -5384,9 +5512,6 @@ packages: '@types/lodash@4.17.7': resolution: {integrity: sha512-8wTvZawATi/lsmNu10/j2hk1KEP0IvjubqPE3cu1Xz7xfXXt5oCq3SNUz4fMIP4XGF9Ky+Ue2tBA3hcS7LSBlA==} - '@types/mdast@3.0.10': - resolution: {integrity: sha512-W864tg/Osz1+9f4lrGTZpCSO5/z4608eUp19tbozkq2HJK6i3z1kT0H9tlADXuYIb1YYOBByU4Jsqkk75q48qA==} - '@types/mdast@4.0.4': resolution: {integrity: sha512-kGaNbPh1k7AFzgpud/gMdvIm5xuECykRR+JnWKQno9TAXVa6WIVCGTPvYGekIDL4uwCZQSYbUxNBSb1aUo79oA==} @@ -5408,8 +5533,8 @@ packages: '@types/ms@0.7.34': resolution: {integrity: sha512-nG96G3Wp6acyAgJqGasjODb+acrI7KltPiRxzHPXnP3NgI28bpQDRv53olbqGXbfcgF5aiiHmO3xpwEpS5Ld9g==} - '@types/node@18.19.44': - resolution: {integrity: sha512-ZsbGerYg72WMXUIE9fYxtvfzLEuq6q8mKERdWFnqTmOvudMxnz+CBNRoOwJ2kNpFOncrKjT1hZwxjlFgQ9qvQA==} + '@types/node@20.16.5': + resolution: {integrity: sha512-VwYCweNo3ERajwy0IUlqqcyZ8/A7Zwa9ZP3MnENWcB11AejO+tLy3pu850goUW2FC/IJMdZUfKpX/yxL1gymCA==} '@types/normalize-package-data@2.4.1': resolution: {integrity: sha512-Gj7cI7z+98M282Tqmp2K5EIsoouUEzbBJhQQzDE3jSIRk6r9gsz0oUokqIUR4u1R3dMHo0pDHM7sNOHyhulypw==} @@ -5450,8 +5575,11 @@ packages: '@types/react-window@1.8.8': resolution: {integrity: sha512-8Ls660bHR1AUA2kuRvVG9D/4XpRC6wjAaPT9dil7Ckc76eP9TKWZwwmgfq8Q1LANX3QNDnoU4Zp48A3w+zK69Q==} - '@types/react@18.3.3': - resolution: {integrity: sha512-hti/R0pS0q1/xx+TsI73XIqk26eBsISZ2R0wUijXIngRK9R/e7Xw/cXVxQK7R5JjW+SV4zGcn5hXjudkN/pLIw==} + '@types/react@18.3.4': + resolution: {integrity: sha512-J7W30FTdfCxDDjmfRM+/JqLHBIyl7xUIp9kwK637FGmY7+mkSFSe6L4jpZzhj5QMfLssSDP4/i75AKkrdC7/Jw==} + + '@types/resolve@1.20.6': + resolution: {integrity: sha512-A4STmOXPhMUtHH+S6ymgE2GiBSMqf4oTvcQZMcHzokuTLVYzXTB8ttjcgxOVaAp2lGwEdzZ0J+cRbbeevQj1UQ==} '@types/retry@0.12.0': resolution: {integrity: sha512-wWKOClTTiizcZhXnPY4wikVAwmdYHp8q6DmC+EJUzAMsycb7HB32Kh9RN4+0gExjmPmZSAQjgURXIGATPegAvA==} @@ -5480,9 +5608,6 @@ packages: '@types/tsscmp@1.0.0': resolution: {integrity: sha512-rj18XR6c4Ohds86Lq8MI1NMRrXes4eLo4H06e5bJyKucE1rXGsfBBbFGD2oDC+DSufQCpnU3TTW7QAiwLx+7Yw==} - '@types/unist@2.0.6': - resolution: {integrity: sha512-PBjIUxZHOuj0R15/xuwJYjFi+KZdNFrehocChv4g5hu6aFroHue8m0lBP0POdK2nKzbw0cgV1mws8+V/JAcEkQ==} - '@types/unist@3.0.2': resolution: {integrity: sha512-dqId9J8K/vGi5Zr7oo212BGii5m3q5Hxlkwy3WpYuKPklmBEvsbMYYyLxAQpSffdLl/gdW0XUpKWFvYmyoWCoQ==} @@ -5902,9 +6027,6 @@ packages: resolution: {integrity: sha512-HGyxoOTYUyCM6stUe6EJgnd4EoewAI7zMdfqO+kGjnlZmBDz/cR5pf8r/cR4Wq60sL/p0IkcjUEEPwS3GFrIyw==} engines: {node: '>=8'} - array.prototype.find@2.2.2: - resolution: {integrity: sha512-DRumkfW97iZGOfn+lIXbkVrXL04sfYKX+EfOodo8XboR5sxPDVvOjZTF/rysusa9lmhmSOeD6Vp6RKQP+eP4Tg==} - array.prototype.findlast@1.2.5: resolution: {integrity: sha512-CVvd6FHg1Z3POpBLxO6E6zr+rSKEQ9L6rZHAaY7lLfhKsWYUBBOuMs0e9o24oopj6H+geRCX0YJ+TJLBK2eHyQ==} engines: {node: '>= 0.4'} @@ -5952,6 +6074,12 @@ packages: asap@2.0.6: resolution: {integrity: sha512-BSHWgDSAiKs50o2Re8ppvp3seVHXSRM44cdSsT9FfNEUUZLOGWVCsiWaRPWM1Znn+mqZ1OfVZ3z3DWEzSp7hRA==} + asn1.js@4.10.1: + resolution: {integrity: sha512-p32cOF5q0Zqs9uBiONKYLm6BClCoBCM5O9JfeUSlnQLBTxYdTK+pW+nXflm8UkKd2UYlEbYz5qEi0JuZR9ckSw==} + + assert@2.1.0: + resolution: {integrity: sha512-eLHpSK/Y4nhMJ07gDaAzoX/XAKS8PSaojml3M0DM4JpV1LAi5JOJ/p6H/XWrl8L+DzVEvVCW1z3vWAaB9oTsQw==} + assertion-error@1.1.0: resolution: {integrity: sha512-jgsaNduz+ndvGyFt3uSuWqvy4lCnIJiovtouQN5JZHOKCS2QuhEdbcQHFhVksz2N2U9hXJo8odG7ETyWlEeuDw==} @@ -6094,8 +6222,8 @@ packages: babel-plugin-transform-react-remove-prop-types@0.4.24: resolution: {integrity: sha512-eqj0hVcJUR57/Ug2zE1Yswsw4LhuqqHhD+8v120T1cl3kjg76QwtyBrdIk4WVwK+lAhBJVYCd/v+4nc4y+8JsA==} - bail@1.0.5: - resolution: {integrity: sha512-xFbRxM1tahm08yHBP16MMjVUAvDaBMD38zsM9EMAUN61omwLmKlOpB/Zku5QkjZ8TZ4vn53pj+t518cH0S03RQ==} + bail@2.0.2: + resolution: {integrity: sha512-0xO6mYd7JB2YesxDKplafRpsiOzPt9V02ddPCLbY1xYGPOX24NTyN50qnUxgCPcSoYMhKpAuBTjQoRZCAkUDRw==} balanced-match@1.0.2: resolution: {integrity: sha512-3oSeUO0TMV67hN1AmbXsK4yaqU7tjiHlbxRDZOpH0KW9+CeX4bRAaX0Anxt0tx2MrpRpWwQaPwIlISEJhYU5Pw==} @@ -6143,6 +6271,12 @@ packages: bluebird@3.4.7: resolution: {integrity: sha512-iD3898SR7sWVRHbiQv+sHUtHnMvC1o3nW5rAcqnq3uOn07DSAppZYUkIGslDz6gXC7HfunPe7YVBgoEJASPcHA==} + bn.js@4.12.0: + resolution: {integrity: sha512-c98Bf3tPniI+scsdk237ku1Dc3ujXQTSgyiPUDEOe7tRkhrqridvh8klBv0HCEso1OLOYcHuCv/cS6DNxKH+ZA==} + + bn.js@5.2.1: + resolution: {integrity: sha512-eXRvHzWyYPBuB4NBy0cmYQjGitUrtqwbvlzP3G6VFnNRbsZQIxQ10PbKKHt8gZ/HW/D/747aDl+QkDqg3KQLMQ==} + body-parser@1.20.2: resolution: {integrity: sha512-ml9pReCu3M61kGlqoTm2umSXTlRTuGTx0bfYj+uIUKKYycG5NtSbeetV3faSU6R7ajOPw0g/J1PvK4qNy7s5bA==} engines: {node: '>= 0.8', npm: 1.2.8000 || >= 1.4.16} @@ -6164,12 +6298,37 @@ packages: resolution: {integrity: sha512-yQbXgO/OSZVD2IsiLlro+7Hf6Q18EJrKSEsdoMzKePKXct3gvD8oLcOQdIzGupr5Fj+EDe8gO/lxc1BzfMpxvA==} engines: {node: '>=8'} + brorand@1.1.0: + resolution: {integrity: sha512-cKV8tMCEpQs4hK/ik71d6LrPOnpkpGBR0wzxqr68g2m/LB2GxVYQroAjMJZRVM1Y4BCjCKc3vAamxSzOY2RP+w==} + + browser-resolve@2.0.0: + resolution: {integrity: sha512-7sWsQlYL2rGLy2IWm8WL8DCTJvYLc/qlOnsakDac87SOoCd16WLsaAMdCiAqsTNHIe+SXfaqyxyo6THoWqs8WQ==} + browser-stdout@1.3.1: resolution: {integrity: sha512-qhAVI1+Av2X7qelOfAIYwXONood6XlZE/fXaBSmW/T5SzLAmCgzi+eiWE7fUvbHaeNBQH13UftjpXxsfLkMpgw==} + browserify-aes@1.2.0: + resolution: {integrity: sha512-+7CHXqGuspUn/Sl5aO7Ea0xWGAtETPXNSAjHo48JfLdPWcMng33Xe4znFvQweqc/uzk5zSOI3H52CYnjCfb5hA==} + + browserify-cipher@1.0.1: + resolution: {integrity: sha512-sPhkz0ARKbf4rRQt2hTpAHqn47X3llLkUGn+xEJzLjwY8LRs2p0v7ljvI5EyoRO/mexrNunNECisZs+gw2zz1w==} + + browserify-des@1.0.2: + resolution: {integrity: sha512-BioO1xf3hFwz4kc6iBhI3ieDFompMhrMlnDFC4/0/vd5MokpuAc3R+LYbwTA9A5Yc9pq9UYPqffKpW2ObuwX5A==} + + browserify-rsa@4.1.0: + resolution: {integrity: sha512-AdEER0Hkspgno2aR97SAf6vi0y0k8NuOpGnVH3O99rcA5Q6sh8QxcngtHuJ6uXwnfAXNM4Gn1Gb7/MV1+Ymbog==} + + browserify-sign@4.2.3: + resolution: {integrity: sha512-JWCZW6SKhfhjJxO8Tyiiy+XYB7cqd2S5/+WeYHsKdNKFlCBhKbblba1A/HN/90YwtxKc8tCErjffZl++UNmGiw==} + engines: {node: '>= 0.12'} + browserify-zlib@0.1.4: resolution: {integrity: sha512-19OEpq7vWgsH6WkvkBJQDFvJS1uPcbFOQ4v9CU839dO+ZZXUZO6XpE6hNCqvlIIj+4fZvRiJ6DsAQ382GwiyTQ==} + browserify-zlib@0.2.0: + resolution: {integrity: sha512-Z942RysHXmJrhqk88FmKBVq/v5tqmSkDz7p54G/MGyjMnCFFnC79XWNbg+Vta8W6Wb2qtSZTSxIGkJrRpCFEiA==} + browserslist@4.23.3: resolution: {integrity: sha512-btwCFJVjI4YWDNfau8RhZ+B1Q/VLoUITrm3RlP6y1tYGWIOa+InuYiRGXUBXo8nA1qKmHMyLB/iVQg5TT4eFoA==} engines: {node: ^6 || ^7 || ^8 || ^9 || ^10 || ^11 || ^12 || >=13.7} @@ -6200,6 +6359,9 @@ packages: resolution: {integrity: sha512-I7wzHwA3t1/lwXQh+A5PbNvJxgfo5r3xulgpYDB5zckTu/Z9oUK9biouBKQUjEqzaz3HnAT6TYoovmE+GqSf7A==} engines: {node: '>=0.10'} + buffer-xor@1.0.3: + resolution: {integrity: sha512-571s0T7nZWK6vB67HI5dyUF7wXiNcfaPPPTl6zYCNApANjIvYJTg7hlud/+cJpdAhS7dVzqMLmfhfHR3rAcOjQ==} + buffer@4.9.2: resolution: {integrity: sha512-xq+q3SRMOxGivLhBNaUdC64hDTQwejJ+H0T/NB1XMtTVEwNTrfFF3gAxiyW0Bu/xWEGhjVKgUcMhCrUy2+uCWg==} @@ -6213,6 +6375,9 @@ packages: resolution: {integrity: sha512-9q/rDEGSb/Qsvv2qvzIzdluL5k7AaJOTrw23z9reQthrbF7is4CtlT0DXyO1oei2DCp4uojjzQ7igaSHp1kAEQ==} engines: {node: '>=0.2.0'} + builtin-status-codes@3.0.0: + resolution: {integrity: sha512-HpGFw18DgFWlncDfjTa2rcQ4W88O1mC8e8yZ2AvQY5KDaktSTwo+KRf6nHK6FRI5FyRyb/5T6+TSxfP7QyGsmQ==} + busboy@1.6.0: resolution: {integrity: sha512-8SFQbg/0hQ9xy3UNTB0YEnsNBbWfhf7RtnzpL7TkBiTBRfrQ9Fxcnz7VJsleJpyp6rVLvXiuORqjlHi5q+PYuA==} engines: {node: '>=10.16.0'} @@ -6347,14 +6512,8 @@ packages: chance@1.1.12: resolution: {integrity: sha512-vVBIGQVnwtUG+SYe0ge+3MvF78cvSpuCOEUJr7sVEk2vSBuMW6OXNJjSzdtzrlxNUEaoqH2GBd5Y/+18BEB01Q==} - character-entities-legacy@1.1.4: - resolution: {integrity: sha512-3Xnr+7ZFS1uxeiUDvV02wQ+QDbc55o97tIV5zHScSPJpcLm/r0DFPcoY3tYRp+VZukxuMeKgXYmsXQHO05zQeA==} - - character-entities@1.2.4: - resolution: {integrity: sha512-iBMyeEHxfVnIakwOuDXpVkc54HijNgCyQB2w0VfGQThle6NXn50zU6V/u+LDhxHcDUPojn6Kpga3PTAD8W1bQw==} - - character-reference-invalid@1.1.4: - resolution: {integrity: sha512-mKKUkUbhPpQlCOfIuZkvSEgktjPFIsZKRRbC6KWVEMvlzblj3i3asQv5ODsrwt0N3pHAEvjP8KTQPHkp0+6jOg==} + character-entities@2.0.2: + resolution: {integrity: sha512-shx7oQ0Awen/BRIdkjkvz54PnEEI/EjwXDSIZp86/KKdbafHh1Df/RYGBhn4hbe2+uKC9FnT5UCEdyPz3ai9hQ==} chardet@0.7.0: resolution: {integrity: sha512-mT8iDcrh03qDGRRmoA2hmBJnxpllMR+0/0qlzjqZES6NdiWDcZkCNAk4rPFZ9Q85r27unkiNNg8ZOiwZXBHwcA==} @@ -6400,6 +6559,9 @@ packages: resolution: {integrity: sha512-TdHqgGf9odd8SXNuxtUBVx8Nv+qZOejE6qyqiy5NtbYYQOeFa6zmHkxlPzmaLxWWHsU6nJmB7AETdVPi+2NBUg==} engines: {node: '>=8'} + cipher-base@1.0.4: + resolution: {integrity: sha512-Kkht5ye6ZGmwv40uUDZztayT2ThLQGfnj/T71N/XzeZeo3nf8foyW7zGTsPYkEya3m5f3cAypH+qe7YOrM1U2Q==} + classnames@2.3.2: resolution: {integrity: sha512-CSbhY4cFEJRe6/GQzIk5qXZ4Jeg5pcsP7b5peFSDpffpe1cqjASH/n9UTjBwOp6XpMSTwQ8Za2K5V02ueA7Tmw==} @@ -6618,9 +6780,15 @@ packages: resolution: {integrity: sha512-ZqRXc+tZukToSNmh5C2iWMSoV3X1YUcPbqEM4DkEG5tNQXrQUZCNVGGv3IuicnkMtPfGf3Xtp8WCXs295iQ1pQ==} engines: {node: '>= 0.10.0'} + console-browserify@1.2.0: + resolution: {integrity: sha512-ZMkYO/LkF17QvCPqM0gxw8yUzigAOZOSWSHg91FH6orS7vcEj5dVZTidN2fQ14yBSdg97RqhSNwLUXInd52OTA==} + console-control-strings@1.1.0: resolution: {integrity: sha512-ty/fTekppD2fIwRvnZAVdeOiGd1c7YXEixbgJTNzqcxJWKQnjJ/V1bNEEE6hygpM3WjwHFUVK6HTjWSzV4a8sQ==} + constants-browserify@1.0.0: + resolution: {integrity: sha512-xFxOwqIzR/e1k1gLiWEophSCMqXcwVHIH7akf7b/vxcUeGunlj3hvZaaqxwHsTgn+IndtkQJgSztIDWeumWJDQ==} + content-disposition@0.5.2: resolution: {integrity: sha512-kRGRZw3bLlFISDBgwTSA1TMBFN6J6GWDeubmDE3AF+3+yXL8hTWv8r5rkLbqYXY4RjPk/EzHnClI3zQf1cFmHA==} engines: {node: '>= 0.6'} @@ -6746,6 +6914,18 @@ packages: crc@3.8.0: resolution: {integrity: sha512-iX3mfgcTMIq3ZKLIsVFAbv7+Mc10kxabAGQb8HvjA1o3T1PIYprbakQ65d3I+2HGHt6nSKkM9PYjgoJO2KcFBQ==} + create-ecdh@4.0.4: + resolution: {integrity: sha512-mf+TCx8wWc9VpuxfP2ht0iSISLZnt0JgWlrOKZiNqyUZWnjIaCIVNQArMHnCZKfEYRg6IM7A+NeJoN8gf/Ws0A==} + + create-hash@1.2.0: + resolution: {integrity: sha512-z00bCGNHDG8mHAkP7CtT1qVu+bFQUPjYq/4Iv3C3kWjTFV10zIjfSoeqXo9Asws8gwSHDGj/hl2u4OGIjapeCg==} + + create-hmac@1.1.7: + resolution: {integrity: sha512-MJG9liiZ+ogc4TzUwuvbER1JRdgvUFSB5+VR/g5h82fGaIRWMWddtKBHi7/sVhfjQZ6SehlyhvQYrcYkaUIpLg==} + + create-require@1.1.1: + resolution: {integrity: sha512-dcKFX3jn0MpIaXjisoRvexIJVEKzaq7z2rZKxf+MSr9TkdmHmsU4m2lcLojrj/FHl8mk5VxMmYA+ftRkP/3oKQ==} + cross-env@7.0.3: resolution: {integrity: sha512-+/HKd6EgcQCJGh2PSjZuUitQBQynKor4wrFbRg4DtAgS1aWO+gU52xpH7M9ScGgXSYmAVS9bIJ8EzuaGw0oNAw==} engines: {node: '>=10.14', npm: '>=6', yarn: '>=1'} @@ -6764,6 +6944,9 @@ packages: resolution: {integrity: sha512-iRDPJKUPVEND7dHPO8rkbOnPpyDygcDFtWjpeWNCgy8WP2rXcxXL8TskReQl6OrB2G7+UJrags1q15Fudc7G6w==} engines: {node: '>= 8'} + crypto-browserify@3.12.0: + resolution: {integrity: sha512-fz4spIh+znjO2VjL+IdhEpRJ3YN6sMzITSBijk6FK2UvTqruSQW+/cCZTSNsMiZNvUeq0CqurF+dAbyiGOY6Wg==} + css-box-model@1.2.1: resolution: {integrity: sha512-a7Vr4Q/kd/aw96bnJG332W9V9LkJO69JRcaCYDUqjp6/z0w6VcZjgAcTbgFxEPfBgdnAwlh3iwu+hLopa+flJw==} @@ -6907,10 +7090,6 @@ packages: resolution: {integrity: sha512-t/Ygsytq+R995EJ5PZlD4Cu56sWa8InXySaViRzw9apusqsOO2bQP+SbYzAhR0pFKoB+43lYy8rWban9JSuXnA==} engines: {node: '>= 0.4'} - date-fns-jalali@2.21.3-1: - resolution: {integrity: sha512-Sgw1IdgCgyWDKCpq6uwAu24vPMOtvmcXXXuETr1jQO/aVj4h23XAltcP7hLbo+osqoiJnPmiydbI/q1W7TYAjA==} - engines: {node: '>=0.11'} - date-fns@2.30.0: resolution: {integrity: sha512-fnULvOpxnC5/Vg3NCiWelDsLiUc9bRwAPs/+LfTLNvetFCtCTN+yQz15C/fs4AwX1R9K5GLtLfn8QW+dWisaAw==} engines: {node: '>=0.11'} @@ -6922,8 +7101,8 @@ packages: dateformat@3.0.3: resolution: {integrity: sha512-jyCETtSl3VMZMWeRo7iY1FL19ges1t55hMo5yaam4Jrsm5EPL89UQkoQRyiI+Yf4k8r2ZpdngkV8hr1lIdjb3Q==} - dayjs@1.11.12: - resolution: {integrity: sha512-Rt2g+nTbLlDWZTwwrIXjy9MeiZmSDI375FvZs72ngxx8PDC6YXOeR3q5LAuPzjZQxhiWdRKac7RKV+YyQYfYIg==} + dayjs@1.11.13: + resolution: {integrity: sha512-oaMBel6gjolK862uaPQOVTA7q3TZhuSvuMQAAglQDOWYO9A91IrAOUJEyKVlqJlHE0vq5p5UXxzdPfMH/x6xNg==} debounce@1.2.1: resolution: {integrity: sha512-XRRe6Glud4rd/ZGQfiV1ruXSfbvfJedlV9Y6zOlP+2K04vBYiJEte6stfFkCP03aMnY5tsipamumUjL14fofug==} @@ -6944,8 +7123,8 @@ packages: supports-color: optional: true - debug@4.3.5: - resolution: {integrity: sha512-pt0bNEmneDIvdL1Xsd9oDQ/wrQRkXDT4AUWlNZNPKvW5x/jyO9VFXkJUP07vQ2upmw5PlaITaPKc31jK13V+jg==} + debug@4.3.6: + resolution: {integrity: sha512-O/09Bd4Z1fBrU4VzkhFqVgpPzaGbw6Sm9FEkBT1A/YBXQFGuuSxa1dN2nxgxS34JmKXqYx8CZAwEVoJFImUXIg==} engines: {node: '>=6.0'} peerDependencies: supports-color: '*' @@ -6972,6 +7151,9 @@ packages: decimal.js@10.4.3: resolution: {integrity: sha512-VBBaLc1MgL5XpzgIP7ny5Z6Nx3UrRkIViUkPUdtl9aya5amy3De1gsUUSB1g3+3sExYNjCAsAznmukyxCb1GRA==} + decode-named-character-reference@1.0.2: + resolution: {integrity: sha512-O8x12RzrUF8xyVcY0KJowWsmaJxQbmy0/EtnNtHRpsOcT7dFk5W598coHqBVpmWo1oQQfsCqfCmkZN5DJrZVdg==} + dedent@1.5.3: resolution: {integrity: sha512-NHQtfOOW68WD8lgypbLA5oT+Bt0xXJhiYvoR6SmmNXZfpzOGXwdKWmcwG8N7PwVVWV3eF/68nmD9BaJSsTBhyQ==} peerDependencies: @@ -7051,6 +7233,9 @@ packages: resolution: {integrity: sha512-0je+qPKHEMohvfRTCEo3CrPG6cAzAYgmzKyxRiYSSDkS6eGJdyVJm7WaYA5ECaAD9wLB2T4EEeymA5aFVcYXCA==} engines: {node: '>=6'} + des.js@1.1.0: + resolution: {integrity: sha512-r17GxjhUCjSRy8aiJpr8/UadFIzMzJGexI3Nmz4ADi9LYSFx4gTBp80+NaX/YsXWWLhpZ7v/v/ubEc/bCNfKwg==} + destroy@1.2.0: resolution: {integrity: sha512-2sJGJTaXIIaR1w4iJSNoN0hnMY7Gpc/n8D4qSCJw8QqFWXf7cuAgnEHxBpweaVcPevC2l3KpjYCx3NypQQgaJg==} engines: {node: '>= 0.8', npm: 1.2.8000 || >= 1.4.16} @@ -7063,6 +7248,9 @@ packages: resolution: {integrity: sha512-bwy0MGW55bG41VqxxypOsdSdGqLwXPI/focwgTYCFMbdUiBAxLg9CFzG08sz2aqzknwiX7Hkl0bQENjg8iLByw==} engines: {node: '>=8'} + devlop@1.1.0: + resolution: {integrity: sha512-RWmIqhcFf1lRYBvNmr7qTNuyCt/7/ns2jbpp1+PalgE/rDQcBT0fioSMUpJ93irlUhC5hrg4cYqe6U+0ImW0rA==} + di@0.0.1: resolution: {integrity: sha512-uJaamHkagcZtHPqCIHZxnFrXlunQXgBOsZSUOWwFw31QJCAbyTBoHMW75YOTur5ZNx8pIeAKgf6GWIgaqqiLhA==} @@ -7077,6 +7265,9 @@ packages: resolution: {integrity: sha512-uIFDxqpRZGZ6ThOk84hEfqWoHx2devRFvpTZcTHur85vImfaxUbTW9Ryh4CpCuDnToOP1CEtXKIgytHBPVff5A==} engines: {node: '>=0.3.1'} + diffie-hellman@5.0.3: + resolution: {integrity: sha512-kqag/Nl+f3GwyK25fhUMYj81BUOrZ9IuJsjIcDE5icNM9FJHAVm3VcUDxdLPoQtTuUylWm6ZIknYJwwaPxsUzg==} + dir-glob@3.0.1: resolution: {integrity: sha512-WkrWp9GR4KXfKGYzOLmTuGVi1UWFfws377n9cc55/tb6DuqyF6pcQ5AbiHEshaDpY9v6oaSr2XCDidGmMwdzIA==} engines: {node: '>=8'} @@ -7113,6 +7304,10 @@ packages: dom-serializer@2.0.0: resolution: {integrity: sha512-wIkAryiqt/nV5EQKqQpo3SToSOV9J0DnbJqwK7Wv/Trc92zIAYZ4FlMu+JPFW1DfGFt81ZTCGgDEabffXeLyJg==} + domain-browser@4.23.0: + resolution: {integrity: sha512-ArzcM/II1wCCujdCNyQjXrAFwS4mrLh4C7DZWlaI8mdh7h3BfKdNd3bKXITfl2PT9FtfQqaGvhi1vPRQPimjGA==} + engines: {node: '>=10'} + domelementtype@2.3.0: resolution: {integrity: sha512-OLETBj6w0OsagBwdXnPdN0cnMfF9opN69co+7ZrbfPGrdpPVNBUj02spi6B1N7wChLQiPn4CSH/zJvXw56gmHw==} @@ -7171,6 +7366,9 @@ packages: electron-to-chromium@1.5.4: resolution: {integrity: sha512-orzA81VqLyIGUEA77YkVA1D+N+nNfl2isJVjjmOyrlxuooZ19ynb+dOlaDTqd/idKRS9lDCSBmtzM+kyCsMnkA==} + elliptic@6.5.7: + resolution: {integrity: sha512-ESVCtTwiA+XhY3wyh24QqRGBoP3rEdDUl3EDUUo9tft074fi19IrdpH7hLCMMP3CIj7jb3W96rn8lt/BqIlt5Q==} + emoji-regex@10.3.0: resolution: {integrity: sha512-QpLs9D9v9kArv4lfDEgg1X/gN5XLnf/A6l9cs8SPZLRZR3ZkY9+kwIQTxm+fsSej5UMYGE8fdoaZVIBlqG0XTw==} @@ -7357,8 +7555,8 @@ packages: eslint-import-resolver-node@0.3.9: resolution: {integrity: sha512-WFj2isz22JahUv+B788TlO3N6zL3nNJGU8CcZbPZvVEkBPaJdCV4vy5wyghty5ROFbCRnm132v8BScu5/1BQ8g==} - eslint-import-resolver-webpack@0.13.8: - resolution: {integrity: sha512-Y7WIaXWV+Q21Rz/PJgUxiW/FTBOWmU8NTLdz+nz9mMoiz5vAev/fOaQxwD7qRzTfE3HSm1qsxZ5uRd7eX+VEtA==} + eslint-import-resolver-webpack@0.13.9: + resolution: {integrity: sha512-yGngeefNiHXau2yzKKs2BNON4HLpxBabY40BGL/vUSKZtqzjlVsTTZm57jhHULhm+mJEwKsEIIN3NXup5AiiBQ==} engines: {node: '>= 6'} peerDependencies: eslint-plugin-import: '>=1.4.0' @@ -7418,8 +7616,8 @@ packages: peerDependencies: eslint: '>=7.0.0' - eslint-plugin-react-compiler@0.0.0-experimental-9aef357-20240815: - resolution: {integrity: sha512-2IgS9nY34TMqSKRC8wBvt3Lm3RGduHqa1prpEKaNkr7Fc1HUnRVIodaV6C6VcuWXt/WgeWo6Avqr5kX3MKTT2w==} + eslint-plugin-react-compiler@0.0.0-experimental-3f2f4f0-20240826: + resolution: {integrity: sha512-ONy+bA9sGbASAVqzv7ZvgySdiByGr06rS5clbnC7aFa8MBlWZWInRzJ7mIMKThlVkW8FTNWsZaqstQcILMKaeg==} engines: {node: ^14.17.0 || ^16.0.0 || >= 18.0.0} peerDependencies: eslint: '>=7' @@ -7430,8 +7628,8 @@ packages: peerDependencies: eslint: ^3.0.0 || ^4.0.0 || ^5.0.0 || ^6.0.0 || ^7.0.0 || ^8.0.0-0 - eslint-plugin-react@7.35.0: - resolution: {integrity: sha512-v501SSMOWv8gerHkk+IIQBkcGRGrO2nfybfj5pLxuJNFTPxxA3PSryhXTK+9pNbtkggheDdsC0E9Q8CuPk6JKA==} + eslint-plugin-react@7.35.2: + resolution: {integrity: sha512-Rbj2R9zwP2GYNcIak4xoAMV57hrBh3hTaR0k7hVjwCQgryE/pw5px4b13EYjduOI0hfXyZhwBxaGpOTbWSGzKQ==} engines: {node: '>=4'} peerDependencies: eslint: ^3 || ^4 || ^5 || ^6 || ^7 || ^8 || ^9.7 @@ -7500,6 +7698,9 @@ packages: resolution: {integrity: sha512-YNF+mZ/Wu2FU/gvmzuWtYc8rloubL7wfXCTgouFrnjGVXPA/EeYYA7pupXWrb3Iv1cTBeSSxxJIbK23l4MRNqg==} engines: {node: '>=8.3.0'} + estree-walker@2.0.2: + resolution: {integrity: sha512-Rfkk/Mp/DL7JVje3u18FxFujQlTNR2q6QfMSMB7AvCBx91NGj/ba3kCfza0f6dVDbw7YlRf/nDrn7pQrCCyQ/w==} + estree-walker@3.0.3: resolution: {integrity: sha512-7RUKfXgSMMkzt6ZuXmqapOurLGPPfgj6l9uRZ7lRGolvk0y2yocc35LdcxKC5PQZdn2DMqioAQ2NoWcrTKmm6g==} @@ -7535,6 +7736,9 @@ packages: resolution: {integrity: sha512-mQw+2fkQbALzQ7V0MY0IqdnXNOeTtP4r0lN9z7AAawCXgqea7bDii20AYrIBrFd/Hx0M2Ocz6S111CaFkUcb0Q==} engines: {node: '>=0.8.x'} + evp_bytestokey@1.0.3: + resolution: {integrity: sha512-/f2Go4TognH/KvCISP7OUsHn85hT9nUkxxA9BEWxFn+Oj9o8ZNLm/40hdlgSLyuOimsrTKLUMEorQexp/aPQeA==} + exceljs@4.4.0: resolution: {integrity: sha512-XctvKaEMaj1Ii9oDOqbW/6e1gXknSY4g/aLCDicOXqBE4M0nRWkUu0PTp++UPNzoFY12BNHMfs/VadKIS6llvg==} engines: {node: '>=8.3.0'} @@ -8095,6 +8299,17 @@ packages: resolution: {integrity: sha512-f2dvO0VU6Oej7RkWJGrehjbzMAjFp5/VKPp5tTpWIV4JHHZK1/BxbFRtf/siA2SWTe09caDmVtYYzWEIbBS4zw==} engines: {node: '>= 0.4.0'} + hash-base@3.0.4: + resolution: {integrity: sha512-EeeoJKjTyt868liAlVmcv2ZsUfGHlE3Q+BICOXcZiwN3osr5Q/zFGYmTJpoIzuaSTAwndFy+GqhEwlU4L3j4Ow==} + engines: {node: '>=4'} + + hash-base@3.1.0: + resolution: {integrity: sha512-1nmYp/rhMDiE7AYkDw+lLwlAzz0AntGIe51F3RfFfEqyQ3feY2eI/NcwC6umIQVOASPMsWJLJScWKSSvzL9IVA==} + engines: {node: '>=4'} + + hash.js@1.1.7: + resolution: {integrity: sha512-taOaskGt4z4SOANNseOviYDvjEJinIkRgmp7LbKP2YTTmVxWBl87s/uzK9r+44BclBSp2X7K1hqeNfz9JbBeXA==} + hasha@5.2.2: resolution: {integrity: sha512-Hrp5vIK/xr5SkeN2onO32H0MgNZ0f17HRNH39WfL0SYUNOTZ5Lz1TJ8Pajo/87dYGEFlLMm7mIc/k/s6Bvz9HQ==} engines: {node: '>=8'} @@ -8123,6 +8338,9 @@ packages: resolution: {integrity: sha512-cnN7bQUm65UWOy6cbGcCcZ3rpwW8Q/j4OP5aWRhEry4Z2t2aR1cjrbp0BS+KiBN0smvP1caBgAuxutvyvJILzQ==} engines: {node: '>=8'} + hmac-drbg@1.0.1: + resolution: {integrity: sha512-Tti3gMqLdZfhOQY1Mzf/AanLiqh1WTiJgEj26ZuYQ9fbkLomzGchCws4FyrSd4VkpBfiNhaE1On+lOz894jvXg==} + hoist-non-react-statics@3.3.2: resolution: {integrity: sha512-/gGivxi8JPKWNm/W0jSmzcMPpfpPLc3dY/6GxhX2hQ9iGj3aDfklV4ET7NjKpSinLpJ5vafa9iiGIEZg10SfBw==} @@ -8195,6 +8413,9 @@ packages: resolution: {integrity: sha512-7mz/721AbnJwIVbnaSv1Cz3Am0ZLT/UBwkC92VlxhXv/k/BBQfM2fXElQNC27BVGr0uwUpplYPQM9LnaBMR5NQ==} engines: {node: '>=8.0.0'} + https-browserify@1.0.0: + resolution: {integrity: sha512-J+FkSdyD+0mA0N+81tMotaRMfSL9SGi+xpD3T6YApKsc3bGSXJlfXri3VyFOeYkfLRQisDk1W+jIFFKBeUBbBg==} + https-proxy-agent@2.2.4: resolution: {integrity: sha512-OmvfoQ53WLjtA9HeYP9RNrWMJzzAz1JGaSFr1nijg0PVR1JaD/xbJq1mdEIIlxGpXp9eSe/O2LgU9DJmTPd0Eg==} engines: {node: '>= 4.5.0'} @@ -8332,12 +8553,6 @@ packages: resolution: {integrity: sha512-0KI/607xoxSToH7GjN1FfSbLoU0+btTicjsQSWQlh/hZykN8KpmMf7uYwPW3R+akZ6R/w18ZlXSHBYXiYUPO3g==} engines: {node: '>= 0.10'} - is-alphabetical@1.0.4: - resolution: {integrity: sha512-DwzsA04LQ10FHTZuL0/grVDk4rFoVH1pjAToYwBrHSxcrBIGQuXrQMtD5U1b0U2XVgKZCTLLP8u2Qxqhy3l2Vg==} - - is-alphanumerical@1.0.4: - resolution: {integrity: sha512-UzoZUr+XfVz3t3v4KyGEniVL9BDRoQtY7tOyrRybkVNjDFWyo1yhXNGrrBTQxp3ib9BLAWs7k2YKBQsFRkZG9A==} - is-arguments@1.1.1: resolution: {integrity: sha512-8Q7EARjzEnKpt/PCD7e1cgUS0a6X8u5tdSiMqXhojOdoV9TsMsiO+9VLC5vAmO8N7/GmXn7yjR8qnA6bVAEzfA==} engines: {node: '>= 0.4'} @@ -8367,10 +8582,6 @@ packages: resolution: {integrity: sha512-gDYaKHJmnj4aWxyj6YHyXVpdQawtVLHU5cb+eztPGczf6cjuTdwve5ZIEfgXqH4e57An1D1AKf8CZ3kYrQRqYA==} engines: {node: '>= 0.4'} - is-buffer@2.0.5: - resolution: {integrity: sha512-i2R6zNFDwgEHJyQUtJEk0XFi1i0dPFn/oqjK3/vPCcDeJvW5NQ83V8QbicfF1SupOaB0h8ntgBC2YiE7dfyctQ==} - engines: {node: '>=4'} - is-callable@1.2.7: resolution: {integrity: sha512-1BC0BVFhS/p0qtw6enp8e+8OD0UrK0oFLztSjNzhcKA3WDuJxxAPXzPuPtKkjEY9UUoEWlX/8fgKeu2S8i9JTA==} engines: {node: '>= 0.4'} @@ -8390,9 +8601,6 @@ packages: resolution: {integrity: sha512-9YQaSxsAiSwcvS33MBk3wTCVnWK+HhF8VZR2jRxehM16QcVOdHqPn4VPHmRK4lSr38n9JriurInLcP90xsYNfQ==} engines: {node: '>= 0.4'} - is-decimal@1.0.4: - resolution: {integrity: sha512-RGdriMmQQvZ2aqaQq3awNA6dCGtKpiDFcOzrTWrDAT2MiWrKQVPmxLGHl7Y2nNu6led0kEyoX0enY0qXYsv9zw==} - is-deflate@1.0.0: resolution: {integrity: sha512-YDoFpuZWu1VRXlsnlYMzKyVRITXj7Ej/V9gXQ2/pAe7X1J7M/RNOqaIYi6qUn+B7nGyB9pDXrv02dsB58d2ZAQ==} @@ -8443,9 +8651,6 @@ packages: resolution: {integrity: sha512-rcfALRIb1YewtnksfRIHGcIY93QnK8BIQ/2c9yDYcG/Y6+vRoJuTWBmmSEbyLLYtXm7q35pHOHbZFQBaLrhlWQ==} engines: {node: '>=0.10.0'} - is-hexadecimal@1.0.4: - resolution: {integrity: sha512-gyPJuv83bHMpocVYoqof5VDiZveEoGoFL8m3BXNb2VW8Xs+rz9kqO8LOQ5DH6EsuvilT1ApazU0pyl+ytbPtlw==} - is-in-browser@1.1.3: resolution: {integrity: sha512-FeXIBgG/CPGd/WUxuEyvgGTEfwiG9Z4EKGxjNMRqviiIIfsmgrpnHLffEDdwUHqNva1VEW91o3xBT/m8Elgl9g==} @@ -8459,6 +8664,10 @@ packages: is-map@2.0.2: resolution: {integrity: sha512-cOZFQQozTha1f4MxLFzlgKYPTyj26picdZTx82hbc/Xf4K/tZOOXSCkMvU4pKioRXGDLJRn0GM7Upe7kR721yg==} + is-nan@1.3.2: + resolution: {integrity: sha512-E+zBKpQ2t6MEo1VsonYmluk9NxGrbzpeeLC2xIViuO2EjU2xsXsBPwTr3Ykv9l08UYEVEdWeRZNouaZqF6RN0w==} + engines: {node: '>= 0.4'} + is-negative-zero@2.0.3: resolution: {integrity: sha512-5KoIu2Ngpyek75jXodFvnafB6DJgr3u8uuK0LEZJjrU19DrMD3EVERaR8sjz8CCGgpZvxPl9SuE1GMVPFHx1mw==} engines: {node: '>= 0.4'} @@ -8615,6 +8824,10 @@ packages: resolution: {integrity: sha512-WhB9zCku7EGTj/HQQRz5aUQEUeoQZH2bWcltRErOpymJ4boYE6wL9Tbr23krRPSZ+C5zqNSrSw+Cc7sZZ4b7vg==} engines: {node: '>=0.10.0'} + isomorphic-timers-promises@1.0.1: + resolution: {integrity: sha512-u4sej9B1LPSxTGKB/HiuzvEQnXH0ECYkSVQU39koSwmFAxhlEAFl9RdTvLv4TOTQUgBS5O3O5fwUxk6byBZ+IQ==} + engines: {node: '>=10'} + istanbul-lib-coverage@2.0.5: resolution: {integrity: sha512-8aXznuEPCJvGnMSRft4udDRDtb1V3pkQkMMI5LI+6HuQz5oQ4J2UFn1H82raA3qJtyOLkkwVqICBQkjnGtn5mA==} engines: {node: '>=6'} @@ -8912,8 +9125,8 @@ packages: just-diff@6.0.2: resolution: {integrity: sha512-S59eriX5u3/QhMNq3v/gm8Kd0w8OS6Tz2FS1NG4blv+z0MuQcBRJyFWjdovM0Rad4/P4aUPFtnkNjMjyMlMSYA==} - just-extend@4.2.1: - resolution: {integrity: sha512-g3UB796vUFIY90VIv/WX3L2c8CS2MdWUww3CNrYmqza1Fg0DURc2K/O4YrnklBdQarSJ/y8JnJYDGc+1iumQjg==} + just-extend@6.2.0: + resolution: {integrity: sha512-cYofQu2Xpom82S6qD778jBDpwvvy39s1l/hrYij2u9AMdQcGRpaBu6kY4mVhuno5kJVi1DAz4aiphA2WI1/OAw==} jwa@1.4.1: resolution: {integrity: sha512-qiLX/xhEEFKUAJ6FiBMbes3w9ATzyk5W7Hvzpa/SLYdxNtng+gcurvrI7TbACjIXlsJyr05/S1oUhZrc63evQA==} @@ -9186,8 +9399,8 @@ packages: resolution: {integrity: sha512-/3ER20CTTbahrCrpYfPn7Xavv9diBROZpoXGVZDWMw4b/X4uuUwAC0ki85tgsdMRONURyIJbcOvS94QsUBYPbQ==} hasBin: true - longest-streak@2.0.4: - resolution: {integrity: sha512-vM6rUVCVUJJt33bnmHiZEvr7wPT78ztX7rojL+LW51bHtLh6HTjx84LA5W4+oa6aKEJA7jJu5LR6vQRBpA5DVg==} + longest-streak@3.1.0: + resolution: {integrity: sha512-9Ri+o0JYgehTaVBBDoMqIl8GXtbWg711O3srftcHhZ0dqnETqLaoIK0x17fUw9rFSlK/0NlsKe0Ahhyl5pXE2g==} loose-envify@1.4.0: resolution: {integrity: sha512-lyuxPGr/Wfhrlem2CL/UcnUc1zcqKAImBDzukY7Y5F/yQiNdko6+fRLevlw1HgMySw7f611UIY408EtxRSoK3Q==} @@ -9298,14 +9511,20 @@ packages: mathml-tag-names@2.1.3: resolution: {integrity: sha512-APMBEanjybaPzUrfqU0IMU5I0AswKMH7k8OTLs0vvV4KZpExkTkY87nR/zpbuTPj+gARop7aGUbl11pnDfW6xg==} - mdast-util-from-markdown@0.8.5: - resolution: {integrity: sha512-2hkTXtYYnr+NubD/g6KGBS/0mFmBcifAsI0yIWRiRo0PjVs6SSOSOdtzbp6kSGnShDN6G5aWZpKQ2lWRy27mWQ==} + md5.js@1.3.5: + resolution: {integrity: sha512-xitP+WxNPcTTOgnTJcrhM0xvdPepipPSf3I8EIpGKeFLjt3PlJLIDG3u8EX53ZIubkb+5U2+3rELYpEhHhzdkg==} + + mdast-util-from-markdown@2.0.1: + resolution: {integrity: sha512-aJEUyzZ6TzlsX2s5B4Of7lN7EQtAxvtradMMglCQDyaTFgse6CmtmdJ15ElnVRlCg1vpNyVtbem0PWzlNieZsA==} + + mdast-util-phrasing@4.1.0: + resolution: {integrity: sha512-TqICwyvJJpBwvGAMZjj4J2n0X8QWp21b9l0o7eXyVJ25YNWYbJDVIyD1bZXE6WtV6RmKJVYmQAKWa0zWOABz2w==} - mdast-util-to-markdown@0.6.5: - resolution: {integrity: sha512-XeV9sDE7ZlOQvs45C9UKMtfTcctcaj/pGwH8YLbMHoMOXNNCn2LsqVQOqrF1+/NU8lKDAqozme9SCXWyo9oAcQ==} + mdast-util-to-markdown@2.1.0: + resolution: {integrity: sha512-SR2VnIEdVNCJbP6y7kVTJgPLifdr8WEU440fQec7qHoHOUz/oJ2jmNRqdDQ3rbiStOXb2mCDGTuwsK5OPUgYlQ==} - mdast-util-to-string@2.0.0: - resolution: {integrity: sha512-AW4DRS3QbBayY/jJmD8437V1Gombjf8RSOUCMFBuo5iHi58AGEgVCKQ+ezHkZZDpAQS75hcBMpLqjpJTjtUL7w==} + mdast-util-to-string@4.0.0: + resolution: {integrity: sha512-0H44vDimn51F0YwvxSJSm0eCDOJTRlmN0R1yBh4HLj9wiV1Dn0QoXGbvFAWj2hSItVTlCmBF1hqKlIyUBVFLPg==} mdn-data@2.0.28: resolution: {integrity: sha512-aylIc7Z9y4yzHYAJNuESG3hfhC+0Ibp/MAMiaOZgNv4pmEdFyfZhhhny4MNiAfWdBQ1RQ2mfDWmM1x8SvGyp8g==} @@ -9413,8 +9632,68 @@ packages: engines: {node: '>=18'} hasBin: true - micromark@2.11.4: - resolution: {integrity: sha512-+WoovN/ppKolQOFIAajxi7Lu9kInbPxFuTBVEavFcL8eAfVstoc5MocPmqBeAdBOJV00uaVjegzH4+MA0DN/uA==} + micromark-core-commonmark@2.0.1: + resolution: {integrity: sha512-CUQyKr1e///ZODyD1U3xit6zXwy1a8q2a1S1HKtIlmgvurrEpaw/Y9y6KSIbF8P59cn/NjzHyO+Q2fAyYLQrAA==} + + micromark-factory-destination@2.0.0: + resolution: {integrity: sha512-j9DGrQLm/Uhl2tCzcbLhy5kXsgkHUrjJHg4fFAeoMRwJmJerT9aw4FEhIbZStWN8A3qMwOp1uzHr4UL8AInxtA==} + + micromark-factory-label@2.0.0: + resolution: {integrity: sha512-RR3i96ohZGde//4WSe/dJsxOX6vxIg9TimLAS3i4EhBAFx8Sm5SmqVfR8E87DPSR31nEAjZfbt91OMZWcNgdZw==} + + micromark-factory-space@2.0.0: + resolution: {integrity: sha512-TKr+LIDX2pkBJXFLzpyPyljzYK3MtmllMUMODTQJIUfDGncESaqB90db9IAUcz4AZAJFdd8U9zOp9ty1458rxg==} + + micromark-factory-title@2.0.0: + resolution: {integrity: sha512-jY8CSxmpWLOxS+t8W+FG3Xigc0RDQA9bKMY/EwILvsesiRniiVMejYTE4wumNc2f4UbAa4WsHqe3J1QS1sli+A==} + + micromark-factory-whitespace@2.0.0: + resolution: {integrity: sha512-28kbwaBjc5yAI1XadbdPYHX/eDnqaUFVikLwrO7FDnKG7lpgxnvk/XGRhX/PN0mOZ+dBSZ+LgunHS+6tYQAzhA==} + + micromark-util-character@2.1.0: + resolution: {integrity: sha512-KvOVV+X1yLBfs9dCBSopq/+G1PcgT3lAK07mC4BzXi5E7ahzMAF8oIupDDJ6mievI6F+lAATkbQQlQixJfT3aQ==} + + micromark-util-chunked@2.0.0: + resolution: {integrity: sha512-anK8SWmNphkXdaKgz5hJvGa7l00qmcaUQoMYsBwDlSKFKjc6gjGXPDw3FNL3Nbwq5L8gE+RCbGqTw49FK5Qyvg==} + + micromark-util-classify-character@2.0.0: + resolution: {integrity: sha512-S0ze2R9GH+fu41FA7pbSqNWObo/kzwf8rN/+IGlW/4tC6oACOs8B++bh+i9bVyNnwCcuksbFwsBme5OCKXCwIw==} + + micromark-util-combine-extensions@2.0.0: + resolution: {integrity: sha512-vZZio48k7ON0fVS3CUgFatWHoKbbLTK/rT7pzpJ4Bjp5JjkZeasRfrS9wsBdDJK2cJLHMckXZdzPSSr1B8a4oQ==} + + micromark-util-decode-numeric-character-reference@2.0.1: + resolution: {integrity: sha512-bmkNc7z8Wn6kgjZmVHOX3SowGmVdhYS7yBpMnuMnPzDq/6xwVA604DuOXMZTO1lvq01g+Adfa0pE2UKGlxL1XQ==} + + micromark-util-decode-string@2.0.0: + resolution: {integrity: sha512-r4Sc6leeUTn3P6gk20aFMj2ntPwn6qpDZqWvYmAG6NgvFTIlj4WtrAudLi65qYoaGdXYViXYw2pkmn7QnIFasA==} + + micromark-util-encode@2.0.0: + resolution: {integrity: sha512-pS+ROfCXAGLWCOc8egcBvT0kf27GoWMqtdarNfDcjb6YLuV5cM3ioG45Ys2qOVqeqSbjaKg72vU+Wby3eddPsA==} + + micromark-util-html-tag-name@2.0.0: + resolution: {integrity: sha512-xNn4Pqkj2puRhKdKTm8t1YHC/BAjx6CEwRFXntTaRf/x16aqka6ouVoutm+QdkISTlT7e2zU7U4ZdlDLJd2Mcw==} + + micromark-util-normalize-identifier@2.0.0: + resolution: {integrity: sha512-2xhYT0sfo85FMrUPtHcPo2rrp1lwbDEEzpx7jiH2xXJLqBuy4H0GgXk5ToU8IEwoROtXuL8ND0ttVa4rNqYK3w==} + + micromark-util-resolve-all@2.0.0: + resolution: {integrity: sha512-6KU6qO7DZ7GJkaCgwBNtplXCvGkJToU86ybBAUdavvgsCiG8lSSvYxr9MhwmQ+udpzywHsl4RpGJsYWG1pDOcA==} + + micromark-util-sanitize-uri@2.0.0: + resolution: {integrity: sha512-WhYv5UEcZrbAtlsnPuChHUAsu/iBPOVaEVsntLBIdpibO0ddy8OzavZz3iL2xVvBZOpolujSliP65Kq0/7KIYw==} + + micromark-util-subtokenize@2.0.1: + resolution: {integrity: sha512-jZNtiFl/1aY73yS3UGQkutD0UbhTt68qnRpw2Pifmz5wV9h8gOVsN70v+Lq/f1rKaU/W8pxRe8y8Q9FX1AOe1Q==} + + micromark-util-symbol@2.0.0: + resolution: {integrity: sha512-8JZt9ElZ5kyTnO94muPxIGS8oyElRJaiJO8EzV6ZSyGQ1Is8xwl4Q45qU5UOg+bGH4AikWziz0iN4sFLWs8PGw==} + + micromark-util-types@2.0.0: + resolution: {integrity: sha512-oNh6S2WMHWRZrmutsRmDDfkzKtxF+bc2VxLC9dvtrDIRFln627VsFP6fLMgTryGDljgLPjkrzQSDcPrjPyDJ5w==} + + micromark@4.0.0: + resolution: {integrity: sha512-o/sd0nMof8kYff+TqcDx3VSrgBTcZpSvYcAHIfHhv5VAuNmisCxjhx6YmxS8PFEpb9z5WKWKPdzf0jM23ro3RQ==} micromatch@4.0.5: resolution: {integrity: sha512-DMy+ERcEW2q8Z2Po+WNXuw3c5YaUSFjAO5GsJqfEl7UjvtIuFKO6ZrKvcItdy98dwFI2N1tg3zNIdKaQT+aNdA==} @@ -9424,6 +9703,10 @@ packages: resolution: {integrity: sha512-LPP/3KorzCwBxfeUuZmaR6bG2kdeHSbe0P2tY3FLRU4vYrjYz5hI4QZwV0njUx3jeuKe67YukQ1LSPZBKDqO/Q==} engines: {node: '>=8.6'} + miller-rabin@4.0.1: + resolution: {integrity: sha512-115fLhvZVqWwHPbClyntxEVfVDfl9DLLTuJvq3g2O/Oxi8AiNouAHvDSzHS0viUJc+V5vm3eq91Xwqn9dp4jRA==} + hasBin: true + mime-db@1.33.0: resolution: {integrity: sha512-BHJ/EKruNIqJf/QahvxwQZXKygOQ256myeN/Ew+THcAa5q+PjyTTMMeNQC4DZw5AwfvelsUrA6B67NKMqXDbzQ==} engines: {node: '>= 0.6'} @@ -9465,6 +9748,12 @@ packages: minimal-request-promise@1.5.0: resolution: {integrity: sha512-/yNNjR3sxetX7sdX1f9ttHfDjajNKpngpz9ir3jZwKAT+I4tfBOqAiFNIEdDthU/mTd4osaO1HuU/GwR8iNJyg==} + minimalistic-assert@1.0.1: + resolution: {integrity: sha512-UtJcAD4yEaGtjPezWuO9wC4nwUnVH/8/Im3yEHQP4b67cXlD/Qr9hdITCU1xDbSEXg2XKNaP8jsReV7vQd00/A==} + + minimalistic-crypto-utils@1.0.1: + resolution: {integrity: sha512-JIYlbt6g8i5jKfJ3xz7rF0LXmv2TkDxBLUkiBeZ7bAx4GnnNMr8xFpGnOxn6GhTEHx3SjRrZEoU+j04prX1ktg==} + minimatch@3.0.5: resolution: {integrity: sha512-tUpxzX0VAzJHjLu0xUfFv1gwVp9ba3IOuRAVH2EGuRW8a5emA2FlACLqiT/lDVtS1W+TGNwqz3sWaNyLgDJWuw==} @@ -9614,8 +9903,8 @@ packages: nested-error-stacks@2.1.1: resolution: {integrity: sha512-9iN1ka/9zmX1ZvLV9ewJYEk9h7RyRRtqdK0woXcqohu8EWIerfPUjYJPg0ULy0UqP7cslmdGc8xKDJcojlKiaw==} - next@14.2.5: - resolution: {integrity: sha512-0f8aRfBVL+mpzfBjYfQuLWh2WyAwtJXCRfkPF4UJ5qd2YwrHczsrSzXU4tRMV0OAxR8ZJZWPFn6uhSC56UTsLA==} + next@14.2.8: + resolution: {integrity: sha512-EyEyJZ89r8C5FPlS/401AiF3O8jeMtHIE+bLom9MwcdWJJFBgRl+MR/2VgO0v5bI6tQORNY0a0DR5sjpFNrjbg==} engines: {node: '>=18.17.0'} hasBin: true peerDependencies: @@ -9632,16 +9921,34 @@ packages: sass: optional: true - nice-napi@1.0.2: - resolution: {integrity: sha512-px/KnJAJZf5RuBGcfD+Sp2pAKq0ytz8j+1NehvgIGFkvtvFrDM3T8E4x/JJODXK9WZow8RRGrbA9QQ3hs+pDhA==} - os: ['!win32'] - - nise@5.1.4: - resolution: {integrity: sha512-8+Ib8rRJ4L0o3kfmyVCL7gzrohyDe0cMFTBa2d364yIrEGMEoetznKJx899YxjybU6bL9SQkYPSBBs1gyYs8Xg==} - - no-case@3.0.4: - resolution: {integrity: sha512-fgAN3jGAh+RoxUGZHTSOLJIqUc2wmoBwGR4tbpNAKmmovFoWq0OdRkb0VkldReO2a2iBT/OEulG9XSUc10r3zg==} - + next@14.2.9: + resolution: {integrity: sha512-3CzBNo6BuJnRjcQvRw+irnU1WiuJNZEp+dkzkt91y4jeIDN/Emg95F+takSYiLpJ/HkxClVQRyqiTwYce5IVqw==} + engines: {node: '>=18.17.0'} + hasBin: true + peerDependencies: + '@opentelemetry/api': ^1.1.0 + '@playwright/test': ^1.41.2 + react: ^18.2.0 + react-dom: ^18.2.0 + sass: ^1.3.0 + peerDependenciesMeta: + '@opentelemetry/api': + optional: true + '@playwright/test': + optional: true + sass: + optional: true + + nice-napi@1.0.2: + resolution: {integrity: sha512-px/KnJAJZf5RuBGcfD+Sp2pAKq0ytz8j+1NehvgIGFkvtvFrDM3T8E4x/JJODXK9WZow8RRGrbA9QQ3hs+pDhA==} + os: ['!win32'] + + nise@6.0.0: + resolution: {integrity: sha512-K8ePqo9BFvN31HXwEtTNGzgrPpmvgciDsFz8aztFjt4LqKO/JeFD8tBOeuDiCMXrIl/m1YvfH8auSpxfaD09wg==} + + no-case@3.0.4: + resolution: {integrity: sha512-fgAN3jGAh+RoxUGZHTSOLJIqUc2wmoBwGR4tbpNAKmmovFoWq0OdRkb0VkldReO2a2iBT/OEulG9XSUc10r3zg==} + nocache@3.0.4: resolution: {integrity: sha512-WDD0bdg9mbq6F4mRxEYcPWwfA1vxd0mrvKOyxI7Xj/atfRHVeutzuWByG//jfm4uPzp0y4Kj051EORCBSQMycw==} engines: {node: '>=12.0.0'} @@ -9702,6 +10009,10 @@ packages: node-releases@2.0.18: resolution: {integrity: sha512-d9VeXT4SJ7ZeOqGX6R5EM022wpL+eWPooLI+5UpWn2jCT1aosUQEhQP214x33Wkwx3JQMvIm+tIoVOdodFS40g==} + node-stdlib-browser@1.2.0: + resolution: {integrity: sha512-VSjFxUhRhkyed8AtLwSCkMrJRfQ3e2lGtG3sP6FEgaLKBBbxM/dLfjRe1+iLhjvyLFW3tBQ8+c0pcOtXGbAZJg==} + engines: {node: '>=10'} + node-stream-zip@1.15.0: resolution: {integrity: sha512-LN4fydt9TqhZhThkZIVQnF9cwjU3qmUH9h78Mx/K7d3VvfRqqwthLwJEUOEL0QPZ0XQmNN7be5Ggit5+4dq3Bw==} engines: {node: '>=0.12.0'} @@ -9789,8 +10100,8 @@ packages: nwsapi@2.2.7: resolution: {integrity: sha512-ub5E4+FBPKwAZx0UwIQOjYWGHTEq5sPqHQNRN8Z9e4A7u3Tj1weLJsL59yH9vmvqEtBHaOmT6cYQKIZOxp35FQ==} - nx@19.6.0: - resolution: {integrity: sha512-vWpmLna/MRk772ichxPlwUmWpJu5FImBXLfii4sFj0KIFA8lG7YiKiK7jiiog0TQXE/B3m7VYvrn2/RuPpLsmg==} + nx@19.7.0: + resolution: {integrity: sha512-SZOnoCqPl8yJyPWt721INotFcgRlmBmGKUvXJ+wwnLidNKoUbX1RICIAceWkpZwaVZ2c/fqKYqjXLtGEblyZng==} hasBin: true peerDependencies: '@swc-node/register': ^1.8.0 @@ -9825,6 +10136,10 @@ packages: object-inspect@1.13.1: resolution: {integrity: sha512-5qoj1RUiKOMsCCNLV1CBiPYE10sziTsnmNxkAI/rZhiD63CF7IqdFGC/XzjWjpSgLf0LxXX3bDFIh0E18f6UhQ==} + object-is@1.1.6: + resolution: {integrity: sha512-F8cZ+KfGlSGi09lJT7/Nd6KJZ9ygtvYC0/UYYLI9nmQKLMnydpB9yvbv9K1uSkEu7FU9vYPmVwLg328tX+ot3Q==} + engines: {node: '>= 0.4'} + object-keys@0.4.0: resolution: {integrity: sha512-ncrLw+X55z7bkl5PnUvHwFK9FcGuFYo9gtjws2XtSzL+aZ8tm830P60WJ0dSmFVaSalWieW5MD7kEdnXda9yJw==} @@ -9897,6 +10212,12 @@ packages: resolution: {integrity: sha512-XgFPPM+B28FtCCgSb9I+s9szOC1vZRSwgWsRUA5ylIxRTgKozqjOCrVOqGsYABPYK5qnfqClxZTFBa8PKt2v6Q==} engines: {node: '>=12'} + openapi-fetch@0.11.1: + resolution: {integrity: sha512-WtDQsrvxjXuCmo6u6WMQPfUaya8cLfL+ZCaXorPo9MMumqlU/Km/SrCXsEcJH234D4iykOkvJ6Q/iWBzK7+3rA==} + + openapi-typescript-helpers@0.0.12: + resolution: {integrity: sha512-FO+5kTWO6KDutigamr2MRwciYkAUYhqdctlyVRrQOe2uxif2/O2+GcS07jNnP36AUK6ubSsGu3GeBiYIc6eQzA==} + opener@1.5.2: resolution: {integrity: sha512-ur5UIdyw5Y7yEj9wLzhqXiy6GZ3Mwx0yGI+5sMn2r0N0v3cKJvUmFH5yPP+WXh9e0xfyzyJX95D8l088DNFj7A==} hasBin: true @@ -9917,6 +10238,9 @@ packages: resolution: {integrity: sha512-5b6Y85tPxZZ7QytO+BQzysW31HJku27cRIlkbAXaNx+BdcVi+LlRFmVXzeF6a7JCwJpyw5c4b+YSVImQIrBpuQ==} engines: {node: '>=10'} + os-browserify@0.3.0: + resolution: {integrity: sha512-gjcpUc3clBf9+210TRaDWbf+rZZZEshZ+DlXMRCeAjp0xhTrnQsKHypIy1J3d5hKdUzj69t708EHtU8P6bUn0A==} + os-tmpdir@1.0.2: resolution: {integrity: sha512-D2FR03Vir7FIu45XBY20mTb+/ZSWB00sjU9jdQXt83gDrI4Ztz5Fs7/yy74g2N5SVQY4xY1qDr4rNddwYRVX0g==} engines: {node: '>=0.10.0'} @@ -10050,6 +10374,10 @@ packages: resolution: {integrity: sha512-GQ2EWRpQV8/o+Aw8YqtfZZPfNRWZYkbidE9k5rpl/hC3vtHHBfGm2Ifi6qWV+coDGkrUKZAxE3Lot5kcsRlh+g==} engines: {node: '>=6'} + parse-asn1@5.1.7: + resolution: {integrity: sha512-CTM5kuWR3sx9IFamcl5ErfPl6ea/N8IYwiJ+vpeB2g+1iknv7zBl5uPwbMbRVznRVbrNY6lGuDoE5b30grmbqg==} + engines: {node: '>= 0.10'} + parse-code-context@1.0.0: resolution: {integrity: sha512-OZQaqKaQnR21iqhlnPfVisFjBWjhnMl5J9MgbP8xC+EwoVqbXrq78lp+9Zb3ahmLzrIX5Us/qbvBnaS3hkH6OA==} engines: {node: '>=6'} @@ -10061,9 +10389,6 @@ packages: parse-diff@0.7.1: resolution: {integrity: sha512-1j3l8IKcy4yRK2W4o9EYvJLSzpAVwz4DXqCewYyx2vEwk2gcf3DBPqc8Fj4XV3K33OYJ08A8fWwyu/ykD/HUSg==} - parse-entities@2.0.0: - resolution: {integrity: sha512-kkywGpCcRYhqQIchaWqZ875wzpS/bMKhz5HnN3p7wveJTkTtyAB/AlnS0f8DFSqYW1T82t6yEAkEcB+A1I3MbQ==} - parse-git-config@2.0.3: resolution: {integrity: sha512-Js7ueMZOVSZ3tP8C7E3KZiHv6QQl7lnJ+OkbxoaFazzSa2KyEHqApfGbU3XboUgUnq4ZuUmskUpYKTNx01fm5A==} engines: {node: '>=6'} @@ -10108,6 +10433,9 @@ packages: pascal-case@3.1.2: resolution: {integrity: sha512-uWlGT3YSnK9x3BQJaOdcZwrnV6hPpd8jFH1/ucpiLRPh/2zCVJKS19E4GvYHvaCcACn3foXZ0cLB9Wrx1KGe5g==} + path-browserify@1.0.1: + resolution: {integrity: sha512-b7uo2UCUOYZcnF/3ID0lulOJi/bafxa1xPe7ZPsammBSpjSWQkjNxlt635YGS2MiR9GjvuXCtz2emr3jbsz98g==} + path-exists@3.0.0: resolution: {integrity: sha512-bpC7GYwiDYQ4wYLe+FA8lhRjhQCMcQGuSgGGqDkg/QerRWw9CmGRT0iSOVRSZJ29NMLZgIzqaljJ63oaL4NIJQ==} engines: {node: '>=4'} @@ -10149,9 +10477,6 @@ packages: path-to-regexp@0.1.7: resolution: {integrity: sha512-5DFkuoqlv1uYQKxy8omFBeJPQcdoE07Kv2sferDCrAq1ohOU+MSDswDIbnx3YAM60qIOnYa53wBhXW0EbMonrQ==} - path-to-regexp@1.8.0: - resolution: {integrity: sha512-n43JRhlUKUAlibEJhPeir1ncUID16QnEjNpwzNdO3Lm4ywrBpBZ5oLD0I6br9evr1Y9JTqwRtAh7JLoOzAQdVA==} - path-to-regexp@2.2.1: resolution: {integrity: sha512-gu9bD6Ta5bwGrrU8muHzVOBFFREpp2iRkVfhBJahwJ6p6Xw20SjT0MxLnwkjOibQmGSYhiUnf2FLe7k+jcFmGQ==} @@ -10183,6 +10508,10 @@ packages: pause-stream@0.0.11: resolution: {integrity: sha512-e3FBlXLmN/D1S+zHzanP4E/4Z60oFAa3O051qt1pxa7DEJWKAyil6upYVXCWadEnuoqa4Pkc9oUx9zsxYeRv8A==} + pbkdf2@3.1.2: + resolution: {integrity: sha512-iuh7L6jA7JEGu2WxDwtQP1ddOpaJNC4KlDEFfdQajSGgGPNi4OyDc2R7QnbY2bR9QjBVGwgvTdNJZoE7RaxUMA==} + engines: {node: '>=0.12'} + peek-stream@1.1.3: resolution: {integrity: sha512-FhJ+YbOSBb9/rIl2ZeE/QHEsWn7PqNYt8ARAY3kIgNGOk13g9FGyIY6JIl/xB/3TFRVoTv5as0l11weORrTekA==} @@ -10234,6 +10563,10 @@ packages: resolution: {integrity: sha512-HRDzbaKjC+AOWVXxAU/x54COGeIv9eb+6CkDSQoNTt4XyWoIJvuPsXizxu/Fr23EiekbtZwmh1IcIG/l/a10GQ==} engines: {node: '>=8'} + pkg-dir@5.0.0: + resolution: {integrity: sha512-NPE8TDbzl/3YQYY7CSS228s3g2ollTFnc+Qi3tqmqJp9Vg2ovUpixcJEo2HJScN2Ez+kEaal6y70c0ehqJBJeA==} + engines: {node: '>=10'} + pkg-dir@7.0.0: resolution: {integrity: sha512-Ie9z/WINcxxLp27BKOCHGde4ITq9UklYKDzVo1nhk5sqGEXU3FpkwP5GM2voTGJkGd9B3Otl+Q4uwSOeSUtOBA==} engines: {node: '>=14.16'} @@ -10258,9 +10591,6 @@ packages: engines: {node: '>=18'} hasBin: true - please-upgrade-node@3.2.0: - resolution: {integrity: sha512-gQR3WpIgNIKwBMVLkpMUeR3e1/E1y42bqDQZfql+kDeXd8COYfM8PQA4X6y7a8u9Ua9FHmsrrmirW2vHs45hWg==} - possible-typed-array-names@1.0.0: resolution: {integrity: sha512-d7Uw+eZoloe0EHDIYoe+bQ5WXnGMOpmiZFTuMWCwpjzzkL2nTjcKiAk4hh8TjnGye2TwWOk3UXucZ+3rbmBa8Q==} engines: {node: '>= 0.4'} @@ -10366,8 +10696,8 @@ packages: resolution: {integrity: sha512-Wglpdk03BSfXkHoQa3b/oulrotAkwrlLDRSOb9D0bN86FdRyE9lppSp33aHNPgBa0JKCoB+drFLZkQoRRYae5A==} engines: {node: ^10 || ^12 || >=14} - postcss@8.4.41: - resolution: {integrity: sha512-TesUflQ0WKZqAvg52PWL6kHgLKP6xB6heTOdoYM0Wt2UHyxNa4K25EZZMgKns3BH1RLVbZCREPpLY0rhnNoHVQ==} + postcss@8.4.45: + resolution: {integrity: sha512-7KTLTdzdZZYscUc65XmjFiB73vBhBfbPztCYdUNvlaso9PrzjzcmjqBPR0lNGkcVlcO4BjiO5rK/qNz+XAen1Q==} engines: {node: ^10 || ^12 || >=14} prelude-ls@1.2.1: @@ -10502,6 +10832,9 @@ packages: psl@1.9.0: resolution: {integrity: sha512-E/ZsdU4HLs/68gYzgGTkMicWTLPdAftJLfJFlLUAAKZGkStNU72sZjT66SnMDVOfOWY/YAoiD7Jxa9iHvngcag==} + public-encrypt@4.0.3: + resolution: {integrity: sha512-zVpa8oKZSz5bTMTFClc1fQOnyyEzpl5ozpi1B5YcvBrdohMjH2rfsBtyXcuNuwjsDIXmBYlF2N5FlJYhR29t8Q==} + pump@2.0.1: resolution: {integrity: sha512-ruPMNRkN3MHP1cWJc9OWr+T/xDP0jhXYCLfJcBuX54hhfIBnaQmAUMfDcG4DM5UMWByBbJY69QSphm3jtDKIkA==} @@ -10541,10 +10874,14 @@ packages: resolution: {integrity: sha512-MvjoMCJwEarSbUYk5O+nmoSzSutSsTwF85zcHPQ9OrlFoZOYIjaqBAJIqIXjptyD5vThxGq52Xu/MaJzRkIk4Q==} engines: {node: '>=0.6'} - qs@6.12.0: - resolution: {integrity: sha512-trVZiI6RMOkO476zLGaBIzszOdFPnCCXHPG9kn0yuS1uz6xdVxPfZdB3vUig9pxPFDM9BRAgz/YUIVQ1/vuiUg==} + qs@6.13.0: + resolution: {integrity: sha512-+38qI9SOr8tfZ4QmJNplMUxqjbe7LKvvZgWdExBOmd+egZTtjLB67Gu0HRX3u/XOq7UU2Nx6nsjvS16Z9uwfpg==} engines: {node: '>=0.6'} + querystring-es3@0.2.1: + resolution: {integrity: sha512-773xhDQnZBMFobEiztv8LIl70ch5MSF/jUQVlhwFyBILqq96anmoctVIYz+ZRp0qbCKATTn6ev02M3r7Ga5vqA==} + engines: {node: '>=0.4.x'} + querystring@0.2.0: resolution: {integrity: sha512-X/xY82scca2tau62i9mDyU9K+I+djTMUsvwf7xnUX5GLvVzgJybOJf4Y6o9Zx3oJK/LSXg5tTZBjwzqVPaPO2g==} engines: {node: '>=0.4.x'} @@ -10573,6 +10910,9 @@ packages: randombytes@2.1.0: resolution: {integrity: sha512-vYl3iOX+4CKUWuxGi9Ukhie6fsqXqS9FE2Zaic4tNFD2N2QQaXOMFbuKK4QmDHC0JO6B1Zp41J0LpT0oR68amQ==} + randomfill@1.0.4: + resolution: {integrity: sha512-87lcbR8+MhcWcUiQ+9e+Rwx8MyR2P7qnt15ynUlbm3TU/fjbgz4GsvfSUDTemtCCtVCqb4ZcEFlyPNTh9bBTLw==} + range-parser@1.2.0: resolution: {integrity: sha512-kA5WQoNVo4t9lNx2kQNFCxKeBl5IbbSNBl1M/tLkw9WCn+hxNBAW5Qh8gdhs63CJnhjJ2zQWFoqPJP2sK1AV5A==} engines: {node: '>= 0.6'} @@ -10636,8 +10976,8 @@ packages: peerDependencies: react: '>=0.14.0' - react-intersection-observer@9.13.0: - resolution: {integrity: sha512-y0UvBfjDiXqC8h0EWccyaj4dVBWMxgEx0t5RGNzQsvkfvZwugnKwxpu70StY4ivzYuMajavwUDjH4LJyIki9Lw==} + react-intersection-observer@9.13.1: + resolution: {integrity: sha512-tSzDaTy0qwNPLJHg8XZhlyHTgGW6drFKTtvjdL+p6um12rcnp8Z5XstE+QNBJ7c64n5o0Lj4ilUleA41bmDoMw==} peerDependencies: react: ^15.0.0 || ^16.0.0 || ^17.0.0 || ^18.0.0 || ^19.0.0 react-dom: ^15.0.0 || ^16.0.0 || ^17.0.0 || ^18.0.0 || ^19.0.0 @@ -10673,8 +11013,8 @@ packages: peerDependencies: react: 18.2.0 - react-number-format@5.4.0: - resolution: {integrity: sha512-NWdICrqLhI7rAS8yUeLVd6Wr4cN7UjJ9IBTS0f/a9i7UB4x4Ti70kGnksBtZ7o4Z7YRbvCMMR/jQmkoOBa/4fg==} + react-number-format@5.4.2: + resolution: {integrity: sha512-cg//jVdS49PYDgmcYoBnMMHl4XNTMuV723ZnHD2aXYtWWWqbVF3hjQ8iB+UZEuXapLbeA8P8H+1o6ZB1lcw3vg==} peerDependencies: react: ^0.14 || ^15.0.0 || ^16.0.0 || ^17.0.0 || ^18.0.0 react-dom: ^0.14 || ^15.0.0 || ^16.0.0 || ^17.0.0 || ^18.0.0 @@ -10694,7 +11034,7 @@ packages: react-redux@8.1.3: resolution: {integrity: sha512-n0ZrutD7DaX/j9VscF+uTALI3oUPa/pO4Z3soOBIjuRn/FzVu6aehhysxZCLi6y7duMf52WNZGMl7CtuK5EnRw==} peerDependencies: - '@types/react': 18.3.3 + '@types/react': ^18.3.4 '@types/react-dom': 18.3.0 react: ^16.8 || ^17.0 || ^18.0 react-dom: ^16.8 || ^17.0 || ^18.0 @@ -10778,8 +11118,8 @@ packages: react: '>=16.13' react-dom: '>=16.13' - react-virtuoso@4.10.1: - resolution: {integrity: sha512-vDBt9AarmCjPNshw3VxPXW355ZQKSO0p9vrAJ0pi04TB6aXk+qHWTu8NuaQ3ppcd/Ub1r5ryRA4fJ2QGuH0H0g==} + react-virtuoso@4.10.3: + resolution: {integrity: sha512-9XK9wLAv8aatT1zA+VuDM548NnYd3nwg73/M46ctgZGB7HEc8v0uLTceYhkYx4TC8pXWzpzChSq9ATf4AQ3AAw==} engines: {node: '>=10'} peerDependencies: react: '>=16 || >=17 || >= 18' @@ -10845,8 +11185,8 @@ packages: readable-stream@1.0.34: resolution: {integrity: sha512-ok1qVCJuRkNmvebYikljxJA/UEsKwLl2nI1OmaqAu4/UE+h0wKCHok4XkL/gvi39OacXvw59RJUOFUkDib2rHg==} - readable-stream@2.3.7: - resolution: {integrity: sha512-Ebho8K4jIbHAxnuxi7o42OrZgF/ZTNcsZj6nRKyUmkhLFq8CHItp/fy6hQZuZmP/n3yZ9VBUbp4zz/mX8hmYPw==} + readable-stream@2.3.8: + resolution: {integrity: sha512-8p0AUk4XODgIewSi0l8Epjs+EVnWiK7NoDIEGU0HhE7+ZyY8D1IMY7odu5lRrFXGg71L15KG8QrPmum45RTtdA==} readable-stream@3.6.0: resolution: {integrity: sha512-BViHy7LKeTz4oNnkcLJ+lVSL6vpiFeX6/d3oSH8zCW7UxP2onchk+vTGB143xuFjHS3deTgkKoXXymXqymiIdA==} @@ -10944,14 +11284,14 @@ packages: resolution: {integrity: sha512-gUAyHVHPPC5wdqX/LG4LWtRYtgjxyX78oanFNTMMyFEfOqdC54s3eE82imuWKbOeqYht2CrNf64Qb8vgmmtZGA==} engines: {node: '>=4'} - remark-parse@9.0.0: - resolution: {integrity: sha512-geKatMwSzEXKHuzBNU1z676sGcDcFoChMK38TgdHJNAYfFtsfHDQG7MoJAjs6sgYMqyLduCYWDIWZIxiPeafEw==} + remark-parse@11.0.0: + resolution: {integrity: sha512-FCxlKLNGknS5ba/1lmpYijMUzX2esxW5xQqjWxw2eHFfS2MSdaHVINFmhjo+qN1WhZhNimq0dZATN9pH0IDrpA==} - remark-stringify@9.0.1: - resolution: {integrity: sha512-mWmNg3ZtESvZS8fv5PTvaPckdL4iNlCHTt8/e/8oN08nArHRHjNZMKzA/YW3+p7/lYqIw4nx1XsjCBo/AxNChg==} + remark-stringify@11.0.0: + resolution: {integrity: sha512-1OSmLd3awB/t8qdoEOMazZkNsfVTeY4fTsgzcQFdXNq8ToTN4ZGwrMnlda4K6smTFKD+GRV6O48i6Z4iKgPPpw==} - remark@13.0.0: - resolution: {integrity: sha512-HDz1+IKGtOyWN+QgBiAT0kn+2s6ovOxHyPAFGKVE81VSzJ+mq7RwHFledEvB5F1p4iJvOah/LOKdFuzvRnNLCA==} + remark@15.0.1: + resolution: {integrity: sha512-Eht5w30ruCXgFmxVUSlNWQ9iiimq07URKeFS3hNc8cUWy1llX4KDWfyEDZRycMc+znsN9Ux5/tJ/BFdgdOwA3A==} remove-accents@0.4.2: resolution: {integrity: sha512-7pXIJqJOq5tFgG1A2Zxti3Ht8jJF337m4sowbuHsW30ZnkQFnDzy9qBNhgzX8ZLW4+UBcXiiR7SwR6pokHsxiA==} @@ -10959,10 +11299,6 @@ packages: renderkid@3.0.0: resolution: {integrity: sha512-q/7VIQA8lmM1hF+jn+sFSPWGlMkSAeNYcPLmDQx2zzuiDfaLrOmumR8iaUKlenFgh0XRPIUeSPlH3A+AW3Z5pg==} - repeat-string@1.6.1: - resolution: {integrity: sha512-PV0dzCYDNfRi1jCDbJzpW7jNNDRuCOG/jI5ctQcGKt/clZD+YcPS3yIlWuTJMmESC8aevCFmWJy5wjAFgNqN6w==} - engines: {node: '>=0.10'} - require-directory@2.1.1: resolution: {integrity: sha512-fGxEI7+wsG9xrvdjsrlmL22OMTTiHRwAMroiEeMgq8gzoLC/PQr7RsRDSTLUg/bZAZtF+TVIkHc6/4RIKrui+Q==} engines: {node: '>=0.10.0'} @@ -11058,11 +11394,14 @@ packages: resolution: {integrity: sha512-l0OE8wL34P4nJH/H2ffoaniAokM2qSmrtXHmlpvYr5AVVX8msAyW0l8NVJFDxlSK4u3Uh/f41cQheDVdnYijwQ==} hasBin: true + ripemd160@2.0.2: + resolution: {integrity: sha512-ii4iagi25WusVoiC4B4lq7pbXfAp3D9v5CwfkY33vffw2+pkDjY1D8GaN7spsxvCSx8dkPqOZCEZyfxcmJG2IA==} + robust-predicates@3.0.2: resolution: {integrity: sha512-IXgzBWvWQwE6PrDI05OvmXUIruQTcoMDzRsOd5CDvHCVLcLHMTSYvOK5Cm46kWqlV3yAbuSpBZdJ5oP5OUoStg==} - rollup@4.13.0: - resolution: {integrity: sha512-3YegKemjoQnYKmsBlOHfMLVPPA5xLkQ8MHLLSw/fBrFaVkEayL51DilPpNNLq1exr98F2B1TzrV0FUlN3gWRPg==} + rollup@4.21.1: + resolution: {integrity: sha512-ZnYyKvscThhgd3M5+Qt3pmhO4jIRR5RGzaSovB6Q7rGNrK5cUncrtLmcTTJVSdcKXyZjW8X8MB0JMSuH9bcAJg==} engines: {node: '>=18.0.0', npm: '>=8.0.0'} hasBin: true @@ -11133,9 +11472,6 @@ packages: search-insights@2.13.0: resolution: {integrity: sha512-Orrsjf9trHHxFRuo9/rzm0KIWmgzE8RMlZMzuhZOJ01Rnz3D0YBAe+V6473t6/H6c7irs6Lt48brULAiRWb3Vw==} - semver-compare@1.0.0: - resolution: {integrity: sha512-YM3/ITh2MJ5MtzaM429anh+x2jiLVjqILF4m4oyQB18W7Ggea7BfqdH/wGMK7dDiMghv/6WG7znWMwUDzJiXow==} - semver@5.7.2: resolution: {integrity: sha512-cBznnQ9KjJqU67B52RMC65CMarK2600WFnbkcaiwWq3xy/5haFJlshgnpjovMVJ+Hff49d8GEn0b87C5pDQ10g==} hasBin: true @@ -11149,8 +11485,8 @@ packages: engines: {node: '>=10'} hasBin: true - semver@7.6.0: - resolution: {integrity: sha512-EnwXhrlwXMk9gKu5/flx5sv/an57AkRplG3hTK68W7FRDN+k+OWBj65M7719OkA82XLBxrcX0KSHj+X5COhOVg==} + semver@7.6.3: + resolution: {integrity: sha512-oVekP1cKtI+CTDvHWYFUcMtsK/00wmAEfyqKfNdARm8u1wNVhSgaX7A8d4UuIlUI5e84iEwOhs7ZPYRmzU9U6A==} engines: {node: '>=10'} hasBin: true @@ -11197,6 +11533,10 @@ packages: setprototypeof@1.2.0: resolution: {integrity: sha512-E5LDX7Wrp85Kil5bhZv46j8jOeboKq5JMmYM3gVGdGH8xFpPWXUMsNrlODCrkoxMEeNi/XZIwuRvY4XNwYMJpw==} + sha.js@2.4.11: + resolution: {integrity: sha512-QMEp5B7cftE7APOjk5Y6xgrbWu+WkLVQwk8JNjZ8nKRciZaByEW6MubieAiToS7+dwvrjGhH8jRXz3MVd0AYqQ==} + hasBin: true + shallow-clone@3.0.1: resolution: {integrity: sha512-/6KqX+GVUdqPuPPd2LxDDxzX6CAbjJehAAOKlNpqqUpAqPM6HeL8f+o3a+JsyGjn2lv0WY8UsTgUJjU9Ok55NA==} engines: {node: '>=8'} @@ -11207,9 +11547,9 @@ packages: shallowequal@1.1.0: resolution: {integrity: sha512-y0m1JoUZSlPAjXVtPPW70aZWfIL/dSP7AFkRnniLCrK/8MDKog3TySTBmckD+RObVxH0v4Tox67+F14PdED2oQ==} - sharp@0.33.3: - resolution: {integrity: sha512-vHUeXJU1UvlO/BNwTpT0x/r53WkLUVxrmb5JTgW92fdFCFk0ispLMAeu/jPO2vjkXM1fYUi3K7/qcLF47pwM1A==} - engines: {libvips: '>=8.15.2', node: ^18.17.0 || ^20.3.0 || >=21.0.0} + sharp@0.33.5: + resolution: {integrity: sha512-haPVm1EkS9pgvHrQ/F3Xy+hgcuMV0Wm9vfIBSiwZ05k+xgb0PkBQpGsAA/oWdDobNaZTH5ppvHtzCFbnSEwHVw==} + engines: {node: ^18.17.0 || ^20.3.0 || >=21.0.0} shebang-command@1.2.0: resolution: {integrity: sha512-EV3L1+UQWGor21OmnvojK36mhg+TyIKDh3iFBKBohr5xeXIhNBcx8oWdgkTEEQ+BEFFYdLRuqMfd5L84N1V5Vg==} @@ -11261,8 +11601,8 @@ packages: simple-swizzle@0.2.2: resolution: {integrity: sha512-JA//kQgZtbuY83m+xT+tXJkmJncGMTFT+C+g2h2R9uxkYIrE2yy9sgmcLhCnw57/WSD+Eh3J97FPEDFnbXnDUg==} - sinon@16.1.3: - resolution: {integrity: sha512-mjnWWeyxcAf9nC0bXcPmiDut+oE8HYridTNzBbF98AYVLmWwGRp2ISEpyhYflG1ifILT+eNn3BmKUJPxjXUPlA==} + sinon@18.0.0: + resolution: {integrity: sha512-+dXDXzD1sBO6HlmZDd7mXZCR/y5ECiEiGCBSGuFD/kZ0bDTofPYc6JaeGmPSF+1j1MejGUWkORbYOLDyvqCWpA==} sirv@2.0.3: resolution: {integrity: sha512-O9jm9BsID1P+0HOi81VpXPoDxYP374pkOLzACAoyUQ/3OUVndNpsz6wMnY2z+yOxzbllCKZrM+9QrWsv4THnyA==} @@ -11405,9 +11745,15 @@ packages: resolution: {integrity: sha512-iCGQj+0l0HOdZ2AEeBADlsRC+vsnDsZsbdSiH1yNSjcfKM7fdpCMfqAL/dwF5BLiw/XhRft/Wax6zQbhq2BcjQ==} engines: {node: '>= 0.4'} + stream-browserify@3.0.0: + resolution: {integrity: sha512-H73RAHsVBapbim0tU2JwwOiXUj+fikfiaoYAKHF3VJfA0pe2BCzkhAHBlLG6REzE+2WNZcxOXjK7lkso+9euLA==} + stream-combiner@0.0.4: resolution: {integrity: sha512-rT00SPnTVyRsaSz5zgSPma/aHSOic5U1prhYdRy5HS2kTZviFpmDgzilbtsJsxiroqACmayynDN/9VzIbX5DOw==} + stream-http@3.2.0: + resolution: {integrity: sha512-Oq1bLqisTyK3TSCXpPbT4sdeYNdmyZJv1LxpEm2vu1ZhK89kSE5YXwZc3cWk0MagGaKriBh9mCFbVGtO+vY29A==} + stream-shift@1.0.1: resolution: {integrity: sha512-AiisoFqQ0vbGcZgQPY1cdP2I76glaVA/RauYR4G4thNFgkTqr90yXTo4LYX60Jl+sIlPNHHdGSwo01AvbKUSVQ==} @@ -11752,6 +12098,10 @@ packages: through@2.3.8: resolution: {integrity: sha512-w89qg7PI8wAdvX60bMDP+bFoD5Dvhm9oLheFp5O4a2QF0cSBGsBX4qZmadPMvVqlLJBBci+WqGGOAPvcDeNSVg==} + timers-browserify@2.0.12: + resolution: {integrity: sha512-9phl76Cqm6FhSX9Xe1ZUAMLtm1BLkKj2Qd5ApyWkXzsMRaA7dgr81kf4wJmQf/hAvg8EEyJxDo3du/0KlhPiKQ==} + engines: {node: '>=0.6.0'} + tiny-invariant@1.3.3: resolution: {integrity: sha512-+FbBPE1o9QAYvviau/qC5SE3caw21q3xkvWKBtja5vgqOWIHHJ3ioaq1VPfn/Szqctz2bU/oYeKd9/z5BL+PVg==} @@ -11838,8 +12188,8 @@ packages: resolution: {integrity: sha512-GJtWyq9InR/2HRiLZgpIKv+ufIKrVrvjQWEj7PxAXNc5dwbNJkqhAUoAGgzRmULAnoOM5EIpveYd3J2VeSAIew==} engines: {node: '>=12'} - trough@1.0.5: - resolution: {integrity: sha512-rvuRbTarPXmMb79SmzEp8aqXNKcK+y0XaB298IXueQ8I2PsrATcPBCSPyK/dDNa2iWOhKlfNnOjdAOTBU/nkFA==} + trough@2.2.0: + resolution: {integrity: sha512-tmMpK00BjZiUyVyvrBK7knerNgmgvcV/KLVyuma/SC+TQN167GrMRciANTz09+k3zW8L8t60jWO1GpfkZdjTaw==} ts-api-utils@1.3.0: resolution: {integrity: sha512-UQMIo7pb8WRomKR1/+MFVLTroIvDVtMX3K6OUir8ynLyzB8Jeriont2bTAtmNPa1ekAgN7YPDyf6V+ygrdU+eQ==} @@ -11876,6 +12226,9 @@ packages: engines: {node: '>=18.0.0'} hasBin: true + tty-browserify@0.0.1: + resolution: {integrity: sha512-C3TaO7K81YvjCgQH9Q1S3R3P3BtN3RIM8n+OvX4il1K1zgE8ZhI0op7kClgkxtutIE8hQrcrHBXvIheqKUUCxw==} + tuf-js@2.2.1: resolution: {integrity: sha512-GwIJau9XaA8nLVbUXsN3IlFi7WmQ48gBUrl3FTkkL/XLu/POhBzfmX9hd33FNMX1qAsfl6ozO1iMmW9NC8YniA==} engines: {node: ^16.14.0 || >=18.0.0} @@ -11976,8 +12329,8 @@ packages: unbox-primitive@1.0.2: resolution: {integrity: sha512-61pPlCD9h51VoreyJ0BReideM3MDKMKnh6+V9L08331ipq6Q8OFXZYiqP6n/tbHx4s5I9uRhcye6BrbkizkBDw==} - undici-types@5.26.5: - resolution: {integrity: sha512-JlCMO+ehdEIKqlFxk6IfVoAUVmgz7cU7zD/h9XZ0qzeosSHmUJVOzSQvvYSYWXkFXC+IfLKSIffhv0sVZup6pA==} + undici-types@6.19.8: + resolution: {integrity: sha512-ve2KP6f/JnbPBFyobGHuerC9g1FYGn/F8n1LWTwNxCEzd6IfqTwUQcNXgEtmmQ6DlRrC1hrSrBnCZPokRrDHjw==} unicode-canonical-property-names-ecmascript@2.0.0: resolution: {integrity: sha512-yY5PpDlfVIU5+y/BSCxAJRBIS1Zc2dDG3Ujq+sR0U+JjUevW2JhocOF+soROYDSaAezOzOKuyyixhD6mBknSmQ==} @@ -11999,8 +12352,8 @@ packages: resolution: {integrity: sha512-lRfVq8fE8gz6QMBuDM6a+LO3IAzTi05H6gCVaUpir2E1Rwpo4ZUog45KpNXKC/Mn3Yb9UDuHumeFTo9iV/D9FQ==} engines: {node: '>=18'} - unified@9.2.2: - resolution: {integrity: sha512-Sg7j110mtefBD+qunSLO1lqOEKdrwBFBrR6Qd8f4uwkhWNlbkaqwHse6e7QvD3AP/MNoJdEDLaf8OxYyoWgorQ==} + unified@11.0.5: + resolution: {integrity: sha512-xKvGhPWw3k84Qjh8bI3ZeJjqnyadK+GEFtazSfZv/rKeTkTjOJho6mFqh2SM96iIcZokxiOpg78GazTSg8+KHA==} unique-filename@3.0.0: resolution: {integrity: sha512-afXhuC55wkAmZ0P18QsVE6kp8JaxrEokN2HGIoIVv2ijHQd419H0+6EigAFcIzXeMIkcIkNBpB3L/DXB3cTS/g==} @@ -12010,17 +12363,17 @@ packages: resolution: {integrity: sha512-WrcA6AyEfqDX5bWige/4NQfPZMtASNVxdmWR76WESYQVAACSgWcR6e9i0mofqqBxYFtL4oAxPIptY73/0YE1DQ==} engines: {node: ^14.17.0 || ^16.13.0 || >=18.0.0} - unist-util-is@4.1.0: - resolution: {integrity: sha512-ZOQSsnce92GrxSqlnEEseX0gi7GH9zTJZ0p9dtu87WRb/37mMPO2Ilx1s/t9vBHrFhbgweUwb+t7cIn5dxPhZg==} + unist-util-is@6.0.0: + resolution: {integrity: sha512-2qCTHimwdxLfz+YzdGfkqNlH0tLi9xjTnHddPmJwtIG9MGsdbutfTc4P+haPD7l7Cjxf/WZj+we5qfVPvvxfYw==} - unist-util-stringify-position@2.0.3: - resolution: {integrity: sha512-3faScn5I+hy9VleOq/qNbAd6pAx7iH5jYBMS9I1HgQVijz/4mv5Bvw5iw1sC/90CODiKo81G/ps8AJrISn687g==} + unist-util-stringify-position@4.0.0: + resolution: {integrity: sha512-0ASV06AAoKCDkS2+xw5RXJywruurpbC4JZSm7nr7MOt1ojAzvyyaO+UxZf18j8FCF6kmzCZKcAgN/yu2gm2XgQ==} - unist-util-visit-parents@3.1.1: - resolution: {integrity: sha512-1KROIZWo6bcMrZEwiH2UrXDyalAa0uqzWCxCJj6lPOvTve2WkfgCytoDTPaMnodXh1WrXOq0haVYHj99ynJlsg==} + unist-util-visit-parents@6.0.1: + resolution: {integrity: sha512-L/PqWzfTP9lzzEa6CKs0k2nARxTdZduw3zyh8d2NVBnsyvHjSX4TWse388YrrQKbvI8w20fGjGlhgT96WwKykw==} - unist-util-visit@2.0.3: - resolution: {integrity: sha512-iJ4/RczbJMkD0712mGktuGpm/U4By4FfDonL7N/9tATGIF4imikjOuagyMY53tnZq3NP6BcmlrHhEKAfGWjh7Q==} + unist-util-visit@5.0.0: + resolution: {integrity: sha512-MR04uvD+07cwl/yhVuVWAtw+3GOR/knlL55Nd/wAdblk27GCVt3lqpTivy/tkJcZoNPzTwS1Y+KMojlLDhoTzg==} universal-user-agent@6.0.0: resolution: {integrity: sha512-isyNax3wXoKaulPDZWHQqbmIx1k2tb9fb3GGDBRxCscfYV2Ch7WxPArBsFEG8s/safwXTT7H4QGhaIkTp9447w==} @@ -12076,6 +12429,10 @@ packages: url@0.10.3: resolution: {integrity: sha512-hzSUW2q06EqL1gKM/a+obYHLIO6ct2hwPuviqTTOcfFVc61UbfJ2Q32+uGL/HCPxKqrdGB5QUwIe7UqlDgwsOQ==} + url@0.11.4: + resolution: {integrity: sha512-oCwdVC7mTuWiPyjLUz/COz5TLk6wgp0RCsN+wHZ2Ekneac9w8uuV0njcbbie2ME+Vs+d6duwmYuR3HgQXs1fOg==} + engines: {node: '>= 0.4'} + urlpattern-polyfill@8.0.2: resolution: {integrity: sha512-Qp95D4TPJl1kC9SKigDcqgyM2VDVO4RiJc2d4qe5GrYm+zbIQCWWKAFaJNQ4BhdFeDGwBmAxqJBwWSJDb9T3BQ==} @@ -12142,17 +12499,22 @@ packages: resolution: {integrity: sha512-BNGbWLfd0eUPabhkXUVm0j8uuvREyTh5ovRa/dyow/BqAbZJyC+5fU+IzQOzmAKzYqYRAISoRhdQr3eIZ/PXqg==} engines: {node: '>= 0.8'} - vfile-message@2.0.4: - resolution: {integrity: sha512-DjssxRGkMvifUOJre00juHoP9DPWuzjxKuMDrhNbk2TdaYYBNMStsNhEOt3idrtI12VQYM/1+iM0KOzXi4pxwQ==} + vfile-message@4.0.2: + resolution: {integrity: sha512-jRDZ1IMLttGj41KcZvlrYAaI3CfqpLpfpf+Mfig13viT6NKvRzWZ+lXz0Y5D60w6uJIBAOGq9mSHf0gktF0duw==} - vfile@4.2.1: - resolution: {integrity: sha512-O6AE4OskCG5S1emQ/4gl8zK586RqA3srz3nfK/Viy0UPToBc5Trp9BVFb1u0CjsKrAWwnpr4ifM/KBXPWwJbCA==} + vfile@6.0.3: + resolution: {integrity: sha512-KzIbH/9tXat2u30jf+smMwFCsno4wHVdNmzFyL+T/L3UGqqk6JKfVqOFOZEpZSHADH1k40ab6NUIXZq422ov3Q==} vite-node@2.0.5: resolution: {integrity: sha512-LdsW4pxj0Ot69FAoXZ1yTnA9bjGohr2yNBU7QKRxpz8ITSkhuDl6h3zS/tvgz4qrNjeRnvrWeXQ8ZF7Um4W00Q==} engines: {node: ^18.0.0 || >=20.0.0} hasBin: true + vite-plugin-node-polyfills@0.22.0: + resolution: {integrity: sha512-F+G3LjiGbG8QpbH9bZ//GSBr9i1InSTkaulfUHFa9jkLqVGORFBoqc2A/Yu5Mmh1kNAbiAeKeK+6aaQUf3x0JA==} + peerDependencies: + vite: ^2.0.0 || ^3.0.0 || ^4.0.0 || ^5.0.0 + vite-plugin-pages@0.32.3: resolution: {integrity: sha512-1vmKwc9e+lRBLkpTAMUNSVV3BglyE+DRa0iivpe6q3pbOCGkAHHSUp8f6yceXC8+lu/kFgH60vm5vK6IHyvdVw==} peerDependencies: @@ -12171,12 +12533,12 @@ packages: vue-router: optional: true - vite@5.4.1: - resolution: {integrity: sha512-1oE6yuNXssjrZdblI9AfBbHCC41nnyoVoEZxQnID6yvQZAFBzxxkqoFLtHUMkYunL8hwOLEjgTuxpkRxvba3kA==} + vite@5.4.2: + resolution: {integrity: sha512-dDrQTRHp5C1fTFzcSaMxjk6vdpKvT+2/mIdE07Gw2ykehT49O0z/VHS3zZ8iV/Gh8BJJKHWOe5RjaNrW5xf/GA==} engines: {node: ^18.0.0 || >=20.0.0} hasBin: true peerDependencies: - '@types/node': ^18.19.44 + '@types/node': ^20.16.5 less: '*' lightningcss: ^1.21.0 sass: '*' @@ -12208,7 +12570,7 @@ packages: hasBin: true peerDependencies: '@edge-runtime/vm': '*' - '@types/node': ^18.19.44 + '@types/node': ^20.16.5 '@vitest/browser': 2.0.5 '@vitest/ui': 2.0.5 happy-dom: '*' @@ -12230,6 +12592,9 @@ packages: vlq@1.0.1: resolution: {integrity: sha512-gQpnTgkubC6hQgdIcRdYGDSDc+SaujOdyesZQMv6JlfQee/9Mp0Qhnys6WxDWvQnL5WZdT7o2Ul187aSt0Rq+w==} + vm-browserify@1.1.2: + resolution: {integrity: sha512-2ham8XPWTONajOR0ohOKOHXkm3+gaBmGut3SRuu75xLd/RRaY6vqgh8NBYYk7+RW3u5AtzPQZG8F10LHkl0lAQ==} + void-elements@2.0.1: resolution: {integrity: sha512-qZKX4RnBzH2ugr8Lxa7x+0V6XD9Sb/ouARtiasEQCHB1EVU4NXtmHsDDrx1dO4ne5fc3J6EW05BP1Dl0z0iung==} engines: {node: '>=0.10.0'} @@ -12528,8 +12893,8 @@ packages: resolution: {integrity: sha512-r3vXyErRCYJ7wg28yvBY5VSoAF8ZvlcW9/BwUzEtUsjvX/DKs24dIkuwjtuprwJJHsbyUbLApepYTR1BN4uHrg==} engines: {node: '>= 6'} - yaml@2.4.5: - resolution: {integrity: sha512-aBx2bnqDzVOyNKfsysjA2ms5ZlnjSAW2eG3/L5G/CSujfjLJTJsEw1bGw8kCf04KodQWk1pxlGnZ56CRxiawmg==} + yaml@2.5.0: + resolution: {integrity: sha512-2wWLbGbYDiSqqIKoPjar3MPgB94ErzCtrNE1FdqGuaO0pi2JGjmE8aW8TDZwzU7vuxcGRdL/4gPQwQ7hD5AMSw==} engines: {node: '>= 14'} hasBin: true @@ -12602,8 +12967,8 @@ packages: react: optional: true - zwitch@1.0.5: - resolution: {integrity: sha512-V50KMwwzqJV0NpZIZFwfOD5/lyny3WlSzRiXgA0G7VUnRlqttta1L6UQIHzd6EuBY/cHGfwTIck7w1yH6Q5zUw==} + zwitch@2.0.4: + resolution: {integrity: sha512-bXE4cR/kVZhKZX/RjPEflHaKVhUVl85noU3v6b8apfQEc1x4A+zBxjZ4lN8LqGd6WZ3dl98pY4o717VFmoPp+A==} snapshots: @@ -12729,19 +13094,24 @@ snapshots: '@jridgewell/gen-mapping': 0.3.5 '@jridgewell/trace-mapping': 0.3.25 - '@argos-ci/core@2.4.1': + '@argos-ci/api-client@0.2.0': + dependencies: + openapi-fetch: 0.11.1 + + '@argos-ci/core@2.5.0': dependencies: - '@argos-ci/util': 2.1.0 - axios: 1.7.4(debug@4.3.5) + '@argos-ci/api-client': 0.2.0 + '@argos-ci/util': 2.1.1 + axios: 1.7.4(debug@4.3.6) convict: 6.2.4 - debug: 4.3.5(supports-color@8.1.1) + debug: 4.3.6(supports-color@8.1.1) fast-glob: 3.3.2 - sharp: 0.33.3 + sharp: 0.33.5 tmp: 0.2.3 transitivePeerDependencies: - supports-color - '@argos-ci/util@2.1.0': {} + '@argos-ci/util@2.1.1': {} '@babel/cli@7.24.8(@babel/core@7.25.2)': dependencies: @@ -12777,7 +13147,7 @@ snapshots: '@babel/traverse': 7.25.3 '@babel/types': 7.25.2 convert-source-map: 2.0.0 - debug: 4.3.5(supports-color@8.1.1) + debug: 4.3.6(supports-color@8.1.1) gensync: 1.0.0-beta.2 json5: 2.2.3 semver: 6.3.1 @@ -12837,7 +13207,7 @@ snapshots: '@babel/core': 7.25.2 '@babel/helper-compilation-targets': 7.25.2 '@babel/helper-plugin-utils': 7.24.8 - debug: 4.3.5(supports-color@8.1.1) + debug: 4.3.6(supports-color@8.1.1) lodash.debounce: 4.0.8 resolve: 1.22.8 transitivePeerDependencies: @@ -13741,7 +14111,7 @@ snapshots: '@babel/parser': 7.25.3 '@babel/template': 7.25.0 '@babel/types': 7.25.2 - debug: 4.3.5(supports-color@8.1.1) + debug: 4.3.6(supports-color@8.1.1) globals: 11.12.0 transitivePeerDependencies: - supports-color @@ -13780,7 +14150,7 @@ snapshots: csstype: 3.1.3 lodash.mergewith: 4.6.2 - '@chakra-ui/system@2.6.2(@emotion/react@11.13.0(@types/react@18.3.3)(react@18.3.1))(@emotion/styled@11.13.0(@emotion/react@11.13.0(@types/react@18.3.3)(react@18.3.1))(@types/react@18.3.3)(react@18.3.1))(react@18.3.1)': + '@chakra-ui/system@2.6.2(@emotion/react@11.13.3(@types/react@18.3.4)(react@18.3.1))(@emotion/styled@11.13.0(@emotion/react@11.13.3(@types/react@18.3.4)(react@18.3.1))(@types/react@18.3.4)(react@18.3.1))(react@18.3.1)': dependencies: '@chakra-ui/color-mode': 2.2.0(react@18.3.1) '@chakra-ui/object-utils': 2.1.0 @@ -13788,8 +14158,8 @@ snapshots: '@chakra-ui/styled-system': 2.9.2 '@chakra-ui/theme-utils': 2.0.21 '@chakra-ui/utils': 2.0.15 - '@emotion/react': 11.13.0(@types/react@18.3.3)(react@18.3.1) - '@emotion/styled': 11.13.0(@emotion/react@11.13.0(@types/react@18.3.3)(react@18.3.1))(@types/react@18.3.3)(react@18.3.1) + '@emotion/react': 11.13.3(@types/react@18.3.4)(react@18.3.1) + '@emotion/styled': 11.13.0(@emotion/react@11.13.3(@types/react@18.3.4)(react@18.3.1))(@types/react@18.3.4)(react@18.3.1) react: 18.3.1 react-fast-compare: 3.2.2 @@ -13842,14 +14212,14 @@ snapshots: '@docsearch/css@3.6.1': {} - '@docsearch/react@3.6.1(@algolia/client-search@4.23.0)(@types/react@18.3.3)(react-dom@18.3.1(react@18.3.1))(react@18.3.1)(search-insights@2.13.0)': + '@docsearch/react@3.6.1(@algolia/client-search@4.23.0)(@types/react@18.3.4)(react-dom@18.3.1(react@18.3.1))(react@18.3.1)(search-insights@2.13.0)': dependencies: '@algolia/autocomplete-core': 1.9.3(@algolia/client-search@4.23.0)(algoliasearch@4.19.1)(search-insights@2.13.0) '@algolia/autocomplete-preset-algolia': 1.9.3(@algolia/client-search@4.23.0)(algoliasearch@4.19.1) '@docsearch/css': 3.6.1 algoliasearch: 4.19.1 optionalDependencies: - '@types/react': 18.3.3 + '@types/react': 18.3.4 react: 18.3.1 react-dom: 18.3.1(react@18.3.1) search-insights: 2.13.0 @@ -13861,7 +14231,7 @@ snapshots: '@emnapi/wasi-threads': 1.0.1 tslib: 2.6.2 - '@emnapi/runtime@1.1.1': + '@emnapi/runtime@1.2.0': dependencies: tslib: 2.6.2 @@ -13875,7 +14245,7 @@ snapshots: '@babel/runtime': 7.25.0 '@emotion/hash': 0.9.2 '@emotion/memoize': 0.9.0 - '@emotion/serialize': 1.3.0 + '@emotion/serialize': 1.3.1 babel-plugin-macros: 3.1.0 convert-source-map: 1.8.0 escape-string-regexp: 4.0.0 @@ -13897,7 +14267,7 @@ snapshots: dependencies: '@emotion/babel-plugin': 11.12.0 '@emotion/cache': 11.13.1 - '@emotion/serialize': 1.3.0 + '@emotion/serialize': 1.3.1 '@emotion/sheet': 1.4.0 '@emotion/utils': 1.4.0 transitivePeerDependencies: @@ -13931,27 +14301,27 @@ snapshots: '@emotion/memoize@0.9.0': {} - '@emotion/react@11.13.0(@types/react@18.3.3)(react@18.3.1)': + '@emotion/react@11.13.3(@types/react@18.3.4)(react@18.3.1)': dependencies: '@babel/runtime': 7.25.0 '@emotion/babel-plugin': 11.12.0 '@emotion/cache': 11.13.1 - '@emotion/serialize': 1.3.0 + '@emotion/serialize': 1.3.1 '@emotion/use-insertion-effect-with-fallbacks': 1.1.0(react@18.3.1) '@emotion/utils': 1.4.0 '@emotion/weak-memoize': 0.4.0 hoist-non-react-statics: 3.3.2 react: 18.3.1 optionalDependencies: - '@types/react': 18.3.3 + '@types/react': 18.3.4 transitivePeerDependencies: - supports-color - '@emotion/serialize@1.3.0': + '@emotion/serialize@1.3.1': dependencies: '@emotion/hash': 0.9.2 '@emotion/memoize': 0.9.0 - '@emotion/unitless': 0.9.0 + '@emotion/unitless': 0.10.0 '@emotion/utils': 1.4.0 csstype: 3.1.3 @@ -13966,24 +14336,24 @@ snapshots: '@emotion/sheet@1.4.0': {} - '@emotion/styled@11.13.0(@emotion/react@11.13.0(@types/react@18.3.3)(react@18.3.1))(@types/react@18.3.3)(react@18.3.1)': + '@emotion/styled@11.13.0(@emotion/react@11.13.3(@types/react@18.3.4)(react@18.3.1))(@types/react@18.3.4)(react@18.3.1)': dependencies: '@babel/runtime': 7.25.0 '@emotion/babel-plugin': 11.12.0 '@emotion/is-prop-valid': 1.3.0 - '@emotion/react': 11.13.0(@types/react@18.3.3)(react@18.3.1) - '@emotion/serialize': 1.3.0 + '@emotion/react': 11.13.3(@types/react@18.3.4)(react@18.3.1) + '@emotion/serialize': 1.3.1 '@emotion/use-insertion-effect-with-fallbacks': 1.1.0(react@18.3.1) '@emotion/utils': 1.4.0 react: 18.3.1 optionalDependencies: - '@types/react': 18.3.3 + '@types/react': 18.3.4 transitivePeerDependencies: - supports-color - '@emotion/unitless@0.8.1': {} + '@emotion/unitless@0.10.0': {} - '@emotion/unitless@0.9.0': {} + '@emotion/unitless@0.8.1': {} '@emotion/use-insertion-effect-with-fallbacks@1.1.0(react@18.3.1)': dependencies: @@ -14144,7 +14514,7 @@ snapshots: '@eslint/eslintrc@2.1.4': dependencies: ajv: 6.12.6 - debug: 4.3.5(supports-color@8.1.1) + debug: 4.3.6(supports-color@8.1.1) espree: 9.6.1 globals: 13.24.0 ignore: 5.3.1 @@ -14159,7 +14529,7 @@ snapshots: '@fast-csv/format@4.3.5': dependencies: - '@types/node': 18.19.44 + '@types/node': 20.16.5 lodash.escaperegexp: 4.1.2 lodash.isboolean: 3.0.3 lodash.isequal: 4.5.0 @@ -14168,7 +14538,7 @@ snapshots: '@fast-csv/parse@4.3.6': dependencies: - '@types/node': 18.19.44 + '@types/node': 20.16.5 lodash.escaperegexp: 4.1.2 lodash.groupby: 4.6.0 lodash.isfunction: 3.0.9 @@ -14212,12 +14582,12 @@ snapshots: '@gitbeaker/core@38.12.1': dependencies: '@gitbeaker/requester-utils': 38.12.1 - qs: 6.12.0 + qs: 6.13.0 xcase: 2.0.1 '@gitbeaker/requester-utils@38.12.1': dependencies: - qs: 6.12.0 + qs: 6.13.0 xcase: 2.0.1 '@gitbeaker/rest@38.12.1': @@ -14225,7 +14595,7 @@ snapshots: '@gitbeaker/core': 38.12.1 '@gitbeaker/requester-utils': 38.12.1 - '@googleapis/sheets@9.1.0(encoding@0.1.13)': + '@googleapis/sheets@9.3.1(encoding@0.1.13)': dependencies: googleapis-common: 7.0.0(encoding@0.1.13) transitivePeerDependencies: @@ -14241,7 +14611,7 @@ snapshots: '@humanwhocodes/config-array@0.11.14': dependencies: '@humanwhocodes/object-schema': 2.0.3 - debug: 4.3.5(supports-color@8.1.1) + debug: 4.3.6(supports-color@8.1.1) minimatch: 3.1.2 transitivePeerDependencies: - supports-color @@ -14252,79 +14622,79 @@ snapshots: '@hutson/parse-repository-url@3.0.2': {} - '@img/sharp-darwin-arm64@0.33.3': + '@img/sharp-darwin-arm64@0.33.5': optionalDependencies: - '@img/sharp-libvips-darwin-arm64': 1.0.2 + '@img/sharp-libvips-darwin-arm64': 1.0.4 optional: true - '@img/sharp-darwin-x64@0.33.3': + '@img/sharp-darwin-x64@0.33.5': optionalDependencies: - '@img/sharp-libvips-darwin-x64': 1.0.2 + '@img/sharp-libvips-darwin-x64': 1.0.4 optional: true - '@img/sharp-libvips-darwin-arm64@1.0.2': + '@img/sharp-libvips-darwin-arm64@1.0.4': optional: true - '@img/sharp-libvips-darwin-x64@1.0.2': + '@img/sharp-libvips-darwin-x64@1.0.4': optional: true - '@img/sharp-libvips-linux-arm64@1.0.2': + '@img/sharp-libvips-linux-arm64@1.0.4': optional: true - '@img/sharp-libvips-linux-arm@1.0.2': + '@img/sharp-libvips-linux-arm@1.0.5': optional: true - '@img/sharp-libvips-linux-s390x@1.0.2': + '@img/sharp-libvips-linux-s390x@1.0.4': optional: true - '@img/sharp-libvips-linux-x64@1.0.2': + '@img/sharp-libvips-linux-x64@1.0.4': optional: true - '@img/sharp-libvips-linuxmusl-arm64@1.0.2': + '@img/sharp-libvips-linuxmusl-arm64@1.0.4': optional: true - '@img/sharp-libvips-linuxmusl-x64@1.0.2': + '@img/sharp-libvips-linuxmusl-x64@1.0.4': optional: true - '@img/sharp-linux-arm64@0.33.3': + '@img/sharp-linux-arm64@0.33.5': optionalDependencies: - '@img/sharp-libvips-linux-arm64': 1.0.2 + '@img/sharp-libvips-linux-arm64': 1.0.4 optional: true - '@img/sharp-linux-arm@0.33.3': + '@img/sharp-linux-arm@0.33.5': optionalDependencies: - '@img/sharp-libvips-linux-arm': 1.0.2 + '@img/sharp-libvips-linux-arm': 1.0.5 optional: true - '@img/sharp-linux-s390x@0.33.3': + '@img/sharp-linux-s390x@0.33.5': optionalDependencies: - '@img/sharp-libvips-linux-s390x': 1.0.2 + '@img/sharp-libvips-linux-s390x': 1.0.4 optional: true - '@img/sharp-linux-x64@0.33.3': + '@img/sharp-linux-x64@0.33.5': optionalDependencies: - '@img/sharp-libvips-linux-x64': 1.0.2 + '@img/sharp-libvips-linux-x64': 1.0.4 optional: true - '@img/sharp-linuxmusl-arm64@0.33.3': + '@img/sharp-linuxmusl-arm64@0.33.5': optionalDependencies: - '@img/sharp-libvips-linuxmusl-arm64': 1.0.2 + '@img/sharp-libvips-linuxmusl-arm64': 1.0.4 optional: true - '@img/sharp-linuxmusl-x64@0.33.3': + '@img/sharp-linuxmusl-x64@0.33.5': optionalDependencies: - '@img/sharp-libvips-linuxmusl-x64': 1.0.2 + '@img/sharp-libvips-linuxmusl-x64': 1.0.4 optional: true - '@img/sharp-wasm32@0.33.3': + '@img/sharp-wasm32@0.33.5': dependencies: - '@emnapi/runtime': 1.1.1 + '@emnapi/runtime': 1.2.0 optional: true - '@img/sharp-win32-ia32@0.33.3': + '@img/sharp-win32-ia32@0.33.5': optional: true - '@img/sharp-win32-x64@0.33.3': + '@img/sharp-win32-x64@0.33.5': optional: true '@isaacs/cliui@8.0.2': @@ -14358,14 +14728,14 @@ snapshots: dependencies: '@jest/fake-timers': 29.7.0 '@jest/types': 29.6.3 - '@types/node': 18.19.44 + '@types/node': 20.16.5 jest-mock: 29.7.0 '@jest/fake-timers@29.7.0': dependencies: '@jest/types': 29.6.3 '@sinonjs/fake-timers': 10.3.0 - '@types/node': 18.19.44 + '@types/node': 20.16.5 jest-message-util: 29.7.0 jest-mock: 29.7.0 jest-util: 29.7.0 @@ -14378,7 +14748,7 @@ snapshots: dependencies: '@types/istanbul-lib-coverage': 2.0.6 '@types/istanbul-reports': 3.0.4 - '@types/node': 18.19.44 + '@types/node': 20.16.5 '@types/yargs': 15.0.19 chalk: 4.1.2 @@ -14387,7 +14757,7 @@ snapshots: '@jest/schemas': 29.6.3 '@types/istanbul-lib-coverage': 2.0.6 '@types/istanbul-reports': 3.0.4 - '@types/node': 18.19.44 + '@types/node': 20.16.5 '@types/yargs': 17.0.33 chalk: 4.1.2 @@ -14418,7 +14788,7 @@ snapshots: '@npmcli/arborist': 7.5.4 '@npmcli/package-json': 5.2.0 '@npmcli/run-script': 8.1.0 - '@nx/devkit': 17.2.8(nx@19.6.0) + '@nx/devkit': 17.2.8(nx@19.7.0) '@octokit/plugin-enterprise-rest': 6.0.1 '@octokit/rest': 19.0.11(encoding@0.1.13) aproba: 2.0.0 @@ -14457,7 +14827,7 @@ snapshots: npm-package-arg: 11.0.2 npm-packlist: 8.0.2 npm-registry-fetch: 17.1.0 - nx: 19.6.0 + nx: 19.7.0 p-map: 4.0.0 p-map-series: 2.1.0 p-queue: 6.6.2 @@ -14467,7 +14837,7 @@ snapshots: read-cmd-shim: 4.0.0 resolve-from: 5.0.0 rimraf: 4.4.1 - semver: 7.6.0 + semver: 7.6.3 set-blocking: 2.0.0 signal-exit: 3.0.7 slash: 3.0.0 @@ -14495,92 +14865,92 @@ snapshots: - encoding - supports-color - '@mui/base@5.0.0-beta.30(@types/react@18.3.3)(react-dom@18.3.1(react@18.3.1))(react@18.3.1)': + '@mui/base@5.0.0-beta.30(@types/react@18.3.4)(react-dom@18.3.1(react@18.3.1))(react@18.3.1)': dependencies: '@babel/runtime': 7.25.0 '@floating-ui/react-dom': 2.1.1(react-dom@18.3.1(react@18.3.1))(react@18.3.1) - '@mui/types': 7.2.15(@types/react@18.3.3) - '@mui/utils': 5.16.5(@types/react@18.3.3)(react@18.3.1) + '@mui/types': 7.2.15(@types/react@18.3.4) + '@mui/utils': 5.16.6(@types/react@18.3.4)(react@18.3.1) '@popperjs/core': 2.11.8 clsx: 2.1.1 prop-types: 15.8.1 react: 18.3.1 react-dom: 18.3.1(react@18.3.1) optionalDependencies: - '@types/react': 18.3.3 + '@types/react': 18.3.4 - '@mui/base@5.0.0-beta.31(@types/react@18.3.3)(react-dom@18.3.1(react@18.3.1))(react@18.3.1)': + '@mui/base@5.0.0-beta.31(@types/react@18.3.4)(react-dom@18.3.1(react@18.3.1))(react@18.3.1)': dependencies: '@babel/runtime': 7.25.0 '@floating-ui/react-dom': 2.1.1(react-dom@18.3.1(react@18.3.1))(react@18.3.1) - '@mui/types': 7.2.15(@types/react@18.3.3) - '@mui/utils': 5.16.5(@types/react@18.3.3)(react@18.3.1) + '@mui/types': 7.2.15(@types/react@18.3.4) + '@mui/utils': 5.16.6(@types/react@18.3.4)(react@18.3.1) '@popperjs/core': 2.11.8 clsx: 2.1.1 prop-types: 15.8.1 react: 18.3.1 react-dom: 18.3.1(react@18.3.1) optionalDependencies: - '@types/react': 18.3.3 + '@types/react': 18.3.4 - '@mui/base@5.0.0-beta.40(@types/react@18.3.3)(react-dom@18.3.1(react@18.3.1))(react@18.3.1)': + '@mui/base@5.0.0-beta.40(@types/react@18.3.4)(react-dom@18.3.1(react@18.3.1))(react@18.3.1)': dependencies: '@babel/runtime': 7.25.0 '@floating-ui/react-dom': 2.1.1(react-dom@18.3.1(react@18.3.1))(react@18.3.1) - '@mui/types': 7.2.15(@types/react@18.3.3) - '@mui/utils': 5.16.5(@types/react@18.3.3)(react@18.3.1) + '@mui/types': 7.2.15(@types/react@18.3.4) + '@mui/utils': 5.16.6(@types/react@18.3.4)(react@18.3.1) '@popperjs/core': 2.11.8 clsx: 2.1.1 prop-types: 15.8.1 react: 18.3.1 react-dom: 18.3.1(react@18.3.1) optionalDependencies: - '@types/react': 18.3.3 + '@types/react': 18.3.4 '@mui/core-downloads-tracker@5.15.14': {} - '@mui/joy@5.0.0-beta.22(@emotion/react@11.13.0(@types/react@18.3.3)(react@18.3.1))(@emotion/styled@11.13.0(@emotion/react@11.13.0(@types/react@18.3.3)(react@18.3.1))(@types/react@18.3.3)(react@18.3.1))(@types/react@18.3.3)(react-dom@18.3.1(react@18.3.1))(react@18.3.1)': + '@mui/joy@5.0.0-beta.22(@emotion/react@11.13.3(@types/react@18.3.4)(react@18.3.1))(@emotion/styled@11.13.0(@emotion/react@11.13.3(@types/react@18.3.4)(react@18.3.1))(@types/react@18.3.4)(react@18.3.1))(@types/react@18.3.4)(react-dom@18.3.1(react@18.3.1))(react@18.3.1)': dependencies: '@babel/runtime': 7.25.0 - '@mui/base': 5.0.0-beta.31(@types/react@18.3.3)(react-dom@18.3.1(react@18.3.1))(react@18.3.1) + '@mui/base': 5.0.0-beta.31(@types/react@18.3.4)(react-dom@18.3.1(react@18.3.1))(react@18.3.1) '@mui/core-downloads-tracker': 5.15.14 - '@mui/system': 5.16.5(@emotion/react@11.13.0(@types/react@18.3.3)(react@18.3.1))(@emotion/styled@11.13.0(@emotion/react@11.13.0(@types/react@18.3.3)(react@18.3.1))(@types/react@18.3.3)(react@18.3.1))(@types/react@18.3.3)(react@18.3.1) - '@mui/types': 7.2.15(@types/react@18.3.3) - '@mui/utils': 5.16.5(@types/react@18.3.3)(react@18.3.1) + '@mui/system': 5.16.5(@emotion/react@11.13.3(@types/react@18.3.4)(react@18.3.1))(@emotion/styled@11.13.0(@emotion/react@11.13.3(@types/react@18.3.4)(react@18.3.1))(@types/react@18.3.4)(react@18.3.1))(@types/react@18.3.4)(react@18.3.1) + '@mui/types': 7.2.15(@types/react@18.3.4) + '@mui/utils': 5.16.6(@types/react@18.3.4)(react@18.3.1) clsx: 2.1.1 prop-types: 15.8.1 react: 18.3.1 react-dom: 18.3.1(react@18.3.1) optionalDependencies: - '@emotion/react': 11.13.0(@types/react@18.3.3)(react@18.3.1) - '@emotion/styled': 11.13.0(@emotion/react@11.13.0(@types/react@18.3.3)(react@18.3.1))(@types/react@18.3.3)(react@18.3.1) - '@types/react': 18.3.3 + '@emotion/react': 11.13.3(@types/react@18.3.4)(react@18.3.1) + '@emotion/styled': 11.13.0(@emotion/react@11.13.3(@types/react@18.3.4)(react@18.3.1))(@types/react@18.3.4)(react@18.3.1) + '@types/react': 18.3.4 - '@mui/lab@5.0.0-alpha.173(@emotion/react@11.13.0(@types/react@18.3.3)(react@18.3.1))(@emotion/styled@11.13.0(@emotion/react@11.13.0(@types/react@18.3.3)(react@18.3.1))(@types/react@18.3.3)(react@18.3.1))(@mui/material@packages+mui-material+build)(@types/react@18.3.3)(react-dom@18.3.1(react@18.3.1))(react@18.3.1)': + '@mui/lab@5.0.0-alpha.173(@emotion/react@11.13.3(@types/react@18.3.4)(react@18.3.1))(@emotion/styled@11.13.0(@emotion/react@11.13.3(@types/react@18.3.4)(react@18.3.1))(@types/react@18.3.4)(react@18.3.1))(@mui/material@packages+mui-material+build)(@types/react@18.3.4)(react-dom@18.3.1(react@18.3.1))(react@18.3.1)': dependencies: '@babel/runtime': 7.25.0 - '@mui/base': 5.0.0-beta.40(@types/react@18.3.3)(react-dom@18.3.1(react@18.3.1))(react@18.3.1) + '@mui/base': 5.0.0-beta.40(@types/react@18.3.4)(react-dom@18.3.1(react@18.3.1))(react@18.3.1) '@mui/material': link:packages/mui-material/build - '@mui/system': 5.16.5(@emotion/react@11.13.0(@types/react@18.3.3)(react@18.3.1))(@emotion/styled@11.13.0(@emotion/react@11.13.0(@types/react@18.3.3)(react@18.3.1))(@types/react@18.3.3)(react@18.3.1))(@types/react@18.3.3)(react@18.3.1) - '@mui/types': 7.2.15(@types/react@18.3.3) - '@mui/utils': 5.16.5(@types/react@18.3.3)(react@18.3.1) + '@mui/system': 5.16.5(@emotion/react@11.13.3(@types/react@18.3.4)(react@18.3.1))(@emotion/styled@11.13.0(@emotion/react@11.13.3(@types/react@18.3.4)(react@18.3.1))(@types/react@18.3.4)(react@18.3.1))(@types/react@18.3.4)(react@18.3.1) + '@mui/types': 7.2.15(@types/react@18.3.4) + '@mui/utils': 5.16.6(@types/react@18.3.4)(react@18.3.1) clsx: 2.1.1 prop-types: 15.8.1 react: 18.3.1 react-dom: 18.3.1(react@18.3.1) optionalDependencies: - '@emotion/react': 11.13.0(@types/react@18.3.3)(react@18.3.1) - '@emotion/styled': 11.13.0(@emotion/react@11.13.0(@types/react@18.3.3)(react@18.3.1))(@types/react@18.3.3)(react@18.3.1) - '@types/react': 18.3.3 + '@emotion/react': 11.13.3(@types/react@18.3.4)(react@18.3.1) + '@emotion/styled': 11.13.0(@emotion/react@11.13.3(@types/react@18.3.4)(react@18.3.1))(@types/react@18.3.4)(react@18.3.1) + '@types/react': 18.3.4 - '@mui/material@5.15.4(@emotion/react@11.13.0(@types/react@18.3.3)(react@18.3.1))(@emotion/styled@11.13.0(@emotion/react@11.13.0(@types/react@18.3.3)(react@18.3.1))(@types/react@18.3.3)(react@18.3.1))(@types/react@18.3.3)(react-dom@18.3.1(react@18.3.1))(react@18.3.1)': + '@mui/material@5.15.4(@emotion/react@11.13.3(@types/react@18.3.4)(react@18.3.1))(@emotion/styled@11.13.0(@emotion/react@11.13.3(@types/react@18.3.4)(react@18.3.1))(@types/react@18.3.4)(react@18.3.1))(@types/react@18.3.4)(react-dom@18.3.1(react@18.3.1))(react@18.3.1)': dependencies: '@babel/runtime': 7.25.0 - '@mui/base': 5.0.0-beta.31(@types/react@18.3.3)(react-dom@18.3.1(react@18.3.1))(react@18.3.1) + '@mui/base': 5.0.0-beta.31(@types/react@18.3.4)(react-dom@18.3.1(react@18.3.1))(react@18.3.1) '@mui/core-downloads-tracker': 5.15.14 - '@mui/system': 5.16.5(@emotion/react@11.13.0(@types/react@18.3.3)(react@18.3.1))(@emotion/styled@11.13.0(@emotion/react@11.13.0(@types/react@18.3.3)(react@18.3.1))(@types/react@18.3.3)(react@18.3.1))(@types/react@18.3.3)(react@18.3.1) - '@mui/types': 7.2.15(@types/react@18.3.3) - '@mui/utils': 5.16.5(@types/react@18.3.3)(react@18.3.1) + '@mui/system': 5.16.5(@emotion/react@11.13.3(@types/react@18.3.4)(react@18.3.1))(@emotion/styled@11.13.0(@emotion/react@11.13.3(@types/react@18.3.4)(react@18.3.1))(@types/react@18.3.4)(react@18.3.1))(@types/react@18.3.4)(react@18.3.1) + '@mui/types': 7.2.15(@types/react@18.3.4) + '@mui/utils': 5.16.6(@types/react@18.3.4)(react@18.3.1) '@types/react-transition-group': 4.4.11 clsx: 2.1.1 csstype: 3.1.3 @@ -14590,29 +14960,29 @@ snapshots: react-is: 18.3.1 react-transition-group: 4.4.5(react-dom@18.3.1(react@18.3.1))(react@18.3.1) optionalDependencies: - '@emotion/react': 11.13.0(@types/react@18.3.3)(react@18.3.1) - '@emotion/styled': 11.13.0(@emotion/react@11.13.0(@types/react@18.3.3)(react@18.3.1))(@types/react@18.3.3)(react@18.3.1) - '@types/react': 18.3.3 + '@emotion/react': 11.13.3(@types/react@18.3.4)(react@18.3.1) + '@emotion/styled': 11.13.0(@emotion/react@11.13.3(@types/react@18.3.4)(react@18.3.1))(@types/react@18.3.4)(react@18.3.1) + '@types/react': 18.3.4 - '@mui/private-theming@5.16.5(@types/react@18.3.3)(react@18.3.1)': + '@mui/private-theming@5.16.5(@types/react@18.3.4)(react@18.3.1)': dependencies: '@babel/runtime': 7.25.0 - '@mui/utils': 5.16.5(@types/react@18.3.3)(react@18.3.1) + '@mui/utils': 5.16.6(@types/react@18.3.4)(react@18.3.1) prop-types: 15.8.1 react: 18.3.1 optionalDependencies: - '@types/react': 18.3.3 + '@types/react': 18.3.4 - '@mui/private-theming@6.0.0-alpha.3(@types/react@18.3.3)(react@18.3.1)': + '@mui/private-theming@6.0.0-alpha.3(@types/react@18.3.4)(react@18.3.1)': dependencies: '@babel/runtime': 7.25.0 - '@mui/utils': 6.0.0-dev.20240529-082515-213b5e33ab(@types/react@18.3.3)(react@18.3.1) + '@mui/utils': 6.0.0-rc.0(@types/react@18.3.4)(react@18.3.1) prop-types: 15.8.1 react: 18.3.1 optionalDependencies: - '@types/react': 18.3.3 + '@types/react': 18.3.4 - '@mui/styled-engine@5.16.4(@emotion/react@11.13.0(@types/react@18.3.3)(react@18.3.1))(@emotion/styled@11.13.0(@emotion/react@11.13.0(@types/react@18.3.3)(react@18.3.1))(@types/react@18.3.3)(react@18.3.1))(react@18.3.1)': + '@mui/styled-engine@5.16.4(@emotion/react@11.13.3(@types/react@18.3.4)(react@18.3.1))(@emotion/styled@11.13.0(@emotion/react@11.13.3(@types/react@18.3.4)(react@18.3.1))(@types/react@18.3.4)(react@18.3.1))(react@18.3.1)': dependencies: '@babel/runtime': 7.25.0 '@emotion/cache': 11.13.1 @@ -14620,10 +14990,10 @@ snapshots: prop-types: 15.8.1 react: 18.3.1 optionalDependencies: - '@emotion/react': 11.13.0(@types/react@18.3.3)(react@18.3.1) - '@emotion/styled': 11.13.0(@emotion/react@11.13.0(@types/react@18.3.3)(react@18.3.1))(@types/react@18.3.3)(react@18.3.1) + '@emotion/react': 11.13.3(@types/react@18.3.4)(react@18.3.1) + '@emotion/styled': 11.13.0(@emotion/react@11.13.3(@types/react@18.3.4)(react@18.3.1))(@types/react@18.3.4)(react@18.3.1) - '@mui/styled-engine@6.0.0-alpha.3(@emotion/react@11.13.0(@types/react@18.3.3)(react@18.3.1))(@emotion/styled@11.13.0(@emotion/react@11.13.0(@types/react@18.3.3)(react@18.3.1))(@types/react@18.3.3)(react@18.3.1))(react@18.3.1)': + '@mui/styled-engine@6.0.0-alpha.3(@emotion/react@11.13.3(@types/react@18.3.4)(react@18.3.1))(@emotion/styled@11.13.0(@emotion/react@11.13.3(@types/react@18.3.4)(react@18.3.1))(@types/react@18.3.4)(react@18.3.1))(react@18.3.1)': dependencies: '@babel/runtime': 7.25.0 '@emotion/cache': 11.13.1 @@ -14631,78 +15001,68 @@ snapshots: prop-types: 15.8.1 react: 18.3.1 optionalDependencies: - '@emotion/react': 11.13.0(@types/react@18.3.3)(react@18.3.1) - '@emotion/styled': 11.13.0(@emotion/react@11.13.0(@types/react@18.3.3)(react@18.3.1))(@types/react@18.3.3)(react@18.3.1) + '@emotion/react': 11.13.3(@types/react@18.3.4)(react@18.3.1) + '@emotion/styled': 11.13.0(@emotion/react@11.13.3(@types/react@18.3.4)(react@18.3.1))(@types/react@18.3.4)(react@18.3.1) - '@mui/system@5.16.5(@emotion/react@11.13.0(@types/react@18.3.3)(react@18.3.1))(@emotion/styled@11.13.0(@emotion/react@11.13.0(@types/react@18.3.3)(react@18.3.1))(@types/react@18.3.3)(react@18.3.1))(@types/react@18.3.3)(react@18.3.1)': + '@mui/system@5.16.5(@emotion/react@11.13.3(@types/react@18.3.4)(react@18.3.1))(@emotion/styled@11.13.0(@emotion/react@11.13.3(@types/react@18.3.4)(react@18.3.1))(@types/react@18.3.4)(react@18.3.1))(@types/react@18.3.4)(react@18.3.1)': dependencies: '@babel/runtime': 7.25.0 - '@mui/private-theming': 5.16.5(@types/react@18.3.3)(react@18.3.1) - '@mui/styled-engine': 5.16.4(@emotion/react@11.13.0(@types/react@18.3.3)(react@18.3.1))(@emotion/styled@11.13.0(@emotion/react@11.13.0(@types/react@18.3.3)(react@18.3.1))(@types/react@18.3.3)(react@18.3.1))(react@18.3.1) - '@mui/types': 7.2.15(@types/react@18.3.3) - '@mui/utils': 5.16.5(@types/react@18.3.3)(react@18.3.1) + '@mui/private-theming': 5.16.5(@types/react@18.3.4)(react@18.3.1) + '@mui/styled-engine': 5.16.4(@emotion/react@11.13.3(@types/react@18.3.4)(react@18.3.1))(@emotion/styled@11.13.0(@emotion/react@11.13.3(@types/react@18.3.4)(react@18.3.1))(@types/react@18.3.4)(react@18.3.1))(react@18.3.1) + '@mui/types': 7.2.15(@types/react@18.3.4) + '@mui/utils': 5.16.6(@types/react@18.3.4)(react@18.3.1) clsx: 2.1.1 csstype: 3.1.3 prop-types: 15.8.1 react: 18.3.1 optionalDependencies: - '@emotion/react': 11.13.0(@types/react@18.3.3)(react@18.3.1) - '@emotion/styled': 11.13.0(@emotion/react@11.13.0(@types/react@18.3.3)(react@18.3.1))(@types/react@18.3.3)(react@18.3.1) - '@types/react': 18.3.3 + '@emotion/react': 11.13.3(@types/react@18.3.4)(react@18.3.1) + '@emotion/styled': 11.13.0(@emotion/react@11.13.3(@types/react@18.3.4)(react@18.3.1))(@types/react@18.3.4)(react@18.3.1) + '@types/react': 18.3.4 - '@mui/system@6.0.0-dev.240424162023-9968b4889d(@emotion/react@11.13.0(@types/react@18.3.3)(react@18.3.1))(@emotion/styled@11.13.0(@emotion/react@11.13.0(@types/react@18.3.3)(react@18.3.1))(@types/react@18.3.3)(react@18.3.1))(@types/react@18.3.3)(react@18.3.1)': + '@mui/system@6.0.0-dev.240424162023-9968b4889d(@emotion/react@11.13.3(@types/react@18.3.4)(react@18.3.1))(@emotion/styled@11.13.0(@emotion/react@11.13.3(@types/react@18.3.4)(react@18.3.1))(@types/react@18.3.4)(react@18.3.1))(@types/react@18.3.4)(react@18.3.1)': dependencies: '@babel/runtime': 7.25.0 - '@mui/private-theming': 6.0.0-alpha.3(@types/react@18.3.3)(react@18.3.1) - '@mui/styled-engine': 6.0.0-alpha.3(@emotion/react@11.13.0(@types/react@18.3.3)(react@18.3.1))(@emotion/styled@11.13.0(@emotion/react@11.13.0(@types/react@18.3.3)(react@18.3.1))(@types/react@18.3.3)(react@18.3.1))(react@18.3.1) - '@mui/types': 7.2.15(@types/react@18.3.3) - '@mui/utils': 6.0.0-dev.20240529-082515-213b5e33ab(@types/react@18.3.3)(react@18.3.1) + '@mui/private-theming': 6.0.0-alpha.3(@types/react@18.3.4)(react@18.3.1) + '@mui/styled-engine': 6.0.0-alpha.3(@emotion/react@11.13.3(@types/react@18.3.4)(react@18.3.1))(@emotion/styled@11.13.0(@emotion/react@11.13.3(@types/react@18.3.4)(react@18.3.1))(@types/react@18.3.4)(react@18.3.1))(react@18.3.1) + '@mui/types': 7.2.15(@types/react@18.3.4) + '@mui/utils': 6.0.0-rc.0(@types/react@18.3.4)(react@18.3.1) clsx: 2.1.1 csstype: 3.1.3 prop-types: 15.8.1 react: 18.3.1 optionalDependencies: - '@emotion/react': 11.13.0(@types/react@18.3.3)(react@18.3.1) - '@emotion/styled': 11.13.0(@emotion/react@11.13.0(@types/react@18.3.3)(react@18.3.1))(@types/react@18.3.3)(react@18.3.1) - '@types/react': 18.3.3 + '@emotion/react': 11.13.3(@types/react@18.3.4)(react@18.3.1) + '@emotion/styled': 11.13.0(@emotion/react@11.13.3(@types/react@18.3.4)(react@18.3.1))(@types/react@18.3.4)(react@18.3.1) + '@types/react': 18.3.4 - '@mui/types@7.2.15(@types/react@18.3.3)': + '@mui/types@7.2.15(@types/react@18.3.4)': optionalDependencies: - '@types/react': 18.3.3 + '@types/react': 18.3.4 - '@mui/utils@5.16.5(@types/react@18.3.3)(react@18.3.1)': + '@mui/utils@5.16.6(@types/react@18.3.4)(react@18.3.1)': dependencies: '@babel/runtime': 7.25.0 - '@mui/types': 7.2.15(@types/react@18.3.3) + '@mui/types': 7.2.15(@types/react@18.3.4) '@types/prop-types': 15.7.12 clsx: 2.1.1 prop-types: 15.8.1 react: 18.3.1 react-is: 18.3.1 optionalDependencies: - '@types/react': 18.3.3 + '@types/react': 18.3.4 - '@mui/utils@6.0.0-beta.5(@types/react@18.3.3)(react@18.3.1)': + '@mui/utils@6.0.0-rc.0(@types/react@18.3.4)(react@18.3.1)': dependencies: '@babel/runtime': 7.25.0 - '@mui/types': 7.2.15(@types/react@18.3.3) + '@mui/types': 7.2.15(@types/react@18.3.4) '@types/prop-types': 15.7.12 clsx: 2.1.1 prop-types: 15.8.1 react: 18.3.1 react-is: 18.3.1 optionalDependencies: - '@types/react': 18.3.3 - - '@mui/utils@6.0.0-dev.20240529-082515-213b5e33ab(@types/react@18.3.3)(react@18.3.1)': - dependencies: - '@babel/runtime': 7.25.0 - '@types/prop-types': 15.7.12 - prop-types: 15.8.1 - react: 18.3.1 - react-is: 18.3.1 - optionalDependencies: - '@types/react': 18.3.3 + '@types/react': 18.3.4 '@mui/x-charts-vendor@7.13.0': dependencies: @@ -14722,12 +15082,12 @@ snapshots: delaunator: 5.0.1 robust-predicates: 3.0.2 - '@mui/x-charts@7.13.0(@emotion/react@11.13.0(@types/react@18.3.3)(react@18.3.1))(@emotion/styled@11.13.0(@emotion/react@11.13.0(@types/react@18.3.3)(react@18.3.1))(@types/react@18.3.3)(react@18.3.1))(@mui/material@packages+mui-material+build)(@types/react@18.3.3)(react-dom@18.3.1(react@18.3.1))(react@18.3.1)': + '@mui/x-charts@7.13.0(@emotion/react@11.13.3(@types/react@18.3.4)(react@18.3.1))(@emotion/styled@11.13.0(@emotion/react@11.13.3(@types/react@18.3.4)(react@18.3.1))(@types/react@18.3.4)(react@18.3.1))(@mui/material@packages+mui-material+build)(@types/react@18.3.4)(react-dom@18.3.1(react@18.3.1))(react@18.3.1)': dependencies: '@babel/runtime': 7.25.0 '@mui/material': link:packages/mui-material/build - '@mui/system': 5.16.5(@emotion/react@11.13.0(@types/react@18.3.3)(react@18.3.1))(@emotion/styled@11.13.0(@emotion/react@11.13.0(@types/react@18.3.3)(react@18.3.1))(@types/react@18.3.3)(react@18.3.1))(@types/react@18.3.3)(react@18.3.1) - '@mui/utils': 5.16.5(@types/react@18.3.3)(react@18.3.1) + '@mui/system': 5.16.5(@emotion/react@11.13.3(@types/react@18.3.4)(react@18.3.1))(@emotion/styled@11.13.0(@emotion/react@11.13.3(@types/react@18.3.4)(react@18.3.1))(@types/react@18.3.4)(react@18.3.1))(@types/react@18.3.4)(react@18.3.1) + '@mui/utils': 5.16.6(@types/react@18.3.4)(react@18.3.1) '@mui/x-charts-vendor': 7.13.0 '@react-spring/rafz': 9.7.4 '@react-spring/web': 9.7.4(react-dom@18.3.1(react@18.3.1))(react@18.3.1) @@ -14736,38 +15096,38 @@ snapshots: react: 18.3.1 react-dom: 18.3.1(react@18.3.1) optionalDependencies: - '@emotion/react': 11.13.0(@types/react@18.3.3)(react@18.3.1) - '@emotion/styled': 11.13.0(@emotion/react@11.13.0(@types/react@18.3.3)(react@18.3.1))(@types/react@18.3.3)(react@18.3.1) + '@emotion/react': 11.13.3(@types/react@18.3.4)(react@18.3.1) + '@emotion/styled': 11.13.0(@emotion/react@11.13.3(@types/react@18.3.4)(react@18.3.1))(@types/react@18.3.4)(react@18.3.1) transitivePeerDependencies: - '@types/react' - '@mui/x-data-grid-generator@7.13.0(@emotion/react@11.13.0(@types/react@18.3.3)(react@18.3.1))(@emotion/styled@11.13.0(@emotion/react@11.13.0(@types/react@18.3.3)(react@18.3.1))(@types/react@18.3.3)(react@18.3.1))(@mui/icons-material@packages+mui-icons-material+build)(@mui/material@packages+mui-material+build)(@types/react@18.3.3)(react-dom@18.3.1(react@18.3.1))(react@18.3.1)': + '@mui/x-data-grid-generator@7.13.0(@emotion/react@11.13.3(@types/react@18.3.4)(react@18.3.1))(@emotion/styled@11.13.0(@emotion/react@11.13.3(@types/react@18.3.4)(react@18.3.1))(@types/react@18.3.4)(react@18.3.1))(@mui/icons-material@packages+mui-icons-material+build)(@mui/material@packages+mui-material+build)(@types/react@18.3.4)(react-dom@18.3.1(react@18.3.1))(react@18.3.1)': dependencies: '@babel/runtime': 7.25.0 '@mui/icons-material': link:packages/mui-icons-material/build '@mui/material': link:packages/mui-material/build - '@mui/x-data-grid-premium': 7.13.0(@emotion/react@11.13.0(@types/react@18.3.3)(react@18.3.1))(@emotion/styled@11.13.0(@emotion/react@11.13.0(@types/react@18.3.3)(react@18.3.1))(@types/react@18.3.3)(react@18.3.1))(@mui/material@packages+mui-material+build)(@types/react@18.3.3)(react-dom@18.3.1(react@18.3.1))(react@18.3.1) + '@mui/x-data-grid-premium': 7.13.0(@emotion/react@11.13.3(@types/react@18.3.4)(react@18.3.1))(@emotion/styled@11.13.0(@emotion/react@11.13.3(@types/react@18.3.4)(react@18.3.1))(@types/react@18.3.4)(react@18.3.1))(@mui/material@packages+mui-material+build)(@types/react@18.3.4)(react-dom@18.3.1(react@18.3.1))(react@18.3.1) chance: 1.1.12 clsx: 2.1.1 lru-cache: 10.4.3 react: 18.3.1 optionalDependencies: - '@emotion/react': 11.13.0(@types/react@18.3.3)(react@18.3.1) - '@emotion/styled': 11.13.0(@emotion/react@11.13.0(@types/react@18.3.3)(react@18.3.1))(@types/react@18.3.3)(react@18.3.1) + '@emotion/react': 11.13.3(@types/react@18.3.4)(react@18.3.1) + '@emotion/styled': 11.13.0(@emotion/react@11.13.3(@types/react@18.3.4)(react@18.3.1))(@types/react@18.3.4)(react@18.3.1) transitivePeerDependencies: - '@types/react' - react-dom - '@mui/x-data-grid-premium@7.13.0(@emotion/react@11.13.0(@types/react@18.3.3)(react@18.3.1))(@emotion/styled@11.13.0(@emotion/react@11.13.0(@types/react@18.3.3)(react@18.3.1))(@types/react@18.3.3)(react@18.3.1))(@mui/material@packages+mui-material+build)(@types/react@18.3.3)(react-dom@18.3.1(react@18.3.1))(react@18.3.1)': + '@mui/x-data-grid-premium@7.13.0(@emotion/react@11.13.3(@types/react@18.3.4)(react@18.3.1))(@emotion/styled@11.13.0(@emotion/react@11.13.3(@types/react@18.3.4)(react@18.3.1))(@types/react@18.3.4)(react@18.3.1))(@mui/material@packages+mui-material+build)(@types/react@18.3.4)(react-dom@18.3.1(react@18.3.1))(react@18.3.1)': dependencies: '@babel/runtime': 7.25.0 '@mui/material': link:packages/mui-material/build - '@mui/system': 5.16.5(@emotion/react@11.13.0(@types/react@18.3.3)(react@18.3.1))(@emotion/styled@11.13.0(@emotion/react@11.13.0(@types/react@18.3.3)(react@18.3.1))(@types/react@18.3.3)(react@18.3.1))(@types/react@18.3.3)(react@18.3.1) - '@mui/utils': 5.16.5(@types/react@18.3.3)(react@18.3.1) - '@mui/x-data-grid': 7.13.0(@emotion/react@11.13.0(@types/react@18.3.3)(react@18.3.1))(@emotion/styled@11.13.0(@emotion/react@11.13.0(@types/react@18.3.3)(react@18.3.1))(@types/react@18.3.3)(react@18.3.1))(@mui/material@packages+mui-material+build)(@types/react@18.3.3)(react-dom@18.3.1(react@18.3.1))(react@18.3.1) - '@mui/x-data-grid-pro': 7.13.0(@emotion/react@11.13.0(@types/react@18.3.3)(react@18.3.1))(@emotion/styled@11.13.0(@emotion/react@11.13.0(@types/react@18.3.3)(react@18.3.1))(@types/react@18.3.3)(react@18.3.1))(@mui/material@packages+mui-material+build)(@types/react@18.3.3)(react-dom@18.3.1(react@18.3.1))(react@18.3.1) - '@mui/x-internals': 7.13.0(@types/react@18.3.3)(react@18.3.1) - '@mui/x-license': 7.13.0(@types/react@18.3.3)(react@18.3.1) + '@mui/system': 5.16.5(@emotion/react@11.13.3(@types/react@18.3.4)(react@18.3.1))(@emotion/styled@11.13.0(@emotion/react@11.13.3(@types/react@18.3.4)(react@18.3.1))(@types/react@18.3.4)(react@18.3.1))(@types/react@18.3.4)(react@18.3.1) + '@mui/utils': 5.16.6(@types/react@18.3.4)(react@18.3.1) + '@mui/x-data-grid': 7.13.0(@emotion/react@11.13.3(@types/react@18.3.4)(react@18.3.1))(@emotion/styled@11.13.0(@emotion/react@11.13.3(@types/react@18.3.4)(react@18.3.1))(@types/react@18.3.4)(react@18.3.1))(@mui/material@packages+mui-material+build)(@types/react@18.3.4)(react-dom@18.3.1(react@18.3.1))(react@18.3.1) + '@mui/x-data-grid-pro': 7.13.0(@emotion/react@11.13.3(@types/react@18.3.4)(react@18.3.1))(@emotion/styled@11.13.0(@emotion/react@11.13.3(@types/react@18.3.4)(react@18.3.1))(@types/react@18.3.4)(react@18.3.1))(@mui/material@packages+mui-material+build)(@types/react@18.3.4)(react-dom@18.3.1(react@18.3.1))(react@18.3.1) + '@mui/x-internals': 7.13.0(@types/react@18.3.4)(react@18.3.1) + '@mui/x-license': 7.13.0(@types/react@18.3.4)(react@18.3.1) '@types/format-util': 1.0.4 clsx: 2.1.1 exceljs: 4.4.0 @@ -14776,20 +15136,20 @@ snapshots: react-dom: 18.3.1(react@18.3.1) reselect: 4.1.8 optionalDependencies: - '@emotion/react': 11.13.0(@types/react@18.3.3)(react@18.3.1) - '@emotion/styled': 11.13.0(@emotion/react@11.13.0(@types/react@18.3.3)(react@18.3.1))(@types/react@18.3.3)(react@18.3.1) + '@emotion/react': 11.13.3(@types/react@18.3.4)(react@18.3.1) + '@emotion/styled': 11.13.0(@emotion/react@11.13.3(@types/react@18.3.4)(react@18.3.1))(@types/react@18.3.4)(react@18.3.1) transitivePeerDependencies: - '@types/react' - '@mui/x-data-grid-pro@7.13.0(@emotion/react@11.13.0(@types/react@18.3.3)(react@18.3.1))(@emotion/styled@11.13.0(@emotion/react@11.13.0(@types/react@18.3.3)(react@18.3.1))(@types/react@18.3.3)(react@18.3.1))(@mui/material@packages+mui-material+build)(@types/react@18.3.3)(react-dom@18.3.1(react@18.3.1))(react@18.3.1)': + '@mui/x-data-grid-pro@7.13.0(@emotion/react@11.13.3(@types/react@18.3.4)(react@18.3.1))(@emotion/styled@11.13.0(@emotion/react@11.13.3(@types/react@18.3.4)(react@18.3.1))(@types/react@18.3.4)(react@18.3.1))(@mui/material@packages+mui-material+build)(@types/react@18.3.4)(react-dom@18.3.1(react@18.3.1))(react@18.3.1)': dependencies: '@babel/runtime': 7.25.0 '@mui/material': link:packages/mui-material/build - '@mui/system': 5.16.5(@emotion/react@11.13.0(@types/react@18.3.3)(react@18.3.1))(@emotion/styled@11.13.0(@emotion/react@11.13.0(@types/react@18.3.3)(react@18.3.1))(@types/react@18.3.3)(react@18.3.1))(@types/react@18.3.3)(react@18.3.1) - '@mui/utils': 5.16.5(@types/react@18.3.3)(react@18.3.1) - '@mui/x-data-grid': 7.13.0(@emotion/react@11.13.0(@types/react@18.3.3)(react@18.3.1))(@emotion/styled@11.13.0(@emotion/react@11.13.0(@types/react@18.3.3)(react@18.3.1))(@types/react@18.3.3)(react@18.3.1))(@mui/material@packages+mui-material+build)(@types/react@18.3.3)(react-dom@18.3.1(react@18.3.1))(react@18.3.1) - '@mui/x-internals': 7.13.0(@types/react@18.3.3)(react@18.3.1) - '@mui/x-license': 7.13.0(@types/react@18.3.3)(react@18.3.1) + '@mui/system': 5.16.5(@emotion/react@11.13.3(@types/react@18.3.4)(react@18.3.1))(@emotion/styled@11.13.0(@emotion/react@11.13.3(@types/react@18.3.4)(react@18.3.1))(@types/react@18.3.4)(react@18.3.1))(@types/react@18.3.4)(react@18.3.1) + '@mui/utils': 5.16.6(@types/react@18.3.4)(react@18.3.1) + '@mui/x-data-grid': 7.13.0(@emotion/react@11.13.3(@types/react@18.3.4)(react@18.3.1))(@emotion/styled@11.13.0(@emotion/react@11.13.3(@types/react@18.3.4)(react@18.3.1))(@types/react@18.3.4)(react@18.3.1))(@mui/material@packages+mui-material+build)(@types/react@18.3.4)(react-dom@18.3.1(react@18.3.1))(react@18.3.1) + '@mui/x-internals': 7.13.0(@types/react@18.3.4)(react@18.3.1) + '@mui/x-license': 7.13.0(@types/react@18.3.4)(react@18.3.1) '@types/format-util': 1.0.4 clsx: 2.1.1 prop-types: 15.8.1 @@ -14797,57 +15157,56 @@ snapshots: react-dom: 18.3.1(react@18.3.1) reselect: 4.1.8 optionalDependencies: - '@emotion/react': 11.13.0(@types/react@18.3.3)(react@18.3.1) - '@emotion/styled': 11.13.0(@emotion/react@11.13.0(@types/react@18.3.3)(react@18.3.1))(@types/react@18.3.3)(react@18.3.1) + '@emotion/react': 11.13.3(@types/react@18.3.4)(react@18.3.1) + '@emotion/styled': 11.13.0(@emotion/react@11.13.3(@types/react@18.3.4)(react@18.3.1))(@types/react@18.3.4)(react@18.3.1) transitivePeerDependencies: - '@types/react' - '@mui/x-data-grid@7.13.0(@emotion/react@11.13.0(@types/react@18.3.3)(react@18.3.1))(@emotion/styled@11.13.0(@emotion/react@11.13.0(@types/react@18.3.3)(react@18.3.1))(@types/react@18.3.3)(react@18.3.1))(@mui/material@packages+mui-material+build)(@types/react@18.3.3)(react-dom@18.3.1(react@18.3.1))(react@18.3.1)': + '@mui/x-data-grid@7.13.0(@emotion/react@11.13.3(@types/react@18.3.4)(react@18.3.1))(@emotion/styled@11.13.0(@emotion/react@11.13.3(@types/react@18.3.4)(react@18.3.1))(@types/react@18.3.4)(react@18.3.1))(@mui/material@packages+mui-material+build)(@types/react@18.3.4)(react-dom@18.3.1(react@18.3.1))(react@18.3.1)': dependencies: '@babel/runtime': 7.25.0 '@mui/material': link:packages/mui-material/build - '@mui/system': 5.16.5(@emotion/react@11.13.0(@types/react@18.3.3)(react@18.3.1))(@emotion/styled@11.13.0(@emotion/react@11.13.0(@types/react@18.3.3)(react@18.3.1))(@types/react@18.3.3)(react@18.3.1))(@types/react@18.3.3)(react@18.3.1) - '@mui/utils': 5.16.5(@types/react@18.3.3)(react@18.3.1) - '@mui/x-internals': 7.13.0(@types/react@18.3.3)(react@18.3.1) + '@mui/system': 5.16.5(@emotion/react@11.13.3(@types/react@18.3.4)(react@18.3.1))(@emotion/styled@11.13.0(@emotion/react@11.13.3(@types/react@18.3.4)(react@18.3.1))(@types/react@18.3.4)(react@18.3.1))(@types/react@18.3.4)(react@18.3.1) + '@mui/utils': 5.16.6(@types/react@18.3.4)(react@18.3.1) + '@mui/x-internals': 7.13.0(@types/react@18.3.4)(react@18.3.1) clsx: 2.1.1 prop-types: 15.8.1 react: 18.3.1 react-dom: 18.3.1(react@18.3.1) reselect: 4.1.8 optionalDependencies: - '@emotion/react': 11.13.0(@types/react@18.3.3)(react@18.3.1) - '@emotion/styled': 11.13.0(@emotion/react@11.13.0(@types/react@18.3.3)(react@18.3.1))(@types/react@18.3.3)(react@18.3.1) + '@emotion/react': 11.13.3(@types/react@18.3.4)(react@18.3.1) + '@emotion/styled': 11.13.0(@emotion/react@11.13.3(@types/react@18.3.4)(react@18.3.1))(@types/react@18.3.4)(react@18.3.1) transitivePeerDependencies: - '@types/react' - '@mui/x-date-pickers-pro@7.13.0(@emotion/react@11.13.0(@types/react@18.3.3)(react@18.3.1))(@emotion/styled@11.13.0(@emotion/react@11.13.0(@types/react@18.3.3)(react@18.3.1))(@types/react@18.3.3)(react@18.3.1))(@mui/material@packages+mui-material+build)(@types/react@18.3.3)(date-fns-jalali@2.21.3-1)(date-fns@2.30.0)(dayjs@1.11.12)(react-dom@18.3.1(react@18.3.1))(react@18.3.1)': + '@mui/x-date-pickers-pro@7.13.0(@emotion/react@11.13.3(@types/react@18.3.4)(react@18.3.1))(@emotion/styled@11.13.0(@emotion/react@11.13.3(@types/react@18.3.4)(react@18.3.1))(@types/react@18.3.4)(react@18.3.1))(@mui/material@packages+mui-material+build)(@types/react@18.3.4)(date-fns@2.30.0)(dayjs@1.11.13)(react-dom@18.3.1(react@18.3.1))(react@18.3.1)': dependencies: '@babel/runtime': 7.25.0 '@mui/material': link:packages/mui-material/build - '@mui/system': 5.16.5(@emotion/react@11.13.0(@types/react@18.3.3)(react@18.3.1))(@emotion/styled@11.13.0(@emotion/react@11.13.0(@types/react@18.3.3)(react@18.3.1))(@types/react@18.3.3)(react@18.3.1))(@types/react@18.3.3)(react@18.3.1) - '@mui/utils': 5.16.5(@types/react@18.3.3)(react@18.3.1) - '@mui/x-date-pickers': 7.13.0(@emotion/react@11.13.0(@types/react@18.3.3)(react@18.3.1))(@emotion/styled@11.13.0(@emotion/react@11.13.0(@types/react@18.3.3)(react@18.3.1))(@types/react@18.3.3)(react@18.3.1))(@mui/material@packages+mui-material+build)(@types/react@18.3.3)(date-fns-jalali@2.21.3-1)(date-fns@2.30.0)(dayjs@1.11.12)(react-dom@18.3.1(react@18.3.1))(react@18.3.1) - '@mui/x-license': 7.13.0(@types/react@18.3.3)(react@18.3.1) + '@mui/system': 5.16.5(@emotion/react@11.13.3(@types/react@18.3.4)(react@18.3.1))(@emotion/styled@11.13.0(@emotion/react@11.13.3(@types/react@18.3.4)(react@18.3.1))(@types/react@18.3.4)(react@18.3.1))(@types/react@18.3.4)(react@18.3.1) + '@mui/utils': 5.16.6(@types/react@18.3.4)(react@18.3.1) + '@mui/x-date-pickers': 7.13.0(@emotion/react@11.13.3(@types/react@18.3.4)(react@18.3.1))(@emotion/styled@11.13.0(@emotion/react@11.13.3(@types/react@18.3.4)(react@18.3.1))(@types/react@18.3.4)(react@18.3.1))(@mui/material@packages+mui-material+build)(@types/react@18.3.4)(date-fns@2.30.0)(dayjs@1.11.13)(react-dom@18.3.1(react@18.3.1))(react@18.3.1) + '@mui/x-license': 7.13.0(@types/react@18.3.4)(react@18.3.1) clsx: 2.1.1 prop-types: 15.8.1 react: 18.3.1 react-dom: 18.3.1(react@18.3.1) react-transition-group: 4.4.5(react-dom@18.3.1(react@18.3.1))(react@18.3.1) optionalDependencies: - '@emotion/react': 11.13.0(@types/react@18.3.3)(react@18.3.1) - '@emotion/styled': 11.13.0(@emotion/react@11.13.0(@types/react@18.3.3)(react@18.3.1))(@types/react@18.3.3)(react@18.3.1) + '@emotion/react': 11.13.3(@types/react@18.3.4)(react@18.3.1) + '@emotion/styled': 11.13.0(@emotion/react@11.13.3(@types/react@18.3.4)(react@18.3.1))(@types/react@18.3.4)(react@18.3.1) date-fns: 2.30.0 - date-fns-jalali: 2.21.3-1 - dayjs: 1.11.12 + dayjs: 1.11.13 transitivePeerDependencies: - '@types/react' - '@mui/x-date-pickers@7.13.0(@emotion/react@11.13.0(@types/react@18.3.3)(react@18.3.1))(@emotion/styled@11.13.0(@emotion/react@11.13.0(@types/react@18.3.3)(react@18.3.1))(@types/react@18.3.3)(react@18.3.1))(@mui/material@packages+mui-material+build)(@types/react@18.3.3)(date-fns-jalali@2.21.3-1)(date-fns@2.30.0)(dayjs@1.11.12)(react-dom@18.3.1(react@18.3.1))(react@18.3.1)': + '@mui/x-date-pickers@7.13.0(@emotion/react@11.13.3(@types/react@18.3.4)(react@18.3.1))(@emotion/styled@11.13.0(@emotion/react@11.13.3(@types/react@18.3.4)(react@18.3.1))(@types/react@18.3.4)(react@18.3.1))(@mui/material@packages+mui-material+build)(@types/react@18.3.4)(date-fns@2.30.0)(dayjs@1.11.13)(react-dom@18.3.1(react@18.3.1))(react@18.3.1)': dependencies: '@babel/runtime': 7.25.0 '@mui/material': link:packages/mui-material/build - '@mui/system': 5.16.5(@emotion/react@11.13.0(@types/react@18.3.3)(react@18.3.1))(@emotion/styled@11.13.0(@emotion/react@11.13.0(@types/react@18.3.3)(react@18.3.1))(@types/react@18.3.3)(react@18.3.1))(@types/react@18.3.3)(react@18.3.1) - '@mui/utils': 5.16.5(@types/react@18.3.3)(react@18.3.1) + '@mui/system': 5.16.5(@emotion/react@11.13.3(@types/react@18.3.4)(react@18.3.1))(@emotion/styled@11.13.0(@emotion/react@11.13.3(@types/react@18.3.4)(react@18.3.1))(@types/react@18.3.4)(react@18.3.1))(@types/react@18.3.4)(react@18.3.1) + '@mui/utils': 5.16.6(@types/react@18.3.4)(react@18.3.1) '@types/react-transition-group': 4.4.11 clsx: 2.1.1 prop-types: 15.8.1 @@ -14855,37 +15214,36 @@ snapshots: react-dom: 18.3.1(react@18.3.1) react-transition-group: 4.4.5(react-dom@18.3.1(react@18.3.1))(react@18.3.1) optionalDependencies: - '@emotion/react': 11.13.0(@types/react@18.3.3)(react@18.3.1) - '@emotion/styled': 11.13.0(@emotion/react@11.13.0(@types/react@18.3.3)(react@18.3.1))(@types/react@18.3.3)(react@18.3.1) + '@emotion/react': 11.13.3(@types/react@18.3.4)(react@18.3.1) + '@emotion/styled': 11.13.0(@emotion/react@11.13.3(@types/react@18.3.4)(react@18.3.1))(@types/react@18.3.4)(react@18.3.1) date-fns: 2.30.0 - date-fns-jalali: 2.21.3-1 - dayjs: 1.11.12 + dayjs: 1.11.13 transitivePeerDependencies: - '@types/react' - '@mui/x-internals@7.13.0(@types/react@18.3.3)(react@18.3.1)': + '@mui/x-internals@7.13.0(@types/react@18.3.4)(react@18.3.1)': dependencies: '@babel/runtime': 7.25.0 - '@mui/utils': 5.16.5(@types/react@18.3.3)(react@18.3.1) + '@mui/utils': 5.16.6(@types/react@18.3.4)(react@18.3.1) react: 18.3.1 transitivePeerDependencies: - '@types/react' - '@mui/x-license@7.13.0(@types/react@18.3.3)(react@18.3.1)': + '@mui/x-license@7.13.0(@types/react@18.3.4)(react@18.3.1)': dependencies: '@babel/runtime': 7.25.0 - '@mui/utils': 5.16.5(@types/react@18.3.3)(react@18.3.1) + '@mui/utils': 5.16.6(@types/react@18.3.4)(react@18.3.1) react: 18.3.1 transitivePeerDependencies: - '@types/react' - '@mui/x-tree-view@7.13.0(@emotion/react@11.13.0(@types/react@18.3.3)(react@18.3.1))(@emotion/styled@11.13.0(@emotion/react@11.13.0(@types/react@18.3.3)(react@18.3.1))(@types/react@18.3.3)(react@18.3.1))(@mui/material@packages+mui-material+build)(@types/react@18.3.3)(react-dom@18.3.1(react@18.3.1))(react@18.3.1)': + '@mui/x-tree-view@7.13.0(@emotion/react@11.13.3(@types/react@18.3.4)(react@18.3.1))(@emotion/styled@11.13.0(@emotion/react@11.13.3(@types/react@18.3.4)(react@18.3.1))(@types/react@18.3.4)(react@18.3.1))(@mui/material@packages+mui-material+build)(@types/react@18.3.4)(react-dom@18.3.1(react@18.3.1))(react@18.3.1)': dependencies: '@babel/runtime': 7.25.0 '@mui/material': link:packages/mui-material/build - '@mui/system': 5.16.5(@emotion/react@11.13.0(@types/react@18.3.3)(react@18.3.1))(@emotion/styled@11.13.0(@emotion/react@11.13.0(@types/react@18.3.3)(react@18.3.1))(@types/react@18.3.3)(react@18.3.1))(@types/react@18.3.3)(react@18.3.1) - '@mui/utils': 5.16.5(@types/react@18.3.3)(react@18.3.1) - '@mui/x-internals': 7.13.0(@types/react@18.3.3)(react@18.3.1) + '@mui/system': 5.16.5(@emotion/react@11.13.3(@types/react@18.3.4)(react@18.3.1))(@emotion/styled@11.13.0(@emotion/react@11.13.3(@types/react@18.3.4)(react@18.3.1))(@types/react@18.3.4)(react@18.3.1))(@types/react@18.3.4)(react@18.3.1) + '@mui/utils': 5.16.6(@types/react@18.3.4)(react@18.3.1) + '@mui/x-internals': 7.13.0(@types/react@18.3.4)(react@18.3.1) '@types/react-transition-group': 4.4.11 clsx: 2.1.1 prop-types: 15.8.1 @@ -14893,15 +15251,15 @@ snapshots: react-dom: 18.3.1(react@18.3.1) react-transition-group: 4.4.5(react-dom@18.3.1(react@18.3.1))(react@18.3.1) optionalDependencies: - '@emotion/react': 11.13.0(@types/react@18.3.3)(react@18.3.1) - '@emotion/styled': 11.13.0(@emotion/react@11.13.0(@types/react@18.3.3)(react@18.3.1))(@types/react@18.3.3)(react@18.3.1) + '@emotion/react': 11.13.3(@types/react@18.3.4)(react@18.3.1) + '@emotion/styled': 11.13.0(@emotion/react@11.13.3(@types/react@18.3.4)(react@18.3.1))(@types/react@18.3.4)(react@18.3.1) transitivePeerDependencies: - '@types/react' '@napi-rs/wasm-runtime@0.2.4': dependencies: '@emnapi/core': 1.2.0 - '@emnapi/runtime': 1.1.1 + '@emnapi/runtime': 1.2.0 '@tybys/wasm-util': 0.9.0 '@netlify/functions@2.8.1': @@ -14915,37 +15273,66 @@ snapshots: '@netlify/node-cookies': 0.1.0 urlpattern-polyfill: 8.0.2 - '@next/env@14.2.5': {} + '@next/env@14.2.8': {} + + '@next/env@14.2.9': {} - '@next/eslint-plugin-next@14.2.5': + '@next/eslint-plugin-next@14.2.8': dependencies: glob: 10.3.10 - '@next/swc-darwin-arm64@14.2.5': + '@next/swc-darwin-arm64@14.2.8': + optional: true + + '@next/swc-darwin-arm64@14.2.9': + optional: true + + '@next/swc-darwin-x64@14.2.8': + optional: true + + '@next/swc-darwin-x64@14.2.9': + optional: true + + '@next/swc-linux-arm64-gnu@14.2.8': + optional: true + + '@next/swc-linux-arm64-gnu@14.2.9': optional: true - '@next/swc-darwin-x64@14.2.5': + '@next/swc-linux-arm64-musl@14.2.8': optional: true - '@next/swc-linux-arm64-gnu@14.2.5': + '@next/swc-linux-arm64-musl@14.2.9': optional: true - '@next/swc-linux-arm64-musl@14.2.5': + '@next/swc-linux-x64-gnu@14.2.8': optional: true - '@next/swc-linux-x64-gnu@14.2.5': + '@next/swc-linux-x64-gnu@14.2.9': optional: true - '@next/swc-linux-x64-musl@14.2.5': + '@next/swc-linux-x64-musl@14.2.8': optional: true - '@next/swc-win32-arm64-msvc@14.2.5': + '@next/swc-linux-x64-musl@14.2.9': optional: true - '@next/swc-win32-ia32-msvc@14.2.5': + '@next/swc-win32-arm64-msvc@14.2.8': optional: true - '@next/swc-win32-x64-msvc@14.2.5': + '@next/swc-win32-arm64-msvc@14.2.9': + optional: true + + '@next/swc-win32-ia32-msvc@14.2.8': + optional: true + + '@next/swc-win32-ia32-msvc@14.2.9': + optional: true + + '@next/swc-win32-x64-msvc@14.2.8': + optional: true + + '@next/swc-win32-x64-msvc@14.2.9': optional: true '@nicolo-ribaudo/chokidar-2@2.1.8-no-fsevents.3': @@ -15006,7 +15393,7 @@ snapshots: promise-all-reject-late: 1.0.1 promise-call-limit: 3.0.1 read-package-json-fast: 3.0.2 - semver: 7.6.0 + semver: 7.6.3 ssri: 10.0.6 treeverse: 3.0.0 walk-up-path: 3.0.1 @@ -15016,7 +15403,7 @@ snapshots: '@npmcli/fs@3.1.1': dependencies: - semver: 7.6.0 + semver: 7.6.3 '@npmcli/git@5.0.3': dependencies: @@ -15026,7 +15413,7 @@ snapshots: proc-log: 3.0.0 promise-inflight: 1.0.1 promise-retry: 2.0.1 - semver: 7.6.0 + semver: 7.6.3 which: 4.0.0 transitivePeerDependencies: - bluebird @@ -15049,7 +15436,7 @@ snapshots: json-parse-even-better-errors: 3.0.2 pacote: 18.0.6 proc-log: 4.2.0 - semver: 7.6.0 + semver: 7.6.3 transitivePeerDependencies: - bluebird - supports-color @@ -15066,7 +15453,7 @@ snapshots: json-parse-even-better-errors: 3.0.2 normalize-package-data: 6.0.2 proc-log: 4.2.0 - semver: 7.6.0 + semver: 7.6.3 transitivePeerDependencies: - bluebird @@ -15092,60 +15479,60 @@ snapshots: - bluebird - supports-color - '@nrwl/devkit@17.2.8(nx@19.6.0)': + '@nrwl/devkit@17.2.8(nx@19.7.0)': dependencies: - '@nx/devkit': 17.2.8(nx@19.6.0) + '@nx/devkit': 17.2.8(nx@19.7.0) transitivePeerDependencies: - nx - '@nrwl/tao@19.6.0': + '@nrwl/tao@19.7.0': dependencies: - nx: 19.6.0 + nx: 19.7.0 tslib: 2.6.2 transitivePeerDependencies: - '@swc-node/register' - '@swc/core' - debug - '@nx/devkit@17.2.8(nx@19.6.0)': + '@nx/devkit@17.2.8(nx@19.7.0)': dependencies: - '@nrwl/devkit': 17.2.8(nx@19.6.0) + '@nrwl/devkit': 17.2.8(nx@19.7.0) ejs: 3.1.8 enquirer: 2.3.6 ignore: 5.3.1 - nx: 19.6.0 + nx: 19.7.0 semver: 7.5.3 tmp: 0.2.3 tslib: 2.6.2 - '@nx/nx-darwin-arm64@19.6.0': + '@nx/nx-darwin-arm64@19.7.0': optional: true - '@nx/nx-darwin-x64@19.6.0': + '@nx/nx-darwin-x64@19.7.0': optional: true - '@nx/nx-freebsd-x64@19.6.0': + '@nx/nx-freebsd-x64@19.7.0': optional: true - '@nx/nx-linux-arm-gnueabihf@19.6.0': + '@nx/nx-linux-arm-gnueabihf@19.7.0': optional: true - '@nx/nx-linux-arm64-gnu@19.6.0': + '@nx/nx-linux-arm64-gnu@19.7.0': optional: true - '@nx/nx-linux-arm64-musl@19.6.0': + '@nx/nx-linux-arm64-musl@19.7.0': optional: true - '@nx/nx-linux-x64-gnu@19.6.0': + '@nx/nx-linux-x64-gnu@19.7.0': optional: true - '@nx/nx-linux-x64-musl@19.6.0': + '@nx/nx-linux-x64-musl@19.7.0': optional: true - '@nx/nx-win32-arm64-msvc@19.6.0': + '@nx/nx-win32-arm64-msvc@19.7.0': optional: true - '@nx/nx-win32-x64-msvc@19.6.0': + '@nx/nx-win32-x64-msvc@19.7.0': optional: true '@octokit/auth-token@2.5.0': @@ -15380,16 +15767,16 @@ snapshots: '@opentelemetry/api@1.8.0': optional: true - '@pigment-css/nextjs-plugin@0.0.20(@types/react@18.3.3)(next@14.2.5(@babel/core@7.25.2)(@opentelemetry/api@1.8.0)(@playwright/test@1.46.1)(babel-plugin-macros@3.1.0)(react-dom@18.3.1(react@18.3.1))(react@18.3.1))(react@18.3.1)': + '@pigment-css/nextjs-plugin@0.0.22(@types/react@18.3.4)(next@14.2.9(@babel/core@7.25.2)(@opentelemetry/api@1.8.0)(@playwright/test@1.46.1)(babel-plugin-macros@3.1.0)(react-dom@18.3.1(react@18.3.1))(react@18.3.1))(react@18.3.1)': dependencies: - '@pigment-css/unplugin': 0.0.20(@types/react@18.3.3)(react@18.3.1) - next: 14.2.5(@babel/core@7.25.2)(@opentelemetry/api@1.8.0)(@playwright/test@1.46.1)(babel-plugin-macros@3.1.0)(react-dom@18.3.1(react@18.3.1))(react@18.3.1) + '@pigment-css/unplugin': 0.0.22(@types/react@18.3.4)(react@18.3.1) + next: 14.2.9(@babel/core@7.25.2)(@opentelemetry/api@1.8.0)(@playwright/test@1.46.1)(babel-plugin-macros@3.1.0)(react-dom@18.3.1(react@18.3.1))(react@18.3.1) transitivePeerDependencies: - '@types/react' - react - supports-color - '@pigment-css/react@0.0.20(@types/react@18.3.3)(react@18.3.1)': + '@pigment-css/react@0.0.22(@types/react@18.3.4)(react@18.3.1)': dependencies: '@babel/core': 7.25.2 '@babel/helper-module-imports': 7.24.7 @@ -15398,11 +15785,11 @@ snapshots: '@babel/types': 7.25.2 '@emotion/css': 11.11.2 '@emotion/is-prop-valid': 1.3.0 - '@emotion/react': 11.13.0(@types/react@18.3.3)(react@18.3.1) - '@emotion/serialize': 1.3.0 - '@emotion/styled': 11.13.0(@emotion/react@11.13.0(@types/react@18.3.3)(react@18.3.1))(@types/react@18.3.3)(react@18.3.1) - '@mui/system': 6.0.0-dev.240424162023-9968b4889d(@emotion/react@11.13.0(@types/react@18.3.3)(react@18.3.1))(@emotion/styled@11.13.0(@emotion/react@11.13.0(@types/react@18.3.3)(react@18.3.1))(@types/react@18.3.3)(react@18.3.1))(@types/react@18.3.3)(react@18.3.1) - '@mui/utils': 6.0.0-dev.20240529-082515-213b5e33ab(@types/react@18.3.3)(react@18.3.1) + '@emotion/react': 11.13.3(@types/react@18.3.4)(react@18.3.1) + '@emotion/serialize': 1.3.1 + '@emotion/styled': 11.13.0(@emotion/react@11.13.3(@types/react@18.3.4)(react@18.3.1))(@types/react@18.3.4)(react@18.3.1) + '@mui/system': 6.0.0-dev.240424162023-9968b4889d(@emotion/react@11.13.3(@types/react@18.3.4)(react@18.3.1))(@emotion/styled@11.13.0(@emotion/react@11.13.3(@types/react@18.3.4)(react@18.3.1))(@types/react@18.3.4)(react@18.3.1))(@types/react@18.3.4)(react@18.3.1) + '@mui/utils': 6.0.0-rc.0(@types/react@18.3.4)(react@18.3.1) '@wyw-in-js/processor-utils': 0.5.4 '@wyw-in-js/shared': 0.5.4 '@wyw-in-js/transform': 0.5.4 @@ -15417,10 +15804,10 @@ snapshots: - '@types/react' - supports-color - '@pigment-css/unplugin@0.0.20(@types/react@18.3.3)(react@18.3.1)': + '@pigment-css/unplugin@0.0.22(@types/react@18.3.4)(react@18.3.1)': dependencies: '@babel/core': 7.25.2 - '@pigment-css/react': 0.0.20(@types/react@18.3.3)(react@18.3.1) + '@pigment-css/react': 0.0.22(@types/react@18.3.4)(react@18.3.1) '@wyw-in-js/shared': 0.5.4 '@wyw-in-js/transform': 0.5.4 babel-plugin-define-var: 0.1.0 @@ -15430,15 +15817,15 @@ snapshots: - react - supports-color - '@pigment-css/vite-plugin@0.0.20(@types/react@18.3.3)(react@18.3.1)(vite@5.4.1(@types/node@18.19.44)(terser@5.29.2))': + '@pigment-css/vite-plugin@0.0.22(@types/react@18.3.4)(react@18.3.1)(vite@5.4.2(@types/node@20.16.5)(terser@5.29.2))': dependencies: '@babel/core': 7.25.2 '@babel/preset-typescript': 7.24.7(@babel/core@7.25.2) - '@pigment-css/react': 0.0.20(@types/react@18.3.3)(react@18.3.1) + '@pigment-css/react': 0.0.22(@types/react@18.3.4)(react@18.3.1) '@wyw-in-js/shared': 0.5.4 '@wyw-in-js/transform': 0.5.4 babel-plugin-define-var: 0.1.0 - vite: 5.4.1(@types/node@18.19.44)(terser@5.29.2) + vite: 5.4.2(@types/node@20.16.5)(terser@5.29.2) transitivePeerDependencies: - '@types/react' - react @@ -15494,10 +15881,10 @@ snapshots: hermes-profile-transformer: 0.0.6 node-stream-zip: 1.15.0 ora: 5.4.1 - semver: 7.6.0 + semver: 7.6.3 strip-ansi: 5.2.0 wcwidth: 1.0.1 - yaml: 2.4.5 + yaml: 2.5.0 transitivePeerDependencies: - encoding @@ -15560,7 +15947,7 @@ snapshots: node-fetch: 2.7.0(encoding@0.1.13) open: 6.4.0 ora: 5.4.1 - semver: 7.6.0 + semver: 7.6.3 shell-quote: 1.8.1 sudo-prompt: 9.2.1 transitivePeerDependencies: @@ -15589,7 +15976,7 @@ snapshots: fs-extra: 8.1.0 graceful-fs: 4.2.11 prompts: 2.4.2 - semver: 7.6.0 + semver: 7.6.3 transitivePeerDependencies: - bufferutil - encoding @@ -15823,43 +16210,68 @@ snapshots: '@remix-run/router@1.19.1': {} - '@rollup/rollup-android-arm-eabi@4.13.0': + '@rollup/plugin-inject@5.0.5(rollup@4.21.1)': + dependencies: + '@rollup/pluginutils': 5.1.0(rollup@4.21.1) + estree-walker: 2.0.2 + magic-string: 0.30.10 + optionalDependencies: + rollup: 4.21.1 + + '@rollup/pluginutils@5.1.0(rollup@4.21.1)': + dependencies: + '@types/estree': 1.0.5 + estree-walker: 2.0.2 + picomatch: 2.3.1 + optionalDependencies: + rollup: 4.21.1 + + '@rollup/rollup-android-arm-eabi@4.21.1': + optional: true + + '@rollup/rollup-android-arm64@4.21.1': + optional: true + + '@rollup/rollup-darwin-arm64@4.21.1': + optional: true + + '@rollup/rollup-darwin-x64@4.21.1': optional: true - '@rollup/rollup-android-arm64@4.13.0': + '@rollup/rollup-linux-arm-gnueabihf@4.21.1': optional: true - '@rollup/rollup-darwin-arm64@4.13.0': + '@rollup/rollup-linux-arm-musleabihf@4.21.1': optional: true - '@rollup/rollup-darwin-x64@4.13.0': + '@rollup/rollup-linux-arm64-gnu@4.21.1': optional: true - '@rollup/rollup-linux-arm-gnueabihf@4.13.0': + '@rollup/rollup-linux-arm64-musl@4.21.1': optional: true - '@rollup/rollup-linux-arm64-gnu@4.13.0': + '@rollup/rollup-linux-powerpc64le-gnu@4.21.1': optional: true - '@rollup/rollup-linux-arm64-musl@4.13.0': + '@rollup/rollup-linux-riscv64-gnu@4.21.1': optional: true - '@rollup/rollup-linux-riscv64-gnu@4.13.0': + '@rollup/rollup-linux-s390x-gnu@4.21.1': optional: true - '@rollup/rollup-linux-x64-gnu@4.13.0': + '@rollup/rollup-linux-x64-gnu@4.21.1': optional: true - '@rollup/rollup-linux-x64-musl@4.13.0': + '@rollup/rollup-linux-x64-musl@4.21.1': optional: true - '@rollup/rollup-win32-arm64-msvc@4.13.0': + '@rollup/rollup-win32-arm64-msvc@4.21.1': optional: true - '@rollup/rollup-win32-ia32-msvc@4.13.0': + '@rollup/rollup-win32-ia32-msvc@4.21.1': optional: true - '@rollup/rollup-win32-x64-msvc@4.13.0': + '@rollup/rollup-win32-x64-msvc@4.21.1': optional: true '@sec-ant/readable-stream@0.4.1': {} @@ -15914,13 +16326,17 @@ snapshots: dependencies: type-detect: 4.0.8 - '@sinonjs/commons@3.0.0': + '@sinonjs/commons@3.0.1': dependencies: type-detect: 4.0.8 '@sinonjs/fake-timers@10.3.0': dependencies: - '@sinonjs/commons': 3.0.0 + '@sinonjs/commons': 3.0.1 + + '@sinonjs/fake-timers@11.3.1': + dependencies: + '@sinonjs/commons': 3.0.1 '@sinonjs/samsam@8.0.0': dependencies: @@ -15930,20 +16346,19 @@ snapshots: '@sinonjs/text-encoding@0.7.2': {} - '@slack/bolt@3.21.1': + '@slack/bolt@3.21.2': dependencies: '@slack/logger': 4.0.0 '@slack/oauth': 2.6.3 '@slack/socket-mode': 1.3.6 - '@slack/types': 2.11.0 + '@slack/types': 2.13.0 '@slack/web-api': 6.12.1 '@types/express': 4.17.17 '@types/promise.allsettled': 1.0.3 '@types/tsscmp': 1.0.0 - axios: 1.7.4(debug@4.3.5) + axios: 1.7.4(debug@4.3.6) express: 4.19.2 path-to-regexp: 6.2.1 - please-upgrade-node: 3.2.0 promise.allsettled: 1.0.6 raw-body: 2.5.2 tsscmp: 1.0.6 @@ -15955,18 +16370,18 @@ snapshots: '@slack/logger@3.0.0': dependencies: - '@types/node': 18.19.44 + '@types/node': 20.16.5 '@slack/logger@4.0.0': dependencies: - '@types/node': 18.19.44 + '@types/node': 20.16.5 '@slack/oauth@2.6.3': dependencies: '@slack/logger': 3.0.0 '@slack/web-api': 6.12.1 '@types/jsonwebtoken': 8.5.9 - '@types/node': 18.19.44 + '@types/node': 20.16.5 jsonwebtoken: 9.0.0 lodash.isstring: 4.0.1 transitivePeerDependencies: @@ -15976,7 +16391,7 @@ snapshots: dependencies: '@slack/logger': 3.0.0 '@slack/web-api': 6.12.1 - '@types/node': 18.19.44 + '@types/node': 20.16.5 '@types/ws': 7.4.7 eventemitter3: 5.0.1 finity: 0.5.4 @@ -15986,15 +16401,15 @@ snapshots: - debug - utf-8-validate - '@slack/types@2.11.0': {} + '@slack/types@2.13.0': {} '@slack/web-api@6.12.1': dependencies: '@slack/logger': 3.0.0 - '@slack/types': 2.11.0 + '@slack/types': 2.13.0 '@types/is-stream': 1.1.0 - '@types/node': 18.19.44 - axios: 1.7.4(debug@4.3.5) + '@types/node': 20.16.5 + axios: 1.7.4(debug@4.3.6) eventemitter3: 3.1.2 form-data: 2.5.1 is-electron: 2.2.2 @@ -16081,81 +16496,81 @@ snapshots: lz-string: 1.5.0 pretty-format: 27.5.1 - '@testing-library/react@16.0.0(@testing-library/dom@10.4.0)(@types/react-dom@18.3.0)(@types/react@18.3.3)(react-dom@18.3.1(react@18.3.1))(react@18.3.1)': + '@testing-library/react@16.0.1(@testing-library/dom@10.4.0)(@types/react-dom@18.3.0)(@types/react@18.3.4)(react-dom@18.3.1(react@18.3.1))(react@18.3.1)': dependencies: '@babel/runtime': 7.25.0 '@testing-library/dom': 10.4.0 react: 18.3.1 react-dom: 18.3.1(react@18.3.1) optionalDependencies: - '@types/react': 18.3.3 + '@types/react': 18.3.4 '@types/react-dom': 18.3.0 '@testing-library/user-event@14.5.2(@testing-library/dom@10.4.0)': dependencies: '@testing-library/dom': 10.4.0 - '@theme-ui/color-modes@0.16.2(@emotion/react@11.13.0(@types/react@18.3.3)(react@18.3.1))(react@18.3.1)': + '@theme-ui/color-modes@0.16.2(@emotion/react@11.13.3(@types/react@18.3.4)(react@18.3.1))(react@18.3.1)': dependencies: - '@emotion/react': 11.13.0(@types/react@18.3.3)(react@18.3.1) - '@theme-ui/core': 0.16.2(@emotion/react@11.13.0(@types/react@18.3.3)(react@18.3.1))(react@18.3.1) - '@theme-ui/css': 0.16.2(@emotion/react@11.13.0(@types/react@18.3.3)(react@18.3.1)) + '@emotion/react': 11.13.3(@types/react@18.3.4)(react@18.3.1) + '@theme-ui/core': 0.16.2(@emotion/react@11.13.3(@types/react@18.3.4)(react@18.3.1))(react@18.3.1) + '@theme-ui/css': 0.16.2(@emotion/react@11.13.3(@types/react@18.3.4)(react@18.3.1)) deepmerge: 4.3.1 react: 18.3.1 - '@theme-ui/components@0.16.2(@emotion/react@11.13.0(@types/react@18.3.3)(react@18.3.1))(@theme-ui/theme-provider@0.16.2(@emotion/react@11.13.0(@types/react@18.3.3)(react@18.3.1))(react@18.3.1))(react@18.3.1)': + '@theme-ui/components@0.16.2(@emotion/react@11.13.3(@types/react@18.3.4)(react@18.3.1))(@theme-ui/theme-provider@0.16.2(@emotion/react@11.13.3(@types/react@18.3.4)(react@18.3.1))(react@18.3.1))(react@18.3.1)': dependencies: - '@emotion/react': 11.13.0(@types/react@18.3.3)(react@18.3.1) + '@emotion/react': 11.13.3(@types/react@18.3.4)(react@18.3.1) '@styled-system/color': 5.1.2 '@styled-system/should-forward-prop': 5.1.5 '@styled-system/space': 5.1.2 - '@theme-ui/core': 0.16.2(@emotion/react@11.13.0(@types/react@18.3.3)(react@18.3.1))(react@18.3.1) - '@theme-ui/css': 0.16.2(@emotion/react@11.13.0(@types/react@18.3.3)(react@18.3.1)) - '@theme-ui/theme-provider': 0.16.2(@emotion/react@11.13.0(@types/react@18.3.3)(react@18.3.1))(react@18.3.1) + '@theme-ui/core': 0.16.2(@emotion/react@11.13.3(@types/react@18.3.4)(react@18.3.1))(react@18.3.1) + '@theme-ui/css': 0.16.2(@emotion/react@11.13.3(@types/react@18.3.4)(react@18.3.1)) + '@theme-ui/theme-provider': 0.16.2(@emotion/react@11.13.3(@types/react@18.3.4)(react@18.3.1))(react@18.3.1) '@types/styled-system': 5.1.15 react: 18.3.1 - '@theme-ui/core@0.16.2(@emotion/react@11.13.0(@types/react@18.3.3)(react@18.3.1))(react@18.3.1)': + '@theme-ui/core@0.16.2(@emotion/react@11.13.3(@types/react@18.3.4)(react@18.3.1))(react@18.3.1)': dependencies: - '@emotion/react': 11.13.0(@types/react@18.3.3)(react@18.3.1) - '@theme-ui/css': 0.16.2(@emotion/react@11.13.0(@types/react@18.3.3)(react@18.3.1)) + '@emotion/react': 11.13.3(@types/react@18.3.4)(react@18.3.1) + '@theme-ui/css': 0.16.2(@emotion/react@11.13.3(@types/react@18.3.4)(react@18.3.1)) deepmerge: 4.3.1 react: 18.3.1 - '@theme-ui/css@0.16.2(@emotion/react@11.13.0(@types/react@18.3.3)(react@18.3.1))': + '@theme-ui/css@0.16.2(@emotion/react@11.13.3(@types/react@18.3.4)(react@18.3.1))': dependencies: - '@emotion/react': 11.13.0(@types/react@18.3.3)(react@18.3.1) + '@emotion/react': 11.13.3(@types/react@18.3.4)(react@18.3.1) csstype: 3.1.3 - '@theme-ui/global@0.16.2(@emotion/react@11.13.0(@types/react@18.3.3)(react@18.3.1))(react@18.3.1)': + '@theme-ui/global@0.16.2(@emotion/react@11.13.3(@types/react@18.3.4)(react@18.3.1))(react@18.3.1)': dependencies: - '@emotion/react': 11.13.0(@types/react@18.3.3)(react@18.3.1) - '@theme-ui/core': 0.16.2(@emotion/react@11.13.0(@types/react@18.3.3)(react@18.3.1))(react@18.3.1) - '@theme-ui/css': 0.16.2(@emotion/react@11.13.0(@types/react@18.3.3)(react@18.3.1)) + '@emotion/react': 11.13.3(@types/react@18.3.4)(react@18.3.1) + '@theme-ui/core': 0.16.2(@emotion/react@11.13.3(@types/react@18.3.4)(react@18.3.1))(react@18.3.1) + '@theme-ui/css': 0.16.2(@emotion/react@11.13.3(@types/react@18.3.4)(react@18.3.1)) react: 18.3.1 - '@theme-ui/theme-provider@0.16.2(@emotion/react@11.13.0(@types/react@18.3.3)(react@18.3.1))(react@18.3.1)': + '@theme-ui/theme-provider@0.16.2(@emotion/react@11.13.3(@types/react@18.3.4)(react@18.3.1))(react@18.3.1)': dependencies: - '@emotion/react': 11.13.0(@types/react@18.3.3)(react@18.3.1) - '@theme-ui/color-modes': 0.16.2(@emotion/react@11.13.0(@types/react@18.3.3)(react@18.3.1))(react@18.3.1) - '@theme-ui/core': 0.16.2(@emotion/react@11.13.0(@types/react@18.3.3)(react@18.3.1))(react@18.3.1) - '@theme-ui/css': 0.16.2(@emotion/react@11.13.0(@types/react@18.3.3)(react@18.3.1)) + '@emotion/react': 11.13.3(@types/react@18.3.4)(react@18.3.1) + '@theme-ui/color-modes': 0.16.2(@emotion/react@11.13.3(@types/react@18.3.4)(react@18.3.1))(react@18.3.1) + '@theme-ui/core': 0.16.2(@emotion/react@11.13.3(@types/react@18.3.4)(react@18.3.1))(react@18.3.1) + '@theme-ui/css': 0.16.2(@emotion/react@11.13.3(@types/react@18.3.4)(react@18.3.1)) react: 18.3.1 - '@toolpad/core@0.5.1(@emotion/react@11.13.0(@types/react@18.3.3)(react@18.3.1))(@emotion/styled@11.13.0(@emotion/react@11.13.0(@types/react@18.3.3)(react@18.3.1))(@types/react@18.3.3)(react@18.3.1))(@mui/icons-material@packages+mui-icons-material+build)(@mui/material@packages+mui-material+build)(@types/node@18.19.44)(@types/react@18.3.3)(happy-dom@12.10.3)(jsdom@24.0.0)(next@14.2.5(@babel/core@7.25.2)(@opentelemetry/api@1.8.0)(@playwright/test@1.46.1)(babel-plugin-macros@3.1.0)(react-dom@18.3.1(react@18.3.1))(react@18.3.1))(react-dom@18.3.1(react@18.3.1))(react@18.3.1)(terser@5.29.2)': + '@toolpad/core@0.5.2(@emotion/react@11.13.3(@types/react@18.3.4)(react@18.3.1))(@emotion/styled@11.13.0(@emotion/react@11.13.3(@types/react@18.3.4)(react@18.3.1))(@types/react@18.3.4)(react@18.3.1))(@mui/icons-material@packages+mui-icons-material+build)(@mui/material@packages+mui-material+build)(@types/node@20.16.5)(@types/react@18.3.4)(happy-dom@12.10.3)(jsdom@24.0.0)(next@14.2.9(@babel/core@7.25.2)(@opentelemetry/api@1.8.0)(@playwright/test@1.46.1)(babel-plugin-macros@3.1.0)(react-dom@18.3.1(react@18.3.1))(react@18.3.1))(react-dom@18.3.1(react@18.3.1))(react@18.3.1)(terser@5.29.2)': dependencies: '@babel/runtime': 7.25.0 '@mui/icons-material': link:packages/mui-icons-material/build - '@mui/lab': 5.0.0-alpha.173(@emotion/react@11.13.0(@types/react@18.3.3)(react@18.3.1))(@emotion/styled@11.13.0(@emotion/react@11.13.0(@types/react@18.3.3)(react@18.3.1))(@types/react@18.3.3)(react@18.3.1))(@mui/material@packages+mui-material+build)(@types/react@18.3.3)(react-dom@18.3.1(react@18.3.1))(react@18.3.1) + '@mui/lab': 5.0.0-alpha.173(@emotion/react@11.13.3(@types/react@18.3.4)(react@18.3.1))(@emotion/styled@11.13.0(@emotion/react@11.13.3(@types/react@18.3.4)(react@18.3.1))(@types/react@18.3.4)(react@18.3.1))(@mui/material@packages+mui-material+build)(@types/react@18.3.4)(react-dom@18.3.1(react@18.3.1))(react@18.3.1) '@mui/material': link:packages/mui-material/build - '@mui/utils': 6.0.0-beta.5(@types/react@18.3.3)(react@18.3.1) - '@toolpad/utils': 0.5.1(@types/node@18.19.44)(happy-dom@12.10.3)(jsdom@24.0.0)(react@18.3.1)(terser@5.29.2) + '@mui/utils': 6.0.0-rc.0(@types/react@18.3.4)(react@18.3.1) + '@toolpad/utils': 0.5.2(@types/node@20.16.5)(happy-dom@12.10.3)(jsdom@24.0.0)(react@18.3.1)(terser@5.29.2) client-only: 0.0.1 invariant: 2.2.4 prop-types: 15.8.1 react: 18.3.1 optionalDependencies: - next: 14.2.5(@babel/core@7.25.2)(@opentelemetry/api@1.8.0)(@playwright/test@1.46.1)(babel-plugin-macros@3.1.0)(react-dom@18.3.1(react@18.3.1))(react@18.3.1) + next: 14.2.9(@babel/core@7.25.2)(@opentelemetry/api@1.8.0)(@playwright/test@1.46.1)(babel-plugin-macros@3.1.0)(react-dom@18.3.1(react@18.3.1))(react@18.3.1) transitivePeerDependencies: - '@edge-runtime/vm' - '@emotion/react' @@ -16176,15 +16591,15 @@ snapshots: - supports-color - terser - '@toolpad/utils@0.5.1(@types/node@18.19.44)(happy-dom@12.10.3)(jsdom@24.0.0)(react@18.3.1)(terser@5.29.2)': + '@toolpad/utils@0.5.2(@types/node@20.16.5)(happy-dom@12.10.3)(jsdom@24.0.0)(react@18.3.1)(terser@5.29.2)': dependencies: invariant: 2.2.4 prettier: 3.3.3 react: 18.3.1 react-is: 18.3.1 title: 3.5.3 - vitest: 2.0.5(@types/node@18.19.44)(happy-dom@12.10.3)(jsdom@24.0.0)(terser@5.29.2) - yaml: 2.4.5 + vitest: 2.0.5(@types/node@20.16.5)(happy-dom@12.10.3)(jsdom@24.0.0)(terser@5.29.2) + yaml: 2.5.0 yaml-diff-patch: 2.0.0 transitivePeerDependencies: - '@edge-runtime/vm' @@ -16249,17 +16664,17 @@ snapshots: '@types/body-parser@1.19.2': dependencies: '@types/connect': 3.4.35 - '@types/node': 18.19.44 + '@types/node': 20.16.5 '@types/chai-dom@1.11.3': dependencies: - '@types/chai': 4.3.17 + '@types/chai': 4.3.19 - '@types/chai@4.3.17': {} + '@types/chai@4.3.19': {} '@types/connect@3.4.35': dependencies: - '@types/node': 18.19.44 + '@types/node': 20.16.5 '@types/cookie@0.4.1': {} @@ -16295,10 +16710,10 @@ snapshots: '@types/eslint-scope@3.7.4': dependencies: - '@types/eslint': 8.56.11 + '@types/eslint': 8.56.12 '@types/estree': 1.0.5 - '@types/eslint@8.56.11': + '@types/eslint@8.56.12': dependencies: '@types/estree': 1.0.5 '@types/json-schema': 7.0.12 @@ -16307,7 +16722,7 @@ snapshots: '@types/express-serve-static-core@4.17.35': dependencies: - '@types/node': 18.19.44 + '@types/node': 20.16.5 '@types/qs': 6.9.7 '@types/range-parser': 1.2.4 '@types/send': 0.17.1 @@ -16324,13 +16739,13 @@ snapshots: '@types/fs-extra@11.0.4': dependencies: '@types/jsonfile': 6.1.1 - '@types/node': 18.19.44 + '@types/node': 20.16.5 '@types/gtag.js@0.0.20': {} '@types/hoist-non-react-statics@3.3.5': dependencies: - '@types/react': 18.3.3 + '@types/react': 18.3.4 hoist-non-react-statics: 3.3.2 '@types/html-minifier-terser@6.1.0': {} @@ -16339,7 +16754,7 @@ snapshots: '@types/is-stream@1.1.0': dependencies: - '@types/node': 18.19.44 + '@types/node': 20.16.5 '@types/istanbul-lib-coverage@2.0.6': {} @@ -16364,11 +16779,11 @@ snapshots: '@types/jsonfile@6.1.1': dependencies: - '@types/node': 18.19.44 + '@types/node': 20.16.5 '@types/jsonwebtoken@8.5.9': dependencies: - '@types/node': 18.19.44 + '@types/node': 20.16.5 '@types/lodash.mergewith@4.6.7': dependencies: @@ -16376,10 +16791,6 @@ snapshots: '@types/lodash@4.17.7': {} - '@types/mdast@3.0.10': - dependencies: - '@types/unist': 3.0.2 - '@types/mdast@4.0.4': dependencies: '@types/unist': 3.0.2 @@ -16396,9 +16807,9 @@ snapshots: '@types/ms@0.7.34': {} - '@types/node@18.19.44': + '@types/node@20.16.5': dependencies: - undici-types: 5.26.5 + undici-types: 6.19.8 '@types/normalize-package-data@2.4.1': {} @@ -16414,49 +16825,51 @@ snapshots: '@types/react-dom@18.3.0': dependencies: - '@types/react': 18.3.3 + '@types/react': 18.3.4 '@types/react-is@18.3.0': dependencies: - '@types/react': 18.3.3 + '@types/react': 18.3.4 '@types/react-reconciler@0.26.7': dependencies: - '@types/react': 18.3.3 + '@types/react': 18.3.4 '@types/react-reconciler@0.28.8': dependencies: - '@types/react': 18.3.3 + '@types/react': 18.3.4 '@types/react-swipeable-views@0.13.5': dependencies: - '@types/react': 18.3.3 + '@types/react': 18.3.4 '@types/react-transition-group@4.4.11': dependencies: - '@types/react': 18.3.3 + '@types/react': 18.3.4 '@types/react-window@1.8.8': dependencies: - '@types/react': 18.3.3 + '@types/react': 18.3.4 - '@types/react@18.3.3': + '@types/react@18.3.4': dependencies: '@types/prop-types': 15.7.12 csstype: 3.1.3 + '@types/resolve@1.20.6': {} + '@types/retry@0.12.0': {} '@types/send@0.17.1': dependencies: '@types/mime': 1.3.2 - '@types/node': 18.19.44 + '@types/node': 20.16.5 '@types/serve-static@1.15.2': dependencies: '@types/http-errors': 2.0.1 '@types/mime': 3.0.1 - '@types/node': 18.19.44 + '@types/node': 20.16.5 '@types/sinon@17.0.3': dependencies: @@ -16474,8 +16887,6 @@ snapshots: '@types/tsscmp@1.0.0': {} - '@types/unist@2.0.6': {} - '@types/unist@3.0.2': {} '@types/use-sync-external-store@0.0.3': {} @@ -16486,7 +16897,7 @@ snapshots: '@types/ws@7.4.7': dependencies: - '@types/node': 18.19.44 + '@types/node': 20.16.5 '@types/yargs-parser@21.0.3': {} @@ -16522,7 +16933,7 @@ snapshots: '@typescript-eslint/types': 7.18.0 '@typescript-eslint/typescript-estree': 7.18.0(typescript@5.5.4) '@typescript-eslint/visitor-keys': 7.18.0 - debug: 4.3.5(supports-color@8.1.1) + debug: 4.3.6(supports-color@8.1.1) eslint: 8.57.0 optionalDependencies: typescript: 5.5.4 @@ -16538,7 +16949,7 @@ snapshots: dependencies: '@typescript-eslint/typescript-estree': 7.18.0(typescript@5.5.4) '@typescript-eslint/utils': 7.18.0(eslint@8.57.0)(typescript@5.5.4) - debug: 4.3.5(supports-color@8.1.1) + debug: 4.3.6(supports-color@8.1.1) eslint: 8.57.0 ts-api-utils: 1.3.0(typescript@5.5.4) optionalDependencies: @@ -16552,11 +16963,11 @@ snapshots: dependencies: '@typescript-eslint/types': 7.18.0 '@typescript-eslint/visitor-keys': 7.18.0 - debug: 4.3.5(supports-color@8.1.1) + debug: 4.3.6(supports-color@8.1.1) globby: 11.1.0 is-glob: 4.0.3 minimatch: 9.0.5 - semver: 7.6.0 + semver: 7.6.3 ts-api-utils: 1.3.0(typescript@5.5.4) optionalDependencies: typescript: 5.5.4 @@ -16581,14 +16992,14 @@ snapshots: '@ungap/structured-clone@1.2.0': {} - '@vitejs/plugin-react@4.3.1(vite@5.4.1(@types/node@18.19.44)(terser@5.29.2))': + '@vitejs/plugin-react@4.3.1(vite@5.4.2(@types/node@20.16.5)(terser@5.29.2))': dependencies: '@babel/core': 7.25.2 '@babel/plugin-transform-react-jsx-self': 7.24.6(@babel/core@7.25.2) '@babel/plugin-transform-react-jsx-source': 7.24.1(@babel/core@7.25.2) '@types/babel__core': 7.20.5 react-refresh: 0.14.2 - vite: 5.4.1(@types/node@18.19.44)(terser@5.29.2) + vite: 5.4.2(@types/node@20.16.5)(terser@5.29.2) transitivePeerDependencies: - supports-color @@ -16725,7 +17136,7 @@ snapshots: '@wyw-in-js/shared@0.5.4': dependencies: - debug: 4.3.5(supports-color@8.1.1) + debug: 4.3.6(supports-color@8.1.1) find-up: 5.0.0 minimatch: 9.0.5 transitivePeerDependencies: @@ -16804,13 +17215,13 @@ snapshots: agent-base@6.0.2: dependencies: - debug: 4.3.5(supports-color@8.1.1) + debug: 4.3.6(supports-color@8.1.1) transitivePeerDependencies: - supports-color agent-base@7.1.0: dependencies: - debug: 4.3.5(supports-color@8.1.1) + debug: 4.3.6(supports-color@8.1.1) transitivePeerDependencies: - supports-color @@ -16932,7 +17343,7 @@ snapshots: lodash.isplainobject: 4.0.6 lodash.union: 4.6.0 normalize-path: 3.0.0 - readable-stream: 2.3.7 + readable-stream: 2.3.8 archiver@3.1.1: dependencies: @@ -16996,13 +17407,6 @@ snapshots: array-union@2.1.0: {} - array.prototype.find@2.2.2: - dependencies: - call-bind: 1.0.7 - define-properties: 1.2.1 - es-abstract: 1.23.3 - es-shim-unscopables: 1.0.2 - array.prototype.findlast@1.2.5: dependencies: call-bind: 1.0.7 @@ -17077,6 +17481,20 @@ snapshots: asap@2.0.6: {} + asn1.js@4.10.1: + dependencies: + bn.js: 4.12.0 + inherits: 2.0.4 + minimalistic-assert: 1.0.1 + + assert@2.1.0: + dependencies: + call-bind: 1.0.7 + is-nan: 1.3.2 + object-is: 1.1.6 + object.assign: 4.1.5 + util: 0.12.5 + assertion-error@1.1.0: {} assertion-error@2.0.1: {} @@ -17113,14 +17531,14 @@ snapshots: asynckit@0.4.0: {} - autoprefixer@10.4.20(postcss@8.4.41): + autoprefixer@10.4.20(postcss@8.4.45): dependencies: browserslist: 4.23.3 caniuse-lite: 1.0.30001649 fraction.js: 4.3.7 normalize-range: 0.1.2 picocolors: 1.0.1 - postcss: 8.4.41 + postcss: 8.4.45 postcss-value-parser: 4.2.0 autosuggest-highlight@3.3.4: @@ -17146,9 +17564,9 @@ snapshots: axe-core@4.7.2: {} - axios@1.7.4(debug@4.3.5): + axios@1.7.4(debug@4.3.6): dependencies: - follow-redirects: 1.15.6(debug@4.3.5) + follow-redirects: 1.15.6(debug@4.3.6) form-data: 4.0.0 proxy-from-env: 1.1.0 transitivePeerDependencies: @@ -17240,7 +17658,7 @@ snapshots: dependencies: '@babel/core': 7.25.2 core-js: 3.32.1 - debug: 4.3.5(supports-color@8.1.1) + debug: 4.3.6(supports-color@8.1.1) lodash.mergewith: 4.6.2 prettier: 2.8.8 strip-indent: 3.0.0 @@ -17257,7 +17675,7 @@ snapshots: babel-plugin-transform-react-remove-prop-types@0.4.24: {} - bail@1.0.5: {} + bail@2.0.2: {} balanced-match@1.0.2: {} @@ -17302,6 +17720,10 @@ snapshots: bluebird@3.4.7: {} + bn.js@4.12.0: {} + + bn.js@5.2.1: {} + body-parser@1.20.2: dependencies: bytes: 3.1.2 @@ -17345,12 +17767,62 @@ snapshots: dependencies: fill-range: 7.1.1 + brorand@1.1.0: {} + + browser-resolve@2.0.0: + dependencies: + resolve: 1.22.8 + browser-stdout@1.3.1: {} + browserify-aes@1.2.0: + dependencies: + buffer-xor: 1.0.3 + cipher-base: 1.0.4 + create-hash: 1.2.0 + evp_bytestokey: 1.0.3 + inherits: 2.0.4 + safe-buffer: 5.2.1 + + browserify-cipher@1.0.1: + dependencies: + browserify-aes: 1.2.0 + browserify-des: 1.0.2 + evp_bytestokey: 1.0.3 + + browserify-des@1.0.2: + dependencies: + cipher-base: 1.0.4 + des.js: 1.1.0 + inherits: 2.0.4 + safe-buffer: 5.2.1 + + browserify-rsa@4.1.0: + dependencies: + bn.js: 5.2.1 + randombytes: 2.1.0 + + browserify-sign@4.2.3: + dependencies: + bn.js: 5.2.1 + browserify-rsa: 4.1.0 + create-hash: 1.2.0 + create-hmac: 1.1.7 + elliptic: 6.5.7 + hash-base: 3.0.4 + inherits: 2.0.4 + parse-asn1: 5.1.7 + readable-stream: 2.3.8 + safe-buffer: 5.2.1 + browserify-zlib@0.1.4: dependencies: pako: 0.2.9 + browserify-zlib@0.2.0: + dependencies: + pako: 1.0.11 + browserslist@4.23.3: dependencies: caniuse-lite: 1.0.30001649 @@ -17388,6 +17860,8 @@ snapshots: buffer-indexof-polyfill@1.0.2: {} + buffer-xor@1.0.3: {} + buffer@4.9.2: dependencies: base64-js: 1.5.1 @@ -17406,6 +17880,8 @@ snapshots: buffers@0.1.1: {} + builtin-status-codes@3.0.0: {} + busboy@1.6.0: dependencies: streamsearch: 1.1.0 @@ -17563,11 +18039,7 @@ snapshots: chance@1.1.12: {} - character-entities-legacy@1.1.4: {} - - character-entities@1.2.4: {} - - character-reference-invalid@1.1.4: {} + character-entities@2.0.2: {} chardet@0.7.0: {} @@ -17595,7 +18067,7 @@ snapshots: chrome-launcher@0.15.2: dependencies: - '@types/node': 18.19.44 + '@types/node': 20.16.5 escape-string-regexp: 4.0.0 is-wsl: 2.2.0 lighthouse-logger: 1.4.2 @@ -17606,7 +18078,7 @@ snapshots: chromium-edge-launcher@1.0.0: dependencies: - '@types/node': 18.19.44 + '@types/node': 20.16.5 escape-string-regexp: 4.0.0 is-wsl: 2.2.0 lighthouse-logger: 1.4.2 @@ -17621,6 +18093,11 @@ snapshots: ci-info@4.0.0: {} + cipher-base@1.0.4: + dependencies: + inherits: 2.0.4 + safe-buffer: 5.2.1 + classnames@2.3.2: {} claudia-api-builder@4.1.2: {} @@ -17787,7 +18264,7 @@ snapshots: buffer-crc32: 0.2.13 crc32-stream: 3.0.1 normalize-path: 3.0.0 - readable-stream: 2.3.7 + readable-stream: 2.3.8 compress-commons@4.1.1: dependencies: @@ -17850,8 +18327,12 @@ snapshots: transitivePeerDependencies: - supports-color + console-browserify@1.2.0: {} + console-control-strings@1.1.0: {} + constants-browserify@1.0.0: {} + content-disposition@0.5.2: {} content-disposition@0.5.4: @@ -17887,7 +18368,7 @@ snapshots: handlebars: 4.7.7 json-stringify-safe: 5.0.1 meow: 8.1.2 - semver: 7.6.0 + semver: 7.6.3 split: 1.0.1 conventional-commits-filter@3.0.0: @@ -18006,6 +18487,30 @@ snapshots: dependencies: buffer: 5.7.1 + create-ecdh@4.0.4: + dependencies: + bn.js: 4.12.0 + elliptic: 6.5.7 + + create-hash@1.2.0: + dependencies: + cipher-base: 1.0.4 + inherits: 2.0.4 + md5.js: 1.3.5 + ripemd160: 2.0.2 + sha.js: 2.4.11 + + create-hmac@1.1.7: + dependencies: + cipher-base: 1.0.4 + create-hash: 1.2.0 + inherits: 2.0.4 + ripemd160: 2.0.2 + safe-buffer: 5.2.1 + sha.js: 2.4.11 + + create-require@1.1.1: {} + cross-env@7.0.3: dependencies: cross-spawn: 7.0.3 @@ -18033,6 +18538,20 @@ snapshots: shebang-command: 2.0.0 which: 2.0.2 + crypto-browserify@3.12.0: + dependencies: + browserify-cipher: 1.0.1 + browserify-sign: 4.2.3 + create-ecdh: 4.0.4 + create-hash: 1.2.0 + create-hmac: 1.1.7 + diffie-hellman: 5.0.3 + inherits: 2.0.4 + pbkdf2: 3.1.2 + public-encrypt: 4.0.3 + randombytes: 2.1.0 + randomfill: 1.0.4 + css-box-model@1.2.1: dependencies: tiny-invariant: 1.3.3 @@ -18164,7 +18683,7 @@ snapshots: chalk: 2.4.2 commander: 2.20.3 core-js: 3.32.1 - debug: 4.3.5(supports-color@8.1.1) + debug: 4.3.6(supports-color@8.1.1) fast-json-patch: 3.1.1 get-stdin: 6.0.0 http-proxy-agent: 5.0.0 @@ -18224,8 +18743,6 @@ snapshots: es-errors: 1.3.0 is-data-view: 1.0.1 - date-fns-jalali@2.21.3-1: {} - date-fns@2.30.0: dependencies: '@babel/runtime': 7.25.0 @@ -18234,7 +18751,7 @@ snapshots: dateformat@3.0.3: {} - dayjs@1.11.12: {} + dayjs@1.11.13: {} debounce@1.2.1: {} @@ -18246,7 +18763,7 @@ snapshots: dependencies: ms: 2.1.3 - debug@4.3.5(supports-color@8.1.1): + debug@4.3.6(supports-color@8.1.1): dependencies: ms: 2.1.2 optionalDependencies: @@ -18265,6 +18782,10 @@ snapshots: decimal.js@10.4.3: {} + decode-named-character-reference@1.0.2: + dependencies: + character-entities: 2.0.2 + dedent@1.5.3(babel-plugin-macros@3.1.0): optionalDependencies: babel-plugin-macros: 3.1.0 @@ -18327,12 +18848,21 @@ snapshots: dequal@2.0.3: {} + des.js@1.1.0: + dependencies: + inherits: 2.0.4 + minimalistic-assert: 1.0.1 + destroy@1.2.0: {} detect-indent@5.0.0: {} detect-libc@2.0.3: {} + devlop@1.1.0: + dependencies: + dequal: 2.0.3 + di@0.0.1: {} didyoumean@1.2.2: {} @@ -18341,6 +18871,12 @@ snapshots: diff@5.2.0: {} + diffie-hellman@5.0.3: + dependencies: + bn.js: 4.12.0 + miller-rabin: 4.0.1 + randombytes: 2.1.0 + dir-glob@3.0.1: dependencies: path-type: 4.0.0 @@ -18387,6 +18923,8 @@ snapshots: domhandler: 5.0.3 entities: 4.5.0 + domain-browser@4.23.0: {} + domelementtype@2.3.0: {} domhandler@4.3.1: @@ -18426,7 +18964,7 @@ snapshots: duplexer2@0.1.4: dependencies: - readable-stream: 2.3.7 + readable-stream: 2.3.8 duplexer@0.1.2: {} @@ -18434,7 +18972,7 @@ snapshots: dependencies: end-of-stream: 1.4.4 inherits: 2.0.4 - readable-stream: 2.3.7 + readable-stream: 2.3.8 stream-shift: 1.0.1 eastasianwidth@0.2.0: {} @@ -18451,6 +18989,16 @@ snapshots: electron-to-chromium@1.5.4: {} + elliptic@6.5.7: + dependencies: + bn.js: 4.12.0 + brorand: 1.1.0 + hash.js: 1.1.7 + hmac-drbg: 1.0.1 + inherits: 2.0.4 + minimalistic-assert: 1.0.1 + minimalistic-crypto-utils: 1.0.1 + emoji-regex@10.3.0: {} emoji-regex@8.0.0: {} @@ -18474,12 +19022,12 @@ snapshots: dependencies: '@types/cookie': 0.4.1 '@types/cors': 2.8.12 - '@types/node': 18.19.44 + '@types/node': 20.16.5 accepts: 1.3.8 base64id: 2.0.0 cookie: 0.4.2 cors: 2.8.5 - debug: 4.3.5(supports-color@8.1.1) + debug: 4.3.6(supports-color@8.1.1) engine.io-parser: 5.2.2 ws: 8.11.0 transitivePeerDependencies: @@ -18708,31 +19256,31 @@ snapshots: escape-string-regexp@5.0.0: {} - eslint-config-airbnb-base@15.0.0(eslint-plugin-import@2.29.1(@typescript-eslint/parser@7.18.0(eslint@8.57.0)(typescript@5.5.4))(eslint-import-resolver-webpack@0.13.8)(eslint@8.57.0))(eslint@8.57.0): + eslint-config-airbnb-base@15.0.0(eslint-plugin-import@2.29.1(@typescript-eslint/parser@7.18.0(eslint@8.57.0)(typescript@5.5.4))(eslint-import-resolver-webpack@0.13.9)(eslint@8.57.0))(eslint@8.57.0): dependencies: confusing-browser-globals: 1.0.11 eslint: 8.57.0 - eslint-plugin-import: 2.29.1(@typescript-eslint/parser@7.18.0(eslint@8.57.0)(typescript@5.5.4))(eslint-import-resolver-webpack@0.13.8)(eslint@8.57.0) + eslint-plugin-import: 2.29.1(@typescript-eslint/parser@7.18.0(eslint@8.57.0)(typescript@5.5.4))(eslint-import-resolver-webpack@0.13.9)(eslint@8.57.0) object.assign: 4.1.5 object.entries: 1.1.8 semver: 6.3.1 - eslint-config-airbnb-typescript@18.0.0(@typescript-eslint/eslint-plugin@7.18.0(@typescript-eslint/parser@7.18.0(eslint@8.57.0)(typescript@5.5.4))(eslint@8.57.0)(typescript@5.5.4))(@typescript-eslint/parser@7.18.0(eslint@8.57.0)(typescript@5.5.4))(eslint-plugin-import@2.29.1(@typescript-eslint/parser@7.18.0(eslint@8.57.0)(typescript@5.5.4))(eslint-import-resolver-webpack@0.13.8)(eslint@8.57.0))(eslint@8.57.0): + eslint-config-airbnb-typescript@18.0.0(@typescript-eslint/eslint-plugin@7.18.0(@typescript-eslint/parser@7.18.0(eslint@8.57.0)(typescript@5.5.4))(eslint@8.57.0)(typescript@5.5.4))(@typescript-eslint/parser@7.18.0(eslint@8.57.0)(typescript@5.5.4))(eslint-plugin-import@2.29.1(@typescript-eslint/parser@7.18.0(eslint@8.57.0)(typescript@5.5.4))(eslint-import-resolver-webpack@0.13.9)(eslint@8.57.0))(eslint@8.57.0): dependencies: '@typescript-eslint/eslint-plugin': 7.18.0(@typescript-eslint/parser@7.18.0(eslint@8.57.0)(typescript@5.5.4))(eslint@8.57.0)(typescript@5.5.4) '@typescript-eslint/parser': 7.18.0(eslint@8.57.0)(typescript@5.5.4) eslint: 8.57.0 - eslint-config-airbnb-base: 15.0.0(eslint-plugin-import@2.29.1(@typescript-eslint/parser@7.18.0(eslint@8.57.0)(typescript@5.5.4))(eslint-import-resolver-webpack@0.13.8)(eslint@8.57.0))(eslint@8.57.0) + eslint-config-airbnb-base: 15.0.0(eslint-plugin-import@2.29.1(@typescript-eslint/parser@7.18.0(eslint@8.57.0)(typescript@5.5.4))(eslint-import-resolver-webpack@0.13.9)(eslint@8.57.0))(eslint@8.57.0) transitivePeerDependencies: - eslint-plugin-import - eslint-config-airbnb@19.0.4(eslint-plugin-import@2.29.1(@typescript-eslint/parser@7.18.0(eslint@8.57.0)(typescript@5.5.4))(eslint-import-resolver-webpack@0.13.8)(eslint@8.57.0))(eslint-plugin-jsx-a11y@6.7.1(eslint@8.57.0))(eslint-plugin-react-hooks@4.6.2(eslint@8.57.0))(eslint-plugin-react@7.35.0(eslint@8.57.0))(eslint@8.57.0): + eslint-config-airbnb@19.0.4(eslint-plugin-import@2.29.1(@typescript-eslint/parser@7.18.0(eslint@8.57.0)(typescript@5.5.4))(eslint-import-resolver-webpack@0.13.9)(eslint@8.57.0))(eslint-plugin-jsx-a11y@6.7.1(eslint@8.57.0))(eslint-plugin-react-hooks@4.6.2(eslint@8.57.0))(eslint-plugin-react@7.35.2(eslint@8.57.0))(eslint@8.57.0): dependencies: eslint: 8.57.0 - eslint-config-airbnb-base: 15.0.0(eslint-plugin-import@2.29.1(@typescript-eslint/parser@7.18.0(eslint@8.57.0)(typescript@5.5.4))(eslint-import-resolver-webpack@0.13.8)(eslint@8.57.0))(eslint@8.57.0) - eslint-plugin-import: 2.29.1(@typescript-eslint/parser@7.18.0(eslint@8.57.0)(typescript@5.5.4))(eslint-import-resolver-webpack@0.13.8)(eslint@8.57.0) + eslint-config-airbnb-base: 15.0.0(eslint-plugin-import@2.29.1(@typescript-eslint/parser@7.18.0(eslint@8.57.0)(typescript@5.5.4))(eslint-import-resolver-webpack@0.13.9)(eslint@8.57.0))(eslint@8.57.0) + eslint-plugin-import: 2.29.1(@typescript-eslint/parser@7.18.0(eslint@8.57.0)(typescript@5.5.4))(eslint-import-resolver-webpack@0.13.9)(eslint@8.57.0) eslint-plugin-jsx-a11y: 6.7.1(eslint@8.57.0) - eslint-plugin-react: 7.35.0(eslint@8.57.0) + eslint-plugin-react: 7.35.2(eslint@8.57.0) eslint-plugin-react-hooks: 4.6.2(eslint@8.57.0) object.assign: 4.1.5 object.entries: 1.1.8 @@ -18749,12 +19297,11 @@ snapshots: transitivePeerDependencies: - supports-color - eslint-import-resolver-webpack@0.13.8(eslint-plugin-import@2.29.1)(webpack@5.93.0(webpack-cli@5.1.4)): + eslint-import-resolver-webpack@0.13.9(eslint-plugin-import@2.29.1)(webpack@5.93.0(webpack-cli@5.1.4)): dependencies: - array.prototype.find: 2.2.2 debug: 3.2.7 enhanced-resolve: 0.9.1 - eslint-plugin-import: 2.29.1(@typescript-eslint/parser@7.18.0(eslint@8.57.0)(typescript@5.5.4))(eslint-import-resolver-webpack@0.13.8)(eslint@8.57.0) + eslint-plugin-import: 2.29.1(@typescript-eslint/parser@7.18.0(eslint@8.57.0)(typescript@5.5.4))(eslint-import-resolver-webpack@0.13.9)(eslint@8.57.0) find-root: 1.1.0 hasown: 2.0.2 interpret: 1.4.0 @@ -18767,14 +19314,14 @@ snapshots: transitivePeerDependencies: - supports-color - eslint-module-utils@2.8.0(@typescript-eslint/parser@7.18.0(eslint@8.57.0)(typescript@5.5.4))(eslint-import-resolver-node@0.3.9)(eslint-import-resolver-webpack@0.13.8(eslint-plugin-import@2.29.1)(webpack@5.93.0(webpack-cli@5.1.4)))(eslint@8.57.0): + eslint-module-utils@2.8.0(@typescript-eslint/parser@7.18.0(eslint@8.57.0)(typescript@5.5.4))(eslint-import-resolver-node@0.3.9)(eslint-import-resolver-webpack@0.13.9(eslint-plugin-import@2.29.1)(webpack@5.93.0(webpack-cli@5.1.4)))(eslint@8.57.0): dependencies: debug: 3.2.7 optionalDependencies: '@typescript-eslint/parser': 7.18.0(eslint@8.57.0)(typescript@5.5.4) eslint: 8.57.0 eslint-import-resolver-node: 0.3.9 - eslint-import-resolver-webpack: 0.13.8(eslint-plugin-import@2.29.1)(webpack@5.93.0(webpack-cli@5.1.4)) + eslint-import-resolver-webpack: 0.13.9(eslint-plugin-import@2.29.1)(webpack@5.93.0(webpack-cli@5.1.4)) transitivePeerDependencies: - supports-color @@ -18791,7 +19338,7 @@ snapshots: lodash.snakecase: 4.1.1 lodash.upperfirst: 4.3.1 - eslint-plugin-import@2.29.1(@typescript-eslint/parser@7.18.0(eslint@8.57.0)(typescript@5.5.4))(eslint-import-resolver-webpack@0.13.8)(eslint@8.57.0): + eslint-plugin-import@2.29.1(@typescript-eslint/parser@7.18.0(eslint@8.57.0)(typescript@5.5.4))(eslint-import-resolver-webpack@0.13.9)(eslint@8.57.0): dependencies: array-includes: 3.1.8 array.prototype.findlastindex: 1.2.3 @@ -18801,7 +19348,7 @@ snapshots: doctrine: 2.1.0 eslint: 8.57.0 eslint-import-resolver-node: 0.3.9 - eslint-module-utils: 2.8.0(@typescript-eslint/parser@7.18.0(eslint@8.57.0)(typescript@5.5.4))(eslint-import-resolver-node@0.3.9)(eslint-import-resolver-webpack@0.13.8(eslint-plugin-import@2.29.1)(webpack@5.93.0(webpack-cli@5.1.4)))(eslint@8.57.0) + eslint-module-utils: 2.8.0(@typescript-eslint/parser@7.18.0(eslint@8.57.0)(typescript@5.5.4))(eslint-import-resolver-node@0.3.9)(eslint-import-resolver-webpack@0.13.9(eslint-plugin-import@2.29.1)(webpack@5.93.0(webpack-cli@5.1.4)))(eslint@8.57.0) hasown: 2.0.2 is-core-module: 2.13.1 is-glob: 4.0.3 @@ -18845,7 +19392,7 @@ snapshots: globals: 13.24.0 rambda: 7.5.0 - eslint-plugin-react-compiler@0.0.0-experimental-9aef357-20240815(eslint@8.57.0): + eslint-plugin-react-compiler@0.0.0-experimental-3f2f4f0-20240826(eslint@8.57.0): dependencies: '@babel/core': 7.25.2 '@babel/parser': 7.25.3 @@ -18861,7 +19408,7 @@ snapshots: dependencies: eslint: 8.57.0 - eslint-plugin-react@7.35.0(eslint@8.57.0): + eslint-plugin-react@7.35.2(eslint@8.57.0): dependencies: array-includes: 3.1.8 array.prototype.findlast: 1.2.5 @@ -18917,7 +19464,7 @@ snapshots: ajv: 6.12.6 chalk: 4.1.2 cross-spawn: 7.0.3 - debug: 4.3.5(supports-color@8.1.1) + debug: 4.3.6(supports-color@8.1.1) doctrine: 3.0.0 escape-string-regexp: 4.0.0 eslint-scope: 7.2.2 @@ -18979,6 +19526,8 @@ snapshots: transitivePeerDependencies: - supports-color + estree-walker@2.0.2: {} + estree-walker@3.0.3: dependencies: '@types/estree': 1.0.5 @@ -19009,10 +19558,15 @@ snapshots: events@3.3.0: {} + evp_bytestokey@1.0.3: + dependencies: + md5.js: 1.3.5 + safe-buffer: 5.2.1 + exceljs@4.4.0: dependencies: archiver: 5.3.1 - dayjs: 1.11.12 + dayjs: 1.11.13 fast-csv: 4.3.6 jszip: 3.10.1 readable-stream: 3.6.0 @@ -19303,9 +19857,9 @@ snapshots: flow-parser@0.206.0: {} - follow-redirects@1.15.6(debug@4.3.5): + follow-redirects@1.15.6(debug@4.3.6): optionalDependencies: - debug: 4.3.5(supports-color@8.1.1) + debug: 4.3.6(supports-color@8.1.1) for-each@0.3.3: dependencies: @@ -19501,7 +20055,7 @@ snapshots: git-semver-tags@5.0.1: dependencies: meow: 8.1.2 - semver: 7.6.0 + semver: 7.6.3 git-up@7.0.0: dependencies: @@ -19654,7 +20208,7 @@ snapshots: extend: 3.0.2 gaxios: 6.1.1(encoding@0.1.13) google-auth-library: 9.13.0(encoding@0.1.13) - qs: 6.12.0 + qs: 6.13.0 url-template: 2.0.8 uuid: 9.0.1 transitivePeerDependencies: @@ -19736,6 +20290,22 @@ snapshots: dependencies: function-bind: 1.1.2 + hash-base@3.0.4: + dependencies: + inherits: 2.0.4 + safe-buffer: 5.2.1 + + hash-base@3.1.0: + dependencies: + inherits: 2.0.4 + readable-stream: 3.6.0 + safe-buffer: 5.2.1 + + hash.js@1.1.7: + dependencies: + inherits: 2.0.4 + minimalistic-assert: 1.0.1 + hasha@5.2.2: dependencies: is-stream: 2.0.1 @@ -19763,6 +20333,12 @@ snapshots: dependencies: source-map: 0.7.4 + hmac-drbg@1.0.1: + dependencies: + hash.js: 1.1.7 + minimalistic-assert: 1.0.1 + minimalistic-crypto-utils: 1.0.1 + hoist-non-react-statics@3.3.2: dependencies: react-is: 16.13.1 @@ -19838,25 +20414,27 @@ snapshots: dependencies: '@tootallnate/once': 2.0.0 agent-base: 6.0.2 - debug: 4.3.5(supports-color@8.1.1) + debug: 4.3.6(supports-color@8.1.1) transitivePeerDependencies: - supports-color http-proxy-agent@7.0.0: dependencies: agent-base: 7.1.0 - debug: 4.3.5(supports-color@8.1.1) + debug: 4.3.6(supports-color@8.1.1) transitivePeerDependencies: - supports-color http-proxy@1.18.1: dependencies: eventemitter3: 4.0.7 - follow-redirects: 1.15.6(debug@4.3.5) + follow-redirects: 1.15.6(debug@4.3.6) requires-port: 1.0.0 transitivePeerDependencies: - debug + https-browserify@1.0.0: {} + https-proxy-agent@2.2.4: dependencies: agent-base: 4.3.0 @@ -19867,14 +20445,14 @@ snapshots: https-proxy-agent@5.0.1: dependencies: agent-base: 6.0.2 - debug: 4.3.5(supports-color@8.1.1) + debug: 4.3.6(supports-color@8.1.1) transitivePeerDependencies: - supports-color https-proxy-agent@7.0.2: dependencies: agent-base: 7.1.0 - debug: 4.3.5(supports-color@8.1.1) + debug: 4.3.6(supports-color@8.1.1) transitivePeerDependencies: - supports-color @@ -19954,7 +20532,7 @@ snapshots: npm-package-arg: 11.0.2 promzard: 1.0.0 read: 3.0.1 - semver: 7.6.0 + semver: 7.6.3 validate-npm-package-license: 3.0.4 validate-npm-package-name: 5.0.1 transitivePeerDependencies: @@ -19998,13 +20576,6 @@ snapshots: ipaddr.js@1.9.1: {} - is-alphabetical@1.0.4: {} - - is-alphanumerical@1.0.4: - dependencies: - is-alphabetical: 1.0.4 - is-decimal: 1.0.4 - is-arguments@1.1.1: dependencies: call-bind: 1.0.7 @@ -20036,8 +20607,6 @@ snapshots: call-bind: 1.0.7 has-tostringtag: 1.0.2 - is-buffer@2.0.5: {} - is-callable@1.2.7: {} is-ci@3.0.1: @@ -20056,8 +20625,6 @@ snapshots: dependencies: has-tostringtag: 1.0.2 - is-decimal@1.0.4: {} - is-deflate@1.0.0: {} is-directory@0.3.1: {} @@ -20092,8 +20659,6 @@ snapshots: is-gzip@1.0.0: {} - is-hexadecimal@1.0.4: {} - is-in-browser@1.1.3: {} is-interactive@1.0.0: {} @@ -20102,6 +20667,11 @@ snapshots: is-map@2.0.2: {} + is-nan@1.3.2: + dependencies: + call-bind: 1.0.7 + define-properties: 1.2.1 + is-negative-zero@2.0.3: {} is-number-object@1.0.7: @@ -20212,6 +20782,8 @@ snapshots: isobject@3.0.1: {} + isomorphic-timers-promises@1.0.1: {} + istanbul-lib-coverage@2.0.5: {} istanbul-lib-coverage@3.2.0: {} @@ -20226,7 +20798,7 @@ snapshots: '@babel/parser': 7.25.3 '@istanbuljs/schema': 0.1.3 istanbul-lib-coverage: 3.2.0 - semver: 7.6.0 + semver: 7.6.3 transitivePeerDependencies: - supports-color @@ -20247,7 +20819,7 @@ snapshots: istanbul-lib-source-maps@3.0.6: dependencies: - debug: 4.3.5(supports-color@8.1.1) + debug: 4.3.6(supports-color@8.1.1) istanbul-lib-coverage: 2.0.5 make-dir: 2.1.0 rimraf: 2.7.1 @@ -20257,7 +20829,7 @@ snapshots: istanbul-lib-source-maps@4.0.1: dependencies: - debug: 4.3.5(supports-color@8.1.1) + debug: 4.3.6(supports-color@8.1.1) istanbul-lib-coverage: 3.2.0 source-map: 0.6.1 transitivePeerDependencies: @@ -20313,7 +20885,7 @@ snapshots: '@jest/environment': 29.7.0 '@jest/fake-timers': 29.7.0 '@jest/types': 29.6.3 - '@types/node': 18.19.44 + '@types/node': 20.16.5 jest-mock: 29.7.0 jest-util: 29.7.0 @@ -20334,13 +20906,13 @@ snapshots: jest-mock@29.7.0: dependencies: '@jest/types': 29.6.3 - '@types/node': 18.19.44 + '@types/node': 20.16.5 jest-util: 29.7.0 jest-util@29.7.0: dependencies: '@jest/types': 29.6.3 - '@types/node': 18.19.44 + '@types/node': 20.16.5 chalk: 4.1.2 ci-info: 3.9.0 graceful-fs: 4.2.11 @@ -20357,13 +20929,13 @@ snapshots: jest-worker@27.5.1: dependencies: - '@types/node': 18.19.44 + '@types/node': 20.16.5 merge-stream: 2.0.0 supports-color: 8.1.1 jest-worker@29.7.0: dependencies: - '@types/node': 18.19.44 + '@types/node': 20.16.5 jest-util: 29.7.0 merge-stream: 2.0.0 supports-color: 8.1.1 @@ -20545,7 +21117,7 @@ snapshots: jws: 3.2.2 lodash: 4.17.21 ms: 2.1.3 - semver: 7.6.0 + semver: 7.6.3 jss-plugin-camel-case@10.10.0: dependencies: @@ -20653,7 +21225,7 @@ snapshots: dependencies: lie: 3.3.0 pako: 1.0.11 - readable-stream: 2.3.7 + readable-stream: 2.3.8 setimmediate: 1.0.5 junk@4.0.1: {} @@ -20662,7 +21234,7 @@ snapshots: just-diff@6.0.2: {} - just-extend@4.2.1: {} + just-extend@6.2.0: {} jwa@1.4.1: dependencies: @@ -20783,7 +21355,7 @@ snapshots: lazystream@1.0.1: dependencies: - readable-stream: 2.3.7 + readable-stream: 2.3.8 lerna@8.1.8(babel-plugin-macros@3.1.0)(encoding@0.1.13): dependencies: @@ -20791,7 +21363,7 @@ snapshots: '@npmcli/arborist': 7.5.4 '@npmcli/package-json': 5.2.0 '@npmcli/run-script': 8.1.0 - '@nx/devkit': 17.2.8(nx@19.6.0) + '@nx/devkit': 17.2.8(nx@19.7.0) '@octokit/plugin-enterprise-rest': 6.0.1 '@octokit/rest': 19.0.11(encoding@0.1.13) aproba: 2.0.0 @@ -20836,7 +21408,7 @@ snapshots: npm-package-arg: 11.0.2 npm-packlist: 8.0.2 npm-registry-fetch: 17.1.0 - nx: 19.6.0 + nx: 19.7.0 p-map: 4.0.0 p-map-series: 2.1.0 p-pipe: 3.1.0 @@ -20848,7 +21420,7 @@ snapshots: read-cmd-shim: 4.0.0 resolve-from: 5.0.0 rimraf: 4.4.1 - semver: 7.6.0 + semver: 7.6.3 set-blocking: 2.0.0 signal-exit: 3.0.7 slash: 3.0.0 @@ -20898,7 +21470,7 @@ snapshots: npm-package-arg: 11.0.2 npm-registry-fetch: 17.1.0 proc-log: 4.2.0 - semver: 7.6.0 + semver: 7.6.3 sigstore: 2.3.1 ssri: 10.0.6 transitivePeerDependencies: @@ -21048,7 +21620,7 @@ snapshots: log4js@6.6.1: dependencies: date-format: 4.0.13 - debug: 4.3.5(supports-color@8.1.1) + debug: 4.3.6(supports-color@8.1.1) flatted: 3.2.9 rfdc: 1.3.0 streamroller: 3.1.2 @@ -21058,10 +21630,10 @@ snapshots: logkitty@0.7.1: dependencies: ansi-fragments: 0.2.1 - dayjs: 1.11.12 + dayjs: 1.11.13 yargs: 15.4.1 - longest-streak@2.0.4: {} + longest-streak@3.1.0: {} loose-envify@1.4.0: dependencies: @@ -21111,7 +21683,7 @@ snapshots: make-dir@4.0.0: dependencies: - semver: 7.6.0 + semver: 7.6.3 make-fetch-happen@13.0.1: dependencies: @@ -21182,33 +21754,55 @@ snapshots: '@babel/runtime': 7.25.0 '@mui/material': link:packages/mui-material/build '@types/prop-types': 15.7.12 - '@types/react': 18.3.3 + '@types/react': 18.3.4 classnames: 2.3.2 prop-types: 15.8.1 react: 18.3.1 mathml-tag-names@2.1.3: {} - mdast-util-from-markdown@0.8.5: + md5.js@1.3.5: + dependencies: + hash-base: 3.1.0 + inherits: 2.0.4 + safe-buffer: 5.2.1 + + mdast-util-from-markdown@2.0.1: dependencies: - '@types/mdast': 3.0.10 - mdast-util-to-string: 2.0.0 - micromark: 2.11.4 - parse-entities: 2.0.0 - unist-util-stringify-position: 2.0.3 + '@types/mdast': 4.0.4 + '@types/unist': 3.0.2 + decode-named-character-reference: 1.0.2 + devlop: 1.1.0 + mdast-util-to-string: 4.0.0 + micromark: 4.0.0 + micromark-util-decode-numeric-character-reference: 2.0.1 + micromark-util-decode-string: 2.0.0 + micromark-util-normalize-identifier: 2.0.0 + micromark-util-symbol: 2.0.0 + micromark-util-types: 2.0.0 + unist-util-stringify-position: 4.0.0 transitivePeerDependencies: - supports-color - mdast-util-to-markdown@0.6.5: + mdast-util-phrasing@4.1.0: + dependencies: + '@types/mdast': 4.0.4 + unist-util-is: 6.0.0 + + mdast-util-to-markdown@2.1.0: dependencies: - '@types/unist': 2.0.6 - longest-streak: 2.0.4 - mdast-util-to-string: 2.0.0 - parse-entities: 2.0.0 - repeat-string: 1.6.1 - zwitch: 1.0.5 + '@types/mdast': 4.0.4 + '@types/unist': 3.0.2 + longest-streak: 3.1.0 + mdast-util-phrasing: 4.1.0 + mdast-util-to-string: 4.0.0 + micromark-util-decode-string: 2.0.0 + unist-util-visit: 5.0.0 + zwitch: 2.0.4 - mdast-util-to-string@2.0.0: {} + mdast-util-to-string@4.0.0: + dependencies: + '@types/mdast': 4.0.4 mdn-data@2.0.28: {} @@ -21434,10 +22028,136 @@ snapshots: - supports-color - utf-8-validate - micromark@2.11.4: + micromark-core-commonmark@2.0.1: + dependencies: + decode-named-character-reference: 1.0.2 + devlop: 1.1.0 + micromark-factory-destination: 2.0.0 + micromark-factory-label: 2.0.0 + micromark-factory-space: 2.0.0 + micromark-factory-title: 2.0.0 + micromark-factory-whitespace: 2.0.0 + micromark-util-character: 2.1.0 + micromark-util-chunked: 2.0.0 + micromark-util-classify-character: 2.0.0 + micromark-util-html-tag-name: 2.0.0 + micromark-util-normalize-identifier: 2.0.0 + micromark-util-resolve-all: 2.0.0 + micromark-util-subtokenize: 2.0.1 + micromark-util-symbol: 2.0.0 + micromark-util-types: 2.0.0 + + micromark-factory-destination@2.0.0: + dependencies: + micromark-util-character: 2.1.0 + micromark-util-symbol: 2.0.0 + micromark-util-types: 2.0.0 + + micromark-factory-label@2.0.0: dependencies: - debug: 4.3.5(supports-color@8.1.1) - parse-entities: 2.0.0 + devlop: 1.1.0 + micromark-util-character: 2.1.0 + micromark-util-symbol: 2.0.0 + micromark-util-types: 2.0.0 + + micromark-factory-space@2.0.0: + dependencies: + micromark-util-character: 2.1.0 + micromark-util-types: 2.0.0 + + micromark-factory-title@2.0.0: + dependencies: + micromark-factory-space: 2.0.0 + micromark-util-character: 2.1.0 + micromark-util-symbol: 2.0.0 + micromark-util-types: 2.0.0 + + micromark-factory-whitespace@2.0.0: + dependencies: + micromark-factory-space: 2.0.0 + micromark-util-character: 2.1.0 + micromark-util-symbol: 2.0.0 + micromark-util-types: 2.0.0 + + micromark-util-character@2.1.0: + dependencies: + micromark-util-symbol: 2.0.0 + micromark-util-types: 2.0.0 + + micromark-util-chunked@2.0.0: + dependencies: + micromark-util-symbol: 2.0.0 + + micromark-util-classify-character@2.0.0: + dependencies: + micromark-util-character: 2.1.0 + micromark-util-symbol: 2.0.0 + micromark-util-types: 2.0.0 + + micromark-util-combine-extensions@2.0.0: + dependencies: + micromark-util-chunked: 2.0.0 + micromark-util-types: 2.0.0 + + micromark-util-decode-numeric-character-reference@2.0.1: + dependencies: + micromark-util-symbol: 2.0.0 + + micromark-util-decode-string@2.0.0: + dependencies: + decode-named-character-reference: 1.0.2 + micromark-util-character: 2.1.0 + micromark-util-decode-numeric-character-reference: 2.0.1 + micromark-util-symbol: 2.0.0 + + micromark-util-encode@2.0.0: {} + + micromark-util-html-tag-name@2.0.0: {} + + micromark-util-normalize-identifier@2.0.0: + dependencies: + micromark-util-symbol: 2.0.0 + + micromark-util-resolve-all@2.0.0: + dependencies: + micromark-util-types: 2.0.0 + + micromark-util-sanitize-uri@2.0.0: + dependencies: + micromark-util-character: 2.1.0 + micromark-util-encode: 2.0.0 + micromark-util-symbol: 2.0.0 + + micromark-util-subtokenize@2.0.1: + dependencies: + devlop: 1.1.0 + micromark-util-chunked: 2.0.0 + micromark-util-symbol: 2.0.0 + micromark-util-types: 2.0.0 + + micromark-util-symbol@2.0.0: {} + + micromark-util-types@2.0.0: {} + + micromark@4.0.0: + dependencies: + '@types/debug': 4.1.12 + debug: 4.3.6(supports-color@8.1.1) + decode-named-character-reference: 1.0.2 + devlop: 1.1.0 + micromark-core-commonmark: 2.0.1 + micromark-factory-space: 2.0.0 + micromark-util-character: 2.1.0 + micromark-util-chunked: 2.0.0 + micromark-util-combine-extensions: 2.0.0 + micromark-util-decode-numeric-character-reference: 2.0.1 + micromark-util-encode: 2.0.0 + micromark-util-normalize-identifier: 2.0.0 + micromark-util-resolve-all: 2.0.0 + micromark-util-sanitize-uri: 2.0.0 + micromark-util-subtokenize: 2.0.1 + micromark-util-symbol: 2.0.0 + micromark-util-types: 2.0.0 transitivePeerDependencies: - supports-color @@ -21451,6 +22171,11 @@ snapshots: braces: 3.0.3 picomatch: 2.3.1 + miller-rabin@4.0.1: + dependencies: + bn.js: 4.12.0 + brorand: 1.1.0 + mime-db@1.33.0: {} mime-db@1.52.0: {} @@ -21475,6 +22200,10 @@ snapshots: minimal-request-promise@1.5.0: {} + minimalistic-assert@1.0.1: {} + + minimalistic-crypto-utils@1.0.1: {} + minimatch@3.0.5: dependencies: brace-expansion: 1.1.11 @@ -21566,7 +22295,7 @@ snapshots: ansi-colors: 4.1.3 browser-stdout: 1.3.1 chokidar: 3.6.0 - debug: 4.3.5(supports-color@8.1.1) + debug: 4.3.6(supports-color@8.1.1) diff: 5.2.0 escape-string-regexp: 4.0.0 find-up: 5.0.0 @@ -21631,9 +22360,9 @@ snapshots: nested-error-stacks@2.1.1: {} - next@14.2.5(@babel/core@7.25.2)(@opentelemetry/api@1.8.0)(@playwright/test@1.46.1)(babel-plugin-macros@3.1.0)(react-dom@18.3.1(react@18.3.1))(react@18.3.1): + next@14.2.8(@babel/core@7.25.2)(@opentelemetry/api@1.8.0)(@playwright/test@1.46.1)(babel-plugin-macros@3.1.0)(react-dom@18.3.1(react@18.3.1))(react@18.3.1): dependencies: - '@next/env': 14.2.5 + '@next/env': 14.2.8 '@swc/helpers': 0.5.5 busboy: 1.6.0 caniuse-lite: 1.0.30001649 @@ -21643,15 +22372,42 @@ snapshots: react-dom: 18.3.1(react@18.3.1) styled-jsx: 5.1.1(@babel/core@7.25.2)(babel-plugin-macros@3.1.0)(react@18.3.1) optionalDependencies: - '@next/swc-darwin-arm64': 14.2.5 - '@next/swc-darwin-x64': 14.2.5 - '@next/swc-linux-arm64-gnu': 14.2.5 - '@next/swc-linux-arm64-musl': 14.2.5 - '@next/swc-linux-x64-gnu': 14.2.5 - '@next/swc-linux-x64-musl': 14.2.5 - '@next/swc-win32-arm64-msvc': 14.2.5 - '@next/swc-win32-ia32-msvc': 14.2.5 - '@next/swc-win32-x64-msvc': 14.2.5 + '@next/swc-darwin-arm64': 14.2.8 + '@next/swc-darwin-x64': 14.2.8 + '@next/swc-linux-arm64-gnu': 14.2.8 + '@next/swc-linux-arm64-musl': 14.2.8 + '@next/swc-linux-x64-gnu': 14.2.8 + '@next/swc-linux-x64-musl': 14.2.8 + '@next/swc-win32-arm64-msvc': 14.2.8 + '@next/swc-win32-ia32-msvc': 14.2.8 + '@next/swc-win32-x64-msvc': 14.2.8 + '@opentelemetry/api': 1.8.0 + '@playwright/test': 1.46.1 + transitivePeerDependencies: + - '@babel/core' + - babel-plugin-macros + + next@14.2.9(@babel/core@7.25.2)(@opentelemetry/api@1.8.0)(@playwright/test@1.46.1)(babel-plugin-macros@3.1.0)(react-dom@18.3.1(react@18.3.1))(react@18.3.1): + dependencies: + '@next/env': 14.2.9 + '@swc/helpers': 0.5.5 + busboy: 1.6.0 + caniuse-lite: 1.0.30001649 + graceful-fs: 4.2.11 + postcss: 8.4.31 + react: 18.3.1 + react-dom: 18.3.1(react@18.3.1) + styled-jsx: 5.1.1(@babel/core@7.25.2)(babel-plugin-macros@3.1.0)(react@18.3.1) + optionalDependencies: + '@next/swc-darwin-arm64': 14.2.9 + '@next/swc-darwin-x64': 14.2.9 + '@next/swc-linux-arm64-gnu': 14.2.9 + '@next/swc-linux-arm64-musl': 14.2.9 + '@next/swc-linux-x64-gnu': 14.2.9 + '@next/swc-linux-x64-musl': 14.2.9 + '@next/swc-win32-arm64-msvc': 14.2.9 + '@next/swc-win32-ia32-msvc': 14.2.9 + '@next/swc-win32-x64-msvc': 14.2.9 '@opentelemetry/api': 1.8.0 '@playwright/test': 1.46.1 transitivePeerDependencies: @@ -21664,13 +22420,13 @@ snapshots: node-gyp-build: 4.5.0 optional: true - nise@5.1.4: + nise@6.0.0: dependencies: - '@sinonjs/commons': 2.0.0 - '@sinonjs/fake-timers': 10.3.0 + '@sinonjs/commons': 3.0.1 + '@sinonjs/fake-timers': 11.3.1 '@sinonjs/text-encoding': 0.7.2 - just-extend: 4.2.1 - path-to-regexp: 1.8.0 + just-extend: 6.2.0 + path-to-regexp: 6.2.1 no-case@3.0.4: dependencies: @@ -21719,7 +22475,7 @@ snapshots: make-fetch-happen: 13.0.1 nopt: 7.2.1 proc-log: 3.0.0 - semver: 7.6.0 + semver: 7.6.3 tar: 6.2.1 which: 4.0.0 transitivePeerDependencies: @@ -21735,6 +22491,36 @@ snapshots: node-releases@2.0.18: {} + node-stdlib-browser@1.2.0: + dependencies: + assert: 2.1.0 + browser-resolve: 2.0.0 + browserify-zlib: 0.2.0 + buffer: 5.7.1 + console-browserify: 1.2.0 + constants-browserify: 1.0.0 + create-require: 1.1.1 + crypto-browserify: 3.12.0 + domain-browser: 4.23.0 + events: 3.3.0 + https-browserify: 1.0.0 + isomorphic-timers-promises: 1.0.1 + os-browserify: 0.3.0 + path-browserify: 1.0.1 + pkg-dir: 5.0.0 + process: 0.11.10 + punycode: 1.4.1 + querystring-es3: 0.2.1 + readable-stream: 3.6.0 + stream-browserify: 3.0.0 + stream-http: 3.2.0 + string_decoder: 1.3.0 + timers-browserify: 2.0.12 + tty-browserify: 0.0.1 + url: 0.11.4 + util: 0.12.5 + vm-browserify: 1.1.2 + node-stream-zip@1.15.0: {} nopt@7.2.1: @@ -21752,13 +22538,13 @@ snapshots: dependencies: hosted-git-info: 4.1.0 is-core-module: 2.13.1 - semver: 7.6.0 + semver: 7.6.3 validate-npm-package-license: 3.0.4 normalize-package-data@6.0.2: dependencies: hosted-git-info: 7.0.2 - semver: 7.6.0 + semver: 7.6.3 validate-npm-package-license: 3.0.4 normalize-path@3.0.0: {} @@ -21780,7 +22566,7 @@ snapshots: npm-install-checks@6.3.0: dependencies: - semver: 7.6.0 + semver: 7.6.3 npm-normalize-package-bin@3.0.1: {} @@ -21788,7 +22574,7 @@ snapshots: dependencies: hosted-git-info: 7.0.2 proc-log: 4.2.0 - semver: 7.6.0 + semver: 7.6.3 validate-npm-package-name: 5.0.1 npm-packlist@8.0.2: @@ -21800,7 +22586,7 @@ snapshots: npm-install-checks: 6.3.0 npm-normalize-package-bin: 3.0.1 npm-package-arg: 11.0.2 - semver: 7.6.0 + semver: 7.6.3 npm-registry-fetch@17.1.0: dependencies: @@ -21837,14 +22623,14 @@ snapshots: nwsapi@2.2.7: {} - nx@19.6.0: + nx@19.7.0: dependencies: '@napi-rs/wasm-runtime': 0.2.4 - '@nrwl/tao': 19.6.0 + '@nrwl/tao': 19.7.0 '@yarnpkg/lockfile': 1.1.0 '@yarnpkg/parsers': 3.0.0-rc.46 '@zkochan/js-yaml': 0.0.7 - axios: 1.7.4(debug@4.3.5) + axios: 1.7.4(debug@4.3.6) chalk: 4.1.2 cli-cursor: 3.1.0 cli-spinners: 2.6.1 @@ -21865,7 +22651,7 @@ snapshots: npm-run-path: 4.0.1 open: 8.4.0 ora: 5.3.0 - semver: 7.6.0 + semver: 7.6.3 string-width: 4.2.3 strong-log-transformer: 2.1.0 tar-stream: 2.2.0 @@ -21875,16 +22661,16 @@ snapshots: yargs: 17.7.2 yargs-parser: 21.1.1 optionalDependencies: - '@nx/nx-darwin-arm64': 19.6.0 - '@nx/nx-darwin-x64': 19.6.0 - '@nx/nx-freebsd-x64': 19.6.0 - '@nx/nx-linux-arm-gnueabihf': 19.6.0 - '@nx/nx-linux-arm64-gnu': 19.6.0 - '@nx/nx-linux-arm64-musl': 19.6.0 - '@nx/nx-linux-x64-gnu': 19.6.0 - '@nx/nx-linux-x64-musl': 19.6.0 - '@nx/nx-win32-arm64-msvc': 19.6.0 - '@nx/nx-win32-x64-msvc': 19.6.0 + '@nx/nx-darwin-arm64': 19.7.0 + '@nx/nx-darwin-x64': 19.7.0 + '@nx/nx-freebsd-x64': 19.7.0 + '@nx/nx-linux-arm-gnueabihf': 19.7.0 + '@nx/nx-linux-arm64-gnu': 19.7.0 + '@nx/nx-linux-arm64-musl': 19.7.0 + '@nx/nx-linux-x64-gnu': 19.7.0 + '@nx/nx-linux-x64-musl': 19.7.0 + '@nx/nx-win32-arm64-msvc': 19.7.0 + '@nx/nx-win32-x64-msvc': 19.7.0 transitivePeerDependencies: - debug @@ -21930,6 +22716,11 @@ snapshots: object-inspect@1.13.1: {} + object-is@1.1.6: + dependencies: + call-bind: 1.0.7 + define-properties: 1.2.1 + object-keys@0.4.0: {} object-keys@1.1.1: {} @@ -22017,6 +22808,12 @@ snapshots: is-docker: 2.2.1 is-wsl: 2.2.0 + openapi-fetch@0.11.1: + dependencies: + openapi-typescript-helpers: 0.0.12 + + openapi-typescript-helpers@0.0.12: {} + opener@1.5.2: {} oppa@0.4.0: @@ -22055,6 +22852,8 @@ snapshots: strip-ansi: 6.0.1 wcwidth: 1.0.1 + os-browserify@0.3.0: {} + os-tmpdir@1.0.2: {} override-require@1.1.1: {} @@ -22192,6 +22991,15 @@ snapshots: dependencies: callsites: 3.1.0 + parse-asn1@5.1.7: + dependencies: + asn1.js: 4.10.1 + browserify-aes: 1.2.0 + evp_bytestokey: 1.0.3 + hash-base: 3.0.4 + pbkdf2: 3.1.2 + safe-buffer: 5.2.1 + parse-code-context@1.0.0: {} parse-conflict-json@3.0.1: @@ -22202,15 +23010,6 @@ snapshots: parse-diff@0.7.1: {} - parse-entities@2.0.0: - dependencies: - character-entities: 1.2.4 - character-entities-legacy: 1.1.4 - character-reference-invalid: 1.1.4 - is-alphanumerical: 1.0.4 - is-decimal: 1.0.4 - is-hexadecimal: 1.0.4 - parse-git-config@2.0.3: dependencies: expand-tilde: 2.0.2 @@ -22258,6 +23057,8 @@ snapshots: no-case: 3.0.4 tslib: 2.6.2 + path-browserify@1.0.1: {} + path-exists@3.0.0: {} path-exists@4.0.0: {} @@ -22283,10 +23084,6 @@ snapshots: path-to-regexp@0.1.7: {} - path-to-regexp@1.8.0: - dependencies: - isarray: 0.0.1 - path-to-regexp@2.2.1: {} path-to-regexp@6.2.1: {} @@ -22309,6 +23106,14 @@ snapshots: dependencies: through: 2.3.8 + pbkdf2@3.1.2: + dependencies: + create-hash: 1.2.0 + create-hmac: 1.1.7 + ripemd160: 2.0.2 + safe-buffer: 5.2.1 + sha.js: 2.4.11 + peek-stream@1.1.3: dependencies: buffer-from: 1.1.2 @@ -22347,6 +23152,10 @@ snapshots: dependencies: find-up: 4.1.0 + pkg-dir@5.0.0: + dependencies: + find-up: 5.0.0 + pkg-dir@7.0.0: dependencies: find-up: 6.3.0 @@ -22371,13 +23180,9 @@ snapshots: optionalDependencies: fsevents: 2.3.2 - please-upgrade-node@3.2.0: - dependencies: - semver-compare: 1.0.0 - possible-typed-array-names@1.0.0: {} - postcss-cli@11.0.0(jiti@1.21.0)(postcss@8.4.41)(tsx@4.17.0): + postcss-cli@11.0.0(jiti@1.21.0)(postcss@8.4.45)(tsx@4.17.0): dependencies: chokidar: 3.6.0 dependency-graph: 0.11.0 @@ -22385,9 +23190,9 @@ snapshots: get-stdin: 9.0.0 globby: 14.0.2 picocolors: 1.0.1 - postcss: 8.4.41 - postcss-load-config: 5.1.0(jiti@1.21.0)(postcss@8.4.41)(tsx@4.17.0) - postcss-reporter: 7.1.0(postcss@8.4.41) + postcss: 8.4.45 + postcss-load-config: 5.1.0(jiti@1.21.0)(postcss@8.4.45)(tsx@4.17.0) + postcss-reporter: 7.1.0(postcss@8.4.45) pretty-hrtime: 1.0.3 read-cache: 1.0.0 slash: 5.1.0 @@ -22400,66 +23205,66 @@ snapshots: dependencies: postcss: 7.0.39 - postcss-import@15.1.0(postcss@8.4.41): + postcss-import@15.1.0(postcss@8.4.45): dependencies: - postcss: 8.4.41 + postcss: 8.4.45 postcss-value-parser: 4.2.0 read-cache: 1.0.0 resolve: 1.22.8 - postcss-import@16.1.0(postcss@8.4.41): + postcss-import@16.1.0(postcss@8.4.45): dependencies: - postcss: 8.4.41 + postcss: 8.4.45 postcss-value-parser: 4.2.0 read-cache: 1.0.0 resolve: 1.22.8 - postcss-js@4.0.1(postcss@8.4.41): + postcss-js@4.0.1(postcss@8.4.45): dependencies: camelcase-css: 2.0.1 - postcss: 8.4.41 + postcss: 8.4.45 - postcss-load-config@4.0.1(postcss@8.4.41): + postcss-load-config@4.0.1(postcss@8.4.45): dependencies: lilconfig: 2.1.0 - yaml: 2.4.5 + yaml: 2.5.0 optionalDependencies: - postcss: 8.4.41 + postcss: 8.4.45 - postcss-load-config@5.1.0(jiti@1.21.0)(postcss@8.4.41)(tsx@4.17.0): + postcss-load-config@5.1.0(jiti@1.21.0)(postcss@8.4.45)(tsx@4.17.0): dependencies: lilconfig: 3.1.1 - yaml: 2.4.5 + yaml: 2.5.0 optionalDependencies: jiti: 1.21.0 - postcss: 8.4.41 + postcss: 8.4.45 tsx: 4.17.0 - postcss-nested@6.0.1(postcss@8.4.41): + postcss-nested@6.0.1(postcss@8.4.45): dependencies: - postcss: 8.4.41 + postcss: 8.4.45 postcss-selector-parser: 6.0.13 - postcss-reporter@7.1.0(postcss@8.4.41): + postcss-reporter@7.1.0(postcss@8.4.45): dependencies: picocolors: 1.0.1 - postcss: 8.4.41 + postcss: 8.4.45 thenby: 1.3.4 postcss-resolve-nested-selector@0.1.1: {} - postcss-safe-parser@6.0.0(postcss@8.4.41): + postcss-safe-parser@6.0.0(postcss@8.4.45): dependencies: - postcss: 8.4.41 + postcss: 8.4.45 postcss-selector-parser@6.0.13: dependencies: cssesc: 3.0.0 util-deprecate: 1.0.2 - postcss-styled-syntax@0.6.4(postcss@8.4.41): + postcss-styled-syntax@0.6.4(postcss@8.4.45): dependencies: - postcss: 8.4.41 + postcss: 8.4.45 typescript: 5.5.4 postcss-value-parser@4.2.0: {} @@ -22481,7 +23286,7 @@ snapshots: picocolors: 1.0.1 source-map-js: 1.2.0 - postcss@8.4.41: + postcss@8.4.45: dependencies: nanoid: 3.3.7 picocolors: 1.0.1 @@ -22611,6 +23416,15 @@ snapshots: psl@1.9.0: {} + public-encrypt@4.0.3: + dependencies: + bn.js: 4.12.0 + browserify-rsa: 4.1.0 + create-hash: 1.2.0 + parse-asn1: 5.1.7 + randombytes: 2.1.0 + safe-buffer: 5.2.1 + pump@2.0.1: dependencies: end-of-stream: 1.4.4 @@ -22643,10 +23457,12 @@ snapshots: dependencies: side-channel: 1.0.6 - qs@6.12.0: + qs@6.13.0: dependencies: side-channel: 1.0.6 + querystring-es3@0.2.1: {} + querystring@0.2.0: {} querystringify@2.2.0: {} @@ -22667,6 +23483,11 @@ snapshots: dependencies: safe-buffer: 5.2.1 + randomfill@1.0.4: + dependencies: + randombytes: 2.1.0 + safe-buffer: 5.2.1 + range-parser@1.2.0: {} range-parser@1.2.1: {} @@ -22749,7 +23570,7 @@ snapshots: prop-types: 15.8.1 react: 18.3.1 - react-intersection-observer@9.13.0(react-dom@18.3.1(react@18.3.1))(react@18.3.1): + react-intersection-observer@9.13.1(react-dom@18.3.1(react@18.3.1))(react@18.3.1): dependencies: react: 18.3.1 optionalDependencies: @@ -22835,9 +23656,8 @@ snapshots: - supports-color - utf-8-validate - react-number-format@5.4.0(react-dom@18.3.1(react@18.3.1))(react@18.3.1): + react-number-format@5.4.2(react-dom@18.3.1(react@18.3.1))(react@18.3.1): dependencies: - prop-types: 15.8.1 react: 18.3.1 react-dom: 18.3.1(react@18.3.1) @@ -22853,7 +23673,7 @@ snapshots: react: 18.3.1 scheduler: 0.23.2 - react-redux@8.1.3(@types/react-dom@18.3.0)(@types/react@18.3.3)(react-dom@18.3.1(react@18.3.1))(react-native@0.73.6(@babel/core@7.25.2)(@babel/preset-env@7.25.3(@babel/core@7.25.2))(encoding@0.1.13)(react@18.3.1))(react@18.3.1)(redux@4.2.1): + react-redux@8.1.3(@types/react-dom@18.3.0)(@types/react@18.3.4)(react-dom@18.3.1(react@18.3.1))(react-native@0.73.6(@babel/core@7.25.2)(@babel/preset-env@7.25.3(@babel/core@7.25.2))(encoding@0.1.13)(react@18.3.1))(react@18.3.1)(redux@4.2.1): dependencies: '@babel/runtime': 7.25.0 '@types/hoist-non-react-statics': 3.3.5 @@ -22863,7 +23683,7 @@ snapshots: react-is: 18.3.1 use-sync-external-store: 1.2.0(react@18.3.1) optionalDependencies: - '@types/react': 18.3.3 + '@types/react': 18.3.4 '@types/react-dom': 18.3.0 react-dom: 18.3.1(react@18.3.1) react-native: 0.73.6(@babel/core@7.25.2)(@babel/preset-env@7.25.3(@babel/core@7.25.2))(encoding@0.1.13)(react@18.3.1) @@ -22959,7 +23779,7 @@ snapshots: react: 18.3.1 react-dom: 18.3.1(react@18.3.1) - react-virtuoso@4.10.1(react-dom@18.3.1(react@18.3.1))(react@18.3.1): + react-virtuoso@4.10.3(react-dom@18.3.1(react@18.3.1))(react@18.3.1): dependencies: react: 18.3.1 react-dom: 18.3.1(react@18.3.1) @@ -23044,7 +23864,7 @@ snapshots: isarray: 0.0.1 string_decoder: 0.10.31 - readable-stream@2.3.7: + readable-stream@2.3.8: dependencies: core-util-is: 1.0.3 inherits: 2.0.4 @@ -23174,21 +23994,27 @@ snapshots: dependencies: es6-error: 4.1.1 - remark-parse@9.0.0: + remark-parse@11.0.0: dependencies: - mdast-util-from-markdown: 0.8.5 + '@types/mdast': 4.0.4 + mdast-util-from-markdown: 2.0.1 + micromark-util-types: 2.0.0 + unified: 11.0.5 transitivePeerDependencies: - supports-color - remark-stringify@9.0.1: + remark-stringify@11.0.0: dependencies: - mdast-util-to-markdown: 0.6.5 + '@types/mdast': 4.0.4 + mdast-util-to-markdown: 2.1.0 + unified: 11.0.5 - remark@13.0.0: + remark@15.0.1: dependencies: - remark-parse: 9.0.0 - remark-stringify: 9.0.1 - unified: 9.2.2 + '@types/mdast': 4.0.4 + remark-parse: 11.0.0 + remark-stringify: 11.0.0 + unified: 11.0.5 transitivePeerDependencies: - supports-color @@ -23202,8 +24028,6 @@ snapshots: lodash: 4.17.21 strip-ansi: 6.0.1 - repeat-string@1.6.1: {} - require-directory@2.1.1: {} require-from-string@2.0.2: {} @@ -23277,25 +24101,33 @@ snapshots: dependencies: glob: 10.3.10 + ripemd160@2.0.2: + dependencies: + hash-base: 3.1.0 + inherits: 2.0.4 + robust-predicates@3.0.2: {} - rollup@4.13.0: + rollup@4.21.1: dependencies: '@types/estree': 1.0.5 optionalDependencies: - '@rollup/rollup-android-arm-eabi': 4.13.0 - '@rollup/rollup-android-arm64': 4.13.0 - '@rollup/rollup-darwin-arm64': 4.13.0 - '@rollup/rollup-darwin-x64': 4.13.0 - '@rollup/rollup-linux-arm-gnueabihf': 4.13.0 - '@rollup/rollup-linux-arm64-gnu': 4.13.0 - '@rollup/rollup-linux-arm64-musl': 4.13.0 - '@rollup/rollup-linux-riscv64-gnu': 4.13.0 - '@rollup/rollup-linux-x64-gnu': 4.13.0 - '@rollup/rollup-linux-x64-musl': 4.13.0 - '@rollup/rollup-win32-arm64-msvc': 4.13.0 - '@rollup/rollup-win32-ia32-msvc': 4.13.0 - '@rollup/rollup-win32-x64-msvc': 4.13.0 + '@rollup/rollup-android-arm-eabi': 4.21.1 + '@rollup/rollup-android-arm64': 4.21.1 + '@rollup/rollup-darwin-arm64': 4.21.1 + '@rollup/rollup-darwin-x64': 4.21.1 + '@rollup/rollup-linux-arm-gnueabihf': 4.21.1 + '@rollup/rollup-linux-arm-musleabihf': 4.21.1 + '@rollup/rollup-linux-arm64-gnu': 4.21.1 + '@rollup/rollup-linux-arm64-musl': 4.21.1 + '@rollup/rollup-linux-powerpc64le-gnu': 4.21.1 + '@rollup/rollup-linux-riscv64-gnu': 4.21.1 + '@rollup/rollup-linux-s390x-gnu': 4.21.1 + '@rollup/rollup-linux-x64-gnu': 4.21.1 + '@rollup/rollup-linux-x64-musl': 4.21.1 + '@rollup/rollup-win32-arm64-msvc': 4.21.1 + '@rollup/rollup-win32-ia32-msvc': 4.21.1 + '@rollup/rollup-win32-x64-msvc': 4.21.1 fsevents: 2.3.3 rrweb-cssom@0.6.0: {} @@ -23372,8 +24204,6 @@ snapshots: search-insights@2.13.0: {} - semver-compare@1.0.0: {} - semver@5.7.2: {} semver@6.3.1: {} @@ -23382,9 +24212,7 @@ snapshots: dependencies: lru-cache: 6.0.0 - semver@7.6.0: - dependencies: - lru-cache: 6.0.0 + semver@7.6.3: {} send@0.18.0: dependencies: @@ -23470,6 +24298,11 @@ snapshots: setprototypeof@1.2.0: {} + sha.js@2.4.11: + dependencies: + inherits: 2.0.4 + safe-buffer: 5.2.1 + shallow-clone@3.0.1: dependencies: kind-of: 6.0.3 @@ -23478,31 +24311,31 @@ snapshots: shallowequal@1.1.0: {} - sharp@0.33.3: + sharp@0.33.5: dependencies: color: 4.2.3 detect-libc: 2.0.3 - semver: 7.6.0 + semver: 7.6.3 optionalDependencies: - '@img/sharp-darwin-arm64': 0.33.3 - '@img/sharp-darwin-x64': 0.33.3 - '@img/sharp-libvips-darwin-arm64': 1.0.2 - '@img/sharp-libvips-darwin-x64': 1.0.2 - '@img/sharp-libvips-linux-arm': 1.0.2 - '@img/sharp-libvips-linux-arm64': 1.0.2 - '@img/sharp-libvips-linux-s390x': 1.0.2 - '@img/sharp-libvips-linux-x64': 1.0.2 - '@img/sharp-libvips-linuxmusl-arm64': 1.0.2 - '@img/sharp-libvips-linuxmusl-x64': 1.0.2 - '@img/sharp-linux-arm': 0.33.3 - '@img/sharp-linux-arm64': 0.33.3 - '@img/sharp-linux-s390x': 0.33.3 - '@img/sharp-linux-x64': 0.33.3 - '@img/sharp-linuxmusl-arm64': 0.33.3 - '@img/sharp-linuxmusl-x64': 0.33.3 - '@img/sharp-wasm32': 0.33.3 - '@img/sharp-win32-ia32': 0.33.3 - '@img/sharp-win32-x64': 0.33.3 + '@img/sharp-darwin-arm64': 0.33.5 + '@img/sharp-darwin-x64': 0.33.5 + '@img/sharp-libvips-darwin-arm64': 1.0.4 + '@img/sharp-libvips-darwin-x64': 1.0.4 + '@img/sharp-libvips-linux-arm': 1.0.5 + '@img/sharp-libvips-linux-arm64': 1.0.4 + '@img/sharp-libvips-linux-s390x': 1.0.4 + '@img/sharp-libvips-linux-x64': 1.0.4 + '@img/sharp-libvips-linuxmusl-arm64': 1.0.4 + '@img/sharp-libvips-linuxmusl-x64': 1.0.4 + '@img/sharp-linux-arm': 0.33.5 + '@img/sharp-linux-arm64': 0.33.5 + '@img/sharp-linux-s390x': 0.33.5 + '@img/sharp-linux-x64': 0.33.5 + '@img/sharp-linuxmusl-arm64': 0.33.5 + '@img/sharp-linuxmusl-x64': 0.33.5 + '@img/sharp-wasm32': 0.33.5 + '@img/sharp-win32-ia32': 0.33.5 + '@img/sharp-win32-x64': 0.33.5 shebang-command@1.2.0: dependencies: @@ -23557,13 +24390,13 @@ snapshots: dependencies: is-arrayish: 0.3.2 - sinon@16.1.3: + sinon@18.0.0: dependencies: - '@sinonjs/commons': 3.0.0 - '@sinonjs/fake-timers': 10.3.0 + '@sinonjs/commons': 3.0.1 + '@sinonjs/fake-timers': 11.3.1 '@sinonjs/samsam': 8.0.0 diff: 5.2.0 - nise: 5.1.4 + nise: 6.0.0 supports-color: 7.2.0 sirv@2.0.3: @@ -23598,7 +24431,7 @@ snapshots: socket.io-adapter@2.5.4: dependencies: - debug: 4.3.5(supports-color@8.1.1) + debug: 4.3.6(supports-color@8.1.1) ws: 8.11.0 transitivePeerDependencies: - bufferutil @@ -23608,7 +24441,7 @@ snapshots: socket.io-parser@4.2.4: dependencies: '@socket.io/component-emitter': 3.1.0 - debug: 4.3.5(supports-color@8.1.1) + debug: 4.3.6(supports-color@8.1.1) transitivePeerDependencies: - supports-color @@ -23617,7 +24450,7 @@ snapshots: accepts: 1.3.8 base64id: 2.0.0 cors: 2.8.5 - debug: 4.3.5(supports-color@8.1.1) + debug: 4.3.6(supports-color@8.1.1) engine.io: 6.5.4 socket.io-adapter: 2.5.4 socket.io-parser: 4.2.4 @@ -23629,7 +24462,7 @@ snapshots: socks-proxy-agent@8.0.2: dependencies: agent-base: 7.1.0 - debug: 4.3.5(supports-color@8.1.1) + debug: 4.3.6(supports-color@8.1.1) socks: 2.7.1 transitivePeerDependencies: - supports-color @@ -23721,16 +24554,28 @@ snapshots: dependencies: internal-slot: 1.0.7 + stream-browserify@3.0.0: + dependencies: + inherits: 2.0.4 + readable-stream: 3.6.0 + stream-combiner@0.0.4: dependencies: duplexer: 0.1.2 + stream-http@3.2.0: + dependencies: + builtin-status-codes: 3.0.0 + inherits: 2.0.4 + readable-stream: 3.6.0 + xtend: 4.0.2 + stream-shift@1.0.1: {} streamroller@3.1.2: dependencies: date-format: 4.0.13 - debug: 4.3.5(supports-color@8.1.1) + debug: 4.3.6(supports-color@8.1.1) fs-extra: 8.1.0 transitivePeerDependencies: - supports-color @@ -23913,7 +24758,7 @@ snapshots: cosmiconfig: 8.2.0 css-functions-list: 3.2.1 css-tree: 2.3.1 - debug: 4.3.5(supports-color@8.1.1) + debug: 4.3.6(supports-color@8.1.1) fast-glob: 3.3.2 fastest-levenshtein: 1.0.16 file-entry-cache: 7.0.2 @@ -23931,9 +24776,9 @@ snapshots: micromatch: 4.0.7 normalize-path: 3.0.0 picocolors: 1.0.1 - postcss: 8.4.41 + postcss: 8.4.45 postcss-resolve-nested-selector: 0.1.1 - postcss-safe-parser: 6.0.0(postcss@8.4.41) + postcss-safe-parser: 6.0.0(postcss@8.4.45) postcss-selector-parser: 6.0.13 postcss-value-parser: 4.2.0 resolve-from: 5.0.0 @@ -24050,11 +24895,11 @@ snapshots: normalize-path: 3.0.0 object-hash: 3.0.0 picocolors: 1.0.1 - postcss: 8.4.41 - postcss-import: 15.1.0(postcss@8.4.41) - postcss-js: 4.0.1(postcss@8.4.41) - postcss-load-config: 4.0.1(postcss@8.4.41) - postcss-nested: 6.0.1(postcss@8.4.41) + postcss: 8.4.45 + postcss-import: 15.1.0(postcss@8.4.45) + postcss-js: 4.0.1(postcss@8.4.45) + postcss-load-config: 4.0.1(postcss@8.4.45) + postcss-nested: 6.0.1(postcss@8.4.45) postcss-selector-parser: 6.0.13 resolve: 1.22.8 sucrase: 3.34.0 @@ -24141,15 +24986,15 @@ snapshots: text-table@0.2.0: {} - theme-ui@0.16.2(@emotion/react@11.13.0(@types/react@18.3.3)(react@18.3.1))(react@18.3.1): + theme-ui@0.16.2(@emotion/react@11.13.3(@types/react@18.3.4)(react@18.3.1))(react@18.3.1): dependencies: - '@emotion/react': 11.13.0(@types/react@18.3.3)(react@18.3.1) - '@theme-ui/color-modes': 0.16.2(@emotion/react@11.13.0(@types/react@18.3.3)(react@18.3.1))(react@18.3.1) - '@theme-ui/components': 0.16.2(@emotion/react@11.13.0(@types/react@18.3.3)(react@18.3.1))(@theme-ui/theme-provider@0.16.2(@emotion/react@11.13.0(@types/react@18.3.3)(react@18.3.1))(react@18.3.1))(react@18.3.1) - '@theme-ui/core': 0.16.2(@emotion/react@11.13.0(@types/react@18.3.3)(react@18.3.1))(react@18.3.1) - '@theme-ui/css': 0.16.2(@emotion/react@11.13.0(@types/react@18.3.3)(react@18.3.1)) - '@theme-ui/global': 0.16.2(@emotion/react@11.13.0(@types/react@18.3.3)(react@18.3.1))(react@18.3.1) - '@theme-ui/theme-provider': 0.16.2(@emotion/react@11.13.0(@types/react@18.3.3)(react@18.3.1))(react@18.3.1) + '@emotion/react': 11.13.3(@types/react@18.3.4)(react@18.3.1) + '@theme-ui/color-modes': 0.16.2(@emotion/react@11.13.3(@types/react@18.3.4)(react@18.3.1))(react@18.3.1) + '@theme-ui/components': 0.16.2(@emotion/react@11.13.3(@types/react@18.3.4)(react@18.3.1))(@theme-ui/theme-provider@0.16.2(@emotion/react@11.13.3(@types/react@18.3.4)(react@18.3.1))(react@18.3.1))(react@18.3.1) + '@theme-ui/core': 0.16.2(@emotion/react@11.13.3(@types/react@18.3.4)(react@18.3.1))(react@18.3.1) + '@theme-ui/css': 0.16.2(@emotion/react@11.13.3(@types/react@18.3.4)(react@18.3.1)) + '@theme-ui/global': 0.16.2(@emotion/react@11.13.3(@types/react@18.3.4)(react@18.3.1))(react@18.3.1) + '@theme-ui/theme-provider': 0.16.2(@emotion/react@11.13.3(@types/react@18.3.4)(react@18.3.1))(react@18.3.1) react: 18.3.1 theming@3.3.0(react@18.3.1): @@ -24181,11 +25026,15 @@ snapshots: through2@2.0.5: dependencies: - readable-stream: 2.3.7 + readable-stream: 2.3.8 xtend: 4.0.2 through@2.3.8: {} + timers-browserify@2.0.12: + dependencies: + setimmediate: 1.0.5 + tiny-invariant@1.3.3: {} tiny-warning@1.0.3: {} @@ -24248,7 +25097,7 @@ snapshots: trim-newlines@4.0.2: {} - trough@1.0.5: {} + trough@2.2.0: {} ts-api-utils@1.3.0(typescript@5.5.4): dependencies: @@ -24286,10 +25135,12 @@ snapshots: optionalDependencies: fsevents: 2.3.3 + tty-browserify@0.0.1: {} + tuf-js@2.2.1: dependencies: '@tufjs/models': 2.0.1 - debug: 4.3.5(supports-color@8.1.1) + debug: 4.3.6(supports-color@8.1.1) make-fetch-happen: 13.0.1 transitivePeerDependencies: - supports-color @@ -24381,7 +25232,7 @@ snapshots: has-symbols: 1.0.3 which-boxed-primitive: 1.0.2 - undici-types@5.26.5: {} + undici-types@6.19.8: {} unicode-canonical-property-names-ecmascript@2.0.0: {} @@ -24396,15 +25247,15 @@ snapshots: unicorn-magic@0.1.0: {} - unified@9.2.2: + unified@11.0.5: dependencies: - '@types/unist': 2.0.6 - bail: 1.0.5 + '@types/unist': 3.0.2 + bail: 2.0.2 + devlop: 1.1.0 extend: 3.0.2 - is-buffer: 2.0.5 - is-plain-obj: 2.1.0 - trough: 1.0.5 - vfile: 4.2.1 + is-plain-obj: 4.1.0 + trough: 2.2.0 + vfile: 6.0.3 unique-filename@3.0.0: dependencies: @@ -24414,22 +25265,24 @@ snapshots: dependencies: imurmurhash: 0.1.4 - unist-util-is@4.1.0: {} + unist-util-is@6.0.0: + dependencies: + '@types/unist': 3.0.2 - unist-util-stringify-position@2.0.3: + unist-util-stringify-position@4.0.0: dependencies: - '@types/unist': 2.0.6 + '@types/unist': 3.0.2 - unist-util-visit-parents@3.1.1: + unist-util-visit-parents@6.0.1: dependencies: - '@types/unist': 2.0.6 - unist-util-is: 4.1.0 + '@types/unist': 3.0.2 + unist-util-is: 6.0.0 - unist-util-visit@2.0.3: + unist-util-visit@5.0.0: dependencies: - '@types/unist': 2.0.6 - unist-util-is: 4.1.0 - unist-util-visit-parents: 3.1.1 + '@types/unist': 3.0.2 + unist-util-is: 6.0.0 + unist-util-visit-parents: 6.0.1 universal-user-agent@6.0.0: {} @@ -24460,7 +25313,7 @@ snapshots: fstream: 1.0.12 graceful-fs: 4.2.11 listenercount: 1.0.1 - readable-stream: 2.3.7 + readable-stream: 2.3.8 setimmediate: 1.0.5 upath@2.0.1: {} @@ -24492,6 +25345,11 @@ snapshots: punycode: 1.3.2 querystring: 0.2.0 + url@0.11.4: + dependencies: + punycode: 1.4.1 + qs: 6.13.0 + urlpattern-polyfill@8.0.2: {} use-count-up@3.0.1(react@18.3.1): @@ -24548,25 +25406,23 @@ snapshots: vary@1.1.2: {} - vfile-message@2.0.4: + vfile-message@4.0.2: dependencies: - '@types/unist': 2.0.6 - unist-util-stringify-position: 2.0.3 + '@types/unist': 3.0.2 + unist-util-stringify-position: 4.0.0 - vfile@4.2.1: + vfile@6.0.3: dependencies: - '@types/unist': 2.0.6 - is-buffer: 2.0.5 - unist-util-stringify-position: 2.0.3 - vfile-message: 2.0.4 + '@types/unist': 3.0.2 + vfile-message: 4.0.2 - vite-node@2.0.5(@types/node@18.19.44)(terser@5.29.2): + vite-node@2.0.5(@types/node@20.16.5)(terser@5.29.2): dependencies: cac: 6.7.14 - debug: 4.3.5(supports-color@8.1.1) + debug: 4.3.6(supports-color@8.1.1) pathe: 1.1.2 tinyrainbow: 1.2.0 - vite: 5.4.1(@types/node@18.19.44)(terser@5.29.2) + vite: 5.4.2(@types/node@20.16.5)(terser@5.29.2) transitivePeerDependencies: - '@types/node' - less @@ -24578,32 +25434,40 @@ snapshots: - supports-color - terser - vite-plugin-pages@0.32.3(vite@5.4.1(@types/node@18.19.44)(terser@5.29.2)): + vite-plugin-node-polyfills@0.22.0(rollup@4.21.1)(vite@5.4.2(@types/node@20.16.5)(terser@5.29.2)): + dependencies: + '@rollup/plugin-inject': 5.0.5(rollup@4.21.1) + node-stdlib-browser: 1.2.0 + vite: 5.4.2(@types/node@20.16.5)(terser@5.29.2) + transitivePeerDependencies: + - rollup + + vite-plugin-pages@0.32.3(vite@5.4.2(@types/node@20.16.5)(terser@5.29.2)): dependencies: '@types/debug': 4.1.12 - debug: 4.3.5(supports-color@8.1.1) + debug: 4.3.6(supports-color@8.1.1) dequal: 2.0.3 extract-comments: 1.1.0 fast-glob: 3.3.2 json5: 2.2.3 local-pkg: 0.5.0 picocolors: 1.0.1 - vite: 5.4.1(@types/node@18.19.44)(terser@5.29.2) - yaml: 2.4.5 + vite: 5.4.2(@types/node@20.16.5)(terser@5.29.2) + yaml: 2.5.0 transitivePeerDependencies: - supports-color - vite@5.4.1(@types/node@18.19.44)(terser@5.29.2): + vite@5.4.2(@types/node@20.16.5)(terser@5.29.2): dependencies: esbuild: 0.21.5 - postcss: 8.4.41 - rollup: 4.13.0 + postcss: 8.4.45 + rollup: 4.21.1 optionalDependencies: - '@types/node': 18.19.44 + '@types/node': 20.16.5 fsevents: 2.3.3 terser: 5.29.2 - vitest@2.0.5(@types/node@18.19.44)(happy-dom@12.10.3)(jsdom@24.0.0)(terser@5.29.2): + vitest@2.0.5(@types/node@20.16.5)(happy-dom@12.10.3)(jsdom@24.0.0)(terser@5.29.2): dependencies: '@ampproject/remapping': 2.3.0 '@vitest/expect': 2.0.5 @@ -24613,7 +25477,7 @@ snapshots: '@vitest/spy': 2.0.5 '@vitest/utils': 2.0.5 chai: 5.1.1 - debug: 4.3.5(supports-color@8.1.1) + debug: 4.3.6(supports-color@8.1.1) execa: 8.0.1 magic-string: 0.30.10 pathe: 1.1.2 @@ -24621,11 +25485,11 @@ snapshots: tinybench: 2.8.0 tinypool: 1.0.0 tinyrainbow: 1.2.0 - vite: 5.4.1(@types/node@18.19.44)(terser@5.29.2) - vite-node: 2.0.5(@types/node@18.19.44)(terser@5.29.2) + vite: 5.4.2(@types/node@20.16.5)(terser@5.29.2) + vite-node: 2.0.5(@types/node@20.16.5)(terser@5.29.2) why-is-node-running: 2.3.0 optionalDependencies: - '@types/node': 18.19.44 + '@types/node': 20.16.5 happy-dom: 12.10.3 jsdom: 24.0.0 transitivePeerDependencies: @@ -24640,6 +25504,8 @@ snapshots: vlq@1.0.1: {} + vm-browserify@1.1.2: {} + void-elements@2.0.1: {} w3c-xmlserializer@5.0.0: @@ -24986,11 +25852,11 @@ snapshots: dependencies: fast-json-patch: 3.1.1 oppa: 0.4.0 - yaml: 2.4.5 + yaml: 2.5.0 yaml@1.10.2: {} - yaml@2.4.5: {} + yaml@2.5.0: {} yargs-parser@18.1.3: dependencies: @@ -25072,4 +25938,4 @@ snapshots: optionalDependencies: react: 18.3.1 - zwitch@1.0.5: {} + zwitch@2.0.4: {} diff --git a/pnpm-workspace.yaml b/pnpm-workspace.yaml index b02f0b0d8d9901..31fe8d0485f8a6 100644 --- a/pnpm-workspace.yaml +++ b/pnpm-workspace.yaml @@ -6,3 +6,4 @@ packages: - 'docs' - 'test' - 'apps/*' + - 'scripts/sizeSnapshot' diff --git a/renovate.json b/renovate.json index 135a1e14e602b4..4f9521026430c0 100644 --- a/renovate.json +++ b/renovate.json @@ -77,7 +77,7 @@ { "groupName": "@types/node", "matchPackageNames": ["@types/node"], - "allowedVersions": "< 19.0.0" + "allowedVersions": "< 21.0.0" }, { "groupName": "bundling fixtures", diff --git a/scripts/build.mjs b/scripts/build.mjs index 47c7b66ab13378..27054ee0ac17fe 100644 --- a/scripts/build.mjs +++ b/scripts/build.mjs @@ -3,6 +3,7 @@ import glob from 'fast-glob'; import path from 'path'; import { promisify } from 'util'; import yargs from 'yargs'; +import * as fs from 'fs/promises'; import { getVersionEnvVariables, getWorkspaceRoot } from './utils.mjs'; const exec = promisify(childProcess.exec); @@ -25,10 +26,21 @@ async function run(argv) { ); } + const packageJsonPath = path.resolve('./package.json'); + const packageJson = JSON.parse(await fs.readFile(packageJsonPath, { encoding: 'utf8' })); + + const babelRuntimeVersion = packageJson.dependencies['@babel/runtime']; + if (!babelRuntimeVersion) { + throw new Error( + 'package.json needs to have a dependency on `@babel/runtime` when building with `@babel/plugin-transform-runtime`.', + ); + } + const env = { NODE_ENV: 'production', BABEL_ENV: bundle, MUI_BUILD_VERBOSE: verbose, + MUI_BABEL_RUNTIME_VERSION: babelRuntimeVersion, ...(await getVersionEnvVariables()), }; diff --git a/scripts/pushArgos.mjs b/scripts/pushArgos.mjs index b9a43853f6da25..0c15df855f404e 100644 --- a/scripts/pushArgos.mjs +++ b/scripts/pushArgos.mjs @@ -5,11 +5,14 @@ import lodashChunk from 'lodash/chunk.js'; import { upload } from '@argos-ci/core'; const screenshotsBase = 'test/regressions/screenshots/chrome'; +const screenshotsPigmentCSSBase = 'screenshots/chrome'; const screenshotsTmp = 'test/regressions/screenshots/argos'; const BATCH_SIZE = 200; async function run() { - const screenshots = await glob(`${screenshotsBase}/**/*`); + const emotionScreenshots = await glob(`${screenshotsBase}/**/*`); + const pigmentCSSScnreeshots = await glob(`${screenshotsPigmentCSSBase}/**/*`); + const screenshots = [...emotionScreenshots, ...pigmentCSSScnreeshots]; const chunks = lodashChunk(screenshots, BATCH_SIZE); await Promise.all( @@ -18,7 +21,7 @@ async function run() { chunk.map((screenshot) => { return fse.move( screenshot, - `${screenshotsTmp}/${chunkIndex}/${screenshot.replace(screenshotsBase, '')}`, + `${screenshotsTmp}/${chunkIndex}/${screenshot.replace(screenshotsBase, '').replace(screenshotsPigmentCSSBase, '')}`, ); }), ), diff --git a/scripts/releaseChangelog.mjs b/scripts/releaseChangelog.mjs index fe8be8dac86a76..edc1655b5fc5b5 100644 --- a/scripts/releaseChangelog.mjs +++ b/scripts/releaseChangelog.mjs @@ -206,7 +206,7 @@ yargs(process.argv.slice(2)) }) .option('release', { // #default-branch-switch - default: 'next', + default: 'master', describe: 'Ref which we want to release', type: 'string', }) diff --git a/scripts/sizeSnapshot/package.json b/scripts/sizeSnapshot/package.json new file mode 100644 index 00000000000000..5d7d392be33122 --- /dev/null +++ b/scripts/sizeSnapshot/package.json @@ -0,0 +1,15 @@ +{ + "name": "size-snapshot", + "version": "1.0.0", + "description": "Size snapshot of MUI packages", + "dependencies": { + "@mui/lab": "workspace:^", + "@mui/base": "workspace:^", + "@mui/joy": "workspace:^", + "@mui/material": "workspace:^", + "@mui/styles": "workspace:^", + "@mui/private-theming": "workspace:^", + "@mui/utils": "workspace:^", + "@mui/system": "workspace:^" + } +} diff --git a/scripts/sizeSnapshot/webpack.config.js b/scripts/sizeSnapshot/webpack.config.js index dd4c5b5b6383de..f447355857520b 100644 --- a/scripts/sizeSnapshot/webpack.config.js +++ b/scripts/sizeSnapshot/webpack.config.js @@ -21,13 +21,13 @@ async function getWebpackEntries() { return { id: entryName, - path: path.relative(workspaceRoot, path.dirname(componentPath)), + import: `@mui/material/${componentName}`, }; }, ); const corePackagePath = path.join(workspaceRoot, 'packages/mui-base/build'); - const coreComponents = (await glob(path.join(corePackagePath, '([A-Z])*/index.js'))).map( + const baseComponents = (await glob(path.join(corePackagePath, '([A-Z])*/index.js'))).map( (componentPath) => { const componentName = path.basename(path.dirname(componentPath)); let entryName = componentName; @@ -38,7 +38,7 @@ async function getWebpackEntries() { return { id: entryName, - path: path.relative(workspaceRoot, path.dirname(componentPath)), + import: `@mui/base/${componentName}`, }; }, ); @@ -50,7 +50,7 @@ async function getWebpackEntries() { return { id: componentName, - path: path.relative(workspaceRoot, path.dirname(componentPath)), + import: `@mui/lab/${componentName}`, }; }, ); @@ -62,7 +62,7 @@ async function getWebpackEntries() { return { id: `@mui/joy/${componentName}`, - path: path.relative(workspaceRoot, path.dirname(componentPath)), + import: `@mui/joy/${componentName}`, }; }, ); @@ -72,62 +72,63 @@ async function getWebpackEntries() { // WARNING: Changing the name will break tracking of bundle size over time // If the name of the package changes, rename its display name in https://github.com/eps1lon/mui-contributor-dashboard/blob/main/src/pages/SizeComparison.tsx id: '@material-ui/core', - path: path.join(path.relative(workspaceRoot, materialPackagePath), 'index.js'), + import: '@mui/material', }, ...materialComponents, { id: '@material-ui/lab', - path: path.join(path.relative(workspaceRoot, labPackagePath), 'index.js'), + import: '@mui/lab', }, ...labComponents, { id: '@material-ui/styles', - path: 'packages/mui-styles/build/index.js', + import: '@mui/styles', }, { id: '@material-ui/private-theming', - path: 'packages/mui-private-theming/build/index.js', + import: '@mui/private-theming', }, { id: '@material-ui/system', - path: 'packages/mui-system/build/index.js', + import: '@mui/system', }, { id: 'createBox', - path: 'packages/mui-system/build/createBox/index.js', + import: '@mui/system/createBox', }, { id: 'createStyled', - path: 'packages/mui-system/build/createStyled/index.js', + import: '@mui/system/createStyled', }, { id: '@material-ui/core/styles/createTheme', - path: 'packages/mui-material/build/styles/createTheme.js', + importName: 'createTheme', + import: '@mui/material/styles', }, { id: 'colorManipulator', - path: 'packages/mui-system/build/colorManipulator/index.js', + import: '@mui/system/colorManipulator', }, { id: 'useAutocomplete', - path: 'packages/mui-lab/build/useAutocomplete/index.js', + import: '@mui/lab/useAutocomplete', }, { id: '@material-ui/core/useMediaQuery', - path: 'packages/mui-material/build/useMediaQuery/index.js', + import: '@mui/material/useMediaQuery', }, { id: '@material-ui/core/useScrollTrigger', - path: 'packages/mui-material/build/useScrollTrigger/index.js', + import: '@mui/material/useScrollTrigger', }, { id: '@material-ui/unstyled', - path: path.join(path.relative(workspaceRoot, corePackagePath), 'index.js'), + import: '@mui/base', }, - ...coreComponents, + ...baseComponents, { id: '@material-ui/utils', - path: 'packages/mui-utils/build/esm/index.js', + import: '@mui/utils', }, // TODO: Requires webpack v5 // Resolution of webpack/acorn to 7.x is blocked by nextjs (https://github.com/vercel/next.js/issues/11947) @@ -138,7 +139,7 @@ async function getWebpackEntries() { // }, { id: '@mui/joy', - path: path.join(path.relative(workspaceRoot, joyPackagePath), 'index.js'), + import: '@mui/joy', }, ...joyComponents, ]; @@ -148,6 +149,8 @@ function createWebpackConfig(entry, environment) { const analyzerMode = environment.analyze ? 'static' : 'disabled'; const concatenateModules = !environment.accurateBundles; + const importNames = entry.importName ? `{ ${entry.importName} as foo }` : '* as foo'; + /** * @type {import('webpack').Configuration} */ @@ -160,7 +163,7 @@ function createWebpackConfig(entry, environment) { concatenateModules, minimizer: [ new TerserPlugin({ - test: /\.js(\?.*)?$/i, + test: /\.m?js(\?.*)?$/i, }), ], }, @@ -174,6 +177,11 @@ function createWebpackConfig(entry, environment) { }, path: path.join(__dirname, 'build'), }, + resolve: { + alias: { + '@mui/utils': '@mui/utils/esm', + }, + }, plugins: [ new CompressionPlugin(), new BundleAnalyzerPlugin({ @@ -186,7 +194,14 @@ function createWebpackConfig(entry, environment) { reportFilename: `${entry.id}.html`, }), ], - entry: { [entry.id]: path.join(workspaceRoot, entry.path) }, + // A context to the current dir, which has a node_modules folder with workspace dependencies + context: __dirname, + entry: { + // This format is a data: url combined with inline matchResource to obtain a virtual entry. + // See https://github.com/webpack/webpack/issues/6437#issuecomment-874466638 + // See https://webpack.js.org/api/loaders/#inline-matchresource + [entry.id]: `./index.js!=!data:text/javascript,import ${importNames} from '${entry.import}';console.log(foo);`, + }, // TODO: 'browserslist:modern' // See https://github.com/webpack/webpack/issues/14203 target: 'web', diff --git a/test/README.md b/test/README.md index 59c4dc4acac989..d69686d7776e29 100644 --- a/test/README.md +++ b/test/README.md @@ -202,6 +202,9 @@ You can view the screenshots in `test/regressions/screenshots/chrome`. Alternatively, you might want to open `http://localhost:5001` (while `pnpm test:regressions:dev` is running) to view individual views separately. +For testing the components using Pigment CSS, you can run `pnpm test:regressions-pigment-css:dev`. +You can then open `http://localhost:5001/fixtures` to vide individual views separately. + ### Caveats #### Accessibility tree exclusion diff --git a/test/package.json b/test/package.json index ebbd95ab5dd5f9..acececc5e168bf 100644 --- a/test/package.json +++ b/test/package.json @@ -8,7 +8,7 @@ "devDependencies": { "@babel/runtime": "^7.25.0", "@emotion/cache": "^11.13.1", - "@emotion/react": "^11.13.0", + "@emotion/react": "^11.13.3", "@mui/base": "workspace:*", "@mui/icons-material": "workspace:^", "@mui/internal-test-utils": "workspace:^", @@ -19,8 +19,8 @@ "@mui/utils": "workspace:^", "@playwright/test": "1.46.1", "@testing-library/dom": "^10.4.0", - "@types/chai": "^4.3.17", - "@types/react": "^18.3.3", + "@types/chai": "^4.3.19", + "@types/react": "^18.3.4", "@types/react-is": "^18.3.0", "@types/sinon": "^17.0.3", "chai": "^4.5.0", @@ -35,7 +35,7 @@ "react-dom": "^18.3.1", "react-is": "^18.3.1", "react-router-dom": "^6.26.1", - "sinon": "^16.1.3", + "sinon": "^18.0.0", "styled-components": "^6.1.12", "stylis": "4.2.0", "stylis-plugin-rtl": "^2.1.1", diff --git a/test/regressions/fixtures/Radio/RadioDisabledState.js b/test/regressions/fixtures/Radio/RadioDisabledState.js new file mode 100644 index 00000000000000..617d4181f6117c --- /dev/null +++ b/test/regressions/fixtures/Radio/RadioDisabledState.js @@ -0,0 +1,31 @@ +import * as React from 'react'; +import Radio from '@mui/material/Radio'; + +export default function RadioButtonsDisabled() { + const [selectedValue, setSelectedValue] = React.useState('a'); + + const handleChange = (event) => { + setSelectedValue(event.target.value); + }; + + return ( + <div> + <Radio + disabled + checked={selectedValue === 'a'} + onChange={handleChange} + value="a" + name="radio-buttons" + inputProps={{ 'aria-label': 'A' }} + /> + <Radio + disabled + checked={selectedValue === 'b'} + onChange={handleChange} + value="b" + name="radio-buttons" + inputProps={{ 'aria-label': 'B' }} + /> + </div> + ); +} diff --git a/test/regressions/index.js b/test/regressions/index.js index 4efc6787e92df1..ca3503301cb61f 100644 --- a/test/regressions/index.js +++ b/test/regressions/index.js @@ -33,14 +33,16 @@ importRegressionFixtures.keys().forEach((path) => { }, []); const blacklist = [ - // Blog Components + // Excludes demos that we don't want + /^docs-(.*)(?<=NoSnap)\.png$/, + // Blog template components and theme customizations 'docs-getting-started-templates-blog/Blog.png', + 'docs-getting-started-templates-blog/TemplateFrame.png', 'docs-getting-started-templates-blog-components/AppAppbar.png', 'docs-getting-started-templates-blog-components/Footer.png', 'docs-getting-started-templates-blog-components/Latest.png', 'docs-getting-started-templates-blog-components/SitemarkIcon.png', 'docs-getting-started-templates-blog-components/ToggleColorMode.png', - // Blog Theme Customizations 'docs-getting-started-templates-blog-theme-customizations/buttons.png', 'docs-getting-started-templates-blog-theme-customizations/index.png', 'docs-getting-started-templates-blog-theme-customizations/inputs.png', @@ -49,6 +51,7 @@ const blacklist = [ 'docs-getting-started-templates-blog-theme-customizations/others.png', // Dashboard template components and theme customizations 'docs-getting-started-templates-dashboard/Dashboard.png', + 'docs-getting-started-templates-dashboard/TemplateFrame.png', 'docs-getting-started-templates-dashboard-components/ChartUserByCountry.png', 'docs-getting-started-templates-dashboard-components/CustomDatePicker.png', 'docs-getting-started-templates-dashboard-components/CustomizedDataGrid.png', @@ -77,18 +80,23 @@ const blacklist = [ 'docs-getting-started-templates-dashboard-theme-customizations/treeView.png', 'docs-getting-started-templates-dashboard-internals-components/CustomIcons.png', // Sign-In/Sign-Up Theme Customizations + 'docs-getting-started-templates-sign-in-side/TemplateFrame.png', 'docs-getting-started-templates-sign-in-side-theme-customizations/index.png', 'docs-getting-started-templates-sign-in-side/CustomIcons.png', + 'docs-getting-started-templates-sign-in/TemplateFrame.png', 'docs-getting-started-templates-sign-in-theme-customizations/index.png', 'docs-getting-started-templates-sign-in/CustomIcons.png', + 'docs-getting-started-templates-sign-up/TemplateFrame.png', 'docs-getting-started-templates-sign-up-theme-customizations/index.png', 'docs-getting-started-templates-sign-in-side/getSignInSideTheme.png', 'docs-getting-started-templates-sign-up/CustomIcons.png', 'docs-getting-started-templates-sign-up/getSignUpTheme.png', // Checkout Theme Customizations + 'docs-getting-started-templates-checkout/TemplateFrame.png', 'docs-getting-started-templates-checkout-theme-customizations/index.png', 'docs-getting-started-templates-checkout/getCheckoutTheme.png', // Marketing Page Theme Customizations + 'docs-getting-started-templates-marketing-page/TemplateFrame.png', 'docs-getting-started-templates-marketing-page/getMPTheme.png', 'docs-getting-started-templates-marketing-page/MarketingPage.png', 'docs-getting-started-templates-marketing-page-theme-customizations/index.png', @@ -248,7 +256,7 @@ function excludeDemoFixture(suite, name) { } // assume regex - if (pattern.test(suite)) { + if (pattern.test(`${suite}/${name}.png`)) { unusedBlacklistPatterns.delete(pattern); return true; }