@roku-ui/vue 0.7.1 → 0.7.2

package/dist/index.js

@@ -1,4 +1,4 @@
-import { defineComponent as x, openBlock as h, createElementBlock as b, normalizeStyle as C, renderSlot as k, computed as m, ref as g, onMounted as ee, Fragment as K, createBlock as P, resolveDynamicComponent as ue, mergeProps as xe, unref as c, createCommentVNode as T, getCurrentScope as xt, onScopeDispose as kt, nextTick as et, getCurrentInstance as tt, watch as de, shallowRef as St, readonly as Mt, watchEffect as F, withCtx as W, normalizeClass as y, createElementVNode as w, mergeModels as j, useModel as U, inject as be, provide as ge, useAttrs as $t, withDirectives as Te, vModelText as Ct, createVNode as Z, Teleport as At, Transition as rt, useSlots as nt, toDisplayString as se, renderList as ye, vModelDynamic as Tt, withModifiers as ot, withKeys as zt, reactive as Et, vModelCheckbox as Rt, isRef as Bt, createTextVNode as Ot } from "vue";
+import { defineComponent as x, openBlock as h, createElementBlock as b, normalizeStyle as C, renderSlot as k, computed as m, ref as g, onMounted as ee, Fragment as K, createBlock as P, resolveDynamicComponent as ue, mergeProps as xe, unref as u, createCommentVNode as T, getCurrentScope as xt, onScopeDispose as kt, nextTick as et, getCurrentInstance as tt, watch as de, shallowRef as St, readonly as Mt, watchEffect as X, withCtx as L, normalizeClass as y, createElementVNode as w, mergeModels as W, useModel as j, inject as be, provide as ge, useAttrs as $t, withDirectives as Te, vModelText as Ct, createVNode as Z, Teleport as At, Transition as rt, useSlots as nt, toDisplayString as se, renderList as ye, vModelDynamic as Tt, withModifiers as ot, withKeys as zt, reactive as Et, vModelCheckbox as Rt, isRef as Bt, createTextVNode as Ot } from "vue";
 const In = /* @__PURE__ */ x({
   __name: "AspectRatio",
   props: {
@@ -55,20 +55,20 @@ const In = /* @__PURE__ */ x({
         key: 0,
         ref_key: "img",
         ref: a,
-        style: [s.style, c(r)],
+        style: [s.style, u(r)],
         placeholder: "",
         src: s.src,
-        class: ["h-[var(--size)] w-[var(--size)] rounded-full object-cover", [{ hidden: !c(n) }, t.class]]
+        class: ["h-[var(--size)] w-[var(--size)] rounded-full object-cover", [{ hidden: !u(n) }, t.class]]
       }, s.$attrs, { onLoad: o }), null, 16, ["style", "src", "class"])) : T("", !0),
-      c(n) ? T("", !0) : (h(), b("div", {
+      u(n) ? T("", !0) : (h(), b("div", {
         key: 1,
         class: "h-[var(--size)] w-[var(--size)] animate-pulse border-transparent rounded-full bg-surface-high object-cover",
-        style: C([s.style, c(r)])
+        style: C([s.style, u(r)])
       }, null, 4))
     ], 64));
   }
 });
-function G(e) {
+function U(e) {
   return m(
     () => ({ style: Nt(e.rounded), class: "rounded-[var(--r-rounded)]" })
   );
@@ -110,7 +110,7 @@ function Pt() {
   };
 }
 function ze(e) {
-  return typeof e == "function" ? e() : c(e);
+  return typeof e == "function" ? e() : u(e);
 }
 const Q = typeof window < "u" && typeof document < "u";
 typeof WorkerGlobalScope < "u" && globalThis instanceof WorkerGlobalScope;
@@ -146,10 +146,10 @@ function N(...e) {
       );
     },
     { immediate: !0, flush: "post" }
-  ), u = () => {
+  ), c = () => {
     l(), s();
   };
