@ironsource/shared-ui 2.1.0-rc.2 → 2.1.0

package/components/checkbox/v4/CheckboxV4.vue2.js

@@ -0,0 +1,107 @@
+ import "../../../CheckboxV4.vue_vue_type_style_index_0_scoped_ee3e6d82_lang.css"; import { defineComponent as D, openBlock as o, createElementBlock as p, mergeProps as r, unref as e, createElementVNode as m, Fragment as x, createBlock as n, createCommentVNode as s, withCtx as V, renderSlot as F, createTextVNode as g, toDisplayString as A, pushScopeId as T, popScopeId as v } from "vue";
+import L from "../../typography/v4/Typography.vue.js";
+import N from "./icons/UncheckedState.vue.js";
+import P from "./icons/CheckedState.vue.js";
+import $ from "./icons/IndeterminateState.vue.js";
+import w from "./icons/UncheckedDisabledState.vue.js";
+import H from "./icons/CheckedDisabledState.vue.js";
+import K from "./icons/IndeterminateDisabledState.vue.js";
+import { CheckboxTestIdModifiers as i } from "../../../testids/index.js";
+import { checkboxCommon as R } from "../common/Checkbox.common.js";
+import { useTestIdAttrs as U } from "../../../utils/testIds.js";
+const M = (t) => (T("data-v-ee3e6d82"), t = t(), v(), t), W = ["for"], j = { class: "checkboxes" }, q = ["id", "disabled", "checked", ".indeterminate"], z = /* @__PURE__ */ M(() => /* @__PURE__ */ m("span", { class: "checkbox__inner" }, null, -1)), G = { class: "states" }, de = /* @__PURE__ */ D({
+  __name: "CheckboxV4",
+  props: {
+    isChecked: { type: Boolean },
+    isIndeterminate: { type: Boolean },
+    disabled: { type: Boolean },
+    label: { default: "" },
+    testId: { default: "" }
+  },
+  emits: ["update:isChecked", "click"],
+  setup(t, { emit: b }) {
+    const h = t, {
+      id: f,
+      checkbox: B,
+      isFocusVisible: E,
+      handleFocus: y,
+      handleBlur: C,
+      indeterminate: a,
+      checked: u,
+      unchecked: I,
+      updateValue: S
+    } = R(h, b), l = U(h.testId, i);
+    return (k, d) => (o(), p("label", r({
+      for: e(f),
+      class: [{
+        "focus-visible": e(E),
+        disabled: t.disabled
+      }, "checkbox"]
+    }, e(l)[e(i).WRAPPER]), [
+      m("span", j, [
+        m("input", r({ ...k.$attrs, ...e(l)[e(i).FIELD] }, {
+          id: e(f),
+          ref: e(B),
+          disabled: t.disabled,
+          checked: e(u),
+          class: "input",
+          ".indeterminate": e(a),
+          type: "checkbox",
+          onBlur: d[0] || (d[0] = //@ts-ignore
+          (...c) => e(C) && e(C)(...c)),
+          onFocus: d[1] || (d[1] = //@ts-ignore
+          (...c) => e(y) && e(y)(...c)),
+          onClick: d[2] || (d[2] = (c) => b("click", c)),
+          onInput: d[3] || (d[3] = //@ts-ignore
+          (...c) => e(S) && e(S)(...c))
+        }), null, 16, q),
+        z,
+        m("span", G, [
+          t.disabled ? s("", !0) : (o(), p(x, { key: 0 }, [
+            e(u) ? (o(), n(P, r({
+              key: 0,
+              class: "icon checked"
+            }, e(l)[e(i).CHECKED]), null, 16)) : s("", !0),
+            e(a) ? (o(), n($, {
+              key: 1,
+              class: "icon indeterminate"
+            })) : s("", !0),
+            e(I) && !e(a) ? (o(), n(N, {
+              key: 2,
+              class: "icon unchecked"
+            })) : s("", !0)
+          ], 64)),
+          t.disabled ? (o(), p(x, { key: 1 }, [
+            e(u) ? (o(), n(H, r({
+              key: 0,
+              class: "icon checked"
+            }, e(l)[e(i).CHECKED]), null, 16)) : s("", !0),
+            e(a) ? (o(), n(K, {
+              key: 1,
+              class: "icon indeterminate"
+            })) : s("", !0),
+            e(I) && !e(a) ? (o(), n(w, {
+              key: 2,
+              class: "icon unchecked"
+            })) : s("", !0)
+          ], 64)) : s("", !0)
+        ])
+      ]),
+      t.label || k.$slots.default ? (o(), n(e(L), r({
+        key: 0,
+        variant: "body2",
+        class: "checkbox-label"
+      }, e(l)[e(i).LABEL]), {
+        default: V(() => [
+          F(k.$slots, "default", {}, () => [
+            g(A(t.label), 1)
+          ], !0)
+        ]),
+        _: 3
+      }, 16)) : s("", !0)
+    ], 16, W));
+  }
+});
+export {
+  de as default
+};

