@vasakgroup/vue-libvasak 0.6.2 → 0.7.0

package/dist/vue-libvasak.es.js

@@ -1,4 +1,4 @@
-import { ref as $, onMounted as Q, onUnmounted as Ve, watch as X, defineComponent as E, toRef as me, computed as x, createElementBlock as i, unref as V, openBlock as l, normalizeStyle as se, createCommentVNode as g, createElementVNode as C, createVNode as j, toDisplayString as S, normalizeClass as p, renderSlot as B, createBlock as G, onBeforeUnmount as J, Fragment as Y, renderList as ae, withCtx as U, mergeModels as je, useAttrs as Pe, useId as Ne, useModel as Fe, withDirectives as ye, mergeProps as ne, isRef as Re, vModelSelect as He, inject as xe, getCurrentInstance as ke, provide as ue, createTextVNode as We, toHandlers as we, createSlots as qe, withModifiers as A, withKeys as O, Teleport as $e, Transition as Ce, nextTick as ce, vShow as Ue, cloneVNode as Ke, h as Ge, Comment as Ye, Text as Qe } from "vue";
+import { ref as $, onMounted as Q, onUnmounted as je, watch as X, defineComponent as E, toRef as me, computed as k, createElementBlock as i, unref as V, openBlock as l, normalizeStyle as se, createCommentVNode as g, createElementVNode as C, createVNode as j, toDisplayString as T, normalizeClass as p, renderSlot as B, createBlock as G, onBeforeUnmount as J, Fragment as Y, renderList as ae, withCtx as U, mergeModels as be, useAttrs as Pe, useId as Ne, useModel as Fe, withDirectives as xe, mergeProps as ne, isRef as Re, vModelSelect as He, inject as ke, getCurrentInstance as we, provide as ue, createTextVNode as We, toHandlers as $e, createSlots as qe, withModifiers as S, withKeys as O, Teleport as Ce, Transition as ze, nextTick as ce, vShow as Ue, cloneVNode as Ke, h as Ge, Comment as Ye, Text as Qe } from "vue";
 import { listen as Xe } from "@tauri-apps/api/event";
 import { getSymbolSource as Je, getIconSource as Ze } from "@vasakgroup/plugin-vicons";
 import { getCurrentWindow as _e } from "@tauri-apps/api/window";
