@beeq/core 1.8.0-beta.2 → 1.8.0-beta.3

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 (292) hide show
  1. package/dist/beeq/beeq.esm.js +1 -43
  2. package/dist/beeq/beeq.esm.js.map +1 -1
  3. package/dist/beeq/index.esm.js +1 -64
  4. package/dist/beeq/index.esm.js.map +1 -1
  5. package/dist/beeq/p-010fb578.entry.js +6 -0
  6. package/dist/beeq/{p-7c06dfec.entry.js.map → p-010fb578.entry.js.map} +1 -1
  7. package/dist/beeq/p-05b44bb7.entry.js +6 -0
  8. package/dist/beeq/{p-9aa18e2f.entry.js.map → p-05b44bb7.entry.js.map} +1 -1
  9. package/dist/beeq/p-0cbec77b.entry.js +6 -0
  10. package/dist/beeq/{p-ceb3bb9a.entry.js.map → p-0cbec77b.entry.js.map} +1 -1
  11. package/dist/beeq/p-115ed5b2.js +1 -25
  12. package/dist/beeq/p-115ed5b2.js.map +1 -1
  13. package/dist/beeq/p-1202161d.entry.js +6 -0
  14. package/dist/beeq/{p-0ebe73ef.entry.js.map → p-1202161d.entry.js.map} +1 -1
  15. package/dist/beeq/p-17b341dd.entry.js +6 -0
  16. package/dist/beeq/{p-05685544.entry.js.map → p-17b341dd.entry.js.map} +1 -1
  17. package/dist/beeq/p-1c8b6eb4.js +1 -12
  18. package/dist/beeq/p-1c8b6eb4.js.map +1 -1
  19. package/dist/beeq/p-1d81f9e5.entry.js +6 -0
  20. package/dist/beeq/{p-3dd0e436.entry.js.map → p-1d81f9e5.entry.js.map} +1 -1
  21. package/dist/beeq/p-1f3a4359.js +1 -11
  22. package/dist/beeq/p-1f3a4359.js.map +1 -1
  23. package/dist/beeq/p-2714ce21.entry.js +6 -0
  24. package/dist/beeq/{p-377c70d1.entry.js.map → p-2714ce21.entry.js.map} +1 -1
  25. package/dist/beeq/p-2e61db84.entry.js +6 -0
  26. package/dist/beeq/{p-734853f9.entry.js.map → p-2e61db84.entry.js.map} +1 -1
  27. package/dist/beeq/p-32f74048.entry.js +6 -0
  28. package/dist/beeq/{p-911e07b7.entry.js.map → p-32f74048.entry.js.map} +1 -1
  29. package/dist/beeq/p-339d14c8.entry.js +6 -0
  30. package/dist/beeq/{p-b4278945.entry.js.map → p-339d14c8.entry.js.map} +1 -1
  31. package/dist/beeq/p-35ec6cac.entry.js +6 -0
  32. package/dist/beeq/{p-c907de72.entry.js.map → p-35ec6cac.entry.js.map} +1 -1
  33. package/dist/beeq/p-38d4bd8a.js +1 -1934
  34. package/dist/beeq/p-38d4bd8a.js.map +1 -1
  35. package/dist/beeq/p-3ea228d3.entry.js +6 -0
  36. package/dist/beeq/{p-f8663855.entry.js.map → p-3ea228d3.entry.js.map} +1 -1
  37. package/dist/beeq/p-3fd0d92d.js +1 -1228
  38. package/dist/beeq/p-3fd0d92d.js.map +1 -1
  39. package/dist/beeq/p-45b7b5cf.entry.js +6 -0
  40. package/dist/beeq/{p-600e7c38.entry.js.map → p-45b7b5cf.entry.js.map} +1 -1
  41. package/dist/beeq/p-45e674b4.entry.js +6 -0
  42. package/dist/beeq/{p-026222c6.entry.js.map → p-45e674b4.entry.js.map} +1 -1
  43. package/dist/beeq/p-4954154f.entry.js +6 -0
  44. package/dist/beeq/{p-43e4fcdb.entry.js.map → p-4954154f.entry.js.map} +1 -1
  45. package/dist/beeq/p-513bab02.js +1 -11
  46. package/dist/beeq/p-513bab02.js.map +1 -1
  47. package/dist/beeq/p-57621be1.js +1 -9
  48. package/dist/beeq/p-57621be1.js.map +1 -1
  49. package/dist/beeq/p-5a9a73a0.js +6 -0
  50. package/dist/beeq/p-5a9a73a0.js.map +1 -0
  51. package/dist/beeq/p-5f3ce05a.entry.js +6 -0
  52. package/dist/beeq/{p-b38e8c5a.entry.js.map → p-5f3ce05a.entry.js.map} +1 -1
  53. package/dist/beeq/p-6823479d.entry.js +6 -0
  54. package/dist/beeq/{p-7089c66a.entry.js.map → p-6823479d.entry.js.map} +1 -1
  55. package/dist/beeq/p-687da041.js +1 -20
  56. package/dist/beeq/p-687da041.js.map +1 -1
  57. package/dist/beeq/p-76e714c6.js +7 -0
  58. package/dist/beeq/p-76e714c6.js.map +1 -0
  59. package/dist/beeq/p-7871f3f0.entry.js +6 -0
  60. package/dist/beeq/{p-19df76ba.entry.js.map → p-7871f3f0.entry.js.map} +1 -1
  61. package/dist/beeq/p-7a049750.entry.js +6 -0
  62. package/dist/beeq/{p-11eaeb5d.entry.js.map → p-7a049750.entry.js.map} +1 -1
  63. package/dist/beeq/p-83207939.entry.js +6 -0
  64. package/dist/beeq/{p-5eab4f55.entry.js.map → p-83207939.entry.js.map} +1 -1
  65. package/dist/beeq/p-8d8993ba.entry.js +6 -0
  66. package/dist/beeq/{p-7b9ff03f.entry.js.map → p-8d8993ba.entry.js.map} +1 -1
  67. package/dist/beeq/p-9406afc0.entry.js +6 -0
  68. package/dist/beeq/{p-7774eec3.entry.js.map → p-9406afc0.entry.js.map} +1 -1
  69. package/dist/beeq/p-94899104.entry.js +6 -0
  70. package/dist/beeq/{p-924ebf7d.entry.js.map → p-94899104.entry.js.map} +1 -1
  71. package/dist/beeq/p-951ba558.js +1 -64
  72. package/dist/beeq/p-951ba558.js.map +1 -1
  73. package/dist/beeq/p-95d0abdc.entry.js +6 -0
  74. package/dist/beeq/{p-12dbc6ac.entry.js.map → p-95d0abdc.entry.js.map} +1 -1
  75. package/dist/beeq/p-99829fc7.js +1 -8
  76. package/dist/beeq/p-99829fc7.js.map +1 -1
  77. package/dist/beeq/p-9da0e8d7.entry.js +6 -0
  78. package/dist/beeq/{p-37466506.entry.js.map → p-9da0e8d7.entry.js.map} +1 -1
  79. package/dist/beeq/p-a535a72f.entry.js +6 -0
  80. package/dist/beeq/{p-b48545b6.entry.js.map → p-a535a72f.entry.js.map} +1 -1
  81. package/dist/beeq/p-a5a17e6e.entry.js +6 -0
  82. package/dist/beeq/{p-f00abfb8.entry.js.map → p-a5a17e6e.entry.js.map} +1 -1
  83. package/dist/beeq/p-a5dc1c94.js +1 -118
  84. package/dist/beeq/p-a5dc1c94.js.map +1 -1
  85. package/dist/beeq/p-a8cad5ab.js +1 -5
  86. package/dist/beeq/p-a8cad5ab.js.map +1 -1
  87. package/dist/beeq/p-af062402.js +1 -7
  88. package/dist/beeq/p-af062402.js.map +1 -1
  89. package/dist/beeq/p-b2acd8f3.entry.js +6 -0
  90. package/dist/beeq/{p-900d4e78.entry.js.map → p-b2acd8f3.entry.js.map} +1 -1
  91. package/dist/beeq/p-b7f02fb6.entry.js +6 -0
  92. package/dist/beeq/{p-4a235cd2.entry.js.map → p-b7f02fb6.entry.js.map} +1 -1
  93. package/dist/beeq/p-b994054a.entry.js +6 -0
  94. package/dist/beeq/{p-04d98ed3.entry.js.map → p-b994054a.entry.js.map} +1 -1
  95. package/dist/beeq/p-be4941d0.entry.js +6 -0
  96. package/dist/beeq/{p-ae94b9f8.entry.js.map → p-be4941d0.entry.js.map} +1 -1
  97. package/dist/beeq/p-d5992d3d.entry.js +6 -0
  98. package/dist/beeq/{p-41033fe6.entry.js.map → p-d5992d3d.entry.js.map} +1 -1
  99. package/dist/beeq/p-d7a88b16.js +1 -87
  100. package/dist/beeq/p-d7a88b16.js.map +1 -1
  101. package/dist/beeq/p-dd206dba.entry.js +6 -0
  102. package/dist/beeq/{p-2ef721e1.entry.js.map → p-dd206dba.entry.js.map} +1 -1
  103. package/dist/beeq/p-ded1aed2.entry.js +6 -0
  104. package/dist/beeq/{p-4a3d8532.entry.js.map → p-ded1aed2.entry.js.map} +1 -1
  105. package/dist/beeq/p-e08d9b52.entry.js +6 -0
  106. package/dist/beeq/p-e08d9b52.entry.js.map +1 -0
  107. package/dist/beeq/p-e572b038.entry.js +6 -0
  108. package/dist/beeq/{p-4eccc020.entry.js.map → p-e572b038.entry.js.map} +1 -1
  109. package/dist/beeq/p-e5afdf8c.js +1 -82
  110. package/dist/beeq/p-e5afdf8c.js.map +1 -1
  111. package/dist/beeq/p-e7ede06e.entry.js +6 -0
  112. package/dist/beeq/{p-e7d75b87.entry.js.map → p-e7ede06e.entry.js.map} +1 -1
  113. package/dist/beeq/p-ecd27cf2.js +1 -11
  114. package/dist/beeq/p-ecd27cf2.js.map +1 -1
  115. package/dist/beeq/p-f7a0a316.entry.js +6 -0
  116. package/dist/beeq/{p-4dd962a7.entry.js.map → p-f7a0a316.entry.js.map} +1 -1
  117. package/dist/beeq/p-fbf6b04b.entry.js +6 -0
  118. package/dist/beeq/{p-4fc098bb.entry.js.map → p-fbf6b04b.entry.js.map} +1 -1
  119. package/dist/cjs/beeq.cjs.js +1 -1
  120. package/dist/cjs/bq-accordion-group.cjs.entry.js +1 -1
  121. package/dist/cjs/bq-accordion.cjs.entry.js +1 -1
  122. package/dist/cjs/bq-alert.cjs.entry.js +1 -1
  123. package/dist/cjs/bq-avatar.cjs.entry.js +1 -1
  124. package/dist/cjs/bq-badge.cjs.entry.js +2 -2
  125. package/dist/cjs/bq-breadcrumb-item.cjs.entry.js +1 -1
  126. package/dist/cjs/bq-breadcrumb.cjs.entry.js +1 -1
  127. package/dist/cjs/bq-button_2.cjs.entry.js +4 -2
  128. package/dist/cjs/bq-button_2.cjs.entry.js.map +1 -1
  129. package/dist/cjs/bq-card.cjs.entry.js +1 -1
  130. package/dist/cjs/bq-checkbox.cjs.entry.js +1 -1
  131. package/dist/cjs/bq-date-picker.cjs.entry.js +2 -2
  132. package/dist/cjs/bq-dialog.cjs.entry.js +1 -1
  133. package/dist/cjs/bq-divider.cjs.entry.js +2 -2
  134. package/dist/cjs/bq-drawer.cjs.entry.js +2 -2
  135. package/dist/cjs/bq-dropdown_2.cjs.entry.js +1 -1
  136. package/dist/cjs/bq-empty-state.cjs.entry.js +1 -1
  137. package/dist/cjs/bq-input.cjs.entry.js +1 -1
  138. package/dist/cjs/bq-notification.cjs.entry.js +4 -4
  139. package/dist/cjs/bq-notification.cjs.entry.js.map +1 -1
  140. package/dist/cjs/bq-option-group.cjs.entry.js +1 -1
  141. package/dist/cjs/bq-option-list_2.cjs.entry.js +3 -3
  142. package/dist/cjs/bq-option.cjs.entry.js +1 -1
  143. package/dist/cjs/bq-page-title.cjs.entry.js +1 -1
  144. package/dist/cjs/bq-progress.cjs.entry.js +1 -1
  145. package/dist/cjs/bq-radio-group.cjs.entry.js +1 -1
  146. package/dist/cjs/bq-radio.cjs.entry.js +1 -1
  147. package/dist/cjs/bq-select.cjs.entry.js +2 -2
  148. package/dist/cjs/bq-side-menu-item.cjs.entry.js +1 -1
  149. package/dist/cjs/bq-side-menu.cjs.entry.js +1 -1
  150. package/dist/cjs/bq-slider.cjs.entry.js +1 -1
  151. package/dist/cjs/bq-spinner.cjs.entry.js +2 -2
  152. package/dist/cjs/bq-status.cjs.entry.js +1 -1
  153. package/dist/cjs/bq-step-item.cjs.entry.js +1 -1
  154. package/dist/cjs/bq-steps.cjs.entry.js +1 -1
  155. package/dist/cjs/bq-switch.cjs.entry.js +1 -1
  156. package/dist/cjs/bq-tab-group.cjs.entry.js +1 -1
  157. package/dist/cjs/bq-tab.cjs.entry.js +1 -1
  158. package/dist/cjs/bq-textarea.cjs.entry.js +1 -1
  159. package/dist/cjs/bq-toast.cjs.entry.js +3 -3
  160. package/dist/cjs/bq-toast.cjs.entry.js.map +1 -1
  161. package/dist/cjs/bq-tooltip.cjs.entry.js +1 -1
  162. package/dist/cjs/{cssVariables-7139f0c6.js → cssVariables-a0e1e906.js} +3 -1
  163. package/dist/cjs/cssVariables-a0e1e906.js.map +1 -0
  164. package/dist/cjs/{index-1d3aac65.js → index-e6d59dbb.js} +2 -20
  165. package/dist/cjs/index-e6d59dbb.js.map +1 -0
  166. package/dist/cjs/index.cjs.js +1 -1
  167. package/dist/cjs/loader.cjs.js +1 -1
  168. package/dist/collection/components/date-picker/scss/bq-date-picker.css +1 -1
  169. package/dist/collection/components/drawer/scss/bq-drawer.css +1 -1
  170. package/dist/collection/components/icon/helper/request.js +2 -0
  171. package/dist/collection/components/icon/helper/request.js.map +1 -1
  172. package/dist/collection/components/notification/bq-notification.js +3 -3
  173. package/dist/collection/components/notification/bq-notification.js.map +1 -1
  174. package/dist/collection/components/select/scss/bq-select.css +1 -1
  175. package/dist/collection/components/tag/scss/bq-tag.css +1 -1
  176. package/dist/collection/components/toast/bq-toast.js +2 -2
  177. package/dist/collection/components/toast/bq-toast.js.map +1 -1
  178. package/dist/collection/shared/utils/cssVariables.js +2 -0
  179. package/dist/collection/shared/utils/cssVariables.js.map +1 -1
  180. package/dist/components/bq-date-picker.js +1 -1
  181. package/dist/components/bq-drawer.js +1 -1
  182. package/dist/components/bq-icon2.js +2 -0
  183. package/dist/components/bq-icon2.js.map +1 -1
  184. package/dist/components/bq-notification.js +3 -3
  185. package/dist/components/bq-notification.js.map +1 -1
  186. package/dist/components/bq-select.js +1 -1
  187. package/dist/components/bq-tag2.js +1 -1
  188. package/dist/components/bq-toast.js +2 -2
  189. package/dist/components/bq-toast.js.map +1 -1
  190. package/dist/components/cssVariables.js +2 -0
  191. package/dist/components/cssVariables.js.map +1 -1
  192. package/dist/esm/beeq.js +2 -2
  193. package/dist/esm/bq-accordion-group.entry.js +1 -1
  194. package/dist/esm/bq-accordion.entry.js +1 -1
  195. package/dist/esm/bq-alert.entry.js +1 -1
  196. package/dist/esm/bq-avatar.entry.js +1 -1
  197. package/dist/esm/bq-badge.entry.js +2 -2
  198. package/dist/esm/bq-breadcrumb-item.entry.js +1 -1
  199. package/dist/esm/bq-breadcrumb.entry.js +1 -1
  200. package/dist/esm/bq-button_2.entry.js +4 -2
  201. package/dist/esm/bq-button_2.entry.js.map +1 -1
  202. package/dist/esm/bq-card.entry.js +1 -1
  203. package/dist/esm/bq-checkbox.entry.js +1 -1
  204. package/dist/esm/bq-date-picker.entry.js +2 -2
  205. package/dist/esm/bq-dialog.entry.js +1 -1
  206. package/dist/esm/bq-divider.entry.js +2 -2
  207. package/dist/esm/bq-drawer.entry.js +2 -2
  208. package/dist/esm/bq-dropdown_2.entry.js +1 -1
  209. package/dist/esm/bq-empty-state.entry.js +1 -1
  210. package/dist/esm/bq-input.entry.js +1 -1
  211. package/dist/esm/bq-notification.entry.js +4 -4
  212. package/dist/esm/bq-notification.entry.js.map +1 -1
  213. package/dist/esm/bq-option-group.entry.js +1 -1
  214. package/dist/esm/bq-option-list_2.entry.js +3 -3
  215. package/dist/esm/bq-option.entry.js +1 -1
  216. package/dist/esm/bq-page-title.entry.js +1 -1
  217. package/dist/esm/bq-progress.entry.js +1 -1
  218. package/dist/esm/bq-radio-group.entry.js +1 -1
  219. package/dist/esm/bq-radio.entry.js +1 -1
  220. package/dist/esm/bq-select.entry.js +2 -2
  221. package/dist/esm/bq-side-menu-item.entry.js +1 -1
  222. package/dist/esm/bq-side-menu.entry.js +1 -1
  223. package/dist/esm/bq-slider.entry.js +1 -1
  224. package/dist/esm/bq-spinner.entry.js +2 -2
  225. package/dist/esm/bq-status.entry.js +1 -1
  226. package/dist/esm/bq-step-item.entry.js +1 -1
  227. package/dist/esm/bq-steps.entry.js +1 -1
  228. package/dist/esm/bq-switch.entry.js +1 -1
  229. package/dist/esm/bq-tab-group.entry.js +1 -1
  230. package/dist/esm/bq-tab.entry.js +1 -1
  231. package/dist/esm/bq-textarea.entry.js +1 -1
  232. package/dist/esm/bq-toast.entry.js +3 -3
  233. package/dist/esm/bq-toast.entry.js.map +1 -1
  234. package/dist/esm/bq-tooltip.entry.js +1 -1
  235. package/dist/esm/{cssVariables-5ffccc29.js → cssVariables-23e3ca0d.js} +3 -1
  236. package/dist/esm/cssVariables-23e3ca0d.js.map +1 -0
  237. package/dist/esm/{index-f69556fe.js → index-efc1c2ef.js} +2 -20
  238. package/dist/esm/index-efc1c2ef.js.map +1 -0
  239. package/dist/esm/index.js +1 -1
  240. package/dist/esm/loader.js +2 -2
  241. package/dist/hydrate/index.js +13 -9
  242. package/dist/hydrate/index.mjs +13 -9
  243. package/dist/types/shared/utils/cssVariables.d.ts +1 -1
  244. package/package.json +1 -1
  245. package/dist/beeq/p-026222c6.entry.js +0 -309
  246. package/dist/beeq/p-04d98ed3.entry.js +0 -257
  247. package/dist/beeq/p-05685544.entry.js +0 -121
  248. package/dist/beeq/p-0ab0b58d.js +0 -30
  249. package/dist/beeq/p-0ab0b58d.js.map +0 -1
  250. package/dist/beeq/p-0c42c08a.js +0 -1811
  251. package/dist/beeq/p-0c42c08a.js.map +0 -1
  252. package/dist/beeq/p-0ebe73ef.entry.js +0 -149
  253. package/dist/beeq/p-11eaeb5d.entry.js +0 -330
  254. package/dist/beeq/p-12dbc6ac.entry.js +0 -87
  255. package/dist/beeq/p-19df76ba.entry.js +0 -220
  256. package/dist/beeq/p-2ef721e1.entry.js +0 -261
  257. package/dist/beeq/p-37466506.entry.js +0 -103
  258. package/dist/beeq/p-377c70d1.entry.js +0 -173
  259. package/dist/beeq/p-3dd0e436.entry.js +0 -130
  260. package/dist/beeq/p-41033fe6.entry.js +0 -84
  261. package/dist/beeq/p-43e4fcdb.entry.js +0 -173
  262. package/dist/beeq/p-4a235cd2.entry.js +0 -258
  263. package/dist/beeq/p-4a3d8532.entry.js +0 -205
  264. package/dist/beeq/p-4dd962a7.entry.js +0 -104
  265. package/dist/beeq/p-4eccc020.entry.js +0 -203
  266. package/dist/beeq/p-4fc098bb.entry.js +0 -90
  267. package/dist/beeq/p-5eab4f55.entry.js +0 -117
  268. package/dist/beeq/p-600e7c38.entry.js +0 -102
  269. package/dist/beeq/p-7089c66a.entry.js +0 -156
  270. package/dist/beeq/p-734853f9.entry.js +0 -259
  271. package/dist/beeq/p-7774eec3.entry.js +0 -135
  272. package/dist/beeq/p-7b9ff03f.entry.js +0 -437
  273. package/dist/beeq/p-7c06dfec.entry.js +0 -204
  274. package/dist/beeq/p-900d4e78.entry.js +0 -102
  275. package/dist/beeq/p-911e07b7.entry.js +0 -513
  276. package/dist/beeq/p-924ebf7d.entry.js +0 -394
  277. package/dist/beeq/p-9aa18e2f.entry.js +0 -303
  278. package/dist/beeq/p-ae94b9f8.entry.js +0 -144
  279. package/dist/beeq/p-b38e8c5a.entry.js +0 -208
  280. package/dist/beeq/p-b4278945.entry.js +0 -195
  281. package/dist/beeq/p-b48545b6.entry.js +0 -248
  282. package/dist/beeq/p-c907de72.entry.js +0 -145
  283. package/dist/beeq/p-ceb3bb9a.entry.js +0 -187
  284. package/dist/beeq/p-d3008f60.entry.js +0 -279
  285. package/dist/beeq/p-d3008f60.entry.js.map +0 -1
  286. package/dist/beeq/p-e7d75b87.entry.js +0 -144
  287. package/dist/beeq/p-f00abfb8.entry.js +0 -145
  288. package/dist/beeq/p-f8663855.entry.js +0 -329
  289. package/dist/cjs/cssVariables-7139f0c6.js.map +0 -1
  290. package/dist/cjs/index-1d3aac65.js.map +0 -1
  291. package/dist/esm/cssVariables-5ffccc29.js.map +0 -1
  292. package/dist/esm/index-f69556fe.js.map +0 -1
