@ironsource/shared-ui 2.0.0-rc.2 → 2.0.0-test.1

package/components/shared/FieldHelpText.vue2.js

@@ -0,0 +1,47 @@
+import { defineComponent as r, computed as c, openBlock as i, createElementBlock as s, normalizeClass as l, unref as e, createBlock as m, createCommentVNode as f, createVNode as u, withCtx as p, createTextVNode as h, toDisplayString as I } from "vue";
+import v from "../icon/Icon.vue.js";
+import x from "../typography/v4/Typography.vue.js";
+import { FieldHelpTextTestIdModifiers as a } from "../../testids/index.js";
+const T = ["data-testid"], k = /* @__PURE__ */ r({
+  __name: "FieldHelpText",
+  props: {
+    text: { default: "" },
+    variant: { default: null },
+    testId: { default: "" },
+    showIcon: { type: Boolean, default: !0 }
+  },
+  setup(t) {
+    const n = t, d = c(() => {
+      const o = {
+        warning: "warning-v4",
+        error: "warning-octagon",
+        success: "check-circle"
+      };
+      return n.variant ? o[n.variant] : "info-v4";
+    });
+    return (o, N) => (i(), s("div", {
+      class: l(["field-help", [`field-help--${t.variant}`]]),
+      "data-testid": `${t.testId}-${e(a).CONTAINER}`
+    }, [
+      t.showIcon ? (i(), m(e(v), {
+        key: 0,
+        class: "help-icon",
+        name: e(d),
+        "font-size": "sm",
+        "data-testid": `${t.testId}-${e(a).ICON}`
+      }, null, 8, ["name", "data-testid"])) : f("", !0),
+      u(e(x), {
+        variant: "caption",
+        "data-testid": `${t.testId}-${e(a).TEXT}`
+      }, {
+        default: p(() => [
+          h(I(t.text), 1)
+        ]),
+        _: 1
+      }, 8, ["data-testid"])
+    ], 10, T));
+  }
+});
+export {
+  k as default
+};

package/components/shared/FieldLabel.vue.js

@@ -0,0 +1,6 @@
+import e from "./FieldLabel.vue2.js";
+/* empty css                 */import o from "../../_virtual/_plugin-vue_export-helper.js";
+const d = /* @__PURE__ */ o(e, [["__scopeId", "data-v-c4deed7e"]]);
+export {
+  d as default
+};

package/components/shared/FieldLabel.vue2.js

@@ -0,0 +1,64 @@
+import { defineComponent as m, openBlock as d, createElementBlock as f, normalizeClass as c, unref as t, createVNode as i, withCtx as l, createTextVNode as o, toDisplayString as u, createBlock as s, createCommentVNode as n } from "vue";
+import T from "../icon/Icon.vue.js";
+import b from "../tooltip/Tooltip.vue.js";
+/* empty css                       */import r from "../typography/v4/Typography.vue.js";
+import { FieldLabelTestIdModifiers as a } from "../../testids/index.js";
+const h = ["data-testid"], B = /* @__PURE__ */ m({
+  __name: "FieldLabel",
+  props: {
+    label: { default: "" },
+    mandatory: { type: Boolean, default: !1 },
+    disabled: { type: Boolean, default: !1 },
+    hoverHelpText: { default: "" },
+    hoverHelpTextPlacement: { default: "top" },
+    testId: { default: "" }
+  },
+  setup(e) {
+    return (x, y) => (d(), f("div", {
+      class: c(["field-label", { "field-label--disabled": e.disabled }]),
+      "data-testid": `${e.testId}-${t(a).CONTAINER}`
+    }, [
+      i(t(r), {
+        class: "label",
+        variant: "inputLabel",
+        "data-testid": `${e.testId}-${t(a).TEXT}`
+      }, {
+        default: l(() => [
+          o(u(e.label), 1)
+        ]),
+        _: 1
+      }, 8, ["data-testid"]),
+      e.mandatory ? (d(), s(t(r), {
+        key: 0,
+        variant: "h3",
+        class: "mandatory",
+        "data-testid": `${e.testId}-${t(a).MANDATORY}`
+      }, {
+        default: l(() => [
+          o("*")
+        ]),
+        _: 1
+      }, 8, ["data-testid"])) : n("", !0),
+      e.hoverHelpText ? (d(), s(t(b), {
+        key: 1,
+        triggers: ["hover"],
+        text: e.hoverHelpText,
+        placement: e.hoverHelpTextPlacement,
+        "data-testid": `${e.testId}-${t(a).TOOLTIP}`,
+        "test-id": e.testId
+      }, {
+        default: l(() => [
+          i(t(T), {
+            class: "info-icon",
+            name: "question",
+            "font-size": "sm"
+          })
+        ]),
+        _: 1
+      }, 8, ["text", "placement", "data-testid", "test-id"])) : n("", !0)
+    ], 10, h));
+  }
+});
+export {
+  B as default
+};

