@vasakgroup/vue-libvasak 0.3.4 → 0.3.6

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -1,31 +1,31 @@
1
- import { ref as y, onMounted as V, onUnmounted as W, watch as j, defineComponent as g, toRef as D, computed as k, createElementBlock as l, unref as w, openBlock as a, normalizeStyle as F, createCommentVNode as m, createElementVNode as r, createVNode as $, toDisplayString as b, normalizeClass as f, renderSlot as x, createBlock as A, onBeforeUnmount as R, Fragment as S, renderList as L, withCtx as G, mergeModels as U, useAttrs as q, useId as H, useModel as J, withDirectives as K, mergeProps as Q, isRef as X, vModelSelect as Y, withModifiers as Z } from "vue";
2
- import { listen as _ } from "@tauri-apps/api/event";
3
- import { getSymbolSource as ee, getIconSource as B } from "@vasakgroup/plugin-vicons";
4
- import { getCurrentWindow as te } from "@tauri-apps/api/window";
5
- function ae(e, s) {
1
+ import { ref as y, onMounted as V, onUnmounted as U, watch as M, defineComponent as h, toRef as O, computed as k, createElementBlock as l, unref as w, openBlock as a, normalizeStyle as D, createCommentVNode as f, createElementVNode as i, createVNode as B, toDisplayString as g, normalizeClass as b, renderSlot as x, createBlock as T, onBeforeUnmount as q, Fragment as z, renderList as A, withCtx as H, mergeModels as J, useAttrs as K, useId as Q, useModel as X, withDirectives as Y, mergeProps as Z, isRef as _, vModelSelect as ee, withModifiers as te } from "vue";
2
+ import { listen as ae } from "@tauri-apps/api/event";
3
+ import { getSymbolSource as le, getIconSource as S } from "@vasakgroup/plugin-vicons";
4
+ import { getCurrentWindow as ne } from "@tauri-apps/api/window";
5
+ function se(e, s) {
6
6
  const t = y("");
7
- let n = null, i = !1, c = 0;
7
+ let n = null, o = !1, r = 0;
8
8
  async function u() {
9
- const d = ++c, o = e.value;
10
- if (!o) {
9
+ const m = ++r, c = e.value;
10
+ if (!c) {
11
11
  t.value = "";
12
12
  return;
13
13
  }
14
- const h = s.value === "symbol" ? await ee(o) : await B(o);
15
- d === c && (t.value = h);
14
+ const d = s.value === "symbol" ? await le(c) : await S(c);
15
+ m === r && (t.value = d);
16
16
  }
17
17
  return V(async () => {
18
- const d = await _("vicons:theme-changed", u);
19
- if (i) {
20
- d();
18
+ const m = await ae("vicons:theme-changed", u);
19
+ if (o) {
20
+ m();
21
21
  return;
22
22
  }
23
- n = d, await u();
24
- }), W(() => {
25
- i = !0, n?.();
26
- }), j(e, u), t;
23
+ n = m, await u();
24
+ }), U(() => {
25
+ o = !0, n?.();
26
+ }), M(e, u), t;
27
27
  }
28
- const le = ["src", "alt"], C = /* @__PURE__ */ g({
28
+ const oe = ["src", "alt"], $ = /* @__PURE__ */ h({
29
29
  __name: "ThemeIcon",
30
30
  props: {
31
31
  name: {},
@@ -34,23 +34,23 @@ const le = ["src", "alt"], C = /* @__PURE__ */ g({
34
34
  alt: { default: "" }
35
35
  },
36
36
  setup(e) {
37
- const s = e, t = ae(D(s, "name"), D(s, "type")), n = k(() => `${s.size}px`);
38
- return (i, c) => w(t) ? (a(), l("img", {
37
+ const s = e, t = se(O(s, "name"), O(s, "type")), n = k(() => `${s.size}px`);
38
+ return (o, r) => w(t) ? (a(), l("img", {
39
39
  key: 0,
40
40
  src: w(t),
41
41
  alt: e.alt,
42
- style: F({ width: n.value, height: n.value }),
42
+ style: D({ width: n.value, height: n.value }),
43
43
  class: "shrink-0 object-contain"
44
- }, null, 12, le)) : (a(), l("span", {
44
+ }, null, 12, oe)) : (a(), l("span", {
45
45
  key: 1,
46
- style: F({ width: n.value, height: n.value }),
46
+ style: D({ width: n.value, height: n.value }),
47
47
  class: "shrink-0"
48
48
  }, null, 4));
49
49
  }
50
- }), ne = { class: "flex flex-col gap-2" }, se = ["aria-expanded"], oe = {
50
+ }), ie = { class: "flex flex-col gap-2" }, re = ["aria-expanded"], ce = {
51
51
  key: 1,
52
52
  class: "flex flex-col gap-1"
53
- }, O = /* @__PURE__ */ g({
53
+ }, N = /* @__PURE__ */ h({
54
54
  __name: "SideGroup",
55
55
  props: {
56
56
  title: {},
@@ -59,39 +59,39 @@ const le = ["src", "alt"], C = /* @__PURE__ */ g({
59
59
  },
60
60
  setup(e) {
61
61
  const s = e, t = y(s.defaultOpen);
62
- return j(
62
+ return M(
63
63
  () => s.collapsed,
64
64
  (n) => {
65
65
  n && (t.value = !0);
66
66
  }
67
- ), (n, i) => (a(), l("section", ne, [
68
- e.collapsed ? m("", !0) : (a(), l("button", {
67
+ ), (n, o) => (a(), l("section", ie, [
68
+ e.collapsed ? f("", !0) : (a(), l("button", {
69
69
  key: 0,
70
70
  type: "button",
71
71
  class: "group flex w-full items-center justify-between rounded-corner px-2 py-1 text-tx-muted text-xs uppercase tracking-[0.08em] hover:bg-ui-surface/60",
72
72
  "aria-expanded": t.value,
73
- onClick: i[0] || (i[0] = (c) => t.value = !t.value)
73
+ onClick: o[0] || (o[0] = (r) => t.value = !t.value)
74
74
  }, [
75
- r("span", null, b(e.title), 1),
76
- $(C, {
75
+ i("span", null, g(e.title), 1),
76
+ B($, {
77
77
  name: "pan-down-symbolic",
78
78
  type: "symbol",
79
79
  size: 12,
80
- class: f(["transition-transform duration-200", t.value ? "" : "-rotate-90"])
80
+ class: b(["transition-transform duration-200", t.value ? "" : "-rotate-90"])
81
81
  }, null, 8, ["class"])
82
- ], 8, se)),
83
- t.value || e.collapsed ? (a(), l("div", oe, [
82
+ ], 8, re)),
83
+ t.value || e.collapsed ? (a(), l("div", ce, [
84
84
  x(n.$slots, "default")
85
- ])) : m("", !0)
85
+ ])) : f("", !0)
86
86
  ]));
87
87
  }
88
- }), ie = ["title", "aria-label", "disabled", "aria-current"], re = { key: 1 }, ce = {
88
+ }), de = ["title", "aria-label", "disabled", "aria-current"], ue = { key: 1 }, me = {
89
89
  key: 0,
90
90
  class: "min-w-0 flex-1 truncate font-medium"
91
- }, de = {
91
+ }, fe = {
92
92
  key: 1,
93
93
  class: "rounded-corner bg-ui-surface px-2 py-0.5 font-semibold text-tx-muted text-xs"
94
- }, P = /* @__PURE__ */ g({
94
+ }, W = /* @__PURE__ */ h({
95
95
  __name: "SideButton",
96
96
  props: {
97
97
  label: {},
@@ -109,43 +109,43 @@ const le = ["src", "alt"], C = /* @__PURE__ */ g({
109
109
  "aria-label": e.collapsed ? e.label : void 0,
110
110
  disabled: e.disabled,
111
111
  "aria-current": e.active ? "page" : void 0,
112
- class: f(["group relative flex w-full items-center gap-3 rounded-corner border px-3 py-2 text-left text-sm transition-all duration-200", [
112
+ class: b(["group relative flex w-full items-center gap-3 rounded-corner border px-3 py-2 text-left text-sm transition-all duration-200", [
113
113
  e.active ? "border-secondary bg-primary/15 text-tx-main shadow-sm" : "border-transparent bg-transparent hover:border-ui-border hover:bg-ui-surface/70",
114
114
  e.disabled ? "cursor-not-allowed opacity-60" : "cursor-pointer",
115
115
  e.collapsed ? "justify-center px-2" : ""
116
116
  ]]),
117
117
  onClick: t[0] || (t[0] = (n) => s.$emit("click"))
118
118
  }, [
119
- r("span", {
120
- class: f(["flex h-8 w-8 shrink-0 items-center justify-center rounded-corner font-semibold text-xs uppercase tracking-wide", e.active ? "border-secondary bg-primary/20" : ""]),
119
+ i("span", {
120
+ class: b(["flex h-8 w-8 shrink-0 items-center justify-center rounded-corner font-semibold text-xs uppercase tracking-wide", e.active ? "border-secondary bg-primary/20" : ""]),
121
121
  "aria-hidden": "true"
122
122
  }, [
123
- e.icon ? (a(), A(C, {
123
+ e.icon ? (a(), T($, {
124
124
  key: 0,
125
125
  name: e.icon,
126
126
  size: 20
127
- }, null, 8, ["name"])) : (a(), l("span", re, b(e.label.charAt(0).toUpperCase()), 1))
127
+ }, null, 8, ["name"])) : (a(), l("span", ue, g(e.label.charAt(0).toUpperCase()), 1))
128
128
  ], 2),
129
- e.collapsed ? m("", !0) : (a(), l("span", ce, b(e.label), 1)),
130
- !e.collapsed && e.badge !== "" ? (a(), l("span", de, b(e.badge), 1)) : m("", !0)
131
- ], 10, ie));
129
+ e.collapsed ? f("", !0) : (a(), l("span", me, g(e.label), 1)),
130
+ !e.collapsed && e.badge !== "" ? (a(), l("span", fe, g(e.badge), 1)) : f("", !0)
131
+ ], 10, de));
132
132
  }
133
- }), ue = {
133
+ }), be = {
134
134
  key: 0,
135
135
  class: "flex flex-col gap-2 border-ui-border border-b p-2"
136
- }, me = { class: "flex items-center gap-2" }, fe = ["aria-label", "aria-expanded"], be = {
136
+ }, ge = { class: "flex items-center gap-2" }, he = ["aria-label", "aria-expanded"], ve = {
137
137
  key: 0,
138
138
  class: "min-w-0 flex-1"
139
- }, ge = {
139
+ }, ye = {
140
140
  key: 0,
141
141
  class: "truncate font-semibold text-sm"
142
- }, he = {
142
+ }, xe = {
143
143
  key: 1,
144
144
  class: "truncate text-tx-muted text-xs"
145
- }, ve = { key: 0 }, ye = {
145
+ }, pe = { key: 0 }, ke = {
146
146
  key: 1,
147
147
  class: "flex border-ui-border border-b p-2"
148
- }, xe = ["aria-label", "aria-expanded"], pe = { class: "flex min-h-0 flex-1 flex-col gap-3 overflow-y-auto p-2" }, E = "hidden h-8 w-8 shrink-0 items-center justify-center rounded-corner border border-ui-border bg-ui-surface/70 transition-colors hover:bg-ui-surface md:inline-flex", ke = /* @__PURE__ */ g({
148
+ }, we = ["aria-label", "aria-expanded"], Ce = { class: "flex min-h-0 flex-1 flex-col gap-3 overflow-y-auto p-2" }, F = "hidden h-8 w-8 shrink-0 items-center justify-center rounded-corner border border-ui-border bg-ui-surface/70 transition-colors hover:bg-ui-surface md:inline-flex", P = 767, $e = /* @__PURE__ */ h({
149
149
  __name: "SideBar",
150
150
  props: {
151
151
  title: { default: "" },
@@ -158,95 +158,100 @@ const le = ["src", "alt"], C = /* @__PURE__ */ g({
158
158
  },
159
159
  emits: ["update:modelValue", "update:collapsed", "change"],
160
160
  setup(e, { expose: s, emit: t }) {
161
- const n = e, i = t, c = y(n.collapsed ?? !1), u = y(!1);
162
- let d = null;
163
- const o = k(() => u.value || c.value), h = k(() => !!(n.title || n.subtitle));
161
+ const n = e, o = t, r = y(n.collapsed ?? !1), u = y(!1);
162
+ let m = null, c = null;
163
+ const d = k(() => u.value || r.value), j = k(() => !!(n.title || n.subtitle));
164
164
  k(() => n.categories.length > 0);
165
- function I() {
166
- u.value = d?.matches ?? !1;
165
+ function R() {
166
+ return document.documentElement?.clientWidth || window.innerWidth;
167
167
  }
168
- function M() {
169
- c.value = !c.value, i("update:collapsed", c.value);
168
+ function C() {
169
+ u.value = R() <= P;
170
170
  }
171
- function N(v) {
172
- i("update:modelValue", v), i("change", v);
171
+ function E() {
172
+ r.value = !r.value, o("update:collapsed", r.value);
173
173
  }
174
- return j(
174
+ function G(v) {
175
+ o("update:modelValue", v), o("change", v);
176
+ }
177
+ return M(
175
178
  () => n.collapsed,
176
179
  (v) => {
177
- v !== void 0 && (c.value = v);
180
+ v !== void 0 && (r.value = v);
178
181
  }
179
182
  ), V(() => {
180
- d = window.matchMedia("(max-width: 767px)"), I(), d.addEventListener("change", I);
181
- }), R(() => d?.removeEventListener("change", I)), s({ collapsed: o }), (v, wt) => (a(), l("aside", {
182
- class: f(["relative z-30 flex h-full shrink-0 flex-col rounded-corner border border-ui-border bg-ui-surface/70 transition-all duration-300", ["w-[84px]", o.value ? "md:w-[84px]" : "md:w-72"]])
183
+ m = window.matchMedia(`(max-width: ${P}px)`), C(), m.addEventListener("change", C), window.addEventListener("resize", C), typeof ResizeObserver < "u" && document.documentElement && (c = new ResizeObserver(C), c.observe(document.documentElement));
184
+ }), q(() => {
185
+ m?.removeEventListener("change", C), window.removeEventListener("resize", C), c?.disconnect(), c = null;
186
+ }), s({ collapsed: d }), (v, Bt) => (a(), l("aside", {
187
+ class: b(["relative z-30 flex h-full shrink-0 flex-col rounded-corner border border-ui-border bg-ui-surface/70 transition-all duration-300", ["w-[84px]", d.value ? "md:w-[84px]" : "md:w-72"]])
183
188
  }, [
184
- h.value || v.$slots.header ? (a(), l("header", ue, [
185
- r("div", me, [
186
- r("button", {
189
+ j.value || v.$slots.header ? (a(), l("header", be, [
190
+ i("div", ge, [
191
+ i("button", {
187
192
  type: "button",
188
- class: f(E),
189
- "aria-label": o.value ? e.expandLabel : e.collapseLabel,
190
- "aria-expanded": !o.value,
191
- onClick: M
193
+ class: b(F),
194
+ "aria-label": d.value ? e.expandLabel : e.collapseLabel,
195
+ "aria-expanded": !d.value,
196
+ onClick: E
192
197
  }, [
193
- $(C, {
194
- name: o.value ? "pan-end-symbolic" : "pan-start-symbolic",
198
+ B($, {
199
+ name: d.value ? "pan-end-symbolic" : "pan-start-symbolic",
195
200
  type: "symbol",
196
201
  size: 16
197
202
  }, null, 8, ["name"])
198
- ], 8, fe),
199
- h.value && !o.value ? (a(), l("div", be, [
200
- e.title ? (a(), l("p", ge, b(e.title), 1)) : m("", !0),
201
- e.subtitle ? (a(), l("p", he, b(e.subtitle), 1)) : m("", !0)
202
- ])) : m("", !0)
203
+ ], 8, he),
204
+ j.value && !d.value ? (a(), l("div", ve, [
205
+ e.title ? (a(), l("p", ye, g(e.title), 1)) : f("", !0),
206
+ e.subtitle ? (a(), l("p", xe, g(e.subtitle), 1)) : f("", !0)
207
+ ])) : f("", !0)
203
208
  ]),
204
- v.$slots.header && !o.value ? (a(), l("div", ve, [
205
- x(v.$slots, "header", { collapsed: o.value })
206
- ])) : m("", !0)
207
- ])) : (a(), l("div", ye, [
208
- r("button", {
209
+ v.$slots.header && !d.value ? (a(), l("div", pe, [
210
+ x(v.$slots, "header", { collapsed: d.value })
211
+ ])) : f("", !0)
212
+ ])) : (a(), l("div", ke, [
213
+ i("button", {
209
214
  type: "button",
210
- class: f(E),
211
- "aria-label": o.value ? e.expandLabel : e.collapseLabel,
212
- "aria-expanded": !o.value,
213
- onClick: M
215
+ class: b(F),
216
+ "aria-label": d.value ? e.expandLabel : e.collapseLabel,
217
+ "aria-expanded": !d.value,
218
+ onClick: E
214
219
  }, [
215
- $(C, {
216
- name: o.value ? "pan-end-symbolic" : "pan-start-symbolic",
220
+ B($, {
221
+ name: d.value ? "pan-end-symbolic" : "pan-start-symbolic",
217
222
  type: "symbol",
218
223
  size: 16
219
224
  }, null, 8, ["name"])
220
- ], 8, xe)
225
+ ], 8, we)
221
226
  ])),
222
- r("div", pe, [
223
- (a(!0), l(S, null, L(e.categories, (T) => (a(), A(O, {
224
- key: T.id,
225
- title: T.title,
226
- collapsed: o.value
227
+ i("div", Ce, [
228
+ (a(!0), l(z, null, A(e.categories, (L) => (a(), T(N, {
229
+ key: L.id,
230
+ title: L.title,
231
+ collapsed: d.value
227
232
  }, {
228
- default: G(() => [
229
- (a(!0), l(S, null, L(T.items, (p) => (a(), A(P, {
233
+ default: H(() => [
234
+ (a(!0), l(z, null, A(L.items, (p) => (a(), T(W, {
230
235
  key: p.id,
231
236
  label: p.label,
232
237
  icon: p.icon,
233
238
  badge: p.badge,
234
239
  disabled: p.disabled,
235
- collapsed: o.value,
240
+ collapsed: d.value,
236
241
  active: e.modelValue === p.id,
237
- onClick: (Ct) => N(p.id)
242
+ onClick: (St) => G(p.id)
238
243
  }, null, 8, ["label", "icon", "badge", "disabled", "collapsed", "active", "onClick"]))), 128))
239
244
  ]),
240
245
  _: 2
241
246
  }, 1032, ["title", "collapsed"]))), 128)),
242
- x(v.$slots, "default", { collapsed: o.value })
247
+ x(v.$slots, "default", { collapsed: d.value })
243
248
  ])
244
249
  ], 2));
245
250
  }
246
- }), we = { class: "flex min-w-0 flex-col gap-1" }, Ce = ["for"], $e = { class: "relative flex min-w-0 items-center" }, Be = ["id"], Se = /* @__PURE__ */ g({
251
+ }), Be = { class: "flex min-w-0 flex-col gap-1" }, Se = ["for"], ze = { class: "relative flex min-w-0 items-center" }, Ie = ["id"], Le = /* @__PURE__ */ h({
247
252
  inheritAttrs: !1,
248
253
  __name: "SelectField",
249
- props: /* @__PURE__ */ U({
254
+ props: /* @__PURE__ */ J({
250
255
  label: {}
251
256
  }, {
252
257
  modelValue: {
@@ -256,28 +261,28 @@ const le = ["src", "alt"], C = /* @__PURE__ */ g({
256
261
  }),
257
262
  emits: ["update:modelValue"],
258
263
  setup(e) {
259
- const s = e, t = q(), n = H(), i = k(() => t.id ?? n), [c, u] = J(e, "modelValue", {
260
- set(d) {
261
- return u.number ? Number(d) : d;
264
+ const s = e, t = K(), n = Q(), o = k(() => t.id ?? n), [r, u] = X(e, "modelValue", {
265
+ set(m) {
266
+ return u.number ? Number(m) : m;
262
267
  }
263
268
  });
264
- return (d, o) => (a(), l("div", we, [
269
+ return (m, c) => (a(), l("div", Be, [
265
270
  s.label ? (a(), l("label", {
266
271
  key: 0,
267
- for: i.value,
272
+ for: o.value,
268
273
  class: "text-tx-muted text-xs"
269
- }, b(s.label), 9, Ce)) : m("", !0),
270
- r("div", $e, [
271
- K(r("select", Q({
272
- id: i.value,
273
- "onUpdate:modelValue": o[0] || (o[0] = (h) => X(c) ? c.value = h : null),
274
+ }, g(s.label), 9, Se)) : f("", !0),
275
+ i("div", ze, [
276
+ Y(i("select", Z({
277
+ id: o.value,
278
+ "onUpdate:modelValue": c[0] || (c[0] = (d) => _(r) ? r.value = d : null),
274
279
  class: "min-w-0 flex-1 appearance-none truncate rounded-corner border border-ui-border bg-ui-surface/60 py-1.5 pr-8 pl-2 text-sm text-tx-main"
275
280
  }, w(t)), [
276
- x(d.$slots, "default")
277
- ], 16, Be), [
278
- [Y, w(c)]
281
+ x(m.$slots, "default")
282
+ ], 16, Ie), [
283
+ [ee, w(r)]
279
284
  ]),
280
- $(C, {
285
+ B($, {
281
286
  name: "pan-down-symbolic",
282
287
  type: "symbol",
283
288
  size: 14,
@@ -286,66 +291,66 @@ const le = ["src", "alt"], C = /* @__PURE__ */ g({
286
291
  ])
287
292
  ]));
288
293
  }
289
- }), ze = { "data-tauri-drag-region": "" }, Ie = ["src", "alt"], Te = { "data-tauri-drag-region": "" }, Ae = { "data-tauri-drag-region": "" }, Le = ["src"], Ve = ["src"], je = ["src"], Me = /* @__PURE__ */ g({
294
+ }), Te = { "data-tauri-drag-region": "" }, Ae = ["src", "alt"], Ve = { "data-tauri-drag-region": "" }, Me = { "data-tauri-drag-region": "" }, je = ["src"], Ee = ["src"], Oe = ["src"], De = /* @__PURE__ */ h({
290
295
  __name: "TopBar",
291
296
  props: {
292
297
  title: String,
293
298
  image: String
294
299
  },
295
300
  setup(e) {
296
- const s = y(null), t = te(), n = y(""), i = y(""), c = y(""), u = e;
301
+ const s = y(null), t = ne(), n = y(""), o = y(""), r = y(""), u = e;
297
302
  return V(async () => {
298
- n.value = await B("window-close"), i.value = await B("window-minimize"), c.value = await B("window-maximize");
299
- }), (d, o) => (a(), l("div", {
303
+ n.value = await S("window-close"), o.value = await S("window-minimize"), r.value = await S("window-maximize");
304
+ }), (m, c) => (a(), l("div", {
300
305
  "data-tauri-drag-region": "",
301
306
  class: "flex h-8 px-4 py-1 bg-primary dark:bg-primary-dark rounded-t-corner-window justify-between align-center",
302
307
  ref_key: "bar",
303
308
  ref: s
304
309
  }, [
305
- r("div", ze, [
306
- r("img", {
310
+ i("div", Te, [
311
+ i("img", {
307
312
  src: u.image,
308
313
  "data-tauri-drag-region": "",
309
314
  class: "h-6 w-auto",
310
315
  alt: u.title
311
- }, null, 8, Ie)
316
+ }, null, 8, Ae)
312
317
  ]),
313
- r("div", Te, b(u.title), 1),
314
- r("div", Ae, [
315
- r("span", {
318
+ i("div", Ve, g(u.title), 1),
319
+ i("div", Me, [
320
+ i("span", {
316
321
  class: "win-button",
317
- onClick: o[0] || (o[0] = (h) => w(t).minimize())
322
+ onClick: c[0] || (c[0] = (d) => w(t).minimize())
318
323
  }, [
319
- r("img", {
320
- src: i.value,
324
+ i("img", {
325
+ src: o.value,
321
326
  class: "h-6 w-6 inline-block",
322
327
  alt: "Minimize"
323
- }, null, 8, Le)
328
+ }, null, 8, je)
324
329
  ]),
325
- r("span", {
330
+ i("span", {
326
331
  class: "win-button",
327
- onClick: o[1] || (o[1] = (h) => w(t).toggleMaximize())
332
+ onClick: c[1] || (c[1] = (d) => w(t).toggleMaximize())
328
333
  }, [
329
- r("img", {
330
- src: c.value,
334
+ i("img", {
335
+ src: r.value,
331
336
  class: "h-6 w-6 inline-block",
332
337
  alt: "Maximize"
333
- }, null, 8, Ve)
338
+ }, null, 8, Ee)
334
339
  ]),
335
- r("span", {
340
+ i("span", {
336
341
  class: "win-button",
337
- onClick: o[2] || (o[2] = (h) => w(t).close())
342
+ onClick: c[2] || (c[2] = (d) => w(t).close())
338
343
  }, [
339
- r("img", {
344
+ i("img", {
340
345
  src: n.value,
341
346
  class: "h-6 w-6 inline-block",
342
347
  alt: "Close"
343
- }, null, 8, je)
348
+ }, null, 8, Oe)
344
349
  ])
345
350
  ])
346
351
  ], 512));
347
352
  }
348
- }), De = /* @__PURE__ */ g({
353
+ }), Fe = /* @__PURE__ */ h({
349
354
  __name: "WindowFrame",
350
355
  props: {
351
356
  title: { default: "Vasak" },
@@ -353,18 +358,18 @@ const le = ["src", "alt"], C = /* @__PURE__ */ g({
353
358
  },
354
359
  setup(e) {
355
360
  const s = e;
356
- return (t, n) => (a(), l(S, null, [
357
- $(Me, {
361
+ return (t, n) => (a(), l(z, null, [
362
+ B(De, {
358
363
  title: s.title,
359
364
  image: s.image
360
365
  }, null, 8, ["title", "image"]),
361
366
  x(t.$slots, "default")
362
367
  ], 64));
363
368
  }
364
- }), Fe = ["type", "disabled"], Ee = {
369
+ }), Pe = ["type", "disabled"], Ne = {
365
370
  key: 0,
366
371
  class: "w-4 h-4 animate-spin rounded-full border-2 border-current border-t-transparent"
367
- }, Oe = ["src", "alt"], Pe = { key: 2 }, Ne = ["src", "alt"], We = /* @__PURE__ */ g({
372
+ }, We = ["src", "alt"], Re = { key: 2 }, Ge = ["src", "alt"], Ue = /* @__PURE__ */ h({
368
373
  __name: "ActionButton",
369
374
  props: {
370
375
  label: {},
@@ -383,51 +388,51 @@ const le = ["src", "alt"], C = /* @__PURE__ */ g({
383
388
  },
384
389
  emits: ["click"],
385
390
  setup(e, { emit: s }) {
386
- const t = e, n = s, i = {
391
+ const t = e, n = s, o = {
387
392
  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",
388
393
  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",
389
394
  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"
390
- }, c = {
395
+ }, r = {
391
396
  sm: "px-2 py-1 text-xs",
392
397
  md: "px-3 py-1 text-sm",
393
398
  lg: "px-4 py-2 text-base"
394
- }, u = (d) => {
395
- t.stopPropagation && d.stopPropagation(), t.preventDefault && d.preventDefault(), !t.disabled && !t.loading && n("click");
399
+ }, u = (m) => {
400
+ t.stopPropagation && m.stopPropagation(), t.preventDefault && m.preventDefault(), !t.disabled && !t.loading && n("click");
396
401
  };
397
- return (d, o) => (a(), l("button", {
402
+ return (m, c) => (a(), l("button", {
398
403
  type: t.type,
399
404
  onClick: u,
400
- class: f(["rounded-corner transition-all duration-200 disabled:opacity-50 disabled:cursor-not-allowed flex items-center justify-center gap-2", [
401
- i[t.variant],
402
- c[t.size],
405
+ class: b(["rounded-corner transition-all duration-200 disabled:opacity-50 disabled:cursor-not-allowed flex items-center justify-center gap-2", [
406
+ o[t.variant],
407
+ r[t.size],
403
408
  t.fullWidth ? "w-full" : "",
404
409
  t.iconSrc && !t.label ? "px-2 py-2" : "",
405
410
  e.customClass
406
411
  ]]),
407
412
  disabled: t.disabled || t.loading
408
413
  }, [
409
- e.loading ? (a(), l("span", Ee)) : m("", !0),
414
+ e.loading ? (a(), l("span", Ne)) : f("", !0),
410
415
  t.iconSrc && !t.iconRight ? (a(), l("img", {
411
416
  key: 1,
412
417
  src: t.iconSrc,
413
418
  alt: t.iconAlt || t.label,
414
419
  class: "w-4 h-4"
415
- }, null, 8, Oe)) : m("", !0),
416
- t.label ? (a(), l("span", Pe, b(t.label), 1)) : m("", !0),
420
+ }, null, 8, We)) : f("", !0),
421
+ t.label ? (a(), l("span", Re, g(t.label), 1)) : f("", !0),
417
422
  t.iconSrc && t.iconRight ? (a(), l("img", {
418
423
  key: 3,
419
424
  src: t.iconSrc,
420
425
  alt: t.iconAlt || t.label,
421
426
  class: "w-4 h-4"
422
- }, null, 8, Ne)) : m("", !0)
423
- ], 10, Fe));
427
+ }, null, 8, Ge)) : f("", !0)
428
+ ], 10, Pe));
424
429
  }
425
- }), z = (e, s) => {
430
+ }), I = (e, s) => {
426
431
  const t = e.__vccOpts || e;
427
- for (const [n, i] of s)
428
- t[n] = i;
432
+ for (const [n, o] of s)
433
+ t[n] = o;
429
434
  return t;
430
- }, Re = /* @__PURE__ */ z(We, [["__scopeId", "data-v-2eaf6e27"]]), Ge = { class: "text-base font-semibold m-0 text-primary dark:text-primary-dark" }, Ue = /* @__PURE__ */ g({
435
+ }, qe = /* @__PURE__ */ I(Ue, [["__scopeId", "data-v-2eaf6e27"]]), He = { class: "text-base font-semibold m-0 text-primary dark:text-primary-dark" }, Je = /* @__PURE__ */ h({
431
436
  __name: "ConfigSection",
432
437
  props: {
433
438
  title: {},
@@ -436,25 +441,25 @@ const le = ["src", "alt"], C = /* @__PURE__ */ g({
436
441
  },
437
442
  setup(e) {
438
443
  return (s, t) => (a(), l("div", {
439
- class: f(["flex flex-col gap-4 p-4 background rounded-corner", e.customClass])
444
+ class: b(["flex flex-col gap-4 p-4 background rounded-corner", e.customClass])
440
445
  }, [
441
- r("h3", Ge, b(e.icon ? `${e.icon} ${e.title}` : e.title), 1),
446
+ i("h3", He, g(e.icon ? `${e.icon} ${e.title}` : e.title), 1),
442
447
  x(s.$slots, "default", {}, void 0, !0)
443
448
  ], 2));
444
449
  }
445
- }), qe = /* @__PURE__ */ z(Ue, [["__scopeId", "data-v-45bd4eab"]]), He = { class: "flex items-center gap-3 flex-1 min-w-0" }, Je = ["src", "alt"], Ke = { class: "min-w-0" }, Qe = { class: "font-semibold truncate" }, Xe = {
450
+ }), Ke = /* @__PURE__ */ I(Je, [["__scopeId", "data-v-45bd4eab"]]), Qe = { class: "flex items-center gap-3 flex-1 min-w-0" }, Xe = ["src", "alt"], Ye = { class: "min-w-0" }, Ze = { class: "font-semibold truncate" }, _e = {
446
451
  key: 0,
447
452
  class: "text-xs text-gray-400 truncate"
448
- }, Ye = {
453
+ }, et = {
449
454
  key: 1,
450
455
  class: "text-xs text-gray-400 truncate"
451
- }, Ze = {
456
+ }, tt = {
452
457
  key: 2,
453
458
  class: "text-xs text-gray-400 flex gap-2 mt-1"
454
- }, _e = {
459
+ }, at = {
455
460
  key: 1,
456
461
  class: "w-2 h-2 rounded-full bg-green-500"
457
- }, et = /* @__PURE__ */ g({
462
+ }, lt = /* @__PURE__ */ h({
458
463
  __name: "DeviceCard",
459
464
  props: {
460
465
  icon: {},
@@ -473,37 +478,37 @@ const le = ["src", "alt"], C = /* @__PURE__ */ g({
473
478
  setup(e, { emit: s }) {
474
479
  const t = s, n = () => {
475
480
  t("action");
476
- }, i = () => {
481
+ }, o = () => {
477
482
  t("click");
478
483
  };
479
- return (c, u) => (a(), l("div", {
480
- class: f(["flex items-center justify-between background rounded-vsk px-6 py-3 mb-4", [{ "border-l-4 border-green-500": e.isConnected }, e.customClass]]),
481
- onClick: i
484
+ return (r, u) => (a(), l("div", {
485
+ class: b(["flex items-center justify-between background rounded-vsk px-6 py-3 mb-4", [{ "border-l-4 border-green-500": e.isConnected }, e.customClass]]),
486
+ onClick: o
482
487
  }, [
483
- r("div", He, [
484
- r("img", {
488
+ i("div", Qe, [
489
+ i("img", {
485
490
  src: e.icon,
486
491
  alt: e.title,
487
492
  class: "h-7 w-7 shrink-0"
488
- }, null, 8, Je),
489
- r("div", Ke, [
490
- r("div", Qe, b(e.title), 1),
491
- e.subtitle ? (a(), l("div", Xe, b(e.subtitle), 1)) : m("", !0),
492
- e.metadata ? (a(), l("div", Ye, b(e.metadata), 1)) : m("", !0),
493
- e.extraInfo && e.extraInfo.length > 0 ? (a(), l("div", Ze, [
494
- (a(!0), l(S, null, L(e.extraInfo, (d, o) => (a(), l("span", { key: o }, b(d), 1))), 128))
495
- ])) : m("", !0)
493
+ }, null, 8, Xe),
494
+ i("div", Ye, [
495
+ i("div", Ze, g(e.title), 1),
496
+ e.subtitle ? (a(), l("div", _e, g(e.subtitle), 1)) : f("", !0),
497
+ e.metadata ? (a(), l("div", et, g(e.metadata), 1)) : f("", !0),
498
+ e.extraInfo && e.extraInfo.length > 0 ? (a(), l("div", tt, [
499
+ (a(!0), l(z, null, A(e.extraInfo, (m, c) => (a(), l("span", { key: c }, g(m), 1))), 128))
500
+ ])) : f("", !0)
496
501
  ])
497
502
  ]),
498
503
  e.showActionButton ? (a(), l("button", {
499
504
  key: 0,
500
505
  class: "bg-vsk-primary rounded-vsk px-4 py-2 text-sm font-semibold cursor-pointer hover:opacity-70",
501
- onClick: Z(n, ["stop"])
502
- }, b(e.actionLabel), 1)) : m("", !0),
503
- e.showStatusIndicator && e.isConnected ? (a(), l("div", _e)) : m("", !0)
506
+ onClick: te(n, ["stop"])
507
+ }, g(e.actionLabel), 1)) : f("", !0),
508
+ e.showStatusIndicator && e.isConnected ? (a(), l("div", at)) : f("", !0)
504
509
  ], 2));
505
510
  }
506
- }), tt = ["for"], at = /* @__PURE__ */ g({
511
+ }), nt = ["for"], st = /* @__PURE__ */ h({
507
512
  __name: "FormGroup",
508
513
  props: {
509
514
  label: {},
@@ -513,17 +518,17 @@ const le = ["src", "alt"], C = /* @__PURE__ */ g({
513
518
  },
514
519
  setup(e) {
515
520
  return (s, t) => (a(), l("div", {
516
- class: f(["flex flex-col gap-2", e.customClass])
521
+ class: b(["flex flex-col gap-2", e.customClass])
517
522
  }, [
518
523
  e.label ? (a(), l("label", {
519
524
  key: 0,
520
525
  for: e.htmlFor,
521
- class: f(["text-sm font-medium text-primary dark:text-primary-dark", e.labelClass])
522
- }, b(e.label), 11, tt)) : m("", !0),
526
+ class: b(["text-sm font-medium text-primary dark:text-primary-dark", e.labelClass])
527
+ }, g(e.label), 11, nt)) : f("", !0),
523
528
  x(s.$slots, "default", {}, void 0, !0)
524
529
  ], 2));
525
530
  }
526
- }), lt = /* @__PURE__ */ z(at, [["__scopeId", "data-v-c0d9d9cb"]]), nt = /* @__PURE__ */ g({
531
+ }), ot = /* @__PURE__ */ I(st, [["__scopeId", "data-v-c0d9d9cb"]]), it = /* @__PURE__ */ h({
527
532
  __name: "ListCard",
528
533
  props: {
529
534
  clickable: { type: Boolean, default: !1 },
@@ -531,26 +536,26 @@ const le = ["src", "alt"], C = /* @__PURE__ */ g({
531
536
  },
532
537
  emits: ["click"],
533
538
  setup(e, { emit: s }) {
534
- const t = e, n = s, i = () => {
539
+ const t = e, n = s, o = () => {
535
540
  t.clickable && n("click");
536
541
  };
537
- return (c, u) => (a(), l("div", {
538
- class: f([
542
+ return (r, u) => (a(), l("div", {
543
+ class: b([
539
544
  "flex items-center justify-between background p-3 rounded-vsk border border-vsk-primary/70 transition-colors duration-200",
540
545
  {
541
546
  "hover:bg-vsk-primary/5 cursor-pointer": t.clickable
542
547
  },
543
548
  e.customClass
544
549
  ]),
545
- onClick: i
550
+ onClick: o
546
551
  }, [
547
- x(c.$slots, "default", {}, void 0, !0)
552
+ x(r.$slots, "default", {}, void 0, !0)
548
553
  ], 2));
549
554
  }
550
- }), st = /* @__PURE__ */ z(nt, [["__scopeId", "data-v-f86d47da"]]), ot = { 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" }, it = ["src", "alt", "title"], rt = {
555
+ }), rt = /* @__PURE__ */ I(it, [["__scopeId", "data-v-f86d47da"]]), ct = { 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" }, dt = ["src", "alt", "title"], ut = {
551
556
  key: 1,
552
557
  class: "w-8 h-8 flex items-center justify-center"
553
- }, ct = ["src", "alt"], dt = ["min", "max", "value"], ut = /* @__PURE__ */ g({
558
+ }, mt = ["src", "alt"], ft = ["min", "max", "value"], bt = /* @__PURE__ */ h({
554
559
  __name: "SliderControl",
555
560
  props: {
556
561
  icon: {},
@@ -565,49 +570,49 @@ const le = ["src", "alt"], C = /* @__PURE__ */ g({
565
570
  },
566
571
  emits: ["update:modelValue", "buttonClick"],
567
572
  setup(e, { emit: s }) {
568
- const t = e, n = s, i = k(() => {
573
+ const t = e, n = s, o = k(() => {
569
574
  if (t.max <= t.min) return 0;
570
- const o = t.max - t.min, h = t.modelValue - t.min;
571
- return Math.round(h / o * 100);
572
- }), c = k(() => t.getPercentageClass ? t.getPercentageClass(i.value) : ""), u = (o) => {
573
- const h = o.target;
574
- n("update:modelValue", Number(h.value));
575
- }, d = () => {
575
+ const c = t.max - t.min, d = t.modelValue - t.min;
576
+ return Math.round(d / c * 100);
577
+ }), r = k(() => t.getPercentageClass ? t.getPercentageClass(o.value) : ""), u = (c) => {
578
+ const d = c.target;
579
+ n("update:modelValue", Number(d.value));
580
+ }, m = () => {
576
581
  n("buttonClick");
577
582
  };
578
- return (o, h) => (a(), l("div", ot, [
583
+ return (c, d) => (a(), l("div", ct, [
579
584
  e.showButton ? (a(), l("button", {
580
585
  key: 0,
581
- onClick: d,
586
+ onClick: m,
582
587
  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"
583
588
  }, [
584
- r("img", {
589
+ i("img", {
585
590
  src: e.icon,
586
591
  alt: e.alt,
587
592
  title: e.tooltip,
588
- class: f(["w-6 h-6 transition-all duration-200", e.iconClass])
589
- }, null, 10, it)
590
- ])) : (a(), l("div", rt, [
591
- r("img", {
593
+ class: b(["w-6 h-6 transition-all duration-200", e.iconClass])
594
+ }, null, 10, dt)
595
+ ])) : (a(), l("div", ut, [
596
+ i("img", {
592
597
  src: e.icon,
593
598
  alt: e.alt,
594
599
  class: "w-6 h-6 transition-all duration-200"
595
- }, null, 8, ct)
600
+ }, null, 8, mt)
596
601
  ])),
597
- r("input", {
602
+ i("input", {
598
603
  type: "range",
599
604
  min: e.min,
600
605
  max: e.max,
601
606
  value: e.modelValue,
602
607
  onInput: u,
603
608
  class: "flex-1 transition-all duration-200 hover:scale-105"
604
- }, null, 40, dt),
605
- r("span", {
606
- class: f(["w-12 text-right transition-all duration-200 font-medium", c.value])
607
- }, b(i.value) + "% ", 3)
609
+ }, null, 40, ft),
610
+ i("span", {
611
+ class: b(["w-12 text-right transition-all duration-200 font-medium", r.value])
612
+ }, g(o.value) + "% ", 3)
608
613
  ]));
609
614
  }
610
- }), mt = ["disabled"], ft = /* @__PURE__ */ g({
615
+ }), gt = ["disabled"], ht = /* @__PURE__ */ h({
611
616
  __name: "SwitchToggle",
612
617
  props: {
613
618
  isOn: { type: Boolean },
@@ -619,14 +624,14 @@ const le = ["src", "alt"], C = /* @__PURE__ */ g({
619
624
  },
620
625
  emits: ["toggle"],
621
626
  setup(e, { emit: s }) {
622
- const t = e, n = s, i = () => {
627
+ const t = e, n = s, o = () => {
623
628
  n("toggle", !t.isOn);
624
629
  };
625
- return (c, u) => (a(), l("button", {
630
+ return (r, u) => (a(), l("button", {
626
631
  type: "button",
627
- onClick: i,
632
+ onClick: o,
628
633
  disabled: e.disabled,
629
- class: f([
634
+ class: b([
630
635
  "relative inline-flex items-center rounded-full transition-colors",
631
636
  e.size === "small" ? "h-6 w-11" : "h-7 w-12",
632
637
  e.isOn ? e.activeClass : e.inactiveClass,
@@ -634,16 +639,16 @@ const le = ["src", "alt"], C = /* @__PURE__ */ g({
634
639
  e.customClass
635
640
  ])
636
641
  }, [
637
- r("span", {
638
- class: f([
642
+ i("span", {
643
+ class: b([
639
644
  "inline-block transform rounded-full bg-white shadow transition-transform",
640
645
  e.size === "small" ? "h-4 w-4" : "h-6 w-6",
641
646
  e.isOn ? e.size === "small" ? "translate-x-6" : "translate-x-5" : "translate-x-1"
642
647
  ])
643
648
  }, null, 2)
644
- ], 10, mt));
649
+ ], 10, gt));
645
650
  }
646
- }), bt = ["disabled"], gt = ["src", "alt", "title"], ht = /* @__PURE__ */ g({
651
+ }), vt = ["disabled"], yt = ["src", "alt", "title"], xt = /* @__PURE__ */ h({
647
652
  __name: "ToggleControl",
648
653
  props: {
649
654
  icon: {},
@@ -659,9 +664,9 @@ const le = ["src", "alt"], C = /* @__PURE__ */ g({
659
664
  const t = s, n = () => {
660
665
  t("click");
661
666
  };
662
- return (i, c) => (a(), l("button", {
667
+ return (o, r) => (a(), l("button", {
663
668
  onClick: n,
664
- class: f(["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", {
669
+ class: b(["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", {
665
670
  "animate-pulse": e.isLoading,
666
671
  "ring-2 ring-primary dark:ring-primary-dark": e.isActive,
667
672
  "opacity-60": !e.isActive,
@@ -669,23 +674,23 @@ const le = ["src", "alt"], C = /* @__PURE__ */ g({
669
674
  }]),
670
675
  disabled: e.isLoading
671
676
  }, [
672
- r("img", {
677
+ i("img", {
673
678
  src: e.icon,
674
679
  alt: e.alt,
675
680
  title: e.tooltip,
676
- class: f(["m-auto w-12.5 h-12.5 transition-all duration-300 group-hover:scale-110 relative z-10", {
681
+ class: b(["m-auto w-12.5 h-12.5 transition-all duration-300 group-hover:scale-110 relative z-10", {
677
682
  "animate-spin": e.isLoading,
678
683
  "filter brightness-75": !e.isActive,
679
684
  "drop-shadow-lg": e.isActive,
680
685
  ...e.iconClass
681
686
  }])
682
- }, null, 10, gt)
683
- ], 10, bt));
687
+ }, null, 10, yt)
688
+ ], 10, vt));
684
689
  }
685
- }), vt = ["title"], yt = ["src", "alt"], xt = {
690
+ }), pt = ["title"], kt = ["src", "alt"], wt = {
686
691
  key: 0,
687
692
  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"
688
- }, pt = /* @__PURE__ */ g({
693
+ }, Ct = /* @__PURE__ */ h({
689
694
  __name: "TrayIconButton",
690
695
  props: {
691
696
  icon: {},
@@ -700,73 +705,73 @@ const le = ["src", "alt"], C = /* @__PURE__ */ g({
700
705
  },
701
706
  emits: ["click"],
702
707
  setup(e, { emit: s }) {
703
- const t = s, n = y(!1), i = () => {
708
+ const t = s, n = y(!1), o = () => {
704
709
  t("click");
705
710
  };
706
- return (c, u) => (a(), l("div", {
707
- class: f(["p-1 rounded-corner relative hover:bg-primary dark:hover:bg-primary-dark group transition-all duration-300", e.customClass]),
711
+ return (r, u) => (a(), l("div", {
712
+ class: b(["p-1 rounded-corner relative hover:bg-primary dark:hover:bg-primary-dark group transition-all duration-300", e.customClass]),
708
713
  title: e.tooltip,
709
- onClick: i,
710
- onMouseenter: u[0] || (u[0] = (d) => n.value = !0),
711
- onMouseleave: u[1] || (u[1] = (d) => n.value = !1)
714
+ onClick: o,
715
+ onMouseenter: u[0] || (u[0] = (m) => n.value = !0),
716
+ onMouseleave: u[1] || (u[1] = (m) => n.value = !1)
712
717
  }, [
713
- r("img", {
718
+ i("img", {
714
719
  src: e.icon,
715
720
  alt: e.alt,
716
- class: f(["m-auto h-5.5 w-auto transition-all duration-300", e.iconClass])
717
- }, null, 10, yt),
718
- e.badge !== null && e.badge > 0 ? (a(), l("div", xt, b(e.badge), 1)) : m("", !0),
721
+ class: b(["m-auto h-5.5 w-auto transition-all duration-300", e.iconClass])
722
+ }, null, 10, kt),
723
+ e.badge !== null && e.badge > 0 ? (a(), l("div", wt, g(e.badge), 1)) : f("", !0),
719
724
  e.showCustomTooltip && e.customTooltipText ? (a(), l("div", {
720
725
  key: 1,
721
- class: f(["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", [
726
+ class: b(["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", [
722
727
  e.tooltipClass,
723
728
  {
724
729
  "opacity-0 -translate-y-2": !n.value,
725
730
  "opacity-100 translate-y-0": n.value
726
731
  }
727
732
  ]])
728
- }, b(e.customTooltipText), 3)) : m("", !0),
729
- x(c.$slots, "default")
730
- ], 42, vt));
733
+ }, g(e.customTooltipText), 3)) : f("", !0),
734
+ x(r.$slots, "default")
735
+ ], 42, pt));
731
736
  }
732
- }), kt = [
733
- ke,
734
- P,
735
- O,
736
- Se,
737
- C,
738
- De,
739
- Re,
737
+ }), $t = [
738
+ $e,
739
+ W,
740
+ N,
741
+ Le,
742
+ $,
743
+ Fe,
740
744
  qe,
741
- et,
745
+ Ke,
742
746
  lt,
743
- st,
744
- ut,
745
- ft,
747
+ ot,
748
+ rt,
749
+ bt,
746
750
  ht,
747
- pt
748
- ], It = {
751
+ xt,
752
+ Ct
753
+ ], At = {
749
754
  install(e) {
750
- kt.forEach((s) => {
755
+ $t.forEach((s) => {
751
756
  e.component(s.name, s);
752
757
  });
753
758
  }
754
759
  };
755
760
  export {
756
- Re as ActionButton,
757
- qe as ConfigSection,
758
- et as DeviceCard,
759
- lt as FormGroup,
760
- st as ListCard,
761
- Se as SelectField,
762
- ke as SideBar,
763
- P as SideButton,
764
- O as SideGroup,
765
- ut as SliderControl,
766
- ft as SwitchToggle,
767
- C as ThemeIcon,
768
- ht as ToggleControl,
769
- pt as TrayIconButton,
770
- De as WindowFrame,
771
- It as default
761
+ qe as ActionButton,
762
+ Ke as ConfigSection,
763
+ lt as DeviceCard,
764
+ ot as FormGroup,
765
+ rt as ListCard,
766
+ Le as SelectField,
767
+ $e as SideBar,
768
+ W as SideButton,
769
+ N as SideGroup,
770
+ bt as SliderControl,
771
+ ht as SwitchToggle,
772
+ $ as ThemeIcon,
773
+ xt as ToggleControl,
774
+ Ct as TrayIconButton,
775
+ Fe as WindowFrame,
776
+ At as default
772
777
  };
@@ -1 +1 @@
1
- (function(c,e){typeof exports=="object"&&typeof module<"u"?e(exports,require("vue"),require("@tauri-apps/api/event"),require("@vasakgroup/plugin-vicons"),require("@tauri-apps/api/window")):typeof define=="function"&&define.amd?define(["exports","vue","@tauri-apps/api/event","@vasakgroup/plugin-vicons","@tauri-apps/api/window"],e):(c=typeof globalThis<"u"?globalThis:c||self,e(c.VueLibVasak={},c.Vue,c.TauriEvent,c.VasakVicons,c.TauriWindow))})(this,(function(c,e,M,p,j){"use strict";function F(t,o){const a=e.ref("");let l=null,s=!1,i=0;async function d(){const r=++i,n=t.value;if(!n){a.value="";return}const m=o.value==="symbol"?await p.getSymbolSource(n):await p.getIconSource(n);r===i&&(a.value=m)}return e.onMounted(async()=>{const r=await M.listen("vicons:theme-changed",d);if(s){r();return}l=r,await d()}),e.onUnmounted(()=>{s=!0,l?.()}),e.watch(t,d),a}const O=["src","alt"],u=e.defineComponent({__name:"ThemeIcon",props:{name:{},type:{default:"icon"},size:{default:18},alt:{default:""}},setup(t){const o=t,a=F(e.toRef(o,"name"),e.toRef(o,"type")),l=e.computed(()=>`${o.size}px`);return(s,i)=>e.unref(a)?(e.openBlock(),e.createElementBlock("img",{key:0,src:e.unref(a),alt:t.alt,style:e.normalizeStyle({width:l.value,height:l.value}),class:"shrink-0 object-contain"},null,12,O)):(e.openBlock(),e.createElementBlock("span",{key:1,style:e.normalizeStyle({width:l.value,height:l.value}),class:"shrink-0"},null,4))}}),P={class:"flex flex-col gap-2"},W=["aria-expanded"],R={key:1,class:"flex flex-col gap-1"},g=e.defineComponent({__name:"SideGroup",props:{title:{},collapsed:{type:Boolean,default:!1},defaultOpen:{type:Boolean,default:!0}},setup(t){const o=t,a=e.ref(o.defaultOpen);return e.watch(()=>o.collapsed,l=>{l&&(a.value=!0)}),(l,s)=>(e.openBlock(),e.createElementBlock("section",P,[t.collapsed?e.createCommentVNode("",!0):(e.openBlock(),e.createElementBlock("button",{key:0,type:"button",class:"group flex w-full items-center justify-between rounded-corner px-2 py-1 text-tx-muted text-xs uppercase tracking-[0.08em] hover:bg-ui-surface/60","aria-expanded":a.value,onClick:s[0]||(s[0]=i=>a.value=!a.value)},[e.createElementVNode("span",null,e.toDisplayString(t.title),1),e.createVNode(u,{name:"pan-down-symbolic",type:"symbol",size:12,class:e.normalizeClass(["transition-transform duration-200",a.value?"":"-rotate-90"])},null,8,["class"])],8,W)),a.value||t.collapsed?(e.openBlock(),e.createElementBlock("div",R,[e.renderSlot(l.$slots,"default")])):e.createCommentVNode("",!0)]))}}),q=["title","aria-label","disabled","aria-current"],G={key:1},U={key:0,class:"min-w-0 flex-1 truncate font-medium"},_={key:1,class:"rounded-corner bg-ui-surface px-2 py-0.5 font-semibold text-tx-muted text-xs"},h=e.defineComponent({__name:"SideButton",props:{label:{},icon:{default:""},active:{type:Boolean,default:!1},collapsed:{type:Boolean,default:!1},disabled:{type:Boolean,default:!1},badge:{default:""}},emits:["click"],setup(t){return(o,a)=>(e.openBlock(),e.createElementBlock("button",{type:"button",title:t.collapsed?t.label:void 0,"aria-label":t.collapsed?t.label:void 0,disabled:t.disabled,"aria-current":t.active?"page":void 0,class:e.normalizeClass(["group relative flex w-full items-center gap-3 rounded-corner border px-3 py-2 text-left text-sm transition-all duration-200",[t.active?"border-secondary bg-primary/15 text-tx-main shadow-sm":"border-transparent bg-transparent hover:border-ui-border hover:bg-ui-surface/70",t.disabled?"cursor-not-allowed opacity-60":"cursor-pointer",t.collapsed?"justify-center px-2":""]]),onClick:a[0]||(a[0]=l=>o.$emit("click"))},[e.createElementVNode("span",{class:e.normalizeClass(["flex h-8 w-8 shrink-0 items-center justify-center rounded-corner font-semibold text-xs uppercase tracking-wide",t.active?"border-secondary bg-primary/20":""]),"aria-hidden":"true"},[t.icon?(e.openBlock(),e.createBlock(u,{key:0,name:t.icon,size:20},null,8,["name"])):(e.openBlock(),e.createElementBlock("span",G,e.toDisplayString(t.label.charAt(0).toUpperCase()),1))],2),t.collapsed?e.createCommentVNode("",!0):(e.openBlock(),e.createElementBlock("span",U,e.toDisplayString(t.label),1)),!t.collapsed&&t.badge!==""?(e.openBlock(),e.createElementBlock("span",_,e.toDisplayString(t.badge),1)):e.createCommentVNode("",!0)],10,q))}}),H={key:0,class:"flex flex-col gap-2 border-ui-border border-b p-2"},J={class:"flex items-center gap-2"},K=["aria-label","aria-expanded"],Q={key:0,class:"min-w-0 flex-1"},X={key:0,class:"truncate font-semibold text-sm"},Y={key:1,class:"truncate text-tx-muted text-xs"},Z={key:0},v={key:1,class:"flex border-ui-border border-b p-2"},ee=["aria-label","aria-expanded"],te={class:"flex min-h-0 flex-1 flex-col gap-3 overflow-y-auto p-2"},C="hidden h-8 w-8 shrink-0 items-center justify-center rounded-corner border border-ui-border bg-ui-surface/70 transition-colors hover:bg-ui-surface md:inline-flex",B=e.defineComponent({__name:"SideBar",props:{title:{default:""},subtitle:{default:""},categories:{default:()=>[]},modelValue:{default:""},collapsed:{type:Boolean,default:void 0},collapseLabel:{default:"Collapse"},expandLabel:{default:"Expand"}},emits:["update:modelValue","update:collapsed","change"],setup(t,{expose:o,emit:a}){const l=t,s=a,i=e.ref(l.collapsed??!1),d=e.ref(!1);let r=null;const n=e.computed(()=>d.value||i.value),m=e.computed(()=>!!(l.title||l.subtitle));e.computed(()=>l.categories.length>0);function y(){d.value=r?.matches??!1}function A(){i.value=!i.value,s("update:collapsed",i.value)}function Ge(f){s("update:modelValue",f),s("change",f)}return e.watch(()=>l.collapsed,f=>{f!==void 0&&(i.value=f)}),e.onMounted(()=>{r=window.matchMedia("(max-width: 767px)"),y(),r.addEventListener("change",y)}),e.onBeforeUnmount(()=>r?.removeEventListener("change",y)),o({collapsed:n}),(f,Je)=>(e.openBlock(),e.createElementBlock("aside",{class:e.normalizeClass(["relative z-30 flex h-full shrink-0 flex-col rounded-corner border border-ui-border bg-ui-surface/70 transition-all duration-300",["w-[84px]",n.value?"md:w-[84px]":"md:w-72"]])},[m.value||f.$slots.header?(e.openBlock(),e.createElementBlock("header",H,[e.createElementVNode("div",J,[e.createElementVNode("button",{type:"button",class:e.normalizeClass(C),"aria-label":n.value?t.expandLabel:t.collapseLabel,"aria-expanded":!n.value,onClick:A},[e.createVNode(u,{name:n.value?"pan-end-symbolic":"pan-start-symbolic",type:"symbol",size:16},null,8,["name"])],8,K),m.value&&!n.value?(e.openBlock(),e.createElementBlock("div",Q,[t.title?(e.openBlock(),e.createElementBlock("p",X,e.toDisplayString(t.title),1)):e.createCommentVNode("",!0),t.subtitle?(e.openBlock(),e.createElementBlock("p",Y,e.toDisplayString(t.subtitle),1)):e.createCommentVNode("",!0)])):e.createCommentVNode("",!0)]),f.$slots.header&&!n.value?(e.openBlock(),e.createElementBlock("div",Z,[e.renderSlot(f.$slots,"header",{collapsed:n.value})])):e.createCommentVNode("",!0)])):(e.openBlock(),e.createElementBlock("div",v,[e.createElementVNode("button",{type:"button",class:e.normalizeClass(C),"aria-label":n.value?t.expandLabel:t.collapseLabel,"aria-expanded":!n.value,onClick:A},[e.createVNode(u,{name:n.value?"pan-end-symbolic":"pan-start-symbolic",type:"symbol",size:16},null,8,["name"])],8,ee)])),e.createElementVNode("div",te,[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(t.categories,x=>(e.openBlock(),e.createBlock(g,{key:x.id,title:x.title,collapsed:n.value},{default:e.withCtx(()=>[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(x.items,k=>(e.openBlock(),e.createBlock(h,{key:k.id,label:k.label,icon:k.icon,badge:k.badge,disabled:k.disabled,collapsed:n.value,active:t.modelValue===k.id,onClick:Ke=>Ge(k.id)},null,8,["label","icon","badge","disabled","collapsed","active","onClick"]))),128))]),_:2},1032,["title","collapsed"]))),128)),e.renderSlot(f.$slots,"default",{collapsed:n.value})])],2))}}),ae={class:"flex min-w-0 flex-col gap-1"},le=["for"],oe={class:"relative flex min-w-0 items-center"},ne=["id"],w=e.defineComponent({inheritAttrs:!1,__name:"SelectField",props:e.mergeModels({label:{}},{modelValue:{required:!0},modelModifiers:{}}),emits:["update:modelValue"],setup(t){const o=t,a=e.useAttrs(),l=e.useId(),s=e.computed(()=>a.id??l),[i,d]=e.useModel(t,"modelValue",{set(r){return d.number?Number(r):r}});return(r,n)=>(e.openBlock(),e.createElementBlock("div",ae,[o.label?(e.openBlock(),e.createElementBlock("label",{key:0,for:s.value,class:"text-tx-muted text-xs"},e.toDisplayString(o.label),9,le)):e.createCommentVNode("",!0),e.createElementVNode("div",oe,[e.withDirectives(e.createElementVNode("select",e.mergeProps({id:s.value,"onUpdate:modelValue":n[0]||(n[0]=m=>e.isRef(i)?i.value=m:null),class:"min-w-0 flex-1 appearance-none truncate rounded-corner border border-ui-border bg-ui-surface/60 py-1.5 pr-8 pl-2 text-sm text-tx-main"},e.unref(a)),[e.renderSlot(r.$slots,"default")],16,ne),[[e.vModelSelect,e.unref(i)]]),e.createVNode(u,{name:"pan-down-symbolic",type:"symbol",size:14,class:"pointer-events-none absolute right-2"})])]))}}),se={"data-tauri-drag-region":""},ie=["src","alt"],ce={"data-tauri-drag-region":""},re={"data-tauri-drag-region":""},de=["src"],me=["src"],fe=["src"],ue=e.defineComponent({__name:"TopBar",props:{title:String,image:String},setup(t){const o=e.ref(null),a=j.getCurrentWindow(),l=e.ref(""),s=e.ref(""),i=e.ref(""),d=t;return e.onMounted(async()=>{l.value=await p.getIconSource("window-close"),s.value=await p.getIconSource("window-minimize"),i.value=await p.getIconSource("window-maximize")}),(r,n)=>(e.openBlock(),e.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:o},[e.createElementVNode("div",se,[e.createElementVNode("img",{src:d.image,"data-tauri-drag-region":"",class:"h-6 w-auto",alt:d.title},null,8,ie)]),e.createElementVNode("div",ce,e.toDisplayString(d.title),1),e.createElementVNode("div",re,[e.createElementVNode("span",{class:"win-button",onClick:n[0]||(n[0]=m=>e.unref(a).minimize())},[e.createElementVNode("img",{src:s.value,class:"h-6 w-6 inline-block",alt:"Minimize"},null,8,de)]),e.createElementVNode("span",{class:"win-button",onClick:n[1]||(n[1]=m=>e.unref(a).toggleMaximize())},[e.createElementVNode("img",{src:i.value,class:"h-6 w-6 inline-block",alt:"Maximize"},null,8,me)]),e.createElementVNode("span",{class:"win-button",onClick:n[2]||(n[2]=m=>e.unref(a).close())},[e.createElementVNode("img",{src:l.value,class:"h-6 w-6 inline-block",alt:"Close"},null,8,fe)])])],512))}}),$=e.defineComponent({__name:"WindowFrame",props:{title:{default:"Vasak"},image:{default:""}},setup(t){const o=t;return(a,l)=>(e.openBlock(),e.createElementBlock(e.Fragment,null,[e.createVNode(ue,{title:o.title,image:o.image},null,8,["title","image"]),e.renderSlot(a.$slots,"default")],64))}}),ke=["type","disabled"],pe={key:0,class:"w-4 h-4 animate-spin rounded-full border-2 border-current border-t-transparent"},be=["src","alt"],ge={key:2},he=["src","alt"],ye=e.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:o}){const a=t,l=o,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"},i={sm:"px-2 py-1 text-xs",md:"px-3 py-1 text-sm",lg:"px-4 py-2 text-base"},d=r=>{a.stopPropagation&&r.stopPropagation(),a.preventDefault&&r.preventDefault(),!a.disabled&&!a.loading&&l("click")};return(r,n)=>(e.openBlock(),e.createElementBlock("button",{type:a.type,onClick:d,class:e.normalizeClass(["rounded-corner transition-all duration-200 disabled:opacity-50 disabled:cursor-not-allowed flex items-center justify-center gap-2",[s[a.variant],i[a.size],a.fullWidth?"w-full":"",a.iconSrc&&!a.label?"px-2 py-2":"",t.customClass]]),disabled:a.disabled||a.loading},[t.loading?(e.openBlock(),e.createElementBlock("span",pe)):e.createCommentVNode("",!0),a.iconSrc&&!a.iconRight?(e.openBlock(),e.createElementBlock("img",{key:1,src:a.iconSrc,alt:a.iconAlt||a.label,class:"w-4 h-4"},null,8,be)):e.createCommentVNode("",!0),a.label?(e.openBlock(),e.createElementBlock("span",ge,e.toDisplayString(a.label),1)):e.createCommentVNode("",!0),a.iconSrc&&a.iconRight?(e.openBlock(),e.createElementBlock("img",{key:3,src:a.iconSrc,alt:a.iconAlt||a.label,class:"w-4 h-4"},null,8,he)):e.createCommentVNode("",!0)],10,ke))}}),b=(t,o)=>{const a=t.__vccOpts||t;for(const[l,s]of o)a[l]=s;return a},E=b(ye,[["__scopeId","data-v-2eaf6e27"]]),xe={class:"text-base font-semibold m-0 text-primary dark:text-primary-dark"},V=b(e.defineComponent({__name:"ConfigSection",props:{title:{},icon:{default:""},customClass:{default:()=>({})}},setup(t){return(o,a)=>(e.openBlock(),e.createElementBlock("div",{class:e.normalizeClass(["flex flex-col gap-4 p-4 background rounded-corner",t.customClass])},[e.createElementVNode("h3",xe,e.toDisplayString(t.icon?`${t.icon} ${t.title}`:t.title),1),e.renderSlot(o.$slots,"default",{},void 0,!0)],2))}}),[["__scopeId","data-v-45bd4eab"]]),Ce={class:"flex items-center gap-3 flex-1 min-w-0"},Be=["src","alt"],we={class:"min-w-0"},$e={class:"font-semibold truncate"},Ee={key:0,class:"text-xs text-gray-400 truncate"},Ve={key:1,class:"text-xs text-gray-400 truncate"},Se={key:2,class:"text-xs text-gray-400 flex gap-2 mt-1"},Ne={key:1,class:"w-2 h-2 rounded-full bg-green-500"},S=e.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:o}){const a=o,l=()=>{a("action")},s=()=>{a("click")};return(i,d)=>(e.openBlock(),e.createElementBlock("div",{class:e.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},[e.createElementVNode("div",Ce,[e.createElementVNode("img",{src:t.icon,alt:t.title,class:"h-7 w-7 shrink-0"},null,8,Be),e.createElementVNode("div",we,[e.createElementVNode("div",$e,e.toDisplayString(t.title),1),t.subtitle?(e.openBlock(),e.createElementBlock("div",Ee,e.toDisplayString(t.subtitle),1)):e.createCommentVNode("",!0),t.metadata?(e.openBlock(),e.createElementBlock("div",Ve,e.toDisplayString(t.metadata),1)):e.createCommentVNode("",!0),t.extraInfo&&t.extraInfo.length>0?(e.openBlock(),e.createElementBlock("div",Se,[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(t.extraInfo,(r,n)=>(e.openBlock(),e.createElementBlock("span",{key:n},e.toDisplayString(r),1))),128))])):e.createCommentVNode("",!0)])]),t.showActionButton?(e.openBlock(),e.createElementBlock("button",{key:0,class:"bg-vsk-primary rounded-vsk px-4 py-2 text-sm font-semibold cursor-pointer hover:opacity-70",onClick:e.withModifiers(l,["stop"])},e.toDisplayString(t.actionLabel),1)):e.createCommentVNode("",!0),t.showStatusIndicator&&t.isConnected?(e.openBlock(),e.createElementBlock("div",Ne)):e.createCommentVNode("",!0)],2))}}),ze=["for"],N=b(e.defineComponent({__name:"FormGroup",props:{label:{},htmlFor:{default:""},customClass:{default:()=>({})},labelClass:{default:()=>({})}},setup(t){return(o,a)=>(e.openBlock(),e.createElementBlock("div",{class:e.normalizeClass(["flex flex-col gap-2",t.customClass])},[t.label?(e.openBlock(),e.createElementBlock("label",{key:0,for:t.htmlFor,class:e.normalizeClass(["text-sm font-medium text-primary dark:text-primary-dark",t.labelClass])},e.toDisplayString(t.label),11,ze)):e.createCommentVNode("",!0),e.renderSlot(o.$slots,"default",{},void 0,!0)],2))}}),[["__scopeId","data-v-c0d9d9cb"]]),z=b(e.defineComponent({__name:"ListCard",props:{clickable:{type:Boolean,default:!1},customClass:{default:()=>({})}},emits:["click"],setup(t,{emit:o}){const a=t,l=o,s=()=>{a.clickable&&l("click")};return(i,d)=>(e.openBlock(),e.createElementBlock("div",{class:e.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":a.clickable},t.customClass]),onClick:s},[e.renderSlot(i.$slots,"default",{},void 0,!0)],2))}}),[["__scopeId","data-v-f86d47da"]]),De={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"},Te=["src","alt","title"],Ie={key:1,class:"w-8 h-8 flex items-center justify-center"},Le=["src","alt"],Ae=["min","max","value"],D=e.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:o}){const a=t,l=o,s=e.computed(()=>{if(a.max<=a.min)return 0;const n=a.max-a.min,m=a.modelValue-a.min;return Math.round(m/n*100)}),i=e.computed(()=>a.getPercentageClass?a.getPercentageClass(s.value):""),d=n=>{const m=n.target;l("update:modelValue",Number(m.value))},r=()=>{l("buttonClick")};return(n,m)=>(e.openBlock(),e.createElementBlock("div",De,[t.showButton?(e.openBlock(),e.createElementBlock("button",{key:0,onClick:r,class:"w-8 h-8 flex items-center justify-center rounded-corner transition-all duration-200 hover:bg-ui-surface/80 dark:hover:bg-ui-surface-dark/80 hover:scale-110 active:scale-95"},[e.createElementVNode("img",{src:t.icon,alt:t.alt,title:t.tooltip,class:e.normalizeClass(["w-6 h-6 transition-all duration-200",t.iconClass])},null,10,Te)])):(e.openBlock(),e.createElementBlock("div",Ie,[e.createElementVNode("img",{src:t.icon,alt:t.alt,class:"w-6 h-6 transition-all duration-200"},null,8,Le)])),e.createElementVNode("input",{type:"range",min:t.min,max:t.max,value:t.modelValue,onInput:d,class:"flex-1 transition-all duration-200 hover:scale-105"},null,40,Ae),e.createElementVNode("span",{class:e.normalizeClass(["w-12 text-right transition-all duration-200 font-medium",i.value])},e.toDisplayString(s.value)+"% ",3)]))}}),Me=["disabled"],T=e.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:o}){const a=t,l=o,s=()=>{l("toggle",!a.isOn)};return(i,d)=>(e.openBlock(),e.createElementBlock("button",{type:"button",onClick:s,disabled:t.disabled,class:e.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])},[e.createElementVNode("span",{class:e.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,Me))}}),je=["disabled"],Fe=["src","alt","title"],I=e.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:o}){const a=o,l=()=>{a("click")};return(s,i)=>(e.openBlock(),e.createElementBlock("button",{onClick:l,class:e.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},[e.createElementVNode("img",{src:t.icon,alt:t.alt,title:t.tooltip,class:e.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,je))}}),Oe=["title"],Pe=["src","alt"],We={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"},L=e.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:o}){const a=o,l=e.ref(!1),s=()=>{a("click")};return(i,d)=>(e.openBlock(),e.createElementBlock("div",{class:e.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:d[0]||(d[0]=r=>l.value=!0),onMouseleave:d[1]||(d[1]=r=>l.value=!1)},[e.createElementVNode("img",{src:t.icon,alt:t.alt,class:e.normalizeClass(["m-auto h-5.5 w-auto transition-all duration-300",t.iconClass])},null,10,Pe),t.badge!==null&&t.badge>0?(e.openBlock(),e.createElementBlock("div",We,e.toDisplayString(t.badge),1)):e.createCommentVNode("",!0),t.showCustomTooltip&&t.customTooltipText?(e.openBlock(),e.createElementBlock("div",{key:1,class:e.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}]])},e.toDisplayString(t.customTooltipText),3)):e.createCommentVNode("",!0),e.renderSlot(i.$slots,"default")],42,Oe))}}),Re=[B,h,g,w,u,$,E,V,S,N,z,D,T,I,L],qe={install(t){Re.forEach(o=>{t.component(o.name,o)})}};c.ActionButton=E,c.ConfigSection=V,c.DeviceCard=S,c.FormGroup=N,c.ListCard=z,c.SelectField=w,c.SideBar=B,c.SideButton=h,c.SideGroup=g,c.SliderControl=D,c.SwitchToggle=T,c.ThemeIcon=u,c.ToggleControl=I,c.TrayIconButton=L,c.WindowFrame=$,c.default=qe,Object.defineProperties(c,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}})}));
1
+ (function(c,e){typeof exports=="object"&&typeof module<"u"?e(exports,require("vue"),require("@tauri-apps/api/event"),require("@vasakgroup/plugin-vicons"),require("@tauri-apps/api/window")):typeof define=="function"&&define.amd?define(["exports","vue","@tauri-apps/api/event","@vasakgroup/plugin-vicons","@tauri-apps/api/window"],e):(c=typeof globalThis<"u"?globalThis:c||self,e(c.VueLibVasak={},c.Vue,c.TauriEvent,c.VasakVicons,c.TauriWindow))})(this,(function(c,e,F,b,O){"use strict";function P(t,n){const a=e.ref("");let l=null,o=!1,s=0;async function d(){const m=++s,i=t.value;if(!i){a.value="";return}const r=n.value==="symbol"?await b.getSymbolSource(i):await b.getIconSource(i);m===s&&(a.value=r)}return e.onMounted(async()=>{const m=await F.listen("vicons:theme-changed",d);if(o){m();return}l=m,await d()}),e.onUnmounted(()=>{o=!0,l?.()}),e.watch(t,d),a}const W=["src","alt"],f=e.defineComponent({__name:"ThemeIcon",props:{name:{},type:{default:"icon"},size:{default:18},alt:{default:""}},setup(t){const n=t,a=P(e.toRef(n,"name"),e.toRef(n,"type")),l=e.computed(()=>`${n.size}px`);return(o,s)=>e.unref(a)?(e.openBlock(),e.createElementBlock("img",{key:0,src:e.unref(a),alt:t.alt,style:e.normalizeStyle({width:l.value,height:l.value}),class:"shrink-0 object-contain"},null,12,W)):(e.openBlock(),e.createElementBlock("span",{key:1,style:e.normalizeStyle({width:l.value,height:l.value}),class:"shrink-0"},null,4))}}),R={class:"flex flex-col gap-2"},q=["aria-expanded"],G={key:1,class:"flex flex-col gap-1"},h=e.defineComponent({__name:"SideGroup",props:{title:{},collapsed:{type:Boolean,default:!1},defaultOpen:{type:Boolean,default:!0}},setup(t){const n=t,a=e.ref(n.defaultOpen);return e.watch(()=>n.collapsed,l=>{l&&(a.value=!0)}),(l,o)=>(e.openBlock(),e.createElementBlock("section",R,[t.collapsed?e.createCommentVNode("",!0):(e.openBlock(),e.createElementBlock("button",{key:0,type:"button",class:"group flex w-full items-center justify-between rounded-corner px-2 py-1 text-tx-muted text-xs uppercase tracking-[0.08em] hover:bg-ui-surface/60","aria-expanded":a.value,onClick:o[0]||(o[0]=s=>a.value=!a.value)},[e.createElementVNode("span",null,e.toDisplayString(t.title),1),e.createVNode(f,{name:"pan-down-symbolic",type:"symbol",size:12,class:e.normalizeClass(["transition-transform duration-200",a.value?"":"-rotate-90"])},null,8,["class"])],8,q)),a.value||t.collapsed?(e.openBlock(),e.createElementBlock("div",G,[e.renderSlot(l.$slots,"default")])):e.createCommentVNode("",!0)]))}}),U=["title","aria-label","disabled","aria-current"],_={key:1},H={key:0,class:"min-w-0 flex-1 truncate font-medium"},J={key:1,class:"rounded-corner bg-ui-surface px-2 py-0.5 font-semibold text-tx-muted text-xs"},y=e.defineComponent({__name:"SideButton",props:{label:{},icon:{default:""},active:{type:Boolean,default:!1},collapsed:{type:Boolean,default:!1},disabled:{type:Boolean,default:!1},badge:{default:""}},emits:["click"],setup(t){return(n,a)=>(e.openBlock(),e.createElementBlock("button",{type:"button",title:t.collapsed?t.label:void 0,"aria-label":t.collapsed?t.label:void 0,disabled:t.disabled,"aria-current":t.active?"page":void 0,class:e.normalizeClass(["group relative flex w-full items-center gap-3 rounded-corner border px-3 py-2 text-left text-sm transition-all duration-200",[t.active?"border-secondary bg-primary/15 text-tx-main shadow-sm":"border-transparent bg-transparent hover:border-ui-border hover:bg-ui-surface/70",t.disabled?"cursor-not-allowed opacity-60":"cursor-pointer",t.collapsed?"justify-center px-2":""]]),onClick:a[0]||(a[0]=l=>n.$emit("click"))},[e.createElementVNode("span",{class:e.normalizeClass(["flex h-8 w-8 shrink-0 items-center justify-center rounded-corner font-semibold text-xs uppercase tracking-wide",t.active?"border-secondary bg-primary/20":""]),"aria-hidden":"true"},[t.icon?(e.openBlock(),e.createBlock(f,{key:0,name:t.icon,size:20},null,8,["name"])):(e.openBlock(),e.createElementBlock("span",_,e.toDisplayString(t.label.charAt(0).toUpperCase()),1))],2),t.collapsed?e.createCommentVNode("",!0):(e.openBlock(),e.createElementBlock("span",H,e.toDisplayString(t.label),1)),!t.collapsed&&t.badge!==""?(e.openBlock(),e.createElementBlock("span",J,e.toDisplayString(t.badge),1)):e.createCommentVNode("",!0)],10,U))}}),K={key:0,class:"flex flex-col gap-2 border-ui-border border-b p-2"},Q={class:"flex items-center gap-2"},X=["aria-label","aria-expanded"],Y={key:0,class:"min-w-0 flex-1"},Z={key:0,class:"truncate font-semibold text-sm"},v={key:1,class:"truncate text-tx-muted text-xs"},ee={key:0},te={key:1,class:"flex border-ui-border border-b p-2"},ae=["aria-label","aria-expanded"],le={class:"flex min-h-0 flex-1 flex-col gap-3 overflow-y-auto p-2"},C="hidden h-8 w-8 shrink-0 items-center justify-center rounded-corner border border-ui-border bg-ui-surface/70 transition-colors hover:bg-ui-surface md:inline-flex",B=767,w=e.defineComponent({__name:"SideBar",props:{title:{default:""},subtitle:{default:""},categories:{default:()=>[]},modelValue:{default:""},collapsed:{type:Boolean,default:void 0},collapseLabel:{default:"Collapse"},expandLabel:{default:"Expand"}},emits:["update:modelValue","update:collapsed","change"],setup(t,{expose:n,emit:a}){const l=t,o=a,s=e.ref(l.collapsed??!1),d=e.ref(!1);let m=null,i=null;const r=e.computed(()=>d.value||s.value),M=e.computed(()=>!!(l.title||l.subtitle));e.computed(()=>l.categories.length>0);function _e(){return document.documentElement?.clientWidth||window.innerWidth}function p(){d.value=_e()<=B}function j(){s.value=!s.value,o("update:collapsed",s.value)}function He(u){o("update:modelValue",u),o("change",u)}return e.watch(()=>l.collapsed,u=>{u!==void 0&&(s.value=u)}),e.onMounted(()=>{m=window.matchMedia(`(max-width: ${B}px)`),p(),m.addEventListener("change",p),window.addEventListener("resize",p),typeof ResizeObserver<"u"&&document.documentElement&&(i=new ResizeObserver(p),i.observe(document.documentElement))}),e.onBeforeUnmount(()=>{m?.removeEventListener("change",p),window.removeEventListener("resize",p),i?.disconnect(),i=null}),n({collapsed:r}),(u,Xe)=>(e.openBlock(),e.createElementBlock("aside",{class:e.normalizeClass(["relative z-30 flex h-full shrink-0 flex-col rounded-corner border border-ui-border bg-ui-surface/70 transition-all duration-300",["w-[84px]",r.value?"md:w-[84px]":"md:w-72"]])},[M.value||u.$slots.header?(e.openBlock(),e.createElementBlock("header",K,[e.createElementVNode("div",Q,[e.createElementVNode("button",{type:"button",class:e.normalizeClass(C),"aria-label":r.value?t.expandLabel:t.collapseLabel,"aria-expanded":!r.value,onClick:j},[e.createVNode(f,{name:r.value?"pan-end-symbolic":"pan-start-symbolic",type:"symbol",size:16},null,8,["name"])],8,X),M.value&&!r.value?(e.openBlock(),e.createElementBlock("div",Y,[t.title?(e.openBlock(),e.createElementBlock("p",Z,e.toDisplayString(t.title),1)):e.createCommentVNode("",!0),t.subtitle?(e.openBlock(),e.createElementBlock("p",v,e.toDisplayString(t.subtitle),1)):e.createCommentVNode("",!0)])):e.createCommentVNode("",!0)]),u.$slots.header&&!r.value?(e.openBlock(),e.createElementBlock("div",ee,[e.renderSlot(u.$slots,"header",{collapsed:r.value})])):e.createCommentVNode("",!0)])):(e.openBlock(),e.createElementBlock("div",te,[e.createElementVNode("button",{type:"button",class:e.normalizeClass(C),"aria-label":r.value?t.expandLabel:t.collapseLabel,"aria-expanded":!r.value,onClick:j},[e.createVNode(f,{name:r.value?"pan-end-symbolic":"pan-start-symbolic",type:"symbol",size:16},null,8,["name"])],8,ae)])),e.createElementVNode("div",le,[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(t.categories,x=>(e.openBlock(),e.createBlock(h,{key:x.id,title:x.title,collapsed:r.value},{default:e.withCtx(()=>[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(x.items,k=>(e.openBlock(),e.createBlock(y,{key:k.id,label:k.label,icon:k.icon,badge:k.badge,disabled:k.disabled,collapsed:r.value,active:t.modelValue===k.id,onClick:Ye=>He(k.id)},null,8,["label","icon","badge","disabled","collapsed","active","onClick"]))),128))]),_:2},1032,["title","collapsed"]))),128)),e.renderSlot(u.$slots,"default",{collapsed:r.value})])],2))}}),ne={class:"flex min-w-0 flex-col gap-1"},oe=["for"],se={class:"relative flex min-w-0 items-center"},ie=["id"],E=e.defineComponent({inheritAttrs:!1,__name:"SelectField",props:e.mergeModels({label:{}},{modelValue:{required:!0},modelModifiers:{}}),emits:["update:modelValue"],setup(t){const n=t,a=e.useAttrs(),l=e.useId(),o=e.computed(()=>a.id??l),[s,d]=e.useModel(t,"modelValue",{set(m){return d.number?Number(m):m}});return(m,i)=>(e.openBlock(),e.createElementBlock("div",ne,[n.label?(e.openBlock(),e.createElementBlock("label",{key:0,for:o.value,class:"text-tx-muted text-xs"},e.toDisplayString(n.label),9,oe)):e.createCommentVNode("",!0),e.createElementVNode("div",se,[e.withDirectives(e.createElementVNode("select",e.mergeProps({id:o.value,"onUpdate:modelValue":i[0]||(i[0]=r=>e.isRef(s)?s.value=r:null),class:"min-w-0 flex-1 appearance-none truncate rounded-corner border border-ui-border bg-ui-surface/60 py-1.5 pr-8 pl-2 text-sm text-tx-main"},e.unref(a)),[e.renderSlot(m.$slots,"default")],16,ie),[[e.vModelSelect,e.unref(s)]]),e.createVNode(f,{name:"pan-down-symbolic",type:"symbol",size:14,class:"pointer-events-none absolute right-2"})])]))}}),re={"data-tauri-drag-region":""},ce=["src","alt"],de={"data-tauri-drag-region":""},me={"data-tauri-drag-region":""},ue=["src"],fe=["src"],ke=["src"],pe=e.defineComponent({__name:"TopBar",props:{title:String,image:String},setup(t){const n=e.ref(null),a=O.getCurrentWindow(),l=e.ref(""),o=e.ref(""),s=e.ref(""),d=t;return e.onMounted(async()=>{l.value=await b.getIconSource("window-close"),o.value=await b.getIconSource("window-minimize"),s.value=await b.getIconSource("window-maximize")}),(m,i)=>(e.openBlock(),e.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:n},[e.createElementVNode("div",re,[e.createElementVNode("img",{src:d.image,"data-tauri-drag-region":"",class:"h-6 w-auto",alt:d.title},null,8,ce)]),e.createElementVNode("div",de,e.toDisplayString(d.title),1),e.createElementVNode("div",me,[e.createElementVNode("span",{class:"win-button",onClick:i[0]||(i[0]=r=>e.unref(a).minimize())},[e.createElementVNode("img",{src:o.value,class:"h-6 w-6 inline-block",alt:"Minimize"},null,8,ue)]),e.createElementVNode("span",{class:"win-button",onClick:i[1]||(i[1]=r=>e.unref(a).toggleMaximize())},[e.createElementVNode("img",{src:s.value,class:"h-6 w-6 inline-block",alt:"Maximize"},null,8,fe)]),e.createElementVNode("span",{class:"win-button",onClick:i[2]||(i[2]=r=>e.unref(a).close())},[e.createElementVNode("img",{src:l.value,class:"h-6 w-6 inline-block",alt:"Close"},null,8,ke)])])],512))}}),$=e.defineComponent({__name:"WindowFrame",props:{title:{default:"Vasak"},image:{default:""}},setup(t){const n=t;return(a,l)=>(e.openBlock(),e.createElementBlock(e.Fragment,null,[e.createVNode(pe,{title:n.title,image:n.image},null,8,["title","image"]),e.renderSlot(a.$slots,"default")],64))}}),be=["type","disabled"],ge={key:0,class:"w-4 h-4 animate-spin rounded-full border-2 border-current border-t-transparent"},he=["src","alt"],ye={key:2},xe=["src","alt"],Ce=e.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:n}){const a=t,l=n,o={primary:"bg-primary dark:bg-primary-dark text-tx-on-primary dark:text-tx-on-primary-dark hover:bg-primary/90 dark:hover:bg-primary-dark/90",secondary:"bg-secondary dark:bg-secondary-dark text-tx-on-primary dark:text-tx-on-primary-dark hover:bg-secondary/80 dark:hover:bg-secondary-dark/80",danger:"bg-status-error dark:bg-status-error-dark text-tx-on-primary dark:text-tx-on-primary-dark hover:bg-status-error/90 dark:hover:bg-status-error-dark/90"},s={sm:"px-2 py-1 text-xs",md:"px-3 py-1 text-sm",lg:"px-4 py-2 text-base"},d=m=>{a.stopPropagation&&m.stopPropagation(),a.preventDefault&&m.preventDefault(),!a.disabled&&!a.loading&&l("click")};return(m,i)=>(e.openBlock(),e.createElementBlock("button",{type:a.type,onClick:d,class:e.normalizeClass(["rounded-corner transition-all duration-200 disabled:opacity-50 disabled:cursor-not-allowed flex items-center justify-center gap-2",[o[a.variant],s[a.size],a.fullWidth?"w-full":"",a.iconSrc&&!a.label?"px-2 py-2":"",t.customClass]]),disabled:a.disabled||a.loading},[t.loading?(e.openBlock(),e.createElementBlock("span",ge)):e.createCommentVNode("",!0),a.iconSrc&&!a.iconRight?(e.openBlock(),e.createElementBlock("img",{key:1,src:a.iconSrc,alt:a.iconAlt||a.label,class:"w-4 h-4"},null,8,he)):e.createCommentVNode("",!0),a.label?(e.openBlock(),e.createElementBlock("span",ye,e.toDisplayString(a.label),1)):e.createCommentVNode("",!0),a.iconSrc&&a.iconRight?(e.openBlock(),e.createElementBlock("img",{key:3,src:a.iconSrc,alt:a.iconAlt||a.label,class:"w-4 h-4"},null,8,xe)):e.createCommentVNode("",!0)],10,be))}}),g=(t,n)=>{const a=t.__vccOpts||t;for(const[l,o]of n)a[l]=o;return a},V=g(Ce,[["__scopeId","data-v-2eaf6e27"]]),Be={class:"text-base font-semibold m-0 text-primary dark:text-primary-dark"},S=g(e.defineComponent({__name:"ConfigSection",props:{title:{},icon:{default:""},customClass:{default:()=>({})}},setup(t){return(n,a)=>(e.openBlock(),e.createElementBlock("div",{class:e.normalizeClass(["flex flex-col gap-4 p-4 background rounded-corner",t.customClass])},[e.createElementVNode("h3",Be,e.toDisplayString(t.icon?`${t.icon} ${t.title}`:t.title),1),e.renderSlot(n.$slots,"default",{},void 0,!0)],2))}}),[["__scopeId","data-v-45bd4eab"]]),we={class:"flex items-center gap-3 flex-1 min-w-0"},Ee=["src","alt"],$e={class:"min-w-0"},Ve={class:"font-semibold truncate"},Se={key:0,class:"text-xs text-gray-400 truncate"},Ne={key:1,class:"text-xs text-gray-400 truncate"},ze={key:2,class:"text-xs text-gray-400 flex gap-2 mt-1"},De={key:1,class:"w-2 h-2 rounded-full bg-green-500"},N=e.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:n}){const a=n,l=()=>{a("action")},o=()=>{a("click")};return(s,d)=>(e.openBlock(),e.createElementBlock("div",{class:e.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:o},[e.createElementVNode("div",we,[e.createElementVNode("img",{src:t.icon,alt:t.title,class:"h-7 w-7 shrink-0"},null,8,Ee),e.createElementVNode("div",$e,[e.createElementVNode("div",Ve,e.toDisplayString(t.title),1),t.subtitle?(e.openBlock(),e.createElementBlock("div",Se,e.toDisplayString(t.subtitle),1)):e.createCommentVNode("",!0),t.metadata?(e.openBlock(),e.createElementBlock("div",Ne,e.toDisplayString(t.metadata),1)):e.createCommentVNode("",!0),t.extraInfo&&t.extraInfo.length>0?(e.openBlock(),e.createElementBlock("div",ze,[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(t.extraInfo,(m,i)=>(e.openBlock(),e.createElementBlock("span",{key:i},e.toDisplayString(m),1))),128))])):e.createCommentVNode("",!0)])]),t.showActionButton?(e.openBlock(),e.createElementBlock("button",{key:0,class:"bg-vsk-primary rounded-vsk px-4 py-2 text-sm font-semibold cursor-pointer hover:opacity-70",onClick:e.withModifiers(l,["stop"])},e.toDisplayString(t.actionLabel),1)):e.createCommentVNode("",!0),t.showStatusIndicator&&t.isConnected?(e.openBlock(),e.createElementBlock("div",De)):e.createCommentVNode("",!0)],2))}}),Ie=["for"],z=g(e.defineComponent({__name:"FormGroup",props:{label:{},htmlFor:{default:""},customClass:{default:()=>({})},labelClass:{default:()=>({})}},setup(t){return(n,a)=>(e.openBlock(),e.createElementBlock("div",{class:e.normalizeClass(["flex flex-col gap-2",t.customClass])},[t.label?(e.openBlock(),e.createElementBlock("label",{key:0,for:t.htmlFor,class:e.normalizeClass(["text-sm font-medium text-primary dark:text-primary-dark",t.labelClass])},e.toDisplayString(t.label),11,Ie)):e.createCommentVNode("",!0),e.renderSlot(n.$slots,"default",{},void 0,!0)],2))}}),[["__scopeId","data-v-c0d9d9cb"]]),D=g(e.defineComponent({__name:"ListCard",props:{clickable:{type:Boolean,default:!1},customClass:{default:()=>({})}},emits:["click"],setup(t,{emit:n}){const a=t,l=n,o=()=>{a.clickable&&l("click")};return(s,d)=>(e.openBlock(),e.createElementBlock("div",{class:e.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":a.clickable},t.customClass]),onClick:o},[e.renderSlot(s.$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"},Te=["src","alt","title"],Ae={key:1,class:"w-8 h-8 flex items-center justify-center"},Me=["src","alt"],je=["min","max","value"],I=e.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:n}){const a=t,l=n,o=e.computed(()=>{if(a.max<=a.min)return 0;const i=a.max-a.min,r=a.modelValue-a.min;return Math.round(r/i*100)}),s=e.computed(()=>a.getPercentageClass?a.getPercentageClass(o.value):""),d=i=>{const r=i.target;l("update:modelValue",Number(r.value))},m=()=>{l("buttonClick")};return(i,r)=>(e.openBlock(),e.createElementBlock("div",Le,[t.showButton?(e.openBlock(),e.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"},[e.createElementVNode("img",{src:t.icon,alt:t.alt,title:t.tooltip,class:e.normalizeClass(["w-6 h-6 transition-all duration-200",t.iconClass])},null,10,Te)])):(e.openBlock(),e.createElementBlock("div",Ae,[e.createElementVNode("img",{src:t.icon,alt:t.alt,class:"w-6 h-6 transition-all duration-200"},null,8,Me)])),e.createElementVNode("input",{type:"range",min:t.min,max:t.max,value:t.modelValue,onInput:d,class:"flex-1 transition-all duration-200 hover:scale-105"},null,40,je),e.createElementVNode("span",{class:e.normalizeClass(["w-12 text-right transition-all duration-200 font-medium",s.value])},e.toDisplayString(o.value)+"% ",3)]))}}),Fe=["disabled"],L=e.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:n}){const a=t,l=n,o=()=>{l("toggle",!a.isOn)};return(s,d)=>(e.openBlock(),e.createElementBlock("button",{type:"button",onClick:o,disabled:t.disabled,class:e.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])},[e.createElementVNode("span",{class:e.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,Fe))}}),Oe=["disabled"],Pe=["src","alt","title"],T=e.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:n}){const a=n,l=()=>{a("click")};return(o,s)=>(e.openBlock(),e.createElementBlock("button",{onClick:l,class:e.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},[e.createElementVNode("img",{src:t.icon,alt:t.alt,title:t.tooltip,class:e.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,Pe)],10,Oe))}}),We=["title"],Re=["src","alt"],qe={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"},A=e.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:n}){const a=n,l=e.ref(!1),o=()=>{a("click")};return(s,d)=>(e.openBlock(),e.createElementBlock("div",{class:e.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:o,onMouseenter:d[0]||(d[0]=m=>l.value=!0),onMouseleave:d[1]||(d[1]=m=>l.value=!1)},[e.createElementVNode("img",{src:t.icon,alt:t.alt,class:e.normalizeClass(["m-auto h-5.5 w-auto transition-all duration-300",t.iconClass])},null,10,Re),t.badge!==null&&t.badge>0?(e.openBlock(),e.createElementBlock("div",qe,e.toDisplayString(t.badge),1)):e.createCommentVNode("",!0),t.showCustomTooltip&&t.customTooltipText?(e.openBlock(),e.createElementBlock("div",{key:1,class:e.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}]])},e.toDisplayString(t.customTooltipText),3)):e.createCommentVNode("",!0),e.renderSlot(s.$slots,"default")],42,We))}}),Ge=[w,y,h,E,f,$,V,S,N,z,D,I,L,T,A],Ue={install(t){Ge.forEach(n=>{t.component(n.name,n)})}};c.ActionButton=V,c.ConfigSection=S,c.DeviceCard=N,c.FormGroup=z,c.ListCard=D,c.SelectField=E,c.SideBar=w,c.SideButton=y,c.SideGroup=h,c.SliderControl=I,c.SwitchToggle=L,c.ThemeIcon=f,c.ToggleControl=T,c.TrayIconButton=A,c.WindowFrame=$,c.default=Ue,Object.defineProperties(c,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}})}));
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@vasakgroup/vue-libvasak",
3
- "version": "0.3.4",
3
+ "version": "0.3.6",
4
4
  "description": "Vue componenets for VSK Applications",
5
5
  "main": "./dist/vue-libvasak.umd.js",
6
6
  "module": "./dist/vue-libvasak.es.js",