diff --git a/.circleci/config.yml b/.circleci/config.yml
index e61a41aa3fb143..b8be5a472a645c 100644
--- a/.circleci/config.yml
+++ b/.circleci/config.yml
@@ -1,6 +1,6 @@
version: 2.1
orbs:
- aws-cli: circleci/aws-cli@4.0
+ aws-cli: circleci/aws-cli@4.1
aws-s3: circleci/aws-s3@4.0
parameters:
@@ -690,8 +690,8 @@ jobs:
steps:
- aws-cli/setup:
aws_access_key_id: AWS_ACCESS_KEY_ID_ARTIFACTS
- region: AWS_REGION_ARTIFACTS
aws_secret_access_key: AWS_SECRET_ACCESS_KEY_ARTIFACTS
+ region: ${AWS_REGION_ARTIFACTS}
# Upload distributables to S3
- aws-s3/copy:
from: mui-material.tgz
@@ -719,8 +719,8 @@ jobs:
steps:
- aws-cli/setup:
aws_access_key_id: AWS_ACCESS_KEY_ID_ARTIFACTS
- region: AWS_REGION_ARTIFACTS
aws_secret_access_key: AWS_SECRET_ACCESS_KEY_ARTIFACTS
+ region: ${AWS_REGION_ARTIFACTS}
# persist size snapshot on S3
- aws-s3/copy:
arguments: --content-type application/json
diff --git a/.eslintrc.js b/.eslintrc.js
index bdace1247ab77d..3c8f3dccaadd85 100644
--- a/.eslintrc.js
+++ b/.eslintrc.js
@@ -67,13 +67,6 @@ module.exports = {
{
patterns: [
'@mui/*/*/*',
- // Begin block: Packages with files instead of packages in the top level
- // Importing from the top level pulls in CommonJS instead of ES modules
- // Allowing /icons as to reduce cold-start of dev builds significantly.
- // There's nothing to tree-shake when importing from /icons this way:
- // '@mui/icons-material/*/',
- '@mui/utils/*',
- // End block
// Macros are fine since their import path is transpiled away
'!@mui/utils/macros',
'@mui/utils/macros/*',
@@ -218,15 +211,6 @@ module.exports = {
rules: {
// does not work with wildcard imports. Mistakes will throw at runtime anyway
'import/named': 'off',
- 'no-restricted-imports': [
- 'error',
- {
- // Use named import from `test/utils` instead.
- // The other files are private.
- patterns: ['test/utils/*'],
- },
- ],
-
'material-ui/disallow-active-element-as-key-event-target': 'error',
// upgraded level from recommended
@@ -333,7 +317,7 @@ module.exports = {
'error',
{
patterns: [
- // Allow deeper imports for TypeScript types. TODO?
+ // Allow deeper imports for TypeScript types. TODO remove
'@mui/*/*/*/*',
// Macros are fine since they're transpiled into something else
'!@mui/utils/macros/*.macro',
diff --git a/.github/workflows/codeql.yml b/.github/workflows/codeql.yml
index 2443587d91de24..9320aa74bdcd78 100644
--- a/.github/workflows/codeql.yml
+++ b/.github/workflows/codeql.yml
@@ -19,7 +19,7 @@ jobs:
uses: actions/checkout@f43a0e5ff2bd294095638e18286ca9a3d1956744 # v3.6.0
# Initializes the CodeQL tools for scanning.
- name: Initialize CodeQL
- uses: github/codeql-action/init@a09933a12a80f87b87005513f0abb1494c27a716 # v2.21.4
+ uses: github/codeql-action/init@6a28655e3dcb49cb0840ea372fd6d17733edd8a4 # v2.21.8
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@a09933a12a80f87b87005513f0abb1494c27a716 # v2.21.4
+ uses: github/codeql-action/analyze@6a28655e3dcb49cb0840ea372fd6d17733edd8a4 # v2.21.8
diff --git a/.github/workflows/scorecards.yml b/.github/workflows/scorecards.yml
index ea33dbc69af6e3..6b823e1e92cdfe 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@a09933a12a80f87b87005513f0abb1494c27a716 # v2.21.4
+ uses: github/codeql-action/upload-sarif@6a28655e3dcb49cb0840ea372fd6d17733edd8a4 # v2.21.8
with:
sarif_file: results.sarif
diff --git a/.mocharc.js b/.mocharc.js
index 83a5c747ad403f..d57adb8886a831 100644
--- a/.mocharc.js
+++ b/.mocharc.js
@@ -10,7 +10,7 @@ module.exports = {
recursive: true,
timeout: (process.env.CIRCLECI === 'true' ? 5 : 2) * 1000, // Circle CI has low-performance CPUs.
reporter: 'dot',
- require: [require.resolve('./test/utils/setupBabel'), require.resolve('./test/utils/setupJSDOM')],
+ require: ['@mui-internal/test-utils/setupBabel', '@mui-internal/test-utils/setupJSDOM'],
'watch-ignore': [
// default
'.git',
diff --git a/CHANGELOG.md b/CHANGELOG.md
index 7b30ed05a9c9cf..0d5719526e40c5 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -1,5 +1,256 @@
# [Versions](https://mui.com/versions/)
+## 5.14.10
+
+
+
+_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`
+
+- [Chip] Add cursor CSS property reset (#38984) @DiegoAndai
+
+### `@mui/utils@5.14.10`
+
+- [utils] Move @types/prop-types back to dependencies (#39030) @Methuselah96
+
+### `@mui/base@5.0.0-beta.16`
+
+- [NumberInput][base-ui] Warn when changing control mode with `useControlled` (#38757) @sai6855
+- [Select][base-ui] Fix Select button layout shift, add placeholder prop (#38796) @mj12albert
+- [useList][base-ui] Accept arbitrary external props and forward to root (#38848) @mj12albert
+- [Autocomplete][base-ui] Added ref to getInputProps return value (#38919) @DarhkVoyd
+
+### `@mui/joy@5.0.0-beta.7`
+
+- [AccordionGroup][joy-ui] Fix console warning when using custom color (#38950) @sai6855
+- [GlobalStyles][joy-ui] Ensure compatibility with RSC (#38955) @mateuseap
+
+### Docs
+
+- [docs][base] Add Tailwind CSS + plain CSS demo on the NumberInput page (#38928) @alisasanib
+- [docs][Dialog] Add non-modal dialog docs & demo (#38684) @mnajdova
+- [docs] Fix number input wrong demo @oliviertassinari
+- [docs] Exclude joy-ui LinearProgressCountup from visual regression (#38969) @siriwatknp
+- [docs][joy-ui] Revise the Overview page (#38842) @danilo-leal
+- [docs][material-ui][Pagination] Add `TablePagination` to the API components list (#38486) @MonstraG
+
+### Core
+
+- [core] Add more context about useEventCallback @oliviertassinari
+- [core] Allow deeper import of @mui/utils (#38806) @oliviertassinari
+- [core] Remove react-dom from @mui/utils peerDependencies (#38974) @michaldudak
+- [core] Remove react from styled-engine dependencies (#38971) @michaldudak
+- [core] Fix image loading bug on Safari @oliviertassinari
+- [core] Fix bundle size upload to S3 job (#38956) @Janpot
+- [core] Move eslint to peer dependencies of eslint-plugin-material-ui (#39033) @michaldudak
+- [docs-infra] Display markdown lists correctly in docs for props description (#38973) @ZeeshanTamboli
+- [website] Improve lighthouse score (#39011) @oliviertassinari
+- [website] Fix lighthouse issues @oliviertassinari
+- [website] Create the `InfoCard` component (#38987) @danilo-leal
+- [website] Small tweaks for performance @oliviertassinari
+- [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
+
+
+
+_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`
+
+- [ButtonGroup] Determine first, last and middle buttons to support different elements with correct styling (#38520) @ZeeshanTamboli
+- [Modal] Fix console warning when onTransitionEnter , onTransitionExit provided (#38868) @sai6855
+- Revert "[Autocomplete] Type multiple values with readonly arrays." (#38827) @mnajdova
+- [Tabs] Scrollable tabs shouldn't crash when customizing their styles in the theme with slot callbacks (#38544) @brentertz
+- [AlertTitle][BreadCrumbs] Fix inheritance message in docs (#38876) @sai6855
+
+### `@mui/base@5.0.0-beta.15`
+
+- [useSnackbar] Align externalProps handling (#38935) @mj12albert
+- [useInput] Align ExternalProps naming (#38849) @mj12albert
+- [FocusTrap] Refactor & cleanup (#38878) @mnajdova
+- [FocusTrap] Fix `disableEnforceFocus` behavior (#38816) @mnajdova
+- [Switch] Simplify source (#38910) @oliviertassinari
+
+### `@mui/joy@5.0.0-beta.6`
+
+- [Drawer] Add Drawer component (#38169) @mnajdova
+- Reduce height of some variants (#38527) @zanivan
+- Refine the default theme color palette (#38416) @zanivan
+- [Dialog] Add `DialogActions`, `DialogTitle` and `DialogContent` (#38382) @siriwatknp
+- [AccordionGroup] Add missing `variant` and `color` classes (#38814) @sai6855
+
+### `@mui/lab@5.0.0-alpha.144`
+
+- Add TypeScript deprecations (#38833) @oliviertassinari
+- Fix `@mui/x-tree-view` dependency (#38822) @flaviendelangle
+
+### `@mui/system@5.14.9`
+
+- Remove dead code (#38884) @oliviertassinari
+- Remove getInitColorSchemeScript leading spaces (#38794) @oliviertassinari
+
+### `@mui/zero-vite-plugin@0.0.1-alpha.0`
+
+- [vite] Create a package for vite plugin (#38685) @brijeshb42
+
+### Docs
+
+- [docs][base-ui] Improve recommended usage guide (#38570) @oliviertassinari
+- [docs][base-ui] Create hooks contribution guide (#38679) @michaldudak
+- [docs][base-ui] Structure and style revisions for Component docs (#38826) @samuelsycamore
+- [docs][base-ui] Add Number Input to the all components page (#38839) @danilo-leal
+- [docs][base-ui] Mark Popup with the Preview tag (#38851) @michaldudak
+- [blog] Polish component reference name @oliviertassinari
+- [blog] Fix missing card (#38834) @oliviertassinari
+- [Button][docs][material-ui] Update the file upload demo (#38823) @danilo-leal
+- [docs][DialogTitle] Fix props docs doesn't mention it extends `Typography` props (#38856) @sai6855
+- [docs] Improve npm experience (#38906) @oliviertassinari
+- [docs] Fix redirection to Base UI URLs @oliviertassinari
+- [docs] Fix use of callouts (#38747) @oliviertassinari
+- [docs] Fix 301 links for SEO @oliviertassinari
+- [docs] Remove flag from installation page @oliviertassinari
+- [docs] Fix strange break line on mobile in between product name @oliviertassinari
+- [docs] Clearer npm package homepages (#38864) @oliviertassinari
+- [docs] enableColorScheme prop was removed (#38795) @oliviertassinari
+- [docs] Fix a11y issues in tables demos (#38829) @michaldudak
+- [docs][joy-ui] Refine the Messages template (#38807) @zanivan
+- [docs][joy-ui] Fix copy on the Tutorial page (#38907) @danilo-leal
+- [docs][joy-ui] Fix grammar and update Usage section in color inversion page (#38850) @ZeeshanTamboli
+- [docs][joy-ui] Revise the Lists page (#36324) @LadyBluenotes
+- [docs][joy-ui] Refine the Profile Dashboard template (#38599) @zanivan
+- [docs][material-ui] Revise the Paper component docs (#38841) @danilo-leal
+- [docs][material-ui] Revise the Typography page (#38543) @danilo-leal
+- [docs][material-ui] Revise and split up "Styled engine" doc (#37774) @samuelsycamore
+- [TextareaAutosize][docs] Fix component creation in render (#38577) @oliviertassinari
+
+### Examples
+
+- [examples] Add shortcut to open example in online IDE (#38572) @oliviertassinari
+- [examples][base-ui] Add Base UI + Vite + Tailwind CSS example in TypeScript (#37595) @dvkam
+
+### Core
+
+- [core] Remove package declaration from same package dependencies (#38951) @DiegoAndai
+- [core] Remove workspace dependencies from root package.json (#38940) @michaldudak
+- [core] Fix prop-types generation (#38831) @flaviendelangle
+- [core] Move types packages to docs' devDependencies (#38914) @michaldudak
+- [core] Improve DX when browsing the package on npm and GitHub @oliviertassinari
+- [core] TrapFocus was renamed to FocusTrap @oliviertassinari
+- [core] Add types extension for clarity @oliviertassinari
+- [core] Hoist rewriteImportPaths to parent scope @oliviertassinari
+- [core] Bump aws-cli orb to 4.1 (#38857) @Janpot
+- [core] Explicitly define package dependencies (#38859) @michaldudak
+- [core] Fix yarn docs:create-playground script @oliviertassinari
+- [docs-infra] Improve show code button affordance (#38824) @danilo-leal
+- [docs–infra] Fix callout container width (#38880) @oliviertassinari
+- [docs-infra] Catch duplicated trailing splashes in links (#38758) @oliviertassinari
+- [website] add Michel Engelen to the about us page (#38818) @michelengelen
+- [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
+
+
+
+_Sep 5, 2023_
+
+A big thanks to the 25 contributors who made this release possible.
+
+### `@mui/material@5.14.8`
+
+- ImageItemList fix incorrect (below) rendering (#38452) @omriklein
+- [Button] Add demo for file upload (#38786) @anle9650
+- [Slider] Add missing classes for `Slider` `InputLabel` `InputBase` `Radio` (#38401) @sai6855
+- [Select] Merge slotProps.paper with internal Paper props (#38703) @michaldudak
+- [Tabs] Fix `ref` type (#38717) @ZeeshanTamboli
+- [TabScrollButton] Extend ButtonBase types (#38719) @ZeeshanTamboli
+
+### `@mui/base@5.0.0-beta.14`
+
+- [Autocomplete] Type multiple values with readonly arrays. (#38253) @pcorpet
+- [TextField] Fix unstable height of memoized multiline TextField component (#37135) @amal-qb
+
+### `@mui/joy@5.0.0-beta.5`
+
+- [Accordion] Fix incorrect display of classname (#38695) @sai6855
+- [AspectRatio] Correct `ratio` prop description (#38743) @sai6855
+- [Button] Fix disablity of button (#38673) @sai6855
+- [design] Stray design tweaks to components (#38476) @zanivan
+- [Typography] Added position only when Skeleton is a direct child (#38799) @siriwatknp
+
+### `@mui/lab@5.0.0-alpha.143`
+
+- [TreeView] Use Tree View from MUI X in the lab (#38261) @flaviendelangle
+- [LoadingButton] Fix HTML rule button > div forbidden nesting (#38584) @oliviertassinari
+
+### `@mui/system@5.14.8`
+
+- [system] Fix the inconsistent types of the `mergeBreakpointsInOrder` function (#38749) @imevanc
+- [system] Fix maxWidth incorrectly resolving breakpoints with non-pixel units (#38633) @mj12albert
+- [typescript] Introduce \*OwnProps interfaces for components (#36798) @szalonna
+
+### Docs
+
+- Update changelog (#38704) @mj12albert
+- [docs][Autocomplete] Require referentially stable value (#38734) @michaldudak
+- [docs][base-ui] Add type parameter to the button in prepareForSlot demo (#38640) @michaldudak
+- [docs][base-ui] Fix the broken image in the Tailwind CSS guide (#38721) @michaldudak
+- [docs][base-ui]: Working With Tailwind Guide - revises example code to avoid import errors (#38693) @christophermorin
+- [docs][base] Add Tailwind CSS + plain CSS demo on the Menu page (#38618) @alisasanib
+- [blog] Clearer blog release title @oliviertassinari
+- [blog] Add a post for the Tree View migration (#38407) @flaviendelangle
+- [docs] Fix broken links to Next.js docs (#38764) @ruflair
+- [docs] Trim trailing whitespace (#38793) @oliviertassinari
+- [docs] Fix a typo in lab-tree-view-to-mui-x.md @mbrookes
+- [docs] Clean up not used Usage files (#38715) @danilo-leal
+- [docs] Improve theme builder exceptions (#38709) @jyash97
+- [docs] Polish Slider demos (#38759) @oliviertassinari
+- [docs] Fix Joy UI docs link regression (#38761) @oliviertassinari
+- [docs] Fix typo @oliviertassinari
+- [docs] Fix e.g. typo (#38748) @oliviertassinari
+- [docs] Fix Next.js pages router example redirect link (#38750) @sai6855
+- [docs] Fix SEO issue broken links @oliviertassinari
+- [docs] Improve SSR example reference (#38651) @oliviertassinari
+- [docs][joy-ui] Integrate a count-up feature to the Linear Progress (#38738) @anon-phantom
+- [docs][joy-ui] Fix Link's `overlay` prop demo (#38702) @danilo-leal
+- [docs][joy-ui] Polish the Stack page (#38623) @danilo-leal
+- [docs][material-ui] Adjust simple Slide demo (#38646) @rajgop1
+
+### Core
+
+- [core] Re-add nx and setup build caching (#38752) @brijeshb42
+- [core] Remove dead code seoTitle @oliviertassinari
+- [core] Use immutable refs (#38762) @oliviertassinari
+- [core] Rework `typescript-to-proptypes` to share the AST parsing with `parseStyles` (#38517) @flaviendelangle
+- [core] Fix CI @oliviertassinari
+- [core] Remove unnecessary `@types/webpack` package (#38720) @ZeeshanTamboli
+- [core] Remove duplicate prop @oliviertassinari
+
+- [docs-infra] Fix mobile display in CodeSandbox (#38767) @oliviertassinari
+- [docs-infra] Remove legacy GA (#37579) @alexfauquette
+- [docs-infra] Fix emotion :first-child console log (#38690) @oliviertassinari
+- [docs-infra] Fix leaking callout content (#38712) @danilo-leal
+- [docs-infra] Remove emoji from callouts (#38694) @danilo-leal
+
+- [website] Fix out of date discount value @oliviertassinari
+- [website] Fix out-of-date label on Toolpad (#38744) @bharatkashyap
+- [website] Fine-tune branding buttons box shadows (#38731) @danilo-leal
+- [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
@@ -579,7 +830,7 @@ _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 [NextJS App Router](https://nextjs.org/docs/app) (#37656) @mj12albert
+- 💫 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/)
@@ -1380,7 +1631,7 @@ _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/styled-engine/#theme-scoping) for using multiple design systems (#36664) @siriwatknp
+- 💫 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`
@@ -1868,7 +2119,7 @@ A big thanks to the 15 contributors who made this release possible. Here are som
- [docs][joy] List slots in API documentation (#36271) @hbjORbj
- [docs][joy] Build API documentations (#36008) @hbjORbj
- [examples] Update Next.js examples to use built-in font (#36315) @Juneezee
-- [examples] Update curl link in `material-next-ts-v4-v5-migration` example README (#36321) @ZeeshanTamboli
+- [examples] Update curl link in `material-ui-nextjs-ts-v4-v5-migration` example README (#36321) @ZeeshanTamboli
- [examples] Convert Next.js \_document class components to function components (#36109) @ossan-engineer
### Core
@@ -3126,7 +3377,7 @@ A big thanks to the 7 contributors who made this release possible. Here are some
### `@mui/base@5.0.0-alpha.101`
-- [TrapFocus] Restore the previously exported type from @mui/material (#34601) @michaldudak
+- [FocusTrap] Restore the previously exported type from @mui/material (#34601) @michaldudak
### `@mui/joy@5.0.0-alpha.49`
@@ -3242,7 +3493,7 @@ A big thanks to the 21 contributors who made this release possible. Here are som
#### Breaking changes
-- [TrapFocus] Rename TrapFocus to FocusTrap (#34216) @kabernardes
+- [FocusTrap] Rename TrapFocus to FocusTrap (#34216) @kabernardes
```diff
-import TrapFocus from '@mui/base/TrapFocus';
@@ -3484,7 +3735,7 @@ A big thanks to the 16 contributors who made this release possible. Here are som
- [Button][base] Prevent too many ref updates (#33882) @michaldudak
- [Select][base] Fix typo in listbox blur event handler (#34120) @ZeeshanTamboli
-- [TrapFocus] Improve tab test and simplify demo (#34008) @EthanStandel
+- [FocusTrap] Improve tab test and simplify demo (#34008) @EthanStandel
### `@mui/joy@5.0.0-alpha.43`
@@ -3590,7 +3841,7 @@ A big thanks to the 18 contributors who made this release possible. This release
### `@mui/base@5.0.0-alpha.93`
-- [TrapFocus] Removes invisible tabbable elements from (#33543) @EthanStandel
+- [FocusTrap] Removes invisible tabbable elements from (#33543) @EthanStandel
- [Input][base] Pass the rows prop to the underlying textarea (#33873) @michaldudak
- [SelectUnstyled] Add ability to post the select's value when submitting a form (#33697) @michaldudak
@@ -4935,7 +5186,7 @@ A big thanks to the 17 contributors who made this release possible. Here are som
);
```
-- [TrapFocus] Move docs to Base and drop the Unstyled prefix (#31954) @michaldudak
+- [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).
@@ -7902,7 +8153,7 @@ A big thanks to the 11 contributors who made this release possible. Here are som
### `@material-ui/unstyled@5.0.0-alpha.37`
- [Slider] Improve TS definition (#26642) @mnajdova
-- [TrapFocus] Capture nodeToRestore via relatedTarget (#26696) @eps1lon
+- [FocusTrap] Capture nodeToRestore via relatedTarget (#26696) @eps1lon
### `@material-ui/icons@5.0.0-alpha.37`
@@ -8972,7 +9223,7 @@ A big thanks to the 19 contributors who made this release possible. Here are som
- [Timeline] Migrate TimelineContent to emotion (#25781) @siriwatknp
- [Timeline] Migrate TimelineItem to emotion (#25822) @vicasas
- [Timeline] Migrate TimelineOppositeContent to emotion (#25816) @vicasas
-- [TrapFocus] Make isEnabled and getDoc optional (#25784) @m4theushw
+- [FocusTrap] Make isEnabled and getDoc optional (#25784) @m4theushw
### `@material-ui/styled-engine@5.0.0-alpha.31`
@@ -9454,7 +9705,7 @@ A big thanks to the 26 contributors who made this release possible. Here are som
### `@material-ui/unstyled@5.0.0-alpha.26`
- [Portal] Migrate to unstyled (#24890) @povilass
-- [TrapFocus] Migrate to unstyled (#24957) @povilass
+- [FocusTrap] Migrate to unstyled (#24957) @povilass
- [Backdrop] Migrate to unstyled (#24985) @povilass
- [Modal] Migrate to emotion + unstyled (#24857) @povilass
@@ -10051,7 +10302,7 @@ A big thanks to the 14 contributors who made this release possible. Here are som
- [ButtonBase] Migrate styles to emotion (#24100) @mnajdova
- [Button] Migrate styles to emotion (#24107) @mnajdova
- [unstyled] Add utils for generating utility classes (#24126) @mnajdova
-- [TrapFocus] Fix trap to only focus on tabbable elements (#23364) @gregnb
+- [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
@@ -11984,9 +12235,9 @@ Here are some highlights ✨:
- [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
-- [TrapFocus] Entangle effects (#22155) @eps1lon
-- [TrapFocus] Fix compatibility issues with React 17 (#22270) @eps1lon
-- [TrapFocus] Prevent possible crash in React 17 (#22262) @eps1lon
+- [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`
@@ -12071,7 +12322,7 @@ Here are some highlights ✨:
More details in [the documentation](https://mui.com/material-ui/customization/components/#adding-new-component-variants) and [RFC](#21749).
-- 👮 Add documentation for the [TrapFocus](https://mui.com/components/trap-focus/) component (#22062) @oliviertassinari.
+- 👮 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.
@@ -12248,7 +12499,7 @@ Here are some highlights ✨:
- [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
-- [TrapFocus] Add documentation (#22062) @oliviertassinari
+- [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
@@ -12444,7 +12695,7 @@ A big thanks to the 14 contributors who made this release possible.
- [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
-- [TrapFocus] Fix disableAutoFocus prop (#21612) @oliviertassinari
+- [FocusTrap] Fix disableAutoFocus prop (#21612) @oliviertassinari
### `@material-ui/lab@v5.0.0-alpha.3`
@@ -12519,7 +12770,7 @@ A big thanks to the 16 contributors who made this release possible.
- [MenuItem] Add types for ListItemClasses (#21654) @eps1lon
- [Slider] Fix cannot read property 'focus' of null (#21653) @mageprincess
- [TextField] Fix CSS isolation issue (#21665) @Codetalker777
-- [TrapFocus] Fix portal support (#21610) @mnajdova
+- [FocusTrap] Fix portal support (#21610) @mnajdova
- [TypeScript] Fix version support (#21640) @jakubfiglak
### `@material-ui/lab@v5.0.0-alpha.2`
diff --git a/CHANGELOG.old.md b/CHANGELOG.old.md
index a0f4ca75ea0322..c4600dfeaa9e10 100644
--- a/CHANGELOG.old.md
+++ b/CHANGELOG.old.md
@@ -279,7 +279,7 @@ A big thanks to the 12 contributors who made this release possible.
- [styles] Add support for TypeScript 4.1 (#23692) @ldrick
- [ClickAwayListener] Fix mounting behavior in Portals in React 17 (#23367) @eps1lon
-- [TrapFocus] Prevent possible crash in React 17 (#22263) @eps1lon
+- [FocusTrap] Prevent possible crash in React 17 (#22263) @eps1lon
- [Tabs] Fix RTL scrollbar with Chrome 85 (#22830) @ankit
### `@material-ui/styles@v4.11.1`
@@ -542,7 +542,7 @@ A big thanks to the 21 contributors who made this release possible.
### Core
-- [TrapFocus] Make an unstable version public (#21201) @dmtrKovalenko
+- [FocusTrap] Make an unstable version public (#21201) @dmtrKovalenko
- [test] Track size of `@material-ui/utils` (#21240) @eps1lon
- [core] Batch small changes (#21156) @oliviertassinari
- [core] Batch small changes (#21249) @oliviertassinari
@@ -729,7 +729,7 @@ Here are some highlights ✨:
- [Tabs] Improve customizability of the scroll buttons (#20783) @netochaves
- [TextField] Fix caret color in autofill dark theme (#20857) @CarsonF
- [Tooltip] Fix disableTouchListener behavior (#20807) @weslenng
-- [unstable_TrapFocus] Guard against dropped memo cache (#20848) @eps1lon
+- [FocusTrap] Guard against dropped memo cache (#20848) @eps1lon
### `@material-ui/styles@v4.9.13`
@@ -1293,7 +1293,7 @@ Here are some highlights ✨:
- [Autocomplete] Fix list of countries (#19862) @FottyM
- [TreeView] Fix conditional nodes support (#19849) @joshwooding
-- [Treeview] Add node selection support (#18357) @joshwooding
+- [TreeView] Add node selection support (#18357) @joshwooding
### Docs
@@ -3443,7 +3443,7 @@ Here are some highlights ✨:
- [Portal] Synchronously call onRendered (#15943) @Arlevoy
- [Radio] Fix dot misalignment in IE11 (#15952) @rupert-ong
- [theme] Return default value for spacing when no args provided (#15891) @mbrookes
-- [TrapFocus] Fix error restoring focus when activeElement is null (#15967) @ryancogswell
+- [FocusTrap] Fix error restoring focus when activeElement is null (#15967) @ryancogswell
- [core] Export useMediaQuery & useScrollTrigger in index.js (#15958) @adeelibr
- [core] Migrate extend ButtonBaseProps typings (#15869) @joshwooding
@@ -3963,7 +3963,7 @@ You will learn more about v4 in the final release blog post and our plans for th
- [core] Use terser for minification in umd bundle (#15491) @eps1lon
- [test] Conform components forward ref to root component (#15425) @eps1lon
- [test] Fix a flaky test (#15445) @oliviertassinari
-- [test] Keep track of the bundle size of TrapFocus (#15453) @oliviertassinari
+- [test] Keep track of the bundle size of FocusTrap (#15453) @oliviertassinari
## 4.0.0-alpha.8
@@ -5571,7 +5571,7 @@ Here are some highlights ✨:
- [Tooltip] Suppress warning if button is disabled and title is empty (#13785) @rfbotto
- [Dialog] Warn if className in PaperProps is set (#13797) @eps1lon
- [TextField] Fix textfield label position when empty (#13791) @Studio384
-- [Popper] Save 7 KB gzipped (for people only using it) (#13804) @oliviertassinari
+- [Popper] Save 7 kB gzipped (for people only using it) (#13804) @oliviertassinari
- [Modal] Handle modal mount interruption (#13778) @amensouissi
- [Select] Make value prop required in TypeScript (#13810) @t49tran
- [Popover] Fix onEntering event propagation (#13821) @ekoeditaa
@@ -5788,7 +5788,7 @@ This new package is a significant step forward. Some of the key features:
- Supports 4 different APIs: hooks, styled-components, higher-order components and render props.
- Allow accessing the component's props from within the style object.
- Replace the usage of the old React APIs with the new ones.
-- 15.0 KB gzipped.
+- 15.0 kB gzipped.
Here is an example: https://codesandbox.io/s/vjzn5z4k77.
@@ -9898,7 +9898,7 @@ Here are some highlights ✨:
- New InputAdornment component (#8504).
- New [Frequently asked questions](https://github.com/mui/material-ui/blob/4df547d56448cedf70977d6e2463b38eaf64d1c7/docs/src/pages/getting-started/frequently-asked-questions.md) documentation section
-- We have saved 1 KB gzip by removing our internal react-transition-group fork (#8785).
+- We have saved 1 kB gzip by removing our internal react-transition-group fork (#8785).
- We have made one step further in order to upgrade all our development dependencies to react@16 (#8804).
### Breaking change
diff --git a/README.md b/README.md
index db9cb91f303e9a..2fea4bc287bde6 100644
--- a/README.md
+++ b/README.md
@@ -1,24 +1,22 @@
-
+
MUI Core
-**MUI Core** contains foundational React UI component libraries for shipping new features faster.
+**MUI Core** contains foundational React UI component libraries for shipping new features faster:
-- [_Material UI_](https://mui.com/material-ui/getting-started/) is a comprehensive library of components that features our implementation of Google's [Material Design](https://m2.material.io/design/introduction/) system.
+- [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 beautifully designed library of React UI components.
+- [Joy UI](https://mui.com/joy-ui/getting-started/) is a library of beautifully designed React UI components built to spark joy.
-- [_Base UI_](https://mui.com/base-ui/getting-started/) is our library of "unstyled" components and low-level hooks. With Base, you gain complete control over your app's CSS and accessibility features.
+- [Base UI](https://mui.com/base-ui/) is a library of unstyled React UI components and hooks. With Base UI, you gain complete control over your app's CSS and accessibility features.
-- [_MUI System_](https://mui.com/system/getting-started/) is a collection of CSS utilities to help you rapidly lay out custom designs.
+- [MUI System](https://mui.com/system/getting-started/) is a collection of CSS utilities to help you rapidly lay out custom designs.
-## Installation
+## Documentation
### Material UI
-Material UI is available as an [npm package](https://www.npmjs.com/package/@mui/material).
-
-**npm:**
-
-```bash
-npm install @mui/material @emotion/react @emotion/styled
-```
-
-**yarn:**
-
-```bash
-yarn add @mui/material @emotion/react @emotion/styled
-```
+Visit [https://mui.com/material-ui/](https://mui.com/material-ui/) to view the full documentation.
Older versions
@@ -63,56 +49,23 @@ yarn add @mui/material @emotion/react @emotion/styled
**Note:** `@next` only points to pre-releases.
Use `@latest` for the latest stable release.
-### Base UI
-
-Base UI is available as an [npm package](https://www.npmjs.com/package/@mui/base).
+### Joy UI
-**npm:**
+Visit [https://mui.com/joy-ui/getting-started/](https://mui.com/joy-ui/getting-started/) to view the full documentation.
-```bash
-npm install @mui/base
-```
+**Note**: Joy UI is still in beta.
+We are adding new components regularly and you're welcome to contribute!
-**yarn:**
+### Base UI
-```bash
-yarn add @mui/base
-```
+Visit [https://mui.com/base-ui/](https://mui.com/base-ui/) to view the full documentation.
**Note**: Base UI is still in beta.
We are adding new components regularly and you're welcome to contribute!
### MUI System
-MUI System is available as an [npm package](https://www.npmjs.com/package/@mui/system).
-
-**npm:**
-
-```bash
-npm install @mui/system @emotion/react @emotion/styled
-```
-
-**yarn:**
-
-```bash
-yarn add @mui/system @emotion/react @emotion/styled
-```
-
-Or if you want to use `styled-components` as a styling engine:
-
-**npm:**
-
-```bash
-npm install @mui/material @mui/styled-engine-sc styled-components
-```
-
-**yarn:**
-
-```bash
-yarn add @mui/material @mui/styled-engine-sc styled-components
-```
-
-Visit our [`styled-engine` guide](https://mui.com/material-ui/guides/styled-engine/) for more information about how to configure `styled-components` as the style engine.
+Visit [https://mui.com/system/](https://mui.com/system/) to view the full documentation.
## Sponsors
@@ -146,42 +99,15 @@ Gold Sponsors are those who have pledged \$500/month or more to MUI.
See the full list of [our backers](https://mui.com/material-ui/discover-more/backers/).
-## Getting started with Material UI
-
-Here is an example of a basic app using Material UI's `Button` component:
-
-```jsx
-import * as React from 'react';
-import Button from '@mui/material/Button';
-
-function App() {
- return ;
-}
-```
-
-In the interactive demo below, try changing the code and see how it affects the output.
-(Hint: change `variant` to `"outlined"` and `color` to `"secondary"`.
-For more options, see the [`Button` component page](https://mui.com/material-ui/react-button/) in our docs.)
-
-[![Edit Button](https://codesandbox.io/static/img/play-codesandbox.svg)](https://codesandbox.io/s/material-ui-u9sy1h)
-
## Questions
-For how-to questions that don't involve making changes to the code base, please use [Stack Overflow](https://stackoverflow.com/questions/tagged/material-ui) instead of GitHub issues.
-Use the "mui" tag on Stack Overflow to make it easier for the community to find your question.
+For how-to questions that don't involve making changes to the code base, please use [Stack Overflow](https://stackoverflow.com/questions/) instead of GitHub issues.
## Examples
-Our documentation features [a collection of example projects using Material UI](https://mui.com/material-ui/getting-started/example-projects/).
-
-## Documentation
-
-- [Material UI](https://mui.com/material-ui/getting-started/)
-- [Joy UI](https://mui.com/joy-ui/getting-started/)
-- [Base UI](https://mui.com/base-ui/getting-started/)
-- [MUI System](https://mui.com/system/getting-started/)
+Our documentation features [a collection of example projects](https://github.com/mui/material-ui/tree/master/examples).
-## Premium themes
+## Premium templates
You can find complete templates and themes in the [MUI Store](https://mui.com/store/?utm_source=docs&utm_medium=referral&utm_campaign=readme-store).
@@ -213,30 +139,42 @@ For details of supported versions and contact details for reporting security iss
These great services sponsor MUI's core infrastructure:
+
[GitHub](https://github.com/) lets us host the Git repository and coordinate contributions.
+
+
+
[Netlify](https://www.netlify.com/) lets us distribute the documentation.
+
+
+
[BrowserStack](https://www.browserstack.com/) lets us test in real browsers.
-
+
+
+
+
[CodeCov](https://about.codecov.io/) lets us monitor test coverage.
+
+
Every Base UI component available so far, sorted alphabetically.
{{"component": "modules/components/BaseUIComponents.js"}}
diff --git a/docs/data/base/components/autocomplete/AutocompleteIntroduction/system/index.js b/docs/data/base/components/autocomplete/AutocompleteIntroduction/system/index.js
index 9aa53294a34be7..47593a14592705 100644
--- a/docs/data/base/components/autocomplete/AutocompleteIntroduction/system/index.js
+++ b/docs/data/base/components/autocomplete/AutocompleteIntroduction/system/index.js
@@ -48,7 +48,6 @@ const Autocomplete = React.forwardRef(function Autocomplete(props, ref) {
>
,
diff --git a/docs/data/base/components/autocomplete/autocomplete.md b/docs/data/base/components/autocomplete/autocomplete.md
index 8fb75b38c29966..d0a0cb5de11e64 100644
--- a/docs/data/base/components/autocomplete/autocomplete.md
+++ b/docs/data/base/components/autocomplete/autocomplete.md
@@ -35,8 +35,6 @@ To learn more about implementing a custom Autocomplete, you can explore the [`us
## Hook
-### Usage
-
```jsx
import { useAutocomplete } from '@mui/base/useAutocomplete';
```
@@ -104,7 +102,7 @@ Learn more about controlled and uncontrolled components in the [React documentat
React Portals can be used to render the listbox outside of the DOM hierarchy, making it easier to allow it to "float" above adjacent elements.
-Base UI provides a [``](/base-ui/react-popper/) component built around React's `createPortal()` for exactly this purpose, and additionally helps you manage keyboard focus as it moves in and out of the portal.
+Base UI provides a [Popper](/base-ui/react-popper/) component built around React's `createPortal()` for exactly this purpose, and additionally helps you manage keyboard focus as it moves in and out of the portal.
To render the listbox in Base UI's Popper, the `ref`s must be merged as follows:
diff --git a/docs/data/base/components/badge/badge.md b/docs/data/base/components/badge/badge.md
index 50e46e3fe349bc..71f557d58fd79c 100644
--- a/docs/data/base/components/badge/badge.md
+++ b/docs/data/base/components/badge/badge.md
@@ -25,32 +25,15 @@ The Badge component creates a badge that is applied to its child element.
## Component
-### Usage
-
-After [installation](/base-ui/getting-started/quickstart/#installation), you can start building with this component using the following basic elements:
-
```jsx
import { Badge } from '@mui/base/Badge';
-
-export default function MyApp() {
- return {/* the element that the badge is attached to */};
-}
```
-### Basics
-
The Badge wraps around the UI element that it's attached to.
-For instance, if the badge indicates the number of emails in an inbox, then the component will be structured like this:
-
-```jsx
-
-
-
-```
### Anatomy
-The Badge component is composed of a root `` that houses the element that the badge is attached to, followed by a `` slot to represent the badge itself:
+The Badge component is composed of a root `` that houses the element that the Badge is attached to, followed by a `` slot to represent the Badge itself:
```html
@@ -79,9 +62,10 @@ The following code snippet applies a CSS class called `my-badge` to the badge sl
```
-#### Usage with TypeScript
+### Usage with TypeScript
-In TypeScript, you can specify the custom component type used in the `slots.root` as a generic parameter of the unstyled component. This way, you can safely provide the custom root's props directly on the component:
+In TypeScript, you can specify the custom component type used in the `slots.root` as a generic parameter of the unstyled component.
+This way, you can safely provide the custom root's props directly on the component:
```tsx
slots={{ root: CustomComponent }} customProp />
@@ -99,10 +83,10 @@ The same applies for props specific to custom primitive elements:
import { useBadge } from '@mui/base/useBadge';
```
-The `useBadge` hook lets you apply the functionality of a badge to a fully custom component.
+The `useBadge` hook lets you apply the functionality of a Badge to a fully custom component.
It returns props to be placed on the custom component, along with fields representing the component's internal state.
-Hooks _do not_ support [slot props](#slot-props), but they do support [customization props](#customization).
+Hooks _do not_ support [slot props](#custom-structure), but they do support [customization props](#customization).
:::info
Hooks give you the most room for customization, but require more work to implement.
@@ -120,27 +104,27 @@ For the sake of simplicity, demos and code snippets primarily feature components
### Badge content
-The `badgeContent` prop defines the content that's displayed inside the badge.
-When this content is a number, there are additional props you can use for further customization—see the [Numerical badges section](#numerical-badges) below.
+The `badgeContent` prop defines the content that's displayed inside the Badge.
+When this content is a number, there are additional props you can use for further customization—see the [Numerical Badges section](#numerical-badges) below.
-The following demo shows how to create and style a typical numerical badge that's attached to a generic box element:
+The following demo shows how to create and style a typical numerical Badge that's attached to a generic box element:
{{"demo": "UnstyledBadge", "defaultCodeOpen": false}}
### Badge visibility
-You can control the visibility of a badge by using the `invisible` prop.
-Setting a badge to `invisible` does not actually hide it—instead, this prop adds the `BaseBadge-invisible` class to the badge, which you can target with styles to hide however you prefer:
+You can control the visibility of a Badge by using the `invisible` prop.
+Setting a Badge to `invisible` does not actually hide it—instead, this prop adds the `BaseBadge-invisible` class to the Badge, which you can target with styles to hide however you prefer:
{{"demo": "BadgeVisibility.js"}}
-### Numerical badges
+### Numerical Badges
The following props are useful when `badgeContent` is a number.
#### The showZero prop
-By default, badges automatically hide when `badgeContent={0}`.
+By default, Badges automatically hide when `badgeContent={0}`.
You can override this behavior with the `showZero` prop:
{{"demo": "ShowZeroBadge.js"}}
@@ -154,7 +138,7 @@ The default is 99.
## Accessibility
-Screen readers may not provide users with enough information about a badge's contents.
+Screen readers may not provide users with enough information about a Badge's contents.
To make your badge accessible, you must provide a full description with `aria-label`, as shown in the demo below:
{{"demo": "AccessibleBadges.js"}}
diff --git a/docs/data/base/components/button/UnstyledButtonCustom.js b/docs/data/base/components/button/UnstyledButtonCustom.js
index f24ea77300da7e..4f4e2399fafeaf 100644
--- a/docs/data/base/components/button/UnstyledButtonCustom.js
+++ b/docs/data/base/components/button/UnstyledButtonCustom.js
@@ -53,7 +53,7 @@ const CustomButtonRoot = styled(ButtonRoot)(
transition: all 800ms ease;
pointer-events: none;
}
-
+
& .bg {
stroke: var(--main-color);
stroke-width: 1;
@@ -86,7 +86,7 @@ const CustomButtonRoot = styled(ButtonRoot)(
outline-offset: 2px;
}
- &.${buttonClasses.active} {
+ &.${buttonClasses.active} {
& .bg {
fill: var(--active-color);
transition: fill 300ms ease-out;
diff --git a/docs/data/base/components/button/UnstyledButtonCustom.tsx b/docs/data/base/components/button/UnstyledButtonCustom.tsx
index 6733dee6f7e020..72413739662779 100644
--- a/docs/data/base/components/button/UnstyledButtonCustom.tsx
+++ b/docs/data/base/components/button/UnstyledButtonCustom.tsx
@@ -54,7 +54,7 @@ const CustomButtonRoot = styled(ButtonRoot)(
transition: all 800ms ease;
pointer-events: none;
}
-
+
& .bg {
stroke: var(--main-color);
stroke-width: 1;
@@ -87,7 +87,7 @@ const CustomButtonRoot = styled(ButtonRoot)(
outline-offset: 2px;
}
- &.${buttonClasses.active} {
+ &.${buttonClasses.active} {
& .bg {
fill: var(--active-color);
transition: fill 300ms ease-out;
diff --git a/docs/data/base/components/button/UnstyledButtonsSimple/css/index.js b/docs/data/base/components/button/UnstyledButtonsSimple/css/index.js
index 1caf7cb2550212..f7cdde1f0fd0be 100644
--- a/docs/data/base/components/button/UnstyledButtonsSimple/css/index.js
+++ b/docs/data/base/components/button/UnstyledButtonsSimple/css/index.js
@@ -54,12 +54,11 @@ function Styles() {
.CustomButton:active:not(.${buttonClasses.disabled}) {
background-color: ${cyan[700]};
}
-
+
.${buttonClasses.disabled} {
opacity: 0.5;
cursor: not-allowed;
-
-
+ }
`}
);
diff --git a/docs/data/base/components/button/UnstyledButtonsSimple/css/index.tsx b/docs/data/base/components/button/UnstyledButtonsSimple/css/index.tsx
index 1caf7cb2550212..f7cdde1f0fd0be 100644
--- a/docs/data/base/components/button/UnstyledButtonsSimple/css/index.tsx
+++ b/docs/data/base/components/button/UnstyledButtonsSimple/css/index.tsx
@@ -54,12 +54,11 @@ function Styles() {
.CustomButton:active:not(.${buttonClasses.disabled}) {
background-color: ${cyan[700]};
}
-
+
.${buttonClasses.disabled} {
opacity: 0.5;
cursor: not-allowed;
-
-
+ }
`}
);
diff --git a/docs/data/base/components/button/button.md b/docs/data/base/components/button/button.md
index ded95fe3b98b7a..38412762441a86 100644
--- a/docs/data/base/components/button/button.md
+++ b/docs/data/base/components/button/button.md
@@ -23,20 +23,10 @@ The Button component replaces the native HTML `