golden-logic-ui 1.3.7 → 1.3.9
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { ref as c, shallowRef as Y, onMounted as ve, onBeforeUnmount as me, watch as M, createElementBlock as f, openBlock as v, Fragment as Z, createCommentVNode as
|
|
1
|
+
import { ref as c, shallowRef as Y, onMounted as ve, onBeforeUnmount as me, watch as M, createElementBlock as f, openBlock as v, Fragment as Z, createCommentVNode as h, normalizeClass as B, createElementVNode as s, toDisplayString as b, withDirectives as F, withModifiers as ee, vShow as te, vModelText as ge, renderList as pe, nextTick as he } from "vue";
|
|
2
2
|
const ye = { class: "font-bold ptext-lg dark:text-white" }, xe = { class: "mt-3 mb-4" }, we = {
|
|
3
3
|
key: 0,
|
|
4
4
|
class: "bg-blue-100 text-blue-800 text-sm font-medium mb-2 mt-2 me-2 px-2.5 py-0.5 rounded-sm dark:bg-blue-900 dark:text-blue-300"
|
|
@@ -8,20 +8,20 @@ const ye = { class: "font-bold ptext-lg dark:text-white" }, xe = { class: "mt-3
|
|
|
8
8
|
}, Se = { class: "relative focus:ring-blue-500 focus:border-blue-500 dark:border-gray-600 dark:focus:ring-blue-500 dark:focus:border-blue-500" }, _e = { class: "relative showOptions" }, Ce = ["value", "placeholder"], De = { class: "text-gray-700 bg-white border dark:border-gray-700 dark:bg-gray-800 dark:text-gray-200 absolute w-full z-999999999 rounded-md mt-1 pt-1" }, Oe = {
|
|
9
9
|
key: 0,
|
|
10
10
|
class: "border-b border-gray-200 dark:border-gray-700"
|
|
11
|
-
}, Ee = { class: "relative" }, Be = ["id", "placeholder"], $e = { class: "flex items-center py-2 pr-4" }, Le = ["onClick", "onMousedown", "id"], Me = { class: "flex justify-between items-center py-2" }, Ie = ["innerHTML"],
|
|
11
|
+
}, Ee = { class: "relative" }, Be = ["id", "placeholder"], $e = { class: "flex items-center py-2 pr-4" }, Le = ["onClick", "onMousedown", "id"], Me = { class: "flex justify-between items-center py-2" }, Ie = ["innerHTML"], je = {
|
|
12
12
|
key: 0,
|
|
13
13
|
class: "flex items-center shrink-0 w-4 h-4 text-green-500 ltr:right-2 rtl:left-2 dark:text-green-400",
|
|
14
14
|
"aria-hidden": "true",
|
|
15
15
|
xmlns: "http://www.w3.org/2000/svg",
|
|
16
16
|
fill: "none",
|
|
17
17
|
viewBox: "0 0 16 12"
|
|
18
|
-
},
|
|
18
|
+
}, Te = {
|
|
19
19
|
key: 2,
|
|
20
20
|
class: "p-2 text-center text-gray-500"
|
|
21
|
-
},
|
|
21
|
+
}, Ue = {
|
|
22
22
|
key: 3,
|
|
23
23
|
class: "p-2 text-gray-500"
|
|
24
|
-
},
|
|
24
|
+
}, Ae = { class: "block mt-1 text-sm font-normal leading-5 text-red-500" }, qe = { class: "block mt-1 text-sm font-normal leading-5 text-gray-500" }, Ne = {
|
|
25
25
|
__name: "GlDropdown",
|
|
26
26
|
props: {
|
|
27
27
|
modelValue: {
|
|
@@ -110,19 +110,19 @@ const ye = { class: "font-bold ptext-lg dark:text-white" }, xe = { class: "mt-3
|
|
|
110
110
|
},
|
|
111
111
|
emits: ["update:modelValue", "selected", "selectionChanged"],
|
|
112
112
|
setup(r, { emit: le }) {
|
|
113
|
-
const o = r,
|
|
114
|
-
let E = !1,
|
|
115
|
-
const z = (e) => e?.name === "CanceledError" || e?.name === "AbortError" || typeof axios < "u" && axios.isCancel?.(e),
|
|
113
|
+
const o = r, k = le, a = c({}), T = c(!1), y = c(0), x = c(!1), m = c(""), g = c(""), $ = c(!1), S = c(1), _ = c(null), L = c(1), i = Y([]), O = c(!1), I = Y([]), U = c([]), ne = c(null), H = c(null);
|
|
114
|
+
let E = !1, p = null, A = 0, C = null;
|
|
115
|
+
const z = (e) => e?.name === "CanceledError" || e?.name === "AbortError" || typeof axios < "u" && axios.isCancel?.(e), q = async (e = "down") => {
|
|
116
116
|
if ($.value || !o.api_url) return;
|
|
117
|
-
|
|
118
|
-
const t = ++
|
|
117
|
+
p && p.abort(), p = new AbortController();
|
|
118
|
+
const t = ++A;
|
|
119
119
|
$.value = !0;
|
|
120
120
|
try {
|
|
121
|
-
const l = e === "up" ? Math.max(
|
|
121
|
+
const l = e === "up" ? Math.max(S.value - 1, L.value) : S.value, { data: n } = await axios.get(o.api_url, {
|
|
122
122
|
params: { search: m.value, page: l, per_page: 20 },
|
|
123
|
-
signal:
|
|
123
|
+
signal: p.signal
|
|
124
124
|
});
|
|
125
|
-
if (E || t !==
|
|
125
|
+
if (E || t !== A) return;
|
|
126
126
|
if (!n || !n.data) {
|
|
127
127
|
i.value = [], O.value = !1;
|
|
128
128
|
return;
|
|
@@ -130,14 +130,14 @@ const ye = { class: "font-bold ptext-lg dark:text-white" }, xe = { class: "mt-3
|
|
|
130
130
|
const u = W(n.data);
|
|
131
131
|
if (e === "down") {
|
|
132
132
|
const d = i.value.length ? i.value.concat(u) : u, D = a.value;
|
|
133
|
-
|
|
133
|
+
w(D) && D.id !== void 0 && D.name && !d.some((j) => String(j.id) === String(D.id)) && d.unshift(D), i.value = d, S.value++, _.value = n.last_page, O.value = !0;
|
|
134
134
|
}
|
|
135
|
-
|
|
135
|
+
_.value || (_.value = n.last_page), L.value || (L.value = 1);
|
|
136
136
|
} catch (l) {
|
|
137
137
|
if (z(l)) return;
|
|
138
138
|
console.error("Error fetching data:", l);
|
|
139
139
|
} finally {
|
|
140
|
-
!E && t ===
|
|
140
|
+
!E && t === A && ($.value = !1, p = null);
|
|
141
141
|
}
|
|
142
142
|
}, ae = async (e) => {
|
|
143
143
|
if (!o.api_url || e === null || e === void 0 || e === "") return null;
|
|
@@ -170,23 +170,23 @@ const ye = { class: "font-bold ptext-lg dark:text-white" }, xe = { class: "mt-3
|
|
|
170
170
|
E || (u ? (a.value = u, i.value.some((d) => String(d.id) === String(u.id)) || (i.value = [u, ...i.value])) : o.allow_custom ? a.value = { id: t, name: t } : a.value = { id: t, name: "" });
|
|
171
171
|
}, re = (e) => {
|
|
172
172
|
const t = e.target;
|
|
173
|
-
t && t.scrollHeight - t.clientHeight <= t.scrollTop + 10 &&
|
|
173
|
+
t && t.scrollHeight - t.clientHeight <= t.scrollTop + 10 && S.value <= _.value && q("down");
|
|
174
174
|
}, K = (e) => {
|
|
175
|
-
e.target && (document.activeElement.classList.contains("showOptions" + g.value) ? x.value ||
|
|
176
|
-
},
|
|
175
|
+
e.target && (document.activeElement.classList.contains("showOptions" + g.value) ? x.value || V() : e.target.id != o.field_name + "search" + g.value && e.target.id != o.field_name && !e.target.classList.contains("showOptions" + g.value) && (R(), y.value = 0, x.value = !1));
|
|
176
|
+
}, V = () => {
|
|
177
177
|
if (!o.show) {
|
|
178
178
|
if (x.value) {
|
|
179
179
|
x.value = !1;
|
|
180
180
|
return;
|
|
181
181
|
}
|
|
182
|
-
m.value = "", x.value = !0, o.api_url && (!O.value || i.value.length === 0) && (
|
|
182
|
+
m.value = "", x.value = !0, o.api_url && (!O.value || i.value.length === 0) && (S.value = 1, _.value = null, i.value = [], O.value = !1, q("down")), he(() => {
|
|
183
183
|
const e = document.getElementById(
|
|
184
184
|
`${o.field_name}search${g.value}`
|
|
185
185
|
);
|
|
186
186
|
e && e.focus();
|
|
187
187
|
});
|
|
188
188
|
}
|
|
189
|
-
},
|
|
189
|
+
}, N = () => {
|
|
190
190
|
const e = (t) => {
|
|
191
191
|
if (o.allow_custom && t) {
|
|
192
192
|
const l = typeof t == "object" ? t.id : t;
|
|
@@ -194,7 +194,7 @@ const ye = { class: "font-bold ptext-lg dark:text-white" }, xe = { class: "mt-3
|
|
|
194
194
|
}
|
|
195
195
|
return {};
|
|
196
196
|
};
|
|
197
|
-
return
|
|
197
|
+
return w(a.value) ? typeof a.value == "object" ? i.value.find(
|
|
198
198
|
(t) => String(t.id) === String(a.value.id)
|
|
199
199
|
) || e(a.value) : i.value.find(
|
|
200
200
|
(t) => String(t.id) === String(a.value)
|
|
@@ -207,7 +207,7 @@ const ye = { class: "font-bold ptext-lg dark:text-white" }, xe = { class: "mt-3
|
|
|
207
207
|
ve(() => {
|
|
208
208
|
g.value = ue(), o.show || (document.body.addEventListener("click", G), document.addEventListener("focusin", K));
|
|
209
209
|
}), me(() => {
|
|
210
|
-
E = !0,
|
|
210
|
+
E = !0, p && (p.abort(), p = null), C && (clearTimeout(C), C = null), document.body.removeEventListener("click", G), document.removeEventListener("focusin", K);
|
|
211
211
|
});
|
|
212
212
|
function ie() {
|
|
213
213
|
const e = I.value, t = o.maxItem, l = m.value;
|
|
@@ -215,8 +215,8 @@ const ye = { class: "font-bold ptext-lg dark:text-white" }, xe = { class: "mt-3
|
|
|
215
215
|
return e.length > t ? e.slice(0, t) : e;
|
|
216
216
|
const n = l.toLowerCase(), u = [];
|
|
217
217
|
for (let d = 0, D = e.length; d < D && u.length < t; d++) {
|
|
218
|
-
const
|
|
219
|
-
String(
|
|
218
|
+
const j = e[d];
|
|
219
|
+
String(j.name).toLowerCase().includes(n) && u.push(j);
|
|
220
220
|
}
|
|
221
221
|
return u;
|
|
222
222
|
}
|
|
@@ -240,11 +240,11 @@ const ye = { class: "font-bold ptext-lg dark:text-white" }, xe = { class: "mt-3
|
|
|
240
240
|
return e = Math.floor(e / 16), (t === "x" ? l : l & 3 | 8).toString(16);
|
|
241
241
|
});
|
|
242
242
|
}
|
|
243
|
-
function
|
|
243
|
+
function w(e) {
|
|
244
244
|
return e && typeof e == "object" && Object.keys(e).length > 0;
|
|
245
245
|
}
|
|
246
246
|
function G(e) {
|
|
247
|
-
e.target.id != o.field_name + "search" + g.value && e.target.id != o.field_name && !e.target.classList.contains("showOptions" + g.value) && (
|
|
247
|
+
e.target.id != o.field_name + "search" + g.value && e.target.id != o.field_name && !e.target.classList.contains("showOptions" + g.value) && (R(), y.value = 0, x.value = !1);
|
|
248
248
|
}
|
|
249
249
|
function J(e) {
|
|
250
250
|
const t = `${e}${g.value}`, l = document.getElementById(t), n = H.value;
|
|
@@ -278,15 +278,15 @@ const ye = { class: "font-bold ptext-lg dark:text-white" }, xe = { class: "mt-3
|
|
|
278
278
|
}
|
|
279
279
|
function X() {
|
|
280
280
|
const e = m.value, t = { id: e, name: e }, l = String(e);
|
|
281
|
-
U.value.some((n) => String(n.id) === l) || U.value.push(t), i.value.some((n) => String(n.id) === l) || (i.value = [...i.value, t], I.value = [...I.value, t]),
|
|
281
|
+
U.value.some((n) => String(n.id) === l) || U.value.push(t), i.value.some((n) => String(n.id) === l) || (i.value = [...i.value, t], I.value = [...I.value, t]), P(t);
|
|
282
282
|
}
|
|
283
|
-
function
|
|
284
|
-
|
|
283
|
+
function P(e) {
|
|
284
|
+
T.value = !0, a.value = e, x.value = !1, k("update:modelValue", a.value.id), k("selected", a.value), k("selectionChanged", a.value);
|
|
285
285
|
}
|
|
286
286
|
function fe() {
|
|
287
|
-
o.show || (a.value = {}, m.value = "",
|
|
287
|
+
o.show || (a.value = {}, m.value = "", k("update:modelValue", ""), k("selected", a.value), k("selectionChanged", a.value), V());
|
|
288
288
|
}
|
|
289
|
-
function
|
|
289
|
+
function R() {
|
|
290
290
|
(!a.value || !a.value.id) && (a.value = {}, m.value = "");
|
|
291
291
|
}
|
|
292
292
|
return M(m, () => {
|
|
@@ -294,15 +294,15 @@ const ye = { class: "font-bold ptext-lg dark:text-white" }, xe = { class: "mt-3
|
|
|
294
294
|
i.value = ie(), i.value.length === 0 && (a.value = {});
|
|
295
295
|
return;
|
|
296
296
|
}
|
|
297
|
-
|
|
298
|
-
|
|
297
|
+
C && clearTimeout(C), C = setTimeout(() => {
|
|
298
|
+
C = null, !E && (S.value = 1, _.value = null, L.value = 1, i.value = [], O.value = !1, q("down"));
|
|
299
299
|
}, 250);
|
|
300
300
|
}), M(a, (e) => {
|
|
301
|
-
|
|
301
|
+
w(e) && e.id !== o.modelValue && k("update:modelValue", e.id);
|
|
302
302
|
}), M(
|
|
303
303
|
() => o.api_url,
|
|
304
304
|
() => {
|
|
305
|
-
|
|
305
|
+
p && (p.abort(), p = null), S.value = 1, _.value = null, L.value = 1, i.value = [], O.value = !1;
|
|
306
306
|
},
|
|
307
307
|
{ immediate: !0 }
|
|
308
308
|
), M(
|
|
@@ -312,7 +312,8 @@ const ye = { class: "font-bold ptext-lg dark:text-white" }, xe = { class: "mt-3
|
|
|
312
312
|
a.value = {};
|
|
313
313
|
return;
|
|
314
314
|
}
|
|
315
|
-
|
|
315
|
+
const t = typeof e == "object" ? e.id : e;
|
|
316
|
+
w(a.value) && String(a.value.id) !== String(t) && (a.value = {}, T.value = !1), o.api_url ? T.value ? a.value = N() : await oe(e) : a.value = N();
|
|
316
317
|
},
|
|
317
318
|
{ immediate: !0 }
|
|
318
319
|
), M(
|
|
@@ -324,7 +325,7 @@ const ye = { class: "font-bold ptext-lg dark:text-white" }, xe = { class: "mt-3
|
|
|
324
325
|
const u = String(n.id);
|
|
325
326
|
t.has(u) || (l.push(n), t.add(u));
|
|
326
327
|
}
|
|
327
|
-
I.value = l, i.value = l, a.value =
|
|
328
|
+
I.value = l, i.value = l, a.value = N();
|
|
328
329
|
}
|
|
329
330
|
},
|
|
330
331
|
// deep so the list still updates when options load late by mutating the SAME
|
|
@@ -336,13 +337,13 @@ const ye = { class: "font-bold ptext-lg dark:text-white" }, xe = { class: "mt-3
|
|
|
336
337
|
key: 0,
|
|
337
338
|
class: B(r.field_name)
|
|
338
339
|
}, [
|
|
339
|
-
s("h3", ye,
|
|
340
|
+
s("h3", ye, b(r.label_name), 1),
|
|
340
341
|
s("p", xe, [
|
|
341
|
-
|
|
342
|
+
w(a.value) ? (v(), f("span", we, b(a.value?.name), 1)) : h("", !0)
|
|
342
343
|
]),
|
|
343
344
|
t[6] || (t[6] = s("hr", { class: "opacity-100! bg-gray-200 border-0 dark:bg-gray-700" }, null, -1))
|
|
344
|
-
], 2)) :
|
|
345
|
-
r.show ?
|
|
345
|
+
], 2)) : h("", !0),
|
|
346
|
+
r.show ? h("", !0) : (v(), f("div", {
|
|
346
347
|
key: 1,
|
|
347
348
|
class: B(r.field_name)
|
|
348
349
|
}, [
|
|
@@ -360,7 +361,7 @@ const ye = { class: "font-bold ptext-lg dark:text-white" }, xe = { class: "mt-3
|
|
|
360
361
|
"gl-label-form-invalid": r.error_message !== "",
|
|
361
362
|
required: r.is_required
|
|
362
363
|
})
|
|
363
|
-
},
|
|
364
|
+
}, b(r.label_name), 3)) : h("", !0),
|
|
364
365
|
s("div", Se, [
|
|
365
366
|
s("div", _e, [
|
|
366
367
|
s("input", {
|
|
@@ -370,15 +371,15 @@ const ye = { class: "font-bold ptext-lg dark:text-white" }, xe = { class: "mt-3
|
|
|
370
371
|
"gl-input-form": r.error_message == "",
|
|
371
372
|
"gl-input-form-invalid": r.error_message !== "",
|
|
372
373
|
[`showOptions${g.value}`]: !0,
|
|
373
|
-
"pr-14!":
|
|
374
|
-
"pr-8!": !(
|
|
374
|
+
"pr-14!": w(a.value) && r.has_cancel,
|
|
375
|
+
"pr-8!": !(w(a.value) && r.has_cancel)
|
|
375
376
|
}, "truncate showOptions1"]),
|
|
376
377
|
value: a.value?.name,
|
|
377
378
|
placeholder: r.placeholder,
|
|
378
379
|
autocomplete: "off",
|
|
379
380
|
readonly: ""
|
|
380
381
|
}, null, 10, Ce),
|
|
381
|
-
|
|
382
|
+
F(s("i", {
|
|
382
383
|
onClick: t[0] || (t[0] = ee((l) => fe(), ["stop"])),
|
|
383
384
|
class: "absolute text-gray-500 cursor-pointer pointer-events-auto ltr:right-8 rtl:left-8 hover:text-red-600 dark:hover:text-red-400",
|
|
384
385
|
style: { top: "13px" }
|
|
@@ -399,10 +400,10 @@ const ye = { class: "font-bold ptext-lg dark:text-white" }, xe = { class: "mt-3
|
|
|
399
400
|
})
|
|
400
401
|
], -1)
|
|
401
402
|
]), 512), [
|
|
402
|
-
[te,
|
|
403
|
+
[te, w(a.value) && r.has_cancel]
|
|
403
404
|
]),
|
|
404
405
|
s("i", {
|
|
405
|
-
onClick: t[1] || (t[1] = ee((l) =>
|
|
406
|
+
onClick: t[1] || (t[1] = ee((l) => V(), ["stop"])),
|
|
406
407
|
class: "absolute text-xl text-gray-500 cursor-pointer ltr:right-2 rtl:left-2 hover:text-gray-700 dark:hover:text-gray-700 showOptions",
|
|
407
408
|
style: { top: "14px" }
|
|
408
409
|
}, [
|
|
@@ -422,20 +423,20 @@ const ye = { class: "font-bold ptext-lg dark:text-white" }, xe = { class: "mt-3
|
|
|
422
423
|
}, null, -1)
|
|
423
424
|
]), 2))
|
|
424
425
|
]),
|
|
425
|
-
|
|
426
|
-
r.hide_search ?
|
|
426
|
+
F(s("div", De, [
|
|
427
|
+
r.hide_search ? h("", !0) : (v(), f("div", Oe, [
|
|
427
428
|
t[10] || (t[10] = s("label", {
|
|
428
429
|
for: "default-search",
|
|
429
430
|
class: "mb-2 text-sm font-medium text-gray-900 sr-only dark:text-white"
|
|
430
431
|
}, "Search", -1)),
|
|
431
432
|
s("div", Ee, [
|
|
432
433
|
t[9] || (t[9] = s("div", { class: "absolute inset-y-0 flex items-center pointer-events-none start-0 ps-3" }, null, -1)),
|
|
433
|
-
|
|
434
|
+
F(s("input", {
|
|
434
435
|
type: "search",
|
|
435
436
|
"onUpdate:modelValue": t[2] || (t[2] = (l) => m.value = l),
|
|
436
437
|
id: `${r.field_name}search${g.value}`,
|
|
437
438
|
onKeydown: se,
|
|
438
|
-
onBlur: t[3] || (t[3] = (l) =>
|
|
439
|
+
onBlur: t[3] || (t[3] = (l) => R()),
|
|
439
440
|
autocomplete: "off",
|
|
440
441
|
class: "block w-full p-2 text-sm text-gray-900 outline-hidden dark:bg-gray-800 dark:text-white",
|
|
441
442
|
placeholder: r.search_input_placeholder
|
|
@@ -457,16 +458,16 @@ const ye = { class: "font-bold ptext-lg dark:text-white" }, xe = { class: "mt-3
|
|
|
457
458
|
onMousedown: t[5] || (t[5] = (l) => X())
|
|
458
459
|
}, [
|
|
459
460
|
s("div", $e, [
|
|
460
|
-
s("span", null,
|
|
461
|
+
s("span", null, b(r.custom_option_label) + ' "' + b(m.value) + '"', 1)
|
|
461
462
|
])
|
|
462
|
-
], 32)) :
|
|
463
|
-
i.value.length ? (v(!0), f(Z, { key: 1 },
|
|
463
|
+
], 32)) : h("", !0),
|
|
464
|
+
i.value.length ? (v(!0), f(Z, { key: 1 }, pe(i.value, (l, n) => (v(), f("div", {
|
|
464
465
|
class: B([
|
|
465
466
|
"relative px-2 py-0.5 text-xs leading-4 text-gray-700 no-underline cursor-pointer dark:text-gray-200 hover:bg-gray-100 dark:hover:bg-gray-700 dark:hover:text-white hover:rounded-sm",
|
|
466
467
|
n + 1 == y.value ? "bg-gray-100 dark:bg-gray-700 rounded-sm" : ""
|
|
467
468
|
]),
|
|
468
|
-
onClick: (u) =>
|
|
469
|
-
onMousedown: (u) =>
|
|
469
|
+
onClick: (u) => P(l),
|
|
470
|
+
onMousedown: (u) => P(l),
|
|
470
471
|
key: n,
|
|
471
472
|
id: `${n + 1}${g.value}`
|
|
472
473
|
}, [
|
|
@@ -474,7 +475,7 @@ const ye = { class: "font-bold ptext-lg dark:text-white" }, xe = { class: "mt-3
|
|
|
474
475
|
s("span", {
|
|
475
476
|
innerHTML: l.name || l.id || "-"
|
|
476
477
|
}, null, 8, Ie),
|
|
477
|
-
a.value?.id === l.id ? (v(), f("svg",
|
|
478
|
+
a.value?.id === l.id ? (v(), f("svg", je, t[11] || (t[11] = [
|
|
478
479
|
s("path", {
|
|
479
480
|
stroke: "currentColor",
|
|
480
481
|
"stroke-linecap": "round",
|
|
@@ -482,20 +483,20 @@ const ye = { class: "font-bold ptext-lg dark:text-white" }, xe = { class: "mt-3
|
|
|
482
483
|
"stroke-width": "2",
|
|
483
484
|
d: "M1 5.917 5.724 10.5 15 1.5"
|
|
484
485
|
}, null, -1)
|
|
485
|
-
]))) :
|
|
486
|
+
]))) : h("", !0)
|
|
486
487
|
])
|
|
487
|
-
], 42, Le))), 128)) :
|
|
488
|
-
$.value ? (v(), f("div",
|
|
489
|
-
!$.value && i.value.length === 0 && !(r.allow_custom && m.value) ? (v(), f("div",
|
|
488
|
+
], 42, Le))), 128)) : h("", !0),
|
|
489
|
+
$.value ? (v(), f("div", Te, " Loading... ")) : h("", !0),
|
|
490
|
+
!$.value && i.value.length === 0 && !(r.allow_custom && m.value) ? (v(), f("div", Ue, b(r.no_results_found_placeholder), 1)) : h("", !0)
|
|
490
491
|
], 544)
|
|
491
492
|
], 512), [
|
|
492
493
|
[te, x.value]
|
|
493
494
|
])
|
|
494
495
|
])
|
|
495
496
|
])
|
|
496
|
-
])) :
|
|
497
|
-
s("span",
|
|
498
|
-
s("small",
|
|
497
|
+
])) : h("", !0),
|
|
498
|
+
s("span", Ae, b(r.error_message), 1),
|
|
499
|
+
s("small", qe, b(r.description), 1)
|
|
499
500
|
], 2))
|
|
500
501
|
], 64));
|
|
501
502
|
}
|
|
@@ -1,8 +1,8 @@
|
|
|
1
|
-
import { ref as
|
|
2
|
-
const w = { class: "flex justify-between p-2 -mb-px border border-gray-300 no-underlin" }, v = { class: "relative inline-flex items-center cursor-pointer" }, V = ["name", "id", "checked"],
|
|
1
|
+
import { ref as y, computed as p, createElementBlock as a, openBlock as n, Fragment as h, createCommentVNode as d, normalizeClass as o, createElementVNode as t, createTextVNode as f, toDisplayString as l, withDirectives as k, vModelCheckbox as x } from "vue";
|
|
2
|
+
const w = { class: "flex justify-between p-2 -mb-px border border-gray-300 no-underlin" }, v = { class: "relative inline-flex items-center cursor-pointer" }, V = ["name", "id", "checked"], B = {
|
|
3
3
|
key: 0,
|
|
4
4
|
class: "flex justify-between items-center"
|
|
5
|
-
},
|
|
5
|
+
}, S = { class: "gl-label-form" }, _ = { class: "relative inline-flex items-center cursor-pointer" }, j = ["name", "id"], C = { class: "gl-span-form-error" }, D = { class: "block mt-1 text-sm font-normal leading-5 text-gray-500" }, T = {
|
|
6
6
|
__name: "GlToggleBoxTrueFalse",
|
|
7
7
|
props: {
|
|
8
8
|
is_required: {
|
|
@@ -44,69 +44,71 @@ const w = { class: "flex justify-between p-2 -mb-px border border-gray-300 no-un
|
|
|
44
44
|
},
|
|
45
45
|
emits: ["update:modelValue"],
|
|
46
46
|
setup(e, { emit: c }) {
|
|
47
|
-
const b = e, m = c,
|
|
47
|
+
const b = e, m = c, s = y(null), i = p({
|
|
48
48
|
get() {
|
|
49
49
|
return b.modelValue;
|
|
50
50
|
},
|
|
51
|
-
set(
|
|
52
|
-
m("update:modelValue",
|
|
51
|
+
set(u) {
|
|
52
|
+
m("update:modelValue", u);
|
|
53
53
|
}
|
|
54
54
|
});
|
|
55
|
-
return (
|
|
55
|
+
return (u, r) => (n(), a(h, null, [
|
|
56
56
|
e.show ? (n(), a("div", {
|
|
57
57
|
key: 0,
|
|
58
|
-
class:
|
|
58
|
+
class: o(e.field_name)
|
|
59
59
|
}, [
|
|
60
|
-
|
|
61
|
-
|
|
60
|
+
t("div", null, [
|
|
61
|
+
t("li", w, [
|
|
62
62
|
f(l(e.label_name) + " ", 1),
|
|
63
|
-
|
|
64
|
-
|
|
63
|
+
t("label", v, [
|
|
64
|
+
t("input", {
|
|
65
65
|
type: "checkbox",
|
|
66
66
|
class: "sr-only peer",
|
|
67
67
|
name: e.field_name,
|
|
68
68
|
id: e.field_name,
|
|
69
69
|
checked: e.modelValue,
|
|
70
70
|
ref_key: "input",
|
|
71
|
-
ref:
|
|
71
|
+
ref: s,
|
|
72
72
|
disabled: ""
|
|
73
73
|
}, null, 8, V),
|
|
74
|
-
|
|
74
|
+
r[1] || (r[1] = t("div", { class: "w-11 h-6 bg-gray-200 peer-focus:outline-hidden peer-focus:ring-4 peer-focus:ring-blue-300 dark:peer-focus:ring-blue-800 rounded-full peer dark:bg-gray-700 peer-checked:after:translate-x-full peer-checked:rtl:after:-translate-x-full peer-checked:after:border-white after:content-[''] after:absolute after:top-[1px] after:start-[2px] after:bg-white after:border-gray-300 after:border after:rounded-full after:h-5 after:w-5 after:transition-all dark:border-gray-600 peer-checked:bg-blue-600" }, null, -1))
|
|
75
75
|
])
|
|
76
76
|
])
|
|
77
77
|
]),
|
|
78
|
-
|
|
79
|
-
], 2)) :
|
|
80
|
-
e.show ?
|
|
78
|
+
r[2] || (r[2] = t("hr", { class: "opacity-100! bg-gray-200 border-0 dark:bg-gray-700" }, null, -1))
|
|
79
|
+
], 2)) : d("", !0),
|
|
80
|
+
e.show ? d("", !0) : (n(), a("div", {
|
|
81
81
|
key: 1,
|
|
82
|
-
class:
|
|
82
|
+
class: o(e.field_name)
|
|
83
83
|
}, [
|
|
84
|
-
e.has_label_up ? (n(), a("div",
|
|
85
|
-
|
|
86
|
-
])) :
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
|
|
84
|
+
e.has_label_up ? (n(), a("div", B, [
|
|
85
|
+
t("label", S, l(e.label_name), 1)
|
|
86
|
+
])) : d("", !0),
|
|
87
|
+
t("li", {
|
|
88
|
+
class: o(["flex p-2 -mb-px border border-gray-200 rounded-lg no-underlin dark:border-gray-600 dark:focus:border-primaryDark", e.has_label_up ? "justify-end" : "justify-between"])
|
|
89
|
+
}, [
|
|
90
|
+
f(l(e.has_label_up ? "" : e.label_name) + " ", 1),
|
|
91
|
+
t("label", _, [
|
|
92
|
+
k(t("input", {
|
|
91
93
|
type: "checkbox",
|
|
92
94
|
class: "sr-only peer",
|
|
93
95
|
name: e.field_name,
|
|
94
96
|
id: e.field_name,
|
|
95
97
|
ref_key: "input",
|
|
96
|
-
ref:
|
|
97
|
-
"onUpdate:modelValue":
|
|
98
|
-
}, null, 8,
|
|
99
|
-
[x,
|
|
98
|
+
ref: s,
|
|
99
|
+
"onUpdate:modelValue": r[0] || (r[0] = (g) => i.value = g)
|
|
100
|
+
}, null, 8, j), [
|
|
101
|
+
[x, i.value]
|
|
100
102
|
]),
|
|
101
|
-
|
|
103
|
+
r[3] || (r[3] = t("div", { class: "w-11 h-6 bg-gray-200 peer-focus:outline-hidden peer-focus:ring-4 peer-focus:ring-blue-300 dark:peer-focus:ring-blue-800 rounded-full peer dark:bg-gray-700 peer-checked:after:translate-x-full peer-checked:rtl:after:-translate-x-full peer-checked:after:border-white after:content-[''] after:absolute after:top-[1px] after:start-[2px] after:bg-white after:border-gray-300 after:border after:rounded-full after:h-5 after:w-5 after:transition-all dark:border-gray-600 peer-checked:bg-blue-600" }, null, -1))
|
|
102
104
|
])
|
|
103
|
-
]),
|
|
104
|
-
|
|
105
|
-
|
|
105
|
+
], 2),
|
|
106
|
+
t("span", C, l(e.error_message), 1),
|
|
107
|
+
t("small", D, l(e.description), 1)
|
|
106
108
|
], 2))
|
|
107
109
|
], 64));
|
|
108
110
|
}
|
|
109
111
|
};
|
|
110
112
|
export {
|
|
111
|
-
|
|
113
|
+
T as default
|
|
112
114
|
};
|
package/package.json
CHANGED
|
@@ -1,57 +1,57 @@
|
|
|
1
|
-
{
|
|
2
|
-
"name": "golden-logic-ui",
|
|
3
|
-
"description": "The most popular library of interactive components built with Vuejs && Tailwind CSS",
|
|
4
|
-
"type": "module",
|
|
5
|
-
"private": false,
|
|
6
|
-
"version": "1.3.
|
|
7
|
-
"repository": {
|
|
8
|
-
"type": "git",
|
|
9
|
-
"url": "git+https://github.com/mrgiant/GoldenLogicUi.git"
|
|
10
|
-
},
|
|
11
|
-
"author": "Mohamed Al Wahaibi",
|
|
12
|
-
"license": "MIT",
|
|
13
|
-
"files": [
|
|
14
|
-
"dist"
|
|
15
|
-
],
|
|
16
|
-
"main": "./dist/main.js",
|
|
17
|
-
"module": "./dist/main.js",
|
|
18
|
-
"style": "./dist/golden-logic-ui.css",
|
|
19
|
-
"sideEffects": [
|
|
20
|
-
"**/*.css"
|
|
21
|
-
],
|
|
22
|
-
"exports": {
|
|
23
|
-
".": {
|
|
24
|
-
"import": "./dist/main.js"
|
|
25
|
-
},
|
|
26
|
-
"./style.css": "./dist/golden-logic-ui.css",
|
|
27
|
-
"./dist/golden-logic-ui.css": "./dist/golden-logic-ui.css",
|
|
28
|
-
"./*": "./dist/*"
|
|
29
|
-
},
|
|
30
|
-
"scripts": {
|
|
31
|
-
"dev": "vite",
|
|
32
|
-
"build": "vite build",
|
|
33
|
-
"preview": "vite preview"
|
|
34
|
-
},
|
|
35
|
-
"peerDependencies": {
|
|
36
|
-
"vue": "^3.4.x"
|
|
37
|
-
},
|
|
38
|
-
"dependencies": {
|
|
39
|
-
"@codemirror/autocomplete": "^6.18.4",
|
|
40
|
-
"@codemirror/lang-html": "^6.2.2",
|
|
41
|
-
"@codemirror/lang-javascript": "^6.2.2",
|
|
42
|
-
"@codemirror/state": "^6.5.0",
|
|
43
|
-
"@codemirror/theme-one-dark": "^6.1.2",
|
|
44
|
-
"@codemirror/view": "^6.36.1",
|
|
45
|
-
"@tailwindcss/vite": "^4.1.18",
|
|
46
|
-
"codemirror": "^6.0.1",
|
|
47
|
-
"tinymce": "^7.6.0",
|
|
48
|
-
"vue3-print-nb": "^0.1.4",
|
|
49
|
-
"xlsx": "^0.18.5"
|
|
50
|
-
},
|
|
51
|
-
"devDependencies": {
|
|
52
|
-
"@vitejs/plugin-vue": "^6.0.0",
|
|
53
|
-
"sass": "^1.75.0",
|
|
54
|
-
"tailwindcss": "^4.1.18",
|
|
55
|
-
"vite": "^7.0.0"
|
|
56
|
-
}
|
|
57
|
-
}
|
|
1
|
+
{
|
|
2
|
+
"name": "golden-logic-ui",
|
|
3
|
+
"description": "The most popular library of interactive components built with Vuejs && Tailwind CSS",
|
|
4
|
+
"type": "module",
|
|
5
|
+
"private": false,
|
|
6
|
+
"version": "1.3.9",
|
|
7
|
+
"repository": {
|
|
8
|
+
"type": "git",
|
|
9
|
+
"url": "git+https://github.com/mrgiant/GoldenLogicUi.git"
|
|
10
|
+
},
|
|
11
|
+
"author": "Mohamed Al Wahaibi",
|
|
12
|
+
"license": "MIT",
|
|
13
|
+
"files": [
|
|
14
|
+
"dist"
|
|
15
|
+
],
|
|
16
|
+
"main": "./dist/main.js",
|
|
17
|
+
"module": "./dist/main.js",
|
|
18
|
+
"style": "./dist/golden-logic-ui.css",
|
|
19
|
+
"sideEffects": [
|
|
20
|
+
"**/*.css"
|
|
21
|
+
],
|
|
22
|
+
"exports": {
|
|
23
|
+
".": {
|
|
24
|
+
"import": "./dist/main.js"
|
|
25
|
+
},
|
|
26
|
+
"./style.css": "./dist/golden-logic-ui.css",
|
|
27
|
+
"./dist/golden-logic-ui.css": "./dist/golden-logic-ui.css",
|
|
28
|
+
"./*": "./dist/*"
|
|
29
|
+
},
|
|
30
|
+
"scripts": {
|
|
31
|
+
"dev": "vite",
|
|
32
|
+
"build": "vite build",
|
|
33
|
+
"preview": "vite preview"
|
|
34
|
+
},
|
|
35
|
+
"peerDependencies": {
|
|
36
|
+
"vue": "^3.4.x"
|
|
37
|
+
},
|
|
38
|
+
"dependencies": {
|
|
39
|
+
"@codemirror/autocomplete": "^6.18.4",
|
|
40
|
+
"@codemirror/lang-html": "^6.2.2",
|
|
41
|
+
"@codemirror/lang-javascript": "^6.2.2",
|
|
42
|
+
"@codemirror/state": "^6.5.0",
|
|
43
|
+
"@codemirror/theme-one-dark": "^6.1.2",
|
|
44
|
+
"@codemirror/view": "^6.36.1",
|
|
45
|
+
"@tailwindcss/vite": "^4.1.18",
|
|
46
|
+
"codemirror": "^6.0.1",
|
|
47
|
+
"tinymce": "^7.6.0",
|
|
48
|
+
"vue3-print-nb": "^0.1.4",
|
|
49
|
+
"xlsx": "^0.18.5"
|
|
50
|
+
},
|
|
51
|
+
"devDependencies": {
|
|
52
|
+
"@vitejs/plugin-vue": "^6.0.0",
|
|
53
|
+
"sass": "^1.75.0",
|
|
54
|
+
"tailwindcss": "^4.1.18",
|
|
55
|
+
"vite": "^7.0.0"
|
|
56
|
+
}
|
|
57
|
+
}
|