diff --git a/packages/material-ui-lab/src/internal/pickers/wrappers/StaticWrapper.tsx b/packages/material-ui-lab/src/internal/pickers/wrappers/StaticWrapper.tsx index 793ced83981a34..9db5e9be4b1bf7 100644 --- a/packages/material-ui-lab/src/internal/pickers/wrappers/StaticWrapper.tsx +++ b/packages/material-ui-lab/src/internal/pickers/wrappers/StaticWrapper.tsx @@ -1,20 +1,8 @@ import * as React from 'react'; -import { WithStyles, withStyles, MuiStyles, StyleRules } from '@material-ui/core/styles'; +import { experimentalStyled as styled } from '@material-ui/core/styles'; import { DIALOG_WIDTH } from '../constants/dimensions'; import { WrapperVariantContext, IsStaticVariantContext } from './WrapperVariantContext'; -type StaticWrapperClassKey = 'root'; - -const styles: MuiStyles = (theme): StyleRules => ({ - root: { - overflow: 'hidden', - minWidth: DIALOG_WIDTH, - display: 'flex', - flexDirection: 'column', - backgroundColor: theme.palette.background.paper, - }, -}); - export interface StaticWrapperProps { children?: React.ReactNode; /** @@ -23,18 +11,30 @@ export interface StaticWrapperProps { displayStaticWrapperAs: 'desktop' | 'mobile'; } -function StaticWrapper(props: StaticWrapperProps & WithStyles) { - const { classes, displayStaticWrapperAs, children } = props; +const StaticWrapperRoot = styled( + 'div', + {}, + { skipSx: true }, +)(({ theme }) => ({ + overflow: 'hidden', + minWidth: DIALOG_WIDTH, + display: 'flex', + flexDirection: 'column', + backgroundColor: theme.palette.background.paper, +})); + +function StaticWrapper(props: StaticWrapperProps) { + const { displayStaticWrapperAs, children } = props; const isStatic = true; return ( -
{children}
+ {children}
); } -export default withStyles(styles, { name: 'MuiPickersStaticWrapper' })(StaticWrapper); +export default StaticWrapper;