@gospore/theme 1.0.138 → 1.0.140

package/dist/theme.es.js

@@ -1,82 +1,82 @@
-import { inject as he, computed as j, ref as N, watch as A, onBeforeUnmount as pe, provide as J, createElementBlock as be, openBlock as Z, normalizeStyle as ge, renderSlot as ke, createElementVNode as ee, createBlock as Me, unref as g, withCtx as X, createVNode as U } from "vue";
+import { inject as Ut, computed as ot, ref as G, watch as H, onBeforeUnmount as $t, provide as mt, createElementBlock as Pt, openBlock as _t, normalizeStyle as Ht, renderSlot as Ft, createElementVNode as Ct, createBlock as Vt, unref as w, withCtx as bt, createVNode as K } from "vue";
 import "what-input";
-import { DropdownMenu as ve, DropdownItemGroup as ye, DropdownItemRadio as K } from "@gospore/dropdown-menu";
-const B = ["auto", "light", "dark"], te = "gospore-theme-mode", Ee = 3600 * 24 * 365, Se = "(prefers-color-scheme: dark)";
-function V() {
+import { DropdownMenu as Gt, DropdownItemGroup as jt, DropdownItemRadio as Z } from "@gospore/dropdown-menu";
+const Q = ["auto", "light", "dark"], vt = "gospore-theme-mode", Kt = 3600 * 24 * 365, Yt = "(prefers-color-scheme: dark)";
+function nt() {
   if (typeof document > "u")
     return null;
-  const n = Oe(te);
-  return n && B.includes(n) ? n : null;
+  const a = Xt(vt);
+  return a && Q.includes(a) ? a : null;
 }
-function we(n) {
-  if (typeof document > "u" || !B.includes(n))
+function Qt(a) {
+  if (typeof document > "u" || !Q.includes(a))
     return;
-  const a = typeof window < "u" ? window.location.hostname : "", s = typeof window < "u" ? window.location.protocol : "", c = _e(a), p = s === "https:", k = [
+  const l = typeof window < "u" ? window.location.hostname : "", m = typeof window < "u" ? window.location.protocol : "", u = qt(l), D = m === "https:", I = [
     "path=/",
-    `max-age=${Ee}`,
+    `max-age=${Kt}`,
     "SameSite=Lax"
   ];
-  c && k.push(`domain=${c}`), p && k.push("Secure"), document.cookie = [
-    `${encodeURIComponent(te)}=${encodeURIComponent(n)}`,
-    ...k
+  u && I.push(`domain=${u}`), D && I.push("Secure"), document.cookie = [
+    `${encodeURIComponent(vt)}=${encodeURIComponent(a)}`,
+    ...I
   ].join("; ");
 }
-function ne(n) {
+function Rt(a) {
   if (typeof document > "u")
     return;
-  const a = typeof n == "string" && B.includes(n) ? n : V() ?? "auto";
-  console.log("Applying theme mode:", a);
-  const s = Re(a);
-  document.documentElement.setAttribute("dark-mode", s);
+  const l = typeof a == "string" && Q.includes(a) ? a : nt() ?? "auto";
+  console.log("Applying theme mode:", l);
+  const m = zt(l);
+  document.documentElement.setAttribute("dark-mode", m);
 }
-function Oe(n) {
+function Xt(a) {
   if (typeof document > "u" || !document.cookie)
     return null;
-  const a = `${encodeURIComponent(n)}=`, s = document.cookie.split("; ");
-  for (const c of s)
-    if (c.startsWith(a))
-      return decodeURIComponent(c.slice(a.length));
+  const l = `${encodeURIComponent(a)}=`, m = document.cookie.split("; ");
+  for (const u of m)
+    if (u.startsWith(l))
+      return decodeURIComponent(u.slice(l.length));
   return null;
 }
-function _e(n) {
-  if (!n || n === "localhost")
+function qt(a) {
+  if (!a || a === "localhost")
     return null;
-  if (/^\d+(?:\.\d+){3}$/.test(n))
-    return n;
-  const s = n.split(".");
-  return s.length <= 1 ? null : s.length === 2 ? n : s.slice(-2).join(".");
+  if (/^\d+(?:\.\d+){3}$/.test(a))
+    return a;
+  const m = a.split(".");
+  return m.length <= 1 ? null : m.length === 2 ? a : m.slice(-2).join(".");
 }
-function Re(n) {
-  if (n === "dark")
+function zt(a) {
+  if (a === "dark")
     return !0;
-  if (n === "light" || typeof window > "u")
+  if (a === "light" || typeof window > "u")
     return !1;
   try {
-    const a = typeof window.matchMedia == "function" ? window.matchMedia(Se) : null;
-    return a ? a.matches : !1;
+    const l = typeof window.matchMedia == "function" ? window.matchMedia(Yt) : null;
+    return l ? l.matches : !1;
   } catch {
     return !1;
   }
 }
-const oe = /* @__PURE__ */ Symbol.for("gospore.theme.portalHost");
-function Ne() {
-  const n = he(oe, null);
-  console.log("Using theme portal host:", n);
-  const a = typeof document < "u" ? document.body : "body";
-  return j(() => n?.value ?? a);
+const Tt = /* @__PURE__ */ Symbol.for("gospore.theme.portalHost");
+function ae() {
+  const a = Ut(Tt, null);
+  console.log("Using theme portal host:", a);
+  const l = typeof document < "u" ? document.body : "body";
+  return ot(() => a?.value ?? l);
 }
-const Te = "(prefers-color-scheme: dark)", De = "(prefers-reduced-motion: reduce)", Ce = 200, Ue = /* @__PURE__ */ Object.assign({
+const Wt = "(prefers-color-scheme: dark)", Jt = "(prefers-reduced-motion: reduce)", Zt = 200, B = 3.8, pt = 1.8, St = 1.15, kt = 1.08, Y = 2.5, Mt = 3, tt = "#ffffff", et = "#1f2228", ce = /* @__PURE__ */ Object.assign({
   name: "Theme"
 }, {
   __name: "Theme",
   props: {
     mode: {
       type: String,
-      validator: (n) => ["auto", "light", "dark"].includes(n)
+      validator: (a) => ["auto", "light", "dark"].includes(a)
     },
     /**
      * Optional hex accent color ("#RRGGBB" or "#RGB"). When provided,
-     * Theme derives the `--color-brand-*` palette and exposes the tokens on
+     * Theme derives contrast-safe semantic brand tokens and exposes them on
      * the root .theme element (and the global document for portals).
      */
     accentColor: {
@@ -93,287 +93,460 @@ const Te = "(prefers-color-scheme: dark)", De = "(prefers-reduced-motion: reduce
       default: !1
     }
   },
-  setup(n) {
-    const a = n, s = [], c = /* @__PURE__ */ new Set();
-    function p() {
-      const e = document.documentElement;
-      if (!e)
+  setup(a) {
+    const l = a, m = [], u = /* @__PURE__ */ new Set();
+    function D() {
+      const t = document.documentElement;
+      if (!t)
         return;
-      c.forEach((r) => {
-        e.style.removeProperty(r);
-      }), c.clear();
-      const t = [...s].reverse().find(
-        (r) => r.enabled && r.vars && Object.keys(r.vars).length > 0
+      u.forEach((o) => {
+        t.style.removeProperty(o);
+      }), u.clear();
+      const e = [...m].reverse().find(
+        (o) => o.enabled && o.vars && Object.keys(o.vars).length > 0
       );
-      t && Object.entries(t.vars).forEach(([r, o]) => {
-        e.style.setProperty(r, o), c.add(r);
+      e && Object.entries(e.vars).forEach(([o, r]) => {
+        t.style.setProperty(o, r), u.add(o);
       });
     }
-    const k = window.matchMedia(Te), P = window.matchMedia(
-      De
-    ), T = q();
-    ne(T);
-    const I = N(T), l = N({
-      darkMode: M(T)
-    }), f = N(null);
-    k.addEventListener("change", Y), A(
-      () => a.mode,
+    const I = window.matchMedia(Wt), X = window.matchMedia(
+      Jt
+    ), L = ct();
+    Rt(L);
+    const F = G(L), S = G({
+      darkMode: y(L)
+    }), _ = G(null);
+    I.addEventListener("change", rt), H(
+      () => l.mode,
       () => {
-        d();
+        M();
       },
       { immediate: !0 }
-    ), A(
-      () => l.value.darkMode,
-      (e, t) => {
-        if (t === void 0) {
-          Q(e);
+    ), H(
+      () => S.value.darkMode,
+      (t, e) => {
+        if (e === void 0) {
+          at(t);
           return;
         }
-        re(() => {
-          Q(e);
+        Et(() => {
+          at(t);
         });
       },
       { immediate: !0 }
-    ), pe(() => {
-      k.removeEventListener("change", Y);
-      const e = s.indexOf($);
-      e !== -1 && s.splice(e, 1), p();
+    ), $t(() => {
+      I.removeEventListener("change", rt);
+      const t = m.indexOf(V);
+      t !== -1 && m.splice(t, 1), D();
     });
-    function d() {
-      const e = q();
-      I.value = e, l.value.darkMode = M(e);
+    function M() {
+      const t = ct();
+      F.value = t, S.value.darkMode = y(t);
     }
-    function M(e) {
-      return e === "dark" ? !0 : e === "light" ? !1 : k.matches;
+    function y(t) {
+      return t === "dark" ? !0 : t === "light" ? !1 : I.matches;
     }
-    function Y(e) {
-      !e || I.value !== "auto" || (l.value.darkMode = e.matches);
+    function rt(t) {
+      !t || F.value !== "auto" || (S.value.darkMode = t.matches);
     }
-    function Q(e) {
-      document.documentElement.setAttribute("dark-mode", e);
+    function at(t) {
+      document.documentElement.setAttribute("dark-mode", t);
     }
-    function re(e) {
-      if (P.matches) {
-        e();
+    function Et(t) {
+      if (X.matches) {
+        t();
         return;
       }
-      const t = document.startViewTransition?.bind(document);
-      if (t) {
-        t(() => {
-          e();
+      const e = document.startViewTransition?.bind(document);
+      if (e) {
+        e(() => {
+          t();
         });
         return;
       }
-      e();
-      const r = document.documentElement;
-      typeof r.animate == "function" && window.requestAnimationFrame(() => {
-        r.animate([{ opacity: 0.85 }, { opacity: 1 }], {
-          duration: Ce,
+      t();
+      const o = document.documentElement;
+      typeof o.animate == "function" && window.requestAnimationFrame(() => {
+        o.animate([{ opacity: 0.85 }, { opacity: 1 }], {
+          duration: Zt,
           easing: "ease-in-out"
         });
       });
     }
-    function q() {
-      return a.mode ?? V() ?? "auto";
+    function ct() {
+      return l.mode ?? nt() ?? "auto";
     }
-    J("theme", l), J(oe, f);
-    function z(e) {
-      if (!e) return null;
-      const t = e.trim().toLowerCase();
-      if (!/^#(?:[0-9a-f]{3}|[0-9a-f]{6})$/i.exec(t)) return null;
-      if (t.length === 4) {
-        const o = t[1], i = t[2], m = t[3];
-        return `#${o}${o}${i}${i}${m}${m}`;
+    mt("theme", S), mt(Tt, _);
+    function st(t) {
+      if (!t) return null;
+      const e = t.trim().toLowerCase();
+      if (!/^#(?:[0-9a-f]{3}|[0-9a-f]{6})$/i.exec(e)) return null;
+      if (e.length === 4) {
+        const r = e[1], n = e[2], c = e[3];
+        return `#${r}${r}${n}${n}${c}${c}`;
       }
-      return t;
+      return e;
     }
-    function ae(e) {
-      const t = z(e);
-      if (!t) return null;
-      const r = parseInt(t.slice(1, 3), 16), o = parseInt(t.slice(3, 5), 16), i = parseInt(t.slice(5, 7), 16);
-      return { r, g: o, b: i };
+    function lt(t) {
+      const e = st(t);
+      if (!e) return null;
+      const o = parseInt(e.slice(1, 3), 16), r = parseInt(e.slice(3, 5), 16), n = parseInt(e.slice(5, 7), 16);
+      return { r: o, g: r, b: n };
     }
-    function ce({ r: e, g: t, b: r }) {
-      const o = (i) => i.toString(16).padStart(2, "0");
-      return `#${o(e)}${o(t)}${o(r)}`;
+    function q({ r: t, g: e, b: o }) {
+      const r = (n) => n.toString(16).padStart(2, "0");
+      return `#${r(t)}${r(e)}${r(o)}`;
     }
-    function h(e) {
-      return Math.max(0, Math.min(1, e));
+    function C(t) {
+      return Math.max(0, Math.min(1, t));
     }
-    function H(e) {
-      return e <= 0.04045 ? e / 12.92 : Math.pow((e + 0.055) / 1.055, 2.4);
+    function U(t) {
+      return t <= 0.04045 ? t / 12.92 : Math.pow((t + 0.055) / 1.055, 2.4);
     }
-    function G(e) {
-      const t = h(e);
-      return t <= 31308e-7 ? 12.92 * t : 1.055 * Math.pow(t, 1 / 2.4) - 0.055;
+    function z(t) {
+      const e = C(t);
+      return e <= 31308e-7 ? 12.92 * e : 1.055 * Math.pow(e, 1 / 2.4) - 0.055;
     }
-    function se({ r: e, g: t, b: r }) {
-      const o = e / 255, i = t / 255, m = r / 255, E = H(o), R = H(i), u = H(m), v = 0.4122214708 * E + 0.5363325363 * R + 0.0514459929 * u, y = 0.2119034982 * E + 0.6806995451 * R + 0.1073969566 * u, S = 0.0883024619 * E + 0.2817188376 * R + 0.6299787005 * u, b = Math.cbrt(v), w = Math.cbrt(y), D = Math.cbrt(S), L = 0.2104542553 * b + 0.793617785 * w - 0.0040720468 * D, O = 1.9779984951 * b - 2.428592205 * w + 0.4505937099 * D, _ = 0.0259040371 * b + 0.7827717662 * w - 0.808675766 * D, C = Math.sqrt(O * O + _ * _);
-      let x = Math.atan2(_, O) * (180 / Math.PI);
-      return x < 0 && (x += 360), { l: L, c: C, h: x };
+    function At({ r: t, g: e, b: o }) {
+      const r = t / 255, n = e / 255, c = o / 255, i = U(r), f = U(n), v = U(c), d = 0.4122214708 * i + 0.5363325363 * f + 0.0514459929 * v, h = 0.2119034982 * i + 0.6806995451 * f + 0.1073969566 * v, b = 0.0883024619 * i + 0.2817188376 * f + 0.6299787005 * v, p = Math.cbrt(d), R = Math.cbrt(h), E = Math.cbrt(b), A = 0.2104542553 * p + 0.793617785 * R - 0.0040720468 * E, g = 1.9779984951 * p - 2.428592205 * R + 0.4505937099 * E, k = 0.0259040371 * p + 0.7827717662 * R - 0.808675766 * E, T = Math.sqrt(g * g + k * k);
+      let x = Math.atan2(k, g) * (180 / Math.PI);
+      return x < 0 && (x += 360), { l: A, c: T, h: x };
     }
-    function F(e, t, r, o = !1) {
-      const i = r * Math.PI / 180, m = t * Math.cos(i), E = t * Math.sin(i), R = e + 0.3963377774 * m + 0.2158037573 * E, u = e - 0.1055613458 * m - 0.0638541728 * E, v = e - 0.0894841775 * m - 1.291485548 * E, y = o ? h(R) : R, S = o ? h(u) : u, b = o ? h(v) : v;
-      if (!o && (y < -1e-4 || y > 1.0001 || S < -1e-4 || S > 1.0001 || b < -1e-4 || b > 1.0001))
+    function it(t, e, o, r = !1) {
+      const n = o * Math.PI / 180, c = e * Math.cos(n), i = e * Math.sin(n), f = t + 0.3963377774 * c + 0.2158037573 * i, v = t - 0.1055613458 * c - 0.0638541728 * i, d = t - 0.0894841775 * c - 1.291485548 * i, h = r ? C(f) : f, b = r ? C(v) : v, p = r ? C(d) : d;
+      if (!r && (h < -1e-4 || h > 1.0001 || b < -1e-4 || b > 1.0001 || p < -1e-4 || p > 1.0001))
         return null;
-      const w = y * y * y, D = S * S * S, L = b * b * b;
-      let O = 4.0767416621 * w - 3.3077115913 * D + 0.2309699292 * L, _ = -1.2684380046 * w + 2.6097574011 * D - 0.3413193965 * L, C = -0.0041960863 * w - 0.7034186147 * D + 1.707614701 * L;
-      if (o)
-        O = h(O), _ = h(_), C = h(C);
-      else if (O < -1e-4 || O > 1.0001 || _ < -1e-4 || _ > 1.0001 || C < -1e-4 || C > 1.0001)
+      const R = h * h * h, E = b * b * b, A = p * p * p;
+      let g = 4.0767416621 * R - 3.3077115913 * E + 0.2309699292 * A, k = -1.2684380046 * R + 2.6097574011 * E - 0.3413193965 * A, T = -0.0041960863 * R - 0.7034186147 * E + 1.707614701 * A;
+      if (r)
+        g = C(g), k = C(k), T = C(T);
+      else if (g < -1e-4 || g > 1.0001 || k < -1e-4 || k > 1.0001 || T < -1e-4 || T > 1.0001)
         return null;
-      const x = h(G(O)), de = h(G(_)), me = h(G(C));
+      const x = C(z(g)), J = C(z(k)), O = C(z(T));
       return {
         r: Math.round(x * 255),
-        g: Math.round(de * 255),
-        b: Math.round(me * 255)
+        g: Math.round(J * 255),
+        b: Math.round(O * 255)
       };
     }
-    function le(e, t, r) {
-      let o = t;
-      for (let i = 0; i < 8; i += 1) {
-        const m = F(e, o, r);
-        if (m)
-          return m;
-        o *= 0.9;
+    function W(t, e, o) {
+      let r = e;
+      for (let n = 0; n < 8; n += 1) {
+        const c = it(t, r, o);
+        if (c)
+          return c;
+        r *= 0.9;
       }
-      return F(e, h(o), r, !0) || { r: 0, g: 0, b: 0 };
+      return it(t, C(r), o, !0) || { r: 0, g: 0, b: 0 };
     }
-    function ie(e) {
-      const t = z(e);
-      if (!t) return null;
-      const r = ae(t);
-      if (!r) return null;
-      const o = se(r), i = {
-        100: { lightness: 0.35, chroma: 0.45 },
-        200: { lightness: 0.28, chroma: 0.5 },
-        300: { lightness: 0.22, chroma: 0.6 },
-        400: { lightness: 0.16, chroma: 0.75 },
-        500: { lightness: 0.08, chroma: 0.9 },
-        600: { lightness: 0, chroma: 1, base: !0 },
-        700: { lightness: -0.08, chroma: 1.05 },
-        800: { lightness: -0.18, chroma: 1.1 },
-        900: { lightness: -0.28, chroma: 1.15 },
-        1e3: { lightness: -0.35, chroma: 1.2 }
-      }, m = {}, E = (u) => u === 0 ? o.l : u > 0 ? h(o.l + u * (1 - o.l)) : h(o.l * (1 + u)), R = (u) => {
-        if (u === 1)
-          return o.c;
-        const v = o.c * u;
-        return Math.max(0, Math.min(0.4, v));
-      };
-      return Object.entries(i).forEach(([u, v]) => {
-        const y = `--color-brand-${u}`;
-        if (v.base) {
-          m[y] = t;
-          return;
+    function dt(t) {
+      const e = lt(t);
+      if (!e)
+        return 0;
+      const o = U(e.r / 255), r = U(e.g / 255), n = U(e.b / 255);
+      return 0.2126 * o + 0.7152 * r + 0.0722 * n;
+    }
+    function N(t, e) {
+      const o = dt(t), r = dt(e), n = Math.max(o, r), c = Math.min(o, r);
+      return (n + 0.05) / (c + 0.05);
+    }
+    function Dt(t, e, o = {}) {
+      const r = o.minContrast ?? B, n = o.preferDark !== !1, c = Math.max(
+        0.01,
+        Math.min(0.06, (t.c || 0.12) * (o.chromaScale ?? 0.25))
+      ), i = o.initialLightness ?? (n ? 0.24 : 0.94), f = n ? -1 : 1, v = o.step ?? 0.03;
+      let d = C(i), h = q(W(d, c, t.h)), b = N(e, h);
+      for (let g = 0; g < 48; g += 1) {
+        const k = q(
+          W(d, c, t.h)
+        ), T = N(e, k);
+        if (T > b && (b = T, h = k), T >= r)
+          return k;
+        if (d = C(d + f * v), d === 0 || d === 1)
+          break;
+      }
+      const p = "#101214", R = "#ffffff", E = N(e, p), A = N(e, R);
+      return E >= r || A >= r ? E >= A ? p : R : h;
+    }
+    function $(t, e, o = {}) {
+      const r = o.minContrast ?? B, n = o.darkCandidate ?? "#101214", c = o.lightCandidate ?? "#ffffff", i = o.preferredCandidate, f = o.preferredMinContrast ?? r, v = o.preferredSwitchDelta ?? 0, d = N(e, n), h = N(e, c), b = d >= r, p = h >= r, R = h >= f, E = d >= f;
+      if (b || p)
+        return i === "light" && R ? c : i === "dark" && E ? n : i === "light" && p ? !b || d - h <= v ? c : n : i === "dark" && b ? !p || h - d <= v ? n : c : b && p ? d >= h ? n : c : b ? n : c;
+      const A = d >= h;
+      return Dt(t, e, {
+        minContrast: r,
+        preferDark: A,
+        initialLightness: A ? 0.2 : 0.96,
+        chromaScale: 0.1
+      });
+    }
+    const wt = [100, 200, 300, 400, 500, 600, 700, 800, 900, 1e3], ut = [
+      0.9,
+      0.84,
+      0.78,
+      0.72,
+      0.67,
+      0.62,
+      0.56,
+      0.5,
+      0.44,
+      0.38
+    ], It = [
+      0.28,
+      0.4,
+      0.54,
+      0.7,
+      0.86,
+      1,
+      1.08,
+      1.14,
+      1.2,
+      1.24
+    ];
+    function P(t, e, o, r) {
+      const n = e[e.length - 1];
+      for (const c of e) {
+        const i = t[c];
+        if (i && N(i, o) >= r)
+          return c;
+      }
+      return n;
+    }
+    function yt(t) {
+      const e = t.l - ut[5], o = t.c > 0.02 ? 0.02 : 0;
+      return wt.reduce((r, n, c) => {
+        const i = C(
+          ut[c] + e
+        ), f = Math.min(
+          0.4,
+          Math.max(
+            o,
+            t.c * It[c]
+          )
+        );
+        return r[n] = q(W(i, f, t.h)), r;
+      }, {});
+    }
+    function Nt(t, e) {
+      const o = [100, 200, 300, 400, 500, 600, 700], r = P(
+        e,
+        o,
+        tt,
+        kt
+      ), n = o.indexOf(r), c = o[Math.min(n + 1, o.length - 1)], i = o[Math.min(n + 2, o.length - 1)], f = [1e3, 900, 800, 700, 600, 500], v = P(
+        e,
+        f,
+        et,
+        kt
+      ), d = f.indexOf(v), h = f[Math.min(d + 1, f.length - 1)], b = f[Math.min(d + 2, f.length - 1)], R = P(
+        e,
+        [200, 300, 400, 500, 600, 700, 800],
+        tt,
+        St
+      ), A = P(
+        e,
+        [900, 800, 700, 600, 500, 400],
+        et,
+        St
+      ), g = [600, 700, 800, 900, 1e3], k = P(
+        e,
+        g,
+        tt,
+        pt
+      ), T = g.indexOf(k), x = g[Math.min(T + 1, g.length - 1)], J = g[Math.min(T + 2, g.length - 1)], O = [400, 300, 200, 100], j = P(
+        e,
+        O,
+        et,
+        pt
+      ), ht = O.indexOf(j), Lt = O[Math.min(ht + 1, O.length - 1)], xt = O[Math.min(ht + 2, O.length - 1)], s = {
+        "--color-brand-surface-soft-light": e[r],
+        "--color-brand-surface-soft-hovered-light": e[c],
+        "--color-brand-surface-soft-pressed-light": e[i],
+        "--color-brand-surface-soft-dark": e[v],
+        "--color-brand-surface-soft-hovered-dark": e[h],
+        "--color-brand-surface-soft-pressed-dark": e[b],
+        "--color-brand-surface-subtle-light": e[R],
+        "--color-brand-surface-subtle-dark": e[A],
+        "--color-brand-surface-strong-light": e[k],
+        "--color-brand-surface-strong-hovered-light": e[x],
+        "--color-brand-surface-strong-pressed-light": e[J],
+        "--color-brand-surface-strong-dark": e[j],
+        "--color-brand-surface-strong-hovered-dark": e[Lt],
+        "--color-brand-surface-strong-pressed-dark": e[xt]
+      }, gt = e[600], Bt = N(
+        s["--color-brand-surface-soft-light"],
+        gt
+      );
+      return s["--color-brand-on-soft-light"] = Bt >= B ? gt : $(
+        t,
+        s["--color-brand-surface-soft-light"],
+        {
+          minContrast: B
+        }
+      ), s["--color-brand-on-soft-dark"] = $(
+        t,
+        s["--color-brand-surface-soft-dark"],
+        {
+          minContrast: B
+        }
+      ), s["--color-brand-on-subtle-light"] = $(
+        t,
+        s["--color-brand-surface-subtle-light"],
+        {
+          minContrast: Y,
+          preferredCandidate: "light",
+          preferredMinContrast: Y,
+          preferredSwitchDelta: Mt
+        }
+      ), s["--color-brand-on-subtle-dark"] = $(
+        t,
+        s["--color-brand-surface-subtle-dark"],
+        {
+          minContrast: B
         }
-        const S = E(v.lightness), b = R(v.chroma), w = le(S, b, o.h);
-        m[y] = ce(w);
-      }), m;
+      ), s["--color-brand-on-strong-light"] = $(
+        t,
+        s["--color-brand-surface-strong-light"],
+        {
+          minContrast: Y,
+          preferredCandidate: "light",
+          preferredMinContrast: Y,
+          preferredSwitchDelta: Mt
+        }
+      ), s["--color-brand-on-strong-dark"] = $(
+        t,
+        s["--color-brand-surface-strong-dark"],
+        {
+          minContrast: B
+        }
+      ), s["--color-brand-text-light"] = s["--color-brand-surface-strong-light"], s["--color-brand-text-dark"] = s["--color-brand-surface-strong-dark"], s["--color-brand-icon-light"] = s["--color-brand-surface-strong-light"], s["--color-brand-icon-dark"] = s["--color-brand-surface-strong-dark"], s["--color-brand-border-light"] = s["--color-brand-surface-strong-light"], s["--color-brand-border-dark"] = s["--color-brand-surface-strong-dark"], s;
+    }
+    function Ot(t) {
+      const e = st(t);
+      if (!e)
+        return null;
+      const o = lt(e);
+      if (!o)
+        return null;
+      const r = At(o), n = yt(r);
+      return n[600] = e, {
+        "--color-brand-seed": e,
+        "--color-brand-100": n[100],
+        "--color-brand-200": n[200],
+        "--color-brand-300": n[300],
+        "--color-brand-400": n[400],
+        "--color-brand-500": n[500],
+        "--color-brand-600": n[600],
+        "--color-brand-700": n[700],
+        "--color-brand-800": n[800],
+        "--color-brand-900": n[900],
+        "--color-brand-1000": n[1e3],
+        ...Nt(r, n)
+      };
     }
-    const W = j(() => ie(a.accentColor) ?? {}), ue = j(() => W.value), $ = {
+    const ft = ot(() => Ot(l.accentColor) ?? {}), V = {
       vars: {},
-      enabled: !!a.exposeGlobalAccent
+      enabled: !!l.exposeGlobalAccent
     };
-    return s.push($), A(
-      () => a.exposeGlobalAccent,
-      (e) => {
-        $.enabled = !!e, p();
+    return m.push(V), H(
+      () => l.exposeGlobalAccent,
+      (t) => {
+        V.enabled = !!t, D();
       },
       { immediate: !0 }
-    ), A(
-      W,
-      (e) => {
-        e && Object.keys(e).length > 0 ? $.vars = { ...e } : $.vars = {}, p();
+    ), H(
+      ft,
+      (t) => {
+        t && Object.keys(t).length > 0 ? V.vars = { ...t } : V.vars = {}, D();
       },
       { immediate: !0 }
-    ), (e, t) => (Z(), be("div", {
+    ), (t, e) => (_t(), Pt("div", {
       class: "theme",
-      style: ge(ue.value)
+      style: Ht(ft.value)
     }, [
-      ke(e.$slots, "default"),
-      ee("div", {
+      Ft(t.$slots, "default"),
+      Ct("div", {
         ref_key: "portalHost",
-        ref: f,
+        ref: _,
         class: "theme__portal-host"
       }, null, 512)
     ], 4));
   }
-}), Ae = (n, a) => {
-  const s = n.__vccOpts || n;
-  for (const [c, p] of a)
-    s[c] = p;
-  return s;
-}, Ie = {
+}), te = (a, l) => {
+  const m = a.__vccOpts || a;
+  for (const [u, D] of l)
+    m[u] = D;
+  return m;
+}, ee = {
   __name: "ThemeSwitcher",
   props: {
     mode: {
       type: String,
       default: "auto",
-      validator: (n) => ["auto", "light", "dark"].includes(n)
+      validator: (a) => ["auto", "light", "dark"].includes(a)
     }
   },
   emits: ["update:mode"],
-  setup(n, { emit: a }) {
-    const c = [
+  setup(a, { emit: l }) {
+    const u = [
       { value: "auto", label: "System" },
       { value: "light", label: "Light" },
       { value: "dark", label: "Dark" }
-    ].reduce((f, d) => (f[d.value] = d.label, f), {}), p = B, k = n, P = a;
-    ne();
-    const T = N(!1), I = V() ?? k.mode, l = N(
-      p.includes(I) ? I : "auto"
+    ].reduce((_, M) => (_[M.value] = M.label, _), {}), D = Q, I = a, X = l;
+    Rt();
+    const L = G(!1), F = nt() ?? I.mode, S = G(
+      D.includes(F) ? F : "auto"
     );
-    return j(
-      () => c[l.value] ?? c.auto
-    ), A(
-      () => k.mode,
-      (f) => {
-        p.includes(f) && f !== l.value && (l.value = f);
+    return ot(
+      () => u[S.value] ?? u.auto
+    ), H(
+      () => I.mode,
+      (_) => {
+        D.includes(_) && _ !== S.value && (S.value = _);
       }
-    ), A(
-      l,
-      (f) => {
-        if (!p.includes(f)) {
-          l.value = "auto";
+    ), H(
+      S,
+      (_) => {
+        if (!D.includes(_)) {
+          S.value = "auto";
           return;
         }
-        T.value = !1, P("update:mode", f), we(f);
+        L.value = !1, X("update:mode", _), Qt(_);
       },
       { immediate: !0 }
-    ), (f, d) => (Z(), Me(g(ve), {
-      open: T.value,
-      "onUpdate:open": d[3] || (d[3] = (M) => T.value = M),
+    ), (_, M) => (_t(), Vt(w(Gt), {
+      open: L.value,
+      "onUpdate:open": M[3] || (M[3] = (y) => L.value = y),
       text: "Theme",
       "aria-label": "Select theme mode"
     }, {
-      default: X(() => [
-        U(g(ye), { title: "Theme" }, {
-          default: X(() => [
-            U(g(K), {
-              checked: l.value,
-              "onUpdate:checked": d[0] || (d[0] = (M) => l.value = M),
+      default: bt(() => [
+        K(w(jt), { title: "Theme" }, {
+          default: bt(() => [
+            K(w(Z), {
+              checked: S.value,
+              "onUpdate:checked": M[0] || (M[0] = (y) => S.value = y),
               value: "auto",
-              label: g(c).auto,
-              "aria-label": `${g(c).auto} mode`
+              label: w(u).auto,
+              "aria-label": `${w(u).auto} mode`
             }, null, 8, ["checked", "label", "aria-label"]),
-            d[4] || (d[4] = ee("hr", {
+            M[4] || (M[4] = Ct("hr", {
               class: "theme-switcher-divider",
               role: "separator"
             }, null, -1)),
-            U(g(K), {
-              checked: l.value,
-              "onUpdate:checked": d[1] || (d[1] = (M) => l.value = M),
+            K(w(Z), {
+              checked: S.value,
+              "onUpdate:checked": M[1] || (M[1] = (y) => S.value = y),
               value: "light",
-              label: g(c).light,
-              "aria-label": `${g(c).light} mode`
+              label: w(u).light,
+              "aria-label": `${w(u).light} mode`
             }, null, 8, ["checked", "label", "aria-label"]),
-            U(g(K), {
-              checked: l.value,
-              "onUpdate:checked": d[2] || (d[2] = (M) => l.value = M),
+            K(w(Z), {
+              checked: S.value,
+              "onUpdate:checked": M[2] || (M[2] = (y) => S.value = y),
               value: "dark",
-              label: g(c).dark,
-              "aria-label": `${g(c).dark} mode`
+              label: w(u).dark,
+              "aria-label": `${w(u).dark} mode`
             }, null, 8, ["checked", "label", "aria-label"])
           ]),
           _: 1
@@ -382,11 +555,11 @@ const Te = "(prefers-color-scheme: dark)", De = "(prefers-reduced-motion: reduce
       _: 1
     }, 8, ["open"]));
   }
-}, je = /* @__PURE__ */ Ae(Ie, [["__scopeId", "data-v-bcbc87cb"]]);
+}, se = /* @__PURE__ */ te(ee, [["__scopeId", "data-v-bcbc87cb"]]);
 export {
-  Ue as Theme,
-  je as ThemeSwitcher,
-  oe as themePortalHostKey,
-  Ne as useThemePortalTarget
+  ce as Theme,
+  se as ThemeSwitcher,
+  Tt as themePortalHostKey,
+  ae as useThemePortalTarget
 };
 //# sourceMappingURL=theme.es.js.map