vuesp-components 0.2.7 → 0.2.8

package/dist/vuesp-components.es.js

@@ -1,4 +1,4 @@
-import { ref as I, computed as M, createElementBlock as c, openBlock as l, createElementVNode as n, createCommentVNode as L, normalizeClass as H, toDisplayString as V, mergeProps as S, withKeys as X, renderSlot as x, createTextVNode as z, resolveDirective as s1, withDirectives as i1, createVNode as p, Transition as Y, withCtx as _, normalizeStyle as D, defineComponent as w, Fragment as F, renderList as j, createBlock as $, resolveDynamicComponent as P, unref as c1, onMounted as U, normalizeProps as G, guardReactiveProps as K, createStaticVNode as u1, resolveComponent as b, Teleport as d1, withModifiers as T, TransitionGroup as f1 } from "vue";
+import { ref as z, computed as M, createElementBlock as c, openBlock as l, createElementVNode as n, createCommentVNode as L, normalizeClass as H, toDisplayString as V, mergeProps as B, withKeys as X, renderSlot as b, createTextVNode as S, resolveDirective as s1, withDirectives as i1, createVNode as p, Transition as Y, withCtx as _, normalizeStyle as U, defineComponent as w, Fragment as j, renderList as O, createBlock as k, resolveDynamicComponent as G, unref as c1, onMounted as K, normalizeProps as F, guardReactiveProps as A, createStaticVNode as u1, resolveComponent as x, Teleport as d1, withModifiers as N, TransitionGroup as f1 } from "vue";
 const v1 = {
   mounted(t, e) {
     t.clickOutsideEvent = function(s) {
@@ -28,30 +28,30 @@ var p1 = { class: "w-full relative" }, C1 = ["value", "disabled", "type"], _1 =
   },
   emits: ["update:modelValue", "click", "on-icon", "enter", "blur"],
   setup: function(t, e) {
-    var s = e.emit, o = t, a = s, r = I(!1), i = M(function() {
+    var s = e.emit, o = t, r = s, a = z(!1), i = M(function() {
       return [
         o.message ? "border-red-500 hover:border-red-400 dark:border-red-700 hover:dark:border-red-800" : "",
         o.disabled ? "border-gray-400 opacity-40" : "border-gray-300 hover:border-gray-400 dark:border-gray-700/50 hover:dark:border-gray-600/50"
       ];
-    }), f = function(v) {
-      return v || v === 0;
+    }), v = function(m) {
+      return m || m === 0;
     }, u = M(function() {
-      return [g1, r.value || f(o.modelValue) || o.active ? "top-0 left-3 text-xs" : "top-1/2"];
-    }), d = function(v) {
-      var B = v.target;
-      a("update:modelValue", B.value);
-    }, m = function(v) {
-      r.value = !1, a("blur", v);
-    }, C = function(v) {
-      return a("enter", v);
+      return [g1, a.value || v(o.modelValue) || o.active ? "top-0 left-3 text-xs" : "top-1/2"];
+    }), d = function(m) {
+      var I = m.target;
+      r("update:modelValue", I.value);
+    }, f = function(m) {
+      a.value = !1, r("blur", m);
+    }, C = function(m) {
+      return r("enter", m);
     }, y = function() {
-      return r.value = !0;
-    }, h = function(v) {
-      return a("click", v);
-    }, Z = function(v) {
-      o.disabled || a("on-icon", v);
+      return a.value = !0;
+    }, h = function(m) {
+      return r("click", m);
+    }, Z = function(m) {
+      o.disabled || r("on-icon", m);
     };
-    return function(v, B) {
+    return function(m, I) {
       return l(), c("div", p1, [
         n("label", {
           class: H(["relative w-full h-[40px] border border-gray-300 dark:border-gray-700 flex items-center rounded transition dark:bg-gray-800", i.value])
@@ -59,31 +59,31 @@ var p1 = { class: "w-full relative" }, C1 = ["value", "disabled", "type"], _1 =
           n("span", {
             class: H(["absolute left-4 transition-all rounded -translate-y-1/2 text-gray-600 dark:text-gray-400", u.value])
           }, V(t.label), 3),
-          n("input", S(v.$attrs, {
+          n("input", B(m.$attrs, {
             value: t.modelValue,
             disabled: t.disabled,
             type: t.type,
             class: "w-full h-full px-4 outline-none overflow-ellipsis flex-auto overflow-hidden w-[calc(100% - 20px)] bg-transparent",
             onFocus: y,
-            onBlur: m,
+            onBlur: f,
             onInput: d,
             onClick: h,
             onKeypress: X(C, ["enter"])
           }), null, 16, C1),
-          v.$slots.icon ? (l(), c("button", {
+          m.$slots.icon ? (l(), c("button", {
             key: 0,
             disabled: t.disabled,
             style: { flex: "0 0 50px" },
             class: "h-full flex items-center justify-center text-gray-400 border-l border-gray-300 dark:border-gray-700/50",
             onClick: Z
           }, [
-            x(v.$slots, "icon")
+            b(m.$slots, "icon")
           ], 8, _1)) : L("", !0)
         ], 2),
         t.hideMessage ? L("", !0) : (l(), c("div", h1, [
-          x(v.$slots, "message", {}, function() {
+          b(m.$slots, "message", {}, function() {
             return [
-              z(V(t.message), 1)
+              S(V(t.message), 1)
             ];
           })
         ]))
@@ -101,24 +101,24 @@ var p1 = { class: "w-full relative" }, C1 = ["value", "disabled", "type"], _1 =
   },
   emits: ["click", "show", "close"],
   setup: function(t, e) {
-    var s = e.emit, o = t, a = s, r = I(!1), i = M(function() {
+    var s = e.emit, o = t, r = s, a = z(!1), i = M(function() {
       return { top: o.top, left: o.left, right: o.right, "max-height": o.height };
-    }), f = function() {
-      r.value && m();
+    }), v = function() {
+      a.value && f();
     }, u = function() {
-      r.value ? o.hideOnClick && m() : d(), a("click", r.value);
+      a.value ? o.hideOnClick && f() : d(), r("click", a.value);
     }, d = function(C) {
-      r.value = !0, a("show", C);
-    }, m = function(C) {
-      r.value = !1, a("close", C);
+      a.value = !0, r("show", C);
+    }, f = function(C) {
+      a.value = !1, r("close", C);
     };
     return function(C, y) {
       var h = s1("outside");
       return i1((l(), c("div", y1, [
         n("div", b1, [
-          x(C.$slots, "activator", {
+          b(C.$slots, "activator", {
             on: { click: u },
-            show: r.value
+            show: a.value
           })
         ]),
         p(Y, {
@@ -131,16 +131,16 @@ var p1 = { class: "w-full relative" }, C1 = ["value", "disabled", "type"], _1 =
         }, {
           default: _(function() {
             return [
-              r.value ? (l(), c("div", {
+              a.value ? (l(), c("div", {
                 key: 0,
                 class: "z-10 min-w-full absolute overflow-auto shadow-lg",
-                style: D(i.value),
+                style: U(i.value),
                 onClick: u
               }, [
-                x(C.$slots, "default", {
+                b(C.$slots, "default", {
                   show: d,
-                  hide: m,
-                  isShown: r.value
+                  hide: f,
+                  isShown: a.value
                 })
               ], 4)) : L("", !0)
             ];
@@ -148,7 +148,7 @@ var p1 = { class: "w-full relative" }, C1 = ["value", "disabled", "type"], _1 =
           _: 3
         })
       ])), [
-        [h, f]
+        [h, v]
       ]);
     };
   }
@@ -160,37 +160,37 @@ const x1 = { class: "bg-white dark:bg-gray-800" }, V1 = ["onClick"], J = /* @__P
   },
   emits: ["click"],
   setup(t, { emit: e }) {
-    const s = e, o = (a) => s("click", a);
-    return (a, r) => (l(), c("ul", x1, [
-      (l(!0), c(F, null, j(a.list, (i, f) => (l(), c("li", {
-        key: "list_" + f,
+    const s = e, o = (r) => s("click", r);
+    return (r, a) => (l(), c("ul", x1, [
+      (l(!0), c(j, null, O(r.list, (i, v) => (l(), c("li", {
+        key: "list_" + v,
         class: "whitespace-nowrap cursor-pointer flex items-center min-h-[40px] py-1 px-4 border-b last:border-b-0 dark:border-gray-700 border-gray-200 hover:bg-gray-50 dark:hover:bg-gray-700",
         onClick: (u) => o(i)
       }, [
-        x(a.$slots, "default", { item: i }, () => [
-          z(V(i.name), 1)
+        b(r.$slots, "default", { item: i }, () => [
+          S(V(i.name), 1)
         ])
       ], 8, V1))), 128))
     ]));
   }
 }), g = (t, e) => {
   const s = t.__vccOpts || t;
-  for (const [o, a] of e)
-    s[o] = a;
+  for (const [o, r] of e)
+    s[o] = r;
   return s;
 };
-var k1 = {}, $1 = {
+var $1 = {}, k1 = {
   viewBox: "0 0 24 24",
   width: "24",
   height: "24",
   fill: "currentColor"
 };
 function w1(t, e) {
-  return l(), c("svg", $1, e[0] || (e[0] = [
+  return l(), c("svg", k1, e[0] || (e[0] = [
     n("path", { d: "M11.9999 13.1714L16.9497 8.22168L18.3639 9.63589L11.9999 15.9999L5.63599 9.63589L7.0502 8.22168L11.9999 13.1714Z" }, null, -1)
   ]));
 }
-const N = /* @__PURE__ */ g(k1, [["render", w1]]);
+const D = /* @__PURE__ */ g($1, [["render", w1]]);
 var M1 = {
   key: 0,
   class: "p-4 py-2"
@@ -206,41 +206,41 @@ var M1 = {
   },
   emits: ["change"],
   setup: function(t) {
-    var e = t, s = I(""), o = M(function() {
+    var e = t, s = z(""), o = M(function() {
       return e.value;
-    }), a = M(function() {
+    }), r = M(function() {
       var d = e?.list || [];
-      return d.filter(function(m) {
-        return s.value ? m[e.valueName].toLowerCase().includes(s.value.toLowerCase()) : !0;
+      return d.filter(function(f) {
+        return s.value ? f[e.valueName].toLowerCase().includes(s.value.toLowerCase()) : !0;
       });
-    }), r = M(function() {
+    }), a = M(function() {
       return e.placeholder;
     }), i = M(function() {
       var d;
-      return !(!((d = a?.value) === null || d === void 0) && d.length);
-    }), f = function(d) {
+      return !(!((d = r?.value) === null || d === void 0) && d.length);
+    }), v = function(d) {
       return s.value = d.target.value;
     }, u = function(d) {
       return { "rotate-x-180": d };
     };
-    return function(d, m) {
-      return l(), $(W, S(d.$attrs, { top: "50px" }), {
+    return function(d, f) {
+      return l(), k(W, B(d.$attrs, { top: "50px" }), {
         activator: _(function(C) {
           var y = C.show, h = C.on;
           return [
             p(R, {
               value: y ? s.value : o.value,
-              placeholder: y ? "Search" : r.value,
+              placeholder: y ? "Search" : a.value,
               onClick: h.click,
-              onInput: f,
+              onInput: v,
               onOnIcon: h.click,
-              onFocus: m[0] || (m[0] = function(Z) {
+              onFocus: f[0] || (f[0] = function(Z) {
                 return s.value = "";
               })
             }, {
               icon: _(function() {
                 return [
-                  p(N, {
+                  p(D, {
                     class: H(["transition", u(y)])
                   }, null, 8, ["class"])
                 ];
@@ -253,17 +253,17 @@ var M1 = {
           return [
             n("div", null, [
               p(J, {
-                list: a.value,
-                onClick: m[1] || (m[1] = function(C) {
+                list: r.value,
+                onClick: f[1] || (f[1] = function(C) {
                   return d.$emit("change", C);
                 })
               }, {
                 default: _(function(C) {
                   var y = C.item;
                   return [
-                    x(d.$slots, "default", { item: y }, function() {
+                    b(d.$slots, "default", { item: y }, function() {
                       return [
-                        z(V(y[t.valueName]), 1)
+                        S(V(y[t.valueName]), 1)
                       ];
                     })
                   ];
@@ -288,21 +288,21 @@ const L1 = { class: "flex items-center gap-1.5" }, Z1 = /* @__PURE__ */ w({
   setup(t, { emit: e }) {
     return (s, o) => (l(), c("nav", null, [
       n("ol", L1, [
-        (l(!0), c(F, null, j(s.items, (a, r) => (l(), c("li", {
-          key: r,
-          class: H(["inline-flex items-center gap-1.5 text-sm text-gray-500 dark:text-gray-400", a.path ? "" : "text-gray-800 dark:text-white/90"])
+        (l(!0), c(j, null, O(s.items, (r, a) => (l(), c("li", {
+          key: a,
+          class: H(["inline-flex items-center gap-1.5 text-sm text-gray-500 dark:text-gray-400", r.path ? "" : "text-gray-800 dark:text-white/90"])
         }, [
-          x(s.$slots, "default", { item: a }, () => [
-            (l(), $(P(a.path ? "a" : "span"), {
-              href: a.path
+          b(s.$slots, "default", { item: r }, () => [
+            (l(), k(G(r.path ? "a" : "span"), {
+              href: r.path
             }, {
               default: _(() => [
-                z(V(a.name), 1)
+                S(V(r.name), 1)
               ]),
               _: 2
             }, 1032, ["href"]))
           ]),
-          a.path ? (l(), $(N, {
+          r.path ? (l(), k(D, {
             key: 0,
             class: "rotate-270"
           })) : L("", !0)
@@ -323,21 +323,21 @@ const L1 = { class: "flex items-center gap-1.5" }, Z1 = /* @__PURE__ */ w({
   },
   emits: ["click"],
   setup(t, { emit: e }) {
-    const s = e, o = (v) => s("click", v), a = t.outline ? "border border-green-600 text-green-600" : "bg-green-600 dark:bg-green-800", r = t.outline ? "border border-red-600 text-red-600" : "bg-red-600 dark:bg-red-800", i = t.outline ? "border border-gray-600 text-gray-600" : "bg-gray-700 dark:bg-gray-800", f = t.outline ? "border border-blue-600 text-blue-600" : "bg-blue-700 dark:bg-blue-800", u = { green: a, red: r, gray: i, blue: f }, d = {
+    const s = e, o = (m) => s("click", m), r = t.outline ? "border border-green-600 text-green-600" : "bg-green-600 dark:bg-green-800", a = t.outline ? "border border-red-600 text-red-600" : "bg-red-600 dark:bg-red-800", i = t.outline ? "border border-gray-600 text-gray-600" : "bg-gray-700 dark:bg-gray-800", v = t.outline ? "border border-blue-600 text-blue-600" : "bg-blue-700 dark:bg-blue-800", u = { green: r, red: a, gray: i, blue: v }, d = {
       button: "px-4",
       icon: "h-10 w-10 rounded-full border border-gray-200 dark:border-gray-800"
-    }, m = { normal: "h-10", small: "h-8" }, C = (v) => m?.[v] || "", y = (v) => d?.[v] || "", h = (v) => t.type === "icon" ? "" : `${t.outline ? "dark:text-white" : "text-white"} ${u?.[v] || ""}`, Z = M(() => [B1, h(t.color), y(t.type), C(t.size), { "w-full": t.block }]);
-    return (v, B) => (l(), c("button", {
+    }, f = { normal: "h-10", small: "h-8" }, C = (m) => f?.[m] || "", y = (m) => d?.[m] || "", h = (m) => t.type === "icon" ? "" : `${t.outline ? "dark:text-white" : "text-white"} ${u?.[m] || ""}`, Z = M(() => [B1, h(t.color), y(t.type), C(t.size), { "w-full": t.block }]);
+    return (m, I) => (l(), c("button", {
       class: H(Z.value),
-      disabled: v.disabled,
+      disabled: m.disabled,
       onClick: o
     }, [
       n("span", {
-        class: H(v.loading ? "opacity-0" : "")
+        class: H(m.loading ? "opacity-0" : "")
       }, [
-        x(v.$slots, "default")
+        b(m.$slots, "default")
       ], 2),
-      v.loading ? (l(), $(c1(e1), {
+      m.loading ? (l(), k(c1(e1), {
         key: 0,
         class: "absolute left-1/2 -translate-x-1/2"
       })) : L("", !0)
@@ -374,18 +374,18 @@ const e1 = /* @__PURE__ */ g(z1, [["render", A1]]), j1 = ["checked", "disabled"]
   },
   emits: ["update:modelValue"],
   setup(t, { emit: e }) {
-    const s = e, o = ({ target: a }) => s("update:modelValue", a.checked);
-    return (a, r) => (l(), c("label", {
-      class: H(["inline-flex items-center relative", { "cursor-pointer": !a.disabled }])
+    const s = e, o = ({ target: r }) => s("update:modelValue", r.checked);
+    return (r, a) => (l(), c("label", {
+      class: H(["inline-flex items-center relative", { "cursor-pointer": !r.disabled }])
     }, [
       n("input", {
         type: "checkbox",
-        checked: a.modelValue,
-        disabled: a.disabled,
+        checked: r.modelValue,
+        disabled: r.disabled,
         class: "peer h-5 w-5 transition-all appearance-none rounded border border-gray-300 dark:border-gray-700 disabled:opacity-40",
         onChange: o
       }, null, 40, j1),
-      r[0] || (r[0] = n("span", { class: "absolute opacity-0 peer-checked:opacity-100 peer-disabled:opacity-40 top-1/2 left-[10px] transform -translate-x-1/2 -translate-y-1/2 pointer-events-none" }, [
+      a[0] || (a[0] = n("span", { class: "absolute opacity-0 peer-checked:opacity-100 peer-disabled:opacity-40 top-1/2 left-[10px] transform -translate-x-1/2 -translate-y-1/2 pointer-events-none" }, [
         n("svg", {
           class: "h-3.5 w-3.5",
           viewBox: "0 0 20 20",
@@ -401,7 +401,7 @@ const e1 = /* @__PURE__ */ g(z1, [["render", A1]]), j1 = ["checked", "disabled"]
         ])
       ], -1)),
       n("span", T1, [
-        x(a.$slots, "default")
+        b(r.$slots, "default")
       ])
     ], 2));
   }
@@ -413,15 +413,15 @@ var N1 = { class: "v-expansion__content max-h-0 overflow-hidden transition-all d
     value: { type: Boolean, default: !1 }
   },
   setup: function(t) {
-    var e = t, s = I(null), o = I(e.value), a = function() {
+    var e = t, s = z(null), o = z(e.value), r = function() {
       var i = s.value.querySelector(".v-expansion__content");
       i.style.maxHeight = o.value ? "".concat(i.scrollHeight, "px") : "0";
-    }, r = function() {
-      o.value = !o.value, a();
+    }, a = function() {
+      o.value = !o.value, r();
     };
-    return U(function() {
-      a();
-    }), function(i, f) {
+    return K(function() {
+      r();
+    }), function(i, v) {
       return l(), c("div", {
         ref_key: "root",
         ref: s,
@@ -429,18 +429,18 @@ var N1 = { class: "v-expansion__content max-h-0 overflow-hidden transition-all d
       }, [
         n("div", {
           class: "cursor-pointer min-h-[60px] px-4 flex items-center justify-between",
-          onClick: r
+          onClick: a
         }, [
           n("h4", null, V(t.label), 1),
           n("div", {
             class: H(["transition text-gray-400", { "rotate-180": o.value }])
           }, [
-            p(N)
+            p(D)
           ], 2)
         ]),
         n("div", N1, [
           n("div", E1, [
-            x(i.$slots, "default")
+            b(i.$slots, "default")
           ])
         ])
       ], 512);
@@ -448,9 +448,9 @@ var N1 = { class: "v-expansion__content max-h-0 overflow-hidden transition-all d
   }
 }, q = function() {
   return q = Object.assign || function(e) {
-    for (var s, o = 1, a = arguments.length; o < a; o++) {
+    for (var s, o = 1, r = arguments.length; o < r; o++) {
       s = arguments[o];
-      for (var r in s) Object.prototype.hasOwnProperty.call(s, r) && (e[r] = s[r]);
+      for (var a in s) Object.prototype.hasOwnProperty.call(s, a) && (e[a] = s[a]);
     }
     return e;
   }, q.apply(this, arguments);
@@ -495,27 +495,27 @@ var K1 = {
   },
   emits: ["close"],
   setup: function(t, e) {
-    var s = e.emit, o = t, a = s, r = M(function() {
+    var s = e.emit, o = t, r = s, a = M(function() {
       return o.status ? Math.ceil(o.size * 100 / o.length) : 100;
     }), i = M(function() {
       return !!o.length;
-    }), f = M(function() {
-      return !!(i.value && r.value === 100 && !o.status);
+    }), v = M(function() {
+      return !!(i.value && a.value === 100 && !o.status);
     });
-    return U(function() {
+    return K(function() {
       var u = o.timeout;
       u && setTimeout(function() {
-        a("close", q({}, o));
+        r("close", q({}, o));
       }, u * 1e3);
     }), function(u, d) {
       return l(), c("div", K1, [
         n("div", q1, [
           n("div", R1, V(t.text), 1),
-          f.value ? (l(), c("span", W1, "Done")) : L("", !0),
+          v.value ? (l(), c("span", W1, "Done")) : L("", !0),
           n("button", {
             class: "transition text-gray-400 self-start hover:text-gray-600",
-            onClick: d[0] || (d[0] = function(m) {
-              return a("close", u.item);
+            onClick: d[0] || (d[0] = function(f) {
+              return r("close", u.item);
             })
           }, [
             p(t1, { class: "h-4 w-4" })
@@ -524,8 +524,8 @@ var K1 = {
         i.value ? (l(), c("div", J1, [
           n("div", {
             class: "bg-blue-600 text-sm font-medium text-blue-100 text-center leading-none rounded-full",
-            style: D("width: ".concat(r.value, "%"))
-          }, V(r.value) + "%", 5)
+            style: U("width: ".concat(a.value, "%"))
+          }, V(a.value) + "%", 5)
         ])) : L("", !0)
       ]);
     };
@@ -542,8 +542,8 @@ const n1 = /* @__PURE__ */ w({
   },
   emits: ["update:modelValue", "change"],
   setup(t, { emit: e }) {
-    const s = e, o = M(() => t.list.find((i) => i.value === t.value)?.[t.valueName] || ""), a = (i) => ({ "rotate-x-180": i }), r = (i) => s("change", i);
-    return (i, f) => (l(), $(W, S({ class: "relative w-full" }, i.$attrs, { top: "50px" }), {
+    const s = e, o = M(() => t.list.find((i) => i.value === t.value)?.[t.valueName] || ""), r = (i) => ({ "rotate-x-180": i }), a = (i) => s("change", i);
+    return (i, v) => (l(), k(W, B({ class: "relative w-full" }, i.$attrs, { top: "50px" }), {
       activator: _(({ on: u, show: d }) => [
         p(R, {
           "model-value": o.value,
@@ -555,8 +555,8 @@ const n1 = /* @__PURE__ */ w({
           onOnIcon: u.click
         }, {
           icon: _(() => [
-            p(N, {
-              class: H(["transition", a(d)])
+            p(D, {
+              class: H(["transition", r(d)])
             }, null, 8, ["class"])
           ]),
           _: 2
@@ -565,11 +565,11 @@ const n1 = /* @__PURE__ */ w({
       default: _(() => [
         p(J, {
           list: i.list,
-          onClick: r
+          onClick: a
         }, {
           default: _(({ item: u }) => [
-            x(i.$slots, "default", { item: u }, () => [
-              z(V(u.name), 1)
+            b(i.$slots, "default", { item: u }, () => [
+              S(V(u.name), 1)
             ])
           ]),
           _: 3
@@ -598,30 +598,30 @@ var X1 = { class: "w-full relative" }, Y1 = ["value", "disabled", "type"], ee =
   },
   emits: ["update:modelValue", "click", "on-icon", "enter", "blur"],
   setup: function(t, e) {
-    var s = e.emit, o = t, a = s, r = I(!1), i = M(function() {
+    var s = e.emit, o = t, r = s, a = z(!1), i = M(function() {
       return [
         o.message ? "border-red-500 hover:border-red-400" : "",
         o.disabled ? "border-gray-400 opacity-40" : "border-gray-300 hover:border-gray-400 dark:border-gray-700/50 hover:dark:border-gray-600/50"
       ];
-    }), f = function(v) {
-      return v || v === 0;
+    }), v = function(m) {
+      return m || m === 0;
     }, u = M(function() {
-      return [ne, r.value || f(o.modelValue) || o.active ? "top-0 left-3 text-xs" : "top-1/2"];
-    }), d = function(v) {
-      var B = v.target;
-      a("update:modelValue", B.value);
-    }, m = function(v) {
-      r.value = !1, a("blur", v);
-    }, C = function(v) {
-      return a("enter", v);
+      return [ne, a.value || v(o.modelValue) || o.active ? "top-0 left-3 text-xs" : "top-1/2"];
+    }), d = function(m) {
+      var I = m.target;
+      r("update:modelValue", I.value);
+    }, f = function(m) {
+      a.value = !1, r("blur", m);
+    }, C = function(m) {
+      return r("enter", m);
     }, y = function() {
-      return r.value = !0;
-    }, h = function(v) {
-      return a("click", v);
-    }, Z = function(v) {
-      o.disabled || a("on-icon", v);
+      return a.value = !0;
+    }, h = function(m) {
+      return r("click", m);
+    }, Z = function(m) {
+      o.disabled || r("on-icon", m);
     };
-    return function(v, B) {
+    return function(m, I) {
       return l(), c("div", X1, [
         n("label", {
           class: H(["relative w-full min-h-[40px] border border-gray-300 dark:border-gray-700 flex items-center rounded transition dark:bg-gray-800", i.value])
@@ -629,7 +629,7 @@ var X1 = { class: "w-full relative" }, Y1 = ["value", "disabled", "type"], ee =
           n("span", {
             class: H(["absolute left-4 transition-all rounded duration-300 -translate-y-1/2 text-gray-600 dark:text-gray-400", u.value])
           }, V(t.label), 3),
-          n("textarea", S(v.$attrs, {
+          n("textarea", B(m.$attrs, {
             value: t.modelValue,
             disabled: t.disabled,
             type: t.type,
@@ -637,25 +637,25 @@ var X1 = { class: "w-full relative" }, Y1 = ["value", "disabled", "type"], ee =
             wrap: "",
             class: "h-full w-full px-4 py-2 outline-none flex-auto bg-transparent",
             onFocus: y,
-            onBlur: m,
+            onBlur: f,
             onInput: d,
             onClick: h,
             onKeypress: X(C, ["enter"])
           }), null, 16, Y1),
-          v.$slots.icon ? (l(), c("button", {
+          m.$slots.icon ? (l(), c("button", {
             key: 0,
             disabled: t.disabled,
             style: { flex: "0 0 50px" },
             class: "h-full flex items-center justify-center text-gray-400 border-l border-primary",
             onClick: Z
           }, [
-            x(v.$slots, "icon")
+            b(m.$slots, "icon")
           ], 8, ee)) : L("", !0)
         ], 2),
         t.hideMessage ? L("", !0) : (l(), c("div", te, [
-          x(v.$slots, "message", {}, function() {
+          b(m.$slots, "message", {}, function() {
             return [
-              z(V(t.message), 1)
+              S(V(t.message), 1)
             ];
           })
         ]))
@@ -663,27 +663,27 @@ var X1 = { class: "w-full relative" }, Y1 = ["value", "disabled", "type"], ee =
     };
   }
 };
-const le = { class: "flex items-center cursor-pointer" }, re = /* @__PURE__ */ w({
+const le = { class: "flex items-center cursor-pointer" }, ae = /* @__PURE__ */ w({
   __name: "VTextFieldFile",
   emits: ["change"],
   setup(t, { emit: e }) {
-    const s = e, o = I({ files: [], totalSize: 0 }), a = async (r) => {
-      const i = r.target.files, f = { files: [], totalSize: 0 };
+    const s = e, o = z({ files: [], totalSize: 0 }), r = async (a) => {
+      const i = a.target.files, v = { files: [], totalSize: 0 };
       for (let u = 0; u < i.length; u++) {
         const d = i.item(u);
-        d && (f.totalSize += d.size, f.files.push({ name: d.name, size: d.size }));
+        d && (v.totalSize += d.size, v.files.push({ name: d.name, size: d.size }));
       }
-      i.length && (o.value = f, s("change", { files: i, info: f }));
+      i.length && (o.value = v, s("change", { files: i, info: v }));
     };
-    return (r, i) => (l(), c("label", le, [
-      n("input", S({
+    return (a, i) => (l(), c("label", le, [
+      n("input", B({
         type: "file",
         class: "hidden"
-      }, r.$attrs, { onChange: a }), null, 16),
-      x(r.$slots, "default", G(K(o.value)))
+      }, a.$attrs, { onChange: r }), null, 16),
+      b(a.$slots, "default", F(A(o.value)))
     ]));
   }
-}), ae = { class: "min-w-full" }, se = { class: "border-y border-gray-100 py-3 dark:border-gray-800" }, ie = { class: "bg-gray-50 dark:bg-gray-800" }, ce = { class: "flex items-center" }, ue = { class: "divide-y divide-gray-100 dark:divide-gray-800" }, de = ["onClick"], fe = { class: "flex items-center text-gray-700 dark:text-gray-400" }, ve = {
+}), re = { class: "min-w-full" }, se = { class: "border-y border-gray-100 py-3 dark:border-gray-800" }, ie = { class: "bg-gray-50 dark:bg-gray-800" }, ce = { class: "flex items-center" }, ue = { class: "divide-y divide-gray-100 dark:divide-gray-800" }, de = ["onClick"], fe = { class: "flex items-center text-gray-700 dark:text-gray-400" }, ve = {
   key: 1,
   class: ""
 }, me = {
@@ -697,43 +697,43 @@ const le = { class: "flex items-center cursor-pointer" }, re = /* @__PURE__ */ w
   },
   emits: ["click"],
   setup(t, { emit: e }) {
-    const s = e, o = (r, i) => {
-      s("click", { item: r, event: i });
-    }, a = (r) => r?.className || "";
-    return (r, i) => (l(), c("table", ae, [
+    const s = e, o = (a, i) => {
+      s("click", { item: a, event: i });
+    }, r = (a) => a?.className || "";
+    return (a, i) => (l(), c("table", re, [
       n("thead", se, [
         n("tr", ie, [
-          (l(!0), c(F, null, j(r.headers, (f, u) => (l(), c("th", {
+          (l(!0), c(j, null, O(a.headers, (v, u) => (l(), c("th", {
             key: u,
-            class: H(["py-2 whitespace-nowrap text-gray-500 dark:text-gray-400 font-normal px-4", a(f)])
+            class: H(["py-2 whitespace-nowrap text-gray-500 dark:text-gray-400 font-normal px-4", r(v)])
           }, [
-            x(r.$slots, "header", { item: f }, () => [
-              n("div", ce, V(f.name), 1)
+            b(a.$slots, "header", { item: v }, () => [
+              n("div", ce, V(v.name), 1)
             ])
           ], 2))), 128))
         ])
       ]),
       n("tbody", ue, [
-        r.items.length ? (l(!0), c(F, { key: 0 }, j(r.items, (f, u) => (l(), c("tr", {
+        a.items.length ? (l(!0), c(j, { key: 0 }, O(a.items, (v, u) => (l(), c("tr", {
           key: u,
           class: "hover:bg-gray-50/50 dark:hover:bg-gray-800/50",
-          onClick: (d) => o(f, d)
+          onClick: (d) => o(v, d)
         }, [
-          (l(!0), c(F, null, j(r.headers, (d, m) => (l(), c("td", {
-            key: m,
+          (l(!0), c(j, null, O(a.headers, (d, f) => (l(), c("td", {
+            key: f,
             class: "py-2 whitespace-nowrap px-4"
           }, [
             n("div", fe, [
-              x(r.$slots, d.key, { item: f }, () => [
-                z(V(f[d.key]), 1)
+              b(a.$slots, d.key, { item: v }, () => [
+                S(V(v[d.key]), 1)
               ])
             ])
           ]))), 128))
         ], 8, de))), 128)) : (l(), c("tr", ve, [
           n("td", me, [
             n("div", pe, [
-              x(r.$slots, "empty", {}, () => [
-                i[0] || (i[0] = z("The list is empty"))
+              b(a.$slots, "empty", {}, () => [
+                i[0] || (i[0] = S("The list is empty"))
               ])
             ])
           ])
@@ -749,11 +749,11 @@ const le = { class: "flex items-center cursor-pointer" }, re = /* @__PURE__ */ w
   },
   setup(t) {
     const e = 2 * (t.rssi + 100), s = (o) => o < e;
-    return (o, a) => (l(), c("div", _e, [
-      (l(), c(F, null, j([10, 15, 25, 40, 70], (r, i) => n("div", {
-        key: r,
-        class: H(["w-1 h-5 rounded-lg", [s(r) ? "bg-gray-900 dark:bg-gray-100" : "bg-gray-300 dark:bg-gray-700"]]),
-        style: D(`height: ${(i + 1) * 5}px`),
+    return (o, r) => (l(), c("div", _e, [
+      (l(), c(j, null, O([10, 15, 25, 40, 70], (a, i) => n("div", {
+        key: a,
+        class: H(["w-1 h-5 rounded-lg", [s(a) ? "bg-gray-900 dark:bg-gray-100" : "bg-gray-300 dark:bg-gray-700"]]),
+        style: U(`height: ${(i + 1) * 5}px`),
         title: `rssi: ${o.rssi} channel: ${o.channel}`
       }, null, 14, he)), 64)),
       n("div", ge, V(o.channel), 1)
@@ -773,7 +773,7 @@ const le = { class: "flex items-center cursor-pointer" }, re = /* @__PURE__ */ w
   VSelect: n1,
   VTable: Ce,
   VTextField: R,
-  VTextFieldFile: re,
+  VTextFieldFile: ae,
   VTextarea: oe,
   WifiIcon: ye
 }, Symbol.toStringTag, { value: "Module" }));
@@ -783,12 +783,12 @@ var xe = {}, Ve = {
   height: "24",
   fill: "currentColor"
 };
-function ke(t, e) {
+function $e(t, e) {
   return l(), c("svg", Ve, e[0] || (e[0] = [
     n("path", { d: "M3 4H21V6H3V4ZM3 11H15V13H3V11ZM3 18H21V20H3V18Z" }, null, -1)
   ]));
 }
-const $e = /* @__PURE__ */ g(xe, [["render", ke]]);
+const ke = /* @__PURE__ */ g(xe, [["render", $e]]);
 var we = {}, Me = {
   width: "24",
   height: "24",
@@ -884,7 +884,7 @@ function Xe(t, e) {
 const Ye = /* @__PURE__ */ g(Je, [["render", Xe]]);
 var e2 = {};
 function t2(t, e) {
-  return l(), c(F, null, [
+  return l(), c(j, null, [
     e[0] || (e[0] = n("svg", {
       class: "flex dark:hidden",
       viewBox: "0 0 24 24",
@@ -910,12 +910,12 @@ var o2 = {}, l2 = {
   viewBox: "0 0 179 40",
   fill: "#25c1eb"
 };
-function r2(t, e) {
+function a2(t, e) {
   return l(), c("svg", l2, e[0] || (e[0] = [
     u1('<g transform="matrix(0.13287749,0,0,0.13643171,26.823508,13.407673)"><path d="m -19.25933,-16.057909 c 0,39.1906 -14.287,86.055995 -38.669,116.999999 -7.898,10.024 -30.4718,32.819 -43.7731,17.695 -9.4823,-10.781 -3.53183,-36.917714 -0.86893,-48.907714 9.1618,-41.251693 19.72123,-78.8733849 30.31103,-119.787285 -27.50968,14.537655 -68.26323,-24.154322 -70.36602,-2.214449 -12.32038,69.23655 -28.82323,204.245118 16.36602,215.925448 81.802,10.63 120.333,-82.698004 129.4249996,-148.710999 2.182,-15.84009991 4.123,-31.9832 2.401,-48 -2.342,-21.78506 -24.7959996,-32.68227 -43.7859996,-21.58643 -11.424,6.67523 -12.148,29.93713 -1.935,38.01393 5.462,4.3199 14.927,3.091 20.895,0.5725 z"></path><path d="m 104.76548,-63.374174 0.008,91.15236 -26.35225,25.003926 26.35676,25.415735 4.8e-4,91.161403 4.03033,0.0237 c 0,0 0.0729,-90.913243 -0.0476,-91.163063 l 26.24012,-24.776315 -26.23835,-25.66073 0.007,-91.147024 z"></path><path d="m 803.85444,82.816565 c -5.5092,-1.69169 -15.7197,-2.12913 -19.9329,1.03114 -5.56,4.548 -0.63,22.670005 -0.76,28.973005 0.3943,19.76599 20.7146,30.35978 36.02,33 0,0 45.06,4.77 68,-5.439 35.89996,-15.975 40.75996,-63.180005 13.91,-89.457 -15.2385,-18.333755 -72.7584,-32.66908 -78.91,-50.10399958 -6.54,-7.52040002 -2.52,-22.38120042 5.1,-27.89120042 10.47,-7.5605 25.91,-7.3647 37.9,-5.017 13.11,2.5659 14.15,13.6285 18,24.9082004 1.48,4.3522 2.88,12.3564 8.1,13.6674 2.25,0.5623 4.67,-0.1094 6.9,-0.3827 16.42996,-2.011 11.28456,-11.418391 12.09456,-24.2037914 0.38,-6.0219 2.2254,-16.238609 -1.1246,-21.752209 -5.98996,-9.87979 -17.48276,-9.960049 -30.96996,-15.3287 -11.9944,-2.919504 -32.57,-5.50288 -50,-1.25772 -13.92,3.39017 -28.5,10.49772 -37.24,22.25772 -16.31,21.9622 -9.6,57.1861 10.26,74.6998 22.17,19.5582 58.4,21.7732 76.41,46.304195 16.9,23.013005 -18.71,37.732005 -37.1,36.158005 -39.9169,-0.34531 -23.6297,-30.723925 -36.6571,-40.166145 z"></path><path d="m 321.18154,-32.17929 21,9 -46,120.999995 c -13.02939,-49.349215 -25.65589,-93.5184936 -37,-121.999995 5.741,-1.2008 17.946,-4.1139 20.397,-10.1049 2.328,-5.6934 -1.142,-13.0456 -1.397,-18.8951 -9.12189,0.745226 -79.43846,-2.275099 -82.411,2.3179 -1.02172,5.2378 -3.84926,12.95938 -1.985,17.2878 4.036,8.5605 18.82154,3.517306 23.75154,13.866906 25.90475,54.255645 38.51776,106.713979 60.87446,156.527394 37.33703,54.02331 63.06896,-92.52485 72.275,-119 4.089,-11.8192996 7.212,-30.0265 15.194,-39.7724 15.1599,-17.433642 28.97616,-5.381825 21.868,-28.07945 -5.23694,-5.944366 -63.1086,-2.739072 -64.389,-1.54476 -3.452,4.31661 -7.5289,7.804293 -2.178,19.39661 z"></path><path d="m 401.18154,-53.17929 c -0.998,4.83681 -4.908,16.1206 -1.357,20.3511 4.914,5.8555 20.341,3.7676 21.463,12.689 3.596,28.5694004 -0.4,58.2962 0.855,86.9599 0.882,20.149995 3.491,41.865 17.134,57.961 36.351,42.885 114.137,25.661 128.322,-27.961005 9.142,-34.561995 3.01191,-80.803507 3.08491,-116.292007 0.033,-15.7886 15.53509,-3.553988 22.46909,-13.356888 3.337,-4.7169 -1.212,-15.187 -1.971,-20.3511 -20.45735,-0.261837 -40.85188,-0.262234 -61.258,1.02779 l -3.742,11.97221 c 0.84877,13.898543 11.37685,10.038234 23.90801,11.758642 0.32053,9.189207 0.091,48.923358 0.092,71.241358 10e-4,19.4 0.471,40.338995 -8.89,58 -15.56,29.358 -61.659,29.409 -74.878,-2.000005 -10.636,-25.273 -6.147,-56.234995 -6.233,-82.999995 -0.035,-10.9870996 -2.501,-25.3419996 0.319,-35.9568 2.549,-9.5978 16.626,-6.4297 22.064,-12.6921 3.287,-3.7858 -0.52,-15.71299 -1.382,-20.3511 z"></path><path d="m 760.05964,143.05268 c -5.1123,-31.58627 4.9497,-52.437285 -1.4781,-59.628975 -3.17,-3.163 -17.48,-3.877 -20.39,-0.285 -7.636,9.412 -6.012,27.571005 -14.737,36.079005 -3.136,3.058 -10.272,1.461 -14.273,1.689 -13.102,0.746 -25.895,-0.086 -39,-0.086 l -1,-68 c 7.223,0.913 21.685,-1.996 27.722,1.269 6.665,3.604 3.577,17.035995 10.556,20.532995 5.15472,-0.0642 13.05488,0.47604 17.494,-1.405 5.21328,-7.758815 3.74312,-60.612259 -0.015,-62.640795 -5.5141,-0.237113 -13.29293,-2.8563906 -17.543,-1.1527996 -6.595,2.8734996 -5.002,15.2292996 -10.608,19.7931996 -5.233,4.2609 -21.417,2.0768 -27.606,0.6034 l 0.018,-19.9999996 0.982,-42.0000004 h 36 c 4.195,0 11.017,-1.271 14.725,1.0278 9.479,5.8759 5.235,25.2669004 13.705,30.94060042 4.66,3.12049998 14.21,-2.03520002 19.57,-1.96840002 -1.7258,-10.0332024 5.1749,-44.7657364 -0.6,-49.9722104 -8.573,-0.17431 -123.95249,0.09746 -142.26,0.5756 -2.813,3.26479 -4.226,15.59871 -1.533,19.00621 4.834,6.1168 16.163,4.3646 20.481,9.9544 4.51586,28.5714044 7.89004,96.377815 0.594,132.328 -2.185,7.787 -16.181,5.969 -20.654,11.832 -1.59611,5.22999 -0.7409,13.33851 1.536,18.048 5.16025,7.51372 110.02916,3.17366 148.3141,3.45997 z"></path><path d="m 964.1815,-23.17929 c 0,43.4127 3.83,88.767 -0.06,131.985 -0.8,8.923 -14.88,7.544 -20.62,12.09 -4.2,3.326 -1.95,14.442 -0.17,18.777 15.7137,4.67091 86.3037,9.27518 89.39,-4.852 0.57,-3.057 2.36,-9.582 0.42,-12.297 -5.77,-8.041 -28.93,-2.391 -30.81,-13.747 -0.063,-55.41713 -0.3488,-55.25935 -0.15,-140.956 16.19,0 34.24,-2.9842 46.98,9.0934 18.26,17.2977004 11.94,53.4098 -8.98,65.6236 -7.67,4.477 -18.44,3.283 -27,3.283 v 23 c 23.19,0 50.85,-0.216 69,-17.093 28.42,-26.4403 19.73,-83.9314 -16,-99.7334 -4.6952,-8.320027 -96.8662,-17.196078 -120.68,-4.43208 -2.7,1.3721 -3.6701,5.98455 -3.17,8.34798 -3.3313,17.201533 8.54,18.6194 21.85,20.9105 z"></path></g>', 1)
   ]));
 }
-const a2 = /* @__PURE__ */ g(o2, [["render", r2]]);
+const r2 = /* @__PURE__ */ g(o2, [["render", a2]]);
 var s2 = {}, i2 = {
   viewBox: "0 0 40 40",
   fill: "#25c1eb"
@@ -964,18 +964,18 @@ function b2(t, e) {
   ]));
 }
 const x2 = /* @__PURE__ */ g(g2, [["render", b2]]);
-var V2 = {}, k2 = {
+var V2 = {}, $2 = {
   width: "24",
   height: "24",
   viewBox: "0 0 30 30",
   fill: "currentColor"
 };
-function $2(t, e) {
-  return l(), c("svg", k2, e[0] || (e[0] = [
+function k2(t, e) {
+  return l(), c("svg", $2, e[0] || (e[0] = [
     n("path", { d: "M 13 3 C 7.4889971 3 3 7.4889971 3 13 C 3 18.511003 7.4889971 23 13 23 C 15.396508 23 17.597385 22.148986 19.322266 20.736328 L 25.292969 26.707031 A 1.0001 1.0001 0 1 0 26.707031 25.292969 L 20.736328 19.322266 C 22.148986 17.597385 23 15.396508 23 13 C 23 7.4889971 18.511003 3 13 3 z M 13 5 C 17.430123 5 21 8.5698774 21 13 C 21 17.430123 17.430123 21 13 21 C 8.5698774 21 5 17.430123 5 13 C 5 8.5698774 8.5698774 5 13 5 z" }, null, -1)
   ]));
 }
-const w2 = /* @__PURE__ */ g(V2, [["render", $2]]);
+const w2 = /* @__PURE__ */ g(V2, [["render", k2]]);
 var M2 = {}, H2 = {
   viewBox: "0 0 24 24",
   width: "24",
@@ -1088,14 +1088,14 @@ function ot(t, e) {
   ]));
 }
 const lt = /* @__PURE__ */ g(tt, [["render", ot]]);
-var rt = {}, at = {
+var at = {}, rt = {
   width: "24",
   height: "24",
   viewBox: "0 0 24 24",
   fill: "currentColor"
 };
 function st(t, e) {
-  return l(), c("svg", at, e[0] || (e[0] = [
+  return l(), c("svg", rt, e[0] || (e[0] = [
     n("path", {
       "fill-rule": "evenodd",
       "clip-rule": "evenodd",
@@ -1105,7 +1105,7 @@ function st(t, e) {
     n("path", { d: "M11 12C11 12.5523 10.5523 13 10 13C9.44772 13 9 12.5523 9 12C9 11.4477 9.44772 11 10 11C10.5523 11 11 11.4477 11 12Z" }, null, -1)
   ]));
 }
-const it = /* @__PURE__ */ g(rt, [["render", st]]);
+const it = /* @__PURE__ */ g(at, [["render", st]]);
 var ct = {}, ut = {
   width: "24",
   height: "24",
@@ -1177,8 +1177,8 @@ function Vt(t, e) {
 			h-20.5v-245.7h20.5V368.65z` }, null, -1)
   ]));
 }
-const kt = /* @__PURE__ */ g(bt, [["render", Vt]]);
-var $t = {}, wt = {
+const $t = /* @__PURE__ */ g(bt, [["render", Vt]]);
+var kt = {}, wt = {
   width: "24",
   height: "24",
   viewBox: "0 0 24 24",
@@ -1195,7 +1195,7 @@ function Mt(t, e) {
     }, null, -1)
   ]));
 }
-const Ht = /* @__PURE__ */ g($t, [["render", Mt]]);
+const Ht = /* @__PURE__ */ g(kt, [["render", Mt]]);
 var Lt = {}, Zt = {
   width: "24",
   height: "24",
@@ -1289,9 +1289,9 @@ const Rt = /* @__PURE__ */ g(Gt, [["render", qt]]), Wt = /* @__PURE__ */ Object.
   __proto__: null,
   IconAir: Rt,
   IconBulb: Ut,
-  IconBurger: $e,
+  IconBurger: ke,
   IconCamera: Nt,
-  IconChevron: N,
+  IconChevron: D,
   IconClose: t1,
   IconCold: At,
   IconDashboard: Le,
@@ -1304,10 +1304,10 @@ const Rt = /* @__PURE__ */ g(Gt, [["render", qt]]), Wt = /* @__PURE__ */ Object.
   IconFolder: Ye,
   IconGarage: Ht,
   IconGpio: T2,
-  IconHeater: kt,
+  IconHeater: $t,
   IconLight: yt,
   IconLock: Ct,
-  IconLogo: a2,
+  IconLogo: r2,
   IconLogoMini: u2,
   IconLogout: m2,
   IconNoti: h2,
@@ -1344,18 +1344,18 @@ const Rt = /* @__PURE__ */ g(Gt, [["render", qt]]), Wt = /* @__PURE__ */ Object.
       n("div", Xt, [
         n("h3", Yt, V(e.title), 1),
         n("div", null, [
-          x(e.$slots, "header")
+          b(e.$slots, "header")
         ])
       ]),
       n("div", e0, [
-        x(e.$slots, "default")
+        b(e.$slots, "default")
       ])
     ], 2));
   }
 }), n0 = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
   __proto__: null,
   VCardGray: t0
-}, Symbol.toStringTag, { value: "Module" })), o0 = { class: "flex-auto flex align-center p-4" }, l0 = { class: "flex items-center justify-between px-4 py-2 border-b dark:border-gray-700 border-gray-200" }, r0 = { class: "px-4 py-2 flex-auto scroll-none" }, a0 = ["innerHTML"], s0 = {
+}, Symbol.toStringTag, { value: "Module" })), o0 = { class: "flex-auto flex align-center p-4" }, l0 = { class: "flex items-center justify-between px-4 py-2 border-b dark:border-gray-700 border-gray-200" }, a0 = { class: "px-4 py-2 flex-auto scroll-none" }, r0 = ["innerHTML"], s0 = {
   key: 0,
   class: "px-4 py-2 flex justify-end"
 }, o1 = /* @__PURE__ */ w({
@@ -1370,20 +1370,20 @@ const Rt = /* @__PURE__ */ g(Gt, [["render", qt]]), Wt = /* @__PURE__ */ Object.
   },
   emits: ["close"],
   setup(t, { emit: e }) {
-    const s = e, o = I(!1), a = { sm: "max-w-[330px]", md: "max-w-[600px]", lg: "max-w-[960px]" }, r = M(() => [`${a?.[t.size] || ""}`]), i = (u) => {
+    const s = e, o = z(!1), r = { sm: "max-w-[330px]", md: "max-w-[600px]", lg: "max-w-[960px]" }, a = M(() => [`${r?.[t.size] || ""}`]), i = (u) => {
       o.value = !1, setTimeout(() => {
         s("close", u);
       }, 300);
-    }, f = (u) => {
+    }, v = (u) => {
       t.callback && t.callback(), i(u);
     };
-    return U(() => {
+    return K(() => {
       setTimeout(() => {
         o.value = !0;
       }, 300);
     }), (u, d) => {
-      const m = b("icon-close"), C = b("v-button");
-      return l(), $(d1, { to: "body" }, [
+      const f = x("icon-close"), C = x("v-button");
+      return l(), k(d1, { to: "body" }, [
         p(Y, {
           "enter-active-class": "duration-300 ease-out",
           "enter-from-class": "transform opacity-0 -translate-y-2",
@@ -1396,7 +1396,7 @@ const Rt = /* @__PURE__ */ g(Gt, [["render", qt]]), Wt = /* @__PURE__ */ Object.
             o.value ? (l(), c("div", {
               key: 0,
               class: "z-20 fixed top-0 h-[100dvh] w-full left-0 flex flex-col",
-              onWheel: d[0] || (d[0] = T(() => {
+              onWheel: d[0] || (d[0] = N(() => {
               }, ["stop"]))
             }, [
               n("div", {
@@ -1405,10 +1405,10 @@ const Rt = /* @__PURE__ */ g(Gt, [["render", qt]]), Wt = /* @__PURE__ */ Object.
               }),
               n("div", o0, [
                 n("div", {
-                  class: H(["m-auto w-full bg-white dark:bg-gray-900 shadow-lg flex flex-col rounded-lg z-30", r.value])
+                  class: H(["m-auto w-full bg-white dark:bg-gray-900 shadow-lg flex flex-col rounded-lg z-30", a.value])
                 }, [
                   n("div", l0, [
-                    x(u.$slots, "header", {}, () => [
+                    b(u.$slots, "header", {}, () => [
                       n("h4", null, V(u.title), 1)
                     ]),
                     p(C, {
@@ -1417,25 +1417,25 @@ const Rt = /* @__PURE__ */ g(Gt, [["render", qt]]), Wt = /* @__PURE__ */ Object.
                       onClick: i
                     }, {
                       default: _(() => [
-                        p(m, { class: "h-5 w-5" })
+                        p(f, { class: "h-5 w-5" })
                       ]),
                       _: 1
                     })
                   ]),
-                  n("div", r0, [
-                    x(u.$slots, "default", {}, () => [
-                      n("div", { innerHTML: u.message }, null, 8, a0)
+                  n("div", a0, [
+                    b(u.$slots, "default", {}, () => [
+                      n("div", { innerHTML: u.message }, null, 8, r0)
                     ])
                   ]),
                   u.$slots.footer || u.callback ? (l(), c("div", s0, [
-                    x(u.$slots, "footer", {}, () => [
+                    b(u.$slots, "footer", {}, () => [
                       p(C, {
                         color: "blue",
                         size: "small",
-                        onClick: f
+                        onClick: v
                       }, {
                         default: _(() => [
-                          z(V(u.button), 1)
+                          S(V(u.button), 1)
                         ]),
                         _: 1
                       })
@@ -1450,7 +1450,7 @@ const Rt = /* @__PURE__ */ g(Gt, [["render", qt]]), Wt = /* @__PURE__ */ Object.
       ]);
     };
   }
-}), i0 = { class: "flex-auto flex justify-between" }, c0 = { class: "text-sm text-gray-500 font-medium text-ellipsis overflow-hidden text-nowrap" }, u0 = { class: "text-sm text-ellipsis overflow-hidden text-nowrap" }, d0 = { class: "flex-auto flex items-center justify-between gap-6 me-2" }, f0 = { class: "min-h-60 relative" }, v0 = { class: "pt-6" }, m0 = { class: "text-center text-3xl text-ellipsis overflow-hidden" }, p0 = { class: "text-center text-xl mt-4" }, A = /* @__PURE__ */ w({
+}), i0 = { class: "flex-auto flex justify-between" }, c0 = { class: "text-sm text-gray-500 font-medium text-ellipsis overflow-hidden text-nowrap" }, u0 = { class: "text-sm text-ellipsis overflow-hidden text-nowrap" }, d0 = { class: "flex-auto flex items-center justify-between gap-6 me-2" }, f0 = { class: "min-h-60 relative" }, v0 = { class: "pt-6" }, m0 = { class: "text-center text-3xl text-ellipsis overflow-hidden" }, p0 = { class: "text-center text-xl mt-4" }, T = /* @__PURE__ */ w({
   __name: "CardBase",
   props: {
     id: {},
@@ -1470,37 +1470,47 @@ const Rt = /* @__PURE__ */ g(Gt, [["render", qt]]), Wt = /* @__PURE__ */ Object.
   },
   emits: ["edit"],
   setup(t, { emit: e }) {
-    const s = I(!1), o = e, a = M(() => t.icon ? `icon-${t.icon}` : "icon-therm"), r = M(() => ["button", "switch"].includes(t.type || "") && t.value ? "text-amber-500" : "text-gray-400"), i = (m) => o("edit", m), f = () => s.value = !0, u = (m) => t.modifyValue?.(m) || m, d = M(() => ({
+    const s = z(!1), o = e, r = M(() => t.icon ? `icon-${t.icon}` : "icon-therm"), a = M(() => ["button", "switch"].includes(t.type || "") && t.value ? "text-amber-500" : "text-gray-400"), i = (f) => o("edit", f), v = () => s.value = !0, u = (f) => t.modifyValue?.(f) || f, d = M(() => ({
       value: t.value,
       name: t.name,
       min: t.min,
       max: t.max,
       list: t.list,
       modify: u(t.value),
-      icon: a.value
+      icon: r.value
     }));
-    return (m, C) => {
-      const y = b("icon-dots"), h = b("v-button");
+    return (f, C) => {
+      const y = x("icon-dots"), h = x("v-button");
       return l(), c("div", {
         class: "flex flex-col border aspect-square rounded-sm bg-white dark:bg-gray-900 border-b border-gray-300 dark:border-gray-700 p-2 hover:border-blue-400 dark:hover:border-blue-700 transition-all",
-        onClick: f
+        onClick: v
       }, [
         n("div", i0, [
           n("div", {
-            class: H(r.value)
+            class: H(a.value)
           }, [
-            (l(), $(P(a.value), { class: "size-8" }))
+            (l(), k(G(r.value), { class: "size-8" }))
           ], 2),
-          x(m.$slots, "header", G(K(d.value)))
+          b(f.$slots, "header", F(A(d.value)))
         ]),
         n("div", null, [
-          n("h6", c0, V(m.name), 1),
-          n("div", u0, V(u(m.value)), 1)
+          b(f.$slots, "body", F(A(d.value)), () => [
+            n("h6", c0, [
+              b(f.$slots, "name", F(A(d.value)), () => [
+                S(V(f.name), 1)
+              ])
+            ]),
+            n("div", u0, [
+              b(f.$slots, "value", F(A(d.value)), () => [
+                S(V(u(f.value)), 1)
+              ])
+            ])
+          ])
         ]),
-        s.value ? (l(), $(o1, {
+        s.value ? (l(), k(o1, {
           key: 0,
           size: "sm",
-          title: m.name,
+          title: f.name,
           onClose: C[0] || (C[0] = (Z) => s.value = !1)
         }, {
           header: _(() => [
@@ -1520,9 +1530,17 @@ const Rt = /* @__PURE__ */ g(Gt, [["render", qt]]), Wt = /* @__PURE__ */ Object.
           default: _(() => [
             n("div", f0, [
               n("div", v0, [
-                n("h3", m0, V(m.name), 1),
-                x(m.$slots, "dialog", G(K(d.value))),
-                n("p", p0, V(u(m.value)), 1)
+                n("h3", m0, [
+                  b(f.$slots, "dialog-name", F(A(d.value)), () => [
+                    S(V(f.name), 1)
+                  ])
+                ]),
+                b(f.$slots, "dialog", F(A(d.value))),
+                n("p", p0, [
+                  b(f.$slots, "dialog-value", F(A(d.value)), () => [
+                    S(V(u(f.value)), 1)
+                  ])
+                ])
               ])
             ])
           ]),
@@ -1551,17 +1569,17 @@ const Rt = /* @__PURE__ */ g(Gt, [["render", qt]]), Wt = /* @__PURE__ */ Object.
   },
   emits: ["click", "setState"],
   setup(t, { emit: e }) {
-    const s = e, o = t, a = (i) => s("click", i), r = () => s("setState", { ...o, value: !o.value });
-    return (i, f) => {
-      const u = b("icon-power"), d = b("v-button");
-      return l(), $(A, S(o, { onClick: a }), {
+    const s = e, o = t, r = (i) => s("click", i), a = () => s("setState", { ...o, value: !o.value });
+    return (i, v) => {
+      const u = x("icon-power"), d = x("v-button");
+      return l(), k(T, B(o, { onClick: r }), {
         header: _(() => [
           n("div", C0, [
             p(d, {
               type: "icon",
               size: "sm",
               class: "text-gray-500",
-              onClick: T(r, ["stop"])
+              onClick: N(a, ["stop"])
             }, {
               default: _(() => [
                 p(u, { class: "size-10" })
@@ -1576,7 +1594,7 @@ const Rt = /* @__PURE__ */ g(Gt, [["render", qt]]), Wt = /* @__PURE__ */ Object.
               type: "icon",
               size: "sm",
               class: H(["h-18 w-18", o.value ? "text-amber-500" : "text-blue-600 dark:text-blue-400"]),
-              onClick: T(r, ["stop"])
+              onClick: N(a, ["stop"])
             }, {
               default: _(() => [
                 p(u, { class: "size-16" })
@@ -1609,20 +1627,20 @@ const Rt = /* @__PURE__ */ g(Gt, [["render", qt]]), Wt = /* @__PURE__ */ Object.
   },
   emits: ["click", "setState"],
   setup(t, { emit: e }) {
-    const s = e, o = t, a = (f) => new Date(f * 1e3).toISOString().slice(0, 16), r = (f) => {
-      const u = f?.target?.valueAsNumber;
+    const s = e, o = t, r = (v) => new Date(v * 1e3).toISOString().slice(0, 16), a = (v) => {
+      const u = v?.target?.valueAsNumber;
       console.log(u), u && s("setState", { ...o, value: u / 1e3 });
-    }, i = (f) => s("click", f);
-    return (f, u) => {
-      const d = b("v-text-field");
-      return l(), $(A, S(o, { onClick: i }), {
-        dialog: _(({ value: m }) => [
+    }, i = (v) => s("click", v);
+    return (v, u) => {
+      const d = x("v-text-field");
+      return l(), k(T, B(o, { onClick: i }), {
+        dialog: _(({ value: f }) => [
           n("div", g0, [
             p(d, {
-              modelValue: a(m),
+              modelValue: r(f),
               type: "datetime-local",
               label: "Date",
-              onChange: r
+              onChange: a
             }, null, 8, ["modelValue"])
           ])
         ]),
@@ -1636,7 +1654,7 @@ const Rt = /* @__PURE__ */ g(Gt, [["render", qt]]), Wt = /* @__PURE__ */ Object.
   viewBox: "-7.5 -7.5 75 75",
   version: "1.1",
   style: { transform: "rotate(-90deg)" }
-}, V0 = ["stroke-dashoffset"], k0 = { class: "flex justify-center relative mx-2 my-6" }, $0 = { class: "absolute top-1/2 left-1/2 -translate-1/2 text-white z-10 font-bold text-xl" }, w0 = ["min", "max", "value"], M0 = /* @__PURE__ */ w({
+}, V0 = ["stroke-dashoffset"], $0 = { class: "flex justify-center relative mx-2 my-6" }, k0 = { class: "absolute top-1/2 left-1/2 -translate-1/2 text-white z-10 font-bold text-xl" }, w0 = ["min", "max", "value"], M0 = /* @__PURE__ */ w({
   __name: "CardDimmer",
   props: {
     id: {},
@@ -1656,12 +1674,12 @@ const Rt = /* @__PURE__ */ g(Gt, [["render", qt]]), Wt = /* @__PURE__ */ Object.
   },
   emits: ["click", "setState"],
   setup(t, { emit: e }) {
-    const s = e, o = t, a = (u, d) => Math.round(100 * u / d), r = (u, d) => Math.round(187 - u / d * 187), i = (u) => s("click", u), f = (u) => {
+    const s = e, o = t, r = (u, d) => Math.round(100 * u / d), a = (u, d) => Math.round(187 - u / d * 187), i = (u) => s("click", u), v = (u) => {
       const d = +u?.target?.value || 0;
       s("setState", { ...o, value: d });
     };
-    return (u, d) => (l(), $(A, S(o, { onClick: i }), {
-      header: _(({ value: m, max: C }) => [
+    return (u, d) => (l(), k(T, B(o, { onClick: i }), {
+      header: _(({ value: f, max: C }) => [
         n("div", b0, [
           n("div", {
             class: H(["", "text-blue-600 dark:text-blue-400"])
@@ -1682,7 +1700,7 @@ const Rt = /* @__PURE__ */ g(Gt, [["render", qt]]), Wt = /* @__PURE__ */ Object.
                 stroke: "currentColor",
                 "stroke-width": "8",
                 "stroke-linecap": "butt",
-                "stroke-dashoffset": r(m, C || 0),
+                "stroke-dashoffset": a(f, C || 0),
                 fill: "transparent",
                 "stroke-dasharray": "187"
               }, null, 8, V0)
@@ -1690,22 +1708,22 @@ const Rt = /* @__PURE__ */ g(Gt, [["render", qt]]), Wt = /* @__PURE__ */ Object.
           ])
         ])
       ]),
-      dialog: _(({ min: m = 0, max: C = 255, value: y }) => [
-        n("div", k0, [
+      dialog: _(({ min: f = 0, max: C = 255, value: y }) => [
+        n("div", $0, [
           d[1] || (d[1] = n("div", { class: "absolute h-10 w-full top-0 left-0 bg-gray-400 dark:bg-gray-800 z-0 rounded-md" }, null, -1)),
           n("div", {
             class: "absolute h-10 top-0 left-0 bg-blue-600 dark:bg-blue-400 z-0 rounded-md",
-            style: D(`width: ${a(y, C)}%`)
+            style: U(`width: ${r(y, C)}%`)
           }, null, 4),
-          n("div", $0, V(a(y, C)) + " %", 1),
+          n("div", k0, V(r(y, C)) + " %", 1),
           n("input", {
             type: "range",
-            min: m,
+            min: f,
             max: C,
             value: y,
             step: "1",
             class: "w-full h-10 z-10 appearance-none cursor-pointer opacity-0",
-            onChange: f
+            onChange: v
           }, null, 40, w0)
         ])
       ]),
@@ -1732,10 +1750,10 @@ const Rt = /* @__PURE__ */ g(Gt, [["render", qt]]), Wt = /* @__PURE__ */ Object.
   },
   emits: ["click"],
   setup(t, { emit: e }) {
-    const s = e, o = t, a = (r) => s("click", r);
-    return (r, i) => (l(), $(A, S(o, { onClick: a }), {
+    const s = e, o = t, r = (a) => s("click", a);
+    return (a, i) => (l(), k(T, B(o, { onClick: r }), {
       default: _(() => [
-        x(r.$slots, "dialog")
+        b(a.$slots, "dialog")
       ]),
       _: 3
     }, 16));
@@ -1760,19 +1778,19 @@ const Rt = /* @__PURE__ */ g(Gt, [["render", qt]]), Wt = /* @__PURE__ */ Object.
   },
   emits: ["click", "setState"],
   setup(t, { emit: e }) {
-    const s = e, o = t, a = (i) => {
-      const f = i?.target?.value;
-      s("setState", { ...o, value: f });
-    }, r = (i) => s("click", i);
-    return (i, f) => {
-      const u = b("v-text-field");
-      return l(), $(A, S(o, { onClick: r }), {
-        dialog: _(({ value: d, name: m }) => [
+    const s = e, o = t, r = (i) => {
+      const v = i?.target?.value;
+      s("setState", { ...o, value: v });
+    }, a = (i) => s("click", i);
+    return (i, v) => {
+      const u = x("v-text-field");
+      return l(), k(T, B(o, { onClick: a }), {
+        dialog: _(({ value: d, name: f }) => [
           n("div", L0, [
             p(u, {
               modelValue: d,
-              label: m,
-              onChange: a
+              label: f,
+              onChange: r
             }, null, 8, ["modelValue", "label"])
           ])
         ]),
@@ -1800,11 +1818,11 @@ const Rt = /* @__PURE__ */ g(Gt, [["render", qt]]), Wt = /* @__PURE__ */ Object.
   },
   emits: ["click", "setState"],
   setup(t, { emit: e }) {
-    const s = e, o = t, a = (i) => s("click", i), r = () => s("setState", o);
-    return (i, f) => {
-      const u = b("icon-power"), d = b("v-button");
-      return l(), $(A, S(o, { onClick: a }), {
-        header: _(() => f[0] || (f[0] = [
+    const s = e, o = t, r = (i) => s("click", i), a = () => s("setState", o);
+    return (i, v) => {
+      const u = x("icon-power"), d = x("v-button");
+      return l(), k(T, B(o, { onClick: r }), {
+        header: _(() => v[0] || (v[0] = [
           n("div", { class: "flex justify-end" }, null, -1)
         ])),
         dialog: _(() => [
@@ -1813,7 +1831,7 @@ const Rt = /* @__PURE__ */ g(Gt, [["render", qt]]), Wt = /* @__PURE__ */ Object.
               type: "icon",
               size: "sm",
               class: H(["h-18 w-18", o.value ? "text-amber-500" : "text-blue-600 dark:text-blue-400"]),
-              onClick: T(r, ["stop"])
+              onClick: N(a, ["stop"])
             }, {
               default: _(() => [
                 p(u, { class: "size-16" })
@@ -1846,17 +1864,17 @@ const Rt = /* @__PURE__ */ g(Gt, [["render", qt]]), Wt = /* @__PURE__ */ Object.
   },
   emits: ["click", "setState"],
   setup(t, { emit: e }) {
-    const s = e, o = t, a = (i) => s("click", i), r = ({ value: i }) => s("setState", { ...o, value: i });
-    return (i, f) => {
-      const u = b("icon-power"), d = b("v-button");
-      return l(), $(A, S(o, { onClick: a }), {
+    const s = e, o = t, r = (i) => s("click", i), a = ({ value: i }) => s("setState", { ...o, value: i });
+    return (i, v) => {
+      const u = x("icon-power"), d = x("v-button");
+      return l(), k(T, B(o, { onClick: r }), {
         header: _(() => [
           n("div", I0, [
             p(d, {
               type: "icon",
               size: "sm",
               class: "text-gray-500",
-              onClick: T(r, ["stop"])
+              onClick: N(a, ["stop"])
             }, {
               default: _(() => [
                 p(u, { class: "size-10" })
@@ -1865,13 +1883,13 @@ const Rt = /* @__PURE__ */ g(Gt, [["render", qt]]), Wt = /* @__PURE__ */ Object.
             })
           ])
         ]),
-        dialog: _(({ name: m, value: C, list: y }) => [
+        dialog: _(({ name: f, value: C, list: y }) => [
           n("div", z0, [
             p(n1, {
               value: C,
-              label: m,
+              label: f,
               list: y,
-              onChange: r
+              onChange: a
             }, null, 8, ["value", "label", "list"])
           ])
         ]),
@@ -1887,7 +1905,7 @@ const Rt = /* @__PURE__ */ g(Gt, [["render", qt]]), Wt = /* @__PURE__ */ Object.
   },
   emits: ["remove", "save", "select"],
   setup(t, { emit: e }) {
-    const s = e, o = I({ id: "", name: "", keyValue: "" }), a = [
+    const s = e, o = z({ id: "", name: "", keyValue: "" }), r = [
       { name: "Air", value: "air" },
       { name: "Bulb", value: "bulb" },
       { name: "Cold", value: "cold" },
@@ -1906,121 +1924,121 @@ const Rt = /* @__PURE__ */ g(Gt, [["render", qt]]), Wt = /* @__PURE__ */ Object.
       { name: "Logout", value: "logout" },
       { name: "Lock", value: "lock" },
       { name: "Folder", value: "folder" }
-    ], r = [
+    ], a = [
       { name: "Button", value: "button" },
       { name: "Info", value: "info" },
       { name: "Dimmer", value: "dimmer" },
       { name: "Switch", value: "switch" },
       { name: "Date", value: "date" },
       { name: "Input", value: "input" }
-    ], i = (y) => `icon-${y}`, f = M(() => o.value.type === "dimmer"), u = ({ value: y }) => {
+    ], i = (y) => `icon-${y}`, v = M(() => o.value.type === "dimmer"), u = ({ value: y }) => {
       o.value.icon = y;
     }, d = ({ value: y }) => {
       o.value.type = y;
-    }, m = () => {
+    }, f = () => {
       s("save", o.value);
     }, C = () => {
       s("remove", o.value);
     };
-    return U(() => {
+    return K(() => {
       console.log(t.item), o.value = { ...t.item };
     }), (y, h) => {
-      const Z = b("v-text-field"), v = b("VSelect"), B = b("v-textarea"), E = b("v-button");
+      const Z = x("v-text-field"), m = x("VSelect"), I = x("v-textarea"), P = x("v-button");
       return l(), c("div", A0, [
         n("div", j0, [
           n("div", T0, [
             p(Z, {
               modelValue: o.value.id,
-              "onUpdate:modelValue": h[0] || (h[0] = (k) => o.value.id = k),
+              "onUpdate:modelValue": h[0] || (h[0] = ($) => o.value.id = $),
               label: "ID",
               disabled: !y.isNew,
-              onClick: h[1] || (h[1] = (k) => s("select", k))
+              onClick: h[1] || (h[1] = ($) => s("select", $))
             }, null, 8, ["modelValue", "disabled"]),
             p(Z, {
               modelValue: o.value.keyValue,
-              "onUpdate:modelValue": h[2] || (h[2] = (k) => o.value.keyValue = k),
+              "onUpdate:modelValue": h[2] || (h[2] = ($) => o.value.keyValue = $),
               label: "KeyValue"
             }, null, 8, ["modelValue"])
           ]),
           p(Z, {
             modelValue: o.value.name,
-            "onUpdate:modelValue": h[3] || (h[3] = (k) => o.value.name = k),
+            "onUpdate:modelValue": h[3] || (h[3] = ($) => o.value.name = $),
             label: "Name"
           }, null, 8, ["modelValue"]),
           n("div", O0, [
-            p(v, {
+            p(m, {
               value: o.value.icon,
               class: "",
               label: "Icon",
-              list: a,
+              list: r,
               onChange: u
             }, {
-              default: _(({ item: k }) => [
+              default: _(({ item: $ }) => [
                 n("div", N0, [
-                  (l(), $(P(i(k.value)), { class: "size-5" })),
-                  n("div", null, V(k.name), 1)
+                  (l(), k(G(i($.value)), { class: "size-5" })),
+                  n("div", null, V($.name), 1)
                 ])
               ]),
               _: 1
             }, 8, ["value"]),
-            p(v, {
+            p(m, {
               value: o.value.type,
               class: "",
               label: "Type",
-              list: r,
+              list: a,
               onChange: d
             }, null, 8, ["value"])
           ]),
           n("div", E0, [
-            f.value ? (l(), $(Z, {
+            v.value ? (l(), k(Z, {
               key: 0,
               modelValue: o.value.min,
-              "onUpdate:modelValue": h[4] || (h[4] = (k) => o.value.min = k),
+              "onUpdate:modelValue": h[4] || (h[4] = ($) => o.value.min = $),
               label: "Min"
             }, null, 8, ["modelValue"])) : L("", !0),
-            f.value ? (l(), $(Z, {
+            v.value ? (l(), k(Z, {
               key: 1,
               modelValue: o.value.max,
-              "onUpdate:modelValue": h[5] || (h[5] = (k) => o.value.max = k),
+              "onUpdate:modelValue": h[5] || (h[5] = ($) => o.value.max = $),
               label: "Max"
             }, null, 8, ["modelValue"])) : L("", !0)
           ]),
-          o.value.set ? (l(), $(B, {
+          o.value.set ? (l(), k(I, {
             key: 0,
             modelValue: o.value.set,
-            "onUpdate:modelValue": h[6] || (h[6] = (k) => o.value.set = k),
+            "onUpdate:modelValue": h[6] || (h[6] = ($) => o.value.set = $),
             label: "Set"
           }, null, 8, ["modelValue"])) : L("", !0),
-          p(B, {
+          p(I, {
             modelValue: o.value.get,
-            "onUpdate:modelValue": h[7] || (h[7] = (k) => o.value.get = k),
+            "onUpdate:modelValue": h[7] || (h[7] = ($) => o.value.get = $),
             label: "Get"
           }, null, 8, ["modelValue"]),
-          p(B, {
+          p(I, {
             modelValue: o.value.modifyValue,
-            "onUpdate:modelValue": h[8] || (h[8] = (k) => o.value.modifyValue = k),
+            "onUpdate:modelValue": h[8] || (h[8] = ($) => o.value.modifyValue = $),
             label: "ModifyValue"
           }, null, 8, ["modelValue"])
         ]),
         n("div", D0, [
-          p(E, {
+          p(P, {
             class: "px-4",
             color: "red",
             outline: "",
             onClick: C
           }, {
             default: _(() => h[9] || (h[9] = [
-              z("Remove")
+              S("Remove")
             ])),
             _: 1
           }),
-          p(E, {
+          p(P, {
             class: "px-4",
             color: "blue",
-            onClick: m
+            onClick: f
           }, {
             default: _(() => h[10] || (h[10] = [
-              z("Save")
+              S("Save")
             ])),
             _: 1
           })
@@ -2031,7 +2049,7 @@ const Rt = /* @__PURE__ */ g(Gt, [["render", qt]]), Wt = /* @__PURE__ */ Object.
 }), U0 = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
   __proto__: null,
   BlockItemEdit: P0,
-  CardBase: A,
+  CardBase: T,
   CardButton: h0,
   CardDate: y0,
   CardDimmer: M0,
@@ -2046,19 +2064,19 @@ const Rt = /* @__PURE__ */ g(Gt, [["render", qt]]), Wt = /* @__PURE__ */ Object.
   },
   emits: ["sidebar"],
   setup(t, { emit: e }) {
-    const s = e, o = I(!1), a = I(!1), r = M(() => [
+    const s = e, o = z(!1), r = z(!1), a = M(() => [
       { name: "Theme", icon: "icon-theme" },
       { name: "Logout", icon: "icon-logout" }
-    ]), i = (m) => s("sidebar", m), f = async () => await fetch("/", {
+    ]), i = (f) => s("sidebar", f), v = async () => await fetch("/", {
       method: "get",
       headers: { Authorization: "Basic AAAAAAAAAAAAAAAAAAA=" }
     }), u = () => {
       t.changeTheme && t.changeTheme();
-    }, d = ({ name: m }) => {
-      m == "Logout" && f(), m == "Theme" && u();
+    }, d = ({ name: f }) => {
+      f == "Logout" && v(), f == "Theme" && u();
     };
-    return (m, C) => {
-      const y = b("icon-burger"), h = b("v-button"), Z = b("icon-logo"), v = b("router-link"), B = b("IconTheme"), E = b("icon-noti"), k = b("icon-logout"), l1 = b("icon-dots"), r1 = b("v-list"), a1 = b("v-dropdown");
+    return (f, C) => {
+      const y = x("icon-burger"), h = x("v-button"), Z = x("icon-logo"), m = x("router-link"), I = x("IconTheme"), P = x("icon-noti"), $ = x("icon-logout"), l1 = x("icon-dots"), a1 = x("v-list"), r1 = x("v-dropdown");
       return l(), c("header", G0, [
         n("div", K0, [
           n("div", q0, [
@@ -2075,7 +2093,7 @@ const Rt = /* @__PURE__ */ g(Gt, [["render", qt]]), Wt = /* @__PURE__ */ Object.
             }),
             C[2] || (C[2] = n("div", { class: "lg:hidden flex-auto" }, null, -1)),
             n("div", R0, [
-              p(v, { to: "/" }, {
+              p(m, { to: "/" }, {
                 default: _(() => [
                   p(Z, { class: "h-[30px]" })
                 ]),
@@ -2091,7 +2109,7 @@ const Rt = /* @__PURE__ */ g(Gt, [["render", qt]]), Wt = /* @__PURE__ */ Object.
                 onClick: u
               }, {
                 default: _(() => [
-                  p(B)
+                  p(I)
                 ]),
                 _: 1
               }),
@@ -2099,17 +2117,17 @@ const Rt = /* @__PURE__ */ g(Gt, [["render", qt]]), Wt = /* @__PURE__ */ Object.
                 type: "icon",
                 color: "gray",
                 class: "hidden md:flex",
-                onClick: C[0] || (C[0] = T((O) => {
-                  o.value = !o.value, a.value = !1;
+                onClick: C[0] || (C[0] = N((E) => {
+                  o.value = !o.value, r.value = !1;
                 }, ["prevent"]))
               }, {
                 default: _(() => [
                   n("span", {
-                    class: H([a.value ? "flex" : "hidden", "absolute right-0 top-0.5 z-1 h-2 w-2 rounded-full bg-orange-400 flex"])
+                    class: H([r.value ? "flex" : "hidden", "absolute right-0 top-0.5 z-1 h-2 w-2 rounded-full bg-orange-400 flex"])
                   }, C[1] || (C[1] = [
                     n("span", { class: "absolute -z-1 inline-flex h-full w-full animate-ping rounded-full bg-orange-400 opacity-75" }, null, -1)
                   ]), 2),
-                  p(E, { class: "h-5 w-5" })
+                  p(P, { class: "h-5 w-5" })
                 ]),
                 _: 1
               }),
@@ -2117,26 +2135,26 @@ const Rt = /* @__PURE__ */ g(Gt, [["render", qt]]), Wt = /* @__PURE__ */ Object.
                 type: "icon",
                 color: "gray",
                 class: "hidden md:flex",
-                onClick: T(f, ["prevent"])
+                onClick: N(v, ["prevent"])
               }, {
                 default: _(() => [
-                  p(k, { class: "h-5 w-5" })
+                  p($, { class: "h-5 w-5" })
                 ]),
                 _: 1
               })
             ]),
             n("div", J0, [
-              p(a1, {
+              p(r1, {
                 left: "unset",
                 right: "0",
                 top: "0"
               }, {
-                activator: _(({ on: O }) => [
+                activator: _(({ on: E }) => [
                   p(h, {
                     type: "icon",
                     color: "gray",
                     class: "flex",
-                    onClick: (a5) => O.click()
+                    onClick: (r5) => E.click()
                   }, {
                     default: _(() => [
                       p(l1)
@@ -2145,13 +2163,13 @@ const Rt = /* @__PURE__ */ g(Gt, [["render", qt]]), Wt = /* @__PURE__ */ Object.
                   }, 1032, ["onClick"])
                 ]),
                 default: _(() => [
-                  p(r1, {
-                    list: r.value,
+                  p(a1, {
+                    list: a.value,
                     onClick: d
                   }, {
-                    default: _(({ item: O }) => [
-                      (l(), $(P(O.icon))),
-                      n("span", Q0, V(O.name), 1)
+                    default: _(({ item: E }) => [
+                      (l(), k(G(E.icon))),
+                      n("span", Q0, V(E.name), 1)
                     ]),
                     _: 1
                   }, 8, ["list"])
@@ -2172,8 +2190,8 @@ const Rt = /* @__PURE__ */ g(Gt, [["render", qt]]), Wt = /* @__PURE__ */ Object.
   emits: ["close"],
   setup(t, { emit: e }) {
     const s = e;
-    return (o, a) => {
-      const r = b("v-notification");
+    return (o, r) => {
+      const a = x("v-notification");
       return l(), c("div", null, [
         p(f1, {
           name: "list",
@@ -2181,11 +2199,11 @@ const Rt = /* @__PURE__ */ g(Gt, [["render", qt]]), Wt = /* @__PURE__ */ Object.
           class: "flex flex-col gap-2"
         }, {
           default: _(() => [
-            (l(!0), c(F, null, j(o.notifications, (i) => (l(), $(r, S({
+            (l(!0), c(j, null, O(o.notifications, (i) => (l(), k(a, B({
               key: i.id,
               ref_for: !0
             }, i, {
-              onClose: (f) => s("close", i)
+              onClose: (v) => s("close", i)
             }), null, 16, ["onClose"]))), 128))
           ]),
           _: 1
@@ -2199,17 +2217,17 @@ function o5(t, e) {
   return l(), c("div", t5, [
     e[0] || (e[0] = n("div", { class: "absolute h-full w-full top-0 left-0 bg-gray-900 opacity-40" }, null, -1)),
     n("div", n5, [
-      x(t.$slots, "default")
+      b(t.$slots, "default")
     ])
   ]);
 }
-const l5 = /* @__PURE__ */ g(e5, [["render", o5]]), r5 = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
+const l5 = /* @__PURE__ */ g(e5, [["render", o5]]), a5 = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
   __proto__: null,
   AppDialog: o1,
   AppHeader: X0,
   AppNotification: Y0,
   AppOverlay: l5
-}, Symbol.toStringTag, { value: "Module" })), Q = { ...Wt, ...be, ...n0, ...U0, ...r5 }, i5 = {
+}, Symbol.toStringTag, { value: "Module" })), Q = { ...Wt, ...be, ...n0, ...U0, ...a5 }, i5 = {
   install: (t) => {
     Object.keys(Q).forEach((e) => {
       t.component(e, Q[e]);