@adyen/bento-vue2 1.56.2 → 1.57.0

package/dist/chunks/index.48Mn1OCp.js

@@ -1,387 +0,0 @@
-import "./index.Cl4_42j5.js";
-import { onMounted as T, nextTick as M, watch as O, unref as $, getCurrentScope as I, onScopeDispose as R, getCurrentInstance as N, ref as v, computed as p, watchEffect as j } from "vue";
-function x(e) {
-  return I() ? (R(e), !0) : !1;
-}
-function w(e) {
-  return typeof e == "function" ? e() : $(e);
-}
-const L = typeof window < "u" && typeof document < "u";
-typeof WorkerGlobalScope < "u" && globalThis instanceof WorkerGlobalScope;
-const C = (e) => e != null, P = Object.prototype.toString, B = (e) => P.call(e) === "[object Object]", W = () => {
-};
-function z(e, t) {
-  function n(...o) {
-    return new Promise((s, i) => {
-      Promise.resolve(e(() => t.apply(this, o), { fn: t, thisArg: this, args: o })).then(s).catch(i);
-    });
-  }
-  return n;
-}
-const F = (e) => e();
-function V(e, t = {}) {
-  let n, o, s = W;
-  const i = (c) => {
-    clearTimeout(c), s(), s = W;
-  };
-  return (c) => {
-    const d = w(e), a = w(t.maxWait);
-    return n && i(n), d <= 0 || a !== void 0 && a <= 0 ? (o && (i(o), o = null), Promise.resolve(c())) : new Promise((r, u) => {
-      s = t.rejectOnCancel ? u : r, a && !o && (o = setTimeout(() => {
-        n && i(n), o = null, r(c());
-      }, a)), n = setTimeout(() => {
-        o && i(o), o = null, r(c());
-      }, d);
-    });
-  };
-}
-function H(e, t) {
-  var n;
-  if (typeof e == "number")
-    return e + t;
-  const o = ((n = e.match(/^-?\d+\.?\d*/)) == null ? void 0 : n[0]) || "", s = e.slice(o.length), i = Number.parseFloat(o) + t;
-  return Number.isNaN(i) ? e : i + s;
-}
-function D(e) {
-  return N();
-}
-function G(e, t, n = {}) {
-  const {
-    eventFilter: o = F,
-    ...s
-  } = n;
-  return O(
-    e,
-    z(
-      o,
-      t
-    ),
-    s
-  );
-}
-function _(e, t = !0, n) {
-  D() ? T(e, n) : t ? e() : M(e);
-}
-function ee(e, t, n = {}) {
-  const {
-    debounce: o = 0,
-    maxWait: s = void 0,
-    ...i
-  } = n;
-  return G(
-    e,
-    t,
-    {
-      ...i,
-      eventFilter: V(o, { maxWait: s })
-    }
-  );
-}
-const m = L ? window : void 0;
-function b(e) {
-  var t;
-  const n = w(e);
-  return (t = n == null ? void 0 : n.$el) != null ? t : n;
-}
-function g(...e) {
-  let t, n, o, s;
-  if (typeof e[0] == "string" || Array.isArray(e[0]) ? ([n, o, s] = e, t = m) : [t, n, o, s] = e, !t)
-    return W;
-  Array.isArray(n) || (n = [n]), Array.isArray(o) || (o = [o]);
-  const i = [], l = () => {
-    i.forEach((r) => r()), i.length = 0;
-  }, c = (r, u, f, h) => (r.addEventListener(u, f, h), () => r.removeEventListener(u, f, h)), d = O(
-    () => [b(t), w(s)],
-    ([r, u]) => {
-      if (l(), !r)
-        return;
-      const f = B(u) ? { ...u } : u;
-      i.push(
-        ...n.flatMap((h) => o.map((y) => c(r, h, y, f)))
-      );
-    },
-    { immediate: !0, flush: "post" }
-  ), a = () => {
-    d(), l();
-  };
-  return x(a), a;
-}
-function U(e) {
-  return typeof e == "function" ? e : typeof e == "string" ? (t) => t.key === e : Array.isArray(e) ? (t) => e.includes(t.key) : () => !0;
-}
-function te(...e) {
-  let t, n, o = {};
-  e.length === 3 ? (t = e[0], n = e[1], o = e[2]) : e.length === 2 ? typeof e[1] == "object" ? (t = !0, n = e[0], o = e[1]) : (t = e[0], n = e[1]) : (t = !0, n = e[0]);
-  const {
-    target: s = m,
-    eventName: i = "keydown",
-    passive: l = !1,
-    dedupe: c = !1
-  } = o, d = U(t);
-  return g(s, i, (r) => {
-    r.repeat && w(c) || d(r) && n(r);
-  }, l);
-}
-function Y() {
-  const e = v(!1);
-  return N() && T(() => {
-    e.value = !0;
-  }, void 0), e;
-}
-function A(e) {
-  const t = Y();
-  return p(() => (t.value, !!e()));
-}
-function q(e, t, n = {}) {
-  const { window: o = m, ...s } = n;
-  let i;
-  const l = A(() => o && "MutationObserver" in o), c = () => {
-    i && (i.disconnect(), i = void 0);
-  }, d = p(() => {
-    const f = w(e), h = (Array.isArray(f) ? f : [f]).map(b).filter(C);
-    return new Set(h);
-  }), a = O(
-    () => d.value,
-    (f) => {
-      c(), l.value && f.size && (i = new MutationObserver(t), f.forEach((h) => i.observe(h, s)));
-    },
-    { immediate: !0, flush: "post" }
-  ), r = () => i == null ? void 0 : i.takeRecords(), u = () => {
-    a(), c();
-  };
-  return x(u), {
-    isSupported: l,
-    stop: u,
-    takeRecords: r
-  };
-}
-function X(e = {}) {
-  var t;
-  const {
-    window: n = m,
-    deep: o = !0,
-    triggerOnRemoval: s = !1
-  } = e, i = (t = e.document) != null ? t : n == null ? void 0 : n.document, l = () => {
-    var a;
-    let r = i == null ? void 0 : i.activeElement;
-    if (o)
-      for (; r != null && r.shadowRoot; )
-        r = (a = r == null ? void 0 : r.shadowRoot) == null ? void 0 : a.activeElement;
-    return r;
-  }, c = v(), d = () => {
-    c.value = l();
-  };
-  return n && (g(n, "blur", (a) => {
-    a.relatedTarget === null && d();
-  }, !0), g(n, "focus", d, !0)), s && q(i, (a) => {
-    a.filter((r) => r.removedNodes.length).map((r) => Array.from(r.removedNodes)).flat().forEach((r) => {
-      r === c.value && d();
-    });
-  }, {
-    childList: !0,
-    subtree: !0
-  }), d(), c;
-}
-function E(e, t = {}) {
-  const { window: n = m } = t, o = A(() => n && "matchMedia" in n && typeof n.matchMedia == "function");
-  let s;
-  const i = v(!1), l = (a) => {
-    i.value = a.matches;
-  }, c = () => {
-    s && ("removeEventListener" in s ? s.removeEventListener("change", l) : s.removeListener(l));
-  }, d = j(() => {
-    o.value && (c(), s = n.matchMedia(w(e)), "addEventListener" in s ? s.addEventListener("change", l) : s.addListener(l), i.value = s.matches);
-  });
-  return x(() => {
-    d(), c(), s = void 0;
-  }), i;
-}
-function ne(e, t = {}) {
-  function n(r, u) {
-    let f = w(e[w(r)]);
-    return u != null && (f = H(f, u)), typeof f == "number" && (f = `${f}px`), f;
-  }
-  const { window: o = m, strategy: s = "min-width" } = t;
-  function i(r) {
-    return o ? o.matchMedia(r).matches : !1;
-  }
-  const l = (r) => E(() => `(min-width: ${n(r)})`, t), c = (r) => E(() => `(max-width: ${n(r)})`, t), d = Object.keys(e).reduce((r, u) => (Object.defineProperty(r, u, {
-    get: () => s === "min-width" ? l(u) : c(u),
-    enumerable: !0,
-    configurable: !0
-  }), r), {});
-  function a() {
-    const r = Object.keys(e).map((u) => [u, l(u)]);
-    return p(() => r.filter(([, u]) => u.value).map(([u]) => u));
-  }
-  return Object.assign(d, {
-    greaterOrEqual: l,
-    smallerOrEqual: c,
-    greater(r) {
-      return E(() => `(min-width: ${n(r, 0.1)})`, t);
-    },
-    smaller(r) {
-      return E(() => `(max-width: ${n(r, -0.1)})`, t);
-    },
-    between(r, u) {
-      return E(() => `(min-width: ${n(r)}) and (max-width: ${n(u, -0.1)})`, t);
-    },
-    isGreater(r) {
-      return i(`(min-width: ${n(r, 0.1)})`);
-    },
-    isGreaterOrEqual(r) {
-      return i(`(min-width: ${n(r)})`);
-    },
-    isSmaller(r) {
-      return i(`(max-width: ${n(r, -0.1)})`);
-    },
-    isSmallerOrEqual(r) {
-      return i(`(max-width: ${n(r)})`);
-    },
-    isInBetween(r, u) {
-      return i(`(min-width: ${n(r)}) and (max-width: ${n(u, -0.1)})`);
-    },
-    current: a,
-    active() {
-      const r = a();
-      return p(() => r.value.length === 0 ? "" : r.value.at(-1));
-    }
-  });
-}
-function k(e, t, n = {}) {
-  const { window: o = m, ...s } = n;
-  let i;
-  const l = A(() => o && "ResizeObserver" in o), c = () => {
-    i && (i.disconnect(), i = void 0);
-  }, d = p(() => {
-    const u = w(e);
-    return Array.isArray(u) ? u.map((f) => b(f)) : [b(u)];
-  }), a = O(
-    d,
-    (u) => {
-      if (c(), l.value && o) {
-        i = new ResizeObserver(t);
-        for (const f of u)
-          f && i.observe(f, s);
-      }
-    },
-    { immediate: !0, flush: "post" }
-  ), r = () => {
-    c(), a();
-  };
-  return x(r), {
-    isSupported: l,
-    stop: r
-  };
-}
-function re(e, t = { width: 0, height: 0 }, n = {}) {
-  const { window: o = m, box: s = "content-box" } = n, i = p(() => {
-    var u, f;
-    return (f = (u = b(e)) == null ? void 0 : u.namespaceURI) == null ? void 0 : f.includes("svg");
-  }), l = v(t.width), c = v(t.height), { stop: d } = k(
-    e,
-    ([u]) => {
-      const f = s === "border-box" ? u.borderBoxSize : s === "content-box" ? u.contentBoxSize : u.devicePixelContentBoxSize;
-      if (o && i.value) {
-        const h = b(e);
-        if (h) {
-          const y = h.getBoundingClientRect();
-          l.value = y.width, c.value = y.height;
-        }
-      } else if (f) {
-        const h = Array.isArray(f) ? f : [f];
-        l.value = h.reduce((y, { inlineSize: S }) => y + S, 0), c.value = h.reduce((y, { blockSize: S }) => y + S, 0);
-      } else
-        l.value = u.contentRect.width, c.value = u.contentRect.height;
-    },
-    n
-  );
-  _(() => {
-    const u = b(e);
-    u && (l.value = "offsetWidth" in u ? u.offsetWidth : t.width, c.value = "offsetHeight" in u ? u.offsetHeight : t.height);
-  });
-  const a = O(
-    () => b(e),
-    (u) => {
-      l.value = u ? t.width : 0, c.value = u ? t.height : 0;
-    }
-  );
-  function r() {
-    d(), a();
-  }
-  return {
-    width: l,
-    height: c,
-    stop: r
-  };
-}
-const K = "focusin", Q = "focusout";
-function oe(e, t = {}) {
-  const { window: n = m } = t, o = p(() => b(e)), s = v(!1), i = p(() => s.value), l = X(t);
-  return !n || !l.value ? { focused: i } : (g(o, K, () => s.value = !0), g(o, Q, () => s.value = !1), { focused: i });
-}
-function ie(e = {}) {
-  const { window: t = m, behavior: n = "auto" } = e;
-  if (!t)
-    return {
-      x: v(0),
-      y: v(0)
-    };
-  const o = v(t.scrollX), s = v(t.scrollY), i = p({
-    get() {
-      return o.value;
-    },
-    set(c) {
-      scrollTo({ left: c, behavior: n });
-    }
-  }), l = p({
-    get() {
-      return s.value;
-    },
-    set(c) {
-      scrollTo({ top: c, behavior: n });
-    }
-  });
-  return g(
-    t,
-    "scroll",
-    () => {
-      o.value = t.scrollX, s.value = t.scrollY;
-    },
-    {
-      capture: !1,
-      passive: !0
-    }
-  ), { x: i, y: l };
-}
-function ue(e = {}) {
-  const {
-    window: t = m,
-    initialWidth: n = Number.POSITIVE_INFINITY,
-    initialHeight: o = Number.POSITIVE_INFINITY,
-    listenOrientation: s = !0,
-    includeScrollbar: i = !0,
-    type: l = "inner"
-  } = e, c = v(n), d = v(o), a = () => {
-    t && (l === "outer" ? (c.value = t.outerWidth, d.value = t.outerHeight) : i ? (c.value = t.innerWidth, d.value = t.innerHeight) : (c.value = t.document.documentElement.clientWidth, d.value = t.document.documentElement.clientHeight));
-  };
-  if (a(), _(a), g("resize", a, { passive: !0 }), s) {
-    const r = E("(orientation: portrait)");
-    O(r, () => a());
-  }
-  return { width: c, height: d };
-}
-export {
-  re as a,
-  k as b,
-  ie as c,
-  oe as d,
-  E as e,
-  ne as f,
-  q as g,
-  X as h,
-  te as o,
-  ue as u,
-  ee as w
-};
-//# sourceMappingURL=index.48Mn1OCp.js.map

