UNPKG

@material-ui/core

Version:

React components that implement Google's Material Design.

100 lines (85 loc) 3.97 kB
import _defineProperty from "@babel/runtime/helpers/esm/defineProperty"; import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties"; import { deepmerge } from '@material-ui/utils'; import createBreakpoints from './createBreakpoints'; import createMixins from './createMixins'; import createPalette from './createPalette'; import createTypography from './createTypography'; import shadows from './shadows'; import shape from './shape'; import createSpacing from './createSpacing'; import transitions from './transitions'; import zIndex from './zIndex'; function createTheme() { var options = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {}; var _options$breakpoints = options.breakpoints, breakpointsInput = _options$breakpoints === void 0 ? {} : _options$breakpoints, _options$mixins = options.mixins, mixinsInput = _options$mixins === void 0 ? {} : _options$mixins, _options$palette = options.palette, paletteInput = _options$palette === void 0 ? {} : _options$palette, spacingInput = options.spacing, _options$typography = options.typography, typographyInput = _options$typography === void 0 ? {} : _options$typography, other = _objectWithoutProperties(options, ["breakpoints", "mixins", "palette", "spacing", "typography"]); var palette = createPalette(paletteInput); var breakpoints = createBreakpoints(breakpointsInput); var spacing = createSpacing(spacingInput); var muiTheme = deepmerge({ breakpoints: breakpoints, direction: 'ltr', mixins: createMixins(breakpoints, spacing, mixinsInput), overrides: {}, // Inject custom styles palette: palette, props: {}, // Provide default props shadows: shadows, typography: createTypography(palette, typographyInput), spacing: spacing, shape: shape, transitions: transitions, zIndex: zIndex }, other); for (var _len = arguments.length, args = new Array(_len > 1 ? _len - 1 : 0), _key = 1; _key < _len; _key++) { args[_key - 1] = arguments[_key]; } muiTheme = args.reduce(function (acc, argument) { return deepmerge(acc, argument); }, muiTheme); if (process.env.NODE_ENV !== 'production') { var pseudoClasses = ['checked', 'disabled', 'error', 'focused', 'focusVisible', 'required', 'expanded', 'selected']; var traverse = function traverse(node, parentKey) { var depth = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : 1; var key; // eslint-disable-next-line guard-for-in, no-restricted-syntax for (key in node) { var child = node[key]; if (depth === 1) { if (key.indexOf('Mui') === 0 && child) { traverse(child, key, depth + 1); } } else if (pseudoClasses.indexOf(key) !== -1 && Object.keys(child).length > 0) { if (process.env.NODE_ENV !== 'production') { console.error(["Material-UI: The `".concat(parentKey, "` component increases ") + "the CSS specificity of the `".concat(key, "` internal state."), 'You can not override it like this: ', JSON.stringify(node, null, 2), '', 'Instead, you need to use the $ruleName syntax:', JSON.stringify({ root: _defineProperty({}, "&$".concat(key), child) }, null, 2), '', 'https://mui.com/r/pseudo-classes-guide'].join('\n')); } // Remove the style to prevent global conflicts. node[key] = {}; } } }; traverse(muiTheme.overrides); } return muiTheme; } var warnedOnce = false; export function createMuiTheme() { if (process.env.NODE_ENV !== 'production') { if (!warnedOnce) { warnedOnce = true; console.error(['Material-UI: the createMuiTheme function was renamed to createTheme.', '', "You should use `import { createTheme } from '@material-ui/core/styles'`"].join('\n')); } } return createTheme.apply(void 0, arguments); } export default createTheme;