@ironsource/shared-ui 2.1.11-test.2 → 2.1.11-test.26

package/components/dropdown/v3/index.d.ts

@@ -22,6 +22,7 @@ declare const DropdownTypes: () => (({
             skidding: number;
             modelValue: any;
             selected: any;
+            valueToCopy: string;
             placeholder: string;
             autoFocus: boolean;
             multi: boolean;
@@ -33,9 +34,8 @@ declare const DropdownTypes: () => (({
             inlineSearch: boolean;
             onSearch: (option: any, term: string) => boolean;
             noResultsText: string;
-            valueToCopy: string;
-            helperText: string;
             searchPlaceholder: string;
+            helperText: string;
             showButtonOnOpen: boolean;
             clearable: boolean;
             multiOptionsPlaceholderPrefix: string;
@@ -93,13 +93,13 @@ declare const DropdownTypes: () => (({
                 type: import("vue").PropType<string>;
                 default: string;
             };
+            isOpen: {
+                type: import("vue").PropType<boolean>;
+            };
             skidding: {
                 type: import("vue").PropType<number>;
                 default: number;
             };
-            isOpen: {
-                type: import("vue").PropType<boolean>;
-            };
             modelValue: {
                 type: import("vue").PropType<unknown>;
                 default: any;
@@ -108,6 +108,10 @@ declare const DropdownTypes: () => (({
                 type: import("vue").PropType<unknown>;
                 default: any;
             };
+            valueToCopy: {
+                type: import("vue").PropType<string>;
+                default: string;
+            };
             options: {
                 type: import("vue").PropType<any[]>;
                 required: true;
@@ -163,7 +167,7 @@ declare const DropdownTypes: () => (({
                 type: import("vue").PropType<(option: unknown) => string>;
                 required: true;
             };
-            valueToCopy: {
+            searchPlaceholder: {
                 type: import("vue").PropType<string>;
                 default: string;
             };
@@ -171,10 +175,6 @@ declare const DropdownTypes: () => (({
                 type: import("vue").PropType<string>;
                 default: string;
             };
-            searchPlaceholder: {
-                type: import("vue").PropType<string>;
-                default: string;
-            };
             showButtonOnOpen: {
                 type: import("vue").PropType<boolean>;
                 default: boolean;
@@ -203,7 +203,7 @@ declare const DropdownTypes: () => (({
             "onUpdate:isOpen"?: (value: unknown) => any;
             onOpened?: () => any;
             onClosed?: () => any;
-        } & import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, "title" | "theme" | "testId" | "placement" | "disabled" | "distance" | "container" | "popperClass" | "size" | "flip" | "mandatory" | "error" | "skidding" | "modelValue" | "selected" | "placeholder" | "autoFocus" | "multi" | "defaultOpen" | "keepOpen" | "autoSize" | "disableKeyboardEvents" | "isOnTop" | "inlineSearch" | "onSearch" | "noResultsText" | "valueToCopy" | "helperText" | "searchPlaceholder" | "showButtonOnOpen" | "clearable" | "multiOptionsPlaceholderPrefix" | "multiOptionsPlaceholderSuffix" | "darkTheme">;
+        } & import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, "title" | "theme" | "testId" | "placement" | "disabled" | "distance" | "container" | "popperClass" | "size" | "flip" | "mandatory" | "error" | "skidding" | "modelValue" | "selected" | "valueToCopy" | "placeholder" | "autoFocus" | "multi" | "defaultOpen" | "keepOpen" | "autoSize" | "disableKeyboardEvents" | "isOnTop" | "inlineSearch" | "onSearch" | "noResultsText" | "searchPlaceholder" | "helperText" | "showButtonOnOpen" | "clearable" | "multiOptionsPlaceholderPrefix" | "multiOptionsPlaceholderSuffix" | "darkTheme">;
         $attrs: {
             [x: string]: unknown;
         };
@@ -269,13 +269,13 @@ declare const DropdownTypes: () => (({
                 type: import("vue").PropType<string>;
                 default: string;
             };
+            isOpen: {
+                type: import("vue").PropType<boolean>;
+            };
             skidding: {
                 type: import("vue").PropType<number>;
                 default: number;
             };
-            isOpen: {
-                type: import("vue").PropType<boolean>;
-            };
             modelValue: {
                 type: import("vue").PropType<unknown>;
                 default: any;
@@ -284,6 +284,10 @@ declare const DropdownTypes: () => (({
                 type: import("vue").PropType<unknown>;
                 default: any;
             };
+            valueToCopy: {
+                type: import("vue").PropType<string>;
+                default: string;
+            };
             options: {
                 type: import("vue").PropType<any[]>;
                 required: true;
@@ -339,7 +343,7 @@ declare const DropdownTypes: () => (({
                 type: import("vue").PropType<(option: unknown) => string>;
                 required: true;
             };
-            valueToCopy: {
+            searchPlaceholder: {
                 type: import("vue").PropType<string>;
                 default: string;
             };
@@ -347,10 +351,6 @@ declare const DropdownTypes: () => (({
                 type: import("vue").PropType<string>;
                 default: string;
             };
-            searchPlaceholder: {
-                type: import("vue").PropType<string>;
-                default: string;
-            };
             showButtonOnOpen: {
                 type: import("vue").PropType<boolean>;
                 default: boolean;
@@ -406,6 +406,7 @@ declare const DropdownTypes: () => (({
             skidding: number;
             modelValue: any;
             selected: any;
+            valueToCopy: string;
             placeholder: string;
             autoFocus: boolean;
             multi: boolean;
@@ -417,9 +418,8 @@ declare const DropdownTypes: () => (({
             inlineSearch: boolean;
             onSearch: (option: any, term: string) => boolean;
             noResultsText: string;
-            valueToCopy: string;
-            helperText: string;
             searchPlaceholder: string;
+            helperText: string;
             showButtonOnOpen: boolean;
             clearable: boolean;
             multiOptionsPlaceholderPrefix: string;
@@ -497,13 +497,13 @@ declare const DropdownTypes: () => (({
             type: import("vue").PropType<string>;
             default: string;
         };
+        isOpen: {
+            type: import("vue").PropType<boolean>;
+        };
         skidding: {
             type: import("vue").PropType<number>;
             default: number;
         };
-        isOpen: {
-            type: import("vue").PropType<boolean>;
-        };
         modelValue: {
             type: import("vue").PropType<unknown>;
             default: any;
@@ -512,6 +512,10 @@ declare const DropdownTypes: () => (({
             type: import("vue").PropType<unknown>;
             default: any;
         };
+        valueToCopy: {
+            type: import("vue").PropType<string>;
+            default: string;
+        };
         options: {
             type: import("vue").PropType<any[]>;
             required: true;
@@ -567,7 +571,7 @@ declare const DropdownTypes: () => (({
             type: import("vue").PropType<(option: unknown) => string>;
             required: true;
         };
-        valueToCopy: {
+        searchPlaceholder: {
             type: import("vue").PropType<string>;
             default: string;
         };
@@ -575,10 +579,6 @@ declare const DropdownTypes: () => (({
             type: import("vue").PropType<string>;
             default: string;
         };
-        searchPlaceholder: {
-            type: import("vue").PropType<string>;
-            default: string;
-        };
         showButtonOnOpen: {
             type: import("vue").PropType<boolean>;
             default: boolean;
@@ -666,13 +666,13 @@ declare const DropdownTypes: () => (({
         type: import("vue").PropType<string>;
         default: string;
     };
+    isOpen: {
+        type: import("vue").PropType<boolean>;
+    };
     skidding: {
         type: import("vue").PropType<number>;
         default: number;
     };
-    isOpen: {
-        type: import("vue").PropType<boolean>;
-    };
     modelValue: {
         type: import("vue").PropType<unknown>;
         default: any;
@@ -681,6 +681,10 @@ declare const DropdownTypes: () => (({
         type: import("vue").PropType<unknown>;
         default: any;
     };
+    valueToCopy: {
+        type: import("vue").PropType<string>;
+        default: string;
+    };
     options: {
         type: import("vue").PropType<any[]>;
         required: true;
@@ -736,7 +740,7 @@ declare const DropdownTypes: () => (({
         type: import("vue").PropType<(option: unknown) => string>;
         required: true;
     };
-    valueToCopy: {
+    searchPlaceholder: {
         type: import("vue").PropType<string>;
         default: string;
     };
@@ -744,10 +748,6 @@ declare const DropdownTypes: () => (({
         type: import("vue").PropType<string>;
         default: string;
     };
-    searchPlaceholder: {
-        type: import("vue").PropType<string>;
-        default: string;
-    };
     showButtonOnOpen: {
         type: import("vue").PropType<boolean>;
         default: boolean;
@@ -803,6 +803,7 @@ declare const DropdownTypes: () => (({
     skidding: number;
     modelValue: any;
     selected: any;
+    valueToCopy: string;
     placeholder: string;
     autoFocus: boolean;
     multi: boolean;
@@ -814,9 +815,8 @@ declare const DropdownTypes: () => (({
     inlineSearch: boolean;
     onSearch: (option: any, term: string) => boolean;
     noResultsText: string;
-    valueToCopy: string;
-    helperText: string;
     searchPlaceholder: string;
+    helperText: string;
     showButtonOnOpen: boolean;
     clearable: boolean;
     multiOptionsPlaceholderPrefix: string;

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

@@ -106,6 +106,7 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<__
     open: boolean;
     mandatory: boolean;
     loading: boolean;
+    valueToCopy: string;
     options: unknown[];
     singleAppSelection: boolean;
     placeholder: string;
@@ -116,7 +117,6 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<__
     optionIconType: "fill" | "bold" | "regular" | "branded" | "ad-unit" | "ab-test" | "ad-networks" | "ad-networks/flat" | "content-rate";
     optionEndIconKey: string;
     optionEndIconType: "fill" | "bold" | "regular" | "branded" | "ad-unit" | "ab-test" | "ad-networks" | "ad-networks/flat" | "content-rate";
-    valueToCopy: string;
     selectedOption: any;
     brandIconType: "android" | "ios";
 }>, {

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

@@ -1,7 +1,7 @@
 import o from "./ButtonDropdownTrigger.vue2.js";
-/* empty css                            */import t from "../../../_virtual/_plugin-vue_export-helper.js";
-// import "../../../ButtonDropdownTrigger.vue_vue_type_style_index_0_scoped_76c74f58_lang.css"; //*');
-const p = /* @__PURE__ */ t(o, [["__scopeId", "data-v-76c74f58"]]);
+/* empty css                            */import e from "../../../_virtual/_plugin-vue_export-helper.js";
+// import "../../../ButtonDropdownTrigger.vue_vue_type_style_index_0_scoped_f9a13e27_lang.css"; //*');
+const p = /* @__PURE__ */ e(o, [["__scopeId", "data-v-f9a13e27"]]);
 export {
   p as default
 };

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

@@ -1,9 +1,9 @@
- import "../../../ButtonDropdownTrigger.vue_vue_type_style_index_0_scoped_76c74f58_lang.css"; import { defineComponent as l, openBlock as o, createBlock as i, unref as d, normalizeClass as r, withCtx as s, renderSlot as c, createTextVNode as u, toDisplayString as f } from "vue";
-import m from "../../button/v4/ButtonV4.vue.js";
+ import "../../../ButtonDropdownTrigger.vue_vue_type_style_index_0_scoped_f9a13e27_lang.css"; import { defineComponent as l, openBlock as o, createBlock as i, unref as d, normalizeClass as r, withCtx as s, renderSlot as c, createElementVNode as u, toDisplayString as m } from "vue";
+import f from "../../button/v4/ButtonV4.vue.js";
 import "../../button/v4/IconButtonV4.vue.js";
 import "../../button/v4/ButtonGroup.vue.js";
 import "../../button/v4/ToggleButtonGroupAB.vue.js";
-const p = /* @__PURE__ */ l({
+const b = { class: "label" }, p = /* @__PURE__ */ l({
   __name: "ButtonDropdownTrigger",
   props: {
     label: null,
@@ -18,7 +18,7 @@ const p = /* @__PURE__ */ l({
   },
   emits: ["click"],
   setup(e, { emit: a }) {
-    return (n, t) => (o(), i(d(m), {
+    return (n, t) => (o(), i(d(f), {
       class: r(["button-trigger", { open: e.open }]),
       disabled: e.disabled,
       color: "default",
@@ -29,11 +29,11 @@ const p = /* @__PURE__ */ l({
       "end-icon-name": e.hideEndIcon ? null : "caret-down",
       content: e.label,
       "test-id": e.testId,
-      onClick: t[0] || (t[0] = (b) => a("click"))
+      onClick: t[0] || (t[0] = (y) => a("click"))
     }, {
       default: s(() => [
         c(n.$slots, "default", {}, () => [
-          u(f(e.label), 1)
+          u("div", b, m(e.label), 1)
         ], !0)
       ]),
       _: 3

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

@@ -1,7 +1,7 @@
 import o from "./ButtonFilterDropdownTrigger.vue2.js";
 /* empty css                                  */import t from "../../../_virtual/_plugin-vue_export-helper.js";
-// import "../../../ButtonFilterDropdownTrigger.vue_vue_type_style_index_0_scoped_7f750550_lang.css"; //*');
-const p = /* @__PURE__ */ t(o, [["__scopeId", "data-v-7f750550"]]);
+// import "../../../ButtonFilterDropdownTrigger.vue_vue_type_style_index_0_scoped_1aa6df01_lang.css"; //*');
+const p = /* @__PURE__ */ t(o, [["__scopeId", "data-v-1aa6df01"]]);
 export {
   p as default
 };

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

@@ -1,10 +1,10 @@
- import "../../../ButtonFilterDropdownTrigger.vue_vue_type_style_index_0_scoped_7f750550_lang.css"; import { defineComponent as m, openBlock as o, createElementBlock as u, mergeProps as l, unref as t, createBlock as d, createCommentVNode as i, createVNode as f, withCtx as p, createTextVNode as I, toDisplayString as T } from "vue";
+ import "../../../ButtonFilterDropdownTrigger.vue_vue_type_style_index_0_scoped_1aa6df01_lang.css"; import { defineComponent as m, openBlock as o, createElementBlock as u, mergeProps as l, unref as t, createBlock as d, createCommentVNode as i, createVNode as f, withCtx as p, createTextVNode as I, toDisplayString as T } from "vue";
 import y from "../../typography/v4/Typography.vue.js";
 import s from "../../icon/v4/IconV4.vue.js";
 import "../../icon/v4/IconFlag.vue.js";
 import { useTestIdAttrs as N } from "../../../utils/testIds.js";
-import { DropdownTestIdModifiers as a } from "../../../testids/index.js";
-const E = /* @__PURE__ */ m({
+import { DropdownTestIdModifiers as n } from "../../../testids/index.js";
+const h = /* @__PURE__ */ m({
   __name: "ButtonFilterDropdownTrigger",
   props: {
     label: null,
@@ -18,10 +18,10 @@ const E = /* @__PURE__ */ m({
   },
   emits: ["click"],
   setup(e, { emit: c }) {
-    const n = N(e.testId, a);
+    const a = N(e.testId, n);
     return (g, r) => (o(), u("div", l({
       class: ["button-filter-dropdown-trigger", [e.variant, { disabled: e.disabled, open: e.open }]]
-    }, t(n)[t(a).BUTTON], {
+    }, t(a)[t(n).BUTTON], {
       onClick: r[0] || (r[0] = (k) => c("click"))
     }), [
       e.startIconName ? (o(), d(t(s), {
@@ -31,7 +31,7 @@ const E = /* @__PURE__ */ m({
         size: "16px",
         class: "start-icon"
       }, null, 8, ["name", "type"])) : i("", !0),
-      f(t(y), l({ variant: "chipLabel" }, t(n)[t(a).BUTTON_CONTENT]), {
+      f(t(y), l({ variant: "button" }, t(a)[t(n).BUTTON_CONTENT]), {
         default: p(() => [
           I(T(e.label), 1)
         ]),
@@ -47,5 +47,5 @@ const E = /* @__PURE__ */ m({
   }
 });
 export {
-  E as default
+  h as default
 };

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

@@ -10,6 +10,8 @@ declare const _default: import("vue").DefineComponent<__VLS_WithDefaults<__VLS_T
     selectedOption: unknown | unknown[];
     displayValue: (option: unknown) => string;
     multi: boolean;
+    cancelAllSelectedDisplay?: boolean;
+    displayValueInQuotes?: boolean;
 }>, {
     label: string;
     open: boolean;
@@ -18,6 +20,8 @@ declare const _default: import("vue").DefineComponent<__VLS_WithDefaults<__VLS_T
     feedbackVariant: string;
     displayedValue: string;
     allSelected: boolean;
+    cancelAllSelectedDisplay: boolean;
+    displayValueInQuotes: boolean;
 }>, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
     clear: () => void;
 }, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<{
@@ -32,6 +36,8 @@ declare const _default: import("vue").DefineComponent<__VLS_WithDefaults<__VLS_T
     selectedOption: unknown | unknown[];
     displayValue: (option: unknown) => string;
     multi: boolean;
+    cancelAllSelectedDisplay?: boolean;
+    displayValueInQuotes?: boolean;
 }>, {
     label: string;
     open: boolean;
@@ -40,6 +46,8 @@ declare const _default: import("vue").DefineComponent<__VLS_WithDefaults<__VLS_T
     feedbackVariant: string;
     displayedValue: string;
     allSelected: boolean;
+    cancelAllSelectedDisplay: boolean;
+    displayValueInQuotes: boolean;
 }>>> & {
     onClear?: () => any;
 }, {
@@ -50,6 +58,8 @@ declare const _default: import("vue").DefineComponent<__VLS_WithDefaults<__VLS_T
     feedbackVariant: string;
     allSelected: boolean;
     displayedValue: any;
+    cancelAllSelectedDisplay: boolean;
+    displayValueInQuotes: boolean;
 }>;
 export default _default;
 type __VLS_NonUndefinedable<T> = T extends undefined ? never : T;

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

@@ -1,7 +1,7 @@
 import o from "./ChipDropdownTrigger.vue2.js";
 /* empty css                          */import e from "../../../_virtual/_plugin-vue_export-helper.js";
-// import "../../../ChipDropdownTrigger.vue_vue_type_style_index_0_scoped_49bd7193_lang.css"; //*');
-const s = /* @__PURE__ */ e(o, [["__scopeId", "data-v-49bd7193"]]);
+// import "../../../ChipDropdownTrigger.vue_vue_type_style_index_0_scoped_039dd922_lang.css"; //*');
+const d = /* @__PURE__ */ e(o, [["__scopeId", "data-v-039dd922"]]);
 export {
-  s as default
+  d as default
 };

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

@@ -1,10 +1,13 @@
- import "../../../ChipDropdownTrigger.vue_vue_type_style_index_0_scoped_49bd7193_lang.css"; import { defineComponent as V, ref as b, computed as p, openBlock as _, createElementBlock as C, mergeProps as n, unref as t, createElementVNode as d, createVNode as c, withCtx as w, createTextVNode as B, toDisplayString as k, withDirectives as u, vShow as f, withModifiers as v } from "vue";
-import m from "../../icon/v4/IconV4.vue.js";
+ import "../../../ChipDropdownTrigger.vue_vue_type_style_index_0_scoped_039dd922_lang.css"; import { defineComponent as B, ref as d, computed as p, watch as _, openBlock as A, createBlock as k, unref as t, withCtx as g, createElementVNode as r, mergeProps as u, createVNode as f, createTextVNode as D, toDisplayString as I, withDirectives as V, vShow as O, withModifiers as N } from "vue";
+import x from "../../icon/v4/IconV4.vue.js";
 import "../../icon/v4/IconFlag.vue.js";
-import x from "../../typography/v4/Typography.vue.js";
-import { DropdownTestIdModifiers as o } from "../../../testids/index.js";
-import { useTestIdAttrs as A } from "../../../utils/testIds.js";
-const N = { class: "chip-trigger--content" }, I = { class: "chip-trigger--icon" }, $ = ["onClick"], M = /* @__PURE__ */ V({
+import S from "../../typography/v4/Typography.vue.js";
+import { DropdownTestIdModifiers as s } from "../../../testids/index.js";
+import { useTestIdAttrs as $ } from "../../../utils/testIds.js";
+import { isElementTruncated as E } from "../../../utils/text.js";
+import { promiseTimeout as R } from "@vueuse/core";
+import U from "../../tooltip/v4/TooltipV4.vue.js";
+const z = { class: "chip-trigger--icon" }, L = ["onClick"], K = /* @__PURE__ */ B({
   __name: "ChipDropdownTrigger",
   props: {
     label: { default: "Status" },
@@ -17,59 +20,82 @@ const N = { class: "chip-trigger--content" }, I = { class: "chip-trigger--icon"
     options: null,
     selectedOption: null,
     displayValue: null,
-    multi: { type: Boolean }
+    multi: { type: Boolean },
+    cancelAllSelectedDisplay: { type: Boolean, default: !1 },
+    displayValueInQuotes: { type: Boolean, default: !1 }
   },
   emits: ["clear"],
-  setup(r, { emit: h }) {
-    const e = r, y = () => {
-      h("clear");
-    }, i = b(!0), g = (l) => {
+  setup(n, { emit: v }) {
+    const e = n, C = () => {
+      v("clear");
+    }, o = d(null), i = d(!0), m = d(!1), y = (l) => {
       let a = l;
-      return Array.isArray(l) && (l.length > 1 ? a = `${l[0]}, +${l[1]}` : a = l[0] ? `${l[0]}` : ""), i.value = !!a, a ? `${e.label}: ${a}` : e.label;
-    }, T = p(
+      Array.isArray(l) && (l.length > 1 ? a = `${l[0]}, +${l[1]}` : a = l[0] ? `${l[0]}` : ""), i.value = !!a;
+      let T = a;
+      return e.displayValueInQuotes && (T = `"${a}"`), a ? `${e.label}: ${T}` : e.label;
+    }, b = p(
       () => e.feedbackVariant ? `state-${e.feedbackVariant}` : ""
-    ), s = A(e.testId, o), O = p(() => {
+    ), c = $(e.testId, s), h = p(() => {
       if (!e.multi)
         return e.selectedOption ? e.displayValue(e.selectedOption) : "";
       if (Array.isArray(e.selectedOption))
-        return e.selectedOption.length ? e.allSelected ? ["All"] : e.selectedOption.length == 1 && e.displayValue ? [e.displayValue(e.selectedOption[0])] : [
+        return e.selectedOption.length ? e.allSelected && !e.cancelAllSelectedDisplay ? ["All"] : e.selectedOption.length == 1 && e.displayValue ? [e.displayValue(e.selectedOption[0])] : [
           e.displayValue(e.selectedOption[0]),
           e.selectedOption.length - 1
         ] : [];
     });
-    return (l, a) => (_(), C("div", n({
-      class: ["chip-trigger", [t(T), { active: i.value, disabled: r.disabled, open: r.open }]]
-    }, t(s)[t(o).BUTTON]), [
-      d("div", N, [
-        c(t(x), n({ variant: "chipLabel" }, t(s)[t(o).BUTTON_CONTENT]), {
-          default: w(() => [
-            B(k(g(t(O))), 1)
-          ]),
-          _: 1
-        }, 16),
-        u(d("div", I, [
-          c(t(m), {
-            name: "caret-down",
-            size: "16px"
-          })
-        ], 512), [
-          [f, !i.value]
-        ]),
-        u(d("div", n({ class: "x-circle-wrapper" }, t(s)[t(o).BUTTON_CLEAR], {
-          onClick: v(y, ["stop"])
-        }), [
-          c(t(m), {
-            name: "x-circle",
-            size: "16px",
-            type: "fill"
-          })
-        ], 16, $), [
-          [f, i.value]
-        ])
-      ])
-    ], 16));
+    _([() => e.selectedOption, o], async () => {
+      await R(100), m.value = o.value && E(o.value);
+    });
+    const w = p(() => m.value ? y(h.value) : "");
+    return (l, a) => (A(), k(t(U), {
+      text: t(w),
+      class: "tooltip-option"
+    }, {
+      default: g(() => [
+        r("div", u({
+          class: ["chip-trigger", [t(b), { active: i.value, disabled: n.disabled, open: n.open }]]
+        }, t(c)[t(s).BUTTON]), [
+          r("div", {
+            ref_key: "textContainerRef",
+            ref: o,
+            class: "chip-trigger--content"
+          }, [
+            f(t(S), u({
+              class: "chip-trigger--text",
+              variant: "chipLabel"
+            }, t(c)[t(s).BUTTON_CONTENT]), {
+              default: g(() => [
+                D(I(y(t(h))), 1)
+              ]),
+              _: 1
+            }, 16),
+            V(r("div", z, [
+              f(t(x), {
+                name: "caret-down",
+                size: "16px"
+              })
+            ], 512), [
+              [O, !i.value]
+            ]),
+            V(r("div", u({ class: "x-circle-wrapper" }, t(c)[t(s).BUTTON_CLEAR], {
+              onClick: N(C, ["stop"])
+            }), [
+              f(t(x), {
+                name: "x-circle",
+                size: "16px",
+                type: "fill"
+              })
+            ], 16, L), [
+              [O, i.value]
+            ])
+          ], 512)
+        ], 16)
+      ]),
+      _: 1
+    }, 8, ["text"]));
   }
 });
 export {
-  M as default
+  K as default
 };

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

@@ -0,0 +1,90 @@
+type SelectedCondition = {
+    label: string;
+    value: string;
+    multi: boolean;
+};
+declare const _default: import("vue").DefineComponent<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<{
+    selectedCondition: SelectedCondition | null;
+    appliedSelections: unknown | unknown[];
+    conditionalOptions: SelectedCondition[];
+    label: string;
+    testId?: string;
+    comparingKey: string;
+    fetchFnCallback: (q: string) => Promise<unknown[]>;
+    optionNameKey: string;
+    minCharsToStart?: number;
+    isOpen?: boolean;
+    searchQuery?: string;
+    loadMoreFn?: () => Promise<void>;
+    infiniteLoading?: boolean;
+}>, {
+    label: string;
+    testId: string;
+    comparingKey: string;
+    optionNameKey: string;
+    minCharsToStart: number;
+    isOpen: boolean;
+    searchQuery: string;
+    loadMoreFn: any;
+    infiniteLoading: boolean;
+}>, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    "update:selectedCondition": (value: SelectedCondition) => void;
+    "update:appliedSelections": (value: unknown) => void;
+    clear: () => void;
+}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<{
+    selectedCondition: SelectedCondition | null;
+    appliedSelections: unknown | unknown[];
+    conditionalOptions: SelectedCondition[];
+    label: string;
+    testId?: string;
+    comparingKey: string;
+    fetchFnCallback: (q: string) => Promise<unknown[]>;
+    optionNameKey: string;
+    minCharsToStart?: number;
+    isOpen?: boolean;
+    searchQuery?: string;
+    loadMoreFn?: () => Promise<void>;
+    infiniteLoading?: boolean;
+}>, {
+    label: string;
+    testId: string;
+    comparingKey: string;
+    optionNameKey: string;
+    minCharsToStart: number;
+    isOpen: boolean;
+    searchQuery: string;
+    loadMoreFn: any;
+    infiniteLoading: boolean;
+}>>> & {
+    onClear?: () => any;
+    "onUpdate:selectedCondition"?: (value: SelectedCondition) => any;
+    "onUpdate:appliedSelections"?: (value: unknown) => any;
+}, {
+    label: string;
+    testId: string;
+    isOpen: boolean;
+    infiniteLoading: boolean;
+    optionNameKey: string;
+    comparingKey: string;
+    minCharsToStart: number;
+    searchQuery: string;
+    loadMoreFn: () => Promise<void>;
+}>;
+export default _default;
+type __VLS_NonUndefinedable<T> = T extends undefined ? never : T;
+type __VLS_TypePropsToRuntimeProps<T> = {
+    [K in keyof T]-?: {} extends Pick<T, K> ? {
+        type: import('vue').PropType<__VLS_NonUndefinedable<T[K]>>;
+    } : {
+        type: import('vue').PropType<T[K]>;
+        required: true;
+    };
+};
+type __VLS_WithDefaults<P, D> = {
+    [K in keyof Pick<P, keyof P>]: K extends keyof D ? __VLS_Prettify<P[K] & {
+        default: D[K];
+    }> : P[K];
+};
+type __VLS_Prettify<T> = {
+    [K in keyof T]: T[K];
+} & {};