@adyen/bento-vue3 1.4.0 → 1.4.1

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 (134) hide show
  1. package/dist/accordion.js +2 -2
  2. package/dist/alert.js +3 -3
  3. package/dist/assets/index.css +1 -1
  4. package/dist/assets/index10.css +1 -1
  5. package/dist/assets/index11.css +1 -1
  6. package/dist/assets/index12.css +1 -1
  7. package/dist/assets/index13.css +1 -1
  8. package/dist/assets/index14.css +1 -1
  9. package/dist/assets/index15.css +1 -1
  10. package/dist/assets/index16.css +1 -1
  11. package/dist/assets/index17.css +1 -1
  12. package/dist/assets/index18.css +1 -1
  13. package/dist/assets/index19.css +1 -1
  14. package/dist/assets/index2.css +1 -1
  15. package/dist/assets/index20.css +1 -1
  16. package/dist/assets/index21.css +1 -1
  17. package/dist/assets/index22.css +1 -1
  18. package/dist/assets/index23.css +1 -1
  19. package/dist/assets/index24.css +1 -1
  20. package/dist/assets/index25.css +1 -1
  21. package/dist/assets/index26.css +1 -1
  22. package/dist/assets/index27.css +1 -1
  23. package/dist/assets/index28.css +1 -1
  24. package/dist/assets/index3.css +1 -1
  25. package/dist/assets/index30.css +1 -1
  26. package/dist/assets/index31.css +1 -1
  27. package/dist/assets/index32.css +1 -1
  28. package/dist/assets/index33.css +1 -1
  29. package/dist/assets/index34.css +1 -1
  30. package/dist/assets/index35.css +1 -1
  31. package/dist/assets/index36.css +1 -1
  32. package/dist/assets/index37.css +1 -1
  33. package/dist/assets/index38.css +1 -1
  34. package/dist/assets/index39.css +1 -1
  35. package/dist/assets/index4.css +1 -1
  36. package/dist/assets/index40.css +1 -1
  37. package/dist/assets/index41.css +1 -1
  38. package/dist/assets/index42.css +1 -1
  39. package/dist/assets/index5.css +1 -1
  40. package/dist/assets/index6.css +1 -1
  41. package/dist/assets/index7.css +1 -1
  42. package/dist/assets/index8.css +1 -1
  43. package/dist/assets/index9.css +1 -1
  44. package/dist/avatar-image.js +1 -1
  45. package/dist/badge.js +1 -1
  46. package/dist/button.js +5 -5
  47. package/dist/card.js +2 -2
  48. package/dist/checkbox.js +6 -6
  49. package/dist/chunks/{base-button.6d2843c2.js → base-button.c4ac1ad1.js} +2 -2
  50. package/dist/chunks/{base-button.6d2843c2.js.map → base-button.c4ac1ad1.js.map} +1 -1
  51. package/dist/chunks/{base-modal.3ccb9eb5.js → base-modal.db7a9829.js} +4 -4
  52. package/dist/chunks/{base-modal.3ccb9eb5.js.map → base-modal.db7a9829.js.map} +1 -1
  53. package/dist/chunks/{button.a8462029.js → button.7d09c245.js} +2 -2
  54. package/dist/chunks/{button.a8462029.js.map → button.7d09c245.js.map} +1 -1
  55. package/dist/chunks/{calendar.3f930683.js → calendar.0e42130b.js} +4 -4
  56. package/dist/chunks/{calendar.3f930683.js.map → calendar.0e42130b.js.map} +1 -1
  57. package/dist/chunks/{checkbox.5e1e05ae.js → checkbox.17462cb0.js} +3 -3
  58. package/dist/chunks/{checkbox.5e1e05ae.js.map → checkbox.17462cb0.js.map} +1 -1
  59. package/dist/chunks/{controls-group.3b0dfb94.js → controls-group.0d6db9c0.js} +2 -2
  60. package/dist/chunks/{controls-group.3b0dfb94.js.map → controls-group.0d6db9c0.js.map} +1 -1
  61. package/dist/chunks/{copy.1d14b783.js → copy.c9a29be0.js} +3 -3
  62. package/dist/chunks/{copy.1d14b783.js.map → copy.c9a29be0.js.map} +1 -1
  63. package/dist/chunks/{dropdown-default-textbox.a90e84f9.js → dropdown-default-textbox.cd789a95.js} +2 -2
  64. package/dist/chunks/{dropdown-default-textbox.a90e84f9.js.map → dropdown-default-textbox.cd789a95.js.map} +1 -1
  65. package/dist/chunks/{dropdown.b798a82e.js → dropdown.ff4f94a8.js} +22 -22
  66. package/dist/chunks/{dropdown.b798a82e.js.map → dropdown.ff4f94a8.js.map} +1 -1
  67. package/dist/chunks/{error-message.9acead25.js → error-message.8c67a507.js} +2 -2
  68. package/dist/chunks/{error-message.9acead25.js.map → error-message.8c67a507.js.map} +1 -1
  69. package/dist/chunks/{footer-actions.9537d0df.js → footer-actions.a587e374.js} +3 -3
  70. package/dist/chunks/{footer-actions.9537d0df.js.map → footer-actions.a587e374.js.map} +1 -1
  71. package/dist/chunks/{index.e84dbeae.js → index.140bf28f.js} +2 -2
  72. package/dist/chunks/{index.e84dbeae.js.map → index.140bf28f.js.map} +1 -1
  73. package/dist/chunks/{index.228ecda0.js → index.450b70d5.js} +3 -3
  74. package/dist/chunks/{index.228ecda0.js.map → index.450b70d5.js.map} +1 -1
  75. package/dist/chunks/{index.89b00b94.js → index.77c651df.js} +2 -2
  76. package/dist/chunks/{index.89b00b94.js.map → index.77c651df.js.map} +1 -1
  77. package/dist/chunks/{index.9d8273fc.js → index.ee69b530.js} +6 -6
  78. package/dist/chunks/{index.9d8273fc.js.map → index.ee69b530.js.map} +1 -1
  79. package/dist/chunks/{index.c2a80208.js → index.fd1cd23a.js} +20 -20
  80. package/dist/chunks/{index.c2a80208.js.map → index.fd1cd23a.js.map} +1 -1
  81. package/dist/chunks/{index.d26fdf71.js → index.fdb0c13d.js} +2 -2
  82. package/dist/chunks/{index.d26fdf71.js.map → index.fdb0c13d.js.map} +1 -1
  83. package/dist/chunks/{listbox-option-tag.0c9c571e.js → listbox-option-tag.ffe70226.js} +3 -3
  84. package/dist/chunks/{listbox-option-tag.0c9c571e.js.map → listbox-option-tag.ffe70226.js.map} +1 -1
  85. package/dist/chunks/{listbox.6b52af1a.js → listbox.f535a736.js} +4 -4
  86. package/dist/chunks/{listbox.6b52af1a.js.map → listbox.f535a736.js.map} +1 -1
  87. package/dist/chunks/{loading-button.081adbf3.js → loading-button.bc6e3967.js} +2 -2
  88. package/dist/chunks/{loading-button.081adbf3.js.map → loading-button.bc6e3967.js.map} +1 -1
  89. package/dist/chunks/{tooltip.e4e34b86.js → tooltip.973c86d3.js} +2 -2
  90. package/dist/chunks/{tooltip.e4e34b86.js.map → tooltip.973c86d3.js.map} +1 -1
  91. package/dist/code-snippet.js +7 -7
  92. package/dist/country.js +2 -2
  93. package/dist/currency.js +1 -1
  94. package/dist/data-grid.js +192 -189
  95. package/dist/data-grid.js.map +1 -1
  96. package/dist/date-picker.js +20 -20
  97. package/dist/date-picker.js.map +1 -1
  98. package/dist/date-range-picker.js +2 -2
  99. package/dist/date.js +1 -1
  100. package/dist/divider.js +1 -1
  101. package/dist/dropdown.js +4 -4
  102. package/dist/empty-state.js +3 -3
  103. package/dist/filter-bar.js +13 -13
  104. package/dist/focus-trap.js +1 -1
  105. package/dist/form-layout.js +2 -2
  106. package/dist/header.js +2 -2
  107. package/dist/index.js +14 -14
  108. package/dist/info-icon.js +2 -2
  109. package/dist/input-field.js +4 -4
  110. package/dist/internal.js +6 -6
  111. package/dist/link.js +2 -2
  112. package/dist/loading-indicator.js +1 -1
  113. package/dist/menu.js +4 -4
  114. package/dist/modal.js +3 -3
  115. package/dist/pagination.js +3 -3
  116. package/dist/payment-method.js +2 -2
  117. package/dist/popover.js +3 -3
  118. package/dist/popper-container.js +2 -2
  119. package/dist/radio-group.js +4 -4
  120. package/dist/search-bar.js +2 -2
  121. package/dist/segmented-control.js +4 -4
  122. package/dist/sidepanel.js +5 -5
  123. package/dist/status.js +1 -1
  124. package/dist/structured-list.js +1 -1
  125. package/dist/summary-grid.js +3 -3
  126. package/dist/tabs.js +2 -2
  127. package/dist/tag.js +3 -3
  128. package/dist/textarea.js +4 -4
  129. package/dist/timeline.js +5 -5
  130. package/dist/toast.js +3 -3
  131. package/dist/toggle.js +2 -2
  132. package/dist/typography.js +1 -1
  133. package/dist/web-types.json +1 -1
  134. package/package.json +2 -2