@@ -6,12 +6,12 @@ function et(e, n) {
   const t = $("");
   let a = null, o = !1, s = 0;
   async function c() {
-    const u = ++s, d = e.value;
-    if (!d) {
+    const u = ++s, f = e.value;
+    if (!f) {
       t.value = "";
       return;
     }
-    const v = n.value === "symbol" ? await Je(d) : await Ze(d);
+    const v = n.value === "symbol" ? await Je(f) : await Ze(f);
     u === s && (t.value = v);
   }
   return Q(async () => {
@@ -21,7 +21,7 @@ function et(e, n) {
       return;
     }
     a = u, await c();
-  }), Ve(() => {
+  }), je(() => {
     o = !0, a?.();
   }), X(e, c), t;
 }
@@ -34,7 +34,7 @@ const tt = ["src", "alt"], N = /* @__PURE__ */ E({
     alt: { default: "" }
   },
   setup(e) {
-    const n = e, t = et(me(n, "name"), me(n, "type")), a = x(() => `${n.size}px`);
+    const n = e, t = et(me(n, "name"), me(n, "type")), a = k(() => `${n.size}px`);
     return (o, s) => V(t) ? (l(), i("img", {
       key: 0,
       src: V(t),
@@ -50,7 +50,7 @@ const tt = ["src", "alt"], N = /* @__PURE__ */ E({
 }), at = { class: "flex flex-col gap-2" }, nt = ["aria-expanded"], lt = {
   key: 1,
   class: "flex flex-col gap-1"
-}, ze = /* @__PURE__ */ E({
+}, Le = /* @__PURE__ */ E({
   __name: "SideGroup",
   props: {
     title: {},
@@ -72,7 +72,7 @@ const tt = ["src", "alt"], N = /* @__PURE__ */ E({
         "aria-expanded": t.value,
         onClick: o[0] || (o[0] = (s) => t.value = !t.value)
       }, [
-        C("span", null, S(e.title), 1),
+        C("span", null, T(e.title), 1),
         j(N, {
           name: "pan-down-symbolic",
           type: "symbol",
@@ -91,7 +91,7 @@ const tt = ["src", "alt"], N = /* @__PURE__ */ E({
 }, rt = {
   key: 1,
   class: "rounded-corner bg-ui-surface px-2 py-0.5 font-semibold text-tx-muted text-xs"
-}, Le = /* @__PURE__ */ E({
+}, Ee = /* @__PURE__ */ E({
   __name: "SideButton",
   props: {
     label: {},
@@ -124,10 +124,10 @@ const tt = ["src", "alt"], N = /* @__PURE__ */ E({
           key: 0,
           name: e.icon,
           size: 20
-        }, null, 8, ["name"])) : (l(), i("span", it, S(e.label.charAt(0).toUpperCase()), 1))
+        }, null, 8, ["name"])) : (l(), i("span", it, T(e.label.charAt(0).toUpperCase()), 1))
       ], 2),
-      e.collapsed ? g("", !0) : (l(), i("span", st, S(e.label), 1)),
-      !e.collapsed && e.badge !== "" ? (l(), i("span", rt, S(e.badge), 1)) : g("", !0)
+      e.collapsed ? g("", !0) : (l(), i("span", st, T(e.label), 1)),
+      !e.collapsed && e.badge !== "" ? (l(), i("span", rt, T(e.badge), 1)) : g("", !0)
     ], 10, ot));
   }
 }), ut = {
@@ -145,7 +145,7 @@ const tt = ["src", "alt"], N = /* @__PURE__ */ E({
 }, vt = { key: 0 }, pt = {
   key: 1,
   class: "flex border-ui-border border-b p-2"
-}, gt = ["aria-label", "aria-expanded"], ht = { class: "flex min-h-0 flex-1 flex-col gap-3 overflow-y-auto p-2" }, be = "hidden h-8 w-8 shrink-0 items-center justify-center rounded-corner border border-ui-border bg-ui-surface/70 transition-colors hover:bg-ui-surface md:inline-flex", ve = 767, yt = /* @__PURE__ */ E({
+}, gt = ["aria-label", "aria-expanded"], ht = { class: "flex min-h-0 flex-1 flex-col gap-3 overflow-y-auto p-2" }, ve = "hidden h-8 w-8 shrink-0 items-center justify-center rounded-corner border border-ui-border bg-ui-surface/70 transition-colors hover:bg-ui-surface md:inline-flex", pe = 767, yt = /* @__PURE__ */ E({
   __name: "SideBar",
   props: {
     title: { default: "" },
@@ -159,38 +159,38 @@ const tt = ["src", "alt"], N = /* @__PURE__ */ E({
   emits: ["update:modelValue", "update:collapsed", "change"],
   setup(e, { expose: n, emit: t }) {
     const a = e, o = t, s = $(a.collapsed ?? !1), c = $(!1);
-    let u = null, d = null;
-    const v = x(() => c.value || s.value), w = x(() => !!(a.title || a.subtitle));
-    x(() => a.categories.length > 0);
-    function I() {
+    let u = null, f = null;
+    const v = k(() => c.value || s.value), y = k(() => !!(a.title || a.subtitle));
+    k(() => a.categories.length > 0);
+    function M() {
       return document.documentElement?.clientWidth || window.innerWidth;
     }
     function z() {
-      c.value = I() <= ve;
+      c.value = M() <= pe;
     }
     function L() {
       s.value = !s.value, o("update:collapsed", s.value);
     }
-    function h(k) {
-      o("update:modelValue", k), o("change", k);
+    function h(w) {
+      o("update:modelValue", w), o("change", w);
     }
     return X(
       () => a.collapsed,
-      (k) => {
-        k !== void 0 && (s.value = k);
+      (w) => {
+        w !== void 0 && (s.value = w);
       }
     ), Q(() => {
-      u = window.matchMedia(`(max-width: ${ve}px)`), z(), u.addEventListener("change", z), window.addEventListener("resize", z), typeof ResizeObserver < "u" && document.documentElement && (d = new ResizeObserver(z), d.observe(document.documentElement));
+      u = window.matchMedia(`(max-width: ${pe}px)`), z(), u.addEventListener("change", z), window.addEventListener("resize", z), typeof ResizeObserver < "u" && document.documentElement && (f = new ResizeObserver(z), f.observe(document.documentElement));
     }), J(() => {
-      u?.removeEventListener("change", z), window.removeEventListener("resize", z), d?.disconnect(), d = null;
-    }), n({ collapsed: v }), (k, P) => (l(), i("aside", {
+      u?.removeEventListener("change", z), window.removeEventListener("resize", z), f?.disconnect(), f = null;
+    }), n({ collapsed: v }), (w, P) => (l(), i("aside", {
       class: p(["relative z-30 flex h-full shrink-0 flex-col rounded-corner border border-ui-border bg-ui-surface/70 transition-all duration-300", ["w-[84px]", v.value ? "md:w-[84px]" : "md:w-72"]])
     }, [
-      w.value || k.$slots.header ? (l(), i("header", ut, [
+      y.value || w.$slots.header ? (l(), i("header", ut, [
         C("div", ct, [
           C("button", {
             type: "button",
-            class: p(be),
+            class: p(ve),
             "aria-label": v.value ? e.expandLabel : e.collapseLabel,
             "aria-expanded": !v.value,
             onClick: L
@@ -201,18 +201,18 @@ const tt = ["src", "alt"], N = /* @__PURE__ */ E({
               size: 16
             }, null, 8, ["name"])
           ], 8, dt),
-          w.value && !v.value ? (l(), i("div", ft, [
-            e.title ? (l(), i("p", mt, S(e.title), 1)) : g("", !0),
-            e.subtitle ? (l(), i("p", bt, S(e.subtitle), 1)) : g("", !0)
+          y.value && !v.value ? (l(), i("div", ft, [
+            e.title ? (l(), i("p", mt, T(e.title), 1)) : g("", !0),
+            e.subtitle ? (l(), i("p", bt, T(e.subtitle), 1)) : g("", !0)
           ])) : g("", !0)
         ]),
-        k.$slots.header && !v.value ? (l(), i("div", vt, [
-          B(k.$slots, "header", { collapsed: v.value })
+        w.$slots.header && !v.value ? (l(), i("div", vt, [
+          B(w.$slots, "header", { collapsed: v.value })
         ])) : g("", !0)
       ])) : (l(), i("div", pt, [
         C("button", {
           type: "button",
-          class: p(be),
+          class: p(ve),
           "aria-label": v.value ? e.expandLabel : e.collapseLabel,
           "aria-expanded": !v.value,
           onClick: L
@@ -225,33 +225,33 @@ const tt = ["src", "alt"], N = /* @__PURE__ */ E({
         ], 8, gt)
       ])),
       C("div", ht, [
-        (l(!0), i(Y, null, ae(e.categories, (F) => (l(), G(ze, {
+        (l(!0), i(Y, null, ae(e.categories, (F) => (l(), G(Le, {
           key: F.id,
           title: F.title,
           collapsed: v.value
         }, {
           default: U(() => [
-            (l(!0), i(Y, null, ae(F.items, (y) => (l(), G(Le, {
-              key: y.id,
-              label: y.label,
-              icon: y.icon,
-              badge: y.badge,
-              disabled: y.disabled,
+            (l(!0), i(Y, null, ae(F.items, (x) => (l(), G(Ee, {
+              key: x.id,
+              label: x.label,
+              icon: x.icon,
+              badge: x.badge,
+              disabled: x.disabled,
               collapsed: v.value,
-              active: e.modelValue === y.id,
-              onClick: (r) => h(y.id)
+              active: e.modelValue === x.id,
+              onClick: (r) => h(x.id)
             }, null, 8, ["label", "icon", "badge", "disabled", "collapsed", "active", "onClick"]))), 128))
           ]),
           _: 2
         }, 1032, ["title", "collapsed"]))), 128)),
-        B(k.$slots, "default", { collapsed: v.value })
+        B(w.$slots, "default", { collapsed: v.value })
       ])
     ], 2));
   }
 }), xt = { class: "flex min-w-0 flex-col gap-1" }, kt = ["for"], wt = { class: "relative flex min-w-0 items-center" }, $t = ["id"], Ct = /* @__PURE__ */ E({
   inheritAttrs: !1,
   __name: "SelectField",
-  props: /* @__PURE__ */ je({
+  props: /* @__PURE__ */ be({
     label: {}
   }, {
     modelValue: {
@@ -259,28 +259,30 @@ const tt = ["src", "alt"], N = /* @__PURE__ */ E({
     },
     modelModifiers: {}
   }),
-  emits: ["update:modelValue"],
-  setup(e) {
-    const n = e, t = Pe(), a = Ne(), o = x(() => t.id ?? a), [s, c] = Fe(e, "modelValue", {
-      set(u) {
-        return c.number ? Number(u) : u;
+  emits: /* @__PURE__ */ be(["change"], ["update:modelValue"]),
+  setup(e, { emit: n }) {
+    const t = e, a = Pe(), o = Ne(), s = k(() => a.id ?? o), c = n, [u, f] = Fe(e, "modelValue", {
+      set(v) {
+        return f.number ? Number(v) : v;
       }
     });
-    return (u, d) => (l(), i("div", xt, [
-      n.label ? (l(), i("label", {
+    return (v, y) => (l(), i("div", xt, [
+      t.label ? (l(), i("label", {
         key: 0,
-        for: o.value,
+        for: s.value,
         class: "text-tx-muted text-xs"
-      }, S(n.label), 9, kt)) : g("", !0),
+      }, T(t.label), 9, kt)) : g("", !0),
       C("div", wt, [
-        ye(C("select", ne({
-          id: o.value,
-          "onUpdate:modelValue": d[0] || (d[0] = (v) => Re(s) ? s.value = v : null),
+        xe(C("select", ne({
+          id: s.value,
+          "onUpdate:modelValue": y[0] || (y[0] = (M) => Re(u) ? u.value = M : null),
           class: "min-w-0 flex-1 appearance-none truncate rounded-corner border border-ui-border bg-ui-surface/60 py-1.5 pr-8 pl-2 text-sm text-tx-main"
-        }, V(t)), [
-          B(u.$slots, "default")
+        }, V(a), {
+          onChange: y[1] || (y[1] = (M) => c("change", M))
+        }), [
+          B(v.$slots, "default")
         ], 16, $t), [
-          [He, V(s)]
+          [He, V(u)]
         ]),
         j(N, {
           name: "pan-down-symbolic",
@@ -300,13 +302,13 @@ function Lt(e) {
   return typeof e == "string" && zt.includes(e);
 }
 function Z() {
-  const e = xe(de, null);
+  const e = ke(de, null);
   if (e) return e;
   const n = $("top");
   return {
     posicion: n,
-    orientacion: x(() => re(n.value)),
-    vertical: x(() => re(n.value) === "vertical")
+    orientacion: k(() => re(n.value)),
+    vertical: k(() => re(n.value) === "vertical")
   };
 }
 const fe = ["minimize", "maximize", "close"], Et = "window", Dt = "barPosition";
@@ -341,15 +343,15 @@ function Mt(e = "top") {
     a = !0, t?.(), t = null;
   }), n;
 }
-function Ee(e) {
-  const n = ke(), t = {};
+function De(e) {
+  const n = we(), t = {};
   for (const a of e) {
     const o = `on${a[0].toUpperCase()}${a.slice(1)}`;
     n?.vnode.props?.[o] && (t[a] = () => n.emit(a));
   }
   return t;
 }
-const At = ["title", "aria-label"], St = ["title", "aria-label"], Tt = ["title", "aria-label"], ie = "flex items-center justify-center rounded-corner border border-ui-border bg-ui-bg/80 p-1 transition-colors", De = /* @__PURE__ */ E({
+const At = ["title", "aria-label"], St = ["title", "aria-label"], Tt = ["title", "aria-label"], ie = "flex items-center justify-center rounded-corner border border-ui-border bg-ui-bg/80 p-1 transition-colors", Be = /* @__PURE__ */ E({
   __name: "WindowControls",
   props: {
     controls: { default: () => fe },
@@ -359,7 +361,7 @@ const At = ["title", "aria-label"], St = ["title", "aria-label"], Tt = ["title",
   },
   emits: ["minimize", "maximize", "close"],
   setup(e, { emit: n }) {
-    const t = e, a = n, { vertical: o } = Z(), s = x(() => ({
+    const t = e, a = n, { vertical: o } = Z(), s = k(() => ({
       minimize: t.controls.includes("minimize"),
       maximize: t.controls.includes("maximize"),
       close: t.controls.includes("close")
@@ -367,20 +369,20 @@ const At = ["title", "aria-label"], St = ["title", "aria-label"], Tt = ["title",
     function c() {
       return _e();
     }
-    const u = ke();
-    function d(z) {
+    const u = we();
+    function f(z) {
       return !!u?.vnode.props?.[`on${z}`];
     }
     function v() {
-      if (d("Minimize")) return a("minimize");
+      if (f("Minimize")) return a("minimize");
       c().minimize();
     }
-    function w() {
-      if (d("Maximize")) return a("maximize");
+    function y() {
+      if (f("Maximize")) return a("maximize");
       c().toggleMaximize();
     }
-    function I() {
-      if (d("Close")) return a("close");
+    function M() {
+      if (f("Close")) return a("close");
       c().close();
     }
     return (z, L) => e.controls.length ? (l(), i("div", {
@@ -407,7 +409,7 @@ const At = ["title", "aria-label"], St = ["title", "aria-label"], Tt = ["title",
         class: p([ie, "hover:bg-status-warning"]),
         title: e.maximizeLabel,
         "aria-label": e.maximizeLabel,
-        onClick: L[1] || (L[1] = (h) => w())
+        onClick: L[1] || (L[1] = (h) => y())
       }, [
         j(N, {
           name: "window-maximize",
@@ -420,7 +422,7 @@ const At = ["title", "aria-label"], St = ["title", "aria-label"], Tt = ["title",
         class: p([ie, "hover:bg-status-error"]),
         title: e.closeLabel,
         "aria-label": e.closeLabel,
-        onClick: L[2] || (L[2] = (h) => I())
+        onClick: L[2] || (L[2] = (h) => M())
       }, [
         j(N, {
           name: "window-close",
@@ -437,7 +439,7 @@ const At = ["title", "aria-label"], St = ["title", "aria-label"], Tt = ["title",
   key: 1,
   class: "min-w-0 shrink truncate text-sm",
   "data-tauri-drag-region": ""
-}, Be = /* @__PURE__ */ E({
+}, Me = /* @__PURE__ */ E({
   __name: "AppBar",
   props: {
     position: { default: null },
@@ -449,10 +451,10 @@ const At = ["title", "aria-label"], St = ["title", "aria-label"], Tt = ["title",
   },
   emits: ["minimize", "maximize", "close"],
   setup(e) {
-    const n = e, t = Z(), a = x(() => n.position ?? t.posicion.value), o = x(() => a.value === "left" || a.value === "right");
+    const n = e, t = Z(), a = k(() => n.position ?? t.posicion.value), o = k(() => a.value === "left" || a.value === "right");
     return ue(de, {
       posicion: a,
-      orientacion: x(() => o.value ? "vertical" : "horizontal"),
+      orientacion: k(() => o.value ? "vertical" : "horizontal"),
       vertical: o
     }), (s, c) => (l(), i("div", {
       class: p(["relative flex shrink-0 items-center gap-2 p-1 font-title", o.value ? "h-full flex-col" : "w-full"]),
@@ -463,7 +465,7 @@ const At = ["title", "aria-label"], St = ["title", "aria-label"], Tt = ["title",
       ])) : g("", !0),
       (s.$slots.titulo || e.title) && !o.value ? (l(), i("p", Ot, [
         B(s.$slots, "titulo", {}, () => [
-          We(S(e.title), 1)
+          We(T(e.title), 1)
         ])
       ])) : g("", !0),
       C("div", {
@@ -478,12 +480,12 @@ const At = ["title", "aria-label"], St = ["title", "aria-label"], Tt = ["title",
       }, [
         B(s.$slots, "acciones")
       ], 2)) : g("", !0),
-      j(De, ne({
+      j(Be, ne({
         controls: e.controls,
         "minimize-label": e.minimizeLabel,
         "maximize-label": e.maximizeLabel,
         "close-label": e.closeLabel
-      }, we(V(Ee)(["minimize", "maximize", "close"]))), null, 16, ["controls", "minimize-label", "maximize-label", "close-label"]),
+      }, $e(V(De)(["minimize", "maximize", "close"]))), null, 16, ["controls", "minimize-label", "maximize-label", "close-label"]),
       s.$slots.centro ? (l(), i("div", {
         key: 3,
         class: p(["pointer-events-none absolute flex items-center justify-center", o.value ? "inset-x-0 top-1/2 -translate-y-1/2 flex-col" : "inset-y-0 left-1/2 -translate-x-1/2"])
@@ -509,7 +511,7 @@ const At = ["title", "aria-label"], St = ["title", "aria-label"], Tt = ["title",
   },
   emits: ["minimize", "maximize", "close"],
   setup(e) {
-    const n = e, t = Mt(), a = x(() => n.position ?? t.value), o = x(() => re(a.value)), s = x(() => o.value === "vertical");
+    const n = e, t = Mt(), a = k(() => n.position ?? t.value), o = k(() => re(a.value)), s = k(() => o.value === "vertical");
     ue(de, { posicion: a, orientacion: o, vertical: s });
     const c = {
       top: "flex-col",
@@ -517,10 +519,10 @@ const At = ["title", "aria-label"], St = ["title", "aria-label"], Tt = ["title",
       left: "flex-row",
       right: "flex-row-reverse"
     };
-    return (u, d) => (l(), i("div", {
+    return (u, f) => (l(), i("div", {
       class: p(["flex h-screen w-screen overflow-hidden rounded-corner-window border border-ui-border bg-ui-bg/80", c[a.value]])
     }, [
-      e.hideBar ? g("", !0) : (l(), G(Be, ne({
+      e.hideBar ? g("", !0) : (l(), G(Me, ne({
         key: 0,
         position: a.value,
         title: e.title,
@@ -528,7 +530,7 @@ const At = ["title", "aria-label"], St = ["title", "aria-label"], Tt = ["title",
         "maximize-label": e.maximizeLabel,
         "close-label": e.closeLabel,
         controls: e.controls
-      }, we(V(Ee)(["minimize", "maximize", "close"]))), qe({
+      }, $e(V(De)(["minimize", "maximize", "close"]))), qe({
         default: U(() => [
           B(u.$slots, "barra")
         ]),
@@ -578,7 +580,7 @@ const At = ["title", "aria-label"], St = ["title", "aria-label"], Tt = ["title",
   key: 0,
   class: "size-2 shrink-0 rounded-full bg-current",
   "aria-hidden": "true"
-}, qt = ["title", "aria-label"], Ut = 500, pe = 8, ge = 6, Me = /* @__PURE__ */ E({
+}, qt = ["title", "aria-label"], Ut = 500, ge = 8, he = 6, Ae = /* @__PURE__ */ E({
   __name: "TabItem",
   props: {
     tab: {},
@@ -589,36 +591,36 @@ const At = ["title", "aria-label"], St = ["title", "aria-label"], Tt = ["title",
   },
   emits: ["select", "close", "menu", "mover", "navegar"],
   setup(e, { emit: n }) {
-    const t = e, a = n, { vertical: o, posicion: s } = Z(), c = $(null), u = $(null), d = $(!1), v = $(!1), w = $(!1), I = $({ top: 0, left: 0, right: 0 });
+    const t = e, a = n, { vertical: o, posicion: s } = Z(), c = $(null), u = $(null), f = $(!1), v = $(!1), y = $(!1), M = $({ top: 0, left: 0, right: 0 });
     let z = null, L = null;
-    const h = x(() => t.tab.closable !== !1), k = x(() => t.tab.tooltip ?? t.tab.label), P = x(
+    const h = k(() => t.tab.closable !== !1), w = k(() => t.tab.tooltip ?? t.tab.label), P = k(
       () => t.tab.dirty ? `${t.tab.label} · ${t.dirtyLabel}` : t.tab.label
-    ), F = x(() => t.tab.label.trim().charAt(0).toUpperCase()), y = x(() => d.value || w.value), r = x(
-      () => !!t.tab.dirty && !(y.value && h.value)
-    ), f = x(
-      () => h.value && (y.value || t.active || !t.tab.dirty)
-    ), b = x(
-      () => o.value && (d.value || v.value || w.value)
-    ), D = x(() => {
-      const M = { position: "fixed", top: `${I.value.top}px`, zIndex: 50 };
-      return s.value === "right" ? { ...M, right: `${I.value.right + ge}px` } : { ...M, left: `${I.value.left + ge}px` };
+    ), F = k(() => t.tab.label.trim().charAt(0).toUpperCase()), x = k(() => f.value || y.value), r = k(
+      () => !!t.tab.dirty && !(x.value && h.value)
+    ), d = k(
+      () => h.value && (x.value || t.active || !t.tab.dirty)
+    ), b = k(
+      () => o.value && (f.value || v.value || y.value)
+    ), D = k(() => {
+      const A = { position: "fixed", top: `${M.value.top}px`, zIndex: 50 };
+      return s.value === "right" ? { ...A, right: `${M.value.right + he}px` } : { ...A, left: `${M.value.left + he}px` };
     });
     function _() {
-      const M = c.value;
-      if (!M) return;
-      const m = M.getBoundingClientRect();
-      I.value = {
+      const A = c.value;
+      if (!A) return;
+      const m = A.getBoundingClientRect();
+      M.value = {
         top: m.top,
         left: m.right,
         right: window.innerWidth - m.left
       };
     }
-    function H(M) {
-      const m = M.relatedTarget;
-      m && u.value?.contains(m) || (w.value = !1);
+    function H(A) {
+      const m = A.relatedTarget;
+      m && u.value?.contains(m) || (y.value = !1);
     }
     function ee() {
-      d.value = !0, _();
+      f.value = !0, _();
     }
     function W() {
       v.value = !0, _();
@@ -626,22 +628,22 @@ const At = ["title", "aria-label"], St = ["title", "aria-label"], Tt = ["title",
     function R() {
       z !== null && clearTimeout(z), z = null, L = null;
     }
-    function K(M) {
-      M.button === 0 && (L = { x: M.clientX, y: M.clientY }, z = setTimeout(() => {
+    function K(A) {
+      A.button === 0 && (L = { x: A.clientX, y: A.clientY }, z = setTimeout(() => {
         L && a("menu", L), R();
       }, Ut));
     }
-    function te(M) {
+    function te(A) {
       if (!L) return;
-      (Math.abs(M.clientX - L.x) > pe || Math.abs(M.clientY - L.y) > pe) && R();
+      (Math.abs(A.clientX - L.x) > ge || Math.abs(A.clientY - L.y) > ge) && R();
     }
-    function Ie(M) {
-      M.button === 1 && h.value && (M.preventDefault(), a("close"));
+    function Oe(A) {
+      A.button === 1 && h.value && (A.preventDefault(), a("close"));
     }
-    function Oe(M) {
-      M.preventDefault(), a("menu", { x: M.clientX, y: M.clientY });
+    function Ve(A) {
+      A.preventDefault(), a("menu", { x: A.clientX, y: A.clientY });
     }
-    return J(R), (M, m) => (l(), i("div", {
+    return J(R), (A, m) => (l(), i("div", {
       ref_key: "raiz",
       ref: c,
       class: p(["group relative flex shrink-0 cursor-pointer items-center gap-2 rounded-corner border border-ui-border transition-colors", [
@@ -650,54 +652,54 @@ const At = ["title", "aria-label"], St = ["title", "aria-label"], Tt = ["title",
       ]]),
       role: "tab",
       "aria-selected": e.active,
-      title: k.value,
+      title: w.value,
       "aria-label": P.value,
       tabindex: e.tabindex,
-      onClick: m[5] || (m[5] = A((T) => a("select"), ["stop"])),
+      onClick: m[5] || (m[5] = S((I) => a("select"), ["stop"])),
       onKeydown: [
-        m[6] || (m[6] = O(A((T) => a("select"), ["stop"]), ["enter"])),
-        m[7] || (m[7] = O(A((T) => a("select"), ["prevent", "stop"]), ["space"])),
-        m[8] || (m[8] = O(A((T) => a("navegar", "anterior"), ["prevent", "stop"]), ["left"])),
-        m[9] || (m[9] = O(A((T) => a("navegar", "anterior"), ["prevent", "stop"]), ["up"])),
-        m[10] || (m[10] = O(A((T) => a("navegar", "siguiente"), ["prevent", "stop"]), ["right"])),
-        m[11] || (m[11] = O(A((T) => a("navegar", "siguiente"), ["prevent", "stop"]), ["down"])),
-        m[12] || (m[12] = O(A((T) => a("navegar", "primera"), ["prevent", "stop"]), ["home"])),
-        m[13] || (m[13] = O(A((T) => a("navegar", "ultima"), ["prevent", "stop"]), ["end"])),
-        m[14] || (m[14] = O(A((T) => a("mover", -1), ["alt", "prevent", "stop"]), ["left"])),
-        m[15] || (m[15] = O(A((T) => a("mover", -1), ["alt", "prevent", "stop"]), ["up"])),
-        m[16] || (m[16] = O(A((T) => a("mover", 1), ["alt", "prevent", "stop"]), ["right"])),
-        m[17] || (m[17] = O(A((T) => a("mover", 1), ["alt", "prevent", "stop"]), ["down"])),
-        m[18] || (m[18] = O(A((T) => h.value && a("close"), ["prevent", "stop"]), ["delete"]))
+        m[6] || (m[6] = O(S((I) => a("select"), ["stop"]), ["enter"])),
+        m[7] || (m[7] = O(S((I) => a("select"), ["prevent", "stop"]), ["space"])),
+        m[8] || (m[8] = O(S((I) => a("navegar", "anterior"), ["prevent", "stop"]), ["left"])),
+        m[9] || (m[9] = O(S((I) => a("navegar", "anterior"), ["prevent", "stop"]), ["up"])),
+        m[10] || (m[10] = O(S((I) => a("navegar", "siguiente"), ["prevent", "stop"]), ["right"])),
+        m[11] || (m[11] = O(S((I) => a("navegar", "siguiente"), ["prevent", "stop"]), ["down"])),
+        m[12] || (m[12] = O(S((I) => a("navegar", "primera"), ["prevent", "stop"]), ["home"])),
+        m[13] || (m[13] = O(S((I) => a("navegar", "ultima"), ["prevent", "stop"]), ["end"])),
+        m[14] || (m[14] = O(S((I) => a("mover", -1), ["alt", "prevent", "stop"]), ["left"])),
+        m[15] || (m[15] = O(S((I) => a("mover", -1), ["alt", "prevent", "stop"]), ["up"])),
+        m[16] || (m[16] = O(S((I) => a("mover", 1), ["alt", "prevent", "stop"]), ["right"])),
+        m[17] || (m[17] = O(S((I) => a("mover", 1), ["alt", "prevent", "stop"]), ["down"])),
+        m[18] || (m[18] = O(S((I) => h.value && a("close"), ["prevent", "stop"]), ["delete"]))
       ],
-      onAuxclick: A(Ie, ["stop"]),
-      onContextmenu: Oe,
+      onAuxclick: S(Oe, ["stop"]),
+      onContextmenu: Ve,
       onPointerdown: K,
       onPointermove: te,
       onPointerup: R,
       onPointerleave: R,
       onMouseenter: ee,
-      onMouseleave: m[19] || (m[19] = (T) => d.value = !1),
+      onMouseleave: m[19] || (m[19] = (I) => f.value = !1),
       onFocus: W,
-      onBlur: m[20] || (m[20] = (T) => v.value = !1)
+      onBlur: m[20] || (m[20] = (I) => v.value = !1)
     }, [
       e.tab.icon ? (l(), G(N, {
         key: 0,
         name: e.tab.icon,
         size: 16,
         class: "shrink-0"
-      }, null, 8, ["name"])) : V(o) ? (l(), i("span", Nt, S(F.value), 1)) : g("", !0),
-      V(o) ? g("", !0) : (l(), i("span", Ft, S(e.tab.label), 1)),
+      }, null, 8, ["name"])) : V(o) ? (l(), i("span", Nt, T(F.value), 1)) : g("", !0),
+      V(o) ? g("", !0) : (l(), i("span", Ft, T(e.tab.label), 1)),
       r.value ? (l(), i("span", {
         key: 3,
         class: p(["size-2 shrink-0 rounded-full bg-current", V(o) ? "absolute right-0.5 top-0.5" : ""]),
         "aria-hidden": "true"
-      }, null, 2)) : f.value && !V(o) ? (l(), i("button", {
+      }, null, 2)) : d.value && !V(o) ? (l(), i("button", {
         key: 4,
         type: "button",
         class: "flex size-4 shrink-0 items-center justify-center rounded-corner-sm hover:bg-ui-surface",
         title: e.closeLabel,
         "aria-label": `${e.closeLabel}: ${P.value}`,
-        onClick: m[0] || (m[0] = A((T) => a("close"), ["stop"]))
+        onClick: m[0] || (m[0] = S((I) => a("close"), ["stop"]))
       }, [
         j(N, {
           name: "gtk-close",
@@ -705,8 +707,8 @@ const At = ["title", "aria-label"], St = ["title", "aria-label"], Tt = ["title",
           size: 12
         })
       ], 8, Rt)) : g("", !0),
-      (l(), G($e, { to: "body" }, [
-        j(Ce, {
+      (l(), G(Ce, { to: "body" }, [
+        j(ze, {
           "enter-active-class": "transition duration-150 ease-out",
           "enter-from-class": "opacity-0 scale-95",
           "leave-active-class": "transition duration-100 ease-in",
@@ -719,12 +721,12 @@ const At = ["title", "aria-label"], St = ["title", "aria-label"], Tt = ["title",
               ref_key: "desplegadoRef",
               ref: u,
               style: se(D.value),
-              onMouseenter: m[2] || (m[2] = (T) => w.value = !0),
-              onMouseleave: m[3] || (m[3] = (T) => w.value = !1),
-              onFocusin: m[4] || (m[4] = (T) => w.value = !0),
+              onMouseenter: m[2] || (m[2] = (I) => y.value = !0),
+              onMouseleave: m[3] || (m[3] = (I) => y.value = !1),
+              onFocusin: m[4] || (m[4] = (I) => y.value = !0),
               onFocusout: H
             }, [
-              C("span", Ht, S(e.tab.label), 1),
+              C("span", Ht, T(e.tab.label), 1),
               e.tab.dirty ? (l(), i("span", Wt)) : g("", !0),
               h.value ? (l(), i("button", {
                 key: 1,
@@ -732,7 +734,7 @@ const At = ["title", "aria-label"], St = ["title", "aria-label"], Tt = ["title",
                 class: "flex size-4 shrink-0 items-center justify-center rounded-corner-sm hover:bg-ui-surface",
                 title: e.closeLabel,
                 "aria-label": `${e.closeLabel}: ${P.value}`,
-                onClick: m[1] || (m[1] = A((T) => a("close"), ["stop"]))
+                onClick: m[1] || (m[1] = S((I) => a("close"), ["stop"]))
               }, [
                 j(N, {
                   name: "gtk-close",
@@ -759,48 +761,48 @@ const At = ["title", "aria-label"], St = ["title", "aria-label"], Tt = ["title",
   },
   emits: ["update:modelValue", "select", "close", "new", "reorder", "menu"],
   setup(e, { emit: n }) {
-    const t = e, a = n, { vertical: o } = Z(), s = $(null), c = $(0), u = $(null), d = $(null);
-    function v(y) {
-      a("update:modelValue", y), a("select", y);
+    const t = e, a = n, { vertical: o } = Z(), s = $(null), c = $(0), u = $(null), f = $(null);
+    function v(x) {
+      a("update:modelValue", x), a("select", x);
     }
-    async function w(y, r) {
-      const f = t.tabs.length - 1;
-      if (f < 0) return;
-      const b = r === "primera" ? 0 : r === "ultima" ? f : r === "anterior" ? (y - 1 + t.tabs.length) % t.tabs.length : (y + 1) % t.tabs.length;
+    async function y(x, r) {
+      const d = t.tabs.length - 1;
+      if (d < 0) return;
+      const b = r === "primera" ? 0 : r === "ultima" ? d : r === "anterior" ? (x - 1 + t.tabs.length) % t.tabs.length : (x + 1) % t.tabs.length;
       c.value = b, await ce(), s.value?.querySelectorAll('[role="tab"]')?.[b]?.focus();
     }
-    function I(y, r) {
+    function M(x, r) {
       if (t.fixedOrder) return;
-      const f = y + r;
-      if (f < 0 || f >= t.tabs.length) return;
-      const b = [...t.tabs], [D] = b.splice(y, 1);
-      D && (b.splice(f, 0, D), c.value = f, a("reorder", b));
+      const d = x + r;
+      if (d < 0 || d >= t.tabs.length) return;
+      const b = [...t.tabs], [D] = b.splice(x, 1);
+      D && (b.splice(d, 0, D), c.value = d, a("reorder", b));
     }
-    function z(y) {
+    function z(x) {
       const r = s.value;
       if (!r) return;
-      const f = y.deltaY || y.deltaX || 0, b = o.value ? r.scrollTop : r.scrollLeft;
-      o.value ? r.scrollTop += f : r.scrollLeft += f, (o.value ? r.scrollTop : r.scrollLeft) !== b && y.preventDefault();
+      const d = x.deltaY || x.deltaX || 0, b = o.value ? r.scrollTop : r.scrollLeft;
+      o.value ? r.scrollTop += d : r.scrollLeft += d, (o.value ? r.scrollTop : r.scrollLeft) !== b && x.preventDefault();
     }
-    function L(y, r) {
-      t.fixedOrder || (u.value = y, r.dataTransfer?.setData("text/plain", String(y)), r.dataTransfer && (r.dataTransfer.effectAllowed = "move"));
+    function L(x, r) {
+      t.fixedOrder || (u.value = x, r.dataTransfer?.setData("text/plain", String(x)), r.dataTransfer && (r.dataTransfer.effectAllowed = "move"));
     }
-    function h(y, r) {
-      t.fixedOrder || u.value === null || (r.preventDefault(), d.value = y, r.dataTransfer && (r.dataTransfer.dropEffect = "move"));
+    function h(x, r) {
+      t.fixedOrder || u.value === null || (r.preventDefault(), f.value = x, r.dataTransfer && (r.dataTransfer.dropEffect = "move"));
     }
-    function k(y) {
+    function w(x) {
       const r = u.value;
-      if (P(), t.fixedOrder || r === null || r === y) return;
-      const f = [...t.tabs], [b] = f.splice(r, 1);
-      b && (f.splice(y, 0, b), a("reorder", f));
+      if (P(), t.fixedOrder || r === null || r === x) return;
+      const d = [...t.tabs], [b] = d.splice(r, 1);
+      b && (d.splice(x, 0, b), a("reorder", d));
     }
     function P() {
-      u.value = null, d.value = null;
+      u.value = null, f.value = null;
     }
-    const F = x(
+    const F = k(
       () => o.value ? "flex h-full flex-col items-center gap-1 overflow-y-auto overflow-x-hidden" : "flex items-center gap-1 overflow-x-auto overflow-y-hidden"
     );
-    return (y, r) => (l(), i("div", {
+    return (x, r) => (l(), i("div", {
       class: p(["flex min-h-0 min-w-0 items-center gap-1", V(o) ? "w-full flex-col" : "h-full"]),
       role: "tablist",
       "aria-orientation": V(o) ? "vertical" : "horizontal"
@@ -811,29 +813,29 @@ const At = ["title", "aria-label"], St = ["title", "aria-label"], Tt = ["title",
         class: p(F.value),
         onWheel: z
       }, [
-        (l(!0), i(Y, null, ae(e.tabs, (f, b) => (l(), i("div", {
-          key: f.id,
+        (l(!0), i(Y, null, ae(e.tabs, (d, b) => (l(), i("div", {
+          key: d.id,
           class: p(["transition-opacity", [
             u.value === b ? "opacity-40" : "",
-            d.value === b && u.value !== b ? "ring-2 ring-secondary rounded-corner" : ""
+            f.value === b && u.value !== b ? "ring-2 ring-secondary rounded-corner" : ""
           ]]),
           draggable: !e.fixedOrder,
           onDragstart: (D) => L(b, D),
           onDragover: (D) => h(b, D),
-          onDrop: A((D) => k(b), ["prevent"]),
+          onDrop: S((D) => w(b), ["prevent"]),
           onDragend: P
         }, [
-          j(Me, {
-            tab: f,
-            active: f.id === e.modelValue,
+          j(Ae, {
+            tab: d,
+            active: d.id === e.modelValue,
             "close-label": e.closeLabel,
             "dirty-label": e.dirtyLabel,
             tabindex: b === c.value ? 0 : -1,
-            onSelect: (D) => v(f.id),
-            onClose: (D) => a("close", f.id),
-            onMenu: (D) => a("menu", { id: f.id, ...D }),
-            onNavegar: (D) => w(b, D),
-            onMover: (D) => I(b, D)
+            onSelect: (D) => v(d.id),
+            onClose: (D) => a("close", d.id),
+            onMenu: (D) => a("menu", { id: d.id, ...D }),
+            onNavegar: (D) => y(b, D),
+            onMover: (D) => M(b, D)
           }, null, 8, ["tab", "active", "close-label", "dirty-label", "tabindex", "onSelect", "onClose", "onMenu", "onNavegar", "onMover"])
         ], 42, Gt))), 128))
       ], 34),
@@ -843,7 +845,7 @@ const At = ["title", "aria-label"], St = ["title", "aria-label"], Tt = ["title",
         class: "flex size-7 shrink-0 items-center justify-center rounded-corner border border-ui-border bg-ui-bg/80 hover:bg-ui-surface/70",
         title: e.newLabel,
         "aria-label": e.newLabel,
-        onClick: r[0] || (r[0] = (f) => a("new"))
+        onClick: r[0] || (r[0] = (d) => a("new"))
       }, [
         j(N, {
           name: "gtk-add",
@@ -863,34 +865,34 @@ const At = ["title", "aria-label"], St = ["title", "aria-label"], Tt = ["title",
   },
   emits: ["update:modelValue", "search", "open", "close"],
   setup(e, { emit: n }) {
-    const t = e, a = n, { vertical: o, posicion: s } = Z(), c = $(!1), u = $(null), d = x(() => o.value || t.collapsed), v = x(() => !d.value || c.value), w = x(() => {
-      if (!d.value) return "";
-      const k = "absolute z-40 w-64 rounded-corner border border-ui-border bg-ui-surface/95 p-1 shadow-lg";
-      return s.value === "left" ? `${k} left-full top-0 ml-1` : s.value === "right" ? `${k} right-full top-0 mr-1` : s.value === "bottom" ? `${k} bottom-full right-0 mb-1` : `${k} top-full right-0 mt-1`;
+    const t = e, a = n, { vertical: o, posicion: s } = Z(), c = $(!1), u = $(null), f = k(() => o.value || t.collapsed), v = k(() => !f.value || c.value), y = k(() => {
+      if (!f.value) return "";
+      const w = "absolute z-40 w-64 rounded-corner border border-ui-border bg-ui-surface/95 p-1 shadow-lg";
+      return s.value === "left" ? `${w} left-full top-0 ml-1` : s.value === "right" ? `${w} right-full top-0 mr-1` : s.value === "bottom" ? `${w} bottom-full right-0 mb-1` : `${w} top-full right-0 mt-1`;
     });
-    async function I() {
+    async function M() {
       c.value = !0, a("open"), await ce(), u.value?.focus();
     }
     function z() {
       c.value && (c.value = !1, a("close"));
     }
-    function L(k) {
-      a("update:modelValue", k.target.value);
+    function L(w) {
+      a("update:modelValue", w.target.value);
     }
     function h() {
       a("search", t.modelValue);
     }
-    return (k, P) => (l(), i("div", Xt, [
-      d.value ? (l(), i("button", {
+    return (w, P) => (l(), i("div", Xt, [
+      f.value ? (l(), i("button", {
         key: 0,
         type: "button",
         class: "flex size-7 items-center justify-center rounded-corner border border-ui-border bg-ui-bg/80 hover:bg-ui-surface/70",
         title: e.label,
         "aria-label": e.label,
         "aria-expanded": c.value,
-        onMousedown: P[0] || (P[0] = A(() => {
+        onMousedown: P[0] || (P[0] = S(() => {
         }, ["prevent"])),
-        onClick: P[1] || (P[1] = (F) => c.value ? z() : I())
+        onClick: P[1] || (P[1] = (F) => c.value ? z() : M())
       }, [
         j(N, {
           name: "system-search",
@@ -900,13 +902,13 @@ const At = ["title", "aria-label"], St = ["title", "aria-label"], Tt = ["title",
       ], 40, Jt)) : g("", !0),
       v.value ? (l(), i("div", {
         key: 1,
-        class: p(w.value)
+        class: p(y.value)
       }, [
         C("input", {
           ref_key: "campo",
           ref: u,
           type: "search",
-          class: p(["w-full rounded-corner border border-ui-border bg-ui-bg/80 px-2 py-1 text-sm outline-none focus:border-ui-border-strong", d.value ? "" : "w-48"]),
+          class: p(["w-full rounded-corner border border-ui-border bg-ui-bg/80 px-2 py-1 text-sm outline-none focus:border-ui-border-strong", f.value ? "" : "w-48"]),
           value: e.modelValue,
           placeholder: e.placeholder || e.label,
           "aria-label": e.label,
@@ -953,7 +955,7 @@ const At = ["title", "aria-label"], St = ["title", "aria-label"], Tt = ["title",
     }, c = (u) => {
       t.stopPropagation && u.stopPropagation(), t.preventDefault && u.preventDefault(), !t.disabled && !t.loading && a("click");
     };
-    return (u, d) => (l(), i("button", {
+    return (u, f) => (l(), i("button", {
       type: t.type,
       onClick: c,
       class: p(["rounded-corner transition-all duration-200 disabled:opacity-50 disabled:cursor-not-allowed flex items-center justify-center gap-2", [
@@ -972,7 +974,7 @@ const At = ["title", "aria-label"], St = ["title", "aria-label"], Tt = ["title",
         alt: t.iconAlt || t.label,
         class: "w-4 h-4"
       }, null, 8, aa)) : g("", !0),
-      t.label ? (l(), i("span", na, S(t.label), 1)) : g("", !0),
+      t.label ? (l(), i("span", na, T(t.label), 1)) : g("", !0),
       t.iconSrc && t.iconRight ? (l(), i("img", {
         key: 3,
         src: t.iconSrc,
@@ -997,7 +999,7 @@ const At = ["title", "aria-label"], St = ["title", "aria-label"], Tt = ["title",
     return (n, t) => (l(), i("div", {
       class: p(["flex flex-col gap-4 p-4 background rounded-corner", e.customClass])
     }, [
-      C("h3", sa, S(e.icon ? `${e.icon} ${e.title}` : e.title), 1),
+      C("h3", sa, T(e.icon ? `${e.icon} ${e.title}` : e.title), 1),
       B(n.$slots, "default", {}, void 0, !0)
     ], 2));
   }
@@ -1046,25 +1048,25 @@ const At = ["title", "aria-label"], St = ["title", "aria-label"], Tt = ["title",
           class: "h-7 w-7 shrink-0"
         }, null, 8, da),
         C("div", fa, [
-          C("div", ma, S(e.title), 1),
-          e.subtitle ? (l(), i("div", ba, S(e.subtitle), 1)) : g("", !0),
-          e.metadata ? (l(), i("div", va, S(e.metadata), 1)) : g("", !0),
+          C("div", ma, T(e.title), 1),
+          e.subtitle ? (l(), i("div", ba, T(e.subtitle), 1)) : g("", !0),
+          e.metadata ? (l(), i("div", va, T(e.metadata), 1)) : g("", !0),
           e.extraInfo && e.extraInfo.length > 0 ? (l(), i("div", pa, [
-            (l(!0), i(Y, null, ae(e.extraInfo, (u, d) => (l(), i("span", { key: d }, S(u), 1))), 128))
+            (l(!0), i(Y, null, ae(e.extraInfo, (u, f) => (l(), i("span", { key: f }, T(u), 1))), 128))
           ])) : g("", !0)
         ])
       ]),
       e.showActionButton ? (l(), i("button", {
         key: 0,
         class: "bg-vsk-primary rounded-vsk px-4 py-2 text-sm font-semibold cursor-pointer hover:opacity-70",
-        onClick: A(a, ["stop"])
-      }, S(e.actionLabel), 1)) : g("", !0),
+        onClick: S(a, ["stop"])
+      }, T(e.actionLabel), 1)) : g("", !0),
       e.showStatusIndicator && e.isConnected ? (l(), i("div", ga)) : g("", !0)
     ], 2));
   }
-}), Ae = /* @__PURE__ */ Symbol("menú de vasak");
+}), Se = /* @__PURE__ */ Symbol("menú de vasak");
 function oe() {
-  const e = xe(Ae, null);
+  const e = ke(Se, null);
   if (e) return e;
   const n = $(!1);
   return {
@@ -1088,9 +1090,9 @@ function oe() {
     }
   };
 }
-let he = 0;
-function Se() {
-  return he += 1, `vsk-menu-${he}`;
+let ye = 0;
+function Te() {
+  return ye += 1, `vsk-menu-${ye}`;
 }
 const ya = { class: "relative inline-block" }, xa = /* @__PURE__ */ E({
   __name: "DropdownMenu",
@@ -1099,39 +1101,39 @@ const ya = { class: "relative inline-block" }, xa = /* @__PURE__ */ E({
   },
   emits: ["update:open"],
   setup(e, { emit: n }) {
-    const t = e, a = n, o = $(!1), s = $(null), c = $(null), u = $("ninguno"), d = Se();
+    const t = e, a = n, o = $(!1), s = $(null), c = $(null), u = $("ninguno"), f = Te();
     let v = null;
-    const w = x({
+    const y = k({
       get: () => t.open ?? o.value,
       set: (h) => {
         t.open === void 0 && (o.value = h), a("update:open", h);
       }
     });
-    X(w, (h) => {
+    X(y, (h) => {
       if (h) {
-        const k = document.activeElement;
-        v = k instanceof HTMLElement ? k : null;
+        const w = document.activeElement;
+        v = w instanceof HTMLElement ? w : null;
       } else
         u.value = "ninguno";
     });
-    function I(h = "ninguno") {
-      u.value = h, w.value = !0;
+    function M(h = "ninguno") {
+      u.value = h, y.value = !0;
     }
     function z(h = {}) {
-      if (w.value = !1, !h.devolverElFoco) return;
-      const k = v ?? s.value;
-      k?.isConnected && k.focus();
+      if (y.value = !1, !h.devolverElFoco) return;
+      const w = v ?? s.value;
+      w?.isConnected && w.focus();
     }
     function L(h = "ninguno") {
-      if (w.value) {
+      if (y.value) {
         z({ devolverElFoco: !0 });
         return;
       }
-      I(h);
+      M(h);
     }
-    return ue(Ae, {
-      abierto: w,
-      idDelMenu: d,
+    return ue(Se, {
+      abierto: y,
+      idDelMenu: f,
       idDeLaEtiqueta: c,
       ponerLaEtiqueta: (h) => {
         c.value = h;
@@ -1141,10 +1143,10 @@ const ya = { class: "relative inline-block" }, xa = /* @__PURE__ */ E({
         s.value = h;
       },
       focoAlAbrir: u,
-      abrir: I,
+      abrir: M,
       cerrar: z,
       alternar: L
-    }), (h, k) => (l(), i("div", ya, [
+    }), (h, w) => (l(), i("div", ya, [
       B(h.$slots, "default")
     ]));
   }
@@ -1160,7 +1162,7 @@ const ya = { class: "relative inline-block" }, xa = /* @__PURE__ */ E({
     sideOffset: { default: 4 }
   },
   setup(e) {
-    const n = e, t = oe(), { idDelMenu: a, idDeLaEtiqueta: o } = t, s = x(() => t.disparador.value), c = x(() => t.abierto.value), u = $(null), d = $({
+    const n = e, t = oe(), { idDelMenu: a, idDeLaEtiqueta: o } = t, s = k(() => t.disparador.value), c = k(() => t.abierto.value), u = $(null), f = $({
       top: 0,
       left: 0,
       techo: null
@@ -1170,28 +1172,28 @@ const ya = { class: "relative inline-block" }, xa = /* @__PURE__ */ E({
       left: "right",
       right: "left"
     };
-    function w(r, f) {
+    function y(r, d) {
       const b = n.sideOffset + q;
       switch (r) {
         case "bottom":
-          return window.innerHeight - f.bottom - b;
+          return window.innerHeight - d.bottom - b;
         case "top":
-          return f.top - b;
+          return d.top - b;
         case "right":
-          return window.innerWidth - f.right - b;
+          return window.innerWidth - d.right - b;
         case "left":
-          return f.left - b;
+          return d.left - b;
       }
     }
-    function I(r, f, b) {
-      return b < f ? f : Math.min(Math.max(r, f), b);
+    function M(r, d, b) {
+      return b < d ? d : Math.min(Math.max(r, d), b);
     }
     function z() {
       if (!s.value || !u.value) return;
-      const r = s.value.getBoundingClientRect(), f = u.value.scrollHeight, b = u.value.offsetWidth, D = n.side === "top" || n.side === "bottom", _ = D ? f : b;
+      const r = s.value.getBoundingClientRect(), d = u.value.scrollHeight, b = u.value.offsetWidth, D = n.side === "top" || n.side === "bottom", _ = D ? d : b;
       let H = n.side;
-      const ee = w(H, r);
-      ee < _ && w(v[H], r) > ee && (H = v[H]);
+      const ee = y(H, r);
+      ee < _ && y(v[H], r) > ee && (H = v[H]);
       let W = 0, R = 0, K = null;
       switch (H) {
         case "bottom": {
@@ -1199,14 +1201,14 @@ const ya = { class: "relative inline-block" }, xa = /* @__PURE__ */ E({
           break;
         }
         case "top": {
-          K = Math.max(w("top", r), 0), W = r.top - n.sideOffset - Math.min(f, K);
+          K = Math.max(y("top", r), 0), W = r.top - n.sideOffset - Math.min(d, K);
           break;
         }
         case "left":
         case "right": {
           R = H === "right" ? r.right + n.sideOffset : r.left - b - n.sideOffset;
           const te = window.innerHeight - 2 * q;
-          W = I(r.top, q, window.innerHeight - Math.min(f, te) - q), K = Math.max(window.innerHeight - W - q, 0);
+          W = M(r.top, q, window.innerHeight - Math.min(d, te) - q), K = Math.max(window.innerHeight - W - q, 0);
           break;
         }
       }
@@ -1222,29 +1224,29 @@ const ya = { class: "relative inline-block" }, xa = /* @__PURE__ */ E({
             R = r.right - b;
             break;
         }
-      R = I(R, q, window.innerWidth - b - q), d.value = { top: W, left: R, techo: K };
+      R = M(R, q, window.innerWidth - b - q), f.value = { top: W, left: R, techo: K };
     }
     function L() {
       return u.value ? Array.from(u.value.querySelectorAll('[role="menuitem"]')) : [];
     }
     function h(r) {
-      const f = L();
-      if (!f.length) return;
-      const b = f.length;
-      f[(r % b + b) % b]?.focus();
+      const d = L();
+      if (!d.length) return;
+      const b = d.length;
+      d[(r % b + b) % b]?.focus();
     }
-    function k() {
+    function w() {
       const r = document.activeElement;
       return r instanceof HTMLElement ? L().indexOf(r) : -1;
     }
     function P(r) {
-      const f = k();
+      const d = w();
       switch (r.key) {
         case "ArrowDown":
-          r.preventDefault(), h(f + 1);
+          r.preventDefault(), h(d + 1);
           break;
         case "ArrowUp":
-          r.preventDefault(), h(f <= 0 ? -1 : f - 1);
+          r.preventDefault(), h(d <= 0 ? -1 : d - 1);
           break;
         case "Home":
           r.preventDefault(), h(0);
@@ -1281,25 +1283,25 @@ const ya = { class: "relative inline-block" }, xa = /* @__PURE__ */ E({
     function F(r) {
       c.value && (r && u.value?.contains(r.target) || z());
     }
-    function y(r) {
-      const f = r.target, b = !!f.closest("[dropdown-content]"), D = !!s.value?.contains(f);
+    function x(r) {
+      const d = r.target, b = !!d.closest("[data-dropdown-content]"), D = !!s.value?.contains(d);
       !b && !D && t.cerrar();
     }
     return Q(() => {
-      document.addEventListener("click", y), window.addEventListener("resize", F), window.addEventListener("scroll", F, !0);
+      document.addEventListener("click", x), window.addEventListener("resize", F), window.addEventListener("scroll", F, !0);
     }), J(() => {
-      document.removeEventListener("click", y), window.removeEventListener("resize", F), window.removeEventListener("scroll", F, !0);
-    }), (r, f) => (l(), G($e, { to: "body" }, [
-      j(Ce, {
+      document.removeEventListener("click", x), window.removeEventListener("resize", F), window.removeEventListener("scroll", F, !0);
+    }), (r, d) => (l(), G(Ce, { to: "body" }, [
+      j(ze, {
         "enter-active-class": "transition-all duration-150 ease-in-out",
         "leave-active-class": "transition-all duration-150 ease-in-out",
         "enter-from-class": "opacity-0 scale-95",
         "leave-to-class": "opacity-0 scale-95",
-        onEnter: f[1] || (f[1] = (b) => b.offsetHeight),
-        onLeave: f[2] || (f[2] = (b) => b.offsetHeight)
+        onEnter: d[1] || (d[1] = (b) => b.offsetHeight),
+        onLeave: d[2] || (d[2] = (b) => b.offsetHeight)
       }, {
         default: U(() => [
-          ye(C("div", ne({
+          xe(C("div", ne({
             ref_key: "contenido",
             ref: u
           }, r.$attrs, {
@@ -1311,16 +1313,16 @@ const ya = { class: "relative inline-block" }, xa = /* @__PURE__ */ E({
             inert: !c.value,
             style: {
               position: "fixed",
-              top: `${d.value.top}px`,
-              left: `${d.value.left}px`,
-              maxHeight: d.value.techo === null ? void 0 : `${d.value.techo}px`,
+              top: `${f.value.top}px`,
+              left: `${f.value.left}px`,
+              maxHeight: f.value.techo === null ? void 0 : `${f.value.techo}px`,
               overflowY: "auto",
               overscrollBehavior: "contain",
               zIndex: 50
             },
-            "dropdown-content": "",
+            "data-dropdown-content": "",
             class: "min-w-30 rounded-corner border border-primary bg-ui-bg/80 shadow-lg focus:outline-none",
-            onClick: f[0] || (f[0] = (b) => b.stopPropagation()),
+            onClick: d[0] || (d[0] = (b) => b.stopPropagation()),
             onKeydown: P
           }), [
             C("div", wa, [
@@ -1358,8 +1360,8 @@ const ya = { class: "relative inline-block" }, xa = /* @__PURE__ */ E({
       ]),
       onClick: s,
       onKeydown: [
-        O(A(s, ["prevent"]), ["enter"]),
-        O(A(s, ["prevent"]), ["space"])
+        O(S(s, ["prevent"]), ["enter"]),
+        O(S(s, ["prevent"]), ["space"])
       ]
     }, [
       B(c.$slots, "default")
@@ -1368,7 +1370,7 @@ const ya = { class: "relative inline-block" }, xa = /* @__PURE__ */ E({
 }), La = /* @__PURE__ */ E({
   __name: "DropdownMenuLabel",
   setup(e) {
-    const n = oe(), t = `${Se()}-titulo`;
+    const n = oe(), t = `${Te()}-titulo`;
     return Q(() => {
       n.ponerLaEtiqueta(t);
     }), J(() => {
@@ -1391,13 +1393,13 @@ const ya = { class: "relative inline-block" }, xa = /* @__PURE__ */ E({
     return (n, t) => (l(), i("div", Ea));
   }
 });
-function Te(e) {
+function Ie(e) {
   const n = e.filter(
     (a) => a.type !== Ye && !(a.type === Qe && typeof a.children == "string" && !a.children.trim())
   );
   if (n.length !== 1) return null;
   const t = n[0];
-  return t.type === Y && Array.isArray(t.children) ? Te(t.children) : t;
+  return t.type === Y && Array.isArray(t.children) ? Ie(t.children) : t;
 }
 function Ba(e) {
   if (e instanceof HTMLElement) return e;
@@ -1421,28 +1423,28 @@ const Ma = E({
     function c() {
       e.disabled || (s(), a.alternar());
     }
-    function u(d) {
+    function u(f) {
       if (!e.disabled)
-        switch (d.key) {
+        switch (f.key) {
           case "Enter":
           case " ":
-            d.preventDefault(), s(), a.alternar("primero");
+            f.preventDefault(), s(), a.alternar("primero");
             break;
           case "ArrowDown":
-            d.preventDefault(), s(), a.abrir("primero");
+            f.preventDefault(), s(), a.abrir("primero");
             break;
           case "ArrowUp":
-            d.preventDefault(), s(), a.abrir("ultimo");
+            f.preventDefault(), s(), a.abrir("ultimo");
             break;
           case "Escape":
-            a.abierto.value && (d.preventDefault(), a.cerrar({ devolverElFoco: !0 }));
+            a.abierto.value && (f.preventDefault(), a.cerrar({ devolverElFoco: !0 }));
             break;
         }
     }
     return () => {
-      const d = {
-        ref: (w) => {
-          o.value = w, s();
+      const f = {
+        ref: (y) => {
+          o.value = y, s();
         },
         "aria-haspopup": "menu",
         "aria-expanded": a.abierto.value ? "true" : "false",
@@ -1454,12 +1456,12 @@ const Ma = E({
         onKeydown: u
       }, v = n.default?.() ?? [];
       if (e.asChild) {
-        const w = Te(v);
-        if (w) return Ke(w, { ...t, ...d });
+        const y = Ie(v);
+        if (y) return Ke(y, { ...t, ...f });
       }
       return Ge(
         "div",
-        { ...t, class: ["dropdown-menu-trigger inline-block", t.class], ...d },
+        { ...t, class: ["dropdown-menu-trigger inline-block", t.class], ...f },
         v
       );
     };
@@ -1480,7 +1482,7 @@ const Ma = E({
         key: 0,
         for: e.htmlFor,
         class: p(["text-sm font-medium text-primary dark:text-primary-dark", e.labelClass])
-      }, S(e.label), 11, Aa)) : g("", !0),
+      }, T(e.label), 11, Aa)) : g("", !0),
       B(n.$slots, "default", {}, void 0, !0)
     ], 2));
   }
@@ -1526,17 +1528,17 @@ const Ma = E({
   },
   emits: ["update:modelValue", "buttonClick"],
   setup(e, { emit: n }) {
-    const t = e, a = n, o = x(() => {
+    const t = e, a = n, o = k(() => {
       if (t.max <= t.min) return 0;
-      const d = t.max - t.min, v = t.modelValue - t.min;
-      return Math.round(v / d * 100);
-    }), s = x(() => t.getPercentageClass ? t.getPercentageClass(o.value) : ""), c = (d) => {
-      const v = d.target;
+      const f = t.max - t.min, v = t.modelValue - t.min;
+      return Math.round(v / f * 100);
+    }), s = k(() => t.getPercentageClass ? t.getPercentageClass(o.value) : ""), c = (f) => {
+      const v = f.target;
       a("update:modelValue", Number(v.value));
     }, u = () => {
       a("buttonClick");
     };
-    return (d, v) => (l(), i("div", Va, [
+    return (f, v) => (l(), i("div", Va, [
       e.showButton ? (l(), i("button", {
         key: 0,
         onClick: u,
@@ -1565,7 +1567,7 @@ const Ma = E({
       }, null, 40, Fa),
       C("span", {
         class: p(["w-12 text-right transition-all duration-200 font-medium", s.value])
-      }, S(o.value) + "% ", 3)
+      }, T(o.value) + "% ", 3)
     ]));
   }
 }), Ha = ["disabled"], Wa = /* @__PURE__ */ E({
@@ -1676,7 +1678,7 @@ const Ma = E({
         alt: e.alt,
         class: p(["m-auto h-5.5 w-auto transition-all duration-300", e.iconClass])
       }, null, 10, Ya),
-      e.badge !== null && e.badge > 0 ? (l(), i("div", Qa, S(e.badge), 1)) : g("", !0),
+      e.badge !== null && e.badge > 0 ? (l(), i("div", Qa, T(e.badge), 1)) : g("", !0),
       e.showCustomTooltip && e.customTooltipText ? (l(), i("div", {
         key: 1,
         class: p(["absolute top-1 left-1/2 transform -translate-x-1/2 text-xs font-semibold p-1 rounded-corner transition-all duration-300 pointer-events-none background", [
@@ -1686,21 +1688,21 @@ const Ma = E({
             "opacity-100 translate-y-0": a.value
           }
         ]])
-      }, S(e.customTooltipText), 3)) : g("", !0),
+      }, T(e.customTooltipText), 3)) : g("", !0),
       B(s.$slots, "default")
     ], 42, Ga));
   }
 }), Ja = [
   yt,
+  Ee,
   Le,
-  ze,
   Ct,
   N,
   jt,
+  Me,
   Be,
-  De,
   Qt,
-  Me,
+  Ae,
   _t,
   ia,
   ua,
@@ -1726,9 +1728,9 @@ const Ma = E({
 };
 export {
   ia as ActionButton,
-  Be as AppBar,
+  Me as AppBar,
   _t as BarSearch,
-  Ae as CLAVE_DEL_MENU,
+  Se as CLAVE_DEL_MENU,
   de as CLAVE_DE_LA_BARRA,
   ua as ConfigSection,
   ha as DeviceCard,
@@ -1744,16 +1746,16 @@ export {
   zt as POSICIONES,
   Ct as SelectField,
   yt as SideBar,
-  Le as SideButton,
-  ze as SideGroup,
+  Ee as SideButton,
+  Le as SideGroup,
   Ra as SliderControl,
   Wa as SwitchToggle,
   Qt as TabBar,
-  Me as TabItem,
+  Ae as TabItem,
   N as ThemeIcon,
   Ka as ToggleControl,
   Xa as TrayIconButton,
-  De as WindowControls,
+  Be as WindowControls,
   jt as WindowFrame,
   an as default,
   Lt as esPosicion,