28 lines
1.0 KiB
JavaScript
28 lines
1.0 KiB
JavaScript
|
"use strict";
|
||
|
|
|
||
|
|
Object.defineProperty(exports, "__esModule", {
|
||
|
|
value: true
|
||
|
|
});
|
||
|
|
exports.default = createGetCssVar;
|
||
|
|
/**
|
||
|
|
* The benefit of this function is to help developers get CSS var from theme without specifying the whole variable
|
||
|
|
* and they does not need to remember the prefix (defined once).
|
||
|
|
*/
|
||
|
|
function createGetCssVar(prefix = '') {
|
||
|
|
function appendVar(...vars) {
|
||
|
|
if (!vars.length) {
|
||
|
|
return '';
|
||
|
|
}
|
||
|
|
const value = vars[0];
|
||
|
|
if (typeof value === 'string' && !value.match(/(#|\(|\)|(-?(\d*\.)?\d+)(px|em|%|ex|ch|rem|vw|vh|vmin|vmax|cm|mm|in|pt|pc))|^(-?(\d*\.)?\d+)$|(\d+ \d+ \d+)/)) {
|
||
|
|
return `, var(--${prefix ? `${prefix}-` : ''}${value}${appendVar(...vars.slice(1))})`;
|
||
|
|
}
|
||
|
|
return `, ${value}`;
|
||
|
|
}
|
||
|
|
|
||
|
|
// AdditionalVars makes `getCssVar` less strict, so it can be use like this `getCssVar('non-mui-variable')` without type error.
|
||
|
|
const getCssVar = (field, ...fallbacks) => {
|
||
|
|
return `var(--${prefix ? `${prefix}-` : ''}${field}${appendVar(...fallbacks)})`;
|
||
|
|
};
|
||
|
|
return getCssVar;
|
||
|
|
}
|