@ironsource/shared-ui 2.1.11-test.7 → 2.1.11-test.8

package/src/components/table/v4/DataGrid.vue2.js

@@ -0,0 +1,350 @@
+import { defineComponent as de, useCssVars as oe, unref as t, useSlots as ne, computed as v, openBlock as l, createElementBlock as d, createElementVNode as u, normalizeStyle as T, normalizeClass as f, renderSlot as c, createVNode as h, withCtx as w, createTextVNode as E, toDisplayString as B, isRef as ce, createCommentVNode as r, Fragment as I, renderList as A, createBlock as K, mergeProps as re } from "vue";
+import V from "../../typography/v4/Typography.vue.js";
+import ue from "../../skeleton/v4/SkeletonV4.vue.js";
+import he from "../../emptyState/v4/EmptyStateV4.vue.js";
+import z from "../../checkbox/v4/CheckboxV4.vue.js";
+import { TableTestIdModifiers as S } from "../../../testids/index.js";
+import { tableCommon as ye } from "../common/Table.common.js";
+import fe from "./SortIcon.vue.js";
+import Se from "./HelpIcon.vue.js";
+import ke from "./ExpandRowToggle.vue.js";
+import me from "../../search/v4/SearchV4.vue.js";
+import { useVModel as ge } from "@vueuse/core";
+const ve = ["data-testid"], be = ["data-testid"], $e = ["data-testid"], Re = ["data-testid"], Ce = ["data-testid"], xe = { class: "search-wrapper" }, Te = ["data-testid"], we = ["data-testid"], Ee = {
+  key: 0,
+  class: "checkbox-cell"
+}, Be = {
+  key: 1,
+  class: "expand-toggle-cell"
+}, Ie = ["onClick"], Ae = { class: "table-head-container" }, Ve = ["data-testid"], pe = ["onMouseenter", "onClick"], Le = {
+  key: 0,
+  class: "checkbox-cell"
+}, Me = {
+  key: 1,
+  class: "expand-toggle-cell"
+}, Pe = {
+  key: 2,
+  class: "expanded-row"
+}, He = {
+  key: 3,
+  class: "floating-row"
+}, Fe = { key: 1 }, Ne = {
+  key: 0,
+  class: "table-footer"
+}, Xe = /* @__PURE__ */ de({
+  __name: "DataGrid",
+  props: {
+    title: { default: "" },
+    columns: null,
+    rows: null,
+    sections: { default: null },
+    sort: { default: null },
+    selection: { default: null },
+    getRowId: { type: Function, default: (s, k) => k },
+    getRowKey: { type: Function, default: (s, k) => k },
+    selectedMatcher: { type: Function, default: (s, k) => s === k },
+    isSticky: { type: Boolean, default: !0 },
+    isStickyHeader: { type: Boolean, default: !1 },
+    isLoading: { type: Boolean, default: !1 },
+    emptyStateVariant: { default: null },
+    emptyStateTitle: { default: "No data to display" },
+    emptyStateSubtitle: { default: "" },
+    isInfiniteScroll: { type: Boolean, default: !1 },
+    infiniteScrollThreshold: { default: 100 },
+    rowHeight: { type: [Number, Function], default: 48 },
+    loadingRowCount: { default: 3 },
+    defaultScrollPosition: { default: null },
+    testId: { default: "" },
+    search: { default: null },
+    showSearch: { type: Boolean, default: !1 },
+    searchPlaceholder: { default: "Search" },
+    searchAutoFocus: { type: Boolean, default: !1 },
+    zIndexBase: { default: 100 },
+    rowCustomClassKey: { default: "" },
+    rowDataKey: { default: "" }
+  },
+  emits: ["update:sort", "update:search", "update:selection", "onScroll", "onClearSearch", "saveRow", "loadMore", "selectAll", "selectRow", "clickRow"],
+  setup(s, { expose: k, emit: y }) {
+    const i = s;
+    oe((a) => ({
+      "158e1032": s.zIndexBase,
+      db8e3dca: t(X),
+      a15dcd58: t(P),
+      f7400c48: t(J)
+    }));
+    const b = ne(), U = (a) => i.rowCustomClassKey && i.rows[a] ? i.rows[a][i.rowCustomClassKey] : "", {
+      list: M,
+      containerProps: G,
+      wrapperProps: Y,
+      activeRow: $,
+      gridColumnTemplate: P,
+      toggleSortOrder: Q,
+      columnsStickyPositions: H,
+      hasSearchSlot: W,
+      containerStyle: j,
+      onScroll: F,
+      savingRows: N,
+      hasExpandSlot: R,
+      toggleExpandRow: q,
+      cssRowHeight: J,
+      cssExpandGridCol: X,
+      isRowExpanded: p,
+      hasCheckboxes: O,
+      activeMenuRow: Z,
+      scrollTo: _
+    } = ye(i, y), D = v(() => !!b.footer), g = ge(i, "search", y), ee = v(() => i.selection.length || 0), L = v(() => {
+      const a = i.rows.map((o, e) => i.getRowId(o, e));
+      return !!a.length && a.every((o) => C(o));
+    }), C = (a) => i.selection.findIndex((o) => i.selectedMatcher(a, o)) !== -1, te = (a) => {
+      C(a) ? (x(
+        i.selection.filter(
+          (o) => !i.selectedMatcher(a, o)
+        )
+      ), y("selectRow", !1)) : (x([...i.selection, a]), y("selectRow", !0));
+    }, se = () => {
+      if (L.value)
+        x([]), y("selectAll", !1);
+      else {
+        const a = i.rows.map((o, e) => i.getRowId(o, e)).filter((o) => !C(o));
+        x([...i.selection, ...a]), y("selectAll", !0);
+      }
+    }, x = (a) => {
+      y("update:selection", a);
+    }, ae = (a) => !i.isLoading && $.value === a, le = v(
+      () => i.emptyStateVariant ?? (g.value ? "no-results" : "no-data")
+    ), ie = v(
+      () => i.emptyStateSubtitle ? i.emptyStateSubtitle : g.value ? "Search again with different filters" : void 0
+    );
+    return k({
+      scrollTo: _
+    }), (a, o) => (l(), d("div", {
+      class: "table-container",
+      "data-testid": `${s.testId}-${t(S).CONTAINER}`,
+      onMouseleave: o[3] || (o[3] = (e) => $.value = null)
+    }, [
+      u("table", {
+        ref: t(G).ref,
+        style: T(t(j)),
+        class: f({
+          hasFooter: t(D)
+        }),
+        "data-testid": `${s.testId}-${t(S).TABLE}`,
+        onScrollPassive: o[2] || (o[2] = //@ts-ignore
+        (...e) => t(F) && t(F)(...e))
+      }, [
+        s.title || t(b).title || t(W) || t(b)["table-header-actions"] ? (l(), d("div", {
+          key: 0,
+          class: f(["table-header", { isStickyHeader: s.isStickyHeader }]),
+          "data-testid": `${s.testId}-${t(S).HEADER}`
+        }, [
+          u("div", {
+            class: "table-title",
+            "data-testid": `${s.testId}-${t(S).TITLE}`
+          }, [
+            c(a.$slots, "title", {}, () => [
+              h(t(V), { variant: "h3" }, {
+                default: w(() => [
+                  E(B(s.title), 1)
+                ]),
+                _: 1
+              })
+            ])
+          ], 8, Re),
+          u("div", {
+            class: "table-header-right",
+            "data-testid": `${s.testId}-${t(S).HEADER_RIGHT}`
+          }, [
+            s.showSearch ? c(a.$slots, "search", { key: 0 }, () => [
+              u("div", xe, [
+                h(t(me), {
+                  modelValue: t(g),
+                  "onUpdate:modelValue": o[0] || (o[0] = (e) => ce(g) ? g.value = e : null),
+                  placeholder: s.searchPlaceholder,
+                  "auto-focus": s.searchAutoFocus,
+                  "test-id": s.testId,
+                  onOnClear: o[1] || (o[1] = (e) => y("onClearSearch"))
+                }, null, 8, ["modelValue", "placeholder", "auto-focus", "test-id"])
+              ])
+            ]) : r("", !0)
+          ], 8, Ce),
+          t(b)["table-header-actions"] ? (l(), d("div", {
+            key: 0,
+            class: "table-header-actions",
+            "data-testid": `${s.testId}-${t(S).ACTIONS}`
+          }, [
+            c(a.$slots, "table-header-actions")
+          ], 8, Te)) : r("", !0)
+        ], 10, $e)) : r("", !0),
+        u("thead", {
+          class: f({ sticky: s.isSticky, isStickyHeader: s.isStickyHeader })
+        }, [
+          u("div", {
+            class: "sections",
+            "data-testid": `${s.testId}-${t(S).SECTIONS}`
+          }, [
+            (l(!0), d(I, null, A(s.sections, (e) => (l(), d("div", {
+              key: e.id,
+              class: f(["section-container", { sticky: e.isSticky }])
+            }, [
+              c(a.$slots, `section-${e.id}`, {}, () => [
+                u("div", {
+                  style: T({ width: e.width + "px" }),
+                  class: f({ section: !0 })
+                }, [
+                  h(t(V), { variant: "body2" }, {
+                    default: w(() => [
+                      E(B(e.title), 1)
+                    ]),
+                    _: 2
+                  }, 1024)
+                ], 4)
+              ])
+            ], 2))), 128))
+          ], 8, we),
+          u("tr", null, [
+            t(O) ? (l(), d("th", Ee, [
+              c(a.$slots, "select-all-checkbox", {}, () => [
+                h(t(z), {
+                  disabled: s.isLoading,
+                  "is-checked": t(L),
+                  "is-indeterminate": !t(L) && t(ee) > 0,
+                  "onUpdate:isChecked": se
+                }, null, 8, ["disabled", "is-checked", "is-indeterminate"])
+              ])
+            ])) : r("", !0),
+            t(R) ? (l(), d("th", Be)) : r("", !0),
+            (l(!0), d(I, null, A(s.columns, (e) => (l(), d("th", {
+              key: e.id,
+              class: f({
+                sticky: e.isSticky,
+                isStickyRight: e.isStickyRight,
+                bordered: e.isBordered,
+                isTextRight: e.isTextRight,
+                isSortable: e.isSortable,
+                [`column-${e.id}`]: !0
+              }),
+              style: T(e.isSticky ? t(H)[e.id] : null),
+              onClick: (m) => e.isSortable ? t(Q)(e) : null
+            }, [
+              u("div", Ae, [
+                c(a.$slots, `header-${e.id}`, { column: e }, () => [
+                  h(t(V), { variant: "tableLabel" }, {
+                    default: w(() => [
+                      E(B(e.title), 1)
+                    ]),
+                    _: 2
+                  }, 1024)
+                ]),
+                e.helpText ? (l(), K(Se, {
+                  key: 0,
+                  "hover-help-text": e.helpText,
+                  "hover-help-text-placement": e.helpTextPlacement
+                }, null, 8, ["hover-help-text", "hover-help-text-placement"])) : r("", !0),
+                e.isSortable && e.id === s.sort?.sortBy ? (l(), K(fe, {
+                  key: 1,
+                  "sort-order": s.sort.sortOrder
+                }, null, 8, ["sort-order"])) : r("", !0)
+              ])
+            ], 14, Ie))), 128))
+          ])
+        ], 2),
+        u("tbody", null, [
+          t(M).length > 0 ? (l(), d("div", re({
+            key: 0,
+            class: "table-body-wrapper",
+            "data-testid": `${s.testId}-${t(S).BODY_WRAPPER}`
+          }, t(Y)), [
+            (l(!0), d(I, null, A(t(M), (e) => (l(), d("tr", {
+              key: s.getRowKey(e.data, e.index),
+              class: f(["table-row", {
+                loading: s.isLoading || s.isLoading && !e.data || t(N).includes(e.index),
+                active: t($) === e.index,
+                activeMenu: t(Z) === e.index,
+                expanded: t(R) && t(p)(e.index),
+                [U(e.index)]: !0
+              }]),
+              onMouseenter: (m) => $.value = e.index,
+              onClick: (m) => y("clickRow", e.index)
+            }, [
+              t(O) ? (l(), d("td", Le, [
+                h(t(z), {
+                  "is-checked": C(s.getRowId(e.data, e.index)),
+                  "onUpdate:isChecked": (m) => te(s.getRowId(e.data, e.index))
+                }, null, 8, ["is-checked", "onUpdate:isChecked"])
+              ])) : r("", !0),
+              t(R) ? (l(), d("td", Me, [
+                h(ke, {
+                  expanded: t(p)(e.index),
+                  onClick: (m) => t(q)(e.index, m)
+                }, null, 8, ["expanded", "onClick"])
+              ])) : r("", !0),
+              (l(!0), d(I, null, A(s.columns, (m, n) => (l(), d("td", {
+                key: n,
+                class: f({
+                  sticky: s.columns[n].isSticky,
+                  isStickyRight: s.columns[n].isStickyRight,
+                  bordered: s.columns[n].isBordered,
+                  isTextRight: s.columns[n].isTextRight,
+                  [`column-${s.columns[n].id}`]: !0
+                }),
+                style: T(
+                  s.columns[n].isSticky ? t(H)[s.columns[n].id] : null
+                )
+              }, [
+                !s.isLoading || s.isLoading && e.data[n] ? (l(), d("div", {
+                  key: 0,
+                  class: f(["table-cell", { last: n === e.data.length - 1 }])
+                }, [
+                  c(a.$slots, `cell-${s.columns[n].id}`, {
+                    cell: e.data[n],
+                    isLoading: t(N).includes(e.index),
+                    cellIndex: n,
+                    row: e,
+                    rowIndex: e.index
+                  }, () => [
+                    h(t(V), { variant: "body1" }, {
+                      default: w(() => [
+                        E(B(e.data[n]), 1)
+                      ]),
+                      _: 2
+                    }, 1024)
+                  ])
+                ], 2)) : c(a.$slots, "loader", { key: 1 }, () => [
+                  h(t(ue), { round: "" })
+                ])
+              ], 6))), 128)),
+              t(R) && t(p)(e.index) ? (l(), d("div", Pe, [
+                c(a.$slots, "expanded", {
+                  row: e,
+                  gridColumnTemplate: t(P)
+                })
+              ])) : r("", !0),
+              ae(e.index) ? (l(), d("div", He, [
+                c(a.$slots, "floating-row", {
+                  row: e,
+                  rowIndex: e.index
+                })
+              ])) : r("", !0)
+            ], 42, pe))), 128))
+          ], 16, Ve)) : (l(), d("div", Fe, [
+            c(a.$slots, "empty-state", {}, () => [
+              h(t(he), {
+                class: "empty-state",
+                title: s.emptyStateTitle,
+                subtitle: t(ie),
+                variant: t(le),
+                "test-id": `${s.testId}-${t(S).EMPTY_STATE}`
+              }, null, 8, ["title", "subtitle", "variant", "test-id"])
+            ])
+          ]))
+        ])
+      ], 46, be),
+      t(D) ? (l(), d("div", Ne, [
+        c(a.$slots, "footer")
+      ])) : r("", !0)
+    ], 40, ve));
+  }
+});
+export {
+  Xe as default
+};

