@ironsource/shared-ui 2.1.7-test.1 → 2.1.7-test.10

package/components/sortableList/SortableItemLabel.vue2.js

@@ -0,0 +1,60 @@
+ import "../../SortableItemLabel.vue_vue_type_style_index_0_scoped_1386ae20_lang.css"; import { defineComponent as m, openBlock as a, createBlock as u, unref as l, withCtx as t, createElementVNode as p, createElementBlock as c, Fragment as h, renderList as f, createVNode as i, createTextVNode as o, toDisplayString as r, normalizeClass as x } from "vue";
+import n from "../typography/v4/Typography.vue.js";
+import y from "../tooltip/v4/TooltipV4.vue.js";
+const _ = { class: "tooltip-content" }, k = /* @__PURE__ */ m({
+  __name: "SortableItemLabel",
+  props: {
+    item: null,
+    displayValue: null
+  },
+  setup(e) {
+    return (b, T) => (a(), u(l(y), {
+      class: "item-label",
+      placement: "right",
+      disabled: !e.item.helpText
+    }, {
+      tooltip: t(() => [
+        p("div", _, [
+          (a(!0), c(h, null, f(e.item.helpText, (s, d) => (a(), c("div", {
+            key: d,
+            class: "help"
+          }, [
+            i(l(n), {
+              class: "help__title",
+              variant: "h5"
+            }, {
+              default: t(() => [
+                o(r(s.title), 1)
+              ]),
+              _: 2
+            }, 1024),
+            i(l(n), {
+              class: "help__text",
+              variant: "body2"
+            }, {
+              default: t(() => [
+                o(r(s.text), 1)
+              ]),
+              _: 2
+            }, 1024)
+          ]))), 128))
+        ])
+      ]),
+      default: t(() => [
+        i(l(n), {
+          variant: "body2",
+          class: x({ "decorated-text": e.item.helpText?.length })
+        }, {
+          default: t(() => [
+            o(r(e.displayValue(e.item)), 1)
+          ]),
+          _: 1
+        }, 8, ["class"])
+      ]),
+      _: 1
+    }, 8, ["disabled"]));
+  }
+});
+export {
+  k as default
+};

package/components/sortableList/SortableList.vue.d.ts

@@ -9,6 +9,9 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<__
     showSearch?: boolean;
     searchPlaceholder?: string;
     searchHandler?: (item: SortableListItem, searchQuery: string) => boolean;
+    isLoading?: boolean;
+    loadingRowCount?: number;
+    emptyStateTitle?: string;
     testId?: string;
 }>, {
     items: () => any[];
@@ -20,8 +23,15 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<__
     showSearch: boolean;
     searchPlaceholder: string;
     searchHandler: any;
+    isLoading: boolean;
+    loadingRowCount: number;
+    emptyStateTitle: string;
     testId: string;
 }>, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    sortableItemDragged: (event: {
+        id: string;
+        newIndex: number;
+    }) => void;
     "update:items": (items: SortableListItem[]) => void;
     "update:openId": (id: string | number) => void;
     "update:selectedId": (id: string | number) => void;
@@ -38,6 +48,9 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<__
     showSearch?: boolean;
     searchPlaceholder?: string;
     searchHandler?: (item: SortableListItem, searchQuery: string) => boolean;
+    isLoading?: boolean;
+    loadingRowCount?: number;
+    emptyStateTitle?: string;
     testId?: string;
 }>, {
     items: () => any[];
@@ -49,8 +62,15 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<__
     showSearch: boolean;
     searchPlaceholder: string;
     searchHandler: any;
+    isLoading: boolean;
+    loadingRowCount: number;
+    emptyStateTitle: string;
     testId: string;
 }>>> & {
+    onSortableItemDragged?: (event: {
+        id: string;
+        newIndex: number;
+    }) => any;
     "onUpdate:items"?: (items: SortableListItem[]) => any;
     "onUpdate:openId"?: (id: string | number) => any;
     "onUpdate:selectedId"?: (id: string | number) => any;
@@ -60,6 +80,7 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<__
 }, {
     search: string;
     testId: string;
+    isLoading: boolean;
     displayValue: (item: SortableListItem) => string;
     searchPlaceholder: string;
     items: SortableListItem[];
@@ -68,10 +89,14 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<__
     openId: string | number;
     selectedId: string | number;
     showSearch: boolean;
+    loadingRowCount: number;
+    emptyStateTitle: string;
 }>, {
     menu?(_: {
         item: SortableListItem;
     }): any;
+    loader?(_: {}): any;
+    "empty-state"?(_: {}): any;
 }>;
 export default _default;
 type __VLS_NonUndefinedable<T> = T extends undefined ? never : T;

