@adyen/bento-vue2 1.60.1 → 1.61.0

package/dist/internal.js

@@ -1,17 +1,17 @@
-import { a as e, b as r, C as t, c as s, d as p } from "./chunks/calendar.DQiq_EoU.js";
-import { C as n, a as l } from "./chunks/copy.Bod4H2Dk.js";
+import { a as e, b as r, C as t, c as s, d as p } from "./chunks/calendar.CjVkJzjc.js";
+import { C as n, a as l } from "./chunks/copy.qU5LvaNi.js";
 import { C as f } from "./chunks/controls-group.C4CHrb6Y.js";
-import { B as I, b as m, a as E, D as T } from "./chunks/dialog-page.C5r6tM57.js";
+import { B as I, b as m, a as E, D as T } from "./chunks/dialog-page.CDV828kt.js";
 import { E as d, F as N } from "./chunks/error-message.BAE9B9-N.js";
-import { F as O } from "./chunks/fixed-scroller.D0a6q8_i.js";
+import { F as O } from "./chunks/fixed-scroller.DPiQh_o-.js";
 import { G as A, a as L } from "./chunks/grid-layout.HvTAa4to.js";
-import { I as c } from "./chunks/info-icon-with-popover.XZqkxPsB.js";
-import { b, c as g, u as y } from "./chunks/use-cached-selected-values.9OnD_j5F.js";
+import { I as c } from "./chunks/info-icon-with-popover.B4Q8jmW7.js";
+import { b, c as g, u as y } from "./chunks/use-cached-selected-values.C-umGJXi.js";
 import { L as F } from "./chunks/listbox-option-tag.CczGPhWH.js";
 import { B as M } from "./chunks/teleport.BV6zrDjA.js";
 import { T as h } from "./chunks/tooltip.DyZIyMZN.js";
