@ironsource/shared-ui 2.1.12-rc.7 → 2.1.12-rc.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.
- package/TreeDropdown.vue_vue_type_style_index_0_scoped_4ba9e4bd_lang.css +1 -0
- package/components/dropdown/common/Dropdown.common.js +81 -74
- package/components/dropdown/v4/TreeDropdown.vue.js +2 -2
- package/components/dropdown/v4/TreeDropdown.vue2.js +68 -73
- package/index.js +1 -1
- package/package.json +1 -1
- package/TreeDropdown.vue_vue_type_style_index_0_scoped_b883d1fa_lang.css +0 -1
|
@@ -0,0 +1 @@
|
|
|
1
|
+
.child-options[data-v-4ba9e4bd]{padding-left:1rem}.tree-search[data-v-4ba9e4bd]{width:100%}
|
|
@@ -1,13 +1,13 @@
|
|
|
1
1
|
import { useToggle as Ve } from "../../../composables/useToggle.js";
|
|
2
|
-
import { inject as ke, ref as r, computed as c, watch as b, useSlots as Ge, toRaw as
|
|
2
|
+
import { inject as ke, ref as r, computed as c, watch as b, useSlots as Ge, toRaw as I, nextTick as N, provide as Le, onMounted as Ue } from "vue";
|
|
3
3
|
import { isObjectInArray as ae } from "../../../utils/array.js";
|
|
4
4
|
import { objectsEqual as Be } from "../../../utils/object.js";
|
|
5
5
|
import { useClamp as He, useVirtualList as qe, onClickOutside as ne, useInfiniteScroll as Xe } from "@vueuse/core";
|
|
6
|
-
import { Mode as
|
|
6
|
+
import { Mode as w, Type as U, DropdownContext as $e } from "./DropdownContext.js";
|
|
7
7
|
import { pxToRem as je } from "../../../utils/style.js";
|
|
8
8
|
import { useEditableContext as ze } from "../../table-cells/common/EditableContext.js";
|
|
9
9
|
import { useGroupedOptions as We } from "./useGroupedOptions.js";
|
|
10
|
-
const al = (e, d,
|
|
10
|
+
const al = (e, d, y) => {
|
|
11
11
|
const B = ke("isTreeDropdown", !1), {
|
|
12
12
|
sortOutGroups: H,
|
|
13
13
|
flattenAndMarkGroupOptions: ue,
|
|
@@ -40,7 +40,7 @@ const al = (e, d, g) => {
|
|
|
40
40
|
a.value = e.selected, v.value = e.selected;
|
|
41
41
|
}
|
|
42
42
|
);
|
|
43
|
-
const de = Ge(),
|
|
43
|
+
const de = Ge(), x = r(null), m = r(null), j = r(null), R = r(null), z = r(null), D = r(null), ve = r(), W = r(null), J = r(null), Q = r(null), fe = 8, ge = c(() => D.value ? D.value.getBoundingClientRect().height + fe + e.distance : 0), C = r(!1), h = r([]), T = r(-1), O = r(""), v = r(e.selected || []), Y = () => D.value?.focus(), [S, ye, he] = Ve({
|
|
44
44
|
disabled: e.disabled,
|
|
45
45
|
initialValue: e.defaultOpen
|
|
46
46
|
});
|
|
@@ -59,7 +59,7 @@ const al = (e, d, g) => {
|
|
|
59
59
|
set(l) {
|
|
60
60
|
d("update:isOpen", l);
|
|
61
61
|
}
|
|
62
|
-
}), Se = c(() => o.value.length - 1),
|
|
62
|
+
}), Se = c(() => o.value.length - 1), g = He(0, 0, Se), F = c(() => n.value ? e.displayValue(n.value) : ""), me = (l) => {
|
|
63
63
|
if (!l.value.length && !e.multiOptionsPlaceholderPrefix && !e.multiOptionsPlaceholderSuffix)
|
|
64
64
|
return e.placeholder;
|
|
65
65
|
const t = !e.multiOptionsPlaceholderPrefix && !e.multiOptionsPlaceholderSuffix ? `${l.value.length} selected` : `${e.multiOptionsPlaceholderPrefix ?? ""}${l.value.length ?? "0"}${e.multiOptionsPlaceholderSuffix ?? ""}`;
|
|
@@ -76,8 +76,8 @@ const al = (e, d, g) => {
|
|
|
76
76
|
o,
|
|
77
77
|
a
|
|
78
78
|
) : a.value.length > 0 && a.value.length < o.value.length), _ = (l) => {
|
|
79
|
-
|
|
80
|
-
}, M = c(() => e.groupedOptions ? ue(e.options) : e.options),
|
|
79
|
+
O.value = l;
|
|
80
|
+
}, M = c(() => e.groupedOptions ? ue(e.options) : e.options), Te = c(() => {
|
|
81
81
|
if (oe(
|
|
82
82
|
M,
|
|
83
83
|
v
|
|
@@ -87,7 +87,7 @@ const al = (e, d, g) => {
|
|
|
87
87
|
selected: [],
|
|
88
88
|
notSelected: []
|
|
89
89
|
};
|
|
90
|
-
|
|
90
|
+
I(M).value.forEach((i) => {
|
|
91
91
|
const u = (e.comparingKey ? v.value.findIndex(
|
|
92
92
|
(L) => L[e.comparingKey] === i[e.comparingKey]
|
|
93
93
|
) > -1 : v.value.includes(i)) ? "selected" : "notSelected";
|
|
@@ -96,19 +96,19 @@ const al = (e, d, g) => {
|
|
|
96
96
|
const t = e.groupedOptions ? H(l.notSelected) : l.notSelected;
|
|
97
97
|
return [].concat(l.selected, t);
|
|
98
98
|
}), o = c(() => {
|
|
99
|
-
const l = Array.isArray(v.value) && e.multi &&
|
|
99
|
+
const l = Array.isArray(v.value) && e.multi && y.VERSION === 4 && !B ? Te.value : M.value;
|
|
100
100
|
if (e.onSearch) {
|
|
101
|
-
const t = l.filter((i) => e.groupedOptions && q(i) ? i : e.onSearch(i,
|
|
101
|
+
const t = l.filter((i) => e.groupedOptions && q(i) ? i : e.onSearch(i, O.value));
|
|
102
102
|
return e.groupedOptions ? H(t) : t;
|
|
103
103
|
} else
|
|
104
104
|
return l;
|
|
105
|
-
}),
|
|
106
|
-
() =>
|
|
105
|
+
}), Pe = c(() => h.value[0]?.hasSubtitle), p = c(() => s.mode === w.Multi), ee = c(
|
|
106
|
+
() => Pe.value ? y.MULTILINE_LIST_HEIGHT : y.LIST_HEIGHT
|
|
107
107
|
), {
|
|
108
108
|
list: V,
|
|
109
109
|
containerProps: k,
|
|
110
|
-
wrapperProps:
|
|
111
|
-
scrollTo:
|
|
110
|
+
wrapperProps: Ie,
|
|
111
|
+
scrollTo: P
|
|
112
112
|
} = qe(o, {
|
|
113
113
|
itemHeight: ee.value,
|
|
114
114
|
overscan: e.disableVirtualScroll ? 1 / 0 : 2
|
|
@@ -118,33 +118,40 @@ const al = (e, d, g) => {
|
|
|
118
118
|
(l) => {
|
|
119
119
|
Z(l);
|
|
120
120
|
}
|
|
121
|
-
), b([
|
|
121
|
+
), b([T], async () => {
|
|
122
122
|
await N();
|
|
123
123
|
}), b(
|
|
124
|
-
[
|
|
124
|
+
[S, g, T],
|
|
125
125
|
async ([l], [t]) => {
|
|
126
|
-
|
|
127
|
-
e.multi &&
|
|
128
|
-
|
|
129
|
-
|
|
126
|
+
S.value && (await N(), T.value !== -1 && l !== t && setTimeout(() => {
|
|
127
|
+
if (!(e.multi && y.VERSION === 4))
|
|
128
|
+
if (P(T.value), e.groupedOptions) {
|
|
129
|
+
const i = M.value.findIndex(
|
|
130
|
+
(f) => f === n.value
|
|
131
|
+
);
|
|
132
|
+
P(i);
|
|
133
|
+
} else
|
|
134
|
+
P(T.value);
|
|
135
|
+
}), g.value && setTimeout(() => {
|
|
136
|
+
P(g.value);
|
|
130
137
|
}));
|
|
131
138
|
}
|
|
132
|
-
), b(
|
|
133
|
-
d("onsearch",
|
|
139
|
+
), b(O, () => {
|
|
140
|
+
d("onsearch", O.value), P(0);
|
|
134
141
|
});
|
|
135
142
|
const A = (l, t = !1) => {
|
|
136
143
|
e.disabled || (Z(l), N(() => {
|
|
137
|
-
|
|
144
|
+
S.value && d("opened"), S.value || d("closed"), x.value && t && x.value.focus();
|
|
138
145
|
}));
|
|
139
146
|
};
|
|
140
|
-
b(
|
|
147
|
+
b(S, (l) => {
|
|
141
148
|
if (l) {
|
|
142
|
-
|
|
149
|
+
O.value = "", p.value && Array.isArray(n.value) && (v.value = I(n.value).slice());
|
|
143
150
|
return;
|
|
144
151
|
}
|
|
145
152
|
Y();
|
|
146
153
|
});
|
|
147
|
-
const
|
|
154
|
+
const we = () => {
|
|
148
155
|
if (E.value) {
|
|
149
156
|
a.value = [];
|
|
150
157
|
return;
|
|
@@ -162,13 +169,13 @@ const al = (e, d, g) => {
|
|
|
162
169
|
d("selectAll");
|
|
163
170
|
}
|
|
164
171
|
}, xe = () => {
|
|
165
|
-
|
|
172
|
+
we(), y.VERSION !== 4 && (n.value = a.value);
|
|
166
173
|
}, De = (l = !0) => {
|
|
167
174
|
a.value = [], l ? (n.value = [], v.value = [], d("clear")) : e.dynamicFilterMode || d("clear");
|
|
168
175
|
}, G = (l, t) => {
|
|
169
|
-
if (l =
|
|
176
|
+
if (l = I(l), y.VERSION === 4 ? l[e.disabledOptionKey] : h.value[t]?.disabled)
|
|
170
177
|
return;
|
|
171
|
-
if (
|
|
178
|
+
if (T.value = t, !e.multi) {
|
|
172
179
|
e.keepOpen || A(!1), s.goToOption(
|
|
173
180
|
0
|
|
174
181
|
/* None */
|
|
@@ -178,53 +185,53 @@ const al = (e, d, g) => {
|
|
|
178
185
|
if (!Array.isArray(a.value))
|
|
179
186
|
return;
|
|
180
187
|
m.value?.focus();
|
|
181
|
-
const
|
|
182
|
-
if (ae(
|
|
188
|
+
const f = I(a.value);
|
|
189
|
+
if (ae(f, l) || e.comparingKey && f.findIndex(
|
|
183
190
|
(u) => u[e.comparingKey] === l[e.comparingKey]
|
|
184
191
|
) > -1) {
|
|
185
|
-
a.value =
|
|
192
|
+
a.value = f.filter((u) => e.comparingKey ? u[e.comparingKey] !== l[e.comparingKey] : !Be(u, l));
|
|
186
193
|
return;
|
|
187
194
|
} else {
|
|
188
|
-
a.value = [...
|
|
195
|
+
a.value = [...f, l];
|
|
189
196
|
return;
|
|
190
197
|
}
|
|
191
|
-
}, Me = (l) =>
|
|
192
|
-
activeIndex:
|
|
193
|
-
options:
|
|
198
|
+
}, Me = (l) => h.value[l]?.disabled, s = {
|
|
199
|
+
activeIndex: g,
|
|
200
|
+
options: h,
|
|
194
201
|
selectedOption: n,
|
|
195
202
|
labelRef: z,
|
|
196
203
|
activeOption: R,
|
|
197
|
-
listRef:
|
|
204
|
+
listRef: x,
|
|
198
205
|
clearable: e.clearable,
|
|
199
206
|
type: de.input ? U.Search : U.Dropdown,
|
|
200
|
-
mode: e.multi ?
|
|
201
|
-
query:
|
|
207
|
+
mode: e.multi ? w.Multi : w.Single,
|
|
208
|
+
query: O,
|
|
202
209
|
selectedValue: F,
|
|
203
210
|
toggle: A,
|
|
204
211
|
disabled: e.disabled,
|
|
205
|
-
open:
|
|
212
|
+
open: S,
|
|
206
213
|
mandatory: e.mandatory,
|
|
207
214
|
size: e.size,
|
|
208
215
|
placeholder: e.placeholder,
|
|
209
216
|
select: G,
|
|
210
217
|
clearSelection: () => {
|
|
211
|
-
_(""), n.value = s.mode ===
|
|
218
|
+
_(""), n.value = s.mode === w.Single ? null : [], v.value = s.mode === w.Single ? null : [], m.value && (m.value.value = "");
|
|
212
219
|
},
|
|
213
220
|
search: _,
|
|
214
221
|
goToOption: async (l) => {
|
|
215
|
-
if (!
|
|
222
|
+
if (!S.value)
|
|
216
223
|
return;
|
|
217
|
-
let t =
|
|
218
|
-
const i =
|
|
224
|
+
let t = g.value + l;
|
|
225
|
+
const i = h.value.filter(
|
|
219
226
|
(u) => u.disabled
|
|
220
|
-
).length,
|
|
221
|
-
for (t >
|
|
222
|
-
if (!
|
|
223
|
-
R.value = o.value[t],
|
|
227
|
+
).length, f = o.value.length - i;
|
|
228
|
+
for (t > f && (t = f + 1); ; ) {
|
|
229
|
+
if (!h.value[t]?.disabled) {
|
|
230
|
+
R.value = o.value[t], g.value = t;
|
|
224
231
|
return;
|
|
225
232
|
}
|
|
226
|
-
if ((l === 1 || l === 10) && (t = t + 1), (l === -1 || l === -10) && (t = t + -1), !!Me(
|
|
227
|
-
R.value = o.value[t],
|
|
233
|
+
if ((l === 1 || l === 10) && (t = t + 1), (l === -1 || l === -10) && (t = t + -1), !!Me(g.value)) {
|
|
234
|
+
R.value = o.value[t], g.value = t;
|
|
228
235
|
return;
|
|
229
236
|
}
|
|
230
237
|
}
|
|
@@ -233,20 +240,20 @@ const al = (e, d, g) => {
|
|
|
233
240
|
m.value = l.value;
|
|
234
241
|
},
|
|
235
242
|
registerOption: (l, t, i) => {
|
|
236
|
-
|
|
243
|
+
h.value = [...h.value, { id: l, disabled: t, hasSubtitle: i }];
|
|
237
244
|
},
|
|
238
245
|
unRegisterOption(l) {
|
|
239
|
-
|
|
246
|
+
h.value = h.value.filter((t) => t.id !== l);
|
|
240
247
|
}
|
|
241
248
|
};
|
|
242
249
|
Le($e, s), ne(
|
|
243
|
-
|
|
250
|
+
x,
|
|
244
251
|
() => {
|
|
245
|
-
|
|
252
|
+
S.value && te();
|
|
246
253
|
},
|
|
247
254
|
{
|
|
248
255
|
ignore: [
|
|
249
|
-
|
|
256
|
+
D,
|
|
250
257
|
W,
|
|
251
258
|
J,
|
|
252
259
|
Q,
|
|
@@ -261,15 +268,15 @@ const al = (e, d, g) => {
|
|
|
261
268
|
Ue(async () => {
|
|
262
269
|
e.autoFocus && (await N(), setTimeout(() => {
|
|
263
270
|
j.value.focus();
|
|
264
|
-
})), s.goToOption(0), e.multi && !B && (e.groupedOptions ?
|
|
271
|
+
})), s.goToOption(0), e.multi && !B && (e.groupedOptions ? C.value = X(
|
|
265
272
|
o,
|
|
266
273
|
a
|
|
267
|
-
) :
|
|
274
|
+
) : C.value = e.options.length === e.selected.length);
|
|
268
275
|
});
|
|
269
276
|
const le = () => {
|
|
270
|
-
e.multi && (n.value = a.value, Array.isArray(n.value) && (v.value =
|
|
277
|
+
e.multi && (n.value = a.value, Array.isArray(n.value) && (v.value = I(n.value).slice(), C.value = e.groupedOptions ? ce(e.options) === n.value.length : e.options.length === n.value.length)), d("apply", n.value), d("allSelectedChanged", E.value), A(!1), Ce();
|
|
271
278
|
}, te = () => {
|
|
272
|
-
p.value && Array.isArray(v.value) && (n.value =
|
|
279
|
+
p.value && Array.isArray(v.value) && (n.value = I(v.value).slice()), O.value = "", A(!1);
|
|
273
280
|
}, Ne = (l) => {
|
|
274
281
|
if (!e.disableKeyboardEvents)
|
|
275
282
|
switch (l.key) {
|
|
@@ -315,24 +322,24 @@ const al = (e, d, g) => {
|
|
|
315
322
|
break;
|
|
316
323
|
}
|
|
317
324
|
case "Enter": {
|
|
318
|
-
if (!
|
|
325
|
+
if (!S.value) {
|
|
319
326
|
A(!0);
|
|
320
327
|
return;
|
|
321
328
|
}
|
|
322
|
-
G(o.value[
|
|
329
|
+
G(o.value[g.value], g.value), s.mode === w.Single && !e.keepOpen && A(!1), l.preventDefault();
|
|
323
330
|
break;
|
|
324
331
|
}
|
|
325
332
|
}
|
|
326
333
|
}, Re = c(() => {
|
|
327
334
|
if (e.loading)
|
|
328
335
|
return 8.5;
|
|
329
|
-
const l = e.loadMoreLoading &&
|
|
336
|
+
const l = e.loadMoreLoading && y.MAX_NUMBER_OF_OPTIONS || e.customNumberOfDisplayedOptions || V.value.reduce((L, Ee) => {
|
|
330
337
|
const _e = e.overrideOptionCountCalculation ? e.overrideOptionCountCalculation(Ee.data) : 1;
|
|
331
338
|
return L + _e;
|
|
332
|
-
}, 0), t = e.multi && e.showSelectAll && !
|
|
333
|
-
let u = i ?
|
|
334
|
-
return e.loadMoreLoading && e.multi && (V.value.length ? u = u + 0.1 : u = u - 0.9), e.noResultsText && u === 0 && (u = u + 1), e.withConditions &&
|
|
335
|
-
u * ee.value +
|
|
339
|
+
}, 0), t = e.multi && e.showSelectAll && !O.value ? 1 : 0, i = l > y.MAX_NUMBER_OF_OPTIONS, f = l + t;
|
|
340
|
+
let u = i ? y.MAX_NUMBER_OF_OPTIONS + 0.1 : f;
|
|
341
|
+
return e.loadMoreLoading && e.multi && (V.value.length ? u = u + 0.1 : u = u - 0.9), e.noResultsText && u === 0 && (u = u + 1), e.withConditions && O.value && (u = u + 1), je(
|
|
342
|
+
u * ee.value + y.PADDING_PX
|
|
336
343
|
);
|
|
337
344
|
});
|
|
338
345
|
return Xe(
|
|
@@ -346,18 +353,18 @@ const al = (e, d, g) => {
|
|
|
346
353
|
}), {
|
|
347
354
|
onKeydown: Ke,
|
|
348
355
|
location: ge,
|
|
349
|
-
open:
|
|
356
|
+
open: S,
|
|
350
357
|
toggleMenu: A,
|
|
351
358
|
onButtonKeydown: Ne,
|
|
352
359
|
displayedValue: Ae,
|
|
353
360
|
labelRef: z,
|
|
354
|
-
query:
|
|
361
|
+
query: O,
|
|
355
362
|
containerProps: k,
|
|
356
363
|
calculateTableHeight: Re,
|
|
357
|
-
wrapperProps:
|
|
364
|
+
wrapperProps: Ie,
|
|
358
365
|
filteredOptions: o,
|
|
359
366
|
allSelected: E,
|
|
360
|
-
allSelectedApplied:
|
|
367
|
+
allSelectedApplied: C,
|
|
361
368
|
isIndeterminate: be,
|
|
362
369
|
onSelectAll: xe,
|
|
363
370
|
virtualOptions: V,
|
|
@@ -366,13 +373,13 @@ const al = (e, d, g) => {
|
|
|
366
373
|
selectedOptionPrevious: v,
|
|
367
374
|
selectedValue: F,
|
|
368
375
|
onSelect: G,
|
|
369
|
-
activeIndex:
|
|
376
|
+
activeIndex: g,
|
|
370
377
|
onCancel: te,
|
|
371
378
|
onApply: le,
|
|
372
|
-
scrollTo:
|
|
379
|
+
scrollTo: P,
|
|
373
380
|
onClickOutside: ne,
|
|
374
|
-
listRef:
|
|
375
|
-
buttonRef:
|
|
381
|
+
listRef: x,
|
|
382
|
+
buttonRef: D,
|
|
376
383
|
apply: W,
|
|
377
384
|
cancel: J,
|
|
378
385
|
el: j,
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import o from "./TreeDropdown.vue2.js";
|
|
2
2
|
/* empty css */import e from "../../../_virtual/_plugin-vue_export-helper.js";
|
|
3
|
-
// import "../../../TreeDropdown.
|
|
4
|
-
const s = /* @__PURE__ */ e(o, [["__scopeId", "data-v-
|
|
3
|
+
// import "../../../TreeDropdown.vue_vue_type_style_index_0_scoped_4ba9e4bd_lang.css"; //*');
|
|
4
|
+
const s = /* @__PURE__ */ e(o, [["__scopeId", "data-v-4ba9e4bd"]]);
|
|
5
5
|
export {
|
|
6
6
|
s as default
|
|
7
7
|
};
|
|
@@ -1,6 +1,6 @@
|
|
|
1
|
-
import "../../../TreeDropdown.
|
|
2
|
-
import
|
|
3
|
-
import
|
|
1
|
+
import "../../../TreeDropdown.vue_vue_type_style_index_0_scoped_4ba9e4bd_lang.css"; import { defineComponent as ne, provide as le, ref as c, computed as K, onMounted as te, watch as E, openBlock as g, createBlock as D, unref as d, withCtx as h, createVNode as C, mergeProps as z, createSlots as oe, renderSlot as ie, createElementVNode as M, withModifiers as S, createTextVNode as de, createElementBlock as B, withDirectives as ae, Fragment as se, renderList as re, vShow as ce, createCommentVNode as ue } from "vue";
|
|
2
|
+
import pe from "./DropdownV4.vue.js";
|
|
3
|
+
import ye from "./DefaultDropdownTrigger.vue.js";
|
|
4
4
|
import "./IconButtonDropdownTrigger.vue.js";
|
|
5
5
|
import "./ChipDropdownTrigger.vue.js";
|
|
6
6
|
import "./AppDropdownTrigger.vue.js";
|
|
@@ -9,14 +9,14 @@ import "./ButtonFilterDropdownTrigger.vue.js";
|
|
|
9
9
|
import "./TreeDropdown.vue.js";
|
|
10
10
|
import w from "./OptionV4.vue.js";
|
|
11
11
|
import "./ConditionalDropdown.vue.js";
|
|
12
|
-
import { useChildOptions as
|
|
12
|
+
import { useChildOptions as he } from "../composables/useChildOptions.js";
|
|
13
13
|
import fe from "../../search/v4/SearchV4.vue.js";
|
|
14
|
-
import { useTestIdAttrs as
|
|
14
|
+
import { useTestIdAttrs as ve } from "../../../utils/testIds.js";
|
|
15
15
|
import { DropdownTestIdModifiers as $ } from "../../../testids/index.js";
|
|
16
|
-
const
|
|
16
|
+
const me = {
|
|
17
17
|
key: 0,
|
|
18
18
|
class: "child-options"
|
|
19
|
-
},
|
|
19
|
+
}, Ae = /* @__PURE__ */ ne({
|
|
20
20
|
__name: "TreeDropdown",
|
|
21
21
|
props: {
|
|
22
22
|
options: null,
|
|
@@ -44,7 +44,7 @@ const ve = {
|
|
|
44
44
|
emits: ["update:selected", "update:isOpen"],
|
|
45
45
|
setup(t, { emit: b }) {
|
|
46
46
|
const n = t;
|
|
47
|
-
|
|
47
|
+
le("isTreeDropdown", !0);
|
|
48
48
|
const m = c([]), u = c([]), T = c({}), O = c(!1), i = c([...n.selected]), p = c(""), x = c(!0), N = K(() => u.value.reduce((e, o) => (o[n.optionChildrenKey] && o[n.optionChildrenKey].length && o[n.optionChildrenKey].forEach(() => {
|
|
49
49
|
e = e + 1;
|
|
50
50
|
}), o[n.optionChildrenKey] || (e = e + 1), e), 0)), U = () => {
|
|
@@ -53,9 +53,9 @@ const ve = {
|
|
|
53
53
|
...e[n.optionChildrenKey]
|
|
54
54
|
]);
|
|
55
55
|
}), m.value = [...n.options], u.value = [...n.options];
|
|
56
|
-
}, { hasChildren:
|
|
57
|
-
if (
|
|
58
|
-
|
|
56
|
+
}, { hasChildren: f, getChildren: v, allChildrenSelected: I, someChildrenSelected: P } = he(i, n.optionChildrenKey), q = (e) => {
|
|
57
|
+
if (f(e)) {
|
|
58
|
+
I(e) ? i.value = i.value.filter(
|
|
59
59
|
(o) => !v(e).includes(o)
|
|
60
60
|
) : i.value = [
|
|
61
61
|
...i.value.filter((o) => !v(e).includes(o)),
|
|
@@ -66,7 +66,7 @@ const ve = {
|
|
|
66
66
|
i.value.includes(e) ? i.value = i.value.filter(
|
|
67
67
|
(o) => o !== e
|
|
68
68
|
) : i.value = [...i.value, e];
|
|
69
|
-
}, A = (e) => i.value.includes(e), J = (e) => 1 + (
|
|
69
|
+
}, A = (e) => i.value.includes(e), J = (e) => 1 + (f(e) ? v(e).length : 0), j = () => {
|
|
70
70
|
b("update:selected", i.value), L.value = y.value;
|
|
71
71
|
}, F = () => {
|
|
72
72
|
i.value = [];
|
|
@@ -76,8 +76,8 @@ const ve = {
|
|
|
76
76
|
if (n.selected?.includes(l))
|
|
77
77
|
e.add(l);
|
|
78
78
|
else if (l[n.optionChildrenKey] && l[n.optionChildrenKey].length) {
|
|
79
|
-
for (const
|
|
80
|
-
if (n.selected?.includes(
|
|
79
|
+
for (const s of l[n.optionChildrenKey])
|
|
80
|
+
if (n.selected?.includes(s)) {
|
|
81
81
|
e.add(l);
|
|
82
82
|
break;
|
|
83
83
|
}
|
|
@@ -88,61 +88,56 @@ const ve = {
|
|
|
88
88
|
!n.selected.includes(l) && !e.has(l) && o.push(l);
|
|
89
89
|
}), o;
|
|
90
90
|
};
|
|
91
|
-
|
|
91
|
+
te(() => {
|
|
92
92
|
O.value || (U(), O.value = !0, n.preExpandedOptions && n.preExpandedOptions.forEach((e) => {
|
|
93
93
|
a.value[e] = 1;
|
|
94
94
|
}));
|
|
95
|
-
}),
|
|
95
|
+
}), E(
|
|
96
96
|
() => n.options,
|
|
97
97
|
() => {
|
|
98
98
|
U();
|
|
99
99
|
}
|
|
100
|
-
),
|
|
100
|
+
), E(
|
|
101
101
|
() => n.selected,
|
|
102
102
|
(e, o) => {
|
|
103
103
|
JSON.stringify(e) !== JSON.stringify(o) && (i.value = [...n.selected]);
|
|
104
104
|
}
|
|
105
105
|
);
|
|
106
|
-
const y = K(() => i.value.length < N.value ? !1 : i.value.length === N.value), H = K(() => !y.value && i.value.length > 0), L = c(y.value)
|
|
107
|
-
|
|
108
|
-
|
|
109
|
-
() => {
|
|
110
|
-
n.isOpen ? m.value = G() : (i.value = [...n.selected], p.value = "");
|
|
111
|
-
}
|
|
112
|
-
);
|
|
113
|
-
const a = c({}), Q = (e) => {
|
|
106
|
+
const y = K(() => i.value.length < N.value ? !1 : i.value.length === N.value), H = K(() => !y.value && i.value.length > 0), L = c(y.value), Q = (e) => {
|
|
107
|
+
b("update:isOpen", e), n.isOpen ? m.value = G() : (i.value = [...n.selected], p.value = "");
|
|
108
|
+
}, a = c({}), R = (e) => {
|
|
114
109
|
a.value[e[n.optionUniqueIdKey]] ? delete a.value[e[n.optionUniqueIdKey]] : a.value[e[n.optionUniqueIdKey]] = 1;
|
|
115
110
|
};
|
|
116
|
-
function
|
|
117
|
-
const l = e.toLowerCase(),
|
|
118
|
-
return o.value.forEach((
|
|
119
|
-
const
|
|
120
|
-
(
|
|
111
|
+
function W(e, o) {
|
|
112
|
+
const l = e.toLowerCase(), s = [];
|
|
113
|
+
return o.value.forEach((r) => {
|
|
114
|
+
const k = r[n.optionNameKey].toLowerCase().includes(l), V = T.value[r[n.optionUniqueIdKey]]?.filter(
|
|
115
|
+
(ee) => ee[n.optionNameKey].toLowerCase().includes(l)
|
|
121
116
|
) || [];
|
|
122
|
-
(
|
|
123
|
-
}),
|
|
117
|
+
(k || V.length > 0) && (r[n.optionChildrenKey] = V, s.push(r));
|
|
118
|
+
}), s;
|
|
124
119
|
}
|
|
125
|
-
const
|
|
126
|
-
const o =
|
|
120
|
+
const X = (e) => {
|
|
121
|
+
const o = W(e, u);
|
|
127
122
|
e && (Object.keys(a.value).forEach((l) => {
|
|
128
123
|
delete a.value[l];
|
|
129
124
|
}), o.forEach((l) => {
|
|
130
125
|
Array.isArray(l[n.optionChildrenKey]) && l[n.optionChildrenKey].length && (a.value[l[n.optionUniqueIdKey]] = 1);
|
|
131
126
|
})), m.value = o;
|
|
132
|
-
},
|
|
127
|
+
}, Y = K(() => {
|
|
133
128
|
const e = n.options.length, o = n.options.reduce(
|
|
134
|
-
(l,
|
|
129
|
+
(l, s) => (a.value[s[n.optionUniqueIdKey]] && (l = l + s[n.optionChildrenKey].length), l),
|
|
135
130
|
0
|
|
136
131
|
);
|
|
137
132
|
return e + o;
|
|
138
133
|
});
|
|
139
|
-
|
|
134
|
+
E(
|
|
140
135
|
() => p.value,
|
|
141
136
|
() => {
|
|
142
|
-
|
|
137
|
+
X(p.value), x.value = !p.value;
|
|
143
138
|
}
|
|
144
139
|
);
|
|
145
|
-
const
|
|
140
|
+
const Z = () => {
|
|
146
141
|
y.value ? i.value = [] : (i.value = [], u.value.forEach((e) => {
|
|
147
142
|
if (e[n.optionChildrenKey] && e[n.optionChildrenKey].length)
|
|
148
143
|
for (const o of e[n.optionChildrenKey])
|
|
@@ -150,8 +145,8 @@ const ve = {
|
|
|
150
145
|
else
|
|
151
146
|
i.value = [e, ...i.value];
|
|
152
147
|
}));
|
|
153
|
-
},
|
|
154
|
-
return (e, o) => (
|
|
148
|
+
}, _ = ve(n.testId, $);
|
|
149
|
+
return (e, o) => (g(), D(d(pe), {
|
|
155
150
|
multi: "",
|
|
156
151
|
class: "tree-dropdown",
|
|
157
152
|
"show-select-all": x.value,
|
|
@@ -170,27 +165,27 @@ const ve = {
|
|
|
170
165
|
"override-option-count-calculation": J,
|
|
171
166
|
"trigger-show-all-selected-text": !1,
|
|
172
167
|
"predefined-trigger": "default",
|
|
173
|
-
"custom-number-of-displayed-options": d(
|
|
174
|
-
"onUpdate:isOpen":
|
|
168
|
+
"custom-number-of-displayed-options": d(Y),
|
|
169
|
+
"onUpdate:isOpen": Q,
|
|
175
170
|
onApply: j,
|
|
176
171
|
onClear: F
|
|
177
172
|
}, {
|
|
178
|
-
"dropdown-trigger":
|
|
179
|
-
|
|
173
|
+
"dropdown-trigger": h(({ defaultTriggerProps: l }) => [
|
|
174
|
+
C(d(ye), z(l, {
|
|
180
175
|
"all-selected": L.value,
|
|
181
176
|
"show-all-selected-text": ""
|
|
182
|
-
}),
|
|
177
|
+
}), oe({ _: 2 }, [
|
|
183
178
|
e.$slots["trigger-end-icon"] ? {
|
|
184
179
|
name: "end-icon",
|
|
185
|
-
fn:
|
|
186
|
-
|
|
180
|
+
fn: h(() => [
|
|
181
|
+
ie(e.$slots, "trigger-end-icon", {}, void 0, !0)
|
|
187
182
|
]),
|
|
188
183
|
key: "0"
|
|
189
184
|
} : void 0
|
|
190
185
|
]), 1040, ["all-selected"])
|
|
191
186
|
]),
|
|
192
|
-
"inline-search":
|
|
193
|
-
|
|
187
|
+
"inline-search": h(() => [
|
|
188
|
+
C(d(fe), {
|
|
194
189
|
modelValue: p.value,
|
|
195
190
|
"onUpdate:modelValue": o[0] || (o[0] = (l) => p.value = l),
|
|
196
191
|
class: "tree-search",
|
|
@@ -201,30 +196,30 @@ const ve = {
|
|
|
201
196
|
"test-id": t.testId
|
|
202
197
|
}, null, 8, ["modelValue", "placeholder", "test-id"])
|
|
203
198
|
]),
|
|
204
|
-
"select-all":
|
|
199
|
+
"select-all": h(() => [
|
|
205
200
|
M("li", null, [
|
|
206
|
-
|
|
201
|
+
C(d(w), z({
|
|
207
202
|
"aria-selected": d(y),
|
|
208
203
|
"aria-disabled": !!t.disabled,
|
|
209
204
|
"selected-prop": d(y),
|
|
210
205
|
"is-indeterminate": d(H),
|
|
211
206
|
"is-multi": "",
|
|
212
207
|
"select-all-option": ""
|
|
213
|
-
}, d(
|
|
214
|
-
onClick: o[1] || (o[1] = S((l) =>
|
|
208
|
+
}, d(_)[d($).SELECT_ALL], {
|
|
209
|
+
onClick: o[1] || (o[1] = S((l) => Z(), ["stop"]))
|
|
215
210
|
}), {
|
|
216
|
-
default:
|
|
217
|
-
|
|
211
|
+
default: h(() => [
|
|
212
|
+
de(" Select all ")
|
|
218
213
|
]),
|
|
219
214
|
_: 1
|
|
220
215
|
}, 16, ["aria-selected", "aria-disabled", "selected-prop", "is-indeterminate"])
|
|
221
216
|
])
|
|
222
217
|
]),
|
|
223
|
-
default:
|
|
224
|
-
|
|
218
|
+
default: h(({ option: l, index: s }) => [
|
|
219
|
+
C(d(w), {
|
|
225
220
|
option: l,
|
|
226
|
-
"selected-prop": d(
|
|
227
|
-
"is-indeterminate": !d(
|
|
221
|
+
"selected-prop": d(f)(l) ? d(I)(l) : A(l),
|
|
222
|
+
"is-indeterminate": !d(I)(l) && d(P)(l),
|
|
228
223
|
disabled: l[t.disabledOptionKey],
|
|
229
224
|
"name-key": t.optionNameKey,
|
|
230
225
|
"image-key": t.optionImageKey,
|
|
@@ -233,20 +228,20 @@ const ve = {
|
|
|
233
228
|
"end-icon-key": t.optionEndIconKey,
|
|
234
229
|
"end-icon-type": t.optionEndIconType,
|
|
235
230
|
"end-text-icon-key": t.optionEndTextIconKey,
|
|
236
|
-
"tree-main-option": d(
|
|
231
|
+
"tree-main-option": d(f)(l),
|
|
237
232
|
"tree-main-option-expanded": a.value[l[t.optionUniqueIdKey]],
|
|
238
233
|
"stop-option-click-event-propagation": "",
|
|
239
234
|
"is-multi": "",
|
|
240
235
|
onClick: S(() => q(l), ["stop"]),
|
|
241
|
-
onToggleTreeCollapse:
|
|
236
|
+
onToggleTreeCollapse: R
|
|
242
237
|
}, null, 8, ["option", "selected-prop", "is-indeterminate", "disabled", "name-key", "image-key", "icon-key", "icon-type", "end-icon-key", "end-icon-type", "end-text-icon-key", "tree-main-option", "tree-main-option-expanded", "onClick"]),
|
|
243
|
-
d(
|
|
244
|
-
|
|
245
|
-
(
|
|
246
|
-
key: `${
|
|
247
|
-
option:
|
|
248
|
-
"selected-prop": A(
|
|
249
|
-
disabled:
|
|
238
|
+
d(f)(l) ? (g(), B("div", me, [
|
|
239
|
+
ae(M("div", null, [
|
|
240
|
+
(g(!0), B(se, null, re(d(v)(l), (r, k) => (g(), D(d(w), {
|
|
241
|
+
key: `${s}-${k}`,
|
|
242
|
+
option: r,
|
|
243
|
+
"selected-prop": A(r),
|
|
244
|
+
disabled: r[t.disabledOptionKey],
|
|
250
245
|
"name-key": t.optionNameKey,
|
|
251
246
|
"image-key": t.optionImageKey,
|
|
252
247
|
"icon-key": t.optionIconKey,
|
|
@@ -257,17 +252,17 @@ const ve = {
|
|
|
257
252
|
"tree-child-shown": a.value[l[t.optionUniqueIdKey]],
|
|
258
253
|
"stop-option-click-event-propagation": "",
|
|
259
254
|
"is-multi": "",
|
|
260
|
-
onClick: S(() => q(
|
|
255
|
+
onClick: S(() => q(r), ["stop"])
|
|
261
256
|
}, null, 8, ["option", "selected-prop", "disabled", "name-key", "image-key", "icon-key", "icon-type", "end-icon-key", "end-icon-type", "end-text-icon-key", "tree-child-shown", "onClick"]))), 128))
|
|
262
257
|
], 512), [
|
|
263
|
-
[
|
|
258
|
+
[ce, a.value[l[t.optionUniqueIdKey]]]
|
|
264
259
|
])
|
|
265
|
-
])) :
|
|
260
|
+
])) : ue("", !0)
|
|
266
261
|
]),
|
|
267
262
|
_: 3
|
|
268
263
|
}, 8, ["show-select-all", "is-open", "options", "selected", "display-value", "placeholder", "inline-search-placeholder", "option-name-key", "size", "test-id", "disabled", "custom-number-of-displayed-options"]));
|
|
269
264
|
}
|
|
270
265
|
});
|
|
271
266
|
export {
|
|
272
|
-
|
|
267
|
+
Ae as default
|
|
273
268
|
};
|
package/index.js
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import './
|
|
1
|
+
import './Menu.vue_vue_type_style_index_0_scoped_eb057818_lang.css';
|
|
2
2
|
import { AppTriggerTypes as eo } from "./components/appTrigger/index.js";
|
|
3
3
|
import { AutocompleteDropdownTypes as to } from "./components/autocompleteDropdown/index.js";
|
|
4
4
|
import { MenuItemTypes as ao } from "./components/menuItem/index.js";
|
package/package.json
CHANGED
|
@@ -1 +0,0 @@
|
|
|
1
|
-
.child-options[data-v-b883d1fa]{padding-left:1rem}.tree-search[data-v-b883d1fa]{width:100%}
|