@adyen/bento-vue3 1.55.1 → 1.56.0

package/dist/chunks/{button.DEVuqLVT.js → button.BHZgsGkp.js}

@@ -1,21 +1,13 @@
-import { defineComponent as C, useAttrs as N, useSlots as T, computed as n, createBlock as f, openBlock as i, resolveDynamicComponent as h, mergeProps as A, withCtx as m, createElementBlock as y, createCommentVNode as c, unref as r, renderSlot as d } from "vue";
+import { defineComponent as I, useAttrs as C, useSlots as N, computed as i, createBlock as f, openBlock as r, resolveDynamicComponent as T, mergeProps as A, withCtx as m, createElementBlock as y, createCommentVNode as c, unref as n, renderSlot as d } from "vue";
 import { B as O } from "./typography.DN5eC5ch.js";
 import { u as $ } from "./use-has-slot.B7eQSabc.js";
 import { B as L, a as Y } from "./link.D3Fq5tt_.js";
 import { _ as B } from "./_plugin-vue_export-helper.CHgC5LLL.js";
 import "../assets/button.css";
-var u = /* @__PURE__ */ ((t) => (t.PRIMARY = "primary", t.SECONDARY = "secondary", t.TERTIARY = "tertiary", t.TERTIARY_WITH_BACKGROUND = "tertiary-with-background", t))(u || {}), a = /* @__PURE__ */ ((t) => (t.CONDENSED = "condensed", t.DESTRUCTIVE = "critical", t.DISABLED = "disabled", t.ICON_ONLY = "icon-only", t.INVERSE = "inverse", t))(a || {});
-const U = {
-  key: 0,
-  class: "b-button__icon-left",
-  "data-testid": "icon-button-left"
-}, w = {
-  key: 2,
-  class: "b-button__icon-right",
-  "data-testid": "icon-button-right"
-}, x = {
+var u = /* @__PURE__ */ ((t) => (t.PRIMARY = "primary", t.SECONDARY = "secondary", t.TERTIARY = "tertiary", t.TERTIARY_WITH_BACKGROUND = "tertiary-with-background", t))(u || {}), s = /* @__PURE__ */ ((t) => (t.CONDENSED = "condensed", t.DESTRUCTIVE = "critical", t.DISABLED = "disabled", t.ICON_ONLY = "icon-only", t.INVERSE = "inverse", t))(s || {});
+const U = ["aria-hidden"], w = ["aria-hidden"], x = {
   name: "bento-button"
-}, V = /* @__PURE__ */ C({
+}, V = /* @__PURE__ */ I({
   ...x,
   props: {
     /**
@@ -58,39 +50,44 @@ const U = {
   },
   emits: ["blur", "click", "focus", "keydown.esc"],
   setup(t, { emit: v }) {
-    const e = t, _ = v, b = N(), E = T(), s = $(E), p = n(() => (e == null ? void 0 : e.link) !== void 0 ? L : "button"), k = n(() => {
-      var o, l;
+    const e = t, _ = v, b = C(), E = N(), o = $(E), p = i(() => (e == null ? void 0 : e.link) !== void 0 ? L : "button"), k = i(() => {
+      var a, l;
       return {
-        "aria-controls": (o = b["aria-controls"]) == null ? void 0 : o.toString(),
+        "aria-controls": (a = b["aria-controls"]) == null ? void 0 : a.toString(),
         "aria-expanded": (l = b["aria-expanded"]) == null ? void 0 : l.toString()
       };
-    }), S = n(
+    }), S = i(
       () => p.value === "button" ? {
         ...k.value,
         disabled: e.disabled,
         type: e.type
       } : { ...e.link, disableTypography: !0, variant: Y.DEFAULT, isButton: !0 }
-    ), R = n(() => ({
-      [`b-button--${e.variant}${e.critical ? `-${a.DESTRUCTIVE}` : ""}`]: !0
-    })), g = n(() => ({
-      ...R.value,
-      [`b-button--${a.CONDENSED}`]: e.condensed,
-      [`b-button--${a.DISABLED}`]: e.disabled,
-      [`b-button--${a.INVERSE}`]: e.inverse
-    })), D = () => ({
-      [`b-button--${a.ICON_ONLY}`]: !s("default")
-    }), I = (o) => {
-      e.disabled ? (o.preventDefault(), o.stopPropagation()) : _("click", o);
+    ), h = i(() => ({
+      [`b-button--${e.variant}${e.critical ? `-${s.DESTRUCTIVE}` : ""}`]: !0
+    })), R = i(() => ({
+      ...h.value,
+      [`b-button--${s.CONDENSED}`]: e.condensed,
+      [`b-button--${s.DISABLED}`]: e.disabled,
+      [`b-button--${s.INVERSE}`]: e.inverse
+    })), g = () => ({
+      [`b-button--${s.ICON_ONLY}`]: !o("default")
+    }), D = (a) => {
+      e.disabled ? (a.preventDefault(), a.stopPropagation()) : _("click", a);
     };
-    return (o, l) => (i(), f(h(p.value), A(S.value, {
-      class: ["b-button", { ...g.value, ...D() }],
-      onClickCapture: I
+    return (a, l) => (r(), f(T(p.value), A(S.value, {
+      class: ["b-button", { ...R.value, ...g() }],
+      onClickCapture: D
     }), {
       default: m(() => [
-        r(s)("iconLeft") ? (i(), y("span", U, [
-          d(o.$slots, "iconLeft", {}, void 0, !0)
-        ])) : c("", !0),
-        r(s)("default") ? (i(), f(r(O), {
+        n(o)("iconLeft") ? (r(), y("span", {
+          key: 0,
+          class: "b-button__icon-left",
+          "data-testid": "icon-button-left",
+          "aria-hidden": n(o)("default") ? "true" : null
+        }, [
+          d(a.$slots, "iconLeft", {}, void 0, !0)
+        ], 8, U)) : c("", !0),
+        n(o)("default") ? (r(), f(n(O), {
           key: 1,
           el: "span",
           variant: "body",
@@ -98,21 +95,26 @@ const U = {
           class: "b-button__label"
         }, {
           default: m(() => [
-            d(o.$slots, "default", {}, void 0, !0)
+            d(a.$slots, "default", {}, void 0, !0)
           ]),
           _: 3
         })) : c("", !0),
-        r(s)("iconRight") ? (i(), y("span", w, [
-          d(o.$slots, "iconRight", {}, void 0, !0)
-        ])) : c("", !0)
+        n(o)("iconRight") ? (r(), y("span", {
+          key: 2,
+          class: "b-button__icon-right",
+          "data-testid": "icon-button-right",
+          "aria-hidden": n(o)("default") ? "true" : null
+        }, [
+          d(a.$slots, "iconRight", {}, void 0, !0)
+        ], 8, w)) : c("", !0)
       ]),
       _: 3
     }, 16, ["class"]));
   }
-}), K = /* @__PURE__ */ B(V, [["__scopeId", "data-v-a2d53c90"]]);
+}), K = /* @__PURE__ */ B(V, [["__scopeId", "data-v-a2e09f98"]]);
 export {
   K as B,
   u as a,
-  a as b
+  s as b
 };
-//# sourceMappingURL=button.DEVuqLVT.js.map
+//# sourceMappingURL=button.BHZgsGkp.js.map

package/dist/chunks/button.BHZgsGkp.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"button.BHZgsGkp.js","sources":["../../../core/src/components/button/button.types.ts","../../../vue2/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<{\n        /**\n         * Emitted when the element has lost focus\n         */\n        (e: 'blur');\n\n        /**\n         * Emitted when the button is clicked\n         */\n        (e: 'click', event: MouseEvent);\n\n        /**\n         * Emitted when the element has received focus\n         */\n        (e: 'focus');\n\n        /**\n         * Emitted when the \"ESC\" key is pressed\n         */\n        (e: 'keydown.esc');\n    }>();\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__","props","__props","emit","__emit","attrs","useAttrs","slots","useSlots","hasSlot","useHasSlot","componentType","computed","BentoLink","ariaAttributes","_a","_b","componentProps","BentoLinkVariant","variantClass","conditionalClasses","getIconOnlyClass","onClickButton","e"],"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;gDC2LRE,IAAA;AAAA,EAAe,MAAA;AAEf;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AApJA,UAAAC,IAAAC,GA8CAC,IAAAC,GAsBAC,IAAAC,EAAA,GACAC,IAAAC,EAAA,GACAC,IAAAC,EAAAH,CAAA,GAEAI,IAAAC,EAAA,OACIX,KAAA,gBAAAA,EAAA,UAAA,SACIY,IAEJ,QAAO,GAEXC,IAAAF,EAAA,MAAA;;AAAA;AAAA,QAAuC,kBAAAG,IAAAV,EAAA,eAAA,MAAA,gBAAAU,EAAA;AAAA,QACe,kBAAAC,IAAAX,EAAA,eAAA,MAAA,gBAAAW,EAAA;AAAA,MACA;AAAA,KAAA,GAGtDC,IAAAL;AAAA,MAAuB,MAAAD,EAAA,UAAA,WAAA;AAAA,QAEb,GAAAG,EAAA;AAAA,QACsB,UAAAb,EAAA;AAAA,QACF,MAAAA,EAAA;AAAA,MACJ,IAAA,EAAA,GAAAA,EAAA,MAAA,mBAAA,IAAA,SAAAiB,EAAA,SAAA,UAAA,GAAA;AAAA,IAE4E,GAGtGC,IAAAP,EAAA,OAAA;AAAA,MAAqC,CAAA,aAAAX,EAAA,OAAA,GAAAA,EAAA,WAAA,IAAAH,EAAA,WAAA,KAAA,EAAA,EAAA,GAAA;AAAA,IAC8D,EAAA,GAGnGsB,IAAAR,EAAA,OAAA;AAAA,MAA2C,GAAAO,EAAA;AAAA,MACvB,CAAA,aAAArB,EAAA,SAAA,EAAA,GAAAG,EAAA;AAAA,MACuC,CAAA,aAAAH,EAAA,QAAA,EAAA,GAAAG,EAAA;AAAA,MACD,CAAA,aAAAH,EAAA,OAAA,EAAA,GAAAG,EAAA;AAAA,IACD,EAAA,GAGzDoB,IAAA,OAAA;AAAA,MAAgC,CAAA,aAAAvB,EAAA,SAAA,EAAA,GAAA,CAAAW,EAAA,SAAA;AAAA,IACuC,IAGvEa,IAAA,CAAAC,MAAA;AACI,MAAAtB,EAAA,YAGIsB,EAAA,eAAA,GACAA,EAAA,gBAAA,KAHApB,EAAA,SAAAoB,CAAA;AAAA,IAIJ;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/chunks/{calendar.CNt90BvO.js → calendar.Dymq4e0Y.js}

@@ -1,15 +1,15 @@
 import { defineComponent as De, computed as k, resolveComponent as ne, createElementBlock as $, openBlock as O, withKeys as oe, normalizeClass as Ae, createElementVNode as A, createVNode as K, ref as Q, watch as se, nextTick as lt, toRef as j, resolveDirective as ut, withDirectives as He, mergeProps as Ve, toHandlers as xe, createBlock as ee, createCommentVNode as ce, withCtx as J, createTextVNode as Oe, toDisplayString as we, Fragment as le, renderList as ue, unref as _, reactive as qe, resolveDynamicComponent as it } from "vue";
 import { r as S, t as w, a as Re, g as dt } from "./get-date-locale.BN8xEjY0.js";
-import { t as I, B as Ke, a as Xe, f as Pe } from "./date.DoJuTLhO.js";
+import { t as I, B as Ke, a as Xe, f as Pe } from "./date.CKXySBQv.js";
 import { d as Ce, a as Me } from "./index.BDuTpjD8.js";
-import { B as Se } from "./button.DEVuqLVT.js";
+import { B as Se } from "./button.BHZgsGkp.js";
 import { B as ze } from "./typography.DN5eC5ch.js";
 import { _ as me } from "./_plugin-vue_export-helper.CHgC5LLL.js";
 import { a as Qe, C as Je } from "./chevron-left.BF63HtOH.js";
 import "./events.FNmSWp_P.js";
 import { a as Ze } from "./keyboard-navigation.CqgGzfZQ.js";
 import { g as et } from "./generate-uid.NJ8tVoha.js";
-import { u as tt } from "./i18n.D9azDLPe.js";
+import { u as tt } from "./i18n.B6g5VX0q.js";
 import { h as ct } from "./index.BzJQl-2M.js";
 import "../assets/calendar.css";
 function fe(e, t) {
@@ -1249,4 +1249,4 @@ export {
   Ne as s,
   Zt as u
 };
-//# sourceMappingURL=calendar.CNt90BvO.js.map
+//# sourceMappingURL=calendar.Dymq4e0Y.js.map