@ironsource/shared-ui 2.1.12-test.52 → 2.1.12-test.53

package/components/sortableList/SortableList.vue2.js

@@ -1,28 +1,30 @@
- import "../../SortableList.vue_vue_type_style_index_0_scoped_8f267f88_lang.css"; import { defineComponent as P, useCssVars as z, useSlots as G, computed as S, ref as U, openBlock as s, createElementBlock as r, mergeProps as V, unref as l, normalizeClass as K, renderSlot as g, createCommentVNode as h, createBlock as p, isRef as A, withCtx as I, Fragment as x, renderList as B, createSlots as E, createElementVNode as Q, createVNode as H, createTextVNode as j, toDisplayString as J } from "vue";
-import { VueDraggable as W } from "vue-draggable-plus";
+ import "../../SortableList.vue_vue_type_style_index_0_scoped_84dc8525_lang.css"; import { defineComponent as z, useCssVars as G, useSlots as U, computed as f, ref as K, openBlock as s, createElementBlock as i, mergeProps as V, unref as l, normalizeClass as Q, renderSlot as y, createCommentVNode as h, createBlock as S, isRef as $, withCtx as I, Fragment as x, renderList as B, createSlots as w, createElementVNode as j, createVNode as E, createTextVNode as J, toDisplayString as W } from "vue";
+import { VueDraggable as X } from "vue-draggable-plus";
 import N from "./SortableItem.vue.js";
-import X from "../search/v4/SearchV4.vue.js";
-import Y from "../typography/v4/Typography.vue.js";
-import Z from "../skeleton/v4/SkeletonV4.vue.js";
-import { useVModel as _ } from "@vueuse/core";
+import Y from "../search/v4/SearchV4.vue.js";
+import Z from "../typography/v4/Typography.vue.js";
+import _ from "../skeleton/v4/SkeletonV4.vue.js";
+import { useVModel as ee } from "@vueuse/core";
 import { matchString as q } from "../../utils/search.js";
-import { useTestIdAttrs as ee } from "../../utils/testIds.js";
-import { SortableListTestIdModifiers as v } from "../../testids/index.js";
+import { useTestIdAttrs as te } from "../../utils/testIds.js";
+import { SortableListTestIdModifiers as p } from "../../testids/index.js";
 import { DRAG_CURSOR_CSS_CLASS as O } from "./consts.js";