package/components/sortableList/SortableList.vue.js

@@ -0,0 +1,7 @@
+import o from "./SortableList.vue2.js";
+/* empty css                   */import e from "../../_virtual/_plugin-vue_export-helper.js";
+// import "../../SortableList.vue_vue_type_style_index_0_scoped_e9cd63b8_lang.css"; //*');
+const c = /* @__PURE__ */ e(o, [["__scopeId", "data-v-e9cd63b8"]]);
+export {
+  c as default
+};

package/components/sortableList/SortableList.vue2.js

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

package/components/sortableList/composables/useHoverEffect.js

@@ -0,0 +1,19 @@
+import { computed as t } from "vue";
+const d = (e, r) => {
+  const s = t(() => e.value ? Array.from(e.value.parentElement?.children || []) : []);
+  return {
+    handleMouseover: (n) => {
+      s.value.forEach(
+        (o) => o.classList.remove(r)
+      ), s.value.some(
+        (o) => o.classList.contains("sortable-chosen")
+      ) || n.currentTarget.classList.add(r);
+    },
+    handleMouseout: () => {
+      e.value.classList.remove(r);
+    }
+  };
+};
+export {
+  d as useHoverEffect
+};

package/components/sortableList/consts.js

@@ -0,0 +1,4 @@
+const r = "force-grabbing-cursor";
+export {
+  r as DRAG_CURSOR_CSS_CLASS
+};

package/components/sortableList/index.d.ts

