@windijs/style/dist/windijsStyle.js

@windijs/style

'use strict';

Object.defineProperty(exports, '__esModule', { value: true });

var core = require('@windijs/core');
var helpers = require('@windijs/helpers');
var shared = require('@windijs/shared');

const funcs = {
    quote: helpers.quote,
    attr: helpers.attr,
    url: helpers.url,
    $var: helpers.$var,
    path: helpers.path,
    hwb: helpers.hwb,
    dropShadow: helpers.dropShadow,
    counters: helpers.counters,
    circle: helpers.circle,
    ellipse: helpers.ellipse,
    inset: helpers.inset,
    polygon: helpers.polygon,
    matrix: helpers.matrix,
    matrix3d: helpers.matrix3d,
    perspective: helpers.perspective,
    rotate: helpers.rotate,
    rotate3d: helpers.rotate3d,
    rotateX: helpers.rotateX,
    rotateY: helpers.rotateY,
    rotateZ: helpers.rotateZ,
    scale: helpers.scale,
    scale3d: helpers.scale3d,
    scaleX: helpers.scaleX,
    scaleY: helpers.scaleY,
    scaleZ: helpers.scaleZ,
    skew: helpers.skew,
    skewX: helpers.skewX,
    skewY: helpers.skewY,
    translate: helpers.translate,
    translate3d: helpers.translate3d,
    translateX: helpers.translateX,
    translateY: helpers.translateY,
    translateZ: helpers.translateZ,
    steps: helpers.steps,
    calc: helpers.calc,
    clamp: helpers.clamp,
    max: helpers.max,
    min: helpers.min,
    abs: helpers.abs,
    sign: helpers.sign,
    blur: helpers.blur,
    brightness: helpers.brightness,
    contrast: helpers.contrast,
    grayscale: helpers.grayscale,
    invert: helpers.invert,
    opacity: helpers.opacity,
    saturate: helpers.saturate,
    sepia: helpers.sepia,
    rgb: helpers.rgb,
    rgba: helpers.rgba,
    hsl: helpers.hsl,
    hsla: helpers.hsla,
    counter: helpers.counter,
    env: helpers.env,
    minmax: helpers.minmax,
    repeat: helpers.repeat,
    hueRotate: helpers.hueRotate,
    fitContent: helpers.fitContent,
    cubicBezier: helpers.cubicBezier,
    linearGradient: helpers.linearGradient,
    radialGradient: helpers.radialGradient,
    conicGradient: helpers.conicGradient,
    repeatingConicGradient: helpers.repeatingConicGradient,
    repeatingLinearGradient: helpers.repeatingLinearGradient,
    repeatingRadialGradient: helpers.repeatingRadialGradient,
};
const units = {
    percent: helpers.percent,
    deg: helpers.deg,
    grad: helpers.grad,
    rad: helpers.rad,
    turn: helpers.turn,
    s: helpers.s,
    ms: helpers.ms,
    fr: helpers.fr,
    $in: helpers.$in,
    dpi: helpers.dpi,
    dpcm: helpers.dpcm,
    dppx: helpers.dppx,
    x: helpers.x,
    px: helpers.px,
    pc: helpers.pc,
    pt: helpers.pt,
    cm: helpers.cm,
    mm: helpers.mm,
    Q: helpers.Q,
    ch: helpers.ch,
    ex: helpers.ex,
    em: helpers.em,
    rem: helpers.rem,
    vw: helpers.vw,
    vh: helpers.vh,
    vmax: helpers.vmax,
    vmin: helpers.vmin,
};
function stylePropertyHandler(cfg = {}) {
    const target = { [helpers.SymbolProxy]: true };
    const build = (prop, value) => {
        const meta = helpers.getMeta();
        if (meta.props.length === 1)
            meta.props.push(value);
        return helpers.css(value === "null" || value === "undefined" ? {} : { [prop]: value }, undefined, meta);
    };
    return {
        type: "style",
        get: prop => new Proxy(target, {
            get(_, value) {
                const meta = helpers.getMeta();
                helpers.resetMeta("style", meta.type, [prop], meta.variants);
                if (shared.hasKey(cfg, prop)) {
                    const cv = cfg[prop];
                    const result = typeof cv === "function" ? cv(value) : core.handleConfig(v => build(prop, v), cv, "css", value);
                    if (result)
                        return result;
                }
                if (value === "var")
                    return (name, defaultValue) => build(prop, funcs.$var(name, defaultValue));
                if (value === "in")
                    return new Proxy(units.$in, { get: (_, v) => build(prop, units.$in[+v].toString()) });
                if (value in funcs)
                    return (...args) => build(prop, funcs[value](...args));
                if (shared.hasKey(units, value))
                    return new Proxy(units[value], { get: (_, v) => build(prop, units[value][v].toString()) });
                return build(prop, value);
            },
        }),
    };
}

const style = core.createUtility("style").use(stylePropertyHandler()).init();

exports.style = style;
exports.stylePropertyHandler = stylePropertyHandler;