package/components/checkbox/v4/icons/CheckedDisabledState.vue.js

@@ -0,0 +1,38 @@
+import { openBlock as e, createElementBlock as o, createElementVNode as t } from "vue";
+import r from "../../../../_virtual/_plugin-vue_export-helper.js";
+const n = {}, s = {
+  xmlns: "http://www.w3.org/2000/svg",
+  viewBox: "0 0 16 16",
+  fill: "none"
+}, c = /* @__PURE__ */ t("rect", {
+  width: "16",
+  height: "16",
+  rx: "4",
+  fill: "#CEE7FE"
+}, null, -1), i = /* @__PURE__ */ t("rect", {
+  x: "0.5",
+  y: "0.5",
+  width: "15",
+  height: "15",
+  rx: "3.5",
+  stroke: "#0091FF",
+  "stroke-opacity": "0.5"
+}, null, -1), l = /* @__PURE__ */ t("path", {
+  d: "M12.125 5.375L6.875 10.625L4.25 8",
+  stroke: "#0091FF",
+  "stroke-opacity": "0.5",
+  "stroke-width": "1.5",
+  "stroke-linecap": "round",
+  "stroke-linejoin": "round"
+}, null, -1), _ = [
+  c,
+  i,
+  l
+];
+function d(h, a) {
+  return e(), o("svg", s, _);
+}
+const f = /* @__PURE__ */ r(n, [["render", d]]);
+export {
+  f as default
+};

package/components/checkbox/v4/icons/CheckedState.vue.js

@@ -0,0 +1,38 @@
+import { openBlock as e, createElementBlock as o, createElementVNode as t } from "vue";
+import n from "../../../../_virtual/_plugin-vue_export-helper.js";
+const r = {}, s = {
+  xmlns: "http://www.w3.org/2000/svg",
+  viewBox: "0 0 16 16",
+  fill: "none"
+}, c = /* @__PURE__ */ t("rect", {
+  x: "0.5",
+  y: "0.5",
+  width: "15",
+  height: "15",
+  rx: "3.5",
+  fill: "#0091FF"
+}, null, -1), i = /* @__PURE__ */ t("rect", {
+  x: "0.5",
+  y: "0.5",
+  width: "15",
+  height: "15",
+  rx: "3.5",
+  stroke: "#0880EA"
+}, null, -1), l = /* @__PURE__ */ t("path", {
+  d: "M12.125 5.375L6.875 10.625L4.25 8",
+  stroke: "white",
+  "stroke-width": "1.5",
+  "stroke-linecap": "round",
+  "stroke-linejoin": "round"
+}, null, -1), _ = [
+  c,
+  i,
+  l
+];
+function h(d, a) {
+  return e(), o("svg", s, _);
+}
+const x = /* @__PURE__ */ n(r, [["render", h]]);
+export {
+  x as default
+};

