@adyen/bento-vue3 1.27.0 → 1.28.0

package/dist/chunks/{base-button.a0140a4c.js.map → base-button.ewkxHD6W.js.map}

@@ -1 +1 @@
-{"version":3,"file":"base-button.a0140a4c.js","sources":["../../../vue2/src/components/internal/base-button/base-button.types.ts","../../../vue2/src/components/internal/base-button/base-button.vue"],"sourcesContent":["export enum BentoBaseButtonPropClass {\n    DESTRUCTIVE = 'critical',\n    ICON_ONLY = 'icon-only',\n}\n\nexport enum BentoBaseButtonEvent {\n    BLUR = 'blur',\n    CLICK = 'click',\n    FOCUS = 'focus',\n    KEYDOWN_ESC = 'keydown.esc',\n}\n\nexport enum BaseButtonType {\n    BUTTON = 'button',\n    RESET = 'reset',\n    SUBMIT = 'submit',\n}\n","<template>\n    <button\n        ref=\"bentoBaseButtonRef\"\n        class=\"b-base-button\"\n        :class=\"conditionalClasses\"\n        :disabled=\"disabled\"\n        :type=\"type\"\n        :aria-expanded=\"ariaAttributes['aria-expanded']\"\n        @click=\"onClickButton\"\n        @focus=\"onFocusButton\"\n        @blur=\"onBlurButton\"\n    >\n        <span v-if=\"hasSlot('iconLeft')\" class=\"b-base-button__icon-left\" data-testid=\"icon-button-left\">\n            <slot name=\"iconLeft\" />\n        </span>\n        <bento-typography v-if=\"hasSlot('default')\" el=\"span\" variant=\"body\" stronger class=\"b-base-button__label\">\n            <slot />\n        </bento-typography>\n        <span v-if=\"hasSlot('iconRight')\" class=\"b-base-button__icon-right\" data-testid=\"icon-button-right\">\n            <slot name=\"iconRight\" />\n        </span>\n    </button>\n</template>\n\n<script lang=\"ts\">\n    import { computed, defineComponent, PropType, ref } from 'vue';\n    import { BentoBaseButtonEvent, BentoBaseButtonPropClass } from './base-button.types';\n    import type { ButtonHTMLAttributes } from 'vue/types/jsx';\n    import { BentoTypography } from '@/components/typography';\n    import { useHasSlot } from '@/composables';\n    import { Booleanish } from '@/types';\n\n    /**\n     * Base button component to use as a base for all the various types of bento buttons. For internal use only.\n     *\n     * * @example\n     * import { BaseButton, BaseButtonEvent } from '@/components/internal/base-button';\n     * import YourImportedIcon from @adyen/ui-assets-icons-16/example-icon';\n     *\n     * export default {\n     *      components: { BaseButton, YourImportedIcon },\n     *      props: {\n     *         text:\n     *      },\n     *      template: `\n     *          <base-button class=\"your-custom-button-styles\" @click=\"onClick\">\n     *             <template #iconLeft><your-imported-icon></template>\n     *             Button text\n     *             <template #iconRight><your-imported-icon></template>\n     *          </base-button>\n     *      `,\n     *      emits: [BentoButtonEvent.CLICK],\n     *      setup: (prps, { emit }) => {\n     *          const onClick = value => emit(BaseButtonEvent.CLICK, value);\n     *\n     *          return {\n     *              onClick,\n     *          };\n     *      }\n     * }\n     */\n    export default defineComponent({\n        name: 'base-button',\n        components: { BentoTypography },\n        props: {\n            /**\n             * Disables button functionality\n             */\n            disabled: {\n                type: Boolean,\n                default: false,\n            },\n            /**\n             * Displays button as critical\n             */\n            critical: {\n                type: Boolean,\n                default: false,\n            },\n            /**\n             * The default behavior of the button.\n             * Possible values are: 'button', 'reset', 'submit'\n             */\n            type: {\n                type: String as PropType<ButtonHTMLAttributes['type']>,\n                default: 'button',\n            },\n        },\n        emits: [\n            BentoBaseButtonEvent.CLICK,\n            BentoBaseButtonEvent.FOCUS,\n            BentoBaseButtonEvent.BLUR,\n            BentoBaseButtonEvent.KEYDOWN_ESC,\n        ],\n        setup(props, { slots, emit, attrs }) {\n            const ariaAttributes = computed(() => ({\n                'aria-expanded': attrs['aria-expanded']?.toString() as Booleanish,\n            }));\n\n            const bentoBaseButtonRef = ref(null);\n\n            const conditionalClasses = computed(() => ({\n                [`b-base-button--${BentoBaseButtonPropClass.DESTRUCTIVE}`]: props.critical,\n                [`b-base-button--${BentoBaseButtonPropClass.ICON_ONLY}`]: !slots.default,\n            }));\n\n            const onClickButton = (e: MouseEvent) => {\n                if (!props.disabled) {\n                    emit(BentoBaseButtonEvent.CLICK, e);\n                } else {\n                    e.preventDefault();\n                    e.stopPropagation();\n                }\n            };\n\n            const onFocusButton = (e: FocusEvent) => {\n                emit(BentoBaseButtonEvent.FOCUS, e);\n            };\n\n            const onBlurButton = (e: FocusEvent) => {\n                emit(BentoBaseButtonEvent.BLUR, e);\n            };\n\n            return {\n                // Values\n                ariaAttributes,\n                conditionalClasses,\n\n                // Methods\n                onClickButton,\n                onFocusButton,\n                onBlurButton,\n                hasSlot: useHasSlot(slots),\n\n                // Refs\n                bentoBaseButtonRef,\n            };\n        },\n    });\n</script>\n\n<style lang=\"scss\" scoped src=\"./base-button.scss\" />\n"],"names":["BentoBaseButtonPropClass","BentoBaseButtonPropClass2","BentoBaseButtonEvent","BentoBaseButtonEvent2","_sfc_main","defineComponent","BentoTypography","props","slots","emit","attrs","ariaAttributes","computed","_a","bentoBaseButtonRef","ref","conditionalClasses","e","useHasSlot","openBlock","createElementBlock","normalizeClass","_ctx","_cache","args","createCommentVNode","createBlock","_component_bento_typography","_hoisted_3"],"mappings":";;;;;AAAY,IAAAA,IAAA,kBAAAC,OACRA,EAAA,cAAA,YACAA,EAAA,YAAA,aAFQA,IAAAD,KAAA,CAAA,CAAA,GAKAE,IAAA,kBAAAC,OACRA,EAAA,OAAA,QACAA,EAAA,QAAA,SACAA,EAAA,QAAA,SACAA,EAAA,cAAA,eAJQA,IAAAD,KAAA,CAAA,CAAA;ACwDR,MAAAE,IAAAC,EAAA;AAAA,EAA+B,MAAA;AAAA,EACrB,YAAA,EAAA,iBAAAC,EAAA;AAAA,EACwB,OAAA;AAAA;AAAA;AAAA;AAAA,IACvB,UAAA;AAAA,MAIO,MAAA;AAAA,MACA,SAAA;AAAA,IACG;AAAA;AAAA;AAAA;AAAA,IACb,UAAA;AAAA,MAIU,MAAA;AAAA,MACA,SAAA;AAAA,IACG;AAAA;AAAA;AAAA;AAAA;AAAA,IACb,MAAA;AAAA,MAKM,MAAA;AAAA,MACI,SAAA;AAAA,IACG;AAAA,EACb;AAAA,EACJ,OAAA;AAAA,IACOJ,EAAA;AAAA,IACkBA,EAAA;AAAA,IACAA,EAAA;AAAA,IACAA,EAAA;AAAA,EACA;AAAA,EACzB,MAAAK,GAAA,EAAA,OAAAC,GAAA,MAAAC,GAAA,OAAAC,EAAA,GAAA;AAEI,UAAAC,IAAAC,EAAA,MAAA;;AAAA;AAAA,QAAuC,kBAAAC,IAAAH,EAAA,eAAA,MAAA,gBAAAG,EAAA;AAAA,MACe;AAAA,KAAA,GAGtDC,IAAAC,EAAA,IAAA,GAEAC,IAAAJ,EAAA,OAAA;AAAA,MAA2C,CAAA,kBAAAZ,EAAA,aAAA,GAAAO,EAAA;AAAA,MAC2B,CAAA,kBAAAP,EAAA,WAAA,GAAA,CAAAQ,EAAA;AAAA,IACD,EAAA;AAoBrE,WAAA;AAAA;AAAA,MAAO,gBAAAG;AAAA,MAEH,oBAAAK;AAAA;AAAA,MACA,eApBJ,CAAAC,MAAA;AACI,QAAAV,EAAA,YAGIU,EAAA,eAAA,GACAA,EAAA,gBAAA,KAHAR,EAAAP,EAAA,OAAAe,CAAA;AAAA,MAIJ;AAAA,MAiBA,eAdJ,CAAAA,MAAA;AACI,QAAAR,EAAAP,EAAA,OAAAe,CAAA;AAAA,MAAkC;AAAA,MAclC,cAXJ,CAAAA,MAAA;AACI,QAAAR,EAAAP,EAAA,MAAAe,CAAA;AAAA,MAAiC;AAAA,MAWjC,SAAAC,EAAAV,CAAA;AAAA;AAAA,MACyB,oBAAAM;AAAA,IAGzB;AAAA,EACJ;AAER,CAAA;;EA9H2C,KAAA;AAAA,EAA2B,OAAA;AAAA;;EAM1B,KAAA;AAAA,EAA4B,OAAA;AAAA;;;;AAf/D,SAAAK,EAAA,GAAAC,EAAA,UAAA;AAAA,IACG,KAAA;AAAA,IACP,OAAAC,EAAA,CAAA,iBAAAC,EAAA,kBAAA,CAAA;AAAA,IACU,UAAAA,EAAA;AAAA,IACG,MAAAA,EAAA;AAAA,IACR,iBAAAA,EAAA,eAAA,eAAA;AAAA,IACE,SAAAC,EAAA,CAAA,MAAAA,EAAA,CAAA,IAAA,IAAAC,MAAAF,EAAA,iBAAAA,EAAA,cAAA,GAAAE,CAAA;AAAA,IACW,SAAAD,EAAA,CAAA,MAAAA,EAAA,CAAA,IAAA,IAAAC,MAAAF,EAAA,iBAAAA,EAAA,cAAA,GAAAE,CAAA;AAAA;EAEA,GAAA;AAAA;;IAGK,CAAA,KAAAC,EAAA,IAAA,EAAA;AAAA,IAELH,EAAA,QAAA,SAAA,KAAAH,EAAA,GAAAO,EAAAC,GAAA;AAAA,MAFkC,KAAA;AAAA,MAAC,IAAA;AAAA,MAAe,SAAA;AAAA,MAAe,UAAA;AAAA;;;;;;;IAGpFL,EAAA,QAAA,WAAA,KAAAH,EAAA,GAAAC,EAAA,QAAAQ,GAAA;AAAA;;;;;"}
+{"version":3,"file":"base-button.ewkxHD6W.js","sources":["../../../vue2/src/components/internal/base-button/base-button.types.ts","../../../vue2/src/components/internal/base-button/base-button.vue"],"sourcesContent":["export enum BentoBaseButtonPropClass {\n    DESTRUCTIVE = 'critical',\n    ICON_ONLY = 'icon-only',\n}\n\nexport enum BentoBaseButtonEvent {\n    BLUR = 'blur',\n    CLICK = 'click',\n    FOCUS = 'focus',\n    KEYDOWN_ESC = 'keydown.esc',\n}\n\nexport enum BaseButtonType {\n    BUTTON = 'button',\n    RESET = 'reset',\n    SUBMIT = 'submit',\n}\n","<template>\n    <button\n        ref=\"bentoBaseButtonRef\"\n        class=\"b-base-button\"\n        :class=\"conditionalClasses\"\n        :disabled=\"disabled\"\n        :type=\"type\"\n        :aria-expanded=\"ariaAttributes['aria-expanded']\"\n        @click=\"onClickButton\"\n        @focus=\"onFocusButton\"\n        @blur=\"onBlurButton\"\n    >\n        <span v-if=\"hasSlot('iconLeft')\" class=\"b-base-button__icon-left\" data-testid=\"icon-button-left\">\n            <slot name=\"iconLeft\" />\n        </span>\n        <bento-typography v-if=\"hasSlot('default')\" el=\"span\" variant=\"body\" stronger class=\"b-base-button__label\">\n            <slot />\n        </bento-typography>\n        <span v-if=\"hasSlot('iconRight')\" class=\"b-base-button__icon-right\" data-testid=\"icon-button-right\">\n            <slot name=\"iconRight\" />\n        </span>\n    </button>\n</template>\n\n<script lang=\"ts\">\n    import { computed, defineComponent, PropType, ref } from 'vue';\n    import { BentoBaseButtonEvent, BentoBaseButtonPropClass } from './base-button.types';\n    import type { ButtonHTMLAttributes } from 'vue/types/jsx';\n    import { BentoTypography } from '@/components/typography';\n    import { useHasSlot } from '@/composables';\n    import { Booleanish } from '@/types';\n\n    /**\n     * Base button component to use as a base for all the various types of bento buttons. For internal use only.\n     *\n     * * @example\n     * import { BaseButton, BaseButtonEvent } from '@/components/internal/base-button';\n     * import YourImportedIcon from @adyen/ui-assets-icons-16/example-icon';\n     *\n     * export default {\n     *      components: { BaseButton, YourImportedIcon },\n     *      props: {\n     *         text:\n     *      },\n     *      template: `\n     *          <base-button class=\"your-custom-button-styles\" @click=\"onClick\">\n     *             <template #iconLeft><your-imported-icon></template>\n     *             Button text\n     *             <template #iconRight><your-imported-icon></template>\n     *          </base-button>\n     *      `,\n     *      emits: [BentoButtonEvent.CLICK],\n     *      setup: (prps, { emit }) => {\n     *          const onClick = value => emit(BaseButtonEvent.CLICK, value);\n     *\n     *          return {\n     *              onClick,\n     *          };\n     *      }\n     * }\n     */\n    export default defineComponent({\n        name: 'base-button',\n        components: { BentoTypography },\n        props: {\n            /**\n             * Disables button functionality\n             */\n            disabled: {\n                type: Boolean,\n                default: false,\n            },\n            /**\n             * Displays button as critical\n             */\n            critical: {\n                type: Boolean,\n                default: false,\n            },\n            /**\n             * The default behavior of the button.\n             * Possible values are: 'button', 'reset', 'submit'\n             */\n            type: {\n                type: String as PropType<ButtonHTMLAttributes['type']>,\n                default: 'button',\n            },\n        },\n        emits: [\n            BentoBaseButtonEvent.CLICK,\n            BentoBaseButtonEvent.FOCUS,\n            BentoBaseButtonEvent.BLUR,\n            BentoBaseButtonEvent.KEYDOWN_ESC,\n        ],\n        setup(props, { slots, emit, attrs }) {\n            const ariaAttributes = computed(() => ({\n                'aria-expanded': attrs['aria-expanded']?.toString() as Booleanish,\n            }));\n\n            const bentoBaseButtonRef = ref(null);\n\n            const conditionalClasses = computed(() => ({\n                [`b-base-button--${BentoBaseButtonPropClass.DESTRUCTIVE}`]: props.critical,\n                [`b-base-button--${BentoBaseButtonPropClass.ICON_ONLY}`]: !slots.default,\n            }));\n\n            const onClickButton = (e: MouseEvent) => {\n                if (!props.disabled) {\n                    emit(BentoBaseButtonEvent.CLICK, e);\n                } else {\n                    e.preventDefault();\n                    e.stopPropagation();\n                }\n            };\n\n            const onFocusButton = (e: FocusEvent) => {\n                emit(BentoBaseButtonEvent.FOCUS, e);\n            };\n\n            const onBlurButton = (e: FocusEvent) => {\n                emit(BentoBaseButtonEvent.BLUR, e);\n            };\n\n            return {\n                // Values\n                ariaAttributes,\n                conditionalClasses,\n\n                // Methods\n                onClickButton,\n                onFocusButton,\n                onBlurButton,\n                hasSlot: useHasSlot(slots),\n\n                // Refs\n                bentoBaseButtonRef,\n            };\n        },\n    });\n</script>\n\n<style lang=\"scss\" scoped src=\"./base-button.scss\" />\n"],"names":["BentoBaseButtonPropClass","BentoBaseButtonPropClass2","BentoBaseButtonEvent","BentoBaseButtonEvent2","_sfc_main","defineComponent","BentoTypography","props","slots","emit","attrs","ariaAttributes","computed","_a","bentoBaseButtonRef","ref","conditionalClasses","e","useHasSlot","openBlock","createElementBlock","normalizeClass","_ctx","_cache","args","createCommentVNode","createBlock","_component_bento_typography","_hoisted_3"],"mappings":";;;;;AAAY,IAAAA,IAAA,kBAAAC,OACRA,EAAA,cAAA,YACAA,EAAA,YAAA,aAFQA,IAAAD,KAAA,CAAA,CAAA,GAKAE,IAAA,kBAAAC,OACRA,EAAA,OAAA,QACAA,EAAA,QAAA,SACAA,EAAA,QAAA,SACAA,EAAA,cAAA,eAJQA,IAAAD,KAAA,CAAA,CAAA;ACwDR,MAAAE,IAAAC,EAAA;AAAA,EAA+B,MAAA;AAAA,EACrB,YAAA,EAAA,iBAAAC,EAAA;AAAA,EACwB,OAAA;AAAA;AAAA;AAAA;AAAA,IACvB,UAAA;AAAA,MAIO,MAAA;AAAA,MACA,SAAA;AAAA,IACG;AAAA;AAAA;AAAA;AAAA,IACb,UAAA;AAAA,MAIU,MAAA;AAAA,MACA,SAAA;AAAA,IACG;AAAA;AAAA;AAAA;AAAA;AAAA,IACb,MAAA;AAAA,MAKM,MAAA;AAAA,MACI,SAAA;AAAA,IACG;AAAA,EACb;AAAA,EACJ,OAAA;AAAA,IACOJ,EAAA;AAAA,IACkBA,EAAA;AAAA,IACAA,EAAA;AAAA,IACAA,EAAA;AAAA,EACA;AAAA,EACzB,MAAAK,GAAA,EAAA,OAAAC,GAAA,MAAAC,GAAA,OAAAC,EAAA,GAAA;AAEI,UAAAC,IAAAC,EAAA,MAAA;;AAAA;AAAA,QAAuC,kBAAAC,IAAAH,EAAA,eAAA,MAAA,gBAAAG,EAAA;AAAA,MACe;AAAA,KAAA,GAGtDC,IAAAC,EAAA,IAAA,GAEAC,IAAAJ,EAAA,OAAA;AAAA,MAA2C,CAAA,kBAAAZ,EAAA,WAAA,EAAA,GAAAO,EAAA;AAAA,MAC2B,CAAA,kBAAAP,EAAA,SAAA,EAAA,GAAA,CAAAQ,EAAA;AAAA,IACD,EAAA;AAoBrE,WAAA;AAAA;AAAA,MAAO,gBAAAG;AAAA,MAEH,oBAAAK;AAAA;AAAA,MACA,eApBJ,CAAAC,MAAA;AACI,QAAAV,EAAA,YAGIU,EAAA,eAAA,GACAA,EAAA,gBAAA,KAHAR,EAAAP,EAAA,OAAAe,CAAA;AAAA,MAIJ;AAAA,MAiBA,eAdJ,CAAAA,MAAA;AACI,QAAAR,EAAAP,EAAA,OAAAe,CAAA;AAAA,MAAkC;AAAA,MAclC,cAXJ,CAAAA,MAAA;AACI,QAAAR,EAAAP,EAAA,MAAAe,CAAA;AAAA,MAAiC;AAAA,MAWjC,SAAAC,EAAAV,CAAA;AAAA;AAAA,MACyB,oBAAAM;AAAA,IAGzB;AAAA,EACJ;AAER,CAAA;EA9H2C,KAAA;AAAA,EAA2B,OAAA;AAAA;;EAM1B,KAAA;AAAA,EAA4B,OAAA;AAAA;;;;AAf/D,SAAAK,EAAA,GAAAC,EAAA,UAAA;AAAA,IACG,KAAA;AAAA,IACP,OAAAC,EAAA,CAAA,iBAAAC,EAAA,kBAAA,CAAA;AAAA,IACU,UAAAA,EAAA;AAAA,IACG,MAAAA,EAAA;AAAA,IACR,iBAAAA,EAAA,eAAA,eAAA;AAAA,IACE,SAAAC,EAAA,CAAA,MAAAA,EAAA,CAAA,IAAA,IAAAC,MAAAF,EAAA,iBAAAA,EAAA,cAAA,GAAAE,CAAA;AAAA,IACW,SAAAD,EAAA,CAAA,MAAAA,EAAA,CAAA,IAAA,IAAAC,MAAAF,EAAA,iBAAAA,EAAA,cAAA,GAAAE,CAAA;AAAA;EAEA,GAAA;AAAA;;IAGK,CAAA,KAAAC,EAAA,IAAA,EAAA;AAAA,IAELH,EAAA,QAAA,SAAA,KAAAH,EAAA,GAAAO,EAAAC,GAAA;AAAA,MAFkC,KAAA;AAAA,MAAC,IAAA;AAAA,MAAe,SAAA;AAAA,MAAe,UAAA;AAAA;;;;;;;IAGpFL,EAAA,QAAA,WAAA,KAAAH,EAAA,GAAAC,EAAA,QAAAQ,GAAA;AAAA;;;;;"}

