@ironsource/shared-ui 2.1.10-rc.2 → 2.1.10-rc.3

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

@@ -1,9 +1,9 @@
- import "../../../ChipDropdownTrigger.vue_vue_type_style_index_0_scoped_a8fdae89_lang.css"; import { defineComponent as V, ref as b, computed as p, openBlock as _, createElementBlock as C, mergeProps as s, unref as t, createElementVNode as c, createVNode as d, withCtx as w, createTextVNode as k, toDisplayString as v, withDirectives as u, vShow as f, withModifiers as x } from "vue";
+ import "../../../ChipDropdownTrigger.vue_vue_type_style_index_0_scoped_49bd7193_lang.css"; import { defineComponent as V, ref as b, computed as p, openBlock as _, createElementBlock as C, mergeProps as n, unref as t, createElementVNode as d, createVNode as c, withCtx as w, createTextVNode as B, toDisplayString as k, withDirectives as u, vShow as f, withModifiers as v } from "vue";
 import m from "../../icon/v4/IconV4.vue.js";
 import "../../icon/v4/IconFlag.vue.js";
-import A from "../../typography/v4/Typography.vue.js";
+import x from "../../typography/v4/Typography.vue.js";
 import { DropdownTestIdModifiers as o } from "../../../testids/index.js";
