unocss-preset-magicolor 0.2.0 → 0.3.0

package/dist/common-Dv0krm1V.js

@@ -0,0 +1,59 @@
+import { mc as f } from "magic-color";
+function r(t) {
+  return t && Number.parseFloat(t.toString()) || 0;
+}
+function g(t) {
+  if (!t)
+    return;
+  if (t.type === "oklch")
+    return t.components[0].toString().includes("%") && (t.components[0] = r(t.components[0]) / 100), t.components = t.components.map(r), t;
+  const n = f(
+    t.type === "hex" ? t.components[0].toString() : t.components,
+    t.type
+  ).toOklch().values;
+  if (n)
+    return {
+      type: "oklch",
+      components: [n[0] / 100, n[1], n[2]],
+      alpha: t.alpha
+    };
+}
+function u(t) {
+  return Math.round(t * 1e3) / 1e3;
+}
+const m = [50, 100, 200, 300, 400, 500, 600, 700, 800, 900, 950];
+function b(t) {
+  let n = Number(t);
+  n = n <= 50 ? 50 : n, n = n >= 950 ? 950 : n;
+  let o = Math.floor(n / 100) * 100;
+  o = o <= 50 ? 50 : o;
+  let e = Math.floor((n + 100) / 100) * 100;
+  return e = e >= 950 ? 950 : e, { originDepth: n, beforeDepth: o, afterDepth: e };
+}
+function N(t) {
+  return !t || !Number.isNaN(Number(t)) ? (console.error(`[unocss-preset-margicolor] The color '${t}' is invalid.`), !0) : !1;
+}
+function $(t) {
+  const { originDepth: n, beforeDepth: o, beforeComponents: e, afterComponents: i } = t, a = (n - o) / (n < 100 || n > 900 ? 50 : 100);
+  return `oklch(${Array.from({ length: 3 }).map((l, c) => {
+    const p = r(e[c]) + (r(i[c]) - r(e[c])) * a;
+    return u(p);
+  }).join(" ")})`;
+}
+function k(t, n) {
+  const o = {};
+  for (const e of m)
+    if (n[e]) {
+      const i = n[e].components;
+      o[`--mc-${t}-${e}-l`] = u(r(i[0])), o[`--mc-${t}-${e}-c`] = u(r(i[1])), o[`--mc-${t}-${e}-h`] = u(r(i[2]));
+    }
+  return o;
+}
+export {
+  g as a,
+  $ as c,
+  k as g,
+  N as i,
+  b as r,
+  m as t
+};

package/dist/helper.js

@@ -1,42 +1,40 @@
-import { formatHex as C } from "culori";
 import { mc as m } from "magic-color";
