@adyen/bento-vue2 1.68.2 → 1.69.0

package/dist/chunks/{fixed-scroller.XN-jvWqb.js → fixed-scroller.CRnBrXfk.js}

@@ -1,5 +1,5 @@
 import { ref as a, onMounted as R, computed as f, defineComponent as L } from "vue";
-import { B as x } from "./button.hF-nD1Og.js";
+import { B as x } from "./button.B0hSQWOR.js";
 import { u as C } from "./i18n.BQkEbtPM.js";
 import { C as b, a as y } from "./chevron-right.C--ZOC9j.js";
 import { o as m } from "./resize.Bqks3WUm.js";
@@ -103,4 +103,4 @@ const U = P.exports;
 export {
   U as F
 };
-//# sourceMappingURL=fixed-scroller.XN-jvWqb.js.map
+//# sourceMappingURL=fixed-scroller.CRnBrXfk.js.map

package/dist/chunks/{fixed-scroller.XN-jvWqb.js.map → fixed-scroller.CRnBrXfk.js.map}

@@ -1 +1 @@
-{"version":3,"file":"fixed-scroller.XN-jvWqb.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, UnwrapRef } 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<UnwrapRef<HTMLDivElement | undefined>>;\n    containerRef?: Ref<UnwrapRef<HTMLDivElement | undefined>>;\n    leftButtonRef?: Ref<UnwrapRef<HTMLDivElement | undefined>>;\n    rightButtonRef?: Ref<UnwrapRef<HTMLDivElement | 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 props - All the necessary references to calculate the scroll\n * @param props.containerRef - Reference to the container, this defines the visible space width\n * @param props.contentRef - Reference to the content itself, this defines the total content width\n * @param props.leftButtonRef - Reference to the left button, used to calculate total space in which the content will be rendered\n * @param props.rightButtonRef - Reference to the right button, used to calculate total space in which the content will be rendered\n * @returns response - Values used in the view to show the buttons and to change the view right or left\n * @returns response.offset - Offset value by which the view will move on the x axis. To be used in `styles`.\n * @returns response.shouldShowLeftButton - Indicates if the button on the left should be shown\n * @returns 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            if (totalContentWidth.value < visibleSpaceWidth.value) {\n                // Reset the offset and view\n                currentView.value = 0;\n                offset.value = 0;\n            }\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,aAEAJ,EAAA,QAAAC,EAAA,UAEIF,EAAA,QAAA,GACAF,EAAA,QAAA;AAAA,IACJ,CAAA;AAAA,EACH,CAAA;AAKL,QAAAQ,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;;;;;GCxEImB,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.CRnBrXfk.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, UnwrapRef } 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<UnwrapRef<HTMLDivElement | undefined>>;\n    containerRef?: Ref<UnwrapRef<HTMLDivElement | undefined>>;\n    leftButtonRef?: Ref<UnwrapRef<HTMLDivElement | undefined>>;\n    rightButtonRef?: Ref<UnwrapRef<HTMLDivElement | 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 props - All the necessary references to calculate the scroll\n * @param props.containerRef - Reference to the container, this defines the visible space width\n * @param props.contentRef - Reference to the content itself, this defines the total content width\n * @param props.leftButtonRef - Reference to the left button, used to calculate total space in which the content will be rendered\n * @param props.rightButtonRef - Reference to the right button, used to calculate total space in which the content will be rendered\n * @returns response - Values used in the view to show the buttons and to change the view right or left\n * @returns response.offset - Offset value by which the view will move on the x axis. To be used in `styles`.\n * @returns response.shouldShowLeftButton - Indicates if the button on the left should be shown\n * @returns 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            if (totalContentWidth.value < visibleSpaceWidth.value) {\n                // Reset the offset and view\n                currentView.value = 0;\n                offset.value = 0;\n            }\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,aAEAJ,EAAA,QAAAC,EAAA,UAEIF,EAAA,QAAA,GACAF,EAAA,QAAA;AAAA,IACJ,CAAA;AAAA,EACH,CAAA;AAKL,QAAAQ,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;;;;;GCxEImB,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/{focus-trap.C-wIQqpO.js → focus-trap.B4C5TXxl.js}

@@ -485,7 +485,7 @@ var je = function() {
   Ze,
   !1,
   null,
-  "0da3b03d"
+  "f4332180"
 );
 const rt = Ye.exports;
 export {
@@ -496,4 +496,4 @@ export {
   Ge as g,
   He as s
 };
-//# sourceMappingURL=focus-trap.C-wIQqpO.js.map
+//# sourceMappingURL=focus-trap.B4C5TXxl.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"focus-trap.B4C5TXxl.js","sources":["../../../../node_modules/.pnpm/focus-lock@0.11.0/node_modules/focus-lock/dist/es2015/constants.js","../../../../node_modules/.pnpm/focus-lock@0.11.0/node_modules/focus-lock/dist/es2015/utils/array.js","../../../../node_modules/.pnpm/focus-lock@0.11.0/node_modules/focus-lock/dist/es2015/utils/is.js","../../../../node_modules/.pnpm/focus-lock@0.11.0/node_modules/focus-lock/dist/es2015/utils/tabOrder.js","../../../../node_modules/.pnpm/focus-lock@0.11.0/node_modules/focus-lock/dist/es2015/utils/tabbables.js","../../../../node_modules/.pnpm/focus-lock@0.11.0/node_modules/focus-lock/dist/es2015/utils/tabUtils.js","../../../../node_modules/.pnpm/focus-lock@0.11.0/node_modules/focus-lock/dist/es2015/utils/DOMutils.js","../../../../node_modules/.pnpm/focus-lock@0.11.0/node_modules/focus-lock/dist/es2015/utils/all-affected.js","../../../../node_modules/.pnpm/focus-lock@0.11.0/node_modules/focus-lock/dist/es2015/utils/getActiveElement.js","../../../../node_modules/.pnpm/focus-lock@0.11.0/node_modules/focus-lock/dist/es2015/focusInside.js","../../../../node_modules/.pnpm/focus-lock@0.11.0/node_modules/focus-lock/dist/es2015/focusIsHidden.js","../../../../node_modules/.pnpm/focus-lock@0.11.0/node_modules/focus-lock/dist/es2015/utils/correctFocus.js","../../../../node_modules/.pnpm/focus-lock@0.11.0/node_modules/focus-lock/dist/es2015/utils/firstFocus.js","../../../../node_modules/.pnpm/focus-lock@0.11.0/node_modules/focus-lock/dist/es2015/solver.js","../../../../node_modules/.pnpm/focus-lock@0.11.0/node_modules/focus-lock/dist/es2015/utils/parenting.js","../../../../node_modules/.pnpm/focus-lock@0.11.0/node_modules/focus-lock/dist/es2015/focusMerge.js","../../../../node_modules/.pnpm/focus-lock@0.11.0/node_modules/focus-lock/dist/es2015/focusables.js","../../../../node_modules/.pnpm/focus-lock@0.11.0/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/composables/use-handle-layers.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    type BentoFocusTrapFocusableIn,\n    type BentoFocusTrapHorizontalNavigationEvent,\n    type 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","import { type MaybeRef } from '@/types';\nimport { useMutationObserver } from '@vueuse/core';\nimport { isRef, onUnmounted, ref } from 'vue';\n\n/**\n * Creates a handler for managing layered components (e.g., tooltips, listboxes, comboboxes)\n * rendered on top of a modal.\n *\n * Prevents a single Escape key press (or similar events) from closing all layers at once.\n * Ensures only the topmost interactive layer is closed per event, preserving expected UX behavior.\n *\n * @param elRef - A reference to the root DOM element encapsulating the modal and its layered content.\n * @returns An object containing:\n *  - `handleKeydownEscape`: A function that handles Escape key presses and manages the layered state accordingly.\n */\nexport const useHandleLayers = (elRef: MaybeRef<HTMLElement>) => {\n    const elementWithPopover = ref(null);\n\n    const { stop } = useMutationObserver(\n        elRef,\n        mutations => {\n            let hasPopover = false;\n\n            for (const mutation of mutations) {\n                if (mutation.type === 'childList' && mutation.addedNodes.length) {\n                    const ariaExpandedElement = Array.from(mutation.addedNodes).find(node => {\n                        if (!(node instanceof HTMLElement)) {\n                            return false;\n                        }\n\n                        return node.getAttribute('aria-expanded') === 'true';\n                    });\n\n                    // if there is an element added that has aria-expanded e.g. input-field with dropdown, we mark it as a popover\n                    if (ariaExpandedElement) {\n                        elementWithPopover.value = ariaExpandedElement;\n                        hasPopover = true;\n                    }\n\n                    break;\n                } else if (mutation.type === 'attributes' && mutation.oldValue === 'false') {\n                    // check if popup is on the modal via aria-expanded\n                    elementWithPopover.value = mutations[0].target;\n\n                    hasPopover = true;\n\n                    break;\n                }\n            }\n\n            // there is an element with the popover that is opened on the screen\n            if (hasPopover === true) {\n                return;\n            }\n\n            // flush all macro-tasks before resetting\n            // enables keydown to run before reset - enabling it to identify if the popover was opened\n            // otherwise, aria-expanded will ALWAYS be false since it closes before the event bubbles up into the dialog\n            setTimeout(() => (elementWithPopover.value = null));\n        },\n        {\n            attributeFilter: ['aria-expanded'],\n            attributeOldValue: true,\n            childList: true, // check for added/removed nodes i.e. teleport\n            subtree: true, // check all descendents\n        }\n    );\n\n    const handleKeydownEscape = (event: KeyboardEvent) => {\n        // list of roles that requires escape to be handled\n        const roleBlockPropagationList = ['listbox', 'tooltip', 'menu'];\n\n        // list of roles that requires escape to be handled when the list is opened\n        const roleExpandedBlockPropagationList = ['combobox'];\n\n        const tagBlockPropagationList = [\n            // input with autocomplete should only close the autocomplete dropdown when ESCAPE is pressed\n            // some autocomplete picks up \"name=username\" without the autocomplete attribute\n            'INPUT',\n        ];\n\n        for (const el of event.composedPath()) {\n            if (!(el instanceof HTMLElement)) {\n                return;\n            }\n\n            const htmlEl = el;\n\n            const tag = htmlEl.tagName;\n            const role = htmlEl.getAttribute('role');\n\n            const isElementDialog = tag === 'DIALOG';\n            const isRoleWithOwnEscapeHandler = roleBlockPropagationList.includes(role);\n            const isRoleWithOwnConditionalEscapeHandler = roleExpandedBlockPropagationList.includes(role);\n            const isTagWithOwnEscapeHandler = tagBlockPropagationList.includes(tag);\n\n            const isSelf = isRef(elRef) ? elRef.value === htmlEl : elRef === htmlEl;\n\n            if (isElementDialog || isSelf) {\n                // end loop at the modal - by default <dialog/> handles their own escape \"layering\"\n                // or skip if it is currently at the top i.e. the focus-trap component itself\n                return;\n            }\n\n            // combobox should close listbox when focus is on the combobox\n            // modal only closes if listbox is not opened\n            // handled earlier so that it does not have to go higher in the composed tree\n            const isComboboxOpened = isRoleWithOwnConditionalEscapeHandler && elementWithPopover.value;\n\n            // specific popovers that are not dialog e.g. listbox can handle their own Escape\n            const isPopoverOpened = isRoleWithOwnEscapeHandler || isTagWithOwnEscapeHandler;\n\n            // role=dialogs e.g. date-picker can handle their own Escape\n            const isDialogOpened = !isElementDialog && role === 'dialog';\n\n            if (isComboboxOpened || isPopoverOpened || isDialogOpened) {\n                event.stopPropagation();\n                event.preventDefault();\n\n                return;\n            }\n        }\n    };\n\n    onUnmounted(() => {\n        stop();\n    });\n\n    return { handleKeydownEscape };\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        @keydown.esc=\"handleKeydownEscape\"\n    >\n        <slot></slot>\n    </div>\n</template>\n\n<script lang=\"ts\">\n    import { defineComponent, type PropType, ref } 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    import { useHandleLayers } from './composables/use-handle-layers';\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        setup() {\n            const root = ref(null);\n\n            const { handleKeydownEscape } = useHandleLayers(root);\n\n            return { root, handleKeydownEscape };\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","useHandleLayers","elRef","elementWithPopover","ref","stop","useMutationObserver","mutations","hasPopover","mutation","ariaExpandedElement","handleKeydownEscape","roleBlockPropagationList","roleExpandedBlockPropagationList","tagBlockPropagationList","htmlEl","tag","role","isElementDialog","isRoleWithOwnEscapeHandler","isRoleWithOwnConditionalEscapeHandler","isTagWithOwnEscapeHandler","isSelf","isRef","onUnmounted","_sfc_main","defineComponent","value","root","currentTag","isArrowNext","isArrowPrev","focusableEl","focusOnDestroyEl","useHasSlot"],"mappings":"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","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.BE_zzX-e.js → footer-actions.C9ZYDWNU.js}

@@ -1,7 +1,7 @@
 import { defineComponent as i, toRefs as r, computed as l, onMounted as c } from "vue";
-import { B as u } from "./typography.J1v_SPG3.js";
-import { a as _ } from "./button.hF-nD1Og.js";
-import { B as d } from "./button-actions.Ju27CRNG.js";
+import { B as u } from "./typography.w3m-EY4E.js";
+import { a as _ } from "./button.B0hSQWOR.js";
+import { B as d } from "./toggle-button.DeECoGRn.js";
 import { n as f } from "./_plugin-vue2_normalizer.CeySl7Fu.js";
 import "../assets/footer-actions.css";
 const p = {}, g = /* @__PURE__ */ i({
@@ -56,16 +56,16 @@ const p = {}, g = /* @__PURE__ */ i({
     }
   },
   setup(a) {
-    const t = a, { actions: o, destructiveActions: e } = r(t), s = l(() => {
-      const n = o.value.length < 3 ? o.value : o.value.slice(0, o.value.length - 1);
-      return n[0].critical = e.value || n[0].critical, {
+    const t = a, { actions: o, destructiveActions: n } = r(t), s = l(() => {
+      const e = o.value.length < 3 ? o.value : o.value.slice(0, o.value.length - 1);
+      return e[0].critical = n.value || e[0].critical, {
         leftAligned: o.value.length === 3 ? [
           {
             ...o.value[o.value.length - 1],
             variant: _.SECONDARY
           }
         ] : null,
-        rightAligned: [...n]
+        rightAligned: [...e]
       };
     });
     return c(() => {
@@ -75,22 +75,22 @@ const p = {}, 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: u, BentoButtonActions: d };
+    }), { __sfc: !0, props: t, actions: o, destructiveActions: n, 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)]);
+  var t = this, o = t._self._c, n = t._self._setupProxy;
+  return o("div", { staticClass: "b-footer-actions" }, [o("div", { staticClass: "b-footer-actions__wrapper" }, [t.actionsLabel ? o(n.BentoTypography, { staticClass: "b-footer-actions__label", attrs: { el: "span", variant: "body", stronger: "" } }, [t._v(" " + t._s(t.actionsLabel) + " ")]) : t._e(), n.alignedActions.leftAligned ? o(n.BentoButtonActions, { staticClass: "b-footer-actions__left-group", attrs: { actions: n.alignedActions.leftAligned, layout: "buttons-start" } }) : t._e(), o(n.BentoButtonActions, { staticClass: "b-footer-actions__right-group", attrs: { actions: n.alignedActions.rightAligned, layout: "buttons-end" } })], 1)]);
 }, m = [], b = /* @__PURE__ */ f(
   g,
   v,
   m,
   !1,
   null,
-  "97d2cb3e"
+  "17c485b8"
 );
 const w = b.exports;
 export {
   w as F
 };
-//# sourceMappingURL=footer-actions.BE_zzX-e.js.map
+//# sourceMappingURL=footer-actions.C9ZYDWNU.js.map

package/dist/chunks/footer-actions.C9ZYDWNU.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"footer-actions.C9ZYDWNU.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, type PropType, toRefs } from 'vue';\n    import { BentoButtonActions, type 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;;;;;;;;;;;;;;;"}

package/dist/chunks/{form-layout-title.CIynHgCF.js → form-layout-title.CboZDCN9.js}

@@ -1,9 +1,9 @@
 import { defineComponent as n, useSlots as c, computed as a, provide as d, toRef as y } from "vue";
-import { B as f } from "./alert.c1rhDDrU.js";
+import { B as f } from "./alert.Dx9P_L2k.js";
 import { F as v } from "./form-layout.types.D3EKzbE7.js";
 import { u } from "./use-has-slot.C9lQZ6nz.js";
 import { n as l } from "./_plugin-vue2_normalizer.CeySl7Fu.js";
-import { B as p, c as g } from "./typography.J1v_SPG3.js";
+import { B as p, c as g } from "./typography.w3m-EY4E.js";
 import "../assets/form-layout-title.css";
 const h = {}, b = /* @__PURE__ */ n({
   ...h,
@@ -70,7 +70,7 @@ var x = function() {
   F,
   !1,
   null,
-  "21e4c0c4"
+  "807d8bf4"
 );
 const K = O.exports, i = [
   "100",
@@ -137,7 +137,7 @@ var P = function() {
   E,
   !1,
   null,
-  "f4f09170"
+  "18d77022"
 );
 const M = I.exports, N = {}, G = /* @__PURE__ */ n({
   ...N,
@@ -187,4 +187,4 @@ export {
   M as c,
   J as f
 };
-//# sourceMappingURL=form-layout-title.CIynHgCF.js.map
+//# sourceMappingURL=form-layout-title.CboZDCN9.js.map

package/dist/chunks/form-layout-title.CboZDCN9.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"form-layout-title.CboZDCN9.js","sources":["../../src/components/form-layout/form-layout.vue","../../src/components/form-layout/components/form-layout-field-tip/form-layout-tip.types.ts","../../src/components/form-layout/components/form-layout-field-tip/form-layout-field-tip.vue","../../src/components/form-layout/components/form-layout-group/form-layout-group.types.ts","../../src/components/form-layout/components/form-layout-group/form-layout-group.vue","../../src/components/form-layout/components/form-layout-title/form-layout-title.vue"],"sourcesContent":["<template>\n    <component :is=\"formLayoutElement\" class=\"b-form-layout\" role=\"form\" @submit=\"emit('submit', $event)\">\n        <bento-alert v-if=\"hasSlot('error-message')\" class=\"b-form-layout__error-message\" type=\"critical\">\n            <template #description>\n                <slot name=\"error-message\" />\n            </template>\n        </bento-alert>\n\n        <slot />\n\n        <div v-if=\"hasActions\" class=\"b-form-layout__actions-container\">\n            <div class=\"b-form-layout__actions\">\n                <slot name=\"actions-left\" />\n            </div>\n\n            <div class=\"b-form-layout__actions\">\n                <slot name=\"actions-right\" />\n            </div>\n        </div>\n    </component>\n</template>\n\n<script setup lang=\"ts\">\n    import { computed, provide, toRef, useSlots } from 'vue';\n    import { BentoAlert } from '@/components/alert';\n    import { useHasSlot } from '@/composables';\n    import { FORM_LAYOUT_LOADING_INJECTION_KEY } from './form-layout.types';\n\n    const slots = useSlots();\n    const hasSlot = useHasSlot(slots);\n\n    const emit = defineEmits([\"submit\"]);\n\n    const props = defineProps({\n        /**\n         * Renders the form layout as an HTML `form`\n         */\n        form: { type: Boolean, default: false },\n\n        /**\n         * Sets the state of the form and its fields to\n         * a read only status.\n         */\n        loading: { type: Boolean, default: false },\n    });\n\n    const formLayoutElement = computed(() => (props.form ? 'form' : 'div'));\n    const hasActions = computed(() => hasSlot('actions-left') || hasSlot('actions-right'));\n\n    provide(FORM_LAYOUT_LOADING_INJECTION_KEY, toRef(props, 'loading'));\n</script>\n\n<script lang=\"ts\">\n    /**\n     * Form layout component is a pre-designed layout that serves\n     * as a starting point for creating a form.\n     *\n     * It can include various common form components:\n     * input field, dropdown, date picker, checkbox group, radio group,\n     * textarea, etc.\n     *\n     * Form layout is context agnostic and can be dropped in different\n     * places, for example in modals, side panels or pages.\n     *\n     * @example\n     * import { BentoFormLayout, BentoFormLayoutFieldTip } from '@adyen/bento-vue2';\n     *\n     * export default {\n     *     components: { BentoFormLayout, BentoFormLayoutFieldTip },\n     *     template: `\n     *          <bento-form-layout>\n     *              <template #error-message>There is an error. Correct the highlighted field.</template>\n     *\n     *              <bento-input-field>Input field</bento-input-field>\n     *\n     *              <bento-form-layout-field-tip>\n     *                  <bento-dropdown label=\"Dropdown\" :items=\"dropdownItems\" placeholder=\"Select an animal\" />\n     *                  <template #message>This is a small tip that can be used in small spaces</template>\n     *              </bento-form-layout-field-tip>\n     *\n     *              <bento-form-layout-title subsection>\n     *                  Section title\n     *                  <template #description>Optional section description</template>\n     *              </bento-form-layout-title>\n     *          </bento-form-layout>\n     *     `\n     * }\n     */\n    export default {};\n</script>\n\n<style lang=\"scss\" scoped src=\"./form-layout.scss\" />\n","import { type BentoAlertTypeOption } from '@/components/alert/alert.types';\n\nexport type BentoFormLayoutFieldTipTypeOption = `${BentoAlertTypeOption}`;\nexport const BentoFormLayoutFieldTipTypeOptions = ['warning', 'critical', 'highlight', 'success'];\n","<template>\n    <div class=\"b-form-layout-field-tip\">\n        <slot />\n        <bento-alert v-if=\"hasSlot('message')\" variant=\"tip\" :type=\"type\">\n            <template #description>\n                <slot name=\"message\" />\n            </template>\n        </bento-alert>\n    </div>\n</template>\n\n<script setup lang=\"ts\">\n    import { type PropType, useSlots } from 'vue';\n    import { type BentoFormLayoutFieldTipTypeOption, BentoFormLayoutFieldTipTypeOptions } from './form-layout-tip.types';\n    import { BentoAlert } from '@/components/alert';\n    import { useHasSlot } from '@/composables/use-has-slot/use-has-slot';\n\n    defineProps({\n        /**\n         * Type of a alert; set a distinctive icon and color. Defaults to highlight.\n         * @values highlight, success, critical, warning\n         */\n        type: {\n            type: String as PropType<BentoFormLayoutFieldTipTypeOption>,\n            default: 'highlight',\n            validator: (value: BentoFormLayoutFieldTipTypeOption) => BentoFormLayoutFieldTipTypeOptions.includes(value),\n        },\n    });\n\n    const slots = useSlots();\n    const hasSlot = useHasSlot(slots);\n</script>\n\n<script lang=\"ts\">\n    /**\n     * You can help users provide accurate and well formatted information\n     * by using various elements that come with an input field.\n     *\n     * Use description/supporting text to add additional context to the\n     * field or guidance how to format the input correctly.\n     * Because description is always visible it should be the first\n     * choice in providing guidance.\n     *\n     * @example\n     * import { BentoFormLayoutFieldTip } from '@adyen/bento-vue2';\n     *\n     * export default {\n     *     components: { BentoFormLayoutFieldTip },\n     *     template: `\n     *          <bento-form-layout-field-tip>\n     *              <bento-dropdown label=\"Dropdown\" :items=\"dropdownItems\" placeholder=\"Select an animal\" />\n     *\n     *              <template #message>This is a small tip that can be used in small spaces</template>\n     *          </bento-form-layout-field-tip>\n     *     `\n     */\n    export default {};\n</script>\n\n<style lang=\"scss\" scoped src=\"./form-layout-field-tip.scss\" />\n","export type BentoLayoutGroupProportions =\n    | '33-33-33'\n    | '50-50'\n    | '25-75'\n    | '75-25'\n    | '33-66'\n    | '66-33'\n    | '25'\n    | '33'\n    | '50'\n    | '100';\n\nexport const BentoLayoutGroupProportions = [\n    '100',\n    '50',\n    '33',\n    '25',\n    '66-33',\n    '33-66',\n    '75-25',\n    '25-75',\n    '50-50',\n    '33-33-33',\n];\n","<template>\n    <div class=\"b-form-layout-group\" :class=\"conditionalClasses\">\n        <slot></slot>\n    </div>\n</template>\n\n<script setup lang=\"ts\">\n    import { computed, type PropType } from 'vue';\n    import { BentoLayoutGroupProportions } from './form-layout-group.types';\n\n    // Default proportion\n    const DEFAULT_PROPORTION = 100;\n\n    const props = defineProps({\n        /**\n         * The layout of the pair group of components.\n         * This will render the components within the width of the proportions.\n         * Only two colums are available.\n         *\n         * If only one value is entered, then it will assume there's only one child in the group.\n         * If two values are entered, the first value will be use for the first child and the second\n         * value for the second child.\n         *\n         * If the value entered is not listed in the example\n         * list below it will use 100% by default.\n         * @example\n         * '33-33-33'\n         * '50-50'\n         * '25-75'\n         * '75-25'\n         * '33-66'\n         * '66-33'\n         * '25'\n         * '33'\n         * '50'\n         * '100'\n         */\n        layout: {\n            type: String as PropType<BentoLayoutGroupProportions>,\n            default: '100',\n            validator: (value: BentoLayoutGroupProportions) => BentoLayoutGroupProportions.includes(value),\n        },\n    });\n\n    // Sets DEFAULT_PROPORTION by default if `layout` is not in the list\n    const computedLayout = computed(() =>\n        BentoLayoutGroupProportions.includes(props.layout) ? props.layout : DEFAULT_PROPORTION\n    );\n\n    const conditionalClasses = computed(() => ({\n        // Transform into column if the layout is unsupported\n        'b-form-layout-group--column': !BentoLayoutGroupProportions.includes(props.layout),\n        // Assings the correct layout class\n        [`b-form-layout-group--${computedLayout.value}`]: true,\n    }));\n</script>\n\n<script lang=\"ts\">\n    /**\n     * Use to provide horizontal layouts to build forms\n     * with two fields per line.\n     *\n     * These can be used for field combinations,\n     * such as post code and city or title and first name.\n     *\n     * @example\n     * import { BentoFormLayoutGroup } from '@adyen/bento-vue2';\n     *\n     * export default {\n     *     components: { BentoFormLayoutGroup },\n     *     template: `\n     *          <bento-form-layout-group>\n     *              <first-element />\n     *              <second-element />\n     *          </bento-form-layout-group>\n     *     `\n     * }\n     */\n    export default {};\n</script>\n\n<style lang=\"scss\" scoped src=\"./form-layout-group.scss\" />\n","<template>\n    <div class=\"b-form-layout-title\" :class=\"conditionalClasses\">\n        <bento-typography :el=\"el\" variant=\"title\" :medium=\"isSection\">\n            <slot />\n        </bento-typography>\n\n        <bento-typography v-if=\"hasSlot('description')\" class=\"b-form-layout-title__description\" el=\"span\" wide>\n            <slot name=\"description\" />\n        </bento-typography>\n    </div>\n</template>\n\n<script setup lang=\"ts\">\n    import { computed, useSlots } from 'vue';\n    import { BentoTypography, BentoTypographyElement } from '@/components/typography';\n    import { useHasSlot } from '@/composables';\n\n    const slots = useSlots();\n\n    const props = defineProps({\n        /**\n         * Defines if the Form Layout title is\n         * a \"section\" or a \"subsection\".\n         * Default is \"section\" (false). Turn into \"true\" for \"subsection\"\n         */\n        subsection: {\n            type: Boolean,\n            default: false,\n        },\n\n        /**\n         * Sets the HTML DOM element.\n         * @values h1, h2, h3, h4, h5, h6, div, p, span\n         */\n        el: {\n            type: BentoTypography.props.el.type,\n            required: true,\n            validator: (value: BentoTypographyElement) => Object.values(BentoTypographyElement).includes(value),\n        },\n    });\n\n    // Uses \"medium\" typography if it is a section title\n    const isSection = computed(() => !props.subsection);\n    const hasSlot = useHasSlot(slots);\n    const conditionalClasses = computed(() => ({\n        'b-form-layout-title--subsection': props.subsection,\n    }));\n</script>\n\n<script lang=\"ts\">\n    /**\n     * If you’re building a lengthy form, organise related\n     * fields into sections and, if needed, subsections.\n     *\n     * A form can have a \"Section Title\" and multiple \"Subsection titles\".\n     *\n     * One of the values provided in @see BentoTypographyElement must always be provided as a string\n     * to define correct HTML sementic from the application's context\n     *\n     * @example\n     * import { BentoFormLayoutTitle } from '@adyen/bento-vue2';\n     *\n     * export default {\n     *     components: { BentoFormLayoutTitle },\n     *     template: `\n     *          <bento-form-layout-title subsection el=\"h2\">\n     *              Title\n     *              <template #description>Description text</template>\n     *          </bento-form-layout-title>\n     *     `\n     * }\n     */\n    export default {};\n</script>\n\n<style lang=\"scss\" scoped src=\"./form-layout-title.scss\" />\n"],"names":["__default__$3","slots","useSlots","hasSlot","useHasSlot","formLayoutElement","computed","props","hasActions","provide","FORM_LAYOUT_LOADING_INJECTION_KEY","toRef","BentoFormLayoutFieldTipTypeOptions","__default__$2","BentoLayoutGroupProportions","__default__$1","DEFAULT_PROPORTION","computedLayout","conditionalClasses","__default__","isSection"],"mappings":";;;;;;;AAwFI,MAAAA,IAAA,CAAA;;;;;;;;;;;;;;;;iBA5DAC,IAAAC,EAAA,GACAC,IAAAC,EAAAH,CAAA,GAiBAI,IAAAC,EAAA,MAAAC,EAAA,OAAA,SAAA,KAAA,GACAC,IAAAF,EAAA,MAAAH,EAAA,cAAA,KAAAA,EAAA,eAAA,CAAA;AAEA,WAAAM,EAAAC,GAAAC,EAAAJ,GAAA,SAAA,CAAA;;;;;;;;;;;;;;;;;;qBC9CGK,IAAA,CAAA,WAAA,YAAA,aAAA,SAAA,GCqDHC,IAAA,CAAA;;;;;;;;;;;;;;;AA3BA,UAAAZ,IAAAC,EAAA,GACAC,IAAAC,EAAAH,CAAA;;;;;;;;;;;;;;;;;qBClBGa,IAAA;AAAA,EAAoC;AAAA,EACvC;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAEJ,GCuDIC,IAAA,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;iBAnEAC,IAAA,KAkCAC,IAAAX;AAAA,MAAuB,MAAAQ,EAAA,SAAAP,EAAA,MAAA,IAAAA,EAAA,SAAAS;AAAA,IACiD,GAGxEE,IAAAZ,EAAA,OAAA;AAAA;AAAA,MAA2C,+BAAA,CAAAQ,EAAA,SAAAP,EAAA,MAAA;AAAA;AAAA,MAE0C,CAAA,wBAAAU,EAAA,KAAA,EAAA,GAAA;AAAA,IAE/B,EAAA;;;;;;;;;;;;;;;qBCmBtDE,IAAA,CAAA;;;;;;;;;;;;;;;;;;;;;;;;iBAvDAlB,IAAAC,EAAA,GAyBAkB,IAAAd,EAAA,MAAA,CAAAC,EAAA,UAAA,GACAJ,IAAAC,EAAAH,CAAA,GACAiB,IAAAZ,EAAA,OAAA;AAAA,MAA2C,mCAAAC,EAAA;AAAA,IACE,EAAA;;;;;;;;;;;;;;;;"}

package/dist/chunks/{grid-layout.HvTAa4to.js → grid-layout.1aIiz2N_.js}

@@ -66,11 +66,11 @@ var g = function() {
   p,
   !1,
   null,
-  "9e65023f"
+  "66bb9140"
 );
-const v = S.exports;
+const C = S.exports;
 export {
-  v as G,
+  C as G,
   s as a
 };
-//# sourceMappingURL=grid-layout.HvTAa4to.js.map
+//# sourceMappingURL=grid-layout.1aIiz2N_.js.map

package/dist/chunks/grid-layout.1aIiz2N_.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"grid-layout.1aIiz2N_.js","sources":["../../src/components/internal/grid-layout/grid-layout.types.ts","../../src/components/internal/grid-layout/grid-layout.vue"],"sourcesContent":["export enum GridLayoutContainerType {\n    INLINE = 'inline-size',\n    SIZE = 'size',\n    NORMAL = 'normal',\n}\n\nexport interface GridLayoutColumnWidth {\n    small: number | string;\n    medium: number | string;\n    large: number | string;\n}\n\nexport type GridLayoutColumnWidths = Array<'auto' | GridLayoutColumnWidth>;\n","<template>\n    <div class=\"b-grid-layout\" :class=\"computedClasses\" data-testid=\"grid-layout\">\n        <div\n            v-if=\"hasSlot('col-1')\"\n            class=\"b-grid-layout__column\"\n            :class=\"computeColumnSize(0)\"\n            data-testid=\"grid-layout-col-1\"\n        >\n            <slot name=\"col-1\"></slot>\n        </div>\n        <div\n            v-if=\"hasSlot('col-2')\"\n            class=\"b-grid-layout__column\"\n            :class=\"computeColumnSize(1)\"\n            data-testid=\"grid-layout-col-2\"\n        >\n            <slot name=\"col-2\"></slot>\n        </div>\n        <div\n            v-if=\"hasSlot('col-3')\"\n            class=\"b-grid-layout__column\"\n            :class=\"computeColumnSize(2)\"\n            data-testid=\"grid-layout-col-3\"\n        >\n            <slot name=\"col-3\"></slot>\n        </div>\n        <div\n            v-if=\"hasSlot('col-4')\"\n            class=\"b-grid-layout__column\"\n            :class=\"computeColumnSize(3)\"\n            data-testid=\"grid-layout-col-4\"\n        >\n            <slot name=\"col-4\"></slot>\n        </div>\n        <div\n            v-if=\"hasSlot('col-5')\"\n            class=\"b-grid-layout__column\"\n            :class=\"computeColumnSize(4)\"\n            data-testid=\"grid-layout-col-5\"\n        >\n            <slot name=\"col-5\"></slot>\n        </div>\n        <div\n            v-if=\"hasSlot('col-6')\"\n            class=\"b-grid-layout__column\"\n            :class=\"computeColumnSize(5)\"\n            data-testid=\"grid-layout-col-6\"\n        >\n            <slot name=\"col-6\"></slot>\n        </div>\n    </div>\n</template>\n\n<script lang=\"ts\">\n    import { computed, defineComponent, type PropType } from 'vue';\n    import { useHasSlot } from '@/composables';\n    import { type GridLayoutColumnWidth, type GridLayoutColumnWidths, GridLayoutContainerType } from './grid-layout.types';\n\n    /**\n     * Component used to render the grid layout in the bento-summary-grid. For internal use only\n     */\n    export default defineComponent({\n        name: 'grid-layout',\n        props: {\n            /**\n             * Sets the responsive columns widths for the grid.\n             */\n            columnWidth: {\n                type: Array as PropType<GridLayoutColumnWidths>,\n                default: null,\n                validator: (array: GridLayoutColumnWidths) => array && array.length <= 6,\n            },\n\n            /**\n             * Set the type of CSS container the grid layout has\n             * @values inline-size, size, normal\n             */\n            containerType: {\n                type: String as PropType<GridLayoutContainerType>,\n                default: GridLayoutContainerType.INLINE,\n            },\n\n            /**\n             * Sets the gap in the grid to 0.\n             */\n            noGap: {\n                type: Boolean,\n                default: false,\n            },\n        },\n        setup(props, { slots }) {\n            const hasSlot = useHasSlot(slots);\n\n            // TODO: add a computedItems computed here that only returns the slots that are presents so as to be able to render the divs in the template via a v-for\n            const computeColumnSize = index => {\n                if (props.columnWidth?.[index] && props.columnWidth?.[index] !== 'auto') {\n                    const columnWidth = props.columnWidth[index] as GridLayoutColumnWidth;\n                    return [\n                        `b-grid-layout__column--${columnWidth.small}`,\n                        `b-grid-layout-m__column--${columnWidth.medium}`,\n                        `b-grid-layout-l__column--${columnWidth.large}`,\n                    ];\n                }\n                return null;\n            };\n\n            const computedClasses = computed(() => ({\n                'b-grid-layout--container-type-normal': props.containerType === GridLayoutContainerType.NORMAL,\n                'b-grid-layout--container-type-size': props.containerType === GridLayoutContainerType.SIZE,\n                'b-grid-layout--all-auto':\n                    props.columnWidth === null || props.columnWidth.every(width => width === 'auto'),\n                'b-grid-layout--no-gap': props.noGap,\n            }));\n\n            return {\n                // Values\n                computeColumnSize,\n                computedClasses,\n\n                // Methods\n                hasSlot,\n            };\n        },\n    });\n</script>\n\n<style lang=\"scss\" scoped src=\"./grid-layout.scss\" />\n"],"names":["GridLayoutContainerType","GridLayoutContainerType2","_sfc_main","defineComponent","array","props","slots","hasSlot","useHasSlot","computeColumnSize","index","_a","_b","columnWidth","computedClasses","computed","width"],"mappings":";;;;AAAY,IAAAA,IAAA,kBAAAC,OACRA,EAAA,SAAA,eACAA,EAAA,OAAA,QACAA,EAAA,SAAA,UAHQA,IAAAD,KAAA,CAAA,CAAA;AC6DZ,MAAAE,IAAAC,EAAA;AAAA,EAAA,MAAA;AAAA,EACA,OAAA;AAAA;AAAA;AAAA;AAAA,IACA,aAAA;AAAA,MAIA,MAAA;AAAA,MACA,SAAA;AAAA,MACA,WAAA,CAAAC,MAAAA,KAAAA,EAAA,UAAA;AAAA,IACA;AAAA;AAAA;AAAA;AAAA;AAAA,IACA,eAAA;AAAA,MAMA,MAAA;AAAA,MACA,SAAAJ,EAAA;AAAA,IACA;AAAA;AAAA;AAAA;AAAA,IACA,OAAA;AAAA,MAKA,MAAA;AAAA,MACA,SAAA;AAAA,IACA;AAAA,EACA;AAAA,EACA,MAAAK,GAAA,EAAA,OAAAC,EAAA,GAAA;AAEA,UAAAC,IAAAC,EAAAF,CAAA,GAGAG,IAAA,CAAAC,MAAA;;AACA,WAAAC,IAAAN,EAAA,gBAAA,QAAAM,EAAAD,QAAAE,IAAAP,EAAA,gBAAA,gBAAAO,EAAAF,QAAA,QAAA;AACA,cAAAG,IAAAR,EAAA,YAAAK,CAAA;AACA,eAAA;AAAA,UAAA,0BAAAG,EAAA,KAAA;AAAA,UACA,4BAAAA,EAAA,MAAA;AAAA,UACA,4BAAAA,EAAA,KAAA;AAAA,QACA;AAAA,MACA;AAEA,aAAA;AAAA,IAAA,GAGAC,IAAAC,EAAA,OAAA;AAAA,MAAA,wCAAAV,EAAA,kBAAAL,EAAA;AAAA,MACA,sCAAAK,EAAA,kBAAAL,EAAA;AAAA,MACA,2BAAAK,EAAA,gBAAA,QAAAA,EAAA,YAAA,MAAA,CAAAW,MAAAA,MAAA,MAAA;AAAA,MAEA,yBAAAX,EAAA;AAAA,IACA,EAAA;AAGA,WAAA;AAAA;AAAA,MAAA,mBAAAI;AAAA,MAEA,iBAAAK;AAAA;AAAA,MACA,SAAAP;AAAA,IAGA;AAAA,EACA;AAEA,CAAA;;;;;;;;;;;;;"}

package/dist/chunks/{header-meta.CfloYa86.js → header-meta.C75OXHwb.js}

@@ -1,17 +1,16 @@
 import { defineComponent as O, ref as d, computed as x, useSlots as B } from "vue";
-import { B as E } from "./popover.Bo4Bkudr.js";
-import { B as R } from "./popover.types.CBqyA4ly.js";
-import { B as T } from "./typography.J1v_SPG3.js";
-import { g as N } from "./generate-uid.NJ8tVoha.js";
+import { h as E, a as R } from "./toggle-button.DeECoGRn.js";
+import { B as N } from "./popover.types.B1HUQoCG.js";
+import { B as T } from "./typography.w3m-EY4E.js";
+import { g as U } from "./generate-uid.NJ8tVoha.js";
 import { u as S } from "./i18n.BQkEbtPM.js";
-import { I as U } from "./info.CszJ0kMi.js";
+import { I as y } from "./info.CszJ0kMi.js";
 import { n as D } from "./_plugin-vue2_normalizer.CeySl7Fu.js";
-import { u as y } from "./use-has-slot.C9lQZ6nz.js";
-import { r as _, t as m, l as L, c as w, g as I } from "./index.BrH1t1iu.js";
-import { d as C, g as X } from "./get-date-locale.CAyOIbcp.js";
-import { c as A } from "./index.BxBB1rsx.js";
-import { R as F } from "./refresh.arF7jP-l.js";
-import { d as H } from "./button-actions.Ju27CRNG.js";
+import { u as L } from "./use-has-slot.C9lQZ6nz.js";
+import { r as _, t as m, l as w, c as C, g as I } from "./index.BrH1t1iu.js";
+import { d as X, g as A } from "./get-date-locale.CAyOIbcp.js";
+import { c as F } from "./index.BxBB1rsx.js";
+import { R as H } from "./refresh.arF7jP-l.js";
 import "../assets/header-meta.css";
 function Y(r, t) {
   return _(2, arguments), m(r).getTime() - m(t).getTime();
@@ -37,13 +36,13 @@ var M = 1440, V = 2520, h = 43200, W = 86400;
 function k(r, t) {
   var n = arguments.length > 2 && arguments[2] !== void 0 ? arguments[2] : {};
   _(2, arguments);
-  var e = n.locale || L;
+  var e = n.locale || w;
   if (!e.formatDistance)
     throw new RangeError("locale must contain formatDistance property");
-  var c = w(r, t);
+  var c = C(r, t);
   if (isNaN(c))
     throw new RangeError("Invalid time value");
-  var o = A(n);
+  var o = F(n);
   o.addSuffix = !!n.addSuffix, o.comparison = c;
   var s, i;
   c > 0 ? (s = m(t), i = m(r)) : (s = m(r), i = m(t));
@@ -66,7 +65,7 @@ function k(r, t) {
     } else if (a < W)
       return l = Math.round(a / h), e.formatDistance("aboutXMonths", l, o);
   }
-  if (l = C(i, s), l < 12) {
+  if (l = X(i, s), l < 12) {
     var b = Math.round(a / h);
     return e.formatDistance("xMonths", b, o);
   } else {
@@ -103,11 +102,11 @@ const J = {
     popoverPosition: {
       type: String,
       default: "bottom-start",
-      validator: (r) => Object.values(R).includes(r)
+      validator: (r) => Object.values(N).includes(r)
     }
   },
   setup(r) {
-    const { t: n } = S(), e = d(), c = d(null), o = N("bento-info-icon-with-popover"), s = d(), i = d(), f = () => {
+    const { t: n } = S(), e = d(), c = d(null), o = U("bento-info-icon-with-popover"), s = d(), i = d(), f = () => {
       s.value = !0, i.value && clearTimeout(i.value);
     }, p = () => {
       const u = setTimeout(() => {
@@ -119,7 +118,7 @@ const J = {
       f();
     }, infoIconOnFocusOut: (u) => {
       (!e.value || !((u == null ? void 0 : u.relatedTarget) instanceof Element) || !e.value.contains(u.relatedTarget)) && p();
-    }, BentoPopover: E, BentoTypography: T, InfoIcon: U };
+    }, BentoPopover: E, BentoTypography: T, InfoIcon: y };
   }
 });
 var Z = function() {
@@ -133,9 +132,9 @@ var Z = function() {
   ee,
   !1,
   null,
-  "92839081"
+  "d4854f91"
 );
-const Te = te.exports, oe = {
+const Oe = te.exports, oe = {
   "en-US": {
     lastUpdated: "Last updated: {date} ago"
   }
@@ -150,14 +149,14 @@ const Te = te.exports, oe = {
     reloadButton: { default: null }
   },
   setup(r) {
-    const t = r, { t: n, locale: e } = S(), c = X(), o = x(
+    const t = r, { t: n, locale: e } = S(), c = A(), o = x(
       () => t.lastUpdated ? n("lastUpdated", {
         date: q(t.lastUpdated, {
           locale: c[e.value.substring(0, 2)] || c.enUS
         })
       }) : null
-    ), s = B(), i = y(s);
-    return { __sfc: !0, t: n, locale: e, locales: c, timestamp: o, props: t, slots: s, hasSlot: i, BentoTypography: T, BentoLoadingButton: H, ReloadIcon: F };
+    ), s = B(), i = L(s);
+    return { __sfc: !0, t: n, locale: e, locales: c, timestamp: o, props: t, slots: s, hasSlot: i, BentoTypography: T, BentoLoadingButton: R, ReloadIcon: H };
   }
 });
 var ae = function() {
@@ -175,9 +174,9 @@ var ae = function() {
   null,
   "9d512fe5"
 );
-const Se = ie.exports;
+const Te = ie.exports;
 export {
-  Se as H,
-  Te as I
+  Te as H,
+  Oe as I
 };
-//# sourceMappingURL=header-meta.CfloYa86.js.map
+//# sourceMappingURL=header-meta.C75OXHwb.js.map