package/components/skeleton/Skeleton.vue.js

@@ -0,0 +1,6 @@
+import o from "./Skeleton.vue2.js";
+/* empty css               */import t from "../../_virtual/_plugin-vue_export-helper.js";
+const m = /* @__PURE__ */ t(o, [["__scopeId", "data-v-9837f0ce"]]);
+export {
+  m as default
+};

package/components/skeleton/index.js

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

package/components/snackbar/Snackbar.vue.js

@@ -0,0 +1,6 @@
+import o from "./Snackbar.vue2.js";
+/* empty css               */import r from "../../_virtual/_plugin-vue_export-helper.js";
+const m = /* @__PURE__ */ r(o, [["__scopeId", "data-v-dce34ab1"]]);
+export {
+  m as default
+};

package/components/snackbar/Snackbar.vue2.js

@@ -0,0 +1,149 @@
+import { defineComponent as H, ref as N, computed as l, onMounted as V, openBlock as s, createBlock as r, Transition as $, withCtx as a, withDirectives as z, createElementVNode as c, normalizeClass as T, unref as n, normalizeStyle as B, createElementBlock as M, createVNode as f, resolveDynamicComponent as U, createCommentVNode as y, renderSlot as W, createTextVNode as A, toDisplayString as F, vShow as w, withModifiers as K } from "vue";
+import { useEventListener as P, useTimeoutFn as j } from "@vueuse/core";
+import x from "../icon/Icon.vue.js";
+import L from "../icon/icons/Close.vue.js";
+import q from "../icon/icons/Check.vue.js";
+/* empty css                          */import S from "../typography/Text.vue.js";
+/* empty css                        */import G from "../button/v3/IconButton.vue.js";
+/* empty css                                   */import "floating-vue";
+/* empty css                       *//* empty css                              */const J = ["id"], O = { class: "container" }, Q = { class: "texts" }, R = ["innerHTML"], ue = /* @__PURE__ */ H({
+  __name: "Snackbar",
+  props: {
+    customClass: null,
+    dangerouslyUseHTMLString: { type: Boolean },
+    duration: { default: 3e3 },
+    icon: null,
+    id: null,
+    message: null,
+    offset: null,
+    onClick: null,
+    onClose: null,
+    type: { default: null },
+    position: { default: "top-right" },
+    showClose: { type: Boolean, default: !0 },
+    title: { default: "" },
+    zIndex: { default: 0 }
+  },
+  emits: ["destroy"],
+  setup(e) {
+    const t = e, v = {
+      success: q,
+      error: L
+    }, i = N(!1);
+    let p;
+    const C = l(() => {
+      const o = t.type;
+      return o && v[t.type] ? o : "";
+    }), k = l(() => v[t.type] || t.icon || ""), b = l(
+      () => t.position.endsWith("right") ? "right" : "left"
+    ), I = l(
+      () => t.position.startsWith("top") ? "top" : "bottom"
+    ), D = l(() => ({
+      [I.value]: `${t.offset}px`,
+      zIndex: t.zIndex
+    }));
+    function m() {
+      t.duration > 0 && ({ stop: p } = j(() => {
+        i.value && d();
+      }, t.duration));
+    }
+    function g() {
+      p?.();
+    }
+    function d() {
+      i.value = !1;
+    }
+    function E({ code: o }) {
+      o === "Delete" || o === "Backspace" ? g() : o === "Escape" ? i.value && d() : m();
+    }
+    return V(() => {
+      m(), i.value = !0;
+    }), P(document, "keydown", E), (o, u) => (s(), r($, {
+      name: "snackbar",
+      onBeforeLeave: e.onClose,
+      onAfterLeave: u[1] || (u[1] = (h) => o.$emit("destroy"))
+    }, {
+      default: a(() => [
+        z(c("div", {
+          id: e.id,
+          class: T(["snackbar", [e.customClass, n(b)]]),
+          style: B(n(D)),
+          role: "alert",
+          onMouseenter: g,
+          onMouseleave: m,
+          onClick: u[0] || (u[0] = //@ts-ignore
+          (...h) => e.onClick && e.onClick(...h))
+        }, [
+          n(k) ? (s(), M("div", {
+            key: 0,
+            class: T(["start-icon-container", [n(C)]])
+          }, [
+            f(n(x), {
+              "font-size": n(C) ? "sm" : "lg"
+            }, {
+              default: a(() => [
+                (s(), r(U(n(k))))
+              ]),
+              _: 1
+            }, 8, ["font-size"])
+          ], 2)) : y("", !0),
+          c("div", O, [
+            c("div", Q, [
+              e.title ? (s(), r(S, {
+                key: 0,
+                size: "md",
+                strong: "",
+                class: "title"
+              })) : y("", !0),
+              z(c("div", {
+                class: "message",
+                style: B(e.title ? void 0 : { margin: 0 })
+              }, [
+                W(o.$slots, "default", {}, () => [
+                  e.dangerouslyUseHTMLString ? (s(), M("div", {
+                    key: 1,
+                    innerHTML: e.message
+                  }, null, 8, R)) : (s(), r(S, {
+                    key: 0,
+                    size: "sm"
+                  }, {
+                    default: a(() => [
+                      A(F(e.message), 1)
+                    ]),
+                    _: 1
+                  }))
+                ], !0)
+              ], 4), [
+                [w, e.message]
+              ])
+            ]),
+            e.showClose ? (s(), r(n(G), {
+              key: 0,
+              theme: "third",
+              size: "sm",
+              class: "snackbar-close-button",
+              variant: "colorized",
+              onClick: K(d, ["stop"])
+            }, {
+              default: a(() => [
+                f(n(x), null, {
+                  default: a(() => [
+                    f(L)
+                  ]),
+                  _: 1
+                })
+              ]),
+              _: 1
+            }, 8, ["onClick"])) : y("", !0)
+          ])
+        ], 46, J), [
+          [w, i.value]
+        ])
+      ]),
+      _: 3
+    }, 8, ["onBeforeLeave"]));
+  }
+});
+export {
+  ue as default
+};

