@mapcss/preset-typography
Version:
Typography preset for MapCSS
68 lines (67 loc) • 2.35 kB
JavaScript
;
Object.defineProperty(exports, "__esModule", { value: true });
exports.twCustomPropertyInjector = void 0;
const format_js_1 = require("../core/utils/format.js");
const deps_js_1 = require("../deps.js");
exports.twCustomPropertyInjector = {
name: "tw-custom-property-injector",
fn: (root, { variablePrefix }) => {
function customPropertyWith(property) {
return (0, format_js_1.customProperty)(property, variablePrefix);
}
const customPropertyMap = {
"translate-x": 0,
"translate-y": 0,
rotate: 0,
"skew-x": 0,
"skew-y": 0,
"scale-x": 1,
"scale-y": 1,
"scroll-snap-strictness": "proximity",
"ring-inset": " ",
"ring-offset-width": "0px",
"ring-offset-color": "#fff",
"ring-color": "rgb(59 130 246/.5)",
"ring-offset-shadow": "0 0 #0000",
"ring-shadow": "0 0 #0000",
shadow: "0 0 #0000",
"shadow-colored": "0 0 #0000",
blur: " ",
brightness: " ",
contrast: " ",
grayscale: " ",
"hue-rotate": " ",
invert: " ",
saturate: " ",
sepia: " ",
"drop-shadow": " ",
"backdrop-blur": " ",
"backdrop-brightness": " ",
"backdrop-contrast": " ",
"backdrop-grayscale": " ",
"backdrop-hue-rotate": " ",
"backdrop-invert": " ",
"backdrop-opacity": " ",
"backdrop-saturate": " ",
"backdrop-sepia": " ",
};
const declaration = Object.entries(customPropertyMap).reduce((acc, [key, value]) => {
const property = customPropertyWith(key);
const cache = {};
root.walkDecls((decl) => {
if (decl.value.includes(property)) {
cache[property] = value;
return false;
}
});
return { ...acc, ...cache };
}, {});
if (!(0, deps_js_1.isEmptyObject)(declaration)) {
const newRoot = (0, deps_js_1.toAST)({
"*, ::before, ::after": declaration,
});
root.prepend(newRoot);
}
return root;
},
};