@ironsource/shared-ui 2.1.9-test.0 → 2.1.9-test.1

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

@@ -1,12 +1,11 @@
-import { IconTypes } from '@/components/icon/v4/Icon.types';
-declare const _default: import("vue").DefineComponent<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<{
+declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<{
     label: string;
-    variant?: 'outlined' | 'text';
-    size?: 'small' | 'medium';
+    variant?: "text" | "outlined";
+    size?: "small" | "medium";
     open?: boolean;
     disabled?: boolean;
     startIconName?: string;
-    startIconType?: IconTypes;
+    startIconType?: "fill" | "bold" | "regular" | "branded" | "ad-unit" | "ab-test" | "ad-networks" | "ad-networks/flat" | "content-rate";
     hideEndIcon?: boolean;
     testId?: string;
 }>, {
@@ -22,12 +21,12 @@ declare const _default: import("vue").DefineComponent<__VLS_WithDefaults<__VLS_T
     click: () => void;
 }, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<{
     label: string;
-    variant?: 'outlined' | 'text';
-    size?: 'small' | 'medium';
+    variant?: "text" | "outlined";
+    size?: "small" | "medium";
     open?: boolean;
     disabled?: boolean;
     startIconName?: string;
-    startIconType?: IconTypes;
+    startIconType?: "fill" | "bold" | "regular" | "branded" | "ad-unit" | "ab-test" | "ad-networks" | "ad-networks/flat" | "content-rate";
     hideEndIcon?: boolean;
     testId?: string;
 }>, {
@@ -43,13 +42,15 @@ declare const _default: import("vue").DefineComponent<__VLS_WithDefaults<__VLS_T
     onClick?: () => any;
 }, {
     testId: string;
-    variant: 'outlined' | 'text';
+    variant: "text" | "outlined";
     disabled: boolean;
-    size: 'small' | 'medium';
+    size: "small" | "medium";
     open: boolean;
     startIconName: string;
-    startIconType: IconTypes;
+    startIconType: "fill" | "bold" | "regular" | "branded" | "ad-unit" | "ab-test" | "ad-networks" | "ad-networks/flat" | "content-rate";
     hideEndIcon: boolean;
+}>, {
+    default?(_: {}): any;
 }>;
 export default _default;
 type __VLS_NonUndefinedable<T> = T extends undefined ? never : T;
@@ -69,3 +70,8 @@ type __VLS_WithDefaults<P, D> = {
 type __VLS_Prettify<T> = {
     [K in keyof T]: T[K];
 } & {};
+type __VLS_WithTemplateSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

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

@@ -1,7 +1,7 @@
 import o from "./ButtonDropdownTrigger.vue2.js";
-/* empty css                            */import e from "../../../_virtual/_plugin-vue_export-helper.js";
-// import "../../../ButtonDropdownTrigger.vue_vue_type_style_index_0_scoped_23e22560_lang.css"; //*');
-const p = /* @__PURE__ */ e(o, [["__scopeId", "data-v-23e22560"]]);
+/* empty css                            */import t from "../../../_virtual/_plugin-vue_export-helper.js";
+// import "../../../ButtonDropdownTrigger.vue_vue_type_style_index_0_scoped_76c74f58_lang.css"; //*');
+const p = /* @__PURE__ */ t(o, [["__scopeId", "data-v-76c74f58"]]);
 export {
   p as default
 };

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

@@ -1,8 +1,9 @@
- import "../../../ButtonDropdownTrigger.vue_vue_type_style_index_0_scoped_23e22560_lang.css"; import { defineComponent as a, openBlock as l, createBlock as o, unref as i, normalizeClass as d } from "vue";
-import r from "../../button/v4/ButtonV4.vue.js";
+ import "../../../ButtonDropdownTrigger.vue_vue_type_style_index_0_scoped_76c74f58_lang.css"; import { defineComponent as l, openBlock as o, createBlock as i, unref as d, normalizeClass as r, withCtx as s, renderSlot as c, createTextVNode as u, toDisplayString as f } from "vue";
+import m from "../../button/v4/ButtonV4.vue.js";
 import "../../button/v4/IconButtonV4.vue.js";
 import "../../button/v4/ButtonGroup.vue.js";
-const b = /* @__PURE__ */ a({
+import "../../button/v4/ToggleButtonGroupAB.vue.js";
+const p = /* @__PURE__ */ l({
   __name: "ButtonDropdownTrigger",
   props: {
     label: null,
@@ -16,9 +17,9 @@ const b = /* @__PURE__ */ a({
     testId: { default: "" }
   },
   emits: ["click"],
-  setup(e, { emit: n }) {
-    return (c, t) => (l(), o(i(r), {
-      class: d(["button-trigger", { open: e.open }]),
+  setup(e, { emit: a }) {
+    return (n, t) => (o(), i(d(m), {
+      class: r(["button-trigger", { open: e.open }]),
       disabled: e.disabled,
       color: "default",
       variant: e.variant,
@@ -28,10 +29,17 @@ const b = /* @__PURE__ */ a({
       "end-icon-name": e.hideEndIcon ? null : "caret-down",
       content: e.label,
       "test-id": e.testId,
-      onClick: t[0] || (t[0] = (s) => n("click"))
-    }, null, 8, ["class", "disabled", "variant", "size", "start-icon-name", "start-icon-type", "end-icon-name", "content", "test-id"]));
+      onClick: t[0] || (t[0] = (b) => a("click"))
+    }, {
+      default: s(() => [
+        c(n.$slots, "default", {}, () => [
+          u(f(e.label), 1)
+        ], !0)
+      ]),
+      _: 3
+    }, 8, ["class", "disabled", "variant", "size", "start-icon-name", "start-icon-type", "end-icon-name", "content", "test-id"]));
   }
 });
 export {
-  b as default
+  p as default
 };

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

@@ -5,6 +5,7 @@ declare const _default: import("vue").DefineComponent<__VLS_WithDefaults<__VLS_T
     disabled?: boolean;
     feedbackVariant?: string;
     displayedValue: any;
+    allSelected?: boolean;
     options: unknown[];
     selectedOption: unknown | unknown[];
     displayValue: (option: unknown) => string;
@@ -16,6 +17,7 @@ declare const _default: import("vue").DefineComponent<__VLS_WithDefaults<__VLS_T
     disabled: boolean;
     feedbackVariant: string;
     displayedValue: string;
+    allSelected: boolean;
 }>, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
     clear: () => void;
 }, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<{
@@ -25,6 +27,7 @@ declare const _default: import("vue").DefineComponent<__VLS_WithDefaults<__VLS_T
     disabled?: boolean;
     feedbackVariant?: string;
     displayedValue: any;
+    allSelected?: boolean;
     options: unknown[];
     selectedOption: unknown | unknown[];
     displayValue: (option: unknown) => string;
@@ -36,6 +39,7 @@ declare const _default: import("vue").DefineComponent<__VLS_WithDefaults<__VLS_T
     disabled: boolean;
     feedbackVariant: string;
     displayedValue: string;
+    allSelected: boolean;
 }>>> & {
     onClear?: () => any;
 }, {
@@ -44,6 +48,7 @@ declare const _default: import("vue").DefineComponent<__VLS_WithDefaults<__VLS_T
     disabled: boolean;
     open: boolean;
     feedbackVariant: string;
+    allSelected: boolean;
     displayedValue: any;
 }>;
 export default _default;

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_a8fdae89_lang.css"; //*');
-const s = /* @__PURE__ */ e(o, [["__scopeId", "data-v-a8fdae89"]]);
+// import "../../../ChipDropdownTrigger.vue_vue_type_style_index_0_scoped_49bd7193_lang.css"; //*');
+const s = /* @__PURE__ */ e(o, [["__scopeId", "data-v-49bd7193"]]);
 export {
   s as default
 };

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,13 +132,16 @@ 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";
+    allSelected: boolean;
     selectedOption: any;
     showFeedbackIcon: boolean;
     brandIconType: "android" | "ios";
     showAllSelectedText: boolean;
+    optionFlagKey: string;
     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

@@ -251,9 +251,10 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<__
     size: "small" | "medium" | "large";
     flip: boolean;
     mandatory: boolean;
+    skidding: number;
+    modelValue: any;
     selected: any;
     onClear: () => void;
-    modelValue: any;
     placeholder: string;
     multi: boolean;
     showSelectAll: boolean;
@@ -262,7 +263,6 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<__
     autoSize: boolean;
     disableKeyboardEvents: boolean;
     isOnTop: boolean;
-    skidding: number;
     triggerLabel: string;
     triggerHelperText: string;
     triggerFeedbackText: string;

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_119e4bc3_lang.css"; //*');
+/* empty css                 *//* empty css                 */import _ from "../../../_virtual/_plugin-vue_export-helper.js";
+// import "../../../DropdownV4.vue_vue_type_style_index_0_scoped_360883b1_lang.css"; //*');
 // import "../../../DropdownV4.vue_vue_type_style_index_1_lang.css";  //');
-const r = /* @__PURE__ */ e(o, [["__scopeId", "data-v-119e4bc3"]]);
+const r = /* @__PURE__ */ _(o, [["__scopeId", "data-v-360883b1"]]);
 export {
   r as default
 };

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

@@ -1,7 +1,8 @@
- import "../../../DropdownV4.vue_vue_type_style_index_0_scoped_119e4bc3_lang.css";  import "../../../DropdownV4.vue_vue_type_style_index_1_lang.css";  import { defineComponent as ce, computed as G, openBlock as i, createElementBlock as a, mergeProps as c, unref as t, renderSlot as T, createElementVNode as m, createVNode as n, withCtx as s, Transition as ye, normalizeClass as K, normalizeStyle as fe, createTextVNode as p, createCommentVNode as d, isRef as me, toDisplayString as U, withModifiers as W, Fragment as pe, renderList as ge, toRaw as I, createBlock as M, resolveDynamicComponent as Te } from "vue";
+ import "../../../DropdownV4.vue_vue_type_style_index_0_scoped_360883b1_lang.css";  import "../../../DropdownV4.vue_vue_type_style_index_1_lang.css";  import { defineComponent as ce, computed as G, openBlock as i, createElementBlock as a, mergeProps as c, unref as t, renderSlot as T, createElementVNode as m, createVNode as n, withCtx as s, Transition as ye, normalizeClass as K, normalizeStyle as fe, createTextVNode as p, createCommentVNode as d, isRef as me, toDisplayString as U, withModifiers as W, Fragment as pe, renderList as ge, toRaw as I, createBlock as M, resolveDynamicComponent as Te } from "vue";
 import L from "../../button/v4/ButtonV4.vue.js";
 import "../../button/v4/IconButtonV4.vue.js";
 import "../../button/v4/ButtonGroup.vue.js";
+import "../../button/v4/ToggleButtonGroupAB.vue.js";
 import "./DropdownV4.vue.js";
 import ke from "./DefaultDropdownTrigger.vue.js";
 import be from "./IconButtonDropdownTrigger.vue.js";
@@ -34,7 +35,7 @@ const Ee = ["tabindex"], Be = { style: { width: "100%" } }, Ne = { key: 0 }, Ve
 }, xe = { key: 2 }, $e = ["aria-selected", "aria-disabled", "onClick"], He = {
   key: 1,
   class: "actions-wrapper"
-}, Ge = { class: "actions-clear-all" }, Ue = { class: "actions-apply-cancel" }, pt = /* @__PURE__ */ ce({
+}, Ge = { class: "actions-clear-all" }, Ue = { class: "actions-apply-cancel" }, gt = /* @__PURE__ */ ce({
   __name: "DropdownV4",
   props: {
     modelValue: { default: null },
@@ -258,7 +259,7 @@ const Ee = ["tabindex"], Be = { style: { width: "100%" } }, Ne = { key: 0 }, Ve
                             }
                           ), {
                             default: s(() => [
-                              p("Select all ")
+                              p(" Select all ")
                             ]),
                             _: 1
                           }, 16, ["aria-selected", "aria-disabled", "selected-prop", "is-indeterminate"])
@@ -348,7 +349,7 @@ const Ee = ["tabindex"], Be = { style: { width: "100%" } }, Ne = { key: 0 }, Ve
                           class: "apply-button"
                         }, t(f)[t(y).ACTION_APPLY], { onClick: t(oe) }), {
                           default: s(() => [
-                            p("Apply ")
+                            p(" Apply ")
                           ]),
                           _: 1
                         }, 16, ["onClick"])
@@ -472,5 +473,5 @@ const Ee = ["tabindex"], Be = { style: { width: "100%" } }, Ne = { key: 0 }, Ve
   }
 });
 export {
-  pt as default
+  gt as default
 };

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

@@ -2,19 +2,20 @@
 import "../../button/v4/ButtonV4.vue.js";
 import m from "../../button/v4/IconButtonV4.vue.js";
 import "../../button/v4/ButtonGroup.vue.js";
-const l = /* @__PURE__ */ e({
+import "../../button/v4/ToggleButtonGroupAB.vue.js";
+const _ = /* @__PURE__ */ e({
   __name: "IconButtonDropdownTrigger",
   props: {
     testId: { default: "" }
   },
   setup(o) {
     const t = o;
-    return (s, u) => (r(), n(p(m), c({
+    return (s, i) => (r(), n(p(m), c({
       "icon-name": "dots-three",
       type: "bold"
     }, t), null, 16));
   }
 });
 export {
-  l as default
+  _ as default
 };

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

@@ -19,6 +19,7 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<__
     optionTwoLinesVariant?: "horizontal" | "vertical";
     optionTwoLinesKey?: string;
     treeChildShown?: boolean;
+    optionFlagKey?: string;
 }>, {
     subtitle: string;
     disabled: boolean;
@@ -39,6 +40,7 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<__
     optionTwoLinesVariant: any;
     optionTwoLinesKey: any;
     treeChildShown: boolean;
+    optionFlagKey: any;
 }>, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
     toggleTreeCollapse: (option: unknown) => void;
 }, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<{
@@ -62,6 +64,7 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<__
     optionTwoLinesVariant?: "horizontal" | "vertical";
     optionTwoLinesKey?: string;
     treeChildShown?: boolean;
+    optionFlagKey?: string;
 }>, {
     subtitle: string;
     disabled: boolean;
@@ -82,6 +85,7 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<__
     optionTwoLinesVariant: any;
     optionTwoLinesKey: any;
     treeChildShown: boolean;
+    optionFlagKey: any;
 }>>> & {
     onToggleTreeCollapse?: (option: unknown) => any;
 }, {
@@ -92,6 +96,7 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<__
     optionTwoLinesVariant: "horizontal" | "vertical";
     optionTwoLinesKey: string;
     isIndeterminate: boolean;
+    optionFlagKey: string;
     subtitle: string;
     selectAllOption: boolean;
     nameKey: string;
@@ -106,6 +111,7 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<__
     treeChildShown: boolean;
 }>, {
     image?(_: {}): any;
+    flag?(_: {}): any;
     "icon-start"?(_: {}): any;
     default?(_: {}): any;
     "icon-end"?(_: {}): any;