@ironsource/shared-ui 2.1.11-rc.47 → 2.1.11-rc.48

package/ChipDropdownTrigger.vue_vue_type_style_index_0_scoped_e43ac1c9_lang.css

@@ -0,0 +1 @@
+.chip-trigger[data-v-e43ac1c9]{border:1px solid var(--default-outlined-border);padding:.3125rem .3125rem .3125rem .4375rem;border-radius:100px;cursor:pointer;user-select:none;display:inline-flex;max-width:250px}.chip-trigger[data-v-e43ac1c9]:hover{border-color:var(--action-active);background:var(--action-selected)}.chip-trigger.active[data-v-e43ac1c9]{border:none;background:var(--primary-light);padding:.375rem .375rem .375rem .5rem}.chip-trigger.active .chip-trigger--content[data-v-e43ac1c9]{color:var(--primary-contrast-text)}.chip-trigger.active[data-v-e43ac1c9]:hover{border:.0625rem solid var(--primary-main-50-p);padding:.3125rem .3125rem .3125rem .4375rem}.chip-trigger.open[data-v-e43ac1c9]{border:.125rem solid var(--action-active);padding:.25rem .25rem .25rem .375rem;background:var(--action-selected)}.chip-trigger.open.active[data-v-e43ac1c9]{border:.125rem solid var(--primary-main-50-p);background:var(--primary-light);padding:.25rem .25rem .25rem .375rem}.chip-trigger.disabled[data-v-e43ac1c9]{cursor:auto}.chip-trigger--content[data-v-e43ac1c9]{color:var(--text-primary);display:flex;width:100%}.chip-trigger--content .x-circle-wrapper[data-v-e43ac1c9]{margin-left:4px;color:var(--primary-dark)}.chip-trigger--content .x-circle-wrapper[data-v-e43ac1c9]:hover{color:var(--primary-darker)}.chip-trigger--text[data-v-e43ac1c9]{overflow:hidden;white-space:nowrap;text-overflow:ellipsis;text-align:left;width:100%}.chip-trigger--suffix[data-v-e43ac1c9]{white-space:nowrap}.chip-trigger--icon[data-v-e43ac1c9]{margin-left:4px;color:var(--action-active)}

package/ConditionalDropdown.vue_vue_type_style_index_0_scoped_8f96cf5a_lang.css

@@ -0,0 +1 @@
+.custom-list-area[data-v-8f96cf5a]{color:var(--text-secondary);width:100%;text-align:center;box-sizing:border-box;padding:63px 43px}.inline-search[data-v-8f96cf5a]{width:100%}.contain-accept[data-v-8f96cf5a]{padding:6px 8px;margin-bottom:4px;cursor:pointer}.contain-accept[data-v-8f96cf5a]:hover{background-color:var(--action-hover);border-radius:.5rem}.contain-accept--query[data-v-8f96cf5a]{margin-left:4px;display:inline-flex;color:var(--primary-main)}

package/DataGrid.vue_vue_type_style_index_0_scoped_26488faf_lang.css

