@ironsource/shared-ui 2.2.0-rc.2 → 2.2.0-rc.20

package/components/columnPicker/ColumnPicker.vue2.js

@@ -1,5 +1,5 @@
- import "../../ColumnPicker.vue_vue_type_style_index_0_scoped_ea8c7024_lang.css"; import { defineComponent as ie, ref as K, watch as ne, computed as c, provide as se, openBlock as d, createElementBlock as m, Fragment as S, renderSlot as oe, createVNode as r, unref as s, withCtx as p, createElementVNode as u, mergeProps as ae, renderList as R, withModifiers as U, createTextVNode as k, toDisplayString as V, withDirectives as de, createBlock as W, vShow as re, createCommentVNode as q, isRef as ue } from "vue";
-import ce from "./OptionChip.vue.js";
+ import "../../ColumnPicker.vue_vue_type_style_index_0_scoped_d59af062_lang.css"; import { defineComponent as re, ref as c, watch as H, computed as m, provide as ue, openBlock as d, createElementBlock as f, Fragment as x, renderSlot as ce, createVNode as r, unref as n, withCtx as p, createElementVNode as u, mergeProps as me, renderList as P, withModifiers as J, createTextVNode as T, toDisplayString as A, withDirectives as fe, createBlock as X, vShow as pe, createCommentVNode as Y, isRef as ve } from "vue";
+import ye from "./OptionChip.vue.js";
 import "../dropdown/v4/DropdownV4.vue.js";
 import "../dropdown/v4/DefaultDropdownTrigger.vue.js";
 import "../dropdown/v4/IconButtonDropdownTrigger.vue.js";
@@ -8,29 +8,29 @@ import "../dropdown/v4/AppDropdownTrigger.vue.js";
 import "../dropdown/v4/ButtonDropdownTrigger.vue.js";
 import "../dropdown/v4/ButtonFilterDropdownTrigger.vue.js";
 import "../dropdown/v4/TreeDropdown.vue.js";
-import Q from "../dropdown/v4/OptionV4.vue.js";
+import Z from "../dropdown/v4/OptionV4.vue.js";
 import "../dropdown/v4/ConditionalDropdown.vue.js";
-import { DropdownContext as me } from "../dropdown/common/DropdownContext.js";
-import w from "../typography/v4/Typography.vue.js";
-import pe from "../dialog/v4/DialogV4.vue.js";
-import fe from "../sortableList/SortableList.vue.js";
-import ye from "../link/Link.vue.js";
-import ve from "../search/v4/SearchV4.vue.js";
-import { matchString as he } from "../../utils/search.js";
+import { DropdownContext as he } from "../dropdown/common/DropdownContext.js";
+import L from "../typography/v4/Typography.vue.js";
+import ge from "../dialog/v4/DialogV4.vue.js";
+import ke from "../sortableList/SortableList.vue.js";
+import Se from "../link/Link.vue.js";
+import Ke from "../search/v4/SearchV4.vue.js";
+import { matchString as Ce } from "../../utils/search.js";
 import "../button/v4/ButtonV4.vue.js";
-import ge from "../button/v4/IconButtonV4.vue.js";
+import be from "../button/v4/IconButtonV4.vue.js";
 import "../button/v4/ButtonGroup.vue.js";
 import "../button/v4/ToggleButtonGroupAB.vue.js";