package/components/checkbox/v4/icons/IndeterminateDisabledState.vue.js

@@ -0,0 +1,40 @@
+import { openBlock as e, createElementBlock as o, createElementVNode as t } from "vue";
+import n from "../../../../_virtual/_plugin-vue_export-helper.js";
+const r = {}, s = {
+  xmlns: "http://www.w3.org/2000/svg",
+  viewBox: "0 0 16 16",
+  fill: "none"
+}, c = /* @__PURE__ */ t("rect", {
+  width: "16",
+  height: "16",
+  rx: "4",
+  fill: "#CEE7FE"
+}, null, -1), i = /* @__PURE__ */ t("rect", {
+  x: "0.5",
+  y: "0.5",
+  width: "15",
+  height: "15",
+  rx: "3.5",
+  stroke: "#0091FF",
+  "stroke-opacity": "0.5"
+}, null, -1), l = /* @__PURE__ */ t("line", {
+  x1: "4.75",
+  y1: "8.25",
+  x2: "11.25",
+  y2: "8.25",
+  stroke: "#0091FF",
+  "stroke-opacity": "0.5",
+  "stroke-width": "1.5",
+  "stroke-linecap": "round"
+}, null, -1), _ = [
+  c,
+  i,
+  l
+];
+function d(h, a) {
+  return e(), o("svg", s, _);
+}
+const m = /* @__PURE__ */ n(r, [["render", d]]);
+export {
+  m as default
+};

package/components/checkbox/v4/icons/IndeterminateState.vue.js

@@ -0,0 +1,40 @@
+import { openBlock as e, createElementBlock as o, createElementVNode as t } from "vue";
+import n from "../../../../_virtual/_plugin-vue_export-helper.js";
+const r = {}, s = {
+  xmlns: "http://www.w3.org/2000/svg",
+  viewBox: "0 0 16 16",
+  fill: "none"
+}, c = /* @__PURE__ */ t("rect", {
+  x: "0.5",
+  y: "0.5",
+  width: "15",
+  height: "15",
+  rx: "3.5",
+  fill: "#0091FF"
+}, null, -1), i = /* @__PURE__ */ t("rect", {
+  x: "0.5",
+  y: "0.5",
+  width: "15",
+  height: "15",
+  rx: "3.5",
+  stroke: "#0880EA"
+}, null, -1), l = /* @__PURE__ */ t("line", {
+  x1: "4.75",
+  y1: "8.25",
+  x2: "11.25",
+  y2: "8.25",
+  stroke: "white",
+  "stroke-width": "1.5",
+  "stroke-linecap": "round"
+}, null, -1), _ = [
+  c,
+  i,
+  l
+];
+function h(d, x) {
+  return e(), o("svg", s, _);
+}
+const m = /* @__PURE__ */ n(r, [["render", h]]);
+export {
+  m as default
+};

package/components/checkbox/v4/icons/UncheckedDisabledState.vue.js

@@ -0,0 +1,31 @@
+import { openBlock as t, createElementBlock as o, createElementVNode as e } from "vue";
+import c from "../../../../_virtual/_plugin-vue_export-helper.js";
+const n = {}, r = {
+  viewBox: "0 0 16 16",
+  fill: "none",
+  xmlns: "http://www.w3.org/2000/svg"
+}, s = /* @__PURE__ */ e("rect", {
+  x: "0.5",
+  y: "0.5",
+  width: "15",
+  height: "15",
+  rx: "3.5",
+  fill: "#EBEBEB"
+}, null, -1), i = /* @__PURE__ */ e("rect", {
+  x: "0.5",
+  y: "0.5",
+  width: "15",
+  height: "15",
+  rx: "3.5",
+  stroke: "#EBEBEB"
+}, null, -1), _ = [
+  s,
+  i
+];
+function l(h, d) {
+  return t(), o("svg", r, _);
+}
+const B = /* @__PURE__ */ c(n, [["render", l]]);
+export {
+  B as default
+};

