zss-engine/dist/esm/utils/transpile-atomic.js

A CSS-in-JS transpiler engine for building zero-runtime stylesheets at build time.

import { applyCssValue, camelToKebabCase, isAtRule } from './helper.js';
import { SHORTHAND_PROPERTIES } from './shorthand.js';
const ALL_LONGHANDS = new Set(Object.values(SHORTHAND_PROPERTIES).flat());
function transpileAtomic(property, value, hash, pseudo) {
    if (typeof value === 'string' || typeof value === 'number') {
        const CSSProp = camelToKebabCase(property);
        const applyValue = applyCssValue(value, CSSProp);
        let selector = `.${hash}`;
        if (ALL_LONGHANDS.has(CSSProp)) {
            selector += ':not(#\\#)';
        }
        if (pseudo) {
            selector += pseudo;
        }
        const atomicRule = `${selector} { ${CSSProp}: ${applyValue}; }`;
        if (isAtRule(property)) {
            return `${property} { ${atomicRule} }`;
        }
        return atomicRule;
    }
    return '';
}
export { transpileAtomic };