package/components/snackbar/index.js

@@ -0,0 +1,6 @@
+import o from "./notify.js";
+const a = o;
+export {
+  a as Snackbar,
+  a as default
+};

package/components/snackbar/notify.js

@@ -0,0 +1,84 @@
+import { isVNode as x, createVNode as y, render as v } from "vue";
+import b from "./Snackbar.vue.js";
+import { snackbarTypes as I } from "./snackbar.types.js";
+const p = {
+  "top-left": [],
+  "top-right": [],
+  "bottom-left": [],
+  "bottom-right": []
+}, g = 16;
+let C = 1;
+const N = 2e3, a = function(e = {}, t = null) {
+  (typeof e == "string" || x(e)) && (e = { message: e });
+  const o = e.position || "top-right";
+  let n = e.zIndex || N, s = p[o].reduce(
+    (m, { vm: h }) => m + (h.el?.offsetHeight || 0) + g,
+    e.offset || 0
+  );
+  s += g;
+  const i = () => n++, d = `notification_${C++}`, u = e.onClose, l = {
+    ...e,
+    zIndex: i(),
+    offset: s,
+    id: d,
+    onClose: () => {
+      A(d, o, u);
+    }
+  }, c = document.body, f = document.createElement("div"), r = y(
+    b,
+    l,
+    x(l.message) ? {
+      default: () => l.message
+    } : null
+  );
+  return r.appContext = t ?? a._context, r.props.onDestroy = () => {
+    v(null, f);
+  }, v(r, f), p[o].push({ vm: r }), c.appendChild(f?.firstElementChild), {
+    // instead of calling the onClose function directly, setting this value so that we can have the full lifecycle
+    // for out component, so that all closing steps will not be skipped.
+    close: () => {
+      const m = r.component?.proxy;
+      m && (m.visible = !1);
+    }
+  };
+};
+function A(e, t, o) {
+  const n = p[t], s = n.findIndex(
+    ({ vm: c }) => c.component?.props.id === e
+  );
+  if (s === -1)
+    return;
+  const { vm: i } = n[s];
+  if (!i)
+    return;
+  o?.(i);
+  const d = i.el?.offsetHeight, u = t.split("-")[0];
+  n.splice(s, 1);
+  const l = n.length;
+  for (let c = s; c < l; c++) {
+    const { el: f, component: r } = n[c].vm;
+    r.props.offset = Number.parseInt(f.style[u], 10) - d - g;
+  }
+}
+I.forEach((e) => {
+  a[e] = (t = {}) => ((typeof t == "string" || x(t)) && (t = {
+    message: t
+  }), a({
+    ...t,
+    type: e
+  }));
+});
+function E() {
+  for (const e of Object.values(p))
+    e.forEach(({ vm: t }) => {
+      const o = t.component?.proxy;
+      o && (o.visible = !1);
+    });
+}
+a.closeAll = E;
+a._context = null;
+export {
+  A as close,
+  E as closeAll,
+  a as default
+};

