@adyen/bento-vue3 1.35.1 → 1.36.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 (288) hide show
  1. package/dist/@types/packages/core/src/components/tag/tag.types.d.ts +14 -0
  2. package/dist/@types/packages/core/src/components/tooltip/tooltip.types.d.ts +11 -0
  3. package/dist/@types/packages/vue2/src/components/checkbox/checkbox.vue.d.ts +20 -184
  4. package/dist/@types/packages/vue2/src/components/checkbox/components/checkbox-group/checkbox-group.vue.d.ts +24 -188
  5. package/dist/@types/packages/vue2/src/components/data-grid/composables/use-calculate-column-width/use-calculate-column-width.d.ts +1 -0
  6. package/dist/@types/packages/vue2/src/components/data-grid/composables/use-calculate-column-width/use-calculate-column-width.types.d.ts +1 -0
  7. package/dist/@types/packages/vue2/src/components/date-picker/date-picker.vue.d.ts +1 -1
  8. package/dist/@types/packages/vue2/src/components/date-range-picker/date-range-picker.vue.d.ts +1 -1
  9. package/dist/@types/packages/vue2/src/components/filter-bar/components/all-filters-modal/all-filters-modal.vue.d.ts +32 -360
  10. package/dist/@types/packages/vue2/src/components/filter-bar/components/date-filter/date-filter.vue.d.ts +1 -1
  11. package/dist/@types/packages/vue2/src/components/filter-bar/components/date-range-filter/date-range-filter.vue.d.ts +1 -1
  12. package/dist/@types/packages/vue2/src/components/filter-bar/components/select-filter/variants/select-currency-filter/select-currency-filter.vue.d.ts +15 -179
  13. package/dist/@types/packages/vue2/src/components/filter-bar/components/select-filter/variants/select-tag-filter/select-tag-filter.vue.d.ts +15 -179
  14. package/dist/@types/packages/vue2/src/components/filter-bar/filter-bar.vue.d.ts +32 -360
  15. package/dist/@types/packages/vue2/src/components/internal/checkbox-input/checkbox-input.vue.d.ts +1 -1
  16. package/dist/@types/packages/vue2/src/components/internal/checkbox-input/index.d.ts +2 -2
  17. package/dist/@types/packages/vue2/src/components/internal/index.d.ts +1 -0
  18. package/dist/@types/packages/vue2/src/components/internal/listbox/components/listbox-multi-select/components/listbox-multi-select-options/components/listbox-multi-select-category/listbox-multi-select-category.vue.d.ts +20 -184
  19. package/dist/@types/packages/vue2/src/components/internal/listbox/components/listbox-multi-select/components/listbox-multi-select-options/listbox-multi-select-options.vue.d.ts +40 -368
  20. package/dist/@types/packages/vue2/src/components/internal/listbox/components/listbox-multi-select/listbox-multi-select.vue.d.ts +60 -552
  21. package/dist/@types/packages/vue2/src/components/internal/listbox/components/listbox-option-tag/listbox-option-tag.vue.d.ts +15 -179
  22. package/dist/@types/packages/vue2/src/components/internal/listbox/listbox.vue.d.ts +72 -564
  23. package/dist/@types/packages/vue2/src/components/internal/tooltip/index.d.ts +1 -0
  24. package/dist/@types/packages/vue2/src/components/{tooltip → internal/tooltip}/tooltip.vue.d.ts +67 -67
  25. package/dist/@types/packages/vue2/src/components/popper-container/popper-container.vue.d.ts +1 -1
  26. package/dist/@types/packages/vue2/src/components/radio-group/components/radio-button/radio-button.vue.d.ts +2 -2
  27. package/dist/@types/packages/vue2/src/components/summary-grid/components/summary-grid-item/summary-grid-item.vue.d.ts +15 -179
  28. package/dist/@types/packages/vue2/src/components/summary-grid/components/summary-grid-item-amount/summary-grid-item-amount.vue.d.ts +15 -179
  29. package/dist/@types/packages/vue2/src/components/summary-grid/components/summary-grid-item-custom/summary-grid-item-custom.vue.d.ts +15 -179
  30. package/dist/@types/packages/vue2/src/components/summary-grid/components/summary-grid-item-numeric/summary-grid-item-numeric.vue.d.ts +15 -179
  31. package/dist/@types/packages/vue2/src/components/summary-grid/components/summary-grid-item-percentage/summary-grid-item-percentage.vue.d.ts +15 -179
  32. package/dist/@types/packages/vue2/src/components/summary-grid/components/summary-grid-item-text/summary-grid-item-text.vue.d.ts +15 -179
  33. package/dist/@types/packages/vue2/src/components/tabs/components/tab.types.d.ts +1 -0
  34. package/dist/@types/packages/vue2/src/components/tabs/components/tab.vue.d.ts +15 -0
  35. package/dist/@types/packages/vue2/src/components/tabs/tabs.types.d.ts +1 -0
  36. package/dist/@types/packages/vue2/src/components/tag/tag.vue.d.ts +26 -219
  37. package/dist/@types/packages/vue2/src/components/timeline/components/timeline-item/timeline-item.vue.d.ts +17 -181
  38. package/dist/@types/packages/vue2/src/directives/tooltip/index.d.ts +1 -1
  39. package/dist/@types/packages/vue2/src/directives/tooltip/tooltip.types.d.ts +0 -11
  40. package/dist/accordion.js +1 -1
  41. package/dist/action-bar.js +1 -1
  42. package/dist/alert.js +1 -1
  43. package/dist/assets/accordion-item.css +1 -1
  44. package/dist/assets/action-bar.css +1 -1
  45. package/dist/assets/base-modal.css +1 -1
  46. package/dist/assets/button.css +1 -1
  47. package/dist/assets/card.css +1 -1
  48. package/dist/assets/checkbox-input.css +1 -1
  49. package/dist/assets/dashboard-section.css +1 -1
  50. package/dist/assets/data-grid.css +1 -1
  51. package/dist/assets/dialog-page.css +1 -1
  52. package/dist/assets/empty-state.css +1 -1
  53. package/dist/assets/error-message.css +1 -1
  54. package/dist/assets/info-icon.css +1 -1
  55. package/dist/assets/inspector.css +1 -1
  56. package/dist/assets/menu.css +1 -1
  57. package/dist/assets/modal-fullscreen.css +1 -1
  58. package/dist/assets/pagination.css +1 -1
  59. package/dist/assets/popover.css +1 -1
  60. package/dist/assets/popper-container.css +1 -1
  61. package/dist/assets/radio-input.css +1 -1
  62. package/dist/assets/sidepanel.css +1 -1
  63. package/dist/assets/tabs.css +1 -1
  64. package/dist/assets/tag.css +1 -1
  65. package/dist/assets/tooltip.css +1 -1
  66. package/dist/assets/typography.css +1 -1
  67. package/dist/assets/use-cached-selected-values.css +1 -1
  68. package/dist/avatar.js +1 -1
  69. package/dist/button.js +4 -4
  70. package/dist/card.js +1 -1
  71. package/dist/checkbox.js +3 -3
  72. package/dist/chunks/{accordion-item.C30QFxol.js → accordion-item.COc5nXh4.js} +2 -2
  73. package/dist/chunks/{accordion-item.C30QFxol.js.map → accordion-item.COc5nXh4.js.map} +1 -1
  74. package/dist/chunks/{action-bar.5XBrXwYv.js → action-bar.CMuu-R_8.js} +6 -6
  75. package/dist/chunks/{action-bar.5XBrXwYv.js.map → action-bar.CMuu-R_8.js.map} +1 -1
  76. package/dist/chunks/{alert.BvSx_Bi7.js → alert.DZFWFceT.js} +3 -3
  77. package/dist/chunks/{alert.BvSx_Bi7.js.map → alert.DZFWFceT.js.map} +1 -1
  78. package/dist/chunks/{avatar.8erKxh8t.js → avatar.7gix8dxp.js} +2 -2
  79. package/dist/chunks/{avatar.8erKxh8t.js.map → avatar.7gix8dxp.js.map} +1 -1
  80. package/dist/chunks/{base-button.BxUrydaP.js → base-button.cDr-F6j_.js} +2 -2
  81. package/dist/chunks/{base-button.BxUrydaP.js.map → base-button.cDr-F6j_.js.map} +1 -1
  82. package/dist/chunks/{base-modal.BenvK-Np.js → base-modal.DS7zI1O2.js} +5 -5
  83. package/dist/chunks/{base-modal.BenvK-Np.js.map → base-modal.DS7zI1O2.js.map} +1 -1
  84. package/dist/chunks/{button-actions-with-menu.CHOjMHpd.js → button-actions-with-menu.B9E4lUQV.js} +4 -4
  85. package/dist/chunks/{button-actions-with-menu.CHOjMHpd.js.map → button-actions-with-menu.B9E4lUQV.js.map} +1 -1
  86. package/dist/chunks/{button-actions.DyI_dSvx.js → button-actions.DOvd7VLB.js} +3 -3
  87. package/dist/chunks/{button-actions.DyI_dSvx.js.map → button-actions.DOvd7VLB.js.map} +1 -1
  88. package/dist/chunks/{button.Br6CyG40.js → button.DInQYAND.js} +3 -3
  89. package/dist/chunks/{button.Br6CyG40.js.map → button.DInQYAND.js.map} +1 -1
  90. package/dist/chunks/{calendar.DzYaxc0M.js → calendar.BHy-Sfgc.js} +8 -7
  91. package/dist/chunks/{calendar.DzYaxc0M.js.map → calendar.BHy-Sfgc.js.map} +1 -1
  92. package/dist/chunks/{card.Bt8jcp9I.js → card.Bh7vfIw8.js} +3 -3
  93. package/dist/chunks/{card.Bt8jcp9I.js.map → card.Bh7vfIw8.js.map} +1 -1
  94. package/dist/chunks/{checkbox-group.B0wngKi6.js → checkbox-group.COoDP0ua.js} +5 -5
  95. package/dist/chunks/{checkbox-group.B0wngKi6.js.map → checkbox-group.COoDP0ua.js.map} +1 -1
  96. package/dist/chunks/{checkbox-input.JdcvpfTa.js → checkbox-input.B24-74ay.js} +20 -18
  97. package/dist/chunks/checkbox-input.B24-74ay.js.map +1 -0
  98. package/dist/chunks/{checkbox.Bk_jmkGe.js → checkbox.Dkxm-fWK.js} +5 -5
  99. package/dist/chunks/{checkbox.Bk_jmkGe.js.map → checkbox.Dkxm-fWK.js.map} +1 -1
  100. package/dist/chunks/{code-snippet.1SigVnjS.js → code-snippet.BWbbS2ye.js} +10 -9
  101. package/dist/chunks/{code-snippet.1SigVnjS.js.map → code-snippet.BWbbS2ye.js.map} +1 -1
  102. package/dist/chunks/{controls-group.COc0kArc.js → controls-group.D4XrqgW3.js} +3 -3
  103. package/dist/chunks/{controls-group.COc0kArc.js.map → controls-group.D4XrqgW3.js.map} +1 -1
  104. package/dist/chunks/{copy.1-HH1fz5.js → copy.BvQ6igYf.js} +13 -12
  105. package/dist/chunks/{copy.1-HH1fz5.js.map → copy.BvQ6igYf.js.map} +1 -1
  106. package/dist/chunks/{country.CVI-oSer.js → country.Dk5xsUic.js} +2 -2
  107. package/dist/chunks/{country.CVI-oSer.js.map → country.Dk5xsUic.js.map} +1 -1
  108. package/dist/chunks/{currency.BdtY-UIM.js → currency.CFIi9B9m.js} +2 -2
  109. package/dist/chunks/{currency.BdtY-UIM.js.map → currency.CFIi9B9m.js.map} +1 -1
  110. package/dist/chunks/{dashboard-section.BOrGKdY9.js → dashboard-section.BlsQTA_5.js} +3 -3
  111. package/dist/chunks/{dashboard-section.BOrGKdY9.js.map → dashboard-section.BlsQTA_5.js.map} +1 -1
  112. package/dist/chunks/{dashed-underline.BO4BuqUM.js → dashed-underline.C3AuURaR.js} +23 -22
  113. package/dist/chunks/{dashed-underline.BO4BuqUM.js.map → dashed-underline.C3AuURaR.js.map} +1 -1
  114. package/dist/chunks/{data-grid-template.O946JKTa.js → data-grid-template.rvLUWZnh.js} +3 -3
  115. package/dist/chunks/{data-grid-template.O946JKTa.js.map → data-grid-template.rvLUWZnh.js.map} +1 -1
  116. package/dist/chunks/{data-grid.Bv5TA_zR.js → data-grid.DWCGBlAE.js} +756 -754
  117. package/dist/chunks/data-grid.DWCGBlAE.js.map +1 -0
  118. package/dist/chunks/{date-picker.DvEPEMIM.js → date-picker.BJmupHBt.js} +10 -9
  119. package/dist/chunks/{date-picker.DvEPEMIM.js.map → date-picker.BJmupHBt.js.map} +1 -1
  120. package/dist/chunks/{date-range-picker.BLVlkkG_.js → date-range-picker.D5z8fqcu.js} +13 -12
  121. package/dist/chunks/{date-range-picker.BLVlkkG_.js.map → date-range-picker.D5z8fqcu.js.map} +1 -1
  122. package/dist/chunks/{date.CYUV4seY.js → date.BkeczstG.js} +2 -2
  123. package/dist/chunks/{date.CYUV4seY.js.map → date.BkeczstG.js.map} +1 -1
  124. package/dist/chunks/{dialog-page.DALFn9KR.js → dialog-page.4ArdFk2U.js} +2 -2
  125. package/dist/chunks/{dialog-page.DALFn9KR.js.map → dialog-page.4ArdFk2U.js.map} +1 -1
  126. package/dist/chunks/{dropdown-default-textbox.Bu4bpNGU.js → dropdown-default-textbox.CeVq45Qy.js} +3 -3
  127. package/dist/chunks/{dropdown-default-textbox.Bu4bpNGU.js.map → dropdown-default-textbox.CeVq45Qy.js.map} +1 -1
  128. package/dist/chunks/{dropdown-tag.bpKWbC_O.js → dropdown-tag.BOJ9WsnN.js} +6 -6
  129. package/dist/chunks/{dropdown-tag.bpKWbC_O.js.map → dropdown-tag.BOJ9WsnN.js.map} +1 -1
  130. package/dist/chunks/{dropdown.rFZp3hMb.js → dropdown.CPlvW43f.js} +18 -17
  131. package/dist/chunks/{dropdown.rFZp3hMb.js.map → dropdown.CPlvW43f.js.map} +1 -1
  132. package/dist/chunks/{empty-state.CyEWCcDk.js → empty-state.BmZVT8wF.js} +3 -3
  133. package/dist/chunks/{empty-state.CyEWCcDk.js.map → empty-state.BmZVT8wF.js.map} +1 -1
  134. package/dist/chunks/{error-message.DblYEZ7E.js → error-message.SLfGzDVf.js} +3 -3
  135. package/dist/chunks/{error-message.DblYEZ7E.js.map → error-message.SLfGzDVf.js.map} +1 -1
  136. package/dist/chunks/es6.BvpG4Oi6.js.map +1 -1
  137. package/dist/chunks/events.FNmSWp_P.js +52 -0
  138. package/dist/chunks/events.FNmSWp_P.js.map +1 -0
  139. package/dist/chunks/{filter-bar.IN7gqxsc.js → filter-bar.uZ7n8y_i.js} +23 -23
  140. package/dist/chunks/{filter-bar.IN7gqxsc.js.map → filter-bar.uZ7n8y_i.js.map} +1 -1
  141. package/dist/chunks/{fixed-scroller.DwYB1pqo.js → fixed-scroller.BYosMLGj.js} +2 -2
  142. package/dist/chunks/{fixed-scroller.DwYB1pqo.js.map → fixed-scroller.BYosMLGj.js.map} +1 -1
  143. package/dist/chunks/{footer-actions.CyoMN_ca.js → footer-actions.DrDUKwOY.js} +4 -4
  144. package/dist/chunks/{footer-actions.CyoMN_ca.js.map → footer-actions.DrDUKwOY.js.map} +1 -1
  145. package/dist/chunks/{form-layout-title.Bi_3du_6.js → form-layout-title.bE1xo1hK.js} +3 -3
  146. package/dist/chunks/{form-layout-title.Bi_3du_6.js.map → form-layout-title.bE1xo1hK.js.map} +1 -1
  147. package/dist/chunks/{header.Byd6jXl6.js → header.HQY-nc6l.js} +5 -5
  148. package/dist/chunks/{header.Byd6jXl6.js.map → header.HQY-nc6l.js.map} +1 -1
  149. package/dist/chunks/{info-icon.DIu8FeJC.js → info-icon.tGhr3-Zh.js} +12 -12
  150. package/dist/chunks/info-icon.tGhr3-Zh.js.map +1 -0
  151. package/dist/chunks/{input-field.CgS1AEGu.js → input-field.D8Pt05M3.js} +4 -4
  152. package/dist/chunks/{input-field.CgS1AEGu.js.map → input-field.D8Pt05M3.js.map} +1 -1
  153. package/dist/chunks/{inspector.types.xpv2J9pJ.js → inspector.types.eWf-6uBc.js} +3 -3
  154. package/dist/chunks/{inspector.types.xpv2J9pJ.js.map → inspector.types.eWf-6uBc.js.map} +1 -1
  155. package/dist/chunks/{keyboard-navigation.Clz1jOaA.js → keyboard-navigation.C3QMVRKY.js} +2 -2
  156. package/dist/chunks/{keyboard-navigation.Clz1jOaA.js.map → keyboard-navigation.C3QMVRKY.js.map} +1 -1
  157. package/dist/chunks/{link.2YS7haGc.js → link.CbotJFzC.js} +2 -2
  158. package/dist/chunks/{link.2YS7haGc.js.map → link.CbotJFzC.js.map} +1 -1
  159. package/dist/chunks/{listbox-option-tag.QqDEHMKB.js → listbox-option-tag.C8w0-82a.js} +3 -3
  160. package/dist/chunks/{listbox-option-tag.QqDEHMKB.js.map → listbox-option-tag.C8w0-82a.js.map} +1 -1
  161. package/dist/chunks/{loading-button.Bntgn6Lk.js → loading-button.BzCt6ZT0.js} +2 -2
  162. package/dist/chunks/{loading-button.Bntgn6Lk.js.map → loading-button.BzCt6ZT0.js.map} +1 -1
  163. package/dist/chunks/{menu.BN5WGXw3.js → menu.bwVdUNQc.js} +5 -5
  164. package/dist/chunks/{menu.BN5WGXw3.js.map → menu.bwVdUNQc.js.map} +1 -1
  165. package/dist/chunks/{modal-fullscreen.zljoH4pr.js → modal-fullscreen.Bn25snRZ.js} +5 -5
  166. package/dist/chunks/{modal-fullscreen.zljoH4pr.js.map → modal-fullscreen.Bn25snRZ.js.map} +1 -1
  167. package/dist/chunks/{modal.vue_vue_type_script_setup_true_lang.tT8umwqG.js → modal.vue_vue_type_script_setup_true_lang.BZ-e4djX.js} +6 -6
  168. package/dist/chunks/{modal.vue_vue_type_script_setup_true_lang.tT8umwqG.js.map → modal.vue_vue_type_script_setup_true_lang.BZ-e4djX.js.map} +1 -1
  169. package/dist/chunks/{pagination.BMn5ryDD.js → pagination.Cg6ycXwO.js} +4 -4
  170. package/dist/chunks/{pagination.BMn5ryDD.js.map → pagination.Cg6ycXwO.js.map} +1 -1
  171. package/dist/chunks/{payment-method.-3VYG5ud.js → payment-method.Dqby2asg.js} +2 -2
  172. package/dist/chunks/{payment-method.-3VYG5ud.js.map → payment-method.Dqby2asg.js.map} +1 -1
  173. package/dist/chunks/{popover.pDk6zsak.js → popover.C7aNk7Ct.js} +8 -7
  174. package/dist/chunks/{popover.pDk6zsak.js.map → popover.C7aNk7Ct.js.map} +1 -1
  175. package/dist/chunks/{popper-container.DFpaesDm.js → popper-container.Cyf6zCPq.js} +361 -365
  176. package/dist/chunks/popper-container.Cyf6zCPq.js.map +1 -0
  177. package/dist/chunks/popper-container.types.BCZMbVFD.js +9 -0
  178. package/dist/chunks/popper-container.types.BCZMbVFD.js.map +1 -0
  179. package/dist/chunks/{radio-group.DUtoFXmr.js → radio-group.D0khdiFK.js} +5 -5
  180. package/dist/chunks/{radio-group.DUtoFXmr.js.map → radio-group.D0khdiFK.js.map} +1 -1
  181. package/dist/chunks/{search-bar.poJCoGD-.js → search-bar.BaqIavRd.js} +2 -2
  182. package/dist/chunks/{search-bar.poJCoGD-.js.map → search-bar.BaqIavRd.js.map} +1 -1
  183. package/dist/chunks/{secondary-nav.Dyvd-YBg.js → secondary-nav.eioY-Ac9.js} +3 -3
  184. package/dist/chunks/{secondary-nav.Dyvd-YBg.js.map → secondary-nav.eioY-Ac9.js.map} +1 -1
  185. package/dist/chunks/{segmented-control.DbR5NYWR.js → segmented-control.CyyCTejh.js} +6 -5
  186. package/dist/chunks/{segmented-control.DbR5NYWR.js.map → segmented-control.CyyCTejh.js.map} +1 -1
  187. package/dist/chunks/{selection-card-group.CHBS81j6.js → selection-card-group.CJwWtHTD.js} +5 -5
  188. package/dist/chunks/{selection-card-group.CHBS81j6.js.map → selection-card-group.CJwWtHTD.js.map} +1 -1
  189. package/dist/chunks/{sidepanel.CuQCXV1E.js → sidepanel.BGS2yzn-.js} +5 -5
  190. package/dist/chunks/{sidepanel.CuQCXV1E.js.map → sidepanel.BGS2yzn-.js.map} +1 -1
  191. package/dist/chunks/{status.types.r9TfZmvE.js → status.types.DKEdSwK-.js} +2 -2
  192. package/dist/chunks/{status.types.r9TfZmvE.js.map → status.types.DKEdSwK-.js.map} +1 -1
  193. package/dist/chunks/{step.ClnCjesW.js → step.DQtYDLoP.js} +31 -30
  194. package/dist/chunks/{step.ClnCjesW.js.map → step.DQtYDLoP.js.map} +1 -1
  195. package/dist/chunks/{structured-list-item.1A2sjhP4.js → structured-list-item.Brk3yBPy.js} +11 -10
  196. package/dist/chunks/{structured-list-item.1A2sjhP4.js.map → structured-list-item.Brk3yBPy.js.map} +1 -1
  197. package/dist/chunks/{summary-grid-item-custom.CuvUVoQ8.js → summary-grid-item-custom.DnGuM9Cg.js} +5 -5
  198. package/dist/chunks/{summary-grid-item-custom.CuvUVoQ8.js.map → summary-grid-item-custom.DnGuM9Cg.js.map} +1 -1
  199. package/dist/chunks/tabs.DDfHxVuD.js +211 -0
  200. package/dist/chunks/tabs.DDfHxVuD.js.map +1 -0
  201. package/dist/chunks/tag.DuIxjlwJ.js +51 -0
  202. package/dist/chunks/tag.DuIxjlwJ.js.map +1 -0
  203. package/dist/chunks/{textarea.CHnvON8G.js → textarea.CV2qkkZR.js} +4 -4
  204. package/dist/chunks/{textarea.CHnvON8G.js.map → textarea.CV2qkkZR.js.map} +1 -1
  205. package/dist/chunks/{timeline-item.Dc_l5Xyy.js → timeline-item.Dqpw7bkB.js} +9 -9
  206. package/dist/chunks/{timeline-item.Dc_l5Xyy.js.map → timeline-item.Dqpw7bkB.js.map} +1 -1
  207. package/dist/chunks/{toast.CIVPmwmU.js → toast.PtFHVFT1.js} +4 -4
  208. package/dist/chunks/{toast.CIVPmwmU.js.map → toast.PtFHVFT1.js.map} +1 -1
  209. package/dist/chunks/{toggle-button.CBRd1v6x.js → toggle-button.YSRdRLSS.js} +2 -2
  210. package/dist/chunks/{toggle-button.CBRd1v6x.js.map → toggle-button.YSRdRLSS.js.map} +1 -1
  211. package/dist/chunks/{toggle.8t4flh_3.js → toggle.Bsu11Lof.js} +2 -2
  212. package/dist/chunks/{toggle.8t4flh_3.js.map → toggle.Bsu11Lof.js.map} +1 -1
  213. package/dist/chunks/{tooltip.DvsfWV0-.js → tooltip.CSa9ntbr.js} +49 -50
  214. package/dist/chunks/tooltip.CSa9ntbr.js.map +1 -0
  215. package/dist/chunks/{tutorial.vue_vue_type_script_setup_true_lang.DdLmYCOe.js → tutorial.vue_vue_type_script_setup_true_lang.Cx4a7RcE.js} +9 -8
  216. package/dist/chunks/{tutorial.vue_vue_type_script_setup_true_lang.DdLmYCOe.js.map → tutorial.vue_vue_type_script_setup_true_lang.Cx4a7RcE.js.map} +1 -1
  217. package/dist/chunks/{typography.z9P0Ec3Q.js → typography.CE5PgxFf.js} +4 -4
  218. package/dist/chunks/{typography.z9P0Ec3Q.js.map → typography.CE5PgxFf.js.map} +1 -1
  219. package/dist/chunks/{use-bento-toast-controller.BDYlxAYq.js → use-bento-toast-controller.6iG-fzM1.js} +2 -2
  220. package/dist/chunks/{use-bento-toast-controller.BDYlxAYq.js.map → use-bento-toast-controller.6iG-fzM1.js.map} +1 -1
  221. package/dist/chunks/{use-cached-selected-values.CS3gHOyI.js → use-cached-selected-values.BVxiRn6R.js} +12 -11
  222. package/dist/chunks/{use-cached-selected-values.CS3gHOyI.js.map → use-cached-selected-values.BVxiRn6R.js.map} +1 -1
  223. package/dist/code-snippet.js +1 -1
  224. package/dist/country.js +1 -1
  225. package/dist/currency.js +1 -1
  226. package/dist/dashboard-template.js +1 -1
  227. package/dist/dashed-underline.js +1 -1
  228. package/dist/data-grid-template.js +1 -1
  229. package/dist/data-grid.js +1 -1
  230. package/dist/date-picker.js +2 -2
  231. package/dist/date-range-picker.js +2 -2
  232. package/dist/date.js +1 -1
  233. package/dist/dropdown.js +4 -4
  234. package/dist/empty-state.js +1 -1
  235. package/dist/filter-bar.js +1 -1
  236. package/dist/form-layout.js +1 -1
  237. package/dist/header.js +1 -1
  238. package/dist/index.js +98 -97
  239. package/dist/index.js.map +1 -1
  240. package/dist/info-icon.js +1 -1
  241. package/dist/input-field.js +1 -1
  242. package/dist/inspector.js +1 -1
  243. package/dist/internal.js +21 -19
  244. package/dist/internal.js.map +1 -1
  245. package/dist/link.js +1 -1
  246. package/dist/menu.js +1 -1
  247. package/dist/modal-fullscreen.js +1 -1
  248. package/dist/modal.js +2 -2
  249. package/dist/pagination.js +1 -1
  250. package/dist/payment-method.js +1 -1
  251. package/dist/popover.js +1 -1
  252. package/dist/popper-container.js +5 -4
  253. package/dist/popper-container.js.map +1 -1
  254. package/dist/radio-group.js +1 -1
  255. package/dist/search-bar.js +2 -2
  256. package/dist/secondary-nav.js +1 -1
  257. package/dist/segmented-control.js +1 -1
  258. package/dist/selection-card.js +1 -1
  259. package/dist/sidepanel.js +1 -1
  260. package/dist/status.js +1 -1
  261. package/dist/stepper.js +1 -1
  262. package/dist/structured-list.js +1 -1
  263. package/dist/styles/bento.css +14 -2
  264. package/dist/styles/legacy.css +13 -1
  265. package/dist/styles/styleguide.css +14 -2
  266. package/dist/summary-grid.js +1 -1
  267. package/dist/tabs.js +1 -1
  268. package/dist/tag.js +1 -1
  269. package/dist/textarea.js +1 -1
  270. package/dist/timeline.js +1 -1
  271. package/dist/toast.js +1 -1
  272. package/dist/toggle.js +1 -1
  273. package/dist/tutorial.js +1 -1
  274. package/dist/typography.js +1 -1
  275. package/dist/web-types.json +1 -1
  276. package/package.json +2 -2
  277. package/dist/chunks/checkbox-input.JdcvpfTa.js.map +0 -1
  278. package/dist/chunks/data-grid.Bv5TA_zR.js.map +0 -1
  279. package/dist/chunks/events.CMzGybJJ.js +0 -47
  280. package/dist/chunks/events.CMzGybJJ.js.map +0 -1
  281. package/dist/chunks/info-icon.DIu8FeJC.js.map +0 -1
  282. package/dist/chunks/popper-container.DFpaesDm.js.map +0 -1
  283. package/dist/chunks/tabs.xY_6yqmE.js +0 -185
  284. package/dist/chunks/tabs.xY_6yqmE.js.map +0 -1
  285. package/dist/chunks/tag.RYw4OhWk.js +0 -75
  286. package/dist/chunks/tag.RYw4OhWk.js.map +0 -1
  287. package/dist/chunks/tooltip.DvsfWV0-.js.map +0 -1
  288. /package/dist/@types/packages/{vue2 → core}/src/components/internal/checkbox-input/checkbox-input.types.d.ts +0 -0
