Skip to content
Permalink
material-ui/packages/material-ui/src/styles/createMuiTheme.js
Newer
Older
Raw Normal view History
100644 109 lines (98 sloc) 3.35 KB
@oliviertassinari
[core] Custom deepmerge implementation (#17982)
Oct 23, 2019
1
import { deepmerge } from '@material-ui/utils';
@mnajdova
[core] Improve pseudo classes overrides error (#24535)
Jan 22, 2021
2
import { generateUtilityClass } from '@material-ui/unstyled';
@oliviertassinari
[theme] Simplification of the API (#7934)
Aug 28, 2017
3
import createBreakpoints from './createBreakpoints';
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';
@itelo @oliviertassinari
[theme] Add border-radius to the theme (#11847)
Jun 25, 2018
8
import shape from './shape';
@ifndefdeadmau5 @oliviertassinari
[Grid] Use a unitless spacing API (#14099)
Feb 8, 2019
9
import createSpacing from './createSpacing';
@eps1lon
[theme] Convert transitions from object to ES module (#22517)
Sep 7, 2020
10
import { duration, easing, create, getAutoHeightDuration } from './transitions';
@oliviertassinari
[theme] Simplification of the API (#7934)
Aug 28, 2017
11
import zIndex from './zIndex';
12
@soltanloo @oliviertassinari
[core] Add localization (#18219)
Nov 16, 2019
13
function createMuiTheme(options = {}, ...args) {
@oliviertassinari
[theme] Simplification of the API (#7934)
Aug 28, 2017
14
const {
15
breakpoints: breakpointsInput = {},
16
mixins: mixinsInput = {},
@itelo @oliviertassinari
[theme] Add border-radius to the theme (#11847)
Jun 25, 2018
17
palette: paletteInput = {},
@ifndefdeadmau5 @oliviertassinari
[Grid] Use a unitless spacing API (#14099)
Feb 8, 2019
18
spacing: spacingInput,
@itelo @oliviertassinari
[theme] Add border-radius to the theme (#11847)
Jun 25, 2018
19
typography: typographyInput = {},
@oliviertassinari
[theme] Simplification of the API (#7934)
Aug 28, 2017
20
...other
21
} = options;
22
23
const palette = createPalette(paletteInput);
24
const breakpoints = createBreakpoints(breakpointsInput);
@ifndefdeadmau5 @oliviertassinari
[Grid] Use a unitless spacing API (#14099)
Feb 8, 2019
25
const spacing = createSpacing(spacingInput);
@oliviertassinari
[theme] Simplification of the API (#7934)
Aug 28, 2017
26
@soltanloo @oliviertassinari
[core] Add localization (#18219)
Nov 16, 2019
27
let muiTheme = deepmerge(
28
{
29
breakpoints,
30
direction: 'ltr',
31
mixins: createMixins(breakpoints, spacing, mixinsInput),
@mnajdova
[Theme] Rename theme keys to defaultProps and styleOverrides (#22347)
Aug 28, 2020
32
components: {}, // Inject component definitions
@soltanloo @oliviertassinari
[core] Add localization (#18219)
Nov 16, 2019
33
palette,
@eps1lon
[core] Remove references to other objects from created theme (#22523)
Sep 9, 2020
34
// Don't use [...shadows] until you've verified its transpiled code is not invoking the iterator protocol.
35
shadows: shadows.slice(),
@soltanloo @oliviertassinari
[core] Add localization (#18219)
Nov 16, 2019
36
typography: createTypography(palette, typographyInput),
37
spacing,
@eps1lon
[core] Remove references to other objects from created theme (#22523)
Sep 9, 2020
38
shape: { ...shape },
@eps1lon
[theme] Convert transitions from object to ES module (#22517)
Sep 7, 2020
39
transitions: { duration, easing, create, getAutoHeightDuration },
@eps1lon
[core] Remove references to other objects from created theme (#22523)
Sep 9, 2020
40
zIndex: { ...zIndex },
@soltanloo @oliviertassinari
[core] Add localization (#18219)
Nov 16, 2019
41
},
42
other,
43
);
44
45
muiTheme = args.reduce((acc, argument) => deepmerge(acc, argument), muiTheme);
@oliviertassinari
[theme] Support overriding the shadows key (#8795)
Oct 22, 2017
46
@oliviertassinari
[docs] Improve the state override story (#13919)
Dec 17, 2018
47
if (process.env.NODE_ENV !== 'production') {
@oliviertassinari
[core] Better handle theme.overrides pseudo-classes (#15578)
May 4, 2019
48
const pseudoClasses = [
@mnajdova
[core] Improve pseudo classes overrides error (#24535)
Jan 22, 2021
49
'active',
@oliviertassinari
[core] Better handle theme.overrides pseudo-classes (#15578)
May 4, 2019
50
'checked',
51
'disabled',
52
'error',
53
'focused',
54
'focusVisible',
55
'required',
56
'expanded',
57
'selected',
58
];
@mnajdova
[core] Improve pseudo classes overrides error (#24535)
Jan 22, 2021
59
@mnajdova
[Theme] Restructure component definitions (#22293)
Aug 24, 2020
60
const traverse = (node, component) => {
@oliviertassinari
[docs] Improve the state override story (#13919)
Dec 17, 2018
61
let key;
62
63
// eslint-disable-next-line guard-for-in, no-restricted-syntax
64
for (key in node) {
65
const child = node[key];
@mnajdova
[Theme] Restructure component definitions (#22293)
Aug 24, 2020
66
if (pseudoClasses.indexOf(key) !== -1 && Object.keys(child).length > 0) {
@eps1lon
[core] Replace warning with manual console.error (#17404)
Sep 13, 2019
67
if (process.env.NODE_ENV !== 'production') {
@mnajdova
[core] Improve pseudo classes overrides error (#24535)
Jan 22, 2021
68
const pseudoClass = generateUtilityClass('', key);
@eps1lon
[core] Replace warning with manual console.error (#17404)
Sep 13, 2019
69
console.error(
70
[
@mnajdova
[Theme] Restructure component definitions (#22293)
Aug 24, 2020
71
`Material-UI: The \`${component}\` component increases ` +
@eps1lon
[core] Replace warning with manual console.error (#17404)
Sep 13, 2019
72
`the CSS specificity of the \`${key}\` internal state.`,
73
'You can not override it like this: ',
74
JSON.stringify(node, null, 2),
75
'',
@mnajdova
[core] Improve pseudo classes overrides error (#24535)
Jan 22, 2021
76
`Instead, you need to use the '&.${pseudoClass}' syntax:`,
@eps1lon
[core] Replace warning with manual console.error (#17404)
Sep 13, 2019
77
JSON.stringify(
78
{
79
root: {
@mnajdova
[core] Improve pseudo classes overrides error (#24535)
Jan 22, 2021
80
[`&.${pseudoClass}`]: child,
@eps1lon
[core] Replace warning with manual console.error (#17404)
Sep 13, 2019
81
},
@oliviertassinari
[theme] Improve the state warning (#14412)
Feb 5, 2019
82
},
@eps1lon
[core] Replace warning with manual console.error (#17404)
Sep 13, 2019
83
null,
84
2,
85
),
86
'',
87
'https://material-ui.com/r/pseudo-classes-guide',
88
].join('\n'),
89
);
90
}
@oliviertassinari
[core] Better handle theme.overrides pseudo-classes (#15578)
May 4, 2019
91
// Remove the style to prevent global conflicts.
92
node[key] = {};
@oliviertassinari
[docs] Improve the state override story (#13919)
Dec 17, 2018
93
}
94
}
95
};
96
@mnajdova
[Theme] Restructure component definitions (#22293)
Aug 24, 2020
97
Object.keys(muiTheme.components).forEach((component) => {
@mnajdova
[Theme] Rename theme keys to defaultProps and styleOverrides (#22347)
Aug 28, 2020
98
const styleOverrides = muiTheme.components[component].styleOverrides;
@mnajdova
[Theme] Restructure component definitions (#22293)
Aug 24, 2020
99
@mnajdova
[Theme] Rename theme keys to defaultProps and styleOverrides (#22347)
Aug 28, 2020
100
if (styleOverrides && component.indexOf('Mui') === 0) {
101
traverse(styleOverrides, component);
@mnajdova
[Theme] Restructure component definitions (#22293)
Aug 24, 2020
102
}
103
});
@oliviertassinari
[docs] Improve the state override story (#13919)
Dec 17, 2018
104
}
105
@oliviertassinari
[theme] Support overriding the shadows key (#8795)
Oct 22, 2017
106
return muiTheme;
@oliviertassinari
[theme] Simplification of the API (#7934)
Aug 28, 2017
107
}
108
109
export default createMuiTheme;