@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.
- package/dist/vue-libvasak.es.js +286 -281
- package/dist/vue-libvasak.umd.js +1 -1
- package/package.json +1 -1
package/dist/vue-libvasak.es.js
CHANGED
|
@@ -1,31 +1,31 @@
|
|
|
1
|
-
import { ref as y, onMounted as V, onUnmounted as
|
|
2
|
-
import { listen as
|
|
3
|
-
import { getSymbolSource as
|
|
4
|
-
import { getCurrentWindow as
|
|
5
|
-
function
|
|
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,
|
|
7
|
+
let n = null, o = !1, r = 0;
|
|
8
8
|
async function u() {
|
|
9
|
-
const
|
|
10
|
-
if (!
|
|
9
|
+
const m = ++r, c = e.value;
|
|
10
|
+
if (!c) {
|
|
11
11
|
t.value = "";
|
|
12
12
|
return;
|
|
13
13
|
}
|
|
14
|
-
const
|
|
15
|
-
|
|
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
|
|
19
|
-
if (
|
|
20
|
-
|
|
18
|
+
const m = await ae("vicons:theme-changed", u);
|
|
19
|
+
if (o) {
|
|
20
|
+
m();
|
|
21
21
|
return;
|
|
22
22
|
}
|
|
23
|
-
n =
|
|
24
|
-
}),
|
|
25
|
-
|
|
26
|
-
}),
|
|
23
|
+
n = m, await u();
|
|
24
|
+
}), U(() => {
|
|
25
|
+
o = !0, n?.();
|
|
26
|
+
}), M(e, u), t;
|
|
27
27
|
}
|
|
28
|
-
const
|
|
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 =
|
|
38
|
-
return (
|
|
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:
|
|
42
|
+
style: D({ width: n.value, height: n.value }),
|
|
43
43
|
class: "shrink-0 object-contain"
|
|
44
|
-
}, null, 12,
|
|
44
|
+
}, null, 12, oe)) : (a(), l("span", {
|
|
45
45
|
key: 1,
|
|
46
|
-
style:
|
|
46
|
+
style: D({ width: n.value, height: n.value }),
|
|
47
47
|
class: "shrink-0"
|
|
48
48
|
}, null, 4));
|
|
49
49
|
}
|
|
50
|
-
}),
|
|
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
|
-
},
|
|
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
|
|
62
|
+
return M(
|
|
63
63
|
() => s.collapsed,
|
|
64
64
|
(n) => {
|
|
65
65
|
n && (t.value = !0);
|
|
66
66
|
}
|
|
67
|
-
), (n,
|
|
68
|
-
e.collapsed ?
|
|
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:
|
|
73
|
+
onClick: o[0] || (o[0] = (r) => t.value = !t.value)
|
|
74
74
|
}, [
|
|
75
|
-
|
|
76
|
-
|
|
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:
|
|
80
|
+
class: b(["transition-transform duration-200", t.value ? "" : "-rotate-90"])
|
|
81
81
|
}, null, 8, ["class"])
|
|
82
|
-
], 8,
|
|
83
|
-
t.value || e.collapsed ? (a(), l("div",
|
|
82
|
+
], 8, re)),
|
|
83
|
+
t.value || e.collapsed ? (a(), l("div", ce, [
|
|
84
84
|
x(n.$slots, "default")
|
|
85
|
-
])) :
|
|
85
|
+
])) : f("", !0)
|
|
86
86
|
]));
|
|
87
87
|
}
|
|
88
|
-
}),
|
|
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
|
-
},
|
|
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
|
-
},
|
|
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:
|
|
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
|
-
|
|
120
|
-
class:
|
|
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(),
|
|
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",
|
|
127
|
+
}, null, 8, ["name"])) : (a(), l("span", ue, g(e.label.charAt(0).toUpperCase()), 1))
|
|
128
128
|
], 2),
|
|
129
|
-
e.collapsed ?
|
|
130
|
-
!e.collapsed && e.badge !== "" ? (a(), l("span",
|
|
131
|
-
], 10,
|
|
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
|
-
}),
|
|
133
|
+
}), be = {
|
|
134
134
|
key: 0,
|
|
135
135
|
class: "flex flex-col gap-2 border-ui-border border-b p-2"
|
|
136
|
-
},
|
|
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
|
-
},
|
|
139
|
+
}, ye = {
|
|
140
140
|
key: 0,
|
|
141
141
|
class: "truncate font-semibold text-sm"
|
|
142
|
-
},
|
|
142
|
+
}, xe = {
|
|
143
143
|
key: 1,
|
|
144
144
|
class: "truncate text-tx-muted text-xs"
|
|
145
|
-
},
|
|
145
|
+
}, pe = { key: 0 }, ke = {
|
|
146
146
|
key: 1,
|
|
147
147
|
class: "flex border-ui-border border-b p-2"
|
|
148
|
-
},
|
|
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,
|
|
162
|
-
let
|
|
163
|
-
const
|
|
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
|
-
|
|
165
|
+
function R() {
|
|
166
|
+
return document.documentElement?.clientWidth || window.innerWidth;
|
|
167
167
|
}
|
|
168
|
-
function
|
|
169
|
-
|
|
168
|
+
function C() {
|
|
169
|
+
u.value = R() <= P;
|
|
170
170
|
}
|
|
171
|
-
function
|
|
172
|
-
|
|
171
|
+
function E() {
|
|
172
|
+
r.value = !r.value, o("update:collapsed", r.value);
|
|
173
173
|
}
|
|
174
|
-
|
|
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 && (
|
|
180
|
+
v !== void 0 && (r.value = v);
|
|
178
181
|
}
|
|
179
182
|
), V(() => {
|
|
180
|
-
|
|
181
|
-
}),
|
|
182
|
-
|
|
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
|
-
|
|
185
|
-
|
|
186
|
-
|
|
189
|
+
j.value || v.$slots.header ? (a(), l("header", be, [
|
|
190
|
+
i("div", ge, [
|
|
191
|
+
i("button", {
|
|
187
192
|
type: "button",
|
|
188
|
-
class:
|
|
189
|
-
"aria-label":
|
|
190
|
-
"aria-expanded": !
|
|
191
|
-
onClick:
|
|
193
|
+
class: b(F),
|
|
194
|
+
"aria-label": d.value ? e.expandLabel : e.collapseLabel,
|
|
195
|
+
"aria-expanded": !d.value,
|
|
196
|
+
onClick: E
|
|
192
197
|
}, [
|
|
193
|
-
|
|
194
|
-
name:
|
|
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,
|
|
199
|
-
|
|
200
|
-
e.title ? (a(), l("p",
|
|
201
|
-
e.subtitle ? (a(), l("p",
|
|
202
|
-
])) :
|
|
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 && !
|
|
205
|
-
x(v.$slots, "header", { collapsed:
|
|
206
|
-
])) :
|
|
207
|
-
])) : (a(), l("div",
|
|
208
|
-
|
|
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:
|
|
211
|
-
"aria-label":
|
|
212
|
-
"aria-expanded": !
|
|
213
|
-
onClick:
|
|
215
|
+
class: b(F),
|
|
216
|
+
"aria-label": d.value ? e.expandLabel : e.collapseLabel,
|
|
217
|
+
"aria-expanded": !d.value,
|
|
218
|
+
onClick: E
|
|
214
219
|
}, [
|
|
215
|
-
|
|
216
|
-
name:
|
|
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,
|
|
225
|
+
], 8, we)
|
|
221
226
|
])),
|
|
222
|
-
|
|
223
|
-
(a(!0), l(
|
|
224
|
-
key:
|
|
225
|
-
title:
|
|
226
|
-
collapsed:
|
|
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:
|
|
229
|
-
(a(!0), l(
|
|
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:
|
|
240
|
+
collapsed: d.value,
|
|
236
241
|
active: e.modelValue === p.id,
|
|
237
|
-
onClick: (
|
|
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:
|
|
247
|
+
x(v.$slots, "default", { collapsed: d.value })
|
|
243
248
|
])
|
|
244
249
|
], 2));
|
|
245
250
|
}
|
|
246
|
-
}),
|
|
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__ */
|
|
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 =
|
|
260
|
-
set(
|
|
261
|
-
return u.number ? Number(
|
|
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 (
|
|
269
|
+
return (m, c) => (a(), l("div", Be, [
|
|
265
270
|
s.label ? (a(), l("label", {
|
|
266
271
|
key: 0,
|
|
267
|
-
for:
|
|
272
|
+
for: o.value,
|
|
268
273
|
class: "text-tx-muted text-xs"
|
|
269
|
-
},
|
|
270
|
-
|
|
271
|
-
|
|
272
|
-
id:
|
|
273
|
-
"onUpdate:modelValue":
|
|
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(
|
|
277
|
-
], 16,
|
|
278
|
-
[
|
|
281
|
+
x(m.$slots, "default")
|
|
282
|
+
], 16, Ie), [
|
|
283
|
+
[ee, w(r)]
|
|
279
284
|
]),
|
|
280
|
-
|
|
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
|
-
}),
|
|
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 =
|
|
301
|
+
const s = y(null), t = ne(), n = y(""), o = y(""), r = y(""), u = e;
|
|
297
302
|
return V(async () => {
|
|
298
|
-
n.value = await
|
|
299
|
-
}), (
|
|
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
|
-
|
|
306
|
-
|
|
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,
|
|
316
|
+
}, null, 8, Ae)
|
|
312
317
|
]),
|
|
313
|
-
|
|
314
|
-
|
|
315
|
-
|
|
318
|
+
i("div", Ve, g(u.title), 1),
|
|
319
|
+
i("div", Me, [
|
|
320
|
+
i("span", {
|
|
316
321
|
class: "win-button",
|
|
317
|
-
onClick:
|
|
322
|
+
onClick: c[0] || (c[0] = (d) => w(t).minimize())
|
|
318
323
|
}, [
|
|
319
|
-
|
|
320
|
-
src:
|
|
324
|
+
i("img", {
|
|
325
|
+
src: o.value,
|
|
321
326
|
class: "h-6 w-6 inline-block",
|
|
322
327
|
alt: "Minimize"
|
|
323
|
-
}, null, 8,
|
|
328
|
+
}, null, 8, je)
|
|
324
329
|
]),
|
|
325
|
-
|
|
330
|
+
i("span", {
|
|
326
331
|
class: "win-button",
|
|
327
|
-
onClick:
|
|
332
|
+
onClick: c[1] || (c[1] = (d) => w(t).toggleMaximize())
|
|
328
333
|
}, [
|
|
329
|
-
|
|
330
|
-
src:
|
|
334
|
+
i("img", {
|
|
335
|
+
src: r.value,
|
|
331
336
|
class: "h-6 w-6 inline-block",
|
|
332
337
|
alt: "Maximize"
|
|
333
|
-
}, null, 8,
|
|
338
|
+
}, null, 8, Ee)
|
|
334
339
|
]),
|
|
335
|
-
|
|
340
|
+
i("span", {
|
|
336
341
|
class: "win-button",
|
|
337
|
-
onClick:
|
|
342
|
+
onClick: c[2] || (c[2] = (d) => w(t).close())
|
|
338
343
|
}, [
|
|
339
|
-
|
|
344
|
+
i("img", {
|
|
340
345
|
src: n.value,
|
|
341
346
|
class: "h-6 w-6 inline-block",
|
|
342
347
|
alt: "Close"
|
|
343
|
-
}, null, 8,
|
|
348
|
+
}, null, 8, Oe)
|
|
344
349
|
])
|
|
345
350
|
])
|
|
346
351
|
], 512));
|
|
347
352
|
}
|
|
348
|
-
}),
|
|
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(
|
|
357
|
-
|
|
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
|
-
}),
|
|
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
|
-
},
|
|
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,
|
|
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
|
-
},
|
|
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 = (
|
|
395
|
-
t.stopPropagation &&
|
|
399
|
+
}, u = (m) => {
|
|
400
|
+
t.stopPropagation && m.stopPropagation(), t.preventDefault && m.preventDefault(), !t.disabled && !t.loading && n("click");
|
|
396
401
|
};
|
|
397
|
-
return (
|
|
402
|
+
return (m, c) => (a(), l("button", {
|
|
398
403
|
type: t.type,
|
|
399
404
|
onClick: u,
|
|
400
|
-
class:
|
|
401
|
-
|
|
402
|
-
|
|
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",
|
|
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,
|
|
416
|
-
t.label ? (a(), l("span",
|
|
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,
|
|
423
|
-
], 10,
|
|
427
|
+
}, null, 8, Ge)) : f("", !0)
|
|
428
|
+
], 10, Pe));
|
|
424
429
|
}
|
|
425
|
-
}),
|
|
430
|
+
}), I = (e, s) => {
|
|
426
431
|
const t = e.__vccOpts || e;
|
|
427
|
-
for (const [n,
|
|
428
|
-
t[n] =
|
|
432
|
+
for (const [n, o] of s)
|
|
433
|
+
t[n] = o;
|
|
429
434
|
return t;
|
|
430
|
-
},
|
|
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:
|
|
444
|
+
class: b(["flex flex-col gap-4 p-4 background rounded-corner", e.customClass])
|
|
440
445
|
}, [
|
|
441
|
-
|
|
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
|
-
}),
|
|
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
|
-
},
|
|
453
|
+
}, et = {
|
|
449
454
|
key: 1,
|
|
450
455
|
class: "text-xs text-gray-400 truncate"
|
|
451
|
-
},
|
|
456
|
+
}, tt = {
|
|
452
457
|
key: 2,
|
|
453
458
|
class: "text-xs text-gray-400 flex gap-2 mt-1"
|
|
454
|
-
},
|
|
459
|
+
}, at = {
|
|
455
460
|
key: 1,
|
|
456
461
|
class: "w-2 h-2 rounded-full bg-green-500"
|
|
457
|
-
},
|
|
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
|
-
},
|
|
481
|
+
}, o = () => {
|
|
477
482
|
t("click");
|
|
478
483
|
};
|
|
479
|
-
return (
|
|
480
|
-
class:
|
|
481
|
-
onClick:
|
|
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
|
-
|
|
484
|
-
|
|
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,
|
|
489
|
-
|
|
490
|
-
|
|
491
|
-
e.subtitle ? (a(), l("div",
|
|
492
|
-
e.metadata ? (a(), l("div",
|
|
493
|
-
e.extraInfo && e.extraInfo.length > 0 ? (a(), l("div",
|
|
494
|
-
(a(!0), l(
|
|
495
|
-
])) :
|
|
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:
|
|
502
|
-
},
|
|
503
|
-
e.showStatusIndicator && e.isConnected ? (a(), l("div",
|
|
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
|
-
}),
|
|
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:
|
|
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:
|
|
522
|
-
},
|
|
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
|
-
}),
|
|
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,
|
|
539
|
+
const t = e, n = s, o = () => {
|
|
535
540
|
t.clickable && n("click");
|
|
536
541
|
};
|
|
537
|
-
return (
|
|
538
|
-
class:
|
|
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:
|
|
550
|
+
onClick: o
|
|
546
551
|
}, [
|
|
547
|
-
x(
|
|
552
|
+
x(r.$slots, "default", {}, void 0, !0)
|
|
548
553
|
], 2));
|
|
549
554
|
}
|
|
550
|
-
}),
|
|
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
|
-
},
|
|
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,
|
|
573
|
+
const t = e, n = s, o = k(() => {
|
|
569
574
|
if (t.max <= t.min) return 0;
|
|
570
|
-
const
|
|
571
|
-
return Math.round(
|
|
572
|
-
}),
|
|
573
|
-
const
|
|
574
|
-
n("update:modelValue", Number(
|
|
575
|
-
},
|
|
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 (
|
|
583
|
+
return (c, d) => (a(), l("div", ct, [
|
|
579
584
|
e.showButton ? (a(), l("button", {
|
|
580
585
|
key: 0,
|
|
581
|
-
onClick:
|
|
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
|
-
|
|
589
|
+
i("img", {
|
|
585
590
|
src: e.icon,
|
|
586
591
|
alt: e.alt,
|
|
587
592
|
title: e.tooltip,
|
|
588
|
-
class:
|
|
589
|
-
}, null, 10,
|
|
590
|
-
])) : (a(), l("div",
|
|
591
|
-
|
|
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,
|
|
600
|
+
}, null, 8, mt)
|
|
596
601
|
])),
|
|
597
|
-
|
|
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,
|
|
605
|
-
|
|
606
|
-
class:
|
|
607
|
-
},
|
|
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
|
-
}),
|
|
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,
|
|
627
|
+
const t = e, n = s, o = () => {
|
|
623
628
|
n("toggle", !t.isOn);
|
|
624
629
|
};
|
|
625
|
-
return (
|
|
630
|
+
return (r, u) => (a(), l("button", {
|
|
626
631
|
type: "button",
|
|
627
|
-
onClick:
|
|
632
|
+
onClick: o,
|
|
628
633
|
disabled: e.disabled,
|
|
629
|
-
class:
|
|
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
|
-
|
|
638
|
-
class:
|
|
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,
|
|
649
|
+
], 10, gt));
|
|
645
650
|
}
|
|
646
|
-
}),
|
|
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 (
|
|
667
|
+
return (o, r) => (a(), l("button", {
|
|
663
668
|
onClick: n,
|
|
664
|
-
class:
|
|
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
|
-
|
|
677
|
+
i("img", {
|
|
673
678
|
src: e.icon,
|
|
674
679
|
alt: e.alt,
|
|
675
680
|
title: e.tooltip,
|
|
676
|
-
class:
|
|
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,
|
|
683
|
-
], 10,
|
|
687
|
+
}, null, 10, yt)
|
|
688
|
+
], 10, vt));
|
|
684
689
|
}
|
|
685
|
-
}),
|
|
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
|
-
},
|
|
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),
|
|
708
|
+
const t = s, n = y(!1), o = () => {
|
|
704
709
|
t("click");
|
|
705
710
|
};
|
|
706
|
-
return (
|
|
707
|
-
class:
|
|
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:
|
|
710
|
-
onMouseenter: u[0] || (u[0] = (
|
|
711
|
-
onMouseleave: u[1] || (u[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
|
-
|
|
718
|
+
i("img", {
|
|
714
719
|
src: e.icon,
|
|
715
720
|
alt: e.alt,
|
|
716
|
-
class:
|
|
717
|
-
}, null, 10,
|
|
718
|
-
e.badge !== null && e.badge > 0 ? (a(), l("div",
|
|
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:
|
|
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
|
-
},
|
|
729
|
-
x(
|
|
730
|
-
], 42,
|
|
733
|
+
}, g(e.customTooltipText), 3)) : f("", !0),
|
|
734
|
+
x(r.$slots, "default")
|
|
735
|
+
], 42, pt));
|
|
731
736
|
}
|
|
732
|
-
}),
|
|
733
|
-
|
|
734
|
-
|
|
735
|
-
|
|
736
|
-
|
|
737
|
-
|
|
738
|
-
|
|
739
|
-
Re,
|
|
737
|
+
}), $t = [
|
|
738
|
+
$e,
|
|
739
|
+
W,
|
|
740
|
+
N,
|
|
741
|
+
Le,
|
|
742
|
+
$,
|
|
743
|
+
Fe,
|
|
740
744
|
qe,
|
|
741
|
-
|
|
745
|
+
Ke,
|
|
742
746
|
lt,
|
|
743
|
-
|
|
744
|
-
|
|
745
|
-
|
|
747
|
+
ot,
|
|
748
|
+
rt,
|
|
749
|
+
bt,
|
|
746
750
|
ht,
|
|
747
|
-
|
|
748
|
-
|
|
751
|
+
xt,
|
|
752
|
+
Ct
|
|
753
|
+
], At = {
|
|
749
754
|
install(e) {
|
|
750
|
-
|
|
755
|
+
$t.forEach((s) => {
|
|
751
756
|
e.component(s.name, s);
|
|
752
757
|
});
|
|
753
758
|
}
|
|
754
759
|
};
|
|
755
760
|
export {
|
|
756
|
-
|
|
757
|
-
|
|
758
|
-
|
|
759
|
-
|
|
760
|
-
|
|
761
|
-
|
|
762
|
-
|
|
763
|
-
|
|
764
|
-
|
|
765
|
-
|
|
766
|
-
|
|
767
|
-
|
|
768
|
-
|
|
769
|
-
|
|
770
|
-
|
|
771
|
-
|
|
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
|
};
|
package/dist/vue-libvasak.umd.js
CHANGED
|
@@ -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"}})}));
|