package/dist/assets/popover.css CHANGED
@@ -1 +1 @@
1
- .b-popover-dismiss-button[data-v-df01cfb8]{scrollbar-color:var(--b-color-background-quaternary) transparent;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;cursor:pointer}.b-popover-dismiss-button[data-v-df01cfb8],.b-popover-dismiss-button[data-v-df01cfb8]:before,.b-popover-dismiss-button[data-v-df01cfb8]:after{box-sizing:border-box}.b-popover-dismiss-button[data-v-df01cfb8] *,.b-popover-dismiss-button[data-v-df01cfb8] *:before,.b-popover-dismiss-button[data-v-df01cfb8] *:after{box-sizing:border-box}.b-popover-dismiss-button[data-v-df01cfb8] ::-webkit-scrollbar{height:14px;width:14px}.b-popover-dismiss-button[data-v-df01cfb8] ::-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-popover-dismiss-button--on-image[data-v-df01cfb8]{color:var(--b-popover-dismiss-button-on-image-icon-color)}.b-popover-dismiss-button--on-image[data-v-df01cfb8]:hover{color:var(--b-popover-dismiss-button-on-image-icon-hovered-color)}.b-popover-dismiss-button--on-image[data-v-df01cfb8]:active{color:var(--b-popover-dismiss-button-on-image-icon-active-color)}.b-popover[data-v-97e86b0a]{scrollbar-color:var(--b-color-background-quaternary) transparent;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background:var(--b-popover-background-color);border:var(--b-popover-border);border-radius:var(--b-popover-border-radius);box-shadow:var(--b-popover-box-shadow);overflow:hidden;width:100%;z-index:var(--b-popover-z-index)}.b-popover[data-v-97e86b0a],.b-popover[data-v-97e86b0a]:before,.b-popover[data-v-97e86b0a]:after{box-sizing:border-box}.b-popover[data-v-97e86b0a] *,.b-popover[data-v-97e86b0a] *:before,.b-popover[data-v-97e86b0a] *:after{box-sizing:border-box}.b-popover[data-v-97e86b0a] ::-webkit-scrollbar{height:14px;width:14px}.b-popover[data-v-97e86b0a] ::-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 (min-width: 376px){.b-popover[data-v-97e86b0a]{width:320px}}.b-popover[data-v-97e86b0a] .b-popover__arrow:before{color:transparent;display:none}.b-popover--fit-content[data-v-97e86b0a]{width:fit-content}.b-popover--overflow-visible[data-v-97e86b0a]{overflow:visible}.b-popover--overflow-visible .b-popover__footer[data-v-97e86b0a]{border-bottom-left-radius:var(--b-popover-border-radius);border-bottom-right-radius:var(--b-popover-border-radius)}.b-popover--small[data-v-97e86b0a]{width:200px}.b-popover--large[data-v-97e86b0a]{width:480px}.b-popover--with-divider .b-popover__footer[data-v-97e86b0a]{background-color:var(--b-popover-with-divider-footer-background-color);border-top:var(--b-popover-with-divider-footer-border-top);padding-top:var(--b-popover-with-divider-footer-padding-top)}.b-popover--with-divider .b-popover__content[data-v-97e86b0a]{padding:var(--b-popover-with-divider-content-padding)}.b-popover--without-space .b-popover__header[data-v-97e86b0a],.b-popover--without-space .b-popover__content[data-v-97e86b0a],.b-popover--without-space .b-popover__footer[data-v-97e86b0a]{padding:var(--b-popover-without-space-padding)}.b-popover__content[data-v-97e86b0a]{padding:var(--b-popover-content-padding)}.b-popover__content--with-title[data-v-97e86b0a]{padding:var(--b-popover-content-with-title-padding)}.b-popover__header[data-v-97e86b0a]{align-items:baseline;display:flex;justify-content:space-between;padding:var(--b-popover-header-padding)}.b-popover__header-title[data-v-97e86b0a]{align-items:center;column-gap:var(--b-popover-header-title-column-gap);display:flex}.b-popover__image[data-v-97e86b0a]{display:flex;overflow:hidden}.b-popover__image+.b-popover__header[data-v-97e86b0a]{padding:var(--b-popover-image-header-padding)}.b-popover__image-dismiss-button[data-v-97e86b0a]{position:absolute;right:var(--b-popover-image-dismiss-icon-right);top:var(--b-popover-image-dismiss-icon-top)}.b-popover__footer[data-v-97e86b0a]{padding:var(--b-popover-footer-padding)}.b-popover__animation-enter-active[data-popper-placement^=top][data-v-97e86b0a]{animation:fade-in-u8fxq1e-97e86b0a var(--b-popover-animation-duration) var(--b-animation-easing-linear),move-in-u8fxq1e-97e86b0a var(--b-popover-animation-duration) var(--b-animation-easing-enter)}@keyframes fade-in-u8fxq1e-97e86b0a{0%{opacity:0}to{opacity:1}}@keyframes move-in-u8fxq1e-97e86b0a{0%{top:8px}to{top:0}}.b-popover__animation-leave-active[data-popper-placement^=top][data-v-97e86b0a]{animation:fade-out-u8fxq3d-97e86b0a var(--b-popover-animation-duration) var(--b-animation-easing-linear),move-out-u8fxq3d-97e86b0a var(--b-popover-animation-duration) var(--b-animation-easing-exit)}@keyframes fade-out-u8fxq3d-97e86b0a{0%{opacity:1}to{opacity:0}}@keyframes move-out-u8fxq3d-97e86b0a{0%{top:0}to{top:8px}}.b-popover__animation-enter-active[data-popper-placement^=bottom][data-v-97e86b0a]{animation:fade-in-u8fxq4f-97e86b0a var(--b-popover-animation-duration) var(--b-animation-easing-linear),move-in-u8fxq4f-97e86b0a var(--b-popover-animation-duration) var(--b-animation-easing-enter)}@keyframes fade-in-u8fxq4f-97e86b0a{0%{opacity:0}to{opacity:1}}@keyframes move-in-u8fxq4f-97e86b0a{0%{top:-8px}to{top:0}}.b-popover__animation-leave-active[data-popper-placement^=bottom][data-v-97e86b0a]{animation:fade-out-u8fxq6a-97e86b0a var(--b-popover-animation-duration) var(--b-animation-easing-linear),move-out-u8fxq6a-97e86b0a var(--b-popover-animation-duration) var(--b-animation-easing-exit)}@keyframes fade-out-u8fxq6a-97e86b0a{0%{opacity:1}to{opacity:0}}@keyframes move-out-u8fxq6a-97e86b0a{0%{top:0}to{top:-8px}}.b-popover__animation-enter-active[data-popper-placement^=left][data-v-97e86b0a]{animation:fade-in-u8fxq8b-97e86b0a var(--b-popover-animation-duration) var(--b-animation-easing-linear),move-in-u8fxq8b-97e86b0a var(--b-popover-animation-duration) var(--b-animation-easing-enter)}@keyframes fade-in-u8fxq8b-97e86b0a{0%{opacity:0}to{opacity:1}}@keyframes move-in-u8fxq8b-97e86b0a{0%{left:8px}to{left:0}}.b-popover__animation-leave-active[data-popper-placement^=left][data-v-97e86b0a]{animation:fade-out-u8fxq92-97e86b0a var(--b-popover-animation-duration) var(--b-animation-easing-linear),move-out-u8fxq92-97e86b0a var(--b-popover-animation-duration) var(--b-animation-easing-exit)}@keyframes fade-out-u8fxq92-97e86b0a{0%{opacity:1}to{opacity:0}}@keyframes move-out-u8fxq92-97e86b0a{0%{left:0}to{left:8px}}.b-popover__animation-enter-active[data-popper-placement^=right][data-v-97e86b0a]{animation:fade-in-u8fxq93-97e86b0a var(--b-popover-animation-duration) var(--b-animation-easing-linear),move-in-u8fxq93-97e86b0a var(--b-popover-animation-duration) var(--b-animation-easing-enter)}@keyframes fade-in-u8fxq93-97e86b0a{0%{opacity:0}to{opacity:1}}@keyframes move-in-u8fxq93-97e86b0a{0%{left:-8px}to{left:0}}.b-popover__animation-leave-active[data-popper-placement^=right][data-v-97e86b0a]{animation:fade-out-u8fxq9r-97e86b0a var(--b-popover-animation-duration) var(--b-animation-easing-linear),move-out-u8fxq9r-97e86b0a var(--b-popover-animation-duration) var(--b-animation-easing-exit)}@keyframes fade-out-u8fxq9r-97e86b0a{0%{opacity:1}to{opacity:0}}@keyframes move-out-u8fxq9r-97e86b0a{0%{left:0}to{left:-8px}}
1
+ .b-popover-dismiss-button[data-v-df01cfb8]{scrollbar-color:var(--b-color-background-quaternary) transparent;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;cursor:pointer}.b-popover-dismiss-button[data-v-df01cfb8],.b-popover-dismiss-button[data-v-df01cfb8]:before,.b-popover-dismiss-button[data-v-df01cfb8]:after{box-sizing:border-box}.b-popover-dismiss-button[data-v-df01cfb8] *,.b-popover-dismiss-button[data-v-df01cfb8] *:before,.b-popover-dismiss-button[data-v-df01cfb8] *:after{box-sizing:border-box}.b-popover-dismiss-button[data-v-df01cfb8] ::-webkit-scrollbar{height:14px;width:14px}.b-popover-dismiss-button[data-v-df01cfb8] ::-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-popover-dismiss-button--on-image[data-v-df01cfb8]{color:var(--b-popover-dismiss-button-on-image-icon-color)}.b-popover-dismiss-button--on-image[data-v-df01cfb8]:hover{color:var(--b-popover-dismiss-button-on-image-icon-hovered-color)}.b-popover-dismiss-button--on-image[data-v-df01cfb8]:active{color:var(--b-popover-dismiss-button-on-image-icon-active-color)}.b-popover[data-v-97e86b0a]{scrollbar-color:var(--b-color-background-quaternary) transparent;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background:var(--b-popover-background-color);border:var(--b-popover-border);border-radius:var(--b-popover-border-radius);box-shadow:var(--b-popover-box-shadow);overflow:hidden;width:100%;z-index:var(--b-popover-z-index)}.b-popover[data-v-97e86b0a],.b-popover[data-v-97e86b0a]:before,.b-popover[data-v-97e86b0a]:after{box-sizing:border-box}.b-popover[data-v-97e86b0a] *,.b-popover[data-v-97e86b0a] *:before,.b-popover[data-v-97e86b0a] *:after{box-sizing:border-box}.b-popover[data-v-97e86b0a] ::-webkit-scrollbar{height:14px;width:14px}.b-popover[data-v-97e86b0a] ::-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 (min-width: 376px){.b-popover[data-v-97e86b0a]{width:320px}}.b-popover[data-v-97e86b0a] .b-popover__arrow:before{color:transparent;display:none}.b-popover--fit-content[data-v-97e86b0a]{width:fit-content}.b-popover--overflow-visible[data-v-97e86b0a]{overflow:visible}.b-popover--overflow-visible .b-popover__footer[data-v-97e86b0a]{border-bottom-left-radius:var(--b-popover-border-radius);border-bottom-right-radius:var(--b-popover-border-radius)}.b-popover--small[data-v-97e86b0a]{width:200px}.b-popover--large[data-v-97e86b0a]{width:480px}.b-popover--with-divider .b-popover__footer[data-v-97e86b0a]{background-color:var(--b-popover-with-divider-footer-background-color);border-top:var(--b-popover-with-divider-footer-border-top);padding-top:var(--b-popover-with-divider-footer-padding-top)}.b-popover--with-divider .b-popover__content[data-v-97e86b0a]{padding:var(--b-popover-with-divider-content-padding)}.b-popover--without-space .b-popover__header[data-v-97e86b0a],.b-popover--without-space .b-popover__content[data-v-97e86b0a],.b-popover--without-space .b-popover__footer[data-v-97e86b0a]{padding:var(--b-popover-without-space-padding)}.b-popover__content[data-v-97e86b0a]{padding:var(--b-popover-content-padding)}.b-popover__content--with-title[data-v-97e86b0a]{padding:var(--b-popover-content-with-title-padding)}.b-popover__header[data-v-97e86b0a]{align-items:baseline;display:flex;justify-content:space-between;padding:var(--b-popover-header-padding)}.b-popover__header-title[data-v-97e86b0a]{align-items:center;column-gap:var(--b-popover-header-title-column-gap);display:flex}.b-popover__image[data-v-97e86b0a]{display:flex;overflow:hidden}.b-popover__image+.b-popover__header[data-v-97e86b0a]{padding:var(--b-popover-image-header-padding)}.b-popover__image-dismiss-button[data-v-97e86b0a]{position:absolute;right:var(--b-popover-image-dismiss-icon-right);top:var(--b-popover-image-dismiss-icon-top)}.b-popover__footer[data-v-97e86b0a]{padding:var(--b-popover-footer-padding)}.b-popover__animation-enter-active[data-popper-placement^=top][data-v-97e86b0a]{animation:fade-in-ufsw4iz-97e86b0a var(--b-popover-animation-duration) var(--b-animation-easing-linear),move-in-ufsw4iz-97e86b0a var(--b-popover-animation-duration) var(--b-animation-easing-enter)}@keyframes fade-in-ufsw4iz-97e86b0a{0%{opacity:0}to{opacity:1}}@keyframes move-in-ufsw4iz-97e86b0a{0%{top:8px}to{top:0}}.b-popover__animation-leave-active[data-popper-placement^=top][data-v-97e86b0a]{animation:fade-out-ufsw4lq-97e86b0a var(--b-popover-animation-duration) var(--b-animation-easing-linear),move-out-ufsw4lq-97e86b0a var(--b-popover-animation-duration) var(--b-animation-easing-exit)}@keyframes fade-out-ufsw4lq-97e86b0a{0%{opacity:1}to{opacity:0}}@keyframes move-out-ufsw4lq-97e86b0a{0%{top:0}to{top:8px}}.b-popover__animation-enter-active[data-popper-placement^=bottom][data-v-97e86b0a]{animation:fade-in-ufsw4m8-97e86b0a var(--b-popover-animation-duration) var(--b-animation-easing-linear),move-in-ufsw4m8-97e86b0a var(--b-popover-animation-duration) var(--b-animation-easing-enter)}@keyframes fade-in-ufsw4m8-97e86b0a{0%{opacity:0}to{opacity:1}}@keyframes move-in-ufsw4m8-97e86b0a{0%{top:-8px}to{top:0}}.b-popover__animation-leave-active[data-popper-placement^=bottom][data-v-97e86b0a]{animation:fade-out-ufsw4pd-97e86b0a var(--b-popover-animation-duration) var(--b-animation-easing-linear),move-out-ufsw4pd-97e86b0a var(--b-popover-animation-duration) var(--b-animation-easing-exit)}@keyframes fade-out-ufsw4pd-97e86b0a{0%{opacity:1}to{opacity:0}}@keyframes move-out-ufsw4pd-97e86b0a{0%{top:0}to{top:-8px}}.b-popover__animation-enter-active[data-popper-placement^=left][data-v-97e86b0a]{animation:fade-in-ufsw4rg-97e86b0a var(--b-popover-animation-duration) var(--b-animation-easing-linear),move-in-ufsw4rg-97e86b0a var(--b-popover-animation-duration) var(--b-animation-easing-enter)}@keyframes fade-in-ufsw4rg-97e86b0a{0%{opacity:0}to{opacity:1}}@keyframes move-in-ufsw4rg-97e86b0a{0%{left:8px}to{left:0}}.b-popover__animation-leave-active[data-popper-placement^=left][data-v-97e86b0a]{animation:fade-out-ufsw4sg-97e86b0a var(--b-popover-animation-duration) var(--b-animation-easing-linear),move-out-ufsw4sg-97e86b0a var(--b-popover-animation-duration) var(--b-animation-easing-exit)}@keyframes fade-out-ufsw4sg-97e86b0a{0%{opacity:1}to{opacity:0}}@keyframes move-out-ufsw4sg-97e86b0a{0%{left:0}to{left:8px}}.b-popover__animation-enter-active[data-popper-placement^=right][data-v-97e86b0a]{animation:fade-in-ufsw4sy-97e86b0a var(--b-popover-animation-duration) var(--b-animation-easing-linear),move-in-ufsw4sy-97e86b0a var(--b-popover-animation-duration) var(--b-animation-easing-enter)}@keyframes fade-in-ufsw4sy-97e86b0a{0%{opacity:0}to{opacity:1}}@keyframes move-in-ufsw4sy-97e86b0a{0%{left:-8px}to{left:0}}.b-popover__animation-leave-active[data-popper-placement^=right][data-v-97e86b0a]{animation:fade-out-ufsw4t6-97e86b0a var(--b-popover-animation-duration) var(--b-animation-easing-linear),move-out-ufsw4t6-97e86b0a var(--b-popover-animation-duration) var(--b-animation-easing-exit)}@keyframes fade-out-ufsw4t6-97e86b0a{0%{opacity:1}to{opacity:0}}@keyframes move-out-ufsw4t6-97e86b0a{0%{left:0}to{left:-8px}}
package/dist/assets/popper-container.css CHANGED
@@ -1 +1 @@
1
- .b-popper-container[data-v-dc16b8e6]{scrollbar-color:var(--b-color-background-quaternary) transparent;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;z-index:var(--b-popper-z-index)}.b-popper-container[data-v-dc16b8e6],.b-popper-container[data-v-dc16b8e6]:before,.b-popper-container[data-v-dc16b8e6]:after{box-sizing:border-box}.b-popper-container[data-v-dc16b8e6] *,.b-popper-container[data-v-dc16b8e6] *:before,.b-popper-container[data-v-dc16b8e6] *:after{box-sizing:border-box}.b-popper-container[data-v-dc16b8e6] ::-webkit-scrollbar{height:14px;width:14px}.b-popper-container[data-v-dc16b8e6] ::-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-popper-container__arrow[data-v-dc16b8e6]{background-color:inherit;display:none;height:5.66px;position:absolute;transform:rotate(45deg) scale(1);transition:transform .2s;width:5.66px}.b-popper-container__arrow[data-hide][data-v-dc16b8e6]{transform:scale(.1)}[data-popper-placement^=top]>.b-popper-container__arrow[data-v-dc16b8e6]{border-bottom-right-radius:2px;bottom:-3px}[data-popper-placement^=bottom]>.b-popper-container__arrow[data-v-dc16b8e6]{border-top-left-radius:2px;top:-3px}[data-popper-placement^=left]>.b-popper-container__arrow[data-v-dc16b8e6]{border-top-right-radius:2px;right:-3px}[data-popper-placement^=right]>.b-popper-container__arrow[data-v-dc16b8e6]{border-bottom-left-radius:2px;left:-3px}
1
+ [data-v-dc16b8e6]:host{display:inherit}.b-popper-container[data-v-dc16b8e6]{scrollbar-color:var(--b-color-background-quaternary) transparent;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;z-index:var(--b-popper-z-index)}.b-popper-container[data-v-dc16b8e6],.b-popper-container[data-v-dc16b8e6]:before,.b-popper-container[data-v-dc16b8e6]:after{box-sizing:border-box}.b-popper-container[data-v-dc16b8e6] *,.b-popper-container[data-v-dc16b8e6] *:before,.b-popper-container[data-v-dc16b8e6] *:after{box-sizing:border-box}.b-popper-container[data-v-dc16b8e6] ::-webkit-scrollbar{height:14px;width:14px}.b-popper-container[data-v-dc16b8e6] ::-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-popper-container__arrow[data-v-dc16b8e6]{background-color:var(--popper-arrow-color, inherit);display:none;height:5.66px;position:absolute;transform:rotate(45deg) scale(1);transition:transform .2s;width:5.66px}.b-popper-container__arrow--visible[data-v-dc16b8e6]{display:block}.b-popper-container__arrow[data-hide][data-v-dc16b8e6]{transform:scale(.1)}[data-popper-placement^=top]>.b-popper-container__arrow[data-v-dc16b8e6]{border-bottom-right-radius:2px;bottom:-3px}[data-popper-placement^=bottom]>.b-popper-container__arrow[data-v-dc16b8e6]{border-top-left-radius:2px;top:-3px}[data-popper-placement^=left]>.b-popper-container__arrow[data-v-dc16b8e6]{border-top-right-radius:2px;right:-3px}[data-popper-placement^=right]>.b-popper-container__arrow[data-v-dc16b8e6]{border-bottom-left-radius:2px;left:-3px}
package/dist/assets/radio-input.css CHANGED
@@ -1 +1 @@
1
- .b-radio-input[data-v-fc23bfb2]{scrollbar-color:var(--b-color-background-quaternary) transparent;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;-webkit-appearance:none;-moz-appearance:none;appearance:none;background-color:var(--b-radio-input-unchecked-background-color);border:var(--b-radio-input-unchecked-border);border-radius:var(--b-radio-input-border-radius);cursor:pointer;display:inline-block;height:16px;margin:0;min-height:16px;min-width:16px;outline:none;position:relative;top:var(--b-radio-input-offset-top);width:16px}.b-radio-input[data-v-fc23bfb2],.b-radio-input[data-v-fc23bfb2]:before,.b-radio-input[data-v-fc23bfb2]:after{box-sizing:border-box}.b-radio-input[data-v-fc23bfb2] *,.b-radio-input[data-v-fc23bfb2] *:before,.b-radio-input[data-v-fc23bfb2] *:after{box-sizing:border-box}.b-radio-input[data-v-fc23bfb2] ::-webkit-scrollbar{height:14px;width:14px}.b-radio-input[data-v-fc23bfb2] ::-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-radio-input input[data-v-fc23bfb2]:disabled{cursor:inherit}.b-radio-input[data-v-fc23bfb2]:after{content:"";display:block;inset:calc(var(--b-radio-input-space-around-increase) * -1);position:absolute}.b-radio-input[data-v-fc23bfb2]:before{background-color:var(--b-radio-input-knob-color);border-radius:var(--b-radio-input-border-radius);content:"";display:block;height:var(--b-radio-input-knob-size);left:var(--b-radio-input-knob-offset);opacity:0;position:absolute;top:var(--b-radio-input-knob-offset);transform:scale(0);transition:var(--b-radio-input-knob-transition);width:var(--b-radio-input-knob-size)}.b-radio-input[data-v-fc23bfb2]:hover:enabled{background-color:var(--b-radio-input-unchecked-hover-background-color);border-color:var(--b-radio-input-unchecked-hover-border-color)}.b-radio-input[data-v-fc23bfb2]:active{background-color:var(--b-radio-input-unchecked-active-background-color)}.b-radio-input[data-v-fc23bfb2]:focus-visible{animation:outer-ring-default-fc23bfb2 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-fc23bfb2{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-radio-input[data-v-fc23bfb2]:disabled{background-color:var(--b-radio-input-unchecked-disabled-background-color);border-color:var(--b-radio-input-unchecked-disabled-border-color);cursor:not-allowed}.b-radio-input[data-v-fc23bfb2]:disabled:before{background-color:var(--b-radio-input-knob-disabled-color)}.b-radio-input[data-v-fc23bfb2]:checked{background-color:var(--b-radio-input-checked-background-color);border-color:var(--b-radio-input-checked-border-color)}.b-radio-input[data-v-fc23bfb2]:checked:before{opacity:1;transform:scale(1)}.b-radio-input[data-v-fc23bfb2]:checked:disabled{background-color:var(--b-radio-input-checked-disabled-background-color);border-color:var(--b-radio-input-checked-disabled-border-color)}.b-radio-input[data-v-fc23bfb2]:checked:active:not(:disabled){background-color:var(--b-radio-input-checked-active-background-color);border-color:var(--b-radio-input-checked-active-border-color)}.b-radio-input[data-v-fc23bfb2]:checked:hover:not(:disabled){background-color:var(--b-radio-input-checked-hover-background-color);border-color:var(--b-radio-input-checked-hover-border-color)}.b-radio-input--disabled[data-v-fc23bfb2]{cursor:not-allowed}.b-radio-input--error[data-v-fc23bfb2]{border:var(--b-radio-input-unchecked-error-border)}.b-radio-input--error[data-v-fc23bfb2]:before{left:var(--b-radio-input-knob-offset-error);top:var(--b-radio-input-knob-offset-error)}.b-radio-input--error[data-v-fc23bfb2]:checked{background-color:var(--b-radio-input-checked-error-background-color);border-color:var(--b-radio-input-checked-error-border-color)}.b-radio-input--readonly[data-v-fc23bfb2]{background-color:var(--b-radio-input-unchecked-readonly-background-color);border-color:var(--b-radio-input-unchecked-readonly-border-color);pointer-events:none}.b-radio-input--readonly[data-v-fc23bfb2]:before{background-color:var(--b-radio-input-knob-readonly-color)}.b-radio-input--readonly[data-v-fc23bfb2]:checked{background-color:var(--b-radio-input-checked-readonly-background-color);border-color:var(--b-radio-input-checked-readonly-border-color)}
1
+ [data-v-fc23bfb2]:host{display:inline-block}.b-radio-input[data-v-fc23bfb2]{scrollbar-color:var(--b-color-background-quaternary) transparent;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;-webkit-appearance:none;-moz-appearance:none;appearance:none;background-color:var(--b-radio-input-unchecked-background-color);border:var(--b-radio-input-unchecked-border);border-radius:var(--b-radio-input-border-radius);cursor:pointer;display:inline-block;height:16px;margin:0;min-height:16px;min-width:16px;outline:none;position:relative;top:var(--b-radio-input-offset-top);width:16px}.b-radio-input[data-v-fc23bfb2],.b-radio-input[data-v-fc23bfb2]:before,.b-radio-input[data-v-fc23bfb2]:after{box-sizing:border-box}.b-radio-input[data-v-fc23bfb2] *,.b-radio-input[data-v-fc23bfb2] *:before,.b-radio-input[data-v-fc23bfb2] *:after{box-sizing:border-box}.b-radio-input[data-v-fc23bfb2] ::-webkit-scrollbar{height:14px;width:14px}.b-radio-input[data-v-fc23bfb2] ::-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-radio-input input[data-v-fc23bfb2]:disabled{cursor:inherit}.b-radio-input[data-v-fc23bfb2]:after{content:"";display:block;inset:calc(var(--b-radio-input-space-around-increase) * -1);position:absolute}.b-radio-input[data-v-fc23bfb2]:before{background-color:var(--b-radio-input-knob-color);border-radius:var(--b-radio-input-border-radius);content:"";display:block;height:var(--b-radio-input-knob-size);left:var(--b-radio-input-knob-offset);opacity:0;position:absolute;top:var(--b-radio-input-knob-offset);transform:scale(0);transition:var(--b-radio-input-knob-transition);width:var(--b-radio-input-knob-size)}.b-radio-input[data-v-fc23bfb2]:hover:enabled{background-color:var(--b-radio-input-unchecked-hover-background-color);border-color:var(--b-radio-input-unchecked-hover-border-color)}.b-radio-input[data-v-fc23bfb2]:active{background-color:var(--b-radio-input-unchecked-active-background-color)}.b-radio-input[data-v-fc23bfb2]:focus-visible{animation:outer-ring-default-fc23bfb2 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-fc23bfb2{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-radio-input[data-v-fc23bfb2]:disabled{background-color:var(--b-radio-input-unchecked-disabled-background-color);border-color:var(--b-radio-input-unchecked-disabled-border-color);cursor:not-allowed}.b-radio-input[data-v-fc23bfb2]:disabled:before{background-color:var(--b-radio-input-knob-disabled-color)}.b-radio-input[data-v-fc23bfb2]:checked{background-color:var(--b-radio-input-checked-background-color);border-color:var(--b-radio-input-checked-border-color)}.b-radio-input[data-v-fc23bfb2]:checked:before{opacity:1;transform:scale(1)}.b-radio-input[data-v-fc23bfb2]:checked:disabled{background-color:var(--b-radio-input-checked-disabled-background-color);border-color:var(--b-radio-input-checked-disabled-border-color)}.b-radio-input[data-v-fc23bfb2]:checked:active:not(:disabled){background-color:var(--b-radio-input-checked-active-background-color);border-color:var(--b-radio-input-checked-active-border-color)}.b-radio-input[data-v-fc23bfb2]:checked:hover:not(:disabled){background-color:var(--b-radio-input-checked-hover-background-color);border-color:var(--b-radio-input-checked-hover-border-color)}.b-radio-input--disabled[data-v-fc23bfb2]{cursor:not-allowed}.b-radio-input--error[data-v-fc23bfb2]{border:var(--b-radio-input-unchecked-error-border)}.b-radio-input--error[data-v-fc23bfb2]:before{left:var(--b-radio-input-knob-offset-error);top:var(--b-radio-input-knob-offset-error)}.b-radio-input--error[data-v-fc23bfb2]:checked{background-color:var(--b-radio-input-checked-error-background-color);border-color:var(--b-radio-input-checked-error-border-color)}.b-radio-input--readonly[data-v-fc23bfb2]{background-color:var(--b-radio-input-unchecked-readonly-background-color);border-color:var(--b-radio-input-unchecked-readonly-border-color);pointer-events:none}.b-radio-input--readonly[data-v-fc23bfb2]:before{background-color:var(--b-radio-input-knob-readonly-color)}.b-radio-input--readonly[data-v-fc23bfb2]:checked{background-color:var(--b-radio-input-checked-readonly-background-color);border-color:var(--b-radio-input-checked-readonly-border-color)}
package/dist/assets/sidepanel.css CHANGED
@@ -1 +1 @@
1
- .b-sidepanel-page[data-v-b0fa716c]{scrollbar-color:var(--b-color-background-quaternary) transparent;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;display:flex;flex-direction:column;height:100%;position:absolute;width:100%}.b-sidepanel-page[data-v-b0fa716c],.b-sidepanel-page[data-v-b0fa716c]:before,.b-sidepanel-page[data-v-b0fa716c]:after{box-sizing:border-box}.b-sidepanel-page[data-v-b0fa716c] *,.b-sidepanel-page[data-v-b0fa716c] *:before,.b-sidepanel-page[data-v-b0fa716c] *:after{box-sizing:border-box}.b-sidepanel-page[data-v-b0fa716c] ::-webkit-scrollbar{height:14px;width:14px}.b-sidepanel-page[data-v-b0fa716c] ::-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-sidepanel-page__header[data-v-b0fa716c]{align-items:center;background-color:var(--b-sidepanel-page-header-background-color);border-top-left-radius:var(--b-sidepanel-border-radius);display:flex;overflow:hidden;padding:var(--b-sidepanel-page-header-padding);position:sticky;white-space:nowrap}.b-sidepanel-page__title[data-v-b0fa716c]{flex-grow:1;overflow:hidden;text-overflow:ellipsis}.b-sidepanel-page__content[data-v-b0fa716c]{flex-grow:1;overflow:overlay;padding:var(--b-sidepanel-page-content-padding)}.b-sidepanel-page__actions[data-v-b0fa716c]{background-color:var(--b-sidepanel-page-actions-background-color);border-bottom-left-radius:var(--b-sidepanel-border-radius);padding:var(--b-sidepanel-page-actions-padding)}.b-sidepanel[data-v-38b12c64]{scrollbar-color:var(--b-color-background-quaternary) transparent;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background-color:var(--b-sidepanel-background-color);border:0;height:100%;max-height:100%;max-width:100%;overflow:visible;padding:0;width:100%}.b-sidepanel[data-v-38b12c64],.b-sidepanel[data-v-38b12c64]:before,.b-sidepanel[data-v-38b12c64]:after{box-sizing:border-box}.b-sidepanel[data-v-38b12c64] *,.b-sidepanel[data-v-38b12c64] *:before,.b-sidepanel[data-v-38b12c64] *:after{box-sizing:border-box}.b-sidepanel[data-v-38b12c64] ::-webkit-scrollbar{height:14px;width:14px}.b-sidepanel[data-v-38b12c64] ::-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 (min-width: 500px){.b-sidepanel[data-v-38b12c64]{border-radius:var(--b-sidepanel-border-radius) 0 0 var(--b-sidepanel-border-radius);margin:0 0 0 auto;width:var(--b-sidepanel-width)}}.b-sidepanel__close-button[data-v-38b12c64]{align-items:center;display:flex;height:var(--b-sidepanel-close-button-height);position:absolute;right:var(--b-sidepanel-close-button-right);z-index:var(--b-sidepanel-close-button-z-index)}.b-sidepanel--animation[data-v-38b12c64]{overflow:hidden}.b-sidepanel[data-v-38b12c64]::backdrop{background-color:var(--b-sidepanel-backdrop-background-color, #00112c);opacity:.5}.b-legacy-theme .b-sidepanel[data-v-38b12c64]::backdrop{opacity:.4}.b-sidepanel[open][data-v-38b12c64]{animation:enter-u8fxpwp-38b12c64 var(--b-sidepanel-animation-duration, .25s) var(--b-animation-easing-enter)}@keyframes enter-u8fxpwp-38b12c64{0%{translate:100% 0}to{translate:0 0}}.b-sidepanel[open][data-v-38b12c64]::backdrop{animation:fade-in-u8fxpxk-38b12c64 var(--b-sidepanel-animation-duration, .25s) var(--b-animation-easing-linear)}@keyframes fade-in-u8fxpxk-38b12c64{0%{opacity:0}to{opacity:.5}}.b-sidepanel--hide[open][data-v-38b12c64]{animation:exit-u8fxpyt-38b12c64 var(--b-sidepanel-animation-duration, .25s) var(--b-animation-easing-exit)}@keyframes exit-u8fxpyt-38b12c64{0%{translate:0 0}to{translate:100% 0}}.b-sidepanel--hide[open][data-v-38b12c64]::backdrop{animation:fade-out-u8fxq24-38b12c64 var(--b-sidepanel-animation-duration, .25s) var(--b-animation-easing-linear)}@keyframes fade-out-u8fxq24-38b12c64{0%{opacity:.5}to{opacity:0}}
1
+ .b-sidepanel-page[data-v-b0fa716c]{scrollbar-color:var(--b-color-background-quaternary) transparent;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;display:flex;flex-direction:column;height:100%;position:absolute;width:100%}.b-sidepanel-page[data-v-b0fa716c],.b-sidepanel-page[data-v-b0fa716c]:before,.b-sidepanel-page[data-v-b0fa716c]:after{box-sizing:border-box}.b-sidepanel-page[data-v-b0fa716c] *,.b-sidepanel-page[data-v-b0fa716c] *:before,.b-sidepanel-page[data-v-b0fa716c] *:after{box-sizing:border-box}.b-sidepanel-page[data-v-b0fa716c] ::-webkit-scrollbar{height:14px;width:14px}.b-sidepanel-page[data-v-b0fa716c] ::-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-sidepanel-page__header[data-v-b0fa716c]{align-items:center;background-color:var(--b-sidepanel-page-header-background-color);border-top-left-radius:var(--b-sidepanel-border-radius);display:flex;overflow:hidden;padding:var(--b-sidepanel-page-header-padding);position:sticky;white-space:nowrap}.b-sidepanel-page__title[data-v-b0fa716c]{flex-grow:1;overflow:hidden;text-overflow:ellipsis}.b-sidepanel-page__content[data-v-b0fa716c]{flex-grow:1;overflow:overlay;padding:var(--b-sidepanel-page-content-padding)}.b-sidepanel-page__actions[data-v-b0fa716c]{background-color:var(--b-sidepanel-page-actions-background-color);border-bottom-left-radius:var(--b-sidepanel-border-radius);padding:var(--b-sidepanel-page-actions-padding)}.b-sidepanel[data-v-38b12c64]{scrollbar-color:var(--b-color-background-quaternary) transparent;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background-color:var(--b-sidepanel-background-color);border:0;height:100%;max-height:100%;max-width:100%;overflow:visible;padding:0;width:100%}.b-sidepanel[data-v-38b12c64],.b-sidepanel[data-v-38b12c64]:before,.b-sidepanel[data-v-38b12c64]:after{box-sizing:border-box}.b-sidepanel[data-v-38b12c64] *,.b-sidepanel[data-v-38b12c64] *:before,.b-sidepanel[data-v-38b12c64] *:after{box-sizing:border-box}.b-sidepanel[data-v-38b12c64] ::-webkit-scrollbar{height:14px;width:14px}.b-sidepanel[data-v-38b12c64] ::-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 (min-width: 500px){.b-sidepanel[data-v-38b12c64]{border-radius:var(--b-sidepanel-border-radius) 0 0 var(--b-sidepanel-border-radius);margin:0 0 0 auto;width:var(--b-sidepanel-width)}}.b-sidepanel__close-button[data-v-38b12c64]{align-items:center;display:flex;height:var(--b-sidepanel-close-button-height);position:absolute;right:var(--b-sidepanel-close-button-right);z-index:var(--b-sidepanel-close-button-z-index)}.b-sidepanel--animation[data-v-38b12c64]{overflow:hidden}.b-sidepanel[data-v-38b12c64]::backdrop{background-color:var(--b-sidepanel-backdrop-background-color, #00112c);opacity:.5}.b-legacy-theme .b-sidepanel[data-v-38b12c64]::backdrop{opacity:.4}.b-sidepanel[open][data-v-38b12c64]{animation:enter-ufsw4fg-38b12c64 var(--b-sidepanel-animation-duration, .25s) var(--b-animation-easing-enter)}@keyframes enter-ufsw4fg-38b12c64{0%{translate:100% 0}to{translate:0 0}}.b-sidepanel[open][data-v-38b12c64]::backdrop{animation:fade-in-ufsw4g0-38b12c64 var(--b-sidepanel-animation-duration, .25s) var(--b-animation-easing-linear)}@keyframes fade-in-ufsw4g0-38b12c64{0%{opacity:0}to{opacity:.5}}.b-sidepanel--hide[open][data-v-38b12c64]{animation:exit-ufsw4he-38b12c64 var(--b-sidepanel-animation-duration, .25s) var(--b-animation-easing-exit)}@keyframes exit-ufsw4he-38b12c64{0%{translate:0 0}to{translate:100% 0}}.b-sidepanel--hide[open][data-v-38b12c64]::backdrop{animation:fade-out-ufsw4k6-38b12c64 var(--b-sidepanel-animation-duration, .25s) var(--b-animation-easing-linear)}@keyframes fade-out-ufsw4k6-38b12c64{0%{opacity:.5}to{opacity:0}}
package/dist/assets/tabs.css CHANGED
@@ -1 +1 @@
1
- .b-tab[data-v-5889fd13]{scrollbar-color:var(--b-color-background-quaternary) transparent;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.b-tab[data-v-5889fd13],.b-tab[data-v-5889fd13]:before,.b-tab[data-v-5889fd13]:after{box-sizing:border-box}.b-tab[data-v-5889fd13] *,.b-tab[data-v-5889fd13] *:before,.b-tab[data-v-5889fd13] *:after{box-sizing:border-box}.b-tab[data-v-5889fd13] ::-webkit-scrollbar{height:14px;width:14px}.b-tab[data-v-5889fd13] ::-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-tabs[data-v-1768d17c]{scrollbar-color:var(--b-color-background-quaternary) transparent;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background-color:var(--b-tabs-background-color)}.b-tabs[data-v-1768d17c],.b-tabs[data-v-1768d17c]:before,.b-tabs[data-v-1768d17c]:after{box-sizing:border-box}.b-tabs[data-v-1768d17c] *,.b-tabs[data-v-1768d17c] *:before,.b-tabs[data-v-1768d17c] *:after{box-sizing:border-box}.b-tabs[data-v-1768d17c] ::-webkit-scrollbar{height:14px;width:14px}.b-tabs[data-v-1768d17c] ::-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-tabs button[data-v-1768d17c]{background-color:transparent;border:0;font:inherit;text-align:inherit}.b-tabs button[data-v-1768d17c]:focus-visible{outline:none}.b-tabs__tab-list[data-v-1768d17c]{display:flex;gap:var(--b-tabs-tab-list-gap);height:var(--b-tabs-tab-list-height)}.b-tabs__tab[data-v-1768d17c]{align-items:center;cursor:pointer;display:flex;flex-direction:column;height:100%;justify-content:space-between;padding:0}.b-tabs__tab--disabled[data-v-1768d17c]>*{cursor:not-allowed}@media (hover: hover){.b-tabs__tab:not(.b-tabs__tab--disabled):hover .b-tabs__tab-title[data-v-1768d17c]{color:var(--b-tabs-tab-title-hover-color)}}.b-tabs__tab-text[data-v-1768d17c]{align-items:center;display:flex}.b-tabs__tab-title[data-v-1768d17c]{border-radius:var(--b-tabs-tab-title-border-radius);color:var(--b-tabs-tab-title-color);white-space:nowrap}.b-legacy-theme .b-tabs__tab-title[data-v-1768d17c]{font-size:15px;font-weight:400}.b-tabs__tab:focus-visible .b-tabs__tab-title[data-v-1768d17c]{animation:outer-ring-default-1768d17c 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-1768d17c{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-tabs__tab--disabled .b-tabs__tab-title[data-v-1768d17c]{color:var(--b-tabs-tab-title-disabled-color);cursor:not-allowed}.b-tabs__tab--active .b-tabs__tab-title[data-v-1768d17c]{color:var(--b-tabs-tab-title-active-color)}.b-tabs__tab-underline[data-v-1768d17c]{background-color:var(--b-tabs-tab-underline-color);display:block;width:var(--b-tabs-tab-underline-width)}.b-tabs__tab--active .b-tabs__tab-underline[data-v-1768d17c]{height:var(--b-tabs-tab-underline-height-active)}.b-tabs__tab-notification-dot[data-v-1768d17c]{background-color:var(--b-tabs-notification-dot-background-color);border-radius:50%;flex-shrink:0;height:var(--b-tabs-notification-dot-height);margin-left:var(--b-tabs-notification-dot-margin-left);width:var(--b-tabs-notification-dot-width)}
1
+ .b-tab[data-v-4993d338]{scrollbar-color:var(--b-color-background-quaternary) transparent;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.b-tab[data-v-4993d338],.b-tab[data-v-4993d338]:before,.b-tab[data-v-4993d338]:after{box-sizing:border-box}.b-tab[data-v-4993d338] *,.b-tab[data-v-4993d338] *:before,.b-tab[data-v-4993d338] *:after{box-sizing:border-box}.b-tab[data-v-4993d338] ::-webkit-scrollbar{height:14px;width:14px}.b-tab[data-v-4993d338] ::-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-tabs[data-v-1a413405]{scrollbar-color:var(--b-color-background-quaternary) transparent;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background-color:var(--b-tabs-background-color)}.b-tabs[data-v-1a413405],.b-tabs[data-v-1a413405]:before,.b-tabs[data-v-1a413405]:after{box-sizing:border-box}.b-tabs[data-v-1a413405] *,.b-tabs[data-v-1a413405] *:before,.b-tabs[data-v-1a413405] *:after{box-sizing:border-box}.b-tabs[data-v-1a413405] ::-webkit-scrollbar{height:14px;width:14px}.b-tabs[data-v-1a413405] ::-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-tabs button[data-v-1a413405]{background-color:transparent;border:0;font:inherit;text-align:inherit}.b-tabs button[data-v-1a413405]:focus-visible{outline:none}.b-tabs__tab-list[data-v-1a413405]{display:flex;gap:var(--b-tabs-tab-list-gap);height:var(--b-tabs-tab-list-height)}.b-tabs__tab[data-v-1a413405]{align-items:center;cursor:pointer;display:flex;flex-direction:column;height:100%;justify-content:space-between;padding:0}.b-tabs__tab--disabled[data-v-1a413405]>*{cursor:not-allowed}@media (hover: hover){.b-tabs__tab:not(.b-tabs__tab--disabled):hover .b-tabs__tab-title[data-v-1a413405]{color:var(--b-tabs-tab-title-hover-color)}.b-tabs__tab:not(.b-tabs__tab--disabled):hover .b-tabs__tab-counter[data-v-1a413405]{color:var(--b-tabs-counter-hover-color)}}.b-tabs__tab-text[data-v-1a413405]{align-items:center;border-radius:var(--b-tabs-tab-text-border-radius);display:flex;height:var(--b-tabs-tab-text-height)}.b-tabs__tab:focus-visible .b-tabs__tab-text[data-v-1a413405]{animation:outer-ring-default-1a413405 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-1a413405{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-tabs__tab-title[data-v-1a413405]{color:var(--b-tabs-tab-title-color);white-space:nowrap}.b-legacy-theme .b-tabs__tab-title[data-v-1a413405]{font-size:15px;font-weight:400}.b-tabs__tab--disabled .b-tabs__tab-title[data-v-1a413405]{color:var(--b-tabs-tab-title-disabled-color);cursor:not-allowed}.b-tabs__tab--active .b-tabs__tab-title[data-v-1a413405]{color:var(--b-tabs-tab-title-active-color)}.b-tabs__tab-underline[data-v-1a413405]{background-color:var(--b-tabs-tab-underline-color);display:block;width:var(--b-tabs-tab-underline-width)}.b-tabs__tab--active .b-tabs__tab-underline[data-v-1a413405]{height:var(--b-tabs-tab-underline-height-active)}.b-tabs__tab-counter[data-v-1a413405]{background-color:var(--b-tabs-counter-background-color);border-radius:var(--b-tabs-counter-border-radius);color:var(--b-tabs-counter-color);flex-shrink:0;margin-left:var(--b-tabs-counter-margin-left);padding:var(--b-tabs-counter-padding)}.b-tabs__tab-counter--active[data-v-1a413405]{color:var(--b-tabs-counter-active-color)}.b-tabs__tab--disabled .b-tabs__tab-counter[data-v-1a413405]{color:var(--b-tabs-counter-disabled-color);cursor:not-allowed}.b-tabs__tab-notification-dot[data-v-1a413405]{background-color:var(--b-tabs-notification-dot-background-color);border-radius:50%;flex-shrink:0;height:var(--b-tabs-notification-dot-height);margin-left:var(--b-tabs-notification-dot-margin-left);width:var(--b-tabs-notification-dot-width)}
package/dist/assets/tag.css CHANGED
@@ -1 +1 @@
1
- .b-tag[data-v-d4e287c9]{scrollbar-color:var(--b-color-background-quaternary) transparent;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;align-items:center;border-radius:4px;cursor:default;display:inline-flex;flex-direction:row;gap:6px;justify-content:center;padding:var(--b-tag-padding);width:fit-content}.b-tag[data-v-d4e287c9],.b-tag[data-v-d4e287c9]:before,.b-tag[data-v-d4e287c9]:after{box-sizing:border-box}.b-tag[data-v-d4e287c9] *,.b-tag[data-v-d4e287c9] *:before,.b-tag[data-v-d4e287c9] *:after{box-sizing:border-box}.b-tag[data-v-d4e287c9] ::-webkit-scrollbar{height:14px;width:14px}.b-tag[data-v-d4e287c9] ::-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-tag--grey[data-v-d4e287c9]{background-color:var(--b-tag-default-background-color)}.b-tag--grey .b-tag__label[data-v-d4e287c9]{color:var(--b-tag-default-color)}.b-tag--blue[data-v-d4e287c9]{background-color:var(--b-tag-blue-background-color)}.b-tag--blue .b-tag__label[data-v-d4e287c9]{color:var(--b-tag-blue-color)}.b-tag--green[data-v-d4e287c9]{background-color:var(--b-tag-green-background-color)}.b-tag--green .b-tag__label[data-v-d4e287c9]{color:var(--b-tag-green-color)}.b-tag--orange[data-v-d4e287c9]{background-color:var(--b-tag-orange-background-color)}.b-tag--orange .b-tag__label[data-v-d4e287c9]{color:var(--b-tag-orange-color)}.b-tag--red[data-v-d4e287c9]{background-color:var(--b-tag-red-background-color)}.b-tag--red .b-tag__label[data-v-d4e287c9]{color:var(--b-tag-red-color)}.b-tag--white[data-v-d4e287c9]{background-color:var(--b-tag-white-background-color)}.b-tag--white .b-tag__label[data-v-d4e287c9]{color:var(--b-tag-white-color)}
1
+ [data-v-8d491153]:host{display:inline-flex}.b-tag[data-v-8d491153]{scrollbar-color:var(--b-color-background-quaternary) transparent;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;align-items:center;border-radius:4px;cursor:default;display:inline-flex;flex-direction:row;gap:6px;justify-content:center;padding:var(--b-tag-padding);width:fit-content}.b-tag[data-v-8d491153],.b-tag[data-v-8d491153]:before,.b-tag[data-v-8d491153]:after{box-sizing:border-box}.b-tag[data-v-8d491153] *,.b-tag[data-v-8d491153] *:before,.b-tag[data-v-8d491153] *:after{box-sizing:border-box}.b-tag[data-v-8d491153] ::-webkit-scrollbar{height:14px;width:14px}.b-tag[data-v-8d491153] ::-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-tag--grey[data-v-8d491153]{background-color:var(--b-tag-default-background-color)}.b-tag--grey .b-tag__label[data-v-8d491153]{color:var(--b-tag-default-color)}.b-tag--blue[data-v-8d491153]{background-color:var(--b-tag-blue-background-color)}.b-tag--blue .b-tag__label[data-v-8d491153]{color:var(--b-tag-blue-color)}.b-tag--green[data-v-8d491153]{background-color:var(--b-tag-green-background-color)}.b-tag--green .b-tag__label[data-v-8d491153]{color:var(--b-tag-green-color)}.b-tag--orange[data-v-8d491153]{background-color:var(--b-tag-orange-background-color)}.b-tag--orange .b-tag__label[data-v-8d491153]{color:var(--b-tag-orange-color)}.b-tag--red[data-v-8d491153]{background-color:var(--b-tag-red-background-color)}.b-tag--red .b-tag__label[data-v-8d491153]{color:var(--b-tag-red-color)}.b-tag--white[data-v-8d491153]{background-color:var(--b-tag-white-background-color)}.b-tag--white .b-tag__label[data-v-8d491153]{color:var(--b-tag-white-color)}
package/dist/assets/tooltip.css CHANGED
@@ -1 +1 @@
1
- .b-tooltip[data-v-84b8cbe3]{scrollbar-color:var(--b-color-background-quaternary) transparent;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background-color:var(--b-tooltip-background-color);border-radius:var(--b-tooltip-border-radius);color:var(--b-tooltip-color);max-width:var(--b-tooltip-max-width);padding:var(--b-tooltip-padding);pointer-events:none;text-align:center;z-index:var(--b-tooltip-z-index)}.b-tooltip[data-v-84b8cbe3],.b-tooltip[data-v-84b8cbe3]:before,.b-tooltip[data-v-84b8cbe3]:after{box-sizing:border-box}.b-tooltip[data-v-84b8cbe3] *,.b-tooltip[data-v-84b8cbe3] *:before,.b-tooltip[data-v-84b8cbe3] *:after{box-sizing:border-box}.b-tooltip[data-v-84b8cbe3] ::-webkit-scrollbar{height:14px;width:14px}.b-tooltip[data-v-84b8cbe3] ::-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 (max-width: 375px){.b-tooltip[data-v-84b8cbe3]{max-width:100%}}.b-tooltip--hidden[data-v-84b8cbe3]{display:none}.b-tooltip--hidden[data-v-84b8cbe3] .b-tooltip__arrow:before{display:none}.b-tooltip[data-v-84b8cbe3] .b-tooltip__arrow{background-color:var(--b-tooltip-background-color);display:block}
1
+ [data-v-ee49bac4]:host{--popper-arrow-color: var(--b-tooltip-background-color);--popper-display: $display}.b-tooltip[data-v-ee49bac4]{scrollbar-color:var(--b-color-background-quaternary) transparent;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background-color:var(--b-tooltip-background-color);border-radius:var(--b-tooltip-border-radius);color:var(--b-tooltip-color);display:inline-block;max-width:var(--b-tooltip-max-width);padding:var(--b-tooltip-padding);pointer-events:none;text-align:center;z-index:var(--b-tooltip-z-index)}.b-tooltip[data-v-ee49bac4],.b-tooltip[data-v-ee49bac4]:before,.b-tooltip[data-v-ee49bac4]:after{box-sizing:border-box}.b-tooltip[data-v-ee49bac4] *,.b-tooltip[data-v-ee49bac4] *:before,.b-tooltip[data-v-ee49bac4] *:after{box-sizing:border-box}.b-tooltip[data-v-ee49bac4] ::-webkit-scrollbar{height:14px;width:14px}.b-tooltip[data-v-ee49bac4] ::-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 (max-width: 375px){.b-tooltip[data-v-ee49bac4]{max-width:100%}}.b-tooltip--hidden[data-v-ee49bac4]{display:none}.b-tooltip--hidden[data-v-ee49bac4] .b-tooltip__arrow:before{display:none}.b-tooltip[data-v-ee49bac4] .b-tooltip__arrow{background-color:var(--b-tooltip-background-color);display:block}
package/dist/assets/typography.css CHANGED
@@ -1 +1 @@
1
- .b-typography[data-v-3cabb1e2],.b-typography[data-v-3cabb1e2] :host{scrollbar-color:var(--b-color-background-quaternary) transparent;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-variant-numeric:var(--b-text-font-variant-numeric)}.b-typography[data-v-3cabb1e2],.b-typography[data-v-3cabb1e2]:before,.b-typography[data-v-3cabb1e2]:after,.b-typography[data-v-3cabb1e2] :host,.b-typography[data-v-3cabb1e2] :host:before,.b-typography[data-v-3cabb1e2] :host:after{box-sizing:border-box}.b-typography[data-v-3cabb1e2] *,.b-typography[data-v-3cabb1e2] *:before,.b-typography[data-v-3cabb1e2] *:after,.b-typography[data-v-3cabb1e2] :host *,.b-typography[data-v-3cabb1e2] :host *:before,.b-typography[data-v-3cabb1e2] :host *:after{box-sizing:border-box}.b-typography[data-v-3cabb1e2] ::-webkit-scrollbar,.b-typography[data-v-3cabb1e2] :host ::-webkit-scrollbar{height:14px;width:14px}.b-typography[data-v-3cabb1e2] ::-webkit-scrollbar-thumb,.b-typography[data-v-3cabb1e2] :host ::-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-typography--caption[data-v-3cabb1e2]{font-family:var(--b-text-caption-font-family);font-size:var(--b-text-caption-font-size);font-weight:var(--b-text-caption-font-weight);letter-spacing:var(--b-text-caption-letter-spacing);line-height:var(--b-text-caption-line-height)}.b-typography--caption-wide[data-v-3cabb1e2]{line-height:var(--b-text-caption-wide-line-height)}.b-typography--caption-stronger[data-v-3cabb1e2]{font-weight:var(--b-text-caption-stronger-font-weight)}.b-typography--body[data-v-3cabb1e2]{font-family:var(--b-text-body-font-family);font-size:var(--b-text-body-font-size);font-weight:var(--b-text-body-font-weight);letter-spacing:var(--b-text-body-letter-spacing);line-height:var(--b-text-body-line-height)}.b-typography--body-wide[data-v-3cabb1e2]{line-height:var(--b-text-body-wide-line-height)}.b-typography--body-stronger[data-v-3cabb1e2]{font-weight:var(--b-text-body-stronger-font-weight)}.b-typography--body-strongest[data-v-3cabb1e2]{font-weight:var(--b-text-body-strongest-font-weight)}.b-typography--subtitle[data-v-3cabb1e2]{font-family:var(--b-text-subtitle-font-family);font-size:var(--b-text-subtitle-font-size);font-weight:var(--b-text-subtitle-font-weight);letter-spacing:var(--b-text-subtitle-letter-spacing);line-height:var(--b-text-subtitle-line-height)}.b-typography--subtitle-stronger[data-v-3cabb1e2]{font-weight:var(--b-text-subtitle-stronger-font-weight)}.b-typography--title[data-v-3cabb1e2]{font-family:var(--b-text-title-font-family);font-size:clamp(var(--b-text-title-mobile-font-size),16px,var(--b-text-title-font-size));font-weight:var(--b-text-title-font-weight);letter-spacing:var(--b-text-title-letter-spacing);line-height:clamp(var(--b-text-title-mobile-line-height),26px,var(--b-text-title-line-height))}.b-typography--title-m[data-v-3cabb1e2]{font-family:var(--b-text-title-m-font-family);font-size:clamp(var(--b-text-title-m-mobile-font-size),.22vw + 17.17px,var(--b-text-title-m-font-size));font-weight:var(--b-text-title-m-font-weight);letter-spacing:var(--b-text-title-m-letter-spacing);line-height:clamp(var(--b-text-title-m-mobile-line-height),.22vw + 27.17px,var(--b-text-title-m-line-height))}.b-typography--title-l[data-v-3cabb1e2]{font-family:var(--b-text-title-l-font-family);font-size:var(--b-text-title-l-mobile-font-size);font-size:clamp(var(--b-text-title-l-mobile-font-size),.44vw + 18.34px,var(--b-text-title-l-font-size));font-weight:var(--b-text-title-l-font-weight);letter-spacing:var(--b-text-title-l-letter-spacing);line-height:clamp(var(--b-text-title-l-mobile-line-height),.44vw + 28.34px,var(--b-text-title-l-line-height))}.b-typography{margin:0}
1
+ .b-typography[data-v-627bf74b]{scrollbar-color:var(--b-color-background-quaternary) transparent;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;margin:0;font-variant-numeric:var(--b-text-font-variant-numeric)}.b-typography[data-v-627bf74b],.b-typography[data-v-627bf74b]:before,.b-typography[data-v-627bf74b]:after{box-sizing:border-box}.b-typography[data-v-627bf74b] *,.b-typography[data-v-627bf74b] *:before,.b-typography[data-v-627bf74b] *:after{box-sizing:border-box}.b-typography[data-v-627bf74b] ::-webkit-scrollbar{height:14px;width:14px}.b-typography[data-v-627bf74b] ::-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-typography--caption[data-v-627bf74b]{font-family:var(--b-text-caption-font-family);font-size:var(--b-text-caption-font-size);font-weight:var(--b-text-caption-font-weight);letter-spacing:var(--b-text-caption-letter-spacing);line-height:var(--b-text-caption-line-height)}.b-typography--caption-wide[data-v-627bf74b]{line-height:var(--b-text-caption-wide-line-height)}.b-typography--caption-stronger[data-v-627bf74b]{font-weight:var(--b-text-caption-stronger-font-weight)}.b-typography--body[data-v-627bf74b]{font-family:var(--b-text-body-font-family);font-size:var(--b-text-body-font-size);font-weight:var(--b-text-body-font-weight);letter-spacing:var(--b-text-body-letter-spacing);line-height:var(--b-text-body-line-height)}.b-typography--body-wide[data-v-627bf74b]{line-height:var(--b-text-body-wide-line-height)}.b-typography--body-stronger[data-v-627bf74b]{font-weight:var(--b-text-body-stronger-font-weight)}.b-typography--body-strongest[data-v-627bf74b]{font-weight:var(--b-text-body-strongest-font-weight)}.b-typography--subtitle[data-v-627bf74b]{font-family:var(--b-text-subtitle-font-family);font-size:var(--b-text-subtitle-font-size);font-weight:var(--b-text-subtitle-font-weight);letter-spacing:var(--b-text-subtitle-letter-spacing);line-height:var(--b-text-subtitle-line-height)}.b-typography--subtitle-stronger[data-v-627bf74b]{font-weight:var(--b-text-subtitle-stronger-font-weight)}.b-typography--title[data-v-627bf74b]{font-family:var(--b-text-title-font-family);font-size:clamp(var(--b-text-title-mobile-font-size),16px,var(--b-text-title-font-size));font-weight:var(--b-text-title-font-weight);letter-spacing:var(--b-text-title-letter-spacing);line-height:clamp(var(--b-text-title-mobile-line-height),26px,var(--b-text-title-line-height))}.b-typography--title-m[data-v-627bf74b]{font-family:var(--b-text-title-m-font-family);font-size:clamp(var(--b-text-title-m-mobile-font-size),.22vw + 17.17px,var(--b-text-title-m-font-size));font-weight:var(--b-text-title-m-font-weight);letter-spacing:var(--b-text-title-m-letter-spacing);line-height:clamp(var(--b-text-title-m-mobile-line-height),.22vw + 27.17px,var(--b-text-title-m-line-height))}.b-typography--title-l[data-v-627bf74b]{font-family:var(--b-text-title-l-font-family);font-size:var(--b-text-title-l-mobile-font-size);font-size:clamp(var(--b-text-title-l-mobile-font-size),.44vw + 18.34px,var(--b-text-title-l-font-size));font-weight:var(--b-text-title-l-font-weight);letter-spacing:var(--b-text-title-l-letter-spacing);line-height:clamp(var(--b-text-title-l-mobile-line-height),.44vw + 28.34px,var(--b-text-title-l-line-height))}
package/dist/assets/use-cached-selected-values.css CHANGED
@@ -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)}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-226f4c84]{display:flex;justify-content:space-between}.b-listbox-single-select-option__check-icon[data-v-226f4c84]{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-282f5857]{scrollbar-color:var(--b-color-background-quaternary) transparent;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.b-listbox-multi-select[data-v-282f5857],.b-listbox-multi-select[data-v-282f5857]:before,.b-listbox-multi-select[data-v-282f5857]:after{box-sizing:border-box}.b-listbox-multi-select[data-v-282f5857] ::-webkit-scrollbar{height:14px;width:14px}.b-listbox-multi-select[data-v-282f5857] ::-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-282f5857]{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-282f5857]{display:flex;gap:var(--b-listbox-multi-select-options-gap)}.b-listbox[data-v-c6bccc42]{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-c6bccc42],.b-listbox[data-v-c6bccc42]:before,.b-listbox[data-v-c6bccc42]:after{box-sizing:border-box}.b-listbox[data-v-c6bccc42] *,.b-listbox[data-v-c6bccc42] *:before,.b-listbox[data-v-c6bccc42] *:after{box-sizing:border-box}.b-listbox[data-v-c6bccc42] ::-webkit-scrollbar{height:14px;width:14px}.b-listbox[data-v-c6bccc42] ::-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-c6bccc42]{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-c6bccc42]{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-226f4c84]{display:flex;justify-content:space-between}.b-listbox-single-select-option__check-icon[data-v-226f4c84]{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-282f5857]{scrollbar-color:var(--b-color-background-quaternary) transparent;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.b-listbox-multi-select[data-v-282f5857],.b-listbox-multi-select[data-v-282f5857]:before,.b-listbox-multi-select[data-v-282f5857]:after{box-sizing:border-box}.b-listbox-multi-select[data-v-282f5857] ::-webkit-scrollbar{height:14px;width:14px}.b-listbox-multi-select[data-v-282f5857] ::-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-282f5857]{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-282f5857]{display:flex;gap:var(--b-listbox-multi-select-options-gap)}.b-listbox[data-v-c6bccc42]{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-c6bccc42],.b-listbox[data-v-c6bccc42]:before,.b-listbox[data-v-c6bccc42]:after{box-sizing:border-box}.b-listbox[data-v-c6bccc42] *,.b-listbox[data-v-c6bccc42] *:before,.b-listbox[data-v-c6bccc42] *:after{box-sizing:border-box}.b-listbox[data-v-c6bccc42] ::-webkit-scrollbar{height:14px;width:14px}.b-listbox[data-v-c6bccc42] ::-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-c6bccc42]{color:var(--b-listbox-empty-search-message-color);padding:var(--b-listbox-empty-search-message-padding);text-align:center}.b-listbox__empty-search-message[data-v-c6bccc42] .b-empty-state__title{color:var(--b-listbox-empty-search-message-color)}.b-listbox__lazy-load[data-v-c6bccc42]{display:flex;justify-content:center;margin:var(--b-listbox-lazy-load-margin)}
package/dist/avatar.js CHANGED
@@ -1,4 +1,4 @@
1
- import { B as r } from "./chunks/avatar.8erKxh8t.js";
1
+ import { B as r } from "./chunks/avatar.7gix8dxp.js";
2
2
  export {
3
3
  r as BentoAvatar
4
4
  };
package/dist/button.js CHANGED
@@ -1,7 +1,7 @@
1
- import { B as n, b as B, a } from "./chunks/button.Br6CyG40.js";
2
- import { B as s, c as u, a as r, b as i } from "./chunks/button-actions.DyI_dSvx.js";
3
- import { B as p, a as x } from "./chunks/loading-button.Bntgn6Lk.js";
4
- import { B as d } from "./chunks/toggle-button.CBRd1v6x.js";
1
+ import { B as n, b as B, a } from "./chunks/button.DInQYAND.js";
2
+ import { B as s, c as u, a as r, b as i } from "./chunks/button-actions.DOvd7VLB.js";
3
+ import { B as p, a as x } from "./chunks/loading-button.BzCt6ZT0.js";
4
+ import { B as d } from "./chunks/toggle-button.YSRdRLSS.js";
5
5
  export {
6
6
  n as BentoButton,
7
7
  s as BentoButtonActions,
package/dist/card.js CHANGED
@@ -1,4 +1,4 @@
1
- import { c as o, B as r, a as t } from "./chunks/card.Bt8jcp9I.js";
1
+ import { c as o, B as r, a as t } from "./chunks/card.Bh7vfIw8.js";
2
2
  export {
3
3
  o as BentoCard,
4
4
  r as BentoCardBackground,
package/dist/checkbox.js CHANGED
@@ -1,6 +1,6 @@
1
- import { B as t, a } from "./chunks/checkbox.Bk_jmkGe.js";
2
- import { C as x } from "./chunks/checkbox-input.JdcvpfTa.js";
3
- import { c as B, B as c } from "./chunks/checkbox-group.B0wngKi6.js";
1
+ import { B as t, a } from "./chunks/checkbox.Dkxm-fWK.js";
2
+ import { C as x } from "./chunks/checkbox-input.B24-74ay.js";
3
+ import { c as B, B as c } from "./chunks/checkbox-group.COoDP0ua.js";
4
4
  export {
5
5
  t as BentoCheckbox,
6
6
  a as BentoCheckboxEvent,
package/dist/chunks/{accordion-item.C30QFxol.js → accordion-item.COc5nXh4.js} RENAMED
@@ -1,6 +1,6 @@
1
1
  import { defineComponent as E, provide as $, toRef as z, openBlock as a, createElementBlock as l, renderSlot as S, ref as x, inject as D, computed as R, watch as r, createVNode as g, unref as e, withCtx as h, createElementVNode as y, createBlock as I, createTextVNode as H, toDisplayString as V, Transition as j, normalizeStyle as w, createCommentVNode as A } from "vue";
2
2
  import { _ as N } from "./_plugin-vue_export-helper.CHgC5LLL.js";
3
- import { B as U } from "./typography.z9P0Ec3Q.js";
3
+ import { B as U } from "./typography.CE5PgxFf.js";
4
4
  import { C as J, a as M } from "./chevron-up.DQZG_BP3.js";
5
5
  import { g as C } from "./unique-id.XFfoKuc2.js";
6
6
  import { o as q } from "./resize.Bqks3WUm.js";
@@ -139,4 +139,4 @@ export {
139
139
  le as a,
140
140
  de as b
141
141
  };
142
- //# sourceMappingURL=accordion-item.C30QFxol.js.map
142
+ //# sourceMappingURL=accordion-item.COc5nXh4.js.map
package/dist/chunks/{accordion-item.C30QFxol.js.map → accordion-item.COc5nXh4.js.map} RENAMED
@@ -1 +1 @@
1
- {"version":3,"file":"accordion-item.C30QFxol.js","sources":["../../../vue2/src/components/accordion/accordion.keys.ts","../../../vue2/src/components/accordion/accordion.vue","../../../vue2/src/components/accordion/components/accordion-item.vue"],"sourcesContent":["export const ACCORDION_TITLE_SIZE_INJECTION_KEY = Symbol('accordion title size injection key');\n","<template>\n <div class=\"b-accordion\">\n <slot />\n </div>\n</template>\n\n<script setup lang=\"ts\">\n import { PropType, provide, toRef } from 'vue';\n\n import { ACCORDION_TITLE_SIZE_INJECTION_KEY } from './accordion.keys';\n\n import type { BentoAccordionTitleSize } from './accordion.types';\n\n const props = defineProps({\n /**\n * Controls accordion title size.\n * @values default, small\n */\n titleSize: {\n type: String as PropType<BentoAccordionTitleSize>,\n default: 'default',\n },\n });\n\n provide(ACCORDION_TITLE_SIZE_INJECTION_KEY, toRef(props, 'titleSize'));\n</script>\n\n<script lang=\"ts\">\n /**\n * An accordion is a vertical stack of interactive headers used to reveal or hide\n * sections of content associated with these headers.\n *\n * This component must only have `BentoAccordionItem` components in its default slot.\n *\n * Accordion items should be collapsed by default.\n *\n * @example\n * import { BentoAccordion, BentoAccordionItem } from '@adyen/bento-vue2';\n *\n * export default {\n * components: { BentoAccordion, BentoAccordionItem },\n * template: `\n * <bento-accordion>\n * <bento-accordion-item title=\"Item 1\">\n * Content for item 1\n * </bento-accordion-item>\n * <bento-accordion-item title=\"Item 2\">\n * Content for item 2\n * </bento-accordion-item>\n * </bento-accordion>\n * `\n * }\n */\n export default {};\n</script>\n\n<style lang=\"scss\" scoped src=\"./accordion.scss\" />\n","<template>\n <div class=\"b-accordion-item\">\n <bento-typography\n el=\"h3\"\n :variant=\"titleSize === 'small' ? 'body' : 'title'\"\n :strongest=\"titleSize === 'small'\"\n >\n <button\n :id=\"buttonId\"\n :aria-controls=\"contentId\"\n :aria-expanded=\"`${isOpen}`\"\n type=\"button\"\n class=\"b-accordion-item__button\"\n @click=\"isOpen = !isOpen\"\n >\n <chevron-up-icon\n v-if=\"isOpen\"\n class=\"b-accordion-item__icon\"\n :svg-title=\"t('collapse')\"\n aria-hidden=\"true\"\n />\n <chevron-down-icon v-else class=\"b-accordion-item__icon\" :svg-title=\"t('expand')\" aria-hidden=\"true\" />\n {{ title }}\n </button>\n </bento-typography>\n\n <Transition :name=\"CONTENT_TRANSITION_NAME\">\n <div v-if=\"isOpen\" :id=\"contentId\" :aria-labelledby=\"buttonId\" role=\"region\" :style=\"contentMaxHeight\">\n <div ref=\"contentDiv\" class=\"b-accordion-item__content\">\n <slot />\n </div>\n </div>\n </Transition>\n </div>\n</template>\n\n<script setup lang=\"ts\">\n import { computed, inject, ref, watch } from 'vue';\n\n import { BentoTypography } from '@/components/typography';\n import ChevronDownIcon from '@adyen/ui-assets-icons-16/vue/chevron-down';\n import ChevronUpIcon from '@adyen/ui-assets-icons-16/vue/chevron-up';\n\n import { generateUid } from '@/utils/ts/unique-id';\n import { observeSizeOfElement } from '@/utils/ts/resize';\n import { useI18n } from '@/utils/ts/i18n';\n\n import { ACCORDION_TITLE_SIZE_INJECTION_KEY } from '../accordion.keys';\n\n import type { BentoAccordionTitleSize } from '../accordion.types';\n import { useExpandableContentHeight } from '@/composables/use-expandable-content-height/use-expandable-content-height';\n\n import messages from './messages.json';\n\n type MessageSchema = (typeof messages)['en-US'];\n\n const CONTENT_TRANSITION_NAME = 'b-accordion-item__animation--content';\n\n const props = defineProps({\n /**\n * Sets the title of the accordion item.\n */\n title: {\n type: String,\n required: true,\n },\n /**\n * Controls if the content is visible or hidden.\n */\n isExpanded: {\n type: Boolean,\n default: false,\n },\n });\n\n const emit = defineEmits<{\n /**\n * Emits update event when content is toggled\n */\n (e: 'update:is-expanded', value: boolean): void;\n }>();\n\n const { t } = useI18n<{ message: MessageSchema }>({ messages });\n\n // Refs\n const contentDiv = ref<HTMLDivElement>(null);\n const isOpen = ref(props.isExpanded);\n\n // Generating IDs\n const buttonId = generateUid('accordionItemButton');\n const contentId = generateUid('accordionItemContent');\n\n // Injecting prop from parent\n const titleSize = inject<`${BentoAccordionTitleSize}`>(ACCORDION_TITLE_SIZE_INJECTION_KEY, 'default');\n\n // Getting and setting the item height to be able to handle height animation\n const { updateContentHeight, contentHeight } = useExpandableContentHeight(contentDiv, isOpen);\n\n const contentMaxHeight = computed(() => (contentHeight.value ? { 'max-height': contentHeight.value } : {}));\n\n watch(\n () => props.isExpanded,\n value => {\n isOpen.value = value;\n }\n );\n\n watch(\n () => contentDiv.value,\n () => {\n let observer: ResizeObserver | null = null;\n if (!observer && contentDiv.value) {\n observer = observeSizeOfElement(contentDiv.value, () => {\n if (contentDiv.value) {\n updateContentHeight();\n }\n });\n }\n }\n );\n\n watch(\n isOpen,\n value => {\n // Enable two-way data binding for `isExpanded`\n emit('update:is-expanded', value);\n\n updateContentHeight();\n },\n { immediate: true }\n );\n</script>\n\n<script lang=\"ts\">\n /**\n * An accordion item is an interactive header used to reveal or hide a\n * section of content associated with this header.\n *\n * This component must always be wrapped by a `BentoAccordion` component.\n *\n * @example\n * import { BentoAccordion, BentoAccordionItem } from '@adyen/bento-vue2';\n *\n * export default {\n * components: { BentoAccordion, BentoAccordionItem },\n * template: `\n * <bento-accordion>\n * <bento-accordion-item title=\"Item 1\">\n * Content for item 1\n * </bento-accordion-item>\n * <bento-accordion-item title=\"Item 2\">\n * Content for item 2\n * </bento-accordion-item>\n * </bento-accordion>\n * `\n * }\n */\n export default {\n i18n: { messages },\n };\n</script>\n\n<style lang=\"scss\" scoped src=\"./accordion-item.scss\" />\n"],"names":["ACCORDION_TITLE_SIZE_INJECTION_KEY","__default__$1","provide","toRef","__props","__default__","messages","CONTENT_TRANSITION_NAME","props","emit","__emit","t","useI18n","contentDiv","ref","isOpen","buttonId","generateUid","contentId","titleSize","inject","updateContentHeight","contentHeight","useExpandableContentHeight","contentMaxHeight","computed","watch","value","observer","observeSizeOfElement"],"mappings":";;;;;;;;;AAAa,MAAAA,IAAA,OAAA,oCAAA,iCCqDTC,IAAA,CAAA;;;;;;;;;;;;;;AA7BA,WAAAC,EAAAF,GAAAG,EAXAC,GAWA,WAAA,CAAA;;;;;;;;;;;;;;;;;mHCqIAC,IAAA;AAAA,EAAe,MAAA,EAAA,UAAAC,EAAA;AAEf;;;;;;;;;;;;;;;;;;;;;AAvGA,UAAAC,IAAA,wCAEAC,IAAAJ,GAiBAK,IAAAC,GAOA,EAAA,GAAAC,EAAA,IAAAC,EAAA,EAAA,UAAAN,EAAA,CAAA,GAGAO,IAAAC,EAAA,IAAA,GACAC,IAAAD,EAAAN,EAAA,UAAA,GAGAQ,IAAAC,EAAA,qBAAA,GACAC,IAAAD,EAAA,sBAAA,GAGAE,IAAAC,EAAApB,GAAA,SAAA,GAGA,EAAA,qBAAAqB,GAAA,eAAAC,EAAA,IAAAC,EAAAV,GAAAE,CAAA,GAEAS,IAAAC,EAAA,MAAAH,EAAA,QAAA,EAAA,cAAAA,EAAA,MAAA,IAAA,CAAA,CAAA;AAEA,WAAAI;AAAA,MAAA,MAAAlB,EAAA;AAAA,MACgB,CAAAmB,MAAA;AAER,QAAAZ,EAAA,QAAAY;AAAA,MAAe;AAAA,IACnB,GAGJD;AAAA,MAAA,MAAAb,EAAA;AAAA,MACqB,MAAA;AAEb,YAAAe,IAAA;AACA,QAAA,CAAAA,KAAAf,EAAA,UACIe,IAAAC,EAAAhB,EAAA,OAAA,MAAA;AACI,UAAAA,EAAA,SACIQ,EAAA;AAAA,QACJ,CAAA;AAAA,MAER;AAAA,IACJ,GAGJK;AAAA,MAAAX;AAAA,MACI,CAAAY,MAAA;AAGI,QAAAlB,EAAA,sBAAAkB,CAAA,GAEAN,EAAA;AAAA,MAAoB;AAAA,MACxB,EAAA,WAAA,GAAA;AAAA,IACkB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
1
+ {"version":3,"file":"accordion-item.COc5nXh4.js","sources":["../../../vue2/src/components/accordion/accordion.keys.ts","../../../vue2/src/components/accordion/accordion.vue","../../../vue2/src/components/accordion/components/accordion-item.vue"],"sourcesContent":["export const ACCORDION_TITLE_SIZE_INJECTION_KEY = Symbol('accordion title size injection key');\n","<template>\n <div class=\"b-accordion\">\n <slot />\n </div>\n</template>\n\n<script setup lang=\"ts\">\n import { PropType, provide, toRef } from 'vue';\n\n import { ACCORDION_TITLE_SIZE_INJECTION_KEY } from './accordion.keys';\n\n import type { BentoAccordionTitleSize } from './accordion.types';\n\n const props = defineProps({\n /**\n * Controls accordion title size.\n * @values default, small\n */\n titleSize: {\n type: String as PropType<BentoAccordionTitleSize>,\n default: 'default',\n },\n });\n\n provide(ACCORDION_TITLE_SIZE_INJECTION_KEY, toRef(props, 'titleSize'));\n</script>\n\n<script lang=\"ts\">\n /**\n * An accordion is a vertical stack of interactive headers used to reveal or hide\n * sections of content associated with these headers.\n *\n * This component must only have `BentoAccordionItem` components in its default slot.\n *\n * Accordion items should be collapsed by default.\n *\n * @example\n * import { BentoAccordion, BentoAccordionItem } from '@adyen/bento-vue2';\n *\n * export default {\n * components: { BentoAccordion, BentoAccordionItem },\n * template: `\n * <bento-accordion>\n * <bento-accordion-item title=\"Item 1\">\n * Content for item 1\n * </bento-accordion-item>\n * <bento-accordion-item title=\"Item 2\">\n * Content for item 2\n * </bento-accordion-item>\n * </bento-accordion>\n * `\n * }\n */\n export default {};\n</script>\n\n<style lang=\"scss\" scoped src=\"./accordion.scss\" />\n","<template>\n <div class=\"b-accordion-item\">\n <bento-typography\n el=\"h3\"\n :variant=\"titleSize === 'small' ? 'body' : 'title'\"\n :strongest=\"titleSize === 'small'\"\n >\n <button\n :id=\"buttonId\"\n :aria-controls=\"contentId\"\n :aria-expanded=\"`${isOpen}`\"\n type=\"button\"\n class=\"b-accordion-item__button\"\n @click=\"isOpen = !isOpen\"\n >\n <chevron-up-icon\n v-if=\"isOpen\"\n class=\"b-accordion-item__icon\"\n :svg-title=\"t('collapse')\"\n aria-hidden=\"true\"\n />\n <chevron-down-icon v-else class=\"b-accordion-item__icon\" :svg-title=\"t('expand')\" aria-hidden=\"true\" />\n {{ title }}\n </button>\n </bento-typography>\n\n <Transition :name=\"CONTENT_TRANSITION_NAME\">\n <div v-if=\"isOpen\" :id=\"contentId\" :aria-labelledby=\"buttonId\" role=\"region\" :style=\"contentMaxHeight\">\n <div ref=\"contentDiv\" class=\"b-accordion-item__content\">\n <slot />\n </div>\n </div>\n </Transition>\n </div>\n</template>\n\n<script setup lang=\"ts\">\n import { computed, inject, ref, watch } from 'vue';\n\n import { BentoTypography } from '@/components/typography';\n import ChevronDownIcon from '@adyen/ui-assets-icons-16/vue/chevron-down';\n import ChevronUpIcon from '@adyen/ui-assets-icons-16/vue/chevron-up';\n\n import { generateUid } from '@/utils/ts/unique-id';\n import { observeSizeOfElement } from '@/utils/ts/resize';\n import { useI18n } from '@/utils/ts/i18n';\n\n import { ACCORDION_TITLE_SIZE_INJECTION_KEY } from '../accordion.keys';\n\n import type { BentoAccordionTitleSize } from '../accordion.types';\n import { useExpandableContentHeight } from '@/composables/use-expandable-content-height/use-expandable-content-height';\n\n import messages from './messages.json';\n\n type MessageSchema = (typeof messages)['en-US'];\n\n const CONTENT_TRANSITION_NAME = 'b-accordion-item__animation--content';\n\n const props = defineProps({\n /**\n * Sets the title of the accordion item.\n */\n title: {\n type: String,\n required: true,\n },\n /**\n * Controls if the content is visible or hidden.\n */\n isExpanded: {\n type: Boolean,\n default: false,\n },\n });\n\n const emit = defineEmits<{\n /**\n * Emits update event when content is toggled\n */\n (e: 'update:is-expanded', value: boolean): void;\n }>();\n\n const { t } = useI18n<{ message: MessageSchema }>({ messages });\n\n // Refs\n const contentDiv = ref<HTMLDivElement>(null);\n const isOpen = ref(props.isExpanded);\n\n // Generating IDs\n const buttonId = generateUid('accordionItemButton');\n const contentId = generateUid('accordionItemContent');\n\n // Injecting prop from parent\n const titleSize = inject<`${BentoAccordionTitleSize}`>(ACCORDION_TITLE_SIZE_INJECTION_KEY, 'default');\n\n // Getting and setting the item height to be able to handle height animation\n const { updateContentHeight, contentHeight } = useExpandableContentHeight(contentDiv, isOpen);\n\n const contentMaxHeight = computed(() => (contentHeight.value ? { 'max-height': contentHeight.value } : {}));\n\n watch(\n () => props.isExpanded,\n value => {\n isOpen.value = value;\n }\n );\n\n watch(\n () => contentDiv.value,\n () => {\n let observer: ResizeObserver | null = null;\n if (!observer && contentDiv.value) {\n observer = observeSizeOfElement(contentDiv.value, () => {\n if (contentDiv.value) {\n updateContentHeight();\n }\n });\n }\n }\n );\n\n watch(\n isOpen,\n value => {\n // Enable two-way data binding for `isExpanded`\n emit('update:is-expanded', value);\n\n updateContentHeight();\n },\n { immediate: true }\n );\n</script>\n\n<script lang=\"ts\">\n /**\n * An accordion item is an interactive header used to reveal or hide a\n * section of content associated with this header.\n *\n * This component must always be wrapped by a `BentoAccordion` component.\n *\n * @example\n * import { BentoAccordion, BentoAccordionItem } from '@adyen/bento-vue2';\n *\n * export default {\n * components: { BentoAccordion, BentoAccordionItem },\n * template: `\n * <bento-accordion>\n * <bento-accordion-item title=\"Item 1\">\n * Content for item 1\n * </bento-accordion-item>\n * <bento-accordion-item title=\"Item 2\">\n * Content for item 2\n * </bento-accordion-item>\n * </bento-accordion>\n * `\n * }\n */\n export default {\n i18n: { messages },\n };\n</script>\n\n<style lang=\"scss\" scoped src=\"./accordion-item.scss\" />\n"],"names":["ACCORDION_TITLE_SIZE_INJECTION_KEY","__default__$1","provide","toRef","__props","__default__","messages","CONTENT_TRANSITION_NAME","props","emit","__emit","t","useI18n","contentDiv","ref","isOpen","buttonId","generateUid","contentId","titleSize","inject","updateContentHeight","contentHeight","useExpandableContentHeight","contentMaxHeight","computed","watch","value","observer","observeSizeOfElement"],"mappings":";;;;;;;;;AAAa,MAAAA,IAAA,OAAA,oCAAA,iCCqDTC,IAAA,CAAA;;;;;;;;;;;;;;AA7BA,WAAAC,EAAAF,GAAAG,EAXAC,GAWA,WAAA,CAAA;;;;;;;;;;;;;;;;;mHCqIAC,IAAA;AAAA,EAAe,MAAA,EAAA,UAAAC,EAAA;AAEf;;;;;;;;;;;;;;;;;;;;;AAvGA,UAAAC,IAAA,wCAEAC,IAAAJ,GAiBAK,IAAAC,GAOA,EAAA,GAAAC,EAAA,IAAAC,EAAA,EAAA,UAAAN,EAAA,CAAA,GAGAO,IAAAC,EAAA,IAAA,GACAC,IAAAD,EAAAN,EAAA,UAAA,GAGAQ,IAAAC,EAAA,qBAAA,GACAC,IAAAD,EAAA,sBAAA,GAGAE,IAAAC,EAAApB,GAAA,SAAA,GAGA,EAAA,qBAAAqB,GAAA,eAAAC,EAAA,IAAAC,EAAAV,GAAAE,CAAA,GAEAS,IAAAC,EAAA,MAAAH,EAAA,QAAA,EAAA,cAAAA,EAAA,MAAA,IAAA,CAAA,CAAA;AAEA,WAAAI;AAAA,MAAA,MAAAlB,EAAA;AAAA,MACgB,CAAAmB,MAAA;AAER,QAAAZ,EAAA,QAAAY;AAAA,MAAe;AAAA,IACnB,GAGJD;AAAA,MAAA,MAAAb,EAAA;AAAA,MACqB,MAAA;AAEb,YAAAe,IAAA;AACA,QAAA,CAAAA,KAAAf,EAAA,UACIe,IAAAC,EAAAhB,EAAA,OAAA,MAAA;AACI,UAAAA,EAAA,SACIQ,EAAA;AAAA,QACJ,CAAA;AAAA,MAER;AAAA,IACJ,GAGJK;AAAA,MAAAX;AAAA,MACI,CAAAY,MAAA;AAGI,QAAAlB,EAAA,sBAAAkB,CAAA,GAEAN,EAAA;AAAA,MAAoB;AAAA,MACxB,EAAA,WAAA,GAAA;AAAA,IACkB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
package/dist/chunks/{action-bar.5XBrXwYv.js → action-bar.CMuu-R_8.js} RENAMED
@@ -1,12 +1,12 @@
1
1
  import { defineComponent as R, computed as c, ref as _, toRefs as F, watch as E, provide as G, nextTick as f, openBlock as d, createBlock as b, Transition as U, withCtx as B, createElementVNode as S, normalizeClass as L, unref as t, createElementBlock as W, createVNode as y, createCommentVNode as K, createTextVNode as M, toDisplayString as h } from "vue";
2
- import { B as z } from "./button.Br6CyG40.js";
3
- import { B as D } from "./typography.z9P0Ec3Q.js";
4
- import { B as J } from "./button-actions-with-menu.CHOjMHpd.js";
2
+ import { B as z } from "./button.DInQYAND.js";
3
+ import { B as D } from "./typography.CE5PgxFf.js";
4
+ import { B as J } from "./button-actions-with-menu.B9E4lUQV.js";
5
5
  import { C as Z } from "./cross.OvPfvoqX.js";
6
6
  import { u as j } from "./i18n.DL9GT2-k.js";
7
7
  import { u as q } from "./index.DKQuLmwu.js";
8
- import { P as Y } from "./popover.pDk6zsak.js";
9
- import { B as $ } from "./button-actions.DyI_dSvx.js";
8
+ import { P as Y } from "./popover.C7aNk7Ct.js";
9
+ import { B as $ } from "./button-actions.DOvd7VLB.js";
10
10
  import { _ as H } from "./_plugin-vue_export-helper.CHgC5LLL.js";
11
11
  import "../assets/action-bar.css";
12
12
  const N = {
@@ -199,4 +199,4 @@ const N = {
199
199
  export {
200
200
  fe as B
201
201
  };
202
- //# sourceMappingURL=action-bar.5XBrXwYv.js.map
202
+ //# sourceMappingURL=action-bar.CMuu-R_8.js.map
package/dist/chunks/{action-bar.5XBrXwYv.js.map → action-bar.CMuu-R_8.js.map} RENAMED
@@ -1 +1 @@
1
- {"version":3,"file":"action-bar.5XBrXwYv.js","sources":["../../../vue2/src/components/action-bar/action-bar.vue"],"sourcesContent":["<template>\n <Transition name=\"b-action-bar__animation\" appear>\n <section class=\"b-action-bar\" :class=\"conditionalClasses\" :aria-label=\"t('actionBar')\">\n <div ref=\"actionBar\" class=\"b-action-bar__container\">\n <div v-if=\"!isConfirmationVariant\" class=\"b-action-bar__close-button\">\n <bento-button variant=\"tertiary\" inverse :aria-label=\"t('close')\" @click=\"emit('close')\">\n <template #iconLeft><cross-icon :aria-hidden=\"true\" /></template>\n </bento-button>\n </div>\n <bento-typography el=\"span\" stronger class=\"b-action-bar__selection\">\n {{ itemCounter }} {{ isConfirmationVariant ? tc('unsavedChanges', itemCounter) : label }}\n </bento-typography>\n <bento-button-actions\n v-if=\"isConfirmationVariant\"\n :actions=\"confirmationActions\"\n class=\"b-action-bar__actions\"\n inverse\n />\n <button-actions-with-menu\n v-else\n :actions=\"actionsInternal\"\n class=\"b-action-bar__actions\"\n :displayed-actions=\"internalDisplayedActions\"\n menu-position=\"top-end\"\n inverse\n />\n </div>\n </section>\n </Transition>\n</template>\n\n<script setup lang=\"ts\">\n import { computed, nextTick, PropType, provide, ref, toRefs, watch } from 'vue';\n import { BentoButton, BentoButtonActions, BentoButtonActionsList } from '@/components/button';\n import { BentoTypography } from '@/components/typography';\n\n import { type BentoActionBarVariant } from '@/components/action-bar/action-bar.types';\n import ButtonActionsWithMenu from '@/components/internal/button-actions-with-menu/button-actions-with-menu.vue';\n import CrossIcon from '@adyen/ui-assets-icons-16/vue/cross';\n\n import { useI18n } from '@/utils/ts/i18n';\n import { useWindowSize } from '@vueuse/core';\n\n import messages from './messages.json';\n import { POPOVER_OFFSET_INJECTION_KEY } from '@/components/popover/popover.keys';\n\n type MessageSchema = (typeof messages)['en-US'];\n\n // Constants\n const AVERAGE_BUTTON_SIZE = 100;\n const MENU_OFFSET = 7;\n const RESPONSIVE_BREAKPOINT = 500;\n const SPACING = 32;\n\n const props = defineProps({\n /**\n * List of actions that will be used to render the buttons.\n * Required and used for the `default` variant.\n *\n * Each object in the list should have a `title`, an `event` and,\n * optionally, an `icon`.\n *\n * The component will display 4 actions and the hide the rest inside a menu.\n *\n * @see BentoButton for a list of all the other props supported by each button action.\n */\n actions: {\n type: Array as PropType<BentoButtonActionsList>,\n default: () => [],\n },\n /**\n * How many actions should be visible outside the menu, cannot be more than 4\n */\n visibleActions: {\n type: Number,\n default: 4,\n validator: (value: number) => value > 0 && value <= 4,\n },\n /**\n * Use when there are sticky elements at the bottom, like sticky pagination\n */\n extraBottomSpacing: {\n type: Boolean,\n default: false,\n },\n /**\n * Show how many items are selected\n */\n itemCounter: {\n type: Number,\n required: true,\n },\n /**\n * Label for the selection, e.g. 'selected'/'changed'\n */\n selectionLabel: {\n type: String,\n default: null,\n },\n /**\n * Variant for the action bar\n * @values default, confirmation\n */\n variant: {\n type: String as PropType<BentoActionBarVariant>,\n default: 'default',\n },\n });\n\n const emit = defineEmits<{\n /**\n * Event emitted when the user click the close button\n */\n (e: 'close'): void;\n (e: 'cancel'): void;\n (e: 'save'): void;\n }>();\n\n const { t, tc } = useI18n<{ message: MessageSchema }>({ messages });\n const label = computed(() => (props.selectionLabel ? props.selectionLabel : t('selected')));\n\n // Refs\n const actionBar = ref<HTMLDivElement>(null);\n const { extraBottomSpacing, visibleActions } = toRefs(props);\n const { width } = useWindowSize();\n const internalDisplayedActions = ref(null);\n const internalVisibleActions = ref(null);\n\n const isConfirmationVariant = computed(() => props.variant === 'confirmation');\n\n watch(\n () => visibleActions.value,\n value => {\n internalVisibleActions.value = value <= 4 ? value : 4;\n internalDisplayedActions.value = internalVisibleActions.value;\n },\n { immediate: true }\n );\n\n // Styling\n const conditionalClasses = computed(() => ({\n 'b-action-bar--extra-spacing': extraBottomSpacing.value,\n 'b-action-bar--confirmation': isConfirmationVariant.value,\n }));\n\n // Provide POPOVER_OFFSET_INJECTION_KEY to change the value of the popover offset\n provide(POPOVER_OFFSET_INJECTION_KEY, MENU_OFFSET);\n\n // Manipulate actions array to display as intended\n const actionsInternal = computed(() => {\n // All buttons should be of type secondary in the action bar\n const actions = props.actions.map(action => ({\n ...action,\n variant: 'secondary',\n })) as BentoButtonActionsList;\n // Shown actions should display from left to right in action bar, instead of right to left which is the button actions default\n const shownActions = actions.slice(0, internalDisplayedActions.value).reverse();\n const hiddenActions = actions.slice(internalDisplayedActions.value);\n\n return [...shownActions, ...hiddenActions];\n });\n\n const confirmationActions = computed<BentoButtonActionsList>(() => [\n {\n title: t('save'),\n event: () => emit('save'),\n },\n {\n title: t('cancel'),\n variant: 'secondary',\n event: () => emit('cancel'),\n },\n ]);\n\n // Recursive functions to determine how many actions should be visible/hidden based on the screens width\n const showActions = async () => {\n await nextTick();\n if (\n width.value > actionBar.value.clientWidth + SPACING + AVERAGE_BUTTON_SIZE &&\n internalDisplayedActions.value < internalVisibleActions.value\n ) {\n internalDisplayedActions.value += 1;\n showActions();\n }\n };\n\n const hideActions = async () => {\n await nextTick();\n if (width.value < actionBar.value.clientWidth + SPACING && internalDisplayedActions.value > 0) {\n internalDisplayedActions.value -= 1;\n hideActions();\n }\n };\n\n // Screen width watcher to toggle hidden/visible actions\n watch(\n () => width.value,\n async (newValue, oldValue) => {\n await nextTick();\n if (!actionBar.value) {\n return;\n }\n const isIncreasing = newValue > oldValue;\n if (width.value < RESPONSIVE_BREAKPOINT) {\n internalDisplayedActions.value = 0;\n } else if (isIncreasing) {\n showActions();\n } else {\n hideActions();\n }\n },\n { immediate: true }\n );\n</script>\n\n<script lang=\"ts\">\n /**\n * Action bar is a floating bar that provides users with quick access to key actions that can be applied to one or multiple items.\n *\n * @example\n * import { BentoActionBar } from '@adyen/bento-vue2';\n *\n * export default {\n * components: { BentoActionBar },\n * template: `\n * <bento-action-bar\n * :actions='[\n * {\n * title: 'Delete',\n * critical: true,\n * icon: BinIcon,\n * event: () => true,\n * },\n * {\n * title: 'Edit',\n * icon: EditIcon,\n * event: () => true,\n * }\n * ]'\n * @close=\"closeAction\"\n * :item-counter=\"5\"\n * />\n * `\n * }\n */\n export default {\n i18n: { messages },\n };\n</script>\n\n<style lang=\"scss\" scoped src=\"./action-bar.scss\" />\n"],"names":["__default__","messages","props","__props","emit","__emit","t","tc","useI18n","label","computed","actionBar","ref","extraBottomSpacing","visibleActions","toRefs","width","useWindowSize","internalDisplayedActions","internalVisibleActions","isConfirmationVariant","watch","value","conditionalClasses","provide","POPOVER_OFFSET_INJECTION_KEY","actionsInternal","actions","action","shownActions","hiddenActions","confirmationActions","showActions","nextTick","hideActions","newValue","oldValue","isIncreasing"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAqPIA,KAAA;AAAA,EAAe,MAAA,EAAA,UAAAC,EAAA;AAEf;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAjMA,UAAAC,IAAAC,GAuDAC,IAAAC,GASA,EAAA,GAAAC,GAAA,IAAAC,EAAA,IAAAC,EAAA,EAAA,UAAAP,EAAA,CAAA,GACAQ,IAAAC,EAAA,MAAAR,EAAA,iBAAAA,EAAA,iBAAAI,EAAA,UAAA,CAAA,GAGAK,IAAAC,EAAA,IAAA,GACA,EAAA,oBAAAC,GAAA,gBAAAC,EAAA,IAAAC,EAAAb,CAAA,GACA,EAAA,OAAAc,EAAA,IAAAC,EAAA,GACAC,IAAAN,EAAA,IAAA,GACAO,IAAAP,EAAA,IAAA,GAEAQ,IAAAV,EAAA,MAAAR,EAAA,YAAA,cAAA;AAEA,IAAAmB;AAAA,MAAA,MAAAP,EAAA;AAAA,MACyB,CAAAQ,MAAA;AAEjB,QAAAH,EAAA,QAAAG,KAAA,IAAAA,IAAA,GACAJ,EAAA,QAAAC,EAAA;AAAA,MAAwD;AAAA,MAC5D,EAAA,WAAA,GAAA;AAAA,IACkB;AAItB,UAAAI,IAAAb,EAAA,OAAA;AAAA,MAA2C,+BAAAG,EAAA;AAAA,MACW,8BAAAO,EAAA;AAAA,IACE,EAAA;AAIxD,IAAAI,EAAAC,GAAA,CAAA;AAGA,UAAAC,IAAAhB,EAAA,MAAA;AAEI,YAAAiB,IAAAzB,EAAA,QAAA,IAAA,CAAA0B,OAAA;AAAA,QAA6C,GAAAA;AAAA,QACtC,SAAA;AAAA,MACM,EAAA,GAGbC,IAAAF,EAAA,MAAA,GAAAT,EAAA,KAAA,EAAA,QAAA,GACAY,IAAAH,EAAA,MAAAT,EAAA,KAAA;AAEA,aAAA,CAAA,GAAAW,GAAA,GAAAC,CAAA;AAAA,IAAyC,CAAA,GAG7CC,IAAArB,EAAA,MAAA;AAAA,MAAmE;AAAA,QAC/D,OAAAJ,EAAA,MAAA;AAAA,QACmB,OAAA,MAAAF,EAAA,MAAA;AAAA,MACS;AAAA,MAC5B;AAAA,QACA,OAAAE,EAAA,QAAA;AAAA,QACqB,SAAA;AAAA,QACR,OAAA,MAAAF,EAAA,QAAA;AAAA,MACiB;AAAA,IAC9B,CAAA,GAIJ4B,IAAA,YAAA;AACI,YAAAC,EAAA,GACAjB,EAAA,QAAAL,EAAA,MAAA,cAAA,KAAA,OAAAO,EAAA,QAAAC,EAAA,UAIID,EAAA,SAAA,GACAc,EAAA;AAAA,IACJ,GAGJE,IAAA,YAAA;AACI,YAAAD,EAAA,GACAjB,EAAA,QAAAL,EAAA,MAAA,cAAA,MAAAO,EAAA,QAAA,MACIA,EAAA,SAAA,GACAgB,EAAA;AAAA,IACJ;AAIJ,WAAAb;AAAA,MAAA,MAAAL,EAAA;AAAA,MACgB,OAAAmB,GAAAC,MAAA;AAGR,YADA,MAAAH,EAAA,GACA,CAAAtB,EAAA;AACI;AAEJ,cAAA0B,IAAAF,IAAAC;AACA,QAAApB,EAAA,QAAA,MACIE,EAAA,QAAA,IAAiCmB,IAEjCL,EAAA,IAEAE,EAAA;AAAA,MACJ;AAAA,MACJ,EAAA,WAAA,GAAA;AAAA,IACkB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
1
+ {"version":3,"file":"action-bar.CMuu-R_8.js","sources":["../../../vue2/src/components/action-bar/action-bar.vue"],"sourcesContent":["<template>\n <Transition name=\"b-action-bar__animation\" appear>\n <section class=\"b-action-bar\" :class=\"conditionalClasses\" :aria-label=\"t('actionBar')\">\n <div ref=\"actionBar\" class=\"b-action-bar__container\">\n <div v-if=\"!isConfirmationVariant\" class=\"b-action-bar__close-button\">\n <bento-button variant=\"tertiary\" inverse :aria-label=\"t('close')\" @click=\"emit('close')\">\n <template #iconLeft><cross-icon :aria-hidden=\"true\" /></template>\n </bento-button>\n </div>\n <bento-typography el=\"span\" stronger class=\"b-action-bar__selection\">\n {{ itemCounter }} {{ isConfirmationVariant ? tc('unsavedChanges', itemCounter) : label }}\n </bento-typography>\n <bento-button-actions\n v-if=\"isConfirmationVariant\"\n :actions=\"confirmationActions\"\n class=\"b-action-bar__actions\"\n inverse\n />\n <button-actions-with-menu\n v-else\n :actions=\"actionsInternal\"\n class=\"b-action-bar__actions\"\n :displayed-actions=\"internalDisplayedActions\"\n menu-position=\"top-end\"\n inverse\n />\n </div>\n </section>\n </Transition>\n</template>\n\n<script setup lang=\"ts\">\n import { computed, nextTick, PropType, provide, ref, toRefs, watch } from 'vue';\n import { BentoButton, BentoButtonActions, BentoButtonActionsList } from '@/components/button';\n import { BentoTypography } from '@/components/typography';\n\n import { type BentoActionBarVariant } from '@/components/action-bar/action-bar.types';\n import ButtonActionsWithMenu from '@/components/internal/button-actions-with-menu/button-actions-with-menu.vue';\n import CrossIcon from '@adyen/ui-assets-icons-16/vue/cross';\n\n import { useI18n } from '@/utils/ts/i18n';\n import { useWindowSize } from '@vueuse/core';\n\n import messages from './messages.json';\n import { POPOVER_OFFSET_INJECTION_KEY } from '@/components/popover/popover.keys';\n\n type MessageSchema = (typeof messages)['en-US'];\n\n // Constants\n const AVERAGE_BUTTON_SIZE = 100;\n const MENU_OFFSET = 7;\n const RESPONSIVE_BREAKPOINT = 500;\n const SPACING = 32;\n\n const props = defineProps({\n /**\n * List of actions that will be used to render the buttons.\n * Required and used for the `default` variant.\n *\n * Each object in the list should have a `title`, an `event` and,\n * optionally, an `icon`.\n *\n * The component will display 4 actions and the hide the rest inside a menu.\n *\n * @see BentoButton for a list of all the other props supported by each button action.\n */\n actions: {\n type: Array as PropType<BentoButtonActionsList>,\n default: () => [],\n },\n /**\n * How many actions should be visible outside the menu, cannot be more than 4\n */\n visibleActions: {\n type: Number,\n default: 4,\n validator: (value: number) => value > 0 && value <= 4,\n },\n /**\n * Use when there are sticky elements at the bottom, like sticky pagination\n */\n extraBottomSpacing: {\n type: Boolean,\n default: false,\n },\n /**\n * Show how many items are selected\n */\n itemCounter: {\n type: Number,\n required: true,\n },\n /**\n * Label for the selection, e.g. 'selected'/'changed'\n */\n selectionLabel: {\n type: String,\n default: null,\n },\n /**\n * Variant for the action bar\n * @values default, confirmation\n */\n variant: {\n type: String as PropType<BentoActionBarVariant>,\n default: 'default',\n },\n });\n\n const emit = defineEmits<{\n /**\n * Event emitted when the user click the close button\n */\n (e: 'close'): void;\n (e: 'cancel'): void;\n (e: 'save'): void;\n }>();\n\n const { t, tc } = useI18n<{ message: MessageSchema }>({ messages });\n const label = computed(() => (props.selectionLabel ? props.selectionLabel : t('selected')));\n\n // Refs\n const actionBar = ref<HTMLDivElement>(null);\n const { extraBottomSpacing, visibleActions } = toRefs(props);\n const { width } = useWindowSize();\n const internalDisplayedActions = ref(null);\n const internalVisibleActions = ref(null);\n\n const isConfirmationVariant = computed(() => props.variant === 'confirmation');\n\n watch(\n () => visibleActions.value,\n value => {\n internalVisibleActions.value = value <= 4 ? value : 4;\n internalDisplayedActions.value = internalVisibleActions.value;\n },\n { immediate: true }\n );\n\n // Styling\n const conditionalClasses = computed(() => ({\n 'b-action-bar--extra-spacing': extraBottomSpacing.value,\n 'b-action-bar--confirmation': isConfirmationVariant.value,\n }));\n\n // Provide POPOVER_OFFSET_INJECTION_KEY to change the value of the popover offset\n provide(POPOVER_OFFSET_INJECTION_KEY, MENU_OFFSET);\n\n // Manipulate actions array to display as intended\n const actionsInternal = computed(() => {\n // All buttons should be of type secondary in the action bar\n const actions = props.actions.map(action => ({\n ...action,\n variant: 'secondary',\n })) as BentoButtonActionsList;\n // Shown actions should display from left to right in action bar, instead of right to left which is the button actions default\n const shownActions = actions.slice(0, internalDisplayedActions.value).reverse();\n const hiddenActions = actions.slice(internalDisplayedActions.value);\n\n return [...shownActions, ...hiddenActions];\n });\n\n const confirmationActions = computed<BentoButtonActionsList>(() => [\n {\n title: t('save'),\n event: () => emit('save'),\n },\n {\n title: t('cancel'),\n variant: 'secondary',\n event: () => emit('cancel'),\n },\n ]);\n\n // Recursive functions to determine how many actions should be visible/hidden based on the screens width\n const showActions = async () => {\n await nextTick();\n if (\n width.value > actionBar.value.clientWidth + SPACING + AVERAGE_BUTTON_SIZE &&\n internalDisplayedActions.value < internalVisibleActions.value\n ) {\n internalDisplayedActions.value += 1;\n showActions();\n }\n };\n\n const hideActions = async () => {\n await nextTick();\n if (width.value < actionBar.value.clientWidth + SPACING && internalDisplayedActions.value > 0) {\n internalDisplayedActions.value -= 1;\n hideActions();\n }\n };\n\n // Screen width watcher to toggle hidden/visible actions\n watch(\n () => width.value,\n async (newValue, oldValue) => {\n await nextTick();\n if (!actionBar.value) {\n return;\n }\n const isIncreasing = newValue > oldValue;\n if (width.value < RESPONSIVE_BREAKPOINT) {\n internalDisplayedActions.value = 0;\n } else if (isIncreasing) {\n showActions();\n } else {\n hideActions();\n }\n },\n { immediate: true }\n );\n</script>\n\n<script lang=\"ts\">\n /**\n * Action bar is a floating bar that provides users with quick access to key actions that can be applied to one or multiple items.\n *\n * @example\n * import { BentoActionBar } from '@adyen/bento-vue2';\n *\n * export default {\n * components: { BentoActionBar },\n * template: `\n * <bento-action-bar\n * :actions='[\n * {\n * title: 'Delete',\n * critical: true,\n * icon: BinIcon,\n * event: () => true,\n * },\n * {\n * title: 'Edit',\n * icon: EditIcon,\n * event: () => true,\n * }\n * ]'\n * @close=\"closeAction\"\n * :item-counter=\"5\"\n * />\n * `\n * }\n */\n export default {\n i18n: { messages },\n };\n</script>\n\n<style lang=\"scss\" scoped src=\"./action-bar.scss\" />\n"],"names":["__default__","messages","props","__props","emit","__emit","t","tc","useI18n","label","computed","actionBar","ref","extraBottomSpacing","visibleActions","toRefs","width","useWindowSize","internalDisplayedActions","internalVisibleActions","isConfirmationVariant","watch","value","conditionalClasses","provide","POPOVER_OFFSET_INJECTION_KEY","actionsInternal","actions","action","shownActions","hiddenActions","confirmationActions","showActions","nextTick","hideActions","newValue","oldValue","isIncreasing"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAqPIA,KAAA;AAAA,EAAe,MAAA,EAAA,UAAAC,EAAA;AAEf;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAjMA,UAAAC,IAAAC,GAuDAC,IAAAC,GASA,EAAA,GAAAC,GAAA,IAAAC,EAAA,IAAAC,EAAA,EAAA,UAAAP,EAAA,CAAA,GACAQ,IAAAC,EAAA,MAAAR,EAAA,iBAAAA,EAAA,iBAAAI,EAAA,UAAA,CAAA,GAGAK,IAAAC,EAAA,IAAA,GACA,EAAA,oBAAAC,GAAA,gBAAAC,EAAA,IAAAC,EAAAb,CAAA,GACA,EAAA,OAAAc,EAAA,IAAAC,EAAA,GACAC,IAAAN,EAAA,IAAA,GACAO,IAAAP,EAAA,IAAA,GAEAQ,IAAAV,EAAA,MAAAR,EAAA,YAAA,cAAA;AAEA,IAAAmB;AAAA,MAAA,MAAAP,EAAA;AAAA,MACyB,CAAAQ,MAAA;AAEjB,QAAAH,EAAA,QAAAG,KAAA,IAAAA,IAAA,GACAJ,EAAA,QAAAC,EAAA;AAAA,MAAwD;AAAA,MAC5D,EAAA,WAAA,GAAA;AAAA,IACkB;AAItB,UAAAI,IAAAb,EAAA,OAAA;AAAA,MAA2C,+BAAAG,EAAA;AAAA,MACW,8BAAAO,EAAA;AAAA,IACE,EAAA;AAIxD,IAAAI,EAAAC,GAAA,CAAA;AAGA,UAAAC,IAAAhB,EAAA,MAAA;AAEI,YAAAiB,IAAAzB,EAAA,QAAA,IAAA,CAAA0B,OAAA;AAAA,QAA6C,GAAAA;AAAA,QACtC,SAAA;AAAA,MACM,EAAA,GAGbC,IAAAF,EAAA,MAAA,GAAAT,EAAA,KAAA,EAAA,QAAA,GACAY,IAAAH,EAAA,MAAAT,EAAA,KAAA;AAEA,aAAA,CAAA,GAAAW,GAAA,GAAAC,CAAA;AAAA,IAAyC,CAAA,GAG7CC,IAAArB,EAAA,MAAA;AAAA,MAAmE;AAAA,QAC/D,OAAAJ,EAAA,MAAA;AAAA,QACmB,OAAA,MAAAF,EAAA,MAAA;AAAA,MACS;AAAA,MAC5B;AAAA,QACA,OAAAE,EAAA,QAAA;AAAA,QACqB,SAAA;AAAA,QACR,OAAA,MAAAF,EAAA,QAAA;AAAA,MACiB;AAAA,IAC9B,CAAA,GAIJ4B,IAAA,YAAA;AACI,YAAAC,EAAA,GACAjB,EAAA,QAAAL,EAAA,MAAA,cAAA,KAAA,OAAAO,EAAA,QAAAC,EAAA,UAIID,EAAA,SAAA,GACAc,EAAA;AAAA,IACJ,GAGJE,IAAA,YAAA;AACI,YAAAD,EAAA,GACAjB,EAAA,QAAAL,EAAA,MAAA,cAAA,MAAAO,EAAA,QAAA,MACIA,EAAA,SAAA,GACAgB,EAAA;AAAA,IACJ;AAIJ,WAAAb;AAAA,MAAA,MAAAL,EAAA;AAAA,MACgB,OAAAmB,GAAAC,MAAA;AAGR,YADA,MAAAH,EAAA,GACA,CAAAtB,EAAA;AACI;AAEJ,cAAA0B,IAAAF,IAAAC;AACA,QAAApB,EAAA,QAAA,MACIE,EAAA,QAAA,IAAiCmB,IAEjCL,EAAA,IAEAE,EAAA;AAAA,MACJ;AAAA,MACJ,EAAA,WAAA,GAAA;AAAA,IACkB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
package/dist/chunks/{alert.BvSx_Bi7.js → alert.DZFWFceT.js} RENAMED
@@ -1,6 +1,6 @@
1
1
  import { openBlock as o, createElementBlock as _, mergeProps as b, toDisplayString as V, createCommentVNode as c, createElementVNode as s, defineComponent as N, useSlots as R, computed as n, onMounted as A, normalizeClass as P, createBlock as C, resolveDynamicComponent as D, unref as e, withCtx as f, renderSlot as v, createVNode as U } from "vue";
2
- import { c as W, a as I, B as y } from "./typography.z9P0Ec3Q.js";
3
- import { B as F } from "./button.Br6CyG40.js";
2
+ import { c as W, a as I, B as y } from "./typography.CE5PgxFf.js";
3
+ import { B as F } from "./button.DInQYAND.js";
4
4
  import { C as M } from "./cross-small.CXWTuKA_.js";
5
5
  import { W as Z } from "./warning-filled.Dm_HhqzW.js";
6
6
  import { C as j } from "./cross-circle-fill.DN5b3_eL.js";
@@ -165,4 +165,4 @@ export {
165
165
  i as b,
166
166
  T as c
167
167
  };
168
- //# sourceMappingURL=alert.BvSx_Bi7.js.map
168
+ //# sourceMappingURL=alert.DZFWFceT.js.map
package/dist/chunks/{alert.BvSx_Bi7.js.map → alert.DZFWFceT.js.map} RENAMED
@@ -1 +1 @@
1
- {"version":3,"file":"alert.BvSx_Bi7.js","sources":["../../../vue2/src/components/alert/alert.types.ts","../../../../node_modules/.pnpm/@adyen+ui-assets-icons-16@4.1.0_vue@2.7.16/node_modules/@adyen/ui-assets-icons-16/dist/vue/info-filled.vue","../../../vue2/src/components/alert/alert.vue"],"sourcesContent":["/**\n * @deprecated for usage with properties since version 2.0. Use the string literal instead.\n */\nexport enum BentoAlertVariant {\n DEFAULT = 'default',\n TIP = 'tip',\n}\n\n/**\n * @deprecated for usage with properties since version 2.0. Use the string literal instead.\n */\nexport enum BentoAlertTypeOption {\n WARNING = 'warning',\n CRITICAL = 'critical',\n HIGHLIGHT = 'highlight',\n SUCCESS = 'success',\n}\n\n/**\n * @deprecated from version 2.0.0. Use \"@close-alert\" instead.\n */\nexport enum BentoAlertEvent {\n CLOSE_ALERT = 'close-alert',\n}\n","\n<template>\n <svg role=\"img\" v-bind=\"$attrs\" class=\"ui-assets-icons-16\" xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" fill=\"none\"><title v-if=\"$attrs['svg-title']\">{{ $attrs['svg-title'] }}</title><g :clip-path=\"'url(#uia-icons-16-info_filled__a' + uuid + ')'\"><path fill=\"#00112C\" d=\"M5.0342 0.839937C6.45033 0.253358 8.00859 0.0998821 9.51195 0.398918C11.0153 0.697953 12.3962 1.43607 13.4801 2.51993C14.5639 3.60378 15.3021 4.9847 15.6011 6.48805C15.9001 7.99141 15.7466 9.54967 15.1601 10.9658C14.5735 12.3819 13.5801 13.5923 12.3057 14.4439C11.0312 15.2955 9.53281 15.75 8 15.75C5.94457 15.75 3.97333 14.9335 2.51992 13.4801C1.06652 12.0267 0.25 10.0554 0.25 8C0.25 6.4672 0.704529 4.96881 1.55611 3.69433C2.40769 2.41985 3.61808 1.42652 5.0342 0.839937ZM8.75 4.5C8.75 4.23478 8.64464 3.98043 8.45711 3.79289C8.26957 3.60536 8.01522 3.5 7.75 3.5C7.55222 3.5 7.35888 3.55865 7.19443 3.66853C7.02998 3.77841 6.90181 3.93459 6.82612 4.11732C6.75043 4.30004 6.73063 4.50111 6.76921 4.69509C6.8078 4.88907 6.90304 5.06725 7.04289 5.20711C7.18275 5.34696 7.36093 5.4422 7.55491 5.48079C7.74889 5.51937 7.94996 5.49957 8.13268 5.42388C8.31541 5.34819 8.47159 5.22002 8.58147 5.05557C8.69135 4.89112 8.75 4.69778 8.75 4.5ZM8.75 6.25H6.25V7.75H7.25V10.25H6.25V11.75H9.75V10.25H8.75V6.25Z\"/></g><defs><clipPath :id=\"'uia-icons-16-info_filled__a' + uuid\"><rect width=\"16\" height=\"16\" fill=\"#fff\"/></clipPath></defs></svg>\n</template>\n<script>\n let uuid = 0;\n\n export default {\n beforeCreate() {\n this.uuid = uuid.toString();\n uuid += 1;\n },\n };\n</script>\n<style>\n @import '../css/main.css';\n</style>\n","<template>\n <div class=\"b-alert\" :role=\"computedRole\">\n <div class=\"b-alert__inner-container\" :class=\"alertConditionalClasses\">\n <div class=\"b-alert__icon\">\n <component :is=\"iconComponent\" aria-hidden=\"true\" :svg-title=\"iconSvgTitle\" />\n </div>\n\n <div class=\"b-alert__content\">\n <bento-typography\n v-if=\"hasSlot('default') && !isTipVariant\"\n class=\"b-alert__title\"\n el=\"div\"\n variant=\"body\"\n strongest\n wide\n >\n <slot />\n </bento-typography>\n\n <bento-typography\n v-if=\"hasSlot('description')\"\n class=\"b-alert__description\"\n v-bind=\"descriptionTypography\"\n data-testid=\"alert-description\"\n >\n <slot name=\"description\" />\n </bento-typography>\n\n <div v-if=\"hasSlot('actions') && !isTipVariant\" class=\"b-alert__actions\" data-testid=\"alert-actions\">\n <slot name=\"actions\" />\n </div>\n </div>\n\n <bento-button\n v-if=\"closeButton && !isTipVariant\"\n class=\"b-alert__close-button\"\n variant=\"tertiary\"\n type=\"button\"\n @click=\"onCloseButtonClick\"\n >\n <cross-small :svg-title=\"t('close')\" />\n </bento-button>\n </div>\n </div>\n</template>\n\n<script setup lang=\"ts\">\n import { computed, onMounted, useSlots } from 'vue';\n\n // Component\n import { BentoAlertEvent, BentoAlertTypeOption, BentoAlertVariant } from '@/components/alert/alert.types';\n import { BentoTypography, BentoTypographyElement, BentoTypographyVariant } from '@/components/typography';\n import { BentoButton } from '@/components/button';\n\n import CrossSmall from '@adyen/ui-assets-icons-16/vue/cross-small';\n import Warning from '@adyen/ui-assets-icons-16/vue/warning-filled';\n import CrossCircle from '@adyen/ui-assets-icons-16/vue/cross-circle-fill';\n import CheckedCircle from '@adyen/ui-assets-icons-16/vue/checkmark-circle-fill';\n import Info from '@adyen/ui-assets-icons-16/vue/info-filled';\n\n // Utils\n import { useHasSlot } from '@/composables';\n import { useI18n } from '@/utils/ts/i18n';\n\n import messages from './messages.json';\n\n type MessageSchema = (typeof messages)['en-US'];\n\n const slots = useSlots();\n const hasSlot = useHasSlot(slots);\n\n const emit = defineEmits<{\n /**\n * Emits event when the alert is closed. `closeButton` must be `true`\n */\n (e: 'close-alert');\n }>();\n\n const props = withDefaults(\n defineProps<{\n /**\n * Adds a close button on the right side of the alert\n */\n closeButton?: boolean;\n\n /**\n * Type of a alert; set a distinctive icon and color. Defaults to highlight.\n * @values HIGHLIGHT, SUCCESS, CRITICAL, WARNING\n */\n type?: BentoAlertTypeOption | `${BentoAlertTypeOption}`;\n\n /**\n * Variant for the alert\n * @values DEFAULT, TIP\n */\n variant?: BentoAlertVariant | `${BentoAlertVariant}`;\n }>(),\n {\n closeButton: false,\n type: BentoAlertTypeOption.HIGHLIGHT,\n variant: BentoAlertVariant.DEFAULT,\n }\n );\n\n const { t } = useI18n<{ message: MessageSchema }>({ messages });\n\n const isTipVariant = computed(() => props.variant === BentoAlertVariant.TIP);\n\n const alertConditionalClasses = computed(() => ({\n [`b-alert--${props.type}`]: props.type,\n [`b-alert--${BentoAlertVariant.TIP}`]: isTipVariant.value,\n }));\n\n const iconSvgTitle = computed(() => t(`${props.type}Icon`));\n\n const iconComponent = computed(() => {\n switch (props.type) {\n case BentoAlertTypeOption.CRITICAL:\n return CrossCircle;\n case BentoAlertTypeOption.SUCCESS:\n return CheckedCircle;\n case BentoAlertTypeOption.WARNING:\n return Warning;\n case BentoAlertTypeOption.HIGHLIGHT:\n default:\n return Info;\n }\n });\n\n const descriptionTypography = computed(() => ({\n el: BentoTypographyElement.DIV,\n variant: isTipVariant.value ? BentoTypographyVariant.CAPTION : BentoTypographyVariant.BODY,\n wide: true,\n }));\n\n const computedRole = computed(() => (props.type === BentoAlertTypeOption.HIGHLIGHT ? 'status' : 'alert'));\n\n const onCloseButtonClick = () => {\n emit(BentoAlertEvent.CLOSE_ALERT);\n };\n\n onMounted(() => {\n if (!slots.default && !slots.description) {\n throw new Error('Alert Component requires a title or a description');\n }\n });\n</script>\n\n<script lang=\"ts\">\n /**\n * An Alert component is used to display a persistent\n * notification containing information important to the user\n *\n * @example\n * import { BentoAlert, BentoAlertTypeOption } from '@adyen/bento-vue2';\n *\n * export default {\n * components: { BentoAlert },\n * template: `\n * <bento-alert type=\"highlight\">\n * Title of the Alert\n * </bento-alert>\n * `\n * }\n */\n export default {\n i18n: { messages },\n name: 'bento-alert',\n };\n</script>\n\n<style lang=\"scss\" scoped src=\"./alert.scss\" />\n"],"names":["BentoAlertVariant","BentoAlertVariant2","BentoAlertTypeOption","BentoAlertTypeOption2","BentoAlertEvent","BentoAlertEvent2","uuid","_hoisted_2$1","_hoisted_3$1","openBlock","createElementBlock","mergeProps","_ctx","createCommentVNode","__default__","messages","slots","useSlots","hasSlot","useHasSlot","emit","__emit","props","__props","t","useI18n","isTipVariant","computed","alertConditionalClasses","iconSvgTitle","iconComponent","CrossCircleFillIcon","CheckmarkIcon","WarningIcon","Info","descriptionTypography","BentoTypographyElement","BentoTypographyVariant","computedRole","onCloseButtonClick","onMounted"],"mappings":";;;;;;;;;;;AAGY,IAAAA,IAAA,kBAAAC,OACRA,EAAA,UAAA,WACAA,EAAA,MAAA,OAFQA,IAAAD,KAAA,CAAA,CAAA,GAQAE,IAAA,kBAAAC,OACRA,EAAA,UAAA,WACAA,EAAA,WAAA,YACAA,EAAA,YAAA,aACAA,EAAA,UAAA,WAJQA,IAAAD,KAAA,CAAA,CAAA,GAUAE,IAAA,kBAAAC,OACRA,EAAA,cAAA,eADQA,IAAAD,KAAA,CAAA,CAAA;AChBR,IAAAE,IAAA;;EAGI,eAAA;8BAEIA,KAAA;AAAA;mBAVZC,IAAA,CAAA,WAAA,GAAAC,IAAA,CAAA,IAAA;;AAEI,SAAAC,EAAA,GAAAC,EAAA,OAAAC,EAAA,EAAA,MAAA,MAAA,GAAAC,EAAA,QAAA;AAAA,IAAgC,OAAA;AAAA,IAA2B,OAAA;AAAA,IAAmC,OAAA;AAAA,IAAW,QAAA;AAAA,IAAY,MAAA;AAAA;gFAFzHC,EAAA,IAAA,EAAA;AAAA;MAE4M,aAAA,qCAAAD,EAAA,OAAA;AAAA;;QAAkE,MAAA;AAAA,QAAe,GAAA;AAAA;IAF7R,IAAA,GAAAL,CAAA;AAAA;;QAE8xC,IAAA,gCAAAK,EAAA;AAAA;;UAAgD,OAAA;AAAA,UAAW,QAAA;AAAA,UAAY,MAAA;AAAA;MAFr2C,IAAA,GAAAJ,CAAA;AAAA;;;;;;;;;;;;;;;;;;;;;GCqKIM,KAAA;AAAA,EAAe,MAAA,EAAA,UAAAC,EAAA;AAAA,EACM,MAAA;AAErB;;;;;;;;;AApGA,UAAAC,IAAAC,EAAA,GACAC,IAAAC,EAAAH,CAAA,GAEAI,IAAAC,GAOAC,IAAAC,GA0BA,EAAA,GAAAC,EAAA,IAAAC,EAAA,EAAA,UAAAV,EAAA,CAAA,GAEAW,IAAAC,EAAA,MAAAL,EAAA,YAAAtB,EAAA,GAAA,GAEA4B,IAAAD,EAAA,OAAA;AAAA,MAAgD,CAAA,YAAAL,EAAA,IAAA,EAAA,GAAAA,EAAA;AAAA,MACV,CAAA,YAAAtB,EAAA,GAAA,EAAA,GAAA0B,EAAA;AAAA,IACkB,EAAA,GAGxDG,IAAAF,EAAA,MAAAH,EAAA,GAAAF,EAAA,IAAA,MAAA,CAAA,GAEAQ,IAAAH,EAAA,MAAA;AACI,cAAAL,EAAA,MAAA;AAAA,QAAoB,KAAApB,EAAA;AAEZ,iBAAA6B;AAAA,QAAO,KAAA7B,EAAA;AAEP,iBAAA8B;AAAA,QAAO,KAAA9B,EAAA;AAEP,iBAAA+B;AAAA,QAAO,KAAA/B,EAAA;AAAA,QACe;AAEtB,iBAAAgC;AAAA,MAAO;AAAA,IACf,CAAA,GAGJC,IAAAR,EAAA,OAAA;AAAA,MAA8C,IAAAS,EAAA;AAAA,MACf,SAAAV,EAAA,QAAAW,EAAA,UAAAA,EAAA;AAAA,MAC2D,MAAA;AAAA,IAChF,EAAA,GAGVC,IAAAX,EAAA,MAAAL,EAAA,SAAApB,EAAA,YAAA,WAAA,OAAA,GAEAqC,IAAA,MAAA;AACI,MAAAnB,EAAAhB,EAAA,WAAA;AAAA,IAAgC;AAGpC,WAAAoC,EAAA,MAAA;AACI,UAAA,CAAAxB,EAAA,WAAA,CAAAA,EAAA;AACI,cAAA,IAAA,MAAA,mDAAA;AAAA,IACJ,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","x_google_ignoreList":[1]}
1
+ {"version":3,"file":"alert.DZFWFceT.js","sources":["../../../vue2/src/components/alert/alert.types.ts","../../../../node_modules/.pnpm/@adyen+ui-assets-icons-16@4.1.0_vue@2.7.16/node_modules/@adyen/ui-assets-icons-16/dist/vue/info-filled.vue","../../../vue2/src/components/alert/alert.vue"],"sourcesContent":["/**\n * @deprecated for usage with properties since version 2.0. Use the string literal instead.\n */\nexport enum BentoAlertVariant {\n DEFAULT = 'default',\n TIP = 'tip',\n}\n\n/**\n * @deprecated for usage with properties since version 2.0. Use the string literal instead.\n */\nexport enum BentoAlertTypeOption {\n WARNING = 'warning',\n CRITICAL = 'critical',\n HIGHLIGHT = 'highlight',\n SUCCESS = 'success',\n}\n\n/**\n * @deprecated from version 2.0.0. Use \"@close-alert\" instead.\n */\nexport enum BentoAlertEvent {\n CLOSE_ALERT = 'close-alert',\n}\n","\n<template>\n <svg role=\"img\" v-bind=\"$attrs\" class=\"ui-assets-icons-16\" xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" fill=\"none\"><title v-if=\"$attrs['svg-title']\">{{ $attrs['svg-title'] }}</title><g :clip-path=\"'url(#uia-icons-16-info_filled__a' + uuid + ')'\"><path fill=\"#00112C\" d=\"M5.0342 0.839937C6.45033 0.253358 8.00859 0.0998821 9.51195 0.398918C11.0153 0.697953 12.3962 1.43607 13.4801 2.51993C14.5639 3.60378 15.3021 4.9847 15.6011 6.48805C15.9001 7.99141 15.7466 9.54967 15.1601 10.9658C14.5735 12.3819 13.5801 13.5923 12.3057 14.4439C11.0312 15.2955 9.53281 15.75 8 15.75C5.94457 15.75 3.97333 14.9335 2.51992 13.4801C1.06652 12.0267 0.25 10.0554 0.25 8C0.25 6.4672 0.704529 4.96881 1.55611 3.69433C2.40769 2.41985 3.61808 1.42652 5.0342 0.839937ZM8.75 4.5C8.75 4.23478 8.64464 3.98043 8.45711 3.79289C8.26957 3.60536 8.01522 3.5 7.75 3.5C7.55222 3.5 7.35888 3.55865 7.19443 3.66853C7.02998 3.77841 6.90181 3.93459 6.82612 4.11732C6.75043 4.30004 6.73063 4.50111 6.76921 4.69509C6.8078 4.88907 6.90304 5.06725 7.04289 5.20711C7.18275 5.34696 7.36093 5.4422 7.55491 5.48079C7.74889 5.51937 7.94996 5.49957 8.13268 5.42388C8.31541 5.34819 8.47159 5.22002 8.58147 5.05557C8.69135 4.89112 8.75 4.69778 8.75 4.5ZM8.75 6.25H6.25V7.75H7.25V10.25H6.25V11.75H9.75V10.25H8.75V6.25Z\"/></g><defs><clipPath :id=\"'uia-icons-16-info_filled__a' + uuid\"><rect width=\"16\" height=\"16\" fill=\"#fff\"/></clipPath></defs></svg>\n</template>\n<script>\n let uuid = 0;\n\n export default {\n beforeCreate() {\n this.uuid = uuid.toString();\n uuid += 1;\n },\n };\n</script>\n<style>\n @import '../css/main.css';\n</style>\n","<template>\n <div class=\"b-alert\" :role=\"computedRole\">\n <div class=\"b-alert__inner-container\" :class=\"alertConditionalClasses\">\n <div class=\"b-alert__icon\">\n <component :is=\"iconComponent\" aria-hidden=\"true\" :svg-title=\"iconSvgTitle\" />\n </div>\n\n <div class=\"b-alert__content\">\n <bento-typography\n v-if=\"hasSlot('default') && !isTipVariant\"\n class=\"b-alert__title\"\n el=\"div\"\n variant=\"body\"\n strongest\n wide\n >\n <slot />\n </bento-typography>\n\n <bento-typography\n v-if=\"hasSlot('description')\"\n class=\"b-alert__description\"\n v-bind=\"descriptionTypography\"\n data-testid=\"alert-description\"\n >\n <slot name=\"description\" />\n </bento-typography>\n\n <div v-if=\"hasSlot('actions') && !isTipVariant\" class=\"b-alert__actions\" data-testid=\"alert-actions\">\n <slot name=\"actions\" />\n </div>\n </div>\n\n <bento-button\n v-if=\"closeButton && !isTipVariant\"\n class=\"b-alert__close-button\"\n variant=\"tertiary\"\n type=\"button\"\n @click=\"onCloseButtonClick\"\n >\n <cross-small :svg-title=\"t('close')\" />\n </bento-button>\n </div>\n </div>\n</template>\n\n<script setup lang=\"ts\">\n import { computed, onMounted, useSlots } from 'vue';\n\n // Component\n import { BentoAlertEvent, BentoAlertTypeOption, BentoAlertVariant } from '@/components/alert/alert.types';\n import { BentoTypography, BentoTypographyElement, BentoTypographyVariant } from '@/components/typography';\n import { BentoButton } from '@/components/button';\n\n import CrossSmall from '@adyen/ui-assets-icons-16/vue/cross-small';\n import Warning from '@adyen/ui-assets-icons-16/vue/warning-filled';\n import CrossCircle from '@adyen/ui-assets-icons-16/vue/cross-circle-fill';\n import CheckedCircle from '@adyen/ui-assets-icons-16/vue/checkmark-circle-fill';\n import Info from '@adyen/ui-assets-icons-16/vue/info-filled';\n\n // Utils\n import { useHasSlot } from '@/composables';\n import { useI18n } from '@/utils/ts/i18n';\n\n import messages from './messages.json';\n\n type MessageSchema = (typeof messages)['en-US'];\n\n const slots = useSlots();\n const hasSlot = useHasSlot(slots);\n\n const emit = defineEmits<{\n /**\n * Emits event when the alert is closed. `closeButton` must be `true`\n */\n (e: 'close-alert');\n }>();\n\n const props = withDefaults(\n defineProps<{\n /**\n * Adds a close button on the right side of the alert\n */\n closeButton?: boolean;\n\n /**\n * Type of a alert; set a distinctive icon and color. Defaults to highlight.\n * @values HIGHLIGHT, SUCCESS, CRITICAL, WARNING\n */\n type?: BentoAlertTypeOption | `${BentoAlertTypeOption}`;\n\n /**\n * Variant for the alert\n * @values DEFAULT, TIP\n */\n variant?: BentoAlertVariant | `${BentoAlertVariant}`;\n }>(),\n {\n closeButton: false,\n type: BentoAlertTypeOption.HIGHLIGHT,\n variant: BentoAlertVariant.DEFAULT,\n }\n );\n\n const { t } = useI18n<{ message: MessageSchema }>({ messages });\n\n const isTipVariant = computed(() => props.variant === BentoAlertVariant.TIP);\n\n const alertConditionalClasses = computed(() => ({\n [`b-alert--${props.type}`]: props.type,\n [`b-alert--${BentoAlertVariant.TIP}`]: isTipVariant.value,\n }));\n\n const iconSvgTitle = computed(() => t(`${props.type}Icon`));\n\n const iconComponent = computed(() => {\n switch (props.type) {\n case BentoAlertTypeOption.CRITICAL:\n return CrossCircle;\n case BentoAlertTypeOption.SUCCESS:\n return CheckedCircle;\n case BentoAlertTypeOption.WARNING:\n return Warning;\n case BentoAlertTypeOption.HIGHLIGHT:\n default:\n return Info;\n }\n });\n\n const descriptionTypography = computed(() => ({\n el: BentoTypographyElement.DIV,\n variant: isTipVariant.value ? BentoTypographyVariant.CAPTION : BentoTypographyVariant.BODY,\n wide: true,\n }));\n\n const computedRole = computed(() => (props.type === BentoAlertTypeOption.HIGHLIGHT ? 'status' : 'alert'));\n\n const onCloseButtonClick = () => {\n emit(BentoAlertEvent.CLOSE_ALERT);\n };\n\n onMounted(() => {\n if (!slots.default && !slots.description) {\n throw new Error('Alert Component requires a title or a description');\n }\n });\n</script>\n\n<script lang=\"ts\">\n /**\n * An Alert component is used to display a persistent\n * notification containing information important to the user\n *\n * @example\n * import { BentoAlert, BentoAlertTypeOption } from '@adyen/bento-vue2';\n *\n * export default {\n * components: { BentoAlert },\n * template: `\n * <bento-alert type=\"highlight\">\n * Title of the Alert\n * </bento-alert>\n * `\n * }\n */\n export default {\n i18n: { messages },\n name: 'bento-alert',\n };\n</script>\n\n<style lang=\"scss\" scoped src=\"./alert.scss\" />\n"],"names":["BentoAlertVariant","BentoAlertVariant2","BentoAlertTypeOption","BentoAlertTypeOption2","BentoAlertEvent","BentoAlertEvent2","uuid","_hoisted_2$1","_hoisted_3$1","openBlock","createElementBlock","mergeProps","_ctx","createCommentVNode","__default__","messages","slots","useSlots","hasSlot","useHasSlot","emit","__emit","props","__props","t","useI18n","isTipVariant","computed","alertConditionalClasses","iconSvgTitle","iconComponent","CrossCircleFillIcon","CheckmarkIcon","WarningIcon","Info","descriptionTypography","BentoTypographyElement","BentoTypographyVariant","computedRole","onCloseButtonClick","onMounted"],"mappings":";;;;;;;;;;;AAGY,IAAAA,IAAA,kBAAAC,OACRA,EAAA,UAAA,WACAA,EAAA,MAAA,OAFQA,IAAAD,KAAA,CAAA,CAAA,GAQAE,IAAA,kBAAAC,OACRA,EAAA,UAAA,WACAA,EAAA,WAAA,YACAA,EAAA,YAAA,aACAA,EAAA,UAAA,WAJQA,IAAAD,KAAA,CAAA,CAAA,GAUAE,IAAA,kBAAAC,OACRA,EAAA,cAAA,eADQA,IAAAD,KAAA,CAAA,CAAA;AChBR,IAAAE,IAAA;;EAGI,eAAA;8BAEIA,KAAA;AAAA;mBAVZC,IAAA,CAAA,WAAA,GAAAC,IAAA,CAAA,IAAA;;AAEI,SAAAC,EAAA,GAAAC,EAAA,OAAAC,EAAA,EAAA,MAAA,MAAA,GAAAC,EAAA,QAAA;AAAA,IAAgC,OAAA;AAAA,IAA2B,OAAA;AAAA,IAAmC,OAAA;AAAA,IAAW,QAAA;AAAA,IAAY,MAAA;AAAA;gFAFzHC,EAAA,IAAA,EAAA;AAAA;MAE4M,aAAA,qCAAAD,EAAA,OAAA;AAAA;;QAAkE,MAAA;AAAA,QAAe,GAAA;AAAA;IAF7R,IAAA,GAAAL,CAAA;AAAA;;QAE8xC,IAAA,gCAAAK,EAAA;AAAA;;UAAgD,OAAA;AAAA,UAAW,QAAA;AAAA,UAAY,MAAA;AAAA;MAFr2C,IAAA,GAAAJ,CAAA;AAAA;;;;;;;;;;;;;;;;;;;;;GCqKIM,KAAA;AAAA,EAAe,MAAA,EAAA,UAAAC,EAAA;AAAA,EACM,MAAA;AAErB;;;;;;;;;AApGA,UAAAC,IAAAC,EAAA,GACAC,IAAAC,EAAAH,CAAA,GAEAI,IAAAC,GAOAC,IAAAC,GA0BA,EAAA,GAAAC,EAAA,IAAAC,EAAA,EAAA,UAAAV,EAAA,CAAA,GAEAW,IAAAC,EAAA,MAAAL,EAAA,YAAAtB,EAAA,GAAA,GAEA4B,IAAAD,EAAA,OAAA;AAAA,MAAgD,CAAA,YAAAL,EAAA,IAAA,EAAA,GAAAA,EAAA;AAAA,MACV,CAAA,YAAAtB,EAAA,GAAA,EAAA,GAAA0B,EAAA;AAAA,IACkB,EAAA,GAGxDG,IAAAF,EAAA,MAAAH,EAAA,GAAAF,EAAA,IAAA,MAAA,CAAA,GAEAQ,IAAAH,EAAA,MAAA;AACI,cAAAL,EAAA,MAAA;AAAA,QAAoB,KAAApB,EAAA;AAEZ,iBAAA6B;AAAA,QAAO,KAAA7B,EAAA;AAEP,iBAAA8B;AAAA,QAAO,KAAA9B,EAAA;AAEP,iBAAA+B;AAAA,QAAO,KAAA/B,EAAA;AAAA,QACe;AAEtB,iBAAAgC;AAAA,MAAO;AAAA,IACf,CAAA,GAGJC,IAAAR,EAAA,OAAA;AAAA,MAA8C,IAAAS,EAAA;AAAA,MACf,SAAAV,EAAA,QAAAW,EAAA,UAAAA,EAAA;AAAA,MAC2D,MAAA;AAAA,IAChF,EAAA,GAGVC,IAAAX,EAAA,MAAAL,EAAA,SAAApB,EAAA,YAAA,WAAA,OAAA,GAEAqC,IAAA,MAAA;AACI,MAAAnB,EAAAhB,EAAA,WAAA;AAAA,IAAgC;AAGpC,WAAAoC,EAAA,MAAA;AACI,UAAA,CAAAxB,EAAA,WAAA,CAAAA,EAAA;AACI,cAAA,IAAA,MAAA,mDAAA;AAAA,IACJ,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","x_google_ignoreList":[1]}
package/dist/chunks/{avatar.8erKxh8t.js → avatar.7gix8dxp.js} RENAMED
@@ -1,5 +1,5 @@
1
1
  import { ref as k, computed as r, defineComponent as _, toRefs as f, openBlock as l, createElementBlock as i, normalizeClass as R, createVNode as b, unref as n, withCtx as L, createTextVNode as h, toDisplayString as y, createBlock as B, createCommentVNode as S } from "vue";
2
- import { B as E } from "./typography.z9P0Ec3Q.js";
2
+ import { B as E } from "./typography.CE5PgxFf.js";
3
3
  import { _ as g } from "./_plugin-vue_export-helper.CHgC5LLL.js";
4
4
  import "../assets/avatar.css";
5
5
  const O = (a) => {
@@ -91,4 +91,4 @@ const N = ["src"], U = {
91
91
  export {
92
92
  V as B
93
93
  };
94
- //# sourceMappingURL=avatar.8erKxh8t.js.map
94
+ //# sourceMappingURL=avatar.7gix8dxp.js.map
package/dist/chunks/{avatar.8erKxh8t.js.map → avatar.7gix8dxp.js.map} RENAMED
@@ -1 +1 @@
1
- {"version":3,"file":"avatar.8erKxh8t.js","sources":["../../../vue2/src/composables/initials.ts","../../../vue2/src/components/avatar/components/avatar-image/avatar-image.types.ts","../../../vue2/src/components/avatar/components/avatar-image/avatar-image.vue","../../../vue2/src/components/avatar/avatar.vue"],"sourcesContent":["import { computed, ComputedRef, ref } from 'vue';\nimport { MaybeRef } from '@/types';\n\n/** Extracts the first letter of a username\n * @param username - The name to return the initials of\n * Common patterns:\n * 1. John => J\n * 2. John Smith => J\n * John Smith Doe Holly => J\n */\nexport const useInitials = (username: MaybeRef<string | null>): ComputedRef<string | null> => {\n const computedUsername = ref(username);\n return computed(() => (computedUsername.value ? computedUsername.value.trim().charAt(0).toUpperCase() : null));\n};\n","export enum BentoAvatarImageVariant {\n LARGE = 'large',\n SMALL = 'small',\n}\n\nexport enum BentoAvatarImageColor {\n BLUE = 'blue',\n GREEN = 'green',\n RED = 'red',\n YELLOW = 'yellow',\n}\n","<template>\n <div class=\"b-avatar-image\" :class=\"conditionalClasses\" aria-hidden=\"true\" data-testid=\"avatar\">\n <img v-if=\"src\" :src=\"src\" class=\"b-avatar-image__image\" alt=\"\" data-testid=\"avatar-content\" />\n <div v-else class=\"b-avatar-image__default\" data-testid=\"avatar-content\">\n <bento-typography el=\"span\" variant=\"body\" strongest>\n {{ initials }}\n </bento-typography>\n </div>\n </div>\n</template>\n\n<script setup lang=\"ts\">\n import { computed, toRefs } from 'vue';\n import { BentoAvatarImageColor, BentoAvatarImageVariant } from './avatar-image.types';\n import { BentoTypography } from '@/components/typography';\n import { useInitials } from '@/composables';\n\n const props = withDefaults(\n defineProps<{\n /**\n * Avatar color. Defaults to yellow.\n */\n color?: BentoAvatarImageColor;\n\n /**\n * Image src to load the profile picture.\n */\n src?: string;\n\n /**\n * Name of the user that will be used to extract initials to display default value.\n * John => J\n * John Smith => JS\n * John Smith Doe => JD\n * John Smith Doe Holly => JH\n */\n username?: string;\n\n /**\n * Variants supported for small and large.\n * Default - large\n */\n variant?: BentoAvatarImageVariant;\n }>(),\n {\n color: BentoAvatarImageColor.YELLOW,\n src: null,\n username: null,\n variant: BentoAvatarImageVariant.LARGE,\n }\n );\n\n const { username } = toRefs(props);\n const initials = useInitials(username);\n\n const conditionalClasses = computed(() => ({\n [`b-avatar-image--${BentoAvatarImageVariant.SMALL}`]: props.variant === BentoAvatarImageVariant.SMALL,\n [`b-avatar-image--${props.color}`]: props.color,\n }));\n</script>\n\n<script lang=\"ts\">\n /**\n * Image used as user profile inside bento-avatar.\n *\n * @example\n * import { AvatarImage } from './components/avatar-image';\n *\n * export default {\n * components: { AvatarImage },\n * template: `<avatar-image :src=\"userAvatarSrc\" username=\"Jane\" />`\n * }\n */\n export default {};\n</script>\n\n<style lang=\"scss\" scoped src=\"./avatar-image.scss\" />\n","<template>\n <div class=\"b-avatar\" :aria-label=\"computedAriaLabel\">\n <avatar-image\n :src=\"src\"\n :username=\"computedUsername\"\n :variant=\"BentoAvatarImageVariant.SMALL\"\n :color=\"avatarColor\"\n />\n <bento-typography v-if=\"!iconOnly\" class=\"b-avatar__label\" el=\"span\" variant=\"body\">\n {{ username }}\n </bento-typography>\n </div>\n</template>\n\n<script setup lang=\"ts\">\n import { computed, toRefs } from 'vue';\n import { AvatarImage, BentoAvatarImageColor, BentoAvatarImageVariant } from './components/avatar-image';\n import { BentoTypography } from '@/components/typography';\n import { useInitials } from '@/composables';\n\n const props = withDefaults(\n defineProps<{\n /**\n * Displays the user profile without the label.\n */\n iconOnly?: boolean;\n\n /**\n * Image src to load the profile picture.\n */\n src?: string;\n\n /**\n * Name of the user that will be used both in the label and to extract initials to display default value.\n * John => J\n * John Smith => JS\n * John Smith Doe => JD\n * John Smith Doe Holly => JH\n */\n username: string;\n }>(),\n {\n iconOnly: false,\n src: null,\n }\n );\n\n const { username } = toRefs(props);\n\n const computedAriaLabel = computed(() => (props.iconOnly ? props.username : null));\n const computedUsername = computed(() => (!props.src ? props.username : null));\n const initials = useInitials(username);\n\n // Returns the UTF-16 char code\n const charCode = computed(() => (initials.value ? initials.value.charCodeAt(0) - 65 : null));\n\n // Returns a computed color based on the letter passed\n const avatarColor = computed(() => {\n const numberOfAlphabetLetters = 26;\n const numberOfColors = Object.keys(BentoAvatarImageColor).length;\n const rangeStep = numberOfAlphabetLetters / numberOfColors;\n\n if (charCode.value <= rangeStep) {\n return BentoAvatarImageColor.YELLOW;\n }\n if (charCode.value <= rangeStep * 2) {\n return BentoAvatarImageColor.BLUE;\n }\n if (charCode.value <= rangeStep * 3) {\n return BentoAvatarImageColor.GREEN;\n }\n return BentoAvatarImageColor.RED;\n });\n</script>\n\n<script lang=\"ts\">\n /**\n * Displays an user profile including an avatar and optionally a label.\n *\n * @example\n * import { BentoAvatar } from '@adyen/bento-vue2';\n *\n * export default {\n * components: { BentoAvatar },\n * template: `<bento-avatar :src=\"userAvatarSrc\" username=\"Jane\" />`\n * }\n */\n export default {\n name: 'bento-avatar',\n };\n</script>\n\n<style lang=\"scss\" scoped src=\"./avatar.scss\" />\n"],"names":["useInitials","username","computedUsername","ref","computed","BentoAvatarImageVariant","BentoAvatarImageVariant2","BentoAvatarImageColor","BentoAvatarImageColor2","__default__$1","props","__props","toRefs","initials","conditionalClasses","__default__","computedAriaLabel","charCode","avatarColor","rangeStep"],"mappings":";;;;AAUa,MAAAA,IAAA,CAAAC,MAAA;AACT,QAAAC,IAAAC,EAAAF,CAAA;AACA,SAAAG,EAAA,MAAAF,EAAA,QAAAA,EAAA,MAAA,KAAA,EAAA,OAAA,CAAA,EAAA,YAAA,IAAA,IAAA;AACJ;ACbY,IAAAG,IAAA,kBAAAC,OACRA,EAAA,QAAA,SACAA,EAAA,QAAA,SAFQA,IAAAD,KAAA,CAAA,CAAA,GAKAE,IAAA,kBAAAC,OACRA,EAAA,OAAA,QACAA,EAAA,QAAA,SACAA,EAAA,MAAA,OACAA,EAAA,SAAA,UAJQA,IAAAD,KAAA,CAAA,CAAA;;;;;GCoERE,IAAA,CAAA;;;;;;;;;;AAxDA,UAAAC,IAAAC,GAmCA,EAAA,UAAAV,EAAA,IAAAW,EAAAF,CAAA,GACAG,IAAAb,EAAAC,CAAA,GAEAa,IAAAV,EAAA,OAAA;AAAA,MAA2C,CAAA,mBAAAC,EAAA,KAAA,EAAA,GAAAK,EAAA,YAAAL,EAAA;AAAA,MACyD,CAAA,mBAAAK,EAAA,KAAA,EAAA,GAAAA,EAAA;AAAA,IACtD,EAAA;;;;;;;;;;;;;;;;;;;;;;;;;;sFC8B9CK,IAAA;AAAA,EAAe,MAAA;AAEf;;;;;;;;AArEA,UAAAL,IAAAC,GA2BA,EAAA,UAAAV,EAAA,IAAAW,EAAAF,CAAA,GAEAM,IAAAZ,EAAA,MAAAM,EAAA,WAAAA,EAAA,WAAA,IAAA,GACAR,IAAAE,EAAA,MAAAM,EAAA,MAAA,OAAAA,EAAA,QAAA,GACAG,IAAAb,EAAAC,CAAA,GAGAgB,IAAAb,EAAA,MAAAS,EAAA,QAAAA,EAAA,MAAA,WAAA,CAAA,IAAA,KAAA,IAAA,GAGAK,IAAAd,EAAA,MAAA;AAGI,YAAAe,IAAA,KADA,OAAA,KAAAZ,CAAA,EAAA;AAGA,aAAAU,EAAA,SAAAE,IACIZ,EAAA,SAEJU,EAAA,SAAAE,IAAA,IACIZ,EAAA,OAEJU,EAAA,SAAAE,IAAA,IACIZ,EAAA,QAEJA,EAAA;AAAA,IAA6B,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;"}
1
+ {"version":3,"file":"avatar.7gix8dxp.js","sources":["../../../vue2/src/composables/initials.ts","../../../vue2/src/components/avatar/components/avatar-image/avatar-image.types.ts","../../../vue2/src/components/avatar/components/avatar-image/avatar-image.vue","../../../vue2/src/components/avatar/avatar.vue"],"sourcesContent":["import { computed, ComputedRef, ref } from 'vue';\nimport { MaybeRef } from '@/types';\n\n/** Extracts the first letter of a username\n * @param username - The name to return the initials of\n * Common patterns:\n * 1. John => J\n * 2. John Smith => J\n * John Smith Doe Holly => J\n */\nexport const useInitials = (username: MaybeRef<string | null>): ComputedRef<string | null> => {\n const computedUsername = ref(username);\n return computed(() => (computedUsername.value ? computedUsername.value.trim().charAt(0).toUpperCase() : null));\n};\n","export enum BentoAvatarImageVariant {\n LARGE = 'large',\n SMALL = 'small',\n}\n\nexport enum BentoAvatarImageColor {\n BLUE = 'blue',\n GREEN = 'green',\n RED = 'red',\n YELLOW = 'yellow',\n}\n","<template>\n <div class=\"b-avatar-image\" :class=\"conditionalClasses\" aria-hidden=\"true\" data-testid=\"avatar\">\n <img v-if=\"src\" :src=\"src\" class=\"b-avatar-image__image\" alt=\"\" data-testid=\"avatar-content\" />\n <div v-else class=\"b-avatar-image__default\" data-testid=\"avatar-content\">\n <bento-typography el=\"span\" variant=\"body\" strongest>\n {{ initials }}\n </bento-typography>\n </div>\n </div>\n</template>\n\n<script setup lang=\"ts\">\n import { computed, toRefs } from 'vue';\n import { BentoAvatarImageColor, BentoAvatarImageVariant } from './avatar-image.types';\n import { BentoTypography } from '@/components/typography';\n import { useInitials } from '@/composables';\n\n const props = withDefaults(\n defineProps<{\n /**\n * Avatar color. Defaults to yellow.\n */\n color?: BentoAvatarImageColor;\n\n /**\n * Image src to load the profile picture.\n */\n src?: string;\n\n /**\n * Name of the user that will be used to extract initials to display default value.\n * John => J\n * John Smith => JS\n * John Smith Doe => JD\n * John Smith Doe Holly => JH\n */\n username?: string;\n\n /**\n * Variants supported for small and large.\n * Default - large\n */\n variant?: BentoAvatarImageVariant;\n }>(),\n {\n color: BentoAvatarImageColor.YELLOW,\n src: null,\n username: null,\n variant: BentoAvatarImageVariant.LARGE,\n }\n );\n\n const { username } = toRefs(props);\n const initials = useInitials(username);\n\n const conditionalClasses = computed(() => ({\n [`b-avatar-image--${BentoAvatarImageVariant.SMALL}`]: props.variant === BentoAvatarImageVariant.SMALL,\n [`b-avatar-image--${props.color}`]: props.color,\n }));\n</script>\n\n<script lang=\"ts\">\n /**\n * Image used as user profile inside bento-avatar.\n *\n * @example\n * import { AvatarImage } from './components/avatar-image';\n *\n * export default {\n * components: { AvatarImage },\n * template: `<avatar-image :src=\"userAvatarSrc\" username=\"Jane\" />`\n * }\n */\n export default {};\n</script>\n\n<style lang=\"scss\" scoped src=\"./avatar-image.scss\" />\n","<template>\n <div class=\"b-avatar\" :aria-label=\"computedAriaLabel\">\n <avatar-image\n :src=\"src\"\n :username=\"computedUsername\"\n :variant=\"BentoAvatarImageVariant.SMALL\"\n :color=\"avatarColor\"\n />\n <bento-typography v-if=\"!iconOnly\" class=\"b-avatar__label\" el=\"span\" variant=\"body\">\n {{ username }}\n </bento-typography>\n </div>\n</template>\n\n<script setup lang=\"ts\">\n import { computed, toRefs } from 'vue';\n import { AvatarImage, BentoAvatarImageColor, BentoAvatarImageVariant } from './components/avatar-image';\n import { BentoTypography } from '@/components/typography';\n import { useInitials } from '@/composables';\n\n const props = withDefaults(\n defineProps<{\n /**\n * Displays the user profile without the label.\n */\n iconOnly?: boolean;\n\n /**\n * Image src to load the profile picture.\n */\n src?: string;\n\n /**\n * Name of the user that will be used both in the label and to extract initials to display default value.\n * John => J\n * John Smith => JS\n * John Smith Doe => JD\n * John Smith Doe Holly => JH\n */\n username: string;\n }>(),\n {\n iconOnly: false,\n src: null,\n }\n );\n\n const { username } = toRefs(props);\n\n const computedAriaLabel = computed(() => (props.iconOnly ? props.username : null));\n const computedUsername = computed(() => (!props.src ? props.username : null));\n const initials = useInitials(username);\n\n // Returns the UTF-16 char code\n const charCode = computed(() => (initials.value ? initials.value.charCodeAt(0) - 65 : null));\n\n // Returns a computed color based on the letter passed\n const avatarColor = computed(() => {\n const numberOfAlphabetLetters = 26;\n const numberOfColors = Object.keys(BentoAvatarImageColor).length;\n const rangeStep = numberOfAlphabetLetters / numberOfColors;\n\n if (charCode.value <= rangeStep) {\n return BentoAvatarImageColor.YELLOW;\n }\n if (charCode.value <= rangeStep * 2) {\n return BentoAvatarImageColor.BLUE;\n }\n if (charCode.value <= rangeStep * 3) {\n return BentoAvatarImageColor.GREEN;\n }\n return BentoAvatarImageColor.RED;\n });\n</script>\n\n<script lang=\"ts\">\n /**\n * Displays an user profile including an avatar and optionally a label.\n *\n * @example\n * import { BentoAvatar } from '@adyen/bento-vue2';\n *\n * export default {\n * components: { BentoAvatar },\n * template: `<bento-avatar :src=\"userAvatarSrc\" username=\"Jane\" />`\n * }\n */\n export default {\n name: 'bento-avatar',\n };\n</script>\n\n<style lang=\"scss\" scoped src=\"./avatar.scss\" />\n"],"names":["useInitials","username","computedUsername","ref","computed","BentoAvatarImageVariant","BentoAvatarImageVariant2","BentoAvatarImageColor","BentoAvatarImageColor2","__default__$1","props","__props","toRefs","initials","conditionalClasses","__default__","computedAriaLabel","charCode","avatarColor","rangeStep"],"mappings":";;;;AAUa,MAAAA,IAAA,CAAAC,MAAA;AACT,QAAAC,IAAAC,EAAAF,CAAA;AACA,SAAAG,EAAA,MAAAF,EAAA,QAAAA,EAAA,MAAA,KAAA,EAAA,OAAA,CAAA,EAAA,YAAA,IAAA,IAAA;AACJ;ACbY,IAAAG,IAAA,kBAAAC,OACRA,EAAA,QAAA,SACAA,EAAA,QAAA,SAFQA,IAAAD,KAAA,CAAA,CAAA,GAKAE,IAAA,kBAAAC,OACRA,EAAA,OAAA,QACAA,EAAA,QAAA,SACAA,EAAA,MAAA,OACAA,EAAA,SAAA,UAJQA,IAAAD,KAAA,CAAA,CAAA;;;;;GCoERE,IAAA,CAAA;;;;;;;;;;AAxDA,UAAAC,IAAAC,GAmCA,EAAA,UAAAV,EAAA,IAAAW,EAAAF,CAAA,GACAG,IAAAb,EAAAC,CAAA,GAEAa,IAAAV,EAAA,OAAA;AAAA,MAA2C,CAAA,mBAAAC,EAAA,KAAA,EAAA,GAAAK,EAAA,YAAAL,EAAA;AAAA,MACyD,CAAA,mBAAAK,EAAA,KAAA,EAAA,GAAAA,EAAA;AAAA,IACtD,EAAA;;;;;;;;;;;;;;;;;;;;;;;;;;sFC8B9CK,IAAA;AAAA,EAAe,MAAA;AAEf;;;;;;;;AArEA,UAAAL,IAAAC,GA2BA,EAAA,UAAAV,EAAA,IAAAW,EAAAF,CAAA,GAEAM,IAAAZ,EAAA,MAAAM,EAAA,WAAAA,EAAA,WAAA,IAAA,GACAR,IAAAE,EAAA,MAAAM,EAAA,MAAA,OAAAA,EAAA,QAAA,GACAG,IAAAb,EAAAC,CAAA,GAGAgB,IAAAb,EAAA,MAAAS,EAAA,QAAAA,EAAA,MAAA,WAAA,CAAA,IAAA,KAAA,IAAA,GAGAK,IAAAd,EAAA,MAAA;AAGI,YAAAe,IAAA,KADA,OAAA,KAAAZ,CAAA,EAAA;AAGA,aAAAU,EAAA,SAAAE,IACIZ,EAAA,SAEJU,EAAA,SAAAE,IAAA,IACIZ,EAAA,OAEJU,EAAA,SAAAE,IAAA,IACIZ,EAAA,QAEJA,EAAA;AAAA,IAA6B,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;"}
package/dist/chunks/{base-button.BxUrydaP.js → base-button.cDr-F6j_.js} RENAMED
@@ -1,5 +1,5 @@
1
1
  import { defineComponent as B, computed as C, ref as m, resolveComponent as y, openBlock as r, createElementBlock as l, normalizeClass as S, renderSlot as u, createCommentVNode as d, createBlock as k, withCtx as g } from "vue";
2
- import { B as h } from "./typography.z9P0Ec3Q.js";
2
+ import { B as h } from "./typography.CE5PgxFf.js";
3
3
  import { u as L } from "./use-has-slot.B7eQSabc.js";
4
4
  import { _ as O } from "./_plugin-vue_export-helper.CHgC5LLL.js";
5
5
  import "../assets/base-button.css";
@@ -112,4 +112,4 @@ export {
112
112
  T as B,
113
113
  n as a
114
114
  };
115
- //# sourceMappingURL=base-button.BxUrydaP.js.map
115
+ //# sourceMappingURL=base-button.cDr-F6j_.js.map