adverich-kun-ui 0.1.492 → 0.1.494
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,243 +1,245 @@
|
|
|
1
|
-
import { mergeModels as
|
|
2
|
-
import { icons as
|
|
1
|
+
import { mergeModels as $, useModel as x, onMounted as ie, ref as z, watch as se, nextTick as A, createElementBlock as y, openBlock as d, createVNode as i, unref as t, withKeys as ue, isRef as E, createSlots as de, withCtx as n, createCommentVNode as g, normalizeClass as ce, createTextVNode as b, toDisplayString as V, createBlock as p, Fragment as me, renderList as fe, createElementVNode as pe, withModifiers as ve } from "vue";
|
|
2
|
+
import { icons as v } from "../../../../icons/index.js";
|
|
3
3
|
import { isNotEmpty as _, isArray as R } from "../../../../utils/utils.js";
|
|
4
|
-
import
|
|
5
|
-
import
|
|
4
|
+
import ke from "../../../KunInfiniteScroll/src/components/KunInfiniteScroll.vue.js";
|
|
5
|
+
import he from "../../../KunList/src/components/KunList.vue.js";
|
|
6
6
|
import O from "../../../KunListItem/src/components/KunListItem.vue.js";
|
|
7
7
|
import B from "../../../KunListItemTitle/src/components/KunListItemTitle.vue.js";
|
|
8
|
-
import
|
|
9
|
-
import
|
|
10
|
-
import { useAutocomplete as
|
|
11
|
-
import { KunAutocompleteProps as
|
|
12
|
-
import
|
|
13
|
-
import
|
|
14
|
-
import
|
|
15
|
-
import
|
|
16
|
-
const
|
|
8
|
+
import ye from "../../../KunListItemSubtitle/src/components/KunListItemSubtitle.vue.js";
|
|
9
|
+
import ge from "../../../KunMenu/src/components/KunMenu.vue.js";
|
|
10
|
+
import { useAutocomplete as be } from "../composables/useAutocomplete.js";
|
|
11
|
+
import { KunAutocompleteProps as Ce } from "../composables/KunAutocompleteProps.js";
|
|
12
|
+
import we from "../../../KunTextField/src/components/KunTextField.vue.js";
|
|
13
|
+
import Se from "../../../KunBtn/src/components/KunBtn.vue.js";
|
|
14
|
+
import Ve from "../../../KunChip/src/components/KunChip.vue.js";
|
|
15
|
+
import C from "../../../KunIcon/src/components/KunIcon.vue.js";
|
|
16
|
+
const De = {
|
|
17
17
|
key: 0,
|
|
18
18
|
class: "flex flex-nowrap items-center space-x-1 min-w-3xs max-w-full overflow-x-auto overflow-y-hidden"
|
|
19
|
-
},
|
|
19
|
+
}, Ie = { class: "flex items-center" }, Le = {
|
|
20
20
|
key: 0,
|
|
21
21
|
class: "sticky top-0 z-10 p-2 border-b bg-select-background"
|
|
22
|
-
},
|
|
22
|
+
}, je = {
|
|
23
23
|
__name: "KunAutocomplete",
|
|
24
|
-
props: /* @__PURE__ */
|
|
24
|
+
props: /* @__PURE__ */ $(Ce, {
|
|
25
25
|
modelValue: { default: null },
|
|
26
26
|
modelModifiers: {},
|
|
27
27
|
items: { default: [], type: Array, required: !0 },
|
|
28
28
|
itemsModifiers: {}
|
|
29
29
|
}),
|
|
30
|
-
emits: /* @__PURE__ */
|
|
31
|
-
setup(
|
|
32
|
-
const s =
|
|
33
|
-
textFieldRef:
|
|
34
|
-
listRef:
|
|
30
|
+
emits: /* @__PURE__ */ $(["update:modelValue", "selectedItem", "createItem", "validation", "search", "keyDown", "keyDownEnter"], ["update:modelValue", "update:items"]),
|
|
31
|
+
setup(w, { expose: F, emit: T }) {
|
|
32
|
+
const s = x(w, "modelValue"), f = x(w, "items"), u = w, m = T, {
|
|
33
|
+
textFieldRef: k,
|
|
34
|
+
listRef: D,
|
|
35
35
|
menuModel: c,
|
|
36
|
-
search:
|
|
36
|
+
search: r,
|
|
37
37
|
removeItem: N,
|
|
38
38
|
clearSelection: U,
|
|
39
39
|
lightReset: j,
|
|
40
|
-
openMenu:
|
|
40
|
+
openMenu: S,
|
|
41
41
|
closeMenu: H,
|
|
42
42
|
toggleMenu: q,
|
|
43
43
|
onMenuKeydown: P,
|
|
44
|
-
getSelectedItem:
|
|
44
|
+
getSelectedItem: I,
|
|
45
45
|
textArr: W,
|
|
46
46
|
getArrayText: G,
|
|
47
47
|
isAlphanumeric: J,
|
|
48
48
|
createItem: Q,
|
|
49
49
|
checkDisabled: X,
|
|
50
|
-
itemToString:
|
|
50
|
+
itemToString: L,
|
|
51
51
|
placeholder: Y
|
|
52
|
-
} =
|
|
52
|
+
} = be(u, m, s, f);
|
|
53
53
|
ie(() => {
|
|
54
|
-
u.focusOnRender &&
|
|
54
|
+
u.focusOnRender && k.value.focus();
|
|
55
55
|
});
|
|
56
|
-
const
|
|
57
|
-
for (const
|
|
58
|
-
const
|
|
59
|
-
if (
|
|
60
|
-
return
|
|
56
|
+
const K = z(null), h = z(""), M = (e) => {
|
|
57
|
+
for (const o of u.rules) {
|
|
58
|
+
const l = o(e);
|
|
59
|
+
if (l !== !0)
|
|
60
|
+
return h.value = l, m("validation", !1), !1;
|
|
61
61
|
}
|
|
62
|
-
return
|
|
62
|
+
return h.value = "", m("validation", !0), !0;
|
|
63
63
|
};
|
|
64
|
-
se(() => s.value, (
|
|
65
|
-
_(u.rules) &&
|
|
64
|
+
se(() => s.value, (e, o) => {
|
|
65
|
+
_(u.rules) && M(e);
|
|
66
66
|
});
|
|
67
67
|
function Z() {
|
|
68
|
-
var
|
|
69
|
-
c.value = !1, (
|
|
68
|
+
var e;
|
|
69
|
+
c.value = !1, (e = k.value.inputField) == null || e.focus();
|
|
70
70
|
}
|
|
71
|
-
function ee(
|
|
72
|
-
var
|
|
73
|
-
const
|
|
74
|
-
if (
|
|
75
|
-
H(), m("keyDown",
|
|
71
|
+
function ee(e) {
|
|
72
|
+
var l, a;
|
|
73
|
+
const o = e.key;
|
|
74
|
+
if (o === "Tab" || o === "Shift" || o === "Escape") {
|
|
75
|
+
H(), m("keyDown", o);
|
|
76
76
|
return;
|
|
77
77
|
}
|
|
78
|
-
(J(
|
|
78
|
+
(J(o) || o === "Backspace") && S(), ["ArrowUp", "ArrowDown"].includes(o) && (e.preventDefault(), c.value || S(), (a = (l = D.value) == null ? void 0 : l.focusWithKey) == null || a.call(l, o));
|
|
79
79
|
}
|
|
80
|
-
function le(
|
|
81
|
-
m("search",
|
|
80
|
+
function le(e) {
|
|
81
|
+
m("search", r);
|
|
82
82
|
}
|
|
83
83
|
function te() {
|
|
84
|
-
|
|
84
|
+
M(s);
|
|
85
85
|
}
|
|
86
|
-
function oe(
|
|
87
|
-
P(
|
|
86
|
+
function oe(e) {
|
|
87
|
+
P(e);
|
|
88
88
|
}
|
|
89
89
|
function ne() {
|
|
90
90
|
}
|
|
91
|
-
function re() {
|
|
92
|
-
if (!
|
|
93
|
-
let
|
|
94
|
-
u.returnObject ?
|
|
95
|
-
(
|
|
96
|
-
(
|
|
91
|
+
function re(e) {
|
|
92
|
+
if (!r.value) return;
|
|
93
|
+
let o = null;
|
|
94
|
+
u.returnObject ? o = f.value.find(
|
|
95
|
+
(l) => Object.values(l).some(
|
|
96
|
+
(a) => String(a).toLowerCase() === String(r.value).toLowerCase()
|
|
97
97
|
)
|
|
98
|
-
) : u.itemValue ?
|
|
99
|
-
(
|
|
100
|
-
) :
|
|
101
|
-
(
|
|
102
|
-
),
|
|
98
|
+
) : u.itemValue ? o = f.value.find(
|
|
99
|
+
(l) => String(l[u.itemValue]).toLowerCase() === String(r.value).toLowerCase()
|
|
100
|
+
) : o = f.value.find(
|
|
101
|
+
(l) => typeof l == "object" ? Object.values(l).some((a) => String(a).toLowerCase() === String(r.value).toLowerCase()) : String(l).toLowerCase() === String(r.value).toLowerCase()
|
|
102
|
+
), o && I(o), A(() => {
|
|
103
|
+
m("keyDownEnter", e);
|
|
104
|
+
});
|
|
103
105
|
}
|
|
104
106
|
return F({
|
|
105
|
-
focus: () =>
|
|
106
|
-
var
|
|
107
|
-
return (
|
|
107
|
+
focus: () => A(() => {
|
|
108
|
+
var e;
|
|
109
|
+
return (e = k.value) == null ? void 0 : e.focus();
|
|
108
110
|
})
|
|
109
|
-
}), (
|
|
111
|
+
}), (e, o) => (d(), y("div", {
|
|
110
112
|
class: "w-full h-fit",
|
|
111
113
|
ref_key: "parentRef",
|
|
112
|
-
ref:
|
|
114
|
+
ref: K
|
|
113
115
|
}, [
|
|
114
|
-
i(
|
|
115
|
-
modelValue:
|
|
116
|
+
i(we, {
|
|
117
|
+
modelValue: t(r),
|
|
116
118
|
"onUpdate:modelValue": [
|
|
117
|
-
|
|
119
|
+
o[1] || (o[1] = (l) => E(r) ? r.value = l : null),
|
|
118
120
|
le
|
|
119
121
|
],
|
|
120
|
-
label:
|
|
122
|
+
label: e.label,
|
|
121
123
|
dirty: "",
|
|
122
|
-
"hide-details":
|
|
123
|
-
density:
|
|
124
|
+
"hide-details": e.hideDetails,
|
|
125
|
+
density: e.density,
|
|
124
126
|
ref_key: "textFieldRef",
|
|
125
|
-
ref:
|
|
127
|
+
ref: k,
|
|
126
128
|
autocomplete: "off",
|
|
127
129
|
onFocusInput: te,
|
|
128
|
-
onHandleClick:
|
|
129
|
-
rounded:
|
|
130
|
+
onHandleClick: t(q),
|
|
131
|
+
rounded: t(c) ? "rounded-t" : "rounded",
|
|
130
132
|
onBlur: ne,
|
|
131
133
|
onKeyDown: [
|
|
132
134
|
ee,
|
|
133
|
-
|
|
135
|
+
ue(re, ["enter"])
|
|
134
136
|
],
|
|
135
|
-
placeholder: u.multiple &&
|
|
136
|
-
error: !!
|
|
137
|
-
"error-messages":
|
|
138
|
-
},
|
|
139
|
-
"prepend-input-content":
|
|
140
|
-
|
|
141
|
-
(d(!0),
|
|
142
|
-
key:
|
|
137
|
+
placeholder: u.multiple && t(R)(s.value) && s.value.length ? "" : t(Y),
|
|
138
|
+
error: !!h.value,
|
|
139
|
+
"error-messages": h.value
|
|
140
|
+
}, de({
|
|
141
|
+
"prepend-input-content": n(() => [
|
|
142
|
+
t(R)(s.value) && t(_)(s.value) ? (d(), y("div", De, [
|
|
143
|
+
(d(!0), y(me, null, fe(s.value, (l) => (d(), p(Ve, {
|
|
144
|
+
key: l.id ?? l.name,
|
|
143
145
|
size: "small",
|
|
144
146
|
variant: "pill"
|
|
145
147
|
}, {
|
|
146
|
-
default:
|
|
147
|
-
|
|
148
|
-
|
|
149
|
-
i(
|
|
148
|
+
default: n(() => [
|
|
149
|
+
pe("div", Ie, [
|
|
150
|
+
b(V(t(G)(l)) + " ", 1),
|
|
151
|
+
i(C, {
|
|
150
152
|
color: "error",
|
|
151
|
-
icon:
|
|
153
|
+
icon: t(v).close,
|
|
152
154
|
size: "small",
|
|
153
155
|
class: "ml-1",
|
|
154
|
-
onClick: (
|
|
156
|
+
onClick: (a) => t(N)(l)
|
|
155
157
|
}, null, 8, ["icon", "onClick"])
|
|
156
158
|
])
|
|
157
159
|
]),
|
|
158
160
|
_: 2
|
|
159
161
|
}, 1024))), 128))
|
|
160
|
-
])) :
|
|
162
|
+
])) : g("", !0)
|
|
161
163
|
]),
|
|
162
|
-
default:
|
|
163
|
-
i(
|
|
164
|
+
default: n(() => [
|
|
165
|
+
i(ge, {
|
|
164
166
|
transition: "fade",
|
|
165
|
-
"onClick:outside":
|
|
166
|
-
modelValue:
|
|
167
|
-
"onUpdate:modelValue":
|
|
167
|
+
"onClick:outside": t(j),
|
|
168
|
+
modelValue: t(c),
|
|
169
|
+
"onUpdate:modelValue": o[0] || (o[0] = (l) => E(c) ? c.value = l : null),
|
|
168
170
|
activator: "parent",
|
|
169
|
-
"z-index":
|
|
170
|
-
"parent-ref":
|
|
171
|
-
origin:
|
|
171
|
+
"z-index": e.zIndex,
|
|
172
|
+
"parent-ref": K.value,
|
|
173
|
+
origin: e.menuOrigin,
|
|
172
174
|
onHandleEscape: Z,
|
|
173
|
-
bgColor:
|
|
174
|
-
"close-on-content-click":
|
|
175
|
+
bgColor: e.bgMenuColor,
|
|
176
|
+
"close-on-content-click": e.closeOnSelect,
|
|
175
177
|
width: "w-full",
|
|
176
|
-
"max-height":
|
|
177
|
-
"hide-details":
|
|
178
|
+
"max-height": e.maxHeight,
|
|
179
|
+
"hide-details": e.hideDetails
|
|
178
180
|
}, {
|
|
179
|
-
default:
|
|
180
|
-
|
|
181
|
-
i(
|
|
182
|
-
onClick:
|
|
183
|
-
bgColor:
|
|
184
|
-
class:
|
|
181
|
+
default: n(() => [
|
|
182
|
+
e.hasCreateItem ? (d(), y("div", Le, [
|
|
183
|
+
i(Se, {
|
|
184
|
+
onClick: t(Q),
|
|
185
|
+
bgColor: e.btnCreateBg,
|
|
186
|
+
class: ce(e.btnCreateClass)
|
|
185
187
|
}, {
|
|
186
|
-
default:
|
|
187
|
-
|
|
188
|
+
default: n(() => [
|
|
189
|
+
b(V(e.btnCreateText), 1)
|
|
188
190
|
]),
|
|
189
191
|
_: 1
|
|
190
192
|
}, 8, ["onClick", "bgColor", "class"])
|
|
191
|
-
])) :
|
|
192
|
-
i(
|
|
193
|
-
"onClick:select":
|
|
193
|
+
])) : g("", !0),
|
|
194
|
+
i(he, {
|
|
195
|
+
"onClick:select": t(I),
|
|
194
196
|
ref_key: "listRef",
|
|
195
|
-
ref:
|
|
197
|
+
ref: D,
|
|
196
198
|
onKeyDown: oe,
|
|
197
199
|
selectable: !0
|
|
198
200
|
}, {
|
|
199
|
-
default:
|
|
200
|
-
i(
|
|
201
|
-
items:
|
|
202
|
-
search:
|
|
201
|
+
default: n(() => [
|
|
202
|
+
i(ke, {
|
|
203
|
+
items: f.value,
|
|
204
|
+
search: t(r),
|
|
203
205
|
"searchable-keys": u.searchableKeys,
|
|
204
206
|
virtual: !1,
|
|
205
207
|
"items-per-intersection": 10,
|
|
206
|
-
enabled:
|
|
208
|
+
enabled: t(c),
|
|
207
209
|
"item-height": 48
|
|
208
210
|
}, {
|
|
209
|
-
default:
|
|
210
|
-
!ae &&
|
|
211
|
-
value:
|
|
212
|
-
key: `kun-list-${
|
|
213
|
-
id: `kun-item-${
|
|
214
|
-
disabled:
|
|
215
|
-
"bg-items":
|
|
216
|
-
"hover-bg":
|
|
217
|
-
activeClass:
|
|
218
|
-
density:
|
|
211
|
+
default: n(({ item: l, index: a, empty: ae }) => [
|
|
212
|
+
!ae && l != null ? (d(), p(O, {
|
|
213
|
+
value: l,
|
|
214
|
+
key: `kun-list-${a + 1}`,
|
|
215
|
+
id: `kun-item-${a + 1}`,
|
|
216
|
+
disabled: t(X)(l),
|
|
217
|
+
"bg-items": e.bgItemListColor,
|
|
218
|
+
"hover-bg": e.hoverItemListColor,
|
|
219
|
+
activeClass: e.selectedItemListColor,
|
|
220
|
+
density: e.density,
|
|
219
221
|
selectable: !0
|
|
220
222
|
}, {
|
|
221
|
-
default:
|
|
223
|
+
default: n(() => [
|
|
222
224
|
i(B, { class: "text-wrap" }, {
|
|
223
|
-
default:
|
|
224
|
-
|
|
225
|
+
default: n(() => [
|
|
226
|
+
b(V(t(L)(l, e.itemTitle ?? t(W), "hasDefault")), 1)
|
|
225
227
|
]),
|
|
226
228
|
_: 2
|
|
227
229
|
}, 1024),
|
|
228
|
-
i(
|
|
229
|
-
text:
|
|
230
|
+
i(ye, {
|
|
231
|
+
text: e.itemSubtitle ? t(L)(l, e.itemSubtitle) : ""
|
|
230
232
|
}, null, 8, ["text"])
|
|
231
233
|
]),
|
|
232
234
|
_: 2
|
|
233
|
-
}, 1032, ["value", "id", "disabled", "bg-items", "hover-bg", "activeClass", "density"])) : (d(),
|
|
235
|
+
}, 1032, ["value", "id", "disabled", "bg-items", "hover-bg", "activeClass", "density"])) : (d(), p(O, {
|
|
234
236
|
key: 1,
|
|
235
237
|
disabled: ""
|
|
236
238
|
}, {
|
|
237
|
-
default:
|
|
239
|
+
default: n(() => [
|
|
238
240
|
i(B, { class: "text-center w-full text-gray-500" }, {
|
|
239
|
-
default:
|
|
240
|
-
|
|
241
|
+
default: n(() => o[2] || (o[2] = [
|
|
242
|
+
b(" No hay elementos disponibles ")
|
|
241
243
|
])),
|
|
242
244
|
_: 1,
|
|
243
245
|
__: [2]
|
|
@@ -257,31 +259,31 @@ const Ie = {
|
|
|
257
259
|
]),
|
|
258
260
|
_: 2
|
|
259
261
|
}, [
|
|
260
|
-
|
|
262
|
+
e.hasIcons ? {
|
|
261
263
|
name: "append-inner",
|
|
262
|
-
fn:
|
|
263
|
-
|
|
264
|
+
fn: n(() => [
|
|
265
|
+
e.clearable && s.value ? (d(), p(C, {
|
|
264
266
|
key: 0,
|
|
265
|
-
onClick:
|
|
267
|
+
onClick: t(U),
|
|
266
268
|
size: "small",
|
|
267
269
|
color: "error",
|
|
268
|
-
icon:
|
|
270
|
+
icon: t(v).close,
|
|
269
271
|
class: "mr-1 mt-1"
|
|
270
|
-
}, null, 8, ["onClick", "icon"])) :
|
|
271
|
-
i(
|
|
272
|
+
}, null, 8, ["onClick", "icon"])) : g("", !0),
|
|
273
|
+
i(C, {
|
|
272
274
|
color: "teal-darken-1",
|
|
273
275
|
size: "large",
|
|
274
276
|
class: "cursor-pointer",
|
|
275
|
-
icon:
|
|
276
|
-
onClick:
|
|
277
|
+
icon: t(c) ? t(v).menuUpOutline : t(v).menuDownOutline,
|
|
278
|
+
onClick: ve(t(S), ["stop"])
|
|
277
279
|
}, null, 8, ["icon", "onClick"]),
|
|
278
|
-
|
|
280
|
+
e.required ? (d(), p(C, {
|
|
279
281
|
key: 1,
|
|
280
282
|
color: "teal-darken-1",
|
|
281
283
|
size: "x-small",
|
|
282
284
|
class: "mb-4",
|
|
283
|
-
icon:
|
|
284
|
-
}, null, 8, ["icon"])) :
|
|
285
|
+
icon: t(v).asterisk
|
|
286
|
+
}, null, 8, ["icon"])) : g("", !0)
|
|
285
287
|
]),
|
|
286
288
|
key: "0"
|
|
287
289
|
} : void 0
|
|
@@ -290,5 +292,5 @@ const Ie = {
|
|
|
290
292
|
}
|
|
291
293
|
};
|
|
292
294
|
export {
|
|
293
|
-
|
|
295
|
+
je as default
|
|
294
296
|
};
|