package/components/checkbox/v4/icons/UncheckedState.vue.js

@@ -0,0 +1,31 @@
+import { openBlock as t, createElementBlock as o, createElementVNode as e } from "vue";
+import c from "../../../../_virtual/_plugin-vue_export-helper.js";
+const n = {}, r = {
+  viewBox: "0 0 16 16",
+  fill: "none",
+  xmlns: "http://www.w3.org/2000/svg"
+}, s = /* @__PURE__ */ e("rect", {
+  x: "0.5",
+  y: "0.5",
+  width: "15",
+  height: "15",
+  rx: "3.5",
+  fill: "#EBEBEB"
+}, null, -1), _ = /* @__PURE__ */ e("rect", {
+  x: "0.5",
+  y: "0.5",
+  width: "15",
+  height: "15",
+  rx: "3.5",
+  stroke: "#BBBBBB"
+}, null, -1), i = [
+  s,
+  _
+];
+function l(h, B) {
+  return t(), o("svg", r, i);
+}
+const x = /* @__PURE__ */ c(n, [["render", l]]);
+export {
+  x as default
+};

package/components/chip/v3/Chip.vue.js

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

package/components/chip/v3/Chip.vue2.js

@@ -0,0 +1,58 @@
+ import "../../../Chip.vue_vue_type_style_index_0_scoped_f89d9361_lang.css"; import { defineComponent as r, openBlock as s, createElementBlock as a, normalizeClass as f, unref as d, renderSlot as l, createCommentVNode as o, createElementVNode as u, toDisplayString as m, createVNode as p } from "vue";
+import b from "../../icon/v3/Icon.vue.js";
+import { ChipTestIdModifiers as n } from "../../../testids/index.js";
+const h = ["disabled", "data-testid"], $ = {
+  key: 0,
+  class: "icon icon--start"
+}, y = {
+  key: 0,
+  class: "prefix"
+}, k = {
+  key: 1,
+  class: "icon icon--end"
+}, C = ["data-testid"], N = /* @__PURE__ */ r({
+  __name: "Chip",
+  props: {
+    selected: { type: Boolean, default: !1 },
+    clearable: { type: Boolean, default: !1 },
+    prefix: { default: null },
+    disabled: { type: Boolean, default: !1 },
+    testId: { default: "" }
+  },
+  emits: ["cleared"],
+  setup(e, { emit: i }) {
+    const c = (t) => {
+      t.stopPropagation(), i("cleared");
+    };
+    return (t, B) => (s(), a("button", {
+      class: f(["chip-container", { selected: e.selected, disabled: e.disabled }]),
+      disabled: e.disabled,
+      "data-testid": `${e.testId}-${d(n).WRAPPER}`
+    }, [
+      t.$slots["icon-start"] ? (s(), a("span", $, [
+        l(t.$slots, "icon-start", {}, void 0, !0)
+      ])) : o("", !0),
+      u("span", null, [
+        e.prefix ? (s(), a("span", y, m(e.prefix) + ":", 1)) : o("", !0),
+        l(t.$slots, "default", {}, void 0, !0)
+      ]),
+      t.$slots["icon-end"] ? (s(), a("span", k, [
+        l(t.$slots, "icon-end", {}, void 0, !0)
+      ])) : o("", !0),
+      e.clearable ? (s(), a("button", {
+        key: 2,
+        class: "clear-icon",
+        "data-testid": `${e.testId}-${d(n).CLEAR}`,
+        onClick: c
+      }, [
+        p(d(b), {
+          name: "close-bold",
+          "font-size": "sm"
+        })
+      ], 8, C)) : o("", !0)
+    ], 10, h));
+  }
+});
+export {
+  N as default
+};

package/components/chip/v4/ChipV4.vue.js

@@ -0,0 +1,7 @@
+import o from "./ChipV4.vue2.js";
+/* empty css             */import _ from "../../../_virtual/_plugin-vue_export-helper.js";
+// import "../../../ChipV4.vue_vue_type_style_index_0_scoped_78d7c9c0_lang.css"; //*');
+const s = /* @__PURE__ */ _(o, [["__scopeId", "data-v-78d7c9c0"]]);
+export {
+  s as default
+};

