@ironsource/shared-ui 1.4.2-test.7 → 1.4.2

package/components/dateRange/DateRange.vue.js

@@ -1,42 +1,38 @@
-import { defineComponent, ref, computed, onMounted, onBeforeMount, onUnmounted, watch, openBlock, createElementBlock, normalizeClass, createElementVNode, renderSlot, unref, toDisplayString, setBlockTracking, withDirectives, Fragment, renderList, createVNode, withCtx, createTextVNode, createCommentVNode, vShow, normalizeStyle } from 'vue';
+import { defineComponent, ref, computed, onMounted, onBeforeMount, onUnmounted, watch, openBlock, createElementBlock, unref, normalizeClass, createElementVNode, renderSlot, toDisplayString, setBlockTracking, withDirectives, Fragment, renderList, createVNode, withCtx, createTextVNode, createCommentVNode, vShow, normalizeStyle } from 'vue';
 import { onClickOutside } from '@vueuse/core';
 import { useToggle } from '../../composables/useToggle.vue.js';
 import CalendarMonth from './CalendarMonth.vue.js';
 import dateServices from './DateServices.vue.js';
 import { typeToName, messagePerType, presetsList, formatError, mandatoryValuesError, navigatePrev, navigateNext } from './consts.vue.js';
 import Button from '../button/Button.vue.js';
-import '../button/IconButton.vue.js';
-import '../button/ScrollButton.vue.js';
-import '../typography/Heading.vue.js';
-import Text from '../typography/Text.vue.js';
-import { min, addDays, format } from 'date-fns';
-/* empty css                                                           */import _export_sfc from '../../_virtual/plugin-vue_export-helper.vue.js';
-
+/* empty css                                                            */import _export_sfc from '../../_virtual/plugin-vue_export-helper.vue.js';
+import { DateRangeTestIdModifiers } from '../../testids/index.vue.js';
+/* empty css                                                                     */import Text from '../typography/Text.vue.js';
+/* empty css                                                                    *//* empty css                                                                    *//* empty css                                                                               */import 'floating-vue';
+/* empty css                                                      *//* empty css                                                                      */import { min, addDays, format } from 'date-fns';
+/* empty css                                                           */
 import "../../DateRange.vue_vue_type_style_index_0_scoped_true_lang.css";