-const te = {
+const le = {
   key: 1,
   class: "sortable-list-container"
-}, le = { class: "loader-bars" }, de = {
+}, ae = { class: "loader-bars" }, de = {
   key: 3,
   class: "empty-state-title"
-}, ye = /* @__PURE__ */ P({
+}, me = /* @__PURE__ */ z({
   __name: "SortableList",
   props: {
     items: { default: () => [] },
-    displayValue: { type: Function, default: (d) => d.displayText || d.toString() },
+    displayValue: { type: Function, default: (a) => a.displayText || a.toString() },
     openId: { default: null },
     selectedId: { default: null },
     selectedChildId: { default: null },
+    variant: { default: "default" },
+    draggableArea: { default: "handle" },
     search: { default: null },
     showSearch: { type: Boolean, default: !1 },
     searchPlaceholder: { default: "Search" },
@@ -36,136 +38,142 @@ const te = {
     testId: { default: "" }
   },
   emits: ["sortableItemDragged", "update:items", "update:openId", "update:selectedId", "update:selectedChildId", "update:search", "clearSearch"],
-  setup(d, { emit: n }) {
-    const i = d;
-    z((t) => ({
-      "2b5787e0": d.zIndexBase
+  setup(a, { emit: r }) {
+    const o = a;
+    G((t) => ({
+      dbaa7dcc: a.zIndexBase
     }));
-    const y = G(), u = _(i, "search", n), k = S(() => !!u.value?.trim()), C = S(() => k.value ? i.items.filter((t) => {
-      const a = t.children || [], e = u.value;
-      return i.searchHandler ? i.searchHandler(t, e) : q(t.displayText, e) || // match parent item
-      a.some((o) => q(o.displayText, e));
-    }) : i.items), f = S({
+    const m = U(), u = ee(o, "search", r), b = f(() => !!u.value?.trim()), k = f(() => b.value ? o.items.filter((t) => {
+      const d = t.children || [], e = u.value;
+      return o.searchHandler ? o.searchHandler(t, e) : q(t.displayText, e) || // match parent item
+      d.some((n) => q(n.displayText, e));
+    }) : o.items), g = f({
       get() {
-        return C.value.filter((t) => !t.isLocked);
+        return k.value.filter((t) => !t.isLocked);
       },
       set(t) {
-        n("update:items", [...t, ...L.value]);
+        r("update:items", [...t, ...C.value]);
       }
-    }), L = S(
-      () => C.value.filter((t) => t.isLocked)
-    ), b = U(!1), F = (t) => {
-      b.value = !0, setTimeout(() => t.target.classList.add(O), 50);
-    }, M = (t) => {
-      const { target: a, item: e, newIndex: o } = t;
-      b.value = !1, a.classList.remove(O);
+    }), C = f(
+      () => k.value.filter((t) => t.isLocked)
+    ), F = f(
+      () => o.draggableArea === "handle" ? ".draggable-handle" : ".handle-area"
+    ), L = K(!1), M = (t) => {
+      L.value = !0, setTimeout(() => t.target.classList.add(O), 50);
+    }, P = (t) => {
+      const { target: d, item: e, newIndex: n } = t;
+      L.value = !1, d.classList.remove(O);
       const c = e.attributes["data-id"]?.value;
-      n("sortableItemDragged", { id: c, newIndex: o });
-    }, D = (t) => (k.value || t.id === i.openId) && !b.value, R = (t, a) => {
-      a ? n("update:openId", t.id) : n("update:openId", null);
-    }, m = (t) => t.id === i.selectedId, $ = (t) => {
-      n("update:selectedId", t.id), n("update:selectedChildId", null);
-    }, w = (t, a) => {
-      n("update:selectedChildId", t.id), n("update:selectedId", a.id), n("update:openId", a.id);
-    }, T = ee(i.testId, v);
-    return (t, a) => (s(), r("div", V({ class: "sortable-list-and-header-container" }, l(T)[l(v).CONTAINER]), [
-      l(y).header || d.showSearch ? (s(), r("div", {
+      r("sortableItemDragged", { id: c, newIndex: n });
+    }, A = (t) => (b.value || t.id === o.openId) && !L.value, D = (t, d) => {
+      d ? r("update:openId", t.id) : r("update:openId", null);
+    }, v = (t) => t.id === o.selectedId, H = (t) => {
+      r("update:selectedId", t.id), r("update:selectedChildId", null);
+    }, R = (t, d) => {
+      r("update:selectedChildId", t.id), r("update:selectedId", d.id), r("update:openId", d.id);
+    }, T = te(o.testId, p);
+    return (t, d) => (s(), i("div", V({ class: "sortable-list-and-header-container" }, l(T)[l(p).CONTAINER]), [
+      l(m).header || a.showSearch ? (s(), i("div", {
         key: 0,
-        class: K(["header-container", { sticky: d.isSticky }])
+        class: Q(["header-container", { sticky: a.isSticky }])
       }, [
-        l(y).header ? g(t.$slots, "header", { key: 0 }, void 0, !0) : h("", !0),
-        d.showSearch ? (s(), p(l(X), {
+        l(m).header ? y(t.$slots, "header", { key: 0 }, void 0, !0) : h("", !0),
+        a.showSearch ? (s(), S(l(Y), {
           key: 1,
           modelValue: l(u),
-          "onUpdate:modelValue": a[0] || (a[0] = (e) => A(u) ? u.value = e : null),
-          placeholder: d.searchPlaceholder,
-          "test-id": d.testId,
-          onOnClear: a[1] || (a[1] = (e) => n("clearSearch"))
+          "onUpdate:modelValue": d[0] || (d[0] = (e) => $(u) ? u.value = e : null),
+          placeholder: a.searchPlaceholder,
+          "test-id": a.testId,
+          onOnClear: d[1] || (d[1] = (e) => r("clearSearch"))
         }, null, 8, ["modelValue", "placeholder", "test-id"])) : h("", !0)
       ], 2)) : h("", !0),
-      d.isLoading ? g(t.$slots, "loader", { key: 2 }, () => [
-        Q("div", le, [
-          (s(!0), r(x, null, B(d.loadingRowCount, (e) => (s(), r("div", { key: e }, [
-            H(l(Z), {
+      a.isLoading ? y(t.$slots, "loader", { key: 2 }, () => [
+        j("div", ae, [
+          (s(!0), i(x, null, B(a.loadingRowCount, (e) => (s(), i("div", { key: e }, [
+            E(l(_), {
               round: "",
               class: "loader-bar"
             })
           ]))), 128))
         ])
-      ], !0) : (s(), r("div", te, [
-        l(f).length ? (s(), p(l(W), V({
+      ], !0) : (s(), i("div", le, [
+        l(g).length ? (s(), S(l(X), V({
           key: 0,
-          modelValue: l(f),
-          "onUpdate:modelValue": a[2] || (a[2] = (e) => A(f) ? f.value = e : null),
+          modelValue: l(g),
+          "onUpdate:modelValue": d[2] || (d[2] = (e) => $(g) ? g.value = e : null),
           class: "sortable-list",
           filter: ".expand-icon",
           animation: 150,
-          handle: ".draggable-handle",
-          disabled: l(k)
-        }, l(T)[l(v).DRAGGABLE_LIST], {
-          onStart: F,
-          onEnd: M
+          handle: l(F),
+          disabled: l(b)
+        }, l(T)[l(p).DRAGGABLE_LIST], {
+          onStart: M,
+          onEnd: P
         }), {
           default: I(() => [
-            (s(!0), r(x, null, B(l(f), (e, o) => (s(), p(N, {
+            (s(!0), i(x, null, B(l(g), (e, n) => (s(), S(N, {
               key: e.id,
               "data-id": e.id,
               item: e,
-              index: o,
-              "is-open": D(e),
-              "is-selected": m(e),
-              "selected-child-id": m(e) ? d.selectedChildId : null,
-              "display-value": d.displayValue,
+              index: n,
+              "is-open": A(e),
+              "is-selected": v(e),
+              "is-disabled": !!e.isDisabled,
+              "selected-child-id": v(e) ? a.selectedChildId : null,
+              "display-value": a.displayValue,
               "search-query": l(u),
-              "search-handler": d.searchHandler,
-              onToggle: (c) => R(e, c),
-              onSelect: (c) => $(e),
-              onSelectChild: (c) => w(c, e)
-            }, E({ _: 2 }, [
-              l(y).menu ? {
+              "search-handler": a.searchHandler,
+              variant: a.variant,
+              "draggable-area": a.draggableArea,
+              onToggle: (c) => D(e, c),
+              onSelect: (c) => H(e),
+              onSelectChild: (c) => R(c, e)
+            }, w({ _: 2 }, [
+              l(m).menu ? {
                 name: "menu",
                 fn: I(() => [
-                  g(t.$slots, "menu", { item: e }, void 0, !0)
+                  y(t.$slots, "menu", { item: e }, void 0, !0)
                 ]),
                 key: "0"
               } : void 0
-            ]), 1032, ["data-id", "item", "index", "is-open", "is-selected", "selected-child-id", "display-value", "search-query", "search-handler", "onToggle", "onSelect", "onSelectChild"]))), 128))
+            ]), 1032, ["data-id", "item", "index", "is-open", "is-selected", "is-disabled", "selected-child-id", "display-value", "search-query", "search-handler", "variant", "draggable-area", "onToggle", "onSelect", "onSelectChild"]))), 128))
           ]),
           _: 3
-        }, 16, ["modelValue", "disabled"])) : h("", !0),
-        l(L).length ? (s(), r("div", V({
+        }, 16, ["modelValue", "handle", "disabled"])) : h("", !0),
+        l(C).length ? (s(), i("div", V({
           key: 1,
           class: "locked-list"
-        }, l(T)[l(v).LOCKED_LIST]), [
-          (s(!0), r(x, null, B(l(L), (e) => (s(), p(N, {
+        }, l(T)[l(p).LOCKED_LIST]), [
+          (s(!0), i(x, null, B(l(C), (e) => (s(), S(N, {
             key: e.id,
             item: e,
-            "is-open": D(e),
-            "is-selected": m(e),
-            "selected-child-id": m(e) ? d.selectedChildId : null,
-            "display-value": d.displayValue,
+            "is-open": A(e),
+            "is-selected": v(e),
+            "selected-child-id": v(e) ? a.selectedChildId : null,
+            "display-value": a.displayValue,
             "search-query": l(u),
-            "on-search": d.searchHandler,
-            "child-list-max-height": d.childListMaxHeight,
-            onToggle: (o) => R(e, o),
-            onSelect: (o) => $(e),
-            onSelectChild: (o) => w(o, e)
-          }, E({ _: 2 }, [
-            l(y).menu ? {
+            "on-search": a.searchHandler,
+            "child-list-max-height": a.childListMaxHeight,
+            variant: a.variant,
+            onToggle: (n) => D(e, n),
+            onSelect: (n) => H(e),
+            onSelectChild: (n) => R(n, e)
+          }, w({ _: 2 }, [
+            l(m).menu ? {
               name: "menu",
               fn: I(() => [
-                g(t.$slots, "menu", { item: e }, void 0, !0)
+                y(t.$slots, "menu", { item: e }, void 0, !0)
               ]),
               key: "0"
             } : void 0
-          ]), 1032, ["item", "is-open", "is-selected", "selected-child-id", "display-value", "search-query", "on-search", "child-list-max-height", "onToggle", "onSelect", "onSelectChild"]))), 128))
+          ]), 1032, ["item", "is-open", "is-selected", "selected-child-id", "display-value", "search-query", "on-search", "child-list-max-height", "variant", "onToggle", "onSelect", "onSelectChild"]))), 128))
         ], 16)) : h("", !0)
       ])),
-      !l(C).length && !d.isLoading ? (s(), r("div", de, [
-        g(t.$slots, "empty-state", {}, () => [
-          H(l(Y), { variant: "body2" }, {
+      !l(k).length && !a.isLoading ? (s(), i("div", de, [
+        y(t.$slots, "empty-state", {}, () => [
+          E(l(Z), { variant: "body2" }, {
             default: I(() => [
-              j(J(d.emptyStateTitle), 1)
+              J(W(a.emptyStateTitle), 1)
             ]),
             _: 1
           })
@@ -175,5 +183,5 @@ const te = {
   }
 });
 export {
-  ye as default
+  me as default
 };

package/components/sortableList/composables/useHoverEffect.js

@@ -10,7 +10,7 @@ const d = (e, r) => {
       ) || n.currentTarget.classList.add(r);
     },
     handleMouseout: () => {
-      e.value.classList.remove(r);
+      e.value?.classList.remove(r);
     }
   };
 };

package/components/sortableList/index.d.ts

@@ -6,6 +6,7 @@ declare const SortableListTypes: () => ({
         $props: Partial<{
             search: string;
             testId: string;
+            variant: "default" | "compact";
             isLoading: boolean;
             displayValue: (item: import("./SortableList.types").SortableListItem) => string;
             searchPlaceholder: string;
@@ -13,6 +14,7 @@ declare const SortableListTypes: () => ({
             selectedChildId: string | number;
             childListMaxHeight: string;
             searchHandler: (item: import("./SortableList.types").SortableListItem, searchQuery: string) => boolean;
+            draggableArea: "handle" | "full";
             openId: string | number;
             selectedId: string | number;
             showSearch: boolean;
@@ -29,6 +31,10 @@ declare const SortableListTypes: () => ({
                 type: import("vue").PropType<string>;
                 default: string;
             };
+            variant: {
+                type: import("vue").PropType<"default" | "compact">;
+                default: string;
+            };
             isLoading: {
                 type: import("vue").PropType<boolean>;
                 default: boolean;
@@ -59,6 +65,10 @@ declare const SortableListTypes: () => ({
                 type: import("vue").PropType<(item: import("./SortableList.types").SortableListItem, searchQuery: string) => boolean>;
                 default: any;
             };
+            draggableArea: {
+                type: import("vue").PropType<"handle" | "full">;
+                default: string;
+            };
             openId: {
                 type: import("vue").PropType<string | number>;
                 default: any;
@@ -98,7 +108,7 @@ declare const SortableListTypes: () => ({
             "onUpdate:selectedId"?: (id: string | number) => any;
             "onUpdate:selectedChildId"?: (id: string | number) => any;
             "onUpdate:search"?: (query: string) => any;
-        } & import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, "search" | "testId" | "isLoading" | "displayValue" | "searchPlaceholder" | "items" | "selectedChildId" | "childListMaxHeight" | "searchHandler" | "openId" | "selectedId" | "showSearch" | "loadingRowCount" | "emptyStateTitle" | "isSticky" | "zIndexBase">;
+        } & import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, "search" | "testId" | "variant" | "isLoading" | "displayValue" | "searchPlaceholder" | "items" | "selectedChildId" | "childListMaxHeight" | "searchHandler" | "draggableArea" | "openId" | "selectedId" | "showSearch" | "loadingRowCount" | "emptyStateTitle" | "isSticky" | "zIndexBase">;
         $attrs: {
             [x: string]: unknown;
         };
@@ -124,6 +134,10 @@ declare const SortableListTypes: () => ({
                 type: import("vue").PropType<string>;
                 default: string;
             };
+            variant: {
+                type: import("vue").PropType<"default" | "compact">;
+                default: string;
+            };
             isLoading: {
                 type: import("vue").PropType<boolean>;
                 default: boolean;
@@ -154,6 +168,10 @@ declare const SortableListTypes: () => ({
                 type: import("vue").PropType<(item: import("./SortableList.types").SortableListItem, searchQuery: string) => boolean>;
                 default: any;
             };
+            draggableArea: {
+                type: import("vue").PropType<"handle" | "full">;
+                default: string;
+            };
             openId: {
                 type: import("vue").PropType<string | number>;
                 default: any;
@@ -207,6 +225,7 @@ declare const SortableListTypes: () => ({
         }, string, {
             search: string;
             testId: string;
+            variant: "default" | "compact";
             isLoading: boolean;
             displayValue: (item: import("./SortableList.types").SortableListItem) => string;
             searchPlaceholder: string;
@@ -214,6 +233,7 @@ declare const SortableListTypes: () => ({
             selectedChildId: string | number;
             childListMaxHeight: string;
             searchHandler: (item: import("./SortableList.types").SortableListItem, searchQuery: string) => boolean;
+            draggableArea: "handle" | "full";
             openId: string | number;
             selectedId: string | number;
             showSearch: boolean;
@@ -250,6 +270,10 @@ declare const SortableListTypes: () => ({
             type: import("vue").PropType<string>;
             default: string;
         };
+        variant: {
+            type: import("vue").PropType<"default" | "compact">;
+            default: string;
+        };
         isLoading: {
             type: import("vue").PropType<boolean>;
             default: boolean;
@@ -280,6 +304,10 @@ declare const SortableListTypes: () => ({
             type: import("vue").PropType<(item: import("./SortableList.types").SortableListItem, searchQuery: string) => boolean>;
             default: any;
         };
+        draggableArea: {
+            type: import("vue").PropType<"handle" | "full">;
+            default: string;
+        };
         openId: {
             type: import("vue").PropType<string | number>;
             default: any;
@@ -332,6 +360,10 @@ declare const SortableListTypes: () => ({
         type: import("vue").PropType<string>;
         default: string;
     };
+    variant: {
+        type: import("vue").PropType<"default" | "compact">;
+        default: string;
+    };
     isLoading: {
         type: import("vue").PropType<boolean>;
         default: boolean;
@@ -362,6 +394,10 @@ declare const SortableListTypes: () => ({
         type: import("vue").PropType<(item: import("./SortableList.types").SortableListItem, searchQuery: string) => boolean>;
         default: any;
     };
+    draggableArea: {
+        type: import("vue").PropType<"handle" | "full">;
+        default: string;
+    };
     openId: {
         type: import("vue").PropType<string | number>;
         default: any;
@@ -415,6 +451,7 @@ declare const SortableListTypes: () => ({
 }, string, {
     search: string;
     testId: string;
+    variant: "default" | "compact";
     isLoading: boolean;
     displayValue: (item: import("./SortableList.types").SortableListItem) => string;
     searchPlaceholder: string;
@@ -422,6 +459,7 @@ declare const SortableListTypes: () => ({
     selectedChildId: string | number;
     childListMaxHeight: string;
     searchHandler: (item: import("./SortableList.types").SortableListItem, searchQuery: string) => boolean;
+    draggableArea: "handle" | "full";
     openId: string | number;
     selectedId: string | number;
     showSearch: boolean;

package/components/table/v4/DataGrid.vue.d.ts

@@ -146,9 +146,9 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<__
     "onUpdate:sort"?: (newSort: Sort) => any;
     onSaveRow?: (args_0: SaveRowEvent) => any;
     onOnClearSearch?: () => any;
+    onClickRow?: (rowIndex: number) => any;
     "onUpdate:selection"?: (selection: unknown[]) => any;
     onSelectRow?: (value: boolean) => any;
-    onClickRow?: (rowIndex: number) => any;
 }, {
     sort: Sort;
     title: string;
@@ -172,11 +172,11 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<__
     defaultScrollPosition: number;
     getRowId: (row: Row, index: number) => unknown;
     getRowKey: (row: Row, index: number) => string | number;
-    selectedMatcher: (rowId: unknown, selected: unknown) => boolean;
     emptyStateVariant: "error" | "settings" | "no-access" | "no-results" | "no-data" | "files";
-    helpTooltipVariant: "icon" | "underline";
     rowCustomClassKey: string;
     rowDataKey: string;
+    helpTooltipVariant: "icon" | "underline";
+    selectedMatcher: (rowId: unknown, selected: unknown) => boolean;
     isSelectionSticky: boolean;
     isSelectionBordered: boolean;
 }>, Partial<Record<`section-${string}`, (_: {}) => any>> & Partial<Record<`header-${string}`, (_: {
@@ -193,8 +193,8 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<__
     rowIndex: number;
 }) => any>> & {
     title?(_: {}): any;
-    "table-header-pre-search"?(_: {}): any;
     search?(_: {}): any;
+    "table-header-pre-search"?(_: {}): any;
     "table-header-actions"?(_: {}): any;
     "select-all-checkbox"?(_: {}): any;
     loader?(_: {}): any;

package/components/table/v4/DataGrid.vue.js

@@ -1,7 +1,7 @@
 import o from "./DataGrid.vue2.js";
 /* empty css               */import e from "../../../_virtual/_plugin-vue_export-helper.js";
-// import "../../../DataGrid.vue_vue_type_style_index_0_scoped_8e8df067_lang.css"; //*');
-const a = /* @__PURE__ */ e(o, [["__scopeId", "data-v-8e8df067"]]);
+// import "../../../DataGrid.vue_vue_type_style_index_0_scoped_da7631e0_lang.css"; //*');
+const s = /* @__PURE__ */ e(o, [["__scopeId", "data-v-da7631e0"]]);
 export {
-  a as default
+  s as default
 };