@adyen/bento-vue3 1.88.1 → 1.89.2

package/dist/chunks/tab.DRrnMCxe.js

@@ -1,273 +0,0 @@
-import { defineComponent as Y, ref as T, provide as O, watch as K, nextTick as D, computed as I, unref as f, onUnmounted as P, resolveComponent as L, openBlock as y, createElementBlock as g, createElementVNode as k, normalizeStyle as ee, normalizeClass as N, createVNode as F, withCtx as A, Fragment as te, renderList as ae, withDirectives as R, withKeys as ne, createTextVNode as V, toDisplayString as W, createBlock as se, createCommentVNode as $, vShow as S, renderSlot as j, toRefs as oe, inject as X } from "vue";
-import { B as ie } from "./typography.B3J6_tYk.js";
-import { g as re } from "./generate-uid.NJ8tVoha.js";
-import { T as z, a as G, E as le } from "./tabs.keys.B4qGhjp2.js";
-import { F as de } from "./fixed-scroller.i1tmEmst.js";
-import { _ as J } from "./_plugin-vue_export-helper.CHgC5LLL.js";
-import "../assets/tab.css";
-const U = (e, s) => {
-  const a = e === 0 ? s.length - 1 : e - 1, r = s[a];
-  return r.disabled || r.hidden ? U(a, s) : a;
-}, q = (e, s) => {
-  const a = e === s.length - 1 ? 0 : e + 1, r = s[a];
-  return r.disabled || r.hidden ? q(a, s) : a;
-};
-var x = /* @__PURE__ */ ((e) => (e.ACTIVE_TAB_INDEX = "update:active-tab-index", e))(x || {});
-const ce = Y({
-  components: {
-    BentoTypography: ie,
-    FixedScroller: de
-  },
-  props: {
-    /**
-     * Sets the active tab by its index (0 being the first tab item).
-     */
-    activeTabIndex: { type: Number, default: 0 },
-    /*
-     * Renders the tab with a sticky positioning.
-     */
-    sticky: { type: Boolean, default: !1 },
-    /**
-     * Additional configurable options for tabs rendered with a sticky positioning.
-     * It must be an object of type {@see BentoStickyTabsOption}
-     * @property {Ref<number>} stickyOptions.top - Top position the tabs should take up when rendered as sticky.
-     */
-    stickyOptions: { type: Object, default: null }
-  },
-  emits: [x.ACTIVE_TAB_INDEX],
-  setup(e, { emit: s }) {
-    const a = T([]), r = T(null), m = T(), c = T(""), l = T(!1);
-    let b;
-    O(z, c);
-    const u = (t) => () => {
-      var o;
-      a.value = (o = a.value) == null ? void 0 : o.filter(({ id: i }) => i !== t);
-    };
-    O(G, ({
-      title: t,
-      disabled: o,
-      withNotificationIndicator: i,
-      counter: v,
-      hidden: B,
-      setElementRef: Z
-    }) => {
-      const C = re("b-tab");
-      return a.value.push({
-        counter: v,
-        disabled: o,
-        hidden: B,
-        id: C,
-        title: t,
-        withNotificationIndicator: i,
-        setElementRef: Z
-      }), { id: C, unregisterTab: u(C) };
-    });
-    const p = (t) => {
-      if (t.code === "ArrowLeft" || t.code === "ArrowRight") {
-        const o = a.value.find((v) => document.activeElement.id === v.id);
-        let i = a.value.indexOf(o);
-        t.code === "ArrowLeft" ? i = U(i, a.value) : t.code === "ArrowRight" && (i = q(i, a.value)), r.value.children[i].focus();
-      }
-    };
-    K(
-      [() => e.activeTabIndex, a],
-      ([t, o]) => {
-        D(() => {
-          var v;
-          const i = o[t];
-          c.value = i && !i.disabled ? i.id : (v = a.value.find(({ disabled: B }) => !B)) == null ? void 0 : v.id;
-        });
-      },
-      { immediate: !0 }
-    );
-    const n = (t) => {
-      c.value = t;
-      const o = a.value.findIndex(({ id: i }) => i === c.value);
-      s(x.ACTIVE_TAB_INDEX, o);
-    }, h = (t) => t ? "disabled" : !1, d = I(() => {
-      var t;
-      return (t = e.stickyOptions) != null && t.top ? f(e.stickyOptions.top) : 0;
-    }), E = I(() => e.sticky && d.value > 0 ? !0 : l.value), w = () => {
-      b && (b.disconnect(), b = null), l.value = !1;
-    }, H = (t) => {
-      e.sticky && d.value === 0 && (b = new IntersectionObserver(
-        ([o]) => {
-          l.value = o.intersectionRatio < 1;
-        },
-        { threshold: [1] }
-      ), b.observe(t));
-    };
-    K(
-      [() => e.sticky, m, d],
-      ([t, o]) => {
-        w(), t && o && D(() => H(o));
-      },
-      { immediate: !0 }
-    ), P(() => {
-      w();
-    });
-    const M = I(() => ({
-      "b-tabs__tab-list-wrapper--sticky": e.sticky,
-      "b-tabs__tab-list-wrapper--pinned": E.value
-    })), Q = I(
-      () => {
-        var t;
-        return (
-          // This helps us detect when the tabs are pinned without calculations on the tabs positions because it makes the tabs intersect by 1 pixel with the element on top of it, which is getting aught by the intersection observer.
-          // Followed this example: https://css-tricks.com/how-to-detect-when-a-sticky-element-gets-pinned/
-          e.sticky ? {
-            top: `${(((t = e.stickyOptions) == null ? void 0 : t.top) ?? 0) - 1}px`
-          } : {}
-        );
-      }
-    );
-    return {
-      tabs: a,
-      tablist: r,
-      tablistwrapper: m,
-      activeTabId: c,
-      tablistWrapperConditionalClasses: M,
-      tablistWrapperStyles: Q,
-      onKeydownTabsNavigation: p,
-      handleTabChange: n,
-      isDisabled: h
-    };
-  }
-}), be = { class: "b-tabs" }, ue = ["id", "aria-controls", "aria-hidden", "aria-selected", "tabindex", "disabled", "onClick", "onKeydown"], pe = { class: "b-tabs__tab-text" }, fe = {
-  key: 1,
-  class: "b-tabs__tab-notification-dot",
-  "aria-hidden": "true"
-}, _e = {
-  class: "b-tabs__tab-underline",
-  "aria-hidden": "true"
-};
-function ve(e, s, a, r, m, c) {
-  const l = L("bento-typography"), b = L("fixed-scroller");
-  return y(), g("div", be, [
-    k("div", {
-      ref: "tablistwrapper",
-      class: N(["b-tabs__tab-list-wrapper", e.tablistWrapperConditionalClasses]),
-      style: ee(e.tablistWrapperStyles)
-    }, [
-      F(b, {
-        condensed: "",
-        "extra-padding-top": 2
-      }, {
-        default: A(() => [
-          k("div", {
-            ref: "tablist",
-            class: "b-tabs__tab-list",
-            role: "tablist",
-            onKeydown: s[0] || (s[0] = (...u) => e.onKeydownTabsNavigation && e.onKeydownTabsNavigation(...u))
-          }, [
-            (y(!0), g(te, null, ae(e.tabs, ({
-              counter: u,
-              disabled: _,
-              hidden: p,
-              id: n,
-              title: h,
-              withNotificationIndicator: d,
-              setElementRef: E
-            }) => R((y(), g("button", {
-              id: n,
-              ref_for: !0,
-              ref: E,
-              key: n,
-              role: "tab",
-              type: "button",
-              class: N(["b-tabs__tab", {
-                "b-tabs__tab--active": e.activeTabId === n,
-                "b-tabs__tab--disabled": _
-              }]),
-              "aria-controls": `${n}-tabpanel`,
-              "aria-hidden": p ? "true" : "false",
-              "aria-selected": e.activeTabId === n ? "true" : "false",
-              tabindex: e.activeTabId === n && !_.value ? null : -1,
-              disabled: e.isDisabled(_),
-              onClick: (w) => e.handleTabChange(n),
-              onKeydown: ne((w) => e.handleTabChange(n), ["enter", "space"])
-            }, [
-              k("span", pe, [
-                F(l, {
-                  class: "b-tabs__tab-title",
-                  el: "span",
-                  variant: "body",
-                  stronger: ""
-                }, {
-                  default: A(() => [
-                    V(W(h), 1)
-                  ]),
-                  _: 2
-                }, 1024),
-                u != null ? (y(), se(l, {
-                  key: 0,
-                  class: N(["b-tabs__tab-counter", {
-                    "b-tabs__tab-counter--active": e.activeTabId === n
-                  }]),
-                  el: "span",
-                  variant: "body",
-                  stronger: ""
-                }, {
-                  default: A(() => [
-                    V(W(u), 1)
-                  ]),
-                  _: 2
-                }, 1032, ["class"])) : $("", !0),
-                d ? (y(), g("span", fe)) : $("", !0)
-              ]),
-              R(k("span", _e, null, 512), [
-                [S, e.activeTabId === n]
-              ])
-            ], 42, ue)), [
-              [S, !p]
-            ])), 128))
-          ], 544)
-        ]),
-        _: 1
-      })
-    ], 6),
-    j(e.$slots, "default", {}, void 0, !0)
-  ]);
-}
-const Be = /* @__PURE__ */ J(ce, [["render", ve], ["__scopeId", "data-v-c03b3f5b"]]), Te = ["id", "aria-labelledby"], ye = {
-  name: "bento-tab"
-}, me = /* @__PURE__ */ Y({
-  ...ye,
-  props: {
-    counter: { default: null },
-    disabled: { type: Boolean, default: !1 },
-    hidden: { type: Boolean, default: !1 },
-    title: {},
-    withNotificationIndicator: { type: Boolean, default: !1 },
-    setElementRef: { type: Function, default: void 0 }
-  },
-  setup(e) {
-    const s = e, { counter: a, disabled: r, hidden: m, withNotificationIndicator: c } = oe(s), l = T();
-    O(le, (d) => {
-      l.value = d;
-    });
-    const u = I(() => l.value ?? s.title), _ = X(G), p = X(z), { id: n, unregisterTab: h } = _({
-      counter: a,
-      disabled: r,
-      hidden: m,
-      title: u,
-      withNotificationIndicator: c,
-      setElementRef: s.setElementRef
-    });
-    return P(() => h()), (d, E) => R((y(), g("div", {
-      id: `${f(n)}-tabpanel`,
-      class: "b-tab",
-      role: "tabpanel",
-      "aria-labelledby": f(n)
-    }, [
-      f(p) === f(n) ? j(d.$slots, "default", { key: 0 }, void 0, !0) : $("", !0)
-    ], 8, Te)), [
-      [S, f(p) === f(n)]
-    ]);
-  }
-}), Ce = /* @__PURE__ */ J(me, [["__scopeId", "data-v-4d86994d"]]);
-export {
-  Ce as B,
-  Be as a
-};
-//# sourceMappingURL=tab.DRrnMCxe.js.map