@@ -0,0 +1 @@
+.sticky[data-v-26488faf]{position:sticky}.table-container[data-v-26488faf]{width:100%;position:relative;display:flex;flex-direction:column}.table-header[data-v-26488faf]{display:flex;align-items:center;height:calc(var(--spacing-800) - 1px);border-bottom:1px solid var(--common-divider);background-color:var(--background-paper-elevation-0);position:sticky;left:0;padding:var(--spacing-300)}.table-header .table-title[data-v-26488faf]{display:flex;flex:1;align-items:center;justify-content:flex-start;height:100%;color:var(--text-primary)}.table-header .table-header-right[data-v-26488faf]{display:flex;align-items:center;height:100%}.table-header .search-wrapper[data-v-26488faf]{width:13.75rem}.table-header.isStickyHeader[data-v-26488faf]{z-index:calc(var(--7552e08c) + 3);top:0}.table-head-container[data-v-26488faf]{display:flex;align-items:center;white-space:nowrap;color:var(--text-primary)}.table-footer[data-v-26488faf]{color:var(--text-primary);background-color:var(--background-paper-elevation-0);padding:0 var(--spacing-300);display:flex;align-items:center;min-height:var(--spacing-600);border:1px solid var(--common-divider);border-radius:var(--border-radius-md);border-top-right-radius:0;border-top-left-radius:0}.table-body-wrapper[data-v-26488faf]{display:inline-table}.table-header-actions[data-v-26488faf]{margin-left:var(--spacing-100);display:flex;align-items:center}.table-row[data-v-26488faf]{position:relative}.table-row.loading[data-v-26488faf]{opacity:.7}.table-row:not(.expanded):last-child>td[data-v-26488faf]{border-bottom:none}.table-row.expanded:last-child>.expanded-row[data-v-26488faf]{border-bottom:none}.expanded-row[data-v-26488faf]{grid-column:var(--7f4c0eae);border-bottom:1px solid var(--common-divider);background-color:var(--background-default)}table[data-v-26488faf]{position:relative;display:block;overflow:auto;background:var(--background-paper-elevation-0);border:1px solid var(--common-divider);color:var(--text-primary);text-align:left;table-layout:fixed;width:100%;max-height:100%;border-radius:var(--border-radius-md);border-collapse:collapse;border-spacing:0}table.hasFooter[data-v-26488faf]{border-bottom-left-radius:0;border-bottom-right-radius:0;border-bottom:none}table td[data-v-26488faf],table th[data-v-26488faf]{line-height:normal;padding:0 var(--spacing-200)}table td[data-v-26488faf]:first-of-type,table th[data-v-26488faf]:first-of-type{padding-left:var(--spacing-300)}table td[data-v-26488faf]:last-of-type,table th[data-v-26488faf]:last-of-type{padding-right:var(--spacing-300)}table td.expand-toggle-cell[data-v-26488faf],table th.expand-toggle-cell[data-v-26488faf]{padding-left:var(--spacing-150);padding-right:var(--spacing-75)}table>thead[data-v-26488faf]{border-bottom:none;z-index:calc(var(--7552e08c) + 1);display:inline-table;min-width:100%}table>thead>tr[data-v-26488faf]{color:var(--text-primary);border-bottom:1px solid var(--common-divider);height:var(--spacing-500);display:grid;grid-template-columns:var(--b761a3b2)}table>thead>tr>th[data-v-26488faf]{background:var(--background-paper-elevation-0);width:100%;display:flex;align-items:center;cursor:default}table>thead>tr>th.bordered[data-v-26488faf]{border-right:1px solid var(--common-divider)}table>thead>tr>th.bordered.isStickyRight[data-v-26488faf]{border-right:none;border-left:1px solid var(--common-divider)}table>thead>tr>th.isTextRight[data-v-26488faf]{justify-content:flex-end}table>thead>tr>th.isSortable[data-v-26488faf]{cursor:pointer}table>thead.sticky[data-v-26488faf]{position:sticky;top:0;background:white}table>thead.isStickyHeader[data-v-26488faf]{z-index:calc(var(--7552e08c) + 2);top:calc(var(--spacing-800) - 1px)}table>tbody[data-v-26488faf]{display:block}table>tbody>*>tr[data-v-26488faf]{background-color:var(--background-default);min-height:var(--79122e22);height:auto;display:grid;align-items:center;grid-template-columns:var(--b761a3b2)}table>tbody>*>tr:nth-of-type(2n)>td[data-v-26488faf]{background-color:var(--background-default)}table>tbody>*>tr:hover:not(.loading)>td[data-v-26488faf],table>tbody>*>tr.activeMenu>td[data-v-26488faf]{background-color:var(--background-paper-elevation-1)}table>tbody td[data-v-26488faf]{background-color:var(--background-default);border:none;min-width:0;display:flex;min-height:var(--79122e22);height:auto;width:100%;place-items:center;border-bottom:1px solid var(--common-divider);justify-content:start}table>tbody td.bordered[data-v-26488faf]{border-right:1px solid var(--common-divider)}table>tbody td.bordered.isStickyRight[data-v-26488faf]{border-right:none;border-left:1px solid var(--common-divider)}table>tbody td.isTextRight[data-v-26488faf]{justify-content:flex-end;text-align:right}.section-container[data-v-26488faf]{left:0}.sections[data-v-26488faf]{display:flex}.section[data-v-26488faf]{padding:0 1.5rem;background:var(--background-default);left:0;height:32px;display:flex;align-items:flex-end;border-right:1px solid var(--common-divider)}.table-cell[data-v-26488faf]{width:100%}.empty-state[data-v-26488faf]{min-height:250px}.floating-row[data-v-26488faf]{display:flex;inset:0;pointer-events:none;position:absolute;z-index:calc(var(--7552e08c) + 1)}.floating-row *[data-v-26488faf-s]{pointer-events:auto}

