@styleframe/loader 2.2.0 → 2.4.0

package/dist/index.js

@@ -1,165 +1,196 @@
 import { stat, rm, mkdir, writeFile } from "node:fs/promises";
 import path from "node:path";
 import { validateInstanceLicense, getLicenseKeyFromEnv } from "@styleframe/license";
-import { loadConfig, watchConfig } from "c12";
-const N = ["charset", "import", "namespace"], R$1 = ["layer"], D$1 = ({ name: e }) => `[data-theme="${e}"]`, I = ({
+import { watch } from "chokidar";
+import { createJiti } from "jiti";
+import { existsSync } from "node:fs";
+const F$1 = ["charset", "import", "namespace"], L$1 = ["layer"], D = ({ name: e }) => `[data-theme="${e}"]`, x$1 = ({
   name: e,
   value: t,
-  modifiers: n
-}) => `._${[...n, e, t].filter(Boolean).join("\\:")}`, w = ({ name: e }) => e;
-function L(e, t) {
+  modifiers: r
+}) => `._${[...r, e, ...t === "default" ? [] : [t]].filter(Boolean).join("\\:").replace(/[[\].#()%,]/g, "\\$&")}`, w = ({ name: e }) => e.replace(/^\.+|\.+$/g, "").replace(/\.+/g, "--");
+function I$1(e, t) {
   return `@${e}${t ? " " : ""}${t}`;
 }
-const P$1 = /\d/, M$1 = ["-", "_", "/", "."];
-function $$1(e = "") {
-  if (!P$1.test(e))
+const U = /\d/, P$1 = ["-", "_", "/", "."];
+function M(e = "") {
+  if (!U.test(e))
     return e !== e.toLowerCase();
 }
-function U$1(e, t) {
-  const n = M$1, r = [];
+function N(e, t) {
+  const r = P$1, n = [];
   if (!e || typeof e != "string")
-    return r;
-  let c = "", a, i;
-  for (const s of e) {
-    const o = n.includes(s);
-    if (o === true) {
-      r.push(c), c = "", a = void 0;
+    return n;
+  let o = "", s, u;
+  for (const a of e) {
+    const c = r.includes(a);
+    if (c === true) {
+      n.push(o), o = "", s = void 0;
       continue;
     }
-    const u = $$1(s);
-    if (i === false) {
-      if (a === false && u === true) {
-        r.push(c), c = s, a = u;
+    const i = M(a);
+    if (u === false) {
+      if (s === false && i === true) {
+        n.push(o), o = a, s = i;
         continue;
       }
-      if (a === true && u === false && c.length > 1) {
-        const f = c.at(-1);
-        r.push(c.slice(0, Math.max(0, c.length - 1))), c = f + s, a = u;
+      if (s === true && i === false && o.length > 1) {
+        const f = o.at(-1);
+        n.push(o.slice(0, Math.max(0, o.length - 1))), o = f + a, s = i;
         continue;
       }
     }
-    c += s, a = u, i = o;
+    o += a, s = i, u = c;
   }
-  return r.push(c), r;
+  return n.push(o), n;
 }
-function _$1(e, t) {
-  return e ? (Array.isArray(e) ? e : U$1(e)).map((n) => n.toLowerCase()).join("-") : "";
+function k(e) {
+  return e ? e[0].toUpperCase() + e.slice(1) : "";
 }
-function k$1(e) {
+function V$1(e) {
+  return e ? e[0].toLowerCase() + e.slice(1) : "";
+}
+function q$1(e, t) {
+  return e ? (Array.isArray(e) ? e : N(e)).map((r) => k(r)).join("") : "";
+}
+function K(e, t) {
+  return V$1(q$1(e || ""));
+}
+function z$1(e, t) {
+  return e ? (Array.isArray(e) ? e : N(e)).map((r) => r.toLowerCase()).join("-") : "";
+}
+function H(e) {
   return `	${e}`;
 }
-function V(e) {
+function Q$1(e) {
   return e.split(`
-`).map((t) => k$1(t)).join(`
+`).map((t) => H(t)).join(`
 `);
 }
-function x(e) {
-  return _$1(e);
+function J$1(e) {
+  return e === e.toUpperCase();
+}
+function Z$1(e) {
+  return K(e);
+}
+function W$1(e) {
+  return z$1(e);
 }
-function K$1(e) {
-  return x(e);
+function G$1(e) {
+  return W$1(e);
 }
-function B$1(e, t) {
-  return `${e.startsWith("--") ? e : K$1(e)}: ${t};`;
+function O(e, t) {
+  return `${e.startsWith("--") ? e : G$1(e)}: ${t};`;
 }
-function q$1(e) {
+function Y$1(e) {
   return `{${e.length > 0 ? `
-` : ""}${e.map((t) => `${V(`${t}`)}
+` : ""}${e.map((t) => `${Q$1(`${t}`)}
 `).join("")}}`;
 }
-function O$1(e) {
+function E$1(e) {
   return `--${(e.startsWith("--") ? e.slice(2) : e).replace(/[^a-zA-Z0-9_\-\u0080-\uFFFF]/g, "-") || "unknown-variable"}`;
 }
-function z$1(e, t) {
-  return B$1(O$1(e), t);
+function X$1(e, t) {
+  return O(E$1(e), t);
 }
-function H$1(e, t) {
-  return `var(${O$1(e)}${t ? `, ${t}` : ""})`;
+function ee$1(e, t) {
+  return `var(${E$1(e)}${t ? `, ${t}` : ""})`;
 }
-function C$1(e, t) {
-  return `${e} ${q$1(t)}`;
+function R$1(e, t) {
+  return `${e} ${Y$1(t)}`;
 }
-function Q$1(e) {
-  return function(n, r) {
-    return Object.entries(n).map(([c, a]) => B$1(c, e(a, r)));
+function te$1(e) {
+  return function(r, n) {
+    return Object.entries(r).map(([o, s]) => O(o, e(s, n)));
   };
 }
-function E$1(e) {
-  return function(n, r) {
-    const a = (r.variables?.name ?? w)({ name: n.name });
-    return z$1(a, e(n.value, r));
+function B(e) {
+  return function(r, n) {
+    const s = (n.variables?.name ?? w)({ name: r.name });
+    return X$1(s, e(r.value, n));
   };
 }
 function S$1(e) {
-  const t = E$1(e), n = Q$1(e);
-  return function(c, a, i) {
-    const { variables: s, declarations: o, children: u } = a, f = c === ":root", l = (s ?? []).map(
-      (A2) => t(A2, i)
-    ), m2 = n(
-      o ?? {},
-      i
-    ), y = (u ?? []).map(
-      (A2) => e(A2, i)
-    ), d = l.length > 0, h = m2.length > 0, v = y.length > 0;
-    return f ? `${d || h ? C$1(c, [
+  const t = B(e), r = te$1(e);
+  return function(o, s, u) {
+    const { variables: a, declarations: c, children: i } = s, f = o === ":root", l = (a ?? []).map(
+      (A2) => t(A2, u)
+    ), m = r(
+      c ?? {},
+      u
+    ), y = (i ?? []).map(
+      (A2) => e(A2, u)
+    ), p2 = l.length > 0, b = m.length > 0, C2 = y.length > 0;
+    return f ? `${p2 || b ? R$1(o, [
       ...l,
-      ...d && h ? [""] : [],
-      ...m2
-    ]) : ""}${v && (d || h) ? `
+      ...p2 && b ? [""] : [],
+      ...m
+    ]) : ""}${C2 && (p2 || b) ? `
 
 ` : ""}${y.join(`
 
-`)}` : C$1(c, [
+`)}` : R$1(o, [
       ...l,
-      ...d && (v || h) ? [""] : [],
-      ...m2,
-      ...h && v ? [""] : [],
+      ...p2 && (C2 || b) ? [""] : [],
+      ...m,
+      ...b && C2 ? [""] : [],
       ...y.flatMap(
-        (A2, F2) => F2 === y.length - 1 ? [A2] : [A2, ""]
+        (A2, _2) => _2 === y.length - 1 ? [A2] : [A2, ""]
       )
     ]);
   };
 }
-function Z(e) {
+function re$1(e) {
   const t = S$1(e);
-  return function(r, c) {
-    const a = N.includes(r.identifier), i = R$1.includes(
-      r.identifier
-    ), s = Object.keys(r.declarations).length > 0, o = r.variables.length > 0, u = r.children.length > 0, f = L(r.identifier, r.rule);
-    return a || i && !(s || o || u) ? `${f};` : t(f, r, c);
+  return function(n, o) {
+    const s = F$1.includes(n.identifier), u = L$1.includes(
+      n.identifier
+    ), a = Object.keys(n.declarations).length > 0, c = n.variables.length > 0, i = n.children.length > 0, f = I$1(n.identifier, n.rule);
+    return s || u && !(a || c || i) ? `${f};` : t(f, n, o);
   };
 }
-function W$1(e) {
+function ne$1(e) {
+  return function(r, n) {
+    return r.value.map((o) => e(o, n)).join("").trim();
+  };
+}
+function oe(e) {
   return typeof e == "object" && e !== null;
 }
-function b$1(e, t) {
-  return W$1(e) && "type" in e && e.type === t;
+function h(e, t) {
+  return oe(e) && "type" in e && e.type === t;
 }
-function J$1(e) {
-  return b$1(e, "variable");
+function ce$1(e) {
+  return h(e, "variable");
 }
-function G$1(e) {
-  return b$1(e, "reference");
+function ue$1(e) {
+  return h(e, "reference");
 }
-function Y$1(e) {
-  return b$1(e, "selector");
+function v$1(e) {
+  return h(e, "selector");
 }
-function X$1(e) {
-  return b$1(e, "at-rule");
+function ie(e) {
+  return h(e, "at-rule");
 }
-function ee(e) {
-  return b$1(e, "utility");
+function se(e) {
+  return h(e, "utility");
 }
-function te(e) {
-  return b$1(e, "css");
+function ae$1(e) {
+  return h(e, "css");
+}
+function le$1(e) {
+  return h(e, "theme");
 }
-function ne(e) {
-  return b$1(e, "theme");
+function T$1(e) {
+  return h(e, "root");
 }
-function re(e) {
-  return b$1(e, "root");
+function fe$1(e) {
+  return h(e, "recipe");
 }
-function g$1(e) {
+function me$1(e) {
+  return e.charAt(0).toUpperCase() + e.slice(1);
+}
+function g(e) {
   if (e instanceof Buffer)
     return Buffer.from(e);
   const t = e.constructor;
@@ -169,225 +200,262 @@ function g$1(e) {
     e.byteLength / e.BYTES_PER_ELEMENT || 1
   );
 }
-function oe(e) {
+function pe$1(e) {
   if (e = e || {}, e.circular)
-    return ue$1(e);
+    return ye$1(e);
   const t = /* @__PURE__ */ new Map();
-  if (t.set(Date, (i) => new Date(i)), t.set(
+  if (t.set(Date, (u) => new Date(u)), t.set(
     Map,
-    (i, s) => new Map(r(Array.from(i), s))
+    (u, a) => new Map(n(Array.from(u), a))
   ), t.set(
     Set,
-    (i, s) => new Set(r(Array.from(i), s))
+    (u, a) => new Set(n(Array.from(u), a))
   ), e.constructorHandlers)
-    for (const i of e.constructorHandlers)
-      t.set(i[0], i[1]);
-  let n;
-  return e.proto ? a : c;
-  function r(i, s) {
-    const o = Object.keys(i), u = Array.from({ length: o.length });
-    for (let f = 0; f < o.length; f++) {
-      const l = o[f], m2 = i[l];
-      typeof m2 != "object" || m2 === null ? u[l] = m2 : m2.constructor !== Object && (n = t.get(m2.constructor)) ? u[l] = n(m2, s) : ArrayBuffer.isView(m2) ? u[l] = g$1(m2) : u[l] = s(m2);
+    for (const u of e.constructorHandlers)
+      t.set(u[0], u[1]);
+  let r;
+  return e.proto ? s : o;
+  function n(u, a) {
+    const c = Object.keys(u), i = Array.from({ length: c.length });
+    for (let f = 0; f < c.length; f++) {
+      const l = c[f], m = u[l];
+      typeof m != "object" || m === null ? i[l] = m : m.constructor !== Object && (r = t.get(m.constructor)) ? i[l] = r(m, a) : ArrayBuffer.isView(m) ? i[l] = g(m) : i[l] = a(m);
     }
-    return u;
+    return i;
   }
-  function c(i) {
-    if (typeof i != "object" || i === null) return i;
-    if (Array.isArray(i)) return r(i, c);
-    if (i.constructor !== Object && (n = t.get(i.constructor)))
-      return n(i, c);
-    const s = {};
-    for (const o in i) {
-      if (Object.hasOwnProperty.call(i, o) === false) continue;
-      const u = i[o];
-      typeof u != "object" || u === null ? s[o] = u : u.constructor !== Object && (n = t.get(u.constructor)) ? s[o] = n(u, c) : ArrayBuffer.isView(u) ? s[o] = g$1(u) : s[o] = c(u);
+  function o(u) {
+    if (typeof u != "object" || u === null) return u;
+    if (Array.isArray(u)) return n(u, o);
+    if (u.constructor !== Object && (r = t.get(u.constructor)))
+      return r(u, o);
+    const a = {};
+    for (const c in u) {
+      if (Object.hasOwnProperty.call(u, c) === false) continue;
+      const i = u[c];
+      typeof i != "object" || i === null ? a[c] = i : i.constructor !== Object && (r = t.get(i.constructor)) ? a[c] = r(i, o) : ArrayBuffer.isView(i) ? a[c] = g(i) : a[c] = o(i);
     }
-    return s;
-  }
-  function a(i) {
-    if (typeof i != "object" || i === null) return i;
-    if (Array.isArray(i)) return r(i, a);
-    if (i.constructor !== Object && (n = t.get(i.constructor)))
-      return n(i, a);
-    const s = {};
-    for (const o in i) {
-      const u = i[o];
-      typeof u != "object" || u === null ? s[o] = u : u.constructor !== Object && (n = t.get(u.constructor)) ? s[o] = n(u, a) : ArrayBuffer.isView(u) ? s[o] = g$1(u) : s[o] = a(u);
+    return a;
+  }
+  function s(u) {
+    if (typeof u != "object" || u === null) return u;
+    if (Array.isArray(u)) return n(u, s);
+    if (u.constructor !== Object && (r = t.get(u.constructor)))
+      return r(u, s);
+    const a = {};
+    for (const c in u) {
+      const i = u[c];
+      typeof i != "object" || i === null ? a[c] = i : i.constructor !== Object && (r = t.get(i.constructor)) ? a[c] = r(i, s) : ArrayBuffer.isView(i) ? a[c] = g(i) : a[c] = s(i);
     }
-    return s;
+    return a;
   }
 }
-function ue$1(e) {
-  const t = [], n = [], r = /* @__PURE__ */ new Map();
-  if (r.set(Date, (o) => new Date(o)), r.set(
+function ye$1(e) {
+  const t = [], r = [], n = /* @__PURE__ */ new Map();
+  if (n.set(Date, (c) => new Date(c)), n.set(
     Map,
-    (o, u) => new Map(a(Array.from(o), u))
-  ), r.set(
+    (c, i) => new Map(s(Array.from(c), i))
+  ), n.set(
     Set,
-    (o, u) => new Set(a(Array.from(o), u))
+    (c, i) => new Set(s(Array.from(c), i))
   ), e.constructorHandlers)
-    for (const o of e.constructorHandlers)
-      r.set(o[0], o[1]);
-  let c;
-  return e.proto ? s : i;
-  function a(o, u) {
-    const f = Object.keys(o), l = Array.from({ length: f.length });
-    for (let m2 = 0; m2 < f.length; m2++) {
-      const y = f[m2], d = o[y];
-      if (typeof d != "object" || d === null)
-        l[y] = d;
-      else if (d.constructor !== Object && (c = r.get(d.constructor)))
-        l[y] = c(d, u);
-      else if (ArrayBuffer.isView(d))
-        l[y] = g$1(d);
+    for (const c of e.constructorHandlers)
+      n.set(c[0], c[1]);
+  let o;
+  return e.proto ? a : u;
+  function s(c, i) {
+    const f = Object.keys(c), l = Array.from({ length: f.length });
+    for (let m = 0; m < f.length; m++) {
+      const y = f[m], p2 = c[y];
+      if (typeof p2 != "object" || p2 === null)
+        l[y] = p2;
+      else if (p2.constructor !== Object && (o = n.get(p2.constructor)))
+        l[y] = o(p2, i);
+      else if (ArrayBuffer.isView(p2))
+        l[y] = g(p2);
       else {
-        const h = t.indexOf(d);
-        h !== -1 ? l[y] = n[h] : l[y] = u(d);
+        const b = t.indexOf(p2);
+        b !== -1 ? l[y] = r[b] : l[y] = i(p2);
       }
     }
     return l;
   }
-  function i(o) {
-    if (typeof o != "object" || o === null) return o;
-    if (Array.isArray(o)) return a(o, i);
-    if (o.constructor !== Object && (c = r.get(o.constructor)))
-      return c(o, i);
-    const u = {};
-    t.push(o), n.push(u);
-    for (const f in o) {
-      if (Object.hasOwnProperty.call(o, f) === false) continue;
-      const l = o[f];
+  function u(c) {
+    if (typeof c != "object" || c === null) return c;
+    if (Array.isArray(c)) return s(c, u);
+    if (c.constructor !== Object && (o = n.get(c.constructor)))
+      return o(c, u);
+    const i = {};
+    t.push(c), r.push(i);
+    for (const f in c) {
+      if (Object.hasOwnProperty.call(c, f) === false) continue;
+      const l = c[f];
       if (typeof l != "object" || l === null)
-        u[f] = l;
-      else if (l.constructor !== Object && (c = r.get(l.constructor)))
-        u[f] = c(l, i);
+        i[f] = l;
+      else if (l.constructor !== Object && (o = n.get(l.constructor)))
+        i[f] = o(l, u);
       else if (ArrayBuffer.isView(l))
-        u[f] = g$1(l);
+        i[f] = g(l);
       else {
-        const m2 = t.indexOf(l);
-        m2 !== -1 ? u[f] = n[m2] : u[f] = i(l);
+        const m = t.indexOf(l);
+        m !== -1 ? i[f] = r[m] : i[f] = u(l);
       }
     }
-    return t.pop(), n.pop(), u;
+    return t.pop(), r.pop(), i;
   }
-  function s(o) {
-    if (typeof o != "object" || o === null) return o;
-    if (Array.isArray(o)) return a(o, s);
-    if (o.constructor !== Object && (c = r.get(o.constructor)))
-      return c(o, s);
-    const u = {};
-    t.push(o), n.push(u);
-    for (const f in o) {
-      const l = o[f];
+  function a(c) {
+    if (typeof c != "object" || c === null) return c;
+    if (Array.isArray(c)) return s(c, a);
+    if (c.constructor !== Object && (o = n.get(c.constructor)))
+      return o(c, a);
+    const i = {};
+    t.push(c), r.push(i);
+    for (const f in c) {
+      const l = c[f];
       if (typeof l != "object" || l === null)
-        u[f] = l;
-      else if (l.constructor !== Object && (c = r.get(l.constructor)))
-        u[f] = c(l, s);
+        i[f] = l;
+      else if (l.constructor !== Object && (o = n.get(l.constructor)))
+        i[f] = o(l, a);
       else if (ArrayBuffer.isView(l))
-        u[f] = g$1(l);
+        i[f] = g(l);
       else {
-        const m2 = t.indexOf(l);
-        m2 !== -1 ? u[f] = n[m2] : u[f] = s(l);
+        const m = t.indexOf(l);
+        m !== -1 ? i[f] = r[m] : i[f] = a(l);
       }
     }
-    return t.pop(), n.pop(), u;
+    return t.pop(), r.pop(), i;
   }
 }
-oe();
-function ce(e) {
-  return function(n, r) {
-    return n.value.map((c) => e(c, r)).join("").trim();
-  };
-}
-function ie(e) {
-  return function(n, r) {
-    return n != null ? `${n}` : "";
+pe$1();
+function de$1(e) {
+  return function(r, n) {
+    return r != null ? `${r}` : "";
   };
 }
-function se(e) {
-  return function(n, r) {
-    const a = (r.variables?.name ?? w)({ name: n.name });
-    return H$1(
-      a,
-      n.fallback ? e(n.fallback, r) : void 0
+function he(e) {
+  return function(r, n) {
+    const s = (n.variables?.name ?? w)({ name: r.name });
+    return ee$1(
+      s,
+      r.fallback ? e(r.fallback, n) : void 0
     );
   };
 }
-function ae(e) {
+function be$1(e) {
   const t = S$1(e);
-  return function(r, c) {
-    return r.themes.reduce(
-      (a, i) => (a.push(e(i, c)), a),
-      [t(":root", r, c)]
+  return function(n, o) {
+    return n.themes.reduce(
+      (s, u) => (s.push(e(u, o)), s),
+      [t(":root", n, o)]
       // Default theme (root)
     ).join(`
 
 `);
   };
 }
-function le(e) {
+function Ae$1(e) {
   const t = S$1(e);
-  return function(r, c) {
-    return t(r.query, r, c);
+  return function(n, o) {
+    return t(n.query, n, o);
   };
 }
-function fe(e) {
+function ge(e) {
   const t = S$1(e);
-  return function(r, c) {
-    const i = (c.theme?.selector ?? D$1)({ name: r.name });
-    return t(i, r, c);
+  return function(n, o) {
+    const u = (o.themes?.selector ?? D)({ name: n.name });
+    return t(u, n, o);
   };
 }
-function me(e) {
+function Se(e) {
   const t = S$1(e);
-  return function(r, c) {
-    const a = [], s = (c.utilities?.selector ?? I)({
-      name: r.name,
-      value: r.value,
-      modifiers: r.modifiers
+  return function(n, o) {
+    const s = [], a = (o.utilities?.selector ?? x$1)({
+      name: n.name,
+      value: n.value,
+      modifiers: n.modifiers
     });
-    return a.push(t(s, r, c)), a.join(`
+    return s.push(t(a, n, o)), s.join(`
 
 `);
   };
 }
-function p$1(e, t) {
-  const n = ae(p$1), r = le(p$1), c = me(p$1), a = Z(p$1), i = fe(p$1), s = E$1(p$1), o = se(p$1), u = ce(p$1), f = ie();
+function d(e, t) {
+  const r = be$1(d), n = Ae$1(d), o = Se(d), s = re$1(d), u = ge(d), a = B(d), c = he(d), i = ne$1(d), f = de$1();
   switch (true) {
-    case Y$1(e):
-      return r(e, t);
-    case ee(e):
-      return c(e, t);
-    case X$1(e):
-      return a(e, t);
-    case re(e):
+    case v$1(e):
       return n(e, t);
-    case ne(e):
-      return i(e, t);
-    case J$1(e):
-      return s(e, t);
-    case G$1(e):
+    case se(e):
       return o(e, t);
-    case te(e):
+    case ie(e):
+      return s(e, t);
+    case T$1(e):
+      return r(e, t);
+    case le$1(e):
       return u(e, t);
+    case ce$1(e):
+      return a(e, t);
+    case ue$1(e):
+      return c(e, t);
+    case ae$1(e):
+      return i(e, t);
     default:
       return f(e, t);
   }
 }
-function T$1(e, t) {
+function Ce(e) {
+  return function(r, n) {
+    let o = r._exportName;
+    o || (o = Z$1(r.name), r.name[0] && J$1(r.name[0]) && (o = me$1(o)));
+    const s = `${o}Recipe`, u = r._runtime ?? {};
+    return `const ${s} = ${JSON.stringify(
+      u,
+      null,
+      4
+    )} as const satisfies RecipeRuntime;
+
+export const ${o} = createRecipe("${r.name}", ${s});
+`;
+  };
+}
+function je(e) {
+  return e.filter(
+    (t) => v$1(t) && !!t._exportName
+  );
+}
+function ve(e) {
+  return function(r, n) {
+    const o = je(r.children), s = r.recipes.length > 0, u = o.length > 0;
+    if (!s && !u)
+      return "";
+    const a = [];
+    return s && (a.push(`import { createRecipe } from '@styleframe/runtime';
+import type { RecipeRuntime } from '@styleframe/runtime';
+`), a.push(e(r.recipes, n))), u && a.push(e(o, n)), a.join(`
+`);
+  };
+}
+function Re$1(e) {
+  return function(r, n) {
+    return r._exportName ? `export const ${r._exportName} = ${JSON.stringify(r.query)};
+` : "";
+  };
+}
+function j$1(e, t) {
+  const r = ve(j$1), n = Ce(), o = Re$1();
   switch (true) {
     case Array.isArray(e):
-      return e.map((n) => T$1(n)).join(`
+      return e.map((s) => j$1(s, t)).join(`
 `);
-    // case isRecipe(instance):
-    // 	return consumeRecipe(instance, options);
-    // 	break;
+    case T$1(e):
+      return r(e, t);
+    case fe$1(e):
+      return n(e, t);
+    case v$1(e):
+      return o(e, t);
     default:
       return "";
   }
 }
-const de = `-----BEGIN PUBLIC KEY-----
+const $e = `-----BEGIN PUBLIC KEY-----
 MIIBIjANBgkqhkiG9w0BAQEFAAOCAQ8AMIIBCgKCAQEAs7zAFssgxOMPeo80iig4
 qSSshgNOLnW1gd4tPUrsezndaUrAKlsAys6XD8kuF+bBEIR0uFNSgKlqINLjWM1n
 BiTUzCctodyRaq6/tyFSoPLD35iblkwtfxKPM42lAJZsyTu9qoBr8MJyXmhDLuqA
@@ -395,12 +463,12 @@ dQ8di7mQHz+mCy96jQR4lFSDfHMgl27qaAh5VboTBRxgZliN8D5Fl590QkS94wAj
 hC7NbH+hPcGc/qIaZSjZfyZeBIZS74qJkrzjEA7/pukROD8UQUrQ512HHZ6XlgMn
 4bWT2K9CpWbbhsKFTecCHuxlmPkFJNMuvAb/LdP08BSnpntlyAJcQeBrna2qBen+
 GwIDAQAB
------END PUBLIC KEY-----`, ye = "__licenseRequired", pe = "__licenseValidated";
-async function he(e) {
-  const t = e.replace(/-----BEGIN PUBLIC KEY-----/, "").replace(/-----END PUBLIC KEY-----/, "").replace(/\s/g, ""), n = Uint8Array.from(atob(t), (r) => r.charCodeAt(0));
+-----END PUBLIC KEY-----`, we = "__licenseRequired", Ne = "__licenseValidated";
+async function Oe(e) {
+  const t = e.replace(/-----BEGIN PUBLIC KEY-----/, "").replace(/-----END PUBLIC KEY-----/, "").replace(/\s/g, ""), r = Uint8Array.from(atob(t), (n) => n.charCodeAt(0));
   return await crypto.subtle.importKey(
     "spki",
-    n,
+    r,
     {
       name: "RSASSA-PKCS1-v1_5",
       hash: "SHA-256"
@@ -409,32 +477,32 @@ async function he(e) {
     ["verify"]
   );
 }
-async function be({
+async function Ee({
   payload: e,
   signature: t
 }) {
-  const n = new TextEncoder().encode(e), r = Uint8Array.from(
+  const r = new TextEncoder().encode(e), n = Uint8Array.from(
     atob(t),
-    (a) => a.charCodeAt(0)
-  ), c = await he(de);
+    (s) => s.charCodeAt(0)
+  ), o = await Oe($e);
   if (!await crypto.subtle.verify(
     { name: "RSASSA-PKCS1-v1_5" },
-    c,
-    r,
-    n
+    o,
+    n,
+    r
   ))
     throw new Error(
       "License validation failed: Invalid signature detected. The license may have been modified or corrupted."
     );
   return JSON.parse(e);
 }
-function Ae(e) {
-  return Object.prototype.hasOwnProperty.call(e, ye);
+function Be(e) {
+  return Object.prototype.hasOwnProperty.call(e, we);
 }
-async function ge(e) {
+async function Te(e) {
   const t = Object.getOwnPropertyDescriptor(
     e,
-    pe
+    Ne
   );
   if (!t?.value)
     return {
@@ -443,8 +511,8 @@ async function ge(e) {
       environment: "",
       valid: false
     };
-  const n = t.value;
-  if (typeof n != "object" || n === null || !("payload" in n) || !("signature" in n) || typeof n.payload != "string" || typeof n.signature != "string")
+  const r = t.value;
+  if (typeof r != "object" || r === null || !("payload" in r) || !("signature" in r) || typeof r.payload != "string" || typeof r.signature != "string")
     return {
       key: "",
       instanceId: "",
@@ -452,8 +520,8 @@ async function ge(e) {
       valid: false
     };
   try {
-    return await be(
-      n
+    return await Ee(
+      r
     );
   } catch {
     return {
@@ -464,7 +532,7 @@ async function ge(e) {
     };
   }
 }
-function Se(e) {
+function _e(e) {
   const t = Math.floor(Math.random() * 100);
   e.root.children.push({
     type: "selector",
@@ -488,31 +556,36 @@ function Se(e) {
     }
   });
 }
-function j(e, t = "") {
+function $$1(e, t = "") {
   return {
     name: e,
     content: t
   };
 }
-async function Ce(e, {
+async function Le(e, {
   type: t = "all",
-  consumers: n = { css: p$1, ts: T$1 }
+  consumers: r = { css: d, ts: j$1 }
 } = {}) {
-  const r = { files: [] }, c = e.options;
-  if (Ae(e)) {
-    const s = await ge(e);
-    (!s.valid || s.instanceId !== e.id) && Se(e);
+  const n = { files: [] }, o = e.options;
+  if (Be(e)) {
+    const s = await Te(e);
+    (!s.valid || s.instanceId !== e.id) && _e(e);
   }
-  const { recipes: a, ...i } = e.root;
   if (t === "all" || t === "css") {
-    const s = j("index.css", n.css(i, c));
-    r.files.push(s);
+    const s = $$1(
+      "index.css",
+      r.css(e.root, o)
+    );
+    n.files.push(s);
   }
   if (t === "all" || t === "ts") {
-    const s = j("index.ts", n.ts([], c));
-    r.files.push(s);
+    const s = $$1(
+      "index.ts",
+      r.ts(e.root, o)
+    );
+    n.files.push(s);
   }
-  return r;
+  return n;
 }
 async function directoryExists(path2) {
   try {
@@ -528,7 +601,7 @@ async function build(instance, { clean = true, outputDir = "./styleframe", trans
     environment: process.env.NODE_ENV || "development",
     isBuild: true
   });
-  const output = await Ce(instance, transpiler);
+  const output = await Le(instance, transpiler);
   const outputDirExists = await directoryExists(outputDir);
   if (clean && outputDirExists) {
     await rm(outputDir, { recursive: true });
@@ -543,40 +616,64 @@ async function build(instance, { clean = true, outputDir = "./styleframe", trans
     await writeFile(filePath, file.content);
   }
 }
-function k(e, r) {
-  return function(t, ...i) {
-    return {
-      type: "css",
-      value: t.reduce((o, u, c) => (o.push(u), c < i.length && o.push(i[c]), o), [])
-    };
-  };
-}
-function M(e) {
+function S(e) {
   return typeof e == "object" && e !== null;
 }
 function p(e, r) {
-  return M(e) && "type" in e && e.type === r;
+  return S(e) && "type" in e && e.type === r;
 }
-function B(e) {
+function L(e) {
   return p(e, "variable");
 }
-function F(e) {
+function A(e) {
   return p(e, "reference");
 }
-function T(e) {
+function be(e) {
+  return p(e, "selector");
+}
+function q(e) {
+  return p(e, "modifier");
+}
+function E(e) {
   return p(e, "css");
 }
-function _(e) {
+function Ae(e) {
+  return p(e, "recipe");
+}
+function G(e) {
   return typeof e == "string" || typeof e == "number" || typeof e == "boolean" || e === null;
 }
-function O(e) {
-  return _(e) || F(e) || T(e) || Array.isArray(e) && e.every(O);
+function $(e) {
+  return G(e) || A(e) || E(e) || Array.isArray(e) && e.every($);
+}
+function I(e) {
+  return S(e) && "children" in e && "declarations" in e && "variables" in e;
+}
+function z(e = (r) => r) {
+  return (r) => {
+    let n = r, t;
+    if (typeof n == "string" && n[0] === "@") {
+      const i = n.slice(1);
+      t = e(i), n = {
+        type: "reference",
+        name: i
+      };
+    } else A(n) ? t = e(n.name) : t = `[${r}]`;
+    return {
+      [t]: n
+    };
+  };
 }
-function C(e) {
-  return M(e) && "children" in e && "declarations" in e && "variables" in e;
+function W(e, r) {
+  return function(t, ...i) {
+    return {
+      type: "css",
+      value: t.reduce((o, u, s) => (o.push(u), s < i.length && o.push(i[s]), o), [])
+    };
+  };
 }
-function R(e, r) {
-  return function(t, i, s) {
+function C(e, r) {
+  return function(t, i, c) {
     const o = {
       type: "at-rule",
       identifier: t,
@@ -584,25 +681,25 @@ function R(e, r) {
       declarations: {},
       variables: [],
       children: []
-    }, u = b(o, r);
-    return typeof s == "function" ? o.declarations = s(u) ?? {} : s && (o.declarations = s), g(o.declarations, u), e.children.push(o), o;
+    }, u = v(o, r);
+    return typeof c == "function" ? o.declarations = c(u) ?? {} : c && (o.declarations = c), V(o.declarations, u), e.children.push(o), o;
   };
 }
-function S(e, r) {
-  const n = R(e, r);
-  return function(i, s) {
-    return n("media", i, s);
+function Y(e, r) {
+  const n = C(e, r);
+  return function(i, c) {
+    return n("media", i, c);
   };
 }
-function E(e, r) {
-  const n = R(e, r);
-  return function(i, s) {
-    return n("keyframes", i, s);
+function Z(e, r) {
+  const n = C(e, r);
+  return function(i, c) {
+    return n("keyframes", i, c);
   };
 }
-function P(e, r) {
+function J(e, r) {
   return function(t, i) {
-    return B(t) ? {
+    return L(t) ? {
       type: "reference",
       name: t.name,
       fallback: i
@@ -613,56 +710,56 @@ function P(e, r) {
     };
   };
 }
-function D(e, r) {
+function Q(e, r) {
   return function(t, i) {
-    const s = {
+    const c = {
       type: "selector",
       query: t,
       declarations: {},
       variables: [],
       children: []
-    }, o = b(s, r);
-    return typeof i == "function" ? s.declarations = i(o) ?? {} : C(i) ? (s.variables = i.variables, s.declarations = i.declarations, s.children = i.children) : s.declarations = i, g(s.declarations, o), e.children.push(s), s;
+    }, o = v(c, r);
+    return typeof i == "function" ? c.declarations = i(o) ?? {} : I(i) ? (c.variables = i.variables, c.declarations = i.declarations, c.children = i.children) : c.declarations = i, V(c.declarations, o), e.children.push(c), c;
   };
 }
-function H(e, r) {
-  return function(t, i, s = {
+function X(e, r) {
+  return function(t, i, c = {
     default: false
   }) {
     const o = typeof t == "string" ? t : t.name, u = e.variables.find(
       (f) => f.name === o
     );
-    if (s.default && u)
+    if (c.default && u)
       return u;
     if (u)
       return u.value = i, u;
-    const c = {
+    const s = {
       type: "variable",
       name: o,
       value: i
     };
-    return e.variables.push(c), c;
+    return e.variables.push(s), s;
   };
 }
-function b(e, r) {
-  const n = H(e), t = D(e, r), i = R(e, r), s = E(r, r), o = S(e, r), u = P(), c = k();
+function v(e, r) {
+  const n = X(e), t = Q(e, r), i = C(e, r), c = Z(r, r), o = Y(e, r), u = J(), s = W();
   return {
     variable: n,
     selector: t,
-    keyframes: s,
+    keyframes: c,
     atRule: i,
     media: o,
     ref: u,
-    css: c
+    css: s
   };
 }
-function g(e, r) {
+function V(e, r) {
   for (const n in e)
     if (n.startsWith("@")) {
       const t = e[n];
-      if (typeof t == "object" && t !== null && !O(t)) {
-        const i = n.replace(/^@(\w+).*/, "$1"), s = n.replace(`@${i}`, "").trim();
-        r.atRule(i, s, t), delete e[n];
+      if (typeof t == "object" && t !== null && !$(t)) {
+        const i = n.replace(/^@(\w+).*/, "$1"), c = n.replace(`@${i}`, "").trim();
+        r.atRule(i, c, t), delete e[n];
       }
     } else if (/^[.&:]/.test(n)) {
       const t = e[n];
@@ -670,7 +767,7 @@ function g(e, r) {
     }
   return e;
 }
-function m(e) {
+function j(e) {
   if (e instanceof Buffer)
     return Buffer.from(e);
   const r = e.constructor;
@@ -680,9 +777,9 @@ function m(e) {
     e.byteLength / e.BYTES_PER_ELEMENT || 1
   );
 }
-function K(e) {
+function ee(e) {
   if (e = e || {}, e.circular)
-    return U(e);
+    return te(e);
   const r = /* @__PURE__ */ new Map();
   if (r.set(Date, (o) => new Date(o)), r.set(
     Map,
@@ -694,12 +791,12 @@ function K(e) {
     for (const o of e.constructorHandlers)
       r.set(o[0], o[1]);
   let n;
-  return e.proto ? s : i;
+  return e.proto ? c : i;
   function t(o, u) {
-    const c = Object.keys(o), f = Array.from({ length: c.length });
-    for (let a = 0; a < c.length; a++) {
-      const l = c[a], y = o[l];
-      typeof y != "object" || y === null ? f[l] = y : y.constructor !== Object && (n = r.get(y.constructor)) ? f[l] = n(y, u) : ArrayBuffer.isView(y) ? f[l] = m(y) : f[l] = u(y);
+    const s = Object.keys(o), f = Array.from({ length: s.length });
+    for (let l = 0; l < s.length; l++) {
+      const a = s[l], y = o[a];
+      typeof y != "object" || y === null ? f[a] = y : y.constructor !== Object && (n = r.get(y.constructor)) ? f[a] = n(y, u) : ArrayBuffer.isView(y) ? f[a] = j(y) : f[a] = u(y);
     }
     return f;
   }
@@ -709,153 +806,161 @@ function K(e) {
     if (o.constructor !== Object && (n = r.get(o.constructor)))
       return n(o, i);
     const u = {};
-    for (const c in o) {
-      if (Object.hasOwnProperty.call(o, c) === false) continue;
-      const f = o[c];
-      typeof f != "object" || f === null ? u[c] = f : f.constructor !== Object && (n = r.get(f.constructor)) ? u[c] = n(f, i) : ArrayBuffer.isView(f) ? u[c] = m(f) : u[c] = i(f);
+    for (const s in o) {
+      if (Object.hasOwnProperty.call(o, s) === false) continue;
+      const f = o[s];
+      typeof f != "object" || f === null ? u[s] = f : f.constructor !== Object && (n = r.get(f.constructor)) ? u[s] = n(f, i) : ArrayBuffer.isView(f) ? u[s] = j(f) : u[s] = i(f);
     }
     return u;
   }
-  function s(o) {
+  function c(o) {
     if (typeof o != "object" || o === null) return o;
-    if (Array.isArray(o)) return t(o, s);
+    if (Array.isArray(o)) return t(o, c);
     if (o.constructor !== Object && (n = r.get(o.constructor)))
-      return n(o, s);
+      return n(o, c);
     const u = {};
-    for (const c in o) {
-      const f = o[c];
-      typeof f != "object" || f === null ? u[c] = f : f.constructor !== Object && (n = r.get(f.constructor)) ? u[c] = n(f, s) : ArrayBuffer.isView(f) ? u[c] = m(f) : u[c] = s(f);
+    for (const s in o) {
+      const f = o[s];
+      typeof f != "object" || f === null ? u[s] = f : f.constructor !== Object && (n = r.get(f.constructor)) ? u[s] = n(f, c) : ArrayBuffer.isView(f) ? u[s] = j(f) : u[s] = c(f);
     }
     return u;
   }
 }
-function U(e) {
+function te(e) {
   const r = [], n = [], t = /* @__PURE__ */ new Map();
-  if (t.set(Date, (c) => new Date(c)), t.set(
+  if (t.set(Date, (s) => new Date(s)), t.set(
     Map,
-    (c, f) => new Map(s(Array.from(c), f))
+    (s, f) => new Map(c(Array.from(s), f))
   ), t.set(
     Set,
-    (c, f) => new Set(s(Array.from(c), f))
+    (s, f) => new Set(c(Array.from(s), f))
   ), e.constructorHandlers)
-    for (const c of e.constructorHandlers)
-      t.set(c[0], c[1]);
+    for (const s of e.constructorHandlers)
+      t.set(s[0], s[1]);
   let i;
   return e.proto ? u : o;
-  function s(c, f) {
-    const a = Object.keys(c), l = Array.from({ length: a.length });
-    for (let y = 0; y < a.length; y++) {
-      const h = a[y], d = c[h];
-      if (typeof d != "object" || d === null)
-        l[h] = d;
-      else if (d.constructor !== Object && (i = t.get(d.constructor)))
-        l[h] = i(d, f);
-      else if (ArrayBuffer.isView(d))
-        l[h] = m(d);
+  function c(s, f) {
+    const l = Object.keys(s), a = Array.from({ length: l.length });
+    for (let y = 0; y < l.length; y++) {
+      const m = l[y], d2 = s[m];
+      if (typeof d2 != "object" || d2 === null)
+        a[m] = d2;
+      else if (d2.constructor !== Object && (i = t.get(d2.constructor)))
+        a[m] = i(d2, f);
+      else if (ArrayBuffer.isView(d2))
+        a[m] = j(d2);
       else {
-        const v = r.indexOf(d);
-        v !== -1 ? l[h] = n[v] : l[h] = f(d);
+        const h2 = r.indexOf(d2);
+        h2 !== -1 ? a[m] = n[h2] : a[m] = f(d2);
       }
     }
-    return l;
+    return a;
   }
-  function o(c) {
-    if (typeof c != "object" || c === null) return c;
-    if (Array.isArray(c)) return s(c, o);
-    if (c.constructor !== Object && (i = t.get(c.constructor)))
-      return i(c, o);
+  function o(s) {
+    if (typeof s != "object" || s === null) return s;
+    if (Array.isArray(s)) return c(s, o);
+    if (s.constructor !== Object && (i = t.get(s.constructor)))
+      return i(s, o);
     const f = {};
-    r.push(c), n.push(f);
-    for (const a in c) {
-      if (Object.hasOwnProperty.call(c, a) === false) continue;
-      const l = c[a];
-      if (typeof l != "object" || l === null)
-        f[a] = l;
-      else if (l.constructor !== Object && (i = t.get(l.constructor)))
-        f[a] = i(l, o);
-      else if (ArrayBuffer.isView(l))
-        f[a] = m(l);
+    r.push(s), n.push(f);
+    for (const l in s) {
+      if (Object.hasOwnProperty.call(s, l) === false) continue;
+      const a = s[l];
+      if (typeof a != "object" || a === null)
+        f[l] = a;
+      else if (a.constructor !== Object && (i = t.get(a.constructor)))
+        f[l] = i(a, o);
+      else if (ArrayBuffer.isView(a))
+        f[l] = j(a);
       else {
-        const y = r.indexOf(l);
-        y !== -1 ? f[a] = n[y] : f[a] = o(l);
+        const y = r.indexOf(a);
+        y !== -1 ? f[l] = n[y] : f[l] = o(a);
       }
     }
     return r.pop(), n.pop(), f;
   }
-  function u(c) {
-    if (typeof c != "object" || c === null) return c;
-    if (Array.isArray(c)) return s(c, u);
-    if (c.constructor !== Object && (i = t.get(c.constructor)))
-      return i(c, u);
+  function u(s) {
+    if (typeof s != "object" || s === null) return s;
+    if (Array.isArray(s)) return c(s, u);
+    if (s.constructor !== Object && (i = t.get(s.constructor)))
+      return i(s, u);
     const f = {};
-    r.push(c), n.push(f);
-    for (const a in c) {
-      const l = c[a];
-      if (typeof l != "object" || l === null)
-        f[a] = l;
-      else if (l.constructor !== Object && (i = t.get(l.constructor)))
-        f[a] = i(l, u);
-      else if (ArrayBuffer.isView(l))
-        f[a] = m(l);
+    r.push(s), n.push(f);
+    for (const l in s) {
+      const a = s[l];
+      if (typeof a != "object" || a === null)
+        f[l] = a;
+      else if (a.constructor !== Object && (i = t.get(a.constructor)))
+        f[l] = i(a, u);
+      else if (ArrayBuffer.isView(a))
+        f[l] = j(a);
       else {
-        const y = r.indexOf(l);
-        y !== -1 ? f[a] = n[y] : f[a] = u(l);
+        const y = r.indexOf(a);
+        y !== -1 ? f[l] = n[y] : f[l] = u(a);
       }
     }
     return r.pop(), n.pop(), f;
   }
 }
-const A = K();
-function $(e, r = 8) {
+const R = ee();
+function ne(e, r = 8) {
   const n = "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789";
   let t = "";
   for (let i = 0; i < r; i++) {
-    const s = Math.floor(Math.random() * n.length);
-    t += n[s];
+    const c = Math.floor(Math.random() * n.length);
+    t += n[c];
   }
   return e ? `${e}${t}` : t;
 }
-function q(e) {
+function re(e, r) {
+  const n = e.modifiers.find(
+    (t) => t.key.includes(r)
+  );
+  if (!n)
+    throw new Error(`Modifier "${r}" not found`);
+  return n;
+}
+function ce(e) {
   const r = [];
   function n(t, i) {
     i.length > 0 && r.push([...i].sort());
-    for (let s = t; s < e.length; s++) {
-      const o = e[s];
+    for (let c = t; c < e.length; c++) {
+      const o = e[c];
       if (o)
         if (o.length === 1 && o[0])
-          n(s + 1, [...i, o[0]]);
+          n(c + 1, [...i, o[0]]);
         else
           for (const u of o)
-            n(s + 1, [...i, u]);
+            n(c + 1, [...i, u]);
     }
   }
   return n(0, []), r.sort((t, i) => t.length !== i.length ? t.length - i.length : t.join(",").localeCompare(i.join(",")));
 }
-function z(e, r, n) {
+function fe(e, r, n) {
   const t = {
     ...e,
     modifiers: [...n.keys()]
-  }, i = b(t, r);
-  for (const s of n.values())
-    s.factory({
+  }, i = v(t, r);
+  for (const c of n.values())
+    c.factory({
       ...i,
-      declarations: A(t.declarations),
-      variables: A(t.variables),
-      children: A(t.children)
-    }), g(t.declarations, i);
+      declarations: R(t.declarations),
+      variables: R(t.variables),
+      children: R(t.children)
+    }), V(t.declarations, i);
   return t;
 }
-function W(e, r) {
+function ue(e, r) {
   return function(t, i) {
-    const s = {
+    const c = {
       type: "modifier",
       key: Array.isArray(t) ? t : [t],
       factory: i
     };
-    return r.modifiers.push(s), s;
+    return r.modifiers.push(c), c;
   };
 }
-function Y() {
+function ae() {
   return {
     type: "root",
     declarations: {},
@@ -867,130 +972,303 @@ function Y() {
     themes: []
   };
 }
-function G(e, r, n) {
-  const t = r.map((s) => s.key);
-  return q(t).map((s) => {
-    const o = /* @__PURE__ */ new Map();
-    for (const u of s) {
-      const c = r.find(
-        (f) => f.key.includes(u)
-      );
-      c && o.set(u, c);
-    }
-    return z(e, n, o);
-  });
-}
-function J(e, r) {
-  return function(t, i) {
-    const s = {
+function le(e, r) {
+  return function(t, i, c = {}) {
+    const o = {
       type: "utility",
       name: t,
-      factory: i
-    };
-    return r.utilities.push(s), (o, u = []) => {
-      for (const [c, f] of Object.entries(o)) {
-        const a = {
-          type: "utility",
-          name: t,
-          value: c,
-          declarations: {},
-          variables: [],
-          children: [],
-          modifiers: []
-        }, l = b(
-          a,
-          r
-        );
-        a.declarations = i({
-          ...l,
-          value: f
-        }) ?? {}, g(a.declarations, l), e.children.push(a), u.length > 0 && e.children.push(
-          ...G(a, u, r)
-        );
+      factory: i,
+      values: [],
+      autogenerate: c.autogenerate ?? z(),
+      create: (u, s = []) => {
+        let f = u;
+        if (Array.isArray(u)) {
+          f = {};
+          for (const l of u) {
+            const a = o.autogenerate(l);
+            f = {
+              ...f,
+              ...a
+            };
+          }
+        }
+        for (const [l, a] of Object.entries(f)) {
+          const y = o.values.find(
+            (h2) => h2.key === l && h2.modifiers.length === 0
+          ), m = {
+            type: "utility",
+            name: t,
+            value: l,
+            declarations: {},
+            variables: [],
+            children: [],
+            modifiers: []
+          }, d2 = v(
+            m,
+            r
+          );
+          if (m.declarations = i({
+            ...d2,
+            value: a
+          }) ?? {}, V(m.declarations, d2), y || (o.values.push({
+            key: l,
+            value: a,
+            modifiers: []
+          }), e.children.push(m)), s && s.length > 0) {
+            const h2 = s.map((b) => b.key), H2 = ce(h2).filter((b) => !o.values.find(
+              (g2) => g2.key === l && g2.modifiers.length === b.length && g2.modifiers.every((w2) => b.includes(w2))
+            )).reduce((b, g2) => {
+              const w2 = /* @__PURE__ */ new Map();
+              for (const K2 of g2) {
+                const k2 = s.find(
+                  (N2) => N2.key.includes(K2)
+                );
+                k2 && q(k2) && w2.set(K2, k2);
+              }
+              return o.values.push({
+                key: l,
+                value: a,
+                modifiers: g2
+              }), b.push(fe(m, r, w2)), b;
+            }, []);
+            e.children.push(...H2);
+          }
+        }
       }
     };
+    return r.utilities.push(o), o.create;
   };
 }
-function Q(e, r) {
+function ye(e, r) {
   return function(t, i) {
-    const s = r.themes.find((c) => c.name === t), o = s ?? {
+    const c = r.themes.find((s) => s.name === t), o = c ?? {
       type: "theme",
       name: t,
       declarations: {},
       variables: [],
       children: []
     };
-    s || r.themes.push(o);
-    const u = b(o, r);
+    c || r.themes.push(o);
+    const u = v(o, r);
     return i && i(u), o;
   };
 }
-function X(e, r) {
-  return function(t, i, s, o) {
-    const u = {
+function de(e, r) {
+  return function(t) {
+    const i = {
       type: "recipe",
-      name: t,
-      defaults: i,
-      variants: s,
-      ...o
+      ...t
     };
-    return r.recipes.push(u), u;
+    return i._runtime = me(i, r), pe(i, r), r.recipes.push(i), i;
   };
 }
-function ue(e) {
-  const r = $("sf-"), n = Y(), t = { ...e }, i = J(n, n), s = W(n, n), o = X(n, n), u = Q(n, n), { variable: c, selector: f, atRule: a, keyframes: l, media: y, ref: h, css: d } = b(n, n);
+function _(e, r) {
+  const n = e.autogenerate(r);
+  return Object.keys(n)[0] ?? "default";
+}
+function F(e, r) {
+  const n = {};
+  for (const [t, i] of Object.entries(e))
+    if (P(i)) {
+      const c = {};
+      for (const [o, u] of Object.entries(i)) {
+        const s = T(r, o);
+        s && (c[o] = _(
+          s,
+          u
+        ));
+      }
+      n[t] = c;
+    } else if (typeof i == "boolean")
+      n[t] = i;
+    else {
+      const c = T(r, t);
+      c && (n[t] = _(c, i));
+    }
+  return n;
+}
+function me(e, r) {
+  const n = {};
+  if (e.base && (n.base = F(e.base, r)), e.variants) {
+    const t = {};
+    for (const [i, c] of Object.entries(e.variants)) {
+      const o = {};
+      for (const [u, s] of Object.entries(
+        c
+      ))
+        s == null ? o[u] = null : o[u] = F(
+          s,
+          r
+        );
+      t[i] = o;
+    }
+    n.variants = t;
+  }
+  return e.defaultVariants && (n.defaultVariants = { ...e.defaultVariants }), e.compoundVariants && (n.compoundVariants = e.compoundVariants.map((t) => ({
+    match: { ...t.match },
+    css: F(t.css, r)
+  }))), n;
+}
+function P(e) {
+  return !A(e) && typeof e == "object" && e !== null;
+}
+function x(e, r) {
+  const n = (t, i, c) => {
+    let o = r.get(t);
+    o || (o = [], r.set(t, o)), o.push({ value: i, modifiers: c });
+  };
+  for (const [t, i] of Object.entries(e))
+    if (P(i)) {
+      const c = t.split(":");
+      for (const [o, u] of Object.entries(i))
+        n(o, u, c);
+    } else
+      n(t, i, []);
+}
+function T(e, r) {
+  const n = e.utilities.find((i) => i.name === r);
+  if (n)
+    return n;
+  const t = r.replace(/[A-Z]/g, (i) => `-${i.toLowerCase()}`);
+  return e.utilities.find((i) => i.name === t);
+}
+function pe(e, r) {
+  const n = /* @__PURE__ */ new Map();
+  if (e.base && x(e.base, n), e.variants)
+    for (const i of Object.values(e.variants))
+      for (const c of Object.values(i))
+        x(
+          c,
+          n
+        );
+  if (e.compoundVariants)
+    for (const i of e.compoundVariants)
+      i.css && x(i.css, n);
+  const t = /* @__PURE__ */ new Map();
+  for (const [i, c] of n) {
+    const o = T(r, i);
+    if (!o) {
+      console.warn(
+        `[styleframe] Utility "${i}" not found in registry. Skipping.`
+      );
+      continue;
+    }
+    for (const u of c) {
+      const s = [];
+      for (const f of u.modifiers) {
+        if (!t.has(f))
+          try {
+            t.set(f, re(r, f));
+          } catch {
+            console.warn(
+              `[styleframe] Modifier "${f}" not found in registry. Skipping modifier for utility "${i}".`
+            ), t.set(f, null);
+          }
+        const l = t.get(f);
+        l && s.push(l);
+      }
+      o.create(
+        [u.value],
+        s.length > 0 ? s : void 0
+      );
+    }
+  }
+}
+function Re(e) {
+  const r = ne("sf-"), n = ae(), t = { ...e }, i = le(n, n), c = ue(n, n), o = de(n, n), u = ye(n, n), { variable: s, selector: f, atRule: l, keyframes: a, media: y, ref: m, css: d2 } = v(n, n);
   return {
     id: r,
     root: n,
-    variable: c,
+    variable: s,
     selector: f,
     utility: i,
-    modifier: s,
+    modifier: c,
     recipe: o,
     theme: u,
-    atRule: a,
-    keyframes: l,
+    atRule: l,
+    keyframes: a,
     media: y,
-    ref: h,
-    css: d,
+    ref: m,
+    css: d2,
     options: t
   };
 }
+const SUPPORTED_EXTENSIONS = [".ts", ".mts", ".cts", ".js", ".mjs", ".cjs"];
+function hasKnownExtension(filePath) {
+  return SUPPORTED_EXTENSIONS.some((ext) => filePath.endsWith(ext));
+}
+function resolveConfigFile(cwd, entry) {
+  const basePath = path.isAbsolute(entry) ? entry : path.join(cwd, entry);
+  if (hasKnownExtension(basePath)) {
+    return existsSync(basePath) ? basePath : void 0;
+  }
+  for (const ext of SUPPORTED_EXTENSIONS) {
+    const filePath = `${basePath}${ext}`;
+    if (existsSync(filePath)) {
+      return filePath;
+    }
+  }
+  return void 0;
+}
+function trackNamedExports(module) {
+  for (const [exportName, exportValue] of Object.entries(module)) {
+    if (exportName === "default") continue;
+    if (Ae(exportValue)) {
+      exportValue._exportName = exportName;
+    } else if (be(exportValue)) {
+      exportValue._exportName = exportName;
+    }
+  }
+}
 async function loadConfiguration({
   cwd = process.cwd(),
-  name = "styleframe"
+  entry = "styleframe.config"
 } = {}) {
-  const { config } = await loadConfig({
-    cwd,
-    name,
-    defaults: ue()
-  });
-  return config;
-}
-async function loadConfigurationFromPath(entry) {
-  const entryPath = path.resolve(entry);
-  const cwd = path.dirname(entryPath);
-  const name = path.basename(entryPath).replace(/(\.config)?(\.ts)?$/, "");
-  return await loadConfiguration({ cwd, name });
+  const resolvedPath = resolveConfigFile(cwd, entry);
+  if (!resolvedPath) {
+    return Re();
+  }
+  const jiti = createJiti(path.dirname(resolvedPath), { cache: false });
+  const module = await jiti.import(resolvedPath);
+  if (!module.default) {
+    throw new Error(
+      `Missing default export in ${resolvedPath}. Expected a Styleframe instance.`
+    );
+  }
+  trackNamedExports(module);
+  return module.default;
 }
 async function watchConfiguration({
-  cwd = process.cwd()
+  cwd = process.cwd(),
+  entry = "styleframe.config",
+  onUpdate,
+  onError
 } = {}) {
-  return await watchConfig({
-    cwd,
-    name: "styleframe",
-    acceptHMR({ getDiff }) {
-      const diff = getDiff();
-      if (diff.length === 0) {
-        return true;
-      }
+  const resolvedPath = resolveConfigFile(cwd, entry);
+  if (!resolvedPath) {
+    throw new Error(`Config file not found: ${entry}`);
+  }
+  const watcher = watch(resolvedPath, { ignoreInitial: true });
+  watcher.on("change", async () => {
+    try {
+      const config = await loadConfiguration({ entry: resolvedPath });
+      onUpdate?.(config);
+    } catch (error) {
+      onError?.(error instanceof Error ? error : new Error(String(error)));
     }
   });
+  watcher.on("unlink", () => {
+    onError?.(new Error(`Config file was deleted: ${resolvedPath}`));
+  });
+  return {
+    config: await loadConfiguration({ entry: resolvedPath }),
+    configFile: resolvedPath,
+    unwatch: () => watcher.close()
+  };
 }
 export {
   build,
   directoryExists,
   loadConfiguration,
-  loadConfigurationFromPath,
   watchConfiguration
 };