@adyen/bento-vue3 1.25.0 → 1.27.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (239) hide show
  1. package/dist/@types/components.d.ts +4 -0
  2. package/dist/@types/packages/core/src/utils/ts/storybook.d.ts +12 -0
  3. package/dist/@types/packages/vue2/src/components/button/components/button-actions/button-actions.types.d.ts +1 -0
  4. package/dist/@types/packages/vue2/src/components/button/components/button-actions/button-actions.vue.d.ts +1 -1
  5. package/dist/@types/packages/vue2/src/components/code-snippet/code-snippet.types.d.ts +2 -1
  6. package/dist/@types/packages/vue2/src/components/code-snippet/code-snippet.vue.d.ts +3 -3
  7. package/dist/@types/packages/vue2/src/components/code-snippet/utils/get-lang-loader.d.ts +2 -1
  8. package/dist/@types/packages/vue2/src/components/data-grid/components/data-grid-cell/data-grid-cell.vue.d.ts +1 -1
  9. package/dist/@types/packages/vue2/src/components/data-grid/components/data-grid-cell-actions/data-grid-cell-actions.types.d.ts +10 -2
  10. package/dist/@types/packages/vue2/src/components/data-grid/components/data-grid-columns/data-grid-columns.types.d.ts +3 -0
  11. package/dist/@types/packages/vue2/src/components/data-grid/components/data-grid-columns/data-grid-columns.vue.d.ts +8 -6
  12. package/dist/@types/packages/vue2/src/components/data-grid/composables/use-calculate-column-width/use-calculate-column-width.d.ts +27 -11
  13. package/dist/@types/packages/vue2/src/components/data-grid/composables/use-calculate-column-width/use-calculate-column-width.types.d.ts +1 -0
  14. package/dist/@types/packages/vue2/src/components/data-grid/composables/use-column-hovering/use-column-hovering.d.ts +19 -6
  15. package/dist/@types/packages/vue2/src/components/data-grid/composables/use-column-reorderer/use-column-reorderer.d.ts +38 -12
  16. package/dist/@types/packages/vue2/src/components/data-grid/composables/use-config-settings/use-config-settings.d.ts +19 -6
  17. package/dist/@types/packages/vue2/src/components/data-grid/composables/use-resizer.d.ts +19 -6
  18. package/dist/@types/packages/vue2/src/components/data-grid/data-grid.types.d.ts +2 -1
  19. package/dist/@types/packages/vue2/src/components/data-grid/data-grid.vue.d.ts +29 -48
  20. package/dist/@types/packages/vue2/src/components/dropdown/components/dropdown-options-container/dropdown-options-container.vue.d.ts +1 -18
  21. package/dist/@types/packages/vue2/src/components/filter-bar/components/all-filters-modal/all-filters-modal.vue.d.ts +12 -0
  22. package/dist/@types/packages/vue2/src/components/structured-list/components/structered-list-item/structured-list-item.vue.d.ts +36 -54
  23. package/dist/@types/packages/vue2/src/components/structured-list/structured-list.vue.d.ts +27 -22
  24. package/dist/@types/packages/vue2/src/components/tabs/tabs.vue.d.ts +76 -1
  25. package/dist/@types/packages/vue2/src/components/tutorial/components/tutorial-popover/tutorial-popover.vue.d.ts +20 -0
  26. package/dist/@types/packages/vue2/src/components/tutorial/tutorial.types.d.ts +1 -0
  27. package/dist/@types/packages/vue2/src/components/tutorial/tutorial.vue.d.ts +42 -3
  28. package/dist/@types/packages/vue2/src/components/typography/index.d.ts +1 -1
  29. package/dist/@types/packages/vue2/src/components/typography/typography.vue.d.ts +1 -1
  30. package/dist/@types/packages/vue2/src/index.d.ts +1 -0
  31. package/dist/@types/packages/vue2/src/templates/dashboard-template/components/dashboard-section/dashboard-section.vue.d.ts +78 -0
  32. package/dist/@types/packages/vue2/src/templates/dashboard-template/dashboard-template.types.d.ts +8 -0
  33. package/dist/@types/packages/vue2/src/templates/dashboard-template/dashboard-template.vue.d.ts +103 -0
  34. package/dist/@types/packages/vue2/src/templates/dashboard-template/index.d.ts +3 -0
  35. package/dist/@types/packages/vue2/src/utils/ts/storybook.d.ts +1 -12
  36. package/dist/accordion.js +2 -2
  37. package/dist/action-bar.js +70 -154
  38. package/dist/action-bar.js.map +1 -1
  39. package/dist/alert.js +3 -3
  40. package/dist/assets/base-modal.css +1 -1
  41. package/dist/assets/button-actions.css +1 -1
  42. package/dist/assets/button.css +1 -1
  43. package/dist/assets/dialog-page.css +1 -1
  44. package/dist/assets/dropdown.css +1 -1
  45. package/dist/assets/index.css +1 -1
  46. package/dist/assets/index10.css +1 -1
  47. package/dist/assets/index11.css +1 -1
  48. package/dist/assets/index12.css +1 -1
  49. package/dist/assets/index13.css +1 -1
  50. package/dist/assets/index14.css +1 -1
  51. package/dist/assets/index15.css +1 -1
  52. package/dist/assets/index16.css +1 -1
  53. package/dist/assets/index17.css +1 -1
  54. package/dist/assets/index18.css +1 -1
  55. package/dist/assets/index19.css +1 -1
  56. package/dist/assets/index2.css +1 -1
  57. package/dist/assets/index20.css +1 -1
  58. package/dist/assets/index21.css +1 -1
  59. package/dist/assets/index22.css +1 -1
  60. package/dist/assets/index23.css +1 -1
  61. package/dist/assets/index24.css +1 -1
  62. package/dist/assets/index25.css +1 -1
  63. package/dist/assets/index26.css +1 -1
  64. package/dist/assets/index27.css +1 -1
  65. package/dist/assets/index28.css +1 -1
  66. package/dist/assets/index29.css +1 -1
  67. package/dist/assets/index3.css +1 -1
  68. package/dist/assets/index30.css +1 -1
  69. package/dist/assets/index31.css +1 -1
  70. package/dist/assets/index32.css +1 -1
  71. package/dist/assets/index33.css +1 -1
  72. package/dist/assets/index34.css +1 -1
  73. package/dist/assets/index35.css +1 -1
  74. package/dist/assets/index36.css +1 -1
  75. package/dist/assets/index37.css +1 -1
  76. package/dist/assets/index38.css +1 -1
  77. package/dist/assets/index39.css +1 -1
  78. package/dist/assets/index4.css +1 -1
  79. package/dist/assets/index40.css +1 -1
  80. package/dist/assets/index41.css +1 -1
  81. package/dist/assets/index42.css +1 -1
  82. package/dist/assets/index43.css +1 -1
  83. package/dist/assets/index44.css +1 -1
  84. package/dist/assets/index45.css +1 -1
  85. package/dist/assets/index46.css +1 -1
  86. package/dist/assets/index47.css +1 -1
  87. package/dist/assets/index48.css +1 -1
  88. package/dist/assets/index49.css +1 -0
  89. package/dist/assets/index5.css +1 -1
  90. package/dist/assets/index6.css +1 -1
  91. package/dist/assets/index7.css +1 -1
  92. package/dist/assets/index8.css +1 -1
  93. package/dist/assets/index9.css +1 -1
  94. package/dist/assets/use-cached-selected-values.css +1 -1
  95. package/dist/avatar-image.js +1 -1
  96. package/dist/badge.js +1 -1
  97. package/dist/button.js +5 -5
  98. package/dist/card.js +3 -3
  99. package/dist/checkbox.js +5 -5
  100. package/dist/chunks/{base-button.6be8b60e.js → base-button.a0140a4c.js} +2 -2
  101. package/dist/chunks/{base-button.6be8b60e.js.map → base-button.a0140a4c.js.map} +1 -1
  102. package/dist/chunks/{base-modal.310c4790.js → base-modal.4102f69d.js} +6 -6
  103. package/dist/chunks/{base-modal.310c4790.js.map → base-modal.4102f69d.js.map} +1 -1
  104. package/dist/chunks/{button-actions-with-menu.a007b034.js → button-actions-with-menu.4f311411.js} +4 -4
  105. package/dist/chunks/{button-actions-with-menu.a007b034.js.map → button-actions-with-menu.4f311411.js.map} +1 -1
  106. package/dist/chunks/{button-actions.adc0a2fe.js → button-actions.82163994.js} +42 -40
  107. package/dist/chunks/button-actions.82163994.js.map +1 -0
  108. package/dist/chunks/{button.de5589fa.js → button.ae4760cd.js} +27 -26
  109. package/dist/chunks/button.ae4760cd.js.map +1 -0
  110. package/dist/chunks/{calendar.73f5b904.js → calendar.a9c5a68c.js} +5 -5
  111. package/dist/chunks/{calendar.73f5b904.js.map → calendar.a9c5a68c.js.map} +1 -1
  112. package/dist/chunks/{checkbox.4c96cc23.js → checkbox.9c30c07b.js} +3 -3
  113. package/dist/chunks/{checkbox.4c96cc23.js.map → checkbox.9c30c07b.js.map} +1 -1
  114. package/dist/chunks/{controls-group.37a67734.js → controls-group.8357e3fd.js} +3 -3
  115. package/dist/chunks/{controls-group.37a67734.js.map → controls-group.8357e3fd.js.map} +1 -1
  116. package/dist/chunks/{copy.43de2653.js → copy.60ee6ac3.js} +4 -4
  117. package/dist/chunks/{copy.43de2653.js.map → copy.60ee6ac3.js.map} +1 -1
  118. package/dist/chunks/{dialog-page.cd8c7fff.js → dialog-page.cb6ce9b6.js} +3 -3
  119. package/dist/chunks/{dialog-page.cd8c7fff.js.map → dialog-page.cb6ce9b6.js.map} +1 -1
  120. package/dist/chunks/{dropdown-default-textbox.424e0eb6.js → dropdown-default-textbox.cda0798f.js} +3 -3
  121. package/dist/chunks/{dropdown-default-textbox.424e0eb6.js.map → dropdown-default-textbox.cda0798f.js.map} +1 -1
  122. package/dist/chunks/{dropdown.57b2ea6f.js → dropdown.0ae3b842.js} +118 -128
  123. package/dist/chunks/dropdown.0ae3b842.js.map +1 -0
  124. package/dist/chunks/{error-message.4bd22112.js → error-message.d2bdeb80.js} +2 -2
  125. package/dist/chunks/{error-message.4bd22112.js.map → error-message.d2bdeb80.js.map} +1 -1
  126. package/dist/chunks/{events.58c00e6d.js → events.f14a214b.js} +5 -5
  127. package/dist/chunks/events.f14a214b.js.map +1 -0
  128. package/dist/chunks/{fixed-scroller.5b93a6a6.js → fixed-scroller.7b42cb1e.js} +2 -2
  129. package/dist/chunks/{fixed-scroller.5b93a6a6.js.map → fixed-scroller.7b42cb1e.js.map} +1 -1
  130. package/dist/chunks/{footer-actions.c401ec50.js → footer-actions.64f6f5d8.js} +4 -4
  131. package/dist/chunks/{footer-actions.c401ec50.js.map → footer-actions.64f6f5d8.js.map} +1 -1
  132. package/dist/chunks/{index.faec0854.js → index.2d7b4511.js} +9 -9
  133. package/dist/chunks/{index.faec0854.js.map → index.2d7b4511.js.map} +1 -1
  134. package/dist/chunks/index.2fcd1233.js +103 -0
  135. package/dist/chunks/index.2fcd1233.js.map +1 -0
  136. package/dist/chunks/{index.f71015d8.js → index.6295e754.js} +3 -3
  137. package/dist/chunks/{index.f71015d8.js.map → index.6295e754.js.map} +1 -1
  138. package/dist/chunks/{index.8b10ee32.js → index.6bb6f38c.js} +6 -6
  139. package/dist/chunks/{index.8b10ee32.js.map → index.6bb6f38c.js.map} +1 -1
  140. package/dist/chunks/{index.73ac0db6.js → index.8aa536a8.js} +3 -3
  141. package/dist/chunks/{index.73ac0db6.js.map → index.8aa536a8.js.map} +1 -1
  142. package/dist/chunks/{index.ea65003b.js → index.9d7fb316.js} +2 -2
  143. package/dist/chunks/{index.ea65003b.js.map → index.9d7fb316.js.map} +1 -1
  144. package/dist/chunks/{index.bab8811d.js → index.a001a0a8.js} +6 -6
  145. package/dist/chunks/{index.bab8811d.js.map → index.a001a0a8.js.map} +1 -1
  146. package/dist/chunks/{index.98bbaed9.js → index.b18c78d6.js} +2 -2
  147. package/dist/chunks/{index.98bbaed9.js.map → index.b18c78d6.js.map} +1 -1
  148. package/dist/chunks/{index.aa83aa48.js → index.eb38a6c4.js} +3 -3
  149. package/dist/chunks/{index.aa83aa48.js.map → index.eb38a6c4.js.map} +1 -1
  150. package/dist/chunks/{index.11b6dd35.js → index.ee15db35.js} +17 -17
  151. package/dist/chunks/index.ee15db35.js.map +1 -0
  152. package/dist/chunks/{index.8682bd04.js → index.f9d081d2.js} +2 -2
  153. package/dist/chunks/{index.8682bd04.js.map → index.f9d081d2.js.map} +1 -1
  154. package/dist/chunks/index.fedbb4c2.js +125 -0
  155. package/dist/chunks/index.fedbb4c2.js.map +1 -0
  156. package/dist/chunks/{keyboard-navigation.ca47dfa8.js → keyboard-navigation.bbc3d15c.js} +2 -2
  157. package/dist/chunks/{keyboard-navigation.ca47dfa8.js.map → keyboard-navigation.bbc3d15c.js.map} +1 -1
  158. package/dist/chunks/{listbox-option-tag.d1a3b340.js → listbox-option-tag.2aea037c.js} +3 -3
  159. package/dist/chunks/{listbox-option-tag.d1a3b340.js.map → listbox-option-tag.2aea037c.js.map} +1 -1
  160. package/dist/chunks/{loading-button.2db95771.js → loading-button.6b81b546.js} +2 -2
  161. package/dist/chunks/{loading-button.2db95771.js.map → loading-button.6b81b546.js.map} +1 -1
  162. package/dist/chunks/{payment-method.26fa5509.js → payment-method.d5595a7c.js} +2 -2
  163. package/dist/chunks/{payment-method.26fa5509.js.map → payment-method.d5595a7c.js.map} +1 -1
  164. package/dist/chunks/{tooltip.e29f7d7e.js → tooltip.36172265.js} +4 -4
  165. package/dist/chunks/{tooltip.e29f7d7e.js.map → tooltip.36172265.js.map} +1 -1
  166. package/dist/chunks/{use-bento-toast-controller.98ca249a.js → use-bento-toast-controller.3dc4e113.js} +2 -2
  167. package/dist/chunks/{use-bento-toast-controller.98ca249a.js.map → use-bento-toast-controller.3dc4e113.js.map} +1 -1
  168. package/dist/chunks/{use-cached-selected-values.a9b0fb3d.js → use-cached-selected-values.3c312296.js} +396 -375
  169. package/dist/chunks/use-cached-selected-values.3c312296.js.map +1 -0
  170. package/dist/code-snippet.js +137 -135
  171. package/dist/code-snippet.js.map +1 -1
  172. package/dist/country.js +2 -2
  173. package/dist/currency.js +1 -1
  174. package/dist/dashboard-template.js +169 -0
  175. package/dist/dashboard-template.js.map +1 -0
  176. package/dist/data-grid-template.js +1 -1
  177. package/dist/data-grid.js +1295 -1253
  178. package/dist/data-grid.js.map +1 -1
  179. package/dist/date-picker.js +8 -8
  180. package/dist/date-range-picker.js +2 -2
  181. package/dist/date.js +1 -1
  182. package/dist/divider.js +1 -1
  183. package/dist/dropdown.js +7 -7
  184. package/dist/empty-state.js +3 -3
  185. package/dist/filter-bar.js +84 -82
  186. package/dist/filter-bar.js.map +1 -1
  187. package/dist/focus-trap.js +1 -1
  188. package/dist/form-layout.js +53 -51
  189. package/dist/form-layout.js.map +1 -1
  190. package/dist/header.js +4 -4
  191. package/dist/index.js +66 -63
  192. package/dist/index.js.map +1 -1
  193. package/dist/info-icon.js +3 -3
  194. package/dist/input-field.js +4 -4
  195. package/dist/internal.js +8 -8
  196. package/dist/link.js +1 -1
  197. package/dist/loading-indicator.js +1 -1
  198. package/dist/menu.js +1 -1
  199. package/dist/modal-fullscreen.js +6 -6
  200. package/dist/modal.js +6 -6
  201. package/dist/pagination.js +4 -4
  202. package/dist/payment-method.js +1 -1
  203. package/dist/popover.js +1 -1
  204. package/dist/popper-container.js +1 -1
  205. package/dist/radio-group.js +4 -4
  206. package/dist/search-bar.js +2 -2
  207. package/dist/secondary-nav.js +2 -2
  208. package/dist/segmented-control.js +66 -72
  209. package/dist/segmented-control.js.map +1 -1
  210. package/dist/selection-card.js +4 -4
  211. package/dist/sidepanel.js +6 -6
  212. package/dist/status.js +2 -2
  213. package/dist/stepper.js +4 -4
  214. package/dist/structured-list.js +1 -1
  215. package/dist/summary-grid.js +3 -3
  216. package/dist/tabs.js +81 -77
  217. package/dist/tabs.js.map +1 -1
  218. package/dist/tag.js +3 -3
  219. package/dist/textarea.js +4 -4
  220. package/dist/timeline.js +7 -7
  221. package/dist/toast.js +4 -4
  222. package/dist/toggle.js +2 -2
  223. package/dist/tutorial.js +168 -132
  224. package/dist/tutorial.js.map +1 -1
  225. package/dist/typography.js +1 -1
  226. package/dist/web-types.json +1 -1
  227. package/package.json +8 -6
  228. package/dist/@types/packages/vue2/src/composables/useDynamicImport.d.ts +0 -8
  229. package/dist/chunks/button-actions.adc0a2fe.js.map +0 -1
  230. package/dist/chunks/button.de5589fa.js.map +0 -1
  231. package/dist/chunks/checkmark.eb3c7a06.js +0 -29
  232. package/dist/chunks/checkmark.eb3c7a06.js.map +0 -1
  233. package/dist/chunks/dropdown.57b2ea6f.js.map +0 -1
  234. package/dist/chunks/events.58c00e6d.js.map +0 -1
  235. package/dist/chunks/index.11b6dd35.js.map +0 -1
  236. package/dist/chunks/index.38752f78.js +0 -168
  237. package/dist/chunks/index.38752f78.js.map +0 -1
  238. package/dist/chunks/use-cached-selected-values.a9b0fb3d.js.map +0 -1
  239. /package/dist/@types/packages/{vue2 → core}/src/components/typography/typography.types.d.ts +0 -0