-import { B as J } from "./chunks/button-actions-with-menu.S7i4V-8E.js";
-import { f as R } from "./chunks/button-actions.BFtzsfNe.js";
+import { B as J } from "./chunks/button-actions-with-menu.YN379eYi.js";
+import { f as R } from "./chunks/button-actions.CHZ2BT5_.js";
 export {
   R as BUTTON_ACTIONS_WITH_MENU_CONTAINER_INJECTION_KEY,
   I as BentoDialogPageAnimation,

package/dist/menu.js

@@ -1,4 +1,4 @@
-import { B as o, a as t } from "./chunks/menu.CT0SIn4v.js";
+import { B as o, a as t } from "./chunks/menu.B_DCBdeN.js";
 export {
   o as BentoMenu,
   t as BentoMenuEvent

package/dist/modal-fullscreen.js

@@ -1,4 +1,4 @@
-import { m as o, B as a } from "./chunks/modal-fullscreen.tofT1h0P.js";
+import { m as o, B as a } from "./chunks/modal-fullscreen.cBUMfJhU.js";
 export {
   o as BentoModalFullscreen,
   a as BentoModalFullscreenPage

package/dist/modal.js

@@ -1,5 +1,5 @@
-import { d as e, f as t, g as n, B as l, e as B, c as d, a as M, b as s } from "./chunks/base-modal.xA_DhHx9.js";
-import { B as i } from "./chunks/modal.CiYtGu6u.js";
+import { d as e, f as t, g as n, B as l, e as B, c as d, a as M, b as s } from "./chunks/base-modal.BKjjZPZw.js";
+import { B as i } from "./chunks/modal.DWkmyvRc.js";
 export {
   i as BentoModal,
   e as BentoModalColumnLayoutVariant,

package/dist/pagination.js

@@ -1,4 +1,4 @@
-import { B as n } from "./chunks/pagination.B-EP9Lkq.js";
+import { B as n } from "./chunks/pagination.pzY_1Qqp.js";
 export {
   n as BentoPagination
 };

package/dist/popover.js

@@ -1,4 +1,4 @@
-import { B as r, a as s } from "./chunks/popover.COaHa4ES.js";
+import { B as r, a as s } from "./chunks/popover.BN2VK6KG.js";
 export {
   r as BentoPopover,
   s as BentoPopoverPositions

package/dist/promo-banner.js

@@ -1,4 +1,4 @@
-import { p as r, B as a, a as e } from "./chunks/promo-banner.DJpA7Whg.js";
+import { p as r, B as a, a as e } from "./chunks/promo-banner.Cua4uX1x.js";
 export {
   r as BentoPromoBanner,
   a as BentoPromoBannerColor,

package/dist/rich-text-editor.js

@@ -1,4 +1,4 @@
-import { r as t } from "./chunks/rich-text-editor.C4NdjtLA.js";
+import { r as t } from "./chunks/rich-text-editor.BRlygI8q.js";
 export {
   t as BentoRichTextEditor
 };

package/dist/search-bar.js

@@ -1,5 +1,5 @@
-import { B as r, b as t, a as B } from "./chunks/search-bar.B4u_IgiI.js";
-import { u as o } from "./chunks/dropdown.Cx-3TGBk.js";
+import { B as r, b as t, a as B } from "./chunks/search-bar.C10szx9Q.js";
+import { u as o } from "./chunks/dropdown.3c5SsPV1.js";
 export {
   r as BentoSearchBar,
   t as BentoSearchBarEvent,

package/dist/secondary-nav.js

@@ -1,4 +1,4 @@
-import { s as e } from "./chunks/secondary-nav.EROJ_sJQ.js";
+import { s as e } from "./chunks/secondary-nav.Bdxei6WP.js";
 export {
   e as BentoSecondaryNav
 };

package/dist/sidepanel.js

@@ -1,4 +1,4 @@
-import { a as n, B as o, s as t } from "./chunks/sidepanel.3EBWM8JV.js";
+import { a as n, B as o, s as t } from "./chunks/sidepanel.X5Te2FiT.js";
 export {
   n as BentoSidepanel,
   o as BentoSidepanelEvent,

package/dist/structured-list.js

@@ -1,4 +1,4 @@
-import { B as r, a as o } from "./chunks/structured-list-item.rOTJM0uc.js";
+import { B as r, a as o } from "./chunks/structured-list-item.n5vrbuW9.js";
 export {
   r as BentoStructuredList,
   o as BentoStructuredListItem

package/dist/styles/bento-dark.css

@@ -97,6 +97,7 @@
   --b-radio-button-knob-size: 8px;
   --b-radio-button-knob-offset-error: 2.5px;
   --b-radio-button-knob-offset: 3px;
+  --b-radio-button-line-height: 20px;
   --b-popover-border: unset;
   --b-modal-header-container-padding-block: 19px;
   --b-loading-button-tertiary-loading-text-decoration: underline;

package/dist/styles/bento-light.css

@@ -96,6 +96,7 @@
   --b-radio-button-knob-size: 8px;
   --b-radio-button-knob-offset-error: 2.5px;
   --b-radio-button-knob-offset: 3px;
+  --b-radio-button-line-height: 20px;
   --b-popover-border: unset;
   --b-modal-header-container-padding-block: 19px;
   --b-loading-button-tertiary-loading-text-decoration: underline;

package/dist/styles/bento.css

@@ -96,6 +96,7 @@
   --b-radio-button-knob-size: 8px;
   --b-radio-button-knob-offset-error: 2.5px;
   --b-radio-button-knob-offset: 3px;
+  --b-radio-button-line-height: 20px;
   --b-popover-border: unset;
   --b-modal-header-container-padding-block: 19px;
   --b-loading-button-tertiary-loading-text-decoration: underline;

package/dist/styles/legacy.css

@@ -123,6 +123,7 @@
   --b-radio-button-knob-size: 6px;
   --b-radio-button-knob-offset-error: 3.5px;
   --b-radio-button-unchecked-error-border-width: 1.5px;
+  --b-radio-button-line-height: 20px;
   --b-popover-box-shadow: 0px 8px 8px rgba(0, 17, 44, 0.04), 0px 2px 4px rgba(0, 17, 44, 0.08);
   --b-modal-backdrop-background-color: #00112c;
   --b-modal-header-container-padding-block: 19px;

package/dist/styles/styleguide.css

@@ -96,6 +96,7 @@
   --b-radio-button-knob-size: 8px;
   --b-radio-button-knob-offset-error: 2.5px;
   --b-radio-button-knob-offset: 3px;
+  --b-radio-button-line-height: 20px;
   --b-popover-border: unset;
   --b-modal-header-container-padding-block: 19px;
   --b-loading-button-tertiary-loading-text-decoration: underline;

package/dist/summary-grid.js

@@ -1,4 +1,4 @@
-import { s as r, a as t, e as a, b as o, c as i, B as n, d as u, f as d } from "./chunks/summary-grid.types.Bg1Y7i-F.js";
+import { s as r, a as t, e as a, b as o, c as i, B as n, d as u, f as d } from "./chunks/summary-grid.types.D23lQ-e5.js";
 export {
   r as BentoSummaryGrid,
   t as BentoSummaryGridItemAmount,

package/dist/tabs.js

@@ -1,4 +1,4 @@
-import { B as e, a as s } from "./chunks/tabs.DX_Gq12z.js";
+import { B as e, a as s } from "./chunks/tabs.DKehFLDL.js";
 export {
   e as BentoTab,
   s as BentoTabs

package/dist/textarea.js

@@ -1,4 +1,4 @@
-import { B as o } from "./chunks/textarea.0PapD8Nl.js";
+import { B as o } from "./chunks/textarea.D09495Nz.js";
 export {
   o as BentoTextarea
 };

package/dist/timeline.js

@@ -1,4 +1,4 @@
-import { t, b as i, a, c as m, B as o, d as l } from "./chunks/timeline-item.IFw76Qeh.js";
+import { t, b as i, a, c as m, B as o, d as l } from "./chunks/timeline-item.DKPI-4iu.js";
 export {
   t as BentoTimeline,
   i as BentoTimelineGapUnit,

package/dist/toast.js

@@ -1,4 +1,4 @@
-import { t as a } from "./chunks/toast.B2u2W_TQ.js";
+import { t as a } from "./chunks/toast.C_uVjJnK.js";
 export {
   a as BentoToast
 };

package/dist/tutorial.js

@@ -1,4 +1,4 @@
-import { t as r } from "./chunks/tutorial.suIRmXta.js";
+import { t as r } from "./chunks/tutorial.DgmK5EEo.js";
 export {
   r as BentoTutorial
 };

package/dist/web-types.json

@@ -1,7 +1,7 @@
 {
   "framework": "vue",
   "name": "@adyen/bento-vue2",
-  "version": "1.60.1",
+  "version": "1.61.0",
   "contributions": {
     "html": {
       "description-markup": "markdown",
@@ -4224,6 +4224,16 @@
               },
               "default": "null"
             },
+            {
+              "name": "popoverTitle",
+              "required": false,
+              "description": "Title showed in the popover on hover",
+              "value": {
+                "kind": "expression",
+                "type": "string"
+              },
+              "default": "null"
+            },
             {
               "name": "popoverPosition",
               "required": false,
@@ -6021,6 +6031,15 @@
                 "type": "BentoDropdownVirtulisationOptions"
               },
               "default": "false"
+            },
+            {
+              "name": "enableValueLabelPair",
+              "description": "Enables value/label value handling. When `true`, the component expects and emits value/label\npair objects instead of primitive values.\n\nThis affects both the `value` prop and the `input` event payload.\n\n- **Input (`value` prop):** Expects a `{ value: string | number, label: string }` object (or an array of them for multi-select).\n- **Output (`input` event):** Emits a `{ value: string | number, label: string }` object (or an array of them) upon selection.\n\nThis is particularly useful when a selected item's label is not available in the `items` prop,\nallowing the component to display the correct label for values loaded from external sources.",
+              "value": {
+                "kind": "expression",
+                "type": "boolean"
+              },
+              "default": "false"
             }
           ],
           "events": [

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@adyen/bento-vue2",
-  "version": "1.60.1",
+  "version": "1.61.0",
   "description": "Adyen Bento Vue2 components",
   "main": "dist/index.js",
   "module": "dist/index.js",
@@ -46,7 +46,7 @@
     "unified": "11.0.5",
     "uuid": "11.0.5",
     "vue-demi": "0.14.10",
-    "@adyen/bento-design-tokens": "1.60.1"
+    "@adyen/bento-design-tokens": "1.61.0"
   },
   "peerDependencies": {
     "vue": "~2.7",
@@ -136,11 +136,11 @@
     "vue-style-loader": "4.1.3",
     "vue-template-compiler": "2.7.16",
     "vue-tsc": "1.0.24",
-    "@adyen/bento-cli": "0.3.1",
+    "@adyen/bento-cli": "0.3.0",
     "@adyen/bento-core": "0.0.1",
     "@adyen/bento-tailwind": "0.3.11",
-    "@adyen/ui-assets-icons-16": "6.3.1",
-    "@adyen/ui-assets-payment-method-icons": "9.2.1"
+    "@adyen/ui-assets-icons-16": "6.3.0",
+    "@adyen/ui-assets-payment-method-icons": "9.2.0"
   },
   "optionalDependencies": {
     "vue-router": "~3.6"

package/dist/chunks/button.BuD-IsW5.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"button.BuD-IsW5.js","sources":["../../../core/src/components/button/button.types.ts","../../src/components/button/button.vue"],"sourcesContent":["/**\n * @deprecated for usage with properties since version 2.0. Use the string literal instead.\n */\nexport enum BentoButtonVariant {\n    PRIMARY = 'primary',\n    SECONDARY = 'secondary',\n    TERTIARY = 'tertiary',\n    TERTIARY_WITH_BACKGROUND = 'tertiary-with-background',\n}\n\nexport enum BentoButtonPropClass {\n    CONDENSED = 'condensed',\n    DESTRUCTIVE = 'critical',\n    DISABLED = 'disabled',\n    ICON_ONLY = 'icon-only',\n    INVERSE = 'inverse',\n}\n\nexport interface BentoButtonProps {\n    condensed?: boolean;\n    critical?: boolean;\n    disabled?: boolean;\n    inverse?: boolean;\n    variant?: BentoButtonVariant | `${BentoButtonVariant}`;\n    type?: string;\n    link?: object;\n}\n","<template>\n    <component\n        :is=\"componentType\"\n        v-bind=\"componentProps\"\n        class=\"b-button\"\n        :class=\"{ ...conditionalClasses, ...getIconOnlyClass() }\"\n        @click.capture=\"onClickButton\"\n    >\n        <span\n            v-if=\"hasSlot('iconLeft')\"\n            class=\"b-button__icon-left\"\n            data-testid=\"icon-button-left\"\n            :aria-hidden=\"hasSlot('default') ? 'true' : null\"\n        >\n            <slot name=\"iconLeft\" />\n        </span>\n        <bento-typography v-if=\"hasSlot('default')\" el=\"span\" variant=\"body\" stronger class=\"b-button__label\">\n            <slot />\n        </bento-typography>\n        <span\n            v-if=\"hasSlot('iconRight')\"\n            class=\"b-button__icon-right\"\n            data-testid=\"icon-button-right\"\n            :aria-hidden=\"hasSlot('default') ? 'true' : null\"\n        >\n            <slot name=\"iconRight\" />\n        </span>\n    </component>\n</template>\n\n<script setup lang=\"ts\">\n    import { computed, PropType, useAttrs, useSlots } from 'vue';\n    import { BentoButtonPropClass, BentoButtonVariant } from '@/core/components/button/button.types';\n    import { BentoTypography } from '@/components/typography';\n    import { useHasSlot } from '@/composables/use-has-slot/use-has-slot';\n    import { Booleanish } from '@/types/prop-types';\n    import type { RouterLinkProps } from 'vue-router/types/router.d.ts';\n    import type { AnchorHTMLAttributes, ButtonHTMLAttributes } from 'vue/types/jsx.d.ts';\n    import { BentoLink, BentoLinkVariant } from '@/components/link';\n\n    // TODO: replace all this code when migrated to Vue 3 is complete as this is the only\n    // current way to extend the `router-link` component in Vue 2 and Vue Router 3\n    export interface LinkProps extends RouterLinkProps, AnchorHTMLAttributes {\n        args?: { props: RouterLinkProps };\n\n        /**\n         * Set the rendered link to a regular external anchor link.\n         */\n        external: boolean;\n    }\n\n    const props = defineProps({\n        /**\n         * Reduces sizing of button\n         */\n        condensed: { type: Boolean, default: false },\n\n        /**\n         * Displays button as critical\n         */\n        critical: { type: Boolean, default: false },\n\n        /**\n         * Disables button functionality\n         */\n        disabled: { type: Boolean, default: false },\n\n        /**\n         * Sets color set to inverse\n         */\n        inverse: { type: Boolean, default: false },\n\n        /**\n         * Object containing props passed on to the BentoLink component. @see BentoLink documentation for which properties you can pass.\n         */\n        link: { type: Object, default: undefined },\n\n        /**\n         * The default behavior of the button.\n         * Possible values are: 'button', 'reset', 'submit'\n         */\n        type: {\n            type: String as PropType<ButtonHTMLAttributes['type']>,\n            default: 'button',\n        },\n\n        /**\n         * Types of flavour of Button\n         * @values primary, secondary, tertiary, tertiary-with-background\n         */\n        variant: {\n            type: String as PropType<BentoButtonVariant | `${BentoButtonVariant}`>,\n            default: BentoButtonVariant.PRIMARY,\n            validator: (value: BentoButtonVariant) => Object.values(BentoButtonVariant).includes(value),\n        },\n    });\n\n    const emit = defineEmits([\"blur\", \"click\", \"focus\", \"keydown.esc\"]);\n\n    const attrs = useAttrs();\n    const slots = useSlots();\n    const hasSlot = useHasSlot(slots);\n\n    const componentType = computed(() => {\n        if (props?.link !== undefined) {\n            return BentoLink;\n        }\n        return 'button';\n    });\n    const ariaAttributes = computed(() => ({\n        'aria-controls': attrs['aria-controls']?.toString() as string,\n        'aria-expanded': attrs['aria-expanded']?.toString() as Booleanish,\n    }));\n\n    const componentProps = computed(() =>\n        componentType.value === 'button'\n            ? {\n                  ...ariaAttributes.value,\n                  disabled: props.disabled,\n                  type: props.type,\n              }\n            : { ...props.link, disableTypography: true, variant: BentoLinkVariant.DEFAULT, isButton: true }\n    );\n\n    const variantClass = computed(() => ({\n        [`b-button--${props.variant}${props.critical ? `-${BentoButtonPropClass.DESTRUCTIVE}` : ''}`]: true,\n    }));\n\n    const conditionalClasses = computed(() => ({\n        ...variantClass.value,\n        [`b-button--${BentoButtonPropClass.CONDENSED}`]: props.condensed,\n        [`b-button--${BentoButtonPropClass.DISABLED}`]: props.disabled,\n        [`b-button--${BentoButtonPropClass.INVERSE}`]: props.inverse,\n    }));\n\n    const getIconOnlyClass = () => ({\n        [`b-button--${BentoButtonPropClass.ICON_ONLY}`]: !hasSlot('default'),\n    });\n\n    const onClickButton = (e: MouseEvent) => {\n        if (!props.disabled) {\n            emit('click', e);\n        } else {\n            e.preventDefault();\n            e.stopPropagation();\n        }\n    };\n</script>\n\n<script lang=\"ts\">\n    /**\n     * Button component for all the various types of bento buttons.\n     *\n     * @example\n     * import { BentoButton } from '@adyen/bento-vue2';\n     * import { CheckMarkIcon } from '@adyen/ui-assets-icons-16';\n     *\n     * export default {\n     *     components: { BentoButton },\n     *     template: `\n     *         <bento-button\n     *             disabled\n     *             variant=\"secondary\"\n     *         >\n     *              <template #iconLeft>\n     *                  <check-mark svg-title=\"checked\" />\n     *              </template>\n     *\n     *              Button text\n     *\n     *              <template #iconRight>\n     *                  <check-mark svg-title=\"checked\" />\n     *              </template>\n     *         </bento-button>\n     *     `,\n     * }\n     */\n    export default {\n        name: 'bento-button',\n    };\n</script>\n\n<style lang=\"scss\" scoped src=\"@/core/components/button/button.scss\" />\n"],"names":["BentoButtonVariant","BentoButtonVariant2","BentoButtonPropClass","BentoButtonPropClass2","__default__","attrs","useAttrs","slots","useSlots","hasSlot","useHasSlot","componentType","computed","props","BentoLink","ariaAttributes","_a","_b","componentProps","BentoLinkVariant","variantClass","conditionalClasses","e","emit"],"mappings":";;;;;;AAGY,IAAAA,IAAA,kBAAAC,OACRA,EAAA,UAAA,WACAA,EAAA,YAAA,aACAA,EAAA,WAAA,YACAA,EAAA,2BAAA,4BAJQA,IAAAD,KAAA,CAAA,CAAA,GAOAE,IAAA,kBAAAC,OACRA,EAAA,YAAA,aACAA,EAAA,cAAA,YACAA,EAAA,WAAA,YACAA,EAAA,YAAA,aACAA,EAAA,UAAA,WALQA,IAAAD,KAAA,CAAA,CAAA;ACuKR,MAAAE,IAAA;AAAA,EAAe,MAAA;AAEf;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;iBAhFAC,IAAAC,EAAA,GACAC,IAAAC,EAAA,GACAC,IAAAC,EAAAH,CAAA,GAEAI,IAAAC,EAAA,OACIC,KAAA,gBAAAA,EAAA,UAAA,SACIC,IAEJ,QAAO,GAEXC,IAAAH,EAAA,MAAA;;AAAA;AAAA,QAAuC,kBAAAI,IAAAX,EAAA,eAAA,MAAA,gBAAAW,EAAA;AAAA,QACe,kBAAAC,IAAAZ,EAAA,eAAA,MAAA,gBAAAY,EAAA;AAAA,MACA;AAAA,KAAA,GAGtDC,IAAAN;AAAA,MAAuB,MAAAD,EAAA,UAAA,WAAA;AAAA,QAEb,GAAAI,EAAA;AAAA,QACsB,UAAAF,EAAA;AAAA,QACF,MAAAA,EAAA;AAAA,MACJ,IAAA,EAAA,GAAAA,EAAA,MAAA,mBAAA,IAAA,SAAAM,EAAA,SAAA,UAAA,GAAA;AAAA,IAE4E,GAGtGC,IAAAR,EAAA,OAAA;AAAA,MAAqC,CAAA,aAAAC,EAAA,OAAA,GAAAA,EAAA,WAAA,IAAAX,EAAA,WAAA,KAAA,EAAA,EAAA,GAAA;AAAA,IAC8D,EAAA,GAGnGmB,IAAAT,EAAA,OAAA;AAAA,MAA2C,GAAAQ,EAAA;AAAA,MACvB,CAAA,aAAAlB,EAAA,SAAA,EAAA,GAAAW,EAAA;AAAA,MACuC,CAAA,aAAAX,EAAA,QAAA,EAAA,GAAAW,EAAA;AAAA,MACD,CAAA,aAAAX,EAAA,OAAA,EAAA,GAAAW,EAAA;AAAA,IACD,EAAA;6LAGzD,OAAA;AAAA,MAAgC,CAAA,aAAAX,EAAA,SAAA,EAAA,GAAA,CAAAO,EAAA,SAAA;AAAA,IACuC,mBAGvE,CAAAa,MAAA;AACI,MAAAT,EAAA,YAGIS,EAAA,eAAA,GACAA,EAAA,gBAAA,KAHAC,EAAA,SAAAD,CAAA;AAAA,IAIJ;;;;;;;;;;;;;;;;;"}

package/dist/chunks/dashed-underline.CY5J4pZp.js

@@ -1,65 +0,0 @@
-import { defineComponent as T, useSlots as h, ref as l, computed as v, watch as P } from "vue";
-import { B } from "./popover.COaHa4ES.js";
-import { B as O } from "./typography.J1v_SPG3.js";
-import { u as x } from "./use-has-slot.C9lQZ6nz.js";
-import { B as g } from "./tooltip.DyZIyMZN.js";
-import { B as S } from "./teleport.BV6zrDjA.js";
-import { n as b } from "./_plugin-vue2_normalizer.CeySl7Fu.js";
-import "../assets/dashed-underline.css";
-const I = {}, w = /* @__PURE__ */ T({
-  ...I,
-  __name: "dashed-underline",
-  props: {
-    popoverText: { default: null },
-    popoverPosition: { default: "top" },
-    popoverSize: { default: "fit-content" },
-    teleport: { default: () => ({
-      disabled: !0
-    }) },
-    tooltipText: { default: null },
-    tooltipPosition: { default: "top" }
-  },
-  setup(a) {
-    const o = a, n = 200, e = h(), s = x(e), r = l(null), p = l(!1), i = l(), c = () => {
-      p.value = !0, i.value && clearTimeout(i.value);
-    }, u = () => {
-      const t = setTimeout(() => {
-        p.value = !1;
-      }, n);
-      i.value = t;
-    }, m = () => {
-      c();
-    }, _ = (t) => {
-      (!r.value || !((t == null ? void 0 : t.relatedTarget) instanceof Element) || !r.value.contains(t.relatedTarget)) && u();
-    }, d = v(() => o.popoverText || s("popover-content")), f = v(() => !o.tooltipText && !d.value);
-    return P(
-      f,
-      (t) => {
-        if (t)
-          throw new Error(
-            "BentoDashedUnderline requires either a tooltip or a popover to be configured. Check the docs for more info."
-          );
-      },
-      { immediate: !0 }
-    ), { __sfc: !0, CLOSING_POPOVER_DELAY_MS: n, props: o, slots: e, hasSlot: s, element: r, isOpen: p, closingTimeOutId: i, openPopover: c, closePopover: u, infoIconOnFocus: m, infoIconOnFocusOut: _, hasPopover: d, shouldShowTooltipPopoverError: f, BentoPopover: B, vBentoTooltipDirective: g, BentoTypography: O, BentoTeleport: S };
-  }
-});
-var y = function() {
-  var s, r;
-  var o = this, n = o._self._c, e = o._self._setupProxy;
-  return n("span", { directives: [{ name: "bento-tooltip-directive", rawName: "v-bento-tooltip-directive:[tooltipPosition]", value: o.tooltipText, expression: "tooltipText", arg: o.tooltipPosition }], ref: "element", staticClass: "b-dashed-underline", attrs: { tabindex: "0" }, on: { mouseenter: e.openPopover, mouseleave: e.closePopover, focus: e.infoIconOnFocus, focusout: e.infoIconOnFocusOut } }, [o._t("default"), e.element && e.hasPopover ? n(e.BentoTeleport, { attrs: { disabled: (s = o.teleport) == null ? void 0 : s.disabled, to: (r = o.teleport) == null ? void 0 : r.to } }, [n(e.BentoPopover, { attrs: { open: e.isOpen, "target-element": e.element, position: o.popoverPosition, role: "tooltip", "fit-content": o.popoverSize === "fit-content" || void 0, large: o.popoverSize === "large" || void 0, small: o.popoverSize === "small" || void 0, "disable-focus-trap": "" } }, [o._t("popover-content", function() {
-    return [n(e.BentoTypography, [o._v(" " + o._s(o.popoverText) + " ")])];
-  })], 2)], 1) : o._e()], 2);
-}, z = [], C = /* @__PURE__ */ b(
-  w,
-  y,
-  z,
-  !1,
-  null,
-  "71dfd666"
-);
-const k = C.exports;
-export {
-  k as B
-};
-//# sourceMappingURL=dashed-underline.CY5J4pZp.js.map

package/dist/chunks/dashed-underline.CY5J4pZp.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"dashed-underline.CY5J4pZp.js","sources":["../../src/components/dashed-underline/dashed-underline.vue"],"sourcesContent":["<template>\n    <span\n        ref=\"element\"\n        v-bento-tooltip-directive:[tooltipPosition]=\"tooltipText\"\n        class=\"b-dashed-underline\"\n        tabindex=\"0\"\n        @mouseenter=\"openPopover\"\n        @mouseleave=\"closePopover\"\n        @focus=\"infoIconOnFocus\"\n        @focusout=\"infoIconOnFocusOut\"\n    >\n        <slot></slot>\n        <bento-teleport v-if=\"element && hasPopover\" :disabled=\"teleport?.disabled\" :to=\"teleport?.to\">\n            <bento-popover\n                :open=\"isOpen\"\n                :target-element=\"element\"\n                :position=\"popoverPosition\"\n                role=\"tooltip\"\n                :fit-content=\"popoverSize === 'fit-content' || undefined\"\n                :large=\"popoverSize === 'large' || undefined\"\n                :small=\"popoverSize === 'small' || undefined\"\n                disable-focus-trap\n            >\n                <slot name=\"popover-content\">\n                    <bento-typography>\n                        {{ popoverText }}\n                    </bento-typography>\n                </slot>\n            </bento-popover>\n        </bento-teleport>\n    </span>\n</template>\n\n<script lang=\"ts\" setup>\n    import { computed, ref, useSlots, watch } from 'vue';\n    import { BentoPopover } from '@/components/popover';\n    import { BentoTooltipDirective as vBentoTooltipDirective } from '@/directives/tooltip/index';\n    import { BentoTypography } from '@/components/typography';\n    import { useHasSlot } from '@/composables';\n    import { BentoTeleport } from '@/internal';\n    import { BentoDashedUnderlineProps } from './dashed-underline.types';\n\n    const CLOSING_POPOVER_DELAY_MS = 200;\n\n    const props = defineProps({\n  popoverText: { default: null },\n  popoverPosition: { default: 'top' },\n  popoverSize: { default: 'fit-content' },\n  teleport: { default: () => ({\n            disabled: true,\n        }) },\n  tooltipText: { default: null },\n  tooltipPosition: { default: 'top' }\n});\n\n    const slots = useSlots();\n    const hasSlot = useHasSlot(slots);\n\n    const element = ref<HTMLSpanElement>(null);\n    const isOpen = ref(false);\n\n    const closingTimeOutId = ref();\n\n    const openPopover = () => {\n        isOpen.value = true;\n        if (closingTimeOutId.value) {\n            clearTimeout(closingTimeOutId.value);\n        }\n    };\n\n    const closePopover = () => {\n        // We want to delay closing for a couple of seconds so\n        // it doesn't flicker if a user hovers over the icon and then inside the popover.\n        const timeOutId = setTimeout(() => {\n            isOpen.value = false;\n        }, CLOSING_POPOVER_DELAY_MS);\n        closingTimeOutId.value = timeOutId;\n    };\n\n    const infoIconOnFocus = () => {\n        openPopover();\n    };\n\n    /**\n     * Only close popover on blur if the newly focus element is not a child of this element\n     * @param e - the event that contains the newly focused element\n     */\n    const infoIconOnFocusOut = (e: FocusEvent) => {\n        if (!element.value || !(e?.relatedTarget instanceof Element) || !element.value.contains(e.relatedTarget)) {\n            closePopover();\n        }\n    };\n\n    const hasPopover = computed(() => props.popoverText || hasSlot('popover-content'));\n\n    const shouldShowTooltipPopoverError = computed(() => !props.tooltipText && !hasPopover.value);\n\n    watch(\n        shouldShowTooltipPopoverError,\n        value => {\n            if (value) {\n                throw new Error(\n                    'BentoDashedUnderline requires either a tooltip or a popover to be configured. Check the docs for more info.'\n                );\n            }\n        },\n        { immediate: true }\n    );\n</script>\n\n<script lang=\"ts\">\n    /**\n     * The dashed underline serves as a visual cue to indicate that additional information is available for\n     * a specific word or phrase without adding an icon.\n     *\n     * @example\n     * import { BentoDashedUnderline } from '@adyen/bento-vue2';\n     *\n     * export default {\n     *     components: { BentoDashedUnderline },\n     *     template: `\n     *          <bento-dashed-underline>\n     *              annotated text\n     *          </bento-dashed-underline>\n     *     `\n     * }\n     */\n    export default {};\n</script>\n\n<style lang=\"scss\" scoped src=\"./dashed-underline.scss\" />\n"],"names":["__default__","CLOSING_POPOVER_DELAY_MS","slots","useSlots","hasSlot","useHasSlot","element","ref","isOpen","closingTimeOutId","openPopover","closePopover","timeOutId","infoIconOnFocus","infoIconOnFocusOut","e","hasPopover","computed","props","shouldShowTooltipPopoverError","watch","value"],"mappings":";;;;;;;;AA+HI,MAAAA,IAAA,CAAA;;;;;;;;;;;;;;iBArFAC,IAAA,KAaAC,IAAAC,EAAA,GACAC,IAAAC,EAAAH,CAAA,GAEAI,IAAAC,EAAA,IAAA,GACAC,IAAAD,EAAA,EAAA,GAEAE,IAAAF,EAAA,GAEAG,IAAA,MAAA;AACI,MAAAF,EAAA,QAAA,IACAC,EAAA,SACI,aAAAA,EAAA,KAAA;AAAA,IACJ,GAGJE,IAAA,MAAA;AAGI,YAAAC,IAAA,WAAA,MAAA;AACI,QAAAJ,EAAA,QAAA;AAAA,MAAe,GAAAP,CAAA;AAEnB,MAAAQ,EAAA,QAAAG;AAAA,IAAyB,GAG7BC,IAAA,MAAA;AACI,MAAAH,EAAA;AAAA,IAAY,GAOhBI,IAAA,CAAAC,MAAA;AACI,OAAA,CAAAT,EAAA,SAAA,GAAAS,KAAA,gBAAAA,EAAA,0BAAA,YAAA,CAAAT,EAAA,MAAA,SAAAS,EAAA,aAAA,MACIJ,EAAA;AAAA,IACJ,GAGJK,IAAAC,EAAA,MAAAC,EAAA,eAAAd,EAAA,iBAAA,CAAA,GAEAe,IAAAF,EAAA,MAAA,CAAAC,EAAA,eAAA,CAAAF,EAAA,KAAA;AAEA,WAAAI;AAAA,MAAAD;AAAA,MACI,CAAAE,MAAA;AAEI,YAAAA;AACI,gBAAA,IAAA;AAAA,YAAU;AAAA,UACN;AAAA,MAER;AAAA,MACJ,EAAA,WAAA,GAAA;AAAA,IACkB;;;;;;;;;;;;;;;;;;"}