package/dist/chunks/{base-modal.4102f69d.js → base-modal.BgYlnM_Q.js}

@@ -1,19 +1,19 @@
-import { defineComponent as F, useSlots as Z, ref as p, computed as u, inject as ce, watch as J, nextTick as ue, onUnmounted as re, openBlock as b, createBlock as O, normalizeClass as W, unref as t, createSlots as ee, withCtx as l, createElementVNode as _, normalizeStyle as P, renderSlot as r, createCommentVNode as M, createVNode as j, useAttrs as me, onMounted as ge, provide as R, toRefs as fe, createElementBlock as pe, withKeys as ve } from "vue";
-import { a as ye } from "./button.ae4760cd.js";
-import { B as _e } from "./index.9d7fb316.js";
-import { u as te } from "./use-has-slot.4d98bf29.js";
-import { u as be } from "./i18n.f7e6533e.js";
-import { M as Ae } from "./base-modal.keys.b08a6bdf.js";
-import { g as Le } from "./unique-id.a2a2b458.js";
-import { B as X } from "./index.ee15db35.js";
-import { F as he } from "./footer-actions.64f6f5d8.js";
-import { D as Ce, B as Ee, b as Ie, a as Pe } from "./dialog-page.cb6ce9b6.js";
-import { o as Oe } from "./resize.a041304d.js";
-import { G as Se, a as ke } from "./grid-layout.c2fe3057.js";
-import { _ as ae } from "./_plugin-vue_export-helper.dad06003.js";
-import { C as De } from "./cross.26509efc.js";
+import { defineComponent as F, useSlots as Z, ref as v, computed as u, inject as ce, watch as J, nextTick as ue, onUnmounted as re, openBlock as _, createBlock as O, normalizeClass as W, unref as t, createSlots as ee, withCtx as i, createElementVNode as b, normalizeStyle as P, renderSlot as r, createCommentVNode as M, createVNode as j, useAttrs as me, onMounted as ge, provide as R, toRefs as fe, createElementBlock as ve, withKeys as pe } from "vue";
+import { B as ye } from "./button.DoqHEvPh.js";
+import { B as be } from "./focus-trap.CwkbHfT8.js";
+import { u as te } from "./use-has-slot.B7eQSabc.js";
+import { u as _e } from "./i18n.DY5YXG5f.js";
+import { M as Ae } from "./base-modal.keys.C2PQXcE2.js";
+import { g as Le } from "./unique-id.XFfoKuc2.js";
+import { B as X } from "./typography.D7onlQ9v.js";
+import { F as he } from "./footer-actions.D9nQFagi.js";
+import { D as Ce, B as Ee, b as Ie, a as Pe } from "./dialog-page.BLqqR73w.js";
+import { o as Oe } from "./resize.Bqks3WUm.js";
+import { G as Se, a as ke } from "./grid-layout.CqLbbEzI.js";
+import { _ as ae } from "./_plugin-vue_export-helper.CHgC5LLL.js";
+import { C as De } from "./cross.BlL0FyHo.js";
 import "../assets/base-modal.css";
