@adyen/bento-vue2 1.26.0 → 1.28.0

package/dist/chunks/{fixed-scroller.4eb9a9ac.js → fixed-scroller.Bq1AgPnw.js}

@@ -1,9 +1,9 @@
-import { ref as r, onMounted as R, computed as f, defineComponent as x } from "vue";
-import { a as L } from "./button.9d6435ae.js";
-import { u as y } from "./i18n.eb5b985b.js";
-import { C, a as b } from "./chevron-left.5edf02ac.js";
-import { o as m } from "./resize.a041304d.js";
-import { n as W } from "./_plugin-vue2_normalizer.71e2aa87.js";
+import { ref as n, onMounted as R, computed as f, defineComponent as L } from "vue";
+import { B as x } from "./button.DhAUh5JA.js";
+import { u as C } from "./i18n.BQkEbtPM.js";
+import { C as b, a as y } from "./chevron-left.CtnrsqUy.js";
+import { o as m } from "./resize.Bqks3WUm.js";
+import { n as W } from "./_plugin-vue2_normalizer.CeySl7Fu.js";
 import "../assets/fixed-scroller.css";
 const w = 1, g = 40, F = ({
   contentRef: d,
@@ -11,10 +11,10 @@ const w = 1, g = 40, F = ({
   leftButtonRef: o,
   rightButtonRef: t
 }) => {
-  const n = r(0), l = r(0), u = r(0), a = r(0);
+  const r = n(0), l = n(0), u = n(0), a = n(0);
   R(() => {
     m(e.value, () => {
-      e.value && (a.value = e.value.offsetWidth, l.value = 0, n.value = 0);
+      e.value && (a.value = e.value.offsetWidth, l.value = 0, r.value = 0);
     }), m(d.value, () => {
       var s;
       u.value = (s = d.value) == null ? void 0 : s.scrollWidth;
@@ -37,18 +37,18 @@ const w = 1, g = 40, F = ({
       s[c] = -(a.value + Math.abs(h) - _.value);
     }), s;
   }), S = f(() => l.value !== 0), B = f(
-    () => n.value >= -(u.value - a.value - 1)
+    () => r.value >= -(u.value - a.value - 1)
   );
   return {
-    offset: n,
+    offset: r,
     shouldShowLeftButton: S,
     shouldShowRightButton: B,
     // Methods
     scrollLeft: () => {
-      l.value !== 0 && (l.value -= 1, n.value = v.value[l.value]);
+      l.value !== 0 && (l.value -= 1, r.value = v.value[l.value]);
     },
     scrollRight: () => {
-      l.value !== i.value - 1 && (l.value += 1, n.value = v.value[l.value]);
+      l.value !== i.value - 1 && (l.value += 1, r.value = v.value[l.value]);
     }
   };
 }, I = {
@@ -58,7 +58,7 @@ const w = 1, g = 40, F = ({
   }
 }, O = {
   i18n: { messages: I }
-}, k = /* @__PURE__ */ x({
+}, k = /* @__PURE__ */ L({
   ...O,
   __name: "fixed-scroller",
   props: {
@@ -72,13 +72,13 @@ const w = 1, g = 40, F = ({
     extraPaddingTop: { type: Number, default: 0 }
   },
   setup(d) {
-    const { t: e } = y(), o = r(null), t = r(null), n = r(null), l = r(null), { offset: u, shouldShowLeftButton: a, shouldShowRightButton: _, scrollLeft: i, scrollRight: v } = F({
+    const { t: e } = C(), o = n(null), t = n(null), r = n(null), l = n(null), { offset: u, shouldShowLeftButton: a, shouldShowRightButton: _, scrollLeft: i, scrollRight: v } = F({
       contentRef: o,
       containerRef: t,
-      leftButtonRef: n,
+      leftButtonRef: r,
       rightButtonRef: l
     });
-    return { __sfc: !0, t: e, contentRef: o, fixedScrollerRef: t, leftButtonRef: n, rightButtonRef: l, offset: u, shouldShowLeftButton: a, shouldShowRightButton: _, scrollLeft: i, scrollRight: v, BentoButton: L, ChevronLeftIcon: C, ChevronRightIcon: b };
+    return { __sfc: !0, t: e, contentRef: o, fixedScrollerRef: t, leftButtonRef: r, rightButtonRef: l, offset: u, shouldShowLeftButton: a, shouldShowRightButton: _, scrollLeft: i, scrollRight: v, BentoButton: x, ChevronLeftIcon: b, ChevronRightIcon: y };
   }
 });
 var E = function() {
@@ -97,12 +97,10 @@ var E = function() {
   T,
   !1,
   null,
-  "0a2c2ec6",
-  null,
-  null
+  "0a2c2ec6"
 );
 const U = P.exports;
 export {
   U as F
 };
-//# sourceMappingURL=fixed-scroller.4eb9a9ac.js.map
+//# sourceMappingURL=fixed-scroller.Bq1AgPnw.js.map

package/dist/chunks/{fixed-scroller.4eb9a9ac.js.map → fixed-scroller.Bq1AgPnw.js.map}

@@ -1 +1 @@
-{"version":3,"file":"fixed-scroller.4eb9a9ac.js","sources":["../../src/components/internal/fixed-scroller/composables/useFixedScroller.ts","../../src/components/internal/fixed-scroller/fixed-scroller.vue"],"sourcesContent":["import { observeSizeOfElement } from '@/utils/ts/resize';\nimport { computed, onMounted, ref } from 'vue';\nimport type { Ref } from 'vue';\n\n// Adding an offset of \"1\" so that the border can be shown within the boundaries\nconst OVERFLOW_CLIP_OFFSET = 1;\n// Add the gradient offset to the calculations\nconst GRADIENT_OFFSET = 40;\n\ninterface useFixedScrollerProps {\n    contentRef?: Ref<HTMLElement | undefined>;\n    containerRef?: Ref<HTMLElement | undefined>;\n    leftButtonRef?: Ref<HTMLElement | undefined>;\n    rightButtonRef?: Ref<HTMLElement | undefined>;\n}\n\n/**\n * Function to calculate the offset of each view and change the \"view\" via offsets\n * through the functions `scrollLeft` and `scrollRight` whilst providing a way to\n * show and hide the buttons based on the current \"view\" via\n * `shouldShowLeftButton` and `shouldShowRightButton`.\n *\n * Each view is pre-calculated (offsetArray) and updated if the content changes as a computed ref:\n * First view: Always 0 (x axis beginning).\n * Last view: total content space - visible width\n * Intermediate views: Previous offset (to the left) plus the visible space taking\n *                     away the space the buttons take so that the whole view can be rendered\n *\n *\n * @param {useFixedScrollerProps} props - All the necessary references to calculate the scroll\n * @param {Ref<HTMLElement | undefined>} props.containerRef - Reference to the container, this defines the visible space width\n * @param {Ref<HTMLElement | undefined>} props.contentRef - Reference to the content itself, this defines the total content width\n * @param {Ref<HTMLElement | undefined>} props.leftButtonRef - Reference to the left button, used to calculate total space in which the content will be rendered\n * @param {Ref<HTMLElement | undefined>} props.rightButtonRef - Reference to the right button, used to calculate total space in which the content will be rendered\n * @returns {Object} response - Values used in the view to show the buttons and to change the view right or left\n * @returns {Ref<number>} response.offset - Offset value by which the view will move on the x axis. To be used in `styles`.\n * @returns {ComputedRef<boolean>} response.shouldShowLeftButton - Indicates if the button on the left should be shown\n * @returns {ComputedRef<boolean>} response.shouldShowRightButton - Indicates if the button on the right should be shown\n * @returns {() => {}} response.scrollLeft - Used to shift the view to the left\n * @returns {() => {}} response.scrollRight - Used to shift the view to the right\n */\nexport const useFixedScroller = ({\n    contentRef,\n    containerRef,\n    leftButtonRef,\n    rightButtonRef,\n}: useFixedScrollerProps) => {\n    const offset = ref(0);\n    const currentView = ref(0);\n\n    // Calculated using 'scrollWidth' to get the full width of the content\n    const totalContentWidth = ref(0);\n    // Calculated using 'clientWidth' to get the rendered componen width\n    const visibleSpaceWidth = ref(0);\n\n    onMounted(() => {\n        observeSizeOfElement(containerRef.value, () => {\n            if (containerRef.value) {\n                // Set new width when resized\n                visibleSpaceWidth.value = containerRef.value.offsetWidth;\n                // Reset the offset and view\n                currentView.value = 0;\n                offset.value = 0;\n            }\n        });\n\n        observeSizeOfElement(contentRef.value, () => {\n            totalContentWidth.value = contentRef.value?.scrollWidth;\n        });\n    });\n\n    // Sum of the space used by the Left and Right buttons\n    // Used to calculate how much space the \"actual\" visible space is\n    const buttonsWidth = computed(() => {\n        const leftButtonWidth = leftButtonRef.value?.scrollWidth\n            ? leftButtonRef.value.scrollWidth + GRADIENT_OFFSET\n            : 0;\n        const rightButtonWidth = rightButtonRef.value?.scrollWidth\n            ? rightButtonRef.value.scrollWidth + GRADIENT_OFFSET\n            : 0;\n\n        return leftButtonWidth + rightButtonWidth;\n    });\n    // Total number of pages/views available.\n    // Calculated as \"ceil\" because if the space doesn't fit \"one view\" (irrational number) the content flows to the next view (integer).\n    const totalViews = computed(() => Math.ceil(totalContentWidth.value / visibleSpaceWidth.value) ?? 0);\n\n    // Calculation of offsets per view (index).\n    // This allows to easily swap the offset without on-the-fly calculations\n    const offsetArray = computed(() => {\n        const calculatedOffsetList = new Array(totalViews.value).fill(0);\n\n        calculatedOffsetList.forEach((_, index) => {\n            // First offset will be 0\n            if (index === 0) {\n                return;\n            }\n\n            // Calculate last\n            if (index === totalViews.value - 1) {\n                calculatedOffsetList[calculatedOffsetList.length - 1] = -(\n                    totalContentWidth.value -\n                    visibleSpaceWidth.value +\n                    OVERFLOW_CLIP_OFFSET\n                );\n\n                return;\n            }\n\n            // Calculate each offset - Move 1 view\n            const previousOffset = calculatedOffsetList[index - 1];\n            calculatedOffsetList[index] = -(visibleSpaceWidth.value + Math.abs(previousOffset) - buttonsWidth.value);\n        });\n\n        return calculatedOffsetList;\n    });\n\n    // Hide left button when it's the first view\n    const shouldShowLeftButton = computed(() => currentView.value !== 0);\n    // Hide right button if it's the last view\n    const shouldShowRightButton = computed(\n        () => offset.value >= -(totalContentWidth.value - visibleSpaceWidth.value - 1)\n    );\n\n    /**\n     * Shifts the current offset by one view to the left.\n     */\n    const scrollLeft = () => {\n        // Do nothing if it is already in page 0\n        if (currentView.value === 0) {\n            return;\n        }\n\n        currentView.value -= 1;\n        offset.value = offsetArray.value[currentView.value];\n    };\n\n    /**\n     * Shifts the current offset by one view to the right.\n     */\n    const scrollRight = () => {\n        // Do nothing if it is already in last page\n        if (currentView.value === totalViews.value - 1) {\n            return;\n        }\n\n        currentView.value += 1;\n        offset.value = offsetArray.value[currentView.value];\n    };\n\n    return {\n        offset,\n        shouldShowLeftButton,\n        shouldShowRightButton,\n\n        // Methods\n        scrollLeft,\n        scrollRight,\n    };\n};\n","<template>\n    <div ref=\"fixedScrollerRef\" class=\"b-fixed-scroller\">\n        <div class=\"b-fixed-scroller__container\">\n            <div\n                ref=\"contentRef\"\n                class=\"b-fixed-scroller__content\"\n                :style=\"{\n                    transform: `translateX(${offset}px)`,\n                    paddingTop: shouldShowLeftButton || shouldShowRightButton ? `${extraPaddingTop}px` : null,\n                }\"\n            >\n                <slot></slot>\n            </div>\n        </div>\n\n        <div v-if=\"shouldShowLeftButton\" ref=\"leftButtonRef\" class=\"b-fixed-scroller__left\">\n            <bento-button variant=\"secondary\" :aria-label=\"t('scrollLeft')\" :condensed=\"condensed\" @click=\"scrollLeft\">\n                <template #iconLeft>\n                    <chevron-left-icon svg-title=\"checked\" aria-hidden=\"true\" />\n                </template>\n            </bento-button>\n        </div>\n        <div v-if=\"shouldShowRightButton\" ref=\"rightButtonRef\" class=\"b-fixed-scroller__right\">\n            <bento-button\n                variant=\"secondary\"\n                :aria-label=\"t('scrollRight')\"\n                :condensed=\"condensed\"\n                @click=\"scrollRight\"\n            >\n                <template #iconLeft>\n                    <chevron-right-icon svg-title=\"checked\" aria-hidden=\"true\" />\n                </template>\n            </bento-button>\n        </div>\n    </div>\n</template>\n\n<script setup lang=\"ts\">\n    import { ref } from 'vue';\n    import { BentoButton } from '@/components/button';\n    import { useFixedScroller } from './composables';\n    import { useI18n } from '@/utils/ts/i18n';\n    import ChevronLeftIcon from '@adyen/ui-assets-icons-16/vue/chevron-left';\n    import ChevronRightIcon from '@adyen/ui-assets-icons-16/vue/chevron-right';\n\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 contentRef = ref(null);\n    const fixedScrollerRef = ref(null);\n    const leftButtonRef = ref(null);\n    const rightButtonRef = ref(null);\n\n    defineProps({\n        /**\n         * Applies the condensed style to the buttons\n         */\n        condensed: { type: Boolean, default: false },\n        /**\n         * Padding to be applied to the top of the scroller container\n         */\n        extraPaddingTop: { type: Number, default: 0 },\n    });\n\n    const { offset, shouldShowLeftButton, shouldShowRightButton, scrollLeft, scrollRight } = useFixedScroller({\n        contentRef,\n        containerRef: fixedScrollerRef,\n        leftButtonRef,\n        rightButtonRef,\n    });\n</script>\n\n<script lang=\"ts\">\n    /**\n     * Allows to horizontally scroll content by one view at a time.\n     *\n     * @example\n     * import { FixedScroller } from '@/internal';\n     *\n     * export default {\n     *     components: { FixedScroller },\n     *     template: `\n     *          <fixed-scroller>\n     *              <div style=\"display: flex; gap: 8px;\">\n     *                  {{ Content here }}\n     *              </div>\n     *          </fixed-scroller>\n     *     `\n     * }\n     */\n    export default {\n        i18n: { messages },\n    };\n</script>\n\n<style lang=\"scss\" scoped src=\"./fixed-scroller.scss\" />\n"],"names":["OVERFLOW_CLIP_OFFSET","GRADIENT_OFFSET","useFixedScroller","contentRef","containerRef","leftButtonRef","rightButtonRef","offset","ref","currentView","totalContentWidth","visibleSpaceWidth","onMounted","observeSizeOfElement","_a","buttonsWidth","computed","leftButtonWidth","rightButtonWidth","_b","totalViews","offsetArray","calculatedOffsetList","_","index","previousOffset","shouldShowLeftButton","shouldShowRightButton","__default__","messages","t","useI18n","fixedScrollerRef","scrollLeft","scrollRight"],"mappings":";;;;;;;AAKA,MAAAA,IAAA,GAEAC,IAAA,IAkCOC,IAAA,CAAA;AAAA,EAA0B,YAAAC;AAAA,EAC7B,cAAAC;AAAA,EACA,eAAAC;AAAA,EACA,gBAAAC;AAEJ,MAAA;AACI,QAAAC,IAAAC,EAAA,CAAA,GACAC,IAAAD,EAAA,CAAA,GAGAE,IAAAF,EAAA,CAAA,GAEAG,IAAAH,EAAA,CAAA;AAEA,EAAAI,EAAA,MAAA;AACI,IAAAC,EAAAT,EAAA,OAAA,MAAA;AACI,MAAAA,EAAA,UAEIO,EAAA,QAAAP,EAAA,MAAA,aAEAK,EAAA,QAAA,GACAF,EAAA,QAAA;AAAA,IACJ,CAAA,GAGJM,EAAAV,EAAA,OAAA,MAAA;;AACI,MAAAO,EAAA,SAAAI,IAAAX,EAAA,UAAA,gBAAAW,EAAA;AAAA,IAA4C,CAAA;AAAA,EAC/C,CAAA;AAKL,QAAAC,IAAAC,EAAA,MAAA;;AACI,UAAAC,KAAAH,IAAAT,EAAA,UAAA,QAAAS,EAAA,cAAAT,EAAA,MAAA,cAAAJ,IAAA,GAGAiB,KAAAC,IAAAb,EAAA,UAAA,QAAAa,EAAA,cAAAb,EAAA,MAAA,cAAAL,IAAA;AAIA,WAAAgB,IAAAC;AAAA,EAAyB,CAAA,GAI7BE,IAAAJ,EAAA,MAAA,KAAA,KAAAN,EAAA,QAAAC,EAAA,KAAA,KAAA,CAAA,GAIAU,IAAAL,EAAA,MAAA;AACI,UAAAM,IAAA,IAAA,MAAAF,EAAA,KAAA,EAAA,KAAA,CAAA;AAEA,WAAAE,EAAA,QAAA,CAAAC,GAAAC,MAAA;AAEI,UAAAA,MAAA;AACI;AAIJ,UAAAA,MAAAJ,EAAA,QAAA,GAAA;AACI,QAAAE,EAAAA,EAAA,SAAA,CAAA,IAAA,EAAAZ,EAAA,QAAAC,EAAA,QAAAX;AAMA;AAAA;AAIJ,YAAAyB,IAAAH,EAAAE,IAAA,CAAA;AACA,MAAAF,EAAAE,CAAA,IAAA,EAAAb,EAAA,QAAA,KAAA,IAAAc,CAAA,IAAAV,EAAA;AAAA,IAAkG,CAAA,GAGtGO;AAAA,EAAO,CAAA,GAIXI,IAAAV,EAAA,MAAAP,EAAA,UAAA,CAAA,GAEAkB,IAAAX;AAAA,IAA8B,MAAAT,EAAA,SAAA,EAAAG,EAAA,QAAAC,EAAA,QAAA;AAAA,EACkD;AA6BhF,SAAA;AAAA,IAAO,QAAAJ;AAAA,IACH,sBAAAmB;AAAA,IACA,uBAAAC;AAAA;AAAA,IACA,YA1BJ,MAAA;AAEI,MAAAlB,EAAA,UAAA,MAIAA,EAAA,SAAA,GACAF,EAAA,QAAAc,EAAA,MAAAZ,EAAA,KAAA;AAAA,IAAkD;AAAA,IAsBlD,aAhBJ,MAAA;AAEI,MAAAA,EAAA,UAAAW,EAAA,QAAA,MAIAX,EAAA,SAAA,GACAF,EAAA,QAAAc,EAAA,MAAAZ,EAAA,KAAA;AAAA,IAAkD;AAAA,EAUlD;AAER;;;;;GClEImB,IAAA;AAAA,EAAe,MAAA,EAAA,UAAAC,EAAA;AAEf;;;;;;;;;;;;;;AA9CA,UAAA,EAAA,GAAAC,EAAA,IAAAC,EAAA,GAEA5B,IAAAK,EAAA,IAAA,GACAwB,IAAAxB,EAAA,IAAA,GACAH,IAAAG,EAAA,IAAA,GACAF,IAAAE,EAAA,IAAA,GAaA,EAAA,QAAAD,GAAA,sBAAAmB,GAAA,uBAAAC,GAAA,YAAAM,GAAA,aAAAC,EAAA,IAAAhC,EAAA;AAAA,MAA0G,YAAAC;AAAA,MACtG,cAAA6B;AAAA,MACc,eAAA3B;AAAA,MACd,gBAAAC;AAAA,IACA,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"fixed-scroller.Bq1AgPnw.js","sources":["../../src/components/internal/fixed-scroller/composables/useFixedScroller.ts","../../src/components/internal/fixed-scroller/fixed-scroller.vue"],"sourcesContent":["import { observeSizeOfElement } from '@/utils/ts/resize';\nimport { computed, onMounted, ref } from 'vue';\nimport type { Ref } from 'vue';\n\n// Adding an offset of \"1\" so that the border can be shown within the boundaries\nconst OVERFLOW_CLIP_OFFSET = 1;\n// Add the gradient offset to the calculations\nconst GRADIENT_OFFSET = 40;\n\ninterface useFixedScrollerProps {\n    contentRef?: Ref<HTMLElement | undefined>;\n    containerRef?: Ref<HTMLElement | undefined>;\n    leftButtonRef?: Ref<HTMLElement | undefined>;\n    rightButtonRef?: Ref<HTMLElement | undefined>;\n}\n\n/**\n * Function to calculate the offset of each view and change the \"view\" via offsets\n * through the functions `scrollLeft` and `scrollRight` whilst providing a way to\n * show and hide the buttons based on the current \"view\" via\n * `shouldShowLeftButton` and `shouldShowRightButton`.\n *\n * Each view is pre-calculated (offsetArray) and updated if the content changes as a computed ref:\n * First view: Always 0 (x axis beginning).\n * Last view: total content space - visible width\n * Intermediate views: Previous offset (to the left) plus the visible space taking\n *                     away the space the buttons take so that the whole view can be rendered\n *\n *\n * @param {useFixedScrollerProps} props - All the necessary references to calculate the scroll\n * @param {Ref<HTMLElement | undefined>} props.containerRef - Reference to the container, this defines the visible space width\n * @param {Ref<HTMLElement | undefined>} props.contentRef - Reference to the content itself, this defines the total content width\n * @param {Ref<HTMLElement | undefined>} props.leftButtonRef - Reference to the left button, used to calculate total space in which the content will be rendered\n * @param {Ref<HTMLElement | undefined>} props.rightButtonRef - Reference to the right button, used to calculate total space in which the content will be rendered\n * @returns {Object} response - Values used in the view to show the buttons and to change the view right or left\n * @returns {Ref<number>} response.offset - Offset value by which the view will move on the x axis. To be used in `styles`.\n * @returns {ComputedRef<boolean>} response.shouldShowLeftButton - Indicates if the button on the left should be shown\n * @returns {ComputedRef<boolean>} response.shouldShowRightButton - Indicates if the button on the right should be shown\n * @returns {() => {}} response.scrollLeft - Used to shift the view to the left\n * @returns {() => {}} response.scrollRight - Used to shift the view to the right\n */\nexport const useFixedScroller = ({\n    contentRef,\n    containerRef,\n    leftButtonRef,\n    rightButtonRef,\n}: useFixedScrollerProps) => {\n    const offset = ref(0);\n    const currentView = ref(0);\n\n    // Calculated using 'scrollWidth' to get the full width of the content\n    const totalContentWidth = ref(0);\n    // Calculated using 'clientWidth' to get the rendered componen width\n    const visibleSpaceWidth = ref(0);\n\n    onMounted(() => {\n        observeSizeOfElement(containerRef.value, () => {\n            if (containerRef.value) {\n                // Set new width when resized\n                visibleSpaceWidth.value = containerRef.value.offsetWidth;\n                // Reset the offset and view\n                currentView.value = 0;\n                offset.value = 0;\n            }\n        });\n\n        observeSizeOfElement(contentRef.value, () => {\n            totalContentWidth.value = contentRef.value?.scrollWidth;\n        });\n    });\n\n    // Sum of the space used by the Left and Right buttons\n    // Used to calculate how much space the \"actual\" visible space is\n    const buttonsWidth = computed(() => {\n        const leftButtonWidth = leftButtonRef.value?.scrollWidth\n            ? leftButtonRef.value.scrollWidth + GRADIENT_OFFSET\n            : 0;\n        const rightButtonWidth = rightButtonRef.value?.scrollWidth\n            ? rightButtonRef.value.scrollWidth + GRADIENT_OFFSET\n            : 0;\n\n        return leftButtonWidth + rightButtonWidth;\n    });\n    // Total number of pages/views available.\n    // Calculated as \"ceil\" because if the space doesn't fit \"one view\" (irrational number) the content flows to the next view (integer).\n    const totalViews = computed(() => Math.ceil(totalContentWidth.value / visibleSpaceWidth.value) ?? 0);\n\n    // Calculation of offsets per view (index).\n    // This allows to easily swap the offset without on-the-fly calculations\n    const offsetArray = computed(() => {\n        const calculatedOffsetList = new Array(totalViews.value).fill(0);\n\n        calculatedOffsetList.forEach((_, index) => {\n            // First offset will be 0\n            if (index === 0) {\n                return;\n            }\n\n            // Calculate last\n            if (index === totalViews.value - 1) {\n                calculatedOffsetList[calculatedOffsetList.length - 1] = -(\n                    totalContentWidth.value -\n                    visibleSpaceWidth.value +\n                    OVERFLOW_CLIP_OFFSET\n                );\n\n                return;\n            }\n\n            // Calculate each offset - Move 1 view\n            const previousOffset = calculatedOffsetList[index - 1];\n            calculatedOffsetList[index] = -(visibleSpaceWidth.value + Math.abs(previousOffset) - buttonsWidth.value);\n        });\n\n        return calculatedOffsetList;\n    });\n\n    // Hide left button when it's the first view\n    const shouldShowLeftButton = computed(() => currentView.value !== 0);\n    // Hide right button if it's the last view\n    const shouldShowRightButton = computed(\n        () => offset.value >= -(totalContentWidth.value - visibleSpaceWidth.value - 1)\n    );\n\n    /**\n     * Shifts the current offset by one view to the left.\n     */\n    const scrollLeft = () => {\n        // Do nothing if it is already in page 0\n        if (currentView.value === 0) {\n            return;\n        }\n\n        currentView.value -= 1;\n        offset.value = offsetArray.value[currentView.value];\n    };\n\n    /**\n     * Shifts the current offset by one view to the right.\n     */\n    const scrollRight = () => {\n        // Do nothing if it is already in last page\n        if (currentView.value === totalViews.value - 1) {\n            return;\n        }\n\n        currentView.value += 1;\n        offset.value = offsetArray.value[currentView.value];\n    };\n\n    return {\n        offset,\n        shouldShowLeftButton,\n        shouldShowRightButton,\n\n        // Methods\n        scrollLeft,\n        scrollRight,\n    };\n};\n","<template>\n    <div ref=\"fixedScrollerRef\" class=\"b-fixed-scroller\">\n        <div class=\"b-fixed-scroller__container\">\n            <div\n                ref=\"contentRef\"\n                class=\"b-fixed-scroller__content\"\n                :style=\"{\n                    transform: `translateX(${offset}px)`,\n                    paddingTop: shouldShowLeftButton || shouldShowRightButton ? `${extraPaddingTop}px` : null,\n                }\"\n            >\n                <slot></slot>\n            </div>\n        </div>\n\n        <div v-if=\"shouldShowLeftButton\" ref=\"leftButtonRef\" class=\"b-fixed-scroller__left\">\n            <bento-button variant=\"secondary\" :aria-label=\"t('scrollLeft')\" :condensed=\"condensed\" @click=\"scrollLeft\">\n                <template #iconLeft>\n                    <chevron-left-icon svg-title=\"checked\" aria-hidden=\"true\" />\n                </template>\n            </bento-button>\n        </div>\n        <div v-if=\"shouldShowRightButton\" ref=\"rightButtonRef\" class=\"b-fixed-scroller__right\">\n            <bento-button\n                variant=\"secondary\"\n                :aria-label=\"t('scrollRight')\"\n                :condensed=\"condensed\"\n                @click=\"scrollRight\"\n            >\n                <template #iconLeft>\n                    <chevron-right-icon svg-title=\"checked\" aria-hidden=\"true\" />\n                </template>\n            </bento-button>\n        </div>\n    </div>\n</template>\n\n<script setup lang=\"ts\">\n    import { ref } from 'vue';\n    import { BentoButton } from '@/components/button';\n    import { useFixedScroller } from './composables';\n    import { useI18n } from '@/utils/ts/i18n';\n    import ChevronLeftIcon from '@adyen/ui-assets-icons-16/vue/chevron-left';\n    import ChevronRightIcon from '@adyen/ui-assets-icons-16/vue/chevron-right';\n\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 contentRef = ref(null);\n    const fixedScrollerRef = ref(null);\n    const leftButtonRef = ref(null);\n    const rightButtonRef = ref(null);\n\n    defineProps({\n        /**\n         * Applies the condensed style to the buttons\n         */\n        condensed: { type: Boolean, default: false },\n        /**\n         * Padding to be applied to the top of the scroller container\n         */\n        extraPaddingTop: { type: Number, default: 0 },\n    });\n\n    const { offset, shouldShowLeftButton, shouldShowRightButton, scrollLeft, scrollRight } = useFixedScroller({\n        contentRef,\n        containerRef: fixedScrollerRef,\n        leftButtonRef,\n        rightButtonRef,\n    });\n</script>\n\n<script lang=\"ts\">\n    /**\n     * Allows to horizontally scroll content by one view at a time.\n     *\n     * @example\n     * import { FixedScroller } from '@/internal';\n     *\n     * export default {\n     *     components: { FixedScroller },\n     *     template: `\n     *          <fixed-scroller>\n     *              <div style=\"display: flex; gap: 8px;\">\n     *                  {{ Content here }}\n     *              </div>\n     *          </fixed-scroller>\n     *     `\n     * }\n     */\n    export default {\n        i18n: { messages },\n    };\n</script>\n\n<style lang=\"scss\" scoped src=\"./fixed-scroller.scss\" />\n"],"names":["OVERFLOW_CLIP_OFFSET","GRADIENT_OFFSET","useFixedScroller","contentRef","containerRef","leftButtonRef","rightButtonRef","offset","ref","currentView","totalContentWidth","visibleSpaceWidth","onMounted","observeSizeOfElement","_a","buttonsWidth","computed","leftButtonWidth","rightButtonWidth","_b","totalViews","offsetArray","calculatedOffsetList","_","index","previousOffset","shouldShowLeftButton","shouldShowRightButton","__default__","messages","t","useI18n","fixedScrollerRef","scrollLeft","scrollRight"],"mappings":";;;;;;;AAKA,MAAAA,IAAA,GAEAC,IAAA,IAkCOC,IAAA,CAAA;AAAA,EAA0B,YAAAC;AAAA,EAC7B,cAAAC;AAAA,EACA,eAAAC;AAAA,EACA,gBAAAC;AAEJ,MAAA;AACI,QAAAC,IAAAC,EAAA,CAAA,GACAC,IAAAD,EAAA,CAAA,GAGAE,IAAAF,EAAA,CAAA,GAEAG,IAAAH,EAAA,CAAA;AAEA,EAAAI,EAAA,MAAA;AACI,IAAAC,EAAAT,EAAA,OAAA,MAAA;AACI,MAAAA,EAAA,UAEIO,EAAA,QAAAP,EAAA,MAAA,aAEAK,EAAA,QAAA,GACAF,EAAA,QAAA;AAAA,IACJ,CAAA,GAGJM,EAAAV,EAAA,OAAA,MAAA;;AACI,MAAAO,EAAA,SAAAI,IAAAX,EAAA,UAAA,gBAAAW,EAAA;AAAA,IAA4C,CAAA;AAAA,EAC/C,CAAA;AAKL,QAAAC,IAAAC,EAAA,MAAA;;AACI,UAAAC,KAAAH,IAAAT,EAAA,UAAA,QAAAS,EAAA,cAAAT,EAAA,MAAA,cAAAJ,IAAA,GAGAiB,KAAAC,IAAAb,EAAA,UAAA,QAAAa,EAAA,cAAAb,EAAA,MAAA,cAAAL,IAAA;AAIA,WAAAgB,IAAAC;AAAA,EAAyB,CAAA,GAI7BE,IAAAJ,EAAA,MAAA,KAAA,KAAAN,EAAA,QAAAC,EAAA,KAAA,KAAA,CAAA,GAIAU,IAAAL,EAAA,MAAA;AACI,UAAAM,IAAA,IAAA,MAAAF,EAAA,KAAA,EAAA,KAAA,CAAA;AAEA,WAAAE,EAAA,QAAA,CAAAC,GAAAC,MAAA;AAEI,UAAAA,MAAA;AACI;AAIJ,UAAAA,MAAAJ,EAAA,QAAA,GAAA;AACI,QAAAE,EAAAA,EAAA,SAAA,CAAA,IAAA,EAAAZ,EAAA,QAAAC,EAAA,QAAAX;AAMA;AAAA,MAAA;AAIJ,YAAAyB,IAAAH,EAAAE,IAAA,CAAA;AACA,MAAAF,EAAAE,CAAA,IAAA,EAAAb,EAAA,QAAA,KAAA,IAAAc,CAAA,IAAAV,EAAA;AAAA,IAAkG,CAAA,GAGtGO;AAAA,EAAO,CAAA,GAIXI,IAAAV,EAAA,MAAAP,EAAA,UAAA,CAAA,GAEAkB,IAAAX;AAAA,IAA8B,MAAAT,EAAA,SAAA,EAAAG,EAAA,QAAAC,EAAA,QAAA;AAAA,EACkD;AA6BhF,SAAA;AAAA,IAAO,QAAAJ;AAAA,IACH,sBAAAmB;AAAA,IACA,uBAAAC;AAAA;AAAA,IACA,YA1BJ,MAAA;AAEI,MAAAlB,EAAA,UAAA,MAIAA,EAAA,SAAA,GACAF,EAAA,QAAAc,EAAA,MAAAZ,EAAA,KAAA;AAAA,IAAkD;AAAA,IAsBlD,aAhBJ,MAAA;AAEI,MAAAA,EAAA,UAAAW,EAAA,QAAA,MAIAX,EAAA,SAAA,GACAF,EAAA,QAAAc,EAAA,MAAAZ,EAAA,KAAA;AAAA,IAAkD;AAAA,EAUlD;AAER;;;;;GClEImB,IAAA;AAAA,EAAe,MAAA,EAAA,UAAAC,EAAA;AAEf;;;;;;;;;;;;;;AA9CA,UAAA,EAAA,GAAAC,EAAA,IAAAC,EAAA,GAEA5B,IAAAK,EAAA,IAAA,GACAwB,IAAAxB,EAAA,IAAA,GACAH,IAAAG,EAAA,IAAA,GACAF,IAAAE,EAAA,IAAA,GAaA,EAAA,QAAAD,GAAA,sBAAAmB,GAAA,uBAAAC,GAAA,YAAAM,GAAA,aAAAC,EAAA,IAAAhC,EAAA;AAAA,MAA0G,YAAAC;AAAA,MACtG,cAAA6B;AAAA,MACc,eAAA3B;AAAA,MACd,gBAAAC;AAAA,IACA,CAAA;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/chunks/{index.d553d3d1.js → focus-trap.DSkLNO_i.js}

@@ -1,7 +1,7 @@
 import { defineComponent as re } from "vue";
-import { u as ne } from "./use-has-slot.fbeb19ec.js";
-import { n as ae } from "./_plugin-vue2_normalizer.71e2aa87.js";
-import "../assets/index19.css";
+import { u as ne } from "./use-has-slot.C9lQZ6nz.js";
+import { n as ae } from "./_plugin-vue2_normalizer.CeySl7Fu.js";
+import "../assets/focus-trap.css";
 var R = "data-focus-lock", oe = "data-focus-lock-disabled", ue = "data-no-focus-lock", ie = "data-autofocus-inside", ce = "data-no-autofocus", m = function(e) {
   for (var t = Array(e.length), r = 0; r < e.length; ++r)
     t[r] = e[r];
@@ -49,11 +49,11 @@ var R = "data-focus-lock", oe = "data-focus-lock-disabled", ue = "data-no-focus-
 }, me = function(e) {
   var t = e.getAttribute(ce);
   return ![!0, "true", ""].includes(t);
-}, x = function(e) {
+}, w = function(e) {
   var t;
   return !!(e && (!((t = G(e)) === null || t === void 0) && t.focusGuard));
 }, O = function(e) {
-  return !x(e);
+  return !w(e);
 }, be = function(e) {
   return !!e;
 }, he = function(e, t) {
@@ -93,18 +93,18 @@ var R = "data-focus-lock", oe = "data-focus-lock-disabled", ue = "data-no-focus-
   "[tabindex]",
   "[contenteditable]",
   "[autofocus]"
-], w = pe.join(","), Oe = "".concat(w, ", [data-focus-guard]"), z = function(e, t) {
+], y = pe.join(","), Oe = "".concat(y, ", [data-focus-guard]"), z = function(e, t) {
   var r;
   return m(((r = e.shadowRoot) === null || r === void 0 ? void 0 : r.children) || e.children).reduce(function(n, a) {
-    return n.concat(a.matches(t ? Oe : w) ? [a] : [], z(a));
+    return n.concat(a.matches(t ? Oe : y) ? [a] : [], z(a));
   }, []);
-}, y = function(e, t) {
+}, F = function(e, t) {
   return e.reduce(function(r, n) {
     return r.concat(
       // add all tabbables inside and within shadow DOMs in DOM order
       z(n, t),
       // add if node is tabbable itself
-      n.parentNode ? m(n.parentNode.querySelectorAll(w)).filter(function(a) {
+      n.parentNode ? m(n.parentNode.querySelectorAll(y)).filter(function(a) {
         return a === n;
       }) : []
     );
@@ -112,11 +112,11 @@ var R = "data-focus-lock", oe = "data-focus-lock-disabled", ue = "data-no-focus-
 }, ge = function(e) {
   var t = e.querySelectorAll("[".concat(ie, "]"));
   return m(t).map(function(r) {
-    return y([r]);
+    return F([r]);
   }).reduce(function(r, n) {
     return r.concat(n);
   }, []);
-}, F = function(e, t) {
+}, _ = function(e, t) {
   return m(e).filter(function(r) {
     return W(t, r);
   }).filter(function(r) {
@@ -126,12 +126,12 @@ var R = "data-focus-lock", oe = "data-focus-lock-disabled", ue = "data-no-focus-
   return t === void 0 && (t = /* @__PURE__ */ new Map()), m(e).filter(function(r) {
     return H(t, r);
   });
-}, _ = function(e, t, r) {
-  return K(F(y(e, r), t), !0, r);
+}, I = function(e, t, r) {
+  return K(_(F(e, r), t), !0, r);
 }, B = function(e, t) {
-  return K(F(y(e), t), !1);
+  return K(_(F(e), t), !1);
 }, Ae = function(e, t) {
-  return F(ge(e), t);
+  return _(ge(e), t);
 }, h = function(e, t) {
   return (e.shadowRoot ? h(e.shadowRoot, t) : e.contains(t)) || Array.from(e.children).some(function(r) {
     return h(r, t);
@@ -159,29 +159,29 @@ var R = "data-focus-lock", oe = "data-focus-lock-disabled", ue = "data-no-focus-
   return document.activeElement ? document.activeElement.shadowRoot ? Z(document.activeElement.shadowRoot) : document.activeElement : void 0;
 }, Ee = function(e) {
   return e === document.activeElement;
-}, _e = function(e) {
+}, Ie = function(e) {
   return !!m(e.querySelectorAll("iframe")).some(function(t) {
     return Ee(t);
   });
-}, Ie = function(e) {
+}, xe = function(e) {
   var t = document && S();
   return !t || t.dataset && t.dataset.focusGuard ? !1 : T(e).some(function(r) {
-    return h(r, t) || _e(r);
+    return h(r, t) || Ie(r);
   });
-}, xe = function() {
+}, we = function() {
   var e = document && S();
   return e ? m(document.querySelectorAll("[".concat(ue, "]"))).some(function(t) {
     return h(t, e);
   }) : !1;
-}, we = function(e, t) {
+}, ye = function(e, t) {
   return t.filter($).filter(function(r) {
     return r.name === e.name;
   }).filter(function(r) {
     return r.checked;
   })[0] || e;
 }, C = function(e, t) {
-  return $(e) && e.name ? we(e, t) : e;
-}, ye = function(e) {
+  return $(e) && e.name ? ye(e, t) : e;
+}, Fe = function(e) {
   var t = /* @__PURE__ */ new Set();
   return e.forEach(function(r) {
     return t.add(C(r, e));
@@ -192,10 +192,10 @@ var R = "data-focus-lock", oe = "data-focus-lock-disabled", ue = "data-no-focus-
   return e[0] && e.length > 1 ? C(e[0], e) : e[0];
 }, M = function(e, t) {
   return e.length > 1 ? e.indexOf(C(e[t], e)) : t;
-}, Y = "NEW_FOCUS", Fe = function(e, t, r, n) {
-  var a = e.length, i = e[0], o = e[a - 1], u = x(r);
+}, Y = "NEW_FOCUS", _e = function(e, t, r, n) {
+  var a = e.length, i = e[0], o = e[a - 1], u = w(r);
   if (!(r && e.indexOf(r) >= 0)) {
-    var c = r !== void 0 ? t.indexOf(r) : -1, l = n ? t.indexOf(n) : c, v = n ? e.indexOf(n) : -1, s = c - l, b = t.indexOf(i), f = t.indexOf(o), d = ye(t), ee = r !== void 0 ? d.indexOf(r) : -1, te = ee - (n ? d.indexOf(n) : c), P = M(e, 0), D = M(e, a - 1);
+    var c = r !== void 0 ? t.indexOf(r) : -1, l = n ? t.indexOf(n) : c, v = n ? e.indexOf(n) : -1, s = c - l, b = t.indexOf(i), f = t.indexOf(o), d = Fe(t), ee = r !== void 0 ? d.indexOf(r) : -1, te = ee - (n ? d.indexOf(n) : c), P = M(e, 0), D = M(e, a - 1);
     if (c === -1 || v === -1)
       return Y;
     if (!s && v >= 0)
@@ -213,10 +213,10 @@ var R = "data-focus-lock", oe = "data-focus-lock-disabled", ue = "data-no-focus-
     if (s)
       return Math.abs(s) > 1 ? v : (a + v + s) % a;
   }
-}, I = function(e, t) {
-  return t === void 0 && (t = []), t.push(e), e.parentNode && I(e.parentNode.host || e.parentNode, t), t;
+}, x = function(e, t) {
+  return t === void 0 && (t = []), t.push(e), e.parentNode && x(e.parentNode.host || e.parentNode, t), t;
 }, g = function(e, t) {
-  for (var r = I(e), n = I(t), a = 0; a < r.length; a += 1) {
+  for (var r = x(e), n = x(t), a = 0; a < r.length; a += 1) {
     var i = r[a];
     if (n.indexOf(i) >= 0)
       return i;
@@ -247,7 +247,7 @@ var R = "data-focus-lock", oe = "data-focus-lock-disabled", ue = "data-no-focus-
     return r.get(n);
   }).filter(be);
 }, Pe = function(e, t) {
-  var r = document && S(), n = T(e).filter(O), a = J(r || e, e, n), i = /* @__PURE__ */ new Map(), o = B(n, i), u = _(n, i).filter(function(f) {
+  var r = document && S(), n = T(e).filter(O), a = J(r || e, e, n), i = /* @__PURE__ */ new Map(), o = B(n, i), u = I(n, i).filter(function(f) {
     var d = f.node;
     return O(d);
   });
@@ -258,7 +258,7 @@ var R = "data-focus-lock", oe = "data-focus-lock-disabled", ue = "data-no-focus-
     }), l = Ce(c, u), v = l.map(function(f) {
       var d = f.node;
       return d;
-    }), s = Fe(v, c, r, t);
+    }), s = _e(v, c, r, t);
     if (s === Y) {
       var b = U(o.map(function(f) {
         var d = f.node;
@@ -271,7 +271,7 @@ var R = "data-focus-lock", oe = "data-focus-lock-disabled", ue = "data-no-focus-
     return s === void 0 ? s : l[s];
   }
 }, De = function(e) {
-  var t = T(e).filter(O), r = J(e, e, t), n = /* @__PURE__ */ new Map(), a = _([r], n, !0), i = _(t, n).filter(function(o) {
+  var t = T(e).filter(O), r = J(e, e, t), n = /* @__PURE__ */ new Map(), a = I([r], n, !0), i = I(t, n).filter(function(o) {
     var u = o.node;
     return O(u);
   }).map(function(o) {
@@ -284,7 +284,7 @@ var R = "data-focus-lock", oe = "data-focus-lock-disabled", ue = "data-no-focus-
       node: u,
       index: c,
       lockItem: i.indexOf(u) >= 0,
-      guard: x(u)
+      guard: w(u)
     };
   });
 }, Re = De, Ue = function(e, t) {
@@ -375,7 +375,7 @@ const Le = (e) => requestAnimationFrame(e), Me = (e, t) => {
      * `focus-lock` can determine the next interable element to focus on.
      */
     async setFocusInside() {
-      (document.activeElement === document.body || xe() || !this.lastFocusedElement) && (Ie(this.$refs.root) || Be(this.$refs.root, this.lastFocusedElement, {
+      (document.activeElement === document.body || we() || !this.lastFocusedElement) && (xe(this.$refs.root) || Be(this.$refs.root, this.lastFocusedElement, {
         focusOptions: { preventScroll: !0 }
       }), this.lastFocusedElement = document.activeElement);
     },
@@ -433,13 +433,11 @@ var Ge = function() {
   qe,
   !1,
   null,
-  "c1b3538c",
-  null,
-  null
+  "c1b3538c"
 );
 const Ze = $e.exports;
 export {
   Ze as B,
   ke as g
 };
-//# sourceMappingURL=index.d553d3d1.js.map
+//# sourceMappingURL=focus-trap.DSkLNO_i.js.map

package/dist/chunks/focus-trap.DSkLNO_i.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"focus-trap.DSkLNO_i.js","sources":["../../../../node_modules/focus-lock/dist/es2015/constants.js","../../../../node_modules/focus-lock/dist/es2015/utils/array.js","../../../../node_modules/focus-lock/dist/es2015/utils/is.js","../../../../node_modules/focus-lock/dist/es2015/utils/tabOrder.js","../../../../node_modules/focus-lock/dist/es2015/utils/tabbables.js","../../../../node_modules/focus-lock/dist/es2015/utils/tabUtils.js","../../../../node_modules/focus-lock/dist/es2015/utils/DOMutils.js","../../../../node_modules/focus-lock/dist/es2015/utils/all-affected.js","../../../../node_modules/focus-lock/dist/es2015/utils/getActiveElement.js","../../../../node_modules/focus-lock/dist/es2015/focusInside.js","../../../../node_modules/focus-lock/dist/es2015/focusIsHidden.js","../../../../node_modules/focus-lock/dist/es2015/utils/correctFocus.js","../../../../node_modules/focus-lock/dist/es2015/utils/firstFocus.js","../../../../node_modules/focus-lock/dist/es2015/solver.js","../../../../node_modules/focus-lock/dist/es2015/utils/parenting.js","../../../../node_modules/focus-lock/dist/es2015/focusMerge.js","../../../../node_modules/focus-lock/dist/es2015/focusables.js","../../../../node_modules/focus-lock/dist/es2015/setFocus.js","../../src/components/focus-trap/focus-trap.types.ts","../../src/utils/ts/focus-trap.utils.ts","../../src/components/focus-trap/focus-trap.vue"],"sourcesContent":["/**\n * defines a focus group\n */\nexport var FOCUS_GROUP = 'data-focus-lock';\n/**\n * disables element discovery inside a group marked by key\n */\nexport var FOCUS_DISABLED = 'data-focus-lock-disabled';\n/**\n * allows uncontrolled focus within the marked area, effectively disabling focus lock for it's content\n */\nexport var FOCUS_ALLOW = 'data-no-focus-lock';\n/**\n * instructs autofocus engine to pick default autofocus inside a given node\n * can be set on the element or container\n */\nexport var FOCUS_AUTO = 'data-autofocus-inside';\n/**\n * instructs autofocus to ignore elements within a given node\n * can be set on the element or container\n */\nexport var FOCUS_NO_AUTOFOCUS = 'data-no-autofocus';\n","/*\nIE11 support\n */\nexport var toArray = function (a) {\n    var ret = Array(a.length);\n    for (var i = 0; i < a.length; ++i) {\n        ret[i] = a[i];\n    }\n    return ret;\n};\nexport var asArray = function (a) { return (Array.isArray(a) ? a : [a]); };\n","import { FOCUS_NO_AUTOFOCUS } from '../constants';\nvar isElementHidden = function (node) {\n    // we can measure only \"elements\"\n    // consider others as \"visible\"\n    if (node.nodeType !== Node.ELEMENT_NODE) {\n        return false;\n    }\n    var computedStyle = window.getComputedStyle(node, null);\n    if (!computedStyle || !computedStyle.getPropertyValue) {\n        return false;\n    }\n    return (computedStyle.getPropertyValue('display') === 'none' || computedStyle.getPropertyValue('visibility') === 'hidden');\n};\nvar getParentNode = function (node) {\n    // DOCUMENT_FRAGMENT_NODE can also point on ShadowRoot. In this case .host will point on the next node\n    return node.parentNode && node.parentNode.nodeType === Node.DOCUMENT_FRAGMENT_NODE\n        ? // eslint-disable-next-line @typescript-eslint/no-explicit-any\n            node.parentNode.host\n        : node.parentNode;\n};\nvar isTopNode = function (node) {\n    // @ts-ignore\n    return node === document || (node && node.nodeType === Node.DOCUMENT_NODE);\n};\nvar isVisibleUncached = function (node, checkParent) {\n    return !node || isTopNode(node) || (!isElementHidden(node) && checkParent(getParentNode(node)));\n};\nexport var isVisibleCached = function (visibilityCache, node) {\n    var cached = visibilityCache.get(node);\n    if (cached !== undefined) {\n        return cached;\n    }\n    var result = isVisibleUncached(node, isVisibleCached.bind(undefined, visibilityCache));\n    visibilityCache.set(node, result);\n    return result;\n};\nvar isAutoFocusAllowedUncached = function (node, checkParent) {\n    return node && !isTopNode(node) ? (isAutoFocusAllowed(node) ? checkParent(getParentNode(node)) : false) : true;\n};\nexport var isAutoFocusAllowedCached = function (cache, node) {\n    var cached = cache.get(node);\n    if (cached !== undefined) {\n        return cached;\n    }\n    var result = isAutoFocusAllowedUncached(node, isAutoFocusAllowedCached.bind(undefined, cache));\n    cache.set(node, result);\n    return result;\n};\nexport var getDataset = function (node) {\n    // @ts-ignore\n    return node.dataset;\n};\nexport var isHTMLButtonElement = function (node) { return node.tagName === 'BUTTON'; };\nexport var isHTMLInputElement = function (node) { return node.tagName === 'INPUT'; };\nexport var isRadioElement = function (node) {\n    return isHTMLInputElement(node) && node.type === 'radio';\n};\nexport var notHiddenInput = function (node) {\n    return !((isHTMLInputElement(node) || isHTMLButtonElement(node)) && (node.type === 'hidden' || node.disabled));\n};\nexport var isAutoFocusAllowed = function (node) {\n    var attribute = node.getAttribute(FOCUS_NO_AUTOFOCUS);\n    return ![true, 'true', ''].includes(attribute);\n};\nexport var isGuard = function (node) { var _a; return Boolean(node && ((_a = getDataset(node)) === null || _a === void 0 ? void 0 : _a.focusGuard)); };\nexport var isNotAGuard = function (node) { return !isGuard(node); };\nexport var isDefined = function (x) { return Boolean(x); };\n","import { toArray } from './array';\nexport var tabSort = function (a, b) {\n    var tabDiff = a.tabIndex - b.tabIndex;\n    var indexDiff = a.index - b.index;\n    if (tabDiff) {\n        if (!a.tabIndex) {\n            return 1;\n        }\n        if (!b.tabIndex) {\n            return -1;\n        }\n    }\n    return tabDiff || indexDiff;\n};\nexport var orderByTabIndex = function (nodes, filterNegative, keepGuards) {\n    return toArray(nodes)\n        .map(function (node, index) { return ({\n        node: node,\n        index: index,\n        tabIndex: keepGuards && node.tabIndex === -1 ? ((node.dataset || {}).focusGuard ? 0 : -1) : node.tabIndex,\n    }); })\n        .filter(function (data) { return !filterNegative || data.tabIndex >= 0; })\n        .sort(tabSort);\n};\n","/**\n * list of the object to be considered as focusable\n */\nexport var tabbables = [\n    'button:enabled',\n    'select:enabled',\n    'textarea:enabled',\n    'input:enabled',\n    // elements with explicit roles will also use explicit tabindex\n    // '[role=\"button\"]',\n    'a[href]',\n    'area[href]',\n    'summary',\n    'iframe',\n    'object',\n    'embed',\n    'audio[controls]',\n    'video[controls]',\n    '[tabindex]',\n    '[contenteditable]',\n    '[autofocus]',\n];\n","import { FOCUS_AUTO } from '../constants';\nimport { toArray } from './array';\nimport { tabbables } from './tabbables';\nvar queryTabbables = tabbables.join(',');\nvar queryGuardTabbables = \"\".concat(queryTabbables, \", [data-focus-guard]\");\nvar getFocusablesWithShadowDom = function (parent, withGuards) {\n    var _a;\n    return toArray(((_a = parent.shadowRoot) === null || _a === void 0 ? void 0 : _a.children) || parent.children).reduce(function (acc, child) {\n        return acc.concat(child.matches(withGuards ? queryGuardTabbables : queryTabbables) ? [child] : [], getFocusablesWithShadowDom(child));\n    }, []);\n};\nexport var getFocusables = function (parents, withGuards) {\n    return parents.reduce(function (acc, parent) {\n        return acc.concat(\n        // add all tabbables inside and within shadow DOMs in DOM order\n        getFocusablesWithShadowDom(parent, withGuards), \n        // add if node is tabbable itself\n        parent.parentNode\n            ? toArray(parent.parentNode.querySelectorAll(queryTabbables)).filter(function (node) { return node === parent; })\n            : []);\n    }, []);\n};\n/**\n * return a list of focusable nodes within an area marked as \"auto-focusable\"\n * @param parent\n */\nexport var getParentAutofocusables = function (parent) {\n    var parentFocus = parent.querySelectorAll(\"[\".concat(FOCUS_AUTO, \"]\"));\n    return toArray(parentFocus)\n        .map(function (node) { return getFocusables([node]); })\n        .reduce(function (acc, nodes) { return acc.concat(nodes); }, []);\n};\n","import { toArray } from './array';\nimport { isAutoFocusAllowedCached, isVisibleCached, notHiddenInput } from './is';\nimport { orderByTabIndex } from './tabOrder';\nimport { getFocusables, getParentAutofocusables } from './tabUtils';\n/**\n * given list of focusable elements keeps the ones user can interact with\n * @param nodes\n * @param visibilityCache\n */\nexport var filterFocusable = function (nodes, visibilityCache) {\n    return toArray(nodes)\n        .filter(function (node) { return isVisibleCached(visibilityCache, node); })\n        .filter(function (node) { return notHiddenInput(node); });\n};\nexport var filterAutoFocusable = function (nodes, cache) {\n    if (cache === void 0) { cache = new Map(); }\n    return toArray(nodes).filter(function (node) { return isAutoFocusAllowedCached(cache, node); });\n};\n/**\n * only tabbable ones\n * (but with guards which would be ignored)\n */\nexport var getTabbableNodes = function (topNodes, visibilityCache, withGuards) {\n    return orderByTabIndex(filterFocusable(getFocusables(topNodes, withGuards), visibilityCache), true, withGuards);\n};\n/**\n * actually anything \"focusable\", not only tabbable\n * (without guards, as long as they are not expected to be focused)\n */\nexport var getAllTabbableNodes = function (topNodes, visibilityCache) {\n    return orderByTabIndex(filterFocusable(getFocusables(topNodes), visibilityCache), false);\n};\n/**\n * return list of nodes which are expected to be auto-focused\n * @param topNode\n * @param visibilityCache\n */\nexport var parentAutofocusables = function (topNode, visibilityCache) {\n    return filterFocusable(getParentAutofocusables(topNode), visibilityCache);\n};\n/*\n * Determines if element is contained in scope, including nested shadow DOMs\n */\nexport var contains = function (scope, element) {\n    return ((scope.shadowRoot\n        ? contains(scope.shadowRoot, element)\n        : scope.contains(element)) || Array.from(scope.children).some(function (child) { return contains(child, element); }));\n};\n","import { FOCUS_DISABLED, FOCUS_GROUP } from '../constants';\nimport { asArray, toArray } from './array';\n/**\n * in case of multiple nodes nested inside each other\n * keeps only top ones\n * this is O(nlogn)\n * @param nodes\n * @returns {*}\n */\nvar filterNested = function (nodes) {\n    var contained = new Set();\n    var l = nodes.length;\n    for (var i = 0; i < l; i += 1) {\n        for (var j = i + 1; j < l; j += 1) {\n            var position = nodes[i].compareDocumentPosition(nodes[j]);\n            /* eslint-disable no-bitwise */\n            if ((position & Node.DOCUMENT_POSITION_CONTAINED_BY) > 0) {\n                contained.add(j);\n            }\n            if ((position & Node.DOCUMENT_POSITION_CONTAINS) > 0) {\n                contained.add(i);\n            }\n            /* eslint-enable */\n        }\n    }\n    return nodes.filter(function (_, index) { return !contained.has(index); });\n};\n/**\n * finds top most parent for a node\n * @param node\n * @returns {*}\n */\nvar getTopParent = function (node) {\n    return node.parentNode ? getTopParent(node.parentNode) : node;\n};\n/**\n * returns all \"focus containers\" inside a given node\n * @param node\n * @returns {T}\n */\nexport var getAllAffectedNodes = function (node) {\n    var nodes = asArray(node);\n    return nodes.filter(Boolean).reduce(function (acc, currentNode) {\n        var group = currentNode.getAttribute(FOCUS_GROUP);\n        acc.push.apply(acc, (group\n            ? filterNested(toArray(getTopParent(currentNode).querySelectorAll(\"[\".concat(FOCUS_GROUP, \"=\\\"\").concat(group, \"\\\"]:not([\").concat(FOCUS_DISABLED, \"=\\\"disabled\\\"])\"))))\n            : [currentNode]));\n        return acc;\n    }, []);\n};\n","var getNestedShadowActiveElement = function (shadowRoot) {\n    return shadowRoot.activeElement\n        ? shadowRoot.activeElement.shadowRoot\n            ? getNestedShadowActiveElement(shadowRoot.activeElement.shadowRoot)\n            : shadowRoot.activeElement\n        : undefined;\n};\n/**\n * returns active element from document or from nested shadowdoms\n */\nexport var getActiveElement = function () {\n    return (document.activeElement\n        ? document.activeElement.shadowRoot\n            ? getNestedShadowActiveElement(document.activeElement.shadowRoot)\n            : document.activeElement\n        : undefined); // eslint-disable-next-line @typescript-eslint/no-explicit-any\n};\n","import { contains } from './utils/DOMutils';\nimport { getAllAffectedNodes } from './utils/all-affected';\nimport { toArray } from './utils/array';\nimport { getActiveElement } from './utils/getActiveElement';\nvar focusInFrame = function (frame) { return frame === document.activeElement; };\nvar focusInsideIframe = function (topNode) {\n    return Boolean(toArray(topNode.querySelectorAll('iframe')).some(function (node) { return focusInFrame(node); }));\n};\n/**\n * @returns {Boolean} true, if the current focus is inside given node or nodes\n */\nexport var focusInside = function (topNode) {\n    var activeElement = document && getActiveElement();\n    if (!activeElement || (activeElement.dataset && activeElement.dataset.focusGuard)) {\n        return false;\n    }\n    return getAllAffectedNodes(topNode).some(function (node) { return contains(node, activeElement) || focusInsideIframe(node); });\n};\n","import { FOCUS_ALLOW } from './constants';\nimport { contains } from './utils/DOMutils';\nimport { toArray } from './utils/array';\nimport { getActiveElement } from './utils/getActiveElement';\n/**\n * focus is hidden FROM the focus-lock\n * ie contained inside a node focus-lock shall ignore\n * @returns {boolean} focus is currently is in \"allow\" area\n */\nexport var focusIsHidden = function () {\n    var activeElement = document && getActiveElement();\n    if (!activeElement) {\n        return false;\n    }\n    // this does not support setting FOCUS_ALLOW within shadow dom\n    return toArray(document.querySelectorAll(\"[\".concat(FOCUS_ALLOW, \"]\"))).some(function (node) { return contains(node, activeElement); });\n};\n","import { isRadioElement } from './is';\nvar findSelectedRadio = function (node, nodes) {\n    return nodes\n        .filter(isRadioElement)\n        .filter(function (el) { return el.name === node.name; })\n        .filter(function (el) { return el.checked; })[0] || node;\n};\nexport var correctNode = function (node, nodes) {\n    if (isRadioElement(node) && node.name) {\n        return findSelectedRadio(node, nodes);\n    }\n    return node;\n};\n/**\n * giving a set of radio inputs keeps only selected (tabbable) ones\n * @param nodes\n */\nexport var correctNodes = function (nodes) {\n    // IE11 has no Set(array) constructor\n    var resultSet = new Set();\n    nodes.forEach(function (node) { return resultSet.add(correctNode(node, nodes)); });\n    // using filter to support IE11\n    return nodes.filter(function (node) { return resultSet.has(node); });\n};\n","import { correctNode } from './correctFocus';\nexport var pickFirstFocus = function (nodes) {\n    if (nodes[0] && nodes.length > 1) {\n        return correctNode(nodes[0], nodes);\n    }\n    return nodes[0];\n};\nexport var pickFocusable = function (nodes, index) {\n    if (nodes.length > 1) {\n        return nodes.indexOf(correctNode(nodes[index], nodes));\n    }\n    return index;\n};\n","import { correctNodes } from './utils/correctFocus';\nimport { pickFocusable } from './utils/firstFocus';\nimport { isGuard } from './utils/is';\nexport var NEW_FOCUS = 'NEW_FOCUS';\n/**\n * Main solver for the \"find next focus\" question\n * @param innerNodes\n * @param outerNodes\n * @param activeElement\n * @param lastNode\n * @returns {number|string|undefined|*}\n */\nexport var newFocus = function (innerNodes, outerNodes, activeElement, lastNode) {\n    var cnt = innerNodes.length;\n    var firstFocus = innerNodes[0];\n    var lastFocus = innerNodes[cnt - 1];\n    var isOnGuard = isGuard(activeElement);\n    // focus is inside\n    if (activeElement && innerNodes.indexOf(activeElement) >= 0) {\n        return undefined;\n    }\n    var activeIndex = activeElement !== undefined ? outerNodes.indexOf(activeElement) : -1;\n    var lastIndex = lastNode ? outerNodes.indexOf(lastNode) : activeIndex;\n    var lastNodeInside = lastNode ? innerNodes.indexOf(lastNode) : -1;\n    var indexDiff = activeIndex - lastIndex;\n    var firstNodeIndex = outerNodes.indexOf(firstFocus);\n    var lastNodeIndex = outerNodes.indexOf(lastFocus);\n    var correctedNodes = correctNodes(outerNodes);\n    var correctedIndex = activeElement !== undefined ? correctedNodes.indexOf(activeElement) : -1;\n    var correctedIndexDiff = correctedIndex - (lastNode ? correctedNodes.indexOf(lastNode) : activeIndex);\n    var returnFirstNode = pickFocusable(innerNodes, 0);\n    var returnLastNode = pickFocusable(innerNodes, cnt - 1);\n    // new focus\n    if (activeIndex === -1 || lastNodeInside === -1) {\n        return NEW_FOCUS;\n    }\n    // old focus\n    if (!indexDiff && lastNodeInside >= 0) {\n        return lastNodeInside;\n    }\n    // first element\n    if (activeIndex <= firstNodeIndex && isOnGuard && Math.abs(indexDiff) > 1) {\n        return returnLastNode;\n    }\n    // last element\n    if (activeIndex >= lastNodeIndex && isOnGuard && Math.abs(indexDiff) > 1) {\n        return returnFirstNode;\n    }\n    // jump out, but not on the guard\n    if (indexDiff && Math.abs(correctedIndexDiff) > 1) {\n        return lastNodeInside;\n    }\n    // focus above lock\n    if (activeIndex <= firstNodeIndex) {\n        return returnLastNode;\n    }\n    // focus below lock\n    if (activeIndex > lastNodeIndex) {\n        return returnFirstNode;\n    }\n    // index is inside tab order, but outside Lock\n    if (indexDiff) {\n        if (Math.abs(indexDiff) > 1) {\n            return lastNodeInside;\n        }\n        return (cnt + lastNodeInside + indexDiff) % cnt;\n    }\n    // do nothing\n    return undefined;\n};\n","import { parentAutofocusables } from './DOMutils';\nimport { contains } from './DOMutils';\nimport { asArray } from './array';\nvar getParents = function (node, parents) {\n    if (parents === void 0) { parents = []; }\n    parents.push(node);\n    if (node.parentNode) {\n        getParents(node.parentNode.host || node.parentNode, parents);\n    }\n    return parents;\n};\n/**\n * finds a parent for both nodeA and nodeB\n * @param nodeA\n * @param nodeB\n * @returns {boolean|*}\n */\nexport var getCommonParent = function (nodeA, nodeB) {\n    var parentsA = getParents(nodeA);\n    var parentsB = getParents(nodeB);\n    // tslint:disable-next-line:prefer-for-of\n    for (var i = 0; i < parentsA.length; i += 1) {\n        var currentParent = parentsA[i];\n        if (parentsB.indexOf(currentParent) >= 0) {\n            return currentParent;\n        }\n    }\n    return false;\n};\nexport var getTopCommonParent = function (baseActiveElement, leftEntry, rightEntries) {\n    var activeElements = asArray(baseActiveElement);\n    var leftEntries = asArray(leftEntry);\n    var activeElement = activeElements[0];\n    var topCommon = false;\n    leftEntries.filter(Boolean).forEach(function (entry) {\n        topCommon = getCommonParent(topCommon || entry, entry) || topCommon;\n        rightEntries.filter(Boolean).forEach(function (subEntry) {\n            var common = getCommonParent(activeElement, subEntry);\n            if (common) {\n                if (!topCommon || contains(common, topCommon)) {\n                    topCommon = common;\n                }\n                else {\n                    topCommon = getCommonParent(common, topCommon);\n                }\n            }\n        });\n    });\n    // TODO: add assert here?\n    return topCommon;\n};\n/**\n * return list of nodes which are expected to be autofocused inside a given top nodes\n * @param entries\n * @param visibilityCache\n */\nexport var allParentAutofocusables = function (entries, visibilityCache) {\n    return entries.reduce(function (acc, node) { return acc.concat(parentAutofocusables(node, visibilityCache)); }, []);\n};\n","import { NEW_FOCUS, newFocus } from './solver';\nimport { filterAutoFocusable, getAllTabbableNodes, getTabbableNodes } from './utils/DOMutils';\nimport { getAllAffectedNodes } from './utils/all-affected';\nimport { pickFirstFocus } from './utils/firstFocus';\nimport { getActiveElement } from './utils/getActiveElement';\nimport { getDataset, isDefined, isNotAGuard } from './utils/is';\nimport { allParentAutofocusables, getTopCommonParent } from './utils/parenting';\nvar findAutoFocused = function (autoFocusables) {\n    return function (node) { var _a; \n    // @ts-expect-error\n    return node.autofocus || !!((_a = getDataset(node)) === null || _a === void 0 ? void 0 : _a.autofocus) || autoFocusables.indexOf(node) >= 0; };\n};\nvar reorderNodes = function (srcNodes, dstNodes) {\n    var remap = new Map();\n    // no Set(dstNodes) for IE11 :(\n    dstNodes.forEach(function (entity) { return remap.set(entity.node, entity); });\n    // remap to dstNodes\n    return srcNodes.map(function (node) { return remap.get(node); }).filter(isDefined);\n};\n/**\n * given top node(s) and the last active element return the element to be focused next\n * @param topNode\n * @param lastNode\n */\nexport var getFocusMerge = function (topNode, lastNode) {\n    var activeElement = document && getActiveElement();\n    var entries = getAllAffectedNodes(topNode).filter(isNotAGuard);\n    var commonParent = getTopCommonParent(activeElement || topNode, topNode, entries);\n    var visibilityCache = new Map();\n    var anyFocusable = getAllTabbableNodes(entries, visibilityCache);\n    var innerElements = getTabbableNodes(entries, visibilityCache).filter(function (_a) {\n        var node = _a.node;\n        return isNotAGuard(node);\n    });\n    if (!innerElements[0]) {\n        innerElements = anyFocusable;\n        if (!innerElements[0]) {\n            return undefined;\n        }\n    }\n    var outerNodes = getAllTabbableNodes([commonParent], visibilityCache).map(function (_a) {\n        var node = _a.node;\n        return node;\n    });\n    var orderedInnerElements = reorderNodes(outerNodes, innerElements);\n    var innerNodes = orderedInnerElements.map(function (_a) {\n        var node = _a.node;\n        return node;\n    });\n    var newId = newFocus(innerNodes, outerNodes, activeElement, lastNode);\n    if (newId === NEW_FOCUS) {\n        var autoFocusable = filterAutoFocusable(anyFocusable.map(function (_a) {\n            var node = _a.node;\n            return node;\n        })).filter(findAutoFocused(allParentAutofocusables(entries, visibilityCache)));\n        return {\n            node: autoFocusable && autoFocusable.length\n                ? pickFirstFocus(autoFocusable)\n                : pickFirstFocus(filterAutoFocusable(innerNodes)),\n        };\n    }\n    if (newId === undefined) {\n        return newId;\n    }\n    return orderedInnerElements[newId];\n};\n","import { getTabbableNodes } from './utils/DOMutils';\nimport { getAllAffectedNodes } from './utils/all-affected';\nimport { isGuard, isNotAGuard } from './utils/is';\nimport { getTopCommonParent } from './utils/parenting';\n/**\n * return list of focusable elements inside a given top node\n * @deprecated use {@link getFocusableIn}. Yep, there is typo in the function name\n */\nexport var getFocusabledIn = function (topNode) {\n    var entries = getAllAffectedNodes(topNode).filter(isNotAGuard);\n    var commonParent = getTopCommonParent(topNode, topNode, entries);\n    var visibilityCache = new Map();\n    var outerNodes = getTabbableNodes([commonParent], visibilityCache, true);\n    var innerElements = getTabbableNodes(entries, visibilityCache)\n        .filter(function (_a) {\n        var node = _a.node;\n        return isNotAGuard(node);\n    })\n        .map(function (_a) {\n        var node = _a.node;\n        return node;\n    });\n    return outerNodes.map(function (_a) {\n        var node = _a.node, index = _a.index;\n        return ({\n            node: node,\n            index: index,\n            lockItem: innerElements.indexOf(node) >= 0,\n            guard: isGuard(node),\n        });\n    });\n};\n/**\n * return list of focusable elements inside a given top node\n */\nexport var getFocusableIn = getFocusabledIn;\n","import { getFocusMerge } from './focusMerge';\nexport var focusOn = function (target, focusOptions) {\n    if ('focus' in target) {\n        target.focus(focusOptions);\n    }\n    if ('contentWindow' in target && target.contentWindow) {\n        target.contentWindow.focus();\n    }\n};\nvar guardCount = 0;\nvar lockDisabled = false;\n/**\n * Sets focus at a given node. The last focused element will help to determine which element(first or last) should be focused.\n * HTML markers (see {@link import('./constants').FOCUS_AUTO} constants) can control autofocus\n * @param topNode\n * @param lastNode\n * @param options\n */\nexport var setFocus = function (topNode, lastNode, options) {\n    if (options === void 0) { options = {}; }\n    var focusable = getFocusMerge(topNode, lastNode);\n    if (lockDisabled) {\n        return;\n    }\n    if (focusable) {\n        if (guardCount > 2) {\n            // tslint:disable-next-line:no-console\n            console.error('FocusLock: focus-fighting detected. Only one focus management system could be active. ' +\n                'See https://github.com/theKashey/focus-lock/#focus-fighting');\n            lockDisabled = true;\n            setTimeout(function () {\n                lockDisabled = false;\n            }, 1);\n            return;\n        }\n        guardCount++;\n        focusOn(focusable.node, options.focusOptions);\n        guardCount--;\n    }\n};\n","export enum BentoFocusTrapArrowNavigationDirection {\n    VERTICAL = 'vertical',\n    HORIZONTAL = 'horizontal',\n}\n\nexport enum BentoFocusTrapVerticalNavigationEvent {\n    ARROW_UP = 'arrowup',\n    ARROW_DOWN = 'arrowdown',\n}\n\nexport enum BentoFocusTrapHorizontalNavigationEvent {\n    ARROW_LEFT = 'arrowleft',\n    ARROW_RIGHT = 'arrowright',\n}\n\nexport interface BentoFocusTrapFocusableIn {\n    node: HTMLElement;\n    /**\n     * tab index\n     */\n    index: number;\n    /**\n     * true, if this node belongs to a Lock\n     */\n    lockItem: boolean;\n    /**\n     * true, if this node is a focus-guard (system node)\n     */\n    guard: boolean;\n}\n","import { getFocusableIn } from 'focus-lock';\nimport {\n    BentoFocusTrapFocusableIn,\n    BentoFocusTrapHorizontalNavigationEvent,\n    BentoFocusTrapVerticalNavigationEvent,\n} from '@/components/focus-trap/focus-trap.types';\n\n/**\n * Perform callback before next re-paint frame of browser.\n *\n * @param action\n * @returns\n */\nexport const deferAction = (callback: FrameRequestCallback) => requestAnimationFrame(callback);\n\n/**\n * Get's the index number of the current node inside an array of focusable elements.\n *\n * @param node an HTMLElement node\n * @param nodes an array of focusable elements\n * @returns\n */\nconst getNodeIndex = (node: Element, nodes: BentoFocusTrapFocusableIn[]) => {\n    const index = nodes.findIndex(item => item.node === node);\n    return index === -1 ? 0 : index;\n};\n\n/**\n * Retrieves the next focusable element using a factor to either choose\n * the next or previous focusable element.\n *\n * @param factor a number +1 or -1\n * @param element the element to checks for focusable elements inside of\n * @returns\n */\nexport const getNextFocusableElement = (factor, element): HTMLElement => {\n    const currentFocusedEl = document.activeElement;\n    const focusableElements = getFocusableIn(element);\n    const nextIndex = getNodeIndex(currentFocusedEl, focusableElements) + factor;\n    return focusableElements[nextIndex]?.node || (currentFocusedEl as HTMLElement);\n};\n\n/**\n * Returns an object is if keyboard event key is an arrow previous or next key.\n * this changes depending on if the arrow navigation is horizontal or vertical.\n *\n * @param event\n * @param arrowOrder\n * @returns { isArrowNext: boolean, isArrowPrev: boolean }\n */\nexport const getArrowType = (\n    event: KeyboardEvent,\n    arrowOrder: BentoFocusTrapVerticalNavigationEvent[] | BentoFocusTrapHorizontalNavigationEvent[]\n) => {\n    const eventKey = event.key.toLowerCase();\n    return {\n        isArrowNext: eventKey === arrowOrder[0],\n        isArrowPrev: eventKey === arrowOrder[1],\n    };\n};\n\n/**\n * Default scrolling into view options\n */\nexport const SCROLL_INTO_VIEW_OPTIONS: ScrollIntoViewOptions = {\n    behavior: 'smooth',\n    block: 'center',\n    inline: 'center',\n};\n","<template>\n    <div\n        v-if=\"useHasSlot($slots)('default')\"\n        ref=\"root\"\n        class=\"b-focus-trap\"\n        data-testid=\"focus-trap\"\n        tabindex=\"-1\"\n        v-on=\"arrowNavigation ? { keydown: onKeyDown } : {}\"\n        @focusout=\"onBlur\"\n    >\n        <slot></slot>\n    </div>\n</template>\n\n<script lang=\"ts\">\n    import { defineComponent, PropType } from 'vue';\n    import moveFocusInside, { focusInside, focusIsHidden } from 'focus-lock';\n    import {\n        BentoFocusTrapArrowNavigationDirection,\n        BentoFocusTrapHorizontalNavigationEvent,\n        BentoFocusTrapVerticalNavigationEvent,\n    } from './focus-trap.types';\n    import {\n        deferAction,\n        getArrowType,\n        getNextFocusableElement,\n        SCROLL_INTO_VIEW_OPTIONS,\n    } from '@/utils/ts/focus-trap.utils';\n    import { useHasSlot } from '@/composables';\n\n    /**\n     * Locks the focus inside an element for a11y navigation.\n     * Useful for things like modals, popovers, etc...\n     *\n     * @example\n     * import { BentoFocusTrap, BentoButton } from '@adyen/bento-vue2';\n     *\n     * export default {\n     *     components: { BentoFocusTrap, BentoButton },\n     *     template: `\n     *             <div id=\"import-choice\">\n     *                  <bento-focus-trap>\n     *                      Make a choice to proceed further!\n     *                      <bento-button>Yes</bento-button>\n     *                      <bento-button>No</bento-button>\n     *                  </bento-focus-trap>\n     *             </div>\n     *     `\n     * };\n     */\n    export default defineComponent({\n        name: 'bento-focus-trap',\n        props: {\n            /**\n             * Enables / Disables arrow navigation as well can determine the type of arrow navigation.\n             * The types of arrow navigation are horizontal and vertical.\n             */\n            arrowNavigation: {\n                type: String as PropType<BentoFocusTrapArrowNavigationDirection>,\n                default: undefined,\n                validator: value =>\n                    Object.values(BentoFocusTrapArrowNavigationDirection).includes(\n                        value as BentoFocusTrapArrowNavigationDirection\n                    ),\n            },\n            /**\n             * Enables / disables the focus trap.\n             */\n            disabled: {\n                type: Boolean,\n                default: false,\n            },\n        },\n        data: () => ({\n            lastFocusedElement: null,\n        }),\n        computed: {\n            isHorizontalArrowNavigation(): boolean {\n                return this.arrowNavigation === BentoFocusTrapArrowNavigationDirection.HORIZONTAL;\n            },\n            isVerticalArrowNavigation(): boolean {\n                return this.arrowNavigation === BentoFocusTrapArrowNavigationDirection.VERTICAL;\n            },\n            arrowOrder() {\n                return this.isVerticalArrowNavigation\n                    ? Object.values(BentoFocusTrapVerticalNavigationEvent)\n                    : Object.values(BentoFocusTrapHorizontalNavigationEvent);\n            },\n        },\n        watch: {\n            /**\n             * If the disabled prop changes, then enable / disable the focus trap.\n             */\n            disabled() {\n                if (this.disabled) {\n                    this.disable();\n                } else {\n                    this.setFocusInside();\n                }\n            },\n        },\n        mounted() {\n            if (this.disabled) {\n                return;\n            }\n            this.setFocusInside();\n        },\n        beforeUnmount() {\n            if (this.disabled) {\n                return;\n            }\n            this.disable();\n        },\n        methods: {\n            /**\n             * Set focus back inside the element area, giving the last focus element\n             * `focus-lock` can determine the next interable element to focus on.\n             */\n            async setFocusInside() {\n                const isFocusOnBody = document.activeElement === document.body;\n                if (isFocusOnBody || focusIsHidden() || !this.lastFocusedElement) {\n                    if (!focusInside(this.$refs.root as HTMLElement)) {\n                        moveFocusInside(this.$refs.root as HTMLElement, this.lastFocusedElement, {\n                            focusOptions: { preventScroll: true },\n                        });\n                    }\n                    this.lastFocusedElement = document.activeElement;\n                }\n            },\n            /**\n             * On blur, trap the focus inside!\n             */\n            onBlur() {\n                if (this.disabled) {\n                    return;\n                }\n                deferAction(this.setFocusInside);\n            },\n            /**\n             * If the no arrow navigation is enabled\n             * or if the currently focus element is a textarea or an input then prevent navigation.\n             */\n            shouldPreventNavigation() {\n                if (!this.isVerticalArrowNavigation && !this.isHorizontalArrowNavigation) {\n                    return false;\n                }\n\n                const currentTag = document.activeElement.tagName.toLowerCase();\n                const possibleFormControls = this.isVerticalArrowNavigation\n                    ? ['textarea', 'select']\n                    : ['input', 'textarea'];\n                return possibleFormControls.includes(currentTag);\n            },\n            /**\n             * When an arrow key is pressed then navigate to the next focusable element.\n             * If trap is disabled or is content editable then prevent arrow navigation.\n             *\n             * @param event on keyboard press event\n             */\n            onKeyDown(event: KeyboardEvent) {\n                if (\n                    this.disabled ||\n                    (document.activeElement as HTMLElement).isContentEditable ||\n                    this.shouldPreventNavigation()\n                ) {\n                    return;\n                }\n\n                const { isArrowNext, isArrowPrev } = getArrowType(event, this.arrowOrder);\n                if (isArrowPrev || isArrowNext) {\n                    event.preventDefault();\n                    event.stopPropagation();\n                    const focusableEl = getNextFocusableElement(isArrowPrev ? 1 : -1, this.$el);\n                    focusableEl.focus();\n                    if ('scrollIntoView' in focusableEl) {\n                        const options =\n                            'scrollBehavior' in document.documentElement.style ? SCROLL_INTO_VIEW_OPTIONS : false;\n                        focusableEl.scrollIntoView(options);\n                    }\n                }\n            },\n            /**\n             * If focus trap is disabled then return focus to last focus element, parent node or simply the document body.\n             */\n            disable() {\n                const focusOnDestroyEl = this.lastFocusedElement || this.$el.parentNode || document.body;\n                if (focusOnDestroyEl) {\n                    focusOnDestroyEl.focus();\n                }\n            },\n            useHasSlot,\n        },\n    });\n</script>\n\n<style lang=\"scss\" scoped>\n    .b-focus-trap {\n        outline: none;\n    }\n</style>\n"],"names":["FOCUS_GROUP","FOCUS_DISABLED","FOCUS_ALLOW","FOCUS_AUTO","FOCUS_NO_AUTOFOCUS","toArray","a","ret","i","asArray","isElementHidden","node","computedStyle","getParentNode","isTopNode","isVisibleUncached","checkParent","isVisibleCached","visibilityCache","cached","result","isAutoFocusAllowedUncached","isAutoFocusAllowed","isAutoFocusAllowedCached","cache","getDataset","isHTMLButtonElement","isHTMLInputElement","isRadioElement","notHiddenInput","attribute","isGuard","_a","isNotAGuard","isDefined","x","tabSort","b","tabDiff","indexDiff","orderByTabIndex","nodes","filterNegative","keepGuards","index","data","tabbables","queryTabbables","queryGuardTabbables","getFocusablesWithShadowDom","parent","withGuards","acc","child","getFocusables","parents","getParentAutofocusables","parentFocus","filterFocusable","filterAutoFocusable","getTabbableNodes","topNodes","getAllTabbableNodes","parentAutofocusables","topNode","contains","scope","element","filterNested","contained","l","j","position","_","getTopParent","getAllAffectedNodes","currentNode","group","getNestedShadowActiveElement","shadowRoot","getActiveElement","focusInFrame","frame","focusInsideIframe","focusInside","activeElement","focusIsHidden","findSelectedRadio","el","correctNode","correctNodes","resultSet","pickFirstFocus","pickFocusable","NEW_FOCUS","newFocus","innerNodes","outerNodes","lastNode","cnt","firstFocus","lastFocus","isOnGuard","activeIndex","lastIndex","lastNodeInside","firstNodeIndex","lastNodeIndex","correctedNodes","correctedIndex","correctedIndexDiff","returnFirstNode","returnLastNode","getParents","getCommonParent","nodeA","nodeB","parentsA","parentsB","currentParent","getTopCommonParent","baseActiveElement","leftEntry","rightEntries","activeElements","leftEntries","topCommon","entry","subEntry","common","allParentAutofocusables","entries","findAutoFocused","autoFocusables","reorderNodes","srcNodes","dstNodes","remap","entity","getFocusMerge","commonParent","anyFocusable","innerElements","orderedInnerElements","newId","autoFocusable","getFocusabledIn","getFocusableIn","focusOn","target","focusOptions","guardCount","lockDisabled","setFocus","options","focusable","BentoFocusTrapArrowNavigationDirection","BentoFocusTrapArrowNavigationDirection2","BentoFocusTrapVerticalNavigationEvent","BentoFocusTrapVerticalNavigationEvent2","BentoFocusTrapHorizontalNavigationEvent","BentoFocusTrapHorizontalNavigationEvent2","deferAction","callback","getNodeIndex","item","getNextFocusableElement","factor","currentFocusedEl","focusableElements","nextIndex","getArrowType","event","arrowOrder","eventKey","SCROLL_INTO_VIEW_OPTIONS","_sfc_main","defineComponent","value","currentTag","isArrowNext","isArrowPrev","focusableEl","focusOnDestroyEl","useHasSlot"],"mappings":";;;;AAGO,IAAAA,IAAA,mBAIAC,KAAA,4BAIAC,KAAA,sBAKAC,KAAA,yBAKAC,KAAA,qBClBAC,IAAA,SAAAC,GAAA;AAEP,WADAC,IAAA,MAAAD,EAAA,MAAA,GACAE,IAAA,GAAAA,IAAAF,EAAA,QAAA,EAAAE;AACA,IAAAD,EAAAC,CAAA,IAAAF,EAAAE,CAAA;AAEA,SAAAD;AACA,GACOE,IAAA,SAAAH,GAAA;AAAA,SAAA,MAAA,QAAAA,CAAA,IAAAA,IAAA,CAAAA,CAAA;AAAA,GCTPI,KAAA,SAAAC,GAAA;AAGA,MAAAA,EAAA,aAAA,KAAA;AACA,WAAA;AAEA,MAAAC,IAAA,OAAA,iBAAAD,GAAA,IAAA;AACA,SAAA,CAAAC,KAAA,CAAAA,EAAA,mBACA,KAEAA,EAAA,iBAAA,SAAA,MAAA,UAAAA,EAAA,iBAAA,YAAA,MAAA;AACA,GACAC,IAAA,SAAAF,GAAA;AAEA,SAAAA,EAAA,cAAAA,EAAA,WAAA,aAAA,KAAA;AAAA;AAAA,IAEAA,EAAA,WAAA;AAAA,MACAA,EAAA;AACA,GACAG,IAAA,SAAAH,GAAA;AAEA,SAAAA,MAAA,YAAAA,KAAAA,EAAA,aAAA,KAAA;AACA,GACAI,KAAA,SAAAJ,GAAAK,GAAA;AACA,SAAA,CAAAL,KAAAG,EAAAH,CAAA,KAAA,CAAAD,GAAAC,CAAA,KAAAK,EAAAH,EAAAF,CAAA,CAAA;AACA,GACOM,IAAA,SAAAC,GAAAP,GAAA;AACP,MAAAQ,IAAAD,EAAA,IAAAP,CAAA;AACA,MAAAQ,MAAA;AACA,WAAAA;AAEA,MAAAC,IAAAL,GAAAJ,GAAAM,EAAA,KAAA,QAAAC,CAAA,CAAA;AACA,SAAAA,EAAA,IAAAP,GAAAS,CAAA,GACAA;AACA,GACAC,KAAA,SAAAV,GAAAK,GAAA;AACA,SAAAL,KAAA,CAAAG,EAAAH,CAAA,IAAAW,GAAAX,CAAA,IAAAK,EAAAH,EAAAF,CAAA,CAAA,IAAA,KAAA;AACA,GACOY,IAAA,SAAAC,GAAAb,GAAA;AACP,MAAAQ,IAAAK,EAAA,IAAAb,CAAA;AACA,MAAAQ,MAAA;AACA,WAAAA;AAEA,MAAAC,IAAAC,GAAAV,GAAAY,EAAA,KAAA,QAAAC,CAAA,CAAA;AACA,SAAAA,EAAA,IAAAb,GAAAS,CAAA,GACAA;AACA,GACOK,IAAA,SAAAd,GAAA;AAEP,SAAAA,EAAA;AACA,GACOe,KAAA,SAAAf,GAAA;AAAA,SAAAA,EAAA,YAAA;AAAA,GACAgB,IAAA,SAAAhB,GAAA;AAAA,SAAAA,EAAA,YAAA;AAAA,GACAiB,IAAA,SAAAjB,GAAA;AACP,SAAAgB,EAAAhB,CAAA,KAAAA,EAAA,SAAA;AACA,GACOkB,KAAA,SAAAlB,GAAA;AACP,SAAA,GAAAgB,EAAAhB,CAAA,KAAAe,GAAAf,CAAA,OAAAA,EAAA,SAAA,YAAAA,EAAA;AACA,GACOW,KAAA,SAAAX,GAAA;AACP,MAAAmB,IAAAnB,EAAA,aAAAP,EAAA;AACA,SAAA,CAAA,CAAA,IAAA,QAAA,EAAA,EAAA,SAAA0B,CAAA;AACA,GACOC,IAAA,SAAApB,GAAA;AAAA,MAAAqB;AAAA,SAAA,GAAArB,MAAA,GAAAqB,IAAAP,EAAAd,CAAA,OAAA,QAAAqB,MAAA,WAAAA,EAAA;AAAA,GACAC,IAAA,SAAAtB,GAAA;AAAA,SAAA,CAAAoB,EAAApB,CAAA;AAAA,GACAuB,KAAA,SAAAC,GAAA;AAAA,SAAA,EAAAA;AAAA,GCjEAC,KAAA,SAAA9B,GAAA+B,GAAA;AACP,MAAAC,IAAAhC,EAAA,WAAA+B,EAAA,UACAE,IAAAjC,EAAA,QAAA+B,EAAA;AACA,MAAAC,GAAA;AACA,QAAA,CAAAhC,EAAA;AACA,aAAA;AAEA,QAAA,CAAA+B,EAAA;AACA,aAAA;AAAA,EAEA;AACA,SAAAC,KAAAC;AACA,GACOC,IAAA,SAAAC,GAAAC,GAAAC,GAAA;AACP,SAAAtC,EAAAoC,CAAA,EACA,IAAA,SAAA9B,GAAAiC,GAAA;AAAA,WAAA;AAAA,MACA,MAAAjC;AAAA,MACA,OAAAiC;AAAA,MACA,UAAAD,KAAAhC,EAAA,aAAA,MAAAA,EAAA,WAAA,CAAA,GAAA,aAAA,IAAA,KAAAA,EAAA;AAAA,IACA;AAAA,EAAA,CAAA,EACA,OAAA,SAAAkC,GAAA;AAAA,WAAA,CAAAH,KAAAG,EAAA,YAAA;AAAA,EAAA,CAAA,EACA,KAAAT,EAAA;AACA,GCpBOU,KAAA;AAAA,EACP;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA;AAAA;AAAA,EAGA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACA,GClBAC,IAAAD,GAAA,KAAA,GAAA,GACAE,KAAA,GAAA,OAAAD,GAAA,sBAAA,GACAE,IAAA,SAAAC,GAAAC,GAAA;AACA,MAAAnB;AACA,SAAA3B,IAAA2B,IAAAkB,EAAA,gBAAA,QAAAlB,MAAA,SAAA,SAAAA,EAAA,aAAAkB,EAAA,QAAA,EAAA,OAAA,SAAAE,GAAAC,GAAA;AACA,WAAAD,EAAA,OAAAC,EAAA,QAAAF,IAAAH,KAAAD,CAAA,IAAA,CAAAM,CAAA,IAAA,CAAA,GAAAJ,EAAAI,CAAA,CAAA;AAAA,EACA,GAAA,CAAA,CAAA;AACA,GACOC,IAAA,SAAAC,GAAAJ,GAAA;AACP,SAAAI,EAAA,OAAA,SAAAH,GAAAF,GAAA;AACA,WAAAE,EAAA;AAAA;AAAA,MAEAH,EAAAC,GAAAC,CAAA;AAAA;AAAA,MAEAD,EAAA,aACA7C,EAAA6C,EAAA,WAAA,iBAAAH,CAAA,CAAA,EAAA,OAAA,SAAApC,GAAA;AAAA,eAAAA,MAAAuC;AAAA,MAAA,CAAA,IACA,CAAA;AAAA,IAAA;AAAA,EACA,GAAA,CAAA,CAAA;AACA,GAKOM,KAAA,SAAAN,GAAA;AACP,MAAAO,IAAAP,EAAA,iBAAA,IAAA,OAAA/C,IAAA,GAAA,CAAA;AACA,SAAAE,EAAAoD,CAAA,EACA,IAAA,SAAA9C,GAAA;AAAA,WAAA2C,EAAA,CAAA3C,CAAA,CAAA;AAAA,EAAA,CAAA,EACA,OAAA,SAAAyC,GAAAX,GAAA;AAAA,WAAAW,EAAA,OAAAX,CAAA;AAAA,EAAA,GAAA,CAAA,CAAA;AACA,GCtBOiB,IAAA,SAAAjB,GAAAvB,GAAA;AACP,SAAAb,EAAAoC,CAAA,EACA,OAAA,SAAA9B,GAAA;AAAA,WAAAM,EAAAC,GAAAP,CAAA;AAAA,EAAA,CAAA,EACA,OAAA,SAAAA,GAAA;AAAA,WAAAkB,GAAAlB,CAAA;AAAA,EAAA,CAAA;AACA,GACOgD,IAAA,SAAAlB,GAAAjB,GAAA;AACP,SAAAA,MAAA,WAAAA,IAAA,oBAAA,IAAA,IACAnB,EAAAoC,CAAA,EAAA,OAAA,SAAA9B,GAAA;AAAA,WAAAY,EAAAC,GAAAb,CAAA;AAAA,EAAA,CAAA;AACA,GAKOiD,IAAA,SAAAC,GAAA3C,GAAAiC,GAAA;AACP,SAAAX,EAAAkB,EAAAJ,EAAAO,GAAAV,CAAA,GAAAjC,CAAA,GAAA,IAAAiC,CAAA;AACA,GAKOW,IAAA,SAAAD,GAAA3C,GAAA;AACP,SAAAsB,EAAAkB,EAAAJ,EAAAO,CAAA,GAAA3C,CAAA,GAAA,EAAA;AACA,GAMO6C,KAAA,SAAAC,GAAA9C,GAAA;AACP,SAAAwC,EAAAF,GAAAQ,CAAA,GAAA9C,CAAA;AACA,GAIO+C,IAAA,SAAAC,GAAAC,GAAA;AACP,UAAAD,EAAA,aACAD,EAAAC,EAAA,YAAAC,CAAA,IACAD,EAAA,SAAAC,CAAA,MAAA,MAAA,KAAAD,EAAA,QAAA,EAAA,KAAA,SAAAb,GAAA;AAAA,WAAAY,EAAAZ,GAAAc,CAAA;AAAA,EAAA,CAAA;AACA,GCtCAC,KAAA,SAAA3B,GAAA;AAGA,WAFA4B,IAAA,oBAAA,IAAA,GACAC,IAAA7B,EAAA,QACAjC,IAAA,GAAAA,IAAA8D,GAAA9D,KAAA;AACA,aAAA+D,IAAA/D,IAAA,GAAA+D,IAAAD,GAAAC,KAAA,GAAA;AACA,UAAAC,IAAA/B,EAAAjC,CAAA,EAAA,wBAAAiC,EAAA8B,CAAA,CAAA;AAEA,OAAAC,IAAA,KAAA,kCAAA,KACAH,EAAA,IAAAE,CAAA,IAEAC,IAAA,KAAA,8BAAA,KACAH,EAAA,IAAA7D,CAAA;AAAA,IAGA;AAEA,SAAAiC,EAAA,OAAA,SAAAgC,GAAA7B,GAAA;AAAA,WAAA,CAAAyB,EAAA,IAAAzB,CAAA;AAAA,EAAA,CAAA;AACA,GAMA8B,IAAA,SAAA/D,GAAA;AACA,SAAAA,EAAA,aAAA+D,EAAA/D,EAAA,UAAA,IAAAA;AACA,GAMOgE,IAAA,SAAAhE,GAAA;AACP,MAAA8B,IAAAhC,EAAAE,CAAA;AACA,SAAA8B,EAAA,OAAA,OAAA,EAAA,OAAA,SAAAW,GAAAwB,GAAA;AACA,QAAAC,IAAAD,EAAA,aAAA5E,CAAA;AACA,WAAAoD,EAAA,KAAA,MAAAA,GAAAyB,IACAT,GAAA/D,EAAAqE,EAAAE,CAAA,EAAA,iBAAA,IAAA,OAAA5E,GAAA,IAAA,EAAA,OAAA6E,GAAA,UAAA,EAAA,OAAA5E,IAAA,eAAA,CAAA,CAAA,CAAA,IACA,CAAA2E,CAAA,CAAA,GACAxB;AAAA,EACA,GAAA,CAAA,CAAA;AACA,GCjDA0B,IAAA,SAAAC,GAAA;AACA,SAAAA,EAAA,gBACAA,EAAA,cAAA,aACAD,EAAAC,EAAA,cAAA,UAAA,IACAA,EAAA,gBACA;AACA,GAIOC,IAAA,WAAA;AACP,SAAA,SAAA,gBACA,SAAA,cAAA,aACAF,EAAA,SAAA,cAAA,UAAA,IACA,SAAA,gBACA;AACA,GCZAG,KAAA,SAAAC,GAAA;AAAA,SAAAA,MAAA,SAAA;AAAA,GACAC,KAAA,SAAAnB,GAAA;AACA,SAAA,EAAA3D,EAAA2D,EAAA,iBAAA,QAAA,CAAA,EAAA,KAAA,SAAArD,GAAA;AAAA,WAAAsE,GAAAtE,CAAA;AAAA,EAAA,CAAA;AACA,GAIOyE,KAAA,SAAApB,GAAA;AACP,MAAAqB,IAAA,YAAAL,EAAA;AACA,SAAA,CAAAK,KAAAA,EAAA,WAAAA,EAAA,QAAA,aACA,KAEAV,EAAAX,CAAA,EAAA,KAAA,SAAArD,GAAA;AAAA,WAAAsD,EAAAtD,GAAA0E,CAAA,KAAAF,GAAAxE,CAAA;AAAA,EAAA,CAAA;AACA,GCRO2E,KAAA,WAAA;AACP,MAAAD,IAAA,YAAAL,EAAA;AACA,SAAAK,IAIAhF,EAAA,SAAA,iBAAA,IAAA,OAAAH,IAAA,GAAA,CAAA,CAAA,EAAA,KAAA,SAAAS,GAAA;AAAA,WAAAsD,EAAAtD,GAAA0E,CAAA;AAAA,EAAA,CAAA,IAHA;AAIA,GCfAE,KAAA,SAAA5E,GAAA8B,GAAA;AACA,SAAAA,EACA,OAAAb,CAAA,EACA,OAAA,SAAA4D,GAAA;AAAA,WAAAA,EAAA,SAAA7E,EAAA;AAAA,EAAA,CAAA,EACA,OAAA,SAAA6E,GAAA;AAAA,WAAAA,EAAA;AAAA,EAAA,CAAA,EAAA,CAAA,KAAA7E;AACA,GACO8E,IAAA,SAAA9E,GAAA8B,GAAA;AACP,SAAAb,EAAAjB,CAAA,KAAAA,EAAA,OACA4E,GAAA5E,GAAA8B,CAAA,IAEA9B;AACA,GAKO+E,KAAA,SAAAjD,GAAA;AAEP,MAAAkD,IAAA,oBAAA,IAAA;AACA,SAAAlD,EAAA,QAAA,SAAA9B,GAAA;AAAA,WAAAgF,EAAA,IAAAF,EAAA9E,GAAA8B,CAAA,CAAA;AAAA,EAAA,CAAA,GAEAA,EAAA,OAAA,SAAA9B,GAAA;AAAA,WAAAgF,EAAA,IAAAhF,CAAA;AAAA,EAAA,CAAA;AACA,GCtBOiF,IAAA,SAAAnD,GAAA;AACP,SAAAA,EAAA,CAAA,KAAAA,EAAA,SAAA,IACAgD,EAAAhD,EAAA,CAAA,GAAAA,CAAA,IAEAA,EAAA,CAAA;AACA,GACOoD,IAAA,SAAApD,GAAAG,GAAA;AACP,SAAAH,EAAA,SAAA,IACAA,EAAA,QAAAgD,EAAAhD,EAAAG,CAAA,GAAAH,CAAA,CAAA,IAEAG;AACA,GCTOkD,IAAA,aASAC,KAAA,SAAAC,GAAAC,GAAAZ,GAAAa,GAAA;AACP,MAAAC,IAAAH,EAAA,QACAI,IAAAJ,EAAA,CAAA,GACAK,IAAAL,EAAAG,IAAA,CAAA,GACAG,IAAAvE,EAAAsD,CAAA;AAEA,MAAA,EAAAA,KAAAW,EAAA,QAAAX,CAAA,KAAA,IAGA;AAAA,QAAAkB,IAAAlB,MAAA,SAAAY,EAAA,QAAAZ,CAAA,IAAA,IACAmB,IAAAN,IAAAD,EAAA,QAAAC,CAAA,IAAAK,GACAE,IAAAP,IAAAF,EAAA,QAAAE,CAAA,IAAA,IACA3D,IAAAgE,IAAAC,GACAE,IAAAT,EAAA,QAAAG,CAAA,GACAO,IAAAV,EAAA,QAAAI,CAAA,GACAO,IAAAlB,GAAAO,CAAA,GACAY,KAAAxB,MAAA,SAAAuB,EAAA,QAAAvB,CAAA,IAAA,IACAyB,KAAAD,MAAAX,IAAAU,EAAA,QAAAV,CAAA,IAAAK,IACAQ,IAAAlB,EAAAG,GAAA,CAAA,GACAgB,IAAAnB,EAAAG,GAAAG,IAAA,CAAA;AAEA,QAAAI,MAAA,MAAAE,MAAA;AACA,aAAAX;AAGA,QAAA,CAAAvD,KAAAkE,KAAA;AACA,aAAAA;AAGA,QAAAF,KAAAG,KAAAJ,KAAA,KAAA,IAAA/D,CAAA,IAAA;AACA,aAAAyE;AAGA,QAAAT,KAAAI,KAAAL,KAAA,KAAA,IAAA/D,CAAA,IAAA;AACA,aAAAwE;AAGA,QAAAxE,KAAA,KAAA,IAAAuE,EAAA,IAAA;AACA,aAAAL;AAGA,QAAAF,KAAAG;AACA,aAAAM;AAGA,QAAAT,IAAAI;AACA,aAAAI;AAGA,QAAAxE;AACA,aAAA,KAAA,IAAAA,CAAA,IAAA,IACAkE,KAEAN,IAAAM,IAAAlE,KAAA4D;AAAA;AAIA,GClEAc,IAAA,SAAAtG,GAAA4C,GAAA;AACA,SAAAA,MAAA,WAAAA,IAAA,CAAA,IACAA,EAAA,KAAA5C,CAAA,GACAA,EAAA,cACAsG,EAAAtG,EAAA,WAAA,QAAAA,EAAA,YAAA4C,CAAA,GAEAA;AACA,GAOO2D,IAAA,SAAAC,GAAAC,GAAA;AAIP,WAHAC,IAAAJ,EAAAE,CAAA,GACAG,IAAAL,EAAAG,CAAA,GAEA5G,IAAA,GAAAA,IAAA6G,EAAA,QAAA7G,KAAA,GAAA;AACA,QAAA+G,IAAAF,EAAA7G,CAAA;AACA,QAAA8G,EAAA,QAAAC,CAAA,KAAA;AACA,aAAAA;AAAA,EAEA;AACA,SAAA;AACA,GACOC,IAAA,SAAAC,GAAAC,GAAAC,GAAA;AACP,MAAAC,IAAAnH,EAAAgH,CAAA,GACAI,IAAApH,EAAAiH,CAAA,GACArC,IAAAuC,EAAA,CAAA,GACAE,IAAA;AACA,SAAAD,EAAA,OAAA,OAAA,EAAA,QAAA,SAAAE,GAAA;AACA,IAAAD,IAAAZ,EAAAY,KAAAC,GAAAA,CAAA,KAAAD,GACAH,EAAA,OAAA,OAAA,EAAA,QAAA,SAAAK,GAAA;AACA,UAAAC,IAAAf,EAAA7B,GAAA2C,CAAA;AACA,MAAAC,MACA,CAAAH,KAAA7D,EAAAgE,GAAAH,CAAA,IACAA,IAAAG,IAGAH,IAAAZ,EAAAe,GAAAH,CAAA;AAAA,IAGA,CAAA;AAAA,EACA,CAAA,GAEAA;AACA,GAMOI,KAAA,SAAAC,GAAAjH,GAAA;AACP,SAAAiH,EAAA,OAAA,SAAA/E,GAAAzC,GAAA;AAAA,WAAAyC,EAAA,OAAAW,GAAApD,GAAAO,CAAA,CAAA;AAAA,EAAA,GAAA,CAAA,CAAA;AACA,GCnDAkH,KAAA,SAAAC,GAAA;AACA,SAAA,SAAA1H,GAAA;AAAA,QAAAqB;AAEA,WAAArB,EAAA,aAAA,CAAA,EAAA,GAAAqB,IAAAP,EAAAd,CAAA,OAAA,QAAAqB,MAAA,WAAAA,EAAA,cAAAqG,EAAA,QAAA1H,CAAA,KAAA;AAAA,EAAA;AACA,GACA2H,KAAA,SAAAC,GAAAC,GAAA;AACA,MAAAC,IAAA,oBAAA,IAAA;AAEA,SAAAD,EAAA,QAAA,SAAAE,GAAA;AAAA,WAAAD,EAAA,IAAAC,EAAA,MAAAA,CAAA;AAAA,EAAA,CAAA,GAEAH,EAAA,IAAA,SAAA5H,GAAA;AAAA,WAAA8H,EAAA,IAAA9H,CAAA;AAAA,EAAA,CAAA,EAAA,OAAAuB,EAAA;AACA,GAMOyG,KAAA,SAAA3E,GAAAkC,GAAA;AACP,MAAAb,IAAA,YAAAL,EAAA,GACAmD,IAAAxD,EAAAX,CAAA,EAAA,OAAA/B,CAAA,GACA2G,IAAApB,EAAAnC,KAAArB,GAAAA,GAAAmE,CAAA,GACAjH,IAAA,oBAAA,IAAA,GACA2H,IAAA/E,EAAAqE,GAAAjH,CAAA,GACA4H,IAAAlF,EAAAuE,GAAAjH,CAAA,EAAA,OAAA,SAAAc,GAAA;AACA,QAAArB,IAAAqB,EAAA;AACA,WAAAC,EAAAtB,CAAA;AAAA,EACA,CAAA;AACA,MAAA,GAAAmI,EAAA,CAAA,MACAA,IAAAD,GACA,CAAAC,EAAA,CAAA,KAIA;AAAA,QAAA7C,IAAAnC,EAAA,CAAA8E,CAAA,GAAA1H,CAAA,EAAA,IAAA,SAAAc,GAAA;AACA,UAAArB,IAAAqB,EAAA;AACA,aAAArB;AAAA,IACA,CAAA,GACAoI,IAAAT,GAAArC,GAAA6C,CAAA,GACA9C,IAAA+C,EAAA,IAAA,SAAA/G,GAAA;AACA,UAAArB,IAAAqB,EAAA;AACA,aAAArB;AAAA,IACA,CAAA,GACAqI,IAAAjD,GAAAC,GAAAC,GAAAZ,GAAAa,CAAA;AACA,QAAA8C,MAAAlD,GAAA;AACA,UAAAmD,IAAAtF,EAAAkF,EAAA,IAAA,SAAA7G,GAAA;AACA,YAAArB,IAAAqB,EAAA;AACA,eAAArB;AAAA,MACA,CAAA,CAAA,EAAA,OAAAyH,GAAAF,GAAAC,GAAAjH,CAAA,CAAA,CAAA;AACA,aAAA;AAAA,QACA,MAAA+H,KAAAA,EAAA,SACArD,EAAAqD,CAAA,IACArD,EAAAjC,EAAAqC,CAAA,CAAA;AAAA,MACA;AAAA,IACA;AACA,WAAAgD,MAAA,SACAA,IAEAD,EAAAC,CAAA;AAAA;AACA,GCzDOE,KAAA,SAAAlF,GAAA;AACP,MAAAmE,IAAAxD,EAAAX,CAAA,EAAA,OAAA/B,CAAA,GACA2G,IAAApB,EAAAxD,GAAAA,GAAAmE,CAAA,GACAjH,IAAA,oBAAA,IAAA,GACA+E,IAAArC,EAAA,CAAAgF,CAAA,GAAA1H,GAAA,EAAA,GACA4H,IAAAlF,EAAAuE,GAAAjH,CAAA,EACA,OAAA,SAAAc,GAAA;AACA,QAAArB,IAAAqB,EAAA;AACA,WAAAC,EAAAtB,CAAA;AAAA,EACA,CAAA,EACA,IAAA,SAAAqB,GAAA;AACA,QAAArB,IAAAqB,EAAA;AACA,WAAArB;AAAA,EACA,CAAA;AACA,SAAAsF,EAAA,IAAA,SAAAjE,GAAA;AACA,QAAArB,IAAAqB,EAAA,MAAAY,IAAAZ,EAAA;AACA,WAAA;AAAA,MACA,MAAArB;AAAA,MACA,OAAAiC;AAAA,MACA,UAAAkG,EAAA,QAAAnI,CAAA,KAAA;AAAA,MACA,OAAAoB,EAAApB,CAAA;AAAA,IACA;AAAA,EACA,CAAA;AACA,GAIOwI,KAAAD,IClCAE,KAAA,SAAAC,GAAAC,GAAA;AACP,EAAA,WAAAD,KACAA,EAAA,MAAAC,CAAA,GAEA,mBAAAD,KAAAA,EAAA,iBACAA,EAAA,cAAA,MAAA;AAEA,GACAE,IAAA,GACAC,IAAA,IAQOC,KAAA,SAAAzF,GAAAkC,GAAAwD,GAAA;AACP,EAAAA,MAAA,WAAAA,IAAA,CAAA;AACA,MAAAC,IAAAhB,GAAA3E,GAAAkC,CAAA;AACA,MAAA,CAAAsD,KAGAG,GAAA;AACA,QAAAJ,IAAA,GAAA;AAEA,cAAA,MAAA,mJACA,GACAC,IAAA,IACA,WAAA,WAAA;AACA,QAAAA,IAAA;AAAA,MACA,GAAA,CAAA;AACA;AAAA,IACA;AACA,IAAAD,KACAH,GAAAO,EAAA,MAAAD,EAAA,YAAA,GACAH;AAAA,EACA;AACA,GCvCYK,IAAA,kBAAAC,OACRA,EAAA,WAAA,YACAA,EAAA,aAAA,cAFQA,IAAAD,KAAA,CAAA,CAAA,GAKAE,IAAA,kBAAAC,OACRA,EAAA,WAAA,WACAA,EAAA,aAAA,aAFQA,IAAAD,KAAA,CAAA,CAAA,GAKAE,IAAA,kBAAAC,OACRA,EAAA,aAAA,aACAA,EAAA,cAAA,cAFQA,IAAAD,KAAA,CAAA,CAAA;ACGL,MAAAE,KAAA,CAAAC,MAAA,sBAAAA,CAAA,GASPC,KAAA,CAAAzJ,GAAA8B,MAAA;AACI,QAAAG,IAAAH,EAAA,UAAA,CAAA4H,MAAAA,EAAA,SAAA1J,CAAA;AACA,SAAAiC,MAAA,KAAA,IAAAA;AACJ,GAUa0H,KAAA,CAAAC,GAAApG,MAAA;;AACT,QAAAqG,IAAA,SAAA,eACAC,IAAAtB,GAAAhF,CAAA,GACAuG,IAAAN,GAAAI,GAAAC,CAAA,IAAAF;AACA,WAAAvI,IAAAyI,EAAAC,CAAA,MAAA,gBAAA1I,EAAA,SAAAwI;AACJ,GAUaG,KAAA,CAAAC,GAAAC,MAAA;AAIT,QAAAC,IAAAF,EAAA,IAAA,YAAA;AACA,SAAA;AAAA,IAAO,aAAAE,MAAAD,EAAA,CAAA;AAAA,IACmC,aAAAC,MAAAD,EAAA,CAAA;AAAA,EACA;AAE9C,GAKOE,KAAA;AAAA,EAAwD,UAAA;AAAA,EACjD,OAAA;AAAA,EACH,QAAA;AAEX,GClBAC,KAAAC,GAAA;AAAA,EAAA,MAAA;AAAA,EACA,OAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IACA,iBAAA;AAAA,MAKA,MAAA;AAAA,MACA,SAAA;AAAA,MACA,WAAA,CAAAC,MAAA,OAAA,OAAAtB,CAAA,EAAA;AAAA,QAEAsB;AAAA,MACA;AAAA,IACA;AAAA;AAAA;AAAA;AAAA,IACA,UAAA;AAAA,MAIA,MAAA;AAAA,MACA,SAAA;AAAA,IACA;AAAA,EACA;AAAA,EACA,MAAA,OAAA;AAAA,IACA,oBAAA;AAAA,EACA;AAAA,EACA,UAAA;AAAA,IACA,8BAAA;AAEA,aAAA,KAAA,oBAAAtB,EAAA;AAAA,IAAA;AAAA,IACA,4BAAA;AAEA,aAAA,KAAA,oBAAAA,EAAA;AAAA,IAAA;AAAA,IACA,aAAA;AAEA,aAAA,KAAA,4BAAA,OAAA,OAAAE,CAAA,IAAA,OAAA,OAAAE,CAAA;AAAA,IAEA;AAAA,EACA;AAAA,EACA,OAAA;AAAA;AAAA;AAAA;AAAA,IACA,WAAA;AAKA,MAAA,KAAA,WACA,KAAA,QAAA,IAEA,KAAA,eAAA;AAAA,IACA;AAAA,EACA;AAAA,EACA,UAAA;AAEA,IAAA,KAAA,YAGA,KAAA,eAAA;AAAA,EAAA;AAAA,EACA,gBAAA;AAEA,IAAA,KAAA,YAGA,KAAA,QAAA;AAAA,EAAA;AAAA,EACA,SAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IACA,MAAA,iBAAA;AAOA,OADA,SAAA,kBAAA,SAAA,QACA1E,GAAA,KAAA,CAAA,KAAA,wBACAF,GAAA,KAAA,MAAA,IAAA,KACAqE,GAAA,KAAA,MAAA,MAAA,KAAA,oBAAA;AAAA,QAAA,cAAA,EAAA,eAAA,GAAA;AAAA,MACA,CAAA,GAGA,KAAA,qBAAA,SAAA;AAAA,IACA;AAAA;AAAA;AAAA;AAAA,IACA,SAAA;AAKA,MAAA,KAAA,YAGAS,GAAA,KAAA,cAAA;AAAA,IAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IACA,0BAAA;AAMA,UAAA,CAAA,KAAA,6BAAA,CAAA,KAAA;AACA,eAAA;AAGA,YAAAiB,IAAA,SAAA,cAAA,QAAA,YAAA;AAIA,cAHA,KAAA,4BAAA,CAAA,YAAA,QAAA,IAAA,CAAA,SAAA,UAAA,GAGA,SAAAA,CAAA;AAAA,IAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IACA,UAAAP,GAAA;AAQA,UAAA,KAAA,YAAA,SAAA,cAAA,qBAAA,KAAA,wBAAA;AAKA;AAGA,YAAA,EAAA,aAAAQ,GAAA,aAAAC,EAAA,IAAAV,GAAAC,GAAA,KAAA,UAAA;AACA,UAAAS,KAAAD,GAAA;AACA,QAAAR,EAAA,eAAA,GACAA,EAAA,gBAAA;AACA,cAAAU,IAAAhB,GAAAe,IAAA,IAAA,IAAA,KAAA,GAAA;AAEA,YADAC,EAAA,MAAA,GACA,oBAAAA,GAAA;AACA,gBAAA5B,IAAA,oBAAA,SAAA,gBAAA,QAAAqB,KAAA;AAEA,UAAAO,EAAA,eAAA5B,CAAA;AAAA,QAAA;AAAA,MACA;AAAA,IACA;AAAA;AAAA;AAAA;AAAA,IACA,UAAA;AAKA,YAAA6B,IAAA,KAAA,sBAAA,KAAA,IAAA,cAAA,SAAA;AACA,MAAAA,KACAA,EAAA,MAAA;AAAA,IACA;AAAA,IACA,YAAAC;AAAA,EACA;AAEA,CAAA;;;;;;;;;;;;;","x_google_ignoreList":[0,1,2,3,4,5,6,7,8,9,10,11,12,13,14,15,16,17]}

package/dist/chunks/{footer-actions.a1e09b4f.js → footer-actions.DqMRmlV_.js}

@@ -1,11 +1,11 @@
 import { defineComponent as i, toRefs as r, computed as l, onMounted as c } from "vue";
-import { B as _ } from "./index.dd30e538.js";
-import { B as u } from "./button.9d6435ae.js";
-import { B as d } from "./button-actions.81db18e8.js";
-import { n as p } from "./_plugin-vue2_normalizer.71e2aa87.js";
+import { B as u } from "./typography.Bjtu3Gca.js";
+import { a as _ } from "./button.DhAUh5JA.js";
+import { B as d } from "./button-actions.Bg9ey0p6.js";
+import { n as f } from "./_plugin-vue2_normalizer.CeySl7Fu.js";
 import "../assets/footer-actions.css";
-const f = {}, g = /* @__PURE__ */ i({
-  ...f,
+const p = {}, g = /* @__PURE__ */ i({
+  ...p,
   __name: "footer-actions",
   props: {
     /**
@@ -62,7 +62,7 @@ const f = {}, g = /* @__PURE__ */ i({
         leftAligned: o.value.length === 3 ? [
           {
             ...o.value[o.value.length - 1],
-            variant: u.SECONDARY
+            variant: _.SECONDARY
           }
         ] : null,
         rightAligned: [...n]
@@ -75,24 +75,22 @@ const f = {}, g = /* @__PURE__ */ i({
         throw new Error(
           "Not more than 2 action buttons may be provided with actions label to Bento Modal default variant"
         );
-    }), { __sfc: !0, props: t, actions: o, destructiveActions: e, alignedActions: s, BentoTypography: _, BentoButtonActions: d };
+    }), { __sfc: !0, props: t, actions: o, destructiveActions: e, alignedActions: s, BentoTypography: u, BentoButtonActions: d };
   }
 });
 var v = function() {
   var t = this, o = t._self._c, e = t._self._setupProxy;
   return o("div", { staticClass: "b-footer-actions" }, [o("div", { staticClass: "b-footer-actions__wrapper" }, [t.actionsLabel ? o(e.BentoTypography, { staticClass: "b-footer-actions__label", attrs: { el: "span", variant: "body", stronger: "" } }, [t._v(" " + t._s(t.actionsLabel) + " ")]) : t._e(), e.alignedActions.leftAligned ? o(e.BentoButtonActions, { staticClass: "b-footer-actions__left-group", attrs: { actions: e.alignedActions.leftAligned, layout: "buttons-start" } }) : t._e(), o(e.BentoButtonActions, { staticClass: "b-footer-actions__right-group", attrs: { actions: e.alignedActions.rightAligned, layout: "buttons-end" } })], 1)]);
-}, m = [], b = /* @__PURE__ */ p(
+}, m = [], b = /* @__PURE__ */ f(
   g,
   v,
   m,
   !1,
   null,
-  "97d2cb3e",
-  null,
-  null
+  "97d2cb3e"
 );
 const w = b.exports;
 export {
   w as F
 };
-//# sourceMappingURL=footer-actions.a1e09b4f.js.map
+//# sourceMappingURL=footer-actions.DqMRmlV_.js.map

package/dist/chunks/{footer-actions.a1e09b4f.js.map → footer-actions.DqMRmlV_.js.map}

@@ -1 +1 @@
-{"version":3,"file":"footer-actions.a1e09b4f.js","sources":["../../src/components/internal/footer-actions/footer-actions.vue"],"sourcesContent":["<template>\n    <div class=\"b-footer-actions\">\n        <div class=\"b-footer-actions__wrapper\">\n            <bento-typography v-if=\"actionsLabel\" class=\"b-footer-actions__label\" el=\"span\" variant=\"body\" stronger>\n                {{ actionsLabel }}\n            </bento-typography>\n\n            <bento-button-actions\n                v-if=\"alignedActions.leftAligned\"\n                class=\"b-footer-actions__left-group\"\n                :actions=\"alignedActions.leftAligned\"\n                layout=\"buttons-start\"\n            ></bento-button-actions>\n\n            <bento-button-actions\n                class=\"b-footer-actions__right-group\"\n                :actions=\"alignedActions.rightAligned\"\n                layout=\"buttons-end\"\n            ></bento-button-actions>\n        </div>\n    </div>\n</template>\n\n<script setup lang=\"ts\">\n    import { BentoTypography } from '@/components/typography';\n    import { computed, onMounted, PropType, toRefs } from 'vue';\n    import { BentoButtonActions, BentoButtonActionsList, BentoButtonVariant } from '@/components/button';\n\n    const props = defineProps({\n        /**\n         * List of actions that will be used to render the buttons.\n         * First element in the list will be rendered as \"primary\".\n         * All elements after the first will be rendered as \"secondary\".\n         * But you may change the color of 1-st action to red with 'critial' key\n         * Not more than 3 action buttons can be provided\n         * Or 2 action buttons and 1 Label for them\n         *\n         * Each object in the list should have a `title`, an `event` and\n         * (optional) a Vue `icon` from the library `@adyen/ui-assets-icons-16`.\n         *\n         * `title`: Button's text.\n         *\n         * `event`: Event triggered when clicking the Button.\n         *\n         * `icon`: Vue Icon from the library `@adyen/ui-assets-icons-16`.\n         *\n         * ```\n         * [{\n         *   title: 'Primary',2\n         *   event: () => { ... },\n         *   icon: FourPeopleIcon\n         * }, {\n         *   title: 'Secondary',\n         *   event: () => { ... }\n         * }]\n         * ```\n         */\n        actions: {\n            type: Array as PropType<BentoButtonActionsList>,\n            required: true,\n        },\n        /**\n         * Text label that is displayed left to the action buttons\n         */\n        actionsLabel: {\n            type: String,\n            default: null,\n        },\n        /**\n         * If passed - sets first button color to red\n         */\n        destructiveActions: {\n            type: Boolean,\n            default: false,\n        },\n    });\n\n    const { actions, destructiveActions } = toRefs(props);\n\n    const alignedActions = computed(() => {\n        const rightAlignedButtons =\n            actions.value.length < 3 ? actions.value : actions.value.slice(0, actions.value.length - 1);\n\n        // Add red color to the 1-st Action button\n        rightAlignedButtons[0].critical = destructiveActions.value || rightAlignedButtons[0].critical;\n\n        return {\n            leftAligned:\n                actions.value.length === 3\n                    ? [\n                          {\n                              ...actions.value[actions.value.length - 1],\n                              variant: BentoButtonVariant.SECONDARY,\n                          },\n                      ]\n                    : null,\n            rightAligned: [...rightAlignedButtons],\n        };\n    });\n\n    onMounted(() => {\n        if (props.actions && props.actions.length > 3) {\n            throw new Error('Not more than 3 action buttons may be provided to Bento Modal default variant');\n        }\n\n        if (props.actionsLabel && props.actions && props.actions.length > 2) {\n            throw new Error(\n                'Not more than 2 action buttons may be provided with actions label to Bento Modal default variant'\n            );\n        }\n    });\n</script>\n\n<script lang=\"ts\">\n    /**\n    * Internal component to handle the logic of displaying actions in default Modal and Sidepanel\n\n    * @example\n    * import { FooterActions } from '@/components/internal/footer-actions';\n    *\n    * export default {\n    *     components: { FooterActions },\n    *     template: `\n    *          <footer-actions :actions=\"BentoButtonActionsList\" actions-label=\"Label\" :destructive-actions=\"true\" />\n    *     `\n    * }\n    */\n    export default {};\n</script>\n\n<style lang=\"scss\" scoped src=\"./footer-actions.scss\" />\n"],"names":["__default__","actions","destructiveActions","toRefs","props","alignedActions","computed","rightAlignedButtons","BentoButtonVariant","onMounted"],"mappings":";;;;;;AA+HI,MAAAA,IAAA,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;iBAlDA,EAAA,SAAAC,GAAA,oBAAAC,EAAA,IAAAC,EAAAC,CAAA,GAEAC,IAAAC,EAAA,MAAA;AACI,YAAAC,IAAAN,EAAA,MAAA,SAAA,IAAAA,EAAA,QAAAA,EAAA,MAAA,MAAA,GAAAA,EAAA,MAAA,SAAA,CAAA;AAIA,aAAAM,EAAA,CAAA,EAAA,WAAAL,EAAA,SAAAK,EAAA,CAAA,EAAA,UAEA;AAAA,QAAO,aAAAN,EAAA,MAAA,WAAA,IAAA;AAAA,UAGO;AAAA,YACI,GAAAA,EAAA,MAAAA,EAAA,MAAA,SAAA,CAAA;AAAA,YAC6C,SAAAO,EAAA;AAAA,UACb;AAAA,QAChC,IAAA;AAAA,QAEJ,cAAA,CAAA,GAAAD,CAAA;AAAA,MAC2B;AAAA,IACzC,CAAA;AAGJ,WAAAE,EAAA,MAAA;AACI,UAAAL,EAAA,WAAAA,EAAA,QAAA,SAAA;AACI,cAAA,IAAA,MAAA,+EAAA;AAGJ,UAAAA,EAAA,gBAAAA,EAAA,WAAAA,EAAA,QAAA,SAAA;AACI,cAAA,IAAA;AAAA,UAAU;AAAA,QACN;AAAA,IAER,CAAA;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"footer-actions.DqMRmlV_.js","sources":["../../src/components/internal/footer-actions/footer-actions.vue"],"sourcesContent":["<template>\n    <div class=\"b-footer-actions\">\n        <div class=\"b-footer-actions__wrapper\">\n            <bento-typography v-if=\"actionsLabel\" class=\"b-footer-actions__label\" el=\"span\" variant=\"body\" stronger>\n                {{ actionsLabel }}\n            </bento-typography>\n\n            <bento-button-actions\n                v-if=\"alignedActions.leftAligned\"\n                class=\"b-footer-actions__left-group\"\n                :actions=\"alignedActions.leftAligned\"\n                layout=\"buttons-start\"\n            ></bento-button-actions>\n\n            <bento-button-actions\n                class=\"b-footer-actions__right-group\"\n                :actions=\"alignedActions.rightAligned\"\n                layout=\"buttons-end\"\n            ></bento-button-actions>\n        </div>\n    </div>\n</template>\n\n<script setup lang=\"ts\">\n    import { BentoTypography } from '@/components/typography';\n    import { computed, onMounted, PropType, toRefs } from 'vue';\n    import { BentoButtonActions, BentoButtonActionsList, BentoButtonVariant } from '@/components/button';\n\n    const props = defineProps({\n        /**\n         * List of actions that will be used to render the buttons.\n         * First element in the list will be rendered as \"primary\".\n         * All elements after the first will be rendered as \"secondary\".\n         * But you may change the color of 1-st action to red with 'critial' key\n         * Not more than 3 action buttons can be provided\n         * Or 2 action buttons and 1 Label for them\n         *\n         * Each object in the list should have a `title`, an `event` and\n         * (optional) a Vue `icon` from the library `@adyen/ui-assets-icons-16`.\n         *\n         * `title`: Button's text.\n         *\n         * `event`: Event triggered when clicking the Button.\n         *\n         * `icon`: Vue Icon from the library `@adyen/ui-assets-icons-16`.\n         *\n         * ```\n         * [{\n         *   title: 'Primary',2\n         *   event: () => { ... },\n         *   icon: FourPeopleIcon\n         * }, {\n         *   title: 'Secondary',\n         *   event: () => { ... }\n         * }]\n         * ```\n         */\n        actions: {\n            type: Array as PropType<BentoButtonActionsList>,\n            required: true,\n        },\n        /**\n         * Text label that is displayed left to the action buttons\n         */\n        actionsLabel: {\n            type: String,\n            default: null,\n        },\n        /**\n         * If passed - sets first button color to red\n         */\n        destructiveActions: {\n            type: Boolean,\n            default: false,\n        },\n    });\n\n    const { actions, destructiveActions } = toRefs(props);\n\n    const alignedActions = computed(() => {\n        const rightAlignedButtons =\n            actions.value.length < 3 ? actions.value : actions.value.slice(0, actions.value.length - 1);\n\n        // Add red color to the 1-st Action button\n        rightAlignedButtons[0].critical = destructiveActions.value || rightAlignedButtons[0].critical;\n\n        return {\n            leftAligned:\n                actions.value.length === 3\n                    ? [\n                          {\n                              ...actions.value[actions.value.length - 1],\n                              variant: BentoButtonVariant.SECONDARY,\n                          },\n                      ]\n                    : null,\n            rightAligned: [...rightAlignedButtons],\n        };\n    });\n\n    onMounted(() => {\n        if (props.actions && props.actions.length > 3) {\n            throw new Error('Not more than 3 action buttons may be provided to Bento Modal default variant');\n        }\n\n        if (props.actionsLabel && props.actions && props.actions.length > 2) {\n            throw new Error(\n                'Not more than 2 action buttons may be provided with actions label to Bento Modal default variant'\n            );\n        }\n    });\n</script>\n\n<script lang=\"ts\">\n    /**\n    * Internal component to handle the logic of displaying actions in default Modal and Sidepanel\n\n    * @example\n    * import { FooterActions } from '@/components/internal/footer-actions';\n    *\n    * export default {\n    *     components: { FooterActions },\n    *     template: `\n    *          <footer-actions :actions=\"BentoButtonActionsList\" actions-label=\"Label\" :destructive-actions=\"true\" />\n    *     `\n    * }\n    */\n    export default {};\n</script>\n\n<style lang=\"scss\" scoped src=\"./footer-actions.scss\" />\n"],"names":["__default__","actions","destructiveActions","toRefs","props","alignedActions","computed","rightAlignedButtons","BentoButtonVariant","onMounted"],"mappings":";;;;;;AA+HI,MAAAA,IAAA,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;iBAlDA,EAAA,SAAAC,GAAA,oBAAAC,EAAA,IAAAC,EAAAC,CAAA,GAEAC,IAAAC,EAAA,MAAA;AACI,YAAAC,IAAAN,EAAA,MAAA,SAAA,IAAAA,EAAA,QAAAA,EAAA,MAAA,MAAA,GAAAA,EAAA,MAAA,SAAA,CAAA;AAIA,aAAAM,EAAA,CAAA,EAAA,WAAAL,EAAA,SAAAK,EAAA,CAAA,EAAA,UAEA;AAAA,QAAO,aAAAN,EAAA,MAAA,WAAA,IAAA;AAAA,UAGO;AAAA,YACI,GAAAA,EAAA,MAAAA,EAAA,MAAA,SAAA,CAAA;AAAA,YAC6C,SAAAO,EAAA;AAAA,UACb;AAAA,QAChC,IAAA;AAAA,QAEJ,cAAA,CAAA,GAAAD,CAAA;AAAA,MAC2B;AAAA,IACzC,CAAA;AAGJ,WAAAE,EAAA,MAAA;AACI,UAAAL,EAAA,WAAAA,EAAA,QAAA,SAAA;AACI,cAAA,IAAA,MAAA,+EAAA;AAGJ,UAAAA,EAAA,gBAAAA,EAAA,WAAAA,EAAA,QAAA,SAAA;AACI,cAAA,IAAA;AAAA,UAAU;AAAA,QACN;AAAA,IAER,CAAA;;;;;;;;;;;;;;;"}