q2-tecton-elements 1.65.0 → 1.66.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (680) hide show
  1. package/dist/bundle-report.json +1904 -742
  2. package/dist/cjs/{action-sheet-CiK2Bap_.js → action-sheet-D71RSc-w.js} +5 -2
  3. package/dist/cjs/action-sheet-D71RSc-w.js.map +1 -0
  4. package/dist/cjs/component-DRAntnCA.js +47 -0
  5. package/dist/cjs/component-DRAntnCA.js.map +1 -0
  6. package/dist/cjs/loader.cjs.js +1 -1
  7. package/dist/cjs/q2-action-group.q2-resize-observer.entry.cjs.js.map +1 -1
  8. package/dist/cjs/q2-action-group_2.cjs.entry.js +121 -45
  9. package/dist/cjs/q2-action-group_2.cjs.entry.js.map +1 -1
  10. package/dist/cjs/q2-action-sheet.cjs.entry.js +9 -5
  11. package/dist/cjs/q2-action-sheet.cjs.entry.js.map +1 -1
  12. package/dist/cjs/q2-action-sheet.entry.cjs.js.map +1 -1
  13. package/dist/cjs/q2-avatar.cjs.entry.js +2 -2
  14. package/dist/cjs/q2-avatar.cjs.entry.js.map +1 -1
  15. package/dist/cjs/q2-avatar.entry.cjs.js.map +1 -1
  16. package/dist/cjs/q2-btn.q2-loading.entry.cjs.js.map +1 -1
  17. package/dist/cjs/q2-btn_2.cjs.entry.js +13 -4
  18. package/dist/cjs/q2-btn_2.cjs.entry.js.map +1 -1
  19. package/dist/cjs/q2-calendar.cjs.entry.js +3 -3
  20. package/dist/cjs/q2-calendar.cjs.entry.js.map +1 -1
  21. package/dist/cjs/q2-calendar.entry.cjs.js.map +1 -1
  22. package/dist/cjs/q2-card-image.cjs.entry.js +5 -5
  23. package/dist/cjs/q2-card-image.cjs.entry.js.map +1 -1
  24. package/dist/cjs/q2-card-image.entry.cjs.js.map +1 -1
  25. package/dist/cjs/q2-card.cjs.entry.js +1 -1
  26. package/dist/cjs/q2-card.cjs.entry.js.map +1 -1
  27. package/dist/cjs/q2-card.entry.cjs.js.map +1 -1
  28. package/dist/cjs/q2-carousel-pane.cjs.entry.js +7 -3
  29. package/dist/cjs/q2-carousel-pane.cjs.entry.js.map +1 -1
  30. package/dist/cjs/q2-carousel-pane.entry.cjs.js.map +1 -1
  31. package/dist/cjs/q2-carousel.cjs.entry.js +12 -2
  32. package/dist/cjs/q2-carousel.cjs.entry.js.map +1 -1
  33. package/dist/cjs/q2-carousel.entry.cjs.js.map +1 -1
  34. package/dist/cjs/q2-chart-area.cjs.entry.js +1 -1
  35. package/dist/cjs/q2-chart-bar.cjs.entry.js +1 -1
  36. package/dist/cjs/q2-chart-donut.cjs.entry.js +1 -1
  37. package/dist/cjs/q2-checkbox-group.cjs.entry.js +5 -1
  38. package/dist/cjs/q2-checkbox-group.cjs.entry.js.map +1 -1
  39. package/dist/cjs/q2-checkbox-group.entry.cjs.js.map +1 -1
  40. package/dist/cjs/q2-checkbox.cjs.entry.js +3 -4
  41. package/dist/cjs/q2-checkbox.cjs.entry.js.map +1 -1
  42. package/dist/cjs/q2-checkbox.entry.cjs.js.map +1 -1
  43. package/dist/cjs/q2-context.cjs.entry.js +1 -1
  44. package/dist/cjs/q2-context.cjs.entry.js.map +1 -1
  45. package/dist/cjs/q2-context.entry.cjs.js.map +1 -1
  46. package/dist/cjs/q2-currency.cjs.entry.js +1 -1
  47. package/dist/cjs/q2-data-table.cjs.entry.js +19 -9
  48. package/dist/cjs/q2-data-table.cjs.entry.js.map +1 -1
  49. package/dist/cjs/q2-data-table.entry.cjs.js.map +1 -1
  50. package/dist/cjs/q2-detail.cjs.entry.js +2 -2
  51. package/dist/cjs/q2-detail.cjs.entry.js.map +1 -1
  52. package/dist/cjs/q2-detail.entry.cjs.js.map +1 -1
  53. package/dist/cjs/q2-dropdown-item.cjs.entry.js +3 -1
  54. package/dist/cjs/q2-dropdown-item.cjs.entry.js.map +1 -1
  55. package/dist/cjs/q2-dropdown-item.entry.cjs.js.map +1 -1
  56. package/dist/cjs/q2-dropdown.cjs.entry.js +33 -8
  57. package/dist/cjs/q2-dropdown.cjs.entry.js.map +1 -1
  58. package/dist/cjs/q2-dropdown.entry.cjs.js.map +1 -1
  59. package/dist/cjs/q2-editable-field.cjs.entry.js +1 -1
  60. package/dist/cjs/q2-example.cjs.entry.js +1 -1
  61. package/dist/cjs/q2-file-picker.cjs.entry.js +2 -2
  62. package/dist/cjs/q2-file-picker.cjs.entry.js.map +1 -1
  63. package/dist/cjs/q2-file-picker.entry.cjs.js.map +1 -1
  64. package/dist/cjs/q2-form.cjs.entry.js +1 -1
  65. package/dist/cjs/q2-formatted-text.cjs.entry.js +1 -1
  66. package/dist/cjs/q2-grid-area.cjs.entry.js +9 -1
  67. package/dist/cjs/q2-grid-area.cjs.entry.js.map +1 -1
  68. package/dist/cjs/q2-grid-area.entry.cjs.js.map +1 -1
  69. package/dist/cjs/q2-icon.cjs.entry.js +6 -0
  70. package/dist/cjs/q2-icon.cjs.entry.js.map +1 -1
  71. package/dist/cjs/q2-icon.entry.cjs.js.map +1 -1
  72. package/dist/cjs/q2-input.cjs.entry.js +8 -6
  73. package/dist/cjs/q2-input.cjs.entry.js.map +1 -1
  74. package/dist/cjs/q2-input.entry.cjs.js.map +1 -1
  75. package/dist/cjs/q2-item.cjs.entry.js +17 -17
  76. package/dist/cjs/q2-item.cjs.entry.js.map +1 -1
  77. package/dist/cjs/q2-item.entry.cjs.js.map +1 -1
  78. package/dist/cjs/q2-legend.cjs.entry.js +1 -1
  79. package/dist/cjs/q2-link.q2-list.entry.cjs.js.map +1 -1
  80. package/dist/cjs/q2-link_2.cjs.entry.js +11 -7
  81. package/dist/cjs/q2-link_2.cjs.entry.js.map +1 -1
  82. package/dist/cjs/q2-message.cjs.entry.js +2 -2
  83. package/dist/cjs/q2-message.cjs.entry.js.map +1 -1
  84. package/dist/cjs/q2-message.entry.cjs.js.map +1 -1
  85. package/dist/cjs/q2-meter.cjs.entry.js +1 -1
  86. package/dist/cjs/q2-modal.cjs.entry.js +2 -2
  87. package/dist/cjs/q2-month-picker.cjs.entry.js +2 -2
  88. package/dist/cjs/q2-mutation-observer.cjs.entry.js +1 -1
  89. package/dist/cjs/q2-optgroup.cjs.entry.js +4 -2
  90. package/dist/cjs/q2-optgroup.cjs.entry.js.map +1 -1
  91. package/dist/cjs/q2-optgroup.entry.cjs.js.map +1 -1
  92. package/dist/cjs/q2-option-list.q2-popover.entry.cjs.js.map +1 -1
  93. package/dist/cjs/q2-option-list_2.cjs.entry.js +5 -3
  94. package/dist/cjs/q2-option-list_2.cjs.entry.js.map +1 -1
  95. package/dist/cjs/q2-option.cjs.entry.js +3 -1
  96. package/dist/cjs/q2-option.cjs.entry.js.map +1 -1
  97. package/dist/cjs/q2-option.entry.cjs.js.map +1 -1
  98. package/dist/cjs/q2-pagination.cjs.entry.js +10 -12
  99. package/dist/cjs/q2-pagination.cjs.entry.js.map +1 -1
  100. package/dist/cjs/q2-pagination.entry.cjs.js.map +1 -1
  101. package/dist/cjs/q2-pill.cjs.entry.js +2 -2
  102. package/dist/cjs/q2-radio.cjs.entry.js +2 -2
  103. package/dist/cjs/q2-radio.cjs.entry.js.map +1 -1
  104. package/dist/cjs/q2-radio.entry.cjs.js.map +1 -1
  105. package/dist/cjs/q2-relative-time.cjs.entry.js +1 -1
  106. package/dist/cjs/q2-section-container.cjs.entry.js +2 -0
  107. package/dist/cjs/q2-section-container.cjs.entry.js.map +1 -1
  108. package/dist/cjs/q2-section-container.entry.cjs.js.map +1 -1
  109. package/dist/cjs/q2-section.cjs.entry.js +2 -2
  110. package/dist/cjs/q2-select.cjs.entry.js +7 -3
  111. package/dist/cjs/q2-select.cjs.entry.js.map +1 -1
  112. package/dist/cjs/q2-select.entry.cjs.js.map +1 -1
  113. package/dist/cjs/q2-stepper-pane.cjs.entry.js +3 -1
  114. package/dist/cjs/q2-stepper-pane.cjs.entry.js.map +1 -1
  115. package/dist/cjs/q2-stepper-pane.entry.cjs.js.map +1 -1
  116. package/dist/cjs/q2-stepper-vertical.cjs.entry.js +1 -1
  117. package/dist/cjs/q2-stepper.cjs.entry.js +6 -2
  118. package/dist/cjs/q2-stepper.cjs.entry.js.map +1 -1
  119. package/dist/cjs/q2-stepper.entry.cjs.js.map +1 -1
  120. package/dist/cjs/q2-tab-container.cjs.entry.js +5 -1
  121. package/dist/cjs/q2-tab-container.cjs.entry.js.map +1 -1
  122. package/dist/cjs/q2-tab-container.entry.cjs.js.map +1 -1
  123. package/dist/cjs/q2-tab-pane.cjs.entry.js +8 -1
  124. package/dist/cjs/q2-tab-pane.cjs.entry.js.map +1 -1
  125. package/dist/cjs/q2-tab-pane.entry.cjs.js.map +1 -1
  126. package/dist/cjs/q2-tag.cjs.entry.js +3 -3
  127. package/dist/cjs/q2-tag.cjs.entry.js.map +1 -1
  128. package/dist/cjs/q2-tag.entry.cjs.js.map +1 -1
  129. package/dist/cjs/q2-tecton-elements.cjs.js +1 -1
  130. package/dist/cjs/q2-textarea.cjs.entry.js +2 -2
  131. package/dist/cjs/q2-textarea.cjs.entry.js.map +1 -1
  132. package/dist/cjs/q2-textarea.entry.cjs.js.map +1 -1
  133. package/dist/cjs/q2-toast.cjs.entry.js +192 -0
  134. package/dist/cjs/q2-toast.cjs.entry.js.map +1 -0
  135. package/dist/cjs/q2-toast.entry.cjs.js.map +1 -0
  136. package/dist/cjs/{sanitize-html-string-DPqrzfM9.js → sanitize-html-string-C2iwHNz5.js} +30 -6
  137. package/dist/cjs/sanitize-html-string-C2iwHNz5.js.map +1 -0
  138. package/dist/cjs/tecton-tab-pane.cjs.entry.js +4 -2
  139. package/dist/cjs/tecton-tab-pane.cjs.entry.js.map +1 -1
  140. package/dist/cjs/tecton-tab-pane.entry.cjs.js.map +1 -1
  141. package/dist/collection/collection-manifest.json +1 -0
  142. package/dist/collection/components/q2-action-group/q2-action-group.css +11 -4
  143. package/dist/collection/components/q2-action-group/q2-action-group.js +121 -45
  144. package/dist/collection/components/q2-action-group/q2-action-group.js.map +1 -1
  145. package/dist/collection/components/q2-action-sheet/q2-action-sheet.css +8 -0
  146. package/dist/collection/components/q2-action-sheet/q2-action-sheet.js +9 -5
  147. package/dist/collection/components/q2-action-sheet/q2-action-sheet.js.map +1 -1
  148. package/dist/collection/components/q2-avatar/q2-avatar.css +3 -0
  149. package/dist/collection/components/q2-avatar/q2-avatar.js +1 -1
  150. package/dist/collection/components/q2-btn/q2-btn.css +9 -1
  151. package/dist/collection/components/q2-btn/q2-btn.js +1 -1
  152. package/dist/collection/components/q2-btn/q2-btn.js.map +1 -1
  153. package/dist/collection/components/q2-calendar/q2-calendar.css +5 -1
  154. package/dist/collection/components/q2-calendar/q2-calendar.js +2 -2
  155. package/dist/collection/components/q2-calendar/q2-calendar.js.map +1 -1
  156. package/dist/collection/components/q2-calendar/q2-month-picker.js +2 -2
  157. package/dist/collection/components/q2-card/q2-card.css +1 -0
  158. package/dist/collection/components/q2-card-image/q2-card-image.js +6 -6
  159. package/dist/collection/components/q2-card-image/q2-card-image.js.map +1 -1
  160. package/dist/collection/components/q2-carousel/q2-carousel.css +1 -1
  161. package/dist/collection/components/q2-carousel/q2-carousel.js +11 -1
  162. package/dist/collection/components/q2-carousel/q2-carousel.js.map +1 -1
  163. package/dist/collection/components/q2-carousel-pane/q2-carousel-pane.css +11 -1
  164. package/dist/collection/components/q2-carousel-pane/q2-carousel-pane.js +6 -2
  165. package/dist/collection/components/q2-carousel-pane/q2-carousel-pane.js.map +1 -1
  166. package/dist/collection/components/q2-chart-area/q2-chart-area.js +1 -1
  167. package/dist/collection/components/q2-chart-bar/q2-chart-bar.js +1 -1
  168. package/dist/collection/components/q2-chart-donut/q2-chart-donut.js +1 -1
  169. package/dist/collection/components/q2-checkbox/q2-checkbox.css +135 -14
  170. package/dist/collection/components/q2-checkbox/q2-checkbox.js +2 -8
  171. package/dist/collection/components/q2-checkbox/q2-checkbox.js.map +1 -1
  172. package/dist/collection/components/q2-checkbox-group/q2-checkbox-group.js +5 -1
  173. package/dist/collection/components/q2-checkbox-group/q2-checkbox-group.js.map +1 -1
  174. package/dist/collection/components/q2-context/q2-context.js +1 -1
  175. package/dist/collection/components/q2-context/q2-context.js.map +1 -1
  176. package/dist/collection/components/q2-currency/q2-currency.js +1 -1
  177. package/dist/collection/components/q2-data-table/q2-data-table.css +3 -0
  178. package/dist/collection/components/q2-data-table/q2-data-table.js +53 -20
  179. package/dist/collection/components/q2-data-table/q2-data-table.js.map +1 -1
  180. package/dist/collection/components/q2-detail/q2-detail.css +6 -0
  181. package/dist/collection/components/q2-detail/q2-detail.js +1 -1
  182. package/dist/collection/components/q2-dropdown/q2-dropdown.css +17 -0
  183. package/dist/collection/components/q2-dropdown/q2-dropdown.js +75 -8
  184. package/dist/collection/components/q2-dropdown/q2-dropdown.js.map +1 -1
  185. package/dist/collection/components/q2-dropdown-item/q2-dropdown-item.css +1 -0
  186. package/dist/collection/components/q2-dropdown-item/q2-dropdown-item.js +2 -0
  187. package/dist/collection/components/q2-dropdown-item/q2-dropdown-item.js.map +1 -1
  188. package/dist/collection/components/q2-editable-field/q2-editable-field.js +1 -1
  189. package/dist/collection/components/q2-example/q2-example.js +1 -1
  190. package/dist/collection/components/q2-file-picker/q2-file-picker.css +4 -1
  191. package/dist/collection/components/q2-file-picker/q2-file-picker.js +4 -4
  192. package/dist/collection/components/q2-file-picker/q2-file-picker.js.map +1 -1
  193. package/dist/collection/components/q2-form/q2-form.js +1 -1
  194. package/dist/collection/components/q2-formatted-text/q2-formatted-text.js +1 -1
  195. package/dist/collection/components/q2-grid/q2-grid.js +30 -30
  196. package/dist/collection/components/q2-grid-area/q2-grid-area.js +51 -43
  197. package/dist/collection/components/q2-grid-area/q2-grid-area.js.map +1 -1
  198. package/dist/collection/components/q2-icon/assets/brand.symbol.svg +1 -1
  199. package/dist/collection/components/q2-icon/assets/browsersos.symbol.svg +1 -1
  200. package/dist/collection/components/q2-icon/assets/cards.symbol.svg +1 -1
  201. package/dist/collection/components/q2-icon/assets/communication.symbol.svg +1 -1
  202. package/dist/collection/components/q2-icon/assets/currencies.symbol.svg +1 -1
  203. package/dist/collection/components/q2-icon/assets/devices.symbol.svg +1 -1
  204. package/dist/collection/components/q2-icon/assets/filetypes.symbol.svg +1 -1
  205. package/dist/collection/components/q2-icon/assets/gestures.symbol.svg +1 -1
  206. package/dist/collection/components/q2-icon/assets/icon-list.json +1 -1
  207. package/dist/collection/components/q2-icon/assets/icon-map.json +1 -1
  208. package/dist/collection/components/q2-icon/assets/legacy.symbol.svg +1 -1
  209. package/dist/collection/components/q2-icon/assets/mobile.symbol.svg +1 -1
  210. package/dist/collection/components/q2-icon/assets/standard.symbol.svg +1 -1
  211. package/dist/collection/components/q2-input/formatting/phone.js +4 -2
  212. package/dist/collection/components/q2-input/formatting/phone.js.map +1 -1
  213. package/dist/collection/components/q2-input/q2-input.css +3 -0
  214. package/dist/collection/components/q2-input/q2-input.js +6 -6
  215. package/dist/collection/components/q2-input/q2-input.js.map +1 -1
  216. package/dist/collection/components/q2-item/q2-item.css +3 -0
  217. package/dist/collection/components/q2-item/q2-item.js +19 -18
  218. package/dist/collection/components/q2-item/q2-item.js.map +1 -1
  219. package/dist/collection/components/q2-legend/q2-legend.js +1 -1
  220. package/dist/collection/components/q2-link/q2-link.css +53 -1
  221. package/dist/collection/components/q2-link/q2-link.js +50 -8
  222. package/dist/collection/components/q2-link/q2-link.js.map +1 -1
  223. package/dist/collection/components/q2-list/q2-list.js +1 -1
  224. package/dist/collection/components/q2-loading/q2-loading.css +1 -1
  225. package/dist/collection/components/q2-loading/q2-loading.js +10 -1
  226. package/dist/collection/components/q2-loading/q2-loading.js.map +1 -1
  227. package/dist/collection/components/q2-message/q2-message.css +1 -0
  228. package/dist/collection/components/q2-message/q2-message.js +1 -1
  229. package/dist/collection/components/q2-meter/q2-meter.js +1 -1
  230. package/dist/collection/components/q2-modal/q2-modal.js +1 -1
  231. package/dist/collection/components/q2-mutation-observer/q2-mutation-observer.js +1 -1
  232. package/dist/collection/components/q2-optgroup/q2-optgroup.css +6 -4
  233. package/dist/collection/components/q2-optgroup/q2-optgroup.js +3 -1
  234. package/dist/collection/components/q2-optgroup/q2-optgroup.js.map +1 -1
  235. package/dist/collection/components/q2-option/q2-option.css +5 -0
  236. package/dist/collection/components/q2-option/q2-option.js +2 -0
  237. package/dist/collection/components/q2-option/q2-option.js.map +1 -1
  238. package/dist/collection/components/q2-option-list/q2-option-list.js +8 -6
  239. package/dist/collection/components/q2-option-list/q2-option-list.js.map +1 -1
  240. package/dist/collection/components/q2-pagination/q2-pagination.css +3 -0
  241. package/dist/collection/components/q2-pagination/q2-pagination.js +20 -17
  242. package/dist/collection/components/q2-pagination/q2-pagination.js.map +1 -1
  243. package/dist/collection/components/q2-pill/q2-pill.js +1 -1
  244. package/dist/collection/components/q2-popover/q2-popover.css +1 -1
  245. package/dist/collection/components/q2-popover/q2-popover.js +1 -1
  246. package/dist/collection/components/q2-radio/q2-radio.css +85 -35
  247. package/dist/collection/components/q2-radio/q2-radio.js +1 -1
  248. package/dist/collection/components/q2-radio/q2-radio.js.map +1 -1
  249. package/dist/collection/components/q2-relative-time/q2-relative-time.js +1 -1
  250. package/dist/collection/components/q2-resize-observer/q2-resize-observer.js +1 -1
  251. package/dist/collection/components/q2-section/q2-section.js +2 -2
  252. package/dist/collection/components/q2-section-container/q2-section-container.js +2 -0
  253. package/dist/collection/components/q2-section-container/q2-section-container.js.map +1 -1
  254. package/dist/collection/components/q2-select/q2-select.js +6 -5
  255. package/dist/collection/components/q2-select/q2-select.js.map +1 -1
  256. package/dist/collection/components/q2-stepper/q2-stepper.css +1 -3
  257. package/dist/collection/components/q2-stepper/q2-stepper.js +6 -2
  258. package/dist/collection/components/q2-stepper/q2-stepper.js.map +1 -1
  259. package/dist/collection/components/q2-stepper-pane/q2-stepper-pane.js +7 -5
  260. package/dist/collection/components/q2-stepper-pane/q2-stepper-pane.js.map +1 -1
  261. package/dist/collection/components/q2-stepper-vertical/q2-stepper-vertical.js +1 -1
  262. package/dist/collection/components/q2-tab-container/q2-tab-container.js +5 -1
  263. package/dist/collection/components/q2-tab-container/q2-tab-container.js.map +1 -1
  264. package/dist/collection/components/q2-tab-pane/q2-tab-pane.js +8 -1
  265. package/dist/collection/components/q2-tab-pane/q2-tab-pane.js.map +1 -1
  266. package/dist/collection/components/q2-tag/q2-tag.css +8 -0
  267. package/dist/collection/components/q2-tag/q2-tag.js +1 -1
  268. package/dist/collection/components/q2-textarea/q2-textarea.css +2 -1
  269. package/dist/collection/components/q2-textarea/q2-textarea.js +1 -1
  270. package/dist/collection/components/q2-toast/q2-toast.css +230 -0
  271. package/dist/collection/components/q2-toast/q2-toast.js +452 -0
  272. package/dist/collection/components/q2-toast/q2-toast.js.map +1 -0
  273. package/dist/collection/components/tecton-tab-pane/tecton-tab-pane.js +4 -2
  274. package/dist/collection/components/tecton-tab-pane/tecton-tab-pane.js.map +1 -1
  275. package/dist/collection/utils/action-sheet.js +3 -0
  276. package/dist/collection/utils/action-sheet.js.map +1 -1
  277. package/dist/collection/utils/component.js +38 -0
  278. package/dist/collection/utils/component.js.map +1 -0
  279. package/dist/collection/utils/helpers.js +6 -1
  280. package/dist/collection/utils/helpers.js.map +1 -1
  281. package/dist/collection/utils/sanitize-html-string.js +6 -0
  282. package/dist/collection/utils/sanitize-html-string.js.map +1 -1
  283. package/dist/components/action-sheet.js +3 -0
  284. package/dist/components/action-sheet.js.map +1 -1
  285. package/dist/components/component.js +42 -0
  286. package/dist/components/component.js.map +1 -0
  287. package/dist/components/index.js +2 -0
  288. package/dist/components/index.js.map +1 -1
  289. package/dist/components/q2-action-group2.js +121 -45
  290. package/dist/components/q2-action-group2.js.map +1 -1
  291. package/dist/components/q2-action-sheet.js +9 -5
  292. package/dist/components/q2-action-sheet.js.map +1 -1
  293. package/dist/components/q2-avatar2.js +2 -2
  294. package/dist/components/q2-avatar2.js.map +1 -1
  295. package/dist/components/q2-btn2.js +2 -2
  296. package/dist/components/q2-btn2.js.map +1 -1
  297. package/dist/components/q2-calendar.js +3 -3
  298. package/dist/components/q2-calendar.js.map +1 -1
  299. package/dist/components/q2-card-image.js +6 -6
  300. package/dist/components/q2-card-image.js.map +1 -1
  301. package/dist/components/q2-card.js +1 -1
  302. package/dist/components/q2-card.js.map +1 -1
  303. package/dist/components/q2-carousel-pane.js +7 -3
  304. package/dist/components/q2-carousel-pane.js.map +1 -1
  305. package/dist/components/q2-carousel.js +12 -2
  306. package/dist/components/q2-carousel.js.map +1 -1
  307. package/dist/components/q2-chart-area.js +1 -1
  308. package/dist/components/q2-chart-bar.js +1 -1
  309. package/dist/components/q2-chart-donut.js +1 -1
  310. package/dist/components/q2-checkbox-group.js +5 -1
  311. package/dist/components/q2-checkbox-group.js.map +1 -1
  312. package/dist/components/q2-checkbox2.js +3 -4
  313. package/dist/components/q2-checkbox2.js.map +1 -1
  314. package/dist/components/q2-context.js +1 -1
  315. package/dist/components/q2-context.js.map +1 -1
  316. package/dist/components/q2-currency.js +1 -1
  317. package/dist/components/q2-data-table.js +20 -9
  318. package/dist/components/q2-data-table.js.map +1 -1
  319. package/dist/components/q2-detail.js +2 -2
  320. package/dist/components/q2-detail.js.map +1 -1
  321. package/dist/components/q2-dropdown-item2.js +3 -1
  322. package/dist/components/q2-dropdown-item2.js.map +1 -1
  323. package/dist/components/q2-dropdown.js +34 -7
  324. package/dist/components/q2-dropdown.js.map +1 -1
  325. package/dist/components/q2-editable-field.js +1 -1
  326. package/dist/components/q2-example.js +1 -1
  327. package/dist/components/q2-file-picker.js +2 -2
  328. package/dist/components/q2-file-picker.js.map +1 -1
  329. package/dist/components/q2-form.js +1 -1
  330. package/dist/components/q2-formatted-text.js +1 -1
  331. package/dist/components/q2-grid-area.js +9 -1
  332. package/dist/components/q2-grid-area.js.map +1 -1
  333. package/dist/components/q2-icon2.js +6 -0
  334. package/dist/components/q2-icon2.js.map +1 -1
  335. package/dist/components/q2-input2.js +8 -6
  336. package/dist/components/q2-input2.js.map +1 -1
  337. package/dist/components/q2-item2.js +17 -17
  338. package/dist/components/q2-item2.js.map +1 -1
  339. package/dist/components/q2-legend2.js +1 -1
  340. package/dist/components/q2-link2.js +12 -6
  341. package/dist/components/q2-link2.js.map +1 -1
  342. package/dist/components/q2-list2.js +1 -1
  343. package/dist/components/q2-loading2.js +11 -2
  344. package/dist/components/q2-loading2.js.map +1 -1
  345. package/dist/components/q2-message2.js +2 -2
  346. package/dist/components/q2-message2.js.map +1 -1
  347. package/dist/components/q2-meter.js +1 -1
  348. package/dist/components/q2-modal.js +1 -1
  349. package/dist/components/q2-month-picker.js +2 -2
  350. package/dist/components/q2-mutation-observer.js +1 -1
  351. package/dist/components/q2-optgroup2.js +4 -2
  352. package/dist/components/q2-optgroup2.js.map +1 -1
  353. package/dist/components/q2-option-list2.js +3 -1
  354. package/dist/components/q2-option-list2.js.map +1 -1
  355. package/dist/components/q2-option2.js +3 -1
  356. package/dist/components/q2-option2.js.map +1 -1
  357. package/dist/components/q2-pagination.js +11 -13
  358. package/dist/components/q2-pagination.js.map +1 -1
  359. package/dist/components/q2-pill.js +1 -1
  360. package/dist/components/q2-popover2.js +2 -2
  361. package/dist/components/q2-popover2.js.map +1 -1
  362. package/dist/components/q2-radio.js +2 -2
  363. package/dist/components/q2-radio.js.map +1 -1
  364. package/dist/components/q2-relative-time.js +1 -1
  365. package/dist/components/q2-resize-observer2.js +1 -1
  366. package/dist/components/q2-section-container.js +2 -0
  367. package/dist/components/q2-section-container.js.map +1 -1
  368. package/dist/components/q2-section.js +2 -2
  369. package/dist/components/q2-select2.js +6 -2
  370. package/dist/components/q2-select2.js.map +1 -1
  371. package/dist/components/q2-stepper-pane.js +3 -1
  372. package/dist/components/q2-stepper-pane.js.map +1 -1
  373. package/dist/components/q2-stepper-vertical.js +1 -1
  374. package/dist/components/q2-stepper.js +7 -3
  375. package/dist/components/q2-stepper.js.map +1 -1
  376. package/dist/components/q2-tab-container.js +5 -1
  377. package/dist/components/q2-tab-container.js.map +1 -1
  378. package/dist/components/q2-tab-pane.js +8 -1
  379. package/dist/components/q2-tab-pane.js.map +1 -1
  380. package/dist/components/q2-tag.js +2 -2
  381. package/dist/components/q2-tag.js.map +1 -1
  382. package/dist/components/q2-textarea.js +2 -2
  383. package/dist/components/q2-textarea.js.map +1 -1
  384. package/dist/components/q2-toast.d.ts +11 -0
  385. package/dist/components/q2-toast.js +233 -0
  386. package/dist/components/q2-toast.js.map +1 -0
  387. package/dist/components/sanitize-html-string.js +28 -5
  388. package/dist/components/sanitize-html-string.js.map +1 -1
  389. package/dist/components/tecton-tab-pane.js +4 -2
  390. package/dist/components/tecton-tab-pane.js.map +1 -1
  391. package/dist/esm/{action-sheet-WwoBwnIp.js → action-sheet-B7adb3xs.js} +5 -2
  392. package/dist/esm/action-sheet-B7adb3xs.js.map +1 -0
  393. package/dist/esm/component-DVxzK3WH.js +42 -0
  394. package/dist/esm/component-DVxzK3WH.js.map +1 -0
  395. package/dist/esm/loader.js +1 -1
  396. package/dist/esm/q2-action-group.q2-resize-observer.entry.js.map +1 -1
  397. package/dist/esm/q2-action-group_2.entry.js +121 -45
  398. package/dist/esm/q2-action-group_2.entry.js.map +1 -1
  399. package/dist/esm/q2-action-sheet.entry.js +9 -5
  400. package/dist/esm/q2-action-sheet.entry.js.map +1 -1
  401. package/dist/esm/q2-avatar.entry.js +2 -2
  402. package/dist/esm/q2-avatar.entry.js.map +1 -1
  403. package/dist/esm/q2-btn.q2-loading.entry.js.map +1 -1
  404. package/dist/esm/q2-btn_2.entry.js +13 -4
  405. package/dist/esm/q2-btn_2.entry.js.map +1 -1
  406. package/dist/esm/q2-calendar.entry.js +3 -3
  407. package/dist/esm/q2-calendar.entry.js.map +1 -1
  408. package/dist/esm/q2-card-image.entry.js +6 -6
  409. package/dist/esm/q2-card-image.entry.js.map +1 -1
  410. package/dist/esm/q2-card.entry.js +1 -1
  411. package/dist/esm/q2-card.entry.js.map +1 -1
  412. package/dist/esm/q2-carousel-pane.entry.js +7 -3
  413. package/dist/esm/q2-carousel-pane.entry.js.map +1 -1
  414. package/dist/esm/q2-carousel.entry.js +12 -2
  415. package/dist/esm/q2-carousel.entry.js.map +1 -1
  416. package/dist/esm/q2-chart-area.entry.js +1 -1
  417. package/dist/esm/q2-chart-bar.entry.js +1 -1
  418. package/dist/esm/q2-chart-donut.entry.js +1 -1
  419. package/dist/esm/q2-checkbox-group.entry.js +5 -1
  420. package/dist/esm/q2-checkbox-group.entry.js.map +1 -1
  421. package/dist/esm/q2-checkbox.entry.js +3 -4
  422. package/dist/esm/q2-checkbox.entry.js.map +1 -1
  423. package/dist/esm/q2-context.entry.js +1 -1
  424. package/dist/esm/q2-context.entry.js.map +1 -1
  425. package/dist/esm/q2-currency.entry.js +1 -1
  426. package/dist/esm/q2-data-table.entry.js +19 -9
  427. package/dist/esm/q2-data-table.entry.js.map +1 -1
  428. package/dist/esm/q2-detail.entry.js +2 -2
  429. package/dist/esm/q2-detail.entry.js.map +1 -1
  430. package/dist/esm/q2-dropdown-item.entry.js +3 -1
  431. package/dist/esm/q2-dropdown-item.entry.js.map +1 -1
  432. package/dist/esm/q2-dropdown.entry.js +33 -8
  433. package/dist/esm/q2-dropdown.entry.js.map +1 -1
  434. package/dist/esm/q2-editable-field.entry.js +1 -1
  435. package/dist/esm/q2-example.entry.js +1 -1
  436. package/dist/esm/q2-file-picker.entry.js +2 -2
  437. package/dist/esm/q2-file-picker.entry.js.map +1 -1
  438. package/dist/esm/q2-form.entry.js +1 -1
  439. package/dist/esm/q2-formatted-text.entry.js +1 -1
  440. package/dist/esm/q2-grid-area.entry.js +10 -2
  441. package/dist/esm/q2-grid-area.entry.js.map +1 -1
  442. package/dist/esm/q2-icon.entry.js +6 -0
  443. package/dist/esm/q2-icon.entry.js.map +1 -1
  444. package/dist/esm/q2-input.entry.js +8 -6
  445. package/dist/esm/q2-input.entry.js.map +1 -1
  446. package/dist/esm/q2-item.entry.js +17 -17
  447. package/dist/esm/q2-item.entry.js.map +1 -1
  448. package/dist/esm/q2-legend.entry.js +1 -1
  449. package/dist/esm/q2-link.q2-list.entry.js.map +1 -1
  450. package/dist/esm/q2-link_2.entry.js +11 -7
  451. package/dist/esm/q2-link_2.entry.js.map +1 -1
  452. package/dist/esm/q2-message.entry.js +2 -2
  453. package/dist/esm/q2-message.entry.js.map +1 -1
  454. package/dist/esm/q2-meter.entry.js +1 -1
  455. package/dist/esm/q2-modal.entry.js +2 -2
  456. package/dist/esm/q2-month-picker.entry.js +2 -2
  457. package/dist/esm/q2-mutation-observer.entry.js +1 -1
  458. package/dist/esm/q2-optgroup.entry.js +4 -2
  459. package/dist/esm/q2-optgroup.entry.js.map +1 -1
  460. package/dist/esm/q2-option-list.q2-popover.entry.js.map +1 -1
  461. package/dist/esm/q2-option-list_2.entry.js +5 -3
  462. package/dist/esm/q2-option-list_2.entry.js.map +1 -1
  463. package/dist/esm/q2-option.entry.js +3 -1
  464. package/dist/esm/q2-option.entry.js.map +1 -1
  465. package/dist/esm/q2-pagination.entry.js +10 -12
  466. package/dist/esm/q2-pagination.entry.js.map +1 -1
  467. package/dist/esm/q2-pill.entry.js +2 -2
  468. package/dist/esm/q2-radio.entry.js +2 -2
  469. package/dist/esm/q2-radio.entry.js.map +1 -1
  470. package/dist/esm/q2-relative-time.entry.js +1 -1
  471. package/dist/esm/q2-section-container.entry.js +2 -0
  472. package/dist/esm/q2-section-container.entry.js.map +1 -1
  473. package/dist/esm/q2-section.entry.js +2 -2
  474. package/dist/esm/q2-select.entry.js +7 -3
  475. package/dist/esm/q2-select.entry.js.map +1 -1
  476. package/dist/esm/q2-stepper-pane.entry.js +3 -1
  477. package/dist/esm/q2-stepper-pane.entry.js.map +1 -1
  478. package/dist/esm/q2-stepper-vertical.entry.js +1 -1
  479. package/dist/esm/q2-stepper.entry.js +7 -3
  480. package/dist/esm/q2-stepper.entry.js.map +1 -1
  481. package/dist/esm/q2-tab-container.entry.js +5 -1
  482. package/dist/esm/q2-tab-container.entry.js.map +1 -1
  483. package/dist/esm/q2-tab-pane.entry.js +9 -2
  484. package/dist/esm/q2-tab-pane.entry.js.map +1 -1
  485. package/dist/esm/q2-tag.entry.js +3 -3
  486. package/dist/esm/q2-tag.entry.js.map +1 -1
  487. package/dist/esm/q2-tecton-elements.js +1 -1
  488. package/dist/esm/q2-textarea.entry.js +2 -2
  489. package/dist/esm/q2-textarea.entry.js.map +1 -1
  490. package/dist/esm/q2-toast.entry.js +190 -0
  491. package/dist/esm/q2-toast.entry.js.map +1 -0
  492. package/dist/esm/{sanitize-html-string-DOVERJq5.js → sanitize-html-string-BPwFpYg-.js} +30 -7
  493. package/dist/esm/sanitize-html-string-BPwFpYg-.js.map +1 -0
  494. package/dist/esm/tecton-tab-pane.entry.js +4 -2
  495. package/dist/esm/tecton-tab-pane.entry.js.map +1 -1
  496. package/dist/jest.e2e-coverage.js +25 -0
  497. package/dist/jest.e2e-coverage.js.map +1 -0
  498. package/dist/q2-tecton-elements/{action-sheet-WwoBwnIp.js → action-sheet-B7adb3xs.js} +19 -14
  499. package/dist/q2-tecton-elements/action-sheet-B7adb3xs.js.map +1 -0
  500. package/dist/q2-tecton-elements/assets/brand.symbol.svg +1 -1
  501. package/dist/q2-tecton-elements/assets/browsersos.symbol.svg +1 -1
  502. package/dist/q2-tecton-elements/assets/cards.symbol.svg +1 -1
  503. package/dist/q2-tecton-elements/assets/communication.symbol.svg +1 -1
  504. package/dist/q2-tecton-elements/assets/currencies.symbol.svg +1 -1
  505. package/dist/q2-tecton-elements/assets/devices.symbol.svg +1 -1
  506. package/dist/q2-tecton-elements/assets/filetypes.symbol.svg +1 -1
  507. package/dist/q2-tecton-elements/assets/gestures.symbol.svg +1 -1
  508. package/dist/q2-tecton-elements/assets/icon-list.json +1 -1
  509. package/dist/q2-tecton-elements/assets/icon-map.json +1 -1
  510. package/dist/q2-tecton-elements/assets/legacy.symbol.svg +1 -1
  511. package/dist/q2-tecton-elements/assets/mobile.symbol.svg +1 -1
  512. package/dist/q2-tecton-elements/assets/standard.symbol.svg +1 -1
  513. package/dist/q2-tecton-elements/component-DVxzK3WH.js +40 -0
  514. package/dist/q2-tecton-elements/component-DVxzK3WH.js.map +1 -0
  515. package/dist/q2-tecton-elements/q2-action-group.q2-resize-observer.entry.esm.js.map +1 -1
  516. package/dist/q2-tecton-elements/q2-action-group_2.entry.js +131 -63
  517. package/dist/q2-tecton-elements/q2-action-group_2.entry.js.map +1 -1
  518. package/dist/q2-tecton-elements/q2-action-sheet.entry.esm.js.map +1 -1
  519. package/dist/q2-tecton-elements/q2-action-sheet.entry.js +79 -75
  520. package/dist/q2-tecton-elements/q2-action-sheet.entry.js.map +1 -1
  521. package/dist/q2-tecton-elements/q2-avatar.entry.esm.js.map +1 -1
  522. package/dist/q2-tecton-elements/q2-avatar.entry.js +7 -7
  523. package/dist/q2-tecton-elements/q2-avatar.entry.js.map +1 -1
  524. package/dist/q2-tecton-elements/q2-btn.q2-loading.entry.esm.js.map +1 -1
  525. package/dist/q2-tecton-elements/q2-btn_2.entry.js +11 -4
  526. package/dist/q2-tecton-elements/q2-btn_2.entry.js.map +1 -1
  527. package/dist/q2-tecton-elements/q2-calendar.entry.esm.js.map +1 -1
  528. package/dist/q2-tecton-elements/q2-calendar.entry.js +4 -3
  529. package/dist/q2-tecton-elements/q2-calendar.entry.js.map +1 -1
  530. package/dist/q2-tecton-elements/q2-card-image.entry.esm.js.map +1 -1
  531. package/dist/q2-tecton-elements/q2-card-image.entry.js +11 -11
  532. package/dist/q2-tecton-elements/q2-card-image.entry.js.map +1 -1
  533. package/dist/q2-tecton-elements/q2-card.entry.esm.js.map +1 -1
  534. package/dist/q2-tecton-elements/q2-card.entry.js +1 -1
  535. package/dist/q2-tecton-elements/q2-card.entry.js.map +1 -1
  536. package/dist/q2-tecton-elements/q2-carousel-pane.entry.esm.js.map +1 -1
  537. package/dist/q2-tecton-elements/q2-carousel-pane.entry.js +25 -20
  538. package/dist/q2-tecton-elements/q2-carousel-pane.entry.js.map +1 -1
  539. package/dist/q2-tecton-elements/q2-carousel.entry.esm.js.map +1 -1
  540. package/dist/q2-tecton-elements/q2-carousel.entry.js +79 -67
  541. package/dist/q2-tecton-elements/q2-carousel.entry.js.map +1 -1
  542. package/dist/q2-tecton-elements/q2-chart-area.entry.js +2 -2
  543. package/dist/q2-tecton-elements/q2-chart-bar.entry.js +2 -2
  544. package/dist/q2-tecton-elements/q2-chart-donut.entry.js +9 -9
  545. package/dist/q2-tecton-elements/q2-checkbox-group.entry.esm.js.map +1 -1
  546. package/dist/q2-tecton-elements/q2-checkbox-group.entry.js +20 -15
  547. package/dist/q2-tecton-elements/q2-checkbox-group.entry.js.map +1 -1
  548. package/dist/q2-tecton-elements/q2-checkbox.entry.esm.js.map +1 -1
  549. package/dist/q2-tecton-elements/q2-checkbox.entry.js +70 -71
  550. package/dist/q2-tecton-elements/q2-checkbox.entry.js.map +1 -1
  551. package/dist/q2-tecton-elements/q2-context.entry.esm.js.map +1 -1
  552. package/dist/q2-tecton-elements/q2-context.entry.js +12 -12
  553. package/dist/q2-tecton-elements/q2-context.entry.js.map +1 -1
  554. package/dist/q2-tecton-elements/q2-currency.entry.js +8 -8
  555. package/dist/q2-tecton-elements/q2-data-table.entry.esm.js.map +1 -1
  556. package/dist/q2-tecton-elements/q2-data-table.entry.js +40 -27
  557. package/dist/q2-tecton-elements/q2-data-table.entry.js.map +1 -1
  558. package/dist/q2-tecton-elements/q2-detail.entry.esm.js.map +1 -1
  559. package/dist/q2-tecton-elements/q2-detail.entry.js +10 -10
  560. package/dist/q2-tecton-elements/q2-detail.entry.js.map +1 -1
  561. package/dist/q2-tecton-elements/q2-dropdown-item.entry.esm.js.map +1 -1
  562. package/dist/q2-tecton-elements/q2-dropdown-item.entry.js +11 -8
  563. package/dist/q2-tecton-elements/q2-dropdown-item.entry.js.map +1 -1
  564. package/dist/q2-tecton-elements/q2-dropdown.entry.esm.js.map +1 -1
  565. package/dist/q2-tecton-elements/q2-dropdown.entry.js +113 -85
  566. package/dist/q2-tecton-elements/q2-dropdown.entry.js.map +1 -1
  567. package/dist/q2-tecton-elements/q2-editable-field.entry.js +1 -1
  568. package/dist/q2-tecton-elements/q2-example.entry.js +1 -1
  569. package/dist/q2-tecton-elements/q2-file-picker.entry.esm.js.map +1 -1
  570. package/dist/q2-tecton-elements/q2-file-picker.entry.js +3 -2
  571. package/dist/q2-tecton-elements/q2-file-picker.entry.js.map +1 -1
  572. package/dist/q2-tecton-elements/q2-form.entry.js +7 -7
  573. package/dist/q2-tecton-elements/q2-formatted-text.entry.js +2 -2
  574. package/dist/q2-tecton-elements/q2-grid-area.entry.esm.js.map +1 -1
  575. package/dist/q2-tecton-elements/q2-grid-area.entry.js +18 -7
  576. package/dist/q2-tecton-elements/q2-grid-area.entry.js.map +1 -1
  577. package/dist/q2-tecton-elements/q2-icon.entry.esm.js.map +1 -1
  578. package/dist/q2-tecton-elements/q2-icon.entry.js +145 -137
  579. package/dist/q2-tecton-elements/q2-icon.entry.js.map +1 -1
  580. package/dist/q2-tecton-elements/q2-input.entry.esm.js.map +1 -1
  581. package/dist/q2-tecton-elements/q2-input.entry.js +14 -8
  582. package/dist/q2-tecton-elements/q2-input.entry.js.map +1 -1
  583. package/dist/q2-tecton-elements/q2-item.entry.esm.js.map +1 -1
  584. package/dist/q2-tecton-elements/q2-item.entry.js +56 -53
  585. package/dist/q2-tecton-elements/q2-item.entry.js.map +1 -1
  586. package/dist/q2-tecton-elements/q2-legend.entry.js +2 -2
  587. package/dist/q2-tecton-elements/q2-link.q2-list.entry.esm.js.map +1 -1
  588. package/dist/q2-tecton-elements/q2-link_2.entry.js +22 -18
  589. package/dist/q2-tecton-elements/q2-link_2.entry.js.map +1 -1
  590. package/dist/q2-tecton-elements/q2-message.entry.esm.js.map +1 -1
  591. package/dist/q2-tecton-elements/q2-message.entry.js +9 -9
  592. package/dist/q2-tecton-elements/q2-message.entry.js.map +1 -1
  593. package/dist/q2-tecton-elements/q2-meter.entry.js +7 -7
  594. package/dist/q2-tecton-elements/q2-modal.entry.js +21 -21
  595. package/dist/q2-tecton-elements/q2-month-picker.entry.js +30 -30
  596. package/dist/q2-tecton-elements/q2-mutation-observer.entry.js +1 -1
  597. package/dist/q2-tecton-elements/q2-optgroup.entry.esm.js.map +1 -1
  598. package/dist/q2-tecton-elements/q2-optgroup.entry.js +15 -12
  599. package/dist/q2-tecton-elements/q2-optgroup.entry.js.map +1 -1
  600. package/dist/q2-tecton-elements/q2-option-list.q2-popover.entry.esm.js.map +1 -1
  601. package/dist/q2-tecton-elements/q2-option-list_2.entry.js +52 -49
  602. package/dist/q2-tecton-elements/q2-option-list_2.entry.js.map +1 -1
  603. package/dist/q2-tecton-elements/q2-option.entry.esm.js.map +1 -1
  604. package/dist/q2-tecton-elements/q2-option.entry.js +15 -12
  605. package/dist/q2-tecton-elements/q2-option.entry.js.map +1 -1
  606. package/dist/q2-tecton-elements/q2-pagination.entry.esm.js.map +1 -1
  607. package/dist/q2-tecton-elements/q2-pagination.entry.js +66 -66
  608. package/dist/q2-tecton-elements/q2-pagination.entry.js.map +1 -1
  609. package/dist/q2-tecton-elements/q2-pill.entry.js +37 -37
  610. package/dist/q2-tecton-elements/q2-radio.entry.esm.js.map +1 -1
  611. package/dist/q2-tecton-elements/q2-radio.entry.js +47 -45
  612. package/dist/q2-tecton-elements/q2-radio.entry.js.map +1 -1
  613. package/dist/q2-tecton-elements/q2-relative-time.entry.js +1 -1
  614. package/dist/q2-tecton-elements/q2-section-container.entry.esm.js.map +1 -1
  615. package/dist/q2-tecton-elements/q2-section-container.entry.js +5 -2
  616. package/dist/q2-tecton-elements/q2-section-container.entry.js.map +1 -1
  617. package/dist/q2-tecton-elements/q2-section.entry.js +11 -11
  618. package/dist/q2-tecton-elements/q2-select.entry.esm.js.map +1 -1
  619. package/dist/q2-tecton-elements/q2-select.entry.js +6 -3
  620. package/dist/q2-tecton-elements/q2-select.entry.js.map +1 -1
  621. package/dist/q2-tecton-elements/q2-stepper-pane.entry.esm.js.map +1 -1
  622. package/dist/q2-tecton-elements/q2-stepper-pane.entry.js +22 -19
  623. package/dist/q2-tecton-elements/q2-stepper-pane.entry.js.map +1 -1
  624. package/dist/q2-tecton-elements/q2-stepper-vertical.entry.js +69 -69
  625. package/dist/q2-tecton-elements/q2-stepper.entry.esm.js.map +1 -1
  626. package/dist/q2-tecton-elements/q2-stepper.entry.js +42 -39
  627. package/dist/q2-tecton-elements/q2-stepper.entry.js.map +1 -1
  628. package/dist/q2-tecton-elements/q2-tab-container.entry.esm.js.map +1 -1
  629. package/dist/q2-tecton-elements/q2-tab-container.entry.js +21 -16
  630. package/dist/q2-tecton-elements/q2-tab-container.entry.js.map +1 -1
  631. package/dist/q2-tecton-elements/q2-tab-pane.entry.esm.js.map +1 -1
  632. package/dist/q2-tecton-elements/q2-tab-pane.entry.js +17 -7
  633. package/dist/q2-tecton-elements/q2-tab-pane.entry.js.map +1 -1
  634. package/dist/q2-tecton-elements/q2-tag.entry.esm.js.map +1 -1
  635. package/dist/q2-tecton-elements/q2-tag.entry.js +65 -65
  636. package/dist/q2-tecton-elements/q2-tag.entry.js.map +1 -1
  637. package/dist/q2-tecton-elements/q2-tecton-elements.esm.js +1 -1
  638. package/dist/q2-tecton-elements/q2-textarea.entry.esm.js.map +1 -1
  639. package/dist/q2-tecton-elements/q2-textarea.entry.js +3 -3
  640. package/dist/q2-tecton-elements/q2-textarea.entry.js.map +1 -1
  641. package/dist/q2-tecton-elements/q2-toast.entry.esm.js.map +1 -0
  642. package/dist/q2-tecton-elements/q2-toast.entry.js +222 -0
  643. package/dist/q2-tecton-elements/q2-toast.entry.js.map +1 -0
  644. package/dist/q2-tecton-elements/{sanitize-html-string-DOVERJq5.js → sanitize-html-string-BPwFpYg-.js} +167 -145
  645. package/dist/q2-tecton-elements/sanitize-html-string-BPwFpYg-.js.map +1 -0
  646. package/dist/q2-tecton-elements/tecton-tab-pane.entry.esm.js.map +1 -1
  647. package/dist/q2-tecton-elements/tecton-tab-pane.entry.js +8 -8
  648. package/dist/q2-tecton-elements/tecton-tab-pane.entry.js.map +1 -1
  649. package/dist/scripts/docs-generator/index.js +1 -1
  650. package/dist/scripts/docs-generator/index.js.map +1 -1
  651. package/dist/types/Users/kvanhouten/Documents/Work/tecton/packages/q2-tecton-elements/.stencil/jest.e2e-coverage.d.ts +1 -0
  652. package/dist/types/components/q2-action-group/q2-action-group.d.ts +7 -4
  653. package/dist/types/components/q2-carousel-pane/q2-carousel-pane.d.ts +1 -0
  654. package/dist/types/components/q2-checkbox/q2-checkbox.d.ts +0 -5
  655. package/dist/types/components/q2-data-table/q2-data-table.d.ts +8 -0
  656. package/dist/types/components/q2-dropdown/q2-dropdown.d.ts +22 -3
  657. package/dist/types/components/q2-grid-area/q2-grid-area.d.ts +2 -0
  658. package/dist/types/components/q2-input/q2-input.d.ts +4 -5
  659. package/dist/types/components/q2-item/q2-item.d.ts +5 -4
  660. package/dist/types/components/q2-link/q2-link.d.ts +4 -0
  661. package/dist/types/components/q2-pagination/q2-pagination.d.ts +11 -3
  662. package/dist/types/components/q2-select/q2-select.d.ts +1 -2
  663. package/dist/types/components/q2-tab-pane/q2-tab-pane.d.ts +2 -0
  664. package/dist/types/components/q2-toast/q2-toast.d.ts +67 -0
  665. package/dist/types/components.d.ts +189 -34
  666. package/dist/types/utils/action-sheet.d.ts +2 -1
  667. package/dist/types/utils/component.d.ts +4 -0
  668. package/dist/types/utils/sanitize-html-string.d.ts +1 -0
  669. package/package.json +11 -7
  670. package/dist/cjs/action-sheet-CiK2Bap_.js.map +0 -1
  671. package/dist/cjs/sanitize-html-string-DPqrzfM9.js.map +0 -1
  672. package/dist/esm/action-sheet-WwoBwnIp.js.map +0 -1
  673. package/dist/esm/sanitize-html-string-DOVERJq5.js.map +0 -1
  674. package/dist/q2-tecton-elements/action-sheet-WwoBwnIp.js.map +0 -1
  675. package/dist/q2-tecton-elements/sanitize-html-string-DOVERJq5.js.map +0 -1
  676. /package/dist/types/Users/kvanhouten/Documents/Work/{tecton_extra → tecton}/packages/q2-tecton-elements/.stencil/jest.setup.d.ts +0 -0
  677. /package/dist/types/Users/kvanhouten/Documents/Work/{tecton_extra → tecton}/packages/q2-tecton-elements/.stencil/scripts/docs-generator/index.d.ts +0 -0
  678. /package/dist/types/Users/kvanhouten/Documents/Work/{tecton_extra → tecton}/packages/q2-tecton-elements/.stencil/scripts/docs-generator/markdown-generator.d.ts +0 -0
  679. /package/dist/types/Users/kvanhouten/Documents/Work/{tecton_extra → tecton}/packages/q2-tecton-elements/.stencil/scripts/docs-generator/tag-handlers.d.ts +0 -0
  680. /package/dist/types/Users/kvanhouten/Documents/Work/{tecton_extra → tecton}/packages/q2-tecton-elements/.stencil/scripts/docs-generator/types.d.ts +0 -0
