npm - @adyen/bento-vue3 - Versions diffs - 1.0.0 → 1.1.0 - Mend

@adyen/bento-vue3 1.0.0 → 1.1.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (591) hide show

package/dist/modal.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"modal.js","sources":["../../vue2/src/components/modal/modal.types.ts","../../vue2/src/components/modal/components/base-modal/base-modal.vue","../../vue2/src/components/modal/components/modal-default/modal-default.vue","../../vue2/src/components/modal/components/modal-dialog/modal-dialog.vue","../../vue2/src/components/modal/modal.vue"],"sourcesContent":["export enum BentoModalVariant {\n DEFAULT = 'BentoModalDefault',\n DIALOG = 'BentoModalDialog',\n}\n\nexport enum BentoModalSize {\n SMALL = 'small',\n MEDIUM = 'medium',\n LARGE = 'large',\n}\n\nexport enum BentoModalColumnLayoutVariant {\n SMALLER = 'smaller',\n EQUAL = 'equal',\n BIGGER = 'bigger',\n}\n\nexport enum BentoModalRole {\n DIALOG = 'dialog',\n ALERT_DIALOG = 'alertdialog',\n}\n\nexport enum BentoModalDialogType {\n CONFIRMATION = 'confirmation',\n DESTRUCTIVE = 'destructive',\n INFO = 'info',\n ACKNOWLEDGEMENT = 'acknowledgement',\n}\n\nexport enum BentoModalEvent {\n CLOSE_MODAL = 'close-modal',\n}\n","<template>\n <div class=\"b-modal-base\">\n <dialog\n ref=\"modal\"\n :role=\"modalRole\"\n :aria-label=\"computedAriaLabel\"\n class=\"b-modal-base__container\"\n :class=\"modalConditionalClasses\"\n :open=\"initiallyOpen\"\n @click=\"isDismissible && closeModalOnClickOutside($event)\"\n @keydown.esc=\"emitCloseEvent\"\n >\n <bento-focus-trap>\n <div class=\"b-modal-base__wrapper\">\n <div\n v-if=\"hasSlot('default') \|\| !hideCloseButton\"\n class=\"b-modal-base__header-container\"\n :style=\"customPaddingStyles.header\"\n >\n <div class=\"b-modal-base__header\">\n <bento-typography\n class=\"b-modal-base__title\"\n aria-label=\"base modal title\"\n :el=\"BentoTypographyElement.SPAN\"\n :variant=\"BentoTypographyVariant.TITLE\"\n stronger\n >\n <slot v-if=\"hasSlot('default')\" />\n </bento-typography>\n <bento-button\n v-if=\"!hideCloseButton\"\n class=\"b-modal-base__close-button\"\n :variant=\"BentoButtonVariant.TERTIARY\"\n type=\"button\"\n @click=\"onCloseButtonClick\"\n >\n <cross-icon svg-title=\"close\" />\n </bento-button>\n </div>\n\n <bento-divider v-if=\"hasColumnLayout\" class=\"b-modal-base__divider\" />\n </div>\n\n <div\n class=\"b-modal-base__content\"\n :class=\"modalContentConditionalClasses\"\n :style=\"customPaddingStyles.content\"\n >\n <bento-typography\n v-if=\"hasSlot('content')\"\n aria-label=\"base modal content\"\n :el=\"BentoTypographyElement.DIV\"\n :variant=\"BentoTypographyVariant.BODY\"\n stronger\n >\n <grid-layout\n v-if=\"hasColumnLayout\"\n :column-width=\"computedColumnWidth\"\n :container-type=\"GridLayoutContainerType.NORMAL\"\n class=\"b-modal-base__grid\"\n >\n <template #col-1><slot name=\"content-col-1\"></slot></template>\n <template #col-2><slot name=\"content-col-2\"></slot></template>\n </grid-layout>\n <slot v-else name=\"content\" />\n </bento-typography>\n </div>\n\n <div\n v-if=\"hasSlot('actions')\"\n class=\"b-modal-base__actions-container\"\n :style=\"customPaddingStyles.actions\"\n >\n <bento-divider v-if=\"hasColumnLayout\" class=\"b-modal-base__divider\" />\n\n <div aria-label=\"modal actions\" class=\"b-modal-base__actions\">\n <slot name=\"actions\" />\n </div>\n </div>\n </div>\n </bento-focus-trap>\n </dialog>\n </div>\n</template>\n\n<script lang=\"ts\">\n import { computed, defineComponent, onMounted, PropType, ref, toRefs, watch } from 'vue';\n import {\n BentoModalColumnLayoutVariant,\n BentoModalEvent,\n BentoModalRole,\n BentoModalSize,\n } from '@/components/modal/modal.types';\n\n import { BentoButtonVariant } from '@/components/button/button.types';\n import { BentoTypography, BentoTypographyElement, BentoTypographyVariant } from '@/components/typography';\n import { BentoButton } from '@/components/button';\n import { BentoDivider } from '@/components/divider';\n import { BentoFocusTrap } from '@/components/focus-trap';\n import { GridLayout, GridLayoutContainerType } from '@/internal';\n import { hasSlot } from '@/utils/ts/hasSlot';\n import { useAriaLabel } from '@/utils/ts/aria-label';\n import { useI18n } from '@/utils/ts/i18n';\n import { getSlotText } from '@/utils/ts/get-slot-text';\n import CrossIcon from '@adyen/ui-assets-icons-16/vue/cross';\n import messages from './messages.json';\n\n type MessageSchema = (typeof messages)['en-US'];\n\n export default defineComponent({\n i18n: { messages },\n name: 'base-modal',\n components: { CrossIcon, BentoTypography, BentoButton, BentoDivider, BentoFocusTrap, GridLayout },\n props: {\n /*\n Defines whether the modal will be an alert modal\n /\n modalRole: {\n type: String,\n default: BentoModalRole.DIALOG,\n },\n /\n If set to true, it allows the modal to be closed by clicking outside of it\n /\n isDismissible: {\n type: Boolean,\n required: true,\n },\n /\n Hides a cross icon on the right side of the title\n /\n hideCloseButton: {\n type: Boolean,\n required: true,\n },\n /\n If provided, manages the padding of the whole modal container\n /\n customPadding: {\n type: String,\n default: null,\n },\n /\n If provided, renders the modal's content in a two-column layout an wth dividers separating its content\n /\n withColumnLayout: {\n type: Boolean,\n default: false,\n },\n\n /\n If a column layout is provided, it renders the respective left column width variant. This can be smaller than the second column, the same size as the second column or bigger than the second column.\n /\n columnsSize: {\n type: String as PropType<BentoModalColumnLayoutVariant>,\n default: BentoModalColumnLayoutVariant.SMALLER,\n },\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 required: true,\n },\n\n /\n Sets the width of the modal\n /\n size: {\n type: String as PropType<BentoModalSize>,\n default: BentoModalSize.SMALL,\n },\n\n /\n Sets the open attribute on the dialog element, use isOpen instead to toggle modal visbility.\n /\n initiallyOpen: {\n type: Boolean,\n default: false,\n },\n overflowVisible: {\n type: Boolean,\n default: false,\n },\n },\n emits: [BentoModalEvent.CLOSE_MODAL],\n setup(props, { slots, emit }) {\n const { t } = useI18n<{ message: MessageSchema }>({ messages });\n const modal = ref(null);\n\n const { isOpen, customPadding, overflowVisible } = toRefs(props);\n\n const labelSlot = computed((): string =>\n hasSlot(slots)('default') && slots.default() ? getSlotText(slots)('default') : null\n );\n\n const customPaddingStyles = computed(() => {\n if (!customPadding.value) {\n return {};\n }\n\n const xPadding = {\n paddingLeft: customPadding.value,\n paddingRight: customPadding.value,\n };\n\n const content = { ...xPadding, paddingTop: undefined, paddingBottom: undefined };\n\n if (!hasSlot(slots)('default')) {\n content.paddingTop = customPadding.value;\n }\n\n if (!hasSlot(slots)('actions')) {\n content.paddingBottom = customPadding.value;\n }\n\n return {\n header: { ...xPadding, paddingTop: customPadding.value },\n content,\n actions: { ...xPadding, paddingBottom: customPadding.value },\n };\n });\n\n const computedAriaLabel = useAriaLabel({\n label: labelSlot,\n defaultFallback: t('ariaLabelFallback') as string,\n });\n\n const hasColumnLayout = computed(() => props.withColumnLayout && props.size === BentoModalSize.LARGE);\n\n const openModal = (): void => {\n modal.value.showModal();\n };\n\n const emitCloseEvent = (): void => {\n emit(BentoModalEvent.CLOSE_MODAL);\n };\n\n const closeModal = (): void => {\n modal.value.close();\n emitCloseEvent();\n };\n\n const onCloseButtonClick = () => {\n closeModal();\n };\n\n /\n Since the dialog HTML element doesn't automatically close when clicking outside, a check on when the user is clicking is needed.\n * If the click doesn't happen in the dialog box itself, the modal closes\n /\n const closeModalOnClickOutside = ({ target }: Event): void => {\n if (target && (target as HTMLElement).tagName === BentoModalRole.DIALOG.toUpperCase()) {\n closeModal();\n }\n };\n\n const modalConditionalClasses = computed(() => ({\n [`b-modal-base__container--${props.size}`]: props.size,\n [`b-modal-base__container--visible`]: isOpen.value,\n [`b-modal-base__container--overflow-visible`]: overflowVisible.value,\n [`b-modal-base__container--column-layout`]: hasColumnLayout.value,\n }));\n\n const modalContentConditionalClasses = computed(() => ({\n 'b-modal-base__content--column-layout': hasColumnLayout.value,\n 'b-modal-base__content--with-header': hasSlot(slots)('default'),\n 'b-modal-base__content--with-actions': hasSlot(slots)('actions'),\n }));\n\n const computedColumnWidth = computed(() => {\n if (props.columnsSize === BentoModalColumnLayoutVariant.SMALLER) {\n return [{ small: 4, medium: 4, large: 4 }];\n }\n if (props.columnsSize === BentoModalColumnLayoutVariant.BIGGER) {\n return [{ small: 8, medium: 8, large: 8 }];\n }\n return [{ small: 6, medium: 6, large: 6 }];\n });\n\n watch(\n () => [isOpen.value, modal.value],\n (): void => {\n if (isOpen.value && modal.value) {\n openModal();\n } else if (modal.value) {\n closeModal();\n }\n },\n { immediate: true }\n );\n\n onMounted(() => {\n if (isOpen.value && modal.value) {\n openModal();\n }\n });\n\n return {\n // Refs\n modal,\n computedAriaLabel,\n\n // Handling the state\n openModal,\n closeModalOnClickOutside,\n\n // Methods\n onCloseButtonClick,\n hasSlot: hasSlot(slots),\n emitCloseEvent,\n\n // Styles\n modalConditionalClasses,\n modalContentConditionalClasses,\n customPaddingStyles,\n hasColumnLayout,\n computedColumnWidth,\n\n // Enums\n BentoButtonVariant,\n BentoTypographyElement,\n BentoTypographyVariant,\n GridLayoutContainerType,\n };\n },\n });\n</script>\n\n<style lang=\"scss\" scoped src=\"./base-modal.scss\" />\n","<template>\n <base-modal\n class=\"b-modal-default\"\n :size=\"size\"\n :hide-close-button=\"hideCloseButton\"\n :custom-padding=\"customPadding\"\n :is-dismissible=\"isDismissible\"\n :is-open=\"isOpen\"\n :overflow-visible=\"overflowVisible\"\n :with-column-layout=\"withColumnLayout\"\n :initially-open=\"initiallyOpen\"\n @close-modal=\"onCloseModal\"\n >\n <template v-if=\"hasSlot('default')\" #default>\n <slot></slot>\n </template>\n <template #content-col-1><slot name=\"content-col-1\"></slot></template>\n <template #content-col-2><slot name=\"content-col-2\"></slot></template>\n <template #content><slot name=\"content\"></slot></template>\n\n <template v-if=\"actions\" #actions>\n <slot name=\"actions\">\n <bento-typography\n v-if=\"actionsLabel\"\n class=\"b-modal-base__title\"\n aria-label=\"base modal title\"\n :el=\"BentoTypographyElement.SPAN\"\n :variant=\"BentoTypographyVariant.BODY\"\n stronger\n >\n {{ actionsLabel }}\n </bento-typography>\n\n <bento-button-actions\n v-if=\"alignedActions.leftAligned\"\n :actions=\"alignedActions.leftAligned\"\n :layout=\"BentoButtonActionsLayout.BUTTONS_START\"\n ></bento-button-actions>\n\n <bento-button-actions\n :actions=\"alignedActions.rightAligned\"\n :layout=\"BentoButtonActionsLayout.BUTTONS_END\"\n ></bento-button-actions>\n </slot>\n </template>\n </base-modal>\n</template>\n\n<script lang=\"ts\">\n import { computed, defineComponent, onMounted, PropType, toRefs } from 'vue';\n import { BentoModalColumnLayoutVariant, BentoModalEvent, BentoModalSize } from '@/components/modal/modal.types';\n import { BaseModal } from '@/components/modal/components/base-modal';\n import { hasSlot } from '@/utils/ts/hasSlot';\n import {\n BentoButtonActions,\n BentoButtonActionsLayout,\n BentoButtonActionsList,\n BentoButtonVariant,\n } from '@/components/button';\n import { BentoTypography, BentoTypographyElement, BentoTypographyVariant } from '@/components/typography';\n\n export default defineComponent({\n name: 'bento-modal-default',\n components: { BaseModal, BentoButtonActions, BentoTypography },\n inheritAttrs: false,\n props: {\n /\n Adds a cross icon on the right side of the alert\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 required: true,\n },\n /\n If set to true, it allows the modal to be closed by clicking outside of it\n /\n isDismissible: {\n type: Boolean,\n required: true,\n },\n /\n If set to true, it will set overflow:visible to the modal, only recommended to be used with dropdown\n /\n overflowVisible: {\n type: Boolean,\n default: false,\n },\n /\n Hides a cross icon on the right side of the title\n /\n hideCloseButton: {\n type: Boolean,\n default: false,\n },\n /\n Sets the width of the modal\n /\n size: {\n type: String as PropType<BentoModalSize>,\n required: true,\n },\n /\n If provided, manages the padding of the whole modal container\n /\n customPadding: {\n type: String,\n default: null,\n },\n\n /\n If provided, renders the modal's content in a two-column layout an wth dividers separating its content\n /\n withColumnLayout: {\n type: Boolean,\n default: false,\n },\n\n /\n If a column layout is provided, it renders the respective left column width variant. This can be smaller than the second column, the same size as the second column or bigger than the second column.\n /\n columnsSize: {\n type: String as PropType<BentoModalColumnLayoutVariant>,\n default: BentoModalColumnLayoutVariant.SMALLER,\n },\n\n /\n List of actions that will be used to render the buttons.\n * First element in the list will be rendered as \"primary\".\n * All elements after the first will be rendered as \"secondary\".\n * But you may change the color of 1-st action to red with 'critial' key\n * Not more than 3 action buttons can be provided\n * Or 2 action buttons and 1 Label for them\n \n Each object in the list should have a `title`, an `event` and\n * (optional) a Vue `icon` from the library `@adyen/ui-assets-icons-16`.\n \n `title`: Button's text.\n \n `event`: Event triggered when clicking the Button.\n \n `icon`: Vue Icon from the library `@adyen/ui-assets-icons-16`.\n \n ```\n * [{\n * title: 'Primary',2\n * event: () => { ... },\n * icon: FourPeopleIcon\n * }, {\n * title: 'Secondary',\n * event: () => { ... }\n * }]\n * ```\n /\n actions: {\n type: Array as PropType<BentoButtonActionsList>,\n default: null,\n },\n /\n Text label that is displayed left to the action buttons\n /\n actionsLabel: {\n type: String,\n default: null,\n },\n /\n If passed - sets first button color to red\n /\n destructiveActions: {\n type: Boolean,\n default: false,\n },\n\n /\n Sets the open attribute on the dialog element, use isOpen instead to toggle modal visbility.\n /\n initiallyOpen: {\n type: Boolean,\n default: false,\n },\n },\n emits: [BentoModalEvent.CLOSE_MODAL],\n setup(props, { slots, emit }) {\n const { actions, destructiveActions } = toRefs(props);\n\n const alignedActions = computed(() => {\n const rightAlignedButtons =\n actions.value.length < 3 ? actions.value : actions.value.slice(0, actions.value.length - 1);\n\n if (destructiveActions.value) {\n // Add red color to the 1-st Action button\n rightAlignedButtons[0].critical = true;\n }\n\n return {\n leftAligned:\n actions.value.length === 3\n ? [\n {\n ...actions.value[actions.value.length - 1],\n variant: BentoButtonVariant.SECONDARY,\n },\n ]\n : null,\n rightAligned: rightAlignedButtons,\n };\n });\n\n const onCloseModal = () => {\n emit(BentoModalEvent.CLOSE_MODAL);\n };\n\n onMounted(() => {\n if (\n !(hasSlot(slots)('content') \|\| (hasSlot(slots)('content-col-1') && hasSlot(slots)('content-col-2')))\n ) {\n throw new Error('Bento Modal default variant requires content slot or column slots');\n }\n\n if (props.actions && props.actions.length > 3) {\n throw new Error('Not more than 3 action buttons may be provided to Bento Modal default variant');\n }\n\n if (props.actionsLabel && props.actions && props.actions.length > 2) {\n throw new Error(\n 'Not more than 2 action buttons may be provided with actions label to Bento Modal default variant'\n );\n }\n });\n\n return {\n // Values\n alignedActions,\n\n // Methods\n onCloseModal,\n hasSlot: hasSlot(slots),\n\n // Enums\n BentoButtonActionsLayout,\n BentoTypographyElement,\n BentoTypographyVariant,\n };\n },\n });\n</script>\n","<template>\n <base-modal\n class=\"b-modal-dialog\"\n :class=\"modalDialogConditionalClasses\"\n :hide-close-button=\"true\"\n :size=\"BentoModalSize.SMALL\"\n :is-dismissible=\"isDismissible\"\n :is-open=\"isOpen\"\n :overflow-visible=\"overflowVisible\"\n :modal-role=\"BentoModalRole.ALERT_DIALOG\"\n :initially-open=\"initiallyOpen\"\n @close-modal=\"onCloseModal\"\n >\n <template #default>\n <slot></slot>\n </template>\n <template #content>\n {{ content }}\n </template>\n\n <template #actions>\n <bento-button-actions\n v-if=\"dialogType === BentoModalDialogType.ACKNOWLEDGEMENT\"\n :actions=\"acknowledgementDialogActions\"\n :layout=\"BentoButtonActionsLayout.BUTTONS_END\"\n ></bento-button-actions>\n\n <bento-button-actions\n v-else\n :actions=\"dialogActions\"\n :layout=\"BentoButtonActionsLayout.BUTTONS_END\"\n ></bento-button-actions>\n </template>\n </base-modal>\n</template>\n\n<script lang=\"ts\">\n import { computed, defineComponent, onMounted, PropType, toRefs } from 'vue';\n import {\n BentoModalDialogType,\n BentoModalEvent,\n BentoModalRole,\n BentoModalSize,\n } from '@/components/modal/modal.types';\n import { BaseModal } from '@/components/modal/components/base-modal';\n import { hasSlot } from '@/utils/ts/hasSlot';\n import {\n BentoButtonActionObject,\n BentoButtonActions,\n BentoButtonActionsLayout,\n BentoButtonActionsList,\n BentoButtonVariant,\n } from '@/components/button';\n import { useI18n } from '@/utils/ts/i18n';\n import messages from './messages.json';\n\n type MessageSchema = (typeof messages)['en-US'];\n\n export default defineComponent({\n i18n: { messages },\n name: 'bento-modal-dialog',\n components: { BaseModal, BentoButtonActions },\n inheritAttrs: false,\n props: {\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 required: true,\n },\n /\n If set to true, it allows the modal to be closed by clicking outside of it\n /\n isDismissible: {\n type: Boolean,\n required: true,\n },\n /\n If set to true, it will set overflow:visible to the modal, only recommended to be used with dropdown\n /\n overflowVisible: {\n type: Boolean,\n default: false,\n },\n /\n Sets different action buttons styling and appearance\n /\n dialogType: {\n type: String as PropType<BentoModalDialogType>,\n required: true,\n },\n /\n Text that is displayed in the content section of modal\n /\n content: {\n type: String,\n required: true,\n },\n /\n List of actions that will be used to render the buttons.\n * Only 1 action button is allowed for Modal Dialog\n \n Each object in the list should have a `title`, an `event` and\n * (optional) a Vue `icon` from the library `@adyen/ui-assets-icons-16`.\n \n `title`: Button's text.\n \n `event`: Event triggered when clicking the Button.\n \n `icon`: Vue Icon from the library `@adyen/ui-assets-icons-16`.\n \n ```\n * [{\n * title: 'Primary',2\n * event: () => { ... },\n * icon: FourPeopleIcon\n * }]\n * ```\n /\n actions: {\n type: Array as PropType<BentoButtonActionsList>,\n default: null,\n },\n\n /\n Sets the open attribute on the dialog element, use isOpen instead to toggle modal visbility.\n /\n initiallyOpen: {\n type: Boolean,\n default: false,\n },\n },\n emits: [BentoModalEvent.CLOSE_MODAL],\n setup(props, { slots, emit }) {\n const { t } = useI18n<{ message: MessageSchema }>({ messages });\n const { actions, dialogType } = toRefs(props);\n\n const onCloseModal = () => {\n emit(BentoModalEvent.CLOSE_MODAL);\n };\n\n const onCloseActionButton = () => {\n onCloseModal();\n };\n\n const acknowledgementDialogActions = computed(() => [\n {\n title: t('okButtonText') as string,\n event: onCloseActionButton,\n variant: BentoButtonVariant.SECONDARY,\n },\n ]);\n\n const dialogActions = computed(() => {\n const mandatoryCancelActionButton: BentoButtonActionObject = {\n title: 'Cancel',\n event: onCloseActionButton,\n };\n const updatedPassedActionsObject: BentoButtonActionObject = actions?.value?.[0];\n\n if (dialogType.value === BentoModalDialogType.DESTRUCTIVE) {\n updatedPassedActionsObject.critical = true;\n } else if (dialogType.value === BentoModalDialogType.INFO) {\n updatedPassedActionsObject.variant = BentoButtonVariant.SECONDARY;\n }\n\n return [updatedPassedActionsObject, mandatoryCancelActionButton];\n });\n\n const modalDialogConditionalClasses = computed(() => ({\n [`b-modal-dialog--${dialogType.value}`]: dialogType.value,\n }));\n\n onMounted(() => {\n if (!hasSlot(slots)('default') \|\| !props.content) {\n throw new Error('Bento Modal Dialog requires header title and content');\n }\n\n if (actions?.value?.length > 1) {\n throw new Error('Not more than 1 action button may be provided to Modal Dialog');\n }\n\n if (dialogType.value !== BentoModalDialogType.ACKNOWLEDGEMENT && !actions?.value) {\n throw new Error(\n 'Modal Dialog, except ACKNOWLEDGEMENT type, always has to contain one action button'\n );\n }\n\n if (dialogType.value === BentoModalDialogType.ACKNOWLEDGEMENT && actions?.value?.length) {\n throw new Error('Acknowledgement Modal Dialog does not accept action buttons');\n }\n });\n\n return {\n // Values\n dialogActions,\n acknowledgementDialogActions,\n\n // Methods\n onCloseModal,\n onCloseActionButton,\n\n // Styles\n modalDialogConditionalClasses,\n\n // Enums\n BentoModalRole,\n BentoModalSize,\n BentoButtonVariant,\n BentoModalDialogType,\n BentoButtonActionsLayout,\n };\n },\n });\n</script>\n","<template>\n <component\n :is=\"variant\"\n class=\"b-modal\"\n :is-open=\"isOpen\"\n :actions=\"actions\"\n v-bind=\"customProps\"\n @close-modal=\"onCloseModal\"\n >\n <template v-if=\"hasSlot('default')\" #default>\n <slot></slot>\n </template>\n <template v-if=\"hasSlot('content-col-1')\" #content-col-1><slot name=\"content-col-1\"></slot></template>\n <template v-if=\"hasSlot('content-col-2')\" #content-col-2><slot name=\"content-col-2\"></slot></template>\n <template v-if=\"hasSlot('content')\" #content><slot name=\"content\"></slot></template>\n </component>\n</template>\n\n<script lang=\"ts\">\n import { computed, defineComponent, PropType, toRefs } from 'vue';\n import {\n BentoModalColumnLayoutVariant,\n BentoModalDialogType,\n BentoModalEvent,\n BentoModalSize,\n BentoModalVariant,\n } from '@/components/modal/modal.types';\n import { BentoModalDefault, BentoModalDialog } from '@/components/modal/components';\n import { hasSlot } from '@/utils/ts/hasSlot';\n import { BentoButtonActionsList } from '@/components/button';\n\n /\n Modal is a window that appear over any other page content and focus user attention exclusively on one task or piece of information at the moment.\n \n @example\n * import { BentoModal } from '@adyen/bento-vue2';\n \n export default {\n * components: { BentoModal },\n * template: `\n * <bento-modal :isOpen=\"true\">\n * Title of the Modal\n * <template #content>\n * Mandatory content slot\n * </template>\n * </bento-modal>\n * `\n * };\n /\n export default defineComponent({\n name: 'bento-modal',\n components: { BentoModalDefault, BentoModalDialog },\n inheritAttrs: false,\n props: {\n /\n Choose between default or dialog versions of modal\n /\n variant: {\n type: String as PropType<BentoModalVariant>,\n default: BentoModalVariant.DEFAULT,\n },\n\n // Shared Modal Default and Modal Default props\n /\n If set to true, it allows the modal to be closed by clicking outside of it\n /\n isDismissible: {\n type: Boolean,\n default: null,\n },\n /\n If set to true, it will set overflow:visible to the modal, only recommended to be used with dropdown\n /\n overflowVisible: {\n type: Boolean,\n default: false,\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: false,\n },\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 `title`: Button's text.\n \n `event`: Event triggered when clicking the Button.\n \n `icon`: Vue Icon from the library `@adyen/ui-assets-icons-16`.\n \n ```\n * [{\n * title: 'Primary',2\n * event: () => { ... },\n * icon: FourPeopleIcon\n * }, {\n * title: 'Secondary',\n * event: () => { ... }\n * }]\n * ```\n /\n actions: {\n type: Array as PropType<BentoButtonActionsList>,\n default: null,\n },\n\n // Specific to Modal Default props\n /\n Hides a cross icon on the right side of the title\n /\n hideCloseButton: {\n type: Boolean,\n default: false,\n },\n /\n Sets the width of the modal\n /\n size: {\n type: String as PropType<BentoModalSize>,\n default: BentoModalSize.SMALL,\n },\n /\n If provided, manages the padding of the whole modal container\n /\n customPadding: {\n type: String,\n default: null,\n },\n /\n If provided, renders the modal's content in a two-column layout an wth dividers separating its content\n /\n withColumnLayout: {\n type: Boolean,\n default: false,\n },\n\n /\n If a column layout is provided, it renders the respective left column width variant. This can be smaller than the second column, the same size as the second column or bigger than the second column.\n /\n columnsSize: {\n type: String as PropType<BentoModalColumnLayoutVariant>,\n default: BentoModalColumnLayoutVariant.SMALLER,\n },\n\n /\n Text label that is displayed left to the action buttons\n /\n actionsLabel: {\n type: String,\n default: null,\n },\n /\n If passed - sets first button color to red\n /\n destructiveActions: {\n type: Boolean,\n default: false,\n },\n\n // Specific to Modal dialog props\n /\n Changes the visual styling of action buttons\n /\n dialogType: {\n type: String as PropType<BentoModalDialogType>,\n default: BentoModalDialogType.CONFIRMATION,\n },\n /\n Text that will be displayed in the content section of Modal\n */\n content: {\n type: String,\n default: null,\n },\n },\n emits: [BentoModalEvent.CLOSE_MODAL],\n setup(props, { slots, emit }) {\n const {\n variant,\n hideCloseButton,\n size,\n isDismissible,\n overflowVisible,\n dialogType,\n content,\n customPadding,\n actionsLabel,\n destructiveActions,\n withColumnLayout,\n } = toRefs(props);\n\n const customProps = computed(() =>\n variant.value === BentoModalVariant.DEFAULT\n ? {\n hideCloseButton: hideCloseButton.value,\n size: size.value,\n customPadding: customPadding.value,\n actionsLabel: actionsLabel.value,\n destructiveActions: destructiveActions.value,\n isDismissible: isDismissible.value ?? true,\n overflowVisible: overflowVisible.value,\n withColumnLayout: withColumnLayout.value,\n }\n : {\n dialogType: dialogType.value,\n content: content.value,\n isDismissible: isDismissible.value ?? false,\n overflowVisible: overflowVisible.value,\n }\n );\n\n const onCloseModal = () => {\n emit(BentoModalEvent.CLOSE_MODAL);\n };\n\n return {\n onCloseModal,\n customProps,\n hasSlot: hasSlot(slots),\n };\n },\n });\n</script>\n"],"names":["BentoModalVariant","BentoModalVariant2","BentoModalSize","BentoModalSize2","BentoModalColumnLayoutVariant","BentoModalColumnLayoutVariant2","BentoModalRole","BentoModalRole2","BentoModalDialogType","BentoModalDialogType2","BentoModalEvent","BentoModalEvent2","_sfc_main$3","defineComponent","messages$1","CrossIcon","BentoTypography","BentoButton","BentoDivider","BentoFocusTrap","GridLayout","props","slots","emit","t","useI18n","modal","ref","isOpen","customPadding","overflowVisible","toRefs","labelSlot","computed","hasSlot","getSlotText","customPaddingStyles","xPadding","content","computedAriaLabel","useAriaLabel","hasColumnLayout","openModal","emitCloseEvent","closeModal","onCloseButtonClick","closeModalOnClickOutside","target","modalConditionalClasses","modalContentConditionalClasses","computedColumnWidth","watch","onMounted","BentoButtonVariant","BentoTypographyElement","BentoTypographyVariant","GridLayoutContainerType","_hoisted_2","_hoisted_4","createElementVNode","_ctx","normalizeClass","_cache","$event","withCtx","_hoisted_3","openBlock","createElementBlock","normalizeStyle","createVNode","_component_bento_typography","renderSlot","createCommentVNode","createBlock","_component_bento_button","_component_grid_layout","_hoisted_5","_sfc_main$2","BaseModal","BentoButtonActions","actions","destructiveActions","alignedActions","rightAlignedButtons","onCloseModal","BentoButtonActionsLayout","createSlots","_component_bento_button_actions","_sfc_main$1","messages","dialogType","onCloseActionButton","acknowledgementDialogActions","dialogActions","mandatoryCancelActionButton","updatedPassedActionsObject","_a","modalDialogConditionalClasses","_b","_component_base_modal","_sfc_main","BentoModalDefault","BentoModalDialog","variant","hideCloseButton","size","isDismissible","actionsLabel","withColumnLayout","customProps","resolveDynamicComponent","mergeProps"],"mappings":";;;;;;;;;;;;;;AAAY,IAAAA,IAAA,kBAAAC,OACRA,EAAA,UAAA,qBACAA,EAAA,SAAA,oBAFQA,IAAAD,KAAA,CAAA,CAAA,GAKAE,IAAA,kBAAAC,OACRA,EAAA,QAAA,SACAA,EAAA,SAAA,UACAA,EAAA,QAAA,SAHQA,IAAAD,KAAA,CAAA,CAAA,GAMAE,IAAA,kBAAAC,OACRA,EAAA,UAAA,WACAA,EAAA,QAAA,SACAA,EAAA,SAAA,UAHQA,IAAAD,KAAA,CAAA,CAAA,GAMAE,IAAA,kBAAAC,OACRA,EAAA,SAAA,UACAA,EAAA,eAAA,eAFQA,IAAAD,KAAA,CAAA,CAAA,GAKAE,IAAA,kBAAAC,OACRA,EAAA,eAAA,gBACAA,EAAA,cAAA,eACAA,EAAA,OAAA,QACAA,EAAA,kBAAA,mBAJQA,IAAAD,KAAA,CAAA,CAAA,GAOAE,IAAA,kBAAAC,OACRA,EAAA,cAAA,eADQA,IAAAD,KAAA,CAAA,CAAA;;;;;GCgFRE,KAAAC,EAAA;AAAA,EAA+B,MAAA,EAAA,UAAAC,EAAA;AAAA,EACV,MAAA;AAAA,EACX,YAAA,EAAA,WAAAC,IAAA,iBAAAC,GAAA,aAAAC,IAAA,cAAAC,IAAA,gBAAAC,IAAA,YAAAC,GAAA;AAAA,EAC0F,OAAA;AAAA;AAAA;AAAA;AAAA,IACzF,WAAA;AAAA,MAIQ,MAAA;AAAA,MACD,SAAAd,EAAA;AAAA,IACkB;AAAA;AAAA;AAAA;AAAA,IAC5B,eAAA;AAAA,MAIe,MAAA;AAAA,MACL,UAAA;AAAA,IACI;AAAA;AAAA;AAAA;AAAA,IACd,iBAAA;AAAA,MAIiB,MAAA;AAAA,MACP,UAAA;AAAA,IACI;AAAA;AAAA;AAAA;AAAA,IACd,eAAA;AAAA,MAIe,MAAA;AAAA,MACL,SAAA;AAAA,IACG;AAAA;AAAA;AAAA;AAAA,IACb,kBAAA;AAAA,MAIkB,MAAA;AAAA,MACR,SAAA;AAAA,IACG;AAAA;AAAA;AAAA;AAAA,IACb,aAAA;AAAA,MAKa,MAAA;AAAA,MACH,SAAAF,EAAA;AAAA,IACiC;AAAA;AAAA;AAAA;AAAA,IAC3C,QAAA;AAAA,MAKQ,MAAA;AAAA,MACE,UAAA;AAAA,IACI;AAAA;AAAA;AAAA;AAAA,IACd,MAAA;AAAA,MAKM,MAAA;AAAA,MACI,SAAAF,EAAA;AAAA,IACkB;AAAA;AAAA;AAAA;AAAA,IAC5B,eAAA;AAAA,MAKe,MAAA;AAAA,MACL,SAAA;AAAA,IACG;AAAA,IACb,iBAAA;AAAA,MACiB,MAAA;AAAA,MACP,SAAA;AAAA,IACG;AAAA,EACb;AAAA,EACJ,OAAA,CAAAQ,EAAA,WAAA;AAAA,EACmC,MAAAW,GAAA,EAAA,OAAAC,GAAA,MAAAC,EAAA,GAAA;AAE/B,UAAA,EAAA,GAAAC,EAAA,IAAAC,EAAA,EAAA,UAAAX,EAAA,CAAA,GACAY,IAAAC,GAAA,IAAA,GAEA,EAAA,QAAAC,GAAA,eAAAC,GAAA,iBAAAC,EAAA,IAAAC,EAAAV,CAAA,GAEAW,IAAAC;AAAA,MAAkB,MAAAC,EAAAZ,CAAA,EAAA,SAAA,KAAAA,EAAA,QAAA,IAAAa,GAAAb,CAAA,EAAA,SAAA,IAAA;AAAA,IACiE,GAGnFc,IAAAH,EAAA,MAAA;AACI,UAAA,CAAAJ,EAAA;AACI,eAAA,CAAA;AAGJ,YAAAQ,IAAA;AAAA,QAAiB,aAAAR,EAAA;AAAA,QACc,cAAAA,EAAA;AAAA,MACC,GAGhCS,IAAA,EAAA,GAAAD,GAAA,YAAA,QAAA,eAAA,OAAA;AAEA,aAAAH,EAAAZ,CAAA,EAAA,SAAA,MACIgB,EAAA,aAAAT,EAAA,QAGJK,EAAAZ,CAAA,EAAA,SAAA,MACIgB,EAAA,gBAAAT,EAAA,QAGJ;AAAA,QAAO,QAAA,EAAA,GAAAQ,GAAA,YAAAR,EAAA,MAAA;AAAA,QACoD,SAAAS;AAAA,QACvD,SAAA,EAAA,GAAAD,GAAA,eAAAR,EAAA,MAAA;AAAA,MAC2D;AAAA,IAC/D,CAAA,GAGJU,IAAAC,GAAA;AAAA,MAAuC,OAAAR;AAAA,MAC5B,iBAAAR,EAAA,mBAAA;AAAA,IAC+B,CAAA,GAG1CiB,IAAAR,EAAA,MAAAZ,EAAA,oBAAAA,EAAA,SAAAnB,EAAA,KAAA,GAEAwC,IAAA,MAAA;AACI,MAAAhB,EAAA,MAAA,UAAA;AAAA,IAAsB,GAG1BiB,IAAA,MAAA;AACI,MAAApB,EAAAb,EAAA,WAAA;AAAA,IAAgC,GAGpCkC,IAAA,MAAA;AACI,MAAAlB,EAAA,MAAA,MAAA,GACAiB,EAAA;AAAA,IAAe,GAGnBE,IAAA,MAAA;AACI,MAAAD,EAAA;AAAA,IAAW,GAOfE,KAAA,CAAA,EAAA,QAAAC,EAAA,MAAA;AACI,MAAAA,KAAAA,EAAA,YAAAzC,EAAA,OAAA,YAAA,KACIsC,EAAA;AAAA,IACJ,GAGJI,KAAAf,EAAA,OAAA;AAAA,MAAgD,CAAA,4BAAAZ,EAAA,MAAA,GAAAA,EAAA;AAAA,MACM,CAAA,kCAAA,GAAAO,EAAA;AAAA,MACL,CAAA,2CAAA,GAAAE,EAAA;AAAA,MACkB,CAAA,wCAAA,GAAAW,EAAA;AAAA,IACH,EAAA,GAGhEQ,KAAAhB,EAAA,OAAA;AAAA,MAAuD,wCAAAQ,EAAA;AAAA,MACK,sCAAAP,EAAAZ,CAAA,EAAA,SAAA;AAAA,MACM,uCAAAY,EAAAZ,CAAA,EAAA,SAAA;AAAA,IACC,EAAA,GAGnE4B,KAAAjB,EAAA,MACIZ,EAAA,gBAAAjB,EAAA,UACI,CAAA,EAAA,OAAA,GAAA,QAAA,GAAA,OAAA,EAAA,CAAA,IAEJiB,EAAA,gBAAAjB,EAAA,SACI,CAAA,EAAA,OAAA,GAAA,QAAA,GAAA,OAAA,EAAA,CAAA,IAEJ,CAAA,EAAA,OAAA,GAAA,QAAA,GAAA,OAAA,EAAA,CAAA,CAAyC;AAG7C,WAAA+C;AAAA,MAAA,MAAA,CAAAvB,EAAA,OAAAF,EAAA,KAAA;AAAA,MACoC,MAAA;AAE5B,QAAAE,EAAA,SAAAF,EAAA,QACIgB,EAAA,IAAUhB,EAAA,SAEVkB,EAAA;AAAA,MACJ;AAAA,MACJ,EAAA,WAAA,GAAA;AAAA,IACkB,GAGtBQ,EAAA,MAAA;AACI,MAAAxB,EAAA,SAAAF,EAAA,SACIgB,EAAA;AAAA,IACJ,CAAA,GAGJ;AAAA;AAAA,MAAO,OAAAhB;AAAA,MAEH,mBAAAa;AAAA;AAAA,MACA,WAAAG;AAAA,MAGA,0BAAAI;AAAA;AAAA,MACA,oBAAAD;AAAA,MAGA,SAAAX,EAAAZ,CAAA;AAAA,MACsB,gBAAAqB;AAAA;AAAA,MACtB,yBAAAK;AAAA,MAGA,gCAAAC;AAAA,MACA,qBAAAb;AAAA,MACA,iBAAAK;AAAA,MACA,qBAAAS;AAAA;AAAA,MACA,oBAAAG;AAAA,MAGA,wBAAAC;AAAA,MACA,wBAAAC;AAAA,MACA,yBAAAC;AAAA,IACA;AAAA,EACJ;AAER,CAAA;sCApT+BC,KAAA,CAAA,QAAA,cAAA,MAAA,4CAwDNC,KAAA,EAAA,OAAA,uBAAA;EAAiC,cAAA;AAAA;;;;;IAxEvCC,EAAA,UAAA;AAAA,MACK,KAAA;AAAA,MACf,MAAAC,EAAA;AAAA,MACI,cAAAA,EAAA;AAAA,MAEE,OAAAC,EAAA,CAAA,2BAAAD,EAAA,uBAAA,CAAA;AAAA,MACkB,MAAAA,EAAA;AAAA,MACjB,SAAAE,EAAA,CAAA,MAAAA,EAAA,CAAA,IAAA,CAAAC,MAAAH,EAAA,iBAAAA,EAAA,yBAAAG,CAAA;AAAA;IAsEW,GAAA;AAAA;QADT,SAAAC,EAAA,MAAA;AAAA,UAhEeL,EAAA,OAAAM,IAAA;AAAA,YADjBL,EAAA,QAAA,SAAA,KAAA,CAAAA,EAAA,mBAAAM,EAAA,GAAAC,EAAA,OAAA;AAAA,cAE0C,KAAA;AAAA,cAChC,OAAA;AAAA,cAEN,OAAAC,EAAAR,EAAA,oBAAA,MAAA;AAAA,YAmBM,GAAA;AAAA;gBAjB6BS,EAAAC,GAAA;AAAA,kBACE,OAAA;AAAA,kBACxB,cAAA;AAAA,kBACK,IAAAV,EAAA,uBAAA;AAAA,kBACF,SAAAA,EAAA,uBAAA;AAAA;;;oBAE0BA,EAAA,QAAA,SAAA,IAAAW,EAAAX,EAAA,QAAA,WAAA,EAAA,KAAA,EAAA,GAAA,QAAA,EAAA,IAAAY,EAAA,IAAA,EAAA;AAAA;kBAG3B,GAAA;AAAA,gBAAA,GAAA,GAAA,CAAA,MAAA,SAAA,CAAA;AAAA,gBADXZ,EAAA,+BAAAM,EAAA,GAAAO,EAAAC,GAAA;AAAA,kBAEsC,KAAA;AAAA,kBACjC,OAAA;AAAA,kBACI,SAAAd,EAAA,mBAAA;AAAA,kBACqB,MAAA;AAAA;;;;;;;cAME,CAAA;AAAA;gBAA+B,KAAA;AAAA;;YAGvE,GAAA,CAAA,KAAAY,EAAA,IAAA,EAAA;AAAA,YACUb,EAAA,OAAA;AAAA,cAEE,OAAAE,EAAA,CAAA,yBAAAD,EAAA,8BAAA,CAAA;AAAA;YAGS,GAAA;AAAA,cACbA,EAAA,QAAA,SAAA,KAAAM,EAAA,GAAAO,EAAAH,GAAA;AAAA,gBAA+B,KAAA;AAAA,gBAC1B,cAAA;AAAA,gBACK,IAAAV,EAAA,uBAAA;AAAA,gBACF,SAAAA,EAAA,uBAAA;AAAA;;gBAER,SAAAI,EAAA,MAAA;AAAA,kBAAAJ,EAAA,mBAAAM,EAAA,GAAAO,EAAAE,GAAA;AAAA,oBAEsC,KAAA;AAAA,oBACjC,gBAAAf,EAAA;AAAA,oBACK,kBAAAA,EAAA,wBAAA;AAAA;kBAEU,GAAA;AAAA;sBACLW,EAAAX,EAAA,QAAA,iBAAA,CAAA,GAAA,QAAA,EAAA;AAAA,oBAAwC,CAAA;AAAA;;;oBAEvD,GAAA;AAAA,kBAAA,GAAA,GAAA,CAAA,gBAAA,gBAAA,CAAA,KAAAW,EAAAX,EAAA,QAAA,WAAA,EAAA,KAAA,EAAA,GAAA,QAAA,EAAA;AAAA;;;YAKS,GAAA,CAAA;AAAA;cAC0B,KAAA;AAAA,cACjC,OAAA;AAAA;YAE8B,GAAA;AAAA;gBAA+B,KAAA;AAAA;cAEnE,CAAA,KAAAY,EAAA,IAAA,EAAA;AAAA,cAC2Bb,EAAA,OAAAiB,IAAA;AAAA;;;;;;;;;;qFCf/CC,KAAAhE,EAAA;AAAA,EAA+B,MAAA;AAAA,EACrB,YAAA,EAAA,WAAAiE,GAAA,oBAAAC,GAAA,iBAAA/D,EAAA;AAAA,EACuD,cAAA;AAAA,EAC/C,OAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IACP,QAAA;AAAA,MAOK,MAAA;AAAA,MACE,UAAA;AAAA,IACI;AAAA;AAAA;AAAA;AAAA,IACd,eAAA;AAAA,MAIe,MAAA;AAAA,MACL,UAAA;AAAA,IACI;AAAA;AAAA;AAAA;AAAA,IACd,iBAAA;AAAA,MAIiB,MAAA;AAAA,MACP,SAAA;AAAA,IACG;AAAA;AAAA;AAAA;AAAA,IACb,iBAAA;AAAA,MAIiB,MAAA;AAAA,MACP,SAAA;AAAA,IACG;AAAA;AAAA;AAAA;AAAA,IACb,MAAA;AAAA,MAIM,MAAA;AAAA,MACI,UAAA;AAAA,IACI;AAAA;AAAA;AAAA;AAAA,IACd,eAAA;AAAA,MAIe,MAAA;AAAA,MACL,SAAA;AAAA,IACG;AAAA;AAAA;AAAA;AAAA,IACb,kBAAA;AAAA,MAKkB,MAAA;AAAA,MACR,SAAA;AAAA,IACG;AAAA;AAAA;AAAA;AAAA,IACb,aAAA;AAAA,MAKa,MAAA;AAAA,MACH,SAAAZ,EAAA;AAAA,IACiC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAC3C,SAAA;AAAA,MA8BS,MAAA;AAAA,MACC,SAAA;AAAA,IACG;AAAA;AAAA;AAAA;AAAA,IACb,cAAA;AAAA,MAIc,MAAA;AAAA,MACJ,SAAA;AAAA,IACG;AAAA;AAAA;AAAA;AAAA,IACb,oBAAA;AAAA,MAIoB,MAAA;AAAA,MACV,SAAA;AAAA,IACG;AAAA;AAAA;AAAA;AAAA,IACb,eAAA;AAAA,MAKe,MAAA;AAAA,MACL,SAAA;AAAA,IACG;AAAA,EACb;AAAA,EACJ,OAAA,CAAAM,EAAA,WAAA;AAAA,EACmC,MAAAW,GAAA,EAAA,OAAAC,GAAA,MAAAC,EAAA,GAAA;AAE/B,UAAA,EAAA,SAAAyD,GAAA,oBAAAC,EAAA,IAAAlD,EAAAV,CAAA,GAEA6D,IAAAjD,EAAA,MAAA;AACI,YAAAkD,IAAAH,EAAA,MAAA,SAAA,IAAAA,EAAA,QAAAA,EAAA,MAAA,MAAA,GAAAA,EAAA,MAAA,SAAA,CAAA;AAGA,aAAAC,EAAA,UAEIE,EAAA,CAAA,EAAA,WAAA,KAGJ;AAAA,QAAO,aAAAH,EAAA,MAAA,WAAA,IAAA;AAAA,UAGO;AAAA,YACI,GAAAA,EAAA,MAAAA,EAAA,MAAA,SAAA,CAAA;AAAA,YAC6C,SAAA3B,EAAA;AAAA,UACb;AAAA,QAChC,IAAA;AAAA,QAEJ,cAAA8B;AAAA,MACI;AAAA,IAClB,CAAA,GAGJC,IAAA,MAAA;AACI,MAAA7D,EAAAb,EAAA,WAAA;AAAA,IAAgC;AAGpC,WAAA0C,EAAA,MAAA;AACI,UAAA,EAAAlB,EAAAZ,CAAA,EAAA,SAAA,KAAAY,EAAAZ,CAAA,EAAA,eAAA,KAAAY,EAAAZ,CAAA,EAAA,eAAA;AAGI,cAAA,IAAA,MAAA,mEAAA;AAGJ,UAAAD,EAAA,WAAAA,EAAA,QAAA,SAAA;AACI,cAAA,IAAA,MAAA,+EAAA;AAGJ,UAAAA,EAAA,gBAAAA,EAAA,WAAAA,EAAA,QAAA,SAAA;AACI,cAAA,IAAA;AAAA,UAAU;AAAA,QACN;AAAA,IAER,CAAA,GAGJ;AAAA;AAAA,MAAO,gBAAA6D;AAAA;AAAA,MAEH,cAAAE;AAAA,MAGA,SAAAlD,EAAAZ,CAAA;AAAA;AAAA,MACsB,0BAAA+D;AAAA,MAGtB,wBAAA/B;AAAA,MACA,wBAAAC;AAAA,IACA;AAAA,EACJ;AAER,CAAA;;;;IAnPe,OAAA;AAAA,IACV,MAAAK,EAAA;AAAA,IACA,qBAAAA,EAAA;AAAA,IACgB,kBAAAA,EAAA;AAAA,IACD,kBAAAA,EAAA;AAAA,IACG,WAAAA,EAAA;AAAA,IAClB,oBAAAA,EAAA;AAAA,IACgB,sBAAAA,EAAA;AAAA,IACH,kBAAAA,EAAA;AAAA;EAKU,GAAA0B,EAAA;AAAA,IAAmC,iBAAAtB,EAAA,MAAA;AAAA,MAChDO,EAAAX,EAAA,QAAA,eAAA;AAAA,IAAgD,CAAA;AAAA;MAChDW,EAAAX,EAAA,QAAA,eAAA;AAAA,IAAoC,CAAA;AAAA;;;IAL/B,GAAA;AAAA,EAAA,GAAA;AAAA;MACZ,MAAA;AAAA,MAAA,IAAAI,EAAA,MAAA;AAAA;;;IAMY,IAAA;AAAA;MACZ,MAAA;AAAA,MAAA,IAAAA,EAAA,MAAA;AAAA,QAEcO,EAAAX,EAAA,QAAA,WAAA,CAAA,GAAA,MAAA;AAAA,UAQSA,EAAA,gBAAAM,EAAA,GAAAO,EAAAH,GAAA;AAAA,YAPY,KAAA;AAAA,YAC3B,OAAA;AAAA,YACK,cAAA;AAAA,YACK,IAAAV,EAAA,uBAAA;AAAA,YACF,SAAAA,EAAA,uBAAA;AAAA;;;;;;UAMF,GAAA,GAAA,CAAA,MAAA,SAAA,CAAA,KAAAY,EAAA,IAAA,EAAA;AAAA,UAGcZ,EAAA,eAAA,eAAAM,EAAA,GAAAO,EAAAc,GAAA;AAAA,YAFgB,KAAA;AAAA,YACnC,SAAA3B,EAAA,eAAA;AAAA;;UAIwBS,EAAAkB,GAAA;AAAA,YACS,SAAA3B,EAAA,eAAA;AAAA;;;;;;;;;;;;GCiBlD4B,KAAA3E,EAAA;AAAA,EAA+B,MAAA,EAAA,UAAA4E,EAAA;AAAA,EACV,MAAA;AAAA,EACX,YAAA,EAAA,WAAAX,GAAA,oBAAAC,EAAA;AAAA,EACsC,cAAA;AAAA,EAC9B,OAAA;AAAA;AAAA;AAAA;AAAA,IACP,QAAA;AAAA,MAIK,MAAA;AAAA,MACE,UAAA;AAAA,IACI;AAAA;AAAA;AAAA;AAAA,IACd,eAAA;AAAA,MAIe,MAAA;AAAA,MACL,UAAA;AAAA,IACI;AAAA;AAAA;AAAA;AAAA,IACd,iBAAA;AAAA,MAIiB,MAAA;AAAA,MACP,SAAA;AAAA,IACG;AAAA;AAAA;AAAA;AAAA,IACb,YAAA;AAAA,MAIY,MAAA;AAAA,MACF,UAAA;AAAA,IACI;AAAA;AAAA;AAAA;AAAA,IACd,SAAA;AAAA,MAIS,MAAA;AAAA,MACC,UAAA;AAAA,IACI;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IACd,SAAA;AAAA,MAsBS,MAAA;AAAA,MACC,SAAA;AAAA,IACG;AAAA;AAAA;AAAA;AAAA,IACb,eAAA;AAAA,MAKe,MAAA;AAAA,MACL,SAAA;AAAA,IACG;AAAA,EACb;AAAA,EACJ,OAAA,CAAArE,EAAA,WAAA;AAAA,EACmC,MAAAW,GAAA,EAAA,OAAAC,GAAA,MAAAC,EAAA,GAAA;AAE/B,UAAA,EAAA,GAAAC,EAAA,IAAAC,EAAA,EAAA,UAAAgE,EAAA,CAAA,GACA,EAAA,SAAAT,GAAA,YAAAU,EAAA,IAAA3D,EAAAV,CAAA,GAEA+D,IAAA,MAAA;AACI,MAAA7D,EAAAb,EAAA,WAAA;AAAA,IAAgC,GAGpCiF,IAAA,MAAA;AACI,MAAAP,EAAA;AAAA,IAAa,GAGjBQ,IAAA3D,EAAA,MAAA;AAAA,MAAoD;AAAA,QAChD,OAAAT,EAAA,cAAA;AAAA,QAC2B,OAAAmE;AAAA,QAChB,SAAAtC,EAAA;AAAA,MACqB;AAAA,IAChC,CAAA,GAGJwC,IAAA5D,EAAA,MAAA;;AACI,YAAA6D,IAAA;AAAA,QAA6D,OAAA;AAAA,QAClD,OAAAH;AAAA,MACA,GAEXI,KAAAC,IAAAhB,KAAA,gBAAAA,EAAA,UAAA,gBAAAgB,EAAA;AAEA,aAAAN,EAAA,UAAAlF,EAAA,cACIuF,EAAA,WAAA,KAAsCL,EAAA,UAAAlF,EAAA,SAEtCuF,EAAA,UAAA1C,EAAA,YAGJ,CAAA0C,GAAAD,CAAA;AAAA,IAA+D,CAAA,GAGnEG,IAAAhE,EAAA,OAAA;AAAA,MAAsD,CAAA,mBAAAyD,EAAA,OAAA,GAAAA,EAAA;AAAA,IACE,EAAA;AAGxD,WAAAtC,EAAA,MAAA;;AACI,UAAA,CAAAlB,EAAAZ,CAAA,EAAA,SAAA,KAAA,CAAAD,EAAA;AACI,cAAA,IAAA,MAAA,sDAAA;AAGJ,YAAA2E,IAAAhB,KAAA,gBAAAA,EAAA,UAAA,gBAAAgB,EAAA,UAAA;AACI,cAAA,IAAA,MAAA,+DAAA;AAGJ,UAAAN,EAAA,UAAAlF,EAAA,mBAAA,EAAAwE,KAAA,QAAAA,EAAA;AACI,cAAA,IAAA;AAAA,UAAU;AAAA,QACN;AAIR,UAAAU,EAAA,UAAAlF,EAAA,qBAAA0F,IAAAlB,KAAA,gBAAAA,EAAA,UAAA,QAAAkB,EAAA;AACI,cAAA,IAAA,MAAA,6DAAA;AAAA,IACJ,CAAA,GAGJ;AAAA;AAAA,MAAO,eAAAL;AAAA,MAEH,8BAAAD;AAAA;AAAA,MACA,cAAAR;AAAA,MAGA,qBAAAO;AAAA;AAAA,MACA,+BAAAM;AAAA;AAAA,MAGA,gBAAA3F;AAAA,MAGA,gBAAAJ;AAAA,MACA,oBAAAmD;AAAA,MACA,sBAAA7C;AAAA,MACA,0BAAA6E;AAAA,IACA;AAAA,EACJ;AAER,CAAA;;;AAlNK,SAAAnB,EAAA,GAAAO,EAAA0B,GAAA;AAAA,IAAuB,OAAAtC,EAAA,CAAA,kBAAAD,EAAA,6BAAA,CAAA;AAAA,IACG,qBAAA;AAAA,IACV,MAAAA,EAAA,eAAA;AAAA,IACD,kBAAAA,EAAA;AAAA,IACG,WAAAA,EAAA;AAAA,IACN,oBAAAA,EAAA;AAAA,IACI,cAAAA,EAAA,eAAA;AAAA,IACS,kBAAAA,EAAA;AAAA,IAEf,cAAAA,EAAA;AAAA,EACM,GAAA;AAAA;MAENW,EAAAX,EAAA,QAAA,SAAA;AAAA,IACM,CAAA;AAAA;;IAQW,CAAA;AAAA,IAJxB,SAAAI,EAAA,MAAA;AAAA,MAAAJ,EAAA,eAAAA,EAAA,qBAAA,mBAAAM,EAAA,GAAAO,EAAAc,GAAA;AAAA,QAE0C,KAAA;AAAA,QACrC,SAAA3B,EAAA;AAAA;MAOmB,GAAA,MAAA,GAAA,CAAA,WAAA,QAAA,CAAA,MAAAM,EAAA,GAAAO,EAAAc,GAAA;AAAA,QAFG,KAAA;AAAA,QACtB,SAAA3B,EAAA;AAAA;;;;;;oDCmBbwC,KAAAvF,EAAA;AAAA,EAA+B,MAAA;AAAA,EACrB,YAAA,EAAA,mBAAAwF,IAAA,kBAAAC,GAAA;AAAA,EAC4C,cAAA;AAAA,EACpC,OAAA;AAAA;AAAA;AAAA;AAAA,IACP,SAAA;AAAA,MAIM,MAAA;AAAA,MACC,SAAAtG,EAAA;AAAA,IACqB;AAAA;AAAA;AAAA;AAAA;AAAA,IAC/B,eAAA;AAAA,MAMe,MAAA;AAAA,MACL,SAAA;AAAA,IACG;AAAA;AAAA;AAAA;AAAA,IACb,iBAAA;AAAA,MAIiB,MAAA;AAAA,MACP,SAAA;AAAA,IACG;AAAA;AAAA;AAAA;AAAA,IACb,QAAA;AAAA,MAIQ,MAAA;AAAA,MACE,SAAA;AAAA,IACG;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IACb,SAAA;AAAA,MA0BS,MAAA;AAAA,MACC,SAAA;AAAA,IACG;AAAA;AAAA;AAAA;AAAA;AAAA,IACb,iBAAA;AAAA,MAMiB,MAAA;AAAA,MACP,SAAA;AAAA,IACG;AAAA;AAAA;AAAA;AAAA,IACb,MAAA;AAAA,MAIM,MAAA;AAAA,MACI,SAAAE,EAAA;AAAA,IACkB;AAAA;AAAA;AAAA;AAAA,IAC5B,eAAA;AAAA,MAIe,MAAA;AAAA,MACL,SAAA;AAAA,IACG;AAAA;AAAA;AAAA;AAAA,IACb,kBAAA;AAAA,MAIkB,MAAA;AAAA,MACR,SAAA;AAAA,IACG;AAAA;AAAA;AAAA;AAAA,IACb,aAAA;AAAA,MAKa,MAAA;AAAA,MACH,SAAAE,EAAA;AAAA,IACiC;AAAA;AAAA;AAAA;AAAA,IAC3C,cAAA;AAAA,MAKc,MAAA;AAAA,MACJ,SAAA;AAAA,IACG;AAAA;AAAA;AAAA;AAAA,IACb,oBAAA;AAAA,MAIoB,MAAA;AAAA,MACV,SAAA;AAAA,IACG;AAAA;AAAA;AAAA;AAAA;AAAA,IACb,YAAA;AAAA,MAMY,MAAA;AAAA,MACF,SAAAI,EAAA;AAAA,IACwB;AAAA;AAAA;AAAA;AAAA,IAClC,SAAA;AAAA,MAIS,MAAA;AAAA,MACC,SAAA;AAAA,IACG;AAAA,EACb;AAAA,EACJ,OAAA,CAAAE,EAAA,WAAA;AAAA,EACmC,MAAAW,GAAA,EAAA,OAAAC,GAAA,MAAAC,EAAA,GAAA;AAE/B,UAAA;AAAA,MAAM,SAAAgF;AAAA,MACF,iBAAAC;AAAA,MACA,MAAAC;AAAA,MACA,eAAAC;AAAA,MACA,iBAAA5E;AAAA,MACA,YAAA4D;AAAA,MACA,SAAApD;AAAA,MACA,eAAAT;AAAA,MACA,cAAA8E;AAAA,MACA,oBAAA1B;AAAA,MACA,kBAAA2B;AAAA,IACA,IAAA7E,EAAAV,CAAA,GAGJwF,IAAA5E;AAAA,MAAoB,MAAAsE,EAAA,UAAAvG,EAAA,UAAA;AAAA,QAEV,iBAAAwG,EAAA;AAAA,QACqC,MAAAC,EAAA;AAAA,QACtB,eAAA5E,EAAA;AAAA,QACkB,cAAA8E,EAAA;AAAA,QACF,oBAAA1B,EAAA;AAAA,QACY,eAAAyB,EAAA,SAAA;AAAA,QACD,iBAAA5E,EAAA;AAAA,QACL,kBAAA8E,EAAA;AAAA,MACE,IAAA;AAAA,QAEvC,YAAAlB,EAAA;AAAA,QAC2B,SAAApD,EAAA;AAAA,QACN,eAAAoE,EAAA,SAAA;AAAA,QACqB,iBAAA5E,EAAA;AAAA,MACL;AAAA,IACrC;AAOV,WAAA;AAAA,MAAO,cAJP,MAAA;AACI,QAAAP,EAAAb,EAAA,WAAA;AAAA,MAAgC;AAAA,MAIhC,aAAAmG;AAAA,MACA,SAAA3E,EAAAZ,CAAA;AAAA,IACsB;AAAA,EAC1B;AAER,CAAA;;AAjOK,SAAA4C,EAAA,GAAAO,EAAAqC,GAAAlD,EAAA,OAAA,GAAAmD,GAAA;AAAA,IAAe,OAAA;AAAA,IACR,WAAAnD,EAAA;AAAA,IACA,SAAAA,EAAA;AAAA,EAGe,GAAAA,EAAA,aAAA,EAAA,cAAAA,EAAA,aAAA,CAAA,GAAA0B,EAAA,EAAA,GAAA,EAAA,GAAA;AAAA;MACnB,MAAA;AAAA,MAAA,IAAAtB,EAAA,MAAA;AAAA;;;IAEY,IAAA;AAAA;MAAyC,MAAA;AAAA,MAAA,IAAAA,EAAA,MAAA;AAAA;;;IACzC,IAAA;AAAA;MAAyC,MAAA;AAAA,MAAA,IAAAA,EAAA,MAAA;AAAA;;;IACzC,IAAA;AAAA;MAA6B,MAAA;AAAA,MAAA,IAAAA,EAAA,MAAA;AAAA;;;;;;;"}
1	+ {"version":3,"file":"modal.js","sources":["../../vue2/src/components/modal/modal.types.ts","../../vue2/src/components/modal/components/base-modal/base-modal.vue","../../vue2/src/components/internal/footer-actions/footer-actions.vue","../../vue2/src/components/modal/components/modal-default/modal-default.vue","../../vue2/src/components/modal/components/modal-dialog/modal-dialog.vue","../../vue2/src/components/modal/modal.vue"],"sourcesContent":["export enum BentoModalVariant {\n DEFAULT = 'BentoModalDefault',\n DIALOG = 'BentoModalDialog',\n}\n\nexport enum BentoModalSize {\n SMALL = 'small',\n MEDIUM = 'medium',\n LARGE = 'large',\n}\n\nexport enum BentoModalColumnLayoutVariant {\n SMALLER = 'smaller',\n EQUAL = 'equal',\n BIGGER = 'bigger',\n}\n\nexport enum BentoModalRole {\n DIALOG = 'dialog',\n ALERT_DIALOG = 'alertdialog',\n}\n\nexport enum BentoModalDialogType {\n CONFIRMATION = 'confirmation',\n DESTRUCTIVE = 'destructive',\n INFO = 'info',\n ACKNOWLEDGEMENT = 'acknowledgement',\n}\n\nexport enum BentoModalEvent {\n CLOSE_MODAL = 'close-modal',\n}\n","<template>\n <div class=\"b-modal-base\">\n <dialog\n ref=\"modal\"\n :role=\"modalRole\"\n :aria-label=\"computedAriaLabel\"\n class=\"b-modal-base__container\"\n :class=\"modalConditionalClasses\"\n :open=\"initiallyOpen\"\n @click=\"isDismissible && closeModalOnClickOutside($event)\"\n @keydown.esc=\"emitCloseEvent\"\n >\n <bento-focus-trap>\n <div class=\"b-modal-base__wrapper\">\n <div\n v-if=\"hasSlot('default') \|\| !hideCloseButton\"\n class=\"b-modal-base__header-container\"\n :style=\"customPaddingStyles.header\"\n >\n <div class=\"b-modal-base__header\">\n <bento-typography\n class=\"b-modal-base__title\"\n aria-label=\"base modal title\"\n :el=\"BentoTypographyElement.SPAN\"\n :variant=\"BentoTypographyVariant.TITLE\"\n stronger\n >\n <slot v-if=\"hasSlot('default')\" />\n </bento-typography>\n <bento-button\n v-if=\"!hideCloseButton\"\n class=\"b-modal-base__close-button\"\n :variant=\"BentoButtonVariant.TERTIARY\"\n type=\"button\"\n @click=\"onCloseButtonClick\"\n >\n <cross-icon svg-title=\"close\" />\n </bento-button>\n </div>\n\n <bento-divider v-if=\"hasColumnLayout\" class=\"b-modal-base__divider\" />\n </div>\n\n <div\n class=\"b-modal-base__content\"\n :class=\"modalContentConditionalClasses\"\n :style=\"customPaddingStyles.content\"\n >\n <bento-typography\n v-if=\"hasSlot('content')\"\n aria-label=\"base modal content\"\n :el=\"BentoTypographyElement.DIV\"\n :variant=\"BentoTypographyVariant.BODY\"\n stronger\n >\n <grid-layout\n v-if=\"hasColumnLayout\"\n :column-width=\"computedColumnWidth\"\n :container-type=\"GridLayoutContainerType.NORMAL\"\n class=\"b-modal-base__grid\"\n >\n <template #col-1><slot name=\"content-col-1\"></slot></template>\n <template #col-2><slot name=\"content-col-2\"></slot></template>\n </grid-layout>\n <slot v-else name=\"content\" />\n </bento-typography>\n </div>\n\n <div\n v-if=\"hasSlot('actions')\"\n class=\"b-modal-base__actions-container\"\n :style=\"customPaddingStyles.actions\"\n >\n <bento-divider v-if=\"hasColumnLayout\" class=\"b-modal-base__divider\" />\n\n <div aria-label=\"modal actions\" class=\"b-modal-base__actions\">\n <slot name=\"actions\" />\n </div>\n </div>\n </div>\n </bento-focus-trap>\n </dialog>\n </div>\n</template>\n\n<script lang=\"ts\">\n import { computed, defineComponent, onMounted, PropType, ref, toRefs, watch } from 'vue';\n import {\n BentoModalColumnLayoutVariant,\n BentoModalEvent,\n BentoModalRole,\n BentoModalSize,\n } from '@/components/modal/modal.types';\n\n import { BentoButtonVariant } from '@/core/components/button/button.types';\n import { BentoTypography, BentoTypographyElement, BentoTypographyVariant } from '@/components/typography';\n import { BentoButton } from '@/components/button';\n import { BentoDivider } from '@/components/divider';\n import { BentoFocusTrap } from '@/components/focus-trap';\n import { GridLayout, GridLayoutContainerType } from '@/internal';\n import { useHasSlot } from '@/composables';\n import { useAriaLabel } from '@/utils/ts/aria-label';\n import { useI18n } from '@/utils/ts/i18n';\n import { getSlotText } from '@/utils/ts/get-slot-text';\n import CrossIcon from '@adyen/ui-assets-icons-16/vue/cross';\n import messages from './messages.json';\n\n type MessageSchema = (typeof messages)['en-US'];\n\n export default defineComponent({\n i18n: { messages },\n name: 'base-modal',\n components: { CrossIcon, BentoTypography, BentoButton, BentoDivider, BentoFocusTrap, GridLayout },\n props: {\n /*\n Defines whether the modal will be an alert modal\n /\n modalRole: {\n type: String,\n default: BentoModalRole.DIALOG,\n },\n /\n If set to true, it allows the modal to be closed by clicking outside of it\n /\n isDismissible: {\n type: Boolean,\n required: true,\n },\n /\n Hides a cross icon on the right side of the title\n /\n hideCloseButton: {\n type: Boolean,\n required: true,\n },\n /\n If provided, manages the padding of the whole modal container\n /\n customPadding: {\n type: String,\n default: null,\n },\n /\n If provided, renders the modal's content in a two-column layout an wth dividers separating its content\n /\n withColumnLayout: {\n type: Boolean,\n default: false,\n },\n\n /\n If a column layout is provided, it renders the respective left column width variant. This can be smaller than the second column, the same size as the second column or bigger than the second column.\n /\n columnsSize: {\n type: String as PropType<BentoModalColumnLayoutVariant>,\n default: BentoModalColumnLayoutVariant.SMALLER,\n },\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 required: true,\n },\n\n /\n Sets the width of the modal\n /\n size: {\n type: String as PropType<BentoModalSize>,\n default: BentoModalSize.SMALL,\n },\n\n /\n Sets the open attribute on the dialog element, use isOpen instead to toggle modal visbility.\n /\n initiallyOpen: {\n type: Boolean,\n default: false,\n },\n overflowVisible: {\n type: Boolean,\n default: false,\n },\n },\n emits: [BentoModalEvent.CLOSE_MODAL],\n setup(props, { slots, emit }) {\n const { t } = useI18n<{ message: MessageSchema }>({ messages });\n const hasSlot = useHasSlot(slots);\n const modal = ref(null);\n\n const { isOpen, customPadding, overflowVisible } = toRefs(props);\n\n const labelSlot = computed((): string =>\n hasSlot('default') && slots.default() ? getSlotText(slots)('default') : null\n );\n\n const customPaddingStyles = computed(() => {\n if (!customPadding.value) {\n return {};\n }\n\n const xPadding = {\n paddingLeft: customPadding.value,\n paddingRight: customPadding.value,\n };\n\n const content = { ...xPadding, paddingTop: undefined, paddingBottom: undefined };\n\n if (!hasSlot('default')) {\n content.paddingTop = customPadding.value;\n }\n\n if (!hasSlot('actions')) {\n content.paddingBottom = customPadding.value;\n }\n\n return {\n header: { ...xPadding, paddingTop: customPadding.value },\n content,\n actions: { ...xPadding, paddingBottom: customPadding.value },\n };\n });\n\n const computedAriaLabel = useAriaLabel({\n label: labelSlot,\n defaultFallback: t('ariaLabelFallback') as string,\n });\n\n const hasColumnLayout = computed(() => props.withColumnLayout && props.size === BentoModalSize.LARGE);\n\n const openModal = (): void => {\n modal.value.showModal();\n };\n\n const emitCloseEvent = (): void => {\n emit(BentoModalEvent.CLOSE_MODAL);\n };\n\n const closeModal = (): void => {\n modal.value.close();\n emitCloseEvent();\n };\n\n const onCloseButtonClick = () => {\n closeModal();\n };\n\n /\n Since the dialog HTML element doesn't automatically close when clicking outside, a check on when the user is clicking is needed.\n * If the click doesn't happen in the dialog box itself, the modal closes\n /\n const closeModalOnClickOutside = ({ target }: Event): void => {\n if (target && (target as HTMLElement).tagName === BentoModalRole.DIALOG.toUpperCase()) {\n closeModal();\n }\n };\n\n const modalConditionalClasses = computed(() => ({\n [`b-modal-base__container--${props.size}`]: props.size,\n [`b-modal-base__container--visible`]: isOpen.value,\n [`b-modal-base__container--overflow-visible`]: overflowVisible.value,\n [`b-modal-base__container--column-layout`]: hasColumnLayout.value,\n }));\n\n const modalContentConditionalClasses = computed(() => ({\n 'b-modal-base__content--column-layout': hasColumnLayout.value,\n 'b-modal-base__content--with-header': hasSlot('default'),\n 'b-modal-base__content--with-actions': hasSlot('actions'),\n }));\n\n const computedColumnWidth = computed(() => {\n if (props.columnsSize === BentoModalColumnLayoutVariant.SMALLER) {\n return [{ small: 4, medium: 4, large: 4 }];\n }\n if (props.columnsSize === BentoModalColumnLayoutVariant.BIGGER) {\n return [{ small: 8, medium: 8, large: 8 }];\n }\n return [{ small: 6, medium: 6, large: 6 }];\n });\n\n watch(\n () => [isOpen.value, modal.value],\n (): void => {\n if (isOpen.value && modal.value) {\n openModal();\n } else if (modal.value) {\n closeModal();\n }\n },\n { immediate: true }\n );\n\n onMounted(() => {\n if (isOpen.value && modal.value) {\n openModal();\n }\n });\n\n return {\n // Refs\n modal,\n computedAriaLabel,\n\n // Handling the state\n openModal,\n closeModalOnClickOutside,\n\n // Methods\n onCloseButtonClick,\n hasSlot,\n emitCloseEvent,\n\n // Styles\n modalConditionalClasses,\n modalContentConditionalClasses,\n customPaddingStyles,\n hasColumnLayout,\n computedColumnWidth,\n\n // Enums\n BentoButtonVariant,\n BentoTypographyElement,\n BentoTypographyVariant,\n GridLayoutContainerType,\n };\n },\n });\n</script>\n\n<style lang=\"scss\" scoped src=\"./base-modal.scss\" />\n","<template>\n <div class=\"b-footer-actions\">\n <bento-typography\n v-if=\"actionsLabel\"\n :el=\"BentoTypographyElement.SPAN\"\n :variant=\"BentoTypographyVariant.BODY\"\n stronger\n >\n {{ actionsLabel }}\n </bento-typography>\n\n <bento-button-actions\n v-if=\"alignedActions.leftAligned\"\n :actions=\"alignedActions.leftAligned\"\n :layout=\"BentoButtonActionsLayout.BUTTONS_START\"\n ></bento-button-actions>\n\n <bento-button-actions\n :actions=\"alignedActions.rightAligned\"\n :layout=\"BentoButtonActionsLayout.BUTTONS_END\"\n ></bento-button-actions>\n </div>\n</template>\n\n<script setup lang=\"ts\">\n import { BentoTypography, BentoTypographyElement, BentoTypographyVariant } from '@/components/typography';\n import { computed, onMounted, PropType, toRefs } from 'vue';\n import {\n BentoButtonActions,\n BentoButtonActionsLayout,\n BentoButtonActionsList,\n BentoButtonVariant,\n } from '@/components/button';\n\n const props = defineProps({\n /\n List of actions that will be used to render the buttons.\n * First element in the list will be rendered as \"primary\".\n * All elements after the first will be rendered as \"secondary\".\n * But you may change the color of 1-st action to red with 'critial' key\n * Not more than 3 action buttons can be provided\n * Or 2 action buttons and 1 Label for them\n \n Each object in the list should have a `title`, an `event` and\n * (optional) a Vue `icon` from the library `@adyen/ui-assets-icons-16`.\n \n `title`: Button's text.\n \n `event`: Event triggered when clicking the Button.\n \n `icon`: Vue Icon from the library `@adyen/ui-assets-icons-16`.\n \n ```\n * [{\n * title: 'Primary',2\n * event: () => { ... },\n * icon: FourPeopleIcon\n * }, {\n * title: 'Secondary',\n * event: () => { ... }\n * }]\n * ```\n /\n actions: {\n type: Array as PropType<BentoButtonActionsList>,\n required: true,\n },\n /\n Text label that is displayed left to the action buttons\n /\n actionsLabel: {\n type: String,\n default: null,\n },\n /\n If passed - sets first button color to red\n /\n destructiveActions: {\n type: Boolean,\n default: false,\n },\n });\n\n const { actions, destructiveActions } = toRefs(props);\n\n const alignedActions = computed(() => {\n const rightAlignedButtons =\n actions.value.length < 3 ? actions.value : actions.value.slice(0, actions.value.length - 1);\n\n // Add red color to the 1-st Action button\n rightAlignedButtons[0].critical = destructiveActions.value;\n\n return {\n leftAligned:\n actions.value.length === 3\n ? [\n {\n ...actions.value[actions.value.length - 1],\n variant: BentoButtonVariant.SECONDARY,\n },\n ]\n : null,\n rightAligned: [...rightAlignedButtons],\n };\n });\n\n onMounted(() => {\n if (props.actions && props.actions.length > 3) {\n throw new Error('Not more than 3 action buttons may be provided to Bento Modal default variant');\n }\n\n if (props.actionsLabel && props.actions && props.actions.length > 2) {\n throw new Error(\n 'Not more than 2 action buttons may be provided with actions label to Bento Modal default variant'\n );\n }\n });\n</script>\n\n<script lang=\"ts\">\n /\n Internal component to handle the logic of displaying actions in default Modal and Sidepanel\n\n * @example\n * import { FooterActions } from '@/components/internal/footer-actions';\n \n export default {\n * components: { FooterActions },\n * template: `\n * <footer-actions :actions=\"BentoButtonActionsList\" actions-label=\"Label\" :destructive-actions=\"true\" />\n * `\n * }\n /\n export default {};\n</script>\n\n<style lang=\"scss\" scoped src=\"./footer-actions.scss\" />\n","<template>\n <base-modal\n class=\"b-modal-default\"\n :size=\"size\"\n :hide-close-button=\"hideCloseButton\"\n :custom-padding=\"customPadding\"\n :is-dismissible=\"isDismissible\"\n :is-open=\"isOpen\"\n :overflow-visible=\"overflowVisible\"\n :with-column-layout=\"withColumnLayout\"\n :initially-open=\"initiallyOpen\"\n @close-modal=\"onCloseModal\"\n >\n <template v-if=\"hasSlot('default')\" #default>\n <slot></slot>\n </template>\n <template #content-col-1><slot name=\"content-col-1\"></slot></template>\n <template #content-col-2><slot name=\"content-col-2\"></slot></template>\n <template #content><slot name=\"content\"></slot></template>\n\n <template v-if=\"actions\" #actions>\n <slot name=\"actions\">\n <footer-actions\n :actions=\"actions\"\n :actions-label=\"actionsLabel\"\n :destructive-actions=\"destructiveActions\"\n />\n </slot>\n </template>\n </base-modal>\n</template>\n\n<script lang=\"ts\">\n import { defineComponent, onMounted, PropType } from 'vue';\n import { BentoModalColumnLayoutVariant, BentoModalEvent, BentoModalSize } from '@/components/modal/modal.types';\n import { BaseModal } from '@/components/modal/components/base-modal';\n import { useHasSlot } from '@/composables';\n import { BentoButtonActionsList } from '@/components/button';\n import { FooterActions } from '@/components/internal/footer-actions';\n\n export default defineComponent({\n name: 'bento-modal-default',\n components: { BaseModal, FooterActions },\n props: {\n /\n Adds a cross icon on the right side of the alert\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 required: true,\n },\n /\n If set to true, it allows the modal to be closed by clicking outside of it\n /\n isDismissible: {\n type: Boolean,\n required: true,\n },\n /\n If set to true, it will set overflow:visible to the modal, only recommended to be used with dropdown\n /\n overflowVisible: {\n type: Boolean,\n default: false,\n },\n /\n Hides a cross icon on the right side of the title\n /\n hideCloseButton: {\n type: Boolean,\n default: false,\n },\n /\n Sets the width of the modal\n /\n size: {\n type: String as PropType<BentoModalSize>,\n required: true,\n },\n /\n If provided, manages the padding of the whole modal container\n /\n customPadding: {\n type: String,\n default: null,\n },\n\n /\n If provided, renders the modal's content in a two-column layout an wth dividers separating its content\n /\n withColumnLayout: {\n type: Boolean,\n default: false,\n },\n\n /\n If a column layout is provided, it renders the respective left column width variant. This can be smaller than the second column, the same size as the second column or bigger than the second column.\n /\n columnsSize: {\n type: String as PropType<BentoModalColumnLayoutVariant>,\n default: BentoModalColumnLayoutVariant.SMALLER,\n },\n\n /\n List of actions that will be used to render the buttons.\n * First element in the list will be rendered as \"primary\".\n * All elements after the first will be rendered as \"secondary\".\n * But you may change the color of 1-st action to red with 'critial' key\n * Not more than 3 action buttons can be provided\n * Or 2 action buttons and 1 Label for them\n \n Each object in the list should have a `title`, an `event` and\n * (optional) a Vue `icon` from the library `@adyen/ui-assets-icons-16`.\n \n `title`: Button's text.\n \n `event`: Event triggered when clicking the Button.\n \n `icon`: Vue Icon from the library `@adyen/ui-assets-icons-16`.\n \n ```\n * [{\n * title: 'Primary',2\n * event: () => { ... },\n * icon: FourPeopleIcon\n * }, {\n * title: 'Secondary',\n * event: () => { ... }\n * }]\n * ```\n /\n actions: {\n type: Array as PropType<BentoButtonActionsList>,\n default: null,\n },\n /\n Text label that is displayed left to the action buttons\n /\n actionsLabel: {\n type: String,\n default: null,\n },\n /\n If passed - sets first button color to red\n /\n destructiveActions: {\n type: Boolean,\n default: false,\n },\n\n /\n Sets the open attribute on the dialog element, use isOpen instead to toggle modal visbility.\n /\n initiallyOpen: {\n type: Boolean,\n default: false,\n },\n },\n emits: [BentoModalEvent.CLOSE_MODAL],\n setup(props, { slots, emit }) {\n const hasSlot = useHasSlot(slots);\n\n const onCloseModal = () => {\n emit(BentoModalEvent.CLOSE_MODAL);\n };\n\n onMounted(() => {\n if (!(hasSlot('content') \|\| (hasSlot('content-col-1') && hasSlot('content-col-2')))) {\n throw new Error('Bento Modal default variant requires content slot or column slots');\n }\n });\n\n return {\n // Methods\n onCloseModal,\n hasSlot,\n };\n },\n });\n</script>\n","<template>\n <base-modal\n class=\"b-modal-dialog\"\n :class=\"modalDialogConditionalClasses\"\n :hide-close-button=\"true\"\n :size=\"BentoModalSize.SMALL\"\n :is-dismissible=\"isDismissible\"\n :is-open=\"isOpen\"\n :overflow-visible=\"overflowVisible\"\n :modal-role=\"BentoModalRole.ALERT_DIALOG\"\n :initially-open=\"initiallyOpen\"\n @close-modal=\"onCloseModal\"\n >\n <template #default>\n <slot></slot>\n </template>\n <template #content>\n {{ content }}\n </template>\n\n <template #actions>\n <bento-button-actions\n v-if=\"dialogType === BentoModalDialogType.ACKNOWLEDGEMENT\"\n :actions=\"acknowledgementDialogActions\"\n :layout=\"BentoButtonActionsLayout.BUTTONS_END\"\n ></bento-button-actions>\n\n <bento-button-actions\n v-else\n :actions=\"dialogActions\"\n :layout=\"BentoButtonActionsLayout.BUTTONS_END\"\n ></bento-button-actions>\n </template>\n </base-modal>\n</template>\n\n<script lang=\"ts\">\n import { computed, defineComponent, onMounted, PropType, toRefs } from 'vue';\n import {\n BentoModalDialogType,\n BentoModalEvent,\n BentoModalRole,\n BentoModalSize,\n } from '@/components/modal/modal.types';\n import { BaseModal } from '@/components/modal/components/base-modal';\n import { useHasSlot } from '@/composables';\n import {\n BentoButtonActionObject,\n BentoButtonActions,\n BentoButtonActionsLayout,\n BentoButtonActionsList,\n BentoButtonVariant,\n } from '@/components/button';\n import { useI18n } from '@/utils/ts/i18n';\n import messages from './messages.json';\n\n type MessageSchema = (typeof messages)['en-US'];\n\n export default defineComponent({\n i18n: { messages },\n name: 'bento-modal-dialog',\n components: { BaseModal, BentoButtonActions },\n props: {\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 required: true,\n },\n /\n If set to true, it allows the modal to be closed by clicking outside of it\n /\n isDismissible: {\n type: Boolean,\n required: true,\n },\n /\n If set to true, it will set overflow:visible to the modal, only recommended to be used with dropdown\n /\n overflowVisible: {\n type: Boolean,\n default: false,\n },\n /\n Sets different action buttons styling and appearance\n /\n dialogType: {\n type: String as PropType<BentoModalDialogType>,\n required: true,\n },\n /\n Text that is displayed in the content section of modal\n /\n content: {\n type: String,\n required: true,\n },\n /\n List of actions that will be used to render the buttons.\n * Only 1 action button is allowed for Modal Dialog\n \n Each object in the list should have a `title`, an `event` and\n * (optional) a Vue `icon` from the library `@adyen/ui-assets-icons-16`.\n \n `title`: Button's text.\n \n `event`: Event triggered when clicking the Button.\n \n `icon`: Vue Icon from the library `@adyen/ui-assets-icons-16`.\n \n ```\n * [{\n * title: 'Primary',2\n * event: () => { ... },\n * icon: FourPeopleIcon\n * }]\n * ```\n /\n actions: {\n type: Array as PropType<BentoButtonActionsList>,\n default: null,\n },\n\n /\n Sets the open attribute on the dialog element, use isOpen instead to toggle modal visbility.\n /\n initiallyOpen: {\n type: Boolean,\n default: false,\n },\n },\n emits: [BentoModalEvent.CLOSE_MODAL],\n setup(props, { slots, emit }) {\n const { t } = useI18n<{ message: MessageSchema }>({ messages });\n const hasSlot = useHasSlot(slots);\n const { actions, dialogType } = toRefs(props);\n\n const onCloseModal = () => {\n emit(BentoModalEvent.CLOSE_MODAL);\n };\n\n const onCloseActionButton = () => {\n onCloseModal();\n };\n\n const acknowledgementDialogActions = computed(() => [\n {\n title: t('okButtonText') as string,\n event: onCloseActionButton,\n variant: BentoButtonVariant.SECONDARY,\n },\n ]);\n\n const dialogActions = computed(() => {\n const mandatoryCancelActionButton: BentoButtonActionObject = {\n title: 'Cancel',\n event: onCloseActionButton,\n };\n const updatedPassedActionsObject: BentoButtonActionObject = actions?.value?.[0];\n\n if (dialogType.value === BentoModalDialogType.DESTRUCTIVE) {\n updatedPassedActionsObject.critical = true;\n } else if (dialogType.value === BentoModalDialogType.INFO) {\n updatedPassedActionsObject.variant = BentoButtonVariant.SECONDARY;\n }\n\n return [updatedPassedActionsObject, mandatoryCancelActionButton];\n });\n\n const modalDialogConditionalClasses = computed(() => ({\n [`b-modal-dialog--${dialogType.value}`]: dialogType.value,\n }));\n\n onMounted(() => {\n if (!hasSlot('default') \|\| !props.content) {\n throw new Error('Bento Modal Dialog requires header title and content');\n }\n\n if (actions?.value?.length > 1) {\n throw new Error('Not more than 1 action button may be provided to Modal Dialog');\n }\n\n if (dialogType.value !== BentoModalDialogType.ACKNOWLEDGEMENT && !actions?.value) {\n throw new Error(\n 'Modal Dialog, except ACKNOWLEDGEMENT type, always has to contain one action button'\n );\n }\n\n if (dialogType.value === BentoModalDialogType.ACKNOWLEDGEMENT && actions?.value?.length) {\n throw new Error('Acknowledgement Modal Dialog does not accept action buttons');\n }\n });\n\n return {\n // Values\n dialogActions,\n acknowledgementDialogActions,\n\n // Methods\n onCloseModal,\n onCloseActionButton,\n\n // Styles\n modalDialogConditionalClasses,\n\n // Enums\n BentoModalRole,\n BentoModalSize,\n BentoButtonVariant,\n BentoModalDialogType,\n BentoButtonActionsLayout,\n };\n },\n });\n</script>\n","<template>\n <component\n :is=\"variant\"\n class=\"b-modal\"\n :is-open=\"isOpen\"\n :actions=\"actions\"\n v-bind=\"customProps\"\n @close-modal=\"onCloseModal\"\n >\n <template v-if=\"hasSlot('default')\" #default>\n <slot></slot>\n </template>\n <template v-if=\"hasSlot('content-col-1')\" #content-col-1><slot name=\"content-col-1\"></slot></template>\n <template v-if=\"hasSlot('content-col-2')\" #content-col-2><slot name=\"content-col-2\"></slot></template>\n <template v-if=\"hasSlot('content')\" #content><slot name=\"content\"></slot></template>\n </component>\n</template>\n\n<script lang=\"ts\">\n import { computed, defineComponent, PropType, toRefs } from 'vue';\n import {\n BentoModalColumnLayoutVariant,\n BentoModalDialogType,\n BentoModalEvent,\n BentoModalSize,\n BentoModalVariant,\n } from '@/components/modal/modal.types';\n import { BentoModalDefault, BentoModalDialog } from '@/components/modal/components';\n import { useHasSlot } from '@/composables';\n import { BentoButtonActionsList } from '@/components/button';\n\n /\n Modal is a window that appear over any other page content and focus user attention exclusively on one task or piece of information at the moment.\n \n @example\n * import { BentoModal } from '@adyen/bento-vue2';\n \n export default {\n * components: { BentoModal },\n * template: `\n * <bento-modal :isOpen=\"true\">\n * Title of the Modal\n * <template #content>\n * Mandatory content slot\n * </template>\n * </bento-modal>\n * `\n * };\n /\n export default defineComponent({\n name: 'bento-modal',\n components: { BentoModalDefault, BentoModalDialog },\n props: {\n /\n Choose between default or dialog versions of modal\n /\n variant: {\n type: String as PropType<BentoModalVariant>,\n default: BentoModalVariant.DEFAULT,\n },\n\n // Shared Modal Default and Modal Default props\n /\n If set to true, it allows the modal to be closed by clicking outside of it\n /\n isDismissible: {\n type: Boolean,\n default: null,\n },\n /\n If set to true, it will set overflow:visible to the modal, only recommended to be used with dropdown\n /\n overflowVisible: {\n type: Boolean,\n default: false,\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: false,\n },\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 `title`: Button's text.\n \n `event`: Event triggered when clicking the Button.\n \n `icon`: Vue Icon from the library `@adyen/ui-assets-icons-16`.\n \n ```\n * [{\n * title: 'Primary',2\n * event: () => { ... },\n * icon: FourPeopleIcon\n * }, {\n * title: 'Secondary',\n * event: () => { ... }\n * }]\n * ```\n /\n actions: {\n type: Array as PropType<BentoButtonActionsList>,\n default: null,\n },\n\n // Specific to Modal Default props\n /\n Hides a cross icon on the right side of the title\n /\n hideCloseButton: {\n type: Boolean,\n default: false,\n },\n /\n Sets the width of the modal\n /\n size: {\n type: String as PropType<BentoModalSize>,\n default: BentoModalSize.SMALL,\n },\n /\n If provided, manages the padding of the whole modal container\n /\n customPadding: {\n type: String,\n default: null,\n },\n /\n If provided, renders the modal's content in a two-column layout an wth dividers separating its content\n /\n withColumnLayout: {\n type: Boolean,\n default: false,\n },\n\n /\n If a column layout is provided, it renders the respective left column width variant. This can be smaller than the second column, the same size as the second column or bigger than the second column.\n /\n columnsSize: {\n type: String as PropType<BentoModalColumnLayoutVariant>,\n default: BentoModalColumnLayoutVariant.SMALLER,\n },\n\n /\n Text label that is displayed left to the action buttons\n /\n actionsLabel: {\n type: String,\n default: null,\n },\n /\n If passed - sets first button color to red\n /\n destructiveActions: {\n type: Boolean,\n default: false,\n },\n\n // Specific to Modal dialog props\n /\n Changes the visual styling of action buttons\n /\n dialogType: {\n type: String as PropType<BentoModalDialogType>,\n default: BentoModalDialogType.CONFIRMATION,\n },\n /\n Text that will be displayed in the content section of Modal\n */\n content: {\n type: String,\n default: null,\n },\n },\n emits: [BentoModalEvent.CLOSE_MODAL],\n setup(props, { slots, emit }) {\n const {\n variant,\n hideCloseButton,\n size,\n isDismissible,\n overflowVisible,\n dialogType,\n content,\n customPadding,\n actionsLabel,\n destructiveActions,\n withColumnLayout,\n } = toRefs(props);\n\n const customProps = computed(() =>\n variant.value === BentoModalVariant.DEFAULT\n ? {\n hideCloseButton: hideCloseButton.value,\n size: size.value,\n customPadding: customPadding.value,\n actionsLabel: actionsLabel.value,\n destructiveActions: destructiveActions.value,\n isDismissible: isDismissible.value ?? true,\n overflowVisible: overflowVisible.value,\n withColumnLayout: withColumnLayout.value,\n }\n : {\n dialogType: dialogType.value,\n content: content.value,\n isDismissible: isDismissible.value ?? false,\n overflowVisible: overflowVisible.value,\n }\n );\n\n const onCloseModal = () => {\n emit(BentoModalEvent.CLOSE_MODAL);\n };\n\n return {\n onCloseModal,\n customProps,\n hasSlot: useHasSlot(slots),\n };\n },\n });\n</script>\n"],"names":["BentoModalVariant","BentoModalVariant2","BentoModalSize","BentoModalSize2","BentoModalColumnLayoutVariant","BentoModalColumnLayoutVariant2","BentoModalRole","BentoModalRole2","BentoModalDialogType","BentoModalDialogType2","BentoModalEvent","BentoModalEvent2","_sfc_main$4","defineComponent","messages$1","CrossIcon","BentoTypography","BentoButton","BentoDivider","BentoFocusTrap","GridLayout","props","slots","emit","t","useI18n","hasSlot","useHasSlot","modal","ref","isOpen","customPadding","overflowVisible","toRefs","labelSlot","computed","getSlotText","customPaddingStyles","xPadding","content","computedAriaLabel","useAriaLabel","hasColumnLayout","openModal","emitCloseEvent","closeModal","onCloseButtonClick","closeModalOnClickOutside","target","modalConditionalClasses","modalContentConditionalClasses","computedColumnWidth","watch","onMounted","BentoButtonVariant","BentoTypographyElement","BentoTypographyVariant","GridLayoutContainerType","_hoisted_2","_hoisted_4","createElementVNode","_ctx","normalizeClass","_cache","$event","withCtx","_hoisted_3","openBlock","createElementBlock","normalizeStyle","createVNode","_component_bento_typography","renderSlot","createCommentVNode","createBlock","_component_bento_button","_component_grid_layout","_hoisted_5","__default__","actions","destructiveActions","alignedActions","rightAlignedButtons","_sfc_main$2","BaseModal","FooterActions","onCloseModal","createSlots","_component_footer_actions","_sfc_main$1","messages","BentoButtonActions","dialogType","onCloseActionButton","acknowledgementDialogActions","dialogActions","mandatoryCancelActionButton","updatedPassedActionsObject","_a","modalDialogConditionalClasses","_b","BentoButtonActionsLayout","_component_base_modal","_component_bento_button_actions","_sfc_main","BentoModalDefault","BentoModalDialog","variant","hideCloseButton","size","isDismissible","actionsLabel","withColumnLayout","customProps","resolveDynamicComponent","mergeProps"],"mappings":"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"}

