1 | import _extends from "@babel/runtime/helpers/esm/extends";
|
2 | import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
|
3 | import { formatMuiErrorMessage as _formatMuiErrorMessage } from "@mui/utils";
|
4 | const _excluded = ["breakpoints", "mixins", "spacing", "palette", "transitions", "typography", "shape"];
|
5 | import { deepmerge } from '@mui/utils';
|
6 | import { generateUtilityClass } from '@mui/base';
|
7 | import { createTheme as systemCreateTheme } from '@mui/system';
|
8 | import createMixins from './createMixins';
|
9 | import createPalette from './createPalette';
|
10 | import createTypography from './createTypography';
|
11 | import shadows from './shadows';
|
12 | import createTransitions from './createTransitions';
|
13 | import zIndex from './zIndex';
|
14 |
|
15 | function createTheme(options = {}, ...args) {
|
16 | const {
|
17 | mixins: mixinsInput = {},
|
18 | palette: paletteInput = {},
|
19 | transitions: transitionsInput = {},
|
20 | typography: typographyInput = {}
|
21 | } = options,
|
22 | other = _objectWithoutPropertiesLoose(options, _excluded);
|
23 |
|
24 | if (options.vars) {
|
25 | throw new Error(process.env.NODE_ENV !== "production" ? `MUI: \`vars\` is a private field used for CSS variables support.
|
26 | Please use another name.` : _formatMuiErrorMessage(18));
|
27 | }
|
28 |
|
29 | const palette = createPalette(paletteInput);
|
30 | const systemTheme = systemCreateTheme(options);
|
31 | let muiTheme = deepmerge(systemTheme, {
|
32 | mixins: createMixins(systemTheme.breakpoints, mixinsInput),
|
33 | palette,
|
34 |
|
35 | shadows: shadows.slice(),
|
36 | typography: createTypography(palette, typographyInput),
|
37 | transitions: createTransitions(transitionsInput),
|
38 | zIndex: _extends({}, zIndex)
|
39 | });
|
40 | muiTheme = deepmerge(muiTheme, other);
|
41 | muiTheme = args.reduce((acc, argument) => deepmerge(acc, argument), muiTheme);
|
42 |
|
43 | if (process.env.NODE_ENV !== 'production') {
|
44 | const stateClasses = ['active', 'checked', 'completed', 'disabled', 'error', 'expanded', 'focused', 'focusVisible', 'required', 'selected'];
|
45 |
|
46 | const traverse = (node, component) => {
|
47 | let key;
|
48 |
|
49 | for (key in node) {
|
50 | const child = node[key];
|
51 |
|
52 | if (stateClasses.indexOf(key) !== -1 && Object.keys(child).length > 0) {
|
53 | if (process.env.NODE_ENV !== 'production') {
|
54 | const stateClass = generateUtilityClass('', key);
|
55 | console.error([`MUI: The \`${component}\` component increases ` + `the CSS specificity of the \`${key}\` internal state.`, 'You can not override it like this: ', JSON.stringify(node, null, 2), '', `Instead, you need to use the '&.${stateClass}' syntax:`, JSON.stringify({
|
56 | root: {
|
57 | [`&.${stateClass}`]: child
|
58 | }
|
59 | }, null, 2), '', 'https://mui.com/r/state-classes-guide'].join('\n'));
|
60 | }
|
61 |
|
62 |
|
63 | node[key] = {};
|
64 | }
|
65 | }
|
66 | };
|
67 |
|
68 | Object.keys(muiTheme.components).forEach(component => {
|
69 | const styleOverrides = muiTheme.components[component].styleOverrides;
|
70 |
|
71 | if (styleOverrides && component.indexOf('Mui') === 0) {
|
72 | traverse(styleOverrides, component);
|
73 | }
|
74 | });
|
75 | }
|
76 |
|
77 | return muiTheme;
|
78 | }
|
79 |
|
80 | let warnedOnce = false;
|
81 | export function createMuiTheme(...args) {
|
82 | if (process.env.NODE_ENV !== 'production') {
|
83 | if (!warnedOnce) {
|
84 | warnedOnce = true;
|
85 | console.error(['MUI: the createMuiTheme function was renamed to createTheme.', '', "You should use `import { createTheme } from '@mui/material/styles'`"].join('\n'));
|
86 | }
|
87 | }
|
88 |
|
89 | return createTheme(...args);
|
90 | }
|
91 | export default createTheme; |
\ | No newline at end of file |