@ironsource/shared-ui 2.1.11-test.99 → 2.1.11
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/Chart.vue_vue_type_style_index_0_scoped_026d82c5_lang.css +1 -0
- package/ChartLegend.vue_vue_type_style_index_0_scoped_4fe1c7d1_lang.css +1 -0
- package/ChartLoader.vue_vue_type_style_index_0_scoped_ffa4cc66_lang.css +1 -0
- package/ConditionalDropdown.vue_vue_type_style_index_0_scoped_8e026669_lang.css +1 -0
- package/DateRangeV4.vue_vue_type_style_index_0_scoped_8a2714eb_lang.css +1 -0
- package/DefaultDropdownTrigger.vue_vue_type_style_index_0_scoped_73bf9b5b_lang.css +1 -0
- package/EditableV4.vue_vue_type_style_index_0_scoped_1bbe222a_lang.css +1 -0
- package/IconFlag.vue_vue_type_style_index_0_scoped_6526c390_lang.css +1 -0
- package/OptionV4.vue_vue_type_style_index_0_scoped_1e8837dc_lang.css +1 -0
- package/SortableItem.vue_vue_type_style_index_0_scoped_48542664_lang.css +1 -0
- package/SortableList.vue_vue_type_style_index_0_scoped_8f267f88_lang.css +1 -0
- package/TextField.vue_vue_type_style_index_0_scoped_fce3948c_lang.css +1 -0
- package/TooltipV4.vue_vue_type_style_index_0_scoped_66eab856_lang.css +1 -0
- package/TooltipV4.vue_vue_type_style_index_1_lang.css +1 -1
- package/TreeDropdown.vue_vue_type_style_index_0_scoped_b883d1fa_lang.css +1 -0
- package/Typography.vue_vue_type_style_index_0_scoped_07b259bf_lang.css +1 -0
- package/components/chart/Chart.vue.d.ts +5 -0
- package/components/chart/Chart.vue.js +3 -3
- package/components/chart/Chart.vue2.js +116 -108
- package/components/chart/ChartLegend.vue.js +3 -3
- package/components/chart/ChartLegend.vue2.js +64 -54
- package/components/chart/ChartLoader.vue.js +5 -23
- package/components/chart/ChartLoader.vue2.js +15 -0
- package/components/chart/index.d.ts +20 -1
- package/components/chart/mockData.d.ts +8 -0
- package/components/dateRange/v4/DateRangeV4.vue.js +3 -3
- package/components/dateRange/v4/DateRangeV4.vue2.js +86 -81
- package/components/dropdown/common/Dropdown.common.js +65 -65
- package/components/dropdown/v4/ConditionalDropdown.vue.d.ts +5 -3
- package/components/dropdown/v4/ConditionalDropdown.vue.js +3 -3
- package/components/dropdown/v4/ConditionalDropdown.vue2.js +106 -100
- package/components/dropdown/v4/DefaultDropdownTrigger.vue.js +2 -2
- package/components/dropdown/v4/DefaultDropdownTrigger.vue2.js +45 -46
- package/components/dropdown/v4/OptionV4.vue.js +3 -3
- package/components/dropdown/v4/OptionV4.vue2.js +97 -98
- package/components/dropdown/v4/TreeDropdown.vue.js +2 -2
- package/components/dropdown/v4/TreeDropdown.vue2.js +86 -86
- package/components/dropdown/v4/index.d.ts +5 -3
- package/components/icon/v4/IconFlag.vue.js +3 -3
- package/components/icon/v4/IconFlag.vue2.js +1 -1
- package/components/input/v4/TextField.vue.js +3 -3
- package/components/input/v4/TextField.vue2.js +184 -164
- package/components/sortableList/SortableItem.vue.d.ts +5 -0
- package/components/sortableList/SortableItem.vue.js +3 -3
- package/components/sortableList/SortableItem.vue2.js +76 -61
- package/components/sortableList/SortableList.vue.d.ts +16 -0
- package/components/sortableList/SortableList.vue.js +3 -3
- package/components/sortableList/SortableList.vue2.js +100 -87
- package/components/sortableList/index.d.ts +59 -1
- package/components/table/v4/DataGrid.vue.d.ts +1 -1
- package/components/table/v4/MultipleDataGrid.vue.d.ts +1 -1
- package/components/table/v4/index.d.ts +40 -40
- package/components/table-cells/common/Editable.common.js +8 -7
- 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 +3 -3
- package/components/table-cells/v4/EditableV4.vue2.js +11 -10
- package/components/table-cells/v4/index.d.ts +20 -1
- package/components/tooltip/v4/TooltipV4.vue.js +3 -3
- package/components/tooltip/v4/TooltipV4.vue2.js +1 -1
- package/components/typography/v4/Typography.vue.js +3 -3
- package/components/typography/v4/Typography.vue2.js +1 -1
- package/index.d.ts +248 -90
- package/index.js +1 -1
- package/mocks/apps.d.ts +1 -0
- package/mocks/randomValue.d.ts +1 -0
- package/package.json +3 -3
- package/testids/index.d.ts +1 -0
- package/testids/index.js +13 -13
- package/Chart.vue_vue_type_style_index_0_scoped_04b9d6b3_lang.css +0 -1
- package/ChartLegend.vue_vue_type_style_index_0_scoped_a1c626cd_lang.css +0 -1
- package/ChartLoader.vue_vue_type_style_index_0_scoped_142c444a_lang.css +0 -1
- package/ConditionalDropdown.vue_vue_type_style_index_0_scoped_b2684c5f_lang.css +0 -1
- package/DateRangeV4.vue_vue_type_style_index_0_scoped_309e5351_lang.css +0 -1
- package/DefaultDropdownTrigger.vue_vue_type_style_index_0_scoped_9fa84b26_lang.css +0 -1
- package/EditableV4.vue_vue_type_style_index_0_scoped_e0c047b4_lang.css +0 -1
- package/IconFlag.vue_vue_type_style_index_0_scoped_7b09cc85_lang.css +0 -1
- package/OptionV4.vue_vue_type_style_index_0_scoped_2c2947b3_lang.css +0 -1
- package/SortableItem.vue_vue_type_style_index_0_scoped_7cb676f1_lang.css +0 -1
- package/SortableList.vue_vue_type_style_index_0_scoped_156c01ca_lang.css +0 -1
- package/TextField.vue_vue_type_style_index_0_scoped_2e327aa1_lang.css +0 -1
- package/TooltipV4.vue_vue_type_style_index_0_scoped_82b46d6d_lang.css +0 -1
- package/TreeDropdown.vue_vue_type_style_index_0_scoped_bdfb0aef_lang.css +0 -1
- package/Typography.vue_vue_type_style_index_0_scoped_a14013a5_lang.css +0 -1
- package/consts/configs.js +0 -4
|
@@ -16,7 +16,7 @@ declare const _default: import("vue").DefineComponent<__VLS_WithDefaults<__VLS_T
|
|
|
16
16
|
minCharsToStart?: number;
|
|
17
17
|
isOpen?: boolean;
|
|
18
18
|
searchQuery?: string;
|
|
19
|
-
loadMoreFn?: () => Promise<
|
|
19
|
+
loadMoreFn?: () => Promise<any[]>;
|
|
20
20
|
infiniteLoading?: boolean;
|
|
21
21
|
fetchDataDebounceTime?: number;
|
|
22
22
|
autoFocusSearch?: boolean;
|
|
@@ -48,6 +48,7 @@ declare const _default: import("vue").DefineComponent<__VLS_WithDefaults<__VLS_T
|
|
|
48
48
|
"update:selectedCondition": (value: SelectedCondition) => void;
|
|
49
49
|
"update:appliedSelections": (value: unknown) => void;
|
|
50
50
|
clear: () => void;
|
|
51
|
+
closed: () => void;
|
|
51
52
|
}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<{
|
|
52
53
|
selectedCondition: SelectedCondition | null;
|
|
53
54
|
appliedSelections: unknown | unknown[];
|
|
@@ -60,7 +61,7 @@ declare const _default: import("vue").DefineComponent<__VLS_WithDefaults<__VLS_T
|
|
|
60
61
|
minCharsToStart?: number;
|
|
61
62
|
isOpen?: boolean;
|
|
62
63
|
searchQuery?: string;
|
|
63
|
-
loadMoreFn?: () => Promise<
|
|
64
|
+
loadMoreFn?: () => Promise<any[]>;
|
|
64
65
|
infiniteLoading?: boolean;
|
|
65
66
|
fetchDataDebounceTime?: number;
|
|
66
67
|
autoFocusSearch?: boolean;
|
|
@@ -90,6 +91,7 @@ declare const _default: import("vue").DefineComponent<__VLS_WithDefaults<__VLS_T
|
|
|
90
91
|
loadingOverride: boolean;
|
|
91
92
|
}>>> & {
|
|
92
93
|
onClear?: () => any;
|
|
94
|
+
onClosed?: () => any;
|
|
93
95
|
"onUpdate:selectedCondition"?: (value: SelectedCondition) => any;
|
|
94
96
|
"onUpdate:appliedSelections"?: (value: unknown) => any;
|
|
95
97
|
}, {
|
|
@@ -106,7 +108,7 @@ declare const _default: import("vue").DefineComponent<__VLS_WithDefaults<__VLS_T
|
|
|
106
108
|
comparingKey: string;
|
|
107
109
|
minCharsToStart: number;
|
|
108
110
|
searchQuery: string;
|
|
109
|
-
loadMoreFn: () => Promise<
|
|
111
|
+
loadMoreFn: () => Promise<any[]>;
|
|
110
112
|
fetchDataDebounceTime: number;
|
|
111
113
|
autoFocusSearch: boolean;
|
|
112
114
|
loadingOverride: boolean;
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import o from "./ConditionalDropdown.vue2.js";
|
|
2
|
-
/* empty css */import
|
|
3
|
-
// import "../../../ConditionalDropdown.
|
|
4
|
-
const n = /* @__PURE__ */
|
|
2
|
+
/* empty css */import e from "../../../_virtual/_plugin-vue_export-helper.js";
|
|
3
|
+
// import "../../../ConditionalDropdown.vue_vue_type_style_index_0_scoped_8e026669_lang.css"; //*');
|
|
4
|
+
const n = /* @__PURE__ */ e(o, [["__scopeId", "data-v-8e026669"]]);
|
|
5
5
|
export {
|
|
6
6
|
n as default
|
|
7
7
|
};
|
|
@@ -1,21 +1,21 @@
|
|
|
1
|
-
import "../../../ConditionalDropdown.
|
|
2
|
-
import
|
|
1
|
+
import "../../../ConditionalDropdown.vue_vue_type_style_index_0_scoped_8e026669_lang.css"; import { defineComponent as W, computed as O, ref as s, watch as K, onMounted as q, openBlock as D, createBlock as G, unref as d, withCtx as f, createVNode as g, mergeProps as H, createElementVNode as J, isRef as X, normalizeProps as Y, guardReactiveProps as Z, createElementBlock as _, createTextVNode as ee, toDisplayString as le, createCommentVNode as oe } from "vue";
|
|
2
|
+
import L from "./DropdownV4.vue.js";
|
|
3
3
|
import "./DefaultDropdownTrigger.vue.js";
|
|
4
4
|
import "./IconButtonDropdownTrigger.vue.js";
|
|
5
|
-
import
|
|
5
|
+
import ae from "./ChipDropdownTrigger.vue.js";
|
|
6
6
|
import "./AppDropdownTrigger.vue.js";
|
|
7
|
-
import
|
|
7
|
+
import te from "./ButtonDropdownTrigger.vue.js";
|
|
8
8
|
import "./ButtonFilterDropdownTrigger.vue.js";
|
|
9
9
|
import "./TreeDropdown.vue.js";
|
|
10
10
|
import "./OptionV4.vue.js";
|
|
11
11
|
import "./ConditionalDropdown.vue.js";
|
|
12
|
-
import
|
|
13
|
-
import
|
|
14
|
-
import { useDebounceFn as
|
|
15
|
-
const
|
|
12
|
+
import ne from "../../search/v4/SearchV4.vue.js";
|
|
13
|
+
import ie from "../../typography/v4/Typography.vue.js";
|
|
14
|
+
import { useDebounceFn as ue } from "@vueuse/core";
|
|
15
|
+
const re = { class: "conditional-container" }, se = {
|
|
16
16
|
key: 0,
|
|
17
17
|
class: "custom-list-area"
|
|
18
|
-
},
|
|
18
|
+
}, we = /* @__PURE__ */ W({
|
|
19
19
|
__name: "ConditionalDropdown",
|
|
20
20
|
props: {
|
|
21
21
|
selectedCondition: null,
|
|
@@ -40,39 +40,40 @@ const ie = { class: "conditional-container" }, ue = {
|
|
|
40
40
|
optionIconType: { default: null },
|
|
41
41
|
loadingOverride: { type: Boolean, default: !1 }
|
|
42
42
|
},
|
|
43
|
-
emits: ["update:selectedCondition", "update:appliedSelections", "clear"],
|
|
44
|
-
setup(
|
|
45
|
-
const e =
|
|
43
|
+
emits: ["update:selectedCondition", "update:appliedSelections", "clear", "closed"],
|
|
44
|
+
setup(r, { emit: h }) {
|
|
45
|
+
const e = r, S = O({
|
|
46
46
|
get: () => e.appliedSelections,
|
|
47
47
|
set: (l) => {
|
|
48
|
-
|
|
48
|
+
h("update:appliedSelections", l);
|
|
49
49
|
}
|
|
50
|
-
}),
|
|
50
|
+
}), i = O({
|
|
51
51
|
get: () => e.selectedCondition || e.conditionalOptions[0],
|
|
52
52
|
set: (l) => {
|
|
53
|
-
|
|
53
|
+
h("update:selectedCondition", l);
|
|
54
54
|
}
|
|
55
|
-
}),
|
|
56
|
-
|
|
57
|
-
|
|
55
|
+
}), F = () => {
|
|
56
|
+
const { appliedSelections: l } = e;
|
|
57
|
+
return l ? Array.isArray(l) ? l : [l] : [];
|
|
58
|
+
}, w = s(null), c = s(!0), a = s([]), n = s(F()), T = s(!0), p = s(!1), C = s(!1), u = s(e.searchQuery), B = s(""), m = s(e.label), k = s([]), U = O(() => (!u.value || u.value?.length < e.minCharsToStart) && !a.value.length ? `Enter at least ${e.minCharsToStart} characters to begin` : "No results found"), I = O(() => {
|
|
58
59
|
const l = c.value ? 4 : 4.5, t = a.value.length > 4 ? a.value.length : l;
|
|
59
60
|
if (e.groupedOptions) {
|
|
60
61
|
let o = 0;
|
|
61
|
-
return a.value.forEach((
|
|
62
|
-
|
|
62
|
+
return a.value.forEach((y) => {
|
|
63
|
+
y.options && (o = o + y.options.length);
|
|
63
64
|
}), o > 4 ? o : l;
|
|
64
65
|
}
|
|
65
66
|
return t > l ? t : l;
|
|
66
|
-
}),
|
|
67
|
-
if (e.infiniteLoading &&
|
|
68
|
-
const o = [],
|
|
67
|
+
}), M = (l, t) => {
|
|
68
|
+
if (e.infiniteLoading && i.value.multi && Array.isArray(n.value) && n.value.length && l && t.length) {
|
|
69
|
+
const o = [], y = n.value.filter(
|
|
69
70
|
(v) => v[e.optionNameKey].includes(l)
|
|
70
71
|
);
|
|
71
72
|
return t.forEach((v) => {
|
|
72
|
-
|
|
73
|
-
(
|
|
73
|
+
y.find(
|
|
74
|
+
(j) => j[e.comparingKey] === v[e.comparingKey]
|
|
74
75
|
) && o.push(v[e.comparingKey]);
|
|
75
|
-
}),
|
|
76
|
+
}), y.filter(
|
|
76
77
|
(v) => !o.includes(v[e.comparingKey])
|
|
77
78
|
);
|
|
78
79
|
}
|
|
@@ -80,7 +81,7 @@ const ie = { class: "conditional-container" }, ue = {
|
|
|
80
81
|
}, A = async (l) => {
|
|
81
82
|
try {
|
|
82
83
|
p.value = !0;
|
|
83
|
-
const t = await e.fetchFnCallback(l), o =
|
|
84
|
+
const t = await e.fetchFnCallback(l), o = M(
|
|
84
85
|
l,
|
|
85
86
|
t
|
|
86
87
|
);
|
|
@@ -88,153 +89,158 @@ const ie = { class: "conditional-container" }, ue = {
|
|
|
88
89
|
} catch (t) {
|
|
89
90
|
p.value = !1, console.error("Error fetching data:", t);
|
|
90
91
|
}
|
|
91
|
-
},
|
|
92
|
+
}, E = async () => {
|
|
92
93
|
if (e.infiniteLoading)
|
|
93
94
|
try {
|
|
94
|
-
|
|
95
|
+
C.value = !0;
|
|
95
96
|
const l = await e.loadMoreFn();
|
|
96
|
-
|
|
97
|
+
C.value = !1, Array.isArray(l) && (a.value = [...a.value, ...l]);
|
|
97
98
|
} catch (l) {
|
|
98
|
-
|
|
99
|
+
C.value = !1, console.error("Error fetching data:", l);
|
|
99
100
|
}
|
|
100
|
-
},
|
|
101
|
+
}, V = ue(
|
|
101
102
|
A,
|
|
102
103
|
e.fetchDataDebounceTime
|
|
103
104
|
), b = (l) => {
|
|
104
|
-
l.length >= e.minCharsToStart ? (
|
|
105
|
-
},
|
|
106
|
-
|
|
107
|
-
|
|
105
|
+
l.length >= e.minCharsToStart ? (V(l), w.value?.scrollTo(0)) : e.infiniteLoading && i.value.multi ? a.value = k.value || [] : a.value = [];
|
|
106
|
+
}, x = () => {
|
|
107
|
+
u.value && a.value.length && !p.value && !i.value.multi ? a.value[0].conditionalOptions ? a.value[0] = {
|
|
108
|
+
[e.optionNameKey]: u.value,
|
|
108
109
|
conditionalOptions: !0,
|
|
109
|
-
conditionalName:
|
|
110
|
-
[e.comparingKey]:
|
|
110
|
+
conditionalName: i.value.label,
|
|
111
|
+
[e.comparingKey]: u.value
|
|
111
112
|
} : a.value = [
|
|
112
113
|
{
|
|
113
|
-
|
|
114
|
+
[e.optionNameKey]: u.value,
|
|
114
115
|
conditionalOptions: !0,
|
|
115
|
-
conditionalName:
|
|
116
|
-
[e.comparingKey]:
|
|
116
|
+
conditionalName: i.value.label,
|
|
117
|
+
[e.comparingKey]: u.value
|
|
117
118
|
},
|
|
118
119
|
...a.value
|
|
119
120
|
] : a.value.length && a.value[0].conditionalOptions && a.value.shift();
|
|
120
|
-
},
|
|
121
|
-
c.value &&
|
|
121
|
+
}, N = () => {
|
|
122
|
+
c.value && n.value.length === 0 ? m.value = e.label : m.value = `${e.label} ${i.value.label.toLowerCase()}`;
|
|
122
123
|
};
|
|
123
|
-
|
|
124
|
-
b(
|
|
125
|
-
}),
|
|
126
|
-
|
|
127
|
-
}),
|
|
124
|
+
K(u, () => {
|
|
125
|
+
b(u.value);
|
|
126
|
+
}), K([i, a], () => {
|
|
127
|
+
x();
|
|
128
|
+
}), K(
|
|
128
129
|
() => e.loadingOverride,
|
|
129
130
|
(l, t) => {
|
|
130
131
|
!l && t && !e.infiniteLoading && A(e.searchQuery);
|
|
131
132
|
}
|
|
132
133
|
);
|
|
133
|
-
const
|
|
134
|
-
c.value &&
|
|
134
|
+
const P = () => {
|
|
135
|
+
c.value && n.value.length === 0 ? (i.value = null, S.value = [], i.value = null) : (B.value = u.value, S.value = c.value ? [...n.value] : { ...n.value }, T.value = c.value), N();
|
|
135
136
|
};
|
|
136
|
-
|
|
137
|
-
|
|
137
|
+
K(i, (l, t) => {
|
|
138
|
+
i.value.multi ? (p.value = !0, !t.multi && l.multi && (Array.isArray(e.appliedSelections) ? n.value = e.appliedSelections : n.value = [e.appliedSelections]), setTimeout(() => {
|
|
138
139
|
p.value = !1, c.value = !0;
|
|
139
140
|
}, 100)) : setTimeout(() => {
|
|
140
141
|
c.value = !1;
|
|
141
142
|
}, 100);
|
|
142
143
|
});
|
|
143
144
|
const Q = (l) => {
|
|
144
|
-
|
|
145
|
-
},
|
|
146
|
-
|
|
147
|
-
},
|
|
148
|
-
l &&
|
|
145
|
+
k.value = l;
|
|
146
|
+
}, R = () => {
|
|
147
|
+
n.value = [], S.value = [], i.value = null, m.value = e.label, u.value = "", h("clear");
|
|
148
|
+
}, z = (l) => {
|
|
149
|
+
l && i.value.multi && e.infiniteLoading && n.value && (a.value = n.value, u.value && b(u.value));
|
|
149
150
|
};
|
|
150
|
-
|
|
151
|
-
(e.searchQuery || !e.infiniteLoading || e.minCharsToStart === 0) && b(e.searchQuery),
|
|
152
|
-
})
|
|
151
|
+
q(() => {
|
|
152
|
+
(e.searchQuery || !e.infiniteLoading || e.minCharsToStart === 0) && b(e.searchQuery), e.appliedSelections && Array.isArray(e.appliedSelections) && (a.value = e.appliedSelections, n.value = e.appliedSelections, k.value = e.appliedSelections), N();
|
|
153
|
+
});
|
|
154
|
+
const $ = () => {
|
|
155
|
+
h("closed");
|
|
156
|
+
};
|
|
157
|
+
return (l, t) => (D(), G(d(L), {
|
|
153
158
|
ref_key: "dropdownRef",
|
|
154
159
|
ref: w,
|
|
155
|
-
selected:
|
|
156
|
-
"onUpdate:selected": t[2] || (t[2] = (o) =>
|
|
160
|
+
selected: n.value,
|
|
161
|
+
"onUpdate:selected": t[2] || (t[2] = (o) => n.value = o),
|
|
157
162
|
"predefined-trigger": "chip",
|
|
158
|
-
"display-value": (o) => o?.[
|
|
163
|
+
"display-value": (o) => o?.[r.optionNameKey],
|
|
159
164
|
multi: c.value,
|
|
160
165
|
options: a.value,
|
|
161
166
|
placeholder: m.value,
|
|
162
167
|
"search-placeholder": "Search",
|
|
163
|
-
"option-name-key":
|
|
168
|
+
"option-name-key": r.optionNameKey,
|
|
164
169
|
"with-conditions": "",
|
|
165
170
|
"inline-search": "",
|
|
166
|
-
"custom-number-of-displayed-options": d(
|
|
171
|
+
"custom-number-of-displayed-options": d(I),
|
|
167
172
|
"options-list-width": "330px",
|
|
168
|
-
loading: p.value ||
|
|
169
|
-
"load-more-loading":
|
|
170
|
-
"comparing-key":
|
|
171
|
-
"is-open":
|
|
172
|
-
"infinite-loading":
|
|
173
|
-
"show-select-all": !
|
|
174
|
-
"grouped-options":
|
|
175
|
-
"option-flag-key":
|
|
176
|
-
"option-image-key":
|
|
177
|
-
"option-icon-key":
|
|
178
|
-
"option-icon-type":
|
|
179
|
-
"onUpdate:isOpen":
|
|
173
|
+
loading: p.value || r.loadingOverride,
|
|
174
|
+
"load-more-loading": C.value,
|
|
175
|
+
"comparing-key": r.comparingKey,
|
|
176
|
+
"is-open": r.isOpen,
|
|
177
|
+
"infinite-loading": r.infiniteLoading,
|
|
178
|
+
"show-select-all": !r.infiniteLoading && !u.value,
|
|
179
|
+
"grouped-options": r.groupedOptions,
|
|
180
|
+
"option-flag-key": r.optionFlagKey,
|
|
181
|
+
"option-image-key": r.optionImageKey,
|
|
182
|
+
"option-icon-key": r.optionIconKey,
|
|
183
|
+
"option-icon-type": r.optionIconType,
|
|
184
|
+
"onUpdate:isOpen": z,
|
|
180
185
|
onOnsearch: b,
|
|
181
|
-
onApply:
|
|
182
|
-
onLoadMore:
|
|
183
|
-
onUnsavedSelectionUpdate: Q
|
|
186
|
+
onApply: P,
|
|
187
|
+
onLoadMore: E,
|
|
188
|
+
onUnsavedSelectionUpdate: Q,
|
|
189
|
+
onClosed: $
|
|
184
190
|
}, {
|
|
185
191
|
"dropdown-trigger": f(({ defaultTriggerProps: o }) => [
|
|
186
|
-
|
|
192
|
+
g(d(ae), H(o, {
|
|
187
193
|
label: m.value,
|
|
188
|
-
"selected-option": d(
|
|
189
|
-
multi:
|
|
194
|
+
"selected-option": d(S),
|
|
195
|
+
multi: T.value,
|
|
190
196
|
"cancel-all-selected-display": "",
|
|
191
|
-
"display-value-in-quotes": !Array.isArray(
|
|
192
|
-
onClear:
|
|
197
|
+
"display-value-in-quotes": !Array.isArray(n.value) && n.value.conditionalOptions,
|
|
198
|
+
onClear: R
|
|
193
199
|
}), null, 16, ["label", "selected-option", "multi", "display-value-in-quotes"])
|
|
194
200
|
]),
|
|
195
201
|
"dropdown-conditions": f(() => [
|
|
196
|
-
|
|
197
|
-
|
|
198
|
-
selected: d(
|
|
199
|
-
"onUpdate:selected": t[0] || (t[0] = (o) =>
|
|
200
|
-
options:
|
|
202
|
+
J("div", re, [
|
|
203
|
+
g(d(L), {
|
|
204
|
+
selected: d(i),
|
|
205
|
+
"onUpdate:selected": t[0] || (t[0] = (o) => X(i) ? i.value = o : null),
|
|
206
|
+
options: r.conditionalOptions,
|
|
201
207
|
"option-name-key": "label",
|
|
202
208
|
"display-value": (o) => o?.label,
|
|
203
209
|
container: ".conditional-container",
|
|
204
210
|
size: "small"
|
|
205
211
|
}, {
|
|
206
212
|
"dropdown-trigger": f(({ buttonTriggerProps: o }) => [
|
|
207
|
-
|
|
213
|
+
g(d(te), Y(Z(o)), null, 16)
|
|
208
214
|
]),
|
|
209
215
|
_: 1
|
|
210
216
|
}, 8, ["selected", "options", "display-value"])
|
|
211
217
|
])
|
|
212
218
|
]),
|
|
213
219
|
"inline-search": f(() => [
|
|
214
|
-
|
|
215
|
-
modelValue:
|
|
216
|
-
"onUpdate:modelValue": t[1] || (t[1] = (o) =>
|
|
220
|
+
g(d(ne), {
|
|
221
|
+
modelValue: u.value,
|
|
222
|
+
"onUpdate:modelValue": t[1] || (t[1] = (o) => u.value = o),
|
|
217
223
|
class: "inline-search",
|
|
218
224
|
placeholder: "Search",
|
|
219
225
|
variant: "transparent",
|
|
220
226
|
size: "md",
|
|
221
|
-
"auto-focus":
|
|
227
|
+
"auto-focus": r.autoFocusSearch
|
|
222
228
|
}, null, 8, ["modelValue", "auto-focus"])
|
|
223
229
|
]),
|
|
224
230
|
"custom-list-area": f(() => [
|
|
225
|
-
!a.value.length && !p.value ? (
|
|
226
|
-
|
|
231
|
+
!a.value.length && !p.value ? (D(), _("div", se, [
|
|
232
|
+
g(ie, { variant: "body1" }, {
|
|
227
233
|
default: f(() => [
|
|
228
|
-
|
|
234
|
+
ee(le(d(U)), 1)
|
|
229
235
|
]),
|
|
230
236
|
_: 1
|
|
231
237
|
})
|
|
232
|
-
])) :
|
|
238
|
+
])) : oe("", !0)
|
|
233
239
|
]),
|
|
234
240
|
_: 1
|
|
235
241
|
}, 8, ["selected", "display-value", "multi", "options", "placeholder", "option-name-key", "custom-number-of-displayed-options", "loading", "load-more-loading", "comparing-key", "is-open", "infinite-loading", "show-select-all", "grouped-options", "option-flag-key", "option-image-key", "option-icon-key", "option-icon-type"]));
|
|
236
242
|
}
|
|
237
243
|
});
|
|
238
244
|
export {
|
|
239
|
-
|
|
245
|
+
we as default
|
|
240
246
|
};
|
|
@@ -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_73bf9b5b_lang.css"; //*');
|
|
4
|
+
const p = /* @__PURE__ */ e(o, [["__scopeId", "data-v-73bf9b5b"]]);
|
|
5
5
|
export {
|
|
6
6
|
p as default
|
|
7
7
|
};
|
|
@@ -1,25 +1,24 @@
|
|
|
1
|
-
import "../../../DefaultDropdownTrigger.
|
|
1
|
+
import "../../../DefaultDropdownTrigger.vue_vue_type_style_index_0_scoped_73bf9b5b_lang.css"; import { defineComponent as I, computed as u, openBlock as a, createElementBlock as d, createBlock as m, createCommentVNode as n, createElementVNode as c, mergeProps as h, unref as l, renderSlot as i, createVNode as r, withCtx as O, createTextVNode as B, toDisplayString as $ } from "vue";
|
|
2
2
|
import w from "../../typography/v4/Typography.vue.js";
|
|
3
3
|
import { DropdownTestIdModifiers as f } from "../../../testids/index.js";
|
|
4
4
|
import g from "../../icon/v4/IconV4.vue.js";
|
|
5
|
-
import "../../icon/v4/IconFlag.vue.js";
|
|
6
|
-
import
|
|
7
|
-
import { useTestIdAttrs as
|
|
8
|
-
import
|
|
9
|
-
|
|
10
|
-
const N = { class: "default-dropdown-wrapper" }, C = { class: "content" }, x = {
|
|
5
|
+
import K from "../../icon/v4/IconFlag.vue.js";
|
|
6
|
+
import V from "../../shared/FieldLabel.vue.js";
|
|
7
|
+
import { useTestIdAttrs as A } from "../../../utils/testIds.js";
|
|
8
|
+
import D from "../../statusDot/StatusDot.vue.js";
|
|
9
|
+
const N = { class: "default-dropdown-wrapper" }, S = { class: "content" }, x = {
|
|
11
10
|
key: 0,
|
|
12
11
|
class: "image"
|
|
13
|
-
},
|
|
12
|
+
}, C = ["src"], F = {
|
|
14
13
|
key: 1,
|
|
15
14
|
class: "flag"
|
|
16
|
-
},
|
|
15
|
+
}, P = {
|
|
17
16
|
key: 2,
|
|
18
17
|
class: "start-icon"
|
|
19
18
|
}, z = {
|
|
20
19
|
key: 3,
|
|
21
20
|
class: "status-dot"
|
|
22
|
-
},
|
|
21
|
+
}, E = { key: 0 }, H = { class: "caret-down" }, Q = /* @__PURE__ */ I({
|
|
23
22
|
__name: "DefaultDropdownTrigger",
|
|
24
23
|
props: {
|
|
25
24
|
placeholder: { default: "Select" },
|
|
@@ -51,21 +50,21 @@ const N = { class: "default-dropdown-wrapper" }, C = { class: "content" }, x = {
|
|
|
51
50
|
statusDotType: { default: null }
|
|
52
51
|
},
|
|
53
52
|
emits: ["click"],
|
|
54
|
-
setup(t, { emit:
|
|
55
|
-
const e = t,
|
|
53
|
+
setup(t, { emit: T }) {
|
|
54
|
+
const e = t, v = u(
|
|
56
55
|
() => e.feedbackVariant ? `state-${e.feedbackVariant}` : ""
|
|
57
56
|
), b = () => {
|
|
58
|
-
|
|
59
|
-
}, p =
|
|
57
|
+
T("click");
|
|
58
|
+
}, p = A(e.testId, f), k = u(() => e.multi ? !Array.isArray(e.selectedOption) || !e.selectedOption?.length ? e.placeholder : e.showAllSelectedText && e.allSelected ? `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 = u(() => {
|
|
60
59
|
if (!e.selectedOption)
|
|
61
60
|
return null;
|
|
62
61
|
if (!e.multi)
|
|
63
62
|
return e.selectedOption;
|
|
64
63
|
if (Array.isArray(e.selectedOption))
|
|
65
64
|
return e.selectedOption.length === 1 ? e.selectedOption[0] : null;
|
|
66
|
-
})
|
|
67
|
-
return (o,
|
|
68
|
-
t.label ? (a(),
|
|
65
|
+
});
|
|
66
|
+
return (o, y) => (a(), d("div", N, [
|
|
67
|
+
t.label ? (a(), m(V, {
|
|
69
68
|
key: 0,
|
|
70
69
|
label: t.label,
|
|
71
70
|
mandatory: t.mandatory,
|
|
@@ -74,55 +73,55 @@ const N = { class: "default-dropdown-wrapper" }, C = { class: "content" }, x = {
|
|
|
74
73
|
disabled: t.disabled,
|
|
75
74
|
"test-id": t.testId,
|
|
76
75
|
class: "dropdown-field-label"
|
|
77
|
-
}, null, 8, ["label", "mandatory", "hover-help-text", "hover-help-text-placement", "disabled", "test-id"])) :
|
|
76
|
+
}, null, 8, ["label", "mandatory", "hover-help-text", "hover-help-text-placement", "disabled", "test-id"])) : n("", !0),
|
|
78
77
|
c("div", h({
|
|
79
|
-
class: ["dropdown-trigger", [t.size, l(
|
|
78
|
+
class: ["dropdown-trigger", [t.size, l(v), { open: t.open, disabled: t.disabled }]]
|
|
80
79
|
}, l(p)[l(f).BUTTON_WRAPPER], {
|
|
81
|
-
onClick:
|
|
80
|
+
onClick: y[0] || (y[0] = (R) => b())
|
|
82
81
|
}), [
|
|
83
|
-
c("div",
|
|
84
|
-
o.$slots.image || l(
|
|
82
|
+
c("div", S, [
|
|
83
|
+
o.$slots.image || l(s) && t.optionImageKey ? (a(), d("div", x, [
|
|
85
84
|
i(o.$slots, "image", {}, () => [
|
|
86
|
-
t.optionImageKey ? (a(),
|
|
85
|
+
t.optionImageKey ? (a(), d("img", {
|
|
87
86
|
key: 0,
|
|
88
|
-
src: l(
|
|
89
|
-
}, null, 8,
|
|
87
|
+
src: l(s)[t.optionImageKey]
|
|
88
|
+
}, null, 8, C)) : n("", !0)
|
|
90
89
|
], !0)
|
|
91
|
-
])) :
|
|
92
|
-
o.$slots.flag || l(
|
|
90
|
+
])) : n("", !0),
|
|
91
|
+
o.$slots.flag || l(s) && t.optionFlagKey ? (a(), d("div", F, [
|
|
93
92
|
i(o.$slots, "flag", {}, () => [
|
|
94
|
-
|
|
93
|
+
t.optionFlagKey ? (a(), m(l(K), {
|
|
95
94
|
key: 0,
|
|
96
|
-
src: l(
|
|
97
|
-
}, null, 8,
|
|
95
|
+
src: l(s)[t.optionFlagKey]
|
|
96
|
+
}, null, 8, ["src"])) : n("", !0)
|
|
98
97
|
], !0)
|
|
99
|
-
])) :
|
|
100
|
-
o.$slots["icon-start"] || l(
|
|
98
|
+
])) : n("", !0),
|
|
99
|
+
o.$slots["icon-start"] || l(s) && t.optionIconKey ? (a(), d("div", P, [
|
|
101
100
|
i(o.$slots, "icon-start", {}, () => [
|
|
102
|
-
|
|
101
|
+
r(l(g), {
|
|
103
102
|
type: t.optionIconType,
|
|
104
|
-
name: l(
|
|
103
|
+
name: l(s)[t.optionIconKey],
|
|
105
104
|
size: "20px"
|
|
106
105
|
}, null, 8, ["type", "name"])
|
|
107
106
|
], !0)
|
|
108
|
-
])) :
|
|
109
|
-
t.statusDotType ? (a(),
|
|
110
|
-
|
|
111
|
-
])) :
|
|
107
|
+
])) : n("", !0),
|
|
108
|
+
t.statusDotType ? (a(), d("div", z, [
|
|
109
|
+
r(l(D), { type: t.statusDotType }, null, 8, ["type"])
|
|
110
|
+
])) : n("", !0),
|
|
112
111
|
i(o.$slots, "displayed-value", {}, () => [
|
|
113
|
-
|
|
114
|
-
default:
|
|
115
|
-
|
|
112
|
+
r(l(w), h({ variant: "body1" }, l(p)[l(f).BUTTON_CONTENT], { class: "displayed-value" }), {
|
|
113
|
+
default: O(() => [
|
|
114
|
+
B($(l(k)), 1)
|
|
116
115
|
]),
|
|
117
116
|
_: 1
|
|
118
117
|
}, 16)
|
|
119
118
|
], !0)
|
|
120
119
|
]),
|
|
121
|
-
o.$slots["end-icon"] ? (a(),
|
|
120
|
+
o.$slots["end-icon"] ? (a(), d("div", E, [
|
|
122
121
|
i(o.$slots, "end-icon", {}, void 0, !0)
|
|
123
|
-
])) :
|
|
124
|
-
c("div",
|
|
125
|
-
|
|
122
|
+
])) : n("", !0),
|
|
123
|
+
c("div", H, [
|
|
124
|
+
r(l(g), {
|
|
126
125
|
name: "caret-down",
|
|
127
126
|
size: "20px"
|
|
128
127
|
})
|
|
@@ -132,5 +131,5 @@ const N = { class: "default-dropdown-wrapper" }, C = { class: "content" }, x = {
|
|
|
132
131
|
}
|
|
133
132
|
});
|
|
134
133
|
export {
|
|
135
|
-
|
|
134
|
+
Q as default
|
|
136
135
|
};
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import o from "./OptionV4.vue2.js";
|
|
2
|
-
/* empty css */import
|
|
3
|
-
// import "../../../OptionV4.
|
|
4
|
-
const s = /* @__PURE__ */
|
|
2
|
+
/* empty css */import e from "../../../_virtual/_plugin-vue_export-helper.js";
|
|
3
|
+
// import "../../../OptionV4.vue_vue_type_style_index_0_scoped_1e8837dc_lang.css"; //*');
|
|
4
|
+
const s = /* @__PURE__ */ e(o, [["__scopeId", "data-v-1e8837dc"]]);
|
|
5
5
|
export {
|
|
6
6
|
s as default
|
|
7
7
|
};
|