-import { useTestIdAttrs as B } from "../../../utils/testIds.js";
+import { useTestIdAttrs as A } from "../../../utils/testIds.js";
 const N = { class: "chip-trigger--content" }, I = { class: "chip-trigger--icon" }, $ = ["onClick"], M = /* @__PURE__ */ V({
   __name: "ChipDropdownTrigger",
   props: {
@@ -13,6 +13,7 @@ const N = { class: "chip-trigger--content" }, I = { class: "chip-trigger--icon"
     disabled: { type: Boolean, default: !1 },
     feedbackVariant: { default: "" },
     displayedValue: { default: "" },
+    allSelected: { type: Boolean, default: !1 },
     options: null,
     selectedOption: null,
     displayValue: null,
@@ -22,48 +23,48 @@ const N = { class: "chip-trigger--content" }, I = { class: "chip-trigger--icon"
   setup(r, { emit: h }) {
     const e = r, y = () => {
       h("clear");
-    }, a = b(!0), g = (l) => {
-      let i = l;
-      return Array.isArray(l) && (l.length > 1 ? i = `${l[0]}, +${l[1]}` : i = l[0] ? `${l[0]}` : ""), a.value = !!i, i ? `${e.label}: ${i}` : e.label;
-    }, O = p(
+    }, i = b(!0), g = (l) => {
+      let a = l;
+      return Array.isArray(l) && (l.length > 1 ? a = `${l[0]}, +${l[1]}` : a = l[0] ? `${l[0]}` : ""), i.value = !!a, a ? `${e.label}: ${a}` : e.label;
+    }, T = p(
       () => e.feedbackVariant ? `state-${e.feedbackVariant}` : ""
-    ), n = B(e.testId, o), T = p(() => {
+    ), s = A(e.testId, o), O = p(() => {
       if (!e.multi)
         return e.selectedOption ? e.displayValue(e.selectedOption) : "";
       if (Array.isArray(e.selectedOption))
-        return e.selectedOption.length ? e.options.length === e.selectedOption.length ? ["All"] : e.selectedOption.length == 1 && e.displayValue ? [e.displayValue(e.selectedOption[0])] : [
+        return e.selectedOption.length ? e.allSelected ? ["All"] : e.selectedOption.length == 1 && e.displayValue ? [e.displayValue(e.selectedOption[0])] : [
           e.displayValue(e.selectedOption[0]),
           e.selectedOption.length - 1
         ] : [];
     });
-    return (l, i) => (_(), C("div", s({
-      class: ["chip-trigger", [t(O), { active: a.value, disabled: r.disabled, open: r.open }]]
-    }, t(n)[t(o).BUTTON]), [
-      c("div", N, [
-        d(t(A), s({ variant: "chipLabel" }, t(n)[t(o).BUTTON_CONTENT]), {
+    return (l, a) => (_(), C("div", n({
+      class: ["chip-trigger", [t(T), { active: i.value, disabled: r.disabled, open: r.open }]]
+    }, t(s)[t(o).BUTTON]), [
+      d("div", N, [
+        c(t(x), n({ variant: "chipLabel" }, t(s)[t(o).BUTTON_CONTENT]), {
           default: w(() => [
-            k(v(g(t(T))), 1)
+            B(k(g(t(O))), 1)
           ]),
           _: 1
         }, 16),
-        u(c("div", I, [
-          d(t(m), {
+        u(d("div", I, [
+          c(t(m), {
             name: "caret-down",
             size: "16px"
           })
         ], 512), [
-          [f, !a.value]
+          [f, !i.value]
         ]),
-        u(c("div", s({ class: "x-circle-wrapper" }, t(n)[t(o).BUTTON_CLEAR], {
-          onClick: x(y, ["stop"])
+        u(d("div", n({ class: "x-circle-wrapper" }, t(s)[t(o).BUTTON_CLEAR], {
+          onClick: v(y, ["stop"])
         }), [
-          d(t(m), {
+          c(t(m), {
             name: "x-circle",
             size: "16px",
             type: "fill"
           })
         ], 16, $), [
-          [f, a.value]
+          [f, i.value]
         ])
       ])
     ], 16));

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

@@ -23,6 +23,8 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<__
     optionIconKey?: string;
     optionIconType?: "fill" | "bold" | "regular" | "branded" | "ad-unit" | "ab-test" | "ad-networks" | "ad-networks/flat" | "content-rate";
     showAllSelectedText?: boolean;
+    allSelected?: boolean;
+    optionFlagKey?: string;
     statusDotType?: "default" | "disabled" | "success" | "warning" | "error" | "archive";
 }>, {
     placeholder: string;
@@ -48,6 +50,8 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<__
     optionIconKey: any;
     optionIconType: any;
     showAllSelectedText: boolean;
+    allSelected: boolean;
+    optionFlagKey: any;
     statusDotType: any;
 }>, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
     click: () => void;
@@ -76,6 +80,8 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<__
     optionIconKey?: string;
     optionIconType?: "fill" | "bold" | "regular" | "branded" | "ad-unit" | "ab-test" | "ad-networks" | "ad-networks/flat" | "content-rate";
     showAllSelectedText?: boolean;
+    allSelected?: boolean;
+    optionFlagKey?: string;
     statusDotType?: "default" | "disabled" | "success" | "warning" | "error" | "archive";
 }>, {
     placeholder: string;
@@ -101,6 +107,8 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<__
     optionIconKey: any;
     optionIconType: any;
     showAllSelectedText: boolean;
+    allSelected: boolean;
+    optionFlagKey: any;
     statusDotType: any;
 }>>> & {
     onClick?: () => any;
@@ -124,6 +132,8 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<__
     optionIconKey: string;
     optionImageKey: string;
     optionIconType: "fill" | "bold" | "regular" | "branded" | "ad-unit" | "ab-test" | "ad-networks" | "ad-networks/flat" | "content-rate";
+    optionFlagKey: string;
+    allSelected: boolean;
     selectedOption: any;
     showFeedbackIcon: boolean;
     brandIconType: "android" | "ios";
@@ -131,6 +141,7 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<__
     statusDotType: "default" | "disabled" | "success" | "warning" | "error" | "archive";
 }>, {
     image?(_: {}): any;
+    flag?(_: {}): any;
     "icon-start"?(_: {}): any;
     "displayed-value"?(_: {}): any;
     "end-icon"?(_: {}): any;

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

@@ -1,7 +1,7 @@
 import o from "./DefaultDropdownTrigger.vue2.js";
 /* empty css                             */import e from "../../../_virtual/_plugin-vue_export-helper.js";
-// import "../../../DefaultDropdownTrigger.vue_vue_type_style_index_0_scoped_fd7a490e_lang.css"; //*');
-const p = /* @__PURE__ */ e(o, [["__scopeId", "data-v-fd7a490e"]]);
+// import "../../../DefaultDropdownTrigger.vue_vue_type_style_index_0_scoped_9fa84b26_lang.css"; //*');
+const p = /* @__PURE__ */ e(o, [["__scopeId", "data-v-9fa84b26"]]);
 export {
   p as default
 };

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

@@ -1,21 +1,25 @@
- import "../../../DefaultDropdownTrigger.vue_vue_type_style_index_0_scoped_fd7a490e_lang.css"; import { defineComponent as O, computed as c, openBlock as a, createElementBlock as n, createBlock as k, createCommentVNode as d, createElementVNode as u, mergeProps as m, unref as l, renderSlot as i, createVNode as r, withCtx as I, createTextVNode as B, toDisplayString as w } from "vue";
-import V from "../../typography/v4/Typography.vue.js";
-import { DropdownTestIdModifiers as p } from "../../../testids/index.js";
-import h from "../../icon/v4/IconV4.vue.js";
+ import "../../../DefaultDropdownTrigger.vue_vue_type_style_index_0_scoped_9fa84b26_lang.css"; import { defineComponent as I, computed as r, openBlock as a, createElementBlock as n, createBlock as O, createCommentVNode as s, createElementVNode as c, mergeProps as h, unref as l, renderSlot as i, createVNode as u, withCtx as $, createTextVNode as A, toDisplayString as B } from "vue";
+import w from "../../typography/v4/Typography.vue.js";
+import { DropdownTestIdModifiers as f } from "../../../testids/index.js";
+import g from "../../icon/v4/IconV4.vue.js";
 import "../../icon/v4/IconFlag.vue.js";
-import A from "../../shared/FieldLabel.vue.js";
-import { useTestIdAttrs as $ } from "../../../utils/testIds.js";
-import x from "../../statusDot/StatusDot.vue.js";
-const D = { class: "default-dropdown-wrapper" }, N = { class: "content" }, K = {
+import D from "../../shared/FieldLabel.vue.js";
+import { useTestIdAttrs as S } from "../../../utils/testIds.js";
+import K from "../../statusDot/StatusDot.vue.js";
+import { SHARED_ASSETS_CDN_DOMAIN as V } from "../../../consts/configs.js";
+const N = { class: "default-dropdown-wrapper" }, C = { class: "content" }, x = {
   key: 0,
   class: "image"
-}, C = ["src"], S = {
+}, E = ["src"], F = {
   key: 1,
-  class: "start-icon"
-}, P = {
+  class: "flag"
+}, H = ["src"], P = {
   key: 2,
+  class: "start-icon"
+}, z = {
+  key: 3,
   class: "status-dot"
-}, z = { key: 0 }, E = { class: "caret-down" }, G = /* @__PURE__ */ O({
+}, R = { key: 0 }, U = { class: "caret-down" }, Z = /* @__PURE__ */ I({
   __name: "DefaultDropdownTrigger",
   props: {
     placeholder: { default: "Select" },
@@ -42,24 +46,26 @@ const D = { class: "default-dropdown-wrapper" }, N = { class: "content" }, K = {
     optionIconKey: { default: null },
     optionIconType: { default: null },
     showAllSelectedText: { type: Boolean, default: !0 },
+    allSelected: { type: Boolean, default: !1 },
+    optionFlagKey: { default: null },
     statusDotType: { default: null }
   },
   emits: ["click"],
-  setup(t, { emit: T }) {
-    const e = t, g = c(
+  setup(t, { emit: v }) {
+    const e = t, T = r(
       () => e.feedbackVariant ? `state-${e.feedbackVariant}` : ""
-    ), v = () => {
-      T("click");
-    }, f = $(e.testId, p), b = c(() => e.multi ? !Array.isArray(e.selectedOption) || !e.selectedOption?.length ? e.placeholder : e.showAllSelectedText && e.options?.length === e.selectedOption.length ? `All selected (${e.selectedOption.length})` : e.selectedOption?.length === 1 && e.displayValue ? e.displayValue(e.selectedOption[0]) : `${e.selectedOption.length} selected` : e.selectedOption ? e.displayValue(e.selectedOption) : e.placeholder), s = c(() => {
+    ), b = () => {
+      v("click");
+    }, p = S(e.testId, f), k = r(() => e.multi ? !Array.isArray(e.selectedOption) || !e.selectedOption?.length ? e.placeholder : e.showAllSelectedText && e.allSelected ? `All selected (${e.selectedOption.length})` : e.selectedOption?.length === 1 && e.displayValue ? e.displayValue(e.selectedOption[0]) : `${e.selectedOption.length} selected` : e.selectedOption ? e.displayValue(e.selectedOption) : e.placeholder), d = r(() => {
       if (!e.selectedOption)
         return null;
       if (!e.multi)
         return e.selectedOption;
       if (Array.isArray(e.selectedOption))
         return e.selectedOption.length === 1 ? e.selectedOption[0] : null;
-    });
-    return (o, y) => (a(), n("div", D, [
-      t.label ? (a(), k(A, {
+    }), y = r(() => e.optionFlagKey && d.value ? `${V}/assets/flags/v4/${d.value[e.optionFlagKey]?.toLowerCase()}.svg` : null);
+    return (o, m) => (a(), n("div", N, [
+      t.label ? (a(), O(D, {
         key: 0,
         label: t.label,
         mandatory: t.mandatory,
@@ -68,47 +74,55 @@ const D = { class: "default-dropdown-wrapper" }, N = { class: "content" }, K = {
         disabled: t.disabled,
         "test-id": t.testId,
         class: "dropdown-field-label"
-      }, null, 8, ["label", "mandatory", "hover-help-text", "hover-help-text-placement", "disabled", "test-id"])) : d("", !0),
-      u("div", m({
-        class: ["dropdown-trigger", [t.size, l(g), { open: t.open, disabled: t.disabled }]]
-      }, l(f)[l(p).BUTTON_WRAPPER], {
-        onClick: y[0] || (y[0] = (H) => v())
+      }, null, 8, ["label", "mandatory", "hover-help-text", "hover-help-text-placement", "disabled", "test-id"])) : s("", !0),
+      c("div", h({
+        class: ["dropdown-trigger", [t.size, l(T), { open: t.open, disabled: t.disabled }]]
+      }, l(p)[l(f).BUTTON_WRAPPER], {
+        onClick: m[0] || (m[0] = (L) => b())
       }), [
-        u("div", N, [
-          o.$slots.image || l(s) && t.optionImageKey ? (a(), n("div", K, [
+        c("div", C, [
+          o.$slots.image || l(d) && t.optionImageKey ? (a(), n("div", x, [
             i(o.$slots, "image", {}, () => [
               t.optionImageKey ? (a(), n("img", {
                 key: 0,
-                src: l(s)[t.optionImageKey]
-              }, null, 8, C)) : d("", !0)
+                src: l(d)[t.optionImageKey]
+              }, null, 8, E)) : s("", !0)
+            ], !0)
+          ])) : s("", !0),
+          o.$slots.flag || l(d) && t.optionFlagKey ? (a(), n("div", F, [
+            i(o.$slots, "flag", {}, () => [
+              l(y) ? (a(), n("img", {
+                key: 0,
+                src: l(y)
+              }, null, 8, H)) : s("", !0)
             ], !0)
-          ])) : d("", !0),
-          o.$slots["icon-start"] || l(s) && t.optionIconKey ? (a(), n("div", S, [
+          ])) : s("", !0),
+          o.$slots["icon-start"] || l(d) && t.optionIconKey ? (a(), n("div", P, [
             i(o.$slots, "icon-start", {}, () => [
-              r(l(h), {
+              u(l(g), {
                 type: t.optionIconType,
-                name: l(s)[t.optionIconKey],
+                name: l(d)[t.optionIconKey],
                 size: "20px"
               }, null, 8, ["type", "name"])
             ], !0)
-          ])) : d("", !0),
-          t.statusDotType ? (a(), n("div", P, [
-            r(l(x), { type: t.statusDotType }, null, 8, ["type"])
-          ])) : d("", !0),
+          ])) : s("", !0),
+          t.statusDotType ? (a(), n("div", z, [
+            u(l(K), { type: t.statusDotType }, null, 8, ["type"])
+          ])) : s("", !0),
           i(o.$slots, "displayed-value", {}, () => [
-            r(l(V), m({ variant: "body1" }, l(f)[l(p).BUTTON_CONTENT], { class: "displayed-value" }), {
-              default: I(() => [
-                B(w(l(b)), 1)
+            u(l(w), h({ variant: "body1" }, l(p)[l(f).BUTTON_CONTENT], { class: "displayed-value" }), {
+              default: $(() => [
+                A(B(l(k)), 1)
               ]),
               _: 1
             }, 16)
           ], !0)
         ]),
-        o.$slots["end-icon"] ? (a(), n("div", z, [
+        o.$slots["end-icon"] ? (a(), n("div", R, [
           i(o.$slots, "end-icon", {}, void 0, !0)
-        ])) : d("", !0),
-        u("div", E, [
-          r(l(h), {
+        ])) : s("", !0),
+        c("div", U, [
+          u(l(g), {
             name: "caret-down",
             size: "20px"
           })
@@ -118,5 +132,5 @@ const D = { class: "default-dropdown-wrapper" }, N = { class: "content" }, K = {
   }
 });
 export {
-  G as default
+  Z as default
 };

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

@@ -43,11 +43,13 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<__
     optionIconType?: "fill" | "bold" | "regular" | "branded" | "ad-unit" | "ab-test" | "ad-networks" | "ad-networks/flat" | "content-rate";
     optionEndIconKey?: string;
     optionEndIconType?: "fill" | "bold" | "regular" | "branded" | "ad-unit" | "ab-test" | "ad-networks" | "ad-networks/flat" | "content-rate";
+    optionFlagKey?: string;
     valueToCopy?: string;
     disabledOptionKey?: string;
     optionTwoLinesVariant?: "horizontal" | "vertical";
     optionTwoLinesKey?: string;
     groupedOptions?: boolean;
+    comparingKey?: string;
     theme?: string;
     fullWidth?: boolean;
     optionsListWidth?: string;
@@ -96,11 +98,13 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<__
     optionIconType: any;
     optionEndIconKey: string;
     optionEndIconType: any;
+    optionFlagKey: any;
     valueToCopy: any;
     disabledOptionKey: string;
     optionTwoLinesVariant: any;
     optionTwoLinesKey: any;
     groupedOptions: boolean;
+    comparingKey: any;
     fullWidth: boolean;
     optionsListWidth: any;
     statusType: any;
@@ -163,11 +167,13 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<__
     optionIconType?: "fill" | "bold" | "regular" | "branded" | "ad-unit" | "ab-test" | "ad-networks" | "ad-networks/flat" | "content-rate";
     optionEndIconKey?: string;
     optionEndIconType?: "fill" | "bold" | "regular" | "branded" | "ad-unit" | "ab-test" | "ad-networks" | "ad-networks/flat" | "content-rate";
+    optionFlagKey?: string;
     valueToCopy?: string;
     disabledOptionKey?: string;
     optionTwoLinesVariant?: "horizontal" | "vertical";
     optionTwoLinesKey?: string;
     groupedOptions?: boolean;
+    comparingKey?: string;
     theme?: string;
     fullWidth?: boolean;
     optionsListWidth?: string;
@@ -216,11 +222,13 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<__
     optionIconType: any;
     optionEndIconKey: string;
     optionEndIconType: any;
+    optionFlagKey: any;
     valueToCopy: any;
     disabledOptionKey: string;
     optionTwoLinesVariant: any;
     optionTwoLinesKey: any;
     groupedOptions: boolean;
+    comparingKey: any;
     fullWidth: boolean;
     optionsListWidth: any;
     statusType: any;
@@ -277,11 +285,13 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<__
     optionIconType: "fill" | "bold" | "regular" | "branded" | "ad-unit" | "ab-test" | "ad-networks" | "ad-networks/flat" | "content-rate";
     optionEndIconKey: string;
     optionEndIconType: "fill" | "bold" | "regular" | "branded" | "ad-unit" | "ab-test" | "ad-networks" | "ad-networks/flat" | "content-rate";
+    optionFlagKey: string;
     valueToCopy: string;
     disabledOptionKey: string;
     optionTwoLinesVariant: "horizontal" | "vertical";
     optionTwoLinesKey: string;
     groupedOptions: boolean;
+    comparingKey: string;
     fullWidth: boolean;
     optionsListWidth: string;
     statusType: "default" | "disabled" | "success" | "warning" | "error" | "archive";
@@ -314,11 +324,13 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<__
             optionIconType: "fill" | "bold" | "regular" | "branded" | "ad-unit" | "ab-test" | "ad-networks" | "ad-networks/flat" | "content-rate";
             optionAndIconKey: string;
             optionEndIconType: "fill" | "bold" | "regular" | "branded" | "ad-unit" | "ab-test" | "ad-networks" | "ad-networks/flat" | "content-rate";
+            optionFlagKey: string;
             feedbackVariant: "success" | "warning" | "error";
             valueToCopy: string;
             statusDotType: "default" | "disabled" | "success" | "warning" | "error" | "archive";
             size: "small" | "medium" | "large";
             showAllSelectedText: boolean;
+            allSelected: boolean;
             onKeydown: (event: any) => void;
             onClick: () => void;
         };

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

@@ -1,8 +1,8 @@
 import o from "./DropdownV4.vue2.js";
-/* empty css                 *//* empty css                 */import e from "../../../_virtual/_plugin-vue_export-helper.js";
-// import "../../../DropdownV4.vue_vue_type_style_index_0_scoped_62a620ee_lang.css"; //*');
+/* empty css                 *//* empty css                 */import _ from "../../../_virtual/_plugin-vue_export-helper.js";
+// import "../../../DropdownV4.vue_vue_type_style_index_0_scoped_899679d0_lang.css"; //*');
 // import "../../../DropdownV4.vue_vue_type_style_index_1_lang.css";  //');
-const r = /* @__PURE__ */ e(o, [["__scopeId", "data-v-62a620ee"]]);
+const r = /* @__PURE__ */ _(o, [["__scopeId", "data-v-899679d0"]]);
 export {
   r as default
 };