UNPKG

@mui/material

Version:

Quickly build beautiful React apps. MUI is a simple and customizable component library to build faster, beautiful, and more accessible React applications. Follow your own design system, or start with Material Design.

82 lines (73 loc) 2.81 kB
import _extends from "@babel/runtime/helpers/esm/extends"; import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose"; const _excluded = ["defaultProps", "mixins", "overrides", "palette", "props", "styleOverrides"], _excluded2 = ["type", "mode"]; import { createBreakpoints, createSpacing } from '@mui/system'; export default function adaptV4Theme(inputTheme) { if (process.env.NODE_ENV !== 'production') { console.warn(['MUI: adaptV4Theme() is deprecated.', 'Follow the upgrade guide on https://mui.com/r/migration-v4#theme.'].join('\n')); } const { defaultProps = {}, mixins = {}, overrides = {}, palette = {}, props = {}, styleOverrides = {} } = inputTheme, other = _objectWithoutPropertiesLoose(inputTheme, _excluded); const theme = _extends({}, other, { components: {} }); // default props Object.keys(defaultProps).forEach(component => { const componentValue = theme.components[component] || {}; componentValue.defaultProps = defaultProps[component]; theme.components[component] = componentValue; }); Object.keys(props).forEach(component => { const componentValue = theme.components[component] || {}; componentValue.defaultProps = props[component]; theme.components[component] = componentValue; }); // CSS overrides Object.keys(styleOverrides).forEach(component => { const componentValue = theme.components[component] || {}; componentValue.styleOverrides = styleOverrides[component]; theme.components[component] = componentValue; }); Object.keys(overrides).forEach(component => { const componentValue = theme.components[component] || {}; componentValue.styleOverrides = overrides[component]; theme.components[component] = componentValue; }); // theme.spacing theme.spacing = createSpacing(inputTheme.spacing); // theme.mixins.gutters const breakpoints = createBreakpoints(inputTheme.breakpoints || {}); const spacing = theme.spacing; theme.mixins = _extends({ gutters: (styles = {}) => { return _extends({ paddingLeft: spacing(2), paddingRight: spacing(2) }, styles, { [breakpoints.up('sm')]: _extends({ paddingLeft: spacing(3), paddingRight: spacing(3) }, styles[breakpoints.up('sm')]) }); } }, mixins); const { type: typeInput, mode: modeInput } = palette, paletteRest = _objectWithoutPropertiesLoose(palette, _excluded2); const finalMode = modeInput || typeInput || 'light'; theme.palette = _extends({ // theme.palette.text.hint text: { hint: finalMode === 'dark' ? 'rgba(255, 255, 255, 0.5)' : 'rgba(0, 0, 0, 0.38)' }, mode: finalMode, type: finalMode }, paletteRest); return theme; }