diff --git a/docs/src/pages/components/switches/UnstyledSwitches.js b/docs/src/pages/components/switches/UnstyledSwitches.js index ff535364f84b2a..1d641618e8c2d1 100644 --- a/docs/src/pages/components/switches/UnstyledSwitches.js +++ b/docs/src/pages/components/switches/UnstyledSwitches.js @@ -15,12 +15,10 @@ const Root = styled('span')({ borderRadius: '20px', margin: '10px', cursor: 'pointer', - [`&.${switchUnstyledClasses.disabled}`]: { opacity: 0.5, cursor: 'not-allowed', }, - [`& .${switchUnstyledClasses.thumb}`]: { display: 'block', width: '24px', @@ -32,18 +30,15 @@ const Root = styled('span')({ position: 'relative', transition: 'all 200ms ease', }, - [`& .${switchUnstyledClasses.button}`]: { display: 'block', height: '100%', borderRadius: '20px', }, - [`& .${switchUnstyledClasses.focusVisible} .${switchUnstyledClasses.thumb}`]: { backgroundColor: 'rgba(255,255,255,1)', boxShadow: '0 0 1px 8px rgba(0,0,0,0.25)', }, - [`&.${switchUnstyledClasses.checked} .${switchUnstyledClasses.thumb}`]: { left: '4px', top: '24px', @@ -51,7 +46,6 @@ const Root = styled('span')({ height: '32px', backgroundColor: 'rgba(255,255,255,0.9)', }, - [`& .${switchUnstyledClasses.input}`]: { cursor: 'inherit', }, diff --git a/packages/material-ui-unstyled/src/ButtonUnstyled/ButtonUnstyled.tsx b/packages/material-ui-unstyled/src/ButtonUnstyled/ButtonUnstyled.tsx index f23df182cbe670..60ddec81f1e107 100644 --- a/packages/material-ui-unstyled/src/ButtonUnstyled/ButtonUnstyled.tsx +++ b/packages/material-ui-unstyled/src/ButtonUnstyled/ButtonUnstyled.tsx @@ -46,11 +46,7 @@ const useUtilityClasses = (styleProps: ButtonUnstyledProps & { focusVisible const { disabled, focusVisible } = styleProps; const slots = { - root: [ - 'root', - disabled && 'disabled', - focusVisible && 'focusVisible', - ], + root: ['root', disabled && 'disabled', focusVisible && 'focusVisible'], }; return composeClasses(slots, getButtonUnstyledUtilityClass, {}); diff --git a/packages/material-ui-unstyled/src/ButtonUnstyled/buttonUnstyledClasses.ts b/packages/material-ui-unstyled/src/ButtonUnstyled/buttonUnstyledClasses.ts index 4e9ac3d31d107f..d306a91631315a 100644 --- a/packages/material-ui-unstyled/src/ButtonUnstyled/buttonUnstyledClasses.ts +++ b/packages/material-ui-unstyled/src/ButtonUnstyled/buttonUnstyledClasses.ts @@ -13,7 +13,7 @@ export function getButtonUnstyledUtilityClass(slot: string): string { const buttonUnstyledClasses: ButtonUnstyledClasses = generateUtilityClasses('ButtonUnstyled', [ 'root', - 'focusVisible' + 'focusVisible', ]); export default buttonUnstyledClasses; diff --git a/packages/material-ui-unstyled/src/SwitchUnstyled/SwitchUnstyled.tsx b/packages/material-ui-unstyled/src/SwitchUnstyled/SwitchUnstyled.tsx index c5efeee139a543..34f7a4df5ac3a8 100644 --- a/packages/material-ui-unstyled/src/SwitchUnstyled/SwitchUnstyled.tsx +++ b/packages/material-ui-unstyled/src/SwitchUnstyled/SwitchUnstyled.tsx @@ -63,7 +63,8 @@ const SwitchUnstyled = function SwitchUnstyled< componentsProps={{ root: { role: undefined } }} tabIndex={-1} disabled={isDisabled} - className={classes.button}> + className={classes.button} + > ( - render: (props: P, ref: ForwardedRef) => ReactElement | null + render: (props: P, ref: ForwardedRef) => ReactElement | null, ): (props: P & RefAttributes) => ReactElement | null; }