@schwarzdavid/ui-kit 0.0.1-alpha.1 → 0.0.1-alpha.10

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/ui-kit.js DELETED
@@ -1,599 +0,0 @@
1
- import { ref as V, readonly as ne, markRaw as ae, defineComponent as w, openBlock as m, createElementBlock as j, Fragment as L, renderList as K, unref as r, createBlock as g, resolveDynamicComponent as N, mergeProps as O, onMounted as me, withCtx as i, createTextVNode as W, toDisplayString as H, getCurrentInstance as pe, inject as fe, computed as f, TransitionGroup as ve, normalizeClass as oe, createVNode as l, createElementVNode as M, createCommentVNode as k, normalizeProps as le, toValue as Z } from "vue";
2
- import { VAlert as ge, VDialog as X, VCard as J, VCardTitle as re, VBtn as x, VCardText as ue, VCardActions as Y, VToolbar as _e, VToolbarTitle as Ce, VSpacer as ee, VDivider as ye } from "vuetify/components";
3
- import { merge as S } from "lodash";
4
- import { useI18n as Te } from "vue-i18n";
5
- const v = [];
6
- for (let e = 0; e < 256; ++e)
7
- v.push((e + 256).toString(16).slice(1));
8
- function be(e, n = 0) {
9
- return (v[e[n + 0]] + v[e[n + 1]] + v[e[n + 2]] + v[e[n + 3]] + "-" + v[e[n + 4]] + v[e[n + 5]] + "-" + v[e[n + 6]] + v[e[n + 7]] + "-" + v[e[n + 8]] + v[e[n + 9]] + "-" + v[e[n + 10]] + v[e[n + 11]] + v[e[n + 12]] + v[e[n + 13]] + v[e[n + 14]] + v[e[n + 15]]).toLowerCase();
10
- }
11
- let z;
12
- const he = new Uint8Array(16);
13
- function xe() {
14
- if (!z) {
15
- if (typeof crypto > "u" || !crypto.getRandomValues)
16
- throw new Error("crypto.getRandomValues() not supported. See https://github.com/uuidjs/uuid#getrandomvalues-not-supported");
17
- z = crypto.getRandomValues.bind(crypto);
18
- }
19
- return z(he);
20
- }
21
- const Ae = typeof crypto < "u" && crypto.randomUUID && crypto.randomUUID.bind(crypto), te = { randomUUID: Ae };
22
- function se(e, n, t) {
23
- if (te.randomUUID && !n && !e)
24
- return te.randomUUID();
25
- e = e || {};
26
- const a = e.random || (e.rng || xe)();
27
- return a[6] = a[6] & 15 | 64, a[8] = a[8] & 63 | 128, be(a);
28
- }
29
- const R = V([]);
30
- function ce() {
31
- function e() {
32
- let a;
33
- for (; ; )
34
- if (a = se(), !R.value.some((o) => o.id === a))
35
- return a;
36
- }
37
- function n(a) {
38
- const o = e(), c = ae({ ...a, id: o, resolve: (d) => {
39
- t(o), a.resolve(d);
40
- }, reject: (d) => {
41
- t(o), a.reject(d);
42
- } });
43
- return R.value.push(c), c;
44
- }
45
- function t(a) {
46
- const o = typeof a == "string" ? a : a.id, u = R.value.findIndex((s) => s.id === o);
47
- u >= 0 && R.value.splice(u, 1);
48
- }
49
- return {
50
- queue: ne(R),
51
- addToQueue: n,
52
- removeFromQueue: t
53
- };
54
- }
55
- const Ve = /* @__PURE__ */ w({
56
- __name: "DialogOutlet",
57
- setup(e) {
58
- const { queue: n } = ce();
59
- return (t, a) => (m(!0), j(L, null, K(r(n), (o) => (m(), g(N(o.component), O({
60
- key: o.id,
61
- ref_for: !0
62
- }, o.props, {
63
- onResolve: o.resolve,
64
- onReject: o.reject
65
- }), null, 16, ["onResolve", "onReject"]))), 128));
66
- }
67
- }), P = V([]);
68
- function ie() {
69
- function e() {
70
- let a;
71
- for (; ; )
72
- if (a = se(), !P.value.some((o) => o.id === a))
73
- return a;
74
- }
75
- function n(a) {
76
- const o = e(), s = ae({ ...a, id: o, resolve: () => {
77
- t(o), a.resolve();
78
- } });
79
- return P.value.unshift(s), s;
80
- }
81
- function t(a) {
82
- const o = typeof a == "string" ? a : a.id, u = P.value.findIndex((s) => s.id === o);
83
- u >= 0 && P.value.splice(u, 1);
84
- }
85
- return {
86
- queue: ne(P),
87
- addToQueue: n,
88
- removeFromQueue: t
89
- };
90
- }
91
- const we = /* @__PURE__ */ w({
92
- __name: "ToastEntry",
93
- props: {
94
- entry: {}
95
- },
96
- setup(e) {
97
- const n = e, t = ie(), a = V(-1);
98
- function o() {
99
- window.clearTimeout(a.value), t.removeFromQueue(n.entry.id);
100
- }
101
- return me(() => {
102
- a.value = window.setTimeout(() => {
103
- o();
104
- }, n.entry.timeout);
105
- }), (u, s) => (m(), g(r(ge), {
106
- theme: "dark",
107
- class: "toast-entry",
108
- closable: "",
109
- "onClick:close": o
110
- }, {
111
- default: i(() => [
112
- W(H(u.entry.message), 1)
113
- ]),
114
- _: 1
115
- }));
116
- }
117
- }), F = (e, n) => {
118
- const t = e.__vccOpts || e;
119
- for (const [a, o] of n)
120
- t[a] = o;
121
- return t;
122
- }, De = /* @__PURE__ */ F(we, [["__scopeId", "data-v-419b7d95"]]);
123
- function $() {
124
- let e = arguments.length > 0 && arguments[0] !== void 0 ? arguments[0] : "";
125
- if ($.cache.has(e)) return $.cache.get(e);
126
- const n = e.replace(/[^a-z]/gi, "-").replace(/\B([A-Z])/g, "-$1").toLowerCase();
127
- return $.cache.set(e, n), n;
128
- }
129
- $.cache = /* @__PURE__ */ new Map();
130
- function ke(e, n) {
131
- const t = pe();
132
- if (!t)
133
- throw new Error(`[Vuetify] ${e} must be called from inside a setup function`);
134
- return t;
135
- }
136
- function Ee() {
137
- let e = arguments.length > 0 && arguments[0] !== void 0 ? arguments[0] : "composables";
138
- const n = ke(e).type;
139
- return $((n == null ? void 0 : n.aliasName) || (n == null ? void 0 : n.name));
140
- }
141
- const Ie = Symbol.for("vuetify:display");
142
- function de() {
143
- let e = arguments.length > 0 && arguments[0] !== void 0 ? arguments[0] : {}, n = arguments.length > 1 && arguments[1] !== void 0 ? arguments[1] : Ee();
144
- const t = fe(Ie);
145
- if (!t) throw new Error("Could not find Vuetify display injection");
146
- const a = f(() => {
147
- if (e.mobile != null) return e.mobile;
148
- if (!e.mobileBreakpoint) return t.mobile.value;
149
- const u = typeof e.mobileBreakpoint == "number" ? e.mobileBreakpoint : t.thresholds.value[e.mobileBreakpoint];
150
- return t.width.value < u;
151
- }), o = f(() => n ? {
152
- [`${n}--mobile`]: a.value
153
- } : {});
154
- return {
155
- ...t,
156
- displayClasses: o,
157
- mobile: a
158
- };
159
- }
160
- const je = /* @__PURE__ */ w({
161
- __name: "ToastOutlet",
162
- setup(e) {
163
- const { queue: n } = ie(), { mobile: t } = de(), a = f(() => t.value ? "" : "toast-outlet--desktop");
164
- function o(u) {
165
- const { width: s } = u.getBoundingClientRect();
166
- u instanceof HTMLElement && (u.style.width = `${s.toFixed()}px`);
167
- }
168
- return (u, s) => (m(), g(ve, {
169
- name: "fade",
170
- tag: "div",
171
- class: oe(["toast-outlet", a.value]),
172
- onBeforeLeave: o
173
- }, {
174
- default: i(() => [
175
- (m(!0), j(L, null, K(r(n), (c) => (m(), g(De, {
176
- key: c.id,
177
- entry: c
178
- }, null, 8, ["entry"]))), 128))
179
- ]),
180
- _: 1
181
- }, 8, ["class"]));
182
- }
183
- }), Le = /* @__PURE__ */ F(je, [["__scopeId", "data-v-93b5ec8a"]]), He = /* @__PURE__ */ w({
184
- __name: "UiKitOutlet",
185
- setup(e) {
186
- return (n, t) => (m(), j(L, null, [
187
- l(Ve),
188
- l(Le)
189
- ], 64));
190
- }
191
- }), y = /* @__PURE__ */ w({
192
- __name: "MaybeTranslation",
193
- props: {
194
- content: {},
195
- translate: { type: Boolean, default: !0 }
196
- },
197
- setup(e) {
198
- const { t: n } = Te({ useScope: "global" });
199
- return (t, a) => t.translate ? (m(), j(L, { key: 0 }, [
200
- W(H(r(n)(t.content)), 1)
201
- ], 64)) : (m(), j(L, { key: 1 }, [
202
- W(H(t.content), 1)
203
- ], 64));
204
- }
205
- }), Ue = { class: "d-flex justify-space-between pr-2 py-2" }, Re = 650, Pe = /* @__PURE__ */ w({
206
- __name: "InfoDialog",
207
- props: {
208
- data: {}
209
- },
210
- emits: ["resolve", "reject"],
211
- setup(e, { emit: n }) {
212
- const t = e, a = n, o = {
213
- text: "APP.CLOSE",
214
- translateText: !0,
215
- value: null
216
- };
217
- let u = null;
218
- const s = V(!0), c = f(() => Object.hasOwn(t.data, "content") ? {
219
- content: t.data.content,
220
- translateContent: t.data.translateContent
221
- } : null), d = f(() => Object.hasOwn(t.data, "component") ? {
222
- component: t.data.component,
223
- props: t.data.props
224
- } : null), _ = f(() => t.data.defaultCta === !1 ? null : S({}, o, t.data.defaultCta));
225
- function A(p) {
226
- E(p) ? p.action() : b(p.value);
227
- }
228
- function E(p) {
229
- return Object.hasOwn(p, "action");
230
- }
231
- function b(p = null) {
232
- u = p, s.value = !1;
233
- }
234
- function I() {
235
- a("resolve", u);
236
- }
237
- return (p, h) => (m(), g(r(X), {
238
- modelValue: s.value,
239
- "onUpdate:modelValue": h[1] || (h[1] = (C) => s.value = C),
240
- "max-width": p.data.width ?? Re,
241
- onAfterLeave: I
242
- }, {
243
- default: i(() => [
244
- l(r(J), { class: "info-dialog-card" }, {
245
- default: i(() => [
246
- M("div", Ue, [
247
- l(r(re), null, {
248
- default: i(() => [
249
- l(y, {
250
- translate: p.data.translateTitle,
251
- content: p.data.title
252
- }, null, 8, ["translate", "content"])
253
- ]),
254
- _: 1
255
- }),
256
- l(r(x), {
257
- icon: "$close",
258
- variant: "text",
259
- onClick: h[0] || (h[0] = (C) => b(null))
260
- })
261
- ]),
262
- c.value ? (m(), g(r(ue), { key: 0 }, {
263
- default: i(() => [
264
- M("p", null, [
265
- l(y, {
266
- translate: c.value.translateContent,
267
- content: c.value.content
268
- }, null, 8, ["translate", "content"])
269
- ])
270
- ]),
271
- _: 1
272
- })) : k("", !0),
273
- d.value ? (m(), g(N(d.value.component), le(O({ key: 1 }, d.value.props)), null, 16)) : k("", !0),
274
- l(r(Y), { class: "justify-end" }, {
275
- default: i(() => [
276
- (m(!0), j(L, null, K(p.data.additionalCta ?? [], (C, T) => (m(), g(r(x), {
277
- key: T,
278
- color: "primary",
279
- variant: "text",
280
- onClick: () => A(C)
281
- }, {
282
- default: i(() => [
283
- l(y, {
284
- translate: C.translateText,
285
- content: C.text
286
- }, null, 8, ["translate", "content"])
287
- ]),
288
- _: 2
289
- }, 1032, ["onClick"]))), 128)),
290
- _.value ? (m(), g(r(x), {
291
- key: 0,
292
- color: "primary",
293
- variant: "elevated",
294
- onClick: b
295
- }, {
296
- default: i(() => [
297
- l(y, {
298
- translate: _.value.translateText,
299
- content: _.value.text
300
- }, null, 8, ["translate", "content"])
301
- ]),
302
- _: 1
303
- })) : k("", !0)
304
- ]),
305
- _: 1
306
- })
307
- ]),
308
- _: 1
309
- })
310
- ]),
311
- _: 1
312
- }, 8, ["modelValue", "max-width"]));
313
- }
314
- }), $e = /* @__PURE__ */ F(Pe, [["__scopeId", "data-v-ab153f63"]]);
315
- var D = /* @__PURE__ */ ((e) => (e.SMALL = "sm", e.LARGE = "lg", e))(D || {});
316
- const Me = /* @__PURE__ */ w({
317
- __name: "PromptDialog",
318
- props: {
319
- data: {}
320
- },
321
- emits: ["resolve", "reject"],
322
- setup(e, { emit: n }) {
323
- const t = e, a = n, o = {
324
- [D.SMALL]: 650,
325
- [D.LARGE]: 1200
326
- }, u = {
327
- text: "APP.CANCEL",
328
- translateText: !0
329
- }, s = {
330
- text: "APP.SAVE",
331
- translateText: !0
332
- }, c = V(!0), d = V(Z(t.data.initialValue) ?? null), _ = V(null), { mobile: A } = de(), E = f(() => t.data.required && !d.value), b = f(() => o[t.data.size ?? D.SMALL]), I = f(() => t.data.size === D.LARGE ? A.value : !1), p = f(() => S({}, u, t.data.abortCta)), h = f(() => S({}, s, t.data.saveCta)), C = f(() => t.data.size === D.LARGE ? "secondary" : "primary");
333
- function T() {
334
- d.value = Z(t.data.initialValue) ?? null, c.value = !1;
335
- }
336
- function Q() {
337
- c.value = !1;
338
- }
339
- function G() {
340
- if (t.data.required && !d.value) {
341
- a("reject");
342
- return;
343
- }
344
- a("resolve", d.value);
345
- }
346
- return (U, B) => (m(), g(r(X), {
347
- modelValue: c.value,
348
- "onUpdate:modelValue": B[1] || (B[1] = (q) => c.value = q),
349
- "max-width": b.value,
350
- fullscreen: I.value,
351
- scrollable: U.data.size === r(D).LARGE,
352
- onAfterLeave: G
353
- }, {
354
- default: i(() => [
355
- l(r(J), { class: "prompt-dialog-card" }, {
356
- default: i(() => [
357
- l(r(_e), { color: "primary" }, {
358
- default: i(() => [
359
- l(r(Ce), null, {
360
- default: i(() => [
361
- l(y, {
362
- translate: U.data.translateTitle,
363
- content: U.data.title
364
- }, null, 8, ["translate", "content"])
365
- ]),
366
- _: 1
367
- }),
368
- l(r(ee)),
369
- M("div", {
370
- ref_key: "toolbar",
371
- ref: _,
372
- class: "prompt-dialog-toolbar-slot"
373
- }, null, 512),
374
- l(r(x), {
375
- icon: "mdi-close",
376
- onClick: T
377
- })
378
- ]),
379
- _: 1
380
- }),
381
- _.value ? (m(), g(N(U.data.component), O({ key: 0 }, U.data.props, {
382
- modelValue: d.value,
383
- "onUpdate:modelValue": B[0] || (B[0] = (q) => d.value = q),
384
- toolbar: _.value
385
- }), null, 16, ["modelValue", "toolbar"])) : k("", !0),
386
- l(r(ye)),
387
- l(r(Y), null, {
388
- default: i(() => [
389
- l(r(ee)),
390
- l(r(x), {
391
- color: C.value,
392
- onClick: T
393
- }, {
394
- default: i(() => [
395
- l(y, {
396
- translate: p.value.translateText,
397
- content: p.value.text
398
- }, null, 8, ["translate", "content"])
399
- ]),
400
- _: 1
401
- }, 8, ["color"]),
402
- l(r(x), {
403
- variant: "elevated",
404
- color: C.value,
405
- disabled: E.value,
406
- onClick: Q
407
- }, {
408
- default: i(() => [
409
- l(y, {
410
- translate: h.value.translateText,
411
- content: h.value.text
412
- }, null, 8, ["translate", "content"])
413
- ]),
414
- _: 1
415
- }, 8, ["color", "disabled"])
416
- ]),
417
- _: 1
418
- })
419
- ]),
420
- _: 1
421
- })
422
- ]),
423
- _: 1
424
- }, 8, ["modelValue", "max-width", "fullscreen", "scrollable"]));
425
- }
426
- }), Se = /* @__PURE__ */ F(Me, [["__scopeId", "data-v-1f5a0caf"]]), Fe = { class: "d-flex justify-space-between pr-2 py-2" }, Qe = 550, Be = /* @__PURE__ */ w({
427
- __name: "ConfirmDialog",
428
- props: {
429
- data: {}
430
- },
431
- emits: ["resolve", "reject"],
432
- setup(e, { emit: n }) {
433
- const t = e, a = n, o = {
434
- text: "APP.YES",
435
- translateText: !0
436
- }, u = {
437
- text: "APP.NO",
438
- translateText: !0
439
- };
440
- let s = !1;
441
- const c = V(!0), d = f(() => Object.hasOwn(t.data, "content") ? {
442
- content: t.data.content,
443
- translateContent: t.data.translateContent
444
- } : null), _ = f(() => Object.hasOwn(t.data, "component") ? {
445
- component: t.data.component,
446
- props: t.data.props
447
- } : null), A = f(() => S({}, o, t.data.confirmCta)), E = f(() => S({}, u, t.data.rejectCta)), b = f(() => t.data.highlightCta ?? "confirm"), I = f(() => t.data.level ?? "primary");
448
- function p() {
449
- c.value = !1;
450
- }
451
- function h() {
452
- s = !0, c.value = !1;
453
- }
454
- function C() {
455
- if (t.data.throwOnReject && !s) {
456
- a("reject");
457
- return;
458
- }
459
- a("resolve", s);
460
- }
461
- return (T, Q) => (m(), g(r(X), {
462
- modelValue: c.value,
463
- "onUpdate:modelValue": Q[0] || (Q[0] = (G) => c.value = G),
464
- persistent: !!T.data.permanent,
465
- "max-width": T.data.maxWidth ?? Qe,
466
- onAfterLeave: C
467
- }, {
468
- default: i(() => [
469
- l(r(J), { class: "confirm-dialog-card" }, {
470
- default: i(() => [
471
- M("div", Fe, [
472
- l(r(re), null, {
473
- default: i(() => [
474
- l(y, {
475
- translate: T.data.translateTitle,
476
- content: T.data.title
477
- }, null, 8, ["translate", "content"])
478
- ]),
479
- _: 1
480
- }),
481
- T.data.permanent ? k("", !0) : (m(), g(r(x), {
482
- key: 0,
483
- icon: "$close",
484
- variant: "text",
485
- onClick: p
486
- }))
487
- ]),
488
- d.value ? (m(), g(r(ue), { key: 0 }, {
489
- default: i(() => [
490
- l(y, {
491
- translate: d.value.translateContent,
492
- content: d.value.content
493
- }, null, 8, ["translate", "content"])
494
- ]),
495
- _: 1
496
- })) : k("", !0),
497
- _.value ? (m(), g(N(_.value.component), le(O({ key: 1 }, _.value.props)), null, 16)) : k("", !0),
498
- l(r(Y), { class: "justify-end" }, {
499
- default: i(() => [
500
- M("div", {
501
- class: oe(["d-flex align-center", b.value === "confirm" ? "" : "flex-row-reverse"])
502
- }, [
503
- l(r(x), {
504
- variant: b.value === "reject" ? "elevated" : "text",
505
- color: I.value,
506
- onClick: p
507
- }, {
508
- default: i(() => [
509
- l(y, {
510
- translate: E.value.translateText,
511
- content: E.value.text
512
- }, null, 8, ["translate", "content"])
513
- ]),
514
- _: 1
515
- }, 8, ["variant", "color"]),
516
- l(r(x), {
517
- variant: b.value === "confirm" ? "elevated" : "text",
518
- color: I.value,
519
- onClick: h
520
- }, {
521
- default: i(() => [
522
- l(y, {
523
- translate: A.value.translateText,
524
- content: A.value.text
525
- }, null, 8, ["translate", "content"])
526
- ]),
527
- _: 1
528
- }, 8, ["variant", "color"])
529
- ], 2)
530
- ]),
531
- _: 1
532
- })
533
- ]),
534
- _: 1
535
- })
536
- ]),
537
- _: 1
538
- }, 8, ["modelValue", "persistent", "max-width"]));
539
- }
540
- }), Ne = /* @__PURE__ */ F(Be, [["__scopeId", "data-v-634f1f39"]]);
541
- function Ke() {
542
- const e = ce();
543
- function n(o, u) {
544
- let s;
545
- return typeof o == "string" ? s = {
546
- title: o,
547
- content: u ?? ""
548
- } : s = o, new Promise((c) => {
549
- const d = {
550
- component: $e,
551
- props: { data: s },
552
- resolve: c,
553
- reject: () => {
554
- c(null);
555
- }
556
- };
557
- e.addToQueue(d);
558
- });
559
- }
560
- function t(o) {
561
- return new Promise((u, s) => {
562
- const c = {
563
- component: Se,
564
- props: { data: o },
565
- resolve: u,
566
- reject: s
567
- };
568
- e.addToQueue(c);
569
- });
570
- }
571
- function a(o, u, s) {
572
- let c = o;
573
- return typeof o == "string" && typeof u == "string" && (c = {
574
- title: o,
575
- content: u,
576
- level: s
577
- }), new Promise((d, _) => {
578
- const A = {
579
- component: Ne,
580
- props: { data: c },
581
- resolve: d,
582
- reject: _
583
- };
584
- e.addToQueue(A);
585
- });
586
- }
587
- return {
588
- info: n,
589
- prompt: t,
590
- confirm: a
591
- };
592
- }
593
- var Oe = /* @__PURE__ */ ((e) => (e.DEFAULT = "primary", e.WARNING = "warning", e.DANGER = "error", e))(Oe || {});
594
- export {
595
- Oe as ConfirmDialogLevel,
596
- D as PromptDialogSize,
597
- He as UiKitOutlet,
598
- Ke as useDialog
599
- };