package/src/components/table/v4/DataGridMenu.vue.js

@@ -0,0 +1,7 @@
+import e from "./DataGridMenu.vue2.js";
+/* empty css                   */import o from "../../../../_virtual/_plugin-vue_export-helper.js";
+console.log('scoped// import "../../../DataGridMenu.vue_vue_type_style_index_0_scoped_a6e4672f_lang.css"; //*');
+const s = /* @__PURE__ */ o(e, [["__scopeId", "data-v-a6e4672f"]]);
+export {
+  s as default
+};

package/src/components/table/v4/DataGridMenu.vue2.js

@@ -0,0 +1,66 @@
+import { defineComponent as u, onBeforeUnmount as f, openBlock as x, createBlock as w, unref as o, withCtx as r, createVNode as c, createSlots as I, createTextVNode as v, toDisplayString as M } from "vue";
+import g from "../../dropdown/v4/DropdownV4.vue.js";
+import "../../dropdown/v4/DefaultDropdownTrigger.vue.js";
+import "../../dropdown/v4/IconButtonDropdownTrigger.vue.js";
+import "../../dropdown/v4/ChipDropdownTrigger.vue.js";
+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 C from "../../dropdown/v4/OptionV4.vue.js";
+import "../../dropdown/v4/ConditionalDroprown.vue.js";
+import k from "../../icon/v4/IconV4.vue.js";
+import "../../icon/v4/IconFlag.vue.js";
+import { useTableContext as y } from "../common/TableContext.js";
+const h = /* @__PURE__ */ u({
+  __name: "DataGridMenu",
+  props: {
+    menuItems: { default: () => [] },
+    rowIndex: { default: null },
+    placement: { default: "left-start" }
+  },
+  emits: ["selected"],
+  setup(t, { emit: d }) {
+    const n = t, i = y("DataGridMenu"), a = (s) => s.text, p = () => {
+      n.rowIndex && i.setActiveMenuRow(n.rowIndex);
+    }, m = () => {
+      n.rowIndex && i.setActiveMenuRow(null);
+    };
+    return f(m), (s, l) => (x(), w(o(g), {
+      class: "data-grid-menu",
+      options: t.menuItems,
+      "display-value": a,
+      "predefined-trigger": "icon-button",
+      placement: t.placement,
+      skidding: -4,
+      "onUpdate:selected": l[0] || (l[0] = (e) => d("selected", e)),
+      onOpened: p,
+      onClosed: m
+    }, {
+      default: r(({ option: e }) => [
+        c(o(C), { option: e }, I({
+          default: r(() => [
+            v(" " + M(a(e)), 1)
+          ]),
+          _: 2
+        }, [
+          e.icon ? {
+            name: "icon-start",
+            fn: r(() => [
+              c(o(k), {
+                class: "menu-icon",
+                name: e.icon,
+                size: "20px"
+              }, null, 8, ["name"])
+            ]),
+            key: "0"
+          } : void 0
+        ]), 1032, ["option"])
+      ]),
+      _: 1
+    }, 8, ["options", "placement"]));
+  }
+});
+export {
+  h as default
+};

