@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.
- package/dist/vue-libvasak.es.js +283 -280
- 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,
|
|
8
|
-
async function
|
|
9
|
-
const
|
|
10
|
-
if (!
|
|
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
|
|
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
|
-
}), M(e,
|
|
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 ne = ["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
|
-
}, N = /* @__PURE__ */
|
|
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,
|
|
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
|
-
B(
|
|
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 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:
|
|
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(), T(
|
|
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,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,
|
|
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
|
+
}
|
|
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 && (
|
|
180
|
+
v !== void 0 && (r.value = v);
|
|
178
181
|
}
|
|
179
182
|
), V(() => {
|
|
180
|
-
|
|
181
|
-
}),
|
|
182
|
-
|
|
183
|
-
}), s({ collapsed:
|
|
184
|
-
class:
|
|
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
|
-
|
|
187
|
-
|
|
188
|
-
|
|
189
|
+
j.value || v.$slots.header ? (a(), l("header", be, [
|
|
190
|
+
i("div", ge, [
|
|
191
|
+
i("button", {
|
|
189
192
|
type: "button",
|
|
190
|
-
class:
|
|
191
|
-
"aria-label":
|
|
192
|
-
"aria-expanded": !
|
|
193
|
-
onClick:
|
|
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(
|
|
196
|
-
name:
|
|
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,
|
|
201
|
-
|
|
202
|
-
e.title ? (a(), l("p",
|
|
203
|
-
e.subtitle ? (a(), l("p",
|
|
204
|
-
])) :
|
|
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 && !
|
|
207
|
-
x(v.$slots, "header", { collapsed:
|
|
208
|
-
])) :
|
|
209
|
-
])) : (a(), l("div",
|
|
210
|
-
|
|
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:
|
|
213
|
-
"aria-label":
|
|
214
|
-
"aria-expanded": !
|
|
215
|
-
onClick:
|
|
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(
|
|
218
|
-
name:
|
|
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,
|
|
225
|
+
], 8, we)
|
|
223
226
|
])),
|
|
224
|
-
|
|
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:
|
|
231
|
+
collapsed: d.value
|
|
229
232
|
}, {
|
|
230
|
-
default:
|
|
231
|
-
(a(!0), l(z, null, A(L.items, (p) => (a(), T(
|
|
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:
|
|
240
|
+
collapsed: d.value,
|
|
238
241
|
active: e.modelValue === p.id,
|
|
239
|
-
onClick: (
|
|
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:
|
|
247
|
+
x(v.$slots, "default", { collapsed: d.value })
|
|
245
248
|
])
|
|
246
249
|
], 2));
|
|
247
250
|
}
|
|
248
|
-
}),
|
|
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__ */
|
|
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 =
|
|
262
|
-
set(
|
|
263
|
-
return
|
|
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 (
|
|
269
|
+
return (m, c) => (a(), l("div", Be, [
|
|
267
270
|
s.label ? (a(), l("label", {
|
|
268
271
|
key: 0,
|
|
269
|
-
for:
|
|
272
|
+
for: o.value,
|
|
270
273
|
class: "text-tx-muted text-xs"
|
|
271
|
-
},
|
|
272
|
-
|
|
273
|
-
|
|
274
|
-
id:
|
|
275
|
-
"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),
|
|
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(
|
|
279
|
-
], 16,
|
|
280
|
-
[
|
|
281
|
+
x(m.$slots, "default")
|
|
282
|
+
], 16, Ie), [
|
|
283
|
+
[ee, w(r)]
|
|
281
284
|
]),
|
|
282
|
-
B(
|
|
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
|
-
}),
|
|
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 =
|
|
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"),
|
|
301
|
-
}), (
|
|
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
|
-
|
|
308
|
-
|
|
309
|
-
src:
|
|
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:
|
|
313
|
-
}, null, 8,
|
|
315
|
+
alt: u.title
|
|
316
|
+
}, null, 8, Ae)
|
|
314
317
|
]),
|
|
315
|
-
|
|
316
|
-
|
|
317
|
-
|
|
318
|
+
i("div", Ve, g(u.title), 1),
|
|
319
|
+
i("div", Me, [
|
|
320
|
+
i("span", {
|
|
318
321
|
class: "win-button",
|
|
319
|
-
onClick:
|
|
322
|
+
onClick: c[0] || (c[0] = (d) => w(t).minimize())
|
|
320
323
|
}, [
|
|
321
|
-
|
|
322
|
-
src:
|
|
324
|
+
i("img", {
|
|
325
|
+
src: o.value,
|
|
323
326
|
class: "h-6 w-6 inline-block",
|
|
324
327
|
alt: "Minimize"
|
|
325
|
-
}, null, 8,
|
|
328
|
+
}, null, 8, je)
|
|
326
329
|
]),
|
|
327
|
-
|
|
330
|
+
i("span", {
|
|
328
331
|
class: "win-button",
|
|
329
|
-
onClick:
|
|
332
|
+
onClick: c[1] || (c[1] = (d) => w(t).toggleMaximize())
|
|
330
333
|
}, [
|
|
331
|
-
|
|
332
|
-
src:
|
|
334
|
+
i("img", {
|
|
335
|
+
src: r.value,
|
|
333
336
|
class: "h-6 w-6 inline-block",
|
|
334
337
|
alt: "Maximize"
|
|
335
|
-
}, null, 8,
|
|
338
|
+
}, null, 8, Ee)
|
|
336
339
|
]),
|
|
337
|
-
|
|
340
|
+
i("span", {
|
|
338
341
|
class: "win-button",
|
|
339
|
-
onClick:
|
|
342
|
+
onClick: c[2] || (c[2] = (d) => w(t).close())
|
|
340
343
|
}, [
|
|
341
|
-
|
|
344
|
+
i("img", {
|
|
342
345
|
src: n.value,
|
|
343
346
|
class: "h-6 w-6 inline-block",
|
|
344
347
|
alt: "Close"
|
|
345
|
-
}, null, 8,
|
|
348
|
+
}, null, 8, Oe)
|
|
346
349
|
])
|
|
347
350
|
])
|
|
348
351
|
], 512));
|
|
349
352
|
}
|
|
350
|
-
}),
|
|
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(
|
|
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
|
-
}),
|
|
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
|
-
},
|
|
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,
|
|
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
|
-
},
|
|
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
|
-
},
|
|
397
|
-
t.stopPropagation &&
|
|
399
|
+
}, u = (m) => {
|
|
400
|
+
t.stopPropagation && m.stopPropagation(), t.preventDefault && m.preventDefault(), !t.disabled && !t.loading && n("click");
|
|
398
401
|
};
|
|
399
|
-
return (
|
|
402
|
+
return (m, c) => (a(), l("button", {
|
|
400
403
|
type: t.type,
|
|
401
|
-
onClick:
|
|
402
|
-
class:
|
|
403
|
-
|
|
404
|
-
|
|
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",
|
|
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,
|
|
418
|
-
t.label ? (a(), l("span",
|
|
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,
|
|
425
|
-
], 10,
|
|
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,
|
|
430
|
-
t[n] =
|
|
432
|
+
for (const [n, o] of s)
|
|
433
|
+
t[n] = o;
|
|
431
434
|
return t;
|
|
432
|
-
},
|
|
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:
|
|
444
|
+
class: b(["flex flex-col gap-4 p-4 background rounded-corner", e.customClass])
|
|
442
445
|
}, [
|
|
443
|
-
|
|
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
|
-
}),
|
|
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
|
-
},
|
|
453
|
+
}, et = {
|
|
451
454
|
key: 1,
|
|
452
455
|
class: "text-xs text-gray-400 truncate"
|
|
453
|
-
},
|
|
456
|
+
}, tt = {
|
|
454
457
|
key: 2,
|
|
455
458
|
class: "text-xs text-gray-400 flex gap-2 mt-1"
|
|
456
|
-
},
|
|
459
|
+
}, at = {
|
|
457
460
|
key: 1,
|
|
458
461
|
class: "w-2 h-2 rounded-full bg-green-500"
|
|
459
|
-
},
|
|
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
|
-
},
|
|
481
|
+
}, o = () => {
|
|
479
482
|
t("click");
|
|
480
483
|
};
|
|
481
|
-
return (
|
|
482
|
-
class:
|
|
483
|
-
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
|
|
484
487
|
}, [
|
|
485
|
-
|
|
486
|
-
|
|
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,
|
|
491
|
-
|
|
492
|
-
|
|
493
|
-
e.subtitle ? (a(), l("div",
|
|
494
|
-
e.metadata ? (a(), l("div",
|
|
495
|
-
e.extraInfo && e.extraInfo.length > 0 ? (a(), l("div",
|
|
496
|
-
(a(!0), l(z, null, A(e.extraInfo, (
|
|
497
|
-
])) :
|
|
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:
|
|
504
|
-
},
|
|
505
|
-
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)
|
|
506
509
|
], 2));
|
|
507
510
|
}
|
|
508
|
-
}),
|
|
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:
|
|
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:
|
|
524
|
-
},
|
|
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
|
-
}),
|
|
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,
|
|
539
|
+
const t = e, n = s, o = () => {
|
|
537
540
|
t.clickable && n("click");
|
|
538
541
|
};
|
|
539
|
-
return (
|
|
540
|
-
class:
|
|
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:
|
|
550
|
+
onClick: o
|
|
548
551
|
}, [
|
|
549
|
-
x(
|
|
552
|
+
x(r.$slots, "default", {}, void 0, !0)
|
|
550
553
|
], 2));
|
|
551
554
|
}
|
|
552
|
-
}),
|
|
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
|
-
},
|
|
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,
|
|
573
|
+
const t = e, n = s, o = k(() => {
|
|
571
574
|
if (t.max <= t.min) return 0;
|
|
572
|
-
const
|
|
573
|
-
return Math.round(
|
|
574
|
-
}),
|
|
575
|
-
const
|
|
576
|
-
n("update:modelValue", Number(
|
|
577
|
-
},
|
|
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 (
|
|
583
|
+
return (c, d) => (a(), l("div", ct, [
|
|
581
584
|
e.showButton ? (a(), l("button", {
|
|
582
585
|
key: 0,
|
|
583
|
-
onClick:
|
|
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
|
-
|
|
589
|
+
i("img", {
|
|
587
590
|
src: e.icon,
|
|
588
591
|
alt: e.alt,
|
|
589
592
|
title: e.tooltip,
|
|
590
|
-
class:
|
|
591
|
-
}, null, 10,
|
|
592
|
-
])) : (a(), l("div",
|
|
593
|
-
|
|
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,
|
|
600
|
+
}, null, 8, mt)
|
|
598
601
|
])),
|
|
599
|
-
|
|
602
|
+
i("input", {
|
|
600
603
|
type: "range",
|
|
601
604
|
min: e.min,
|
|
602
605
|
max: e.max,
|
|
603
606
|
value: e.modelValue,
|
|
604
|
-
onInput:
|
|
607
|
+
onInput: u,
|
|
605
608
|
class: "flex-1 transition-all duration-200 hover:scale-105"
|
|
606
|
-
}, null, 40,
|
|
607
|
-
|
|
608
|
-
class:
|
|
609
|
-
},
|
|
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
|
-
}),
|
|
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,
|
|
627
|
+
const t = e, n = s, o = () => {
|
|
625
628
|
n("toggle", !t.isOn);
|
|
626
629
|
};
|
|
627
|
-
return (
|
|
630
|
+
return (r, u) => (a(), l("button", {
|
|
628
631
|
type: "button",
|
|
629
|
-
onClick:
|
|
632
|
+
onClick: o,
|
|
630
633
|
disabled: e.disabled,
|
|
631
|
-
class:
|
|
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
|
-
|
|
640
|
-
class:
|
|
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,
|
|
649
|
+
], 10, gt));
|
|
647
650
|
}
|
|
648
|
-
}),
|
|
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 (
|
|
667
|
+
return (o, r) => (a(), l("button", {
|
|
665
668
|
onClick: n,
|
|
666
|
-
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", {
|
|
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
|
-
|
|
677
|
+
i("img", {
|
|
675
678
|
src: e.icon,
|
|
676
679
|
alt: e.alt,
|
|
677
680
|
title: e.tooltip,
|
|
678
|
-
class:
|
|
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,
|
|
685
|
-
], 10,
|
|
687
|
+
}, null, 10, yt)
|
|
688
|
+
], 10, vt));
|
|
686
689
|
}
|
|
687
|
-
}),
|
|
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
|
-
},
|
|
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),
|
|
708
|
+
const t = s, n = y(!1), o = () => {
|
|
706
709
|
t("click");
|
|
707
710
|
};
|
|
708
|
-
return (
|
|
709
|
-
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]),
|
|
710
713
|
title: e.tooltip,
|
|
711
|
-
onClick:
|
|
712
|
-
onMouseenter:
|
|
713
|
-
onMouseleave:
|
|
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
|
-
|
|
718
|
+
i("img", {
|
|
716
719
|
src: e.icon,
|
|
717
720
|
alt: e.alt,
|
|
718
|
-
class:
|
|
719
|
-
}, null, 10,
|
|
720
|
-
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),
|
|
721
724
|
e.showCustomTooltip && e.customTooltipText ? (a(), l("div", {
|
|
722
725
|
key: 1,
|
|
723
|
-
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", [
|
|
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
|
-
},
|
|
731
|
-
x(
|
|
732
|
-
], 42,
|
|
733
|
+
}, g(e.customTooltipText), 3)) : f("", !0),
|
|
734
|
+
x(r.$slots, "default")
|
|
735
|
+
], 42, pt));
|
|
733
736
|
}
|
|
734
|
-
}),
|
|
735
|
-
|
|
736
|
-
|
|
737
|
+
}), $t = [
|
|
738
|
+
$e,
|
|
739
|
+
W,
|
|
737
740
|
N,
|
|
738
|
-
|
|
739
|
-
|
|
740
|
-
|
|
741
|
-
|
|
742
|
-
|
|
743
|
-
|
|
744
|
-
nt,
|
|
741
|
+
Le,
|
|
742
|
+
$,
|
|
743
|
+
Fe,
|
|
744
|
+
qe,
|
|
745
|
+
Ke,
|
|
746
|
+
lt,
|
|
745
747
|
ot,
|
|
746
|
-
|
|
748
|
+
rt,
|
|
747
749
|
bt,
|
|
748
|
-
|
|
749
|
-
|
|
750
|
-
|
|
750
|
+
ht,
|
|
751
|
+
xt,
|
|
752
|
+
Ct
|
|
753
|
+
], At = {
|
|
751
754
|
install(e) {
|
|
752
|
-
|
|
755
|
+
$t.forEach((s) => {
|
|
753
756
|
e.component(s.name, s);
|
|
754
757
|
});
|
|
755
758
|
}
|
|
756
759
|
};
|
|
757
760
|
export {
|
|
758
|
-
|
|
759
|
-
|
|
760
|
-
|
|
761
|
-
|
|
762
|
-
|
|
763
|
-
|
|
764
|
-
|
|
765
|
-
|
|
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
|
-
|
|
768
|
-
|
|
769
|
-
|
|
770
|
-
|
|
771
|
-
|
|
772
|
-
|
|
773
|
-
|
|
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
|
};
|
package/dist/vue-libvasak.umd.js
CHANGED
|
@@ -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"}})}));
|