-var Ge = /* @__PURE__ */ ((e) => (e.DEFAULT = "default", e.DIALOG = "dialog", e))(Ge || {}), Be = /* @__PURE__ */ ((e) => (e.DEFAULT = "BentoModalDefault", e.DIALOG = "BentoModalDialog", e))(Be || {}), z = /* @__PURE__ */ ((e) => (e.SMALL = "small", e.MEDIUM = "medium", e.LARGE = "large", e))(z || {}), B = /* @__PURE__ */ ((e) => (e.SMALLER = "smaller", e.EQUAL = "equal", e.BIGGER = "bigger", e))(B || {}), $ = /* @__PURE__ */ ((e) => (e.DIALOG = "dialog", e.ALERT_DIALOG = "alertdialog", e))($ || {}), Ne = /* @__PURE__ */ ((e) => (e.CONFIRMATION = "confirmation", e.DESTRUCTIVE = "destructive", e.INFO = "info", e.ACKNOWLEDGEMENT = "acknowledgement", e))(Ne || {}), we = /* @__PURE__ */ ((e) => (e.CLOSE_MODAL = "close-modal", e))(we || {});
+var Be = /* @__PURE__ */ ((e) => (e.DEFAULT = "default", e.DIALOG = "dialog", e))(Be || {}), Ge = /* @__PURE__ */ ((e) => (e.DEFAULT = "BentoModalDefault", e.DIALOG = "BentoModalDialog", e))(Ge || {}), z = /* @__PURE__ */ ((e) => (e.SMALL = "small", e.MEDIUM = "medium", e.LARGE = "large", e))(z || {}), G = /* @__PURE__ */ ((e) => (e.SMALLER = "smaller", e.EQUAL = "equal", e.BIGGER = "bigger", e))(G || {}), $ = /* @__PURE__ */ ((e) => (e.DIALOG = "dialog", e.ALERT_DIALOG = "alertdialog", e))($ || {}), Ne = /* @__PURE__ */ ((e) => (e.CONFIRMATION = "confirmation", e.DESTRUCTIVE = "destructive", e.INFO = "info", e.ACKNOWLEDGEMENT = "acknowledgement", e))(Ne || {}), we = /* @__PURE__ */ ((e) => (e.CLOSE_MODAL = "close-modal", e))(we || {});
 const oe = {
   "en-US": {
     ariaLabelFallback: "modal",
@@ -67,7 +67,7 @@ const oe = {
      */
     columnsSize: {
       type: String,
-      default: B.SMALLER
+      default: G.SMALLER
     },
     /**
      * If provided, manages the padding of the whole modal container
@@ -99,13 +99,13 @@ const oe = {
     }
   },
   setup(e) {
-    const o = e, S = 26, n = Z(), i = te(n), v = p(null), U = u(() => ({
+    const o = e, S = 26, n = Z(), l = te(n), p = v(null), U = u(() => ({
       "b-modal-page--custom-padding": o.customPadding
     })), K = u(() => {
       var s;
       return {
-        "b-modal-page__content--with-header": i("default"),
-        "b-modal-page__content--with-actions": i("actions") || ((s = o.actions) == null ? void 0 : s.length)
+        "b-modal-page__content--with-header": l("default"),
+        "b-modal-page__content--with-actions": l("actions") || ((s = o.actions) == null ? void 0 : s.length)
       };
     }), c = u(() => {
       if (!o.customPadding)
@@ -114,7 +114,7 @@ const oe = {
         paddingLeft: o.customPadding,
         paddingRight: o.customPadding
       }, d = { ...s, paddingTop: void 0, paddingBottom: void 0 };
-      return i("default") || (d.paddingTop = o.customPadding), i("actions") || (d.paddingBottom = o.customPadding), {
+      return l("default") || (d.paddingTop = o.customPadding), l("actions") || (d.paddingBottom = o.customPadding), {
         header: {
           ...s,
           paddingTop: o.customPadding,
@@ -125,10 +125,10 @@ const oe = {
         actions: { ...s, paddingBottom: o.customPadding },
         backButton: { top: o.customPadding, paddingLeft: o.customPadding }
       };
-    }), f = u(() => o.withColumnLayout && q.value === z.LARGE), A = u(() => o.columnsSize === B.SMALLER ? [
+    }), f = u(() => o.withColumnLayout && q.value === z.LARGE), A = u(() => o.columnsSize === G.SMALLER ? [
       { small: 4, medium: 4, large: 4 },
       { small: 8, medium: 8, large: 8 }
-    ] : o.columnsSize === B.BIGGER ? [
+    ] : o.columnsSize === G.BIGGER ? [
       { small: 8, medium: 8, large: 8 },
       { small: 4, medium: 4, large: 4 }
     ] : [
@@ -140,9 +140,9 @@ const oe = {
       () => L.value,
       async (s, d) => {
         var m, k;
-        N.value && (await ue(), h.value = `${(k = (m = v.value) == null ? void 0 : m.$el) == null ? void 0 : k.clientHeight}px`, H.value = o.customPadding, y.value = d !== void 0, C = Oe(v.value, () => {
+        N.value && (await ue(), h.value = `${(k = (m = p.value) == null ? void 0 : m.$el) == null ? void 0 : k.clientHeight}px`, H.value = o.customPadding, y.value = d !== void 0, C = Oe(p.value, () => {
           var E, D;
-          const w = `${(D = (E = v.value) == null ? void 0 : E.$el) == null ? void 0 : D.clientHeight}px` ?? "";
+          const w = `${(D = (E = p.value) == null ? void 0 : E.$el) == null ? void 0 : D.clientHeight}px` ?? "";
           w !== h.value && (h.value = w);
         }));
       },
@@ -151,9 +151,9 @@ const oe = {
       C == null || C.disconnect();
     }), (s, d) => {
       var m;
-      return b(), O(Ce, {
+      return _(), O(Ce, {
         ref_key: "page",
-        ref: v,
+        ref: p,
         class: W(["b-modal-page", t(U)]),
         "page-id": e.pageId,
         "always-show-border": t(f),
@@ -161,30 +161,30 @@ const oe = {
         "previous-page": e.previousPage,
         onAnimationend: d[0] || (d[0] = (k) => y.value = !1)
       }, ee({
-        content: l(() => [
-          _("div", {
+        content: i(() => [
+          b("div", {
             class: W(["b-modal-page__content", t(K)]),
             style: P(t(c).content)
           }, [
-            t(i)("content") || t(i)("content-col-1") && t(i)("content-col-2") ? (b(), O(t(X), {
+            t(l)("content") || t(l)("content-col-1") && t(l)("content-col-2") ? (_(), O(t(X), {
               key: 0,
               "aria-label": "base modal content",
               el: "div",
               variant: "body",
               stronger: ""
             }, {
-              default: l(() => [
-                t(f) ? (b(), O(t(Se), {
+              default: i(() => [
+                t(f) ? (_(), O(t(Se), {
                   key: 0,
                   "column-width": t(A),
                   "container-type": t(ke).NORMAL,
                   "no-gap": "",
                   class: "b-modal-page__grid"
                 }, {
-                  "col-1": l(() => [
+                  "col-1": i(() => [
                     r(s.$slots, "content-col-1", {}, void 0, !0)
                   ]),
-                  "col-2": l(() => [
+                  "col-2": i(() => [
                     r(s.$slots, "content-col-2", {}, void 0, !0)
                   ]),
                   _: 3
@@ -196,14 +196,14 @@ const oe = {
         ]),
         _: 2
       }, [
-        t(i)("default") || t(Y) ? {
+        t(l)("default") || t(Y) ? {
           name: "header",
-          fn: l(() => [
-            _("div", {
+          fn: i(() => [
+            b("div", {
               class: "b-modal-page__header-container",
               style: P(t(c).header)
             }, [
-              _("div", Te, [
+              b("div", Te, [
                 j(t(X), {
                   class: "b-modal-page__title",
                   "aria-label": "base modal title",
@@ -211,8 +211,8 @@ const oe = {
                   variant: "title",
                   stronger: ""
                 }, {
-                  default: l(() => [
-                    t(i)("default") ? r(s.$slots, "default", { key: 0 }, void 0, !0) : M("", !0)
+                  default: i(() => [
+                    t(l)("default") ? r(s.$slots, "default", { key: 0 }, void 0, !0) : M("", !0)
                   ]),
                   _: 3
                 })
@@ -221,14 +221,14 @@ const oe = {
           ]),
           key: "0"
         } : void 0,
-        t(i)("actions") ? {
+        t(l)("actions") ? {
           name: "footer",
-          fn: l(() => [
-            _("div", {
+          fn: i(() => [
+            b("div", {
               class: "b-modal-page__actions-container",
               style: P(t(c).actions)
             }, [
-              _("div", Re, [
+              b("div", Re, [
                 r(s.$slots, "actions", {}, void 0, !0)
               ])
             ], 4)
@@ -236,8 +236,8 @@ const oe = {
           key: "1"
         } : e.actions && e.actions.length > 0 ? {
           name: "footer",
-          fn: l(() => [
-            _("div", {
+          fn: i(() => [
+            b("div", {
               class: "b-modal-page__actions-container",
               style: P(t(c).actions)
             }, [
@@ -253,8 +253,7 @@ const oe = {
       ]), 1032, ["class", "page-id", "always-show-border", "back-button-styling", "previous-page"]);
     };
   }
-});
-const ze = /* @__PURE__ */ ae(Me, [["__scopeId", "data-v-85e34205"]]), Fe = { class: "b-modal-base" }, Ue = ["id", "role", "aria-label", "open", "onKeydown"], Ke = F({
+}), ze = /* @__PURE__ */ ae(Me, [["__scopeId", "data-v-85e34205"]]), Fe = { class: "b-modal-base" }, Ue = ["id", "role", "aria-label", "open", "onKeydown"], Ke = F({
   i18n: { messages: oe },
   name: "base-modal"
 }), He = /* @__PURE__ */ F({
@@ -305,7 +304,7 @@ const ze = /* @__PURE__ */ ae(Me, [["__scopeId", "data-v-85e34205"]]), Fe = { cl
      */
     columnsSize: {
       type: String,
-      default: B.SMALLER
+      default: G.SMALLER
     },
     /**
      * If provided, manages the padding of the whole modal container
@@ -349,7 +348,7 @@ const ze = /* @__PURE__ */ ae(Me, [["__scopeId", "data-v-85e34205"]]), Fe = { cl
   },
   emits: ["update:active-page", "close-modal"],
   setup(e, { expose: o, emit: S }) {
-    const n = e, i = 500, { t: v } = be({ messages: oe }), U = Z(), K = me(), c = te(U), f = p(null), A = p(!1), L = Le("modal"), h = u(() => n.isDismissible && !n.hideCloseButton), y = p(n.customPadding), H = u(() => y.value ? { top: y.value, right: y.value } : {}), Y = u(() => K["aria-label"] ?? v("ariaLabelFallback")), q = u(() => n.withColumnLayout && n.size === z.LARGE), N = () => {
+    const n = e, l = 500, { t: p } = _e({ messages: oe }), U = Z(), K = me(), c = te(U), f = v(null), A = v(!1), L = Le("modal"), h = u(() => n.isDismissible && !n.hideCloseButton), y = v(n.customPadding), H = u(() => y.value ? { top: y.value, right: y.value } : {}), Y = u(() => K["aria-label"] ?? p("ariaLabelFallback")), q = u(() => n.withColumnLayout && n.size === z.LARGE), N = () => {
       f.value.showModal();
     }, C = () => {
       S("close-modal");
@@ -365,20 +364,20 @@ const ze = /* @__PURE__ */ ae(Me, [["__scopeId", "data-v-85e34205"]]), Fe = { cl
       [`b-modal-base__container--${n.size}`]: n.size,
       "b-modal-base__container--hide": A.value,
       "b-modal-base__container--column-layout": q.value,
-      "b-modal-base__container--animation": V.value
+      "b-modal-base__container--animation": x.value
     }));
     J(
       () => [n.isOpen, f.value],
-      ([a, g], [, G]) => {
+      ([a, g], [, B]) => {
         if (!g)
           return;
-        a ? (N(), I.value.length || I.value.push(E.value)) : !G || d();
+        a ? (N(), I.value.length || I.value.push(E.value)) : !B || d();
       }
     ), J(
       () => n.actions,
       () => {
         var a, g;
-        ((g = (a = n.actions) == null ? void 0 : a[0]) == null ? void 0 : g.state) === "success" && setTimeout(d, i);
+        ((g = (a = n.actions) == null ? void 0 : a[0]) == null ? void 0 : g.state) === "success" && setTimeout(d, l);
       },
       { deep: !0 }
     ), ge(() => {
@@ -386,41 +385,41 @@ const ze = /* @__PURE__ */ ae(Me, [["__scopeId", "data-v-85e34205"]]), Fe = { cl
     }), o({
       internalModalActionClose: m
     }), R(Ae, L);
-    const { activePage: E, isOpen: D, size: x } = fe(n), se = p(Ee.TRANSITION_LEVEL_DEEPER), T = p([]), I = p([]), le = (a) => S("update:active-page", a), ie = (a) => () => {
+    const { activePage: E, isOpen: D, size: Q } = fe(n), se = v(Ee.TRANSITION_LEVEL_DEEPER), T = v([]), I = v([]), ie = (a) => S("update:active-page", a), le = (a) => () => {
       var g;
-      T.value = (g = T.value) == null ? void 0 : g.filter((G) => G !== a);
-    }, de = (a) => (a && T.value.push(a), { unregisterPage: ie(a) }), Q = p(""), V = p(!1);
+      T.value = (g = T.value) == null ? void 0 : g.filter((B) => B !== a);
+    }, de = (a) => (a && T.value.push(a), { unregisterPage: le(a) }), V = v(""), x = v(!1);
     return R(ne, {
       activePage: E,
-      height: Q,
-      isAnimationActive: V,
+      height: V,
+      isAnimationActive: x,
       pageCustomPadding: y,
       showCloseButton: h,
-      size: x
+      size: Q
     }), R(Ie, {
       activePage: E,
       animation: se,
       isOpen: D,
       pages: T,
       previousPages: I,
-      updatePage: le
-    }), R(Pe, de), (a, g) => (b(), pe("div", Fe, [
-      _("dialog", {
+      updatePage: ie
+    }), R(Pe, de), (a, g) => (_(), ve("div", Fe, [
+      b("dialog", {
         id: t(L),
         ref_key: "modal",
         ref: f,
         role: e.modalRole,
         "aria-label": t(Y),
-        style: P({ height: Q.value }),
+        style: P({ height: V.value }),
         class: W(["b-modal-base__container", t(w)]),
         open: e.initiallyOpen,
         onAnimationend: s,
-        onClick: g[0] || (g[0] = (G) => e.isDismissible && k(G)),
-        onKeydown: ve(m, ["esc"])
+        onClick: g[0] || (g[0] = (B) => e.isDismissible && k(B)),
+        onKeydown: pe(m, ["esc"])
       }, [
-        t(D) || e.initiallyOpen ? (b(), O(t(_e), { key: 0 }, {
-          default: l(() => [
-            t(h) ? (b(), O(t(ye), {
+        t(D) || e.initiallyOpen ? (_(), O(t(be), { key: 0 }, {
+          default: i(() => [
+            t(h) ? (_(), O(t(ye), {
               key: 0,
               class: "b-modal-base__close-button",
               variant: "tertiary",
@@ -428,51 +427,51 @@ const ze = /* @__PURE__ */ ae(Me, [["__scopeId", "data-v-85e34205"]]), Fe = { cl
               style: P(t(H)),
               onClick: m
             }, {
-              default: l(() => [
+              default: i(() => [
                 j(t(De), {
-                  "svg-title": t(v)("close")
+                  "svg-title": t(p)("close")
                 }, null, 8, ["svg-title"])
               ]),
               _: 1
             }, 8, ["style"])) : M("", !0),
-            n.activePage ? r(a.$slots, "default", { key: 1 }, void 0, !0) : (b(), O(t(ze), {
+            n.activePage ? r(a.$slots, "default", { key: 1 }, void 0, !0) : (_(), O(t(ze), {
               key: 2,
               "with-column-layout": e.withColumnLayout,
-              size: t(x),
+              size: t(Q),
               "custom-padding": e.customPadding,
               "columns-size": e.columnsSize
             }, ee({ _: 2 }, [
               t(c)("default") ? {
                 name: "default",
-                fn: l(() => [
+                fn: i(() => [
                   r(a.$slots, "default", {}, void 0, !0)
                 ]),
                 key: "0"
               } : void 0,
               t(c)("content-col-1") ? {
                 name: "content-col-1",
-                fn: l(() => [
+                fn: i(() => [
                   r(a.$slots, "content-col-1", {}, void 0, !0)
                 ]),
                 key: "1"
               } : void 0,
               t(c)("content-col-2") ? {
                 name: "content-col-2",
-                fn: l(() => [
+                fn: i(() => [
                   r(a.$slots, "content-col-2", {}, void 0, !0)
                 ]),
                 key: "2"
               } : void 0,
               t(c)("content") ? {
                 name: "content",
-                fn: l(() => [
+                fn: i(() => [
                   r(a.$slots, "content", {}, void 0, !0)
                 ]),
                 key: "3"
               } : void 0,
               t(c)("actions") ? {
                 name: "actions",
-                fn: l(() => [
+                fn: i(() => [
                   r(a.$slots, "actions", {}, void 0, !0)
                 ]),
                 key: "4"
@@ -484,17 +483,16 @@ const ze = /* @__PURE__ */ ae(Me, [["__scopeId", "data-v-85e34205"]]), Fe = { cl
       ], 46, Ue)
     ]));
   }
-});
-const st = /* @__PURE__ */ ae(He, [["__scopeId", "data-v-c4da780c"]]);
+}), st = /* @__PURE__ */ ae(He, [["__scopeId", "data-v-c4da780c"]]);
 export {
   ze as B,
-  Ge as a,
-  Be as b,
+  Be as a,
+  Ge as b,
   z as c,
-  B as d,
+  G as d,
   $ as e,
   Ne as f,
   we as g,
   st as h
 };
-//# sourceMappingURL=base-modal.4102f69d.js.map
+//# sourceMappingURL=base-modal.BgYlnM_Q.js.map