@ironsource/shared-ui 2.1.12-test.1 → 2.1.12-test.3

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

@@ -1,4 +1,4 @@
- import "../../../DropdownV4.vue_vue_type_style_index_0_scoped_dd86e387_lang.css";  import "../../../DropdownV4.vue_vue_type_style_index_1_lang.css";  import { defineComponent as we, computed as E, watch as he, toRaw as I, openBlock as a, createElementBlock as d, mergeProps as y, unref as o, renderSlot as u, createElementVNode as m, createVNode as i, withCtx as r, Transition as be, normalizeClass as B, normalizeStyle as Ie, createTextVNode as T, createCommentVNode as s, isRef as ve, toDisplayString as q, withModifiers as j, Fragment as Se, renderList as Ce, createSlots as Ke, createBlock as F, resolveDynamicComponent as Ae } from "vue";
+ import "../../../DropdownV4.vue_vue_type_style_index_0_scoped_55dd36a7_lang.css";  import "../../../DropdownV4.vue_vue_type_style_index_1_lang.css";  import { defineComponent as he, computed as E, watch as we, toRaw as I, openBlock as a, createElementBlock as d, mergeProps as y, unref as o, renderSlot as u, createElementVNode as m, createVNode as n, withCtx as r, Transition as be, normalizeClass as B, normalizeStyle as Ie, createTextVNode as T, createCommentVNode as s, isRef as ve, toDisplayString as q, withModifiers as j, Fragment as Se, renderList as Ce, createSlots as Ke, createBlock as F, resolveDynamicComponent as Ae } from "vue";
 import N from "../../button/v4/ButtonV4.vue.js";
 import "../../button/v4/IconButtonV4.vue.js";
 import "../../button/v4/ButtonGroup.vue.js";
@@ -20,7 +20,7 @@ import { DropdownTestIdModifiers as f } from "../../../testids/index.js";
 import { dropdownCommon as Ve } from "../common/Dropdown.common.js";
 import C from "../../skeleton/v4/SkeletonV4.vue.js";
 import { useTestIdAttrs as De } from "../../../utils/testIds.js";
-import { TRIGGERS as w } from "./Dropdown.types.js";
+import { TRIGGERS as h } from "./Dropdown.types.js";
 import { useElementSize as Pe } from "@vueuse/core";
 import $e from "../../shared/FieldHelpText.vue.js";
 import Me from "./GroupOption.vue.js";
