@ironsource/shared-ui 2.1.12-rc.47 → 2.1.12-rc.49

package/components/sortableList/SortableSelectableList.vue2.js

@@ -0,0 +1,128 @@
+ import "../../SortableSelectableList.vue_vue_type_style_index_0_scoped_40b0a4de_lang.css"; import { defineComponent as x, useCssVars as G, useSlots as N, ref as O, computed as u, watch as H, openBlock as s, createElementBlock as g, mergeProps as w, unref as l, renderSlot as b, createCommentVNode as c, createBlock as C, isRef as S, withCtx as V, Fragment as $, renderList as z, createSlots as F, createVNode as M } from "vue";
+import { VueDraggable as U } from "vue-draggable-plus";
+import j from "./SortableItem.vue.js";
+import { useTestIdAttrs as q } from "../../utils/testIds.js";
+import { SortableListTestIdModifiers as I } from "../../testids/index.js";
+import { useDraggableHelpers as J } from "./composables/useDraggableHelpers.js";
+import K from "./LoaderBars.vue.js";
+import Q from "../columnConfigurator/ShowMoreLink.vue.js";
+import { DRAGGABLE_HANDLE_SELECTOR as W, DRAGGABLE_AREA_SELECTOR as X } from "./consts.js";
+const Y = {
+  key: 0,
+  class: "header-container"
+}, Z = {
+  key: 1,
+  class: "sortable-list-container"
+}, re = /* @__PURE__ */ x({
+  __name: "SortableSelectableList",
+  props: {
+    items: { default: () => [] },
+    displayValue: { type: Function, default: (n) => n.displayText || n.toString() },
+    openId: { default: null },
+    selectedChildPerItem: { default: () => ({}) },
+    variant: { default: "default" },
+    draggableArea: { default: "handle" },
+    isLoading: { type: Boolean, default: !1 },
+    loadingRowCount: { default: 3 },
+    alwaysVisibleCount: { default: null },
+    zIndexBase: { default: 100 },
+    testId: { default: "" }
+  },
+  emits: ["sortableItemDragged", "update:items", "update:openId", "update:selectedChildPerItem"],
+  setup(n, { emit: o }) {
+    const t = n;
+    G((e) => ({
+      "3cf7ee9d": n.zIndexBase
+    }));
+    const f = N(), L = (e) => {
+      if (!e.children)
+        return t.displayValue(e);
+      const d = t.selectedChildPerItem[e.id] ?? null, a = e.children.find((h) => h.id === d);
+      return a ? t.displayValue(a) : t.displayValue(e);
+    }, i = O(!1), m = u({
+      get: () => !i.value,
+      set: (e) => i.value = !e
+    }), y = u(() => {
+      const e = t.alwaysVisibleCount ?? 0;
+      return t.items?.length > e;
+    });
+    H(y, (e, d) => {
+      d === !0 && e === !1 && (i.value = !1);
+    });
+    const r = u({
+      get() {
+        return i.value && t.alwaysVisibleCount ? t.items.slice(0, t.alwaysVisibleCount) : t.items;
+      },
+      set(e) {
+        o("update:items", [...e, ...A.value]);
+      }
+    }), A = u(() => i.value ? t.alwaysVisibleCount ? t.items.slice(t.alwaysVisibleCount) : [] : []), E = u(
+      () => t.draggableArea === "handle" ? W : X
+    ), { onDragStart: k, onDragEnd: B, draggingInProgress: T } = J(o), D = (e) => e.id === t.openId && !T.value, R = (e, d) => {
+      d ? o("update:openId", e.id) : o("update:openId", null);
+    }, P = (e, d) => {
+      o("update:selectedChildPerItem", {
+        ...t.selectedChildPerItem,
+        [d.id]: e.id
+      }), o("update:openId", d.id);
+    }, v = q(t.testId, I);
+    return (e, d) => (s(), g("div", w({ class: "sortable-selectable-list" }, l(v)[l(I).CONTAINER]), [
+      l(f).header ? (s(), g("div", Y, [
+        l(f).header ? b(e.$slots, "header", { key: 0 }, void 0, !0) : c("", !0)
+      ])) : c("", !0),
+      l(r).length && !n.isLoading ? (s(), g("div", Z, [
+        l(r).length ? (s(), C(l(U), w({
+          key: 0,
+          modelValue: l(r),
+          "onUpdate:modelValue": d[0] || (d[0] = (a) => S(r) ? r.value = a : null),
+          class: "sortable-list",
+          filter: ".expand-icon",
+          animation: 150,
+          handle: l(E)
+        }, l(v)[l(I).DRAGGABLE_LIST], {
+          onStart: l(k),
+          onEnd: l(B)
+        }), {
+          default: V(() => [
+            (s(!0), g($, null, z(l(r), (a, h) => (s(), C(j, {
+              key: a.id,
+              "data-id": a.id,
+              item: a,
+              index: h,
+              "is-open": D(a),
+              "is-disabled": !!a.isDisabled,
+              "selected-child-id": n.selectedChildPerItem[a.id] ?? null,
+              "display-value": L,
+              variant: n.variant,
+              "draggable-area": n.draggableArea,
+              onToggle: (p) => R(a, p),
+              onSelectChild: (p) => P(p, a)
+            }, F({ _: 2 }, [
+              l(f).menu ? {
+                name: "menu",
+                fn: V(() => [
+                  b(e.$slots, "menu", { item: a }, void 0, !0)
+                ]),
+                key: "0"
+              } : void 0
+            ]), 1032, ["data-id", "item", "index", "is-open", "is-disabled", "selected-child-id", "variant", "draggable-area", "onToggle", "onSelectChild"]))), 128))
+          ]),
+          _: 3
+        }, 16, ["modelValue", "handle", "onStart", "onEnd"])) : c("", !0),
+        l(y) ? (s(), C(Q, {
+          key: 1,
+          "all-shown": l(m),
+          "onUpdate:all-shown": d[1] || (d[1] = (a) => S(m) ? m.value = a : null)
+        }, null, 8, ["all-shown"])) : c("", !0)
+      ])) : n.isLoading ? b(e.$slots, "loader", { key: 2 }, () => [
+        M(K, {
+          "loading-row-count": n.loadingRowCount,
+          variant: n.variant
+        }, null, 8, ["loading-row-count", "variant"])
+      ], !0) : c("", !0)
+    ], 16));
+  }
+});
+export {
+  re as default
+};

