@adyen/bento-vue2 1.86.0 → 1.87.0

package/dist/chunks/modal-fullscreen.6bAjPENL.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"modal-fullscreen.6bAjPENL.js","sources":["../../src/components/modal-fullscreen/components/modal-fullscreen-page.vue","../../src/composables/use-listeners/use-listener.ts","../../src/components/modal-fullscreen/modal-fullscreen.vue"],"sourcesContent":["<template>\n    <dialog-page class=\"b-modal-fullscreen-page\" :page-id=\"pageId\" :previous-page=\"previousPage\" always-show-border>\n        <template #header>\n            <div class=\"b-modal-fullscreen-page__header\">\n                <div class=\"b-modal-fullscreen-page__header-section b-modal-fullscreen-page__header-section--title\">\n                    <bento-typography\n                        v-if=\"title\"\n                        el=\"h2\"\n                        variant=\"title\"\n                        class=\"b-modal-fullscreen-page__title\"\n                        :title=\"title\"\n                        >{{ title }}</bento-typography\n                    >\n                </div>\n                <div\n                    v-if=\"hasSlot('header')\"\n                    class=\"b-modal-fullscreen-page__header-section b-modal-fullscreen-page__header-section--slot\"\n                >\n                    <slot name=\"header\" />\n                </div>\n                <div class=\"b-modal-fullscreen-page__header-section b-modal-fullscreen-page__header-section--actions\">\n                    <bento-typography\n                        v-if=\"contextualLabel\"\n                        class=\"b-modal-fullscreen-page__contextual-label\"\n                        el=\"span\"\n                        :title=\"contextualLabel\"\n                        >{{ contextualLabel }}</bento-typography\n                    >\n                    <bento-button-actions v-if=\"actions\" class=\"b-modal-fullscreen-page__actions\" :actions=\"actions\" />\n                    <div class=\"b-modal-fullscreen-page__separator\"></div>\n                </div>\n            </div>\n        </template>\n        <template #content>\n            <div class=\"b-modal-fullscreen-page__content\">\n                <slot />\n            </div>\n        </template>\n    </dialog-page>\n</template>\n\n<script setup lang=\"ts\">\n    import { onMounted, type PropType, useSlots } from 'vue';\n\n    import { BentoButtonActions, type BentoButtonActionsList } from '@/components/button';\n    import { BentoTypography } from '@/components/typography';\n    import { DialogPage } from '@/internal';\n\n    import { useHasSlot } from '@/composables';\n\n    const props = defineProps({\n        /**\n         * List of actions that will be used to render the buttons.\n         * First element in the list will be rendered as \"primary\".\n         * All elements after the first will be rendered as \"secondary\".\n         *\n         * Each object in the list should have a `title`, an `event` and\n         * (optional) a Vue `icon` from the library `@adyen/ui-assets-icons-16`.\n         *\n         * @see BentoButton for a list of all the other props supported by each button action.\n         */\n        actions: {\n            type: Array as PropType<BentoButtonActionsList>,\n            default: null,\n        },\n\n        /**\n         * Label shown next to the modal actions\n         */\n        contextualLabel: {\n            type: String,\n            default: null,\n        },\n\n        /**\n         * Identifier of the page, used with activePage prop to handle sidepanel navigation\n         */\n        pageId: {\n            type: String,\n            default: undefined,\n        },\n\n        /**\n         * ID of the page for the back button to navigate to. Only use it to overwrite the default back behavior\n         * Used when the back button should not take the user to the natural previous page\n         * Set to `null` to hide back button in the page\n         */\n        previousPage: {\n            type: String,\n            default: undefined,\n        },\n\n        /**\n         * Title of the modal\n         */\n        title: {\n            type: String,\n            default: null,\n        },\n    });\n\n    const slots = useSlots();\n    const hasSlot = useHasSlot(slots);\n\n    onMounted(() => {\n        if (props.actions && props.actions.length > 2) {\n            throw new Error('Not more than 2 action buttons may be provided in Bento Modal Fullscreen');\n        }\n    });\n</script>\n\n<script lang=\"ts\">\n    /**\n     * ModalFullscreenPage is used to render different pages of ModalFullscreen component\n     *\n     * @example\n     * import { BentoModalFullscreen, BentoModalFullscreenPage } from '@adyen/bento-vue2';\n     *\n     * export default {\n     *     components: { BentoModalFullscreen, BentoModalFullscreenPage },\n     *     template: `\n     *          <bento-modal-fullscreen active-page='page1' is-open='true'>\n     *              <bento-modal-fullscreen-page\n     *                  title='Page 1'\n     *                  pageId='page1'\n     *                  contextual-label='Move to next page'\n     *                  :actions=\"[\n     *                      {\n     *                          title: 'Next page',\n     *                          event: () => {\n     *                              activePage.value = 'page2';\n     *                          },\n     *                      }]\">\n     *                  Page 1 info\n     *              </bento-modal-fullscreen-page>\n     *              <bento-modal-fullscreen-page\n     *                  title='Page 2'\n     *                  pageId='page2'\n     *                  :actions=\"[\n     *                      {\n     *                          title: 'Save',\n     *                          event: () => {},\n     *                      }]\">\n     *                  Page 2 info\n     *              </bento-modal-fullscreen-page>\n     *          </bento-modal-fullscreen>\n     *     `\n     * }\n     */\n    export default {};\n</script>\n\n<style lang=\"scss\" scoped src=\"./modal-fullscreen-page.scss\" />\n","import { getCurrentInstance, useListeners as vueUseListeners } from 'vue';\n\n/**\n * A composable that provides access to the Vue2 component's listeners (see Vue3 implementation in packages/vue3/composables).\n * The listeners are kebab-case and the colons are removed (e.g. \"click\", \"update-value\").\n *\n * In environments where the Composition API is not available (e.g. during testing),\n * it falls back to using the component's non-reactive `$listeners` object.\n *\n * @returns The component's listeners.\n */\nexport function useListeners() {\n    // Return nothing so tests don't require a mock of this function\n    if (!window || (!vueUseListeners && !getCurrentInstance)) {\n        return {};\n    }\n\n    if (vueUseListeners) {\n        return vueUseListeners() as any;\n    }\n\n    const instance = getCurrentInstance();\n    return instance?.proxy?.$listeners || {};\n}\n","<template>\n    <dialog\n        :id=\"modalFullscreenId\"\n        ref=\"modal\"\n        class=\"b-modal-fullscreen\"\n        :class=\"conditionalClasses\"\n        data-dialog-element=\"modal-fullscreen\"\n        @animationend=\"closeModalAfterAnimation\"\n        @keydown.esc.prevent=\"closeModal\"\n    >\n        <bento-focus-trap v-if=\"internalIsOpen\" class=\"b-modal-fullscreen__wrapper\">\n            <template v-if=\"props.activePage\">\n                <slot />\n            </template>\n            <bento-modal-fullscreen-page v-else :actions=\"actions\" :contextual-label=\"contextualLabel\" :title=\"title\">\n                <template v-if=\"hasSlot('default')\" #default>\n                    <slot name=\"default\"></slot>\n                </template>\n                <template v-if=\"hasSlot('header')\" #header>\n                    <slot name=\"header\"></slot>\n                </template>\n            </bento-modal-fullscreen-page>\n            <div class=\"b-modal-fullscreen__close-button\">\n                <bento-button variant=\"tertiary\" :aria-label=\"t('close')\" @click=\"closeModal\">\n                    <template #iconLeft><cross-icon :aria-hidden=\"true\" /></template>\n                </bento-button>\n            </div>\n        </bento-focus-trap>\n\n        <!-- Enable the toast inside the fullscreen-modal -->\n        <template v-if=\"isOpen\">\n            <bento-toast />\n        </template>\n    </dialog>\n</template>\n\n<script setup lang=\"ts\">\n    import { computed, onMounted, onUnmounted, type PropType, provide, ref, toRefs, useSlots, watch } from 'vue';\n    import { isVue2 } from 'vue-demi';\n\n    import { BentoToast } from '@/components/toast';\n    import { BentoButton, type BentoButtonActionsList } from '@/components/button';\n    import { BentoFocusTrap } from '@/components/focus-trap';\n    import BentoModalFullscreenPage from './components/modal-fullscreen-page.vue';\n\n    import CrossIcon from '@adyen/ui-assets-icons-16/vue/cross';\n\n    import { useI18n } from '@/utils/ts/i18n';\n    import { generateUid } from '@/core/utils/ts';\n    import { useHasSlot } from '@/composables';\n    import { useListeners } from '@/composables/use-listeners';\n    import { MODAL_FULLSCREEN_DIALOG_ID_INJECTION_KEY } from '@/components/modal-fullscreen/modal-fullscreen.keys';\n\n    import messages from './messages.json';\n    import {\n        BentoDialogPageAnimation,\n        type BentoDialogPageConfigData,\n        type BentoDialogPageRegisterPage,\n        DIALOG_PAGE_CONFIG_INJECTION_KEY,\n        DIALOG_PAGE_REGISTER_PAGE_INJECTION_KEY,\n    } from '@/internal';\n\n    type MessageSchema = (typeof messages)['en-US'];\n\n    const props = defineProps({\n        /**\n         * List of actions that will be used to render the buttons.\n         * First element in the list will be rendered as \"primary\".\n         * All elements after the first will be rendered as \"secondary\".\n         *\n         * Each object in the list should have a `title`, an `event` and\n         * (optional) a Vue `icon` from the library `@adyen/ui-assets-icons-16`.\n         *\n         * @see BentoButton for a list of all the other props supported by each button action.\n         */\n        actions: {\n            type: Array as PropType<BentoButtonActionsList>,\n            default: null,\n        },\n\n        /**\n         * The id of the current active page\n         * Should be the same as the pageId of the BentoModalFullscreenPage to be displayed\n         */\n        activePage: {\n            type: String,\n            default: null,\n        },\n\n        /**\n         * Label shown next to the modal actions\n         */\n        contextualLabel: {\n            type: String,\n            default: null,\n        },\n        /**\n         * Controls the modal's state from the outside. Set it to true to open the modal\n         */\n        isOpen: {\n            type: Boolean,\n            default: null,\n        },\n        /**\n         * Title of the modal\n         */\n        title: {\n            type: String,\n            default: null,\n        },\n    });\n\n    const emit = defineEmits([\"before-close\", \"update:active-page\", \"update:is-open\"]);\n\n    // Refs\n    const { activePage, isOpen } = toRefs(props);\n    const { t } = useI18n<{ message: MessageSchema }>({ messages });\n    const modal = ref(null);\n    const isClosing = ref(false);\n    const modalFullscreenId = generateUid('modal-fullscreen');\n    const internalIsOpen = ref(false);\n    const isMounted = ref(false);\n\n    const listeners = useListeners();\n    const slots = useSlots();\n    const hasSlot = useHasSlot(slots);\n\n    // Animation styling\n    const conditionalClasses = computed(() => ({\n        'b-modal-fullscreen--hide': isClosing.value,\n    }));\n\n    // Handle closing and closing animation for dialog element\n    const closeModalAfterAnimation = () => {\n        if (isClosing.value && modal.value) {\n            modal.value.close();\n            if (previousPages.value[0]) {\n                emit('update:active-page', previousPages.value[0]);\n            }\n            previousPages.value = [];\n            isClosing.value = false;\n            internalIsOpen.value = false;\n            emit('update:is-open', false);\n        }\n    };\n\n    /**\n     * Emits the `beforeClose` event, if it is being listened to,\n     * before closing the modal and omits the closing animation.\n     * The animation will be triggered by the change of the `isOpen` prop instead.\n     *\n     * If no listener for the `before-close`, then the animation will be triggered,\n     * which will close the modal and emit the `update:is-open` event instead, after it was closed.\n     */\n    function closeModal() {\n        /**\n         * Vue3 appends the prefix \"on\" and changes to camelCase\n         */\n        const eventName = isVue2 ? 'before-close' : 'onBeforeClose';\n        if (listeners[eventName]) {\n            emit('before-close');\n            return;\n        }\n        startCloseModalAnimation();\n    }\n\n    const startCloseModalAnimation = () => {\n        if (!modal.value || !modal.value.open) {\n            return;\n        }\n        isClosing.value = true;\n    };\n\n    onMounted(() => {\n        isMounted.value = true;\n    });\n\n    onUnmounted(() => {\n        isMounted.value = false;\n    });\n\n    // Watching isOpen prop to toggle open/close the dialog element\n    watch(\n        [() => isOpen.value, modal],\n        ([newIsOpen, newModalValue]) => {\n            if (!isMounted.value || !newModalValue) {\n                return;\n            }\n\n            if (newIsOpen) {\n                internalIsOpen.value = true;\n                if (!newModalValue.open) {\n                    newModalValue.showModal();\n                }\n                if (!previousPages.value.length) {\n                    previousPages.value.push(activePage.value);\n                }\n            } else if (newModalValue.open) {\n                startCloseModalAnimation();\n            }\n        },\n        { immediate: true, flush: 'post' }\n    );\n\n    // lets children components know they are inside a Modal (dialog element)\n    provide(MODAL_FULLSCREEN_DIALOG_ID_INJECTION_KEY, modalFullscreenId);\n\n    // Pages\n    const animation = ref(BentoDialogPageAnimation.TRANSITION_LEVEL_DEEPER);\n    const pages = ref<Array<string>>([]);\n    const previousPages = ref([]);\n    const updatePage = page => emit('update:active-page', page);\n\n    provide<BentoDialogPageConfigData>(DIALOG_PAGE_CONFIG_INJECTION_KEY, {\n        activePage,\n        animation,\n        isOpen: internalIsOpen,\n        pages,\n        previousPages,\n        updatePage,\n    });\n\n    // unregister page if removed / destroyed\n    const unregisterPage = (pageIdToRemove: string) => () => {\n        pages.value = pages.value?.filter(pageId => pageId !== pageIdToRemove);\n    };\n\n    // Provide data and function to register page to subcomponent\n    const registerPage: BentoDialogPageRegisterPage = pageId => {\n        if (pageId) {\n            pages.value.push(pageId);\n        }\n\n        return { unregisterPage: unregisterPage(pageId) };\n    };\n\n    provide(DIALOG_PAGE_REGISTER_PAGE_INJECTION_KEY, registerPage);\n</script>\n\n<script lang=\"ts\">\n    /**\n     * Fullscreen modal takes full available space (no content underneath is visible) and focuses the user's attention exclusively on one complex task or piece of complex information.\n     *\n     * @example\n     * import { BentoModalFullscreen } from '@adyen/bento-vue2';\n     *\n     * export default {\n     *     components: { BentoModalFullscreen },\n     *     template: `\n     *          <bento-modal-fullscreen\n     *              :is-open=\"isOpen\"\n     *              @update:is-open=\"isOpen = $event\"\n     *              title='Fullscreen modal title'\n     *              contextual-label='Contextual label'\n     *              :actions=\"[{ title: 'Action', event: () => {}]\"\n     *          >\n     *              <template #header>{{ header slot }}</template>\n     *              {{ content }}\n     *          </bento-modal-fullscreen>\n     *     `\n     * }\n     */\n    export default {\n        i18n: { messages },\n    };\n</script>\n\n<style lang=\"scss\" scoped src=\"./modal-fullscreen.scss\" />\n"],"names":["__default__$1","slots","useSlots","hasSlot","useHasSlot","onMounted","props","useListeners","useListeners$1","getCurrentInstance","instance","_a","__default__","messages","activePage","isOpen","toRefs","t","useI18n","modal","ref","isClosing","modalFullscreenId","generateUid","internalIsOpen","isMounted","listeners","conditionalClasses","computed","closeModalAfterAnimation","previousPages","emit","closeModal","startCloseModalAnimation","onUnmounted","watch","newIsOpen","newModalValue","provide","MODAL_FULLSCREEN_DIALOG_ID_INJECTION_KEY","animation","BentoDialogPageAnimation","pages","updatePage","page","DIALOG_PAGE_CONFIG_INJECTION_KEY","unregisterPage","pageIdToRemove","pageId","registerPage","DIALOG_PAGE_REGISTER_PAGE_INJECTION_KEY"],"mappings":"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"}

