@ironsource/shared-ui 2.1.6-rc.21 → 2.1.6-rc.23

package/AppDropdownTrigger.vue_vue_type_style_index_0_scoped_454709fb_lang.css

@@ -0,0 +1 @@
+.app-trigger-wrapper[data-v-454709fb]{display:flex}.app-trigger-wrapper.with-copy .app-trigger[data-v-454709fb]{border-radius:var(--border-radius-lg) 0 0 var(--border-radius-lg);width:calc(100% - 41px)}.app-trigger-key[data-v-454709fb]{flex:none}.app-trigger-key--content[data-v-454709fb]{padding:10px;background:var(--default-main);cursor:pointer;border-radius:0 var(--border-radius-lg) var(--border-radius-lg) 0;border-left:1px solid var(--common-divider);color:var(--action-active)}.app-trigger-key--content[data-v-454709fb]:hover{background:var(--action-selected);color:var(--action-primary)}.app-trigger[data-v-454709fb]{width:100%;padding:0 12px;border-radius:var(--border-radius-lg);cursor:pointer;user-select:none;display:inline-flex;background:var(--default-main);height:40px;align-items:center}.app-trigger[data-v-454709fb]:hover,.app-trigger.active[data-v-454709fb]{background:var(--action-selected)}.app-trigger.disabled[data-v-454709fb]{cursor:auto}.app-trigger--content[data-v-454709fb]{color:var(--text-primary);display:flex;column-gap:4px;width:calc(100% - 20px);align-items:center}.app-trigger--content .x-circle-wrapper[data-v-454709fb]{color:var(--primary-dark)}.app-trigger--content .x-circle-wrapper[data-v-454709fb]:hover{color:var(--primary-main)}.app-trigger--icon[data-v-454709fb]{display:flex;align-items:center;color:var(--action-active)}.app-trigger .displayed-value[data-v-454709fb]{overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.app-trigger .image[data-v-454709fb]{width:28px;height:28px;flex:none}.app-trigger .image img[data-v-454709fb]{border-radius:4px;width:100%;height:100%}.app-trigger .start-icon[data-v-454709fb],.app-trigger .end-icon[data-v-454709fb]{display:flex;color:var(--action-active)}.app-trigger .end-icon[data-v-454709fb]{margin-right:var(--spacing-100)}.app-trigger .label-text[data-v-454709fb]{display:flex;align-items:center;gap:8px}.app-trigger .label-text .text-content[data-v-454709fb]{display:flex;align-items:center;gap:4px;width:100%}.app-trigger .label-text .text-content .text-content-value[data-v-454709fb]{width:100%;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.app-trigger .label-text .is-mandatory[data-v-454709fb]{padding-top:5px;color:var(--error-main)}

package/DropdownV4.vue_vue_type_style_index_0_scoped_2e7a89bc_lang.css

@@ -0,0 +1 @@
+.v-enter-active[data-v-2e7a89bc],.v-leave-active[data-v-2e7a89bc]{transition:opacity .25s ease}ol[data-v-2e7a89bc],ul[data-v-2e7a89bc],menu[data-v-2e7a89bc]{list-style:none;margin:0;padding:0}.dropdown.full-width[data-v-2e7a89bc],.dropdown.full-width .button__container[data-v-2e7a89bc]{width:100%}.dropdown-list-wrapper[data-v-2e7a89bc]{display:flex;flex-direction:column;padding:.5rem .5rem .25rem}.dropdown-list-wrapper--multi[data-v-2e7a89bc]{padding:.5rem}.list-container--multi[data-v-2e7a89bc]{margin-bottom:0}.inline-search .inline-search-wrapper[data-v-2e7a89bc]{padding-bottom:.25rem}.inline-search .list-container[data-v-2e7a89bc]{padding-top:0}.no-result-container[data-v-2e7a89bc]{height:100%;display:flex;align-items:center;padding:.375rem .5rem;color:var(--text-disabled)}.no-result[data-v-2e7a89bc]{color:var(--text-disabled);padding-left:.5rem}.list[data-v-2e7a89bc]{outline:none;display:flex;flex-direction:column;width:100%;min-height:2rem}.list--multi[data-v-2e7a89bc]{margin-bottom:.5rem;border-bottom-left-radius:0;border-bottom-right-radius:0}.image-slot[data-v-2e7a89bc]{margin-right:.5rem}.actions-wrapper[data-v-2e7a89bc]{display:flex;width:100%;padding:.5rem .5rem .5rem .125rem;padding-bottom:0;border-top:1px solid var(--common-divider);justify-content:space-between;margin-top:.25rem}.apply-button[data-v-2e7a89bc]{margin-left:.5rem}

package/HelpIcon.vue_vue_type_style_index_0_scoped_06fce2e3_lang.css

@@ -0,0 +1 @@
+.table-help-icon[data-v-06fce2e3]{margin-left:var(--spacing-50);color:var(--action-active);margin-right:calc(var(--spacing-50) * -1)}.info-icon[data-v-06fce2e3]{color:var(--action-active)}.info-icon[data-v-06fce2e3]:hover{color:var(--action-primary)}

package/OptionV4.vue_vue_type_style_index_0_scoped_89b98201_lang.css

@@ -0,0 +1 @@
+.label[data-v-89b98201]{color:#41454d}.item-container[data-v-89b98201]{width:100%;display:flex;align-items:center;cursor:pointer;border-radius:var(--border-radius-lg);margin-bottom:.25rem;color:var(--text-primary);padding:6px 8px}.item-container--disabled[data-v-89b98201]{cursor:initial;color:var(--text-disabled)}.item-container[data-v-89b98201]:hover:not(.item-container--disabled){background-color:var(--action-hover)}.item-container--active[data-v-89b98201],.item-container[data-v-89b98201]:active{background-color:var(--action-selected)}.item-container:not(.item-container--multi).item-container--selected[data-v-89b98201]{background-color:var(--action-selected)}.subtitle[data-v-89b98201]{color:#7b838c;line-height:1rem}.clear-button[data-v-89b98201]{display:flex;padding:0 4px;color:#7b838c;align-items:center;height:auto;background-image:none;min-width:auto;border:none;background-color:transparent}.clear-button[data-v-89b98201]:hover{color:#3083ff}.item[data-v-89b98201]{width:100%;display:flex;gap:.5rem;align-items:center}.item--with-icon[data-v-89b98201],.item--multi[data-v-89b98201]{display:flex;flex-direction:row;align-items:center;justify-content:start}.item .image[data-v-89b98201]{width:20px;height:20px;flex:none}.item .image img[data-v-89b98201]{width:20px;height:20px;border-radius:4px}.item .start-icon[data-v-89b98201],.item .end-icon[data-v-89b98201]{display:flex;color:var(--action-active)}.item .option-text[data-v-89b98201]{line-height:1.1875rem}.text-container[data-v-89b98201]{width:100%;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;text-align:left}.tooltip-option[data-v-89b98201]{display:block}.tooltip-option[data-v-89b98201] .container{width:100%}

package/components/dropdown/common/Dropdown.common.js

@@ -1,9 +1,9 @@
 import { useToggle as me } from "../../../composables/useToggle.js";
-import { ref as n, computed as r, watch as P, useSlots as Pe, toRaw as A, nextTick as D, provide as Te, onMounted as we } from "vue";
+import { ref as n, computed as r, watch as m, useSlots as Pe, toRaw as A, nextTick as N, provide as Te, onMounted as we } from "vue";
 import { isObjectInArray as W } from "../../../utils/array.js";
 import { objectsEqual as xe } from "../../../utils/object.js";
 import { useClamp as Ie, useVirtualList as De, onClickOutside as Y } from "@vueuse/core";
-import { Mode as m, Type as _, DropdownContext as Ne } from "./DropdownContext.js";
+import { Mode as P, Type as _, DropdownContext as Ne } from "./DropdownContext.js";
 import { pxToRem as Re } from "../../../utils/style.js";
 import { useEditableContext as Ee } from "../../table-cells/common/EditableContext.js";
 const Ue = (l, O, b) => {
@@ -14,25 +14,25 @@ const Ue = (l, O, b) => {
   })(k || (k = {}));
   const a = n(
     l.selected
-  ), N = Ee(), u = r({
+  ), R = Ee(), u = r({
     get() {
-      return N?.value?.value ?? a.value;
+      return R?.value?.value ?? a.value;
     },
     set(e) {
-      N.onChange?.(e), N.onClose?.(), O("update:selected", e);
+      R.onChange?.(e), R.onClose?.(), O("update:selected", e);
     }
   });
-  P(
+  m(
     () => l.selected,
     () => {
       a.value = l.selected, v.value = l.selected;
     }
   );
-  const p = Pe(), T = n(null), g = n(null), V = n(null), R = n(null), H = n(null), w = n(null), F = n(), B = n(null), L = n(null), U = n(null), ee = 8, le = r(() => w.value ? w.value.getBoundingClientRect().height + ee + l.distance : 0), c = n([]), x = n(-1), I = n(""), v = n(l.selected || []), q = () => w.value?.focus(), [d, te, ae] = me({
+  const p = Pe(), w = n(null), g = n(null), V = n(null), E = n(null), H = n(null), x = n(null), F = n(), B = n(null), L = n(null), U = n(null), ee = 8, le = r(() => x.value ? x.value.getBoundingClientRect().height + ee + l.distance : 0), c = n([]), I = n(-1), T = n(""), v = n(l.selected || []), q = () => x.value?.focus(), [d, te, ae] = me({
     disabled: l.disabled,
     initialValue: l.defaultOpen
   });
-  P(
+  m(
     () => l.disabled,
     (e) => {
       e !== void 0 && ae(e);
@@ -60,8 +60,8 @@ const Ue = (l, O, b) => {
   }), $ = r(() => {
     if (Array.isArray(a.value))
       return a.value.length === s.value.length;
-  }), oe = r(() => !l.multi || !Array.isArray(a.value) ? !1 : a.value.length > 0 && a.value.length < s.value.length), E = (e) => {
-    I.value = e;
+  }), oe = r(() => !l.multi || !Array.isArray(a.value) ? !1 : a.value.length > 0 && a.value.length < s.value.length), M = (e) => {
+    T.value = e;
   }, se = r(() => {
     const e = A(v.value), t = {
       selected: [],
@@ -73,41 +73,43 @@ const Ue = (l, O, b) => {
     }), [].concat(t.selected, t.notSelected);
   }), s = r(() => {
     const e = Array.isArray(v.value) && l.multi && b.VERSION === 4 ? se.value : l.options;
-    return l.onSearch ? e.filter((t) => l.onSearch(t, I.value)) : e;
-  }), ce = r(() => c.value[0]?.hasSubtitle), X = r(() => i.mode === m.Multi), j = r(
+    return l.onSearch ? e.filter((t) => l.onSearch(t, T.value)) : e;
+  }), ce = r(() => c.value[0]?.hasSubtitle), X = r(() => i.mode === P.Multi), j = r(
     () => ce.value ? b.MULTILINE_LIST_HEIGHT : b.LIST_HEIGHT
   ), {
     list: z,
     containerProps: J,
     wrapperProps: ve,
-    scrollTo: M
+    scrollTo: D
   } = De(s, {
     itemHeight: j.value,
     overscan: 2
   });
-  P(
+  m(
     () => l.isOpen,
     (e) => {
       G(e);
     }
-  ), P([x], async () => {
-    await D();
-  }), P(
-    [d, o, x],
+  ), m([I], async () => {
+    await N();
+  }), m(
+    [d, o, I],
     async ([e], [t]) => {
-      d.value && (await D(), x.value !== -1 && e !== t && setTimeout(() => {
-        l.multi && b.VERSION === 4 || M(x.value);
+      d.value && (await N(), I.value !== -1 && e !== t && setTimeout(() => {
+        l.multi && b.VERSION === 4 || D(I.value);
       }), o.value && setTimeout(() => {
-        M(o.value);
+        D(o.value);
       }));
     }
-  );
+  ), m(T, () => {
+    D(0);
+  });
   const h = (e, t = !1) => {
-    l.disabled || (G(e), D(() => {
-      d.value && O("opened"), d.value || O("closed"), T.value && t && T.value.focus();
+    l.disabled || (G(e), N(() => {
+      d.value && O("opened"), d.value || O("closed"), w.value && t && w.value.focus();
     }));
   };
-  P(d, (e) => {
+  m(d, (e) => {
     if (e) {
       X.value && Array.isArray(u.value) && (v.value = A(u.value).slice());
       return;
@@ -133,11 +135,11 @@ const Ue = (l, O, b) => {
   }, C = (e, t) => {
     if (e = A(e), c.value[t]?.disabled)
       return;
-    if (x.value = t, i.mode !== m.Multi) {
+    if (I.value = t, i.mode !== P.Multi) {
       l.keepOpen || h(!1), i.goToOption(
         0
         /* None */
-      ), u.value = e, E(""), q(), i.type === _.Search && g.value && (g.value.value = l.displayValue(e));
+      ), u.value = e, M(""), q(), i.type === _.Search && g.value && (g.value.value = l.displayValue(e));
       return;
     }
     if (!Array.isArray(a.value))
@@ -158,12 +160,12 @@ const Ue = (l, O, b) => {
     options: c,
     selectedOption: u,
     labelRef: H,
-    activeOption: R,
-    listRef: T,
+    activeOption: E,
+    listRef: w,
     clearable: l.clearable,
     type: p.input ? _.Search : _.Dropdown,
-    mode: l.multi ? m.Multi : m.Single,
-    query: I,
+    mode: l.multi ? P.Multi : P.Single,
+    query: T,
     selectedValue: K,
     toggle: h,
     disabled: l.disabled,
@@ -173,9 +175,9 @@ const Ue = (l, O, b) => {
     placeholder: l.placeholder,
     select: C,
     clearSelection: () => {
-      E(""), u.value = i.mode === m.Single ? null : [], v.value = i.mode === m.Single ? null : [], g.value && (g.value.value = "");
+      M(""), u.value = i.mode === P.Single ? null : [], v.value = i.mode === P.Single ? null : [], g.value && (g.value.value = "");
     },
-    search: E,
+    search: M,
     goToOption: async (e) => {
       if (!d.value)
         return;
@@ -185,11 +187,11 @@ const Ue = (l, O, b) => {
       ).length, S = s.value.length - y;
       for (t > S && (t = S + 1); ; ) {
         if (!c.value[t]?.disabled) {
-          R.value = s.value[t], o.value = t;
+          E.value = s.value[t], o.value = t;
           return;
         }
         if ((e === 1 || e === 10) && (t = t + 1), (e === -1 || e === -10) && (t = t + -1), !!he(o.value)) {
-          R.value = s.value[t], o.value = t;
+          E.value = s.value[t], o.value = t;
           return;
         }
       }
@@ -205,13 +207,13 @@ const Ue = (l, O, b) => {
     }
   };
   Te(Ne, i), Y(
-    T,
+    w,
     () => {
       d.value && Q();
     },
     {
       ignore: [
-        w,
+        x,
         B,
         L,
         U,
@@ -224,14 +226,14 @@ const Ue = (l, O, b) => {
     g.value && (g.value.value = i.query.value = "");
   };
   we(async () => {
-    l.autoFocus && (await D(), setTimeout(() => {
+    l.autoFocus && (await N(), setTimeout(() => {
       V.value.focus();
     })), i.goToOption(0);
   });
   const Se = () => {
     u.value = a.value, Array.isArray(u.value) && (v.value = A(u.value).slice()), O("apply", u.value), h(!1), ye();
   }, Q = () => {
-    X.value && Array.isArray(v.value) && (u.value = A(v.value).slice()), I.value = "", h(!1);
+    X.value && Array.isArray(v.value) && (u.value = A(v.value).slice()), T.value = "", h(!1);
   }, be = (e) => {
     if (!l.disableKeyboardEvents)
       switch (e.key) {
@@ -281,7 +283,7 @@ const Ue = (l, O, b) => {
             h(!0);
             return;
           }
-          C(s.value[o.value], o.value), i.mode === m.Single && !l.keepOpen && h(!1), e.preventDefault();
+          C(s.value[o.value], o.value), i.mode === P.Single && !l.keepOpen && h(!1), e.preventDefault();
           break;
         }
       }
@@ -300,7 +302,7 @@ const Ue = (l, O, b) => {
     onButtonKeydown: be,
     displayedValue: re,
     labelRef: H,
-    query: I,
+    query: T,
     containerProps: J,
     calculateTableHeight: Oe,
     wrapperProps: ve,
@@ -317,10 +319,10 @@ const Ue = (l, O, b) => {
     activeIndex: o,
     onCancel: Q,
     onApply: Se,
-    scrollTo: M,
+    scrollTo: D,
     onClickOutside: Y,
-    listRef: T,
-    buttonRef: w,
+    listRef: w,
+    buttonRef: x,
     apply: B,
     cancel: L,
     el: V,

package/components/dropdown/v4/AppDropdownTrigger.vue.d.ts

@@ -18,6 +18,8 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<__
     optionImageKey?: string;
     optionIconKey?: string;
     optionIconType?: "fill" | "bold" | "regular" | "branded" | "ad-unit" | "ab-test";
+    optionEndIconKey?: string;
+    optionEndIconType?: "fill" | "bold" | "regular" | "branded" | "ad-unit" | "ab-test";
 }>, {
     placeholder: string;
     selectedOption: any;
@@ -41,6 +43,8 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<__
     optionImageKey: any;
     optionIconKey: any;
     optionIconType: any;
+    optionEndIconKey: any;
+    optionEndIconType: any;
 }>, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
     click: () => void;
     copyToClipboard: () => void;
@@ -64,6 +68,8 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<__
     optionImageKey?: string;
     optionIconKey?: string;
     optionIconType?: "fill" | "bold" | "regular" | "branded" | "ad-unit" | "ab-test";
+    optionEndIconKey?: string;
+    optionEndIconType?: "fill" | "bold" | "regular" | "branded" | "ad-unit" | "ab-test";
 }>, {
     placeholder: string;
     selectedOption: any;
@@ -87,6 +93,8 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<__
     optionImageKey: any;
     optionIconKey: any;
     optionIconType: any;
+    optionEndIconKey: any;
+    optionEndIconType: any;
 }>>> & {
     onClick?: () => any;
     onCopyToClipboard?: () => any;
@@ -106,12 +114,15 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<__
     optionIconKey: string;
     optionImageKey: string;
     optionIconType: "fill" | "bold" | "regular" | "branded" | "ad-unit" | "ab-test";
+    optionEndIconKey: string;
+    optionEndIconType: "fill" | "bold" | "regular" | "branded" | "ad-unit" | "ab-test";
     valueToCopy: string;
     selectedOption: any;
     brandIconType: "android" | "ios";
 }>, {
     image?(_: {}): any;
     "icon-start"?(_: {}): any;
+    "icon-end"?(_: {}): any;
 }>;
 export default _default;
 type __VLS_NonUndefinedable<T> = T extends undefined ? never : T;

package/components/dropdown/v4/AppDropdownTrigger.vue.js

@@ -1,7 +1,7 @@
 import o from "./AppDropdownTrigger.vue2.js";
 /* empty css                         */import p from "../../../_virtual/_plugin-vue_export-helper.js";
-// import "../../../AppDropdownTrigger.vue_vue_type_style_index_0_scoped_39c47ad1_lang.css"; //*');
-const s = /* @__PURE__ */ p(o, [["__scopeId", "data-v-39c47ad1"]]);
+// import "../../../AppDropdownTrigger.vue_vue_type_style_index_0_scoped_454709fb_lang.css"; //*');
+const s = /* @__PURE__ */ p(o, [["__scopeId", "data-v-454709fb"]]);
 export {
   s as default
 };

package/components/dropdown/v4/AppDropdownTrigger.vue2.js

@@ -1,21 +1,24 @@
- import "../../../AppDropdownTrigger.vue_vue_type_style_index_0_scoped_39c47ad1_lang.css"; import { defineComponent as V, computed as p, openBlock as o, createElementBlock as n, normalizeClass as B, createElementVNode as a, mergeProps as O, unref as l, renderSlot as T, createCommentVNode as i, createVNode as s, withCtx as v, toDisplayString as $ } from "vue";
-import r from "../../icon/v4/IconV4.vue.js";
-import x from "../../typography/v4/Typography.vue.js";
-import { DropdownTestIdModifiers as u } from "../../../testids/index.js";
-import { useTestIdAttrs as K } from "../../../utils/testIds.js";
-import N from "../../tooltip/v4/TooltipV4.vue.js";
-import { useClipboard as w } from "@vueuse/core";
-import { Snackbar as z } from "../../snackbar/v4/index.js";
-const S = { class: "app-trigger--content" }, D = {
+ import "../../../AppDropdownTrigger.vue_vue_type_style_index_0_scoped_454709fb_lang.css"; import { defineComponent as A, computed as r, openBlock as n, createElementBlock as a, normalizeClass as $, createElementVNode as s, mergeProps as v, unref as o, renderSlot as u, createCommentVNode as d, createVNode as c, withCtx as I, toDisplayString as V } from "vue";
+import p from "../../icon/v4/IconV4.vue.js";
+import B from "../../typography/v4/Typography.vue.js";
+import { DropdownTestIdModifiers as y } from "../../../testids/index.js";
+import { useTestIdAttrs as E } from "../../../utils/testIds.js";
+import x from "../../tooltip/v4/TooltipV4.vue.js";
+import { useClipboard as z } from "@vueuse/core";
+import { Snackbar as N } from "../../snackbar/v4/index.js";
+const w = { class: "app-trigger--content" }, S = {
   key: 0,
   class: "image"
-}, E = ["src"], P = {
+}, D = ["src"], P = {
   key: 1,
   class: "start-icon"
 }, R = { class: "label-text" }, U = { key: 0 }, L = { class: "text-content" }, M = { class: "text-content-value" }, W = {
   key: 0,
   class: "is-mandatory"
-}, j = { class: "app-trigger-key--content" }, _ = /* @__PURE__ */ V({
+}, j = {
+  key: 2,
+  class: "end-icon"
+}, q = { class: "app-trigger-key--content" }, ee = /* @__PURE__ */ A({
   __name: "AppDropdownTrigger",
   props: {
     placeholder: { default: "Select app" },
@@ -36,97 +39,108 @@ const S = { class: "app-trigger--content" }, D = {
     optionNameKey: { default: null },
     optionImageKey: { default: null },
     optionIconKey: { default: null },
-    optionIconType: { default: null }
+    optionIconType: { default: null },
+    optionEndIconKey: { default: null },
+    optionEndIconType: { default: null }
   },
   emits: ["click", "copyToClipboard"],
-  setup(t, { emit: y }) {
-    const e = t, { copy: k, copied: C } = w({}), I = p(
+  setup(t, { emit: f }) {
+    const e = t, { copy: O, copied: k } = z({}), C = r(
       () => e.feedbackVariant ? `state-${e.feedbackVariant}` : ""
     ), b = () => {
-      y("click");
-    }, f = K(e.testId, u), m = "All apps selected", g = p(() => e.multi ? !Array.isArray(e.selectedOption) || !e.selectedOption?.length ? e.placeholder : e.options?.length === e.selectedOption.length ? `${m} (${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), d = p(() => {
+      f("click");
+    }, m = E(e.testId, y), g = "All apps selected", h = r(() => e.multi ? !Array.isArray(e.selectedOption) || !e.selectedOption?.length ? e.placeholder : e.options?.length === e.selectedOption.length ? `${g} (${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), l = r(() => {
       if (!e.selectedOption)
         return null;
       if (!e.multi)
         return e.selectedOption;
       if (Array.isArray(e.selectedOption))
         return e.selectedOption.length === 1 ? e.selectedOption[0] : null;
-    }), A = async () => {
-      await k(e.valueToCopy), C.value && (z({
+    }), K = async () => {
+      await O(e.valueToCopy), k.value && (N({
         title: "Copied successfully",
         type: "success",
         duration: 2e3
-      }), y("copyToClipboard"));
+      }), f("copyToClipboard"));
     };
-    return (c, h) => (o(), n("div", {
-      class: B(["app-trigger-wrapper", { "with-copy": !!t.valueToCopy }])
+    return (i, T) => (n(), a("div", {
+      class: $(["app-trigger-wrapper", { "with-copy": !!t.valueToCopy }])
     }, [
-      a("div", O({
-        class: ["app-trigger", [t.size, l(I), { open: t.open, disabled: t.disabled }]],
+      s("div", v({
+        class: ["app-trigger", [t.size, o(C), { open: t.open, disabled: t.disabled }]],
         style: {
-          paddingLeft: c.$slots.image || l(d) && t.optionImageKey ? "8px" : "12px"
+          paddingLeft: i.$slots.image || o(l) && t.optionImageKey ? "8px" : "12px"
         }
-      }, l(f)[l(u).BUTTON_WRAPPER], {
-        onClick: h[0] || (h[0] = (q) => b())
+      }, o(m)[o(y).BUTTON_WRAPPER], {
+        onClick: T[0] || (T[0] = (F) => b())
       }), [
-        a("div", S, [
-          c.$slots.image || l(d) && t.optionImageKey ? (o(), n("div", D, [
-            T(c.$slots, "image", {}, () => [
-              t.optionImageKey ? (o(), n("img", {
+        s("div", w, [
+          i.$slots.image || o(l) && t.optionImageKey ? (n(), a("div", S, [
+            u(i.$slots, "image", {}, () => [
+              t.optionImageKey ? (n(), a("img", {
                 key: 0,
-                src: l(d)[t.optionImageKey]
-              }, null, 8, E)) : i("", !0)
+                src: o(l)[t.optionImageKey]
+              }, null, 8, D)) : d("", !0)
             ], !0)
-          ])) : i("", !0),
-          c.$slots["icon-start"] || l(d) && t.optionIconKey ? (o(), n("div", P, [
-            T(c.$slots, "icon-start", {}, () => [
-              s(l(r), {
+          ])) : d("", !0),
+          i.$slots["icon-start"] || o(l) && t.optionIconKey ? (n(), a("div", P, [
+            u(i.$slots, "icon-start", {}, () => [
+              c(o(p), {
                 type: t.optionIconType,
-                name: l(d)[t.optionIconKey],
+                name: o(l)[t.optionIconKey],
                 size: "20px"
               }, null, 8, ["type", "name"])
             ], !0)
-          ])) : i("", !0),
-          s(l(x), O({ variant: "button" }, l(f)[l(u).BUTTON_CONTENT], { class: "displayed-value" }), {
-            default: v(() => [
-              a("div", R, [
-                l(g) === m ? (o(), n("span", U, [
-                  s(l(r), {
+          ])) : d("", !0),
+          c(o(B), v({ variant: "button" }, o(m)[o(y).BUTTON_CONTENT], { class: "displayed-value" }), {
+            default: I(() => [
+              s("div", R, [
+                o(h) === g ? (n(), a("span", U, [
+                  c(o(p), {
                     name: "cube",
                     size: "20px",
                     type: "fill"
                   })
-                ])) : i("", !0),
-                a("div", L, [
-                  a("div", M, $(l(g)), 1),
-                  t.mandatory && (Array.isArray(t.selectedOption) ? !t.selectedOption.length : !t.selectedOption) ? (o(), n("span", W, "*")) : i("", !0)
+                ])) : d("", !0),
+                s("div", L, [
+                  s("div", M, V(o(h)), 1),
+                  t.mandatory && (Array.isArray(t.selectedOption) ? !t.selectedOption.length : !t.selectedOption) ? (n(), a("span", W, "*")) : d("", !0)
                 ])
               ])
             ]),
             _: 1
-          }, 16)
+          }, 16),
+          i.$slots["icon-end"] || o(l) && t.optionEndIconKey && o(l)[t.optionEndIconKey] ? (n(), a("div", j, [
+            u(i.$slots, "icon-end", {}, () => [
+              c(o(p), {
+                type: t.optionEndIconType,
+                name: o(l)[t.optionEndIconKey],
+                size: "24px"
+              }, null, 8, ["type", "name"])
+            ], !0)
+          ])) : d("", !0)
         ]),
-        a("div", null, [
-          s(l(r), {
+        s("div", null, [
+          c(o(p), {
             name: "caret-down",
             size: "20px",
             class: "app-trigger--icon"
           })
         ])
       ], 16),
-      t.valueToCopy ? (o(), n("div", {
+      t.valueToCopy ? (n(), a("div", {
         key: 0,
         class: "app-trigger-key",
-        onClick: A
+        onClick: K
       }, [
-        s(l(N), {
+        c(o(x), {
           text: t.valueToCopy,
           header: "Copy app key",
           placement: "bottom"
         }, {
-          default: v(() => [
-            a("div", j, [
-              s(l(r), {
+          default: I(() => [
+            s("div", q, [
+              c(o(p), {
                 name: "copy",
                 size: "20px"
               })
@@ -134,10 +148,10 @@ const S = { class: "app-trigger--content" }, D = {
           ]),
           _: 1
         }, 8, ["text"])
-      ])) : i("", !0)
+      ])) : d("", !0)
     ], 2));
   }
 });
 export {
-  _ as default
+  ee as default
 };

package/components/dropdown/v4/DropdownV4.vue.js

@@ -1,8 +1,8 @@
 import o from "./DropdownV4.vue2.js";
-/* empty css                 *//* empty css                 */import _ from "../../../_virtual/_plugin-vue_export-helper.js";
-// import "../../../DropdownV4.vue_vue_type_style_index_0_scoped_0363db63_lang.css"; //*');
+/* empty css                 *//* empty css                 */import e from "../../../_virtual/_plugin-vue_export-helper.js";
+// import "../../../DropdownV4.vue_vue_type_style_index_0_scoped_2e7a89bc_lang.css"; //*');
 // import "../../../DropdownV4.vue_vue_type_style_index_1_lang.css";  //');
-const r = /* @__PURE__ */ _(o, [["__scopeId", "data-v-0363db63"]]);
+const r = /* @__PURE__ */ e(o, [["__scopeId", "data-v-2e7a89bc"]]);
 export {
   r as default
 };