@@ -1 +1 @@
1
- {"file":"q2-file-picker.js","mappings":"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","names":["Q2FilePicker","__stencil_proxyCustomElement"],"sources":["src/components/q2-file-picker/q2-file-picker.scss?tag=q2-file-picker&encapsulation=shadow","src/components/q2-file-picker/q2-file-picker.tsx"],"sourcesContent":["@import '../../styles/host.scss';\n@import '../../styles/functions';\n@import '../q2-btn/q2-btn-mixins';\n\n@keyframes growFromCenterFadeIn {\n from {\n transform: scaleX(0.75) scaleY(0.75);\n opacity: 0;\n }\n to {\n transform: scaleX(1) scaleY(1);\n opacity: 1;\n }\n}\n\n@keyframes shrinkToCenterFadeOut {\n from {\n transform: scaleX(1) scaleY(1);\n opacity: 1;\n }\n to {\n transform: scaleX(0.75) scaleY(0.75);\n opacity: 0;\n }\n}\n\n:host {\n --comp-default-file-picker-margin: #{var-list(var-prefixer(file-picker-margin-top), --app-scale-5x, 25px) 0\n var-list(var-prefixer(file-picker-margin-bottom), --app-scale-5x, 25px)};\n display: block;\n margin: var-list(--tct-file-picker-margin, --comp-default-file-picker-margin);\n}\n\n.browse {\n text-align: left;\n}\n\n.drop-zone-text {\n color: var-list(--tct-file-picker-drop-zone-text-color, --t-gray-6, #4d4d4d);\n font-size: var-list(--tct-file-picker-drop-zone-font-size, --app-font-size-small, 12px);\n font-weight: var(--tct-file-picker-browse-link-font-weight, 700);\n margin-bottom: 0;\n margin-top: var-list(--tct-file-picker-drop-zone-text-margin-top, --app-scale-2x, 10px);\n}\n\n.description {\n color: var-list(--tct-file-picker-description-text-color, --t-gray-1, #0d0d0d);\n font-size: var-list(--tct-file-picker-description-font-size, --app-font-size-small, 12px);\n font-weight: var(--tct-file-picker-description-font-weight, 400);\n text-align: var(--tct-file-picker-description-text-align, left);\n}\n\n.drop-zone {\n align-items: center;\n background-color: var-list(--tct-file-picker-drop-zone-background, --t-tertiary, #e8f5fc);\n border-color: var-list(--tct-file-picker-drop-zone-border-color, --t-gray-8, #808080);\n border-radius: var-list(--tct-file-picker-drop-zone-border-radius, --app-border-radius-2, 6px);\n border-style: var(--tct-file-picker-drop-zone-border-style, dashed);\n border-width: var(--tct-file-picker-drop-zone-border-width, 2px);\n color: var(--tct-file-picker-drop-zone-color, #747474);\n display: flex;\n flex-direction: column;\n font-size: var-list(--tct-file-picker-drop-zone-font-size, --app-font-size, 14px);\n font-weight: var(--tct-file-picker-drop-zone-font-weight, 400);\n height: var(--tct-file-picker-drop-zone-height, 150px);\n justify-content: center;\n max-width: var(--tct-file-picker-drop-zone-max-width, 640px);\n min-width: var(--tct-file-picker-drop-zone-min-width, 320px);\n padding: var(--tct-file-picker-drop-zone-padding, 20px);\n text-align: center;\n width: var(--tct-file-picker-drop-zone-width, 100%);\n}\n\n.drop-zone-highlighted {\n background-color: var-list(--tct-file-picker-drop-zone-highlighted-background, --tertiary-d-1, #bee1f6);\n border-color: var-list(--tct-file-picker-drop-zone-highlighted-border, --t-gray-8, #808080);\n}\n\n.drop-zone-disabled {\n opacity: var-list(--tct-file-picker-drop-zone-disabled-opacity, --app-disabled-opacity, 0.4);\n cursor: not-allowed;\n}\n\n.fade-in {\n animation-fill-mode: both;\n animation-play-state: running;\n animation: growFromCenterFadeIn 0.2s ease-in;\n}\n\n.fade-out {\n animation: shrinkToCenterFadeOut 0.1s ease-out;\n animation-play-state: running;\n animation-fill-mode: both;\n}\n\n.file-item {\n --tct-btn-icon-border-radius: 4px;\n --tct-btn-neutral-text-active-font-color: #{var-list(\n --tct-file-picker-item-close-btn-active-color,\n --t-gray-1,\n #0d0d0d\n )};\n --tct-btn-neutral-text-focus-visible-outer-ring-color: #{var-list(\n --tct-file-picker-item-close-btn-color,\n --t-gray-1,\n #0d0d0d\n )};\n --tct-btn-neutral-text-font-color: #{var-list(--tct-file-picker-item-close-btn-color, --t-gray-1, #0d0d0d)};\n --tct-btn-neutral-text-hover-outer-ring-color: #{var-list(\n --tct-file-picker-item-close-btn-hover-focus-ring-color,\n --t-gray-1,\n #0d0d0d\n )};\n --tct-btn-icon-padding: 0;\n --tct-icon-stroke-primary: #{var-list(--tct-file-picker-item-close-btn-color, --t-gray-1, #0d0d0d)};\n --tct-item-body-font-size: #{var-list(--tct-file-picker-item-font-size, --app-font-size-small, 12px)};\n --tct-item-body-font-weight: var(--tct-file-picker-item-font-weight, 400);\n --tct-item-border-radius: #{var-list(--tct-file-picker-item-border-radius, --app-border-radius-3, 12px)};\n --tct-item-border: var(--tct-file-picker-item-border-width, 1px) solid #{var-list(\n --tct-file-picker-item-border-color,\n --t-gray-8,\n #808080\n )};\n --tct-item-header-color: #{var-list(--tct-file-picker-item-name-color, --t-gray-1, #0d0d0d)};\n --tct-item-header-font-size: #{var-list(--tct-file-picker-item-name-font-size, --app-font-size-small, 12px)};\n --tct-item-header-font-weight: var(--tct-file-picker-item-name-font-weight, 400);\n --tct-item-padding: var(--tct-file-picker-item-padding, var(--app-scale-1x, 5px) var(--app-scale-2x, 10px));\n text-align: left;\n}\n\n.file-item-info {\n @include line-clamp(1);\n}\n\n.file-item-loading {\n font-size: var-list(--tct-file-picker-file-item-loading-size, --app-scale-6x, 30px);\n // FIXME: This is a temporary fix to match the height of the closing icon which has 3.5px of padding I can't account for\n margin-bottom: calc(var-list(--tct-file-picker-file-item-loading-margin-bottom, --app-scale-6x, 30px) / 8.57);\n margin-left: calc(var-list(--tct-file-picker-file-item-loading-margin-bottom, --app-scale-1x, 5px) / 2);\n}\n\n.file-list {\n --tct-list-item-gap: #{var-list(--tct-file-picker-section-gap, --app-scale-3x, 15px)};\n}\n\n.file-list-container {\n max-height: var(--tct-file-picker-list-max-height, 190px);\n max-width: var(--tct-file-picker-drop-zone-max-width, 640px);\n overflow-y: auto;\n scrollbar-width: thin;\n scrollbar-color: #{var-list(--tct-file-picker-scrollbar-color, --t-a11y-gray-color, #949494)} transparent;\n}\n\n.file-picker {\n display: flex;\n flex-direction: column;\n gap: #{var-list(--tct-file-picker-file-item-gap, --app-scale-3x, 15px)};\n}\n\n.heading {\n display: flex;\n flex-direction: column;\n gap: #{var-list(--tct-file-picker-heading-gap, --app-scale-1x, 5px)};\n justify-content: space-between;\n}\n\n.icon-success,\n.icon-error {\n --tct-icon-size: #{var-list(--tct-file-picker-file-item-icon-size, --app-scale-6x, 30px)};\n --tct-icon-stroke-width: 2px;\n}\n\n.label {\n color: var-list(--tct-file-picker-label-color, --t-gray-1, #0d0d0d);\n display: inline-block;\n font-size: var-list(--tct-file-picker-label-font-size, --app-font-size, 14px);\n font-weight: var(--tct-file-picker-label-font-weight, 600);\n text-align: var(--tct-file-picker-label-text-align, left);\n}\n\n.loading {\n font-size: var-list(--tct-file-picker-loading-size, --app-scale-6x, 25px);\n}\n\n.loading-file {\n color: var-list(--tct-file-picker-loading-file-color, --t-gray-1, #0d0d0d);\n font-size: var-list(--tct-file-picker-loading-file-font-size, --app-font-size-small, 12px);\n font-weight: var(--tct-file-picker-loading-file-font-weight, 400);\n margin: 0;\n}\n\n.loading-message {\n color: var-list(--tct-file-picker-loading-message-color, --t-gray-1, #0d0d0d);\n font-size: var-list(--tct-file-picker-loading-message-font-size, --app-font-size-small, 12px);\n font-weight: var(--tct-file-picker-loading-message-font-weight, 700);\n margin-bottom: var-list(--tct-file-picker-loading-message-margin-bottom, --app-scale-2x, 10px);\n margin-top: var-list(--tct-file-picker-loading-message-margin-top, --app-scale-2x, 10px);\n}\n\n.dismiss-button {\n height: 30px;\n width: 30px;\n &:hover {\n --tct-icon-stroke-primary: #{var-list(--tct-file-picker-item-close-btn-hover-color, --t-gray-1, #0d0d0d)};\n }\n}\n\n[slot='action'] {\n display: flex;\n align-items: center;\n}\n","import {\n Component,\n ComponentInterface,\n Element,\n Event,\n EventEmitter,\n Fragment,\n h,\n Prop,\n State,\n Watch,\n} from '@stencil/core';\nimport { hasSlotContent, loc } from 'src/utils';\n\ntype DisplayedFile = {\n file: File;\n message?: string;\n status: ValidFileStatusType | InvalidFileStatusType;\n toBeRemoved?: boolean;\n};\ntype ValidFileStatusType = 'in-progress' | 'failed' | 'uploaded';\ntype InvalidFileStatusType = 'invalid-type' | 'over-size-limit' | 'over-max-files-limit';\nexport type ValidFileStatus = {\n name: string;\n status: ValidFileStatusType;\n message?: string;\n};\nexport type InvalidFileStatus = {\n file: File;\n status: InvalidFileStatusType;\n};\nexport type FilesObject = {\n invalidFiles: InvalidFileStatus[];\n validFiles: File[];\n};\n\n/**\n * @name File Picker\n * @category Forms\n * @summary Use for uploading files via browse dialog or drag-and-drop.\n * @slot label - An optional slot to display a custom label.\n * @slot description - An optional slot to display a custom description.\n */\n@Component({\n tag: 'q2-file-picker',\n styleUrl: 'q2-file-picker.scss',\n shadow: true,\n})\nexport class Q2FilePicker implements ComponentInterface {\n // #region Own Properties\n\n private _value: FilesObject = { invalidFiles: [], validFiles: [] };\n browseButtonInput: HTMLElement;\n dropZone: HTMLElement;\n fileItemsToBeDeleted;\n queuedFiles: File[] = [];\n\n // #endregion\n // #region Host HTML Element\n\n @Element()\n el: HTMLElement;\n\n // #endregion\n // #region State Properties\n\n @State()\n areFilesUploading: boolean = false;\n\n @State()\n displayedFiles: DisplayedFile[] = [];\n\n @State()\n isDropZoneHighlighted: boolean = false;\n\n @State()\n refreshCounter = 0;\n\n // #endregion\n // #region Public Property API\n\n /**\n * The size of the browse button.\n */\n @Prop({ reflect: true })\n buttonSize: 'none' | 'small' | 'medium' | 'large' = 'medium';\n\n /**\n * A description of the field. This is announced by screen readers when the field is focused.\n * @localizable\n */\n @Prop({ reflect: true })\n description: string;\n\n /**\n * Disables the file picker, preventing user interaction.\n */\n @Prop({ reflect: true })\n disabled: boolean;\n\n /**\n * Allowed file types based on extensions (e.g., ['jpg', 'png', 'pdf'] or\n * 'jpg, png, pdf'). When using the attribute, provide a comma-separated\n * string (e.g., 'jpg, png, pdf'). Arrays can only be set programmatically\n * via JavaScript.\n */\n @Prop({ reflect: true })\n fileTypes: string[] | string = [];\n\n /**\n * The label for the field. This is announced by screen readers when the field is focused.\n * @localizable\n */\n @Prop({ reflect: true })\n label: string;\n\n /**\n * The maximum number of files that can be selected.\n */\n @Prop({ reflect: true })\n // maxFiles: number | string = Infinity;\n maxFiles: number = Infinity;\n\n /**\n * The maximum size (in bytes) of any file that can be selected.\n */\n @Prop({ reflect: true })\n maxFileSize: number = Infinity;\n\n /**\n * An array of `ValidFileStatus` objects representing the upload status of\n * files. Each `ValidFileStatus` object contains the following properties:\n * - `name`: The file name.\n * - `status`: The upload status, either `\"failed\"` or `\"uploaded\"`.\n * - `message`: (Optional) A custom status message, used only when `status`\n * is `\"failed\"`. This allows developers to provide more detail about\n * upload failures while ensuring all other file status messages remain\n * consistent with approved design/UX standards. Custom failure messages\n * are limited to a single line.\n * @localizable\n */\n @Prop({ reflect: true })\n status: ValidFileStatus[] = [];\n\n /**\n * Returns an object representing the selected files with two properties:\n * - `invalidFiles`: An array of `InvalidFileStatus` objects representing\n * files that failed validation.\n * - `validFiles`: An array of `File` objects representing files that passed\n * validation.\n *\n * Each `InvalidFileStatus` object includes the following properties:\n * - `file`: The `File` object.\n * - `status`: The validation status, which can be `\"invalid-type\"` (invalid file\n * type), `\"over-size-limit\"` (file exceeds the size limit), or\n * `\"over-max-files-limit\"` (total exceeds the max files limit).\n * @readonly\n */\n @Prop()\n get value() {\n return this._value;\n }\n\n set value(_) {\n console.error('Setting the value of this component directly is not allowed.');\n }\n\n /**\n * Determines if the file picker is a browse button or a drop zone with a\n * browse link.\n */\n @Prop({ reflect: true })\n variant: 'browse' | 'browse-drop' = 'browse';\n\n // #endregion\n // #region Events\n\n /**\n * Custom event dispatched when the user selects files. The event detail\n * contains an object representing the selected files with two\n * properties:\n * - `invalidFiles`: An array of `InvalidFileStatus` objects representing\n * files that failed validation.\n * - `validFiles`: An array of `File` objects representing files that passed\n * validation.\n *\n * Each `InvalidFileStatus` object includes the following properties:\n * - `file`: The `File` object.\n * - `status`: The validation status, which can be `\"invalid-type\"` (invalid file\n * type), `\"over-size-limit\"` (file exceeds the size limit), or\n * `\"over-max-files-limit\"` (total exceeds the max files limit).\n */\n @Event()\n tctChange: EventEmitter<FilesObject>;\n\n // #endregion\n // #region Watchers\n\n @Watch('status')\n updateFileList(newValue: ValidFileStatus[]) {\n newValue.forEach(statusItem => {\n const matchingQueuedFileIndex = this.queuedFiles.findIndex(file => file.name === statusItem.name);\n if (matchingQueuedFileIndex > -1) {\n const matchingFile = this.queuedFiles.splice(matchingQueuedFileIndex, 1)[0];\n this.displayedFiles = [{ file: matchingFile, status: statusItem.status }, ...this.displayedFiles];\n } else {\n const matchingDisplayedFileIndex = this.displayedFiles.findIndex(\n file => file.file.name === statusItem.name\n );\n if (matchingDisplayedFileIndex > -1) {\n this.displayedFiles[matchingDisplayedFileIndex].status = statusItem.status;\n if (statusItem.status === 'failed' && statusItem.message) {\n this.displayedFiles[matchingDisplayedFileIndex].message = statusItem.message;\n }\n this.disableLoaderIfAllFilesUploaded();\n }\n }\n });\n }\n\n // #endregion\n // #region Local Methods\n\n get actualButtonSize() {\n return this.buttonSize === 'none' ? undefined : this.buttonSize;\n }\n\n get dropZoneClasses() {\n const classes = ['drop-zone'];\n if (this.isDropZoneHighlighted) {\n classes.push('drop-zone-highlighted');\n }\n\n if (this.disabled) {\n classes.push('drop-zone-disabled');\n }\n\n return classes.join(' ');\n }\n\n get fileTypesArray() {\n return Array.isArray(this.fileTypes) ? this.fileTypes : this.fileTypes.split(',').map(type => type.trim());\n }\n\n get hasDescription() {\n return !!this.description || this.hasDescriptionSlotContent;\n }\n\n get hasDescriptionSlotContent() {\n return hasSlotContent(this.el, 'description');\n }\n\n get hasLabel() {\n return !!this.label || this.hasLabelSlotContent;\n }\n\n get hasLabelSlotContent() {\n return hasSlotContent(this.el, 'label');\n }\n\n buildFilesObject(filesToUpload: File[]): FilesObject {\n const invalidFiles = [];\n invalidFiles.push(...this.extractFilesOfInvalidTypes(filesToUpload));\n invalidFiles.push(...this.extractFilesOverSizeLimit(filesToUpload));\n invalidFiles.push(...this.extractFilesOverMaxFilesLimit(filesToUpload));\n this.displayedFiles = [...invalidFiles];\n\n if (filesToUpload.length === 0) {\n this.areFilesUploading = false;\n } else {\n this.queuedFiles = filesToUpload;\n }\n\n return { invalidFiles, validFiles: filesToUpload };\n }\n\n dimDropZone = (e: DragEvent) => {\n this.disableEvent(e);\n this.isDropZoneHighlighted = false;\n };\n\n disableEvent(event: Event) {\n event.preventDefault();\n event.stopPropagation();\n }\n\n disableLoaderIfAllFilesUploaded() {\n if (this.queuedFiles.length === 0 && !this.displayedFiles.some(file => file.status === 'in-progress')) {\n this.areFilesUploading = false;\n }\n }\n\n emitChange(filesObject: FilesObject) {\n this.areFilesUploading = filesObject.validFiles.length > 0;\n this.tctChange.emit(filesObject);\n }\n\n extractFilesOfInvalidTypes(files: File[]) {\n const invalidFiles = [];\n\n if (this.fileTypesArray.length === 0) return invalidFiles;\n\n files.forEach(file => {\n const fileExtension = file.name.split('.').pop().toLowerCase();\n if (!this.fileTypesArray.includes(fileExtension)) {\n invalidFiles.push({ file, status: 'invalid-type' });\n }\n });\n\n // Remove invalid files from the files array\n invalidFiles.forEach(invalidFile => {\n const index = files.indexOf(invalidFile.file);\n if (index > -1) {\n files.splice(index, 1);\n }\n });\n\n return invalidFiles;\n }\n\n extractFilesOverMaxFilesLimit(files: File[]) {\n const filesOverMaxFilesLimit = [];\n\n if (this.maxFiles === Infinity) return filesOverMaxFilesLimit;\n\n if (files.length > this.maxFiles) {\n const excessFiles = files.splice(this.maxFiles);\n excessFiles.forEach(file => {\n filesOverMaxFilesLimit.push({ file, status: 'over-max-files-limit' });\n });\n }\n\n return filesOverMaxFilesLimit;\n }\n\n extractFilesOverSizeLimit(files: File[]) {\n const filesOverSizeLimit = [];\n\n if (this.maxFileSize === Infinity) return filesOverSizeLimit;\n\n files.forEach(file => {\n if (file.size > this.maxFileSize) {\n filesOverSizeLimit.push({ file, status: 'over-size-limit' });\n }\n });\n\n // Remove files over size limit from the files array\n filesOverSizeLimit.forEach(overSizeFile => {\n const index = files.indexOf(overSizeFile.file);\n if (index > -1) {\n files.splice(index, 1);\n }\n });\n\n return filesOverSizeLimit;\n }\n\n forceRerender() {\n this.refreshCounter += 1; // Triggers re-render\n }\n\n getAnimationendHandlerToRemoveFileItem(fileName: string) {\n return (e: AnimationEvent) => {\n if (e.animationName === 'shrinkToCenterFadeOut') {\n this.displayedFiles = this.displayedFiles.filter(file => file.file.name !== fileName);\n }\n };\n }\n\n getClickHandlerToRemoveFileItem(fileName: string) {\n return () => {\n const fileToDelete = this.displayedFiles.find(file => file.file.name === fileName);\n if (fileToDelete) {\n fileToDelete.toBeRemoved = true;\n this.forceRerender();\n }\n };\n }\n\n getFileItemButtonLabel(displayedFile: DisplayedFile) {\n const statusMessage = `Status, ${displayedFile.status === 'uploaded' ? 'uploaded. ' : ''}${this.getFileItemStatusMessage(displayedFile)}`;\n return `Dismiss file item for ${displayedFile.file.name}. ${statusMessage}.`;\n }\n\n getFileItemClasses(fileName: string) {\n const classes = ['file-item'];\n const matchingFile = this.displayedFiles.find(file => file.file.name === fileName);\n if (matchingFile?.toBeRemoved) {\n classes.push('fade-out');\n } else {\n classes.push('fade-in');\n }\n return classes.join(' ');\n }\n\n getFileItemStatusMessage(displayedFile: DisplayedFile) {\n switch (displayedFile.status) {\n case 'invalid-type':\n return loc('tecton.element.filePicker.unsupportedFileType');\n case 'over-size-limit':\n return loc('tecton.element.filePicker.sizeExceedsLimit');\n case 'over-max-files-limit':\n return loc('tecton.element.filePicker.overMaxFilesLimit');\n case 'in-progress':\n return loc('tecton.element.filePicker.uploadingEllipsis');\n case 'failed':\n if (displayedFile.message) return loc(displayedFile.message);\n return loc('tecton.element.filePicker.uploadFailed');\n case 'uploaded':\n default:\n return loc('tecton.element.filePicker.fileSize', [\n (displayedFile.file.size / (1000 * 1000)).toFixed(2),\n ]);\n }\n }\n\n grabDroppedFiles = (e: DragEvent) => {\n if (this.disabled) return;\n this.disableEvent(e);\n this.isDropZoneHighlighted = false;\n const droppedFiles = Array.from(e.dataTransfer.files);\n const filesObject = this.buildFilesObject(droppedFiles);\n\n this.emitChange(filesObject);\n this._value = filesObject;\n };\n\n grabSelectedFiles = (e: Event) => {\n const selectedFiles = Array.from((e.target as HTMLInputElement).files);\n const filesObject = this.buildFilesObject(selectedFiles);\n // Reset the input value to allow re-selection of the same file\n (this.browseButtonInput as HTMLInputElement).value = '';\n\n this.emitChange(filesObject);\n this._value = filesObject;\n };\n\n highlightDropZone = (e: DragEvent) => {\n if (this.disabled) return;\n this.disableEvent(e);\n this.isDropZoneHighlighted = true;\n };\n\n launchFileBrowser() {\n this.browseButtonInput.dispatchEvent(new MouseEvent('click'));\n }\n\n // #endregion\n // #region Render Methods\n\n render = () => {\n const { disabled } = this;\n return (\n <div class=\"file-picker\">\n {(this.hasLabel || this.hasDescription) && (\n <div class=\"heading\">\n {this.hasLabel && (\n <label\n class=\"label\"\n htmlFor=\"file-field\"\n test-id=\"label\"\n >\n {!!this.label ? loc(this.label) : this.hasLabelSlotContent ? <slot name=\"label\" /> : ''}\n </label>\n )}\n {this.hasDescription && (\n <div\n class=\"description\"\n id=\"description\"\n test-id=\"description\"\n >\n {!!this.description ? (\n loc(this.description)\n ) : this.hasDescriptionSlotContent ? (\n <slot name=\"description\" />\n ) : (\n ''\n )}\n </div>\n )}\n </div>\n )}\n\n {(this.variant === 'browse-drop' && (\n <div\n class={this.dropZoneClasses}\n onDragEnter={this.disableEvent}\n onDragLeave={this.dimDropZone}\n onDragOver={this.highlightDropZone}\n onDrop={this.grabDroppedFiles}\n ref={el => (this.dropZone = el ?? this.dropZone)}\n test-id=\"drop-zone\"\n >\n {(this.areFilesUploading && (\n <Fragment>\n <q2-loading class=\"loading\"></q2-loading>\n <p class=\"drop-zone-text\">{loc('tecton.element.filePicker.uploadingEllipsis')}</p>\n </Fragment>\n )) || (\n <Fragment>\n <q2-icon type=\"upload\"></q2-icon>\n <p class=\"drop-zone-text\">\n <q2-link\n label={loc('tecton.element.filePicker.browse')}\n onTctClick={() => this.launchFileBrowser()}\n variant=\"inline\"\n test-id=\"browse-link\"\n disabled={disabled}\n href=\"javascript:void(0)\"\n />\n {loc('tecton.element.filePicker.orDragFilesHere', [this.maxFiles])}\n </p>\n </Fragment>\n )}\n </div>\n )) || (\n <div\n class=\"browse\"\n test-id=\"browse\"\n >\n <q2-btn\n disabled={disabled || this.areFilesUploading}\n intent=\"workflow-primary\"\n loading={this.areFilesUploading}\n onClick={() => this.launchFileBrowser()}\n size={this.actualButtonSize}\n test-id=\"browse-button\"\n >\n <q2-icon type=\"paperclip\"></q2-icon>\n <span>{loc('tecton.element.filePicker.attachFiles', [this.maxFiles])}</span>\n </q2-btn>\n </div>\n )}\n <input\n aria-describedby={(!!this.description && 'description') || undefined}\n class=\"sr\"\n id=\"file-field\"\n onChange={this.grabSelectedFiles}\n ref={el => (this.browseButtonInput = el ?? this.browseButtonInput)}\n type=\"file\"\n test-id=\"file-input\"\n disabled={disabled}\n multiple\n tabIndex={-1}\n />\n <div class=\"file-list-container\">\n <q2-list class=\"file-list\">\n {this.displayedFiles.map(file => (\n <q2-item\n class={this.getFileItemClasses(file.file.name)}\n key={file.file.name}\n onAnimationEnd={this.getAnimationendHandlerToRemoveFileItem(file.file.name)}\n >\n <div slot=\"bullet\">\n {file.status === 'invalid-type' ||\n file.status === 'over-size-limit' ||\n file.status === 'failed' ||\n file.status === 'over-max-files-limit' ? (\n <q2-icon\n class=\"icon-error\"\n type=\"error\"\n ></q2-icon>\n ) : file.status === 'in-progress' ? (\n <q2-loading\n class=\"file-item-loading\"\n hide-from-screen-readers\n ></q2-loading>\n ) : (\n <q2-icon\n class=\"icon-success\"\n type=\"success\"\n ></q2-icon>\n )}\n </div>\n <div slot=\"header\">{file.file.name}</div>\n <div\n class=\"file-item-info\"\n slot=\"body\"\n >\n {this.getFileItemStatusMessage(file)}\n </div>\n <div slot=\"action\">\n <q2-btn\n class=\"dismiss-button\"\n intent=\"neutral-text\"\n hide-label=\"true\"\n label={this.getFileItemButtonLabel(file)}\n onClick={this.getClickHandlerToRemoveFileItem(file.file.name)}\n disabled={disabled}\n >\n <q2-icon type=\"close\"></q2-icon>\n </q2-btn>\n </div>\n </q2-item>\n ))}\n </q2-list>\n </div>\n </div>\n );\n };\n\n // #endregion\n}\n"],"version":3}
1
+ {"file":"q2-file-picker.js","mappings":"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","names":["Q2FilePicker","__stencil_proxyCustomElement"],"sources":["src/components/q2-file-picker/q2-file-picker.scss?tag=q2-file-picker&encapsulation=shadow","src/components/q2-file-picker/q2-file-picker.tsx"],"sourcesContent":["@import '../../styles/host.scss';\n@import '../../styles/functions';\n@import '../q2-btn/q2-btn-mixins';\n\n@keyframes growFromCenterFadeIn {\n from {\n transform: scaleX(0.75) scaleY(0.75);\n opacity: 0;\n }\n to {\n transform: scaleX(1) scaleY(1);\n opacity: 1;\n }\n}\n\n@keyframes shrinkToCenterFadeOut {\n from {\n transform: scaleX(1) scaleY(1);\n opacity: 1;\n }\n to {\n transform: scaleX(0.75) scaleY(0.75);\n opacity: 0;\n }\n}\n\n:host {\n --comp-default-file-picker-margin: #{var-list(var-prefixer(file-picker-margin-top), --app-scale-5x, 25px) 0\n var-list(var-prefixer(file-picker-margin-bottom), --app-scale-5x, 25px)};\n display: block;\n margin: var-list(--tct-file-picker-margin, --comp-default-file-picker-margin);\n}\n\n.browse {\n text-align: left;\n}\n\n.drop-zone-text {\n --tct-link-font-weight: var(--tct-file-picker-browse-link-font-weight, 700);\n\n color: var-list(--tct-file-picker-drop-zone-text-color, --t-gray-6, #4d4d4d);\n font-size: var-list(--tct-file-picker-drop-zone-font-size, --app-font-size-small, 12px);\n font-weight: var(--tct-file-picker-browse-link-font-weight, 700);\n margin-bottom: 0;\n margin-top: var-list(--tct-file-picker-drop-zone-text-margin-top, --app-scale-2x, 10px);\n}\n\n.description {\n color: var-list(--tct-file-picker-description-text-color, --t-gray-1, #0d0d0d);\n font-size: var-list(--tct-file-picker-description-font-size, --app-font-size-small, 12px);\n font-weight: var(--tct-file-picker-description-font-weight, 400);\n text-align: var(--tct-file-picker-description-text-align, left);\n}\n\n.drop-zone {\n --tct-icon-stroke-primary: #{var-list(--tct-file-picker-drop-zone-icon-color, --t-text, #4d4d4d)};\n --tct-icon-stroke-secondary: #{var-list(--tct-file-picker-drop-zone-icon-color, --t-text, #4d4d4d)};\n\n align-items: center;\n background-color: var-list(--tct-file-picker-drop-zone-background, --t-tertiary, #e8f5fc);\n border-color: var-list(--tct-file-picker-drop-zone-border-color, --t-gray-8, #808080);\n border-radius: var-list(--tct-file-picker-drop-zone-border-radius, --app-border-radius-2, 6px);\n border-style: var(--tct-file-picker-drop-zone-border-style, dashed);\n border-width: var(--tct-file-picker-drop-zone-border-width, 2px);\n color: var(--tct-file-picker-drop-zone-color, #747474);\n display: flex;\n flex-direction: column;\n font-size: var-list(--tct-file-picker-drop-zone-font-size, --app-font-size, 14px);\n font-weight: var(--tct-file-picker-drop-zone-font-weight, 400);\n height: var(--tct-file-picker-drop-zone-height, 150px);\n justify-content: center;\n max-width: var(--tct-file-picker-drop-zone-max-width, 640px);\n min-width: var(--tct-file-picker-drop-zone-min-width, 320px);\n padding: var(--tct-file-picker-drop-zone-padding, 20px);\n text-align: center;\n width: var(--tct-file-picker-drop-zone-width, 100%);\n}\n\n.drop-zone-highlighted {\n background-color: var-list(--tct-file-picker-drop-zone-highlighted-background, --tertiary-d-1, #bee1f6);\n border-color: var-list(--tct-file-picker-drop-zone-highlighted-border, --t-gray-8, #808080);\n}\n\n.drop-zone-disabled {\n opacity: var-list(--tct-file-picker-drop-zone-disabled-opacity, --app-disabled-opacity, 0.4);\n cursor: not-allowed;\n}\n\n.fade-in {\n animation-fill-mode: both;\n animation-play-state: running;\n animation: growFromCenterFadeIn 0.2s ease-in;\n}\n\n.fade-out {\n animation: shrinkToCenterFadeOut 0.1s ease-out;\n animation-play-state: running;\n animation-fill-mode: both;\n}\n\n.file-item {\n --tct-btn-icon-border-radius: var(--tct-file-picker-item-close-btn-border-radius, 4px);\n --tct-btn-neutral-text-active-font-color: #{var-list(\n --tct-file-picker-item-close-btn-active-color,\n --t-gray-1,\n #0d0d0d\n )};\n --tct-btn-neutral-text-focus-visible-outer-ring-color: #{var-list(\n --tct-file-picker-item-close-btn-color,\n --t-gray-1,\n #0d0d0d\n )};\n --tct-btn-neutral-text-font-color: #{var-list(--tct-file-picker-item-close-btn-color, --t-gray-1, #0d0d0d)};\n --tct-btn-neutral-text-hover-outer-ring-color: #{var-list(\n --tct-file-picker-item-close-btn-hover-focus-ring-color,\n --t-gray-1,\n #0d0d0d\n )};\n --tct-btn-icon-padding: 0;\n --tct-icon-stroke-primary: #{var-list(--tct-file-picker-item-close-btn-color, --t-gray-1, #0d0d0d)};\n --tct-item-body-font-size: #{var-list(--tct-file-picker-item-font-size, --app-font-size-small, 12px)};\n --tct-item-body-font-weight: var(--tct-file-picker-item-font-weight, 400);\n --tct-item-border-radius: #{var-list(--tct-file-picker-item-border-radius, --app-border-radius-3, 12px)};\n --tct-item-border: var(--tct-file-picker-item-border-width, 1px) solid #{var-list(\n --tct-file-picker-item-border-color,\n --t-gray-8,\n #808080\n )};\n --tct-item-header-color: #{var-list(--tct-file-picker-item-name-color, --t-gray-1, #0d0d0d)};\n --tct-item-header-font-size: #{var-list(--tct-file-picker-item-name-font-size, --app-font-size-small, 12px)};\n --tct-item-header-font-weight: var(--tct-file-picker-item-name-font-weight, 400);\n --tct-item-padding: var(--tct-file-picker-item-padding, var(--app-scale-1x, 5px) var(--app-scale-2x, 10px));\n text-align: left;\n}\n\n.file-item-info {\n @include line-clamp(1);\n}\n\n.file-item-loading {\n font-size: var-list(--tct-file-picker-file-item-loading-size, --app-scale-6x, 30px);\n // FIXME: This is a temporary fix to match the height of the closing icon which has 3.5px of padding I can't account for\n margin-bottom: calc(var-list(--tct-file-picker-file-item-loading-margin-bottom, --app-scale-6x, 30px) / 8.57);\n margin-left: calc(var-list(--tct-file-picker-file-item-loading-margin-bottom, --app-scale-1x, 5px) / 2);\n}\n\n.file-list {\n --tct-list-item-gap: #{var-list(--tct-file-picker-section-gap, --app-scale-3x, 15px)};\n}\n\n.file-list-container {\n max-height: var(--tct-file-picker-list-max-height, 190px);\n max-width: var(--tct-file-picker-drop-zone-max-width, 640px);\n overflow-y: auto;\n scrollbar-width: thin;\n scrollbar-color: #{var-list(--tct-file-picker-scrollbar-color, --t-a11y-gray-color, #949494)} transparent;\n}\n\n.file-picker {\n display: flex;\n flex-direction: column;\n gap: #{var-list(--tct-file-picker-file-item-gap, --app-scale-3x, 15px)};\n}\n\n.heading {\n display: flex;\n flex-direction: column;\n gap: #{var-list(--tct-file-picker-heading-gap, --app-scale-1x, 5px)};\n justify-content: space-between;\n}\n\n.icon-success,\n.icon-error {\n --tct-icon-size: #{var-list(--tct-file-picker-file-item-icon-size, --app-scale-6x, 30px)};\n --tct-icon-stroke-width: 2px;\n}\n\n.label {\n color: var-list(--tct-file-picker-label-color, --t-gray-1, #0d0d0d);\n display: inline-block;\n font-size: var-list(--tct-file-picker-label-font-size, --app-font-size, 14px);\n font-weight: var(--tct-file-picker-label-font-weight, 600);\n text-align: var(--tct-file-picker-label-text-align, left);\n}\n\n.loading {\n font-size: var-list(--tct-file-picker-loading-size, --app-scale-6x, 25px);\n}\n\n.loading-file {\n color: var-list(--tct-file-picker-loading-file-color, --t-gray-1, #0d0d0d);\n font-size: var-list(--tct-file-picker-loading-file-font-size, --app-font-size-small, 12px);\n font-weight: var(--tct-file-picker-loading-file-font-weight, 400);\n margin: 0;\n}\n\n.loading-message {\n color: var-list(--tct-file-picker-loading-message-color, --t-gray-1, #0d0d0d);\n font-size: var-list(--tct-file-picker-loading-message-font-size, --app-font-size-small, 12px);\n font-weight: var(--tct-file-picker-loading-message-font-weight, 700);\n margin-bottom: var-list(--tct-file-picker-loading-message-margin-bottom, --app-scale-2x, 10px);\n margin-top: var-list(--tct-file-picker-loading-message-margin-top, --app-scale-2x, 10px);\n}\n\n.dismiss-button {\n height: 30px;\n width: 30px;\n &:hover {\n --tct-icon-stroke-primary: #{var-list(--tct-file-picker-item-close-btn-hover-color, --t-gray-1, #0d0d0d)};\n }\n}\n\n[slot='action'] {\n display: flex;\n align-items: center;\n}\n","import {\n Component,\n ComponentInterface,\n Element,\n Event,\n EventEmitter,\n Fragment,\n h,\n Prop,\n State,\n Watch,\n} from '@stencil/core';\nimport { hasSlotContent, loc } from 'src/utils';\n\ntype DisplayedFile = {\n file: File;\n message?: string;\n status: ValidFileStatusType | InvalidFileStatusType;\n toBeRemoved?: boolean;\n};\ntype ValidFileStatusType = 'in-progress' | 'failed' | 'uploaded';\ntype InvalidFileStatusType = 'invalid-type' | 'over-size-limit' | 'over-max-files-limit';\nexport type ValidFileStatus = {\n name: string;\n status: ValidFileStatusType;\n message?: string;\n};\nexport type InvalidFileStatus = {\n file: File;\n status: InvalidFileStatusType;\n};\nexport type FilesObject = {\n invalidFiles: InvalidFileStatus[];\n validFiles: File[];\n};\n\n/**\n * @name File Picker\n * @category Forms\n * @summary Use for uploading files via browse dialog or drag-and-drop.\n * @slot label - An optional slot to display a custom label.\n * @slot description - An optional slot to display a custom description.\n */\n@Component({\n tag: 'q2-file-picker',\n styleUrl: 'q2-file-picker.scss',\n shadow: true,\n})\nexport class Q2FilePicker implements ComponentInterface {\n // #region Own Properties\n\n private _value: FilesObject = { invalidFiles: [], validFiles: [] };\n browseButtonInput: HTMLElement;\n dropZone: HTMLElement;\n fileItemsToBeDeleted;\n queuedFiles: File[] = [];\n\n // #endregion\n // #region Host HTML Element\n\n @Element()\n el: HTMLElement;\n\n // #endregion\n // #region State Properties\n\n @State()\n areFilesUploading: boolean = false;\n\n @State()\n displayedFiles: DisplayedFile[] = [];\n\n @State()\n isDropZoneHighlighted: boolean = false;\n\n @State()\n refreshCounter = 0;\n\n // #endregion\n // #region Public Property API\n\n /**\n * The size of the browse button.\n */\n @Prop({ reflect: true })\n buttonSize: 'none' | 'small' | 'medium' | 'large' = 'medium';\n\n /**\n * A description of the field. This is announced by screen readers when the field is focused.\n * @localizable\n */\n @Prop({ reflect: true })\n description: string;\n\n /**\n * Disables the file picker, preventing user interaction.\n */\n @Prop({ reflect: true })\n disabled: boolean;\n\n /**\n * Allowed file types based on extensions (e.g., ['jpg', 'png', 'pdf'] or\n * 'jpg, png, pdf'). When using the attribute, provide a comma-separated\n * string (e.g., 'jpg, png, pdf'). Arrays can only be set programmatically\n * via JavaScript.\n */\n @Prop({ reflect: true })\n fileTypes: string[] | string = [];\n\n /**\n * The label for the field. This is announced by screen readers when the field is focused.\n * @localizable\n */\n @Prop({ reflect: true })\n label: string;\n\n /**\n * The maximum number of files that can be selected.\n */\n @Prop({ reflect: true })\n // maxFiles: number | string = Infinity;\n maxFiles: number = Infinity;\n\n /**\n * The maximum size (in bytes) of any file that can be selected.\n */\n @Prop({ reflect: true })\n maxFileSize: number = Infinity;\n\n /**\n * An array of `ValidFileStatus` objects representing the upload status of\n * files. Each `ValidFileStatus` object contains the following properties:\n * - `name`: The file name.\n * - `status`: The upload status, either `\"failed\"` or `\"uploaded\"`.\n * - `message`: (Optional) A custom status message, used only when `status`\n * is `\"failed\"`. This allows developers to provide more detail about\n * upload failures while ensuring all other file status messages remain\n * consistent with approved design/UX standards. Custom failure messages\n * are limited to a single line.\n * @localizable\n */\n @Prop({ reflect: true })\n status: ValidFileStatus[] = [];\n\n /**\n * Returns an object representing the selected files with two properties:\n * - `invalidFiles`: An array of `InvalidFileStatus` objects representing\n * files that failed validation.\n * - `validFiles`: An array of `File` objects representing files that passed\n * validation.\n *\n * Each `InvalidFileStatus` object includes the following properties:\n * - `file`: The `File` object.\n * - `status`: The validation status, which can be `\"invalid-type\"` (invalid file\n * type), `\"over-size-limit\"` (file exceeds the size limit), or\n * `\"over-max-files-limit\"` (total exceeds the max files limit).\n * @readonly\n */\n @Prop()\n get value() {\n return this._value;\n }\n\n set value(_) {\n console.error('Setting the value of this component directly is not allowed.');\n }\n\n /**\n * Determines if the file picker is a browse button or a drop zone with a\n * browse link.\n */\n @Prop({ reflect: true })\n variant: 'browse' | 'browse-drop' = 'browse';\n\n // #endregion\n // #region Events\n\n /**\n * Custom event dispatched when the user selects files. The event detail\n * contains an object representing the selected files with two\n * properties:\n * - `invalidFiles`: An array of `InvalidFileStatus` objects representing\n * files that failed validation.\n * - `validFiles`: An array of `File` objects representing files that passed\n * validation.\n *\n * Each `InvalidFileStatus` object includes the following properties:\n * - `file`: The `File` object.\n * - `status`: The validation status, which can be `\"invalid-type\"` (invalid file\n * type), `\"over-size-limit\"` (file exceeds the size limit), or\n * `\"over-max-files-limit\"` (total exceeds the max files limit).\n */\n @Event()\n tctChange: EventEmitter<FilesObject>;\n\n // #endregion\n // #region Watchers\n\n @Watch('status')\n updateFileList(newValue: ValidFileStatus[]) {\n newValue.forEach(statusItem => {\n const matchingQueuedFileIndex = this.queuedFiles.findIndex(file => file.name === statusItem.name);\n if (matchingQueuedFileIndex > -1) {\n const matchingFile = this.queuedFiles.splice(matchingQueuedFileIndex, 1)[0];\n this.displayedFiles = [{ file: matchingFile, status: statusItem.status }, ...this.displayedFiles];\n } else {\n const matchingDisplayedFileIndex = this.displayedFiles.findIndex(\n file => file.file.name === statusItem.name\n );\n if (matchingDisplayedFileIndex > -1) {\n this.displayedFiles[matchingDisplayedFileIndex].status = statusItem.status;\n if (statusItem.status === 'failed' && statusItem.message) {\n this.displayedFiles[matchingDisplayedFileIndex].message = statusItem.message;\n }\n this.disableLoaderIfAllFilesUploaded();\n }\n }\n });\n }\n\n // #endregion\n // #region Local Methods\n\n get actualButtonSize() {\n return this.buttonSize === 'none' ? undefined : this.buttonSize;\n }\n\n get dropZoneClasses() {\n const classes = ['drop-zone'];\n if (this.isDropZoneHighlighted) {\n classes.push('drop-zone-highlighted');\n }\n\n if (this.disabled) {\n classes.push('drop-zone-disabled');\n }\n\n return classes.join(' ');\n }\n\n get fileTypesArray() {\n return Array.isArray(this.fileTypes) ? this.fileTypes : this.fileTypes.split(',').map(type => type.trim());\n }\n\n get hasDescription() {\n return !!this.description || this.hasDescriptionSlotContent;\n }\n\n get hasDescriptionSlotContent() {\n return hasSlotContent(this.el, 'description');\n }\n\n get hasLabel() {\n return !!this.label || this.hasLabelSlotContent;\n }\n\n get hasLabelSlotContent() {\n return hasSlotContent(this.el, 'label');\n }\n\n buildFilesObject(filesToUpload: File[]): FilesObject {\n const invalidFiles = [];\n invalidFiles.push(...this.extractFilesOfInvalidTypes(filesToUpload));\n invalidFiles.push(...this.extractFilesOverSizeLimit(filesToUpload));\n invalidFiles.push(...this.extractFilesOverMaxFilesLimit(filesToUpload));\n this.displayedFiles = [...invalidFiles];\n\n if (filesToUpload.length === 0) {\n this.areFilesUploading = false;\n } else {\n this.queuedFiles = filesToUpload;\n }\n\n return { invalidFiles, validFiles: filesToUpload };\n }\n\n dimDropZone = (e: DragEvent) => {\n this.disableEvent(e);\n this.isDropZoneHighlighted = false;\n };\n\n disableEvent(event: Event) {\n event.preventDefault();\n event.stopPropagation();\n }\n\n disableLoaderIfAllFilesUploaded() {\n if (this.queuedFiles.length === 0 && !this.displayedFiles.some(file => file.status === 'in-progress')) {\n this.areFilesUploading = false;\n }\n }\n\n emitChange(filesObject: FilesObject) {\n this.areFilesUploading = filesObject.validFiles.length > 0;\n this.tctChange.emit(filesObject);\n }\n\n extractFilesOfInvalidTypes(files: File[]) {\n const invalidFiles = [];\n\n if (this.fileTypesArray.length === 0) return invalidFiles;\n\n files.forEach(file => {\n const fileExtension = file.name.split('.').pop().toLowerCase();\n if (!this.fileTypesArray.includes(fileExtension)) {\n invalidFiles.push({ file, status: 'invalid-type' });\n }\n });\n\n // Remove invalid files from the files array\n invalidFiles.forEach(invalidFile => {\n const index = files.indexOf(invalidFile.file);\n if (index > -1) {\n files.splice(index, 1);\n }\n });\n\n return invalidFiles;\n }\n\n extractFilesOverMaxFilesLimit(files: File[]) {\n const filesOverMaxFilesLimit = [];\n\n if (this.maxFiles === Infinity) return filesOverMaxFilesLimit;\n\n if (files.length > this.maxFiles) {\n const excessFiles = files.splice(this.maxFiles);\n excessFiles.forEach(file => {\n filesOverMaxFilesLimit.push({ file, status: 'over-max-files-limit' });\n });\n }\n\n return filesOverMaxFilesLimit;\n }\n\n extractFilesOverSizeLimit(files: File[]) {\n const filesOverSizeLimit = [];\n\n if (this.maxFileSize === Infinity) return filesOverSizeLimit;\n\n files.forEach(file => {\n if (file.size > this.maxFileSize) {\n filesOverSizeLimit.push({ file, status: 'over-size-limit' });\n }\n });\n\n // Remove files over size limit from the files array\n filesOverSizeLimit.forEach(overSizeFile => {\n const index = files.indexOf(overSizeFile.file);\n if (index > -1) {\n files.splice(index, 1);\n }\n });\n\n return filesOverSizeLimit;\n }\n\n forceRerender() {\n this.refreshCounter += 1; // Triggers re-render\n }\n\n getAnimationendHandlerToRemoveFileItem(fileName: string) {\n return (e: AnimationEvent) => {\n if (e.animationName === 'shrinkToCenterFadeOut') {\n this.displayedFiles = this.displayedFiles.filter(file => file.file.name !== fileName);\n }\n };\n }\n\n getClickHandlerToRemoveFileItem(fileName: string) {\n return () => {\n const fileToDelete = this.displayedFiles.find(file => file.file.name === fileName);\n if (fileToDelete) {\n fileToDelete.toBeRemoved = true;\n this.forceRerender();\n }\n };\n }\n\n getFileItemButtonLabel(displayedFile: DisplayedFile) {\n const statusMessage = `Status, ${displayedFile.status === 'uploaded' ? 'uploaded. ' : ''}${this.getFileItemStatusMessage(displayedFile)}`;\n return `Dismiss file item for ${displayedFile.file.name}. ${statusMessage}.`;\n }\n\n getFileItemClasses(fileName: string) {\n const classes = ['file-item'];\n const matchingFile = this.displayedFiles.find(file => file.file.name === fileName);\n if (matchingFile?.toBeRemoved) {\n classes.push('fade-out');\n } else {\n classes.push('fade-in');\n }\n return classes.join(' ');\n }\n\n getFileItemStatusMessage(displayedFile: DisplayedFile) {\n switch (displayedFile.status) {\n case 'invalid-type':\n return loc('tecton.element.filePicker.unsupportedFileType');\n case 'over-size-limit':\n return loc('tecton.element.filePicker.sizeExceedsLimit');\n case 'over-max-files-limit':\n return loc('tecton.element.filePicker.overMaxFilesLimit');\n case 'in-progress':\n return loc('tecton.element.filePicker.uploadingEllipsis');\n case 'failed':\n if (displayedFile.message) return loc(displayedFile.message);\n return loc('tecton.element.filePicker.uploadFailed');\n case 'uploaded':\n default:\n return loc('tecton.element.filePicker.fileSize', [\n (displayedFile.file.size / (1000 * 1000)).toFixed(2),\n ]);\n }\n }\n\n grabDroppedFiles = (e: DragEvent) => {\n if (this.disabled) return;\n this.disableEvent(e);\n this.isDropZoneHighlighted = false;\n const droppedFiles = Array.from(e.dataTransfer.files);\n const filesObject = this.buildFilesObject(droppedFiles);\n\n this.emitChange(filesObject);\n this._value = filesObject;\n };\n\n grabSelectedFiles = (e: Event) => {\n const selectedFiles = Array.from((e.target as HTMLInputElement).files);\n const filesObject = this.buildFilesObject(selectedFiles);\n // Reset the input value to allow re-selection of the same file\n (this.browseButtonInput as HTMLInputElement).value = '';\n\n this.emitChange(filesObject);\n this._value = filesObject;\n };\n\n highlightDropZone = (e: DragEvent) => {\n if (this.disabled) return;\n this.disableEvent(e);\n this.isDropZoneHighlighted = true;\n };\n\n launchFileBrowser() {\n this.browseButtonInput.dispatchEvent(new MouseEvent('click'));\n }\n\n // #endregion\n // #region Render Methods\n\n render = () => {\n const { disabled } = this;\n return (\n <div class=\"file-picker\">\n {(this.hasLabel || this.hasDescription) && (\n <div class=\"heading\">\n {this.hasLabel && (\n <label\n class=\"label\"\n htmlFor=\"file-field\"\n test-id=\"label\"\n >\n {!!this.label ? loc(this.label) : this.hasLabelSlotContent ? <slot name=\"label\" /> : ''}\n </label>\n )}\n {this.hasDescription && (\n <div\n class=\"description\"\n id=\"description\"\n test-id=\"description\"\n >\n {!!this.description ? (\n loc(this.description)\n ) : this.hasDescriptionSlotContent ? (\n <slot name=\"description\" />\n ) : (\n ''\n )}\n </div>\n )}\n </div>\n )}\n\n {(this.variant === 'browse-drop' && (\n <div\n class={this.dropZoneClasses}\n onDragEnter={this.disableEvent}\n onDragLeave={this.dimDropZone}\n onDragOver={this.highlightDropZone}\n onDrop={this.grabDroppedFiles}\n ref={el => (this.dropZone = el ?? this.dropZone)}\n test-id=\"drop-zone\"\n >\n {(this.areFilesUploading && (\n <Fragment>\n <q2-loading class=\"loading\"></q2-loading>\n <p class=\"drop-zone-text\">{loc('tecton.element.filePicker.uploadingEllipsis')}</p>\n </Fragment>\n )) || (\n <Fragment>\n <q2-icon type=\"upload\"></q2-icon>\n <p class=\"drop-zone-text\">\n <q2-link\n class=\"browse-link\"\n label={loc('tecton.element.filePicker.browse')}\n onTctClick={() => this.launchFileBrowser()}\n variant=\"inline\"\n test-id=\"browse-link\"\n disabled={disabled}\n href=\"javascript:void(0)\"\n />\n {loc('tecton.element.filePicker.orDragFilesHere', [this.maxFiles])}\n </p>\n </Fragment>\n )}\n </div>\n )) || (\n <div\n class=\"browse\"\n test-id=\"browse\"\n >\n <q2-btn\n disabled={disabled || this.areFilesUploading}\n intent=\"workflow-primary\"\n loading={this.areFilesUploading}\n onClick={() => this.launchFileBrowser()}\n size={this.actualButtonSize}\n test-id=\"browse-button\"\n >\n <q2-icon type=\"paperclip\"></q2-icon>\n <span>{loc('tecton.element.filePicker.attachFiles', [this.maxFiles])}</span>\n </q2-btn>\n </div>\n )}\n <input\n aria-describedby={(!!this.description && 'description') || undefined}\n class=\"sr\"\n id=\"file-field\"\n onChange={this.grabSelectedFiles}\n ref={el => (this.browseButtonInput = el ?? this.browseButtonInput)}\n type=\"file\"\n test-id=\"file-input\"\n disabled={disabled}\n multiple\n tabIndex={-1}\n />\n <div class=\"file-list-container\">\n <q2-list class=\"file-list\">\n {this.displayedFiles.map(file => (\n <q2-item\n class={this.getFileItemClasses(file.file.name)}\n key={file.file.name}\n onAnimationEnd={this.getAnimationendHandlerToRemoveFileItem(file.file.name)}\n >\n <div slot=\"decorator\">\n {file.status === 'invalid-type' ||\n file.status === 'over-size-limit' ||\n file.status === 'failed' ||\n file.status === 'over-max-files-limit' ? (\n <q2-icon\n class=\"icon-error\"\n type=\"error\"\n ></q2-icon>\n ) : file.status === 'in-progress' ? (\n <q2-loading\n class=\"file-item-loading\"\n hide-from-screen-readers\n ></q2-loading>\n ) : (\n <q2-icon\n class=\"icon-success\"\n type=\"success\"\n ></q2-icon>\n )}\n </div>\n <div slot=\"header\">{file.file.name}</div>\n <div\n class=\"file-item-info\"\n slot=\"body\"\n >\n {this.getFileItemStatusMessage(file)}\n </div>\n <div slot=\"action\">\n <q2-btn\n class=\"dismiss-button\"\n intent=\"neutral-text\"\n hide-label=\"true\"\n label={this.getFileItemButtonLabel(file)}\n onClick={this.getClickHandlerToRemoveFileItem(file.file.name)}\n disabled={disabled}\n >\n <q2-icon type=\"close\"></q2-icon>\n </q2-btn>\n </div>\n </q2-item>\n ))}\n </q2-list>\n </div>\n </div>\n );\n };\n\n // #endregion\n}\n"],"version":3}
@@ -14,7 +14,7 @@ const Q2Form$1 = /*@__PURE__*/ proxyCustomElement(class Q2Form extends HTMLEleme
14
14
  // #endregion
15
15
  // #region Render Methods
16
16
  render() {
17
- return (h("div", { key: 'b01b965b3fc436b4155245fa747e4c8922304114', class: "container" }, h("slot", { key: '039fd27f2a80825f14a6247eb330eac983638389' })));
17
+ return (h("div", { key: '96d3b548652662f480c9ad0fccb8c403aa50c0b9', class: "container" }, h("slot", { key: 'a55f0eed7d6fd14a3dbd13d4b57d83586ced9225' })));
18
18
  }
19
19
  static get style() { return q2FormCss; }
20
20
  }, [1, "q2-form", {
@@ -72,7 +72,7 @@ const Q2FormattedText$1 = /*@__PURE__*/ proxyCustomElement(class Q2FormattedText
72
72
  // #region Render Methods
73
73
  render() {
74
74
  const { formattedTextClasses } = this;
75
- return (h("div", { key: '9345b2829e7ac6dd1e5e308e1b840dcb298dbc0d', class: formattedTextClasses, "aria-label": this.formattedValue }, h("span", { key: '4687a60218658aeced2507ffd9f5eef6c5c9b40e' }, this.formattedValue)));
75
+ return (h("div", { key: '1256ba757a96ce740f5a76c7fd036373b83a83b7', class: formattedTextClasses, "aria-label": this.formattedValue }, h("span", { key: '90ea1f7b56b095e077711fe759c29e120178bc1a' }, this.formattedValue)));
76
76
  }
77
77
  static get watchers() { return {
78
78
  "value": ["propsUpdated"],
@@ -1,4 +1,5 @@
1
1
  import { proxyCustomElement, HTMLElement, h, Host } from '@stencil/core/internal/client';
2
+ import { a as hasValidParent } from './component.js';
2
3
 
3
4
  const q2GridAreaCss = ":host{--grid-column-start:\"\";--grid-column-end:\"\";--grid-row-start:\"\";--grid-row-end:\"\";--justify-self:\"\";--align-self:\"\";--z-index:\"\";--xs-grid-column-start:\"\";--xs-grid-column-end:\"\";--xs-grid-row-start:\"\";--xs-grid-row-end:\"\";--xs-justify-self:\"\";--xs-align-self:\"\";--xs-z-index:\"\";--sm-grid-column-start:\"\";--sm-grid-column-end:\"\";--sm-grid-row-start:\"\";--sm-grid-row-end:\"\";--sm-justify-self:\"\";--sm-align-self:\"\";--sm-z-index:\"\";--md-grid-column-start:\"\";--md-grid-column-end:\"\";--md-grid-row-start:\"\";--md-grid-row-end:\"\";--md-justify-self:\"\";--md-align-self:\"\";--md-z-index:\"\";--lg-grid-column-start:\"\";--lg-grid-column-end:\"\";--lg-grid-row-start:\"\";--lg-grid-row-end:\"\";--lg-justify-self:\"\";--lg-align-self:\"\";--lg-z-index:\"\";--xl-grid-column-start:\"\";--xl-grid-column-end:\"\";--xl-grid-row-start:\"\";--xl-grid-row-end:\"\";--xl-justify-self:\"\";--xl-align-self:\"\";--xl-z-index:\"\"}:host{grid-column-start:var(--grid-column-start);grid-column-end:var(--grid-column-end);grid-row-start:var(--grid-row-start);grid-row-end:var(--grid-row-end);justify-self:var(--justify-self);align-self:var(--align-self);z-index:var(--z-index)}@media screen and (min-width: 480px){:host{grid-column-start:var(--xs-grid-column-start);grid-column-end:var(--xs-grid-column-end);grid-row-start:var(--xs-grid-row-start);grid-row-end:var(--xs-grid-row-end);justify-self:var(--xs-justify-self);align-self:var(--xs-align-self);z-index:var(--xs-z-index)}}@media screen and (min-width: 768px){:host{grid-column-start:var(--sm-grid-column-start);grid-column-end:var(--sm-grid-column-end);grid-row-start:var(--sm-grid-row-start);grid-row-end:var(--sm-grid-row-end);justify-self:var(--sm-justify-self);align-self:var(--sm-align-self);z-index:var(--sm-z-index)}}@media screen and (min-width: 992px){:host{grid-column-start:var(--md-grid-column-start);grid-column-end:var(--md-grid-column-end);grid-row-start:var(--md-grid-row-start);grid-row-end:var(--md-grid-row-end);justify-self:var(--md-justify-self);align-self:var(--md-align-self);z-index:var(--md-z-index)}}@media screen and (min-width: 1200px){:host{grid-column-start:var(--lg-grid-column-start);grid-column-end:var(--lg-grid-column-end);grid-row-start:var(--lg-grid-row-start);grid-row-end:var(--lg-grid-row-end);justify-self:var(--lg-justify-self);align-self:var(--lg-align-self);z-index:var(--lg-z-index)}}@media screen and (min-width: 1400px){:host{grid-column-start:var(--xl-grid-column-start);grid-column-end:var(--xl-grid-column-end);grid-row-start:var(--xl-grid-row-start);grid-row-end:var(--xl-grid-row-end);justify-self:var(--xl-justify-self);align-self:var(--xl-align-self);z-index:var(--xl-z-index)}}";
4
5
 
@@ -7,6 +8,7 @@ const Q2GridArea$1 = /*@__PURE__*/ proxyCustomElement(class Q2GridArea extends H
7
8
  super();
8
9
  this.__registerHost();
9
10
  this.__attachShadow();
11
+ // #endregion
10
12
  // #region Public Property API
11
13
  /**
12
14
  * Sets the vertical alignment behavior of the q2-grid-area component within its grid track at the baseline viewport size.
@@ -33,6 +35,11 @@ const Q2GridArea$1 = /*@__PURE__*/ proxyCustomElement(class Q2GridArea extends H
33
35
  this.zIndex = 'auto';
34
36
  }
35
37
  // #endregion
38
+ // #region Component Lifecycle Events
39
+ componentWillLoad() {
40
+ hasValidParent(this.hostElement, 'q2-grid');
41
+ }
42
+ // #endregion
36
43
  // #region Local Methods
37
44
  get computedLgZIndex() {
38
45
  return this.lgZIndex || this.lgZIndex === 0 ? this.lgZIndex : this.computedMdZIndex;
@@ -102,8 +109,9 @@ const Q2GridArea$1 = /*@__PURE__*/ proxyCustomElement(class Q2GridArea extends H
102
109
  '--xl-align-self': this.xlAlign || this.lgAlign || this.mdAlign || this.smAlign || this.xsAlign || this.align,
103
110
  '--xl-z-index': `${this.computedXlZIndex}`,
104
111
  };
105
- return (h(Host, { key: '0bfd50a48ea3be1dcf61df020a5cc3286667b482', style: q2GridAreaStyles }, h("slot", { key: '6a0ffa63252a784acc26ce7d30a8dec0d8218b19' })));
112
+ return (h(Host, { key: '7e2f7933ba52dd99f90350dfb3a2778d1c1a37d0', style: q2GridAreaStyles }, h("slot", { key: '39371e8a0fb1c1bd9c248ba5b8095f9bdd6022e7' })));
106
113
  }
114
+ get hostElement() { return this; }
107
115
  static get style() { return q2GridAreaCss; }
108
116
  }, [1, "q2-grid-area", {
109
117
  "align": [513],
@@ -1 +1 @@
1
- {"file":"q2-grid-area.js","mappings":"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","names":["Q2GridArea","__stencil_proxyCustomElement"],"sources":["src/components/q2-grid-area/q2-grid-area.scss?tag=q2-grid-area&encapsulation=shadow","src/components/q2-grid-area/q2-grid-area.tsx"],"sourcesContent":["@import '../../styles/functions.scss';\n@import '../../styles/variables.scss';\n\n:host {\n // base:\n --grid-column-start: '';\n --grid-column-end: '';\n --grid-row-start: '';\n --grid-row-end: '';\n --justify-self: '';\n --align-self: '';\n --z-index: '';\n // xs:\n --xs-grid-column-start: '';\n --xs-grid-column-end: '';\n --xs-grid-row-start: '';\n --xs-grid-row-end: '';\n --xs-justify-self: '';\n --xs-align-self: '';\n --xs-z-index: '';\n // sm:\n --sm-grid-column-start: '';\n --sm-grid-column-end: '';\n --sm-grid-row-start: '';\n --sm-grid-row-end: '';\n --sm-justify-self: '';\n --sm-align-self: '';\n --sm-z-index: '';\n // md:\n --md-grid-column-start: '';\n --md-grid-column-end: '';\n --md-grid-row-start: '';\n --md-grid-row-end: '';\n --md-justify-self: '';\n --md-align-self: '';\n --md-z-index: '';\n // lg:\n --lg-grid-column-start: '';\n --lg-grid-column-end: '';\n --lg-grid-row-start: '';\n --lg-grid-row-end: '';\n --lg-justify-self: '';\n --lg-align-self: '';\n --lg-z-index: '';\n // xl:\n --xl-grid-column-start: '';\n --xl-grid-column-end: '';\n --xl-grid-row-start: '';\n --xl-grid-row-end: '';\n --xl-justify-self: '';\n --xl-align-self: '';\n --xl-z-index: '';\n}\n// base:\n@include generate-q2-grid-area-styles(\n var(--grid-column-start),\n var(--grid-column-end),\n var(--grid-row-start),\n var(--grid-row-end),\n var(--justify-self),\n var(--align-self),\n var(--z-index)\n);\n// xs, sm, md, lg, xl:\n@each $breakpoint in $breakpoint-list {\n @include breakpoint($breakpoint) {\n @include generate-q2-grid-area-styles(\n var(--#{$breakpoint}-grid-column-start),\n var(--#{$breakpoint}-grid-column-end),\n var(--#{$breakpoint}-grid-row-start),\n var(--#{$breakpoint}-grid-row-end),\n var(--#{$breakpoint}-justify-self),\n var(--#{$breakpoint}-align-self),\n var(--#{$breakpoint}-z-index)\n );\n }\n}\n","import { Component, h, Prop, Host } from '@stencil/core';\n\nexport type TQ2GridAreaColumnStartOptions = 'auto' | number;\nexport type TQ2GridAreaColumnSpanOptions = number;\nexport type TQ2GridAreaRowStartOptions = 'auto' | number;\nexport type TQ2GridAreaRowSpanOptions = number;\nexport type TQ2GridAreaJustifyOptions = 'auto' | 'stretch' | 'start' | 'center' | 'end';\nexport type TQ2GridAreaAlignOptions = 'auto' | 'stretch' | 'start' | 'center' | 'end';\nexport type TQ2GridAreaZIndexOptions = 'auto' | number;\n\n/**\n * @name Grid Area\n * @category Display\n * @summary Use as a positioned cell within a Grid layout.\n */\n@Component({ tag: 'q2-grid-area', shadow: true, styleUrl: 'q2-grid-area.scss' })\nexport class Q2GridArea {\n // #region Public Property API\n\n /**\n * Sets the vertical alignment behavior of the q2-grid-area component within its grid track at the baseline viewport size.\n * When set to `auto`, the grid area will inherit this property from the parent q2-grid component.\n */\n @Prop({ reflect: true })\n align: TQ2GridAreaAlignOptions = 'auto';\n\n /** Sets the column span amount of the grid area at the baseline viewport size.*/\n @Prop({ reflect: true })\n columnSpan: TQ2GridAreaColumnSpanOptions = 1;\n\n /** Sets the starting column of the grid area at the baseline viewport size.*/\n @Prop({ reflect: true })\n columnStart: TQ2GridAreaColumnStartOptions = 'auto';\n\n /**\n * Sets the horizontal alignment behavior of the q2-grid-area component within its grid track at the baseline viewport size.\n * When set to `auto`, the grid area will inherit this property from the parent q2-grid component.\n */\n @Prop({ reflect: true })\n justify: TQ2GridAreaJustifyOptions = 'auto';\n\n /**\n * Sets the vertical alignment behavior of the q2-grid-area component within its grid track at the baseline viewport size.\n * When set to `auto`, the grid area will inherit this property from the parent q2-grid component.\n */\n @Prop({ reflect: true })\n lgAlign: TQ2GridAreaAlignOptions;\n\n /** Sets the column span amount of the grid area at the LG viewport size.*/\n @Prop({ reflect: true })\n lgColumnSpan: TQ2GridAreaColumnSpanOptions;\n\n /**\n * Sets the starting column of the grid area at the LG viewport size.\n * When set to `auto`, the grid area will automatically start at the first available column.\n */\n @Prop({ reflect: true })\n lgColumnStart: TQ2GridAreaColumnStartOptions;\n\n /**\n * Sets the horizontal alignment behavior of the q2-grid-area component within its grid track at the baseline viewport size.\n * When set to `auto`, the grid area will inherit this property from the parent q2-grid component.\n */\n @Prop({ reflect: true })\n lgJustify: TQ2GridAreaJustifyOptions;\n\n /** Sets the row span amount of the grid area at the LG viewport size.*/\n @Prop({ reflect: true })\n lgRowSpan: TQ2GridAreaRowSpanOptions;\n\n /**\n * Sets the starting row of the grid area at the LG viewport size.\n * When set to `auto`, the grid area will automatically start at the first available row.\n */\n @Prop({ reflect: true })\n lgRowStart: TQ2GridAreaRowStartOptions;\n\n /** Sets the z-index of the grid area at the LG viewport size.*/\n @Prop({ reflect: true })\n lgZIndex: TQ2GridAreaZIndexOptions;\n\n /**\n * Sets the vertical alignment behavior of the q2-grid-area component within its grid track at the baseline viewport size.\n * When set to `auto`, the grid area will inherit this property from the parent q2-grid component.\n */\n @Prop({ reflect: true })\n mdAlign: TQ2GridAreaAlignOptions;\n\n /** Sets the column span amount of the grid area at the MD viewport size.*/\n @Prop({ reflect: true })\n mdColumnSpan: TQ2GridAreaColumnSpanOptions;\n\n /**\n * Sets the starting column of the grid area at the MD viewport size.\n * When set to `auto`, the grid area will automatically start at the first available column.\n */\n @Prop({ reflect: true })\n mdColumnStart: TQ2GridAreaColumnStartOptions;\n\n /**\n * Sets the horizontal alignment behavior of the q2-grid-area component within its grid track at the baseline viewport size.\n * When set to `auto`, the grid area will inherit this property from the parent q2-grid component.\n */\n @Prop({ reflect: true })\n mdJustify: TQ2GridAreaJustifyOptions;\n\n /** Sets the row span amount of the grid area at the MD viewport size.*/\n @Prop({ reflect: true })\n mdRowSpan: TQ2GridAreaRowSpanOptions;\n\n /**\n * Sets the starting row of the grid area at the MD viewport size.\n * When set to `auto`, the grid area will automatically start at the first available row.\n */\n @Prop({ reflect: true })\n mdRowStart: TQ2GridAreaRowStartOptions;\n\n /** Sets the z-index of the grid area at the MD viewport size.*/\n @Prop({ reflect: true })\n mdZIndex: TQ2GridAreaZIndexOptions;\n\n /** Sets the row span amount of the grid area at the baseline viewport size.*/\n @Prop({ reflect: true })\n rowSpan: TQ2GridAreaRowSpanOptions = 1;\n\n /**\n * Sets the starting row of the grid area at the baseline viewport size.\n * When set to `auto`, the grid area will automatically start at the first available row.\n */\n @Prop({ reflect: true })\n rowStart: TQ2GridAreaRowStartOptions = 'auto';\n\n /**\n * Sets the vertical alignment behavior of the q2-grid-area component within its grid track at the baseline viewport size.\n * When set to `auto`, the grid area will inherit this property from the parent q2-grid component.\n */\n @Prop({ reflect: true })\n smAlign: TQ2GridAreaAlignOptions;\n\n /** Sets the column span amount of the grid area at the SM viewport size.*/\n @Prop({ reflect: true })\n smColumnSpan: TQ2GridAreaColumnSpanOptions;\n\n /**\n * Sets the starting column of the grid area at the SM viewport size.\n * When set to `auto`, the grid area will automatically start at the first available column.\n */\n @Prop({ reflect: true })\n smColumnStart: TQ2GridAreaColumnStartOptions;\n\n /**\n * Sets the horizontal alignment behavior of the q2-grid-area component within its grid track at the baseline viewport size.\n * When set to `auto`, the grid area will inherit this property from the parent q2-grid component.\n */\n @Prop({ reflect: true })\n smJustify: TQ2GridAreaJustifyOptions;\n\n /** Sets the row span amount of the grid area at the SM viewport size.*/\n @Prop({ reflect: true })\n smRowSpan: TQ2GridAreaRowSpanOptions;\n\n /**\n * Sets the starting row of the grid area at the SM viewport size.\n * When set to `auto`, the grid area will automatically start at the first available row.\n */\n @Prop({ reflect: true })\n smRowStart: TQ2GridAreaRowStartOptions;\n\n /** Sets the z-index of the grid area at the SM viewport size.*/\n @Prop({ reflect: true })\n smZIndex: TQ2GridAreaZIndexOptions;\n\n /**\n * Sets the vertical alignment behavior of the q2-grid-area component within its grid track at the baseline viewport size.\n * When set to `auto`, the grid area will inherit this property from the parent q2-grid component.\n */\n @Prop({ reflect: true })\n xlAlign: TQ2GridAreaAlignOptions;\n\n /** Sets the column span amount of the grid area at the XL viewport size.*/\n @Prop({ reflect: true })\n xlColumnSpan: TQ2GridAreaColumnSpanOptions;\n\n /**\n * Sets the starting column of the grid area at the XL viewport size.\n * When set to `auto`, the grid area will automatically start at the first available column.\n */\n @Prop({ reflect: true })\n xlColumnStart: TQ2GridAreaColumnStartOptions;\n\n /**\n * Sets the horizontal alignment behavior of the q2-grid-area component within its grid track at the baseline viewport size.\n * When set to `auto`, the grid area will inherit this property from the parent q2-grid component.\n */\n @Prop({ reflect: true })\n xlJustify: TQ2GridAreaJustifyOptions;\n\n /** Sets the row span amount of the grid area at the XL viewport size.*/\n @Prop({ reflect: true })\n xlRowSpan: TQ2GridAreaRowSpanOptions;\n\n /**\n * Sets the starting row of the grid area at the XL viewport size.\n * When set to `auto`, the grid area will automatically start at the first available row.\n */\n @Prop({ reflect: true })\n xlRowStart: TQ2GridAreaRowStartOptions;\n\n /** Sets the z-index of the grid area at the XL viewport size.*/\n @Prop({ reflect: true })\n xlZIndex: TQ2GridAreaZIndexOptions;\n\n /**\n * Sets the vertical alignment behavior of the q2-grid-area component within its grid track at the baseline viewport size.\n * When set to `auto`, the grid area will inherit this property from the parent q2-grid component.\n */\n @Prop({ reflect: true })\n xsAlign: TQ2GridAreaAlignOptions;\n\n /** Sets the column span amount of the grid area at the XS viewport size.*/\n @Prop({ reflect: true })\n xsColumnSpan: TQ2GridAreaColumnSpanOptions;\n\n /**\n * Sets the starting column of the grid area at the XS viewport size.\n * When set to `auto`, the grid area will automatically start at the first available column.\n */\n @Prop({ reflect: true })\n xsColumnStart: TQ2GridAreaColumnStartOptions;\n\n /**\n * Sets the horizontal alignment behavior of the q2-grid-area component within its grid track at the baseline viewport size.\n * When set to `auto`, the grid area will inherit this property from the parent q2-grid component.\n */\n @Prop({ reflect: true })\n xsJustify: TQ2GridAreaJustifyOptions;\n\n /** Sets the row span amount of the grid area at the XS viewport size.*/\n @Prop({ reflect: true })\n xsRowSpan: TQ2GridAreaRowSpanOptions;\n\n /**\n * Sets the starting row of the grid area at the XS viewport size.\n * When set to `auto`, the grid area will automatically start at the first available row.\n */\n @Prop({ reflect: true })\n xsRowStart: TQ2GridAreaRowStartOptions;\n\n /** Sets the z-index of the grid area at the XS viewport size.*/\n @Prop({ reflect: true })\n xsZIndex: TQ2GridAreaZIndexOptions;\n\n /** Sets the z-index of the grid area at the baseline viewport size.*/\n @Prop({ reflect: true })\n zIndex: TQ2GridAreaZIndexOptions = 'auto';\n\n // #endregion\n // #region Local Methods\n\n get computedLgZIndex() {\n return this.lgZIndex || this.lgZIndex === 0 ? this.lgZIndex : this.computedMdZIndex;\n }\n\n get computedMdZIndex() {\n return this.mdZIndex || this.mdZIndex === 0 ? this.mdZIndex : this.computedSmZIndex;\n }\n\n get computedSmZIndex() {\n return this.smZIndex || this.smZIndex === 0 ? this.smZIndex : this.computedXsZIndex;\n }\n\n get computedXlZIndex() {\n return this.xlZIndex || this.xlZIndex === 0 ? this.xlZIndex : this.computedLgZIndex;\n }\n\n get computedXsZIndex() {\n return this.xsZIndex || this.xsZIndex === 0 ? this.xsZIndex : this.zIndex;\n }\n\n // #endregion\n // #region Render Methods\n\n render() {\n const q2GridAreaStyles: { [key: string]: string } = {\n // base:\n '--grid-column-start': `${this.columnStart}`,\n '--grid-column-end': `span ${this.columnSpan}`,\n '--grid-row-start': `${this.rowStart}`,\n '--grid-row-end': `span ${this.rowSpan}`,\n '--justify-self': this.justify,\n '--align-self': this.align,\n '--z-index': `${this.zIndex}`,\n // xs:\n '--xs-grid-column-start': `${this.xsColumnStart || this.columnStart}`,\n '--xs-grid-column-end': `span ${this.xsColumnSpan || this.columnSpan}`,\n '--xs-grid-row-start': `${this.xsRowStart || this.rowStart}`,\n '--xs-grid-row-end': `span ${this.xsRowSpan || this.rowSpan}`,\n '--xs-justify-self': this.xsJustify || this.justify,\n '--xs-align-self': this.xsAlign || this.align,\n '--xs-z-index': `${this.computedXsZIndex}`,\n // sm:\n '--sm-grid-column-start': `${this.smColumnStart || this.xsColumnStart || this.columnStart}`,\n '--sm-grid-column-end': `span ${this.smColumnSpan || this.xsColumnSpan || this.columnSpan}`,\n '--sm-grid-row-start': `${this.smRowStart || this.xsRowStart || this.rowStart}`,\n '--sm-grid-row-end': `span ${this.smRowSpan || this.xsRowSpan || this.rowSpan}`,\n '--sm-justify-self': this.smJustify || this.xsJustify || this.justify,\n '--sm-align-self': this.smAlign || this.xsAlign || this.align,\n '--sm-z-index': `${this.computedSmZIndex}`,\n // md:\n '--md-grid-column-start': `${this.mdColumnStart || this.smColumnStart || this.xsColumnStart || this.columnStart}`,\n '--md-grid-column-end': `span ${this.mdColumnSpan || this.smColumnSpan || this.xsColumnSpan || this.columnSpan}`,\n '--md-grid-row-start': `${this.mdRowStart || this.smRowStart || this.xsRowStart || this.rowStart}`,\n '--md-grid-row-end': `span ${this.mdRowSpan || this.smRowSpan || this.xsRowSpan || this.rowSpan}`,\n '--md-justify-self': this.mdJustify || this.smJustify || this.xsJustify || this.justify,\n '--md-align-self': this.mdAlign || this.smAlign || this.xsAlign || this.align,\n '--md-z-index': `${this.computedMdZIndex}`,\n // lg:\n '--lg-grid-column-start': `${this.lgColumnStart || this.mdColumnStart || this.smColumnStart || this.xsColumnStart || this.columnStart}`,\n '--lg-grid-column-end': `span ${this.lgColumnSpan || this.mdColumnSpan || this.smColumnSpan || this.xsColumnSpan || this.columnSpan}`,\n '--lg-grid-row-start': `${this.lgRowStart || this.mdRowStart || this.smRowStart || this.xsRowStart || this.rowStart}`,\n '--lg-grid-row-end': `span ${this.lgRowSpan || this.mdRowSpan || this.smRowSpan || this.xsRowSpan || this.rowSpan}`,\n '--lg-justify-self': this.lgJustify || this.mdJustify || this.smJustify || this.xsJustify || this.justify,\n '--lg-align-self': this.lgAlign || this.mdAlign || this.smAlign || this.xsAlign || this.align,\n '--lg-z-index': `${this.computedLgZIndex}`,\n // xl:\n '--xl-grid-column-start': `${this.xlColumnStart || this.lgColumnStart || this.mdColumnStart || this.smColumnStart || this.xsColumnStart || this.columnStart}`,\n '--xl-grid-column-end': `span ${this.xlColumnSpan || this.lgColumnSpan || this.mdColumnSpan || this.smColumnSpan || this.xsColumnSpan || this.columnSpan}`,\n '--xl-grid-row-start': `${this.xlRowStart || this.lgRowStart || this.mdRowStart || this.smRowStart || this.xsRowStart || this.rowStart}`,\n '--xl-grid-row-end': `span ${this.xlRowSpan || this.lgRowSpan || this.mdRowSpan || this.smRowSpan || this.xsRowSpan || this.rowSpan}`,\n '--xl-justify-self':\n this.xlJustify || this.lgJustify || this.mdJustify || this.smJustify || this.xsJustify || this.justify,\n '--xl-align-self':\n this.xlAlign || this.lgAlign || this.mdAlign || this.smAlign || this.xsAlign || this.align,\n '--xl-z-index': `${this.computedXlZIndex}`,\n };\n\n return (\n <Host style={q2GridAreaStyles}>\n <slot />\n </Host>\n );\n }\n\n // #endregion\n}\n"],"version":3}
1
+ {"file":"q2-grid-area.js","mappings":"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","names":["Q2GridArea","__stencil_proxyCustomElement"],"sources":["src/components/q2-grid-area/q2-grid-area.scss?tag=q2-grid-area&encapsulation=shadow","src/components/q2-grid-area/q2-grid-area.tsx"],"sourcesContent":["@import '../../styles/functions.scss';\n@import '../../styles/variables.scss';\n\n:host {\n // base:\n --grid-column-start: '';\n --grid-column-end: '';\n --grid-row-start: '';\n --grid-row-end: '';\n --justify-self: '';\n --align-self: '';\n --z-index: '';\n // xs:\n --xs-grid-column-start: '';\n --xs-grid-column-end: '';\n --xs-grid-row-start: '';\n --xs-grid-row-end: '';\n --xs-justify-self: '';\n --xs-align-self: '';\n --xs-z-index: '';\n // sm:\n --sm-grid-column-start: '';\n --sm-grid-column-end: '';\n --sm-grid-row-start: '';\n --sm-grid-row-end: '';\n --sm-justify-self: '';\n --sm-align-self: '';\n --sm-z-index: '';\n // md:\n --md-grid-column-start: '';\n --md-grid-column-end: '';\n --md-grid-row-start: '';\n --md-grid-row-end: '';\n --md-justify-self: '';\n --md-align-self: '';\n --md-z-index: '';\n // lg:\n --lg-grid-column-start: '';\n --lg-grid-column-end: '';\n --lg-grid-row-start: '';\n --lg-grid-row-end: '';\n --lg-justify-self: '';\n --lg-align-self: '';\n --lg-z-index: '';\n // xl:\n --xl-grid-column-start: '';\n --xl-grid-column-end: '';\n --xl-grid-row-start: '';\n --xl-grid-row-end: '';\n --xl-justify-self: '';\n --xl-align-self: '';\n --xl-z-index: '';\n}\n// base:\n@include generate-q2-grid-area-styles(\n var(--grid-column-start),\n var(--grid-column-end),\n var(--grid-row-start),\n var(--grid-row-end),\n var(--justify-self),\n var(--align-self),\n var(--z-index)\n);\n// xs, sm, md, lg, xl:\n@each $breakpoint in $breakpoint-list {\n @include breakpoint($breakpoint) {\n @include generate-q2-grid-area-styles(\n var(--#{$breakpoint}-grid-column-start),\n var(--#{$breakpoint}-grid-column-end),\n var(--#{$breakpoint}-grid-row-start),\n var(--#{$breakpoint}-grid-row-end),\n var(--#{$breakpoint}-justify-self),\n var(--#{$breakpoint}-align-self),\n var(--#{$breakpoint}-z-index)\n );\n }\n}\n","import { Component, h, Prop, Host, Element } from '@stencil/core';\nimport { hasValidParent } from '@/utils/component';\n\nexport type TQ2GridAreaColumnStartOptions = 'auto' | number;\nexport type TQ2GridAreaColumnSpanOptions = number;\nexport type TQ2GridAreaRowStartOptions = 'auto' | number;\nexport type TQ2GridAreaRowSpanOptions = number;\nexport type TQ2GridAreaJustifyOptions = 'auto' | 'stretch' | 'start' | 'center' | 'end';\nexport type TQ2GridAreaAlignOptions = 'auto' | 'stretch' | 'start' | 'center' | 'end';\nexport type TQ2GridAreaZIndexOptions = 'auto' | number;\n\n/**\n * @name Grid Area\n * @category Display\n * @summary Use as a positioned cell within a Grid layout.\n */\n@Component({ tag: 'q2-grid-area', shadow: true, styleUrl: 'q2-grid-area.scss' })\nexport class Q2GridArea {\n // #region Host HTML Element\n\n @Element()\n hostElement: HTMLElement;\n\n // #endregion\n // #region Public Property API\n\n /**\n * Sets the vertical alignment behavior of the q2-grid-area component within its grid track at the baseline viewport size.\n * When set to `auto`, the grid area will inherit this property from the parent q2-grid component.\n */\n @Prop({ reflect: true })\n align: TQ2GridAreaAlignOptions = 'auto';\n\n /** Sets the column span amount of the grid area at the baseline viewport size.*/\n @Prop({ reflect: true })\n columnSpan: TQ2GridAreaColumnSpanOptions = 1;\n\n /** Sets the starting column of the grid area at the baseline viewport size.*/\n @Prop({ reflect: true })\n columnStart: TQ2GridAreaColumnStartOptions = 'auto';\n\n /**\n * Sets the horizontal alignment behavior of the q2-grid-area component within its grid track at the baseline viewport size.\n * When set to `auto`, the grid area will inherit this property from the parent q2-grid component.\n */\n @Prop({ reflect: true })\n justify: TQ2GridAreaJustifyOptions = 'auto';\n\n /**\n * Sets the vertical alignment behavior of the q2-grid-area component within its grid track at the baseline viewport size.\n * When set to `auto`, the grid area will inherit this property from the parent q2-grid component.\n */\n @Prop({ reflect: true })\n lgAlign: TQ2GridAreaAlignOptions;\n\n /** Sets the column span amount of the grid area at the LG viewport size.*/\n @Prop({ reflect: true })\n lgColumnSpan: TQ2GridAreaColumnSpanOptions;\n\n /**\n * Sets the starting column of the grid area at the LG viewport size.\n * When set to `auto`, the grid area will automatically start at the first available column.\n */\n @Prop({ reflect: true })\n lgColumnStart: TQ2GridAreaColumnStartOptions;\n\n /**\n * Sets the horizontal alignment behavior of the q2-grid-area component within its grid track at the baseline viewport size.\n * When set to `auto`, the grid area will inherit this property from the parent q2-grid component.\n */\n @Prop({ reflect: true })\n lgJustify: TQ2GridAreaJustifyOptions;\n\n /** Sets the row span amount of the grid area at the LG viewport size.*/\n @Prop({ reflect: true })\n lgRowSpan: TQ2GridAreaRowSpanOptions;\n\n /**\n * Sets the starting row of the grid area at the LG viewport size.\n * When set to `auto`, the grid area will automatically start at the first available row.\n */\n @Prop({ reflect: true })\n lgRowStart: TQ2GridAreaRowStartOptions;\n\n /** Sets the z-index of the grid area at the LG viewport size.*/\n @Prop({ reflect: true })\n lgZIndex: TQ2GridAreaZIndexOptions;\n\n /**\n * Sets the vertical alignment behavior of the q2-grid-area component within its grid track at the baseline viewport size.\n * When set to `auto`, the grid area will inherit this property from the parent q2-grid component.\n */\n @Prop({ reflect: true })\n mdAlign: TQ2GridAreaAlignOptions;\n\n /** Sets the column span amount of the grid area at the MD viewport size.*/\n @Prop({ reflect: true })\n mdColumnSpan: TQ2GridAreaColumnSpanOptions;\n\n /**\n * Sets the starting column of the grid area at the MD viewport size.\n * When set to `auto`, the grid area will automatically start at the first available column.\n */\n @Prop({ reflect: true })\n mdColumnStart: TQ2GridAreaColumnStartOptions;\n\n /**\n * Sets the horizontal alignment behavior of the q2-grid-area component within its grid track at the baseline viewport size.\n * When set to `auto`, the grid area will inherit this property from the parent q2-grid component.\n */\n @Prop({ reflect: true })\n mdJustify: TQ2GridAreaJustifyOptions;\n\n /** Sets the row span amount of the grid area at the MD viewport size.*/\n @Prop({ reflect: true })\n mdRowSpan: TQ2GridAreaRowSpanOptions;\n\n /**\n * Sets the starting row of the grid area at the MD viewport size.\n * When set to `auto`, the grid area will automatically start at the first available row.\n */\n @Prop({ reflect: true })\n mdRowStart: TQ2GridAreaRowStartOptions;\n\n /** Sets the z-index of the grid area at the MD viewport size.*/\n @Prop({ reflect: true })\n mdZIndex: TQ2GridAreaZIndexOptions;\n\n /** Sets the row span amount of the grid area at the baseline viewport size.*/\n @Prop({ reflect: true })\n rowSpan: TQ2GridAreaRowSpanOptions = 1;\n\n /**\n * Sets the starting row of the grid area at the baseline viewport size.\n * When set to `auto`, the grid area will automatically start at the first available row.\n */\n @Prop({ reflect: true })\n rowStart: TQ2GridAreaRowStartOptions = 'auto';\n\n /**\n * Sets the vertical alignment behavior of the q2-grid-area component within its grid track at the baseline viewport size.\n * When set to `auto`, the grid area will inherit this property from the parent q2-grid component.\n */\n @Prop({ reflect: true })\n smAlign: TQ2GridAreaAlignOptions;\n\n /** Sets the column span amount of the grid area at the SM viewport size.*/\n @Prop({ reflect: true })\n smColumnSpan: TQ2GridAreaColumnSpanOptions;\n\n /**\n * Sets the starting column of the grid area at the SM viewport size.\n * When set to `auto`, the grid area will automatically start at the first available column.\n */\n @Prop({ reflect: true })\n smColumnStart: TQ2GridAreaColumnStartOptions;\n\n /**\n * Sets the horizontal alignment behavior of the q2-grid-area component within its grid track at the baseline viewport size.\n * When set to `auto`, the grid area will inherit this property from the parent q2-grid component.\n */\n @Prop({ reflect: true })\n smJustify: TQ2GridAreaJustifyOptions;\n\n /** Sets the row span amount of the grid area at the SM viewport size.*/\n @Prop({ reflect: true })\n smRowSpan: TQ2GridAreaRowSpanOptions;\n\n /**\n * Sets the starting row of the grid area at the SM viewport size.\n * When set to `auto`, the grid area will automatically start at the first available row.\n */\n @Prop({ reflect: true })\n smRowStart: TQ2GridAreaRowStartOptions;\n\n /** Sets the z-index of the grid area at the SM viewport size.*/\n @Prop({ reflect: true })\n smZIndex: TQ2GridAreaZIndexOptions;\n\n /**\n * Sets the vertical alignment behavior of the q2-grid-area component within its grid track at the baseline viewport size.\n * When set to `auto`, the grid area will inherit this property from the parent q2-grid component.\n */\n @Prop({ reflect: true })\n xlAlign: TQ2GridAreaAlignOptions;\n\n /** Sets the column span amount of the grid area at the XL viewport size.*/\n @Prop({ reflect: true })\n xlColumnSpan: TQ2GridAreaColumnSpanOptions;\n\n /**\n * Sets the starting column of the grid area at the XL viewport size.\n * When set to `auto`, the grid area will automatically start at the first available column.\n */\n @Prop({ reflect: true })\n xlColumnStart: TQ2GridAreaColumnStartOptions;\n\n /**\n * Sets the horizontal alignment behavior of the q2-grid-area component within its grid track at the baseline viewport size.\n * When set to `auto`, the grid area will inherit this property from the parent q2-grid component.\n */\n @Prop({ reflect: true })\n xlJustify: TQ2GridAreaJustifyOptions;\n\n /** Sets the row span amount of the grid area at the XL viewport size.*/\n @Prop({ reflect: true })\n xlRowSpan: TQ2GridAreaRowSpanOptions;\n\n /**\n * Sets the starting row of the grid area at the XL viewport size.\n * When set to `auto`, the grid area will automatically start at the first available row.\n */\n @Prop({ reflect: true })\n xlRowStart: TQ2GridAreaRowStartOptions;\n\n /** Sets the z-index of the grid area at the XL viewport size.*/\n @Prop({ reflect: true })\n xlZIndex: TQ2GridAreaZIndexOptions;\n\n /**\n * Sets the vertical alignment behavior of the q2-grid-area component within its grid track at the baseline viewport size.\n * When set to `auto`, the grid area will inherit this property from the parent q2-grid component.\n */\n @Prop({ reflect: true })\n xsAlign: TQ2GridAreaAlignOptions;\n\n /** Sets the column span amount of the grid area at the XS viewport size.*/\n @Prop({ reflect: true })\n xsColumnSpan: TQ2GridAreaColumnSpanOptions;\n\n /**\n * Sets the starting column of the grid area at the XS viewport size.\n * When set to `auto`, the grid area will automatically start at the first available column.\n */\n @Prop({ reflect: true })\n xsColumnStart: TQ2GridAreaColumnStartOptions;\n\n /**\n * Sets the horizontal alignment behavior of the q2-grid-area component within its grid track at the baseline viewport size.\n * When set to `auto`, the grid area will inherit this property from the parent q2-grid component.\n */\n @Prop({ reflect: true })\n xsJustify: TQ2GridAreaJustifyOptions;\n\n /** Sets the row span amount of the grid area at the XS viewport size.*/\n @Prop({ reflect: true })\n xsRowSpan: TQ2GridAreaRowSpanOptions;\n\n /**\n * Sets the starting row of the grid area at the XS viewport size.\n * When set to `auto`, the grid area will automatically start at the first available row.\n */\n @Prop({ reflect: true })\n xsRowStart: TQ2GridAreaRowStartOptions;\n\n /** Sets the z-index of the grid area at the XS viewport size.*/\n @Prop({ reflect: true })\n xsZIndex: TQ2GridAreaZIndexOptions;\n\n /** Sets the z-index of the grid area at the baseline viewport size.*/\n @Prop({ reflect: true })\n zIndex: TQ2GridAreaZIndexOptions = 'auto';\n\n // #endregion\n // #region Component Lifecycle Events\n\n componentWillLoad() {\n hasValidParent(this.hostElement, 'q2-grid');\n }\n\n // #endregion\n // #region Local Methods\n\n get computedLgZIndex() {\n return this.lgZIndex || this.lgZIndex === 0 ? this.lgZIndex : this.computedMdZIndex;\n }\n\n get computedMdZIndex() {\n return this.mdZIndex || this.mdZIndex === 0 ? this.mdZIndex : this.computedSmZIndex;\n }\n\n get computedSmZIndex() {\n return this.smZIndex || this.smZIndex === 0 ? this.smZIndex : this.computedXsZIndex;\n }\n\n get computedXlZIndex() {\n return this.xlZIndex || this.xlZIndex === 0 ? this.xlZIndex : this.computedLgZIndex;\n }\n\n get computedXsZIndex() {\n return this.xsZIndex || this.xsZIndex === 0 ? this.xsZIndex : this.zIndex;\n }\n\n // #endregion\n // #region Render Methods\n\n render() {\n const q2GridAreaStyles: { [key: string]: string } = {\n // base:\n '--grid-column-start': `${this.columnStart}`,\n '--grid-column-end': `span ${this.columnSpan}`,\n '--grid-row-start': `${this.rowStart}`,\n '--grid-row-end': `span ${this.rowSpan}`,\n '--justify-self': this.justify,\n '--align-self': this.align,\n '--z-index': `${this.zIndex}`,\n // xs:\n '--xs-grid-column-start': `${this.xsColumnStart || this.columnStart}`,\n '--xs-grid-column-end': `span ${this.xsColumnSpan || this.columnSpan}`,\n '--xs-grid-row-start': `${this.xsRowStart || this.rowStart}`,\n '--xs-grid-row-end': `span ${this.xsRowSpan || this.rowSpan}`,\n '--xs-justify-self': this.xsJustify || this.justify,\n '--xs-align-self': this.xsAlign || this.align,\n '--xs-z-index': `${this.computedXsZIndex}`,\n // sm:\n '--sm-grid-column-start': `${this.smColumnStart || this.xsColumnStart || this.columnStart}`,\n '--sm-grid-column-end': `span ${this.smColumnSpan || this.xsColumnSpan || this.columnSpan}`,\n '--sm-grid-row-start': `${this.smRowStart || this.xsRowStart || this.rowStart}`,\n '--sm-grid-row-end': `span ${this.smRowSpan || this.xsRowSpan || this.rowSpan}`,\n '--sm-justify-self': this.smJustify || this.xsJustify || this.justify,\n '--sm-align-self': this.smAlign || this.xsAlign || this.align,\n '--sm-z-index': `${this.computedSmZIndex}`,\n // md:\n '--md-grid-column-start': `${this.mdColumnStart || this.smColumnStart || this.xsColumnStart || this.columnStart}`,\n '--md-grid-column-end': `span ${this.mdColumnSpan || this.smColumnSpan || this.xsColumnSpan || this.columnSpan}`,\n '--md-grid-row-start': `${this.mdRowStart || this.smRowStart || this.xsRowStart || this.rowStart}`,\n '--md-grid-row-end': `span ${this.mdRowSpan || this.smRowSpan || this.xsRowSpan || this.rowSpan}`,\n '--md-justify-self': this.mdJustify || this.smJustify || this.xsJustify || this.justify,\n '--md-align-self': this.mdAlign || this.smAlign || this.xsAlign || this.align,\n '--md-z-index': `${this.computedMdZIndex}`,\n // lg:\n '--lg-grid-column-start': `${this.lgColumnStart || this.mdColumnStart || this.smColumnStart || this.xsColumnStart || this.columnStart}`,\n '--lg-grid-column-end': `span ${this.lgColumnSpan || this.mdColumnSpan || this.smColumnSpan || this.xsColumnSpan || this.columnSpan}`,\n '--lg-grid-row-start': `${this.lgRowStart || this.mdRowStart || this.smRowStart || this.xsRowStart || this.rowStart}`,\n '--lg-grid-row-end': `span ${this.lgRowSpan || this.mdRowSpan || this.smRowSpan || this.xsRowSpan || this.rowSpan}`,\n '--lg-justify-self': this.lgJustify || this.mdJustify || this.smJustify || this.xsJustify || this.justify,\n '--lg-align-self': this.lgAlign || this.mdAlign || this.smAlign || this.xsAlign || this.align,\n '--lg-z-index': `${this.computedLgZIndex}`,\n // xl:\n '--xl-grid-column-start': `${this.xlColumnStart || this.lgColumnStart || this.mdColumnStart || this.smColumnStart || this.xsColumnStart || this.columnStart}`,\n '--xl-grid-column-end': `span ${this.xlColumnSpan || this.lgColumnSpan || this.mdColumnSpan || this.smColumnSpan || this.xsColumnSpan || this.columnSpan}`,\n '--xl-grid-row-start': `${this.xlRowStart || this.lgRowStart || this.mdRowStart || this.smRowStart || this.xsRowStart || this.rowStart}`,\n '--xl-grid-row-end': `span ${this.xlRowSpan || this.lgRowSpan || this.mdRowSpan || this.smRowSpan || this.xsRowSpan || this.rowSpan}`,\n '--xl-justify-self':\n this.xlJustify || this.lgJustify || this.mdJustify || this.smJustify || this.xsJustify || this.justify,\n '--xl-align-self':\n this.xlAlign || this.lgAlign || this.mdAlign || this.smAlign || this.xsAlign || this.align,\n '--xl-z-index': `${this.computedXlZIndex}`,\n };\n\n return (\n <Host style={q2GridAreaStyles}>\n <slot />\n </Host>\n );\n }\n\n // #endregion\n}\n"],"version":3}
@@ -37,6 +37,7 @@ const clipboard = "standard";
37
37
  const close = "standard";
38
38
  const coins = "standard";
39
39
  const compass = "standard";
40
+ const congrats = "standard";
40
41
  const conversation = "standard";
41
42
  const copy = "standard";
42
43
  const coupon = "standard";
@@ -84,6 +85,7 @@ const mail = "standard";
84
85
  const math = "standard";
85
86
  const medal = "standard";
86
87
  const megaphone = "standard";
88
+ const microdeposit = "standard";
87
89
  const microscope = "standard";
88
90
  const mortgage = "standard";
89
91
  const motorcycle = "standard";
@@ -187,6 +189,8 @@ var iconMap = {
187
189
  "brand-payrecs-filled": "brand",
188
190
  "brand-snapchat-color": "brand",
189
191
  "brand-snapchat-filled": "brand",
192
+ "brand-threads-color": "brand",
193
+ "brand-tiktok-color": "brand",
190
194
  "brand-twitter-color": "brand",
191
195
  "brand-twitter-filled": "brand",
192
196
  "brand-vimeo-color": "brand",
@@ -313,6 +317,7 @@ var iconMap = {
313
317
  close: close,
314
318
  coins: coins,
315
319
  compass: compass,
320
+ congrats: congrats,
316
321
  conversation: conversation,
317
322
  copy: copy,
318
323
  coupon: coupon,
@@ -423,6 +428,7 @@ var iconMap = {
423
428
  "message-forward": "standard",
424
429
  "message-reply": "standard",
425
430
  "message-response": "standard",
431
+ microdeposit: microdeposit,
426
432
  microscope: microscope,
427
433
  "mobile-button": "mobile",
428
434
  "mobile-edit": "mobile",
@@ -1 +1 @@
1
- {"file":"q2-icon2.js","mappings":"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","names":["__stencil_proxyCustomElement"],"sources":["src/components/q2-icon/q2-icon.scss?tag=q2-icon&encapsulation=shadow","src/components/q2-icon/q2-icon.tsx"],"sourcesContent":["@import '../../styles/host.scss';\n@import '../../styles/functions';\n\n:host {\n display: inline-block;\n height: var(--tct-icon-size, 24px);\n width: var(--tct-icon-size, 24px);\n position: relative;\n fill: none;\n}\n\n:host([inline]) {\n height: 1em;\n width: 1em;\n}\n\nsvg {\n display: block;\n position: absolute;\n top: 0;\n left: 0;\n stroke-width: var-list(--tct-icon-stroke-width, --t-icon-stroke-width, --tct-icon-group-stroke-width, 2);\n stroke-linecap: var-list(--tct-icon-cap, --t-icon-cap, round);\n stroke-linejoin: var-list(--tct-icon-cap, --t-icon-cap, round);\n transition: var(--tct-icon-transition, none);\n\n &.brand {\n stroke-width: var-list(--tct-icon-group-brand-stroke-width, 1);\n }\n\n &.browsersos {\n stroke-width: var-list(--tct-icon-group-browsersos-stroke-width, 1);\n }\n}\n\n.stroke-primary {\n stroke: var-list(--tct-icon-stroke-primary, --t-icon-stroke-primary, --t-text, currentcolor);\n transition: var(--tct-icon-stroke-primary-transition, none);\n}\n\n.stroke-secondary {\n stroke: var-list(--tct-icon-stroke-secondary, --t-icon-stroke-secondary, --t-text, currentcolor);\n transition: var(--tct-icon-stroke-secondary-transition, none);\n}\n\n.fill-primary {\n fill: var-list(--tct-icon-stroke-primary, --t-icon-stroke-primary, --t-text, currentcolor);\n transition: var(--tct-icon-stroke-primary-transition, none);\n}\n\n.fill-secondary {\n fill: var-list(--tct-icon-stroke-secondary, --t-icon-stroke-secondary, --t-text, currentcolor);\n transition: var(--tct-icon-stroke-secondary-transition, none);\n}\n\n.filled {\n fill: var-list(--tct-icon-fill, --comp-icon-fill, --t-icon-fill, none);\n transition: var(--tct-icon-fill-transition, none);\n}\n\n.brand-filled {\n fill: var-list(--tct-brand-icon-fill, --tct-icon-fill, currentColor);\n transition: var(--tct-icon-fill-transition, none);\n}\n\n.uniform {\n fill: var-list(--tct-icon-stroke-primary, --t-icon-stroke-primary, currentcolor);\n transition: var(--tct-icon-stroke-primary-transition, none);\n}\n\n:host([type='info']),\n:host([type='info-filled']) {\n --tct-icon-stroke-primary: transparent;\n --comp-status-color: #{var-list(--tct-stoplight-info, --const-stoplight-info, #0079c1)};\n}\n\n:host([type='success']),\n:host([type='success-filled']) {\n --tct-icon-stroke-primary: transparent;\n --comp-status-color: #{var-list(--tct-stoplight-success, --const-stoplight-success, #0e8a00)};\n}\n\n:host([type='warning']),\n:host([type='warning-filled']) {\n --tct-icon-stroke-primary: transparent;\n --comp-status-color: #{var-list(--tct-stoplight-warning, --const-stoplight-warning, #c35500)};\n}\n\n:host([type='error']),\n:host([type='error-filled']) {\n --tct-icon-stroke-primary: transparent;\n --comp-status-color: #{var-list(--tct-stoplight-alert, --const-stoplight-alert, #d20a0a)};\n}\n","import { Component, ComponentInterface, Prop, h, Element, Watch, getAssetPath, State } from '@stencil/core';\nimport { createGuid } from 'src/utils';\nimport { getOrCreateSpriteContainer } from '@/utils/sprites';\nimport iconMap from './assets/icon-map.json';\n\n/**\n * @name Icon\n * @category Display\n * @summary Use for displaying icons that represent actions, states, or concepts.\n */\n@Component({ tag: 'q2-icon', shadow: true, styleUrl: 'q2-icon.scss', assetsDirs: ['assets'] })\nexport class Q2Icon implements ComponentInterface {\n // #region Own Properties\n\n spriteGroup: SVGElement;\n spritePrefix: string = 'tecton-sprite-';\n spriteUse: SVGElement;\n\n // #endregion\n // #region Host HTML Element\n\n @Element()\n hostElement: HTMLElement;\n\n // #endregion\n // #region State Properties\n\n @State()\n iconClone: SVGSymbolElement;\n\n // #endregion\n // #region Public Property API\n\n /** Styles the component to have a `height` and `width` of `1em`, making it easy to place alongside text. */\n @Prop({ reflect: true })\n inline: boolean;\n\n /** The text that is presented by screen-readers when they encounter the icon. */\n @Prop({ reflect: true })\n label: string;\n\n /** The name of the icon to be displayed. */\n @Prop({ reflect: true })\n type: string;\n\n // #endregion\n // #region Component Lifecycle Events\n\n disconnectedCallback(): void {\n this.spriteGroup = null;\n this.spriteUse = null;\n }\n\n componentWillLoad() {\n this.handleIcon();\n }\n\n componentDidRender(): void {\n if (!this.iconClone) return;\n this.spriteGroup?.firstElementChild?.remove();\n const appendedClone = this.spriteGroup?.appendChild(this.iconClone);\n\n // We have to set the `href` attribute after the symbol is appended to the DOM to avoid a bug in Safari\n this.spriteUse?.setAttribute('href', `#${appendedClone.id}`);\n }\n\n // #endregion\n // #region Watchers\n\n @Watch('type')\n handleIcon() {\n if (this.isCustom) {\n this.setCustomSVGAttrs();\n } else if (this.type) {\n this.fetchSprite();\n } else {\n this.iconClone = null;\n this.spriteGroup?.firstElementChild?.remove();\n }\n }\n\n // #endregion\n // #region Local Methods\n\n get iconCloneViewBox() {\n return this.iconClone?.getAttribute('viewBox') ?? '0 0 24 24';\n }\n\n get isCustom() {\n return this.type === 'custom';\n }\n\n get spriteElement() {\n const { spriteId } = this;\n if (!spriteId) return;\n return document.querySelector<HTMLElement>(`#${spriteId}`);\n }\n\n get spriteEventName() {\n const { spriteFileName } = this;\n if (!spriteFileName) return;\n return `tct-loaded-${spriteFileName}`;\n }\n\n get spriteFileName() {\n if (this.isCustom) return;\n return iconMap[this.type];\n }\n\n get spriteId() {\n const { spriteFileName } = this;\n if (!spriteFileName) return;\n return `${this.spritePrefix}${spriteFileName}`;\n }\n\n checkForSprite() {\n const { spriteId, spriteEventName } = this;\n const spriteContainer = getOrCreateSpriteContainer();\n let spriteElement: HTMLElement = document.getElementById(spriteId);\n\n // If the sprite element exists and has the `data-loaded` attribute, we know we have everything we need\n if (spriteElement?.hasAttribute('data-loaded') ?? false) {\n this.cloneSpriteNode();\n return true;\n }\n\n // If the sprite element exists but does not have the `data-loaded` attribute, we know it's being loaded\n // We'll listen for the event that will be dispatched when the sprite is loaded\n spriteContainer.addEventListener(\n spriteEventName,\n () => {\n this.cloneSpriteNode();\n },\n { once: true }\n );\n\n // If the sprite element exists, we know it's being loaded and will be handled by the event listener\n if (spriteElement) return true;\n\n // If sprite element does not exist, create a placeholder\n // This will let other icons know the sprite is being loaded\n spriteElement = document.createElement('div');\n spriteElement.id = spriteId;\n spriteContainer.appendChild(spriteElement);\n return false;\n }\n\n cloneSpriteNode() {\n const spriteNode = document.getElementById(`tct-${this.type}`);\n this.iconClone = spriteNode ? (spriteNode.cloneNode(true) as SVGSymbolElement) : undefined;\n }\n\n async fetchSprite() {\n const { spriteFileName, spriteId, spriteEventName } = this;\n\n const spriteExists = this.checkForSprite();\n if (spriteExists) return;\n\n if (!spriteFileName) return;\n const spritePath = getAssetPath(`assets/${spriteFileName}.symbol.svg`);\n const response = await fetch(spritePath);\n const data = await response.text();\n const wrappingDiv = document.createElement('div');\n wrappingDiv.innerHTML = data;\n const svg = wrappingDiv.querySelector('svg');\n\n svg.id = spriteId;\n svg.setAttribute('data-loaded', '');\n\n let { spriteElement } = this;\n if (spriteElement?.tagName === 'SVG') return;\n\n if (typeof spriteElement.replaceWith === 'function') {\n spriteElement.replaceWith(svg);\n } else {\n spriteElement.parentNode.replaceChild(svg, spriteElement);\n }\n\n spriteElement = document.getElementById(spriteId);\n spriteElement.dispatchEvent(new CustomEvent(spriteEventName, { bubbles: true }));\n }\n\n setCustomSVGAttrs() {\n const innerSVG = this.hostElement.querySelector('svg');\n\n if (!innerSVG) return;\n\n innerSVG.setAttribute('role', 'img');\n innerSVG.setAttribute('xmlns', 'http://www.w3.org/2000/svg');\n\n const { label } = this;\n if (label) {\n const title = document.createElement('title');\n const labelId = `label-${createGuid()}`;\n title.id = labelId;\n title.textContent = label;\n innerSVG.appendChild(title);\n innerSVG.setAttribute('aria-labelledby', labelId);\n } else {\n innerSVG.setAttribute('aria-hidden', 'true');\n }\n }\n\n // #endregion\n // #region Render Methods\n\n render() {\n const { label, type } = this;\n return this.isCustom ? (\n <slot />\n ) : (\n <svg\n aria-hidden={!!label ? undefined : 'true'}\n role={!!label ? 'img' : undefined}\n aria-labelledby={!!label ? 'label' : undefined}\n viewBox={this.iconCloneViewBox}\n xmlns=\"http://www.w3.org/2000/svg\"\n class={this.spriteFileName}\n >\n {!!label && <title id=\"label\">{label}</title>}\n {!!type && <use ref={el => (this.spriteUse = el)} />}\n <g ref={el => (this.spriteGroup = el)}></g>\n </svg>\n );\n }\n\n // #endregion\n}\n"],"version":3}
1
+ {"file":"q2-icon2.js","mappings":"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","names":["__stencil_proxyCustomElement"],"sources":["src/components/q2-icon/q2-icon.scss?tag=q2-icon&encapsulation=shadow","src/components/q2-icon/q2-icon.tsx"],"sourcesContent":["@import '../../styles/host.scss';\n@import '../../styles/functions';\n\n:host {\n display: inline-block;\n height: var(--tct-icon-size, 24px);\n width: var(--tct-icon-size, 24px);\n position: relative;\n fill: none;\n}\n\n:host([inline]) {\n height: 1em;\n width: 1em;\n}\n\nsvg {\n display: block;\n position: absolute;\n top: 0;\n left: 0;\n stroke-width: var-list(--tct-icon-stroke-width, --t-icon-stroke-width, --tct-icon-group-stroke-width, 2);\n stroke-linecap: var-list(--tct-icon-cap, --t-icon-cap, round);\n stroke-linejoin: var-list(--tct-icon-cap, --t-icon-cap, round);\n transition: var(--tct-icon-transition, none);\n\n &.brand {\n stroke-width: var-list(--tct-icon-group-brand-stroke-width, 1);\n }\n\n &.browsersos {\n stroke-width: var-list(--tct-icon-group-browsersos-stroke-width, 1);\n }\n}\n\n.stroke-primary {\n stroke: var-list(--tct-icon-stroke-primary, --t-icon-stroke-primary, --t-text, currentcolor);\n transition: var(--tct-icon-stroke-primary-transition, none);\n}\n\n.stroke-secondary {\n stroke: var-list(--tct-icon-stroke-secondary, --t-icon-stroke-secondary, --t-text, currentcolor);\n transition: var(--tct-icon-stroke-secondary-transition, none);\n}\n\n.fill-primary {\n fill: var-list(--tct-icon-stroke-primary, --t-icon-stroke-primary, --t-text, currentcolor);\n transition: var(--tct-icon-stroke-primary-transition, none);\n}\n\n.fill-secondary {\n fill: var-list(--tct-icon-stroke-secondary, --t-icon-stroke-secondary, --t-text, currentcolor);\n transition: var(--tct-icon-stroke-secondary-transition, none);\n}\n\n.filled {\n fill: var-list(--tct-icon-fill, --comp-icon-fill, --t-icon-fill, none);\n transition: var(--tct-icon-fill-transition, none);\n}\n\n.brand-filled {\n fill: var-list(--tct-brand-icon-fill, --tct-icon-fill, currentColor);\n transition: var(--tct-icon-fill-transition, none);\n}\n\n.uniform {\n fill: var-list(--tct-icon-stroke-primary, --t-icon-stroke-primary, currentcolor);\n transition: var(--tct-icon-stroke-primary-transition, none);\n}\n\n:host([type='info']),\n:host([type='info-filled']) {\n --tct-icon-stroke-primary: transparent;\n --comp-status-color: #{var-list(--tct-stoplight-info, --const-stoplight-info, #0079c1)};\n}\n\n:host([type='success']),\n:host([type='success-filled']) {\n --tct-icon-stroke-primary: transparent;\n --comp-status-color: #{var-list(--tct-stoplight-success, --const-stoplight-success, #0e8a00)};\n}\n\n:host([type='warning']),\n:host([type='warning-filled']) {\n --tct-icon-stroke-primary: transparent;\n --comp-status-color: #{var-list(--tct-stoplight-warning, --const-stoplight-warning, #c35500)};\n}\n\n:host([type='error']),\n:host([type='error-filled']) {\n --tct-icon-stroke-primary: transparent;\n --comp-status-color: #{var-list(--tct-stoplight-alert, --const-stoplight-alert, #d20a0a)};\n}\n","import { Component, ComponentInterface, Prop, h, Element, Watch, getAssetPath, State } from '@stencil/core';\nimport { createGuid } from 'src/utils';\nimport { getOrCreateSpriteContainer } from '@/utils/sprites';\nimport iconMap from './assets/icon-map.json';\n\n/**\n * @name Icon\n * @category Display\n * @summary Use for displaying icons that represent actions, states, or concepts.\n */\n@Component({ tag: 'q2-icon', shadow: true, styleUrl: 'q2-icon.scss', assetsDirs: ['assets'] })\nexport class Q2Icon implements ComponentInterface {\n // #region Own Properties\n\n spriteGroup: SVGElement;\n spritePrefix: string = 'tecton-sprite-';\n spriteUse: SVGElement;\n\n // #endregion\n // #region Host HTML Element\n\n @Element()\n hostElement: HTMLElement;\n\n // #endregion\n // #region State Properties\n\n @State()\n iconClone: SVGSymbolElement;\n\n // #endregion\n // #region Public Property API\n\n /** Styles the component to have a `height` and `width` of `1em`, making it easy to place alongside text. */\n @Prop({ reflect: true })\n inline: boolean;\n\n /** The text that is presented by screen-readers when they encounter the icon. */\n @Prop({ reflect: true })\n label: string;\n\n /** The name of the icon to be displayed. */\n @Prop({ reflect: true })\n type: string;\n\n // #endregion\n // #region Component Lifecycle Events\n\n disconnectedCallback(): void {\n this.spriteGroup = null;\n this.spriteUse = null;\n }\n\n componentWillLoad() {\n this.handleIcon();\n }\n\n componentDidRender(): void {\n if (!this.iconClone) return;\n this.spriteGroup?.firstElementChild?.remove();\n const appendedClone = this.spriteGroup?.appendChild(this.iconClone);\n\n // We have to set the `href` attribute after the symbol is appended to the DOM to avoid a bug in Safari\n this.spriteUse?.setAttribute('href', `#${appendedClone.id}`);\n }\n\n // #endregion\n // #region Watchers\n\n @Watch('type')\n handleIcon() {\n if (this.isCustom) {\n this.setCustomSVGAttrs();\n } else if (this.type) {\n this.fetchSprite();\n } else {\n this.iconClone = null;\n this.spriteGroup?.firstElementChild?.remove();\n }\n }\n\n // #endregion\n // #region Local Methods\n\n get iconCloneViewBox() {\n return this.iconClone?.getAttribute('viewBox') ?? '0 0 24 24';\n }\n\n get isCustom() {\n return this.type === 'custom';\n }\n\n get spriteElement() {\n const { spriteId } = this;\n if (!spriteId) return;\n return document.querySelector<HTMLElement>(`#${spriteId}`);\n }\n\n get spriteEventName() {\n const { spriteFileName } = this;\n if (!spriteFileName) return;\n return `tct-loaded-${spriteFileName}`;\n }\n\n get spriteFileName() {\n if (this.isCustom) return;\n return iconMap[this.type];\n }\n\n get spriteId() {\n const { spriteFileName } = this;\n if (!spriteFileName) return;\n return `${this.spritePrefix}${spriteFileName}`;\n }\n\n checkForSprite() {\n const { spriteId, spriteEventName } = this;\n const spriteContainer = getOrCreateSpriteContainer();\n let spriteElement: HTMLElement = document.getElementById(spriteId);\n\n // If the sprite element exists and has the `data-loaded` attribute, we know we have everything we need\n if (spriteElement?.hasAttribute('data-loaded') ?? false) {\n this.cloneSpriteNode();\n return true;\n }\n\n // If the sprite element exists but does not have the `data-loaded` attribute, we know it's being loaded\n // We'll listen for the event that will be dispatched when the sprite is loaded\n spriteContainer.addEventListener(\n spriteEventName,\n () => {\n this.cloneSpriteNode();\n },\n { once: true }\n );\n\n // If the sprite element exists, we know it's being loaded and will be handled by the event listener\n if (spriteElement) return true;\n\n // If sprite element does not exist, create a placeholder\n // This will let other icons know the sprite is being loaded\n spriteElement = document.createElement('div');\n spriteElement.id = spriteId;\n spriteContainer.appendChild(spriteElement);\n return false;\n }\n\n cloneSpriteNode() {\n const spriteNode = document.getElementById(`tct-${this.type}`);\n this.iconClone = spriteNode ? (spriteNode.cloneNode(true) as SVGSymbolElement) : undefined;\n }\n\n async fetchSprite() {\n const { spriteFileName, spriteId, spriteEventName } = this;\n\n const spriteExists = this.checkForSprite();\n if (spriteExists) return;\n\n if (!spriteFileName) return;\n const spritePath = getAssetPath(`assets/${spriteFileName}.symbol.svg`);\n const response = await fetch(spritePath);\n const data = await response.text();\n const wrappingDiv = document.createElement('div');\n wrappingDiv.innerHTML = data;\n const svg = wrappingDiv.querySelector('svg');\n\n svg.id = spriteId;\n svg.setAttribute('data-loaded', '');\n\n let { spriteElement } = this;\n if (spriteElement?.tagName === 'SVG') return;\n\n if (typeof spriteElement.replaceWith === 'function') {\n spriteElement.replaceWith(svg);\n } else {\n spriteElement.parentNode.replaceChild(svg, spriteElement);\n }\n\n spriteElement = document.getElementById(spriteId);\n spriteElement.dispatchEvent(new CustomEvent(spriteEventName, { bubbles: true }));\n }\n\n setCustomSVGAttrs() {\n const innerSVG = this.hostElement.querySelector('svg');\n\n if (!innerSVG) return;\n\n innerSVG.setAttribute('role', 'img');\n innerSVG.setAttribute('xmlns', 'http://www.w3.org/2000/svg');\n\n const { label } = this;\n if (label) {\n const title = document.createElement('title');\n const labelId = `label-${createGuid()}`;\n title.id = labelId;\n title.textContent = label;\n innerSVG.appendChild(title);\n innerSVG.setAttribute('aria-labelledby', labelId);\n } else {\n innerSVG.setAttribute('aria-hidden', 'true');\n }\n }\n\n // #endregion\n // #region Render Methods\n\n render() {\n const { label, type } = this;\n return this.isCustom ? (\n <slot />\n ) : (\n <svg\n aria-hidden={!!label ? undefined : 'true'}\n role={!!label ? 'img' : undefined}\n aria-labelledby={!!label ? 'label' : undefined}\n viewBox={this.iconCloneViewBox}\n xmlns=\"http://www.w3.org/2000/svg\"\n class={this.spriteFileName}\n >\n {!!label && <title id=\"label\">{label}</title>}\n {!!type && <use ref={el => (this.spriteUse = el)} />}\n <g ref={el => (this.spriteGroup = el)}></g>\n </svg>\n );\n }\n\n // #endregion\n}\n"],"version":3}