@ironsource/shared-ui 2.1.12-rc.30 → 2.1.12-rc.31

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

@@ -15,6 +15,7 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<__
     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";
+    tooltipAttachedToText?: boolean;
     treeMainOption?: boolean;
     treeMainOptionExpanded?: boolean;
     stopOptionClickEventPropagation?: boolean;
@@ -30,6 +31,7 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<__
     option: any;
     isIndeterminate: boolean;
     selectAllOption: boolean;
+    tooltipAttachedToText: boolean;
     active: any;
     nameKey: any;
     imageKey: any;
@@ -68,6 +70,7 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<__
     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";
+    tooltipAttachedToText?: boolean;
     treeMainOption?: boolean;
     treeMainOptionExpanded?: boolean;
     stopOptionClickEventPropagation?: boolean;
@@ -83,6 +86,7 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<__
     option: any;
     isIndeterminate: boolean;
     selectAllOption: boolean;
+    tooltipAttachedToText: boolean;
     active: any;
     nameKey: any;
     imageKey: any;
@@ -116,6 +120,7 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<__
     isIndeterminate: boolean;
     subtitle: string;
     selectAllOption: boolean;
+    tooltipAttachedToText: boolean;
     nameKey: string;
     imageKey: string;
     iconKey: string;

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

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

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

@@ -1,13 +1,13 @@
- import "../../../OptionV4.vue_vue_type_style_index_0_scoped_0287cebf_lang.css"; import { defineComponent as A, ref as w, watch as F, computed as L, openBlock as i, createBlock as g, unref as n, createSlots as N, withCtx as d, createElementVNode as u, normalizeClass as v, createCommentVNode as o, createElementBlock as l, renderSlot as r, createVNode as s, toDisplayString as m, createTextVNode as T, withModifiers as C, Fragment as j, renderList as R } from "vue";
+ import "../../../OptionV4.vue_vue_type_style_index_0_scoped_752a357d_lang.css"; import { defineComponent as V, ref as I, watch as F, computed as L, openBlock as i, createBlock as g, unref as n, createSlots as N, withCtx as s, createElementVNode as u, normalizeClass as v, createCommentVNode as o, createElementBlock as l, renderSlot as r, createVNode as a, toDisplayString as m, createTextVNode as T, withModifiers as O, Fragment as j, renderList as R } from "vue";
 import "../../typography/Heading.vue.js";
 import D from "../../typography/Text.vue.js";
 import q from "../../checkbox/v4/CheckboxV4.vue.js";
 import y from "../../icon/v4/IconV4.vue.js";
 import G from "../../icon/v4/IconFlag.vue.js";
-import { NOOP as I } from "@vue/shared";
+import { NOOP as $ } from "@vue/shared";
 import { optionCommon as H } from "../common/Option.common.js";
 import p from "../../typography/v4/Typography.vue.js";