package/src/components/table/v4/DataGridRowsCounter.vue.js

@@ -0,0 +1,7 @@
+import o from "./DataGridRowsCounter.vue2.js";
+/* empty css                          */import e from "../../../../_virtual/_plugin-vue_export-helper.js";
+console.log('scoped// import "../../../DataGridRowsCounter.vue_vue_type_style_index_0_scoped_ef699ec5_lang.css"; //*');
+const r = /* @__PURE__ */ e(o, [["__scopeId", "data-v-ef699ec5"]]);
+export {
+  r as default
+};

package/src/components/table/v4/DataGridRowsCounter.vue2.js

@@ -0,0 +1,53 @@
+import { defineComponent as l, openBlock as u, createElementBlock as f, unref as e, createVNode as d, withCtx as i, createTextVNode as a, toDisplayString as o } from "vue";
+import s from "../../typography/v4/Typography.vue.js";
+import { RowsCounterTestIdModifiers as n } from "../../../testids/index.js";
+import { nFormatter as r } from "../../../utils/formatNumbers.js";
+const c = ["data-testid"], I = /* @__PURE__ */ l({
+  __name: "DataGridRowsCounter",
+  props: {
+    count: { default: 0 },
+    totalCount: { default: 0 },
+    displayingText: { default: "Displaying" },
+    outOfText: { default: "out of" },
+    totalText: { default: "total rows" },
+    testId: { default: "" }
+  },
+  setup(t) {
+    return (m, T) => (u(), f("div", {
+      class: "data-grid-rows-counter",
+      "data-testid": `${t.testId}-${e(n).CONTAINER}`
+    }, [
+      d(e(s), { variant: "body1" }, {
+        default: i(() => [
+          a(o(t.displayingText) + " ", 1),
+          d(e(s), {
+            class: "text-strong",
+            variant: "subtitle1",
+            "data-testid": `${t.testId}-${e(n).COUNT}`
+          }, {
+            default: i(() => [
+              a(o(e(r)(t.count)), 1)
+            ]),
+            _: 1
+          }, 8, ["data-testid"]),
+          a(" " + o(t.outOfText) + " ", 1),
+          d(e(s), {
+            class: "text-strong",
+            variant: "subtitle1",
+            "data-testid": `${t.testId}-${e(n).TOTAL}`
+          }, {
+            default: i(() => [
+              a(o(e(r)(t.totalCount)), 1)
+            ]),
+            _: 1
+          }, 8, ["data-testid"]),
+          a(" " + o(t.totalText), 1)
+        ]),
+        _: 1
+      })
+    ], 8, c));
+  }
+});
+export {
+  I as default
+};

