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