@vasakgroup/vue-libvasak 0.4.1 → 0.6.0

package/dist/vue-libvasak.es.js

@@ -1,31 +1,31 @@
-import { ref as S, onMounted as Q, onUnmounted as ke, watch as Z, defineComponent as L, toRef as ae, computed as y, createElementBlock as n, unref as O, openBlock as l, normalizeStyle as H, createCommentVNode as f, createElementVNode as h, createVNode as V, toDisplayString as w, normalizeClass as d, renderSlot as T, createBlock as F, onBeforeUnmount as _, Fragment as X, renderList as Y, withCtx as W, mergeModels as $e, useAttrs as we, useId as Ce, useModel as ze, withDirectives as Le, mergeProps as Be, isRef as Se, vModelSelect as Ae, inject as Te, provide as ie, createTextVNode as De, createSlots as Ee, withModifiers as z, withKeys as D, Teleport as Me, Transition as Ie, nextTick as re } from "vue";
-import { listen as Ve } from "@tauri-apps/api/event";
-import { getSymbolSource as je, getIconSource as Oe } from "@vasakgroup/plugin-vicons";
-import { getCurrentWindow as Pe } from "@tauri-apps/api/window";
-function Ne(e, s) {
-  const t = S("");
-  let a = null, o = !1, i = 0;
-  async function c() {
-    const u = ++i, m = e.value;
-    if (!m) {
+import { ref as w, onMounted as W, onUnmounted as Oe, watch as K, defineComponent as z, toRef as se, computed as x, createElementBlock as i, unref as P, openBlock as l, normalizeStyle as ee, createCommentVNode as g, createElementVNode as C, createVNode as F, toDisplayString as I, normalizeClass as p, renderSlot as A, createBlock as q, onBeforeUnmount as G, Fragment as U, renderList as Y, withCtx as R, mergeModels as je, useAttrs as Ve, useId as Pe, useModel as Fe, withDirectives as me, mergeProps as J, isRef as Ne, vModelSelect as Re, inject as be, getCurrentInstance as ve, provide as ae, createTextVNode as qe, toHandlers as pe, createSlots as He, withModifiers as T, withKeys as V, Teleport as ge, Transition as ye, nextTick as ne, vShow as Ue, cloneVNode as We, h as Ke, Comment as Ge, Text as Xe } from "vue";
+import { listen as Ye } from "@tauri-apps/api/event";
+import { getSymbolSource as Je, getIconSource as Qe } from "@vasakgroup/plugin-vicons";
+import { getCurrentWindow as Ze } from "@tauri-apps/api/window";
+function _e(e, n) {
+  const t = w("");
+  let a = null, o = !1, s = 0;
+  async function u() {
+    const r = ++s, c = e.value;
+    if (!c) {
       t.value = "";
       return;
     }
-    const v = s.value === "symbol" ? await je(m) : await Oe(m);
-    u === i && (t.value = v);
+    const b = n.value === "symbol" ? await Je(c) : await Qe(c);
+    r === s && (t.value = b);
   }
-  return Q(async () => {
-    const u = await Ve("vicons:theme-changed", c);
+  return W(async () => {
+    const r = await Ye("vicons:theme-changed", u);
     if (o) {
-      u();
+      r();
       return;
     }
-    a = u, await c();
-  }), ke(() => {
+    a = r, await u();
+  }), Oe(() => {
     o = !0, a?.();
-  }), Z(e, c), t;
+  }), K(e, u), t;
 }
-const Re = ["src", "alt"], M = /* @__PURE__ */ L({
+const et = ["src", "alt"], N = /* @__PURE__ */ z({
   __name: "ThemeIcon",
   props: {
     name: {},
@@ -34,23 +34,23 @@ const Re = ["src", "alt"], M = /* @__PURE__ */ L({
     alt: { default: "" }
   },
   setup(e) {
-    const s = e, t = Ne(ae(s, "name"), ae(s, "type")), a = y(() => `${s.size}px`);
-    return (o, i) => O(t) ? (l(), n("img", {
+    const n = e, t = _e(se(n, "name"), se(n, "type")), a = x(() => `${n.size}px`);
+    return (o, s) => P(t) ? (l(), i("img", {
       key: 0,
-      src: O(t),
+      src: P(t),
       alt: e.alt,
-      style: H({ width: a.value, height: a.value }),
+      style: ee({ width: a.value, height: a.value }),
       class: "shrink-0 object-contain"
-    }, null, 12, Re)) : (l(), n("span", {
+    }, null, 12, et)) : (l(), i("span", {
       key: 1,
-      style: H({ width: a.value, height: a.value }),
+      style: ee({ width: a.value, height: a.value }),
       class: "shrink-0"
     }, null, 4));
   }
-}), Fe = { class: "flex flex-col gap-2" }, We = ["aria-expanded"], Ue = {
+}), tt = { class: "flex flex-col gap-2" }, at = ["aria-expanded"], nt = {
   key: 1,
   class: "flex flex-col gap-1"
-}, ue = /* @__PURE__ */ L({
+}, he = /* @__PURE__ */ z({
   __name: "SideGroup",
   props: {
     title: {},
@@ -58,40 +58,40 @@ const Re = ["src", "alt"], M = /* @__PURE__ */ L({
     defaultOpen: { type: Boolean, default: !0 }
   },
   setup(e) {
-    const s = e, t = S(s.defaultOpen);
-    return Z(
-      () => s.collapsed,
+    const n = e, t = w(n.defaultOpen);
+    return K(
+      () => n.collapsed,
       (a) => {
         a && (t.value = !0);
       }
-    ), (a, o) => (l(), n("section", Fe, [
-      e.collapsed ? f("", !0) : (l(), n("button", {
+    ), (a, o) => (l(), i("section", tt, [
+      e.collapsed ? g("", !0) : (l(), i("button", {
         key: 0,
         type: "button",
         class: "group flex w-full items-center justify-between rounded-corner px-2 py-1 text-tx-muted text-xs uppercase tracking-[0.08em] hover:bg-ui-surface/60",
         "aria-expanded": t.value,
-        onClick: o[0] || (o[0] = (i) => t.value = !t.value)
+        onClick: o[0] || (o[0] = (s) => t.value = !t.value)
       }, [
-        h("span", null, w(e.title), 1),
-        V(M, {
+        C("span", null, I(e.title), 1),
+        F(N, {
           name: "pan-down-symbolic",
           type: "symbol",
           size: 12,
-          class: d(["transition-transform duration-200", t.value ? "" : "-rotate-90"])
+          class: p(["transition-transform duration-200", t.value ? "" : "-rotate-90"])
         }, null, 8, ["class"])
-      ], 8, We)),
-      t.value || e.collapsed ? (l(), n("div", Ue, [
-        T(a.$slots, "default")
-      ])) : f("", !0)
+      ], 8, at)),
+      t.value || e.collapsed ? (l(), i("div", nt, [
+        A(a.$slots, "default")
+      ])) : g("", !0)
     ]));
   }
-}), Ge = ["title", "aria-label", "disabled", "aria-current"], Xe = { key: 1 }, Ye = {
+}), lt = ["title", "aria-label", "disabled", "aria-current"], ot = { key: 1 }, it = {
   key: 0,
   class: "min-w-0 flex-1 truncate font-medium"
-}, Ke = {
+}, st = {
   key: 1,
   class: "rounded-corner bg-ui-surface px-2 py-0.5 font-semibold text-tx-muted text-xs"
-}, ce = /* @__PURE__ */ L({
+}, xe = /* @__PURE__ */ z({
   __name: "SideButton",
   props: {
     label: {},
@@ -103,49 +103,49 @@ const Re = ["src", "alt"], M = /* @__PURE__ */ L({
   },
   emits: ["click"],
   setup(e) {
-    return (s, t) => (l(), n("button", {
+    return (n, t) => (l(), i("button", {
       type: "button",
       title: e.collapsed ? e.label : void 0,
       "aria-label": e.collapsed ? e.label : void 0,
       disabled: e.disabled,
       "aria-current": e.active ? "page" : void 0,
-      class: d(["group relative flex w-full items-center gap-3 rounded-corner border px-3 py-2 text-left text-sm transition-all duration-200", [
+      class: p(["group relative flex w-full items-center gap-3 rounded-corner border px-3 py-2 text-left text-sm transition-all duration-200", [
         e.active ? "border-secondary bg-primary/15 text-tx-main shadow-sm" : "border-transparent bg-transparent hover:border-ui-border hover:bg-ui-surface/70",
         e.disabled ? "cursor-not-allowed opacity-60" : "cursor-pointer",
         e.collapsed ? "justify-center px-2" : ""
       ]]),
-      onClick: t[0] || (t[0] = (a) => s.$emit("click"))
+      onClick: t[0] || (t[0] = (a) => n.$emit("click"))
     }, [
-      h("span", {
-        class: d(["flex h-8 w-8 shrink-0 items-center justify-center rounded-corner font-semibold text-xs uppercase tracking-wide", e.active ? "border-secondary bg-primary/20" : ""]),
+      C("span", {
+        class: p(["flex h-8 w-8 shrink-0 items-center justify-center rounded-corner font-semibold text-xs uppercase tracking-wide", e.active ? "border-secondary bg-primary/20" : ""]),
         "aria-hidden": "true"
       }, [
-        e.icon ? (l(), F(M, {
+        e.icon ? (l(), q(N, {
           key: 0,
           name: e.icon,
           size: 20
-        }, null, 8, ["name"])) : (l(), n("span", Xe, w(e.label.charAt(0).toUpperCase()), 1))
+        }, null, 8, ["name"])) : (l(), i("span", ot, I(e.label.charAt(0).toUpperCase()), 1))
       ], 2),
-      e.collapsed ? f("", !0) : (l(), n("span", Ye, w(e.label), 1)),
-      !e.collapsed && e.badge !== "" ? (l(), n("span", Ke, w(e.badge), 1)) : f("", !0)
-    ], 10, Ge));
+      e.collapsed ? g("", !0) : (l(), i("span", it, I(e.label), 1)),
+      !e.collapsed && e.badge !== "" ? (l(), i("span", st, I(e.badge), 1)) : g("", !0)
+    ], 10, lt));
   }
-}), qe = {
+}), rt = {
   key: 0,
   class: "flex flex-col gap-2 border-ui-border border-b p-2"
-}, He = { class: "flex items-center gap-2" }, Je = ["aria-label", "aria-expanded"], Qe = {
+}, ut = { class: "flex items-center gap-2" }, ct = ["aria-label", "aria-expanded"], dt = {
   key: 0,
   class: "min-w-0 flex-1"
-}, Ze = {
+}, ft = {
   key: 0,
   class: "truncate font-semibold text-sm"
-}, _e = {
+}, mt = {
   key: 1,
   class: "truncate text-tx-muted text-xs"
-}, et = { key: 0 }, tt = {
+}, bt = { key: 0 }, vt = {
   key: 1,
   class: "flex border-ui-border border-b p-2"
-}, at = ["aria-label", "aria-expanded"], lt = { class: "flex min-h-0 flex-1 flex-col gap-3 overflow-y-auto p-2" }, le = "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", ne = 767, nt = /* @__PURE__ */ L({
+}, pt = ["aria-label", "aria-expanded"], gt = { class: "flex min-h-0 flex-1 flex-col gap-3 overflow-y-auto p-2" }, re = "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", ue = 767, yt = /* @__PURE__ */ z({
   __name: "SideBar",
   props: {
     title: { default: "" },
@@ -157,101 +157,101 @@ const Re = ["src", "alt"], M = /* @__PURE__ */ L({
     expandLabel: { default: "Expand" }
   },
   emits: ["update:modelValue", "update:collapsed", "change"],
-  setup(e, { expose: s, emit: t }) {
-    const a = e, o = t, i = S(a.collapsed ?? !1), c = S(!1);
-    let u = null, m = null;
-    const v = y(() => c.value || i.value), I = y(() => !!(a.title || a.subtitle));
-    y(() => a.categories.length > 0);
-    function N() {
+  setup(e, { expose: n, emit: t }) {
+    const a = e, o = t, s = w(a.collapsed ?? !1), u = w(!1);
+    let r = null, c = null;
+    const b = x(() => u.value || s.value), $ = x(() => !!(a.title || a.subtitle));
+    x(() => a.categories.length > 0);
+    function M() {
       return document.documentElement?.clientWidth || window.innerWidth;
     }
-    function A() {
-      c.value = N() <= ne;
+    function L() {
+      u.value = M() <= ue;
     }
     function E() {
-      i.value = !i.value, o("update:collapsed", i.value);
+      s.value = !s.value, o("update:collapsed", s.value);
     }
-    function P(k) {
-      o("update:modelValue", k), o("change", k);
+    function y(h) {
+      o("update:modelValue", h), o("change", h);
     }
-    return Z(
+    return K(
       () => a.collapsed,
-      (k) => {
-        k !== void 0 && (i.value = k);
+      (h) => {
+        h !== void 0 && (s.value = h);
       }
-    ), Q(() => {
-      u = window.matchMedia(`(max-width: ${ne}px)`), A(), u.addEventListener("change", A), window.addEventListener("resize", A), typeof ResizeObserver < "u" && document.documentElement && (m = new ResizeObserver(A), m.observe(document.documentElement));
-    }), _(() => {
-      u?.removeEventListener("change", A), window.removeEventListener("resize", A), m?.disconnect(), m = null;
-    }), s({ collapsed: v }), (k, j) => (l(), n("aside", {
-      class: d(["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(() => {
+      r = window.matchMedia(`(max-width: ${ue}px)`), L(), r.addEventListener("change", L), window.addEventListener("resize", L), typeof ResizeObserver < "u" && document.documentElement && (c = new ResizeObserver(L), c.observe(document.documentElement));
+    }), G(() => {
+      r?.removeEventListener("change", L), window.removeEventListener("resize", L), c?.disconnect(), c = null;
+    }), n({ collapsed: b }), (h, m) => (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]", b.value ? "md:w-[84px]" : "md:w-72"]])
     }, [
-      I.value || k.$slots.header ? (l(), n("header", qe, [
-        h("div", He, [
-          h("button", {
+      $.value || h.$slots.header ? (l(), i("header", rt, [
+        C("div", ut, [
+          C("button", {
             type: "button",
-            class: d(le),
-            "aria-label": v.value ? e.expandLabel : e.collapseLabel,
-            "aria-expanded": !v.value,
+            class: p(re),
+            "aria-label": b.value ? e.expandLabel : e.collapseLabel,
+            "aria-expanded": !b.value,
             onClick: E
           }, [
-            V(M, {
-              name: v.value ? "pan-end-symbolic" : "pan-start-symbolic",
+            F(N, {
+              name: b.value ? "pan-end-symbolic" : "pan-start-symbolic",
               type: "symbol",
               size: 16
             }, null, 8, ["name"])
-          ], 8, Je),
-          I.value && !v.value ? (l(), n("div", Qe, [
-            e.title ? (l(), n("p", Ze, w(e.title), 1)) : f("", !0),
-            e.subtitle ? (l(), n("p", _e, w(e.subtitle), 1)) : f("", !0)
-          ])) : f("", !0)
+          ], 8, ct),
+          $.value && !b.value ? (l(), i("div", dt, [
+            e.title ? (l(), i("p", ft, I(e.title), 1)) : g("", !0),
+            e.subtitle ? (l(), i("p", mt, I(e.subtitle), 1)) : g("", !0)
+          ])) : g("", !0)
         ]),
-        k.$slots.header && !v.value ? (l(), n("div", et, [
-          T(k.$slots, "header", { collapsed: v.value })
-        ])) : f("", !0)
-      ])) : (l(), n("div", tt, [
-        h("button", {
+        h.$slots.header && !b.value ? (l(), i("div", bt, [
+          A(h.$slots, "header", { collapsed: b.value })
+        ])) : g("", !0)
+      ])) : (l(), i("div", vt, [
+        C("button", {
           type: "button",
-          class: d(le),
-          "aria-label": v.value ? e.expandLabel : e.collapseLabel,
-          "aria-expanded": !v.value,
+          class: p(re),
+          "aria-label": b.value ? e.expandLabel : e.collapseLabel,
+          "aria-expanded": !b.value,
           onClick: E
         }, [
-          V(M, {
-            name: v.value ? "pan-end-symbolic" : "pan-start-symbolic",
+          F(N, {
+            name: b.value ? "pan-end-symbolic" : "pan-start-symbolic",
             type: "symbol",
             size: 16
           }, null, 8, ["name"])
-        ], 8, at)
+        ], 8, pt)
       ])),
-      h("div", lt, [
-        (l(!0), n(X, null, Y(e.categories, (R) => (l(), F(ue, {
-          key: R.id,
-          title: R.title,
-          collapsed: v.value
+      C("div", gt, [
+        (l(!0), i(U, null, Y(e.categories, (k) => (l(), q(he, {
+          key: k.id,
+          title: k.title,
+          collapsed: b.value
         }, {
-          default: W(() => [
-            (l(!0), n(X, null, Y(R.items, (b) => (l(), F(ce, {
-              key: b.id,
-              label: b.label,
-              icon: b.icon,
-              badge: b.badge,
-              disabled: b.disabled,
-              collapsed: v.value,
-              active: e.modelValue === b.id,
-              onClick: (g) => P(b.id)
+          default: R(() => [
+            (l(!0), i(U, null, Y(k.items, (d) => (l(), q(xe, {
+              key: d.id,
+              label: d.label,
+              icon: d.icon,
+              badge: d.badge,
+              disabled: d.disabled,
+              collapsed: b.value,
+              active: e.modelValue === d.id,
+              onClick: (v) => y(d.id)
             }, null, 8, ["label", "icon", "badge", "disabled", "collapsed", "active", "onClick"]))), 128))
           ]),
           _: 2
         }, 1032, ["title", "collapsed"]))), 128)),
-        T(k.$slots, "default", { collapsed: v.value })
+        A(h.$slots, "default", { collapsed: b.value })
       ])
     ], 2));
   }
-}), ot = { class: "flex min-w-0 flex-col gap-1" }, st = ["for"], it = { class: "relative flex min-w-0 items-center" }, rt = ["id"], ut = /* @__PURE__ */ L({
+}), ht = { class: "flex min-w-0 flex-col gap-1" }, xt = ["for"], kt = { class: "relative flex min-w-0 items-center" }, wt = ["id"], $t = /* @__PURE__ */ z({
   inheritAttrs: !1,
   __name: "SelectField",
-  props: /* @__PURE__ */ $e({
+  props: /* @__PURE__ */ je({
     label: {}
   }, {
     modelValue: {
@@ -261,28 +261,28 @@ const Re = ["src", "alt"], M = /* @__PURE__ */ L({
   }),
   emits: ["update:modelValue"],
   setup(e) {
-    const s = e, t = we(), a = Ce(), o = y(() => t.id ?? a), [i, c] = ze(e, "modelValue", {
-      set(u) {
-        return c.number ? Number(u) : u;
+    const n = e, t = Ve(), a = Pe(), o = x(() => t.id ?? a), [s, u] = Fe(e, "modelValue", {
+      set(r) {
+        return u.number ? Number(r) : r;
       }
     });
-    return (u, m) => (l(), n("div", ot, [
-      s.label ? (l(), n("label", {
+    return (r, c) => (l(), i("div", ht, [
+      n.label ? (l(), i("label", {
         key: 0,
         for: o.value,
         class: "text-tx-muted text-xs"
-      }, w(s.label), 9, st)) : f("", !0),
-      h("div", it, [
-        Le(h("select", Be({
+      }, I(n.label), 9, xt)) : g("", !0),
+      C("div", kt, [
+        me(C("select", J({
           id: o.value,
-          "onUpdate:modelValue": m[0] || (m[0] = (v) => Se(i) ? i.value = v : null),
+          "onUpdate:modelValue": c[0] || (c[0] = (b) => Ne(s) ? s.value = b : 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"
-        }, O(t)), [
-          T(u.$slots, "default")
-        ], 16, rt), [
-          [Ae, O(i)]
+        }, P(t)), [
+          A(r.$slots, "default")
+        ], 16, wt), [
+          [Re, P(s)]
         ]),
-        V(M, {
+        F(N, {
           name: "pan-down-symbolic",
           type: "symbol",
           size: 14,
@@ -291,119 +291,153 @@ const Re = ["src", "alt"], M = /* @__PURE__ */ L({
       ])
     ]));
   }
-}), ee = /* @__PURE__ */ Symbol("barra de vasak");
-function J(e) {
+}), le = /* @__PURE__ */ Symbol("barra de vasak");
+function te(e) {
   return e === "left" || e === "right" ? "vertical" : "horizontal";
 }
-const ct = ["top", "bottom", "left", "right"];
-function dt(e) {
-  return typeof e == "string" && ct.includes(e);
+const Ct = ["top", "bottom", "left", "right"];
+function zt(e) {
+  return typeof e == "string" && Ct.includes(e);
 }
-function G() {
-  const e = Te(ee, null);
+function X() {
+  const e = be(le, null);
   if (e) return e;
-  const s = S("top");
+  const n = w("top");
   return {
-    posicion: s,
-    orientacion: y(() => J(s.value)),
-    vertical: y(() => J(s.value) === "vertical")
+    posicion: n,
+    orientacion: x(() => te(n.value)),
+    vertical: x(() => te(n.value) === "vertical")
   };
 }
-const ft = "window", mt = "barPosition";
-function bt(e) {
-  const t = e?.[ft]?.[mt];
-  return dt(t) ? t : null;
+const oe = ["minimize", "maximize", "close"], Lt = "window", Et = "barPosition";
+function Dt(e) {
+  const t = e?.[Lt]?.[Et];
+  return zt(t) ? t : null;
 }
-function vt(e = "top") {
-  const s = S(e);
+function Bt(e = "top") {
+  const n = w(e);
   let t = null, a = !1;
   async function o() {
     try {
-      const { readConfig: i } = await import("@vasakgroup/plugin-config-manager"), c = await i();
-      s.value = bt(c) ?? e;
+      const { readConfig: s } = await import("@vasakgroup/plugin-config-manager"), u = await s();
+      n.value = Dt(u) ?? e;
     } catch {
     }
   }
-  return Q(async () => {
+  return W(async () => {
     await o();
     try {
-      const { listen: i } = await import("@tauri-apps/api/event"), c = await i("config-changed", () => {
+      const { listen: s } = await import("@tauri-apps/api/event"), u = await s("config-changed", () => {
         o();
       });
       if (a) {
-        c();
+        u();
         return;
       }
-      t = c;
+      t = u;
     } catch {
     }
-  }), _(() => {
+  }), G(() => {
     a = !0, t?.(), t = null;
-  }), s;
+  }), n;
 }
-const gt = ["title", "aria-label"], yt = ["title", "aria-label"], ht = ["title", "aria-label"], q = "flex items-center justify-center rounded-corner border border-ui-border bg-ui-bg/80 p-1 transition-colors", de = /* @__PURE__ */ L({
+function ke(e) {
+  const n = ve(), 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"], Mt = ["title", "aria-label"], St = ["title", "aria-label"], _ = "flex items-center justify-center rounded-corner border border-ui-border bg-ui-bg/80 p-1 transition-colors", we = /* @__PURE__ */ z({
   __name: "WindowControls",
   props: {
+    controls: { default: () => oe },
     minimizeLabel: { default: "Minimize" },
     maximizeLabel: { default: "Maximize" },
     closeLabel: { default: "Close" }
   },
-  setup(e) {
-    const { vertical: s } = G();
-    function t() {
-      return Pe();
+  emits: ["minimize", "maximize", "close"],
+  setup(e, { emit: n }) {
+    const t = e, a = n, { vertical: o } = X(), s = x(() => ({
+      minimize: t.controls.includes("minimize"),
+      maximize: t.controls.includes("maximize"),
+      close: t.controls.includes("close")
+    }));
+    function u() {
+      return Ze();
+    }
+    const r = ve();
+    function c(L) {
+      return !!r?.vnode.props?.[`on${L}`];
+    }
+    function b() {
+      if (c("Minimize")) return a("minimize");
+      u().minimize();
     }
-    return (a, o) => (l(), n("div", {
-      class: d(["flex shrink-0 gap-1", O(s) ? "flex-col" : ""]),
+    function $() {
+      if (c("Maximize")) return a("maximize");
+      u().toggleMaximize();
+    }
+    function M() {
+      if (c("Close")) return a("close");
+      u().close();
+    }
+    return (L, E) => e.controls.length ? (l(), i("div", {
+      key: 0,
+      class: p(["flex shrink-0 gap-1", P(o) ? "flex-col" : ""]),
       "data-tauri-drag-region": ""
     }, [
-      h("button", {
+      s.value.minimize ? (l(), i("button", {
+        key: 0,
         type: "button",
-        class: d([q, "hover:bg-status-success"]),
+        class: p([_, "hover:bg-status-success"]),
         title: e.minimizeLabel,
         "aria-label": e.minimizeLabel,
-        onClick: o[0] || (o[0] = (i) => t().minimize())
+        onClick: E[0] || (E[0] = (y) => b())
       }, [
-        V(M, {
+        F(N, {
           name: "window-minimize",
           size: 24
         })
-      ], 10, gt),
-      h("button", {
+      ], 10, At)) : g("", !0),
+      s.value.maximize ? (l(), i("button", {
+        key: 1,
         type: "button",
-        class: d([q, "hover:bg-status-warning"]),
+        class: p([_, "hover:bg-status-warning"]),
         title: e.maximizeLabel,
         "aria-label": e.maximizeLabel,
-        onClick: o[1] || (o[1] = (i) => t().toggleMaximize())
+        onClick: E[1] || (E[1] = (y) => $())
       }, [
-        V(M, {
+        F(N, {
           name: "window-maximize",
           size: 24
         })
-      ], 10, yt),
-      h("button", {
+      ], 10, Mt)) : g("", !0),
+      s.value.close ? (l(), i("button", {
+        key: 2,
         type: "button",
-        class: d([q, "hover:bg-status-error"]),
+        class: p([_, "hover:bg-status-error"]),
         title: e.closeLabel,
         "aria-label": e.closeLabel,
-        onClick: o[2] || (o[2] = (i) => t().close())
+        onClick: E[2] || (E[2] = (y) => M())
       }, [
-        V(M, {
+        F(N, {
           name: "window-close",
           size: 24
         })
-      ], 10, ht)
-    ], 2));
+      ], 10, St)) : g("", !0)
+    ], 2)) : g("", !0);
   }
-}), pt = {
+}), Tt = {
   key: 0,
   class: "flex shrink-0 items-center",
   "data-tauri-drag-region": ""
-}, xt = {
+}, It = {
   key: 1,
   class: "min-w-0 shrink truncate text-sm",
   "data-tauri-drag-region": ""
-}, fe = /* @__PURE__ */ L({
+}, $e = /* @__PURE__ */ z({
   __name: "AppBar",
   props: {
     position: { default: null },
@@ -411,47 +445,58 @@ const gt = ["title", "aria-label"], yt = ["title", "aria-label"], ht = ["title",
     minimizeLabel: { default: "Minimize" },
     maximizeLabel: { default: "Maximize" },
     closeLabel: { default: "Close" },
-    hideControls: { type: Boolean, default: !1 }
+    controls: { default: () => oe }
   },
+  emits: ["minimize", "maximize", "close"],
   setup(e) {
-    const s = e, t = G(), a = y(() => s.position ?? t.posicion.value), o = y(() => a.value === "left" || a.value === "right");
-    return ie(ee, {
+    const n = e, t = X(), a = x(() => n.position ?? t.posicion.value), o = x(() => a.value === "left" || a.value === "right");
+    return ae(le, {
       posicion: a,
-      orientacion: y(() => o.value ? "vertical" : "horizontal"),
+      orientacion: x(() => o.value ? "vertical" : "horizontal"),
       vertical: o
-    }), (i, c) => (l(), n("div", {
-      class: d(["flex shrink-0 items-center gap-2 p-1 font-title", o.value ? "h-full flex-col" : "w-full"]),
+    }), (s, u) => (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"]),
       "data-tauri-drag-region": ""
     }, [
-      i.$slots.identidad ? (l(), n("div", pt, [
-        T(i.$slots, "identidad")
-      ])) : f("", !0),
-      (i.$slots.titulo || e.title) && !o.value ? (l(), n("p", xt, [
-        T(i.$slots, "titulo", {}, () => [
-          De(w(e.title), 1)
+      s.$slots.identidad ? (l(), i("div", Tt, [
+        A(s.$slots, "identidad")
+      ])) : g("", !0),
+      (s.$slots.titulo || e.title) && !o.value ? (l(), i("p", It, [
+        A(s.$slots, "titulo", {}, () => [
+          qe(I(e.title), 1)
         ])
-      ])) : f("", !0),
-      h("div", {
-        class: d(["flex min-h-0 min-w-0 flex-1 items-center gap-2 overflow-auto", o.value ? "flex-col" : ""]),
+      ])) : g("", !0),
+      C("div", {
+        class: p(["flex min-h-0 min-w-0 flex-1 items-center gap-2 overflow-auto", o.value ? "flex-col" : ""]),
         "data-tauri-drag-region": ""
       }, [
-        T(i.$slots, "default")
+        A(s.$slots, "default")
       ], 2),
-      i.$slots.acciones ? (l(), n("div", {
+      s.$slots.acciones ? (l(), i("div", {
         key: 2,
-        class: d(["flex shrink-0 items-center gap-1", o.value ? "flex-col" : ""])
+        class: p(["flex shrink-0 items-center gap-1", o.value ? "flex-col" : ""])
       }, [
-        T(i.$slots, "acciones")
-      ], 2)) : f("", !0),
-      e.hideControls ? f("", !0) : (l(), F(de, {
-        key: 3,
+        A(s.$slots, "acciones")
+      ], 2)) : g("", !0),
+      F(we, J({
+        controls: e.controls,
         "minimize-label": e.minimizeLabel,
         "maximize-label": e.maximizeLabel,
         "close-label": e.closeLabel
-      }, null, 8, ["minimize-label", "maximize-label", "close-label"]))
+      }, pe(P(ke)(["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"])
+      }, [
+        C("div", {
+          class: p(["pointer-events-auto flex items-center gap-2", o.value ? "flex-col" : ""])
+        }, [
+          A(s.$slots, "centro")
+        ], 2)
+      ], 2)) : g("", !0)
     ], 2));
   }
-}), kt = { class: "flex min-h-0 min-w-0 flex-1" }, $t = /* @__PURE__ */ L({
+}), Ot = { class: "flex min-h-0 min-w-0 flex-1" }, jt = /* @__PURE__ */ z({
   __name: "WindowFrame",
   props: {
     position: { default: null },
@@ -459,73 +504,81 @@ const gt = ["title", "aria-label"], yt = ["title", "aria-label"], ht = ["title",
     minimizeLabel: { default: "Minimize" },
     maximizeLabel: { default: "Maximize" },
     closeLabel: { default: "Close" },
-    hideControls: { type: Boolean, default: !1 },
+    controls: { default: () => oe },
     hideBar: { type: Boolean, default: !1 }
   },
+  emits: ["minimize", "maximize", "close"],
   setup(e) {
-    const s = e, t = vt(), a = y(() => s.position ?? t.value), o = y(() => J(a.value)), i = y(() => o.value === "vertical");
-    ie(ee, { posicion: a, orientacion: o, vertical: i });
-    const c = {
+    const n = e, t = Bt(), a = x(() => n.position ?? t.value), o = x(() => te(a.value)), s = x(() => o.value === "vertical");
+    ae(le, { posicion: a, orientacion: o, vertical: s });
+    const u = {
       top: "flex-col",
       bottom: "flex-col-reverse",
       left: "flex-row",
       right: "flex-row-reverse"
     };
-    return (u, m) => (l(), n("div", {
-      class: d(["flex h-screen w-screen overflow-hidden rounded-corner-window border border-ui-border bg-ui-bg/80", c[a.value]])
+    return (r, c) => (l(), i("div", {
+      class: p(["flex h-screen w-screen overflow-hidden rounded-corner-window border border-ui-border bg-ui-bg/80", u[a.value]])
     }, [
-      e.hideBar ? f("", !0) : (l(), F(fe, {
+      e.hideBar ? g("", !0) : (l(), q($e, J({
         key: 0,
         position: a.value,
         title: e.title,
         "minimize-label": e.minimizeLabel,
         "maximize-label": e.maximizeLabel,
         "close-label": e.closeLabel,
-        "hide-controls": e.hideControls
-      }, Ee({
-        default: W(() => [
-          T(u.$slots, "barra")
+        controls: e.controls
+      }, pe(P(ke)(["minimize", "maximize", "close"]))), He({
+        default: R(() => [
+          A(r.$slots, "barra")
         ]),
         _: 2
       }, [
-        u.$slots.identidad ? {
+        r.$slots.identidad ? {
           name: "identidad",
-          fn: W(() => [
-            T(u.$slots, "identidad")
+          fn: R(() => [
+            A(r.$slots, "identidad")
           ]),
           key: "0"
         } : void 0,
-        u.$slots.titulo ? {
+        r.$slots.titulo ? {
           name: "titulo",
-          fn: W(() => [
-            T(u.$slots, "titulo")
+          fn: R(() => [
+            A(r.$slots, "titulo")
           ]),
           key: "1"
         } : void 0,
-        u.$slots.acciones ? {
-          name: "acciones",
-          fn: W(() => [
-            T(u.$slots, "acciones")
+        r.$slots.centro ? {
+          name: "centro",
+          fn: R(() => [
+            A(r.$slots, "centro")
           ]),
           key: "2"
+        } : void 0,
+        r.$slots.acciones ? {
+          name: "acciones",
+          fn: R(() => [
+            A(r.$slots, "acciones")
+          ]),
+          key: "3"
         } : void 0
-      ]), 1032, ["position", "title", "minimize-label", "maximize-label", "close-label", "hide-controls"])),
-      h("div", kt, [
-        T(u.$slots, "default")
+      ]), 1040, ["position", "title", "minimize-label", "maximize-label", "close-label", "controls"])),
+      C("div", Ot, [
+        A(r.$slots, "default")
       ])
     ], 2));
   }
-}), wt = ["aria-selected", "title", "aria-label", "tabindex"], Ct = {
+}), Vt = ["aria-selected", "title", "aria-label", "tabindex"], Pt = {
   key: 1,
   "aria-hidden": "true"
-}, zt = {
+}, Ft = {
   key: 2,
   class: "min-w-0 flex-1 truncate"
-}, Lt = ["title", "aria-label"], Bt = { class: "whitespace-nowrap" }, St = {
+}, Nt = ["title", "aria-label"], Rt = { class: "whitespace-nowrap" }, qt = {
   key: 0,
   class: "size-2 shrink-0 rounded-full bg-current",
   "aria-hidden": "true"
-}, At = ["title", "aria-label"], Tt = 500, oe = 8, se = 6, me = /* @__PURE__ */ L({
+}, Ht = ["title", "aria-label"], Ut = 500, ce = 8, de = 6, Ce = /* @__PURE__ */ z({
   __name: "TabItem",
   props: {
     tab: {},
@@ -535,166 +588,166 @@ const gt = ["title", "aria-label"], yt = ["title", "aria-label"], ht = ["title",
     tabindex: { default: 0 }
   },
   emits: ["select", "close", "menu", "mover", "navegar"],
-  setup(e, { emit: s }) {
-    const t = e, a = s, { vertical: o, posicion: i } = G(), c = S(null), u = S(null), m = S(!1), v = S(!1), I = S(!1), N = S({ top: 0, left: 0, right: 0 });
-    let A = null, E = null;
-    const P = y(() => t.tab.closable !== !1), k = y(() => t.tab.tooltip ?? t.tab.label), j = y(
+  setup(e, { emit: n }) {
+    const t = e, a = n, { vertical: o, posicion: s } = X(), u = w(null), r = w(null), c = w(!1), b = w(!1), $ = w(!1), M = w({ top: 0, left: 0, right: 0 });
+    let L = null, E = null;
+    const y = x(() => t.tab.closable !== !1), h = x(() => t.tab.tooltip ?? t.tab.label), m = x(
       () => t.tab.dirty ? `${t.tab.label} · ${t.dirtyLabel}` : t.tab.label
-    ), R = y(() => t.tab.label.trim().charAt(0).toUpperCase()), b = y(() => m.value || I.value), g = y(
-      () => !!t.tab.dirty && !(b.value && P.value)
-    ), p = y(
-      () => P.value && (b.value || t.active || !t.tab.dirty)
-    ), x = y(
-      () => o.value && (m.value || v.value || I.value)
-    ), B = y(() => {
-      const $ = { position: "fixed", top: `${N.value.top}px`, zIndex: 50 };
-      return i.value === "right" ? { ...$, right: `${N.value.right + se}px` } : { ...$, left: `${N.value.left + se}px` };
+    ), k = x(() => t.tab.label.trim().charAt(0).toUpperCase()), d = x(() => c.value || $.value), v = x(
+      () => !!t.tab.dirty && !(d.value && y.value)
+    ), D = x(
+      () => y.value && (d.value || t.active || !t.tab.dirty)
+    ), B = x(
+      () => o.value && (c.value || b.value || $.value)
+    ), j = x(() => {
+      const S = { position: "fixed", top: `${M.value.top}px`, zIndex: 50 };
+      return s.value === "right" ? { ...S, right: `${M.value.right + de}px` } : { ...S, left: `${M.value.left + de}px` };
     });
-    function te() {
-      const $ = c.value;
-      if (!$) return;
-      const r = $.getBoundingClientRect();
-      N.value = {
-        top: r.top,
-        left: r.right,
-        right: window.innerWidth - r.left
+    function ie() {
+      const S = u.value;
+      if (!S) return;
+      const f = S.getBoundingClientRect();
+      M.value = {
+        top: f.top,
+        left: f.right,
+        right: window.innerWidth - f.left
       };
     }
-    function be($) {
-      const r = $.relatedTarget;
-      r && u.value?.contains(r) || (I.value = !1);
+    function De(S) {
+      const f = S.relatedTarget;
+      f && r.value?.contains(f) || ($.value = !1);
     }
-    function ve() {
-      m.value = !0, te();
+    function Be() {
+      c.value = !0, ie();
     }
-    function ge() {
-      v.value = !0, te();
+    function Ae() {
+      b.value = !0, ie();
     }
-    function U() {
-      A !== null && clearTimeout(A), A = null, E = null;
+    function H() {
+      L !== null && clearTimeout(L), L = null, E = null;
     }
-    function ye($) {
-      $.button === 0 && (E = { x: $.clientX, y: $.clientY }, A = setTimeout(() => {
-        E && a("menu", E), U();
-      }, Tt));
+    function Me(S) {
+      S.button === 0 && (E = { x: S.clientX, y: S.clientY }, L = setTimeout(() => {
+        E && a("menu", E), H();
+      }, Ut));
     }
-    function he($) {
+    function Se(S) {
       if (!E) return;
-      (Math.abs($.clientX - E.x) > oe || Math.abs($.clientY - E.y) > oe) && U();
+      (Math.abs(S.clientX - E.x) > ce || Math.abs(S.clientY - E.y) > ce) && H();
     }
-    function pe($) {
-      $.button === 1 && P.value && ($.preventDefault(), a("close"));
+    function Te(S) {
+      S.button === 1 && y.value && (S.preventDefault(), a("close"));
     }
-    function xe($) {
-      $.preventDefault(), a("menu", { x: $.clientX, y: $.clientY });
+    function Ie(S) {
+      S.preventDefault(), a("menu", { x: S.clientX, y: S.clientY });
     }
-    return _(U), ($, r) => (l(), n("div", {
+    return G(H), (S, f) => (l(), i("div", {
       ref_key: "raiz",
-      ref: c,
-      class: d(["group relative flex shrink-0 cursor-pointer items-center gap-2 rounded-corner border border-ui-border transition-colors", [
+      ref: u,
+      class: p(["group relative flex shrink-0 cursor-pointer items-center gap-2 rounded-corner border border-ui-border transition-colors", [
         e.active ? "bg-primary font-bold text-tx-on-primary" : "bg-ui-bg/80 hover:bg-ui-surface/70",
-        O(o) ? "size-8 justify-center p-0 text-sm" : "w-34 max-w-34 px-3 py-1 text-sm"
+        P(o) ? "size-8 justify-center p-0 text-sm" : "w-34 max-w-34 px-3 py-1 text-sm"
       ]]),
       role: "tab",
       "aria-selected": e.active,
-      title: k.value,
-      "aria-label": j.value,
+      title: h.value,
+      "aria-label": m.value,
       tabindex: e.tabindex,
-      onClick: r[5] || (r[5] = z((C) => a("select"), ["stop"])),
+      onClick: f[5] || (f[5] = T((O) => a("select"), ["stop"])),
       onKeydown: [
-        r[6] || (r[6] = D(z((C) => a("select"), ["stop"]), ["enter"])),
-        r[7] || (r[7] = D(z((C) => a("select"), ["prevent", "stop"]), ["space"])),
-        r[8] || (r[8] = D(z((C) => a("navegar", "anterior"), ["prevent", "stop"]), ["left"])),
-        r[9] || (r[9] = D(z((C) => a("navegar", "anterior"), ["prevent", "stop"]), ["up"])),
-        r[10] || (r[10] = D(z((C) => a("navegar", "siguiente"), ["prevent", "stop"]), ["right"])),
-        r[11] || (r[11] = D(z((C) => a("navegar", "siguiente"), ["prevent", "stop"]), ["down"])),
-        r[12] || (r[12] = D(z((C) => a("navegar", "primera"), ["prevent", "stop"]), ["home"])),
-        r[13] || (r[13] = D(z((C) => a("navegar", "ultima"), ["prevent", "stop"]), ["end"])),
-        r[14] || (r[14] = D(z((C) => a("mover", -1), ["alt", "prevent", "stop"]), ["left"])),
-        r[15] || (r[15] = D(z((C) => a("mover", -1), ["alt", "prevent", "stop"]), ["up"])),
-        r[16] || (r[16] = D(z((C) => a("mover", 1), ["alt", "prevent", "stop"]), ["right"])),
-        r[17] || (r[17] = D(z((C) => a("mover", 1), ["alt", "prevent", "stop"]), ["down"])),
-        r[18] || (r[18] = D(z((C) => P.value && a("close"), ["prevent", "stop"]), ["delete"]))
+        f[6] || (f[6] = V(T((O) => a("select"), ["stop"]), ["enter"])),
+        f[7] || (f[7] = V(T((O) => a("select"), ["prevent", "stop"]), ["space"])),
+        f[8] || (f[8] = V(T((O) => a("navegar", "anterior"), ["prevent", "stop"]), ["left"])),
+        f[9] || (f[9] = V(T((O) => a("navegar", "anterior"), ["prevent", "stop"]), ["up"])),
+        f[10] || (f[10] = V(T((O) => a("navegar", "siguiente"), ["prevent", "stop"]), ["right"])),
+        f[11] || (f[11] = V(T((O) => a("navegar", "siguiente"), ["prevent", "stop"]), ["down"])),
+        f[12] || (f[12] = V(T((O) => a("navegar", "primera"), ["prevent", "stop"]), ["home"])),
+        f[13] || (f[13] = V(T((O) => a("navegar", "ultima"), ["prevent", "stop"]), ["end"])),
+        f[14] || (f[14] = V(T((O) => a("mover", -1), ["alt", "prevent", "stop"]), ["left"])),
+        f[15] || (f[15] = V(T((O) => a("mover", -1), ["alt", "prevent", "stop"]), ["up"])),
+        f[16] || (f[16] = V(T((O) => a("mover", 1), ["alt", "prevent", "stop"]), ["right"])),
+        f[17] || (f[17] = V(T((O) => a("mover", 1), ["alt", "prevent", "stop"]), ["down"])),
+        f[18] || (f[18] = V(T((O) => y.value && a("close"), ["prevent", "stop"]), ["delete"]))
       ],
-      onAuxclick: z(pe, ["stop"]),
-      onContextmenu: xe,
-      onPointerdown: ye,
-      onPointermove: he,
-      onPointerup: U,
-      onPointerleave: U,
-      onMouseenter: ve,
-      onMouseleave: r[19] || (r[19] = (C) => m.value = !1),
-      onFocus: ge,
-      onBlur: r[20] || (r[20] = (C) => v.value = !1)
+      onAuxclick: T(Te, ["stop"]),
+      onContextmenu: Ie,
+      onPointerdown: Me,
+      onPointermove: Se,
+      onPointerup: H,
+      onPointerleave: H,
+      onMouseenter: Be,
+      onMouseleave: f[19] || (f[19] = (O) => c.value = !1),
+      onFocus: Ae,
+      onBlur: f[20] || (f[20] = (O) => b.value = !1)
     }, [
-      e.tab.icon ? (l(), F(M, {
+      e.tab.icon ? (l(), q(N, {
         key: 0,
         name: e.tab.icon,
         size: 16,
         class: "shrink-0"
-      }, null, 8, ["name"])) : O(o) ? (l(), n("span", Ct, w(R.value), 1)) : f("", !0),
-      O(o) ? f("", !0) : (l(), n("span", zt, w(e.tab.label), 1)),
-      g.value ? (l(), n("span", {
+      }, null, 8, ["name"])) : P(o) ? (l(), i("span", Pt, I(k.value), 1)) : g("", !0),
+      P(o) ? g("", !0) : (l(), i("span", Ft, I(e.tab.label), 1)),
+      v.value ? (l(), i("span", {
         key: 3,
-        class: d(["size-2 shrink-0 rounded-full bg-current", O(o) ? "absolute right-0.5 top-0.5" : ""]),
+        class: p(["size-2 shrink-0 rounded-full bg-current", P(o) ? "absolute right-0.5 top-0.5" : ""]),
         "aria-hidden": "true"
-      }, null, 2)) : p.value && !O(o) ? (l(), n("button", {
+      }, null, 2)) : D.value && !P(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}: ${j.value}`,
-        onClick: r[0] || (r[0] = z((C) => a("close"), ["stop"]))
+        "aria-label": `${e.closeLabel}: ${m.value}`,
+        onClick: f[0] || (f[0] = T((O) => a("close"), ["stop"]))
       }, [
-        V(M, {
+        F(N, {
           name: "gtk-close",
           type: "symbol",
           size: 12
         })
-      ], 8, Lt)) : f("", !0),
-      (l(), F(Me, { to: "body" }, [
-        V(Ie, {
+      ], 8, Nt)) : g("", !0),
+      (l(), q(ge, { to: "body" }, [
+        F(ye, {
           "enter-active-class": "transition duration-150 ease-out",
           "enter-from-class": "opacity-0 scale-95",
           "leave-active-class": "transition duration-100 ease-in",
           "leave-to-class": "opacity-0 scale-95"
         }, {
-          default: W(() => [
-            x.value ? (l(), n("div", {
+          default: R(() => [
+            B.value ? (l(), i("div", {
               key: 0,
-              class: d(["flex items-center gap-2 rounded-corner border border-ui-border bg-ui-surface/95 px-3 py-1 text-sm shadow-lg", e.active ? "font-bold" : ""]),
+              class: p(["flex items-center gap-2 rounded-corner border border-ui-border bg-ui-surface/95 px-3 py-1 text-sm shadow-lg", e.active ? "font-bold" : ""]),
               ref_key: "desplegadoRef",
-              ref: u,
-              style: H(B.value),
-              onMouseenter: r[2] || (r[2] = (C) => I.value = !0),
-              onMouseleave: r[3] || (r[3] = (C) => I.value = !1),
-              onFocusin: r[4] || (r[4] = (C) => I.value = !0),
-              onFocusout: be
+              ref: r,
+              style: ee(j.value),
+              onMouseenter: f[2] || (f[2] = (O) => $.value = !0),
+              onMouseleave: f[3] || (f[3] = (O) => $.value = !1),
+              onFocusin: f[4] || (f[4] = (O) => $.value = !0),
+              onFocusout: De
             }, [
-              h("span", Bt, w(e.tab.label), 1),
-              e.tab.dirty ? (l(), n("span", St)) : f("", !0),
-              P.value ? (l(), n("button", {
+              C("span", Rt, I(e.tab.label), 1),
+              e.tab.dirty ? (l(), i("span", qt)) : g("", !0),
+              y.value ? (l(), i("button", {
                 key: 1,
                 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}: ${j.value}`,
-                onClick: r[1] || (r[1] = z((C) => a("close"), ["stop"]))
+                "aria-label": `${e.closeLabel}: ${m.value}`,
+                onClick: f[1] || (f[1] = T((O) => a("close"), ["stop"]))
               }, [
-                V(M, {
+                F(N, {
                   name: "gtk-close",
                   type: "symbol",
                   size: 12
                 })
-              ], 8, At)) : f("", !0)
-            ], 38)) : f("", !0)
+              ], 8, Ht)) : g("", !0)
+            ], 38)) : g("", !0)
           ]),
           _: 1
         })
       ]))
-    ], 42, wt));
+    ], 42, Vt));
   }
-}), Dt = ["aria-orientation"], Et = ["draggable", "onDragstart", "onDragover", "onDrop"], Mt = ["title", "aria-label"], It = /* @__PURE__ */ L({
+}), Wt = ["aria-orientation"], Kt = ["draggable", "onDragstart", "onDragover", "onDrop"], Gt = ["title", "aria-label"], Xt = /* @__PURE__ */ z({
   __name: "TabBar",
   props: {
     tabs: {},
@@ -705,102 +758,102 @@ const gt = ["title", "aria-label"], yt = ["title", "aria-label"], ht = ["title",
     fixedOrder: { type: Boolean, default: !1 }
   },
   emits: ["update:modelValue", "select", "close", "new", "reorder", "menu"],
-  setup(e, { emit: s }) {
-    const t = e, a = s, { vertical: o } = G(), i = S(null), c = S(0), u = S(null), m = S(null);
-    function v(b) {
-      a("update:modelValue", b), a("select", b);
+  setup(e, { emit: n }) {
+    const t = e, a = n, { vertical: o } = X(), s = w(null), u = w(0), r = w(null), c = w(null);
+    function b(d) {
+      a("update:modelValue", d), a("select", d);
     }
-    async function I(b, g) {
-      const p = t.tabs.length - 1;
-      if (p < 0) return;
-      const x = g === "primera" ? 0 : g === "ultima" ? p : g === "anterior" ? (b - 1 + t.tabs.length) % t.tabs.length : (b + 1) % t.tabs.length;
-      c.value = x, await re(), i.value?.querySelectorAll('[role="tab"]')?.[x]?.focus();
+    async function $(d, v) {
+      const D = t.tabs.length - 1;
+      if (D < 0) return;
+      const B = v === "primera" ? 0 : v === "ultima" ? D : v === "anterior" ? (d - 1 + t.tabs.length) % t.tabs.length : (d + 1) % t.tabs.length;
+      u.value = B, await ne(), s.value?.querySelectorAll('[role="tab"]')?.[B]?.focus();
     }
-    function N(b, g) {
+    function M(d, v) {
       if (t.fixedOrder) return;
-      const p = b + g;
-      if (p < 0 || p >= t.tabs.length) return;
-      const x = [...t.tabs], [B] = x.splice(b, 1);
-      B && (x.splice(p, 0, B), c.value = p, a("reorder", x));
+      const D = d + v;
+      if (D < 0 || D >= t.tabs.length) return;
+      const B = [...t.tabs], [j] = B.splice(d, 1);
+      j && (B.splice(D, 0, j), u.value = D, a("reorder", B));
     }
-    function A(b) {
-      const g = i.value;
-      if (!g) return;
-      const p = b.deltaY || b.deltaX || 0, x = o.value ? g.scrollTop : g.scrollLeft;
-      o.value ? g.scrollTop += p : g.scrollLeft += p, (o.value ? g.scrollTop : g.scrollLeft) !== x && b.preventDefault();
+    function L(d) {
+      const v = s.value;
+      if (!v) return;
+      const D = d.deltaY || d.deltaX || 0, B = o.value ? v.scrollTop : v.scrollLeft;
+      o.value ? v.scrollTop += D : v.scrollLeft += D, (o.value ? v.scrollTop : v.scrollLeft) !== B && d.preventDefault();
     }
-    function E(b, g) {
-      t.fixedOrder || (u.value = b, g.dataTransfer?.setData("text/plain", String(b)), g.dataTransfer && (g.dataTransfer.effectAllowed = "move"));
+    function E(d, v) {
+      t.fixedOrder || (r.value = d, v.dataTransfer?.setData("text/plain", String(d)), v.dataTransfer && (v.dataTransfer.effectAllowed = "move"));
     }
-    function P(b, g) {
-      t.fixedOrder || u.value === null || (g.preventDefault(), m.value = b, g.dataTransfer && (g.dataTransfer.dropEffect = "move"));
+    function y(d, v) {
+      t.fixedOrder || r.value === null || (v.preventDefault(), c.value = d, v.dataTransfer && (v.dataTransfer.dropEffect = "move"));
     }
-    function k(b) {
-      const g = u.value;
-      if (j(), t.fixedOrder || g === null || g === b) return;
-      const p = [...t.tabs], [x] = p.splice(g, 1);
-      x && (p.splice(b, 0, x), a("reorder", p));
+    function h(d) {
+      const v = r.value;
+      if (m(), t.fixedOrder || v === null || v === d) return;
+      const D = [...t.tabs], [B] = D.splice(v, 1);
+      B && (D.splice(d, 0, B), a("reorder", D));
     }
-    function j() {
-      u.value = null, m.value = null;
+    function m() {
+      r.value = null, c.value = null;
     }
-    const R = y(
+    const k = x(
       () => 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 (b, g) => (l(), n("div", {
-      class: d(["flex min-h-0 min-w-0 items-center gap-1", O(o) ? "w-full flex-col" : "h-full"]),
+    return (d, v) => (l(), i("div", {
+      class: p(["flex min-h-0 min-w-0 items-center gap-1", P(o) ? "w-full flex-col" : "h-full"]),
       role: "tablist",
-      "aria-orientation": O(o) ? "vertical" : "horizontal"
+      "aria-orientation": P(o) ? "vertical" : "horizontal"
     }, [
-      h("div", {
+      C("div", {
         ref_key: "carril",
-        ref: i,
-        class: d(R.value),
-        onWheel: A
+        ref: s,
+        class: p(k.value),
+        onWheel: L
       }, [
-        (l(!0), n(X, null, Y(e.tabs, (p, x) => (l(), n("div", {
-          key: p.id,
-          class: d(["transition-opacity", [
-            u.value === x ? "opacity-40" : "",
-            m.value === x && u.value !== x ? "ring-2 ring-secondary rounded-corner" : ""
+        (l(!0), i(U, null, Y(e.tabs, (D, B) => (l(), i("div", {
+          key: D.id,
+          class: p(["transition-opacity", [
+            r.value === B ? "opacity-40" : "",
+            c.value === B && r.value !== B ? "ring-2 ring-secondary rounded-corner" : ""
           ]]),
           draggable: !e.fixedOrder,
-          onDragstart: (B) => E(x, B),
-          onDragover: (B) => P(x, B),
-          onDrop: z((B) => k(x), ["prevent"]),
-          onDragend: j
+          onDragstart: (j) => E(B, j),
+          onDragover: (j) => y(B, j),
+          onDrop: T((j) => h(B), ["prevent"]),
+          onDragend: m
         }, [
-          V(me, {
-            tab: p,
-            active: p.id === e.modelValue,
+          F(Ce, {
+            tab: D,
+            active: D.id === e.modelValue,
             "close-label": e.closeLabel,
             "dirty-label": e.dirtyLabel,
-            tabindex: x === c.value ? 0 : -1,
-            onSelect: (B) => v(p.id),
-            onClose: (B) => a("close", p.id),
-            onMenu: (B) => a("menu", { id: p.id, ...B }),
-            onNavegar: (B) => I(x, B),
-            onMover: (B) => N(x, B)
+            tabindex: B === u.value ? 0 : -1,
+            onSelect: (j) => b(D.id),
+            onClose: (j) => a("close", D.id),
+            onMenu: (j) => a("menu", { id: D.id, ...j }),
+            onNavegar: (j) => $(B, j),
+            onMover: (j) => M(B, j)
           }, null, 8, ["tab", "active", "close-label", "dirty-label", "tabindex", "onSelect", "onClose", "onMenu", "onNavegar", "onMover"])
-        ], 42, Et))), 128))
+        ], 42, Kt))), 128))
       ], 34),
-      e.newLabel ? (l(), n("button", {
+      e.newLabel ? (l(), i("button", {
         key: 0,
         type: "button",
         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: g[0] || (g[0] = (p) => a("new"))
+        onClick: v[0] || (v[0] = (D) => a("new"))
       }, [
-        V(M, {
+        F(N, {
           name: "gtk-add",
           type: "symbol",
           size: 14
         })
-      ], 8, Mt)) : f("", !0)
-    ], 10, Dt));
+      ], 8, Gt)) : g("", !0)
+    ], 10, Wt));
   }
-}), Vt = { class: "relative flex shrink-0 items-center" }, jt = ["title", "aria-label", "aria-expanded"], Ot = ["value", "placeholder", "aria-label"], Pt = /* @__PURE__ */ L({
+}), Yt = { class: "relative flex shrink-0 items-center" }, Jt = ["title", "aria-label", "aria-expanded"], Qt = ["value", "placeholder", "aria-label"], Zt = /* @__PURE__ */ z({
   __name: "BarSearch",
   props: {
     modelValue: { default: "" },
@@ -809,68 +862,68 @@ const gt = ["title", "aria-label"], yt = ["title", "aria-label"], ht = ["title",
     collapsed: { type: Boolean, default: !1 }
   },
   emits: ["update:modelValue", "search", "open", "close"],
-  setup(e, { emit: s }) {
-    const t = e, a = s, { vertical: o, posicion: i } = G(), c = S(!1), u = S(null), m = y(() => o.value || t.collapsed), v = y(() => !m.value || c.value), I = y(() => {
-      if (!m.value) return "";
-      const k = "absolute z-40 w-64 rounded-corner border border-ui-border bg-ui-surface/95 p-1 shadow-lg";
-      return i.value === "left" ? `${k} left-full top-0 ml-1` : i.value === "right" ? `${k} right-full top-0 mr-1` : i.value === "bottom" ? `${k} bottom-full right-0 mb-1` : `${k} top-full right-0 mt-1`;
+  setup(e, { emit: n }) {
+    const t = e, a = n, { vertical: o, posicion: s } = X(), u = w(!1), r = w(null), c = x(() => o.value || t.collapsed), b = x(() => !c.value || u.value), $ = x(() => {
+      if (!c.value) return "";
+      const h = "absolute z-40 w-64 rounded-corner border border-ui-border bg-ui-surface/95 p-1 shadow-lg";
+      return s.value === "left" ? `${h} left-full top-0 ml-1` : s.value === "right" ? `${h} right-full top-0 mr-1` : s.value === "bottom" ? `${h} bottom-full right-0 mb-1` : `${h} top-full right-0 mt-1`;
     });
-    async function N() {
-      c.value = !0, a("open"), await re(), u.value?.focus();
+    async function M() {
+      u.value = !0, a("open"), await ne(), r.value?.focus();
     }
-    function A() {
-      c.value && (c.value = !1, a("close"));
+    function L() {
+      u.value && (u.value = !1, a("close"));
     }
-    function E(k) {
-      a("update:modelValue", k.target.value);
+    function E(h) {
+      a("update:modelValue", h.target.value);
     }
-    function P() {
+    function y() {
       a("search", t.modelValue);
     }
-    return (k, j) => (l(), n("div", Vt, [
-      m.value ? (l(), n("button", {
+    return (h, m) => (l(), i("div", Yt, [
+      c.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: j[0] || (j[0] = z(() => {
+        "aria-expanded": u.value,
+        onMousedown: m[0] || (m[0] = T(() => {
         }, ["prevent"])),
-        onClick: j[1] || (j[1] = (R) => c.value ? A() : N())
+        onClick: m[1] || (m[1] = (k) => u.value ? L() : M())
       }, [
-        V(M, {
+        F(N, {
           name: "system-search",
           type: "symbol",
           size: 14
         })
-      ], 40, jt)) : f("", !0),
-      v.value ? (l(), n("div", {
+      ], 40, Jt)) : g("", !0),
+      b.value ? (l(), i("div", {
         key: 1,
-        class: d(I.value)
+        class: p($.value)
       }, [
-        h("input", {
+        C("input", {
           ref_key: "campo",
-          ref: u,
+          ref: r,
           type: "search",
-          class: d(["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", m.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", c.value ? "" : "w-48"]),
           value: e.modelValue,
           placeholder: e.placeholder || e.label,
           "aria-label": e.label,
           onInput: E,
           onKeydown: [
-            D(P, ["enter"]),
-            D(A, ["esc"])
+            V(y, ["enter"]),
+            V(L, ["esc"])
           ],
-          onBlur: A
-        }, null, 42, Ot)
-      ], 2)) : f("", !0)
+          onBlur: L
+        }, null, 42, Qt)
+      ], 2)) : g("", !0)
     ]));
   }
-}), Nt = ["type", "disabled"], Rt = {
+}), _t = ["type", "disabled"], ea = {
   key: 0,
   class: "w-4 h-4 animate-spin rounded-full border-2 border-current border-t-transparent"
-}, Ft = ["src", "alt"], Wt = { key: 2 }, Ut = ["src", "alt"], Gt = /* @__PURE__ */ L({
+}, ta = ["src", "alt"], aa = { key: 2 }, na = ["src", "alt"], la = /* @__PURE__ */ z({
   __name: "ActionButton",
   props: {
     label: {},
@@ -888,52 +941,52 @@ const gt = ["title", "aria-label"], yt = ["title", "aria-label"], ht = ["title",
     preventDefault: { type: Boolean, default: !1 }
   },
   emits: ["click"],
-  setup(e, { emit: s }) {
-    const t = e, a = s, o = {
+  setup(e, { emit: n }) {
+    const t = e, a = n, o = {
       primary: "bg-primary dark:bg-primary-dark text-tx-on-primary dark:text-tx-on-primary-dark hover:bg-primary/90 dark:hover:bg-primary-dark/90",
       secondary: "bg-secondary dark:bg-secondary-dark text-tx-on-primary dark:text-tx-on-primary-dark hover:bg-secondary/80 dark:hover:bg-secondary-dark/80",
       danger: "bg-status-error dark:bg-status-error-dark text-tx-on-primary dark:text-tx-on-primary-dark hover:bg-status-error/90 dark:hover:bg-status-error-dark/90"
-    }, i = {
+    }, s = {
       sm: "px-2 py-1 text-xs",
       md: "px-3 py-1 text-sm",
       lg: "px-4 py-2 text-base"
-    }, c = (u) => {
-      t.stopPropagation && u.stopPropagation(), t.preventDefault && u.preventDefault(), !t.disabled && !t.loading && a("click");
+    }, u = (r) => {
+      t.stopPropagation && r.stopPropagation(), t.preventDefault && r.preventDefault(), !t.disabled && !t.loading && a("click");
     };
-    return (u, m) => (l(), n("button", {
+    return (r, c) => (l(), i("button", {
       type: t.type,
-      onClick: c,
-      class: d(["rounded-corner transition-all duration-200 disabled:opacity-50 disabled:cursor-not-allowed flex items-center justify-center gap-2", [
+      onClick: u,
+      class: p(["rounded-corner transition-all duration-200 disabled:opacity-50 disabled:cursor-not-allowed flex items-center justify-center gap-2", [
         o[t.variant],
-        i[t.size],
+        s[t.size],
         t.fullWidth ? "w-full" : "",
         t.iconSrc && !t.label ? "px-2 py-2" : "",
         e.customClass
       ]]),
       disabled: t.disabled || t.loading
     }, [
-      e.loading ? (l(), n("span", Rt)) : f("", !0),
-      t.iconSrc && !t.iconRight ? (l(), n("img", {
+      e.loading ? (l(), i("span", ea)) : g("", !0),
+      t.iconSrc && !t.iconRight ? (l(), i("img", {
         key: 1,
         src: t.iconSrc,
         alt: t.iconAlt || t.label,
         class: "w-4 h-4"
-      }, null, 8, Ft)) : f("", !0),
-      t.label ? (l(), n("span", Wt, w(t.label), 1)) : f("", !0),
-      t.iconSrc && t.iconRight ? (l(), n("img", {
+      }, null, 8, ta)) : g("", !0),
+      t.label ? (l(), i("span", aa, I(t.label), 1)) : g("", !0),
+      t.iconSrc && t.iconRight ? (l(), i("img", {
         key: 3,
         src: t.iconSrc,
         alt: t.iconAlt || t.label,
         class: "w-4 h-4"
-      }, null, 8, Ut)) : f("", !0)
-    ], 10, Nt));
+      }, null, 8, na)) : g("", !0)
+    ], 10, _t));
   }
-}), K = (e, s) => {
+}), Q = (e, n) => {
   const t = e.__vccOpts || e;
-  for (const [a, o] of s)
+  for (const [a, o] of n)
     t[a] = o;
   return t;
-}, Xt = /* @__PURE__ */ K(Gt, [["__scopeId", "data-v-2eaf6e27"]]), Yt = { class: "text-base font-semibold m-0 text-primary dark:text-primary-dark" }, Kt = /* @__PURE__ */ L({
+}, oa = /* @__PURE__ */ Q(la, [["__scopeId", "data-v-2eaf6e27"]]), ia = { class: "text-base font-semibold m-0 text-primary dark:text-primary-dark" }, sa = /* @__PURE__ */ z({
   __name: "ConfigSection",
   props: {
     title: {},
@@ -941,26 +994,26 @@ const gt = ["title", "aria-label"], yt = ["title", "aria-label"], ht = ["title",
     customClass: { default: () => ({}) }
   },
   setup(e) {
-    return (s, t) => (l(), n("div", {
-      class: d(["flex flex-col gap-4 p-4 background rounded-corner", e.customClass])
+    return (n, t) => (l(), i("div", {
+      class: p(["flex flex-col gap-4 p-4 background rounded-corner", e.customClass])
     }, [
-      h("h3", Yt, w(e.icon ? `${e.icon} ${e.title}` : e.title), 1),
-      T(s.$slots, "default", {}, void 0, !0)
+      C("h3", ia, I(e.icon ? `${e.icon} ${e.title}` : e.title), 1),
+      A(n.$slots, "default", {}, void 0, !0)
     ], 2));
   }
-}), qt = /* @__PURE__ */ K(Kt, [["__scopeId", "data-v-45bd4eab"]]), Ht = { class: "flex items-center gap-3 flex-1 min-w-0" }, Jt = ["src", "alt"], Qt = { class: "min-w-0" }, Zt = { class: "font-semibold truncate" }, _t = {
+}), ra = /* @__PURE__ */ Q(sa, [["__scopeId", "data-v-45bd4eab"]]), ua = { class: "flex items-center gap-3 flex-1 min-w-0" }, ca = ["src", "alt"], da = { class: "min-w-0" }, fa = { class: "font-semibold truncate" }, ma = {
   key: 0,
   class: "text-xs text-gray-400 truncate"
-}, ea = {
+}, ba = {
   key: 1,
   class: "text-xs text-gray-400 truncate"
-}, ta = {
+}, va = {
   key: 2,
   class: "text-xs text-gray-400 flex gap-2 mt-1"
-}, aa = {
+}, pa = {
   key: 1,
   class: "w-2 h-2 rounded-full bg-green-500"
-}, la = /* @__PURE__ */ L({
+}, ga = /* @__PURE__ */ z({
   __name: "DeviceCard",
   props: {
     icon: {},
@@ -976,40 +1029,402 @@ const gt = ["title", "aria-label"], yt = ["title", "aria-label"], ht = ["title",
     clickable: { type: Boolean, default: !1 }
   },
   emits: ["action", "click"],
-  setup(e, { emit: s }) {
-    const t = s, a = () => {
+  setup(e, { emit: n }) {
+    const t = n, a = () => {
       t("action");
     }, o = () => {
       t("click");
     };
-    return (i, c) => (l(), n("div", {
-      class: d(["flex items-center justify-between background rounded-vsk px-6 py-3 mb-4", [{ "border-l-4 border-green-500": e.isConnected }, e.customClass]]),
+    return (s, u) => (l(), i("div", {
+      class: p(["flex items-center justify-between background rounded-vsk px-6 py-3 mb-4", [{ "border-l-4 border-green-500": e.isConnected }, e.customClass]]),
       onClick: o
     }, [
-      h("div", Ht, [
-        h("img", {
+      C("div", ua, [
+        C("img", {
           src: e.icon,
           alt: e.title,
           class: "h-7 w-7 shrink-0"
-        }, null, 8, Jt),
-        h("div", Qt, [
-          h("div", Zt, w(e.title), 1),
-          e.subtitle ? (l(), n("div", _t, w(e.subtitle), 1)) : f("", !0),
-          e.metadata ? (l(), n("div", ea, w(e.metadata), 1)) : f("", !0),
-          e.extraInfo && e.extraInfo.length > 0 ? (l(), n("div", ta, [
-            (l(!0), n(X, null, Y(e.extraInfo, (u, m) => (l(), n("span", { key: m }, w(u), 1))), 128))
-          ])) : f("", !0)
+        }, null, 8, ca),
+        C("div", da, [
+          C("div", fa, I(e.title), 1),
+          e.subtitle ? (l(), i("div", ma, I(e.subtitle), 1)) : g("", !0),
+          e.metadata ? (l(), i("div", ba, I(e.metadata), 1)) : g("", !0),
+          e.extraInfo && e.extraInfo.length > 0 ? (l(), i("div", va, [
+            (l(!0), i(U, null, Y(e.extraInfo, (r, c) => (l(), i("span", { key: c }, I(r), 1))), 128))
+          ])) : g("", !0)
         ])
       ]),
-      e.showActionButton ? (l(), n("button", {
+      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: z(a, ["stop"])
-      }, w(e.actionLabel), 1)) : f("", !0),
-      e.showStatusIndicator && e.isConnected ? (l(), n("div", aa)) : f("", !0)
+        onClick: T(a, ["stop"])
+      }, I(e.actionLabel), 1)) : g("", !0),
+      e.showStatusIndicator && e.isConnected ? (l(), i("div", pa)) : g("", !0)
     ], 2));
   }
-}), na = ["for"], oa = /* @__PURE__ */ L({
+}), ze = /* @__PURE__ */ Symbol("menú de vasak");
+function Z() {
+  const e = be(ze, null);
+  if (e) return e;
+  const n = w(!1);
+  return {
+    abierto: n,
+    idDelMenu: "vsk-menu-suelto",
+    idDeLaEtiqueta: w(null),
+    ponerLaEtiqueta: () => {
+    },
+    disparador: w(null),
+    ponerElDisparador: () => {
+    },
+    focoAlAbrir: w("ninguno"),
+    abrir: () => {
+      n.value = !0;
+    },
+    cerrar: () => {
+      n.value = !1;
+    },
+    alternar: () => {
+      n.value = !n.value;
+    }
+  };
+}
+let fe = 0;
+function Le() {
+  return fe += 1, `vsk-menu-${fe}`;
+}
+const ya = { class: "relative inline-block" }, ha = /* @__PURE__ */ z({
+  __name: "DropdownMenu",
+  props: {
+    open: { type: Boolean, default: void 0 }
+  },
+  emits: ["update:open"],
+  setup(e, { emit: n }) {
+    const t = e, a = n, o = w(!1), s = w(null), u = w(null), r = w("ninguno"), c = Le();
+    let b = null;
+    const $ = x({
+      get: () => t.open ?? o.value,
+      set: (y) => {
+        t.open === void 0 && (o.value = y), a("update:open", y);
+      }
+    });
+    K($, (y) => {
+      if (y) {
+        const h = document.activeElement;
+        b = h instanceof HTMLElement ? h : null;
+      } else
+        r.value = "ninguno";
+    });
+    function M(y = "ninguno") {
+      r.value = y, $.value = !0;
+    }
+    function L(y = {}) {
+      if ($.value = !1, !y.devolverElFoco) return;
+      const h = b ?? s.value;
+      h?.isConnected && h.focus();
+    }
+    function E(y = "ninguno") {
+      if ($.value) {
+        L({ devolverElFoco: !0 });
+        return;
+      }
+      M(y);
+    }
+    return ae(ze, {
+      abierto: $,
+      idDelMenu: c,
+      idDeLaEtiqueta: u,
+      ponerLaEtiqueta: (y) => {
+        u.value = y;
+      },
+      disparador: s,
+      ponerElDisparador: (y) => {
+        s.value = y;
+      },
+      focoAlAbrir: r,
+      abrir: M,
+      cerrar: L,
+      alternar: E
+    }), (y, h) => (l(), i("div", ya, [
+      A(y.$slots, "default")
+    ]));
+  }
+}), xa = ["id", "aria-labelledby", "inert"], ka = {
+  role: "none",
+  class: "py-1"
+}, wa = /* @__PURE__ */ z({
+  inheritAttrs: !1,
+  __name: "DropdownMenuContent",
+  props: {
+    side: { default: "bottom" },
+    align: { default: "start" },
+    sideOffset: { default: 4 }
+  },
+  setup(e) {
+    const n = e, t = Z(), { idDelMenu: a, idDeLaEtiqueta: o } = t, s = x(() => t.disparador.value), u = x(() => t.abierto.value), r = w(null), c = w({ top: 0, left: 0 });
+    function b() {
+      if (!s.value || !r.value) return;
+      const m = s.value.getBoundingClientRect(), k = r.value.getBoundingClientRect();
+      let d = 0, v = 0;
+      switch (n.side) {
+        case "bottom":
+          d = m.bottom + n.sideOffset;
+          break;
+        case "top":
+          d = m.top - k.height - n.sideOffset;
+          break;
+        case "left":
+          v = m.left - k.width - n.sideOffset, d = m.top;
+          break;
+        case "right":
+          v = m.right + n.sideOffset, d = m.top;
+          break;
+      }
+      switch (n.align) {
+        case "start":
+          (n.side === "bottom" || n.side === "top") && (v = m.left);
+          break;
+        case "center":
+          (n.side === "bottom" || n.side === "top") && (v = m.left + m.width / 2 - k.width / 2);
+          break;
+        case "end":
+          (n.side === "bottom" || n.side === "top") && (v = m.right - k.width);
+          break;
+      }
+      c.value = { top: d, left: v };
+    }
+    function $() {
+      return r.value ? Array.from(r.value.querySelectorAll('[role="menuitem"]')) : [];
+    }
+    function M(m) {
+      const k = $();
+      if (!k.length) return;
+      const d = k.length;
+      k[(m % d + d) % d]?.focus();
+    }
+    function L() {
+      const m = document.activeElement;
+      return m instanceof HTMLElement ? $().indexOf(m) : -1;
+    }
+    function E(m) {
+      const k = L();
+      switch (m.key) {
+        case "ArrowDown":
+          m.preventDefault(), M(k + 1);
+          break;
+        case "ArrowUp":
+          m.preventDefault(), M(k <= 0 ? -1 : k - 1);
+          break;
+        case "Home":
+          m.preventDefault(), M(0);
+          break;
+        case "End":
+          m.preventDefault(), M(-1);
+          break;
+        case "Escape":
+          m.preventDefault(), m.stopPropagation(), t.cerrar({ devolverElFoco: !0 });
+          break;
+        case "Tab":
+          m.preventDefault(), t.cerrar({ devolverElFoco: !0 });
+          break;
+      }
+    }
+    K(u, async (m) => {
+      if (m)
+        switch (await ne(), requestAnimationFrame(() => {
+          b();
+        }), t.focoAlAbrir.value) {
+          case "primero":
+            M(0);
+            break;
+          case "ultimo":
+            M(-1);
+            break;
+          // Abierto con el ratón: el foco va al menú y no a un ítem —no hay
+          // ninguno elegido todavía—, que es lo que deja andar las flechas y el
+          // Escape sin haber tocado nada.
+          default:
+            r.value?.focus();
+        }
+    });
+    function y() {
+      u.value && b();
+    }
+    function h(m) {
+      const k = m.target, d = !!k.closest("[dropdown-content]"), v = !!s.value?.contains(k);
+      !d && !v && t.cerrar();
+    }
+    return W(() => {
+      document.addEventListener("click", h), window.addEventListener("resize", y), window.addEventListener("scroll", y, !0);
+    }), G(() => {
+      document.removeEventListener("click", h), window.removeEventListener("resize", y), window.removeEventListener("scroll", y, !0);
+    }), (m, k) => (l(), q(ge, { to: "body" }, [
+      F(ye, {
+        "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: k[1] || (k[1] = (d) => d.offsetHeight),
+        onLeave: k[2] || (k[2] = (d) => d.offsetHeight)
+      }, {
+        default: R(() => [
+          me(C("div", J({
+            ref_key: "contenido",
+            ref: r
+          }, m.$attrs, {
+            id: P(a),
+            role: "menu",
+            tabindex: "-1",
+            "aria-orientation": "vertical",
+            "aria-labelledby": P(o) ?? void 0,
+            inert: !u.value,
+            style: { position: "fixed", top: `${c.value.top}px`, left: `${c.value.left}px`, zIndex: 50 },
+            "dropdown-content": "",
+            class: "min-w-30 rounded-corner border border-primary bg-ui-bg/80 shadow-lg focus:outline-none",
+            onClick: k[0] || (k[0] = (d) => d.stopPropagation()),
+            onKeydown: E
+          }), [
+            C("div", ka, [
+              A(m.$slots, "default")
+            ])
+          ], 16, xa), [
+            [Ue, u.value]
+          ])
+        ]),
+        _: 3
+      })
+    ]));
+  }
+}), $a = ["aria-disabled", "onKeydown"], Ca = /* @__PURE__ */ z({
+  __name: "DropdownMenuItem",
+  props: {
+    disabled: { type: Boolean, default: !1 }
+  },
+  emits: ["select", "click"],
+  setup(e, { emit: n }) {
+    const t = e, a = n, o = Z();
+    function s(u) {
+      t.disabled || (a("select"), a("click", u), o.cerrar({ devolverElFoco: !0 }));
+    }
+    return (u, r) => (l(), i("div", {
+      role: "menuitem",
+      tabindex: "0",
+      "aria-disabled": e.disabled || void 0,
+      class: p([
+        "px-3 py-2 text-sm transition-colors outline-none",
+        {
+          "opacity-50 cursor-not-allowed": e.disabled,
+          "cursor-pointer hover:bg-primary hover:text-tx-on-primary focus-visible:bg-primary focus-visible:text-tx-on-primary": !e.disabled
+        }
+      ]),
+      onClick: s,
+      onKeydown: [
+        V(T(s, ["prevent"]), ["enter"]),
+        V(T(s, ["prevent"]), ["space"])
+      ]
+    }, [
+      A(u.$slots, "default")
+    ], 42, $a));
+  }
+}), za = /* @__PURE__ */ z({
+  __name: "DropdownMenuLabel",
+  setup(e) {
+    const n = Z(), t = `${Le()}-titulo`;
+    return W(() => {
+      n.ponerLaEtiqueta(t);
+    }), G(() => {
+      n.ponerLaEtiqueta(null);
+    }), (a, o) => (l(), i("div", {
+      id: t,
+      role: "presentation",
+      class: "px-3 py-2 text-sm font-semibold text-tx-main"
+    }, [
+      A(a.$slots, "default")
+    ]));
+  }
+}), La = {
+  role: "separator",
+  "aria-orientation": "horizontal",
+  class: "bg-ui-bg/80 my-4 h-0.5"
+}, Ea = /* @__PURE__ */ z({
+  __name: "DropdownMenuSeparator",
+  setup(e) {
+    return (n, t) => (l(), i("div", La));
+  }
+});
+function Ee(e) {
+  const n = e.filter(
+    (a) => a.type !== Ge && !(a.type === Xe && typeof a.children == "string" && !a.children.trim())
+  );
+  if (n.length !== 1) return null;
+  const t = n[0];
+  return t.type === U && Array.isArray(t.children) ? Ee(t.children) : t;
+}
+function Da(e) {
+  if (e instanceof HTMLElement) return e;
+  const n = e?.$el;
+  return n instanceof HTMLElement ? n : null;
+}
+const Ba = z({
+  name: "DropdownMenuTrigger",
+  inheritAttrs: !1,
+  props: {
+    /** Sin envoltorio: los atributos van sobre el hijo que se le pasó. */
+    asChild: { type: Boolean, default: !1 },
+    /** El disparador no abre nada; lo abre la aplicación por su cuenta. */
+    disabled: { type: Boolean, default: !1 }
+  },
+  setup(e, { slots: n, attrs: t }) {
+    const a = Z(), o = w(null);
+    function s() {
+      a.ponerElDisparador(Da(o.value));
+    }
+    function u() {
+      e.disabled || (s(), a.alternar());
+    }
+    function r(c) {
+      if (!e.disabled)
+        switch (c.key) {
+          case "Enter":
+          case " ":
+            c.preventDefault(), s(), a.alternar("primero");
+            break;
+          case "ArrowDown":
+            c.preventDefault(), s(), a.abrir("primero");
+            break;
+          case "ArrowUp":
+            c.preventDefault(), s(), a.abrir("ultimo");
+            break;
+          case "Escape":
+            a.abierto.value && (c.preventDefault(), a.cerrar({ devolverElFoco: !0 }));
+            break;
+        }
+    }
+    return () => {
+      const c = {
+        ref: ($) => {
+          o.value = $, s();
+        },
+        "aria-haspopup": "menu",
+        "aria-expanded": a.abierto.value ? "true" : "false",
+        // Sólo cuando hay algo que controlar: `aria-controls` apuntando
+        // a un elemento que el lector no expone —el menú cerrado está
+        // `inert`— es una referencia rota.
+        "aria-controls": a.abierto.value ? a.idDelMenu : void 0,
+        onClick: u,
+        onKeydown: r
+      }, b = n.default?.() ?? [];
+      if (e.asChild) {
+        const $ = Ee(b);
+        if ($) return We($, { ...t, ...c });
+      }
+      return Ke(
+        "div",
+        { ...t, class: ["dropdown-menu-trigger inline-block", t.class], ...c },
+        b
+      );
+    };
+  }
+}), Aa = ["for"], Ma = /* @__PURE__ */ z({
   __name: "FormGroup",
   props: {
     label: {},
@@ -1018,30 +1433,30 @@ const gt = ["title", "aria-label"], yt = ["title", "aria-label"], ht = ["title",
     labelClass: { default: () => ({}) }
   },
   setup(e) {
-    return (s, t) => (l(), n("div", {
-      class: d(["flex flex-col gap-2", e.customClass])
+    return (n, t) => (l(), i("div", {
+      class: p(["flex flex-col gap-2", e.customClass])
     }, [
-      e.label ? (l(), n("label", {
+      e.label ? (l(), i("label", {
         key: 0,
         for: e.htmlFor,
-        class: d(["text-sm font-medium text-primary dark:text-primary-dark", e.labelClass])
-      }, w(e.label), 11, na)) : f("", !0),
-      T(s.$slots, "default", {}, void 0, !0)
+        class: p(["text-sm font-medium text-primary dark:text-primary-dark", e.labelClass])
+      }, I(e.label), 11, Aa)) : g("", !0),
+      A(n.$slots, "default", {}, void 0, !0)
     ], 2));
   }
-}), sa = /* @__PURE__ */ K(oa, [["__scopeId", "data-v-c0d9d9cb"]]), ia = /* @__PURE__ */ L({
+}), Sa = /* @__PURE__ */ Q(Ma, [["__scopeId", "data-v-c0d9d9cb"]]), Ta = /* @__PURE__ */ z({
   __name: "ListCard",
   props: {
     clickable: { type: Boolean, default: !1 },
     customClass: { default: () => ({}) }
   },
   emits: ["click"],
-  setup(e, { emit: s }) {
-    const t = e, a = s, o = () => {
+  setup(e, { emit: n }) {
+    const t = e, a = n, o = () => {
       t.clickable && a("click");
     };
-    return (i, c) => (l(), n("div", {
-      class: d([
+    return (s, u) => (l(), i("div", {
+      class: p([
         "flex items-center justify-between background p-3 rounded-vsk border border-vsk-primary/70 transition-colors duration-200",
         {
           "hover:bg-vsk-primary/5 cursor-pointer": t.clickable
@@ -1050,13 +1465,13 @@ const gt = ["title", "aria-label"], yt = ["title", "aria-label"], ht = ["title",
       ]),
       onClick: o
     }, [
-      T(i.$slots, "default", {}, void 0, !0)
+      A(s.$slots, "default", {}, void 0, !0)
     ], 2));
   }
-}), ra = /* @__PURE__ */ K(ia, [["__scopeId", "data-v-f86d47da"]]), ua = { class: "background rounded-corner flex flex-row items-center gap-2 justify-between w-full h-auto p-4 transition-all duration-200 hover:bg-ui-surface/80 dark:hover:bg-ui-surface-dark/80" }, ca = ["src", "alt", "title"], da = {
+}), Ia = /* @__PURE__ */ Q(Ta, [["__scopeId", "data-v-f86d47da"]]), Oa = { class: "background rounded-corner flex flex-row items-center gap-2 justify-between w-full h-auto p-4 transition-all duration-200 hover:bg-ui-surface/80 dark:hover:bg-ui-surface-dark/80" }, ja = ["src", "alt", "title"], Va = {
   key: 1,
   class: "w-8 h-8 flex items-center justify-center"
-}, fa = ["src", "alt"], ma = ["min", "max", "value"], ba = /* @__PURE__ */ L({
+}, Pa = ["src", "alt"], Fa = ["min", "max", "value"], Na = /* @__PURE__ */ z({
   __name: "SliderControl",
   props: {
     icon: {},
@@ -1070,50 +1485,50 @@ const gt = ["title", "aria-label"], yt = ["title", "aria-label"], ht = ["title",
     getPercentageClass: { type: Function, default: () => "" }
   },
   emits: ["update:modelValue", "buttonClick"],
-  setup(e, { emit: s }) {
-    const t = e, a = s, o = y(() => {
+  setup(e, { emit: n }) {
+    const t = e, a = n, o = x(() => {
       if (t.max <= t.min) return 0;
-      const m = t.max - t.min, v = t.modelValue - t.min;
-      return Math.round(v / m * 100);
-    }), i = y(() => t.getPercentageClass ? t.getPercentageClass(o.value) : ""), c = (m) => {
-      const v = m.target;
-      a("update:modelValue", Number(v.value));
-    }, u = () => {
+      const c = t.max - t.min, b = t.modelValue - t.min;
+      return Math.round(b / c * 100);
+    }), s = x(() => t.getPercentageClass ? t.getPercentageClass(o.value) : ""), u = (c) => {
+      const b = c.target;
+      a("update:modelValue", Number(b.value));
+    }, r = () => {
       a("buttonClick");
     };
-    return (m, v) => (l(), n("div", ua, [
-      e.showButton ? (l(), n("button", {
+    return (c, b) => (l(), i("div", Oa, [
+      e.showButton ? (l(), i("button", {
         key: 0,
-        onClick: u,
+        onClick: r,
         class: "w-8 h-8 flex items-center justify-center rounded-corner transition-all duration-200 hover:bg-ui-surface/80 dark:hover:bg-ui-surface-dark/80 hover:scale-110 active:scale-95"
       }, [
-        h("img", {
+        C("img", {
           src: e.icon,
           alt: e.alt,
           title: e.tooltip,
-          class: d(["w-6 h-6 transition-all duration-200", e.iconClass])
-        }, null, 10, ca)
-      ])) : (l(), n("div", da, [
-        h("img", {
+          class: p(["w-6 h-6 transition-all duration-200", e.iconClass])
+        }, null, 10, ja)
+      ])) : (l(), i("div", Va, [
+        C("img", {
           src: e.icon,
           alt: e.alt,
           class: "w-6 h-6 transition-all duration-200"
-        }, null, 8, fa)
+        }, null, 8, Pa)
       ])),
-      h("input", {
+      C("input", {
         type: "range",
         min: e.min,
         max: e.max,
         value: e.modelValue,
-        onInput: c,
+        onInput: u,
         class: "flex-1 transition-all duration-200 hover:scale-105"
-      }, null, 40, ma),
-      h("span", {
-        class: d(["w-12 text-right transition-all duration-200 font-medium", i.value])
-      }, w(o.value) + "% ", 3)
+      }, null, 40, Fa),
+      C("span", {
+        class: p(["w-12 text-right transition-all duration-200 font-medium", s.value])
+      }, I(o.value) + "% ", 3)
     ]));
   }
-}), va = ["disabled"], ga = /* @__PURE__ */ L({
+}), Ra = ["disabled"], qa = /* @__PURE__ */ z({
   __name: "SwitchToggle",
   props: {
     isOn: { type: Boolean },
@@ -1124,15 +1539,15 @@ const gt = ["title", "aria-label"], yt = ["title", "aria-label"], ht = ["title",
     customClass: { default: "" }
   },
   emits: ["toggle"],
-  setup(e, { emit: s }) {
-    const t = e, a = s, o = () => {
+  setup(e, { emit: n }) {
+    const t = e, a = n, o = () => {
       a("toggle", !t.isOn);
     };
-    return (i, c) => (l(), n("button", {
+    return (s, u) => (l(), i("button", {
       type: "button",
       onClick: o,
       disabled: e.disabled,
-      class: d([
+      class: p([
         "relative inline-flex items-center rounded-full transition-colors",
         e.size === "small" ? "h-6 w-11" : "h-7 w-12",
         e.isOn ? e.activeClass : e.inactiveClass,
@@ -1140,16 +1555,16 @@ const gt = ["title", "aria-label"], yt = ["title", "aria-label"], ht = ["title",
         e.customClass
       ])
     }, [
-      h("span", {
-        class: d([
+      C("span", {
+        class: p([
           "inline-block transform rounded-full bg-white shadow transition-transform",
           e.size === "small" ? "h-4 w-4" : "h-6 w-6",
           e.isOn ? e.size === "small" ? "translate-x-6" : "translate-x-5" : "translate-x-1"
         ])
       }, null, 2)
-    ], 10, va));
+    ], 10, Ra));
   }
-}), ya = ["disabled"], ha = ["src", "alt", "title"], pa = /* @__PURE__ */ L({
+}), Ha = ["disabled"], Ua = ["src", "alt", "title"], Wa = /* @__PURE__ */ z({
   __name: "ToggleControl",
   props: {
     icon: {},
@@ -1161,13 +1576,13 @@ const gt = ["title", "aria-label"], yt = ["title", "aria-label"], ht = ["title",
     customClass: { default: () => ({}) }
   },
   emits: ["click"],
-  setup(e, { emit: s }) {
-    const t = s, a = () => {
+  setup(e, { emit: n }) {
+    const t = n, a = () => {
       t("click");
     };
-    return (o, i) => (l(), n("button", {
+    return (o, s) => (l(), i("button", {
       onClick: a,
-      class: d(["p-2 rounded-corner background hover:opacity-50 transition-all duration-300 h-17.5 w-17.5 group relative overflow-hidden hover:scale-105 hover:shadow-lg active:scale-95", {
+      class: p(["p-2 rounded-corner background hover:opacity-50 transition-all duration-300 h-17.5 w-17.5 group relative overflow-hidden hover:scale-105 hover:shadow-lg active:scale-95", {
         "animate-pulse": e.isLoading,
         "ring-2 ring-primary dark:ring-primary-dark": e.isActive,
         "opacity-60": !e.isActive,
@@ -1175,23 +1590,23 @@ const gt = ["title", "aria-label"], yt = ["title", "aria-label"], ht = ["title",
       }]),
       disabled: e.isLoading
     }, [
-      h("img", {
+      C("img", {
         src: e.icon,
         alt: e.alt,
         title: e.tooltip,
-        class: d(["m-auto w-12.5 h-12.5 transition-all duration-300 group-hover:scale-110 relative z-10", {
+        class: p(["m-auto w-12.5 h-12.5 transition-all duration-300 group-hover:scale-110 relative z-10", {
           "animate-spin": e.isLoading,
           "filter brightness-75": !e.isActive,
           "drop-shadow-lg": e.isActive,
           ...e.iconClass
         }])
-      }, null, 10, ha)
-    ], 10, ya));
+      }, null, 10, Ua)
+    ], 10, Ha));
   }
-}), xa = ["title"], ka = ["src", "alt"], $a = {
+}), Ka = ["title"], Ga = ["src", "alt"], Xa = {
   key: 0,
   class: "absolute bottom-1 right-1 bg-primary dark:bg-primary-dark text-white text-xs rounded-full w-4 h-4 flex items-center justify-center font-bold animate-bounce"
-}, wa = /* @__PURE__ */ L({
+}, Ya = /* @__PURE__ */ z({
   __name: "TrayIconButton",
   props: {
     icon: {},
@@ -1205,91 +1620,106 @@ const gt = ["title", "aria-label"], yt = ["title", "aria-label"], ht = ["title",
     customTooltipText: { default: "" }
   },
   emits: ["click"],
-  setup(e, { emit: s }) {
-    const t = s, a = S(!1), o = () => {
+  setup(e, { emit: n }) {
+    const t = n, a = w(!1), o = () => {
       t("click");
     };
-    return (i, c) => (l(), n("div", {
-      class: d(["p-1 rounded-corner relative hover:bg-primary dark:hover:bg-primary-dark group transition-all duration-300", e.customClass]),
+    return (s, u) => (l(), i("div", {
+      class: p(["p-1 rounded-corner relative hover:bg-primary dark:hover:bg-primary-dark group transition-all duration-300", e.customClass]),
       title: e.tooltip,
       onClick: o,
-      onMouseenter: c[0] || (c[0] = (u) => a.value = !0),
-      onMouseleave: c[1] || (c[1] = (u) => a.value = !1)
+      onMouseenter: u[0] || (u[0] = (r) => a.value = !0),
+      onMouseleave: u[1] || (u[1] = (r) => a.value = !1)
     }, [
-      h("img", {
+      C("img", {
         src: e.icon,
         alt: e.alt,
-        class: d(["m-auto h-5.5 w-auto transition-all duration-300", e.iconClass])
-      }, null, 10, ka),
-      e.badge !== null && e.badge > 0 ? (l(), n("div", $a, w(e.badge), 1)) : f("", !0),
-      e.showCustomTooltip && e.customTooltipText ? (l(), n("div", {
+        class: p(["m-auto h-5.5 w-auto transition-all duration-300", e.iconClass])
+      }, null, 10, Ga),
+      e.badge !== null && e.badge > 0 ? (l(), i("div", Xa, I(e.badge), 1)) : g("", !0),
+      e.showCustomTooltip && e.customTooltipText ? (l(), i("div", {
         key: 1,
-        class: d(["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", [
+        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", [
           e.tooltipClass,
           {
             "opacity-0 -translate-y-2": !a.value,
             "opacity-100 translate-y-0": a.value
           }
         ]])
-      }, w(e.customTooltipText), 3)) : f("", !0),
-      T(i.$slots, "default")
-    ], 42, xa));
+      }, I(e.customTooltipText), 3)) : g("", !0),
+      A(s.$slots, "default")
+    ], 42, Ka));
   }
-}), Ca = [
-  nt,
-  ce,
-  ue,
-  ut,
-  M,
+}), Ja = [
+  yt,
+  xe,
+  he,
   $t,
-  fe,
-  de,
-  It,
-  me,
-  Pt,
+  N,
+  jt,
+  $e,
+  we,
   Xt,
-  qt,
-  la,
-  sa,
+  Ce,
+  Zt,
+  oa,
   ra,
-  ba,
   ga,
-  pa,
-  wa
-], Aa = {
+  ha,
+  wa,
+  Ca,
+  za,
+  Ea,
+  Ba,
+  Sa,
+  Ia,
+  Na,
+  qa,
+  Wa,
+  Ya
+], tn = {
   install(e) {
-    Ca.forEach((s) => {
-      e.component(s.name, s);
+    Ja.forEach((n) => {
+      e.component(n.name, n);
     });
   }
 };
 export {
-  Xt as ActionButton,
-  fe as AppBar,
-  Pt as BarSearch,
-  ee as CLAVE_DE_LA_BARRA,
-  qt as ConfigSection,
-  la as DeviceCard,
-  sa as FormGroup,
-  ra as ListCard,
-  ct as POSICIONES,
-  ut as SelectField,
-  nt as SideBar,
-  ce as SideButton,
-  ue as SideGroup,
-  ba as SliderControl,
-  ga as SwitchToggle,
-  It as TabBar,
-  me as TabItem,
-  M as ThemeIcon,
-  pa as ToggleControl,
-  wa as TrayIconButton,
-  de as WindowControls,
-  $t as WindowFrame,
-  Aa as default,
-  dt as esPosicion,
-  J as orientacionDe,
-  bt as posicionDe,
-  G as usarLaBarra,
-  vt as usarLaPosicionDeLaBarra
+  oa as ActionButton,
+  $e as AppBar,
+  Zt as BarSearch,
+  ze as CLAVE_DEL_MENU,
+  le as CLAVE_DE_LA_BARRA,
+  ra as ConfigSection,
+  ga as DeviceCard,
+  ha as DropdownMenu,
+  wa as DropdownMenuContent,
+  Ca as DropdownMenuItem,
+  za as DropdownMenuLabel,
+  Ea as DropdownMenuSeparator,
+  Ba as DropdownMenuTrigger,
+  Sa as FormGroup,
+  oe as LOS_TRES_CONTROLES,
+  Ia as ListCard,
+  Ct as POSICIONES,
+  $t as SelectField,
+  yt as SideBar,
+  xe as SideButton,
+  he as SideGroup,
+  Na as SliderControl,
+  qa as SwitchToggle,
+  Xt as TabBar,
+  Ce as TabItem,
+  N as ThemeIcon,
+  Wa as ToggleControl,
+  Ya as TrayIconButton,
+  we as WindowControls,
+  jt as WindowFrame,
+  tn as default,
+  zt as esPosicion,
+  te as orientacionDe,
+  Dt as posicionDe,
+  Z as usarElMenu,
+  X as usarLaBarra,
+  Bt as usarLaPosicionDeLaBarra
 };