-import { i as d, a as u, t as g, c as b, p as y, r as D } from "./common-BKEe-sBl.js";
-function O(p) {
-  const { name: n, color: a, dom: i } = p;
+import { i as h, t as C, a as g, c as d, g as u, r as b } from "./common-Dv0krm1V.js";
+function M(p) {
+  const { name: c, color: a, dom: i } = p;
   if (!i)
     return;
-  const c = a?.split(/-\d+-?/)[0];
-  if (d(c))
+  const s = a?.split(/-\d+-?/)[0];
+  if (h(s))
     return;
-  const t = {}, e = {};
+  const e = {}, t = {};
   try {
-    const o = C(c) || c;
-    if (o && m.valid(o)) {
-      t[`--mc-${n}-color`] = o;
-      const r = m.theme(o);
-      for (const s of u) {
-        const h = g({ type: "hex", components: [r[s]], alpha: 1 });
-        e[s] = h;
+    if (m.valid(s)) {
+      e[`--mc-${c}-color`] = s;
+      const o = m.theme(s, { type: "hex" });
+      for (const r of C) {
+        const n = g({ type: "hex", components: [o[r]], alpha: 1 });
+        t[r] = n;
       }
     }
   } catch (o) {
-    console.error(`[updateMagicColor] get ${c} theme fail, please use another color.`), console.error(o);
+    console.error(`[updateMagicColor] get ${s} theme fail, please use another color.`), console.error(o);
   }
   const l = a.match(/.*-(\d+)/)?.[1];
   if (l) {
-    const { originDepth: o, beforeDepth: r, afterDepth: s } = D(l);
-    e[r] && e[s] && (t[`--mc-${n}-color`] = b({
+    const { originDepth: o, beforeDepth: r, afterDepth: n } = b(l);
+    t[r] && t[n] && (e[`--mc-${c}-color`] = d({
       originDepth: o,
       beforeDepth: r,
-      beforeComponents: e[r].components,
-      afterComponents: e[s].components
+      beforeComponents: t[r].components,
+      afterComponents: t[n].components
     }));
   }
-  const f = y(n, e);
-  Object.assign(t, f);
-  for (const o in t)
-    t[o] && i.style.setProperty(o, t[o].toString());
+  const f = u(c, t);
+  Object.assign(e, f);
+  for (const o in e)
+    e[o] && i.style.setProperty(o, e[o].toString());
 }
 export {
-  O as updateMagicColor
+  M as updateMagicColor
 };

package/dist/index.js

@@ -1,7 +1,6 @@
-import { colorCSSGenerator as I, parseColor as f, defineProperty as m, generateThemeVariable as N, themeTracking as z, detectThemeValue as B, h as b, SpecialColorKey as E, numberResolver as M, hyphenate as x } from "@unocss/preset-wind4/utils";
-import { formatHex as L } from "culori";
-import { mc as C } from "magic-color";
-import { i as P, r as V, t as v, c as H, a as y, p as G } from "./common-BKEe-sBl.js";
+import { colorCSSGenerator as R, parseColor as f, defineProperty as m, generateThemeVariable as B, themeTracking as z, detectThemeValue as E, h, SpecialColorKey as G, numberResolver as M, hyphenate as C } from "@unocss/preset-wind4/utils";
+import { mc as y } from "magic-color";
+import { r as V, t as v, i as L, a as x, c as P, g as H } from "./common-Dv0krm1V.js";
 import { notNull as U } from "unocss";
 import { notLastChildSelectorVariant as q } from "@unocss/preset-wind4/rules";
 function A(e, o) {
@@ -18,54 +17,58 @@ function A(e, o) {
     alpha: a && `${a}%`,
     keys: void 0,
     cssColor: void 0
-  }, P(n) || !c)
+  }, L(n) || !c)
     return r;
-  const { originDepth: l, beforeDepth: i, afterDepth: p } = V(c);
-  let $ = f(`${n}-${i}`, o)?.cssColor, d = f(`${n}-${p}`, o)?.cssColor;
+  const { originDepth: i, beforeDepth: l, afterDepth: p } = V(c);
+  let $ = f(`${n}-${l}`, o)?.cssColor, d = f(`${n}-${p}`, o)?.cssColor;
   if (!$ || !d)
     try {
-      const h = f(n, o)?.color, g = h ? L(h) : void 0;
-      if (g && C.valid(g)) {
-        const O = C.theme(g);
-        $ || ($ = v({ type: "hex", components: [O[i]], alpha: 1 })), d || (d = v({ type: "hex", components: [O[p]], alpha: 1 }));
+      const g = f(n, o);
+      if (g?.color && y.valid(g.color)) {
+        const b = y.theme(g.color, { type: "hex" });
+        $ || ($ = { type: "hex", components: [b[l]], alpha: 1 }), d || (d = { type: "hex", components: [b[p]], alpha: 1 });
       }
-    } catch (h) {
-      console.error(`[unocss-preset-margicolor] Error parsing ${e}: get ${n} theme fail, please use another color.`), console.error(h);
+    } catch (g) {
+      console.error(`[unocss-preset-margicolor] Error parsing ${e}: get ${n} theme fail, please use another color.`), console.error(g);
     }
-  return $ = v($), d = v(d), !$ || !d || (r.color = H({
-    originDepth: l,
-    beforeDepth: i,
+  return $ = x($), d = x(d), !$ || !d || (r.color = P({
+    originDepth: i,
+    beforeDepth: l,
     beforeComponents: $.components,
     afterComponents: d.components
   })), r;
 }
 function F(e) {
-  const o = {};
+  const o = [];
   if (!e || e.color)
-    return { colorData: e, cssVariable: o };
+    return { colorData: e, cssVariables: o };
   const { name: r, no: t } = e;
   if (!t)
-    return e.color = `var(--mc-${r}-color)`, { colorData: e, cssVariable: o };
-  const { originDepth: a, beforeDepth: s, afterDepth: c } = V(t), n = `--mc-${r}-${a}-l`, l = `--mc-${r}-${a}-c`, i = `--mc-${r}-${a}-h`;
-  if (!y.includes(a)) {
-    const p = (a - s) / (a < 100 || a > 900 ? 50 : 100), [$, d, h] = ["l", "c", "h"].map((g) => `calc(var(--mc-${r}-${s}-${g}) + ${p} * (var(--mc-${r}-${c}-${g}) - var(--mc-${r}-${s}-${g})))`);
-    Object.assign(o, { [n]: $, [l]: d, [i]: h });
+    return e.color = `var(--mc-${r}-color)`, { colorData: e, cssVariables: o };
+  const { originDepth: a, beforeDepth: s, afterDepth: c } = V(t), n = `--mc-${r}-${a}-l`, i = `--mc-${r}-${a}-c`, l = `--mc-${r}-${a}-h`;
+  if (!v.includes(a)) {
+    const p = (a - s) / (a < 100 || a > 900 ? 50 : 100), [$, d, g] = ["l", "c", "h"].map((b) => {
+      const O = `var(--mc-${r}-${s}-${b})`, N = `var(--mc-${r}-${c}-${b})`;
+      return `calc(${O} + ${p} * (${N} - ${O}))`;
+    });
+    o.push({ [n]: $, [i]: d, [l]: g });
   }
-  return e.color = `oklch(var(${n}) var(${l}) var(${i}))`, { colorData: e, cssVariable: o };
+  return e.color = `oklch(var(${n}) var(${i}) var(${l}))`, { colorData: e, cssVariables: o };
 }
 function w(e, o) {
-  const r = A(e, o);
-  return F(r);
+  return F(
+    A(e, o)
+  );
 }
 function u(e, o) {
   return ([, r], t) => {
-    const { colorData: a, cssVariable: s } = w(r ?? "", t.theme);
+    const { colorData: a, cssVariables: s } = w(r ?? "", t.theme);
     if (a?.color) {
-      const c = I(a, e, o, t);
-      return c && c.push({
-        [t.symbols.selector]: (n) => n,
-        ...s
-      }), c;
+      const c = R(a, e, o, t);
+      return c && s.length && c.push(...s.map((n) => ({
+        [t.symbols.selector]: (i) => i,
+        ...n
+      }))), c;
     }
   };
 }
@@ -86,21 +89,21 @@ const J = {
 };
 function W() {
   return function* ([, e, o], { theme: r, symbols: t }) {
-    const a = {}, { colorData: s, cssVariable: c } = w(o, r);
+    const a = {}, { colorData: s, cssVariables: c } = w(o, r);
     if (s) {
-      const { color: n, keys: l, alpha: i } = s;
+      const { color: n, keys: i, alpha: l } = s;
       if (n) {
         if (Object.values(J).includes(n))
           a[`--un-gradient-${e}`] = n;
         else {
-          a[`--un-${e}-opacity`] = i;
-          const p = l ? N("colors", l) : n;
+          a[`--un-${e}-opacity`] = l;
+          const p = i ? B("colors", i) : n;
           a[`--un-gradient-${e}`] = `color-mix(in oklab, ${p} var(--un-${e}-opacity), transparent)`, yield m(`--un-${e}-opacity`, { syntax: "<percentage>", initialValue: "100%" });
         }
-        l && z("colors", l), r && B(n, r);
+        i && z("colors", i), r && E(n, r);
       }
     } else
-      a[`--un-gradient-${e}`] = b.bracket.cssvar(o);
+      a[`--un-gradient-${e}`] = h.bracket.cssvar(o);
     if (a[`--un-gradient-${e}`]) {
       switch (e) {
         case "from":
@@ -128,10 +131,11 @@ function W() {
       }
       for (const n of Object.values(Q))
         yield n;
-      yield {
-        [t.selector]: (n) => n,
-        ...c
-      };
+      for (const n of c)
+        yield {
+          [t.selector]: (i) => i,
+          ...n
+        };
     }
   };
 }
@@ -156,26 +160,26 @@ const S = {
 };
 function k([, e = "", o], r) {
   if (e in S) {
-    const { colorData: t, cssVariable: a } = w(o ?? "", r.theme);
+    const { colorData: t, cssVariables: a } = w(o ?? "", r.theme);
     if (t) {
       const s = S[e].map((c) => X(c)(t, r)).filter(U);
       return [
         s.map((c) => c[0]).reduce((c, n) => (Object.assign(c, n), c), {}),
         ...s.flatMap((c) => c.slice(1)),
-        {
-          [r.symbols.selector]: (c) => c,
-          ...a
-        }
+        ...a.map((c) => ({
+          [r.symbols.selector]: (n) => n,
+          ...c
+        }))
       ];
     }
   }
 }
 function X(e) {
   return (o, r) => {
-    const t = I(o, `border${e}-color`, `border${e}`, r);
+    const t = R(o, `border${e}-color`, `border${e}`, r);
     if (t) {
       const a = t[0];
-      return o?.color && !Object.values(E).includes(o.color) && !o.alpha && e && e !== "" && (a[`--un-border${e}-opacity`] = "var(--un-border-opacity)"), t;
+      return o?.color && !Object.values(G).includes(o.color) && !o.alpha && e && e !== "" && (a[`--un-border${e}-opacity`] = "var(--un-border-opacity)"), t;
     }
   };
 }
@@ -190,26 +194,26 @@ const Y = {
   x: ["left", "right"],
   y: ["top", "bottom"]
 }, D = "linear-gradient(#fff, #fff)";
-function R([e, o = "", r, t], a) {
+function T([e, o = "", r, t], a) {
   const s = { ...Y }, c = [];
   if (c.push(...["linear", "radial", "conic"].map((n) => m(`--un-mask-${n}`, { initialValue: D }))), o in j) {
     s["--un-mask-linear"] = "var(--un-mask-left), var(--un-mask-right), var(--un-mask-bottom), var(--un-mask-top)";
     for (const n of j[o]) {
-      s[`--un-mask-${n}`] = `linear-gradient(to ${n}, var(--un-mask-${n}-from-color) var(--un-mask-${n}-from-position), var(--un-mask-${n}-to-color) var(--un-mask-${n}-to-position))`, M(t) != null ? (z("spacing"), s[`--un-mask-${n}-${r}-position`] = `calc(var(--spacing) * ${b.bracket.cssvar.fraction.number(t)})`) : s[`--un-mask-${n}-${r}-position`] = b.bracket.cssvar.fraction.rem(t);
-      const l = u(`--un-mask-${n}-${r}-color`, x("colors"))([e, t], a);
-      if (l) {
-        const [i, ...p] = l;
-        Object.assign(s, i), c.push(...p);
+      s[`--un-mask-${n}`] = `linear-gradient(to ${n}, var(--un-mask-${n}-from-color) var(--un-mask-${n}-from-position), var(--un-mask-${n}-to-color) var(--un-mask-${n}-to-position))`, M(t) != null ? (z("spacing"), s[`--un-mask-${n}-${r}-position`] = `calc(var(--spacing) * ${h.bracket.cssvar.fraction.number(t)})`) : s[`--un-mask-${n}-${r}-position`] = h.bracket.cssvar.fraction.rem(t);
+      const i = u(`--un-mask-${n}-${r}-color`, C("colors"))([e, t], a);
+      if (i) {
+        const [l, ...p] = i;
+        Object.assign(s, l), c.push(...p);
       }
-      c.push(...["from", "to"].flatMap((i) => [
-        m(`--un-mask-${n}-${i}-position`, { syntax: "<length-percentage>", initialValue: i === "from" ? "0%" : "100%" }),
-        m(`--un-mask-${n}-${i}-color`, { syntax: "<color>", initialValue: i === "from" ? "black" : "transparent" })
+      c.push(...["from", "to"].flatMap((l) => [
+        m(`--un-mask-${n}-${l}-position`, { syntax: "<length-percentage>", initialValue: l === "from" ? "0%" : "100%" }),
+        m(`--un-mask-${n}-${l}-color`, { syntax: "<color>", initialValue: l === "from" ? "black" : "transparent" })
       ]));
     }
     c.push(...["top", "right", "bottom", "left"].map((n) => m(`--un-mask-${n}`, { initialValue: D })));
   } else {
     if (r == null)
-      o === "radial" ? (s["--un-mask-radial"] = "radial-gradient(var(--un-mask-radial-stops, var(--un-mask-radial-size)))", s["--un-mask-radial-size"] = b.bracket.cssvar.rem(t)) : (s[`--un-mask-${o}`] = `${o}-gradient(var(--un-mask-${o}-stops, var(--un-mask-${o}-position)))`, s[`--un-mask-${o}-position`] = M(t) ? `calc(1deg * ${b.bracket.cssvar.number(t)})` : b.bracket.cssvar.fraction(t));
+      o === "radial" ? (s["--un-mask-radial"] = "radial-gradient(var(--un-mask-radial-stops, var(--un-mask-radial-size)))", s["--un-mask-radial-size"] = h.bracket.cssvar.rem(t)) : (s[`--un-mask-${o}`] = `${o}-gradient(var(--un-mask-${o}-stops, var(--un-mask-${o}-position)))`, s[`--un-mask-${o}-position`] = M(t) ? `calc(1deg * ${h.bracket.cssvar.number(t)})` : h.bracket.cssvar.fraction(t));
     else {
       const n = {
         linear: "",
@@ -217,10 +221,10 @@ function R([e, o = "", r, t], a) {
         conic: "from "
       };
       s[`--un-mask-${o}-stops`] = `${n[o]}var(--un-mask-${o}-position), var(--un-mask-${o}-from-color) var(--un-mask-${o}-from-position), var(--un-mask-${o}-to-color) var(--un-mask-${o}-to-position)`, s[`--un-mask-${o}`] = `${o}-gradient(var(--un-mask-${o}-stops))`;
-      const l = u(`--un-mask-${o}-${r}-color`, x("colors"))([e, t], a);
-      if (l) {
-        const [i, ...p] = l;
-        Object.assign(s, i), c.push(...p);
+      const i = u(`--un-mask-${o}-${r}-color`, C("colors"))([e, t], a);
+      if (i) {
+        const [l, ...p] = i;
+        Object.assign(s, l), c.push(...p);
       }
     }
     o === "radial" && c.push(m("--un-mask-radial-shape", { initialValue: "ellipse" }), m("--un-mask-radial-size", { initialValue: "farthest-corner" })), c.push(...["from", "to"].flatMap((n) => [
@@ -231,38 +235,35 @@ function R([e, o = "", r, t], a) {
   }
   return [s, ...c];
 }
-function T(e) {
+function I(e) {
   return (o, r) => {
-    const t = x(e);
+    const t = C(e);
     return u(`--un-${t}-color`, t)(o, r);
   };
 }
 function Z(e, o) {
   const r = e?.split(/-\d+-?/)[0];
-  if (P(r))
+  if (L(r))
     return;
   const t = {};
   let a = !1;
-  for (const s of y) {
+  for (const s of v) {
     const c = f(`${r}-${s}`, o)?.cssColor;
     c ? t[s] = c : a = !0;
   }
   if (a)
     try {
-      const s = f(r, o)?.color || f(`[${r}]`, o)?.color, c = s ? L(s) : void 0;
-      if (c && C.valid(c)) {
-        const n = C.theme(c);
-        for (const l of y)
-          if (!t[l]) {
-            const i = v({ type: "hex", components: [n[l]], alpha: 1 });
-            t[l] = i;
-          }
+      let s = f(r, o);
+      if (s?.color || (s = f(`[${r}]`, o)), s?.color && y.valid(s.color)) {
+        const c = y.theme(s.color, { type: "hex" });
+        for (const n of v)
+          t[n] || (t[n] = { type: "hex", components: [c[n]], alpha: 1 });
       }
     } catch (s) {
       console.error(`[unocss-preset-margicolor] get ${r} theme fail, please use another color.`), console.error(s);
     }
-  for (const s of y)
-    t[s] = v(t[s]);
+  for (const s of v)
+    t[s] = x(t[s]);
   return t;
 }
 function _(e, o, r, t) {
@@ -271,15 +272,15 @@ function _(e, o, r, t) {
   if (!c && !a && (c = f(`[${o}]`, t)?.color), c)
     s[`--mc-${e}-color`] = c;
   else if (a) {
-    const { originDepth: l, beforeDepth: i, afterDepth: p } = V(a);
-    r[i] && r[p] && (s[`--mc-${e}-color`] = H({
-      originDepth: l,
-      beforeDepth: i,
-      beforeComponents: r[i].components,
+    const { originDepth: i, beforeDepth: l, afterDepth: p } = V(a);
+    r[l] && r[p] && (s[`--mc-${e}-color`] = P({
+      originDepth: i,
+      beforeDepth: l,
+      beforeComponents: r[l].components,
       afterComponents: r[p].components
     }));
   }
-  const n = G(e, r);
+  const n = H(e, r);
   return Object.assign(s, n);
 }
 function K(e, o, r = {}) {
@@ -335,14 +336,14 @@ const ro = [
   [/^ring-mc-(.+)$/, u("--un-ring-color", "ring"), { autocomplete: "ring-mc-$colors" }],
   [/^inset-ring-mc-(.+)$/, u("--un-inset-ring-color", "inset-ring"), { autocomplete: "inset-ring-mc-$colors" }],
   [/^ring-offset-mc-(.+)$/, u("--un-ring-offset-color", "ring-offset"), { autocomplete: "ring-offset-mc-$colors" }],
-  [/^shadow-mc-(.+)$/, T("shadow"), { autocomplete: ["shadow-$colors", "shadow-mc-$shadow"] }],
-  [/^inset-shadow-mc(.+)$/, T("insetShadow"), { autocomplete: ["inset-shadow-mc-$colors", "inset-shadow-mc-$insetShadow"] }],
+  [/^shadow-mc-(.+)$/, I("shadow"), { autocomplete: ["shadow-$colors", "shadow-mc-$shadow"] }],
+  [/^inset-shadow-mc(.+)$/, I("insetShadow"), { autocomplete: ["inset-shadow-mc-$colors", "inset-shadow-mc-$insetShadow"] }],
   [/^fill-mc-(.+)$/, u("fill", "fill"), { autocomplete: "fill-mc-$colors" }],
   [/^stroke-mc-(.+)$/, u("stroke", "stroke"), { autocomplete: "stroke-mc-$colors" }],
   [/^text-stroke-mc-(.+)$/, u("-webkit-text-stroke-color", "text-stroke"), { autocomplete: "text-stroke-mc-$colors" }],
   [/^text-shadow-(?:color-)?mc-(.+)$/, u("--un-text-shadow-color", "text-shadow"), { autocomplete: ["text-shadow(-color)?-mc-$colors"] }],
-  [/^mask-(linear|radial|conic)-(from|to)-mc-(.+)$/, R, { autocomplete: ["mask-(linear|radial|conic)-(from|to)-mc-$colors"] }],
-  [/^mask-([trblxy])-(from|to)-mc-(.+)$/, R, { autocomplete: ["mask-(x|y|t|b|l|r)-(from|to)-mc-$colors"] }],
+  [/^mask-(linear|radial|conic)-(from|to)-mc-(.+)$/, T, { autocomplete: ["mask-(linear|radial|conic)-(from|to)-mc-$colors"] }],
+  [/^mask-([trblxy])-(from|to)-mc-(.+)$/, T, { autocomplete: ["mask-(x|y|t|b|l|r)-(from|to)-mc-$colors"] }],
   // border style colors
   [/^(?:border|b)-()(?:color-)?mc-(.+)$/, k, { autocomplete: ["(border|b)-mc-$colors", "(border|b)-<directions>-mc-$colors"] }],
   [/^(?:border|b)-([xy])-(?:color-)?mc-(.+)$/, k],
@@ -362,7 +363,7 @@ const no = [
   ro,
   eo
 ].flat();
-function mo(e = {}) {
+function uo(e = {}) {
   return {
     name: "unocss-preset-magicolor",
     layer: "unocss-preset-magicolor",
@@ -372,6 +373,6 @@ function mo(e = {}) {
   };
 }
 export {
-  mo as default,
-  mo as presetMagicolor
+  uo as default,
+  uo as presetMagicolor
 };

package/dist/types/rules/color-style.d.ts

@@ -1,2 +1,3 @@
+import { Theme } from '@unocss/preset-wind4';
 import { Rule } from 'unocss';
-export declare const colorStyle: Rule[];
+export declare const colorStyle: Rule<Theme>[];

package/dist/types/rules/utils/border.d.ts

@@ -1,3 +1,3 @@
 import { Theme } from '@unocss/preset-wind4';
 import { CSSEntries, CSSValueInput, RuleContext } from 'unocss';
-export declare function mcBorderColorResolver([, a, b]: string[], ctx: RuleContext<Theme>): CSSEntries | (CSSValueInput | string)[] | undefined;
+export declare function handlerBorderColor([, a, b]: string[], ctx: RuleContext<Theme>): CSSEntries | (CSSValueInput | string)[] | undefined;

package/dist/types/rules/utils/theme-colors.d.ts

@@ -7,4 +7,4 @@ import { CSSObject } from 'unocss';
  * @param theme unocss theme
  * @returns css variables
  */
-export declare function resolveColorVariable(name: string, hue: string, theme?: Theme): CSSObject | undefined;
+export declare function resolveThemeColorVariable(name: string, hue: string, theme?: Theme): CSSObject | undefined;

package/dist/types/rules/utils/utilities.d.ts

@@ -11,6 +11,6 @@ export declare function parseMagicColor(body: string, theme: Theme): {
         keys: string[] | undefined;
         readonly cssColor: import('@unocss/preset-wind4/utils').CSSColorValue | undefined;
     } | undefined;
-    cssVariable: CSSObject;
+    cssVariables: CSSObject[];
 };
 export declare function mcColorResolver(property: string, varName: string): ([, body]: string[], ctx: RuleContext<Theme>) => (CSSValueInput | string)[] | undefined;

package/dist/types/utils/common.d.ts

@@ -17,4 +17,4 @@ export declare function countDiffColor(params: {
     beforeComponents: (string | number)[];
     afterComponents: (string | number)[];
 }): string;
-export declare function parseOklchVariable(name: string, themeMetaColors: Partial<Record<ThemeKey, CSSColorValue>>): CSSObject;
+export declare function generateOklchVariable(name: string, themeMetaColors: Partial<Record<ThemeKey, CSSColorValue>>): CSSObject;

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "unocss-preset-magicolor",
   "type": "module",
-  "version": "0.2.0",
+  "version": "0.3.0",
   "description": "Unocss预设",
   "author": "nxy",
   "license": "MIT",
@@ -26,12 +26,10 @@
     "dist"
   ],
   "dependencies": {
-    "@unocss/preset-wind4": "~66.5.5",
-    "culori": "^4.0.2",
-    "magic-color": "^2.1.0"
+    "@unocss/preset-wind4": "~66.5.9",
+    "magic-color": "^2.2.3"
   },
   "devDependencies": {
-    "@types/culori": "^4.0.1",
-    "unocss": "^66.5.5"
+    "unocss": "^66.5.9"
   }
 }

package/dist/common-BKEe-sBl.js

@@ -1,57 +0,0 @@
-import { converter as f } from "culori";
-const h = f("oklch");
-function r(t) {
-  return t && Number.parseFloat(t.toString()) || 0;
-}
-function b(t) {
-  if (!t)
-    return;
-  if (t.type === "oklch")
-    return t.components[0].toString().includes("%") && (t.components[0] = r(t.components[0]) / 100), t.components = t.components.map(r), t;
-  const n = t.components.join(" "), e = h(t.type === "hex" ? n : `${t.type}(${n})`);
-  if (e)
-    return {
-      type: "oklch",
-      components: [e.l, e.c, e.h ?? 0],
-      alpha: t.alpha
-    };
-}
-function i(t) {
-  return Math.round(t * 1e3) / 1e3;
-}
-const m = [50, 100, 200, 300, 400, 500, 600, 700, 800, 900, 950];
-function k(t) {
-  let n = Number(t);
-  n = n <= 50 ? 50 : n, n = n >= 950 ? 950 : n;
-  let e = Math.floor(n / 100) * 100;
-  e = e <= 50 ? 50 : e;
-  let o = Math.floor((n + 100) / 100) * 100;
-  return o = o >= 950 ? 950 : o, { originDepth: n, beforeDepth: e, afterDepth: o };
-}
-function N(t) {
-  return !t || !Number.isNaN(Number(t)) ? (console.error(`[unocss-preset-margicolor] The color '${t}' is invalid.`), !0) : !1;
-}
-function D(t) {
-  const { originDepth: n, beforeDepth: e, beforeComponents: o, afterComponents: c } = t, p = (n - e) / (n < 100 || n > 900 ? 50 : 100);
-  return `oklch(${Array.from({ length: 3 }).map((s, u) => {
-    const a = r(o[u]) + (r(c[u]) - r(o[u])) * p;
-    return i(a);
-  }).join(" ")})`;
-}
-function d(t, n) {
-  const e = {};
-  for (const o of m)
-    if (n[o]) {
-      const c = n[o].components;
-      e[`--mc-${t}-${o}-l`] = i(r(c[0])), e[`--mc-${t}-${o}-c`] = i(r(c[1])), e[`--mc-${t}-${o}-h`] = i(r(c[2]));
-    }
-  return e;
-}
-export {
-  m as a,
-  D as c,
-  N as i,
-  d as p,
-  k as r,
-  b as t
-};