package/dist/chunks/inspector.types.Cloa1Rnz.js

@@ -1,105 +0,0 @@
-import { defineComponent as E, ref as r, computed as v, watch as I, nextTick as T } from "vue";
-import { d as w, B as k } from "./typography.J1v_SPG3.js";
-import { B as S } from "./button.D7K0uXQm.js";
-import { B as M } from "./loading-indicator.z8COalOc.js";
-import { B as L, s as z, g as D, a as O, f as P } from "./focus-trap.DEHn1dxN.js";
-import { E as R } from "./expand.C263WARj.js";
-import { C as W } from "./cross.CJ5EEL2c.js";
-import { g as $ } from "./generate-uid.NJ8tVoha.js";
-import { u as A } from "./i18n.BQkEbtPM.js";
-import { a as K, b as N } from "./index.48Mn1OCp.js";
-import { n as U } from "./_plugin-vue2_normalizer.CeySl7Fu.js";
-import "../assets/inspector.css";
-const j = {
-  "en-US": {
-    close: "Close",
-    expand: "Expand",
-    inspector: "Inspector",
-    returnToMainContent: "Return to main content (Ctrl+Shift+S)",
-    returnToMainContentDescription: "You can use Ctrl + Shift + S to navigate between the inspector and page sections."
-  },
-  "ja-JP": {
-    close: "閉じる",
-    expand: "展開"
-  },
-  "pt-BR": {
-    close: "Fechar",
-    expand: "Expandir"
-  }
-}, q = { i18n: { messages: j } }, J = /* @__PURE__ */ E({
-  ...q,
-  __name: "inspector",
-  props: {
-    activePage: { default: "" },
-    expandable: { type: Boolean, default: !1 },
-    isOpen: { type: Boolean, default: !1 },
-    loading: { type: Boolean, default: !1 },
-    size: { default: "small" },
-    title: null
-  },
-  emits: ["update:is-open", "update:active-page", "expand"],
-  setup(_, { emit: n }) {
-    const t = _, { t: e } = A(), s = $("returnToMainContentDescription"), d = r(null), c = r(null), C = r(null), o = r(null), p = r(null), u = r(!1), { width: f } = K(d), m = v(() => {
-      const a = t.size === "small" ? 575 : 750;
-      return f.value > 0 && f.value <= a;
-    }), y = v(() => ({
-      [`b-inspector--${t.size}`]: !0,
-      "b-inspector--is-compact": m.value
-    })), h = v(() => `${e("inspector")}, ${t.title}`), g = async () => {
-      t.isOpen ? (o.value = document.activeElement, await T(), z(c.value, o.value)) : i(o.value);
-    }, B = (a) => {
-      if (u.value)
-        return;
-      const l = a.shiftKey ? -1 : 1, F = D(l, c.value);
-      O() === F && (a.preventDefault(), p.value = document.activeElement, i(o.value), n("update:active-page", void 0));
-    }, x = (a) => {
-      const l = a.shiftKey && a.ctrlKey && a.key === "S";
-      t.isOpen && !u.value && l && b();
-    }, b = () => {
-      P(c.value) ? (p.value = document.activeElement, i(o.value), n("update:active-page", void 0)) : (o.value = document.activeElement, i(p.value));
-    }, i = (a) => {
-      a && (a == null || a.focus(), document.activeElement !== a && i(a.parentElement));
-    };
-    return I(
-      () => t.activePage,
-      () => {
-        t.activePage && g();
-      }
-    ), N(c, (a) => {
-      const l = a[0];
-      u.value = d.value.clientWidth === l.contentRect.width;
-    }), t.activePage || w(
-      'BentoInspector "active-page" as optional',
-      `Make sure to set the "active-page" prop and keep it in sync with "update:active-page".
-            "active-page" prop will be required in the next version`,
-      "2.0.0"
-    ), { __sfc: !0, props: t, emit: n, t: e, returnToMainContentDescriptionId: s, wrapper: d, inspector: c, page: C, pageLastFocusedElement: o, inspectorLastFocusedElement: p, isFullWidthInspector: u, wrapperWidth: f, isCompact: m, conditionalClass: y, inspectorAriaLabel: h, setFocus: g, handleTabNavigation: B, handleSectionFocus: x, moveFocusBetweenSections: b, focusElement: i, BentoTypography: k, BentoButton: S, BentoLoadingIndicator: M, BentoFocusTrap: L, ExpandIcon: R, CrossIcon: W };
-  }
-});
-var Y = function() {
-  var n = this, t = n._self._c, e = n._self._setupProxy;
-  return t("div", { ref: "wrapper", staticClass: "b-inspector", class: e.conditionalClass, on: { keydown: e.handleSectionFocus } }, [t("div", { ref: "page", staticClass: "b-inspector__page-wrapper" }, [t("div", { staticClass: "b-inspector__page" }, [n._t("page")], 2)]), t("Transition", { attrs: { name: "b-inspector__animation", mode: "out-in" }, on: { "before-enter": e.setFocus, "after-leave": e.setFocus } }, [n.isOpen ? t("aside", { ref: "inspector", staticClass: "b-inspector__container-wrapper", attrs: { "aria-label": e.inspectorAriaLabel }, on: { keydown: function(s) {
-    return !s.type.indexOf("key") && n._k(s.keyCode, "tab", 9, s.key, "Tab") ? null : e.handleTabNavigation.apply(null, arguments);
-  } } }, [t(e.BentoFocusTrap, { attrs: { disabled: !e.isFullWidthInspector } }, [t("div", { staticClass: "b-inspector__container" }, [t("div", { staticClass: "b-inspector__header" }, [e.isFullWidthInspector ? n._e() : [t(e.BentoButton, { staticClass: "b-inspector__return-content", attrs: { variant: "secondary", condensed: "", "aria-describedby": e.returnToMainContentDescriptionId }, on: { click: e.moveFocusBetweenSections } }, [n._v(" " + n._s(e.t("returnToMainContent")) + " ")]), t("span", { staticClass: "b-inspector__return-content-description", attrs: { id: e.returnToMainContentDescriptionId } }, [n._v(n._s(e.t("returnToMainContentDescription")))])], t(e.BentoTypography, { staticClass: "b-inspector__title", attrs: { el: "h2", variant: "title" } }, [n._v(" " + n._s(n.title) + " ")]), t("div", { staticClass: "b-inspector__icons" }, [n.expandable ? t(e.BentoButton, { attrs: { variant: "tertiary" }, on: { click: function(s) {
-    return e.emit("expand");
-  } }, scopedSlots: n._u([{ key: "iconLeft", fn: function() {
-    return [t(e.ExpandIcon, { attrs: { "svg-title": e.t("expand") } })];
-  }, proxy: !0 }], null, !1, 1210869445) }) : n._e(), t(e.BentoButton, { attrs: { variant: "tertiary" }, on: { click: function(s) {
-    return e.emit("update:is-open", !1);
-  } }, scopedSlots: n._u([{ key: "iconLeft", fn: function() {
-    return [t(e.CrossIcon, { attrs: { "svg-title": e.t("close") } })];
-  }, proxy: !0 }], null, !1, 858730413) })], 1)], 2), t("div", { staticClass: "b-inspector__content" }, [n.loading ? t(e.BentoLoadingIndicator, { staticClass: "b-inspector__loading-indicator", attrs: { large: "" } }) : n._t("content")], 2)])])], 1) : n._e()])], 1);
-}, G = [], H = /* @__PURE__ */ U(
-  J,
-  Y,
-  G,
-  !1,
-  null,
-  "91016e89"
-);
-const rt = H.exports, ct = ["small", "large"];
-export {
-  ct as B,
-  rt as i
-};
-//# sourceMappingURL=inspector.types.Cloa1Rnz.js.map