package/dist/button.js CHANGED
@@ -1,10 +1,10 @@
1
- import { a as y, B as _ } from "./chunks/button.a8462029.js";
2
- import { b as q } from "./chunks/button.a8462029.js";
1
+ import { a as y, B as _ } from "./chunks/button.7d09c245.js";
2
+ import { b as q } from "./chunks/button.7d09c245.js";
3
3
  import { defineComponent as T, computed as p, resolveComponent as u, openBlock as n, createElementBlock as a, createElementVNode as A, normalizeClass as E, Fragment as N, renderList as S, createBlock as s, withCtx as r, createTextVNode as m, toDisplayString as v, createSlots as I, resolveDynamicComponent as L } from "vue";
4
- import { B as V } from "./chunks/loading-button.081adbf3.js";
5
- import { a as K } from "./chunks/loading-button.081adbf3.js";
4
+ import { B as V } from "./chunks/loading-button.bc6e3967.js";
5
+ import { a as K } from "./chunks/loading-button.bc6e3967.js";
6
6
  import { _ as x } from "./chunks/_plugin-vue_export-helper.dad06003.js";
7
- import "./assets/index6.css";
7
+ import "./assets/index14.css";
8
8
  var f = /* @__PURE__ */ ((e) => (e.BUTTONS_END = "buttons-end", e.FILL_CONTAINER = "fill-container", e.SPACE_BETWEEN = "space-between", e.VERTICAL_STACK = "vertical-stack", e))(f || {}), B = /* @__PURE__ */ ((e) => (e.BUTTONS_START = "buttons-start", e))(B || {});
