@adyen/bento-vue3 1.85.0 → 1.86.0

package/dist/chunks/{layout-row.Ccw24NzW.js.map → layout-row.Bz-mRqAq.js.map}

@@ -1 +1 @@
-{"version":3,"file":"layout-row.Ccw24NzW.js","sources":["../../../vue2/src/components/layout/layout.keys.ts","../../../vue2/src/components/layout/layout.vue","../../../vue2/src/components/layout/layout.types.ts","../../../vue2/src/components/layout/components/layout-row/layout-row.vue"],"sourcesContent":["export const LAYOUT_SIZE_INJECTION_KEY = Symbol('Layout size inject key');\n","<template>\n    <component :is=\"wrapperElement\" class=\"b-layout\" :class=\"conditionalClasses\">\n        <slot />\n    </component>\n</template>\n\n<script setup lang=\"ts\">\n    import { computed, provide, toRef } from 'vue';\n    import { type BentoLayoutProps } from './layout.types';\n    import { LAYOUT_SIZE_INJECTION_KEY } from '@/components/layout/layout.keys';\n\n    const props = withDefaults(defineProps<BentoLayoutProps>(), {\n        size: 'full-width',\n        variant: 'page',\n    });\n\n    provide(LAYOUT_SIZE_INJECTION_KEY, toRef(props, 'size'));\n\n    const conditionalClasses = computed(() => ({\n        'b-layout--component': props.variant === 'component',\n    }));\n\n    const wrapperElement = props.variant === 'page' ? 'main' : 'div';\n</script>\n\n<script lang=\"ts\">\n    /**\n     * Layout is a basic scaffolding of a page that defines spacing, some functionality and responsive behavior of its top level sections.\n     *\n     * @example\n     * import { BentoLayout, BentoLayoutRow } from '@adyen/bento-vue2';\n     *\n     * export default {\n     *     components: { BentoLayout, BentoLayoutRow },\n     *     template: `\n     *          <bento-layout size=\"narrow\">\n     *              <bento-layout-row>\n     *                  Row 1\n     *              </bento-layout-row>\n     *              <bento-layout-row>\n     *                  Row 2\n     *              </bento-layout-row>\n     *          </bento-layout>\n     *     `\n     * }\n     */\n    export default {};\n</script>\n\n<style lang=\"scss\" scoped src=\"./layout.scss\" />\n","/**\n * @private\n */\nexport const BentoLayoutVariantOptions = ['page', 'component'] as const;\nexport const BentoLayoutSizeOptions = ['full-width', 'narrow', 'half-width'] as const;\nexport const BentoLayoutRowColumnLayoutOptions = ['3-9', '9-3', '4-8', '8-4', '6-6'] as const;\n\n// Public\nexport type BentoLayoutVariant = (typeof BentoLayoutVariantOptions)[number];\nexport type BentoLayoutSize = (typeof BentoLayoutSizeOptions)[number];\nexport type BentoLayoutRowColumnLayout = (typeof BentoLayoutRowColumnLayoutOptions)[number];\n\nexport interface BentoLayoutProps {\n    /** Defines if the layout is used in a page or only a section */\n    variant?: BentoLayoutVariant;\n    /** Defines the size of the page */\n    size?: BentoLayoutSize;\n}\n\nexport interface BentoLayoutRowProps {\n    /** Sets the layout of the columns when multiple columns are used */\n    columnsLayout?: BentoLayoutRowColumnLayout;\n}\n","<template>\n    <bento-typography el=\"div\" class=\"b-layout-row\" :class=\"conditionalRowClass\">\n        <div v-if=\"hasSlot('default')\">\n            <slot />\n        </div>\n        <div v-else-if=\"hasSlot('col-1') && hasSlot('col-2')\" ref=\"row\" :class=\"conditionalRowWithColumnsClass\">\n            <div ref=\"col1\" :class=\"conditionalColumnClass.col1\">\n                <slot name=\"col-1\"></slot>\n            </div>\n            <div ref=\"col2\" :class=\"conditionalColumnClass.col2\">\n                <slot name=\"col-2\"></slot>\n            </div>\n        </div>\n    </bento-typography>\n</template>\n\n<script setup lang=\"ts\">\n    import { computed, inject, nextTick, onMounted, ref, type Ref, useSlots, watch } from 'vue';\n    import { BentoTypography } from '@/components/typography';\n    import { useHasSlot } from '@/composables';\n    import {\n        BentoLayoutRowColumnLayoutOptions,\n        type BentoLayoutRowProps,\n        type BentoLayoutSize,\n    } from '../../layout.types';\n    import { useMediaQuery } from '@vueuse/core';\n\n    import { LAYOUT_SIZE_INJECTION_KEY } from '@/components/layout/layout.keys';\n\n    const props = withDefaults(defineProps<BentoLayoutRowProps>(), {\n        columnsLayout: '6-6',\n    });\n\n    const slots = useSlots();\n    const hasSlot = useHasSlot(slots);\n    const size = inject<Ref<BentoLayoutSize>>(LAYOUT_SIZE_INJECTION_KEY, ref('full-width'));\n\n    const row = ref<HTMLElement>(null);\n    const col1 = ref<HTMLElement>(null);\n    const col2 = ref<HTMLElement>(null);\n\n    const isFullWidth = computed(() => size.value === 'full-width');\n    const isValidColumnLayout = computed(() => BentoLayoutRowColumnLayoutOptions.includes(props.columnsLayout));\n\n    const conditionalRowClass = computed(() => `b-layout-row--${size.value}`);\n\n    const conditionalRowWithColumnsClass = computed(() => ({\n        'b-layout-row__column-wrapper': isFullWidth.value,\n    }));\n\n    const conditionalColumnClass = computed(() => {\n        const columns = isValidColumnLayout.value ? props.columnsLayout.split('-') : [6, 6];\n        const getColumnModifier = index => (isFullWidth.value ? columns[index] : size.value);\n\n        return {\n            col1: `b-layout-row__column--${getColumnModifier(0)}`,\n            col2: `b-layout-row__column--${getColumnModifier(1)}`,\n        };\n    });\n\n    watch(\n        useMediaQuery('(min-width: 768px)'),\n        async isLargeScreen => {\n            await nextTick();\n            const areColumnsInTheRightOrder = row.value?.firstChild === col1.value;\n            if (isLargeScreen && !areColumnsInTheRightOrder) {\n                row.value?.prepend(col1.value);\n            } else if (!isLargeScreen && (props.columnsLayout === '3-9' || props.columnsLayout === '4-8')) {\n                row.value?.prepend(col2.value);\n            }\n        },\n        { immediate: true }\n    );\n\n    onMounted(() => {\n        if (!isFullWidth.value && (hasSlot('col-1') || hasSlot('col-2'))) {\n            throw new Error(\n                'Column slots can only be used with the `full-width` size. Please check documentation for more info.'\n            );\n        }\n\n        if (!isValidColumnLayout.value) {\n            throw new Error(\n                `${props.columnsLayout} is not a valid column layout. Please refer to the documentation for the list of available column layouts.`\n            );\n        }\n    });\n</script>\n\n<script lang=\"ts\">\n    /**\n     * Page row is subcomponent of Layout meant to be used to generate the row layout.\n     *\n     * @example\n     * import { BentoLayout, BentoLayoutRow } from '@adyen/bento-vue2';\n     *\n     * export default {\n     *     components: { BentoLayout, BentoLayoutRow },\n     *     template: `\n     *          <bento-layout>\n     *              <bento-layout-row columns-layout=\"3-9\">\n     *                  <template #col-1>Narrow 3-9</template>\n     *                  <template #col-2>Wide 3-9</template>\n     *              </bento-layout-row>\n     *              <bento-layout-row>\n     *                  <template #col-1>6-6</template>\n     *                  <template #col-2>6-6</template>\n     *              </bento-layout-row>\n     *          </bento-layout>\n     *     `\n     * }\n     */\n    export default {};\n</script>\n\n<style lang=\"scss\" scoped src=\"./layout-row.scss\" />\n"],"names":["LAYOUT_SIZE_INJECTION_KEY","__default__$1","props","__props","provide","toRef","conditionalClasses","computed","wrapperElement","BentoLayoutRowColumnLayoutOptions","__default__","slots","useSlots","hasSlot","useHasSlot","size","inject","ref","row","col1","col2","isFullWidth","isValidColumnLayout","conditionalRowClass","conditionalRowWithColumnsClass","conditionalColumnClass","columns","getColumnModifier","index","watch","useMediaQuery","isLargeScreen","nextTick","areColumnsInTheRightOrder","_a","_b","_c","onMounted"],"mappings":";;;;;;AAAO,MAAAA,IAAA,uBAAA,wBAAA,GC8CHC,IAAA,CAAA;;;;;;;;AAnCA,UAAAC,IAAAC;AAKA,IAAAC,EAAAJ,GAAAK,EAAAH,GAAA,MAAA,CAAA;AAEA,UAAAI,IAAAC,EAAA,OAAA;AAAA,MAA2C,uBAAAL,EAAA,YAAA;AAAA,IACE,EAAA,GAG7CM,IAAAN,EAAA,YAAA,SAAA,SAAA;;;;;;;;;;mECjBGO,IAAA,CAAA,OAAA,OAAA,OAAA,OAAA,KAAA,mBC2GHC,IAAA,CAAA;;;;;;;AAnFA,UAAAR,IAAAC,GAIAQ,IAAAC,EAAA,GACAC,IAAAC,EAAAH,CAAA,GACAI,IAAAC,EAAAhB,GAAAiB,EAAA,YAAA,CAAA,GAEAC,IAAAD,EAAA,IAAA,GACAE,IAAAF,EAAA,IAAA,GACAG,IAAAH,EAAA,IAAA,GAEAI,IAAAd,EAAA,MAAAQ,EAAA,UAAA,YAAA,GACAO,IAAAf,EAAA,MAAAE,EAAA,SAAAP,EAAA,aAAA,CAAA,GAEAqB,IAAAhB,EAAA,MAAA,iBAAAQ,EAAA,KAAA,EAAA,GAEAS,IAAAjB,EAAA,OAAA;AAAA,MAAuD,gCAAAc,EAAA;AAAA,IACP,EAAA,GAGhDI,IAAAlB,EAAA,MAAA;AACI,YAAAmB,IAAAJ,EAAA,QAAApB,EAAA,cAAA,MAAA,GAAA,IAAA,CAAA,GAAA,CAAA,GACAyB,IAAA,CAAAC,MAAAP,EAAA,QAAAK,EAAAE,CAAA,IAAAb,EAAA;AAEA,aAAA;AAAA,QAAO,MAAA,yBAAAY,EAAA,CAAA,CAAA;AAAA,QACgD,MAAA,yBAAAA,EAAA,CAAA,CAAA;AAAA,MACA;AAAA,IACvD,CAAA;AAGJ,WAAAE;AAAA,MAAAC,EAAA,oBAAA;AAAA,MACsC,OAAAC,MAAA;;AAE9B,cAAAC,EAAA;AACA,cAAAC,MAAAC,IAAAhB,EAAA,UAAA,gBAAAgB,EAAA,gBAAAf,EAAA;AACA,QAAAY,KAAA,CAAAE,KACIE,IAAAjB,EAAA,UAAA,QAAAiB,EAAA,QAAAhB,EAAA,SAA6B,CAAAY,MAAA7B,EAAA,kBAAA,SAAAA,EAAA,kBAAA,YAE7BkC,IAAAlB,EAAA,UAAA,QAAAkB,EAAA,QAAAhB,EAAA;AAAA,MACJ;AAAA,MACJ,EAAA,WAAA,GAAA;AAAA,IACkB,GAGtBiB,EAAA,MAAA;AACI,UAAA,CAAAhB,EAAA,UAAAR,EAAA,OAAA,KAAAA,EAAA,OAAA;AACI,cAAA,IAAA;AAAA,UAAU;AAAA,QACN;AAIR,UAAA,CAAAS,EAAA;AACI,cAAA,IAAA;AAAA,UAAU,GAAApB,EAAA,aAAA;AAAA,QACgB;AAAA,IAE9B,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"layout-row.Bz-mRqAq.js","sources":["../../../vue2/src/components/layout/layout.keys.ts","../../../vue2/src/components/layout/layout.vue","../../../vue2/src/components/layout/layout.types.ts","../../../vue2/src/components/layout/components/layout-row/layout-row.vue"],"sourcesContent":["export const LAYOUT_SIZE_INJECTION_KEY = Symbol('Layout size inject key');\n","<template>\n    <component :is=\"wrapperElement\" class=\"b-layout\" :class=\"conditionalClasses\">\n        <slot />\n    </component>\n</template>\n\n<script setup lang=\"ts\">\n    import { computed, provide, toRef } from 'vue';\n    import { type BentoLayoutProps } from './layout.types';\n    import { LAYOUT_SIZE_INJECTION_KEY } from '@/components/layout/layout.keys';\n\n    const props = withDefaults(defineProps<BentoLayoutProps>(), {\n        size: 'full-width',\n        variant: 'page',\n    });\n\n    provide(LAYOUT_SIZE_INJECTION_KEY, toRef(props, 'size'));\n\n    const conditionalClasses = computed(() => ({\n        'b-layout--component': props.variant === 'component',\n    }));\n\n    const wrapperElement = props.variant === 'page' ? 'main' : 'div';\n</script>\n\n<script lang=\"ts\">\n    /**\n     * Layout is a basic scaffolding of a page that defines spacing, some functionality and responsive behavior of its top level sections.\n     *\n     * @example\n     * import { BentoLayout, BentoLayoutRow } from '@adyen/bento-vue2';\n     *\n     * export default {\n     *     components: { BentoLayout, BentoLayoutRow },\n     *     template: `\n     *          <bento-layout size=\"narrow\">\n     *              <bento-layout-row>\n     *                  Row 1\n     *              </bento-layout-row>\n     *              <bento-layout-row>\n     *                  Row 2\n     *              </bento-layout-row>\n     *          </bento-layout>\n     *     `\n     * }\n     */\n    export default {};\n</script>\n\n<style lang=\"scss\" scoped src=\"./layout.scss\" />\n","/**\n * @private\n */\nexport const BentoLayoutVariantOptions = ['page', 'component'] as const;\nexport const BentoLayoutSizeOptions = ['full-width', 'narrow', 'half-width'] as const;\nexport const BentoLayoutRowColumnLayoutOptions = ['3-9', '9-3', '4-8', '8-4', '6-6'] as const;\n\n// Public\nexport type BentoLayoutVariant = (typeof BentoLayoutVariantOptions)[number];\nexport type BentoLayoutSize = (typeof BentoLayoutSizeOptions)[number];\nexport type BentoLayoutRowColumnLayout = (typeof BentoLayoutRowColumnLayoutOptions)[number];\n\nexport interface BentoLayoutProps {\n    /** Defines if the layout is used in a page or only a section */\n    variant?: BentoLayoutVariant;\n    /** Defines the size of the page */\n    size?: BentoLayoutSize;\n}\n\nexport interface BentoLayoutRowProps {\n    /** Sets the layout of the columns when multiple columns are used */\n    columnsLayout?: BentoLayoutRowColumnLayout;\n}\n","<template>\n    <bento-typography el=\"div\" class=\"b-layout-row\" :class=\"conditionalRowClass\">\n        <div v-if=\"hasSlot('default')\">\n            <slot />\n        </div>\n        <div v-else-if=\"hasSlot('col-1') && hasSlot('col-2')\" ref=\"row\" :class=\"conditionalRowWithColumnsClass\">\n            <div ref=\"col1\" :class=\"conditionalColumnClass.col1\">\n                <slot name=\"col-1\"></slot>\n            </div>\n            <div ref=\"col2\" :class=\"conditionalColumnClass.col2\">\n                <slot name=\"col-2\"></slot>\n            </div>\n        </div>\n    </bento-typography>\n</template>\n\n<script setup lang=\"ts\">\n    import { computed, inject, nextTick, onMounted, ref, type Ref, useSlots, watch } from 'vue';\n    import { BentoTypography } from '@/components/typography';\n    import { useHasSlot } from '@/composables';\n    import {\n        BentoLayoutRowColumnLayoutOptions,\n        type BentoLayoutRowProps,\n        type BentoLayoutSize,\n    } from '../../layout.types';\n    import { useMediaQuery } from '@vueuse/core';\n\n    import { LAYOUT_SIZE_INJECTION_KEY } from '@/components/layout/layout.keys';\n\n    const props = withDefaults(defineProps<BentoLayoutRowProps>(), {\n        columnsLayout: '6-6',\n    });\n\n    const slots = useSlots();\n    const hasSlot = useHasSlot(slots);\n    const size = inject<Ref<BentoLayoutSize>>(LAYOUT_SIZE_INJECTION_KEY, ref('full-width'));\n\n    const row = ref<HTMLElement>(null);\n    const col1 = ref<HTMLElement>(null);\n    const col2 = ref<HTMLElement>(null);\n\n    const isFullWidth = computed(() => size.value === 'full-width');\n    const isValidColumnLayout = computed(() => BentoLayoutRowColumnLayoutOptions.includes(props.columnsLayout));\n\n    const conditionalRowClass = computed(() => `b-layout-row--${size.value}`);\n\n    const conditionalRowWithColumnsClass = computed(() => ({\n        'b-layout-row__column-wrapper': isFullWidth.value,\n    }));\n\n    const conditionalColumnClass = computed(() => {\n        const columns = isValidColumnLayout.value ? props.columnsLayout.split('-') : [6, 6];\n        const getColumnModifier = index => (isFullWidth.value ? columns[index] : size.value);\n\n        return {\n            col1: `b-layout-row__column--${getColumnModifier(0)}`,\n            col2: `b-layout-row__column--${getColumnModifier(1)}`,\n        };\n    });\n\n    watch(\n        useMediaQuery('(min-width: 768px)'),\n        async isLargeScreen => {\n            await nextTick();\n            const areColumnsInTheRightOrder = row.value?.firstChild === col1.value;\n            if (isLargeScreen && !areColumnsInTheRightOrder) {\n                row.value?.prepend(col1.value);\n            } else if (!isLargeScreen && (props.columnsLayout === '3-9' || props.columnsLayout === '4-8')) {\n                row.value?.prepend(col2.value);\n            }\n        },\n        { immediate: true }\n    );\n\n    onMounted(() => {\n        if (!isFullWidth.value && (hasSlot('col-1') || hasSlot('col-2'))) {\n            throw new Error(\n                'Column slots can only be used with the `full-width` size. Please check documentation for more info.'\n            );\n        }\n\n        if (!isValidColumnLayout.value) {\n            throw new Error(\n                `${props.columnsLayout} is not a valid column layout. Please refer to the documentation for the list of available column layouts.`\n            );\n        }\n    });\n</script>\n\n<script lang=\"ts\">\n    /**\n     * Page row is subcomponent of Layout meant to be used to generate the row layout.\n     *\n     * @example\n     * import { BentoLayout, BentoLayoutRow } from '@adyen/bento-vue2';\n     *\n     * export default {\n     *     components: { BentoLayout, BentoLayoutRow },\n     *     template: `\n     *          <bento-layout>\n     *              <bento-layout-row columns-layout=\"3-9\">\n     *                  <template #col-1>Narrow 3-9</template>\n     *                  <template #col-2>Wide 3-9</template>\n     *              </bento-layout-row>\n     *              <bento-layout-row>\n     *                  <template #col-1>6-6</template>\n     *                  <template #col-2>6-6</template>\n     *              </bento-layout-row>\n     *          </bento-layout>\n     *     `\n     * }\n     */\n    export default {};\n</script>\n\n<style lang=\"scss\" scoped src=\"./layout-row.scss\" />\n"],"names":["LAYOUT_SIZE_INJECTION_KEY","__default__$1","props","__props","provide","toRef","conditionalClasses","computed","wrapperElement","BentoLayoutRowColumnLayoutOptions","__default__","slots","useSlots","hasSlot","useHasSlot","size","inject","ref","row","col1","col2","isFullWidth","isValidColumnLayout","conditionalRowClass","conditionalRowWithColumnsClass","conditionalColumnClass","columns","getColumnModifier","index","watch","useMediaQuery","isLargeScreen","nextTick","areColumnsInTheRightOrder","_a","_b","_c","onMounted"],"mappings":";;;;;;AAAO,MAAAA,IAAA,uBAAA,wBAAA,GC8CHC,IAAA,CAAA;;;;;;;;AAnCA,UAAAC,IAAAC;AAKA,IAAAC,EAAAJ,GAAAK,EAAAH,GAAA,MAAA,CAAA;AAEA,UAAAI,IAAAC,EAAA,OAAA;AAAA,MAA2C,uBAAAL,EAAA,YAAA;AAAA,IACE,EAAA,GAG7CM,IAAAN,EAAA,YAAA,SAAA,SAAA;;;;;;;;;;mECjBGO,IAAA,CAAA,OAAA,OAAA,OAAA,OAAA,KAAA,mBC2GHC,IAAA,CAAA;;;;;;;AAnFA,UAAAR,IAAAC,GAIAQ,IAAAC,EAAA,GACAC,IAAAC,EAAAH,CAAA,GACAI,IAAAC,EAAAhB,GAAAiB,EAAA,YAAA,CAAA,GAEAC,IAAAD,EAAA,IAAA,GACAE,IAAAF,EAAA,IAAA,GACAG,IAAAH,EAAA,IAAA,GAEAI,IAAAd,EAAA,MAAAQ,EAAA,UAAA,YAAA,GACAO,IAAAf,EAAA,MAAAE,EAAA,SAAAP,EAAA,aAAA,CAAA,GAEAqB,IAAAhB,EAAA,MAAA,iBAAAQ,EAAA,KAAA,EAAA,GAEAS,IAAAjB,EAAA,OAAA;AAAA,MAAuD,gCAAAc,EAAA;AAAA,IACP,EAAA,GAGhDI,IAAAlB,EAAA,MAAA;AACI,YAAAmB,IAAAJ,EAAA,QAAApB,EAAA,cAAA,MAAA,GAAA,IAAA,CAAA,GAAA,CAAA,GACAyB,IAAA,CAAAC,MAAAP,EAAA,QAAAK,EAAAE,CAAA,IAAAb,EAAA;AAEA,aAAA;AAAA,QAAO,MAAA,yBAAAY,EAAA,CAAA,CAAA;AAAA,QACgD,MAAA,yBAAAA,EAAA,CAAA,CAAA;AAAA,MACA;AAAA,IACvD,CAAA;AAGJ,WAAAE;AAAA,MAAAC,EAAA,oBAAA;AAAA,MACsC,OAAAC,MAAA;;AAE9B,cAAAC,EAAA;AACA,cAAAC,MAAAC,IAAAhB,EAAA,UAAA,gBAAAgB,EAAA,gBAAAf,EAAA;AACA,QAAAY,KAAA,CAAAE,KACIE,IAAAjB,EAAA,UAAA,QAAAiB,EAAA,QAAAhB,EAAA,SAA6B,CAAAY,MAAA7B,EAAA,kBAAA,SAAAA,EAAA,kBAAA,YAE7BkC,IAAAlB,EAAA,UAAA,QAAAkB,EAAA,QAAAhB,EAAA;AAAA,MACJ;AAAA,MACJ,EAAA,WAAA,GAAA;AAAA,IACkB,GAGtBiB,EAAA,MAAA;AACI,UAAA,CAAAhB,EAAA,UAAAR,EAAA,OAAA,KAAAA,EAAA,OAAA;AACI,cAAA,IAAA;AAAA,UAAU;AAAA,QACN;AAIR,UAAA,CAAAS,EAAA;AACI,cAAA,IAAA;AAAA,UAAU,GAAApB,EAAA,aAAA;AAAA,QACgB;AAAA,IAE9B,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/chunks/{link.BLCQlEZU.js → link.DTCn2EtX.js}

