alinea/dist/ui/util/Styler.js

[](https://npmjs.org/package/alinea) [](https://packagephobia.com/result?p=alinea)

import "../../chunks/chunk-U5RRZUYZ.js";

// src/ui/util/Styler.tsx
import { forwardRef } from "react";
import { jsx } from "react/jsx-runtime";
var cache = /* @__PURE__ */ new Map();
var variant = (key, selector, states, variants) => {
  const getVariant = (name) => {
    const variant2 = `${key}-${name}`;
    return variants && variants.get(variant2) || variant2;
  };
  const additions = [];
  for (const state of states) {
    if (!state)
      continue;
    if (Array.isArray(state))
      additions.push(...state.map(getVariant));
    else if (typeof state === "object")
      additions.push(
        ...Object.entries(state).map(([cl, active]) => active && cl).filter(Boolean).map((_) => getVariant(_))
      );
    else
      additions.push(getVariant(state));
  }
  return additions.concat(String(selector)).join(" ");
};
var createStyler = (input, value, variants) => {
  Object.defineProperties(input, {
    with: {
      enumerable: false,
      value(...extra) {
        return styler(
          [].concat(extra).concat(value).filter((v) => v).join(" "),
          variants
        );
      }
    },
    mergeProps: {
      enumerable: false,
      value(props) {
        if (!props)
          return this;
        const a = props.class;
        const b = props.className;
        return styler(value, variants).with(a, a != b && b);
      }
    },
    toSelector: {
      enumerable: false,
      value() {
        const joined = String(value).split(" ").join(".");
        if (joined.length > 0)
          return `.${joined}`;
        return "";
      }
    },
    toElement: {
      enumerable: false,
      value(element) {
        return Object.assign(
          // eslint-disable-next-line react/display-name
          forwardRef(({ as: Tag = element, ...props }, ref) => /* @__PURE__ */ jsx(Tag, { ...props, ref, className: this.mergeProps(props)() })),
          { displayName: value }
        );
      }
    },
    toString: {
      value() {
        return String(value);
      }
    }
  });
};
var styler = (selector, variants) => {
  if (!variants && cache.has(selector))
    return cache.get(selector);
  const inst = function(...states) {
    return variant("is", inst, states, variants);
  };
  createStyler(inst, selector, variants);
  cache.set(selector, inst);
  return inst;
};
var fromModule = (styles) => {
  const res = {};
  const variants = /* @__PURE__ */ new Map();
  for (const key of Object.keys(styles)) {
    const parts = key.split("-");
    if (parts[0] === "is")
      variants.set(key, styles[key]);
    let parent = "";
    let target = res;
    parts.forEach((sub) => {
      parent = parent ? `${parent}-${sub}` : sub;
      if (!target[sub])
        target[sub] = styler(styles[parent] || parent, variants);
      target = target[sub];
    });
  }
  return res;
};
export {
  fromModule,
  styler
};