package/DropdownV4.vue_vue_type_style_index_0_scoped_75002075_lang.css

@@ -0,0 +1 @@
+.v-enter-active[data-v-75002075],.v-leave-active[data-v-75002075]{transition:opacity .25s ease}ol[data-v-75002075],ul[data-v-75002075],menu[data-v-75002075]{list-style:none;margin:0;padding:0}.dropdown.full-width[data-v-75002075],.dropdown.full-width .button__container[data-v-75002075]{width:100%}.dropdown-list-wrapper[data-v-75002075]{display:flex;flex-direction:column;padding:.5rem .5rem .25rem}.dropdown-list-wrapper--multi[data-v-75002075]{padding:.5rem}.list-container--multi[data-v-75002075]{margin-bottom:0}.inline-search .inline-search-wrapper[data-v-75002075]{display:flex;gap:4px;padding-bottom:.25rem}.inline-search .inline-search-wrapper .search-container[data-v-75002075]{width:100%}.inline-search .list-container[data-v-75002075]{padding-top:0}.no-result-container[data-v-75002075]{height:100%;display:flex;align-items:center;padding:.375rem .5rem;color:var(--text-disabled)}.no-result[data-v-75002075]{color:var(--text-disabled);padding-left:.5rem}.list[data-v-75002075]{outline:none;display:flex;flex-direction:column;width:100%;min-height:2rem}.list--multi[data-v-75002075]{margin-bottom:.5rem;border-bottom-left-radius:0;border-bottom-right-radius:0}.list--with-conditions[data-v-75002075]{min-height:0;margin-bottom:0}.image-slot[data-v-75002075]{margin-right:.5rem}.actions-wrapper[data-v-75002075]{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-75002075]{margin-left:.5rem}

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

@@ -1,17 +1,17 @@
 import { useToggle as _e } from "../../../composables/useToggle.js";
 import { inject as Ve, ref as r, computed as c, watch as b, useSlots as ke, toRaw as P, nextTick as K, provide as Ge, onMounted as Le } from "vue";
 import { isObjectInArray as ae } from "../../../utils/array.js";
-import { objectsEqual as Be } from "../../../utils/object.js";
-import { useClamp as He, useVirtualList as Ue, onClickOutside as ne, useInfiniteScroll as qe } from "@vueuse/core";
+import { objectsEqual as Ue } from "../../../utils/object.js";
+import { useClamp as Be, useVirtualList as He, onClickOutside as ne, useInfiniteScroll as qe } from "@vueuse/core";
 import { Mode as T, Type as L, DropdownContext as Xe } from "./DropdownContext.js";
 import { pxToRem as $e } from "../../../utils/style.js";
 import { useEditableContext as je } from "../../table-cells/common/EditableContext.js";
 import { useGroupedOptions as ze } from "./useGroupedOptions.js";