@@ -1,5 +1,5 @@
-import { createElementBlock as l, openBlock as a, mergeProps as y, createCommentVNode as _, createElementVNode as E, toDisplayString as w, defineComponent as C, computed as p, createBlock as c, renderSlot as s, unref as r, withCtx as g, createVNode as L } from "vue";
-import { B as h } from "./typography.6Oo5TOMP.js";
+import { openBlock as a, createElementBlock as l, mergeProps as y, toDisplayString as E, createCommentVNode as _, createElementVNode as w, defineComponent as C, computed as p, createBlock as c, unref as s, withCtx as g, renderSlot as r, createVNode as L } from "vue";
+import { B as h } from "./typography.B3J6_tYk.js";
 import { RouterLink as N } from "vue-router";
 /* empty css              */
 import { _ as $ } from "./_plugin-vue_export-helper.CHgC5LLL.js";
@@ -19,8 +19,8 @@ function R(o, n, e, f, m, u) {
     height: "16",
     fill: "none"
   }), [
-    o.$attrs["svg-title"] ? (a(), l("title", V, w(o.$attrs["svg-title"]), 1)) : _("", !0),
-    n[0] || (n[0] = E("path", {
+    o.$attrs["svg-title"] ? (a(), l("title", V, E(o.$attrs["svg-title"]), 1)) : _("", !0),
+    n[0] || (n[0] = w("path", {
       fill: "#001222",
       d: "M2.93933 11.9999L10.1893 4.74989H5.24999V3.24989H12.75V10.7499H11.25V5.81055L3.99999 13.0605L2.93933 11.9999Z"
     }, null, -1))
@@ -70,35 +70,35 @@ const U = /* @__PURE__ */ $(I, [["render", R]]), S = ["href", "target"], A = {
         class: u.value,
         onClick: v
       }), [
-        t.disableTypography ? s(t.$slots, "default", { key: 1 }, void 0, !0) : (a(), c(r(h), {
+        t.disableTypography ? r(t.$slots, "default", { key: 1 }, void 0, !0) : (a(), c(s(h), {
           key: 0,
           class: "b-link__text",
           el: "span",
           variant: "body"
         }, {
           default: g(() => [
-            s(t.$slots, "default", {}, void 0, !0)
+            r(t.$slots, "default", {}, void 0, !0)
           ]),
           _: 3
         })),
         T.value ? (a(), l("span", A, [
-          L(r(U), { "aria-hidden": "true" })
+          L(s(U), { "aria-hidden": "true" })
         ])) : _("", !0)
-      ], 16, S)) : (a(), c(r(N), y({ key: 1 }, { ...e, ...t.$attrs, ...f }, {
+      ], 16, S)) : (a(), c(s(N), y({ key: 1 }, { ...e, ...t.$attrs, ...f }, {
         to: e.to,
         class: u.value,
         target: t.target,
         onClick: v
       }), {
         default: g(() => [
-          t.disableTypography ? s(t.$slots, "default", { key: 1 }, void 0, !0) : (a(), c(r(h), {
+          t.disableTypography ? r(t.$slots, "default", { key: 1 }, void 0, !0) : (a(), c(s(h), {
             key: 0,
             class: "b-link__text",
             el: "span",
             variant: "body"
           }, {
             default: g(() => [
-              s(t.$slots, "default", {}, void 0, !0)
+              r(t.$slots, "default", {}, void 0, !0)
             ]),
             _: 3
           }))
@@ -113,4 +113,4 @@ export {
   U as E,
   i as a
 };
-//# sourceMappingURL=link.BLCQlEZU.js.map
+//# sourceMappingURL=link.DTCn2EtX.js.map

package/dist/chunks/{link.BLCQlEZU.js.map → link.DTCn2EtX.js.map}

@@ -1 +1 @@
-{"version":3,"file":"link.BLCQlEZU.js","sources":["../../../core/src/components/link/link.types.ts","../../../ui-assets/icons-16/dist/vue/external-link.vue","../../src/components/link/link.vue"],"sourcesContent":["/**\n * @deprecated for usage with properties since version 2.0. Use the string literal instead.\n */\nexport enum BentoLinkVariant {\n    DEFAULT = 'default',\n    QUIET = 'quiet',\n}\n\nexport interface LinkProps {\n    /**\n     * Disable the default typography for the component. Only use this when the component is inside another typography component.\n     */\n    disableTypography?: boolean;\n\n    /**\n     * Set the rendered link to a regular external anchor link and renders an external link icon.\n     */\n    external?: boolean;\n\n    /**\n     * Set to true if used inside a `BentoButton` component.\n     */\n    isButton?: boolean;\n\n    /**\n     * Set the rendered link to a regular external anchor link.\n     */\n    isNotRouting?: boolean;\n\n    /**\n     * Sets the target of the rendered link.\n     */\n    target?: string;\n\n    /**\n     * Set to true to truncate link. Doesn't work with disableTypography.\n     */\n    truncate?: boolean;\n\n    /**\n     * Link variant type affecting visual style.\n     * @values default, quiet\n     */\n    variant?: BentoLinkVariant | `${BentoLinkVariant}`;\n}\n","\n<template>\n    <svg role=\"img\" v-bind=\"$attrs\" class=\"ui-assets-icons-16\" xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" fill=\"none\"><title v-if=\"$attrs['svg-title']\">{{ $attrs['svg-title'] }}</title><path fill=\"#001222\" d=\"M2.93933 11.9999L10.1893 4.74989H5.24999V3.24989H12.75V10.7499H11.25V5.81055L3.99999 13.0605L2.93933 11.9999Z\"/></svg>\n</template>\n<script>\n    import '../css/main.css';\n\n    let uuid = 0;\n\n    export default {\n        beforeCreate() {\n            this.uuid = uuid.toString();\n            uuid += 1;\n        },\n    };\n</script>\n","<template>\n    <a\n        v-if=\"external || isNotRouting\"\n        v-bind=\"$attrs\"\n        :href=\"to?.toString()\"\n        :target=\"computedTarget\"\n        :class=\"conditionalClasses\"\n        @click=\"onClick\"\n    >\n        <bento-typography v-if=\"!disableTypography\" class=\"b-link__text\" el=\"span\" variant=\"body\">\n            <slot />\n        </bento-typography>\n        <slot v-else />\n        <span v-if=\"showExternalLinkIcon\" class=\"b-link__external-link-icon\">\n            <external-link-icon aria-hidden=\"true\" />\n        </span>\n    </a>\n    <router-link\n        v-else\n        v-bind=\"{ ...props, ...$attrs, ...nonForwardedProps }\"\n        :to=\"props.to\"\n        :class=\"conditionalClasses\"\n        :target=\"target\"\n        @click=\"onClick\"\n    >\n        <bento-typography v-if=\"!disableTypography\" class=\"b-link__text\" el=\"span\" variant=\"body\">\n            <slot />\n        </bento-typography>\n        <slot v-else />\n    </router-link>\n</template>\n\n<script setup lang=\"ts\">\n    import { BentoLinkVariant } from '@/core/components/link/link.types';\n    import { BentoTypography } from '@/components/typography';\n    import { computed } from 'vue';\n    import { RouterLink } from 'vue-router';\n    import type { BentoLinkProps } from './link.types';\n\n    import ExternalLinkIcon from '@adyen/ui-assets-icons-16/vue/external-link';\n\n    const props = withDefaults(defineProps<BentoLinkProps>(), {\n        target: null,\n        variant: BentoLinkVariant.DEFAULT,\n    });\n\n    // Props that should not be forwarded to the underlying anchor element\n    const nonForwardedProps = {\n        variant: undefined,\n        isButton: undefined,\n        truncate: undefined,\n        disableTypography: undefined,\n        external: undefined,\n        isNotRouting: undefined,\n    };\n\n    const emit = defineEmits(['click']);\n    const conditionalClasses = computed(() => ({\n        'b-link': !props.isButton,\n        [`b-link--${BentoLinkVariant.QUIET}`]: props.variant === BentoLinkVariant.QUIET,\n        [`b-link--truncate`]: props.truncate,\n    }));\n    const computedTarget = computed(() => (props.external ? (props.target ?? '_blank') : props.target));\n    const showExternalLinkIcon = computed(() => !(props.isButton || props.isNotRouting));\n\n    // eslint-disable-next-line @typescript-eslint/no-explicit-any\n    const onClick = (e: MouseEvent, navigateCallback?: any) => {\n        emit('click', e);\n        if (navigateCallback) {\n            navigateCallback();\n        }\n    };\n</script>\n\n<style lang=\"scss\" scoped src=\"@/core/components/link/link.scss\" />\n"],"names":["BentoLinkVariant","BentoLinkVariant2","uuid","openBlock","createElementBlock","mergeProps","_ctx","createCommentVNode","props","__props","nonForwardedProps","emit","__emit","conditionalClasses","computed","computedTarget","showExternalLinkIcon","onClick","e","navigateCallback"],"mappings":";;;;;;AAGO,IAAAA,IAAA,kBAAAC,OACHA,EAAA,UAAA,WACAA,EAAA,QAAA,SAFQA,IAAAD,KAAA,CAAA,CAAA;ACIR,IAAAE,IAAA;;EAGI,eAAA;8BAEIA,KAAA;AAAA;;;AAVR,SAAAC,EAAA,GAAAC,EAAA,OAAAC,EAAA,EAAA,MAAA,MAAA,GAAAC,EAAA,QAAA;AAAA,IAAgC,OAAA;AAAA,IAA2B,OAAA;AAAA,IAAmC,OAAA;AAAA,IAAW,QAAA;AAAA,IAAY,MAAA;AAAA;gFAFzHC,EAAA,IAAA,EAAA;AAAA;MAE8M,MAAA;AAAA,MAAe,GAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;ACuCzN,UAAAC,IAAAC,GAMAC,IAAA;AAAA,MAA0B,SAAA;AAAA,MACb,UAAA;AAAA,MACC,UAAA;AAAA,MACA,mBAAA;AAAA,MACS,UAAA;AAAA,MACT,cAAA;AAAA,IACI,GAGlBC,IAAAC,GACAC,IAAAC,EAAA,OAAA;AAAA,MAA2C,UAAA,CAAAN,EAAA;AAAA,MACtB,CAAA,WAAAR,EAAA,KAAA,EAAA,GAAAQ,EAAA,YAAAR,EAAA;AAAA,MACyD,oBAAAQ,EAAA;AAAA,IAC9C,EAAA,GAEhCO,IAAAD,EAAA,MAAAN,EAAA,WAAAA,EAAA,UAAA,WAAAA,EAAA,MAAA,GACAQ,IAAAF,EAAA,MAAA,EAAAN,EAAA,YAAAA,EAAA,aAAA,GAGAS,IAAA,CAAAC,GAAAC,MAAA;AACI,MAAAR,EAAA,SAAAO,CAAA,GACAC,KACIA,EAAA;AAAA,IACJ;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"link.DTCn2EtX.js","sources":["../../../core/src/components/link/link.types.ts","../../../ui-assets/icons-16/dist/vue/external-link.vue","../../src/components/link/link.vue"],"sourcesContent":["/**\n * @deprecated for usage with properties since version 2.0. Use the string literal instead.\n */\nexport enum BentoLinkVariant {\n    DEFAULT = 'default',\n    QUIET = 'quiet',\n}\n\nexport interface LinkProps {\n    /**\n     * Disable the default typography for the component. Only use this when the component is inside another typography component.\n     */\n    disableTypography?: boolean;\n\n    /**\n     * Set the rendered link to a regular external anchor link and renders an external link icon.\n     */\n    external?: boolean;\n\n    /**\n     * Set to true if used inside a `BentoButton` component.\n     */\n    isButton?: boolean;\n\n    /**\n     * Set the rendered link to a regular external anchor link.\n     */\n    isNotRouting?: boolean;\n\n    /**\n     * Sets the target of the rendered link.\n     */\n    target?: string;\n\n    /**\n     * Set to true to truncate link. Doesn't work with disableTypography.\n     */\n    truncate?: boolean;\n\n    /**\n     * Link variant type affecting visual style.\n     * @values default, quiet\n     */\n    variant?: BentoLinkVariant | `${BentoLinkVariant}`;\n}\n","\n<template>\n    <svg role=\"img\" v-bind=\"$attrs\" class=\"ui-assets-icons-16\" xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" fill=\"none\"><title v-if=\"$attrs['svg-title']\">{{ $attrs['svg-title'] }}</title><path fill=\"#001222\" d=\"M2.93933 11.9999L10.1893 4.74989H5.24999V3.24989H12.75V10.7499H11.25V5.81055L3.99999 13.0605L2.93933 11.9999Z\"/></svg>\n</template>\n<script>\n    import '../css/main.css';\n\n    let uuid = 0;\n\n    export default {\n        beforeCreate() {\n            this.uuid = uuid.toString();\n            uuid += 1;\n        },\n    };\n</script>\n","<template>\n    <a\n        v-if=\"external || isNotRouting\"\n        v-bind=\"$attrs\"\n        :href=\"to?.toString()\"\n        :target=\"computedTarget\"\n        :class=\"conditionalClasses\"\n        @click=\"onClick\"\n    >\n        <bento-typography v-if=\"!disableTypography\" class=\"b-link__text\" el=\"span\" variant=\"body\">\n            <slot />\n        </bento-typography>\n        <slot v-else />\n        <span v-if=\"showExternalLinkIcon\" class=\"b-link__external-link-icon\">\n            <external-link-icon aria-hidden=\"true\" />\n        </span>\n    </a>\n    <router-link\n        v-else\n        v-bind=\"{ ...props, ...$attrs, ...nonForwardedProps }\"\n        :to=\"props.to\"\n        :class=\"conditionalClasses\"\n        :target=\"target\"\n        @click=\"onClick\"\n    >\n        <bento-typography v-if=\"!disableTypography\" class=\"b-link__text\" el=\"span\" variant=\"body\">\n            <slot />\n        </bento-typography>\n        <slot v-else />\n    </router-link>\n</template>\n\n<script setup lang=\"ts\">\n    import { BentoLinkVariant } from '@/core/components/link/link.types';\n    import { BentoTypography } from '@/components/typography';\n    import { computed } from 'vue';\n    import { RouterLink } from 'vue-router';\n    import type { BentoLinkProps } from './link.types';\n\n    import ExternalLinkIcon from '@adyen/ui-assets-icons-16/vue/external-link';\n\n    const props = withDefaults(defineProps<BentoLinkProps>(), {\n        target: null,\n        variant: BentoLinkVariant.DEFAULT,\n    });\n\n    // Props that should not be forwarded to the underlying anchor element\n    const nonForwardedProps = {\n        variant: undefined,\n        isButton: undefined,\n        truncate: undefined,\n        disableTypography: undefined,\n        external: undefined,\n        isNotRouting: undefined,\n    };\n\n    const emit = defineEmits(['click']);\n    const conditionalClasses = computed(() => ({\n        'b-link': !props.isButton,\n        [`b-link--${BentoLinkVariant.QUIET}`]: props.variant === BentoLinkVariant.QUIET,\n        [`b-link--truncate`]: props.truncate,\n    }));\n    const computedTarget = computed(() => (props.external ? (props.target ?? '_blank') : props.target));\n    const showExternalLinkIcon = computed(() => !(props.isButton || props.isNotRouting));\n\n    // eslint-disable-next-line @typescript-eslint/no-explicit-any\n    const onClick = (e: MouseEvent, navigateCallback?: any) => {\n        emit('click', e);\n        if (navigateCallback) {\n            navigateCallback();\n        }\n    };\n</script>\n\n<style lang=\"scss\" scoped src=\"@/core/components/link/link.scss\" />\n"],"names":["BentoLinkVariant","BentoLinkVariant2","uuid","openBlock","createElementBlock","mergeProps","_ctx","createCommentVNode","props","__props","nonForwardedProps","emit","__emit","conditionalClasses","computed","computedTarget","showExternalLinkIcon","onClick","e","navigateCallback"],"mappings":";;;;;;AAGO,IAAAA,IAAA,kBAAAC,OACHA,EAAA,UAAA,WACAA,EAAA,QAAA,SAFQA,IAAAD,KAAA,CAAA,CAAA;ACIR,IAAAE,IAAA;;EAGI,eAAA;8BAEIA,KAAA;AAAA;;;AAVR,SAAAC,EAAA,GAAAC,EAAA,OAAAC,EAAA,EAAA,MAAA,MAAA,GAAAC,EAAA,QAAA;AAAA,IAAgC,OAAA;AAAA,IAA2B,OAAA;AAAA,IAAmC,OAAA;AAAA,IAAW,QAAA;AAAA,IAAY,MAAA;AAAA;gFAFzHC,EAAA,IAAA,EAAA;AAAA;MAE8M,MAAA;AAAA,MAAe,GAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;ACuCzN,UAAAC,IAAAC,GAMAC,IAAA;AAAA,MAA0B,SAAA;AAAA,MACb,UAAA;AAAA,MACC,UAAA;AAAA,MACA,mBAAA;AAAA,MACS,UAAA;AAAA,MACT,cAAA;AAAA,IACI,GAGlBC,IAAAC,GACAC,IAAAC,EAAA,OAAA;AAAA,MAA2C,UAAA,CAAAN,EAAA;AAAA,MACtB,CAAA,WAAAR,EAAA,KAAA,EAAA,GAAAQ,EAAA,YAAAR,EAAA;AAAA,MACyD,oBAAAQ,EAAA;AAAA,IAC9C,EAAA,GAEhCO,IAAAD,EAAA,MAAAN,EAAA,WAAAA,EAAA,UAAA,WAAAA,EAAA,MAAA,GACAQ,IAAAF,EAAA,MAAA,EAAAN,EAAA,YAAAA,EAAA,aAAA,GAGAS,IAAA,CAAAC,GAAAC,MAAA;AACI,MAAAR,EAAA,SAAAO,CAAA,GACAC,KACIA,EAAA;AAAA,IACJ;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/chunks/{listbox-option-tag.BHQiD5oC.js → listbox-option-tag.C3ihNg6_.js}

@@ -1,6 +1,6 @@
-import { defineComponent as r, computed as i, resolveComponent as t, createElementBlock as s, openBlock as e, createElementVNode as l, createBlock as c, createCommentVNode as m, createVNode as _, withCtx as b, createTextVNode as d, toDisplayString as g } from "vue";
-import { B as f } from "./tag.CNN_D55j.js";
-import { B as u } from "./typography.6Oo5TOMP.js";
+import { defineComponent as r, computed as i, resolveComponent as t, openBlock as e, createElementBlock as s, createElementVNode as l, createVNode as c, createBlock as m, withCtx as _, createTextVNode as b, toDisplayString as d, createCommentVNode as g } from "vue";
+import { B as f } from "./tag.Dr7MKe9q.js";
+import { B as u } from "./typography.B3J6_tYk.js";
 import { _ as h } from "./_plugin-vue_export-helper.CHgC5LLL.js";
 import "../assets/listbox-option-tag.css";
 const y = r({
@@ -32,26 +32,26 @@ function x(o, n, k, C, N, T) {
     l("span", {
       "aria-hidden": !!o.option.label
     }, [
-      _(a, {
+      c(a, {
         class: "b-listbox-tag-option__tag",
         label: o.option.value.toString(),
         variant: o.variant
       }, null, 8, ["label", "variant"])
     ], 8, B),
-    o.option.label ? (e(), c(p, {
+    o.option.label ? (e(), m(p, {
       key: 0,
       el: "span",
       class: "b-listbox-tag-option__label"
     }, {
-      default: b(() => [
-        d(g(o.option.label), 1)
+      default: _(() => [
+        b(d(o.option.label), 1)
       ]),
       _: 1
-    })) : m("", !0)
+    })) : g("", !0)
   ]);
 }
 const O = /* @__PURE__ */ h(y, [["render", x], ["__scopeId", "data-v-f55ef3b1"]]);
 export {
   O as L
 };
-//# sourceMappingURL=listbox-option-tag.BHQiD5oC.js.map
+//# sourceMappingURL=listbox-option-tag.C3ihNg6_.js.map

package/dist/chunks/{listbox-option-tag.BHQiD5oC.js.map → listbox-option-tag.C3ihNg6_.js.map}

@@ -1 +1 @@
-{"version":3,"file":"listbox-option-tag.BHQiD5oC.js","sources":["../../../vue2/src/components/internal/listbox/components/listbox-option-tag/listbox-option-tag.vue"],"sourcesContent":["<template>\n    <span class=\"b-listbox-tag-option\">\n        <span :aria-hidden=\"!!option.label\">\n            <bento-tag class=\"b-listbox-tag-option__tag\" :label=\"option.value.toString()\" :variant=\"variant\" />\n        </span>\n        <bento-typography v-if=\"option.label\" el=\"span\" class=\"b-listbox-tag-option__label\">\n            {{ option.label }}\n        </bento-typography>\n    </span>\n</template>\n<script lang=\"ts\">\n    import { computed, defineComponent, type PropType } from 'vue';\n    import type { BentoListboxOptionItem } from '@/types/listbox';\n    import { BentoTag, type BentoTagVariant } from '@/components/tag';\n    import { BentoTypography } from '@/components/typography';\n\n    /**\n     * A Tag Dropdown option item used in the Dropdown and Filter components.\n     */\n    export default defineComponent({\n        name: 'listbox-tag-option',\n        components: {\n            BentoTag,\n            BentoTypography,\n        },\n        props: {\n            /**\n             * The option item that contains all the option item's data.\n             * @type {BentoListboxOptionItem}\n             */\n            option: {\n                type: Object as PropType<BentoListboxOptionItem>,\n                required: true,\n            },\n        },\n        setup(props) {\n            const variant = computed(() => props.option.data as BentoTagVariant);\n\n            return {\n                // Values\n                variant,\n            };\n        },\n    });\n</script>\n<style lang=\"scss\" scoped src=\"./listbox-option-tag.scss\" />\n"],"names":["_sfc_main","defineComponent","BentoTag","BentoTypography","props","computed","openBlock","createElementBlock","_hoisted_1","createElementVNode","_ctx","_hoisted_2","createTextVNode","toDisplayString","createCommentVNode"],"mappings":";;;;;AAmBI,MAAAA,IAAAC,EAAA;AAAA,EAA+B,MAAA;AAAA,EACrB,YAAA;AAAA,IACM,UAAAC;AAAA,IACR,iBAAAC;AAAA,EACA;AAAA,EACJ,OAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IACO,QAAA;AAAA,MAKK,MAAA;AAAA,MACE,UAAA;AAAA,IACI;AAAA,EACd;AAAA,EACJ,MAAAC,GAAA;AAII,WAAA;AAAA;AAAA,MAAO,SAFPC,EAAA,MAAAD,EAAA,OAAA,IAAA;AAAA,IAII;AAAA,EACJ;AAER,CAAA;;;AAzCW,SAAAE,EAAA,GAAAC,EAAA,QAAAC,GAAA;AAAA,IAA2BC,EAAA,QAAA;AAAA;IACqE,GAAA;AAAA;QAAzB,OAAA;AAAA,QAAY,OAAAC,EAAA,OAAA,MAAA,SAAA;AAAA,QAHlG,SAAAA,EAAA;AAAA,MAAA,GAAA,MAAA,GAAA,CAAA,SAAA,SAAA,CAAA;AAAA,IAK4C,GAAA,GAAAC,CAAA;AAAA;MAAW,KAAA;AAAA,MAAM,IAAA;AAAA,MAL7D,OAAA;AAAA,IAAA,GAAA;AAAA;QAAAC,EAAAC,EAAAH,EAAA,OAAA,KAAA,GAAA,CAAA;AAAA,MAAA,CAAA;AAAA,MAAA,GAAA;AAAA,IAAA,CAAA,KAAAI,EAAA,IAAA,EAAA;AAAA;;;"}
+{"version":3,"file":"listbox-option-tag.C3ihNg6_.js","sources":["../../../vue2/src/components/internal/listbox/components/listbox-option-tag/listbox-option-tag.vue"],"sourcesContent":["<template>\n    <span class=\"b-listbox-tag-option\">\n        <span :aria-hidden=\"!!option.label\">\n            <bento-tag class=\"b-listbox-tag-option__tag\" :label=\"option.value.toString()\" :variant=\"variant\" />\n        </span>\n        <bento-typography v-if=\"option.label\" el=\"span\" class=\"b-listbox-tag-option__label\">\n            {{ option.label }}\n        </bento-typography>\n    </span>\n</template>\n<script lang=\"ts\">\n    import { computed, defineComponent, type PropType } from 'vue';\n    import type { BentoListboxOptionItem } from '@/types/listbox';\n    import { BentoTag, type BentoTagVariant } from '@/components/tag';\n    import { BentoTypography } from '@/components/typography';\n\n    /**\n     * A Tag Dropdown option item used in the Dropdown and Filter components.\n     */\n    export default defineComponent({\n        name: 'listbox-tag-option',\n        components: {\n            BentoTag,\n            BentoTypography,\n        },\n        props: {\n            /**\n             * The option item that contains all the option item's data.\n             * @type {BentoListboxOptionItem}\n             */\n            option: {\n                type: Object as PropType<BentoListboxOptionItem>,\n                required: true,\n            },\n        },\n        setup(props) {\n            const variant = computed(() => props.option.data as BentoTagVariant);\n\n            return {\n                // Values\n                variant,\n            };\n        },\n    });\n</script>\n<style lang=\"scss\" scoped src=\"./listbox-option-tag.scss\" />\n"],"names":["_sfc_main","defineComponent","BentoTag","BentoTypography","props","computed","openBlock","createElementBlock","_hoisted_1","createElementVNode","_ctx","_hoisted_2","createTextVNode","toDisplayString","createCommentVNode"],"mappings":";;;;;AAmBI,MAAAA,IAAAC,EAAA;AAAA,EAA+B,MAAA;AAAA,EACrB,YAAA;AAAA,IACM,UAAAC;AAAA,IACR,iBAAAC;AAAA,EACA;AAAA,EACJ,OAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IACO,QAAA;AAAA,MAKK,MAAA;AAAA,MACE,UAAA;AAAA,IACI;AAAA,EACd;AAAA,EACJ,MAAAC,GAAA;AAII,WAAA;AAAA;AAAA,MAAO,SAFPC,EAAA,MAAAD,EAAA,OAAA,IAAA;AAAA,IAII;AAAA,EACJ;AAER,CAAA;;;AAzCW,SAAAE,EAAA,GAAAC,EAAA,QAAAC,GAAA;AAAA,IAA2BC,EAAA,QAAA;AAAA;IACqE,GAAA;AAAA;QAAzB,OAAA;AAAA,QAAY,OAAAC,EAAA,OAAA,MAAA,SAAA;AAAA,QAHlG,SAAAA,EAAA;AAAA,MAAA,GAAA,MAAA,GAAA,CAAA,SAAA,SAAA,CAAA;AAAA,IAK4C,GAAA,GAAAC,CAAA;AAAA;MAAW,KAAA;AAAA,MAAM,IAAA;AAAA,MAL7D,OAAA;AAAA,IAAA,GAAA;AAAA;QAAAC,EAAAC,EAAAH,EAAA,OAAA,KAAA,GAAA,CAAA;AAAA,MAAA,CAAA;AAAA,MAAA,GAAA;AAAA,IAAA,CAAA,KAAAI,EAAA,IAAA,EAAA;AAAA;;;"}

package/dist/chunks/{loading-indicator.Db794TT5.js → loading-indicator.BPol9I84.js}

@@ -1,4 +1,4 @@
-import { defineComponent as i, onMounted as r, onUnmounted as s, computed as d, createElementBlock as c, openBlock as m, normalizeClass as p } from "vue";
+import { defineComponent as i, onMounted as r, onUnmounted as s, computed as d, openBlock as c, createElementBlock as m, normalizeClass as p } from "vue";
 import { _ as u } from "./_plugin-vue_export-helper.CHgC5LLL.js";
 import "../assets/loading-indicator.css";
 var o = /* @__PURE__ */ ((a) => (a.START = "loading-start", a.END = "loading-end", a))(o || {});
@@ -19,7 +19,7 @@ const f = {
       "b-loading-indicator--small": e.small,
       "b-loading-indicator--large": e.large
     }));
-    return (g, b) => (m(), c("div", {
+    return (g, b) => (c(), m("div", {
       class: p(["b-loading-indicator", l.value]),
       "aria-hidden": "true",
       "data-testid": "loading-indicator"
@@ -30,4 +30,4 @@ export {
   T as B,
   o as a
 };
-//# sourceMappingURL=loading-indicator.Db794TT5.js.map
+//# sourceMappingURL=loading-indicator.BPol9I84.js.map

package/dist/chunks/{loading-indicator.Db794TT5.js.map → loading-indicator.BPol9I84.js.map}

@@ -1 +1 @@
-{"version":3,"file":"loading-indicator.Db794TT5.js","sources":["../../../vue2/src/components/loading-indicator/loading-indicator.types.ts","../../../vue2/src/components/loading-indicator/loading-indicator.vue"],"sourcesContent":["export enum BentoLoadingIndicatorEvent {\n    START = 'loading-start',\n    END = 'loading-end',\n}\n\nexport interface BentoLoadingIndicatorProps {\n    /**\n     * Displays the loading indicator in a small size\n     */\n    small?: boolean;\n    /**\n     * Displays the loading indicator in a large size\n     */\n    large?: boolean;\n    /**\n     * Displays the loading indicator in a white variant\n     */\n    inverse?: boolean;\n}\n","<template>\n    <div class=\"b-loading-indicator\" :class=\"conditionalClasses\" aria-hidden=\"true\" data-testid=\"loading-indicator\" />\n</template>\n\n<script setup lang=\"ts\">\n    import { computed, onMounted, onUnmounted } from 'vue';\n    import { BentoLoadingIndicatorEvent, type BentoLoadingIndicatorProps } from './loading-indicator.types';\n\n    const props = withDefaults(defineProps<BentoLoadingIndicatorProps>(), {\n        small: false,\n        large: false,\n        inverse: false,\n    });\n\n    const emit = defineEmits<{\n        (e: BentoLoadingIndicatorEvent.START): void;\n        (e: BentoLoadingIndicatorEvent.END): void;\n    }>();\n\n    onMounted(() => emit(BentoLoadingIndicatorEvent.START));\n\n    onUnmounted(() => emit(BentoLoadingIndicatorEvent.END));\n\n    const conditionalClasses = computed(() => ({\n        'b-loading-indicator--inverse': props.inverse,\n        'b-loading-indicator--small': props.small,\n        'b-loading-indicator--large': props.large,\n    }));\n</script>\n\n<script lang=\"ts\">\n    /**\n     * A loading indicator component that displays a spinning animation.\n     *\n     * @usage\n     * import { BentoLoadingIndicator } from '@adyen/bento-vue2';\n     *\n     * export default {\n     *     components: { BentoLoadingIndicator },\n     *     template: `\n     *         <bento-loading-indicator :small=\"true\" />\n     *     `\n     * };\n     */\n    export default {\n        name: 'bento-loading-indicator',\n    };\n</script>\n\n<style lang=\"scss\" scoped src=\"./loading-indicator.scss\" />\n"],"names":["BentoLoadingIndicatorEvent","BentoLoadingIndicatorEvent2","__default__","props","__props","emit","__emit","onMounted","onUnmounted","conditionalClasses","computed"],"mappings":";;;AAAO,IAAAA,IAAA,kBAAAC,OACHA,EAAA,QAAA,iBACAA,EAAA,MAAA,eAFQA,IAAAD,KAAA,CAAA,CAAA;AC4CR,MAAAE,IAAA;AAAA,EAAe,MAAA;AAEf;;;;;;;;AAtCA,UAAAC,IAAAC,GAMAC,IAAAC;AAKA,IAAAC,EAAA,MAAAF,EAAAL,EAAA,KAAA,CAAA,GAEAQ,EAAA,MAAAH,EAAAL,EAAA,GAAA,CAAA;AAEA,UAAAS,IAAAC,EAAA,OAAA;AAAA,MAA2C,gCAAAP,EAAA;AAAA,MACD,8BAAAA,EAAA;AAAA,MACF,8BAAAA,EAAA;AAAA,IACA,EAAA;;;;;;;;"}
+{"version":3,"file":"loading-indicator.BPol9I84.js","sources":["../../../vue2/src/components/loading-indicator/loading-indicator.types.ts","../../../vue2/src/components/loading-indicator/loading-indicator.vue"],"sourcesContent":["export enum BentoLoadingIndicatorEvent {\n    START = 'loading-start',\n    END = 'loading-end',\n}\n\nexport interface BentoLoadingIndicatorProps {\n    /**\n     * Displays the loading indicator in a small size\n     */\n    small?: boolean;\n    /**\n     * Displays the loading indicator in a large size\n     */\n    large?: boolean;\n    /**\n     * Displays the loading indicator in a white variant\n     */\n    inverse?: boolean;\n}\n","<template>\n    <div class=\"b-loading-indicator\" :class=\"conditionalClasses\" aria-hidden=\"true\" data-testid=\"loading-indicator\" />\n</template>\n\n<script setup lang=\"ts\">\n    import { computed, onMounted, onUnmounted } from 'vue';\n    import { BentoLoadingIndicatorEvent, type BentoLoadingIndicatorProps } from './loading-indicator.types';\n\n    const props = withDefaults(defineProps<BentoLoadingIndicatorProps>(), {\n        small: false,\n        large: false,\n        inverse: false,\n    });\n\n    const emit = defineEmits<{\n        (e: BentoLoadingIndicatorEvent.START): void;\n        (e: BentoLoadingIndicatorEvent.END): void;\n    }>();\n\n    onMounted(() => emit(BentoLoadingIndicatorEvent.START));\n\n    onUnmounted(() => emit(BentoLoadingIndicatorEvent.END));\n\n    const conditionalClasses = computed(() => ({\n        'b-loading-indicator--inverse': props.inverse,\n        'b-loading-indicator--small': props.small,\n        'b-loading-indicator--large': props.large,\n    }));\n</script>\n\n<script lang=\"ts\">\n    /**\n     * A loading indicator component that displays a spinning animation.\n     *\n     * @usage\n     * import { BentoLoadingIndicator } from '@adyen/bento-vue2';\n     *\n     * export default {\n     *     components: { BentoLoadingIndicator },\n     *     template: `\n     *         <bento-loading-indicator :small=\"true\" />\n     *     `\n     * };\n     */\n    export default {\n        name: 'bento-loading-indicator',\n    };\n</script>\n\n<style lang=\"scss\" scoped src=\"./loading-indicator.scss\" />\n"],"names":["BentoLoadingIndicatorEvent","BentoLoadingIndicatorEvent2","__default__","props","__props","emit","__emit","onMounted","onUnmounted","conditionalClasses","computed"],"mappings":";;;AAAO,IAAAA,IAAA,kBAAAC,OACHA,EAAA,QAAA,iBACAA,EAAA,MAAA,eAFQA,IAAAD,KAAA,CAAA,CAAA;AC4CR,MAAAE,IAAA;AAAA,EAAe,MAAA;AAEf;;;;;;;;AAtCA,UAAAC,IAAAC,GAMAC,IAAAC;AAKA,IAAAC,EAAA,MAAAF,EAAAL,EAAA,KAAA,CAAA,GAEAQ,EAAA,MAAAH,EAAAL,EAAA,GAAA,CAAA;AAEA,UAAAS,IAAAC,EAAA,OAAA;AAAA,MAA2C,gCAAAP,EAAA;AAAA,MACD,8BAAAA,EAAA;AAAA,MACF,8BAAAA,EAAA;AAAA,IACA,EAAA;;;;;;;;"}

package/dist/chunks/{minus-small.DYIyF5XW.js → minus-small.CnYLTuSv.js}

@@ -1,5 +1,5 @@
 /* empty css              */
-import { createElementBlock as t, openBlock as s, mergeProps as i, createCommentVNode as l, createElementVNode as n, toDisplayString as a } from "vue";
+import { openBlock as t, createElementBlock as s, mergeProps as i, toDisplayString as l, createCommentVNode as n, createElementVNode as a } from "vue";
 import { _ as d } from "./_plugin-vue_export-helper.CHgC5LLL.js";
 var m = /* @__PURE__ */ ((e) => (e.UNCHECKED = "unchecked", e.CHECKED = "checked", e.DISABLED = "disabled", e.ERROR = "error", e.READONLY = "readonly", e.INDETERMINATE = "indeterminate", e))(m || {}), E = /* @__PURE__ */ ((e) => (e.UPDATE = "update:model-value", e))(E || {});
 let o = 0;
@@ -9,15 +9,15 @@ const u = {
   }
 }, c = { key: 0 };
 function g(e, r, p, f, D, N) {
-  return s(), t("svg", i({ role: "img" }, e.$attrs, {
+  return t(), s("svg", i({ role: "img" }, e.$attrs, {
     class: "ui-assets-icons-16",
     xmlns: "http://www.w3.org/2000/svg",
     width: "16",
     height: "16",
     fill: "none"
   }), [
-    e.$attrs["svg-title"] ? (s(), t("title", c, a(e.$attrs["svg-title"]), 1)) : l("", !0),
-    r[0] || (r[0] = n("path", {
+    e.$attrs["svg-title"] ? (t(), s("title", c, l(e.$attrs["svg-title"]), 1)) : n("", !0),
+    r[0] || (r[0] = a("path", {
       fill: "#001222",
       d: "M4.25 7.25H11.75V8.75H4.25V7.25Z"
     }, null, -1))
@@ -29,4 +29,4 @@ export {
   w as N,
   E as a
 };
-//# sourceMappingURL=minus-small.DYIyF5XW.js.map
+//# sourceMappingURL=minus-small.CnYLTuSv.js.map

package/dist/chunks/{minus-small.DYIyF5XW.js.map → minus-small.CnYLTuSv.js.map}

@@ -1 +1 @@
-{"version":3,"file":"minus-small.DYIyF5XW.js","sources":["../../../vue2/src/components/internal/checkbox-input/checkbox-input.types.ts","../../../ui-assets/icons-16/dist/vue/minus-small.vue"],"sourcesContent":["export type MultiCheckboxInputType = Array<string | number>;\nexport type CheckboxInputType = boolean | MultiCheckboxInputType;\n\nexport enum CheckboxInputState {\n    UNCHECKED = 'unchecked',\n    CHECKED = 'checked',\n    DISABLED = 'disabled',\n    ERROR = 'error',\n    READONLY = 'readonly',\n    INDETERMINATE = 'indeterminate',\n}\n\nexport enum CheckboxInputEvent {\n    UPDATE = 'update:model-value',\n}\n\ninterface CheckboxInputGroupItem {\n    value: string | number;\n    disabled?: boolean;\n    hasError?: boolean;\n    errorMessage?: string;\n    readonly?: boolean;\n}\n\nexport type CheckboxInputGroupItems = Array<CheckboxInputGroupItem>;\n","\n<template>\n    <svg role=\"img\" v-bind=\"$attrs\" class=\"ui-assets-icons-16\" xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" fill=\"none\"><title v-if=\"$attrs['svg-title']\">{{ $attrs['svg-title'] }}</title><path fill=\"#001222\" d=\"M4.25 7.25H11.75V8.75H4.25V7.25Z\"/></svg>\n</template>\n<script>\n    import '../css/main.css';\n\n    let uuid = 0;\n\n    export default {\n        beforeCreate() {\n            this.uuid = uuid.toString();\n            uuid += 1;\n        },\n    };\n</script>\n"],"names":["CheckboxInputState","CheckboxInputEvent","uuid","_sfc_main","_openBlock","_createElementBlock","_mergeProps","_ctx","_hoisted_1","_createCommentVNode","_createElementVNode"],"mappings":";;;AAGO,IAAKA,sBAAAA,OACRA,EAAA,YAAY,aACZA,EAAA,UAAU,WACVA,EAAA,WAAW,YACXA,EAAA,QAAQ,SACRA,EAAA,WAAW,YACXA,EAAA,gBAAgB,iBANRA,IAAAA,KAAA,CAAA,CAAA,GASAC,sBAAAA,OACRA,EAAA,SAAS,sBADDA,IAAAA,KAAA,CAAA,CAAA;ACLR,IAAIC,IAAO;AAEX,MAAKC,IAAU;AAAA,EACX,eAAe;AACX,SAAK,OAAOD,EAAK,SAAQ,GACzBA,KAAQ;AAAA,EACZ;SAbR,KAAA,EAAA;;AAEI,SAAAE,EAAA,GAAAC,EAAqQ,OAArQC,EAAqQ,EAAhQ,MAAK,MAAK,GAASC,EAAA,QAAM;AAAA,IAAE,OAAM;AAAA,IAAqB,OAAM;AAAA,IAA6B,OAAM;AAAA,IAAK,QAAO;AAAA,IAAK,MAAK;AAAA;IAAoBA,EAAA,OAAM,WAAA,UAAnBF,EAAmE,SAFxMG,KAE0KD,EAAA,OAAM,WAAA,CAAA,GAAA,CAAA,KAFhLE,EAAA,IAAA,EAAA;AAAA,oBAEwMC,EAA2D,QAAA;AAAA,MAArD,MAAK;AAAA,MAAU,GAAE;AAAA;;;;"}
+{"version":3,"file":"minus-small.CnYLTuSv.js","sources":["../../../vue2/src/components/internal/checkbox-input/checkbox-input.types.ts","../../../ui-assets/icons-16/dist/vue/minus-small.vue"],"sourcesContent":["export type MultiCheckboxInputType = Array<string | number>;\nexport type CheckboxInputType = boolean | MultiCheckboxInputType;\n\nexport enum CheckboxInputState {\n    UNCHECKED = 'unchecked',\n    CHECKED = 'checked',\n    DISABLED = 'disabled',\n    ERROR = 'error',\n    READONLY = 'readonly',\n    INDETERMINATE = 'indeterminate',\n}\n\nexport enum CheckboxInputEvent {\n    UPDATE = 'update:model-value',\n}\n\ninterface CheckboxInputGroupItem {\n    value: string | number;\n    disabled?: boolean;\n    hasError?: boolean;\n    errorMessage?: string;\n    readonly?: boolean;\n}\n\nexport type CheckboxInputGroupItems = Array<CheckboxInputGroupItem>;\n","\n<template>\n    <svg role=\"img\" v-bind=\"$attrs\" class=\"ui-assets-icons-16\" xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" fill=\"none\"><title v-if=\"$attrs['svg-title']\">{{ $attrs['svg-title'] }}</title><path fill=\"#001222\" d=\"M4.25 7.25H11.75V8.75H4.25V7.25Z\"/></svg>\n</template>\n<script>\n    import '../css/main.css';\n\n    let uuid = 0;\n\n    export default {\n        beforeCreate() {\n            this.uuid = uuid.toString();\n            uuid += 1;\n        },\n    };\n</script>\n"],"names":["CheckboxInputState","CheckboxInputEvent","uuid","_sfc_main","_openBlock","_createElementBlock","_mergeProps","_ctx","_hoisted_1","_createCommentVNode","_createElementVNode"],"mappings":";;;AAGO,IAAKA,sBAAAA,OACRA,EAAA,YAAY,aACZA,EAAA,UAAU,WACVA,EAAA,WAAW,YACXA,EAAA,QAAQ,SACRA,EAAA,WAAW,YACXA,EAAA,gBAAgB,iBANRA,IAAAA,KAAA,CAAA,CAAA,GASAC,sBAAAA,OACRA,EAAA,SAAS,sBADDA,IAAAA,KAAA,CAAA,CAAA;ACLR,IAAIC,IAAO;AAEX,MAAKC,IAAU;AAAA,EACX,eAAe;AACX,SAAK,OAAOD,EAAK,SAAQ,GACzBA,KAAQ;AAAA,EACZ;SAbR,KAAA,EAAA;;AAEI,SAAAE,EAAA,GAAAC,EAAqQ,OAArQC,EAAqQ,EAAhQ,MAAK,MAAK,GAASC,EAAA,QAAM;AAAA,IAAE,OAAM;AAAA,IAAqB,OAAM;AAAA,IAA6B,OAAM;AAAA,IAAK,QAAO;AAAA,IAAK,MAAK;AAAA;IAAoBA,EAAA,OAAM,WAAA,UAAnBF,EAAmE,SAFxMG,KAE0KD,EAAA,OAAM,WAAA,CAAA,GAAA,CAAA,KAFhLE,EAAA,IAAA,EAAA;AAAA,oBAEwMC,EAA2D,QAAA;AAAA,MAArD,MAAK;AAAA,MAAU,GAAE;AAAA;;;;"}

package/dist/chunks/{modal-fullscreen.f445bZ94.js → modal-fullscreen.B3AGUJgl.js}

@@ -1,21 +1,21 @@
-import { defineComponent as L, useSlots as w, onMounted as U, createBlock as s, openBlock as l, unref as t, withCtx as o, createElementVNode as d, renderSlot as p, createElementBlock as O, createCommentVNode as f, createTextVNode as S, toDisplayString as N, getCurrentInstance as Y, toRefs as j, ref as u, computed as z, watch as H, nextTick as q, provide as B, withKeys as Q, normalizeClass as W, withModifiers as X, createSlots as Z, createVNode as k } from "vue";
-import { B as ee } from "./toast.DiIIrX7h.js";
-import { B as te } from "./button.CSp48LJt.js";
-import { B as ae } from "./focus-trap.DH57j-Ov.js";
-import { B as A } from "./typography.6Oo5TOMP.js";
-import { u as x } from "./use-has-slot.B7eQSabc.js";
-import { D as le, B as oe, b as se, a as ne } from "./dialog-page.CF10AQQ3.js";
-import { B as ie, i as re } from "./button-actions.Dk8xU2cz.js";
-import { _ as T } from "./_plugin-vue_export-helper.CHgC5LLL.js";
-import { C as ce } from "./cross.B92GxFTY.js";
-import { u as ue } from "./index.pdBj0KQU.js";
-import { g as de } from "./generate-uid.NJ8tVoha.js";
+import { defineComponent as O, useSlots as x, onMounted as D, openBlock as l, createBlock as i, unref as a, withCtx as s, createElementVNode as d, renderSlot as v, createTextVNode as N, toDisplayString as A, createCommentVNode as f, createElementBlock as T, getCurrentInstance as j, toRefs as z, ref as n, computed as H, onUnmounted as q, watch as Q, provide as E, withKeys as W, withModifiers as X, normalizeClass as Z, createSlots as ee, createVNode as L } from "vue";
+import { B as te } from "./toast.Bbtq3Icj.js";
+import { B as ae } from "./button.C6t9_lzm.js";
+import { B as le } from "./focus-trap.CBvh2H_m.js";
+import { B as k } from "./typography.B3J6_tYk.js";
+import { u as w } from "./use-has-slot.B7eQSabc.js";
+import { b as oe, B as se, D as ne, a as ie } from "./dialog-page.B3ptLXXP.js";
+import { B as re, i as ce } from "./button-actions.BH-J7dux.js";
+import { _ as $ } from "./_plugin-vue_export-helper.CHgC5LLL.js";
+import { C as ue } from "./cross.CCHdi6v3.js";
+import { u as de } from "./index.B875RXHM.js";
+import { g as fe } from "./generate-uid.NJ8tVoha.js";
 import "../assets/modal-fullscreen.css";
-const fe = { class: "b-modal-fullscreen-page__header" }, me = { class: "b-modal-fullscreen-page__header-section b-modal-fullscreen-page__header-section--title" }, pe = {
+const me = { class: "b-modal-fullscreen-page__header" }, pe = { class: "b-modal-fullscreen-page__header-section b-modal-fullscreen-page__header-section--title" }, ve = {
   key: 0,
   class: "b-modal-fullscreen-page__header-section b-modal-fullscreen-page__header-section--slot"
-}, ge = { class: "b-modal-fullscreen-page__header-section b-modal-fullscreen-page__header-section--actions" }, ve = { class: "b-modal-fullscreen-page__content" }, _e = {}, he = /* @__PURE__ */ L({
-  ..._e,
+}, ge = { class: "b-modal-fullscreen-page__header-section b-modal-fullscreen-page__header-section--actions" }, _e = { class: "b-modal-fullscreen-page__content" }, he = {}, be = /* @__PURE__ */ O({
+  ...he,
   __name: "modal-fullscreen-page",
   props: {
     /**
@@ -64,70 +64,70 @@ const fe = { class: "b-modal-fullscreen-page__header" }, me = { class: "b-modal-
     }
   },
   setup(e) {
-    const g = e, v = w(), n = x(v);
-    return U(() => {
+    const g = e, _ = x(), r = w(_);
+    return D(() => {
       if (g.actions && g.actions.length > 2)
         throw new Error("Not more than 2 action buttons may be provided in Bento Modal Fullscreen");
-    }), (m, i) => (l(), s(t(le), {
+    }), (m, p) => (l(), i(a(oe), {
       class: "b-modal-fullscreen-page",
       "page-id": e.pageId,
       "previous-page": e.previousPage,
       "always-show-border": ""
     }, {
-      header: o(() => [
-        d("div", fe, [
-          d("div", me, [
-            e.title ? (l(), s(t(A), {
+      header: s(() => [
+        d("div", me, [
+          d("div", pe, [
+            e.title ? (l(), i(a(k), {
               key: 0,
               el: "h2",
               variant: "title",
               class: "b-modal-fullscreen-page__title",
               title: e.title
             }, {
-              default: o(() => [
-                S(N(e.title), 1)
+              default: s(() => [
+                N(A(e.title), 1)
               ]),
               _: 1
             }, 8, ["title"])) : f("", !0)
           ]),
-          t(n)("header") ? (l(), O("div", pe, [
-            p(m.$slots, "header", {}, void 0, !0)
+          a(r)("header") ? (l(), T("div", ve, [
+            v(m.$slots, "header", {}, void 0, !0)
           ])) : f("", !0),
           d("div", ge, [
-            e.contextualLabel ? (l(), s(t(A), {
+            e.contextualLabel ? (l(), i(a(k), {
               key: 0,
               class: "b-modal-fullscreen-page__contextual-label",
               el: "span",
               title: e.contextualLabel
             }, {
-              default: o(() => [
-                S(N(e.contextualLabel), 1)
+              default: s(() => [
+                N(A(e.contextualLabel), 1)
               ]),
               _: 1
             }, 8, ["title"])) : f("", !0),
-            e.actions ? (l(), s(t(ie), {
+            e.actions ? (l(), i(a(re), {
               key: 1,
               class: "b-modal-fullscreen-page__actions",
               actions: e.actions
             }, null, 8, ["actions"])) : f("", !0),
-            i[0] || (i[0] = d("div", { class: "b-modal-fullscreen-page__separator" }, null, -1))
+            p[0] || (p[0] = d("div", { class: "b-modal-fullscreen-page__separator" }, null, -1))
           ])
         ])
       ]),
-      content: o(() => [
-        d("div", ve, [
-          p(m.$slots, "default", {}, void 0, !0)
+      content: s(() => [
+        d("div", _e, [
+          v(m.$slots, "default", {}, void 0, !0)
         ])
       ]),
       _: 3
     }, 8, ["page-id", "previous-page"]));
   }
-}), be = /* @__PURE__ */ T(he, [["__scopeId", "data-v-a1480899"]]);
-function ye() {
+}), ye = /* @__PURE__ */ $(be, [["__scopeId", "data-v-a1480899"]]);
+function Be() {
   var e;
-  return ((e = Y()) == null ? void 0 : e.vnode.props) ?? {};
+  return ((e = j()) == null ? void 0 : e.vnode.props) ?? {};
 }
-const D = {
+const F = {
   "en-US": {
     close: "Close"
   },
@@ -137,10 +137,10 @@ const D = {
   "pt-BR": {
     close: "Fechar"
   }
-}, Be = ["id", "onKeydown"], Ee = { class: "b-modal-fullscreen__close-button" }, Ie = {
-  i18n: { messages: D }
-}, Pe = /* @__PURE__ */ L({
-  ...Ie,
+}, Ee = ["id", "onKeydown"], Ie = { class: "b-modal-fullscreen__close-button" }, Pe = {
+  i18n: { messages: F }
+}, Ce = /* @__PURE__ */ O({
+  ...Pe,
   __name: "modal-fullscreen",
   props: {
     /**
@@ -189,84 +189,88 @@ const D = {
   },
   emits: ["before-close", "update:active-page", "update:is-open"],
   setup(e, { emit: g }) {
-    const v = e, n = g, { activePage: m, isOpen: i } = j(v), { t: M } = ue({ messages: D }), r = u(null), _ = u(!1), E = de("modal-fullscreen"), h = u(!1), $ = ye(), F = w(), I = x(F), G = z(() => ({
-      "b-modal-fullscreen--hide": _.value
-    })), R = () => {
-      _.value && (r.value.close(), c.value[0] && n("update:active-page", c.value[0]), c.value = [], _.value = !1, h.value = !1, n("update:is-open", !1));
+    const _ = e, r = g, { activePage: m, isOpen: p } = z(_), { t: G } = de({ messages: F }), c = n(null), h = n(!1), I = fe("modal-fullscreen"), b = n(!1), B = n(!1), M = Be(), R = x(), P = w(R), K = H(() => ({
+      "b-modal-fullscreen--hide": h.value
+    })), J = () => {
+      h.value && c.value && (c.value.close(), u.value[0] && r("update:active-page", u.value[0]), u.value = [], h.value = !1, b.value = !1, r("update:is-open", !1));
     };
-    function P() {
-      if ($["onBeforeClose"]) {
-        n("before-close");
+    function C() {
+      if (M["onBeforeClose"]) {
+        r("before-close");
         return;
       }
-      C();
+      S();
     }
-    const C = () => {
-      r.value.open && (_.value = !0);
+    const S = () => {
+      !c.value || !c.value.open || (h.value = !0);
     };
-    H(
-      () => i.value,
-      async () => {
-        await q(), r.value && (i.value ? (h.value = !0, r.value.showModal(), c.value.length || c.value.push(m.value)) : r.value.open && C());
+    D(() => {
+      B.value = !0;
+    }), q(() => {
+      B.value = !1;
+    }), Q(
+      [() => p.value, c],
+      ([t, o]) => {
+        !B.value || !o || (t ? (b.value = !0, o.open || o.showModal(), u.value.length || u.value.push(m.value)) : o.open && S());
       },
-      { immediate: !0 }
-    ), B(re, E);
-    const K = u(oe.TRANSITION_LEVEL_DEEPER), b = u([]), c = u([]);
-    B(se, {
+      { immediate: !0, flush: "post" }
+    ), E(ce, I);
+    const U = n(se.TRANSITION_LEVEL_DEEPER), y = n([]), u = n([]);
+    E(ne, {
       activePage: m,
-      animation: K,
-      isOpen: h,
-      pages: b,
-      previousPages: c,
-      updatePage: (a) => n("update:active-page", a)
+      animation: U,
+      isOpen: b,
+      pages: y,
+      previousPages: u,
+      updatePage: (t) => r("update:active-page", t)
     });
-    const V = (a) => () => {
-      var y;
-      b.value = (y = b.value) == null ? void 0 : y.filter((J) => J !== a);
+    const Y = (t) => () => {
+      var o;
+      y.value = (o = y.value) == null ? void 0 : o.filter((V) => V !== t);
     };
-    return B(ne, (a) => (a && b.value.push(a), { unregisterPage: V(a) })), (a, y) => (l(), O("dialog", {
-      id: t(E),
+    return E(ie, (t) => (t && y.value.push(t), { unregisterPage: Y(t) })), (t, o) => (l(), T("dialog", {
+      id: a(I),
       ref_key: "modal",
-      ref: r,
-      class: W(["b-modal-fullscreen", G.value]),
+      ref: c,
+      class: Z(["b-modal-fullscreen", K.value]),
       "data-dialog-element": "modal-fullscreen",
-      onAnimationend: R,
-      onKeydown: Q(X(P, ["prevent"]), ["esc"])
+      onAnimationend: J,
+      onKeydown: W(X(C, ["prevent"]), ["esc"])
     }, [
-      h.value ? (l(), s(t(ae), {
+      b.value ? (l(), i(a(le), {
         key: 0,
         class: "b-modal-fullscreen__wrapper"
       }, {
-        default: o(() => [
-          v.activePage ? p(a.$slots, "default", { key: 0 }, void 0, !0) : (l(), s(be, {
+        default: s(() => [
+          _.activePage ? v(t.$slots, "default", { key: 0 }, void 0, !0) : (l(), i(ye, {
             key: 1,
             actions: e.actions,
             "contextual-label": e.contextualLabel,
             title: e.title
-          }, Z({ _: 2 }, [
-            t(I)("default") ? {
+          }, ee({ _: 2 }, [
+            a(P)("default") ? {
               name: "default",
-              fn: o(() => [
-                p(a.$slots, "default", {}, void 0, !0)
+              fn: s(() => [
+                v(t.$slots, "default", {}, void 0, !0)
               ]),
               key: "0"
             } : void 0,
-            t(I)("header") ? {
+            a(P)("header") ? {
               name: "header",
-              fn: o(() => [
-                p(a.$slots, "header", {}, void 0, !0)
+              fn: s(() => [
+                v(t.$slots, "header", {}, void 0, !0)
               ]),
               key: "1"
             } : void 0
           ]), 1032, ["actions", "contextual-label", "title"])),
-          d("div", Ee, [
-            k(t(te), {
+          d("div", Ie, [
+            L(a(ae), {
               variant: "tertiary",
-              "aria-label": t(M)("close"),
-              onClick: P
+              "aria-label": a(G)("close"),
+              onClick: C
             }, {
-              iconLeft: o(() => [
-                k(t(ce), { "aria-hidden": !0 })
+              iconLeft: s(() => [
+                L(a(ue), { "aria-hidden": !0 })
               ]),
               _: 1
             }, 8, ["aria-label"])
@@ -274,12 +278,12 @@ const D = {
         ]),
         _: 3
       })) : f("", !0),
-      t(i) ? (l(), s(t(ee), { key: 1 })) : f("", !0)
-    ], 42, Be));
+      a(p) ? (l(), i(a(te), { key: 1 })) : f("", !0)
+    ], 42, Ee));
   }
-}), Ge = /* @__PURE__ */ T(Pe, [["__scopeId", "data-v-8289499e"]]);
+}), Re = /* @__PURE__ */ $(Ce, [["__scopeId", "data-v-cfae4534"]]);
 export {
-  be as B,
-  Ge as m
+  ye as B,
+  Re as m
 };
-//# sourceMappingURL=modal-fullscreen.f445bZ94.js.map
+//# sourceMappingURL=modal-fullscreen.B3AGUJgl.js.map