-import { useTestIdAttrs as Ke } from "../../utils/testIds.js";
-import { ColumnPickerTestIdModifiers as B } from "../../testids/index.js";
-import Se from "./RemoveButton.vue.js";
-const ke = { class: "content" }, be = { class: "options-list-wrapper" }, Ce = { class: "search-wrapper" }, xe = { class: "options-list scrollable-list" }, Te = {
+import { useTestIdAttrs as xe } from "../../utils/testIds.js";
+import { ColumnPickerTestIdModifiers as F } from "../../testids/index.js";
+import Te from "./RemoveButton.vue.js";
+const Ie = { class: "content" }, Oe = { class: "options-list-wrapper" }, Re = { class: "search-wrapper" }, Ve = { class: "options-list scrollable-list" }, we = {
   key: 0,
   class: "inline-group"
-}, Ie = ["onClick"], Oe = {
+}, Be = ["onClick"], De = {
   key: 0,
   class: "no-result-container"
-}, Re = { class: "selected-list-header" }, Ve = { class: "selected-list-wrapper scrollable-list" }, lt = /* @__PURE__ */ ie({
+}, Ge = { class: "selected-list-header" }, Pe = { class: "selected-list-wrapper scrollable-list" }, ot = /* @__PURE__ */ re({
   __name: "ColumnPicker",
   props: {
     selected: { default: () => [] },
@@ -50,87 +50,107 @@ const ke = { class: "content" }, be = { class: "options-list-wrapper" }, Ce = {
     appendToBody: { type: Boolean, default: !0 },
     testId: { default: "" }
   },
-  emits: ["update:selected"],
-  setup(n, { emit: j }) {
-    const t = n, a = K([]), f = K([]), v = K(""), y = K(!1), G = () => {
-      t.selected?.length ? a.value = [...t.selected] : t.defaultSelection?.length ? a.value = [...t.defaultSelection] : a.value = [];
-    }, b = () => {
-      y.value = !1, f.value = [], v.value = "", G();
+  emits: ["update:selected", "trackUserActivity"],
+  setup(s, { emit: I }) {
+    const t = s, o = c([]), v = c([]), h = c(""), y = c(!1), k = c(!1), S = c(!1), K = c(!1), C = c(!1), $ = () => {
+      t.selected?.length ? o.value = [...t.selected] : t.defaultSelection?.length ? o.value = [...t.defaultSelection] : o.value = [];
+    }, O = (e = !0) => {
+      y.value = !1, v.value = [], h.value = "", $(), e && I(
+        "trackUserActivity",
+        k.value,
+        C.value,
+        S.value,
+        K.value,
+        "Cancel"
+      ), oe();
     };
-    ne(
+    H(
       [() => t.selected, () => t.defaultSelection],
       () => {
-        G();
+        $();
       },
       {
         immediate: !0
       }
     );
-    const P = () => {
+    const E = () => {
       y.value = !y.value;
-    }, C = c({
+    }, R = m({
       get() {
-        return a.value.map((e) => {
-          const i = Z(e) ? A(e)?.[t.displayKey] + " " : "";
+        return o.value.map((e) => {
+          const l = ie(e) ? W(e)?.[t.displayKey] + " " : "";
           return {
             id: e[t.idKey],
-            displayText: i + e[t.displayKey],
-            isDisabled: I(e)
+            displayText: l + e[t.displayKey],
+            isDisabled: B(e)
           };
         });
       },
       set(e) {
-        const i = e.map((l) => l.id);
-        a.value = i.map(
-          (l) => a.value.find((o) => o[t.idKey] === l)
+        const l = e.map((i) => i.id);
+        o.value = l.map(
+          (i) => o.value.find((a) => a[t.idKey] === i)
         );
       }
-    }), x = c(
-      () => a.value?.length <= t.minSelections
-    ), T = c(() => {
+    }), V = m(
+      () => o.value?.length <= t.minSelections
+    ), w = m(() => {
       if (!t.minSelections)
         return "";
-      const e = t.minSelections, i = t.minSelectionsTooltipMessage;
-      return i ? i.replace("%count%", e.toString()) : "";
-    }), D = (e) => g(e) && x.value, I = (e) => e[t.disabledKey] || D(e), g = (e) => a.value.some(
-      (i) => i[t.idKey] === e[t.idKey]
-    ), H = (e) => {
-      g(e) ? L(e[t.idKey]) : J(e);
-    }, O = (e) => {
-      t.disabledKey && e[t.disabledKey] || H(e);
-    }, J = (e) => {
-      a.value.push(e);
-    }, L = (e) => {
-      a.value = a.value.filter(
-        (i) => i[t.idKey] !== e
+      const e = t.minSelections, l = t.minSelectionsTooltipMessage;
+      return l ? l.replace("%count%", e.toString()) : "";
+    }), M = (e) => b(e) && V.value, B = (e) => e[t.disabledKey] || M(e), b = (e) => o.value.some(
+      (l) => l[t.idKey] === e[t.idKey]
+    ), _ = (e) => {
+      b(e) ? U(e[t.idKey]) : ee(e);
+    }, D = (e) => {
+      t.disabledKey && e[t.disabledKey] || _(e);
+    }, ee = (e) => {
+      o.value.push(e);
+    }, U = (e) => {
+      o.value = o.value.filter(
+        (l) => l[t.idKey] !== e
       );
-    }, F = c(() => {
+    }, N = m(() => {
       if (!t.defaultSelection?.length)
         return !1;
-      const e = a.value.map((l) => l[t.idKey]), i = t.defaultSelection.map((l) => l[t.idKey]);
-      return e.length !== i.length ? !0 : !i.every((l) => e.includes(l));
-    }), X = () => {
-      F.value && (a.value = [...t.defaultSelection]);
-    }, $ = (e) => E.value ? !0 : !f.value.includes(e), Y = (e) => t.inlineGroupIds?.includes(e), A = (e) => t.options.find(
-      (i) => h(i).map((l) => l[t.idKey]).includes(e[t.idKey])
-    ), Z = (e) => {
-      const i = A(e);
-      return i ? t.inlineGroupIds?.includes(i[t.idKey]) : !1;
-    }, M = (e) => {
-      f.value.includes(e) ? f.value = f.value.filter(
-        (i) => i !== e
-      ) : f.value.push(e);
-    }, h = (e) => e[t.childrenKey] || [], _ = c(() => a.value.length), N = c(() => v.value?.trim()), E = c(() => !!N.value), z = c(() => E.value ? t.options.map((i) => ({
-      ...i,
-      [t.childrenKey]: h(i).filter(
-        (l) => he(l[t.displayKey], N.value)
+      const e = o.value.map((i) => i[t.idKey]), l = t.defaultSelection.map((i) => i[t.idKey]);
+      return e.length !== l.length ? !0 : !l.every((i) => e.includes(i));
+    }), te = () => {
+      N.value && (o.value = [...t.defaultSelection]), k.value = !0;
+    }, z = (e) => Q.value ? !0 : !v.value.includes(e), le = (e) => t.inlineGroupIds?.includes(e), W = (e) => t.options.find(
+      (l) => g(l).map((i) => i[t.idKey]).includes(e[t.idKey])
+    ), ie = (e) => {
+      const l = W(e);
+      return l ? t.inlineGroupIds?.includes(l[t.idKey]) : !1;
+    }, q = (e) => {
+      v.value.includes(e) ? (v.value = v.value.filter(
+        (l) => l !== e
+      ), S.value = !0) : (v.value.push(e), K.value = !0);
+    }, g = (e) => e[t.childrenKey] || [], se = m(() => o.value.length), G = m(() => h.value?.trim()), Q = m(() => !!G.value), j = m(() => Q.value ? t.options.map((l) => ({
+      ...l,
+      [t.childrenKey]: g(l).filter(
+        (i) => Ce(i[t.displayKey], G.value)
       )
     })).filter(
-      (i) => h(i).length > 0
-    ) : t.options), ee = Ke(t.testId, B), te = () => {
-      j("update:selected", a.value), b();
+      (l) => g(l).length > 0
+    ) : t.options), ne = xe(t.testId, F), ae = () => {
+      I("update:selected", o.value), I(
+        "trackUserActivity",
+        k.value,
+        C.value,
+        S.value,
+        K.value,
+        "Save"
+      ), O(!1);
     };
-    return se(me, {
+    H(G, () => {
+      C.value = !0;
+    });
+    const oe = () => {
+      k.value = !1, S.value = !1, K.value = !1, C.value = !1;
+    };
+    return ue(he, {
       activeIndex: null,
       activeOption: null,
       clearSelection: () => {
@@ -151,8 +171,8 @@ const ke = { class: "content" }, be = { class: "options-list-wrapper" }, Ce = {
       toggle: () => {
       },
       placeholder: "",
-      select: O,
-      query: v,
+      select: D,
+      query: h,
       selectedValue: null,
       goToOption: () => {
       },
@@ -162,103 +182,103 @@ const ke = { class: "content" }, be = { class: "options-list-wrapper" }, Ce = {
       },
       unRegisterOption: () => {
       }
-    }), (e, i) => (d(), m(S, null, [
-      oe(e.$slots, "trigger", {
-        triggerProps: { onClick: P }
+    }), (e, l) => (d(), f(x, null, [
+      ce(e.$slots, "trigger", {
+        triggerProps: { onClick: E }
       }, () => [
-        r(s(ge), {
+        r(n(be), {
           "icon-name": "layout",
           variant: "outlined",
-          "test-id": `${n.testId}-${s(B).TRIGGER}`,
-          onClick: P
+          "test-id": `${s.testId}-${n(F).TRIGGER}`,
+          onClick: E
         }, null, 8, ["test-id"])
       ], !0),
-      r(s(pe), {
+      r(n(ge), {
         modelValue: y.value,
-        "onUpdate:modelValue": i[2] || (i[2] = (l) => y.value = l),
-        title: n.headerText,
+        "onUpdate:modelValue": l[2] || (l[2] = (i) => y.value = i),
+        title: s.headerText,
         "no-padding": "",
         "save-button-label": "Save view",
         "close-on-click-outside": "",
-        "append-to-body": n.appendToBody,
-        "test-id": n.testId,
-        onSave: te,
-        onClose: b,
-        onCancel: b
+        "append-to-body": s.appendToBody,
+        "test-id": s.testId,
+        onSave: ae,
+        onClose: l[3] || (l[3] = () => O),
+        onCancel: O
       }, {
         default: p(() => [
-          u("div", ae({ class: "column-picker" }, s(ee)[s(B).WRAPPER]), [
-            u("div", ke, [
-              u("div", be, [
-                u("header", Ce, [
-                  r(s(ve), {
-                    modelValue: v.value,
-                    "onUpdate:modelValue": i[0] || (i[0] = (l) => v.value = l),
-                    placeholder: n.searchPlaceholder,
+          u("div", me({ class: "column-picker" }, n(ne)[n(F).WRAPPER]), [
+            u("div", Ie, [
+              u("div", Oe, [
+                u("header", Re, [
+                  r(n(Ke), {
+                    modelValue: h.value,
+                    "onUpdate:modelValue": l[0] || (l[0] = (i) => h.value = i),
+                    placeholder: s.searchPlaceholder,
                     variant: "transparent",
                     size: "md",
-                    "auto-focus": n.searchAutoFocus,
-                    "test-id": n.testId
+                    "auto-focus": s.searchAutoFocus,
+                    "test-id": s.testId
                   }, null, 8, ["modelValue", "placeholder", "auto-focus", "test-id"])
                 ]),
-                u("ul", xe, [
-                  (d(!0), m(S, null, R(s(z), (l) => (d(), m("li", {
-                    key: String(l[n.idKey]),
+                u("ul", Ve, [
+                  (d(!0), f(x, null, P(n(j), (i) => (d(), f("li", {
+                    key: String(i[s.idKey]),
                     class: "options-list__item"
                   }, [
-                    r(s(Q), {
-                      option: l,
+                    r(n(Z), {
+                      option: i,
                       "tree-main-option": "",
-                      "tree-main-option-expanded": $(l[n.idKey]),
-                      onClick: U((o) => M(l[n.idKey]), ["stop"]),
-                      onToggleTreeCollapse: (o) => M(l[n.idKey])
+                      "tree-main-option-expanded": z(i[s.idKey]),
+                      onClick: J((a) => q(i[s.idKey]), ["stop"]),
+                      onToggleTreeCollapse: (a) => q(i[s.idKey])
                     }, {
                       default: p(() => [
-                        r(s(w), {
+                        r(n(L), {
                           variant: "h5",
                           class: "group-name"
                         }, {
                           default: p(() => [
-                            k(V(l[n.displayKey]), 1)
+                            T(A(i[s.displayKey]), 1)
                           ]),
                           _: 2
                         }, 1024)
                       ]),
                       _: 2
                     }, 1032, ["option", "tree-main-option-expanded", "onClick", "onToggleTreeCollapse"]),
-                    de(u("div", null, [
-                      Y(l[n.idKey]) ? (d(), m("div", Te, [
-                        (d(!0), m(S, null, R(h(l), (o) => (d(), W(ce, {
-                          key: o[n.idKey],
-                          option: o,
-                          "name-key": n.displayKey,
-                          selected: g(o),
-                          disabled: I(o),
-                          "tooltip-text": D(o) ? s(T) : null,
-                          onClick: (le) => O(o)
+                    fe(u("div", null, [
+                      le(i[s.idKey]) ? (d(), f("div", we, [
+                        (d(!0), f(x, null, P(g(i), (a) => (d(), X(ye, {
+                          key: a[s.idKey],
+                          option: a,
+                          "name-key": s.displayKey,
+                          selected: b(a),
+                          disabled: B(a),
+                          "tooltip-text": M(a) ? n(w) : null,
+                          onClick: (de) => D(a)
                         }, null, 8, ["option", "name-key", "selected", "disabled", "tooltip-text", "onClick"]))), 128))
-                      ])) : (d(!0), m(S, { key: 1 }, R(h(l), (o) => (d(), m("div", {
-                        key: o[n.idKey],
-                        onClick: U((le) => O(o), ["stop"])
+                      ])) : (d(!0), f(x, { key: 1 }, P(g(i), (a) => (d(), f("div", {
+                        key: a[s.idKey],
+                        onClick: J((de) => D(a), ["stop"])
                       }, [
-                        r(s(Q), {
-                          option: o,
-                          "selected-prop": g(o),
-                          "name-key": n.displayKey,
-                          disabled: I(o),
-                          "min-max-selection-tooltip-message": s(T),
+                        r(n(Z), {
+                          option: a,
+                          "selected-prop": b(a),
+                          "name-key": s.displayKey,
+                          disabled: B(a),
+                          "min-max-selection-tooltip-message": n(w),
                           "tooltip-attached-to-text": "",
                           "is-multi": ""
                         }, null, 8, ["option", "selected-prop", "name-key", "disabled", "min-max-selection-tooltip-message"])
-                      ], 8, Ie))), 128))
+                      ], 8, Be))), 128))
                     ], 512), [
-                      [re, $(l[n.idKey])]
+                      [pe, z(i[s.idKey])]
                     ])
                   ]))), 128)),
-                  s(z).length ? q("", !0) : (d(), m("li", Oe, [
-                    r(s(w), { variant: "body2" }, {
+                  n(j).length ? Y("", !0) : (d(), f("li", De, [
+                    r(n(L), { variant: "body2" }, {
                       default: p(() => [
-                        k(V(n.noResultsText), 1)
+                        T(A(s.noResultsText), 1)
                       ]),
                       _: 1
                     })
@@ -266,43 +286,43 @@ const ke = { class: "content" }, be = { class: "options-list-wrapper" }, Ce = {
                 ])
               ]),
               u("div", null, [
-                u("header", Re, [
-                  r(s(w), {
+                u("header", Ge, [
+                  r(n(L), {
                     variant: "h5",
                     class: "selected-count-text"
                   }, {
                     default: p(() => [
-                      k(V(s(_)) + " selected ", 1)
+                      T(A(n(se)) + " selected ", 1)
                     ]),
                     _: 1
                   }),
-                  n.defaultSelection?.length ? (d(), W(s(ye), {
+                  s.defaultSelection?.length ? (d(), X(n(Se), {
                     key: 0,
                     variant: "subtitle2",
-                    disabled: !s(F),
-                    "test-id": n.testId,
-                    onClick: X
+                    disabled: !n(N),
+                    "test-id": s.testId,
+                    onClick: te
                   }, {
                     default: p(() => [
-                      k(" Reset to default ")
+                      T(" Reset to default ")
                     ]),
                     _: 1
-                  }, 8, ["disabled", "test-id"])) : q("", !0)
+                  }, 8, ["disabled", "test-id"])) : Y("", !0)
                 ]),
-                u("div", Ve, [
-                  r(s(fe), {
-                    items: s(C),
-                    "onUpdate:items": i[1] || (i[1] = (l) => ue(C) ? C.value = l : null),
-                    "display-value": (l) => l.displayText,
+                u("div", Pe, [
+                  r(n(ke), {
+                    items: n(R),
+                    "onUpdate:items": l[1] || (l[1] = (i) => ve(R) ? R.value = i : null),
+                    "display-value": (i) => i.displayText,
                     variant: "compact",
                     "draggable-area": "full",
-                    "test-id": n.testId
+                    "test-id": s.testId
                   }, {
-                    menu: p(({ item: l }) => [
-                      r(Se, {
-                        disabled: s(x),
-                        "tooltip-text": s(x) ? s(T) : null,
-                        onClick: (o) => L(l.id)
+                    menu: p(({ item: i }) => [
+                      r(Te, {
+                        disabled: n(V),
+                        "tooltip-text": n(V) ? n(w) : null,
+                        onClick: (a) => U(i.id)
                       }, null, 8, ["disabled", "tooltip-text", "onClick"])
                     ]),
                     _: 1
@@ -318,5 +338,5 @@ const ke = { class: "content" }, be = { class: "options-list-wrapper" }, Ce = {
   }
 });
 export {
-  lt as default
+  ot as default
 };

package/components/columnPicker/index.d.ts

@@ -90,6 +90,7 @@ declare const ColumnPickerTypes: () => ({
             };
         }>> & {
             "onUpdate:selected"?: (value: unknown[]) => any;
+            onTrackUserActivity?: (isResetToDefault: boolean, isSearched: boolean, isExpanded: boolean, isCollapse: boolean, status: "Cancel" | "Save") => any;
         } & import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, "testId" | "selected" | "options" | "minSelections" | "noResultsText" | "searchAutoFocus" | "searchPlaceholder" | "headerText" | "appendToBody" | "defaultSelection" | "inlineGroupIds" | "idKey" | "displayKey" | "childrenKey" | "disabledKey" | "minSelectionsTooltipMessage">;
         $attrs: {
             [x: string]: unknown;
@@ -102,7 +103,7 @@ declare const ColumnPickerTypes: () => ({
         }>;
         $root: import("vue").ComponentPublicInstance<{}, {}, {}, {}, {}, {}, {}, {}, false, import("vue").ComponentOptionsBase<any, any, any, any, any, any, any, any, any, {}, {}, string>, {}>;
         $parent: import("vue").ComponentPublicInstance<{}, {}, {}, {}, {}, {}, {}, {}, false, import("vue").ComponentOptionsBase<any, any, any, any, any, any, any, any, any, {}, {}, string>, {}>;
-        $emit: (event: "update:selected", value: unknown[]) => void;
+        $emit: ((event: "update:selected", value: unknown[]) => void) & ((event: "trackUserActivity", isResetToDefault: boolean, isSearched: boolean, isExpanded: boolean, isCollapse: boolean, status: "Cancel" | "Save") => void);
         $el: any;
         $options: import("vue").ComponentOptionsBase<Readonly<import("vue").ExtractPropTypes<{
             testId: {
@@ -174,8 +175,10 @@ declare const ColumnPickerTypes: () => ({
             };
         }>> & {
             "onUpdate:selected"?: (value: unknown[]) => any;
+            onTrackUserActivity?: (isResetToDefault: boolean, isSearched: boolean, isExpanded: boolean, isCollapse: boolean, status: "Cancel" | "Save") => any;
         }, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
             "update:selected": (value: unknown[]) => void;
+            trackUserActivity: (isResetToDefault: boolean, isSearched: boolean, isExpanded: boolean, isCollapse: boolean, status: "Cancel" | "Save") => void;
         }, string, {
             testId: string;
             selected: unknown[];
@@ -283,6 +286,7 @@ declare const ColumnPickerTypes: () => ({
         };
     }>> & {
         "onUpdate:selected"?: (value: unknown[]) => any;
+        onTrackUserActivity?: (isResetToDefault: boolean, isSearched: boolean, isExpanded: boolean, isCollapse: boolean, status: "Cancel" | "Save") => any;
     } & import("vue").ShallowUnwrapRef<{}> & {} & import("vue").ComponentCustomProperties & {};
     __isFragment?: never;
     __isTeleport?: never;
@@ -357,8 +361,10 @@ declare const ColumnPickerTypes: () => ({
     };
 }>> & {
     "onUpdate:selected"?: (value: unknown[]) => any;
+    onTrackUserActivity?: (isResetToDefault: boolean, isSearched: boolean, isExpanded: boolean, isCollapse: boolean, status: "Cancel" | "Save") => any;
 }, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
     "update:selected": (value: unknown[]) => void;
+    trackUserActivity: (isResetToDefault: boolean, isSearched: boolean, isExpanded: boolean, isCollapse: boolean, status: "Cancel" | "Save") => void;
 }, string, {
     testId: string;
     selected: unknown[];