diff --git a/packages/material-ui-styled-engine-sc/src/index.js b/packages/material-ui-styled-engine-sc/src/index.js index b023957e85fe10..fbd93b268d4b54 100644 --- a/packages/material-ui-styled-engine-sc/src/index.js +++ b/packages/material-ui-styled-engine-sc/src/index.js @@ -1,2 +1,12 @@ -export * from 'styled-components'; -export { default } from 'styled-components'; +import scStyled from "styled-components"; + +export default function styled(tag, options) { + if (options) { + return scStyled(tag).withConfig({ + displayName: options.label, + shouldForwardProp: options.shouldForwardProp, + }); + } + + return scStyled(tag); +} diff --git a/packages/material-ui-styled-engine/src/index.js b/packages/material-ui-styled-engine/src/index.js index 53bc27a1a267b7..9b24cbd7fcb37d 100644 --- a/packages/material-ui-styled-engine/src/index.js +++ b/packages/material-ui-styled-engine/src/index.js @@ -1,2 +1 @@ -export * from '@emotion/styled'; export { default } from '@emotion/styled'; diff --git a/packages/material-ui/src/styles/muiStyled.js b/packages/material-ui/src/styles/muiStyled.js index ef92b7fd9eabb8..d86f27239a4752 100644 --- a/packages/material-ui/src/styles/muiStyled.js +++ b/packages/material-ui/src/styles/muiStyled.js @@ -57,10 +57,9 @@ const variantsResolver = (props, styles, theme, name) => { const shouldForwardProp = (prop) => prop !== 'styleProps' && prop !== 'theme'; const muiStyled = (tag, options, muiOptions) => { - const defaultStyledResolver = styled(tag, { shouldForwardProp, ...options }); + const name = muiOptions.muiName; + const defaultStyledResolver = styled(tag, { shouldForwardProp, label: name, ...options }); const muiStyledResolver = (...styles) => { - const name = muiOptions.muiName; - if (muiOptions.overridesResolver) { styles.push((props) => { const theme = props.theme || defaultTheme;