9
9
  const b = { ...f, ...B }, O = T({
10
10
  name: "bento-button-actions",
package/dist/card.js CHANGED
@@ -1,12 +1,12 @@
1
1
  import { defineComponent as H, ref as M, watch as z, computed as a, resolveComponent as y, openBlock as t, createElementBlock as i, normalizeClass as c, renderSlot as p, createCommentVNode as d, withKeys as w, createElementVNode as k, createBlock as v, mergeProps as O, withCtx as S, createVNode as R } from "vue";
2
- import { B as W } from "./chunks/index.89b00b94.js";
2
+ import { B as W } from "./chunks/index.77c651df.js";
3
3
  import { C as j, a as F } from "./chunks/chevron-up.c03b58f8.js";
4
4
  import { u as P } from "./chunks/use-has-slot.9fac7123.js";
5
5
  import { g as V } from "./chunks/unique-id.a2a2b458.js";
6
6
  import { u as Y } from "./chunks/i18n.6c402773.js";
7
7
  import { BentoButtonActions as K, BentoButtonActionsLayout as E } from "./button.js";
8
8
  import { _ as x } from "./chunks/_plugin-vue_export-helper.dad06003.js";
9
- import "./assets/index7.css";
9
+ import "./assets/index6.css";
10
10
  var g = /* @__PURE__ */ ((e) => (e.PRIMARY = "primary", e.SECONDARY = "secondary", e))(g || {}), u = /* @__PURE__ */ ((e) => (e.DEFAULT = "default", e.SMALL = "small", e))(u || {});
11
11
  const A = {
12
12
  "en-US": {
package/dist/checkbox.js CHANGED
@@ -1,13 +1,13 @@
1
- import { B as v, b as t } from "./chunks/checkbox.5e1e05ae.js";
2
- import { a as X } from "./chunks/checkbox.5e1e05ae.js";
1
+ import { B as v, b as t } from "./chunks/checkbox.17462cb0.js";
2
+ import { a as X } from "./chunks/checkbox.17462cb0.js";
3
3
  import { defineComponent as E, toRef as _, computed as u, ref as C, watch as B, resolveComponent as p, openBlock as l, createElementBlock as f, createVNode as S, normalizeClass as I, withCtx as c, Fragment as V, renderList as G, createBlock as g, createSlots as M, createTextVNode as y, toDisplayString as k, createCommentVNode as T } from "vue";
4
4
  import { g as w } from "./chunks/unique-id.a2a2b458.js";
5
- import { d as L } from "./chunks/index.89b00b94.js";
5
+ import { d as L } from "./chunks/index.77c651df.js";
6
6
  import { u as x } from "./chunks/use-form-layout-loading.d03e5d48.js";
7
- import { C as A } from "./chunks/controls-group.3b0dfb94.js";
8
- import { E as U } from "./chunks/error-message.9acead25.js";
7
+ import { C as A } from "./chunks/controls-group.0d6db9c0.js";
8
+ import { E as U } from "./chunks/error-message.8c67a507.js";
9
9
  import { _ as N } from "./chunks/_plugin-vue_export-helper.dad06003.js";
10
- import "./assets/index8.css";
10
+ import "./assets/index15.css";
11
11
  var s = /* @__PURE__ */ ((e) => (e.HORIZONTAL = "horizontal", e.VERTICAL = "vertical", e))(s || {});
12
12
  const O = E({
13
13
  name: "bento-checkbox-group",
@@ -1,5 +1,5 @@
1
1
  import { defineComponent as C, computed as _, ref as m, resolveComponent as y, openBlock as n, createElementBlock as i, normalizeClass as h, renderSlot as r, createCommentVNode as l, createBlock as S, withCtx as k } from "vue";
2
- import { B as g } from "./index.89b00b94.js";
2
+ import { B as g } from "./index.77c651df.js";
3
3
  import { u as B } from "./use-has-slot.9fac7123.js";
4
4
  import { _ as L } from "./_plugin-vue_export-helper.dad06003.js";
5
5
  import "../assets/base-button.css";
@@ -105,4 +105,4 @@ export {
105
105
  K as B,
106
106
  o as a
107
107
  };
108
- //# sourceMappingURL=base-button.6d2843c2.js.map
108
+ //# sourceMappingURL=base-button.c4ac1ad1.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"base-button.6d2843c2.js","sources":["../../../vue2/src/components/internal/base-button/base-button.types.ts","../../../vue2/src/components/internal/base-button/base-button.vue"],"sourcesContent":["export enum BentoBaseButtonPropClass {\n DESTRUCTIVE = 'critical',\n ICON_ONLY = 'icon-only',\n}\n\nexport enum BentoBaseButtonEvent {\n BLUR = 'blur',\n CLICK = 'click',\n FOCUS = 'focus',\n KEYDOWN_ESC = 'keydown.esc',\n}\n\nexport enum BaseButtonType {\n BUTTON = 'button',\n RESET = 'reset',\n SUBMIT = 'submit',\n}\n","<template>\n <button\n ref=\"bentoBaseButtonRef\"\n class=\"b-base-button\"\n :class=\"conditionalClasses\"\n :disabled=\"disabled\"\n :type=\"type\"\n :aria-expanded=\"ariaAttributes['aria-expanded']\"\n @click=\"onClickButton\"\n >\n <span v-if=\"hasSlot('iconLeft')\" class=\"b-base-button__icon-left\" data-testid=\"icon-button-left\">\n <slot name=\"iconLeft\" />\n </span>\n <bento-typography v-if=\"hasSlot('default')\" el=\"span\" variant=\"body\" stronger class=\"b-base-button__label\">\n <slot />\n </bento-typography>\n <span v-if=\"hasSlot('iconRight')\" class=\"b-base-button__icon-right\" data-testid=\"icon-button-right\">\n <slot name=\"iconRight\" />\n </span>\n </button>\n</template>\n\n<script lang=\"ts\">\n import { computed, defineComponent, PropType, ref } from 'vue';\n import { BentoBaseButtonEvent, BentoBaseButtonPropClass } from './base-button.types';\n import type { ButtonHTMLAttributes } from 'vue/types/jsx';\n import { BentoTypography } from '@/components/typography';\n import { useHasSlot } from '@/composables';\n import { Booleanish } from '@/types';\n\n /**\n * Base button component to use as a base for all the various types of bento buttons. For internal use only.\n *\n * * @example\n * import { BaseButton, BaseButtonEvent } from '@/components/internal/base-button';\n * import YourImportedIcon from @adyen/ui-assets-icons-16/example-icon';\n *\n * export default {\n * components: { BaseButton, YourImportedIcon },\n * props: {\n * text:\n * },\n * template: `\n * <base-button class=\"your-custom-button-styles\" @click=\"onClick\">\n * <template #iconLeft><your-imported-icon></template>\n * Button text\n * <template #iconRight><your-imported-icon></template>\n * </base-button>\n * `,\n * emits: [BentoButtonEvent.CLICK],\n * setup: (prps, { emit }) => {\n * const onClick = value => emit(BaseButtonEvent.CLICK, value);\n *\n * return {\n * onClick,\n * };\n * }\n * }\n */\n export default defineComponent({\n name: 'base-button',\n components: { BentoTypography },\n props: {\n /**\n * Disables button functionality\n */\n disabled: {\n type: Boolean,\n default: false,\n },\n /**\n * Displays button as critical\n */\n critical: {\n type: Boolean,\n default: false,\n },\n /**\n * The default behavior of the button.\n * Possible values are: 'button', 'reset', 'submit'\n */\n type: {\n type: String as PropType<ButtonHTMLAttributes['type']>,\n default: 'button',\n },\n },\n emits: [\n BentoBaseButtonEvent.CLICK,\n BentoBaseButtonEvent.FOCUS,\n BentoBaseButtonEvent.BLUR,\n BentoBaseButtonEvent.KEYDOWN_ESC,\n ],\n setup(props, { slots, emit, attrs }) {\n const ariaAttributes = computed(() => ({\n 'aria-expanded': attrs['aria-expanded']?.toString() as Booleanish,\n }));\n\n const bentoBaseButtonRef = ref(null);\n\n const conditionalClasses = computed(() => ({\n [`b-base-button--${BentoBaseButtonPropClass.DESTRUCTIVE}`]: props.critical,\n [`b-base-button--${BentoBaseButtonPropClass.ICON_ONLY}`]: !slots.default,\n }));\n\n const onClickButton = (e: MouseEvent) => {\n if (!props.disabled) {\n emit(BentoBaseButtonEvent.CLICK, e);\n } else {\n e.preventDefault();\n e.stopPropagation();\n }\n };\n\n return {\n // Values\n ariaAttributes,\n conditionalClasses,\n\n // Methods\n onClickButton,\n hasSlot: useHasSlot(slots),\n\n // Refs\n bentoBaseButtonRef,\n };\n },\n });\n</script>\n\n<style lang=\"scss\" scoped src=\"./base-button.scss\" />\n"],"names":["BentoBaseButtonPropClass","BentoBaseButtonPropClass2","BentoBaseButtonEvent","BentoBaseButtonEvent2","_sfc_main","defineComponent","BentoTypography","props","slots","emit","attrs","ariaAttributes","computed","_a","bentoBaseButtonRef","ref","conditionalClasses","useHasSlot","openBlock","createElementBlock","normalizeClass","_ctx","createCommentVNode","createBlock","_component_bento_typography","_hoisted_3"],"mappings":";;;;;AAAY,IAAAA,IAAA,kBAAAC,OACRA,EAAA,cAAA,YACAA,EAAA,YAAA,aAFQA,IAAAD,KAAA,CAAA,CAAA,GAKAE,IAAA,kBAAAC,OACRA,EAAA,OAAA,QACAA,EAAA,QAAA,SACAA,EAAA,QAAA,SACAA,EAAA,cAAA,eAJQA,IAAAD,KAAA,CAAA,CAAA;ACsDR,MAAAE,IAAAC,EAAA;AAAA,EAA+B,MAAA;AAAA,EACrB,YAAA,EAAA,iBAAAC,EAAA;AAAA,EACwB,OAAA;AAAA;AAAA;AAAA;AAAA,IACvB,UAAA;AAAA,MAIO,MAAA;AAAA,MACA,SAAA;AAAA,IACG;AAAA;AAAA;AAAA;AAAA,IACb,UAAA;AAAA,MAIU,MAAA;AAAA,MACA,SAAA;AAAA,IACG;AAAA;AAAA;AAAA;AAAA;AAAA,IACb,MAAA;AAAA,MAKM,MAAA;AAAA,MACI,SAAA;AAAA,IACG;AAAA,EACb;AAAA,EACJ,OAAA;AAAA,IACOJ,EAAA;AAAA,IACkBA,EAAA;AAAA,IACAA,EAAA;AAAA,IACAA,EAAA;AAAA,EACA;AAAA,EACzB,MAAAK,GAAA,EAAA,OAAAC,GAAA,MAAAC,GAAA,OAAAC,EAAA,GAAA;AAEI,UAAAC,IAAAC,EAAA,MAAA;;AAAA;AAAA,QAAuC,kBAAAC,IAAAH,EAAA,eAAA,MAAA,gBAAAG,EAAA;AAAA,MACe;AAAA,KAAA,GAGtDC,IAAAC,EAAA,IAAA,GAEAC,IAAAJ,EAAA,OAAA;AAAA,MAA2C,CAAA,kBAAAZ,EAAA,aAAA,GAAAO,EAAA;AAAA,MAC2B,CAAA,kBAAAP,EAAA,WAAA,GAAA,CAAAQ,EAAA;AAAA,IACD,EAAA;AAYrE,WAAA;AAAA;AAAA,MAAO,gBAAAG;AAAA,MAEH,oBAAAK;AAAA;AAAA,MACA,eAZJ,CAAA,MAAA;AACI,QAAAT,EAAA,YAGI,EAAA,eAAA,GACA,EAAA,gBAAA,KAHAE,EAAAP,EAAA,OAAA,CAAA;AAAA,MAIJ;AAAA,MASA,SAAAe,EAAAT,CAAA;AAAA;AAAA,MACyB,oBAAAM;AAAA,IAGzB;AAAA,EACJ;AAER,CAAA;;EApH2C,KAAA;AAAA,EAA2B,OAAA;AAAA;;EAM1B,KAAA;AAAA,EAA4B,OAAA;AAAA;;;;AAb/D,SAAAI,EAAA,GAAAC,EAAA,UAAA;AAAA,IACG,KAAA;AAAA,IACP,OAAAC,EAAA,CAAA,iBAAAC,EAAA,kBAAA,CAAA;AAAA,IACU,UAAAA,EAAA;AAAA,IACG,MAAAA,EAAA;AAAA,IACR,iBAAAA,EAAA,eAAA,eAAA;AAAA;EAEa,GAAA;AAAA;;IAGK,CAAA,KAAAC,EAAA,IAAA,EAAA;AAAA,IAELD,EAAA,QAAA,SAAA,KAAAH,EAAA,GAAAK,EAAAC,GAAA;AAAA,MAFkC,KAAA;AAAA,MAAC,IAAA;AAAA,MAAe,SAAA;AAAA,MAAe,UAAA;AAAA;;;;;;;IAGpFH,EAAA,QAAA,WAAA,KAAAH,EAAA,GAAAC,EAAA,QAAAM,GAAA;AAAA;;;;;"}
1
+ {"version":3,"file":"base-button.c4ac1ad1.js","sources":["../../../vue2/src/components/internal/base-button/base-button.types.ts","../../../vue2/src/components/internal/base-button/base-button.vue"],"sourcesContent":["export enum BentoBaseButtonPropClass {\n DESTRUCTIVE = 'critical',\n ICON_ONLY = 'icon-only',\n}\n\nexport enum BentoBaseButtonEvent {\n BLUR = 'blur',\n CLICK = 'click',\n FOCUS = 'focus',\n KEYDOWN_ESC = 'keydown.esc',\n}\n\nexport enum BaseButtonType {\n BUTTON = 'button',\n RESET = 'reset',\n SUBMIT = 'submit',\n}\n","<template>\n <button\n ref=\"bentoBaseButtonRef\"\n class=\"b-base-button\"\n :class=\"conditionalClasses\"\n :disabled=\"disabled\"\n :type=\"type\"\n :aria-expanded=\"ariaAttributes['aria-expanded']\"\n @click=\"onClickButton\"\n >\n <span v-if=\"hasSlot('iconLeft')\" class=\"b-base-button__icon-left\" data-testid=\"icon-button-left\">\n <slot name=\"iconLeft\" />\n </span>\n <bento-typography v-if=\"hasSlot('default')\" el=\"span\" variant=\"body\" stronger class=\"b-base-button__label\">\n <slot />\n </bento-typography>\n <span v-if=\"hasSlot('iconRight')\" class=\"b-base-button__icon-right\" data-testid=\"icon-button-right\">\n <slot name=\"iconRight\" />\n </span>\n </button>\n</template>\n\n<script lang=\"ts\">\n import { computed, defineComponent, PropType, ref } from 'vue';\n import { BentoBaseButtonEvent, BentoBaseButtonPropClass } from './base-button.types';\n import type { ButtonHTMLAttributes } from 'vue/types/jsx';\n import { BentoTypography } from '@/components/typography';\n import { useHasSlot } from '@/composables';\n import { Booleanish } from '@/types';\n\n /**\n * Base button component to use as a base for all the various types of bento buttons. For internal use only.\n *\n * * @example\n * import { BaseButton, BaseButtonEvent } from '@/components/internal/base-button';\n * import YourImportedIcon from @adyen/ui-assets-icons-16/example-icon';\n *\n * export default {\n * components: { BaseButton, YourImportedIcon },\n * props: {\n * text:\n * },\n * template: `\n * <base-button class=\"your-custom-button-styles\" @click=\"onClick\">\n * <template #iconLeft><your-imported-icon></template>\n * Button text\n * <template #iconRight><your-imported-icon></template>\n * </base-button>\n * `,\n * emits: [BentoButtonEvent.CLICK],\n * setup: (prps, { emit }) => {\n * const onClick = value => emit(BaseButtonEvent.CLICK, value);\n *\n * return {\n * onClick,\n * };\n * }\n * }\n */\n export default defineComponent({\n name: 'base-button',\n components: { BentoTypography },\n props: {\n /**\n * Disables button functionality\n */\n disabled: {\n type: Boolean,\n default: false,\n },\n /**\n * Displays button as critical\n */\n critical: {\n type: Boolean,\n default: false,\n },\n /**\n * The default behavior of the button.\n * Possible values are: 'button', 'reset', 'submit'\n */\n type: {\n type: String as PropType<ButtonHTMLAttributes['type']>,\n default: 'button',\n },\n },\n emits: [\n BentoBaseButtonEvent.CLICK,\n BentoBaseButtonEvent.FOCUS,\n BentoBaseButtonEvent.BLUR,\n BentoBaseButtonEvent.KEYDOWN_ESC,\n ],\n setup(props, { slots, emit, attrs }) {\n const ariaAttributes = computed(() => ({\n 'aria-expanded': attrs['aria-expanded']?.toString() as Booleanish,\n }));\n\n const bentoBaseButtonRef = ref(null);\n\n const conditionalClasses = computed(() => ({\n [`b-base-button--${BentoBaseButtonPropClass.DESTRUCTIVE}`]: props.critical,\n [`b-base-button--${BentoBaseButtonPropClass.ICON_ONLY}`]: !slots.default,\n }));\n\n const onClickButton = (e: MouseEvent) => {\n if (!props.disabled) {\n emit(BentoBaseButtonEvent.CLICK, e);\n } else {\n e.preventDefault();\n e.stopPropagation();\n }\n };\n\n return {\n // Values\n ariaAttributes,\n conditionalClasses,\n\n // Methods\n onClickButton,\n hasSlot: useHasSlot(slots),\n\n // Refs\n bentoBaseButtonRef,\n };\n },\n });\n</script>\n\n<style lang=\"scss\" scoped src=\"./base-button.scss\" />\n"],"names":["BentoBaseButtonPropClass","BentoBaseButtonPropClass2","BentoBaseButtonEvent","BentoBaseButtonEvent2","_sfc_main","defineComponent","BentoTypography","props","slots","emit","attrs","ariaAttributes","computed","_a","bentoBaseButtonRef","ref","conditionalClasses","useHasSlot","openBlock","createElementBlock","normalizeClass","_ctx","createCommentVNode","createBlock","_component_bento_typography","_hoisted_3"],"mappings":";;;;;AAAY,IAAAA,IAAA,kBAAAC,OACRA,EAAA,cAAA,YACAA,EAAA,YAAA,aAFQA,IAAAD,KAAA,CAAA,CAAA,GAKAE,IAAA,kBAAAC,OACRA,EAAA,OAAA,QACAA,EAAA,QAAA,SACAA,EAAA,QAAA,SACAA,EAAA,cAAA,eAJQA,IAAAD,KAAA,CAAA,CAAA;ACsDR,MAAAE,IAAAC,EAAA;AAAA,EAA+B,MAAA;AAAA,EACrB,YAAA,EAAA,iBAAAC,EAAA;AAAA,EACwB,OAAA;AAAA;AAAA;AAAA;AAAA,IACvB,UAAA;AAAA,MAIO,MAAA;AAAA,MACA,SAAA;AAAA,IACG;AAAA;AAAA;AAAA;AAAA,IACb,UAAA;AAAA,MAIU,MAAA;AAAA,MACA,SAAA;AAAA,IACG;AAAA;AAAA;AAAA;AAAA;AAAA,IACb,MAAA;AAAA,MAKM,MAAA;AAAA,MACI,SAAA;AAAA,IACG;AAAA,EACb;AAAA,EACJ,OAAA;AAAA,IACOJ,EAAA;AAAA,IACkBA,EAAA;AAAA,IACAA,EAAA;AAAA,IACAA,EAAA;AAAA,EACA;AAAA,EACzB,MAAAK,GAAA,EAAA,OAAAC,GAAA,MAAAC,GAAA,OAAAC,EAAA,GAAA;AAEI,UAAAC,IAAAC,EAAA,MAAA;;AAAA;AAAA,QAAuC,kBAAAC,IAAAH,EAAA,eAAA,MAAA,gBAAAG,EAAA;AAAA,MACe;AAAA,KAAA,GAGtDC,IAAAC,EAAA,IAAA,GAEAC,IAAAJ,EAAA,OAAA;AAAA,MAA2C,CAAA,kBAAAZ,EAAA,aAAA,GAAAO,EAAA;AAAA,MAC2B,CAAA,kBAAAP,EAAA,WAAA,GAAA,CAAAQ,EAAA;AAAA,IACD,EAAA;AAYrE,WAAA;AAAA;AAAA,MAAO,gBAAAG;AAAA,MAEH,oBAAAK;AAAA;AAAA,MACA,eAZJ,CAAA,MAAA;AACI,QAAAT,EAAA,YAGI,EAAA,eAAA,GACA,EAAA,gBAAA,KAHAE,EAAAP,EAAA,OAAA,CAAA;AAAA,MAIJ;AAAA,MASA,SAAAe,EAAAT,CAAA;AAAA;AAAA,MACyB,oBAAAM;AAAA,IAGzB;AAAA,EACJ;AAER,CAAA;;EApH2C,KAAA;AAAA,EAA2B,OAAA;AAAA;;EAM1B,KAAA;AAAA,EAA4B,OAAA;AAAA;;;;AAb/D,SAAAI,EAAA,GAAAC,EAAA,UAAA;AAAA,IACG,KAAA;AAAA,IACP,OAAAC,EAAA,CAAA,iBAAAC,EAAA,kBAAA,CAAA;AAAA,IACU,UAAAA,EAAA;AAAA,IACG,MAAAA,EAAA;AAAA,IACR,iBAAAA,EAAA,eAAA,eAAA;AAAA;EAEa,GAAA;AAAA;;IAGK,CAAA,KAAAC,EAAA,IAAA,EAAA;AAAA,IAELD,EAAA,QAAA,SAAA,KAAAH,EAAA,GAAAK,EAAAC,GAAA;AAAA,MAFkC,KAAA;AAAA,MAAC,IAAA;AAAA,MAAe,SAAA;AAAA,MAAe,UAAA;AAAA;;;;;;;IAGpFH,EAAA,QAAA,WAAA,KAAAH,EAAA,GAAAC,EAAA,QAAAM,GAAA;AAAA;;;;;"}
@@ -1,8 +1,8 @@
1
1
  import { defineComponent as F, useAttrs as z, ref as U, computed as u, watch as I, onMounted as q, resolveComponent as c, openBlock as s, createElementBlock as h, createElementVNode as _, normalizeClass as M, withKeys as K, createVNode as S, withCtx as m, normalizeStyle as E, renderSlot as f, createCommentVNode as l, createBlock as y } from "vue";
2
- import { B as V } from "./index.89b00b94.js";
3
- import { a as W } from "./button.a8462029.js";
2
+ import { B as V } from "./index.77c651df.js";
3
+ import { a as W } from "./button.7d09c245.js";
4
4
  import { BentoDivider as H } from "../divider.js";
5
- import { B as Q } from "./index.d26fdf71.js";
5
+ import { B as Q } from "./index.fdb0c13d.js";
6
6
  import { u as Y } from "./use-has-slot.9fac7123.js";
7
7
  import { u as j } from "./i18n.6c402773.js";
8
8
  import { C as J } from "./cross.5c36a670.js";
@@ -288,4 +288,4 @@ export {
288
288
  k as e,
289
289
  Le as f
290
290
  };
291
- //# sourceMappingURL=base-modal.3ccb9eb5.js.map
291
+ //# sourceMappingURL=base-modal.db7a9829.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"base-modal.3ccb9eb5.js","sources":["../../../vue2/src/components/modal/modal.types.ts","../../../vue2/src/components/modal/components/base-modal/base-modal.vue"],"sourcesContent":["/**\n * @deprecated for usage with properties since version 2.0. Use the string literal instead.\n */\nexport enum BentoModalVariant {\n DEFAULT = 'BentoModalDefault',\n DIALOG = 'BentoModalDialog',\n}\n\n/**\n * @deprecated for usage with properties since version 2.0. Use the string literal instead.\n */\nexport enum BentoModalSize {\n SMALL = 'small',\n MEDIUM = 'medium',\n LARGE = 'large',\n}\n\n/**\n * @deprecated for usage with properties since version 2.0. Use the string literal instead.\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\n/**\n * @deprecated for usage with properties since version 2.0. Use the string literal instead.\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=\"span\"\n variant=\"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=\"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') || (hasSlot('content-col-1') && hasSlot('content-col-2'))\"\n aria-label=\"base modal content\"\n el=\"div\"\n variant=\"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, useAttrs, watch } from 'vue';\n import {\n BentoModalColumnLayoutVariant,\n BentoModalEvent,\n BentoModalRole,\n BentoModalSize,\n } from '@/components/modal/modal.types';\n\n import { BentoTypography } from '@/components/typography';\n import { BentoButton, BentoButtonActionsList } 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 { useI18n } from '@/utils/ts/i18n';\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 const LOADING_BTN_CLOSE_AFTER_SUCCESS_DELAY_TIME = 500;\n\n export default defineComponent({\n i18n: { messages },\n name: 'base-modal',\n components: { CrossIcon, BentoTypography, BentoButton, BentoDivider, BentoFocusTrap, GridLayout },\n props: {\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 /**\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 * If provided, manages the padding of the whole modal container\n */\n customPadding: { type: String, default: null },\n\n /**\n * Hides a cross icon on the right side of the title\n */\n hideCloseButton: { type: Boolean, required: true },\n\n /**\n * Sets the open attribute on the dialog element, use isOpen instead to toggle modal visbility.\n */\n initiallyOpen: { type: Boolean, default: false },\n\n /**\n * If set to true, it allows the modal to be closed by clicking outside of it\n */\n isDismissible: { type: Boolean, required: true },\n\n /**\n * Controls the modal's state from the outside. Set it to true to open the modal\n */\n isOpen: { type: Boolean, required: true },\n\n /**\n * Defines whether the modal will be an alert modal\n */\n modalRole: { type: String, default: BentoModalRole.DIALOG },\n\n /**\n * Allows the inner elments to overflow the dialog\n */\n overflowVisible: { type: Boolean, default: false },\n\n /**\n * Sets the width of the modal\n */\n size: {\n type: String as PropType<BentoModalSize | `${BentoModalSize}`>,\n default: BentoModalSize.SMALL,\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: { type: Boolean, default: false },\n },\n emits: [BentoModalEvent.CLOSE_MODAL],\n setup(props, { slots, emit }) {\n const { t } = useI18n<{ message: MessageSchema }>({ messages });\n const attrs = useAttrs();\n const hasSlot = useHasSlot(slots);\n const modal = ref(null);\n\n const customPaddingStyles = computed(() => {\n if (!props.customPadding) {\n return {};\n }\n\n const xPadding = {\n paddingLeft: props.customPadding,\n paddingRight: props.customPadding,\n };\n\n const content = { ...xPadding, paddingTop: undefined, paddingBottom: undefined };\n\n if (!hasSlot('default')) {\n content.paddingTop = props.customPadding;\n }\n\n if (!hasSlot('actions')) {\n content.paddingBottom = props.customPadding;\n }\n\n return {\n header: { ...xPadding, paddingTop: props.customPadding },\n content,\n actions: { ...xPadding, paddingBottom: props.customPadding },\n };\n });\n\n const computedAriaLabel = computed(\n () => (attrs['aria-label'] as string) ?? (t('ariaLabelFallback') as string)\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': props.isOpen,\n 'b-modal-base__container--overflow-visible': props.overflowVisible,\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 () => [props.isOpen, modal.value],\n ([newIsOpen, newModalValue], [, oldModalValue]): void => {\n if (!newModalValue) {\n return;\n }\n\n const isFirstMutation = !oldModalValue;\n if (newIsOpen) {\n openModal();\n } else if (!isFirstMutation) {\n closeModal();\n }\n }\n );\n\n // If the first button is a loading button then close the modal have 0.5 seconds\n // if the state is changed to 'success'.\n watch(\n () => props.actions,\n () => {\n if (props.actions?.[0]?.state === 'success') {\n setTimeout(closeModal, LOADING_BTN_CLOSE_AFTER_SUCCESS_DELAY_TIME);\n }\n },\n { deep: true }\n );\n\n onMounted(() => {\n if (props.isOpen && 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 t,\n\n // Styles\n modalConditionalClasses,\n modalContentConditionalClasses,\n customPaddingStyles,\n hasColumnLayout,\n computedColumnWidth,\n\n // Enums\n GridLayoutContainerType,\n };\n },\n });\n</script>\n\n<style lang=\"scss\" scoped src=\"./base-modal.scss\" />\n"],"names":["BentoModalVariant","BentoModalVariant2","BentoModalSize","BentoModalSize2","BentoModalColumnLayoutVariant","BentoModalColumnLayoutVariant2","BentoModalRole","BentoModalRole2","BentoModalDialogType","BentoModalDialogType2","BentoModalEvent","BentoModalEvent2","LOADING_BTN_CLOSE_AFTER_SUCCESS_DELAY_TIME","_sfc_main","defineComponent","messages","CrossIcon","BentoTypography","BentoButton","BentoDivider","BentoFocusTrap","GridLayout","props","slots","emit","t","useI18n","attrs","useAttrs","hasSlot","useHasSlot","modal","ref","customPaddingStyles","computed","xPadding","content","computedAriaLabel","hasColumnLayout","openModal","emitCloseEvent","closeModal","onCloseButtonClick","closeModalOnClickOutside","target","modalConditionalClasses","modalContentConditionalClasses","computedColumnWidth","watch","newIsOpen","newModalValue","oldModalValue","_b","_a","onMounted","GridLayoutContainerType","_hoisted_2","_hoisted_4","createElementVNode","_ctx","normalizeClass","_cache","$event","withCtx","_hoisted_3","openBlock","createElementBlock","normalizeStyle","createVNode","_component_bento_typography","renderSlot","createCommentVNode","createBlock","_component_grid_layout","_hoisted_5"],"mappings":"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"}
1
+ {"version":3,"file":"base-modal.db7a9829.js","sources":["../../../vue2/src/components/modal/modal.types.ts","../../../vue2/src/components/modal/components/base-modal/base-modal.vue"],"sourcesContent":["/**\n * @deprecated for usage with properties since version 2.0. Use the string literal instead.\n */\nexport enum BentoModalVariant {\n DEFAULT = 'BentoModalDefault',\n DIALOG = 'BentoModalDialog',\n}\n\n/**\n * @deprecated for usage with properties since version 2.0. Use the string literal instead.\n */\nexport enum BentoModalSize {\n SMALL = 'small',\n MEDIUM = 'medium',\n LARGE = 'large',\n}\n\n/**\n * @deprecated for usage with properties since version 2.0. Use the string literal instead.\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\n/**\n * @deprecated for usage with properties since version 2.0. Use the string literal instead.\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=\"span\"\n variant=\"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=\"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') || (hasSlot('content-col-1') && hasSlot('content-col-2'))\"\n aria-label=\"base modal content\"\n el=\"div\"\n variant=\"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, useAttrs, watch } from 'vue';\n import {\n BentoModalColumnLayoutVariant,\n BentoModalEvent,\n BentoModalRole,\n BentoModalSize,\n } from '@/components/modal/modal.types';\n\n import { BentoTypography } from '@/components/typography';\n import { BentoButton, BentoButtonActionsList } 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 { useI18n } from '@/utils/ts/i18n';\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 const LOADING_BTN_CLOSE_AFTER_SUCCESS_DELAY_TIME = 500;\n\n export default defineComponent({\n i18n: { messages },\n name: 'base-modal',\n components: { CrossIcon, BentoTypography, BentoButton, BentoDivider, BentoFocusTrap, GridLayout },\n props: {\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 /**\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 * If provided, manages the padding of the whole modal container\n */\n customPadding: { type: String, default: null },\n\n /**\n * Hides a cross icon on the right side of the title\n */\n hideCloseButton: { type: Boolean, required: true },\n\n /**\n * Sets the open attribute on the dialog element, use isOpen instead to toggle modal visbility.\n */\n initiallyOpen: { type: Boolean, default: false },\n\n /**\n * If set to true, it allows the modal to be closed by clicking outside of it\n */\n isDismissible: { type: Boolean, required: true },\n\n /**\n * Controls the modal's state from the outside. Set it to true to open the modal\n */\n isOpen: { type: Boolean, required: true },\n\n /**\n * Defines whether the modal will be an alert modal\n */\n modalRole: { type: String, default: BentoModalRole.DIALOG },\n\n /**\n * Allows the inner elments to overflow the dialog\n */\n overflowVisible: { type: Boolean, default: false },\n\n /**\n * Sets the width of the modal\n */\n size: {\n type: String as PropType<BentoModalSize | `${BentoModalSize}`>,\n default: BentoModalSize.SMALL,\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: { type: Boolean, default: false },\n },\n emits: [BentoModalEvent.CLOSE_MODAL],\n setup(props, { slots, emit }) {\n const { t } = useI18n<{ message: MessageSchema }>({ messages });\n const attrs = useAttrs();\n const hasSlot = useHasSlot(slots);\n const modal = ref(null);\n\n const customPaddingStyles = computed(() => {\n if (!props.customPadding) {\n return {};\n }\n\n const xPadding = {\n paddingLeft: props.customPadding,\n paddingRight: props.customPadding,\n };\n\n const content = { ...xPadding, paddingTop: undefined, paddingBottom: undefined };\n\n if (!hasSlot('default')) {\n content.paddingTop = props.customPadding;\n }\n\n if (!hasSlot('actions')) {\n content.paddingBottom = props.customPadding;\n }\n\n return {\n header: { ...xPadding, paddingTop: props.customPadding },\n content,\n actions: { ...xPadding, paddingBottom: props.customPadding },\n };\n });\n\n const computedAriaLabel = computed(\n () => (attrs['aria-label'] as string) ?? (t('ariaLabelFallback') as string)\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': props.isOpen,\n 'b-modal-base__container--overflow-visible': props.overflowVisible,\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 () => [props.isOpen, modal.value],\n ([newIsOpen, newModalValue], [, oldModalValue]): void => {\n if (!newModalValue) {\n return;\n }\n\n const isFirstMutation = !oldModalValue;\n if (newIsOpen) {\n openModal();\n } else if (!isFirstMutation) {\n closeModal();\n }\n }\n );\n\n // If the first button is a loading button then close the modal have 0.5 seconds\n // if the state is changed to 'success'.\n watch(\n () => props.actions,\n () => {\n if (props.actions?.[0]?.state === 'success') {\n setTimeout(closeModal, LOADING_BTN_CLOSE_AFTER_SUCCESS_DELAY_TIME);\n }\n },\n { deep: true }\n );\n\n onMounted(() => {\n if (props.isOpen && 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 t,\n\n // Styles\n modalConditionalClasses,\n modalContentConditionalClasses,\n customPaddingStyles,\n hasColumnLayout,\n computedColumnWidth,\n\n // Enums\n GridLayoutContainerType,\n };\n },\n });\n</script>\n\n<style lang=\"scss\" scoped src=\"./base-modal.scss\" />\n"],"names":["BentoModalVariant","BentoModalVariant2","BentoModalSize","BentoModalSize2","BentoModalColumnLayoutVariant","BentoModalColumnLayoutVariant2","BentoModalRole","BentoModalRole2","BentoModalDialogType","BentoModalDialogType2","BentoModalEvent","BentoModalEvent2","LOADING_BTN_CLOSE_AFTER_SUCCESS_DELAY_TIME","_sfc_main","defineComponent","messages","CrossIcon","BentoTypography","BentoButton","BentoDivider","BentoFocusTrap","GridLayout","props","slots","emit","t","useI18n","attrs","useAttrs","hasSlot","useHasSlot","modal","ref","customPaddingStyles","computed","xPadding","content","computedAriaLabel","hasColumnLayout","openModal","emitCloseEvent","closeModal","onCloseButtonClick","closeModalOnClickOutside","target","modalConditionalClasses","modalContentConditionalClasses","computedColumnWidth","watch","newIsOpen","newModalValue","oldModalValue","_b","_a","onMounted","GridLayoutContainerType","_hoisted_2","_hoisted_4","createElementVNode","_ctx","normalizeClass","_cache","$event","withCtx","_hoisted_3","openBlock","createElementBlock","normalizeStyle","createVNode","_component_bento_typography","renderSlot","createCommentVNode","createBlock","_component_grid_layout","_hoisted_5"],"mappings":"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"}
@@ -1,5 +1,5 @@
1
1
  import { defineComponent as C, computed as o, resolveComponent as S, openBlock as a, createBlock as y, resolveDynamicComponent as g, mergeProps as h, withCtx as m, createElementBlock as _, renderSlot as d, createCommentVNode as u } from "vue";
2
- import { B as D } from "./index.89b00b94.js";
2
+ import { B as D } from "./index.77c651df.js";
3
3
  import { u as E } from "./use-has-slot.9fac7123.js";
4
4
  import { BentoLink as $, BentoLinkVariant as R } from "../link.js";
5
5
  import { _ as T } from "./_plugin-vue_export-helper.dad06003.js";
@@ -137,4 +137,4 @@ export {
137
137
  w as a,
138
138
  n as b
139
139
  };
140
- //# sourceMappingURL=button.a8462029.js.map
140
+ //# sourceMappingURL=button.7d09c245.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"button.a8462029.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}\n\nexport enum BentoButtonPropClass {\n CONDENSED = 'condensed',\n DESTRUCTIVE = 'critical',\n DISABLED = 'disabled',\n ICON_ONLY = 'icon-only',\n}\n\nexport interface BentoButtonProps {\n condensed?: boolean;\n critical?: boolean;\n disabled?: boolean;\n variant?: 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\"\n @click.capture=\"onClickButton\"\n >\n <span v-if=\"hasSlot('iconLeft')\" class=\"b-button__icon-left\" data-testid=\"icon-button-left\">\n <slot name=\"iconLeft\" />\n </span>\n <bento-typography v-if=\"hasSlot('default')\" el=\"span\" variant=\"body\" stronger class=\"b-button__label\">\n <slot />\n </bento-typography>\n <span v-if=\"hasSlot('iconRight')\" class=\"b-button__icon-right\" data-testid=\"icon-button-right\">\n <slot name=\"iconRight\" />\n </span>\n </component>\n</template>\n\n<script lang=\"ts\">\n import { computed, defineComponent, PropType } from 'vue';\n import { BentoButtonPropClass, BentoButtonVariant } from '@/core/components/button/button.types';\n import { BentoTypography } from '@/components/typography';\n import { useHasSlot } from '@/composables';\n import { Booleanish } from '@/types';\n import type { RouterLinkProps } from 'vue-router/types/router';\n import type { AnchorHTMLAttributes, ButtonHTMLAttributes } from 'vue/types/jsx';\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 // eslint-disable-next-line vue/require-default-prop\n args?: { props: RouterLinkProps };\n\n /**\n * Set the rendered link to a regular external anchor link.\n */\n external: boolean;\n }\n\n /**\n * Button component for all the various types of bento buttons.\n *\n * @usage\n * import { BentoButton, AdlIconPosition } from '@adyen/bento-vue2';\n *\n * export default {\n * components: { BentoButton },\n * template: `\n * <bento-button\n * disabled\n * :icon-position=\"AdlIconPosition.AFTER\"\n * >\n * Button text\n * </bento-button>\n * `,\n * }\n */\n export default defineComponent({\n name: 'bento-button',\n components: { BentoTypography },\n props: {\n /**\n * Disables button functionality\n */\n disabled: {\n type: Boolean,\n default: false,\n },\n\n /**\n * Displays button as critical\n */\n critical: {\n type: Boolean,\n default: false,\n },\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 * Reduces sizing of button\n */\n condensed: {\n type: Boolean,\n default: false,\n },\n\n /**\n * Types of flavour of Button\n * @values primary, secondary, tertiary\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 * Object containing props passed on to the BentoLink component. @see BentoLink documentation for which properties you can pass.\n */\n link: {\n type: Object,\n default: undefined,\n },\n },\n emits: ['click', 'focus', 'blur', 'keydown.esc'],\n setup(props, { slots, emit, attrs }) {\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 }\n );\n\n const variantClass = computed((): { [x: string]: boolean } => ({\n [`b-button--${props.variant}${props.critical ? `-${BentoButtonPropClass.DESTRUCTIVE}` : ''}`]: true,\n }));\n\n const conditionalClasses = computed(\n (): {\n [x: string]: boolean;\n } => ({\n ...variantClass.value,\n [`b-button--${BentoButtonPropClass.CONDENSED}`]: props.condensed,\n [`b-button--${BentoButtonPropClass.ICON_ONLY}`]: !slots.default,\n [`b-button--${BentoButtonPropClass.DISABLED}`]: props.disabled,\n })\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\n return {\n // Values\n ariaAttributes,\n conditionalClasses,\n componentType,\n componentProps,\n\n // Methods\n onClickButton,\n hasSlot: useHasSlot(slots),\n };\n },\n });\n</script>\n\n<style lang=\"scss\" scoped src=\"@/core/components/button/button.scss\" />\n"],"names":["BentoButtonVariant","BentoButtonVariant2","BentoButtonPropClass","BentoButtonPropClass2","_sfc_main","defineComponent","BentoTypography","value","props","slots","emit","attrs","componentType","computed","BentoLink","ariaAttributes","_a","_b","componentProps","BentoLinkVariant","variantClass","conditionalClasses","useHasSlot","_ctx","withCtx","openBlock","createElementBlock","_hoisted_1","createCommentVNode","createBlock","_component_bento_typography","_hoisted_2"],"mappings":"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"}
1
+ {"version":3,"file":"button.7d09c245.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}\n\nexport enum BentoButtonPropClass {\n CONDENSED = 'condensed',\n DESTRUCTIVE = 'critical',\n DISABLED = 'disabled',\n ICON_ONLY = 'icon-only',\n}\n\nexport interface BentoButtonProps {\n condensed?: boolean;\n critical?: boolean;\n disabled?: boolean;\n variant?: 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\"\n @click.capture=\"onClickButton\"\n >\n <span v-if=\"hasSlot('iconLeft')\" class=\"b-button__icon-left\" data-testid=\"icon-button-left\">\n <slot name=\"iconLeft\" />\n </span>\n <bento-typography v-if=\"hasSlot('default')\" el=\"span\" variant=\"body\" stronger class=\"b-button__label\">\n <slot />\n </bento-typography>\n <span v-if=\"hasSlot('iconRight')\" class=\"b-button__icon-right\" data-testid=\"icon-button-right\">\n <slot name=\"iconRight\" />\n </span>\n </component>\n</template>\n\n<script lang=\"ts\">\n import { computed, defineComponent, PropType } from 'vue';\n import { BentoButtonPropClass, BentoButtonVariant } from '@/core/components/button/button.types';\n import { BentoTypography } from '@/components/typography';\n import { useHasSlot } from '@/composables';\n import { Booleanish } from '@/types';\n import type { RouterLinkProps } from 'vue-router/types/router';\n import type { AnchorHTMLAttributes, ButtonHTMLAttributes } from 'vue/types/jsx';\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 // eslint-disable-next-line vue/require-default-prop\n args?: { props: RouterLinkProps };\n\n /**\n * Set the rendered link to a regular external anchor link.\n */\n external: boolean;\n }\n\n /**\n * Button component for all the various types of bento buttons.\n *\n * @usage\n * import { BentoButton, AdlIconPosition } from '@adyen/bento-vue2';\n *\n * export default {\n * components: { BentoButton },\n * template: `\n * <bento-button\n * disabled\n * :icon-position=\"AdlIconPosition.AFTER\"\n * >\n * Button text\n * </bento-button>\n * `,\n * }\n */\n export default defineComponent({\n name: 'bento-button',\n components: { BentoTypography },\n props: {\n /**\n * Disables button functionality\n */\n disabled: {\n type: Boolean,\n default: false,\n },\n\n /**\n * Displays button as critical\n */\n critical: {\n type: Boolean,\n default: false,\n },\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 * Reduces sizing of button\n */\n condensed: {\n type: Boolean,\n default: false,\n },\n\n /**\n * Types of flavour of Button\n * @values primary, secondary, tertiary\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 * Object containing props passed on to the BentoLink component. @see BentoLink documentation for which properties you can pass.\n */\n link: {\n type: Object,\n default: undefined,\n },\n },\n emits: ['click', 'focus', 'blur', 'keydown.esc'],\n setup(props, { slots, emit, attrs }) {\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 }\n );\n\n const variantClass = computed((): { [x: string]: boolean } => ({\n [`b-button--${props.variant}${props.critical ? `-${BentoButtonPropClass.DESTRUCTIVE}` : ''}`]: true,\n }));\n\n const conditionalClasses = computed(\n (): {\n [x: string]: boolean;\n } => ({\n ...variantClass.value,\n [`b-button--${BentoButtonPropClass.CONDENSED}`]: props.condensed,\n [`b-button--${BentoButtonPropClass.ICON_ONLY}`]: !slots.default,\n [`b-button--${BentoButtonPropClass.DISABLED}`]: props.disabled,\n })\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\n return {\n // Values\n ariaAttributes,\n conditionalClasses,\n componentType,\n componentProps,\n\n // Methods\n onClickButton,\n hasSlot: useHasSlot(slots),\n };\n },\n });\n</script>\n\n<style lang=\"scss\" scoped src=\"@/core/components/button/button.scss\" />\n"],"names":["BentoButtonVariant","BentoButtonVariant2","BentoButtonPropClass","BentoButtonPropClass2","_sfc_main","defineComponent","BentoTypography","value","props","slots","emit","attrs","componentType","computed","BentoLink","ariaAttributes","_a","_b","componentProps","BentoLinkVariant","variantClass","conditionalClasses","useHasSlot","_ctx","withCtx","openBlock","createElementBlock","_hoisted_1","createCommentVNode","createBlock","_component_bento_typography","_hoisted_2"],"mappings":";;;;;;AAGY,IAAAA,IAAA,kBAAAC,OACRA,EAAA,UAAA,WACAA,EAAA,YAAA,aACAA,EAAA,WAAA,YAHQA,IAAAD,KAAA,CAAA,CAAA,GAMAE,IAAA,kBAAAC,OACRA,EAAA,YAAA,aACAA,EAAA,cAAA,YACAA,EAAA,WAAA,YACAA,EAAA,YAAA,aAJQA,IAAAD,KAAA,CAAA,CAAA;ACmDR,MAAAE,IAAAC,EAAA;AAAA,EAA+B,MAAA;AAAA,EACrB,YAAA,EAAA,iBAAAC,EAAA;AAAA,EACwB,OAAA;AAAA;AAAA;AAAA;AAAA,IACvB,UAAA;AAAA,MAIO,MAAA;AAAA,MACA,SAAA;AAAA,IACG;AAAA;AAAA;AAAA;AAAA,IACb,UAAA;AAAA,MAKU,MAAA;AAAA,MACA,SAAA;AAAA,IACG;AAAA;AAAA;AAAA;AAAA;AAAA,IACb,MAAA;AAAA,MAMM,MAAA;AAAA,MACI,SAAA;AAAA,IACG;AAAA;AAAA;AAAA;AAAA,IACb,WAAA;AAAA,MAKW,MAAA;AAAA,MACD,SAAA;AAAA,IACG;AAAA;AAAA;AAAA;AAAA;AAAA,IACb,SAAA;AAAA,MAMS,MAAA;AAAA,MACC,SAAAN,EAAA;AAAA,MACsB,WAAA,CAAAO,MAAA,OAAA,OAAAP,CAAA,EAAA,SAAAO,CAAA;AAAA,IAC8D;AAAA;AAAA;AAAA;AAAA,IAC9F,MAAA;AAAA,MAKM,MAAA;AAAA,MACI,SAAA;AAAA,IACG;AAAA,EACb;AAAA,EACJ,OAAA,CAAA,SAAA,SAAA,QAAA,aAAA;AAAA,EAC+C,MAAAC,GAAA,EAAA,OAAAC,GAAA,MAAAC,GAAA,OAAAC,EAAA,GAAA;AAE3C,UAAAC,IAAAC,EAAA,OACIL,KAAA,gBAAAA,EAAA,UAAA,SACIM,IAEJ,QAAO,GAEXC,IAAAF,EAAA,MAAA;;AAAA;AAAA,QAAuC,kBAAAG,IAAAL,EAAA,eAAA,MAAA,gBAAAK,EAAA;AAAA,QACe,kBAAAC,IAAAN,EAAA,eAAA,MAAA,gBAAAM,EAAA;AAAA,MACA;AAAA,KAAA,GAGtDC,IAAAL;AAAA,MAAuB,MAAAD,EAAA,UAAA,WAAA;AAAA,QAEb,GAAAG,EAAA;AAAA,QACsB,UAAAP,EAAA;AAAA,QACF,MAAAA,EAAA;AAAA,MACJ,IAAA,EAAA,GAAAA,EAAA,MAAA,mBAAA,IAAA,SAAAW,EAAA,QAAA;AAAA,IAE4D,GAGtFC,IAAAP,EAAA,OAAA;AAAA,MAA+D,CAAA,aAAAL,EAAA,UAAAA,EAAA,WAAA,IAAAN,EAAA,gBAAA,IAAA,GAAA;AAAA,IACoC,EAAA,GAGnGmB,IAAAR;AAAA,MAA2B,OAAA;AAAA,QAGjB,GAAAO,EAAA;AAAA,QACc,CAAA,aAAAlB,EAAA,WAAA,GAAAM,EAAA;AAAA,QACuC,CAAA,aAAAN,EAAA,WAAA,GAAA,CAAAO,EAAA;AAAA,QACC,CAAA,aAAAP,EAAA,UAAA,GAAAM,EAAA;AAAA,MACF;AAAA,IAC1D;AAYJ,WAAA;AAAA;AAAA,MAAO,gBAAAO;AAAA,MAEH,oBAAAM;AAAA,MACA,eAAAT;AAAA,MACA,gBAAAM;AAAA;AAAA,MACA,eAdJ,CAAA,MAAA;AACI,QAAAV,EAAA,YAGI,EAAA,eAAA,GACA,EAAA,gBAAA,KAHAE,EAAA,SAAA,CAAA;AAAA,MAIJ;AAAA,MAWA,SAAAY,EAAAb,CAAA;AAAA,IACyB;AAAA,EAC7B;AAER,CAAA;;EAtK2C,KAAA;AAAA,EAAsB,OAAA;AAAA;;EAMrB,KAAA;AAAA,EAAuB,OAAA;AAAA;;;;;IARlC,OAAA,CAAA,YAAAc,EAAA,kBAAA;AAAA,IAItB,gBAAAA,EAAA;AAAA,EAAA,CAAA,GAAA;AAAA,IAFP,SAAAC,EAAA,MAAA;AAAA,MAAAD,EAAA,QAAA,UAAA,KAAAE,EAAA,GAAAC,EAAA,QAAAC,GAAA;AAAA;MAGwB,CAAA,KAAAC,EAAA,IAAA,EAAA;AAAA,MAELL,EAAA,QAAA,SAAA,KAAAE,EAAA,GAAAI,EAAAC,GAAA;AAAA,QAFkC,KAAA;AAAA,QAAC,IAAA;AAAA,QAAe,SAAA;AAAA,QAAe,UAAA;AAAA;;;;;;;MAGpFP,EAAA,QAAA,WAAA,KAAAE,EAAA,GAAAC,EAAA,QAAAK,GAAA;AAAA;;;;;;;"}
@@ -1,8 +1,8 @@
1
1
  import { defineComponent as ce, computed as w, resolveComponent as P, openBlock as _, createElementBlock as O, normalizeClass as Se, withKeys as Ie, createElementVNode as p, createVNode as W, ref as L, watch as H, nextTick as pe, toRef as G, resolveDirective as Re, withDirectives as Pe, mergeProps as Ae, toHandlers as Le, createBlock as z, withCtx as K, createCommentVNode as ie, createTextVNode as he, toDisplayString as _e, Fragment as J, renderList as Z, reactive as we } from "vue";
2
2
  import { r as h, t as y, g as Ne, e as de, d as $e, f as Ue } from "./index.f55fdc32.js";
3
- import { t as b, B as Ye, a as Ce, f as Ee } from "./index.e84dbeae.js";
4
- import { a as We } from "./button.a8462029.js";
5
- import { B as Be } from "./index.89b00b94.js";
3
+ import { t as b, B as Ye, a as Ce, f as Ee } from "./index.140bf28f.js";
4
+ import { a as We } from "./button.7d09c245.js";
5
+ import { B as Be } from "./index.77c651df.js";
6
6
  import { u as Ve } from "./i18n.6c402773.js";
7
7
  import { g as Ge } from "./unique-id.a2a2b458.js";
8
8
  import { a as He } from "./debounce.f8d92e44.js";
@@ -870,4 +870,4 @@ export {
870
870
  k as a,
871
871
  V as b
872
872
  };
873
- //# sourceMappingURL=calendar.3f930683.js.map
873
+ //# sourceMappingURL=calendar.0e42130b.js.map