package/components/chip/v4/ChipV4.vue2.js

@@ -0,0 +1,67 @@
+ import "../../../ChipV4.vue_vue_type_style_index_0_scoped_78d7c9c0_lang.css"; import { defineComponent as f, resolveComponent as m, openBlock as o, createElementBlock as s, normalizeClass as p, unref as l, renderSlot as n, createCommentVNode as a, createElementVNode as b, toDisplayString as h, createVNode as d, withCtx as C, createTextVNode as $ } from "vue";
+import y from "../../icon/v3/Icon.vue.js";
+import { ChipTestIdModifiers as i } from "../../../testids/index.js";
+const k = ["disabled", "data-testid"], B = {
+  key: 0,
+  class: "icon icon--start"
+}, V = {
+  key: 0,
+  class: "prefix"
+}, I = {
+  key: 1,
+  class: "icon icon--end"
+}, v = ["data-testid"], R = /* @__PURE__ */ f({
+  __name: "ChipV4",
+  props: {
+    selected: { type: Boolean, default: !1 },
+    clearable: { type: Boolean, default: !1 },
+    prefix: { default: null },
+    disabled: { type: Boolean, default: !1 },
+    testId: { default: "" }
+  },
+  emits: ["cleared"],
+  setup(e, { emit: c }) {
+    const r = (t) => {
+      t.stopPropagation(), c("cleared");
+    };
+    return (t, E) => {
+      const u = m("B");
+      return o(), s("button", {
+        class: p(["chip-container", { selected: e.selected, disabled: e.disabled }]),
+        disabled: e.disabled,
+        "data-testid": `${e.testId}-${l(i).WRAPPER}`
+      }, [
+        t.$slots["icon-start"] ? (o(), s("span", B, [
+          n(t.$slots, "icon-start", {}, void 0, !0)
+        ])) : a("", !0),
+        b("span", null, [
+          e.prefix ? (o(), s("span", V, h(e.prefix) + ":", 1)) : a("", !0),
+          n(t.$slots, "default", {}, void 0, !0),
+          d(u, null, {
+            default: C(() => [
+              $(" V4 ")
+            ]),
+            _: 1
+          })
+        ]),
+        t.$slots["icon-end"] ? (o(), s("span", I, [
+          n(t.$slots, "icon-end", {}, void 0, !0)
+        ])) : a("", !0),
+        e.clearable ? (o(), s("button", {
+          key: 2,
+          class: "clear-icon",
+          "data-testid": `${e.testId}-${l(i).CLEAR}`,
+          onClick: r
+        }, [
+          d(l(y), {
+            name: "close-bold",
+            "font-size": "sm"
+          })
+        ], 8, v)) : a("", !0)
+      ], 10, k);
+    };
+  }
+});
+export {
+  R as default
+};

package/components/cssBaseline/CssBaseline.vue.js

@@ -0,0 +1,10 @@
+import { renderSlot as r } from "vue";
+/* empty css                  *//* empty css                  */import t from "../../_virtual/_plugin-vue_export-helper.js";
+const o = {};
+function n(e, s) {
+  return r(e.$slots, "default", {}, void 0, !0);
+}
+const a = /* @__PURE__ */ t(o, [["render", n], ["__scopeId", "data-v-f7dd256b"]]);
+export {
+  a as default
+};

package/components/datePicker/DatePicker.vue.js

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

package/components/datePicker/DatePicker.vue2.js