-  return ke(u), u;
+  return ke(c), c;
 }
 function Gt(e) {
   return typeof e == "function" ? e : typeof e == "string" ? (t) => t.key === e : Array.isArray(e) ? (t) => e.includes(t.key) : () => !0;
@@ -180,11 +180,11 @@ function De(e) {
 function Ue(e, t = {}) {
   const { window: r = fe } = t, n = De(() => r && "matchMedia" in r && typeof r.matchMedia == "function");
   let a;
-  const o = g(!1), s = (u) => {
-    o.value = u.matches;
+  const o = g(!1), s = (c) => {
+    o.value = c.matches;
   }, i = () => {
     a && ("removeEventListener" in a ? a.removeEventListener("change", s) : a.removeListener(s));
-  }, l = F(() => {
+  }, l = X(() => {
     n.value && (i(), a = r.matchMedia(ze(e)), "addEventListener" in a ? a.addEventListener("change", s) : a.addListener(s), o.value = a.matches);
   });
   return ke(() => {
@@ -202,13 +202,13 @@ function Xt(e, t, r = {}) {
       i(), s.value && n && f && (o = new MutationObserver(t), o.observe(f, a));
     },
     { immediate: !0 }
-  ), u = () => o == null ? void 0 : o.takeRecords(), d = () => {
+  ), c = () => o == null ? void 0 : o.takeRecords(), d = () => {
     i(), l();
   };
   return ke(d), {
     isSupported: s,
     stop: d,
-    takeRecords: u
+    takeRecords: c
   };
 }
 function Yt(e, t = {}) {
@@ -216,28 +216,28 @@ function Yt(e, t = {}) {
   let a = 0, o = !0;
   if (Q) {
     const s = typeof t == "function" ? { onDrop: t } : t, i = (l) => {
-      var u, d;
-      const f = Array.from((d = (u = l.dataTransfer) == null ? void 0 : u.files) != null ? d : []);
+      var c, d;
+      const f = Array.from((d = (c = l.dataTransfer) == null ? void 0 : c.files) != null ? d : []);
       return n.value = f.length === 0 ? null : f;
     };
     N(e, "dragenter", (l) => {
-      var u, d;
-      const f = Array.from(((u = l == null ? void 0 : l.dataTransfer) == null ? void 0 : u.items) || []).map((v) => v.kind === "file" ? v.type : null).filter(It);
+      var c, d;
+      const f = Array.from(((c = l == null ? void 0 : l.dataTransfer) == null ? void 0 : c.items) || []).map((v) => v.kind === "file" ? v.type : null).filter(It);
       if (s.dataTypes && l.dataTransfer) {
-        const v = c(s.dataTypes);
+        const v = u(s.dataTypes);
         if (o = typeof v == "function" ? v(f) : v ? v.some((S) => f.includes(S)) : !0, !o)
           return;
       }
       l.preventDefault(), a += 1, r.value = !0, (d = s.onEnter) == null || d.call(s, i(l), l);
     }), N(e, "dragover", (l) => {
-      var u;
-      o && (l.preventDefault(), (u = s.onOver) == null || u.call(s, i(l), l));
+      var c;
+      o && (l.preventDefault(), (c = s.onOver) == null || c.call(s, i(l), l));
     }), N(e, "dragleave", (l) => {
-      var u;
-      o && (l.preventDefault(), a -= 1, a === 0 && (r.value = !1), (u = s.onLeave) == null || u.call(s, i(l), l));
+      var c;
+      o && (l.preventDefault(), a -= 1, a === 0 && (r.value = !1), (c = s.onLeave) == null || c.call(s, i(l), l));
     }), N(e, "drop", (l) => {
-      var u;
-      l.preventDefault(), a = 0, r.value = !1, (u = s.onDrop) == null || u.call(s, i(l), l);
+      var c;
+      l.preventDefault(), a = 0, r.value = !1, (c = s.onDrop) == null || c.call(s, i(l), l);
     });
   }
   return {
@@ -250,7 +250,7 @@ function Zt(e, t, r = {}) {
   let o;
   const s = De(() => n && "ResizeObserver" in n), i = () => {
     o && (o.disconnect(), o = void 0);
-  }, l = m(() => Array.isArray(e) ? e.map((f) => re(f)) : [re(e)]), u = de(
+  }, l = m(() => Array.isArray(e) ? e.map((f) => re(f)) : [re(e)]), c = de(
     l,
     (f) => {
       if (i(), s.value && n) {
@@ -261,7 +261,7 @@ function Zt(e, t, r = {}) {
     },
     { immediate: !0, flush: "post", deep: !0 }
   ), d = () => {
-    i(), u();
+    i(), c();
   };
   return ke(d), {
     isSupported: s,
@@ -274,15 +274,15 @@ function Kt(e, t = {}) {
     windowResize: n = !0,
     windowScroll: a = !0,
     immediate: o = !0
-  } = t, s = g(0), i = g(0), l = g(0), u = g(0), d = g(0), f = g(0), v = g(0), S = g(0);
+  } = t, s = g(0), i = g(0), l = g(0), c = g(0), d = g(0), f = g(0), v = g(0), S = g(0);
   function A() {
     const z = re(e);
     if (!z) {
-      r && (s.value = 0, i.value = 0, l.value = 0, u.value = 0, d.value = 0, f.value = 0, v.value = 0, S.value = 0);
+      r && (s.value = 0, i.value = 0, l.value = 0, c.value = 0, d.value = 0, f.value = 0, v.value = 0, S.value = 0);
       return;
     }
     const E = z.getBoundingClientRect();
-    s.value = E.height, i.value = E.bottom, l.value = E.left, u.value = E.right, d.value = E.top, f.value = E.width, v.value = E.x, S.value = E.y;
+    s.value = E.height, i.value = E.bottom, l.value = E.left, c.value = E.right, d.value = E.top, f.value = E.width, v.value = E.x, S.value = E.y;
   }
   return Zt(e, A), de(() => re(e), (z) => !z && A()), Xt(e, A, {
     attributeFilter: ["style", "class"]
@@ -292,7 +292,7 @@ function Kt(e, t = {}) {
     height: s,
     bottom: i,
     left: l,
-    right: u,
+    right: c,
     top: d,
     width: f,
     x: v,
@@ -308,8 +308,8 @@ function Qt(e, t = {}) {
   } = t, o = g(!1);
   let s;
   const i = (l) => {
-    const u = l ? r : n;
-    s && (clearTimeout(s), s = void 0), u ? s = setTimeout(() => o.value = l, u) : o.value = l;
+    const c = l ? r : n;
+    s && (clearTimeout(s), s = void 0), c ? s = setTimeout(() => o.value = l, c) : o.value = l;
   };
   return a && (N(e, "mouseenter", () => i(!0), { passive: !0 }), N(e, "mouseleave", () => i(!1), { passive: !0 })), o;
 }
@@ -325,20 +325,20 @@ function er(e = {}) {
   } = e, r = g(null), { on: n, trigger: a } = Pt();
   let o;
   t && (o = t.createElement("input"), o.type = "file", o.onchange = (l) => {
-    const u = l.target;
-    r.value = u.files, a(r.value);
+    const c = l.target;
+    r.value = c.files, a(r.value);
   });
   const s = () => {
     r.value = null, o && (o.value = "", a(null));
   }, i = (l) => {
     if (!o)
       return;
-    const u = {
+    const c = {
       ...Jt,
       ...e,
       ...l
     };
-    o.multiple = u.multiple, o.accept = u.accept, o.webkitdirectory = u.directory, Lt(u, "capture") && (o.capture = u.capture), u.reset && s(), o.click();
+    o.multiple = c.multiple, o.accept = c.accept, o.webkitdirectory = c.directory, Lt(c, "capture") && (o.capture = c.capture), c.reset && s(), o.click();
   };
   return {
     files: Mt(r),
@@ -350,14 +350,14 @@ function er(e = {}) {
 function tr(e, t = {}) {
   const { initialValue: r = !1, focusVisible: n = !1 } = t, a = g(!1), o = m(() => re(e));
   N(o, "focus", (i) => {
-    var l, u;
-    (!n || (u = (l = i.target).matches) != null && u.call(l, ":focus-visible")) && (a.value = !0);
+    var l, c;
+    (!n || (c = (l = i.target).matches) != null && c.call(l, ":focus-visible")) && (a.value = !0);
   }), N(o, "blur", () => a.value = !1);
   const s = m({
     get: () => a.value,
     set(i) {
-      var l, u;
-      !i && a.value ? (l = o.value) == null || l.blur() : i && !a.value && ((u = o.value) == null || u.focus());
+      var l, c;
+      !i && a.value ? (l = o.value) == null || l.blur() : i && !a.value && ((c = o.value) == null || c.focus());
     }
   });
   return de(
@@ -388,7 +388,7 @@ const at = /* @__PURE__ */ x({
     disabled: { type: Boolean, default: !1 }
   },
   setup(e) {
-    const t = e, r = G(t), n = m(() => {
+    const t = e, r = U(t), n = m(() => {
       switch (t.size) {
         case "sm":
           return {
@@ -479,15 +479,15 @@ const at = /* @__PURE__ */ x({
           return "btn-default";
       }
     });
-    return (l, u) => (h(), P(ue(l.is), xe({
+    return (l, c) => (h(), P(ue(l.is), xe({
       ref_key: "btn",
       ref: a,
       "data-size": l.size,
       type: l.type,
       class: ["flex items-center justify-center gap-1 decoration-none", [
-        c(i),
-        c(r).class,
-        l.icon ? c(n).iconContent : c(n).normalContent,
+        u(i),
+        u(r).class,
+        l.icon ? u(n).iconContent : u(n).normalContent,
         {
           "filter-grayscale pointer-events-none": l.disabled,
           "active:translate-y-0.25": l.pressEffect === "translate",
@@ -496,11 +496,11 @@ const at = /* @__PURE__ */ x({
         }
       ]],
       style: [
-        c(r).style
+        u(r).style
       ],
       disabled: l.disabled
     }, l.$attrs), {
-      default: W(() => [
+      default: L(() => [
         l.$slots.leftSection ? k(l.$slots, "leftSection", { key: 0 }) : T("", !0),
         k(l.$slots, "default"),
         l.$slots.rightSection ? k(l.$slots, "rightSection", { key: 1 }) : T("", !0)
@@ -569,7 +569,7 @@ const Vn = /* @__PURE__ */ nr(or, [["render", sr]]), Dn = /* @__PURE__ */ x({
               "rounded-tl": n.position === "left",
               border: n.withBorder
             },
-            c(r)
+            u(r)
           ]])
         }, [
           k(n.$slots, "default")
@@ -608,7 +608,7 @@ const Vn = /* @__PURE__ */ nr(or, [["render", sr]]), Dn = /* @__PURE__ */ x({
     return (n, a) => (h(), b("div", lr, [
       w("div", {
         class: y(["w-full rounded-xl px-3 py-2 transition-background-color,border-color", [
-          c(r)
+          u(r)
         ]])
       }, [
         k(n.$slots, "default")
@@ -617,7 +617,7 @@ const Vn = /* @__PURE__ */ nr(or, [["render", sr]]), Dn = /* @__PURE__ */ x({
   }
 }), Ln = /* @__PURE__ */ x({
   __name: "Chip",
-  props: /* @__PURE__ */ j({
+  props: /* @__PURE__ */ W({
     is: { default: "img" },
     src: {},
     size: { default: "md" },
@@ -630,7 +630,7 @@ const Vn = /* @__PURE__ */ nr(or, [["render", sr]]), Dn = /* @__PURE__ */ x({
   }),
   emits: ["update:modelValue"],
   setup(e) {
-    const t = e, r = U(e, "modelValue"), n = G(t), a = m(() => {
+    const t = e, r = j(e, "modelValue"), n = U(t), a = m(() => {
       switch (t.size) {
         case "sm":
           return "px-3 text-sm h-6";
@@ -640,10 +640,10 @@ const Vn = /* @__PURE__ */ nr(or, [["render", sr]]), Dn = /* @__PURE__ */ x({
           return "px-8 h-10 text-lg";
       }
     }), o = m(() => r.value ? "container-filled-primary border-transparent" : "container-base"), s = m(() => r.value !== void 0), i = m(() => s.value ? "cursor-pointer" : "");
-    return (l, u) => (h(), b("span", {
-      class: y(["inline-flex items-center gap-1", [c(n).class, c(a), c(o), c(i)]]),
-      style: C([c(n).style]),
-      onPointerup: u[0] || (u[0] = (d) => c(s) && (r.value = !r.value))
+    return (l, c) => (h(), b("span", {
+      class: y(["inline-flex items-center gap-1", [u(n).class, u(a), u(o), u(i)]]),
+      style: C([u(n).style]),
+      onPointerup: c[0] || (c[0] = (d) => u(s) && (r.value = !r.value))
     }, [
       l.$slots.leftSection ? k(l.$slots, "leftSection", { key: 0 }) : T("", !0),
       k(l.$slots, "default"),
@@ -862,7 +862,7 @@ function dr(e) {
     g: 0,
     b: 0
   }, r = 1, n = null, a = null, o = null, s = !1, i = !1;
-  return typeof e == "string" && (e = Er(e)), $e(e) == "object" && (q(e.r) && q(e.g) && q(e.b) ? (t = fr(e.r, e.g, e.b), s = !0, i = String(e.r).substr(-1) === "%" ? "prgb" : "rgb") : q(e.h) && q(e.s) && q(e.v) ? (n = me(e.s), a = me(e.v), t = pr(e.h, n, a), s = !0, i = "hsv") : q(e.h) && q(e.s) && q(e.l) && (n = me(e.s), o = me(e.l), t = hr(e.h, n, o), s = !0, i = "hsl"), e.hasOwnProperty("a") && (r = e.a)), r = st(r), {
+  return typeof e == "string" && (e = Er(e)), $e(e) == "object" && (G(e.r) && G(e.g) && G(e.b) ? (t = fr(e.r, e.g, e.b), s = !0, i = String(e.r).substr(-1) === "%" ? "prgb" : "rgb") : G(e.h) && G(e.s) && G(e.v) ? (n = me(e.s), a = me(e.v), t = pr(e.h, n, a), s = !0, i = "hsv") : G(e.h) && G(e.s) && G(e.l) && (n = me(e.s), o = me(e.l), t = hr(e.h, n, o), s = !0, i = "hsl"), e.hasOwnProperty("a") && (r = e.a)), r = st(r), {
     ok: s,
     format: e.format || i,
     r: Math.min(255, Math.max(t.r, 0)),
@@ -907,8 +907,8 @@ function Ge(e, t, r) {
 function hr(e, t, r) {
   var n, a, o;
   e = M(e, 360), t = M(t, 100), r = M(r, 100);
-  function s(u, d, f) {
-    return f < 0 && (f += 1), f > 1 && (f -= 1), f < 1 / 6 ? u + (d - u) * 6 * f : f < 1 / 2 ? d : f < 2 / 3 ? u + (d - u) * (2 / 3 - f) * 6 : u;
+  function s(c, d, f) {
+    return f < 0 && (f += 1), f > 1 && (f -= 1), f < 1 / 6 ? c + (d - c) * 6 * f : f < 1 / 2 ? d : f < 2 / 3 ? c + (d - c) * (2 / 3 - f) * 6 : c;
   }
   if (t === 0)
     n = a = o = r;
@@ -949,9 +949,9 @@ function qe(e, t, r) {
 }
 function pr(e, t, r) {
   e = M(e, 360) * 6, t = M(t, 100), r = M(r, 100);
-  var n = Math.floor(e), a = e - n, o = r * (1 - t), s = r * (1 - a * t), i = r * (1 - (1 - a) * t), l = n % 6, u = [r, s, o, o, i, r][l], d = [i, r, r, s, o, o][l], f = [o, o, i, r, r, s][l];
+  var n = Math.floor(e), a = e - n, o = r * (1 - t), s = r * (1 - a * t), i = r * (1 - (1 - a) * t), l = n % 6, c = [r, s, o, o, i, r][l], d = [i, r, r, s, o, o][l], f = [o, o, i, r, r, s][l];
   return {
-    r: u * 255,
+    r: c * 255,
     g: d * 255,
     b: f * 255
   };
@@ -1087,8 +1087,8 @@ p.isReadable = function(e, t, r) {
 p.mostReadable = function(e, t, r) {
   var n = null, a = 0, o, s, i, l;
   r = r || {}, s = r.includeFallbackColors, i = r.level, l = r.size;
-  for (var u = 0; u < t.length; u++)
-    o = p.readability(e, t[u]), o > a && (a = o, n = p(t[u]));
+  for (var c = 0; c < t.length; c++)
+    o = p.readability(e, t[c]), o > a && (a = o, n = p(t[c]));
   return p.isReadable(e, n, {
     level: i,
     size: l
@@ -1299,7 +1299,7 @@ var V = function() {
     hex8: /^#?([0-9a-fA-F]{2})([0-9a-fA-F]{2})([0-9a-fA-F]{2})([0-9a-fA-F]{2})$/
   };
 }();
-function q(e) {
+function G(e) {
   return !!V.CSS_UNIT.exec(e);
 }
 function Er(e) {
@@ -1398,18 +1398,18 @@ function Or() {
 }
 function it(e, t = !0) {
   const r = g(e), n = g(e.scheme), a = Br();
-  F(() => {
+  X(() => {
     a.value && (n.value = a.value);
   }), ge("currentTheme", r), ge("currentThemeScheme", n);
   const s = {
-    ...Object.keys(r.value.colors).map((u) => {
-      const d = u;
+    ...Object.keys(r.value.colors).map((c) => {
+      const d = c;
       return r.value.colors[d].reduce((v, S, A) => {
         const z = p(S).toRgb();
         return v[`--r-color-${d}-${A}`] = `${z.r} ${z.g} ${z.b}`, v;
       }, {});
-    }).reduce((u, d) => ({
-      ...u,
+    }).reduce((c, d) => ({
+      ...c,
       ...d
     }), {})
   }, i = {
@@ -1419,8 +1419,8 @@ function it(e, t = !0) {
   }, l = m(() => {
     if (t)
       return {};
-    const { scheme: u } = e;
-    switch (u) {
+    const { scheme: c } = e;
+    switch (c) {
       case "dark":
         return {
           colorScheme: "dark",
@@ -1499,12 +1499,12 @@ const Nr = ["id"], Pr = ["for"], jn = /* @__PURE__ */ x({
   },
   emits: ["update:modelValue"],
   setup(e) {
-    const t = U(e, "modelValue"), r = $t(), n = ct(r), a = g(null);
+    const t = j(e, "modelValue"), r = $t(), n = ct(r), a = g(null);
     return (o, s) => {
       const i = ir;
       return h(), b("div", null, [
         Te(w("input", {
-          id: c(n),
+          id: u(n),
           ref_key: "input",
           ref: a,
           "onUpdate:modelValue": s[0] || (s[0] = (l) => t.value = l),
@@ -1513,7 +1513,7 @@ const Nr = ["id"], Pr = ["for"], jn = /* @__PURE__ */ x({
         }, null, 8, Nr), [
           [Ct, t.value]
         ]),
-        w("label", { for: c(n) }, [
+        w("label", { for: u(n) }, [
           Z(i, {
             class: "cursor-pointer",
             color: t.value ?? "#222"
@@ -1530,7 +1530,7 @@ const Nr = ["id"], Pr = ["for"], jn = /* @__PURE__ */ x({
   setup(e) {
     const r = it(e.theme, !1);
     return (n, a) => (h(), b("div", {
-      style: C([c(r)]),
+      style: C([u(r)]),
       "data-scheme": n.theme.scheme,
       "data-theme": n.theme.name
     }, [
@@ -1539,7 +1539,7 @@ const Nr = ["id"], Pr = ["for"], jn = /* @__PURE__ */ x({
   }
 }), dt = /* @__PURE__ */ x({
   __name: "FullscreenOverlay",
-  props: /* @__PURE__ */ j({
+  props: /* @__PURE__ */ W({
     persistent: { type: Boolean, default: !1 },
     blur: { type: [String, Boolean], default: !1 },
     wrapperClass: {}
@@ -1549,9 +1549,9 @@ const Nr = ["id"], Pr = ["for"], jn = /* @__PURE__ */ x({
   }),
   emits: ["update:modelValue"],
   setup(e) {
-    const t = e, r = U(e, "modelValue"), n = g(null);
-    function a(i) {
-      t.persistent || i.target === n.value && (r.value = !1);
+    const t = e, r = j(e, "modelValue"), n = g(null);
+    function a(c) {
+      t.persistent || c.target === n.value && (r.value = !1);
     }
     const o = m(() => {
       switch (t.blur) {
@@ -1565,28 +1565,31 @@ const Nr = ["id"], Pr = ["for"], jn = /* @__PURE__ */ x({
         default:
           return "";
       }
-    });
-    F(() => {
-      r.value ? document.body.style.overflow = "hidden" : setTimeout(() => {
+    }), s = g(0);
+    X(() => {
+      r.value ? (document.body.style.overflow = "hidden", document.body.style.marginRight = `${s.value}px`) : setTimeout(() => {
         document.querySelector(".modal-wrapper.op100") || (document.body.style.overflow = "", document.body.style.marginRight = "");
       }, 300);
-    });
-    const s = Or();
-    return (i, l) => {
-      const u = Vr;
+    }), new ResizeObserver(() => {
+      const c = window.innerWidth - document.body.clientWidth;
+      c !== 0 && (s.value = c);
+    }).observe(document.body);
+    const l = Or();
+    return (c, d) => {
+      const f = Vr;
       return h(), P(At, { to: "body" }, [
-        Z(u, { theme: c(s) }, {
-          default: W(() => [
+        Z(f, { theme: u(l) }, {
+          default: L(() => [
             w("div", {
               ref_key: "wrapperRef",
               ref: n,
-              class: y(["modal-wrapper fixed left-0 top-0 z-100 h-full w-full bg-surface-lowest/50 transition-all duration-300 md:items-center", [o.value, i.wrapperClass, {
+              class: y(["modal-wrapper fixed left-0 top-0 z-100 h-full w-full bg-surface-lowest/50 transition-all duration-300 md:items-center", [o.value, c.wrapperClass, {
                 "op0 pointer-events-none": !r.value,
                 op100: r.value
               }]]),
               onClick: a
             }, [
-              k(i.$slots, "default")
+              k(c.$slots, "default")
             ], 2)
           ]),
           _: 3
@@ -1596,7 +1599,7 @@ const Nr = ["id"], Pr = ["for"], jn = /* @__PURE__ */ x({
   }
 }), Dr = { class: "flex justify-end p-4 md:px-6 md:py-4 md:pb-0" }, Fr = /* @__PURE__ */ w("i", { class: "i-tabler-x" }, null, -1), Lr = { class: "h-full flex flex-col items-center justify-center px-4 md:px-6" }, Un = /* @__PURE__ */ x({
   __name: "Drawer",
-  props: /* @__PURE__ */ j({
+  props: /* @__PURE__ */ W({
     persistent: { type: Boolean, default: !1 },
     blur: { type: [String, Boolean], default: !1 },
     position: { default: "left" }
@@ -1606,12 +1609,8 @@ const Nr = ["id"], Pr = ["for"], jn = /* @__PURE__ */ x({
   }),
   emits: ["update:modelValue"],
   setup(e) {
-    const t = e, r = U(e, "modelValue");
-    return F(() => {
-      r.value ? document.body.style.overflow = "hidden" : setTimeout(() => {
-        document.querySelector(".modal-wrapper.op100") || (document.body.style.overflow = "", document.body.style.marginRight = "");
-      }, 300);
-    }), (n, a) => {
+    const t = e, r = j(e, "modelValue");
+    return (n, a) => {
       const o = at, s = dt;
       return h(), P(s, {
         modelValue: r.value,
@@ -1619,7 +1618,7 @@ const Nr = ["id"], Pr = ["for"], jn = /* @__PURE__ */ x({
         blur: t.blur,
         persistent: t.persistent
       }, {
-        default: W(() => [
+        default: L(() => [
           Z(rt, {
             "enter-from-class": n.position === "left" ? "-translate-x-1/1" : "translate-x-1/1",
             "enter-to-class": (n.position === "left", "translate-x-0"),
@@ -1628,7 +1627,7 @@ const Nr = ["id"], Pr = ["for"], jn = /* @__PURE__ */ x({
             "enter-active-class": "transition ease-out duration-300",
             "leave-active-class": "transition ease-in duration-200"
           }, {
-            default: W(() => [
+            default: L(() => [
               r.value ? (h(), b("div", {
                 key: 0,
                 class: y(["fixed h-full w-full bg-surface-low md:w-md", n.position === "left" ? "left-0" : "right-0"])
@@ -1640,7 +1639,7 @@ const Nr = ["id"], Pr = ["for"], jn = /* @__PURE__ */ x({
                     class: "text-surface-on hover:text-surface-on",
                     onPointerup: a[0] || (a[0] = (i) => r.value = !1)
                   }, {
-                    default: W(() => [
+                    default: L(() => [
                       Fr
                     ]),
                     _: 1
@@ -1677,15 +1676,15 @@ const Nr = ["id"], Pr = ["for"], jn = /* @__PURE__ */ x({
         n("drop", l);
       }
     });
-    return (l, u) => (h(), b("div", {
+    return (l, c) => (h(), b("div", {
       ref_key: "dropZoneRef",
       ref: a,
       class: y([{
-        "": c(i),
-        " bg-surface-low": !c(i),
+        "": u(i),
+        " bg-surface-low": !u(i),
         "border-dashed": l.dashed
       }, "h-full w-full flex cursor-pointer items-center justify-center rounded"]),
-      onPointerup: u[0] || (u[0] = () => c(s)())
+      onPointerup: c[0] || (c[0] = () => u(s)())
     }, [
       k(l.$slots, "default")
     ], 34));
@@ -1712,7 +1711,7 @@ const Nr = ["id"], Pr = ["for"], jn = /* @__PURE__ */ x({
       var s;
       (s = n.value) != null && s.complete && a();
     });
-    const o = G(t);
+    const o = U(t);
     return (s, i) => (h(), b("div", {
       style: C({
         height: s.height,
@@ -1727,26 +1726,26 @@ const Nr = ["id"], Pr = ["for"], jn = /* @__PURE__ */ x({
         ref: n,
         style: [
           s.style,
-          c(o).style
+          u(o).style
         ],
         src: s.src,
         class: ["h-full w-full object-cover", [
           t.class,
-          c(o).class,
+          u(o).class,
           {
-            hidden: !c(r)
+            hidden: !u(r)
           }
         ]]
       }, s.$attrs, { onLoad: a }), null, 16, ["style", "src", "class"])) : T("", !0),
-      c(r) ? T("", !0) : (h(), b("div", {
+      u(r) ? T("", !0) : (h(), b("div", {
         key: 1,
         class: y(["h-full w-full animate-pulse border-transparent bg-surface-high object-cover", [
           t.class,
-          c(o).class
+          u(o).class
         ]]),
         style: C([
           s.style,
-          c(o).style
+          u(o).style
         ])
       }, null, 6))
     ], 4));
@@ -1807,15 +1806,15 @@ const Nr = ["id"], Pr = ["for"], jn = /* @__PURE__ */ x({
     });
     return (i, l) => (h(), b("div", Wr, [
       w("div", {
-        class: y([[c(o), c(a)], "absolute z-1"])
+        class: y([[u(o), u(a)], "absolute z-1"])
       }, [
         t.ping ? (h(), b("div", {
           key: 0,
           class: y(["absolute box-content animate-ping border-2 border-transparent rounded-full", [
             {
-              [c(r)]: !i.$slots.label
+              [u(r)]: !i.$slots.label
             },
-            c(s)
+            u(s)
           ]])
         }, [
           i.$slots.label ? k(i.$slots, "label", { key: 0 }) : T("", !0)
@@ -1823,9 +1822,9 @@ const Nr = ["id"], Pr = ["for"], jn = /* @__PURE__ */ x({
         w("div", {
           class: y(["top-0 box-content border-2 border-surface-low rounded-full", [
             {
-              [c(r)]: !i.$slots.label
+              [u(r)]: !i.$slots.label
             },
-            c(s)
+            u(s)
           ]])
         }, [
           i.$slots.label ? k(i.$slots, "label", { key: 0 }) : T("", !0)
@@ -1836,7 +1835,7 @@ const Nr = ["id"], Pr = ["for"], jn = /* @__PURE__ */ x({
   }
 }), Yn = /* @__PURE__ */ x({
   __name: "Modal",
-  props: /* @__PURE__ */ j({
+  props: /* @__PURE__ */ W({
     persistent: { type: Boolean, default: !1 },
     blur: { type: [String, Boolean], default: !1 }
   }, {
@@ -1845,12 +1844,8 @@ const Nr = ["id"], Pr = ["for"], jn = /* @__PURE__ */ x({
   }),
   emits: ["update:modelValue"],
   setup(e) {
-    const t = e, r = U(e, "modelValue");
-    return F(() => {
-      r.value ? document.body.style.overflow = "hidden" : setTimeout(() => {
-        document.querySelector(".modal-wrapper.op100") || (document.body.style.overflow = "", document.body.style.marginRight = "");
-      }, 300);
-    }), (n, a) => {
+    const t = e, r = j(e, "modelValue");
+    return (n, a) => {
       const o = dt;
       return h(), P(o, {
         modelValue: r.value,
@@ -1859,7 +1854,7 @@ const Nr = ["id"], Pr = ["for"], jn = /* @__PURE__ */ x({
         persistent: t.persistent,
         "wrapper-class": "flex items-end justify-center"
       }, {
-        default: W(() => [
+        default: L(() => [
           Z(rt, {
             "enter-from-class": "translate-y-1/2",
             "enter-to-class": "translate-y-0",
@@ -1868,7 +1863,7 @@ const Nr = ["id"], Pr = ["for"], jn = /* @__PURE__ */ x({
             "enter-active-class": "transition ease-out duration-300",
             "leave-active-class": "transition ease-in duration-200"
           }, {
-            default: W(() => [
+            default: L(() => [
               r.value ? k(n.$slots, "default", { key: 0 }) : T("", !0)
             ]),
             _: 3
@@ -1899,7 +1894,7 @@ const Nr = ["id"], Pr = ["for"], jn = /* @__PURE__ */ x({
   },
   emits: ["close"],
   setup(e) {
-    const t = e, r = G(t), n = m(() => {
+    const t = e, r = U(t), n = m(() => {
       switch (t.color) {
         case "secondary":
           return "bg-secondary-container";
@@ -1927,17 +1922,17 @@ const Nr = ["id"], Pr = ["for"], jn = /* @__PURE__ */ x({
       return h(), b("div", {
         class: y(["relative min-h-16 min-w-80 w-full flex items-center gap-2 container-low p-3", [
           { "border-0": !o.withBorder },
-          c(r).class,
+          u(r).class,
           {
             "max-w-100": !o.block,
             "w-full": o.block
           }
         ]]),
-        style: C(c(r).style)
+        style: C(u(r).style)
       }, [
         o.icon ? (h(), b("div", {
           key: 0,
-          class: y(["leading-0", c(a)])
+          class: y(["leading-0", u(a)])
         }, [
           o.loading ? (h(), b("i", jr)) : (h(), b("i", {
             key: 1,
@@ -1947,13 +1942,13 @@ const Nr = ["id"], Pr = ["for"], jn = /* @__PURE__ */ x({
           w("div", {
             class: y(["absolute left-[0.25rem] top-[0.25rem] h-[calc(100%-0.5rem)] w-1 rounded-full", [{
               "animate-pulse": o.loading
-            }, c(n)]])
+            }, u(n)]])
           }, null, 2)
         ])),
         w("div", Gr, [
           o.title ? (h(), b("div", {
             key: 0,
-            class: y([c(a), "text-base"])
+            class: y([u(a), "text-base"])
           }, se(o.title), 3)) : T("", !0),
           o.$slots.message ? k(o.$slots, "message", { key: 1 }) : o.message ? (h(), b("div", qr, se(o.message), 1)) : T("", !0)
         ]),
@@ -1964,7 +1959,7 @@ const Nr = ["id"], Pr = ["for"], jn = /* @__PURE__ */ x({
           class: "text-surface-on hover:text-surface-on",
           onClick: s[0] || (s[0] = (l) => o.$emit("close"))
         }, {
-          default: W(() => [
+          default: L(() => [
             Xr
           ]),
           _: 1
@@ -1974,7 +1969,7 @@ const Nr = ["id"], Pr = ["for"], jn = /* @__PURE__ */ x({
   }
 }), ft = /* @__PURE__ */ new Set(), O = /* @__PURE__ */ new WeakMap(), le = /* @__PURE__ */ new WeakMap(), ne = /* @__PURE__ */ new WeakMap(), Ne = /* @__PURE__ */ new WeakMap(), Zr = /* @__PURE__ */ new WeakMap(), ie = /* @__PURE__ */ new WeakMap(), Ce = /* @__PURE__ */ new WeakMap(), ve = /* @__PURE__ */ new WeakSet();
 let J, Fe = 0, Le = 0;
-const X = "__aa_tgt", we = "__aa_del", Ae = "__aa_new", Kr = (e) => {
+const q = "__aa_tgt", we = "__aa_del", Ae = "__aa_new", Kr = (e) => {
   const t = rn(e);
   t && t.forEach((r) => nn(r));
 }, Qr = (e) => {
@@ -1993,14 +1988,14 @@ function Jr(e) {
     o - (r.left + a + r.width),
     s - (r.top + a + r.height),
     r.left - a
-  ].map((d) => `${-1 * Math.floor(d)}px`).join(" "), u = new IntersectionObserver(() => {
+  ].map((d) => `${-1 * Math.floor(d)}px`).join(" "), c = new IntersectionObserver(() => {
     ++n > 1 && oe(e);
   }, {
     root: J,
     threshold: 1,
     rootMargin: l
   });
-  u.observe(e), Ne.set(e, u);
+  c.observe(e), Ne.set(e, c);
 }
 function oe(e) {
   clearTimeout(Ce.get(e));
@@ -2065,14 +2060,14 @@ function rn(e) {
   }, /* @__PURE__ */ new Set());
 }
 function Oe(e, t) {
-  !t && !(X in e) ? Object.defineProperty(e, X, { value: e }) : t && !(X in t) && Object.defineProperty(t, X, { value: e });
+  !t && !(q in e) ? Object.defineProperty(e, q, { value: e }) : t && !(q in t) && Object.defineProperty(t, q, { value: e });
 }
 function nn(e) {
   var t;
   const r = e.isConnected, n = O.has(e);
   r && le.has(e) && le.delete(e), ne.has(e) && ((t = ne.get(e)) === null || t === void 0 || t.cancel()), Ae in e ? Qe(e) : n && r ? an(e) : n && !r ? sn(e) : Qe(e);
 }
-function L(e) {
+function F(e) {
   return Number(e.replace(/[^0-9.\-]/g, ""));
 }
 function on(e) {
@@ -2097,17 +2092,17 @@ function pt(e, t, r) {
   let n = t.width, a = t.height, o = r.width, s = r.height;
   const i = getComputedStyle(e);
   if (i.getPropertyValue("box-sizing") === "content-box") {
-    const u = L(i.paddingTop) + L(i.paddingBottom) + L(i.borderTopWidth) + L(i.borderBottomWidth), d = L(i.paddingLeft) + L(i.paddingRight) + L(i.borderRightWidth) + L(i.borderLeftWidth);
-    n -= d, o -= d, a -= u, s -= u;
+    const c = F(i.paddingTop) + F(i.paddingBottom) + F(i.borderTopWidth) + F(i.borderBottomWidth), d = F(i.paddingLeft) + F(i.paddingRight) + F(i.borderRightWidth) + F(i.borderLeftWidth);
+    n -= d, o -= d, a -= c, s -= c;
   }
   return [n, o, a, s].map(Math.round);
 }
 function Re(e) {
-  return X in e && ie.has(e[X]) ? ie.get(e[X]) : { duration: 250, easing: "ease-in-out" };
+  return q in e && ie.has(e[q]) ? ie.get(e[q]) : { duration: 250, easing: "ease-in-out" };
 }
 function mt(e) {
-  if (X in e)
-    return e[X];
+  if (q in e)
+    return e[q];
 }
 function We(e) {
   const t = mt(e);
@@ -2135,12 +2130,12 @@ function an(e) {
     return;
   const a = Re(e);
   if (typeof a != "function") {
-    const o = t.left - r.left, s = t.top - r.top, [i, l, u, d] = pt(e, t, r), f = {
+    const o = t.left - r.left, s = t.top - r.top, [i, l, c, d] = pt(e, t, r), f = {
       transform: `translate(${o}px, ${s}px)`
     }, v = {
       transform: "translate(0, 0)"
     };
-    i !== l && (f.width = `${i}px`, v.width = `${l}px`), u !== d && (f.height = `${u}px`, v.height = `${d}px`), n = e.animate([f, v], {
+    i !== l && (f.width = `${i}px`, v.width = `${l}px`), c !== d && (f.height = `${c}px`, v.height = `${d}px`), n = e.animate([f, v], {
       duration: a.duration,
       easing: a.easing
     });
@@ -2190,14 +2185,14 @@ function sn(e) {
   const a = window.scrollX, o = window.scrollY;
   if (n && n.parentNode && n.parentNode instanceof Element ? n.parentNode.insertBefore(e, n) : r && r.parentNode ? r.parentNode.appendChild(e) : (t = mt(e)) === null || t === void 0 || t.appendChild(e), !We(e))
     return Je(e);
-  const [s, i, l, u] = cn(e), d = Re(e), f = O.get(e);
+  const [s, i, l, c] = cn(e), d = Re(e), f = O.get(e);
   (a !== Fe || o !== Le) && ln(e, a, o, d);
   let v, S = {
     position: "absolute",
     top: `${s}px`,
     left: `${i}px`,
     width: `${l}px`,
-    height: `${u}px`,
+    height: `${c}px`,
     margin: "0",
     pointerEvents: "none",
     transformOrigin: "center",
@@ -2225,16 +2220,16 @@ function ln(e, t, r, n) {
   if (getComputedStyle(J).scrollBehavior === "smooth" && (document.documentElement.style.scrollBehavior = "auto"), window.scrollTo(window.scrollX + a, window.scrollY + o), !e.parentElement)
     return;
   const l = e.parentElement;
-  let u = l.clientHeight, d = l.clientWidth;
+  let c = l.clientHeight, d = l.clientWidth;
   const f = performance.now();
   function v() {
     requestAnimationFrame(() => {
       if (!_e(n)) {
-        const S = u - l.clientHeight, A = d - l.clientWidth;
+        const S = c - l.clientHeight, A = d - l.clientWidth;
         f + n.duration > performance.now() ? (window.scrollTo({
           left: window.scrollX - A,
           top: window.scrollY - S
-        }), u = l.clientHeight, d = l.clientWidth, v()) : document.documentElement.style.scrollBehavior = s;
+        }), c = l.clientHeight, d = l.clientWidth, v()) : document.documentElement.style.scrollBehavior = s;
       }
     });
   }
@@ -2246,7 +2241,7 @@ function cn(e) {
   for (; a && (getComputedStyle(a).position === "static" || a instanceof HTMLBodyElement); )
     a = a.parentElement;
   a || (a = document.body);
-  const o = getComputedStyle(a), s = O.get(a) || ce(a), i = Math.round(t.top - s.top) - L(o.borderTopWidth), l = Math.round(t.left - s.left) - L(o.borderLeftWidth);
+  const o = getComputedStyle(a), s = O.get(a) || ce(a), i = Math.round(t.top - s.top) - F(o.borderTopWidth), l = Math.round(t.left - s.left) - F(o.borderLeftWidth);
   return [i, l, r, n];
 }
 function un(e, t = {}) {
@@ -2274,7 +2269,7 @@ const dn = {
     return (r, n) => {
       const a = Yr;
       return Te((h(), b("div", fn, [
-        (h(!0), b(K, null, ye(c(t), (o) => (h(), P(a, {
+        (h(!0), b(K, null, ye(u(t), (o) => (h(), P(a, {
           key: o.hash,
           closeable: "",
           "with-border": "",
@@ -2283,10 +2278,10 @@ const dn = {
           icon: o.icon,
           loading: o.loading,
           color: o.color,
-          onClose: (s) => c(t).splice(c(t).indexOf(o), 1)
+          onClose: (s) => u(t).splice(u(t).indexOf(o), 1)
         }, null, 8, ["title", "message", "icon", "loading", "color", "onClose"]))), 128))
       ])), [
-        [c(dn)]
+        [u(dn)]
       ]);
     };
   }
@@ -2311,7 +2306,7 @@ const dn = {
         default:
           return "";
       }
-    }), n = G(t), a = g(null), o = p(t.color).toRgb(), s = m(() => ({
+    }), n = U(t), a = g(null), o = p(t.color).toRgb(), s = m(() => ({
       backgroundColor: `rgba(${o.r}, ${o.g}, ${o.b}, ${t.opacity / 100})`
     }));
     return (i, l) => (h(), b("div", hn, [
@@ -2319,8 +2314,8 @@ const dn = {
       w("div", xe(i.$attrs, {
         ref_key: "wrapperRef",
         ref: a,
-        class: [[c(r), c(n).class], "absolute left-0 top-0 h-full w-full overflow-hidden md:items-center"],
-        style: [c(n).style, c(s)]
+        class: [[u(r), u(n).class], "absolute left-0 top-0 h-full w-full overflow-hidden md:items-center"],
+        style: [u(n).style, u(s)]
       }), [
         k(i.$slots, "content")
       ], 16)
@@ -2335,17 +2330,17 @@ const dn = {
     is: { default: "div" }
   },
   setup(e) {
-    const r = G(e);
+    const r = U(e);
     return (n, a) => (h(), P(ue(n.is), {
       class: y(["container-low rounded-lg p-4", [
         {
           "border-transparent": !n.withBorder
         },
-        c(r).class
+        u(r).class
       ]]),
-      style: C([c(r).style])
+      style: C([u(r).style])
     }, {
-      default: W(() => [
+      default: L(() => [
         k(n.$slots, "default")
       ]),
       _: 3
@@ -2353,7 +2348,7 @@ const dn = {
   }
 }), pn = ["placeholder", "type"], mn = /* @__PURE__ */ x({
   __name: "TextField",
-  props: /* @__PURE__ */ j({
+  props: /* @__PURE__ */ W({
     onChange: {},
     color: { default: "primary" },
     error: { type: Boolean },
@@ -2368,7 +2363,7 @@ const dn = {
   }),
   emits: ["update:modelValue"],
   setup(e, { expose: t }) {
-    const r = e, n = U(e, "modelValue"), a = m(() => {
+    const r = e, n = j(e, "modelValue"), a = m(() => {
       switch (r.size) {
         case "sm":
           return {
@@ -2397,16 +2392,16 @@ const dn = {
         default:
           return "text-surface-on bg-surface-base border-surface-border-base focus:border-primary-container";
       }
-    }), s = m(() => r.disabled ? "pointer-events-none filter grayscale opacity-60" : ""), i = G(r), l = g(null);
+    }), s = m(() => r.disabled ? "pointer-events-none filter grayscale opacity-60" : ""), i = U(r), l = g(null);
     return t({
       el: l
-    }), (u, d) => Te((h(), b("input", {
+    }), (c, d) => Te((h(), b("input", {
       ref_key: "input",
       ref: l,
       "onUpdate:modelValue": d[0] || (d[0] = (f) => n.value = f),
-      class: y(["bg-back-2 border px-2 py-1 outline-none transition-background-color,border-color,color", [c(o), c(s), c(i).class, c(a).base]]),
-      style: C([c(i).style]),
-      placeholder: u.placeholder,
+      class: y(["bg-back-2 border px-2 py-1 outline-none transition-background-color,border-color,color", [u(o), u(s), u(i).class, u(a).base]]),
+      style: C([u(i).style]),
+      placeholder: c.placeholder,
       type: r.password ? "password" : "text"
     }, null, 14, pn)), [
       [Tt, n.value]
@@ -2425,8 +2420,8 @@ const dn = {
     function n(o) {
       o.preventDefault(), o.stopPropagation();
       const s = r.value.findIndex((l) => l.el === o.target), i = o.target.value ?? "";
-      o.target.value = "", Array.from(i).forEach((l, u) => {
-        s + u >= r.value.length || (r.value[s + u].el.value = l, s + u + 1 < r.value.length ? (r.value[s + u + 1].el.focus(), r.value[s + u + 1].el.select()) : r.value[s + u].el.blur());
+      o.target.value = "", Array.from(i).forEach((l, c) => {
+        s + c >= r.value.length || (r.value[s + c].el.value = l, s + c + 1 < r.value.length ? (r.value[s + c + 1].el.focus(), r.value[s + c + 1].el.select()) : r.value[s + c].el.blur());
       });
     }
     function a(o) {
@@ -2483,17 +2478,17 @@ const dn = {
         case "error":
           return "bg-error-7";
       }
-    }), a = G(t);
+    }), a = U(t);
     return (o, s) => (h(), b("div", {
-      class: y(["relative w-full self-center overflow-hidden bg-surface-high transition-background-color,border-color,color", [c(r), c(a).class]]),
-      style: C([c(a).style])
+      class: y(["relative w-full self-center overflow-hidden bg-surface-high transition-background-color,border-color,color", [u(r), u(a).class]]),
+      style: C([u(a).style])
     }, [
       o.loading ? (h(), b("div", {
         key: 1,
-        class: y(["loading-progress h-full", [c(n)]])
+        class: y(["loading-progress h-full", [u(n)]])
       }, null, 2)) : (h(), b("div", {
         key: 0,
-        class: y(["h-full", [c(n)]]),
+        class: y(["h-full", [u(n)]]),
         style: C([{
           width: `${(Number(o.value) - Number(o.min)) / (Number(o.max) - Number(o.min)) * 100}%`
         }])
@@ -2549,32 +2544,28 @@ const oo = /* @__PURE__ */ x({
     } }
   },
   setup(e) {
-    const t = e, r = g(0), n = g(0), a = g(t.theme.scheme);
-    Q && (new ResizeObserver(() => {
-      const d = window.innerWidth - document.body.clientWidth;
-      d !== 0 && (r.value = d), n.value = d;
-    }).observe(document.body), new MutationObserver(() => {
-      a.value !== document.documentElement.dataset.scheme && (a.value = document.documentElement.dataset.scheme);
+    const t = e, r = g(t.theme.scheme);
+    Q && new MutationObserver(() => {
+      r.value !== document.documentElement.dataset.scheme && (r.value = document.documentElement.dataset.scheme);
     }).observe(document.documentElement, {
       attributes: !0,
       attributeFilter: ["data-scheme"]
-    }));
-    const o = m(() => n.value === r.value ? "0px" : `${r.value}px`), s = rr();
-    F(() => {
+    });
+    const n = rr();
+    X(() => {
       if (!Q)
         return "dark";
-      a.value === "dark" ? document.documentElement.dataset.scheme = "dark" : a.value === "light" ? document.documentElement.dataset.scheme = "light" : s.value === "dark" ? document.documentElement.dataset.scheme = "dark" : document.documentElement.dataset.scheme = "light", localStorage.setItem("scheme", document.documentElement.dataset.scheme);
-    }), ge(ut, a);
-    const i = it(t.theme);
-    return (l, u) => (h(), P(ue(l.is), {
+      r.value === "dark" ? document.documentElement.dataset.scheme = "dark" : r.value === "light" ? document.documentElement.dataset.scheme = "light" : n.value === "dark" ? document.documentElement.dataset.scheme = "dark" : document.documentElement.dataset.scheme = "light", localStorage.setItem("scheme", document.documentElement.dataset.scheme);
+    }), ge(ut, r);
+    const a = it(t.theme);
+    return (o, s) => (h(), P(ue(o.is), {
       style: C([
-        c(i),
-        { paddingRight: c(o) }
+        u(a)
       ]),
       class: "text-surface-on transition-background-color,border-color,color"
     }, {
-      default: W(() => [
-        k(l.$slots, "default")
+      default: L(() => [
+        k(o.$slots, "default")
       ]),
       _: 3
     }, 8, ["style"]));
@@ -2582,7 +2573,7 @@ const oo = /* @__PURE__ */ x({
 }), _n = ["id"], xn = ["for"], kn = ["for"], Sn = /* @__PURE__ */ x({
   inheritAttrs: !1,
   __name: "Switch",
-  props: /* @__PURE__ */ j({
+  props: /* @__PURE__ */ W({
     size: { default: "md" },
     animate: { type: Boolean, default: !0 },
     options: {},
@@ -2600,7 +2591,7 @@ const oo = /* @__PURE__ */ x({
   }),
   emits: ["update:modelValue"],
   setup(e) {
-    const t = e, r = U(e, "modelValue");
+    const t = e, r = j(e, "modelValue");
     t.value && (r.value = t.value);
     const n = g(null), a = g(!1), o = m(() => {
       switch (t.size) {
@@ -2652,7 +2643,7 @@ const oo = /* @__PURE__ */ x({
         wrapper: r.value ? `border border-transparent ${d}` : "bg-surface-lowest border border-surface-border-base",
         indicator: t.disabled ? "bg-surface-high" : "bg-white text-primary-container"
       };
-    }), u = G(t);
+    }), c = U(t);
     return (d, f) => (h(), b("div", {
       role: "switch",
       class: y(["relative flex items-center gap-2", {
@@ -2660,7 +2651,7 @@ const oo = /* @__PURE__ */ x({
       }])
     }, [
       Te(w("input", xe({
-        id: c(i),
+        id: u(i),
         "onUpdate:modelValue": f[0] || (f[0] = (v) => r.value = v)
       }, d.$attrs, {
         class: "hidden",
@@ -2670,24 +2661,24 @@ const oo = /* @__PURE__ */ x({
       ]),
       w("label", {
         class: "leading-0 cursor-pointer!",
-        for: c(i)
+        for: u(i)
       }, [
         w("div", {
           ref_key: "wrapper",
           ref: n,
-          class: y([[c(o).wrapper, c(l).wrapper, c(u).class], "relative inline-block transition-all"]),
-          style: C([c(u).style]),
+          class: y([[u(o).wrapper, u(l).wrapper, u(c).class], "relative inline-block transition-all"]),
+          style: C([u(c).style]),
           onPointerdown: f[1] || (f[1] = (v) => a.value = !0),
           onPointerup: f[2] || (f[2] = (v) => a.value = !1),
           onPointerleave: f[3] || (f[3] = (v) => a.value = !1),
           onPointerenter: f[4] || (f[4] = (v) => v.buttons === 1 && (a.value = !0))
         }, [
           w("div", {
-            class: y(["absolute top-50% -translate-y-50%", [c(o).indicator, c(l).indicator, c(s).indicator, r.value ? c(o).active : c(o).inactive, c(u).class]]),
-            style: C([c(u).style])
+            class: y(["absolute top-50% -translate-y-50%", [u(o).indicator, u(l).indicator, u(s).indicator, r.value ? u(o).active : u(o).inactive, u(c).class]]),
+            style: C([u(c).style])
           }, null, 6),
           w("i", {
-            class: y(["absolute top-1/2 -translate-y-50%", [c(o).icon, {
+            class: y(["absolute top-1/2 -translate-y-50%", [u(o).icon, {
               [`left-0 text-${d.color}-on`]: r.value,
               "right-0 text-surface-on ": !r.value,
               [d.onIcon ?? ""]: r.value && d.onIcon,
@@ -2698,7 +2689,7 @@ const oo = /* @__PURE__ */ x({
       ], 8, xn),
       d.label ? (h(), b("label", {
         key: 0,
-        for: c(i)
+        for: u(i)
       }, se(d.label), 9, kn)) : T("", !0)
     ], 2));
   }
@@ -2713,7 +2704,7 @@ const oo = /* @__PURE__ */ x({
         t.value = o ? "dark" : "light";
       }
     });
-    F(() => {
+    X(() => {
       Q && (r.value === !0 ? (document.documentElement.setAttribute("data-scheme", "dark"), localStorage.setItem("scheme", "dark")) : r.value === !1 && (document.documentElement.setAttribute("data-scheme", "light"), localStorage.setItem("scheme", "light")));
     });
     const n = g(!0), a = g(!1);
@@ -2729,34 +2720,34 @@ const oo = /* @__PURE__ */ x({
       const i = Sn;
       return h(), b(K, null, [
         w("div", {
-          class: y({ hidden: !c(n) })
+          class: y({ hidden: !u(n) })
         }, [
           w("div", Mn, [
             Z(i, {
               value: !1,
-              "on-icon": "i-tabler-moon",
-              "off-icon": "i-tabler-sun"
+              "on-icon": "i-line-md-moon-twotone-alt-loop",
+              "off-icon": "i-line-md-sunny-outline-twotone-loop"
             })
           ]),
           w("div", $n, [
             Z(i, {
               value: !0,
               color: "secondary",
-              "on-icon": "i-tabler-moon",
-              "off-icon": "i-tabler-sun"
+              "on-icon": "i-line-md-moon-twotone-alt-loop",
+              "off-icon": "i-line-md-sunny-outline-twotone-loop"
             })
           ])
         ], 2),
         w("div", {
-          class: y({ hidden: c(n) })
+          class: y({ hidden: u(n) })
         }, [
           Z(i, {
-            modelValue: c(r),
+            modelValue: u(r),
             "onUpdate:modelValue": s[0] || (s[0] = (l) => Bt(r) ? r.value = l : null),
-            animate: c(a),
+            animate: u(a),
             color: "secondary",
-            "on-icon": "i-tabler-moon",
-            "off-icon": "i-tabler-sun"
+            "on-icon": "i-line-md-moon-twotone-alt-loop",
+            "off-icon": "i-line-md-sunny-outline-twotone-loop"
           }, null, 8, ["modelValue", "animate"])
         ], 2)
       ], 64);
@@ -2769,7 +2760,7 @@ const oo = /* @__PURE__ */ x({
   Bn
 ], so = /* @__PURE__ */ x({
   __name: "Select",
-  props: /* @__PURE__ */ j({
+  props: /* @__PURE__ */ W({
     options: { default() {
       return [];
     } },
@@ -2781,17 +2772,17 @@ const oo = /* @__PURE__ */ x({
     modelValue: { default: void 0 },
     modelModifiers: {}
   }),
-  emits: /* @__PURE__ */ j(["change"], ["update:modelValue"]),
+  emits: /* @__PURE__ */ W(["change"], ["update:modelValue"]),
   setup(e, { emit: t }) {
-    const r = e, n = t, a = G(r), o = U(e, "modelValue"), s = g(null), i = g(null), { focused: l } = tr(s), u = m(() => r.options.map((_) => E(_)).indexOf(o.value)), d = g(-1), f = g(-1);
-    F(() => {
+    const r = e, n = t, a = U(r), o = j(e, "modelValue"), s = g(null), i = g(null), { focused: l } = tr(s), c = m(() => r.options.map((_) => E(_)).indexOf(o.value)), d = g(-1), f = g(-1);
+    X(() => {
       l.value || (f.value = -1);
-    }), F(() => {
-      o.value = E(r.options[u.value]);
+    }), X(() => {
+      o.value = E(r.options[c.value]);
     }), de(o, () => {
       n("change", o.value);
     });
-    const v = r.options, S = m(() => v[u.value]), A = m(() => z(S.value));
+    const v = r.options, S = m(() => v[c.value]), A = m(() => z(S.value));
     function z(_) {
       if (_)
         return typeof _ == "string" || typeof _ == "symbol" || typeof _ == "number" ? _ : _.label;
@@ -2844,39 +2835,39 @@ const oo = /* @__PURE__ */ x({
         w("input", {
           ref_key: "inputRef",
           ref: s,
-          class: y([[c(Se).input, c(Me).wrapper, c(a).class], "r-select-input cursor-pointer border outline-none outline-none focus-visible:outline-2"]),
+          class: y([[u(Se).input, u(Me).wrapper, u(a).class], "r-select-input cursor-pointer border outline-none outline-none focus-visible:outline-2"]),
           placeholder: _.placeholder,
-          style: C([c(a).style]),
+          style: C([u(a).style]),
           readonly: "",
-          value: c(A),
+          value: u(A),
           "aria-haspopup": "listbox",
           autocomplete: "off",
           onFocus: pe[0] || (pe[0] = ($) => l.value = !0)
         }, null, 46, An),
         Tn
       ]),
-      c(l) ? (h(), b("div", {
+      u(l) ? (h(), b("div", {
         key: 0,
-        class: y([c(Me).dropdown, "absolute z-10 mt-2 w-full flex-col overflow-hidden border container-base rounded p-1"])
+        class: y([u(Me).dropdown, "absolute z-10 mt-2 w-full flex-col overflow-hidden border container-base rounded p-1"])
       }, [
-        c(v).length === 0 ? (h(), b("div", zn, se(_.noneText), 1)) : (h(!0), b(K, { key: 1 }, ye(c(v), ($, R) => (h(), b("div", {
+        u(v).length === 0 ? (h(), b("div", zn, se(_.noneText), 1)) : (h(!0), b(K, { key: 1 }, ye(u(v), ($, R) => (h(), b("div", {
           key: E($),
           class: y([{
-            "hover:bg-surface-high border-transparent": c(f) !== R,
-            "container-filled-primary": c(f) === R
+            "hover:bg-surface-high border-transparent": u(f) !== R,
+            "container-filled-primary": u(f) === R
           }, "flex cursor-pointer items-center justify-between gap-2 border rounded p-1 px-2"]),
           onPointerdown: (B) => he($),
           onHover: (B) => d.value = R
         }, [
           Ot(se(z($)) + " ", 1),
-          $ === c(S) ? (h(), b("div", Rn, On)) : T("", !0)
+          $ === u(S) ? (h(), b("div", Rn, On)) : T("", !0)
         ], 42, En))), 128))
       ], 2)) : T("", !0)
     ], 512));
   }
 }), Hn = { class: "relative inline-block w-full" }, lo = /* @__PURE__ */ x({
   __name: "Slider",
-  props: /* @__PURE__ */ j({
+  props: /* @__PURE__ */ W({
     size: { default: "md" },
     animate: { type: Boolean, default: !1 },
     width: {},
@@ -2910,7 +2901,7 @@ const oo = /* @__PURE__ */ x({
         B.push(R[Math.round(Y * I)]);
       return B.push(R[R.length - 1]), B;
     }
-    const a = m(() => t.options ? t.options.length : t.tickNum ?? 0), o = m(() => t.options === void 0 ? r(t.min, t.max, t.step) : t.options), s = m(() => n(a.value, o.value)), i = U(e, "modelValue"), l = m(() => o.value.length ?? 0), u = g(o.value.includes(i.value) ? o.value.indexOf(i.value) : 0);
+    const a = m(() => t.options ? t.options.length : t.tickNum ?? 0), o = m(() => t.options === void 0 ? r(t.min, t.max, t.step) : t.options), s = m(() => n(a.value, o.value)), i = j(e, "modelValue"), l = m(() => o.value.length ?? 0), c = g(o.value.includes(i.value) ? o.value.indexOf(i.value) : 0);
     function d($) {
       return o.value.indexOf($);
     }
@@ -2937,8 +2928,8 @@ const oo = /* @__PURE__ */ x({
           return "dark:bg-error-container bg-white";
       }
     });
-    F(() => {
-      i.value = o.value[u.value];
+    X(() => {
+      i.value = o.value[c.value];
     });
     const A = g(), z = g(), E = Kt(A), he = g(!1);
     function Se($) {
@@ -2951,23 +2942,23 @@ const oo = /* @__PURE__ */ x({
       $.preventDefault(), $.stopPropagation();
       const { clientX: B } = $, I = E.left.value, _t = E.right.value - I, Be = Math.round((B - I) / _t * (l.value - 1));
       if (Be < 0) {
-        u.value = 0;
+        c.value = 0;
         return;
       }
       if (Be > l.value - 1) {
-        u.value = l.value - 1;
+        c.value = l.value - 1;
         return;
       }
-      u.value = Be;
+      c.value = Be;
     }
-    F(() => {
-      u.value = d(i.value);
+    X(() => {
+      c.value = d(i.value);
     });
     function Me($) {
       $.preventDefault(), $.stopPropagation(), he.value = !0, Se($);
     }
     N(A, "pointerdown", Me), ee(() => {
-      N(document, "pointermove", Se), u.value = Math.max(0, d(i.value));
+      N(document, "pointermove", Se), c.value = Math.max(0, d(i.value));
     });
     const _ = m(() => {
       switch (t.size) {
@@ -3014,44 +3005,44 @@ const oo = /* @__PURE__ */ x({
         ref_key: "wrapper",
         ref: A,
         type: "size",
-        class: y(["w-full flex cursor-pointer items-center", c(_).wrapper]),
+        class: y(["w-full flex cursor-pointer items-center", u(_).wrapper]),
         onTouchmove: R[0] || (R[0] = ot(() => {
         }, ["prevent"]))
       }, [
         w("div", {
-          class: y(["w-full rounded-full bg-surface-lowest transition-background-color,border-color,color", c(_).innerWrapper])
+          class: y(["w-full rounded-full bg-surface-lowest transition-background-color,border-color,color", u(_).innerWrapper])
         }, [
           w("div", {
-            class: y(["relative flex", c(_).content]),
+            class: y(["relative flex", u(_).content]),
             style: C({
               width: `${t.width}rem`,
               minWidth: `${t.minWidth}rem`
             })
           }, [
-            (h(!0), b(K, null, ye(c(s), (B) => (h(), b("div", {
+            (h(!0), b(K, null, ye(u(s), (B) => (h(), b("div", {
               key: B,
               style: C({
-                left: `${d(B) / (c(l) - 1) * 100}%`
+                left: `${d(B) / (u(l) - 1) * 100}%`
               }),
-              class: y(["absolute top-50% rounded-full bg-white", c(_).tick])
+              class: y(["absolute top-50% rounded-full bg-white", u(_).tick])
             }, null, 6))), 128)),
-            c(u) !== -1 ? (h(), b("div", {
+            u(c) !== -1 ? (h(), b("div", {
               key: 0,
               ref_key: "indicator",
               ref: z,
-              class: y(["absolute top-50% cursor-pointer rounded-full transition-background-color,border-color,color", [c(_).indicator, c(pe).indicator, c(v)]]),
+              class: y(["absolute top-50% cursor-pointer rounded-full transition-background-color,border-color,color", [u(_).indicator, u(pe).indicator, u(v)]]),
               style: C({
-                left: `${c(u) / (c(l) - 1) * 100}%`
+                left: `${u(c) / (u(l) - 1) * 100}%`
               })
             }, [
               w("div", {
-                class: y(["pointer-events-none absolute left-50% top-50% rounded-full transition-background-color,border-color,color", [c(_).indicatorInner, c(S)]])
+                class: y(["pointer-events-none absolute left-50% top-50% rounded-full transition-background-color,border-color,color", [u(_).indicatorInner, u(S)]])
               }, null, 2)
             ], 6)) : T("", !0),
             w("div", {
-              class: y(["pointer-events-none h-full rounded-full", [c(_).progress, c(pe).progress, c(f)]]),
+              class: y(["pointer-events-none h-full rounded-full", [u(_).progress, u(pe).progress, u(f)]]),
               style: C({
-                width: `${c(u) / (c(l) - 1) * 100}%`
+                width: `${u(c) / (u(l) - 1) * 100}%`
               })
             }, null, 6)
           ], 6)
@@ -3063,12 +3054,12 @@ const oo = /* @__PURE__ */ x({
           width: `${t.width}rem`
         })
       }, [
-        (h(!0), b(K, null, ye(c(s), (B, I) => (h(), b("div", {
+        (h(!0), b(K, null, ye(u(s), (B, I) => (h(), b("div", {
           key: I,
           style: C({
-            left: `${d(B) / (c(l) - 1) * 100}%`
+            left: `${d(B) / (u(l) - 1) * 100}%`
           }),
-          class: y(["absolute w-auto flex rounded-full -translate-x-50%", c(_).tick])
+          class: y(["absolute w-auto flex rounded-full -translate-x-50%", u(_).tick])
         }, se(B), 7))), 128))
       ], 4)
     ]));
@@ -3099,26 +3090,26 @@ const oo = /* @__PURE__ */ x({
           return "absolute inset-0 right-100% h-full w-2px bg-primary-container transition-background-color,border-color,color";
       }
     }), l = m(() => a.value ? "bg-primary-container" : "bg-surface-lowest");
-    return (u, d) => (h(), b("button", {
+    return (c, d) => (h(), b("button", {
       type: "button",
-      class: y(["relative min-w-20 flex items-center justify-center", [c(s)]]),
+      class: y(["relative min-w-20 flex items-center justify-center", [u(s)]]),
       onClick: o
     }, [
-      c(a) ? (h(), b("div", {
+      u(a) ? (h(), b("div", {
         key: 0,
-        class: y([c(i), c(l)])
+        class: y([u(i), u(l)])
       }, null, 2)) : (h(), b("div", {
         key: 1,
-        class: y([c(i), c(l)])
+        class: y([u(i), u(l)])
       }, null, 2)),
       w("div", Nn, [
-        k(u.$slots, "default")
+        k(c.$slots, "default")
       ])
     ], 2));
   }
 }), co = /* @__PURE__ */ x({
   __name: "Tabs",
-  props: /* @__PURE__ */ j({
+  props: /* @__PURE__ */ W({
     defaultValue: {},
     direction: { default: "horizontal" }
   }, {
@@ -3128,13 +3119,13 @@ const oo = /* @__PURE__ */ x({
   emits: ["update:modelValue"],
   setup(e) {
     const t = e, r = nt(), n = m(() => {
-      var u;
-      const i = (u = r.default) == null ? void 0 : u.call(r);
+      var c;
+      const i = (c = r.default) == null ? void 0 : c.call(r);
       return (i == null ? void 0 : i.flatMap((d) => d.type === K ? d.children : d).filter((d) => {
         var f;
         return ((f = d == null ? void 0 : d.props) == null ? void 0 : f.value) !== void 0;
       }).map((d) => d.props.value)) ?? [];
-    }), a = U(e, "modelValue");
+    }), a = j(e, "modelValue");
     !a.value && n.value.length > 0 && (a.value = n.value[0]), ee(() => {
       t.defaultValue && (a.value = t.defaultValue);
     }), ge(yt, a);
@@ -3169,7 +3160,7 @@ const oo = /* @__PURE__ */ x({
       }
     });
     return (i, l) => (h(), b("div", {
-      class: y(["flex", [c(s)]])
+      class: y(["flex", [u(s)]])
     }, [
       k(i.$slots, "default")
     ], 2));