package/components/switch/v3/Switch.vue.js

@@ -0,0 +1,6 @@
+import o from "./Switch.vue2.js";
+/* empty css             */import t from "../../../_virtual/_plugin-vue_export-helper.js";
+const m = /* @__PURE__ */ t(o, [["__scopeId", "data-v-9c008fc4"]]);
+export {
+  m as default
+};

package/components/switch/v3/Switch.vue2.js

@@ -0,0 +1,69 @@
+import { defineComponent as b, ref as d, computed as k, onMounted as z, openBlock as r, createElementBlock as c, normalizeClass as u, unref as l, createElementVNode as V, normalizeStyle as g, Fragment as T, renderList as C, renderSlot as I, createVNode as y, withCtx as S, createTextVNode as E, toDisplayString as N } from "vue";
+import { useVModel as R } from "@vueuse/core";
+import B from "../../typography/Text.vue.js";
+import { SwitchTestIdModifiers as f } from "../../../testids/index.js";
+const M = ["data-testid"], P = ["aria-label", "data-testid", "onClick"], D = /* @__PURE__ */ b({
+  __name: "Switch",
+  props: {
+    options: null,
+    modelValue: null,
+    size: { default: "lg" },
+    testId: { default: "" }
+  },
+  emits: ["update:modelValue"],
+  setup(e, { emit: v }) {
+    const n = e, w = d(null), p = R(n, "modelValue", v), i = d([]), x = { optionsRefs: i }, t = d(), m = k(() => ({
+      left: i.value[t.value]?.offsetLeft,
+      width: i.value[t.value]?.offsetWidth
+    }));
+    z(() => {
+      t.value = n.options.findIndex(
+        (s) => s === n.modelValue
+      );
+    });
+    const $ = (s, h) => {
+      t.value = h, p.value = s;
+    };
+    return (s, h) => (r(), c("div", {
+      class: u(["switch", { "switch--lg": e.size === "lg", "switch--sm": e.size === "sm" }]),
+      "data-testid": `${e.testId}-${l(f).WRAPPER}`
+    }, [
+      V("span", {
+        ref_key: "box",
+        ref: w,
+        class: u(["box", { "box--lg": e.size === "lg", "box--sm": e.size === "sm" }]),
+        style: g({
+          transform: `translateX(${l(m)?.left}px)`,
+          width: l(m)?.width + "px"
+        })
+      }, null, 6),
+      (r(!0), c(T, null, C(e.options, (o, a) => (r(), c("button", {
+        ref_for: !0,
+        ref: x.optionsRefs,
+        key: a,
+        "aria-label": o,
+        class: u([{ "option--selected": t.value === a }, "option"]),
+        "data-testid": `${e.testId}-${l(f).BUTTON}`,
+        onClick: (L) => $(o, a)
+      }, [
+        I(s.$slots, "default", {
+          option: o,
+          selected: t.value === a
+        }, () => [
+          y(B, {
+            size: "caption",
+            "data-testid": `${e.testId}-${l(f).TEXT}`
+          }, {
+            default: S(() => [
+              E(N(o), 1)
+            ]),
+            _: 2
+          }, 1032, ["data-testid"])
+        ], !0)
+      ], 10, P))), 128))
+    ], 10, M));
+  }
+});
+export {
+  D as default
+};

package/components/switch/v3/index.js

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

package/components/switch/v4/SwitchV4.vue.js

@@ -0,0 +1,6 @@
+import o from "./SwitchV4.vue2.js";
+/* empty css               */import t from "../../../_virtual/_plugin-vue_export-helper.js";
+const m = /* @__PURE__ */ t(o, [["__scopeId", "data-v-afb0d2d7"]]);
+export {
+  m as default
+};

package/components/switch/v4/SwitchV4.vue2.js