@@ -0,0 +1,97 @@
+ import "../../DatePicker.vue_vue_type_style_index_0_scoped_e108ef3b_lang.css"; import { defineComponent as C, ref as r, computed as i, openBlock as v, createElementBlock as g, unref as l, createElementVNode as w, renderSlot as M, withDirectives as R, isRef as T, vModelText as x, normalizeClass as B, createVNode as E, createCommentVNode as N } from "vue";
+import { onClickOutside as b } from "@vueuse/core";
+import { useToggle as U } from "../../composables/useToggle.js";
+import W from "./DatePickerMonth.vue.js";
+import { isValid as m, format as q, parse as A, isFuture as O } from "date-fns";
+import { DatePickerTestIdModifiers as y } from "../../testids/index.js";
+const S = ["id", "data-testid"], z = ["placeholder", "data-testid"], Q = /* @__PURE__ */ C({
+  __name: "DatePicker",
+  props: {
+    uniqueId: { default: Date.now() },
+    modelValue: { default: null },
+    allowFutureDates: { type: Boolean, default: !1 },
+    dateFormat: { default: "yyyy-MM-d" },
+    placeholder: { default: "" },
+    testId: { default: "" }
+  },
+  emits: ["update:modelValue"],
+  setup(n, { emit: c }) {
+    const a = n, u = r(null), p = r(null), I = r(null), h = r(null), [s, V] = U({ initialValue: !1 }), k = () => {
+      V(!1);
+    }, P = (e) => {
+      const t = e.target.value;
+      if (!s) {
+        c("update:modelValue", t);
+        return;
+      }
+      const o = A(t, a.dateFormat, /* @__PURE__ */ new Date());
+      t.trim() || f(null), m(o) && (!a.allowFutureDates && O(o) || f(o));
+    }, f = (e) => {
+      k(), c("update:modelValue", e);
+    }, D = i(() => `datePicker${a.uniqueId || Math.random().toString().substring(2, 7)}`), d = i(() => {
+      const e = new Date(a.modelValue);
+      return m(a.modelValue) ? q(e, a.dateFormat) : a.modelValue;
+    }), F = i(() => {
+      if (!u.value || !s)
+        return !1;
+      const e = u.value.getBoundingClientRect(), t = 232;
+      return window.innerWidth - (e.x + t) < 0;
+    }), $ = i(() => {
+      if (!a.modelValue)
+        return null;
+      const e = new Date(a.modelValue);
+      return m(e) ? e : null;
+    });
+    return b(
+      p,
+      () => {
+        k();
+      },
+      { ignore: [u] }
+    ), (e, t) => (v(), g("div", {
+      id: l(D),
+      ref_key: "datePicker",
+      ref: u,
+      class: "date-picker",
+      "data-testid": `${n.testId}-${l(y).WRAPPER}`
+    }, [
+      w("div", {
+        ref_key: "buttonRef",
+        ref: h,
+        onClick: t[2] || (t[2] = (o) => l(V)())
+      }, [
+        M(e.$slots, "default", { formattedDate: l(d) }, () => [
+          R(w("input", {
+            ref_key: "input",
+            ref: I,
+            "onUpdate:modelValue": t[0] || (t[0] = (o) => T(d) ? d.value = o : null),
+            type: "text",
+            class: "input",
+            placeholder: n.placeholder,
+            "data-testid": `${n.testId}-${l(y).INPUT}`,
+            onInput: t[1] || (t[1] = (o) => P(o))
+          }, null, 40, z), [
+            [x, l(d)]
+          ])
+        ], !0)
+      ], 512),
+      l(s) ? (v(), g("div", {
+        key: 0,
+        ref_key: "popup",
+        ref: p,
+        class: B(["date-picker-popup", { "align-right": l(F) }])
+      }, [
+        E(W, {
+          id: l(D) + "-month",
+          "model-value": l($),
+          "allow-future-dates": n.allowFutureDates,
+          "test-id": n.testId,
+          "onUpdate:modelValue": f
+        }, null, 8, ["id", "model-value", "allow-future-dates", "test-id"])
+      ], 2)) : N("", !0)
+    ], 8, S));
+  }
+});
+export {
+  Q as default
+};

package/components/datePicker/DatePickerMonth.vue.js

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