michal review

mui · Nov 13, 2023 · 5a6d6a3 · 5a6d6a3
1 parent 835e162
commit 5a6d6a3
Show file tree

Hide file tree

Showing 2 changed files with 8 additions and 8 deletions.
diff --git a/docs/data/base/components/button/UnstyledButtonIntroduction/system/index.js b/docs/data/base/components/button/UnstyledButtonIntroduction/system/index.js
@@ -1,5 +1,5 @@
 import * as React from 'react';
-import { Button as BaseButton } from '@mui/base/Button';
+import { Button as BaseButton, buttonClasses } from '@mui/base/Button';
 import { styled } from '@mui/system';
 import Stack from '@mui/material/Stack';
 
@@ -55,18 +55,18 @@ const Button = styled(BaseButton)(
     background-color: ${blue[600]};
   }
 
-  &.Mui-active {
+  &.${buttonClasses.active} {
     background-color: ${blue[700]};
     box-shadow: none;
     transform: scale(0.99);
   }
 
-  &.Mui-focusVisible {
+  &.${buttonClasses.focusVisible} {
     box-shadow: 0 0 0 4px ${theme.palette.mode === 'dark' ? blue[300] : blue[200]};
     outline: none;
   }
 
-  &.Mui-disabled {
+  &.${buttonClasses.disabled} {
     background-color: ${theme.palette.mode === 'dark' ? grey[700] : grey[200]};
     color: ${theme.palette.mode === 'dark' ? grey[200] : grey[700]};
     border: 0;

diff --git a/docs/data/base/components/button/UnstyledButtonIntroduction/system/index.tsx b/docs/data/base/components/button/UnstyledButtonIntroduction/system/index.tsx
@@ -1,5 +1,5 @@
 import * as React from 'react';
-import { Button as BaseButton } from '@mui/base/Button';
+import { Button as BaseButton, buttonClasses } from '@mui/base/Button';
 import { styled } from '@mui/system';
 import Stack from '@mui/material/Stack';
 
@@ -55,18 +55,18 @@ const Button = styled(BaseButton)(
     background-color: ${blue[600]};
   }
 
-  &.Mui-active {
+  &.${buttonClasses.active} {
     background-color: ${blue[700]};
     box-shadow: none;
     transform: scale(0.99);
   }
 
-  &.Mui-focusVisible {
+  &.${buttonClasses.focusVisible} {
     box-shadow: 0 0 0 4px ${theme.palette.mode === 'dark' ? blue[300] : blue[200]};
     outline: none;
   }
 
-  &.Mui-disabled {
+  &.${buttonClasses.disabled} {
     background-color: ${theme.palette.mode === 'dark' ? grey[700] : grey[200]};
     color: ${theme.palette.mode === 'dark' ? grey[200] : grey[700]};
     border: 0;