@ironsource/shared-ui 2.1.8-rc.6 → 2.1.8-rc.8

package/components/dialog/v4/DialogV4.vue2.js

@@ -1,8 +1,9 @@
- import "../../../DialogV4.vue_vue_type_style_index_0_scoped_09c488cf_lang.css"; import { defineComponent as A, openBlock as o, createBlock as c, Teleport as w, createVNode as b, Transition as I, withCtx as u, unref as e, createElementBlock as m, createElementVNode as C, mergeProps as s, renderSlot as k, createTextVNode as f, toDisplayString as B, createCommentVNode as d } from "vue";
-import { NOOP as V } from "@vue/shared";
+ import "../../../DialogV4.vue_vue_type_style_index_0_scoped_09c488cf_lang.css"; import { defineComponent as A, openBlock as o, createBlock as c, Teleport as w, createVNode as b, Transition as p, withCtx as u, unref as e, createElementBlock as m, createElementVNode as C, mergeProps as s, renderSlot as k, createTextVNode as f, toDisplayString as B, createCommentVNode as d } from "vue";
+import { NOOP as I } from "@vue/shared";
 import T from "../../typography/v4/Typography.vue.js";
 import N from "../../button/v4/ButtonV4.vue.js";
-import p from "../../button/v4/IconButtonV4.vue.js";
+import V from "../../button/v4/IconButtonV4.vue.js";
+import "../../button/v4/ButtonGroup.vue.js";
 import { Reason as g } from "../common/Reason.js";
 import { dialogCommon as D } from "../common/Dialog.common.js";
 import { DialogTestIdModifiers as l } from "../../../testids/index.js";