package/dist/pagination.js CHANGED Viewed

@@ -1,10 +1,10 @@
 import { defineComponent as y, ref as z, computed as v, resolveComponent as d, openBlock as o, createElementBlock as c, createVNode as r, withCtx as u, createBlock as f, resolveDynamicComponent as E, mergeProps as P, createSlots as U, createTextVNode as $, toDisplayString as m, createCommentVNode as C, pushScopeId as b, popScopeId as T, createElementVNode as p, normalizeClass as j } from "vue";
-import { B as k, c as R } from "./chunks/index.1d501e31.js";
-import { B as A } from "./chunks/dropdown.751d23b5.js";
+import { B as k, a as R } from "./chunks/index.92f7d550.js";
+import { B as A } from "./chunks/dropdown.374481a8.js";
 import { g as F } from "./chunks/unique-id.a2a2b458.js";
-import { g as D, a as M } from "./chunks/i18n.3619d46c.js";
+import { g as D, a as M } from "./chunks/i18n.6c402773.js";
 import { _ as h } from "./chunks/_plugin-vue_export-helper.dad06003.js";
-import { B as J, a as Y } from "./chunks/button.51be5335.js";
+import { B as J, a as Y } from "./chunks/button.4ccc3a72.js";
 import "./assets/index33.css";
 const K = {
   "en-US": {
@@ -526,7 +526,6 @@ const Fe = /* @__PURE__ */ h(Le, [["render", Ae], ["__scopeId", "data-v-8f38b953
     BentoPaginationControls: Fe,
     BentoPaginationResultsPerPage: X
   },
-  inheritAttrs: !1,
   props: {
     /**
      * A brief description of the purpose of the navigation (for a11y).
@@ -589,7 +588,7 @@ const Fe = /* @__PURE__ */ h(Le, [["render", Ae], ["__scopeId", "data-v-8f38b953
     };
   }
 });
-const Ze = (e) => (b("data-v-d48b0b30"), e = e(), T(), e), Ve = { class: "b-pagination" }, We = ["aria-label"], ze = { class: "b-pagination__page-navigator" }, Ue = /* @__PURE__ */ Ze(() => /* @__PURE__ */ p("div", { class: "b-pagination__divider" }, null, -1));
+const Ze = (e) => (b("data-v-1c9873b8"), e = e(), T(), e), Ve = { class: "b-pagination" }, We = ["aria-label"], ze = { class: "b-pagination__page-navigator" }, Ue = /* @__PURE__ */ Ze(() => /* @__PURE__ */ p("div", { class: "b-pagination__divider" }, null, -1));
 function je(e, a, i, n, s, l) {
   const g = d("bento-pagination-results-per-page"), t = d("bento-pagination-context"), _ = d("bento-pagination-controls");
   return o(), c("div", Ve, [
@@ -624,7 +623,7 @@ function je(e, a, i, n, s, l) {
     ], 10, We)
   ]);
 }
-const Xe = /* @__PURE__ */ h(Me, [["render", je], ["__scopeId", "data-v-d48b0b30"]]);
+const Xe = /* @__PURE__ */ h(Me, [["render", je], ["__scopeId", "data-v-1c9873b8"]]);
 export {
   Xe as BentoPagination
 };

package/dist/pagination.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"pagination.js","sources":["../../vue2/src/components/pagination/components/pagination-results-per-page/pagination-results-per-page.vue","../../vue2/src/components/pagination/components/pagination-context/pagination-context.vue","../../../node_modules/@adyen/ui-assets-icons-16/dist/vue/skip-left.vue","../../../node_modules/@adyen/ui-assets-icons-16/dist/vue/skip-right.vue","../../../node_modules/@adyen/ui-assets-icons-16/dist/vue/chevron-left-small.vue","../../../node_modules/@adyen/ui-assets-icons-16/dist/vue/chevron-right-small.vue","../../vue2/src/components/pagination/components/pagination-controls/pagination-controls.vue","../../vue2/src/components/pagination/pagination.vue"],"sourcesContent":["<template>\n <div class=\"b-pagination-results-per-page\">\n <bento-typography :el=\"BentoTypographyElement.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 :value=\"itemsPerPage\"\n :items=\"dropdownOptions\"\n class=\"b-pagination-results-per-page__dropdown\"\n :aria-label=\"$t(translationPathKey, { itemCount: itemsPerPage, totalCount })\"\n @input=\"onSelectChange\"\n />\n </template>\n <template v-if=\"!!totalCount\" #totalCount>{{ totalCount }}</template>\n </component>\n </bento-typography>\n </div>\n</template>\n\n<script lang=\"ts\">\n import { computed, defineComponent, ref } from 'vue';\n import { BentoTypography, BentoTypographyElement } from '@/components/typography';\n import { BentoDropdown } from '@/components/dropdown';\n import { generateUid } from '@/utils/ts/unique-id';\n import { getI18nComponent, getI18nProps } from '@/utils/ts/i18n';\n\n import messages from './messages.json';\n\n const DEFAULT_NUMBER_OF_RESULTS = 50;\n const PREDEFINED_RESULTS_PER_PAGE_VALUES = [\n { label: '10', value: 10 },\n { label: '20', value: 20 },\n { label: '50', value: 50 }, // DEFAULT_NUMBER_OF_RESULTS\n { label: '75', value: 75 },\n { label: '100', value: 100 },\n ];\n\n export default defineComponent({\n name: 'bento-pagination-context-results-per-page',\n i18n: { messages },\n components: {\n BentoDropdown,\n BentoTypography,\n },\n props: {\n /*\n The amount of items the pager is paging through.\n /\n itemsPerPage: {\n type: Number,\n default: DEFAULT_NUMBER_OF_RESULTS,\n validator: (itemsPerPageValue: number) =>\n PREDEFINED_RESULTS_PER_PAGE_VALUES.some(({ value }) => value === itemsPerPageValue),\n },\n /\n The total number of items the pager is paging through.\n /\n totalCount: { type: Number, default: null },\n },\n emits: ['select'],\n setup(props, { emit }) {\n const dropdownId = generateUid('b-pagination-context-number-elements');\n const dropdownOptions = ref(PREDEFINED_RESULTS_PER_PAGE_VALUES);\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\n return {\n // Values\n dropdownId,\n dropdownOptions,\n i18nComponent,\n translationPathKey,\n\n // Methods\n getI18nProps,\n\n // Enums\n BentoTypographyElement,\n\n // Events\n onSelectChange,\n };\n },\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=\"BentoTypographyElement.DIV\">\n <component :is=\"i18nComponent\" v-bind=\"getI18nProps('pageOfTotalPages')\" tag=\"div\">\n <template #page>\n <bento-dropdown\n :id=\"dropdownId\"\n :value=\"page\"\n :items=\"listOfAvailablePages\"\n :aria-label=\"$t('pageOfTotalPages', { page, totalPages })\"\n class=\"b-pagination-context__dropdown\"\n @input=\"onPageSelectChange\"\n />\n </template>\n <template #totalPages>{{ totalPages }}</template>\n </component>\n </bento-typography>\n <bento-typography v-else-if=\"totalPages === 1\" :el=\"BentoTypographyElement.SPAN\">\n {{ $t('pageOneOfOne') }}\n </bento-typography>\n <bento-typography v-else :el=\"BentoTypographyElement.SPAN\">\n {{ $t('pageNumber', { page }) }}\n </bento-typography>\n </div>\n</template>\n\n<script lang=\"ts\">\n import { computed, defineComponent } from 'vue';\n import { BentoTypography, BentoTypographyElement } from '@/components/typography';\n import { BentoDropdown } from '@/components/dropdown';\n import { BentoListboxOptionItem } from '@/types';\n import { generateUid } from '@/utils/ts/unique-id';\n import messages from './messages.json';\n import { getI18nComponent, getI18nProps } from '../../../../utils/ts/i18n';\n\n export default defineComponent({\n i18n: { messages },\n name: 'bento-pagination-context',\n components: {\n BentoDropdown,\n BentoTypography,\n },\n props: {\n /\n The current page number of the pager.\n /\n page: {\n type: Number,\n default: 1,\n validator: (value: number) => Number.isFinite(value) && value > 0,\n },\n\n /\n The total number of items the pager is paging through.\n /\n totalPages: { type: Number, default: null },\n },\n emits: ['page-selected'],\n setup(props, { emit }) {\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: value.toString(),\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\n return {\n // Values\n dropdownId,\n listOfAvailablePages,\n i18nComponent,\n\n // Methods\n getI18nProps,\n\n // Events\n onPageSelectChange,\n\n // Enums\n BentoTypographyElement,\n };\n },\n });\n</script>\n\n<style lang=\"scss\" scoped src=\"./pagination-context.scss\" />\n","\n<template>\n <svg role=\"img\" v-bind=\"$attrs\" 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=\"#00112C\" fill-rule=\"evenodd\" d=\"M4.25 11C4.25 11.4142 4.58579 11.75 5 11.75C5.41421 11.75 5.75 11.4142 5.75 11L5.75 4.99999C5.75 4.58577 5.41421 4.24999 5 4.24999C4.58579 4.24999 4.25 4.58577 4.25 4.99998L4.25 11Z\" clip-rule=\"evenodd\"/><path fill=\"#00112C\" fill-rule=\"evenodd\" d=\"M11.5303 5.53031C11.8232 5.23742 11.8232 4.76255 11.5303 4.46965C11.2374 4.17676 10.7626 4.17676 10.4697 4.46965L7.46967 7.46965C7.17678 7.76255 7.17678 8.23742 7.46967 8.53031L10.4697 11.5303C10.7626 11.8232 11.2374 11.8232 11.5303 11.5303C11.8232 11.2374 11.8232 10.7625 11.5303 10.4697L9.06066 7.99998L11.5303 5.53031Z\" clip-rule=\"evenodd\"/></svg>\n</template>\n<script>\n let uuid = 0;\n\n export default {\n beforeCreate() {\n this.uuid = uuid.toString();\n uuid += 1;\n },\n };\n</script>\n<style scoped lang=\"scss\">\n svg {\n display: inline-flex;\n flex-shrink: 0;\n }\n \n svg,\n svg {\n fill: currentcolor;\n }\n</style>\n","\n<template>\n <svg role=\"img\" v-bind=\"$attrs\" 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=\"#00112C\" fill-rule=\"evenodd\" d=\"M4.46967 10.4697C4.17678 10.7626 4.17678 11.2374 4.46967 11.5303C4.76256 11.8232 5.23744 11.8232 5.53033 11.5303L8.53033 8.53032C8.82322 8.23743 8.82322 7.76256 8.53033 7.46966L5.53033 4.46966C5.23744 4.17677 4.76256 4.17677 4.46967 4.46966C4.17678 4.76256 4.17678 5.23743 4.46967 5.53032L6.93934 7.99999L4.46967 10.4697Z\" clip-rule=\"evenodd\"/><path fill=\"#00112C\" fill-rule=\"evenodd\" d=\"M11.75 4.99999C11.75 4.58578 11.4142 4.24999 11 4.24999C10.5858 4.24999 10.25 4.58578 10.25 4.99999V11C10.25 11.4142 10.5858 11.75 11 11.75C11.4142 11.75 11.75 11.4142 11.75 11L11.75 4.99999Z\" clip-rule=\"evenodd\"/></svg>\n</template>\n<script>\n let uuid = 0;\n\n export default {\n beforeCreate() {\n this.uuid = uuid.toString();\n uuid += 1;\n },\n };\n</script>\n<style scoped lang=\"scss\">\n svg {\n display: inline-flex;\n flex-shrink: 0;\n }\n \n svg,\n svg * {\n fill: currentcolor;\n }\n</style>\n","\n<template>\n <svg role=\"img\" v-bind=\"$attrs\" 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=\"#00112C\" fill-rule=\"evenodd\" d=\"M10.0303 4.46967C10.3232 4.76256 10.3232 5.23744 10.0303 5.53033L7.56066 8L10.0303 10.4697C10.3232 10.7626 10.3232 11.2374 10.0303 11.5303C9.73744 11.8232 9.26256 11.8232 8.96967 11.5303L5.96967 8.53033C5.67678 8.23744 5.67678 7.76256 5.96967 7.46967L8.96967 4.46967C9.26256 4.17678 9.73744 4.17678 10.0303 4.46967Z\" clip-rule=\"evenodd\"/></svg>\n</template>\n<script>\n let uuid = 0;\n\n export default {\n beforeCreate() {\n this.uuid = uuid.toString();\n uuid += 1;\n },\n };\n</script>\n<style scoped lang=\"scss\">\n svg {\n display: inline-flex;\n flex-shrink: 0;\n }\n \n svg,\n svg * {\n fill: currentcolor;\n }\n</style>\n","\n<template>\n <svg role=\"img\" v-bind=\"$attrs\" 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=\"#00112C\" fill-rule=\"evenodd\" d=\"M5.96967 11.5303C5.67678 11.2374 5.67678 10.7626 5.96967 10.4697L8.43934 8L5.96967 5.53033C5.67678 5.23744 5.67678 4.76256 5.96967 4.46967C6.26256 4.17678 6.73744 4.17678 7.03033 4.46967L10.0303 7.46967C10.171 7.61032 10.25 7.80109 10.25 8C10.25 8.19891 10.171 8.38968 10.0303 8.53033L7.03033 11.5303C6.73744 11.8232 6.26256 11.8232 5.96967 11.5303Z\" clip-rule=\"evenodd\"/></svg>\n</template>\n<script>\n let uuid = 0;\n\n export default {\n beforeCreate() {\n this.uuid = uuid.toString();\n uuid += 1;\n },\n };\n</script>\n<style scoped lang=\"scss\">\n svg {\n display: inline-flex;\n flex-shrink: 0;\n }\n \n svg,\n svg * {\n fill: currentcolor;\n }\n</style>\n","<template>\n <ul class=\"b-pagination-controls\">\n <li class=\"b-pagination-controls__item\">\n <!-- Navigate to the first page -->\n <bento-button\n :disabled=\"isCurrentPageFirst\"\n :variant=\"BentoButtonVariant.TERTIARY\"\n tertiary\n condensed\n @click=\"navigate(1)\"\n >\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\n :disabled=\"isCurrentPageFirst\"\n :variant=\"BentoButtonVariant.TERTIARY\"\n tertiary\n condensed\n @click=\"navigate(page - 1)\"\n >\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\n :disabled=\"isNextButtonDisabled\"\n :variant=\"BentoButtonVariant.TERTIARY\"\n tertiary\n condensed\n @click=\"navigate(page + 1)\"\n >\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=\"BentoButtonVariant.TERTIARY\"\n 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 lang=\"ts\">\n import { computed, defineComponent } from 'vue';\n import { BentoButton, BentoButtonVariant } from '@/components/button';\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 export default defineComponent({\n i18n: { messages },\n name: 'adl-pagination-controls',\n components: {\n BentoButton,\n SkipLeft,\n SkipRight,\n ChevronLeft,\n ChevronRight,\n },\n props: {\n /*\n Use to determine if the pager has a \"next page\".\n /\n hasNext: { type: Boolean, default: null },\n\n /\n The current page number of the pager.\n /\n page: { type: Number, required: true },\n\n /\n The current page number of the pager.\n /\n totalPages: { type: Number, default: null },\n },\n emits: ['navigate'],\n setup(props, { emit }) {\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\n return {\n // Values\n isNextButtonDisabled,\n isCurrentPageFirst,\n isCurrentPageLast,\n isLastPageButtonDisabled,\n\n // Events\n navigate,\n\n // Enums\n BentoButtonVariant,\n };\n },\n });\n</script>\n\n<style lang=\"scss\" scoped src=\"./pagination-controls.scss\" />\n","<template>\n <div class=\"b-pagination\">\n <nav :aria-label=\"ariaLabel\" 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\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 @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 lang=\"ts\">\n import { computed, defineComponent } from 'vue';\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 messages from './messages.json';\n\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 export default defineComponent({\n i18n: { messages },\n name: 'bento-pagination',\n components: {\n BentoPaginationContext,\n BentoPaginationControls,\n BentoPaginationResultsPerPage,\n },\n inheritAttrs: false,\n props: {\n /\n A brief description of the purpose of the navigation (for a11y).\n * Omit the term \"navigation\", as the screen reader will read both the role and the contents of the label.\n /\n ariaLabel: { type: String, default: null },\n\n /\n Use to determine if the pager has a \"next page\".\n /\n hasNext: { type: Boolean, default: null },\n\n /\n Toggles the visibility of the \"results per page\" part of the pagination component.\n /\n hidePageSize: {\n type: Boolean,\n default: false,\n },\n\n /\n The current page number of the pager.\n /\n page: {\n type: Number,\n default: 1,\n validator: (value: number) => Number.isFinite(value) && value > 0,\n },\n\n /\n The size of the items the pager is paging through.\n /\n size: {\n type: Number,\n default: 20,\n validator: (itemsPerPageValue: number) => [10, 20, 50, 75, 100].includes(itemsPerPageValue),\n },\n\n /\n The total number of items the pager is paging through.\n */\n totalCount: { type: Number, default: null },\n },\n emits: ['navigate', 'items-page', 'update:page', 'update:size'],\n setup(props, { emit }) {\n const totalPages = computed(() =>\n !props.totalCount \|\| !props.size ? null : Math.ceil(props.totalCount / props.size)\n );\n\n const navigate = (pageArg: number) => {\n emit('navigate', pageArg);\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);\n };\n\n const navigationConditionalClasses = computed(() => ({\n 'b-pagination__navigation--no-results-per-page': props.hidePageSize,\n }));\n\n return {\n // Values\n totalPages,\n navigationConditionalClasses,\n\n // Events\n navigate,\n onItemsPerPageChange,\n onPageSelected,\n };\n },\n });\n</script>\n\n<style lang=\"scss\" scoped src=\"./pagination.scss\" />\n"],"names":["DEFAULT_NUMBER_OF_RESULTS","PREDEFINED_RESULTS_PER_PAGE_VALUES","_sfc_main$7","defineComponent","messages$3","BentoDropdown","BentoTypography","itemsPerPageValue","value","props","emit","dropdownId","generateUid","dropdownOptions","ref","i18nComponent","getI18nComponent","onSelectChange","selectedNumberOfResults","translationPathKey","computed","getI18nProps","BentoTypographyElement","createVNode","_component_bento_typography","_ctx","openBlock","createBlock","resolveDynamicComponent","mergeProps","createSlots","withCtx","_component_bento_dropdown","_sfc_main$6","messages$2","onPageSelectChange","selectedPage","transformIntoOption","transformToPageNumber","index","listOfAvailablePages","uuid$3","createElementBlock","_hoisted_1$5","toDisplayString","uuid$2","_hoisted_1$4","uuid$1","_hoisted_1$3","uuid","_hoisted_1$2","_sfc_main$1","messages$1","BentoButton","SkipLeft","SkipRight","ChevronLeft","ChevronRight","isCurrentPageFirst","isCurrentPageLast","isNextButtonDisabled","isLastPageButtonDisabled","hasNoNextPage","hasNoTotalPagesNumber","pageArg","BentoButtonVariant","_hoisted_2$1","_hoisted_3$1","createElementVNode","_component_bento_button","_cache","$event","_component_skip_left","_component_chevron_left","_hoisted_4$1","_component_chevron_right","_hoisted_5","_component_skip_right","_sfc_main","messages","BentoPaginationContext","BentoPaginationControls","BentoPaginationResultsPerPage","totalPages","navigate","onPageSelected","pageNumber","onItemsPerPageChange","elements","navigationConditionalClasses","_component_bento_pagination_controls","resolveComponent","_hoisted_1","createCommentVNode","_hoisted_3","_component_bento_pagination_context","_hoisted_4"],"mappings":"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","x_google_ignoreList":[2,3,4,5]}
1	+ {"version":3,"file":"pagination.js","sources":["../../vue2/src/components/pagination/components/pagination-results-per-page/pagination-results-per-page.vue","../../vue2/src/components/pagination/components/pagination-context/pagination-context.vue","../../../node_modules/@adyen/ui-assets-icons-16/dist/vue/skip-left.vue","../../../node_modules/@adyen/ui-assets-icons-16/dist/vue/skip-right.vue","../../../node_modules/@adyen/ui-assets-icons-16/dist/vue/chevron-left-small.vue","../../../node_modules/@adyen/ui-assets-icons-16/dist/vue/chevron-right-small.vue","../../vue2/src/components/pagination/components/pagination-controls/pagination-controls.vue","../../vue2/src/components/pagination/pagination.vue"],"sourcesContent":["<template>\n <div class=\"b-pagination-results-per-page\">\n <bento-typography :el=\"BentoTypographyElement.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 :value=\"itemsPerPage\"\n :items=\"dropdownOptions\"\n class=\"b-pagination-results-per-page__dropdown\"\n :aria-label=\"$t(translationPathKey, { itemCount: itemsPerPage, totalCount })\"\n @input=\"onSelectChange\"\n />\n </template>\n <template v-if=\"!!totalCount\" #totalCount>{{ totalCount }}</template>\n </component>\n </bento-typography>\n </div>\n</template>\n\n<script lang=\"ts\">\n import { computed, defineComponent, ref } from 'vue';\n import { BentoTypography, BentoTypographyElement } from '@/components/typography';\n import { BentoDropdown } from '@/components/dropdown';\n import { generateUid } from '@/utils/ts/unique-id';\n import { getI18nComponent, getI18nProps } from '@/utils/ts/i18n';\n\n import messages from './messages.json';\n\n const DEFAULT_NUMBER_OF_RESULTS = 50;\n const PREDEFINED_RESULTS_PER_PAGE_VALUES = [\n { label: '10', value: 10 },\n { label: '20', value: 20 },\n { label: '50', value: 50 }, // DEFAULT_NUMBER_OF_RESULTS\n { label: '75', value: 75 },\n { label: '100', value: 100 },\n ];\n\n export default defineComponent({\n name: 'bento-pagination-context-results-per-page',\n i18n: { messages },\n components: {\n BentoDropdown,\n BentoTypography,\n },\n props: {\n /*\n The amount of items the pager is paging through.\n /\n itemsPerPage: {\n type: Number,\n default: DEFAULT_NUMBER_OF_RESULTS,\n validator: (itemsPerPageValue: number) =>\n PREDEFINED_RESULTS_PER_PAGE_VALUES.some(({ value }) => value === itemsPerPageValue),\n },\n /\n The total number of items the pager is paging through.\n /\n totalCount: { type: Number, default: null },\n },\n emits: ['select'],\n setup(props, { emit }) {\n const dropdownId = generateUid('b-pagination-context-number-elements');\n const dropdownOptions = ref(PREDEFINED_RESULTS_PER_PAGE_VALUES);\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\n return {\n // Values\n dropdownId,\n dropdownOptions,\n i18nComponent,\n translationPathKey,\n\n // Methods\n getI18nProps,\n\n // Enums\n BentoTypographyElement,\n\n // Events\n onSelectChange,\n };\n },\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=\"BentoTypographyElement.DIV\">\n <component :is=\"i18nComponent\" v-bind=\"getI18nProps('pageOfTotalPages')\" tag=\"div\">\n <template #page>\n <bento-dropdown\n :id=\"dropdownId\"\n :value=\"page\"\n :items=\"listOfAvailablePages\"\n :aria-label=\"$t('pageOfTotalPages', { page, totalPages })\"\n class=\"b-pagination-context__dropdown\"\n @input=\"onPageSelectChange\"\n />\n </template>\n <template #totalPages>{{ totalPages }}</template>\n </component>\n </bento-typography>\n <bento-typography v-else-if=\"totalPages === 1\" :el=\"BentoTypographyElement.SPAN\">\n {{ $t('pageOneOfOne') }}\n </bento-typography>\n <bento-typography v-else :el=\"BentoTypographyElement.SPAN\">\n {{ $t('pageNumber', { page }) }}\n </bento-typography>\n </div>\n</template>\n\n<script lang=\"ts\">\n import { computed, defineComponent } from 'vue';\n import { BentoTypography, BentoTypographyElement } from '@/components/typography';\n import { BentoDropdown } from '@/components/dropdown';\n import { BentoListboxOptionItem } from '@/types';\n import { generateUid } from '@/utils/ts/unique-id';\n import messages from './messages.json';\n import { getI18nComponent, getI18nProps } from '../../../../utils/ts/i18n';\n\n export default defineComponent({\n i18n: { messages },\n name: 'bento-pagination-context',\n components: {\n BentoDropdown,\n BentoTypography,\n },\n props: {\n /\n The current page number of the pager.\n /\n page: {\n type: Number,\n default: 1,\n validator: (value: number) => Number.isFinite(value) && value > 0,\n },\n\n /\n The total number of items the pager is paging through.\n /\n totalPages: { type: Number, default: null },\n },\n emits: ['page-selected'],\n setup(props, { emit }) {\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: value.toString(),\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\n return {\n // Values\n dropdownId,\n listOfAvailablePages,\n i18nComponent,\n\n // Methods\n getI18nProps,\n\n // Events\n onPageSelectChange,\n\n // Enums\n BentoTypographyElement,\n };\n },\n });\n</script>\n\n<style lang=\"scss\" scoped src=\"./pagination-context.scss\" />\n","\n<template>\n <svg role=\"img\" v-bind=\"$attrs\" 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=\"#00112C\" fill-rule=\"evenodd\" d=\"M4.25 11C4.25 11.4142 4.58579 11.75 5 11.75C5.41421 11.75 5.75 11.4142 5.75 11L5.75 4.99999C5.75 4.58577 5.41421 4.24999 5 4.24999C4.58579 4.24999 4.25 4.58577 4.25 4.99998L4.25 11Z\" clip-rule=\"evenodd\"/><path fill=\"#00112C\" fill-rule=\"evenodd\" d=\"M11.5303 5.53031C11.8232 5.23742 11.8232 4.76255 11.5303 4.46965C11.2374 4.17676 10.7626 4.17676 10.4697 4.46965L7.46967 7.46965C7.17678 7.76255 7.17678 8.23742 7.46967 8.53031L10.4697 11.5303C10.7626 11.8232 11.2374 11.8232 11.5303 11.5303C11.8232 11.2374 11.8232 10.7625 11.5303 10.4697L9.06066 7.99998L11.5303 5.53031Z\" clip-rule=\"evenodd\"/></svg>\n</template>\n<script>\n let uuid = 0;\n\n export default {\n beforeCreate() {\n this.uuid = uuid.toString();\n uuid += 1;\n },\n };\n</script>\n<style scoped lang=\"scss\">\n svg {\n display: inline-flex;\n flex-shrink: 0;\n }\n \n svg,\n svg {\n fill: currentcolor;\n }\n</style>\n","\n<template>\n <svg role=\"img\" v-bind=\"$attrs\" 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=\"#00112C\" fill-rule=\"evenodd\" d=\"M4.46967 10.4697C4.17678 10.7626 4.17678 11.2374 4.46967 11.5303C4.76256 11.8232 5.23744 11.8232 5.53033 11.5303L8.53033 8.53032C8.82322 8.23743 8.82322 7.76256 8.53033 7.46966L5.53033 4.46966C5.23744 4.17677 4.76256 4.17677 4.46967 4.46966C4.17678 4.76256 4.17678 5.23743 4.46967 5.53032L6.93934 7.99999L4.46967 10.4697Z\" clip-rule=\"evenodd\"/><path fill=\"#00112C\" fill-rule=\"evenodd\" d=\"M11.75 4.99999C11.75 4.58578 11.4142 4.24999 11 4.24999C10.5858 4.24999 10.25 4.58578 10.25 4.99999V11C10.25 11.4142 10.5858 11.75 11 11.75C11.4142 11.75 11.75 11.4142 11.75 11L11.75 4.99999Z\" clip-rule=\"evenodd\"/></svg>\n</template>\n<script>\n let uuid = 0;\n\n export default {\n beforeCreate() {\n this.uuid = uuid.toString();\n uuid += 1;\n },\n };\n</script>\n<style scoped lang=\"scss\">\n svg {\n display: inline-flex;\n flex-shrink: 0;\n }\n \n svg,\n svg * {\n fill: currentcolor;\n }\n</style>\n","\n<template>\n <svg role=\"img\" v-bind=\"$attrs\" 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=\"#00112C\" fill-rule=\"evenodd\" d=\"M10.0303 4.46967C10.3232 4.76256 10.3232 5.23744 10.0303 5.53033L7.56066 8L10.0303 10.4697C10.3232 10.7626 10.3232 11.2374 10.0303 11.5303C9.73744 11.8232 9.26256 11.8232 8.96967 11.5303L5.96967 8.53033C5.67678 8.23744 5.67678 7.76256 5.96967 7.46967L8.96967 4.46967C9.26256 4.17678 9.73744 4.17678 10.0303 4.46967Z\" clip-rule=\"evenodd\"/></svg>\n</template>\n<script>\n let uuid = 0;\n\n export default {\n beforeCreate() {\n this.uuid = uuid.toString();\n uuid += 1;\n },\n };\n</script>\n<style scoped lang=\"scss\">\n svg {\n display: inline-flex;\n flex-shrink: 0;\n }\n \n svg,\n svg * {\n fill: currentcolor;\n }\n</style>\n","\n<template>\n <svg role=\"img\" v-bind=\"$attrs\" 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=\"#00112C\" fill-rule=\"evenodd\" d=\"M5.96967 11.5303C5.67678 11.2374 5.67678 10.7626 5.96967 10.4697L8.43934 8L5.96967 5.53033C5.67678 5.23744 5.67678 4.76256 5.96967 4.46967C6.26256 4.17678 6.73744 4.17678 7.03033 4.46967L10.0303 7.46967C10.171 7.61032 10.25 7.80109 10.25 8C10.25 8.19891 10.171 8.38968 10.0303 8.53033L7.03033 11.5303C6.73744 11.8232 6.26256 11.8232 5.96967 11.5303Z\" clip-rule=\"evenodd\"/></svg>\n</template>\n<script>\n let uuid = 0;\n\n export default {\n beforeCreate() {\n this.uuid = uuid.toString();\n uuid += 1;\n },\n };\n</script>\n<style scoped lang=\"scss\">\n svg {\n display: inline-flex;\n flex-shrink: 0;\n }\n \n svg,\n svg * {\n fill: currentcolor;\n }\n</style>\n","<template>\n <ul class=\"b-pagination-controls\">\n <li class=\"b-pagination-controls__item\">\n <!-- Navigate to the first page -->\n <bento-button\n :disabled=\"isCurrentPageFirst\"\n :variant=\"BentoButtonVariant.TERTIARY\"\n tertiary\n condensed\n @click=\"navigate(1)\"\n >\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\n :disabled=\"isCurrentPageFirst\"\n :variant=\"BentoButtonVariant.TERTIARY\"\n tertiary\n condensed\n @click=\"navigate(page - 1)\"\n >\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\n :disabled=\"isNextButtonDisabled\"\n :variant=\"BentoButtonVariant.TERTIARY\"\n tertiary\n condensed\n @click=\"navigate(page + 1)\"\n >\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=\"BentoButtonVariant.TERTIARY\"\n 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 lang=\"ts\">\n import { computed, defineComponent } from 'vue';\n import { BentoButton, BentoButtonVariant } from '@/components/button';\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 export default defineComponent({\n i18n: { messages },\n name: 'adl-pagination-controls',\n components: {\n BentoButton,\n SkipLeft,\n SkipRight,\n ChevronLeft,\n ChevronRight,\n },\n props: {\n /*\n Use to determine if the pager has a \"next page\".\n /\n hasNext: { type: Boolean, default: null },\n\n /\n The current page number of the pager.\n /\n page: { type: Number, required: true },\n\n /\n The current page number of the pager.\n /\n totalPages: { type: Number, default: null },\n },\n emits: ['navigate'],\n setup(props, { emit }) {\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\n return {\n // Values\n isNextButtonDisabled,\n isCurrentPageFirst,\n isCurrentPageLast,\n isLastPageButtonDisabled,\n\n // Events\n navigate,\n\n // Enums\n BentoButtonVariant,\n };\n },\n });\n</script>\n\n<style lang=\"scss\" scoped src=\"./pagination-controls.scss\" />\n","<template>\n <div class=\"b-pagination\">\n <nav :aria-label=\"ariaLabel\" 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\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 @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 lang=\"ts\">\n import { computed, defineComponent } from 'vue';\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 messages from './messages.json';\n\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 export default defineComponent({\n i18n: { messages },\n name: 'bento-pagination',\n components: {\n BentoPaginationContext,\n BentoPaginationControls,\n BentoPaginationResultsPerPage,\n },\n props: {\n /\n A brief description of the purpose of the navigation (for a11y).\n * Omit the term \"navigation\", as the screen reader will read both the role and the contents of the label.\n /\n ariaLabel: { type: String, default: null },\n\n /\n Use to determine if the pager has a \"next page\".\n /\n hasNext: { type: Boolean, default: null },\n\n /\n Toggles the visibility of the \"results per page\" part of the pagination component.\n /\n hidePageSize: {\n type: Boolean,\n default: false,\n },\n\n /\n The current page number of the pager.\n /\n page: {\n type: Number,\n default: 1,\n validator: (value: number) => Number.isFinite(value) && value > 0,\n },\n\n /\n The size of the items the pager is paging through.\n /\n size: {\n type: Number,\n default: 20,\n validator: (itemsPerPageValue: number) => [10, 20, 50, 75, 100].includes(itemsPerPageValue),\n },\n\n /\n The total number of items the pager is paging through.\n */\n totalCount: { type: Number, default: null },\n },\n emits: ['navigate', 'items-page', 'update:page', 'update:size'],\n setup(props, { emit }) {\n const totalPages = computed(() =>\n !props.totalCount \|\| !props.size ? null : Math.ceil(props.totalCount / props.size)\n );\n\n const navigate = (pageArg: number) => {\n emit('navigate', pageArg);\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);\n };\n\n const navigationConditionalClasses = computed(() => ({\n 'b-pagination__navigation--no-results-per-page': props.hidePageSize,\n }));\n\n return {\n // Values\n totalPages,\n navigationConditionalClasses,\n\n // Events\n navigate,\n onItemsPerPageChange,\n onPageSelected,\n };\n },\n });\n</script>\n\n<style lang=\"scss\" scoped src=\"./pagination.scss\" />\n"],"names":["DEFAULT_NUMBER_OF_RESULTS","PREDEFINED_RESULTS_PER_PAGE_VALUES","_sfc_main$7","defineComponent","messages$3","BentoDropdown","BentoTypography","itemsPerPageValue","value","props","emit","dropdownId","generateUid","dropdownOptions","ref","i18nComponent","getI18nComponent","onSelectChange","selectedNumberOfResults","translationPathKey","computed","getI18nProps","BentoTypographyElement","createVNode","_component_bento_typography","_ctx","openBlock","createBlock","resolveDynamicComponent","mergeProps","createSlots","withCtx","_component_bento_dropdown","_sfc_main$6","messages$2","onPageSelectChange","selectedPage","transformIntoOption","transformToPageNumber","index","listOfAvailablePages","uuid$3","createElementBlock","_hoisted_1$5","toDisplayString","uuid$2","_hoisted_1$4","uuid$1","_hoisted_1$3","uuid","_hoisted_1$2","_sfc_main$1","messages$1","BentoButton","SkipLeft","SkipRight","ChevronLeft","ChevronRight","isCurrentPageFirst","isCurrentPageLast","isNextButtonDisabled","isLastPageButtonDisabled","hasNoNextPage","hasNoTotalPagesNumber","pageArg","BentoButtonVariant","_hoisted_2$1","_hoisted_3$1","createElementVNode","_component_bento_button","_cache","$event","_component_skip_left","_component_chevron_left","_hoisted_4$1","_component_chevron_right","_hoisted_5","_component_skip_right","_sfc_main","messages","BentoPaginationContext","BentoPaginationControls","BentoPaginationResultsPerPage","totalPages","navigate","onPageSelected","pageNumber","onItemsPerPageChange","elements","navigationConditionalClasses","_component_bento_pagination_controls","resolveComponent","_hoisted_1","createCommentVNode","_hoisted_3","_component_bento_pagination_context","_hoisted_4"],"mappings":"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","x_google_ignoreList":[2,3,4,5]}