-const _hoisted_1 = ["id"];
-const _hoisted_2 = ["id"];
-const _hoisted_3 = {
+const _hoisted_1 = ["id", "data-testid"];
+const _hoisted_2 = ["data-testid"];
+const _hoisted_3 = ["id", "data-testid"];
+const _hoisted_4 = {
   key: 0,
   class: "type-picker"
 };
-const _hoisted_4 = ["onClick"];
-const _hoisted_5 = {
-  key: 0,
-  class: "date-picker-menu"
-};
-const _hoisted_6 = ["id"];
+const _hoisted_5 = ["onClick"];
+const _hoisted_6 = ["data-testid"];
 const _hoisted_7 = ["id"];
-const _hoisted_8 = ["onClick"];
-const _hoisted_9 = { class: "dropdown-rightTriangle" };
-const _hoisted_10 = { class: "type-message" };
-const _hoisted_11 = { class: "date-picker-calendar left-box" };
-const _hoisted_12 = { class: "buttons-cover" };
-const _hoisted_13 = { class: "range" };
-const numberOfMonths = 2;
-const _sfc_main = defineComponent({
+const _hoisted_8 = ["id"];
+const _hoisted_9 = ["onClick"];
+const _hoisted_10 = { class: "dropdown-rightTriangle" };
+const _hoisted_11 = ["data-testid"];
+const _hoisted_12 = { class: "date-picker-calendar left-box" };
+const _hoisted_13 = { class: "buttons-cover" };
+const _hoisted_14 = { class: "range" };
+const _sfc_main = /* @__PURE__ */ defineComponent({
   __name: "DateRange",
   props: {
-    range: {},
+    range: null,
     types: { default: () => ["date"] },
     includeToday: { type: Boolean, default: true },
     allowedDays: { default: null },
@@ -49,7 +45,8 @@ const _sfc_main = defineComponent({
     initialType: { default: null },
     openOnTop: { type: Boolean, default: false },
     showPresets: { type: Boolean, default: true },
-    maxDate: { default: null }
+    maxDate: { default: null },
+    testId: { default: "" }
   },
   emits: [
     "rangeTypeChanged",
@@ -64,6 +61,7 @@ const _sfc_main = defineComponent({
     const datePicker = ref(null);
     const selectionStart = ref({ started: false, date: null });
     const initialized = ref(false);
+    const numberOfMonths = 2;
     const textDates = ref({ from: null, to: null });
     const currentMonths = ref({});
     const displayedMonthsKeys = ref([]);
@@ -503,13 +501,15 @@ const _sfc_main = defineComponent({
     });
     return (_ctx, _cache) => {
       return openBlock(), createElementBlock("div", {
-        id: datePickerId.value,
+        id: unref(datePickerId),
         ref_key: "datePicker",
         ref: datePicker,
-        class: normalizeClass(["relative-wrap", { "date-range-disabled": _ctx.disabled }])
+        class: normalizeClass(["relative-wrap", { "date-range-disabled": __props.disabled }]),
+        "data-testid": `${__props.testId}-${unref(DateRangeTestIdModifiers).WRAPPER}`
       }, [
         createElementVNode("div", {
           class: "date-range-field",
+          "data-testid": `${__props.testId}-${unref(DateRangeTestIdModifiers).TRIGGER}`,
           onClick: _cache[1] || (_cache[1] = ($event) => toggle())
         }, [
           renderSlot(_ctx.$slots, "field", {
@@ -519,19 +519,20 @@ const _sfc_main = defineComponent({
             createElementVNode("span", null, toDisplayString(currentDate.value), 1),
             _cache[0] || (setBlockTracking(-1), _cache[0] = createElementVNode("div", { class: "small-triangle" }), setBlockTracking(1), _cache[0])
           ], true)
-        ]),
+        ], 8, _hoisted_2),
         withDirectives(createElementVNode("div", {
-          id: "datepickerPopup" + _ctx.uniqueId,
+          id: "datepickerPopup" + __props.uniqueId,
           ref_key: "popup",
           ref: popup,
           class: normalizeClass(["pop-up", [
             placement.value,
-            _ctx.openOnTop ? "open-on-top" : "",
-            !_ctx.showPresets ? "hide-presets" : ""
-          ]])
+            __props.openOnTop ? "open-on-top" : "",
+            !__props.showPresets ? "hide-presets" : ""
+          ]]),
+          "data-testid": `${__props.testId}-${unref(DateRangeTestIdModifiers).CONTAINER}`
         }, [
-          _ctx.types.length > 1 ? (openBlock(), createElementBlock("div", _hoisted_3, [
-            (openBlock(true), createElementBlock(Fragment, null, renderList(_ctx.types, (type) => {
+          __props.types.length > 1 ? (openBlock(), createElementBlock("div", _hoisted_4, [
+            (openBlock(true), createElementBlock(Fragment, null, renderList(__props.types, (type) => {
               return openBlock(), createElementBlock("span", {
                 key: type,
                 class: normalizeClass(["range-type", { "selected-range-type": rangeType.value === type }]),
@@ -543,19 +544,23 @@ const _sfc_main = defineComponent({
                   ]),
                   _: 2
                 }, 1024)
-              ], 10, _hoisted_4);
+              ], 10, _hoisted_5);
             }), 128))
           ])) : createCommentVNode("", true),
           createElementVNode("div", {
-            class: normalizeClass(["flex", { "pop-up-content": _ctx.types.length > 1 }])
+            class: normalizeClass(["flex", { "pop-up-content": __props.types.length > 1 }])
           }, [
-            _ctx.showPresets ? (openBlock(), createElementBlock("div", _hoisted_5, [
+            __props.showPresets ? (openBlock(), createElementBlock("div", {
+              key: 0,
+              class: "date-picker-menu",
+              "data-testid": `${__props.testId}-${unref(DateRangeTestIdModifiers).MENU}`
+            }, [
               createElementVNode("div", {
-                id: "presets" + _ctx.uniqueId,
+                id: "presets" + __props.uniqueId,
                 class: "preset-dropdown"
               }, [
                 createElementVNode("ul", {
-                  id: "customDropDownList" + _ctx.uniqueId
+                  id: "customDropDownList" + __props.uniqueId
                 }, [
                   (openBlock(true), createElementBlock(Fragment, null, renderList(presets.value, (uic) => {
                     return openBlock(), createElementBlock("li", {
@@ -574,25 +579,28 @@ const _sfc_main = defineComponent({
                           ]),
                           _: 2
                         }, 1024)
-                      ], 10, _hoisted_8),
-                      withDirectives(createElementVNode("div", _hoisted_9, null, 512), [
+                      ], 10, _hoisted_9),
+                      withDirectives(createElementVNode("div", _hoisted_10, null, 512), [
                         [vShow, uic.id === "custom"]
                       ])
                     ], 2);
                   }), 128))
-                ], 8, _hoisted_7)
-              ], 8, _hoisted_6),
-              createElementVNode("div", _hoisted_10, toDisplayString(unref(messagePerType)[rangeType.value]), 1)
-            ])) : createCommentVNode("", true),
+                ], 8, _hoisted_8)
+              ], 8, _hoisted_7),
+              createElementVNode("div", {
+                class: "type-message",
+                "data-testid": `${__props.testId}-${unref(DateRangeTestIdModifiers).MESSAGE}`
+              }, toDisplayString(unref(messagePerType)[rangeType.value]), 9, _hoisted_11)
+            ], 8, _hoisted_6)) : createCommentVNode("", true),
             createElementVNode("div", {
               class: "calendar-wrap",
-              style: normalizeStyle({ height: isCompact.value ? "336px" : "372px" })
+              style: normalizeStyle({ height: unref(isCompact) ? "336px" : "372px" })
             }, [
-              createElementVNode("div", _hoisted_11, [
+              createElementVNode("div", _hoisted_12, [
                 (openBlock(true), createElementBlock(Fragment, null, renderList(displayedMonthsKeys.value, (currMonth, index) => {
                   return openBlock(), createElementBlock("div", { key: currMonth }, [
                     createVNode(CalendarMonth, {
-                      id: _ctx.uniqueId,
+                      id: __props.uniqueId,
                       navigation: getNavigation(
                         index === 0,
                         index === displayedMonthsKeys.value.length - 1
@@ -603,15 +611,16 @@ const _sfc_main = defineComponent({
                       month: currentMonths.value[currMonth].parsedMonth.month,
                       range: selectedRange.value,
                       type: rangeType.value,
-                      "allowed-days": _ctx.allowedDays,
-                      "max-allowed-date": getMaxAllowedDate.value,
+                      "allowed-days": __props.allowedDays,
+                      "max-allowed-date": unref(getMaxAllowedDate),
+                      "test-id": `${__props.testId}-${index}`,
                       onSelectionChanged: selectionChanged,
                       onNavigation: navigationCallback
-                    }, null, 8, ["id", "navigation", "year", "days", "weeks", "month", "range", "type", "allowed-days", "max-allowed-date"])
+                    }, null, 8, ["id", "navigation", "year", "days", "weeks", "month", "range", "type", "allowed-days", "max-allowed-date", "test-id"])
                   ]);
                 }), 128)),
-                createElementVNode("div", _hoisted_12, [
-                  createElementVNode("div", _hoisted_13, [
+                createElementVNode("div", _hoisted_13, [
+                  createElementVNode("div", _hoisted_14, [
                     renderSlot(_ctx.$slots, "footer", {}, void 0, true)
                   ]),
                   withDirectives(createElementVNode("div", { class: "error" }, toDisplayString(error.value), 513), [
@@ -619,40 +628,42 @@ const _sfc_main = defineComponent({
                   ]),
                   _cache[2] || (setBlockTracking(-1), _cache[2] = createElementVNode("div", { class: "buttons" }, [
                     createVNode(unref(Button), {
-                      id: "button-ok" + _ctx.uniqueId,
+                      id: "button-ok" + __props.uniqueId,
                       size: "sm",
                       class: "primary button small",
+                      "data-testid": `${__props.testId}-${unref(DateRangeTestIdModifiers).ACTION_APPLY}`,
                       onClick: ($event) => apply()
                     }, {
                       default: withCtx(() => [
                         createTextVNode(" Apply ")
                       ]),
                       _: 1
-                    }, 8, ["id", "onClick"]),
+                    }, 8, ["id", "data-testid", "onClick"]),
                     createVNode(unref(Button), {
-                      id: "button-cancel" + _ctx.uniqueId,
+                      id: "button-cancel" + __props.uniqueId,
                       size: "sm",
                       theme: "third",
                       class: "button small border third transparent",
+                      "data-testid": `${__props.testId}-${unref(DateRangeTestIdModifiers).ACTION_CANCEL}`,
                       onClick: ($event) => toggle()
                     }, {
                       default: withCtx(() => [
                         createTextVNode(" Cancel ")
                       ]),
                       _: 1
-                    }, 8, ["id", "onClick"])
+                    }, 8, ["id", "data-testid", "onClick"])
                   ]), setBlockTracking(1), _cache[2])
                 ])
               ])
             ], 4)
           ], 2)
-        ], 10, _hoisted_2), [
+        ], 10, _hoisted_3), [
           [vShow, unref(isOpen)]
         ])
       ], 10, _hoisted_1);
     };
   }
 });
-var DateRange = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-46a2bd5d"]]);
+var DateRange = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-b7430f6a"]]);
 
 export { DateRange as default };

package/components/dateRange/DateRangePicker.vue.d.ts

@@ -16,6 +16,7 @@ declare const _default: import("vue").DefineComponent<__VLS_WithDefaults<__VLS_T
     disabled?: boolean;
     initialType: null | 'date' | 'week' | 'month';
     openOnTop: boolean;
+    testId?: string;
 }>, {
     isTitleStyle: boolean;
     types: () => string[];
@@ -29,6 +30,7 @@ declare const _default: import("vue").DefineComponent<__VLS_WithDefaults<__VLS_T
     disabled: boolean;
     initialType: any;
     openOnTop: boolean;
+    testId: string;
 }>, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("opened" | "dismissed" | "update:range")[], "opened" | "dismissed" | "update:range", import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<{
     range: {
         from: Date;
@@ -46,6 +48,7 @@ declare const _default: import("vue").DefineComponent<__VLS_WithDefaults<__VLS_T
     disabled?: boolean;
     initialType: null | 'date' | 'week' | 'month';
     openOnTop: boolean;
+    testId?: string;
 }>, {
     isTitleStyle: boolean;
     types: () => string[];
@@ -59,11 +62,13 @@ declare const _default: import("vue").DefineComponent<__VLS_WithDefaults<__VLS_T
     disabled: boolean;
     initialType: any;
     openOnTop: boolean;
+    testId: string;
 }>>> & {
     onOpened?: (...args: any[]) => any;
     onDismissed?: (...args: any[]) => any;
     "onUpdate:range"?: (...args: any[]) => any;
 }, {
+    testId: string;
     disabled: boolean;
     allowedDays: number;
     uniqueId: string | number;
@@ -76,7 +81,7 @@ declare const _default: import("vue").DefineComponent<__VLS_WithDefaults<__VLS_T
     initialType: null | 'date' | 'week' | 'month';
     openOnTop: boolean;
     isTitleStyle: boolean;
-}, {}>;
+}>;
 export default _default;
 type __VLS_NonUndefinedable<T> = T extends undefined ? never : T;
 type __VLS_TypePropsToRuntimeProps<T> = {

package/components/dateRange/index.d.ts

@@ -1,4 +1,9 @@
 declare const DateRangeTypes: () => import("vue").DefineComponent<{
+    testId: {
+        type: import("vue").PropType<string>;
+    } & {
+        default: string;
+    };
     disabled: {
         type: import("vue").PropType<boolean>;
     } & {
@@ -75,6 +80,11 @@ declare const DateRangeTypes: () => import("vue").DefineComponent<{
         default: any;
     };
 }, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("opened" | "rangeTypeChanged" | "currentDateChanged" | "rangeChanged" | "dateRangePresetNameChanged" | "dismissed")[], "opened" | "rangeTypeChanged" | "currentDateChanged" | "rangeChanged" | "dateRangePresetNameChanged" | "dismissed", import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
+    testId: {
+        type: import("vue").PropType<string>;
+    } & {
+        default: string;
+    };
     disabled: {
         type: import("vue").PropType<boolean>;
     } & {
@@ -158,6 +168,7 @@ declare const DateRangeTypes: () => import("vue").DefineComponent<{
     onDateRangePresetNameChanged?: (...args: any[]) => any;
     onDismissed?: (...args: any[]) => any;
 }, {
+    testId: string;
     disabled: boolean;
     allowedDays: number;
     uniqueId: string | number;
@@ -171,6 +182,6 @@ declare const DateRangeTypes: () => import("vue").DefineComponent<{
     openOnTop: boolean;
     showPresets: boolean;
     maxDate: Date;
-}, {}>[];
+}>[];
 export { default as DateRange } from './DateRange.vue';
 export { DateRangeTypes };

package/components/dialog/Dialog.vue.d.ts

@@ -14,6 +14,7 @@ declare const _default: import("vue").DefineComponent<__VLS_WithDefaults<__VLS_T
     title?: string;
     showCloseButton?: boolean;
     themeClass?: string;
+    testId?: string;
 }>, {
     content: any;
     width: string;
@@ -28,6 +29,7 @@ declare const _default: import("vue").DefineComponent<__VLS_WithDefaults<__VLS_T
     escapeToClose: boolean;
     beforeClose: any;
     themeClass: string;
+    testId: string;
 }>, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
     "update:modelValue": (value: boolean) => void;
 } & {
@@ -49,6 +51,7 @@ declare const _default: import("vue").DefineComponent<__VLS_WithDefaults<__VLS_T
     title?: string;
     showCloseButton?: boolean;
     themeClass?: string;
+    testId?: string;
 }>, {
     content: any;
     width: string;
@@ -63,12 +66,14 @@ declare const _default: import("vue").DefineComponent<__VLS_WithDefaults<__VLS_T
     escapeToClose: boolean;
     beforeClose: any;
     themeClass: string;
+    testId: string;
 }>>> & {
     "onUpdate:modelValue"?: (value: boolean) => any;
     onClose?: (reason: Reason) => any;
     onOpen?: () => any;
 }, {
     title: string;
+    testId: string;
     content: string;
     width: string | number;
     appendToBody: boolean;
@@ -81,7 +86,7 @@ declare const _default: import("vue").DefineComponent<__VLS_WithDefaults<__VLS_T
     escapeToClose: boolean;
     beforeClose: (show: () => void) => void;
     themeClass: string;
-}, {}>;
+}>;
 export default _default;
 type __VLS_NonUndefinedable<T> = T extends undefined ? never : T;
 type __VLS_TypePropsToRuntimeProps<T> = {

package/components/dialog/Dialog.vue.js

@@ -6,20 +6,22 @@ import { NOOP } from '@vue/shared';
 import { Reason } from './Reason.vue.js';
 import IconButton from '../button/IconButton.vue.js';
 import Icon from '../icon/Icon.vue.js';
+import { DialogTestIdModifiers } from '../../testids/index.vue.js';
 /* empty css                                                        */import _export_sfc from '../../_virtual/plugin-vue_export-helper.vue.js';
 
 import "../../Dialog.vue_vue_type_style_index_0_scoped_true_lang.css";
-const _hoisted_1 = {
-  key: 0,
-  class: "header--secondary"
-};
-const _hoisted_2 = { class: "placeholder" };
-const _hoisted_3 = {
+const _hoisted_1 = ["data-testid"];
+const _hoisted_2 = ["data-testid"];
+const _hoisted_3 = ["data-testid"];
+const _hoisted_4 = ["data-testid"];
+const _hoisted_5 = { class: "placeholder" };
+const _hoisted_6 = {
   key: 1,
   class: "footer"
 };
-const _hoisted_4 = { class: "action-buttons" };
-const _sfc_main = defineComponent({
+const _hoisted_7 = ["data-testid"];
+const _hoisted_8 = ["data-testid"];
+const _sfc_main = /* @__PURE__ */ defineComponent({
   __name: "Dialog",
   props: {
     appendToBody: { type: Boolean, default: true },
@@ -35,13 +37,14 @@ const _sfc_main = defineComponent({
     beforeClose: { type: Function, default: null },
     title: { default: "" },
     showCloseButton: { type: Boolean, default: true },
-    themeClass: { default: "" }
+    themeClass: { default: "" },
+    testId: { default: "" }
   },
   emits: ["update:modelValue", "open", "close"],
   setup(__props, { emit }) {
     const props = __props;
     useCssVars((_ctx) => ({
-      "ee619eb0": _ctx.width
+      "7d57480a": __props.width
     }));
     const visible = ref(false);
     let openTimer = void 0;
@@ -106,38 +109,41 @@ const _sfc_main = defineComponent({
     return (_ctx, _cache) => {
       return openBlock(), createBlock(Teleport, {
         to: "body",
-        disabled: !_ctx.appendToBody
+        disabled: !__props.appendToBody
       }, [
         createVNode(Transition, null, {
           default: withCtx(() => [
             visible.value ? (openBlock(), createBlock(unref(UseFocusTrap), {
               key: 0,
-              class: normalizeClass(["container", _ctx.themeClass])
+              class: normalizeClass(["container", __props.themeClass])
             }, {
               default: withCtx(() => [
                 createElementVNode("div", {
                   class: "modal",
-                  style: normalizeStyle(inlineStyle.value),
-                  onKeydown: _cache[1] || (_cache[1] = withKeys(($event) => _ctx.escapeToClose ? handleClose(unref(Reason).Escape) : unref(NOOP)(), ["esc"]))
+                  style: normalizeStyle(unref(inlineStyle)),
+                  "data-testid": `${__props.testId}-${unref(DialogTestIdModifiers).WRAPPER}`,
+                  onKeydown: _cache[1] || (_cache[1] = withKeys(($event) => __props.escapeToClose ? handleClose(unref(Reason).Escape) : unref(NOOP)(), ["esc"]))
                 }, [
                   createElementVNode("header", {
-                    class: normalizeClass(["header", { "header--bordered": _ctx.headerBorder }])
+                    class: normalizeClass(["header", { "header--bordered": __props.headerBorder }]),
+                    "data-testid": `${__props.testId}-${unref(DialogTestIdModifiers).HEADER}`
                   }, [
-                    _ctx.headerBorder ? renderSlot(_ctx.$slots, "header", { key: 0 }, () => [
+                    __props.headerBorder ? renderSlot(_ctx.$slots, "header", { key: 0 }, () => [
                       createVNode(Text, { strong: "" }, {
                         default: withCtx(() => [
-                          createTextVNode(toDisplayString(_ctx.title), 1)
+                          createTextVNode(toDisplayString(__props.title), 1)
                         ]),
                         _: 1
                       })
                     ], true) : createCommentVNode("", true),
-                    _ctx.showCloseButton ? (openBlock(), createBlock(IconButton, {
+                    __props.showCloseButton ? (openBlock(), createBlock(IconButton, {
                       key: 1,
                       class: "button close-button",
                       size: "md",
                       theme: "secondary",
                       variant: "colorized",
                       "icon-name": "close",
+                      "data-testid": `${__props.testId}-${unref(DialogTestIdModifiers).ACTION_CLOSE}`,
                       onClick: _cache[0] || (_cache[0] = ($event) => handleClose(unref(Reason).CloseButton))
                     }, {
                       default: withCtx(() => [
@@ -147,36 +153,45 @@ const _sfc_main = defineComponent({
                         })
                       ]),
                       _: 1
-                    })) : createCommentVNode("", true)
-                  ], 2),
-                  !_ctx.headerBorder ? (openBlock(), createElementBlock("div", _hoisted_1, [
+                    }, 8, ["data-testid"])) : createCommentVNode("", true)
+                  ], 10, _hoisted_2),
+                  !__props.headerBorder ? (openBlock(), createElementBlock("div", {
+                    key: 0,
+                    class: "header--secondary",
+                    "data-testid": `${__props.testId}-${unref(DialogTestIdModifiers).HEADER_SECONDARY}`
+                  }, [
                     renderSlot(_ctx.$slots, "header", {}, () => [
                       createVNode(Text, { strong: "" }, {
                         default: withCtx(() => [
-                          createTextVNode(toDisplayString(_ctx.title), 1)
+                          createTextVNode(toDisplayString(__props.title), 1)
                         ]),
                         _: 1
                       })
                     ], true)
-                  ])) : createCommentVNode("", true),
+                  ], 8, _hoisted_3)) : createCommentVNode("", true),
                   createElementVNode("div", {
-                    class: normalizeClass(["content", { "content--bordered": _ctx.headerBorder }])
+                    class: normalizeClass(["content", { "content--bordered": __props.headerBorder }]),
+                    "data-testid": `${__props.testId}-${unref(DialogTestIdModifiers).CONTENT}`
                   }, [
                     renderSlot(_ctx.$slots, "default", {}, () => [
-                      createElementVNode("div", _hoisted_2, toDisplayString(_ctx.content), 1)
+                      createElementVNode("div", _hoisted_5, toDisplayString(__props.content), 1)
                     ], true)
-                  ], 2),
-                  _ctx.$slots["footer"] ? (openBlock(), createElementBlock("footer", _hoisted_3, [
-                    createElementVNode("div", _hoisted_4, [
+                  ], 10, _hoisted_4),
+                  _ctx.$slots["footer"] ? (openBlock(), createElementBlock("footer", _hoisted_6, [
+                    createElementVNode("div", {
+                      class: "action-buttons",
+                      "data-testid": `${__props.testId}-${unref(DialogTestIdModifiers).ACTION_BUTTONS_WRAPPER}`
+                    }, [
                       renderSlot(_ctx.$slots, "footer", {}, void 0, true)
-                    ])
+                    ], 8, _hoisted_7)
                   ])) : createCommentVNode("", true)
-                ], 36),
-                _ctx.showBackdrop ? (openBlock(), createElementBlock("div", {
+                ], 44, _hoisted_1),
+                __props.showBackdrop ? (openBlock(), createElementBlock("div", {
                   key: 0,
                   class: "backdrop",
-                  onClick: _cache[2] || (_cache[2] = ($event) => _ctx.closeOnClickOutside ? handleClose(unref(Reason).Backdrop) : unref(NOOP)())
-                })) : createCommentVNode("", true)
+                  "data-testid": `${__props.testId}-${unref(DialogTestIdModifiers).BACKDROP}`,
+                  onClick: _cache[2] || (_cache[2] = ($event) => __props.closeOnClickOutside ? handleClose(unref(Reason).Backdrop) : unref(NOOP)())
+                }, null, 8, _hoisted_8)) : createCommentVNode("", true)
               ]),
               _: 3
             }, 8, ["class"])) : createCommentVNode("", true)
@@ -187,6 +202,6 @@ const _sfc_main = defineComponent({
     };
   }
 });
-var Dialog = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-699f96fa"]]);
+var Dialog = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-55aea585"]]);
 
 export { Dialog as default };

package/components/dialog/index.d.ts

@@ -4,6 +4,11 @@ declare const DialogTypes: () => import("vue").DefineComponent<{
     } & {
         default: string;
     };
+    testId: {
+        type: import("vue").PropType<string>;
+    } & {
+        default: string;
+    };
     modelValue: {
         type: import("vue").PropType<boolean>;
         required: true;
@@ -80,6 +85,11 @@ declare const DialogTypes: () => import("vue").DefineComponent<{
     } & {
         default: string;
     };
+    testId: {
+        type: import("vue").PropType<string>;
+    } & {
+        default: string;
+    };
     modelValue: {
         type: import("vue").PropType<boolean>;
         required: true;
@@ -150,6 +160,7 @@ declare const DialogTypes: () => import("vue").DefineComponent<{
     onOpen?: () => any;
 }, {
     title: string;
+    testId: string;
     content: string;
     width: string | number;
     appendToBody: boolean;
@@ -162,7 +173,7 @@ declare const DialogTypes: () => import("vue").DefineComponent<{
     escapeToClose: boolean;
     beforeClose: (show: () => void) => void;
     themeClass: string;
-}, {}>[];
+}>[];
 export { default as Dialog } from './Dialog.vue';
 export { DialogTypes };
 export * from './Reason';

package/components/dropdown/Dropdown.vue.d.ts

@@ -36,6 +36,7 @@ declare const _default: import("vue").DefineComponent<__VLS_WithDefaults<__VLS_T
     disableKeyboardEvents?: boolean;
     multiOptionsPlaceholderPrefix?: string;
     multiOptionsPlaceholderSuffix?: string;
+    testId?: string;
 }>, {
     multi: boolean;
     searchPlaceholder: string;
@@ -69,6 +70,7 @@ declare const _default: import("vue").DefineComponent<__VLS_WithDefaults<__VLS_T
     disableKeyboardEvents: boolean;
     multiOptionsPlaceholderPrefix: string;
     multiOptionsPlaceholderSuffix: string;
+    testId: string;
 }>, {
     selectItem: (option: any, index?: number) => void;
     scrollTo: (index: number) => void;
@@ -119,6 +121,7 @@ declare const _default: import("vue").DefineComponent<__VLS_WithDefaults<__VLS_T
     disableKeyboardEvents?: boolean;
     multiOptionsPlaceholderPrefix?: string;
     multiOptionsPlaceholderSuffix?: string;
+    testId?: string;
 }>, {
     multi: boolean;
     searchPlaceholder: string;
@@ -152,6 +155,7 @@ declare const _default: import("vue").DefineComponent<__VLS_WithDefaults<__VLS_T
     disableKeyboardEvents: boolean;
     multiOptionsPlaceholderPrefix: string;
     multiOptionsPlaceholderSuffix: string;
+    testId: string;
 }>>> & {
     "onUpdate:selected"?: (value: unknown) => any;
     "onUpdate:isOpen"?: (value: unknown) => any;
@@ -162,6 +166,7 @@ declare const _default: import("vue").DefineComponent<__VLS_WithDefaults<__VLS_T
     size: 'sm' | 'lg';
     title: string;
     error: string;
+    testId: string;
     theme: string;
     placement: Placement;
     disabled: boolean;
@@ -190,7 +195,7 @@ declare const _default: import("vue").DefineComponent<__VLS_WithDefaults<__VLS_T
     disableKeyboardEvents: boolean;
     multiOptionsPlaceholderPrefix: string;
     multiOptionsPlaceholderSuffix: string;
-}, {}>;
+}>;
 export default _default;
 type __VLS_NonUndefinedable<T> = T extends undefined ? never : T;
 type __VLS_TypePropsToRuntimeProps<T> = {