@ironsource/shared-ui 2.1.12-rc.24 → 2.1.12-rc.26

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

@@ -1,4 +1,4 @@
- import "../../../OptionV4.vue_vue_type_style_index_0_scoped_3dc741c1_lang.css"; import { defineComponent as A, ref as w, watch as F, computed as L, openBlock as o, createBlock as f, unref as n, createSlots as N, withCtx as s, createElementVNode as c, normalizeClass as v, createCommentVNode as i, createElementBlock as l, renderSlot as u, createVNode as a, toDisplayString as r, createTextVNode as g, withModifiers as C, Fragment as j, renderList as R } from "vue";
+ import "../../../OptionV4.vue_vue_type_style_index_0_scoped_9560a062_lang.css"; import { defineComponent as A, ref as w, watch as F, computed as L, openBlock as o, createBlock as f, unref as n, createSlots as N, withCtx as d, createElementVNode as c, normalizeClass as v, createCommentVNode as i, createElementBlock as l, renderSlot as r, createVNode as a, toDisplayString as u, createTextVNode as g, withModifiers as C, 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";
@@ -37,7 +37,7 @@ const U = { class: "multiline-tooltip" }, W = {
 }, ie = {
   key: 5,
   class: "option-warning"
-}, le = { key: 6 }, ae = ["onClick"], se = { key: 0 }, Ke = /* @__PURE__ */ A({
+}, le = ["onClick"], ae = { key: 0 }, ve = /* @__PURE__ */ A({
   __name: "OptionV4",
   props: {
     option: { default: null },
@@ -67,24 +67,24 @@ const U = { class: "multiline-tooltip" }, W = {
   },
   emits: ["toggleTreeCollapse"],
   setup(e, { emit: $ }) {
-    const d = e, { selected: K, id: B, onClick: z, api: x } = H(d), M = (t) => {
-      d.stopOptionClickEventPropagation && t.stopPropagation(), d.disabled ? I() : z(t);
+    const s = e, { selected: K, id: B, onClick: z, api: h } = H(s), M = (t) => {
+      s.stopOptionClickEventPropagation && t.stopPropagation(), s.disabled ? I() : z(t);
     }, p = w(null), b = w(!1), E = (t) => {
-      d.disabled && (t.stopPropagation(), I());
+      s.disabled && (t.stopPropagation(), I());
     };
-    F([() => d.treeChildShown, p], async () => {
+    F([() => s.treeChildShown, p], async () => {
       await Q(100), b.value = p.value && J(p.value);
     });
-    const P = (t) => t && typeof t == "object" && "optionTooltipText" in t ? (Array.isArray(t.optionTooltipText), t.optionTooltipText) : b.value ? t[d.nameKey] : "", h = L(() => P(d.option)), S = (t) => t && typeof t == "object" && "optionTooltipTestId" in t ? t.optionTooltipTestId : null, V = () => {
-      $("toggleTreeCollapse", d.option);
+    const P = (t) => t && typeof t == "object" && "optionTooltipText" in t ? (Array.isArray(t.optionTooltipText), t.optionTooltipText) : b.value ? t[s.nameKey] : "", x = L(() => P(s.option)), S = (t) => t && typeof t == "object" && "optionTooltipTestId" in t ? t.optionTooltipTestId : null, V = () => {
+      $("toggleTreeCollapse", s.option);
     };
     return (t, k) => (o(), f(n(O), {
-      text: n(h),
+      text: n(x),
       "test-id": S(e.option),
       placement: e.toolTipPlacement,
       class: "tooltip-option"
     }, N({
-      default: s(() => [
+      default: d(() => [
         c("div", {
           ref: "el",
           class: v(["item-container", {
@@ -111,7 +111,7 @@ const U = { class: "multiline-tooltip" }, W = {
               onClick: k[0] || (k[0] = (y) => M(y))
             }, null, 8, ["id", "is-checked", "is-indeterminate"])) : i("", !0),
             !e.option?.conditionalOptions && (t.$slots.image || e.imageKey) ? (o(), l("div", W, [
-              u(t.$slots, "image", {}, () => [
+              r(t.$slots, "image", {}, () => [
                 e.imageKey ? (o(), l("img", {
                   key: 0,
                   src: e.option[e.imageKey]
@@ -119,7 +119,7 @@ const U = { class: "multiline-tooltip" }, W = {
               ], !0)
             ])) : i("", !0),
             !e.option?.conditionalOptions && (t.$slots.flag || e.optionFlagKey) ? (o(), l("div", Y, [
-              u(t.$slots, "flag", {}, () => [
+              r(t.$slots, "flag", {}, () => [
                 e.optionFlagKey ? (o(), f(n(G), {
                   key: 0,
                   "country-code": e.option[e.optionFlagKey]
@@ -127,12 +127,13 @@ const U = { class: "multiline-tooltip" }, W = {
               ], !0)
             ])) : i("", !0),
             !e.option?.conditionalOptions && (t.$slots["icon-start"] || e.iconKey) ? (o(), l("div", Z, [
-              u(t.$slots, "icon-start", {}, () => [
+              r(t.$slots, "icon-start", {}, () => [
                 a(n(m), {
                   type: e.iconType,
                   name: e.option[e.iconKey],
+                  color: e.option.disabled ? "var(--text-disabled)" : null,
                   size: e.iconType === "regular" ? "20px" : "16px"
-                }, null, 8, ["type", "name", "size"])
+                }, null, 8, ["type", "name", "color", "size"])
               ], !0)
             ])) : i("", !0),
             c("div", {
@@ -144,8 +145,8 @@ const U = { class: "multiline-tooltip" }, W = {
                 class: "option-text",
                 variant: "body2"
               }, {
-                default: s(() => [
-                  u(t.$slots, "default", {}, () => [
+                default: d(() => [
+                  r(t.$slots, "default", {}, () => [
                     c("div", {
                       class: v(`option-content-${e.optionTwoLinesVariant} option-content`)
                     }, [
@@ -154,8 +155,8 @@ const U = { class: "multiline-tooltip" }, W = {
                           variant: "body2",
                           class: "conditional-option-label"
                         }, {
-                          default: s(() => [
-                            g(r(e.option.conditionalName) + ": ", 1)
+                          default: d(() => [
+                            g(u(e.option.conditionalName) + ": ", 1)
                           ]),
                           _: 1
                         }),
@@ -163,12 +164,12 @@ const U = { class: "multiline-tooltip" }, W = {
                           variant: "h5",
                           class: "conditional-option-value"
                         }, {
-                          default: s(() => [
-                            g('"' + r(e.option[e.nameKey]) + '"', 1)
+                          default: d(() => [
+                            g('"' + u(e.option[e.nameKey]) + '"', 1)
                           ]),
                           _: 1
                         })
-                      ])) : (o(), l("div", _, r(e.option[e.nameKey]), 1)),
+                      ])) : (o(), l("div", _, u(e.option[e.nameKey]), 1)),
                       e.endTextIconKey && e.option[e.endTextIconKey] ? (o(), l("span", te, [
                         a(n(m), {
                           type: "regular",
@@ -178,8 +179,8 @@ const U = { class: "multiline-tooltip" }, W = {
                       ])) : i("", !0),
                       e.optionTwoLinesKey ? (o(), l("div", ne, [
                         a(n(T), { variant: "caption" }, {
-                          default: s(() => [
-                            g(r(e.option[e.optionTwoLinesKey]), 1)
+                          default: d(() => [
+                            g(u(e.option[e.optionTwoLinesKey]), 1)
                           ]),
                           _: 1
                         })
@@ -194,14 +195,14 @@ const U = { class: "multiline-tooltip" }, W = {
                 class: "subtitle",
                 size: "xs"
               }, {
-                default: s(() => [
-                  g(r(e.subtitle), 1)
+                default: d(() => [
+                  g(u(e.subtitle), 1)
                 ]),
                 _: 1
               })) : i("", !0)
             ], 512),
             t.$slots["icon-end"] || e.endIconKey && e.option[e.endIconKey] ? (o(), l("div", oe, [
-              u(t.$slots, "icon-end", {}, () => [
+              r(t.$slots, "icon-end", {}, () => [
                 a(n(m), {
                   type: e.endIconType || "regular",
                   name: e.option[e.endIconKey],
@@ -214,7 +215,7 @@ const U = { class: "multiline-tooltip" }, W = {
                 text: e.option[e.warningKey],
                 placement: "top"
               }, {
-                default: s(() => [
+                default: d(() => [
                   a(n(m), {
                     class: "option-warning__icon",
                     name: "warning-circle",
@@ -224,9 +225,10 @@ const U = { class: "multiline-tooltip" }, W = {
                 _: 1
               }, 8, ["text"])
             ])) : i("", !0),
-            t.$slots["option-end"] ? (o(), l("div", le, [
-              u(t.$slots, "option-end", { option: e.option }, void 0, !0)
-            ])) : i("", !0),
+            t.$slots["option-end"] ? r(t.$slots, "option-end", {
+              key: 6,
+              option: e.option
+            }, void 0, !0) : i("", !0),
             e.treeMainOption ? (o(), l("div", {
               key: 7,
               class: "tree-main-arrow-wrapper",
@@ -237,12 +239,12 @@ const U = { class: "multiline-tooltip" }, W = {
                 size: "16px",
                 class: v(`app-trigger--icon ${e.treeMainOptionExpanded && "expanded"}`)
               }, null, 8, ["class"])
-            ], 8, ae)) : i("", !0)
+            ], 8, le)) : i("", !0)
           ], 2),
-          n(x).clearable && n(K) ? (o(), l("div", se, [
+          n(h).clearable && n(K) ? (o(), l("div", ae, [
             c("button", {
               class: "clear-button",
-              onClick: k[1] || (k[1] = C((y) => n(x).clearSelection(), ["prevent", "stop"]))
+              onClick: k[1] || (k[1] = C((y) => n(h).clearSelection(), ["prevent", "stop"]))
             }, [
               a(n(m), {
                 name: "close",
@@ -255,16 +257,16 @@ const U = { class: "multiline-tooltip" }, W = {
       ]),
       _: 2
     }, [
-      Array.isArray(n(h)) ? {
+      Array.isArray(n(x)) ? {
         name: "tooltip",
-        fn: s(() => [
+        fn: d(() => [
           c("div", U, [
-            (o(!0), l(j, null, R(n(h), (y) => (o(), f(n(T), {
+            (o(!0), l(j, null, R(n(x), (y) => (o(), f(n(T), {
               key: y,
               variant: "body2"
             }, {
-              default: s(() => [
-                g(r(y), 1)
+              default: d(() => [
+                g(u(y), 1)
               ]),
               _: 2
             }, 1024))), 128))
@@ -276,5 +278,5 @@ const U = { class: "multiline-tooltip" }, W = {
   }
 });
 export {
-  Ke as default
+  ve as default
 };

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

@@ -217,6 +217,14 @@ export declare const dropDownStoryArgs: {
             category: string;
         };
     };
+    showClearAll: {
+        control: {
+            type: string;
+        };
+        table: {
+            category: string;
+        };
+    };
     defaultOpen: {
         control: {
             type: string;