@vasakgroup/vue-libvasak 0.2.0 → 0.2.2

package/dist/vue-libvasak.es.js

@@ -1,19 +1,19 @@
-import { createElementBlock as s, openBlock as o, renderSlot as k, defineComponent as y, createElementVNode as u, ref as x, onMounted as q, toDisplayString as w, unref as W, Fragment as F, createVNode as Z, normalizeClass as d, createCommentVNode as g, renderList as Q, withModifiers as Y, computed as T } from "vue";
+import { createElementBlock as s, openBlock as r, renderSlot as k, defineComponent as m, createElementVNode as u, ref as x, onMounted as q, toDisplayString as g, unref as W, Fragment as F, createVNode as Z, normalizeClass as d, createCommentVNode as w, renderList as Q, withModifiers as Y, computed as T } from "vue";
 const D = (t, e) => {
   const i = t.__vccOpts || t;
-  for (const [l, a] of e)
-    i[l] = a;
+  for (const [a, l] of e)
+    i[a] = l;
   return i;
 }, K = {}, X = { class: "sidebar" };
 function ee(t, e) {
-  return o(), s("div", X, [
+  return r(), s("div", X, [
     k(t.$slots, "default")
   ]);
 }
 const te = /* @__PURE__ */ D(K, [["render", ee]]), ie = {
   href: "#",
   class: "sidebar-button"
-}, ne = ["src", "alt"], le = /* @__PURE__ */ y({
+}, ne = ["src", "alt"], ae = /* @__PURE__ */ m({
   __name: "SideButton",
   props: {
     title: {
@@ -26,7 +26,7 @@ const te = /* @__PURE__ */ D(K, [["render", ee]]), ie = {
     }
   },
   setup(t) {
-    return (e, i) => (o(), s("a", ie, [
+    return (e, i) => (r(), s("a", ie, [
       u("img", {
         src: t.image,
         alt: t.title,
@@ -35,25 +35,25 @@ const te = /* @__PURE__ */ D(K, [["render", ee]]), ie = {
     ]));
   }
 });
-function ae(t, e, i, l) {
-  if (typeof e == "function" ? t !== e || !l : !e.has(t)) throw new TypeError("Cannot read private member from an object whose class did not declare it");
-  return i === "m" ? l : i === "a" ? l.call(t) : l ? l.value : e.get(t);
+function le(t, e, i, a) {
+  if (typeof e == "function" ? t !== e || !a : !e.has(t)) throw new TypeError("Cannot read private member from an object whose class did not declare it");
+  return i === "m" ? a : i === "a" ? a.call(t) : a ? a.value : e.get(t);
 }
-function se(t, e, i, l, a) {
+function se(t, e, i, a, l) {
   if (typeof e == "function" ? t !== e || !0 : !e.has(t)) throw new TypeError("Cannot write private member to an object whose class did not declare it");
   return e.set(t, i), i;
 }
 var I;
-const m = "__TAURI_TO_IPC_KEY__";
-function oe(t, e = !1) {
+const y = "__TAURI_TO_IPC_KEY__";
+function re(t, e = !1) {
   return window.__TAURI_INTERNALS__.transformCallback(t, e);
 }
 async function n(t, e = {}, i) {
   return window.__TAURI_INTERNALS__.invoke(t, e, i);
 }
-class re {
+class oe {
   get rid() {
-    return ae(this, I, "f");
+    return le(this, I, "f");
   }
   constructor(e) {
     I.set(this, void 0), se(this, I, e);
@@ -91,14 +91,14 @@ class V {
   toPhysical(e) {
     return new C(this.width * e, this.height * e);
   }
-  [m]() {
+  [y]() {
     return {
       width: this.width,
       height: this.height
     };
   }
   toJSON() {
-    return this[m]();
+    return this[y]();
   }
 }
 class C {
@@ -119,14 +119,14 @@ class C {
   toLogical(e) {
     return new V(this.width / e, this.height / e);
   }
-  [m]() {
+  [y]() {
     return {
       width: this.width,
       height: this.height
     };
   }
   toJSON() {
-    return this[m]();
+    return this[y]();
   }
 }
 class _ {
@@ -139,7 +139,7 @@ class _ {
   toPhysical(e) {
     return this.size instanceof C ? this.size : this.size.toPhysical(e);
   }
-  [m]() {
+  [y]() {
     return {
       [`${this.size.type}`]: {
         width: this.size.width,
@@ -148,7 +148,7 @@ class _ {
     };
   }
   toJSON() {
-    return this[m]();
+    return this[y]();
   }
 }
 class U {
@@ -171,19 +171,19 @@ class U {
    * @since 2.0.0
    */
   toPhysical(e) {
-    return new p(this.x * e, this.y * e);
+    return new f(this.x * e, this.y * e);
   }
-  [m]() {
+  [y]() {
     return {
       x: this.x,
       y: this.y
     };
   }
   toJSON() {
-    return this[m]();
+    return this[y]();
   }
 }
-class p {
+class f {
   constructor(...e) {
     this.type = "Physical", e.length === 1 ? "Physical" in e[0] ? (this.x = e[0].Physical.x, this.y = e[0].Physical.y) : (this.x = e[0].x, this.y = e[0].y) : (this.x = e[0], this.y = e[1]);
   }
@@ -205,14 +205,14 @@ class p {
   toLogical(e) {
     return new U(this.x / e, this.y / e);
   }
-  [m]() {
+  [y]() {
     return {
       x: this.x,
       y: this.y
     };
   }
   toJSON() {
-    return this[m]();
+    return this[y]();
   }
 }
 class z {
@@ -223,9 +223,9 @@ class z {
     return this.position instanceof U ? this.position : this.position.toLogical(e);
   }
   toPhysical(e) {
-    return this.position instanceof p ? this.position : this.position.toPhysical(e);
+    return this.position instanceof f ? this.position : this.position.toPhysical(e);
   }
-  [m]() {
+  [y]() {
     return {
       [`${this.position.type}`]: {
         x: this.position.x,
@@ -234,7 +234,7 @@ class z {
     };
   }
   toJSON() {
-    return this[m]();
+    return this[y]();
   }
 }
 var b;
@@ -248,17 +248,17 @@ async function G(t, e) {
   });
 }
 async function H(t, e, i) {
-  var l;
-  const a = typeof i?.target == "string" ? { kind: "AnyLabel", label: i.target } : (l = i?.target) !== null && l !== void 0 ? l : { kind: "Any" };
+  var a;
+  const l = typeof i?.target == "string" ? { kind: "AnyLabel", label: i.target } : (a = i?.target) !== null && a !== void 0 ? a : { kind: "Any" };
   return n("plugin:event|listen", {
     event: t,
-    target: a,
-    handler: oe(e)
+    target: l,
+    handler: re(e)
   }).then((c) => async () => G(t, c));
 }
 async function ue(t, e, i) {
-  return H(t, (l) => {
-    G(t, l.id), e(l);
+  return H(t, (a) => {
+    G(t, a.id), e(a);
   }, i);
 }
 async function ce(t, e) {
@@ -274,7 +274,7 @@ async function de(t, e, i) {
     payload: i
   });
 }
-class S extends re {
+class S extends oe {
   /**
    * Creates an Image from a resource ID. For internal use only.
    *
@@ -284,12 +284,12 @@ class S extends re {
     super(e);
   }
   /** Creates a new Image using RGBA data, in row-major order from top to bottom, and with specified width and height. */
-  static async new(e, i, l) {
+  static async new(e, i, a) {
     return n("plugin:image|new", {
       rgba: A(e),
       width: i,
-      height: l
-    }).then((a) => new S(a));
+      height: a
+    }).then((l) => new S(l));
   }
   /**
    * Creates a new image using the provided bytes by inferring the file format.
@@ -389,14 +389,14 @@ class J {
    * @returns The {@link Window} instance to communicate with the window.
    */
   constructor(e, i = {}) {
-    var l;
+    var a;
     this.label = e, this.listeners = /* @__PURE__ */ Object.create(null), i?.skip || n("plugin:window|create", {
       options: {
         ...i,
-        parent: typeof i.parent == "string" ? i.parent : (l = i.parent) === null || l === void 0 ? void 0 : l.label,
+        parent: typeof i.parent == "string" ? i.parent : (a = i.parent) === null || a === void 0 ? void 0 : a.label,
         label: e
       }
-    }).then(async () => this.emit("tauri://created")).catch(async (a) => this.emit("tauri://error", a));
+    }).then(async () => this.emit("tauri://created")).catch(async (l) => this.emit("tauri://error", l));
   }
   /**
    * Gets the Window associated with the given label.
@@ -411,7 +411,7 @@ class J {
    */
   static async getByLabel(e) {
     var i;
-    return (i = (await $()).find((l) => l.label === e)) !== null && i !== void 0 ? i : null;
+    return (i = (await $()).find((a) => a.label === e)) !== null && i !== void 0 ? i : null;
   }
   /**
    * Get an instance of `Window` for the current window.
@@ -462,8 +462,8 @@ class J {
    */
   async listen(e, i) {
     return this._handleTauriEvent(e, i) ? () => {
-      const l = this.listeners[e];
-      l.splice(l.indexOf(i), 1);
+      const a = this.listeners[e];
+      a.splice(a.indexOf(i), 1);
     } : H(e, i, {
       target: { kind: "Window", label: this.label }
     });
@@ -489,8 +489,8 @@ class J {
    */
   async once(e, i) {
     return this._handleTauriEvent(e, i) ? () => {
-      const l = this.listeners[e];
-      l.splice(l.indexOf(i), 1);
+      const a = this.listeners[e];
+      a.splice(a.indexOf(i), 1);
     } : ue(e, i, {
       target: { kind: "Window", label: this.label }
     });
@@ -508,8 +508,8 @@ class J {
    */
   async emit(e, i) {
     if (O.includes(e)) {
-      for (const l of this.listeners[e] || [])
-        l({
+      for (const a of this.listeners[e] || [])
+        a({
           event: e,
           id: -1,
           payload: i
@@ -530,17 +530,17 @@ class J {
    * @param event Event name. Must include only alphanumeric characters, `-`, `/`, `:` and `_`.
    * @param payload Event payload.
    */
-  async emitTo(e, i, l) {
+  async emitTo(e, i, a) {
     if (O.includes(i)) {
-      for (const a of this.listeners[i] || [])
-        a({
+      for (const l of this.listeners[i] || [])
+        l({
           event: i,
           id: -1,
-          payload: l
+          payload: a
         });
       return;
     }
-    return de(e, i, l);
+    return de(e, i, a);
   }
   /** @ignore */
   _handleTauriEvent(e, i) {
@@ -575,7 +575,7 @@ class J {
   async innerPosition() {
     return n("plugin:window|inner_position", {
       label: this.label
-    }).then((e) => new p(e));
+    }).then((e) => new f(e));
   }
   /**
    * The position of the top-left hand corner of the window relative to the top-left hand corner of the desktop.
@@ -590,7 +590,7 @@ class J {
   async outerPosition() {
     return n("plugin:window|outer_position", {
       label: this.label
-    }).then((e) => new p(e));
+    }).then((e) => new f(e));
   }
   /**
    * The physical size of the window's client area.
@@ -1322,8 +1322,8 @@ class J {
    * @returns A promise indicating the success or failure of the operation.
    */
   async setSizeConstraints(e) {
-    function i(l) {
-      return l ? { Logical: l } : null;
+    function i(a) {
+      return a ? { Logical: a } : null;
     }
     return n("plugin:window|set_size_constraints", {
       label: this.label,
@@ -1790,7 +1790,7 @@ class J {
    */
   async onMoved(e) {
     return this.listen(b.WINDOW_MOVED, (i) => {
-      i.payload = new p(i.payload), e(i);
+      i.payload = new f(i.payload), e(i);
     });
   }
   /**
@@ -1817,8 +1817,8 @@ class J {
    */
   async onCloseRequested(e) {
     return this.listen(b.WINDOW_CLOSE_REQUESTED, async (i) => {
-      const l = new he(i);
-      await e(l), l.isPreventDefault() || await this.destroy();
+      const a = new he(i);
+      await e(a), a.isPreventDefault() || await this.destroy();
     });
   }
   /**
@@ -1847,37 +1847,37 @@ class J {
    * Note that removing the listener is required if your listener goes out of scope e.g. the component is unmounted.
    */
   async onDragDropEvent(e) {
-    const i = await this.listen(b.DRAG_ENTER, (r) => {
+    const i = await this.listen(b.DRAG_ENTER, (o) => {
       e({
-        ...r,
+        ...o,
         payload: {
           type: "enter",
-          paths: r.payload.paths,
-          position: new p(r.payload.position)
+          paths: o.payload.paths,
+          position: new f(o.payload.position)
         }
       });
-    }), l = await this.listen(b.DRAG_OVER, (r) => {
+    }), a = await this.listen(b.DRAG_OVER, (o) => {
       e({
-        ...r,
+        ...o,
         payload: {
           type: "over",
-          position: new p(r.payload.position)
+          position: new f(o.payload.position)
         }
       });
-    }), a = await this.listen(b.DRAG_DROP, (r) => {
+    }), l = await this.listen(b.DRAG_DROP, (o) => {
       e({
-        ...r,
+        ...o,
         payload: {
           type: "drop",
-          paths: r.payload.paths,
-          position: new p(r.payload.position)
+          paths: o.payload.paths,
+          position: new f(o.payload.position)
         }
       });
-    }), c = await this.listen(b.DRAG_LEAVE, (r) => {
-      e({ ...r, payload: { type: "leave" } });
+    }), c = await this.listen(b.DRAG_LEAVE, (o) => {
+      e({ ...o, payload: { type: "leave" } });
     });
     return () => {
-      i(), a(), l(), c();
+      i(), l(), a(), c();
     };
   }
   /**
@@ -1898,13 +1898,13 @@ class J {
    * Note that removing the listener is required if your listener goes out of scope e.g. the component is unmounted.
    */
   async onFocusChanged(e) {
-    const i = await this.listen(b.WINDOW_FOCUS, (a) => {
-      e({ ...a, payload: !0 });
-    }), l = await this.listen(b.WINDOW_BLUR, (a) => {
-      e({ ...a, payload: !1 });
+    const i = await this.listen(b.WINDOW_FOCUS, (l) => {
+      e({ ...l, payload: !0 });
+    }), a = await this.listen(b.WINDOW_BLUR, (l) => {
+      e({ ...l, payload: !1 });
     });
     return () => {
-      i(), l();
+      i(), a();
     };
   }
   /**
@@ -1971,7 +1971,7 @@ var M;
 async function be(t, e = {}, i) {
   return window.__TAURI_INTERNALS__.invoke(t, e, i);
 }
-async function we(t) {
+async function ge(t) {
   try {
     return await be("plugin:vicons|get_icon", { name: t });
   } catch (e) {
@@ -1979,11 +1979,11 @@ async function we(t) {
   }
   return "";
 }
-function ge(t) {
+function we(t) {
   try {
     const e = atob(t.substring(0, 32)), i = new Uint8Array(e.length);
-    for (let l = 0; l < e.length; l++)
-      i[l] = e.charCodeAt(l);
+    for (let a = 0; a < e.length; a++)
+      i[a] = e.charCodeAt(a);
     return i[0] === 137 && i[1] === 80 && i[2] === 78 && i[3] === 71 ? "image/png" : "image/svg+xml";
   } catch (e) {
     return console.error("Error identificando tipo de imagen:", e), "image/png";
@@ -1991,43 +1991,44 @@ function ge(t) {
 }
 async function L(t) {
   try {
-    const e = await we(t);
-    return `data:${ge(e)};base64,${e}`;
+    const e = await ge(t);
+    return `data:${we(e)};base64,${e}`;
   } catch (e) {
     return console.error("[Icon Error] Error obteniendo icono:", e), "";
   }
 }
-const me = { "data-tauri-drag-region": "" }, ye = ["src"], fe = { "data-tauri-drag-region": "" }, pe = { "data-tauri-drag-region": "" }, ve = ["src"], _e = ["src"], ke = ["src"], xe = /* @__PURE__ */ y({
+const ye = { "data-tauri-drag-region": "" }, me = ["src", "alt"], pe = { "data-tauri-drag-region": "" }, fe = { "data-tauri-drag-region": "" }, ve = ["src"], _e = ["src"], ke = ["src"], xe = /* @__PURE__ */ m({
   __name: "TopBar",
   props: {
     title: String,
     image: String
   },
   setup(t) {
-    const e = x(null), i = j(), l = x(""), a = x(""), c = x(""), r = t;
+    const e = x(null), i = j(), a = x(""), l = x(""), c = x(""), o = t;
     return q(async () => {
-      l.value = await L("window-close"), a.value = await L("window-minimize"), c.value = await L("window-maximize");
-    }), (f, h) => (o(), s("div", {
+      a.value = await L("window-close"), l.value = await L("window-minimize"), c.value = await L("window-maximize");
+    }), (p, h) => (r(), s("div", {
       "data-tauri-drag-region": "",
-      class: "flex h-8 px-4 py-1 bg-vsk-primary rounded-t-window justify-between align-center",
+      class: "flex h-8 px-4 py-1 bg-primary dark:bg-primary-dark rounded-t-corner-window justify-between align-center",
       ref_key: "bar",
       ref: e
     }, [
-      u("div", me, [
+      u("div", ye, [
         u("img", {
-          src: r.image,
+          src: o.image,
           "data-tauri-drag-region": "",
-          class: "h-6 w-auto"
-        }, null, 8, ye)
+          class: "h-6 w-auto",
+          alt: o.title
+        }, null, 8, me)
       ]),
-      u("div", fe, w(r.title), 1),
-      u("div", pe, [
+      u("div", pe, g(o.title), 1),
+      u("div", fe, [
         u("span", {
           class: "win-button",
           onClick: h[0] || (h[0] = (v) => W(i).minimize())
         }, [
           u("img", {
-            src: a.value,
+            src: l.value,
             class: "h-6 w-6 inline-block",
             alt: "Minimize"
           }, null, 8, ve)
@@ -2047,7 +2048,7 @@ const me = { "data-tauri-drag-region": "" }, ye = ["src"], fe = { "data-tauri-dr
           onClick: h[2] || (h[2] = (v) => W(i).close())
         }, [
           u("img", {
-            src: l.value,
+            src: a.value,
             class: "h-6 w-6 inline-block",
             alt: "Close"
           }, null, 8, ke)
@@ -2055,7 +2056,7 @@ const me = { "data-tauri-drag-region": "" }, ye = ["src"], fe = { "data-tauri-dr
       ])
     ], 512));
   }
-}), Ce = /* @__PURE__ */ y({
+}), Ce = /* @__PURE__ */ m({
   __name: "WindowFrame",
   props: {
     title: {
@@ -2069,7 +2070,7 @@ const me = { "data-tauri-drag-region": "" }, ye = ["src"], fe = { "data-tauri-dr
   },
   setup(t) {
     const e = t;
-    return (i, l) => (o(), s(F, null, [
+    return (i, a) => (r(), s(F, null, [
       Z(xe, {
         title: e.title,
         image: e.image
@@ -2080,7 +2081,7 @@ const me = { "data-tauri-drag-region": "" }, ye = ["src"], fe = { "data-tauri-dr
 }), Se = ["type", "disabled"], De = {
   key: 0,
   class: "w-4 h-4 animate-spin rounded-full border-2 border-current border-t-transparent"
-}, ze = ["src", "alt"], Ie = { key: 2 }, Ae = ["src", "alt"], We = /* @__PURE__ */ y({
+}, ze = ["src", "alt"], Ie = { key: 2 }, Ae = ["src", "alt"], We = /* @__PURE__ */ m({
   __name: "ActionButton",
   props: {
     label: {},
@@ -2099,22 +2100,22 @@ const me = { "data-tauri-drag-region": "" }, ye = ["src"], fe = { "data-tauri-dr
   },
   emits: ["click"],
   setup(t, { emit: e }) {
-    const i = t, l = e, a = {
-      primary: "bg-vsk-primary text-white hover:bg-vsk-primary/90",
-      secondary: "bg-vsk-border text-vsk-text hover:bg-vsk-border/80",
-      danger: "bg-red-600 text-white hover:bg-red-700"
+    const i = t, a = e, l = {
+      primary: "bg-primary dark:bg-primary-dark text-tx-on-primary dark:text-tx-on-primary-dark hover:bg-primary/90 dark:hover:bg-primary-dark/90",
+      secondary: "bg-secondary dark:bg-secondary-dark text-tx-on-primary dark:text-tx-on-primary-dark hover:bg-secondary/80 dark:hover:bg-secondary-dark/80",
+      danger: "bg-status-error dark:bg-status-error-dark text-tx-on-primary dark:text-tx-on-primary-dark hover:bg-status-error/90 dark:hover:bg-status-error-dark/90"
     }, c = {
       sm: "px-2 py-1 text-xs",
       md: "px-3 py-1 text-sm",
       lg: "px-4 py-2 text-base"
-    }, r = (f) => {
-      i.stopPropagation && f.stopPropagation(), i.preventDefault && f.preventDefault(), !i.disabled && !i.loading && l("click");
+    }, o = (p) => {
+      i.stopPropagation && p.stopPropagation(), i.preventDefault && p.preventDefault(), !i.disabled && !i.loading && a("click");
     };
-    return (f, h) => (o(), s("button", {
+    return (p, h) => (r(), s("button", {
       type: i.type,
-      onClick: r,
-      class: d(["rounded-vsk transition-all duration-200 disabled:opacity-50 disabled:cursor-not-allowed flex items-center justify-center gap-2", [
-        a[i.variant],
+      onClick: o,
+      class: d(["rounded-corner transition-all duration-200 disabled:opacity-50 disabled:cursor-not-allowed flex items-center justify-center gap-2", [
+        l[i.variant],
         c[i.size],
         i.fullWidth ? "w-full" : "",
         i.iconSrc && !i.label ? "px-2 py-2" : "",
@@ -2122,23 +2123,23 @@ const me = { "data-tauri-drag-region": "" }, ye = ["src"], fe = { "data-tauri-dr
       ]]),
       disabled: i.disabled || i.loading
     }, [
-      t.loading ? (o(), s("span", De)) : g("", !0),
-      i.iconSrc && !i.iconRight ? (o(), s("img", {
+      t.loading ? (r(), s("span", De)) : w("", !0),
+      i.iconSrc && !i.iconRight ? (r(), s("img", {
         key: 1,
         src: i.iconSrc,
         alt: i.iconAlt || i.label,
         class: "w-4 h-4"
-      }, null, 8, ze)) : g("", !0),
-      i.label ? (o(), s("span", Ie, w(i.label), 1)) : g("", !0),
-      i.iconSrc && i.iconRight ? (o(), s("img", {
+      }, null, 8, ze)) : w("", !0),
+      i.label ? (r(), s("span", Ie, g(i.label), 1)) : w("", !0),
+      i.iconSrc && i.iconRight ? (r(), s("img", {
         key: 3,
         src: i.iconSrc,
         alt: i.iconAlt || i.label,
         class: "w-4 h-4"
-      }, null, 8, Ae)) : g("", !0)
+      }, null, 8, Ae)) : w("", !0)
     ], 10, Se));
   }
-}), $e = /* @__PURE__ */ D(We, [["__scopeId", "data-v-d1ce8923"]]), Oe = { class: "text-base font-semibold m-0 text-vsk-primary" }, Le = /* @__PURE__ */ y({
+}), $e = /* @__PURE__ */ D(We, [["__scopeId", "data-v-2eaf6e27"]]), Oe = { class: "text-base font-semibold m-0 text-primary dark:text-primary-dark" }, Le = /* @__PURE__ */ m({
   __name: "ConfigSection",
   props: {
     title: {},
@@ -2146,14 +2147,14 @@ const me = { "data-tauri-drag-region": "" }, ye = ["src"], fe = { "data-tauri-dr
     customClass: { default: () => ({}) }
   },
   setup(t) {
-    return (e, i) => (o(), s("div", {
-      class: d(["flex flex-col gap-4 p-4 background rounded-vsk", t.customClass])
+    return (e, i) => (r(), s("div", {
+      class: d(["flex flex-col gap-4 p-4 background rounded-corner", t.customClass])
     }, [
-      u("h3", Oe, w(t.icon ? `${t.icon} ${t.title}` : t.title), 1),
+      u("h3", Oe, g(t.icon ? `${t.icon} ${t.title}` : t.title), 1),
       k(e.$slots, "default", {}, void 0, !0)
     ], 2));
   }
-}), Be = /* @__PURE__ */ D(Le, [["__scopeId", "data-v-89531d08"]]), Te = { class: "flex items-center gap-3 flex-1 min-w-0" }, Re = ["src", "alt"], Ne = { class: "min-w-0" }, Ee = { class: "font-semibold truncate" }, Pe = {
+}), Be = /* @__PURE__ */ D(Le, [["__scopeId", "data-v-45bd4eab"]]), Te = { class: "flex items-center gap-3 flex-1 min-w-0" }, Re = ["src", "alt"], Ne = { class: "min-w-0" }, Ee = { class: "font-semibold truncate" }, Pe = {
   key: 0,
   class: "text-xs text-gray-400 truncate"
 }, Me = {
@@ -2165,7 +2166,7 @@ const me = { "data-tauri-drag-region": "" }, ye = ["src"], fe = { "data-tauri-dr
 }, Ve = {
   key: 1,
   class: "w-2 h-2 rounded-full bg-green-500"
-}, Ue = /* @__PURE__ */ y({
+}, Ue = /* @__PURE__ */ m({
   __name: "DeviceCard",
   props: {
     icon: {},
@@ -2182,14 +2183,14 @@ const me = { "data-tauri-drag-region": "" }, ye = ["src"], fe = { "data-tauri-dr
   },
   emits: ["action", "click"],
   setup(t, { emit: e }) {
-    const i = e, l = () => {
+    const i = e, a = () => {
       i("action");
-    }, a = () => {
+    }, l = () => {
       i("click");
     };
-    return (c, r) => (o(), s("div", {
+    return (c, o) => (r(), s("div", {
       class: d(["flex items-center justify-between background rounded-vsk px-6 py-3 mb-4", [{ "border-l-4 border-green-500": t.isConnected }, t.customClass]]),
-      onClick: a
+      onClick: l
     }, [
       u("div", Te, [
         u("img", {
@@ -2198,23 +2199,23 @@ const me = { "data-tauri-drag-region": "" }, ye = ["src"], fe = { "data-tauri-dr
           class: "h-7 w-7 shrink-0"
         }, null, 8, Re),
         u("div", Ne, [
-          u("div", Ee, w(t.title), 1),
-          t.subtitle ? (o(), s("div", Pe, w(t.subtitle), 1)) : g("", !0),
-          t.metadata ? (o(), s("div", Me, w(t.metadata), 1)) : g("", !0),
-          t.extraInfo && t.extraInfo.length > 0 ? (o(), s("div", Fe, [
-            (o(!0), s(F, null, Q(t.extraInfo, (f, h) => (o(), s("span", { key: h }, w(f), 1))), 128))
-          ])) : g("", !0)
+          u("div", Ee, g(t.title), 1),
+          t.subtitle ? (r(), s("div", Pe, g(t.subtitle), 1)) : w("", !0),
+          t.metadata ? (r(), s("div", Me, g(t.metadata), 1)) : w("", !0),
+          t.extraInfo && t.extraInfo.length > 0 ? (r(), s("div", Fe, [
+            (r(!0), s(F, null, Q(t.extraInfo, (p, h) => (r(), s("span", { key: h }, g(p), 1))), 128))
+          ])) : w("", !0)
         ])
       ]),
-      t.showActionButton ? (o(), s("button", {
+      t.showActionButton ? (r(), s("button", {
         key: 0,
         class: "bg-vsk-primary rounded-vsk px-4 py-2 text-sm font-semibold cursor-pointer hover:opacity-70",
-        onClick: Y(l, ["stop"])
-      }, w(t.actionLabel), 1)) : g("", !0),
-      t.showStatusIndicator && t.isConnected ? (o(), s("div", Ve)) : g("", !0)
+        onClick: Y(a, ["stop"])
+      }, g(t.actionLabel), 1)) : w("", !0),
+      t.showStatusIndicator && t.isConnected ? (r(), s("div", Ve)) : w("", !0)
     ], 2));
   }
-}), Ge = ["for"], He = /* @__PURE__ */ y({
+}), Ge = ["for"], He = /* @__PURE__ */ m({
   __name: "FormGroup",
   props: {
     label: {},
@@ -2223,18 +2224,18 @@ const me = { "data-tauri-drag-region": "" }, ye = ["src"], fe = { "data-tauri-dr
     labelClass: { default: () => ({}) }
   },
   setup(t) {
-    return (e, i) => (o(), s("div", {
+    return (e, i) => (r(), s("div", {
       class: d(["flex flex-col gap-2", t.customClass])
     }, [
-      t.label ? (o(), s("label", {
+      t.label ? (r(), s("label", {
         key: 0,
         for: t.htmlFor,
-        class: d(["text-sm font-medium text-vsk-primary", t.labelClass])
-      }, w(t.label), 11, Ge)) : g("", !0),
+        class: d(["text-sm font-medium text-primary dark:text-primary-dark", t.labelClass])
+      }, g(t.label), 11, Ge)) : w("", !0),
       k(e.$slots, "default", {}, void 0, !0)
     ], 2));
   }
-}), je = /* @__PURE__ */ D(He, [["__scopeId", "data-v-a4bd01fc"]]), Je = /* @__PURE__ */ y({
+}), je = /* @__PURE__ */ D(He, [["__scopeId", "data-v-c0d9d9cb"]]), Je = /* @__PURE__ */ m({
   __name: "ListCard",
   props: {
     clickable: { type: Boolean, default: !1 },
@@ -2242,10 +2243,10 @@ const me = { "data-tauri-drag-region": "" }, ye = ["src"], fe = { "data-tauri-dr
   },
   emits: ["click"],
   setup(t, { emit: e }) {
-    const i = t, l = e, a = () => {
-      i.clickable && l("click");
+    const i = t, a = e, l = () => {
+      i.clickable && a("click");
     };
-    return (c, r) => (o(), s("div", {
+    return (c, o) => (r(), s("div", {
       class: d([
         "flex items-center justify-between background p-3 rounded-vsk border border-vsk-primary/70 transition-colors duration-200",
         {
@@ -2253,15 +2254,15 @@ const me = { "data-tauri-drag-region": "" }, ye = ["src"], fe = { "data-tauri-dr
         },
         t.customClass
       ]),
-      onClick: a
+      onClick: l
     }, [
       k(c.$slots, "default", {}, void 0, !0)
     ], 2));
   }
-}), qe = /* @__PURE__ */ D(Je, [["__scopeId", "data-v-f86d47da"]]), Ze = { class: "background rounded-vsk flex flex-row items-center gap-2 justify-between w-full h-auto p-4 transition-all duration-200 hover:bg-white/60 dark:hover:bg-black/60" }, Qe = ["src", "alt", "title"], Ye = {
+}), qe = /* @__PURE__ */ D(Je, [["__scopeId", "data-v-f86d47da"]]), Ze = { class: "background rounded-corner flex flex-row items-center gap-2 justify-between w-full h-auto p-4 transition-all duration-200 hover:bg-ui-surface/80 dark:hover:bg-ui-surface-dark/80" }, Qe = ["src", "alt", "title"], Ye = {
   key: 1,
   class: "w-8 h-8 flex items-center justify-center"
-}, Ke = ["src", "alt"], Xe = ["min", "max", "value"], et = /* @__PURE__ */ y({
+}, Ke = ["src", "alt"], Xe = ["min", "max", "value"], et = /* @__PURE__ */ m({
   __name: "SliderControl",
   props: {
     icon: {},
@@ -2276,21 +2277,21 @@ const me = { "data-tauri-drag-region": "" }, ye = ["src"], fe = { "data-tauri-dr
   },
   emits: ["update:modelValue", "buttonClick"],
   setup(t, { emit: e }) {
-    const i = t, l = e, a = T(() => {
+    const i = t, a = e, l = T(() => {
       if (i.max <= i.min) return 0;
       const h = i.max - i.min, v = i.modelValue - i.min;
       return Math.round(v / h * 100);
-    }), c = T(() => i.getPercentageClass ? i.getPercentageClass(a.value) : ""), r = (h) => {
+    }), c = T(() => i.getPercentageClass ? i.getPercentageClass(l.value) : ""), o = (h) => {
       const v = h.target;
-      l("update:modelValue", Number(v.value));
-    }, f = () => {
-      l("buttonClick");
+      a("update:modelValue", Number(v.value));
+    }, p = () => {
+      a("buttonClick");
     };
-    return (h, v) => (o(), s("div", Ze, [
-      t.showButton ? (o(), s("button", {
+    return (h, v) => (r(), s("div", Ze, [
+      t.showButton ? (r(), s("button", {
         key: 0,
-        onClick: f,
-        class: "w-8 h-8 flex items-center justify-center rounded-vsk transition-all duration-200 hover:bg-white/30 dark:hover:bg-black/30 hover:scale-110 active:scale-95"
+        onClick: p,
+        class: "w-8 h-8 flex items-center justify-center rounded-corner transition-all duration-200 hover:bg-ui-surface/80 dark:hover:bg-ui-surface-dark/80 hover:scale-110 active:scale-95"
       }, [
         u("img", {
           src: t.icon,
@@ -2298,7 +2299,7 @@ const me = { "data-tauri-drag-region": "" }, ye = ["src"], fe = { "data-tauri-dr
           title: t.tooltip,
           class: d(["w-6 h-6 transition-all duration-200", t.iconClass])
         }, null, 10, Qe)
-      ])) : (o(), s("div", Ye, [
+      ])) : (r(), s("div", Ye, [
         u("img", {
           src: t.icon,
           alt: t.alt,
@@ -2310,32 +2311,32 @@ const me = { "data-tauri-drag-region": "" }, ye = ["src"], fe = { "data-tauri-dr
         min: t.min,
         max: t.max,
         value: t.modelValue,
-        onInput: r,
+        onInput: o,
         class: "flex-1 transition-all duration-200 hover:scale-105"
       }, null, 40, Xe),
       u("span", {
         class: d(["w-12 text-right transition-all duration-200 font-medium", c.value])
-      }, w(a.value) + "% ", 3)
+      }, g(l.value) + "% ", 3)
     ]));
   }
-}), tt = ["disabled"], it = /* @__PURE__ */ y({
+}), tt = ["disabled"], it = /* @__PURE__ */ m({
   __name: "SwitchToggle",
   props: {
     isOn: { type: Boolean },
     disabled: { type: Boolean, default: !1 },
     size: { default: "small" },
-    activeClass: { default: "bg-vsk-primary" },
+    activeClass: { default: "bg-primary dark:bg-primary-dark" },
     inactiveClass: { default: "background" },
     customClass: { default: "" }
   },
   emits: ["toggle"],
   setup(t, { emit: e }) {
-    const i = t, l = e, a = () => {
-      l("toggle", !i.isOn);
+    const i = t, a = e, l = () => {
+      a("toggle", !i.isOn);
     };
-    return (c, r) => (o(), s("button", {
+    return (c, o) => (r(), s("button", {
       type: "button",
-      onClick: a,
+      onClick: l,
       disabled: t.disabled,
       class: d([
         "relative inline-flex items-center rounded-full transition-colors",
@@ -2354,7 +2355,7 @@ const me = { "data-tauri-drag-region": "" }, ye = ["src"], fe = { "data-tauri-dr
       }, null, 2)
     ], 10, tt));
   }
-}), nt = ["disabled"], lt = ["src", "alt", "title"], at = /* @__PURE__ */ y({
+}), nt = ["disabled"], at = ["src", "alt", "title"], lt = /* @__PURE__ */ m({
   __name: "ToggleControl",
   props: {
     icon: {},
@@ -2367,14 +2368,14 @@ const me = { "data-tauri-drag-region": "" }, ye = ["src"], fe = { "data-tauri-dr
   },
   emits: ["click"],
   setup(t, { emit: e }) {
-    const i = e, l = () => {
+    const i = e, a = () => {
       i("click");
     };
-    return (a, c) => (o(), s("button", {
-      onClick: l,
-      class: d(["p-2 rounded-vsk background hover:opacity-50 transition-all duration-300 h-17.5 w-17.5 group relative overflow-hidden hover:scale-105 hover:shadow-lg active:scale-95", {
+    return (l, c) => (r(), s("button", {
+      onClick: a,
+      class: d(["p-2 rounded-corner background hover:opacity-50 transition-all duration-300 h-17.5 w-17.5 group relative overflow-hidden hover:scale-105 hover:shadow-lg active:scale-95", {
         "animate-pulse": t.isLoading,
-        "ring-2 ring-vsk-primary/50": t.isActive,
+        "ring-2 ring-primary dark:ring-primary-dark": t.isActive,
         "opacity-60": !t.isActive,
         ...t.customClass
       }]),
@@ -2390,13 +2391,13 @@ const me = { "data-tauri-drag-region": "" }, ye = ["src"], fe = { "data-tauri-dr
           "drop-shadow-lg": t.isActive,
           ...t.iconClass
         }])
-      }, null, 10, lt)
+      }, null, 10, at)
     ], 10, nt));
   }
-}), st = ["title"], ot = ["src", "alt"], rt = {
+}), st = ["title"], rt = ["src", "alt"], ot = {
   key: 0,
-  class: "absolute bottom-1 right-1 bg-vsk-primary text-white text-xs rounded-full w-4 h-4 flex items-center justify-center font-bold animate-bounce"
-}, ut = /* @__PURE__ */ y({
+  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"
+}, ut = /* @__PURE__ */ m({
   __name: "TrayIconButton",
   props: {
     icon: {},
@@ -2411,38 +2412,38 @@ const me = { "data-tauri-drag-region": "" }, ye = ["src"], fe = { "data-tauri-dr
   },
   emits: ["click"],
   setup(t, { emit: e }) {
-    const i = e, l = x(!1), a = () => {
+    const i = e, a = x(!1), l = () => {
       i("click");
     };
-    return (c, r) => (o(), s("div", {
-      class: d(["p-1 rounded-vsk relative hover:bg-vsk-primary/30 group transition-all duration-300", t.customClass]),
+    return (c, o) => (r(), s("div", {
+      class: d(["p-1 rounded-corner relative hover:bg-primary dark:hover:bg-primary-dark group transition-all duration-300", t.customClass]),
       title: t.tooltip,
-      onClick: a,
-      onMouseenter: r[0] || (r[0] = (f) => l.value = !0),
-      onMouseleave: r[1] || (r[1] = (f) => l.value = !1)
+      onClick: l,
+      onMouseenter: o[0] || (o[0] = (p) => a.value = !0),
+      onMouseleave: o[1] || (o[1] = (p) => a.value = !1)
     }, [
       u("img", {
         src: t.icon,
         alt: t.alt,
         class: d(["m-auto h-5.5 w-auto transition-all duration-300", t.iconClass])
-      }, null, 10, ot),
-      t.badge !== null && t.badge > 0 ? (o(), s("div", rt, w(t.badge), 1)) : g("", !0),
-      t.showCustomTooltip && t.customTooltipText ? (o(), s("div", {
+      }, null, 10, rt),
+      t.badge !== null && t.badge > 0 ? (r(), s("div", ot, g(t.badge), 1)) : w("", !0),
+      t.showCustomTooltip && t.customTooltipText ? (r(), s("div", {
         key: 1,
-        class: d(["absolute top-1 left-1/2 transform -translate-x-1/2 text-xs font-semibold p-1 rounded-vsk transition-all duration-300 pointer-events-none background", [
+        class: d(["absolute top-1 left-1/2 transform -translate-x-1/2 text-xs font-semibold p-1 rounded-corner transition-all duration-300 pointer-events-none background", [
           t.tooltipClass,
           {
-            "opacity-0 -translate-y-2": !l.value,
-            "opacity-100 translate-y-0": l.value
+            "opacity-0 -translate-y-2": !a.value,
+            "opacity-100 translate-y-0": a.value
           }
         ]])
-      }, w(t.customTooltipText), 3)) : g("", !0),
+      }, g(t.customTooltipText), 3)) : w("", !0),
       k(c.$slots, "default")
     ], 42, st));
   }
 }), ct = [
   te,
-  le,
+  ae,
   Ce,
   $e,
   Be,
@@ -2451,7 +2452,7 @@ const me = { "data-tauri-drag-region": "" }, ye = ["src"], fe = { "data-tauri-dr
   qe,
   et,
   it,
-  at,
+  lt,
   ut
 ], ht = {
   install(t) {
@@ -2467,10 +2468,10 @@ export {
   je as FormGroup,
   qe as ListCard,
   te as SideBar,
-  le as SideButton,
+  ae as SideButton,
   et as SliderControl,
   it as SwitchToggle,
-  at as ToggleControl,
+  lt as ToggleControl,
   ut as TrayIconButton,
   Ce as WindowFrame,
   ht as default

package/dist/vue-libvasak.umd.js

@@ -1 +1 @@
-(function(r,n){typeof exports=="object"&&typeof module<"u"?n(exports,require("vue")):typeof define=="function"&&define.amd?define(["exports","vue"],n):(r=typeof globalThis<"u"?globalThis:r||self,n(r.VueLibVasak={},r.Vue))})(this,(function(r,n){"use strict";const y=(t,e)=>{const i=t.__vccOpts||t;for(const[l,s]of e)i[l]=s;return i},Q={},Y={class:"sidebar"};function K(t,e){return n.openBlock(),n.createElementBlock("div",Y,[n.renderSlot(t.$slots,"default")])}const z=y(Q,[["render",K]]),X={href:"#",class:"sidebar-button"},ee=["src","alt"],N=n.defineComponent({__name:"SideButton",props:{title:{type:String,default:"Link"},image:{type:String,default:""}},setup(t){return(e,i)=>(n.openBlock(),n.createElementBlock("a",X,[n.createElementVNode("img",{src:t.image,alt:t.title,class:"img-fluid"},null,8,ee)]))}});function te(t,e,i,l){if(typeof e=="function"?t!==e||!l:!e.has(t))throw new TypeError("Cannot read private member from an object whose class did not declare it");return i==="m"?l:i==="a"?l.call(t):l?l.value:e.get(t)}function ne(t,e,i,l,s){if(typeof e=="function"?t!==e||!0:!e.has(t))throw new TypeError("Cannot write private member to an object whose class did not declare it");return e.set(t,i),i}typeof SuppressedError=="function"&&SuppressedError;var _;const h="__TAURI_TO_IPC_KEY__";function ie(t,e=!1){return window.__TAURI_INTERNALS__.transformCallback(t,e)}async function a(t,e={},i){return window.__TAURI_INTERNALS__.invoke(t,e,i)}class le{get rid(){return te(this,_,"f")}constructor(e){_.set(this,void 0),ne(this,_,e)}async close(){return a("plugin:resources|close",{rid:this.rid})}}_=new WeakMap;class D{constructor(...e){this.type="Logical",e.length===1?"Logical"in e[0]?(this.width=e[0].Logical.width,this.height=e[0].Logical.height):(this.width=e[0].width,this.height=e[0].height):(this.width=e[0],this.height=e[1])}toPhysical(e){return new p(this.width*e,this.height*e)}[h](){return{width:this.width,height:this.height}}toJSON(){return this[h]()}}class p{constructor(...e){this.type="Physical",e.length===1?"Physical"in e[0]?(this.width=e[0].Physical.width,this.height=e[0].Physical.height):(this.width=e[0].width,this.height=e[0].height):(this.width=e[0],this.height=e[1])}toLogical(e){return new D(this.width/e,this.height/e)}[h](){return{width:this.width,height:this.height}}toJSON(){return this[h]()}}class w{constructor(e){this.size=e}toLogical(e){return this.size instanceof D?this.size:this.size.toLogical(e)}toPhysical(e){return this.size instanceof p?this.size:this.size.toPhysical(e)}[h](){return{[`${this.size.type}`]:{width:this.size.width,height:this.size.height}}}toJSON(){return this[h]()}}class I{constructor(...e){this.type="Logical",e.length===1?"Logical"in e[0]?(this.x=e[0].Logical.x,this.y=e[0].Logical.y):(this.x=e[0].x,this.y=e[0].y):(this.x=e[0],this.y=e[1])}toPhysical(e){return new b(this.x*e,this.y*e)}[h](){return{x:this.x,y:this.y}}toJSON(){return this[h]()}}class b{constructor(...e){this.type="Physical",e.length===1?"Physical"in e[0]?(this.x=e[0].Physical.x,this.y=e[0].Physical.y):(this.x=e[0].x,this.y=e[0].y):(this.x=e[0],this.y=e[1])}toLogical(e){return new I(this.x/e,this.y/e)}[h](){return{x:this.x,y:this.y}}toJSON(){return this[h]()}}class k{constructor(e){this.position=e}toLogical(e){return this.position instanceof I?this.position:this.position.toLogical(e)}toPhysical(e){return this.position instanceof b?this.position:this.position.toPhysical(e)}[h](){return{[`${this.position.type}`]:{x:this.position.x,y:this.position.y}}}toJSON(){return this[h]()}}var u;(function(t){t.WINDOW_RESIZED="tauri://resize",t.WINDOW_MOVED="tauri://move",t.WINDOW_CLOSE_REQUESTED="tauri://close-requested",t.WINDOW_DESTROYED="tauri://destroyed",t.WINDOW_FOCUS="tauri://focus",t.WINDOW_BLUR="tauri://blur",t.WINDOW_SCALE_FACTOR_CHANGED="tauri://scale-change",t.WINDOW_THEME_CHANGED="tauri://theme-changed",t.WINDOW_CREATED="tauri://window-created",t.WEBVIEW_CREATED="tauri://webview-created",t.DRAG_ENTER="tauri://drag-enter",t.DRAG_OVER="tauri://drag-over",t.DRAG_DROP="tauri://drag-drop",t.DRAG_LEAVE="tauri://drag-leave"})(u||(u={}));async function A(t,e){window.__TAURI_EVENT_PLUGIN_INTERNALS__.unregisterListener(t,e),await a("plugin:event|unlisten",{event:t,eventId:e})}async function $(t,e,i){var l;const s=typeof i?.target=="string"?{kind:"AnyLabel",label:i.target}:(l=i?.target)!==null&&l!==void 0?l:{kind:"Any"};return a("plugin:event|listen",{event:t,target:s,handler:ie(e)}).then(c=>async()=>A(t,c))}async function ae(t,e,i){return $(t,l=>{A(t,l.id),e(l)},i)}async function se(t,e){await a("plugin:event|emit",{event:t,payload:e})}async function oe(t,e,i){await a("plugin:event|emit_to",{target:typeof t=="string"?{kind:"AnyLabel",label:t}:t,event:e,payload:i})}class f extends le{constructor(e){super(e)}static async new(e,i,l){return a("plugin:image|new",{rgba:C(e),width:i,height:l}).then(s=>new f(s))}static async fromBytes(e){return a("plugin:image|from_bytes",{bytes:C(e)}).then(i=>new f(i))}static async fromPath(e){return a("plugin:image|from_path",{path:e}).then(i=>new f(i))}async rgba(){return a("plugin:image|rgba",{rid:this.rid}).then(e=>new Uint8Array(e))}async size(){return a("plugin:image|size",{rid:this.rid})}}function C(t){return t==null?null:typeof t=="string"?t:t instanceof f?t.rid:t}var x;(function(t){t[t.Critical=1]="Critical",t[t.Informational=2]="Informational"})(x||(x={}));class re{constructor(e){this._preventDefault=!1,this.event=e.event,this.id=e.id}preventDefault(){this._preventDefault=!0}isPreventDefault(){return this._preventDefault}}var W;(function(t){t.None="none",t.Normal="normal",t.Indeterminate="indeterminate",t.Paused="paused",t.Error="error"})(W||(W={}));function V(){return new v(window.__TAURI_INTERNALS__.metadata.currentWindow.label,{skip:!0})}async function B(){return a("plugin:window|get_all_windows").then(t=>t.map(e=>new v(e,{skip:!0})))}const E=["tauri://created","tauri://error"];class v{constructor(e,i={}){var l;this.label=e,this.listeners=Object.create(null),i?.skip||a("plugin:window|create",{options:{...i,parent:typeof i.parent=="string"?i.parent:(l=i.parent)===null||l===void 0?void 0:l.label,label:e}}).then(async()=>this.emit("tauri://created")).catch(async s=>this.emit("tauri://error",s))}static async getByLabel(e){var i;return(i=(await B()).find(l=>l.label===e))!==null&&i!==void 0?i:null}static getCurrent(){return V()}static async getAll(){return B()}static async getFocusedWindow(){for(const e of await B())if(await e.isFocused())return e;return null}async listen(e,i){return this._handleTauriEvent(e,i)?()=>{const l=this.listeners[e];l.splice(l.indexOf(i),1)}:$(e,i,{target:{kind:"Window",label:this.label}})}async once(e,i){return this._handleTauriEvent(e,i)?()=>{const l=this.listeners[e];l.splice(l.indexOf(i),1)}:ae(e,i,{target:{kind:"Window",label:this.label}})}async emit(e,i){if(E.includes(e)){for(const l of this.listeners[e]||[])l({event:e,id:-1,payload:i});return}return se(e,i)}async emitTo(e,i,l){if(E.includes(i)){for(const s of this.listeners[i]||[])s({event:i,id:-1,payload:l});return}return oe(e,i,l)}_handleTauriEvent(e,i){return E.includes(e)?(e in this.listeners?this.listeners[e].push(i):this.listeners[e]=[i],!0):!1}async scaleFactor(){return a("plugin:window|scale_factor",{label:this.label})}async innerPosition(){return a("plugin:window|inner_position",{label:this.label}).then(e=>new b(e))}async outerPosition(){return a("plugin:window|outer_position",{label:this.label}).then(e=>new b(e))}async innerSize(){return a("plugin:window|inner_size",{label:this.label}).then(e=>new p(e))}async outerSize(){return a("plugin:window|outer_size",{label:this.label}).then(e=>new p(e))}async isFullscreen(){return a("plugin:window|is_fullscreen",{label:this.label})}async isMinimized(){return a("plugin:window|is_minimized",{label:this.label})}async isMaximized(){return a("plugin:window|is_maximized",{label:this.label})}async isFocused(){return a("plugin:window|is_focused",{label:this.label})}async isDecorated(){return a("plugin:window|is_decorated",{label:this.label})}async isResizable(){return a("plugin:window|is_resizable",{label:this.label})}async isMaximizable(){return a("plugin:window|is_maximizable",{label:this.label})}async isMinimizable(){return a("plugin:window|is_minimizable",{label:this.label})}async isClosable(){return a("plugin:window|is_closable",{label:this.label})}async isVisible(){return a("plugin:window|is_visible",{label:this.label})}async title(){return a("plugin:window|title",{label:this.label})}async theme(){return a("plugin:window|theme",{label:this.label})}async isAlwaysOnTop(){return a("plugin:window|is_always_on_top",{label:this.label})}async center(){return a("plugin:window|center",{label:this.label})}async requestUserAttention(e){let i=null;return e&&(e===x.Critical?i={type:"Critical"}:i={type:"Informational"}),a("plugin:window|request_user_attention",{label:this.label,value:i})}async setResizable(e){return a("plugin:window|set_resizable",{label:this.label,value:e})}async setEnabled(e){return a("plugin:window|set_enabled",{label:this.label,value:e})}async isEnabled(){return a("plugin:window|is_enabled",{label:this.label})}async setMaximizable(e){return a("plugin:window|set_maximizable",{label:this.label,value:e})}async setMinimizable(e){return a("plugin:window|set_minimizable",{label:this.label,value:e})}async setClosable(e){return a("plugin:window|set_closable",{label:this.label,value:e})}async setTitle(e){return a("plugin:window|set_title",{label:this.label,value:e})}async maximize(){return a("plugin:window|maximize",{label:this.label})}async unmaximize(){return a("plugin:window|unmaximize",{label:this.label})}async toggleMaximize(){return a("plugin:window|toggle_maximize",{label:this.label})}async minimize(){return a("plugin:window|minimize",{label:this.label})}async unminimize(){return a("plugin:window|unminimize",{label:this.label})}async show(){return a("plugin:window|show",{label:this.label})}async hide(){return a("plugin:window|hide",{label:this.label})}async close(){return a("plugin:window|close",{label:this.label})}async destroy(){return a("plugin:window|destroy",{label:this.label})}async setDecorations(e){return a("plugin:window|set_decorations",{label:this.label,value:e})}async setShadow(e){return a("plugin:window|set_shadow",{label:this.label,value:e})}async setEffects(e){return a("plugin:window|set_effects",{label:this.label,value:e})}async clearEffects(){return a("plugin:window|set_effects",{label:this.label,value:null})}async setAlwaysOnTop(e){return a("plugin:window|set_always_on_top",{label:this.label,value:e})}async setAlwaysOnBottom(e){return a("plugin:window|set_always_on_bottom",{label:this.label,value:e})}async setContentProtected(e){return a("plugin:window|set_content_protected",{label:this.label,value:e})}async setSize(e){return a("plugin:window|set_size",{label:this.label,value:e instanceof w?e:new w(e)})}async setMinSize(e){return a("plugin:window|set_min_size",{label:this.label,value:e instanceof w?e:e?new w(e):null})}async setMaxSize(e){return a("plugin:window|set_max_size",{label:this.label,value:e instanceof w?e:e?new w(e):null})}async setSizeConstraints(e){function i(l){return l?{Logical:l}:null}return a("plugin:window|set_size_constraints",{label:this.label,value:{minWidth:i(e?.minWidth),minHeight:i(e?.minHeight),maxWidth:i(e?.maxWidth),maxHeight:i(e?.maxHeight)}})}async setPosition(e){return a("plugin:window|set_position",{label:this.label,value:e instanceof k?e:new k(e)})}async setFullscreen(e){return a("plugin:window|set_fullscreen",{label:this.label,value:e})}async setSimpleFullscreen(e){return a("plugin:window|set_simple_fullscreen",{label:this.label,value:e})}async setFocus(){return a("plugin:window|set_focus",{label:this.label})}async setFocusable(e){return a("plugin:window|set_focusable",{label:this.label,value:e})}async setIcon(e){return a("plugin:window|set_icon",{label:this.label,value:C(e)})}async setSkipTaskbar(e){return a("plugin:window|set_skip_taskbar",{label:this.label,value:e})}async setCursorGrab(e){return a("plugin:window|set_cursor_grab",{label:this.label,value:e})}async setCursorVisible(e){return a("plugin:window|set_cursor_visible",{label:this.label,value:e})}async setCursorIcon(e){return a("plugin:window|set_cursor_icon",{label:this.label,value:e})}async setBackgroundColor(e){return a("plugin:window|set_background_color",{color:e})}async setCursorPosition(e){return a("plugin:window|set_cursor_position",{label:this.label,value:e instanceof k?e:new k(e)})}async setIgnoreCursorEvents(e){return a("plugin:window|set_ignore_cursor_events",{label:this.label,value:e})}async startDragging(){return a("plugin:window|start_dragging",{label:this.label})}async startResizeDragging(e){return a("plugin:window|start_resize_dragging",{label:this.label,value:e})}async setBadgeCount(e){return a("plugin:window|set_badge_count",{label:this.label,value:e})}async setBadgeLabel(e){return a("plugin:window|set_badge_label",{label:this.label,value:e})}async setOverlayIcon(e){return a("plugin:window|set_overlay_icon",{label:this.label,value:e?C(e):void 0})}async setProgressBar(e){return a("plugin:window|set_progress_bar",{label:this.label,value:e})}async setVisibleOnAllWorkspaces(e){return a("plugin:window|set_visible_on_all_workspaces",{label:this.label,value:e})}async setTitleBarStyle(e){return a("plugin:window|set_title_bar_style",{label:this.label,value:e})}async setTheme(e){return a("plugin:window|set_theme",{label:this.label,value:e})}async onResized(e){return this.listen(u.WINDOW_RESIZED,i=>{i.payload=new p(i.payload),e(i)})}async onMoved(e){return this.listen(u.WINDOW_MOVED,i=>{i.payload=new b(i.payload),e(i)})}async onCloseRequested(e){return this.listen(u.WINDOW_CLOSE_REQUESTED,async i=>{const l=new re(i);await e(l),l.isPreventDefault()||await this.destroy()})}async onDragDropEvent(e){const i=await this.listen(u.DRAG_ENTER,o=>{e({...o,payload:{type:"enter",paths:o.payload.paths,position:new b(o.payload.position)}})}),l=await this.listen(u.DRAG_OVER,o=>{e({...o,payload:{type:"over",position:new b(o.payload.position)}})}),s=await this.listen(u.DRAG_DROP,o=>{e({...o,payload:{type:"drop",paths:o.payload.paths,position:new b(o.payload.position)}})}),c=await this.listen(u.DRAG_LEAVE,o=>{e({...o,payload:{type:"leave"}})});return()=>{i(),s(),l(),c()}}async onFocusChanged(e){const i=await this.listen(u.WINDOW_FOCUS,s=>{e({...s,payload:!0})}),l=await this.listen(u.WINDOW_BLUR,s=>{e({...s,payload:!1})});return()=>{i(),l()}}async onScaleChanged(e){return this.listen(u.WINDOW_SCALE_FACTOR_CHANGED,e)}async onThemeChanged(e){return this.listen(u.WINDOW_THEME_CHANGED,e)}}var L;(function(t){t.Disabled="disabled",t.Throttle="throttle",t.Suspend="suspend"})(L||(L={}));var O;(function(t){t.Default="default",t.FluentOverlay="fluentOverlay"})(O||(O={}));var T;(function(t){t.AppearanceBased="appearanceBased",t.Light="light",t.Dark="dark",t.MediumLight="mediumLight",t.UltraDark="ultraDark",t.Titlebar="titlebar",t.Selection="selection",t.Menu="menu",t.Popover="popover",t.Sidebar="sidebar",t.HeaderView="headerView",t.Sheet="sheet",t.WindowBackground="windowBackground",t.HudWindow="hudWindow",t.FullScreenUI="fullScreenUI",t.Tooltip="tooltip",t.ContentBackground="contentBackground",t.UnderWindowBackground="underWindowBackground",t.UnderPageBackground="underPageBackground",t.Mica="mica",t.Blur="blur",t.Acrylic="acrylic",t.Tabbed="tabbed",t.TabbedDark="tabbedDark",t.TabbedLight="tabbedLight"})(T||(T={}));var R;(function(t){t.FollowsWindowActiveState="followsWindowActiveState",t.Active="active",t.Inactive="inactive"})(R||(R={})),typeof SuppressedError=="function"&&SuppressedError;async function ce(t,e={},i){return window.__TAURI_INTERNALS__.invoke(t,e,i)}async function de(t){try{return await ce("plugin:vicons|get_icon",{name:t})}catch(e){console.error("[Icon Error] Error obteniendo icono:",e)}return""}function ue(t){try{const e=atob(t.substring(0,32)),i=new Uint8Array(e.length);for(let l=0;l<e.length;l++)i[l]=e.charCodeAt(l);return i[0]===137&&i[1]===80&&i[2]===78&&i[3]===71?"image/png":"image/svg+xml"}catch(e){return console.error("Error identificando tipo de imagen:",e),"image/png"}}async function S(t){try{const e=await de(t);return`data:${ue(e)};base64,${e}`}catch(e){return console.error("[Icon Error] Error obteniendo icono:",e),""}}const he={"data-tauri-drag-region":""},me=["src"],be={"data-tauri-drag-region":""},ge={"data-tauri-drag-region":""},we=["src"],ye=["src"],pe=["src"],fe=n.defineComponent({__name:"TopBar",props:{title:String,image:String},setup(t){const e=n.ref(null),i=V(),l=n.ref(""),s=n.ref(""),c=n.ref(""),o=t;return n.onMounted(async()=>{l.value=await S("window-close"),s.value=await S("window-minimize"),c.value=await S("window-maximize")}),(m,d)=>(n.openBlock(),n.createElementBlock("div",{"data-tauri-drag-region":"",class:"flex h-8 px-4 py-1 bg-vsk-primary rounded-t-window justify-between align-center",ref_key:"bar",ref:e},[n.createElementVNode("div",he,[n.createElementVNode("img",{src:o.image,"data-tauri-drag-region":"",class:"h-6 w-auto"},null,8,me)]),n.createElementVNode("div",be,n.toDisplayString(o.title),1),n.createElementVNode("div",ge,[n.createElementVNode("span",{class:"win-button",onClick:d[0]||(d[0]=g=>n.unref(i).minimize())},[n.createElementVNode("img",{src:s.value,class:"h-6 w-6 inline-block",alt:"Minimize"},null,8,we)]),n.createElementVNode("span",{class:"win-button",onClick:d[1]||(d[1]=g=>n.unref(i).toggleMaximize())},[n.createElementVNode("img",{src:c.value,class:"h-6 w-6 inline-block",alt:"Maximize"},null,8,ye)]),n.createElementVNode("span",{class:"win-button",onClick:d[2]||(d[2]=g=>n.unref(i).close())},[n.createElementVNode("img",{src:l.value,class:"h-6 w-6 inline-block",alt:"Close"},null,8,pe)])])],512))}}),P=n.defineComponent({__name:"WindowFrame",props:{title:{type:String,default:"Vasak"},image:{type:String,default:""}},setup(t){const e=t;return(i,l)=>(n.openBlock(),n.createElementBlock(n.Fragment,null,[n.createVNode(fe,{title:e.title,image:e.image},null,8,["title","image"]),n.renderSlot(i.$slots,"default")],64))}}),_e=["type","disabled"],ke={key:0,class:"w-4 h-4 animate-spin rounded-full border-2 border-current border-t-transparent"},Ce=["src","alt"],xe={key:2},Be=["src","alt"],M=y(n.defineComponent({__name:"ActionButton",props:{label:{},disabled:{type:Boolean,default:!1},variant:{default:"primary"},loading:{type:Boolean,default:!1},customClass:{default:()=>({})},size:{default:"md"},fullWidth:{type:Boolean,default:!1},iconSrc:{default:""},iconAlt:{default:""},iconRight:{type:Boolean,default:!1},type:{default:"button"},stopPropagation:{type:Boolean,default:!1},preventDefault:{type:Boolean,default:!1}},emits:["click"],setup(t,{emit:e}){const i=t,l=e,s={primary:"bg-vsk-primary text-white hover:bg-vsk-primary/90",secondary:"bg-vsk-border text-vsk-text hover:bg-vsk-border/80",danger:"bg-red-600 text-white hover:bg-red-700"},c={sm:"px-2 py-1 text-xs",md:"px-3 py-1 text-sm",lg:"px-4 py-2 text-base"},o=m=>{i.stopPropagation&&m.stopPropagation(),i.preventDefault&&m.preventDefault(),!i.disabled&&!i.loading&&l("click")};return(m,d)=>(n.openBlock(),n.createElementBlock("button",{type:i.type,onClick:o,class:n.normalizeClass(["rounded-vsk transition-all duration-200 disabled:opacity-50 disabled:cursor-not-allowed flex items-center justify-center gap-2",[s[i.variant],c[i.size],i.fullWidth?"w-full":"",i.iconSrc&&!i.label?"px-2 py-2":"",t.customClass]]),disabled:i.disabled||i.loading},[t.loading?(n.openBlock(),n.createElementBlock("span",ke)):n.createCommentVNode("",!0),i.iconSrc&&!i.iconRight?(n.openBlock(),n.createElementBlock("img",{key:1,src:i.iconSrc,alt:i.iconAlt||i.label,class:"w-4 h-4"},null,8,Ce)):n.createCommentVNode("",!0),i.label?(n.openBlock(),n.createElementBlock("span",xe,n.toDisplayString(i.label),1)):n.createCommentVNode("",!0),i.iconSrc&&i.iconRight?(n.openBlock(),n.createElementBlock("img",{key:3,src:i.iconSrc,alt:i.iconAlt||i.label,class:"w-4 h-4"},null,8,Be)):n.createCommentVNode("",!0)],10,_e))}}),[["__scopeId","data-v-d1ce8923"]]),Ee={class:"text-base font-semibold m-0 text-vsk-primary"},F=y(n.defineComponent({__name:"ConfigSection",props:{title:{},icon:{default:""},customClass:{default:()=>({})}},setup(t){return(e,i)=>(n.openBlock(),n.createElementBlock("div",{class:n.normalizeClass(["flex flex-col gap-4 p-4 background rounded-vsk",t.customClass])},[n.createElementVNode("h3",Ee,n.toDisplayString(t.icon?`${t.icon} ${t.title}`:t.title),1),n.renderSlot(e.$slots,"default",{},void 0,!0)],2))}}),[["__scopeId","data-v-89531d08"]]),Se={class:"flex items-center gap-3 flex-1 min-w-0"},ze=["src","alt"],Ne={class:"min-w-0"},De={class:"font-semibold truncate"},Ie={key:0,class:"text-xs text-gray-400 truncate"},Ae={key:1,class:"text-xs text-gray-400 truncate"},$e={key:2,class:"text-xs text-gray-400 flex gap-2 mt-1"},We={key:1,class:"w-2 h-2 rounded-full bg-green-500"},U=n.defineComponent({__name:"DeviceCard",props:{icon:{},title:{},subtitle:{default:""},metadata:{default:""},extraInfo:{default:()=>[]},isConnected:{type:Boolean,default:!1},showActionButton:{type:Boolean,default:!0},actionLabel:{default:"Conectar"},showStatusIndicator:{type:Boolean,default:!1},customClass:{default:""},clickable:{type:Boolean,default:!1}},emits:["action","click"],setup(t,{emit:e}){const i=e,l=()=>{i("action")},s=()=>{i("click")};return(c,o)=>(n.openBlock(),n.createElementBlock("div",{class:n.normalizeClass(["flex items-center justify-between background rounded-vsk px-6 py-3 mb-4",[{"border-l-4 border-green-500":t.isConnected},t.customClass]]),onClick:s},[n.createElementVNode("div",Se,[n.createElementVNode("img",{src:t.icon,alt:t.title,class:"h-7 w-7 shrink-0"},null,8,ze),n.createElementVNode("div",Ne,[n.createElementVNode("div",De,n.toDisplayString(t.title),1),t.subtitle?(n.openBlock(),n.createElementBlock("div",Ie,n.toDisplayString(t.subtitle),1)):n.createCommentVNode("",!0),t.metadata?(n.openBlock(),n.createElementBlock("div",Ae,n.toDisplayString(t.metadata),1)):n.createCommentVNode("",!0),t.extraInfo&&t.extraInfo.length>0?(n.openBlock(),n.createElementBlock("div",$e,[(n.openBlock(!0),n.createElementBlock(n.Fragment,null,n.renderList(t.extraInfo,(m,d)=>(n.openBlock(),n.createElementBlock("span",{key:d},n.toDisplayString(m),1))),128))])):n.createCommentVNode("",!0)])]),t.showActionButton?(n.openBlock(),n.createElementBlock("button",{key:0,class:"bg-vsk-primary rounded-vsk px-4 py-2 text-sm font-semibold cursor-pointer hover:opacity-70",onClick:n.withModifiers(l,["stop"])},n.toDisplayString(t.actionLabel),1)):n.createCommentVNode("",!0),t.showStatusIndicator&&t.isConnected?(n.openBlock(),n.createElementBlock("div",We)):n.createCommentVNode("",!0)],2))}}),Ve=["for"],G=y(n.defineComponent({__name:"FormGroup",props:{label:{},htmlFor:{default:""},customClass:{default:()=>({})},labelClass:{default:()=>({})}},setup(t){return(e,i)=>(n.openBlock(),n.createElementBlock("div",{class:n.normalizeClass(["flex flex-col gap-2",t.customClass])},[t.label?(n.openBlock(),n.createElementBlock("label",{key:0,for:t.htmlFor,class:n.normalizeClass(["text-sm font-medium text-vsk-primary",t.labelClass])},n.toDisplayString(t.label),11,Ve)):n.createCommentVNode("",!0),n.renderSlot(e.$slots,"default",{},void 0,!0)],2))}}),[["__scopeId","data-v-a4bd01fc"]]),j=y(n.defineComponent({__name:"ListCard",props:{clickable:{type:Boolean,default:!1},customClass:{default:()=>({})}},emits:["click"],setup(t,{emit:e}){const i=t,l=e,s=()=>{i.clickable&&l("click")};return(c,o)=>(n.openBlock(),n.createElementBlock("div",{class:n.normalizeClass(["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":i.clickable},t.customClass]),onClick:s},[n.renderSlot(c.$slots,"default",{},void 0,!0)],2))}}),[["__scopeId","data-v-f86d47da"]]),ve={class:"background rounded-vsk flex flex-row items-center gap-2 justify-between w-full h-auto p-4 transition-all duration-200 hover:bg-white/60 dark:hover:bg-black/60"},Le=["src","alt","title"],Oe={key:1,class:"w-8 h-8 flex items-center justify-center"},Te=["src","alt"],Re=["min","max","value"],H=n.defineComponent({__name:"SliderControl",props:{icon:{},alt:{default:""},tooltip:{default:""},modelValue:{},min:{default:0},max:{default:100},showButton:{type:Boolean,default:!1},iconClass:{default:()=>({})},getPercentageClass:{type:Function,default:()=>""}},emits:["update:modelValue","buttonClick"],setup(t,{emit:e}){const i=t,l=e,s=n.computed(()=>{if(i.max<=i.min)return 0;const d=i.max-i.min,g=i.modelValue-i.min;return Math.round(g/d*100)}),c=n.computed(()=>i.getPercentageClass?i.getPercentageClass(s.value):""),o=d=>{const g=d.target;l("update:modelValue",Number(g.value))},m=()=>{l("buttonClick")};return(d,g)=>(n.openBlock(),n.createElementBlock("div",ve,[t.showButton?(n.openBlock(),n.createElementBlock("button",{key:0,onClick:m,class:"w-8 h-8 flex items-center justify-center rounded-vsk transition-all duration-200 hover:bg-white/30 dark:hover:bg-black/30 hover:scale-110 active:scale-95"},[n.createElementVNode("img",{src:t.icon,alt:t.alt,title:t.tooltip,class:n.normalizeClass(["w-6 h-6 transition-all duration-200",t.iconClass])},null,10,Le)])):(n.openBlock(),n.createElementBlock("div",Oe,[n.createElementVNode("img",{src:t.icon,alt:t.alt,class:"w-6 h-6 transition-all duration-200"},null,8,Te)])),n.createElementVNode("input",{type:"range",min:t.min,max:t.max,value:t.modelValue,onInput:o,class:"flex-1 transition-all duration-200 hover:scale-105"},null,40,Re),n.createElementVNode("span",{class:n.normalizeClass(["w-12 text-right transition-all duration-200 font-medium",c.value])},n.toDisplayString(s.value)+"% ",3)]))}}),Pe=["disabled"],q=n.defineComponent({__name:"SwitchToggle",props:{isOn:{type:Boolean},disabled:{type:Boolean,default:!1},size:{default:"small"},activeClass:{default:"bg-vsk-primary"},inactiveClass:{default:"background"},customClass:{default:""}},emits:["toggle"],setup(t,{emit:e}){const i=t,l=e,s=()=>{l("toggle",!i.isOn)};return(c,o)=>(n.openBlock(),n.createElementBlock("button",{type:"button",onClick:s,disabled:t.disabled,class:n.normalizeClass(["relative inline-flex items-center rounded-full transition-colors",t.size==="small"?"h-6 w-11":"h-7 w-12",t.isOn?t.activeClass:t.inactiveClass,t.disabled?"opacity-50 cursor-not-allowed":"cursor-pointer",t.customClass])},[n.createElementVNode("span",{class:n.normalizeClass(["inline-block transform rounded-full bg-white shadow transition-transform",t.size==="small"?"h-4 w-4":"h-6 w-6",t.isOn?t.size==="small"?"translate-x-6":"translate-x-5":"translate-x-1"])},null,2)],10,Pe))}}),Me=["disabled"],Fe=["src","alt","title"],J=n.defineComponent({__name:"ToggleControl",props:{icon:{},alt:{default:""},tooltip:{default:""},isActive:{type:Boolean,default:!1},isLoading:{type:Boolean,default:!1},iconClass:{default:()=>({})},customClass:{default:()=>({})}},emits:["click"],setup(t,{emit:e}){const i=e,l=()=>{i("click")};return(s,c)=>(n.openBlock(),n.createElementBlock("button",{onClick:l,class:n.normalizeClass(["p-2 rounded-vsk background hover:opacity-50 transition-all duration-300 h-17.5 w-17.5 group relative overflow-hidden hover:scale-105 hover:shadow-lg active:scale-95",{"animate-pulse":t.isLoading,"ring-2 ring-vsk-primary/50":t.isActive,"opacity-60":!t.isActive,...t.customClass}]),disabled:t.isLoading},[n.createElementVNode("img",{src:t.icon,alt:t.alt,title:t.tooltip,class:n.normalizeClass(["m-auto w-12.5 h-12.5 transition-all duration-300 group-hover:scale-110 relative z-10",{"animate-spin":t.isLoading,"filter brightness-75":!t.isActive,"drop-shadow-lg":t.isActive,...t.iconClass}])},null,10,Fe)],10,Me))}}),Ue=["title"],Ge=["src","alt"],je={key:0,class:"absolute bottom-1 right-1 bg-vsk-primary text-white text-xs rounded-full w-4 h-4 flex items-center justify-center font-bold animate-bounce"},Z=n.defineComponent({__name:"TrayIconButton",props:{icon:{},alt:{default:""},tooltip:{default:""},badge:{default:null},iconClass:{default:()=>({})},customClass:{default:""},tooltipClass:{default:""},showCustomTooltip:{type:Boolean,default:!1},customTooltipText:{default:""}},emits:["click"],setup(t,{emit:e}){const i=e,l=n.ref(!1),s=()=>{i("click")};return(c,o)=>(n.openBlock(),n.createElementBlock("div",{class:n.normalizeClass(["p-1 rounded-vsk relative hover:bg-vsk-primary/30 group transition-all duration-300",t.customClass]),title:t.tooltip,onClick:s,onMouseenter:o[0]||(o[0]=m=>l.value=!0),onMouseleave:o[1]||(o[1]=m=>l.value=!1)},[n.createElementVNode("img",{src:t.icon,alt:t.alt,class:n.normalizeClass(["m-auto h-5.5 w-auto transition-all duration-300",t.iconClass])},null,10,Ge),t.badge!==null&&t.badge>0?(n.openBlock(),n.createElementBlock("div",je,n.toDisplayString(t.badge),1)):n.createCommentVNode("",!0),t.showCustomTooltip&&t.customTooltipText?(n.openBlock(),n.createElementBlock("div",{key:1,class:n.normalizeClass(["absolute top-1 left-1/2 transform -translate-x-1/2 text-xs font-semibold p-1 rounded-vsk transition-all duration-300 pointer-events-none background",[t.tooltipClass,{"opacity-0 -translate-y-2":!l.value,"opacity-100 translate-y-0":l.value}]])},n.toDisplayString(t.customTooltipText),3)):n.createCommentVNode("",!0),n.renderSlot(c.$slots,"default")],42,Ue))}}),He=[z,N,P,M,F,U,G,j,H,q,J,Z],qe={install(t){He.forEach(e=>{t.component(e.name,e)})}};r.ActionButton=M,r.ConfigSection=F,r.DeviceCard=U,r.FormGroup=G,r.ListCard=j,r.SideBar=z,r.SideButton=N,r.SliderControl=H,r.SwitchToggle=q,r.ToggleControl=J,r.TrayIconButton=Z,r.WindowFrame=P,r.default=qe,Object.defineProperties(r,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}})}));
+(function(r,n){typeof exports=="object"&&typeof module<"u"?n(exports,require("vue")):typeof define=="function"&&define.amd?define(["exports","vue"],n):(r=typeof globalThis<"u"?globalThis:r||self,n(r.VueLibVasak={},r.Vue))})(this,(function(r,n){"use strict";const y=(t,e)=>{const i=t.__vccOpts||t;for(const[l,s]of e)i[l]=s;return i},Q={},Y={class:"sidebar"};function K(t,e){return n.openBlock(),n.createElementBlock("div",Y,[n.renderSlot(t.$slots,"default")])}const z=y(Q,[["render",K]]),X={href:"#",class:"sidebar-button"},ee=["src","alt"],N=n.defineComponent({__name:"SideButton",props:{title:{type:String,default:"Link"},image:{type:String,default:""}},setup(t){return(e,i)=>(n.openBlock(),n.createElementBlock("a",X,[n.createElementVNode("img",{src:t.image,alt:t.title,class:"img-fluid"},null,8,ee)]))}});function te(t,e,i,l){if(typeof e=="function"?t!==e||!l:!e.has(t))throw new TypeError("Cannot read private member from an object whose class did not declare it");return i==="m"?l:i==="a"?l.call(t):l?l.value:e.get(t)}function ne(t,e,i,l,s){if(typeof e=="function"?t!==e||!0:!e.has(t))throw new TypeError("Cannot write private member to an object whose class did not declare it");return e.set(t,i),i}typeof SuppressedError=="function"&&SuppressedError;var k;const h="__TAURI_TO_IPC_KEY__";function ie(t,e=!1){return window.__TAURI_INTERNALS__.transformCallback(t,e)}async function a(t,e={},i){return window.__TAURI_INTERNALS__.invoke(t,e,i)}class le{get rid(){return te(this,k,"f")}constructor(e){k.set(this,void 0),ne(this,k,e)}async close(){return a("plugin:resources|close",{rid:this.rid})}}k=new WeakMap;class D{constructor(...e){this.type="Logical",e.length===1?"Logical"in e[0]?(this.width=e[0].Logical.width,this.height=e[0].Logical.height):(this.width=e[0].width,this.height=e[0].height):(this.width=e[0],this.height=e[1])}toPhysical(e){return new p(this.width*e,this.height*e)}[h](){return{width:this.width,height:this.height}}toJSON(){return this[h]()}}class p{constructor(...e){this.type="Physical",e.length===1?"Physical"in e[0]?(this.width=e[0].Physical.width,this.height=e[0].Physical.height):(this.width=e[0].width,this.height=e[0].height):(this.width=e[0],this.height=e[1])}toLogical(e){return new D(this.width/e,this.height/e)}[h](){return{width:this.width,height:this.height}}toJSON(){return this[h]()}}class w{constructor(e){this.size=e}toLogical(e){return this.size instanceof D?this.size:this.size.toLogical(e)}toPhysical(e){return this.size instanceof p?this.size:this.size.toPhysical(e)}[h](){return{[`${this.size.type}`]:{width:this.size.width,height:this.size.height}}}toJSON(){return this[h]()}}class I{constructor(...e){this.type="Logical",e.length===1?"Logical"in e[0]?(this.x=e[0].Logical.x,this.y=e[0].Logical.y):(this.x=e[0].x,this.y=e[0].y):(this.x=e[0],this.y=e[1])}toPhysical(e){return new b(this.x*e,this.y*e)}[h](){return{x:this.x,y:this.y}}toJSON(){return this[h]()}}class b{constructor(...e){this.type="Physical",e.length===1?"Physical"in e[0]?(this.x=e[0].Physical.x,this.y=e[0].Physical.y):(this.x=e[0].x,this.y=e[0].y):(this.x=e[0],this.y=e[1])}toLogical(e){return new I(this.x/e,this.y/e)}[h](){return{x:this.x,y:this.y}}toJSON(){return this[h]()}}class _{constructor(e){this.position=e}toLogical(e){return this.position instanceof I?this.position:this.position.toLogical(e)}toPhysical(e){return this.position instanceof b?this.position:this.position.toPhysical(e)}[h](){return{[`${this.position.type}`]:{x:this.position.x,y:this.position.y}}}toJSON(){return this[h]()}}var u;(function(t){t.WINDOW_RESIZED="tauri://resize",t.WINDOW_MOVED="tauri://move",t.WINDOW_CLOSE_REQUESTED="tauri://close-requested",t.WINDOW_DESTROYED="tauri://destroyed",t.WINDOW_FOCUS="tauri://focus",t.WINDOW_BLUR="tauri://blur",t.WINDOW_SCALE_FACTOR_CHANGED="tauri://scale-change",t.WINDOW_THEME_CHANGED="tauri://theme-changed",t.WINDOW_CREATED="tauri://window-created",t.WEBVIEW_CREATED="tauri://webview-created",t.DRAG_ENTER="tauri://drag-enter",t.DRAG_OVER="tauri://drag-over",t.DRAG_DROP="tauri://drag-drop",t.DRAG_LEAVE="tauri://drag-leave"})(u||(u={}));async function A(t,e){window.__TAURI_EVENT_PLUGIN_INTERNALS__.unregisterListener(t,e),await a("plugin:event|unlisten",{event:t,eventId:e})}async function $(t,e,i){var l;const s=typeof i?.target=="string"?{kind:"AnyLabel",label:i.target}:(l=i?.target)!==null&&l!==void 0?l:{kind:"Any"};return a("plugin:event|listen",{event:t,target:s,handler:ie(e)}).then(c=>async()=>A(t,c))}async function ae(t,e,i){return $(t,l=>{A(t,l.id),e(l)},i)}async function se(t,e){await a("plugin:event|emit",{event:t,payload:e})}async function oe(t,e,i){await a("plugin:event|emit_to",{target:typeof t=="string"?{kind:"AnyLabel",label:t}:t,event:e,payload:i})}class f extends le{constructor(e){super(e)}static async new(e,i,l){return a("plugin:image|new",{rgba:C(e),width:i,height:l}).then(s=>new f(s))}static async fromBytes(e){return a("plugin:image|from_bytes",{bytes:C(e)}).then(i=>new f(i))}static async fromPath(e){return a("plugin:image|from_path",{path:e}).then(i=>new f(i))}async rgba(){return a("plugin:image|rgba",{rid:this.rid}).then(e=>new Uint8Array(e))}async size(){return a("plugin:image|size",{rid:this.rid})}}function C(t){return t==null?null:typeof t=="string"?t:t instanceof f?t.rid:t}var x;(function(t){t[t.Critical=1]="Critical",t[t.Informational=2]="Informational"})(x||(x={}));class re{constructor(e){this._preventDefault=!1,this.event=e.event,this.id=e.id}preventDefault(){this._preventDefault=!0}isPreventDefault(){return this._preventDefault}}var W;(function(t){t.None="none",t.Normal="normal",t.Indeterminate="indeterminate",t.Paused="paused",t.Error="error"})(W||(W={}));function V(){return new L(window.__TAURI_INTERNALS__.metadata.currentWindow.label,{skip:!0})}async function B(){return a("plugin:window|get_all_windows").then(t=>t.map(e=>new L(e,{skip:!0})))}const E=["tauri://created","tauri://error"];class L{constructor(e,i={}){var l;this.label=e,this.listeners=Object.create(null),i?.skip||a("plugin:window|create",{options:{...i,parent:typeof i.parent=="string"?i.parent:(l=i.parent)===null||l===void 0?void 0:l.label,label:e}}).then(async()=>this.emit("tauri://created")).catch(async s=>this.emit("tauri://error",s))}static async getByLabel(e){var i;return(i=(await B()).find(l=>l.label===e))!==null&&i!==void 0?i:null}static getCurrent(){return V()}static async getAll(){return B()}static async getFocusedWindow(){for(const e of await B())if(await e.isFocused())return e;return null}async listen(e,i){return this._handleTauriEvent(e,i)?()=>{const l=this.listeners[e];l.splice(l.indexOf(i),1)}:$(e,i,{target:{kind:"Window",label:this.label}})}async once(e,i){return this._handleTauriEvent(e,i)?()=>{const l=this.listeners[e];l.splice(l.indexOf(i),1)}:ae(e,i,{target:{kind:"Window",label:this.label}})}async emit(e,i){if(E.includes(e)){for(const l of this.listeners[e]||[])l({event:e,id:-1,payload:i});return}return se(e,i)}async emitTo(e,i,l){if(E.includes(i)){for(const s of this.listeners[i]||[])s({event:i,id:-1,payload:l});return}return oe(e,i,l)}_handleTauriEvent(e,i){return E.includes(e)?(e in this.listeners?this.listeners[e].push(i):this.listeners[e]=[i],!0):!1}async scaleFactor(){return a("plugin:window|scale_factor",{label:this.label})}async innerPosition(){return a("plugin:window|inner_position",{label:this.label}).then(e=>new b(e))}async outerPosition(){return a("plugin:window|outer_position",{label:this.label}).then(e=>new b(e))}async innerSize(){return a("plugin:window|inner_size",{label:this.label}).then(e=>new p(e))}async outerSize(){return a("plugin:window|outer_size",{label:this.label}).then(e=>new p(e))}async isFullscreen(){return a("plugin:window|is_fullscreen",{label:this.label})}async isMinimized(){return a("plugin:window|is_minimized",{label:this.label})}async isMaximized(){return a("plugin:window|is_maximized",{label:this.label})}async isFocused(){return a("plugin:window|is_focused",{label:this.label})}async isDecorated(){return a("plugin:window|is_decorated",{label:this.label})}async isResizable(){return a("plugin:window|is_resizable",{label:this.label})}async isMaximizable(){return a("plugin:window|is_maximizable",{label:this.label})}async isMinimizable(){return a("plugin:window|is_minimizable",{label:this.label})}async isClosable(){return a("plugin:window|is_closable",{label:this.label})}async isVisible(){return a("plugin:window|is_visible",{label:this.label})}async title(){return a("plugin:window|title",{label:this.label})}async theme(){return a("plugin:window|theme",{label:this.label})}async isAlwaysOnTop(){return a("plugin:window|is_always_on_top",{label:this.label})}async center(){return a("plugin:window|center",{label:this.label})}async requestUserAttention(e){let i=null;return e&&(e===x.Critical?i={type:"Critical"}:i={type:"Informational"}),a("plugin:window|request_user_attention",{label:this.label,value:i})}async setResizable(e){return a("plugin:window|set_resizable",{label:this.label,value:e})}async setEnabled(e){return a("plugin:window|set_enabled",{label:this.label,value:e})}async isEnabled(){return a("plugin:window|is_enabled",{label:this.label})}async setMaximizable(e){return a("plugin:window|set_maximizable",{label:this.label,value:e})}async setMinimizable(e){return a("plugin:window|set_minimizable",{label:this.label,value:e})}async setClosable(e){return a("plugin:window|set_closable",{label:this.label,value:e})}async setTitle(e){return a("plugin:window|set_title",{label:this.label,value:e})}async maximize(){return a("plugin:window|maximize",{label:this.label})}async unmaximize(){return a("plugin:window|unmaximize",{label:this.label})}async toggleMaximize(){return a("plugin:window|toggle_maximize",{label:this.label})}async minimize(){return a("plugin:window|minimize",{label:this.label})}async unminimize(){return a("plugin:window|unminimize",{label:this.label})}async show(){return a("plugin:window|show",{label:this.label})}async hide(){return a("plugin:window|hide",{label:this.label})}async close(){return a("plugin:window|close",{label:this.label})}async destroy(){return a("plugin:window|destroy",{label:this.label})}async setDecorations(e){return a("plugin:window|set_decorations",{label:this.label,value:e})}async setShadow(e){return a("plugin:window|set_shadow",{label:this.label,value:e})}async setEffects(e){return a("plugin:window|set_effects",{label:this.label,value:e})}async clearEffects(){return a("plugin:window|set_effects",{label:this.label,value:null})}async setAlwaysOnTop(e){return a("plugin:window|set_always_on_top",{label:this.label,value:e})}async setAlwaysOnBottom(e){return a("plugin:window|set_always_on_bottom",{label:this.label,value:e})}async setContentProtected(e){return a("plugin:window|set_content_protected",{label:this.label,value:e})}async setSize(e){return a("plugin:window|set_size",{label:this.label,value:e instanceof w?e:new w(e)})}async setMinSize(e){return a("plugin:window|set_min_size",{label:this.label,value:e instanceof w?e:e?new w(e):null})}async setMaxSize(e){return a("plugin:window|set_max_size",{label:this.label,value:e instanceof w?e:e?new w(e):null})}async setSizeConstraints(e){function i(l){return l?{Logical:l}:null}return a("plugin:window|set_size_constraints",{label:this.label,value:{minWidth:i(e?.minWidth),minHeight:i(e?.minHeight),maxWidth:i(e?.maxWidth),maxHeight:i(e?.maxHeight)}})}async setPosition(e){return a("plugin:window|set_position",{label:this.label,value:e instanceof _?e:new _(e)})}async setFullscreen(e){return a("plugin:window|set_fullscreen",{label:this.label,value:e})}async setSimpleFullscreen(e){return a("plugin:window|set_simple_fullscreen",{label:this.label,value:e})}async setFocus(){return a("plugin:window|set_focus",{label:this.label})}async setFocusable(e){return a("plugin:window|set_focusable",{label:this.label,value:e})}async setIcon(e){return a("plugin:window|set_icon",{label:this.label,value:C(e)})}async setSkipTaskbar(e){return a("plugin:window|set_skip_taskbar",{label:this.label,value:e})}async setCursorGrab(e){return a("plugin:window|set_cursor_grab",{label:this.label,value:e})}async setCursorVisible(e){return a("plugin:window|set_cursor_visible",{label:this.label,value:e})}async setCursorIcon(e){return a("plugin:window|set_cursor_icon",{label:this.label,value:e})}async setBackgroundColor(e){return a("plugin:window|set_background_color",{color:e})}async setCursorPosition(e){return a("plugin:window|set_cursor_position",{label:this.label,value:e instanceof _?e:new _(e)})}async setIgnoreCursorEvents(e){return a("plugin:window|set_ignore_cursor_events",{label:this.label,value:e})}async startDragging(){return a("plugin:window|start_dragging",{label:this.label})}async startResizeDragging(e){return a("plugin:window|start_resize_dragging",{label:this.label,value:e})}async setBadgeCount(e){return a("plugin:window|set_badge_count",{label:this.label,value:e})}async setBadgeLabel(e){return a("plugin:window|set_badge_label",{label:this.label,value:e})}async setOverlayIcon(e){return a("plugin:window|set_overlay_icon",{label:this.label,value:e?C(e):void 0})}async setProgressBar(e){return a("plugin:window|set_progress_bar",{label:this.label,value:e})}async setVisibleOnAllWorkspaces(e){return a("plugin:window|set_visible_on_all_workspaces",{label:this.label,value:e})}async setTitleBarStyle(e){return a("plugin:window|set_title_bar_style",{label:this.label,value:e})}async setTheme(e){return a("plugin:window|set_theme",{label:this.label,value:e})}async onResized(e){return this.listen(u.WINDOW_RESIZED,i=>{i.payload=new p(i.payload),e(i)})}async onMoved(e){return this.listen(u.WINDOW_MOVED,i=>{i.payload=new b(i.payload),e(i)})}async onCloseRequested(e){return this.listen(u.WINDOW_CLOSE_REQUESTED,async i=>{const l=new re(i);await e(l),l.isPreventDefault()||await this.destroy()})}async onDragDropEvent(e){const i=await this.listen(u.DRAG_ENTER,o=>{e({...o,payload:{type:"enter",paths:o.payload.paths,position:new b(o.payload.position)}})}),l=await this.listen(u.DRAG_OVER,o=>{e({...o,payload:{type:"over",position:new b(o.payload.position)}})}),s=await this.listen(u.DRAG_DROP,o=>{e({...o,payload:{type:"drop",paths:o.payload.paths,position:new b(o.payload.position)}})}),c=await this.listen(u.DRAG_LEAVE,o=>{e({...o,payload:{type:"leave"}})});return()=>{i(),s(),l(),c()}}async onFocusChanged(e){const i=await this.listen(u.WINDOW_FOCUS,s=>{e({...s,payload:!0})}),l=await this.listen(u.WINDOW_BLUR,s=>{e({...s,payload:!1})});return()=>{i(),l()}}async onScaleChanged(e){return this.listen(u.WINDOW_SCALE_FACTOR_CHANGED,e)}async onThemeChanged(e){return this.listen(u.WINDOW_THEME_CHANGED,e)}}var O;(function(t){t.Disabled="disabled",t.Throttle="throttle",t.Suspend="suspend"})(O||(O={}));var T;(function(t){t.Default="default",t.FluentOverlay="fluentOverlay"})(T||(T={}));var R;(function(t){t.AppearanceBased="appearanceBased",t.Light="light",t.Dark="dark",t.MediumLight="mediumLight",t.UltraDark="ultraDark",t.Titlebar="titlebar",t.Selection="selection",t.Menu="menu",t.Popover="popover",t.Sidebar="sidebar",t.HeaderView="headerView",t.Sheet="sheet",t.WindowBackground="windowBackground",t.HudWindow="hudWindow",t.FullScreenUI="fullScreenUI",t.Tooltip="tooltip",t.ContentBackground="contentBackground",t.UnderWindowBackground="underWindowBackground",t.UnderPageBackground="underPageBackground",t.Mica="mica",t.Blur="blur",t.Acrylic="acrylic",t.Tabbed="tabbed",t.TabbedDark="tabbedDark",t.TabbedLight="tabbedLight"})(R||(R={}));var P;(function(t){t.FollowsWindowActiveState="followsWindowActiveState",t.Active="active",t.Inactive="inactive"})(P||(P={})),typeof SuppressedError=="function"&&SuppressedError;async function ce(t,e={},i){return window.__TAURI_INTERNALS__.invoke(t,e,i)}async function de(t){try{return await ce("plugin:vicons|get_icon",{name:t})}catch(e){console.error("[Icon Error] Error obteniendo icono:",e)}return""}function ue(t){try{const e=atob(t.substring(0,32)),i=new Uint8Array(e.length);for(let l=0;l<e.length;l++)i[l]=e.charCodeAt(l);return i[0]===137&&i[1]===80&&i[2]===78&&i[3]===71?"image/png":"image/svg+xml"}catch(e){return console.error("Error identificando tipo de imagen:",e),"image/png"}}async function S(t){try{const e=await de(t);return`data:${ue(e)};base64,${e}`}catch(e){return console.error("[Icon Error] Error obteniendo icono:",e),""}}const he={"data-tauri-drag-region":""},me=["src","alt"],be={"data-tauri-drag-region":""},ge={"data-tauri-drag-region":""},we=["src"],ye=["src"],pe=["src"],fe=n.defineComponent({__name:"TopBar",props:{title:String,image:String},setup(t){const e=n.ref(null),i=V(),l=n.ref(""),s=n.ref(""),c=n.ref(""),o=t;return n.onMounted(async()=>{l.value=await S("window-close"),s.value=await S("window-minimize"),c.value=await S("window-maximize")}),(m,d)=>(n.openBlock(),n.createElementBlock("div",{"data-tauri-drag-region":"",class:"flex h-8 px-4 py-1 bg-primary dark:bg-primary-dark rounded-t-corner-window justify-between align-center",ref_key:"bar",ref:e},[n.createElementVNode("div",he,[n.createElementVNode("img",{src:o.image,"data-tauri-drag-region":"",class:"h-6 w-auto",alt:o.title},null,8,me)]),n.createElementVNode("div",be,n.toDisplayString(o.title),1),n.createElementVNode("div",ge,[n.createElementVNode("span",{class:"win-button",onClick:d[0]||(d[0]=g=>n.unref(i).minimize())},[n.createElementVNode("img",{src:s.value,class:"h-6 w-6 inline-block",alt:"Minimize"},null,8,we)]),n.createElementVNode("span",{class:"win-button",onClick:d[1]||(d[1]=g=>n.unref(i).toggleMaximize())},[n.createElementVNode("img",{src:c.value,class:"h-6 w-6 inline-block",alt:"Maximize"},null,8,ye)]),n.createElementVNode("span",{class:"win-button",onClick:d[2]||(d[2]=g=>n.unref(i).close())},[n.createElementVNode("img",{src:l.value,class:"h-6 w-6 inline-block",alt:"Close"},null,8,pe)])])],512))}}),v=n.defineComponent({__name:"WindowFrame",props:{title:{type:String,default:"Vasak"},image:{type:String,default:""}},setup(t){const e=t;return(i,l)=>(n.openBlock(),n.createElementBlock(n.Fragment,null,[n.createVNode(fe,{title:e.title,image:e.image},null,8,["title","image"]),n.renderSlot(i.$slots,"default")],64))}}),ke=["type","disabled"],_e={key:0,class:"w-4 h-4 animate-spin rounded-full border-2 border-current border-t-transparent"},Ce=["src","alt"],xe={key:2},Be=["src","alt"],M=y(n.defineComponent({__name:"ActionButton",props:{label:{},disabled:{type:Boolean,default:!1},variant:{default:"primary"},loading:{type:Boolean,default:!1},customClass:{default:()=>({})},size:{default:"md"},fullWidth:{type:Boolean,default:!1},iconSrc:{default:""},iconAlt:{default:""},iconRight:{type:Boolean,default:!1},type:{default:"button"},stopPropagation:{type:Boolean,default:!1},preventDefault:{type:Boolean,default:!1}},emits:["click"],setup(t,{emit:e}){const i=t,l=e,s={primary:"bg-primary dark:bg-primary-dark text-tx-on-primary dark:text-tx-on-primary-dark hover:bg-primary/90 dark:hover:bg-primary-dark/90",secondary:"bg-secondary dark:bg-secondary-dark text-tx-on-primary dark:text-tx-on-primary-dark hover:bg-secondary/80 dark:hover:bg-secondary-dark/80",danger:"bg-status-error dark:bg-status-error-dark text-tx-on-primary dark:text-tx-on-primary-dark hover:bg-status-error/90 dark:hover:bg-status-error-dark/90"},c={sm:"px-2 py-1 text-xs",md:"px-3 py-1 text-sm",lg:"px-4 py-2 text-base"},o=m=>{i.stopPropagation&&m.stopPropagation(),i.preventDefault&&m.preventDefault(),!i.disabled&&!i.loading&&l("click")};return(m,d)=>(n.openBlock(),n.createElementBlock("button",{type:i.type,onClick:o,class:n.normalizeClass(["rounded-corner transition-all duration-200 disabled:opacity-50 disabled:cursor-not-allowed flex items-center justify-center gap-2",[s[i.variant],c[i.size],i.fullWidth?"w-full":"",i.iconSrc&&!i.label?"px-2 py-2":"",t.customClass]]),disabled:i.disabled||i.loading},[t.loading?(n.openBlock(),n.createElementBlock("span",_e)):n.createCommentVNode("",!0),i.iconSrc&&!i.iconRight?(n.openBlock(),n.createElementBlock("img",{key:1,src:i.iconSrc,alt:i.iconAlt||i.label,class:"w-4 h-4"},null,8,Ce)):n.createCommentVNode("",!0),i.label?(n.openBlock(),n.createElementBlock("span",xe,n.toDisplayString(i.label),1)):n.createCommentVNode("",!0),i.iconSrc&&i.iconRight?(n.openBlock(),n.createElementBlock("img",{key:3,src:i.iconSrc,alt:i.iconAlt||i.label,class:"w-4 h-4"},null,8,Be)):n.createCommentVNode("",!0)],10,ke))}}),[["__scopeId","data-v-2eaf6e27"]]),Ee={class:"text-base font-semibold m-0 text-primary dark:text-primary-dark"},F=y(n.defineComponent({__name:"ConfigSection",props:{title:{},icon:{default:""},customClass:{default:()=>({})}},setup(t){return(e,i)=>(n.openBlock(),n.createElementBlock("div",{class:n.normalizeClass(["flex flex-col gap-4 p-4 background rounded-corner",t.customClass])},[n.createElementVNode("h3",Ee,n.toDisplayString(t.icon?`${t.icon} ${t.title}`:t.title),1),n.renderSlot(e.$slots,"default",{},void 0,!0)],2))}}),[["__scopeId","data-v-45bd4eab"]]),Se={class:"flex items-center gap-3 flex-1 min-w-0"},ze=["src","alt"],Ne={class:"min-w-0"},De={class:"font-semibold truncate"},Ie={key:0,class:"text-xs text-gray-400 truncate"},Ae={key:1,class:"text-xs text-gray-400 truncate"},$e={key:2,class:"text-xs text-gray-400 flex gap-2 mt-1"},We={key:1,class:"w-2 h-2 rounded-full bg-green-500"},U=n.defineComponent({__name:"DeviceCard",props:{icon:{},title:{},subtitle:{default:""},metadata:{default:""},extraInfo:{default:()=>[]},isConnected:{type:Boolean,default:!1},showActionButton:{type:Boolean,default:!0},actionLabel:{default:"Conectar"},showStatusIndicator:{type:Boolean,default:!1},customClass:{default:""},clickable:{type:Boolean,default:!1}},emits:["action","click"],setup(t,{emit:e}){const i=e,l=()=>{i("action")},s=()=>{i("click")};return(c,o)=>(n.openBlock(),n.createElementBlock("div",{class:n.normalizeClass(["flex items-center justify-between background rounded-vsk px-6 py-3 mb-4",[{"border-l-4 border-green-500":t.isConnected},t.customClass]]),onClick:s},[n.createElementVNode("div",Se,[n.createElementVNode("img",{src:t.icon,alt:t.title,class:"h-7 w-7 shrink-0"},null,8,ze),n.createElementVNode("div",Ne,[n.createElementVNode("div",De,n.toDisplayString(t.title),1),t.subtitle?(n.openBlock(),n.createElementBlock("div",Ie,n.toDisplayString(t.subtitle),1)):n.createCommentVNode("",!0),t.metadata?(n.openBlock(),n.createElementBlock("div",Ae,n.toDisplayString(t.metadata),1)):n.createCommentVNode("",!0),t.extraInfo&&t.extraInfo.length>0?(n.openBlock(),n.createElementBlock("div",$e,[(n.openBlock(!0),n.createElementBlock(n.Fragment,null,n.renderList(t.extraInfo,(m,d)=>(n.openBlock(),n.createElementBlock("span",{key:d},n.toDisplayString(m),1))),128))])):n.createCommentVNode("",!0)])]),t.showActionButton?(n.openBlock(),n.createElementBlock("button",{key:0,class:"bg-vsk-primary rounded-vsk px-4 py-2 text-sm font-semibold cursor-pointer hover:opacity-70",onClick:n.withModifiers(l,["stop"])},n.toDisplayString(t.actionLabel),1)):n.createCommentVNode("",!0),t.showStatusIndicator&&t.isConnected?(n.openBlock(),n.createElementBlock("div",We)):n.createCommentVNode("",!0)],2))}}),Ve=["for"],G=y(n.defineComponent({__name:"FormGroup",props:{label:{},htmlFor:{default:""},customClass:{default:()=>({})},labelClass:{default:()=>({})}},setup(t){return(e,i)=>(n.openBlock(),n.createElementBlock("div",{class:n.normalizeClass(["flex flex-col gap-2",t.customClass])},[t.label?(n.openBlock(),n.createElementBlock("label",{key:0,for:t.htmlFor,class:n.normalizeClass(["text-sm font-medium text-primary dark:text-primary-dark",t.labelClass])},n.toDisplayString(t.label),11,Ve)):n.createCommentVNode("",!0),n.renderSlot(e.$slots,"default",{},void 0,!0)],2))}}),[["__scopeId","data-v-c0d9d9cb"]]),j=y(n.defineComponent({__name:"ListCard",props:{clickable:{type:Boolean,default:!1},customClass:{default:()=>({})}},emits:["click"],setup(t,{emit:e}){const i=t,l=e,s=()=>{i.clickable&&l("click")};return(c,o)=>(n.openBlock(),n.createElementBlock("div",{class:n.normalizeClass(["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":i.clickable},t.customClass]),onClick:s},[n.renderSlot(c.$slots,"default",{},void 0,!0)],2))}}),[["__scopeId","data-v-f86d47da"]]),Le={class:"background rounded-corner flex flex-row items-center gap-2 justify-between w-full h-auto p-4 transition-all duration-200 hover:bg-ui-surface/80 dark:hover:bg-ui-surface-dark/80"},Oe=["src","alt","title"],Te={key:1,class:"w-8 h-8 flex items-center justify-center"},Re=["src","alt"],Pe=["min","max","value"],H=n.defineComponent({__name:"SliderControl",props:{icon:{},alt:{default:""},tooltip:{default:""},modelValue:{},min:{default:0},max:{default:100},showButton:{type:Boolean,default:!1},iconClass:{default:()=>({})},getPercentageClass:{type:Function,default:()=>""}},emits:["update:modelValue","buttonClick"],setup(t,{emit:e}){const i=t,l=e,s=n.computed(()=>{if(i.max<=i.min)return 0;const d=i.max-i.min,g=i.modelValue-i.min;return Math.round(g/d*100)}),c=n.computed(()=>i.getPercentageClass?i.getPercentageClass(s.value):""),o=d=>{const g=d.target;l("update:modelValue",Number(g.value))},m=()=>{l("buttonClick")};return(d,g)=>(n.openBlock(),n.createElementBlock("div",Le,[t.showButton?(n.openBlock(),n.createElementBlock("button",{key:0,onClick:m,class:"w-8 h-8 flex items-center justify-center rounded-corner transition-all duration-200 hover:bg-ui-surface/80 dark:hover:bg-ui-surface-dark/80 hover:scale-110 active:scale-95"},[n.createElementVNode("img",{src:t.icon,alt:t.alt,title:t.tooltip,class:n.normalizeClass(["w-6 h-6 transition-all duration-200",t.iconClass])},null,10,Oe)])):(n.openBlock(),n.createElementBlock("div",Te,[n.createElementVNode("img",{src:t.icon,alt:t.alt,class:"w-6 h-6 transition-all duration-200"},null,8,Re)])),n.createElementVNode("input",{type:"range",min:t.min,max:t.max,value:t.modelValue,onInput:o,class:"flex-1 transition-all duration-200 hover:scale-105"},null,40,Pe),n.createElementVNode("span",{class:n.normalizeClass(["w-12 text-right transition-all duration-200 font-medium",c.value])},n.toDisplayString(s.value)+"% ",3)]))}}),ve=["disabled"],q=n.defineComponent({__name:"SwitchToggle",props:{isOn:{type:Boolean},disabled:{type:Boolean,default:!1},size:{default:"small"},activeClass:{default:"bg-primary dark:bg-primary-dark"},inactiveClass:{default:"background"},customClass:{default:""}},emits:["toggle"],setup(t,{emit:e}){const i=t,l=e,s=()=>{l("toggle",!i.isOn)};return(c,o)=>(n.openBlock(),n.createElementBlock("button",{type:"button",onClick:s,disabled:t.disabled,class:n.normalizeClass(["relative inline-flex items-center rounded-full transition-colors",t.size==="small"?"h-6 w-11":"h-7 w-12",t.isOn?t.activeClass:t.inactiveClass,t.disabled?"opacity-50 cursor-not-allowed":"cursor-pointer",t.customClass])},[n.createElementVNode("span",{class:n.normalizeClass(["inline-block transform rounded-full bg-white shadow transition-transform",t.size==="small"?"h-4 w-4":"h-6 w-6",t.isOn?t.size==="small"?"translate-x-6":"translate-x-5":"translate-x-1"])},null,2)],10,ve))}}),Me=["disabled"],Fe=["src","alt","title"],J=n.defineComponent({__name:"ToggleControl",props:{icon:{},alt:{default:""},tooltip:{default:""},isActive:{type:Boolean,default:!1},isLoading:{type:Boolean,default:!1},iconClass:{default:()=>({})},customClass:{default:()=>({})}},emits:["click"],setup(t,{emit:e}){const i=e,l=()=>{i("click")};return(s,c)=>(n.openBlock(),n.createElementBlock("button",{onClick:l,class:n.normalizeClass(["p-2 rounded-corner background hover:opacity-50 transition-all duration-300 h-17.5 w-17.5 group relative overflow-hidden hover:scale-105 hover:shadow-lg active:scale-95",{"animate-pulse":t.isLoading,"ring-2 ring-primary dark:ring-primary-dark":t.isActive,"opacity-60":!t.isActive,...t.customClass}]),disabled:t.isLoading},[n.createElementVNode("img",{src:t.icon,alt:t.alt,title:t.tooltip,class:n.normalizeClass(["m-auto w-12.5 h-12.5 transition-all duration-300 group-hover:scale-110 relative z-10",{"animate-spin":t.isLoading,"filter brightness-75":!t.isActive,"drop-shadow-lg":t.isActive,...t.iconClass}])},null,10,Fe)],10,Me))}}),Ue=["title"],Ge=["src","alt"],je={key:0,class:"absolute bottom-1 right-1 bg-primary dark:bg-primary-dark text-white text-xs rounded-full w-4 h-4 flex items-center justify-center font-bold animate-bounce"},Z=n.defineComponent({__name:"TrayIconButton",props:{icon:{},alt:{default:""},tooltip:{default:""},badge:{default:null},iconClass:{default:()=>({})},customClass:{default:""},tooltipClass:{default:""},showCustomTooltip:{type:Boolean,default:!1},customTooltipText:{default:""}},emits:["click"],setup(t,{emit:e}){const i=e,l=n.ref(!1),s=()=>{i("click")};return(c,o)=>(n.openBlock(),n.createElementBlock("div",{class:n.normalizeClass(["p-1 rounded-corner relative hover:bg-primary dark:hover:bg-primary-dark group transition-all duration-300",t.customClass]),title:t.tooltip,onClick:s,onMouseenter:o[0]||(o[0]=m=>l.value=!0),onMouseleave:o[1]||(o[1]=m=>l.value=!1)},[n.createElementVNode("img",{src:t.icon,alt:t.alt,class:n.normalizeClass(["m-auto h-5.5 w-auto transition-all duration-300",t.iconClass])},null,10,Ge),t.badge!==null&&t.badge>0?(n.openBlock(),n.createElementBlock("div",je,n.toDisplayString(t.badge),1)):n.createCommentVNode("",!0),t.showCustomTooltip&&t.customTooltipText?(n.openBlock(),n.createElementBlock("div",{key:1,class:n.normalizeClass(["absolute top-1 left-1/2 transform -translate-x-1/2 text-xs font-semibold p-1 rounded-corner transition-all duration-300 pointer-events-none background",[t.tooltipClass,{"opacity-0 -translate-y-2":!l.value,"opacity-100 translate-y-0":l.value}]])},n.toDisplayString(t.customTooltipText),3)):n.createCommentVNode("",!0),n.renderSlot(c.$slots,"default")],42,Ue))}}),He=[z,N,v,M,F,U,G,j,H,q,J,Z],qe={install(t){He.forEach(e=>{t.component(e.name,e)})}};r.ActionButton=M,r.ConfigSection=F,r.DeviceCard=U,r.FormGroup=G,r.ListCard=j,r.SideBar=z,r.SideButton=N,r.SliderControl=H,r.SwitchToggle=q,r.ToggleControl=J,r.TrayIconButton=Z,r.WindowFrame=v,r.default=qe,Object.defineProperties(r,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}})}));

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@vasakgroup/vue-libvasak",
-  "version": "0.2.0",
+  "version": "0.2.2",
   "description": "Vue componenets for VSK Applications",
   "main": "./dist/vue-libvasak.umd.js",
   "module": "./dist/vue-libvasak.es.js",
@@ -42,10 +42,10 @@
   },
   "license": "GPLv3",
   "dependencies": {
-    "@tauri-apps/api": "^2.9.1",
+    "@tauri-apps/api": "^2.10.1",
     "@vasakgroup/plugin-vicons": "^2.0.0",
-    "vue": "^3.5.27",
-    "vue-router": "^4.6.4"
+    "vue": "^3.5.28",
+    "vue-router": "^5.0.3"
   },
   "peerDependencies": {
     "vue": "^3.0.0"
@@ -53,7 +53,7 @@
   "devDependencies": {
     "typescript": "^5.9.3",
     "vite": "^7.3.1",
-    "@vitejs/plugin-vue": "^6.0.3"
+    "@vitejs/plugin-vue": "^6.0.4"
   },
   "scripts": {
     "build": "vite build",

package/src/controls/ActionButton.vue

@@ -35,9 +35,9 @@ const emit = defineEmits<{
 }>();
 
 const variantClasses: Record<string, string> = {
-  primary: 'bg-vsk-primary text-white hover:bg-vsk-primary/90',
-  secondary: 'bg-vsk-border text-vsk-text hover:bg-vsk-border/80',
-  danger: 'bg-red-600 text-white hover:bg-red-700',
+  primary: 'bg-primary dark:bg-primary-dark text-tx-on-primary dark:text-tx-on-primary-dark hover:bg-primary/90 dark:hover:bg-primary-dark/90',
+  secondary: 'bg-secondary dark:bg-secondary-dark text-tx-on-primary dark:text-tx-on-primary-dark hover:bg-secondary/80 dark:hover:bg-secondary-dark/80',
+  danger: 'bg-status-error dark:bg-status-error-dark text-tx-on-primary dark:text-tx-on-primary-dark hover:bg-status-error/90 dark:hover:bg-status-error-dark/90',
 };
 
 const sizeClasses: Record<'sm' | 'md' | 'lg', string> = {
@@ -59,7 +59,7 @@ const handleClick = (event: Event) => {
   <button
     :type="props.type"
     @click="handleClick"
-    class="rounded-vsk transition-all duration-200 disabled:opacity-50 disabled:cursor-not-allowed flex items-center justify-center gap-2"
+    class="rounded-corner transition-all duration-200 disabled:opacity-50 disabled:cursor-not-allowed flex items-center justify-center gap-2"
     :class="[
       variantClasses[props.variant],
       sizeClasses[props.size],

package/src/controls/ToggleControl.vue

@@ -1,10 +1,10 @@
 <template>
   <button
     @click="handleClick"
-    class="p-2 rounded-vsk background hover:opacity-50 transition-all duration-300 h-17.5 w-17.5 group relative overflow-hidden hover:scale-105 hover:shadow-lg active:scale-95"
+    class="p-2 rounded-corner background hover:opacity-50 transition-all duration-300 h-17.5 w-17.5 group relative overflow-hidden hover:scale-105 hover:shadow-lg active:scale-95"
     :class="{
       'animate-pulse': isLoading,
-      'ring-2 ring-vsk-primary/50': isActive,
+      'ring-2 ring-primary dark:ring-primary-dark': isActive,
       'opacity-60': !isActive,
       ...customClass
     }"

package/src/forms/FormGroup.vue

@@ -15,7 +15,7 @@ withDefaults(defineProps<Props>(), {
 
 <template>
   <div class="flex flex-col gap-2" :class="customClass">
-    <label v-if="label" :for="htmlFor" class="text-sm font-medium text-vsk-primary" :class="labelClass">
+    <label v-if="label" :for="htmlFor" class="text-sm font-medium text-primary dark:text-primary-dark" :class="labelClass">
       {{ label }}
     </label>
     <slot />

package/src/forms/SliderControl.vue

@@ -1,11 +1,11 @@
 <template>
   <div
-    class="background rounded-vsk flex flex-row items-center gap-2 justify-between w-full h-auto p-4 transition-all duration-200 hover:bg-white/60 dark:hover:bg-black/60"
+    class="background rounded-corner flex flex-row items-center gap-2 justify-between w-full h-auto p-4 transition-all duration-200 hover:bg-ui-surface/80 dark:hover:bg-ui-surface-dark/80"
   >
     <button
       v-if="showButton"
       @click="handleButtonClick"
-      class="w-8 h-8 flex items-center justify-center rounded-vsk transition-all duration-200 hover:bg-white/30 dark:hover:bg-black/30 hover:scale-110 active:scale-95"
+      class="w-8 h-8 flex items-center justify-center rounded-corner transition-all duration-200 hover:bg-ui-surface/80 dark:hover:bg-ui-surface-dark/80 hover:scale-110 active:scale-95"
     >
       <img
         :src="icon"

package/src/forms/SwitchToggle.vue

@@ -34,7 +34,7 @@ interface Props {
 const props = withDefaults(defineProps<Props>(), {
   disabled: false,
   size: 'small',
-  activeClass: 'bg-vsk-primary',
+  activeClass: 'bg-primary dark:bg-primary-dark',
   inactiveClass: 'background',
   customClass: '',
 });

package/src/layout/ConfigSection.vue

@@ -13,10 +13,10 @@ withDefaults(defineProps<Props>(), {
 
 <template>
   <div
-    class="flex flex-col gap-4 p-4 background rounded-vsk"
+    class="flex flex-col gap-4 p-4 background rounded-corner"
     :class="customClass"
   >
-    <h3 class="text-base font-semibold m-0 text-vsk-primary">
+    <h3 class="text-base font-semibold m-0 text-primary dark:text-primary-dark">
       {{ icon ? `${icon} ${title}` : title }}
     </h3>
     <slot />

package/src/tray/TrayIconButton.vue

@@ -1,6 +1,6 @@
 <template>
   <div
-    class="p-1 rounded-vsk relative hover:bg-vsk-primary/30 group transition-all duration-300"
+    class="p-1 rounded-corner relative hover:bg-primary dark:hover:bg-primary-dark group transition-all duration-300"
     :class="customClass"
     :title="tooltip"
     @click="handleClick"
@@ -17,7 +17,7 @@
     <!-- Badge/Counter -->
     <div
       v-if="badge !== null && badge > 0"
-      class="absolute bottom-1 right-1 bg-vsk-primary text-white text-xs rounded-full w-4 h-4 flex items-center justify-center font-bold animate-bounce"
+      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"
     >
       {{ badge }}
     </div>
@@ -25,7 +25,7 @@
     <!-- Tooltip personalizado -->
     <div 
       v-if="showCustomTooltip && customTooltipText"
-      class="absolute top-1 left-1/2 transform -translate-x-1/2 text-xs font-semibold p-1 rounded-vsk transition-all duration-300 pointer-events-none background"
+      class="absolute top-1 left-1/2 transform -translate-x-1/2 text-xs font-semibold p-1 rounded-corner transition-all duration-300 pointer-events-none background"
       :class="[
         tooltipClass,
         {

package/src/window/TopBar.vue

@@ -1,5 +1,5 @@
 <script lang="ts" setup>
-import { defineProps, ref, Ref, onMounted } from "vue";
+import { ref, Ref, onMounted } from "vue";
 import { getCurrentWindow } from "@tauri-apps/api/window";
 import { getIconSource } from "@vasakgroup/plugin-vicons";
 
@@ -24,11 +24,11 @@ onMounted(async () => {
 <template>
   <div
     data-tauri-drag-region
-    class="flex h-8 px-4 py-1 bg-vsk-primary rounded-t-window justify-between align-center"
+    class="flex h-8 px-4 py-1 bg-primary dark:bg-primary-dark rounded-t-corner-window justify-between align-center"
     ref="bar"
   >
     <div data-tauri-drag-region>
-      <img :src="props.image" data-tauri-drag-region class="h-6 w-auto" />
+      <img :src="props.image" data-tauri-drag-region class="h-6 w-auto" :alt="props.title" />
     </div>
     <div data-tauri-drag-region>{{ props.title }}</div>
     <div data-tauri-drag-region>