UNPKG

@mui/material

Version:

Material UI is an open-source React component library that implements Google's Material Design. It's comprehensive and can be used in production out of the box.

68 lines (67 loc) 1.93 kB
"use strict"; var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default; Object.defineProperty(exports, "__esModule", { value: true }); exports.default = void 0; var _excludeVariablesFromRoot = _interopRequireDefault(require("./excludeVariablesFromRoot")); var _default = theme => (colorScheme, css) => { const root = theme.rootSelector || ':root'; const selector = theme.colorSchemeSelector; let rule = selector; if (selector === 'class') { rule = '.%s'; } if (selector === 'data') { rule = '[data-%s]'; } if (selector?.startsWith('data-') && !selector.includes('%s')) { // 'data-mui-color-scheme' -> '[data-mui-color-scheme="%s"]' rule = `[${selector}="%s"]`; } if (theme.defaultColorScheme === colorScheme) { if (colorScheme === 'dark') { const excludedVariables = {}; (0, _excludeVariablesFromRoot.default)(theme.cssVarPrefix).forEach(cssVar => { excludedVariables[cssVar] = css[cssVar]; delete css[cssVar]; }); if (rule === 'media') { return { [root]: css, [`@media (prefers-color-scheme: dark)`]: { [root]: excludedVariables } }; } if (rule) { return { [rule.replace('%s', colorScheme)]: excludedVariables, [`${root}, ${rule.replace('%s', colorScheme)}`]: css }; } return { [root]: { ...css, ...excludedVariables } }; } if (rule && rule !== 'media') { return `${root}, ${rule.replace('%s', String(colorScheme))}`; } } else if (colorScheme) { if (rule === 'media') { return { [`@media (prefers-color-scheme: ${String(colorScheme)})`]: { [root]: css } }; } if (rule) { return rule.replace('%s', String(colorScheme)); } } return root; }; exports.default = _default;