@ironsource/shared-ui 2.1.6-rc.44 → 2.1.6-rc.46

package/MultipleDataGrid.vue_vue_type_style_index_0_scoped_260b9cdc_lang.css

@@ -0,0 +1 @@
+.multi-table-container[data-v-260b9cdc]{border-radius:var(--border-radius-md);border:1px solid var(--common-divider);display:flex;flex-direction:column;overflow-y:auto;width:100%}.multi-table-container .table-header-container[data-v-260b9cdc]{align-items:center;background-color:var(--background-paper-elevation-0);display:flex;height:calc(var(--spacing-800) - 2px);justify-content:space-between;padding:var(--spacing-300);width:100%}.multi-table-container .table-header-container.sticky[data-v-260b9cdc]{position:sticky;top:0;z-index:calc(var(--6bca14de) + 3)}.multi-table-container[data-v-260b9cdc] table{display:table;border:unset;border-radius:unset}.multi-table-container[data-v-260b9cdc] thead{border-top:1px solid var(--common-divider)}.multi-table-container .tables-container[data-v-260b9cdc] thead.sticky{top:62px}

package/components/table/common/Table.types.d.ts

@@ -29,3 +29,10 @@ export type MenuItem = {
     text: string;
     icon?: string;
 };
+export type TableSettings = {
+    columns: Column[];
+    rows: Row[];
+    sections?: Section[];
+    rowHeight?: number;
+    testId?: string;
+};

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

@@ -0,0 +1,137 @@
+import { Column } from '@/components/table/v4';
+import { TableSettings } from '@is-ssp/table/common/Table.types';
+declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<{
+    tablesSettings: TableSettings[];
+    loadingAndEmptyStatesColumns: Column[];
+    isSticky?: boolean;
+    isLoading?: boolean;
+    emptyStateVariant?: "error" | "no-access" | "no-results" | "no-data" | "files" | "settings";
+    emptyStateTitle?: string;
+    emptyStateSubtitle?: string;
+    loadingRowCount?: number;
+    search?: string;
+    showSearch?: boolean;
+    searchPlaceholder?: string;
+    zIndexBase?: number;
+    count?: number;
+    totalCount?: number;
+    displayingText?: string;
+    outOfText?: string;
+    totalText?: string;
+    testId?: string;
+}>, {
+    tablesSettings: () => any[];
+    loadingAndEmptyStatesColumns: () => any[];
+    isSticky: boolean;
+    isLoading: boolean;
+    emptyStateVariant: any;
+    emptyStateTitle: string;
+    emptyStateSubtitle: string;
+    loadingRowCount: number;
+    search: any;
+    showSearch: boolean;
+    searchPlaceholder: string;
+    zIndexBase: number;
+    count: number;
+    totalCount: number;
+    displayingText: string;
+    outOfText: string;
+    totalText: string;
+    testId: string;
+}>, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    "update:search": (query: string) => void;
+    onScroll: (scrollTop: number) => void;
+    onClearSearch: () => void;
+    clickRow: (rowIndex: number, tableIndex: number) => void;
+}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<{
+    tablesSettings: TableSettings[];
+    loadingAndEmptyStatesColumns: Column[];
+    isSticky?: boolean;
+    isLoading?: boolean;
+    emptyStateVariant?: "error" | "no-access" | "no-results" | "no-data" | "files" | "settings";
+    emptyStateTitle?: string;
+    emptyStateSubtitle?: string;
+    loadingRowCount?: number;
+    search?: string;
+    showSearch?: boolean;
+    searchPlaceholder?: string;
+    zIndexBase?: number;
+    count?: number;
+    totalCount?: number;
+    displayingText?: string;
+    outOfText?: string;
+    totalText?: string;
+    testId?: string;
+}>, {
+    tablesSettings: () => any[];
+    loadingAndEmptyStatesColumns: () => any[];
+    isSticky: boolean;
+    isLoading: boolean;
+    emptyStateVariant: any;
+    emptyStateTitle: string;
+    emptyStateSubtitle: string;
+    loadingRowCount: number;
+    search: any;
+    showSearch: boolean;
+    searchPlaceholder: string;
+    zIndexBase: number;
+    count: number;
+    totalCount: number;
+    displayingText: string;
+    outOfText: string;
+    totalText: string;
+    testId: string;
+}>>> & {
+    onOnScroll?: (scrollTop: number) => any;
+    "onUpdate:search"?: (query: string) => any;
+    onOnClearSearch?: () => any;
+    onClickRow?: (rowIndex: number, tableIndex: number) => any;
+}, {
+    search: string;
+    testId: string;
+    isLoading: boolean;
+    searchPlaceholder: string;
+    count: number;
+    isSticky: boolean;
+    emptyStateTitle: string;
+    emptyStateSubtitle: string;
+    loadingRowCount: number;
+    emptyStateVariant: "error" | "no-access" | "no-results" | "no-data" | "files" | "settings";
+    showSearch: boolean;
+    zIndexBase: number;
+    totalCount: number;
+    displayingText: string;
+    outOfText: string;
+    totalText: string;
+    tablesSettings: TableSettings[];
+    loadingAndEmptyStatesColumns: Column[];
+}>, Partial<Record<string, (_: {
+    cell: any;
+    isLoading: any;
+    cellIndex: any;
+    row: any;
+    rowIndex: any;
+}) => any>>>;
+export default _default;
+type __VLS_NonUndefinedable<T> = T extends undefined ? never : T;
+type __VLS_TypePropsToRuntimeProps<T> = {
+    [K in keyof T]-?: {} extends Pick<T, K> ? {
+        type: import('vue').PropType<__VLS_NonUndefinedable<T[K]>>;
+    } : {
+        type: import('vue').PropType<T[K]>;
+        required: true;
+    };
+};
+type __VLS_WithDefaults<P, D> = {
+    [K in keyof Pick<P, keyof P>]: K extends keyof D ? __VLS_Prettify<P[K] & {
+        default: D[K];
+    }> : P[K];
+};
+type __VLS_Prettify<T> = {
+    [K in keyof T]: T[K];
+} & {};
+type __VLS_WithTemplateSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

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