-import O from "../../tooltip/v4/TooltipV4.vue.js";
+import h from "../../tooltip/v4/TooltipV4.vue.js";
 import { isElementTruncated as J } from "../../../utils/text.js";
 import { promiseTimeout as Q } from "@vueuse/core";
 const U = { class: "multiline-tooltip" }, W = {
@@ -26,10 +26,10 @@ const U = { class: "multiline-tooltip" }, W = {
   key: 1,
   class: "main-text"
 }, te = {
-  key: 2,
+  key: 0,
   class: "end-text-icon"
 }, ne = {
-  key: 3,
+  key: 1,
   class: "caption-text"
 }, ie = {
   key: 4,
@@ -37,7 +37,7 @@ const U = { class: "multiline-tooltip" }, W = {
 }, oe = {
   key: 5,
   class: "option-warning"
-}, le = ["onClick"], ae = { key: 0 }, ve = /* @__PURE__ */ A({
+}, le = ["onClick"], ae = { key: 0 }, ke = /* @__PURE__ */ V({
   __name: "OptionV4",
   props: {
     option: { default: null },
@@ -56,6 +56,7 @@ const U = { class: "multiline-tooltip" }, W = {
     endIconType: { default: "regular" },
     endTextIconKey: { default: null },
     tooltipPlacement: { default: "right" },
+    tooltipAttachedToText: { type: Boolean, default: !1 },
     treeMainOption: { type: Boolean, default: !1 },
     treeMainOptionExpanded: { type: Boolean, default: !1 },
     stopOptionClickEventPropagation: { type: Boolean, default: !1 },
@@ -67,37 +68,38 @@ const U = { class: "multiline-tooltip" }, W = {
     minMaxSelectionTooltipMessage: { default: null }
   },
   emits: ["toggleTreeCollapse"],
-  setup(e, { emit: $ }) {
-    const a = e, { selected: x, id: M, onClick: B, api: b } = H(a), S = (t) => {
-      a.stopOptionClickEventPropagation && t.stopPropagation(), a.disabled ? I() : B(t);
-    }, k = w(null), h = w(!1), z = (t) => {
-      a.disabled && (t.stopPropagation(), I());
+  setup(e, { emit: M }) {
+    const d = e, { selected: b, id: B, onClick: S, api: K } = H(d), z = (t) => {
+      d.stopOptionClickEventPropagation && t.stopPropagation(), d.disabled ? $() : S(t);
+    }, x = I(null), w = I(!1), A = (t) => {
+      d.disabled && (t.stopPropagation(), $());
     };
-    F([() => a.treeChildShown, k], async () => {
-      await Q(100), h.value = k.value && J(k.value);
+    F([() => d.treeChildShown, x], async () => {
+      await Q(100), w.value = x.value && J(x.value);
     });
-    const E = (t) => t && typeof t == "object" && "optionTooltipText" in t ? (Array.isArray(t.optionTooltipText), t.optionTooltipText) : h.value ? t[a.nameKey] : "", K = L(() => {
-      const t = a.disabled && a.minMaxSelectionTooltipMessage || "", c = E(a.option);
+    const P = (t) => t && typeof t == "object" && "optionTooltipText" in t ? (Array.isArray(t.optionTooltipText), t.optionTooltipText) : w.value ? t[d.nameKey] : "", k = L(() => {
+      const t = d.disabled && d.minMaxSelectionTooltipMessage || "", c = P(d.option);
       return c ? t ? `${c}. ${t}` : c : t;
-    }), P = (t) => t && typeof t == "object" && "optionTooltipTestId" in t ? t.optionTooltipTestId : null, V = () => {
-      $("toggleTreeCollapse", a.option);
+    }), C = (t) => t && typeof t == "object" && "optionTooltipTestId" in t ? t.optionTooltipTestId : null, E = () => {
+      M("toggleTreeCollapse", d.option);
     };
-    return (t, c) => (i(), g(n(O), {
-      text: n(K),
-      "test-id": P(e.option),
+    return (t, c) => (i(), g(n(h), {
+      text: n(k),
+      disabled: e.tooltipAttachedToText,
+      "test-id": C(e.option),
       placement: e.tooltipPlacement,
       class: "tooltip-option"
     }, N({
-      default: d(() => [
+      default: s(() => [
         u("div", {
           ref: "el",
           class: v(["item-container", {
             "item-container--disabled": e.disabled,
             "item-container--active": e.nameKey ? !1 : e.active,
-            "item-container--selected": n(x),
+            "item-container--selected": n(b),
             "item-container--multi": e.isMulti
           }]),
-          onClick: z
+          onClick: A
         }, [
           u("div", {
             class: v(["item", {
@@ -107,13 +109,13 @@ const U = { class: "multiline-tooltip" }, W = {
           }, [
             e.isMulti || e.selectAllOption ? (i(), g(n(q), {
               key: 0,
-              id: n(M).toString(),
-              disabled: a.disabled,
+              id: n(B).toString(),
+              disabled: d.disabled,
               tabindex: "-1",
               class: "checkbox",
-              "is-checked": n(x),
+              "is-checked": n(b),
               "is-indeterminate": e.isIndeterminate,
-              onClick: c[0] || (c[0] = (f) => S(f))
+              onClick: c[0] || (c[0] = (f) => z(f))
             }, null, 8, ["id", "disabled", "is-checked", "is-indeterminate"])) : o("", !0),
             !e.option?.conditionalOptions && (t.$slots.image || e.imageKey) ? (i(), l("div", W, [
               r(t.$slots, "image", {}, () => [
@@ -133,7 +135,7 @@ const U = { class: "multiline-tooltip" }, W = {
             ])) : o("", !0),
             !e.option?.conditionalOptions && (t.$slots["icon-start"] || e.iconKey) ? (i(), l("div", Z, [
               r(t.$slots, "icon-start", {}, () => [
-                s(n(y), {
+                a(n(y), {
                   type: e.iconType,
                   name: e.option[e.iconKey],
                   color: e.option.disabled ? "var(--text-disabled)" : null,
@@ -143,48 +145,59 @@ const U = { class: "multiline-tooltip" }, W = {
             ])) : o("", !0),
             u("div", {
               ref_key: "textContainerRef",
-              ref: k,
+              ref: x,
               class: "text-container"
             }, [
-              s(n(p), {
+              a(n(p), {
                 class: "option-text",
                 variant: "body2"
               }, {
-                default: d(() => [
+                default: s(() => [
                   r(t.$slots, "default", {}, () => [
                     u("div", {
                       class: v(`option-content-${e.optionTwoLinesVariant} option-content`)
                     }, [
-                      e.option?.conditionalOptions ? (i(), l("div", ee, [
-                        s(n(p), {
-                          variant: "body2",
-                          class: "conditional-option-label"
-                        }, {
-                          default: d(() => [
-                            T(m(e.option.conditionalName) + ": ", 1)
-                          ]),
-                          _: 1
-                        }),
-                        s(n(p), {
-                          variant: "h5",
-                          class: "conditional-option-value"
-                        }, {
-                          default: d(() => [
-                            T('"' + m(e.option[e.nameKey]) + '"', 1)
-                          ]),
-                          _: 1
-                        })
-                      ])) : (i(), l("div", _, m(e.option[e.nameKey]), 1)),
+                      a(n(h), {
+                        text: n(k),
+                        placement: e.tooltipPlacement,
+                        disabled: !e.tooltipAttachedToText,
+                        "test-id": C(e.option),
+                        "dont-wrap-disabled": ""
+                      }, {
+                        default: s(() => [
+                          e.option?.conditionalOptions ? (i(), l("div", ee, [
+                            a(n(p), {
+                              variant: "body2",
+                              class: "conditional-option-label"
+                            }, {
+                              default: s(() => [
+                                T(m(e.option.conditionalName) + ": ", 1)
+                              ]),
+                              _: 1
+                            }),
+                            a(n(p), {
+                              variant: "h5",
+                              class: "conditional-option-value"
+                            }, {
+                              default: s(() => [
+                                T('"' + m(e.option[e.nameKey]) + '"', 1)
+                              ]),
+                              _: 1
+                            })
+                          ])) : (i(), l("div", _, m(e.option[e.nameKey]), 1))
+                        ]),
+                        _: 1
+                      }, 8, ["text", "placement", "disabled", "test-id"]),
                       e.endTextIconKey && e.option[e.endTextIconKey] ? (i(), l("span", te, [
-                        s(n(y), {
+                        a(n(y), {
                           type: "regular",
                           name: e.option[e.endTextIconKey],
                           size: "16px"
                         }, null, 8, ["name"])
                       ])) : o("", !0),
                       e.optionTwoLinesKey ? (i(), l("div", ne, [
-                        s(n(p), { variant: "caption" }, {
-                          default: d(() => [
+                        a(n(p), { variant: "caption" }, {
+                          default: s(() => [
                             T(m(e.option[e.optionTwoLinesKey]), 1)
                           ]),
                           _: 1
@@ -200,7 +213,7 @@ const U = { class: "multiline-tooltip" }, W = {
                 class: "subtitle",
                 size: "xs"
               }, {
-                default: d(() => [
+                default: s(() => [
                   T(m(e.subtitle), 1)
                 ]),
                 _: 1
@@ -208,7 +221,7 @@ const U = { class: "multiline-tooltip" }, W = {
             ], 512),
             t.$slots["icon-end"] || e.endIconKey && e.option[e.endIconKey] ? (i(), l("div", ie, [
               r(t.$slots, "icon-end", {}, () => [
-                s(n(y), {
+                a(n(y), {
                   type: e.endIconType || "regular",
                   name: e.option[e.endIconKey],
                   size: e.endIconType === "regular" || e.endIconType === "ab-test" ? "20px" : "16px"
@@ -216,12 +229,12 @@ const U = { class: "multiline-tooltip" }, W = {
               ], !0)
             ])) : o("", !0),
             e.warningKey && e.option?.[e.warningKey] ? (i(), l("div", oe, [
-              s(n(O), {
+              a(n(h), {
                 text: e.option[e.warningKey],
                 placement: "top"
               }, {
-                default: d(() => [
-                  s(n(y), {
+                default: s(() => [
+                  a(n(y), {
                     class: "option-warning__icon",
                     name: "warning-circle",
                     size: "16px"
@@ -237,21 +250,21 @@ const U = { class: "multiline-tooltip" }, W = {
             e.treeMainOption ? (i(), l("div", {
               key: 7,
               class: "tree-main-arrow-wrapper",
-              onClick: C(V, ["stop"])
+              onClick: O(E, ["stop"])
             }, [
-              s(n(y), {
+              a(n(y), {
                 name: "caret-down",
                 size: "16px",
                 class: v(`app-trigger--icon ${e.treeMainOptionExpanded && "expanded"}`)
               }, null, 8, ["class"])
             ], 8, le)) : o("", !0)
           ], 2),
-          n(b).clearable && n(x) ? (i(), l("div", ae, [
+          n(K).clearable && n(b) ? (i(), l("div", ae, [
             u("button", {
               class: "clear-button",
-              onClick: c[1] || (c[1] = C((f) => n(b).clearSelection(), ["prevent", "stop"]))
+              onClick: c[1] || (c[1] = O((f) => n(K).clearSelection(), ["prevent", "stop"]))
             }, [
-              s(n(y), {
+              a(n(y), {
                 name: "close",
                 width: "8",
                 height: "8"
@@ -262,15 +275,15 @@ const U = { class: "multiline-tooltip" }, W = {
       ]),
       _: 2
     }, [
-      Array.isArray(n(K)) ? {
+      Array.isArray(n(k)) ? {
         name: "tooltip",
-        fn: d(() => [
+        fn: s(() => [
           u("div", U, [
-            (i(!0), l(j, null, R(n(K), (f) => (i(), g(n(p), {
+            (i(!0), l(j, null, R(n(k), (f) => (i(), g(n(p), {
               key: f,
               variant: "body2"
             }, {
-              default: d(() => [
+              default: s(() => [
                 T(m(f), 1)
               ]),
               _: 2
@@ -279,9 +292,9 @@ const U = { class: "multiline-tooltip" }, W = {
         ]),
         key: "0"
       } : void 0
-    ]), 1032, ["text", "test-id", "placement"]));
+    ]), 1032, ["text", "disabled", "test-id", "placement"]));
   }
 });
 export {
-  ve as default
+  ke as default
 };

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

@@ -1088,6 +1088,7 @@ declare const DropdownTypes: () => (({
             isIndeterminate: boolean;
             subtitle: string;
             selectAllOption: boolean;
+            tooltipAttachedToText: boolean;
             nameKey: string;
             imageKey: string;
             iconKey: string;
@@ -1146,6 +1147,10 @@ declare const DropdownTypes: () => (({
                 type: import("vue").PropType<boolean>;
                 default: boolean;
             };
+            tooltipAttachedToText: {
+                type: import("vue").PropType<boolean>;
+                default: boolean;
+            };
             nameKey: {
                 type: import("vue").PropType<string>;
                 default: any;
@@ -1203,7 +1208,7 @@ declare const DropdownTypes: () => (({
             };
         }>> & {
             onToggleTreeCollapse?: (option: unknown) => any;
-        } & import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, "option" | "tooltipPlacement" | "disabled" | "active" | "endIconType" | "optionFlagKey" | "optionTwoLinesVariant" | "optionTwoLinesKey" | "isIndeterminate" | "subtitle" | "selectAllOption" | "nameKey" | "imageKey" | "iconKey" | "warningKey" | "iconType" | "endIconKey" | "endTextIconKey" | "treeMainOption" | "treeMainOptionExpanded" | "stopOptionClickEventPropagation" | "treeChildShown" | "isMulti" | "minMaxSelectionTooltipMessage">;
+        } & import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, "option" | "tooltipPlacement" | "disabled" | "active" | "endIconType" | "optionFlagKey" | "optionTwoLinesVariant" | "optionTwoLinesKey" | "isIndeterminate" | "subtitle" | "selectAllOption" | "tooltipAttachedToText" | "nameKey" | "imageKey" | "iconKey" | "warningKey" | "iconType" | "endIconKey" | "endTextIconKey" | "treeMainOption" | "treeMainOptionExpanded" | "stopOptionClickEventPropagation" | "treeChildShown" | "isMulti" | "minMaxSelectionTooltipMessage">;
         $attrs: {
             [x: string]: unknown;
         };
@@ -1262,6 +1267,10 @@ declare const DropdownTypes: () => (({
                 type: import("vue").PropType<boolean>;
                 default: boolean;
             };
+            tooltipAttachedToText: {
+                type: import("vue").PropType<boolean>;
+                default: boolean;
+            };
             nameKey: {
                 type: import("vue").PropType<string>;
                 default: any;
@@ -1333,6 +1342,7 @@ declare const DropdownTypes: () => (({
             isIndeterminate: boolean;
             subtitle: string;
             selectAllOption: boolean;
+            tooltipAttachedToText: boolean;
             nameKey: string;
             imageKey: string;
             iconKey: string;
@@ -1411,6 +1421,10 @@ declare const DropdownTypes: () => (({
             type: import("vue").PropType<boolean>;
             default: boolean;
         };
+        tooltipAttachedToText: {
+            type: import("vue").PropType<boolean>;
+            default: boolean;
+        };
         nameKey: {
             type: import("vue").PropType<string>;
             default: any;
@@ -1517,6 +1531,10 @@ declare const DropdownTypes: () => (({
         type: import("vue").PropType<boolean>;
         default: boolean;
     };
+    tooltipAttachedToText: {
+        type: import("vue").PropType<boolean>;
+        default: boolean;
+    };
     nameKey: {
         type: import("vue").PropType<string>;
         default: any;
@@ -1588,6 +1606,7 @@ declare const DropdownTypes: () => (({
     isIndeterminate: boolean;
     subtitle: string;
     selectAllOption: boolean;
+    tooltipAttachedToText: boolean;
     nameKey: string;
     imageKey: string;
     iconKey: string;

package/components/sortableList/SortableItem.vue.d.ts

@@ -4,20 +4,26 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<__
     index?: number;
     isOpen?: boolean;
     isSelected?: boolean;
+    isDisabled?: boolean;
     selectedChildId?: string | number;
     searchQuery?: string;
-    childListMaxHeight: string;
+    childListMaxHeight?: string;
     searchHandler?: (item: SortableListItem, searchQuery: string) => boolean;
     displayValue: (item: SortableListItem) => string;
+    variant?: "default" | "compact";
+    draggableArea?: "handle" | "full";
 }>, {
     text: string;
     isOpen: boolean;
     isSelected: boolean;
+    isDisabled: boolean;
     selectedChildId: any;
     searchQuery: any;
     index: any;
     childListMaxHeight: string;
     searchHandler: any;
+    variant: string;
+    draggableArea: string;
 }>, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
     toggle: (value: boolean) => void;
     select: () => void;
@@ -27,32 +33,41 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<__
     index?: number;
     isOpen?: boolean;
     isSelected?: boolean;
+    isDisabled?: boolean;
     selectedChildId?: string | number;
     searchQuery?: string;
-    childListMaxHeight: string;
+    childListMaxHeight?: string;
     searchHandler?: (item: SortableListItem, searchQuery: string) => boolean;
     displayValue: (item: SortableListItem) => string;
+    variant?: "default" | "compact";
+    draggableArea?: "handle" | "full";
 }>, {
     text: string;
     isOpen: boolean;
     isSelected: boolean;
+    isDisabled: boolean;
     selectedChildId: any;
     searchQuery: any;
     index: any;
     childListMaxHeight: string;
     searchHandler: any;
+    variant: string;
+    draggableArea: string;
 }>>> & {
     onSelect?: () => any;
     onToggle?: (value: boolean) => any;
     onSelectChild?: (childItem: SortableListItem) => any;
 }, {
+    variant: "default" | "compact";
     isOpen: boolean;
     index: number;
     isSelected: boolean;
     searchQuery: string;
+    isDisabled: boolean;
     selectedChildId: string | number;
     childListMaxHeight: string;
     searchHandler: (item: SortableListItem, searchQuery: string) => boolean;
+    draggableArea: "handle" | "full";
 }>, {
     menu?(_: {}): any;
 }>;

package/components/sortableList/SortableItem.vue.js

@@ -1,7 +1,7 @@
 import o from "./SortableItem.vue2.js";
 /* empty css                   */import e from "../../_virtual/_plugin-vue_export-helper.js";
-// import "../../SortableItem.vue_vue_type_style_index_0_scoped_48542664_lang.css"; //*');
-const p = /* @__PURE__ */ e(o, [["__scopeId", "data-v-48542664"]]);
+// import "../../SortableItem.vue_vue_type_style_index_0_scoped_800cd503_lang.css"; //*');
+const c = /* @__PURE__ */ e(o, [["__scopeId", "data-v-800cd503"]]);
 export {
-  p as default
+  c as default
 };