package/dist/chunks/nl.B6vCf2B9.js

@@ -1,327 +0,0 @@
-import { b as d, c as n, d as r, e as s } from "./en-US.BZii9jNW.js";
-const m = {
-  lessThanXSeconds: {
-    one: "minder dan een seconde",
-    other: "minder dan {{count}} seconden"
-  },
-  xSeconds: {
-    one: "1 seconde",
-    other: "{{count}} seconden"
-  },
-  halfAMinute: "een halve minuut",
-  lessThanXMinutes: {
-    one: "minder dan een minuut",
-    other: "minder dan {{count}} minuten"
-  },
-  xMinutes: {
-    one: "een minuut",
-    other: "{{count}} minuten"
-  },
-  aboutXHours: {
-    one: "ongeveer 1 uur",
-    other: "ongeveer {{count}} uur"
-  },
-  xHours: {
-    one: "1 uur",
-    other: "{{count}} uur"
-  },
-  xDays: {
-    one: "1 dag",
-    other: "{{count}} dagen"
-  },
-  aboutXWeeks: {
-    one: "ongeveer 1 week",
-    other: "ongeveer {{count}} weken"
-  },
-  xWeeks: {
-    one: "1 week",
-    other: "{{count}} weken"
-  },
-  aboutXMonths: {
-    one: "ongeveer 1 maand",
-    other: "ongeveer {{count}} maanden"
-  },
-  xMonths: {
-    one: "1 maand",
-    other: "{{count}} maanden"
-  },
-  aboutXYears: {
-    one: "ongeveer 1 jaar",
-    other: "ongeveer {{count}} jaar"
-  },
-  xYears: {
-    one: "1 jaar",
-    other: "{{count}} jaar"
-  },
-  overXYears: {
-    one: "meer dan 1 jaar",
-    other: "meer dan {{count}} jaar"
-  },
-  almostXYears: {
-    one: "bijna 1 jaar",
-    other: "bijna {{count}} jaar"
-  }
-}, u = (e, o, a) => {
-  let t;
-  const i = m[e];
-  return typeof i == "string" ? t = i : o === 1 ? t = i.one : t = i.other.replace("{{count}}", String(o)), a != null && a.addSuffix ? a.comparison && a.comparison > 0 ? "over " + t : t + " geleden" : t;
-}, c = {
-  full: "EEEE d MMMM y",
-  long: "d MMMM y",
-  medium: "d MMM y",
-  short: "dd-MM-y"
-}, h = {
-  full: "HH:mm:ss zzzz",
-  long: "HH:mm:ss z",
-  medium: "HH:mm:ss",
-  short: "HH:mm"
-}, l = {
-  full: "{{date}} 'om' {{time}}",
-  long: "{{date}} 'om' {{time}}",
-  medium: "{{date}}, {{time}}",
-  short: "{{date}}, {{time}}"
-}, g = {
-  date: d({
-    formats: c,
-    defaultWidth: "full"
-  }),
-  time: d({
-    formats: h,
-    defaultWidth: "full"
-  }),
-  dateTime: d({
-    formats: l,
-    defaultWidth: "full"
-  })
-}, v = {
-  lastWeek: "'afgelopen' eeee 'om' p",
-  yesterday: "'gisteren om' p",
-  today: "'vandaag om' p",
-  tomorrow: "'morgen om' p",
-  nextWeek: "eeee 'om' p",
-  other: "P"
-}, f = (e, o, a, t) => v[e], b = {
-  narrow: ["v.C.", "n.C."],
-  abbreviated: ["v.Chr.", "n.Chr."],
-  wide: ["voor Christus", "na Christus"]
-}, w = {
-  narrow: ["1", "2", "3", "4"],
-  abbreviated: ["K1", "K2", "K3", "K4"],
-  wide: ["1e kwartaal", "2e kwartaal", "3e kwartaal", "4e kwartaal"]
-}, P = {
-  narrow: ["J", "F", "M", "A", "M", "J", "J", "A", "S", "O", "N", "D"],
-  abbreviated: [
-    "jan.",
-    "feb.",
-    "mrt.",
-    "apr.",
-    "mei",
-    "jun.",
-    "jul.",
-    "aug.",
-    "sep.",
-    "okt.",
-    "nov.",
-    "dec."
-  ],
-  wide: [
-    "januari",
-    "februari",
-    "maart",
-    "april",
-    "mei",
-    "juni",
-    "juli",
-    "augustus",
-    "september",
-    "oktober",
-    "november",
-    "december"
-  ]
-}, p = {
-  narrow: ["Z", "M", "D", "W", "D", "V", "Z"],
-  short: ["zo", "ma", "di", "wo", "do", "vr", "za"],
-  abbreviated: ["zon", "maa", "din", "woe", "don", "vri", "zat"],
-  wide: [
-    "zondag",
-    "maandag",
-    "dinsdag",
-    "woensdag",
-    "donderdag",
-    "vrijdag",
-    "zaterdag"
-  ]
-}, M = {
-  narrow: {
-    am: "AM",
-    pm: "PM",
-    midnight: "middernacht",
-    noon: "het middaguur",
-    morning: "'s ochtends",
-    afternoon: "'s middags",
-    evening: "'s avonds",
-    night: "'s nachts"
-  },
-  abbreviated: {
-    am: "AM",
-    pm: "PM",
-    midnight: "middernacht",
-    noon: "het middaguur",
-    morning: "'s ochtends",
-    afternoon: "'s middags",
-    evening: "'s avonds",
-    night: "'s nachts"
-  },
-  wide: {
-    am: "AM",
-    pm: "PM",
-    midnight: "middernacht",
-    noon: "het middaguur",
-    morning: "'s ochtends",
-    afternoon: "'s middags",
-    evening: "'s avonds",
-    night: "'s nachts"
-  }
-}, j = (e, o) => Number(e) + "e", y = {
-  ordinalNumber: j,
-  era: n({
-    values: b,
-    defaultWidth: "wide"
-  }),
-  quarter: n({
-    values: w,
-    defaultWidth: "wide",
-    argumentCallback: (e) => e - 1
-  }),
-  month: n({
-    values: P,
-    defaultWidth: "wide"
-  }),
-  day: n({
-    values: p,
-    defaultWidth: "wide"
-  }),
-  dayPeriod: n({
-    values: M,
-    defaultWidth: "wide"
-  })
-}, z = /^(\d+)e?/i, k = /\d+/i, W = {
-  narrow: /^([vn]\.? ?C\.?)/,
-  abbreviated: /^([vn]\. ?Chr\.?)/,
-  wide: /^((voor|na) Christus)/
-}, C = {
-  any: [/^v/, /^n/]
-}, D = {
-  narrow: /^[1234]/i,
-  abbreviated: /^K[1234]/i,
-  wide: /^[1234]e kwartaal/i
-}, x = {
-  any: [/1/i, /2/i, /3/i, /4/i]
-}, H = {
-  narrow: /^[jfmasond]/i,
-  abbreviated: /^(jan.|feb.|mrt.|apr.|mei|jun.|jul.|aug.|sep.|okt.|nov.|dec.)/i,
-  wide: /^(januari|februari|maart|april|mei|juni|juli|augustus|september|oktober|november|december)/i
-}, F = {
-  narrow: [
-    /^j/i,
-    /^f/i,
-    /^m/i,
-    /^a/i,
-    /^m/i,
-    /^j/i,
-    /^j/i,
-    /^a/i,
-    /^s/i,
-    /^o/i,
-    /^n/i,
-    /^d/i
-  ],
-  any: [
-    /^jan/i,
-    /^feb/i,
-    /^m(r|a)/i,
-    /^apr/i,
-    /^mei/i,
-    /^jun/i,
-    /^jul/i,
-    /^aug/i,
-    /^sep/i,
-    /^okt/i,
-    /^nov/i,
-    /^dec/i
-  ]
-}, X = {
-  narrow: /^[zmdwv]/i,
-  short: /^(zo|ma|di|wo|do|vr|za)/i,
-  abbreviated: /^(zon|maa|din|woe|don|vri|zat)/i,
-  wide: /^(zondag|maandag|dinsdag|woensdag|donderdag|vrijdag|zaterdag)/i
-}, V = {
-  narrow: [/^z/i, /^m/i, /^d/i, /^w/i, /^d/i, /^v/i, /^z/i],
-  any: [/^zo/i, /^ma/i, /^di/i, /^wo/i, /^do/i, /^vr/i, /^za/i]
-}, A = {
-  any: /^(am|pm|middernacht|het middaguur|'s (ochtends|middags|avonds|nachts))/i
-}, E = {
-  any: {
-    am: /^am/i,
-    pm: /^pm/i,
-    midnight: /^middernacht/i,
-    noon: /^het middaguur/i,
-    morning: /ochtend/i,
-    afternoon: /middag/i,
-    evening: /avond/i,
-    night: /nacht/i
-  }
-}, L = {
-  ordinalNumber: s({
-    matchPattern: z,
-    parsePattern: k,
-    valueCallback: (e) => parseInt(e, 10)
-  }),
-  era: r({
-    matchPatterns: W,
-    defaultMatchWidth: "wide",
-    parsePatterns: C,
-    defaultParseWidth: "any"
-  }),
-  quarter: r({
-    matchPatterns: D,
-    defaultMatchWidth: "wide",
-    parsePatterns: x,
-    defaultParseWidth: "any",
-    valueCallback: (e) => e + 1
-  }),
-  month: r({
-    matchPatterns: H,
-    defaultMatchWidth: "wide",
-    parsePatterns: F,
-    defaultParseWidth: "any"
-  }),
-  day: r({
-    matchPatterns: X,
-    defaultMatchWidth: "wide",
-    parsePatterns: V,
-    defaultParseWidth: "any"
-  }),
-  dayPeriod: r({
-    matchPatterns: A,
-    defaultMatchWidth: "any",
-    parsePatterns: E,
-    defaultParseWidth: "any"
-  })
-}, S = {
-  code: "nl",
-  formatDistance: u,
-  formatLong: g,
-  formatRelative: f,
-  localize: y,
-  match: L,
-  options: {
-    weekStartsOn: 1,
-    firstWeekContainsDate: 4
-  }
-};
-export {
-  S as default,
-  S as nl
-};
-//# sourceMappingURL=nl.B6vCf2B9.js.map

package/dist/chunks/nl.B6vCf2B9.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"nl.B6vCf2B9.js","sources":["../../../../node_modules/.pnpm/date-fns@4.1.0/node_modules/date-fns/locale/nl/_lib/formatDistance.js","../../../../node_modules/.pnpm/date-fns@4.1.0/node_modules/date-fns/locale/nl/_lib/formatLong.js","../../../../node_modules/.pnpm/date-fns@4.1.0/node_modules/date-fns/locale/nl/_lib/formatRelative.js","../../../../node_modules/.pnpm/date-fns@4.1.0/node_modules/date-fns/locale/nl/_lib/localize.js","../../../../node_modules/.pnpm/date-fns@4.1.0/node_modules/date-fns/locale/nl/_lib/match.js","../../../../node_modules/.pnpm/date-fns@4.1.0/node_modules/date-fns/locale/nl.js"],"sourcesContent":["const formatDistanceLocale = {\n  lessThanXSeconds: {\n    one: \"minder dan een seconde\",\n    other: \"minder dan {{count}} seconden\",\n  },\n\n  xSeconds: {\n    one: \"1 seconde\",\n    other: \"{{count}} seconden\",\n  },\n\n  halfAMinute: \"een halve minuut\",\n\n  lessThanXMinutes: {\n    one: \"minder dan een minuut\",\n    other: \"minder dan {{count}} minuten\",\n  },\n\n  xMinutes: {\n    one: \"een minuut\",\n    other: \"{{count}} minuten\",\n  },\n\n  aboutXHours: {\n    one: \"ongeveer 1 uur\",\n    other: \"ongeveer {{count}} uur\",\n  },\n\n  xHours: {\n    one: \"1 uur\",\n    other: \"{{count}} uur\",\n  },\n\n  xDays: {\n    one: \"1 dag\",\n    other: \"{{count}} dagen\",\n  },\n\n  aboutXWeeks: {\n    one: \"ongeveer 1 week\",\n    other: \"ongeveer {{count}} weken\",\n  },\n\n  xWeeks: {\n    one: \"1 week\",\n    other: \"{{count}} weken\",\n  },\n\n  aboutXMonths: {\n    one: \"ongeveer 1 maand\",\n    other: \"ongeveer {{count}} maanden\",\n  },\n\n  xMonths: {\n    one: \"1 maand\",\n    other: \"{{count}} maanden\",\n  },\n\n  aboutXYears: {\n    one: \"ongeveer 1 jaar\",\n    other: \"ongeveer {{count}} jaar\",\n  },\n\n  xYears: {\n    one: \"1 jaar\",\n    other: \"{{count}} jaar\",\n  },\n\n  overXYears: {\n    one: \"meer dan 1 jaar\",\n    other: \"meer dan {{count}} jaar\",\n  },\n\n  almostXYears: {\n    one: \"bijna 1 jaar\",\n    other: \"bijna {{count}} jaar\",\n  },\n};\n\nexport const formatDistance = (token, count, options) => {\n  let result;\n\n  const tokenValue = formatDistanceLocale[token];\n  if (typeof tokenValue === \"string\") {\n    result = tokenValue;\n  } else if (count === 1) {\n    result = tokenValue.one;\n  } else {\n    result = tokenValue.other.replace(\"{{count}}\", String(count));\n  }\n\n  if (options?.addSuffix) {\n    if (options.comparison && options.comparison > 0) {\n      return \"over \" + result;\n    } else {\n      return result + \" geleden\";\n    }\n  }\n\n  return result;\n};\n","import { buildFormatLongFn } from \"../../_lib/buildFormatLongFn.js\";\n\nconst dateFormats = {\n  full: \"EEEE d MMMM y\",\n  long: \"d MMMM y\",\n  medium: \"d MMM y\",\n  short: \"dd-MM-y\",\n};\n\nconst timeFormats = {\n  full: \"HH:mm:ss zzzz\",\n  long: \"HH:mm:ss z\",\n  medium: \"HH:mm:ss\",\n  short: \"HH:mm\",\n};\n\nconst dateTimeFormats = {\n  full: \"{{date}} 'om' {{time}}\",\n  long: \"{{date}} 'om' {{time}}\",\n  medium: \"{{date}}, {{time}}\",\n  short: \"{{date}}, {{time}}\",\n};\n\nexport const formatLong = {\n  date: buildFormatLongFn({\n    formats: dateFormats,\n    defaultWidth: \"full\",\n  }),\n\n  time: buildFormatLongFn({\n    formats: timeFormats,\n    defaultWidth: \"full\",\n  }),\n\n  dateTime: buildFormatLongFn({\n    formats: dateTimeFormats,\n    defaultWidth: \"full\",\n  }),\n};\n","const formatRelativeLocale = {\n  lastWeek: \"'afgelopen' eeee 'om' p\",\n  yesterday: \"'gisteren om' p\",\n  today: \"'vandaag om' p\",\n  tomorrow: \"'morgen om' p\",\n  nextWeek: \"eeee 'om' p\",\n  other: \"P\",\n};\n\nexport const formatRelative = (token, _date, _baseDate, _options) =>\n  formatRelativeLocale[token];\n","import { buildLocalizeFn } from \"../../_lib/buildLocalizeFn.js\";\n\nconst eraValues = {\n  narrow: [\"v.C.\", \"n.C.\"],\n  abbreviated: [\"v.Chr.\", \"n.Chr.\"],\n  wide: [\"voor Christus\", \"na Christus\"],\n};\n\nconst quarterValues = {\n  narrow: [\"1\", \"2\", \"3\", \"4\"],\n  abbreviated: [\"K1\", \"K2\", \"K3\", \"K4\"],\n  wide: [\"1e kwartaal\", \"2e kwartaal\", \"3e kwartaal\", \"4e kwartaal\"],\n};\n\nconst monthValues = {\n  narrow: [\"J\", \"F\", \"M\", \"A\", \"M\", \"J\", \"J\", \"A\", \"S\", \"O\", \"N\", \"D\"],\n  abbreviated: [\n    \"jan.\",\n    \"feb.\",\n    \"mrt.\",\n    \"apr.\",\n    \"mei\",\n    \"jun.\",\n    \"jul.\",\n    \"aug.\",\n    \"sep.\",\n    \"okt.\",\n    \"nov.\",\n    \"dec.\",\n  ],\n\n  wide: [\n    \"januari\",\n    \"februari\",\n    \"maart\",\n    \"april\",\n    \"mei\",\n    \"juni\",\n    \"juli\",\n    \"augustus\",\n    \"september\",\n    \"oktober\",\n    \"november\",\n    \"december\",\n  ],\n};\n\nconst dayValues = {\n  narrow: [\"Z\", \"M\", \"D\", \"W\", \"D\", \"V\", \"Z\"],\n  short: [\"zo\", \"ma\", \"di\", \"wo\", \"do\", \"vr\", \"za\"],\n  abbreviated: [\"zon\", \"maa\", \"din\", \"woe\", \"don\", \"vri\", \"zat\"],\n  wide: [\n    \"zondag\",\n    \"maandag\",\n    \"dinsdag\",\n    \"woensdag\",\n    \"donderdag\",\n    \"vrijdag\",\n    \"zaterdag\",\n  ],\n};\n\nconst dayPeriodValues = {\n  narrow: {\n    am: \"AM\",\n    pm: \"PM\",\n    midnight: \"middernacht\",\n    noon: \"het middaguur\",\n    morning: \"'s ochtends\",\n    afternoon: \"'s middags\",\n    evening: \"'s avonds\",\n    night: \"'s nachts\",\n  },\n  abbreviated: {\n    am: \"AM\",\n    pm: \"PM\",\n    midnight: \"middernacht\",\n    noon: \"het middaguur\",\n    morning: \"'s ochtends\",\n    afternoon: \"'s middags\",\n    evening: \"'s avonds\",\n    night: \"'s nachts\",\n  },\n  wide: {\n    am: \"AM\",\n    pm: \"PM\",\n    midnight: \"middernacht\",\n    noon: \"het middaguur\",\n    morning: \"'s ochtends\",\n    afternoon: \"'s middags\",\n    evening: \"'s avonds\",\n    night: \"'s nachts\",\n  },\n};\n\nconst ordinalNumber = (dirtyNumber, _options) => {\n  const number = Number(dirtyNumber);\n  return number + \"e\";\n};\n\nexport const localize = {\n  ordinalNumber,\n\n  era: buildLocalizeFn({\n    values: eraValues,\n    defaultWidth: \"wide\",\n  }),\n\n  quarter: buildLocalizeFn({\n    values: quarterValues,\n    defaultWidth: \"wide\",\n    argumentCallback: (quarter) => quarter - 1,\n  }),\n\n  month: buildLocalizeFn({\n    values: monthValues,\n    defaultWidth: \"wide\",\n  }),\n\n  day: buildLocalizeFn({\n    values: dayValues,\n    defaultWidth: \"wide\",\n  }),\n\n  dayPeriod: buildLocalizeFn({\n    values: dayPeriodValues,\n    defaultWidth: \"wide\",\n  }),\n};\n","import { buildMatchFn } from \"../../_lib/buildMatchFn.js\";\nimport { buildMatchPatternFn } from \"../../_lib/buildMatchPatternFn.js\";\n\nconst matchOrdinalNumberPattern = /^(\\d+)e?/i;\nconst parseOrdinalNumberPattern = /\\d+/i;\n\nconst matchEraPatterns = {\n  narrow: /^([vn]\\.? ?C\\.?)/,\n  abbreviated: /^([vn]\\. ?Chr\\.?)/,\n  wide: /^((voor|na) Christus)/,\n};\nconst parseEraPatterns = {\n  any: [/^v/, /^n/],\n};\n\nconst matchQuarterPatterns = {\n  narrow: /^[1234]/i,\n  abbreviated: /^K[1234]/i,\n  wide: /^[1234]e kwartaal/i,\n};\nconst parseQuarterPatterns = {\n  any: [/1/i, /2/i, /3/i, /4/i],\n};\n\nconst matchMonthPatterns = {\n  narrow: /^[jfmasond]/i,\n  abbreviated: /^(jan.|feb.|mrt.|apr.|mei|jun.|jul.|aug.|sep.|okt.|nov.|dec.)/i,\n  wide: /^(januari|februari|maart|april|mei|juni|juli|augustus|september|oktober|november|december)/i,\n};\nconst parseMonthPatterns = {\n  narrow: [\n    /^j/i,\n    /^f/i,\n    /^m/i,\n    /^a/i,\n    /^m/i,\n    /^j/i,\n    /^j/i,\n    /^a/i,\n    /^s/i,\n    /^o/i,\n    /^n/i,\n    /^d/i,\n  ],\n\n  any: [\n    /^jan/i,\n    /^feb/i,\n    /^m(r|a)/i,\n    /^apr/i,\n    /^mei/i,\n    /^jun/i,\n    /^jul/i,\n    /^aug/i,\n    /^sep/i,\n    /^okt/i,\n    /^nov/i,\n    /^dec/i,\n  ],\n};\n\nconst matchDayPatterns = {\n  narrow: /^[zmdwv]/i,\n  short: /^(zo|ma|di|wo|do|vr|za)/i,\n  abbreviated: /^(zon|maa|din|woe|don|vri|zat)/i,\n  wide: /^(zondag|maandag|dinsdag|woensdag|donderdag|vrijdag|zaterdag)/i,\n};\nconst parseDayPatterns = {\n  narrow: [/^z/i, /^m/i, /^d/i, /^w/i, /^d/i, /^v/i, /^z/i],\n  any: [/^zo/i, /^ma/i, /^di/i, /^wo/i, /^do/i, /^vr/i, /^za/i],\n};\n\nconst matchDayPeriodPatterns = {\n  any: /^(am|pm|middernacht|het middaguur|'s (ochtends|middags|avonds|nachts))/i,\n};\nconst parseDayPeriodPatterns = {\n  any: {\n    am: /^am/i,\n    pm: /^pm/i,\n    midnight: /^middernacht/i,\n    noon: /^het middaguur/i,\n    morning: /ochtend/i,\n    afternoon: /middag/i,\n    evening: /avond/i,\n    night: /nacht/i,\n  },\n};\n\nexport const match = {\n  ordinalNumber: buildMatchPatternFn({\n    matchPattern: matchOrdinalNumberPattern,\n    parsePattern: parseOrdinalNumberPattern,\n    valueCallback: (value) => parseInt(value, 10),\n  }),\n\n  era: buildMatchFn({\n    matchPatterns: matchEraPatterns,\n    defaultMatchWidth: \"wide\",\n    parsePatterns: parseEraPatterns,\n    defaultParseWidth: \"any\",\n  }),\n\n  quarter: buildMatchFn({\n    matchPatterns: matchQuarterPatterns,\n    defaultMatchWidth: \"wide\",\n    parsePatterns: parseQuarterPatterns,\n    defaultParseWidth: \"any\",\n    valueCallback: (index) => index + 1,\n  }),\n\n  month: buildMatchFn({\n    matchPatterns: matchMonthPatterns,\n    defaultMatchWidth: \"wide\",\n    parsePatterns: parseMonthPatterns,\n    defaultParseWidth: \"any\",\n  }),\n\n  day: buildMatchFn({\n    matchPatterns: matchDayPatterns,\n    defaultMatchWidth: \"wide\",\n    parsePatterns: parseDayPatterns,\n    defaultParseWidth: \"any\",\n  }),\n\n  dayPeriod: buildMatchFn({\n    matchPatterns: matchDayPeriodPatterns,\n    defaultMatchWidth: \"any\",\n    parsePatterns: parseDayPeriodPatterns,\n    defaultParseWidth: \"any\",\n  }),\n};\n","import { formatDistance } from \"./nl/_lib/formatDistance.js\";\nimport { formatLong } from \"./nl/_lib/formatLong.js\";\nimport { formatRelative } from \"./nl/_lib/formatRelative.js\";\nimport { localize } from \"./nl/_lib/localize.js\";\nimport { match } from \"./nl/_lib/match.js\";\n\n/**\n * @category Locales\n * @summary Dutch locale.\n * @language Dutch\n * @iso-639-2 nld\n * @author Jorik Tangelder [@jtangelder](https://github.com/jtangelder)\n * @author Ruben Stolk [@rubenstolk](https://github.com/rubenstolk)\n * @author Lode Vanhove [@bitcrumb](https://github.com/bitcrumb)\n * @author Edo Rivai [@edorivai](https://github.com/edorivai)\n * @author Niels Keurentjes [@curry684](https://github.com/curry684)\n * @author Stefan Vermaas [@stefanvermaas](https://github.com/stefanvermaas)\n */\nexport const nl = {\n  code: \"nl\",\n  formatDistance: formatDistance,\n  formatLong: formatLong,\n  formatRelative: formatRelative,\n  localize: localize,\n  match: match,\n  options: {\n    weekStartsOn: 1 /* Monday */,\n    firstWeekContainsDate: 4,\n  },\n};\n\n// Fallback for modularized imports:\nexport default nl;\n"],"names":["formatDistanceLocale","formatDistance","token","count","options","result","tokenValue","dateFormats","timeFormats","dateTimeFormats","formatLong","buildFormatLongFn","formatRelativeLocale","formatRelative","_date","_baseDate","_options","eraValues","quarterValues","monthValues","dayValues","dayPeriodValues","ordinalNumber","dirtyNumber","localize","buildLocalizeFn","quarter","matchOrdinalNumberPattern","parseOrdinalNumberPattern","matchEraPatterns","parseEraPatterns","matchQuarterPatterns","parseQuarterPatterns","matchMonthPatterns","parseMonthPatterns","matchDayPatterns","parseDayPatterns","matchDayPeriodPatterns","parseDayPeriodPatterns","match","buildMatchPatternFn","value","buildMatchFn","index","nl"],"mappings":"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","x_google_ignoreList":[0,1,2,3,4,5]}

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

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

