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