@@ -14,7 +15,7 @@ const S = {
 }, F = { class: "title" }, U = {
   key: 1,
   class: "footer"
-}, Q = /* @__PURE__ */ A({
+}, X = /* @__PURE__ */ A({
   __name: "DialogV4",
   props: {
     modelValue: { type: Boolean },
@@ -46,13 +47,13 @@ const S = {
     });
     const E = () => {
       const { closeOnClickOutside: r, saveButtonLoading: n } = i;
-      r && !n ? y(g.Backdrop) : V();
+      r && !n ? y(g.Backdrop) : I();
     };
     return (r, n) => (o(), c(w, {
       to: "body",
       disabled: !t.appendToBody
     }, [
-      b(I, null, {
+      b(p, null, {
         default: u(() => [
           e(h) ? (o(), m("div", S, [
             C("div", s({
@@ -85,7 +86,7 @@ const S = {
                     })) : d("", !0)
                   ], !0)
                 ]),
-                t.showCloseButton ? (o(), c(e(p), s({
+                t.showCloseButton ? (o(), c(e(V), s({
                   key: 0,
                   class: "close-button",
                   "icon-name": "x",
@@ -151,5 +152,5 @@ const S = {
   }
 });
 export {
-  Q as default
+  X as default
 };

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

@@ -1,7 +1,8 @@
  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 c from "../../button/v4/ButtonV4.vue.js";
+import r from "../../button/v4/ButtonV4.vue.js";
 import "../../button/v4/IconButtonV4.vue.js";
-const I = /* @__PURE__ */ a({
+import "../../button/v4/ButtonGroup.vue.js";
+const b = /* @__PURE__ */ a({
   __name: "ButtonDropdownTrigger",
   props: {
     label: null,
@@ -16,7 +17,7 @@ const I = /* @__PURE__ */ a({
   },
   emits: ["click"],
   setup(e, { emit: n }) {
-    return (r, t) => (l(), o(i(c), {
+    return (c, t) => (l(), o(i(r), {
       class: d(["button-trigger", { open: e.open }]),
       disabled: e.disabled,
       color: "default",
@@ -32,5 +33,5 @@ const I = /* @__PURE__ */ a({
   }
 });
 export {
-  I as default
+  b as default
 };

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

@@ -132,6 +132,7 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<__
 }>, {
     image?(_: {}): any;
     "icon-start"?(_: {}): any;
+    "displayed-value"?(_: {}): any;
     "end-icon"?(_: {}): any;
 }>;
 export default _default;

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_1726ad49_lang.css"; //*');
-const p = /* @__PURE__ */ e(o, [["__scopeId", "data-v-1726ad49"]]);
+// import "../../../DefaultDropdownTrigger.vue_vue_type_style_index_0_scoped_fd7a490e_lang.css"; //*');
+const p = /* @__PURE__ */ e(o, [["__scopeId", "data-v-fd7a490e"]]);
 export {
   p as default
 };

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

@@ -1,12 +1,12 @@
- import "../../../DefaultDropdownTrigger.vue_vue_type_style_index_0_scoped_1726ad49_lang.css"; import { defineComponent as O, computed as r, openBlock as o, createElementBlock as n, createBlock as k, createCommentVNode as d, createElementVNode as c, mergeProps as m, unref as l, renderSlot as u, createVNode as i, withCtx as I, createTextVNode as B, toDisplayString as w } from "vue";
+ 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 "../../icon/v4/IconFlag.vue.js";
-import x from "../../shared/FieldLabel.vue.js";
-import { useTestIdAttrs as A } from "../../../utils/testIds.js";
-import D from "../../statusDot/StatusDot.vue.js";
-const $ = { class: "default-dropdown-wrapper" }, N = { class: "content" }, K = {
+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 = {
   key: 0,
   class: "image"
 }, C = ["src"], S = {
@@ -46,11 +46,11 @@ const $ = { class: "default-dropdown-wrapper" }, N = { class: "content" }, K = {
   },
   emits: ["click"],
   setup(t, { emit: T }) {
-    const e = t, g = r(
+    const e = t, g = c(
       () => e.feedbackVariant ? `state-${e.feedbackVariant}` : ""
-    ), b = () => {
+    ), v = () => {
       T("click");
-    }, f = A(e.testId, p), v = r(() => 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 = r(() => {
+    }, 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(() => {
       if (!e.selectedOption)
         return null;
       if (!e.multi)
@@ -58,8 +58,8 @@ const $ = { class: "default-dropdown-wrapper" }, N = { class: "content" }, K = {
       if (Array.isArray(e.selectedOption))
         return e.selectedOption.length === 1 ? e.selectedOption[0] : null;
     });
-    return (a, y) => (o(), n("div", $, [
-      t.label ? (o(), k(x, {
+    return (o, y) => (a(), n("div", D, [
+      t.label ? (a(), k(A, {
         key: 0,
         label: t.label,
         mandatory: t.mandatory,
@@ -69,44 +69,46 @@ const $ = { class: "default-dropdown-wrapper" }, N = { class: "content" }, K = {
         "test-id": t.testId,
         class: "dropdown-field-label"
       }, null, 8, ["label", "mandatory", "hover-help-text", "hover-help-text-placement", "disabled", "test-id"])) : d("", !0),
-      c("div", m({
+      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) => b())
+        onClick: y[0] || (y[0] = (H) => v())
       }), [
-        c("div", N, [
-          a.$slots.image || l(s) && t.optionImageKey ? (o(), n("div", K, [
-            u(a.$slots, "image", {}, () => [
-              t.optionImageKey ? (o(), n("img", {
+        u("div", N, [
+          o.$slots.image || l(s) && t.optionImageKey ? (a(), n("div", K, [
+            i(o.$slots, "image", {}, () => [
+              t.optionImageKey ? (a(), n("img", {
                 key: 0,
                 src: l(s)[t.optionImageKey]
               }, null, 8, C)) : d("", !0)
             ], !0)
           ])) : d("", !0),
-          a.$slots["icon-start"] || l(s) && t.optionIconKey ? (o(), n("div", S, [
-            u(a.$slots, "icon-start", {}, () => [
-              i(l(h), {
+          o.$slots["icon-start"] || l(s) && t.optionIconKey ? (a(), n("div", S, [
+            i(o.$slots, "icon-start", {}, () => [
+              r(l(h), {
                 type: t.optionIconType,
                 name: l(s)[t.optionIconKey],
                 size: "20px"
               }, null, 8, ["type", "name"])
             ], !0)
           ])) : d("", !0),
-          t.statusDotType ? (o(), n("div", P, [
-            i(l(D), { type: t.statusDotType }, null, 8, ["type"])
+          t.statusDotType ? (a(), n("div", P, [
+            r(l(x), { type: t.statusDotType }, null, 8, ["type"])
           ])) : d("", !0),
-          i(l(V), m({ variant: "body1" }, l(f)[l(p).BUTTON_CONTENT], { class: "displayed-value" }), {
-            default: I(() => [
-              B(w(l(v)), 1)
-            ]),
-            _: 1
-          }, 16)
+          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)
+              ]),
+              _: 1
+            }, 16)
+          ], !0)
         ]),
-        a.$slots["end-icon"] ? (o(), n("div", z, [
-          u(a.$slots, "end-icon", {}, void 0, !0)
+        o.$slots["end-icon"] ? (a(), n("div", z, [
+          i(o.$slots, "end-icon", {}, void 0, !0)
         ])) : d("", !0),
-        c("div", E, [
-          i(l(h), {
+        u("div", E, [
+          r(l(h), {
             name: "caret-down",
             size: "20px"
           })

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

@@ -1,6 +1,7 @@
  import "../../../DropdownV4.vue_vue_type_style_index_0_scoped_00ccab6b_lang.css";  import "../../../DropdownV4.vue_vue_type_style_index_1_lang.css";  import { defineComponent as se, computed as H, openBlock as i, createElementBlock as n, mergeProps as u, unref as t, renderSlot as I, createElementVNode as m, createVNode as a, withCtx as c, Transition as ue, normalizeClass as K, normalizeStyle as ce, isRef as ye, createCommentVNode as r, createTextVNode as T, toDisplayString as fe, withModifiers as U, Fragment as me, renderList as pe, toRaw as w, createBlock as W, resolveDynamicComponent as ge } from "vue";
 import L from "../../button/v4/ButtonV4.vue.js";
 import "../../button/v4/IconButtonV4.vue.js";
+import "../../button/v4/ButtonGroup.vue.js";
 import "./DropdownV4.vue.js";
 import Te from "./DefaultDropdownTrigger.vue.js";
 import be from "./IconButtonDropdownTrigger.vue.js";
@@ -32,7 +33,7 @@ const Le = ["tabindex"], Ee = { style: { width: "100%" } }, Oe = { key: 0 }, Be
 }, Pe = { key: 2 }, Re = ["aria-selected", "aria-disabled", "onClick"], ze = {
   key: 1,
   class: "actions-wrapper"
-}, xe = { class: "actions-clear-all" }, $e = { class: "actions-apply-cancel" }, ut = /* @__PURE__ */ se({
+}, xe = { class: "actions-clear-all" }, $e = { class: "actions-apply-cancel" }, ct = /* @__PURE__ */ se({
   __name: "DropdownV4",
   props: {
     modelValue: { default: null },
@@ -449,5 +450,5 @@ const Le = ["tabindex"], Ee = { style: { width: "100%" } }, Oe = { key: 0 }, Be
   }
 });
 export {
-  ut as default
+  ct as default
 };

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

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

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

@@ -552,6 +552,7 @@ declare const DropdownTypes: () => (({
     $slots: {
         image?(_: {}): any;
         "icon-start"?(_: {}): any;
+        "displayed-value"?(_: {}): any;
         "end-icon"?(_: {}): any;
     };
 })) | ({

package/components/emptyState/v4/EmptyStateV4.vue2.js

@@ -1,12 +1,13 @@
- import "../../../EmptyStateV4.vue_vue_type_style_index_0_scoped_24001caa_lang.css"; import v from "../../../_virtual/dynamic-import-helper.js";
-import { defineComponent as y, computed as p, defineAsyncComponent as b, openBlock as e, createElementBlock as k, createBlock as n, unref as i, createCommentVNode as a, createElementVNode as N, renderSlot as u, withCtx as c, createTextVNode as l, toDisplayString as r } from "vue";
+ import "../../../EmptyStateV4.vue_vue_type_style_index_0_scoped_24001caa_lang.css"; import p from "../../../_virtual/dynamic-import-helper.js";
+import { defineComponent as v, computed as y, defineAsyncComponent as b, openBlock as e, createElementBlock as k, createBlock as n, unref as i, createCommentVNode as a, createElementVNode as N, renderSlot as m, withCtx as c, createTextVNode as r, toDisplayString as l } from "vue";
 import I from "../../button/v4/ButtonV4.vue.js";
 import "../../button/v4/IconButtonV4.vue.js";
-import m from "../../typography/v4/Typography.vue.js";
+import "../../button/v4/ButtonGroup.vue.js";
+import u from "../../typography/v4/Typography.vue.js";
 import { capitalizeFirstLetter as C, snakeCaseToCamelCase as T } from "../../../utils/string.js";
 import S from "../../icon/v4/IconV4.vue.js";
 import "../../icon/v4/IconFlag.vue.js";
-const g = { class: "empty-state" }, x = { class: "title-wrapper" }, F = /* @__PURE__ */ y({
+const g = { class: "empty-state" }, x = { class: "title-wrapper" }, R = /* @__PURE__ */ v({
   __name: "EmptyStateV4",
   props: {
     title: { default: "No data to display" },
@@ -19,9 +20,9 @@ const g = { class: "empty-state" }, x = { class: "title-wrapper" }, F = /* @__PU
   },
   emits: ["click"],
   setup(t) {
-    const d = t, f = p(() => {
+    const d = t, f = y(() => {
       const o = C(T(d.variant));
-      return b(() => v(/* @__PURE__ */ Object.assign({ "./icons/IconError.vue": () => import("./icons/IconError.vue.js"), "./icons/IconFiles.vue": () => import("./icons/IconFiles.vue.js"), "./icons/IconNoAccess.vue": () => import("./icons/IconNoAccess.vue.js"), "./icons/IconNoData.vue": () => import("./icons/IconNoData.vue.js"), "./icons/IconNoResults.vue": () => import("./icons/IconNoResults.vue.js"), "./icons/IconSettings.vue": () => import("./icons/IconSettings.vue.js") }), `./icons/Icon${o}.vue`));
+      return b(() => p(/* @__PURE__ */ Object.assign({ "./icons/IconError.vue": () => import("./icons/IconError.vue.js"), "./icons/IconFiles.vue": () => import("./icons/IconFiles.vue.js"), "./icons/IconNoAccess.vue": () => import("./icons/IconNoAccess.vue.js"), "./icons/IconNoData.vue": () => import("./icons/IconNoData.vue.js"), "./icons/IconNoResults.vue": () => import("./icons/IconNoResults.vue.js"), "./icons/IconSettings.vue": () => import("./icons/IconSettings.vue.js") }), `./icons/Icon${o}.vue`));
     });
     return (o, s) => (e(), k("div", g, [
       t.variant && !t.iconName ? (e(), n(i(f), {
@@ -36,30 +37,30 @@ const g = { class: "empty-state" }, x = { class: "title-wrapper" }, F = /* @__PU
         type: t.iconType
       }, null, 8, ["name", "size", "type"])) : a("", !0),
       N("div", x, [
-        u(o.$slots, "content", {}, () => [
-          t.title ? (e(), n(i(m), {
+        m(o.$slots, "content", {}, () => [
+          t.title ? (e(), n(i(u), {
             key: 0,
             variant: "h4",
             class: "title"
           }, {
             default: c(() => [
-              l(r(t.title), 1)
+              r(l(t.title), 1)
             ]),
             _: 1
           })) : a("", !0),
-          t.subtitle ? (e(), n(i(m), {
+          t.subtitle ? (e(), n(i(u), {
             key: 1,
             variant: "body1",
             class: "subtitle"
           }, {
             default: c(() => [
-              l(r(t.subtitle), 1)
+              r(l(t.subtitle), 1)
             ]),
             _: 1
           })) : a("", !0)
         ], !0)
       ]),
-      u(o.$slots, "button", {}, () => [
+      m(o.$slots, "button", {}, () => [
         t.buttonText ? (e(), n(i(I), {
           key: 0,
           variant: "outlined",
@@ -68,7 +69,7 @@ const g = { class: "empty-state" }, x = { class: "title-wrapper" }, F = /* @__PU
           onClick: s[0] || (s[0] = (z) => o.$emit("click"))
         }, {
           default: c(() => [
-            l(r(t.buttonText), 1)
+            r(l(t.buttonText), 1)
           ]),
           _: 1
         })) : a("", !0)
@@ -77,5 +78,5 @@ const g = { class: "empty-state" }, x = { class: "title-wrapper" }, F = /* @__PU
   }
 });
 export {
-  F as default
+  R as default
 };

package/components/forms/FormCard.vue2.js

@@ -2,13 +2,14 @@
 import b from "../typography/v4/Typography.vue.js";
 import k from "../button/v4/ButtonV4.vue.js";
 import "../button/v4/IconButtonV4.vue.js";
+import "../button/v4/ButtonGroup.vue.js";
 import { FormCardTestIdModifiers as o } from "../../testids/index.js";
 import { useTestIdAttrs as N } from "../../utils/testIds.js";
 import i from "../skeleton/v4/SkeletonV4.vue.js";
 const h = { class: "form-card" }, p = {
   key: 1,
   class: "content-skeleton-container"
-}, P = /* @__PURE__ */ B({
+}, z = /* @__PURE__ */ B({
   __name: "FormCard",
   props: {
     title: { default: "" },
@@ -97,5 +98,5 @@ const h = { class: "form-card" }, p = {
   }
 });
 export {
-  P as default
+  z as default
 };

package/components/loader/v4/index.js

@@ -0,0 +1,6 @@
+import o from "./Loader.vue.js";
+const e = () => [o];
+export {
+  o as Loader,
+  e as LoaderTypes
+};

package/components/multibar/MultiBar.vue2.js

@@ -1,8 +1,9 @@
- import "../../MultiBar.vue_vue_type_style_index_0_scoped_71617643_lang.css"; import { defineComponent as k, computed as v, openBlock as l, createBlock as d, Teleport as x, createVNode as u, Transition as g, withCtx as c, unref as e, createElementBlock as r, mergeProps as B, createElementVNode as V, createTextVNode as h, toDisplayString as A, createCommentVNode as m, Fragment as z, renderList as M, normalizeClass as N } from "vue";
+ import "../../MultiBar.vue_vue_type_style_index_0_scoped_71617643_lang.css"; import { defineComponent as k, computed as v, openBlock as l, createBlock as d, Teleport as x, createVNode as u, Transition as g, withCtx as c, unref as t, createElementBlock as r, mergeProps as B, createElementVNode as V, createTextVNode as h, toDisplayString as A, createCommentVNode as m, Fragment as z, renderList as M, normalizeClass as N } from "vue";
 import { useVModel as $ } from "@vueuse/core";
 import E from "../typography/v4/Typography.vue.js";
 import S from "../button/v4/ButtonV4.vue.js";
 import P from "../button/v4/IconButtonV4.vue.js";
+import "../button/v4/ButtonGroup.vue.js";
 import w from "./MultiBarMenu.vue.js";
 import { useTestIdAttrs as L } from "../../utils/testIds.js";
 import { MultiBarTestIdModifiers as n } from "../../testids/index.js";
@@ -11,7 +12,7 @@ const O = { class: "multi-bar-panel" }, R = {
   class: "count-text"
 }, D = {
   inheritAttrs: !1
-}, X = /* @__PURE__ */ k({
+}, Y = /* @__PURE__ */ k({
   ...D,
   __name: "MultiBar",
   props: {
@@ -27,22 +28,22 @@ const O = { class: "multi-bar-panel" }, R = {
   },
   emits: ["update:modelValue", "close", "action"],
   setup(o, { emit: s }) {
-    const t = o, f = $(t, "modelValue", s), I = () => {
+    const e = o, f = $(e, "modelValue", s), I = () => {
       f.value = !1, s("close");
     }, b = (a) => {
       s("action", a);
     }, p = v(
-      () => t.actions.length > t.visibleActionsCount ? t.actions.slice(0, t.visibleActionsCount) : t.actions
+      () => e.actions.length > e.visibleActionsCount ? e.actions.slice(0, e.visibleActionsCount) : e.actions
     ), C = v(
-      () => t.actions.length > t.visibleActionsCount ? t.actions.slice(t.visibleActionsCount) : []
-    ), y = L(t.testId, n);
+      () => e.actions.length > e.visibleActionsCount ? e.actions.slice(e.visibleActionsCount) : []
+    ), y = L(e.testId, n);
     return (a, F) => (l(), d(x, {
       to: "body",
       disabled: !o.appendToBody
     }, [
       u(g, { name: "multi-bar" }, {
         default: c(() => [
-          e(f) ? (l(), r("div", B({
+          t(f) ? (l(), r("div", B({
             key: 0,
             class: ["multi-bar", {
               "light-theme-v4": !0,
@@ -53,29 +54,29 @@ const O = { class: "multi-bar-panel" }, R = {
               "multi-bar--left": o.position === "left"
             }],
             style: { zIndex: o.zIndex }
-          }, { ...a.$attrs, ...e(y)[e(n).WRAPPER] }), [
+          }, { ...a.$attrs, ...t(y)[t(n).WRAPPER] }), [
             V("div", O, [
-              u(e(P), B({
+              u(t(P), B({
                 "icon-name": "x",
                 class: "close-icon"
-              }, e(y)[e(n).CLOSE_BTN], { onClick: I }), null, 16),
+              }, t(y)[t(n).CLOSE_BTN], { onClick: I }), null, 16),
               o.selectedCount ? (l(), r("div", R, [
-                u(e(E), { variant: "body1" }, {
+                u(t(E), { variant: "body1" }, {
                   default: c(() => [
                     h(A(o.selectedCount) + " selected ", 1)
                   ]),
                   _: 1
                 })
               ])) : m("", !0),
-              (l(!0), r(z, null, M(e(p), (i, T) => (l(), d(e(S), {
+              (l(!0), r(z, null, M(t(p), (i, T) => (l(), d(t(S), {
                 key: i.id,
                 class: N(["action-button", {
-                  "action-button--last": T === e(p).length - 1
+                  "action-button--last": T === t(p).length - 1
                 }]),
                 variant: "text",
                 color: "default",
                 "start-icon-name": i.icon,
-                "data-testid": `${t.testId}-${e(n).ACTION}-${i.id}`,
+                "data-testid": `${e.testId}-${t(n).ACTION}-${i.id}`,
                 disabled: i.disabled,
                 onClick: (U) => b(i)
               }, {
@@ -84,10 +85,10 @@ const O = { class: "multi-bar-panel" }, R = {
                 ]),
                 _: 2
               }, 1032, ["class", "start-icon-name", "data-testid", "disabled", "onClick"]))), 128)),
-              e(C).length ? (l(), d(w, {
+              t(C).length ? (l(), d(w, {
                 key: 1,
-                "menu-items": e(C),
-                "test-id": `${t.testId}-${e(n).MENU}`,
+                "menu-items": t(C),
+                "test-id": `${e.testId}-${t(n).MENU}`,
                 onSelected: b
               }, null, 8, ["menu-items", "test-id"])) : m("", !0)
             ])
@@ -99,5 +100,5 @@ const O = { class: "multi-bar-panel" }, R = {
   }
 });
 export {
-  X as default
+  Y as default
 };

package/components/snackbar/v4/SnackbarV4.vue2.js

@@ -3,6 +3,7 @@ import U from "../../icon/v4/IconV4.vue.js";
 import "../../icon/v4/IconFlag.vue.js";
 import D from "../../button/v4/ButtonV4.vue.js";
 import H from "../../button/v4/IconButtonV4.vue.js";
+import "../../button/v4/ButtonGroup.vue.js";
 import S from "../../typography/v4/Typography.vue.js";
 import { snackbarCommon as F } from "../common/snackbar.common.js";
 import { useTestIdAttrs as G } from "../../../utils/testIds.js";
@@ -10,7 +11,7 @@ import { SnackbarTestIdModifiers as i } from "../../../testids/index.js";
 const P = ["id"], R = { class: "container" }, j = { class: "texts" }, q = { class: "message" }, J = { class: "action-wrapper" }, K = {
   key: 0,
   class: "actions"
-}, Q = { class: "close-button-wrapper" }, ne = /* @__PURE__ */ M({
+}, Q = { class: "close-button-wrapper" }, ie = /* @__PURE__ */ M({
   __name: "SnackbarV4",
   props: {
     customClass: null,
@@ -34,10 +35,10 @@ const P = ["id"], R = { class: "container" }, j = { class: "texts" }, q = { clas
     const u = t, {
       visible: b,
       horizontalClass: w,
-      positionStyle: L,
+      positionStyle: p,
       clearTimer: k,
       startTimer: C,
-      close: p
+      close: L
     } = F(u), E = {
       info: {
         iconName: "info",
@@ -61,7 +62,7 @@ const P = ["id"], R = { class: "container" }, j = { class: "texts" }, q = { clas
         g(a("div", l({
           id: t.id,
           class: ["snackbar light-theme-v4", [t.customClass, e(w)]],
-          style: e(L),
+          style: e(p),
           role: "alert"
         }, e(r)[e(i).CONTAINER], {
           onMouseenter: o[0] || (o[0] = //@ts-ignore
@@ -122,7 +123,7 @@ const P = ["id"], R = { class: "container" }, j = { class: "texts" }, q = { clas
                 "icon-name": "x",
                 size: "small"
               }, e(r)[e(i).CLOSE], {
-                onClick: x(e(p), ["stop"])
+                onClick: x(e(L), ["stop"])
               }), null, 16, ["onClick"])) : d("", !0)
             ])
           ])
@@ -135,5 +136,5 @@ const P = ["id"], R = { class: "container" }, j = { class: "texts" }, q = { clas
   }
 });
 export {
-  ne as default
+  ie as default
 };

package/components/switch/v4/SwitchV4.vue2.js

@@ -2,8 +2,9 @@
 import { useVModel as C } from "@vueuse/core";
 import "../../button/v4/ButtonV4.vue.js";
 import $ from "../../button/v4/IconButtonV4.vue.js";
-import { SwitchTestIdModifiers as u } from "../../../testids/index.js";
-const w = ["data-testid"], P = /* @__PURE__ */ p({
+import "../../button/v4/ButtonGroup.vue.js";
+import { SwitchTestIdModifiers as r } from "../../../testids/index.js";
+const w = ["data-testid"], R = /* @__PURE__ */ p({
   __name: "SwitchV4",
   props: {
     options: null,
@@ -12,8 +13,8 @@ const w = ["data-testid"], P = /* @__PURE__ */ p({
     iconKey: { default: "icon" }
   },
   emits: ["update:modelValue"],
-  setup(e, { emit: r }) {
-    const o = e, n = k(), m = C(o, "modelValue", r);
+  setup(e, { emit: u }) {
+    const o = e, n = k(), m = C(o, "modelValue", u);
     v(() => {
       n.value = o.options.findIndex(
         (t) => t === o.modelValue
@@ -24,19 +25,19 @@ const w = ["data-testid"], P = /* @__PURE__ */ p({
     };
     return (t, i) => (a(), d("div", {
       class: "switch",
-      "data-testid": `${e.testId}-${s(u).WRAPPER}`
+      "data-testid": `${e.testId}-${s(r).WRAPPER}`
     }, [
       (a(!0), d(I, null, V(e.options, (c, l) => (a(), h(s($), {
         key: l,
         class: B(["option", { "option--selected": n.value === l }]),
         "icon-name": c[e.iconKey],
         size: "small",
-        "data-testid": `${e.testId}-${s(u).BUTTON}`,
+        "data-testid": `${e.testId}-${s(r).BUTTON}`,
         onClick: (y) => f(c, l)
       }, null, 8, ["class", "icon-name", "data-testid", "onClick"]))), 128))
     ], 8, w));
   }
 });
 export {
-  P as default
+  R as default
 };

package/components/table/v4/ExpandRowToggle.vue2.js

@@ -1,24 +1,25 @@
  import "../../../ExpandRowToggle.vue_vue_type_style_index_0_scoped_b053baa6_lang.css"; import { defineComponent as a, openBlock as r, createElementBlock as c, createVNode as l, unref as p } from "vue";
 import "../../button/v4/ButtonV4.vue.js";
-import d from "../../button/v4/IconButtonV4.vue.js";
-const f = /* @__PURE__ */ a({
+import i from "../../button/v4/IconButtonV4.vue.js";
+import "../../button/v4/ButtonGroup.vue.js";
+const x = /* @__PURE__ */ a({
   __name: "ExpandRowToggle",
   props: {
     expanded: { type: Boolean, default: !1 }
   },
   emits: ["click"],
-  setup(n, { emit: o }) {
-    return (i, e) => (r(), c("div", {
+  setup(o, { emit: n }) {
+    return (d, e) => (r(), c("div", {
       class: "expand-row-toggle",
-      onClick: e[0] || (e[0] = (t) => o("click", t))
+      onClick: e[0] || (e[0] = (t) => n("click", t))
     }, [
-      l(p(d), {
+      l(p(i), {
         class: "expand-button",
-        "icon-name": n.expanded ? "caret-down" : "caret-right"
+        "icon-name": o.expanded ? "caret-down" : "caret-right"
       }, null, 8, ["icon-name"])
     ]));
   }
 });
 export {
-  f as default
+  x as default
 };