@xplor-education/core-stencil-components 2.1.0 → 3.1.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (318) hide show
  1. package/components/index.js +1 -1
  2. package/components/index.js.map +1 -1
  3. package/components/{p-B1W2qj2l.js → p-B3zR7peH.js} +4 -4
  4. package/components/p-B3zR7peH.js.map +1 -0
  5. package/components/{p-DxxjL3sU.js → p-B49oUO_9.js} +3 -3
  6. package/components/{p-DxxjL3sU.js.map → p-B49oUO_9.js.map} +1 -1
  7. package/components/{p-Ddr35stE.js → p-BRWe4TXp.js} +65 -5
  8. package/components/p-BRWe4TXp.js.map +1 -0
  9. package/components/{p-CBSi5kQB.js → p-Bs_ocvfe.js} +7 -3
  10. package/components/p-Bs_ocvfe.js.map +1 -0
  11. package/components/{p-CTD6SyTD.js → p-D4jVa8dE.js} +20 -4
  12. package/components/p-D4jVa8dE.js.map +1 -0
  13. package/components/{p-BaDLDCH5.js → p-VIJbFoA4.js} +71 -6
  14. package/components/p-VIJbFoA4.js.map +1 -0
  15. package/components/xplor-alert-dialog.js +60 -3
  16. package/components/xplor-alert-dialog.js.map +1 -1
  17. package/components/xplor-assistant.js +3 -3
  18. package/components/xplor-assistant.js.map +1 -1
  19. package/components/xplor-autocomplete.js +15 -9
  20. package/components/xplor-autocomplete.js.map +1 -1
  21. package/components/xplor-avatar-and-name.js +1 -1
  22. package/components/xplor-avatar.js +1 -1
  23. package/components/xplor-btn-back-to-parent.js +7 -2
  24. package/components/xplor-btn-back-to-parent.js.map +1 -1
  25. package/components/xplor-btn-icon.js +3 -2
  26. package/components/xplor-btn-icon.js.map +1 -1
  27. package/components/xplor-btn-menu.js +103 -6
  28. package/components/xplor-btn-menu.js.map +1 -1
  29. package/components/xplor-btn-tooltip.js +2 -2
  30. package/components/xplor-button.js +1 -1
  31. package/components/xplor-chat-widget.js +2 -2
  32. package/components/xplor-checkbox.js +3 -1
  33. package/components/xplor-checkbox.js.map +1 -1
  34. package/components/xplor-combobox.js +20 -10
  35. package/components/xplor-combobox.js.map +1 -1
  36. package/components/xplor-datatable.js +10 -4
  37. package/components/xplor-datatable.js.map +1 -1
  38. package/components/xplor-date-picker.js +9 -5
  39. package/components/xplor-date-picker.js.map +1 -1
  40. package/components/xplor-drag-and-drop-input.js +8 -5
  41. package/components/xplor-drag-and-drop-input.js.map +1 -1
  42. package/components/xplor-dropdown.js +1 -1
  43. package/components/xplor-expansion-panel.js +4 -4
  44. package/components/xplor-expansion-panel.js.map +1 -1
  45. package/components/xplor-expansion-panels.js +1 -1
  46. package/components/xplor-expansion-panels.js.map +1 -1
  47. package/components/xplor-file-upload.js +2 -2
  48. package/components/xplor-file-upload.js.map +1 -1
  49. package/components/xplor-inline-checkbox.js +2 -2
  50. package/components/xplor-inline-date-picker.js +1 -1
  51. package/components/xplor-inline-switch.js +1 -1
  52. package/components/xplor-input-file.js +3 -1
  53. package/components/xplor-input-file.js.map +1 -1
  54. package/components/xplor-input-search.js +4 -2
  55. package/components/xplor-input-search.js.map +1 -1
  56. package/components/xplor-input-select.js +107 -7
  57. package/components/xplor-input-select.js.map +1 -1
  58. package/components/xplor-input-send.js +3 -3
  59. package/components/xplor-input-send.js.map +1 -1
  60. package/components/xplor-input-text-area.js +6 -2
  61. package/components/xplor-input-text-area.js.map +1 -1
  62. package/components/xplor-input-text-secondary.js +6 -2
  63. package/components/xplor-input-text-secondary.js.map +1 -1
  64. package/components/xplor-input-text.js +6 -2
  65. package/components/xplor-input-text.js.map +1 -1
  66. package/components/xplor-input-title.js +7 -2
  67. package/components/xplor-input-title.js.map +1 -1
  68. package/components/xplor-links.js +5 -2
  69. package/components/xplor-links.js.map +1 -1
  70. package/components/xplor-modal-persistent.js +2 -2
  71. package/components/xplor-modal.js +1 -1
  72. package/components/xplor-nav-tabs.js +41 -3
  73. package/components/xplor-nav-tabs.js.map +1 -1
  74. package/components/xplor-radio-btn.js +99 -4
  75. package/components/xplor-radio-btn.js.map +1 -1
  76. package/components/xplor-section-card.js +1 -1
  77. package/components/xplor-section-card.js.map +1 -1
  78. package/components/xplor-section-heading.js +9 -3
  79. package/components/xplor-section-heading.js.map +1 -1
  80. package/components/xplor-table.js +14 -9
  81. package/components/xplor-table.js.map +1 -1
  82. package/components/xplor-text-bubble.js +2 -2
  83. package/components/xplor-text-field.js +2 -2
  84. package/components/xplor-time-picker.js +6 -6
  85. package/components/xplor-tooltip.js +1 -1
  86. package/dist/cjs/{index-Bc5o_4vY.js → index-BjAapk2n.js} +3 -3
  87. package/dist/cjs/index-BjAapk2n.js.map +1 -0
  88. package/dist/cjs/loader.cjs.js +2 -2
  89. package/dist/cjs/xplor-alert-dialog_58.cjs.entry.js +680 -107
  90. package/dist/cjs/xplor-alert-dialog_58.cjs.entry.js.map +1 -1
  91. package/dist/cjs/xplor-component-library.cjs.js +2 -2
  92. package/dist/collection/components/xplor-alert-dialog/xplor-alert-dialog.js +85 -1
  93. package/dist/collection/components/xplor-alert-dialog/xplor-alert-dialog.js.map +1 -1
  94. package/dist/collection/components/xplor-assistant/internal/AssistantInput.js +1 -1
  95. package/dist/collection/components/xplor-assistant/internal/AssistantInput.js.map +1 -1
  96. package/dist/collection/components/xplor-assistant/xplor-assistant.js +1 -1
  97. package/dist/collection/components/xplor-assistant/xplor-assistant.js.map +1 -1
  98. package/dist/collection/components/xplor-autocomplete/xplor-autocomplete.js +37 -13
  99. package/dist/collection/components/xplor-autocomplete/xplor-autocomplete.js.map +1 -1
  100. package/dist/collection/components/xplor-avatar/xplor-avatar.js +2 -2
  101. package/dist/collection/components/xplor-avatar/xplor-avatar.js.map +1 -1
  102. package/dist/collection/components/xplor-badge-session-booking/xplor-badge-session-booking.js +2 -2
  103. package/dist/collection/components/xplor-btn-back-to-parent/xplor-btn-back-to-parent.js +25 -1
  104. package/dist/collection/components/xplor-btn-back-to-parent/xplor-btn-back-to-parent.js.map +1 -1
  105. package/dist/collection/components/xplor-btn-icon/xplor-btn-icon.js +20 -1
  106. package/dist/collection/components/xplor-btn-icon/xplor-btn-icon.js.map +1 -1
  107. package/dist/collection/components/xplor-btn-menu/xplor-btn-menu.js +131 -7
  108. package/dist/collection/components/xplor-btn-menu/xplor-btn-menu.js.map +1 -1
  109. package/dist/collection/components/xplor-button/xplor-button.js +42 -1
  110. package/dist/collection/components/xplor-button/xplor-button.js.map +1 -1
  111. package/dist/collection/components/xplor-checkbox/xplor-checkbox.js +3 -1
  112. package/dist/collection/components/xplor-checkbox/xplor-checkbox.js.map +1 -1
  113. package/dist/collection/components/xplor-combobox/xplor-combobox.js +40 -12
  114. package/dist/collection/components/xplor-combobox/xplor-combobox.js.map +1 -1
  115. package/dist/collection/components/xplor-datatable/xplor-datatable.js +13 -7
  116. package/dist/collection/components/xplor-datatable/xplor-datatable.js.map +1 -1
  117. package/dist/collection/components/xplor-date-picker/xplor-date-picker.js +8 -4
  118. package/dist/collection/components/xplor-date-picker/xplor-date-picker.js.map +1 -1
  119. package/dist/collection/components/xplor-drag-and-drop-input/xplor-drag-and-drop-input.css +3 -8
  120. package/dist/collection/components/xplor-drag-and-drop-input/xplor-drag-and-drop-input.js +24 -3
  121. package/dist/collection/components/xplor-drag-and-drop-input/xplor-drag-and-drop-input.js.map +1 -1
  122. package/dist/collection/components/xplor-dropdown/xplor-dropdown.js +1 -1
  123. package/dist/collection/components/xplor-expansion-panel/xplor-expansion-panel.js +4 -4
  124. package/dist/collection/components/xplor-expansion-panel/xplor-expansion-panel.js.map +1 -1
  125. package/dist/collection/components/xplor-expansion-panels/xplor-expansion-panels.js +1 -1
  126. package/dist/collection/components/xplor-expansion-panels/xplor-expansion-panels.js.map +1 -1
  127. package/dist/collection/components/xplor-file-upload/xplor-file-upload.js +4 -4
  128. package/dist/collection/components/xplor-file-upload/xplor-file-upload.js.map +1 -1
  129. package/dist/collection/components/xplor-inline-checkbox/xplor-inline-checkbox.js +2 -2
  130. package/dist/collection/components/xplor-inline-date-picker/xplor-inline-date-picker.js +77 -3
  131. package/dist/collection/components/xplor-inline-date-picker/xplor-inline-date-picker.js.map +1 -1
  132. package/dist/collection/components/xplor-inline-switch/xplor-inline-switch.js +1 -1
  133. package/dist/collection/components/xplor-input-file/xplor-input-file.js +3 -1
  134. package/dist/collection/components/xplor-input-file/xplor-input-file.js.map +1 -1
  135. package/dist/collection/components/xplor-input-search/xplor-input-search.js +4 -2
  136. package/dist/collection/components/xplor-input-search/xplor-input-search.js.map +1 -1
  137. package/dist/collection/components/xplor-input-select/xplor-input-select.js +134 -7
  138. package/dist/collection/components/xplor-input-select/xplor-input-select.js.map +1 -1
  139. package/dist/collection/components/xplor-input-send/xplor-input-send.js +2 -2
  140. package/dist/collection/components/xplor-input-send/xplor-input-send.js.map +1 -1
  141. package/dist/collection/components/xplor-input-text/xplor-input-text.js +6 -2
  142. package/dist/collection/components/xplor-input-text/xplor-input-text.js.map +1 -1
  143. package/dist/collection/components/xplor-input-text-area/xplor-input-text-area.js +6 -2
  144. package/dist/collection/components/xplor-input-text-area/xplor-input-text-area.js.map +1 -1
  145. package/dist/collection/components/xplor-input-text-secondary/xplor-input-text-secondary.js +6 -2
  146. package/dist/collection/components/xplor-input-text-secondary/xplor-input-text-secondary.js.map +1 -1
  147. package/dist/collection/components/xplor-input-title/xplor-input-title.js +25 -1
  148. package/dist/collection/components/xplor-input-title/xplor-input-title.js.map +1 -1
  149. package/dist/collection/components/xplor-links/xplor-links.js +25 -1
  150. package/dist/collection/components/xplor-links/xplor-links.js.map +1 -1
  151. package/dist/collection/components/xplor-modal/xplor-modal.js +88 -1
  152. package/dist/collection/components/xplor-modal/xplor-modal.js.map +1 -1
  153. package/dist/collection/components/xplor-modal-persistent/xplor-modal-persistent.js +1 -1
  154. package/dist/collection/components/xplor-nav-tabs/xplor-nav-tabs.js +50 -3
  155. package/dist/collection/components/xplor-nav-tabs/xplor-nav-tabs.js.map +1 -1
  156. package/dist/collection/components/xplor-radio-btn/xplor-radio-btn.css +116 -1
  157. package/dist/collection/components/xplor-radio-btn/xplor-radio-btn.js +258 -2
  158. package/dist/collection/components/xplor-radio-btn/xplor-radio-btn.js.map +1 -1
  159. package/dist/collection/components/xplor-section-card/xplor-section-card.js +1 -1
  160. package/dist/collection/components/xplor-section-card/xplor-section-card.js.map +1 -1
  161. package/dist/collection/components/xplor-section-heading/xplor-section-heading.js +27 -2
  162. package/dist/collection/components/xplor-section-heading/xplor-section-heading.js.map +1 -1
  163. package/dist/collection/components/xplor-table/xplor-table.js +14 -9
  164. package/dist/collection/components/xplor-table/xplor-table.js.map +1 -1
  165. package/dist/collection/components/xplor-text-bubble/xplor-text-bubble.js +2 -2
  166. package/dist/collection/components/xplor-text-field/xplor-text-field.js +2 -2
  167. package/dist/collection/components/xplor-time-picker/xplor-time-picker.js +6 -6
  168. package/dist/collection/components/xplor-tooltip/xplor-tooltip.js +20 -4
  169. package/dist/collection/components/xplor-tooltip/xplor-tooltip.js.map +1 -1
  170. package/dist/collection/test-utils/index.js +3 -0
  171. package/dist/collection/test-utils/index.js.map +1 -0
  172. package/dist/collection/test-utils/mocks.js +46 -0
  173. package/dist/collection/test-utils/mocks.js.map +1 -0
  174. package/dist/collection/test-utils/spec-helpers.js +43 -0
  175. package/dist/collection/test-utils/spec-helpers.js.map +1 -0
  176. package/dist/components/index.js +1 -1
  177. package/dist/components/index.js.map +1 -1
  178. package/dist/components/{p-BHdeGt6k.js → p--zhT6rvJ.js} +4 -4
  179. package/dist/components/p--zhT6rvJ.js.map +1 -0
  180. package/dist/components/{p-DKh6y3GY.js → p-04oMLTZR.js} +65 -5
  181. package/dist/components/p-04oMLTZR.js.map +1 -0
  182. package/dist/components/{p-DIv_A5Gj.js → p-B5rS_jjI.js} +7 -3
  183. package/dist/components/p-B5rS_jjI.js.map +1 -0
  184. package/dist/components/{p-CXJd350E.js → p-DQ8MCJFX.js} +71 -6
  185. package/dist/components/p-DQ8MCJFX.js.map +1 -0
  186. package/dist/components/{p-4l9DAhAo.js → p-DbQ6ZNvh.js} +20 -4
  187. package/dist/components/p-DbQ6ZNvh.js.map +1 -0
  188. package/dist/components/{p-oOSnPjGy.js → p-J41B2nOt.js} +3 -3
  189. package/dist/components/{p-oOSnPjGy.js.map → p-J41B2nOt.js.map} +1 -1
  190. package/dist/components/xplor-alert-dialog.js +60 -3
  191. package/dist/components/xplor-alert-dialog.js.map +1 -1
  192. package/dist/components/xplor-assistant.js +3 -3
  193. package/dist/components/xplor-assistant.js.map +1 -1
  194. package/dist/components/xplor-autocomplete.js +15 -9
  195. package/dist/components/xplor-autocomplete.js.map +1 -1
  196. package/dist/components/xplor-avatar-and-name.js +1 -1
  197. package/dist/components/xplor-avatar.js +1 -1
  198. package/dist/components/xplor-btn-back-to-parent.js +7 -2
  199. package/dist/components/xplor-btn-back-to-parent.js.map +1 -1
  200. package/dist/components/xplor-btn-icon.js +3 -2
  201. package/dist/components/xplor-btn-icon.js.map +1 -1
  202. package/dist/components/xplor-btn-menu.js +103 -6
  203. package/dist/components/xplor-btn-menu.js.map +1 -1
  204. package/dist/components/xplor-btn-tooltip.js +2 -2
  205. package/dist/components/xplor-button.js +1 -1
  206. package/dist/components/xplor-chat-widget.js +2 -2
  207. package/dist/components/xplor-checkbox.js +3 -1
  208. package/dist/components/xplor-checkbox.js.map +1 -1
  209. package/dist/components/xplor-combobox.js +20 -10
  210. package/dist/components/xplor-combobox.js.map +1 -1
  211. package/dist/components/xplor-datatable.js +10 -4
  212. package/dist/components/xplor-datatable.js.map +1 -1
  213. package/dist/components/xplor-date-picker.js +9 -5
  214. package/dist/components/xplor-date-picker.js.map +1 -1
  215. package/dist/components/xplor-drag-and-drop-input.js +8 -5
  216. package/dist/components/xplor-drag-and-drop-input.js.map +1 -1
  217. package/dist/components/xplor-dropdown.js +1 -1
  218. package/dist/components/xplor-expansion-panel.js +4 -4
  219. package/dist/components/xplor-expansion-panel.js.map +1 -1
  220. package/dist/components/xplor-expansion-panels.js +1 -1
  221. package/dist/components/xplor-expansion-panels.js.map +1 -1
  222. package/dist/components/xplor-file-upload.js +2 -2
  223. package/dist/components/xplor-file-upload.js.map +1 -1
  224. package/dist/components/xplor-inline-checkbox.js +2 -2
  225. package/dist/components/xplor-inline-date-picker.js +1 -1
  226. package/dist/components/xplor-inline-switch.js +1 -1
  227. package/dist/components/xplor-input-file.js +3 -1
  228. package/dist/components/xplor-input-file.js.map +1 -1
  229. package/dist/components/xplor-input-search.js +4 -2
  230. package/dist/components/xplor-input-search.js.map +1 -1
  231. package/dist/components/xplor-input-select.js +107 -7
  232. package/dist/components/xplor-input-select.js.map +1 -1
  233. package/dist/components/xplor-input-send.js +3 -3
  234. package/dist/components/xplor-input-send.js.map +1 -1
  235. package/dist/components/xplor-input-text-area.js +6 -2
  236. package/dist/components/xplor-input-text-area.js.map +1 -1
  237. package/dist/components/xplor-input-text-secondary.js +6 -2
  238. package/dist/components/xplor-input-text-secondary.js.map +1 -1
  239. package/dist/components/xplor-input-text.js +6 -2
  240. package/dist/components/xplor-input-text.js.map +1 -1
  241. package/dist/components/xplor-input-title.js +7 -2
  242. package/dist/components/xplor-input-title.js.map +1 -1
  243. package/dist/components/xplor-links.js +5 -2
  244. package/dist/components/xplor-links.js.map +1 -1
  245. package/dist/components/xplor-modal-persistent.js +2 -2
  246. package/dist/components/xplor-modal.js +1 -1
  247. package/dist/components/xplor-nav-tabs.js +41 -3
  248. package/dist/components/xplor-nav-tabs.js.map +1 -1
  249. package/dist/components/xplor-radio-btn.js +99 -4
  250. package/dist/components/xplor-radio-btn.js.map +1 -1
  251. package/dist/components/xplor-section-card.js +1 -1
  252. package/dist/components/xplor-section-card.js.map +1 -1
  253. package/dist/components/xplor-section-heading.js +9 -3
  254. package/dist/components/xplor-section-heading.js.map +1 -1
  255. package/dist/components/xplor-table.js +14 -9
  256. package/dist/components/xplor-table.js.map +1 -1
  257. package/dist/components/xplor-text-bubble.js +2 -2
  258. package/dist/components/xplor-text-field.js +2 -2
  259. package/dist/components/xplor-time-picker.js +6 -6
  260. package/dist/components/xplor-tooltip.js +1 -1
  261. package/dist/esm/{index-Zkk2NJif.js → index-KRfMjDC2.js} +3 -3
  262. package/dist/esm/index-KRfMjDC2.js.map +1 -0
  263. package/dist/esm/loader.js +3 -3
  264. package/dist/esm/xplor-alert-dialog_58.entry.js +680 -107
  265. package/dist/esm/xplor-alert-dialog_58.entry.js.map +1 -1
  266. package/dist/esm/xplor-component-library.js +3 -3
  267. package/dist/hydrate/index.js +725 -123
  268. package/dist/hydrate/index.mjs +725 -123
  269. package/dist/types/components/xplor-alert-dialog/xplor-alert-dialog.d.ts +11 -0
  270. package/dist/types/components/xplor-autocomplete/xplor-autocomplete.d.ts +4 -0
  271. package/dist/types/components/xplor-btn-back-to-parent/xplor-btn-back-to-parent.d.ts +4 -0
  272. package/dist/types/components/xplor-btn-icon/xplor-btn-icon.d.ts +4 -0
  273. package/dist/types/components/xplor-btn-menu/xplor-btn-menu.d.ts +19 -0
  274. package/dist/types/components/xplor-button/xplor-button.d.ts +4 -0
  275. package/dist/types/components/xplor-checkbox/xplor-checkbox.d.ts +1 -0
  276. package/dist/types/components/xplor-combobox/xplor-combobox.d.ts +4 -0
  277. package/dist/types/components/xplor-date-picker/xplor-date-picker.d.ts +3 -0
  278. package/dist/types/components/xplor-drag-and-drop-input/xplor-drag-and-drop-input.d.ts +4 -0
  279. package/dist/types/components/xplor-inline-date-picker/xplor-inline-date-picker.d.ts +3 -0
  280. package/dist/types/components/xplor-input-file/xplor-input-file.d.ts +1 -0
  281. package/dist/types/components/xplor-input-search/xplor-input-search.d.ts +1 -0
  282. package/dist/types/components/xplor-input-select/xplor-input-select.d.ts +8 -0
  283. package/dist/types/components/xplor-input-text/xplor-input-text.d.ts +3 -0
  284. package/dist/types/components/xplor-input-text-area/xplor-input-text-area.d.ts +3 -0
  285. package/dist/types/components/xplor-input-text-secondary/xplor-input-text-secondary.d.ts +3 -0
  286. package/dist/types/components/xplor-input-title/xplor-input-title.d.ts +4 -0
  287. package/dist/types/components/xplor-links/xplor-links.d.ts +2 -0
  288. package/dist/types/components/xplor-modal/xplor-modal.d.ts +11 -0
  289. package/dist/types/components/xplor-nav-tabs/xplor-nav-tabs.d.ts +2 -0
  290. package/dist/types/components/xplor-radio-btn/xplor-radio-btn.d.ts +32 -0
  291. package/dist/types/components/xplor-section-heading/xplor-section-heading.d.ts +4 -0
  292. package/dist/types/components/xplor-tooltip/xplor-tooltip.d.ts +3 -0
  293. package/dist/types/components.d.ts +205 -0
  294. package/dist/types/test-utils/index.d.ts +2 -0
  295. package/dist/types/test-utils/mocks.d.ts +16 -0
  296. package/dist/types/test-utils/spec-helpers.d.ts +26 -0
  297. package/dist/xplor-component-library/p-5b0cee73.entry.js +2 -0
  298. package/dist/xplor-component-library/p-5b0cee73.entry.js.map +1 -0
  299. package/dist/xplor-component-library/{p-Zkk2NJif.js → p-KRfMjDC2.js} +3 -3
  300. package/dist/xplor-component-library/p-KRfMjDC2.js.map +1 -0
  301. package/dist/xplor-component-library/xplor-component-library.css +1 -1
  302. package/dist/xplor-component-library/xplor-component-library.esm.js +1 -1
  303. package/package.json +7 -3
  304. package/components/p-B1W2qj2l.js.map +0 -1
  305. package/components/p-BaDLDCH5.js.map +0 -1
  306. package/components/p-CBSi5kQB.js.map +0 -1
  307. package/components/p-CTD6SyTD.js.map +0 -1
  308. package/components/p-Ddr35stE.js.map +0 -1
  309. package/dist/cjs/index-Bc5o_4vY.js.map +0 -1
  310. package/dist/components/p-4l9DAhAo.js.map +0 -1
  311. package/dist/components/p-BHdeGt6k.js.map +0 -1
  312. package/dist/components/p-CXJd350E.js.map +0 -1
  313. package/dist/components/p-DIv_A5Gj.js.map +0 -1
  314. package/dist/components/p-DKh6y3GY.js.map +0 -1
  315. package/dist/esm/index-Zkk2NJif.js.map +0 -1
  316. package/dist/xplor-component-library/p-07d83c17.entry.js +0 -2
  317. package/dist/xplor-component-library/p-07d83c17.entry.js.map +0 -1
  318. package/dist/xplor-component-library/p-Zkk2NJif.js.map +0 -1