package/components/sortableList/composables/useDraggableHelpers.d.ts

@@ -0,0 +1,5 @@
+export declare const useDraggableHelpers: (emit: any) => {
+    onDragStart: (e: any) => void;
+    onDragEnd: (e: any) => void;
+    draggingInProgress: import("vue").Ref<boolean>;
+};

package/components/sortableList/composables/useDraggableHelpers.js

@@ -0,0 +1,20 @@
+import { ref as d } from "vue";
+import { DRAG_CURSOR_CSS_CLASS as r } from "../consts.js";
+const u = (a) => {
+  const t = d(!1);
+  return {
+    onDragStart: (e) => {
+      t.value = !0, setTimeout(() => e.target.classList.add(r), 50);
+    },
+    onDragEnd: (e) => {
+      const { target: s, item: o, newIndex: n } = e;
+      t.value = !1, s.classList.remove(r);
+      const g = o.attributes["data-id"]?.value;
+      a("sortableItemDragged", { id: g, newIndex: n });
+    },
+    draggingInProgress: t
+  };
+};
+export {
+  u as useDraggableHelpers
+};

package/components/sortableList/consts.d.ts

@@ -1 +1,3 @@
 export declare const DRAG_CURSOR_CSS_CLASS = "force-grabbing-cursor";
+export declare const DRAGGABLE_HANDLE_SELECTOR = ".draggable-handle";
+export declare const DRAGGABLE_AREA_SELECTOR = ".handle-area";

package/components/sortableList/consts.js