package/dist/chunks/textarea.CvI2InIB.js

@@ -1,255 +0,0 @@
-import { defineComponent as Le, useAttrs as Ee, toRefs as W, ref as u, toRef as xe, computed as s, watch as I, nextTick as Ce, onMounted as Re, onUnmounted as Ae, openBlock as d, createElementBlock as $, normalizeClass as E, createElementVNode as M, normalizeStyle as z, unref as l, createBlock as h, createCommentVNode as c, withCtx as x, createTextVNode as Y, toDisplayString as G, createVNode as S, withKeys as w } from "vue";
-import { B as Be } from "./button.C6t9_lzm.js";
-import { d as De, B as F } from "./typography.B3J6_tYk.js";
-import { C as ke } from "./cross-circle-fill-small.H1wH-vcZ.js";
-import { g as Ue } from "./generate-uid.NJ8tVoha.js";
-import { o as X } from "./resize.Bqks3WUm.js";
-import { u as Ie } from "./aria-label.CaUURpnB.js";
-import { u as Me } from "./index.B875RXHM.js";
-import { u as Se } from "./form-field.D_2g7vaP.js";
-import { u as we } from "./use-form-layout-loading.CWbjZiwP.js";
-import { B as Fe } from "./es6.C1DXQV6f.js";
-import { F as Oe, E as j } from "./error-message.oGiefI2-.js";
-import { _ as Pe } from "./_plugin-vue_export-helper.CHgC5LLL.js";
-import "../assets/textarea.css";
-var p = /* @__PURE__ */ ((t) => (t.CLEARABLE = "clearable", t.DISABLED = "disabled", t.ERROR = "error", t.READONLY = "readonly", t))(p || {}), n = /* @__PURE__ */ ((t) => (t.BLUR = "blur", t.CHANGE = "change", t.CLEAR = "clear", t.ESCAPE_PRESSED = "escape-pressed", t.FOCUS = "focus", t.INPUT = "input", t.UPDATE_MODEL_VALUE = "update:model-value", t.KEYDOWN = "keydown", t.KEYUP = "keyup", t))(n || {});
-const J = {
-  "en-US": {
-    clearText: "Clear text",
-    textarea: "textarea",
-    yourTextCanBenAtMost: "Your text can be at most {characterLimit} characters"
-  }
-}, He = ["id", "value", "aria-label", "aria-invalid", "readonly", "required", "aria-required", "disabled", "placeholder"], Ke = {
-  key: 0,
-  class: "b-textarea__clear-button"
-}, Ne = parseFloat(Fe), Te = {
-  i18n: { messages: J },
-  name: "bento-textarea",
-  model: { prop: "modelValue" }
-}, qe = /* @__PURE__ */ Le({
-  ...Te,
-  props: {
-    ariaLabel: { default: void 0 },
-    characterLimit: { default: void 0 },
-    clearable: { type: Boolean, default: !1 },
-    height: { default: null },
-    resizable: { default: "both" },
-    value: { default: "" },
-    modelValue: { default: "" },
-    description: { default: "" },
-    disabled: { type: Boolean, default: !1 },
-    errorMessage: { default: "" },
-    label: { default: "" },
-    optional: { type: Boolean, default: !1 },
-    placeholder: { default: "" },
-    readonly: { type: Boolean, default: !1 },
-    required: { type: Boolean, default: !1 },
-    tooltipText: { default: null }
-  },
-  setup(t, { expose: Q, emit: Z }) {
-    const ee = Ee(), a = t, i = Z, { height: C } = W(a), O = Ue("textarea"), o = u(null), m = u(null), r = u(a.modelValue || a.value), f = 44, v = u(a.height || `${f}px`), P = u(0), R = u("100%"), A = u(!1);
-    let y = null, g = null;
-    const { t: H, n: K } = Me({ messages: J }), { isReadOnly: _ } = we(xe(a, "readonly")), { emitValue: N } = Se(i), ae = s(() => {
-      var e;
-      return `${K(((e = r == null ? void 0 : r.value) == null ? void 0 : e.length) ?? 0)} / ${K(a.characterLimit)}`;
-    }), L = s(() => !C.value), B = s(
-      () => a.characterLimit && r.value.length > a.characterLimit
-    ), D = () => {
-      if (o.value) {
-        const e = Math.max(
-          o.value.scrollHeight <= f ? f : o.value.scrollHeight + Ne * 2,
-          P.value,
-          f
-        );
-        v.value = `${e}px`;
-      }
-    };
-    I(C, () => {
-      L.value ? D() : v.value = C.value;
-    }), I(
-      () => [a.value, a.modelValue],
-      () => {
-        r.value = a.modelValue || a.value;
-      },
-      { immediate: !0 }
-    ), I(
-      () => r.value,
-      async () => {
-        if (L.value) {
-          if (v.value = `${f}px`, !r.value)
-            return;
-          await Ce(), D();
-        }
-      },
-      { immediate: !0 }
-    );
-    const T = s(() => !!a.errorMessage || B.value), te = s(() => ({
-      [`b-textarea--${p.DISABLED}`]: a.disabled
-    })), le = s(() => ({
-      [`b-textarea__input--${p.CLEARABLE}`]: a.clearable,
-      [`b-textarea__input--${p.READONLY}`]: _.value,
-      [`b-textarea__input--${p.ERROR}`]: T.value,
-      "b-textarea__input--dynamic-height": L.value
-    })), oe = s(() => ({
-      "b-textarea__label-box--no-label": !a.label
-    })), re = s(() => ({
-      [`b-textarea__label-item--${p.ERROR}`]: B.value
-    })), se = s(() => H("yourTextCanBenAtMost", { characterLimit: a.characterLimit })), ie = u(ee["aria-label"]), { ariaLabel: ue, label: k } = W(a), ne = Ie({
-      ariaLabel: ie.value,
-      // TODO: take this line away when the aria-label props is removed
-      label: ue,
-      defaultFallback: k
-    }), de = s(
-      () => a.clearable && r.value && !a.disabled && !_.value
-    ), U = () => {
-      r.value = "", i(n.CLEAR), N("");
-    }, ce = (e) => {
-      e.stopImmediatePropagation(), !a.disabled && !_.value && (r.value = e.target.value, N(r.value));
-    }, pe = () => {
-      o.value.scrollTop = 0, i(n.BLUR);
-    }, me = () => {
-      o.value.focus(), i(n.FOCUS);
-    }, fe = () => {
-      i(n.CHANGE);
-    }, ve = () => {
-      i(n.ESCAPE_PRESSED);
-    }, be = (e) => {
-      e.stopPropagation(), i(n.KEYDOWN, e);
-    }, he = (e) => {
-      e.stopPropagation(), i(n.KEYUP, e);
-    }, ye = () => {
-      A.value = !0;
-    }, ge = () => {
-      A.value = !1;
-    }, q = (e = !1) => {
-      var V;
-      const b = o.value.style.width;
-      if (o.value.style.height && (A.value && (P.value = parseInt(o.value.style.height, 10)), v.value = o.value.style.height), e && !b)
-        return;
-      const _e = (V = m == null ? void 0 : m.value) == null ? void 0 : V.offsetWidth;
-      !b || parseInt(b, 10) > _e ? R.value = "100%" : R.value = b;
-    };
-    return Q({
-      focus: () => {
-        o.value.focus();
-      }
-    }), Re(() => {
-      y = X(o.value, () => {
-        q(!0);
-      }), g = X(m.value, () => {
-        q();
-      }), L.value && D(), a.value && De(
-        'BentoTextarea "value" property',
-        `The use of "value" prop in "BentoTextarea" is no longer supported.
-                Use the "v-model" or "model-value" property instead.`,
-        "2.0.0"
-      );
-    }), Ae(() => {
-      y == null || y.disconnect(), g == null || g.disconnect();
-    }), (e, b) => (d(), $("div", {
-      ref_key: "textareaComponent",
-      ref: m,
-      class: E(["b-textarea", te.value])
-    }, [
-      M("div", {
-        style: z({ width: R.value })
-      }, [
-        M("div", {
-          class: E(["b-textarea__label-box", oe.value])
-        }, [
-          l(k) ? (d(), h(l(Oe), {
-            key: 0,
-            for: l(O),
-            label: l(k),
-            "tooltip-text": e.tooltipText,
-            optional: e.optional,
-            required: e.required
-          }, null, 8, ["for", "label", "tooltip-text", "optional", "required"])) : c("", !0),
-          e.characterLimit ? (d(), h(l(F), {
-            key: 1,
-            el: "span",
-            class: E(["b-textarea__label-item", re.value])
-          }, {
-            default: x(() => [
-              Y(G(ae.value), 1)
-            ]),
-            _: 1
-          }, 8, ["class"])) : c("", !0)
-        ], 2),
-        S(l(F), {
-          el: "div",
-          class: "b-textarea__input-box",
-          "aria-disabled": e.disabled
-        }, {
-          default: x(() => [
-            M("textarea", {
-              id: l(O),
-              ref_key: "textareaElement",
-              ref: o,
-              value: r.value,
-              class: E(["b-textarea__input", le.value]),
-              "aria-label": l(ne),
-              "aria-invalid": T.value,
-              readonly: l(_),
-              required: e.required,
-              "aria-required": e.required,
-              disabled: e.disabled,
-              placeholder: e.placeholder,
-              style: z({ resize: e.resizable, height: v.value }),
-              onBlur: pe,
-              onChange: fe,
-              onFocus: me,
-              onInput: ce,
-              onKeydown: [
-                w(ve, ["esc"]),
-                be
-              ],
-              onKeyup: he,
-              onMousedown: ye,
-              onMouseup: ge
-            }, "                ", 46, He),
-            de.value ? (d(), $("div", Ke, [
-              S(l(Be), {
-                variant: "tertiary",
-                disabled: e.disabled,
-                onClick: U,
-                onKeypress: w(U, ["enter"]),
-                onKeyup: w(U, ["space"])
-              }, {
-                iconLeft: x(() => [
-                  S(l(ke), {
-                    "svg-title": l(H)("clearText")
-                  }, null, 8, ["svg-title"])
-                ]),
-                _: 1
-              }, 8, ["disabled"])
-            ])) : c("", !0)
-          ]),
-          _: 1
-        }, 8, ["aria-disabled"]),
-        B.value ? (d(), h(l(j), {
-          key: 0,
-          "error-message": se.value
-        }, null, 8, ["error-message"])) : c("", !0),
-        e.errorMessage ? (d(), h(l(j), {
-          key: 1,
-          "error-message": e.errorMessage
-        }, null, 8, ["error-message"])) : c("", !0),
-        e.description ? (d(), h(l(F), {
-          key: 2,
-          class: "b-textarea__description",
-          el: "span"
-        }, {
-          default: x(() => [
-            Y(G(e.description), 1)
-          ]),
-          _: 1
-        })) : c("", !0)
-      ], 4)
-    ], 2));
-  }
-}), la = /* @__PURE__ */ Pe(qe, [["__scopeId", "data-v-36a2792c"]]);
-export {
-  la as B
-};
-//# sourceMappingURL=textarea.CvI2InIB.js.map