package/src/components/table/v4/ExpandRowToggle.vue.js

@@ -0,0 +1,7 @@
+import o from "./ExpandRowToggle.vue2.js";
+/* empty css                      */import e from "../../../../_virtual/_plugin-vue_export-helper.js";
+console.log('scoped// import "../../../ExpandRowToggle.vue_vue_type_style_index_0_scoped_b053baa6_lang.css"; //*');
+const s = /* @__PURE__ */ e(o, [["__scopeId", "data-v-b053baa6"]]);
+export {
+  s as default
+};

package/src/components/table/v4/ExpandRowToggle.vue2.js

@@ -0,0 +1,26 @@
+import { defineComponent as r, openBlock as a, createElementBlock as c, createVNode as p, unref as l } from "vue";
+import "../../button/v4/ButtonV4.vue.js";
+import i from "../../button/v4/IconButtonV4.vue.js";
+import "../../button/v4/ButtonGroup.vue.js";
+import "../../button/v4/ToggleButtonGroupAB.vue.js";
+const g = /* @__PURE__ */ r({
+  __name: "ExpandRowToggle",
+  props: {
+    expanded: { type: Boolean, default: !1 }
+  },
+  emits: ["click"],
+  setup(o, { emit: n }) {
+    return (m, e) => (a(), c("div", {
+      class: "expand-row-toggle",
+      onClick: e[0] || (e[0] = (t) => n("click", t))
+    }, [
+      p(l(i), {
+        class: "expand-button",
+        "icon-name": o.expanded ? "caret-down" : "caret-right"
+      }, null, 8, ["icon-name"])
+    ]));
+  }
+});
+export {
+  g as default
+};