@@ -0,0 +1,6 @@
1
+ /*!
2
+ * Built by Endavans
3
+ * © https://beeq.design - Apache 2 License.
4
+ */
5
+ import{r as a,c as r,h as e,g as b}from"./p-76e714c6.js";import"./p-e5afdf8c.js";import{d as t}from"./p-951ba558.js";import{i as n}from"./p-57621be1.js";import{b as q}from"./p-d7a88b16.js";import"./p-99829fc7.js";const i='::backdrop,:root{--bq-blue-100:#e7f0fd;--bq-blue-200:#d0e2fb;--bq-blue-300:#a1c5f7;--bq-blue-400:#73a8f3;--bq-blue-500:#448bef;--bq-blue-600:#156eeb;--bq-blue-700:#1158bc;--bq-blue-800:#0d428d;--bq-blue-900:#082c5e;--bq-blue-1000:#04162f;--bq-corai-100:#fff2f2;--bq-corai-200:#ffe6e6;--bq-corai-300:#ffccce;--bq-corai-400:#ffb3b5;--bq-corai-500:#ff999d;--bq-corai-600:#ff8084;--bq-corai-700:#cc666a;--bq-corai-800:#994d4f;--bq-corai-900:#663335;--bq-corai-1000:#331a1a;--bq-cyan-100:#e8f7fb;--bq-cyan-200:#d2f0f8;--bq-cyan-300:#a5e1f1;--bq-cyan-400:#78d1e9;--bq-cyan-500:#4bc2e2;--bq-cyan-600:#1eb3db;--bq-cyan-700:#188faf;--bq-cyan-800:#126b83;--bq-cyan-900:#0c4858;--bq-cyan-1000:#06242c;--bq-gold-100:#fbf4ec;--bq-gold-200:#f7e9da;--bq-gold-300:#f0d3b6;--bq-gold-400:#e8bc91;--bq-gold-500:#e1a66d;--bq-gold-600:#d99048;--bq-gold-700:#ae733a;--bq-gold-800:#82562b;--bq-gold-900:#573a1d;--bq-gold-1000:#2b1d0e;--bq-green-100:#e8f8ef;--bq-green-200:#d2f1e0;--bq-green-300:#a5e3c1;--bq-green-400:#78d5a1;--bq-green-500:#4bc782;--bq-green-600:#1eb963;--bq-green-700:#18944f;--bq-green-800:#126f3b;--bq-green-900:#0c4a28;--bq-green-1000:#062514;--bq-grey-100:#f1f2f4;--bq-grey-200:#e7e8eb;--bq-grey-300:#caccd2;--bq-grey-400:#a6aab3;--bq-grey-50:#f6f6f8;--bq-grey-500:#898e99;--bq-grey-600:#646a77;--bq-grey-700:#3f4350;--bq-grey-800:#2a2c35;--bq-grey-900:#1c1d23;--bq-grey-950:#15161a;--bq-grey-1000:#0d0e11;--bq-indigo-100:#edecfc;--bq-indigo-200:#dcdafa;--bq-indigo-300:#b9b5f5;--bq-indigo-400:#9590ef;--bq-indigo-500:#726bea;--bq-indigo-600:#4f46e5;--bq-indigo-700:#3f38b7;--bq-indigo-800:#2f2a89;--bq-indigo-900:#201c5c;--bq-indigo-1000:#100e2e;--bq-iris-100:#e9f0ff;--bq-iris-200:#d6e0ff;--bq-iris-300:#b2c0fe;--bq-iris-400:#8691f8;--bq-iris-500:#6061ee;--bq-iris-600:#4f46e5;--bq-iris-700:#413abd;--bq-iris-800:#332e95;--bq-iris-900:#26216d;--bq-iris-1000:#181545;--bq-lime-100:#f5fae8;--bq-lime-200:#ecf6d2;--bq-lime-300:#d9eda5;--bq-lime-400:#c5e379;--bq-lime-500:#b2da4c;--bq-lime-600:#9fd11f;--bq-lime-700:#7fa719;--bq-lime-800:#5f7d13;--bq-lime-900:#40540c;--bq-lime-1000:#202a06;--bq-magenta-100:#fce7f4;--bq-magenta-200:#f9cfea;--bq-magenta-300:#f39fd6;--bq-magenta-400:#ee6fbf;--bq-magenta-500:#e83fab;--bq-magenta-600:#de1395;--bq-magenta-700:#b20f77;--bq-magenta-800:#850c59;--bq-magenta-900:#58083c;--bq-magenta-1000:#2c041e;--bq-neutral-white:#fbfbfc;--bq-neutral-black:#060708;--bq-orange-100:#fbf0e9;--bq-orange-200:#f8e1d4;--bq-orange-300:#f1c2a8;--bq-orange-400:#eaa47d;--bq-orange-500:#e38551;--bq-orange-600:#dc6726;--bq-orange-700:#b0521e;--bq-orange-800:#843e17;--bq-orange-900:#58290f;--bq-orange-1000:#2c1508;--bq-purple-100:#efebf8;--bq-purple-200:#e0d7f2;--bq-purple-300:#c1afe5;--bq-purple-400:#a388d8;--bq-purple-500:#8460cb;--bq-purple-600:#6538be;--bq-purple-700:#512d98;--bq-purple-800:#3d2272;--bq-purple-900:#28164c;--bq-purple-1000:#140b26;--bq-red-100:#fce7ea;--bq-red-200:#f9d1d5;--bq-red-300:#f3a2ac;--bq-red-400:#ed7482;--bq-red-500:#e74559;--bq-red-600:#e1172f;--bq-red-700:#b41226;--bq-red-800:#870e1c;--bq-red-900:#5a0913;--bq-red-1000:#2d0509;--bq-sky-100:#eff4fb;--bq-sky-200:#dfeaf8;--bq-sky-300:#bfd5f1;--bq-sky-400:#9ec1e9;--bq-sky-500:#7eace2;--bq-sky-600:#5e97db;--bq-sky-700:#4b79af;--bq-sky-800:#385b83;--bq-sky-900:#263c58;--bq-sky-1000:#131e2c;--bq-teal-100:#e5f7f5;--bq-teal-200:#ccf0eb;--bq-teal-300:#99e1d8;--bq-teal-400:#66d2c4;--bq-teal-500:#33c3b1;--bq-teal-600:#00b49d;--bq-teal-700:#00907e;--bq-teal-800:#006c5e;--bq-teal-900:#00483f;--bq-teal-1000:#00241f;--bq-volcano-100:#feede7;--bq-volcano-200:#fddbd1;--bq-volcano-300:#fbb8a3;--bq-volcano-400:#fa9474;--bq-volcano-500:#f87146;--bq-volcano-600:#f64d18;--bq-volcano-700:#c53e13;--bq-volcano-800:#942e0e;--bq-volcano-900:#621f0a;--bq-volcano-1000:#310f05;--bq-yellow-100:#fefbe7;--bq-yellow-200:#fcf6d0;--bq-yellow-300:#faeea0;--bq-yellow-400:#f7e571;--bq-yellow-500:#f5dd41;--bq-yellow-600:#f2d412;--bq-yellow-700:#c2aa0e;--bq-yellow-800:#917f0b;--bq-yellow-900:#615507;--bq-yellow-1000:#302a04;--bq-endava-grey-50:#f7f7f8;--bq-endava-grey-100:#e4e6e7;--bq-endava-grey-200:#b5babe;--bq-endava-grey-300:#949ca1;--bq-endava-grey-400:#737d84;--bq-endava-grey-500:#525f67;--bq-endava-grey-600:#30404b;--bq-endava-grey-700:#2b3942;--bq-endava-grey-800:#263139;--bq-endava-grey-900:#192b37;--bq-endava-grey-950:#151b1e;--bq-endava-grey-1000:#0f1316;--bq-endava-neutral-white:#fafbfb;--bq-endava-neutral-black:#060708;--bq-endava-orange-100:#fef3f1;--bq-endava-orange-200:#fbd6d1;--bq-endava-orange-300:#fab7af;--bq-endava-orange-400:#fa988b;--bq-endava-orange-500:#fc7866;--bq-endava-orange-600:#ff5640;--bq-endava-orange-700:#ce4a39;--bq-endava-orange-800:#a03d30;--bq-endava-orange-900:#722e25;--bq-endava-orange-1000:#471e19}*,:after,:before{box-sizing:border-box}*{font:inherit;margin:0}ol[role=list],ul[role=list]{list-style-type:none}html{font-size:var(--bq-font-size--m)}html:focus-within{scroll-behavior:smooth}body{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background-color:var(--bq-background--primary);color:var(--bq-text--primary);font-family:var(--bq-font-family);line-height:var(--bq-font-line-height--regular);min-height:100vh;text-rendering:optimizeSpeed}a:not([class]){text-decoration-skip-ink:auto}canvas,img,picture,svg,video{display:block;max-width:100%}button,input,select,textarea{font:inherit}h1,h2,h3,h4,h5,h6,p{overflow-wrap:break-word}@media (prefers-reduced-motion:reduce){html:focus-within{scroll-behavior:auto}*,:after,:before{animation-duration:.01ms!important;animation-iteration-count:1!important;scroll-behavior:auto;transition-duration:.01ms!important}}:root{--bq-white:#fff;--bq-black:#060708;--bq-neutral-50:var(--bq-grey-50);--bq-neutral-100:var(--bq-grey-100);--bq-neutral-200:var(--bq-grey-200);--bq-neutral-300:var(--bq-grey-300);--bq-neutral-400:var(--bq-grey-400);--bq-neutral-500:var(--bq-grey-500);--bq-neutral-600:var(--bq-grey-600);--bq-neutral-700:var(--bq-grey-700);--bq-neutral-800:var(--bq-grey-800);--bq-neutral-900:var(--bq-grey-900);--bq-neutral-950:var(--bq-grey-950);--bq-neutral-1000:var(--bq-grey-1000);--bq-brand-light:var(--bq-iris-100);--bq-brand:var(--bq-iris-600);--bq-brand-dark:var(--bq-iris-1000);--bq-accent-light:var(--bq-purple-100);--bq-accent:var(--bq-purple-600);--bq-accent-dark:var(--bq-purple-1000);--bq-success-light:var(--bq-teal-100);--bq-success:var(--bq-teal-600);--bq-success-dark:var(--bq-teal-1000);--bq-danger-light:var(--bq-red-100);--bq-danger:var(--bq-red-600);--bq-danger-dark:var(--bq-red-1000);--bq-warning-light:var(--bq-gold-100);--bq-warning:var(--bq-gold-600);--bq-warning-dark:var(--bq-gold-1000);--bq-info-light:var(--bq-iris-100);--bq-info:var(--bq-iris-600);--bq-info-dark:var(--bq-iris-1000);--bq-focus:var(--bq-iris-600);--bq-data-01:var(--bq-brand);--bq-data-02:var(--bq-purple-600);--bq-data-03:var(--bq-magenta-600);--bq-data-04:var(--bq-cyan-600);--bq-data-05:var(--bq-teal-600);--bq-data-06:var(--bq-orange-600);--bq-data-07:var(--bq-yellow-600);--bq-data-08:var(--bq-red-600);--bq-data-09:var(--bq-blue-600);--bq-data-10:var(--bq-grey-600);--bq-data-11:var(--bq-black);--bq-data-12:var(--bq-white);--bq-radius--none:0;--bq-radius--xs2:0.125rem;--bq-radius--xs:0.25rem;--bq-radius--s:0.5rem;--bq-radius--m:0.75rem;--bq-radius--l:1.5rem;--bq-radius--full:9999px;--bq-box-shadow--xs:0 2px 0 rgba(0,0,0,.016);--bq-box-shadow--s:0 8px 24px rgba(0,0,0,.04);--bq-box-shadow--m:0 10px 48px -16px rgba(0,0,0,.12);--bq-box-shadow--l:0 20px 58px -16px rgba(0,0,0,.16);--bq-font-family:"Outfit",sans-serif;--bq-font-size--xs:0.75rem;--bq-font-size--s:0.875rem;--bq-font-size--m:1rem;--bq-font-size--l:1.125rem;--bq-font-size--xl:1.5rem;--bq-font-size--xxl:2rem;--bq-font-size--xxl2:2.5rem;--bq-font-size--xxl3:3rem;--bq-font-size--xxl4:3.5rem;--bq-font-size--xxl5:4rem;--bq-font-weight--thin:100;--bq-font-weight--light:300;--bq-font-weight--regular:400;--bq-font-weight--medium:500;--bq-font-weight--semibold:600;--bq-font-weight--bold:700;--bq-font-line-height--small:1.2;--bq-font-line-height--regular:1.5;--bq-font-line-height--large:1.5;--bq-spacing-xs3:0.125rem;--bq-spacing-xs2:0.25rem;--bq-spacing-xs:0.5rem;--bq-spacing-s:0.75rem;--bq-spacing-m:1rem;--bq-spacing-l:1.5rem;--bq-spacing-xl:2rem;--bq-spacing-xxl:2.5rem;--bq-spacing-xxl2:3.5rem;--bq-spacing-xxl3:4rem;--bq-spacing-xxl4:4.5rem;--bq-stroke-s:1px;--bq-stroke-m:2px;--bq-stroke-l:3px}.beeq.light,.light,:root,[bq-mode=light]{--bq-background--primary:var(--bq-white);--bq-background--secondary:var(--bq-neutral-100);--bq-background--tertiary:var(--bq-neutral-200);--bq-background--alt:var(--bq-neutral-300);--bq-background--inverse:var(--bq-neutral-900);--bq-background--brand:var(--bq-brand);--bq-background--overlay:var(--bq-neutral-900);--bq-icon--primary:var(--bq-neutral-800);--bq-icon--alt:var(--bq-white);--bq-icon--secondary:var(--bq-neutral-600);--bq-icon--inverse:var(--bq-neutral-50);--bq-icon--brand:var(--bq-brand);--bq-icon--info:var(--bq-brand);--bq-icon--success:var(--bq-success);--bq-icon--warning:var(--bq-warning);--bq-icon--danger:var(--bq-danger);--bq-stroke--primary:var(--bq-neutral-200);--bq-stroke--secondary:var(--bq-neutral-600);--bq-stroke--tertiary:var(--bq-neutral-900);--bq-stroke--inverse:var(--bq-white);--bq-stroke--brand:var(--bq-brand);--bq-stroke--alt:var(--bq-neutral-50);--bq-stroke--success:var(--bq-success);--bq-stroke--warning:var(--bq-warning);--bq-stroke--danger:var(--bq-danger);--bq-stroke--info:var(--bq-brand);--bq-text--primary:var(--bq-neutral-800);--bq-text--secondary:var(--bq-neutral-600);--bq-text--inverse:var(--bq-neutral-50);--bq-text--brand:var(--bq-brand);--bq-text--alt:var(--bq-white);--bq-text--info:var(--bq-brand);--bq-text--success:var(--bq-success);--bq-text--warning:var(--bq-warning);--bq-text--danger:var(--bq-danger);--bq-ui--primary:var(--bq-white);--bq-ui--secondary:var(--bq-neutral-200);--bq-ui--tertiary:var(--bq-neutral-500);--bq-ui--inverse:var(--bq-neutral-900);--bq-ui--brand:var(--bq-brand);--bq-ui--brand-alt:var(--bq-brand-light);--bq-ui--alt:var(--bq-neutral-50);--bq-ui--success:var(--bq-success);--bq-ui--success-alt:var(--bq-success-light);--bq-ui--warning:var(--bq-warning);--bq-ui--warning-alt:var(--bq-warning-light);--bq-ui--danger:var(--bq-danger);--bq-ui--danger-alt:var(--bq-danger-light);--bq-ui--info:var(--bq-brand);--bq-ui--info-alt:var(--bq-brand-light);--bq-hover:#bcbfc5;--bq-active:#444546}.beeq.dark,.dark,[bq-mode=dark]{--bq-background--primary:var(--bq-neutral-1000);--bq-background--secondary:var(--bq-neutral-950);--bq-background--tertiary:var(--bq-neutral-800);--bq-background--alt:var(--bq-neutral-700);--bq-background--inverse:var(--bq-neutral-600);--bq-background--brand:var(--bq-brand);--bq-background--overlay:var(--bq-neutral-900);--bq-icon--primary:var(--bq-neutral-100);--bq-icon--secondary:var(--bq-neutral-400);--bq-icon--inverse:var(--bq-neutral-800);--bq-icon--brand:var(--bq-brand);--bq-icon--alt:var(--bq-white);--bq-icon--info:var(--bq-brand);--bq-icon--success:var(--bq-success);--bq-icon--warning:var(--bq-warning);--bq-icon--danger:var(--bq-danger);--bq-stroke--primary:var(--bq-neutral-900);--bq-stroke--secondary:var(--bq-neutral-700);--bq-stroke--tertiary:var(--bq-neutral-400);--bq-stroke--inverse:var(--bq-neutral-950);--bq-stroke--brand:var(--bq-brand);--bq-stroke--alt:var(--bq-neutral-1000);--bq-stroke--success:var(--bq-success);--bq-stroke--warning:var(--bq-warning);--bq-stroke--danger:var(--bq-danger);--bq-stroke--info:var(--bq-brand);--bq-text--primary:var(--bq-neutral-100);--bq-text--secondary:var(--bq-neutral-400);--bq-text--inverse:var(--bq-neutral-800);--bq-text--brand:var(--bq-brand);--bq-text--alt:var(--bq-white);--bq-text--info:var(--bq-brand);--bq-text--success:var(--bq-success);--bq-text--warning:var(--bq-warning);--bq-text--danger:var(--bq-danger);--bq-ui--primary:var(--bq-neutral-900);--bq-ui--secondary:var(--bq-neutral-800);--bq-ui--tertiary:var(--bq-neutral-700);--bq-ui--inverse:var(--bq-neutral-100);--bq-ui--brand:var(--bq-brand);--bq-ui--brand-alt:var(--bq-brand-dark);--bq-ui--alt:var(--bq-neutral-950);--bq-ui--success:var(--bq-success);--bq-ui--success-alt:var(--bq-success-dark);--bq-ui--warning:var(--bq-warning);--bq-ui--warning-alt:var(--bq-warning-dark);--bq-ui--danger:var(--bq-danger);--bq-ui--danger-alt:var(--bq-danger-dark);--bq-ui--info:var(--bq-brand);--bq-ui--info-alt:var(--bq-brand-dark);--bq-hover:#444546;--bq-active:#1f2026}.endava,[bq-theme=endava]{--bq-font-family:"Poppins",sans-serif;--bq-white:#fafbfb;--bq-black:#030406;--bq-neutral-50:var(--bq-endava-grey-50);--bq-neutral-100:var(--bq-endava-grey-100);--bq-neutral-200:var(--bq-endava-grey-200);--bq-neutral-300:var(--bq-endava-grey-300);--bq-neutral-400:var(--bq-endava-grey-400);--bq-neutral-500:var(--bq-endava-grey-500);--bq-neutral-600:var(--bq-endava-grey-600);--bq-neutral-700:var(--bq-endava-grey-700);--bq-neutral-800:var(--bq-endava-grey-800);--bq-neutral-900:var(--bq-endava-grey-900);--bq-neutral-950:var(--bq-endava-grey-950);--bq-neutral-1000:var(--bq-endava-grey-1000);--bq-brand-light:var(--bq-endava-orange-100);--bq-brand:var(--bq-endava-orange-600);--bq-brand-dark:var(--bq-endava-orange-1000);--bq-accent-light:var(--bq-endava-orange-100);--bq-accent:var(--bq-endava-orange-600);--bq-accent-dark:var(--bq-endava-orange-1000);--bq-success-light:var(--bq-green-100);--bq-success:var(--bq-green-600);--bq-success-dark:var(--bq-green-1000);--bq-danger-light:var(--bq-corai-100);--bq-danger:var(--bq-corai-600);--bq-danger-dark:var(--bq-corai-1000);--bq-warning-light:var(--bq-yellow-100);--bq-warning:var(--bq-yellow-600);--bq-warning-dark:var(--bq-yellow-1000);--bq-info-light:var(--bq-blue-100);--bq-info:var(--bq-blue-600);--bq-info-dark:var(--bq-blue-1000);--bq-focus:var(--bq-endava-orange-600);--bq-data-01:var(--bq-brand);--bq-data-02:#af0cd8;--bq-data-03:#0ca8d8;--bq-data-04:var(--bq-teal-600);--bq-data-05:var(--bq-yellow-600);--bq-data-06:var(--bq-orange-600);--bq-data-07:var(--bq-blue-600);--bq-data-08:var(--bq-red-600);--bq-data-09:var(--bq-purple-600);--bq-data-10:#394b56;--bq-data-11:var(--bq-black);--bq-data-12:var(--bq-white)}.endava.light,[bq-theme=endava][bq-mode=light]{--bq-background--primary:var(--bq-white);--bq-background--secondary:var(--bq-neutral-100);--bq-background--tertiary:var(--bq-neutral-200);--bq-background--alt:var(--bq-neutral-300);--bq-background--inverse:var(--bq-neutral-900);--bq-background--brand:var(--bq-brand);--bq-background--overlay:var(--bq-neutral-900);--bq-icon--primary:var(--bq-neutral-800);--bq-icon--secondary:var(--bq-neutral-600);--bq-icon--inverse:var(--bq-neutral-50);--bq-icon--brand:var(--bq-brand);--bq-icon--alt:var(--bq-white);--bq-icon--info:var(--bq-info);--bq-icon--success:var(--bq-success);--bq-icon--warning:var(--bq-warning);--bq-icon--danger:var(--bq-danger);--bq-stroke--primary:var(--bq-neutral-200);--bq-stroke--secondary:var(--bq-neutral-600);--bq-stroke--tertiary:var(--bq-neutral-900);--bq-stroke--inverse:var(--bq-white);--bq-stroke--brand:var(--bq-brand);--bq-stroke--alt:var(--bq-neutral-50);--bq-stroke--brand-alt:var(--bq-brand-light);--bq-stroke--success:var(--bq-success);--bq-stroke--warning:var(--bq-warning);--bq-stroke--danger:var(--bq-danger);--bq-stroke--info:var(--bq-info);--bq-text--primary:var(--bq-neutral-800);--bq-text--secondary:var(--bq-neutral-600);--bq-text--inverse:var(--bq-neutral-50);--bq-text--brand:var(--bq-brand);--bq-text--alt:var(--bq-white);--bq-text--info:var(--bq-info);--bq-text--success:var(--bq-success);--bq-text--warning:var(--bq-warning);--bq-text--danger:var(--bq-danger);--bq-ui--primary:var(--bq-white);--bq-ui--secondary:var(--bq-neutral-200);--bq-ui--tertiary:var(--bq-neutral-500);--bq-ui--inverse:var(--bq-neutral-900);--bq-ui--alt:var(--bq-neutral-50);--bq-ui--brand-alt:var(--bq-brand-light);--bq-ui--brand:var(--bq-brand);--bq-ui--success:var(--bq-success);--bq-ui--success-alt:var(--bq-success-light);--bq-ui--warning:var(--bq-warning);--bq-ui--warning-alt:var(--bq-warning-light);--bq-ui--danger:var(--bq-danger);--bq-ui--danger-alt:var(--bq-danger-light);--bq-ui--info:var(--bq-info);--bq-ui--info-alt:var(--bq-info-light);--bq-hover:#444546;--bq-active:#1f2026}.endava.dark,[bq-theme=endava][bq-mode=dark]{--bq-background--primary:var(--bq-neutral-1000);--bq-background--secondary:var(--bq-neutral-900);--bq-background--tertiary:var(--bq-neutral-800);--bq-background--alt:var(--bq-neutral-700);--bq-background--inverse:var(--bq-neutral-600);--bq-background--brand:var(--bq-brand);--bq-background--overlay:var(--bq-neutral-900);--bq-icon--primary:var(--bq-neutral-100);--bq-icon--secondary:var(--bq-neutral-400);--bq-icon--inverse:var(--bq-neutral-800);--bq-icon--brand:var(--bq-brand);--bq-icon--alt:var(--bq-white);--bq-icon--info:var(--bq-info);--bq-icon--success:var(--bq-success);--bq-icon--warning:var(--bq-warning);--bq-icon--danger:var(--bq-danger);--bq-stroke--primary:var(--bq-neutral-900);--bq-stroke--secondary:var(--bq-neutral-700);--bq-stroke--tertiary:var(--bq-neutral-400);--bq-stroke--inverse:var(--bq-neutral-950);--bq-stroke--brand:var(--bq-brand);--bq-stroke--brand-alt:var(--bq-brand-dark);--bq-stroke--alt:var(--bq-neutral-1000);--bq-stroke--success:var(--bq-success);--bq-stroke--warning:var(--bq-warning);--bq-stroke--danger:var(--bq-danger);--bq-stroke--info:var(--bq-info);--bq-text--primary:var(--bq-neutral-100);--bq-text--secondary:var(--bq-neutral-400);--bq-text--inverse:var(--bq-neutral-800);--bq-text--brand:var(--bq-brand);--bq-text--alt:var(--bq-neutral-white);--bq-text--info:var(--bq-info);--bq-text--success:var(--bq-success);--bq-text--warning:var(--bq-warning);--bq-text--danger:var(--bq-danger);--bq-ui--primary:var(--bq-neutral-900);--bq-ui--secondary:var(--bq-neutral-800);--bq-ui--tertiary:var(--bq-neutral-700);--bq-ui--inverse:var(--bq-neutral-100);--bq-ui--brand:var(--bq-brand);--bq-ui--brand-alt:var(--bq-brand-dark);--bq-ui--alt:var(--bq-neutral-950);--bq-ui--success:var(--bq-success);--bq-ui--success-alt:var(--bq-success-dark);--bq-ui--warning:var(--bq-warning);--bq-ui--warning-alt:var(--bq-warning-dark);--bq-ui--danger:var(--bq-danger);--bq-ui--danger-alt:var(--bq-danger-dark);--bq-ui--info:var(--bq-info);--bq-ui--info-alt:var(--bq-info-dark);--bq-hover:#444546;--bq-active:#1f2026}.transform{--tw-translate-x:0;--tw-translate-y:0;--tw-rotate:0;--tw-skew-x:0;--tw-skew-y:0;--tw-scale-x:1;--tw-scale-y:1;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.block{display:block}.flex-auto{flex:1 1 auto}.resize-y{resize:vertical}.rounded-\\[--bq-textarea--border-radius\\]{border-radius:var(--bq-textarea--border-radius)}.border-\\[length\\:--bq-textarea--border-width\\]{border-width:var(--bq-textarea--border-width)}.border-\\[color\\:--bq-ring-color-focus\\]{border-color:var(--bq-ring-color-focus)}.border-\\[color\\:--bq-textarea--border-color\\]{border-color:var(--bq-textarea--border-color)}.border-stroke-danger{border-color:var(--bq-stroke--danger)}.border-stroke-success{border-color:var(--bq-stroke--success)}.border-stroke-warning{border-color:var(--bq-stroke--warning)}.bg-\\[--bq-textarea--background-color\\]{background-color:var(--bq-textarea--background-color)}.pe-\\[--bq-textarea--padding-end\\]{padding-inline-end:var(--bq-textarea--padding-end)}.ps-\\[--bq-textarea--padding-start\\]{padding-inline-start:var(--bq-textarea--padding-start)}.text-\\[length\\:--bq-textarea--helper-text-size\\]{font-size:var(--bq-textarea--helper-text-size)}.text-\\[length\\:--bq-textarea--label-text-size\\]{font-size:var(--bq-textarea--label-text-size)}.text-\\[length\\:--bq-textarea--text-size\\]{font-size:var(--bq-textarea--text-size)}.text-\\[color\\:--bq-textarea--helper-text-color\\]{color:var(--bq-textarea--helper-text-color)}.text-\\[color\\:--bq-textarea--label-text-color\\]{color:var(--bq-textarea--label-text-color)}.text-\\[color\\:--bq-textarea--text-color\\]{color:var(--bq-textarea--text-color)}.text-text-danger{color:var(--bq-text--danger)}.text-text-success{color:var(--bq-text--success)}.text-text-warning{color:var(--bq-text--warning)}.opacity-60{opacity:.6}.transition-colors{transition-duration:.15s;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke;transition-timing-function:cubic-bezier(.4,0,.2,1)}.border-active-stroke-danger{border-color:color-mix(in srgb,var(--bq-stroke--danger),var(--bq-active) 20%)}.border-active-stroke-success{border-color:color-mix(in srgb,var(--bq-stroke--success),var(--bq-active) 20%)}.border-active-stroke-warning{border-color:color-mix(in srgb,var(--bq-stroke--warning),var(--bq-active) 20%)}.bs-\\[inherit\\]{block-size:inherit}.is-full{inline-size:100%}.p-b-\\[--bq-textarea--paddingY\\]{padding-block:var(--bq-textarea--paddingY)}.m-be-\\[--bq-textarea--label-margin-bottom\\]{margin-block-end:var(--bq-textarea--label-margin-bottom)}.m-bs-\\[--bq-textarea--helper-margin-top\\]{margin-block-start:var(--bq-textarea--helper-margin-top)}.focus{outline:var(--bq-ring-width,2px) solid var(--bq-ring-color-focus,var(--bq-focus));outline-offset:var(--bq-ring-offset-width,1px)}@-webkit-keyframes fade-in{0%{opacity:0}}@keyframes fade-in{0%{opacity:0}}@-webkit-keyframes slide-in{0%{-webkit-transform:translateY(10px);transform:translateY(10px)}}@keyframes slide-in{0%{-webkit-transform:translateY(10px);transform:translateY(10px)}}@-webkit-keyframes spin{0%{-webkit-transform:rotate(0deg);transform:rotate(0deg)}to{-webkit-transform:rotate(1turn);transform:rotate(1turn)}}@keyframes spin{0%{-webkit-transform:rotate(0deg);transform:rotate(0deg)}to{-webkit-transform:rotate(1turn);transform:rotate(1turn)}}:host{--bq-textarea--background-color:var(--bq-ui--primary);--bq-textarea--border-color:var(--bq-stroke--tertiary);--bq-textarea--border-color-focus:var(--bq-stroke--brand);--bq-textarea--border-radius:var(--bq-radius--s);--bq-textarea--border-width:var(--bq-stroke-s);--bq-textarea--border-style:solid;--bq-textarea--helper-margin-top:var(--bq-spacing-xs);--bq-textarea--helper-text-size:var(--bq-font-size--s);--bq-textarea--helper-text-color:var(--bq-text--primary);--bq-textarea--label-margin-bottom:var(--bq-spacing-xs);--bq-textarea--label-text-size:var(--bq-font-size--s);--bq-textarea--label-text-color:var(--bq-text--primary);--bq-textarea--paddingY:var(--bq-spacing-s);--bq-textarea--padding-start:var(--bq-spacing-m);--bq-textarea--padding-end:var(--bq-spacing-m);--bq-textarea--text-color:var(--bq-text--primary);--bq-textarea--text-size:var(--bq-font-size--m);--bq-textarea--text-placeholder-color:var(--bq-text--secondary);display:block;inline-size:100%}.bq-textarea__label{color:var(--bq-textarea--label-text-color);font-size:var(--bq-textarea--label-text-size);margin-block-end:var(--bq-textarea--label-margin-bottom)}.bq-textarea__input{background-color:var(--bq-textarea--background-color);block-size:inherit;border-color:var(--bq-textarea--border-color);border-radius:var(--bq-textarea--border-radius);border-width:var(--bq-textarea--border-width);color:var(--bq-textarea--text-color);flex:1 1 auto;font-size:var(--bq-textarea--text-size);padding-block:var(--bq-textarea--paddingY);padding-inline-end:var(--bq-textarea--padding-end);padding-inline-start:var(--bq-textarea--padding-start);resize:vertical;transition-duration:.15s;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke;transition-timing-function:cubic-bezier(.4,0,.2,1)}.bq-textarea__input::placeholder{color:var(--bq-textarea--text-placeholder-color)}.bq-textarea__input:hover:not([disabled]):not(:focus-within){border-color:color-mix(in srgb,var(--bq-stroke--brand),var(--bq-hover) 20%)}.bq-textarea__input:disabled{cursor:not-allowed;opacity:.6}.bq-textarea__input:not([disabled]):focus-within{--bq-ring-width:1px;--bq-ring-offset-width:0;--bq-ring-color-focus:var(--bq-textarea--border-color-focus);border-color:var(--bq-ring-color-focus);outline:var(--bq-ring-width,2px) solid var(--bq-ring-color-focus,var(--bq-focus));outline-offset:var(--bq-ring-offset-width,1px)}.bq-textarea__input.validation-error{border-color:var(--bq-stroke--danger)}.bq-textarea__input.validation-error:hover:not(.disabled):not(:focus-within){border-color:color-mix(in srgb,var(--bq-stroke--danger),var(--bq-hover) 20%)}.bq-textarea__input.validation-error:not(.disabled):focus-within{--bq-ring-color-focus:var(--bq-stroke--danger);border-color:color-mix(in srgb,var(--bq-stroke--danger),var(--bq-active) 20%)}.bq-textarea__input.validation-success{border-color:var(--bq-stroke--success)}.bq-textarea__input.validation-success:hover:not(.disabled):not(:focus-within){border-color:color-mix(in srgb,var(--bq-stroke--success),var(--bq-hover) 20%)}.bq-textarea__input.validation-success:not(.disabled):focus-within{--bq-ring-color-focus:var(--bq-stroke--success);border-color:color-mix(in srgb,var(--bq-stroke--success),var(--bq-active) 20%)}.bq-textarea__input.validation-warning{border-color:var(--bq-stroke--warning)}.bq-textarea__input.validation-warning:hover:not(.disabled):not(:focus-within){border-color:color-mix(in srgb,var(--bq-stroke--warning),var(--bq-hover) 20%)}.bq-textarea__input.validation-warning:not(.disabled):focus-within{--bq-ring-color-focus:var(--bq-stroke--warning);border-color:color-mix(in srgb,var(--bq-stroke--warning),var(--bq-active) 20%)}.bq-textarea__helper{color:var(--bq-textarea--helper-text-color);font-size:var(--bq-textarea--helper-text-size);margin-block-start:var(--bq-textarea--helper-margin-top)}.bq-textarea__helper.validation-error{color:var(--bq-text--danger)}.bq-textarea__helper.validation-success{color:var(--bq-text--success)}.bq-textarea__helper.validation-warning{color:var(--bq-text--warning)}.bq-textarea__helper[class~=validation-none] .bq-textarea__helper--counter{opacity:.6}.placeholder\\:text-\\[color\\:--bq-textarea--text-placeholder-color\\]::placeholder{color:var(--bq-textarea--text-placeholder-color)}.disabled\\:cursor-not-allowed:disabled{cursor:not-allowed}.disabled\\:opacity-60:disabled{opacity:.6}.static{position:static}.flex{display:flex}.\\!hidden{display:none!important}.resize-none{resize:none}.flex-col{flex-direction:column}.items-center{align-items:center}.justify-between{justify-content:space-between}.truncate{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.container{width:100%}@media (min-width:640px){.container{max-width:640px}}@media (min-width:768px){.container{max-width:768px}}@media (min-width:1024px){.container{max-width:1024px}}@media (min-width:1280px){.container{max-width:1280px}}@media (min-width:1536px){.container{max-width:1536px}}';const o=i;const s=class{constructor(e){a(this,e);this.bqBlur=r(this,"bqBlur",7);this.bqChange=r(this,"bqChange",7);this.bqClear=r(this,"bqClear",7);this.bqFocus=r(this,"bqFocus",7);this.bqInput=r(this,"bqInput",7);this.fallbackId="textarea";this.handleBlur=()=>{if(this.disabled)return;this.bqBlur.emit(this.el)};this.handleFocus=()=>{if(this.disabled)return;this.bqFocus.emit(this.el)};this.handleChange=a=>{if(this.disabled)return;if(!n(a.target,"textarea"))return;this.value=a.target.value;this.bqChange.emit({value:this.value,el:this.el})};this.handleInput=a=>{var r;if(this.disabled)return;(r=this.debounceBqInput)===null||r===void 0?void 0:r.cancel();if(!n(a.target,"textarea"))return;this.value=a.target.value;this.debounceBqInput=t((()=>{this.bqInput.emit({value:this.value,el:this.el})}),this.debounceTime);this.debounceBqInput();this.autoResize()};this.autoResize=()=>{if(!this.autoGrow)return;const a=this.textarea;if(!a)return;a.style.height="auto";a.style.height=`${a.scrollHeight}px`};this.handleLabelSlotChange=()=>{this.hasLabel=q(this.labelElem)};this.handleHelperTextSlotChange=()=>{this.hasHelperText=q(this.helperTextElem)};this.hasHelperText=false;this.hasLabel=false;this.autocapitalize="off";this.autocomplete="off";this.autocorrect="off";this.autofocus=undefined;this.autoGrow=false;this.debounceTime=0;this.disabled=false;this.disableResize=false;this.form=undefined;this.maxlength=undefined;this.name=undefined;this.placeholder=undefined;this.readonly=false;this.required=false;this.rows=5;this.spellcheck=false;this.validationStatus="none";this.value=undefined;this.wrap="soft"}handleValueChange(){if(!this.textarea)return;if(!this.maxlength||this.value.length<this.maxlength)return;this.value=this.value.substring(0,this.maxlength);this.textarea.value=this.value}componentDidLoad(){this.handleValueChange()}get numberOfCharacters(){if(!this.maxlength||!this.textarea)return 0;return this.value.length}render(){var a,r;return e("div",{key:"331d4f8a0e69c201642696a101698f143490c780",class:"bq-textarea flex flex-auto flex-col",part:"base"},e("label",{key:"726f72ee1a72b98f4e1be0dc86ac9336c202e57c",class:{"bq-textarea__label":true,"!hidden":!this.hasLabel},htmlFor:(a=this.name)!==null&&a!==void 0?a:this.fallbackId,ref:a=>this.labelElem=a,part:"label"},e("slot",{key:"f4dd236d832775a4a897bcd26ebbd490950179a8",name:"label",onSlotchange:this.handleLabelSlotChange})),e("textarea",{key:"523c4ebda953e951c7e9866c24acf6ba876a5da3",id:(r=this.name)!==null&&r!==void 0?r:this.fallbackId,class:{"bq-textarea__input":true,"resize-none":this.disableResize,[`validation-${this.validationStatus}`]:true},autocapitalize:this.autocapitalize,autocomplete:this.autocomplete,autocorrect:this.autocorrect,autofocus:this.autofocus,disabled:this.disabled,form:this.form,maxLength:this.maxlength>0?this.maxlength:undefined,name:this.name,placeholder:this.placeholder,readOnly:this.readonly,required:this.required,rows:this.rows,spellcheck:this.spellcheck,wrap:this.wrap,ref:a=>this.textarea=a,onBlur:this.handleBlur,onChange:this.handleChange,onFocus:this.handleFocus,onInput:this.handleInput,part:"input"},this.value),e("div",{key:"443cdfb15291b50fe6e6e52c27b14949ee74665a",class:{"bq-textarea__helper flex items-center justify-between":true,[`validation-${this.validationStatus}`]:true,"!hidden":!this.hasHelperText&&!this.maxlength},part:"helper-info"},e("span",{key:"a278c710b69f70919d3f4b5a10aa1bcdda432888",class:"bq-textarea__helper--text",ref:a=>this.helperTextElem=a,part:"helper-text"},e("slot",{key:"8721978f4696404bb97c3759267477f94bbd0409",name:"helper-text",onSlotchange:this.handleHelperTextSlotChange})),e("span",{key:"a0f3eb599a19aafa28ec83c2b8cbd1e264edcef4",class:{"bq-textarea__helper--counter":true,"!hidden":!this.maxlength},part:"helper-counter"},this.numberOfCharacters,"/",this.maxlength)))}static get delegatesFocus(){return true}get el(){return b(this)}static get watchers(){return{value:["handleValueChange"]}}};s.style=o;export{s as bq_textarea};
6
+ //# sourceMappingURL=p-7871f3f0.entry.js.map
@@ -1 +1 @@
1
- {"version":3,"names":["bqTextareaCss","BqTextareaStyle0","BqTextarea","this","fallbackId","handleBlur","disabled","bqBlur","emit","el","handleFocus","bqFocus","handleChange","ev","isHTMLElement","target","value","bqChange","handleInput","_a","debounceBqInput","cancel","debounce","bqInput","debounceTime","autoResize","autoGrow","inputElem","textarea","style","height","scrollHeight","handleLabelSlotChange","hasLabel","hasSlotContent","labelElem","handleHelperTextSlotChange","hasHelperText","helperTextElem","handleValueChange","maxlength","length","substring","componentDidLoad","numberOfCharacters","render","h","key","class","part","htmlFor","name","ref","label","onSlotchange","id","_b","disableResize","validationStatus","autocapitalize","autocomplete","autocorrect","autofocus","form","maxLength","undefined","placeholder","readOnly","readonly","required","rows","spellcheck","wrap","elem","onBlur","onChange","onFocus","onInput","span"],"sources":["../../packages/beeq/src/components/textarea/scss/bq-textarea.scss?tag=bq-textarea&encapsulation=shadow","../../packages/beeq/src/components/textarea/bq-textarea.tsx"],"sourcesContent":["/* -------------------------------------------------------------------------- */\n/* Textarea styles */\n/* -------------------------------------------------------------------------- */\n\n@import './bq-textarea.variables';\n\n:host {\n @apply block is-full;\n}\n\n/* -------------------------------------------------------------------------- */\n/* Label */\n/* -------------------------------------------------------------------------- */\n\n.bq-textarea__label {\n @apply text-[length:--bq-textarea--label-text-size] text-[color:--bq-textarea--label-text-color] m-be-[--bq-textarea--label-margin-bottom];\n}\n\n/* -------------------------------------------------------------------------- */\n/* Native HTML Textarea control */\n/* -------------------------------------------------------------------------- */\n\n.bq-textarea__input {\n @apply flex-auto resize-y bg-[--bq-textarea--background-color] bs-[inherit];\n // Border\n @apply rounded-[--bq-textarea--border-radius] border-[length:--bq-textarea--border-width] border-[color:--bq-textarea--border-color];\n // Padding\n @apply pe-[--bq-textarea--padding-end] ps-[--bq-textarea--padding-start] p-b-[--bq-textarea--paddingY];\n // Text\n @apply text-[length:--bq-textarea--text-size] text-[color:--bq-textarea--text-color] placeholder:text-[color:--bq-textarea--text-placeholder-color];\n // Transition\n @apply transition-colors ease-in-out;\n // Hover\n @apply [&:not([disabled]):not(:focus-within)]:hover:border-hover-stroke-brand;\n // Disabled\n @apply disabled:cursor-not-allowed disabled:opacity-60;\n // Focus\n &:not([disabled]):focus-within {\n --bq-ring-width: 1px;\n --bq-ring-offset-width: 0;\n --bq-ring-color-focus: var(--bq-textarea--border-color-focus);\n\n @apply focus border-[color:--bq-ring-color-focus];\n }\n}\n\n/* ------------------------------- Validations ------------------------------- */\n\n.bq-textarea__input.validation-error {\n @apply border-stroke-danger [&:not(.disabled):not(:focus-within)]:hover:border-hover-stroke-danger;\n\n &:not(.disabled):focus-within {\n --bq-ring-color-focus: theme(colors.stroke.danger);\n\n @apply border-active-stroke-danger;\n }\n}\n\n.bq-textarea__input.validation-success {\n @apply border-stroke-success [&:not(.disabled):not(:focus-within)]:hover:border-hover-stroke-success;\n\n &:not(.disabled):focus-within {\n --bq-ring-color-focus: theme(colors.stroke.success);\n\n @apply border-active-stroke-success;\n }\n}\n\n.bq-textarea__input.validation-warning {\n @apply border-stroke-warning [&:not(.disabled):not(:focus-within)]:hover:border-hover-stroke-warning;\n\n &:not(.disabled):focus-within {\n --bq-ring-color-focus: theme(colors.stroke.warning);\n\n @apply border-active-stroke-warning;\n }\n}\n\n/* -------------------------------------------------------------------------- */\n/* Helper text */\n/* -------------------------------------------------------------------------- */\n\n.bq-textarea__helper {\n @apply text-[length:--bq-textarea--helper-text-size] text-[color:--bq-textarea--helper-text-color] m-bs-[--bq-textarea--helper-margin-top];\n}\n\n/* ------------------------------- Validations ------------------------------ */\n\n.bq-textarea__helper.validation-error {\n @apply text-text-danger;\n}\n\n.bq-textarea__helper.validation-success {\n @apply text-text-success;\n}\n\n.bq-textarea__helper.validation-warning {\n @apply text-text-warning;\n}\n\n/* ----------------------------- Helper counter ----------------------------- */\n\n/** Apply a disabled text color style to the textarea counter when the validation is none. */\n.bq-textarea__helper[class~='validation-none'] {\n .bq-textarea__helper--counter {\n @apply opacity-60;\n }\n}\n","import { Component, Element, Event, EventEmitter, h, Prop, State, Watch } from '@stencil/core';\n\nimport { TTextareaAutoCapitalize, TTextareaWrap } from './bq-textarea.types';\nimport { debounce, hasSlotContent, isHTMLElement, TDebounce } from '../../shared/utils';\nimport { TInputValidation } from '../input/bq-input.types';\n\n/**\n * @part base - The component's base wrapper.\n * @part input - The textarea element.\n * @part label - The textarea label.\n * @part helper-info - The helper info container.\n * @part helper-text - The helper text.\n * @part helper-counter - The helper counter.\n */\n@Component({\n tag: 'bq-textarea',\n styleUrl: './scss/bq-textarea.scss',\n shadow: {\n delegatesFocus: true,\n },\n})\nexport class BqTextarea {\n // Own Properties\n // ====================\n\n private debounceBqInput: TDebounce<void>;\n private fallbackId = 'textarea';\n\n private helperTextElem?: HTMLElement;\n private labelElem?: HTMLLabelElement;\n private textarea: HTMLTextAreaElement;\n\n // Reference to host HTML element\n // ===================================\n\n @Element() el!: HTMLBqTextareaElement;\n\n // State() variables\n // Inlined decorator, alphabetical order\n // =======================================\n\n @State() private hasHelperText = false;\n @State() private hasLabel = false;\n\n // Public Property API\n // ========================\n\n /**\n * Controls whether or not the textarea field should be capitalized and how.\n * Possible values are 'off', 'none', 'on', 'sentences', 'words', and 'characters'.\n * See: https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/autocapitalize\n */\n @Prop({ reflect: true }) autocapitalize: TTextareaAutoCapitalize = 'off';\n\n /**\n * Specifies whether or not the textarea field should have autocomplete enabled.\n * See: https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/autocomplete#values\n */\n @Prop({ reflect: true }) autocomplete: string = 'off';\n\n /**\n * Controls whether or not the textarea field should have autocorrect enabled.\n * Possible values are 'on' and 'off'.\n */\n @Prop({ reflect: true }) autocorrect: 'on' | 'off' = 'off';\n\n /** If true, the textarea will be focused on component render */\n @Prop({ reflect: true }) autofocus: boolean;\n\n /**\n * If `true`, the textarea will automatically grow and shrink to fit its contents.\n * If `false`, the textarea will have a fixed height specified by the `rows` property.\n */\n @Prop({ reflect: true }) autoGrow: boolean = false;\n\n /**\n * The amount of time, in milliseconds, to wait before emitting the `bqInput` event after the textarea value changes.\n * A value of 0 means no debouncing will occur.\n */\n @Prop({ reflect: true, mutable: true }) debounceTime? = 0;\n\n /** If `true`, the user cannot interact with the textarea. */\n @Prop({ reflect: true }) disabled: boolean = false;\n\n /** If `true`, it will block the user's ability to resize the textarea. */\n @Prop({ reflect: true }) disableResize?: boolean = false;\n\n /** The ID of the form that the textarea field belongs to. */\n @Prop({ reflect: true }) form?: string;\n\n /**\n * The maximum number of characters that can be entered into the textarea (`0`: no limit).\n * When enabled, a character counter will be shown underneath the textarea.\n */\n @Prop({ reflect: true }) maxlength: number;\n\n /** The name of the textarea element. */\n @Prop({ reflect: true }) name!: string;\n\n /** The placeholder text to show when there is no value. */\n @Prop({ reflect: true }) placeholder!: string;\n\n /** If true, the textarea field cannot be modified. */\n @Prop({ reflect: true }) readonly?: boolean = false;\n\n /** Indicates whether or not the textarea field is required to be filled out before submitting the form. */\n @Prop({ reflect: true }) required?: boolean = false;\n\n /** The number of visible text lines for the control. It must be a positive integer. */\n @Prop({ reflect: true }) rows: number = 5;\n\n /** If true, the textarea content may be checked for spelling errors. */\n @Prop({ reflect: true }) spellcheck: boolean = false;\n /**\n * The validation status of the textarea.\n *\n * @remarks\n * This property is used to indicate the validation status of the textarea. It can be set to one of the following values:\n * - `'none'`: No validation status is set.\n * - `'error'`: The textarea has a validation error.\n * - `'warning'`: The textarea has a validation warning.\n * - `'success'`: The textarea has passed validation.\n */\n @Prop({ reflect: true }) validationStatus: TInputValidation = 'none';\n\n /** The value of the textarea. It can be used to reset the textarea to a previous value. */\n @Prop({ mutable: true }) value: string;\n\n /** Specifies how the text in a text area is to be wrapped when submitted in a form */\n @Prop({ reflect: true }) wrap: TTextareaWrap = 'soft';\n\n // Prop lifecycle events\n // =======================\n\n @Watch('value')\n handleValueChange() {\n if (!this.textarea) return;\n if (!this.maxlength || this.value.length < this.maxlength) return;\n // If the value is longer than the maxlength, we need to truncate it\n this.value = this.value.substring(0, this.maxlength);\n this.textarea.value = this.value;\n }\n\n // Events section\n // Requires JSDocs for public API documentation\n // ==============================================\n\n /** Callback handler emitted when the textarea loses focus */\n @Event() bqBlur!: EventEmitter<HTMLBqTextareaElement>;\n\n /**\n * Callback handler emitted when the textarea value has changed and the textarea loses focus.\n * This handler is called whenever the user finishes typing or pasting text into the textarea field and then clicks outside of the textarea field.\n */\n @Event() bqChange!: EventEmitter<{ value: string; el: HTMLBqTextareaElement }>;\n\n /** Callback handler emitted when the textarea value has been cleared */\n @Event() bqClear!: EventEmitter<HTMLBqTextareaElement>;\n\n /** Callback handler emitted when the textarea has received focus */\n @Event() bqFocus!: EventEmitter<HTMLBqTextareaElement>;\n\n /**\n * Callback handler emitted when the textarea value changes.\n * This handler is called whenever the user types or pastes text into the textarea field.\n */\n @Event() bqInput!: EventEmitter<{ value: string; el: HTMLBqTextareaElement }>;\n\n // Component lifecycle events\n // Ordered by their natural call order\n // =====================================\n\n // Listeners\n // ==============\n\n componentDidLoad() {\n this.handleValueChange();\n }\n\n // Public methods API\n // These methods are exposed on the host element.\n // Always use two lines.\n // Public Methods must be async.\n // Requires JSDocs for public API documentation.\n // ===============================================\n\n // Local methods\n // Internal business logic.\n // These methods cannot be called from the host element.\n // =======================================================\n\n private get numberOfCharacters() {\n if (!this.maxlength || !this.textarea) return 0;\n\n return this.value.length;\n }\n\n private handleBlur = () => {\n if (this.disabled) return;\n\n this.bqBlur.emit(this.el);\n };\n\n private handleFocus = () => {\n if (this.disabled) return;\n\n this.bqFocus.emit(this.el);\n };\n\n private handleChange = (ev: Event) => {\n if (this.disabled) return;\n\n if (!isHTMLElement(ev.target, 'textarea')) return;\n this.value = ev.target.value;\n\n this.bqChange.emit({ value: this.value, el: this.el });\n };\n\n private handleInput = (ev: Event) => {\n if (this.disabled) return;\n\n this.debounceBqInput?.cancel();\n\n if (!isHTMLElement(ev.target, 'textarea')) return;\n this.value = ev.target.value;\n\n this.debounceBqInput = debounce(() => {\n this.bqInput.emit({ value: this.value, el: this.el });\n }, this.debounceTime);\n this.debounceBqInput();\n\n this.autoResize();\n };\n\n private autoResize = () => {\n if (!this.autoGrow) return;\n\n const inputElem = this.textarea;\n if (!inputElem) return;\n\n inputElem.style.height = 'auto';\n inputElem.style.height = `${inputElem.scrollHeight}px`;\n };\n\n private handleLabelSlotChange = () => {\n this.hasLabel = hasSlotContent(this.labelElem);\n };\n\n private handleHelperTextSlotChange = () => {\n this.hasHelperText = hasSlotContent(this.helperTextElem);\n };\n\n // render() function\n // Always the last one in the class.\n // ===================================\n\n render() {\n return (\n <div class=\"bq-textarea flex flex-auto flex-col\" part=\"base\">\n <label\n class={{ 'bq-textarea__label': true, '!hidden': !this.hasLabel }}\n htmlFor={this.name ?? this.fallbackId}\n ref={(label: HTMLLabelElement) => (this.labelElem = label)}\n part=\"label\"\n >\n <slot name=\"label\" onSlotchange={this.handleLabelSlotChange} />\n </label>\n <textarea\n id={this.name ?? this.fallbackId}\n class={{\n 'bq-textarea__input': true,\n 'resize-none': this.disableResize,\n [`validation-${this.validationStatus}`]: true,\n }}\n autocapitalize={this.autocapitalize}\n autocomplete={this.autocomplete}\n autocorrect={this.autocorrect}\n autofocus={this.autofocus}\n disabled={this.disabled}\n form={this.form}\n maxLength={this.maxlength > 0 ? this.maxlength : undefined}\n name={this.name}\n placeholder={this.placeholder}\n readOnly={this.readonly}\n required={this.required}\n rows={this.rows}\n spellcheck={this.spellcheck}\n wrap={this.wrap}\n ref={(elem: HTMLTextAreaElement) => (this.textarea = elem)}\n onBlur={this.handleBlur}\n onChange={this.handleChange}\n onFocus={this.handleFocus}\n onInput={this.handleInput}\n part=\"input\"\n >\n {this.value}\n </textarea>\n <div\n class={{\n 'bq-textarea__helper flex items-center justify-between': true,\n [`validation-${this.validationStatus}`]: true,\n '!hidden': !this.hasHelperText && !this.maxlength,\n }}\n part=\"helper-info\"\n >\n <span\n class=\"bq-textarea__helper--text\"\n ref={(span: HTMLElement) => (this.helperTextElem = span)}\n part=\"helper-text\"\n >\n <slot name=\"helper-text\" onSlotchange={this.handleHelperTextSlotChange} />\n </span>\n <span class={{ 'bq-textarea__helper--counter': true, '!hidden': !this.maxlength }} part=\"helper-counter\">\n {this.numberOfCharacters}/{this.maxlength}\n </span>\n </div>\n </div>\n );\n }\n}\n"],"mappings":"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","ignoreList":[]}
1
+ {"version":3,"names":["bqTextareaCss","BqTextareaStyle0","BqTextarea","this","fallbackId","handleBlur","disabled","bqBlur","emit","el","handleFocus","bqFocus","handleChange","ev","isHTMLElement","target","value","bqChange","handleInput","_a","debounceBqInput","cancel","debounce","bqInput","debounceTime","autoResize","autoGrow","inputElem","textarea","style","height","scrollHeight","handleLabelSlotChange","hasLabel","hasSlotContent","labelElem","handleHelperTextSlotChange","hasHelperText","helperTextElem","handleValueChange","maxlength","length","substring","componentDidLoad","numberOfCharacters","render","h","key","class","part","htmlFor","name","ref","label","onSlotchange","id","_b","disableResize","validationStatus","autocapitalize","autocomplete","autocorrect","autofocus","form","maxLength","undefined","placeholder","readOnly","readonly","required","rows","spellcheck","wrap","elem","onBlur","onChange","onFocus","onInput","span"],"sources":["../../packages/beeq/src/components/textarea/scss/bq-textarea.scss?tag=bq-textarea&encapsulation=shadow","../../packages/beeq/src/components/textarea/bq-textarea.tsx"],"sourcesContent":["/* -------------------------------------------------------------------------- */\n/* Textarea styles */\n/* -------------------------------------------------------------------------- */\n\n@import './bq-textarea.variables';\n\n:host {\n @apply block is-full;\n}\n\n/* -------------------------------------------------------------------------- */\n/* Label */\n/* -------------------------------------------------------------------------- */\n\n.bq-textarea__label {\n @apply text-[length:--bq-textarea--label-text-size] text-[color:--bq-textarea--label-text-color] m-be-[--bq-textarea--label-margin-bottom];\n}\n\n/* -------------------------------------------------------------------------- */\n/* Native HTML Textarea control */\n/* -------------------------------------------------------------------------- */\n\n.bq-textarea__input {\n @apply flex-auto resize-y bg-[--bq-textarea--background-color] bs-[inherit];\n // Border\n @apply rounded-[--bq-textarea--border-radius] border-[length:--bq-textarea--border-width] border-[color:--bq-textarea--border-color];\n // Padding\n @apply pe-[--bq-textarea--padding-end] ps-[--bq-textarea--padding-start] p-b-[--bq-textarea--paddingY];\n // Text\n @apply text-[length:--bq-textarea--text-size] text-[color:--bq-textarea--text-color] placeholder:text-[color:--bq-textarea--text-placeholder-color];\n // Transition\n @apply transition-colors ease-in-out;\n // Hover\n @apply [&:not([disabled]):not(:focus-within)]:hover:border-hover-stroke-brand;\n // Disabled\n @apply disabled:cursor-not-allowed disabled:opacity-60;\n // Focus\n &:not([disabled]):focus-within {\n --bq-ring-width: 1px;\n --bq-ring-offset-width: 0;\n --bq-ring-color-focus: var(--bq-textarea--border-color-focus);\n\n @apply focus border-[color:--bq-ring-color-focus];\n }\n}\n\n/* ------------------------------- Validations ------------------------------- */\n\n.bq-textarea__input.validation-error {\n @apply border-stroke-danger [&:not(.disabled):not(:focus-within)]:hover:border-hover-stroke-danger;\n\n &:not(.disabled):focus-within {\n --bq-ring-color-focus: theme(colors.stroke.danger);\n\n @apply border-active-stroke-danger;\n }\n}\n\n.bq-textarea__input.validation-success {\n @apply border-stroke-success [&:not(.disabled):not(:focus-within)]:hover:border-hover-stroke-success;\n\n &:not(.disabled):focus-within {\n --bq-ring-color-focus: theme(colors.stroke.success);\n\n @apply border-active-stroke-success;\n }\n}\n\n.bq-textarea__input.validation-warning {\n @apply border-stroke-warning [&:not(.disabled):not(:focus-within)]:hover:border-hover-stroke-warning;\n\n &:not(.disabled):focus-within {\n --bq-ring-color-focus: theme(colors.stroke.warning);\n\n @apply border-active-stroke-warning;\n }\n}\n\n/* -------------------------------------------------------------------------- */\n/* Helper text */\n/* -------------------------------------------------------------------------- */\n\n.bq-textarea__helper {\n @apply text-[length:--bq-textarea--helper-text-size] text-[color:--bq-textarea--helper-text-color] m-bs-[--bq-textarea--helper-margin-top];\n}\n\n/* ------------------------------- Validations ------------------------------ */\n\n.bq-textarea__helper.validation-error {\n @apply text-text-danger;\n}\n\n.bq-textarea__helper.validation-success {\n @apply text-text-success;\n}\n\n.bq-textarea__helper.validation-warning {\n @apply text-text-warning;\n}\n\n/* ----------------------------- Helper counter ----------------------------- */\n\n/** Apply a disabled text color style to the textarea counter when the validation is none. */\n.bq-textarea__helper[class~='validation-none'] {\n .bq-textarea__helper--counter {\n @apply opacity-60;\n }\n}\n","import { Component, Element, Event, EventEmitter, h, Prop, State, Watch } from '@stencil/core';\n\nimport { TTextareaAutoCapitalize, TTextareaWrap } from './bq-textarea.types';\nimport { debounce, hasSlotContent, isHTMLElement, TDebounce } from '../../shared/utils';\nimport { TInputValidation } from '../input/bq-input.types';\n\n/**\n * @part base - The component's base wrapper.\n * @part input - The textarea element.\n * @part label - The textarea label.\n * @part helper-info - The helper info container.\n * @part helper-text - The helper text.\n * @part helper-counter - The helper counter.\n */\n@Component({\n tag: 'bq-textarea',\n styleUrl: './scss/bq-textarea.scss',\n shadow: {\n delegatesFocus: true,\n },\n})\nexport class BqTextarea {\n // Own Properties\n // ====================\n\n private debounceBqInput: TDebounce<void>;\n private fallbackId = 'textarea';\n\n private helperTextElem?: HTMLElement;\n private labelElem?: HTMLLabelElement;\n private textarea: HTMLTextAreaElement;\n\n // Reference to host HTML element\n // ===================================\n\n @Element() el!: HTMLBqTextareaElement;\n\n // State() variables\n // Inlined decorator, alphabetical order\n // =======================================\n\n @State() private hasHelperText = false;\n @State() private hasLabel = false;\n\n // Public Property API\n // ========================\n\n /**\n * Controls whether or not the textarea field should be capitalized and how.\n * Possible values are 'off', 'none', 'on', 'sentences', 'words', and 'characters'.\n * See: https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/autocapitalize\n */\n @Prop({ reflect: true }) autocapitalize: TTextareaAutoCapitalize = 'off';\n\n /**\n * Specifies whether or not the textarea field should have autocomplete enabled.\n * See: https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/autocomplete#values\n */\n @Prop({ reflect: true }) autocomplete: string = 'off';\n\n /**\n * Controls whether or not the textarea field should have autocorrect enabled.\n * Possible values are 'on' and 'off'.\n */\n @Prop({ reflect: true }) autocorrect: 'on' | 'off' = 'off';\n\n /** If true, the textarea will be focused on component render */\n @Prop({ reflect: true }) autofocus: boolean;\n\n /**\n * If `true`, the textarea will automatically grow and shrink to fit its contents.\n * If `false`, the textarea will have a fixed height specified by the `rows` property.\n */\n @Prop({ reflect: true }) autoGrow: boolean = false;\n\n /**\n * The amount of time, in milliseconds, to wait before emitting the `bqInput` event after the textarea value changes.\n * A value of 0 means no debouncing will occur.\n */\n @Prop({ reflect: true, mutable: true }) debounceTime? = 0;\n\n /** If `true`, the user cannot interact with the textarea. */\n @Prop({ reflect: true }) disabled: boolean = false;\n\n /** If `true`, it will block the user's ability to resize the textarea. */\n @Prop({ reflect: true }) disableResize?: boolean = false;\n\n /** The ID of the form that the textarea field belongs to. */\n @Prop({ reflect: true }) form?: string;\n\n /**\n * The maximum number of characters that can be entered into the textarea (`0`: no limit).\n * When enabled, a character counter will be shown underneath the textarea.\n */\n @Prop({ reflect: true }) maxlength: number;\n\n /** The name of the textarea element. */\n @Prop({ reflect: true }) name!: string;\n\n /** The placeholder text to show when there is no value. */\n @Prop({ reflect: true }) placeholder!: string;\n\n /** If true, the textarea field cannot be modified. */\n @Prop({ reflect: true }) readonly?: boolean = false;\n\n /** Indicates whether or not the textarea field is required to be filled out before submitting the form. */\n @Prop({ reflect: true }) required?: boolean = false;\n\n /** The number of visible text lines for the control. It must be a positive integer. */\n @Prop({ reflect: true }) rows: number = 5;\n\n /** If true, the textarea content may be checked for spelling errors. */\n @Prop({ reflect: true }) spellcheck: boolean = false;\n /**\n * The validation status of the textarea.\n *\n * @remarks\n * This property is used to indicate the validation status of the textarea. It can be set to one of the following values:\n * - `'none'`: No validation status is set.\n * - `'error'`: The textarea has a validation error.\n * - `'warning'`: The textarea has a validation warning.\n * - `'success'`: The textarea has passed validation.\n */\n @Prop({ reflect: true }) validationStatus: TInputValidation = 'none';\n\n /** The value of the textarea. It can be used to reset the textarea to a previous value. */\n @Prop({ mutable: true }) value: string;\n\n /** Specifies how the text in a text area is to be wrapped when submitted in a form */\n @Prop({ reflect: true }) wrap: TTextareaWrap = 'soft';\n\n // Prop lifecycle events\n // =======================\n\n @Watch('value')\n handleValueChange() {\n if (!this.textarea) return;\n if (!this.maxlength || this.value.length < this.maxlength) return;\n // If the value is longer than the maxlength, we need to truncate it\n this.value = this.value.substring(0, this.maxlength);\n this.textarea.value = this.value;\n }\n\n // Events section\n // Requires JSDocs for public API documentation\n // ==============================================\n\n /** Callback handler emitted when the textarea loses focus */\n @Event() bqBlur!: EventEmitter<HTMLBqTextareaElement>;\n\n /**\n * Callback handler emitted when the textarea value has changed and the textarea loses focus.\n * This handler is called whenever the user finishes typing or pasting text into the textarea field and then clicks outside of the textarea field.\n */\n @Event() bqChange!: EventEmitter<{ value: string; el: HTMLBqTextareaElement }>;\n\n /** Callback handler emitted when the textarea value has been cleared */\n @Event() bqClear!: EventEmitter<HTMLBqTextareaElement>;\n\n /** Callback handler emitted when the textarea has received focus */\n @Event() bqFocus!: EventEmitter<HTMLBqTextareaElement>;\n\n /**\n * Callback handler emitted when the textarea value changes.\n * This handler is called whenever the user types or pastes text into the textarea field.\n */\n @Event() bqInput!: EventEmitter<{ value: string; el: HTMLBqTextareaElement }>;\n\n // Component lifecycle events\n // Ordered by their natural call order\n // =====================================\n\n // Listeners\n // ==============\n\n componentDidLoad() {\n this.handleValueChange();\n }\n\n // Public methods API\n // These methods are exposed on the host element.\n // Always use two lines.\n // Public Methods must be async.\n // Requires JSDocs for public API documentation.\n // ===============================================\n\n // Local methods\n // Internal business logic.\n // These methods cannot be called from the host element.\n // =======================================================\n\n private get numberOfCharacters() {\n if (!this.maxlength || !this.textarea) return 0;\n\n return this.value.length;\n }\n\n private handleBlur = () => {\n if (this.disabled) return;\n\n this.bqBlur.emit(this.el);\n };\n\n private handleFocus = () => {\n if (this.disabled) return;\n\n this.bqFocus.emit(this.el);\n };\n\n private handleChange = (ev: Event) => {\n if (this.disabled) return;\n\n if (!isHTMLElement(ev.target, 'textarea')) return;\n this.value = ev.target.value;\n\n this.bqChange.emit({ value: this.value, el: this.el });\n };\n\n private handleInput = (ev: Event) => {\n if (this.disabled) return;\n\n this.debounceBqInput?.cancel();\n\n if (!isHTMLElement(ev.target, 'textarea')) return;\n this.value = ev.target.value;\n\n this.debounceBqInput = debounce(() => {\n this.bqInput.emit({ value: this.value, el: this.el });\n }, this.debounceTime);\n this.debounceBqInput();\n\n this.autoResize();\n };\n\n private autoResize = () => {\n if (!this.autoGrow) return;\n\n const inputElem = this.textarea;\n if (!inputElem) return;\n\n inputElem.style.height = 'auto';\n inputElem.style.height = `${inputElem.scrollHeight}px`;\n };\n\n private handleLabelSlotChange = () => {\n this.hasLabel = hasSlotContent(this.labelElem);\n };\n\n private handleHelperTextSlotChange = () => {\n this.hasHelperText = hasSlotContent(this.helperTextElem);\n };\n\n // render() function\n // Always the last one in the class.\n // ===================================\n\n render() {\n return (\n <div class=\"bq-textarea flex flex-auto flex-col\" part=\"base\">\n <label\n class={{ 'bq-textarea__label': true, '!hidden': !this.hasLabel }}\n htmlFor={this.name ?? this.fallbackId}\n ref={(label: HTMLLabelElement) => (this.labelElem = label)}\n part=\"label\"\n >\n <slot name=\"label\" onSlotchange={this.handleLabelSlotChange} />\n </label>\n <textarea\n id={this.name ?? this.fallbackId}\n class={{\n 'bq-textarea__input': true,\n 'resize-none': this.disableResize,\n [`validation-${this.validationStatus}`]: true,\n }}\n autocapitalize={this.autocapitalize}\n autocomplete={this.autocomplete}\n autocorrect={this.autocorrect}\n autofocus={this.autofocus}\n disabled={this.disabled}\n form={this.form}\n maxLength={this.maxlength > 0 ? this.maxlength : undefined}\n name={this.name}\n placeholder={this.placeholder}\n readOnly={this.readonly}\n required={this.required}\n rows={this.rows}\n spellcheck={this.spellcheck}\n wrap={this.wrap}\n ref={(elem: HTMLTextAreaElement) => (this.textarea = elem)}\n onBlur={this.handleBlur}\n onChange={this.handleChange}\n onFocus={this.handleFocus}\n onInput={this.handleInput}\n part=\"input\"\n >\n {this.value}\n </textarea>\n <div\n class={{\n 'bq-textarea__helper flex items-center justify-between': true,\n [`validation-${this.validationStatus}`]: true,\n '!hidden': !this.hasHelperText && !this.maxlength,\n }}\n part=\"helper-info\"\n >\n <span\n class=\"bq-textarea__helper--text\"\n ref={(span: HTMLElement) => (this.helperTextElem = span)}\n part=\"helper-text\"\n >\n <slot name=\"helper-text\" onSlotchange={this.handleHelperTextSlotChange} />\n </span>\n <span class={{ 'bq-textarea__helper--counter': true, '!hidden': !this.maxlength }} part=\"helper-counter\">\n {this.numberOfCharacters}/{this.maxlength}\n </span>\n </div>\n </div>\n );\n }\n}\n"],"mappings":"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","ignoreList":[]}
@@ -0,0 +1,6 @@
1
+ /*!
2
+ * Built by Endavans
3
+ * © https://beeq.design - Apache 2 License.
4
+ */
5
+ import{r as a,c as r,h as e,g as n}from"./p-76e714c6.js";import"./p-e5afdf8c.js";import{v as o}from"./p-687da041.js";import{b}from"./p-d7a88b16.js";const i=["small","medium"];const d=["filled","ghost"];class t{constructor(a){this.animationOptions={duration:200,easing:"ease-in-out"};this.el=a;this.header=a.querySelector("summary");this.panel=a.querySelector(".bq-accordion__body");this.animation=null;this.isClosing=false;this.isExpanding=false}open(){if(!this.isClosing&&this.el.open)return;this.el.style.height=`${this.el.offsetHeight}px`;this.el.open=true;window.requestAnimationFrame((()=>this.expand()))}close(){if(!this.isExpanding&&!this.el.open)return;this.isClosing=true;const a=`${this.el.offsetHeight}px`;const r=`${this.header.offsetHeight}px`;if(this.animation){this.animation.cancel()}this.animation=this.el.animate({height:[a,r]},this.animationOptions);this.animation.onfinish=()=>this.onAnimationFinish(false);this.animation.oncancel=()=>this.isClosing=false}expand(){this.isExpanding=true;const a=`${this.el.offsetHeight}px`;const r=`${this.header.offsetHeight+this.panel.offsetHeight}px`;if(this.animation){this.animation.cancel()}this.animation=this.el.animate({height:[a,r]},this.animationOptions);this.animation.onfinish=()=>this.onAnimationFinish(true);this.animation.oncancel=()=>this.isExpanding=false}onAnimationFinish(a){this.el.open=a;this.animation=null;this.isClosing=false;this.isExpanding=false;this.el.removeAttribute("style");const r=new Event("accordionTransitionEnd",{bubbles:false,composed:true});this.el.dispatchEvent(r)}}const c='::backdrop,:root{--bq-blue-100:#e7f0fd;--bq-blue-200:#d0e2fb;--bq-blue-300:#a1c5f7;--bq-blue-400:#73a8f3;--bq-blue-500:#448bef;--bq-blue-600:#156eeb;--bq-blue-700:#1158bc;--bq-blue-800:#0d428d;--bq-blue-900:#082c5e;--bq-blue-1000:#04162f;--bq-corai-100:#fff2f2;--bq-corai-200:#ffe6e6;--bq-corai-300:#ffccce;--bq-corai-400:#ffb3b5;--bq-corai-500:#ff999d;--bq-corai-600:#ff8084;--bq-corai-700:#cc666a;--bq-corai-800:#994d4f;--bq-corai-900:#663335;--bq-corai-1000:#331a1a;--bq-cyan-100:#e8f7fb;--bq-cyan-200:#d2f0f8;--bq-cyan-300:#a5e1f1;--bq-cyan-400:#78d1e9;--bq-cyan-500:#4bc2e2;--bq-cyan-600:#1eb3db;--bq-cyan-700:#188faf;--bq-cyan-800:#126b83;--bq-cyan-900:#0c4858;--bq-cyan-1000:#06242c;--bq-gold-100:#fbf4ec;--bq-gold-200:#f7e9da;--bq-gold-300:#f0d3b6;--bq-gold-400:#e8bc91;--bq-gold-500:#e1a66d;--bq-gold-600:#d99048;--bq-gold-700:#ae733a;--bq-gold-800:#82562b;--bq-gold-900:#573a1d;--bq-gold-1000:#2b1d0e;--bq-green-100:#e8f8ef;--bq-green-200:#d2f1e0;--bq-green-300:#a5e3c1;--bq-green-400:#78d5a1;--bq-green-500:#4bc782;--bq-green-600:#1eb963;--bq-green-700:#18944f;--bq-green-800:#126f3b;--bq-green-900:#0c4a28;--bq-green-1000:#062514;--bq-grey-100:#f1f2f4;--bq-grey-200:#e7e8eb;--bq-grey-300:#caccd2;--bq-grey-400:#a6aab3;--bq-grey-50:#f6f6f8;--bq-grey-500:#898e99;--bq-grey-600:#646a77;--bq-grey-700:#3f4350;--bq-grey-800:#2a2c35;--bq-grey-900:#1c1d23;--bq-grey-950:#15161a;--bq-grey-1000:#0d0e11;--bq-indigo-100:#edecfc;--bq-indigo-200:#dcdafa;--bq-indigo-300:#b9b5f5;--bq-indigo-400:#9590ef;--bq-indigo-500:#726bea;--bq-indigo-600:#4f46e5;--bq-indigo-700:#3f38b7;--bq-indigo-800:#2f2a89;--bq-indigo-900:#201c5c;--bq-indigo-1000:#100e2e;--bq-iris-100:#e9f0ff;--bq-iris-200:#d6e0ff;--bq-iris-300:#b2c0fe;--bq-iris-400:#8691f8;--bq-iris-500:#6061ee;--bq-iris-600:#4f46e5;--bq-iris-700:#413abd;--bq-iris-800:#332e95;--bq-iris-900:#26216d;--bq-iris-1000:#181545;--bq-lime-100:#f5fae8;--bq-lime-200:#ecf6d2;--bq-lime-300:#d9eda5;--bq-lime-400:#c5e379;--bq-lime-500:#b2da4c;--bq-lime-600:#9fd11f;--bq-lime-700:#7fa719;--bq-lime-800:#5f7d13;--bq-lime-900:#40540c;--bq-lime-1000:#202a06;--bq-magenta-100:#fce7f4;--bq-magenta-200:#f9cfea;--bq-magenta-300:#f39fd6;--bq-magenta-400:#ee6fbf;--bq-magenta-500:#e83fab;--bq-magenta-600:#de1395;--bq-magenta-700:#b20f77;--bq-magenta-800:#850c59;--bq-magenta-900:#58083c;--bq-magenta-1000:#2c041e;--bq-neutral-white:#fbfbfc;--bq-neutral-black:#060708;--bq-orange-100:#fbf0e9;--bq-orange-200:#f8e1d4;--bq-orange-300:#f1c2a8;--bq-orange-400:#eaa47d;--bq-orange-500:#e38551;--bq-orange-600:#dc6726;--bq-orange-700:#b0521e;--bq-orange-800:#843e17;--bq-orange-900:#58290f;--bq-orange-1000:#2c1508;--bq-purple-100:#efebf8;--bq-purple-200:#e0d7f2;--bq-purple-300:#c1afe5;--bq-purple-400:#a388d8;--bq-purple-500:#8460cb;--bq-purple-600:#6538be;--bq-purple-700:#512d98;--bq-purple-800:#3d2272;--bq-purple-900:#28164c;--bq-purple-1000:#140b26;--bq-red-100:#fce7ea;--bq-red-200:#f9d1d5;--bq-red-300:#f3a2ac;--bq-red-400:#ed7482;--bq-red-500:#e74559;--bq-red-600:#e1172f;--bq-red-700:#b41226;--bq-red-800:#870e1c;--bq-red-900:#5a0913;--bq-red-1000:#2d0509;--bq-sky-100:#eff4fb;--bq-sky-200:#dfeaf8;--bq-sky-300:#bfd5f1;--bq-sky-400:#9ec1e9;--bq-sky-500:#7eace2;--bq-sky-600:#5e97db;--bq-sky-700:#4b79af;--bq-sky-800:#385b83;--bq-sky-900:#263c58;--bq-sky-1000:#131e2c;--bq-teal-100:#e5f7f5;--bq-teal-200:#ccf0eb;--bq-teal-300:#99e1d8;--bq-teal-400:#66d2c4;--bq-teal-500:#33c3b1;--bq-teal-600:#00b49d;--bq-teal-700:#00907e;--bq-teal-800:#006c5e;--bq-teal-900:#00483f;--bq-teal-1000:#00241f;--bq-volcano-100:#feede7;--bq-volcano-200:#fddbd1;--bq-volcano-300:#fbb8a3;--bq-volcano-400:#fa9474;--bq-volcano-500:#f87146;--bq-volcano-600:#f64d18;--bq-volcano-700:#c53e13;--bq-volcano-800:#942e0e;--bq-volcano-900:#621f0a;--bq-volcano-1000:#310f05;--bq-yellow-100:#fefbe7;--bq-yellow-200:#fcf6d0;--bq-yellow-300:#faeea0;--bq-yellow-400:#f7e571;--bq-yellow-500:#f5dd41;--bq-yellow-600:#f2d412;--bq-yellow-700:#c2aa0e;--bq-yellow-800:#917f0b;--bq-yellow-900:#615507;--bq-yellow-1000:#302a04;--bq-endava-grey-50:#f7f7f8;--bq-endava-grey-100:#e4e6e7;--bq-endava-grey-200:#b5babe;--bq-endava-grey-300:#949ca1;--bq-endava-grey-400:#737d84;--bq-endava-grey-500:#525f67;--bq-endava-grey-600:#30404b;--bq-endava-grey-700:#2b3942;--bq-endava-grey-800:#263139;--bq-endava-grey-900:#192b37;--bq-endava-grey-950:#151b1e;--bq-endava-grey-1000:#0f1316;--bq-endava-neutral-white:#fafbfb;--bq-endava-neutral-black:#060708;--bq-endava-orange-100:#fef3f1;--bq-endava-orange-200:#fbd6d1;--bq-endava-orange-300:#fab7af;--bq-endava-orange-400:#fa988b;--bq-endava-orange-500:#fc7866;--bq-endava-orange-600:#ff5640;--bq-endava-orange-700:#ce4a39;--bq-endava-orange-800:#a03d30;--bq-endava-orange-900:#722e25;--bq-endava-orange-1000:#471e19}*,:after,:before{box-sizing:border-box}*{font:inherit;margin:0}ol[role=list],ul[role=list]{list-style-type:none}html{font-size:var(--bq-font-size--m)}html:focus-within{scroll-behavior:smooth}body{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background-color:var(--bq-background--primary);color:var(--bq-text--primary);font-family:var(--bq-font-family);line-height:var(--bq-font-line-height--regular);min-height:100vh;text-rendering:optimizeSpeed}a:not([class]){text-decoration-skip-ink:auto}canvas,img,picture,svg,video{display:block;max-width:100%}button,input,select,textarea{font:inherit}h1,h2,h3,h4,h5,h6,p{overflow-wrap:break-word}@media (prefers-reduced-motion:reduce){html:focus-within{scroll-behavior:auto}*,:after,:before{animation-duration:.01ms!important;animation-iteration-count:1!important;scroll-behavior:auto;transition-duration:.01ms!important}}:root{--bq-white:#fff;--bq-black:#060708;--bq-neutral-50:var(--bq-grey-50);--bq-neutral-100:var(--bq-grey-100);--bq-neutral-200:var(--bq-grey-200);--bq-neutral-300:var(--bq-grey-300);--bq-neutral-400:var(--bq-grey-400);--bq-neutral-500:var(--bq-grey-500);--bq-neutral-600:var(--bq-grey-600);--bq-neutral-700:var(--bq-grey-700);--bq-neutral-800:var(--bq-grey-800);--bq-neutral-900:var(--bq-grey-900);--bq-neutral-950:var(--bq-grey-950);--bq-neutral-1000:var(--bq-grey-1000);--bq-brand-light:var(--bq-iris-100);--bq-brand:var(--bq-iris-600);--bq-brand-dark:var(--bq-iris-1000);--bq-accent-light:var(--bq-purple-100);--bq-accent:var(--bq-purple-600);--bq-accent-dark:var(--bq-purple-1000);--bq-success-light:var(--bq-teal-100);--bq-success:var(--bq-teal-600);--bq-success-dark:var(--bq-teal-1000);--bq-danger-light:var(--bq-red-100);--bq-danger:var(--bq-red-600);--bq-danger-dark:var(--bq-red-1000);--bq-warning-light:var(--bq-gold-100);--bq-warning:var(--bq-gold-600);--bq-warning-dark:var(--bq-gold-1000);--bq-info-light:var(--bq-iris-100);--bq-info:var(--bq-iris-600);--bq-info-dark:var(--bq-iris-1000);--bq-focus:var(--bq-iris-600);--bq-data-01:var(--bq-brand);--bq-data-02:var(--bq-purple-600);--bq-data-03:var(--bq-magenta-600);--bq-data-04:var(--bq-cyan-600);--bq-data-05:var(--bq-teal-600);--bq-data-06:var(--bq-orange-600);--bq-data-07:var(--bq-yellow-600);--bq-data-08:var(--bq-red-600);--bq-data-09:var(--bq-blue-600);--bq-data-10:var(--bq-grey-600);--bq-data-11:var(--bq-black);--bq-data-12:var(--bq-white);--bq-radius--none:0;--bq-radius--xs2:0.125rem;--bq-radius--xs:0.25rem;--bq-radius--s:0.5rem;--bq-radius--m:0.75rem;--bq-radius--l:1.5rem;--bq-radius--full:9999px;--bq-box-shadow--xs:0 2px 0 rgba(0,0,0,.016);--bq-box-shadow--s:0 8px 24px rgba(0,0,0,.04);--bq-box-shadow--m:0 10px 48px -16px rgba(0,0,0,.12);--bq-box-shadow--l:0 20px 58px -16px rgba(0,0,0,.16);--bq-font-family:"Outfit",sans-serif;--bq-font-size--xs:0.75rem;--bq-font-size--s:0.875rem;--bq-font-size--m:1rem;--bq-font-size--l:1.125rem;--bq-font-size--xl:1.5rem;--bq-font-size--xxl:2rem;--bq-font-size--xxl2:2.5rem;--bq-font-size--xxl3:3rem;--bq-font-size--xxl4:3.5rem;--bq-font-size--xxl5:4rem;--bq-font-weight--thin:100;--bq-font-weight--light:300;--bq-font-weight--regular:400;--bq-font-weight--medium:500;--bq-font-weight--semibold:600;--bq-font-weight--bold:700;--bq-font-line-height--small:1.2;--bq-font-line-height--regular:1.5;--bq-font-line-height--large:1.5;--bq-spacing-xs3:0.125rem;--bq-spacing-xs2:0.25rem;--bq-spacing-xs:0.5rem;--bq-spacing-s:0.75rem;--bq-spacing-m:1rem;--bq-spacing-l:1.5rem;--bq-spacing-xl:2rem;--bq-spacing-xxl:2.5rem;--bq-spacing-xxl2:3.5rem;--bq-spacing-xxl3:4rem;--bq-spacing-xxl4:4.5rem;--bq-stroke-s:1px;--bq-stroke-m:2px;--bq-stroke-l:3px}.beeq.light,.light,:root,[bq-mode=light]{--bq-background--primary:var(--bq-white);--bq-background--secondary:var(--bq-neutral-100);--bq-background--tertiary:var(--bq-neutral-200);--bq-background--alt:var(--bq-neutral-300);--bq-background--inverse:var(--bq-neutral-900);--bq-background--brand:var(--bq-brand);--bq-background--overlay:var(--bq-neutral-900);--bq-icon--primary:var(--bq-neutral-800);--bq-icon--alt:var(--bq-white);--bq-icon--secondary:var(--bq-neutral-600);--bq-icon--inverse:var(--bq-neutral-50);--bq-icon--brand:var(--bq-brand);--bq-icon--info:var(--bq-brand);--bq-icon--success:var(--bq-success);--bq-icon--warning:var(--bq-warning);--bq-icon--danger:var(--bq-danger);--bq-stroke--primary:var(--bq-neutral-200);--bq-stroke--secondary:var(--bq-neutral-600);--bq-stroke--tertiary:var(--bq-neutral-900);--bq-stroke--inverse:var(--bq-white);--bq-stroke--brand:var(--bq-brand);--bq-stroke--alt:var(--bq-neutral-50);--bq-stroke--success:var(--bq-success);--bq-stroke--warning:var(--bq-warning);--bq-stroke--danger:var(--bq-danger);--bq-stroke--info:var(--bq-brand);--bq-text--primary:var(--bq-neutral-800);--bq-text--secondary:var(--bq-neutral-600);--bq-text--inverse:var(--bq-neutral-50);--bq-text--brand:var(--bq-brand);--bq-text--alt:var(--bq-white);--bq-text--info:var(--bq-brand);--bq-text--success:var(--bq-success);--bq-text--warning:var(--bq-warning);--bq-text--danger:var(--bq-danger);--bq-ui--primary:var(--bq-white);--bq-ui--secondary:var(--bq-neutral-200);--bq-ui--tertiary:var(--bq-neutral-500);--bq-ui--inverse:var(--bq-neutral-900);--bq-ui--brand:var(--bq-brand);--bq-ui--brand-alt:var(--bq-brand-light);--bq-ui--alt:var(--bq-neutral-50);--bq-ui--success:var(--bq-success);--bq-ui--success-alt:var(--bq-success-light);--bq-ui--warning:var(--bq-warning);--bq-ui--warning-alt:var(--bq-warning-light);--bq-ui--danger:var(--bq-danger);--bq-ui--danger-alt:var(--bq-danger-light);--bq-ui--info:var(--bq-brand);--bq-ui--info-alt:var(--bq-brand-light);--bq-hover:#bcbfc5;--bq-active:#444546}.beeq.dark,.dark,[bq-mode=dark]{--bq-background--primary:var(--bq-neutral-1000);--bq-background--secondary:var(--bq-neutral-950);--bq-background--tertiary:var(--bq-neutral-800);--bq-background--alt:var(--bq-neutral-700);--bq-background--inverse:var(--bq-neutral-600);--bq-background--brand:var(--bq-brand);--bq-background--overlay:var(--bq-neutral-900);--bq-icon--primary:var(--bq-neutral-100);--bq-icon--secondary:var(--bq-neutral-400);--bq-icon--inverse:var(--bq-neutral-800);--bq-icon--brand:var(--bq-brand);--bq-icon--alt:var(--bq-white);--bq-icon--info:var(--bq-brand);--bq-icon--success:var(--bq-success);--bq-icon--warning:var(--bq-warning);--bq-icon--danger:var(--bq-danger);--bq-stroke--primary:var(--bq-neutral-900);--bq-stroke--secondary:var(--bq-neutral-700);--bq-stroke--tertiary:var(--bq-neutral-400);--bq-stroke--inverse:var(--bq-neutral-950);--bq-stroke--brand:var(--bq-brand);--bq-stroke--alt:var(--bq-neutral-1000);--bq-stroke--success:var(--bq-success);--bq-stroke--warning:var(--bq-warning);--bq-stroke--danger:var(--bq-danger);--bq-stroke--info:var(--bq-brand);--bq-text--primary:var(--bq-neutral-100);--bq-text--secondary:var(--bq-neutral-400);--bq-text--inverse:var(--bq-neutral-800);--bq-text--brand:var(--bq-brand);--bq-text--alt:var(--bq-white);--bq-text--info:var(--bq-brand);--bq-text--success:var(--bq-success);--bq-text--warning:var(--bq-warning);--bq-text--danger:var(--bq-danger);--bq-ui--primary:var(--bq-neutral-900);--bq-ui--secondary:var(--bq-neutral-800);--bq-ui--tertiary:var(--bq-neutral-700);--bq-ui--inverse:var(--bq-neutral-100);--bq-ui--brand:var(--bq-brand);--bq-ui--brand-alt:var(--bq-brand-dark);--bq-ui--alt:var(--bq-neutral-950);--bq-ui--success:var(--bq-success);--bq-ui--success-alt:var(--bq-success-dark);--bq-ui--warning:var(--bq-warning);--bq-ui--warning-alt:var(--bq-warning-dark);--bq-ui--danger:var(--bq-danger);--bq-ui--danger-alt:var(--bq-danger-dark);--bq-ui--info:var(--bq-brand);--bq-ui--info-alt:var(--bq-brand-dark);--bq-hover:#444546;--bq-active:#1f2026}.endava,[bq-theme=endava]{--bq-font-family:"Poppins",sans-serif;--bq-white:#fafbfb;--bq-black:#030406;--bq-neutral-50:var(--bq-endava-grey-50);--bq-neutral-100:var(--bq-endava-grey-100);--bq-neutral-200:var(--bq-endava-grey-200);--bq-neutral-300:var(--bq-endava-grey-300);--bq-neutral-400:var(--bq-endava-grey-400);--bq-neutral-500:var(--bq-endava-grey-500);--bq-neutral-600:var(--bq-endava-grey-600);--bq-neutral-700:var(--bq-endava-grey-700);--bq-neutral-800:var(--bq-endava-grey-800);--bq-neutral-900:var(--bq-endava-grey-900);--bq-neutral-950:var(--bq-endava-grey-950);--bq-neutral-1000:var(--bq-endava-grey-1000);--bq-brand-light:var(--bq-endava-orange-100);--bq-brand:var(--bq-endava-orange-600);--bq-brand-dark:var(--bq-endava-orange-1000);--bq-accent-light:var(--bq-endava-orange-100);--bq-accent:var(--bq-endava-orange-600);--bq-accent-dark:var(--bq-endava-orange-1000);--bq-success-light:var(--bq-green-100);--bq-success:var(--bq-green-600);--bq-success-dark:var(--bq-green-1000);--bq-danger-light:var(--bq-corai-100);--bq-danger:var(--bq-corai-600);--bq-danger-dark:var(--bq-corai-1000);--bq-warning-light:var(--bq-yellow-100);--bq-warning:var(--bq-yellow-600);--bq-warning-dark:var(--bq-yellow-1000);--bq-info-light:var(--bq-blue-100);--bq-info:var(--bq-blue-600);--bq-info-dark:var(--bq-blue-1000);--bq-focus:var(--bq-endava-orange-600);--bq-data-01:var(--bq-brand);--bq-data-02:#af0cd8;--bq-data-03:#0ca8d8;--bq-data-04:var(--bq-teal-600);--bq-data-05:var(--bq-yellow-600);--bq-data-06:var(--bq-orange-600);--bq-data-07:var(--bq-blue-600);--bq-data-08:var(--bq-red-600);--bq-data-09:var(--bq-purple-600);--bq-data-10:#394b56;--bq-data-11:var(--bq-black);--bq-data-12:var(--bq-white)}.endava.light,[bq-theme=endava][bq-mode=light]{--bq-background--primary:var(--bq-white);--bq-background--secondary:var(--bq-neutral-100);--bq-background--tertiary:var(--bq-neutral-200);--bq-background--alt:var(--bq-neutral-300);--bq-background--inverse:var(--bq-neutral-900);--bq-background--brand:var(--bq-brand);--bq-background--overlay:var(--bq-neutral-900);--bq-icon--primary:var(--bq-neutral-800);--bq-icon--secondary:var(--bq-neutral-600);--bq-icon--inverse:var(--bq-neutral-50);--bq-icon--brand:var(--bq-brand);--bq-icon--alt:var(--bq-white);--bq-icon--info:var(--bq-info);--bq-icon--success:var(--bq-success);--bq-icon--warning:var(--bq-warning);--bq-icon--danger:var(--bq-danger);--bq-stroke--primary:var(--bq-neutral-200);--bq-stroke--secondary:var(--bq-neutral-600);--bq-stroke--tertiary:var(--bq-neutral-900);--bq-stroke--inverse:var(--bq-white);--bq-stroke--brand:var(--bq-brand);--bq-stroke--alt:var(--bq-neutral-50);--bq-stroke--brand-alt:var(--bq-brand-light);--bq-stroke--success:var(--bq-success);--bq-stroke--warning:var(--bq-warning);--bq-stroke--danger:var(--bq-danger);--bq-stroke--info:var(--bq-info);--bq-text--primary:var(--bq-neutral-800);--bq-text--secondary:var(--bq-neutral-600);--bq-text--inverse:var(--bq-neutral-50);--bq-text--brand:var(--bq-brand);--bq-text--alt:var(--bq-white);--bq-text--info:var(--bq-info);--bq-text--success:var(--bq-success);--bq-text--warning:var(--bq-warning);--bq-text--danger:var(--bq-danger);--bq-ui--primary:var(--bq-white);--bq-ui--secondary:var(--bq-neutral-200);--bq-ui--tertiary:var(--bq-neutral-500);--bq-ui--inverse:var(--bq-neutral-900);--bq-ui--alt:var(--bq-neutral-50);--bq-ui--brand-alt:var(--bq-brand-light);--bq-ui--brand:var(--bq-brand);--bq-ui--success:var(--bq-success);--bq-ui--success-alt:var(--bq-success-light);--bq-ui--warning:var(--bq-warning);--bq-ui--warning-alt:var(--bq-warning-light);--bq-ui--danger:var(--bq-danger);--bq-ui--danger-alt:var(--bq-danger-light);--bq-ui--info:var(--bq-info);--bq-ui--info-alt:var(--bq-info-light);--bq-hover:#444546;--bq-active:#1f2026}.endava.dark,[bq-theme=endava][bq-mode=dark]{--bq-background--primary:var(--bq-neutral-1000);--bq-background--secondary:var(--bq-neutral-900);--bq-background--tertiary:var(--bq-neutral-800);--bq-background--alt:var(--bq-neutral-700);--bq-background--inverse:var(--bq-neutral-600);--bq-background--brand:var(--bq-brand);--bq-background--overlay:var(--bq-neutral-900);--bq-icon--primary:var(--bq-neutral-100);--bq-icon--secondary:var(--bq-neutral-400);--bq-icon--inverse:var(--bq-neutral-800);--bq-icon--brand:var(--bq-brand);--bq-icon--alt:var(--bq-white);--bq-icon--info:var(--bq-info);--bq-icon--success:var(--bq-success);--bq-icon--warning:var(--bq-warning);--bq-icon--danger:var(--bq-danger);--bq-stroke--primary:var(--bq-neutral-900);--bq-stroke--secondary:var(--bq-neutral-700);--bq-stroke--tertiary:var(--bq-neutral-400);--bq-stroke--inverse:var(--bq-neutral-950);--bq-stroke--brand:var(--bq-brand);--bq-stroke--brand-alt:var(--bq-brand-dark);--bq-stroke--alt:var(--bq-neutral-1000);--bq-stroke--success:var(--bq-success);--bq-stroke--warning:var(--bq-warning);--bq-stroke--danger:var(--bq-danger);--bq-stroke--info:var(--bq-info);--bq-text--primary:var(--bq-neutral-100);--bq-text--secondary:var(--bq-neutral-400);--bq-text--inverse:var(--bq-neutral-800);--bq-text--brand:var(--bq-brand);--bq-text--alt:var(--bq-neutral-white);--bq-text--info:var(--bq-info);--bq-text--success:var(--bq-success);--bq-text--warning:var(--bq-warning);--bq-text--danger:var(--bq-danger);--bq-ui--primary:var(--bq-neutral-900);--bq-ui--secondary:var(--bq-neutral-800);--bq-ui--tertiary:var(--bq-neutral-700);--bq-ui--inverse:var(--bq-neutral-100);--bq-ui--brand:var(--bq-brand);--bq-ui--brand-alt:var(--bq-brand-dark);--bq-ui--alt:var(--bq-neutral-950);--bq-ui--success:var(--bq-success);--bq-ui--success-alt:var(--bq-success-dark);--bq-ui--warning:var(--bq-warning);--bq-ui--warning-alt:var(--bq-warning-dark);--bq-ui--danger:var(--bq-danger);--bq-ui--danger-alt:var(--bq-danger-dark);--bq-ui--info:var(--bq-info);--bq-ui--info-alt:var(--bq-info-dark);--bq-hover:#444546;--bq-active:#1f2026}.transform{--tw-translate-x:0;--tw-translate-y:0;--tw-rotate:0;--tw-skew-x:0;--tw-skew-y:0;--tw-scale-x:1;--tw-scale-y:1;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.pointer-events-none{pointer-events:none}.block{display:block}.flex{display:flex}.hidden{display:none}.flex-1{flex:1 1 0%}.cursor-not-allowed{cursor:not-allowed}.cursor-pointer{cursor:pointer}.select-none{user-select:none}.list-none{list-style-type:none}.items-center{align-items:center}.justify-center{justify-content:center}.gap-\\[--bq-accordion--medium-gap\\]{gap:var(--bq-accordion--medium-gap)}.gap-\\[--bq-accordion--small-gap\\]{gap:var(--bq-accordion--small-gap)}.overflow-hidden{overflow:hidden}.rounded-ee-\\[--bq-accordion--medium-radius\\]{border-end-end-radius:var(--bq-accordion--medium-radius)}.rounded-ee-\\[--bq-accordion--small-radius\\]{border-end-end-radius:var(--bq-accordion--small-radius)}.rounded-ee-\\[0px\\]{border-end-end-radius:0}.rounded-es-\\[--bq-accordion--medium-radius\\]{border-end-start-radius:var(--bq-accordion--medium-radius)}.rounded-es-\\[--bq-accordion--small-radius\\]{border-end-start-radius:var(--bq-accordion--small-radius)}.rounded-es-\\[0px\\]{border-end-start-radius:0}.rounded-se-\\[--bq-accordion--medium-radius\\]{border-start-end-radius:var(--bq-accordion--medium-radius)}.rounded-se-\\[--bq-accordion--small-radius\\]{border-start-end-radius:var(--bq-accordion--small-radius)}.rounded-se-\\[0px\\]{border-start-end-radius:0}.rounded-ss-\\[--bq-accordion--medium-radius\\]{border-start-start-radius:var(--bq-accordion--medium-radius)}.rounded-ss-\\[--bq-accordion--small-radius\\]{border-start-start-radius:var(--bq-accordion--small-radius)}.rounded-ss-\\[0px\\]{border-start-start-radius:0}.border-\\[length\\:--bq-accordion--collapsed-border-width\\]{border-width:var(--bq-accordion--collapsed-border-width)}.border-\\[length\\:--bq-accordion--expanded-border-width\\]{border-width:var(--bq-accordion--expanded-border-width)}.border-\\[length\\:--bq-accordion--panel-filled-border-width\\]{border-width:var(--bq-accordion--panel-filled-border-width)}.border-\\[length\\:--bq-accordion--panel-ghost-border-width\\]{border-width:var(--bq-accordion--panel-ghost-border-width)}.border-\\[color\\:--bq-accordion--collapsed-border-color\\]{border-color:var(--bq-accordion--collapsed-border-color)}.border-\\[color\\:--bq-accordion--expanded-border-color\\]{border-color:var(--bq-accordion--expanded-border-color)}.border-\\[color\\:--bq-accordion--panel-filled-border-color\\]{border-color:var(--bq-accordion--panel-filled-border-color)}.border-\\[color\\:--bq-accordion--panel-ghost-border-color\\]{border-color:var(--bq-accordion--panel-ghost-border-color)}.bg-\\[--bq-accordion--filled-collapsed-background\\]{background-color:var(--bq-accordion--filled-collapsed-background)}.bg-\\[--bq-accordion--filled-expanded-background\\]{background-color:var(--bq-accordion--filled-expanded-background)}.bg-\\[--bq-accordion--ghost-collapsed-background\\]{background-color:var(--bq-accordion--ghost-collapsed-background)}.bg-\\[--bq-accordion--ghost-expanded-background\\]{background-color:var(--bq-accordion--ghost-expanded-background)}.pe-\\[--bq-accordion--medium-padding-end\\]{padding-inline-end:var(--bq-accordion--medium-padding-end)}.pe-\\[--bq-accordion--panel-medium-filled-padding-end\\]{padding-inline-end:var(--bq-accordion--panel-medium-filled-padding-end)}.pe-\\[--bq-accordion--panel-medium-ghost-padding-end\\]{padding-inline-end:var(--bq-accordion--panel-medium-ghost-padding-end)}.pe-\\[--bq-accordion--panel-small-filled-padding-end\\]{padding-inline-end:var(--bq-accordion--panel-small-filled-padding-end)}.pe-\\[--bq-accordion--panel-small-ghost-padding-end\\]{padding-inline-end:var(--bq-accordion--panel-small-ghost-padding-end)}.pe-\\[--bq-accordion--small-padding-end\\]{padding-inline-end:var(--bq-accordion--small-padding-end)}.ps-\\[--bq-accordion--medium-padding-start\\]{padding-inline-start:var(--bq-accordion--medium-padding-start)}.ps-\\[--bq-accordion--panel-medium-filled-padding-start\\]{padding-inline-start:var(--bq-accordion--panel-medium-filled-padding-start)}.ps-\\[--bq-accordion--panel-medium-ghost-padding-start\\]{padding-inline-start:var(--bq-accordion--panel-medium-ghost-padding-start)}.ps-\\[--bq-accordion--panel-small-filled-padding-start\\]{padding-inline-start:var(--bq-accordion--panel-small-filled-padding-start)}.ps-\\[--bq-accordion--panel-small-ghost-padding-start\\]{padding-inline-start:var(--bq-accordion--panel-small-ghost-padding-start)}.ps-\\[--bq-accordion--small-padding-start\\]{padding-inline-start:var(--bq-accordion--small-padding-start)}.text-\\[--bq-accordion--filled-collapsed-text-color\\]{color:var(--bq-accordion--filled-collapsed-text-color)}.text-\\[--bq-accordion--filled-expanded-text-color\\]{color:var(--bq-accordion--filled-expanded-text-color)}.text-\\[--bq-accordion--ghost-collapsed-text-color\\]{color:var(--bq-accordion--ghost-collapsed-text-color)}.text-\\[--bq-accordion--ghost-expanded-text-color\\]{color:var(--bq-accordion--ghost-expanded-text-color)}.opacity-60{opacity:.6}.transition-\\[block-size\\2c content-visibility\\]{transition-duration:.15s;transition-property:block-size,content-visibility;transition-timing-function:cubic-bezier(.4,0,.2,1)}.transition-colors{transition-duration:.15s;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke;transition-timing-function:cubic-bezier(.4,0,.2,1)}.duration-300{transition-duration:.3s}.ease-in-out{transition-timing-function:cubic-bezier(.4,0,.2,1)}.bs-0{block-size:0}.bs-auto{block-size:auto}.p-b-\\[--bq-accordion--medium-padding-y\\]{padding-block:var(--bq-accordion--medium-padding-y)}.p-b-\\[--bq-accordion--panel-medium-filled-padding-y\\]{padding-block:var(--bq-accordion--panel-medium-filled-padding-y)}.p-b-\\[--bq-accordion--panel-medium-ghost-padding-y\\]{padding-block:var(--bq-accordion--panel-medium-ghost-padding-y)}.p-b-\\[--bq-accordion--panel-small-filled-padding-y\\]{padding-block:var(--bq-accordion--panel-small-filled-padding-y)}.p-b-\\[--bq-accordion--panel-small-ghost-padding-y\\]{padding-block:var(--bq-accordion--panel-small-ghost-padding-y)}.p-b-\\[--bq-accordion--small-padding-y\\]{padding-block:var(--bq-accordion--small-padding-y)}.\\[transition-behavior\\:allow-discrete\\]{transition-behavior:allow-discrete}@-webkit-keyframes fade-in{0%{opacity:0}}@keyframes fade-in{0%{opacity:0}}@-webkit-keyframes slide-in{0%{-webkit-transform:translateY(10px);transform:translateY(10px)}}@keyframes slide-in{0%{-webkit-transform:translateY(10px);transform:translateY(10px)}}@-webkit-keyframes spin{0%{-webkit-transform:rotate(0deg);transform:rotate(0deg)}to{-webkit-transform:rotate(1turn);transform:rotate(1turn)}}@keyframes spin{0%{-webkit-transform:rotate(0deg);transform:rotate(0deg)}to{-webkit-transform:rotate(1turn);transform:rotate(1turn)}}:host{--bq-accordion--small-padding-y:var(--bq-spacing-xs);--bq-accordion--small-padding-start:var(--bq-spacing-s);--bq-accordion--small-padding-end:var(--bq-spacing-s);--bq-accordion--small-gap:var(--bq-spacing-xs);--bq-accordion--small-radius:var(--bq-radius--xs);--bq-accordion--medium-padding-y:var(--bq-spacing-s);--bq-accordion--medium-padding-start:var(--bq-spacing-m);--bq-accordion--medium-padding-end:var(--bq-spacing-m);--bq-accordion--medium-gap:var(--bq-spacing-m);--bq-accordion--medium-radius:var(--bq-radius--xs);--bq-accordion--collapsed-border-color:transparent;--bq-accordion--collapsed-border-style:none;--bq-accordion--collapsed-border-width:unset;--bq-accordion--expanded-border-color:transparent;--bq-accordion--expanded-border-style:none;--bq-accordion--expanded-border-width:unset;--bq-accordion--filled-collapsed-background:var(--bq-ui--secondary);--bq-accordion--filled-collapsed-text-color:var(--bq-text--primary);--bq-accordion--filled-expanded-background:var(--bq-ui--brand-alt);--bq-accordion--filled-expanded-text-color:var(--bq-text--primary);--bq-accordion--ghost-collapsed-background:transparent;--bq-accordion--ghost-collapsed-text-color:var(--bq-text--primary);--bq-accordion--ghost-expanded-background:transparent;--bq-accordion--ghost-expanded-text-color:var(--bq-text--brand);--bq-accordion--panel-filled-border-color:var(--bq-stroke--primary);--bq-accordion--panel-filled-border-style:solid;--bq-accordion--panel-filled-border-width:var(--bq-stroke-s);--bq-accordion--panel-small-filled-padding-y:var(--bq-spacing-s);--bq-accordion--panel-small-filled-padding-start:var(--bq-spacing-s);--bq-accordion--panel-small-filled-padding-end:var(--bq-spacing-s);--bq-accordion--panel-medium-filled-padding-y:var(--bq-spacing-m);--bq-accordion--panel-medium-filled-padding-start:var(--bq-spacing-m);--bq-accordion--panel-medium-filled-padding-end:var(--bq-spacing-m);--bq-accordion--panel-ghost-border-color:transparent;--bq-accordion--panel-ghost-border-style:none;--bq-accordion--panel-ghost-border-width:unset;--bq-accordion--panel-small-ghost-padding-y:var(--bq-spacing-s);--bq-accordion--panel-small-ghost-padding-start:var(--bq-spacing-l);--bq-accordion--panel-small-ghost-padding-end:var(--bq-spacing-l);--bq-accordion--panel-medium-ghost-padding-y:var(--bq-spacing-m);--bq-accordion--panel-medium-ghost-padding-start:var(--bq-spacing-xl);--bq-accordion--panel-medium-ghost-padding-end:var(--bq-spacing-xl);display:block}.bq-accordion.disabled{cursor:not-allowed;opacity:.6}.bq-accordion.disabled .bq-accordion__header{pointer-events:none}.bq-accordion.small .bq-accordion__header{border-end-end-radius:var(--bq-accordion--small-radius);border-end-start-radius:var(--bq-accordion--small-radius);border-start-end-radius:var(--bq-accordion--small-radius);border-start-start-radius:var(--bq-accordion--small-radius);gap:var(--bq-accordion--small-gap);padding-block:var(--bq-accordion--small-padding-y);padding-inline-end:var(--bq-accordion--small-padding-end);padding-inline-start:var(--bq-accordion--small-padding-start)}.bq-accordion.medium .bq-accordion__header{border-end-end-radius:var(--bq-accordion--medium-radius);border-end-start-radius:var(--bq-accordion--medium-radius);border-start-end-radius:var(--bq-accordion--medium-radius);border-start-start-radius:var(--bq-accordion--medium-radius);gap:var(--bq-accordion--medium-gap);padding-block:var(--bq-accordion--medium-padding-y);padding-inline-end:var(--bq-accordion--medium-padding-end);padding-inline-start:var(--bq-accordion--medium-padding-start)}.bq-accordion[open] .bq-accordion__header{border-color:var(--bq-accordion--expanded-border-color);border-end-end-radius:0;border-end-start-radius:0;border-style:var(--bq-accordion--expanded-border-style);border-width:var(--bq-accordion--expanded-border-width)}.bq-accordion.small .bq-accordion__body{border-end-end-radius:var(--bq-accordion--small-radius);border-end-start-radius:var(--bq-accordion--small-radius);border-start-end-radius:0;border-start-start-radius:0}.bq-accordion.medium .bq-accordion__body{border-end-end-radius:var(--bq-accordion--medium-radius);border-end-start-radius:var(--bq-accordion--medium-radius);border-start-end-radius:0;border-start-start-radius:0}.bq-accordion.filled .bq-accordion__header{background-color:var(--bq-accordion--filled-collapsed-background)}.bq-accordion.filled .bq-accordion__header:hover{background-color:color-mix(in srgb,var(--bq-ui--secondary),var(--bq-hover) 20%)}.bq-accordion.filled .bq-accordion__header--text{color:var(--bq-accordion--filled-collapsed-text-color)}.bq-accordion.filled .bq-accordion__body{border-color:var(--bq-accordion--panel-filled-border-color);border-style:var(--bq-accordion--panel-filled-border-style);border-width:var(--bq-accordion--panel-filled-border-width)}.bq-accordion.filled[open] .bq-accordion__header{background-color:var(--bq-accordion--filled-expanded-background)}.bq-accordion.filled[open] .bq-accordion__header:hover{background-color:color-mix(in srgb,var(--bq-ui--secondary),var(--bq-hover) 20%)}.bq-accordion.filled[open] .bq-accordion__header--text{color:var(--bq-accordion--filled-expanded-text-color)}.bq-accordion.ghost .bq-accordion__header{background-color:var(--bq-accordion--ghost-collapsed-background)}.bq-accordion.ghost .bq-accordion__header:hover{background-color:color-mix(in srgb,var(--bq-ui--secondary),var(--bq-hover) 20%)}.bq-accordion.ghost .bq-accordion__header--text{color:var(--bq-accordion--ghost-collapsed-text-color)}.bq-accordion.ghost .bq-accordion__body{border-color:var(--bq-accordion--panel-ghost-border-color);border-style:var(--bq-accordion--panel-ghost-border-style);border-width:var(--bq-accordion--panel-ghost-border-width)}.bq-accordion.ghost[open] .bq-accordion__header{background-color:var(--bq-accordion--ghost-expanded-background)}.bq-accordion.ghost[open] .bq-accordion__header:hover{background-color:color-mix(in srgb,var(--bq-ui--secondary),var(--bq-hover) 20%)}.bq-accordion.ghost[open] .bq-accordion__header--text{color:var(--bq-accordion--ghost-expanded-text-color)}.bq-accordion.small.filled .bq-accordion__body{padding-block:var(--bq-accordion--panel-small-filled-padding-y);padding-inline-end:var(--bq-accordion--panel-small-filled-padding-end);padding-inline-start:var(--bq-accordion--panel-small-filled-padding-start)}.bq-accordion.medium.filled .bq-accordion__body{padding-block:var(--bq-accordion--panel-medium-filled-padding-y);padding-inline-end:var(--bq-accordion--panel-medium-filled-padding-end);padding-inline-start:var(--bq-accordion--panel-medium-filled-padding-start)}.bq-accordion.small.ghost .bq-accordion__body{padding-block:var(--bq-accordion--panel-small-ghost-padding-y);padding-inline-end:var(--bq-accordion--panel-small-ghost-padding-end);padding-inline-start:var(--bq-accordion--panel-small-ghost-padding-start)}.bq-accordion.medium.ghost .bq-accordion__body{padding-block:var(--bq-accordion--panel-medium-ghost-padding-y);padding-inline-end:var(--bq-accordion--panel-medium-ghost-padding-end);padding-inline-start:var(--bq-accordion--panel-medium-ghost-padding-start)}.bq-accordion::details-content{transition-behavior:allow-discrete;block-size:0;display:block;overflow:hidden;transition-duration:.3s;transition-property:block-size,content-visibility;transition-timing-function:cubic-bezier(.4,0,.2,1)}.bq-accordion[open]::details-content{block-size:auto}@supports (block-size:calc-size(auto)){.bq-accordion[open]:not(.no-animation)::details-content{block-size:calc-size(auto)}}.bq-accordion__header{--bq-ring-offset-width:-2px;align-items:center;border-color:var(--bq-accordion--collapsed-border-color);border-style:var(--bq-accordion--collapsed-border-style);border-width:var(--bq-accordion--collapsed-border-width);cursor:pointer;display:flex;list-style-type:none;transition-duration:.3s;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke;transition-timing-function:cubic-bezier(.4,0,.2,1);user-select:none}.bq-accordion__header:focus-visible{outline:var(--bq-ring-width,2px) solid var(--bq-ring-color-focus,var(--bq-focus));outline-offset:var(--bq-ring-offset-width,1px)}.bq-accordion__header::-webkit-details-marker,.bq-accordion__header::marker{display:none}.bq-accordion__header--text{flex:1 1 0%}.bq-accordion__header--prefix,.bq-accordion__header--suffix{align-items:center;display:flex;justify-content:center}.focus-visible\\:focus:focus-visible{outline:var(--bq-ring-width,2px) solid var(--bq-ring-color-focus,var(--bq-focus));outline-offset:var(--bq-ring-offset-width,1px)}.hover\\:bg-hover-ui-secondary:hover{background-color:color-mix(in srgb,var(--bq-ui--secondary),var(--bq-hover) 20%)}@supports (block-size:calc-size(auto)){.supports-\\[block-size\\:calc-size\\(auto\\)\\]\\:bs-\\[calc-size\\(auto\\)\\]{block-size:calc-size(auto)}}.rotate-180{--tw-translate-x:0;--tw-translate-y:0;--tw-rotate:0;--tw-skew-x:0;--tw-skew-y:0;--tw-scale-x:1;--tw-scale-y:1;--tw-rotate:180deg;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.collapse{visibility:collapse}.static{position:static}.\\!hidden{display:none!important}.transition-transform{transition-duration:.15s;transition-property:transform;transition-timing-function:cubic-bezier(.4,0,.2,1)}.text-\\[color\\:--bq-icon--color\\]{color:var(--bq-icon--color)}.bs-\\[--bq-icon--size\\]{block-size:var(--bq-icon--size)}.is-\\[--bq-icon--size\\]{inline-size:var(--bq-icon--size)}';const s=c;const q=class{constructor(e){a(this,e);this.bqBlur=r(this,"bqBlur",7);this.bqFocus=r(this,"bqFocus",7);this.bqOpen=r(this,"bqOpen",7);this.bqAfterOpen=r(this,"bqAfterOpen",7);this.bqClose=r(this,"bqClose",7);this.bqAfterClose=r(this,"bqAfterClose",7);this.bqClick=r(this,"bqClick",7);this.handleClick=a=>{a.preventDefault();if(this.disabled)return;this.bqClick.emit(this.el);this.expanded=!this.expanded};this.handleFocus=()=>{if(this.disabled)return;this.bqFocus.emit(this.el)};this.handleBlur=()=>{this.bqBlur.emit(this.el)};this.handlePrefixSlotChange=()=>{this.hasPrefix=b(this.prefixElem,"prefix")};this.handleSuffixSlotChange=()=>{this.hasSuffix=b(this.suffixElem,"suffix")};this.hasPrefix=false;this.hasSuffix=false;this.appearance="filled";this.disabled=false;this.expanded=false;this.noAnimation=false;this.rotate=false;this.size="medium"}checkPropValues(){o(i,"medium",this.el,"size");o(d,"filled",this.el,"appearance")}handleExpandedChange(){var a,r;const e=this.expanded?this.bqOpen.emit(this.el):this.bqClose.emit(this.el);if(e.defaultPrevented){this.expanded=!this.expanded;return}this.expanded?(a=this.accordion)===null||a===void 0?void 0:a.open():(r=this.accordion)===null||r===void 0?void 0:r.close();if(!this.isCssCalcSizeSupported)return;setTimeout((()=>{this.el.dispatchEvent(new CustomEvent("accordionTransitionEnd",{bubbles:false,composed:true}))}),200)}handleDisabledChange(){if(!this.disabled)return;this.expanded=false}handleJsAnimation(){if(this.isCssCalcSizeSupported)return;console.warn(`[bq-accordion] calc-size() is not supported and animation will be set through JS\n For vertical layout, consider using the 'noAnimation' prop ('no-animation' attribute) to disable it`);this.accordion=!this.noAnimation?new t(this.detailsElem):null}componentWillLoad(){this.checkPropValues()}componentDidLoad(){this.handleJsAnimation();this.handleExpandedChange()}onAccordionTransitionEnd(a){a.stopPropagation();if(a.target!==this.el)return;this.expanded?this.bqAfterOpen.emit(this.el):this.bqAfterClose.emit(this.el)}get open(){return this.expanded&&!this.disabled}get isCssCalcSizeSupported(){var a;return(a=window.CSS)===null||a===void 0?void 0:a.supports("(block-size: calc-size(auto))")}render(){return e("details",{key:"48c1d654694d4999c6d325fcbde8c43486e62213",class:{[`bq-accordion overflow-hidden ${this.size} ${this.appearance}`]:true,"no-animation":this.noAnimation,disabled:this.disabled},ref:a=>this.detailsElem=a,open:this.open,part:"base"},e("summary",{key:"f8fc495b559b16237b3a8ad49f5499d239cd68e8",class:"bq-accordion__header",onClick:this.handleClick,onFocus:this.handleFocus,onBlur:this.handleBlur,"aria-expanded":this.expanded,"aria-disabled":this.disabled,"aria-controls":"bq-accordion__body",tabindex:this.disabled?-1:0,part:"header"},e("div",{key:"305ee372c9c9537fea76e7b57b41ddaeb81640a5",ref:a=>this.prefixElem=a,class:{"bq-accordion__header--prefix":true,"!hidden":!this.hasPrefix},part:"prefix"},e("slot",{key:"e588a8a2f33215be8e70f642485c3d27c4b7767e",name:"prefix",onSlotchange:this.handlePrefixSlotChange})),e("div",{key:"248a47fd82003f7d745c88cdced34b3e6f5855a5",class:"bq-accordion__header--text",part:"text"},e("slot",{key:"eeddb1706abda0deaf90c878f0843176f1f19320",name:"header"})),e("div",{key:"ef62bfb8e766b59282092cdfb052ae71bff5d358",ref:a=>this.suffixElem=a,class:{"bq-accordion__header--suffix":true,"!hidden":!this.hasSuffix},part:"suffix"},e("slot",{key:"49b08c176cfd66552da0afc327fbbdc39b78d1e2",name:"suffix",onSlotchange:this.handleSuffixSlotChange})),e("div",{key:"27d8a460b110c6f33b7e7a49452a2d24ba373b64",class:{"flex items-center justify-center transition-transform duration-300 ease-in-out":true,"!hidden":this.open&&!this.rotate,"rotate-180":this.rotate&&this.open}},e("slot",{key:"19dc458b735a88262ab5df239404389aed64fdb8",name:"expand"},e("bq-icon",{key:"e9fdf8236ef47afbf8f1382437e8b68145ba980c",name:"plus"}))),e("div",{key:"853a99dcd4d5418915781c5d02f33b7fe47ac8cb",class:{"flex items-center justify-center":true,"!hidden":!this.open&&!this.rotate||this.rotate}},e("slot",{key:"ee6cb86a458f75df72d35e984ab26676f9d534dd",name:"collapse"},e("bq-icon",{key:"d84dcc1320fb6ed50933593aebde0e4afc7369fe",name:"minus"})))),e("div",{key:"fef7fff7e8686614b24cf8e84f996f403f6a63cd",id:"bq-accordion__body",class:"bq-accordion__body overflow-hidden",part:"panel"},e("slot",{key:"bb5f2a3e57a1b7ec4a05711cb8f14d88b3eaf8e3"})))}get el(){return n(this)}static get watchers(){return{size:["checkPropValues"],expanded:["handleExpandedChange"],disabled:["handleDisabledChange"],noAnimation:["handleJsAnimation"]}}};q.style=s;export{q as bq_accordion};
6
+ //# sourceMappingURL=p-7a049750.entry.js.map
@@ -1 +1 @@
1
- {"version":3,"names":["ACCORDION_SIZE","ACCORDION_APPEARANCE","Accordion","constructor","el","this","animationOptions","duration","easing","header","querySelector","panel","animation","isClosing","isExpanding","open","style","height","offsetHeight","window","requestAnimationFrame","expand","close","startHeight","endHeight","cancel","animate","onfinish","onAnimationFinish","oncancel","removeAttribute","endEvent","Event","bubbles","composed","dispatchEvent","bqAccordionCss","BqAccordionStyle0","BqAccordion","handleClick","event","preventDefault","disabled","bqClick","emit","expanded","handleFocus","bqFocus","handleBlur","bqBlur","handlePrefixSlotChange","hasPrefix","hasSlotContent","prefixElem","handleSuffixSlotChange","hasSuffix","suffixElem","checkPropValues","validatePropValue","handleExpandedChange","bqOpen","bqClose","defaultPrevented","_a","accordion","_b","isCssCalcSizeSupported","setTimeout","CustomEvent","handleDisabledChange","handleJsAnimation","console","warn","noAnimation","detailsElem","componentWillLoad","componentDidLoad","onAccordionTransitionEnd","stopPropagation","target","bqAfterOpen","bqAfterClose","CSS","supports","render","h","key","class","size","appearance","ref","part","onClick","onFocus","onBlur","tabindex","element","name","onSlotchange","rotate","id"],"sources":["../../packages/beeq/src/components/accordion/bq-accordion.types.ts","../../packages/beeq/src/components/accordion/helper/index.ts","../../packages/beeq/src/components/accordion/scss/bq-accordion.scss?tag=bq-accordion&encapsulation=shadow","../../packages/beeq/src/components/accordion/bq-accordion.tsx"],"sourcesContent":["export const ACCORDION_SIZE = ['small', 'medium'] as const;\nexport type TAccordionSize = (typeof ACCORDION_SIZE)[number];\n\nexport const ACCORDION_APPEARANCE = ['filled', 'ghost'] as const;\nexport type TAccordionAppearance = (typeof ACCORDION_APPEARANCE)[number];\n","/* -------------------------------------------------------------------------------------- */\n/* 💡 Credits: https://css-tricks.com/how-to-animate-the-details-element-using-waapi */\n/* -------------------------------------------------------------------------------------- */\n\nexport class Accordion {\n private el: HTMLDetailsElement;\n private header: HTMLElement;\n private panel: HTMLElement;\n private animation: Animation | null;\n private isClosing: boolean;\n private isExpanding: boolean;\n private animationOptions = {\n duration: 200,\n easing: 'ease-in-out',\n };\n\n constructor(el: HTMLDetailsElement) {\n // Store the <details> element\n this.el = el;\n // Store the <summary> header element\n this.header = el.querySelector('summary');\n // Store the <div class=\"content\"> element\n this.panel = el.querySelector('.bq-accordion__body');\n // Store the animation object (so we can cancel it, if needed)\n this.animation = null;\n // Store if the element is closing\n this.isClosing = false;\n // Store if the element is expanding\n this.isExpanding = false;\n }\n\n public open() {\n // Check if the element is being closed or is already closed\n if (!this.isClosing && this.el.open) return;\n // Apply a fixed height on the element\n this.el.style.height = `${this.el.offsetHeight}px`;\n // Force the [open] attribute on the details element\n this.el.open = true;\n // Wait for the next frame to call the expand function\n window.requestAnimationFrame(() => this.expand());\n }\n\n public close() {\n // Check if the element is being opened or is already open\n if (!this.isExpanding && !this.el.open) return;\n // Set the element as \"being closed\"\n this.isClosing = true;\n\n // Store the current height of the element\n const startHeight = `${this.el.offsetHeight}px`;\n // Calculate the height of the <summary> header\n const endHeight = `${this.header.offsetHeight}px`;\n\n // If there is already an animation running\n if (this.animation) {\n // Cancel the current animation\n this.animation.cancel();\n }\n\n // Start a WAAPI animation\n this.animation = this.el.animate({ height: [startHeight, endHeight] }, this.animationOptions);\n // When the animation is complete, call onAnimationFinish()\n this.animation.onfinish = () => this.onAnimationFinish(false);\n // If the animation is cancelled, isClosing variable is set to false\n this.animation.oncancel = () => (this.isClosing = false);\n }\n\n // Expands the accordion\n private expand() {\n // Set the element as \"being expanding\"\n this.isExpanding = true;\n // Get the current fixed height of the element\n const startHeight = `${this.el.offsetHeight}px`;\n // Calculate the open height of the element (summary header height + panel body height)\n const endHeight = `${this.header.offsetHeight + this.panel.offsetHeight}px`;\n\n // If there is already an animation running\n if (this.animation) {\n // Cancel the current animation\n this.animation.cancel();\n }\n\n // Start a WAAPI animation\n this.animation = this.el.animate({ height: [startHeight, endHeight] }, this.animationOptions);\n // When the animation is complete, call onAnimationFinish()\n this.animation.onfinish = () => this.onAnimationFinish(true);\n // If the animation is cancelled, isExpanding variable is set to false\n this.animation.oncancel = () => (this.isExpanding = false);\n }\n\n // Handles the end of the animation\n private onAnimationFinish(open: boolean) {\n // Set the open attribute based on the parameter\n this.el.open = open;\n // Clear the stored animation\n this.animation = null;\n // Reset isClosing & isExpanding\n this.isClosing = false;\n this.isExpanding = false;\n // Remove the overflow hidden and the fixed height\n this.el.removeAttribute('style');\n // Dispatch a custom event based on the open parameter\n const endEvent = new Event('accordionTransitionEnd', { bubbles: false, composed: true });\n this.el.dispatchEvent(endEvent);\n }\n}\n","/* -------------------------------------------------------------------------- */\n/* Accordion styles */\n/* -------------------------------------------------------------------------- */\n\n@import './bq-accordion.variables';\n\n:host {\n @apply block;\n}\n\n.bq-accordion {\n &.disabled {\n @apply cursor-not-allowed opacity-60;\n\n .bq-accordion__header {\n @apply pointer-events-none;\n }\n }\n\n &.small .bq-accordion__header {\n @apply gap-[--bq-accordion--small-gap] pe-[--bq-accordion--small-padding-end] ps-[--bq-accordion--small-padding-start] p-b-[--bq-accordion--small-padding-y];\n @apply rounded-ee-[--bq-accordion--small-radius] rounded-es-[--bq-accordion--small-radius] rounded-se-[--bq-accordion--small-radius] rounded-ss-[--bq-accordion--small-radius];\n }\n\n &.medium .bq-accordion__header {\n @apply gap-[--bq-accordion--medium-gap] pe-[--bq-accordion--medium-padding-end] ps-[--bq-accordion--medium-padding-start] p-b-[--bq-accordion--medium-padding-y];\n @apply rounded-ee-[--bq-accordion--medium-radius] rounded-es-[--bq-accordion--medium-radius] rounded-se-[--bq-accordion--medium-radius] rounded-ss-[--bq-accordion--medium-radius];\n }\n\n &[open] .bq-accordion__header {\n @apply border-[length:--bq-accordion--expanded-border-width] border-[color:--bq-accordion--expanded-border-color];\n @apply rounded-ee-[0px] rounded-es-[0px];\n\n border-style: var(--bq-accordion--expanded-border-style);\n }\n\n &.small .bq-accordion__body {\n @apply rounded-ee-[--bq-accordion--small-radius] rounded-es-[--bq-accordion--small-radius] rounded-se-[0px] rounded-ss-[0px];\n }\n\n &.medium .bq-accordion__body {\n @apply rounded-ee-[--bq-accordion--medium-radius] rounded-es-[--bq-accordion--medium-radius] rounded-se-[0px] rounded-ss-[0px];\n }\n\n &.filled {\n .bq-accordion__header {\n @apply bg-[--bq-accordion--filled-collapsed-background] hover:bg-hover-ui-secondary;\n }\n\n .bq-accordion__header--text {\n @apply text-[--bq-accordion--filled-collapsed-text-color];\n }\n\n .bq-accordion__body {\n @apply border-[length:--bq-accordion--panel-filled-border-width] border-[color:--bq-accordion--panel-filled-border-color];\n\n border-style: var(--bq-accordion--panel-filled-border-style);\n }\n\n &[open] .bq-accordion__header {\n @apply bg-[--bq-accordion--filled-expanded-background] hover:bg-hover-ui-secondary;\n }\n\n &[open] .bq-accordion__header--text {\n @apply text-[--bq-accordion--filled-expanded-text-color];\n }\n }\n\n &.ghost {\n .bq-accordion__header {\n @apply bg-[--bq-accordion--ghost-collapsed-background] hover:bg-hover-ui-secondary;\n }\n\n .bq-accordion__header--text {\n @apply text-[--bq-accordion--ghost-collapsed-text-color];\n }\n\n .bq-accordion__body {\n @apply border-[length:--bq-accordion--panel-ghost-border-width] border-[color:--bq-accordion--panel-ghost-border-color];\n\n border-style: var(--bq-accordion--panel-ghost-border-style);\n }\n\n &[open] .bq-accordion__header {\n @apply bg-[--bq-accordion--ghost-expanded-background] hover:bg-hover-ui-secondary;\n }\n\n &[open] .bq-accordion__header--text {\n @apply text-[--bq-accordion--ghost-expanded-text-color];\n }\n }\n\n &.small.filled .bq-accordion__body {\n @apply pe-[--bq-accordion--panel-small-filled-padding-end] ps-[--bq-accordion--panel-small-filled-padding-start] p-b-[--bq-accordion--panel-small-filled-padding-y];\n }\n\n &.medium.filled .bq-accordion__body {\n @apply pe-[--bq-accordion--panel-medium-filled-padding-end] ps-[--bq-accordion--panel-medium-filled-padding-start] p-b-[--bq-accordion--panel-medium-filled-padding-y];\n }\n\n &.small.ghost .bq-accordion__body {\n @apply pe-[--bq-accordion--panel-small-ghost-padding-end] ps-[--bq-accordion--panel-small-ghost-padding-start] p-b-[--bq-accordion--panel-small-ghost-padding-y];\n }\n\n &.medium.ghost .bq-accordion__body {\n @apply pe-[--bq-accordion--panel-medium-ghost-padding-end] ps-[--bq-accordion--panel-medium-ghost-padding-start] p-b-[--bq-accordion--panel-medium-ghost-padding-y];\n }\n}\n\n/* stylelint-disable-next-line selector-pseudo-element-no-unknown */\n.bq-accordion::details-content {\n @apply block overflow-hidden transition-[block-size,content-visibility] duration-300 ease-in-out bs-0 [transition-behavior:allow-discrete];\n}\n\n/* stylelint-disable-next-line selector-pseudo-element-no-unknown */\n.bq-accordion[open]::details-content {\n /* block-size: auto is just a fallback for browsers that don't support the calc-size() function */\n @apply bs-auto;\n}\n\n/* stylelint-disable-next-line selector-pseudo-element-no-unknown */\n.bq-accordion[open]:not(.no-animation)::details-content {\n @apply supports-[block-size:calc-size(auto)]:bs-[calc-size(auto)];\n}\n\n.bq-accordion__header {\n // Since there's an overflow on the <summary> element, the focus outline is not visible,\n // so we force it to be inset to avoid the overflow hidden.\n --bq-ring-offset-width: -2px;\n\n @apply flex cursor-pointer select-none list-none items-center transition-colors duration-300 ease-in-out focus-visible:focus;\n @apply border-[length:--bq-accordion--collapsed-border-width] border-[color:--bq-accordion--collapsed-border-color];\n\n border-style: var(--bq-accordion--collapsed-border-style);\n\n &::marker,\n &::-webkit-details-marker {\n @apply hidden;\n }\n}\n\n.bq-accordion__header--text {\n @apply flex-1;\n}\n\n.bq-accordion__header--prefix,\n.bq-accordion__header--suffix {\n @apply flex items-center justify-center;\n}\n","import { Component, Element, Event, EventEmitter, h, Listen, Prop, State, Watch } from '@stencil/core';\n\nimport { ACCORDION_APPEARANCE, ACCORDION_SIZE, TAccordionAppearance, TAccordionSize } from './bq-accordion.types';\nimport { Accordion } from './helper';\nimport { hasSlotContent, validatePropValue } from '../../shared/utils';\n\n/**\n * @part base - The `<details>` that holds the accordion content\n * @part header - The `<summary>` that holds the accordion header content\n * @part prefix - The `<div>` that holds the accordion text prefix icon / avatar\n * @part text - The `<div>` that holds the accordion header text\n * @part suffix - The `<div>` that holds the accordion text suffix icon\n * @part panel - The `<div>` that holds the accordion panel content\n */\n@Component({\n tag: 'bq-accordion',\n styleUrl: './scss/bq-accordion.scss',\n shadow: true,\n})\nexport class BqAccordion {\n // Own Properties\n // ====================\n\n private accordion: Accordion;\n private prefixElem: HTMLDivElement;\n private suffixElem: HTMLDivElement;\n private detailsElem: HTMLDetailsElement;\n\n // Reference to host HTML element\n // ===================================\n\n @Element() el!: HTMLBqAccordionElement;\n\n // State() variables\n // Inlined decorator, alphabetical order\n // =======================================\n\n @State() private hasPrefix = false;\n @State() private hasSuffix = false;\n\n // Public Property API\n // ========================\n\n /** The appearance style of accordion */\n @Prop({ reflect: true, mutable: true }) appearance: TAccordionAppearance = 'filled';\n\n /** If true accordion is disabled */\n @Prop({ reflect: true }) disabled: boolean = false;\n\n /** If true accordion is expanded */\n @Prop({ reflect: true, mutable: true }) expanded: boolean = false;\n\n /**\n * Animation is set through JS when the browser does not support CSS calc-size()\n * If true, the accordion animation, will be disabled. No animation will be applied.\n */\n @Prop({ reflect: true }) noAnimation: boolean = false;\n\n /** If true accordion expand icon is rotate 180deg when expanded */\n @Prop({ reflect: true }) rotate: boolean = false;\n\n /** The size of accordion */\n @Prop({ reflect: true, mutable: true }) size: TAccordionSize = 'medium';\n\n // Prop lifecycle events\n // =======================\n\n @Watch('size')\n checkPropValues() {\n validatePropValue(ACCORDION_SIZE, 'medium', this.el, 'size');\n validatePropValue(ACCORDION_APPEARANCE, 'filled', this.el, 'appearance');\n }\n\n @Watch('expanded')\n handleExpandedChange() {\n const event = this.expanded ? this.bqOpen.emit(this.el) : this.bqClose.emit(this.el);\n if (event.defaultPrevented) {\n this.expanded = !this.expanded;\n return;\n }\n\n this.expanded ? this.accordion?.open() : this.accordion?.close();\n if (!this.isCssCalcSizeSupported) return;\n\n // NOTE: This is a workaround to trigger the transitionEnd event\n // when the open/close animation is handled via CSS instead of JS\n setTimeout(() => {\n this.el.dispatchEvent(new CustomEvent('accordionTransitionEnd', { bubbles: false, composed: true }));\n }, 200);\n }\n\n @Watch('disabled')\n handleDisabledChange() {\n if (!this.disabled) return;\n\n this.expanded = false;\n }\n\n @Watch('noAnimation')\n handleJsAnimation() {\n if (this.isCssCalcSizeSupported) return;\n\n console.warn(\n `[bq-accordion] calc-size() is not supported and animation will be set through JS\n For vertical layout, consider using the 'noAnimation' prop ('no-animation' attribute) to disable it`,\n );\n this.accordion = !this.noAnimation ? new Accordion(this.detailsElem) : null;\n }\n\n // Events section\n // Requires JSDocs for public API documentation\n // ==============================================\n\n /** Handler to be called when the accordion loses focus */\n @Event() bqBlur: EventEmitter<HTMLBqAccordionElement>;\n\n /** Handler to be called when the accordion gets focus */\n @Event() bqFocus: EventEmitter<HTMLBqAccordionElement>;\n\n /** Handler to be called when the accordion is opened */\n @Event() bqOpen: EventEmitter<HTMLBqAccordionElement>;\n\n /** Handler to be called after the accordion is opened */\n @Event() bqAfterOpen: EventEmitter<HTMLBqAccordionElement>;\n\n /** Handler to be called when the accordion is closed */\n @Event() bqClose: EventEmitter<HTMLBqAccordionElement>;\n\n /** Handler to be called after the accordion is closed */\n @Event() bqAfterClose: EventEmitter<HTMLBqAccordionElement>;\n\n /** @internal Handler to be called when the accordion is clicked */\n @Event() bqClick: EventEmitter<HTMLBqAccordionElement>;\n\n // Component lifecycle events\n // Ordered by their natural call order\n // =====================================\n\n componentWillLoad() {\n this.checkPropValues();\n }\n\n componentDidLoad() {\n this.handleJsAnimation();\n this.handleExpandedChange();\n }\n\n // Listeners\n // ==============\n\n @Listen('accordionTransitionEnd')\n onAccordionTransitionEnd(event: CustomEvent) {\n event.stopPropagation();\n if (event.target !== this.el) return;\n\n this.expanded ? this.bqAfterOpen.emit(this.el) : this.bqAfterClose.emit(this.el);\n }\n\n // Public methods API\n // These methods are exposed on the host element.\n // Always use two lines.\n // Public Methods must be async.\n // Requires JSDocs for public API documentation.\n // ===============================================\n\n // Local methods\n // Internal business logic.\n // These methods cannot be called from the host element.\n // =======================================================\n\n private handleClick = (event: MouseEvent) => {\n event.preventDefault();\n\n if (this.disabled) return;\n\n this.bqClick.emit(this.el);\n this.expanded = !this.expanded;\n };\n\n private handleFocus = () => {\n if (this.disabled) return;\n\n this.bqFocus.emit(this.el);\n };\n\n private handleBlur = () => {\n this.bqBlur.emit(this.el);\n };\n\n private handlePrefixSlotChange = () => {\n this.hasPrefix = hasSlotContent(this.prefixElem, 'prefix');\n };\n\n private handleSuffixSlotChange = () => {\n this.hasSuffix = hasSlotContent(this.suffixElem, 'suffix');\n };\n\n private get open() {\n return this.expanded && !this.disabled;\n }\n\n private get isCssCalcSizeSupported() {\n return window.CSS?.supports('(block-size: calc-size(auto))');\n }\n\n // render() function\n // Always the last one in the class.\n // ===================================\n\n render() {\n return (\n <details\n class={{\n [`bq-accordion overflow-hidden ${this.size} ${this.appearance}`]: true,\n 'no-animation': this.noAnimation,\n disabled: this.disabled,\n }}\n ref={(detailsElem: HTMLDetailsElement) => (this.detailsElem = detailsElem)}\n open={this.open}\n part=\"base\"\n >\n <summary\n class=\"bq-accordion__header\"\n onClick={this.handleClick}\n onFocus={this.handleFocus}\n onBlur={this.handleBlur}\n aria-expanded={this.expanded}\n aria-disabled={this.disabled}\n aria-controls=\"bq-accordion__body\"\n tabindex={this.disabled ? -1 : 0}\n part=\"header\"\n >\n <div\n ref={(element) => (this.prefixElem = element)}\n class={{ 'bq-accordion__header--prefix': true, '!hidden': !this.hasPrefix }}\n part=\"prefix\"\n >\n <slot name=\"prefix\" onSlotchange={this.handlePrefixSlotChange} />\n </div>\n <div class=\"bq-accordion__header--text\" part=\"text\">\n <slot name=\"header\" />\n </div>\n <div\n ref={(element) => (this.suffixElem = element)}\n class={{ 'bq-accordion__header--suffix': true, '!hidden': !this.hasSuffix }}\n part=\"suffix\"\n >\n <slot name=\"suffix\" onSlotchange={this.handleSuffixSlotChange} />\n </div>\n <div\n class={{\n 'flex items-center justify-center transition-transform duration-300 ease-in-out': true,\n '!hidden': this.open && !this.rotate,\n 'rotate-180': this.rotate && this.open,\n }}\n >\n <slot name=\"expand\">\n <bq-icon name=\"plus\" />\n </slot>\n </div>\n <div\n class={{ 'flex items-center justify-center': true, '!hidden': (!this.open && !this.rotate) || this.rotate }}\n >\n <slot name=\"collapse\">\n <bq-icon name=\"minus\" />\n </slot>\n </div>\n </summary>\n <div id=\"bq-accordion__body\" class=\"bq-accordion__body overflow-hidden\" part=\"panel\">\n <slot />\n </div>\n </details>\n );\n }\n}\n"],"mappings":"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","ignoreList":[]}
1
+ {"version":3,"names":["ACCORDION_SIZE","ACCORDION_APPEARANCE","Accordion","constructor","el","this","animationOptions","duration","easing","header","querySelector","panel","animation","isClosing","isExpanding","open","style","height","offsetHeight","window","requestAnimationFrame","expand","close","startHeight","endHeight","cancel","animate","onfinish","onAnimationFinish","oncancel","removeAttribute","endEvent","Event","bubbles","composed","dispatchEvent","bqAccordionCss","BqAccordionStyle0","BqAccordion","handleClick","event","preventDefault","disabled","bqClick","emit","expanded","handleFocus","bqFocus","handleBlur","bqBlur","handlePrefixSlotChange","hasPrefix","hasSlotContent","prefixElem","handleSuffixSlotChange","hasSuffix","suffixElem","checkPropValues","validatePropValue","handleExpandedChange","bqOpen","bqClose","defaultPrevented","_a","accordion","_b","isCssCalcSizeSupported","setTimeout","CustomEvent","handleDisabledChange","handleJsAnimation","console","warn","noAnimation","detailsElem","componentWillLoad","componentDidLoad","onAccordionTransitionEnd","stopPropagation","target","bqAfterOpen","bqAfterClose","CSS","supports","render","h","key","class","size","appearance","ref","part","onClick","onFocus","onBlur","tabindex","element","name","onSlotchange","rotate","id"],"sources":["../../packages/beeq/src/components/accordion/bq-accordion.types.ts","../../packages/beeq/src/components/accordion/helper/index.ts","../../packages/beeq/src/components/accordion/scss/bq-accordion.scss?tag=bq-accordion&encapsulation=shadow","../../packages/beeq/src/components/accordion/bq-accordion.tsx"],"sourcesContent":["export const ACCORDION_SIZE = ['small', 'medium'] as const;\nexport type TAccordionSize = (typeof ACCORDION_SIZE)[number];\n\nexport const ACCORDION_APPEARANCE = ['filled', 'ghost'] as const;\nexport type TAccordionAppearance = (typeof ACCORDION_APPEARANCE)[number];\n","/* -------------------------------------------------------------------------------------- */\n/* 💡 Credits: https://css-tricks.com/how-to-animate-the-details-element-using-waapi */\n/* -------------------------------------------------------------------------------------- */\n\nexport class Accordion {\n private el: HTMLDetailsElement;\n private header: HTMLElement;\n private panel: HTMLElement;\n private animation: Animation | null;\n private isClosing: boolean;\n private isExpanding: boolean;\n private animationOptions = {\n duration: 200,\n easing: 'ease-in-out',\n };\n\n constructor(el: HTMLDetailsElement) {\n // Store the <details> element\n this.el = el;\n // Store the <summary> header element\n this.header = el.querySelector('summary');\n // Store the <div class=\"content\"> element\n this.panel = el.querySelector('.bq-accordion__body');\n // Store the animation object (so we can cancel it, if needed)\n this.animation = null;\n // Store if the element is closing\n this.isClosing = false;\n // Store if the element is expanding\n this.isExpanding = false;\n }\n\n public open() {\n // Check if the element is being closed or is already closed\n if (!this.isClosing && this.el.open) return;\n // Apply a fixed height on the element\n this.el.style.height = `${this.el.offsetHeight}px`;\n // Force the [open] attribute on the details element\n this.el.open = true;\n // Wait for the next frame to call the expand function\n window.requestAnimationFrame(() => this.expand());\n }\n\n public close() {\n // Check if the element is being opened or is already open\n if (!this.isExpanding && !this.el.open) return;\n // Set the element as \"being closed\"\n this.isClosing = true;\n\n // Store the current height of the element\n const startHeight = `${this.el.offsetHeight}px`;\n // Calculate the height of the <summary> header\n const endHeight = `${this.header.offsetHeight}px`;\n\n // If there is already an animation running\n if (this.animation) {\n // Cancel the current animation\n this.animation.cancel();\n }\n\n // Start a WAAPI animation\n this.animation = this.el.animate({ height: [startHeight, endHeight] }, this.animationOptions);\n // When the animation is complete, call onAnimationFinish()\n this.animation.onfinish = () => this.onAnimationFinish(false);\n // If the animation is cancelled, isClosing variable is set to false\n this.animation.oncancel = () => (this.isClosing = false);\n }\n\n // Expands the accordion\n private expand() {\n // Set the element as \"being expanding\"\n this.isExpanding = true;\n // Get the current fixed height of the element\n const startHeight = `${this.el.offsetHeight}px`;\n // Calculate the open height of the element (summary header height + panel body height)\n const endHeight = `${this.header.offsetHeight + this.panel.offsetHeight}px`;\n\n // If there is already an animation running\n if (this.animation) {\n // Cancel the current animation\n this.animation.cancel();\n }\n\n // Start a WAAPI animation\n this.animation = this.el.animate({ height: [startHeight, endHeight] }, this.animationOptions);\n // When the animation is complete, call onAnimationFinish()\n this.animation.onfinish = () => this.onAnimationFinish(true);\n // If the animation is cancelled, isExpanding variable is set to false\n this.animation.oncancel = () => (this.isExpanding = false);\n }\n\n // Handles the end of the animation\n private onAnimationFinish(open: boolean) {\n // Set the open attribute based on the parameter\n this.el.open = open;\n // Clear the stored animation\n this.animation = null;\n // Reset isClosing & isExpanding\n this.isClosing = false;\n this.isExpanding = false;\n // Remove the overflow hidden and the fixed height\n this.el.removeAttribute('style');\n // Dispatch a custom event based on the open parameter\n const endEvent = new Event('accordionTransitionEnd', { bubbles: false, composed: true });\n this.el.dispatchEvent(endEvent);\n }\n}\n","/* -------------------------------------------------------------------------- */\n/* Accordion styles */\n/* -------------------------------------------------------------------------- */\n\n@import './bq-accordion.variables';\n\n:host {\n @apply block;\n}\n\n.bq-accordion {\n &.disabled {\n @apply cursor-not-allowed opacity-60;\n\n .bq-accordion__header {\n @apply pointer-events-none;\n }\n }\n\n &.small .bq-accordion__header {\n @apply gap-[--bq-accordion--small-gap] pe-[--bq-accordion--small-padding-end] ps-[--bq-accordion--small-padding-start] p-b-[--bq-accordion--small-padding-y];\n @apply rounded-ee-[--bq-accordion--small-radius] rounded-es-[--bq-accordion--small-radius] rounded-se-[--bq-accordion--small-radius] rounded-ss-[--bq-accordion--small-radius];\n }\n\n &.medium .bq-accordion__header {\n @apply gap-[--bq-accordion--medium-gap] pe-[--bq-accordion--medium-padding-end] ps-[--bq-accordion--medium-padding-start] p-b-[--bq-accordion--medium-padding-y];\n @apply rounded-ee-[--bq-accordion--medium-radius] rounded-es-[--bq-accordion--medium-radius] rounded-se-[--bq-accordion--medium-radius] rounded-ss-[--bq-accordion--medium-radius];\n }\n\n &[open] .bq-accordion__header {\n @apply border-[length:--bq-accordion--expanded-border-width] border-[color:--bq-accordion--expanded-border-color];\n @apply rounded-ee-[0px] rounded-es-[0px];\n\n border-style: var(--bq-accordion--expanded-border-style);\n }\n\n &.small .bq-accordion__body {\n @apply rounded-ee-[--bq-accordion--small-radius] rounded-es-[--bq-accordion--small-radius] rounded-se-[0px] rounded-ss-[0px];\n }\n\n &.medium .bq-accordion__body {\n @apply rounded-ee-[--bq-accordion--medium-radius] rounded-es-[--bq-accordion--medium-radius] rounded-se-[0px] rounded-ss-[0px];\n }\n\n &.filled {\n .bq-accordion__header {\n @apply bg-[--bq-accordion--filled-collapsed-background] hover:bg-hover-ui-secondary;\n }\n\n .bq-accordion__header--text {\n @apply text-[--bq-accordion--filled-collapsed-text-color];\n }\n\n .bq-accordion__body {\n @apply border-[length:--bq-accordion--panel-filled-border-width] border-[color:--bq-accordion--panel-filled-border-color];\n\n border-style: var(--bq-accordion--panel-filled-border-style);\n }\n\n &[open] .bq-accordion__header {\n @apply bg-[--bq-accordion--filled-expanded-background] hover:bg-hover-ui-secondary;\n }\n\n &[open] .bq-accordion__header--text {\n @apply text-[--bq-accordion--filled-expanded-text-color];\n }\n }\n\n &.ghost {\n .bq-accordion__header {\n @apply bg-[--bq-accordion--ghost-collapsed-background] hover:bg-hover-ui-secondary;\n }\n\n .bq-accordion__header--text {\n @apply text-[--bq-accordion--ghost-collapsed-text-color];\n }\n\n .bq-accordion__body {\n @apply border-[length:--bq-accordion--panel-ghost-border-width] border-[color:--bq-accordion--panel-ghost-border-color];\n\n border-style: var(--bq-accordion--panel-ghost-border-style);\n }\n\n &[open] .bq-accordion__header {\n @apply bg-[--bq-accordion--ghost-expanded-background] hover:bg-hover-ui-secondary;\n }\n\n &[open] .bq-accordion__header--text {\n @apply text-[--bq-accordion--ghost-expanded-text-color];\n }\n }\n\n &.small.filled .bq-accordion__body {\n @apply pe-[--bq-accordion--panel-small-filled-padding-end] ps-[--bq-accordion--panel-small-filled-padding-start] p-b-[--bq-accordion--panel-small-filled-padding-y];\n }\n\n &.medium.filled .bq-accordion__body {\n @apply pe-[--bq-accordion--panel-medium-filled-padding-end] ps-[--bq-accordion--panel-medium-filled-padding-start] p-b-[--bq-accordion--panel-medium-filled-padding-y];\n }\n\n &.small.ghost .bq-accordion__body {\n @apply pe-[--bq-accordion--panel-small-ghost-padding-end] ps-[--bq-accordion--panel-small-ghost-padding-start] p-b-[--bq-accordion--panel-small-ghost-padding-y];\n }\n\n &.medium.ghost .bq-accordion__body {\n @apply pe-[--bq-accordion--panel-medium-ghost-padding-end] ps-[--bq-accordion--panel-medium-ghost-padding-start] p-b-[--bq-accordion--panel-medium-ghost-padding-y];\n }\n}\n\n/* stylelint-disable-next-line selector-pseudo-element-no-unknown */\n.bq-accordion::details-content {\n @apply block overflow-hidden transition-[block-size,content-visibility] duration-300 ease-in-out bs-0 [transition-behavior:allow-discrete];\n}\n\n/* stylelint-disable-next-line selector-pseudo-element-no-unknown */\n.bq-accordion[open]::details-content {\n /* block-size: auto is just a fallback for browsers that don't support the calc-size() function */\n @apply bs-auto;\n}\n\n/* stylelint-disable-next-line selector-pseudo-element-no-unknown */\n.bq-accordion[open]:not(.no-animation)::details-content {\n @apply supports-[block-size:calc-size(auto)]:bs-[calc-size(auto)];\n}\n\n.bq-accordion__header {\n // Since there's an overflow on the <summary> element, the focus outline is not visible,\n // so we force it to be inset to avoid the overflow hidden.\n --bq-ring-offset-width: -2px;\n\n @apply flex cursor-pointer select-none list-none items-center transition-colors duration-300 ease-in-out focus-visible:focus;\n @apply border-[length:--bq-accordion--collapsed-border-width] border-[color:--bq-accordion--collapsed-border-color];\n\n border-style: var(--bq-accordion--collapsed-border-style);\n\n &::marker,\n &::-webkit-details-marker {\n @apply hidden;\n }\n}\n\n.bq-accordion__header--text {\n @apply flex-1;\n}\n\n.bq-accordion__header--prefix,\n.bq-accordion__header--suffix {\n @apply flex items-center justify-center;\n}\n","import { Component, Element, Event, EventEmitter, h, Listen, Prop, State, Watch } from '@stencil/core';\n\nimport { ACCORDION_APPEARANCE, ACCORDION_SIZE, TAccordionAppearance, TAccordionSize } from './bq-accordion.types';\nimport { Accordion } from './helper';\nimport { hasSlotContent, validatePropValue } from '../../shared/utils';\n\n/**\n * @part base - The `<details>` that holds the accordion content\n * @part header - The `<summary>` that holds the accordion header content\n * @part prefix - The `<div>` that holds the accordion text prefix icon / avatar\n * @part text - The `<div>` that holds the accordion header text\n * @part suffix - The `<div>` that holds the accordion text suffix icon\n * @part panel - The `<div>` that holds the accordion panel content\n */\n@Component({\n tag: 'bq-accordion',\n styleUrl: './scss/bq-accordion.scss',\n shadow: true,\n})\nexport class BqAccordion {\n // Own Properties\n // ====================\n\n private accordion: Accordion;\n private prefixElem: HTMLDivElement;\n private suffixElem: HTMLDivElement;\n private detailsElem: HTMLDetailsElement;\n\n // Reference to host HTML element\n // ===================================\n\n @Element() el!: HTMLBqAccordionElement;\n\n // State() variables\n // Inlined decorator, alphabetical order\n // =======================================\n\n @State() private hasPrefix = false;\n @State() private hasSuffix = false;\n\n // Public Property API\n // ========================\n\n /** The appearance style of accordion */\n @Prop({ reflect: true, mutable: true }) appearance: TAccordionAppearance = 'filled';\n\n /** If true accordion is disabled */\n @Prop({ reflect: true }) disabled: boolean = false;\n\n /** If true accordion is expanded */\n @Prop({ reflect: true, mutable: true }) expanded: boolean = false;\n\n /**\n * Animation is set through JS when the browser does not support CSS calc-size()\n * If true, the accordion animation, will be disabled. No animation will be applied.\n */\n @Prop({ reflect: true }) noAnimation: boolean = false;\n\n /** If true accordion expand icon is rotate 180deg when expanded */\n @Prop({ reflect: true }) rotate: boolean = false;\n\n /** The size of accordion */\n @Prop({ reflect: true, mutable: true }) size: TAccordionSize = 'medium';\n\n // Prop lifecycle events\n // =======================\n\n @Watch('size')\n checkPropValues() {\n validatePropValue(ACCORDION_SIZE, 'medium', this.el, 'size');\n validatePropValue(ACCORDION_APPEARANCE, 'filled', this.el, 'appearance');\n }\n\n @Watch('expanded')\n handleExpandedChange() {\n const event = this.expanded ? this.bqOpen.emit(this.el) : this.bqClose.emit(this.el);\n if (event.defaultPrevented) {\n this.expanded = !this.expanded;\n return;\n }\n\n this.expanded ? this.accordion?.open() : this.accordion?.close();\n if (!this.isCssCalcSizeSupported) return;\n\n // NOTE: This is a workaround to trigger the transitionEnd event\n // when the open/close animation is handled via CSS instead of JS\n setTimeout(() => {\n this.el.dispatchEvent(new CustomEvent('accordionTransitionEnd', { bubbles: false, composed: true }));\n }, 200);\n }\n\n @Watch('disabled')\n handleDisabledChange() {\n if (!this.disabled) return;\n\n this.expanded = false;\n }\n\n @Watch('noAnimation')\n handleJsAnimation() {\n if (this.isCssCalcSizeSupported) return;\n\n console.warn(\n `[bq-accordion] calc-size() is not supported and animation will be set through JS\n For vertical layout, consider using the 'noAnimation' prop ('no-animation' attribute) to disable it`,\n );\n this.accordion = !this.noAnimation ? new Accordion(this.detailsElem) : null;\n }\n\n // Events section\n // Requires JSDocs for public API documentation\n // ==============================================\n\n /** Handler to be called when the accordion loses focus */\n @Event() bqBlur: EventEmitter<HTMLBqAccordionElement>;\n\n /** Handler to be called when the accordion gets focus */\n @Event() bqFocus: EventEmitter<HTMLBqAccordionElement>;\n\n /** Handler to be called when the accordion is opened */\n @Event() bqOpen: EventEmitter<HTMLBqAccordionElement>;\n\n /** Handler to be called after the accordion is opened */\n @Event() bqAfterOpen: EventEmitter<HTMLBqAccordionElement>;\n\n /** Handler to be called when the accordion is closed */\n @Event() bqClose: EventEmitter<HTMLBqAccordionElement>;\n\n /** Handler to be called after the accordion is closed */\n @Event() bqAfterClose: EventEmitter<HTMLBqAccordionElement>;\n\n /** @internal Handler to be called when the accordion is clicked */\n @Event() bqClick: EventEmitter<HTMLBqAccordionElement>;\n\n // Component lifecycle events\n // Ordered by their natural call order\n // =====================================\n\n componentWillLoad() {\n this.checkPropValues();\n }\n\n componentDidLoad() {\n this.handleJsAnimation();\n this.handleExpandedChange();\n }\n\n // Listeners\n // ==============\n\n @Listen('accordionTransitionEnd')\n onAccordionTransitionEnd(event: CustomEvent) {\n event.stopPropagation();\n if (event.target !== this.el) return;\n\n this.expanded ? this.bqAfterOpen.emit(this.el) : this.bqAfterClose.emit(this.el);\n }\n\n // Public methods API\n // These methods are exposed on the host element.\n // Always use two lines.\n // Public Methods must be async.\n // Requires JSDocs for public API documentation.\n // ===============================================\n\n // Local methods\n // Internal business logic.\n // These methods cannot be called from the host element.\n // =======================================================\n\n private handleClick = (event: MouseEvent) => {\n event.preventDefault();\n\n if (this.disabled) return;\n\n this.bqClick.emit(this.el);\n this.expanded = !this.expanded;\n };\n\n private handleFocus = () => {\n if (this.disabled) return;\n\n this.bqFocus.emit(this.el);\n };\n\n private handleBlur = () => {\n this.bqBlur.emit(this.el);\n };\n\n private handlePrefixSlotChange = () => {\n this.hasPrefix = hasSlotContent(this.prefixElem, 'prefix');\n };\n\n private handleSuffixSlotChange = () => {\n this.hasSuffix = hasSlotContent(this.suffixElem, 'suffix');\n };\n\n private get open() {\n return this.expanded && !this.disabled;\n }\n\n private get isCssCalcSizeSupported() {\n return window.CSS?.supports('(block-size: calc-size(auto))');\n }\n\n // render() function\n // Always the last one in the class.\n // ===================================\n\n render() {\n return (\n <details\n class={{\n [`bq-accordion overflow-hidden ${this.size} ${this.appearance}`]: true,\n 'no-animation': this.noAnimation,\n disabled: this.disabled,\n }}\n ref={(detailsElem: HTMLDetailsElement) => (this.detailsElem = detailsElem)}\n open={this.open}\n part=\"base\"\n >\n <summary\n class=\"bq-accordion__header\"\n onClick={this.handleClick}\n onFocus={this.handleFocus}\n onBlur={this.handleBlur}\n aria-expanded={this.expanded}\n aria-disabled={this.disabled}\n aria-controls=\"bq-accordion__body\"\n tabindex={this.disabled ? -1 : 0}\n part=\"header\"\n >\n <div\n ref={(element) => (this.prefixElem = element)}\n class={{ 'bq-accordion__header--prefix': true, '!hidden': !this.hasPrefix }}\n part=\"prefix\"\n >\n <slot name=\"prefix\" onSlotchange={this.handlePrefixSlotChange} />\n </div>\n <div class=\"bq-accordion__header--text\" part=\"text\">\n <slot name=\"header\" />\n </div>\n <div\n ref={(element) => (this.suffixElem = element)}\n class={{ 'bq-accordion__header--suffix': true, '!hidden': !this.hasSuffix }}\n part=\"suffix\"\n >\n <slot name=\"suffix\" onSlotchange={this.handleSuffixSlotChange} />\n </div>\n <div\n class={{\n 'flex items-center justify-center transition-transform duration-300 ease-in-out': true,\n '!hidden': this.open && !this.rotate,\n 'rotate-180': this.rotate && this.open,\n }}\n >\n <slot name=\"expand\">\n <bq-icon name=\"plus\" />\n </slot>\n </div>\n <div\n class={{ 'flex items-center justify-center': true, '!hidden': (!this.open && !this.rotate) || this.rotate }}\n >\n <slot name=\"collapse\">\n <bq-icon name=\"minus\" />\n </slot>\n </div>\n </summary>\n <div id=\"bq-accordion__body\" class=\"bq-accordion__body overflow-hidden\" part=\"panel\">\n <slot />\n </div>\n </details>\n );\n }\n}\n"],"mappings":";;;;oJAAO,MAAMA,EAAiB,CAAC,QAAS,UAGjC,MAAMC,EAAuB,CAAC,SAAU,S,MCClCC,EAYX,WAAAC,CAAYC,GALJC,KAAAC,iBAAmB,CACzBC,SAAU,IACVC,OAAQ,eAKRH,KAAKD,GAAKA,EAEVC,KAAKI,OAASL,EAAGM,cAAc,WAE/BL,KAAKM,MAAQP,EAAGM,cAAc,uBAE9BL,KAAKO,UAAY,KAEjBP,KAAKQ,UAAY,MAEjBR,KAAKS,YAAc,K,CAGd,IAAAC,GAEL,IAAKV,KAAKQ,WAAaR,KAAKD,GAAGW,KAAM,OAErCV,KAAKD,GAAGY,MAAMC,OAAS,GAAGZ,KAAKD,GAAGc,iBAElCb,KAAKD,GAAGW,KAAO,KAEfI,OAAOC,uBAAsB,IAAMf,KAAKgB,U,CAGnC,KAAAC,GAEL,IAAKjB,KAAKS,cAAgBT,KAAKD,GAAGW,KAAM,OAExCV,KAAKQ,UAAY,KAGjB,MAAMU,EAAc,GAAGlB,KAAKD,GAAGc,iBAE/B,MAAMM,EAAY,GAAGnB,KAAKI,OAAOS,iBAGjC,GAAIb,KAAKO,UAAW,CAElBP,KAAKO,UAAUa,Q,CAIjBpB,KAAKO,UAAYP,KAAKD,GAAGsB,QAAQ,CAAET,OAAQ,CAACM,EAAaC,IAAcnB,KAAKC,kBAE5ED,KAAKO,UAAUe,SAAW,IAAMtB,KAAKuB,kBAAkB,OAEvDvB,KAAKO,UAAUiB,SAAW,IAAOxB,KAAKQ,UAAY,K,CAI5C,MAAAQ,GAENhB,KAAKS,YAAc,KAEnB,MAAMS,EAAc,GAAGlB,KAAKD,GAAGc,iBAE/B,MAAMM,EAAY,GAAGnB,KAAKI,OAAOS,aAAeb,KAAKM,MAAMO,iBAG3D,GAAIb,KAAKO,UAAW,CAElBP,KAAKO,UAAUa,Q,CAIjBpB,KAAKO,UAAYP,KAAKD,GAAGsB,QAAQ,CAAET,OAAQ,CAACM,EAAaC,IAAcnB,KAAKC,kBAE5ED,KAAKO,UAAUe,SAAW,IAAMtB,KAAKuB,kBAAkB,MAEvDvB,KAAKO,UAAUiB,SAAW,IAAOxB,KAAKS,YAAc,K,CAI9C,iBAAAc,CAAkBb,GAExBV,KAAKD,GAAGW,KAAOA,EAEfV,KAAKO,UAAY,KAEjBP,KAAKQ,UAAY,MACjBR,KAAKS,YAAc,MAEnBT,KAAKD,GAAG0B,gBAAgB,SAExB,MAAMC,EAAW,IAAIC,MAAM,yBAA0B,CAAEC,QAAS,MAAOC,SAAU,OACjF7B,KAAKD,GAAG+B,cAAcJ,E,ECvG1B,MAAMK,EAAiB,49jCACvB,MAAAC,EAAeD,E,MCkBFE,EAAW,M,8QAuJdjC,KAAAkC,YAAeC,IACrBA,EAAMC,iBAEN,GAAIpC,KAAKqC,SAAU,OAEnBrC,KAAKsC,QAAQC,KAAKvC,KAAKD,IACvBC,KAAKwC,UAAYxC,KAAKwC,QAAQ,EAGxBxC,KAAAyC,YAAc,KACpB,GAAIzC,KAAKqC,SAAU,OAEnBrC,KAAK0C,QAAQH,KAAKvC,KAAKD,GAAG,EAGpBC,KAAA2C,WAAa,KACnB3C,KAAK4C,OAAOL,KAAKvC,KAAKD,GAAG,EAGnBC,KAAA6C,uBAAyB,KAC/B7C,KAAK8C,UAAYC,EAAe/C,KAAKgD,WAAY,SAAS,EAGpDhD,KAAAiD,uBAAyB,KAC/BjD,KAAKkD,UAAYH,EAAe/C,KAAKmD,WAAY,SAAS,E,eA7J/B,M,eACA,M,gBAM8C,S,cAG9B,M,cAGe,M,iBAMZ,M,YAGL,M,UAGoB,Q,CAM/D,eAAAC,GACEC,EAAkB1D,EAAgB,SAAUK,KAAKD,GAAI,QACrDsD,EAAkBzD,EAAsB,SAAUI,KAAKD,GAAI,a,CAI7D,oBAAAuD,G,QACE,MAAMnB,EAAQnC,KAAKwC,SAAWxC,KAAKuD,OAAOhB,KAAKvC,KAAKD,IAAMC,KAAKwD,QAAQjB,KAAKvC,KAAKD,IACjF,GAAIoC,EAAMsB,iBAAkB,CAC1BzD,KAAKwC,UAAYxC,KAAKwC,SACtB,M,CAGFxC,KAAKwC,UAAWkB,EAAA1D,KAAK2D,aAAS,MAAAD,SAAA,SAAAA,EAAEhD,QAASkD,EAAA5D,KAAK2D,aAAS,MAAAC,SAAA,SAAAA,EAAE3C,QACzD,IAAKjB,KAAK6D,uBAAwB,OAIlCC,YAAW,KACT9D,KAAKD,GAAG+B,cAAc,IAAIiC,YAAY,yBAA0B,CAAEnC,QAAS,MAAOC,SAAU,OAAQ,GACnG,I,CAIL,oBAAAmC,GACE,IAAKhE,KAAKqC,SAAU,OAEpBrC,KAAKwC,SAAW,K,CAIlB,iBAAAyB,GACE,GAAIjE,KAAK6D,uBAAwB,OAEjCK,QAAQC,KACN,iMAGFnE,KAAK2D,WAAa3D,KAAKoE,YAAc,IAAIvE,EAAUG,KAAKqE,aAAe,I,CAgCzE,iBAAAC,GACEtE,KAAKoD,iB,CAGP,gBAAAmB,GACEvE,KAAKiE,oBACLjE,KAAKsD,sB,CAOP,wBAAAkB,CAAyBrC,GACvBA,EAAMsC,kBACN,GAAItC,EAAMuC,SAAW1E,KAAKD,GAAI,OAE9BC,KAAKwC,SAAWxC,KAAK2E,YAAYpC,KAAKvC,KAAKD,IAAMC,KAAK4E,aAAarC,KAAKvC,KAAKD,G,CA0C/E,QAAYW,GACV,OAAOV,KAAKwC,WAAaxC,KAAKqC,Q,CAGhC,0BAAYwB,G,MACV,OAAOH,EAAA5C,OAAO+D,OAAG,MAAAnB,SAAA,SAAAA,EAAEoB,SAAS,gC,CAO9B,MAAAC,GACE,OACEC,EAAA,WAAAC,IAAA,2CACEC,MAAO,CACL,CAAC,gCAAgClF,KAAKmF,QAAQnF,KAAKoF,cAAe,KAClE,eAAgBpF,KAAKoE,YACrB/B,SAAUrC,KAAKqC,UAEjBgD,IAAMhB,GAAqCrE,KAAKqE,YAAcA,EAC9D3D,KAAMV,KAAKU,KACX4E,KAAK,QAELN,EAAA,WAAAC,IAAA,2CACEC,MAAM,uBACNK,QAASvF,KAAKkC,YACdsD,QAASxF,KAAKyC,YACdgD,OAAQzF,KAAK2C,WAAU,gBACR3C,KAAKwC,SAAQ,gBACbxC,KAAKqC,SAAQ,gBACd,qBACdqD,SAAU1F,KAAKqC,UAAY,EAAI,EAC/BiD,KAAK,UAELN,EAAA,OAAAC,IAAA,2CACEI,IAAMM,GAAa3F,KAAKgD,WAAa2C,EACrCT,MAAO,CAAE,+BAAgC,KAAM,WAAYlF,KAAK8C,WAChEwC,KAAK,UAELN,EAAA,QAAAC,IAAA,2CAAMW,KAAK,SAASC,aAAc7F,KAAK6C,0BAEzCmC,EAAA,OAAAC,IAAA,2CAAKC,MAAM,6BAA6BI,KAAK,QAC3CN,EAAA,QAAAC,IAAA,2CAAMW,KAAK,YAEbZ,EAAA,OAAAC,IAAA,2CACEI,IAAMM,GAAa3F,KAAKmD,WAAawC,EACrCT,MAAO,CAAE,+BAAgC,KAAM,WAAYlF,KAAKkD,WAChEoC,KAAK,UAELN,EAAA,QAAAC,IAAA,2CAAMW,KAAK,SAASC,aAAc7F,KAAKiD,0BAEzC+B,EAAA,OAAAC,IAAA,2CACEC,MAAO,CACL,iFAAkF,KAClF,UAAWlF,KAAKU,OAASV,KAAK8F,OAC9B,aAAc9F,KAAK8F,QAAU9F,KAAKU,OAGpCsE,EAAA,QAAAC,IAAA,2CAAMW,KAAK,UACTZ,EAAA,WAAAC,IAAA,2CAASW,KAAK,WAGlBZ,EAAA,OAAAC,IAAA,2CACEC,MAAO,CAAE,mCAAoC,KAAM,WAAalF,KAAKU,OAASV,KAAK8F,QAAW9F,KAAK8F,SAEnGd,EAAA,QAAAC,IAAA,2CAAMW,KAAK,YACTZ,EAAA,WAAAC,IAAA,2CAASW,KAAK,aAIpBZ,EAAA,OAAAC,IAAA,2CAAKc,GAAG,qBAAqBb,MAAM,qCAAqCI,KAAK,SAC3EN,EAAA,QAAAC,IAAA,8C","ignoreList":[]}
@@ -0,0 +1,6 @@
1
+ /*!
2
+ * Built by Endavans
3
+ * © https://beeq.design - Apache 2 License.
4
+ */
5
+ import{r as a,h as r,g as e}from"./p-76e714c6.js";import"./p-e5afdf8c.js";import{b}from"./p-d7a88b16.js";const t='::backdrop,:root{--bq-blue-100:#e7f0fd;--bq-blue-200:#d0e2fb;--bq-blue-300:#a1c5f7;--bq-blue-400:#73a8f3;--bq-blue-500:#448bef;--bq-blue-600:#156eeb;--bq-blue-700:#1158bc;--bq-blue-800:#0d428d;--bq-blue-900:#082c5e;--bq-blue-1000:#04162f;--bq-corai-100:#fff2f2;--bq-corai-200:#ffe6e6;--bq-corai-300:#ffccce;--bq-corai-400:#ffb3b5;--bq-corai-500:#ff999d;--bq-corai-600:#ff8084;--bq-corai-700:#cc666a;--bq-corai-800:#994d4f;--bq-corai-900:#663335;--bq-corai-1000:#331a1a;--bq-cyan-100:#e8f7fb;--bq-cyan-200:#d2f0f8;--bq-cyan-300:#a5e1f1;--bq-cyan-400:#78d1e9;--bq-cyan-500:#4bc2e2;--bq-cyan-600:#1eb3db;--bq-cyan-700:#188faf;--bq-cyan-800:#126b83;--bq-cyan-900:#0c4858;--bq-cyan-1000:#06242c;--bq-gold-100:#fbf4ec;--bq-gold-200:#f7e9da;--bq-gold-300:#f0d3b6;--bq-gold-400:#e8bc91;--bq-gold-500:#e1a66d;--bq-gold-600:#d99048;--bq-gold-700:#ae733a;--bq-gold-800:#82562b;--bq-gold-900:#573a1d;--bq-gold-1000:#2b1d0e;--bq-green-100:#e8f8ef;--bq-green-200:#d2f1e0;--bq-green-300:#a5e3c1;--bq-green-400:#78d5a1;--bq-green-500:#4bc782;--bq-green-600:#1eb963;--bq-green-700:#18944f;--bq-green-800:#126f3b;--bq-green-900:#0c4a28;--bq-green-1000:#062514;--bq-grey-100:#f1f2f4;--bq-grey-200:#e7e8eb;--bq-grey-300:#caccd2;--bq-grey-400:#a6aab3;--bq-grey-50:#f6f6f8;--bq-grey-500:#898e99;--bq-grey-600:#646a77;--bq-grey-700:#3f4350;--bq-grey-800:#2a2c35;--bq-grey-900:#1c1d23;--bq-grey-950:#15161a;--bq-grey-1000:#0d0e11;--bq-indigo-100:#edecfc;--bq-indigo-200:#dcdafa;--bq-indigo-300:#b9b5f5;--bq-indigo-400:#9590ef;--bq-indigo-500:#726bea;--bq-indigo-600:#4f46e5;--bq-indigo-700:#3f38b7;--bq-indigo-800:#2f2a89;--bq-indigo-900:#201c5c;--bq-indigo-1000:#100e2e;--bq-iris-100:#e9f0ff;--bq-iris-200:#d6e0ff;--bq-iris-300:#b2c0fe;--bq-iris-400:#8691f8;--bq-iris-500:#6061ee;--bq-iris-600:#4f46e5;--bq-iris-700:#413abd;--bq-iris-800:#332e95;--bq-iris-900:#26216d;--bq-iris-1000:#181545;--bq-lime-100:#f5fae8;--bq-lime-200:#ecf6d2;--bq-lime-300:#d9eda5;--bq-lime-400:#c5e379;--bq-lime-500:#b2da4c;--bq-lime-600:#9fd11f;--bq-lime-700:#7fa719;--bq-lime-800:#5f7d13;--bq-lime-900:#40540c;--bq-lime-1000:#202a06;--bq-magenta-100:#fce7f4;--bq-magenta-200:#f9cfea;--bq-magenta-300:#f39fd6;--bq-magenta-400:#ee6fbf;--bq-magenta-500:#e83fab;--bq-magenta-600:#de1395;--bq-magenta-700:#b20f77;--bq-magenta-800:#850c59;--bq-magenta-900:#58083c;--bq-magenta-1000:#2c041e;--bq-neutral-white:#fbfbfc;--bq-neutral-black:#060708;--bq-orange-100:#fbf0e9;--bq-orange-200:#f8e1d4;--bq-orange-300:#f1c2a8;--bq-orange-400:#eaa47d;--bq-orange-500:#e38551;--bq-orange-600:#dc6726;--bq-orange-700:#b0521e;--bq-orange-800:#843e17;--bq-orange-900:#58290f;--bq-orange-1000:#2c1508;--bq-purple-100:#efebf8;--bq-purple-200:#e0d7f2;--bq-purple-300:#c1afe5;--bq-purple-400:#a388d8;--bq-purple-500:#8460cb;--bq-purple-600:#6538be;--bq-purple-700:#512d98;--bq-purple-800:#3d2272;--bq-purple-900:#28164c;--bq-purple-1000:#140b26;--bq-red-100:#fce7ea;--bq-red-200:#f9d1d5;--bq-red-300:#f3a2ac;--bq-red-400:#ed7482;--bq-red-500:#e74559;--bq-red-600:#e1172f;--bq-red-700:#b41226;--bq-red-800:#870e1c;--bq-red-900:#5a0913;--bq-red-1000:#2d0509;--bq-sky-100:#eff4fb;--bq-sky-200:#dfeaf8;--bq-sky-300:#bfd5f1;--bq-sky-400:#9ec1e9;--bq-sky-500:#7eace2;--bq-sky-600:#5e97db;--bq-sky-700:#4b79af;--bq-sky-800:#385b83;--bq-sky-900:#263c58;--bq-sky-1000:#131e2c;--bq-teal-100:#e5f7f5;--bq-teal-200:#ccf0eb;--bq-teal-300:#99e1d8;--bq-teal-400:#66d2c4;--bq-teal-500:#33c3b1;--bq-teal-600:#00b49d;--bq-teal-700:#00907e;--bq-teal-800:#006c5e;--bq-teal-900:#00483f;--bq-teal-1000:#00241f;--bq-volcano-100:#feede7;--bq-volcano-200:#fddbd1;--bq-volcano-300:#fbb8a3;--bq-volcano-400:#fa9474;--bq-volcano-500:#f87146;--bq-volcano-600:#f64d18;--bq-volcano-700:#c53e13;--bq-volcano-800:#942e0e;--bq-volcano-900:#621f0a;--bq-volcano-1000:#310f05;--bq-yellow-100:#fefbe7;--bq-yellow-200:#fcf6d0;--bq-yellow-300:#faeea0;--bq-yellow-400:#f7e571;--bq-yellow-500:#f5dd41;--bq-yellow-600:#f2d412;--bq-yellow-700:#c2aa0e;--bq-yellow-800:#917f0b;--bq-yellow-900:#615507;--bq-yellow-1000:#302a04;--bq-endava-grey-50:#f7f7f8;--bq-endava-grey-100:#e4e6e7;--bq-endava-grey-200:#b5babe;--bq-endava-grey-300:#949ca1;--bq-endava-grey-400:#737d84;--bq-endava-grey-500:#525f67;--bq-endava-grey-600:#30404b;--bq-endava-grey-700:#2b3942;--bq-endava-grey-800:#263139;--bq-endava-grey-900:#192b37;--bq-endava-grey-950:#151b1e;--bq-endava-grey-1000:#0f1316;--bq-endava-neutral-white:#fafbfb;--bq-endava-neutral-black:#060708;--bq-endava-orange-100:#fef3f1;--bq-endava-orange-200:#fbd6d1;--bq-endava-orange-300:#fab7af;--bq-endava-orange-400:#fa988b;--bq-endava-orange-500:#fc7866;--bq-endava-orange-600:#ff5640;--bq-endava-orange-700:#ce4a39;--bq-endava-orange-800:#a03d30;--bq-endava-orange-900:#722e25;--bq-endava-orange-1000:#471e19}*,:after,:before{box-sizing:border-box}*{font:inherit;margin:0}ol[role=list],ul[role=list]{list-style-type:none}html{font-size:var(--bq-font-size--m)}html:focus-within{scroll-behavior:smooth}body{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background-color:var(--bq-background--primary);color:var(--bq-text--primary);font-family:var(--bq-font-family);line-height:var(--bq-font-line-height--regular);min-height:100vh;text-rendering:optimizeSpeed}a:not([class]){text-decoration-skip-ink:auto}canvas,img,picture,svg,video{display:block;max-width:100%}button,input,select,textarea{font:inherit}h1,h2,h3,h4,h5,h6,p{overflow-wrap:break-word}@media (prefers-reduced-motion:reduce){html:focus-within{scroll-behavior:auto}*,:after,:before{animation-duration:.01ms!important;animation-iteration-count:1!important;scroll-behavior:auto;transition-duration:.01ms!important}}:root{--bq-white:#fff;--bq-black:#060708;--bq-neutral-50:var(--bq-grey-50);--bq-neutral-100:var(--bq-grey-100);--bq-neutral-200:var(--bq-grey-200);--bq-neutral-300:var(--bq-grey-300);--bq-neutral-400:var(--bq-grey-400);--bq-neutral-500:var(--bq-grey-500);--bq-neutral-600:var(--bq-grey-600);--bq-neutral-700:var(--bq-grey-700);--bq-neutral-800:var(--bq-grey-800);--bq-neutral-900:var(--bq-grey-900);--bq-neutral-950:var(--bq-grey-950);--bq-neutral-1000:var(--bq-grey-1000);--bq-brand-light:var(--bq-iris-100);--bq-brand:var(--bq-iris-600);--bq-brand-dark:var(--bq-iris-1000);--bq-accent-light:var(--bq-purple-100);--bq-accent:var(--bq-purple-600);--bq-accent-dark:var(--bq-purple-1000);--bq-success-light:var(--bq-teal-100);--bq-success:var(--bq-teal-600);--bq-success-dark:var(--bq-teal-1000);--bq-danger-light:var(--bq-red-100);--bq-danger:var(--bq-red-600);--bq-danger-dark:var(--bq-red-1000);--bq-warning-light:var(--bq-gold-100);--bq-warning:var(--bq-gold-600);--bq-warning-dark:var(--bq-gold-1000);--bq-info-light:var(--bq-iris-100);--bq-info:var(--bq-iris-600);--bq-info-dark:var(--bq-iris-1000);--bq-focus:var(--bq-iris-600);--bq-data-01:var(--bq-brand);--bq-data-02:var(--bq-purple-600);--bq-data-03:var(--bq-magenta-600);--bq-data-04:var(--bq-cyan-600);--bq-data-05:var(--bq-teal-600);--bq-data-06:var(--bq-orange-600);--bq-data-07:var(--bq-yellow-600);--bq-data-08:var(--bq-red-600);--bq-data-09:var(--bq-blue-600);--bq-data-10:var(--bq-grey-600);--bq-data-11:var(--bq-black);--bq-data-12:var(--bq-white);--bq-radius--none:0;--bq-radius--xs2:0.125rem;--bq-radius--xs:0.25rem;--bq-radius--s:0.5rem;--bq-radius--m:0.75rem;--bq-radius--l:1.5rem;--bq-radius--full:9999px;--bq-box-shadow--xs:0 2px 0 rgba(0,0,0,.016);--bq-box-shadow--s:0 8px 24px rgba(0,0,0,.04);--bq-box-shadow--m:0 10px 48px -16px rgba(0,0,0,.12);--bq-box-shadow--l:0 20px 58px -16px rgba(0,0,0,.16);--bq-font-family:"Outfit",sans-serif;--bq-font-size--xs:0.75rem;--bq-font-size--s:0.875rem;--bq-font-size--m:1rem;--bq-font-size--l:1.125rem;--bq-font-size--xl:1.5rem;--bq-font-size--xxl:2rem;--bq-font-size--xxl2:2.5rem;--bq-font-size--xxl3:3rem;--bq-font-size--xxl4:3.5rem;--bq-font-size--xxl5:4rem;--bq-font-weight--thin:100;--bq-font-weight--light:300;--bq-font-weight--regular:400;--bq-font-weight--medium:500;--bq-font-weight--semibold:600;--bq-font-weight--bold:700;--bq-font-line-height--small:1.2;--bq-font-line-height--regular:1.5;--bq-font-line-height--large:1.5;--bq-spacing-xs3:0.125rem;--bq-spacing-xs2:0.25rem;--bq-spacing-xs:0.5rem;--bq-spacing-s:0.75rem;--bq-spacing-m:1rem;--bq-spacing-l:1.5rem;--bq-spacing-xl:2rem;--bq-spacing-xxl:2.5rem;--bq-spacing-xxl2:3.5rem;--bq-spacing-xxl3:4rem;--bq-spacing-xxl4:4.5rem;--bq-stroke-s:1px;--bq-stroke-m:2px;--bq-stroke-l:3px}.beeq.light,.light,:root,[bq-mode=light]{--bq-background--primary:var(--bq-white);--bq-background--secondary:var(--bq-neutral-100);--bq-background--tertiary:var(--bq-neutral-200);--bq-background--alt:var(--bq-neutral-300);--bq-background--inverse:var(--bq-neutral-900);--bq-background--brand:var(--bq-brand);--bq-background--overlay:var(--bq-neutral-900);--bq-icon--primary:var(--bq-neutral-800);--bq-icon--alt:var(--bq-white);--bq-icon--secondary:var(--bq-neutral-600);--bq-icon--inverse:var(--bq-neutral-50);--bq-icon--brand:var(--bq-brand);--bq-icon--info:var(--bq-brand);--bq-icon--success:var(--bq-success);--bq-icon--warning:var(--bq-warning);--bq-icon--danger:var(--bq-danger);--bq-stroke--primary:var(--bq-neutral-200);--bq-stroke--secondary:var(--bq-neutral-600);--bq-stroke--tertiary:var(--bq-neutral-900);--bq-stroke--inverse:var(--bq-white);--bq-stroke--brand:var(--bq-brand);--bq-stroke--alt:var(--bq-neutral-50);--bq-stroke--success:var(--bq-success);--bq-stroke--warning:var(--bq-warning);--bq-stroke--danger:var(--bq-danger);--bq-stroke--info:var(--bq-brand);--bq-text--primary:var(--bq-neutral-800);--bq-text--secondary:var(--bq-neutral-600);--bq-text--inverse:var(--bq-neutral-50);--bq-text--brand:var(--bq-brand);--bq-text--alt:var(--bq-white);--bq-text--info:var(--bq-brand);--bq-text--success:var(--bq-success);--bq-text--warning:var(--bq-warning);--bq-text--danger:var(--bq-danger);--bq-ui--primary:var(--bq-white);--bq-ui--secondary:var(--bq-neutral-200);--bq-ui--tertiary:var(--bq-neutral-500);--bq-ui--inverse:var(--bq-neutral-900);--bq-ui--brand:var(--bq-brand);--bq-ui--brand-alt:var(--bq-brand-light);--bq-ui--alt:var(--bq-neutral-50);--bq-ui--success:var(--bq-success);--bq-ui--success-alt:var(--bq-success-light);--bq-ui--warning:var(--bq-warning);--bq-ui--warning-alt:var(--bq-warning-light);--bq-ui--danger:var(--bq-danger);--bq-ui--danger-alt:var(--bq-danger-light);--bq-ui--info:var(--bq-brand);--bq-ui--info-alt:var(--bq-brand-light);--bq-hover:#bcbfc5;--bq-active:#444546}.beeq.dark,.dark,[bq-mode=dark]{--bq-background--primary:var(--bq-neutral-1000);--bq-background--secondary:var(--bq-neutral-950);--bq-background--tertiary:var(--bq-neutral-800);--bq-background--alt:var(--bq-neutral-700);--bq-background--inverse:var(--bq-neutral-600);--bq-background--brand:var(--bq-brand);--bq-background--overlay:var(--bq-neutral-900);--bq-icon--primary:var(--bq-neutral-100);--bq-icon--secondary:var(--bq-neutral-400);--bq-icon--inverse:var(--bq-neutral-800);--bq-icon--brand:var(--bq-brand);--bq-icon--alt:var(--bq-white);--bq-icon--info:var(--bq-brand);--bq-icon--success:var(--bq-success);--bq-icon--warning:var(--bq-warning);--bq-icon--danger:var(--bq-danger);--bq-stroke--primary:var(--bq-neutral-900);--bq-stroke--secondary:var(--bq-neutral-700);--bq-stroke--tertiary:var(--bq-neutral-400);--bq-stroke--inverse:var(--bq-neutral-950);--bq-stroke--brand:var(--bq-brand);--bq-stroke--alt:var(--bq-neutral-1000);--bq-stroke--success:var(--bq-success);--bq-stroke--warning:var(--bq-warning);--bq-stroke--danger:var(--bq-danger);--bq-stroke--info:var(--bq-brand);--bq-text--primary:var(--bq-neutral-100);--bq-text--secondary:var(--bq-neutral-400);--bq-text--inverse:var(--bq-neutral-800);--bq-text--brand:var(--bq-brand);--bq-text--alt:var(--bq-white);--bq-text--info:var(--bq-brand);--bq-text--success:var(--bq-success);--bq-text--warning:var(--bq-warning);--bq-text--danger:var(--bq-danger);--bq-ui--primary:var(--bq-neutral-900);--bq-ui--secondary:var(--bq-neutral-800);--bq-ui--tertiary:var(--bq-neutral-700);--bq-ui--inverse:var(--bq-neutral-100);--bq-ui--brand:var(--bq-brand);--bq-ui--brand-alt:var(--bq-brand-dark);--bq-ui--alt:var(--bq-neutral-950);--bq-ui--success:var(--bq-success);--bq-ui--success-alt:var(--bq-success-dark);--bq-ui--warning:var(--bq-warning);--bq-ui--warning-alt:var(--bq-warning-dark);--bq-ui--danger:var(--bq-danger);--bq-ui--danger-alt:var(--bq-danger-dark);--bq-ui--info:var(--bq-brand);--bq-ui--info-alt:var(--bq-brand-dark);--bq-hover:#444546;--bq-active:#1f2026}.endava,[bq-theme=endava]{--bq-font-family:"Poppins",sans-serif;--bq-white:#fafbfb;--bq-black:#030406;--bq-neutral-50:var(--bq-endava-grey-50);--bq-neutral-100:var(--bq-endava-grey-100);--bq-neutral-200:var(--bq-endava-grey-200);--bq-neutral-300:var(--bq-endava-grey-300);--bq-neutral-400:var(--bq-endava-grey-400);--bq-neutral-500:var(--bq-endava-grey-500);--bq-neutral-600:var(--bq-endava-grey-600);--bq-neutral-700:var(--bq-endava-grey-700);--bq-neutral-800:var(--bq-endava-grey-800);--bq-neutral-900:var(--bq-endava-grey-900);--bq-neutral-950:var(--bq-endava-grey-950);--bq-neutral-1000:var(--bq-endava-grey-1000);--bq-brand-light:var(--bq-endava-orange-100);--bq-brand:var(--bq-endava-orange-600);--bq-brand-dark:var(--bq-endava-orange-1000);--bq-accent-light:var(--bq-endava-orange-100);--bq-accent:var(--bq-endava-orange-600);--bq-accent-dark:var(--bq-endava-orange-1000);--bq-success-light:var(--bq-green-100);--bq-success:var(--bq-green-600);--bq-success-dark:var(--bq-green-1000);--bq-danger-light:var(--bq-corai-100);--bq-danger:var(--bq-corai-600);--bq-danger-dark:var(--bq-corai-1000);--bq-warning-light:var(--bq-yellow-100);--bq-warning:var(--bq-yellow-600);--bq-warning-dark:var(--bq-yellow-1000);--bq-info-light:var(--bq-blue-100);--bq-info:var(--bq-blue-600);--bq-info-dark:var(--bq-blue-1000);--bq-focus:var(--bq-endava-orange-600);--bq-data-01:var(--bq-brand);--bq-data-02:#af0cd8;--bq-data-03:#0ca8d8;--bq-data-04:var(--bq-teal-600);--bq-data-05:var(--bq-yellow-600);--bq-data-06:var(--bq-orange-600);--bq-data-07:var(--bq-blue-600);--bq-data-08:var(--bq-red-600);--bq-data-09:var(--bq-purple-600);--bq-data-10:#394b56;--bq-data-11:var(--bq-black);--bq-data-12:var(--bq-white)}.endava.light,[bq-theme=endava][bq-mode=light]{--bq-background--primary:var(--bq-white);--bq-background--secondary:var(--bq-neutral-100);--bq-background--tertiary:var(--bq-neutral-200);--bq-background--alt:var(--bq-neutral-300);--bq-background--inverse:var(--bq-neutral-900);--bq-background--brand:var(--bq-brand);--bq-background--overlay:var(--bq-neutral-900);--bq-icon--primary:var(--bq-neutral-800);--bq-icon--secondary:var(--bq-neutral-600);--bq-icon--inverse:var(--bq-neutral-50);--bq-icon--brand:var(--bq-brand);--bq-icon--alt:var(--bq-white);--bq-icon--info:var(--bq-info);--bq-icon--success:var(--bq-success);--bq-icon--warning:var(--bq-warning);--bq-icon--danger:var(--bq-danger);--bq-stroke--primary:var(--bq-neutral-200);--bq-stroke--secondary:var(--bq-neutral-600);--bq-stroke--tertiary:var(--bq-neutral-900);--bq-stroke--inverse:var(--bq-white);--bq-stroke--brand:var(--bq-brand);--bq-stroke--alt:var(--bq-neutral-50);--bq-stroke--brand-alt:var(--bq-brand-light);--bq-stroke--success:var(--bq-success);--bq-stroke--warning:var(--bq-warning);--bq-stroke--danger:var(--bq-danger);--bq-stroke--info:var(--bq-info);--bq-text--primary:var(--bq-neutral-800);--bq-text--secondary:var(--bq-neutral-600);--bq-text--inverse:var(--bq-neutral-50);--bq-text--brand:var(--bq-brand);--bq-text--alt:var(--bq-white);--bq-text--info:var(--bq-info);--bq-text--success:var(--bq-success);--bq-text--warning:var(--bq-warning);--bq-text--danger:var(--bq-danger);--bq-ui--primary:var(--bq-white);--bq-ui--secondary:var(--bq-neutral-200);--bq-ui--tertiary:var(--bq-neutral-500);--bq-ui--inverse:var(--bq-neutral-900);--bq-ui--alt:var(--bq-neutral-50);--bq-ui--brand-alt:var(--bq-brand-light);--bq-ui--brand:var(--bq-brand);--bq-ui--success:var(--bq-success);--bq-ui--success-alt:var(--bq-success-light);--bq-ui--warning:var(--bq-warning);--bq-ui--warning-alt:var(--bq-warning-light);--bq-ui--danger:var(--bq-danger);--bq-ui--danger-alt:var(--bq-danger-light);--bq-ui--info:var(--bq-info);--bq-ui--info-alt:var(--bq-info-light);--bq-hover:#444546;--bq-active:#1f2026}.endava.dark,[bq-theme=endava][bq-mode=dark]{--bq-background--primary:var(--bq-neutral-1000);--bq-background--secondary:var(--bq-neutral-900);--bq-background--tertiary:var(--bq-neutral-800);--bq-background--alt:var(--bq-neutral-700);--bq-background--inverse:var(--bq-neutral-600);--bq-background--brand:var(--bq-brand);--bq-background--overlay:var(--bq-neutral-900);--bq-icon--primary:var(--bq-neutral-100);--bq-icon--secondary:var(--bq-neutral-400);--bq-icon--inverse:var(--bq-neutral-800);--bq-icon--brand:var(--bq-brand);--bq-icon--alt:var(--bq-white);--bq-icon--info:var(--bq-info);--bq-icon--success:var(--bq-success);--bq-icon--warning:var(--bq-warning);--bq-icon--danger:var(--bq-danger);--bq-stroke--primary:var(--bq-neutral-900);--bq-stroke--secondary:var(--bq-neutral-700);--bq-stroke--tertiary:var(--bq-neutral-400);--bq-stroke--inverse:var(--bq-neutral-950);--bq-stroke--brand:var(--bq-brand);--bq-stroke--brand-alt:var(--bq-brand-dark);--bq-stroke--alt:var(--bq-neutral-1000);--bq-stroke--success:var(--bq-success);--bq-stroke--warning:var(--bq-warning);--bq-stroke--danger:var(--bq-danger);--bq-stroke--info:var(--bq-info);--bq-text--primary:var(--bq-neutral-100);--bq-text--secondary:var(--bq-neutral-400);--bq-text--inverse:var(--bq-neutral-800);--bq-text--brand:var(--bq-brand);--bq-text--alt:var(--bq-neutral-white);--bq-text--info:var(--bq-info);--bq-text--success:var(--bq-success);--bq-text--warning:var(--bq-warning);--bq-text--danger:var(--bq-danger);--bq-ui--primary:var(--bq-neutral-900);--bq-ui--secondary:var(--bq-neutral-800);--bq-ui--tertiary:var(--bq-neutral-700);--bq-ui--inverse:var(--bq-neutral-100);--bq-ui--brand:var(--bq-brand);--bq-ui--brand-alt:var(--bq-brand-dark);--bq-ui--alt:var(--bq-neutral-950);--bq-ui--success:var(--bq-success);--bq-ui--success-alt:var(--bq-success-dark);--bq-ui--warning:var(--bq-warning);--bq-ui--warning-alt:var(--bq-warning-dark);--bq-ui--danger:var(--bq-danger);--bq-ui--danger-alt:var(--bq-danger-dark);--bq-ui--info:var(--bq-info);--bq-ui--info-alt:var(--bq-info-dark);--bq-hover:#444546;--bq-active:#1f2026}.transform{--tw-translate-x:0;--tw-translate-y:0;--tw-rotate:0;--tw-skew-x:0;--tw-skew-y:0;--tw-scale-x:1;--tw-scale-y:1;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.block{display:block}@-webkit-keyframes fade-in{0%{opacity:0}}@keyframes fade-in{0%{opacity:0}}@-webkit-keyframes slide-in{0%{-webkit-transform:translateY(10px);transform:translateY(10px)}}@keyframes slide-in{0%{-webkit-transform:translateY(10px);transform:translateY(10px)}}@-webkit-keyframes spin{0%{-webkit-transform:rotate(0deg);transform:rotate(0deg)}to{-webkit-transform:rotate(1turn);transform:rotate(1turn)}}@keyframes spin{0%{-webkit-transform:rotate(0deg);transform:rotate(0deg)}to{-webkit-transform:rotate(1turn);transform:rotate(1turn)}}:host{--paddingY:var(--bq-spacing-xl);--subtitle-borderBlockEnd:1px solid var(--bq-stroke--primary);--subtitle-fontWeight:var(--bq-font-weight--medium);--subtitle-textColor:var(--bq-text--secondary);--subtitle-textSize:var(--bq-font-size--l);--title-fontWeight:var(--bq-font-weight--bold);--title-lineHeight:var(--bq-font-line-height--regular);--title-textColor:var(--bq-text--primary);--title-textSize:var(--bq-font-size--xxl);display:block}.static{position:static}.flex{display:flex}.\\!hidden{display:none!important}.hidden{display:none}.flex-grow{flex-grow:1}.flex-col{flex-direction:column}.items-center{align-items:center}.gap-xs{gap:var(--bq-spacing-xs)}.text-\\[length\\:--subtitle-textSize\\]{font-size:var(--subtitle-textSize)}.text-\\[length\\:--title-textSize\\]{font-size:var(--title-textSize)}.font-\\[--subtitle-fontWeight\\]{font-weight:var(--subtitle-fontWeight)}.font-\\[--title-fontWeight\\]{font-weight:var(--title-fontWeight)}.leading-\\[--title-lineHeight\\]{line-height:var(--title-lineHeight)}.text-\\[color\\:--subtitle-textColor\\]{color:var(--subtitle-textColor)}.text-\\[color\\:--title-textColor\\]{color:var(--title-textColor)}.p-b-\\[--paddingY\\]{padding-block:var(--paddingY)}.p-b-xs2{padding-block:var(--bq-spacing-xs2)}.p-i-xs2{padding-inline:var(--bq-spacing-xs2)}.\\[border-block-end\\:--subtitle-borderBlockEnd\\]{border-block-end:var(--subtitle-borderBlockEnd)}.container{width:100%}@media (min-width:640px){.container{max-width:640px}}@media (min-width:768px){.container{max-width:768px}}@media (min-width:1024px){.container{max-width:1024px}}@media (min-width:1280px){.container{max-width:1280px}}@media (min-width:1536px){.container{max-width:1536px}}';const q=t;const n=class{constructor(r){a(this,r);this.handleSlotChange=()=>{this.haveBackNavigation=b(this.backNavigationElem,"back");this.hasSuffix=b(this.suffixElem,"suffix");this.hasSubTitle=b(this.subTitleElem,"sub-title")};this.haveBackNavigation=false;this.hasSuffix=false;this.hasSubTitle=false}render(){return r("div",{key:"f666329e218fc5b7ab6921246ba8d7c0d83ec852",class:"flex gap-xs p-b-[--paddingY] [border-block-end:--subtitle-borderBlockEnd]",part:"base"},r("div",{key:"c0ca10b24649f7b071a8ce5f236d7d0edbd2764f",class:{flex:true,"!hidden":!this.haveBackNavigation},ref:a=>this.backNavigationElem=a,part:"back"},r("slot",{key:"0dc58c37323770de53cd2e35d2016dbe0cb86401",name:"back",onSlotchange:this.handleSlotChange})),r("div",{key:"77418fea7b174aff9d9c0788c8614c03a62eaf46",class:"flex flex-grow flex-col gap-xs",part:"content"},r("div",{key:"97d55bac47b211df08b3c61c1ca56d061879093b",class:"flex items-center gap-xs",part:"title-suffix"},r("h1",{key:"17c921b8b7cc9f4b043846223e84a2e19cdaa975",class:"title-font text-[length:--title-textSize] font-[--title-fontWeight] leading-[--title-lineHeight] text-[color:--title-textColor]",part:"title"},r("slot",{key:"349a8719450cdca95833eff9d98e6d2f9ca033e6"})),r("div",{key:"04a72ba1600ae73425879af52e191feeb5d4b87e",class:{"flex flex-grow gap-xs p-b-xs2 p-i-xs2":true,"!hidden":!this.hasSuffix},ref:a=>this.suffixElem=a,part:"suffix"},r("slot",{key:"497a620a75c5d7f1d284c9950fa63ec148e38db1",name:"suffix",onSlotchange:this.handleSlotChange}))),r("div",{key:"81e48a2926f4e45091b0a1bcf42e0cca2ff83437",class:{"title-font text-[length:--subtitle-textSize] font-[--subtitle-fontWeight] leading-[--title-lineHeight] text-[color:--subtitle-textColor]":true,hidden:!this.hasSubTitle},ref:a=>this.subTitleElem=a,part:"sub-title"},r("slot",{key:"9be306645b3ffaf8af19343cc1df231dbfcc45d2",name:"sub-title",onSlotchange:this.handleSlotChange}))))}get el(){return e(this)}};n.style=q;export{n as bq_page_title};
6
+ //# sourceMappingURL=p-83207939.entry.js.map
@@ -1 +1 @@
1
- {"version":3,"names":["bqPageTitleCss","BqPageTitleStyle0","BqPageTitle","this","handleSlotChange","haveBackNavigation","hasSlotContent","backNavigationElem","hasSuffix","suffixElem","hasSubTitle","subTitleElem","render","h","key","class","part","flex","ref","divElem","name","onSlotchange","hidden"],"sources":["../../packages/beeq/src/components/page-title/scss/bq-page-title.scss?tag=bq-page-title&encapsulation=shadow","../../packages/beeq/src/components/page-title/bq-page-title.tsx"],"sourcesContent":["/* -------------------------------------------------------------------------- */\n/* Page title styles */\n/* -------------------------------------------------------------------------- */\n\n@import './bq-page-title.variables';\n\n:host {\n @apply block;\n}\n","import { Component, Element, h, State } from '@stencil/core';\n\nimport { hasSlotContent } from '../../shared/utils';\n\n/**\n * @part base - The inner container `<div>`of element that contains the base page title component.\n * @part content - Defines the main container of the page title component, which includes the title and subtitle elements.\n * @part title-suffix - Defines the container that holds the title and any suffix content.\n * @part back - The container `<div>` page title element that acts as back slot container.\n * @part title - The `<h1>` element serves as a container for the page title content, to improve accessibility.\n * @part suffix - The `<div>` page title element that acts as suffix slot container.\n * @part sub-title - The `<div>` page title element that acts as sub-title slot container.\n */\n@Component({\n tag: 'bq-page-title',\n styleUrl: './scss/bq-page-title.scss',\n shadow: true,\n})\nexport class BqPageTitle {\n // Own Properties\n // ====================\n\n private backNavigationElem: HTMLElement;\n private suffixElem: HTMLElement;\n private subTitleElem: HTMLElement;\n\n // Reference to host HTML element\n // ===================================\n\n @Element() el!: HTMLBqPageTitleElement;\n\n // State() variables\n // Inlined decorator, alphabetical order\n // =======================================\n\n @State() private haveBackNavigation = false;\n @State() private hasSuffix = false;\n @State() private hasSubTitle = false;\n\n // Public Property API\n // ========================\n\n // Prop lifecycle events\n // =======================\n\n // Events section\n // Requires JSDocs for public API documentation\n // ==============================================\n\n // Component lifecycle events\n // Ordered by their natural call order\n // =====================================\n\n // Listeners\n // ==============\n\n // Public methods API\n // These methods are exposed on the host element.\n // Always use two lines.\n // Public Methods must be async.\n // Requires JSDocs for public API documentation.\n // ===============================================\n\n // Local methods\n // Internal business logic.\n // These methods cannot be called from the host element.\n // =======================================================\n\n private handleSlotChange = () => {\n this.haveBackNavigation = hasSlotContent(this.backNavigationElem, 'back');\n this.hasSuffix = hasSlotContent(this.suffixElem, 'suffix');\n this.hasSubTitle = hasSlotContent(this.subTitleElem, 'sub-title');\n };\n\n // render() function\n // Always the last one in the class.\n // ===================================\n\n render() {\n return (\n <div class=\"flex gap-xs p-b-[--paddingY] [border-block-end:--subtitle-borderBlockEnd]\" part=\"base\">\n {/* Back navigation button */}\n <div\n class={{ flex: true, '!hidden': !this.haveBackNavigation }}\n ref={(divElem) => (this.backNavigationElem = divElem)}\n part=\"back\"\n >\n <slot name=\"back\" onSlotchange={this.handleSlotChange} />\n </div>\n <div class=\"flex flex-grow flex-col gap-xs\" part=\"content\">\n <div class=\"flex items-center gap-xs\" part=\"title-suffix\">\n {/* Title */}\n <h1\n class=\"title-font text-[length:--title-textSize] font-[--title-fontWeight] leading-[--title-lineHeight] text-[color:--title-textColor]\"\n part=\"title\"\n >\n <slot />\n </h1>\n {/* Suffix */}\n <div\n class={{ 'flex flex-grow gap-xs p-b-xs2 p-i-xs2': true, '!hidden': !this.hasSuffix }}\n ref={(divElem) => (this.suffixElem = divElem)}\n part=\"suffix\"\n >\n <slot name=\"suffix\" onSlotchange={this.handleSlotChange} />\n </div>\n </div>\n {/* Sub-title */}\n <div\n class={{\n 'title-font text-[length:--subtitle-textSize] font-[--subtitle-fontWeight] leading-[--title-lineHeight] text-[color:--subtitle-textColor]':\n true,\n hidden: !this.hasSubTitle,\n }}\n ref={(divElem) => (this.subTitleElem = divElem)}\n part=\"sub-title\"\n >\n <slot name=\"sub-title\" onSlotchange={this.handleSlotChange} />\n </div>\n </div>\n </div>\n );\n }\n}\n"],"mappings":";;;;;;;;;;AAAA,MAAMA,IAAiB;;AACvB,MAAAC,IAAeD;;MCiBFE,IAAW;;;;;;;;;;;;;;;;;;;;;;;;;QAkDdC,KAAAC,mBAAmB;MACzBD,KAAKE,qBAAqBC,EAAeH,KAAKI,oBAAoB;MAClEJ,KAAKK,YAAYF,EAAeH,KAAKM,YAAY;MACjDN,KAAKO,cAAcJ,EAAeH,KAAKQ,cAAc;AAAY;8BApC7B;qBACT;uBACE;;;;;EAyC/B,MAAAC;IACE,OACEC,EAAA;MAAAC,KAAA;MAAKC,OAAM;MAA4EC,MAAK;OAE1FH,EAAA;MAAAC,KAAA;MACEC,OAAO;QAAEE,MAAM;QAAM,YAAYd,KAAKE;;MACtCa,KAAMC,KAAahB,KAAKI,qBAAqBY;MAC7CH,MAAK;OAELH,EAAA;MAAAC,KAAA;MAAMM,MAAK;MAAOC,cAAclB,KAAKC;SAEvCS,EAAA;MAAAC,KAAA;MAAKC,OAAM;MAAiCC,MAAK;OAC/CH,EAAA;MAAAC,KAAA;MAAKC,OAAM;MAA2BC,MAAK;OAEzCH,EAAA;MAAAC,KAAA;MACEC,OAAM;MACNC,MAAK;OAELH,EAAA;MAAAC,KAAA;SAGFD,EAAA;MAAAC,KAAA;MACEC,OAAO;QAAE,yCAAyC;QAAM,YAAYZ,KAAKK;;MACzEU,KAAMC,KAAahB,KAAKM,aAAaU;MACrCH,MAAK;OAELH,EAAA;MAAAC,KAAA;MAAMM,MAAK;MAASC,cAAclB,KAAKC;UAI3CS,EAAA;MAAAC,KAAA;MACEC,OAAO;QACL,4IACE;QACFO,SAASnB,KAAKO;;MAEhBQ,KAAMC,KAAahB,KAAKQ,eAAeQ;MACvCH,MAAK;OAELH,EAAA;MAAAC,KAAA;MAAMM,MAAK;MAAYC,cAAclB,KAAKC","ignoreList":[]}
1
+ {"version":3,"names":["bqPageTitleCss","BqPageTitleStyle0","BqPageTitle","this","handleSlotChange","haveBackNavigation","hasSlotContent","backNavigationElem","hasSuffix","suffixElem","hasSubTitle","subTitleElem","render","h","key","class","part","flex","ref","divElem","name","onSlotchange","hidden"],"sources":["../../packages/beeq/src/components/page-title/scss/bq-page-title.scss?tag=bq-page-title&encapsulation=shadow","../../packages/beeq/src/components/page-title/bq-page-title.tsx"],"sourcesContent":["/* -------------------------------------------------------------------------- */\n/* Page title styles */\n/* -------------------------------------------------------------------------- */\n\n@import './bq-page-title.variables';\n\n:host {\n @apply block;\n}\n","import { Component, Element, h, State } from '@stencil/core';\n\nimport { hasSlotContent } from '../../shared/utils';\n\n/**\n * @part base - The inner container `<div>`of element that contains the base page title component.\n * @part content - Defines the main container of the page title component, which includes the title and subtitle elements.\n * @part title-suffix - Defines the container that holds the title and any suffix content.\n * @part back - The container `<div>` page title element that acts as back slot container.\n * @part title - The `<h1>` element serves as a container for the page title content, to improve accessibility.\n * @part suffix - The `<div>` page title element that acts as suffix slot container.\n * @part sub-title - The `<div>` page title element that acts as sub-title slot container.\n */\n@Component({\n tag: 'bq-page-title',\n styleUrl: './scss/bq-page-title.scss',\n shadow: true,\n})\nexport class BqPageTitle {\n // Own Properties\n // ====================\n\n private backNavigationElem: HTMLElement;\n private suffixElem: HTMLElement;\n private subTitleElem: HTMLElement;\n\n // Reference to host HTML element\n // ===================================\n\n @Element() el!: HTMLBqPageTitleElement;\n\n // State() variables\n // Inlined decorator, alphabetical order\n // =======================================\n\n @State() private haveBackNavigation = false;\n @State() private hasSuffix = false;\n @State() private hasSubTitle = false;\n\n // Public Property API\n // ========================\n\n // Prop lifecycle events\n // =======================\n\n // Events section\n // Requires JSDocs for public API documentation\n // ==============================================\n\n // Component lifecycle events\n // Ordered by their natural call order\n // =====================================\n\n // Listeners\n // ==============\n\n // Public methods API\n // These methods are exposed on the host element.\n // Always use two lines.\n // Public Methods must be async.\n // Requires JSDocs for public API documentation.\n // ===============================================\n\n // Local methods\n // Internal business logic.\n // These methods cannot be called from the host element.\n // =======================================================\n\n private handleSlotChange = () => {\n this.haveBackNavigation = hasSlotContent(this.backNavigationElem, 'back');\n this.hasSuffix = hasSlotContent(this.suffixElem, 'suffix');\n this.hasSubTitle = hasSlotContent(this.subTitleElem, 'sub-title');\n };\n\n // render() function\n // Always the last one in the class.\n // ===================================\n\n render() {\n return (\n <div class=\"flex gap-xs p-b-[--paddingY] [border-block-end:--subtitle-borderBlockEnd]\" part=\"base\">\n {/* Back navigation button */}\n <div\n class={{ flex: true, '!hidden': !this.haveBackNavigation }}\n ref={(divElem) => (this.backNavigationElem = divElem)}\n part=\"back\"\n >\n <slot name=\"back\" onSlotchange={this.handleSlotChange} />\n </div>\n <div class=\"flex flex-grow flex-col gap-xs\" part=\"content\">\n <div class=\"flex items-center gap-xs\" part=\"title-suffix\">\n {/* Title */}\n <h1\n class=\"title-font text-[length:--title-textSize] font-[--title-fontWeight] leading-[--title-lineHeight] text-[color:--title-textColor]\"\n part=\"title\"\n >\n <slot />\n </h1>\n {/* Suffix */}\n <div\n class={{ 'flex flex-grow gap-xs p-b-xs2 p-i-xs2': true, '!hidden': !this.hasSuffix }}\n ref={(divElem) => (this.suffixElem = divElem)}\n part=\"suffix\"\n >\n <slot name=\"suffix\" onSlotchange={this.handleSlotChange} />\n </div>\n </div>\n {/* Sub-title */}\n <div\n class={{\n 'title-font text-[length:--subtitle-textSize] font-[--subtitle-fontWeight] leading-[--title-lineHeight] text-[color:--subtitle-textColor]':\n true,\n hidden: !this.hasSubTitle,\n }}\n ref={(divElem) => (this.subTitleElem = divElem)}\n part=\"sub-title\"\n >\n <slot name=\"sub-title\" onSlotchange={this.handleSlotChange} />\n </div>\n </div>\n </div>\n );\n }\n}\n"],"mappings":";;;;yGAAA,MAAMA,EAAiB,0zoBACvB,MAAAC,EAAeD,E,MCiBFE,EAAW,M,yBAkDdC,KAAAC,iBAAmB,KACzBD,KAAKE,mBAAqBC,EAAeH,KAAKI,mBAAoB,QAClEJ,KAAKK,UAAYF,EAAeH,KAAKM,WAAY,UACjDN,KAAKO,YAAcJ,EAAeH,KAAKQ,aAAc,YAAY,E,wBApC7B,M,eACT,M,iBACE,K,CAyC/B,MAAAC,GACE,OACEC,EAAA,OAAAC,IAAA,2CAAKC,MAAM,4EAA4EC,KAAK,QAE1FH,EAAA,OAAAC,IAAA,2CACEC,MAAO,CAAEE,KAAM,KAAM,WAAYd,KAAKE,oBACtCa,IAAMC,GAAahB,KAAKI,mBAAqBY,EAC7CH,KAAK,QAELH,EAAA,QAAAC,IAAA,2CAAMM,KAAK,OAAOC,aAAclB,KAAKC,oBAEvCS,EAAA,OAAAC,IAAA,2CAAKC,MAAM,iCAAiCC,KAAK,WAC/CH,EAAA,OAAAC,IAAA,2CAAKC,MAAM,2BAA2BC,KAAK,gBAEzCH,EAAA,MAAAC,IAAA,2CACEC,MAAM,kIACNC,KAAK,SAELH,EAAA,QAAAC,IAAA,8CAGFD,EAAA,OAAAC,IAAA,2CACEC,MAAO,CAAE,wCAAyC,KAAM,WAAYZ,KAAKK,WACzEU,IAAMC,GAAahB,KAAKM,WAAaU,EACrCH,KAAK,UAELH,EAAA,QAAAC,IAAA,2CAAMM,KAAK,SAASC,aAAclB,KAAKC,qBAI3CS,EAAA,OAAAC,IAAA,2CACEC,MAAO,CACL,2IACE,KACFO,QAASnB,KAAKO,aAEhBQ,IAAMC,GAAahB,KAAKQ,aAAeQ,EACvCH,KAAK,aAELH,EAAA,QAAAC,IAAA,2CAAMM,KAAK,YAAYC,aAAclB,KAAKC,qB","ignoreList":[]}