@@ -1,4 +1,6 @@
-const r = "force-grabbing-cursor";
+const A = "force-grabbing-cursor", E = ".draggable-handle", R = ".handle-area";
 export {
-  r as DRAG_CURSOR_CSS_CLASS
+  R as DRAGGABLE_AREA_SELECTOR,
+  E as DRAGGABLE_HANDLE_SELECTOR,
+  A as DRAG_CURSOR_CSS_CLASS
 };

package/components/sortableList/index.d.ts

@@ -15,13 +15,13 @@ declare const SortableListTypes: () => ({
             childListMaxHeight: string;
             searchHandler: (item: import("./SortableList.types").SortableListItem, searchQuery: string) => boolean;
             draggableArea: "handle" | "full";
+            loadingRowCount: number;
             openId: string | number;
+            zIndexBase: number;
             selectedId: string | number;
             showSearch: boolean;
-            loadingRowCount: number;
             emptyStateTitle: string;
             isSticky: boolean;
-            zIndexBase: number;
         }> & Omit<Readonly<import("vue").ExtractPropTypes<{
             search: {
                 type: import("vue").PropType<string>;
@@ -69,10 +69,18 @@ declare const SortableListTypes: () => ({
                 type: import("vue").PropType<"handle" | "full">;
                 default: string;
             };
+            loadingRowCount: {
+                type: import("vue").PropType<number>;
+                default: number;
+            };
             openId: {
                 type: import("vue").PropType<string | number>;
                 default: any;
             };
+            zIndexBase: {
+                type: import("vue").PropType<number>;
+                default: number;
+            };
             selectedId: {
                 type: import("vue").PropType<string | number>;
                 default: any;
@@ -81,10 +89,6 @@ 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;
@@ -93,10 +97,6 @@ declare const SortableListTypes: () => ({
                 type: import("vue").PropType<boolean>;
                 default: boolean;
             };
-            zIndexBase: {
-                type: import("vue").PropType<number>;
-                default: number;
-            };
         }>> & {
             onClearSearch?: () => any;
             onSortableItemDragged?: (event: {
@@ -108,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" | "variant" | "isLoading" | "displayValue" | "searchPlaceholder" | "items" | "selectedChildId" | "childListMaxHeight" | "searchHandler" | "draggableArea" | "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" | "loadingRowCount" | "openId" | "zIndexBase" | "selectedId" | "showSearch" | "emptyStateTitle" | "isSticky">;
         $attrs: {
             [x: string]: unknown;
         };
@@ -172,10 +172,18 @@ declare const SortableListTypes: () => ({
                 type: import("vue").PropType<"handle" | "full">;
                 default: string;
             };
+            loadingRowCount: {
+                type: import("vue").PropType<number>;
+                default: number;
+            };
             openId: {
                 type: import("vue").PropType<string | number>;
                 default: any;
             };
+            zIndexBase: {
+                type: import("vue").PropType<number>;
+                default: number;
+            };
             selectedId: {
                 type: import("vue").PropType<string | number>;
                 default: any;
@@ -184,10 +192,6 @@ 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;
@@ -196,10 +200,6 @@ declare const SortableListTypes: () => ({
                 type: import("vue").PropType<boolean>;
                 default: boolean;
             };
-            zIndexBase: {
-                type: import("vue").PropType<number>;
-                default: number;
-            };
         }>> & {
             onClearSearch?: () => any;
             onSortableItemDragged?: (event: {
@@ -234,13 +234,13 @@ declare const SortableListTypes: () => ({
             childListMaxHeight: string;
             searchHandler: (item: import("./SortableList.types").SortableListItem, searchQuery: string) => boolean;
             draggableArea: "handle" | "full";
+            loadingRowCount: number;
             openId: string | number;
+            zIndexBase: number;
             selectedId: string | number;
             showSearch: boolean;
-            loadingRowCount: number;
             emptyStateTitle: string;
             isSticky: boolean;
-            zIndexBase: number;
         }, {}, string> & {
             beforeCreate?: (() => void) | (() => void)[];
             created?: (() => void) | (() => void)[];
@@ -308,10 +308,18 @@ declare const SortableListTypes: () => ({
             type: import("vue").PropType<"handle" | "full">;
             default: string;
         };
+        loadingRowCount: {
+            type: import("vue").PropType<number>;
+            default: number;
+        };
         openId: {
             type: import("vue").PropType<string | number>;
             default: any;
         };
+        zIndexBase: {
+            type: import("vue").PropType<number>;
+            default: number;
+        };
         selectedId: {
             type: import("vue").PropType<string | number>;
             default: any;
@@ -320,10 +328,6 @@ 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;
@@ -332,10 +336,6 @@ declare const SortableListTypes: () => ({
             type: import("vue").PropType<boolean>;
             default: boolean;
         };
-        zIndexBase: {
-            type: import("vue").PropType<number>;
-            default: number;
-        };
     }>> & {
         onClearSearch?: () => any;
         onSortableItemDragged?: (event: {
@@ -398,10 +398,18 @@ declare const SortableListTypes: () => ({
         type: import("vue").PropType<"handle" | "full">;
         default: string;
     };
+    loadingRowCount: {
+        type: import("vue").PropType<number>;
+        default: number;
+    };
     openId: {
         type: import("vue").PropType<string | number>;
         default: any;
     };
+    zIndexBase: {
+        type: import("vue").PropType<number>;
+        default: number;
+    };
     selectedId: {
         type: import("vue").PropType<string | number>;
         default: any;
@@ -410,10 +418,6 @@ 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;
@@ -422,10 +426,6 @@ declare const SortableListTypes: () => ({
         type: import("vue").PropType<boolean>;
         default: boolean;
     };
-    zIndexBase: {
-        type: import("vue").PropType<number>;
-        default: number;
-    };
 }>> & {
     onClearSearch?: () => any;
     onSortableItemDragged?: (event: {
@@ -460,13 +460,13 @@ declare const SortableListTypes: () => ({
     childListMaxHeight: string;
     searchHandler: (item: import("./SortableList.types").SortableListItem, searchQuery: string) => boolean;
     draggableArea: "handle" | "full";
+    loadingRowCount: number;
     openId: string | number;
+    zIndexBase: number;
     selectedId: string | number;
     showSearch: boolean;
-    loadingRowCount: number;
     emptyStateTitle: string;
     isSticky: boolean;
-    zIndexBase: number;
 }, {}, string> & import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps & (new () => {
     $slots: {
         header?(_: {}): any;

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

@@ -141,13 +141,13 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<__
 }>>> & {
     onSelectAll?: (value: boolean) => any;
     onLoadMore?: () => any;
+    "onUpdate:selection"?: (selection: unknown[]) => any;
     "onUpdate:search"?: (query: string) => any;
     onOnScroll?: (event: Event) => any;
     "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;
 }, {
     sort: Sort;
@@ -158,11 +158,11 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<__
     searchAutoFocus: boolean;
     searchPlaceholder: string;
     selection: unknown[];
-    showSearch: boolean;
     loadingRowCount: number;
+    zIndexBase: number;
+    showSearch: boolean;
     emptyStateTitle: string;
     isSticky: boolean;
-    zIndexBase: number;
     sections: Section[];
     isStickyHeader: boolean;
     emptyStateSubtitle: string;
@@ -208,6 +208,7 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<__
     }): any;
     "empty-state"?(_: {}): any;
     footer?(_: {}): any;
+    "side-panel"?(_: {}): any;
 }>;
 export default _default;
 type __VLS_NonUndefinedable<T> = T extends undefined ? never : T;

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_da7631e0_lang.css"; //*');
-const s = /* @__PURE__ */ e(o, [["__scopeId", "data-v-da7631e0"]]);
+import e from "./DataGrid.vue2.js";
+/* empty css               */import o from "../../../_virtual/_plugin-vue_export-helper.js";
+// import "../../../DataGrid.vue_vue_type_style_index_0_scoped_ef67c78e_lang.css"; //*');
+const a = /* @__PURE__ */ o(e, [["__scopeId", "data-v-ef67c78e"]]);
 export {
-  s as default
+  a as default
 };