package/dist/chunks/popover.types.DkiRUQ4Z.js

@@ -1,6 +0,0 @@
-import { b as o } from "./popper-container.D4dworD4.js";
-const i = { ...o };
-export {
-  i as B
-};
-//# sourceMappingURL=popover.types.DkiRUQ4Z.js.map

package/dist/chunks/radio-group.DKRxfGtE.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"radio-group.DKRxfGtE.js","sources":["../../src/components/radio-group/components/radio-button/radio-button.vue","../../src/components/radio-group/radio-group.types.ts","../../src/components/radio-group/radio-group.vue"],"sourcesContent":["<template>\n    <div class=\"b-radio-button\" data-testid=\"radio-button-container\" :class=\"conditionalClassContainer\">\n        <radio-input\n            :id=\"radioButtonId\"\n            ref=\"radioInputRef\"\n            :aria-label=\"ariaLabel\"\n            :aria-describedby=\"hasSlot('description') ? descriptionId : ''\"\n            :checked=\"isChecked\"\n            :disabled=\"disabled\"\n            :readonly=\"readonly\"\n            :has-error=\"hasError\"\n            :value=\"value\"\n            :model-value=\"modelValue\"\n            :name=\"name\"\n            @update:model-value=\"onChange\"\n        />\n        <div>\n            <label v-if=\"hasSlot('default')\" :for=\"radioButtonId\" class=\"b-radio-button__label-container\">\n                <span v-if=\"hasSlot('default')\" class=\"b-radio-button__primary-label\">\n                    <bento-typography class=\"b-radio-button__label\" el=\"span\" variant=\"body\"><slot /></bento-typography>\n                    <bento-tag v-if=\"tag\" class=\"b-radio-button__label-tag\" v-bind=\"tag\" />\n                </span>\n                <bento-typography\n                    v-if=\"hasSlot('default') && hasSlot('description')\"\n                    :id=\"descriptionId\"\n                    class=\"b-radio-button__description\"\n                    el=\"span\"\n                    variant=\"body\"\n                >\n                    <slot name=\"description\"></slot>\n                </bento-typography>\n            </label>\n            <bento-typography v-if=\"hasSlot('content') && isChecked\" class=\"b-radio-button__content\" el=\"div\">\n                <slot name=\"content\"></slot>\n            </bento-typography>\n        </div>\n    </div>\n</template>\n\n<script setup lang=\"ts\">\n    import { BentoTag } from '@/components/tag';\n    import { BentoTypography } from '@/components/typography';\n    import { RadioInput } from '../../../internal/radio-input';\n    import { useAriaLabel } from '@/utils/ts/aria-label';\n    import { generateUid } from '@/core/utils/ts';\n    import { computed, type ComputedRef, type PropType, ref, toRefs, useSlots } from 'vue';\n    import { useDefaultSlotValidator, useHasSlot } from '@/composables';\n    import { BentoRadioButtonStateClass, type BentoRadioButtonTag, type BentoRadioButtonValue } from './radio-button.types';\n    import { getSlotText } from '@/utils/ts/get-slot-text';\n\n    const slots = useSlots();\n    const hasSlot = useHasSlot(slots);\n    const props = defineProps({\n        /**\n         * Disable the radio button (optional)\n         */\n        disabled: { type: Boolean, default: false },\n\n        /**\n         * Shows bento-radio-button in error state (optional)\n         */\n        hasError: { type: Boolean, default: false },\n\n        /**\n         * This property should not be used directly.\n         * It will be used by v-model directive on radio component.\n         */\n        modelValue: {\n            type: [String, Number] as PropType<BentoRadioButtonValue>,\n            default: null,\n        },\n\n        /**\n         * Sets the radio button to readonly (optional)\n         */\n        readonly: { type: Boolean, default: false },\n\n        /**\n         * Sets the properties of the BentoTag component that is placed next to the label.\n         * {@see BentoTag}\n         */\n        tag: { type: Object as PropType<BentoRadioButtonTag>, default: undefined },\n\n        /**\n         * Indicates the value of the input that will be returned when it's checked\n         */\n        value: {\n            type: [String, Number] as PropType<BentoRadioButtonValue>,\n            required: true,\n        },\n\n        /**\n         * Sets the name of the radio input.\n         * Used for differentiating radio groups or accessing input via form submission.\n         */\n        name: {\n            type: String,\n            default: null,\n        },\n    });\n\n    const emit = defineEmits([\"input\", \"update:model-value\"]);\n\n    const { value } = toRefs(props);\n    const radioButtonId = generateUid('bento-radio-button');\n    const descriptionId = generateUid('description');\n    const radioInputRef = ref(null);\n\n    useDefaultSlotValidator('bento-radio-button', slots.default, slots.description);\n\n    const conditionalClassContainer = computed(() => ({\n        [`b-radio-button--${BentoRadioButtonStateClass.DISABLED}`]: props.disabled,\n        [`b-radio-button--${BentoRadioButtonStateClass.READONLY}`]: props.readonly,\n    }));\n\n    const ariaLabel = useAriaLabel({\n        ariaLabel: getSlotText(slots)('default'),\n        label: value.value as string,\n    });\n\n    const isChecked: ComputedRef<boolean> = computed(() => props.value === props.modelValue);\n\n    const onChange = () => {\n        if (!props.disabled && !props.readonly) {\n            emit('update:model-value', props.value);\n            emit('input', props.value);\n        }\n    };\n\n    const focus = () => {\n        radioInputRef.value.focus();\n    };\n\n    defineExpose({\n        focus,\n    });\n</script>\n\n<script lang=\"ts\">\n    /**\n     * Radio buttons are used when two or more options are mutually exclusive,\n     * the user can only select a single option from a list of pre-defined options.\n     * The label tag area is also clickable.\n     * Only to be used internally.\n     *\n     * @example\n     * import { BentoRadioButton } from '@adyen/bento-vue2';\n     *\n     * export default {\n     *     components: { BentoRadioButton },\n     *     template: `\n     *         <bento-radio-button\n     *             disabled\n     *             value=\"inputRadio\"\n     *             model-value.sync=\"modelValue\"\n     *         >\n     *             Label text\n     *             <template #description>Description text below label</template>\n     *             <template #content>Content shown when checked</template>\n     *         </bento-radio-button>\n     *     `,\n     *     setup() {\n     *         const modelValue = ref('anyValue')\n     *         const value = 'option-value'\n     *\n     *         return {\n     *             modelValue,\n     *             value,\n     *         }\n     *     }\n     * }\n     */\n    export default {\n        name: 'bento-radio-button',\n        model: { prop: 'modelValue' },\n    };\n</script>\n\n<style lang=\"scss\" scoped src=\"./radio-button.scss\" />\n","import type { FormField, FormFieldEmits } from '../../types/form-field';\nimport type { BentoRadioButtonTag, BentoRadioButtonValue } from './components/radio-button';\n\n/**\n * @deprecated for usage with properties since version 2.0. Use the string literal instead.\n */\nexport enum BentoRadioGroupVariant {\n    HORIZONTAL = 'horizontal',\n    VERTICAL = 'vertical',\n}\n\nexport type BentoRadioGroupValue = BentoRadioButtonValue;\n\nexport interface BentoRadioGroupItem {\n    value: BentoRadioGroupValue;\n    label: string;\n    description?: string;\n    disabled?: boolean;\n    readonly?: boolean;\n    hasError?: boolean;\n    tag?: BentoRadioButtonTag;\n}\n\nexport type BentoRadioGroupItems = Array<BentoRadioGroupItem>;\n\nexport type BentoRadioGroupEmits = FormFieldEmits<BentoRadioGroupValue>;\n\nexport interface BentoRadioGroupProps extends FormField {\n    /**\n     * The form id the radio group is associated with. Defaults to null, as a radio group can also be used standalone.\n     * @default null\n     */\n    formId?: string | null;\n\n    /**\n     * If set to true, renders all bento-radio-buttons in the group in an error state.\n     * @deprecated Use \"errorMessage\" prop instead\n     * @default false\n     */\n    hasError?: boolean;\n\n    /**\n     * Shows/hides the group label.\n     * @default null\n     */\n    hideLabel?: boolean | null;\n\n    /**\n     * The radio group's items.\n     * Required.\n     */\n    items: BentoRadioGroupItems;\n\n    /**\n     * The name associated with the group. Required for accessibility purposes.\n     * Required.\n     */\n    label: string;\n\n    /**\n     * Determines the initially selected value of the group. Corresponds to the BentoRadioButtonItem's value.\n     * Defaults to no value selected.\n     * @default null\n     */\n    modelValue?: BentoRadioGroupValue | null;\n\n    /**\n     * The radio group's layout. It can be vertical or horizontal. Defaults to vertical.\n     * @default BentoRadioGroupVariant.VERTICAL\n     */\n    variant?: BentoRadioGroupVariant | `${BentoRadioGroupVariant}`;\n}\n","<template>\n    <div class=\"b-radio-group\">\n        <controls-group\n            class=\"b-radio-group__buttons\"\n            :aria-describedby=\"shouldShowErrorMessage ? errorId : ''\"\n            :component-name=\"COMPONENT_NAME\"\n            :class=\"conditionalClasses\"\n            :description=\"description\"\n            :disabled=\"disabled\"\n            :form=\"formId\"\n            :label=\"label\"\n            :optional=\"optional\"\n            :required=\"required\"\n            :hide-label=\"hideLabel\"\n            :tooltip-text=\"tooltipText\"\n            role=\"radiogroup\"\n            :aria-readonly=\"isReadOnly\"\n        >\n            <bento-radio-button\n                v-for=\"item in items\"\n                ref=\"radioButton\"\n                :key=\"item.value\"\n                :model-value=\"inputValue\"\n                :value=\"item.value\"\n                :disabled=\"disabled || item.disabled\"\n                :readonly=\"isReadOnly || item.readonly\"\n                :has-error=\"shouldShowError || item.hasError\"\n                :tag=\"item.tag\"\n                :name=\"formId || label\"\n                @update:model-value=\"onUpdateModelValue\"\n            >\n                <template #default>{{ item.label }}</template>\n                <template v-if=\"item.description\" #description>{{ item.description }}</template>\n                <template v-if=\"hasSlot('content') && isVertical\" #content>\n                    <slot name=\"content\"></slot>\n                </template>\n            </bento-radio-button>\n            <template v-if=\"hasSlot('description')\" #description>\n                <slot name=\"description\" />\n            </template>\n        </controls-group>\n        <error-message\n            v-if=\"shouldShowErrorMessage\"\n            :id=\"errorId\"\n            :error-message=\"errorMessage\"\n            class=\"b-radio-group__error-message\"\n        />\n    </div>\n</template>\n\n<script setup lang=\"ts\">\n    import { computed, ref, toRef, useSlots, watch } from 'vue';\n    import { ControlsGroup, ErrorMessage } from '@/components/internal';\n    import { BentoRadioButton } from './components/radio-button';\n    import { useHasSlot } from '@/composables';\n    import { generateUid } from '@/core/utils/ts';\n    import { deprecate } from '@/utils/ts/deprecate';\n    import { useFormFieldEmits } from '@/utils/ts/form-field/form-field';\n    import { type BentoRadioGroupEmits, type BentoRadioGroupProps, BentoRadioGroupVariant } from './radio-group.types';\n    import { useFormLayoutFieldLoading } from '@/composables/use-form-layout-loading/use-form-layout-loading';\n\n    /**\n     * The name of the component to be used in the Vue devtools and console warnings.\n     */\n    const COMPONENT_NAME = 'bento-radio-group';\n\n    const slots = useSlots();\n    const hasSlot = useHasSlot(slots);\n\n    const emit = defineEmits([\"update:model-value\", \"input\"]);\n\n    const props = defineProps({\n  description: { default: null },\n  disabled: { type: Boolean, default: false },\n  errorMessage: { default: null },\n  label: null,\n  optional: { type: Boolean, default: false },\n  placeholder: null,\n  readonly: { type: Boolean, default: false },\n  required: { type: Boolean, default: false },\n  tooltipText: { default: null },\n  formId: { default: null },\n  hasError: { type: Boolean, default: false },\n  hideLabel: { type: Boolean, default: null },\n  items: null,\n  modelValue: { default: null },\n  variant: { default: BentoRadioGroupVariant.VERTICAL }\n});\n\n    const inputValue = toRef(props, 'modelValue');\n    const errorId = generateUid('error');\n    const { isReadOnly } = useFormLayoutFieldLoading(toRef(props, 'readonly'));\n    const { emitValue } = useFormFieldEmits(emit);\n    const radioButton = ref(null);\n\n    const shouldShowError = computed(\n        () => !props.disabled && !isReadOnly.value && (!!props.errorMessage || props.hasError)\n    );\n    const shouldShowErrorMessage = computed(() => !props.disabled && !isReadOnly.value && !!props.errorMessage);\n\n    const conditionalClasses = computed(() => ({\n        'b-radio-group__buttons--horizontal': props.variant === BentoRadioGroupVariant.HORIZONTAL,\n    }));\n\n    // Content slot logic\n    const isVertical = computed(() => props.variant === 'vertical');\n    const shouldShowSlotError = computed(() => hasSlot('content') && !isVertical?.value);\n\n    const onUpdateModelValue = value => {\n        emitValue(value);\n    };\n\n    if (props.hasError) {\n        deprecate(\n            'BentoRadioGroup \"hasError\" property',\n            `Use the BentoRadioGroup \"errorMessage\" property instead to indicate that there is a modifier error.\n                    Having the field as \"undefined\" will hide/remove the error.\n                    <bento-radio-group errorMessage=\"Error message text\" />`,\n            '2.0.0'\n        );\n    }\n\n    watch(\n        shouldShowSlotError,\n        newVal => {\n            if (newVal) {\n                throw new Error('The content slot is only available for the vertical radio group layout');\n            }\n        },\n        {\n            immediate: true,\n        }\n    );\n\n    const focus = () => {\n        radioButton.value[0].focus();\n    };\n\n    defineExpose({\n        focus,\n    });\n</script>\n\n<script lang=\"ts\">\n    /**\n     * A radio group component should be used whenever it is necessary to use a set of radio buttons\n     * This component conforms to the official WAI-ARIA guidelines for grouping controls: https://www.w3.org/WAI/tutorials/forms/grouping/\n     *\n     * import { BentoRadioGroup } from '@adyen/bento-vue2/';\n     *\n     * export default {\n     *     components: { BentoRadioGroup },\n     *     template: `\n     *             <bento-radio-group\n     *                label=\"Your group label\"\n     *                :items=\"[\n     *                    { value: 1, label: 'Your label' },\n     *                    { value: 2, label: 'Another label', description: 'Your descriptive sub label' },\n     *                 ]\"\n     *                 variant=\"horizontal\"\n     *              />\n     *     `\n     * };\n     */\n    export default {\n        name: 'bento-radio-group',\n        model: { prop: 'modelValue' },\n    };\n</script>\n\n<style lang=\"scss\" scoped src=\"./radio-group.scss\" />\n"],"names":["__default__$1","slots","useSlots","hasSlot","useHasSlot","value","toRefs","props","radioButtonId","generateUid","descriptionId","radioInputRef","ref","useDefaultSlotValidator","conditionalClassContainer","computed","RadioInputStateClass","ariaLabel","useAriaLabel","getSlotText","isChecked","onChange","emit","focus","expose","BentoRadioGroupVariant","BentoRadioGroupVariant2","__default__","COMPONENT_NAME","inputValue","toRef","errorId","isReadOnly","useFormLayoutFieldLoading","emitValue","useFormFieldEmits","radioButton","shouldShowError","shouldShowErrorMessage","conditionalClasses","isVertical","shouldShowSlotError","onUpdateModelValue","deprecate","watch","newVal"],"mappings":";;;;;;;;;;;;;;;AA4KI,MAAAA,IAAA;AAAA,EAAe,MAAA;AAAA,EACL,OAAA,EAAA,MAAA,aAAA;AAEV;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;iBA7HAC,IAAAC,EAAA,GACAC,IAAAC,EAAAH,CAAA,GAoDA,EAAA,OAAAI,EAAA,IAAAC,EAAAC,CAAA,GACAC,IAAAC,EAAA,oBAAA,GACAC,IAAAD,EAAA,aAAA,GACAE,IAAAC,EAAA,IAAA;AAEA,IAAAC,EAAA,sBAAAZ,EAAA,SAAAA,EAAA,WAAA;AAEA,UAAAa,IAAAC,EAAA,OAAA;AAAA,MAAkD,CAAA,mBAAAC,EAAA,QAAA,EAAA,GAAAT,EAAA;AAAA,MACoB,CAAA,mBAAAS,EAAA,QAAA,EAAA,GAAAT,EAAA;AAAA,IACA,EAAA,GAGtEU,IAAAC,EAAA;AAAA,MAA+B,WAAAC,EAAAlB,CAAA,EAAA,SAAA;AAAA,MACY,OAAAI,EAAA;AAAA,IAC1B,CAAA,GAGjBe,IAAAL,EAAA,MAAAR,EAAA,UAAAA,EAAA,UAAA,GAEAc,IAAA,MAAA;AACI,MAAA,CAAAd,EAAA,YAAA,CAAAA,EAAA,aACIe,EAAA,sBAAAf,EAAA,KAAA,GACAe,EAAA,SAAAf,EAAA,KAAA;AAAA,IACJ,GAGJgB,IAAA,MAAA;AACI,MAAAZ,EAAA,MAAA,MAAA;AAAA,IAA0B;AAG9B,WAAAa,EAAA;AAAA,MAAa,OAAAD;AAAA,IACT,CAAA;;;;;;;;;;;;;;;AChID,IAAAE,IAAA,kBAAAC,OACHA,EAAA,aAAA,cACAA,EAAA,WAAA,YAFQA,IAAAD,KAAA,CAAA,CAAA;AC8JR,MAAAE,IAAA;AAAA,EAAe,MAAA;AAAA,EACL,OAAA,EAAA,MAAA,aAAA;AAEV;;;;;;;;;;;;;;;;;;;;;iBAvGAC,IAAA,qBAEA3B,IAAAC,EAAA,GACAC,IAAAC,EAAAH,CAAA,GAsBA4B,IAAAC,EAAAvB,GAAA,YAAA,GACAwB,IAAAtB,EAAA,OAAA,GACA,EAAA,YAAAuB,EAAA,IAAAC,EAAAH,EAAAvB,GAAA,UAAA,CAAA,GACA,EAAA,WAAA2B,EAAA,IAAAC,EAAAb,CAAA,GACAc,IAAAxB,EAAA,IAAA,GAEAyB,IAAAtB;AAAA,MAAwB,MAAA,CAAAR,EAAA,YAAA,CAAAyB,EAAA,UAAA,CAAA,CAAAzB,EAAA,gBAAAA,EAAA;AAAA,IACyD,GAEjF+B,IAAAvB,EAAA,MAAA,CAAAR,EAAA,YAAA,CAAAyB,EAAA,SAAA,CAAA,CAAAzB,EAAA,YAAA,GAEAgC,IAAAxB,EAAA,OAAA;AAAA,MAA2C,sCAAAR,EAAA,YAAAkB,EAAA;AAAA,IACwC,EAAA,GAInFe,IAAAzB,EAAA,MAAAR,EAAA,YAAA,UAAA,GACAkC,IAAA1B,EAAA,MAAAZ,EAAA,SAAA,KAAA,EAAAqC,KAAA,QAAAA,EAAA,MAAA,GAEAE,IAAA,CAAArC,MAAA;AACI,MAAA6B,EAAA7B,CAAA;AAAA,IAAe;AAGnB,IAAAE,EAAA,YACIoC;AAAA,MAAA;AAAA,MACI;AAAA;AAAA;AAAA,MACA;AAAA,IAGA,GAIRC;AAAA,MAAAH;AAAA,MACI,CAAAI,MAAA;AAEI,YAAAA;AACI,gBAAA,IAAA,MAAA,wEAAA;AAAA,MACJ;AAAA,MACJ;AAAA,QACA,WAAA;AAAA,MACe;AAAA,IACf;AAGJ,UAAAtB,IAAA,MAAA;AACI,MAAAa,EAAA,MAAA,CAAA,EAAA,MAAA;AAAA,IAA2B;AAG/B,WAAAZ,EAAA;AAAA,MAAa,OAAAD;AAAA,IACT,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/chunks/selection-card-group.CqGYskmS.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"selection-card-group.CqGYskmS.js","sources":["../../src/components/selection-card/selection-card.types.ts","../../src/components/selection-card/selection-card.keys.ts","../../src/components/selection-card/selection-card.vue","../../src/components/selection-card/components/selection-card-group/selection-card-group.vue"],"sourcesContent":["import { type RadioInputValue } from '@/components/internal/radio-input';\nimport { type BentoCheckboxType } from '../checkbox/checkbox.types';\nimport { type VueNodeElement } from '@/types/elements';\n\nexport enum BentoSelectionCardState {\n    DISABLED = 'disabled',\n    READONLY = 'readonly',\n    ERROR = 'error',\n}\n\nexport type BentoSelectionCardValue = string | number;\n\nexport type BentoSelectionCardModelValue = BentoCheckboxType | RadioInputValue;\n\nexport interface BentoSelectionCardItem {\n    content?: string | object;\n    description?: string;\n    disabled?: boolean;\n    dynamicContent?: string | object;\n    fullyClickable?: boolean;\n    hasError?: boolean;\n    icon?: VueNodeElement;\n    readonly?: boolean;\n    subtitle?: string;\n    title: string;\n    value: BentoSelectionCardValue;\n}\n","export const SELECTION_CARD_RADIO_INPUT_INJECTION_KEY = Symbol('selection card radio input injection key');\n","<template>\n    <div class=\"b-selection-card\" :class=\"conditionalClasses\" @click=\"handleCardClick\">\n        <div class=\"b-selection-card__container\" :class=\"containerConditionalClasses\">\n            <div class=\"b-selection-card__checkbox-container\" :class=\"checkboxContainerConditionalClasses\">\n                <div class=\"b-selection-card__checkbox-container-text\" :class=\"checkboxContainerTextConditionalClasses\">\n                    <div v-if=\"hasSlot('icon')\" class=\"b-selection-card__icon\" role=\"presentation\" aria-hidden=\"true\">\n                        <slot name=\"icon\" />\n                    </div>\n                    <label :for=\"inputId\" class=\"b-selection-card__text\" @click.stop.prevent=\"handleCardClick\">\n                        <bento-typography\n                            v-if=\"subtitle\"\n                            class=\"b-selection-card__description\"\n                            el=\"span\"\n                            variant=\"caption\"\n                        >\n                            {{ subtitle }}\n                        </bento-typography>\n                        <bento-typography el=\"span\" variant=\"title\">{{ title }}</bento-typography>\n                        <bento-typography\n                            v-if=\"description\"\n                            id=\"descriptionId\"\n                            class=\"b-selection-card__description\"\n                            el=\"span\"\n                            variant=\"body\"\n                        >\n                            {{ description }}\n                        </bento-typography>\n                    </label>\n                </div>\n                <radio-input\n                    v-if=\"isRadioInput\"\n                    :id=\"inputId\"\n                    ref=\"inputRef\"\n                    :aria-label=\"ariaLabel\"\n                    :aria-describedby=\"description ? descriptionId : undefined\"\n                    :disabled=\"disabled\"\n                    :has-error=\"hasError\"\n                    :aria-readonly=\"readonly ?? undefined\"\n                    :value=\"value\"\n                    :readonly=\"readonly\"\n                    :model-value=\"computedRadioInputModelValue\"\n                />\n                <checkbox-input\n                    v-else\n                    :id=\"inputId\"\n                    ref=\"inputRef\"\n                    :aria-label=\"ariaLabel\"\n                    :aria-describedby=\"description ? descriptionId : undefined\"\n                    :disabled=\"disabled\"\n                    :has-error=\"hasError\"\n                    :aria-readonly=\"readonly ?? undefined\"\n                    :value=\"value\"\n                    :readonly=\"readonly\"\n                    :model-value=\"computedCheckboxInputModelValue\"\n                />\n            </div>\n            <bento-typography\n                v-if=\"hasSlot('content')\"\n                ref=\"slotRef\"\n                el=\"div\"\n                class=\"b-selection-card__slot\"\n                :class=\"slotConditionalClasses\"\n            >\n                <slot name=\"content\" />\n            </bento-typography>\n            <bento-typography\n                v-if=\"hasSlot('dynamicContent') && isChecked\"\n                ref=\"dynamicSlotRef\"\n                el=\"div\"\n                class=\"b-selection-card__slot\"\n                :class=\"slotConditionalClasses\"\n            >\n                <slot name=\"dynamicContent\" />\n            </bento-typography>\n        </div>\n    </div>\n</template>\n\n<script setup lang=\"ts\">\n    import { BentoTypography } from '@/components/typography';\n    import { type BentoCheckboxType, type BentoMultiCheckboxType, CheckboxInput } from '../internal/checkbox-input';\n    import { RadioInput, type RadioInputValue } from '../internal/radio-input';\n    import { useAriaLabel } from '@/utils/ts/aria-label';\n    import { generateUid } from '@/core/utils/ts';\n    import { computed, type ComputedRef, inject, type PropType, type Ref, ref, useSlots } from 'vue';\n    import { useHasSlot } from '@/composables';\n    import type { BentoSelectionCardModelValue, BentoSelectionCardValue } from './selection-card.types';\n    import { BentoSelectionCardState } from './selection-card.types';\n    import { SELECTION_CARD_RADIO_INPUT_INJECTION_KEY } from './selection-card.keys';\n\n    const props = defineProps({\n        /**\n         * The description of the selection card\n         */\n        description: {\n            type: String,\n            default: undefined,\n        },\n\n        /**\n         * Disables the selection card\n         */\n        disabled: { type: Boolean, default: false },\n\n        /**\n         * Makes the entire selection card clickable. Clicking over interactive elements inside the card with this prop enabled will not be possible.\n         */\n        fullyClickable: { type: Boolean, default: false },\n\n        /**\n         * Shows the selection card in error state\n         */\n        hasError: { type: Boolean, default: false },\n\n        /**\n         * This property should not be used directly.\n         * It will be used by v-model directive on selection card component.\n         *\n         * When handling a single input, use a string or a number.\n         *\n         * When handling multiple inputs, use an array of keys.\n         * These keys exist as a set \"value\" prop for each input.\n         */\n        modelValue: {\n            type: [Boolean, String, Array] as PropType<BentoSelectionCardModelValue>,\n            default: null,\n        },\n\n        /**\n         * Sets the selection card to readonly\n         */\n        readonly: { type: Boolean, default: false },\n\n        /**\n         * The subtitle of the selection card\n         */\n        subtitle: {\n            type: String,\n            default: undefined,\n        },\n\n        /**\n         * The title of the selection card\n         */\n        title: {\n            type: String,\n            required: true,\n        },\n\n        /**\n         * Indicates the value of the input that will be returned when it's checked.\n         */\n        value: {\n            type: [String, Number] as PropType<BentoSelectionCardValue>,\n            required: true,\n        },\n    });\n\n    const emit = defineEmits([\"input\", \"update:model-value\"]);\n\n    const slots = useSlots();\n    const hasSlot = useHasSlot(slots);\n\n    const inputId = generateUid('selection-card-input-id');\n    const descriptionId = generateUid('selection-card-description');\n\n    const computedRadioInputModelValue: ComputedRef<RadioInputValue> = computed(\n        () => props.modelValue as RadioInputValue\n    );\n    const computedCheckboxInputModelValue: ComputedRef<BentoCheckboxType> = computed(\n        () => props.modelValue as BentoCheckboxType\n    );\n\n    const conditionalClasses = computed(() => ({\n        'b-selection-card--checked': isChecked.value,\n        'b-selection-card--fully-clickable': props.fullyClickable,\n    }));\n\n    const containerConditionalClasses = computed(() => ({\n        [`b-selection-card--${BentoSelectionCardState.DISABLED}`]: props.disabled,\n        [`b-selection-card--${BentoSelectionCardState.ERROR}`]: props.hasError,\n        [`b-selection-card--${BentoSelectionCardState.READONLY}`]: props.readonly,\n        'b-selection-card--center-aligned': isTitleOnly.value,\n    }));\n\n    const checkboxContainerConditionalClasses = computed(() => ({\n        'b-selection-card__checkbox-container--center-aligned': isTitleOnly.value,\n    }));\n\n    const checkboxContainerTextConditionalClasses = computed(() => ({\n        'b-selection-card__checkbox-container-text--center-aligned': isTitleOnly.value,\n    }));\n\n    const slotConditionalClasses = computed(() => ({\n        'b-selection-card__slot--with-icon': hasSlot('icon'),\n    }));\n\n    const ariaLabel = useAriaLabel({\n        ariaLabel: props.title,\n        label: props.value as string,\n    });\n\n    const isCheckboxGroup = computed(() => Array.isArray(props.modelValue));\n\n    const isChecked: ComputedRef<boolean> = computed(() => {\n        if (isRadioInput.value) {\n            return props.value === props.modelValue;\n        }\n        if (!isCheckboxGroup.value) {\n            return props.modelValue as boolean;\n        }\n\n        return (props.modelValue as BentoMultiCheckboxType).some(item => item === props.value);\n    });\n\n    const isRadioInput: Ref<boolean> = inject(SELECTION_CARD_RADIO_INPUT_INJECTION_KEY, ref(false));\n\n    const isTitleOnly = computed(() => !props.subtitle && !props.description);\n\n    const inputRef = ref<InstanceType<typeof RadioInput> | InstanceType<typeof CheckboxInput>>(null);\n    const slotRef = ref(null);\n    const dynamicSlotRef = ref(null);\n\n    // Handle click on the whole card area\n    const handleCardClick = (event: Event) => {\n        if (inputRef.value.$refs.inputRef === event.target) {\n            const newValue = toggleInput();\n            onChange(newValue);\n            return;\n        }\n\n        // Do nothing if disabled or readonly\n        if (props.disabled && props.readonly) {\n            return;\n        }\n\n        // If it's not fully clickable prevent selecting the card if the click\n        // originated in a slot\n        if (!props.fullyClickable) {\n            // Check if the click originated from the slot - in that case, do nothng\n            if (slotRef.value && slotRef.value?.$el?.contains(event.target)) {\n                return;\n            }\n            // Check if the click originated from the dynamic slot - in that case, do nothng\n            if (dynamicSlotRef.value && dynamicSlotRef.value?.$el?.contains(event.target)) {\n                return;\n            }\n            // Check if the click originated from the input - in that case do nothing, as the input will emit the event already\n            if (inputRef.value && inputRef.value?.$el?.contains(event.target as Node)) {\n                return;\n            }\n        }\n\n        // If the click originated outside of these two areas, emit the change event\n        const newValue = toggleInput();\n\n        onChange(newValue);\n    };\n\n    const toggleInput = (): BentoSelectionCardModelValue => {\n        const currentValue: boolean = (inputRef.value?.$refs.inputRef as HTMLInputElement).checked;\n\n        if (isCheckboxGroup.value) {\n            const newCheckedList = [...(props.modelValue as BentoMultiCheckboxType)];\n            const index = newCheckedList.indexOf(props.value);\n\n            if (index === -1) {\n                newCheckedList.push(props.value);\n            } else {\n                newCheckedList.splice(index, 1);\n            }\n            return newCheckedList;\n        }\n\n        if (isRadioInput.value) {\n            return props.value;\n        }\n        return currentValue;\n    };\n\n    const onChange = newValue => {\n        if (!props.disabled && !props.readonly) {\n            emit('update:model-value', newValue);\n            emit('input', newValue);\n        }\n    };\n</script>\n\n<script lang=\"ts\">\n    /**\n     * Selection card component. If used standalone, only the checkbox variant can be used. If the checkbox variant is needed, please use the bento-selection-card-group component.\n     *\n     * @example\n     * import { BentoSelectionCard } from '@adyen/bento-vue2';\n     * import EmoticonHappyIcon from '@adyen/ui-assets-icons-16/vue/emoticon-happy';\n     *\n     * export default {\n     *     components: { BentoSelectionCard, EmoticonHappyIcon },\n     *     template: `\n     *          <bento-selection-card title=\"Card title\" :model-value.sync=\"yourModelValue\">\n     *              <template #icon>\n     *                  <emoticon-happy-icon />\n     *              </template>\n     *          </bento-selection-card>\n     *     `\n     * }\n     */\n    export default {\n        name: 'bento-selection-card',\n    };\n</script>\n<style lang=\"scss\" scoped src=\"./selection-card.scss\" />\n","<template>\n    <controls-group\n        ref=\"containerRef\"\n        :aria-describedby=\"shouldShowGroupError ? errorMessageId : null\"\n        :label=\"label\"\n        :hide-label=\"hideLabel\"\n        :description=\"description\"\n        :disabled=\"disabled\"\n        :tooltip-text=\"tooltipText\"\n        :readonly=\"readonly\"\n        :required=\"required\"\n        :optional=\"optional\"\n        class=\"b-selection-card-group\"\n        component-name=\"selection-card-group\"\n    >\n        <div\n            v-if=\"!itemsPerRow || layout === 'vertical'\"\n            class=\"b-selection-card-group__items\"\n            :class=\"conditionalItemsClasses\"\n        >\n            <bento-selection-card\n                v-for=\"item in items\"\n                :key=\"`selection-card-${item.value}`\"\n                class=\"b-selection-card-group__item\"\n                v-bind=\"item\"\n                :model-value=\"inputValue\"\n                :readonly=\"readonly || item.readonly\"\n                :has-error=\"shouldShowGroupError\"\n                :disabled=\"disabled || item.disabled\"\n                @update:model-value=\"onInput\"\n            >\n                <template v-if=\"hasSlot('icon') && item.icon\" #icon>\n                    <slot name=\"icon\" v-bind=\"item\"></slot>\n                </template>\n                <template v-if=\"hasSlot('content') && item.content\" #content>\n                    <slot name=\"content\" v-bind=\"item\"></slot>\n                </template>\n                <template v-if=\"hasSlot('dynamicContent') && item.dynamicContent\" #dynamicContent>\n                    <slot name=\"dynamicContent\" v-bind=\"item\"></slot>\n                </template>\n            </bento-selection-card>\n        </div>\n        <template v-else>\n            <div :key=\"`selection-card-group-layout-breakpoint-${currentBreakpoint}`\">\n                <grid-layout\n                    v-for=\"(row, rowIndex) in computedRows\"\n                    :key=\"`selection-card-group-row-${rowIndex}-cols-${computedItemsPerRow}`\"\n                    class=\"b-selection-card-group__items--wrap\"\n                    :column-width=\"computedColumnWidth\"\n                >\n                    <template v-for=\"(item, columnIndex) in row\" #[`col-${columnIndex+1}`]>\n                        <bento-selection-card\n                            :key=\"`selection-card-${item.value}`\"\n                            class=\"b-selection-card-group__item b-selection-card-group__item--full-height\"\n                            v-bind=\"item\"\n                            :model-value=\"inputValue\"\n                            :readonly=\"readonly || item.readonly\"\n                            :has-error=\"shouldShowGroupError\"\n                            :disabled=\"disabled || item.disabled\"\n                            @update:model-value=\"onInput\"\n                        >\n                            <template v-if=\"hasSlot('icon') && item.icon\" #icon>\n                                <slot name=\"icon\" v-bind=\"item\"></slot>\n                            </template>\n                            <template v-if=\"hasSlot('content') && item.content\" #content>\n                                <slot name=\"content\" v-bind=\"item\"></slot>\n                            </template>\n                            <template v-if=\"hasSlot('dynamicContent') && item.dynamicContent\" #dynamicContent>\n                                <slot name=\"dynamicContent\" v-bind=\"item\"></slot>\n                            </template>\n                        </bento-selection-card>\n                    </template>\n                </grid-layout>\n            </div>\n        </template>\n        <error-message\n            v-if=\"shouldShowGroupError\"\n            :id=\"errorMessageId\"\n            :error-message=\"errorMessage\"\n            class=\"b-selection-card-group__error-message\"\n        />\n    </controls-group>\n</template>\n\n<script setup lang=\"ts\">\n    import { computed, onMounted, provide, ref, useSlots, watch } from 'vue';\n    import { useElementSize } from '@vueuse/core';\n    import { BMediaQueryMMax, BMediaQuerySMax } from '@adyen/bento-design-tokens/dist/js/bento/es6';\n    import { type BentoSelectionCardGroupEmits, type BentoSelectionCardGroupProps } from './selection-card-group.types';\n    import BentoSelectionCard from '../../selection-card.vue';\n    import { ControlsGroup, ErrorMessage, GridLayout } from '../../../internal';\n    import { SELECTION_CARD_RADIO_INPUT_INJECTION_KEY } from '../../selection-card.keys';\n    import { generateUid } from '@/core/utils/ts';\n    import { useFormFieldEmits } from '@/utils/ts/form-field/form-field';\n\n    const props = defineProps({\n  description: { default: null },\n  disabled: { type: Boolean, default: false },\n  errorMessage: { default: null },\n  label: { default: null },\n  optional: { type: Boolean, default: false },\n  placeholder: null,\n  readonly: { type: Boolean, default: false },\n  required: { type: Boolean, default: false },\n  tooltipText: { default: null },\n  formId: { default: null },\n  hideLabel: { type: Boolean, default: null },\n  layout: { default: 'vertical' },\n  items: null,\n  itemsPerRow: { default: undefined },\n  modelValue: { default: null },\n  variant: { default: 'checkbox' }\n});\n\n    const emit = defineEmits([\"update:model-value\", \"input\"]);\n\n    const { emitValue } = useFormFieldEmits(emit);\n\n    const slots = useSlots();\n    // Slots logic\n    // Temporary, use-has-slots composable doesn't currently work for vue3 named scoped slots\n    // We do the same in bento-checkbox-group\n    const hasSlot = name => !!slots[name];\n\n    const conditionalItemsClasses = computed(() => ({\n        'b-selection-card-group__items--horizontal': props.layout === 'horizontal',\n    }));\n\n    const inputValue = ref(props.modelValue);\n    watch(\n        () => props.modelValue,\n        () => {\n            inputValue.value = props.modelValue;\n        }\n    );\n\n    // Error message logic\n    const errorMessageId = generateUid('error');\n    const shouldShowGroupError = computed(() => !props.disabled && !props.readonly && !!props.errorMessage);\n\n    // itemsPerRow logic\n    const containerRef = ref<HTMLElement | null>(null);\n    const { width } = useElementSize(containerRef);\n\n    const smallBreakpoint = computed(() => BMediaQuerySMax.split('px')[0]);\n    const mediumBreakpoint = computed(() => BMediaQueryMMax.split('px')[0]);\n\n    const currentBreakpoint = computed(() => {\n        if (width.value < smallBreakpoint.value) {\n            return 'small';\n        }\n        if (width.value >= smallBreakpoint.value && width.value < mediumBreakpoint.value) {\n            return 'medium';\n        }\n        return 'large';\n    });\n\n    const computedItemsPerRow = computed(() => {\n        return (props.itemsPerRow?.[currentBreakpoint?.value] as number) || props.items.length;\n    });\n\n    const computedRows = computed(() => {\n        if (!props.itemsPerRow) {\n            return [];\n        }\n        const rows = [];\n        for (let i = 0; i < props.items.length; i += computedItemsPerRow?.value) {\n            rows.push(props.items.slice(i, i + computedItemsPerRow?.value));\n        }\n        return rows;\n    });\n\n    // We need to compute the column width on 12 because we're using a 12-column system for out grid-layout logic\n    const itemColumnWidth = computed(() => 12 / computedItemsPerRow?.value);\n\n    /**\n     * Filling the columnWidth array with the same parameters per item to pass\n     * to the `grid-layout` layout so the each card can have\n     * the same width according to the screen size.\n     */\n    const computedColumnWidth = computed(() => {\n        return computedItemsPerRow?.value\n            ? new Array(computedItemsPerRow?.value).fill({\n                  // Instead of passing the actual screen sizes values, passing the same values per each screen size and recomputing it makes sure visually the change is smoother and not laggy\n                  small: itemColumnWidth.value,\n                  medium: itemColumnWidth.value,\n                  large: itemColumnWidth.value,\n              })\n            : [];\n    });\n\n    const onInput = value => {\n        inputValue.value = value;\n        emitValue(value);\n    };\n\n    const isRadioVariant = computed(() => props.variant === 'radio');\n\n    provide(SELECTION_CARD_RADIO_INPUT_INJECTION_KEY, isRadioVariant);\n\n    onMounted(() => {\n        if (props.itemsPerRow) {\n            Object.values(props.itemsPerRow).forEach(el => {\n                if (el && (el < 2 || el > 6)) {\n                    throw new Error(\n                        'itemsPerRow values must have a value between 2 and 6 items per row. Read the documentation for more information.'\n                    );\n                }\n            });\n        }\n    });\n</script>\n\n<script lang=\"ts\">\n    /**\n     * Group of bento-selection-cards.\n     *\n     * @example\n     * import { BentoSelectionCardGroup } from '@adyen/bento-vue2';\n     *\n     * export default {\n     *     components: { BentoSelectionCardGroup },\n     *     template: `\n     *          <bento-selection-card-group\n     *              :items=\"[\n     *                    {\n     *                        title: 'Card 1',\n     *                        value: 'card-1',\n     *                        content: 'Slot content 1',\n     *                        icon: RetailIcon,\n     *                    },\n     *                    {\n     *                        title: 'Card 2',\n     *                        value: 'card-2',\n     *                        content: 'Slot content 2',\n     *                        icon: LeafIcon,\n     *                    },\n     *                ]\"\n     *          >\n     *             <template #icon=\"{ icon }\">\n     *                 <component :is=\"icon\"/>\n     *              </template>\n     *              <template #content=\"{ content }\">\n     *                  <div>{{ content }}</div>\n     *               </template>\n     *          </bento-selection-card-group>\n     *     `,\n     * }\n     */\n    export default {\n        model: { prop: 'modelValue' },\n    };\n</script>\n\n<style lang=\"scss\" scoped src=\"./selection-card-group.scss\" />\n"],"names":["BentoSelectionCardState","BentoSelectionCardState2","SELECTION_CARD_RADIO_INPUT_INJECTION_KEY","__default__$1","slots","useSlots","hasSlot","useHasSlot","inputId","generateUid","descriptionId","computedRadioInputModelValue","computed","props","computedCheckboxInputModelValue","conditionalClasses","isChecked","containerConditionalClasses","isTitleOnly","checkboxContainerConditionalClasses","checkboxContainerTextConditionalClasses","slotConditionalClasses","ariaLabel","useAriaLabel","isCheckboxGroup","isRadioInput","item","inject","ref","inputRef","slotRef","dynamicSlotRef","handleCardClick","event","newValue2","toggleInput","onChange","_b","_a","_d","_c","_f","_e","newValue","currentValue","newCheckedList","index","emit","__default__","emitValue","useFormFieldEmits","name","conditionalItemsClasses","inputValue","watch","errorMessageId","shouldShowGroupError","containerRef","width","useElementSize","smallBreakpoint","BMediaQuerySMax","mediumBreakpoint","BMediaQueryMMax","currentBreakpoint","computedItemsPerRow","computedRows","rows","i","itemColumnWidth","computedColumnWidth","onInput","value","isRadioVariant","provide","onMounted","el"],"mappings":"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"}