package/dist/chunks/inspector.types.Cloa1Rnz.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"inspector.types.Cloa1Rnz.js","sources":["../../src/components/inspector/inspector.vue","../../src/components/inspector/inspector.types.ts"],"sourcesContent":["<template>\n    <div ref=\"wrapper\" class=\"b-inspector\" :class=\"conditionalClass\" @keydown=\"handleSectionFocus\">\n        <div ref=\"page\" class=\"b-inspector__page-wrapper\">\n            <div class=\"b-inspector__page\">\n                <slot name=\"page\" />\n            </div>\n        </div>\n        <Transition name=\"b-inspector__animation\" mode=\"out-in\" @before-enter=\"setFocus\" @after-leave=\"setFocus\">\n            <aside\n                v-if=\"isOpen\"\n                ref=\"inspector\"\n                class=\"b-inspector__container-wrapper\"\n                :aria-label=\"inspectorAriaLabel\"\n                @keydown.tab=\"handleTabNavigation\"\n            >\n                <bento-focus-trap :disabled=\"!isFullWidthInspector\">\n                    <div class=\"b-inspector__container\">\n                        <div class=\"b-inspector__header\">\n                            <template v-if=\"!isFullWidthInspector\">\n                                <bento-button\n                                    class=\"b-inspector__return-content\"\n                                    variant=\"secondary\"\n                                    condensed\n                                    :aria-describedby=\"returnToMainContentDescriptionId\"\n                                    @click=\"moveFocusBetweenSections\"\n                                >\n                                    {{ t('returnToMainContent') }}\n                                </bento-button>\n                                <span\n                                    :id=\"returnToMainContentDescriptionId\"\n                                    class=\"b-inspector__return-content-description\"\n                                    >{{ t('returnToMainContentDescription') }}</span\n                                >\n                            </template>\n                            <bento-typography el=\"h2\" variant=\"title\" class=\"b-inspector__title\">\n                                {{ title }}\n                            </bento-typography>\n                            <div class=\"b-inspector__icons\">\n                                <bento-button v-if=\"expandable\" variant=\"tertiary\" @click=\"emit('expand')\">\n                                    <template #iconLeft><expand-icon :svg-title=\"t('expand')\"></expand-icon></template>\n                                </bento-button>\n                                <bento-button variant=\"tertiary\" @click=\"emit('update:is-open', false)\">\n                                    <template #iconLeft><cross-icon :svg-title=\"t('close')\"></cross-icon></template>\n                                </bento-button>\n                            </div>\n                        </div>\n                        <div class=\"b-inspector__content\">\n                            <bento-loading-indicator v-if=\"loading\" large class=\"b-inspector__loading-indicator\" />\n                            <slot v-else name=\"content\" />\n                        </div>\n                    </div>\n                </bento-focus-trap>\n            </aside>\n        </Transition>\n    </div>\n</template>\n\n<script setup lang=\"ts\">\n    import { computed, nextTick, ref, watch } from 'vue';\n    import { BentoTypography } from '@/components/typography';\n    import { BentoButton } from '@/components/button';\n    import { BentoLoadingIndicator } from '@/components/loading-indicator';\n    import { BentoFocusTrap } from '@/components/focus-trap';\n    import ExpandIcon from '@adyen/ui-assets-icons-16/vue/expand';\n    import CrossIcon from '@adyen/ui-assets-icons-16/vue/cross';\n\n    import { generateUid } from '@/core/utils/ts';\n    import { useI18n } from '@/utils/ts/i18n';\n    import { deprecate } from '@/utils/ts/deprecate';\n    import { getNextFocusableElement } from '@/utils/ts/focus-trap.utils';\n    import { useElementSize, useResizeObserver } from '@vueuse/core';\n    import moveFocusInside, { focusInside, getActiveElement } from 'focus-lock';\n\n    import { BentoInspectorSize } from './inspector.types';\n    import messages from './messages.json';\n\n    type MessageSchema = (typeof messages)['en-US'];\n\n    const props = defineProps({\n  activePage: { default: '' },\n  expandable: { type: Boolean, default: false },\n  isOpen: { type: Boolean, default: false },\n  loading: { type: Boolean, default: false },\n  size: { default: 'small' },\n  title: null\n});\n\n    const emit = defineEmits([\"update:is-open\", \"update:active-page\", \"expand\"]);\n\n    const { t } = useI18n<{ message: MessageSchema }>({ messages });\n    const returnToMainContentDescriptionId = generateUid('returnToMainContentDescription');\n    const wrapper = ref<HTMLElement>(null);\n    const inspector = ref<HTMLElement>(null);\n    const page = ref<HTMLElement>(null);\n    const pageLastFocusedElement = ref<HTMLElement>(null);\n    const inspectorLastFocusedElement = ref<HTMLElement>(null);\n    const isFullWidthInspector = ref(false);\n\n    const { width: wrapperWidth } = useElementSize(wrapper);\n\n    const isCompact = computed(() => {\n        const threshold = props.size === 'small' ? 575 : 750;\n        return wrapperWidth.value > 0 && wrapperWidth.value <= threshold;\n    });\n\n    const conditionalClass = computed(() => ({\n        [`b-inspector--${props.size}`]: true,\n        [`b-inspector--is-compact`]: isCompact.value,\n    }));\n\n    const inspectorAriaLabel = computed(() => `${t('inspector')}, ${props.title}`);\n\n    const setFocus = async () => {\n        if (props.isOpen) {\n            pageLastFocusedElement.value = document.activeElement as HTMLElement;\n            await nextTick();\n            moveFocusInside(inspector.value, pageLastFocusedElement.value);\n        } else {\n            // This doesn't work with data grid cell actions, as the button gets destroyed once is not being hovered.\n            // To be reviewed after LevelAccess revision\n            focusElement(pageLastFocusedElement.value);\n        }\n    };\n\n    const handleTabNavigation = event => {\n        if (isFullWidthInspector.value) {\n            return;\n        }\n        const direction = event.shiftKey ? -1 : 1;\n        const focusableEl = getNextFocusableElement(direction, inspector.value);\n        // If the nextfocusableEl is the same as the activeElement that means it's the last focusable element\n        // inside the inspector, so the focus is moved back to the last focused element on the page\n        if (getActiveElement() === focusableEl) {\n            event.preventDefault();\n            inspectorLastFocusedElement.value = document.activeElement as HTMLElement;\n            focusElement(pageLastFocusedElement.value);\n            // Set active-page as undefined when focus is not on page\n            emit('update:active-page', undefined);\n        }\n    };\n\n    const handleSectionFocus = event => {\n        const sectionShortcut = event.shiftKey && event.ctrlKey && event.key === 'S';\n        if (props.isOpen && !isFullWidthInspector.value && sectionShortcut) {\n            moveFocusBetweenSections();\n        }\n    };\n\n    const moveFocusBetweenSections = () => {\n        if (focusInside(inspector.value)) {\n            inspectorLastFocusedElement.value = document.activeElement as HTMLElement;\n            focusElement(pageLastFocusedElement.value);\n            // Set active-page as undefined when focus is not on page\n            emit('update:active-page', undefined);\n        } else {\n            pageLastFocusedElement.value = document.activeElement as HTMLElement;\n            focusElement(inspectorLastFocusedElement.value);\n        }\n    };\n\n    const focusElement = (element: HTMLElement) => {\n        if (!element) {\n            return;\n        }\n        element?.focus();\n        if (document.activeElement !== element) {\n            focusElement(element.parentElement);\n        }\n    };\n\n    watch(\n        () => props.activePage,\n        () => {\n            if (props.activePage) {\n                setFocus();\n            }\n        }\n    );\n\n    useResizeObserver(inspector, entries => {\n        const entry = entries[0];\n\n        isFullWidthInspector.value = wrapper.value.clientWidth === entry.contentRect.width;\n    });\n\n    if (!props.activePage) {\n        deprecate(\n            'BentoInspector \"active-page\" as optional',\n            `Make sure to set the \"active-page\" prop and keep it in sync with \"update:active-page\".\n            \"active-page\" prop will be required in the next version`,\n            '2.0.0'\n        );\n    }\n</script>\n\n<script lang=\"ts\">\n    /**\n     * Inspector allows users to access additional information or details of an object/item. The inspector opens adjacent to the main content, pushing it aside to maintain visibility and accessibility to both the main content and inspector.\n     *\n     * @example\n     * import { BentoInspector } from '@adyen/bento-vue2';\n     *\n     * export default {\n     *     components: { BentoInspector },\n     *     template: `\n     *          <bento-inspector\n     *                  title=\"Inspector\"\n     *                  size=\"large\"\n     *                  :is-open=\"isOpen\"\n     *                  :active-page=\"activePage\"\n     *                  expandable\n     *                  @update:is-open=\"isOpen = $event\"\n     *                  @update:active-page=\"activePage = $event\"\n     *          >\n     *              <template #page>Content of the page</template>\n     *              <template #content>Content of the inspector</template>\n     *          </bento-inspector>\n     *     `\n     * }\n     */\n    export default { i18n: { messages } };\n</script>\n\n<style lang=\"scss\" scoped src=\"./inspector.scss\" />\n","export const BentoInspectorSizeOptions = ['small', 'large'] as const;\n\nexport type BentoInspectorSize = (typeof BentoInspectorSizeOptions)[number];\n"],"names":["__default__","messages","t","useI18n","returnToMainContentDescriptionId","generateUid","wrapper","ref","inspector","page","pageLastFocusedElement","inspectorLastFocusedElement","isFullWidthInspector","wrapperWidth","useElementSize","isCompact","computed","threshold","props","conditionalClass","inspectorAriaLabel","setFocus$1","nextTick","setFocus","focusElement","handleTabNavigation","event","direction","focusableEl","getNextFocusableElement","getActiveElement","emit","handleSectionFocus","sectionShortcut","moveFocusBetweenSections","focusInside","element","watch","useResizeObserver","entries","entry","deprecate","BentoInspectorSizeOptions"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;GA4NIA,IAAA,EAAA,MAAA,EAAA,UAAAC,EAAA,EAAA;;;;;;;;;;;;;iBAnIA,EAAA,GAAAC,EAAA,IAAAC,EAAA,GACAC,IAAAC,EAAA,gCAAA,GACAC,IAAAC,EAAA,IAAA,GACAC,IAAAD,EAAA,IAAA,GACAE,IAAAF,EAAA,IAAA,GACAG,IAAAH,EAAA,IAAA,GACAI,IAAAJ,EAAA,IAAA,GACAK,IAAAL,EAAA,EAAA,GAEA,EAAA,OAAAM,EAAA,IAAAC,EAAAR,CAAA,GAEAS,IAAAC,EAAA,MAAA;AACI,YAAAC,IAAAC,EAAA,SAAA,UAAA,MAAA;AACA,aAAAL,EAAA,QAAA,KAAAA,EAAA,SAAAI;AAAA,IAAuD,CAAA,GAG3DE,IAAAH,EAAA,OAAA;AAAA,MAAyC,CAAA,gBAAAE,EAAA,IAAA,EAAA,GAAA;AAAA,MACL,2BAAAH,EAAA;AAAA,IACO,EAAA,GAG3CK,IAAAJ,EAAA,MAAA,GAAAd,EAAA,WAAA,CAAA,KAAAgB,EAAA,KAAA,EAAA,GAEAG,IAAA,YAAA;AACI,MAAAH,EAAA,UACIR,EAAA,QAAA,SAAA,eACA,MAAAY,EAAA,GACAC,EAAAf,EAAA,OAAAE,EAAA,KAAA,KAIAc,EAAAd,EAAA,KAAA;AAAA,IACJ,GAGJe,IAAA,CAAAC,MAAA;AACI,UAAAd,EAAA;AACI;AAEJ,YAAAe,IAAAD,EAAA,WAAA,KAAA,GACAE,IAAAC,EAAAF,GAAAnB,EAAA,KAAA;AAGA,MAAAsB,EAAA,MAAAF,MACIF,EAAA,eAAA,GACAf,EAAA,QAAA,SAAA,eACAa,EAAAd,EAAA,KAAA,GAEAqB,EAAA,sBAAA,MAAA;AAAA,IACJ,GAGJC,IAAA,CAAAN,MAAA;AACI,YAAAO,IAAAP,EAAA,YAAAA,EAAA,WAAAA,EAAA,QAAA;AACA,MAAAR,EAAA,UAAA,CAAAN,EAAA,SAAAqB,KACIC,EAAA;AAAA,IACJ,GAGJA,IAAA,MAAA;AACI,MAAAC,EAAA3B,EAAA,KAAA,KACIG,EAAA,QAAA,SAAA,eACAa,EAAAd,EAAA,KAAA,GAEAqB,EAAA,sBAAA,MAAA,MAEArB,EAAA,QAAA,SAAA,eACAc,EAAAb,EAAA,KAAA;AAAA,IACJ,GAGJa,IAAA,CAAAY,MAAA;AACI,MAAAA,MAGAA,KAAA,QAAAA,EAAA,SACA,SAAA,kBAAAA,KACIZ,EAAAY,EAAA,aAAA;AAAA,IACJ;AAGJ,WAAAC;AAAA,MAAA,MAAAnB,EAAA;AAAA,MACgB,MAAA;AAER,QAAAA,EAAA,cACIG,EAAA;AAAA,MACJ;AAAA,IACJ,GAGJiB,EAAA9B,GAAA,CAAA+B,MAAA;AACI,YAAAC,IAAAD,EAAA,CAAA;AAEA,MAAA3B,EAAA,QAAAN,EAAA,MAAA,gBAAAkC,EAAA,YAAA;AAAA,IAA6E,CAAA,GAGjFtB,EAAA,cACIuB;AAAA,MAAA;AAAA,MACI;AAAA;AAAA,MACA;AAAA,IAEA;;;;;;;;;;;;;;;;;;;;;;;;sBC9LCC,KAAA,CAAA,SAAA,OAAA;"}

package/dist/chunks/link.BH3eB_7E.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"link.BH3eB_7E.js","sources":["../../../core/src/components/link/link.types.ts","../../../ui-assets/icons-16/dist/vue/external-link.vue","../../src/components/link/link.vue"],"sourcesContent":["/**\n * @deprecated for usage with properties since version 2.0. Use the string literal instead.\n */\nexport enum BentoLinkVariant {\n    DEFAULT = 'default',\n    QUIET = 'quiet',\n}\n\nexport interface LinkProps {\n    /**\n     * Disable the default typography for the component. Only use this when the component is inside another typography component.\n     */\n    disableTypography?: boolean;\n\n    /**\n     * Set the rendered link to a regular external anchor link and renders an external link icon.\n     */\n    external?: boolean;\n\n    /**\n     * Set to true if used inside a `BentoButton` component.\n     */\n    isButton?: boolean;\n\n    /**\n     * Set the rendered link to a regular external anchor link.\n     */\n    isNotRouting?: boolean;\n\n    /**\n     * Sets the target of the rendered link.\n     */\n    target?: string;\n\n    /**\n     * Set to true to truncate link. Doesn't work with disableTypography.\n     */\n    truncate?: boolean;\n\n    /**\n     * Link variant type affecting visual style.\n     * @values default, quiet\n     */\n    variant?: BentoLinkVariant | `${BentoLinkVariant}`;\n}\n","\n<template>\n    <svg role=\"img\" v-bind=\"$attrs\" class=\"ui-assets-icons-16\" xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" fill=\"none\"><title v-if=\"$attrs['svg-title']\">{{ $attrs['svg-title'] }}</title><path fill=\"#00112C\" d=\"M2.93933 11.9999L10.1893 4.74989H5.24999V3.24989H12.75V10.7499H11.25V5.81055L3.99999 13.0605L2.93933 11.9999Z\"/></svg>\n</template>\n<script>\n    import '../css/main.css';\n\n    let uuid = 0;\n\n    export default {\n        beforeCreate() {\n            this.uuid = uuid.toString();\n            uuid += 1;\n        },\n    };\n</script>\n","<template>\n    <a\n        v-if=\"external || isNotRouting\"\n        :class=\"conditionalClasses\"\n        v-bind=\"$attrs\"\n        :aria-describedby=\"externalLinkId\"\n        :href=\"$props.to.toString()\"\n        :title=\"getAttributeTitle($attrs.title)\"\n        :target=\"computedTarget\"\n        @click=\"onClick\"\n    >\n        <bento-typography v-if=\"!disableTypography\" class=\"b-link__text\" el=\"span\" variant=\"body\">\n            <slot />\n        </bento-typography>\n        <slot v-else />\n        <span v-if=\"showExternalLinkIcon\" aria-hidden=\"true\" class=\"b-link__external-link-icon\">\n            <external-link-icon />\n        </span>\n        <span v-if=\"external\" :id=\"externalLinkId\" class=\"b-link--visually-hidden\">{{ t('opensInNewTab') }}</span>\n    </a>\n    <router-link\n        v-else\n        v-bind=\"{ ...$attrs, ...$props }\"\n        :class=\"conditionalClasses\"\n        :target=\"target\"\n        :to=\"props.to\"\n        custom\n        @click.native=\"onClick\"\n    >\n        <bento-typography v-if=\"!disableTypography\" class=\"b-link__text\" el=\"span\" variant=\"body\">\n            <slot />\n        </bento-typography>\n        <slot v-else />\n    </router-link>\n</template>\n\n<script setup lang=\"ts\">\n    import { RouterLink } from 'vue-router';\n    import { computed } from 'vue';\n    import { generateUid } from '@/core/utils/ts';\n    import { BentoTypography } from '@/components/typography';\n    import { BentoLinkVariant } from '@/core/components/link/link.types';\n    import { useI18n } from '@/utils/ts/i18n';\n    import type { RouterLinkSlotArgument } from 'vue-router/types/router.d.ts';\n    import ExternalLinkIcon from '@adyen/ui-assets-icons-16/vue/external-link';\n    import type { BentoLinkProps } from './link.types';\n    import messages from './messages.json';\n\n    type MessageSchema = (typeof messages)['en-US'];\n\n    const { t } = useI18n<{ message: MessageSchema }>({ messages });\n\n    const props = defineProps({\n  to: null,\n  replace: { type: Boolean },\n  append: { type: Boolean },\n  tag: null,\n  activeClass: null,\n  exact: { type: Boolean },\n  exactPath: { type: Boolean },\n  exactPathActiveClass: null,\n  event: null,\n  exactActiveClass: null,\n  ariaCurrentValue: null,\n  disableTypography: { type: Boolean },\n  external: { type: Boolean },\n  isButton: { type: Boolean },\n  isNotRouting: { type: Boolean },\n  target: { default: null },\n  truncate: { type: Boolean },\n  variant: { default: BentoLinkVariant.DEFAULT }\n});\n\n    const externalLinkId = generateUid('external-link');\n\n    const getAttributeTitle = (attributesTitle: unknown) => attributesTitle as string;\n\n    const conditionalClasses = computed(() => ({\n        'b-link': !props.isButton,\n        [`b-link--${BentoLinkVariant.QUIET}`]: props.variant === BentoLinkVariant.QUIET,\n        [`b-link--truncate`]: props.truncate,\n    }));\n\n    const computedTarget = computed(() => (props.external ? (props.target ?? '_blank') : props.target));\n    const showExternalLinkIcon = computed(() => !(props.isButton || props.isNotRouting));\n\n    const emit = defineEmits([\"click\"]);\n\n    const onClick = (e: MouseEvent, navigateCallback?: RouterLinkSlotArgument['navigate']) => {\n        emit('click', e);\n        if (navigateCallback) {\n            navigateCallback();\n        }\n    };\n</script>\n\n<script lang=\"ts\">\n    /**\n     * Extends the `router-link` from the `vue-router` NPM package.\n     *\n     * @example\n     * import { BentoLink } from '@adyen/bento-vue2';\n     *\n     * export default {\n     *     components: { BentoLink },\n     *     template: `\n     *       <bento-link to=\"/\">\n     *           link\n     *       </bento-link>\n     *     `\n     * }\n     */\n    export default {\n        name: 'bento-link',\n        inheritAttrs: false,\n        i18n: { messages },\n    };\n</script>\n\n<style lang=\"scss\" scoped src=\"@/core/components/link/link.scss\" />\n"],"names":["BentoLinkVariant","BentoLinkVariant2","uuid","_sfc_main$1","__default__","messages","t","useI18n","externalLinkId","generateUid","getAttributeTitle","attributesTitle","conditionalClasses","computed","props","computedTarget","showExternalLinkIcon","e","navigateCallback","emit"],"mappings":";;;;;;;;AAGY,IAAAA,IAAA,kBAAAC,OACRA,EAAA,UAAA,WACAA,EAAA,QAAA,SAFQA,IAAAD,KAAA,CAAA,CAAA;ACIZ,IAAAE,IAAA;AAEA,MAAAC,IAAA;AAAA,EACA,eAAA;AACA,SAAA,OAAAD,EAAA,SAAA,GACAA,KAAA;AAAA,EACA;AACA;;;;;;;;;;;;;;;;GCkGIE,IAAA;AAAA,EAAe,MAAA;AAAA,EACL,cAAA;AAAA,EACQ,MAAA,EAAA,UAAAC,EAAA;AAElB;;;;;;;;;;;;;;;;;;;;;;;;iBAlEA,EAAA,GAAAC,EAAA,IAAAC,EAAA,GAuBAC,IAAAC,EAAA,eAAA,GAEAC,IAAA,CAAAC,MAAAA,GAEAC,IAAAC,EAAA,OAAA;AAAA,MAA2C,UAAA,CAAAC,EAAA;AAAA,MACtB,CAAA,WAAAd,EAAA,KAAA,EAAA,GAAAc,EAAA,YAAAd,EAAA;AAAA,MACyD,oBAAAc,EAAA;AAAA,IAC9C,EAAA,GAGhCC,IAAAF,EAAA,MAAAC,EAAA,WAAAA,EAAA,UAAA,WAAAA,EAAA,MAAA,GACAE,IAAAH,EAAA,MAAA,EAAAC,EAAA,YAAAA,EAAA,aAAA;sKAIA,CAAAG,GAAAC,MAAA;AACI,MAAAC,EAAA,SAAAF,CAAA,GACAC,KACIA,EAAA;AAAA,IACJ;;;;;;;;;;;;;;;;;"}

