@terrazzo/token-tools/dist/css/lib.js

Various utilities for token types

export function defaultAliasTransform(token) {
    if (!token) {
        throw new Error('Undefined token');
    }
    return `var(${makeCSSVar(token.id)})`;
}
/** Generate shorthand CSS for select token types */
export function generateShorthand({ token, localID, omitTypographyShorthand, }) {
    switch (token.$type) {
        case 'transition': {
            return ['duration', 'delay', 'timing-function']
                .map((p) => makeCSSVar(`${localID}-${p}`, { wrapVar: true }))
                .join(' ');
        }
        case 'typography': {
            if (omitTypographyShorthand) {
                return undefined;
            }
            // oxlint-disable-next-line func-style
            const typeVar = (name) => makeCSSVar(`${localID}-${name}`, { wrapVar: true });
            // Note: typography tokens should have both of these properties, but this is just being defensive
            if ('font-size' in token.$value && 'font-family' in token.$value) {
                let output = '';
                for (const prop of ['font-style', 'font-variant', 'font-weight']) {
                    if (prop in token.$value) {
                        output += ` ${typeVar(prop)}`;
                    }
                }
                let fontSizeVar = typeVar('font-size');
                if ('line-height' in token.$value) {
                    fontSizeVar += `/${typeVar('line-height')}`;
                }
                output += ` ${fontSizeVar}`;
                output += ` ${typeVar('font-family')}`;
                return output.trim();
            }
            break;
        }
    }
}
const CSS_VAR_RE = /(?:(\p{Uppercase_Letter}?[\p{Lowercase_Letter}\p{Number}]+|[\p{Uppercase_Letter}\p{Number}]+|[\u{80}-\u{10FFFF}\p{Number}]+)|.)/u;
/**
 * Generate a valid CSS variable from any string
 * Code by @dfrankland
 */
export function makeCSSVar(name, { prefix, wrapVar = false } = {}) {
    if (typeof name !== 'string') {
        throw new TypeError(`makeCSSVar() Expected string, received ${name}`);
    }
    let property = name.split(CSS_VAR_RE).filter(Boolean).join('-');
    if (prefix && !property.startsWith(`${prefix}-`)) {
        property = `${prefix}-${property}`;
    }
    const finalProperty = `--${property}`.toLocaleLowerCase();
    return wrapVar ? `var(${finalProperty})` : finalProperty;
}
//# sourceMappingURL=lib.js.map