@ironsource/shared-ui 2.1.7-test.1 → 2.1.7-test.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/Autocomplete.vue_vue_type_style_index_0_scoped_e361f9fd_lang.css +1 -0
- package/Chart.vue_vue_type_style_index_0_scoped_f06a4764_lang.css +1 -0
- package/ChartHeader.vue_vue_type_style_index_0_scoped_88d4532f_lang.css +1 -0
- package/ChartLegend.vue_vue_type_style_index_0_scoped_efc608f9_lang.css +1 -0
- package/ChartLoader.vue_vue_type_style_index_0_scoped_142c444a_lang.css +1 -0
- package/ChartTooltip.vue_vue_type_style_index_0_scoped_ec636f18_lang.css +1 -0
- package/DataGrid.vue_vue_type_style_index_0_scoped_706b324e_lang.css +1 -0
- package/DataGridRowsCounter.vue_vue_type_style_index_0_scoped_0ce71f73_lang.css +1 -0
- package/DefaultDropdownTrigger.vue_vue_type_style_index_0_scoped_98819e5a_lang.css +1 -0
- package/DropdownV4.vue_vue_type_style_index_0_scoped_00ccab6b_lang.css +1 -0
- package/EditableV4.vue_vue_type_style_index_0_scoped_e0c047b4_lang.css +1 -0
- package/FieldMaxLength.vue_vue_type_style_index_0_scoped_47877984_lang.css +1 -0
- package/IconV4.vue_vue_type_style_index_0_scoped_dc433d48_lang.css +1 -0
- package/IncludeExclude.vue_vue_type_style_index_0_scoped_cc2adbf5_lang.css +1 -0
- package/IncludeExcludeDragDrop.vue_vue_type_style_index_0_scoped_bd6145ce_lang.css +1 -0
- package/MultipleDataGrid.vue_vue_type_style_index_0_scoped_82ba0e12_lang.css +1 -0
- package/OptionV4.vue_vue_type_style_index_0_scoped_77509f61_lang.css +1 -0
- package/Popover.vue_vue_type_style_index_0_scoped_c607b770_lang.css +1 -0
- package/PopoverV4.vue_vue_type_style_index_0_scoped_c54cd089_lang.css +1 -0
- package/PopoverV4.vue_vue_type_style_index_1_lang.css +1 -0
- package/README.md +1 -1
- package/SortableItem.vue_vue_type_style_index_0_scoped_9dd4d372_lang.css +1 -0
- package/SortableItemLabel.vue_vue_type_style_index_0_scoped_1386ae20_lang.css +1 -0
- package/SortableList.vue_vue_type_style_index_0_scoped_e9cd63b8_lang.css +1 -0
- package/TabsV4.vue_vue_type_style_index_0_scoped_f9433b11_lang.css +1 -0
- package/TextAreaV4.vue_vue_type_style_index_0_scoped_4114ef89_lang.css +1 -0
- package/TextField.vue_vue_type_style_index_0_scoped_4d9bf5b2_lang.css +1 -0
- package/ThemeWrapper.vue_vue_type_style_index_0_scoped_66bd448a_lang.css +1 -0
- package/TreeDropdown.vue_vue_type_style_index_0_scoped_dbd80d49_lang.css +1 -0
- package/components/ThemeWrapper/ThemeWrapper.vue.js +2 -2
- package/components/ThemeWrapper/ThemeWrapper.vue2.js +5 -5
- package/components/appHeader/AppHeader.vue.d.ts +1 -1
- package/components/appHeader/index.d.ts +9 -9
- package/components/autocomplete/Autocomplete.vue.d.ts +5 -0
- package/components/autocomplete/Autocomplete.vue.js +2 -2
- package/components/autocomplete/Autocomplete.vue2.js +57 -45
- package/components/autocomplete/index.d.ts +20 -1
- package/components/chart/Chart.vue.js +7 -0
- package/components/chart/Chart.vue2.js +281 -0
- package/components/chart/ChartHeader.vue.js +7 -0
- package/components/chart/ChartHeader.vue2.js +51 -0
- package/components/chart/ChartLegend.vue.js +7 -0
- package/components/chart/ChartLegend.vue2.js +65 -0
- package/components/chart/ChartLoader.vue.js +25 -0
- package/components/chart/ChartLoader.vue2.js +0 -0
- package/components/chart/ChartTooltip.vue.js +7 -0
- package/components/chart/ChartTooltip.vue2.js +81 -0
- package/components/chart/composables/useChartValues.js +32 -0
- package/components/chart/composables/useTooltipPosition.js +22 -0
- package/components/chart/consts.js +21 -0
- package/components/chart/index.js +6 -0
- package/components/chart/plugins/HoverVerticalLine.js +12 -0
- package/components/chart/types.js +4 -0
- package/components/chart/utils/formatNumber.js +11 -0
- package/components/chart/utils/utils.js +12 -0
- package/components/dropdown/common/Dropdown.common.js +89 -89
- package/components/dropdown/v4/DefaultDropdownTrigger.vue.d.ts +1 -0
- package/components/dropdown/v4/DefaultDropdownTrigger.vue.js +2 -2
- package/components/dropdown/v4/DefaultDropdownTrigger.vue2.js +32 -29
- package/components/dropdown/v4/DropdownV4.vue.d.ts +39 -0
- package/components/dropdown/v4/DropdownV4.vue.js +3 -3
- package/components/dropdown/v4/DropdownV4.vue2.js +256 -224
- package/components/dropdown/v4/OptionV4.vue.d.ts +36 -2
- package/components/dropdown/v4/OptionV4.vue.js +2 -2
- package/components/dropdown/v4/OptionV4.vue2.js +99 -59
- package/components/dropdown/v4/TreeDropdown.vue.d.ts +21 -16
- package/components/dropdown/v4/TreeDropdown.vue.js +3 -3
- package/components/dropdown/v4/TreeDropdown.vue2.js +170 -74
- package/components/dropdown/v4/dropdownStoryArgs.d.ts +14 -0
- package/components/dropdown/v4/index.d.ts +528 -83
- package/components/icon/v4/IconV4.vue.d.ts +5 -0
- package/components/icon/v4/IconV4.vue.js +4 -4
- package/components/icon/v4/IconV4.vue2.js +29 -26
- package/components/icon/v4/index.d.ts +20 -1
- package/components/includeExclude/IncludeExclude.vue.js +4 -4
- package/components/includeExclude/IncludeExclude.vue2.js +2 -2
- package/components/includeExclude/IncludeExcludeDragDrop.vue.js +4 -4
- package/components/includeExclude/IncludeExcludeDragDrop.vue2.js +2 -2
- package/components/input/v4/TextField.vue.d.ts +6 -1
- package/components/input/v4/TextField.vue.js +3 -3
- package/components/input/v4/TextField.vue2.js +95 -90
- package/components/input/v4/index.d.ts +20 -1
- package/components/popover/common/Popover.common.d.ts +6 -0
- package/components/popover/common/Popover.common.js +17 -0
- package/components/popover/v3/Popover.vue.js +8 -0
- package/components/popover/{Popover.vue2.js → v3/Popover.vue2.js} +1 -1
- package/components/popover/v4/PopoverV4.vue.d.ts +73 -0
- package/components/popover/v4/PopoverV4.vue.js +7 -0
- package/components/popover/v4/PopoverV4.vue2.js +54 -0
- package/components/popover/v4/index.d.ts +209 -0
- package/components/popover/v4/index.js +6 -0
- package/components/shared/FieldMaxLength.vue.js +3 -3
- package/components/shared/FieldMaxLength.vue2.js +2 -2
- package/components/shared/commonTypes.d.ts +2 -0
- package/components/sortableList/SortableItem.vue.js +7 -0
- package/components/sortableList/SortableItem.vue2.js +140 -0
- package/components/sortableList/SortableItemLabel.vue.js +7 -0
- package/components/sortableList/SortableItemLabel.vue2.js +60 -0
- package/components/sortableList/SortableList.vue.d.ts +25 -0
- package/components/sortableList/SortableList.vue.js +7 -0
- package/components/sortableList/SortableList.vue2.js +160 -0
- package/components/sortableList/composables/useHoverEffect.js +19 -0
- package/components/sortableList/consts.js +4 -0
- package/components/sortableList/index.d.ts +88 -2
- package/components/sortableList/index.js +6 -0
- package/components/table/v3/Table.vue.d.ts +2 -2
- package/components/table/v3/index.d.ts +39 -39
- package/components/table/v4/DataGrid.vue.d.ts +6 -2
- package/components/table/v4/DataGrid.vue.js +4 -4
- package/components/table/v4/DataGrid.vue2.js +131 -122
- package/components/table/v4/DataGridRowsCounter.vue.d.ts +5 -0
- package/components/table/v4/DataGridRowsCounter.vue.js +3 -3
- package/components/table/v4/DataGridRowsCounter.vue2.js +29 -22
- package/components/table/v4/MultipleDataGrid.vue.d.ts +16 -3
- package/components/table/v4/MultipleDataGrid.vue.js +4 -4
- package/components/table/v4/MultipleDataGrid.vue2.js +114 -66
- package/components/table/v4/index.d.ts +101 -75
- package/components/table-cells/common/Editable.common.js +37 -26
- package/components/table-cells/common/EditableContext.d.ts +1 -0
- package/components/table-cells/v4/EditableV4.vue.d.ts +5 -0
- package/components/table-cells/v4/EditableV4.vue.js +5 -5
- package/components/table-cells/v4/EditableV4.vue2.js +18 -17
- package/components/table-cells/v4/index.d.ts +20 -1
- package/components/tabs/v4/TabsV4.vue.js +4 -4
- package/components/tabs/v4/TabsV4.vue2.js +37 -40
- package/components/textArea/v4/TextAreaV4.vue.d.ts +6 -1
- package/components/textArea/v4/TextAreaV4.vue.js +3 -3
- package/components/textArea/v4/TextAreaV4.vue2.js +18 -12
- package/components/textArea/v4/index.d.ts +9 -0
- package/design-foundation.stories/icons/iconsData.d.ts +6 -2
- package/index.d.ts +9608 -7356
- package/index.js +136 -131
- package/mocks/options.d.ts +12 -0
- package/package.json +15 -3
- package/testids/index.d.ts +5 -0
- package/testids/index.js +27 -25
- package/utils/search.js +4 -0
- package/Autocomplete.vue_vue_type_style_index_0_scoped_a7bfd237_lang.css +0 -1
- package/DataGrid.vue_vue_type_style_index_0_scoped_63aaf3be_lang.css +0 -1
- package/DataGridRowsCounter.vue_vue_type_style_index_0_scoped_06751538_lang.css +0 -1
- package/DefaultDropdownTrigger.vue_vue_type_style_index_0_scoped_0345d6b1_lang.css +0 -1
- package/DropdownV4.vue_vue_type_style_index_0_scoped_7af4f288_lang.css +0 -1
- package/EditableV4.vue_vue_type_style_index_0_scoped_31bfb722_lang.css +0 -1
- package/FieldMaxLength.vue_vue_type_style_index_0_scoped_f3c4001a_lang.css +0 -1
- package/IconV4.vue_vue_type_style_index_0_scoped_1eea7671_lang.css +0 -1
- package/IncludeExclude.vue_vue_type_style_index_0_scoped_fb054d88_lang.css +0 -1
- package/IncludeExcludeDragDrop.vue_vue_type_style_index_0_scoped_5764fd61_lang.css +0 -1
- package/MultipleDataGrid.vue_vue_type_style_index_0_scoped_260b9cdc_lang.css +0 -1
- package/OptionV4.vue_vue_type_style_index_0_scoped_9db0f796_lang.css +0 -1
- package/Popover.vue_vue_type_style_index_0_scoped_25eb53db_lang.css +0 -1
- package/TabsV4.vue_vue_type_style_index_0_scoped_bab40cfe_lang.css +0 -1
- package/TextAreaV4.vue_vue_type_style_index_0_scoped_f3b2c01d_lang.css +0 -1
- package/TextField.vue_vue_type_style_index_0_scoped_a6457440_lang.css +0 -1
- package/ThemeWrapper.vue_vue_type_style_index_0_scoped_b62ee695_lang.css +0 -1
- package/TreeDropdown.vue_vue_type_style_index_0_scoped_142eab98_lang.css +0 -1
- package/components/popover/Popover.vue.js +0 -8
- /package/components/popover/{Popover.vue.d.ts → v3/Popover.vue.d.ts} +0 -0
- /package/components/popover/{index.d.ts → v3/index.d.ts} +0 -0
- /package/components/popover/{index.js → v3/index.js} +0 -0
|
@@ -1,122 +1,122 @@
|
|
|
1
|
-
import { useToggle as
|
|
2
|
-
import { ref as n, computed as r, watch as
|
|
1
|
+
import { useToggle as Ie } from "../../../composables/useToggle.js";
|
|
2
|
+
import { inject as xe, ref as n, computed as r, watch as P, useSlots as De, toRaw as A, nextTick as C, provide as Ce, onMounted as Ne } from "vue";
|
|
3
3
|
import { isObjectInArray as W } from "../../../utils/array.js";
|
|
4
|
-
import { objectsEqual as
|
|
5
|
-
import { useClamp as
|
|
6
|
-
import { Mode as
|
|
7
|
-
import { pxToRem as
|
|
8
|
-
import { useEditableContext as
|
|
9
|
-
const
|
|
10
|
-
const Z = (e, t) => l.multi ? W(e, t) :
|
|
4
|
+
import { objectsEqual as Re } from "../../../utils/object.js";
|
|
5
|
+
import { useClamp as Ee, useVirtualList as Me, onClickOutside as Y } from "@vueuse/core";
|
|
6
|
+
import { Mode as T, Type as V, DropdownContext as Ve } from "./DropdownContext.js";
|
|
7
|
+
import { pxToRem as _e } from "../../../utils/style.js";
|
|
8
|
+
import { useEditableContext as ke } from "../../table-cells/common/EditableContext.js";
|
|
9
|
+
const je = (l, b, O) => {
|
|
10
|
+
const Z = xe("isTreeDropdown", !1), F = (e, t) => l.multi ? W(e, t) : A(e) === t;
|
|
11
11
|
let _;
|
|
12
12
|
((e) => {
|
|
13
13
|
e[e.None = 0] = "None", e[e.Next = 1] = "Next", e[e.Previous = -1] = "Previous", e[e.NextPage = 10] = "NextPage", e[e.PrevPage = -10] = "PrevPage";
|
|
14
14
|
})(_ || (_ = {}));
|
|
15
15
|
const a = n(
|
|
16
16
|
l.selected
|
|
17
|
-
), N =
|
|
17
|
+
), N = ke(), u = r({
|
|
18
18
|
get() {
|
|
19
19
|
return N?.value?.value ?? a.value;
|
|
20
20
|
},
|
|
21
21
|
set(e) {
|
|
22
|
-
N.onChange?.(e), N.onClose?.(),
|
|
22
|
+
N.onChange?.(e), N.onClose?.(), b("update:selected", e);
|
|
23
23
|
}
|
|
24
24
|
});
|
|
25
|
-
|
|
25
|
+
P(
|
|
26
26
|
() => l.selected,
|
|
27
27
|
() => {
|
|
28
28
|
a.value = l.selected, v.value = l.selected;
|
|
29
29
|
}
|
|
30
30
|
);
|
|
31
|
-
const
|
|
31
|
+
const p = De(), w = n(null), g = n(null), k = n(null), R = n(null), H = n(null), I = n(null), ee = n(), B = n(null), L = n(null), U = n(null), le = 8, te = r(() => I.value ? I.value.getBoundingClientRect().height + le + l.distance : 0), c = n([]), x = n(-1), m = n(""), v = n(l.selected || []), q = () => I.value?.focus(), [d, ae, ue] = Ie({
|
|
32
32
|
disabled: l.disabled,
|
|
33
33
|
initialValue: l.defaultOpen
|
|
34
34
|
});
|
|
35
|
-
|
|
35
|
+
P(
|
|
36
36
|
() => l.disabled,
|
|
37
37
|
(e) => {
|
|
38
|
-
e !== void 0 &&
|
|
38
|
+
e !== void 0 && ue(e);
|
|
39
39
|
}
|
|
40
40
|
);
|
|
41
41
|
const G = (e) => {
|
|
42
|
-
|
|
43
|
-
},
|
|
42
|
+
ne.value = ae(e);
|
|
43
|
+
}, ne = r({
|
|
44
44
|
get() {
|
|
45
45
|
return l.isOpen;
|
|
46
46
|
},
|
|
47
47
|
set(e) {
|
|
48
|
-
|
|
48
|
+
b("update:isOpen", e);
|
|
49
49
|
}
|
|
50
|
-
}),
|
|
50
|
+
}), ie = r(() => s.value.length - 1), o = Ee(0, 0, ie), K = r(() => u.value ? l.displayValue(u.value) : ""), re = (e) => {
|
|
51
51
|
if (!e.value.length && !l.multiOptionsPlaceholderPrefix && !l.multiOptionsPlaceholderSuffix)
|
|
52
52
|
return l.placeholder;
|
|
53
53
|
const t = !l.multiOptionsPlaceholderPrefix && !l.multiOptionsPlaceholderSuffix ? `${e.value.length} selected` : `${l.multiOptionsPlaceholderPrefix ?? ""}${e.value.length ?? "0"}${l.multiOptionsPlaceholderSuffix ?? ""}`;
|
|
54
54
|
return e.value.length == 1 && l.displayValue ? l.displayValue(e.value[0]) : t;
|
|
55
|
-
},
|
|
55
|
+
}, oe = r(() => {
|
|
56
56
|
if (!l.multi)
|
|
57
57
|
return u.value ? l.displayValue(u.value) : l.placeholder;
|
|
58
58
|
if (Array.isArray(a.value))
|
|
59
|
-
return
|
|
59
|
+
return re(a);
|
|
60
60
|
}), $ = r(() => {
|
|
61
61
|
if (Array.isArray(a.value))
|
|
62
62
|
return a.value.length === s.value.length;
|
|
63
|
-
}),
|
|
64
|
-
|
|
65
|
-
},
|
|
66
|
-
const e =
|
|
63
|
+
}), se = r(() => !l.multi || !Array.isArray(a.value) ? !1 : a.value.length > 0 && a.value.length < s.value.length), E = (e) => {
|
|
64
|
+
m.value = e;
|
|
65
|
+
}, ce = r(() => {
|
|
66
|
+
const e = A(v.value), t = {
|
|
67
67
|
selected: [],
|
|
68
68
|
notSelected: []
|
|
69
69
|
};
|
|
70
|
-
return
|
|
70
|
+
return A(l.options).forEach((y) => {
|
|
71
71
|
const f = e.includes(y) ? "selected" : "notSelected";
|
|
72
72
|
t[f].push(y);
|
|
73
73
|
}), [].concat(t.selected, t.notSelected);
|
|
74
74
|
}), s = r(() => {
|
|
75
|
-
const e = Array.isArray(v.value) && l.multi &&
|
|
76
|
-
return l.onSearch ? e.filter((t) => l.onSearch(t,
|
|
77
|
-
}),
|
|
78
|
-
() =>
|
|
75
|
+
const e = Array.isArray(v.value) && l.multi && O.VERSION === 4 && !Z ? ce.value : l.options;
|
|
76
|
+
return l.onSearch ? e.filter((t) => l.onSearch(t, m.value)) : e;
|
|
77
|
+
}), ve = r(() => c.value[0]?.hasSubtitle), j = r(() => i.mode === T.Multi), X = r(
|
|
78
|
+
() => ve.value ? O.MULTILINE_LIST_HEIGHT : O.LIST_HEIGHT
|
|
79
79
|
), {
|
|
80
80
|
list: z,
|
|
81
81
|
containerProps: J,
|
|
82
|
-
wrapperProps:
|
|
82
|
+
wrapperProps: de,
|
|
83
83
|
scrollTo: D
|
|
84
|
-
} =
|
|
85
|
-
itemHeight:
|
|
84
|
+
} = Me(s, {
|
|
85
|
+
itemHeight: X.value,
|
|
86
86
|
overscan: l.disableVirtualScroll ? 1 / 0 : 2
|
|
87
87
|
});
|
|
88
|
-
|
|
88
|
+
P(
|
|
89
89
|
() => l.isOpen,
|
|
90
90
|
(e) => {
|
|
91
91
|
G(e);
|
|
92
92
|
}
|
|
93
|
-
),
|
|
93
|
+
), P([x], async () => {
|
|
94
94
|
await C();
|
|
95
|
-
}),
|
|
95
|
+
}), P(
|
|
96
96
|
[d, o, x],
|
|
97
97
|
async ([e], [t]) => {
|
|
98
98
|
d.value && (await C(), x.value !== -1 && e !== t && setTimeout(() => {
|
|
99
|
-
l.multi &&
|
|
99
|
+
l.multi && O.VERSION === 4 || D(x.value);
|
|
100
100
|
}), o.value && setTimeout(() => {
|
|
101
101
|
D(o.value);
|
|
102
102
|
}));
|
|
103
103
|
}
|
|
104
|
-
), m
|
|
105
|
-
D(0);
|
|
104
|
+
), P(m, () => {
|
|
105
|
+
b("onsearch", m.value), D(0);
|
|
106
106
|
});
|
|
107
107
|
const h = (e, t = !1) => {
|
|
108
108
|
l.disabled || (G(e), C(() => {
|
|
109
|
-
d.value &&
|
|
109
|
+
d.value && b("opened"), d.value || b("closed"), w.value && t && w.value.focus();
|
|
110
110
|
}));
|
|
111
111
|
};
|
|
112
|
-
|
|
112
|
+
P(d, (e) => {
|
|
113
113
|
if (e) {
|
|
114
|
-
|
|
114
|
+
j.value && Array.isArray(u.value) && (v.value = A(u.value).slice());
|
|
115
115
|
return;
|
|
116
116
|
}
|
|
117
117
|
q();
|
|
118
118
|
});
|
|
119
|
-
const
|
|
119
|
+
const fe = () => {
|
|
120
120
|
if ($.value) {
|
|
121
121
|
a.value = [];
|
|
122
122
|
return;
|
|
@@ -126,16 +126,16 @@ const Ke = (l, A, b) => {
|
|
|
126
126
|
a.value = [];
|
|
127
127
|
return;
|
|
128
128
|
}
|
|
129
|
-
a.value = s.value,
|
|
129
|
+
a.value = s.value, b("selectAll");
|
|
130
130
|
}
|
|
131
|
-
},
|
|
132
|
-
|
|
133
|
-
},
|
|
134
|
-
a.value = [], e && (u.value = [], v.value = []),
|
|
131
|
+
}, ge = () => {
|
|
132
|
+
fe(), O.VERSION !== 4 && (u.value = a.value);
|
|
133
|
+
}, he = (e = !0) => {
|
|
134
|
+
a.value = [], e && (u.value = [], v.value = []), b("clear");
|
|
135
135
|
}, M = (e, t) => {
|
|
136
|
-
if (e =
|
|
136
|
+
if (e = A(e), c.value[t]?.disabled)
|
|
137
137
|
return;
|
|
138
|
-
if (x.value = t, i.mode !==
|
|
138
|
+
if (x.value = t, i.mode !== T.Multi) {
|
|
139
139
|
l.keepOpen || h(!1), i.goToOption(
|
|
140
140
|
0
|
|
141
141
|
/* None */
|
|
@@ -145,17 +145,17 @@ const Ke = (l, A, b) => {
|
|
|
145
145
|
if (!Array.isArray(a.value))
|
|
146
146
|
return;
|
|
147
147
|
g.value?.focus();
|
|
148
|
-
const S =
|
|
148
|
+
const S = A(a.value);
|
|
149
149
|
if (W(S, e)) {
|
|
150
150
|
a.value = S.filter(
|
|
151
|
-
(f) => !
|
|
151
|
+
(f) => !Re(f, e)
|
|
152
152
|
);
|
|
153
153
|
return;
|
|
154
154
|
} else {
|
|
155
155
|
a.value = [...S, e];
|
|
156
156
|
return;
|
|
157
157
|
}
|
|
158
|
-
},
|
|
158
|
+
}, ye = (e) => c.value[e]?.disabled, i = {
|
|
159
159
|
activeIndex: o,
|
|
160
160
|
options: c,
|
|
161
161
|
selectedOption: u,
|
|
@@ -163,9 +163,9 @@ const Ke = (l, A, b) => {
|
|
|
163
163
|
activeOption: R,
|
|
164
164
|
listRef: w,
|
|
165
165
|
clearable: l.clearable,
|
|
166
|
-
type:
|
|
167
|
-
mode: l.multi ?
|
|
168
|
-
query:
|
|
166
|
+
type: p.input ? V.Search : V.Dropdown,
|
|
167
|
+
mode: l.multi ? T.Multi : T.Single,
|
|
168
|
+
query: m,
|
|
169
169
|
selectedValue: K,
|
|
170
170
|
toggle: h,
|
|
171
171
|
disabled: l.disabled,
|
|
@@ -175,7 +175,7 @@ const Ke = (l, A, b) => {
|
|
|
175
175
|
placeholder: l.placeholder,
|
|
176
176
|
select: M,
|
|
177
177
|
clearSelection: () => {
|
|
178
|
-
E(""), u.value = i.mode ===
|
|
178
|
+
E(""), u.value = i.mode === T.Single ? null : [], v.value = i.mode === T.Single ? null : [], g.value && (g.value.value = "");
|
|
179
179
|
},
|
|
180
180
|
search: E,
|
|
181
181
|
goToOption: async (e) => {
|
|
@@ -190,7 +190,7 @@ const Ke = (l, A, b) => {
|
|
|
190
190
|
R.value = s.value[t], o.value = t;
|
|
191
191
|
return;
|
|
192
192
|
}
|
|
193
|
-
if ((e === 1 || e === 10) && (t = t + 1), (e === -1 || e === -10) && (t = t + -1), !!
|
|
193
|
+
if ((e === 1 || e === 10) && (t = t + 1), (e === -1 || e === -10) && (t = t + -1), !!ye(o.value)) {
|
|
194
194
|
R.value = s.value[t], o.value = t;
|
|
195
195
|
return;
|
|
196
196
|
}
|
|
@@ -206,7 +206,7 @@ const Ke = (l, A, b) => {
|
|
|
206
206
|
c.value = c.value.filter((t) => t.id !== e);
|
|
207
207
|
}
|
|
208
208
|
};
|
|
209
|
-
|
|
209
|
+
Ce(Ve, i), Y(
|
|
210
210
|
w,
|
|
211
211
|
() => {
|
|
212
212
|
d.value && Q();
|
|
@@ -222,19 +222,19 @@ const Ke = (l, A, b) => {
|
|
|
222
222
|
]
|
|
223
223
|
}
|
|
224
224
|
);
|
|
225
|
-
const
|
|
225
|
+
const Se = () => {
|
|
226
226
|
g.value && (g.value.value = i.query.value = "");
|
|
227
227
|
};
|
|
228
|
-
|
|
228
|
+
Ne(async () => {
|
|
229
229
|
l.autoFocus && (await C(), setTimeout(() => {
|
|
230
230
|
k.value.focus();
|
|
231
231
|
})), i.goToOption(0);
|
|
232
232
|
});
|
|
233
|
-
const
|
|
234
|
-
u.value = a.value, Array.isArray(u.value) && (v.value =
|
|
233
|
+
const be = () => {
|
|
234
|
+
u.value = a.value, Array.isArray(u.value) && (v.value = A(u.value).slice()), b("apply", u.value), h(!1), Se();
|
|
235
235
|
}, Q = () => {
|
|
236
|
-
|
|
237
|
-
},
|
|
236
|
+
j.value && Array.isArray(v.value) && (u.value = A(v.value).slice()), m.value = "", h(!1);
|
|
237
|
+
}, Oe = (e) => {
|
|
238
238
|
if (!l.disableKeyboardEvents)
|
|
239
239
|
switch (e.key) {
|
|
240
240
|
case "Space":
|
|
@@ -243,7 +243,7 @@ const Ke = (l, A, b) => {
|
|
|
243
243
|
case "ArrowDown":
|
|
244
244
|
h(!0), e.preventDefault();
|
|
245
245
|
}
|
|
246
|
-
},
|
|
246
|
+
}, Ae = (e) => {
|
|
247
247
|
if (!l.disableKeyboardEvents)
|
|
248
248
|
switch (e.key) {
|
|
249
249
|
case "ArrowUp": {
|
|
@@ -283,45 +283,45 @@ const Ke = (l, A, b) => {
|
|
|
283
283
|
h(!0);
|
|
284
284
|
return;
|
|
285
285
|
}
|
|
286
|
-
M(s.value[o.value], o.value), i.mode ===
|
|
286
|
+
M(s.value[o.value], o.value), i.mode === T.Single && !l.keepOpen && h(!1), e.preventDefault();
|
|
287
287
|
break;
|
|
288
288
|
}
|
|
289
289
|
}
|
|
290
|
-
},
|
|
291
|
-
const e = z.value.reduce((
|
|
292
|
-
const
|
|
293
|
-
return
|
|
294
|
-
}, 0), t = l.multi && l.showSelectAll ? 1 : 0, y = e >
|
|
295
|
-
let f = y ?
|
|
296
|
-
return l.noResultsText && f === 0 && (f = f + 1),
|
|
297
|
-
f *
|
|
290
|
+
}, me = r(() => {
|
|
291
|
+
const e = z.value.reduce((Pe, Te) => {
|
|
292
|
+
const we = l.overrideOptionCountCalculation ? l.overrideOptionCountCalculation(Te.data) : 1;
|
|
293
|
+
return Pe + we;
|
|
294
|
+
}, 0), t = l.multi && l.showSelectAll ? 1 : 0, y = e > O.MAX_NUMBER_OF_OPTIONS, S = e + t;
|
|
295
|
+
let f = y ? O.MAX_NUMBER_OF_OPTIONS + 0.1 : S;
|
|
296
|
+
return l.noResultsText && f === 0 && (f = f + 1), _e(
|
|
297
|
+
f * X.value + O.PADDING_PX
|
|
298
298
|
);
|
|
299
299
|
});
|
|
300
300
|
return {
|
|
301
|
-
onKeydown:
|
|
302
|
-
location:
|
|
301
|
+
onKeydown: Ae,
|
|
302
|
+
location: te,
|
|
303
303
|
open: d,
|
|
304
304
|
toggleMenu: h,
|
|
305
|
-
onButtonKeydown:
|
|
306
|
-
displayedValue:
|
|
305
|
+
onButtonKeydown: Oe,
|
|
306
|
+
displayedValue: oe,
|
|
307
307
|
labelRef: H,
|
|
308
|
-
query:
|
|
308
|
+
query: m,
|
|
309
309
|
containerProps: J,
|
|
310
|
-
calculateTableHeight:
|
|
311
|
-
wrapperProps:
|
|
310
|
+
calculateTableHeight: me,
|
|
311
|
+
wrapperProps: de,
|
|
312
312
|
filteredOptions: s,
|
|
313
313
|
allSelected: $,
|
|
314
|
-
isIndeterminate:
|
|
315
|
-
onSelectAll:
|
|
314
|
+
isIndeterminate: se,
|
|
315
|
+
onSelectAll: ge,
|
|
316
316
|
virtualOptions: z,
|
|
317
|
-
isSelected:
|
|
317
|
+
isSelected: F,
|
|
318
318
|
selectedOption: u,
|
|
319
319
|
selectedOptionPrevious: v,
|
|
320
320
|
selectedValue: K,
|
|
321
321
|
onSelect: M,
|
|
322
322
|
activeIndex: o,
|
|
323
323
|
onCancel: Q,
|
|
324
|
-
onApply:
|
|
324
|
+
onApply: be,
|
|
325
325
|
scrollTo: D,
|
|
326
326
|
onClickOutside: Y,
|
|
327
327
|
listRef: w,
|
|
@@ -329,11 +329,11 @@ const Ke = (l, A, b) => {
|
|
|
329
329
|
apply: B,
|
|
330
330
|
cancel: L,
|
|
331
331
|
el: k,
|
|
332
|
-
triggerRef:
|
|
332
|
+
triggerRef: ee,
|
|
333
333
|
clearAll: U,
|
|
334
|
-
onClearAllSelections:
|
|
334
|
+
onClearAllSelections: he
|
|
335
335
|
};
|
|
336
336
|
};
|
|
337
337
|
export {
|
|
338
|
-
|
|
338
|
+
je as dropdownCommon
|
|
339
339
|
};
|
|
@@ -132,6 +132,7 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<__
|
|
|
132
132
|
}>, {
|
|
133
133
|
image?(_: {}): any;
|
|
134
134
|
"icon-start"?(_: {}): any;
|
|
135
|
+
"end-icon"?(_: {}): any;
|
|
135
136
|
}>;
|
|
136
137
|
export default _default;
|
|
137
138
|
type __VLS_NonUndefinedable<T> = T extends undefined ? never : T;
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import o from "./DefaultDropdownTrigger.vue2.js";
|
|
2
2
|
/* empty css */import e from "../../../_virtual/_plugin-vue_export-helper.js";
|
|
3
|
-
// import "../../../DefaultDropdownTrigger.
|
|
4
|
-
const p = /* @__PURE__ */ e(o, [["__scopeId", "data-v-
|
|
3
|
+
// import "../../../DefaultDropdownTrigger.vue_vue_type_style_index_0_scoped_98819e5a_lang.css"; //*');
|
|
4
|
+
const p = /* @__PURE__ */ e(o, [["__scopeId", "data-v-98819e5a"]]);
|
|
5
5
|
export {
|
|
6
6
|
p as default
|
|
7
7
|
};
|
|
@@ -1,12 +1,12 @@
|
|
|
1
|
-
import "../../../DefaultDropdownTrigger.
|
|
2
|
-
import
|
|
3
|
-
import { DropdownTestIdModifiers as
|
|
1
|
+
import "../../../DefaultDropdownTrigger.vue_vue_type_style_index_0_scoped_98819e5a_lang.css"; import { defineComponent as O, computed as r, openBlock as o, createElementBlock as n, createBlock as k, createCommentVNode as d, createElementVNode as c, mergeProps as m, unref as l, renderSlot as u, createVNode as i, withCtx as I, createTextVNode as B, toDisplayString as w } from "vue";
|
|
2
|
+
import V from "../../typography/v4/Typography.vue.js";
|
|
3
|
+
import { DropdownTestIdModifiers as p } from "../../../testids/index.js";
|
|
4
4
|
import h from "../../icon/v4/IconV4.vue.js";
|
|
5
5
|
import "../../icon/v4/IconFlag.vue.js";
|
|
6
|
-
import
|
|
6
|
+
import x from "../../shared/FieldLabel.vue.js";
|
|
7
7
|
import { useTestIdAttrs as A } from "../../../utils/testIds.js";
|
|
8
8
|
import D from "../../statusDot/StatusDot.vue.js";
|
|
9
|
-
const
|
|
9
|
+
const $ = { class: "default-dropdown-wrapper" }, N = { class: "content" }, K = {
|
|
10
10
|
key: 0,
|
|
11
11
|
class: "image"
|
|
12
12
|
}, C = ["src"], S = {
|
|
@@ -15,7 +15,7 @@ const N = { class: "default-dropdown-wrapper" }, K = { class: "content" }, $ = {
|
|
|
15
15
|
}, P = {
|
|
16
16
|
key: 2,
|
|
17
17
|
class: "status-dot"
|
|
18
|
-
}, z = { class: "caret-down" },
|
|
18
|
+
}, z = { key: 0 }, E = { class: "caret-down" }, G = /* @__PURE__ */ O({
|
|
19
19
|
__name: "DefaultDropdownTrigger",
|
|
20
20
|
props: {
|
|
21
21
|
placeholder: { default: "Select" },
|
|
@@ -50,7 +50,7 @@ const N = { class: "default-dropdown-wrapper" }, K = { class: "content" }, $ = {
|
|
|
50
50
|
() => e.feedbackVariant ? `state-${e.feedbackVariant}` : ""
|
|
51
51
|
), b = () => {
|
|
52
52
|
T("click");
|
|
53
|
-
},
|
|
53
|
+
}, f = A(e.testId, p), v = r(() => e.multi ? !Array.isArray(e.selectedOption) || !e.selectedOption?.length ? e.placeholder : e.showAllSelectedText && e.options?.length === e.selectedOption.length ? `All selected (${e.selectedOption.length})` : e.selectedOption?.length === 1 && e.displayValue ? e.displayValue(e.selectedOption[0]) : `${e.selectedOption.length} selected` : e.selectedOption ? e.displayValue(e.selectedOption) : e.placeholder), s = r(() => {
|
|
54
54
|
if (!e.selectedOption)
|
|
55
55
|
return null;
|
|
56
56
|
if (!e.multi)
|
|
@@ -58,8 +58,8 @@ const N = { class: "default-dropdown-wrapper" }, K = { class: "content" }, $ = {
|
|
|
58
58
|
if (Array.isArray(e.selectedOption))
|
|
59
59
|
return e.selectedOption.length === 1 ? e.selectedOption[0] : null;
|
|
60
60
|
});
|
|
61
|
-
return (
|
|
62
|
-
t.label ? (o(), k(
|
|
61
|
+
return (a, y) => (o(), n("div", $, [
|
|
62
|
+
t.label ? (o(), k(x, {
|
|
63
63
|
key: 0,
|
|
64
64
|
label: t.label,
|
|
65
65
|
mandatory: t.mandatory,
|
|
@@ -68,41 +68,44 @@ const N = { class: "default-dropdown-wrapper" }, K = { class: "content" }, $ = {
|
|
|
68
68
|
disabled: t.disabled,
|
|
69
69
|
"test-id": t.testId,
|
|
70
70
|
class: "dropdown-field-label"
|
|
71
|
-
}, null, 8, ["label", "mandatory", "hover-help-text", "hover-help-text-placement", "disabled", "test-id"])) :
|
|
71
|
+
}, null, 8, ["label", "mandatory", "hover-help-text", "hover-help-text-placement", "disabled", "test-id"])) : d("", !0),
|
|
72
72
|
c("div", m({
|
|
73
73
|
class: ["dropdown-trigger", [t.size, l(g), { open: t.open, disabled: t.disabled }]]
|
|
74
|
-
}, l(
|
|
75
|
-
onClick:
|
|
74
|
+
}, l(f)[l(p).BUTTON_WRAPPER], {
|
|
75
|
+
onClick: y[0] || (y[0] = (H) => b())
|
|
76
76
|
}), [
|
|
77
|
-
c("div",
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
t.optionImageKey ? (o(),
|
|
77
|
+
c("div", N, [
|
|
78
|
+
a.$slots.image || l(s) && t.optionImageKey ? (o(), n("div", K, [
|
|
79
|
+
u(a.$slots, "image", {}, () => [
|
|
80
|
+
t.optionImageKey ? (o(), n("img", {
|
|
81
81
|
key: 0,
|
|
82
|
-
src: l(
|
|
83
|
-
}, null, 8, C)) :
|
|
82
|
+
src: l(s)[t.optionImageKey]
|
|
83
|
+
}, null, 8, C)) : d("", !0)
|
|
84
84
|
], !0)
|
|
85
|
-
])) :
|
|
86
|
-
|
|
87
|
-
|
|
85
|
+
])) : d("", !0),
|
|
86
|
+
a.$slots["icon-start"] || l(s) && t.optionIconKey ? (o(), n("div", S, [
|
|
87
|
+
u(a.$slots, "icon-start", {}, () => [
|
|
88
88
|
i(l(h), {
|
|
89
89
|
type: t.optionIconType,
|
|
90
|
-
name: l(
|
|
90
|
+
name: l(s)[t.optionIconKey],
|
|
91
91
|
size: "20px"
|
|
92
92
|
}, null, 8, ["type", "name"])
|
|
93
93
|
], !0)
|
|
94
|
-
])) :
|
|
95
|
-
t.statusDotType ? (o(),
|
|
94
|
+
])) : d("", !0),
|
|
95
|
+
t.statusDotType ? (o(), n("div", P, [
|
|
96
96
|
i(l(D), { type: t.statusDotType }, null, 8, ["type"])
|
|
97
|
-
])) :
|
|
98
|
-
i(l(
|
|
97
|
+
])) : d("", !0),
|
|
98
|
+
i(l(V), m({ variant: "body1" }, l(f)[l(p).BUTTON_CONTENT], { class: "displayed-value" }), {
|
|
99
99
|
default: I(() => [
|
|
100
|
-
|
|
100
|
+
B(w(l(v)), 1)
|
|
101
101
|
]),
|
|
102
102
|
_: 1
|
|
103
103
|
}, 16)
|
|
104
104
|
]),
|
|
105
|
-
|
|
105
|
+
a.$slots["end-icon"] ? (o(), n("div", z, [
|
|
106
|
+
u(a.$slots, "end-icon", {}, void 0, !0)
|
|
107
|
+
])) : d("", !0),
|
|
108
|
+
c("div", E, [
|
|
106
109
|
i(l(h), {
|
|
107
110
|
name: "caret-down",
|
|
108
111
|
size: "20px"
|
|
@@ -113,5 +116,5 @@ const N = { class: "default-dropdown-wrapper" }, K = { class: "content" }, $ = {
|
|
|
113
116
|
}
|
|
114
117
|
});
|
|
115
118
|
export {
|
|
116
|
-
|
|
119
|
+
G as default
|
|
117
120
|
};
|
|
@@ -45,6 +45,8 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<__
|
|
|
45
45
|
optionEndIconType?: "fill" | "bold" | "regular" | "branded" | "ad-unit" | "ab-test" | "ad-networks" | "ad-networks/flat" | "content-rate";
|
|
46
46
|
valueToCopy?: string;
|
|
47
47
|
disabledOptionKey?: string;
|
|
48
|
+
optionTwoLinesVariant?: "horizontal" | "vertical";
|
|
49
|
+
optionTwoLinesKey?: string;
|
|
48
50
|
theme?: string;
|
|
49
51
|
fullWidth?: boolean;
|
|
50
52
|
optionsListWidth?: string;
|
|
@@ -95,6 +97,8 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<__
|
|
|
95
97
|
optionEndIconType: any;
|
|
96
98
|
valueToCopy: any;
|
|
97
99
|
disabledOptionKey: string;
|
|
100
|
+
optionTwoLinesVariant: any;
|
|
101
|
+
optionTwoLinesKey: any;
|
|
98
102
|
fullWidth: boolean;
|
|
99
103
|
optionsListWidth: any;
|
|
100
104
|
statusType: any;
|
|
@@ -112,6 +116,7 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<__
|
|
|
112
116
|
selectAll: () => void;
|
|
113
117
|
clear: () => void;
|
|
114
118
|
copyToClipboard: () => void;
|
|
119
|
+
onsearch: (value: string) => void;
|
|
115
120
|
}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<{
|
|
116
121
|
modelValue?: unknown;
|
|
117
122
|
selected?: unknown;
|
|
@@ -158,6 +163,8 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<__
|
|
|
158
163
|
optionEndIconType?: "fill" | "bold" | "regular" | "branded" | "ad-unit" | "ab-test" | "ad-networks" | "ad-networks/flat" | "content-rate";
|
|
159
164
|
valueToCopy?: string;
|
|
160
165
|
disabledOptionKey?: string;
|
|
166
|
+
optionTwoLinesVariant?: "horizontal" | "vertical";
|
|
167
|
+
optionTwoLinesKey?: string;
|
|
161
168
|
theme?: string;
|
|
162
169
|
fullWidth?: boolean;
|
|
163
170
|
optionsListWidth?: string;
|
|
@@ -208,6 +215,8 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<__
|
|
|
208
215
|
optionEndIconType: any;
|
|
209
216
|
valueToCopy: any;
|
|
210
217
|
disabledOptionKey: string;
|
|
218
|
+
optionTwoLinesVariant: any;
|
|
219
|
+
optionTwoLinesKey: any;
|
|
211
220
|
fullWidth: boolean;
|
|
212
221
|
optionsListWidth: any;
|
|
213
222
|
statusType: any;
|
|
@@ -220,6 +229,7 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<__
|
|
|
220
229
|
onSelectAll?: () => any;
|
|
221
230
|
"onUpdate:selected"?: (value: unknown) => any;
|
|
222
231
|
"onUpdate:isOpen"?: (value: unknown) => any;
|
|
232
|
+
onOnsearch?: (value: string) => any;
|
|
223
233
|
onOpened?: () => any;
|
|
224
234
|
onClosed?: () => any;
|
|
225
235
|
}, {
|
|
@@ -265,6 +275,8 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<__
|
|
|
265
275
|
optionEndIconType: "fill" | "bold" | "regular" | "branded" | "ad-unit" | "ab-test" | "ad-networks" | "ad-networks/flat" | "content-rate";
|
|
266
276
|
valueToCopy: string;
|
|
267
277
|
disabledOptionKey: string;
|
|
278
|
+
optionTwoLinesVariant: "horizontal" | "vertical";
|
|
279
|
+
optionTwoLinesKey: string;
|
|
268
280
|
fullWidth: boolean;
|
|
269
281
|
optionsListWidth: string;
|
|
270
282
|
statusType: "default" | "disabled" | "success" | "warning" | "error" | "archive";
|
|
@@ -279,7 +291,34 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<__
|
|
|
279
291
|
label: any;
|
|
280
292
|
onClick: () => void;
|
|
281
293
|
};
|
|
294
|
+
defaultTriggerProps: {
|
|
295
|
+
placeholder: string;
|
|
296
|
+
open: boolean;
|
|
297
|
+
label: string;
|
|
298
|
+
showFeedbackIcon: boolean;
|
|
299
|
+
mandatory: boolean;
|
|
300
|
+
testId: string;
|
|
301
|
+
multi: boolean;
|
|
302
|
+
disabled: boolean;
|
|
303
|
+
selectedOption: unknown;
|
|
304
|
+
displayValue: (option: unknown) => string;
|
|
305
|
+
options: unknown[];
|
|
306
|
+
optionNameKey: string;
|
|
307
|
+
optionImageKey: string;
|
|
308
|
+
optionIconKey: string;
|
|
309
|
+
optionIconType: "fill" | "bold" | "regular" | "branded" | "ad-unit" | "ab-test" | "ad-networks" | "ad-networks/flat" | "content-rate";
|
|
310
|
+
optionAndIconKey: string;
|
|
311
|
+
optionEndIconType: "fill" | "bold" | "regular" | "branded" | "ad-unit" | "ab-test" | "ad-networks" | "ad-networks/flat" | "content-rate";
|
|
312
|
+
feedbackVariant: "success" | "warning" | "error";
|
|
313
|
+
valueToCopy: string;
|
|
314
|
+
statusDotType: "default" | "disabled" | "success" | "warning" | "error" | "archive";
|
|
315
|
+
size: "small" | "medium" | "large";
|
|
316
|
+
showAllSelectedText: boolean;
|
|
317
|
+
onKeydown: (event: any) => void;
|
|
318
|
+
onClick: () => void;
|
|
319
|
+
};
|
|
282
320
|
}): any;
|
|
321
|
+
"inline-search"?(_: {}): any;
|
|
283
322
|
"input-list"?(_: {
|
|
284
323
|
open: true;
|
|
285
324
|
}): any;
|
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
import o from "./DropdownV4.vue2.js";
|
|
2
2
|
/* empty css *//* empty css */import _ from "../../../_virtual/_plugin-vue_export-helper.js";
|
|
3
|
-
// import "../../../DropdownV4.
|
|
3
|
+
// import "../../../DropdownV4.vue_vue_type_style_index_0_scoped_00ccab6b_lang.css"; //*');
|
|
4
4
|
// import "../../../DropdownV4.vue_vue_type_style_index_1_lang.css"; //');
|
|
5
|
-
const
|
|
5
|
+
const c = /* @__PURE__ */ _(o, [["__scopeId", "data-v-00ccab6b"]]);
|
|
6
6
|
export {
|
|
7
|
-
|
|
7
|
+
c as default
|
|
8
8
|
};
|