@@ -1,4 +1,5 @@
1
1
  import { Host, h } from "@stencil/core";
2
+ let datePickerIdCounter = 0;
2
3
  export class XplorDatePicker {
3
4
  constructor() {
4
5
  /** Selected date in YYYY-MM-DD format */
@@ -28,6 +29,9 @@ export class XplorDatePicker {
28
29
  this.isOpen = false;
29
30
  this.inputText = '';
30
31
  this.dropdownPosition = 'bottom';
32
+ this.inputId = `xplor-date-picker-${++datePickerIdCounter}`;
33
+ this.labelId = `${this.inputId}-label`;
34
+ this.errorId = `${this.inputId}-error`;
31
35
  this.toggleDropdown = () => {
32
36
  if (this.disabled || this.readonly)
33
37
  return;
@@ -193,16 +197,16 @@ export class XplorDatePicker {
193
197
  }
194
198
  render() {
195
199
  const showDetails = this.hideDetails === false || (this.hideDetails === 'auto' && this.error);
196
- const calendarIcon = (h("svg", { key: '9a8e37792f14af7af7f14ec86602b5c9bfb28b56', class: "date-picker__icon-svg", viewBox: "0 0 24 24", width: "20", height: "20", fill: "none", stroke: "currentColor", "stroke-width": "2", "stroke-linecap": "round", "stroke-linejoin": "round" }, h("rect", { key: 'bfbc6e0022ea0c4d5d9ebd49636d9d8b32c2d32c', x: "3", y: "4", width: "18", height: "18", rx: "2", ry: "2" }), h("line", { key: '0d1fd4f951edd7bf388709e4db248d1421c67832', x1: "16", y1: "2", x2: "16", y2: "6" }), h("line", { key: '0995228bc198c5a09de2c9213a4713c2b3e3f054', x1: "8", y1: "2", x2: "8", y2: "6" }), h("line", { key: 'c938471721e6e72b25cbc7d46ddf823f5a37bfe5', x1: "3", y1: "10", x2: "21", y2: "10" })));
197
- return (h(Host, { key: '5acf3baf9f4d5cece68b25339a68a05f572a1bb9' }, h("div", { key: 'b1c2d84e87ab4d99a1af317397c6b442fbb49f93', class: {
200
+ const calendarIcon = (h("svg", { key: '8e3f3be13346ec15a3e4e2a9e9ccf3481cf8c87b', class: "date-picker__icon-svg", viewBox: "0 0 24 24", width: "20", height: "20", fill: "none", stroke: "currentColor", "stroke-width": "2", "stroke-linecap": "round", "stroke-linejoin": "round" }, h("rect", { key: '1f5d918d65a44a7b8f9dec0609ef125c96b1ccdf', x: "3", y: "4", width: "18", height: "18", rx: "2", ry: "2" }), h("line", { key: 'd2a5ccfbe2e4afe8ed5d9277c49b09169c6ae651', x1: "16", y1: "2", x2: "16", y2: "6" }), h("line", { key: '8d114a93b8f1c4d8fc65360f34afaecc14148328', x1: "8", y1: "2", x2: "8", y2: "6" }), h("line", { key: '40b3ab407c3872d6eda481a64f8210b505e202cc', x1: "3", y1: "10", x2: "21", y2: "10" })));
201
+ return (h(Host, { key: '7c04e985b0a900863965311e69a336d859852e66' }, h("div", { key: '15b17203d293c694130493bf45b8bd6d38c7bd36', class: {
198
202
  'date-picker': true,
199
203
  'date-picker--disabled': this.disabled,
200
204
  'date-picker--error': !!this.error,
201
205
  'date-picker--open': this.isOpen,
202
- } }, this.label && (h("label", { key: '94d43b8d44f60806824f4ef72fe4cb0113441351', class: "date-picker__label" }, this.label, this.required && h("span", { key: '2ae8a33b2a46d7e81a990368390f52c167879013', class: "date-picker__required" }, "*"))), this.display === 'text' ? (h("div", { class: "date-picker__text-display", onClick: this.handleTextClick }, h("span", { class: "date-picker__text-value" }, this.value ? this.formatDateForDisplay(this.value) : this.placeholder), calendarIcon)) : (h("div", { class: "date-picker__field" }, h("input", { type: "text", class: "date-picker__input", value: this.inputText, placeholder: this.placeholder, disabled: this.disabled, readonly: this.readonly, onFocus: this.handleInputFocus, onBlur: this.handleInputBlur, onInput: this.handleInputChange, style: { backgroundColor: this.bgColor } }), h("div", { class: "date-picker__actions" }, this.clearable && this.value && !this.disabled && !this.readonly && (h("button", { type: "button", class: "date-picker__clear", onClick: this.handleClear, "aria-label": "Clear" }, "\u00D7")), h("button", { type: "button", class: "date-picker__icon-btn", onClick: this.toggleDropdown, disabled: this.disabled, "aria-label": "Open calendar" }, calendarIcon)))), showDetails && (h("div", { key: 'eff419a0def4d85e0df8e3182132eeeb57454cef', class: "date-picker__details" }, this.error && h("div", { key: '554878b0d415e16dd8715f58db0da94259a2e3c8', class: "date-picker__error-message" }, this.error))), this.isOpen && (h("div", { key: '75ec84dd8849b3007cb4f99b73098e52b458a476', class: {
206
+ } }, this.label && (h("label", { key: 'e9e03dde337f9c2259611f1f1f4748bb92d86cfb', class: "date-picker__label", id: this.labelId, htmlFor: this.inputId }, this.label, this.required && h("span", { key: '4e68d0071f5224c9fc30df8864898a4906f6efba', class: "date-picker__required" }, "*"))), this.display === 'text' ? (h("div", { class: "date-picker__text-display", onClick: this.handleTextClick, "aria-expanded": this.isOpen ? 'true' : 'false', "aria-haspopup": "dialog", role: "button", tabIndex: 0 }, h("span", { class: "date-picker__text-value" }, this.value ? this.formatDateForDisplay(this.value) : this.placeholder), calendarIcon)) : (h("div", { class: "date-picker__field" }, h("input", { id: this.inputId, type: "text", class: "date-picker__input", value: this.inputText, placeholder: this.placeholder, disabled: this.disabled, readonly: this.readonly, onFocus: this.handleInputFocus, onBlur: this.handleInputBlur, onInput: this.handleInputChange, style: { backgroundColor: this.bgColor }, "aria-expanded": this.isOpen ? 'true' : 'false', "aria-haspopup": "dialog", "aria-describedby": this.error ? this.errorId : undefined, "aria-invalid": this.error ? 'true' : undefined, "aria-required": this.required ? 'true' : undefined }), h("div", { class: "date-picker__actions" }, this.clearable && this.value && !this.disabled && !this.readonly && (h("button", { type: "button", class: "date-picker__clear", onClick: this.handleClear, "aria-label": "Clear" }, "\u00D7")), h("button", { type: "button", class: "date-picker__icon-btn", onClick: this.toggleDropdown, disabled: this.disabled, "aria-label": "Open calendar" }, calendarIcon)))), showDetails && (h("div", { key: '4e9fd12626bf5436604e28a236a304d60c452b50', class: "date-picker__details" }, this.error && h("div", { key: 'a40425ac84ee81671f4289f4323db9a9a472d3c7', class: "date-picker__error-message", id: this.errorId }, this.error))), this.isOpen && (h("div", { key: '86c55873b678dcfe74c09475cbde7657f1983799', class: {
203
207
  'date-picker__dropdown': true,
204
208
  'date-picker__dropdown--top': this.dropdownPosition === 'top',
205
- } }, h("xplor-inline-date-picker", { key: '74c870356063103474e60245888b8b2ae67fcd1a', selectedDate: this.value, min: this.min, max: this.max, readonly: this.readonly, color: this.color, startWeekOnSunday: this.startWeekOnSunday, onDateSelected: this.handleDateSelected }))))));
209
+ } }, h("xplor-inline-date-picker", { key: 'bd1636e13522a65ea6377857edea2928a6182282', selectedDate: this.value, min: this.min, max: this.max, readonly: this.readonly, color: this.color, startWeekOnSunday: this.startWeekOnSunday, onDateSelected: this.handleDateSelected }))))));
206
210
  }
207
211
  static get is() { return "xplor-date-picker"; }
208
212
  static get encapsulation() { return "scoped"; }
@@ -1 +1 @@
1
- {"version":3,"file":"xplor-date-picker.js","sourceRoot":"","sources":["../../../src/components/xplor-date-picker/xplor-date-picker.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, Host, h, Prop, State, Event, EventEmitter, Element, Listen } from '@stencil/core';\n\n@Component({\n tag: 'xplor-date-picker',\n styleUrl: 'xplor-date-picker.scss',\n scoped: true,\n})\nexport class XplorDatePicker {\n @Element() el: HTMLElement;\n\n /** Selected date in YYYY-MM-DD format */\n @Prop({ mutable: true }) value: string = '';\n\n @Prop() label: string = '';\n @Prop() placeholder: string = 'Select date';\n\n /** 'date' or 'month' */\n @Prop() type: 'date' | 'month' = 'date';\n\n /** For month type: select start or end of month */\n @Prop() monthType: 'start' | 'end' = 'start';\n\n /** 'input' shows text input, 'text' shows clickable text */\n @Prop() display: 'input' | 'text' = 'input';\n\n /** Date display format: 'short' (DD/MM/YYYY), 'long' (1 Jan 2025), 'iso' (YYYY-MM-DD) */\n @Prop() dateFormat: 'short' | 'long' | 'iso' = 'short';\n\n @Prop() min: string = '';\n @Prop() max: string = '';\n @Prop() readonly: boolean = false;\n @Prop() disabled: boolean = false;\n @Prop() clearable: boolean = false;\n @Prop() closeOnSelect: boolean = true;\n @Prop() bgColor: string = 'white';\n @Prop() color: string = '#008480';\n @Prop() startWeekOnSunday: boolean = true;\n @Prop() error: string = '';\n @Prop() hideDetails: boolean | 'auto' = 'auto';\n @Prop() required: boolean = false;\n\n @State() isOpen: boolean = false;\n @State() inputText: string = '';\n @State() dropdownPosition: 'bottom' | 'top' = 'bottom';\n\n @Event() dateChange: EventEmitter<string>;\n @Event() xplorFocus: EventEmitter<FocusEvent>;\n @Event() xplorBlur: EventEmitter<FocusEvent>;\n @Event() xplorClear: EventEmitter<void>;\n\n componentWillLoad() {\n if (this.value) {\n this.inputText = this.formatDateForDisplay(this.value);\n }\n }\n\n @Listen('click', { target: 'document' })\n handleDocumentClick(event: MouseEvent) {\n const target = event.target as Node;\n if (!this.el.contains(target)) {\n this.isOpen = false;\n }\n }\n\n /** Parse YYYY-MM-DD safely without UTC shift */\n private parseISODate(iso: string): Date | null {\n if (!iso) return null;\n const d = new Date(iso + 'T00:00:00');\n return isNaN(d.getTime()) ? null : d;\n }\n\n private formatDateForDisplay(iso: string): string {\n const date = this.parseISODate(iso);\n if (!date) return iso;\n\n if (this.type === 'month') {\n return new Intl.DateTimeFormat('en-AU', { month: 'long', year: 'numeric' }).format(date);\n }\n\n switch (this.dateFormat) {\n case 'long':\n return new Intl.DateTimeFormat('en-AU', { day: 'numeric', month: 'short', year: 'numeric' }).format(date);\n case 'iso':\n return iso;\n case 'short':\n default:\n return new Intl.DateTimeFormat('en-AU', { day: '2-digit', month: '2-digit', year: 'numeric' }).format(date);\n }\n }\n\n private toISO(date: Date): string {\n const year = date.getFullYear();\n const month = String(date.getMonth() + 1).padStart(2, '0');\n const day = String(date.getDate()).padStart(2, '0');\n return `${year}-${month}-${day}`;\n }\n\n /** Parse user-typed text into YYYY-MM-DD */\n private parseInputText(text: string): string | null {\n const trimmed = text.trim();\n if (!trimmed) return null;\n\n // Try DD/MM/YYYY\n const slashMatch = trimmed.match(/^(\\d{1,2})[/\\-.](\\d{1,2})[/\\-.](\\d{4})$/);\n if (slashMatch) {\n const day = parseInt(slashMatch[1], 10);\n const month = parseInt(slashMatch[2], 10);\n const year = parseInt(slashMatch[3], 10);\n const d = new Date(year, month - 1, day);\n if (d.getFullYear() === year && d.getMonth() === month - 1 && d.getDate() === day) {\n return this.toISO(d);\n }\n }\n\n // Try YYYY-MM-DD\n const isoMatch = trimmed.match(/^(\\d{4})-(\\d{1,2})-(\\d{1,2})$/);\n if (isoMatch) {\n const year = parseInt(isoMatch[1], 10);\n const month = parseInt(isoMatch[2], 10);\n const day = parseInt(isoMatch[3], 10);\n const d = new Date(year, month - 1, day);\n if (d.getFullYear() === year && d.getMonth() === month - 1 && d.getDate() === day) {\n return this.toISO(d);\n }\n }\n\n // Try natural string via Date.parse\n const d = new Date(trimmed);\n if (!isNaN(d.getTime())) {\n return this.toISO(d);\n }\n\n return null;\n }\n\n private isDateInRange(iso: string): boolean {\n if (!iso) return true;\n if (this.min && iso < this.min) return false;\n if (this.max && iso > this.max) return false;\n return true;\n }\n\n private updateDropdownPosition() {\n const rect = this.el.getBoundingClientRect();\n const spaceBelow = window.innerHeight - rect.bottom;\n this.dropdownPosition = spaceBelow < 350 ? 'top' : 'bottom';\n }\n\n private toggleDropdown = () => {\n if (this.disabled || this.readonly) return;\n this.updateDropdownPosition();\n this.isOpen = !this.isOpen;\n };\n\n private handleInputFocus = (event: FocusEvent) => {\n this.xplorFocus.emit(event);\n };\n\n private handleInputBlur = (event: FocusEvent) => {\n this.xplorBlur.emit(event);\n // Try to parse typed text\n const parsed = this.parseInputText(this.inputText);\n if (parsed && this.isDateInRange(parsed)) {\n this.value = parsed;\n this.inputText = this.formatDateForDisplay(parsed);\n this.dateChange.emit(parsed);\n } else if (this.value) {\n // Revert to current value display\n this.inputText = this.formatDateForDisplay(this.value);\n } else {\n this.inputText = '';\n }\n };\n\n private handleInputChange = (event: Event) => {\n const input = event.target as HTMLInputElement;\n this.inputText = input.value;\n };\n\n private handleDateSelected = (event: CustomEvent<string>) => {\n event.stopPropagation();\n const iso = event.detail;\n if (!this.isDateInRange(iso)) return;\n\n if (this.type === 'month') {\n const d = this.parseISODate(iso);\n if (d) {\n let finalDate: Date;\n if (this.monthType === 'end') {\n finalDate = new Date(d.getFullYear(), d.getMonth() + 1, 0);\n } else {\n finalDate = new Date(d.getFullYear(), d.getMonth(), 1);\n }\n const finalIso = this.toISO(finalDate);\n this.value = finalIso;\n this.inputText = this.formatDateForDisplay(finalIso);\n this.dateChange.emit(finalIso);\n }\n } else {\n this.value = iso;\n this.inputText = this.formatDateForDisplay(iso);\n this.dateChange.emit(iso);\n }\n\n if (this.closeOnSelect) {\n this.isOpen = false;\n }\n };\n\n private handleClear = (event: Event) => {\n event.stopPropagation();\n this.value = '';\n this.inputText = '';\n this.dateChange.emit('');\n this.xplorClear.emit();\n };\n\n private handleTextClick = () => {\n if (this.disabled || this.readonly) return;\n this.updateDropdownPosition();\n this.isOpen = !this.isOpen;\n };\n\n render() {\n const showDetails = this.hideDetails === false || (this.hideDetails === 'auto' && this.error);\n\n const calendarIcon = (\n <svg class=\"date-picker__icon-svg\" viewBox=\"0 0 24 24\" width=\"20\" height=\"20\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\">\n <rect x=\"3\" y=\"4\" width=\"18\" height=\"18\" rx=\"2\" ry=\"2\"></rect>\n <line x1=\"16\" y1=\"2\" x2=\"16\" y2=\"6\"></line>\n <line x1=\"8\" y1=\"2\" x2=\"8\" y2=\"6\"></line>\n <line x1=\"3\" y1=\"10\" x2=\"21\" y2=\"10\"></line>\n </svg>\n );\n\n return (\n <Host>\n <div class={{\n 'date-picker': true,\n 'date-picker--disabled': this.disabled,\n 'date-picker--error': !!this.error,\n 'date-picker--open': this.isOpen,\n }}>\n {this.label && (\n <label class=\"date-picker__label\">\n {this.label}\n {this.required && <span class=\"date-picker__required\">*</span>}\n </label>\n )}\n\n {this.display === 'text' ? (\n <div class=\"date-picker__text-display\" onClick={this.handleTextClick}>\n <span class=\"date-picker__text-value\">\n {this.value ? this.formatDateForDisplay(this.value) : this.placeholder}\n </span>\n {calendarIcon}\n </div>\n ) : (\n <div class=\"date-picker__field\">\n <input\n type=\"text\"\n class=\"date-picker__input\"\n value={this.inputText}\n placeholder={this.placeholder}\n disabled={this.disabled}\n readonly={this.readonly}\n onFocus={this.handleInputFocus}\n onBlur={this.handleInputBlur}\n onInput={this.handleInputChange}\n style={{ backgroundColor: this.bgColor }}\n />\n <div class=\"date-picker__actions\">\n {this.clearable && this.value && !this.disabled && !this.readonly && (\n <button type=\"button\" class=\"date-picker__clear\" onClick={this.handleClear} aria-label=\"Clear\">\n ×\n </button>\n )}\n <button type=\"button\" class=\"date-picker__icon-btn\" onClick={this.toggleDropdown} disabled={this.disabled} aria-label=\"Open calendar\">\n {calendarIcon}\n </button>\n </div>\n </div>\n )}\n\n {showDetails && (\n <div class=\"date-picker__details\">\n {this.error && <div class=\"date-picker__error-message\">{this.error}</div>}\n </div>\n )}\n\n {this.isOpen && (\n <div class={{\n 'date-picker__dropdown': true,\n 'date-picker__dropdown--top': this.dropdownPosition === 'top',\n }}>\n <xplor-inline-date-picker\n selectedDate={this.value}\n min={this.min}\n max={this.max}\n readonly={this.readonly}\n color={this.color}\n startWeekOnSunday={this.startWeekOnSunday}\n onDateSelected={this.handleDateSelected}\n ></xplor-inline-date-picker>\n </div>\n )}\n </div>\n </Host>\n );\n }\n}\n"]}
1
+ {"version":3,"file":"xplor-date-picker.js","sourceRoot":"","sources":["../../../src/components/xplor-date-picker/xplor-date-picker.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, Host, h, Prop, State, Event, EventEmitter, Element, Listen } from '@stencil/core';\n\nlet datePickerIdCounter = 0;\n\n@Component({\n tag: 'xplor-date-picker',\n styleUrl: 'xplor-date-picker.scss',\n scoped: true,\n})\nexport class XplorDatePicker {\n @Element() el: HTMLElement;\n\n /** Selected date in YYYY-MM-DD format */\n @Prop({ mutable: true }) value: string = '';\n\n @Prop() label: string = '';\n @Prop() placeholder: string = 'Select date';\n\n /** 'date' or 'month' */\n @Prop() type: 'date' | 'month' = 'date';\n\n /** For month type: select start or end of month */\n @Prop() monthType: 'start' | 'end' = 'start';\n\n /** 'input' shows text input, 'text' shows clickable text */\n @Prop() display: 'input' | 'text' = 'input';\n\n /** Date display format: 'short' (DD/MM/YYYY), 'long' (1 Jan 2025), 'iso' (YYYY-MM-DD) */\n @Prop() dateFormat: 'short' | 'long' | 'iso' = 'short';\n\n @Prop() min: string = '';\n @Prop() max: string = '';\n @Prop() readonly: boolean = false;\n @Prop() disabled: boolean = false;\n @Prop() clearable: boolean = false;\n @Prop() closeOnSelect: boolean = true;\n @Prop() bgColor: string = 'white';\n @Prop() color: string = '#008480';\n @Prop() startWeekOnSunday: boolean = true;\n @Prop() error: string = '';\n @Prop() hideDetails: boolean | 'auto' = 'auto';\n @Prop() required: boolean = false;\n\n @State() isOpen: boolean = false;\n @State() inputText: string = '';\n @State() dropdownPosition: 'bottom' | 'top' = 'bottom';\n\n private inputId = `xplor-date-picker-${++datePickerIdCounter}`;\n private labelId = `${this.inputId}-label`;\n private errorId = `${this.inputId}-error`;\n\n @Event() dateChange: EventEmitter<string>;\n @Event() xplorFocus: EventEmitter<FocusEvent>;\n @Event() xplorBlur: EventEmitter<FocusEvent>;\n @Event() xplorClear: EventEmitter<void>;\n\n componentWillLoad() {\n if (this.value) {\n this.inputText = this.formatDateForDisplay(this.value);\n }\n }\n\n @Listen('click', { target: 'document' })\n handleDocumentClick(event: MouseEvent) {\n const target = event.target as Node;\n if (!this.el.contains(target)) {\n this.isOpen = false;\n }\n }\n\n /** Parse YYYY-MM-DD safely without UTC shift */\n private parseISODate(iso: string): Date | null {\n if (!iso) return null;\n const d = new Date(iso + 'T00:00:00');\n return isNaN(d.getTime()) ? null : d;\n }\n\n private formatDateForDisplay(iso: string): string {\n const date = this.parseISODate(iso);\n if (!date) return iso;\n\n if (this.type === 'month') {\n return new Intl.DateTimeFormat('en-AU', { month: 'long', year: 'numeric' }).format(date);\n }\n\n switch (this.dateFormat) {\n case 'long':\n return new Intl.DateTimeFormat('en-AU', { day: 'numeric', month: 'short', year: 'numeric' }).format(date);\n case 'iso':\n return iso;\n case 'short':\n default:\n return new Intl.DateTimeFormat('en-AU', { day: '2-digit', month: '2-digit', year: 'numeric' }).format(date);\n }\n }\n\n private toISO(date: Date): string {\n const year = date.getFullYear();\n const month = String(date.getMonth() + 1).padStart(2, '0');\n const day = String(date.getDate()).padStart(2, '0');\n return `${year}-${month}-${day}`;\n }\n\n /** Parse user-typed text into YYYY-MM-DD */\n private parseInputText(text: string): string | null {\n const trimmed = text.trim();\n if (!trimmed) return null;\n\n // Try DD/MM/YYYY\n const slashMatch = trimmed.match(/^(\\d{1,2})[/\\-.](\\d{1,2})[/\\-.](\\d{4})$/);\n if (slashMatch) {\n const day = parseInt(slashMatch[1], 10);\n const month = parseInt(slashMatch[2], 10);\n const year = parseInt(slashMatch[3], 10);\n const d = new Date(year, month - 1, day);\n if (d.getFullYear() === year && d.getMonth() === month - 1 && d.getDate() === day) {\n return this.toISO(d);\n }\n }\n\n // Try YYYY-MM-DD\n const isoMatch = trimmed.match(/^(\\d{4})-(\\d{1,2})-(\\d{1,2})$/);\n if (isoMatch) {\n const year = parseInt(isoMatch[1], 10);\n const month = parseInt(isoMatch[2], 10);\n const day = parseInt(isoMatch[3], 10);\n const d = new Date(year, month - 1, day);\n if (d.getFullYear() === year && d.getMonth() === month - 1 && d.getDate() === day) {\n return this.toISO(d);\n }\n }\n\n // Try natural string via Date.parse\n const d = new Date(trimmed);\n if (!isNaN(d.getTime())) {\n return this.toISO(d);\n }\n\n return null;\n }\n\n private isDateInRange(iso: string): boolean {\n if (!iso) return true;\n if (this.min && iso < this.min) return false;\n if (this.max && iso > this.max) return false;\n return true;\n }\n\n private updateDropdownPosition() {\n const rect = this.el.getBoundingClientRect();\n const spaceBelow = window.innerHeight - rect.bottom;\n this.dropdownPosition = spaceBelow < 350 ? 'top' : 'bottom';\n }\n\n private toggleDropdown = () => {\n if (this.disabled || this.readonly) return;\n this.updateDropdownPosition();\n this.isOpen = !this.isOpen;\n };\n\n private handleInputFocus = (event: FocusEvent) => {\n this.xplorFocus.emit(event);\n };\n\n private handleInputBlur = (event: FocusEvent) => {\n this.xplorBlur.emit(event);\n // Try to parse typed text\n const parsed = this.parseInputText(this.inputText);\n if (parsed && this.isDateInRange(parsed)) {\n this.value = parsed;\n this.inputText = this.formatDateForDisplay(parsed);\n this.dateChange.emit(parsed);\n } else if (this.value) {\n // Revert to current value display\n this.inputText = this.formatDateForDisplay(this.value);\n } else {\n this.inputText = '';\n }\n };\n\n private handleInputChange = (event: Event) => {\n const input = event.target as HTMLInputElement;\n this.inputText = input.value;\n };\n\n private handleDateSelected = (event: CustomEvent<string>) => {\n event.stopPropagation();\n const iso = event.detail;\n if (!this.isDateInRange(iso)) return;\n\n if (this.type === 'month') {\n const d = this.parseISODate(iso);\n if (d) {\n let finalDate: Date;\n if (this.monthType === 'end') {\n finalDate = new Date(d.getFullYear(), d.getMonth() + 1, 0);\n } else {\n finalDate = new Date(d.getFullYear(), d.getMonth(), 1);\n }\n const finalIso = this.toISO(finalDate);\n this.value = finalIso;\n this.inputText = this.formatDateForDisplay(finalIso);\n this.dateChange.emit(finalIso);\n }\n } else {\n this.value = iso;\n this.inputText = this.formatDateForDisplay(iso);\n this.dateChange.emit(iso);\n }\n\n if (this.closeOnSelect) {\n this.isOpen = false;\n }\n };\n\n private handleClear = (event: Event) => {\n event.stopPropagation();\n this.value = '';\n this.inputText = '';\n this.dateChange.emit('');\n this.xplorClear.emit();\n };\n\n private handleTextClick = () => {\n if (this.disabled || this.readonly) return;\n this.updateDropdownPosition();\n this.isOpen = !this.isOpen;\n };\n\n render() {\n const showDetails = this.hideDetails === false || (this.hideDetails === 'auto' && this.error);\n\n const calendarIcon = (\n <svg class=\"date-picker__icon-svg\" viewBox=\"0 0 24 24\" width=\"20\" height=\"20\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\">\n <rect x=\"3\" y=\"4\" width=\"18\" height=\"18\" rx=\"2\" ry=\"2\"></rect>\n <line x1=\"16\" y1=\"2\" x2=\"16\" y2=\"6\"></line>\n <line x1=\"8\" y1=\"2\" x2=\"8\" y2=\"6\"></line>\n <line x1=\"3\" y1=\"10\" x2=\"21\" y2=\"10\"></line>\n </svg>\n );\n\n return (\n <Host>\n <div class={{\n 'date-picker': true,\n 'date-picker--disabled': this.disabled,\n 'date-picker--error': !!this.error,\n 'date-picker--open': this.isOpen,\n }}>\n {this.label && (\n <label class=\"date-picker__label\" id={this.labelId} htmlFor={this.inputId}>\n {this.label}\n {this.required && <span class=\"date-picker__required\">*</span>}\n </label>\n )}\n\n {this.display === 'text' ? (\n <div\n class=\"date-picker__text-display\"\n onClick={this.handleTextClick}\n aria-expanded={this.isOpen ? 'true' : 'false'}\n aria-haspopup=\"dialog\"\n role=\"button\"\n tabIndex={0}\n >\n <span class=\"date-picker__text-value\">\n {this.value ? this.formatDateForDisplay(this.value) : this.placeholder}\n </span>\n {calendarIcon}\n </div>\n ) : (\n <div class=\"date-picker__field\">\n <input\n id={this.inputId}\n type=\"text\"\n class=\"date-picker__input\"\n value={this.inputText}\n placeholder={this.placeholder}\n disabled={this.disabled}\n readonly={this.readonly}\n onFocus={this.handleInputFocus}\n onBlur={this.handleInputBlur}\n onInput={this.handleInputChange}\n style={{ backgroundColor: this.bgColor }}\n aria-expanded={this.isOpen ? 'true' : 'false'}\n aria-haspopup=\"dialog\"\n aria-describedby={this.error ? this.errorId : undefined}\n aria-invalid={this.error ? 'true' : undefined}\n aria-required={this.required ? 'true' : undefined}\n />\n <div class=\"date-picker__actions\">\n {this.clearable && this.value && !this.disabled && !this.readonly && (\n <button type=\"button\" class=\"date-picker__clear\" onClick={this.handleClear} aria-label=\"Clear\">\n ×\n </button>\n )}\n <button type=\"button\" class=\"date-picker__icon-btn\" onClick={this.toggleDropdown} disabled={this.disabled} aria-label=\"Open calendar\">\n {calendarIcon}\n </button>\n </div>\n </div>\n )}\n\n {showDetails && (\n <div class=\"date-picker__details\">\n {this.error && <div class=\"date-picker__error-message\" id={this.errorId}>{this.error}</div>}\n </div>\n )}\n\n {this.isOpen && (\n <div class={{\n 'date-picker__dropdown': true,\n 'date-picker__dropdown--top': this.dropdownPosition === 'top',\n }}>\n <xplor-inline-date-picker\n selectedDate={this.value}\n min={this.min}\n max={this.max}\n readonly={this.readonly}\n color={this.color}\n startWeekOnSunday={this.startWeekOnSunday}\n onDateSelected={this.handleDateSelected}\n ></xplor-inline-date-picker>\n </div>\n )}\n </div>\n </Host>\n );\n }\n}\n"]}
@@ -1052,7 +1052,6 @@ ul.mdc-list li.mdc-list-item {
1052
1052
 
1053
1053
  .drag-drop-zone {
1054
1054
  position: relative;
1055
- padding-bottom: 2.5rem;
1056
1055
  }
1057
1056
 
1058
1057
  .drag-drop-input-hidden {
@@ -1064,7 +1063,7 @@ ul.mdc-list li.mdc-list-item {
1064
1063
  border-radius: 8px;
1065
1064
  border: 2px dashed var(--color-secondary);
1066
1065
  min-height: 160px;
1067
- padding: 1rem 1.5rem 2rem;
1066
+ padding: 1.5rem;
1068
1067
  text-align: center;
1069
1068
  transition: all 0.2s ease;
1070
1069
  cursor: default;
@@ -1086,8 +1085,7 @@ ul.mdc-list li.mdc-list-item {
1086
1085
  display: flex;
1087
1086
  flex-direction: column;
1088
1087
  align-items: center;
1089
- gap: 0.25rem;
1090
- padding: 0.25rem 0 0;
1088
+ gap: 0.75rem;
1091
1089
  }
1092
1090
 
1093
1091
  .drag-drop-card__icon {
@@ -1117,10 +1115,7 @@ ul.mdc-list li.mdc-list-item {
1117
1115
  }
1118
1116
 
1119
1117
  .drag-drop-card__action {
1120
- position: absolute;
1121
- left: 50%;
1122
- bottom: 0;
1123
- transform: translateX(-50%);
1118
+ margin-top: 0.25rem;
1124
1119
  }
1125
1120
 
1126
1121
  .file-info {
@@ -117,13 +117,15 @@ export class XplorDragAndDropInput {
117
117
  this.fileClear.emit();
118
118
  }
119
119
  render() {
120
- return (h(Host, { key: '1996cf8e0d65afed803bb07a2f7a54adb5bbfaa5' }, h("div", { key: '6fcf52a709e3d6b7e64583f201260e1841076cef', class: "drag-drop-zone" }, h("div", { key: 'a9c8bd35981166cf075bd9f0d215914ff87a0ff0', class: {
120
+ const progressValue = Math.min(Math.max(this.progress, 0), 100);
121
+ const dropZoneLabel = this.ariaLabel || `${this.label}. Accepted file types: ${this.getAcceptsLabel()}. Or use the ${this.browseLabel} button.`;
122
+ return (h(Host, { key: '4ca1a26f1c043761a3bcafebf3ccdf57ec17467b' }, h("div", { key: '60c9f55d838820e2d9c087fbb652559944ecfc36', class: "drag-drop-zone" }, h("div", { key: 'f15e206b7f1e1741f5ee96681e000400e72d66b1', class: {
121
123
  'drag-drop-card': true,
122
124
  'drag-drop-card--dragover': this.dragover,
123
125
  'drag-drop-card--disabled': this.disabled,
124
- }, onDrop: this.onDrop, onDragOver: this.onDragOver, onDragEnter: this.onDragEnter, onDragLeave: this.onDragLeave }, h("div", { key: 'eec73d07cce31d43151a6af27a584f764cf104ec', class: "drag-drop-card__content" }, h("svg", { key: '75fe85db121bdf98d91872f847235e42f3505021', class: "drag-drop-card__icon", xmlns: "http://www.w3.org/2000/svg", width: "40", height: "40", viewBox: "0 0 24 24", fill: "none" }, h("path", { key: '454bda7cf271281374b965182d15120ab00059e1', d: "M19.35 10.04C18.67 6.59 15.64 4 12 4C9.11 4 6.6 5.64 5.35 8.04C2.34 8.36 0 10.91 0 14C0 17.31 2.69 20 6 20H19C21.76 20 24 17.76 24 15C24 12.36 21.95 10.22 19.35 10.04Z", fill: "currentColor", opacity: "0.3" }), h("path", { key: '8bc44934968795b791cd4183e18f3d72f7a195de', d: "M19.35 10.04C18.67 6.59 15.64 4 12 4C9.11 4 6.6 5.64 5.35 8.04C2.34 8.36 0 10.91 0 14C0 17.31 2.69 20 6 20H19C21.76 20 24 17.76 24 15C24 12.36 21.95 10.22 19.35 10.04ZM14 13V17H10V13H7L12 8L17 13H14Z", fill: "currentColor" })), h("h3", { key: 'e17238c5e6bdb38ef75c5513c88154696a046273', class: "drag-drop-card__title" }, this.label), h("p", { key: 'b6aa94f6624a1fb09a56ca26dd31981aa56c3e8a', class: "drag-drop-card__accepts" }, "Accepted file types: ", this.getAcceptsLabel()), h("p", { key: '0a6cb23bff2f8512e961cf3fae65463aec2f829e', class: "drag-drop-card__divider" }, "or"))), h("div", { key: '8ad03f8da13062f5915005c80f88d41d4adc7e83', class: "drag-drop-card__action" }, h("xplor-button", { key: '37dd6e0f4d61a6e4aa3e0648227b5c06b101d7f3', text: this.browseLabel, type: this.disabled ? 'disabled' : 'secondary', clickAction: this.openFileDialog }))), this.currentFile && (h("div", { key: '7ab8ffd9e6fa79c3adb83127c2263dbf1c8356af', class: "file-info" }, this.showProgress() && (h("p", { key: '34e1f54d42c866012faad5462935400ad64fd69a', class: "file-info__status" }, "Uploading ", this.progress === 100 ? '1' : '0', " / 1")), h("div", { key: '891749a5bc2d928226cdcdf855b992a94c46ec0e', class: "file-info__card" }, h("div", { key: 'df6230a7fed1e37536756d0d2ca79a7fa0f3f3b0', class: "file-info__icon" }, h("svg", { key: '6f740a420e16cf0b8e1a008ac1e69a5356db1789', xmlns: "http://www.w3.org/2000/svg", width: "24", height: "24", viewBox: "0 0 24 24", fill: "currentColor" }, h("path", { key: '0cc9aa35e50ec4c04662abcef793175d56337e71', d: "M14 2H6C4.9 2 4 2.9 4 4V20C4 21.1 4.9 22 6 22H18C19.1 22 20 21.1 20 20V8L14 2ZM6 20V4H13V9H18V20H6Z" }))), h("div", { key: 'cf0dc9b9592721a4e488fb852515273bdb5f75ad', class: "file-info__details" }, h("p", { key: '082e3dc60b75a1b889c3390c140e32e232b57bff', class: "file-info__name" }, this.currentFile.name), h("p", { key: '79da132f579221a718e4725e12dff7efb7b5f82f', class: "file-info__meta" }, this.formatFileSize(this.currentFile.size), this.currentFile.lastModified
126
+ }, onDrop: this.onDrop, onDragOver: this.onDragOver, onDragEnter: this.onDragEnter, onDragLeave: this.onDragLeave, role: "region", "aria-label": dropZoneLabel }, h("div", { key: '49325fd7ff2d44a045eba593e2cb3708316a5be4', class: "drag-drop-card__content" }, h("svg", { key: '23b8f38df073266201a01ec78a45b1cac924a3e4', class: "drag-drop-card__icon", xmlns: "http://www.w3.org/2000/svg", width: "40", height: "40", viewBox: "0 0 24 24", fill: "none", "aria-hidden": "true" }, h("path", { key: 'eb1c750d1657fd578cf15c9bc16d5d1885d703e8', d: "M19.35 10.04C18.67 6.59 15.64 4 12 4C9.11 4 6.6 5.64 5.35 8.04C2.34 8.36 0 10.91 0 14C0 17.31 2.69 20 6 20H19C21.76 20 24 17.76 24 15C24 12.36 21.95 10.22 19.35 10.04Z", fill: "currentColor", opacity: "0.3" }), h("path", { key: '04dc16407d2abd999fbef9cc02346d499644f0a7', d: "M19.35 10.04C18.67 6.59 15.64 4 12 4C9.11 4 6.6 5.64 5.35 8.04C2.34 8.36 0 10.91 0 14C0 17.31 2.69 20 6 20H19C21.76 20 24 17.76 24 15C24 12.36 21.95 10.22 19.35 10.04ZM14 13V17H10V13H7L12 8L17 13H14Z", fill: "currentColor" })), h("h3", { key: '82c31b56cb5f17445748e0bfb8668caef4ceea59', class: "drag-drop-card__title" }, this.label), this.accepts && this.accepts !== DEFAULT_ACCEPT_ALL && (h("p", { key: 'cd9a640967ce9cd8c959000771d78a57fe1df4ea', class: "drag-drop-card__accepts" }, "Accepted file types: ", this.getAcceptsLabel())), h("div", { key: 'c9a3987e06aceba90a379f6f5264998c218497a1', class: "drag-drop-card__action" }, h("xplor-button", { key: 'a26dd92027f90fb052ce3fa5cc456b18b5732b41', text: this.browseLabel, type: this.disabled ? 'disabled' : 'secondary', clickAction: this.openFileDialog, "aria-label": this.browseLabel }))))), this.currentFile && (h("div", { key: '75258825a2415d4f78dc05caa4931c2b65675c10', class: "file-info", "aria-live": "polite" }, this.showProgress() && (h("p", { key: '643fca5089d411ac0c2ac7cb2d8548450e18df49', class: "file-info__status" }, "Uploading ", this.progress === 100 ? '1' : '0', " / 1")), h("div", { key: '6829f00a6550dee83fc60496c6534272443c2974', class: "file-info__card" }, h("div", { key: 'cb234a2213fc3ae39993b11cb3d99878d643878f', class: "file-info__icon", "aria-hidden": "true" }, h("svg", { key: 'f657669caa7dd95b095b419908f94cf16e8530d7', xmlns: "http://www.w3.org/2000/svg", width: "24", height: "24", viewBox: "0 0 24 24", fill: "currentColor" }, h("path", { key: 'ef502814c77090e682f8b7e3e2d41dc3434a14fa', d: "M14 2H6C4.9 2 4 2.9 4 4V20C4 21.1 4.9 22 6 22H18C19.1 22 20 21.1 20 20V8L14 2ZM6 20V4H13V9H18V20H6Z" }))), h("div", { key: '6bcc15939b14fbcfa71408e733489933e9322efa', class: "file-info__details" }, h("p", { key: '9840cd50a70cfec9ceb8588116677ed0da2d5b14', class: "file-info__name" }, this.currentFile.name), h("p", { key: 'f8aaf5f729278070ebd1d3a8137460dab67a130a', class: "file-info__meta" }, this.formatFileSize(this.currentFile.size), this.currentFile.lastModified
125
127
  ? ` | Last modified: ${this.formatDate(this.currentFile.lastModified)}`
126
- : ''), this.showProgress() && (h("div", { key: 'ff641e3fb53d0089c9392f1c77e7943783fa4745', class: "file-info__progress-row" }, h("div", { key: '57bade7b09cd9700d6cdfe123b79b1f59d049b3e', class: "file-info__progress-bar" }, h("div", { key: '8119c5937118adab06ae53257374964ced4b8446', class: "file-info__progress-fill", style: { width: `${Math.min(Math.max(this.progress, 0), 100)}%` } })), h("span", { key: 'dca1ccade071119e10b724a8d0047ec966c78ed4', class: "file-info__progress-text" }, Math.round(this.progress), "%")))), h("button", { key: 'e9142fab6e8f708cdd6063c6ff3659bd8e6f77e6', class: "file-info__remove", onClick: () => this.clearCurrentFile(), "aria-label": "Remove file" }, h("svg", { key: 'bc48ad8ce10fbed57c5bcbed53d8f2931461b90e', xmlns: "http://www.w3.org/2000/svg", width: "18", height: "18", viewBox: "0 0 24 24", fill: "currentColor" }, h("path", { key: '514e5299c4f288807c557035a0fa6c28fa770e3d', d: "M19 6.41L17.59 5 12 10.59 6.41 5 5 6.41 10.59 12 5 17.59 6.41 19 12 13.41 17.59 19 19 17.59 13.41 12Z" })))))), h("input", { key: '38d92776629e98032272631ed3a26a018c2ea7cc', id: "drag-drop-file-select", type: "file", disabled: this.disabled, accept: this.accepts, class: "drag-drop-input-hidden", ref: (el) => (this.fileInputEl = el), onChange: this.onFileSelect })));
128
+ : ''), this.showProgress() && (h("div", { key: 'e30ab7e1514f72034cac41f748df00cd19423d2d', class: "file-info__progress-row" }, h("div", { key: '4ef4e335b0154adc44d940784ac0f01358fa4fd0', class: "file-info__progress-bar", role: "progressbar", "aria-valuenow": progressValue, "aria-valuemin": 0, "aria-valuemax": 100, "aria-label": `Upload progress: ${Math.round(progressValue)}%` }, h("div", { key: '3328873cc9d457401ccfe46c3cee8c7c7d5280ab', class: "file-info__progress-fill", style: { width: `${progressValue}%` } })), h("span", { key: 'f3fab0a39db233a16bb1fefdbb15c2174808543d', class: "file-info__progress-text", "aria-hidden": "true" }, Math.round(this.progress), "%")))), h("button", { key: '70ff008be7088ff5744130ffecab2694eceff8ff', class: "file-info__remove", onClick: () => this.clearCurrentFile(), "aria-label": `Remove file ${this.currentFile.name}` }, h("svg", { key: '0c6957c250bde4af18641704ba8b248ff8b815b4', xmlns: "http://www.w3.org/2000/svg", width: "18", height: "18", viewBox: "0 0 24 24", fill: "currentColor", "aria-hidden": "true" }, h("path", { key: '0131e03966350788114f5ac999488c19d0186f90', d: "M19 6.41L17.59 5 12 10.59 6.41 5 5 6.41 10.59 12 5 17.59 6.41 19 12 13.41 17.59 19 19 17.59 13.41 12Z" })))))), h("input", { key: 'a40511c99ac1292d5eb5a37be23a235b5103ab65', id: "drag-drop-file-select", type: "file", disabled: this.disabled, accept: this.accepts, class: "drag-drop-input-hidden", ref: (el) => (this.fileInputEl = el), onChange: this.onFileSelect, "aria-label": `${this.browseLabel} - ${this.label}`, tabindex: -1 })));
127
129
  }
128
130
  static get is() { return "xplor-drag-and-drop-input"; }
129
131
  static get encapsulation() { return "scoped"; }
@@ -219,6 +221,25 @@ export class XplorDragAndDropInput {
219
221
  "reflect": false,
220
222
  "defaultValue": "'Browse Files'"
221
223
  },
224
+ "ariaLabel": {
225
+ "type": "string",
226
+ "attribute": "aria-label",
227
+ "mutable": false,
228
+ "complexType": {
229
+ "original": "string",
230
+ "resolved": "string",
231
+ "references": {}
232
+ },
233
+ "required": false,
234
+ "optional": false,
235
+ "docs": {
236
+ "tags": [],
237
+ "text": "Accessible label for the drop zone area"
238
+ },
239
+ "getter": false,
240
+ "setter": false,
241
+ "reflect": false
242
+ },
222
243
  "progress": {
223
244
  "type": "number",
224
245
  "attribute": "progress",
@@ -1 +1 @@
1
- {"version":3,"file":"xplor-drag-and-drop-input.js","sourceRoot":"","sources":["../../../src/components/xplor-drag-and-drop-input/xplor-drag-and-drop-input.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, Host, h, Prop, State, Event, EventEmitter, Method } from '@stencil/core';\n\nconst DEFAULT_ACCEPT_ALL = '*' + '/' + '*';\n\n@Component({\n tag: 'xplor-drag-and-drop-input',\n styleUrl: 'xplor-drag-and-drop-input.scss',\n scoped: true,\n})\nexport class XplorDragAndDropInput {\n /**\n * Disable the file upload\n */\n @Prop() disabled: boolean = false;\n\n /**\n * Accepted file types (e.g., 'image/png,.pdf')\n */\n @Prop() accepts: string = DEFAULT_ACCEPT_ALL;\n\n /**\n * Instruction text displayed in the drop zone\n */\n @Prop() label: string = 'Drag and drop your files here';\n\n /**\n * Browse button label text\n */\n @Prop() browseLabel: string = 'Browse Files';\n\n /**\n * Upload progress percentage (0-100). Set to -1 or leave undefined to hide the progress bar.\n */\n @Prop() progress: number = -1;\n\n @State() dragover: boolean = false;\n @State() currentFile: File | null = null;\n\n /**\n * Emitted when a file is selected via drop or click\n */\n @Event() fileSelect: EventEmitter<File>;\n\n /**\n * Emitted when the current file is cleared\n */\n @Event() fileClear: EventEmitter<void>;\n\n private fileInputEl: HTMLInputElement;\n\n /**\n * Clears the currently selected file\n */\n @Method()\n async clearCurrentFile() {\n this.currentFile = null;\n if (this.fileInputEl) {\n this.fileInputEl.value = '';\n }\n this.fileClear.emit();\n }\n\n private onDrop = (e: DragEvent) => {\n e.preventDefault();\n this.dragover = false;\n\n if (this.disabled) return;\n\n const file = e.dataTransfer?.files?.[0];\n if (file) {\n this.currentFile = file;\n this.fileSelect.emit(this.currentFile);\n }\n };\n\n private onDragOver = (e: DragEvent) => {\n e.preventDefault();\n if (!this.disabled) {\n this.dragover = true;\n }\n };\n\n private onDragEnter = (e: DragEvent) => {\n e.preventDefault();\n if (!this.disabled) {\n this.dragover = true;\n }\n };\n\n private onDragLeave = (e: DragEvent) => {\n e.preventDefault();\n this.dragover = false;\n };\n\n private onFileSelect = (e: Event) => {\n const input = e.target as HTMLInputElement;\n const file = input.files?.[0];\n if (file) {\n this.currentFile = file;\n this.fileSelect.emit(this.currentFile);\n }\n input.value = '';\n };\n\n private openFileDialog = () => {\n if (this.disabled) {\n return;\n }\n\n this.fileInputEl?.click();\n };\n\n private getAcceptsLabel = () => {\n const accepts = this.accepts?.trim();\n if (!accepts || accepts === DEFAULT_ACCEPT_ALL) {\n return '*';\n }\n\n return accepts;\n };\n\n private formatFileSize = (bytes: number): string => {\n if (bytes === 0) return '0 Bytes';\n const k = 1024;\n const sizes = ['Bytes', 'KB', 'MB', 'GB'];\n const i = Math.floor(Math.log(bytes) / Math.log(k));\n return parseFloat((bytes / Math.pow(k, i)).toFixed(2)) + ' ' + sizes[i];\n };\n\n private formatDate = (timestamp: number): string => {\n const date = new Date(timestamp);\n const day = date.getDate();\n const months = ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec'];\n const month = months[date.getMonth()];\n const year = date.getFullYear();\n\n const suffix = (day === 1 || day === 21 || day === 31) ? 'st'\n : (day === 2 || day === 22) ? 'nd'\n : (day === 3 || day === 23) ? 'rd'\n : 'th';\n\n const hours = date.getHours();\n const minutes = date.getMinutes().toString().padStart(2, '0');\n const seconds = date.getSeconds().toString().padStart(2, '0');\n const ampm = hours >= 12 ? 'PM' : 'AM';\n const displayHours = hours % 12 || 12;\n\n return `${day}${suffix} ${month} ${year}, ${displayHours}:${minutes}:${seconds} ${ampm}`;\n };\n\n private showProgress = (): boolean => {\n return this.progress >= 0 && this.progress <= 100;\n };\n\n render() {\n return (\n <Host>\n <div class=\"drag-drop-zone\">\n <div\n class={{\n 'drag-drop-card': true,\n 'drag-drop-card--dragover': this.dragover,\n 'drag-drop-card--disabled': this.disabled,\n }}\n onDrop={this.onDrop}\n onDragOver={this.onDragOver}\n onDragEnter={this.onDragEnter}\n onDragLeave={this.onDragLeave}\n >\n <div class=\"drag-drop-card__content\">\n <svg\n class=\"drag-drop-card__icon\"\n xmlns=\"http://www.w3.org/2000/svg\"\n width=\"40\"\n height=\"40\"\n viewBox=\"0 0 24 24\"\n fill=\"none\"\n >\n <path\n d=\"M19.35 10.04C18.67 6.59 15.64 4 12 4C9.11 4 6.6 5.64 5.35 8.04C2.34 8.36 0 10.91 0 14C0 17.31 2.69 20 6 20H19C21.76 20 24 17.76 24 15C24 12.36 21.95 10.22 19.35 10.04Z\"\n fill=\"currentColor\"\n opacity=\"0.3\"\n />\n <path\n d=\"M19.35 10.04C18.67 6.59 15.64 4 12 4C9.11 4 6.6 5.64 5.35 8.04C2.34 8.36 0 10.91 0 14C0 17.31 2.69 20 6 20H19C21.76 20 24 17.76 24 15C24 12.36 21.95 10.22 19.35 10.04ZM14 13V17H10V13H7L12 8L17 13H14Z\"\n fill=\"currentColor\"\n />\n </svg>\n <h3 class=\"drag-drop-card__title\">{this.label}</h3>\n <p class=\"drag-drop-card__accepts\">Accepted file types: {this.getAcceptsLabel()}</p>\n <p class=\"drag-drop-card__divider\">or</p>\n </div>\n </div>\n\n <div class=\"drag-drop-card__action\">\n <xplor-button\n text={this.browseLabel}\n type={this.disabled ? 'disabled' : 'secondary'}\n clickAction={this.openFileDialog}\n ></xplor-button>\n </div>\n </div>\n\n {this.currentFile && (\n <div class=\"file-info\">\n {this.showProgress() && (\n <p class=\"file-info__status\">\n Uploading {this.progress === 100 ? '1' : '0'} / 1\n </p>\n )}\n <div class=\"file-info__card\">\n <div class=\"file-info__icon\">\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"currentColor\">\n <path d=\"M14 2H6C4.9 2 4 2.9 4 4V20C4 21.1 4.9 22 6 22H18C19.1 22 20 21.1 20 20V8L14 2ZM6 20V4H13V9H18V20H6Z\" />\n </svg>\n </div>\n <div class=\"file-info__details\">\n <p class=\"file-info__name\">{this.currentFile.name}</p>\n <p class=\"file-info__meta\">\n {this.formatFileSize(this.currentFile.size)}\n {this.currentFile.lastModified\n ? ` | Last modified: ${this.formatDate(this.currentFile.lastModified)}`\n : ''}\n </p>\n {this.showProgress() && (\n <div class=\"file-info__progress-row\">\n <div class=\"file-info__progress-bar\">\n <div\n class=\"file-info__progress-fill\"\n style={{ width: `${Math.min(Math.max(this.progress, 0), 100)}%` }}\n ></div>\n </div>\n <span class=\"file-info__progress-text\">{Math.round(this.progress)}%</span>\n </div>\n )}\n </div>\n <button\n class=\"file-info__remove\"\n onClick={() => this.clearCurrentFile()}\n aria-label=\"Remove file\"\n >\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"18\" height=\"18\" viewBox=\"0 0 24 24\" fill=\"currentColor\">\n <path d=\"M19 6.41L17.59 5 12 10.59 6.41 5 5 6.41 10.59 12 5 17.59 6.41 19 12 13.41 17.59 19 19 17.59 13.41 12Z\" />\n </svg>\n </button>\n </div>\n </div>\n )}\n\n <input\n id=\"drag-drop-file-select\"\n type=\"file\"\n disabled={this.disabled}\n accept={this.accepts}\n class=\"drag-drop-input-hidden\"\n ref={(el) => (this.fileInputEl = el)}\n onChange={this.onFileSelect}\n />\n </Host>\n );\n }\n}\n"]}
1
+ {"version":3,"file":"xplor-drag-and-drop-input.js","sourceRoot":"","sources":["../../../src/components/xplor-drag-and-drop-input/xplor-drag-and-drop-input.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, Host, h, Prop, State, Event, EventEmitter, Method } from '@stencil/core';\n\nconst DEFAULT_ACCEPT_ALL = '*' + '/' + '*';\n\n@Component({\n tag: 'xplor-drag-and-drop-input',\n styleUrl: 'xplor-drag-and-drop-input.scss',\n scoped: true,\n})\nexport class XplorDragAndDropInput {\n /**\n * Disable the file upload\n */\n @Prop() disabled: boolean = false;\n\n /**\n * Accepted file types (e.g., 'image/png,.pdf')\n */\n @Prop() accepts: string = DEFAULT_ACCEPT_ALL;\n\n /**\n * Instruction text displayed in the drop zone\n */\n @Prop() label: string = 'Drag and drop your files here';\n\n /**\n * Browse button label text\n */\n @Prop() browseLabel: string = 'Browse Files';\n\n /**\n * Accessible label for the drop zone area\n */\n @Prop() ariaLabel: string;\n\n /**\n * Upload progress percentage (0-100). Set to -1 or leave undefined to hide the progress bar.\n */\n @Prop() progress: number = -1;\n\n @State() dragover: boolean = false;\n @State() currentFile: File | null = null;\n\n /**\n * Emitted when a file is selected via drop or click\n */\n @Event() fileSelect: EventEmitter<File>;\n\n /**\n * Emitted when the current file is cleared\n */\n @Event() fileClear: EventEmitter<void>;\n\n private fileInputEl: HTMLInputElement;\n\n /**\n * Clears the currently selected file\n */\n @Method()\n async clearCurrentFile() {\n this.currentFile = null;\n if (this.fileInputEl) {\n this.fileInputEl.value = '';\n }\n this.fileClear.emit();\n }\n\n private onDrop = (e: DragEvent) => {\n e.preventDefault();\n this.dragover = false;\n\n if (this.disabled) return;\n\n const file = e.dataTransfer?.files?.[0];\n if (file) {\n this.currentFile = file;\n this.fileSelect.emit(this.currentFile);\n }\n };\n\n private onDragOver = (e: DragEvent) => {\n e.preventDefault();\n if (!this.disabled) {\n this.dragover = true;\n }\n };\n\n private onDragEnter = (e: DragEvent) => {\n e.preventDefault();\n if (!this.disabled) {\n this.dragover = true;\n }\n };\n\n private onDragLeave = (e: DragEvent) => {\n e.preventDefault();\n this.dragover = false;\n };\n\n private onFileSelect = (e: Event) => {\n const input = e.target as HTMLInputElement;\n const file = input.files?.[0];\n if (file) {\n this.currentFile = file;\n this.fileSelect.emit(this.currentFile);\n }\n input.value = '';\n };\n\n private openFileDialog = () => {\n if (this.disabled) {\n return;\n }\n\n this.fileInputEl?.click();\n };\n\n private getAcceptsLabel = () => {\n const accepts = this.accepts?.trim();\n if (!accepts || accepts === DEFAULT_ACCEPT_ALL) {\n return '*';\n }\n\n return accepts;\n };\n\n private formatFileSize = (bytes: number): string => {\n if (bytes === 0) return '0 Bytes';\n const k = 1024;\n const sizes = ['Bytes', 'KB', 'MB', 'GB'];\n const i = Math.floor(Math.log(bytes) / Math.log(k));\n return parseFloat((bytes / Math.pow(k, i)).toFixed(2)) + ' ' + sizes[i];\n };\n\n private formatDate = (timestamp: number): string => {\n const date = new Date(timestamp);\n const day = date.getDate();\n const months = ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec'];\n const month = months[date.getMonth()];\n const year = date.getFullYear();\n\n const suffix = (day === 1 || day === 21 || day === 31) ? 'st'\n : (day === 2 || day === 22) ? 'nd'\n : (day === 3 || day === 23) ? 'rd'\n : 'th';\n\n const hours = date.getHours();\n const minutes = date.getMinutes().toString().padStart(2, '0');\n const seconds = date.getSeconds().toString().padStart(2, '0');\n const ampm = hours >= 12 ? 'PM' : 'AM';\n const displayHours = hours % 12 || 12;\n\n return `${day}${suffix} ${month} ${year}, ${displayHours}:${minutes}:${seconds} ${ampm}`;\n };\n\n private showProgress = (): boolean => {\n return this.progress >= 0 && this.progress <= 100;\n };\n\n render() {\n const progressValue = Math.min(Math.max(this.progress, 0), 100);\n const dropZoneLabel = this.ariaLabel || `${this.label}. Accepted file types: ${this.getAcceptsLabel()}. Or use the ${this.browseLabel} button.`;\n\n return (\n <Host>\n <div class=\"drag-drop-zone\">\n <div\n class={{\n 'drag-drop-card': true,\n 'drag-drop-card--dragover': this.dragover,\n 'drag-drop-card--disabled': this.disabled,\n }}\n onDrop={this.onDrop}\n onDragOver={this.onDragOver}\n onDragEnter={this.onDragEnter}\n onDragLeave={this.onDragLeave}\n role=\"region\"\n aria-label={dropZoneLabel}\n >\n <div class=\"drag-drop-card__content\">\n <svg\n class=\"drag-drop-card__icon\"\n xmlns=\"http://www.w3.org/2000/svg\"\n width=\"40\"\n height=\"40\"\n viewBox=\"0 0 24 24\"\n fill=\"none\"\n aria-hidden=\"true\"\n >\n <path\n d=\"M19.35 10.04C18.67 6.59 15.64 4 12 4C9.11 4 6.6 5.64 5.35 8.04C2.34 8.36 0 10.91 0 14C0 17.31 2.69 20 6 20H19C21.76 20 24 17.76 24 15C24 12.36 21.95 10.22 19.35 10.04Z\"\n fill=\"currentColor\"\n opacity=\"0.3\"\n />\n <path\n d=\"M19.35 10.04C18.67 6.59 15.64 4 12 4C9.11 4 6.6 5.64 5.35 8.04C2.34 8.36 0 10.91 0 14C0 17.31 2.69 20 6 20H19C21.76 20 24 17.76 24 15C24 12.36 21.95 10.22 19.35 10.04ZM14 13V17H10V13H7L12 8L17 13H14Z\"\n fill=\"currentColor\"\n />\n </svg>\n <h3 class=\"drag-drop-card__title\">{this.label}</h3>\n {this.accepts && this.accepts !== DEFAULT_ACCEPT_ALL && (\n <p class=\"drag-drop-card__accepts\">Accepted file types: {this.getAcceptsLabel()}</p>\n )}\n <div class=\"drag-drop-card__action\">\n <xplor-button\n text={this.browseLabel}\n type={this.disabled ? 'disabled' : 'secondary'}\n clickAction={this.openFileDialog}\n aria-label={this.browseLabel}\n ></xplor-button>\n </div>\n </div>\n </div>\n </div>\n\n {this.currentFile && (\n <div class=\"file-info\" aria-live=\"polite\">\n {this.showProgress() && (\n <p class=\"file-info__status\">\n Uploading {this.progress === 100 ? '1' : '0'} / 1\n </p>\n )}\n <div class=\"file-info__card\">\n <div class=\"file-info__icon\" aria-hidden=\"true\">\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"currentColor\">\n <path d=\"M14 2H6C4.9 2 4 2.9 4 4V20C4 21.1 4.9 22 6 22H18C19.1 22 20 21.1 20 20V8L14 2ZM6 20V4H13V9H18V20H6Z\" />\n </svg>\n </div>\n <div class=\"file-info__details\">\n <p class=\"file-info__name\">{this.currentFile.name}</p>\n <p class=\"file-info__meta\">\n {this.formatFileSize(this.currentFile.size)}\n {this.currentFile.lastModified\n ? ` | Last modified: ${this.formatDate(this.currentFile.lastModified)}`\n : ''}\n </p>\n {this.showProgress() && (\n <div class=\"file-info__progress-row\">\n <div\n class=\"file-info__progress-bar\"\n role=\"progressbar\"\n aria-valuenow={progressValue}\n aria-valuemin={0}\n aria-valuemax={100}\n aria-label={`Upload progress: ${Math.round(progressValue)}%`}\n >\n <div\n class=\"file-info__progress-fill\"\n style={{ width: `${progressValue}%` }}\n ></div>\n </div>\n <span class=\"file-info__progress-text\" aria-hidden=\"true\">{Math.round(this.progress)}%</span>\n </div>\n )}\n </div>\n <button\n class=\"file-info__remove\"\n onClick={() => this.clearCurrentFile()}\n aria-label={`Remove file ${this.currentFile.name}`}\n >\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"18\" height=\"18\" viewBox=\"0 0 24 24\" fill=\"currentColor\" aria-hidden=\"true\">\n <path d=\"M19 6.41L17.59 5 12 10.59 6.41 5 5 6.41 10.59 12 5 17.59 6.41 19 12 13.41 17.59 19 19 17.59 13.41 12Z\" />\n </svg>\n </button>\n </div>\n </div>\n )}\n\n <input\n id=\"drag-drop-file-select\"\n type=\"file\"\n disabled={this.disabled}\n accept={this.accepts}\n class=\"drag-drop-input-hidden\"\n ref={(el) => (this.fileInputEl = el)}\n onChange={this.onFileSelect}\n aria-label={`${this.browseLabel} - ${this.label}`}\n tabindex={-1}\n />\n </Host>\n );\n }\n}\n"]}
@@ -1,7 +1,7 @@
1
1
  import { Host, h } from "@stencil/core";
2
2
  export class XplorDropdown {
3
3
  render() {
4
- return (h(Host, { key: 'bfd5bc76c18f4c7882ec47389978338eec81b1d1' }, h("select", { key: '54310c80fdda944ca6d9cc8faaf643e79d4a5f32', class: "xplor-dropdown", onChange: this.handleChange }, this.options.map((option) => (h("option", { value: option, selected: this.selected === option }, option))))));
4
+ return (h(Host, { key: '51c3f9372a79efeeffc662149ada3cd50c76fcbf' }, h("select", { key: '5bf6285178fd454f76089f62ad17d49654e88bf8', class: "xplor-dropdown", onChange: this.handleChange }, this.options.map((option) => (h("option", { value: option, selected: this.selected === option }, option))))));
5
5
  }
6
6
  static get is() { return "xplor-dropdown"; }
7
7
  static get encapsulation() { return "shadow"; }
@@ -26,16 +26,16 @@ export class XplorExpansionPanel {
26
26
  }
27
27
  }
28
28
  render() {
29
- return (h(Host, { key: 'f2b19e6a1ad6315341e0840e2c000a1123caa7e0' }, h("div", { key: '1cb9ca368efb2f9e16c64c3987546f3d16981a2b', class: {
29
+ return (h(Host, { key: '3db1f2fc99643b6c032e49d12c8eedb06ae2ceb9' }, h("div", { key: 'ba08fc1332346fd14e2614184a2da5f99c90e217', class: {
30
30
  'expansion-panel': true,
31
31
  'expansion-panel--open': this.open,
32
32
  'expansion-panel--disabled': this.disabled,
33
- } }, h("button", { key: '4970230eb38600f662441cf741b1266af1c94221', class: "expansion-panel__header", onClick: this.handleToggle, disabled: this.disabled, "aria-expanded": this.open ? 'true' : 'false', type: "button" }, h("div", { key: '5e3330870f44e2f0d0e9546cc3921f999c585ad2', class: "expansion-panel__header-content" }, h("slot", { key: 'f8cf1d3dcc8201c311adb40544adc59dc10643b2', name: "header" })), h("span", { key: 'bed27404d65c83a0aed80b6f63847a3b221756c4', class: {
33
+ } }, h("button", { key: 'b370c00ac9b58af67594679a7c28915d7ecaf622', class: "expansion-panel__header", onClick: this.handleToggle, disabled: this.disabled, "aria-expanded": this.open ? 'true' : 'false', "aria-controls": `${this.panelId}-content`, type: "button" }, h("div", { key: '7a2a65a0189cb9fbdbca615091f6e13e3d94b748', class: "expansion-panel__header-content" }, h("slot", { key: 'a20162d047d41cf219fb412973a92c3f16844640', name: "header" })), h("span", { key: '4dd148cb2d4461285fce95de5bf8cbb3df36e7b7', class: {
34
34
  'expansion-panel__icon': true,
35
35
  'expansion-panel__icon--open': this.open,
36
- } }, "\u25BC")), h("div", { key: '2c39930ed945844bde37acd8eb76cc5d321fb9e1', class: "expansion-panel__content", style: {
36
+ } }, "\u25BC")), h("div", { key: '9d8a260d927387f5dd1e7e3d429f86d31f2689bf', class: "expansion-panel__content", id: `${this.panelId}-content`, role: "region", "aria-labelledby": this.panelId, style: {
37
37
  maxHeight: this.open ? `${this.contentHeight}px` : '0',
38
- } }, h("div", { key: 'db622a60396115228e0a3929f1a0765b7a0bf87f', class: "expansion-panel__content-inner", ref: (el) => (this.contentEl = el) }, h("slot", { key: 'd88edfbce0ab807cdb3d21230e1e97caf6183cce' }))))));
38
+ } }, h("div", { key: '0ac08b6ca30a0fabc7e44f2c8737ee29fccec08a', class: "expansion-panel__content-inner", ref: (el) => (this.contentEl = el) }, h("slot", { key: '94753fe13b1378a95cac9cb4c940aedbc127c1b0' }))))));
39
39
  }
40
40
  static get is() { return "xplor-expansion-panel"; }
41
41
  static get encapsulation() { return "scoped"; }
@@ -1 +1 @@
1
- {"version":3,"file":"xplor-expansion-panel.js","sourceRoot":"","sources":["../../../src/components/xplor-expansion-panel/xplor-expansion-panel.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,IAAI,EAAE,CAAC,EAAE,IAAI,EAAE,KAAK,EAAE,KAAK,EAAgB,OAAO,EAAE,MAAM,eAAe,CAAC;AAE9F,IAAI,MAAM,GAAG,CAAC,CAAC;AAOf,MAAM,OAAO,mBAAmB;IALhC;QAQY,aAAQ,GAAY,KAAK,CAAC;QACT,SAAI,GAAY,KAAK,CAAC;QAGtC,kBAAa,GAAW,CAAC,CAAC;QAoB3B,iBAAY,GAAG,GAAG,EAAE;YACxB,IAAI,IAAI,CAAC,QAAQ;gBAAE,OAAO;YAE1B,IAAI,CAAC,IAAI,GAAG,CAAC,IAAI,CAAC,IAAI,CAAC;YACvB,IAAI,CAAC,gBAAgB,CAAC,IAAI,CAAC,EAAE,EAAE,EAAE,IAAI,CAAC,OAAO,EAAE,MAAM,EAAE,IAAI,CAAC,IAAI,EAAE,CAAC,CAAC;YAEpE,6BAA6B;YAC7B,UAAU,CAAC,GAAG,EAAE,CAAC,IAAI,CAAC,mBAAmB,EAAE,EAAE,CAAC,CAAC,CAAC;QACpD,CAAC,CAAC;KAgDL;IAtEG,iBAAiB;QACb,IAAI,CAAC,OAAO,GAAG,SAAS,MAAM,EAAE,EAAE,CAAC;IACvC,CAAC;IAED,gBAAgB;QACZ,IAAI,CAAC,mBAAmB,EAAE,CAAC;IAC/B,CAAC;IAEO,mBAAmB;QACvB,IAAI,IAAI,CAAC,SAAS,EAAE,CAAC;YACjB,IAAI,CAAC,aAAa,GAAG,IAAI,CAAC,SAAS,CAAC,YAAY,CAAC;QACrD,CAAC;IACL,CAAC;IAYD,MAAM;QACF,OAAO,CACH,EAAC,IAAI;YACD,4DACI,KAAK,EAAE;oBACH,iBAAiB,EAAE,IAAI;oBACvB,uBAAuB,EAAE,IAAI,CAAC,IAAI;oBAClC,2BAA2B,EAAE,IAAI,CAAC,QAAQ;iBAC7C;gBAED,+DACI,KAAK,EAAC,yBAAyB,EAC/B,OAAO,EAAE,IAAI,CAAC,YAAY,EAC1B,QAAQ,EAAE,IAAI,CAAC,QAAQ,mBACR,IAAI,CAAC,IAAI,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,OAAO,EAC3C,IAAI,EAAC,QAAQ;oBAEb,4DAAK,KAAK,EAAC,iCAAiC;wBACxC,6DAAM,IAAI,EAAC,QAAQ,GAAG,CACpB;oBACN,6DACI,KAAK,EAAE;4BACH,uBAAuB,EAAE,IAAI;4BAC7B,6BAA6B,EAAE,IAAI,CAAC,IAAI;yBAC3C,aAGE,CACF;gBACT,4DACI,KAAK,EAAC,0BAA0B,EAChC,KAAK,EAAE;wBACH,SAAS,EAAE,IAAI,CAAC,IAAI,CAAC,CAAC,CAAC,GAAG,IAAI,CAAC,aAAa,IAAI,CAAC,CAAC,CAAC,GAAG;qBACzD;oBAED,4DACI,KAAK,EAAC,gCAAgC,EACtC,GAAG,EAAE,CAAC,EAAE,EAAE,EAAE,CAAC,CAAC,IAAI,CAAC,SAAS,GAAG,EAAE,CAAC;wBAElC,8DAAQ,CACN,CACJ,CACJ,CACH,CACV,CAAC;IACN,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACJ","sourcesContent":["import { Component, Host, h, Prop, State, Event, EventEmitter, Element } from '@stencil/core';\n\nlet nextId = 0;\n\n@Component({\n tag: 'xplor-expansion-panel',\n styleUrl: 'xplor-expansion-panel.scss',\n scoped: true,\n})\nexport class XplorExpansionPanel {\n @Element() el: HTMLElement;\n\n @Prop() disabled: boolean = false;\n @Prop({ mutable: true }) open: boolean = false;\n\n @State() panelId: string;\n @State() contentHeight: number = 0;\n\n @Event() xplorPanelToggle: EventEmitter<{ id: string; isOpen: boolean }>;\n\n private contentEl: HTMLDivElement;\n\n componentWillLoad() {\n this.panelId = `panel-${nextId++}`;\n }\n\n componentDidLoad() {\n this.updateContentHeight();\n }\n\n private updateContentHeight() {\n if (this.contentEl) {\n this.contentHeight = this.contentEl.scrollHeight;\n }\n }\n\n private handleToggle = () => {\n if (this.disabled) return;\n\n this.open = !this.open;\n this.xplorPanelToggle.emit({ id: this.panelId, isOpen: this.open });\n\n // Update height after toggle\n setTimeout(() => this.updateContentHeight(), 0);\n };\n\n render() {\n return (\n <Host>\n <div\n class={{\n 'expansion-panel': true,\n 'expansion-panel--open': this.open,\n 'expansion-panel--disabled': this.disabled,\n }}\n >\n <button\n class=\"expansion-panel__header\"\n onClick={this.handleToggle}\n disabled={this.disabled}\n aria-expanded={this.open ? 'true' : 'false'}\n type=\"button\"\n >\n <div class=\"expansion-panel__header-content\">\n <slot name=\"header\" />\n </div>\n <span\n class={{\n 'expansion-panel__icon': true,\n 'expansion-panel__icon--open': this.open,\n }}\n >\n ▼\n </span>\n </button>\n <div\n class=\"expansion-panel__content\"\n style={{\n maxHeight: this.open ? `${this.contentHeight}px` : '0',\n }}\n >\n <div\n class=\"expansion-panel__content-inner\"\n ref={(el) => (this.contentEl = el)}\n >\n <slot />\n </div>\n </div>\n </div>\n </Host>\n );\n }\n}\n"]}
1
+ {"version":3,"file":"xplor-expansion-panel.js","sourceRoot":"","sources":["../../../src/components/xplor-expansion-panel/xplor-expansion-panel.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,IAAI,EAAE,CAAC,EAAE,IAAI,EAAE,KAAK,EAAE,KAAK,EAAgB,OAAO,EAAE,MAAM,eAAe,CAAC;AAE9F,IAAI,MAAM,GAAG,CAAC,CAAC;AAOf,MAAM,OAAO,mBAAmB;IALhC;QAQY,aAAQ,GAAY,KAAK,CAAC;QACT,SAAI,GAAY,KAAK,CAAC;QAGtC,kBAAa,GAAW,CAAC,CAAC;QAoB3B,iBAAY,GAAG,GAAG,EAAE;YACxB,IAAI,IAAI,CAAC,QAAQ;gBAAE,OAAO;YAE1B,IAAI,CAAC,IAAI,GAAG,CAAC,IAAI,CAAC,IAAI,CAAC;YACvB,IAAI,CAAC,gBAAgB,CAAC,IAAI,CAAC,EAAE,EAAE,EAAE,IAAI,CAAC,OAAO,EAAE,MAAM,EAAE,IAAI,CAAC,IAAI,EAAE,CAAC,CAAC;YAEpE,6BAA6B;YAC7B,UAAU,CAAC,GAAG,EAAE,CAAC,IAAI,CAAC,mBAAmB,EAAE,EAAE,CAAC,CAAC,CAAC;QACpD,CAAC,CAAC;KAoDL;IA1EG,iBAAiB;QACb,IAAI,CAAC,OAAO,GAAG,SAAS,MAAM,EAAE,EAAE,CAAC;IACvC,CAAC;IAED,gBAAgB;QACZ,IAAI,CAAC,mBAAmB,EAAE,CAAC;IAC/B,CAAC;IAEO,mBAAmB;QACvB,IAAI,IAAI,CAAC,SAAS,EAAE,CAAC;YACjB,IAAI,CAAC,aAAa,GAAG,IAAI,CAAC,SAAS,CAAC,YAAY,CAAC;QACrD,CAAC;IACL,CAAC;IAYD,MAAM;QACF,OAAO,CACH,EAAC,IAAI;YACD,4DACI,KAAK,EAAE;oBACH,iBAAiB,EAAE,IAAI;oBACvB,uBAAuB,EAAE,IAAI,CAAC,IAAI;oBAClC,2BAA2B,EAAE,IAAI,CAAC,QAAQ;iBAC7C;gBAED,+DACI,KAAK,EAAC,yBAAyB,EAC/B,OAAO,EAAE,IAAI,CAAC,YAAY,EAC1B,QAAQ,EAAE,IAAI,CAAC,QAAQ,mBACR,IAAI,CAAC,IAAI,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,OAAO,mBAC5B,GAAG,IAAI,CAAC,OAAO,UAAU,EACxC,IAAI,EAAC,QAAQ;oBAEb,4DAAK,KAAK,EAAC,iCAAiC;wBACxC,6DAAM,IAAI,EAAC,QAAQ,GAAG,CACpB;oBACN,6DACI,KAAK,EAAE;4BACH,uBAAuB,EAAE,IAAI;4BAC7B,6BAA6B,EAAE,IAAI,CAAC,IAAI;yBAC3C,aAGE,CACF;gBACT,4DACI,KAAK,EAAC,0BAA0B,EAChC,EAAE,EAAE,GAAG,IAAI,CAAC,OAAO,UAAU,EAC7B,IAAI,EAAC,QAAQ,qBACI,IAAI,CAAC,OAAO,EAC7B,KAAK,EAAE;wBACH,SAAS,EAAE,IAAI,CAAC,IAAI,CAAC,CAAC,CAAC,GAAG,IAAI,CAAC,aAAa,IAAI,CAAC,CAAC,CAAC,GAAG;qBACzD;oBAED,4DACI,KAAK,EAAC,gCAAgC,EACtC,GAAG,EAAE,CAAC,EAAE,EAAE,EAAE,CAAC,CAAC,IAAI,CAAC,SAAS,GAAG,EAAE,CAAC;wBAElC,8DAAQ,CACN,CACJ,CACJ,CACH,CACV,CAAC;IACN,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACJ","sourcesContent":["import { Component, Host, h, Prop, State, Event, EventEmitter, Element } from '@stencil/core';\n\nlet nextId = 0;\n\n@Component({\n tag: 'xplor-expansion-panel',\n styleUrl: 'xplor-expansion-panel.scss',\n scoped: true,\n})\nexport class XplorExpansionPanel {\n @Element() el: HTMLElement;\n\n @Prop() disabled: boolean = false;\n @Prop({ mutable: true }) open: boolean = false;\n\n @State() panelId: string;\n @State() contentHeight: number = 0;\n\n @Event() xplorPanelToggle: EventEmitter<{ id: string; isOpen: boolean }>;\n\n private contentEl: HTMLDivElement;\n\n componentWillLoad() {\n this.panelId = `panel-${nextId++}`;\n }\n\n componentDidLoad() {\n this.updateContentHeight();\n }\n\n private updateContentHeight() {\n if (this.contentEl) {\n this.contentHeight = this.contentEl.scrollHeight;\n }\n }\n\n private handleToggle = () => {\n if (this.disabled) return;\n\n this.open = !this.open;\n this.xplorPanelToggle.emit({ id: this.panelId, isOpen: this.open });\n\n // Update height after toggle\n setTimeout(() => this.updateContentHeight(), 0);\n };\n\n render() {\n return (\n <Host>\n <div\n class={{\n 'expansion-panel': true,\n 'expansion-panel--open': this.open,\n 'expansion-panel--disabled': this.disabled,\n }}\n >\n <button\n class=\"expansion-panel__header\"\n onClick={this.handleToggle}\n disabled={this.disabled}\n aria-expanded={this.open ? 'true' : 'false'}\n aria-controls={`${this.panelId}-content`}\n type=\"button\"\n >\n <div class=\"expansion-panel__header-content\">\n <slot name=\"header\" />\n </div>\n <span\n class={{\n 'expansion-panel__icon': true,\n 'expansion-panel__icon--open': this.open,\n }}\n >\n ▼\n </span>\n </button>\n <div\n class=\"expansion-panel__content\"\n id={`${this.panelId}-content`}\n role=\"region\"\n aria-labelledby={this.panelId}\n style={{\n maxHeight: this.open ? `${this.contentHeight}px` : '0',\n }}\n >\n <div\n class=\"expansion-panel__content-inner\"\n ref={(el) => (this.contentEl = el)}\n >\n <slot />\n </div>\n </div>\n </div>\n </Host>\n );\n }\n}\n"]}
@@ -33,7 +33,7 @@ export class XplorExpansionPanels {
33
33
  this.value = this.multiple ? Array.from(this.openPanels) : Array.from(this.openPanels)[0] || '';
34
34
  }
35
35
  render() {
36
- return (h(Host, { key: 'c55c8eef4f6f134c83f2f8dffcb434401596a095' }, h("div", { key: '6611efdac4749c89180d34af7893577e09356ed1', class: "expansion-panels" }, h("slot", { key: 'ef8283e142cbd8fd6535c85a939455d99bdcc33e' }))));
36
+ return (h(Host, { key: '70452b8f734ded39c59a984b6a21e010d6512905' }, h("div", { key: '60ba67dc176b9cc141dd12d56e9f3e977eccd859', class: "expansion-panels", "aria-label": "Accordion" }, h("slot", { key: '99b9f4d51d54b8145ea0964638eecf687c2c8432' }))));
37
37
  }
38
38
  static get is() { return "xplor-expansion-panels"; }
39
39
  static get encapsulation() { return "scoped"; }
@@ -1 +1 @@
1
- {"version":3,"file":"xplor-expansion-panels.js","sourceRoot":"","sources":["../../../src/components/xplor-expansion-panels/xplor-expansion-panels.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,IAAI,EAAE,CAAC,EAAE,IAAI,EAAE,KAAK,EAAE,MAAM,EAAE,MAAM,eAAe,CAAC;AAOxE,MAAM,OAAO,oBAAoB;IALjC;QAM6B,UAAK,GAAsB,EAAE,CAAC;QAC/C,aAAQ,GAAY,KAAK,CAAC;QAC1B,cAAS,GAAY,IAAI,CAAC,CAAC,6DAA6D;QAEvF,eAAU,GAAgB,IAAI,GAAG,EAAE,CAAC;KAuChD;IArCG,iBAAiB;QACb,IAAI,KAAK,CAAC,OAAO,CAAC,IAAI,CAAC,KAAK,CAAC,EAAE,CAAC;YAC5B,IAAI,CAAC,UAAU,GAAG,IAAI,GAAG,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;QAC1C,CAAC;aAAM,IAAI,IAAI,CAAC,KAAK,EAAE,CAAC;YACpB,IAAI,CAAC,UAAU,GAAG,IAAI,GAAG,CAAC,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,CAAC;QAC5C,CAAC;IACL,CAAC;IAGD,iBAAiB,CAAC,KAAmD;QACjE,KAAK,CAAC,eAAe,EAAE,CAAC;QACxB,MAAM,EAAE,EAAE,EAAE,MAAM,EAAE,GAAG,KAAK,CAAC,MAAM,CAAC;QAEpC,IAAI,MAAM,EAAE,CAAC;YACT,IAAI,IAAI,CAAC,QAAQ,EAAE,CAAC;gBAChB,IAAI,CAAC,UAAU,GAAG,IAAI,GAAG,CAAC,CAAC,GAAG,IAAI,CAAC,UAAU,EAAE,EAAE,CAAC,CAAC,CAAC;YACxD,CAAC;iBAAM,CAAC;gBACJ,IAAI,CAAC,UAAU,GAAG,IAAI,GAAG,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC;YACpC,CAAC;QACL,CAAC;aAAM,CAAC;YACJ,MAAM,SAAS,GAAG,IAAI,GAAG,CAAC,IAAI,CAAC,UAAU,CAAC,CAAC;YAC3C,SAAS,CAAC,MAAM,CAAC,EAAE,CAAC,CAAC;YACrB,IAAI,CAAC,UAAU,GAAG,SAAS,CAAC;QAChC,CAAC;QAED,IAAI,CAAC,KAAK,GAAG,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,KAAK,CAAC,IAAI,CAAC,IAAI,CAAC,UAAU,CAAC,CAAC,CAAC,CAAC,KAAK,CAAC,IAAI,CAAC,IAAI,CAAC,UAAU,CAAC,CAAC,CAAC,CAAC,IAAI,EAAE,CAAC;IACpG,CAAC;IAED,MAAM;QACF,OAAO,CACH,EAAC,IAAI;YACD,4DAAK,KAAK,EAAC,kBAAkB;gBACzB,8DAAQ,CACN,CACH,CACV,CAAC;IACN,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACJ","sourcesContent":["import { Component, Host, h, Prop, State, Listen } from '@stencil/core';\n\n@Component({\n tag: 'xplor-expansion-panels',\n styleUrl: 'xplor-expansion-panels.scss',\n scoped: true,\n})\nexport class XplorExpansionPanels {\n @Prop({ mutable: true }) value: string | string[] = [];\n @Prop() multiple: boolean = false;\n @Prop() accordion: boolean = true; // accordion mode (only one open at a time when not multiple)\n\n @State() openPanels: Set<string> = new Set();\n\n componentWillLoad() {\n if (Array.isArray(this.value)) {\n this.openPanels = new Set(this.value);\n } else if (this.value) {\n this.openPanels = new Set([this.value]);\n }\n }\n\n @Listen('xplorPanelToggle')\n handlePanelToggle(event: CustomEvent<{ id: string; isOpen: boolean }>) {\n event.stopPropagation();\n const { id, isOpen } = event.detail;\n\n if (isOpen) {\n if (this.multiple) {\n this.openPanels = new Set([...this.openPanels, id]);\n } else {\n this.openPanels = new Set([id]);\n }\n } else {\n const newPanels = new Set(this.openPanels);\n newPanels.delete(id);\n this.openPanels = newPanels;\n }\n\n this.value = this.multiple ? Array.from(this.openPanels) : Array.from(this.openPanels)[0] || '';\n }\n\n render() {\n return (\n <Host>\n <div class=\"expansion-panels\">\n <slot />\n </div>\n </Host>\n );\n }\n}\n"]}
1
+ {"version":3,"file":"xplor-expansion-panels.js","sourceRoot":"","sources":["../../../src/components/xplor-expansion-panels/xplor-expansion-panels.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,IAAI,EAAE,CAAC,EAAE,IAAI,EAAE,KAAK,EAAE,MAAM,EAAE,MAAM,eAAe,CAAC;AAOxE,MAAM,OAAO,oBAAoB;IALjC;QAM6B,UAAK,GAAsB,EAAE,CAAC;QAC/C,aAAQ,GAAY,KAAK,CAAC;QAC1B,cAAS,GAAY,IAAI,CAAC,CAAC,6DAA6D;QAEvF,eAAU,GAAgB,IAAI,GAAG,EAAE,CAAC;KAuChD;IArCG,iBAAiB;QACb,IAAI,KAAK,CAAC,OAAO,CAAC,IAAI,CAAC,KAAK,CAAC,EAAE,CAAC;YAC5B,IAAI,CAAC,UAAU,GAAG,IAAI,GAAG,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;QAC1C,CAAC;aAAM,IAAI,IAAI,CAAC,KAAK,EAAE,CAAC;YACpB,IAAI,CAAC,UAAU,GAAG,IAAI,GAAG,CAAC,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,CAAC;QAC5C,CAAC;IACL,CAAC;IAGD,iBAAiB,CAAC,KAAmD;QACjE,KAAK,CAAC,eAAe,EAAE,CAAC;QACxB,MAAM,EAAE,EAAE,EAAE,MAAM,EAAE,GAAG,KAAK,CAAC,MAAM,CAAC;QAEpC,IAAI,MAAM,EAAE,CAAC;YACT,IAAI,IAAI,CAAC,QAAQ,EAAE,CAAC;gBAChB,IAAI,CAAC,UAAU,GAAG,IAAI,GAAG,CAAC,CAAC,GAAG,IAAI,CAAC,UAAU,EAAE,EAAE,CAAC,CAAC,CAAC;YACxD,CAAC;iBAAM,CAAC;gBACJ,IAAI,CAAC,UAAU,GAAG,IAAI,GAAG,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC;YACpC,CAAC;QACL,CAAC;aAAM,CAAC;YACJ,MAAM,SAAS,GAAG,IAAI,GAAG,CAAC,IAAI,CAAC,UAAU,CAAC,CAAC;YAC3C,SAAS,CAAC,MAAM,CAAC,EAAE,CAAC,CAAC;YACrB,IAAI,CAAC,UAAU,GAAG,SAAS,CAAC;QAChC,CAAC;QAED,IAAI,CAAC,KAAK,GAAG,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,KAAK,CAAC,IAAI,CAAC,IAAI,CAAC,UAAU,CAAC,CAAC,CAAC,CAAC,KAAK,CAAC,IAAI,CAAC,IAAI,CAAC,UAAU,CAAC,CAAC,CAAC,CAAC,IAAI,EAAE,CAAC;IACpG,CAAC;IAED,MAAM;QACF,OAAO,CACH,EAAC,IAAI;YACD,4DAAK,KAAK,EAAC,kBAAkB,gBAAY,WAAW;gBAChD,8DAAQ,CACN,CACH,CACV,CAAC;IACN,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACJ","sourcesContent":["import { Component, Host, h, Prop, State, Listen } from '@stencil/core';\n\n@Component({\n tag: 'xplor-expansion-panels',\n styleUrl: 'xplor-expansion-panels.scss',\n scoped: true,\n})\nexport class XplorExpansionPanels {\n @Prop({ mutable: true }) value: string | string[] = [];\n @Prop() multiple: boolean = false;\n @Prop() accordion: boolean = true; // accordion mode (only one open at a time when not multiple)\n\n @State() openPanels: Set<string> = new Set();\n\n componentWillLoad() {\n if (Array.isArray(this.value)) {\n this.openPanels = new Set(this.value);\n } else if (this.value) {\n this.openPanels = new Set([this.value]);\n }\n }\n\n @Listen('xplorPanelToggle')\n handlePanelToggle(event: CustomEvent<{ id: string; isOpen: boolean }>) {\n event.stopPropagation();\n const { id, isOpen } = event.detail;\n\n if (isOpen) {\n if (this.multiple) {\n this.openPanels = new Set([...this.openPanels, id]);\n } else {\n this.openPanels = new Set([id]);\n }\n } else {\n const newPanels = new Set(this.openPanels);\n newPanels.delete(id);\n this.openPanels = newPanels;\n }\n\n this.value = this.multiple ? Array.from(this.openPanels) : Array.from(this.openPanels)[0] || '';\n }\n\n render() {\n return (\n <Host>\n <div class=\"expansion-panels\" aria-label=\"Accordion\">\n <slot />\n </div>\n </Host>\n );\n }\n}\n"]}
@@ -134,11 +134,11 @@ export class XplorFileUpload {
134
134
  return Math.round(bytes / Math.pow(k, i) * 100) / 100 + ' ' + sizes[i];
135
135
  }
136
136
  render() {
137
- return (h(Host, { key: '9c3ad81ff741fe6324a5e8af562c740965024df1' }, h("div", { key: 'b0b9bb545ce5a4e74c38bc6b49f7681f6e10dd89', class: "file-upload" }, h("div", { key: 'd1f1198c0d47009ffa85cc1188d292029b979111', class: {
137
+ return (h(Host, { key: '9c3ad81ff741fe6324a5e8af562c740965024df1' }, h("div", { key: 'b0b9bb545ce5a4e74c38bc6b49f7681f6e10dd89', class: "file-upload" }, h("div", { key: '791a95676b8e640b7dbd84b6ccf95627e5a10d7e', class: {
138
138
  'file-upload__dropzone': true,
139
139
  'file-upload__dropzone--dragging': this.isDragging,
140
140
  'file-upload__dropzone--disabled': this.disabled,
141
- }, onDragOver: this.handleDragOver, onDragLeave: this.handleDragLeave, onDrop: this.handleDrop }, h("input", { key: '1625dae6ee5648ea0dee0673a892420d0dab2e7c', ref: (el) => (this.fileInputEl = el), type: "file", accept: this.accepts, multiple: this.multiple, disabled: this.disabled, onChange: this.handleFileSelect, class: "file-upload__input" }), h("div", { key: '2d1e0ff6e55dd56df7ff04829128dd74eb05d350', class: "file-upload__content" }, h("svg", { key: 'aab4f33389ed3cddc4d6a30300d384209058f64e', class: "file-upload__icon", width: "48", height: "48", viewBox: "0 0 24 24", fill: "none" }, h("path", { key: '51da727eaa0d9394184b54c845ae70c0de2c9c5c', d: "M12 15V3M12 3L8 7M12 3L16 7", stroke: "currentColor", "stroke-width": "2", "stroke-linecap": "round", "stroke-linejoin": "round" }), h("path", { key: '38123b6c7c9c898040a225d851ff7b488f8fedf4', d: "M2 17L2 19C2 20.1046 2.89543 21 4 21L20 21C21.1046 21 22 20.1046 22 19L22 17", stroke: "currentColor", "stroke-width": "2", "stroke-linecap": "round" })), h("p", { key: '530f416409a178f0dc9de208476085452e66156a', class: "file-upload__text" }, "Drag & drop files here or", ' ', h("button", { key: '9465171b3ee487fbf0e7aa75da09709eb061a32e', type: "button", class: "file-upload__button", onClick: this.handleButtonClick, disabled: this.disabled }, this.label)), h("p", { key: 'b94b0c91a37fc218362a25ffe46d77929a6752f5', class: "file-upload__hint" }, "Max size: ", this.formatFileSize(this.maxSize), this.accepts !== '*/*' && ` • Accepts: ${this.accepts}`))), this.error && (h("div", { key: '46a708db58e94110d41a8b86571dd29e58e76ae2', class: "file-upload__error", role: "alert" }, this.error)), this.files.length > 0 && (h("div", { key: '95d2aadf7587f759ecd3b55a84b7d6a7ec8c61ac', class: "file-upload__files" }, this.files.map((file) => (h("div", { key: file.id, class: "file-upload__file" }, file.dataUrl && (h("img", { src: file.dataUrl, alt: file.name, class: "file-upload__preview" })), h("div", { class: "file-upload__file-info" }, h("span", { class: "file-upload__file-name", title: file.name }, file.name), h("span", { class: "file-upload__file-size" }, this.formatFileSize(file.size))), h("button", { type: "button", class: "file-upload__remove", onClick: () => this.handleRemoveFile(file), "aria-label": `Remove ${file.name}` }, "\u00D7")))))))));
141
+ }, onDragOver: this.handleDragOver, onDragLeave: this.handleDragLeave, onDrop: this.handleDrop, "aria-label": `Drop zone for file upload. ${this.accepts !== '*/*' ? `Accepts: ${this.accepts}.` : ''} Maximum size: ${this.formatFileSize(this.maxSize)}` }, h("input", { key: 'c2b392d7fdd995819bceec3fa6122f457d78c2a4', ref: (el) => (this.fileInputEl = el), type: "file", accept: this.accepts, multiple: this.multiple, disabled: this.disabled, onChange: this.handleFileSelect, class: "file-upload__input" }), h("div", { key: '33e9ca40b7db3df954ea7221104a5191807ff05a', class: "file-upload__content" }, h("svg", { key: '84c718d713b36dd0b227a234c9b05f7a54bfeb02', class: "file-upload__icon", width: "48", height: "48", viewBox: "0 0 24 24", fill: "none" }, h("path", { key: '21c50cf95b559252a2604352a6d14b0b051d5480', d: "M12 15V3M12 3L8 7M12 3L16 7", stroke: "currentColor", "stroke-width": "2", "stroke-linecap": "round", "stroke-linejoin": "round" }), h("path", { key: '51d16f53f6553d9df2348e10f163b174efb61913', d: "M2 17L2 19C2 20.1046 2.89543 21 4 21L20 21C21.1046 21 22 20.1046 22 19L22 17", stroke: "currentColor", "stroke-width": "2", "stroke-linecap": "round" })), h("p", { key: '854efe384b8f181d5200d959db6633a6492c28f1', class: "file-upload__text" }, "Drag & drop files here or", ' ', h("button", { key: 'e83a3a2f6e6caee30173579c6397edacd6e1c8a8', type: "button", class: "file-upload__button", onClick: this.handleButtonClick, disabled: this.disabled }, this.label)), h("p", { key: 'a667e6665ce619f854c247626454efad11131568', class: "file-upload__hint" }, "Max size: ", this.formatFileSize(this.maxSize), this.accepts !== '*/*' && ` • Accepts: ${this.accepts}`))), this.error && (h("div", { key: '872a3eceb9eebbd35a06c0d841cf486e13bd48ea', class: "file-upload__error", role: "alert" }, this.error)), this.files.length > 0 && (h("div", { key: '15cc50322682fd1d555d313d089f18f92bfbb77d', class: "file-upload__files" }, this.files.map((file) => (h("div", { key: file.id, class: "file-upload__file" }, file.dataUrl && (h("img", { src: file.dataUrl, alt: file.name, class: "file-upload__preview" })), h("div", { class: "file-upload__file-info" }, h("span", { class: "file-upload__file-name", title: file.name }, file.name), h("span", { class: "file-upload__file-size" }, this.formatFileSize(file.size))), h("button", { type: "button", class: "file-upload__remove", onClick: () => this.handleRemoveFile(file), "aria-label": `Remove ${file.name}` }, "\u00D7")))))))));
142
142
  }
143
143
  static get is() { return "xplor-file-upload"; }
144
144
  static get encapsulation() { return "scoped"; }
@@ -300,7 +300,7 @@ export class XplorFileUpload {
300
300
  "references": {
301
301
  "UploadedFile": {
302
302
  "location": "local",
303
- "path": "/Users/darryn.lee-warden/Documents/DEV/xplor_design_system/apps/core-stencil-components/src/components/xplor-file-upload/xplor-file-upload.tsx",
303
+ "path": "/Users/darrynlee-warden/Documents/DEV/xplor/xplor_design_system/apps/core-stencil-components/src/components/xplor-file-upload/xplor-file-upload.tsx",
304
304
  "id": "src/components/xplor-file-upload/xplor-file-upload.tsx::UploadedFile"
305
305
  }
306
306
  }
@@ -321,7 +321,7 @@ export class XplorFileUpload {
321
321
  "references": {
322
322
  "UploadedFile": {
323
323
  "location": "local",
324
- "path": "/Users/darryn.lee-warden/Documents/DEV/xplor_design_system/apps/core-stencil-components/src/components/xplor-file-upload/xplor-file-upload.tsx",
324
+ "path": "/Users/darrynlee-warden/Documents/DEV/xplor/xplor_design_system/apps/core-stencil-components/src/components/xplor-file-upload/xplor-file-upload.tsx",
325
325
  "id": "src/components/xplor-file-upload/xplor-file-upload.tsx::UploadedFile"
326
326
  }
327
327
  }
@@ -1 +1 @@
1
- {"version":3,"file":"xplor-file-upload.js","sourceRoot":"","sources":["../../../src/components/xplor-file-upload/xplor-file-upload.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, Host, h, Prop, State, Event, EventEmitter } from '@stencil/core';\n\nconst DEFAULT_ACCEPT_ALL = '*' + '/' + '*';\n\nexport interface UploadedFile {\n file: File;\n id: string;\n name: string;\n size: number;\n type: string;\n dataUrl?: string;\n}\n\n@Component({\n tag: 'xplor-file-upload',\n styleUrl: 'xplor-file-upload.scss',\n scoped: true,\n})\nexport class XplorFileUpload {\n /**\n * Accepted file types (e.g., 'image/png', '.pdf', 'image/star'). Default accepts all types.\n */\n @Prop() accepts: string = DEFAULT_ACCEPT_ALL;\n\n /**\n * Maximum file size in bytes\n */\n @Prop() maxSize: number = 10 * 1024 * 1024; // 10MB default\n\n /**\n * Allow multiple file selection\n */\n @Prop() multiple: boolean = false;\n\n /**\n * Disable the file upload\n */\n @Prop() disabled: boolean = false;\n\n /**\n * Show image preview for uploaded images\n */\n @Prop() showPreview: boolean = true;\n\n /**\n * Label text for the upload button\n */\n @Prop() label: string = 'Upload Files';\n\n @State() files: UploadedFile[] = [];\n @State() isDragging: boolean = false;\n @State() error: string = '';\n\n @Event() xplorFileAdd: EventEmitter<UploadedFile[]>;\n @Event() xplorFileRemove: EventEmitter<UploadedFile>;\n @Event() xplorError: EventEmitter<string>;\n\n private fileInputEl: HTMLInputElement;\n\n private handleFileSelect = (event: Event) => {\n const input = event.target as HTMLInputElement;\n if (input.files) {\n this.processFiles(Array.from(input.files));\n }\n };\n\n private handleDragOver = (event: DragEvent) => {\n event.preventDefault();\n if (!this.disabled) {\n this.isDragging = true;\n }\n };\n\n private handleDragLeave = (event: DragEvent) => {\n event.preventDefault();\n this.isDragging = false;\n };\n\n private handleDrop = (event: DragEvent) => {\n event.preventDefault();\n this.isDragging = false;\n\n if (this.disabled) return;\n\n if (event.dataTransfer?.files) {\n this.processFiles(Array.from(event.dataTransfer.files));\n }\n };\n\n private processFiles(fileList: File[]) {\n this.error = '';\n const validFiles: UploadedFile[] = [];\n\n for (const file of fileList) {\n // Validate file size\n if (file.size > this.maxSize) {\n const maxSizeMB = (this.maxSize / (1024 * 1024)).toFixed(2);\n this.error = `File \"${file.name}\" exceeds maximum size of ${maxSizeMB}MB`;\n this.xplorError.emit(this.error);\n continue;\n }\n\n // Validate file type if specified\n if (this.accepts !== '*/*') {\n const acceptedTypes = this.accepts.split(',').map(t => t.trim());\n const fileExtension = `.${file.name.split('.').pop()}`;\n const isAccepted = acceptedTypes.some(type => {\n if (type.endsWith('/*')) {\n return file.type.startsWith(type.replace('/*', ''));\n }\n return type === file.type || type === fileExtension;\n });\n\n if (!isAccepted) {\n this.error = `File type \"${file.type}\" is not accepted`;\n this.xplorError.emit(this.error);\n continue;\n }\n }\n\n const uploadedFile: UploadedFile = {\n file,\n id: `${Date.now()}-${Math.random().toString(36).substr(2, 9)}`,\n name: file.name,\n size: file.size,\n type: file.type,\n };\n\n // Generate preview for images\n if (this.showPreview && file.type.startsWith('image/')) {\n const reader = new FileReader();\n reader.onload = (e) => {\n uploadedFile.dataUrl = e.target?.result as string;\n this.files = [...this.files];\n };\n reader.readAsDataURL(file);\n }\n\n validFiles.push(uploadedFile);\n }\n\n if (validFiles.length > 0) {\n if (this.multiple) {\n this.files = [...this.files, ...validFiles];\n } else {\n this.files = [validFiles[0]];\n }\n this.xplorFileAdd.emit(validFiles);\n }\n\n // Reset input\n if (this.fileInputEl) {\n this.fileInputEl.value = '';\n }\n }\n\n private handleRemoveFile = (fileToRemove: UploadedFile) => {\n this.files = this.files.filter(f => f.id !== fileToRemove.id);\n this.xplorFileRemove.emit(fileToRemove);\n };\n\n private handleButtonClick = () => {\n if (!this.disabled && this.fileInputEl) {\n this.fileInputEl.click();\n }\n };\n\n private formatFileSize(bytes: number): string {\n if (bytes === 0) return '0 Bytes';\n const k = 1024;\n const sizes = ['Bytes', 'KB', 'MB', 'GB'];\n const i = Math.floor(Math.log(bytes) / Math.log(k));\n return Math.round(bytes / Math.pow(k, i) * 100) / 100 + ' ' + sizes[i];\n }\n\n render() {\n return (\n <Host>\n <div class=\"file-upload\">\n <div\n class={{\n 'file-upload__dropzone': true,\n 'file-upload__dropzone--dragging': this.isDragging,\n 'file-upload__dropzone--disabled': this.disabled,\n }}\n onDragOver={this.handleDragOver}\n onDragLeave={this.handleDragLeave}\n onDrop={this.handleDrop}\n >\n <input\n ref={(el) => (this.fileInputEl = el)}\n type=\"file\"\n accept={this.accepts}\n multiple={this.multiple}\n disabled={this.disabled}\n onChange={this.handleFileSelect}\n class=\"file-upload__input\"\n />\n\n <div class=\"file-upload__content\">\n <svg class=\"file-upload__icon\" width=\"48\" height=\"48\" viewBox=\"0 0 24 24\" fill=\"none\">\n <path d=\"M12 15V3M12 3L8 7M12 3L16 7\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\n <path d=\"M2 17L2 19C2 20.1046 2.89543 21 4 21L20 21C21.1046 21 22 20.1046 22 19L22 17\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" />\n </svg>\n <p class=\"file-upload__text\">\n Drag & drop files here or{' '}\n <button\n type=\"button\"\n class=\"file-upload__button\"\n onClick={this.handleButtonClick}\n disabled={this.disabled}\n >\n {this.label}\n </button>\n </p>\n <p class=\"file-upload__hint\">\n Max size: {this.formatFileSize(this.maxSize)}\n {this.accepts !== '*/*' && ` • Accepts: ${this.accepts}`}\n </p>\n </div>\n </div>\n\n {this.error && (\n <div class=\"file-upload__error\" role=\"alert\">\n {this.error}\n </div>\n )}\n\n {this.files.length > 0 && (\n <div class=\"file-upload__files\">\n {this.files.map((file) => (\n <div key={file.id} class=\"file-upload__file\">\n {file.dataUrl && (\n <img src={file.dataUrl} alt={file.name} class=\"file-upload__preview\" />\n )}\n <div class=\"file-upload__file-info\">\n <span class=\"file-upload__file-name\" title={file.name}>\n {file.name}\n </span>\n <span class=\"file-upload__file-size\">\n {this.formatFileSize(file.size)}\n </span>\n </div>\n <button\n type=\"button\"\n class=\"file-upload__remove\"\n onClick={() => this.handleRemoveFile(file)}\n aria-label={`Remove ${file.name}`}\n >\n ×\n </button>\n </div>\n ))}\n </div>\n )}\n </div>\n </Host>\n );\n }\n}\n"]}
1
+ {"version":3,"file":"xplor-file-upload.js","sourceRoot":"","sources":["../../../src/components/xplor-file-upload/xplor-file-upload.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, Host, h, Prop, State, Event, EventEmitter } from '@stencil/core';\n\nconst DEFAULT_ACCEPT_ALL = '*' + '/' + '*';\n\nexport interface UploadedFile {\n file: File;\n id: string;\n name: string;\n size: number;\n type: string;\n dataUrl?: string;\n}\n\n@Component({\n tag: 'xplor-file-upload',\n styleUrl: 'xplor-file-upload.scss',\n scoped: true,\n})\nexport class XplorFileUpload {\n /**\n * Accepted file types (e.g., 'image/png', '.pdf', 'image/star'). Default accepts all types.\n */\n @Prop() accepts: string = DEFAULT_ACCEPT_ALL;\n\n /**\n * Maximum file size in bytes\n */\n @Prop() maxSize: number = 10 * 1024 * 1024; // 10MB default\n\n /**\n * Allow multiple file selection\n */\n @Prop() multiple: boolean = false;\n\n /**\n * Disable the file upload\n */\n @Prop() disabled: boolean = false;\n\n /**\n * Show image preview for uploaded images\n */\n @Prop() showPreview: boolean = true;\n\n /**\n * Label text for the upload button\n */\n @Prop() label: string = 'Upload Files';\n\n @State() files: UploadedFile[] = [];\n @State() isDragging: boolean = false;\n @State() error: string = '';\n\n @Event() xplorFileAdd: EventEmitter<UploadedFile[]>;\n @Event() xplorFileRemove: EventEmitter<UploadedFile>;\n @Event() xplorError: EventEmitter<string>;\n\n private fileInputEl: HTMLInputElement;\n\n private handleFileSelect = (event: Event) => {\n const input = event.target as HTMLInputElement;\n if (input.files) {\n this.processFiles(Array.from(input.files));\n }\n };\n\n private handleDragOver = (event: DragEvent) => {\n event.preventDefault();\n if (!this.disabled) {\n this.isDragging = true;\n }\n };\n\n private handleDragLeave = (event: DragEvent) => {\n event.preventDefault();\n this.isDragging = false;\n };\n\n private handleDrop = (event: DragEvent) => {\n event.preventDefault();\n this.isDragging = false;\n\n if (this.disabled) return;\n\n if (event.dataTransfer?.files) {\n this.processFiles(Array.from(event.dataTransfer.files));\n }\n };\n\n private processFiles(fileList: File[]) {\n this.error = '';\n const validFiles: UploadedFile[] = [];\n\n for (const file of fileList) {\n // Validate file size\n if (file.size > this.maxSize) {\n const maxSizeMB = (this.maxSize / (1024 * 1024)).toFixed(2);\n this.error = `File \"${file.name}\" exceeds maximum size of ${maxSizeMB}MB`;\n this.xplorError.emit(this.error);\n continue;\n }\n\n // Validate file type if specified\n if (this.accepts !== '*/*') {\n const acceptedTypes = this.accepts.split(',').map(t => t.trim());\n const fileExtension = `.${file.name.split('.').pop()}`;\n const isAccepted = acceptedTypes.some(type => {\n if (type.endsWith('/*')) {\n return file.type.startsWith(type.replace('/*', ''));\n }\n return type === file.type || type === fileExtension;\n });\n\n if (!isAccepted) {\n this.error = `File type \"${file.type}\" is not accepted`;\n this.xplorError.emit(this.error);\n continue;\n }\n }\n\n const uploadedFile: UploadedFile = {\n file,\n id: `${Date.now()}-${Math.random().toString(36).substr(2, 9)}`,\n name: file.name,\n size: file.size,\n type: file.type,\n };\n\n // Generate preview for images\n if (this.showPreview && file.type.startsWith('image/')) {\n const reader = new FileReader();\n reader.onload = (e) => {\n uploadedFile.dataUrl = e.target?.result as string;\n this.files = [...this.files];\n };\n reader.readAsDataURL(file);\n }\n\n validFiles.push(uploadedFile);\n }\n\n if (validFiles.length > 0) {\n if (this.multiple) {\n this.files = [...this.files, ...validFiles];\n } else {\n this.files = [validFiles[0]];\n }\n this.xplorFileAdd.emit(validFiles);\n }\n\n // Reset input\n if (this.fileInputEl) {\n this.fileInputEl.value = '';\n }\n }\n\n private handleRemoveFile = (fileToRemove: UploadedFile) => {\n this.files = this.files.filter(f => f.id !== fileToRemove.id);\n this.xplorFileRemove.emit(fileToRemove);\n };\n\n private handleButtonClick = () => {\n if (!this.disabled && this.fileInputEl) {\n this.fileInputEl.click();\n }\n };\n\n private formatFileSize(bytes: number): string {\n if (bytes === 0) return '0 Bytes';\n const k = 1024;\n const sizes = ['Bytes', 'KB', 'MB', 'GB'];\n const i = Math.floor(Math.log(bytes) / Math.log(k));\n return Math.round(bytes / Math.pow(k, i) * 100) / 100 + ' ' + sizes[i];\n }\n\n render() {\n return (\n <Host>\n <div class=\"file-upload\">\n <div\n class={{\n 'file-upload__dropzone': true,\n 'file-upload__dropzone--dragging': this.isDragging,\n 'file-upload__dropzone--disabled': this.disabled,\n }}\n onDragOver={this.handleDragOver}\n onDragLeave={this.handleDragLeave}\n onDrop={this.handleDrop}\n aria-label={`Drop zone for file upload. ${this.accepts !== '*/*' ? `Accepts: ${this.accepts}.` : ''} Maximum size: ${this.formatFileSize(this.maxSize)}`}\n >\n <input\n ref={(el) => (this.fileInputEl = el)}\n type=\"file\"\n accept={this.accepts}\n multiple={this.multiple}\n disabled={this.disabled}\n onChange={this.handleFileSelect}\n class=\"file-upload__input\"\n />\n\n <div class=\"file-upload__content\">\n <svg class=\"file-upload__icon\" width=\"48\" height=\"48\" viewBox=\"0 0 24 24\" fill=\"none\">\n <path d=\"M12 15V3M12 3L8 7M12 3L16 7\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\n <path d=\"M2 17L2 19C2 20.1046 2.89543 21 4 21L20 21C21.1046 21 22 20.1046 22 19L22 17\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" />\n </svg>\n <p class=\"file-upload__text\">\n Drag & drop files here or{' '}\n <button\n type=\"button\"\n class=\"file-upload__button\"\n onClick={this.handleButtonClick}\n disabled={this.disabled}\n >\n {this.label}\n </button>\n </p>\n <p class=\"file-upload__hint\">\n Max size: {this.formatFileSize(this.maxSize)}\n {this.accepts !== '*/*' && ` • Accepts: ${this.accepts}`}\n </p>\n </div>\n </div>\n\n {this.error && (\n <div class=\"file-upload__error\" role=\"alert\">\n {this.error}\n </div>\n )}\n\n {this.files.length > 0 && (\n <div class=\"file-upload__files\">\n {this.files.map((file) => (\n <div key={file.id} class=\"file-upload__file\">\n {file.dataUrl && (\n <img src={file.dataUrl} alt={file.name} class=\"file-upload__preview\" />\n )}\n <div class=\"file-upload__file-info\">\n <span class=\"file-upload__file-name\" title={file.name}>\n {file.name}\n </span>\n <span class=\"file-upload__file-size\">\n {this.formatFileSize(file.size)}\n </span>\n </div>\n <button\n type=\"button\"\n class=\"file-upload__remove\"\n onClick={() => this.handleRemoveFile(file)}\n aria-label={`Remove ${file.name}`}\n >\n ×\n </button>\n </div>\n ))}\n </div>\n )}\n </div>\n </Host>\n );\n }\n}\n"]}