-const tl = (l, f, g) => {
-  const B = Ve("isTreeDropdown", !1), {
-    sortOutGroups: H,
+const tl = (l, v, g) => {
+  const U = Ve("isTreeDropdown", !1), {
+    sortOutGroups: B,
     flattenAndMarkGroupOptions: ue,
-    isGroup: U,
+    isGroup: H,
     selectAllWithGroups: ie,
     isIndeterminateGrouped: re,
     allSelectedGrouped: q,
@@ -30,7 +30,7 @@ const tl = (l, f, g) => {
       return R?.value?.value ?? a.value;
     },
     set(e) {
-      R.onChange?.(e), R.onClose?.(), f("update:selected", e);
+      R.onChange?.(e), R.onClose?.(), v("update:selected", e);
     }
   });
   b(
@@ -56,9 +56,9 @@ const tl = (l, f, g) => {
       return l.isOpen;
     },
     set(e) {
-      f("update:isOpen", e);
+      v("update:isOpen", e);
     }
-  }), Oe = c(() => o.value.length - 1), v = He(0, 0, Oe), Z = c(() => n.value ? l.displayValue(n.value) : ""), Se = (e) => {
+  }), Oe = c(() => o.value.length - 1), f = Be(0, 0, Oe), Z = c(() => n.value ? l.displayValue(n.value) : ""), Se = (e) => {
     if (!e.value.length && !l.multiOptionsPlaceholderPrefix && !l.multiOptionsPlaceholderSuffix)
       return l.placeholder;
     const t = !l.multiOptionsPlaceholderPrefix && !l.multiOptionsPlaceholderSuffix ? `${e.value.length} selected` : `${l.multiOptionsPlaceholderPrefix ?? ""}${e.value.length ?? "0"}${l.multiOptionsPlaceholderSuffix ?? ""}`;
@@ -92,13 +92,13 @@ const tl = (l, f, g) => {
       ) > -1 : d.value.includes(i)) ? "selected" : "notSelected";
       e[u].push(i);
     });