@@ -0,0 +1,69 @@
+import { defineComponent as $, ref as d, computed as b, onMounted as k, openBlock as r, createElementBlock as c, normalizeClass as u, unref as l, createElementVNode as z, normalizeStyle as g, Fragment as T, renderList as C, renderSlot as I, createVNode as y, withCtx as S, createTextVNode as E, toDisplayString as N } from "vue";
+import { useVModel as R } from "@vueuse/core";
+import B from "../../typography/Text.vue.js";
+import { SwitchTestIdModifiers as f } from "../../../testids/index.js";
+const M = ["data-testid"], P = ["aria-label", "data-testid", "onClick"], D = /* @__PURE__ */ $({
+  __name: "SwitchV4",
+  props: {
+    options: null,
+    modelValue: null,
+    size: { default: "lg" },
+    testId: { default: "" }
+  },
+  emits: ["update:modelValue"],
+  setup(e, { emit: v }) {
+    const n = e, w = d(null), p = R(n, "modelValue", v), i = d([]), x = { optionsRefs: i }, t = d(), m = b(() => ({
+      left: i.value[t.value]?.offsetLeft,
+      width: i.value[t.value]?.offsetWidth
+    }));
+    k(() => {
+      t.value = n.options.findIndex(
+        (s) => s === n.modelValue
+      );
+    });
+    const V = (s, h) => {
+      t.value = h, p.value = s;
+    };
+    return (s, h) => (r(), c("div", {
+      class: u(["switch", { "switch--lg": e.size === "lg", "switch--sm": e.size === "sm" }]),
+      "data-testid": `${e.testId}-${l(f).WRAPPER}`
+    }, [
+      z("span", {
+        ref_key: "box",
+        ref: w,
+        class: u(["box", { "box--lg": e.size === "lg", "box--sm": e.size === "sm" }]),
+        style: g({
+          transform: `translateX(${l(m)?.left}px)`,
+          width: l(m)?.width + "px"
+        })
+      }, null, 6),
+      (r(!0), c(T, null, C(e.options, (o, a) => (r(), c("button", {
+        ref_for: !0,
+        ref: x.optionsRefs,
+        key: a,
+        "aria-label": o,
+        class: u([{ "option--selected": t.value === a }, "option"]),
+        "data-testid": `${e.testId}-${l(f).BUTTON}`,
+        onClick: (L) => V(o, a)
+      }, [
+        I(s.$slots, "default", {
+          option: o,
+          selected: t.value === a
+        }, () => [
+          y(B, {
+            size: "caption",
+            "data-testid": `${e.testId}-${l(f).TEXT}`
+          }, {
+            default: S(() => [
+              E(N(o), 1)
+            ]),
+            _: 2
+          }, 1032, ["data-testid"])
+        ], !0)
+      ], 10, P))), 128))
+    ], 10, M));
+  }
+});
+export {
+  D as default
+};

package/components/switch/v4/index.js

@@ -0,0 +1,6 @@
+import t from "./SwitchV4.vue.js";
+const c = () => [t];
+export {
+  t as Switch,
+  c as SwitchTypes
+};

package/components/table/SortOrderIcon.vue.js

@@ -0,0 +1,21 @@
+import { openBlock as o, createElementBlock as t, pushScopeId as c, popScopeId as r, createElementVNode as n } from "vue";
+/* empty css                    */import d from "../../_virtual/_plugin-vue_export-helper.js";
+const s = {}, _ = (e) => (c("data-v-eaa4d6ee"), e = e(), r(), e), a = {
+  width: "8",
+  height: "4",
+  viewBox: "0 0 8 4",
+  fill: "none",
+  xmlns: "http://www.w3.org/2000/svg"
+}, p = /* @__PURE__ */ _(() => /* @__PURE__ */ n("path", {
+  d: "M7.94188 3.66979L4.21022 0.0771272C4.1034 -0.0257091 3.89773 -0.0257091 3.78978 0.0771272L0.0581151 3.66979C-0.0805157 3.80376 0.0444792 4 0.268334 4H7.73167C7.95552 4 8.08052 3.80376 7.94188 3.66979Z",
+  fill: "currentColor"
+}, null, -1)), i = [
+  p
+];
+function l(e, h) {
+  return o(), t("svg", a, i);
+}
+const u = /* @__PURE__ */ d(s, [["render", l], ["__scopeId", "data-v-eaa4d6ee"]]);
+export {
+  u as default
+};

package/components/table/Table.vue.js

@@ -0,0 +1,6 @@
+import o from "./Table.vue2.js";
+/* empty css            *//* empty css            */import t from "../../_virtual/_plugin-vue_export-helper.js";
+const _ = /* @__PURE__ */ t(o, [["__scopeId", "data-v-096d493a"]]);
+export {
+  _ as default
+};