vuesp-components 2.2.0 → 2.2.1

package/dist/components/index.es.js

@@ -0,0 +1,3095 @@
+import { defineComponent as S, resolveComponent as Ee, openBlock as f, createElementBlock as v, Fragment as I, createCommentVNode as T, createElementVNode as o, normalizeClass as V, createVNode as h, withCtx as y, createBlock as j, renderSlot as k, markRaw as N, computed as M, withModifiers as q, toDisplayString as $, unref as W, TransitionGroup as Le, renderList as R, mergeProps as H, ref as A, watch as re, resolveDynamicComponent as xe, Transition as _e, normalizeStyle as fe, createTextVNode as D, normalizeProps as F, guardReactiveProps as U, onMounted as le, onUnmounted as Me, reactive as Qe, useTemplateRef as Ae, withDirectives as De, vShow as et, vModelText as tt, createSlots as nt, isRef as st } from "vue";
+import { a as lt, V as Ie, i as B, g as je, f as $e, j as ce, k as ot, c as at, h as it, d as se, _ as He, e as Z } from "../VDialog.vue_vue_type_script_setup_true_lang-BLLrcXdW.js";
+import { b as ua, l as ma } from "../VDialog.vue_vue_type_script_setup_true_lang-BLLrcXdW.js";
+import { f as rt, t as ct, g as dt, u as ue, s as ut, d as mt } from "../app-CG8zhRFf.js";
+import { d as ke, e as ft, o as pt } from "../useDialog-ALG4kFE7.js";
+import { getDataValue as vt } from "../dashboard/index.es.js";
+import { useForm as gt } from "../composables/index.es.js";
+import { required as ht, maxLen as bt } from "../validate/index.es.js";
+const yt = { class: "no-scrollbar flex flex-col overflow-y-auto duration-300 ease-linear h-full" }, Io = /* @__PURE__ */ S({
+  __name: "AppAside",
+  props: {
+    isSidebar: { type: Boolean, default: !1 }
+  },
+  emits: ["sidebar"],
+  setup(e, { emit: n }) {
+    const l = n, s = () => {
+      e.isSidebar && l("sidebar", !e.isSidebar);
+    };
+    return (t, a) => {
+      const c = Ee("router-link");
+      return f(), v(I, null, [
+        e.isSidebar ? (f(), v("div", {
+          key: 0,
+          class: "lg:hidden overlay fixed left-0 top-0 h-full w-full bg-black/40 z-10 bg-blur",
+          onClick: s
+        })) : T("", !0),
+        o("aside", {
+          class: V([e.isSidebar ? "translate-x-0 lg:w-[90px]" : "-translate-x-full", "overflow-x-hidden fixed top-0 left-0 z-10 flex lg:static h-full w-[290px] flex-col overflow-y-auto border-r border-gray-200 px-5 transition-all duration-350 lg:translate-x-0 dark:border-gray-800 bg-white dark:bg-gray-900"])
+        }, [
+          o("div", {
+            class: V([e.isSidebar ? "justify-center" : "justify-between", "sidebar-header flex items-center gap-2 pt-6 pb-6 justify-between"])
+          }, [
+            h(c, { to: "/" }, {
+              default: y(() => [
+                e.isSidebar ? (f(), j(lt, {
+                  key: 0,
+                  class: "h-[30px] text-primary"
+                })) : (f(), j(Ie, {
+                  key: 1,
+                  class: "h-[30px] text-primary"
+                }))
+              ]),
+              _: 1
+            })
+          ], 2),
+          o("div", yt, [
+            k(t.$slots, "default")
+          ])
+        ], 2)
+      ], 64);
+    };
+  }
+}), xt = {
+  viewBox: "0 0 24 24",
+  width: "1.2em",
+  height: "1.2em"
+};
+function _t(e, n) {
+  return f(), v("svg", xt, [...n[0] || (n[0] = [
+    o("path", {
+      fill: "currentColor",
+      d: "M4.5 10.5c-.825 0-1.5.675-1.5 1.5s.675 1.5 1.5 1.5S6 12.825 6 12s-.675-1.5-1.5-1.5m15 0c-.825 0-1.5.675-1.5 1.5s.675 1.5 1.5 1.5S21 12.825 21 12s-.675-1.5-1.5-1.5m-7.5 0c-.825 0-1.5.675-1.5 1.5s.675 1.5 1.5 1.5s1.5-.675 1.5-1.5s-.675-1.5-1.5-1.5"
+    }, null, -1)
+  ])]);
+}
+const Pe = N({ name: "ri-more-line", render: _t }), $t = {
+  viewBox: "0 0 24 24",
+  width: "1.2em",
+  height: "1.2em"
+};
+function kt(e, n) {
+  return f(), v("svg", $t, [...n[0] || (n[0] = [
+    o("path", {
+      fill: "currentColor",
+      d: "M4 18h2v2h12V4H6v2H4V3a1 1 0 0 1 1-1h14a1 1 0 0 1 1 1v18a1 1 0 0 1-1 1H5a1 1 0 0 1-1-1zm2-7h7v2H6v3l-5-4l5-4z"
+    }, null, -1)
+  ])]);
+}
+const wt = N({ name: "ri-logout-box-line", render: kt }), Ct = {
+  viewBox: "0 0 24 24",
+  width: "1.2em",
+  height: "1.2em"
+};
+function St(e, n) {
+  return f(), v("svg", Ct, [...n[0] || (n[0] = [
+    o("path", {
+      fill: "currentColor",
+      d: "M5 18h14v-6.969C19 7.148 15.866 4 12 4s-7 3.148-7 7.031zm7-16c4.97 0 9 4.043 9 9.031V20H3v-8.969C3 6.043 7.03 2 12 2M9.5 21h5a2.5 2.5 0 0 1-5 0"
+    }, null, -1)
+  ])]);
+}
+const Ne = N({ name: "ri-notification-line", render: St }), zt = {
+  viewBox: "0 0 24 24",
+  width: "1.2em",
+  height: "1.2em"
+};
+function Vt(e, n) {
+  return f(), v("svg", zt, [...n[0] || (n[0] = [
+    o("path", {
+      fill: "currentColor",
+      d: "M10 7a7 7 0 0 0 12 4.9v.1c0 5.523-4.477 10-10 10S2 17.523 2 12S6.477 2 12 2h.1A6.98 6.98 0 0 0 10 7m-6 5a8 8 0 0 0 15.062 3.762A9 9 0 0 1 8.238 4.938A8 8 0 0 0 4 12"
+    }, null, -1)
+  ])]);
+}
+const Tt = N({ name: "ri-moon-line", render: Vt }), Bt = {
+  viewBox: "0 0 24 24",
+  width: "1.2em",
+  height: "1.2em"
+};
+function Et(e, n) {
+  return f(), v("svg", Bt, [...n[0] || (n[0] = [
+    o("path", {
+      fill: "currentColor",
+      d: "M12 18a6 6 0 1 1 0-12a6 6 0 0 1 0 12m0-2a4 4 0 1 0 0-8a4 4 0 0 0 0 8M11 1h2v3h-2zm0 19h2v3h-2zM3.515 4.929l1.414-1.414L7.05 5.636L5.636 7.05zM16.95 18.364l1.414-1.414l2.121 2.121l-1.414 1.414zm2.121-14.85l1.414 1.415l-2.121 2.121l-1.414-1.414zM5.636 16.95l1.414 1.414l-2.121 2.121l-1.414-1.414zM23 11v2h-3v-2zM4 11v2H1v-2z"
+    }, null, -1)
+  ])]);
+}
+const Lt = N({ name: "ri-sun-line", render: Et }), Mt = {
+  viewBox: "0 0 24 24",
+  width: "1.2em",
+  height: "1.2em"
+};
+function At(e, n) {
+  return f(), v("svg", Mt, [...n[0] || (n[0] = [
+    o("path", {
+      fill: "currentColor",
+      d: "M3 4h18v2H3zm0 7h18v2H3zm0 7h18v2H3z"
+    }, null, -1)
+  ])]);
+}
+const Dt = N({ name: "ri-menu-line", render: At }), It = { class: "bg-white dark:bg-gray-900 border-b border-gray-300 dark:border-gray-700 left-0 w-full z-10 sticky top-0" }, jt = { class: "px-4 py-4 sm:px-6 lg:px-8" }, Ht = { class: "container mx-auto flex flex-auto items-center" }, Pt = { class: "lg:hidden h-[30px]" }, Nt = { class: "gap-4 hidden lg:flex" }, Ot = { class: "lg:hidden flex gap-4" }, Ft = { class: "ms-2" }, jo = /* @__PURE__ */ S({
+  __name: "AppHeader",
+  props: {
+    changeTheme: { type: Function },
+    notifications: {}
+  },
+  emits: ["sidebar", "notif"],
+  setup(e, { emit: n }) {
+    const l = n, s = [
+      { name: "Theme", value: 1 },
+      { name: "Notification", value: 2 },
+      { name: "Logout", value: 3 }
+    ], t = M(() => !!e.notifications.find((i) => i.isNew)), a = (i) => l("sidebar", i), c = (i) => l("notif", i), r = async () => await fetch("/", { headers: { Authorization: "Basic AAAAAAAAAAAAAAAAAAA=" } }), u = () => {
+      e.changeTheme && e.changeTheme();
+    }, d = ({ value: i }, m) => {
+      i == 1 && u(), i == 2 && c(m), i == 3 && r();
+    };
+    return (i, m) => {
+      const p = Dt, b = Ee("router-link"), g = Lt, x = Tt, z = Ne, E = wt, w = Pe;
+      return f(), v("header", It, [
+        o("div", jt, [
+          o("div", Ht, [
+            h(B, {
+              type: "icon",
+              onClick: a
+            }, {
+              default: y(() => [
+                h(p, { class: "size-5" })
+              ]),
+              _: 1
+            }),
+            m[1] || (m[1] = o("div", { class: "lg:hidden flex-auto" }, null, -1)),
+            o("div", Pt, [
+              h(b, { to: "/" }, {
+                default: y(() => [
+                  h(Ie, { class: "h-[30px] text-primary" })
+                ]),
+                _: 1
+              })
+            ]),
+            m[2] || (m[2] = o("div", { class: "flex-auto" }, null, -1)),
+            o("div", Nt, [
+              h(B, {
+                type: "icon",
+                onClick: u
+              }, {
+                default: y(() => [
+                  h(g, { class: "dark:hidden" }),
+                  h(x, { class: "hidden dark:flex" })
+                ]),
+                _: 1
+              }),
+              h(B, {
+                type: "icon",
+                onClick: c
+              }, {
+                default: y(() => [
+                  o("span", {
+                    class: V([t.value ? "flex" : "hidden", "absolute right-0 top-0.5 z-1 h-2 w-2 rounded-full bg-orange-400"])
+                  }, [...m[0] || (m[0] = [
+                    o("span", { class: "absolute -z-1 inline-flex h-full w-full animate-ping rounded-full bg-orange-400 opacity-75" }, null, -1)
+                  ])], 2),
+                  h(z, { class: "size-5" })
+                ]),
+                _: 1
+              }),
+              h(B, {
+                type: "icon",
+                onClick: q(r, ["prevent"])
+              }, {
+                default: y(() => [
+                  h(E, { class: "size-5" })
+                ]),
+                _: 1
+              })
+            ]),
+            o("div", Ot, [
+              h(je, {
+                left: "unset",
+                right: "0",
+                top: "0"
+              }, {
+                activator: y(({ on: P }) => [
+                  h(B, {
+                    type: "icon",
+                    class: "flex",
+                    onClick: P.click
+                  }, {
+                    default: y(() => [
+                      h(w)
+                    ]),
+                    _: 1
+                  }, 8, ["onClick"])
+                ]),
+                default: y(() => [
+                  h($e, {
+                    items: s,
+                    onClick: d
+                  }, {
+                    default: y(({ item: P }) => [
+                      o("span", Ft, $(P.name), 1)
+                    ]),
+                    _: 1
+                  })
+                ]),
+                _: 1
+              })
+            ])
+          ])
+        ])
+      ]);
+    };
+  }
+}), Ut = { class: "relative flex items-center gap-2 w-full p-2 overflow-hidden" }, Rt = { class: "flex-auto text-xs" }, Kt = { class: "text-gray-500 dark:text-gray-400 mt-1" }, Wt = /* @__PURE__ */ S({
+  __name: "CardNotification",
+  props: {
+    empty: {},
+    key: {},
+    isNew: {},
+    color: {},
+    timeout: {},
+    date: {},
+    text: {}
+  },
+  emits: ["remove", "read"],
+  setup(e, { emit: n }) {
+    const l = e, s = n, t = ["", "bg-green-500", "bg-red-500", "bg-yellow-500", "bg-blue-500"], a = (u) => t[u], c = (u) => s("remove", u), r = (u) => s("read", u);
+    return (u, d) => {
+      const i = Ne, m = ce;
+      return f(), v("div", Ut, [
+        o("div", {
+          class: V(["absolute left-0 top-0 w-[3px] h-full", a(l.color)])
+        }, null, 2),
+        h(B, {
+          class: "shrink-0",
+          type: "icon",
+          onClick: r
+        }, {
+          default: y(() => [
+            o("span", {
+              class: V([l.isNew ? "flex" : "hidden", "absolute right-0 top-0.5 z-1 h-2 w-2 rounded-full bg-orange-400"])
+            }, [...d[0] || (d[0] = [
+              o("span", { class: "absolute -z-1 inline-flex h-full w-full animate-ping rounded-full bg-orange-400 opacity-75" }, null, -1)
+            ])], 2),
+            h(i, { class: "size-5" })
+          ]),
+          _: 1
+        }),
+        o("div", Rt, [
+          o("div", null, $(l.text), 1),
+          o("div", Kt, $(W(rt)(l.date)) + " (" + $(W(ct)(l.date)) + ")", 1)
+        ]),
+        h(B, {
+          class: "shrink-0",
+          type: "icon",
+          size: "sm",
+          onClick: c
+        }, {
+          default: y(() => [
+            h(m, { class: "size-4" })
+          ]),
+          _: 1
+        })
+      ]);
+    };
+  }
+}), qt = { class: "no-scrollbar flex flex-col overflow-y-auto duration-300 ease-linear h-full" }, Gt = {
+  key: 0,
+  class: "flex flex-col gap-2 p-2"
+}, Ho = /* @__PURE__ */ S({
+  __name: "AppNotification",
+  props: {
+    value: { type: Boolean },
+    notifications: {}
+  },
+  emits: ["close", "remove", "read"],
+  setup(e, { emit: n }) {
+    const l = e, s = n, t = M(() => !!l.notifications.find((d) => d.isNew)), a = M(() => !!l.notifications.length), c = (d) => s("close", d), r = (d) => s("remove", d), u = (d) => s("read", d);
+    return (d, i) => (f(), v(I, null, [
+      l.value ? (f(), v("div", {
+        key: 0,
+        class: "overlay fixed left-0 top-0 h-full w-full bg-black/40 bg-blur",
+        onClick: c
+      })) : T("", !0),
+      o("aside", {
+        class: V([l.value ? "translate-x-0 " : "translate-x-full", "overflow-x-hidden fixed top-[73px] right-0 flex h-[calc(100%-73px)] w-[290px] md:w-80 border-l border-gray-200 flex-col overflow-y-auto transition-all duration-350 dark:border-gray-800 bg-white dark:bg-gray-900"])
+      }, [
+        o("div", qt, [
+          k(d.$slots, "header", { isNew: t.value }),
+          a.value ? (f(), v("div", Gt, [
+            h(Le, {
+              "enter-active-class": "transition-all duration-300 ",
+              "enter-from-class": "opacity-0 translate-x-1/2",
+              "enter-to-class": "opacity-100 translate-x-0",
+              "leave-active-class": "transition-all duration-300 absolute",
+              "leave-from-class": "opacity-100 translate-x-0",
+              "leave-to-class": "opacity-0 translate-x-1/2"
+            }, {
+              default: y(() => [
+                (f(!0), v(I, null, R(l.notifications, (m) => (f(), v("div", {
+                  key: m.date,
+                  class: "relative"
+                }, [
+                  k(d.$slots, "card", { item: m }, () => [
+                    h(Wt, H({ ref_for: !0 }, m, {
+                      class: "bg-gray-200/50 dark:bg-gray-800/50 rounded-md",
+                      onRemove: (p) => r(m),
+                      onRead: (p) => u(m)
+                    }), null, 16, ["onRemove", "onRead"])
+                  ])
+                ]))), 128))
+              ]),
+              _: 3
+            })
+          ])) : k(d.$slots, "empty", {}, void 0, void 0, 1)
+        ])
+      ], 2)
+    ], 64));
+  }
+}), Zt = {}, Jt = { class: "fixed h-full w-full top-0 left-0 z-20" }, Xt = { class: "absolute top-1/2 left-1/2 -translate-x-1/2 -translate-y-1/2" };
+function Yt(e, n) {
+  return f(), v("div", Jt, [
+    n[0] || (n[0] = o("div", { class: "absolute h-full w-full top-0 left-0 bg-black/60 bg-blur" }, null, -1)),
+    o("div", Xt, [
+      k(e.$slots, "default")
+    ])
+  ]);
+}
+const Po = /* @__PURE__ */ ot(Zt, [["render", Yt]]), Qt = {
+  viewBox: "0 0 24 24",
+  width: "1.2em",
+  height: "1.2em"
+};
+function en(e, n) {
+  return f(), v("svg", Qt, [...n[0] || (n[0] = [
+    o("path", {
+      fill: "currentColor",
+      d: "m13.172 12l-4.95-4.95l1.414-1.413L16 12l-6.364 6.364l-1.414-1.415z"
+    }, null, -1)
+  ])]);
+}
+const tn = N({ name: "ri-arrow-right-s-line", render: en }), nn = { class: "mb-4 flex flex-col gap-2" }, sn = { class: "size-6 flex-[0_0_24px] opacity-60" }, ln = ["onClick"], on = { class: "flex flex-col gap-2" }, an = { class: "flex gap-2 ms-8" }, rn = { class: "size-5 flex-[0_0_24px]" }, cn = { class: "flex-1 first-letter:uppercase text-sm" }, No = /* @__PURE__ */ S({
+  __name: "AppNav",
+  props: {
+    menu: { default: () => [] },
+    fullPath: { default: "" },
+    isSidebar: { type: Boolean, default: !1 }
+  },
+  emits: ["sidebar"],
+  setup(e, { emit: n }) {
+    const l = n, s = A(""), t = ({ name: c }) => {
+      e.isSidebar && l("sidebar", !e.isSidebar), s.value !== c && (s.value = s.value === c ? "" : c);
+    }, a = (c) => e.fullPath === c;
+    return re(
+      () => e.menu,
+      () => {
+        var c;
+        return s.value = ((c = dt(e.menu, e.fullPath)) == null ? void 0 : c.name) || "";
+      }
+    ), (c, r) => {
+      const u = tn;
+      return f(), v("nav", null, [
+        o("ul", nn, [
+          (f(!0), v(I, null, R(e.menu, (d) => (f(), v("li", {
+            key: d.name
+          }, [
+            (f(), j(xe(d.path ? "router-link" : "span"), {
+              to: d.path,
+              class: V(["flex gap-2 items-center px-3 py-2 rounded", a(d.path) ? "bg-blue-500/10" : "hover:bg-gray-500/10"]),
+              onClick: q((i) => t(d), ["prevent", "stop"])
+            }, {
+              default: y(() => [
+                o("div", sn, [
+                  k(c.$slots, "icon", { item: d })
+                ]),
+                o("span", {
+                  class: V(["flex-1 first-letter:uppercase text-sm", e.isSidebar ? "lg:hidden" : ""])
+                }, $(d.name), 3),
+                o("button", {
+                  class: V(["cursor-pointer", [e.isSidebar ? "lg:hidden" : ""]]),
+                  onClick: q((i) => t(d), ["prevent", "stop"])
+                }, [
+                  d.children ? (f(), j(u, { key: 0 })) : T("", !0)
+                ], 10, ln)
+              ]),
+              _: 2
+            }, 1032, ["to", "class", "onClick"])),
+            d.children ? (f(), v("div", {
+              key: 0,
+              class: V(["translate transform overflow-hidden mt-2", [e.isSidebar ? "lg:hidden" : "", s.value === d.name ? "block" : "hidden"]])
+            }, [
+              o("ul", on, [
+                (f(!0), v(I, null, R(d.children, ({ name: i, path: m, icon: p }) => (f(), v("li", { key: i }, [
+                  (f(), j(xe(m ? "router-link" : "span"), {
+                    to: m,
+                    class: V(["flex gap-2 items-center px-3 py-2 rounded", a(m) ? "bg-blue-500/10" : "hover:bg-gray-500/10"])
+                  }, {
+                    default: y(() => [
+                      o("div", an, [
+                        o("div", rn, [
+                          k(c.$slots, "icon-children", {
+                            item: { name: i, path: m, icon: p }
+                          })
+                        ]),
+                        o("span", cn, $(i), 1)
+                      ])
+                    ]),
+                    _: 2
+                  }, 1032, ["to", "class"]))
+                ]))), 128))
+              ])
+            ], 2)) : T("", !0)
+          ]))), 128))
+        ])
+      ]);
+    };
+  }
+}), dn = {
+  key: 0,
+  class: "w-full min-w-[260px] max-w-xs p-4 bg-white rounded shadow-lg dark:bg-gray-800",
+  role: "alert"
+}, un = { class: "flex items-center gap-4 text-sm" }, mn = {
+  key: 0,
+  class: "text-green-600"
+}, fn = {
+  key: 1,
+  class: "relative block h-4 w-full rounded overflow-hidden bg-gray-200 dark:bg-gray-900/50 select-none mt-2"
+}, pn = { class: "absolute left-[140px] top-1/2 -translate-1/2 text-sm font-bold text-black dark:text-white text-center leading-none" }, vn = { class: "absolute left-[140px] top-1/2 -translate-1/2 text-sm font-bold text-white text-center leading-none" }, Oo = /* @__PURE__ */ S({
+  __name: "AppProgress",
+  props: {
+    timeout: { default: 5e3 },
+    key: {},
+    status: { default: 0 },
+    empty: {},
+    size: { default: 0 },
+    length: { default: 0 }
+  },
+  setup(e) {
+    const n = A(!1), l = M(() => !!e.length), s = M(() => !!(l.value && t.value === 100 && !e.status)), t = M(() => e.status ? Math.ceil(e.size * 100 / e.length) : 100), a = ke(() => {
+      n.value = !1;
+    }, e.timeout);
+    return re(
+      () => [e.size, e.status],
+      () => {
+        n.value = !0, a();
+      }
+    ), (c, r) => {
+      const u = ce;
+      return f(), j(_e, {
+        "enter-active-class": "duration-300 ease-out",
+        "enter-from-class": "transform opacity-0 translate-x-full",
+        "enter-to-class": "opacity-100 translate-x-0",
+        "leave-active-class": "duration-200 ease-in",
+        "leave-from-class": "opacity-100 translate-y-0",
+        "leave-to-class": "transform opacity-0 -translate-y-8"
+      }, {
+        default: y(() => [
+          n.value ? (f(), v("div", dn, [
+            o("div", un, [
+              k(c.$slots, "default", { isDone: s.value }, () => [
+                r[1] || (r[1] = o("div", { class: "flex-auto" }, "Progress...", -1)),
+                s.value ? (f(), v("span", mn, "Done")) : T("", !0)
+              ]),
+              o("button", {
+                class: "cursor-pointer transition text-gray-700 dark:text-gray-400 self-start hover:text-gray-600",
+                onClick: r[0] || (r[0] = (d) => n.value = !1)
+              }, [
+                h(u, { class: "size-4" })
+              ])
+            ]),
+            l.value ? (f(), v("div", {
+              key: 0,
+              class: "h-[2px] fixed top-0 left-0 w-full bg-blue-600 transition-all duration-500",
+              style: fe(`width: ${t.value}%`)
+            }, null, 4)) : T("", !0),
+            l.value ? (f(), v("div", fn, [
+              o("div", pn, $(t.value) + "%", 1),
+              o("div", {
+                class: "bg-blue-600 rounded h-4 overflow-hidden relative transition-all duration-500",
+                style: fe(`width: ${t.value}%`)
+              }, [
+                o("div", vn, $(t.value) + "%", 1)
+              ], 4)
+            ])) : T("", !0)
+          ])) : T("", !0)
+        ]),
+        _: 3
+      });
+    };
+  }
+}), gn = { class: "my-4 text-gray-700 dark:text-gray-400" }, hn = { class: "flex flex-col md:flex-row flex-wrap md:gap-4 text-sm" }, bn = { class: "flex gap-2" }, yn = { class: "text-gray-700 dark:text-gray-400" }, xn = { class: "flex gap-2" }, _n = { class: "flex gap-2" }, $n = { class: "text-gray-700 dark:text-gray-400" }, kn = { class: "flex gap-2" }, wn = { class: "text-gray-700 dark:text-gray-400" }, Cn = { class: "flex flex-col gap-4 text-sm" }, Sn = { class: "flex gap-4" }, Fo = /* @__PURE__ */ S({
+  __name: "BlockInfo",
+  props: {
+    pkg: {},
+    key: {},
+    id: { default: 0 },
+    firmware: { default: () => [] },
+    totalBytes: {},
+    usedBytes: {},
+    uptime: {},
+    name: {},
+    board: {}
+  },
+  setup(e) {
+    const n = M(() => e.firmware.join(".")), l = M(() => {
+      var t, a, c, r, u, d, i;
+      const s = [];
+      return (t = e.pkg) != null && t.homepage && s.push({ name: "homepage", href: e.pkg.homepage }), (c = (a = e.pkg) == null ? void 0 : a.repository) != null && c.url && s.push({ name: "repository", href: e.pkg.repository.url }), (u = (r = e.pkg) == null ? void 0 : r.bugs) != null && u.url && s.push({ name: "bugs", href: e.pkg.bugs.url }), (d = e.pkg) != null && d.author && s.push({ name: "author", href: `mailto:${(i = e.pkg) == null ? void 0 : i.author}` }), s;
+    });
+    return (s, t) => {
+      var a, c;
+      return f(), v("div", null, [
+        o("p", gn, $((a = e.pkg) == null ? void 0 : a.description), 1),
+        o("div", hn, [
+          o("div", bn, [
+            t[0] || (t[0] = D(" Firmware (hw): ", -1)),
+            o("span", yn, $(n.value), 1)
+          ]),
+          o("div", xn, [
+            o("div", _n, [
+              t[1] || (t[1] = D(" Version (web): ", -1)),
+              o("span", $n, $((c = e.pkg) == null ? void 0 : c.version), 1)
+            ])
+          ]),
+          t[3] || (t[3] = o("div", { class: "flex-auto" }, null, -1)),
+          o("div", kn, [
+            t[2] || (t[2] = D(" ID: ", -1)),
+            o("span", wn, $(e.id.toString(16)), 1)
+          ])
+        ]),
+        t[4] || (t[4] = o("hr", { class: "dark:text-gray-700 text-gray-200 my-2" }, null, -1)),
+        o("div", Cn, [
+          o("div", Sn, [
+            k(s.$slots, "links", { links: l.value })
+          ])
+        ])
+      ]);
+    };
+  }
+}), zn = ["onClick"], Vn = { class: "mr-2" }, Tn = { class: "text-sm" }, Bn = { class: "text-gray-400 text-xs" }, En = {
+  key: 0,
+  class: "flex justify-center"
+}, Ln = { class: "flex justify-end mt-4" }, Uo = /* @__PURE__ */ S({
+  __name: "BlockScan",
+  props: {
+    items: { default: () => [] }
+  },
+  emits: ["scan", "select"],
+  setup(e, { emit: n }) {
+    const l = n, s = ["OPEN", "WEP", "WPA_PSK", "WPA2_PSK", "WPA_WPA2_PSK", "MAX", "", "NO", "AUTO"], t = (c) => l("select", c), a = (c) => l("scan", c);
+    return (c, r) => {
+      const u = at, d = $e, i = it, m = B;
+      return f(), v("div", null, [
+        h(d, {
+          items: e.items,
+          class: "bg-transparent! ring-0!"
+        }, {
+          default: y(({ item: p }) => [
+            o("div", {
+              class: "flex items-center w-full",
+              onClick: (b) => t(p)
+            }, [
+              o("div", Vn, [
+                h(u, F(U(p)), null, 16)
+              ]),
+              o("div", null, [
+                o("div", Tn, $(p.ssid), 1),
+                o("div", Bn, $(c.$t("security")) + " : " + $(s[p.encryptionType] || "unknown"), 1)
+              ])
+            ], 8, zn)
+          ]),
+          _: 1
+        }, 8, ["items"]),
+        e.items.length ? T("", !0) : (f(), v("div", En, [
+          h(i, { class: "text-primary" })
+        ])),
+        o("div", Ln, [
+          h(m, {
+            color: "blue",
+            onClick: a
+          }, {
+            default: y(() => [
+              D($(c.$t("scan")), 1)
+            ]),
+            _: 1
+          })
+        ])
+      ]);
+    };
+  }
+}), Mn = { class: "md:flex items-center mb-4" }, An = { class: "flex-auto text-gray-600 bg:text-gray-400 mb-2" }, Dn = { class: "md:max-w-50" }, In = { class: "flex items-center mb-4" }, jn = { class: "flex-auto text-gray-600 bg:text-gray-400" }, Hn = { class: "flex items-center mb-4" }, Pn = { class: "flex-auto text-gray-600 bg:text-gray-400" }, Ro = /* @__PURE__ */ S({
+  __name: "BlockService",
+  props: {
+    locale: {},
+    locales: {}
+  },
+  emits: ["reboot", "reset", "locale"],
+  setup(e, { emit: n }) {
+    const l = n, s = (a) => l("locale", a), t = (a) => {
+      var c;
+      return (c = e.locales.find((r) => r.value === a)) == null ? void 0 : c.name;
+    };
+    return (a, c) => {
+      const r = se, u = B;
+      return f(), v(I, null, [
+        o("div", Mn, [
+          o("div", An, $(a.$t("selectLang")), 1),
+          o("div", Dn, [
+            h(r, {
+              "model-value": t(e.locale),
+              label: a.$t("lang"),
+              items: e.locales,
+              onChange: s
+            }, null, 8, ["model-value", "label", "items"])
+          ])
+        ]),
+        o("div", In, [
+          o("div", jn, $(a.$t("rebootDev")), 1),
+          h(u, {
+            class: "min-w-[100px]",
+            color: "red",
+            outline: "",
+            onClick: c[0] || (c[0] = (d) => l("reboot", d))
+          }, {
+            default: y(() => [
+              D($(a.$t("reboot")), 1)
+            ]),
+            _: 1
+          })
+        ]),
+        o("div", Hn, [
+          o("div", Pn, $(a.$t("resetConf")), 1),
+          h(u, {
+            class: "min-w-[100px]",
+            color: "red",
+            onClick: c[1] || (c[1] = (d) => l("reset", d))
+          }, {
+            default: y(() => [
+              D($(a.$t("reset")), 1)
+            ]),
+            _: 1
+          })
+        ])
+      ], 64);
+    };
+  }
+}), Nn = { class: "grid grid-cols-1 gap-4 lg:max-w-[360px] min-w-[250px]" }, On = { class: "flex flex-col w-full items-center gap-2" }, Fn = ["title"], Un = { class: "absolute left-[110px] top-1/2 -translate-1/2 text-sm font-bold text-black dark:text-white text-center leading-none" }, Rn = { class: "absolute left-[110px] top-1/2 -translate-1/2 text-sm font-bold text-white text-center leading-none" }, Kn = { class: "flex justify-between w-full text-xs" }, Wn = { class: "text-gray-500 dark:text-gray-400" }, qn = { class: "text-sm" }, Gn = { class: "text-gray-500 dark:text-gray-400 text-left" }, Zn = { class: "text-right text-xs" }, Ko = /* @__PURE__ */ S({
+  __name: "BlockStatus",
+  props: {
+    pkg: {},
+    key: {},
+    id: { default: 0 },
+    firmware: { default: () => [] },
+    totalBytes: { default: 0 },
+    usedBytes: { default: 0 },
+    uptime: { default: 0 },
+    name: {},
+    board: {}
+  },
+  setup(e) {
+    const n = A(e.uptime);
+    let l = null;
+    const s = M(() => e.firmware.join(".")), t = M(() => [
+      { name: "used", value: ue(e.usedBytes) },
+      { name: "available", value: ue(e.totalBytes - e.usedBytes) },
+      { name: "total", value: ue(e.totalBytes) }
+    ]), a = M(() => {
+      var u;
+      return [
+        { name: "uptime", value: ut(n.value) },
+        { name: "id", value: `${e.id.toString(16)} (${e.id})` },
+        { name: "firmware", value: s.value },
+        { name: "version", value: (u = e.pkg) == null ? void 0 : u.version }
+      ];
+    }), c = M(() => e.usedBytes ? Math.round(e.usedBytes * 100 / e.totalBytes) : 0), r = () => {
+      n.value++, l = setTimeout(r, 1e3);
+    };
+    return le(() => {
+      r();
+    }), Me(() => {
+      n.value = 0, l && clearTimeout(l);
+    }), (u, d) => {
+      var i, m, p;
+      return f(), v("div", Nn, [
+        o("div", On, [
+          o("div", {
+            class: "relative block h-4 w-full rounded overflow-hidden bg-gray-200 dark:bg-gray-800 select-none",
+            title: `${c.value}%`
+          }, [
+            o("div", Un, $(c.value) + "%", 1),
+            o("div", {
+              class: "bg-blue-600 rounded h-4 overflow-hidden relative transition-all duration-500",
+              style: fe(`width: ${c.value}%`)
+            }, [
+              o("div", Rn, $(c.value) + "%", 1)
+            ], 4)
+          ], 8, Fn),
+          o("div", Kn, [
+            (f(!0), v(I, null, R(t.value, (b) => (f(), v("div", {
+              key: b.name,
+              class: "flex-auto"
+            }, [
+              o("div", Wn, [
+                k(u.$slots, "name", { item: b })
+              ]),
+              o("div", null, $(b.value), 1)
+            ]))), 128))
+          ])
+        ]),
+        o("div", qn, [
+          (f(!0), v(I, null, R(a.value, (b) => (f(), v("div", {
+            key: b.name,
+            class: "flex justify-between items-center"
+          }, [
+            o("div", Gn, [
+              k(u.$slots, "name", { item: b })
+            ]),
+            o("div", Zn, $(b.value), 1)
+          ]))), 128))
+        ]),
+        o("div", null, [
+          k(u.$slots, "default", {
+            home: (i = e.pkg) == null ? void 0 : i.homepage,
+            repo: (p = (m = e.pkg) == null ? void 0 : m.repository) == null ? void 0 : p.url
+          })
+        ])
+      ]);
+    };
+  }
+}), Jn = { class: "flex items-center cursor-pointer" }, Xn = /* @__PURE__ */ S({
+  __name: "VFile",
+  emits: ["change"],
+  setup(e, { emit: n }) {
+    const l = n, s = async (t) => {
+      const a = t.target;
+      a.files && l("change", a.files);
+    };
+    return (t, a) => (f(), v("label", Jn, [
+      o("input", H({
+        type: "file",
+        class: "hidden"
+      }, t.$attrs, { onChange: s }), null, 16),
+      k(t.$slots, "default")
+    ]));
+  }
+}), Yn = { class: "md:flex" }, Qn = { class: "text-gray-600 bg:text-gray-400 first-letter:uppercase min-w-19" }, Wo = /* @__PURE__ */ S({
+  __name: "BlockUpdate",
+  emits: ["update"],
+  setup(e, { emit: n }) {
+    const l = n, s = Qe({ firmware: null, littlefs: null }), t = (r) => r ? Array.from(r).map((u) => `${u.name} (${ue(u.size)})`).join("") : "", a = (r, u) => {
+      const d = new FormData();
+      for (let i = 0; i < r.length; i++) {
+        const m = r.item(i);
+        if (!m) return;
+        d.append(`file[${i}]`, m, u);
+      }
+      return d;
+    }, c = (r, u) => {
+      if (!u) return;
+      const d = a(u, r);
+      d && l("update", r, d);
+    };
+    return (r, u) => {
+      const d = B;
+      return f(), v("div", null, [
+        (f(!0), v(I, null, R(s, (i, m) => (f(), v("div", {
+          key: m,
+          class: "mb-4 flex items-center"
+        }, [
+          h(Xn, {
+            accept: ".bin",
+            onChange: (p) => s[m] = p,
+            class: "flex-auto"
+          }, {
+            default: y(() => [
+              o("div", Yn, [
+                o("h6", Qn, $(m) + ":", 1),
+                k(r.$slots, "default", {
+                  file: t(i)
+                })
+              ])
+            ]),
+            _: 2
+          }, 1032, ["onChange"]),
+          h(d, {
+            class: "min-w-[100px]",
+            color: "blue",
+            disabled: !i,
+            onClick: (p) => c(`${m}.bin`, i)
+          }, {
+            default: y(() => [
+              D($(r.$t("btnUpdate")), 1)
+            ]),
+            _: 1
+          }, 8, ["disabled", "onClick"])
+        ]))), 128))
+      ]);
+    };
+  }
+}), es = {
+  viewBox: "0 0 24 24",
+  width: "1.2em",
+  height: "1.2em"
+};
+function ts(e, n) {
+  return f(), v("svg", es, [...n[0] || (n[0] = [
+    o("path", {
+      fill: "currentColor",
+      d: "M12.172 12L9.343 9.173l1.415-1.414L15 12l-4.242 4.242l-1.415-1.414z"
+    }, null, -1)
+  ])]);
+}
+const Oe = N({ name: "ri-arrow-drop-right-line", render: ts }), ns = { class: "flex items-center gap-1.5" }, qo = /* @__PURE__ */ S({
+  __name: "BlockBreadcrumb",
+  props: {
+    items: { default: () => [] }
+  },
+  emits: ["click"],
+  setup(e, { emit: n }) {
+    const l = n, s = (t) => l("click", t);
+    return (t, a) => {
+      const c = Oe;
+      return f(), v("nav", null, [
+        o("ol", ns, [
+          (f(!0), v(I, null, R(e.items, (r, u) => (f(), v("li", {
+            key: u,
+            class: V(["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"])
+          }, [
+            k(t.$slots, "default", { item: r }, () => [
+              (f(), j(xe(r.path ? "a" : "span"), {
+                href: r.path,
+                onClick: (d) => s(r)
+              }, {
+                default: y(() => [
+                  D($(r.name), 1)
+                ]),
+                _: 2
+              }, 1032, ["href", "onClick"]))
+            ]),
+            r.path ? (f(), j(c, {
+              key: 0,
+              class: "rotate-270"
+            })) : T("", !0)
+          ], 2))), 128))
+        ])
+      ]);
+    };
+  }
+}), ss = {
+  viewBox: "0 0 24 24",
+  width: "1.2em",
+  height: "1.2em"
+};
+function ls(e, n) {
+  return f(), v("svg", ss, [...n[0] || (n[0] = [
+    o("path", {
+      fill: "currentColor",
+      d: "M7 6V3a1 1 0 0 1 1-1h12a1 1 0 0 1 1 1v14a1 1 0 0 1-1 1h-3v3c0 .552-.45 1-1.007 1H4.007A1 1 0 0 1 3 21l.003-14c0-.552.45-1 1.006-1zM5.002 8L5 20h10V8zM9 6h8v10h2V4H9zm-2 5h6v2H7zm0 4h6v2H7z"
+    }, null, -1)
+  ])]);
+}
+const os = N({ name: "ri-file-copy2-line", render: ls }), as = { class: "flex-auto flex justify-between" }, is = { class: "text-sm text-gray-500 font-medium line-clamp-2 overflow-hidden" }, rs = { class: "text-sm text-ellipsis overflow-hidden text-nowrap" }, cs = {
+  key: 0,
+  class: "absolute left-1/2 top-1/2 size-[calc(50%)] text-gray-200/30 dark:text-gray-800/30 -translate-1/2"
+}, ds = { class: "min-h-60 relative" }, us = { class: "pt-6" }, ms = { class: "text-center text-3xl text-ellipsis overflow-hidden" }, fs = { class: "text-center text-xl mt-4" }, oe = /* @__PURE__ */ S({
+  __name: "CardBase",
+  props: {
+    size: {},
+    id: {},
+    name: {},
+    type: {},
+    icon: {},
+    value: {},
+    valueTo: {},
+    opts: {},
+    args: {},
+    set: {},
+    get: {},
+    getTo: {}
+  },
+  emits: ["edit", "close", "click", "clone", "open", "setState"],
+  setup(e, { emit: n }) {
+    const l = e, s = n, t = A(!1), a = M(() => ["button", "dimmer"].includes(l.type || "") && l.value ? "text-amber-500" : "text-gray-400"), c = (m) => s("edit", m), r = (m) => s("clone", m), u = () => t.value = !0, d = (m) => s("open", m), i = (m) => {
+      t.value = !1, s("close", m);
+    };
+    return (m, p) => {
+      const b = Pe, g = os;
+      return f(), v("div", {
+        class: "flex flex-col border relative aspect-square rounded-md bg-white dark:bg-gray-900 border-b border-gray-300 dark:border-gray-700 p-2 hover-effect transition-all cursor-pointer",
+        onClick: u
+      }, [
+        o("div", as, [
+          o("div", {
+            class: V([a.value, "size-8 animate-shake"])
+          }, [
+            k(m.$slots, "icon", F(U(l)))
+          ], 2),
+          k(m.$slots, "header", F(U(l)))
+        ]),
+        o("div", null, [
+          k(m.$slots, "body", F(U(l)), () => [
+            o("h6", is, [
+              k(m.$slots, "name", F(U(l)), () => [
+                D($(l.name), 1)
+              ])
+            ]),
+            o("div", rs, [
+              k(m.$slots, "value", F(U(l)), () => [
+                D($(l.valueTo || l.value), 1)
+              ])
+            ])
+          ])
+        ]),
+        l.icon ? (f(), v("div", cs, [
+          k(m.$slots, "icon", F(U(l)))
+        ])) : T("", !0),
+        t.value ? (f(), j(He, {
+          key: 1,
+          size: l.size || "sm",
+          title: e.name,
+          onClose: i,
+          onOpen: d
+        }, {
+          "header-btn": y(() => [
+            h(B, {
+              color: "transparent",
+              onClick: c
+            }, {
+              default: y(() => [
+                h(b)
+              ]),
+              _: 1
+            }),
+            h(B, {
+              color: "transparent",
+              onClick: r
+            }, {
+              default: y(() => [
+                h(g, { class: "size-4 text-gray-500" })
+              ]),
+              _: 1
+            })
+          ]),
+          default: y(() => [
+            o("div", ds, [
+              o("div", us, [
+                o("h3", ms, [
+                  k(m.$slots, "dialog-name", F(U(l)), () => [
+                    D($(l.name), 1)
+                  ])
+                ]),
+                k(m.$slots, "dialog", F(U(l))),
+                o("p", fs, [
+                  k(m.$slots, "dialog-value", F(U(l)), () => [
+                    D($(l.valueTo || l.value), 1)
+                  ])
+                ])
+              ])
+            ])
+          ]),
+          _: 3
+        }, 8, ["size", "title"])) : T("", !0)
+      ]);
+    };
+  }
+}), ps = {
+  viewBox: "0 0 24 24",
+  width: "1.2em",
+  height: "1.2em"
+};
+function vs(e, n) {
+  return f(), v("svg", ps, [...n[0] || (n[0] = [
+    o("path", {
+      fill: "currentColor",
+      d: "m6.265 3.807l1.147 1.639a8 8 0 1 0 9.176 0l1.147-1.639A9.99 9.99 0 0 1 22 12c0 5.523-4.477 10-10 10S2 17.523 2 12a9.99 9.99 0 0 1 4.265-8.193M11 12V2h2v10z"
+    }, null, -1)
+  ])]);
+}
+const gs = N({ name: "ri-shut-down-line", render: vs }), hs = { class: "flex justify-end" }, bs = { class: "flex justify-center py-4" }, Go = /* @__PURE__ */ S({
+  __name: "CardButton",
+  props: {
+    size: {},
+    id: {},
+    name: {},
+    type: {},
+    icon: {},
+    value: {},
+    valueTo: {},
+    opts: {},
+    args: {},
+    set: {},
+    get: {},
+    getTo: {}
+  },
+  emits: ["edit", "close", "click", "clone", "open", "setState"],
+  setup(e, { emit: n }) {
+    const l = e, s = n, t = ({ opts: c = {} }) => {
+      const { disabled: r } = c;
+      return { disabled: r };
+    }, a = () => s("setState", !l.value);
+    return (c, r) => {
+      const u = gs;
+      return f(), j(oe, H(l, {
+        onClick: r[0] || (r[0] = (d) => s("click", d)),
+        onEdit: r[1] || (r[1] = (d) => s("edit", d)),
+        onClone: r[2] || (r[2] = (d) => s("clone", d))
+      }), {
+        icon: y((d) => [
+          k(c.$slots, "icon", F(U(d)))
+        ]),
+        header: y((d) => [
+          o("div", hs, [
+            h(B, H(t(d), {
+              type: "icon",
+              class: l.value ? "text-amber-500" : "text-gray-500",
+              onClick: q(a, ["stop"])
+            }), {
+              default: y(() => [
+                h(u, { class: "size-8" })
+              ]),
+              _: 1
+            }, 16, ["class"])
+          ])
+        ]),
+        dialog: y((d) => [
+          o("div", bs, [
+            h(B, H(t(d), {
+              type: "icon",
+              class: ["size-18", l.value ? "text-amber-500" : "text-gray-500"],
+              onClick: q(a, ["stop"])
+            }), {
+              default: y(() => [
+                h(u, { class: "size-16" })
+              ]),
+              _: 1
+            }, 16, ["class"])
+          ])
+        ]),
+        _: 3
+      }, 16);
+    };
+  }
+}), ys = {
+  viewBox: "0 0 24 24",
+  width: "1.2em",
+  height: "1.2em"
+};
+function xs(e, n) {
+  return f(), v("svg", ys, [...n[0] || (n[0] = [
+    o("path", {
+      fill: "currentColor",
+      d: "M12 22C6.477 22 2 17.523 2 12S6.477 2 12 2s10 4.477 10 10s-4.477 10-10 10m0-2a8 8 0 1 0 0-16a8 8 0 0 0 0 16m1-8h4v2h-6V7h2z"
+    }, null, -1)
+  ])]);
+}
+const _s = N({ name: "ri-time-line", render: xs }), $s = { class: "flex justify-center relative mx-2 my-6" }, Zo = /* @__PURE__ */ S({
+  __name: "CardDate",
+  props: {
+    size: {},
+    id: {},
+    name: {},
+    type: {},
+    icon: {},
+    value: {},
+    valueTo: {},
+    opts: {},
+    args: {},
+    set: {},
+    get: {},
+    getTo: {}
+  },
+  emits: ["edit", "close", "click", "clone", "open", "setState"],
+  setup(e, { emit: n }) {
+    const l = e, s = n, t = Ae("time"), a = (d) => new Date(+d * 1e3).toISOString().slice(0, 16), c = (d) => {
+      var m;
+      const i = (m = d == null ? void 0 : d.target) == null ? void 0 : m.valueAsNumber;
+      i && s("setState", i / 1e3);
+    }, r = ({ name: d, value: i, opts: m = {} }) => {
+      const { disabled: p } = m;
+      return { label: d, modelValue: a(i), disabled: p };
+    }, u = () => {
+      var i, m;
+      const d = (m = (i = t.value) == null ? void 0 : i.$el) == null ? void 0 : m.querySelector("input");
+      d != null && d.showPicker && d.showPicker();
+    };
+    return (d, i) => {
+      const m = _s;
+      return f(), j(oe, H(l, {
+        onClick: i[0] || (i[0] = (p) => s("click", p)),
+        onEdit: i[1] || (i[1] = (p) => s("edit", p)),
+        onClone: i[2] || (i[2] = (p) => s("clone", p))
+      }), {
+        icon: y((p) => [
+          k(d.$slots, "icon", F(U(p)))
+        ]),
+        header: y((p) => [
+          o("div", null, [
+            h(B, {
+              type: "icon",
+              class: "text-gray-500",
+              onClick: q(u, ["stop"])
+            }, {
+              default: y(() => [
+                h(m, { class: "size-7" })
+              ]),
+              _: 1
+            }),
+            h(Z, H({
+              ref_key: "time",
+              ref: t
+            }, r(p), {
+              type: "datetime-local",
+              class: "size-0",
+              hidden: "",
+              onChange: c
+            }), null, 16)
+          ])
+        ]),
+        dialog: y((p) => [
+          o("div", $s, [
+            h(Z, H(r(p), {
+              type: "datetime-local",
+              onChange: c
+            }), null, 16)
+          ])
+        ]),
+        _: 3
+      }, 16);
+    };
+  }
+}), ks = { class: "flex justify-end" }, ws = { class: "flex justify-end" }, Cs = {
+  class: /* @__PURE__ */ V("text-blue-600 dark:text-blue-400")
+}, Ss = {
+  width: "30",
+  height: "30",
+  viewBox: "-7.5 -7.5 75 75",
+  version: "1.1",
+  style: { transform: "rotate(-90deg)" }
+}, zs = ["stroke-dashoffset"], Vs = { class: "absolute top-1/2 left-1/2 -translate-1/2 text-white z-10 font-bold text-xl" }, Jo = /* @__PURE__ */ S({
+  __name: "CardDimmer",
+  props: {
+    size: {},
+    id: {},
+    name: {},
+    type: {},
+    icon: {},
+    value: {},
+    valueTo: {},
+    opts: {},
+    args: {},
+    set: {},
+    get: {},
+    getTo: {}
+  },
+  emits: ["edit", "close", "click", "clone", "open", "setState"],
+  setup(e, { emit: n }) {
+    const l = e, s = n, t = A(0), a = ({ opts: i, value: m }) => Math.round(100 * +m / ((i == null ? void 0 : i.max) || 255)), c = ({ opts: i, value: m }) => Math.round(187 - +m / ((i == null ? void 0 : i.max) || 255) * 187), r = ({ value: i, opts: m }) => {
+      const { min: p = 0, max: b = 255, step: g = 1, disabled: x } = m || {};
+      return { min: p, max: b, step: g, value: i, disabled: !!x, class: x ? "" : "cursor-pointer" };
+    }, u = (i) => s("setState", +i.target.value || 0), d = ({ value: i }) => {
+      +i != 0 ? (t.value = +i, s("setState", 0)) : s("setState", i ? 0 : t.value || 255);
+    };
+    return (i, m) => (f(), j(oe, H(l, {
+      onClick: m[0] || (m[0] = (p) => s("click", p)),
+      onEdit: m[1] || (m[1] = (p) => s("edit", p)),
+      onClone: m[2] || (m[2] = (p) => s("clone", p))
+    }), {
+      icon: y((p) => [
+        k(i.$slots, "icon", F(U(p)))
+      ]),
+      header: y((p) => [
+        o("div", ks, [
+          o("div", ws, [
+            h(B, H(r(p), {
+              type: "icon",
+              onClick: q((b) => d(p), ["stop"])
+            }), {
+              default: y(() => [
+                o("div", Cs, [
+                  (f(), v("svg", Ss, [
+                    m[3] || (m[3] = o("circle", {
+                      class: "stroke-gray-300 dark:stroke-gray-700",
+                      r: "30",
+                      cx: "30",
+                      cy: "30",
+                      fill: "transparent",
+                      "stroke-width": "10"
+                    }, null, -1)),
+                    o("circle", {
+                      r: "30",
+                      cx: "30",
+                      cy: "30",
+                      stroke: "currentColor",
+                      "stroke-width": "8",
+                      "stroke-linecap": "butt",
+                      "stroke-dashoffset": c(p),
+                      fill: "transparent",
+                      "stroke-dasharray": "187"
+                    }, null, 8, zs)
+                  ]))
+                ])
+              ]),
+              _: 2
+            }, 1040, ["onClick"])
+          ])
+        ])
+      ]),
+      dialog: y((p) => [
+        o("div", {
+          class: V(["flex justify-center relative mx-2 my-6", r(p).disabled ? "opacity-40" : ""])
+        }, [
+          m[4] || (m[4] = o("div", { class: "absolute h-10 w-full top-0 left-0 bg-gray-400 dark:bg-gray-700 z-0 rounded-md" }, null, -1)),
+          o("div", {
+            class: "absolute h-10 top-0 left-0 bg-blue-600 dark:bg-blue-400 z-0 rounded-md transition-[width_0.3s_linear]",
+            style: fe(`width: ${a(p)}%`)
+          }, null, 4),
+          o("div", Vs, $(a(p)) + " %", 1),
+          o("input", H({ type: "range" }, r(p), {
+            class: "w-full h-10 z-10 appearance-none opacity-0",
+            onChange: u
+          }), null, 16)
+        ], 2)
+      ]),
+      _: 3
+    }, 16));
+  }
+}), Xo = /* @__PURE__ */ S({
+  __name: "CardInfo",
+  props: {
+    size: {},
+    id: {},
+    name: {},
+    type: {},
+    icon: {},
+    value: {},
+    valueTo: {},
+    opts: {},
+    args: {},
+    set: {},
+    get: {},
+    getTo: {}
+  },
+  emits: ["edit", "close", "click", "clone", "open", "setState"],
+  setup(e, { emit: n }) {
+    const l = e, s = n;
+    return (t, a) => (f(), j(oe, H(l, {
+      onClick: a[0] || (a[0] = (c) => s("click", c)),
+      onEdit: a[1] || (a[1] = (c) => s("edit", c)),
+      onClone: a[2] || (a[2] = (c) => s("clone", c))
+    }), {
+      icon: y((c) => [
+        k(t.$slots, "icon", F(U(c)))
+      ]),
+      default: y(() => [
+        k(t.$slots, "dialog")
+      ]),
+      _: 3
+    }, 16));
+  }
+}), Ts = { class: "flex justify-center relative mx-2 my-6" }, Yo = /* @__PURE__ */ S({
+  __name: "CardInput",
+  props: {
+    size: {},
+    id: {},
+    name: {},
+    type: {},
+    icon: {},
+    value: {},
+    valueTo: {},
+    opts: {},
+    args: {},
+    set: {},
+    get: {},
+    getTo: {}
+  },
+  emits: ["edit", "close", "click", "clone", "open", "setState"],
+  setup(e, { emit: n }) {
+    const l = e, s = n, t = A(l.value || ""), a = ({ name: r, opts: u = {} }) => {
+      const { disabled: d } = u;
+      return { label: r, disabled: d };
+    }, c = (r) => s("setState", r.target.value);
+    return re(
+      () => l.value,
+      (r) => {
+        t.value = r;
+      }
+    ), (r, u) => {
+      const d = Oe;
+      return f(), j(oe, H(l, {
+        onClick: u[1] || (u[1] = (i) => s("click", i)),
+        onEdit: u[2] || (u[2] = (i) => s("edit", i)),
+        onClone: u[3] || (u[3] = (i) => s("clone", i))
+      }), {
+        icon: y((i) => [
+          k(r.$slots, "icon", F(U(i)))
+        ]),
+        dialog: y((i) => [
+          o("div", Ts, [
+            h(Z, H({
+              modelValue: t.value,
+              "onUpdate:modelValue": u[0] || (u[0] = (m) => t.value = m)
+            }, a(i), {
+              onEnter: c,
+              onBlur: c
+            }), {
+              icon: y(() => [
+                h(d, { class: "size-8" })
+              ]),
+              _: 1
+            }, 16, ["modelValue"])
+          ])
+        ]),
+        _: 3
+      }, 16);
+    };
+  }
+}), Bs = {
+  viewBox: "0 0 24 24",
+  width: "1.2em",
+  height: "1.2em"
+};
+function Es(e, n) {
+  return f(), v("svg", Bs, [...n[0] || (n[0] = [
+    o("path", {
+      fill: "currentColor",
+      d: "M8 4h13v2H8zm-5-.5h3v3H3zm0 7h3v3H3zm0 7h3v3H3zM8 11h13v2H8zm0 7h13v2H8z"
+    }, null, -1)
+  ])]);
+}
+const Ls = N({ name: "ri-list-check", render: Es }), Ms = { class: "flex justify-center py-4" }, Qo = /* @__PURE__ */ S({
+  __name: "CardList",
+  props: {
+    size: {},
+    id: {},
+    name: {},
+    type: {},
+    icon: {},
+    value: {},
+    valueTo: {},
+    opts: {},
+    args: {},
+    set: {},
+    get: {},
+    getTo: {}
+  },
+  emits: ["edit", "close", "click", "clone", "open", "setState"],
+  setup(e, { emit: n }) {
+    const l = e, s = n, t = ({ value: r }) => s("setState", r), a = ({ opts: r, value: u }) => {
+      var d;
+      return Array.isArray(r == null ? void 0 : r.items) && ((d = r == null ? void 0 : r.items.find((i) => i.value == u)) == null ? void 0 : d.name) || u;
+    }, c = ({ name: r, value: u, opts: d = {} }) => {
+      var b;
+      const { items: i = [], disabled: m } = d, p = ((b = i.find((g) => g.value == u)) == null ? void 0 : b.name) || u;
+      return { label: r, modelValue: p, items: i, disabled: !!m };
+    };
+    return (r, u) => {
+      const d = Ls;
+      return f(), j(oe, H(l, {
+        onClick: u[1] || (u[1] = (i) => s("click", i)),
+        onEdit: u[2] || (u[2] = (i) => s("edit", i)),
+        onClone: u[3] || (u[3] = (i) => s("clone", i))
+      }), {
+        icon: y((i) => [
+          k(r.$slots, "icon", F(U(i)))
+        ]),
+        value: y((i) => [
+          D($(a(i)), 1)
+        ]),
+        "dialog-value": y((i) => [
+          D($(a(i)), 1)
+        ]),
+        header: y((i) => [
+          o("div", {
+            onClick: u[0] || (u[0] = q(() => {
+            }, ["prevent", "stop"]))
+          }, [
+            h(se, H(c(i), {
+              "is-popup": "",
+              top: "0",
+              left: "-115px",
+              onChange: t
+            }), {
+              activator: y(({ on: m }) => [
+                h(B, {
+                  type: "icon",
+                  class: "text-gray-500",
+                  onClick: q(m.click, ["stop"])
+                }, {
+                  default: y(() => [
+                    h(d, { class: "size-6" })
+                  ]),
+                  _: 1
+                }, 8, ["onClick"])
+              ]),
+              _: 1
+            }, 16)
+          ])
+        ]),
+        dialog: y((i) => [
+          o("div", Ms, [
+            h(se, H(c(i), {
+              top: "-50%",
+              left: "50%",
+              onChange: t
+            }), null, 16)
+          ])
+        ]),
+        _: 3
+      }, 16);
+    };
+  }
+}), As = {
+  viewBox: "0 0 24 24",
+  width: "1.2em",
+  height: "1.2em"
+};
+function Ds(e, n) {
+  return f(), v("svg", As, [...n[0] || (n[0] = [
+    o("path", {
+      fill: "currentColor",
+      d: "M15.5 5a3.5 3.5 0 1 0 0 7a3.5 3.5 0 0 0 0-7M10 8.5a5.5 5.5 0 1 1 10.032 3.117l2.675 2.676l-1.414 1.414l-2.675-2.675A5.5 5.5 0 0 1 10 8.5M3 4h5v2H3zm0 7h5v2H3zm18 7v2H3v-2z"
+    }, null, -1)
+  ])]);
+}
+const Is = N({ name: "ri-menu-search-line", render: Ds }), js = {
+  viewBox: "0 0 24 24",
+  width: "1.2em",
+  height: "1.2em"
+};
+function Hs(e, n) {
+  return f(), v("svg", js, [...n[0] || (n[0] = [
+    o("path", {
+      fill: "currentColor",
+      d: "M11 11V5h2v6h6v2h-6v6h-2v-6H5v-2z"
+    }, null, -1)
+  ])]);
+}
+const pe = N({ name: "ri-add-line", render: Hs }), Ps = { class: "flex w-full relative" }, Ns = { class: "flex gap-2 flex-wrap flex-auto px-2 py-1" }, Os = ["disabled"], Fe = /* @__PURE__ */ S({
+  __name: "VTextWrapper",
+  props: {
+    active: { type: Boolean },
+    label: { default: "label" },
+    disabled: { type: Boolean, default: !1 },
+    hideIcon: { type: Boolean, default: !1 }
+  },
+  emits: ["icon"],
+  setup(e, { emit: n }) {
+    const l = n, s = M(() => e.active ? "top-0 left-3 text-xs" : "top-1/2"), t = M(() => [e.disabled ? "border-gray-400 opacity-40" : "border-gray-300 hover:border-gray-400 dark:border-gray-700/50 hover:dark:border-gray-600/50"]);
+    return (a, c) => {
+      const r = pe;
+      return f(), v("div", Ps, [
+        o("div", {
+          class: V(["relative w-full min-h-[40px] border border-gray-300 dark:border-gray-700 flex items-center rounded transition bg-white dark:bg-gray-800", t.value])
+        }, [
+          o("span", {
+            class: V(["absolute left-4 transition-all rounded -translate-y-1/2 text-gray-600 dark:text-gray-400", s.value])
+          }, $(e.label), 3),
+          o("div", Ns, [
+            k(a.$slots, "default")
+          ]),
+          e.hideIcon ? T("", !0) : (f(), v("button", {
+            key: 0,
+            disabled: e.disabled,
+            class: V([{ "cursor-pointer": !e.disabled }, "h-full flex items-center justify-center text-gray-400 border-l border-gray-300 dark:border-gray-700/50 flex-[0_0_50px]"]),
+            onClick: c[0] || (c[0] = (u) => l("icon", u))
+          }, [
+            k(a.$slots, "icon", {}, () => [
+              h(r, { class: "size-4" })
+            ])
+          ], 10, Os))
+        ], 2)
+      ]);
+    };
+  }
+}), Fs = {
+  viewBox: "0 0 24 24",
+  width: "1.2em",
+  height: "1.2em"
+};
+function Us(e, n) {
+  return f(), v("svg", Fs, [...n[0] || (n[0] = [
+    o("path", {
+      fill: "currentColor",
+      d: "M7 6V3a1 1 0 0 1 1-1h12a1 1 0 0 1 1 1v14a1 1 0 0 1-1 1h-3v3c0 .552-.45 1-1.007 1H4.007A1 1 0 0 1 3 21l.003-14c0-.552.45-1 1.006-1zM5.002 8L5 20h10V8zM9 6h8v10h2V4H9z"
+    }, null, -1)
+  ])]);
+}
+const Rs = N({ name: "ri-file-copy-line", render: Us }), Ks = {
+  viewBox: "0 0 24 24",
+  width: "1.2em",
+  height: "1.2em"
+};
+function Ws(e, n) {
+  return f(), v("svg", Ks, [...n[0] || (n[0] = [
+    o("path", {
+      fill: "currentColor",
+      d: "M2 4a1 1 0 0 1 1-1h7.414l2 2H21a1 1 0 0 1 1 1v14a1 1 0 0 1-1 1H3c-.55 0-1-.45-1-1zm8.586 2l-1-1H4v2h5.586zM4 9v10h16V7h-7.586l-2 2z"
+    }, null, -1)
+  ])]);
+}
+const qs = N({ name: "ri-folder6-line", render: Ws }), Gs = ["onClick"], Zs = {
+  key: 0,
+  class: "me-1"
+}, Js = { class: "dark:text-gray-300" }, Xs = { class: "flex gap-3 items-center z-10" }, Ys = {
+  key: 0,
+  class: "flex ps-5"
+}, Qs = { class: "font-medium dark:text-gray-300" }, Ue = /* @__PURE__ */ S({
+  __name: "VListObject",
+  props: {
+    items: { default: () => ({}) },
+    path: { default: "" },
+    onlyValue: { type: Boolean, default: !1 }
+  },
+  emits: ["click"],
+  setup(e, { emit: n }) {
+    const l = n, s = () => "before:absolute before:w-full before:h-8 before:t-0 before:left-0 before:border-b before:border-gray-200 dark:before:border-gray-800/50  hover:before:bg-gray-400/10", t = A({}), { text: a, copy: c, copied: r, isSupported: u } = ft(), d = (b) => {
+      t.value[b] = !t.value[b];
+    }, i = (b) => typeof b == "object", m = (b) => `${e.path ? e.path + "." : ""}${b}`, p = (b, g) => {
+      l("click", { key: b, path: m(b), isObject: g });
+    };
+    return (b, g) => {
+      const x = qs, z = Rs, E = pe;
+      return f(), v("ul", null, [
+        (f(!0), v(I, null, R(e.items, (w, P) => (f(), v("li", {
+          key: P,
+          class: V(i(w) ? "" : `flex items-center ${s()}`)
+        }, [
+          o("div", {
+            class: V(["flex items-center cursor-pointer ps-2 h-8", i(w) ? `${s()}` : ""]),
+            onClick: (J) => d(P)
+          }, [
+            i(w) ? (f(), v("div", Zs, [
+              h(x, { class: "size-5" })
+            ])) : T("", !0),
+            o("div", Js, $(P), 1),
+            W(u) ? (f(), j(B, {
+              key: 1,
+              class: "opacity-20 hover:opacity-70 transition-all",
+              color: "transparent",
+              size: "sm",
+              onClick: q((J) => W(c)(m(P)), ["stop"])
+            }, {
+              default: y(() => [
+                h(z, { class: "size-5" })
+              ]),
+              _: 1
+            }, 8, ["onClick"])) : T("", !0),
+            W(a) === m(P) ? (f(), v("span", {
+              key: 2,
+              class: V(["text-gray-500 transition-all duration-1000 text-sm", W(r) ? "opacity-100" : "opacity-0"])
+            }, $(b.$t("copied")), 3)) : T("", !0),
+            !e.onlyValue && i(w) ? (f(), v(I, { key: 3 }, [
+              g[1] || (g[1] = o("div", { class: "flex-auto" }, null, -1)),
+              o("div", Xs, [
+                h(B, {
+                  class: "opacity-20 hover:opacity-70 transition-all",
+                  color: "transparent",
+                  size: "sm",
+                  title: b.$t("add"),
+                  onClick: q((J) => p(P, i(w)), ["stop"])
+                }, {
+                  default: y(() => [
+                    h(E, { class: "size-5" })
+                  ]),
+                  _: 1
+                }, 8, ["title", "onClick"])
+              ])
+            ], 64)) : T("", !0)
+          ], 10, Gs),
+          i(w) ? (f(), v("div", Ys, [
+            De(h(Ue, {
+              class: "flex-auto",
+              path: m(P),
+              items: w,
+              onlyValue: e.onlyValue,
+              onClick: g[0] || (g[0] = (J) => l("click", J))
+            }, null, 8, ["path", "items", "onlyValue"]), [
+              [et, t.value[P]]
+            ])
+          ])) : (f(), v(I, { key: 1 }, [
+            g[2] || (g[2] = o("div", { class: "flex-auto gap-3" }, null, -1)),
+            o("div", Qs, $(w), 1),
+            h(B, {
+              class: "opacity-20 hover:opacity-70 transition-all",
+              color: "gray",
+              size: "sm",
+              title: b.$t("add"),
+              onClick: q((J) => p(P, i(w)), ["stop"])
+            }, {
+              default: y(() => [
+                h(E, { class: "size-5" })
+              ]),
+              _: 1
+            }, 8, ["title", "onClick"])
+          ], 64))
+        ], 2))), 128))
+      ]);
+    };
+  }
+}), el = { class: "" }, tl = { class: "flex border-b border-gray-200 dark:border-gray-700" }, nl = ["onClick"], sl = { class: "px-4 py-2" }, ll = { class: "relative my-4" }, ol = { key: 0 }, al = /* @__PURE__ */ S({
+  __name: "VTabs",
+  props: {
+    value: {},
+    items: {}
+  },
+  emits: ["click"],
+  setup(e, { expose: n, emit: l }) {
+    const s = l, t = A(e.value || 0), a = (r) => [t.value === r ? "" : "before:hidden"], c = (r) => {
+      t.value = r, s("click", r);
+    };
+    return n({
+      setActiveTab: c,
+      activeTab: t
+    }), (r, u) => (f(), v("div", el, [
+      o("div", tl, [
+        (f(!0), v(I, null, R(e.items, (d, i) => (f(), v("div", {
+          key: i,
+          class: "relative flex-auto"
+        }, [
+          o("button", {
+            class: "w-full",
+            onClick: (m) => c(i)
+          }, [
+            o("div", {
+              class: V([a(i), "font-medium text-lg transition cursor-pointer before:h-[2px] before:absolute before:w-full before:bg-blue-700 before:left-0 before:bottom-0"])
+            }, [
+              k(r.$slots, "header", {
+                tab: d,
+                i
+              }, () => [
+                o("div", sl, $(d.title), 1)
+              ])
+            ], 2)
+          ], 8, nl)
+        ]))), 128))
+      ]),
+      o("div", ll, [
+        (f(!0), v(I, null, R(e.items, (d, i) => (f(), v("div", {
+          key: i,
+          class: "tab-panel"
+        }, [
+          h(_e, {
+            "enter-active-class": "transition-all duration-300 ease-out",
+            "enter-from-class": "transform opacity-0 translate-x-2",
+            "enter-to-class": "transform opacity-100 translate-x-0",
+            "leave-active-class": "transition-all duration-0 ease-in absolute inset-0",
+            "leave-from-class": "transform opacity-100 translate-x-0",
+            "leave-to-class": "transform opacity-0 -translate-x-2"
+          }, {
+            default: y(() => [
+              t.value === i ? (f(), v("div", ol, [
+                k(r.$slots, `tab-${i}`)
+              ])) : T("", !0)
+            ]),
+            _: 2
+          }, 1024)
+        ]))), 128))
+      ])
+    ]));
+  }
+}), il = { class: "flex gap-1 text-amber-500 self-start text-nowrap select-none" }, rl = ["title", "onMouseenter", "onMouseleave"], cl = { class: "flex flex-auto" }, dl = ["disabled"], ge = /* @__PURE__ */ S({
+  __name: "VFunc",
+  props: {
+    label: {},
+    args: {},
+    value: {},
+    disabled: { type: Boolean, default: !1 },
+    hideIcon: { type: Boolean, default: !1 }
+  },
+  emits: ["change", "icon", "hover"],
+  setup(e, { emit: n }) {
+    const l = n, s = ["v", "a", "b", "c"], t = A(e.value || ""), a = (u) => {
+      try {
+        return new Function(u), !0;
+      } catch (d) {
+        return console.warn(d), !1;
+      }
+    }, c = ke((u) => {
+      const d = u.target;
+      a(d.value) && l("change", d.value);
+    }, 500), r = (u) => l("icon", u);
+    return re(
+      () => e.value,
+      () => {
+        e.value && (t.value = e.value);
+      }
+    ), (u, d) => {
+      const i = ce, m = pe;
+      return f(), j(Fe, {
+        active: !!e.value,
+        disabled: e.disabled,
+        label: e.label,
+        hideIcon: e.hideIcon,
+        onIcon: r
+      }, {
+        icon: y(() => [
+          e.value ? (f(), j(i, {
+            key: 0,
+            class: "size-4"
+          })) : (f(), j(m, {
+            key: 1,
+            class: "size-4"
+          }))
+        ]),
+        default: y(() => [
+          e.value ? (f(), v(I, { key: 0 }, [
+            o("div", il, [
+              d[3] || (d[3] = D(" ( ", -1)),
+              (f(!0), v(I, null, R(e.args, (p, b) => (f(), v(I, { key: p }, [
+                o("span", {
+                  class: "text-blue-400/80",
+                  title: p,
+                  onMouseenter: (g) => l("hover", "enter", b),
+                  onMouseleave: (g) => l("hover", "leave", b)
+                }, $(s[b]), 41, rl),
+                d[2] || (d[2] = o("span", { class: "last:hidden" }, ",", -1))
+              ], 64))), 128)),
+              d[4] || (d[4] = D(" ) => ", -1))
+            ]),
+            o("div", cl, [
+              De(o("textarea", {
+                "onUpdate:modelValue": d[0] || (d[0] = (p) => t.value = p),
+                class: "outline-0 w-full resize-none field-sizing-content",
+                type: "text",
+                disabled: e.disabled,
+                onInput: d[1] || (d[1] = //@ts-ignore
+                (...p) => W(c) && W(c)(...p))
+              }, null, 40, dl), [
+                [tt, t.value]
+              ])
+            ])
+          ], 64)) : T("", !0)
+        ]),
+        _: 1
+      }, 8, ["active", "disabled", "label", "hideIcon"]);
+    };
+  }
+}), ul = ["checked", "disabled"], ml = { class: "text-sm ms-2 peer-disabled:opacity-40" }, fl = /* @__PURE__ */ S({
+  __name: "VCheckbox",
+  props: {
+    modelValue: { type: [Number, Boolean], default: !1 },
+    disabled: { type: Boolean, default: !1 }
+  },
+  emits: ["update:modelValue", "click"],
+  setup(e, { emit: n }) {
+    const l = n, s = (a) => {
+      const c = a.target;
+      l("update:modelValue", c.checked);
+    }, t = (a) => l("click", a);
+    return (a, c) => (f(), v("label", {
+      class: V(["inline-flex items-center relative", { "cursor-pointer": !e.disabled }]),
+      onClick: t
+    }, [
+      o("input", {
+        type: "checkbox",
+        checked: !!e.modelValue,
+        disabled: e.disabled,
+        class: "peer size-5 transition-all appearance-none rounded border border-gray-300 dark:border-gray-700 disabled:opacity-40 not-disabled:cursor-pointer",
+        onChange: s
+      }, null, 40, ul),
+      c[0] || (c[0] = o("button", { 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" }, [
+        o("svg", {
+          class: "h-3.5 w-3.5",
+          viewBox: "0 0 20 20",
+          fill: "currentColor",
+          stroke: "currentColor",
+          "stroke-width": "1"
+        }, [
+          o("path", {
+            "fill-rule": "evenodd",
+            d: "M16.707 5.293a1 1 0 010 1.414l-8 8a1 1 0 01-1.414 0l-4-4a1 1 0 011.414-1.414L8 12.586l7.293-7.293a1 1 0 011.414 0z",
+            "clip-rule": "evenodd"
+          })
+        ])
+      ], -1)),
+      o("span", ml, [
+        k(a.$slots, "default")
+      ])
+    ], 2));
+  }
+}), pl = { class: "flex flex-col" }, vl = { class: "flex gap-4 mb-6" }, gl = {
+  key: 0,
+  class: "flex gap-4"
+}, hl = {
+  key: 1,
+  class: ""
+}, bl = { class: "flex flex-col md:flex-row gap-4" }, yl = { class: "flex gap-4" }, xl = { class: "flex justify-between flex-auto" }, _l = ["onClick"], $l = /* @__PURE__ */ S({
+  __name: "ItemOptions",
+  props: {
+    min: { default: 0 },
+    max: { default: 255 },
+    step: { default: 1 },
+    disabled: {},
+    items: { default: () => [] },
+    value: {},
+    type: {}
+  },
+  emits: ["update"],
+  setup(e, { emit: n }) {
+    const l = n, s = M(() => e.items.map((g, x) => ({ ...g, id: ++x }))), t = A({ name: "", value: "" }), a = M(() => e.items.length + 1), c = M(() => {
+      var g;
+      return !((g = t.value) != null && g.id);
+    }), r = (g) => e.type === g, u = (g, x) => l("update", g, x), d = (g) => g.map(({ name: x, value: z }) => ({ name: x, value: z })), i = ({ id: g, name: x, value: z }) => t.value = { id: g, name: x, value: z }, m = () => {
+      const g = a.value;
+      t.value = { name: `New_${g}`, value: `${g}`, id: g }, u("items", d([...s.value, t.value]));
+    }, p = (g) => {
+      t.value.name === g.name && (t.value = { name: "", value: "" }), u("items", d(s.value.filter((x) => x.value !== g.value)));
+    }, b = ke(() => {
+      const g = t.value;
+      if (!g.name || !g.value) return;
+      const x = s.value.map((z) => z.id === g.id ? g : z);
+      u("items", d(x));
+    }, 300);
+    return (g, x) => {
+      const z = ce, E = pe;
+      return f(), v("div", pl, [
+        o("div", vl, [
+          h(fl, {
+            modelValue: e.disabled,
+            "onUpdate:modelValue": x[0] || (x[0] = (w) => u("disabled", w ? 1 : 0))
+          }, {
+            default: y(() => [...x[6] || (x[6] = [
+              D("Disabled", -1)
+            ])]),
+            _: 1
+          }, 8, ["modelValue"])
+        ]),
+        r("dimmer") ? (f(), v("div", gl, [
+          h(Z, {
+            modelValue: e.min,
+            label: "Min",
+            "onUpdate:modelValue": x[1] || (x[1] = (w) => u("min", +w))
+          }, null, 8, ["modelValue"]),
+          h(Z, {
+            modelValue: e.max,
+            label: "Max",
+            "onUpdate:modelValue": x[2] || (x[2] = (w) => u("max", +w))
+          }, null, 8, ["modelValue"]),
+          h(Z, {
+            modelValue: e.step,
+            label: "Step",
+            "onUpdate:modelValue": x[3] || (x[3] = (w) => u("step", +w))
+          }, null, 8, ["modelValue"])
+        ])) : T("", !0),
+        r("list") ? (f(), v("div", hl, [
+          o("div", bl, [
+            h(Z, {
+              modelValue: t.value.name,
+              "onUpdate:modelValue": [
+                x[4] || (x[4] = (w) => t.value.name = w),
+                W(b)
+              ],
+              disabled: c.value,
+              label: "Name"
+            }, null, 8, ["modelValue", "disabled", "onUpdate:modelValue"]),
+            h(Z, {
+              modelValue: t.value.value,
+              "onUpdate:modelValue": [
+                x[5] || (x[5] = (w) => t.value.value = w),
+                W(b)
+              ],
+              disabled: c.value,
+              label: "Value"
+            }, null, 8, ["modelValue", "disabled", "onUpdate:modelValue"])
+          ]),
+          o("div", yl, [
+            h(se, {
+              "model-value": t.value.value,
+              label: "List",
+              items: s.value,
+              top: "unset",
+              bottom: "0",
+              onChange: i
+            }, {
+              item: y(({ item: w }) => [
+                o("div", xl, [
+                  o("span", null, $(w.name), 1),
+                  o("button", {
+                    class: "cursor-pointer size-4",
+                    onClick: q((P) => p(w), ["prevent", "stop"])
+                  }, [
+                    h(z)
+                  ], 8, _l)
+                ])
+              ]),
+              _: 1
+            }, 8, ["model-value", "items"]),
+            h(B, {
+              class: "px-4",
+              color: "blue",
+              onClick: m
+            }, {
+              default: y(() => [
+                h(E)
+              ]),
+              _: 1
+            })
+          ])
+        ])) : T("", !0)
+      ]);
+    };
+  }
+}), kl = { class: "flex flex-col" }, wl = { class: "flex flex-col md:flex-row gap-6 min-h-[300px]" }, Cl = { class: "flex-auto order-1" }, Sl = { class: "flex-auto gap-x-2 order-1" }, zl = { class: "grid grid-cols-1 md:grid-cols-2 gap-6" }, Vl = { class: "flex gap-2 items-center" }, Tl = { class: "flex flex-col gap-4" }, Bl = { class: "flex gap-2 flex-wrap flex-auto px-2 py-1" }, El = { class: "relative group" }, Ll = { class: "select-none" }, Ml = ["onClick"], Al = { class: "flex justify-center order-0 md:order-1 md:mt-11" }, Dl = { class: "flex-[0_0_130px] size-[130px]" }, Il = { class: "flex gap-4 justify-end" }, jl = { class: "relative min-h-[200px] max-h-100dvh overflow-auto scrollbar" }, ea = /* @__PURE__ */ S({
+  __name: "ItemEdit",
+  props: {
+    items: {},
+    item: {},
+    object: {},
+    listDashboard: {},
+    listIcons: {}
+  },
+  emits: ["button"],
+  setup(e, { emit: n }) {
+    const l = n, s = [{ title: "Main" }, { title: "Data" }, { title: "Options" }], t = A({
+      id: "",
+      name: "",
+      type: "button",
+      icon: "bulb",
+      value: "",
+      args: [],
+      set: "",
+      get: "",
+      getTo: ""
+    }), a = A(!1), c = M(() => {
+      var _;
+      return !((_ = e.item) != null && _.id);
+    }), r = M(() => !!e.items.filter((_) => {
+      var C;
+      return _.id !== ((C = e.item) == null ? void 0 : C.id);
+    }).find((_) => _.id === (t == null ? void 0 : t.value.id))), u = M(() => t.value.type === "info"), d = M(() => {
+      var _;
+      return (_ = t.value.args) == null ? void 0 : _.length;
+    }), i = M(() => t.value.args.length > 3), m = M(() => {
+      if (r.value) return !0;
+      const { id: _, args: C } = t.value;
+      return !_ || !C.length;
+    }), p = ({ value: _ }) => t.value.icon = _, b = ({ value: _ }) => {
+      const C = _;
+      t.value.type = C, delete t.value.opts, ["button", "list", "dimmer"].includes(C) && (_ === "button" && (t.value.opts = {}), _ === "list" && (t.value.opts = { items: [] }), _ === "dimmer" && (t.value.opts = { min: 0, max: 255, step: 1 }));
+    }, g = (_) => {
+      _ === "get" && (t.value.get ? delete t.value.get : t.value.get = "v"), _ === "set" && (t.value.set ? delete t.value.set : t.value.set = "v"), _ === "getTo" && (t.value.getTo ? delete t.value.getTo : t.value.getTo = "v");
+    }, x = (_) => l("button", _, t.value), z = (_) => t.value.args = t.value.args.filter((C) => C !== _), E = ({ path: _ }) => {
+      !t.value.args.length && !t.value.id && (t.value.id = _), t.value.args.push(_), a.value = !1;
+    }, w = A(-1), P = (_) => w.value === _, J = (_, C) => {
+      _ === "enter" && (w.value = C), _ === "leave" && (w.value = -1);
+    }, ve = (_, C) => {
+      _ === "set" && (t.value.set = C), _ === "get" && (t.value.get = C), _ === "getTo" && (t.value.getTo = C), C || delete t.value[_];
+    }, Ze = () => {
+      a.value = !0;
+    }, Je = (_, C) => {
+      t.value.opts || (t.value.opts = {}), t.value.opts[_] = C, _ === "disabled" && !C && delete t.value.opts[_];
+    };
+    return le(() => {
+      var _;
+      (_ = e.item) != null && _.id && (t.value = mt(e.item));
+    }), (_, C) => {
+      const Xe = Is, Ye = ce;
+      return f(), v("div", kl, [
+        o("div", wl, [
+          o("div", Cl, [
+            h(al, {
+              class: "flex-auto min-h-75",
+              value: 0,
+              items: s
+            }, {
+              "tab-0": y(() => [
+                o("div", Sl, [
+                  h(Z, {
+                    modelValue: t.value.id,
+                    "onUpdate:modelValue": C[0] || (C[0] = (L) => t.value.id = L),
+                    label: "ID",
+                    message: r.value ? _.$t("used") : ""
+                  }, nt({ _: 2 }, [
+                    d.value ? void 0 : {
+                      name: "icon",
+                      fn: y(() => [
+                        h(B, {
+                          color: "transparent",
+                          onClick: Ze
+                        }, {
+                          default: y(() => [
+                            h(Xe)
+                          ]),
+                          _: 1
+                        })
+                      ]),
+                      key: "0"
+                    }
+                  ]), 1032, ["modelValue", "message"]),
+                  h(Z, {
+                    modelValue: t.value.name,
+                    "onUpdate:modelValue": C[1] || (C[1] = (L) => t.value.name = L),
+                    label: "Name"
+                  }, null, 8, ["modelValue"]),
+                  o("div", zl, [
+                    h(se, {
+                      "model-value": t.value.icon,
+                      bottom: "0",
+                      top: "unset",
+                      label: "Icon",
+                      class: "mb-6",
+                      items: e.listIcons,
+                      onChange: p
+                    }, {
+                      item: y(({ item: L }) => [
+                        o("div", Vl, [
+                          k(_.$slots, "icon", {
+                            icon: L.value
+                          }),
+                          o("div", null, $(L.name), 1)
+                        ])
+                      ]),
+                      _: 3
+                    }, 8, ["model-value", "items"]),
+                    h(se, {
+                      "model-value": t.value.type,
+                      bottom: "0",
+                      top: "unset",
+                      label: "Type",
+                      items: e.listDashboard,
+                      onChange: b
+                    }, null, 8, ["model-value", "items"])
+                  ])
+                ])
+              ]),
+              "tab-1": y(() => [
+                o("div", Tl, [
+                  h(Fe, {
+                    active: !!t.value.args.length,
+                    disabled: i.value,
+                    label: "Arguments",
+                    onIcon: C[2] || (C[2] = (L) => a.value = !0)
+                  }, {
+                    default: y(() => [
+                      o("div", Bl, [
+                        (f(!0), v(I, null, R(t.value.args, (L, Se) => (f(), v("div", {
+                          key: L,
+                          class: "flex items-center rounded-full bg-gray-200 dark:bg-gray-900/50 px-2 py-[2px] text-xs"
+                        }, [
+                          o("div", El, [
+                            o("span", Ll, $(L), 1),
+                            o("div", {
+                              class: V(["fixed left-1/2 top-1/2 p-4 text-white bg-gray-900 rounded-md group-hover:visible invisible opacity-0 group-hover:opacity-100 z-50 transition-all -translate-1/2", P(Se) ? "visible opacity-100" : ""])
+                            }, [
+                              o("pre", null, $(W(vt)(L, e.object)), 1)
+                            ], 2)
+                          ]),
+                          Se || t.value.args.length < 2 ? (f(), v("button", {
+                            key: 0,
+                            class: "cursor-pointer ms-1",
+                            onClick: (Vo) => z(L)
+                          }, [
+                            h(Ye, { class: "size-5" })
+                          ], 8, Ml)) : T("", !0)
+                        ]))), 128))
+                      ])
+                    ]),
+                    _: 1
+                  }, 8, ["active", "disabled"]),
+                  h(ge, {
+                    value: t.value.set,
+                    args: t.value.args,
+                    disabled: !d.value || u.value,
+                    label: "Set",
+                    onIcon: C[3] || (C[3] = (L) => g("set")),
+                    onHover: J,
+                    onChange: C[4] || (C[4] = (L) => ve("set", L))
+                  }, null, 8, ["value", "args", "disabled"]),
+                  h(ge, {
+                    value: t.value.get,
+                    args: t.value.args,
+                    disabled: !d.value,
+                    label: "Get",
+                    onIcon: C[5] || (C[5] = (L) => g("get")),
+                    onHover: J,
+                    onChange: C[6] || (C[6] = (L) => ve("get", L))
+                  }, null, 8, ["value", "args", "disabled"]),
+                  h(ge, {
+                    value: t.value.getTo,
+                    args: t.value.args,
+                    disabled: !d.value,
+                    label: "GetTo",
+                    onIcon: C[7] || (C[7] = (L) => g("getTo")),
+                    onHover: J,
+                    onChange: C[8] || (C[8] = (L) => ve("getTo", L))
+                  }, null, 8, ["value", "args", "disabled"])
+                ])
+              ]),
+              "tab-2": y(() => [
+                h($l, H(t.value.opts, {
+                  value: t.value.value,
+                  type: t.value.type,
+                  onUpdate: Je
+                }), null, 16, ["value", "type"])
+              ]),
+              _: 3
+            })
+          ]),
+          o("div", Al, [
+            o("div", Dl, [
+              k(_.$slots, "default", { item: t.value })
+            ])
+          ])
+        ]),
+        o("div", Il, [
+          h(B, {
+            class: "px-4",
+            color: "blue",
+            disabled: m.value,
+            onClick: C[9] || (C[9] = (L) => x(c.value ? "add" : "save"))
+          }, {
+            default: y(() => [
+              D($(c.value ? _.$t("add") : _.$t("save")), 1)
+            ]),
+            _: 1
+          }, 8, ["disabled"]),
+          h(B, {
+            class: "px-4",
+            color: "red",
+            outline: "",
+            onClick: C[10] || (C[10] = (L) => x("remove"))
+          }, {
+            default: y(() => [
+              D($(_.$t("remove")), 1)
+            ]),
+            _: 1
+          })
+        ]),
+        a.value ? (f(), j(He, {
+          key: 0,
+          size: "md",
+          title: _.$t("select"),
+          onClose: C[11] || (C[11] = (L) => a.value = !1)
+        }, {
+          default: y(() => [
+            o("div", jl, [
+              h(Ue, {
+                items: e.object,
+                onlyValue: !d.value,
+                onClick: E
+              }, null, 8, ["items", "onlyValue"])
+            ])
+          ]),
+          _: 1
+        }, 8, ["title"])) : T("", !0)
+      ]);
+    };
+  }
+}), ze = { position: "relative", boxSizing: "border-box", overflow: "hidden", fontSize: "16px", fontFamily: 'Menlo, Consolas, "Liberation Mono", Monaco, "Lucida Console", monospace' }, Hl = { lineHeight: "inherit", whiteSpace: "pre-wrap", wordBreak: "keep-all", overflowWrap: "break-word", background: "none", position: "absolute", width: "100%", height: "100%", zIndex: "1", resize: "none", caretColor: "currentColor", padding: "inherit", outline: "none", fontSize: "inherit", fontFamily: "inherit", letterSpacing: "inherit", boxSizing: "border-box", border: "none", top: "0px", left: "0px", color: "inherit", overflow: "hidden", "-webkit-font-smoothing": "antialiased", "-webkit-text-fill-color": "transparent" }, Pl = { lineHeight: "inherit", position: "relative", whiteSpace: "pre-wrap", wordBreak: "keep-all", padding: "0", width: "100%", margin: "0", pointerEvents: "none", boxSizing: "border-box", overflowWrap: "break-word", fontFamily: "inherit" }, Nl = { lineHeight: "inherit", position: "absolute", width: "100%", height: "100%", whiteSpace: "pre-wrap", wordBreak: "keep-all", padding: "inherit", margin: "0", top: "0px", left: "0px", pointerEvents: "none", boxSizing: "border-box", overflowWrap: "break-word", fontFamily: "inherit" }, Re = (e) => Ke(e);
+function Ve(e) {
+  const n = Array.isArray(e) ? e : [e];
+  return n.length === 0 ? Re : (l) => n.reduce((s, t, a) => t(s, { html: a > 0 }), l);
+}
+class Ol {
+  constructor(n, l = {}) {
+    if (this.lines = null, !n) throw new Error("selector is not defined");
+    if (this.root = n instanceof Node ? n : document.querySelector(n), !this.root) throw new Error(`element with "${n}" selector is not exist`);
+    const s = { value: "", styles: {}, plugins: [], highlighter: Re }, { highlighters: t, ...a } = l;
+    this.options = { ...s, ...a, highlighter: t ? Ve(t) : s.highlighter }, this.options.value = this.options.value == null ? "" : String(this.options.value), this.init();
+  }
+  init() {
+    this.textarea = document.createElement("textarea"), this.textarea.setAttribute("spellcheck", "false"), this.textarea.setAttribute("autocapitalize", "off"), this.textarea.setAttribute("autocorrect", "off"), this.textarea.setAttribute("autocomplete", "off"), this.pre = document.createElement("pre");
+    const n = Object.keys(ze).concat(Object.keys(this.options.styles)).concat(["paddingLeft"]);
+    this.initialRootStyles = {};
+    const l = this.root.style;
+    n.forEach((s) => {
+      this.initialRootStyles[s] = l[s] || "";
+    }), Object.assign(this.root.style, ze, this.options.styles), Object.assign(this.textarea.style, Hl), Object.assign(this.pre.style, Pl), this.basePaddingLeft = this.root.style.paddingLeft || "", this.root.appendChild(this.textarea), this.root.appendChild(this.pre), this.addTextareaEvents(), this.update({ value: this.options.value }), this.updateLines();
+  }
+  addTextareaEvents() {
+    this.handleEvent = (n) => {
+      if (n.type === "keydown" && this.textarea.readOnly) return;
+      const l = n;
+      if (l.isComposing || l.keyCode === 229) return;
+      const s = function(t, a) {
+        const { value: c, selectionStart: r, selectionEnd: u } = a.target;
+        return t.reduce((d, i) => ({ ...d, ...i(d, a) }), { value: c, selectionStart: r, selectionEnd: u });
+      }(this.options.plugins, n);
+      this.update(s);
+    }, this.textarea.addEventListener("input", this.handleEvent), this.textarea.addEventListener("keydown", this.handleEvent), this.textarea.addEventListener("compositionend", this.handleEvent);
+  }
+  update(n) {
+    if (!this.textarea) return;
+    let { value: l, selectionStart: s, selectionEnd: t } = n;
+    l != null && (l = String(l), s == null && (s = this.textarea.selectionStart), t == null && (t = this.textarea.selectionEnd), this.textarea.value !== l && (this.textarea.value = l)), s != null && (this.textarea.selectionStart = s), t != null && (this.textarea.selectionEnd = t), l !== this.value && l != null && (this.value = l, this.render(), this.updateCallback && this.updateCallback(l));
+  }
+  updateOptions(n) {
+    if (!this.textarea) return;
+    const { highlighters: l, ...s } = n;
+    if (this.options = { ...this.options, ...s, highlighter: l ? Ve(l) : this.options.highlighter }, n.styles) {
+      const t = this.root.style;
+      Object.keys(n.styles).forEach((a) => {
+        a in this.initialRootStyles || (this.initialRootStyles[a] = t[a] || "");
+      }), Object.assign(this.root.style, n.styles), ("paddingLeft" in n.styles || "padding" in n.styles) && (this.basePaddingLeft = this.root.style.paddingLeft || "");
+    }
+    this.lines && !this.options.lineNumbers && (de(this.lines), this.lines = null, this.root.style.paddingLeft = this.basePaddingLeft), n.value != null && this.update({ value: n.value }), this.render();
+  }
+  render() {
+    const n = this.options.highlighter(this.value);
+    this.pre.innerHTML = n + "<br/>", this.updateLines();
+  }
+  updateLines() {
+    if (!this.options.lineNumbers) return;
+    this.lines || (this.lines = document.createElement("pre"), this.root.appendChild(this.lines), Object.assign(this.lines.style, Nl));
+    const n = this.value.split(`
+`), l = n.length.toString().length;
+    this.root.style.paddingLeft = `${l + 1}ch`, this.lines.innerHTML = n.map((s, t) => `${`<span class="yace-line" style="position: absolute; opacity: .3; left: 0; width: ${l}ch; text-align: right">${1 + t}</span>`}${`<span style="color: transparent; pointer-events: none">${Ke(s)}</span>`}`).join(`
+`);
+  }
+  destroy() {
+    this.textarea && (this.textarea.removeEventListener("input", this.handleEvent), this.textarea.removeEventListener("keydown", this.handleEvent), this.textarea.removeEventListener("compositionend", this.handleEvent), de(this.textarea), de(this.pre), de(this.lines), Object.assign(this.root.style, this.initialRootStyles), Object.assign(this, { textarea: null, pre: null, lines: null, updateCallback: null, handleEvent: null, initialRootStyles: null, options: null, root: null }));
+  }
+  onUpdate(n) {
+    this.updateCallback = n;
+  }
+}
+function de(e) {
+  e && e.parentNode && e.parentNode.removeChild(e);
+}
+function Ke(e) {
+  return e.replace(/&/g, "&amp;").replace(/</g, "&lt;").replace(/>/g, "&gt;").replace(/"/g, "&quot;").replace(/'/g, "&#039;");
+}
+const Te = { alt: "altKey", control: "ctrlKey", ctrl: "ctrlKey", meta: "metaKey", shift: "shiftKey", "ctrl/cmd": typeof window < "u" && window.navigator && /Mac|iPod|iPhone|iPad/.test(window.navigator.platform) ? "metaKey" : "ctrlKey" }, Fl = { add: "=" }, Ul = { ";": "semicolon", "=": "equal", ",": "comma", "-": "minus", ".": "period", "/": "slash", "`": "backquote", "[": "bracketleft", "\\": "backslash", "]": "bracketright", "'": "quote" };
+function ie(e, n) {
+  const l = e.split("+").reduce((u, d) => Te[d] ? (u.modifiers[Te[d]] = !0, u) : { ...u, key: Fl[d] || d.toLowerCase() }, { modifiers: { altKey: !1, ctrlKey: !1, metaKey: !1, shiftKey: !1 }, key: null }), s = Object.keys(l.modifiers).every((u) => l.modifiers[u] ? n[u] : !n[u]);
+  if (!l.key) return s;
+  const t = n.key != null && n.key.toLowerCase() === l.key, a = (c = l.key, /^[a-z]$/.test(c) ? `key${c}` : /^[0-9]$/.test(c) ? `digit${c}` : Ul[c] || null);
+  var c;
+  const r = !n.isComposing && a != null && n.code != null && n.code.toLowerCase() === a;
+  return s && (t || r);
+}
+function Rl(e = {}) {
+  const n = Math.max(1, e.limit == null ? 300 : e.limit), l = e.coalesceMs == null ? 300 : e.coalesceMs;
+  let s = [], t = null, a = null;
+  const c = (r) => {
+    s = s.slice(0, t + 1), s.push(r), s.length > n && (s = s.slice(s.length - n)), t = s.length - 1;
+  };
+  return (r, u) => {
+    const d = u.type === "keydown" && ie("ctrl/cmd+z", u), i = u.type === "keydown" && (ie("ctrl/cmd+shift+z", u) || ie("ctrl+y", u));
+    if ((d || i) && u.preventDefault(), t === null) return s = [r], void (t = 0);
+    if (d) return a = null, s[t].value !== r.value ? c(r) : s[t] = r, t = Math.max(0, t - 1), s[t];
+    if (i) return a = null, s[t].value !== r.value ? void c(r) : (t = Math.min(s.length - 1, t + 1), s[t]);
+    if (u.type === "keydown") return s[t].value !== r.value ? (a = null, void c(r)) : void (s[t] = r);
+    if (u.type === "input") {
+      const m = u.timeStamp, p = m != null && a != null && m - a <= l;
+      if (a = m ?? null, p) return void (s[t] = r);
+      c(r);
+    }
+  };
+}
+const Kl = () => (e, n) => {
+  const { value: l, selectionStart: s, selectionEnd: t } = e;
+  if (!ie("enter", n) || n.type !== "keydown") return;
+  const a = l.substring(0, s).split(`
+`).pop(), c = /^\s+/.exec(a);
+  if (!c) return;
+  n.preventDefault();
+  const r = `
+` + c[0];
+  return { value: l.substring(0, s) + r + l.substring(t), selectionStart: s + r.length, selectionEnd: s + r.length };
+}, Wl = () => (e, n) => {
+  if (!(n instanceof KeyboardEvent) || n.key !== "Enter")
+    return;
+  const { value: l, selectionStart: s, selectionEnd: t } = e;
+  if (s !== t)
+    return;
+  const a = l.lastIndexOf(`
+`, s - 1) + 1, c = l.indexOf(`
+`, s), r = c === -1 ? l.length : c;
+  if (l.slice(s, r).trim().length > 0)
+    return;
+  const i = l.substring(a, r).trimEnd();
+  if (i.endsWith(";") || i.length === 0)
+    return;
+  const m = l.slice(0, r) + ";" + l.slice(r), p = s + 1;
+  return {
+    value: m,
+    selectionStart: p,
+    selectionEnd: p
+  };
+};
+let we = [], K = null, O = 0, X = [], Q = null, ee = null, Ce, We, G = null, ne = null;
+const ql = (e) => {
+  const { customSuggestions: n = [], minPrefixLength: l = 1, maxSuggestions: s = 20, tabSize: t = 2, tooltip: a = { enabled: !0 }, i18n: c, renderMenu: r, renderTooltip: u } = e;
+  if (!r || !u)
+    throw new Error("renderMenu and renderTooltip are required");
+  return we = [...n].map((d) => c(d)), Ce = r, We = u, (d, i) => {
+    if (!(i instanceof KeyboardEvent))
+      return;
+    const { value: m, selectionStart: p } = d, b = i.target;
+    if (ee = b, a.enabled !== !1 && !b.dataset.tooltipInitialized && (b.dataset.tooltipInitialized = "true", b.addEventListener("mouseup", () => {
+      setTimeout(() => Be(b), 100);
+    }), b.addEventListener("keyup", () => {
+      setTimeout(() => Be(b), 100);
+    })), K) {
+      switch (i.key) {
+        case "ArrowDown":
+          return i.preventDefault(), O < X.length - 1 && (O++, te()), { ...d };
+        case "ArrowUp":
+          return i.preventDefault(), O > 0 && (O--, te()), { ...d };
+        case "Enter":
+          if (i.preventDefault(), X[O]) {
+            const g = be(d, X[O]);
+            return Y(), g;
+          }
+          return;
+        case "Tab":
+          if (i.preventDefault(), X[O]) {
+            const g = be(d, X[O]);
+            return Y(), g;
+          }
+          return;
+        case "Escape":
+          return i.preventDefault(), Y(), { ...d };
+        case "Backspace":
+          setTimeout(() => {
+            if (ee) {
+              const g = ee.value, x = ee.selectionStart, z = me(g, x), E = g.slice(z, x);
+              if (E.length < l)
+                Y();
+              else {
+                const w = he(E).slice(0, s);
+                w.length === 0 ? Y() : (X = w, O = 0, te());
+              }
+            }
+          }, 0);
+          return;
+      }
+      if (["ArrowDown", "ArrowUp", "Enter", "Tab", "Escape", "Backspace"].includes(i.key))
+        return { ...d };
+    }
+    if (ie("tab", i)) {
+      i.preventDefault();
+      const g = me(m, p), x = m.slice(g, p);
+      if (x.length > 0) {
+        const P = he(x);
+        if (P.length > 0)
+          return be(d, P[0]);
+      }
+      const z = " ".repeat(t), E = m.slice(0, p) + z + m.slice(p), w = p + t;
+      return {
+        value: E,
+        selectionStart: w,
+        selectionEnd: w
+      };
+    }
+    if (!(i.key.length !== 1 || i.ctrlKey || i.metaKey || i.altKey))
+      return Q && clearTimeout(Q), Q = setTimeout(() => {
+        Q = null;
+        const g = b.value, x = b.selectionStart, z = me(g, x), E = g.slice(z, x);
+        if (E.length < l) {
+          Y();
+          return;
+        }
+        let w = he(E);
+        if (w = w.slice(0, s), w.length === 0) {
+          Y();
+          return;
+        }
+        X = w, O = 0, K ? te() : Gl(b, w);
+      }, 0), { ...d };
+  };
+};
+function he(e) {
+  const n = e.toLowerCase();
+  return we.filter((l) => {
+    const s = l.label.toLowerCase();
+    return s.startsWith(n) || s.includes(n) || s.split("_").map((t) => t[0]).join("").startsWith(n);
+  }).sort((l, s) => {
+    const t = l.label.toLowerCase(), a = s.label.toLowerCase(), c = t.startsWith(n), r = a.startsWith(n);
+    if (c && !r) return -1;
+    if (!c && r) return 1;
+    const u = t.indexOf(n), d = a.indexOf(n);
+    return u !== d ? u - d : t.length !== a.length ? t.length - a.length : t.localeCompare(a);
+  });
+}
+function me(e, n) {
+  let l = n;
+  for (; l > 0 && /[a-zA-Z0-9_$]/.test(e[l - 1]); )
+    l--;
+  return l;
+}
+function Gl(e, n) {
+  Y(), X = n, O = 0;
+  const l = qe(e);
+  K = Ce(n, O, (s) => {
+    O = s, te();
+  }), Object.assign(K.style, {
+    position: "fixed",
+    left: `${l.left}px`,
+    top: `${l.top + 24}px`,
+    zIndex: "10000"
+  }), document.body.appendChild(K);
+}
+function te() {
+  if (!K || !ee) return;
+  const e = Ce(X, O, (l) => {
+    O = l, te();
+  }), n = K.getBoundingClientRect();
+  K.replaceWith(e), K = e, Object.assign(K.style, {
+    position: "fixed",
+    left: `${n.left}px`,
+    top: `${n.top}px`,
+    zIndex: "10000"
+  });
+}
+function be(e, n) {
+  const { value: l, selectionStart: s } = e, t = me(l, s), a = n.insert || n.label, c = /\$\{([^}]*)\}/g;
+  let r = a;
+  const u = [];
+  let d;
+  for (; (d = c.exec(a)) !== null; ) {
+    const g = d[1], x = d.index, z = d[0].length;
+    u.push({ index: x, text: g, length: z });
+  }
+  r = a.replace(/\$\{([^}]*)\}/g, "$1");
+  const i = u[0];
+  let m = t + r.length, p = t + r.length;
+  if (i) {
+    let g = 0, x = 0, z = !1;
+    for (; x < a.length && !z; ) {
+      const E = u.find((w) => w.index === x);
+      E ? (g += E.text.length, x += E.length, E === i && (m = t + g - E.text.length, p = t + g, z = !0)) : (g++, x++);
+    }
+  }
+  return {
+    value: l.slice(0, t) + r + l.slice(s),
+    selectionStart: m,
+    selectionEnd: p
+  };
+}
+function Y() {
+  Q && (clearTimeout(Q), Q = null), K && (K.remove(), K = null, X = [], O = 0, ee = null);
+}
+function qe(e) {
+  const n = e.getBoundingClientRect(), { value: l, selectionStart: s } = e, a = l.substring(0, s).split(`
+`), c = a.length, r = a[a.length - 1] || "", u = parseInt(getComputedStyle(e).lineHeight) || 20;
+  return {
+    left: n.left + 10 + r.length * 8,
+    top: n.top + (c - 1) * u
+  };
+}
+function Be(e) {
+  ne && clearTimeout(ne), ne = setTimeout(() => {
+    const n = e.selectionStart, l = e.selectionEnd;
+    if (n === l) {
+      ae();
+      return;
+    }
+    const s = e.value.substring(n, l).trim();
+    if (!s) {
+      ae();
+      return;
+    }
+    const t = we.find((r) => r.label === s);
+    if (!t) {
+      ae();
+      return;
+    }
+    const a = qe(e), c = We(t, a);
+    c.style.opacity = "0", G && G.remove(), G = c, document.body.appendChild(G), requestAnimationFrame(() => {
+      G && (G.style.opacity = "1");
+    }), setTimeout(() => ae(), 3e3);
+  }, 300);
+}
+function ae() {
+  ne && (clearTimeout(ne), ne = null), G && (G.style.opacity = "0", setTimeout(() => {
+    G && (G.remove(), G = null);
+  }, 150));
+}
+document.addEventListener("mousedown", (e) => {
+  const n = e.target;
+  K && !K.contains(n) && Y(), G && !G.contains(n) && ae();
+});
+const ye = (e) => e.replace(/&/g, "&amp;").replace(/</g, "&lt;").replace(/>/g, "&gt;"), Zl = ["else", "end", "call", "fade"], Jl = (e) => e.replace(/[.*+?^${}()|[\]\\]/g, "\\$&"), Xl = (e) => {
+  const n = e.filter((r) => r.type !== "var").map((r) => r.label), c = `(\\/\\/[^\\n]*)|('[^'\\n]*')|(\\b\\d+(?:\\.\\d+)?\\b)|(\\b(?:${Array.from(/* @__PURE__ */ new Set([...Zl, ...n])).map(Jl).join("|")})\\b)|(\\$[a-zA-Z_][a-zA-Z0-9_]*)|(\\b(?:btn_\\d+(?:_\\d+)?)\\b)|([;:(){}])`;
+  return new RegExp(c, "g");
+}, Yl = (e) => (n) => {
+  const l = Xl(e);
+  let s = "", t = 0;
+  for (const a of n.matchAll(l)) {
+    const [c, r, u, d, i, m, p, b] = a;
+    let g = "";
+    r ? g = "comment" : u ? g = "str" : d ? g = "num" : i ? g = "word" : m ? g = "var" : p ? g = "event" : b && (g = "operator"), s += ye(n.slice(t, a.index)), s += `<span class="tok--${g}">${ye(c)}</span>`, t = a.index + c.length;
+  }
+  return s += ye(n.slice(t)), s;
+}, Ge = {
+  word: "text-blue-600 dark:text-blue-400",
+  func: "text-yellow-600 dark:text-yellow-400",
+  var: "text-cyan-600 dark:text-cyan-400",
+  event: "text-purple-600 dark:text-purple-400"
+}, Ql = (e, n, l) => {
+  const s = document.createElement("div");
+  return s.className = `
+    fixed z-[10000] min-w-[250px] max-w-[400px] max-h-[250px] 
+    overflow-y-auto p-1 rounded-lg shadow-lg border 
+    border-gray-200 dark:border-gray-700 bg-white dark:bg-gray-800 
+    text-sm font-mono scrollbar pointer-events-none
+  `, e.forEach((t, a) => {
+    const c = a === n, r = document.createElement("div");
+    r.className = `
+      flex items-center justify-between gap-2 px-3 py-1.5 cursor-pointer 
+      rounded transition-colors duration-100 border-l-2 
+      ${c ? "border-blue-500 dark:border-blue-400 bg-blue-50 dark:bg-blue-900/30" : "border-transparent hover:bg-gray-100 dark:hover:bg-gray-700"}
+    `;
+    const u = Ge[t.type] || "text-gray-700 dark:text-gray-300";
+    r.innerHTML = `
+      <div class="flex items-center gap-2 flex-1">
+        <span class="${u} font-medium">${t.label}</span>
+        ${t.detail ? `<span class="text-xs text-gray-500 dark:text-gray-400 ml-2">${t.detail}</span>` : ""}
+      </div>
+      ${t.description ? `<span class="text-xs text-gray-400 dark:text-gray-500">${t.description}</span>` : ""}
+    `, r.addEventListener("click", () => l(a)), s.appendChild(r);
+  }), s;
+}, eo = (e, n) => {
+  const l = document.createElement("div");
+  l.className = `
+    fixed z-[10001] px-3 py-2 font-mono text-sm max-w-[300px] 
+    min-w-[50px] min-h-[20px] rounded-lg shadow-lg border 
+    pointer-events-none transition-opacity duration-150
+    bg-white dark:bg-gray-800 border-gray-200 dark:border-gray-700 
+    text-gray-700 dark:text-gray-300 pointer-events-none
+  `, l.style.cssText = `
+    left: ${n.left + 40}px; top: ${n.top - 10}px;
+    transform: translateX(-50%) translateY(-100%); opacity: 0;
+  `;
+  let t = `<div class="font-medium ${Ge[e.type] || "text-gray-700 dark:text-gray-300"}">${e.label}</div>`;
+  e.detail && (t += `<div class="text-gray-500 dark:text-gray-400 mt-0.5 text-xs">${e.detail}</div>`), e.description && (t += `<div class="text-gray-400 dark:text-gray-500 text-xs mt-1 pt-1 border-t border-gray-200 dark:border-gray-700">${e.description}</div>`), l.innerHTML = t;
+  const a = document.createElement("div");
+  return a.className = `
+    absolute bottom-[-6px] left-1/2 w-2.5 h-2.5 -translate-x-1/2 rotate-45
+    bg-white dark:bg-gray-800 border-r border-b border-gray-200 dark:border-gray-700
+  `, l.appendChild(a), l;
+}, to = [
+  { label: "if", type: "word", insert: `if:\${$v0<10};
+
+else;
+
+end;`, detail: "if:${$v0<10};else;end;" },
+  { label: "while", type: "word", insert: `$v0=0;
+while:\${$v0<10};
+log($v0);
+$v0=$v0+1;
+wait(1s);
+end;`, detail: "while:${$v0<2}; end;" },
+  { label: "udp", type: "func", insert: "udp(${},'call(1)')", detail: "udp(id:number, text:string)" },
+  { label: "on", type: "func", insert: `on('\${event}');
+
+end;`, detail: "event(name: string)" },
+  { label: "wait", type: "func", insert: "wait(${1s});", detail: "wait(10ms | 1s | 1m | 1h)" },
+  { label: "log", type: "func", insert: "log(${});", detail: "log(text: string | number)" },
+  { label: "len", type: "func", insert: "len(${$a0});", detail: "len(arr: array)" },
+  { label: "set", type: "func", insert: "set(${$a0},${2},${10});", detail: "set(arr: array, index: number, value: number)" },
+  { label: "get", type: "func", insert: "get(${$a0},${0});", detail: "get(arr: array, index: number)" },
+  { label: "ord", type: "func", insert: "ord(${$s0});", detail: "ord(char: string)" },
+  { label: "chr", type: "func", insert: "chr(${65});", detail: "chr(v: number)" },
+  { label: "btn", type: "event", detail: "Change state " },
+  { label: "btn_c", type: "event", detail: "Count click button <br>$e0=gpio:number<br>$e1=value:number<br>$e2=type?:number" },
+  { label: "btn_l", type: "event", detail: "Long press of the button <br>$e0=gpio:number<br>$e1=value:number" },
+  { label: "btn_r", type: "event", detail: "Repeat while holding the button <br>$e0=gpio:number<br>$e1=value:number" },
+  { label: "$u", type: "var", insert: "$u${0}", detail: "var (uint) " },
+  { label: "$i", type: "var", insert: "$i${0}", detail: "var (int)" },
+  { label: "$f", type: "var", insert: "$f${0}", detail: "var (float)" },
+  { label: "$s", type: "var", insert: "$s${0}", detail: "var (string)" },
+  { label: "$a", type: "var", insert: "$a${0}", detail: "var (array)" },
+  { label: "$e", type: "var", insert: "$e${0}", detail: "var event" },
+  { label: "$c", type: "var", insert: "$c${0}", detail: "var call" },
+  { label: "$p", type: "var", insert: "$p${0}", detail: "gpio" }
+], ta = /* @__PURE__ */ S({
+  __name: "ScriptEditor",
+  props: {
+    modelValue: {},
+    suggestions: { default: () => [] }
+  },
+  emits: ["update:modelValue", "update"],
+  setup(e, { emit: n }) {
+    const l = n;
+    let s;
+    const t = [...to, ...e.suggestions];
+    return re(
+      () => e.modelValue,
+      (a) => {
+        s.update({ value: a });
+      }
+    ), le(() => {
+      s = new Ol("#editor", {
+        value: e.modelValue,
+        lineNumbers: !0,
+        highlighters: [Yl(t)],
+        plugins: [
+          Rl(),
+          Kl(),
+          ql({
+            customSuggestions: t,
+            minPrefixLength: 1,
+            maxSuggestions: 20,
+            i18n: (a) => a,
+            tooltip: {
+              enabled: !0
+            },
+            renderMenu: Ql,
+            renderTooltip: eo
+          }),
+          Wl()
+        ],
+        styles: { fontSize: "14px" }
+      }), s.onUpdate((a) => {
+        l("update:modelValue", a);
+      });
+    }), Me(() => {
+      s.destroy();
+    }), (a, c) => (f(), v("div", null, [...c[0] || (c[0] = [
+      o("div", {
+        class: "",
+        id: "editor"
+      }, null, -1)
+    ])]));
+  }
+}), no = { class: "max-w-4xl mx-auto" }, so = {
+  key: 0,
+  class: "text-sm"
+}, lo = {
+  key: 0,
+  class: "text-gray-500"
+}, oo = {
+  key: 1,
+  class: "text-red-600"
+}, ao = ["innerHTML"], io = "https://raw.githubusercontent.com/bondrogeen/vuesp/refs/heads/master/github/docs/scriptrunner/", ro = "https://cdn.jsdelivr.net/npm/marked/lib/marked.umd.js", na = /* @__PURE__ */ S({
+  __name: "ScriptViewDocs",
+  props: {
+    lang: { default: "en" }
+  },
+  setup(e) {
+    const n = A(""), l = A(""), s = A(null), t = A(!1), a = A(null);
+    let c = null;
+    const r = () => new Promise((i, m) => {
+      if (window.marked) {
+        window.marked.setOptions({
+          gfm: !0,
+          breaks: !0,
+          headerIds: !1
+        }), i(window.marked);
+        return;
+      }
+      const p = document.createElement("script");
+      p.src = ro, p.async = !0, p.onload = () => {
+        window.marked ? (window.marked.setOptions({
+          gfm: !0,
+          breaks: !0,
+          headerIds: !1
+        }), i(window.marked)) : m(new Error("Marked library not found after loading"));
+      }, p.onerror = () => {
+        m(new Error("Failed to load Marked library from CDN"));
+      }, document.head.appendChild(p);
+    }), u = (i) => {
+      const m = i.split(`
+`), p = {};
+      let b = !0;
+      for (const g of m) {
+        if (b && g.startsWith("#")) {
+          b = !1;
+          continue;
+        }
+        if (b && g.includes(":")) {
+          const [x, z] = g.split(":").map((E) => E.trim());
+          x && z && (x.toLowerCase().includes("version") && (p.version = z), (x.toLowerCase().includes("обновлено") || x.toLowerCase().includes("updated")) && (p.updated = z));
+        }
+      }
+      return p;
+    }, d = async (i) => {
+      if (!c) {
+        a.value = "error";
+        return;
+      }
+      t.value = !0, a.value = null, l.value = "";
+      try {
+        const m = `${io}${i}.md`, p = await fetch(m);
+        if (!p.ok)
+          throw new Error(`HTTP ${p.status}: ${p.statusText}`);
+        const b = await p.text();
+        n.value = b, s.value = u(b), l.value = c.parse(b);
+      } catch (m) {
+        const p = m instanceof Error ? m.message : "";
+        a.value = p, console.error("Error loading docs:", m);
+      } finally {
+        t.value = !1;
+      }
+    };
+    return le(async () => {
+      try {
+        c = await r();
+        const i = e.lang ? "ru" : "en";
+        await d(i);
+      } catch (i) {
+        const m = i instanceof Error ? i.message : "";
+        a.value = m, console.error("Initialization error:", i);
+      }
+    }), (i, m) => (f(), v("div", no, [
+      t.value || a.value ? (f(), v("div", so, [
+        t.value ? (f(), v("span", lo, "⏳")) : T("", !0),
+        a.value ? (f(), v("span", oo, "❌ " + $(a.value), 1)) : T("", !0)
+      ])) : T("", !0),
+      o("div", {
+        class: "docs-content",
+        innerHTML: l.value
+      }, null, 8, ao)
+    ]));
+  }
+}), co = { class: "my-4" }, sa = /* @__PURE__ */ S({
+  __name: "ScriptDialog",
+  props: {
+    idScript: {}
+  },
+  emits: ["add", "close"],
+  setup(e, { emit: n }) {
+    const l = n, { defineField: s, handleSubmit: t, isValid: a } = gt({
+      validationSchema: () => ({
+        name: [ht, bt(8)]
+      })
+    }), [c, r] = s("name"), u = () => {
+      l("add", c.value);
+    }, d = t(() => {
+      u(), c.value = "", l("close", new Event("close"));
+    });
+    return le(() => {
+      e.idScript || (c.value = "boot");
+    }), (i, m) => {
+      const p = Z, b = B;
+      return f(), v("div", co, [
+        h(p, H({
+          modelValue: W(c),
+          "onUpdate:modelValue": m[0] || (m[0] = (g) => st(c) ? c.value = g : null)
+        }, W(r), {
+          disabled: !e.idScript,
+          label: i.$t("name")
+        }), null, 16, ["modelValue", "disabled", "label"]),
+        h(b, {
+          class: "w-full",
+          color: "blue",
+          disabled: !W(a),
+          onClick: W(d)
+        }, {
+          default: y(() => [
+            D($(i.$t("add")), 1)
+          ]),
+          _: 1
+        }, 8, ["disabled", "onClick"])
+      ]);
+    };
+  }
+}), la = /* @__PURE__ */ S({
+  __name: "VAutocomplete",
+  props: {
+    modelValue: { default: "" },
+    label: {},
+    name: { default: "" },
+    message: { default: "" },
+    items: {}
+  },
+  emits: ["update:modelValue", "select"],
+  setup(e, { emit: n }) {
+    const l = n, s = (a) => l("update:modelValue", a), t = (a, c) => {
+      a.click(new Event("click")), l("select", c);
+    };
+    return (a, c) => (f(), j(je, H(a.$attrs, {
+      top: "50px",
+      "hide-on-click": ""
+    }), {
+      activator: y(({ on: r }) => [
+        h(Z, {
+          "model-value": e.modelValue,
+          name: e.name,
+          message: e.message,
+          label: e.label,
+          "onUpdate:modelValue": s,
+          onClick: r.open
+        }, null, 8, ["model-value", "name", "message", "label", "onClick"])
+      ]),
+      default: y(({ on: r }) => [
+        h($e, {
+          items: e.items,
+          onClick: (u) => t(r, u)
+        }, {
+          default: y(({ item: u }) => [
+            k(a.$slots, "default", { item: u }, () => [
+              D($(u.name), 1)
+            ])
+          ]),
+          _: 3
+        }, 8, ["items", "onClick"])
+      ]),
+      _: 3
+    }, 16));
+  }
+}), uo = {
+  viewBox: "0 0 24 24",
+  width: "1.2em",
+  height: "1.2em"
+};
+function mo(e, n) {
+  return f(), v("svg", uo, [...n[0] || (n[0] = [
+    o("path", {
+      fill: "currentColor",
+      d: "m12 15l-4.243-4.242l1.415-1.414L12 12.172l2.828-2.828l1.415 1.414z"
+    }, null, -1)
+  ])]);
+}
+const fo = N({ name: "ri-arrow-drop-down-line", render: mo }), po = { class: "v-expansion__content max-h-0 overflow-hidden transition-all duration-300" }, vo = { class: "p-4" }, oa = /* @__PURE__ */ S({
+  __name: "VExpansion",
+  props: {
+    label: { default: "" },
+    value: { type: Boolean, default: !1 }
+  },
+  setup(e) {
+    const n = A(null), l = A(e.value), s = () => {
+      if (!n.value) return;
+      const a = n.value.querySelector(".v-expansion__content");
+      a && (a.style.maxHeight = l.value ? `${a.scrollHeight}px` : "0");
+    }, t = () => {
+      l.value = !l.value, s();
+    };
+    return le(() => {
+      s();
+    }), (a, c) => {
+      const r = fo;
+      return f(), v("div", {
+        ref_key: "root",
+        ref: n,
+        class: "border-b dark:border-gray-700 border-gray-200"
+      }, [
+        o("div", {
+          class: "cursor-pointer min-h-[60px] px-4 flex items-center justify-between",
+          onClick: t
+        }, [
+          o("h4", null, $(e.label), 1),
+          o("div", {
+            class: V(["transition text-gray-400", { "rotate-x-180": l.value }])
+          }, [
+            h(r, { class: "size-6" })
+          ], 2)
+        ]),
+        o("div", po, [
+          o("div", vo, [
+            k(a.$slots, "default")
+          ])
+        ])
+      ], 512);
+    };
+  }
+}), go = ["onDragstart", "onDragenter"], ho = {
+  key: 0,
+  class: "absolute inset-0 border border-dashed border-blue-600 rounded"
+}, aa = /* @__PURE__ */ S({
+  __name: "VDragDrop",
+  props: {
+    items: {},
+    itemKey: { default: "id" }
+  },
+  emits: ["update:items", "order-change"],
+  setup(e, { emit: n }) {
+    const l = n, s = A(null), t = A(0), a = A(-1), c = ({ id: m }) => ({
+      "opacity-30 scale-105 z-10": s.value === m,
+      "transition-transform duration-200": s.value !== m
+    }), r = (m, p, b) => {
+      s.value = p, t.value = b, m.dataTransfer.effectAllowed = "move";
+    }, u = (m) => {
+      s.value !== null && (a.value = m);
+    }, d = () => {
+      s.value = null, a.value = -1;
+    }, i = (m) => {
+      if (m.preventDefault(), s.value && a.value !== -1) {
+        const p = e.items.findIndex((g) => g[e.itemKey] === s.value), b = a.value;
+        if (p !== b && b !== -1) {
+          const g = [...e.items], [x] = g.splice(p, 1);
+          g.splice(b, 0, x), l("update:items", g), l("order-change", { fromIndex: p, toIndex: b, movedItem: x, newOrder: g });
+        }
+      }
+      a.value = -1;
+    };
+    return (m, p) => (f(), v("div", {
+      onDragover: p[1] || (p[1] = q(() => {
+      }, ["prevent"])),
+      onDrop: i
+    }, [
+      h(Le, {
+        "enter-active-class": "transition-all duration-300 ease",
+        "enter-from-class": "opacity-0 translate-x-8",
+        "enter-to-class": "opacity-100 translate-x-0",
+        "leave-active-class": "transition-all duration-300 ease absolute",
+        "leave-from-class": "opacity-100 translate-x-0",
+        "leave-to-class": "opacity-0 translate-x-8",
+        "move-class": "transition-all duration-300 ease"
+      }, {
+        default: y(() => [
+          (f(!0), v(I, null, R(e.items, (b, g) => (f(), v("div", {
+            key: `${b.id}_drug`,
+            class: V(["relative group", c(b)]),
+            draggable: "true",
+            onDragstart: (x) => r(x, b.id, g),
+            onDragenter: (x) => u(g),
+            onDragend: d,
+            onDragover: p[0] || (p[0] = q(() => {
+            }, ["prevent"]))
+          }, [
+            k(m.$slots, "default", {
+              item: b,
+              key: b.id,
+              index: g,
+              isDragging: s.value === b.id
+            }),
+            a.value === g && s.value !== b.id ? (f(), v("div", ho)) : T("", !0)
+          ], 42, go))), 128))
+        ]),
+        _: 3
+      })
+    ], 32));
+  }
+}), bo = { class: "min-w-full" }, yo = { class: "border-y border-gray-200 py-3 dark:border-gray-800" }, xo = { class: "bg-gray-200 dark:bg-gray-800" }, _o = { class: "flex items-center" }, $o = { class: "divide-y divide-gray-100 dark:divide-gray-800" }, ko = ["onClick"], wo = { class: "flex items-center text-gray-700 dark:text-gray-400" }, Co = { key: 1 }, So = {
+  class: "py-3 whitespace-nowrap",
+  colspan: "9"
+}, zo = { class: "flex items-center justify-center text-theme-sm text-gray-700 dark:text-gray-400 px-2" }, ia = /* @__PURE__ */ S({
+  __name: "VTable",
+  props: {
+    headers: { default: () => [] },
+    items: { default: () => [] }
+  },
+  emits: ["click"],
+  setup(e, { emit: n }) {
+    const l = n, s = (c, r) => l("click", c, r), t = (c) => (c == null ? void 0 : c.className) || "", a = (c, { key: r }) => c == null ? void 0 : c[r];
+    return (c, r) => (f(), v("table", bo, [
+      o("thead", yo, [
+        o("tr", xo, [
+          (f(!0), v(I, null, R(e.headers, (u, d) => (f(), v("th", {
+            key: d,
+            class: V(["py-2 whitespace-nowrap text-gray-500 dark:text-gray-400 font-normal px-4", t(u)])
+          }, [
+            k(c.$slots, "header", {
+              item: u,
+              i: d
+            }, () => [
+              o("div", _o, $(u.name), 1)
+            ])
+          ], 2))), 128))
+        ])
+      ]),
+      o("tbody", $o, [
+        e.items.length ? (f(!0), v(I, { key: 0 }, R(e.items, (u, d) => (f(), v("tr", {
+          key: d,
+          class: "hover:bg-gray-50/50 dark:hover:bg-gray-800/50",
+          onClick: (i) => s(u, i)
+        }, [
+          (f(!0), v(I, null, R(e.headers, (i, m) => (f(), v("td", {
+            key: m,
+            class: "py-2 px-4"
+          }, [
+            o("div", wo, [
+              k(c.$slots, i.key, {
+                item: u,
+                i: d
+              }, () => [
+                D($(a(u, i)), 1)
+              ])
+            ])
+          ]))), 128))
+        ], 8, ko))), 128)) : (f(), v("tr", Co, [
+          o("td", So, [
+            o("div", zo, [
+              k(c.$slots, "empty", {}, () => [
+                r[0] || (r[0] = D("The list is empty", -1))
+              ])
+            ])
+          ])
+        ]))
+      ])
+    ]));
+  }
+}), ra = /* @__PURE__ */ S({
+  __name: "VTooltip",
+  props: {
+    timeout: {},
+    disabled: { type: Boolean }
+  },
+  setup(e) {
+    const n = A(!1), l = () => {
+      e.disabled || (n.value = !0);
+    }, s = () => {
+      n.value = !1;
+    }, t = Ae("tooltip");
+    return pt(t, () => s()), (a, c) => (f(), v("div", {
+      ref: "tooltip",
+      class: "relative v-tooltip",
+      onMouseenter: l,
+      onMouseleave: s
+    }, [
+      o("button", {
+        type: "button",
+        onClick: l
+      }, [
+        k(a.$slots, "activator")
+      ]),
+      h(_e, {
+        "enter-active-class": "duration-300 ease-out",
+        "enter-from-class": "transform opacity-0 -translate-y-2",
+        "enter-to-class": "opacity-100 translate-y-0",
+        "leave-active-class": "duration-200 ease-in",
+        "leave-from-class": "opacity-100 translate-y-0",
+        "leave-to-class": "transform opacity-0 -translate-y-2"
+      }, {
+        default: y(() => [
+          k(a.$slots, "default", { show: n.value })
+        ]),
+        _: 3
+      })
+    ], 544));
+  }
+});
+export {
+  Io as AppAside,
+  jo as AppHeader,
+  No as AppNav,
+  Ho as AppNotification,
+  Po as AppOverlay,
+  Oo as AppProgress,
+  qo as BlockBreadcrumb,
+  Fo as BlockInfo,
+  Uo as BlockScan,
+  Ro as BlockService,
+  Ko as BlockStatus,
+  Wo as BlockUpdate,
+  oe as CardBase,
+  Go as CardButton,
+  Zo as CardDate,
+  Jo as CardDimmer,
+  Xo as CardInfo,
+  Yo as CardInput,
+  Qo as CardList,
+  ua as CardMain,
+  Wt as CardNotification,
+  ea as ItemEdit,
+  sa as ScriptDialog,
+  ta as ScriptEditor,
+  na as ScriptViewDocs,
+  la as VAutocomplete,
+  B as VButton,
+  fl as VCheckbox,
+  He as VDialog,
+  aa as VDragDrop,
+  je as VDropdown,
+  oa as VExpansion,
+  Xn as VFile,
+  ge as VFunc,
+  Ie as VIconLogo,
+  lt as VIconLogoMini,
+  $e as VList,
+  Ue as VListObject,
+  it as VLoader,
+  ma as VPopup,
+  se as VSelect,
+  ia as VTable,
+  al as VTabs,
+  Z as VTextField,
+  Fe as VTextWrapper,
+  ra as VTooltip,
+  at as VWifiIcon
+};