68 lines
No EOL
1.9 KiB
JavaScript
68 lines
No EOL
1.9 KiB
JavaScript
"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; |