package/src/components/table/v4/HelpIcon.vue.js

@@ -0,0 +1,7 @@
+import e from "./HelpIcon.vue2.js";
+/* empty css               */import o from "../../../../_virtual/_plugin-vue_export-helper.js";
+console.log('scoped// import "../../../HelpIcon.vue_vue_type_style_index_0_scoped_06fce2e3_lang.css"; //*');
+const s = /* @__PURE__ */ o(e, [["__scopeId", "data-v-06fce2e3"]]);
+export {
+  s as default
+};

package/src/components/table/v4/HelpIcon.vue2.js

@@ -0,0 +1,33 @@
+import { defineComponent as o, openBlock as l, createBlock as n, unref as t, withCtx as r, createVNode as a } from "vue";
+import c from "../../icon/v4/IconV4.vue.js";
+import "../../icon/v4/IconFlag.vue.js";
+import p from "../../tooltip/v4/TooltipV4.vue.js";
+const x = /* @__PURE__ */ o({
+  __name: "HelpIcon",
+  props: {
+    hoverHelpText: { default: "" },
+    hoverHelpTextPlacement: { default: "top" },
+    testId: { default: "" }
+  },
+  setup(e) {
+    return (i, m) => (l(), n(t(p), {
+      class: "table-help-icon",
+      triggers: ["hover"],
+      text: e.hoverHelpText,
+      placement: e.hoverHelpTextPlacement,
+      "test-id": e.testId
+    }, {
+      default: r(() => [
+        a(t(c), {
+          class: "info-icon",
+          name: "question",
+          size: "16px"
+        })
+      ]),
+      _: 1
+    }, 8, ["text", "placement", "test-id"]));
+  }
+});
+export {
+  x as default
+};

package/src/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";
+console.log('scoped// import "../../../MultipleDataGrid.vue_vue_type_style_index_0_scoped_020a9896_lang.css"; //*');
+const p = /* @__PURE__ */ t(o, [["__scopeId", "data-v-020a9896"]]);
+export {
+  p as default
+};