-    const t = l.groupedOptions ? H(e.notSelected) : e.notSelected;
+    const t = l.groupedOptions ? B(e.notSelected) : e.notSelected;
     return [].concat(e.selected, t);
   }), o = c(() => {
-    const e = Array.isArray(d.value) && l.multi && g.VERSION === 4 && !B ? be.value : N.value;
+    const e = Array.isArray(d.value) && l.multi && g.VERSION === 4 && !U ? be.value : N.value;
     if (l.onSearch) {
-      const t = e.filter((i) => l.groupedOptions && U(i) ? i : l.onSearch(i, h.value));
-      return l.groupedOptions ? H(t) : t;
+      const t = e.filter((i) => l.groupedOptions && H(i) ? i : l.onSearch(i, h.value));
+      return l.groupedOptions ? B(t) : t;
     } else
       return e;
   }), Pe = c(() => y.value[0]?.hasSubtitle), F = c(() => s.mode === T.Multi), p = c(
@@ -108,7 +108,7 @@ const tl = (l, f, g) => {
     containerProps: V,
     wrapperProps: Te,
     scrollTo: C
-  } = Ue(o, {
+  } = He(o, {
     itemHeight: p.value,
     overscan: l.disableVirtualScroll ? 1 / 0 : 2
   });
@@ -120,20 +120,20 @@ const tl = (l, f, g) => {
   ), b([x], async () => {
     await K();
   }), b(
-    [O, v, x],
+    [O, f, x],
     async ([e], [t]) => {
       O.value && (await K(), x.value !== -1 && e !== t && setTimeout(() => {
         l.multi && g.VERSION === 4 || C(x.value);
-      }), v.value && setTimeout(() => {
-        C(v.value);
+      }), f.value && setTimeout(() => {
+        C(f.value);
       }));
     }
   ), b(h, () => {
-    f("onsearch", h.value), C(0);
+    v("onsearch", h.value), C(0);
   });
   const A = (e, t = !1) => {
     l.disabled || (Y(e), K(() => {
-      O.value && f("opened"), O.value || f("closed"), w.value && t && w.value.focus();
+      O.value && v("opened"), O.value || v("closed"), w.value && t && w.value.focus();
     }));
   };
   b(O, (e) => {
@@ -158,12 +158,12 @@ const tl = (l, f, g) => {
         }
         a.value = o.value;
       }
-      f("selectAll");
+      v("selectAll");
     }
   }, Ie = () => {
     we(), g.VERSION !== 4 && (n.value = a.value);
   }, xe = (e = !0) => {
-    a.value = [], e && (n.value = [], d.value = []), f("clear");
+    a.value = [], e && (n.value = [], d.value = []), v("clear");
   }, k = (e, t) => {
     if (e = P(e), g.VERSION === 4 ? e[l.disabledOptionKey] : y.value[t]?.disabled)
       return;
@@ -181,14 +181,14 @@ const tl = (l, f, g) => {
     if (ae(S, e) || l.comparingKey && S.findIndex(
       (u) => u[l.comparingKey] === e[l.comparingKey]
     ) > -1) {
-      a.value = S.filter((u) => l.comparingKey ? u[l.comparingKey] !== e[l.comparingKey] : !Be(u, e));
+      a.value = S.filter((u) => l.comparingKey ? u[l.comparingKey] !== e[l.comparingKey] : !Ue(u, e));
       return;
     } else {
       a.value = [...S, e];
       return;
     }
   }, De = (e) => y.value[e]?.disabled, s = {
-    activeIndex: v,
+    activeIndex: f,
     options: y,
     selectedOption: n,
     labelRef: j,
@@ -213,17 +213,17 @@ const tl = (l, f, g) => {
     goToOption: async (e) => {
       if (!O.value)
         return;
-      let t = v.value + e;
+      let t = f.value + e;
       const i = y.value.filter(
         (u) => u.disabled
       ).length, S = o.value.length - i;
       for (t > S && (t = S + 1); ; ) {
         if (!y.value[t]?.disabled) {
-          E.value = o.value[t], v.value = t;
+          E.value = o.value[t], f.value = t;
           return;
         }
-        if ((e === 1 || e === 10) && (t = t + 1), (e === -1 || e === -10) && (t = t + -1), !!De(v.value)) {
-          E.value = o.value[t], v.value = t;
+        if ((e === 1 || e === 10) && (t = t + 1), (e === -1 || e === -10) && (t = t + -1), !!De(f.value)) {
+          E.value = o.value[t], f.value = t;
           return;
         }
       }
@@ -260,13 +260,13 @@ const tl = (l, f, g) => {
   Le(async () => {
     l.autoFocus && (await K(), setTimeout(() => {
       $.value.focus();
-    })), s.goToOption(0), l.multi && !B && (l.groupedOptions ? D.value = q(
+    })), s.goToOption(0), l.multi && !U && (l.groupedOptions ? D.value = q(
       o,
       a
     ) : D.value = l.options.length === l.selected.length);
   });
   const le = () => {
-    l.multi && (D.value = M.value, n.value = a.value, Array.isArray(n.value) && (d.value = P(n.value).slice())), f("apply", n.value), f("allSelectedChanged", M.value), A(!1), Me();
+    l.multi && (D.value = M.value, n.value = a.value, Array.isArray(n.value) && (d.value = P(n.value).slice())), v("apply", n.value), v("allSelectedChanged", M.value), A(!1), Me();
   }, te = () => {
     F.value && Array.isArray(d.value) && (n.value = P(d.value).slice()), h.value = "", A(!1);
   }, Ne = (e) => {
@@ -318,7 +318,7 @@ const tl = (l, f, g) => {
             A(!0);
             return;
           }
-          k(o.value[v.value], v.value), s.mode === T.Single && !l.keepOpen && A(!1), e.preventDefault();
+          k(o.value[f.value], f.value), s.mode === T.Single && !l.keepOpen && A(!1), e.preventDefault();
           break;
         }
       }
@@ -337,10 +337,12 @@ const tl = (l, f, g) => {
   return qe(
     V.ref,
     () => {
-      !l.loadMoreLoading && l.infiniteLoading && f("loadMore");
+      !l.loadMoreLoading && l.infiniteLoading && v("loadMore");
     },
     { distance: l.infiniteScrollThreshold }
-  ), {
+  ), b(a, () => {
+    v("unsavedSelectionUpdate", a.value);
+  }), {
     onKeydown: Ce,
     location: fe,
     open: O,
@@ -363,7 +365,7 @@ const tl = (l, f, g) => {
     selectedOptionPrevious: d,
     selectedValue: Z,
     onSelect: k,
-    activeIndex: v,
+    activeIndex: f,
     onCancel: te,
     onApply: le,
     scrollTo: C,
@@ -376,7 +378,7 @@ const tl = (l, f, g) => {
     triggerRef: de,
     clearAll: J,
     onClearAllSelections: xe,
-    isGroup: U
+    isGroup: H
   };
 };
 export {

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_039dd922_lang.css"; //*');
-const d = /* @__PURE__ */ e(o, [["__scopeId", "data-v-039dd922"]]);
+// import "../../../ChipDropdownTrigger.vue_vue_type_style_index_0_scoped_e43ac1c9_lang.css"; //*');
+const c = /* @__PURE__ */ e(o, [["__scopeId", "data-v-e43ac1c9"]]);
 export {
-  d as default
+  c as default
 };

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

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

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

@@ -17,6 +17,10 @@ declare const _default: import("vue").DefineComponent<__VLS_WithDefaults<__VLS_T
     searchQuery?: string;
     loadMoreFn?: () => Promise<void>;
     infiniteLoading?: boolean;
+    fetchDataDebounceTime?: number;
+    autoFocusSearch?: boolean;
+    groupedOptions?: boolean;
+    optionFlagKey?: string;
 }>, {
     label: string;
     testId: string;
@@ -27,6 +31,10 @@ declare const _default: import("vue").DefineComponent<__VLS_WithDefaults<__VLS_T
     searchQuery: string;
     loadMoreFn: any;
     infiniteLoading: boolean;
+    fetchDataDebounceTime: number;
+    autoFocusSearch: boolean;
+    groupedOptions: boolean;
+    optionFlagKey: string;
 }>, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
     "update:selectedCondition": (value: SelectedCondition) => void;
     "update:appliedSelections": (value: unknown) => void;
@@ -45,6 +53,10 @@ declare const _default: import("vue").DefineComponent<__VLS_WithDefaults<__VLS_T
     searchQuery?: string;
     loadMoreFn?: () => Promise<void>;
     infiniteLoading?: boolean;
+    fetchDataDebounceTime?: number;
+    autoFocusSearch?: boolean;
+    groupedOptions?: boolean;
+    optionFlagKey?: string;
 }>, {
     label: string;
     testId: string;
@@ -55,6 +67,10 @@ declare const _default: import("vue").DefineComponent<__VLS_WithDefaults<__VLS_T
     searchQuery: string;
     loadMoreFn: any;
     infiniteLoading: boolean;
+    fetchDataDebounceTime: number;
+    autoFocusSearch: boolean;
+    groupedOptions: boolean;
+    optionFlagKey: string;
 }>>> & {
     onClear?: () => any;
     "onUpdate:selectedCondition"?: (value: SelectedCondition) => any;
@@ -65,10 +81,14 @@ declare const _default: import("vue").DefineComponent<__VLS_WithDefaults<__VLS_T
     isOpen: boolean;
     infiniteLoading: boolean;
     optionNameKey: string;
+    optionFlagKey: string;
+    groupedOptions: boolean;
     comparingKey: string;
     minCharsToStart: number;
     searchQuery: string;
     loadMoreFn: () => Promise<void>;
+    fetchDataDebounceTime: number;
+    autoFocusSearch: boolean;
 }>;
 export default _default;
 type __VLS_NonUndefinedable<T> = T extends undefined ? never : T;

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

@@ -1,7 +1,7 @@
 import o from "./ConditionalDropdown.vue2.js";
-/* empty css                          */import e from "../../../_virtual/_plugin-vue_export-helper.js";
-// import "../../../ConditionalDropdown.vue_vue_type_style_index_0_scoped_2aee12ad_lang.css"; //*');
-const d = /* @__PURE__ */ e(o, [["__scopeId", "data-v-2aee12ad"]]);
+/* empty css                          */import _ from "../../../_virtual/_plugin-vue_export-helper.js";
+// import "../../../ConditionalDropdown.vue_vue_type_style_index_0_scoped_8f96cf5a_lang.css"; //*');
+const n = /* @__PURE__ */ _(o, [["__scopeId", "data-v-8f96cf5a"]]);
 export {
-  d as default
+  n as default
 };