npm - @vasakgroup/vue-libvasak - Versions diffs - 1.2.0 → 1.4.0 - Mend

@vasakgroup/vue-libvasak 1.2.0 → 1.4.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (8) hide show

package/dist/types/cards/DeviceCard.vue.d.ts +9 -1
package/dist/types/controls/ToggleControl.vue.d.ts +9 -15
package/dist/types/forms/SliderControl.vue.d.ts +9 -1
package/dist/types/internos/iconoDelTema.d.ts +22 -1
package/dist/types/tray/TrayIconButton.vue.d.ts +11 -3
package/dist/vue-libvasak.es.js +1036 -904
package/dist/vue-libvasak.umd.js +1 -1
package/package.json +1 -1

package/dist/vue-libvasak.es.js CHANGED Viewed

@@ -1,63 +1,119 @@
-import { ref as w, onMounted as X, onUnmounted as ce, readonly as it, watch as W, defineComponent as E, toRef as Ae, computed as v, createElementBlock as i, unref as R, openBlock as r, normalizeStyle as se, createCommentVNode as x, createElementVNode as T, createVNode as O, toDisplayString as V, normalizeClass as h, renderSlot as S, createBlock as Q, onBeforeUnmount as de, Fragment as Z, renderList as le, withCtx as K, mergeModels as Se, useAttrs as Ce, useId as st, useModel as ut, withDirectives as ze, mergeProps as re, isRef as ct, vModelSelect as dt, inject as pe, getCurrentInstance as Re, provide as fe, createTextVNode as Le, toHandlers as qe, createSlots as ft, withModifiers as M, withKeys as F, Teleport as me, Transition as ye, nextTick as Y, TransitionGroup as mt, vShow as Ne, cloneVNode as bt, h as vt, Comment as pt, Text as yt } from "vue";
-import { listen as gt } from "@tauri-apps/api/event";
-import { getSymbolSource as ht, getIconSource as xt } from "@vasakgroup/plugin-vicons";
-import { getCurrentWindow as wt } from "@tauri-apps/api/window";
-import { useI18n as kt } from "@vasakgroup/tauri-plugin-i18n";
-const $t = "vicons:theme-changed", ve = /* @__PURE__ */ new Map(), ae = /* @__PURE__ */ new Map(), oe = w(0);
-let ne = 0, ue = null, te = null;
-function Bl() {
-  ve.clear(), ae.clear(), ne = 0, ue = null, te = null, oe.value = 0;
+import { ref as w, onMounted as W, onUnmounted as ve, readonly as vt, watch as Q, defineComponent as D, toRef as Pe, useTemplateRef as pt, computed as v, createElementBlock as r, unref as F, openBlock as i, normalizeStyle as fe, createCommentVNode as x, createElementVNode as B, createVNode as O, toDisplayString as M, normalizeClass as y, renderSlot as S, createBlock as U, onBeforeUnmount as pe, Fragment as te, renderList as ue, withCtx as G, mergeModels as Re, useAttrs as Be, useId as yt, useModel as gt, withDirectives as Se, mergeProps as ce, isRef as ht, vModelSelect as xt, inject as we, getCurrentInstance as Ge, provide as ye, createTextVNode as Me, toHandlers as Qe, createSlots as wt, withModifiers as V, withKeys as R, Teleport as ge, Transition as ke, nextTick as J, TransitionGroup as kt, vShow as Ye, cloneVNode as $t, h as Ct, Comment as zt, Text as Et } from "vue";
+import { listen as Lt } from "@tauri-apps/api/event";
+import { getSymbolSource as Dt, getIconSource as Tt } from "@vasakgroup/plugin-vicons";
+import { getCurrentWindow as At } from "@tauri-apps/api/window";
+import { useI18n as Bt } from "@vasakgroup/tauri-plugin-i18n";
+const St = "vicons:theme-changed", xe = /* @__PURE__ */ new Map(), re = /* @__PURE__ */ new Map(), me = w(0);
+let se = 0, be = null, ie = null;
+function Ql() {
+  xe.clear(), re.clear(), se = 0, be = null, ie = null, me.value = 0, ae.clear(), ne.clear(), Xe = 0, ee?.disconnect(), ee = null, De = !1, X !== null && (clearTimeout(X), X = null), _ && (_.cancelado = !0), _ = null;
 }
-function Ct() {
-  ve.clear(), ae.clear(), oe.value++;
+const Mt = 100, ze = 10, Vt = 16, ae = /* @__PURE__ */ new Map(), ne = /* @__PURE__ */ new Set();
+let Xe = 0, ee = null, De = !1;
+function It() {
+  return De ? ee : (De = !0, typeof IntersectionObserver > "u" ? null : (ee = new IntersectionObserver(
+    (e) => {
+      for (const n of e) {
+        const t = n.target.dataset?.iconoId;
+        if (t == null) continue;
+        const a = Number.parseInt(t, 10);
+        n.isIntersecting ? ne.add(a) : ne.delete(a);
+      }
+    },
+    { threshold: 0 }
+  ), ee));
+}
+function Ot(e) {
+  const n = Xe++;
+  return ae.set(n, { recargar: e, elemento: null }), ne.add(n), n;
+}
+function jt(e, n) {
+  const t = ae.get(e);
+  if (!t || t.elemento === n || (t.elemento && (ee?.unobserve(t.elemento), delete t.elemento.dataset.iconoId, t.elemento = null), !n)) return;
+  const a = It();
+  a && (t.elemento = n, n.dataset.iconoId = String(e), a.observe(n));
+}
+function Pt(e) {
+  const n = ae.get(e);
+  n?.elemento && (ee?.unobserve(n.elemento), delete n.elemento.dataset.iconoId), ne.delete(e), ae.delete(e);
+}
+let X = null, _ = null;
+function Rt(e) {
+  return new Promise((n) => setTimeout(n, e));
+}
+async function Ft(e) {
+  const n = [...ae.keys()], t = n.filter((l) => ne.has(l)), a = n.filter((l) => !ne.has(l));
+  for (const l of [t, a])
+    for (let o = 0; o < l.length; o += ze) {
+      if (e.cancelado) return;
+      const s = l.slice(o, o + ze);
+      if (await Promise.allSettled(
+        s.map((u) => ae.get(u)?.recargar() ?? Promise.resolve())
+      ), e.cancelado) return;
+      (o + ze < l.length || l === t) && await Rt(Vt);
+    }
+  _ === e && (_ = null);
+}
+function Nt() {
+  X !== null && (clearTimeout(X), X = null), _ && (_.cancelado = !0);
+  const e = { cancelado: !1 };
+  _ = e, Ft(e);
+}
+function qt() {
+  xe.clear(), re.clear(), me.value++, X !== null && clearTimeout(X), X = setTimeout(() => {
+    X = null, Nt();
+  }, Mt);
 }
-function He() {
-  return ne++, ue || te ? te ?? Promise.resolve() : (te = gt($t, Ct).then((e) => {
-    ne <= 0 ? e() : ue = e, te = null;
-  }), te);
+function Je() {
+  return se++, be || ie ? ie ?? Promise.resolve() : (ie = Lt(St, qt).then((e) => {
+    se <= 0 ? e() : be = e, ie = null;
+  }), ie);
 }
-function ke() {
-  ne--, !(ne > 0) && (ne = 0, ue?.(), ue = null);
+function Te() {
+  se--, !(se > 0) && (se = 0, be?.(), be = null);
 }
-function zt(e, n) {
-  const t = `${n}:${e}`, a = ve.get(t);
+function Ht(e, n) {
+  const t = `${n}:${e}`, a = xe.get(t);
   if (a !== void 0)
     return Promise.resolve(a);
-  const l = ae.get(t);
+  const l = re.get(t);
   if (l)
     return l;
-  const o = oe.value, s = (n === "symbol" ? ht(e) : xt(e)).then((u) => (oe.value === o && ve.set(t, u), u)).finally(() => {
-    ae.get(t) === s && ae.delete(t);
+  const o = me.value, s = (n === "symbol" ? Dt(e) : Tt(e)).then((u) => (me.value === o && xe.set(t, u), u)).finally(() => {
+    re.get(t) === s && re.delete(t);
   });
-  return ae.set(t, s), s;
+  return re.set(t, s), s;
 }
-function Al() {
+function Yl() {
   let e = !1;
-  return X(async () => {
-    await He(), e && ke();
-  }), ce(() => {
-    e || (e = !0, ke());
-  }), it(oe);
+  return W(async () => {
+    await Je(), e && Te();
+  }), ve(() => {
+    e || (e = !0, Te());
+  }), vt(me);
 }
-function Lt(e, n) {
+function Ut(e, n) {
   const t = w("");
   let a = !1, l = 0;
-  async function o() {
-    const s = ++l, u = e.value;
-    if (!u) {
+  const o = Ot(async () => {
+    await s();
+  });
+  async function s() {
+    const u = ++l, m = e.value;
+    if (!m) {
       t.value = "";
       return;
     }
-    const m = await zt(u, n.value);
-    s === l && !a && (t.value = m);
+    const f = await Ht(m, n.value);
+    u === l && !a && (t.value = f);
   }
-  return X(async () => {
-    await He(), a || await o();
-  }), ce(() => {
-    a = !0, ke();
-  }), W([e, n], o), W(oe, o), t;
+  return W(async () => {
+    await Je(), a || await s();
+  }), ve(() => {
+    a = !0, Pt(o), Te();
+  }), Q([e, n], s), { fuente: t, mirarElemento: (u) => jt(o, u) };
 }
-const Dt = ["src", "alt"], H = /* @__PURE__ */ E({
+const Kt = ["src", "alt"], N = /* @__PURE__ */ D({
   __name: "ThemeIcon",
   props: {
     name: {},
@@ -66,23 +122,29 @@ const Dt = ["src", "alt"], H = /* @__PURE__ */ E({
     alt: { default: "" }
   },
   setup(e) {
-    const n = e, t = Lt(Ae(n, "name"), Ae(n, "type")), a = v(() => `${n.size}px`);
-    return (l, o) => R(t) ? (r(), i("img", {
+    const n = e, { fuente: t, mirarElemento: a } = Ut(Pe(n, "name"), Pe(n, "type")), l = pt("dibujo");
+    Q(l, (s) => a(s), { immediate: !0 });
+    const o = v(() => `${n.size}px`);
+    return (s, u) => F(t) ? (i(), r("img", {
       key: 0,
-      src: R(t),
+      ref_key: "dibujo",
+      ref: l,
+      src: F(t),
       alt: e.alt,
-      style: se({ width: a.value, height: a.value }),
+      style: fe({ width: o.value, height: o.value }),
       class: "shrink-0 object-contain"
-    }, null, 12, Dt)) : (r(), i("span", {
+    }, null, 12, Kt)) : (i(), r("span", {
       key: 1,
-      style: se({ width: a.value, height: a.value }),
+      ref_key: "dibujo",
+      ref: l,
+      style: fe({ width: o.value, height: o.value }),
       class: "shrink-0"
     }, null, 4));
   }
-}), Et = { class: "flex flex-col gap-2" }, Tt = ["aria-expanded"], Bt = {
+}), Wt = { class: "flex flex-col gap-2" }, Gt = ["aria-expanded"], Qt = {
   key: 1,
   class: "flex flex-col gap-1"
-}, Ue = /* @__PURE__ */ E({
+}, Ze = /* @__PURE__ */ D({
   __name: "SideGroup",
   props: {
     title: {},
@@ -91,39 +153,39 @@ const Dt = ["src", "alt"], H = /* @__PURE__ */ E({
   },
   setup(e) {
     const n = e, t = w(n.defaultOpen);
-    return W(
+    return Q(
       () => n.collapsed,
       (a) => {
         a && (t.value = !0);
       }
-    ), (a, l) => (r(), i("section", Et, [
-      e.collapsed ? x("", !0) : (r(), i("button", {
+    ), (a, l) => (i(), r("section", Wt, [
+      e.collapsed ? x("", !0) : (i(), r("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: l[0] || (l[0] = (o) => t.value = !t.value)
       }, [
-        T("span", null, V(e.title), 1),
-        O(H, {
+        B("span", null, M(e.title), 1),
+        O(N, {
           name: "pan-down-symbolic",
           type: "symbol",
           size: 12,
-          class: h(["transition-transform duration-200", t.value ? "" : "-rotate-90"])
+          class: y(["transition-transform duration-200", t.value ? "" : "-rotate-90"])
         }, null, 8, ["class"])
-      ], 8, Tt)),
-      t.value || e.collapsed ? (r(), i("div", Bt, [
+      ], 8, Gt)),
+      t.value || e.collapsed ? (i(), r("div", Qt, [
         S(a.$slots, "default")
       ])) : x("", !0)
     ]));
   }
-}), At = ["title", "aria-label", "disabled", "aria-current"], St = { key: 1 }, Vt = {
+}), Yt = ["title", "aria-label", "disabled", "aria-current"], Xt = { key: 1 }, Jt = {
   key: 0,
   class: "min-w-0 flex-1 truncate font-medium"
-}, Mt = {
+}, Zt = {
   key: 1,
   class: "rounded-corner bg-ui-surface px-2 py-0.5 font-semibold text-tx-muted text-xs"
-}, Ke = /* @__PURE__ */ E({
+}, _e = /* @__PURE__ */ D({
   __name: "SideButton",
   props: {
     label: {},
@@ -135,49 +197,49 @@ const Dt = ["src", "alt"], H = /* @__PURE__ */ E({
   },
   emits: ["click"],
   setup(e) {
-    return (n, t) => (r(), i("button", {
+    return (n, t) => (i(), r("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: h(["group relative flex w-full items-center gap-3 rounded-corner border px-3 py-2 text-left text-sm transition-[color,background-color,border-color,scale] duration-200 active:scale-[0.98]", [
+      class: y(["group relative flex w-full items-center gap-3 rounded-corner border px-3 py-2 text-left text-sm transition-[color,background-color,border-color,scale] duration-200 active:scale-[0.98]", [
         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) => n.$emit("click"))
     }, [
-      T("span", {
-        class: h(["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" : ""]),
+      B("span", {
+        class: y(["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 ? (r(), Q(H, {
+        e.icon ? (i(), U(N, {
           key: 0,
           name: e.icon,
           size: 20
-        }, null, 8, ["name"])) : (r(), i("span", St, V(e.label.charAt(0).toUpperCase()), 1))
+        }, null, 8, ["name"])) : (i(), r("span", Xt, M(e.label.charAt(0).toUpperCase()), 1))
       ], 2),
-      e.collapsed ? x("", !0) : (r(), i("span", Vt, V(e.label), 1)),
-      !e.collapsed && e.badge !== "" ? (r(), i("span", Mt, V(e.badge), 1)) : x("", !0)
-    ], 10, At));
+      e.collapsed ? x("", !0) : (i(), r("span", Jt, M(e.label), 1)),
+      !e.collapsed && e.badge !== "" ? (i(), r("span", Zt, M(e.badge), 1)) : x("", !0)
+    ], 10, Yt));
   }
-}), It = {
+}), _t = {
   key: 0,
   class: "flex flex-col gap-2 border-ui-border border-b p-2"
-}, Ot = { class: "flex items-center gap-2" }, jt = ["aria-label", "aria-expanded"], Pt = {
+}, ea = { class: "flex items-center gap-2" }, ta = ["aria-label", "aria-expanded"], aa = {
   key: 0,
   class: "min-w-0 flex-1"
-}, Ft = {
+}, na = {
   key: 0,
   class: "truncate font-semibold text-sm"
-}, Rt = {
+}, la = {
   key: 1,
   class: "truncate text-tx-muted text-xs"
-}, qt = { key: 0 }, Nt = {
+}, oa = { key: 0 }, ia = {
   key: 1,
   class: "flex border-ui-border border-b p-2"
-}, Ht = ["aria-label", "aria-expanded"], Ut = { 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", Me = 767, Kt = /* @__PURE__ */ E({
+}, ra = ["aria-label", "aria-expanded"], sa = { class: "flex min-h-0 flex-1 flex-col gap-3 overflow-y-auto p-2" }, Fe = "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, ua = /* @__PURE__ */ D({
   __name: "SideBar",
   props: {
     title: { default: "" },
@@ -194,84 +256,84 @@ const Dt = ["src", "alt"], H = /* @__PURE__ */ E({
     let u = null, m = null;
     const f = v(() => s.value || o.value), d = v(() => !!(a.title || a.subtitle));
     v(() => a.categories.length > 0);
-    function L() {
+    function E() {
       return document.documentElement?.clientWidth || window.innerWidth;
     }
-    function D() {
-      s.value = L() <= Me;
+    function L() {
+      s.value = E() <= Ne;
     }
     function A() {
       o.value = !o.value, l("update:collapsed", o.value);
     }
-    function y($) {
+    function g($) {
       l("update:modelValue", $), l("change", $);
     }
-    return W(
+    return Q(
       () => a.collapsed,
       ($) => {
         $ !== void 0 && (o.value = $);
       }
-    ), X(() => {
-      u = window.matchMedia(`(max-width: ${Me}px)`), D(), u.addEventListener("change", D), window.addEventListener("resize", D), typeof ResizeObserver < "u" && document.documentElement && (m = new ResizeObserver(D), m.observe(document.documentElement));
-    }), de(() => {
-      u?.removeEventListener("change", D), window.removeEventListener("resize", D), m?.disconnect(), m = null;
-    }), n({ collapsed: f }), ($, j) => (r(), i("aside", {
-      class: h(["relative z-30 flex h-full shrink-0 flex-col rounded-corner border border-ui-border bg-ui-surface/70 transition-[width] duration-300", ["w-[84px]", f.value ? "md:w-[84px]" : "md:w-72"]])
+    ), W(() => {
+      u = window.matchMedia(`(max-width: ${Ne}px)`), L(), u.addEventListener("change", L), window.addEventListener("resize", L), typeof ResizeObserver < "u" && document.documentElement && (m = new ResizeObserver(L), m.observe(document.documentElement));
+    }), pe(() => {
+      u?.removeEventListener("change", L), window.removeEventListener("resize", L), m?.disconnect(), m = null;
+    }), n({ collapsed: f }), ($, j) => (i(), r("aside", {
+      class: y(["relative z-30 flex h-full shrink-0 flex-col rounded-corner border border-ui-border bg-ui-surface/70 transition-[width] duration-300", ["w-[84px]", f.value ? "md:w-[84px]" : "md:w-72"]])
     }, [
-      d.value || $.$slots.header ? (r(), i("header", It, [
-        T("div", Ot, [
-          T("button", {
+      d.value || $.$slots.header ? (i(), r("header", _t, [
+        B("div", ea, [
+          B("button", {
             type: "button",
-            class: h(Ve),
+            class: y(Fe),
             "aria-label": f.value ? e.expandLabel : e.collapseLabel,
             "aria-expanded": !f.value,
             onClick: A
           }, [
-            O(H, {
+            O(N, {
               name: f.value ? "pan-end-symbolic" : "pan-start-symbolic",
               type: "symbol",
               size: 16
             }, null, 8, ["name"])
-          ], 8, jt),
-          d.value && !f.value ? (r(), i("div", Pt, [
-            e.title ? (r(), i("p", Ft, V(e.title), 1)) : x("", !0),
-            e.subtitle ? (r(), i("p", Rt, V(e.subtitle), 1)) : x("", !0)
+          ], 8, ta),
+          d.value && !f.value ? (i(), r("div", aa, [
+            e.title ? (i(), r("p", na, M(e.title), 1)) : x("", !0),
+            e.subtitle ? (i(), r("p", la, M(e.subtitle), 1)) : x("", !0)
           ])) : x("", !0)
         ]),
-        $.$slots.header && !f.value ? (r(), i("div", qt, [
+        $.$slots.header && !f.value ? (i(), r("div", oa, [
           S($.$slots, "header", { collapsed: f.value })
         ])) : x("", !0)
-      ])) : (r(), i("div", Nt, [
-        T("button", {
+      ])) : (i(), r("div", ia, [
+        B("button", {
           type: "button",
-          class: h(Ve),
+          class: y(Fe),
           "aria-label": f.value ? e.expandLabel : e.collapseLabel,
           "aria-expanded": !f.value,
           onClick: A
         }, [
-          O(H, {
+          O(N, {
             name: f.value ? "pan-end-symbolic" : "pan-start-symbolic",
             type: "symbol",
             size: 16
           }, null, 8, ["name"])
-        ], 8, Ht)
+        ], 8, ra)
       ])),
-      T("div", Ut, [
-        (r(!0), i(Z, null, le(e.categories, (C) => (r(), Q(Ue, {
+      B("div", sa, [
+        (i(!0), r(te, null, ue(e.categories, (C) => (i(), U(Ze, {
           key: C.id,
           title: C.title,
           collapsed: f.value
         }, {
-          default: K(() => [
-            (r(!0), i(Z, null, le(C.items, (g) => (r(), Q(Ke, {
-              key: g.id,
-              label: g.label,
-              icon: g.icon,
-              badge: g.badge,
-              disabled: g.disabled,
+          default: G(() => [
+            (i(!0), r(te, null, ue(C.items, (h) => (i(), U(_e, {
+              key: h.id,
+              label: h.label,
+              icon: h.icon,
+              badge: h.badge,
+              disabled: h.disabled,
               collapsed: f.value,
-              active: e.modelValue === g.id,
-              onClick: (c) => y(g.id)
+              active: e.modelValue === h.id,
+              onClick: (c) => g(h.id)
             }, null, 8, ["label", "icon", "badge", "disabled", "collapsed", "active", "onClick"]))), 128))
           ]),
           _: 2
@@ -280,10 +342,10 @@ const Dt = ["src", "alt"], H = /* @__PURE__ */ E({
       ])
     ], 2));
   }
-}), Wt = { class: "flex min-w-0 flex-col gap-1" }, Gt = ["for"], Qt = { class: "relative flex min-w-0 items-center" }, Yt = ["id"], Xt = /* @__PURE__ */ E({
+}), ca = { class: "flex min-w-0 flex-col gap-1" }, da = ["for"], fa = { class: "relative flex min-w-0 items-center" }, ma = ["id"], ba = /* @__PURE__ */ D({
   inheritAttrs: !1,
   __name: "SelectField",
-  props: /* @__PURE__ */ Se({
+  props: /* @__PURE__ */ Re({
     label: {}
   }, {
     modelValue: {
@@ -291,32 +353,32 @@ const Dt = ["src", "alt"], H = /* @__PURE__ */ E({
     },
     modelModifiers: {}
   }),
-  emits: /* @__PURE__ */ Se(["change"], ["update:modelValue"]),
+  emits: /* @__PURE__ */ Re(["change"], ["update:modelValue"]),
   setup(e, { emit: n }) {
-    const t = e, a = Ce(), l = st(), o = v(() => a.id ?? l), s = n, [u, m] = ut(e, "modelValue", {
+    const t = e, a = Be(), l = yt(), o = v(() => a.id ?? l), s = n, [u, m] = gt(e, "modelValue", {
       set(f) {
         return m.number ? Number(f) : f;
       }
     });
-    return (f, d) => (r(), i("div", Wt, [
-      t.label ? (r(), i("label", {
+    return (f, d) => (i(), r("div", ca, [
+      t.label ? (i(), r("label", {
         key: 0,
         for: o.value,
         class: "text-tx-muted text-xs"
-      }, V(t.label), 9, Gt)) : x("", !0),
-      T("div", Qt, [
-        ze(T("select", re({
+      }, M(t.label), 9, da)) : x("", !0),
+      B("div", fa, [
+        Se(B("select", ce({
           id: o.value,
-          "onUpdate:modelValue": d[0] || (d[0] = (L) => ct(u) ? u.value = L : null),
+          "onUpdate:modelValue": d[0] || (d[0] = (E) => ht(u) ? u.value = E : 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"
-        }, R(a), {
-          onChange: d[1] || (d[1] = (L) => s("change", L))
+        }, F(a), {
+          onChange: d[1] || (d[1] = (E) => s("change", E))
         }), [
           S(f.$slots, "default")
-        ], 16, Yt), [
-          [dt, R(u)]
+        ], 16, ma), [
+          [xt, F(u)]
         ]),
-        O(H, {
+        O(N, {
           name: "pan-down-symbolic",
           type: "symbol",
           size: 14,
@@ -325,40 +387,40 @@ const Dt = ["src", "alt"], H = /* @__PURE__ */ E({
       ])
     ]));
   }
-}), De = /* @__PURE__ */ Symbol("barra de vasak");
-function $e(e) {
+}), Ve = /* @__PURE__ */ Symbol("barra de vasak");
+function Ae(e) {
   return e === "left" || e === "right" ? "vertical" : "horizontal";
 }
-const Jt = ["top", "bottom", "left", "right"];
-function Zt(e) {
-  return typeof e == "string" && Jt.includes(e);
+const va = ["top", "bottom", "left", "right"];
+function pa(e) {
+  return typeof e == "string" && va.includes(e);
 }
-function be() {
-  const e = pe(De, null);
+function he() {
+  const e = we(Ve, null);
   if (e) return e;
   const n = w("top");
   return {
     posicion: n,
-    orientacion: v(() => $e(n.value)),
-    vertical: v(() => $e(n.value) === "vertical")
+    orientacion: v(() => Ae(n.value)),
+    vertical: v(() => Ae(n.value) === "vertical")
   };
 }
-const Ee = ["minimize", "maximize", "close"], _t = "window", ea = "barPosition";
-function ta(e) {
-  const t = e?.[_t]?.[ea];
-  return Zt(t) ? t : null;
+const Ie = ["minimize", "maximize", "close"], ya = "window", ga = "barPosition";
+function ha(e) {
+  const t = e?.[ya]?.[ga];
+  return pa(t) ? t : null;
 }
-function aa(e = "top") {
+function xa(e = "top") {
   const n = w(e);
   let t = null, a = !1;
   async function l() {
     try {
       const { readConfig: o } = await import("@vasakgroup/plugin-config-manager"), s = await o();
-      n.value = ta(s) ?? e;
+      n.value = ha(s) ?? e;
     } catch {
     }
   }
-  return X(async () => {
+  return W(async () => {
     await l();
     try {
       const { listen: o } = await import("@tauri-apps/api/event"), s = await o("config-changed", () => {
@@ -371,110 +433,110 @@ function aa(e = "top") {
       t = s;
     } catch {
     }
-  }), de(() => {
+  }), pe(() => {
     a = !0, t?.(), t = null;
   }), n;
 }
-function We(e) {
-  const n = Re(), t = {};
+function et(e) {
+  const n = Ge(), t = {};
   for (const a of e) {
     const l = `on${a[0].toUpperCase()}${a.slice(1)}`;
     n?.vnode.props?.[l] && (t[a] = () => n.emit(a));
   }
   return t;
 }
-const na = ["title", "aria-label"], la = ["title", "aria-label"], oa = ["title", "aria-label"], xe = "flex items-center justify-center rounded-corner border border-ui-border bg-ui-bg/80 p-1 transition-colors", Ge = /* @__PURE__ */ E({
+const wa = ["title", "aria-label"], ka = ["title", "aria-label"], $a = ["title", "aria-label"], Ee = "flex items-center justify-center rounded-corner border border-ui-border bg-ui-bg/80 p-1 transition-colors", tt = /* @__PURE__ */ D({
   __name: "WindowControls",
   props: {
-    controls: { default: () => Ee },
+    controls: { default: () => Ie },
     minimizeLabel: {},
     maximizeLabel: {},
     closeLabel: {}
   },
   emits: ["minimize", "maximize", "close"],
   setup(e, { emit: n }) {
-    const t = e, { t: a } = kt(), l = v(() => t.minimizeLabel ?? a("ventana.minimizar")), o = v(() => t.maximizeLabel ?? a("ventana.maximizar")), s = v(() => t.closeLabel ?? a("ventana.cerrar")), u = n, { vertical: m } = be(), f = v(() => ({
+    const t = e, { t: a } = Bt(), l = v(() => t.minimizeLabel ?? a("ventana.minimizar")), o = v(() => t.maximizeLabel ?? a("ventana.maximizar")), s = v(() => t.closeLabel ?? a("ventana.cerrar")), u = n, { vertical: m } = he(), f = v(() => ({
       minimize: t.controls.includes("minimize"),
       maximize: t.controls.includes("maximize"),
       close: t.controls.includes("close")
     }));
     function d() {
-      return wt();
+      return At();
     }
-    const L = Re();
-    function D(j) {
-      return !!L?.vnode.props?.[`on${j}`];
+    const E = Ge();
+    function L(j) {
+      return !!E?.vnode.props?.[`on${j}`];
     }
     function A() {
-      if (D("Minimize")) return u("minimize");
+      if (L("Minimize")) return u("minimize");
       d().minimize();
     }
-    function y() {
-      if (D("Maximize")) return u("maximize");
+    function g() {
+      if (L("Maximize")) return u("maximize");
       d().toggleMaximize();
     }
     function $() {
-      if (D("Close")) return u("close");
+      if (L("Close")) return u("close");
       d().close();
     }
-    return (j, C) => e.controls.length ? (r(), i("div", {
+    return (j, C) => e.controls.length ? (i(), r("div", {
       key: 0,
-      class: h(["flex shrink-0 gap-1", R(m) ? "flex-col" : ""]),
+      class: y(["flex shrink-0 gap-1", F(m) ? "flex-col" : ""]),
       "data-tauri-drag-region": ""
     }, [
-      f.value.minimize ? (r(), i("button", {
+      f.value.minimize ? (i(), r("button", {
         key: 0,
         type: "button",
-        class: h([xe, "hover:bg-status-success"]),
+        class: y([Ee, "hover:bg-status-success"]),
         title: l.value,
         "aria-label": l.value,
-        onClick: C[0] || (C[0] = (g) => A())
+        onClick: C[0] || (C[0] = (h) => A())
       }, [
-        O(H, {
+        O(N, {
           name: "window-minimize",
           type: "symbol",
           size: 24
         })
-      ], 10, na)) : x("", !0),
-      f.value.maximize ? (r(), i("button", {
+      ], 10, wa)) : x("", !0),
+      f.value.maximize ? (i(), r("button", {
         key: 1,
         type: "button",
-        class: h([xe, "hover:bg-status-warning"]),
+        class: y([Ee, "hover:bg-status-warning"]),
         title: o.value,
         "aria-label": o.value,
-        onClick: C[1] || (C[1] = (g) => y())
+        onClick: C[1] || (C[1] = (h) => g())
       }, [
-        O(H, {
+        O(N, {
           name: "window-maximize",
           type: "symbol",
           size: 24
         })
-      ], 10, la)) : x("", !0),
-      f.value.close ? (r(), i("button", {
+      ], 10, ka)) : x("", !0),
+      f.value.close ? (i(), r("button", {
         key: 2,
         type: "button",
-        class: h([xe, "hover:bg-status-error"]),
+        class: y([Ee, "hover:bg-status-error"]),
         title: s.value,
         "aria-label": s.value,
-        onClick: C[2] || (C[2] = (g) => $())
+        onClick: C[2] || (C[2] = (h) => $())
       }, [
-        O(H, {
+        O(N, {
           name: "window-close",
           type: "symbol",
           size: 24
         })
-      ], 10, oa)) : x("", !0)
+      ], 10, $a)) : x("", !0)
     ], 2)) : x("", !0);
   }
-}), ra = {
+}), Ca = {
   key: 0,
   class: "flex shrink-0 items-center",
   "data-tauri-drag-region": ""
-}, ia = {
+}, za = {
   key: 1,
   class: "min-w-0 shrink truncate text-sm",
   "data-tauri-drag-region": ""
-}, Qe = /* @__PURE__ */ E({
+}, at = /* @__PURE__ */ D({
   __name: "AppBar",
   props: {
     position: { default: null },
@@ -482,58 +544,58 @@ const na = ["title", "aria-label"], la = ["title", "aria-label"], oa = ["title",
     minimizeLabel: {},
     maximizeLabel: {},
     closeLabel: {},
-    controls: { default: () => Ee }
+    controls: { default: () => Ie }
   },
   emits: ["minimize", "maximize", "close"],
   setup(e) {
-    const n = e, t = be(), a = v(() => n.position ?? t.posicion.value), l = v(() => a.value === "left" || a.value === "right");
-    return fe(De, {
+    const n = e, t = he(), a = v(() => n.position ?? t.posicion.value), l = v(() => a.value === "left" || a.value === "right");
+    return ye(Ve, {
       posicion: a,
       orientacion: v(() => l.value ? "vertical" : "horizontal"),
       vertical: l
-    }), (o, s) => (r(), i("div", {
-      class: h(["relative flex shrink-0 items-center gap-2 p-1 font-title", l.value ? "h-full flex-col" : "w-full"]),
+    }), (o, s) => (i(), r("div", {
+      class: y(["relative flex shrink-0 items-center gap-2 p-1 font-title", l.value ? "h-full flex-col" : "w-full"]),
       "data-tauri-drag-region": ""
     }, [
-      o.$slots.identidad ? (r(), i("div", ra, [
+      o.$slots.identidad ? (i(), r("div", Ca, [
         S(o.$slots, "identidad")
       ])) : x("", !0),
-      (o.$slots.titulo || e.title) && !l.value ? (r(), i("p", ia, [
+      (o.$slots.titulo || e.title) && !l.value ? (i(), r("p", za, [
         S(o.$slots, "titulo", {}, () => [
-          Le(V(e.title), 1)
+          Me(M(e.title), 1)
         ])
       ])) : x("", !0),
-      T("div", {
-        class: h(["flex min-h-0 min-w-0 flex-1 items-center gap-2 overflow-auto", l.value ? "flex-col" : ""]),
+      B("div", {
+        class: y(["flex min-h-0 min-w-0 flex-1 items-center gap-2 overflow-auto", l.value ? "flex-col" : ""]),
         "data-tauri-drag-region": ""
       }, [
         S(o.$slots, "default")
       ], 2),
-      o.$slots.acciones ? (r(), i("div", {
+      o.$slots.acciones ? (i(), r("div", {
         key: 2,
-        class: h(["flex shrink-0 items-center gap-1", l.value ? "flex-col" : ""])
+        class: y(["flex shrink-0 items-center gap-1", l.value ? "flex-col" : ""])
       }, [
         S(o.$slots, "acciones")
       ], 2)) : x("", !0),
-      O(Ge, re({
+      O(tt, ce({
         controls: e.controls,
         "minimize-label": e.minimizeLabel,
         "maximize-label": e.maximizeLabel,
         "close-label": e.closeLabel
-      }, qe(R(We)(["minimize", "maximize", "close"]))), null, 16, ["controls", "minimize-label", "maximize-label", "close-label"]),
-      o.$slots.centro ? (r(), i("div", {
+      }, Qe(F(et)(["minimize", "maximize", "close"]))), null, 16, ["controls", "minimize-label", "maximize-label", "close-label"]),
+      o.$slots.centro ? (i(), r("div", {
         key: 3,
-        class: h(["pointer-events-none absolute flex items-center justify-center", l.value ? "inset-x-0 top-1/2 -translate-y-1/2 flex-col" : "inset-y-0 left-1/2 -translate-x-1/2"])
+        class: y(["pointer-events-none absolute flex items-center justify-center", l.value ? "inset-x-0 top-1/2 -translate-y-1/2 flex-col" : "inset-y-0 left-1/2 -translate-x-1/2"])
       }, [
-        T("div", {
-          class: h(["pointer-events-auto flex items-center gap-2", l.value ? "flex-col" : ""])
+        B("div", {
+          class: y(["pointer-events-auto flex items-center gap-2", l.value ? "flex-col" : ""])
         }, [
           S(o.$slots, "centro")
         ], 2)
       ], 2)) : x("", !0)
     ], 2));
   }
-}), sa = { class: "flex min-h-0 min-w-0 flex-1" }, ua = /* @__PURE__ */ E({
+}), Ea = { class: "flex min-h-0 min-w-0 flex-1" }, La = /* @__PURE__ */ D({
   __name: "WindowFrame",
   props: {
     position: { default: null },
@@ -541,23 +603,23 @@ const na = ["title", "aria-label"], la = ["title", "aria-label"], oa = ["title",
     minimizeLabel: {},
     maximizeLabel: {},
     closeLabel: {},
-    controls: { default: () => Ee },
+    controls: { default: () => Ie },
     hideBar: { type: Boolean, default: !1 }
   },
   emits: ["minimize", "maximize", "close"],
   setup(e) {
-    const n = e, t = aa(), a = v(() => n.position ?? t.value), l = v(() => $e(a.value)), o = v(() => l.value === "vertical");
-    fe(De, { posicion: a, orientacion: l, vertical: o });
+    const n = e, t = xa(), a = v(() => n.position ?? t.value), l = v(() => Ae(a.value)), o = v(() => l.value === "vertical");
+    ye(Ve, { posicion: a, orientacion: l, vertical: o });
     const s = {
       top: "flex-col",
       bottom: "flex-col-reverse",
       left: "flex-row",
       right: "flex-row-reverse"
     };
-    return (u, m) => (r(), i("div", {
-      class: h(["flex h-screen w-screen overflow-hidden rounded-corner-window border border-ui-border bg-ui-bg/80", s[a.value]])
+    return (u, m) => (i(), r("div", {
+      class: y(["flex h-screen w-screen overflow-hidden rounded-corner-window border border-ui-border bg-ui-bg/80", s[a.value]])
     }, [
-      e.hideBar ? x("", !0) : (r(), Q(Qe, re({
+      e.hideBar ? x("", !0) : (i(), U(at, ce({
         key: 0,
         position: a.value,
         title: e.title,
@@ -565,57 +627,57 @@ const na = ["title", "aria-label"], la = ["title", "aria-label"], oa = ["title",
         "maximize-label": e.maximizeLabel,
         "close-label": e.closeLabel,
         controls: e.controls
-      }, qe(R(We)(["minimize", "maximize", "close"]))), ft({
-        default: K(() => [
+      }, Qe(F(et)(["minimize", "maximize", "close"]))), wt({
+        default: G(() => [
           S(u.$slots, "barra")
         ]),
         _: 2
       }, [
         u.$slots.identidad ? {
           name: "identidad",
-          fn: K(() => [
+          fn: G(() => [
             S(u.$slots, "identidad")
           ]),
           key: "0"
         } : void 0,
         u.$slots.titulo ? {
           name: "titulo",
-          fn: K(() => [
+          fn: G(() => [
             S(u.$slots, "titulo")
           ]),
           key: "1"
         } : void 0,
         u.$slots.centro ? {
           name: "centro",
-          fn: K(() => [
+          fn: G(() => [
             S(u.$slots, "centro")
           ]),
           key: "2"
         } : void 0,
         u.$slots.acciones ? {
           name: "acciones",
-          fn: K(() => [
+          fn: G(() => [
             S(u.$slots, "acciones")
           ]),
           key: "3"
         } : void 0
       ]), 1040, ["position", "title", "minimize-label", "maximize-label", "close-label", "controls"])),
-      T("div", sa, [
+      B("div", Ea, [
         S(u.$slots, "default")
       ])
     ], 2));
   }
-}), ca = ["aria-selected", "title", "aria-label", "tabindex"], da = {
+}), Da = ["aria-selected", "title", "aria-label", "tabindex"], Ta = {
   key: 1,
   "aria-hidden": "true"
-}, fa = {
+}, Aa = {
   key: 2,
   class: "min-w-0 flex-1 truncate"
-}, ma = ["title", "aria-label"], ba = { class: "whitespace-nowrap" }, va = {
+}, Ba = ["title", "aria-label"], Sa = { class: "whitespace-nowrap" }, Ma = {
   key: 0,
   class: "size-2 shrink-0 rounded-full bg-current",
   "aria-hidden": "true"
-}, pa = ["title", "aria-label"], ya = 500, Ie = 8, Oe = 6, Ye = /* @__PURE__ */ E({
+}, Va = ["title", "aria-label"], Ia = 500, qe = 8, He = 6, nt = /* @__PURE__ */ D({
   __name: "TabItem",
   props: {
     tab: {},
@@ -626,165 +688,165 @@ const na = ["title", "aria-label"], la = ["title", "aria-label"], oa = ["title",
   },
   emits: ["select", "close", "menu", "mover", "navegar"],
   setup(e, { emit: n }) {
-    const t = e, a = n, { vertical: l, posicion: o } = be(), s = w(null), u = w(null), m = w(!1), f = w(!1), d = w(!1), L = w({ top: 0, left: 0, right: 0 });
-    let D = null, A = null;
-    const y = v(() => t.tab.closable !== !1), $ = v(() => t.tab.tooltip ?? t.tab.label), j = v(
+    const t = e, a = n, { vertical: l, posicion: o } = he(), s = w(null), u = w(null), m = w(!1), f = w(!1), d = w(!1), E = w({ top: 0, left: 0, right: 0 });
+    let L = null, A = null;
+    const g = v(() => t.tab.closable !== !1), $ = v(() => t.tab.tooltip ?? t.tab.label), j = v(
       () => t.tab.dirty ? `${t.tab.label} · ${t.dirtyLabel}` : t.tab.label
-    ), C = v(() => t.tab.label.trim().charAt(0).toUpperCase()), g = v(() => m.value || d.value), c = v(
-      () => !!t.tab.dirty && !(g.value && y.value)
+    ), C = v(() => t.tab.label.trim().charAt(0).toUpperCase()), h = v(() => m.value || d.value), c = v(
+      () => !!t.tab.dirty && !(h.value && g.value)
     ), b = v(
-      () => y.value && (g.value || t.active || !t.tab.dirty)
+      () => g.value && (h.value || t.active || !t.tab.dirty)
     ), p = v(
       () => l.value && (m.value || f.value || d.value)
     ), P = v(() => {
-      const q = { position: "fixed", top: `${L.value.top}px`, zIndex: 50 };
-      return o.value === "right" ? { ...q, right: `${L.value.right + Oe}px` } : { ...q, left: `${L.value.left + Oe}px` };
+      const q = { position: "fixed", top: `${E.value.top}px`, zIndex: 50 };
+      return o.value === "right" ? { ...q, right: `${E.value.right + He}px` } : { ...q, left: `${E.value.left + He}px` };
     });
-    function _() {
+    function le() {
       const q = s.value;
       if (!q) return;
       const k = q.getBoundingClientRect();
-      L.value = {
+      E.value = {
         top: k.top,
         left: k.right,
         right: window.innerWidth - k.left
       };
     }
-    function U(q) {
+    function K(q) {
       const k = q.relatedTarget;
       k && u.value?.contains(k) || (d.value = !1);
     }
-    function ee() {
-      m.value = !0, _();
+    function oe() {
+      m.value = !0, le();
     }
-    function G() {
-      f.value = !0, _();
+    function Y() {
+      f.value = !0, le();
     }
-    function B() {
-      D !== null && clearTimeout(D), D = null, A = null;
+    function T() {
+      L !== null && clearTimeout(L), L = null, A = null;
     }
     function z(q) {
-      q.button === 0 && (A = { x: q.clientX, y: q.clientY }, D = setTimeout(() => {
-        A && a("menu", A), B();
-      }, ya));
+      q.button === 0 && (A = { x: q.clientX, y: q.clientY }, L = setTimeout(() => {
+        A && a("menu", A), T();
+      }, Ia));
     }
     function I(q) {
       if (!A) return;
-      (Math.abs(q.clientX - A.x) > Ie || Math.abs(q.clientY - A.y) > Ie) && B();
+      (Math.abs(q.clientX - A.x) > qe || Math.abs(q.clientY - A.y) > qe) && T();
     }
-    function ie(q) {
-      q.button === 1 && y.value && (q.preventDefault(), a("close"));
+    function de(q) {
+      q.button === 1 && g.value && (q.preventDefault(), a("close"));
     }
-    function rt(q) {
+    function bt(q) {
       q.preventDefault(), a("menu", { x: q.clientX, y: q.clientY });
     }
-    return de(B), (q, k) => (r(), i("div", {
+    return pe(T), (q, k) => (i(), r("div", {
       ref_key: "raiz",
       ref: s,
-      class: h(["group relative flex shrink-0 cursor-pointer items-center gap-2 rounded-corner border border-ui-border transition-colors", [
+      class: y(["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",
-        R(l) ? "size-8 justify-center p-0 text-sm" : "w-34 max-w-34 px-3 py-1 text-sm"
+        F(l) ? "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: $.value,
       "aria-label": j.value,
       tabindex: e.tabindex,
-      onClick: k[5] || (k[5] = M((N) => a("select"), ["stop"])),
+      onClick: k[5] || (k[5] = V((H) => a("select"), ["stop"])),
       onKeydown: [
-        k[6] || (k[6] = F(M((N) => a("select"), ["stop"]), ["enter"])),
-        k[7] || (k[7] = F(M((N) => a("select"), ["prevent", "stop"]), ["space"])),
-        k[8] || (k[8] = F(M((N) => a("navegar", "anterior"), ["prevent", "stop"]), ["left"])),
-        k[9] || (k[9] = F(M((N) => a("navegar", "anterior"), ["prevent", "stop"]), ["up"])),
-        k[10] || (k[10] = F(M((N) => a("navegar", "siguiente"), ["prevent", "stop"]), ["right"])),
-        k[11] || (k[11] = F(M((N) => a("navegar", "siguiente"), ["prevent", "stop"]), ["down"])),
-        k[12] || (k[12] = F(M((N) => a("navegar", "primera"), ["prevent", "stop"]), ["home"])),
-        k[13] || (k[13] = F(M((N) => a("navegar", "ultima"), ["prevent", "stop"]), ["end"])),
-        k[14] || (k[14] = F(M((N) => a("mover", -1), ["alt", "prevent", "stop"]), ["left"])),
-        k[15] || (k[15] = F(M((N) => a("mover", -1), ["alt", "prevent", "stop"]), ["up"])),
-        k[16] || (k[16] = F(M((N) => a("mover", 1), ["alt", "prevent", "stop"]), ["right"])),
-        k[17] || (k[17] = F(M((N) => a("mover", 1), ["alt", "prevent", "stop"]), ["down"])),
-        k[18] || (k[18] = F(M((N) => y.value && a("close"), ["prevent", "stop"]), ["delete"]))
+        k[6] || (k[6] = R(V((H) => a("select"), ["stop"]), ["enter"])),
+        k[7] || (k[7] = R(V((H) => a("select"), ["prevent", "stop"]), ["space"])),
+        k[8] || (k[8] = R(V((H) => a("navegar", "anterior"), ["prevent", "stop"]), ["left"])),
+        k[9] || (k[9] = R(V((H) => a("navegar", "anterior"), ["prevent", "stop"]), ["up"])),
+        k[10] || (k[10] = R(V((H) => a("navegar", "siguiente"), ["prevent", "stop"]), ["right"])),
+        k[11] || (k[11] = R(V((H) => a("navegar", "siguiente"), ["prevent", "stop"]), ["down"])),
+        k[12] || (k[12] = R(V((H) => a("navegar", "primera"), ["prevent", "stop"]), ["home"])),
+        k[13] || (k[13] = R(V((H) => a("navegar", "ultima"), ["prevent", "stop"]), ["end"])),
+        k[14] || (k[14] = R(V((H) => a("mover", -1), ["alt", "prevent", "stop"]), ["left"])),
+        k[15] || (k[15] = R(V((H) => a("mover", -1), ["alt", "prevent", "stop"]), ["up"])),
+        k[16] || (k[16] = R(V((H) => a("mover", 1), ["alt", "prevent", "stop"]), ["right"])),
+        k[17] || (k[17] = R(V((H) => a("mover", 1), ["alt", "prevent", "stop"]), ["down"])),
+        k[18] || (k[18] = R(V((H) => g.value && a("close"), ["prevent", "stop"]), ["delete"]))
       ],
-      onAuxclick: M(ie, ["stop"]),
-      onContextmenu: rt,
+      onAuxclick: V(de, ["stop"]),
+      onContextmenu: bt,
       onPointerdown: z,
       onPointermove: I,
-      onPointerup: B,
-      onPointerleave: B,
-      onMouseenter: ee,
-      onMouseleave: k[19] || (k[19] = (N) => m.value = !1),
-      onFocus: G,
-      onBlur: k[20] || (k[20] = (N) => f.value = !1)
+      onPointerup: T,
+      onPointerleave: T,
+      onMouseenter: oe,
+      onMouseleave: k[19] || (k[19] = (H) => m.value = !1),
+      onFocus: Y,
+      onBlur: k[20] || (k[20] = (H) => f.value = !1)
     }, [
-      e.tab.icon ? (r(), Q(H, {
+      e.tab.icon ? (i(), U(N, {
         key: 0,
         name: e.tab.icon,
         size: 16,
         class: "shrink-0"
-      }, null, 8, ["name"])) : R(l) ? (r(), i("span", da, V(C.value), 1)) : x("", !0),
-      R(l) ? x("", !0) : (r(), i("span", fa, V(e.tab.label), 1)),
-      c.value ? (r(), i("span", {
+      }, null, 8, ["name"])) : F(l) ? (i(), r("span", Ta, M(C.value), 1)) : x("", !0),
+      F(l) ? x("", !0) : (i(), r("span", Aa, M(e.tab.label), 1)),
+      c.value ? (i(), r("span", {
         key: 3,
-        class: h(["size-2 shrink-0 rounded-full bg-current", R(l) ? "absolute right-0.5 top-0.5" : ""]),
+        class: y(["size-2 shrink-0 rounded-full bg-current", F(l) ? "absolute right-0.5 top-0.5" : ""]),
         "aria-hidden": "true"
-      }, null, 2)) : b.value && !R(l) ? (r(), i("button", {
+      }, null, 2)) : b.value && !F(l) ? (i(), r("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: k[0] || (k[0] = M((N) => a("close"), ["stop"]))
+        onClick: k[0] || (k[0] = V((H) => a("close"), ["stop"]))
       }, [
-        O(H, {
+        O(N, {
           name: "gtk-close",
           type: "symbol",
           size: 12
         })
-      ], 8, ma)) : x("", !0),
-      (r(), Q(me, { to: "body" }, [
-        O(ye, {
+      ], 8, Ba)) : x("", !0),
+      (i(), U(ge, { to: "body" }, [
+        O(ke, {
           "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: K(() => [
-            p.value ? (r(), i("div", {
+          default: G(() => [
+            p.value ? (i(), r("div", {
               key: 0,
-              class: h(["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: y(["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: se(P.value),
-              onMouseenter: k[2] || (k[2] = (N) => d.value = !0),
-              onMouseleave: k[3] || (k[3] = (N) => d.value = !1),
-              onFocusin: k[4] || (k[4] = (N) => d.value = !0),
-              onFocusout: U
+              style: fe(P.value),
+              onMouseenter: k[2] || (k[2] = (H) => d.value = !0),
+              onMouseleave: k[3] || (k[3] = (H) => d.value = !1),
+              onFocusin: k[4] || (k[4] = (H) => d.value = !0),
+              onFocusout: K
             }, [
-              T("span", ba, V(e.tab.label), 1),
-              e.tab.dirty ? (r(), i("span", va)) : x("", !0),
-              y.value ? (r(), i("button", {
+              B("span", Sa, M(e.tab.label), 1),
+              e.tab.dirty ? (i(), r("span", Ma)) : x("", !0),
+              g.value ? (i(), r("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: k[1] || (k[1] = M((N) => a("close"), ["stop"]))
+                onClick: k[1] || (k[1] = V((H) => a("close"), ["stop"]))
               }, [
-                O(H, {
+                O(N, {
                   name: "gtk-close",
                   type: "symbol",
                   size: 12
                 })
-              ], 8, pa)) : x("", !0)
+              ], 8, Va)) : x("", !0)
             ], 38)) : x("", !0)
           ]),
           _: 1
         })
       ]))
-    ], 42, ca));
+    ], 42, Da));
   }
-}), ga = ["aria-orientation"], ha = ["draggable", "onDragstart", "onDragover", "onDrop"], xa = ["title", "aria-label"], wa = /* @__PURE__ */ E({
+}), Oa = ["aria-orientation"], ja = ["draggable", "onDragstart", "onDragover", "onDrop"], Pa = ["title", "aria-label"], Ra = /* @__PURE__ */ D({
   __name: "TabBar",
   props: {
     tabs: {},
@@ -796,40 +858,40 @@ const na = ["title", "aria-label"], la = ["title", "aria-label"], oa = ["title",
   },
   emits: ["update:modelValue", "select", "close", "new", "reorder", "menu"],
   setup(e, { emit: n }) {
-    const t = e, a = n, { vertical: l } = be(), o = w(null), s = w(0), u = w(null), m = w(null);
-    function f(g) {
-      a("update:modelValue", g), a("select", g);
+    const t = e, a = n, { vertical: l } = he(), o = w(null), s = w(0), u = w(null), m = w(null);
+    function f(h) {
+      a("update:modelValue", h), a("select", h);
     }
-    async function d(g, c) {
+    async function d(h, c) {
       const b = t.tabs.length - 1;
       if (b < 0) return;
-      const p = c === "primera" ? 0 : c === "ultima" ? b : c === "anterior" ? (g - 1 + t.tabs.length) % t.tabs.length : (g + 1) % t.tabs.length;
-      s.value = p, await Y(), o.value?.querySelectorAll('[role="tab"]')?.[p]?.focus();
+      const p = c === "primera" ? 0 : c === "ultima" ? b : c === "anterior" ? (h - 1 + t.tabs.length) % t.tabs.length : (h + 1) % t.tabs.length;
+      s.value = p, await J(), o.value?.querySelectorAll('[role="tab"]')?.[p]?.focus();
     }
-    function L(g, c) {
+    function E(h, c) {
       if (t.fixedOrder) return;
-      const b = g + c;
+      const b = h + c;
       if (b < 0 || b >= t.tabs.length) return;
-      const p = [...t.tabs], [P] = p.splice(g, 1);
+      const p = [...t.tabs], [P] = p.splice(h, 1);
       P && (p.splice(b, 0, P), s.value = b, a("reorder", p));
     }
-    function D(g) {
+    function L(h) {
       const c = o.value;
       if (!c) return;
-      const b = g.deltaY || g.deltaX || 0, p = l.value ? c.scrollTop : c.scrollLeft;
-      l.value ? c.scrollTop += b : c.scrollLeft += b, (l.value ? c.scrollTop : c.scrollLeft) !== p && g.preventDefault();
+      const b = h.deltaY || h.deltaX || 0, p = l.value ? c.scrollTop : c.scrollLeft;
+      l.value ? c.scrollTop += b : c.scrollLeft += b, (l.value ? c.scrollTop : c.scrollLeft) !== p && h.preventDefault();
     }
-    function A(g, c) {
-      t.fixedOrder || (u.value = g, c.dataTransfer?.setData("text/plain", String(g)), c.dataTransfer && (c.dataTransfer.effectAllowed = "move"));
+    function A(h, c) {
+      t.fixedOrder || (u.value = h, c.dataTransfer?.setData("text/plain", String(h)), c.dataTransfer && (c.dataTransfer.effectAllowed = "move"));
     }
-    function y(g, c) {
-      t.fixedOrder || u.value === null || (c.preventDefault(), m.value = g, c.dataTransfer && (c.dataTransfer.dropEffect = "move"));
+    function g(h, c) {
+      t.fixedOrder || u.value === null || (c.preventDefault(), m.value = h, c.dataTransfer && (c.dataTransfer.dropEffect = "move"));
     }
-    function $(g) {
+    function $(h) {
       const c = u.value;
-      if (j(), t.fixedOrder || c === null || c === g) return;
+      if (j(), t.fixedOrder || c === null || c === h) return;
       const b = [...t.tabs], [p] = b.splice(c, 1);
-      p && (b.splice(g, 0, p), a("reorder", b));
+      p && (b.splice(h, 0, p), a("reorder", b));
     }
     function j() {
       u.value = null, m.value = null;
@@ -837,30 +899,30 @@ const na = ["title", "aria-label"], la = ["title", "aria-label"], oa = ["title",
     const C = v(
       () => l.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 (g, c) => (r(), i("div", {
-      class: h(["flex min-h-0 min-w-0 items-center gap-1", R(l) ? "w-full flex-col" : "h-full"]),
+    return (h, c) => (i(), r("div", {
+      class: y(["flex min-h-0 min-w-0 items-center gap-1", F(l) ? "w-full flex-col" : "h-full"]),
       role: "tablist",
-      "aria-orientation": R(l) ? "vertical" : "horizontal"
+      "aria-orientation": F(l) ? "vertical" : "horizontal"
     }, [
-      T("div", {
+      B("div", {
         ref_key: "carril",
         ref: o,
-        class: h(C.value),
-        onWheel: D
+        class: y(C.value),
+        onWheel: L
       }, [
-        (r(!0), i(Z, null, le(e.tabs, (b, p) => (r(), i("div", {
+        (i(!0), r(te, null, ue(e.tabs, (b, p) => (i(), r("div", {
           key: b.id,
-          class: h(["transition-opacity", [
+          class: y(["transition-opacity", [
             u.value === p ? "opacity-40" : "",
             m.value === p && u.value !== p ? "ring-2 ring-secondary rounded-corner" : ""
           ]]),
           draggable: !e.fixedOrder,
           onDragstart: (P) => A(p, P),
-          onDragover: (P) => y(p, P),
-          onDrop: M((P) => $(p), ["prevent"]),
+          onDragover: (P) => g(p, P),
+          onDrop: V((P) => $(p), ["prevent"]),
           onDragend: j
         }, [
-          O(Ye, {
+          O(nt, {
             tab: b,
             active: b.id === e.modelValue,
             "close-label": e.closeLabel,
@@ -870,11 +932,11 @@ const na = ["title", "aria-label"], la = ["title", "aria-label"], oa = ["title",
             onClose: (P) => a("close", b.id),
             onMenu: (P) => a("menu", { id: b.id, ...P }),
             onNavegar: (P) => d(p, P),
-            onMover: (P) => L(p, P)
+            onMover: (P) => E(p, P)
           }, null, 8, ["tab", "active", "close-label", "dirty-label", "tabindex", "onSelect", "onClose", "onMenu", "onNavegar", "onMover"])
-        ], 42, ha))), 128))
+        ], 42, ja))), 128))
       ], 34),
-      e.newLabel ? (r(), i("button", {
+      e.newLabel ? (i(), r("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",
@@ -882,15 +944,15 @@ const na = ["title", "aria-label"], la = ["title", "aria-label"], oa = ["title",
         "aria-label": e.newLabel,
         onClick: c[0] || (c[0] = (b) => a("new"))
       }, [
-        O(H, {
+        O(N, {
           name: "gtk-add",
           type: "symbol",
           size: 14
         })
-      ], 8, xa)) : x("", !0)
-    ], 10, ga));
+      ], 8, Pa)) : x("", !0)
+    ], 10, Oa));
   }
-}), ka = ["id", "aria-label", "type", "value", "placeholder", "disabled", "readonly", "required", "aria-describedby", "autocomplete", "aria-invalid"], Xe = /* @__PURE__ */ E({
+}), Fa = ["id", "aria-label", "type", "value", "placeholder", "disabled", "readonly", "required", "aria-describedby", "autocomplete", "aria-invalid"], lt = /* @__PURE__ */ D({
   __name: "TextInput",
   props: {
     modelValue: {},
@@ -928,7 +990,7 @@ const na = ["title", "aria-label"], la = ["title", "aria-label"], oa = ["title",
       a.mono ? "font-mono" : "",
       a.disabled ? "cursor-not-allowed opacity-60" : ""
     ]);
-    return (d, L) => (r(), i("input", {
+    return (d, E) => (i(), r("input", {
       ref_key: "campo",
       ref: u,
       id: e.id,
@@ -942,14 +1004,14 @@ const na = ["title", "aria-label"], la = ["title", "aria-label"], oa = ["title",
       "aria-describedby": e.describedBy,
       autocomplete: e.autocomplete,
       "aria-invalid": e.invalid || void 0,
-      class: h(f.value),
+      class: y(f.value),
       onInput: o,
       onChange: s,
-      onKeyup: L[0] || (L[0] = (D) => l("keyup", D)),
-      onKeydown: L[1] || (L[1] = (D) => l("keydown", D))
-    }, null, 42, ka));
+      onKeyup: E[0] || (E[0] = (L) => l("keyup", L)),
+      onKeydown: E[1] || (E[1] = (L) => l("keydown", L))
+    }, null, 42, Fa));
   }
-}), $a = { class: "pointer-events-none absolute left-2 flex items-center" }, Ca = ["aria-label"], Te = /* @__PURE__ */ E({
+}), Na = { class: "pointer-events-none absolute left-2 flex items-center" }, qa = ["aria-label"], Oe = /* @__PURE__ */ D({
   __name: "SearchField",
   props: {
     modelValue: { default: "" },
@@ -980,38 +1042,38 @@ const na = ["title", "aria-label"], la = ["title", "aria-label"], oa = ["title",
     function d() {
       clearTimeout(s), s = void 0;
     }
-    function L($) {
+    function E($) {
       l("update:modelValue", $), !(a.debounce <= 0) && (d(), s = setTimeout(() => l("search", $), a.debounce));
     }
-    function D() {
+    function L() {
       d(), l("search", a.modelValue);
     }
     function A() {
-      d(), l("update:modelValue", ""), l("clear"), y();
+      d(), l("update:modelValue", ""), l("clear"), g();
     }
-    function y() {
+    function g() {
       return o.value?.enfocar() ?? !1;
     }
-    return n({ enfocar: y }), X(async () => {
-      a.autofocus && (await Y(), y());
-    }), ce(d), W(
+    return n({ enfocar: g }), W(async () => {
+      a.autofocus && (await J(), g());
+    }), ve(d), Q(
       () => a.disabled,
       ($) => {
         $ && d();
       }
-    ), ($, j) => (r(), i("div", {
+    ), ($, j) => (i(), r("div", {
       class: "relative flex items-center",
-      onKeydown: F(D, ["enter"])
+      onKeydown: R(L, ["enter"])
     }, [
-      T("span", $a, [
-        O(H, {
+      B("span", Na, [
+        O(N, {
           name: e.busy ? "content-loading" : "system-search",
           type: "symbol",
           size: 14,
-          class: h(e.busy ? "animate-spin opacity-70" : "opacity-60")
+          class: y(e.busy ? "animate-spin opacity-70" : "opacity-60")
         }, null, 8, ["name", "class"])
       ]),
-      O(Xe, re({
+      O(lt, ce({
         ref_key: "campo",
         ref: o,
         type: "search",
@@ -1021,28 +1083,28 @@ const na = ["title", "aria-label"], la = ["title", "aria-label"], oa = ["title",
       }, m.value, {
         disabled: e.disabled,
         class: ["pl-7 [&::-webkit-search-cancel-button]:appearance-none", f.value ? "pr-8" : ""],
-        "onUpdate:modelValue": L,
+        "onUpdate:modelValue": E,
         onKeydown: j[0] || (j[0] = (C) => l("keydown", C))
       }), null, 16, ["model-value", "placeholder", "ariaLabel", "disabled", "class"]),
-      f.value ? (r(), i("button", {
+      f.value ? (i(), r("button", {
         key: 0,
         type: "button",
         class: "absolute right-1 flex size-6 items-center justify-center rounded-corner text-tx-muted hover:bg-ui-surface",
         "aria-label": e.label ? `${e.label}: vaciar` : "Vaciar",
-        onMousedown: j[1] || (j[1] = M(() => {
+        onMousedown: j[1] || (j[1] = V(() => {
         }, ["prevent"])),
         onClick: A
       }, [
-        O(H, {
+        O(N, {
           name: "gtk-close",
           type: "symbol",
           size: 12,
           alt: ""
         })
-      ], 40, Ca)) : x("", !0)
+      ], 40, qa)) : x("", !0)
     ], 32));
   }
-}), za = ["title", "aria-label", "aria-expanded"], La = /* @__PURE__ */ E({
+}), Ha = ["title", "aria-label", "aria-expanded"], Ua = /* @__PURE__ */ D({
   __name: "BarSearch",
   props: {
     modelValue: { default: "" },
@@ -1054,48 +1116,48 @@ const na = ["title", "aria-label"], la = ["title", "aria-label"], oa = ["title",
   },
   emits: ["update:modelValue", "search", "open", "close"],
   setup(e, { emit: n }) {
-    const t = e, a = n, { vertical: l, posicion: o } = be(), s = w(!1), u = w(null), m = v(() => l.value || t.collapsed), f = v(() => !m.value || s.value), d = v(() => {
+    const t = e, a = n, { vertical: l, posicion: o } = he(), s = w(!1), u = w(null), m = v(() => l.value || t.collapsed), f = v(() => !m.value || s.value), d = v(() => {
       if (!m.value) return "";
-      const y = "absolute z-40 w-64 rounded-corner border border-ui-border bg-ui-surface/95 p-1 shadow-lg";
-      return o.value === "left" ? `${y} left-full top-0 ml-1` : o.value === "right" ? `${y} right-full top-0 mr-1` : o.value === "bottom" ? `${y} bottom-full right-0 mb-1` : `${y} top-full right-0 mt-1`;
+      const g = "absolute z-40 w-64 rounded-corner border border-ui-border bg-ui-surface/95 p-1 shadow-lg";
+      return o.value === "left" ? `${g} left-full top-0 ml-1` : o.value === "right" ? `${g} right-full top-0 mr-1` : o.value === "bottom" ? `${g} bottom-full right-0 mb-1` : `${g} top-full right-0 mt-1`;
     });
-    async function L() {
-      s.value = !0, a("open"), await Y(), u.value?.enfocar();
+    async function E() {
+      s.value = !0, a("open"), await J(), u.value?.enfocar();
     }
-    function D() {
+    function L() {
       s.value && (s.value = !1, a("close"));
     }
-    function A(y) {
-      const $ = y.relatedTarget;
-      $ && y.currentTarget.contains($) || D();
+    function A(g) {
+      const $ = g.relatedTarget;
+      $ && g.currentTarget.contains($) || L();
     }
-    return (y, $) => (r(), i("div", {
+    return (g, $) => (i(), r("div", {
       class: "relative flex shrink-0 items-center",
       onFocusout: A
     }, [
-      m.value ? (r(), i("button", {
+      m.value ? (i(), r("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": s.value,
-        onMousedown: $[0] || ($[0] = M(() => {
+        onMousedown: $[0] || ($[0] = V(() => {
         }, ["prevent"])),
-        onClick: $[1] || ($[1] = (j) => s.value ? D() : L())
+        onClick: $[1] || ($[1] = (j) => s.value ? L() : E())
       }, [
-        O(H, {
+        O(N, {
           name: "system-search",
           type: "symbol",
           size: 14
         })
-      ], 40, za)) : x("", !0),
-      f.value ? (r(), i("div", {
+      ], 40, Ha)) : x("", !0),
+      f.value ? (i(), r("div", {
         key: 1,
-        class: h(d.value),
-        onKeydown: F(D, ["esc"])
+        class: y(d.value),
+        onKeydown: R(L, ["esc"])
       }, [
-        O(Te, {
+        O(Oe, {
           ref_key: "campo",
           ref: u,
           "model-value": e.modelValue,
@@ -1103,17 +1165,17 @@ const na = ["title", "aria-label"], la = ["title", "aria-label"], oa = ["title",
           label: e.label,
           disabled: e.disabled,
           debounce: e.debounce,
-          class: h(m.value ? "" : "w-48"),
+          class: y(m.value ? "" : "w-48"),
           "onUpdate:modelValue": $[2] || ($[2] = (j) => a("update:modelValue", j)),
           onSearch: $[3] || ($[3] = (j) => a("search", j))
         }, null, 8, ["model-value", "placeholder", "label", "disabled", "debounce", "class"])
       ], 34)) : x("", !0)
     ], 32));
   }
-}), Da = ["type", "disabled"], Ea = {
+}), Ka = ["type", "disabled"], Wa = {
   key: 0,
   class: "w-4 h-4 animate-spin rounded-full border-2 border-current border-t-transparent"
-}, Ta = ["src", "alt"], Ba = { key: 2 }, Aa = ["src", "alt"], Sa = /* @__PURE__ */ E({
+}, Ga = ["src", "alt"], Qa = { key: 2 }, Ya = ["src", "alt"], Xa = /* @__PURE__ */ D({
   __name: "ActionButton",
   props: {
     label: {},
@@ -1143,10 +1205,10 @@ const na = ["title", "aria-label"], la = ["title", "aria-label"], oa = ["title",
     }, s = (u) => {
       t.stopPropagation && u.stopPropagation(), t.preventDefault && u.preventDefault(), !t.disabled && !t.loading && a("click");
     };
-    return (u, m) => (r(), i("button", {
+    return (u, m) => (i(), r("button", {
       type: t.type,
       onClick: s,
-      class: h(["rounded-corner transition-[background-color,opacity] duration-200 disabled:opacity-50 disabled:cursor-not-allowed flex items-center justify-center gap-2", [
+      class: y(["rounded-corner transition-[background-color,opacity] duration-200 disabled:opacity-50 disabled:cursor-not-allowed flex items-center justify-center gap-2", [
         l[t.variant],
         o[t.size],
         t.fullWidth ? "w-full" : "",
@@ -1155,43 +1217,43 @@ const na = ["title", "aria-label"], la = ["title", "aria-label"], oa = ["title",
       ]]),
       disabled: t.disabled || t.loading
     }, [
-      e.loading ? (r(), i("span", Ea)) : x("", !0),
-      t.iconSrc && !t.iconRight ? (r(), i("img", {
+      e.loading ? (i(), r("span", Wa)) : x("", !0),
+      t.iconSrc && !t.iconRight ? (i(), r("img", {
         key: 1,
         src: t.iconSrc,
         alt: t.iconAlt || t.label,
         class: "w-4 h-4"
-      }, null, 8, Ta)) : x("", !0),
-      t.label ? (r(), i("span", Ba, V(t.label), 1)) : x("", !0),
-      t.iconSrc && t.iconRight ? (r(), i("img", {
+      }, null, 8, Ga)) : x("", !0),
+      t.label ? (i(), r("span", Qa, M(t.label), 1)) : x("", !0),
+      t.iconSrc && t.iconRight ? (i(), r("img", {
         key: 3,
         src: t.iconSrc,
         alt: t.iconAlt || t.label,
         class: "w-4 h-4"
-      }, null, 8, Aa)) : x("", !0)
-    ], 10, Da));
+      }, null, 8, Ya)) : x("", !0)
+    ], 10, Ka));
   }
-}), ge = (e, n) => {
+}), $e = (e, n) => {
   const t = e.__vccOpts || e;
   for (const [a, l] of n)
     t[a] = l;
   return t;
-}, Va = /* @__PURE__ */ ge(Sa, [["__scopeId", "data-v-3c1bd6bd"]]), Je = {
+}, Ja = /* @__PURE__ */ $e(Xa, [["__scopeId", "data-v-3c1bd6bd"]]), ot = {
   info: "border-ui-border bg-ui-surface/70 text-tx-main",
   success: "border-status-success/40 bg-status-success/10 text-tx-main",
   warning: "border-status-warning/40 bg-status-warning/10 text-tx-main",
   error: "border-status-error/40 bg-status-error/10 text-tx-main"
 };
-function Ze(e) {
+function it(e) {
   return e === "error" ? "alert" : "status";
 }
-const Ma = ["role"], Ia = {
+const Za = ["role"], _a = {
   key: 0,
   class: "mt-0.5"
-}, Oa = { class: "min-w-0 flex-1" }, ja = {
+}, en = { class: "min-w-0 flex-1" }, tn = {
   key: 0,
   class: "font-semibold"
-}, Pa = /* @__PURE__ */ E({
+}, an = /* @__PURE__ */ D({
   __name: "AlertMessage",
   props: {
     tone: { default: "info" },
@@ -1200,34 +1262,34 @@ const Ma = ["role"], Ia = {
     iconType: { default: "symbol" }
   },
   setup(e) {
-    const n = e, t = v(() => Je[n.tone]), a = v(() => Ze(n.tone));
-    return (l, o) => (r(), i("div", {
+    const n = e, t = v(() => ot[n.tone]), a = v(() => it(n.tone));
+    return (l, o) => (i(), r("div", {
       role: a.value,
       "aria-atomic": "true",
-      class: h(["flex gap-3 rounded-corner border px-4 py-2 text-sm", t.value])
+      class: y(["flex gap-3 rounded-corner border px-4 py-2 text-sm", t.value])
     }, [
-      e.icon ? (r(), i("span", Ia, [
-        O(H, {
+      e.icon ? (i(), r("span", _a, [
+        O(N, {
           name: e.icon,
           type: e.iconType,
           size: 18,
           alt: ""
         }, null, 8, ["name", "type"])
       ])) : x("", !0),
-      T("div", Oa, [
-        e.title ? (r(), i("p", ja, V(e.title), 1)) : x("", !0),
-        T("div", {
-          class: h(e.title ? "mt-1" : "")
+      B("div", en, [
+        e.title ? (i(), r("p", tn, M(e.title), 1)) : x("", !0),
+        B("div", {
+          class: y(e.title ? "mt-1" : "")
         }, [
           S(l.$slots, "default")
         ], 2)
       ])
-    ], 10, Ma));
+    ], 10, Za));
   }
-}), Fa = { class: "font-medium text-sm text-tx-main" }, Ra = {
+}), nn = { class: "font-medium text-sm text-tx-main" }, ln = {
   key: 0,
   class: "text-sm text-tx-muted"
-}, qa = /* @__PURE__ */ E({
+}, on = /* @__PURE__ */ D({
   __name: "EmptyState",
   props: {
     title: {},
@@ -1237,37 +1299,37 @@ const Ma = ["role"], Ia = {
     bordered: { type: Boolean, default: !1 }
   },
   setup(e) {
-    return (n, t) => (r(), i("div", {
-      class: h(["flex flex-col items-center justify-center gap-3 px-8 py-12 text-center", e.bordered ? "rounded-corner border border-ui-border border-dashed bg-ui-surface/20" : ""])
+    return (n, t) => (i(), r("div", {
+      class: y(["flex flex-col items-center justify-center gap-3 px-8 py-12 text-center", e.bordered ? "rounded-corner border border-ui-border border-dashed bg-ui-surface/20" : ""])
     }, [
-      O(H, {
+      O(N, {
         name: e.icon,
         type: e.iconType,
         size: 48,
         class: "opacity-60"
       }, null, 8, ["name", "type"]),
-      T("p", Fa, V(e.title), 1),
-      e.note ? (r(), i("p", Ra, V(e.note), 1)) : x("", !0),
+      B("p", nn, M(e.title), 1),
+      e.note ? (i(), r("p", ln, M(e.note), 1)) : x("", !0),
       S(n.$slots, "default")
     ], 2));
   }
-}), Na = { class: "text-sm text-tx-muted" }, Ha = /* @__PURE__ */ E({
+}), rn = { class: "text-sm text-tx-muted" }, sn = /* @__PURE__ */ D({
   __name: "LoadingState",
   props: {
     label: {},
     bordered: { type: Boolean, default: !1 }
   },
   setup(e) {
-    return (n, t) => (r(), i("div", {
+    return (n, t) => (i(), r("div", {
       role: "status",
       "aria-atomic": "true",
-      class: h(["flex flex-col items-center justify-center gap-4 px-8 py-12 text-center", e.bordered ? "rounded-corner border border-ui-border border-dashed bg-ui-surface/20" : ""])
+      class: y(["flex flex-col items-center justify-center gap-4 px-8 py-12 text-center", e.bordered ? "rounded-corner border border-ui-border border-dashed bg-ui-surface/20" : ""])
     }, [
-      t[0] || (t[0] = T("span", { class: "h-10 w-10 animate-spin rounded-full border-4 border-ui-border border-t-primary motion-reduce:animate-none" }, null, -1)),
-      T("p", Na, V(e.label), 1)
+      t[0] || (t[0] = B("span", { class: "h-10 w-10 animate-spin rounded-full border-4 border-ui-border border-t-primary motion-reduce:animate-none" }, null, -1)),
+      B("p", rn, M(e.label), 1)
     ], 2));
   }
-}), Ua = ["role"], Ka = /* @__PURE__ */ E({
+}), un = ["role"], cn = /* @__PURE__ */ D({
   __name: "ToastArea",
   props: {
     toasts: {},
@@ -1277,38 +1339,38 @@ const Ma = ["role"], Ia = {
     const n = e, t = v(
       () => n.position === "bottom-center" ? "bottom-4 left-1/2 -translate-x-1/2" : "right-4 bottom-4"
     );
-    return (a, l) => (r(), Q(me, { to: "body" }, [
-      T("div", {
-        class: h(["pointer-events-none fixed z-60 flex flex-col gap-2", t.value])
+    return (a, l) => (i(), U(ge, { to: "body" }, [
+      B("div", {
+        class: y(["pointer-events-none fixed z-60 flex flex-col gap-2", t.value])
       }, [
-        O(mt, {
+        O(kt, {
           "enter-active-class": "transition-all duration-300 ease-out",
           "leave-active-class": "transition-all duration-200 ease-in",
           "enter-from-class": "translate-y-2 opacity-0",
           "leave-to-class": "translate-y-2 opacity-0",
           "move-class": "transition-transform duration-300"
         }, {
-          default: K(() => [
-            (r(!0), i(Z, null, le(e.toasts, (o) => (r(), i("div", {
+          default: G(() => [
+            (i(!0), r(te, null, ue(e.toasts, (o) => (i(), r("div", {
               key: o.id,
-              role: R(Ze)(o.tone ?? "info"),
+              role: F(it)(o.tone ?? "info"),
               "aria-atomic": "true",
-              class: h(["pointer-events-auto rounded-corner border px-4 py-2 text-sm shadow-lg backdrop-blur-sm", R(Je)[o.tone ?? "info"]])
+              class: y(["pointer-events-auto rounded-corner border px-4 py-2 text-sm shadow-lg backdrop-blur-sm", F(ot)[o.tone ?? "info"]])
             }, [
               S(a.$slots, "default", { aviso: o }, () => [
-                Le(V(o.message), 1)
+                Me(M(o.message), 1)
               ])
-            ], 10, Ua))), 128))
+            ], 10, un))), 128))
           ]),
           _: 3
         })
       ], 2)
     ]));
   }
-}), Wa = ["aria-label", "aria-valuenow"], Ga = {
+}), dn = ["aria-label", "aria-valuenow"], fn = {
   key: 1,
   class: "h-full w-full animate-pulse rounded-corner bg-primary motion-reduce:animate-none motion-reduce:bg-primary/40"
-}, Qa = /* @__PURE__ */ E({
+}, mn = /* @__PURE__ */ D({
   __name: "ProgressBar",
   props: {
     value: {},
@@ -1323,7 +1385,7 @@ const Ma = ["role"], Ia = {
     }, a = v(
       () => n.value === null ? null : Math.max(0, Math.min(100, n.value))
     );
-    return (l, o) => (r(), i("div", {
+    return (l, o) => (i(), r("div", {
       role: "progressbar",
       "aria-label": e.label,
       "aria-valuenow": a.value ?? void 0,
@@ -1331,46 +1393,46 @@ const Ma = ["role"], Ia = {
       "aria-valuemax": "100",
       class: "h-2 w-full overflow-hidden rounded-corner bg-ui-surface/70"
     }, [
-      a.value !== null ? (r(), i("div", {
+      a.value !== null ? (i(), r("div", {
         key: 0,
-        class: h(["h-full rounded-corner transition-[width] duration-300 ease-out", t[e.tone]]),
-        style: se({ width: `${a.value}%` })
-      }, null, 6)) : (r(), i("div", Ga))
-    ], 8, Wa));
+        class: y(["h-full rounded-corner transition-[width] duration-300 ease-out", t[e.tone]]),
+        style: fe({ width: `${a.value}%` })
+      }, null, 6)) : (i(), r("div", fn))
+    ], 8, dn));
   }
-}), Ya = /[/\-_.]/;
-function we(e, n) {
+}), bn = /[/\-_.]/;
+function Le(e, n) {
   if (!n) return 100;
   const t = n.toLowerCase();
-  return t === e ? 0 : t.startsWith(e) ? 10 : t.split(Ya).some((a) => a.startsWith(e)) ? 30 : t.includes(e) ? 40 : 100;
+  return t === e ? 0 : t.startsWith(e) ? 10 : t.split(bn).some((a) => a.startsWith(e)) ? 30 : t.includes(e) ? 40 : 100;
 }
-function Xa(e, n) {
+function vn(e, n) {
   const t = n.trim().toLowerCase();
   if (!t) return e;
   const a = [];
   for (let l = 0; l < e.length; l++) {
-    const o = e[l], s = we(t, o.valor), u = we(t, o.etiqueta), m = u === 10 ? 20 : u, d = we(t, o.detalle) === 100 ? 100 : 40, L = Math.min(s, m, d);
-    L !== 100 && a.push({ opcion: o, rango: L, orden: l });
+    const o = e[l], s = Le(t, o.valor), u = Le(t, o.etiqueta), m = u === 10 ? 20 : u, d = Le(t, o.detalle) === 100 ? 100 : 40, E = Math.min(s, m, d);
+    E !== 100 && a.push({ opcion: o, rango: E, orden: l });
   }
   return a.sort((l, o) => l.rango - o.rango || l.orden - o.orden), a.map((l) => l.opcion);
 }
-let je = 0;
-function Ja() {
-  return je += 1, `vsk-lista-${je}`;
+let Ue = 0;
+function pn() {
+  return Ue += 1, `vsk-lista-${Ue}`;
 }
-const Za = ["disabled", "aria-label", "aria-expanded"], _a = { class: "min-w-0 flex-1 truncate" }, en = {
+const yn = ["disabled", "aria-label", "aria-expanded"], gn = { class: "min-w-0 flex-1 truncate" }, hn = {
   key: 0,
   class: "ml-2 text-tx-muted text-xs"
-}, tn = { class: "border-ui-border border-b p-2" }, an = ["id"], nn = {
+}, xn = { class: "border-ui-border border-b p-2" }, wn = ["id"], kn = {
   key: 0,
   class: "p-3 text-center text-tx-muted text-xs"
-}, ln = ["id", "data-indice", "aria-selected"], on = { class: "min-w-0 flex-1 truncate" }, rn = {
+}, $n = ["id", "data-indice", "aria-selected"], Cn = { class: "min-w-0 flex-1 truncate" }, zn = {
   key: 0,
   class: "shrink-0 text-tx-muted text-xs"
-}, sn = {
+}, En = {
   key: 1,
   class: "px-2 py-1 text-tx-muted text-xs"
-}, un = /* @__PURE__ */ E({
+}, Ln = /* @__PURE__ */ D({
   __name: "SearchSelect",
   props: {
     modelValue: {},
@@ -1385,69 +1447,69 @@ const Za = ["disabled", "aria-label", "aria-expanded"], _a = { class: "min-w-0 f
   },
   emits: ["update:modelValue"],
   setup(e, { emit: n }) {
-    const t = e, a = n, l = w(""), o = w(!1), s = w(0), u = w(null), m = w(null), f = w(null), d = Ja(), L = v(
-      () => t.options.find((B) => B.valor === t.modelValue) ?? null
-    ), D = v(() => Xa(t.options, l.value)), A = v(() => D.value.slice(0, t.limit)), y = v(() => Math.max(0, D.value.length - t.limit)), $ = v(
+    const t = e, a = n, l = w(""), o = w(!1), s = w(0), u = w(null), m = w(null), f = w(null), d = pn(), E = v(
+      () => t.options.find((T) => T.valor === t.modelValue) ?? null
+    ), L = v(() => vn(t.options, l.value)), A = v(() => L.value.slice(0, t.limit)), g = v(() => Math.max(0, L.value.length - t.limit)), $ = v(
       () => A.value.length > 0 ? `${d}-${s.value}` : void 0
     );
-    function j(B) {
-      a("update:modelValue", B), g();
+    function j(T) {
+      a("update:modelValue", T), h();
     }
     async function C() {
       o.value = !0;
-      const B = A.value.findIndex((z) => z.valor === t.modelValue);
-      s.value = B >= 0 ? B : 0, await Y(), f.value?.enfocar(), U();
+      const T = A.value.findIndex((z) => z.valor === t.modelValue);
+      s.value = T >= 0 ? T : 0, await J(), f.value?.enfocar(), K();
     }
-    function g(B = !0) {
-      o.value && (o.value = !1, l.value = "", B && Y(() => m.value?.focus()));
+    function h(T = !0) {
+      o.value && (o.value = !1, l.value = "", T && J(() => m.value?.focus()));
     }
-    function c(B) {
+    function c(T) {
       const z = A.value.length;
-      z !== 0 && (s.value = (s.value + B + z) % z, U());
+      z !== 0 && (s.value = (s.value + T + z) % z, K());
     }
-    function b(B) {
-      s.value = B, U();
+    function b(T) {
+      s.value = T, K();
     }
-    function p(B) {
-      const z = B.target?.closest?.("[data-indice]");
+    function p(T) {
+      const z = T.target?.closest?.("[data-indice]");
       if (!z) return null;
       const I = Number(z.getAttribute("data-indice"));
       return Number.isInteger(I) ? I : null;
     }
-    function P(B) {
-      const z = p(B), I = z === null ? void 0 : A.value[z];
+    function P(T) {
+      const z = p(T), I = z === null ? void 0 : A.value[z];
       I && j(I.valor);
     }
-    function _(B) {
-      const z = p(B);
+    function le(T) {
+      const z = p(T);
       z !== null && (s.value = z);
     }
-    function U() {
-      Y(() => {
+    function K() {
+      J(() => {
         u.value?.querySelector(`[data-indice="${s.value}"]`)?.scrollIntoView({ block: "nearest" });
       });
     }
-    function ee() {
-      const B = A.value[s.value];
-      B && j(B.valor);
+    function oe() {
+      const T = A.value[s.value];
+      T && j(T.valor);
     }
-    W(
+    Q(
       () => t.disabled,
-      (B) => {
-        B && g(!1);
+      (T) => {
+        T && h(!1);
       }
-    ), W(l, () => {
-      s.value = 0, U();
+    ), Q(l, () => {
+      s.value = 0, K();
     });
-    function G(B) {
-      const z = B.relatedTarget;
-      z && B.currentTarget.contains(z) || g(!1);
+    function Y(T) {
+      const z = T.relatedTarget;
+      z && T.currentTarget.contains(z) || h(!1);
     }
-    return (B, z) => (r(), i("div", {
+    return (T, z) => (i(), r("div", {
       class: "relative",
-      onFocusout: G
+      onFocusout: Y
     }, [
-      T("button", {
+      B("button", {
         ref_key: "boton",
         ref: m,
         type: "button",
@@ -1456,79 +1518,79 @@ const Za = ["disabled", "aria-label", "aria-expanded"], _a = { class: "min-w-0 f
         "aria-label": e.label || void 0,
         "aria-expanded": o.value,
         "aria-haspopup": "listbox",
-        onClick: z[0] || (z[0] = (I) => o.value ? g() : C()),
+        onClick: z[0] || (z[0] = (I) => o.value ? h() : C()),
         onKeydown: [
-          z[1] || (z[1] = F(M((I) => o.value ? c(1) : C(), ["prevent"]), ["down"])),
-          z[2] || (z[2] = F(M((I) => o.value ? c(-1) : C(), ["prevent"]), ["up"]))
+          z[1] || (z[1] = R(V((I) => o.value ? c(1) : C(), ["prevent"]), ["down"])),
+          z[2] || (z[2] = R(V((I) => o.value ? c(-1) : C(), ["prevent"]), ["up"]))
         ]
       }, [
-        T("span", _a, [
-          Le(V(L.value?.etiqueta ?? e.placeholder) + " ", 1),
-          L.value?.detalle ? (r(), i("span", en, V(L.value.detalle), 1)) : x("", !0)
+        B("span", gn, [
+          Me(M(E.value?.etiqueta ?? e.placeholder) + " ", 1),
+          E.value?.detalle ? (i(), r("span", hn, M(E.value.detalle), 1)) : x("", !0)
         ]),
-        O(H, {
+        O(N, {
           name: "go-down",
           type: "symbol",
           size: 12,
           class: "shrink-0 opacity-60"
         })
-      ], 40, Za),
-      o.value ? (r(), i("div", {
+      ], 40, yn),
+      o.value ? (i(), r("div", {
         key: 0,
-        class: h(["absolute z-20 w-full min-w-64 rounded-corner border border-ui-border-strong bg-ui-bg shadow-lg", e.up ? "bottom-full mb-1" : "mt-1"]),
+        class: y(["absolute z-20 w-full min-w-64 rounded-corner border border-ui-border-strong bg-ui-bg shadow-lg", e.up ? "bottom-full mb-1" : "mt-1"]),
         onKeydown: [
-          z[4] || (z[4] = F(M((I) => g(), ["prevent"]), ["escape"])),
-          z[5] || (z[5] = F(M((I) => c(1), ["prevent"]), ["down"])),
-          z[6] || (z[6] = F(M((I) => c(-1), ["prevent"]), ["up"])),
-          z[7] || (z[7] = F(M((I) => b(0), ["prevent"]), ["home"])),
-          z[8] || (z[8] = F(M((I) => b(A.value.length - 1), ["prevent"]), ["end"])),
-          z[9] || (z[9] = F(M((I) => ee(), ["prevent"]), ["enter"])),
-          z[10] || (z[10] = F((I) => g(!1), ["tab"]))
+          z[4] || (z[4] = R(V((I) => h(), ["prevent"]), ["escape"])),
+          z[5] || (z[5] = R(V((I) => c(1), ["prevent"]), ["down"])),
+          z[6] || (z[6] = R(V((I) => c(-1), ["prevent"]), ["up"])),
+          z[7] || (z[7] = R(V((I) => b(0), ["prevent"]), ["home"])),
+          z[8] || (z[8] = R(V((I) => b(A.value.length - 1), ["prevent"]), ["end"])),
+          z[9] || (z[9] = R(V((I) => oe(), ["prevent"]), ["enter"])),
+          z[10] || (z[10] = R((I) => h(!1), ["tab"]))
         ],
         onClick: P,
-        onMousemove: _
+        onMousemove: le
       }, [
-        T("div", tn, [
-          O(Te, {
+        B("div", xn, [
+          O(Oe, {
             ref_key: "campo",
             ref: f,
             modelValue: l.value,
             "onUpdate:modelValue": z[3] || (z[3] = (I) => l.value = I),
             label: e.label,
             placeholder: e.searchPlaceholder,
-            "listbox-id": R(d),
+            "listbox-id": F(d),
             "active-option-id": $.value,
             expanded: o.value
           }, null, 8, ["modelValue", "label", "placeholder", "listbox-id", "active-option-id", "expanded"])
         ]),
-        T("ul", {
-          id: R(d),
+        B("ul", {
+          id: F(d),
           ref_key: "lista",
           ref: u,
           role: "listbox",
           class: "max-h-56 overflow-y-auto p-1"
         }, [
-          A.value.length === 0 ? (r(), i("li", nn, V(e.emptyText), 1)) : x("", !0),
-          (r(!0), i(Z, null, le(A.value, (I, ie) => (r(), i("li", {
-            id: `${R(d)}-${ie}`,
+          A.value.length === 0 ? (i(), r("li", kn, M(e.emptyText), 1)) : x("", !0),
+          (i(!0), r(te, null, ue(A.value, (I, de) => (i(), r("li", {
+            id: `${F(d)}-${de}`,
             key: I.valor,
-            "data-indice": ie,
+            "data-indice": de,
             role: "option",
             "aria-selected": I.valor === e.modelValue,
-            class: h(["flex cursor-pointer items-baseline gap-2 rounded-corner px-2 py-1 text-sm", [
-              ie === s.value ? "bg-ui-surface" : "",
+            class: y(["flex cursor-pointer items-baseline gap-2 rounded-corner px-2 py-1 text-sm", [
+              de === s.value ? "bg-ui-surface" : "",
               I.valor === e.modelValue ? "font-medium text-primary" : "text-tx-main"
             ]])
           }, [
-            T("span", on, V(I.etiqueta), 1),
-            I.detalle ? (r(), i("span", rn, V(I.detalle), 1)) : x("", !0)
-          ], 10, ln))), 128)),
-          y.value > 0 ? (r(), i("li", sn, "+" + V(y.value), 1)) : x("", !0)
-        ], 8, an)
+            B("span", Cn, M(I.etiqueta), 1),
+            I.detalle ? (i(), r("span", zn, M(I.detalle), 1)) : x("", !0)
+          ], 10, $n))), 128)),
+          g.value > 0 ? (i(), r("li", En, "+" + M(g.value), 1)) : x("", !0)
+        ], 8, wn)
       ], 34)) : x("", !0)
     ], 32));
   }
-}), cn = { class: "text-base font-semibold m-0 text-primary dark:text-primary-dark" }, dn = /* @__PURE__ */ E({
+}), Dn = { class: "text-base font-semibold m-0 text-primary dark:text-primary-dark" }, Tn = /* @__PURE__ */ D({
   __name: "ConfigSection",
   props: {
     title: {},
@@ -1536,29 +1598,31 @@ const Za = ["disabled", "aria-label", "aria-expanded"], _a = { class: "min-w-0 f
     customClass: { default: () => ({}) }
   },
   setup(e) {
-    return (n, t) => (r(), i("div", {
-      class: h(["flex flex-col gap-4 p-4 background rounded-corner", e.customClass])
+    return (n, t) => (i(), r("div", {
+      class: y(["flex flex-col gap-4 p-4 background rounded-corner", e.customClass])
     }, [
-      T("h3", cn, V(e.icon ? `${e.icon} ${e.title}` : e.title), 1),
+      B("h3", Dn, M(e.icon ? `${e.icon} ${e.title}` : e.title), 1),
       S(n.$slots, "default", {}, void 0, !0)
     ], 2));
   }
-}), fn = /* @__PURE__ */ ge(dn, [["__scopeId", "data-v-45bd4eab"]]), mn = { class: "flex items-center gap-3 flex-1 min-w-0" }, bn = ["src", "alt"], vn = { class: "min-w-0" }, pn = { class: "font-semibold truncate" }, yn = {
+}), An = /* @__PURE__ */ $e(Tn, [["__scopeId", "data-v-45bd4eab"]]), Bn = { class: "flex items-center gap-3 flex-1 min-w-0" }, Sn = ["src", "alt"], Mn = { class: "min-w-0" }, Vn = { class: "font-semibold truncate" }, In = {
   key: 0,
   class: "text-xs text-gray-400 truncate"
-}, gn = {
+}, On = {
   key: 1,
   class: "text-xs text-gray-400 truncate"
-}, hn = {
+}, jn = {
   key: 2,
   class: "text-xs text-gray-400 flex gap-2 mt-1"
-}, xn = {
+}, Pn = {
   key: 1,
   class: "w-2 h-2 rounded-full bg-green-500"
-}, wn = /* @__PURE__ */ E({
+}, Rn = /* @__PURE__ */ D({
   __name: "DeviceCard",
   props: {
-    icon: {},
+    name: { default: "" },
+    type: { default: "icon" },
+    icon: { default: "" },
     title: {},
     subtitle: { default: "" },
     metadata: { default: "" },
@@ -1572,41 +1636,52 @@ const Za = ["disabled", "aria-label", "aria-expanded"], _a = { class: "min-w-0 f
   },
   emits: ["action", "click"],
   setup(e, { emit: n }) {
-    const t = n, a = () => {
-      t("action");
-    }, l = () => {
-      t("click");
+    const t = e, a = n, l = () => {
+      a("action");
+    }, o = () => {
+      a("click");
     };
-    return (o, s) => (r(), i("div", {
-      class: h(["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: l
+    return W(() => {
+      t.icon && !t.name && console.warn(
+        "[DeviceCard] «icon» está obsoleto y se va en la próxima mayor: recibe una ruta ya resuelta. Usá «name» con el nombre del icono del tema, y «type» si hace falta el símbolo."
+      );
+    }), (s, u) => (i(), r("div", {
+      class: y(["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
     }, [
-      T("div", mn, [
-        T("img", {
+      B("div", Bn, [
+        e.name ? (i(), U(N, {
+          key: 0,
+          name: e.name,
+          type: e.type,
+          size: 28,
+          alt: e.title
+        }, null, 8, ["name", "type", "alt"])) : (i(), r("img", {
+          key: 1,
           src: e.icon,
           alt: e.title,
           class: "h-7 w-7 shrink-0"
-        }, null, 8, bn),
-        T("div", vn, [
-          T("div", pn, V(e.title), 1),
-          e.subtitle ? (r(), i("div", yn, V(e.subtitle), 1)) : x("", !0),
-          e.metadata ? (r(), i("div", gn, V(e.metadata), 1)) : x("", !0),
-          e.extraInfo && e.extraInfo.length > 0 ? (r(), i("div", hn, [
-            (r(!0), i(Z, null, le(e.extraInfo, (u, m) => (r(), i("span", { key: m }, V(u), 1))), 128))
+        }, null, 8, Sn)),
+        B("div", Mn, [
+          B("div", Vn, M(e.title), 1),
+          e.subtitle ? (i(), r("div", In, M(e.subtitle), 1)) : x("", !0),
+          e.metadata ? (i(), r("div", On, M(e.metadata), 1)) : x("", !0),
+          e.extraInfo && e.extraInfo.length > 0 ? (i(), r("div", jn, [
+            (i(!0), r(te, null, ue(e.extraInfo, (m, f) => (i(), r("span", { key: f }, M(m), 1))), 128))
           ])) : x("", !0)
         ])
       ]),
-      e.showActionButton ? (r(), i("button", {
+      e.showActionButton ? (i(), r("button", {
         key: 0,
         class: "bg-vsk-primary rounded-vsk px-4 py-2 text-sm font-semibold cursor-pointer hover:opacity-70",
-        onClick: M(a, ["stop"])
-      }, V(e.actionLabel), 1)) : x("", !0),
-      e.showStatusIndicator && e.isConnected ? (r(), i("div", xn)) : x("", !0)
+        onClick: V(l, ["stop"])
+      }, M(e.actionLabel), 1)) : x("", !0),
+      e.showStatusIndicator && e.isConnected ? (i(), r("div", Pn)) : x("", !0)
     ], 2));
   }
-}), _e = /* @__PURE__ */ Symbol("diálogo de vasak");
-function et() {
-  const e = pe(_e, null);
+}), rt = /* @__PURE__ */ Symbol("diálogo de vasak");
+function st() {
+  const e = we(rt, null);
   if (e) return e;
   const n = w(!1);
   return {
@@ -1619,11 +1694,11 @@ function et() {
     }
   };
 }
-let Pe = 0;
-function kn() {
-  return Pe += 1, `vsk-dialogo-titulo-${Pe}`;
+let Ke = 0;
+function Fn() {
+  return Ke += 1, `vsk-dialogo-titulo-${Ke}`;
 }
-const $n = /* @__PURE__ */ E({
+const Nn = /* @__PURE__ */ D({
   __name: "Dialog",
   props: {
     open: { type: Boolean, default: !1 }
@@ -1631,7 +1706,7 @@ const $n = /* @__PURE__ */ E({
   emits: ["update:open"],
   setup(e, { emit: n }) {
     const t = e, a = n, l = w(null);
-    return fe(_e, {
+    return ye(rt, {
       abierto: v(() => t.open),
       cerrar: () => a("update:open", !1),
       idDelTitulo: l,
@@ -1640,10 +1715,10 @@ const $n = /* @__PURE__ */ E({
       }
     }), (o, s) => S(o.$slots, "default");
   }
-}), Cn = {
+}), qn = {
   key: 0,
   class: "absolute inset-0 rounded-corner-window bg-ui-border-dark/40"
-}, zn = ["aria-labelledby", "aria-label"], Ln = "relative z-10 w-full rounded-corner border border-ui-border bg-ui-bg/80 p-6 text-tx-main shadow-lg", Dn = /* @__PURE__ */ E({
+}, Hn = ["aria-labelledby", "aria-label"], Un = "relative z-10 w-full rounded-corner border border-ui-border bg-ui-bg/80 p-6 text-tx-main shadow-lg", Kn = /* @__PURE__ */ D({
   inheritAttrs: !1,
   __name: "DialogContent",
   props: {
@@ -1651,46 +1726,46 @@ const $n = /* @__PURE__ */ E({
     ariaLabel: {}
   },
   setup(e) {
-    const n = e, t = Ce(), a = v(() => t.class ?? ""), l = v(() => {
-      const { class: C, ...g } = t;
-      return g;
-    }), o = v(() => n.size === "full" ? "relative z-10 h-full w-full overflow-hidden rounded-corner-window text-tx-main" : `${Ln} ${n.size === "lg" ? "max-w-2xl" : "max-w-lg"}`), s = et(), u = v(() => s.abierto.value), m = w(null), f = w(null);
+    const n = e, t = Be(), a = v(() => t.class ?? ""), l = v(() => {
+      const { class: C, ...h } = t;
+      return h;
+    }), o = v(() => n.size === "full" ? "relative z-10 h-full w-full overflow-hidden rounded-corner-window text-tx-main" : `${Un} ${n.size === "lg" ? "max-w-2xl" : "max-w-lg"}`), s = st(), u = v(() => s.abierto.value), m = w(null), f = w(null);
     let d = null;
-    function L() {
+    function E() {
       return f.value ? [...f.value.querySelectorAll('a[href], button:not([disabled]), textarea:not([disabled]), input:not([disabled]), select:not([disabled]), [tabindex]:not([tabindex="-1"])')] : [];
     }
-    function D(C) {
+    function L(C) {
       if (C.key === "Escape") {
         s.cerrar();
         return;
       }
       if (C.key !== "Tab") return;
-      const g = L();
-      if (g.length === 0) {
+      const h = E();
+      if (h.length === 0) {
         C.preventDefault(), f.value?.focus();
         return;
       }
-      const c = g[0], b = g[g.length - 1], p = document.activeElement;
+      const c = h[0], b = h[h.length - 1], p = document.activeElement;
       C.shiftKey && (p === c || p === f.value) ? (C.preventDefault(), b.focus()) : !C.shiftKey && p === b && (C.preventDefault(), c.focus());
     }
     function A(C) {
       C.target === C.currentTarget && s.cerrar();
     }
-    function y(C) {
-      m.value?.contains(C.target) || D(C);
+    function g(C) {
+      m.value?.contains(C.target) || L(C);
     }
     function $() {
-      document.removeEventListener("keydown", y);
+      document.removeEventListener("keydown", g);
     }
     function j() {
       const C = d;
       d = null, C?.isConnected && C.focus();
     }
-    return W(
+    return Q(
       u,
       async (C) => {
         if (C) {
-          d = document.activeElement, document.addEventListener("keydown", y), await Y(), f.value?.focus();
+          d = document.activeElement, document.addEventListener("keydown", g), await J(), f.value?.focus();
           return;
         }
         $(), j();
@@ -1699,79 +1774,79 @@ const $n = /* @__PURE__ */ E({
       // abierto —una vista que arranca preguntando algo—. Sin esto, ése no recibe
       // el foco y ni Escape ni el Tab hacen nada: el `aria-modal` queda en promesa.
       { immediate: !0 }
-    ), ce(() => {
+    ), ve(() => {
       $(), j();
-    }), (C, g) => (r(), Q(me, { to: "body" }, [
-      O(ye, {
+    }), (C, h) => (i(), U(ge, { to: "body" }, [
+      O(ke, {
         "enter-active-class": "transition-opacity duration-200 ease-out",
         "leave-active-class": "transition-opacity duration-150 ease-in",
         "enter-from-class": "opacity-0",
         "leave-to-class": "opacity-0"
       }, {
-        default: K(() => [
-          u.value ? (r(), i("div", {
+        default: G(() => [
+          u.value ? (i(), r("div", {
             key: 0,
             ref_key: "velo",
             ref: m,
             class: "fixed inset-0 z-50 flex items-center justify-center",
             onClick: A,
-            onKeydown: D
+            onKeydown: L
           }, [
-            n.size === "md" ? (r(), i("div", Cn)) : x("", !0),
-            T("div", re({
+            n.size === "md" ? (i(), r("div", qn)) : x("", !0),
+            B("div", ce({
               ref_key: "panel",
               ref: f,
               tabindex: "-1",
               role: "dialog",
               "aria-modal": "true",
-              "aria-labelledby": R(s).idDelTitulo.value ?? void 0,
-              "aria-label": R(s).idDelTitulo.value ? void 0 : e.ariaLabel
+              "aria-labelledby": F(s).idDelTitulo.value ?? void 0,
+              "aria-label": F(s).idDelTitulo.value ? void 0 : e.ariaLabel
             }, l.value, {
               class: [a.value, o.value]
             }), [
               S(C.$slots, "default")
-            ], 16, zn)
+            ], 16, Hn)
           ], 544)) : x("", !0)
         ]),
         _: 3
       })
     ]));
   }
-}), En = { class: "text-sm text-tx-muted" }, Tn = /* @__PURE__ */ E({
+}), Wn = { class: "text-sm text-tx-muted" }, Gn = /* @__PURE__ */ D({
   __name: "DialogDescription",
   setup(e) {
-    return (n, t) => (r(), i("p", En, [
+    return (n, t) => (i(), r("p", Wn, [
       S(n.$slots, "default")
     ]));
   }
-}), Bn = { class: "flex flex-col-reverse gap-2 sm:flex-row sm:justify-end" }, An = /* @__PURE__ */ E({
+}), Qn = { class: "flex flex-col-reverse gap-2 sm:flex-row sm:justify-end" }, Yn = /* @__PURE__ */ D({
   __name: "DialogFooter",
   setup(e) {
-    return (n, t) => (r(), i("div", Bn, [
+    return (n, t) => (i(), r("div", Qn, [
       S(n.$slots, "default")
     ]));
   }
-}), Sn = { class: "flex flex-col gap-1.5 text-center sm:text-left" }, Vn = /* @__PURE__ */ E({
+}), Xn = { class: "flex flex-col gap-1.5 text-center sm:text-left" }, Jn = /* @__PURE__ */ D({
   __name: "DialogHeader",
   setup(e) {
-    return (n, t) => (r(), i("div", Sn, [
+    return (n, t) => (i(), r("div", Xn, [
       S(n.$slots, "default")
     ]));
   }
-}), Mn = ["id"], In = /* @__PURE__ */ E({
+}), Zn = ["id"], _n = /* @__PURE__ */ D({
   __name: "DialogTitle",
   setup(e) {
-    const n = et(), t = kn();
-    return X(() => n.ponerElTitulo(t)), ce(() => n.ponerElTitulo(null)), (a, l) => (r(), i("h2", {
-      id: R(t),
+    const n = st(), t = Fn();
+    return W(() => n.ponerElTitulo(t)), ve(() => n.ponerElTitulo(null)), (a, l) => (i(), r("h2", {
+      id: F(t),
       class: "font-semibold text-lg leading-none tracking-tight"
     }, [
       S(a.$slots, "default")
-    ], 8, Mn));
+    ], 8, Zn));
   }
-}), tt = /* @__PURE__ */ Symbol("menú de vasak");
-function he() {
-  const e = pe(tt, null);
+}), ut = /* @__PURE__ */ Symbol("menú de vasak");
+function Ce() {
+  const e = we(ut, null);
   if (e) return e;
   const n = w(!1);
   return {
@@ -1795,70 +1870,70 @@ function he() {
     }
   };
 }
-let Fe = 0;
-function at() {
-  return Fe += 1, `vsk-menu-${Fe}`;
+let We = 0;
+function ct() {
+  return We += 1, `vsk-menu-${We}`;
 }
-const On = { class: "relative inline-block" }, jn = /* @__PURE__ */ E({
+const el = { class: "relative inline-block" }, tl = /* @__PURE__ */ D({
   __name: "DropdownMenu",
   props: {
     open: { type: Boolean, default: void 0 }
   },
   emits: ["update:open"],
   setup(e, { emit: n }) {
-    const t = e, a = n, l = w(!1), o = w(null), s = w(null), u = w("ninguno"), m = at();
+    const t = e, a = n, l = w(!1), o = w(null), s = w(null), u = w("ninguno"), m = ct();
     let f = null;
     const d = v({
       get: () => t.open ?? l.value,
-      set: (y) => {
-        t.open === void 0 && (l.value = y), a("update:open", y);
+      set: (g) => {
+        t.open === void 0 && (l.value = g), a("update:open", g);
       }
     });
-    W(d, (y) => {
-      if (y) {
+    Q(d, (g) => {
+      if (g) {
         const $ = document.activeElement;
         f = $ instanceof HTMLElement ? $ : null;
       } else
         u.value = "ninguno";
     });
-    function L(y = "ninguno") {
-      u.value = y, d.value = !0;
+    function E(g = "ninguno") {
+      u.value = g, d.value = !0;
     }
-    function D(y = {}) {
-      if (d.value = !1, !y.devolverElFoco) return;
+    function L(g = {}) {
+      if (d.value = !1, !g.devolverElFoco) return;
       const $ = f ?? o.value;
       $?.isConnected && $.focus();
     }
-    function A(y = "ninguno") {
+    function A(g = "ninguno") {
       if (d.value) {
-        D({ devolverElFoco: !0 });
+        L({ devolverElFoco: !0 });
         return;
       }
-      L(y);
+      E(g);
     }
-    return fe(tt, {
+    return ye(ut, {
       abierto: d,
       idDelMenu: m,
       idDeLaEtiqueta: s,
-      ponerLaEtiqueta: (y) => {
-        s.value = y;
+      ponerLaEtiqueta: (g) => {
+        s.value = g;
       },
       disparador: o,
-      ponerElDisparador: (y) => {
-        o.value = y;
+      ponerElDisparador: (g) => {
+        o.value = g;
       },
       focoAlAbrir: u,
-      abrir: L,
-      cerrar: D,
+      abrir: E,
+      cerrar: L,
       alternar: A
-    }), (y, $) => (r(), i("div", On, [
-      S(y.$slots, "default")
+    }), (g, $) => (i(), r("div", el, [
+      S(g.$slots, "default")
     ]));
   }
-}), Pn = ["id", "aria-labelledby", "inert"], Fn = {
+}), al = ["id", "aria-labelledby", "inert"], nl = {
   role: "none",
   class: "py-1"
-}, J = 8, Rn = /* @__PURE__ */ E({
+}, Z = 8, ll = /* @__PURE__ */ D({
   inheritAttrs: !1,
   __name: "DropdownMenuContent",
   props: {
@@ -1867,7 +1942,7 @@ const On = { class: "relative inline-block" }, jn = /* @__PURE__ */ E({
     sideOffset: { default: 4 }
   },
   setup(e) {
-    const n = e, t = he(), { idDelMenu: a, idDeLaEtiqueta: l } = t, o = v(() => t.disparador.value), s = v(() => t.abierto.value), u = w(null), m = w({
+    const n = e, t = Ce(), { idDelMenu: a, idDeLaEtiqueta: l } = t, o = v(() => t.disparador.value), s = v(() => t.abierto.value), u = w(null), m = w({
       top: 0,
       left: 0,
       techo: null
@@ -1878,7 +1953,7 @@ const On = { class: "relative inline-block" }, jn = /* @__PURE__ */ E({
       right: "left"
     };
     function d(c, b) {
-      const p = n.sideOffset + J;
+      const p = n.sideOffset + Z;
       switch (c) {
         case "bottom":
           return window.innerHeight - b.bottom - p;
@@ -1890,51 +1965,51 @@ const On = { class: "relative inline-block" }, jn = /* @__PURE__ */ E({
           return b.left - p;
       }
     }
-    function L(c, b, p) {
+    function E(c, b, p) {
       return p < b ? b : Math.min(Math.max(c, b), p);
     }
-    function D() {
+    function L() {
       if (!o.value || !u.value) return;
-      const c = o.value.getBoundingClientRect(), b = u.value.scrollHeight, p = u.value.offsetWidth, P = n.side === "top" || n.side === "bottom", _ = P ? b : p;
-      let U = n.side;
-      const ee = d(U, c);
-      ee < _ && d(f[U], c) > ee && (U = f[U]);
-      let G = 0, B = 0, z = null;
-      switch (U) {
+      const c = o.value.getBoundingClientRect(), b = u.value.scrollHeight, p = u.value.offsetWidth, P = n.side === "top" || n.side === "bottom", le = P ? b : p;
+      let K = n.side;
+      const oe = d(K, c);
+      oe < le && d(f[K], c) > oe && (K = f[K]);
+      let Y = 0, T = 0, z = null;
+      switch (K) {
         case "bottom": {
-          G = c.bottom + n.sideOffset, z = Math.max(window.innerHeight - G - J, 0);
+          Y = c.bottom + n.sideOffset, z = Math.max(window.innerHeight - Y - Z, 0);
           break;
         }
         case "top": {
-          z = Math.max(d("top", c), 0), G = c.top - n.sideOffset - Math.min(b, z);
+          z = Math.max(d("top", c), 0), Y = c.top - n.sideOffset - Math.min(b, z);
           break;
         }
         case "left":
         case "right": {
-          B = U === "right" ? c.right + n.sideOffset : c.left - p - n.sideOffset;
-          const I = window.innerHeight - 2 * J;
-          G = L(c.top, J, window.innerHeight - Math.min(b, I) - J), z = Math.max(window.innerHeight - G - J, 0);
+          T = K === "right" ? c.right + n.sideOffset : c.left - p - n.sideOffset;
+          const I = window.innerHeight - 2 * Z;
+          Y = E(c.top, Z, window.innerHeight - Math.min(b, I) - Z), z = Math.max(window.innerHeight - Y - Z, 0);
           break;
         }
       }
       if (P)
         switch (n.align) {
           case "start":
-            B = c.left;
+            T = c.left;
             break;
           case "center":
-            B = c.left + c.width / 2 - p / 2;
+            T = c.left + c.width / 2 - p / 2;
             break;
           case "end":
-            B = c.right - p;
+            T = c.right - p;
             break;
         }
-      B = L(B, J, window.innerWidth - p - J), m.value = { top: G, left: B, techo: z };
+      T = E(T, Z, window.innerWidth - p - Z), m.value = { top: Y, left: T, techo: z };
     }
     function A() {
       return u.value ? Array.from(u.value.querySelectorAll('[role="menuitem"]')) : [];
     }
-    function y(c) {
+    function g(c) {
       const b = A();
       if (!b.length) return;
       const p = b.length;
@@ -1948,16 +2023,16 @@ const On = { class: "relative inline-block" }, jn = /* @__PURE__ */ E({
       const b = $();
       switch (c.key) {
         case "ArrowDown":
-          c.preventDefault(), y(b + 1);
+          c.preventDefault(), g(b + 1);
           break;
         case "ArrowUp":
-          c.preventDefault(), y(b <= 0 ? -1 : b - 1);
+          c.preventDefault(), g(b <= 0 ? -1 : b - 1);
           break;
         case "Home":
-          c.preventDefault(), y(0);
+          c.preventDefault(), g(0);
           break;
         case "End":
-          c.preventDefault(), y(-1);
+          c.preventDefault(), g(-1);
           break;
         case "Escape":
           c.preventDefault(), c.stopPropagation(), t.cerrar({ devolverElFoco: !0 });
@@ -1967,16 +2042,16 @@ const On = { class: "relative inline-block" }, jn = /* @__PURE__ */ E({
           break;
       }
     }
-    W(s, async (c) => {
+    Q(s, async (c) => {
       if (c)
-        switch (await Y(), requestAnimationFrame(() => {
-          D();
+        switch (await J(), requestAnimationFrame(() => {
+          L();
         }), t.focoAlAbrir.value) {
           case "primero":
-            y(0);
+            g(0);
             break;
           case "ultimo":
-            y(-1);
+            g(-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
@@ -1986,18 +2061,18 @@ const On = { class: "relative inline-block" }, jn = /* @__PURE__ */ E({
         }
     });
     function C(c) {
-      s.value && (c && u.value?.contains(c.target) || D());
+      s.value && (c && u.value?.contains(c.target) || L());
     }
-    function g(c) {
+    function h(c) {
       const b = c.target, p = !!b.closest("[data-dropdown-content]"), P = !!o.value?.contains(b);
       !p && !P && t.cerrar();
     }
-    return X(() => {
-      document.addEventListener("click", g), window.addEventListener("resize", C), window.addEventListener("scroll", C, !0);
-    }), de(() => {
-      document.removeEventListener("click", g), window.removeEventListener("resize", C), window.removeEventListener("scroll", C, !0);
-    }), (c, b) => (r(), Q(me, { to: "body" }, [
-      O(ye, {
+    return W(() => {
+      document.addEventListener("click", h), window.addEventListener("resize", C), window.addEventListener("scroll", C, !0);
+    }), pe(() => {
+      document.removeEventListener("click", h), window.removeEventListener("resize", C), window.removeEventListener("scroll", C, !0);
+    }), (c, b) => (i(), U(ge, { to: "body" }, [
+      O(ke, {
         "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",
@@ -2005,16 +2080,16 @@ const On = { class: "relative inline-block" }, jn = /* @__PURE__ */ E({
         onEnter: b[1] || (b[1] = (p) => p.offsetHeight),
         onLeave: b[2] || (b[2] = (p) => p.offsetHeight)
       }, {
-        default: K(() => [
-          ze(T("div", re({
+        default: G(() => [
+          Se(B("div", ce({
             ref_key: "contenido",
             ref: u
           }, c.$attrs, {
-            id: R(a),
+            id: F(a),
             role: "menu",
             tabindex: "-1",
             "aria-orientation": "vertical",
-            "aria-labelledby": R(l) ?? void 0,
+            "aria-labelledby": F(l) ?? void 0,
             inert: !s.value,
             style: {
               position: "fixed",
@@ -2030,33 +2105,33 @@ const On = { class: "relative inline-block" }, jn = /* @__PURE__ */ E({
             onClick: b[0] || (b[0] = (p) => p.stopPropagation()),
             onKeydown: j
           }), [
-            T("div", Fn, [
+            B("div", nl, [
               S(c.$slots, "default")
             ])
-          ], 16, Pn), [
-            [Ne, s.value]
+          ], 16, al), [
+            [Ye, s.value]
           ])
         ]),
         _: 3
       })
     ]));
   }
-}), qn = ["aria-disabled", "onKeydown"], Nn = /* @__PURE__ */ E({
+}), ol = ["aria-disabled", "onKeydown"], il = /* @__PURE__ */ D({
   __name: "DropdownMenuItem",
   props: {
     disabled: { type: Boolean, default: !1 }
   },
   emits: ["select", "click"],
   setup(e, { emit: n }) {
-    const t = e, a = n, l = he();
+    const t = e, a = n, l = Ce();
     function o(s) {
       t.disabled || (a("select"), a("click", s), l.cerrar({ devolverElFoco: !0 }));
     }
-    return (s, u) => (r(), i("div", {
+    return (s, u) => (i(), r("div", {
       role: "menuitem",
       tabindex: "0",
       "aria-disabled": e.disabled || void 0,
-      class: h([
+      class: y([
         "px-3 py-2 text-sm transition-colors outline-none",
         {
           "opacity-50 cursor-not-allowed": e.disabled,
@@ -2065,22 +2140,22 @@ const On = { class: "relative inline-block" }, jn = /* @__PURE__ */ E({
       ]),
       onClick: o,
       onKeydown: [
-        F(M(o, ["prevent"]), ["enter"]),
-        F(M(o, ["prevent"]), ["space"])
+        R(V(o, ["prevent"]), ["enter"]),
+        R(V(o, ["prevent"]), ["space"])
       ]
     }, [
       S(s.$slots, "default")
-    ], 42, qn));
+    ], 42, ol));
   }
-}), Hn = /* @__PURE__ */ E({
+}), rl = /* @__PURE__ */ D({
   __name: "DropdownMenuLabel",
   setup(e) {
-    const n = he(), t = `${at()}-titulo`;
-    return X(() => {
+    const n = Ce(), t = `${ct()}-titulo`;
+    return W(() => {
       n.ponerLaEtiqueta(t);
-    }), de(() => {
+    }), pe(() => {
       n.ponerLaEtiqueta(null);
-    }), (a, l) => (r(), i("div", {
+    }), (a, l) => (i(), r("div", {
       id: t,
       role: "presentation",
       class: "px-3 py-2 text-sm font-semibold text-tx-main"
@@ -2088,30 +2163,30 @@ const On = { class: "relative inline-block" }, jn = /* @__PURE__ */ E({
       S(a.$slots, "default")
     ]));
   }
-}), Un = {
+}), sl = {
   role: "separator",
   "aria-orientation": "horizontal",
   class: "bg-ui-bg/80 my-4 h-0.5"
-}, Kn = /* @__PURE__ */ E({
+}, ul = /* @__PURE__ */ D({
   __name: "DropdownMenuSeparator",
   setup(e) {
-    return (n, t) => (r(), i("div", Un));
+    return (n, t) => (i(), r("div", sl));
   }
 });
-function nt(e) {
+function dt(e) {
   const n = e.filter(
-    (a) => a.type !== pt && !(a.type === yt && typeof a.children == "string" && !a.children.trim())
+    (a) => a.type !== zt && !(a.type === Et && typeof a.children == "string" && !a.children.trim())
   );
   if (n.length !== 1) return null;
   const t = n[0];
-  return t.type === Z && Array.isArray(t.children) ? nt(t.children) : t;
+  return t.type === te && Array.isArray(t.children) ? dt(t.children) : t;
 }
-function Wn(e) {
+function cl(e) {
   if (e instanceof HTMLElement) return e;
   const n = e?.$el;
   return n instanceof HTMLElement ? n : null;
 }
-const Gn = E({
+const dl = D({
   name: "DropdownMenuTrigger",
   inheritAttrs: !1,
   props: {
@@ -2121,9 +2196,9 @@ const Gn = E({
     disabled: { type: Boolean, default: !1 }
   },
   setup(e, { slots: n, attrs: t }) {
-    const a = he(), l = w(null);
+    const a = Ce(), l = w(null);
     function o() {
-      a.ponerElDisparador(Wn(l.value));
+      a.ponerElDisparador(cl(l.value));
     }
     function s() {
       e.disabled || (o(), a.alternar());
@@ -2161,17 +2236,17 @@ const Gn = E({
         onKeydown: u
       }, f = n.default?.() ?? [];
       if (e.asChild) {
-        const d = nt(f);
-        if (d) return bt(d, { ...t, ...m });
+        const d = dt(f);
+        if (d) return $t(d, { ...t, ...m });
       }
-      return vt(
+      return Ct(
         "div",
         { ...t, class: ["dropdown-menu-trigger inline-block", t.class], ...m },
         f
       );
     };
   }
-}), Qn = ["for"], Yn = /* @__PURE__ */ E({
+}), fl = ["for"], ml = /* @__PURE__ */ D({
   __name: "FormGroup",
   props: {
     label: {},
@@ -2180,18 +2255,18 @@ const Gn = E({
     labelClass: { default: () => ({}) }
   },
   setup(e) {
-    return (n, t) => (r(), i("div", {
-      class: h(["flex flex-col gap-2", e.customClass])
+    return (n, t) => (i(), r("div", {
+      class: y(["flex flex-col gap-2", e.customClass])
     }, [
-      e.label ? (r(), i("label", {
+      e.label ? (i(), r("label", {
         key: 0,
         for: e.htmlFor,
-        class: h(["text-sm font-medium text-primary dark:text-primary-dark", e.labelClass])
-      }, V(e.label), 11, Qn)) : x("", !0),
+        class: y(["text-sm font-medium text-primary dark:text-primary-dark", e.labelClass])
+      }, M(e.label), 11, fl)) : x("", !0),
       S(n.$slots, "default", {}, void 0, !0)
     ], 2));
   }
-}), Xn = /* @__PURE__ */ ge(Yn, [["__scopeId", "data-v-c0d9d9cb"]]), Jn = /* @__PURE__ */ E({
+}), bl = /* @__PURE__ */ $e(ml, [["__scopeId", "data-v-c0d9d9cb"]]), vl = /* @__PURE__ */ D({
   __name: "ListCard",
   props: {
     clickable: { type: Boolean, default: !1 },
@@ -2202,8 +2277,8 @@ const Gn = E({
     const t = e, a = n, l = () => {
       t.clickable && a("click");
     };
-    return (o, s) => (r(), i("div", {
-      class: h([
+    return (o, s) => (i(), r("div", {
+      class: y([
         "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
@@ -2215,13 +2290,15 @@ const Gn = E({
       S(o.$slots, "default", {}, void 0, !0)
     ], 2));
   }
-}), Zn = /* @__PURE__ */ ge(Jn, [["__scopeId", "data-v-f86d47da"]]), _n = { class: "background rounded-corner flex flex-row items-center gap-2 justify-between w-full h-auto p-4 transition-[background-color] duration-200 hover:bg-ui-surface/80 dark:hover:bg-ui-surface-dark/80" }, el = ["title", "aria-label"], tl = ["src"], al = {
+}), pl = /* @__PURE__ */ $e(vl, [["__scopeId", "data-v-f86d47da"]]), yl = { class: "background rounded-corner flex flex-row items-center gap-2 justify-between w-full h-auto p-4 transition-[background-color] duration-200 hover:bg-ui-surface/80 dark:hover:bg-ui-surface-dark/80" }, gl = ["title", "aria-label"], hl = ["src"], xl = {
   key: 1,
   class: "w-8 h-8 flex items-center justify-center"
-}, nl = ["src"], ll = ["min", "max", "value", "aria-label", "aria-valuetext"], ol = /* @__PURE__ */ E({
+}, wl = ["src"], kl = ["min", "max", "value", "aria-label", "aria-valuetext"], $l = /* @__PURE__ */ D({
   __name: "SliderControl",
   props: {
-    icon: {},
+    name: { default: "" },
+    type: { default: "icon" },
+    icon: { default: "" },
     label: {},
     buttonLabel: {},
     modelValue: {},
@@ -2233,7 +2310,13 @@ const Gn = E({
   },
   emits: ["update:modelValue", "buttonClick"],
   setup(e, { emit: n }) {
-    const t = e, a = n, l = v(() => {
+    const t = e;
+    W(() => {
+      t.icon && !t.name && console.warn(
+        "[SliderControl] «icon» está obsoleto y se va en la próxima mayor: recibe una ruta ya resuelta. Usá «name» con el nombre del icono del tema, y «type» si hace falta el símbolo."
+      );
+    });
+    const a = n, l = v(() => {
       if (t.max <= t.min) return 0;
       const m = t.max - t.min, f = t.modelValue - t.min;
       return Math.round(f / m * 100);
@@ -2243,8 +2326,8 @@ const Gn = E({
     }, u = () => {
       a("buttonClick");
     };
-    return (m, f) => (r(), i("div", _n, [
-      e.showButton ? (r(), i("button", {
+    return (m, f) => (i(), r("div", yl, [
+      e.showButton ? (i(), r("button", {
         key: 0,
         onClick: u,
         type: "button",
@@ -2252,19 +2335,32 @@ const Gn = E({
         "aria-label": e.buttonLabel ?? e.label,
         class: "w-8 h-8 flex items-center justify-center rounded-corner transition-[background-color,scale] duration-200 hover:bg-ui-surface/80 dark:hover:bg-ui-surface-dark/80 hover:scale-110 active:scale-95"
       }, [
-        T("img", {
+        e.name ? (i(), U(N, {
+          key: 0,
+          name: e.name,
+          type: e.type,
+          size: 24,
+          class: y(e.iconClass)
+        }, null, 8, ["name", "type", "class"])) : (i(), r("img", {
+          key: 1,
           src: e.icon,
           alt: "",
-          class: h(["w-6 h-6", e.iconClass])
-        }, null, 10, tl)
-      ], 8, el)) : (r(), i("div", al, [
-        T("img", {
+          class: y(["w-6 h-6", e.iconClass])
+        }, null, 10, hl))
+      ], 8, gl)) : (i(), r("div", xl, [
+        e.name ? (i(), U(N, {
+          key: 0,
+          name: e.name,
+          type: e.type,
+          size: 24
+        }, null, 8, ["name", "type"])) : (i(), r("img", {
+          key: 1,
           src: e.icon,
           alt: "",
           class: "w-6 h-6"
-        }, null, 8, nl)
+        }, null, 8, wl))
       ])),
-      T("input", {
+      B("input", {
         type: "range",
         min: e.min,
         max: e.max,
@@ -2273,13 +2369,13 @@ const Gn = E({
         "aria-label": e.label,
         "aria-valuetext": `${l.value}%`,
         class: "flex-1 transition-[scale] duration-200 hover:scale-105"
-      }, null, 40, ll),
-      T("span", {
-        class: h(["w-12 text-right transition-[color] duration-200 font-medium", o.value])
-      }, V(l.value) + "% ", 3)
+      }, null, 40, kl),
+      B("span", {
+        class: y(["w-12 text-right transition-[color] duration-200 font-medium", o.value])
+      }, M(l.value) + "% ", 3)
     ]));
   }
-}), Be = /* @__PURE__ */ E({
+}), je = /* @__PURE__ */ D({
   __name: "SwitchTrack",
   props: {
     on: { type: Boolean },
@@ -2287,15 +2383,15 @@ const Gn = E({
   },
   setup(e) {
     const n = e, t = v(() => n.size === "small");
-    return (a, l) => (r(), i("span", {
+    return (a, l) => (i(), r("span", {
       "aria-hidden": "true",
-      class: h(["inline-flex shrink-0 items-center rounded-full border transition-colors", [
+      class: y(["inline-flex shrink-0 items-center rounded-full border transition-colors", [
         t.value ? "h-6 w-11" : "h-7 w-12",
         e.on ? "border-transparent bg-primary" : "border-ui-border-strong bg-ui-surface"
       ]])
     }, [
-      T("span", {
-        class: h(["inline-block transform rounded-full shadow transition-transform", [
+      B("span", {
+        class: y(["inline-block transform rounded-full shadow transition-transform", [
           t.value ? "h-4 w-4" : "h-5 w-5",
           e.on ? "bg-tx-on-primary" : "bg-tx-main",
           e.on ? "translate-x-6" : "translate-x-1"
@@ -2303,10 +2399,10 @@ const Gn = E({
       }, null, 2)
     ], 2));
   }
-}), rl = ["aria-checked", "disabled"], il = { class: "min-w-0 flex-1" }, sl = { class: "block font-medium text-sm text-tx-main" }, ul = {
+}), Cl = ["aria-checked", "disabled"], zl = { class: "min-w-0 flex-1" }, El = { class: "block font-medium text-sm text-tx-main" }, Ll = {
   key: 0,
   class: "mt-0.5 block text-tx-muted text-xs"
-}, cl = /* @__PURE__ */ E({
+}, Dl = /* @__PURE__ */ D({
   __name: "SwitchRow",
   props: {
     modelValue: { type: Boolean },
@@ -2319,7 +2415,7 @@ const Gn = E({
   emits: ["update:modelValue"],
   setup(e, { emit: n }) {
     const t = e, a = n;
-    return (l, o) => (r(), i("button", {
+    return (l, o) => (i(), r("button", {
       type: "button",
       role: "switch",
       "aria-checked": e.modelValue,
@@ -2327,30 +2423,30 @@ const Gn = E({
       class: "flex w-full items-start gap-3 rounded-corner p-2 text-left transition-colors hover:bg-ui-surface/60 disabled:cursor-not-allowed disabled:opacity-60 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-primary focus-visible:ring-offset-2",
       onClick: o[0] || (o[0] = (s) => a("update:modelValue", !t.modelValue))
     }, [
-      O(Be, {
+      O(je, {
         on: e.modelValue,
         class: "mt-0.5"
       }, null, 8, ["on"]),
-      e.icon ? (r(), i("span", {
+      e.icon ? (i(), r("span", {
         key: 0,
-        class: h(["flex size-10 shrink-0 items-center justify-center rounded-corner border", e.modelValue ? "border-secondary bg-primary/20" : "border-ui-border bg-ui-surface/40"]),
+        class: y(["flex size-10 shrink-0 items-center justify-center rounded-corner border", e.modelValue ? "border-secondary bg-primary/20" : "border-ui-border bg-ui-surface/40"]),
         "aria-hidden": "true"
       }, [
-        O(H, {
+        O(N, {
           name: e.icon,
           type: e.iconType,
           size: 24,
           alt: ""
         }, null, 8, ["name", "type"])
       ], 2)) : x("", !0),
-      T("span", il, [
-        T("span", sl, V(e.label), 1),
-        e.description ? (r(), i("span", ul, V(e.description), 1)) : x("", !0),
+      B("span", zl, [
+        B("span", El, M(e.label), 1),
+        e.description ? (i(), r("span", Ll, M(e.description), 1)) : x("", !0),
         S(l.$slots, "pie")
       ])
-    ], 8, rl));
+    ], 8, Cl));
   }
-}), dl = ["aria-checked", "aria-label", "disabled"], fl = /* @__PURE__ */ E({
+}), Tl = ["aria-checked", "aria-label", "disabled"], Al = /* @__PURE__ */ D({
   __name: "SwitchToggle",
   props: {
     modelValue: { type: Boolean },
@@ -2364,7 +2460,7 @@ const Gn = E({
     function l() {
       a("update:modelValue", !t.modelValue);
     }
-    return (o, s) => (r(), i("button", {
+    return (o, s) => (i(), r("button", {
       type: "button",
       role: "switch",
       "aria-checked": e.modelValue,
@@ -2373,16 +2469,18 @@ const Gn = E({
       class: "rounded-full transition-opacity disabled:cursor-not-allowed disabled:opacity-50 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-primary focus-visible:ring-offset-2",
       onClick: l
     }, [
-      O(Be, {
+      O(je, {
         on: e.modelValue,
         size: e.size
       }, null, 8, ["on", "size"])
-    ], 8, dl));
+    ], 8, Tl));
   }
-}), ml = ["disabled", "title", "aria-label", "aria-pressed", "aria-busy"], bl = ["src"], vl = /* @__PURE__ */ E({
+}), Bl = ["disabled", "title", "aria-label", "aria-pressed", "aria-busy"], Sl = ["src"], Ml = /* @__PURE__ */ D({
   __name: "ToggleControl",
   props: {
-    icon: {},
+    name: { default: "" },
+    type: { default: "icon" },
+    icon: { default: "" },
     label: {},
     pressed: { type: [Boolean, null], default: null },
     isActive: { type: Boolean, default: !1 },
@@ -2392,13 +2490,19 @@ const Gn = E({
   },
   emits: ["click"],
   setup(e, { emit: n }) {
-    const t = n;
-    function a() {
-      t("click");
+    const t = e;
+    W(() => {
+      t.icon && !t.name && console.warn(
+        "[ToggleControl] «icon» está obsoleto y se va en la próxima mayor: recibe una ruta ya resuelta. Usá «name» con el nombre del icono del tema, y «type» si hace falta el símbolo."
+      );
+    });
+    const a = n;
+    function l() {
+      a("click");
     }
-    return (l, o) => (r(), i("button", {
+    return (o, s) => (i(), r("button", {
       type: "button",
-      class: h(["p-2 rounded-corner bg-ui-bg/80 hover:opacity-50 transition-[opacity,scale,box-shadow] duration-300 h-17.5 w-17.5 group relative overflow-hidden hover:scale-105 hover:shadow-lg active:scale-95 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-primary focus-visible:ring-offset-2", {
+      class: y(["p-2 rounded-corner bg-ui-bg/80 hover:opacity-50 transition-[opacity,scale,box-shadow] duration-300 h-17.5 w-17.5 group relative overflow-hidden hover:scale-105 hover:shadow-lg active:scale-95 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-primary focus-visible:ring-offset-2", {
         "animate-pulse": e.isLoading,
         "ring-2 ring-primary": e.isActive,
         "opacity-60": !e.isActive,
@@ -2409,23 +2513,35 @@ const Gn = E({
       "aria-label": e.label,
       "aria-pressed": e.pressed ?? void 0,
       "aria-busy": e.isLoading || void 0,
-      onClick: a
+      onClick: l
     }, [
-      T("img", {
+      e.name ? (i(), U(N, {
+        key: 0,
+        name: e.name,
+        type: e.type,
+        size: 50,
+        class: y(["m-auto transition-[scale,filter] 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, 8, ["name", "type", "class"])) : (i(), r("img", {
+        key: 1,
         src: e.icon,
         alt: "",
-        class: h(["m-auto w-12.5 h-12.5 transition-[scale,filter] duration-300 group-hover:scale-110 relative z-10", {
+        class: y(["m-auto w-12.5 h-12.5 transition-[scale,filter] 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, bl)
-    ], 10, ml));
+      }, null, 10, Sl))
+    ], 10, Bl));
   }
-}), lt = /* @__PURE__ */ Symbol("tooltip de vasak");
-function ot() {
-  const e = pe(lt, null);
+}), ft = /* @__PURE__ */ Symbol("tooltip de vasak");
+function mt() {
+  const e = we(ft, null);
   if (e) return e;
   const n = w(!1);
   return {
@@ -2441,7 +2557,7 @@ function ot() {
     }
   };
 }
-const pl = { class: "inline-block" }, yl = /* @__PURE__ */ E({
+const Vl = { class: "inline-block" }, Il = /* @__PURE__ */ D({
   __name: "Tooltip",
   props: {
     disabled: { type: Boolean, default: !1 },
@@ -2458,7 +2574,7 @@ const pl = { class: "inline-block" }, yl = /* @__PURE__ */ E({
     function s() {
       l && clearTimeout(l), t.value = !1;
     }
-    return fe(lt, {
+    return ye(ft, {
       abierto: v(() => t.value && !n.disabled),
       disparador: a,
       ponerElDisparador: (u) => {
@@ -2466,11 +2582,11 @@ const pl = { class: "inline-block" }, yl = /* @__PURE__ */ E({
       },
       abrir: o,
       cerrar: s
-    }), (u, m) => (r(), i("div", pl, [
+    }), (u, m) => (i(), r("div", Vl, [
       S(u.$slots, "default")
     ]));
   }
-}), gl = /* @__PURE__ */ E({
+}), Ol = /* @__PURE__ */ D({
   inheritAttrs: !1,
   __name: "TooltipContent",
   props: {
@@ -2479,87 +2595,89 @@ const pl = { class: "inline-block" }, yl = /* @__PURE__ */ E({
     sideOffset: { default: 4 }
   },
   setup(e) {
-    const n = Ce(), t = v(() => n.class ?? ""), a = e, l = ot(), o = v(() => l.abierto.value), s = w(null), u = w({ top: 0, left: 0 });
+    const n = Be(), t = v(() => n.class ?? ""), a = e, l = mt(), o = v(() => l.abierto.value), s = w(null), u = w({ top: 0, left: 0 });
     function m() {
       const f = l.disparador.value;
       if (!f || !s.value) return;
-      const d = f.getBoundingClientRect(), L = s.value.getBoundingClientRect();
-      let D = 0, A = 0;
+      const d = f.getBoundingClientRect(), E = s.value.getBoundingClientRect();
+      let L = 0, A = 0;
       switch (a.side) {
         case "bottom":
-          D = d.bottom + a.sideOffset, A = d.left + d.width / 2 - L.width / 2;
+          L = d.bottom + a.sideOffset, A = d.left + d.width / 2 - E.width / 2;
           break;
         case "top":
-          D = d.top - L.height - a.sideOffset, A = d.left + d.width / 2 - L.width / 2;
+          L = d.top - E.height - a.sideOffset, A = d.left + d.width / 2 - E.width / 2;
           break;
         case "left":
-          A = d.left - L.width - a.sideOffset, D = d.top + d.height / 2 - L.height / 2;
+          A = d.left - E.width - a.sideOffset, L = d.top + d.height / 2 - E.height / 2;
           break;
         case "right":
-          A = d.right + a.sideOffset, D = d.top + d.height / 2 - L.height / 2;
+          A = d.right + a.sideOffset, L = d.top + d.height / 2 - E.height / 2;
           break;
       }
-      u.value = { top: D, left: A };
+      u.value = { top: L, left: A };
     }
-    return W(o, async (f) => {
-      f && (await Y(), requestAnimationFrame(m));
-    }), (f, d) => (r(), Q(me, { to: "body" }, [
-      O(ye, {
+    return Q(o, async (f) => {
+      f && (await J(), requestAnimationFrame(m));
+    }), (f, d) => (i(), U(ge, { to: "body" }, [
+      O(ke, {
         "enter-active-class": "transition-all duration-200 ease-in-out",
         "leave-active-class": "transition-all duration-200 ease-in-out",
         "enter-from-class": "opacity-0 scale-95",
         "leave-to-class": "opacity-0 scale-95"
       }, {
-        default: K(() => [
-          ze(T("div", {
+        default: G(() => [
+          Se(B("div", {
             ref_key: "globo",
             ref: s,
-            style: se({ position: "fixed", top: `${u.value.top}px`, left: `${u.value.left}px`, zIndex: 50 }),
-            class: h([
+            style: fe({ position: "fixed", top: `${u.value.top}px`, left: `${u.value.left}px`, zIndex: 50 }),
+            class: y([
               t.value,
               "pointer-events-none rounded-corner border border-secondary bg-ui-bg/80 px-2 py-1 text-sm shadow-md"
             ])
           }, [
             S(f.$slots, "default")
           ], 6), [
-            [Ne, o.value]
+            [Ye, o.value]
           ])
         ]),
         _: 3
       })
     ]));
   }
-}), hl = /* @__PURE__ */ E({
+}), jl = /* @__PURE__ */ D({
   __name: "TooltipTrigger",
   setup(e) {
-    const n = ot(), t = w(null);
+    const n = mt(), t = w(null);
     function a() {
       return t.value ? t.value.firstElementChild ?? t.value : null;
     }
     function l() {
       n.ponerElDisparador(a()), n.abrir();
     }
-    return X(() => {
+    return W(() => {
       n.ponerElDisparador(a());
-    }), (o, s) => (r(), i("div", {
+    }), (o, s) => (i(), r("div", {
       ref_key: "envoltorio",
       ref: t,
       class: "inline-block",
       onMouseenter: l,
-      onMouseleave: s[0] || (s[0] = (u) => R(n).cerrar()),
+      onMouseleave: s[0] || (s[0] = (u) => F(n).cerrar()),
       onFocus: l,
-      onBlur: s[1] || (s[1] = (u) => R(n).cerrar())
+      onBlur: s[1] || (s[1] = (u) => F(n).cerrar())
     }, [
       S(o.$slots, "default")
     ], 544));
   }
-}), xl = ["title"], wl = ["src", "alt"], kl = {
-  key: 0,
+}), Pl = ["title"], Rl = ["src", "alt"], Fl = {
+  key: 2,
   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"
-}, $l = /* @__PURE__ */ E({
+}, Nl = /* @__PURE__ */ D({
   __name: "TrayIconButton",
   props: {
-    icon: {},
+    name: { default: "" },
+    type: { default: "icon" },
+    icon: { default: "" },
     alt: { default: "" },
     tooltip: { default: "" },
     badge: { default: null },
@@ -2571,152 +2689,166 @@ const pl = { class: "inline-block" }, yl = /* @__PURE__ */ E({
   },
   emits: ["click"],
   setup(e, { emit: n }) {
-    const t = n, a = w(!1), l = () => {
-      t("click");
+    const t = e, a = n, l = w(!1);
+    W(() => {
+      t.icon && !t.name && console.warn(
+        "[TrayIconButton] «icon» está obsoleto y se va en la próxima mayor: recibe una ruta ya resuelta. Usá «name» con el nombre del icono del tema, y «type» si hace falta el símbolo."
+      );
+    });
+    const o = () => {
+      a("click");
     };
-    return (o, s) => (r(), i("div", {
-      class: h(["p-1 rounded-corner relative hover:bg-primary dark:hover:bg-primary-dark group transition-[background-color] duration-300", e.customClass]),
+    return (s, u) => (i(), r("div", {
+      class: y(["p-1 rounded-corner relative hover:bg-primary dark:hover:bg-primary-dark group transition-[background-color] duration-300", e.customClass]),
       title: e.tooltip,
-      onClick: l,
-      onMouseenter: s[0] || (s[0] = (u) => a.value = !0),
-      onMouseleave: s[1] || (s[1] = (u) => a.value = !1)
+      onClick: o,
+      onMouseenter: u[0] || (u[0] = (m) => l.value = !0),
+      onMouseleave: u[1] || (u[1] = (m) => l.value = !1)
     }, [
-      T("img", {
-        src: e.icon,
+      e.name ? (i(), U(N, {
+        key: 0,
+        name: e.name,
+        type: e.type,
+        size: 22,
         alt: e.alt,
-        class: h(["m-auto h-5.5 w-auto", e.iconClass])
-      }, null, 10, wl),
-      e.badge !== null && e.badge > 0 ? (r(), i("div", kl, V(e.badge), 1)) : x("", !0),
-      e.showCustomTooltip && e.customTooltipText ? (r(), i("div", {
+        class: y(["m-auto", e.iconClass])
+      }, null, 8, ["name", "type", "alt", "class"])) : (i(), r("img", {
         key: 1,
-        class: h(["absolute top-1 left-1/2 transform -translate-x-1/2 text-xs font-semibold p-1 rounded-corner transition-[opacity,translate] duration-300 pointer-events-none background", [
+        src: e.icon,
+        alt: e.alt,
+        class: y(["m-auto h-5.5 w-auto", e.iconClass])
+      }, null, 10, Rl)),
+      e.badge !== null && e.badge > 0 ? (i(), r("div", Fl, M(e.badge), 1)) : x("", !0),
+      e.showCustomTooltip && e.customTooltipText ? (i(), r("div", {
+        key: 3,
+        class: y(["absolute top-1 left-1/2 transform -translate-x-1/2 text-xs font-semibold p-1 rounded-corner transition-[opacity,translate] duration-300 pointer-events-none background", [
           e.tooltipClass,
           {
-            "opacity-0 -translate-y-2": !a.value,
-            "opacity-100 translate-y-0": a.value
+            "opacity-0 -translate-y-2": !l.value,
+            "opacity-100 translate-y-0": l.value
           }
         ]])
-      }, V(e.customTooltipText), 3)) : x("", !0),
-      S(o.$slots, "default")
-    ], 42, xl));
+      }, M(e.customTooltipText), 3)) : x("", !0),
+      S(s.$slots, "default")
+    ], 42, Pl));
   }
-}), Cl = [
-  Kt,
-  Ke,
-  Ue,
-  Xt,
-  H,
+}), ql = [
   ua,
-  Qe,
-  Ge,
-  wa,
-  Ye,
+  _e,
+  Ze,
+  ba,
+  N,
   La,
-  Va,
-  Pa,
-  qa,
-  Ha,
-  Qa,
-  Te,
-  un,
-  Xe,
-  Ka,
-  fn,
-  wn,
-  $n,
-  Dn,
-  Tn,
+  at,
+  tt,
+  Ra,
+  nt,
+  Ua,
+  Ja,
+  an,
+  on,
+  sn,
+  mn,
+  Oe,
+  Ln,
+  lt,
+  cn,
   An,
-  Vn,
-  In,
-  jn,
   Rn,
   Nn,
-  Hn,
   Kn,
   Gn,
-  Xn,
-  Zn,
-  ol,
-  cl,
-  fl,
-  Be,
-  vl,
-  yl,
-  gl,
-  hl,
-  $l
-], Sl = {
+  Yn,
+  Jn,
+  _n,
+  tl,
+  ll,
+  il,
+  rl,
+  ul,
+  dl,
+  bl,
+  pl,
+  $l,
+  Dl,
+  Al,
+  je,
+  Ml,
+  Il,
+  Ol,
+  jl,
+  Nl
+], Xl = {
   install(e) {
-    Cl.forEach((n) => {
+    ql.forEach((n) => {
       e.component(n.name, n);
     });
   }
 };
 export {
-  Va as ActionButton,
-  Pa as AlertMessage,
-  Qe as AppBar,
-  La as BarSearch,
-  Je as CLASES_POR_TONO,
-  _e as CLAVE_DEL_DIALOGO,
-  tt as CLAVE_DEL_MENU,
-  lt as CLAVE_DEL_TOOLTIP,
-  De as CLAVE_DE_LA_BARRA,
-  fn as ConfigSection,
-  wn as DeviceCard,
-  $n as Dialog,
-  Dn as DialogContent,
-  Tn as DialogDescription,
-  An as DialogFooter,
-  Vn as DialogHeader,
-  In as DialogTitle,
-  jn as DropdownMenu,
-  Rn as DropdownMenuContent,
-  Nn as DropdownMenuItem,
-  Hn as DropdownMenuLabel,
-  Kn as DropdownMenuSeparator,
-  Gn as DropdownMenuTrigger,
-  qa as EmptyState,
-  Xn as FormGroup,
-  Ee as LOS_TRES_CONTROLES,
-  Zn as ListCard,
-  Ha as LoadingState,
-  Jt as POSICIONES,
-  Qa as ProgressBar,
-  Te as SearchField,
-  un as SearchSelect,
-  Xt as SelectField,
-  Kt as SideBar,
-  Ke as SideButton,
-  Ue as SideGroup,
-  ol as SliderControl,
-  cl as SwitchRow,
-  fl as SwitchToggle,
-  Be as SwitchTrack,
-  wa as TabBar,
-  Ye as TabItem,
-  Xe as TextInput,
-  H as ThemeIcon,
-  Ka as ToastArea,
-  vl as ToggleControl,
-  yl as Tooltip,
-  gl as TooltipContent,
-  hl as TooltipTrigger,
-  $l as TrayIconButton,
-  Ge as WindowControls,
-  ua as WindowFrame,
-  Xa as buscarOpciones,
-  Sl as default,
-  Zt as esPosicion,
-  Bl as olvidarLosIconosDelTema,
-  $e as orientacionDe,
-  ta as posicionDe,
-  Ze as rolDelTono,
-  et as usarElDialogo,
-  he as usarElMenu,
-  ot as usarElTooltip,
-  be as usarLaBarra,
-  aa as usarLaPosicionDeLaBarra,
-  Al as usarLaVersionDelTema
+  Ja as ActionButton,
+  an as AlertMessage,
+  at as AppBar,
+  Ua as BarSearch,
+  ot as CLASES_POR_TONO,
+  rt as CLAVE_DEL_DIALOGO,
+  ut as CLAVE_DEL_MENU,
+  ft as CLAVE_DEL_TOOLTIP,
+  Ve as CLAVE_DE_LA_BARRA,
+  An as ConfigSection,
+  Rn as DeviceCard,
+  Nn as Dialog,
+  Kn as DialogContent,
+  Gn as DialogDescription,
+  Yn as DialogFooter,
+  Jn as DialogHeader,
+  _n as DialogTitle,
+  tl as DropdownMenu,
+  ll as DropdownMenuContent,
+  il as DropdownMenuItem,
+  rl as DropdownMenuLabel,
+  ul as DropdownMenuSeparator,
+  dl as DropdownMenuTrigger,
+  on as EmptyState,
+  bl as FormGroup,
+  Ie as LOS_TRES_CONTROLES,
+  pl as ListCard,
+  sn as LoadingState,
+  va as POSICIONES,
+  mn as ProgressBar,
+  Oe as SearchField,
+  Ln as SearchSelect,
+  ba as SelectField,
+  ua as SideBar,
+  _e as SideButton,
+  Ze as SideGroup,
+  $l as SliderControl,
+  Dl as SwitchRow,
+  Al as SwitchToggle,
+  je as SwitchTrack,
+  Ra as TabBar,
+  nt as TabItem,
+  lt as TextInput,
+  N as ThemeIcon,
+  cn as ToastArea,
+  Ml as ToggleControl,
+  Il as Tooltip,
+  Ol as TooltipContent,
+  jl as TooltipTrigger,
+  Nl as TrayIconButton,
+  tt as WindowControls,
+  La as WindowFrame,
+  vn as buscarOpciones,
+  Xl as default,
+  pa as esPosicion,
+  Ql as olvidarLosIconosDelTema,
+  Ae as orientacionDe,
+  ha as posicionDe,
+  it as rolDelTono,
+  st as usarElDialogo,
+  Ce as usarElMenu,
+  mt as usarElTooltip,
+  he as usarLaBarra,
+  xa as usarLaPosicionDeLaBarra,
+  Yl as usarLaVersionDelTema
 };