@pinia/colada-devtools 0.0.6 → 0.1.1

package/dist/index.js

@@ -1,93 +1,93 @@
-import { defineComponent as L, ref as R, onMounted as j, renderSlot as re, createCommentVNode as N, toValue as C, getCurrentScope as Q, onScopeDispose as G, useTemplateRef as se, shallowRef as W, watch as _, onBeforeUnmount as ae, createBlock as F, openBlock as x, Teleport as le, createElementVNode as ue, nextTick as K, readonly as U, getCurrentInstance as ce, toRef as de, customRef as fe, computed as Y, unref as $, withCtx as pe, createElementBlock as ve } from "vue";
-import { useQueryCache as me } from "@pinia/colada";
-import { DEVTOOLS_INFO_KEY as p, DuplexChannel as ye } from "@pinia/colada-devtools/shared";
-const he = /* @__PURE__ */ L({
+import { defineComponent as R, ref as N, onMounted as $, renderSlot as s2, createCommentVNode as A, toValue as E, getCurrentScope as V, onScopeDispose as J, useTemplateRef as a2, shallowRef as W, watch as P, onBeforeUnmount as c2, createBlock as D, openBlock as C, Teleport as u2, createElementVNode as Q, nextTick as Y, readonly as K, getCurrentInstance as d2, toRef as f2, customRef as p2, computed as X, unref as U, withCtx as m2, createElementBlock as v2 } from "vue";
+import { useQueryCache as Z } from "@pinia/colada";
+import { DEVTOOLS_INFO_KEY as p, DuplexChannel as h2 } from "@pinia/colada-devtools/shared";
+const y2 = /* @__PURE__ */ R({
   __name: "ClientOnly",
   setup(e) {
-    const t = R(!1);
-    return j(() => {
-      t.value = !0;
-    }), (n, l) => t.value ? re(n.$slots, "default", { key: 0 }) : N("", !0);
+    const n = N(!1);
+    return $(() => {
+      n.value = !0;
+    }), (t, r) => n.value ? s2(t.$slots, "default", { key: 0 }) : A("", !0);
   }
-}), b = () => performance.timeOrigin + performance.now();
-function ge(e) {
-  var t;
-  if (!z.has(e)) {
-    z.set(e, !0);
-    for (const n of e.getEntries())
-      n[t = p] ?? (n[t] = {
+}), S = () => performance.timeOrigin + performance.now();
+function g2(e) {
+  var n;
+  if (!L.has(e)) {
+    L.set(e, !0);
+    for (const t of e.getEntries())
+      t[n = p] ?? (t[n] = {
         count: {
           total: 0,
           succeed: 0,
           errored: 0,
           cancelled: 0
         },
-        updatedAt: b(),
+        updatedAt: S(),
         inactiveAt: 0,
         simulate: null,
         history: []
       });
-    e.$onAction(({ name: n, args: l, after: r, onError: d }) => {
-      var h, f;
-      if (n === "create")
-        r((s) => {
-          s[p] = {
+    e.$onAction(({ name: t, args: r, after: f, onError: h }) => {
+      var s, a;
+      if (t === "create")
+        f((l) => {
+          l[p] = {
             count: {
               total: 0,
               succeed: 0,
               errored: 0,
               cancelled: 0
             },
-            updatedAt: b(),
+            updatedAt: S(),
             inactiveAt: 0,
             simulate: null,
             history: []
           };
         });
-      else if (n === "fetch") {
-        const [s] = l;
-        s[p].count.total++, s[p].updatedAt = b();
-        const c = b(), v = {
-          id: (((h = s[p].history.at(0)) == null ? void 0 : h.id) ?? -1) + 1,
-          key: s.key,
-          state: s.state.value,
-          updatedAt: c,
-          createdAt: c,
+      else if (t === "fetch") {
+        const [l] = r;
+        l[p].count.total++, l[p].updatedAt = S();
+        const d = S(), v = {
+          id: (((s = l[p].history.at(0)) == null ? void 0 : s.id) ?? -1) + 1,
+          key: l.key,
+          state: l.state.value,
+          updatedAt: d,
+          createdAt: d,
           fetchTime: null
-        }, E = C((f = s.options) == null ? void 0 : f.enabled) ?? !0;
-        E && (v.fetchTime = {
-          start: c,
+        }, x = E((a = l.options) == null ? void 0 : a.enabled) ?? !0;
+        x && (v.fetchTime = {
+          start: d,
           end: null
-        }), s[p].history.unshift(v), s[p].history = s[p].history.slice(0, 10), r(() => {
-          E && (v.fetchTime.end = b(), s[p].count.succeed++, v.state = s.state.value, v.updatedAt = b());
-        }), d(() => {
-          E && (v.fetchTime.end = b(), s[p].count.errored++, v.state = s.state.value, v.updatedAt = b());
+        }), l[p].history.unshift(v), l[p].history = l[p].history.slice(0, 10), f(() => {
+          x && (v.fetchTime.end = S(), l[p].count.succeed++, v.state = l.state.value, v.updatedAt = S());
+        }), h(() => {
+          x && (v.fetchTime.end = S(), l[p].count.errored++, v.state = l.state.value, v.updatedAt = S());
         });
-      } else if (n === "cancel") {
-        const [s] = l;
-        s.pending && s[p].count.cancelled++;
-      } else if (n === "setEntryState") {
-        const [s] = l;
-        let c = s[p].history[0];
-        r(() => {
-          s[p].updatedAt = b(), c ?? (c = s[p].history[0]), c && (c.state = s.state.value, c.updatedAt = b());
+      } else if (t === "cancel") {
+        const [l] = r;
+        l.pending && l[p].count.cancelled++;
+      } else if (t === "setEntryState") {
+        const [l] = r;
+        let d = l[p].history[0];
+        f(() => {
+          l[p].updatedAt = S(), d ?? (d = l[p].history[0]), d && (d.state = l.state.value, d.updatedAt = S());
         });
-      } else if (n === "untrack") {
-        const [s] = l;
-        r(() => {
-          s.active || (s[p].inactiveAt = b());
+      } else if (t === "untrack") {
+        const [l] = r;
+        f(() => {
+          l.active || (l[p].inactiveAt = S());
         });
-      } else if (n === "setQueryData") {
-        const [s] = l;
-        r(() => {
-          const c = e.getEntries({ key: s, exact: !0 })[0];
-          c && !c.active && (c[p].inactiveAt = b());
+      } else if (t === "setQueryData") {
+        const [l] = r;
+        f(() => {
+          const d = e.getEntries({ key: l, exact: !0 })[0];
+          d && !d.active && (d[p].inactiveAt = S());
         });
       }
     });
   }
 }
-function S(e) {
+function w(e) {
   return {
     keyHash: e.keyHash,
     key: e.key,
@@ -99,332 +99,330 @@ function S(e) {
     options: e.options && {
       staleTime: e.options.staleTime,
       gcTime: e.options.gcTime,
-      refetchOnMount: C(e.options.refetchOnMount),
-      refetchOnReconnect: C(e.options.refetchOnReconnect),
-      refetchOnWindowFocus: C(e.options.refetchOnWindowFocus),
-      enabled: C(e.options.enabled)
+      refetchOnMount: E(e.options.refetchOnMount),
+      refetchOnReconnect: E(e.options.refetchOnReconnect),
+      refetchOnWindowFocus: E(e.options.refetchOnWindowFocus),
+      enabled: E(e.options.enabled)
     },
     deps: Array.from(e.deps).map(
-      (t) => "uid" in t ? {
+      (n) => "uid" in n ? {
         type: "component",
-        uid: t.uid,
-        name: t.type.displayName ?? t.type.name
+        uid: n.uid,
+        name: n.type.displayName ?? n.type.name
       } : {
         type: "effect",
-        active: t.active,
-        detached: t.detached
+        active: n.active,
+        detached: n.detached
       }
     ),
     gcTimeout: typeof e.gcTimeout == "number" ? e.gcTimeout : null,
     devtools: e[p]
   };
 }
-const z = /* @__PURE__ */ new WeakMap();
-function we(e, t, n, l) {
-  e.addEventListener(t, n, l), Q() && G(() => {
-    e.removeEventListener(t, n);
+const L = /* @__PURE__ */ new WeakMap();
+function b2(e, n, t, r) {
+  e.addEventListener(n, t, r), V() && J(() => {
+    e.removeEventListener(n, t);
   });
 }
-const Ee = [".isPip", ".port"], Se = /* @__PURE__ */ L({
+const w2 = [".isPip", ".port"], x2 = /* @__PURE__ */ R({
   __name: "PiniaColadaDevtools",
-  setup(e) {
-    const t = me();
-    ge(t), t.$onAction(({ name: i, after: o, onError: m, args: g }) => {
+  emits: ["close"],
+  setup(e, { emit: n }) {
+    const t = n, r = Z();
+    r.$onAction(({ name: i, after: o, onError: m, args: y }) => {
       if (i === "remove") {
-        const [a] = g;
+        const [c] = y;
         o(() => {
-          r.emit("queries:delete", S(a));
+          s.emit("queries:delete", w(c));
         });
       } else if (i === "track" || i === "untrack" || i === "cancel" || i === "invalidate" || i === "fetch" || i === "setEntryState") {
-        const [a] = g;
+        const [c] = y;
         if (i === "fetch") {
-          const y = S(a);
-          y.asyncStatus = "loading", r.emit("queries:update", y);
+          const b = w(c);
+          b.asyncStatus = "loading", s.emit("queries:update", b);
         }
         o(() => {
-          var y;
-          a[p].simulate = null, r.emit("queries:update", S(a)), i === "fetch" && ((y = a.options) == null ? void 0 : y.staleTime) != null && Number.isFinite(a.options.staleTime) && setTimeout(() => {
-            r.emit("queries:update", S(a));
-          }, a.options.staleTime);
+          var b;
+          c[p].simulate = null, s.emit("queries:update", w(c)), i === "fetch" && ((b = c.options) == null ? void 0 : b.staleTime) != null && Number.isFinite(c.options.staleTime) && setTimeout(() => {
+            s.emit("queries:update", w(c));
+          }, c.options.staleTime);
         }), m(() => {
-          r.emit("queries:update", S(a));
+          s.emit("queries:update", w(c));
         });
       } else if (i === "create")
-        o((a) => {
-          r.emit("queries:update", S(a));
+        o((c) => {
+          s.emit("queries:update", w(c));
         });
       else if (i === "setQueryData") {
-        const [a] = g;
+        const [c] = y;
         o(() => {
-          const y = t.getEntries({ key: a, exact: !0 })[0];
-          y && r.emit("queries:update", S(y));
+          const b = r.getEntries({ key: c, exact: !0 })[0];
+          b && s.emit("queries:update", w(b));
         });
       }
     });
-    const n = se("devtools"), l = W(new MessageChannel()), r = new ye(l.value.port1);
-    _(
-      l,
+    const f = a2("devtools"), h = W(new MessageChannel()), s = new h2(h.value.port1);
+    P(
+      h,
       (i) => {
-        r.setPort(i.port1);
+        s.setPort(i.port1);
       },
       { flush: "sync" }
-    ), r.on("ping", () => {
-      console.log("[App] Received ping from devtools"), r.emit("pong");
-    }), r.on("pong", () => {
-      console.log("[App] Received pong from devtools");
-    }), r.on("queries:refetch", (i) => {
-      t.invalidateQueries({ key: i, exact: !0, active: null, stale: null });
-    }), r.on("queries:invalidate", (i) => {
-      t.invalidateQueries({ key: i, exact: !0 });
-    }), r.on("queries:reset", (i) => {
-      const o = t.getEntries({ key: i, exact: !0 })[0];
-      o && (t.cancel(o), t.setEntryState(o, {
+    ), s.on("queries:refetch", (i) => {
+      r.invalidateQueries({ key: i, exact: !0, active: null, stale: null });
+    }), s.on("queries:invalidate", (i) => {
+      r.invalidateQueries({ key: i, exact: !0 });
+    }), s.on("queries:reset", (i) => {
+      const o = r.getEntries({ key: i, exact: !0 })[0];
+      o && (r.cancel(o), r.setEntryState(o, {
         status: "pending",
         data: void 0,
         error: null
       }));
-    }), r.on("queries:set:state", (i, o) => {
-      const m = t.getEntries({ key: i, exact: !0 })[0];
-      m && (t.setEntryState(m, o), r.emit("queries:update", S(m)));
-    }), r.on("queries:simulate:loading", (i) => {
-      const o = t.getEntries({ key: i, exact: !0 })[0];
-      o && (o.asyncStatus.value = "loading", o[p].simulate = "loading", r.emit("queries:update", S(o)));
-    }), r.on("queries:simulate:loading:stop", (i) => {
-      const o = t.getEntries({ key: i, exact: !0 })[0];
-      o && o[p].simulate === "loading" && (o.asyncStatus.value = "idle", o[p].simulate = null, r.emit("queries:update", S(o)));
-    }), r.on("queries:simulate:error", (i) => {
-      const o = t.getEntries({ key: i, exact: !0 })[0];
-      o && (t.cancel(o), t.setEntryState(o, {
+    }), s.on("queries:set:state", (i, o) => {
+      const m = r.getEntries({ key: i, exact: !0 })[0];
+      m && (r.setEntryState(m, o), s.emit("queries:update", w(m)));
+    }), s.on("queries:simulate:loading", (i) => {
+      const o = r.getEntries({ key: i, exact: !0 })[0];
+      o && (o.asyncStatus.value = "loading", o[p].simulate = "loading", s.emit("queries:update", w(o)));
+    }), s.on("queries:simulate:loading:stop", (i) => {
+      const o = r.getEntries({ key: i, exact: !0 })[0];
+      o && o[p].simulate === "loading" && (o.asyncStatus.value = "idle", o[p].simulate = null, s.emit("queries:update", w(o)));
+    }), s.on("queries:simulate:error", (i) => {
+      const o = r.getEntries({ key: i, exact: !0 })[0];
+      o && (r.cancel(o), r.setEntryState(o, {
         ...o.state.value,
         status: "error",
         error: new Error("Simulated error")
-      }), o[p].simulate = "error", r.emit("queries:update", S(o)));
-    }), r.on("queries:simulate:error:stop", (i) => {
-      const o = t.getEntries({ key: i, exact: !0 })[0];
-      o && o[p].simulate === "error" && (t.cancel(o), t.setEntryState(o, {
+      }), o[p].simulate = "error", s.emit("queries:update", w(o)));
+    }), s.on("queries:simulate:error:stop", (i) => {
+      const o = r.getEntries({ key: i, exact: !0 })[0];
+      o && o[p].simulate === "error" && (r.cancel(o), r.setEntryState(o, {
         ...o.state.value,
         status: o.state.value.data !== void 0 ? "success" : "pending",
         error: null
-      }), o[p].simulate = null, r.emit("queries:update", S(o)));
+      }), o[p].simulate = null, s.emit("queries:update", w(o)));
     });
-    const d = W(null);
-    _(d, () => {
-      l.value = new MessageChannel();
-    }), we(
+    const a = W(null);
+    P(a, () => {
+      h.value = new MessageChannel();
+    }), b2(
       window,
       "unload",
       () => {
         var i;
-        (i = d.value) == null || i.close();
+        (i = a.value) == null || i.close();
       },
       { passive: !0 }
-    ), ae(() => {
+    ), c2(() => {
       var i;
-      (i = d.value) == null || i.close();
+      (i = a.value) == null || i.close();
     });
-    function h() {
+    function l() {
       var i;
-      (i = d.value) == null || i.close(), d.value = null;
+      (i = a.value) == null || i.close(), a.value = null;
     }
-    function f() {
-      const i = n.value;
+    function d() {
+      const i = f.value;
       if (!i || !i.shadowRoot)
         throw new Error("No devtools elemnt found for Pinia Colada devtools");
       const o = i.shadowRoot.getElementById("root");
       if (!o)
         throw new Error("No devtools root element found for Pinia Colada devtools");
-      const m = Math.max(o.offsetWidth, 400), g = Math.max(o.offsetHeight, 400), a = window.open(
+      const m = Math.max(o.offsetWidth, 400), y = Math.max(o.offsetHeight, 400), c = window.open(
         "",
         "pinia-colada-devtools",
-        `popup,width=${m},height=${g}`
+        `popup,width=${m},height=${y}`
       );
-      if (!a)
+      if (!c)
         throw new Error("Failed to open PiP window for Pinia Colada devtools");
-      d.value = a, a.document.head.innerHTML = "", a.document.body.innerHTML = "", a.document.title = "🍹 Pinia Colada Devtools", a.document.body.style.margin = "0", s(i, a.document), a.addEventListener(
+      a.value = c, c.document.head.innerHTML = "", c.document.body.innerHTML = "", c.document.title = "🍹 Pinia Colada Devtools", c.document.body.style.margin = "0", v(i, c.document), c.addEventListener(
         "unload",
         () => {
-          d.value = null;
+          a.value = null;
         },
         { passive: !0 }
       );
     }
-    function s(i, o = document) {
+    function v(i, o = document) {
       if (!i || !i.shadowRoot)
         throw new Error("No devtools element found for Pinia Colada devtools");
       const m = o.getElementById("__pc-tw-properties") ?? o.createElement("style");
       m.setAttribute("id", "__pc-tw-properties");
-      const g = [...i.shadowRoot.styleSheets].flatMap((a) => [...a.cssRules]).filter((a) => a instanceof CSSPropertyRule).map((a) => a.cssText).join("");
-      m.textContent = g, o.head.appendChild(m);
+      const y = [...i.shadowRoot.styleSheets].flatMap((c) => [...c.cssRules]).filter((c) => c instanceof CSSPropertyRule).map((c) => c.cssText).join("");
+      m.textContent = y, o.head.appendChild(m);
     }
-    function c() {
-      d.value ? h() : f();
+    function x() {
+      a.value ? l() : d();
     }
-    let v = 0;
-    async function E() {
-      if (!n.value) {
-        if (++v > 100)
+    let O = 0;
+    async function z() {
+      if (!f.value) {
+        if (++O > 100)
           throw new Error("Failed to find devtools element for Pinia Colada devtools");
         setTimeout(() => {
-          E();
+          z();
         }, 100);
         return;
       }
-      s(n.value), r.emit("queries:all", t.getEntries({}).map(S)), r.emit(
+      v(f.value), s.emit("queries:all", r.getEntries().map(w)), s.emit(
         "mutations:all",
-        // FIXME: mutations
-        t.getEntries({}).map(S)
+        // FIXME: add mutations
+        r.getEntries().map(w)
       );
     }
-    return (i, o) => (x(), F(le, {
-      to: d.value ? d.value.document.body : "body"
+    return (i, o) => (C(), D(u2, {
+      to: a.value ? a.value.document.body : "body"
     }, [
-      ue("pinia-colada-devtools-panel", {
+      Q("pinia-colada-devtools-panel", {
         ref: "devtools",
-        ".isPip": !!d.value,
-        ".port": l.value.port2,
-        onTogglePip: o[0] || (o[0] = (m) => c()),
-        onReady: o[1] || (o[1] = (m) => E())
-      }, null, 40, Ee)
+        ".isPip": !!a.value,
+        ".port": h.value.port2,
+        onTogglePip: o[0] || (o[0] = (m) => x()),
+        onReady: o[1] || (o[1] = (m) => z()),
+        onClose: o[2] || (o[2] = (m) => t("close"))
+      }, null, 40, w2)
     ], 8, ["to"]));
   }
 });
-function be(e) {
-  return Q() ? (G(e), !0) : !1;
+function S2(e) {
+  return V() ? (J(e), !0) : !1;
 }
-const Ae = typeof window < "u" && typeof document < "u";
+const k2 = typeof window < "u" && typeof document < "u";
 typeof WorkerGlobalScope < "u" && globalThis instanceof WorkerGlobalScope;
-const Ce = Object.prototype.toString, Te = (e) => Ce.call(e) === "[object Object]", Pe = () => {
+const E2 = Object.prototype.toString, z2 = (e) => E2.call(e) === "[object Object]", O2 = () => {
 };
-function _e(...e) {
+function _2(...e) {
   if (e.length !== 1)
-    return de(...e);
-  const t = e[0];
-  return typeof t == "function" ? U(fe(() => ({ get: t, set: Pe }))) : R(t);
+    return f2(...e);
+  const n = e[0];
+  return typeof n == "function" ? K(p2(() => ({ get: n, set: O2 }))) : N(n);
 }
-function Oe(e, t) {
-  function n(...l) {
-    return new Promise((r, d) => {
-      Promise.resolve(e(() => t.apply(this, l), { fn: t, thisArg: this, args: l })).then(r).catch(d);
+function C2(e, n) {
+  function t(...r) {
+    return new Promise((f, h) => {
+      Promise.resolve(e(() => n.apply(this, r), { fn: n, thisArg: this, args: r })).then(f).catch(h);
     });
   }
-  return n;
+  return t;
 }
-const X = (e) => e();
-function ke(e = X, t = {}) {
+const e2 = (e) => e();
+function P2(e = e2, n = {}) {
   const {
-    initialState: n = "active"
-  } = t, l = _e(n === "active");
-  function r() {
-    l.value = !1;
+    initialState: t = "active"
+  } = n, r = _2(t === "active");
+  function f() {
+    r.value = !1;
   }
-  function d() {
-    l.value = !0;
+  function h() {
+    r.value = !0;
   }
-  const h = (...f) => {
-    l.value && e(...f);
+  const s = (...a) => {
+    r.value && e(...a);
   };
-  return { isActive: U(l), pause: r, resume: d, eventFilter: h };
+  return { isActive: K(r), pause: f, resume: h, eventFilter: s };
 }
-function q(e) {
+function M(e) {
   return Array.isArray(e) ? e : [e];
 }
-function xe(e) {
-  return ce();
+function T2(e) {
+  return d2();
 }
-function De(e, t, n = {}) {
+function G2(e, n, t = {}) {
   const {
-    eventFilter: l = X,
-    ...r
-  } = n;
-  return _(
+    eventFilter: r = e2,
+    ...f
+  } = t;
+  return P(
     e,
-    Oe(
-      l,
-      t
+    C2(
+      r,
+      n
     ),
-    r
+    f
   );
 }
-function Re(e, t, n = {}) {
+function U2(e, n, t = {}) {
   const {
-    eventFilter: l,
-    initialState: r = "active",
-    ...d
-  } = n, { eventFilter: h, pause: f, resume: s, isActive: c } = ke(l, { initialState: r });
-  return { stop: De(
+    eventFilter: r,
+    initialState: f = "active",
+    ...h
+  } = t, { eventFilter: s, pause: a, resume: l, isActive: d } = P2(r, { initialState: f });
+  return { stop: G2(
     e,
-    t,
+    n,
     {
-      ...d,
-      eventFilter: h
+      ...h,
+      eventFilter: s
     }
-  ), pause: f, resume: s, isActive: c };
+  ), pause: a, resume: l, isActive: d };
 }
-function Me(e, t = !0, n) {
-  xe() ? j(e, n) : t ? e() : K(e);
+function A2(e, n = !0, t) {
+  T2() ? $(e, t) : n ? e() : Y(e);
 }
-function qe(e, t, n) {
-  return _(
+function D2(e, n, t) {
+  return P(
     e,
-    t,
+    n,
     {
-      ...n,
+      ...t,
       immediate: !0
     }
   );
 }
-const D = Ae ? window : void 0;
-function Ne(e) {
-  var t;
-  const n = C(e);
-  return (t = n == null ? void 0 : n.$el) != null ? t : n;
+const q = k2 ? window : void 0;
+function q2(e) {
+  var n;
+  const t = E(e);
+  return (n = t == null ? void 0 : t.$el) != null ? n : t;
 }
-function B(...e) {
-  const t = [], n = () => {
-    t.forEach((f) => f()), t.length = 0;
-  }, l = (f, s, c, v) => (f.addEventListener(s, c, v), () => f.removeEventListener(s, c, v)), r = Y(() => {
-    const f = q(C(e[0])).filter((s) => s != null);
-    return f.every((s) => typeof s != "string") ? f : void 0;
-  }), d = qe(
+function I(...e) {
+  const n = [], t = () => {
+    n.forEach((a) => a()), n.length = 0;
+  }, r = (a, l, d, v) => (a.addEventListener(l, d, v), () => a.removeEventListener(l, d, v)), f = X(() => {
+    const a = M(E(e[0])).filter((l) => l != null);
+    return a.every((l) => typeof l != "string") ? a : void 0;
+  }), h = D2(
     () => {
-      var f, s;
+      var a, l;
       return [
-        (s = (f = r.value) == null ? void 0 : f.map((c) => Ne(c))) != null ? s : [D].filter((c) => c != null),
-        q(C(r.value ? e[1] : e[0])),
-        q($(r.value ? e[2] : e[1])),
+        (l = (a = f.value) == null ? void 0 : a.map((d) => q2(d))) != null ? l : [q].filter((d) => d != null),
+        M(E(f.value ? e[1] : e[0])),
+        M(U(f.value ? e[2] : e[1])),
         // @ts-expect-error - TypeScript gets the correct types, but somehow still complains
-        C(r.value ? e[3] : e[2])
+        E(f.value ? e[3] : e[2])
       ];
     },
-    ([f, s, c, v]) => {
-      if (n(), !(f != null && f.length) || !(s != null && s.length) || !(c != null && c.length))
+    ([a, l, d, v]) => {
+      if (t(), !(a != null && a.length) || !(l != null && l.length) || !(d != null && d.length))
         return;
-      const E = Te(v) ? { ...v } : v;
-      t.push(
-        ...f.flatMap(
-          (i) => s.flatMap(
-            (o) => c.map((m) => l(i, o, m, E))
+      const x = z2(v) ? { ...v } : v;
+      n.push(
+        ...a.flatMap(
+          (O) => l.flatMap(
+            (z) => d.map((i) => r(O, z, i, x))
           )
         )
       );
     },
     { flush: "post" }
-  ), h = () => {
-    d(), n();
+  ), s = () => {
+    h(), t();
   };
-  return be(n), h;
+  return S2(t), s;
 }
-const O = typeof globalThis < "u" ? globalThis : typeof window < "u" ? window : typeof global < "u" ? global : typeof self < "u" ? self : {}, k = "__vueuse_ssr_handlers__", We = /* @__PURE__ */ Fe();
-function Fe() {
-  return k in O || (O[k] = O[k] || {}), O[k];
+const T = typeof globalThis < "u" ? globalThis : typeof window < "u" ? window : typeof global < "u" ? global : typeof self < "u" ? self : {}, G = "__vueuse_ssr_handlers__", R2 = /* @__PURE__ */ N2();
+function N2() {
+  return G in T || (T[G] = T[G] || {}), T[G];
 }
-function $e(e, t) {
-  return We[e] || t;
+function F2(e, n) {
+  return R2[e] || n;
 }
-function Le(e) {
+function M2(e) {
   return e == null ? "any" : e instanceof Set ? "set" : e instanceof Map ? "map" : e instanceof Date ? "date" : typeof e == "boolean" ? "boolean" : typeof e == "string" ? "string" : typeof e == "object" ? "object" : Number.isNaN(e) ? "any" : "number";
 }
-const je = {
+const W2 = {
   boolean: {
     read: (e) => e === "true",
     write: (e) => String(e)
@@ -457,142 +455,163 @@ const je = {
     read: (e) => new Date(e),
     write: (e) => e.toISOString()
   }
-}, J = "vueuse-storage";
-function He(e, t, n, l = {}) {
-  var r;
+}, H = "vueuse-storage";
+function $2(e, n, t, r = {}) {
+  var f;
   const {
-    flush: d = "pre",
-    deep: h = !0,
-    listenToStorageChanges: f = !0,
-    writeDefaults: s = !0,
-    mergeDefaults: c = !1,
+    flush: h = "pre",
+    deep: s = !0,
+    listenToStorageChanges: a = !0,
+    writeDefaults: l = !0,
+    mergeDefaults: d = !1,
     shallow: v,
-    window: E = D,
-    eventFilter: i,
-    onError: o = (u) => {
+    window: x = q,
+    eventFilter: O,
+    onError: z = (u) => {
       console.error(u);
     },
-    initOnMounted: m
-  } = l, g = (v ? W : R)(t), a = Y(() => C(e));
-  if (!n)
+    initOnMounted: i
+  } = r, o = (v ? W : N)(n), m = X(() => E(e));
+  if (!t)
     try {
-      n = $e("getDefaultStorage", () => {
+      t = F2("getDefaultStorage", () => {
         var u;
-        return (u = D) == null ? void 0 : u.localStorage;
+        return (u = q) == null ? void 0 : u.localStorage;
       })();
     } catch (u) {
-      o(u);
+      z(u);
     }
-  if (!n)
-    return g;
-  const y = C(t), H = Le(y), T = (r = l.serializer) != null ? r : je[H], { pause: Z, resume: V } = Re(
-    g,
-    () => ne(g.value),
-    { flush: d, deep: h, eventFilter: i }
+  if (!t)
+    return o;
+  const y = E(n), c = M2(y), b = (f = r.serializer) != null ? f : W2[c], { pause: t2, resume: j } = U2(
+    o,
+    () => i2(o.value),
+    { flush: h, deep: s, eventFilter: O }
   );
-  _(a, () => P(), { flush: d });
-  let M = !1;
-  const ee = (u) => {
-    m && !M || P(u);
-  }, te = (u) => {
-    m && !M || ie(u);
+  P(m, () => _(), { flush: h });
+  let F = !1;
+  const o2 = (u) => {
+    i && !F || _(u);
+  }, n2 = (u) => {
+    i && !F || l2(u);
   };
-  E && f && (n instanceof Storage ? B(E, "storage", ee, { passive: !0 }) : B(E, J, te)), m ? Me(() => {
-    M = !0, P();
-  }) : P();
-  function I(u, w) {
-    if (E) {
-      const A = {
-        key: a.value,
+  x && a && (t instanceof Storage ? I(x, "storage", o2, { passive: !0 }) : I(x, H, n2)), i ? A2(() => {
+    F = !0, _();
+  }) : _();
+  function B(u, g) {
+    if (x) {
+      const k = {
+        key: m.value,
         oldValue: u,
-        newValue: w,
-        storageArea: n
+        newValue: g,
+        storageArea: t
       };
-      E.dispatchEvent(n instanceof Storage ? new StorageEvent("storage", A) : new CustomEvent(J, {
-        detail: A
+      x.dispatchEvent(t instanceof Storage ? new StorageEvent("storage", k) : new CustomEvent(H, {
+        detail: k
       }));
     }
   }
-  function ne(u) {
+  function i2(u) {
     try {
-      const w = n.getItem(a.value);
+      const g = t.getItem(m.value);
       if (u == null)
-        I(w, null), n.removeItem(a.value);
+        B(g, null), t.removeItem(m.value);
       else {
-        const A = T.write(u);
-        w !== A && (n.setItem(a.value, A), I(w, A));
+        const k = b.write(u);
+        g !== k && (t.setItem(m.value, k), B(g, k));
       }
-    } catch (w) {
-      o(w);
+    } catch (g) {
+      z(g);
     }
   }
-  function oe(u) {
-    const w = u ? u.newValue : n.getItem(a.value);
-    if (w == null)
-      return s && y != null && n.setItem(a.value, T.write(y)), y;
-    if (!u && c) {
-      const A = T.read(w);
-      return typeof c == "function" ? c(A, y) : H === "object" && !Array.isArray(A) ? { ...y, ...A } : A;
-    } else return typeof w != "string" ? w : T.read(w);
+  function r2(u) {
+    const g = u ? u.newValue : t.getItem(m.value);
+    if (g == null)
+      return l && y != null && t.setItem(m.value, b.write(y)), y;
+    if (!u && d) {
+      const k = b.read(g);
+      return typeof d == "function" ? d(k, y) : c === "object" && !Array.isArray(k) ? { ...y, ...k } : k;
+    } else return typeof g != "string" ? g : b.read(g);
   }
-  function P(u) {
-    if (!(u && u.storageArea !== n)) {
+  function _(u) {
+    if (!(u && u.storageArea !== t)) {
       if (u && u.key == null) {
-        g.value = y;
+        o.value = y;
         return;
       }
-      if (!(u && u.key !== a.value)) {
-        Z();
+      if (!(u && u.key !== m.value)) {
+        t2();
         try {
-          (u == null ? void 0 : u.newValue) !== T.write(g.value) && (g.value = oe(u));
-        } catch (w) {
-          o(w);
+          (u == null ? void 0 : u.newValue) !== b.write(o.value) && (o.value = r2(u));
+        } catch (g) {
+          z(g);
         } finally {
-          u ? K(V) : V();
+          u ? Y(j) : j();
         }
       }
     }
   }
-  function ie(u) {
-    P(u.detail);
+  function l2(u) {
+    _(u.detail);
   }
-  return g;
+  return o;
 }
-function Ve(e, t, n = {}) {
-  const { window: l = D } = n;
-  return He(e, t, l == null ? void 0 : l.localStorage, n);
+function j2(e, n, t = {}) {
+  const { window: r = q } = t;
+  return $2(e, n, r == null ? void 0 : r.localStorage, t);
 }
-const Je = /* @__PURE__ */ L({
+const B2 = "data:image/svg+xml,%3csvg%20fill='none'%20height='898'%20viewBox='0%200%20800%20898'%20width='800'%20xmlns='http://www.w3.org/2000/svg'%20xmlns:xlink='http://www.w3.org/1999/xlink'%3e%3cfilter%20id='a'%20color-interpolation-filters='sRGB'%20filterUnits='userSpaceOnUse'%20height='420.89'%20width='423.181'%20x='188.521'%20y='361.908'%3e%3cfeFlood%20flood-opacity='0'%20result='BackgroundImageFix'/%3e%3cfeGaussianBlur%20in='BackgroundImageFix'%20stdDeviation='10'/%3e%3cfeComposite%20in2='SourceAlpha'%20operator='in'%20result='effect1_backgroundBlur_1637_47'/%3e%3cfeBlend%20in='SourceGraphic'%20in2='effect1_backgroundBlur_1637_47'%20mode='normal'%20result='shape'/%3e%3c/filter%3e%3clinearGradient%20id='b'%3e%3cstop%20offset='0'%20stop-color='%237fd5e3'/%3e%3cstop%20offset='.770833'%20stop-color='%23aeeff0'/%3e%3c/linearGradient%3e%3clinearGradient%20id='c'%20gradientUnits='userSpaceOnUse'%20x1='233.326'%20x2='241.809'%20xlink:href='%23b'%20y1='243.792'%20y2='284.95'/%3e%3clinearGradient%20id='d'%20gradientUnits='userSpaceOnUse'%20x1='277.296'%20x2='304.128'%20y1='275.972'%20y2='302.009'%3e%3cstop%20offset='.385417'%20stop-color='%23ffdb5c'/%3e%3cstop%20offset='1'%20stop-color='%23ecb732'/%3e%3c/linearGradient%3e%3clinearGradient%20id='e'%3e%3cstop%20offset='0'%20stop-color='%2352ce63'/%3e%3cstop%20offset='1'%20stop-color='%2351a256'/%3e%3c/linearGradient%3e%3clinearGradient%20id='f'%20gradientUnits='userSpaceOnUse'%20x1='233.887'%20x2='230.388'%20xlink:href='%23e'%20y1='136.565'%20y2='147.767'/%3e%3clinearGradient%20id='g'%3e%3cstop%20offset='0'%20stop-color='%238ae99c'/%3e%3cstop%20offset='1'%20stop-color='%2352ce63'/%3e%3c/linearGradient%3e%3clinearGradient%20id='h'%20gradientUnits='userSpaceOnUse'%20x1='256.561'%20x2='245.971'%20xlink:href='%23g'%20y1='138.333'%20y2='152.754'/%3e%3clinearGradient%20id='i'%20gradientUnits='userSpaceOnUse'%20x1='214.536'%20x2='213.733'%20y1='167.529'%20y2='168.196'%3e%3cstop%20offset='0'%20stop-color='%23fff'%20stop-opacity='0'/%3e%3cstop%20offset='.282022'%20stop-color='%23fff'/%3e%3cstop%20offset='1'%20stop-color='%23fff'%20stop-opacity='0'/%3e%3c/linearGradient%3e%3cradialGradient%20id='j'%20cx='0'%20cy='0'%20gradientTransform='matrix(1.36208147%201.63937714%20-3.1980157%202.65708103%20190.872%20141.075)'%20gradientUnits='userSpaceOnUse'%20r='1'%3e%3cstop%20offset='.52747'/%3e%3cstop%20offset='.63688'%20stop-opacity='0'/%3e%3c/radialGradient%3e%3clinearGradient%20id='k'%20gradientUnits='userSpaceOnUse'%20x1='227.082'%20x2='238.714'%20y1='159.803'%20y2='238.05'%3e%3cstop%20offset='.078125'%20stop-color='%23fff'/%3e%3cstop%20offset='.473958'%20stop-color='%23fffaa5'/%3e%3cstop%20offset='.84375'%20stop-color='%23fffed4'/%3e%3c/linearGradient%3e%3clinearGradient%20id='l'%20gradientUnits='userSpaceOnUse'%20x1='366.94'%20x2='366.161'%20xlink:href='%23e'%20y1='93.3179'%20y2='168.2'/%3e%3clinearGradient%20id='m'%20gradientUnits='userSpaceOnUse'%20x1='617.826'%20x2='542.939'%20xlink:href='%23e'%20y1='189.364'%20y2='188.567'/%3e%3clinearGradient%20id='n'%20gradientUnits='userSpaceOnUse'%20x1='514.204'%20x2='476.049'%20xlink:href='%23g'%20y1='62.4891'%20y2='171.814'/%3e%3clinearGradient%20id='o'%20gradientUnits='userSpaceOnUse'%20x1='451.43'%20x2='376.146'%20y1='255.419'%20y2='495.027'%3e%3cstop%20offset='0'%20stop-color='%23ffe56c'/%3e%3cstop%20offset='1'%20stop-color='%23ffc63a'/%3e%3c/linearGradient%3e%3clinearGradient%20id='p'%20gradientUnits='userSpaceOnUse'%20x1='394.756'%20x2='394.756'%20xlink:href='%23b'%20y1='712.519'%20y2='888'/%3e%3clinearGradient%20id='q'%20gradientUnits='userSpaceOnUse'%20x1='399.85'%20x2='399.85'%20y1='375.856'%20y2='706.195'%3e%3cstop%20offset='.078125'%20stop-color='%23fff'%20stop-opacity='0'/%3e%3cstop%20offset='.276042'%20stop-color='%23fffaa5'/%3e%3cstop%20offset='.84375'%20stop-color='%23fffed4'/%3e%3c/linearGradient%3e%3clinearGradient%20id='r'%20gradientUnits='userSpaceOnUse'%20x1='553.538'%20x2='536.097'%20y1='426.455'%20y2='349.514'%3e%3cstop%20offset='0'%20stop-color='%23ecb732'/%3e%3cstop%20offset='.653943'%20stop-color='%23ffe56c'/%3e%3c/linearGradient%3e%3cpath%20d='m587.128%20385.531c-188.875-56.155-178.038-57.025-366-.69%2027.292%2044.834%2027.992%2084.84%2015.395%20143.469%20159.33%200%20321.213.69%20321.213.69-11.897-44.834-13.996-79.322%2029.392-143.469z'%20fill='%23f0fcfc'%20stroke='%237fd5e3'%20stroke-linejoin='round'%20stroke-width='6'/%3e%3cpath%20d='m226.182%20243.95c1.207%201.485%2012.678-.331%2015.477-3.19-.971%204.681-.049%2027.776%202.27%2029.801%201.926%201.125%2011.494%202.535%2015.481%202.306%202.533.154%203.397%201.7%203.335%202.863-.183%203.42-16.585%208.279-19.54%208.932-3.539.778-22.748%202.743-24.34.112-.244-.795.359-2.949%202.934-4.156%205.603-2.169%2012.681-6.649%2013.617-8.302%201.816-2.15-6.526-25.035-9.234-28.366z'%20fill='url(%23c)'/%3e%3cpath%20d='m229.202%20244.511c.072%202.53%2010.388%2027.359%208.133%2029.281-.724.758-18.017%208.099-14.603%209.002%202.559.677%2021.937%201.143%2033.378-4.442.96-.194%201.649.618%202.569.753-12.996%206.227-18.27%206.471-30.28%206.917-1.998.133-7.604.499-9.221-1.291-1.048-1.161%201.238-3.3%201.776-3.516%201.215-.49%2012.498-6.296%2014.115-8.236%203.369-1.345-6.992-26.883-8.621-28.915%201.328.572%201.742.233%202.754.447z'%20fill='%23fdfffe'/%3e%3cpath%20d='m245.125%20229.52c3.064-16.516%2010.925%2068.722%2073.375%2044.98-4.085%209.807-7.851%2014.032-15%2029-29.416%2015.761-54.974-17.288-61.714-32.604-22.163%2023.228-31.229-63.028%203.339-41.376z'%20fill='url(%23d)'/%3e%3cpath%20d='m237.24%20267.66c.365%201.043%201.506%201.593%202.548%201.228%201.043-.365%201.592-1.506%201.227-2.548zm-2.063-22.409%201.996.128zm1.043-9.251c-1.979-.289-1.979-.289-1.979-.289h-.001v.001.004c-.001.003-.001.007-.002.012-.002.012-.004.028-.007.049-.006.042-.015.105-.027.185-.022.16-.055.392-.095.682-.08.58-.189%201.393-.305%202.324-.232%201.853-.499%204.215-.623%206.156l3.992.255c.116-1.816.37-4.08.6-5.914.114-.912.22-1.707.299-2.275.039-.284.071-.51.093-.665.011-.077.019-.137.025-.177.003-.02.005-.035.006-.045.001-.005.002-.008.002-.011%200-.001%200-.002%200-.002v-.001h.001s-.001%200-1.979-.289zm-3.039%209.124c-.303%204.738.748%2010.42%201.816%2014.792.541%202.212%201.099%204.141%201.522%205.517.212.689.39%201.241.517%201.623.063.191.113.34.148.442.017.051.031.09.04.118.005.013.009.024.011.031.002.004.003.007.003.009.001.001.001.002.001.003%200%200%20.001.001.001.001s0%200%201.888-.66c1.887-.66%201.888-.66%201.888-.66s-.001%200-.001-.001-.001-.003-.001-.005c-.002-.005-.005-.013-.009-.024-.007-.022-.019-.056-.035-.102-.031-.091-.077-.229-.136-.408-.119-.358-.289-.883-.491-1.543-.406-1.32-.942-3.171-1.46-5.291-1.049-4.292-1.973-9.484-1.71-13.587z'%20fill='%23ecb732'/%3e%3cpath%20d='m251.735%20157.143c-18.944.673-29.761%201.26-48.29%206.174l7.698%2010.409%2037.203-5.531z'%20fill='%23f0fcfc'%20stroke='%237fd5e3'%20stroke-linejoin='round'%20stroke-width='2'/%3e%3cpath%20clip-rule='evenodd'%20d='m236.905%20164.814c5.895-1.691%207.114-7.182%206.481-15.018-.633-7.835-6.768-13.931-8.773-13.356s-7.062%209.882-6.429%2017.717%202.826%2012.348%208.721%2010.657z'%20fill='url(%23f)'%20fill-rule='evenodd'/%3e%3cpath%20clip-rule='evenodd'%20d='m239.765%20163.743c4.527%203.325%208.761-.25%2013.416-7.254%204.655-7.005%204.982-16.979%203.442-18.11-1.539-1.131-10.461%202.531-15.117%209.535-4.655%207.005-6.269%2012.504-1.741%2015.829z'%20fill='url(%23h)'%20fill-rule='evenodd'/%3e%3cpath%20d='m189.664%20143.157c.546-1.355%201.074-2.004%202.977-2.68l35.096%2042.471c-1.448.624-2.06%201.27-2.978%202.681z'%20fill='%23000'/%3e%3cpath%20d='m189.664%20143.157c.546-1.355%201.074-2.004%202.977-2.68l35.096%2042.471c-1.448.624-2.06%201.27-2.978%202.681z'%20fill='url(%23i)'/%3e%3cpath%20d='m189.664%20143.157c.546-1.355%201.074-2.004%202.977-2.68l35.096%2042.471c-1.448.624-2.06%201.27-2.978%202.681z'%20fill='url(%23j)'/%3e%3cpath%20d='m203.21%20163.352c17.042%201.234%2033.703-.573%2048.538-6.127-2.89%2011.732-.974%2020.321.043%2023.938%2013.681%2025.929%209.045%2037.199%206.308%2042.43-12.077%2018.707-29.009%2017.121-38.344%209.132-12.411-8.787-14.05-20.348-9.152-45.439-1.242-8.355-3.142-14.687-7.393-23.934z'%20fill='url(%23k)'/%3e%3cpath%20d='m203.21%20163.352c17.042%201.234%2033.703-.573%2048.538-6.127-2.89%2011.732-.974%2020.321.043%2023.938%2013.681%2025.929%209.045%2037.199%206.308%2042.43-12.077%2018.707-29.009%2017.121-38.344%209.132-12.411-8.787-14.05-20.348-9.152-45.439-1.242-8.355-3.142-14.687-7.393-23.934z'%20fill='%23aeeff0'%20fill-opacity='.19'/%3e%3cpath%20d='m203.21%20163.352c17.042%201.234%2033.703-.573%2048.538-6.127-2.89%2011.732-.974%2020.321.043%2023.938%2013.681%2025.929%209.045%2037.199%206.308%2042.43-12.077%2018.707-29.009%2017.121-38.344%209.132-12.411-8.787-14.05-20.348-9.152-45.439-1.242-8.355-3.142-14.687-7.393-23.934z'%20stroke='%237fd5e3'%20stroke-linecap='round'%20stroke-linejoin='round'%20stroke-miterlimit='3.60929'%20stroke-width='2'/%3e%3cpath%20d='m237.553%20179.428%207.114.03c2.753%209.618%204.634%2014.26%208.807%2024.31-1.669%203.444-3.949%205.03-8.655%205.724-6.286-9.521-7.762-16.177-7.266-30.064z'%20fill='%23fdfee9'%20fill-opacity='.82'/%3e%3cg%20clip-rule='evenodd'%20fill-rule='evenodd'%3e%3cpath%20d='m433.39%20260.331c34.69-21.154%2033.266-56.933%2016.134-103.631s-66.376-72.6719-78.174-65.477c-11.799%207.1949-28.415%2073.33-11.283%20120.028s38.633%2070.234%2073.323%2049.08z'%20fill='url(%23l)'/%3e%3cpath%20d='m457.425%20269.514c13.994%2038.145%2045.087%2032.053%2087.555%206.156s70.995-86.964%2066.235-99.938c-4.76-12.973-59.855-24.326-102.323%201.571s-65.462%2054.066-51.467%2092.211z'%20fill='url(%23m)'/%3e%3cpath%20d='m449.798%20248.545c34.374%2011.996%2055.339-17.616%2073.255-68.949%2017.915-51.332%203.313-112.8622-8.378-116.9425s-62.35%2034.6736-80.265%2086.0055c-17.915%2051.333-18.986%2087.889%2015.388%2099.886z'%20fill='url(%23n)'/%3e%3cpath%20d='m394.608%20499.418c74.042%2016.061%20138.754%207.579%20159.913-89.964%2021.16-97.542-21.524-190.61-95.565-206.671-74.042-16.062-151.405%2050.965-172.564%20148.507-21.16%2097.543%2034.174%20132.066%20108.216%20148.128z'%20fill='url(%23o)'/%3e%3cpath%20d='m522.686%20417.137c-1.544-2.298-4.659-2.909-6.957-1.365l-80.798%2054.292c-2.298%201.544-2.91%204.659-1.365%206.957%201.544%202.299%204.659%202.91%206.957%201.366l80.798-54.292c2.298-1.545%202.909-4.659%201.365-6.958z'%20fill='%23ecb732'/%3e%3cpath%20d='m457.194%20411.286c-2.374%201.425-3.142%204.505-1.717%206.879l32.206%2053.622c1.425%202.373%204.505%203.142%206.879%201.716%202.373-1.425%203.142-4.505%201.716-6.879l-32.205-53.622c-1.426-2.373-4.506-3.142-6.879-1.716z'%20fill='%23ecb732'/%3e%3cpath%20d='m481.033%20244.015c1.498%202.329.825%205.431-1.503%206.929l-53.118%2034.181c-2.328%201.498-5.43.825-6.929-1.504-1.498-2.328-.825-5.43%201.503-6.928l53.118-34.181c2.328-1.498%205.43-.825%206.929%201.503z'%20fill='%23ffc73b'/%3e%3cpath%20d='m461.153%20292.661c2.329-1.499%203.001-4.601%201.503-6.929l-34.18-53.118c-1.499-2.328-4.601-3.001-6.929-1.503-2.328%201.499-3.001%204.601-1.503%206.929l34.18%2053.118c1.499%202.328%204.601%203.001%206.929%201.503z'%20fill='%23ffc73b'/%3e%3c/g%3e%3cpath%20d='m353.029%20341.568c10.219%203.566%2019.848%202.604%2021.507-2.149s-5.281-11.497-15.5-15.063c-10.218-3.567-19.847-2.605-21.506%202.148s5.28%2011.497%2015.499%2015.064z'%20fill='%23eaadcc'/%3e%3cpath%20d='m487.451%20376.393c10.578%202.295%2020.017.166%2021.085-4.753%201.067-4.92-6.643-10.768-17.22-13.063-10.577-2.294-20.017-.166-21.085%204.754-1.067%204.919%206.643%2010.768%2017.22%2013.062z'%20fill='%23eaadcc'/%3e%3cpath%20clip-rule='evenodd'%20d='m308.341%20370.64c2.357-1.451%205.446-.717%206.897%201.641l51.04%2082.891c1.452%202.357.717%205.445-1.64%206.897-2.358%201.452-5.446.718-6.898-1.64l-51.04-82.891c-1.451-2.358-.717-5.446%201.641-6.898z'%20fill='%23ecb732'%20fill-rule='evenodd'/%3e%3cpath%20clip-rule='evenodd'%20d='m370.371%20392.452c1.57%202.281.993%205.402-1.288%206.972l-51.529%2035.458c-2.281%201.569-5.403.992-6.972-1.289-1.57-2.281-.993-5.402%201.288-6.971l51.529-35.458c2.281-1.57%205.403-.993%206.972%201.288z'%20fill='%23ecb732'%20fill-rule='evenodd'/%3e%3cpath%20d='m446.846%20345.706c-2.512%2011.581-17.225%2019.067-28.049%2016.719-10.823-2.348-17.994-14.591-15.482-26.171%201.388-6.396%2012.532-7.545%2023.355-5.197%2010.824%202.348%2021.564%208.254%2020.176%2014.649z'%20fill='%23e77777'/%3e%3cpath%20clip-rule='evenodd'%20d='m350.974%20295.736c-1.403.56-2.087%202.15-1.527%203.553%202.817%207.066%208.43%2011.911%2016.412%2014.622%208.043%202.731%2015.879%202.226%2023.332-1.549%201.347-.683%201.886-2.328%201.204-3.676-.682-1.347-2.328-1.886-3.675-1.203-6.107%203.093-12.416%203.52-19.102%201.25-6.746-2.291-10.968-6.143-13.091-11.469-.56-1.403-2.15-2.087-3.553-1.528z'%20fill='%23755400'%20fill-rule='evenodd'/%3e%3cpath%20clip-rule='evenodd'%20d='m467.183%20331.205c-1.403.559-2.087%202.15-1.528%203.553%202.817%207.065%208.431%2011.911%2016.413%2014.622%208.042%202.731%2015.878%202.225%2023.332-1.55%201.347-.682%201.886-2.328%201.204-3.675-.683-1.347-2.328-1.886-3.675-1.204-6.108%203.093-12.416%203.521-19.102%201.25-6.746-2.291-10.968-6.143-13.092-11.469-.559-1.403-2.15-2.087-3.552-1.527z'%20fill='%23755400'%20fill-rule='evenodd'/%3e%3cpath%20d='m357.784%20712.429c8.796%207.093%2053.534%209.337%2086.6%200-18.895%2018.328-18.562%20108.272%200%20118.509%2016.533%206.225%2049.378%2020.057%2088.742%2022.478%2024.406%202.766%2029.73%209.818%2026.785%2014.524-8.661%2013.832-120.799%2019.879-150.954%2020.056-36.095.2-160.033-7.953-170.268-20.056-.787-3.458%209.431-11.758%2036.985-14.524%2059.047-4.15%2072.889-15.017%2082.11-22.478%2016.726-13.534%2019.726-102.602%200-118.509z'%20fill='url(%23p)'/%3e%3cpath%20d='m386.44%20719.378c-4.391%2010.407%201.999%20124.959-23.881%20130.918-8.589%202.492-90.278%2012.597-70.981%2014.744%2023.978%202.667%20118.162%2013.419%20241.041.22%209.761.016%205.99%202.602%2014.696%203.932-139.349%2014.514-87.658%2019.497-205.751%2011.197-19.762-1.139-69.983-6.298-87.479-11.197-7.888-5.63%2022.31-9.369%2027.994-9.798%2012.838-.982%2050.307-10.225%2069.983-16.796%2032.892-10.983%2020.207-117.687%208.398-127.369%2011.809%203.458%2016.537%202.421%2025.98%204.149z'%20fill='%23fdfffe'/%3e%3cg%20filter='url(%23a)'%3e%3cpath%20d='m220.493%20384.908c166.135%2049.457%20212.377%2048.131%20366.712%200-46.889%2072.44-30.792%20132.268-25.894%20167.26%203.5%2041.29%2044.04%2064.991%2019.596%20113.372-63.349%20125.383-282.733%20125.971-359.714%200-28.111-46%2013.997-59.463%2013.997-113.372%200-51.788%2013.647-126.455-14.697-167.26z'%20fill='url(%23q)'/%3e%3cpath%20d='m220.493%20384.908c166.135%2049.457%20212.377%2048.131%20366.712%200-46.889%2072.44-30.792%20132.268-25.894%20167.26%203.5%2041.29%2044.04%2064.991%2019.596%20113.372-63.349%20125.383-282.733%20125.971-359.714%200-28.111-46%2013.997-59.463%2013.997-113.372%200-51.788%2013.647-126.455-14.697-167.26z'%20fill='%23aeeff0'%20fill-opacity='.19'/%3e%3cpath%20d='m220.493%20384.908c166.135%2049.457%20212.377%2048.131%20366.712%200-46.889%2072.44-30.792%20132.268-25.894%20167.26%203.5%2041.29%2044.04%2064.991%2019.596%20113.372-63.349%20125.383-282.733%20125.971-359.714%200-28.111-46%2013.997-59.463%2013.997-113.372%200-51.788%2013.647-126.455-14.697-167.26z'%20stroke='%237fd5e3'%20stroke-linecap='round'%20stroke-linejoin='round'%20stroke-miterlimit='3.60929'%20stroke-width='6'/%3e%3c/g%3e%3cpath%20d='m466.834%20529.074%2063.684-9.798c6.603%2081.838-.322%2064.494%2020.296%2095.177-6.998%2013.297-25.894%2049.688-63.685%2031.493-26.365-42.668-11.38-21.251-20.295-116.872z'%20fill='%23f9fef9'/%3e%3cpath%20d='m262.483%20425.499c15.396%2054.586%2016.096%20113.372-7.698%20180.556-18.006%2050.84%2032.276%2098.184%2084.679%20112.673'%20stroke='%23f9fef9'%20stroke-linecap='round'%20stroke-linejoin='round'%20stroke-opacity='.85'%20stroke-width='12'/%3e%3cpath%20d='m557.837%20340c7.454%201.653%2014.108%205.426%2021.643%2014.157%205.638%206.531%2010.895%2015.712%2012.452%2024.099%201.35%207.267.26%2015.843-5.839%2020.673%200%200-15.924%204.99-24.903%206.233-45.386%206.286-24.42%202.481-32.055%2025.462-5.517%2016.578-40.485-10.033-39.391-24.32%201.732-22.849%2041.613-20.232%2054.766-21.153%206.994-.493%2020.65%201.456%2024.074-4.799%201.085-1.982-4.837-10.368-9.757-12.852z'%20fill='url(%23r)'/%3e%3cpath%20d='m531.746%20392.401c.295%201.711-19.64%204.473-26.98%205.763-7.34%201.291-11.12%206.426-11.415%204.715-.295-1.71%202.518-7.091%209.858-8.382%204.151-.73%208.301-1.572%2012.452-2.096%206.227-1.047%2015.931-.891%2016.085%200z'%20fill='%23ffefa3'/%3e%3c/svg%3e", L2 = "#open-devtools-button{all:unset;display:block;box-sizing:border-box;font-size:16px;position:fixed;right:1em;bottom:1em;overflow:hidden;-webkit-user-select:none;user-select:none;color-scheme:light dark;--bg-color: light-dark(rgb(225, 255, 255), rgb(0, 20, 30));--fg-color: light-dark( rgb(0, 20, 30), rgb(225, 255, 255));padding:5px;border-radius:50%;border:3px solid color-mix(in srgb,var(--bg-color),black 20%);background-color:color-mix(in srgb,var(--bg-color),transparent 50%);box-shadow:0 2px 4px #0000001a,0 1px 3px #0000001a;width:58px;height:58px;z-index:99999;transition:background-color .2s ease-in-out,border .2s ease-in-out,box-shadow .2s ease-in-out}#open-devtools-button:focus{outline:2px solid var(--fg-color);outline-offset:2px}#open-devtools-button:hover,#open-devtools-button:focus{cursor:pointer;border-width:2px;border-color:color-mix(in srgb,var(--fg-color),black 10%);background-color:color-mix(in srgb,var(--bg-color),transparent 10%);box-shadow:0 4px 8px #0000001a,0 2px 4px #0000001a}#open-devtools-button:hover>img,#open-devtools-button:focus>img{transform:scale(3.5) translateY(20%) translate(-5%) rotate(10deg)}#open-devtools-button>img{width:100%;height:100%;pointer-events:none;transition:transform .2s ease-in-out;transform:scale(1.85) translateY(20%)}", I2 = ["src"], H2 = /* @__PURE__ */ R({
   __name: "PCDevtoolsWrapper",
   setup(e) {
-    const t = R(!1), n = Ve("pinia-colada-devtools-open", !1);
-    async function l() {
-      if (!t.value && (t.value = !0, !customElements.get("pinia-colada-devtools-panel"))) {
-        const { DevtoolsPanel: d } = await import("@pinia/colada-devtools/panel");
-        customElements.define("pinia-colada-devtools-panel", d);
+    const n = N(!1), t = j2("pinia-colada-devtools-open", !1);
+    async function r() {
+      if (!n.value && (n.value = !0, !customElements.get("pinia-colada-devtools-panel"))) {
+        const { DevtoolsPanel: s } = await import("@pinia/colada-devtools/panel");
+        customElements.define("pinia-colada-devtools-panel", s);
       }
     }
-    async function r() {
-      await l(), n.value = !0;
+    const f = Z();
+    g2(f);
+    async function h() {
+      await r(), t.value = !0;
     }
-    return j(() => {
-      requestIdleCallback(() => {
+    return $(() => {
+      const s = document.getElementById("__pc-devtools-style") ?? document.createElement("style");
+      s.id = "__pc-devtools-style", s.textContent = L2, document.head.appendChild(s), t.value ? h() : requestIdleCallback(() => {
         import("@pinia/colada-devtools/panel");
-      }), n.value && r();
-    }), (d, h) => (x(), F(he, null, {
-      default: pe(() => [
-        $(n) ? N("", !0) : (x(), ve("button", {
+      });
+    }), (s, a) => (C(), D(y2, null, {
+      default: m2(() => [
+        U(t) ? A("", !0) : (C(), v2("button", {
           key: 0,
-          class: "fixed bottom-2 right-2 bg-primary-500 hover:cursor-pointer z-99999",
-          onClick: h[0] || (h[0] = (f) => r())
-        }, " 🍹 Devtools ")),
-        t.value && $(n) ? (x(), F(Se, { key: 1 })) : N("", !0)
+          id: "open-devtools-button",
+          "aria-label": "Open Pinia Colada Devtools",
+          title: "Open Pinia Colada Devtools",
+          onClick: a[0] || (a[0] = (l) => h())
+        }, [
+          Q("img", {
+            src: U(B2),
+            alt: "Pinia Colada Devtools Logo"
+          }, null, 8, I2)
+        ])),
+        n.value && U(t) ? (C(), D(x2, {
+          key: 1,
+          onClose: a[1] || (a[1] = (l) => t.value = !1)
+        })) : A("", !0)
       ]),
       _: 1
     }));
   }
+}), Y2 = /* @__PURE__ */ R({
+  __name: "ProductionWrapper",
+  props: {
+    disabled: { type: Boolean, default: () => process.env.NODE_ENV === "production" }
+  },
+  setup(e) {
+    return (n, t) => n.disabled ? A("", !0) : (C(), D(H2, { key: 0 }));
+  }
 });
 export {
-  Je as PiniaColadaDevtools
+  Y2 as PiniaColadaDevtools
 };
 //# sourceMappingURL=index.js.map