@@ -1 +1 @@
1
- svg.ui-assets-icons-16{display:inline-flex;flex-shrink:0}svg.ui-assets-icons-16,svg.ui-assets-icons-16 *{fill:currentcolor}.b-alert[data-v-5c5a81b8]{scrollbar-color:var(--b-color-background-quaternary) transparent;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;container-type:inline-size;display:flex;width:100%}.b-alert[data-v-5c5a81b8],.b-alert[data-v-5c5a81b8]:before,.b-alert[data-v-5c5a81b8]:after{box-sizing:border-box}.b-alert *[data-v-5c5a81b8],.b-alert *[data-v-5c5a81b8]:before,.b-alert *[data-v-5c5a81b8]:after{box-sizing:border-box}.b-alert[data-v-5c5a81b8] ::-webkit-scrollbar{height:14px;width:14px}.b-alert[data-v-5c5a81b8] ::-webkit-scrollbar-thumb{background-clip:padding-box;background-color:var(--b-color-background-quaternary);border:3px solid transparent;border-radius:var(--b-border-radius-l)}.b-legacy-theme .b-alert__title[data-v-5c5a81b8]{line-height:16px}.b-alert__inner-container[data-v-5c5a81b8]{align-items:flex-start;border-radius:var(--b-alert-border-radius);display:flex;gap:var(--b-alert-gap-mobile);padding:var(--b-alert-padding-mobile);width:100%}@container (min-width: 460px){.b-alert__inner-container[data-v-5c5a81b8]{gap:var(--b-alert-gap);padding:var(--b-alert-padding)}}.b-alert__icon[data-v-5c5a81b8]{align-items:center;display:flex;height:var(--b-alert-icon-height)}.b-alert--tip .b-alert__icon[data-v-5c5a81b8]{height:var(--b-alert-tip-icon-height)}.b-alert--tip.b-alert__inner-container[data-v-5c5a81b8]{gap:var(--b-alert-tip-gap);padding:var(--b-alert-tip-padding)}.b-alert__content[data-v-5c5a81b8]{max-width:700px;width:100%}.b-alert__title[data-v-5c5a81b8]{flex-grow:1}.b-alert__description[data-v-5c5a81b8]:not(:first-child){margin-top:var(--b-alert-description-margin-top)}.b-alert__actions[data-v-5c5a81b8]{display:flex;gap:var(--b-alert-actions-gap);margin-top:var(--b-alert-actions-margin-top)}.b-alert__close-button[data-v-5c5a81b8]{display:flex;flex-grow:1;justify-content:flex-end}.b-alert--success[data-v-5c5a81b8]{background-color:var(--b-alert-success-background-color)}.b-alert--success .b-alert__icon[data-v-5c5a81b8]{color:var(--b-alert-success-icon-color)}.b-alert--success .b-alert__title[data-v-5c5a81b8],.b-alert--success .b-alert__description[data-v-5c5a81b8],.b-alert--success .b-alert__close-button[data-v-5c5a81b8]{color:var(--b-alert-success-color)}.b-alert--highlight[data-v-5c5a81b8]{background-color:var(--b-alert-highlight-background-color)}.b-alert--highlight .b-alert__icon[data-v-5c5a81b8]{color:var(--b-alert-highlight-icon-color)}.b-alert--highlight .b-alert__title[data-v-5c5a81b8],.b-alert--highlight .b-alert__description[data-v-5c5a81b8],.b-alert--highlight .b-alert__close-button[data-v-5c5a81b8]{color:var(--b-alert-highlight-color)}.b-alert--warning[data-v-5c5a81b8]{background-color:var(--b-alert-warning-background-color)}.b-alert--warning .b-alert__icon[data-v-5c5a81b8]{color:var(--b-alert-warning-icon-color)}.b-alert--warning .b-alert__title[data-v-5c5a81b8],.b-alert--warning .b-alert__description[data-v-5c5a81b8],.b-alert--warning .b-alert__close-button[data-v-5c5a81b8]{color:var(--b-alert-warning-color)}.b-alert--critical[data-v-5c5a81b8]{background-color:var(--b-alert-critical-background-color)}.b-alert--critical .b-alert__icon[data-v-5c5a81b8]{color:var(--b-alert-critical-icon-color)}.b-alert--critical .b-alert__title[data-v-5c5a81b8],.b-alert--critical .b-alert__description[data-v-5c5a81b8],.b-alert--critical .b-alert__close-button[data-v-5c5a81b8]{color:var(--b-alert-critical-color)}
1
+ button[data-v-fe3e2223]{background-color:transparent;border:0;font:inherit;text-align:inherit}button[data-v-fe3e2223]:focus-visible{outline:none}.b-filter-bar-button[data-v-fe3e2223]{scrollbar-color:var(--b-color-background-quaternary) transparent;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;align-items:center;appearance:none;background-color:var(--b-filter-bar-button-background-color);border:var(--b-filter-bar-button-border);border-radius:var(--b-filter-bar-button-border-radius);color:var(--b-filter-bar-button-color);cursor:pointer;display:inline-flex;height:var(--b-filter-bar-button-height);justify-content:center;text-decoration:none;user-select:none}.b-filter-bar-button[data-v-fe3e2223],.b-filter-bar-button[data-v-fe3e2223]:before,.b-filter-bar-button[data-v-fe3e2223]:after{box-sizing:border-box}.b-filter-bar-button *[data-v-fe3e2223],.b-filter-bar-button *[data-v-fe3e2223]:before,.b-filter-bar-button *[data-v-fe3e2223]:after{box-sizing:border-box}.b-filter-bar-button[data-v-fe3e2223] ::-webkit-scrollbar{height:14px;width:14px}.b-filter-bar-button[data-v-fe3e2223] ::-webkit-scrollbar-thumb{background-clip:padding-box;background-color:var(--b-color-background-quaternary);border:3px solid transparent;border-radius:var(--b-border-radius-l)}@media (hover: hover){.b-filter-bar-button[data-v-fe3e2223]:hover{background-color:var(--b-filter-bar-button-hover-background-color);color:var(--b-filter-bar-button-hover-color)}.b-filter-bar-button:hover .b-filter-bar-button__counter[data-v-fe3e2223]{background-color:var(--b-filter-bar-button-counter-hover-background-color)}}.b-legacy-theme .b-filter-bar-button__counter[data-v-fe3e2223],.b-legacy-theme .b-filter-bar-button__secondary-label[data-v-fe3e2223]{font-weight:400;line-height:18px}.b-legacy-theme .b-filter-bar-button__label[data-v-fe3e2223]{font-weight:400}.b-legacy-theme .b-filter-bar-button--active[data-v-fe3e2223]{background-color:var(--b-filter-bar-button-with-counter-background-color);border:var(--b-filter-bar-button-with-counter-border);color:var(--b-filter-bar-button-with-counter-color)}.b-legacy-theme .b-filter-bar-button--active[data-v-fe3e2223]:active:not(:disabled){background-color:var(--b-filter-bar-button-with-counter-active-background-color);border-color:var(--b-filter-bar-button-with-counter-active-border-color);color:var(--b-filter-bar-button-with-counter-active-color)}.b-legacy-theme .b-filter-bar-button--active:active:not(:disabled) .b-filter-bar-button__counter[data-v-fe3e2223]{color:var(--b-filter-bar-button-with-counter-active-counter-color)}.b-filter-bar-button[data-v-fe3e2223]:active:not(:disabled){border:var(--b-filter-bar-button-active-border)}.b-filter-bar-button[data-v-fe3e2223]:disabled,.b-filter-bar-button[data-v-fe3e2223]:disabled:not(:focus){background-color:var(--b-filter-bar-button-disabled-background-color);color:var(--b-filter-bar-button-disabled-color);cursor:not-allowed}.b-filter-bar-button:disabled .b-filter-bar-button__counter[data-v-fe3e2223],.b-filter-bar-button:disabled:not(:focus) .b-filter-bar-button__counter[data-v-fe3e2223]{background-color:var(--b-filter-bar-button-counter-disabled-background-color);color:var(--b-filter-bar-button-counter-disabled-color)}.b-filter-bar-button[data-v-fe3e2223]:focus-visible{animation:outer-ring-default-fe3e2223 var(--b-animation-duration-fast) var(--b-animation-easing-standard);box-shadow:0 0 0 var(--b-focus-ring-spacer) var(--b-color-background-primary),0 0 0 var(--b-focus-ring-outline) var(--b-focus-ring-color);z-index:1}@keyframes outer-ring-default-fe3e2223{0%{box-shadow:0 0 0 var(--b-border-width-s) var(--b-color-background-primary),0 0 0 0 var(--b-focus-ring-color)}to{box-shadow:0 0 0 var(--b-border-width-s) var(--b-color-background-primary),0 0 0 var(--b-border-width-l) var(--b-focus-ring-color)}}.b-filter-bar-button--filter-open[data-v-fe3e2223]:not(:hover){border:var(--b-filter-bar-button-filter-open-border)}.b-filter-bar-button--with-chevron .b-filter-bar-button__container[data-v-fe3e2223]{padding-right:var(--b-filter-bar-button-with-chevron-container-padding-right)}.b-filter-bar-button--with-secondary-label .b-filter-bar-button__container[data-v-fe3e2223]{padding-right:var(--b-filter-bar-button-with-secondary-label-container-padding-right)}.b-filter-bar-button__chevron[data-v-fe3e2223]{display:flex;justify-content:center;padding-right:var(--b-filter-bar-button-chevron-padding-right)}.b-filter-bar-button__container[data-v-fe3e2223]{align-items:center;display:inline-flex;gap:var(--b-filter-bar-button-container-gap);justify-content:center;padding:var(--b-filter-bar-button-container-padding);vertical-align:bottom}.b-filter-bar-button__counter[data-v-fe3e2223]{background-color:var(--b-filter-bar-button-counter-background-color);border-radius:var(--b-filter-bar-button-counter-border-radius);color:var(--b-filter-bar-button-counter-color);margin-right:var(--b-filter-bar-button-counter-margin-right);padding:var(--b-filter-bar-button-counter-padding)}.b-filter-bar-button__label-container[data-v-fe3e2223]{align-items:center;display:inline-flex;gap:var(--b-filter-bar-button-label-container-gap)}.b-filter-bar-button__label[data-v-fe3e2223],.b-filter-bar-button__secondary-label[data-v-fe3e2223]{display:inline-flex;line-height:var(--b-filter-bar-button-label-line-height);vertical-align:middle}.b-filter-bar-button__secondary-label[data-v-fe3e2223]{background-color:var(--b-filter-bar-button-secondary-label-background-color);border-radius:var(--b-filter-bar-button-secondary-label-border-radius);color:var(--b-filter-bar-button-secondary-label-color);padding:var(--b-filter-bar-button-secondary-label-padding)}.b-filter-bar-button__icon-left[data-v-fe3e2223],.b-filter-bar-button__icon-right[data-v-fe3e2223]{display:inline-flex}.b-base-filter[data-v-07a7c55e]{scrollbar-color:var(--b-color-background-quaternary) transparent;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;display:inline-block;flex-shrink:0}.b-base-filter[data-v-07a7c55e],.b-base-filter[data-v-07a7c55e]:before,.b-base-filter[data-v-07a7c55e]:after{box-sizing:border-box}.b-base-filter *[data-v-07a7c55e],.b-base-filter *[data-v-07a7c55e]:before,.b-base-filter *[data-v-07a7c55e]:after{box-sizing:border-box}.b-base-filter[data-v-07a7c55e] ::-webkit-scrollbar{height:14px;width:14px}.b-base-filter[data-v-07a7c55e] ::-webkit-scrollbar-thumb{background-clip:padding-box;background-color:var(--b-color-background-quaternary);border:3px solid transparent;border-radius:var(--b-border-radius-l)}.b-legacy-theme .b-base-filter__popover[data-v-07a7c55e] .b-button-actions__container-wrapper{flex-direction:row;justify-content:space-between}.b-input-filter[data-v-4f3a323d]{scrollbar-color:var(--b-color-background-quaternary) transparent;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;padding:var(--b-filter-bar-input-filter-padding)}.b-input-filter[data-v-4f3a323d],.b-input-filter[data-v-4f3a323d]:before,.b-input-filter[data-v-4f3a323d]:after{box-sizing:border-box}.b-input-filter *[data-v-4f3a323d],.b-input-filter *[data-v-4f3a323d]:before,.b-input-filter *[data-v-4f3a323d]:after{box-sizing:border-box}.b-input-filter[data-v-4f3a323d] ::-webkit-scrollbar{height:14px;width:14px}.b-input-filter[data-v-4f3a323d] ::-webkit-scrollbar-thumb{background-clip:padding-box;background-color:var(--b-color-background-quaternary);border:3px solid transparent;border-radius:var(--b-border-radius-l)}.b-input-filter--only-slot[data-v-4f3a323d]{padding:var(--b-filter-bar-input-filter-only-slot-padding)}.b-date-filter[data-v-66ffdc53]{scrollbar-color:var(--b-color-background-quaternary) transparent;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;padding:var(--b-filter-bar-date-filter-padding)}.b-date-filter[data-v-66ffdc53],.b-date-filter[data-v-66ffdc53]:before,.b-date-filter[data-v-66ffdc53]:after{box-sizing:border-box}.b-date-filter *[data-v-66ffdc53],.b-date-filter *[data-v-66ffdc53]:before,.b-date-filter *[data-v-66ffdc53]:after{box-sizing:border-box}.b-date-filter[data-v-66ffdc53] ::-webkit-scrollbar{height:14px;width:14px}.b-date-filter[data-v-66ffdc53] ::-webkit-scrollbar-thumb{background-clip:padding-box;background-color:var(--b-color-background-quaternary);border:3px solid transparent;border-radius:var(--b-border-radius-l)}.b-date-filter__divider[data-v-66ffdc53]{margin-top:var(--b-filter-bar-date-filter-divider-margin-top)}@container (max-width: 260px){.b-base-filter-date-range-filter[data-v-570ca68b] .b-filter-bar-button__secondary-label{display:block;max-width:140px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}}.b-date-range-filter[data-v-570ca68b]{scrollbar-color:var(--b-color-background-quaternary) transparent;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.b-date-range-filter[data-v-570ca68b],.b-date-range-filter[data-v-570ca68b]:before,.b-date-range-filter[data-v-570ca68b]:after{box-sizing:border-box}.b-date-range-filter *[data-v-570ca68b],.b-date-range-filter *[data-v-570ca68b]:before,.b-date-range-filter *[data-v-570ca68b]:after{box-sizing:border-box}.b-date-range-filter[data-v-570ca68b] ::-webkit-scrollbar{height:14px;width:14px}.b-date-range-filter[data-v-570ca68b] ::-webkit-scrollbar-thumb{background-clip:padding-box;background-color:var(--b-color-background-quaternary);border:3px solid transparent;border-radius:var(--b-border-radius-l)}.b-date-range-filter__actions[data-v-570ca68b]{padding:var(--b-filter-bar-date-range-filter-actions-padding)}.b-legacy-theme .b-date-range-filter__actions[data-v-570ca68b] .b-button-actions__container-wrapper{flex-direction:initial;justify-content:space-between}.b-date-range-filter__divider[data-v-570ca68b]{margin:var(--b-filter-bar-date-range-filter-divider-margin)}.b-select-filter-button[data-v-4eb2ccc6]{scrollbar-color:var(--b-color-background-quaternary) transparent;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.b-select-filter-button[data-v-4eb2ccc6],.b-select-filter-button[data-v-4eb2ccc6]:before,.b-select-filter-button[data-v-4eb2ccc6]:after{box-sizing:border-box}.b-select-filter-button *[data-v-4eb2ccc6],.b-select-filter-button *[data-v-4eb2ccc6]:before,.b-select-filter-button *[data-v-4eb2ccc6]:after{box-sizing:border-box}.b-select-filter-button[data-v-4eb2ccc6] ::-webkit-scrollbar{height:14px;width:14px}.b-select-filter-button[data-v-4eb2ccc6] ::-webkit-scrollbar-thumb{background-clip:padding-box;background-color:var(--b-color-background-quaternary);border:3px solid transparent;border-radius:var(--b-border-radius-l)}.b-select-filter-button__divider[data-v-4eb2ccc6]{margin:var(--b-filter-bar-select-filter-button-divider-margin)}.b-select-filter-button__search-bar[data-v-4eb2ccc6]{padding:var(--b-filter-bar-select-filter-button-search-bar-padding)}.b-select-filter-button__wrapper[data-v-4eb2ccc6]{max-height:270px}.b-boolean-filter[data-v-1fa97477]{scrollbar-color:var(--b-color-background-quaternary) transparent;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;padding:var(--b-filter-bar-boolean-filter-padding)}.b-boolean-filter[data-v-1fa97477],.b-boolean-filter[data-v-1fa97477]:before,.b-boolean-filter[data-v-1fa97477]:after{box-sizing:border-box}.b-boolean-filter *[data-v-1fa97477],.b-boolean-filter *[data-v-1fa97477]:before,.b-boolean-filter *[data-v-1fa97477]:after{box-sizing:border-box}.b-boolean-filter[data-v-1fa97477] ::-webkit-scrollbar{height:14px;width:14px}.b-boolean-filter[data-v-1fa97477] ::-webkit-scrollbar-thumb{background-clip:padding-box;background-color:var(--b-color-background-quaternary);border:3px solid transparent;border-radius:var(--b-border-radius-l)}.b-boolean-filter--only-slot[data-v-1fa97477]{padding:var(--b-filter-bar-boolean-filter-only-slot-padding)}.b-range-filter[data-v-93c845a0]{scrollbar-color:var(--b-color-background-quaternary) transparent;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;padding:var(--b-filter-bar-range-filter-padding)}.b-range-filter[data-v-93c845a0],.b-range-filter[data-v-93c845a0]:before,.b-range-filter[data-v-93c845a0]:after{box-sizing:border-box}.b-range-filter *[data-v-93c845a0],.b-range-filter *[data-v-93c845a0]:before,.b-range-filter *[data-v-93c845a0]:after{box-sizing:border-box}.b-range-filter[data-v-93c845a0] ::-webkit-scrollbar{height:14px;width:14px}.b-range-filter[data-v-93c845a0] ::-webkit-scrollbar-thumb{background-clip:padding-box;background-color:var(--b-color-background-quaternary);border:3px solid transparent;border-radius:var(--b-border-radius-l)}.b-range-filter__input-field[data-v-93c845a0]{padding-top:var(--b-filter-bar-range-filter-item-padding)}.b-range-filter--only-slot[data-v-93c845a0]{padding:var(--b-filter-bar-range-filter-only-slot-padding)}button[data-v-af9efc73]{background-color:transparent;border:0;font:inherit;text-align:inherit}button[data-v-af9efc73]:focus-visible{outline:none}.b-base-filter-button[data-v-af9efc73]{scrollbar-color:var(--b-color-background-quaternary) transparent;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;align-items:center;appearance:none;background-color:var(--b-filter-button-background-color);color:var(--b-filter-button-font-color);cursor:pointer;height:40px;justify-content:center;padding:var(--b-filter-button-padding);text-decoration:none;user-select:none;width:100%}.b-base-filter-button[data-v-af9efc73],.b-base-filter-button[data-v-af9efc73]:before,.b-base-filter-button[data-v-af9efc73]:after{box-sizing:border-box}.b-base-filter-button *[data-v-af9efc73],.b-base-filter-button *[data-v-af9efc73]:before,.b-base-filter-button *[data-v-af9efc73]:after{box-sizing:border-box}.b-base-filter-button[data-v-af9efc73] ::-webkit-scrollbar{height:14px;width:14px}.b-base-filter-button[data-v-af9efc73] ::-webkit-scrollbar-thumb{background-clip:padding-box;background-color:var(--b-color-background-quaternary);border:3px solid transparent;border-radius:var(--b-border-radius-l)}@media (hover: hover){.b-base-filter-button[data-v-af9efc73]:hover{background-color:var(--b-filter-button-hover-background-color);color:var(--b-filter-button-hover-text-color)}.b-base-filter-button:hover .b-base-filter-button__counter[data-v-af9efc73]{background-color:var(--b-filter-button-counter-hover-background-color)}}.b-legacy-theme .b-base-filter-button__counter[data-v-af9efc73]{font-weight:400;line-height:19px}.b-legacy-theme .b-base-filter-button__label[data-v-af9efc73]{font-weight:400}.b-base-filter-button[data-v-af9efc73] .b-base-button__label{width:100%}.b-base-filter-button[data-v-af9efc73]:active:not(:disabled){background-color:var(--b-filter-button-active-background-color)}.b-base-filter-button:active:not(:disabled) .b-base-filter-button__counter[data-v-af9efc73]{background-color:var(--b-filter-button-counter-active-background-color)}.b-base-filter-button[data-v-af9efc73]:disabled,.b-base-filter-button[data-v-af9efc73]:disabled:not(:focus){background-color:var(--b-filter-button-disabled-background-color);color:var(--b-filter-button-disabled-font-color);cursor:not-allowed}.b-base-filter-button:disabled .b-base-filter-button__counter[data-v-af9efc73],.b-base-filter-button:disabled:not(:focus) .b-base-filter-button__counter[data-v-af9efc73]{background-color:var(--b-filter-button-counter-disabled-background-color);color:var(--b-filter-button-counter-disabled-font-color)}.b-base-filter-button[data-v-af9efc73]:focus-visible{background-color:var(--b-filter-button-modal-focus-background-color)}.b-base-filter-button:focus-visible .b-base-filter-button__counter[data-v-af9efc73]{background-color:var(--b-filter-button-modal-counter-focus-background-color)}.b-base-filter-button--filter-open[data-v-af9efc73]{background-color:var(--b-filter-button-modal-open-background-color)}.b-base-filter-button--filter-open .b-base-filter-button__counter[data-v-af9efc73]{background-color:var(--b-filter-button-counter-open-background-color)}.b-base-filter-button__default-container[data-v-af9efc73]{align-items:center;display:flex;gap:var(--b-filter-button-default-container-gap);width:100%}.b-base-filter-button__counter[data-v-af9efc73]{background-color:var(--b-filter-button-counter-background-color);border-radius:var(--b-filter-button-counter-border-radius);color:var(--b-filter-button-counter-font-color);padding:var(--b-filter-button-counter-padding)}.b-base-filter-button__counter-wrapper[data-v-af9efc73]{align-items:center;display:flex}.b-base-filter-button__label[data-v-af9efc73]{display:block;overflow:hidden;text-overflow:ellipsis}.b-base-filter-button__label-container[data-v-af9efc73]{overflow:hidden;white-space:nowrap;width:100%}.b-base-filter-button__icon-left[data-v-af9efc73],.b-base-filter-button__icon-right[data-v-af9efc73]{display:inline-flex}.b-all-filters-modal-button[data-v-b96a672f]{scrollbar-color:var(--b-color-background-quaternary) transparent;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.b-all-filters-modal-button[data-v-b96a672f],.b-all-filters-modal-button[data-v-b96a672f]:before,.b-all-filters-modal-button[data-v-b96a672f]:after{box-sizing:border-box}.b-all-filters-modal-button *[data-v-b96a672f],.b-all-filters-modal-button *[data-v-b96a672f]:before,.b-all-filters-modal-button *[data-v-b96a672f]:after{box-sizing:border-box}.b-all-filters-modal-button[data-v-b96a672f] ::-webkit-scrollbar{height:14px;width:14px}.b-all-filters-modal-button[data-v-b96a672f] ::-webkit-scrollbar-thumb{background-clip:padding-box;background-color:var(--b-color-background-quaternary);border:3px solid transparent;border-radius:var(--b-border-radius-l)}@media (hover: hover){.b-all-filters-modal-button[data-v-b96a672f]:hover{background-color:var(--b-filter-button-modal-hover-background-color);color:var(--b-filter-button-modal-hover-color)}}.b-legacy-theme .b-all-filters-modal-button[data-v-b96a672f]{border-radius:var(--b-filter-button-modal-border-radius)}@media (hover: hover){.b-legacy-theme .b-all-filters-modal-button[data-v-b96a672f]:hover{background-color:var(--b-filter-button-modal-hover-background-color)}.b-legacy-theme .b-all-filters-modal-button[data-v-b96a672f]:hover:is(.b-all-filters-modal-button--filter-open){background-color:var(--b-filter-button-modal-open-background-color)}}.b-legacy-theme .b-all-filters-modal-button[data-v-b96a672f]:disabled,.b-legacy-theme .b-all-filters-modal-button[data-v-b96a672f]:disabled:not(:focus){background-color:var(--b-filter-button-modal-disabled-background-color);color:var(--b-filter-button-modal-disabled-color)}.b-legacy-theme .b-all-filters-modal-button[data-v-b96a672f]:disabled .b-base-filter-button__counter,.b-legacy-theme .b-all-filters-modal-button[data-v-b96a672f]:disabled:not(:focus) .b-base-filter-button__counter{background-color:var(--b-filter-button-modal-disabled-counter-background-color);color:var(--b-filter-button-modal-disabled-counter-color)}.b-legacy-theme .b-all-filters-modal-button[data-v-b96a672f]:focus-visible{box-shadow:var(--b-filter-button-modal-focus-box-shadow)}.b-legacy-theme .b-all-filters-modal-button[data-v-b96a672f]:focus-visible:is(.b-all-filters-modal-button--filter-open){background-color:var(--b-filter-button-modal-open-background-color)}.b-legacy-theme .b-all-filters-modal-button[data-v-b96a672f] .b-base-filter-button__counter{background-color:var(--b-filter-button-modal-counter-background-color);color:var(--b-filter-button-modal-counter-color)}svg.ui-assets-icons-16{display:inline-flex;flex-shrink:0}svg.ui-assets-icons-16,svg.ui-assets-icons-16 *{fill:currentcolor}.b-all-filters-modal[data-v-dfa0bb7c]{scrollbar-color:var(--b-color-background-quaternary) transparent;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.b-all-filters-modal[data-v-dfa0bb7c],.b-all-filters-modal[data-v-dfa0bb7c]:before,.b-all-filters-modal[data-v-dfa0bb7c]:after{box-sizing:border-box}.b-all-filters-modal *[data-v-dfa0bb7c],.b-all-filters-modal *[data-v-dfa0bb7c]:before,.b-all-filters-modal *[data-v-dfa0bb7c]:after{box-sizing:border-box}.b-all-filters-modal[data-v-dfa0bb7c] ::-webkit-scrollbar{height:14px;width:14px}.b-all-filters-modal[data-v-dfa0bb7c] ::-webkit-scrollbar-thumb{background-clip:padding-box;background-color:var(--b-color-background-quaternary);border:3px solid transparent;border-radius:var(--b-border-radius-l)}.b-all-filters-modal[data-v-dfa0bb7c] .b-modal-page{height:calc(100vh - 128px);max-height:800px;overflow:hidden;position:relative}.b-all-filters-modal[data-v-dfa0bb7c] .b-modal-base__container{height:calc(100vh - 128px)!important;max-height:800px}.b-all-filters-modal[data-v-dfa0bb7c] .b-dialog-page__content{display:flex}.b-all-filters-modal[data-v-dfa0bb7c] .b-modal-page__content{flex:1;padding:var(--b-filter-bar-all-filters-modal-content-padding)}.b-all-filters-modal[data-v-dfa0bb7c] .b-modal-page__content>.b-typography{height:100%}.b-all-filters-modal[data-v-dfa0bb7c] .b-modal-page__grid{overflow:hidden}.b-all-filters-modal[data-v-dfa0bb7c] .b-modal-page__grid>:nth-child(1){-ms-overflow-style:none;scrollbar-width:none;height:100%;overflow-y:auto;padding-bottom:var(--b-filter-bar-all-filters-modal-filters-list-margin);padding-right:var(--b-filter-bar-all-filters-modal-filters-list-margin)}.b-all-filters-modal[data-v-dfa0bb7c] .b-modal-page__grid>:nth-child(1) ::-webkit-scrollbar{display:none}.b-all-filters-modal[data-v-dfa0bb7c] .b-modal-page__grid>:nth-child(2){max-height:100%}.b-all-filters-modal[data-v-dfa0bb7c] .b-grid-layout{gap:0;height:100%}.b-all-filters-modal__filters[data-v-dfa0bb7c]{display:flex;flex-direction:column;gap:var(--b-filter-bar-all-filters-modal-filters-gap)}.b-all-filters-modal__search-bar[data-v-dfa0bb7c]{padding:var(--b-filter-bar-all-filters-modal-search-bar-padding)}.b-all-filters-modal__empty-search-message[data-v-dfa0bb7c]{color:var(--b-filter-bar-all-filters-modal-filters-list-empty-search-message-color);padding:var(--b-filter-bar-all-filters-modal-filters-list-empty-search-message-padding);text-align:center}.b-all-filters-modal__filters-list[data-v-dfa0bb7c]{list-style:none;margin:var(--b-filter-bar-all-filters-modal-filters-list-margin);padding:var(--b-filter-bar-all-filters-modal-filters-list-padding)}.b-all-filters-modal__filters-section[data-v-dfa0bb7c]{display:flex;flex-direction:column;gap:var(--b-filter-bar-all-filters-modal-filters-list-gap)}.b-all-filters-modal__filters-section-title[data-v-dfa0bb7c]{color:var(--b-filter-bar-all-filters-modal-filters-list-title-color);padding:var(--b-filter-bar-all-filters-modal-filters-list-title-padding)}.b-all-filters-modal__selected-filter-content[data-v-dfa0bb7c]{display:flex;flex-direction:column;height:100%;padding:var(--b-filter-bar-all-filters-modal-selected-filter-content-padding)}.b-all-filters-modal__selected-filter-component[data-v-dfa0bb7c]{flex:1}.b-all-filters-modal__clear-button[data-v-dfa0bb7c]{display:flex;justify-content:flex-end}.b-all-filters-modal__selected-filter-text[data-v-dfa0bb7c]{display:flex;flex-direction:column;gap:var(--b-filter-bar-all-filters-modal-content-text-gap);margin-bottom:var(--b-filter-bar-all-filters-modal-content-text-margin-bottom)}.b-filter-bar[data-v-7ae4cbf4]{scrollbar-color:var(--b-color-background-quaternary) transparent;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;container-type:inline-size;width:100%}.b-filter-bar[data-v-7ae4cbf4],.b-filter-bar[data-v-7ae4cbf4]:before,.b-filter-bar[data-v-7ae4cbf4]:after{box-sizing:border-box}.b-filter-bar *[data-v-7ae4cbf4],.b-filter-bar *[data-v-7ae4cbf4]:before,.b-filter-bar *[data-v-7ae4cbf4]:after{box-sizing:border-box}.b-filter-bar[data-v-7ae4cbf4] ::-webkit-scrollbar{height:14px;width:14px}.b-filter-bar[data-v-7ae4cbf4] ::-webkit-scrollbar-thumb{background-clip:padding-box;background-color:var(--b-color-background-quaternary);border:3px solid transparent;border-radius:var(--b-border-radius-l)}.b-filter-bar__actions[data-v-7ae4cbf4]{display:flex;gap:var(--b-filter-bar-actions-gap)}.b-filter-bar__before-filters[data-v-7ae4cbf4]{gap:var(--b-filter-bar-before-filters-gap)}.b-filter-bar__before-filters[data-v-7ae4cbf4]:not(:has(.b-filter-bar__search-bar)){display:none}.b-filter-bar__before-filters .b-filter-bar__all-filters-modal[data-v-7ae4cbf4],.b-filter-bar__before-filters .b-filter-bar__reset-all[data-v-7ae4cbf4],.b-filter-bar__before-filters .b-filter-bar__clear-all[data-v-7ae4cbf4]{display:none}.b-filter-bar__before-filters .b-filter-bar__search-bar[data-v-7ae4cbf4]{flex:1;width:unset}.b-filter-bar__container[data-v-7ae4cbf4]{display:flex;flex-direction:column;gap:var(--b-filter-bar-container-gap)}.b-filter-bar__filters-container[data-v-7ae4cbf4]{display:flex;flex-direction:column;gap:var(--b-filter-bar-filters-container-gap)}.b-filter-bar__fixed-scroller[data-v-7ae4cbf4] .b-fixed-scroller__right .b-button--condensed,.b-filter-bar__fixed-scroller[data-v-7ae4cbf4] .b-fixed-scroller__left .b-button--condensed{height:var(--b-filter-bar-fixed-scroller-button-condensed-height);max-height:var(--b-filter-bar-fixed-scroller-button-condensed-max-height)}.b-filter-bar__scroller-content[data-v-7ae4cbf4]{display:flex;gap:var(--b-filter-bar-scroller-content-gap)}.b-filter-bar__scroller-content .b-filter-bar__search-bar[data-v-7ae4cbf4]{display:none}@container (min-width: 375px) and (max-width: 499px){.b-filter-bar__actions[data-v-7ae4cbf4]{display:none}.b-filter-bar__before-filters[data-v-7ae4cbf4]{display:flex}.b-filter-bar__before-filters .b-filter-bar__all-filters-modal[data-v-7ae4cbf4],.b-filter-bar__before-filters .b-filter-bar__reset-all[data-v-7ae4cbf4],.b-filter-bar__before-filters .b-filter-bar__clear-all[data-v-7ae4cbf4]{display:inherit}}@container (min-width: 500px) and (max-width: 767px){.b-filter-bar__actions[data-v-7ae4cbf4]{display:none}.b-filter-bar__before-filters[data-v-7ae4cbf4]{display:flex}.b-filter-bar__before-filters .b-filter-bar__all-filters-modal[data-v-7ae4cbf4],.b-filter-bar__before-filters .b-filter-bar__reset-all[data-v-7ae4cbf4],.b-filter-bar__before-filters .b-filter-bar__clear-all[data-v-7ae4cbf4]{display:inherit}.b-filter-bar__before-filters .b-filter-bar__search-bar[data-v-7ae4cbf4]{flex:0;min-width:200px}}@container (min-width: 768px){.b-filter-bar__actions[data-v-7ae4cbf4]{flex-shrink:0}.b-filter-bar__before-filters[data-v-7ae4cbf4]{display:none}.b-filter-bar__filters-container[data-v-7ae4cbf4]{display:flex;flex-direction:row}.b-filter-bar__scroller-content .b-filter-bar__search-bar[data-v-7ae4cbf4]{display:inherit;max-width:200px;min-width:200px;width:200px}}
@@ -1 +1 @@
1
- .b-avatar-image[data-v-e27fd02b]{scrollbar-color:var(--b-color-background-quaternary) transparent;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;border-radius:50%;height:var(--b-avatar-image-height);line-height:100%;overflow:hidden;width:var(--b-avatar-image-width)}.b-avatar-image[data-v-e27fd02b],.b-avatar-image[data-v-e27fd02b]:before,.b-avatar-image[data-v-e27fd02b]:after{box-sizing:border-box}.b-avatar-image *[data-v-e27fd02b],.b-avatar-image *[data-v-e27fd02b]:before,.b-avatar-image *[data-v-e27fd02b]:after{box-sizing:border-box}.b-avatar-image[data-v-e27fd02b] ::-webkit-scrollbar{height:14px;width:14px}.b-avatar-image[data-v-e27fd02b] ::-webkit-scrollbar-thumb{background-clip:padding-box;background-color:var(--b-color-background-quaternary);border:3px solid transparent;border-radius:var(--b-border-radius-l)}.b-avatar-image--small[data-v-e27fd02b]{height:var(--b-avatar-image-small-height);width:var(--b-avatar-image-small-width)}.b-avatar-image--yellow[data-v-e27fd02b]{background-color:var(--b-avatar-image-yellow-background-color);color:var(--b-avatar-image-yellow-color)}.b-avatar-image--blue[data-v-e27fd02b]{background-color:var(--b-avatar-image-blue-background-color);color:var(--b-avatar-image-blue-color)}.b-avatar-image--green[data-v-e27fd02b]{background-color:var(--b-avatar-image-green-background-color);color:var(--b-avatar-image-green-color)}.b-avatar-image--red[data-v-e27fd02b]{background-color:var(--b-avatar-image-red-background-color);color:var(--b-avatar-image-red-color)}.b-avatar-image__image[data-v-e27fd02b]{height:100%;object-fit:cover;width:100%}.b-avatar-image__default[data-v-e27fd02b]{align-items:center;display:flex;height:100%;justify-content:center;width:100%}
1
+ .b-focus-trap[data-v-946df4dc]{outline:none}
@@ -1 +1 @@
1
- .b-card[data-v-2cdd9489]{scrollbar-color:var(--b-color-background-quaternary) transparent;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background-color:var(--b-card-background-color);border:var(--b-card-border-width) solid var(--b-card-border-color);border-radius:var(--b-card-border-radius);display:flex;flex-direction:column}.b-card[data-v-2cdd9489],.b-card[data-v-2cdd9489]:before,.b-card[data-v-2cdd9489]:after{box-sizing:border-box}.b-card *[data-v-2cdd9489],.b-card *[data-v-2cdd9489]:before,.b-card *[data-v-2cdd9489]:after{box-sizing:border-box}.b-card[data-v-2cdd9489] ::-webkit-scrollbar{height:14px;width:14px}.b-card[data-v-2cdd9489] ::-webkit-scrollbar-thumb{background-clip:padding-box;background-color:var(--b-color-background-quaternary);border:3px solid transparent;border-radius:var(--b-border-radius-l)}.b-card--secondary[data-v-2cdd9489]{background-color:var(--b-card-secondary-background-color)}.b-legacy-theme .b-card--secondary[data-v-2cdd9489]{border-color:var(--b-card-secondary-border-color)}@media (hover: hover){.b-card--secondary.b-card--expandable:not(.b-card--disabled) .b-card__header[data-v-2cdd9489]:hover{background-color:var(--b-card-secondary-header-hover-background-color)}}.b-card--secondary.b-card--expandable:not(.b-card--disabled) .b-card__header[data-v-2cdd9489]:focus-visible{background-color:var(--b-card-secondary-header-focus-background-color)}.b-card--secondary.b-card--expandable:not(.b-card--disabled) .b-card__header[data-v-2cdd9489]:active{background-color:var(--b-card-secondary-header-active-background-color)}@media (hover: hover){.b-card--expandable:not(.b-card--disabled) .b-card__header[data-v-2cdd9489]:hover{background-color:var(--b-card-header-hover-background-color)}}.b-card--expandable:not(.b-card--disabled) .b-card__header[data-v-2cdd9489]:focus-visible{animation:outer-ring-default-2cdd9489 var(--b-animation-duration-fast) var(--b-animation-easing-standard);box-shadow:0 0 0 var(--b-focus-ring-spacer) var(--b-color-background-primary),0 0 0 var(--b-focus-ring-outline) var(--b-focus-ring-color);background-color:var(--b-card-header-focus-background-color);outline:none}@keyframes outer-ring-default-2cdd9489{0%{box-shadow:0 0 0 var(--b-border-width-s) var(--b-color-background-primary),0 0 0 0 var(--b-focus-ring-color)}to{box-shadow:0 0 0 var(--b-border-width-s) var(--b-color-background-primary),0 0 0 var(--b-border-width-l) var(--b-focus-ring-color)}}.b-card--expandable:not(.b-card--disabled) .b-card__header[data-v-2cdd9489]:active{background-color:var(--b-card-header-active-background-color)}.b-card--expandable .b-card__header[data-v-2cdd9489]{cursor:pointer}.b-card--expandable .b-card__header[data-v-2cdd9489]:focus-visible{outline:none}.b-card--expandable .b-card__description[data-v-2cdd9489]{margin-left:var(--b-card-description-margin-left)}.b-card--expandable .b-card__body[data-v-2cdd9489]{background-color:var(--b-card-header-margin-top)}.b-card--disabled .b-card__header[data-v-2cdd9489]{color:var(--b-card-disabled-color);cursor:not-allowed}.b-card__wrapper[data-v-2cdd9489]{display:flex;flex:1;flex-direction:column}.b-card__image[data-v-2cdd9489]{border-top-left-radius:var(--b-card-border-radius);border-top-right-radius:var(--b-card-border-radius);overflow:hidden}.b-card__image[data-v-2cdd9489] img{width:100%}.b-card__header[data-v-2cdd9489]{border-radius:var(--b-card-header-border-radius);color:var(--b-card-header-color);display:flex;gap:18px;padding:var(--b-card-header-padding)}.b-card__header--expandable[data-v-2cdd9489]{padding-bottom:var(--b-card-expandable-header-padding-bottom)}.b-card__header--without-body[data-v-2cdd9489]{padding-bottom:var(--b-card-header-padding-bottom)}.b-card__header-wrapper[data-v-2cdd9489]{display:flex;flex:1;flex-direction:column;gap:var(--b-spacer-020);overflow:hidden}.b-card__header-slot-wrapper[data-v-2cdd9489]{align-items:center;display:flex;gap:var(--b-spacer-070);justify-content:space-between;min-height:36px}.b-card__title-wrapper[data-v-2cdd9489]{display:flex;gap:var(--b-card-title-wrapper-gap)}.b-card__title-wrapper--truncated[data-v-2cdd9489]{overflow:hidden;white-space:nowrap}.b-card__title-wrapper--truncated .b-card__title[data-v-2cdd9489]{overflow:hidden;text-overflow:ellipsis}.b-card__toggle[data-v-2cdd9489]{align-items:center;display:flex;height:var(--b-card-toggle-height)}.b-card__toggle--small-text[data-v-2cdd9489]{height:var(--b-card-toggle-small-text-height)}.b-card__content[data-v-2cdd9489]{flex:1;padding:var(--b-card-content-padding)}.b-card__content--without-header[data-v-2cdd9489]{padding-top:var(--b-card-content-padding-top)}.b-card__content--expandable[data-v-2cdd9489]{padding-top:0}.b-card__description[data-v-2cdd9489]{color:var(--b-card-description-color)}.b-card__body[data-v-2cdd9489]{display:flex;flex:1;flex-direction:column;gap:16px;margin-top:-4px;padding:var(--b-card-body-padding)}.b-card__body--without-header[data-v-2cdd9489]{margin-top:0}.b-card__body--expandable[data-v-2cdd9489]{padding-top:var(--b-card-body-expandable-padding-top)}.b-card__actions[data-v-2cdd9489]{margin-top:auto}.b-card__actions--without-content[data-v-2cdd9489]{padding-top:var(--b-card-actions-padding-top)}.b-card__actions--without-content .b-card__header[data-v-2cdd9489]{padding-bottom:var(--b-card-header-padding-bottom)}.b-card__actions--without-content-and-with-header[data-v-2cdd9489]{padding-top:var(--b-card-actions-without-content-padding-top)}.b-card__animation-enter-active[data-v-2cdd9489]{animation:fade-in-ufwe404-2cdd9489 var(--b-card-animation-duration) var(--b-animation-easing-linear),enter-ufwe404-2cdd9489 var(--b-card-animation-duration) var(--b-animation-easing-enter),scale-up-ufwe404-2cdd9489 var(--b-card-animation-duration) var(--b-animation-easing-linear);overflow:hidden;transition:max-height var(--b-card-animation-duration) var(--b-card-animation-easing)}@keyframes fade-in-ufwe404-2cdd9489{0%{opacity:0}to{opacity:1}}@keyframes scale-up-ufwe404-2cdd9489{0%{scale:1}to{scale:1}}@keyframes enter-ufwe404-2cdd9489{0%{translate:0 -8px}to{translate:0 0}}.b-card__animation-leave-active[data-v-2cdd9489]{animation:fade-out-ufwe40m-2cdd9489 var(--b-card-animation-duration) var(--b-animation-easing-linear),exit-ufwe40m-2cdd9489 var(--b-card-animation-duration) var(--b-animation-easing-exit),scale-down-ufwe40m-2cdd9489 var(--b-card-animation-duration) var(--b-animation-easing-linear);max-height:0!important;overflow:hidden;transition:max-height var(--b-card-animation-duration) var(--b-card-animation-easing)}@keyframes fade-out-ufwe40m-2cdd9489{0%{opacity:1}to{opacity:0}}@keyframes scale-down-ufwe40m-2cdd9489{0%{scale:1}to{scale:1}}@keyframes exit-ufwe40m-2cdd9489{0%{translate:0 0}to{translate:0 -8px}}
1
+ .b-info-icon[data-v-ded345b1]{scrollbar-color:var(--b-color-background-quaternary) transparent;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;display:inline-block;height:16px;outline:none;width:16px}.b-info-icon[data-v-ded345b1],.b-info-icon[data-v-ded345b1]:before,.b-info-icon[data-v-ded345b1]:after{box-sizing:border-box}.b-info-icon *[data-v-ded345b1],.b-info-icon *[data-v-ded345b1]:before,.b-info-icon *[data-v-ded345b1]:after{box-sizing:border-box}.b-info-icon[data-v-ded345b1] ::-webkit-scrollbar{height:14px;width:14px}.b-info-icon[data-v-ded345b1] ::-webkit-scrollbar-thumb{background-clip:padding-box;background-color:var(--b-color-background-quaternary);border:3px solid transparent;border-radius:var(--b-border-radius-l)}.b-info-icon[data-v-ded345b1]:focus-visible{box-shadow:0 0 0 1px var(--adl-color-neutral-0),0 0 0 3px var(--adl-focus-ring-color);transition:.1s cubic-bezier(.785,.135,.15,.86);border-radius:50%}.b-info-icon__svg[data-v-ded345b1]{pointer-events:none}
@@ -1 +1 @@
1
- svg.ui-assets-icons-16{display:inline-flex;flex-shrink:0}svg.ui-assets-icons-16,svg.ui-assets-icons-16 *{fill:currentcolor}.b-code-snippet[data-v-5eb6a936]{scrollbar-color:var(--b-color-background-quaternary) transparent;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;display:flex;flex-direction:column;height:100%;overflow:auto}.b-code-snippet[data-v-5eb6a936],.b-code-snippet[data-v-5eb6a936]:before,.b-code-snippet[data-v-5eb6a936]:after{box-sizing:border-box}.b-code-snippet *[data-v-5eb6a936],.b-code-snippet *[data-v-5eb6a936]:before,.b-code-snippet *[data-v-5eb6a936]:after{box-sizing:border-box}.b-code-snippet[data-v-5eb6a936] ::-webkit-scrollbar{height:14px;width:14px}.b-code-snippet[data-v-5eb6a936] ::-webkit-scrollbar-thumb{background-clip:padding-box;background-color:var(--b-color-background-quaternary);border:3px solid transparent;border-radius:var(--b-border-radius-l)}.b-code-snippet__action-bar[data-v-5eb6a936]{background-color:var(--b-code-snippet-action-bar-background-color);border:var(--b-code-snippet-action-bar-border);border-radius:var(--b-code-snippet-action-bar-border-radius);display:flex;justify-content:space-between;padding:var(--b-code-snippet-action-bar-padding)}.b-code-snippet__action-bar--start[data-v-5eb6a936],.b-code-snippet__action-bar--end[data-v-5eb6a936]{align-items:center;display:flex;gap:var(--b-code-snippet-action-bar-gap)}.b-code-snippet__language-picker[data-v-5eb6a936]{background-color:var(--b-code-snippet-language-picker-background-color)}.b-code-snippet__run-button[data-v-5eb6a936]{padding:var(--b-code-snippet-run-button-padding)}.b-code-snippet__code-area[data-v-5eb6a936]{background-color:var(--b-code-snippet-code-area-background-color);border-radius:var(--b-code-snippet-code-area-border-radius);margin:var(--b-code-snippet-code-area-margin);overflow:auto}.b-code-snippet__modal[data-v-5eb6a936] .b-modal-base__container--large{width:80%}.b-code-snippet__code-area-content[data-v-5eb6a936]{background-color:inherit;display:flex;flex-direction:row}.b-code-snippet__code-area-content[data-v-5eb6a936] .cm-scroller{font-family:var(--b-code-snippet-code-area-content-font-family)}.b-code-snippet__code-area-content[data-v-5eb6a936] .cm-editor{flex-grow:1;width:0}.b-code-snippet__code-area-content[data-v-5eb6a936] .cm-scroller,.b-code-snippet__code-area-content[data-v-5eb6a936] .cm-content{caret-color:transparent;cursor:default}.b-code-snippet__code-area-content[data-v-5eb6a936] .cm-editor,.b-code-snippet__code-area-content[data-v-5eb6a936] .cm-gutters{background-color:var(--b-code-snippet-code-area-background-color)}.b-legacy-theme .b-code-snippet__code-area-content[data-v-5eb6a936] .cm-editor,.b-legacy-theme .b-code-snippet__code-area-content[data-v-5eb6a936] .cm-gutters{background-color:#f3f6f9}.b-code-snippet__code-area-content--editable[data-v-5eb6a936] .cm-content{caret-color:auto;cursor:text}.b-code-snippet__code-area-content[data-v-5eb6a936] .cm-editor .cm-gutters{border:unset}.b-code-snippet__code-area-content[data-v-5eb6a936] .cm-content{padding:var(--b-code-snippet-code-area-content-padding);padding-left:var(--b-code-snippet-code-area-content-padding-left)}.b-code-snippet__code-area-content[data-v-5eb6a936] .cm-gutters{padding-left:var(--b-code-snippet-code-area-gutters-padding-left)}.b-code-snippet__code-area-content[data-v-5eb6a936] .cm-gutterElement{background-color:var(--b-code-snippet-code-area-background-color)}.b-code-snippet__code-area-content[data-v-5eb6a936] .cm-editor.cm-focused{outline:none}.b-code-snippet__code-area-content[data-v-5eb6a936] .cm-activeLine{background-color:transparent}.b-code-snippet--inline .b-code-snippet__code-area-content[data-v-5eb6a936] .cm-content{padding:var(--b-code-snippet-inline-code-area-content-padding)}
1
+ .b-loading-indicator[data-v-b3018ba0]{scrollbar-color:var(--b-color-background-quaternary) transparent;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;box-sizing:border-box;display:inline-block;height:var(--b-loading-indicator-height);position:relative;width:var(--b-loading-indicator-width)}.b-loading-indicator[data-v-b3018ba0],.b-loading-indicator[data-v-b3018ba0]:before,.b-loading-indicator[data-v-b3018ba0]:after{box-sizing:border-box}.b-loading-indicator *[data-v-b3018ba0],.b-loading-indicator *[data-v-b3018ba0]:before,.b-loading-indicator *[data-v-b3018ba0]:after{box-sizing:border-box}.b-loading-indicator[data-v-b3018ba0] ::-webkit-scrollbar{height:14px;width:14px}.b-loading-indicator[data-v-b3018ba0] ::-webkit-scrollbar-thumb{background-clip:padding-box;background-color:var(--b-color-background-quaternary);border:3px solid transparent;border-radius:var(--b-border-radius-l)}@keyframes spin-b3018ba0{to{-webkit-transform:rotate(360deg);transform:rotate(360deg)}}.b-loading-indicator[data-v-b3018ba0]:before,.b-loading-indicator[data-v-b3018ba0]:after{animation:spin-b3018ba0 1s cubic-bezier(.785,.135,.15,.86) infinite;border:3px solid transparent;border-radius:50%;box-sizing:border-box;content:"";display:block;height:100%;left:0;position:absolute;top:0;width:100%}.b-loading-indicator[data-v-b3018ba0]:before{border-color:var(--b-loading-indicator-background-color);border-top-color:transparent;opacity:.1}.b-loading-indicator[data-v-b3018ba0]:after{border-color:transparent;border-top-color:var(--b-loading-indicator-color)}.b-loading-indicator--inverse[data-v-b3018ba0]:before{border-color:var(--b-loading-indicator-inverse-background-color);border-top-color:transparent;opacity:.2}.b-loading-indicator--inverse[data-v-b3018ba0]:after{border-color:transparent;border-top-color:var(--b-loading-indicator-inverse-color)}.b-loading-indicator--small[data-v-b3018ba0]{height:var(--b-loading-indicator-small-height);width:var(--b-loading-indicator-small-width)}.b-loading-indicator--small[data-v-b3018ba0]:before,.b-loading-indicator--small[data-v-b3018ba0]:after{border-width:var(--b-loading-indicator-small-border-width)}.b-loading-indicator--large[data-v-b3018ba0]{height:var(--b-loading-indicator-large-height);width:var(--b-loading-indicator-large-width)}.b-loading-indicator--large[data-v-b3018ba0]:before,.b-loading-indicator--large[data-v-b3018ba0]:after{border-width:var(--b-loading-indicator-large-border-width)}
@@ -1 +1 @@
1
- .b-listbox-single-select-category[data-v-a90eff17]{scrollbar-color:var(--b-color-background-quaternary) transparent;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;margin-bottom:var(--b-listbox-single-select-category-margin-bottom)}.b-listbox-single-select-category[data-v-a90eff17],.b-listbox-single-select-category[data-v-a90eff17]:before,.b-listbox-single-select-category[data-v-a90eff17]:after{box-sizing:border-box}.b-listbox-single-select-category *[data-v-a90eff17],.b-listbox-single-select-category *[data-v-a90eff17]:before,.b-listbox-single-select-category *[data-v-a90eff17]:after{box-sizing:border-box}.b-listbox-single-select-category[data-v-a90eff17] ::-webkit-scrollbar{height:14px;width:14px}.b-listbox-single-select-category[data-v-a90eff17] ::-webkit-scrollbar-thumb{background-clip:padding-box;background-color:var(--b-color-background-quaternary);border:3px solid transparent;border-radius:var(--b-border-radius-l)}.b-listbox-single-select-category[data-v-a90eff17]:last-child{margin-bottom:0}.b-listbox-single-select-category__label-text[data-v-a90eff17]{color:var(--b-listbox-single-select-category-label-text-color);padding:var(--b-listbox-single-select-category-label-text-padding)}.b-listbox-option[data-v-18a61f5d]{scrollbar-color:var(--b-color-background-quaternary) transparent;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;cursor:pointer;overflow-wrap:anywhere;padding:var(--b-listbox-option-padding)}.b-listbox-option[data-v-18a61f5d],.b-listbox-option[data-v-18a61f5d]:before,.b-listbox-option[data-v-18a61f5d]:after{box-sizing:border-box}.b-listbox-option[data-v-18a61f5d] ::-webkit-scrollbar{height:14px;width:14px}.b-listbox-option[data-v-18a61f5d] ::-webkit-scrollbar-thumb{background-clip:padding-box;background-color:var(--b-color-background-quaternary);border:3px solid transparent;border-radius:var(--b-border-radius-l)}@media (hover: hover){.b-listbox-option[data-v-18a61f5d]:hover:not(.b-listbox-option--disabled){background-color:var(--b-listbox-option-hover-background-color)}.b-listbox-option[data-v-18a61f5d]:hover:not(.b-listbox-option--disabled),.b-listbox-option[data-v-18a61f5d]:hover:not(.b-listbox-option--disabled) .b-avatar__label,.b-listbox-option[data-v-18a61f5d]:hover:not(.b-listbox-option--disabled) .b-country__label,.b-listbox-option[data-v-18a61f5d]:hover:not(.b-listbox-option--disabled) .b-payment-method__label{color:var(--b-listbox-option-hover-font-color)}.b-legacy-theme .b-listbox-option[data-v-18a61f5d]:hover:not(.b-listbox-option--disabled) .b-listbox-single-select-option__description:not(.b-listbox-option--disabled),.b-legacy-theme .b-listbox-option[data-v-18a61f5d]:hover:not(.b-listbox-option--disabled) .b-listbox-multi-select__option-description:not(.b-listbox-option--disabled){color:var(--b-listbox-option-hover-font-color)}}.b-listbox-option[data-v-18a61f5d]:focus-visible{outline:none}.b-listbox-option[data-v-18a61f5d]:focus-visible:not(.b-listbox-option--disabled){background-color:var(--b-listbox-option-focus-background-color);color:var(--b-listbox-option-focus-font-color)}.b-listbox-option[data-v-18a61f5d]:active:not(.b-listbox-option--disabled){background-color:var(--b-listbox-option-active-background-color)}.b-listbox-option[data-v-18a61f5d]:active:not(.b-listbox-option--disabled),.b-listbox-option[data-v-18a61f5d]:active:not(.b-listbox-option--disabled) .b-avatar__label,.b-listbox-option[data-v-18a61f5d]:active:not(.b-listbox-option--disabled) .b-country__label,.b-listbox-option[data-v-18a61f5d]:active:not(.b-listbox-option--disabled) .b-payment-method__label{color:var(--b-listbox-option-active-font-color)}.b-legacy-theme .b-listbox-option[data-v-18a61f5d]:active:not(.b-listbox-option--disabled) .b-listbox-single-select-option__description:not(.b-listbox-option--disabled),.b-legacy-theme .b-listbox-option[data-v-18a61f5d]:active:not(.b-listbox-option--disabled) .b-listbox-multi-select__option-description:not(.b-listbox-option--disabled){color:var(--b-listbox-option-active-description-color)}.b-listbox-option[data-v-18a61f5d] .b-listbox-single-select-option__text,.b-listbox-option[data-v-18a61f5d] .b-listbox-multi-select__option-text{display:flex;flex-direction:column}.b-listbox-option[data-v-18a61f5d] .b-listbox-single-select-option__description,.b-listbox-option[data-v-18a61f5d] .b-listbox-multi-select__option-description{margin-top:var(--b-listbox-option-description-margin-top)}.b-listbox-option[data-v-18a61f5d]:not(.b-listbox-option--disabled) .b-listbox-single-select-option__description,.b-listbox-option[data-v-18a61f5d]:not(.b-listbox-option--disabled) .b-listbox-multi-select__option-description{color:var(--b-listbox-option-description-color)}.b-listbox-option--disabled[data-v-18a61f5d]{cursor:not-allowed}.b-listbox-option--disabled[data-v-18a61f5d],.b-listbox-option--disabled[data-v-18a61f5d] .b-avatar__label,.b-listbox-option--disabled[data-v-18a61f5d] .b-country__label,.b-listbox-option--disabled[data-v-18a61f5d] .b-payment-method__label{color:var(--b-listbox-option-disabled-font-color)}.b-listbox-option--selected[data-v-18a61f5d]:not(.b-listbox-option--disabled){background-color:var(--b-listbox-option-selected-background-color)}.b-listbox-option--selected[data-v-18a61f5d]:not(.b-listbox-option--disabled),.b-listbox-option--selected[data-v-18a61f5d]:not(.b-listbox-option--disabled) .b-avatar__label,.b-listbox-option--selected[data-v-18a61f5d]:not(.b-listbox-option--disabled) .b-country__label,.b-listbox-option--selected[data-v-18a61f5d]:not(.b-listbox-option--disabled) .b-payment-method__label{color:var(--b-listbox-option-selected-font-color)}.b-listbox-option--selected[data-v-18a61f5d]:not(.b-listbox-option--disabled) .b-listbox-single-select-option__description:not(.b-listbox-option--disabled),.b-listbox-option--selected[data-v-18a61f5d]:not(.b-listbox-option--disabled) .b-listbox-multi-select__option-description:not(.b-listbox-option--disabled){color:var(--b-listbox-option-selected-description-color)}.b-listbox-single-select-option[data-v-e8cc847b]{display:flex;justify-content:space-between}.b-listbox-single-select-option__check-icon[data-v-e8cc847b]{align-items:center;display:flex;margin-left:var(--b-listbox-single-select-check-icon-margin)}.b-listbox-multi-select-category[data-v-9a00de22]{scrollbar-color:var(--b-color-background-quaternary) transparent;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.b-listbox-multi-select-category[data-v-9a00de22],.b-listbox-multi-select-category[data-v-9a00de22]:before,.b-listbox-multi-select-category[data-v-9a00de22]:after{box-sizing:border-box}.b-listbox-multi-select-category *[data-v-9a00de22],.b-listbox-multi-select-category *[data-v-9a00de22]:before,.b-listbox-multi-select-category *[data-v-9a00de22]:after{box-sizing:border-box}.b-listbox-multi-select-category[data-v-9a00de22] ::-webkit-scrollbar{height:14px;width:14px}.b-listbox-multi-select-category[data-v-9a00de22] ::-webkit-scrollbar-thumb{background-clip:padding-box;background-color:var(--b-color-background-quaternary);border:3px solid transparent;border-radius:var(--b-border-radius-l)}.b-listbox-multi-select-category--disabled[data-v-9a00de22]{cursor:not-allowed}.b-listbox-multi-select-category--disabled .b-listbox-multi-select-category__label-text[data-v-9a00de22]{color:var(--b-listbox-multi-select-category-disabled-label-text-color)}.b-listbox-multi-select-category--disabled .b-listbox-multi-select-category__label-chevron[data-v-9a00de22]{cursor:pointer}.b-listbox-multi-select-category--static-category[data-v-9a00de22]{gap:var(--b-listbox-multi-select-category-static-category-gap);pointer-events:none}.b-listbox-multi-select-category--static-category .b-listbox-multi-select-category__label-text[data-v-9a00de22]{color:var(--b-listbox-multi-select-category-static-category-label-text-color)}.b-listbox-multi-select-category__label[data-v-9a00de22]{align-items:center;display:flex;justify-content:space-between;width:100%}.b-listbox-multi-select-category__label-chevron[data-v-9a00de22]{display:flex;position:relative}.b-listbox-multi-select-category__label-chevron[data-v-9a00de22]:before{content:"";height:36px;left:-10px;position:absolute;top:-9px;width:36px}.b-listbox-multi-select-category__option[data-v-9a00de22]{display:flex;gap:var(--b-listbox-multi-select-category-option-gap)}.b-listbox-multi-select-options[data-v-25938a72]{scrollbar-color:var(--b-color-background-quaternary) transparent;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;display:flex;gap:var(--b-listbox-multi-select-options-gap)}.b-listbox-multi-select-options[data-v-25938a72],.b-listbox-multi-select-options[data-v-25938a72]:before,.b-listbox-multi-select-options[data-v-25938a72]:after{box-sizing:border-box}.b-listbox-multi-select-options[data-v-25938a72] ::-webkit-scrollbar{height:14px;width:14px}.b-listbox-multi-select-options[data-v-25938a72] ::-webkit-scrollbar-thumb{background-clip:padding-box;background-color:var(--b-color-background-quaternary);border:3px solid transparent;border-radius:var(--b-border-radius-l)}.b-listbox-multi-select-options__category-option[data-v-25938a72]{padding-left:var(--b-listbox-multi-select-options-category-option-padding-left)}.b-listbox-multi-select-options__static-category-option[data-v-25938a72]{padding-left:var(--b-listbox-multi-select-options-static-category-option-padding-left)}.b-listbox-multi-select-chips[data-v-7c5f8bdb]{scrollbar-color:var(--b-color-background-quaternary) transparent;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;container-type:inline-size;display:flex;flex-wrap:wrap;gap:var(--b-listbox-multi-select-chips-gap);padding:var(--b-listbox-multi-select-chips-padding)}.b-listbox-multi-select-chips[data-v-7c5f8bdb],.b-listbox-multi-select-chips[data-v-7c5f8bdb]:before,.b-listbox-multi-select-chips[data-v-7c5f8bdb]:after{box-sizing:border-box}.b-listbox-multi-select-chips[data-v-7c5f8bdb] ::-webkit-scrollbar{height:14px;width:14px}.b-listbox-multi-select-chips[data-v-7c5f8bdb] ::-webkit-scrollbar-thumb{background-clip:padding-box;background-color:var(--b-color-background-quaternary);border:3px solid transparent;border-radius:var(--b-border-radius-l)}.b-listbox-multi-select-chips__chip[data-v-7c5f8bdb]{background:var(--b-listbox-multi-select-chips-chip-background);border-radius:var(--b-listbox-multi-select-chips-chip-border-radius);display:flex;gap:var(--b-listbox-multi-select-chips-chip-gap);padding:var(--b-listbox-multi-select-chips-chip-padding)}.b-listbox-multi-select-chips__chip[data-v-7c5f8bdb]:focus-visible{animation:outer-ring-default-7c5f8bdb var(--b-animation-duration-fast) var(--b-animation-easing-standard);box-shadow:0 0 0 var(--b-focus-ring-spacer) var(--b-color-background-primary),0 0 0 var(--b-focus-ring-outline) var(--b-focus-ring-color)}@keyframes outer-ring-default-7c5f8bdb{0%{box-shadow:0 0 0 var(--b-border-width-s) var(--b-color-background-primary),0 0 0 0 var(--b-focus-ring-color)}to{box-shadow:0 0 0 var(--b-border-width-s) var(--b-color-background-primary),0 0 0 var(--b-border-width-l) var(--b-focus-ring-color)}}.b-listbox-multi-select-chips__chip[data-v-7c5f8bdb]:hover{background:var(--b-listbox-multi-select-chips-chip-hover-background)}.b-listbox-multi-select-chips__chip[data-v-7c5f8bdb]:active{background:var(--b-listbox-multi-select-chips-chip-active-background)}.b-listbox-multi-select-chips__chip[data-v-7c5f8bdb]:disabled{background:var(--b-listbox-multi-select-chips-chip-disabled-background);color:var(--b-listbox-multi-select-chips-chip-disabled-color)}.b-listbox-multi-select-chips__option-text[data-v-7c5f8bdb]{display:flex;overflow-wrap:anywhere}.b-listbox-multi-select[data-v-0ca61721]{scrollbar-color:var(--b-color-background-quaternary) transparent;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.b-listbox-multi-select[data-v-0ca61721],.b-listbox-multi-select[data-v-0ca61721]:before,.b-listbox-multi-select[data-v-0ca61721]:after{box-sizing:border-box}.b-listbox-multi-select[data-v-0ca61721] ::-webkit-scrollbar{height:14px;width:14px}.b-listbox-multi-select[data-v-0ca61721] ::-webkit-scrollbar-thumb{background-clip:padding-box;background-color:var(--b-color-background-quaternary);border:3px solid transparent;border-radius:var(--b-border-radius-l)}.b-listbox-multi-select__divider[data-v-0ca61721]{background-color:var(--b-listbox-multi-select-divider-background-color);border:0;height:1px;margin:var(--b-listbox-multi-select-divider-margin)}.b-listbox-multi-select__option[data-v-0ca61721]{display:flex;gap:var(--b-listbox-multi-select-options-gap)}.b-listbox[data-v-f5e00d2e]{scrollbar-color:var(--b-color-background-quaternary) transparent;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background-color:var(--b-listbox-background-color);overflow-y:auto;padding:var(--b-listbox-padding)}.b-listbox[data-v-f5e00d2e],.b-listbox[data-v-f5e00d2e]:before,.b-listbox[data-v-f5e00d2e]:after{box-sizing:border-box}.b-listbox *[data-v-f5e00d2e],.b-listbox *[data-v-f5e00d2e]:before,.b-listbox *[data-v-f5e00d2e]:after{box-sizing:border-box}.b-listbox[data-v-f5e00d2e] ::-webkit-scrollbar{height:14px;width:14px}.b-listbox[data-v-f5e00d2e] ::-webkit-scrollbar-thumb{background-clip:padding-box;background-color:var(--b-color-background-quaternary);border:3px solid transparent;border-radius:var(--b-border-radius-l)}.b-listbox__empty-search-message[data-v-f5e00d2e]{color:var(--b-listbox-empty-search-message-color);padding:var(--b-listbox-empty-search-message-padding);text-align:center}.b-listbox__lazy-load[data-v-f5e00d2e]{display:flex;justify-content:center;margin:var(--b-listbox-lazy-load-margin)}
1
+ .b-listbox-single-select-category[data-v-a90eff17]{scrollbar-color:var(--b-color-background-quaternary) transparent;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;margin-bottom:var(--b-listbox-single-select-category-margin-bottom)}.b-listbox-single-select-category[data-v-a90eff17],.b-listbox-single-select-category[data-v-a90eff17]:before,.b-listbox-single-select-category[data-v-a90eff17]:after{box-sizing:border-box}.b-listbox-single-select-category *[data-v-a90eff17],.b-listbox-single-select-category *[data-v-a90eff17]:before,.b-listbox-single-select-category *[data-v-a90eff17]:after{box-sizing:border-box}.b-listbox-single-select-category[data-v-a90eff17] ::-webkit-scrollbar{height:14px;width:14px}.b-listbox-single-select-category[data-v-a90eff17] ::-webkit-scrollbar-thumb{background-clip:padding-box;background-color:var(--b-color-background-quaternary);border:3px solid transparent;border-radius:var(--b-border-radius-l)}.b-listbox-single-select-category[data-v-a90eff17]:last-child{margin-bottom:0}.b-listbox-single-select-category__label-text[data-v-a90eff17]{color:var(--b-listbox-single-select-category-label-text-color);padding:var(--b-listbox-single-select-category-label-text-padding)}.b-listbox-option[data-v-18a61f5d]{scrollbar-color:var(--b-color-background-quaternary) transparent;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;cursor:pointer;overflow-wrap:anywhere;padding:var(--b-listbox-option-padding)}.b-listbox-option[data-v-18a61f5d],.b-listbox-option[data-v-18a61f5d]:before,.b-listbox-option[data-v-18a61f5d]:after{box-sizing:border-box}.b-listbox-option[data-v-18a61f5d] ::-webkit-scrollbar{height:14px;width:14px}.b-listbox-option[data-v-18a61f5d] ::-webkit-scrollbar-thumb{background-clip:padding-box;background-color:var(--b-color-background-quaternary);border:3px solid transparent;border-radius:var(--b-border-radius-l)}@media (hover: hover){.b-listbox-option[data-v-18a61f5d]:hover:not(.b-listbox-option--disabled){background-color:var(--b-listbox-option-hover-background-color)}.b-listbox-option[data-v-18a61f5d]:hover:not(.b-listbox-option--disabled),.b-listbox-option[data-v-18a61f5d]:hover:not(.b-listbox-option--disabled) .b-avatar__label,.b-listbox-option[data-v-18a61f5d]:hover:not(.b-listbox-option--disabled) .b-country__label,.b-listbox-option[data-v-18a61f5d]:hover:not(.b-listbox-option--disabled) .b-payment-method__label{color:var(--b-listbox-option-hover-font-color)}.b-legacy-theme .b-listbox-option[data-v-18a61f5d]:hover:not(.b-listbox-option--disabled) .b-listbox-single-select-option__description:not(.b-listbox-option--disabled),.b-legacy-theme .b-listbox-option[data-v-18a61f5d]:hover:not(.b-listbox-option--disabled) .b-listbox-multi-select__option-description:not(.b-listbox-option--disabled){color:var(--b-listbox-option-hover-font-color)}}.b-listbox-option[data-v-18a61f5d]:focus-visible{outline:none}.b-listbox-option[data-v-18a61f5d]:focus-visible:not(.b-listbox-option--disabled){background-color:var(--b-listbox-option-focus-background-color);color:var(--b-listbox-option-focus-font-color)}.b-listbox-option[data-v-18a61f5d]:active:not(.b-listbox-option--disabled){background-color:var(--b-listbox-option-active-background-color)}.b-listbox-option[data-v-18a61f5d]:active:not(.b-listbox-option--disabled),.b-listbox-option[data-v-18a61f5d]:active:not(.b-listbox-option--disabled) .b-avatar__label,.b-listbox-option[data-v-18a61f5d]:active:not(.b-listbox-option--disabled) .b-country__label,.b-listbox-option[data-v-18a61f5d]:active:not(.b-listbox-option--disabled) .b-payment-method__label{color:var(--b-listbox-option-active-font-color)}.b-legacy-theme .b-listbox-option[data-v-18a61f5d]:active:not(.b-listbox-option--disabled) .b-listbox-single-select-option__description:not(.b-listbox-option--disabled),.b-legacy-theme .b-listbox-option[data-v-18a61f5d]:active:not(.b-listbox-option--disabled) .b-listbox-multi-select__option-description:not(.b-listbox-option--disabled){color:var(--b-listbox-option-active-description-color)}.b-listbox-option[data-v-18a61f5d] .b-listbox-single-select-option__text,.b-listbox-option[data-v-18a61f5d] .b-listbox-multi-select__option-text{display:flex;flex-direction:column}.b-listbox-option[data-v-18a61f5d] .b-listbox-single-select-option__description,.b-listbox-option[data-v-18a61f5d] .b-listbox-multi-select__option-description{margin-top:var(--b-listbox-option-description-margin-top)}.b-listbox-option[data-v-18a61f5d]:not(.b-listbox-option--disabled) .b-listbox-single-select-option__description,.b-listbox-option[data-v-18a61f5d]:not(.b-listbox-option--disabled) .b-listbox-multi-select__option-description{color:var(--b-listbox-option-description-color)}.b-listbox-option--disabled[data-v-18a61f5d]{cursor:not-allowed}.b-listbox-option--disabled[data-v-18a61f5d],.b-listbox-option--disabled[data-v-18a61f5d] .b-avatar__label,.b-listbox-option--disabled[data-v-18a61f5d] .b-country__label,.b-listbox-option--disabled[data-v-18a61f5d] .b-payment-method__label{color:var(--b-listbox-option-disabled-font-color)}.b-listbox-option--selected[data-v-18a61f5d]:not(.b-listbox-option--disabled){background-color:var(--b-listbox-option-selected-background-color)}.b-listbox-option--selected[data-v-18a61f5d]:not(.b-listbox-option--disabled),.b-listbox-option--selected[data-v-18a61f5d]:not(.b-listbox-option--disabled) .b-avatar__label,.b-listbox-option--selected[data-v-18a61f5d]:not(.b-listbox-option--disabled) .b-country__label,.b-listbox-option--selected[data-v-18a61f5d]:not(.b-listbox-option--disabled) .b-payment-method__label{color:var(--b-listbox-option-selected-font-color)}.b-listbox-option--selected[data-v-18a61f5d]:not(.b-listbox-option--disabled) .b-listbox-single-select-option__description:not(.b-listbox-option--disabled),.b-listbox-option--selected[data-v-18a61f5d]:not(.b-listbox-option--disabled) .b-listbox-multi-select__option-description:not(.b-listbox-option--disabled){color:var(--b-listbox-option-selected-description-color)}svg.ui-assets-icons-16{display:inline-flex;flex-shrink:0}svg.ui-assets-icons-16,svg.ui-assets-icons-16 *{fill:currentcolor}.b-listbox-single-select-option[data-v-e8cc847b]{display:flex;justify-content:space-between}.b-listbox-single-select-option__check-icon[data-v-e8cc847b]{align-items:center;display:flex;margin-left:var(--b-listbox-single-select-check-icon-margin)}.b-listbox-multi-select-category[data-v-9a00de22]{scrollbar-color:var(--b-color-background-quaternary) transparent;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.b-listbox-multi-select-category[data-v-9a00de22],.b-listbox-multi-select-category[data-v-9a00de22]:before,.b-listbox-multi-select-category[data-v-9a00de22]:after{box-sizing:border-box}.b-listbox-multi-select-category *[data-v-9a00de22],.b-listbox-multi-select-category *[data-v-9a00de22]:before,.b-listbox-multi-select-category *[data-v-9a00de22]:after{box-sizing:border-box}.b-listbox-multi-select-category[data-v-9a00de22] ::-webkit-scrollbar{height:14px;width:14px}.b-listbox-multi-select-category[data-v-9a00de22] ::-webkit-scrollbar-thumb{background-clip:padding-box;background-color:var(--b-color-background-quaternary);border:3px solid transparent;border-radius:var(--b-border-radius-l)}.b-listbox-multi-select-category--disabled[data-v-9a00de22]{cursor:not-allowed}.b-listbox-multi-select-category--disabled .b-listbox-multi-select-category__label-text[data-v-9a00de22]{color:var(--b-listbox-multi-select-category-disabled-label-text-color)}.b-listbox-multi-select-category--disabled .b-listbox-multi-select-category__label-chevron[data-v-9a00de22]{cursor:pointer}.b-listbox-multi-select-category--static-category[data-v-9a00de22]{gap:var(--b-listbox-multi-select-category-static-category-gap);pointer-events:none}.b-listbox-multi-select-category--static-category .b-listbox-multi-select-category__label-text[data-v-9a00de22]{color:var(--b-listbox-multi-select-category-static-category-label-text-color)}.b-listbox-multi-select-category__label[data-v-9a00de22]{align-items:center;display:flex;justify-content:space-between;width:100%}.b-listbox-multi-select-category__label-chevron[data-v-9a00de22]{display:flex;position:relative}.b-listbox-multi-select-category__label-chevron[data-v-9a00de22]:before{content:"";height:36px;left:-10px;position:absolute;top:-9px;width:36px}.b-listbox-multi-select-category__option[data-v-9a00de22]{display:flex;gap:var(--b-listbox-multi-select-category-option-gap)}.b-listbox-multi-select-options[data-v-25938a72]{scrollbar-color:var(--b-color-background-quaternary) transparent;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;display:flex;gap:var(--b-listbox-multi-select-options-gap)}.b-listbox-multi-select-options[data-v-25938a72],.b-listbox-multi-select-options[data-v-25938a72]:before,.b-listbox-multi-select-options[data-v-25938a72]:after{box-sizing:border-box}.b-listbox-multi-select-options[data-v-25938a72] ::-webkit-scrollbar{height:14px;width:14px}.b-listbox-multi-select-options[data-v-25938a72] ::-webkit-scrollbar-thumb{background-clip:padding-box;background-color:var(--b-color-background-quaternary);border:3px solid transparent;border-radius:var(--b-border-radius-l)}.b-listbox-multi-select-options__category-option[data-v-25938a72]{padding-left:var(--b-listbox-multi-select-options-category-option-padding-left)}.b-listbox-multi-select-options__static-category-option[data-v-25938a72]{padding-left:var(--b-listbox-multi-select-options-static-category-option-padding-left)}.b-listbox-multi-select-chips[data-v-7c5f8bdb]{scrollbar-color:var(--b-color-background-quaternary) transparent;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;container-type:inline-size;display:flex;flex-wrap:wrap;gap:var(--b-listbox-multi-select-chips-gap);padding:var(--b-listbox-multi-select-chips-padding)}.b-listbox-multi-select-chips[data-v-7c5f8bdb],.b-listbox-multi-select-chips[data-v-7c5f8bdb]:before,.b-listbox-multi-select-chips[data-v-7c5f8bdb]:after{box-sizing:border-box}.b-listbox-multi-select-chips[data-v-7c5f8bdb] ::-webkit-scrollbar{height:14px;width:14px}.b-listbox-multi-select-chips[data-v-7c5f8bdb] ::-webkit-scrollbar-thumb{background-clip:padding-box;background-color:var(--b-color-background-quaternary);border:3px solid transparent;border-radius:var(--b-border-radius-l)}.b-listbox-multi-select-chips__chip[data-v-7c5f8bdb]{background:var(--b-listbox-multi-select-chips-chip-background);border-radius:var(--b-listbox-multi-select-chips-chip-border-radius);display:flex;gap:var(--b-listbox-multi-select-chips-chip-gap);padding:var(--b-listbox-multi-select-chips-chip-padding)}.b-listbox-multi-select-chips__chip[data-v-7c5f8bdb]:focus-visible{animation:outer-ring-default-7c5f8bdb var(--b-animation-duration-fast) var(--b-animation-easing-standard);box-shadow:0 0 0 var(--b-focus-ring-spacer) var(--b-color-background-primary),0 0 0 var(--b-focus-ring-outline) var(--b-focus-ring-color)}@keyframes outer-ring-default-7c5f8bdb{0%{box-shadow:0 0 0 var(--b-border-width-s) var(--b-color-background-primary),0 0 0 0 var(--b-focus-ring-color)}to{box-shadow:0 0 0 var(--b-border-width-s) var(--b-color-background-primary),0 0 0 var(--b-border-width-l) var(--b-focus-ring-color)}}.b-listbox-multi-select-chips__chip[data-v-7c5f8bdb]:hover{background:var(--b-listbox-multi-select-chips-chip-hover-background)}.b-listbox-multi-select-chips__chip[data-v-7c5f8bdb]:active{background:var(--b-listbox-multi-select-chips-chip-active-background)}.b-listbox-multi-select-chips__chip[data-v-7c5f8bdb]:disabled{background:var(--b-listbox-multi-select-chips-chip-disabled-background);color:var(--b-listbox-multi-select-chips-chip-disabled-color)}.b-listbox-multi-select-chips__option-text[data-v-7c5f8bdb]{display:flex;overflow-wrap:anywhere}.b-listbox-multi-select[data-v-0ca61721]{scrollbar-color:var(--b-color-background-quaternary) transparent;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.b-listbox-multi-select[data-v-0ca61721],.b-listbox-multi-select[data-v-0ca61721]:before,.b-listbox-multi-select[data-v-0ca61721]:after{box-sizing:border-box}.b-listbox-multi-select[data-v-0ca61721] ::-webkit-scrollbar{height:14px;width:14px}.b-listbox-multi-select[data-v-0ca61721] ::-webkit-scrollbar-thumb{background-clip:padding-box;background-color:var(--b-color-background-quaternary);border:3px solid transparent;border-radius:var(--b-border-radius-l)}.b-listbox-multi-select__divider[data-v-0ca61721]{background-color:var(--b-listbox-multi-select-divider-background-color);border:0;height:1px;margin:var(--b-listbox-multi-select-divider-margin)}.b-listbox-multi-select__option[data-v-0ca61721]{display:flex;gap:var(--b-listbox-multi-select-options-gap)}.b-listbox[data-v-f5e00d2e]{scrollbar-color:var(--b-color-background-quaternary) transparent;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background-color:var(--b-listbox-background-color);overflow-y:auto;padding:var(--b-listbox-padding)}.b-listbox[data-v-f5e00d2e],.b-listbox[data-v-f5e00d2e]:before,.b-listbox[data-v-f5e00d2e]:after{box-sizing:border-box}.b-listbox *[data-v-f5e00d2e],.b-listbox *[data-v-f5e00d2e]:before,.b-listbox *[data-v-f5e00d2e]:after{box-sizing:border-box}.b-listbox[data-v-f5e00d2e] ::-webkit-scrollbar{height:14px;width:14px}.b-listbox[data-v-f5e00d2e] ::-webkit-scrollbar-thumb{background-clip:padding-box;background-color:var(--b-color-background-quaternary);border:3px solid transparent;border-radius:var(--b-border-radius-l)}.b-listbox__empty-search-message[data-v-f5e00d2e]{color:var(--b-listbox-empty-search-message-color);padding:var(--b-listbox-empty-search-message-padding);text-align:center}.b-listbox__lazy-load[data-v-f5e00d2e]{display:flex;justify-content:center;margin:var(--b-listbox-lazy-load-margin)}
@@ -1,4 +1,4 @@
1
- import { A as t, B as e, a as o } from "./chunks/index.73ac0db6.js";
1
+ import { A as t, B as e, a as o } from "./chunks/index.8aa536a8.js";
2
2
  export {
3
3
  t as AvatarImage,
4
4
  e as BentoAvatarImageColor,
package/dist/badge.js CHANGED
@@ -2,7 +2,7 @@ import { defineComponent as l, computed as n, openBlock as d, createElementBlock
2
2
  import { u as p } from "./chunks/aria-label.ac9651a5.js";
3
3
  import { g as f } from "./chunks/get-slot-text.bead058f.js";
4
4
  import { _ } from "./chunks/_plugin-vue_export-helper.dad06003.js";
5
- import "./assets/index.css";
5
+ import "./assets/index3.css";
6
6
  var t = /* @__PURE__ */ ((e) => (e.DEFAULT = "default", e.ATTENTION = "attention", e.WARNING = "warning", e.CRITICAL = "critical", e.SUCCESS = "success", e))(t || {});
7
7
  const m = l({
8
8
  name: "adl-badge",
package/dist/button.js CHANGED
@@ -1,10 +1,10 @@
1
- import { a } from "./chunks/button.de5589fa.js";
2
- import { b as R, B as T } from "./chunks/button.de5589fa.js";
3
- import { B as q, c as D, a as F, b as G } from "./chunks/button-actions.adc0a2fe.js";
4
- import { B as J, a as N } from "./chunks/loading-button.2db95771.js";
1
+ import { a } from "./chunks/button.ae4760cd.js";
2
+ import { b as R, B as T } from "./chunks/button.ae4760cd.js";
3
+ import { B as q, c as D, a as F, b as G } from "./chunks/button-actions.82163994.js";
4
+ import { B as J, a as N } from "./chunks/loading-button.6b81b546.js";
5
5
  import { defineComponent as p, computed as i, useSlots as B, openBlock as f, createBlock as v, mergeProps as m, unref as s, withModifiers as b, createSlots as y, renderList as _, withCtx as k, renderSlot as x, normalizeProps as C, guardReactiveProps as L } from "vue";
6
6
  import { _ as P } from "./chunks/_plugin-vue_export-helper.dad06003.js";
7
- import "./assets/index4.css";
7
+ import "./assets/index12.css";
8
8
  const h = {}, A = /* @__PURE__ */ p({
9
9
  ...h,
10
10
  __name: "toggle-button",
package/dist/card.js CHANGED
@@ -1,14 +1,14 @@
1
1
  import { defineComponent as W, useSlots as Y, ref as S, watch as B, computed as d, openBlock as s, createElementBlock as c, normalizeClass as i, unref as a, renderSlot as p, createCommentVNode as l, withKeys as L, createElementVNode as m, createBlock as h, mergeProps as j, withCtx as y, createVNode as A, Transition as q, normalizeStyle as G } from "vue";
2
- import { B as E } from "./chunks/index.11b6dd35.js";
2
+ import { B as E } from "./chunks/index.ee15db35.js";
3
3
  import { C as J, a as Q } from "./chunks/chevron-up.638a9f34.js";
4
4
  import { u as X } from "./chunks/use-expandable-content-height.62fc84e5.js";
5
5
  import { u as Z } from "./chunks/use-has-slot.4d98bf29.js";
6
6
  import { g as ee } from "./chunks/unique-id.a2a2b458.js";
7
7
  import { u as ae } from "./chunks/i18n.f7e6533e.js";
8
8
  import { o as te } from "./chunks/resize.a041304d.js";
9
- import { c as ne, B as oe } from "./chunks/button-actions.adc0a2fe.js";
9
+ import { c as ne, B as oe } from "./chunks/button-actions.82163994.js";
10
10
  import { _ as de } from "./chunks/_plugin-vue_export-helper.dad06003.js";
11
- import "./assets/index8.css";
11
+ import "./assets/index18.css";
12
12
  var T = /* @__PURE__ */ ((t) => (t.PRIMARY = "primary", t.SECONDARY = "secondary", t))(T || {}), b = /* @__PURE__ */ ((t) => (t.DEFAULT = "default", t.SMALL = "small", t))(b || {});
13
13
  const D = {
14
14
  "en-US": {
package/dist/checkbox.js CHANGED
@@ -1,13 +1,13 @@
1
- import { B, a as l } from "./chunks/checkbox.4c96cc23.js";
1
+ import { B, a as l } from "./chunks/checkbox.9c30c07b.js";
2
2
  import { C as le } from "./chunks/checkbox-input.99336948.js";
3
3
  import { defineComponent as M, toRef as I, computed as s, watch as y, ref as T, resolveComponent as m, openBlock as n, createElementBlock as v, createVNode as N, normalizeClass as V, withCtx as d, Fragment as w, renderList as G, createBlock as E, createSlots as O, createTextVNode as k, toDisplayString as C, renderSlot as A, normalizeProps as L, guardReactiveProps as P, createCommentVNode as R } from "vue";
4
4
  import { g as U } from "./chunks/unique-id.a2a2b458.js";
5
- import { d as q } from "./chunks/index.11b6dd35.js";
5
+ import { d as q } from "./chunks/index.ee15db35.js";
6
6
  import { u as x } from "./chunks/use-form-layout-loading.d03e5d48.js";
7
- import { C as $ } from "./chunks/controls-group.37a67734.js";
8
- import { E as z } from "./chunks/error-message.4bd22112.js";
7
+ import { C as $ } from "./chunks/controls-group.8357e3fd.js";
8
+ import { E as z } from "./chunks/error-message.d2bdeb80.js";
9
9
  import { _ as D } from "./chunks/_plugin-vue_export-helper.dad06003.js";
10
- import "./assets/index10.css";
10
+ import "./assets/index16.css";
11
11
  var i = /* @__PURE__ */ ((e) => (e.HORIZONTAL = "horizontal", e.VERTICAL = "vertical", e))(i || {});
12
12
  const S = "bento-checkbox-group", F = M({
13
13
  name: S,
@@ -1,5 +1,5 @@
1
1
  import { defineComponent as B, computed as C, ref as y, resolveComponent as _, openBlock as r, createElementBlock as l, normalizeClass as m, renderSlot as u, createCommentVNode as d, createBlock as S, withCtx as k } from "vue";
2
- import { B as g } from "./index.11b6dd35.js";
2
+ import { B as g } from "./index.ee15db35.js";
3
3
  import { u as h } from "./use-has-slot.4d98bf29.js";
4
4
  import { _ as L } from "./_plugin-vue_export-helper.dad06003.js";
5
5
  import "../assets/base-button.css";
@@ -113,4 +113,4 @@ export {
113
113
  T as B,
114
114
  n as a
115
115
  };
116
- //# sourceMappingURL=base-button.6be8b60e.js.map
116
+ //# sourceMappingURL=base-button.a0140a4c.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"base-button.6be8b60e.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 @focus=\"onFocusButton\"\n @blur=\"onBlurButton\"\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 const onFocusButton = (e: FocusEvent) => {\n emit(BentoBaseButtonEvent.FOCUS, e);\n };\n\n const onBlurButton = (e: FocusEvent) => {\n emit(BentoBaseButtonEvent.BLUR, e);\n };\n\n return {\n // Values\n ariaAttributes,\n conditionalClasses,\n\n // Methods\n onClickButton,\n onFocusButton,\n onBlurButton,\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","e","useHasSlot","openBlock","createElementBlock","normalizeClass","_ctx","_cache","args","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;ACwDR,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;AAoBrE,WAAA;AAAA;AAAA,MAAO,gBAAAG;AAAA,MAEH,oBAAAK;AAAA;AAAA,MACA,eApBJ,CAAAC,MAAA;AACI,QAAAV,EAAA,YAGIU,EAAA,eAAA,GACAA,EAAA,gBAAA,KAHAR,EAAAP,EAAA,OAAAe,CAAA;AAAA,MAIJ;AAAA,MAiBA,eAdJ,CAAAA,MAAA;AACI,QAAAR,EAAAP,EAAA,OAAAe,CAAA;AAAA,MAAkC;AAAA,MAclC,cAXJ,CAAAA,MAAA;AACI,QAAAR,EAAAP,EAAA,MAAAe,CAAA;AAAA,MAAiC;AAAA,MAWjC,SAAAC,EAAAV,CAAA;AAAA;AAAA,MACyB,oBAAAM;AAAA,IAGzB;AAAA,EACJ;AAER,CAAA;;EA9H2C,KAAA;AAAA,EAA2B,OAAA;AAAA;;EAM1B,KAAA;AAAA,EAA4B,OAAA;AAAA;;;;AAf/D,SAAAK,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,IACE,SAAAC,EAAA,CAAA,MAAAA,EAAA,CAAA,IAAA,IAAAC,MAAAF,EAAA,iBAAAA,EAAA,cAAA,GAAAE,CAAA;AAAA,IACW,SAAAD,EAAA,CAAA,MAAAA,EAAA,CAAA,IAAA,IAAAC,MAAAF,EAAA,iBAAAA,EAAA,cAAA,GAAAE,CAAA;AAAA;EAEA,GAAA;AAAA;;IAGK,CAAA,KAAAC,EAAA,IAAA,EAAA;AAAA,IAELH,EAAA,QAAA,SAAA,KAAAH,EAAA,GAAAO,EAAAC,GAAA;AAAA,MAFkC,KAAA;AAAA,MAAC,IAAA;AAAA,MAAe,SAAA;AAAA,MAAe,UAAA;AAAA;;;;;;;IAGpFL,EAAA,QAAA,WAAA,KAAAH,EAAA,GAAAC,EAAA,QAAAQ,GAAA;AAAA;;;;;"}
1
+ {"version":3,"file":"base-button.a0140a4c.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 @focus=\"onFocusButton\"\n @blur=\"onBlurButton\"\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 const onFocusButton = (e: FocusEvent) => {\n emit(BentoBaseButtonEvent.FOCUS, e);\n };\n\n const onBlurButton = (e: FocusEvent) => {\n emit(BentoBaseButtonEvent.BLUR, e);\n };\n\n return {\n // Values\n ariaAttributes,\n conditionalClasses,\n\n // Methods\n onClickButton,\n onFocusButton,\n onBlurButton,\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","e","useHasSlot","openBlock","createElementBlock","normalizeClass","_ctx","_cache","args","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;ACwDR,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;AAoBrE,WAAA;AAAA;AAAA,MAAO,gBAAAG;AAAA,MAEH,oBAAAK;AAAA;AAAA,MACA,eApBJ,CAAAC,MAAA;AACI,QAAAV,EAAA,YAGIU,EAAA,eAAA,GACAA,EAAA,gBAAA,KAHAR,EAAAP,EAAA,OAAAe,CAAA;AAAA,MAIJ;AAAA,MAiBA,eAdJ,CAAAA,MAAA;AACI,QAAAR,EAAAP,EAAA,OAAAe,CAAA;AAAA,MAAkC;AAAA,MAclC,cAXJ,CAAAA,MAAA;AACI,QAAAR,EAAAP,EAAA,MAAAe,CAAA;AAAA,MAAiC;AAAA,MAWjC,SAAAC,EAAAV,CAAA;AAAA;AAAA,MACyB,oBAAAM;AAAA,IAGzB;AAAA,EACJ;AAER,CAAA;;EA9H2C,KAAA;AAAA,EAA2B,OAAA;AAAA;;EAM1B,KAAA;AAAA,EAA4B,OAAA;AAAA;;;;AAf/D,SAAAK,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,IACE,SAAAC,EAAA,CAAA,MAAAA,EAAA,CAAA,IAAA,IAAAC,MAAAF,EAAA,iBAAAA,EAAA,cAAA,GAAAE,CAAA;AAAA,IACW,SAAAD,EAAA,CAAA,MAAAA,EAAA,CAAA,IAAA,IAAAC,MAAAF,EAAA,iBAAAA,EAAA,cAAA,GAAAE,CAAA;AAAA;EAEA,GAAA;AAAA;;IAGK,CAAA,KAAAC,EAAA,IAAA,EAAA;AAAA,IAELH,EAAA,QAAA,SAAA,KAAAH,EAAA,GAAAO,EAAAC,GAAA;AAAA,MAFkC,KAAA;AAAA,MAAC,IAAA;AAAA,MAAe,SAAA;AAAA,MAAe,UAAA;AAAA;;;;;;;IAGpFL,EAAA,QAAA,WAAA,KAAAH,EAAA,GAAAC,EAAA,QAAAQ,GAAA;AAAA;;;;;"}
@@ -1,13 +1,13 @@
1
1
  import { defineComponent as F, useSlots as Z, ref as p, computed as u, inject as ce, watch as J, nextTick as ue, onUnmounted as re, openBlock as b, createBlock as O, normalizeClass as W, unref as t, createSlots as ee, withCtx as l, createElementVNode as _, normalizeStyle as P, renderSlot as r, createCommentVNode as M, createVNode as j, useAttrs as me, onMounted as ge, provide as R, toRefs as fe, createElementBlock as pe, withKeys as ve } from "vue";
2
- import { a as ye } from "./button.de5589fa.js";
3
- import { B as _e } from "./index.ea65003b.js";
2
+ import { a as ye } from "./button.ae4760cd.js";
3
+ import { B as _e } from "./index.9d7fb316.js";
4
4
  import { u as te } from "./use-has-slot.4d98bf29.js";
5
5
  import { u as be } from "./i18n.f7e6533e.js";
6
6
  import { M as Ae } from "./base-modal.keys.b08a6bdf.js";
7
7
  import { g as Le } from "./unique-id.a2a2b458.js";
8
- import { B as X } from "./index.11b6dd35.js";
9
- import { F as he } from "./footer-actions.c401ec50.js";
10
- import { D as Ce, B as Ee, b as Ie, a as Pe } from "./dialog-page.cd8c7fff.js";
8
+ import { B as X } from "./index.ee15db35.js";
9
+ import { F as he } from "./footer-actions.64f6f5d8.js";
10
+ import { D as Ce, B as Ee, b as Ie, a as Pe } from "./dialog-page.cb6ce9b6.js";
11
11
  import { o as Oe } from "./resize.a041304d.js";
12
12
  import { G as Se, a as ke } from "./grid-layout.c2fe3057.js";
13
13
  import { _ as ae } from "./_plugin-vue_export-helper.dad06003.js";
@@ -497,4 +497,4 @@ export {
497
497
  we as g,
498
498
  st as h
499
499
  };
500
- //# sourceMappingURL=base-modal.310c4790.js.map
500
+ //# sourceMappingURL=base-modal.4102f69d.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"base-modal.310c4790.js","sources":["../../../vue2/src/components/modal/modal.types.ts","../../../vue2/src/components/modal/modal.keys.ts","../../../vue2/src/components/modal/components/modal-page/modal-page.vue","../../../vue2/src/components/modal/components/base-modal/base-modal.vue"],"sourcesContent":["import { ComputedRef, Ref } from 'vue';\n\n/**\n * Public\n */\n\n/**\n * @deprecated for usage with properties since version 2.0. Use the string literal instead.\n */\nexport enum BentoModalVariant {\n DEFAULT = 'default',\n DIALOG = 'dialog',\n}\n\n/**\n * @deprecated for usage with properties since version 2.0. Use the string literal instead.\n */\nexport enum BentoModalVariantMapping {\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\n/**\n * Private\n */\nexport interface BentoModalConfigData {\n activePage: Ref<string>;\n height: Ref<string>;\n isAnimationActive: Ref<boolean>;\n pageCustomPadding: Ref<string>;\n showCloseButton: ComputedRef<boolean>;\n size: Ref<BentoModalSize | `${BentoModalSize}`>;\n}\n","export const MODAL_CONFIG_INJECTION_KEY = Symbol('modal config data injection key');\n","<template>\n <dialog-page\n ref=\"page\"\n class=\"b-modal-page\"\n :class=\"modalPageConditionalClasses\"\n :page-id=\"pageId\"\n :always-show-border=\"hasColumnLayout\"\n :back-button-styling=\"customPaddingStyles?.backButton\"\n :previous-page=\"previousPage\"\n @animationend=\"isAnimationActive = false\"\n >\n <template v-if=\"hasSlot('default') || showCloseButton\" #header>\n <div class=\"b-modal-page__header-container\" :style=\"customPaddingStyles.header\">\n <div class=\"b-modal-page__header\">\n <bento-typography\n class=\"b-modal-page__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 </div>\n </div>\n </template>\n\n <template #content>\n <div\n class=\"b-modal-page__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 no-gap\n class=\"b-modal-page__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 </template>\n <template v-if=\"hasSlot('actions')\" #footer>\n <div class=\"b-modal-page__actions-container\" :style=\"customPaddingStyles.actions\">\n <div aria-label=\"modal actions\" class=\"b-modal-page__actions\">\n <slot name=\"actions\" />\n </div>\n </div>\n </template>\n <template v-else-if=\"actions && actions.length > 0\" #footer>\n <div class=\"b-modal-page__actions-container\" :style=\"customPaddingStyles.actions\">\n <footer-actions\n :actions=\"actions\"\n :actions-label=\"actionsLabel\"\n :destructive-actions=\"destructiveActions\"\n />\n </div>\n </template>\n </dialog-page>\n</template>\n\n<script setup lang=\"ts\">\n import { computed, defineComponent, inject, nextTick, onUnmounted, PropType, ref, useSlots, watch } from 'vue';\n import {\n BentoModalColumnLayoutVariant,\n BentoModalConfigData,\n BentoModalSize,\n } from '@/components/modal/modal.types';\n import { BentoTypography } from '@/components/typography';\n import { BentoButtonActionsList } from '@/components/button';\n import { GridLayout, GridLayoutContainerType } from '@/internal';\n import { useHasSlot } from '@/composables';\n\n import { FooterActions } from '@/components/internal/footer-actions';\n\n import DialogPage from '@/internal/dialog-page/dialog-page.vue';\n import { MODAL_CONFIG_INJECTION_KEY } from '../../modal.keys';\n import { observeSizeOfElement } from '@/utils/ts/resize';\n\n const CLOSE_BUTTON_ICON_WIDTH = 26;\n\n const slots = useSlots();\n const hasSlot = useHasSlot(slots);\n const page = ref<InstanceType<typeof DialogPage>>(null);\n\n const props = defineProps({\n /**\n * List of actions that will be used to render the buttons.\n * First element in the list will be rendered as \"primary\".\n * All elements after the first will be rendered as \"secondary\".\n * But you may change the color of 1-st action to red with 'critial' key\n * Not more than 3 action buttons can be provided\n * Or 2 action buttons and 1 Label for them\n *\n * Each object in the list should have a `title`, an `event` and\n * (optional) a Vue `icon` from the library `@adyen/ui-assets-icons-16`.\n *\n * `title`: Button's text.\n *\n * `event`: Event triggered when clicking the Button.\n *\n * `icon`: Vue Icon from the library `@adyen/ui-assets-icons-16`.\n *\n * ```\n * [{\n * title: 'Primary',2\n * event: () => { ... },\n * icon: FourPeopleIcon\n * }, {\n * title: 'Secondary',\n * event: () => { ... }\n * }]\n * ```\n */\n actions: {\n type: Array as PropType<BentoButtonActionsList>,\n default: null,\n },\n\n /**\n * Text label that is displayed left to the action buttons\n */\n actionsLabel: { type: String, default: null },\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 * If passed - sets first button color to red\n */\n destructiveActions: { type: Boolean, default: false },\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 /**\n * Identifier of the page, used with activePage prop to handle modal navigation\n */\n pageId: {\n type: String,\n default: undefined,\n },\n\n /**\n * ID of the page for the back button to navigate to. Only use it to overwrite the default back behavior\n * Used when the back button should not take the user to the natural previous page\n * Set to `null` to hide back button in the page\n */\n previousPage: {\n type: String,\n default: undefined,\n },\n });\n\n const modalPageConditionalClasses = computed(() => ({\n 'b-modal-page--custom-padding': props.customPadding,\n }));\n\n const modalContentConditionalClasses = computed(() => ({\n 'b-modal-page__content--with-header': hasSlot('default'),\n 'b-modal-page__content--with-actions': hasSlot('actions') || props.actions?.length,\n }));\n\n // Setting custom padding styles\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: {\n ...xPadding,\n paddingTop: props.customPadding,\n paddingRight: `${parseInt(props.customPadding, 10) + CLOSE_BUTTON_ICON_WIDTH}px`,\n flex: 1,\n },\n content,\n actions: { ...xPadding, paddingBottom: props.customPadding },\n backButton: { top: props.customPadding, paddingLeft: props.customPadding },\n };\n });\n\n // Column layout styles\n const hasColumnLayout = computed(() => props.withColumnLayout && size.value === BentoModalSize.LARGE);\n\n const computedColumnWidth = computed(() => {\n if (props.columnsSize === BentoModalColumnLayoutVariant.SMALLER) {\n return [\n { small: 4, medium: 4, large: 4 },\n { small: 8, medium: 8, large: 8 },\n ];\n }\n if (props.columnsSize === BentoModalColumnLayoutVariant.BIGGER) {\n return [\n { small: 8, medium: 8, large: 8 },\n { small: 4, medium: 4, large: 4 },\n ];\n }\n return [\n { small: 6, medium: 6, large: 6 },\n { small: 6, medium: 6, large: 6 },\n ];\n });\n\n // Register page to parent component and inject data from parent component\n const { activePage, height, isAnimationActive, pageCustomPadding, showCloseButton, size } =\n inject<BentoModalConfigData>(MODAL_CONFIG_INJECTION_KEY);\n\n const isCurrentPage = computed(() => activePage.value === props.pageId || !activePage.value);\n\n // Animation\n // Set resize observer on mount of update the height of the dialog on resize\n let pageElementObserver: ResizeObserver | null = null;\n\n // Watching activePage changes to set the height of the page and set isAnimationActive\n watch(\n () => activePage.value,\n async (value, oldValue) => {\n if (isCurrentPage.value) {\n await nextTick();\n height.value = `${page.value?.$el?.clientHeight}px`;\n pageCustomPadding.value = props.customPadding;\n // only set isAnimationActive to true if its going from two different pages and not from null to the first page\n isAnimationActive.value = oldValue !== undefined;\n\n pageElementObserver = observeSizeOfElement(page.value, () => {\n const pageHeight = `${page.value?.$el?.clientHeight}px` ?? '';\n if (pageHeight !== height.value) {\n height.value = pageHeight;\n }\n });\n }\n },\n { immediate: true }\n );\n\n // Disconnect observer on unmounting the page\n onUnmounted(() => {\n pageElementObserver?.disconnect();\n });\n</script>\n\n<script lang=\"ts\">\n /**\n * ModalPage is used to render different pages of the Modal component\n *\n * @example\n * import { BentoModal, BentoModalPage } from '@adyen/bento-vue2';\n *\n * export default {\n * components: { BentoModal, BentoModalPage },\n * template: `\n * <bento-modal active-page='page1' :is-open='true'>\n * <bento-modal-page\n * pageId='page1'\n * actions-label='Move to next page'\n * :actions=\"[\n * {\n * title: 'Next page',\n * event: () => {\n * activePage.value = 'page2';\n * },\n * }]\">\n * Page 1\n * <template #content>\n * Page 1 content\n * </template>\n * </bento-modal-page>\n * <bento-modal-page\n * pageId='page2'\n * :actions=\"[\n * {\n * title: 'Save',\n * event: () => {},\n * }]\">\n * Page 2\n * <template #content>\n * Page 2 content\n * </template>\n * </bento-modal-page>\n * </bento-modal>\n * `\n * }\n */\n export default defineComponent({});\n</script>\n\n<style lang=\"scss\" scoped src=\"./modal-page.scss\" />\n","<template>\n <div class=\"b-modal-base\">\n <dialog\n :id=\"modalId\"\n ref=\"modal\"\n :role=\"modalRole\"\n :aria-label=\"computedAriaLabel\"\n :style=\"{ height: height }\"\n class=\"b-modal-base__container\"\n :class=\"modalConditionalClasses\"\n :open=\"initiallyOpen\"\n @animationend=\"closeModalAfterAnimation\"\n @click=\"isDismissible && closeModalOnClickOutside($event)\"\n @keydown.esc=\"internalModalActionClose\"\n >\n <bento-focus-trap v-if=\"isOpen || initiallyOpen\">\n <bento-button\n v-if=\"showCloseButton\"\n class=\"b-modal-base__close-button\"\n variant=\"tertiary\"\n type=\"button\"\n :style=\"customPaddingStyles\"\n @click=\"internalModalActionClose\"\n >\n <cross-icon :svg-title=\"t('close')\" />\n </bento-button>\n <template v-if=\"props.activePage\">\n <slot />\n </template>\n <bento-modal-page\n v-else\n :with-column-layout=\"withColumnLayout\"\n :size=\"size\"\n :custom-padding=\"customPadding\"\n :columns-size=\"columnsSize\"\n >\n <template v-if=\"hasSlot('default')\" #default>\n <slot></slot>\n </template>\n <template v-if=\"hasSlot('content-col-1')\" #content-col-1\n ><slot name=\"content-col-1\"></slot\n ></template>\n <template v-if=\"hasSlot('content-col-2')\" #content-col-2\n ><slot name=\"content-col-2\"></slot\n ></template>\n <template v-if=\"hasSlot('content')\" #content><slot name=\"content\"></slot></template>\n <template v-if=\"hasSlot('actions')\" #actions><slot name=\"actions\"></slot></template>\n </bento-modal-page>\n </bento-focus-trap>\n </dialog>\n </div>\n</template>\n\n<script setup lang=\"ts\">\n import {\n computed,\n defineComponent,\n onMounted,\n PropType,\n provide,\n ref,\n toRefs,\n useAttrs,\n useSlots,\n watch,\n } from 'vue';\n import {\n BentoModalColumnLayoutVariant,\n BentoModalConfigData,\n BentoModalRole,\n BentoModalSize,\n } from '@/components/modal/modal.types';\n import { BentoButton, BentoButtonActionsList } from '@/components/button';\n import { BentoFocusTrap } from '@/components/focus-trap';\n import { useHasSlot } from '@/composables';\n import { useI18n } from '@/utils/ts/i18n';\n import { MODAL_DIALOG_ID_INJECTION_KEY } from '@/components/modal/components/base-modal/base-modal.keys';\n import { generateUid } from '@/utils/ts/unique-id';\n import messages from './messages.json';\n\n import { BentoModalPage } from '@/components/modal';\n import CrossIcon from '@adyen/ui-assets-icons-16/vue/cross';\n\n import { MODAL_CONFIG_INJECTION_KEY } from '../../modal.keys';\n import {\n BentoDialogPageAnimation,\n BentoDialogPageConfigData,\n BentoDialogPageRegisterPage,\n DIALOG_PAGE_CONFIG_INJECTION_KEY,\n DIALOG_PAGE_REGISTER_PAGE_INJECTION_KEY,\n } from '@/internal';\n\n type MessageSchema = (typeof messages)['en-US'];\n const LOADING_BTN_CLOSE_AFTER_SUCCESS_DELAY_TIME = 500;\n\n const { t } = useI18n<{ message: MessageSchema }>({ messages });\n const slots = useSlots();\n const attrs = useAttrs();\n const hasSlot = useHasSlot(slots);\n const modal = ref<HTMLDialogElement>(null);\n const isClosing = ref(false);\n const modalId = generateUid('modal');\n\n const emit = defineEmits<{\n /**\n * Emits update event when page is changed internally\n */\n (e: 'update:active-page', page: string): void;\n /**\n * Emitted when the modal is closed.\n */\n (e: 'close-modal');\n }>();\n\n const props = defineProps({\n /**\n * List of actions that will be used to render the buttons.\n * First element in the list will be rendered as \"primary\".\n * All elements after the first will be rendered as \"secondary\".\n * But you may change the color of 1-st action to red with 'critial' key\n * Not more than 3 action buttons can be provided\n * Or 2 action buttons and 1 Label for them\n *\n * Each object in the list should have a `title`, an `event` and\n * (optional) a Vue `icon` from the library `@adyen/ui-assets-icons-16`.\n *\n * `title`: Button's text.\n *\n * `event`: Event triggered when clicking the Button.\n *\n * `icon`: Vue Icon from the library `@adyen/ui-assets-icons-16`.\n *\n * ```\n * [{\n * title: 'Primary',2\n * event: () => { ... },\n * icon: FourPeopleIcon\n * }, {\n * title: 'Secondary',\n * event: () => { ... }\n * }]\n * ```\n */\n actions: {\n type: Array as PropType<BentoButtonActionsList>,\n default: null,\n },\n\n /**\n * The id of the current active page\n * Should be the same id as the BentoModalPage to be displayed\n */\n activePage: {\n type: String,\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 * If passed - sets first button color to red\n */\n destructiveActions: { type: Boolean, default: false },\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 * 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\n const showCloseButton = computed(() => props.isDismissible && !props.hideCloseButton);\n\n const pageCustomPadding = ref(props.customPadding);\n\n const customPaddingStyles = computed(() => {\n if (!pageCustomPadding.value) {\n return {};\n }\n\n return { top: pageCustomPadding.value, right: pageCustomPadding.value };\n });\n\n const computedAriaLabel = computed(() => (attrs['aria-label'] as string) ?? (t('ariaLabelFallback') as string));\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('close-modal');\n };\n\n // Handle closing and closing animation for dialog element\n const closeModalAfterAnimation = () => {\n if (isClosing.value) {\n modal.value.close();\n if (previousPages.value[0]) {\n emit('update:active-page', previousPages.value[0]);\n }\n previousPages.value = [];\n isClosing.value = false;\n emitCloseEvent();\n }\n };\n\n const startCloseModalAnimation = () => {\n if (!modal.value.open) {\n return;\n }\n isClosing.value = true;\n };\n\n /**\n * If the user has pressed escape, clicked outside or clicked the close icon.\n * Needs to be called from outside, following the \"dialog.close()\" pattern,\n * when the closing event is triggered outside of the \"base-modal\"\n * component (e.g. from a closing action).\n */\n const internalModalActionClose = (event?: Event) => {\n if (event) {\n event.preventDefault();\n }\n if (!props.isDismissible && props.modalRole === BentoModalRole.DIALOG) {\n return;\n }\n startCloseModalAnimation();\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 internalModalActionClose();\n }\n };\n\n const modalConditionalClasses = computed(() => ({\n [`b-modal-base__container--${props.size}`]: props.size,\n 'b-modal-base__container--hide': isClosing.value,\n 'b-modal-base__container--column-layout': hasColumnLayout.value,\n 'b-modal-base__container--animation': isAnimationActive.value,\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 // add the first page to the array when the modal opens\n if (!previousPages.value.length) {\n previousPages.value.push(activePage.value);\n }\n } else if (!isFirstMutation) {\n startCloseModalAnimation();\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(startCloseModalAnimation, 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 /**\n * Expose methods through its 'ref'\n */\n defineExpose({\n internalModalActionClose,\n });\n\n // Let's Children components know they are inside a Modal (dialog element)\n provide(MODAL_DIALOG_ID_INJECTION_KEY, modalId);\n\n // Modal pagination\n const { activePage, isOpen, size } = toRefs(props);\n const animation = ref(BentoDialogPageAnimation.TRANSITION_LEVEL_DEEPER);\n\n const pages = ref<string[]>([]);\n const previousPages = ref([]);\n\n const updatePage = page => emit('update:active-page', page);\n\n // unregister page if removed / destroyed\n const unregisterPage = (pageIdToRemove: string) => () => {\n pages.value = pages.value?.filter(pageId => pageId !== pageIdToRemove);\n };\n\n // Provide data and function to register page to subcomponent\n const registerPage: BentoDialogPageRegisterPage = pageId => {\n if (pageId) {\n pages.value.push(pageId);\n }\n\n return { unregisterPage: unregisterPage(pageId) };\n };\n\n const height = ref('');\n const isAnimationActive = ref(false);\n\n provide<BentoModalConfigData>(MODAL_CONFIG_INJECTION_KEY, {\n activePage,\n height,\n isAnimationActive,\n pageCustomPadding,\n showCloseButton,\n size,\n });\n\n provide<BentoDialogPageConfigData>(DIALOG_PAGE_CONFIG_INJECTION_KEY, {\n activePage,\n animation,\n isOpen,\n pages,\n previousPages,\n updatePage,\n });\n\n provide(DIALOG_PAGE_REGISTER_PAGE_INJECTION_KEY, registerPage);\n</script>\n\n<script lang=\"ts\">\n /**\n * Dialog container. It creates a dialog HTML element for the modal to use.\n *\n * @example\n * import BaseModal from './components/base-modal/base-modal.vue';\n *\n * export default {\n * components: { BaseModal },\n * template: `\n * <base-modal\n * :hide-close-button=\"true\"\n * :is-dismissible=\"false\"\n * :is-open=\"isOpen\"\n * @close-modal=\"isOpen = false\"\n * >\n * <template #content-col-1>\n * // Content on the left side column\n * </template>\n *\n * <template #content-col-2>\n * // Content on the right side column\n * </template>\n *\n * <template v-if=\"actions\" #actions>\n * <footer-actions :actions=\"actions\" />\n * </template>\n * </base-modal>\n * `,\n * setup() {\n * const isOpen = ref(true)\n * const footerActions = [{\n * title: 'Primary action',\n * event: () => { ... }\n * }]\n * }\n * }\n */\n export default defineComponent({\n i18n: { messages },\n name: 'base-modal',\n });\n</script>\n\n<style lang=\"scss\" scoped src=\"./base-modal.scss\" />\n"],"names":["BentoModalVariant","BentoModalVariant2","BentoModalVariantMapping","BentoModalVariantMapping2","BentoModalSize","BentoModalSize2","BentoModalColumnLayoutVariant","BentoModalColumnLayoutVariant2","BentoModalRole","BentoModalRole2","BentoModalDialogType","BentoModalDialogType2","BentoModalEvent","BentoModalEvent2","MODAL_CONFIG_INJECTION_KEY","__default__$1","defineComponent","CLOSE_BUTTON_ICON_WIDTH","slots","useSlots","hasSlot","useHasSlot","page","ref","modalPageConditionalClasses","computed","props","modalContentConditionalClasses","_a","customPaddingStyles","xPadding","content","hasColumnLayout","size","computedColumnWidth","activePage","height","isAnimationActive","pageCustomPadding","showCloseButton","inject","isCurrentPage","pageElementObserver","watch","value","oldValue","nextTick","_b","observeSizeOfElement","pageHeight","onUnmounted","__default__","messages","LOADING_BTN_CLOSE_AFTER_SUCCESS_DELAY_TIME","t","useI18n","attrs","useAttrs","modal","isClosing","modalId","generateUid","computedAriaLabel","openModal","emitCloseEvent","emit","closeModalAfterAnimation","previousPages","startCloseModalAnimation","internalModalActionClose","event","closeModalOnClickOutside","target","modalConditionalClasses","newIsOpen","newModalValue","oldModalValue","onMounted","expose","provide","MODAL_DIALOG_ID_INJECTION_KEY","isOpen","toRefs","animation","BentoDialogPageAnimation","pages","updatePage","unregisterPage","pageIdToRemove","pageId","registerPage","DIALOG_PAGE_CONFIG_INJECTION_KEY","DIALOG_PAGE_REGISTER_PAGE_INJECTION_KEY"],"mappings":"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"}
1
+ {"version":3,"file":"base-modal.4102f69d.js","sources":["../../../vue2/src/components/modal/modal.types.ts","../../../vue2/src/components/modal/modal.keys.ts","../../../vue2/src/components/modal/components/modal-page/modal-page.vue","../../../vue2/src/components/modal/components/base-modal/base-modal.vue"],"sourcesContent":["import { ComputedRef, Ref } from 'vue';\n\n/**\n * Public\n */\n\n/**\n * @deprecated for usage with properties since version 2.0. Use the string literal instead.\n */\nexport enum BentoModalVariant {\n DEFAULT = 'default',\n DIALOG = 'dialog',\n}\n\n/**\n * @deprecated for usage with properties since version 2.0. Use the string literal instead.\n */\nexport enum BentoModalVariantMapping {\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\n/**\n * Private\n */\nexport interface BentoModalConfigData {\n activePage: Ref<string>;\n height: Ref<string>;\n isAnimationActive: Ref<boolean>;\n pageCustomPadding: Ref<string>;\n showCloseButton: ComputedRef<boolean>;\n size: Ref<BentoModalSize | `${BentoModalSize}`>;\n}\n","export const MODAL_CONFIG_INJECTION_KEY = Symbol('modal config data injection key');\n","<template>\n <dialog-page\n ref=\"page\"\n class=\"b-modal-page\"\n :class=\"modalPageConditionalClasses\"\n :page-id=\"pageId\"\n :always-show-border=\"hasColumnLayout\"\n :back-button-styling=\"customPaddingStyles?.backButton\"\n :previous-page=\"previousPage\"\n @animationend=\"isAnimationActive = false\"\n >\n <template v-if=\"hasSlot('default') || showCloseButton\" #header>\n <div class=\"b-modal-page__header-container\" :style=\"customPaddingStyles.header\">\n <div class=\"b-modal-page__header\">\n <bento-typography\n class=\"b-modal-page__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 </div>\n </div>\n </template>\n\n <template #content>\n <div\n class=\"b-modal-page__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 no-gap\n class=\"b-modal-page__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 </template>\n <template v-if=\"hasSlot('actions')\" #footer>\n <div class=\"b-modal-page__actions-container\" :style=\"customPaddingStyles.actions\">\n <div aria-label=\"modal actions\" class=\"b-modal-page__actions\">\n <slot name=\"actions\" />\n </div>\n </div>\n </template>\n <template v-else-if=\"actions && actions.length > 0\" #footer>\n <div class=\"b-modal-page__actions-container\" :style=\"customPaddingStyles.actions\">\n <footer-actions\n :actions=\"actions\"\n :actions-label=\"actionsLabel\"\n :destructive-actions=\"destructiveActions\"\n />\n </div>\n </template>\n </dialog-page>\n</template>\n\n<script setup lang=\"ts\">\n import { computed, defineComponent, inject, nextTick, onUnmounted, PropType, ref, useSlots, watch } from 'vue';\n import {\n BentoModalColumnLayoutVariant,\n BentoModalConfigData,\n BentoModalSize,\n } from '@/components/modal/modal.types';\n import { BentoTypography } from '@/components/typography';\n import { BentoButtonActionsList } from '@/components/button';\n import { GridLayout, GridLayoutContainerType } from '@/internal';\n import { useHasSlot } from '@/composables';\n\n import { FooterActions } from '@/components/internal/footer-actions';\n\n import DialogPage from '@/internal/dialog-page/dialog-page.vue';\n import { MODAL_CONFIG_INJECTION_KEY } from '../../modal.keys';\n import { observeSizeOfElement } from '@/utils/ts/resize';\n\n const CLOSE_BUTTON_ICON_WIDTH = 26;\n\n const slots = useSlots();\n const hasSlot = useHasSlot(slots);\n const page = ref<InstanceType<typeof DialogPage>>(null);\n\n const props = defineProps({\n /**\n * List of actions that will be used to render the buttons.\n * First element in the list will be rendered as \"primary\".\n * All elements after the first will be rendered as \"secondary\".\n * But you may change the color of 1-st action to red with 'critial' key\n * Not more than 3 action buttons can be provided\n * Or 2 action buttons and 1 Label for them\n *\n * Each object in the list should have a `title`, an `event` and\n * (optional) a Vue `icon` from the library `@adyen/ui-assets-icons-16`.\n *\n * `title`: Button's text.\n *\n * `event`: Event triggered when clicking the Button.\n *\n * `icon`: Vue Icon from the library `@adyen/ui-assets-icons-16`.\n *\n * ```\n * [{\n * title: 'Primary',2\n * event: () => { ... },\n * icon: FourPeopleIcon\n * }, {\n * title: 'Secondary',\n * event: () => { ... }\n * }]\n * ```\n */\n actions: {\n type: Array as PropType<BentoButtonActionsList>,\n default: null,\n },\n\n /**\n * Text label that is displayed left to the action buttons\n */\n actionsLabel: { type: String, default: null },\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 * If passed - sets first button color to red\n */\n destructiveActions: { type: Boolean, default: false },\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 /**\n * Identifier of the page, used with activePage prop to handle modal navigation\n */\n pageId: {\n type: String,\n default: undefined,\n },\n\n /**\n * ID of the page for the back button to navigate to. Only use it to overwrite the default back behavior\n * Used when the back button should not take the user to the natural previous page\n * Set to `null` to hide back button in the page\n */\n previousPage: {\n type: String,\n default: undefined,\n },\n });\n\n const modalPageConditionalClasses = computed(() => ({\n 'b-modal-page--custom-padding': props.customPadding,\n }));\n\n const modalContentConditionalClasses = computed(() => ({\n 'b-modal-page__content--with-header': hasSlot('default'),\n 'b-modal-page__content--with-actions': hasSlot('actions') || props.actions?.length,\n }));\n\n // Setting custom padding styles\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: {\n ...xPadding,\n paddingTop: props.customPadding,\n paddingRight: `${parseInt(props.customPadding, 10) + CLOSE_BUTTON_ICON_WIDTH}px`,\n flex: 1,\n },\n content,\n actions: { ...xPadding, paddingBottom: props.customPadding },\n backButton: { top: props.customPadding, paddingLeft: props.customPadding },\n };\n });\n\n // Column layout styles\n const hasColumnLayout = computed(() => props.withColumnLayout && size.value === BentoModalSize.LARGE);\n\n const computedColumnWidth = computed(() => {\n if (props.columnsSize === BentoModalColumnLayoutVariant.SMALLER) {\n return [\n { small: 4, medium: 4, large: 4 },\n { small: 8, medium: 8, large: 8 },\n ];\n }\n if (props.columnsSize === BentoModalColumnLayoutVariant.BIGGER) {\n return [\n { small: 8, medium: 8, large: 8 },\n { small: 4, medium: 4, large: 4 },\n ];\n }\n return [\n { small: 6, medium: 6, large: 6 },\n { small: 6, medium: 6, large: 6 },\n ];\n });\n\n // Register page to parent component and inject data from parent component\n const { activePage, height, isAnimationActive, pageCustomPadding, showCloseButton, size } =\n inject<BentoModalConfigData>(MODAL_CONFIG_INJECTION_KEY);\n\n const isCurrentPage = computed(() => activePage.value === props.pageId || !activePage.value);\n\n // Animation\n // Set resize observer on mount of update the height of the dialog on resize\n let pageElementObserver: ResizeObserver | null = null;\n\n // Watching activePage changes to set the height of the page and set isAnimationActive\n watch(\n () => activePage.value,\n async (value, oldValue) => {\n if (isCurrentPage.value) {\n await nextTick();\n height.value = `${page.value?.$el?.clientHeight}px`;\n pageCustomPadding.value = props.customPadding;\n // only set isAnimationActive to true if its going from two different pages and not from null to the first page\n isAnimationActive.value = oldValue !== undefined;\n\n pageElementObserver = observeSizeOfElement(page.value, () => {\n const pageHeight = `${page.value?.$el?.clientHeight}px` ?? '';\n if (pageHeight !== height.value) {\n height.value = pageHeight;\n }\n });\n }\n },\n { immediate: true }\n );\n\n // Disconnect observer on unmounting the page\n onUnmounted(() => {\n pageElementObserver?.disconnect();\n });\n</script>\n\n<script lang=\"ts\">\n /**\n * ModalPage is used to render different pages of the Modal component\n *\n * @example\n * import { BentoModal, BentoModalPage } from '@adyen/bento-vue2';\n *\n * export default {\n * components: { BentoModal, BentoModalPage },\n * template: `\n * <bento-modal active-page='page1' :is-open='true'>\n * <bento-modal-page\n * pageId='page1'\n * actions-label='Move to next page'\n * :actions=\"[\n * {\n * title: 'Next page',\n * event: () => {\n * activePage.value = 'page2';\n * },\n * }]\">\n * Page 1\n * <template #content>\n * Page 1 content\n * </template>\n * </bento-modal-page>\n * <bento-modal-page\n * pageId='page2'\n * :actions=\"[\n * {\n * title: 'Save',\n * event: () => {},\n * }]\">\n * Page 2\n * <template #content>\n * Page 2 content\n * </template>\n * </bento-modal-page>\n * </bento-modal>\n * `\n * }\n */\n export default defineComponent({});\n</script>\n\n<style lang=\"scss\" scoped src=\"./modal-page.scss\" />\n","<template>\n <div class=\"b-modal-base\">\n <dialog\n :id=\"modalId\"\n ref=\"modal\"\n :role=\"modalRole\"\n :aria-label=\"computedAriaLabel\"\n :style=\"{ height: height }\"\n class=\"b-modal-base__container\"\n :class=\"modalConditionalClasses\"\n :open=\"initiallyOpen\"\n @animationend=\"closeModalAfterAnimation\"\n @click=\"isDismissible && closeModalOnClickOutside($event)\"\n @keydown.esc=\"internalModalActionClose\"\n >\n <bento-focus-trap v-if=\"isOpen || initiallyOpen\">\n <bento-button\n v-if=\"showCloseButton\"\n class=\"b-modal-base__close-button\"\n variant=\"tertiary\"\n type=\"button\"\n :style=\"customPaddingStyles\"\n @click=\"internalModalActionClose\"\n >\n <cross-icon :svg-title=\"t('close')\" />\n </bento-button>\n <template v-if=\"props.activePage\">\n <slot />\n </template>\n <bento-modal-page\n v-else\n :with-column-layout=\"withColumnLayout\"\n :size=\"size\"\n :custom-padding=\"customPadding\"\n :columns-size=\"columnsSize\"\n >\n <template v-if=\"hasSlot('default')\" #default>\n <slot></slot>\n </template>\n <template v-if=\"hasSlot('content-col-1')\" #content-col-1\n ><slot name=\"content-col-1\"></slot\n ></template>\n <template v-if=\"hasSlot('content-col-2')\" #content-col-2\n ><slot name=\"content-col-2\"></slot\n ></template>\n <template v-if=\"hasSlot('content')\" #content><slot name=\"content\"></slot></template>\n <template v-if=\"hasSlot('actions')\" #actions><slot name=\"actions\"></slot></template>\n </bento-modal-page>\n </bento-focus-trap>\n </dialog>\n </div>\n</template>\n\n<script setup lang=\"ts\">\n import {\n computed,\n defineComponent,\n onMounted,\n PropType,\n provide,\n ref,\n toRefs,\n useAttrs,\n useSlots,\n watch,\n } from 'vue';\n import {\n BentoModalColumnLayoutVariant,\n BentoModalConfigData,\n BentoModalRole,\n BentoModalSize,\n } from '@/components/modal/modal.types';\n import { BentoButton, BentoButtonActionsList } from '@/components/button';\n import { BentoFocusTrap } from '@/components/focus-trap';\n import { useHasSlot } from '@/composables';\n import { useI18n } from '@/utils/ts/i18n';\n import { MODAL_DIALOG_ID_INJECTION_KEY } from '@/components/modal/components/base-modal/base-modal.keys';\n import { generateUid } from '@/utils/ts/unique-id';\n import messages from './messages.json';\n\n import { BentoModalPage } from '@/components/modal';\n import CrossIcon from '@adyen/ui-assets-icons-16/vue/cross';\n\n import { MODAL_CONFIG_INJECTION_KEY } from '../../modal.keys';\n import {\n BentoDialogPageAnimation,\n BentoDialogPageConfigData,\n BentoDialogPageRegisterPage,\n DIALOG_PAGE_CONFIG_INJECTION_KEY,\n DIALOG_PAGE_REGISTER_PAGE_INJECTION_KEY,\n } from '@/internal';\n\n type MessageSchema = (typeof messages)['en-US'];\n const LOADING_BTN_CLOSE_AFTER_SUCCESS_DELAY_TIME = 500;\n\n const { t } = useI18n<{ message: MessageSchema }>({ messages });\n const slots = useSlots();\n const attrs = useAttrs();\n const hasSlot = useHasSlot(slots);\n const modal = ref<HTMLDialogElement>(null);\n const isClosing = ref(false);\n const modalId = generateUid('modal');\n\n const emit = defineEmits<{\n /**\n * Emits update event when page is changed internally\n */\n (e: 'update:active-page', page: string): void;\n /**\n * Emitted when the modal is closed.\n */\n (e: 'close-modal');\n }>();\n\n const props = defineProps({\n /**\n * List of actions that will be used to render the buttons.\n * First element in the list will be rendered as \"primary\".\n * All elements after the first will be rendered as \"secondary\".\n * But you may change the color of 1-st action to red with 'critial' key\n * Not more than 3 action buttons can be provided\n * Or 2 action buttons and 1 Label for them\n *\n * Each object in the list should have a `title`, an `event` and\n * (optional) a Vue `icon` from the library `@adyen/ui-assets-icons-16`.\n *\n * `title`: Button's text.\n *\n * `event`: Event triggered when clicking the Button.\n *\n * `icon`: Vue Icon from the library `@adyen/ui-assets-icons-16`.\n *\n * ```\n * [{\n * title: 'Primary',2\n * event: () => { ... },\n * icon: FourPeopleIcon\n * }, {\n * title: 'Secondary',\n * event: () => { ... }\n * }]\n * ```\n */\n actions: {\n type: Array as PropType<BentoButtonActionsList>,\n default: null,\n },\n\n /**\n * The id of the current active page\n * Should be the same id as the BentoModalPage to be displayed\n */\n activePage: {\n type: String,\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 * If passed - sets first button color to red\n */\n destructiveActions: { type: Boolean, default: false },\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 * 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\n const showCloseButton = computed(() => props.isDismissible && !props.hideCloseButton);\n\n const pageCustomPadding = ref(props.customPadding);\n\n const customPaddingStyles = computed(() => {\n if (!pageCustomPadding.value) {\n return {};\n }\n\n return { top: pageCustomPadding.value, right: pageCustomPadding.value };\n });\n\n const computedAriaLabel = computed(() => (attrs['aria-label'] as string) ?? (t('ariaLabelFallback') as string));\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('close-modal');\n };\n\n // Handle closing and closing animation for dialog element\n const closeModalAfterAnimation = () => {\n if (isClosing.value) {\n modal.value.close();\n if (previousPages.value[0]) {\n emit('update:active-page', previousPages.value[0]);\n }\n previousPages.value = [];\n isClosing.value = false;\n emitCloseEvent();\n }\n };\n\n const startCloseModalAnimation = () => {\n if (!modal.value.open) {\n return;\n }\n isClosing.value = true;\n };\n\n /**\n * If the user has pressed escape, clicked outside or clicked the close icon.\n * Needs to be called from outside, following the \"dialog.close()\" pattern,\n * when the closing event is triggered outside of the \"base-modal\"\n * component (e.g. from a closing action).\n */\n const internalModalActionClose = (event?: Event) => {\n if (event) {\n event.preventDefault();\n }\n if (!props.isDismissible && props.modalRole === BentoModalRole.DIALOG) {\n return;\n }\n startCloseModalAnimation();\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 internalModalActionClose();\n }\n };\n\n const modalConditionalClasses = computed(() => ({\n [`b-modal-base__container--${props.size}`]: props.size,\n 'b-modal-base__container--hide': isClosing.value,\n 'b-modal-base__container--column-layout': hasColumnLayout.value,\n 'b-modal-base__container--animation': isAnimationActive.value,\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 // add the first page to the array when the modal opens\n if (!previousPages.value.length) {\n previousPages.value.push(activePage.value);\n }\n } else if (!isFirstMutation) {\n startCloseModalAnimation();\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(startCloseModalAnimation, 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 /**\n * Expose methods through its 'ref'\n */\n defineExpose({\n internalModalActionClose,\n });\n\n // Let's Children components know they are inside a Modal (dialog element)\n provide(MODAL_DIALOG_ID_INJECTION_KEY, modalId);\n\n // Modal pagination\n const { activePage, isOpen, size } = toRefs(props);\n const animation = ref(BentoDialogPageAnimation.TRANSITION_LEVEL_DEEPER);\n\n const pages = ref<string[]>([]);\n const previousPages = ref([]);\n\n const updatePage = page => emit('update:active-page', page);\n\n // unregister page if removed / destroyed\n const unregisterPage = (pageIdToRemove: string) => () => {\n pages.value = pages.value?.filter(pageId => pageId !== pageIdToRemove);\n };\n\n // Provide data and function to register page to subcomponent\n const registerPage: BentoDialogPageRegisterPage = pageId => {\n if (pageId) {\n pages.value.push(pageId);\n }\n\n return { unregisterPage: unregisterPage(pageId) };\n };\n\n const height = ref('');\n const isAnimationActive = ref(false);\n\n provide<BentoModalConfigData>(MODAL_CONFIG_INJECTION_KEY, {\n activePage,\n height,\n isAnimationActive,\n pageCustomPadding,\n showCloseButton,\n size,\n });\n\n provide<BentoDialogPageConfigData>(DIALOG_PAGE_CONFIG_INJECTION_KEY, {\n activePage,\n animation,\n isOpen,\n pages,\n previousPages,\n updatePage,\n });\n\n provide(DIALOG_PAGE_REGISTER_PAGE_INJECTION_KEY, registerPage);\n</script>\n\n<script lang=\"ts\">\n /**\n * Dialog container. It creates a dialog HTML element for the modal to use.\n *\n * @example\n * import BaseModal from './components/base-modal/base-modal.vue';\n *\n * export default {\n * components: { BaseModal },\n * template: `\n * <base-modal\n * :hide-close-button=\"true\"\n * :is-dismissible=\"false\"\n * :is-open=\"isOpen\"\n * @close-modal=\"isOpen = false\"\n * >\n * <template #content-col-1>\n * // Content on the left side column\n * </template>\n *\n * <template #content-col-2>\n * // Content on the right side column\n * </template>\n *\n * <template v-if=\"actions\" #actions>\n * <footer-actions :actions=\"actions\" />\n * </template>\n * </base-modal>\n * `,\n * setup() {\n * const isOpen = ref(true)\n * const footerActions = [{\n * title: 'Primary action',\n * event: () => { ... }\n * }]\n * }\n * }\n */\n export default defineComponent({\n i18n: { messages },\n name: 'base-modal',\n });\n</script>\n\n<style lang=\"scss\" scoped src=\"./base-modal.scss\" />\n"],"names":["BentoModalVariant","BentoModalVariant2","BentoModalVariantMapping","BentoModalVariantMapping2","BentoModalSize","BentoModalSize2","BentoModalColumnLayoutVariant","BentoModalColumnLayoutVariant2","BentoModalRole","BentoModalRole2","BentoModalDialogType","BentoModalDialogType2","BentoModalEvent","BentoModalEvent2","MODAL_CONFIG_INJECTION_KEY","__default__$1","defineComponent","CLOSE_BUTTON_ICON_WIDTH","slots","useSlots","hasSlot","useHasSlot","page","ref","modalPageConditionalClasses","computed","props","modalContentConditionalClasses","_a","customPaddingStyles","xPadding","content","hasColumnLayout","size","computedColumnWidth","activePage","height","isAnimationActive","pageCustomPadding","showCloseButton","inject","isCurrentPage","pageElementObserver","watch","value","oldValue","nextTick","_b","observeSizeOfElement","pageHeight","onUnmounted","__default__","messages","LOADING_BTN_CLOSE_AFTER_SUCCESS_DELAY_TIME","t","useI18n","attrs","useAttrs","modal","isClosing","modalId","generateUid","computedAriaLabel","openModal","emitCloseEvent","emit","closeModalAfterAnimation","previousPages","startCloseModalAnimation","internalModalActionClose","event","closeModalOnClickOutside","target","modalConditionalClasses","newIsOpen","newModalValue","oldModalValue","onMounted","expose","provide","MODAL_DIALOG_ID_INJECTION_KEY","isOpen","toRefs","animation","BentoDialogPageAnimation","pages","updatePage","unregisterPage","pageIdToRemove","pageId","registerPage","DIALOG_PAGE_CONFIG_INJECTION_KEY","DIALOG_PAGE_REGISTER_PAGE_INJECTION_KEY"],"mappings":"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"}
@@ -1,7 +1,7 @@
1
1
  import { defineComponent as d, computed as s, toRef as u, provide as l, openBlock as c, createElementBlock as p, createElementVNode as m, createVNode as _, unref as n, createBlock as f, createCommentVNode as v } from "vue";
2
- import { M as b, B as y } from "./index.8b10ee32.js";
3
- import { B } from "./index.bab8811d.js";
4
- import { B as h } from "./button-actions.adc0a2fe.js";
2
+ import { M as b, B as y } from "./index.6bb6f38c.js";
3
+ import { B } from "./index.a001a0a8.js";
4
+ import { B as h } from "./button-actions.82163994.js";
5
5
  import { _ as A } from "./_plugin-vue_export-helper.dad06003.js";
6
6
  import "../assets/button-actions-with-menu.css";
7
7
  const N = { class: "b-button-actions-with-menu" }, E = {
@@ -104,4 +104,4 @@ const C = /* @__PURE__ */ A(M, [["__scopeId", "data-v-f58eba13"]]);
104
104
  export {
105
105
  C as B
106
106
  };
107
- //# sourceMappingURL=button-actions-with-menu.a007b034.js.map
107
+ //# sourceMappingURL=button-actions-with-menu.4f311411.js.map