@@ -6,6 +6,7 @@ declare const SortableListTypes: () => ({
         $props: Partial<{
             search: string;
             testId: string;
+            isLoading: boolean;
             displayValue: (item: import("./SortableList.types").SortableListItem) => string;
             searchPlaceholder: string;
             items: import("./SortableList.types").SortableListItem[];
@@ -14,6 +15,8 @@ declare const SortableListTypes: () => ({
             openId: string | number;
             selectedId: string | number;
             showSearch: boolean;
+            loadingRowCount: number;
+            emptyStateTitle: string;
         }> & Omit<Readonly<import("vue").ExtractPropTypes<{
             search: {
                 type: import("vue").PropType<string>;
@@ -23,6 +26,10 @@ declare const SortableListTypes: () => ({
                 type: import("vue").PropType<string>;
                 default: string;
             };
+            isLoading: {
+                type: import("vue").PropType<boolean>;
+                default: boolean;
+            };
             displayValue: {
                 type: import("vue").PropType<(item: import("./SortableList.types").SortableListItem) => string>;
                 required: true;
@@ -57,14 +64,26 @@ declare const SortableListTypes: () => ({
                 type: import("vue").PropType<boolean>;
                 default: boolean;
             };
+            loadingRowCount: {
+                type: import("vue").PropType<number>;
+                default: number;
+            };
+            emptyStateTitle: {
+                type: import("vue").PropType<string>;
+                default: string;
+            };
         }>> & {
+            onSortableItemDragged?: (event: {
+                id: string;
+                newIndex: number;
+            }) => any;
             "onUpdate:items"?: (items: import("./SortableList.types").SortableListItem[]) => any;
             "onUpdate:openId"?: (id: string | number) => any;
             "onUpdate:selectedId"?: (id: string | number) => any;
             "onUpdate:selectedChildId"?: (id: string | number) => any;
             "onUpdate:search"?: (query: string) => any;
             onClearSearch?: () => any;
-        } & import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, "search" | "testId" | "displayValue" | "searchPlaceholder" | "items" | "selectedChildId" | "searchHandler" | "openId" | "selectedId" | "showSearch">;
+        } & import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, "search" | "testId" | "isLoading" | "displayValue" | "searchPlaceholder" | "items" | "selectedChildId" | "searchHandler" | "openId" | "selectedId" | "showSearch" | "loadingRowCount" | "emptyStateTitle">;
         $attrs: {
             [x: string]: unknown;
         };
@@ -76,7 +95,10 @@ declare const SortableListTypes: () => ({
         }>;
         $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:items", items: import("./SortableList.types").SortableListItem[]) => void) & ((event: "update:openId", id: string | number) => void) & ((event: "update:selectedId", id: string | number) => void) & ((event: "update:selectedChildId", id: string | number) => void) & ((event: "update:search", query: string) => void) & ((event: "clearSearch") => void);
+        $emit: ((event: "sortableItemDragged", event: {
+            id: string;
+            newIndex: number;
+        }) => void) & ((event: "update:items", items: import("./SortableList.types").SortableListItem[]) => void) & ((event: "update:openId", id: string | number) => void) & ((event: "update:selectedId", id: string | number) => void) & ((event: "update:selectedChildId", id: string | number) => void) & ((event: "update:search", query: string) => void) & ((event: "clearSearch") => void);
         $el: any;
         $options: import("vue").ComponentOptionsBase<Readonly<import("vue").ExtractPropTypes<{
             search: {
@@ -87,6 +109,10 @@ declare const SortableListTypes: () => ({
                 type: import("vue").PropType<string>;
                 default: string;
             };
+            isLoading: {
+                type: import("vue").PropType<boolean>;
+                default: boolean;
+            };
             displayValue: {
                 type: import("vue").PropType<(item: import("./SortableList.types").SortableListItem) => string>;
                 required: true;
@@ -121,7 +147,19 @@ declare const SortableListTypes: () => ({
                 type: import("vue").PropType<boolean>;
                 default: boolean;
             };
+            loadingRowCount: {
+                type: import("vue").PropType<number>;
+                default: number;
+            };
+            emptyStateTitle: {
+                type: import("vue").PropType<string>;
+                default: string;
+            };
         }>> & {
+            onSortableItemDragged?: (event: {
+                id: string;
+                newIndex: number;
+            }) => any;
             "onUpdate:items"?: (items: import("./SortableList.types").SortableListItem[]) => any;
             "onUpdate:openId"?: (id: string | number) => any;
             "onUpdate:selectedId"?: (id: string | number) => any;
@@ -129,6 +167,10 @@ declare const SortableListTypes: () => ({
             "onUpdate:search"?: (query: string) => any;
             onClearSearch?: () => any;
         }, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+            sortableItemDragged: (event: {
+                id: string;
+                newIndex: number;
+            }) => void;
             "update:items": (items: import("./SortableList.types").SortableListItem[]) => void;
             "update:openId": (id: string | number) => void;
             "update:selectedId": (id: string | number) => void;
@@ -138,6 +180,7 @@ declare const SortableListTypes: () => ({
         }, string, {
             search: string;
             testId: string;
+            isLoading: boolean;
             displayValue: (item: import("./SortableList.types").SortableListItem) => string;
             searchPlaceholder: string;
             items: import("./SortableList.types").SortableListItem[];
@@ -146,6 +189,8 @@ declare const SortableListTypes: () => ({
             openId: string | number;
             selectedId: string | number;
             showSearch: boolean;
+            loadingRowCount: number;
+            emptyStateTitle: string;
         }, {}, string> & {
             beforeCreate?: (() => void) | (() => void)[];
             created?: (() => void) | (() => void)[];
@@ -175,6 +220,10 @@ declare const SortableListTypes: () => ({
             type: import("vue").PropType<string>;
             default: string;
         };
+        isLoading: {
+            type: import("vue").PropType<boolean>;
+            default: boolean;
+        };
         displayValue: {
             type: import("vue").PropType<(item: import("./SortableList.types").SortableListItem) => string>;
             required: true;
@@ -209,7 +258,19 @@ declare const SortableListTypes: () => ({
             type: import("vue").PropType<boolean>;
             default: boolean;
         };
+        loadingRowCount: {
+            type: import("vue").PropType<number>;
+            default: number;
+        };
+        emptyStateTitle: {
+            type: import("vue").PropType<string>;
+            default: string;
+        };
     }>> & {
+        onSortableItemDragged?: (event: {
+            id: string;
+            newIndex: number;
+        }) => any;
         "onUpdate:items"?: (items: import("./SortableList.types").SortableListItem[]) => any;
         "onUpdate:openId"?: (id: string | number) => any;
         "onUpdate:selectedId"?: (id: string | number) => any;
@@ -229,6 +290,10 @@ declare const SortableListTypes: () => ({
         type: import("vue").PropType<string>;
         default: string;
     };
+    isLoading: {
+        type: import("vue").PropType<boolean>;
+        default: boolean;
+    };
     displayValue: {
         type: import("vue").PropType<(item: import("./SortableList.types").SortableListItem) => string>;
         required: true;
@@ -263,7 +328,19 @@ declare const SortableListTypes: () => ({
         type: import("vue").PropType<boolean>;
         default: boolean;
     };
+    loadingRowCount: {
+        type: import("vue").PropType<number>;
+        default: number;
+    };
+    emptyStateTitle: {
+        type: import("vue").PropType<string>;
+        default: string;
+    };
 }>> & {
+    onSortableItemDragged?: (event: {
+        id: string;
+        newIndex: number;
+    }) => any;
     "onUpdate:items"?: (items: import("./SortableList.types").SortableListItem[]) => any;
     "onUpdate:openId"?: (id: string | number) => any;
     "onUpdate:selectedId"?: (id: string | number) => any;
@@ -271,6 +348,10 @@ declare const SortableListTypes: () => ({
     "onUpdate:search"?: (query: string) => any;
     onClearSearch?: () => any;
 }, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    sortableItemDragged: (event: {
+        id: string;
+        newIndex: number;
+    }) => void;
     "update:items": (items: import("./SortableList.types").SortableListItem[]) => void;
     "update:openId": (id: string | number) => void;
     "update:selectedId": (id: string | number) => void;
@@ -280,6 +361,7 @@ declare const SortableListTypes: () => ({
 }, string, {
     search: string;
     testId: string;
+    isLoading: boolean;
     displayValue: (item: import("./SortableList.types").SortableListItem) => string;
     searchPlaceholder: string;
     items: import("./SortableList.types").SortableListItem[];
@@ -288,11 +370,15 @@ declare const SortableListTypes: () => ({
     openId: string | number;
     selectedId: string | number;
     showSearch: boolean;
+    loadingRowCount: number;
+    emptyStateTitle: string;
 }, {}, string> & import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps & (new () => {
     $slots: {
         menu?(_: {
             item: import("./SortableList.types").SortableListItem;
         }): any;
+        loader?(_: {}): any;
+        "empty-state"?(_: {}): any;
     };
 }))[];
 export { SortableList, SortableListTypes };

package/components/sortableList/index.js

@@ -0,0 +1,6 @@
+import t from "./SortableList.vue.js";
+const r = () => [t];
+export {
+  t as SortableList,
+  r as SortableListTypes
+};

package/components/table/v3/Table.vue.d.ts

@@ -84,15 +84,15 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<__
 }, {
     testId: string;
     isLoading: boolean;
+    loadingRowCount: number;
+    emptyStateTitle: string;
     isSticky: boolean;
     sections: Section[];
     isStickyHeader: boolean;
-    emptyStateTitle: string;
     emptyStateSubtitle: string;
     isInfiniteScroll: boolean;
     infiniteScrollThreshold: number;
     rowHeight: number | ((index: number) => number);
-    loadingRowCount: number;
     defaultScrollPosition: number;
 }>, Partial<Record<`section-${string}`, (_: {}) => any>> & Partial<Record<`header-${string}`, (_: {
     column: Column;