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

package/components/dropdown/v3/Dropdown.vue2.js

@@ -0,0 +1,372 @@
+import { defineComponent as J, openBlock as d, createElementBlock as o, normalizeClass as $, unref as e, renderSlot as b, createVNode as s, withCtx as n, Transition as Q, createElementVNode as f, createTextVNode as r, toDisplayString as h, createCommentVNode as i, createBlock as g, isRef as Z, mergeProps as E, withModifiers as x, Fragment as _, renderList as ee, toRaw as T, pushScopeId as te, popScopeId as le } from "vue";
+import P from "../../button/v3/Button.vue.js";
+import A from "../../icon/Icon.vue.js";
+import { DropdownTestIdModifiers as u } from "../../../testids/index.js";
+/* empty css                             */import p from "../../typography/Text.vue.js";
+/* empty css                                  *//* empty css                               *//* empty css                                      */import { Dropdown as ae } from "floating-vue";
+/* empty css                          *//* empty css                                 */import de from "../common/Option.vue.js";
+import ie from "../../search/v4/SearchV4.vue.js";
+import { dropdownCommon as oe } from "../common/Dropdown.common.js";
+const ne = (t) => (te("data-v-0f9d5331"), t = t(), le(), t), se = ["tabindex", "data-testid"], re = ["disabled", "aria-expanded", "aria-labelledby", "aria-disabled"], ue = {
+  key: 0,
+  class: "image-slot"
+}, ce = { class: "angle-down" }, fe = {
+  key: 0,
+  ref: "listRef",
+  class: "dropdown-title"
+}, me = ["data-testid"], pe = ["data-testid"], ye = {
+  key: 0,
+  class: "no-result-container"
+}, be = {
+  key: 1,
+  class: "loader"
+}, he = /* @__PURE__ */ ne(() => /* @__PURE__ */ f("svg", {
+  width: "100",
+  height: "100",
+  viewBox: "0 0 100 100"
+}, [
+  /* @__PURE__ */ f("circle", {
+    cx: "50",
+    cy: "50",
+    fill: "none",
+    stroke: "currentColor",
+    "stroke-width": "6",
+    r: "35",
+    "stroke-dasharray": "164.93361431346415 56.97787143782138"
+  }, [
+    /* @__PURE__ */ f("animateTransform", {
+      attributeName: "transform",
+      type: "rotate",
+      repeatCount: "indefinite",
+      dur: "1s",
+      values: "0 50 50;360 50 50",
+      keyTimes: "0;1"
+    })
+  ])
+], -1)), ke = { key: 2 }, we = ["aria-selected", "aria-disabled", "onClick"], ve = {
+  key: 0,
+  class: "actions"
+}, Ve = /* @__PURE__ */ J({
+  __name: "Dropdown",
+  props: {
+    modelValue: { default: null },
+    placeholder: { default: "" },
+    disabled: { type: Boolean, default: !1 },
+    mandatory: { type: Boolean, default: !1 },
+    helperText: { default: "" },
+    searchPlaceholder: { default: "" },
+    isOnTop: { type: Boolean, default: !1 },
+    multi: { type: Boolean, default: !1 },
+    title: { default: "" },
+    inlineSearch: { type: Boolean, default: !1 },
+    popperClass: { default: "" },
+    noResultsText: { default: "No results found" },
+    loading: { type: Boolean },
+    selected: { default: null },
+    showSelectAll: { type: Boolean },
+    defaultOpen: { type: Boolean, default: !1 },
+    showButtonOnOpen: { type: Boolean, default: !0 },
+    autoFocus: { type: Boolean, default: !1 },
+    distance: { default: 0 },
+    isOpen: { type: Boolean },
+    skidding: { default: 0 },
+    placement: { default: "bottom-start" },
+    clearable: { type: Boolean, default: !1 },
+    error: { default: "" },
+    size: { default: "lg" },
+    displayValue: null,
+    options: null,
+    onSearch: { type: Function, default: () => !0 },
+    theme: { default: "is-dropdown" },
+    container: { default: "body" },
+    flip: { type: Boolean, default: !0 },
+    keepOpen: { type: Boolean, default: !1 },
+    autoSize: { type: Boolean, default: !1 },
+    disableKeyboardEvents: { type: Boolean, default: !1 },
+    multiOptionsPlaceholderPrefix: { default: "" },
+    multiOptionsPlaceholderSuffix: { default: "" },
+    testId: { default: "" },
+    darkTheme: { type: Boolean, default: !0 },
+    valueToCopy: { default: "" }
+  },
+  emits: ["update:selected", "update:isOpen", "closed", "opened", "apply"],
+  setup(t, { expose: N, emit: V }) {
+    const K = t, {
+      onKeydown: y,
+      location: L,
+      open: m,
+      toggleMenu: C,
+      onButtonKeydown: k,
+      displayedValue: B,
+      labelRef: D,
+      query: w,
+      containerProps: H,
+      calculateTableHeight: F,
+      wrapperProps: M,
+      filteredOptions: G,
+      allSelected: I,
+      isIndeterminate: X,
+      onSelectAll: q,
+      virtualOptions: S,
+      isSelected: z,
+      selectedOption: O,
+      onSelect: R,
+      activeIndex: U,
+      onCancel: W,
+      onApply: Y,
+      scrollTo: j
+    } = oe(K, V);
+    return N({
+      selectItem: R,
+      scrollTo: j
+    }), (c, a) => (d(), o("div", {
+      ref: "el",
+      class: $(["dropdown", { "dropdown--disabled": t.disabled }]),
+      tabindex: t.disabled ? -1 : 0,
+      "data-testid": `${t.testId}-${e(u).WRAPPER}`,
+      onKeydown: a[7] || (a[7] = //@ts-ignore
+      (...l) => e(y) && e(y)(...l))
+    }, [
+      b(c.$slots, "label", {}, void 0, !0),
+      s(e(ae), {
+        theme: t.theme,
+        "popper-class": [
+          t.popperClass,
+          t.autoSize ? "v-popper--theme-is-dropdown--auto-size" : null
+        ],
+        placement: t.placement,
+        skidding: t.isOnTop ? 0 : t.skidding,
+        distance: t.isOnTop ? -e(L) : t.distance,
+        flip: t.flip,
+        triggers: [],
+        shown: !!e(m),
+        "auto-hide": !1,
+        container: t.container,
+        "auto-size": t.autoSize,
+        "data-testid": `${t.testId}-${e(u).TRIGGER}`
+      }, {
+        popper: n(() => [
+          s(Q, null, {
+            default: n(() => [
+              t.inlineSearch || t.title ? (d(), o("div", fe, [
+                f("div", null, [
+                  t.title ? (d(), o("div", {
+                    key: 0,
+                    class: "dropdown-title__text",
+                    "data-testid": `${t.testId}-${e(u).TITLE}`
+                  }, [
+                    s(e(p), { strong: "" }, {
+                      default: n(() => [
+                        r(h(t.title), 1)
+                      ]),
+                      _: 1
+                    })
+                  ], 8, me)) : i("", !0),
+                  t.inlineSearch ? (d(), g(e(ie), {
+                    key: 1,
+                    modelValue: e(w),
+                    "onUpdate:modelValue": a[4] || (a[4] = (l) => Z(w) ? w.value = l : null),
+                    placeholder: t.searchPlaceholder,
+                    class: "dropdown-title__search",
+                    variant: "transparent",
+                    size: "md",
+                    "test-id": `${t.testId}-${e(u).SEARCH}`,
+                    onKeydown: e(y)
+                  }, null, 8, ["modelValue", "placeholder", "test-id", "onKeydown"])) : i("", !0)
+                ]),
+                e(m) ? (d(), o("div", {
+                  key: 0,
+                  class: "dropdown",
+                  onKeydown: a[6] || (a[6] = //@ts-ignore
+                  (...l) => e(y) && e(y)(...l))
+                }, [
+                  b(c.$slots, "input-list", { open: e(m) }, void 0, !0),
+                  f("div", E(e(H), {
+                    class: ["list-container", { "list-container--multi": t.multi }],
+                    style: { height: `${e(F)}rem` },
+                    "data-testid": `${t.testId}-${e(u).LIST_CONTAINER}`
+                  }), [
+                    f("ul", E(e(M), {
+                      role: "listbox",
+                      class: ["list", { "list--multi": t.multi }]
+                    }), [
+                      !e(G).length && !t.loading ? (d(), o("li", ye, [
+                        s(e(p), {
+                          size: "sm",
+                          class: "no-result"
+                        }, {
+                          default: n(() => [
+                            r(h(t.noResultsText), 1)
+                          ]),
+                          _: 1
+                        })
+                      ])) : i("", !0),
+                      t.loading ? (d(), o("li", be, [
+                        s(e(A), {
+                          "font-size": "md",
+                          class: "loader-icon"
+                        }, {
+                          default: n(() => [
+                            he
+                          ]),
+                          _: 1
+                        }),
+                        s(e(p), null, {
+                          default: n(() => [
+                            r("Loading...")
+                          ]),
+                          _: 1
+                        })
+                      ])) : i("", !0),
+                      t.showSelectAll ? (d(), o("li", ke, [
+                        s(de, {
+                          "aria-selected": e(I),
+                          "aria-disabled": !!t.disabled,
+                          "selected-prop": e(I),
+                          "is-indeterminate": e(X),
+                          "select-all-option": "",
+                          onClick: a[5] || (a[5] = x((l) => e(q)(), ["stop"]))
+                        }, {
+                          default: n(() => [
+                            r("Select all ")
+                          ]),
+                          _: 1
+                        }, 8, ["aria-selected", "aria-disabled", "selected-prop", "is-indeterminate"])
+                      ])) : i("", !0),
+                      e(S).length && !t.loading ? (d(!0), o(_, { key: 3 }, ee(e(S), ({ data: l, index: v }) => (d(), o("li", {
+                        key: v,
+                        "aria-selected": e(z)(T(e(O)), l),
+                        "aria-disabled": !!t.disabled,
+                        onClick: x(() => e(R)(l, v), ["stop"])
+                      }, [
+                        b(c.$slots, "default", {
+                          option: l,
+                          selected: e(z)(T(e(O)), l),
+                          active: T(e(U)) === v
+                        }, void 0, !0)
+                      ], 8, we))), 128)) : i("", !0)
+                    ], 16)
+                  ], 16, pe),
+                  t.multi ? (d(), o("div", ve, [
+                    s(e(P), {
+                      ref: "cancel",
+                      size: "sm",
+                      variant: "border",
+                      theme: "third",
+                      "test-id": `${t.testId}-${e(u).ACTION_CANCEL}`,
+                      onClick: e(W)
+                    }, {
+                      default: n(() => [
+                        r(" Cancel ")
+                      ]),
+                      _: 1
+                    }, 8, ["test-id", "onClick"]),
+                    s(e(P), {
+                      ref: "apply",
+                      "data-testid": "mutli-apply",
+                      size: "sm",
+                      class: "apply-button",
+                      "test-id": `${t.testId}-${e(u).ACTION_APPLY}`,
+                      onClick: e(Y)
+                    }, {
+                      default: n(() => [
+                        r("Apply ")
+                      ]),
+                      _: 1
+                    }, 8, ["test-id", "onClick"])
+                  ])) : i("", !0)
+                ], 32)) : i("", !0)
+              ], 512)) : i("", !0)
+            ]),
+            _: 3
+          })
+        ]),
+        default: n(() => [
+          f("div", {
+            class: $(["button__container", {
+              "button__container--open": !!e(m),
+              [`button__container--${t.size}`]: !0,
+              "button__container--disabled": t.disabled
+            }])
+          }, [
+            c.$slots.input ? (d(), o("div", {
+              key: 0,
+              ref: "buttonRef",
+              onClick: a[0] || (a[0] = (l) => e(C)()),
+              onKeydown: a[1] || (a[1] = //@ts-ignore
+              (...l) => e(k) && e(k)(...l))
+            }, [
+              b(c.$slots, "input", {
+                open: e(m),
+                value: e(B),
+                disabled: t.disabled
+              }, void 0, !0)
+            ], 544)) : i("", !0),
+            c.$slots.input ? i("", !0) : (d(), o("button", {
+              key: 1,
+              ref: "buttonRef",
+              disabled: t.disabled,
+              "aria-haspopup": !0,
+              "aria-expanded": !!e(m),
+              "aria-labelledby": e(D)?.id,
+              "aria-disabled": t.disabled,
+              class: $([{
+                "button--open": !!e(m),
+                [`button--${t.size}`]: !0,
+                "button--disabled": t.disabled
+              }, "button"]),
+              onKeydown: a[2] || (a[2] = //@ts-ignore
+              (...l) => e(k) && e(k)(...l)),
+              onClick: a[3] || (a[3] = (l) => e(C)())
+            }, [
+              c.$slots.image ? (d(), o("div", ue, [
+                b(c.$slots, "image", {}, void 0, !0)
+              ])) : i("", !0),
+              s(e(p), {
+                size: "sm",
+                "is-truncated": ""
+              }, {
+                default: n(() => [
+                  r(h(e(B)), 1)
+                ]),
+                _: 1
+              }),
+              f("div", ce, [
+                s(e(A), {
+                  name: "angle-down",
+                  "font-size": "sm"
+                })
+              ])
+            ], 42, re))
+          ], 2)
+        ]),
+        _: 3
+      }, 8, ["theme", "popper-class", "placement", "skidding", "distance", "flip", "shown", "container", "auto-size", "data-testid"]),
+      !t.error && t.helperText ? (d(), g(e(p), {
+        key: 0,
+        size: "caption",
+        class: "helper-text",
+        "test-id": `${t.testId}-${e(u).HELPER_TEXT}`
+      }, {
+        default: n(() => [
+          r(h(t.helperText), 1)
+        ]),
+        _: 1
+      }, 8, ["test-id"])) : i("", !0),
+      t.error ? (d(), g(e(p), {
+        key: 1,
+        size: "caption",
+        class: "helper-text helper-text--error",
+        "test-id": `${t.testId}-${e(u).HELPER_TEXT_ERROR}`
+      }, {
+        default: n(() => [
+          r(h(t.error), 1)
+        ]),
+        _: 1
+      }, 8, ["test-id"])) : i("", !0)
+    ], 42, se));
+  }
+});
+export {
+  Ve as default
+};

package/components/dropdown/v3/index.js

@@ -0,0 +1,12 @@
+import o from "./Dropdown.vue.js";
+import r from "../common/Option.vue.js";
+import p from "../common/Label.vue.js";
+import m from "../common/SearchInput.vue.js";
+const f = () => [o, r, p, m];
+export {
+  o as Dropdown,
+  f as DropdownTypes,
+  p as Label,
+  r as Option,
+  m as SearchInput
+};

package/components/dropdown/v4/DropdownV4.vue.js

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