@@ -36,7 +36,7 @@ const Re = ["tabindex"], ze = { style: { width: "100%" } }, We = { key: 0 }, Ge
 }, Je = {
   key: 1,
   class: "actions-wrapper"
-}, Qe = { class: "actions-clear-all" }, Ze = { class: "actions-apply-cancel" }, _e = 4, Ko = /* @__PURE__ */ we({
+}, Qe = { class: "actions-clear-all" }, Ze = { class: "actions-apply-cancel" }, _e = 4, Ko = /* @__PURE__ */ he({
   __name: "DropdownV4",
   props: {
     modelValue: { default: null },
@@ -75,7 +75,7 @@ const Re = ["tabindex"], ze = { style: { width: "100%" } }, We = { key: 0 }, Ge
     triggerShownValuesCount: { default: 1 },
     size: { default: "medium" },
     mandatory: { type: Boolean, default: !1 },
-    predefinedTrigger: { default: w.DEFAULT },
+    predefinedTrigger: { default: h.DEFAULT },
     inlineSearch: { type: Boolean, default: !1 },
     inlineSearchPlaceholder: { default: "Search" },
     onSearch: { type: Function, default: null },
@@ -99,6 +99,7 @@ const Re = ["tabindex"], ze = { style: { width: "100%" } }, We = { key: 0 }, Ge
     groupedOptions: { type: Boolean, default: !1 },
     comparingKey: { default: null },
     customNumberOfDisplayedOptions: { default: null },
+    optionTooltipPosition: { default: "right" },
     theme: { default: "light-theme-v4" },
     fullWidth: { type: Boolean, default: !0 },
     optionsListWidth: { default: null },
@@ -125,11 +126,11 @@ const Re = ["tabindex"], ze = { style: { width: "100%" } }, We = { key: 0 }, Ge
       containerProps: ee,
       calculateTableHeight: oe,
       wrapperProps: te,
-      filteredOptions: ne,
+      filteredOptions: ie,
       allSelected: $,
       allSelectedApplied: K,
       isIndeterminate: le,
-      onSelectAll: ie,
+      onSelectAll: ne,
       virtualOptions: M,
       isSelected: A,
       selectedOption: c,
@@ -149,8 +150,8 @@ const Re = ["tabindex"], ze = { style: { width: "100%" } }, We = { key: 0 }, Ge
       clearAll: fe,
       isGroup: ge,
       flattenAndMarkGroupOptions: ce
-    } = Ve(t, V, D), g = De(t.testId, f), H = E(() => !t.predefinedTrigger || t.predefinedTrigger === w.DEFAULT ? Oe : t.predefinedTrigger === w.APP ? Be : null), { width: U } = Pe(W), ke = E(() => t.optionsListWidth ? t.optionsListWidth : !t.predefinedTrigger || t.predefinedTrigger === w.DEFAULT || t.predefinedTrigger === w.APP ? U.value - 2 > 240 ? `${U.value - 2}px` : `${D.DROPLIST_MIN_WIDTH}px` : "auto");
-    he(
+    } = Ve(t, V, D), g = De(t.testId, f), H = E(() => !t.predefinedTrigger || t.predefinedTrigger === h.DEFAULT ? Oe : t.predefinedTrigger === h.APP ? Be : null), { width: U } = Pe(W), ke = E(() => t.optionsListWidth ? t.optionsListWidth : !t.predefinedTrigger || t.predefinedTrigger === h.DEFAULT || t.predefinedTrigger === h.APP ? U.value - 2 > 240 ? `${U.value - 2}px` : `${D.DROPLIST_MIN_WIDTH}px` : "auto");
+    we(
       () => t.optionsListWidth,
       () => {
         t.optionsListWidth && document.documentElement.style.setProperty(
@@ -167,19 +168,19 @@ const Re = ["tabindex"], ze = { style: { width: "100%" } }, We = { key: 0 }, Ge
         selections: []
       };
       if (t.multi && t.comparingKey) {
-        const n = I(c.value);
+        const i = I(c.value);
         if (t.minSelections || t.maxSelections) {
-          if (Array.isArray(n) && n.length <= t.minSelections)
-            return e.tooltipMessage = `You need to select at least ${t.minSelections} item${t.minSelections > 1 ? "s" : ""}`, e.selections = n.map(
+          if (Array.isArray(i) && i.length <= t.minSelections)
+            return e.tooltipMessage = `You need to select at least ${t.minSelections} item${t.minSelections > 1 ? "s" : ""}`, e.selections = i.map(
               (l) => l[t.comparingKey]
             ), e;
-          if (t.maxSelections && Array.isArray(n) && n.length >= t.maxSelections) {
-            const l = n.map(
-              (h) => h[t.comparingKey]
+          if (t.maxSelections && Array.isArray(i) && i.length >= t.maxSelections) {
+            const l = i.map(
+              (w) => w[t.comparingKey]
             ), k = t.groupedOptions ? ce(t.options) : t.options;
-            return e.tooltipMessage = `You can only select up to ${t.maxSelections} items`, e.selections = k.map((h) => {
-              if (!l.includes(h[t.comparingKey]))
-                return h[t.comparingKey];
+            return e.tooltipMessage = `You can only select up to ${t.maxSelections} items`, e.selections = k.map((w) => {
+              if (!l.includes(w[t.comparingKey]))
+                return w[t.comparingKey];
             }), e;
           }
         }
@@ -194,18 +195,18 @@ const Re = ["tabindex"], ze = { style: { width: "100%" } }, We = { key: 0 }, Ge
     return _({
       selectItem: R,
       scrollTo: re
-    }), (e, n) => (a(), d("div", y({
+    }), (e, i) => (a(), d("div", y({
       ref_key: "el",
       ref: me,
       class: ["dropdown dropdown--main-wrapper", [{ "dropdown--disabled": e.disabled, "full-width": e.fullWidth }]],
       tabindex: e.disabled ? -1 : 0
     }, o(g)[o(f).WRAPPER], {
-      onKeydown: n[8] || (n[8] = //@ts-ignore
+      onKeydown: i[8] || (i[8] = //@ts-ignore
       (...l) => o(b) && o(b)(...l))
     }), [
       u(e.$slots, "label", {}, void 0, !0),
       m("div", ze, [
-        i(o(Ne), y({
+        n(o(Ne), y({
           theme: e.theme,
           "popper-class": [
             e.popperClass,
@@ -224,7 +225,7 @@ const Re = ["tabindex"], ze = { style: { width: "100%" } }, We = { key: 0 }, Ge
           "auto-size": e.autoSize
         }, o(g)[o(f).TRIGGER]), {
           popper: r(() => [
-            i(be, null, {
+            n(be, null, {
               default: r(() => [
                 o(p) ? (a(), d("div", {
                   key: 0,
@@ -239,14 +240,14 @@ const Re = ["tabindex"], ze = { style: { width: "100%" } }, We = { key: 0 }, Ge
                   o(p) ? (a(), d("div", {
                     key: 0,
                     class: B(["dropdown-list-wrapper", { "dropdown-list-wrapper--multi": e.multi }]),
-                    onKeydown: n[7] || (n[7] = //@ts-ignore
+                    onKeydown: i[7] || (i[7] = //@ts-ignore
                     (...l) => o(b) && o(b)(...l))
                   }, [
                     o(p) && e.inlineSearch ? (a(), d("div", Ue, [
                       e.withConditions ? u(e.$slots, "dropdown-conditions", { key: 0 }, () => [
                         m("div", Ye, [
-                          i(o(Q), { variant: "body2" }, {
-                            default: r(() => n[9] || (n[9] = [
+                          n(o(Q), { variant: "body2" }, {
+                            default: r(() => i[9] || (i[9] = [
                               T("Conditions")
                             ])),
                             _: 1
@@ -254,10 +255,10 @@ const Re = ["tabindex"], ze = { style: { width: "100%" } }, We = { key: 0 }, Ge
                         ])
                       ], !0) : s("", !0),
                       u(e.$slots, "inline-search", {}, () => [
-                        i(o(Fe), {
+                        n(o(Fe), {
                           modelValue: o(S),
                           "onUpdate:modelValue": [
-                            n[4] || (n[4] = (l) => ve(S) ? S.value = l : null),
+                            i[4] || (i[4] = (l) => ve(S) ? S.value = l : null),
                             e.onClearSearch
                           ],
                           placeholder: e.inlineSearchPlaceholder,
@@ -285,8 +286,8 @@ const Re = ["tabindex"], ze = { style: { width: "100%" } }, We = { key: 0 }, Ge
                           "list--with-conditions": e.withConditions
                         }]
                       }), [
-                        !o(ne).length && !e.loading && !e.withConditions ? (a(), d("li", Xe, [
-                          i(o(Q), y({ variant: "body2" }, o(g)[o(f).NO_RESULT]), {
+                        !o(ie).length && !e.loading && !e.withConditions ? (a(), d("li", Xe, [
+                          n(o(Q), y({ variant: "body2" }, o(g)[o(f).NO_RESULT]), {
                             default: r(() => [
                               T(q(e.noResultsText), 1)
                             ]),
@@ -295,7 +296,7 @@ const Re = ["tabindex"], ze = { style: { width: "100%" } }, We = { key: 0 }, Ge
                         ])) : s("", !0),
                         e.showSelectAll !== !1 && e.multi && !o(S) && !e.loading && e.options.length && !(e.minSelections || e.maxSelections) ? u(e.$slots, "select-all", { key: 1 }, () => [
                           m("li", null, [
-                            i(o(J), y(
+                            n(o(J), y(
                               {
                                 "aria-selected": o($),
                                 "aria-disabled": !!e.disabled,
@@ -306,10 +307,10 @@ const Re = ["tabindex"], ze = { style: { width: "100%" } }, We = { key: 0 }, Ge
                               },
                               o(g)[o(f).SELECT_ALL],
                               {
-                                onClick: n[5] || (n[5] = j((l) => o(ie)(), ["stop"]))
+                                onClick: i[5] || (i[5] = j((l) => o(ne)(), ["stop"]))
                               }
                             ), {
-                              default: r(() => n[10] || (n[10] = [
+                              default: r(() => i[10] || (i[10] = [
                                 T(" Select all ")
                               ])),
                               _: 1
@@ -326,7 +327,7 @@ const Re = ["tabindex"], ze = { style: { width: "100%" } }, We = { key: 0 }, Ge
                           )
                         }, [
                           e.groupedOptions && o(ge)(l) ? u(e.$slots, "group-option", { key: 0 }, () => [
-                            i(Me, null, {
+                            n(Me, null, {
                               default: r(() => [
                                 T(q(e.displayValue(l) || l[e.optionNameKey]), 1)
                               ]),
@@ -340,7 +341,7 @@ const Re = ["tabindex"], ze = { style: { width: "100%" } }, We = { key: 0 }, Ge
                             active: I(o(z)) === k,
                             disabled: L(l)
                           }, () => [
-                            i(o(J), {
+                            n(o(J), {
                               option: l,
                               "selected-prop": o(A)(o(c), l),
                               active: I(o(z)) === k,
@@ -356,24 +357,25 @@ const Re = ["tabindex"], ze = { style: { width: "100%" } }, We = { key: 0 }, Ge
                               "warning-key": e.optionWarningKey,
                               "option-two-lines-variant": e.optionTwoLinesVariant,
                               "option-two-lines-key": e.optionTwoLinesKey,
+                              "tooltip-placement": e.optionTooltipPosition,
                               "is-multi": e.multi,
                               "min-max-selection-tooltip-message": X.value?.tooltipMessage
                             }, Ke({ _: 2 }, [
                               e.$slots["option-end"] ? {
                                 name: "option-end",
-                                fn: r(({ option: h }) => [
-                                  u(e.$slots, "option-end", { option: h }, void 0, !0)
+                                fn: r(({ option: w }) => [
+                                  u(e.$slots, "option-end", { option: w }, void 0, !0)
                                 ]),
                                 key: "0"
                               } : void 0
-                            ]), 1032, ["option", "selected-prop", "active", "disabled", "name-key", "image-key", "icon-key", "icon-type", "end-icon-key", "end-icon-type", "end-text-icon-key", "option-flag-key", "warning-key", "option-two-lines-variant", "option-two-lines-key", "is-multi", "min-max-selection-tooltip-message"])
+                            ]), 1032, ["option", "selected-prop", "active", "disabled", "name-key", "image-key", "icon-key", "icon-type", "end-icon-key", "end-icon-type", "end-text-icon-key", "option-flag-key", "warning-key", "option-two-lines-variant", "option-two-lines-key", "tooltip-placement", "is-multi", "min-max-selection-tooltip-message"])
                           ], !0)
                         ], 8, qe))), 128)) : s("", !0),
                         e.loading || e.loadMoreLoading ? (a(), d("li", je, [
-                          i(o(C), { round: "" }),
-                          i(o(C), { round: "" }),
-                          i(o(C), { round: "" }),
-                          i(o(C), { round: "" })
+                          n(o(C), { round: "" }),
+                          n(o(C), { round: "" }),
+                          n(o(C), { round: "" }),
+                          n(o(C), { round: "" })
                         ])) : s("", !0)
                       ], 16)
                     ], 16),
@@ -390,17 +392,17 @@ const Re = ["tabindex"], ze = { style: { width: "100%" } }, We = { key: 0 }, Ge
                           },
                           o(g)[o(f).ACTION_CLEAR_ALL],
                           {
-                            onClick: n[6] || (n[6] = () => o(G)(!1))
+                            onClick: i[6] || (i[6] = () => o(G)(!1))
                           }
                         ), {
-                          default: r(() => n[11] || (n[11] = [
+                          default: r(() => i[11] || (i[11] = [
                             T(" Clear all ")
                           ])),
                           _: 1
                         }, 16)) : s("", !0)
                       ]),
                       m("div", Ze, [
-                        i(o(N), y(
+                        n(o(N), y(
                           {
                             ref_key: "cancel",
                             ref: ye,
@@ -411,19 +413,19 @@ const Re = ["tabindex"], ze = { style: { width: "100%" } }, We = { key: 0 }, Ge
                           o(g)[o(f).ACTION_CANCEL],
                           { onClick: o(se) }
                         ), {
-                          default: r(() => n[12] || (n[12] = [
+                          default: r(() => i[12] || (i[12] = [
                             T(" Cancel ")
                           ])),
                           _: 1
                         }, 16, ["onClick"]),
-                        i(o(N), y({
+                        n(o(N), y({
                           ref_key: "apply",
                           ref: ue,
                           "data-testid": "mutli-apply",
                           size: "small",
                           class: "apply-button"
                         }, o(g)[o(f).ACTION_APPLY], { onClick: o(de) }), {
-                          default: r(() => n[13] || (n[13] = [
+                          default: r(() => i[13] || (i[13] = [
                             T(" Apply ")
                           ])),
                           _: 1
@@ -514,16 +516,16 @@ const Re = ["tabindex"], ze = { style: { width: "100%" } }, We = { key: 0 }, Ge
                       "all-selected": o(K),
                       onKeydown: o(P),
                       onClick: Y,
-                      onCopyToClipboard: n[0] || (n[0] = (l) => V("copyToClipboard"))
+                      onCopyToClipboard: i[0] || (i[0] = (l) => V("copyToClipboard"))
                     }, null, 40, ["placeholder", "open", "label", "show-feedback-icon", "mandatory", "test-id", "multi", "disabled", "selected-option", "display-value", "options", "option-name-key", "option-image-key", "option-icon-key", "option-icon-type", "option-end-icon-key", "option-end-icon-type", "options-end-text-icon-key", "option-flag-key", "feedback-variant", "value-to-copy", "status-dot-type", "size", "show-all-selected-text", "all-selected", "onKeydown"]))
                   ])) : s("", !0),
-                  e.predefinedTrigger === o(w).ICON_BUTTON ? (a(), d("div", Ge, [
-                    i(o(Le), {
-                      onClick: n[1] || (n[1] = (l) => o(v)())
+                  e.predefinedTrigger === o(h).ICON_BUTTON ? (a(), d("div", Ge, [
+                    n(o(Le), {
+                      onClick: i[1] || (i[1] = (l) => o(v)())
                     })
                   ])) : s("", !0),
-                  e.predefinedTrigger === o(w).CHIP ? (a(), d("div", He, [
-                    i(o(Ee), {
+                  e.predefinedTrigger === o(h).CHIP ? (a(), d("div", He, [
+                    n(o(Ee), {
                       open: o(p),
                       label: e.placeholder,
                       "test-id": e.testId,
@@ -533,8 +535,8 @@ const Re = ["tabindex"], ze = { style: { width: "100%" } }, We = { key: 0 }, Ge
                       multi: e.multi,
                       "all-selected": o(K),
                       "shown-values-count": e.triggerShownValuesCount,
-                      onClick: n[2] || (n[2] = (l) => o(v)()),
-                      onClear: n[3] || (n[3] = (l) => o(G)())
+                      onClick: i[2] || (i[2] = (l) => o(v)()),
+                      onClear: i[3] || (i[3] = (l) => o(G)())
                     }, null, 8, ["open", "label", "test-id", "options", "selected-option", "display-value", "multi", "all-selected", "shown-values-count"])
                   ])) : s("", !0)
                 ], !0)

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

@@ -14,7 +14,7 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<im
     endIconKey?: string;
     endIconType?: "fill" | "bold" | "regular" | "branded" | "ad-unit" | "ab-test" | "ad-networks" | "ad-networks/flat" | "content-rate";
     endTextIconKey?: string;
-    toolTipPlacement?: "top" | "auto" | "auto-start" | "auto-end" | "top-start" | "top-end" | "right" | "right-start" | "right-end" | "bottom" | "bottom-start" | "bottom-end" | "left" | "left-start" | "left-end";
+    tooltipPlacement?: "top" | "auto" | "auto-start" | "auto-end" | "top-start" | "top-end" | "right" | "right-start" | "right-end" | "bottom" | "bottom-start" | "bottom-end" | "left" | "left-start" | "left-end";
     treeMainOption?: boolean;
     treeMainOptionExpanded?: boolean;
     stopOptionClickEventPropagation?: boolean;
@@ -39,7 +39,7 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<im
     endIconKey: any;
     endIconType: string;
     endTextIconKey: any;
-    toolTipPlacement: string;
+    tooltipPlacement: string;
     treeMainOption: boolean;
     treeMainOptionExpanded: boolean;
     stopOptionClickEventPropagation: boolean;
@@ -67,7 +67,7 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<im
     endIconKey?: string;
     endIconType?: "fill" | "bold" | "regular" | "branded" | "ad-unit" | "ab-test" | "ad-networks" | "ad-networks/flat" | "content-rate";
     endTextIconKey?: string;
-    toolTipPlacement?: "top" | "auto" | "auto-start" | "auto-end" | "top-start" | "top-end" | "right" | "right-start" | "right-end" | "bottom" | "bottom-start" | "bottom-end" | "left" | "left-start" | "left-end";
+    tooltipPlacement?: "top" | "auto" | "auto-start" | "auto-end" | "top-start" | "top-end" | "right" | "right-start" | "right-end" | "bottom" | "bottom-start" | "bottom-end" | "left" | "left-start" | "left-end";
     treeMainOption?: boolean;
     treeMainOptionExpanded?: boolean;
     stopOptionClickEventPropagation?: boolean;
@@ -92,7 +92,7 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<im
     endIconKey: any;
     endIconType: string;
     endTextIconKey: any;
-    toolTipPlacement: string;
+    tooltipPlacement: string;
     treeMainOption: boolean;
     treeMainOptionExpanded: boolean;
     stopOptionClickEventPropagation: boolean;
@@ -106,6 +106,7 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<im
     onToggleTreeCollapse?: (option: unknown) => any;
 }>, {
     option: any;
+    tooltipPlacement: "top" | "auto" | "auto-start" | "auto-end" | "top-start" | "top-end" | "right" | "right-start" | "right-end" | "bottom" | "bottom-start" | "bottom-end" | "left" | "left-start" | "left-end";
     disabled: boolean;
     endIconType: "fill" | "bold" | "regular" | "branded" | "ad-unit" | "ab-test" | "ad-networks" | "ad-networks/flat" | "content-rate";
     active: boolean;
@@ -122,7 +123,6 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<im
     iconType: "fill" | "bold" | "regular" | "branded" | "ad-unit" | "ab-test" | "ad-networks" | "ad-networks/flat" | "content-rate";
     endIconKey: string;
     endTextIconKey: string;
-    toolTipPlacement: "top" | "auto" | "auto-start" | "auto-end" | "top-start" | "top-end" | "right" | "right-start" | "right-end" | "bottom" | "bottom-start" | "bottom-end" | "left" | "left-start" | "left-end";
     treeMainOption: boolean;
     treeMainOptionExpanded: boolean;
     stopOptionClickEventPropagation: boolean;

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

@@ -1,7 +1,7 @@
 import o from "./OptionV4.vue2.js";
-/* empty css               */import _ from "../../../_virtual/_plugin-vue_export-helper.js";
-// import "../../../OptionV4.vue_vue_type_style_index_0_scoped_b9724567_lang.css"; //*');
-const s = /* @__PURE__ */ _(o, [["__scopeId", "data-v-b9724567"]]);
+/* empty css               */import e from "../../../_virtual/_plugin-vue_export-helper.js";
+// import "../../../OptionV4.vue_vue_type_style_index_0_scoped_7d287ee5_lang.css"; //*');
+const s = /* @__PURE__ */ e(o, [["__scopeId", "data-v-7d287ee5"]]);
 export {
   s as default
 };

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

@@ -1,4 +1,4 @@
- import "../../../OptionV4.vue_vue_type_style_index_0_scoped_b9724567_lang.css"; import { defineComponent as L, ref as w, watch as N, computed as j, openBlock as t, createBlock as y, unref as o, createSlots as R, withCtx as s, createElementVNode as p, normalizeClass as v, createCommentVNode as n, createElementBlock as i, renderSlot as d, createVNode as a, toDisplayString as u, createTextVNode as f, withModifiers as C, Fragment as D, renderList as q } from "vue";
+ import "../../../OptionV4.vue_vue_type_style_index_0_scoped_7d287ee5_lang.css"; import { defineComponent as L, ref as w, watch as N, computed as j, openBlock as t, createBlock as y, unref as o, createSlots as R, withCtx as s, createElementVNode as p, normalizeClass as v, createCommentVNode as n, createElementBlock as i, renderSlot as d, createVNode as a, toDisplayString as u, createTextVNode as f, withModifiers as C, Fragment as D, renderList as q } from "vue";
 import "../../typography/Heading.vue.js";
 import G from "../../typography/Text.vue.js";
 import H from "../../checkbox/v4/CheckboxV4.vue.js";
@@ -55,7 +55,7 @@ const X = { class: "multiline-tooltip" }, Y = {
     endIconKey: { default: null },
     endIconType: { default: "regular" },
     endTextIconKey: { default: null },
-    toolTipPlacement: { default: "right" },
+    tooltipPlacement: { default: "right" },
     treeMainOption: { type: Boolean, default: !1 },
     treeMainOptionExpanded: { type: Boolean, default: !1 },
     stopOptionClickEventPropagation: { type: Boolean, default: !1 },
@@ -85,7 +85,7 @@ const X = { class: "multiline-tooltip" }, Y = {
     return (e, r) => (t(), y(o(O), {
       text: K.value,
       "test-id": V(e.option),
-      placement: e.toolTipPlacement,
+      placement: e.tooltipPlacement,
       class: "tooltip-option"
     }, R({
       default: s(() => [

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

@@ -830,6 +830,10 @@ declare const DropdownTypes: () => (({
             type: import("vue").PropType<unknown>;
             default: any;
         };
+        tooltipPlacement: {
+            type: import("vue").PropType<"top" | "auto" | "auto-start" | "auto-end" | "top-start" | "top-end" | "right" | "right-start" | "right-end" | "bottom" | "bottom-start" | "bottom-end" | "left" | "left-start" | "left-end">;
+            default: string;
+        };
         disabled: {
             type: import("vue").PropType<boolean>;
             default: boolean;
@@ -894,10 +898,6 @@ declare const DropdownTypes: () => (({
             type: import("vue").PropType<string>;
             default: any;
         };
-        toolTipPlacement: {
-            type: import("vue").PropType<"top" | "auto" | "auto-start" | "auto-end" | "top-start" | "top-end" | "right" | "right-start" | "right-end" | "bottom" | "bottom-start" | "bottom-end" | "left" | "left-start" | "left-end">;
-            default: string;
-        };
         treeMainOption: {
             type: import("vue").PropType<boolean>;
             default: boolean;
@@ -931,6 +931,7 @@ declare const DropdownTypes: () => (({
         toggleTreeCollapse: (option: unknown) => void;
     }, import("vue").PublicProps, {
         option: any;
+        tooltipPlacement: "top" | "auto" | "auto-start" | "auto-end" | "top-start" | "top-end" | "right" | "right-start" | "right-end" | "bottom" | "bottom-start" | "bottom-end" | "left" | "left-start" | "left-end";
         disabled: boolean;
         endIconType: "fill" | "bold" | "regular" | "branded" | "ad-unit" | "ab-test" | "ad-networks" | "ad-networks/flat" | "content-rate";
         active: boolean;
@@ -947,7 +948,6 @@ declare const DropdownTypes: () => (({
         iconType: "fill" | "bold" | "regular" | "branded" | "ad-unit" | "ab-test" | "ad-networks" | "ad-networks/flat" | "content-rate";
         endIconKey: string;
         endTextIconKey: string;
-        toolTipPlacement: "top" | "auto" | "auto-start" | "auto-end" | "top-start" | "top-end" | "right" | "right-start" | "right-end" | "bottom" | "bottom-start" | "bottom-end" | "left" | "left-start" | "left-end";
         treeMainOption: boolean;
         treeMainOptionExpanded: boolean;
         stopOptionClickEventPropagation: boolean;
@@ -966,6 +966,10 @@ declare const DropdownTypes: () => (({
             type: import("vue").PropType<unknown>;
             default: any;
         };
+        tooltipPlacement: {
+            type: import("vue").PropType<"top" | "auto" | "auto-start" | "auto-end" | "top-start" | "top-end" | "right" | "right-start" | "right-end" | "bottom" | "bottom-start" | "bottom-end" | "left" | "left-start" | "left-end">;
+            default: string;
+        };
         disabled: {
             type: import("vue").PropType<boolean>;
             default: boolean;
@@ -1030,10 +1034,6 @@ declare const DropdownTypes: () => (({
             type: import("vue").PropType<string>;
             default: any;
         };
-        toolTipPlacement: {
-            type: import("vue").PropType<"top" | "auto" | "auto-start" | "auto-end" | "top-start" | "top-end" | "right" | "right-start" | "right-end" | "bottom" | "bottom-start" | "bottom-end" | "left" | "left-start" | "left-end">;
-            default: string;
-        };
         treeMainOption: {
             type: import("vue").PropType<boolean>;
             default: boolean;
@@ -1065,6 +1065,7 @@ declare const DropdownTypes: () => (({
         onToggleTreeCollapse?: (option: unknown) => any;
     }>, {}, {}, {}, {}, {
         option: any;
+        tooltipPlacement: "top" | "auto" | "auto-start" | "auto-end" | "top-start" | "top-end" | "right" | "right-start" | "right-end" | "bottom" | "bottom-start" | "bottom-end" | "left" | "left-start" | "left-end";
         disabled: boolean;
         endIconType: "fill" | "bold" | "regular" | "branded" | "ad-unit" | "ab-test" | "ad-networks" | "ad-networks/flat" | "content-rate";
         active: boolean;
@@ -1081,7 +1082,6 @@ declare const DropdownTypes: () => (({
         iconType: "fill" | "bold" | "regular" | "branded" | "ad-unit" | "ab-test" | "ad-networks" | "ad-networks/flat" | "content-rate";
         endIconKey: string;
         endTextIconKey: string;
-        toolTipPlacement: "top" | "auto" | "auto-start" | "auto-end" | "top-start" | "top-end" | "right" | "right-start" | "right-end" | "bottom" | "bottom-start" | "bottom-end" | "left" | "left-start" | "left-end";
         treeMainOption: boolean;
         treeMainOptionExpanded: boolean;
         stopOptionClickEventPropagation: boolean;
@@ -1097,6 +1097,10 @@ declare const DropdownTypes: () => (({
         type: import("vue").PropType<unknown>;
         default: any;
     };
+    tooltipPlacement: {
+        type: import("vue").PropType<"top" | "auto" | "auto-start" | "auto-end" | "top-start" | "top-end" | "right" | "right-start" | "right-end" | "bottom" | "bottom-start" | "bottom-end" | "left" | "left-start" | "left-end">;
+        default: string;
+    };
     disabled: {
         type: import("vue").PropType<boolean>;
         default: boolean;
@@ -1161,10 +1165,6 @@ declare const DropdownTypes: () => (({
         type: import("vue").PropType<string>;
         default: any;
     };
-    toolTipPlacement: {
-        type: import("vue").PropType<"top" | "auto" | "auto-start" | "auto-end" | "top-start" | "top-end" | "right" | "right-start" | "right-end" | "bottom" | "bottom-start" | "bottom-end" | "left" | "left-start" | "left-end">;
-        default: string;
-    };
     treeMainOption: {
         type: import("vue").PropType<boolean>;
         default: boolean;
@@ -1198,6 +1198,7 @@ declare const DropdownTypes: () => (({
     toggleTreeCollapse: (option: unknown) => void;
 }, string, {
     option: any;
+    tooltipPlacement: "top" | "auto" | "auto-start" | "auto-end" | "top-start" | "top-end" | "right" | "right-start" | "right-end" | "bottom" | "bottom-start" | "bottom-end" | "left" | "left-start" | "left-end";
     disabled: boolean;
     endIconType: "fill" | "bold" | "regular" | "branded" | "ad-unit" | "ab-test" | "ad-networks" | "ad-networks/flat" | "content-rate";
     active: boolean;
@@ -1214,7 +1215,6 @@ declare const DropdownTypes: () => (({
     iconType: "fill" | "bold" | "regular" | "branded" | "ad-unit" | "ab-test" | "ad-networks" | "ad-networks/flat" | "content-rate";
     endIconKey: string;
     endTextIconKey: string;
-    toolTipPlacement: "top" | "auto" | "auto-start" | "auto-end" | "top-start" | "top-end" | "right" | "right-start" | "right-end" | "bottom" | "bottom-start" | "bottom-end" | "left" | "left-start" | "left-end";
     treeMainOption: boolean;
     treeMainOptionExpanded: boolean;
     stopOptionClickEventPropagation: boolean;
@@ -1640,6 +1640,10 @@ declare const DropdownTypes: () => (({
             type: import("vue").PropType<number>;
             default: any;
         };
+        optionTooltipPosition: {
+            type: import("vue").PropType<"top" | "auto" | "auto-start" | "auto-end" | "top-start" | "top-end" | "right" | "right-start" | "right-end" | "bottom" | "bottom-start" | "bottom-end" | "left" | "left-start" | "left-end">;
+            default: string;
+        };
         fullWidth: {
             type: import("vue").PropType<boolean>;
             default: boolean;
@@ -1750,6 +1754,7 @@ declare const DropdownTypes: () => (({
         groupedOptions: boolean;
         comparingKey: string;
         customNumberOfDisplayedOptions: number;
+        optionTooltipPosition: "top" | "auto" | "auto-start" | "auto-end" | "top-start" | "top-end" | "right" | "right-start" | "right-end" | "bottom" | "bottom-start" | "bottom-end" | "left" | "left-start" | "left-end";
         fullWidth: boolean;
         optionsListWidth: string;
         statusType: "default" | "error" | "disabled" | "success" | "warning" | "archive";
@@ -2005,6 +2010,10 @@ declare const DropdownTypes: () => (({
             type: import("vue").PropType<number>;
             default: any;
         };
+        optionTooltipPosition: {
+            type: import("vue").PropType<"top" | "auto" | "auto-start" | "auto-end" | "top-start" | "top-end" | "right" | "right-start" | "right-end" | "bottom" | "bottom-start" | "bottom-end" | "left" | "left-start" | "left-end">;
+            default: string;
+        };
         fullWidth: {
             type: import("vue").PropType<boolean>;
             default: boolean;
@@ -2102,6 +2111,7 @@ declare const DropdownTypes: () => (({
         groupedOptions: boolean;
         comparingKey: string;
         customNumberOfDisplayedOptions: number;
+        optionTooltipPosition: "top" | "auto" | "auto-start" | "auto-end" | "top-start" | "top-end" | "right" | "right-start" | "right-end" | "bottom" | "bottom-start" | "bottom-end" | "left" | "left-start" | "left-end";
         fullWidth: boolean;
         optionsListWidth: string;
         statusType: "default" | "error" | "disabled" | "success" | "warning" | "archive";
@@ -2354,6 +2364,10 @@ declare const DropdownTypes: () => (({
         type: import("vue").PropType<number>;
         default: any;
     };
+    optionTooltipPosition: {
+        type: import("vue").PropType<"top" | "auto" | "auto-start" | "auto-end" | "top-start" | "top-end" | "right" | "right-start" | "right-end" | "bottom" | "bottom-start" | "bottom-end" | "left" | "left-start" | "left-end">;
+        default: string;
+    };
     fullWidth: {
         type: import("vue").PropType<boolean>;
         default: boolean;
@@ -2464,6 +2478,7 @@ declare const DropdownTypes: () => (({
     groupedOptions: boolean;
     comparingKey: string;
     customNumberOfDisplayedOptions: number;
+    optionTooltipPosition: "top" | "auto" | "auto-start" | "auto-end" | "top-start" | "top-end" | "right" | "right-start" | "right-end" | "bottom" | "bottom-start" | "bottom-end" | "left" | "left-start" | "left-end";
     fullWidth: boolean;
     optionsListWidth: string;
     statusType: "default" | "error" | "disabled" | "success" | "warning" | "archive";