package/dist/chunks/pagination.CX5fg6Ma.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"pagination.CX5fg6Ma.js","sources":["../../src/components/pagination/components/pagination-results-per-page/pagination-results-per-page.vue","../../src/components/pagination/components/pagination-context/pagination-context.vue","../../../ui-assets/icons-16/dist/vue/skip-left.vue","../../../ui-assets/icons-16/dist/vue/skip-right.vue","../../../ui-assets/icons-16/dist/vue/chevron-left-small.vue","../../../ui-assets/icons-16/dist/vue/chevron-right-small.vue","../../src/components/pagination/components/pagination-controls/pagination-controls.vue","../../src/components/pagination/pagination.vue"],"sourcesContent":["<template>\n    <div class=\"b-pagination-results-per-page\">\n        <bento-typography el=\"div\">\n            <component\n                :is=\"i18nComponent\"\n                v-bind=\"getI18nProps(translationPathKey)\"\n                class=\"b-pagination-results-per-page__dropdown-container\"\n                tag=\"div\"\n                :plural=\"totalCount\"\n            >\n                <template #itemCount>\n                    <bento-dropdown\n                        :id=\"dropdownId\"\n                        :aria-label=\"t(translationPathKey, { itemCount: itemsPerPage, totalCount })\"\n                        class=\"b-pagination-results-per-page__dropdown\"\n                        condensed\n                        :items=\"dropdownOptions\"\n                        :value=\"itemsPerPage\"\n                        @input=\"onSelectChange\"\n                    />\n                </template>\n                <template v-if=\"!!totalCount\" #totalCount>{{ totalCount }}</template>\n            </component>\n        </bento-typography>\n    </div>\n</template>\n\n<script setup lang=\"ts\">\n    import { computed, ref } from 'vue';\n    import { BentoTypography } from '@/components/typography';\n    import { BentoDropdown } from '@/components/dropdown';\n    import { generateUid } from '@/core/utils/ts';\n    import { getI18nComponent, getI18nProps, useI18n } from '@/utils/ts/i18n';\n\n    import messages from './messages.json';\n\n    type MessageSchema = (typeof messages)['en-US'];\n\n    const PREDEFINED_RESULTS_PER_PAGE_VALUES = [\n        { label: '10', value: 10 },\n        { label: '20', value: 20 },\n        { label: '50', value: 50 },\n        { label: '75', value: 75 },\n        { label: '100', value: 100 },\n    ];\n\n    const props = defineProps({\n  itemsPerPage: { default: 50 },\n  totalCount: { default: null }\n});\n\n    const emit = defineEmits([\"select\"]);\n\n    const { t } = useI18n<{ message: MessageSchema }>({ messages });\n    const dropdownId = generateUid('b-pagination-context-number-elements');\n    const dropdownOptions = ref(PREDEFINED_RESULTS_PER_PAGE_VALUES);\n    const i18nComponent = getI18nComponent();\n\n    const onSelectChange = (selectedNumberOfResults: number) => {\n        emit('select', selectedNumberOfResults);\n    };\n\n    const translationPathKey = computed(() => (props.totalCount ? 'showingItemsWithTotal' : 'showingItems'));\n</script>\n\n<script lang=\"ts\">\n    export default {\n        i18n: { messages },\n    };\n</script>\n\n<style lang=\"scss\" scoped src=\"./pagination-results-per-page.scss\" />\n","<template>\n    <div class=\"b-pagination-context\">\n        <bento-typography v-if=\"totalPages > 1\" el=\"div\">\n            <component :is=\"i18nComponent\" v-bind=\"getI18nProps('pageOfTotalPages')\" tag=\"div\">\n                <template #page>\n                    <bento-dropdown\n                        :id=\"dropdownId\"\n                        :aria-label=\"t('pageOfTotalPages', { page, totalPages })\"\n                        class=\"b-pagination-context__dropdown\"\n                        condensed\n                        :items=\"listOfAvailablePages\"\n                        :value=\"page\"\n                        :virtual-scroll=\"virtualScroll\"\n                        @input=\"onPageSelectChange\"\n                    />\n                </template>\n                <template #totalPages>{{ totalPages }}</template>\n            </component>\n        </bento-typography>\n        <bento-typography v-else-if=\"totalPages === 1\" el=\"span\">\n            {{ t('pageOneOfOne') }}\n        </bento-typography>\n        <bento-typography v-else el=\"span\">\n            {{ t('pageNumber', { page }) }}\n        </bento-typography>\n    </div>\n</template>\n\n<script setup lang=\"ts\">\n    import { computed } from 'vue';\n    import { BentoTypography } from '@/components/typography';\n    import { BentoDropdown } from '@/components/dropdown';\n    import { BentoListboxOptionItem } from '@/types';\n    import { generateUid } from '@/core/utils/ts';\n    import messages from './messages.json';\n    import { getI18nComponent, getI18nProps, useI18n } from '@/utils/ts/i18n';\n\n    type MessageSchema = (typeof messages)['en-US'];\n\n    const props = defineProps({\n  page: { default: 1 },\n  totalPages: { default: null },\n  virtualScroll: { type: Boolean, default: false }\n});\n    const emit = defineEmits([\"page-selected\"]);\n\n    const { t } = useI18n<{ message: MessageSchema }>({ messages });\n    const dropdownId = generateUid('bento-pagination-context-current-page');\n    const onPageSelectChange = (selectedPage: string | number) => emit('page-selected', selectedPage);\n    const i18nComponent = getI18nComponent();\n\n    // Generate a list of pages from 1 to \"totalPages\"\n    const transformIntoOption = (value: number): BentoListboxOptionItem => ({\n        label: value.toString(),\n        value,\n    });\n    const transformToPageNumber = (_, index) => index + 1;\n    const listOfAvailablePages = computed(() =>\n        Array.from(new Array(props.totalPages), transformToPageNumber).map(transformIntoOption)\n    );\n</script>\n\n<script lang=\"ts\">\n    export default {\n        i18n: { messages },\n    };\n</script>\n\n<style lang=\"scss\" scoped src=\"./pagination-context.scss\" />\n","\n<template>\n    <svg role=\"img\" v-bind=\"$attrs\" class=\"ui-assets-icons-16\" xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" fill=\"none\"><title v-if=\"$attrs['svg-title']\">{{ $attrs['svg-title'] }}</title><path fill=\"#00112C\" d=\"M9.06055 8.00011L12.0605 5.00011L10.9999 3.93945L6.93923 8.00011L10.9999 12.0608L12.0605 11.0001L9.06055 8.00011Z\"/><path fill=\"#00112C\" d=\"M4.25 4.25L4.25 11.75H5.75L5.75 4.25L4.25 4.25Z\"/></svg>\n</template>\n<script>\n    import '../css/main.css';\n\n    let uuid = 0;\n\n    export default {\n        beforeCreate() {\n            this.uuid = uuid.toString();\n            uuid += 1;\n        },\n    };\n</script>\n","\n<template>\n    <svg role=\"img\" v-bind=\"$attrs\" class=\"ui-assets-icons-16\" xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" fill=\"none\"><title v-if=\"$attrs['svg-title']\">{{ $attrs['svg-title'] }}</title><path fill=\"#00112C\" d=\"M6.93945 7.99962L3.93945 10.9996L5.00011 12.0603L9.06077 7.99963L5.00011 3.93896L3.93945 4.99963L6.93945 7.99962Z\"/><path fill=\"#00112C\" d=\"M11.75 11.7497V4.24974L10.25 4.24974V11.7497H11.75Z\"/></svg>\n</template>\n<script>\n    import '../css/main.css';\n\n    let uuid = 0;\n\n    export default {\n        beforeCreate() {\n            this.uuid = uuid.toString();\n            uuid += 1;\n        },\n    };\n</script>\n","\n<template>\n    <svg role=\"img\" v-bind=\"$attrs\" class=\"ui-assets-icons-16\" xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" fill=\"none\"><title v-if=\"$attrs['svg-title']\">{{ $attrs['svg-title'] }}</title><path fill=\"#00112C\" d=\"M10.5608 5.00011L7.56077 8.00011L10.5608 11.0001L9.50011 12.0608L5.43945 8.00011L9.50011 3.93945L10.5608 5.00011Z\"/></svg>\n</template>\n<script>\n    import '../css/main.css';\n\n    let uuid = 0;\n\n    export default {\n        beforeCreate() {\n            this.uuid = uuid.toString();\n            uuid += 1;\n        },\n    };\n</script>\n","\n<template>\n    <svg role=\"img\" v-bind=\"$attrs\" class=\"ui-assets-icons-16\" xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" fill=\"none\"><title v-if=\"$attrs['svg-title']\">{{ $attrs['svg-title'] }}</title><path fill=\"#00112C\" d=\"M5.43924 10.9999L8.43924 7.99989L5.43924 4.99989L6.4999 3.93923L10.5606 7.99989L6.4999 12.0605L5.43924 10.9999Z\"/></svg>\n</template>\n<script>\n    import '../css/main.css';\n\n    let uuid = 0;\n\n    export default {\n        beforeCreate() {\n            this.uuid = uuid.toString();\n            uuid += 1;\n        },\n    };\n</script>\n","<template>\n    <ul class=\"b-pagination-controls\">\n        <li class=\"b-pagination-controls__item\">\n            <!-- Navigate to the first page -->\n            <bento-button :disabled=\"isCurrentPageFirst\" variant=\"tertiary\" condensed @click=\"navigate(1)\">\n                <template #iconLeft>\n                    <skip-left :svg-title=\"t('navigateToTheFirstPage')\" />\n                </template>\n            </bento-button>\n        </li>\n        <li class=\"b-pagination-controls__item\">\n            <!-- Navigate to the previous page -->\n            <bento-button :disabled=\"isCurrentPageFirst\" variant=\"tertiary\" condensed @click=\"navigate(page - 1)\">\n                <template #iconLeft>\n                    <chevron-left :svg-title=\"t('navigateToThePreviousPage')\" />\n                </template>\n            </bento-button>\n        </li>\n        <li class=\"b-pagination-controls__item\">\n            <!-- Navigate to the next page -->\n            <bento-button :disabled=\"isNextButtonDisabled\" variant=\"tertiary\" condensed @click=\"navigate(page + 1)\">\n                <template #iconLeft>\n                    <chevron-right :svg-title=\"t('navigateToTheNextPage')\" />\n                </template>\n            </bento-button>\n        </li>\n        <li class=\"b-pagination-controls__item\">\n            <!-- Navigate to the last page -->\n            <bento-button\n                :disabled=\"isLastPageButtonDisabled\"\n                variant=\"tertiary\"\n                condensed\n                @click=\"navigate(totalPages)\"\n            >\n                <template #iconLeft>\n                    <skip-right :svg-title=\"t('navigateToTheLastPage')\" />\n                </template>\n            </bento-button>\n        </li>\n    </ul>\n</template>\n\n<script setup lang=\"ts\">\n    import { computed } from 'vue';\n    import { BentoButton } from '@/components/button';\n    import { useI18n } from '@/utils/ts/i18n';\n    import SkipLeft from '@adyen/ui-assets-icons-16/vue/skip-left';\n    import SkipRight from '@adyen/ui-assets-icons-16/vue/skip-right';\n    import ChevronLeft from '@adyen/ui-assets-icons-16/vue/chevron-left-small';\n    import ChevronRight from '@adyen/ui-assets-icons-16/vue/chevron-right-small';\n\n    import messages from './messages.json';\n\n    type MessageSchema = (typeof messages)['en-US'];\n\n    const props = defineProps({\n  hasNext: { type: Boolean, default: null },\n  page: null,\n  totalPages: { default: null }\n});\n\n    const emit = defineEmits([\"navigate\"]);\n\n    const { t } = useI18n<{ message: MessageSchema }>({ messages });\n\n    const isCurrentPageFirst = computed(() => props.page === 1);\n    const isCurrentPageLast = computed(() => props.page === props.totalPages);\n    const isNextButtonDisabled = computed(() => {\n        const hasNoNextPage = !props.hasNext;\n        return hasNoNextPage || isCurrentPageLast.value;\n    });\n    const isLastPageButtonDisabled = computed(() => {\n        const hasNoNextPage = !props.hasNext;\n        const hasNoTotalPagesNumber = !props.totalPages;\n\n        return hasNoNextPage || isCurrentPageLast.value || hasNoTotalPagesNumber;\n    });\n\n    const navigate = (pageArg: number) => {\n        emit('navigate', pageArg);\n    };\n</script>\n\n<script lang=\"ts\">\n    export default {\n        i18n: { messages },\n    };\n</script>\n\n<style lang=\"scss\" scoped src=\"./pagination-controls.scss\" />\n","<template>\n    <div class=\"b-pagination\">\n        <nav :aria-label=\"computedAriaLabel\" class=\"b-pagination__navigation\" :class=\"navigationConditionalClasses()\">\n            <bento-pagination-results-per-page\n                v-if=\"!hidePageSize\"\n                class=\"b-pagination__results-per-page\"\n                :items-per-page=\"size\"\n                :total-count=\"totalCount\"\n                @select=\"onItemsPerPageChange\"\n            />\n            <bento-typography v-else-if=\"hasSlot('default')\"><slot /></bento-typography>\n\n            <div class=\"b-pagination__page-navigator\">\n                <bento-pagination-context\n                    class=\"b-pagination__context\"\n                    :total-pages=\"totalPages\"\n                    :page=\"page\"\n                    :total-count=\"totalCount\"\n                    :virtual-scroll=\"virtualScroll\"\n                    @page-selected=\"onPageSelected\"\n                />\n\n                <div class=\"b-pagination__divider\"></div>\n\n                <bento-pagination-controls\n                    class=\"b-pagination__controls\"\n                    :has-next=\"hasNext\"\n                    :page=\"page\"\n                    :total-pages=\"totalPages\"\n                    @navigate=\"navigate\"\n                />\n            </div>\n        </nav>\n    </div>\n</template>\n\n<script setup lang=\"ts\">\n    import { computed, ref, toRefs, useAttrs, useSlots } from 'vue';\n    import { BentoTypography } from '@/components/typography';\n    import BentoPaginationResultsPerPage from './components/pagination-results-per-page/pagination-results-per-page.vue';\n    import BentoPaginationContext from './components/pagination-context/pagination-context.vue';\n    import BentoPaginationControls from './components/pagination-controls/pagination-controls.vue';\n    import { useAriaLabel } from '@/utils/ts/aria-label';\n    import { useHasSlot } from '@/composables';\n    import type { BentoPaginationProps } from './pagination.types';\n\n    const props = defineProps({\n  ariaLabel: { default: null },\n  hasNext: { type: Boolean, default: null },\n  hidePageSize: { type: Boolean, default: false },\n  page: { default: 1 },\n  size: { default: 20 },\n  totalCount: { default: null },\n  virtualScroll: { type: Boolean, default: false }\n});\n\n    const emit = defineEmits([\"navigate\", \"items-page\", \"update:page\", \"update:size\"]);\n\n    const slots = useSlots();\n    const hasSlot = useHasSlot(slots);\n\n    const attrs = useAttrs();\n    const ariaLabelAttribute = ref(attrs['aria-label']);\n    const { ariaLabel } = toRefs(props);\n    const computedAriaLabel = useAriaLabel({\n        ariaLabel: ariaLabelAttribute.value as string,\n        // TODO: take this line away when the aria-label props is removed\n        label: ariaLabel,\n    });\n\n    const totalPages = computed(() =>\n        !props.totalCount || !props.size ? null : Math.ceil(props.totalCount / props.size)\n    );\n\n    const navigate = (pageArg: number, itemsPerPage?: number) => {\n        if (props.hidePageSize) {\n            emit('navigate', pageArg);\n        } else {\n            emit('navigate', pageArg, itemsPerPage ?? props?.size);\n        }\n        emit('update:page', pageArg);\n    };\n\n    const onPageSelected = (pageNumber: number) => {\n        navigate(pageNumber);\n    };\n\n    const onItemsPerPageChange = (elements: number) => {\n        emit('items-page', elements);\n        emit('update:size', elements);\n\n        // Always go to first page when the\n        // number of items page changes\n        navigate(1, elements);\n    };\n\n    const navigationConditionalClasses = () => ({\n        'b-pagination__navigation--only-page-navigator': !hasSlot('default') && props.hidePageSize,\n    });\n</script>\n\n<script lang=\"ts\">\n    /**\n     * Paginiation component to help users page through data sets.\n     *\n     * There are two ways of doing navigation in this component:\n     *      1. (Basic) You tell the component if there is a next page (hasNext)\n     *      2. (Enhanced) You tell the component:\n     *          - How many total items exist (totalCount)\n     *          - The max number of items that you show/fetch per page (size)\n     *          - In this case you should not set the hasNext props\n     *\n     * If you have the data available and opt to use the Enhanced way you get extra controls:\n     *      - Page dropdown selector\n     *      - Last page button\n     *      - \"Showing 10 of 200 items\" text\n     *\n     * @usage\n     * import { BentoPagination } from '@adyen/bento-vue2';\n     *\n     * export default {\n     *     components: { BentoPagination },\n     *     template: `\n     *         <bento-pagination :has-next=\"isNextPage\" />\n     *     `,\n     * }\n     */\n\n    export default {};\n</script>\n\n<style lang=\"scss\" scoped src=\"./pagination.scss\" />\n"],"names":["__default__$3","messages$2","PREDEFINED_RESULTS_PER_PAGE_VALUES","t","useI18n","dropdownId","generateUid","dropdownOptions","ref","i18nComponent","getI18nComponent","onSelectChange","selectedNumberOfResults","emit","translationPathKey","computed","props","__default__$2","messages$1","onPageSelectChange","selectedPage","transformIntoOption","value","transformToPageNumber","_","index","listOfAvailablePages","uuid$3","_sfc_main$5","uuid$2","_sfc_main$4","uuid$1","_sfc_main$3","uuid","_sfc_main$2","__default__$1","messages","isCurrentPageFirst","isCurrentPageLast","isNextButtonDisabled","isLastPageButtonDisabled","hasNoNextPage","hasNoTotalPagesNumber","pageArg","__default__","slots","useSlots","hasSlot","useHasSlot","attrs","useAttrs","ariaLabelAttribute","ariaLabel","toRefs","computedAriaLabel","useAriaLabel","totalPages","navigate","itemsPerPage","pageNumber","elements"],"mappings":"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"}