Skip to content
Permalink
material-ui/packages/mui-material/src/styles/createTheme.js
Newer
Older
Raw Normal view History
100644 121 lines (107 sloc) 3.57 KB
Ignoring revisions in .git-blame-ignore-revs.
@mnajdova
[core] Rename packages (#28049)
Sep 1, 2021
1
import { deepmerge } from '@mui/utils';
2
import { generateUtilityClass } from '@mui/core';
3
import { createTheme as systemCreateTheme } from '@mui/system';
@oliviertassinari
[theme] Simplification of the API (#7934)
Aug 28, 2017
4
import createMixins from './createMixins';
@itelo @oliviertassinari
[theme] Add border-radius to the theme (#11847)
Jun 25, 2018
5
import createPalette from './createPalette';
6
import createTypography from './createTypography';
@oliviertassinari
[theme] Extend createMuiTheme behavior (#8188)
Sep 13, 2017
7
import shadows from './shadows';
@pandeymangg
[theme] Fix transition duration default value customization (#26054)
Apr 29, 2021
8
import createTransitions from './createTransitions';
@oliviertassinari
[theme] Simplification of the API (#7934)
Aug 28, 2017
9
import zIndex from './zIndex';
10
@m4theushw
[theme] Rename createMuiTheme to createTheme (#25992)
Apr 29, 2021
11
function createTheme(options = {}, ...args) {
@oliviertassinari
[theme] Simplification of the API (#7934)
Aug 28, 2017
12
const {
@mnajdova
[system] Add createTheme util (#26490)
Jun 4, 2021
13
breakpoints: breakpointsInput,
@oliviertassinari
[theme] Simplification of the API (#7934)
Aug 28, 2017
14
mixins: mixinsInput = {},
@ifndefdeadmau5 @oliviertassinari
[Grid] Use a unitless spacing API (#14099)
Feb 8, 2019
15
spacing: spacingInput,
@mnajdova
[system] Add createTheme util (#26490)
Jun 4, 2021
16
palette: paletteInput = {},
@pandeymangg
[theme] Fix transition duration default value customization (#26054)
Apr 29, 2021
17
transitions: transitionsInput = {},
@itelo @oliviertassinari
[theme] Add border-radius to the theme (#11847)
Jun 25, 2018
18
typography: typographyInput = {},
@mnajdova
[system] Add createTheme util (#26490)
Jun 4, 2021
19
shape: shapeInput,
@oliviertassinari
[theme] Simplification of the API (#7934)
Aug 28, 2017
20
...other
21
} = options;
22
23
const palette = createPalette(paletteInput);
@mnajdova
[system] Add createTheme util (#26490)
Jun 4, 2021
24
const systemTheme = systemCreateTheme(options);
@oliviertassinari
[theme] Simplification of the API (#7934)
Aug 28, 2017
25
@mnajdova
[system] Add createTheme util (#26490)
Jun 4, 2021
26
let muiTheme = deepmerge(systemTheme, {
27
mixins: createMixins(systemTheme.breakpoints, systemTheme.spacing, mixinsInput),
28
palette,
29
// Don't use [...shadows] until you've verified its transpiled code is not invoking the iterator protocol.
30
shadows: shadows.slice(),
31
typography: createTypography(palette, typographyInput),
32
transitions: createTransitions(transitionsInput),
33
zIndex: { ...zIndex },
34
});
@soltanloo @oliviertassinari
[core] Add localization (#18219)
Nov 16, 2019
35
@mnajdova
[system] Add createTheme util (#26490)
Jun 4, 2021
36
muiTheme = deepmerge(muiTheme, other);
@soltanloo @oliviertassinari
[core] Add localization (#18219)
Nov 16, 2019
37
muiTheme = args.reduce((acc, argument) => deepmerge(acc, argument), muiTheme);
@oliviertassinari
[theme] Support overriding the shadows key (#8795)
Oct 22, 2017
38
@oliviertassinari
[docs] Improve the state override story (#13919)
Dec 17, 2018
39
if (process.env.NODE_ENV !== 'production') {
@michaldudak
[docs] Change "pseudo-classes" to "state classes" (#27570)
Aug 3, 2021
40
const stateClasses = [
@mnajdova
[core] Improve pseudo classes overrides error (#24535)
Jan 22, 2021
41
'active',
@oliviertassinari
[core] Better handle theme.overrides pseudo-classes (#15578)
May 4, 2019
42
'checked',
@michal-perlakowski
[Stepper] Add completed to global pseudo-classes (#26953)
Jun 30, 2021
43
'completed',
@oliviertassinari
[core] Better handle theme.overrides pseudo-classes (#15578)
May 4, 2019
44
'disabled',
45
'error',
@michal-perlakowski
[Stepper] Add completed to global pseudo-classes (#26953)
Jun 30, 2021
46
'expanded',
@oliviertassinari
[core] Better handle theme.overrides pseudo-classes (#15578)
May 4, 2019
47
'focused',
48
'focusVisible',
49
'required',
50
'selected',
51
];
@mnajdova
[core] Improve pseudo classes overrides error (#24535)
Jan 22, 2021
52
@mnajdova
[Theme] Restructure component definitions (#22293)
Aug 24, 2020
53
const traverse = (node, component) => {
@oliviertassinari
[docs] Improve the state override story (#13919)
Dec 17, 2018
54
let key;
55
56
// eslint-disable-next-line guard-for-in, no-restricted-syntax
57
for (key in node) {
58
const child = node[key];
@michaldudak
[docs] Change "pseudo-classes" to "state classes" (#27570)
Aug 3, 2021
59
if (stateClasses.indexOf(key) !== -1 && Object.keys(child).length > 0) {
@eps1lon
[core] Replace warning with manual console.error (#17404)
Sep 13, 2019
60
if (process.env.NODE_ENV !== 'production') {
@michaldudak
[docs] Change "pseudo-classes" to "state classes" (#27570)
Aug 3, 2021
61
const stateClass = generateUtilityClass('', key);
@eps1lon
[core] Replace warning with manual console.error (#17404)
Sep 13, 2019
62
console.error(
63
[
@mnajdova
[Theme] Restructure component definitions (#22293)
Aug 24, 2020
64
`Material-UI: The \`${component}\` component increases ` +
@eps1lon
[core] Replace warning with manual console.error (#17404)
Sep 13, 2019
65
`the CSS specificity of the \`${key}\` internal state.`,
66
'You can not override it like this: ',
67
JSON.stringify(node, null, 2),
68
'',
@michaldudak
[docs] Change "pseudo-classes" to "state classes" (#27570)
Aug 3, 2021
69
`Instead, you need to use the '&.${stateClass}' syntax:`,
@eps1lon
[core] Replace warning with manual console.error (#17404)
Sep 13, 2019
70
JSON.stringify(
71
{
72
root: {
@michaldudak
[docs] Change "pseudo-classes" to "state classes" (#27570)
Aug 3, 2021
73
[`&.${stateClass}`]: child,
@eps1lon
[core] Replace warning with manual console.error (#17404)
Sep 13, 2019
74
},
@oliviertassinari
[theme] Improve the state warning (#14412)
Feb 5, 2019
75
},
@eps1lon
[core] Replace warning with manual console.error (#17404)
Sep 13, 2019
76
null,
77
2,
78
),
79
'',
@michaldudak
[docs] Change "pseudo-classes" to "state classes" (#27570)
Aug 3, 2021
80
'https://material-ui.com/r/state-classes-guide',
@eps1lon
[core] Replace warning with manual console.error (#17404)
Sep 13, 2019
81
].join('\n'),
82
);
83
}
@oliviertassinari
[core] Better handle theme.overrides pseudo-classes (#15578)
May 4, 2019
84
// Remove the style to prevent global conflicts.
85
node[key] = {};
@oliviertassinari
[docs] Improve the state override story (#13919)
Dec 17, 2018
86
}
87
}
88
};
89
@mnajdova
[Theme] Restructure component definitions (#22293)
Aug 24, 2020
90
Object.keys(muiTheme.components).forEach((component) => {
@mnajdova
[Theme] Rename theme keys to defaultProps and styleOverrides (#22347)
Aug 28, 2020
91
const styleOverrides = muiTheme.components[component].styleOverrides;
@mnajdova
[Theme] Restructure component definitions (#22293)
Aug 24, 2020
92
@mnajdova
[Theme] Rename theme keys to defaultProps and styleOverrides (#22347)
Aug 28, 2020
93
if (styleOverrides && component.indexOf('Mui') === 0) {
94
traverse(styleOverrides, component);
@mnajdova
[Theme] Restructure component definitions (#22293)
Aug 24, 2020
95
}
96
});
@oliviertassinari
[docs] Improve the state override story (#13919)
Dec 17, 2018
97
}
98
@oliviertassinari
[theme] Support overriding the shadows key (#8795)
Oct 22, 2017
99
return muiTheme;
@oliviertassinari
[theme] Simplification of the API (#7934)
Aug 28, 2017
100
}
101
@m4theushw
[theme] Rename createMuiTheme to createTheme (#25992)
Apr 29, 2021
102
let warnedOnce = false;
103
104
export function createMuiTheme(...args) {
105
if (process.env.NODE_ENV !== 'production') {
106
if (!warnedOnce) {
107
warnedOnce = true;
108
console.error(
109
[
110
'Material-UI: the createMuiTheme function was renamed to createTheme.',
111
'',
@mnajdova
[core] Rename packages (#28049)
Sep 1, 2021
112
"You should use `import { createTheme } from '@mui/material/styles'`",
@m4theushw
[theme] Rename createMuiTheme to createTheme (#25992)
Apr 29, 2021
113
].join('\n'),
114
);
115
}
116
}
117
118
return createTheme(...args);
119
}
120
121
export default createTheme;