UNPKG

2.39 kBJavaScriptView Raw
1import { createBreakpoints, createSpacing } from '@mui/system';
2export default function adaptV4Theme(inputTheme) {
3 if (process.env.NODE_ENV !== 'production') {
4 console.warn(['MUI: adaptV4Theme() is deprecated.', 'Follow the upgrade guide on https://mui.com/r/migration-v4#theme.'].join('\n'));
5 }
6 const {
7 defaultProps = {},
8 mixins = {},
9 overrides = {},
10 palette = {},
11 props = {},
12 styleOverrides = {},
13 ...other
14 } = inputTheme;
15 const theme = {
16 ...other,
17 components: {}
18 };
19
20 // default props
21 Object.keys(defaultProps).forEach(component => {
22 const componentValue = theme.components[component] || {};
23 componentValue.defaultProps = defaultProps[component];
24 theme.components[component] = componentValue;
25 });
26 Object.keys(props).forEach(component => {
27 const componentValue = theme.components[component] || {};
28 componentValue.defaultProps = props[component];
29 theme.components[component] = componentValue;
30 });
31
32 // CSS overrides
33 Object.keys(styleOverrides).forEach(component => {
34 const componentValue = theme.components[component] || {};
35 componentValue.styleOverrides = styleOverrides[component];
36 theme.components[component] = componentValue;
37 });
38 Object.keys(overrides).forEach(component => {
39 const componentValue = theme.components[component] || {};
40 componentValue.styleOverrides = overrides[component];
41 theme.components[component] = componentValue;
42 });
43
44 // theme.spacing
45 theme.spacing = createSpacing(inputTheme.spacing);
46
47 // theme.mixins.gutters
48 const breakpoints = createBreakpoints(inputTheme.breakpoints || {});
49 const spacing = theme.spacing;
50 theme.mixins = {
51 gutters: (styles = {}) => {
52 return {
53 paddingLeft: spacing(2),
54 paddingRight: spacing(2),
55 ...styles,
56 [breakpoints.up('sm')]: {
57 paddingLeft: spacing(3),
58 paddingRight: spacing(3),
59 ...styles[breakpoints.up('sm')]
60 }
61 };
62 },
63 ...mixins
64 };
65 const {
66 type: typeInput,
67 mode: modeInput,
68 ...paletteRest
69 } = palette;
70 const finalMode = modeInput || typeInput || 'light';
71 theme.palette = {
72 // theme.palette.text.hint
73 text: {
74 hint: finalMode === 'dark' ? 'rgba(255, 255, 255, 0.5)' : 'rgba(0, 0, 0, 0.38)'
75 },
76 mode: finalMode,
77 type: finalMode,
78 ...paletteRest
79 };
80 return theme;
81}
\No newline at end of file