@@ -0,0 +1,7 @@
+import o from "./MultipleDataGrid.vue2.js";
+/* empty css                       */import t from "../../../_virtual/_plugin-vue_export-helper.js";
+// import "../../../MultipleDataGrid.vue_vue_type_style_index_0_scoped_260b9cdc_lang.css"; //*');
+const p = /* @__PURE__ */ t(o, [["__scopeId", "data-v-260b9cdc"]]);
+export {
+  p as default
+};

package/components/table/v4/MultipleDataGrid.vue2.js

@@ -0,0 +1,123 @@
+ import "../../../MultipleDataGrid.vue_vue_type_style_index_0_scoped_260b9cdc_lang.css"; import { defineComponent as T, useCssVars as V, computed as L, openBlock as l, createElementBlock as d, createElementVNode as f, normalizeClass as z, createBlock as c, unref as o, createCommentVNode as m, isRef as p, Fragment as E, renderList as g, createSlots as D, withCtx as N, renderSlot as O } from "vue";
+import S from "./DataGrid.vue.js";
+import "./DataGridMenu.vue.js";
+import G from "./DataGridRowsCounter.vue.js";
+import "./MultipleDataGrid.vue.js";
+import M from "../../search/v4/SearchV4.vue.js";
+import { useVModel as P } from "@vueuse/core";
+const $ = { class: "rows-counter-container" }, A = {
+  key: 0,
+  class: "tables-container"
+}, K = /* @__PURE__ */ T({
+  __name: "MultipleDataGrid",
+  props: {
+    tablesSettings: { default: () => [] },
+    loadingAndEmptyStatesColumns: { default: () => [] },
+    isSticky: { type: Boolean, default: !0 },
+    isLoading: { type: Boolean, default: !1 },
+    emptyStateVariant: { default: null },
+    emptyStateTitle: { default: "No data to display" },
+    emptyStateSubtitle: { default: "" },
+    loadingRowCount: { default: 3 },
+    search: { default: null },
+    showSearch: { type: Boolean, default: !0 },
+    searchPlaceholder: { default: "Search" },
+    zIndexBase: { default: 100 },
+    count: { default: 0 },
+    totalCount: { default: 0 },
+    displayingText: { default: "Displaying" },
+    outOfText: { default: "out of" },
+    totalText: { default: "total rows" },
+    testId: { default: "" }
+  },
+  emits: ["update:search", "onScroll", "onClearSearch", "clickRow"],
+  setup(t, { emit: n }) {
+    const u = t;
+    V((e) => ({
+      "6bca14de": t.zIndexBase
+    }));
+    const h = L(
+      () => u.isLoading || !u.tablesSettings.flatMap((e) => e.rows).length
+    ), r = P(u, "search", n), y = (e) => `cell-${e.id}`, w = (e) => {
+      n("onScroll", e.target.scrollTop);
+    }, k = () => n("onClearSearch"), x = (e, s) => n("clickRow", e, s);
+    return (e, s) => (l(), d("div", {
+      class: "multi-table-container",
+      onScrollPassive: w
+    }, [
+      f("div", {
+        class: z(["table-header-container", { sticky: t.isSticky }])
+      }, [
+        f("div", $, [
+          t.isLoading ? m("", !0) : (l(), c(o(G), {
+            key: 0,
+            count: t.count,
+            "total-count": t.totalCount,
+            "total-text": t.totalText,
+            "displaying-text": t.displayingText,
+            "out-of-text": t.outOfText,
+            "data-testid": t.testId
+          }, null, 8, ["count", "total-count", "total-text", "displaying-text", "out-of-text", "data-testid"]))
+        ]),
+        t.showSearch ? (l(), c(o(M), {
+          key: 0,
+          modelValue: o(r),
+          "onUpdate:modelValue": s[0] || (s[0] = (a) => p(r) ? r.value = a : null),
+          placeholder: t.searchPlaceholder,
+          "test-id": t.testId,
+          onOnClear: k
+        }, null, 8, ["modelValue", "placeholder", "test-id"])) : m("", !0)
+      ], 2),
+      o(h) ? (l(), c(o(S), {
+        key: 1,
+        "is-loading": t.isLoading,
+        columns: t.loadingAndEmptyStatesColumns,
+        rows: [],
+        "test-id": t.testId,
+        "empty-state-variant": t.emptyStateVariant,
+        "empty-state-title": t.emptyStateTitle,
+        "empty-state-subtitle": t.emptyStateSubtitle,
+        "loading-row-count": t.loadingRowCount
+      }, null, 8, ["is-loading", "columns", "test-id", "empty-state-variant", "empty-state-title", "empty-state-subtitle", "loading-row-count"])) : (l(), d("div", A, [
+        (l(!0), d(E, null, g(t.tablesSettings, (a, C) => (l(), d("div", {
+          key: a.testId,
+          class: "table-wrapper"
+        }, [
+          a.rows.length ? (l(), c(o(S), {
+            key: 0,
+            sections: a.sections,
+            columns: a.columns,
+            rows: a.rows,
+            "row-height": a.rowHeight,
+            "is-sticky": t.isSticky,
+            "z-index-base": t.zIndexBase,
+            "test-id": a.testId,
+            onClickRow: (i) => x(i, C)
+          }, D({ _: 2 }, [
+            g(a.columns, (i) => ({
+              name: y(i),
+              fn: N(({
+                cell: b,
+                rowIndex: v,
+                isLoading: B,
+                cellIndex: I,
+                row: R
+              }) => [
+                O(e.$slots, `${y(i)}`, {
+                  cell: b,
+                  isLoading: B,
+                  cellIndex: I,
+                  row: R,
+                  rowIndex: v
+                }, void 0, !0)
+              ])
+            }))
+          ]), 1032, ["sections", "columns", "rows", "row-height", "is-sticky", "z-index-base", "test-id", "onClickRow"])) : m("", !0)
+        ]))), 128))
+      ]))
+    ], 32));
+  }
+});
+export {
+  K as default
+};