wj-elements 0.1.195 → 0.1.197

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 (243) hide show
  1. package/dist/wje-dialog.js +1 -1
  2. package/dist/wje-dropdown.js +6 -11
  3. package/dist/wje-dropdown.js.map +1 -1
  4. package/dist/wje-file-upload.js +1 -2
  5. package/dist/wje-file-upload.js.map +1 -1
  6. package/dist/wje-routerx.js +1 -1
  7. package/dist/wje-routerx.js.map +1 -1
  8. package/package.json +1 -1
  9. package/dist/packages/index.d.ts +0 -107
  10. package/dist/packages/internals/form-associated-element.d.ts +0 -143
  11. package/dist/packages/localize/localize.d.ts +0 -47
  12. package/dist/packages/translations/en-gb.d.ts +0 -18
  13. package/dist/packages/translations/sk-sk.d.ts +0 -13
  14. package/dist/packages/utils/animations.d.ts +0 -2
  15. package/dist/packages/utils/base-path.d.ts +0 -14
  16. package/dist/packages/utils/date.d.ts +0 -2
  17. package/dist/packages/utils/element-utils.d.ts +0 -46
  18. package/dist/packages/utils/event.d.ts +0 -67
  19. package/dist/packages/utils/icon-library.d.ts +0 -3
  20. package/dist/packages/utils/localize.d.ts +0 -4
  21. package/dist/packages/utils/permissions.d.ts +0 -40
  22. package/dist/packages/utils/universal-service.d.ts +0 -18
  23. package/dist/packages/utils/utils.d.ts +0 -1
  24. package/dist/packages/wje-accordion/accordion.d.ts +0 -2
  25. package/dist/packages/wje-accordion/accordion.element.d.ts +0 -72
  26. package/dist/packages/wje-accordion/accordion.test.d.ts +0 -0
  27. package/dist/packages/wje-accordion-item/accordion-item.d.ts +0 -2
  28. package/dist/packages/wje-accordion-item/accordion-item.element.d.ts +0 -40
  29. package/dist/packages/wje-animation/animation.d.ts +0 -2
  30. package/dist/packages/wje-animation/animation.element.d.ts +0 -158
  31. package/dist/packages/wje-animation/animation.test.d.ts +0 -1
  32. package/dist/packages/wje-aside/aside.d.ts +0 -2
  33. package/dist/packages/wje-aside/aside.element.d.ts +0 -31
  34. package/dist/packages/wje-avatar/avatar.d.ts +0 -2
  35. package/dist/packages/wje-avatar/avatar.element.d.ts +0 -76
  36. package/dist/packages/wje-avatar/avatar.test.d.ts +0 -1
  37. package/dist/packages/wje-avatar/service/service.d.ts +0 -40
  38. package/dist/packages/wje-badge/badge.d.ts +0 -2
  39. package/dist/packages/wje-badge/badge.element.d.ts +0 -35
  40. package/dist/packages/wje-badge/badge.test.d.ts +0 -1
  41. package/dist/packages/wje-breadcrumb/breadcrumb.d.ts +0 -2
  42. package/dist/packages/wje-breadcrumb/breadcrumb.element.d.ts +0 -80
  43. package/dist/packages/wje-breadcrumbs/breadcrumbs.d.ts +0 -2
  44. package/dist/packages/wje-breadcrumbs/breadcrumbs.element.d.ts +0 -97
  45. package/dist/packages/wje-breadcrumbs/breadcrumbs.test.d.ts +0 -1
  46. package/dist/packages/wje-button/button.d.ts +0 -2
  47. package/dist/packages/wje-button/button.element.d.ts +0 -204
  48. package/dist/packages/wje-button/button.test.d.ts +0 -1
  49. package/dist/packages/wje-button-group/button-group.d.ts +0 -2
  50. package/dist/packages/wje-button-group/button-group.element.d.ts +0 -96
  51. package/dist/packages/wje-card/card.d.ts +0 -2
  52. package/dist/packages/wje-card/card.element.d.ts +0 -29
  53. package/dist/packages/wje-card-content/card-content.d.ts +0 -2
  54. package/dist/packages/wje-card-content/card-content.element.d.ts +0 -22
  55. package/dist/packages/wje-card-controls/card-controls.d.ts +0 -2
  56. package/dist/packages/wje-card-controls/card-controls.element.d.ts +0 -23
  57. package/dist/packages/wje-card-header/card-header.d.ts +0 -2
  58. package/dist/packages/wje-card-header/card-header.element.d.ts +0 -22
  59. package/dist/packages/wje-card-subtitle/card-subtitle.d.ts +0 -2
  60. package/dist/packages/wje-card-subtitle/card-subtitle.element.d.ts +0 -30
  61. package/dist/packages/wje-card-title/card-title.d.ts +0 -2
  62. package/dist/packages/wje-card-title/card-title.element.d.ts +0 -32
  63. package/dist/packages/wje-carousel/carousel.d.ts +0 -2
  64. package/dist/packages/wje-carousel/carousel.element.d.ts +0 -146
  65. package/dist/packages/wje-carousel-item/carousel-item.d.ts +0 -2
  66. package/dist/packages/wje-carousel-item/carousel-item.element.d.ts +0 -38
  67. package/dist/packages/wje-checkbox/checkbox.d.ts +0 -2
  68. package/dist/packages/wje-checkbox/checkbox.element.d.ts +0 -99
  69. package/dist/packages/wje-chip/chip.d.ts +0 -2
  70. package/dist/packages/wje-chip/chip.element.d.ts +0 -64
  71. package/dist/packages/wje-col/col.d.ts +0 -2
  72. package/dist/packages/wje-col/col.element.d.ts +0 -16
  73. package/dist/packages/wje-color-picker/color-picker.d.ts +0 -2
  74. package/dist/packages/wje-color-picker/color-picker.element.d.ts +0 -187
  75. package/dist/packages/wje-color-picker/color-picker.test.d.ts +0 -1
  76. package/dist/packages/wje-container/container.d.ts +0 -2
  77. package/dist/packages/wje-container/container.element.d.ts +0 -31
  78. package/dist/packages/wje-copy-button/copy-button.d.ts +0 -2
  79. package/dist/packages/wje-copy-button/copy-button.element.d.ts +0 -89
  80. package/dist/packages/wje-copy-button/service/service.d.ts +0 -12
  81. package/dist/packages/wje-dialog/dialog.d.ts +0 -2
  82. package/dist/packages/wje-dialog/dialog.element.d.ts +0 -127
  83. package/dist/packages/wje-divider/divider.d.ts +0 -2
  84. package/dist/packages/wje-divider/divider.element.d.ts +0 -32
  85. package/dist/packages/wje-dropdown/dropdown.d.ts +0 -2
  86. package/dist/packages/wje-dropdown/dropdown.element.d.ts +0 -84
  87. package/dist/packages/wje-element/element.d.ts +0 -306
  88. package/dist/packages/wje-file-upload/file-upload.d.ts +0 -2
  89. package/dist/packages/wje-file-upload/file-upload.element.d.ts +0 -191
  90. package/dist/packages/wje-file-upload/service/service.d.ts +0 -70
  91. package/dist/packages/wje-file-upload-item/file-upload-item.d.ts +0 -2
  92. package/dist/packages/wje-file-upload-item/file-upload-item.element.d.ts +0 -68
  93. package/dist/packages/wje-footer/footer.d.ts +0 -2
  94. package/dist/packages/wje-footer/footer.element.d.ts +0 -28
  95. package/dist/packages/wje-form/form.d.ts +0 -2
  96. package/dist/packages/wje-form/form.element.d.ts +0 -28
  97. package/dist/packages/wje-format-digital/format-digital.d.ts +0 -2
  98. package/dist/packages/wje-format-digital/format-digital.element.d.ts +0 -83
  99. package/dist/packages/wje-format-digital/format-digital.test.d.ts +0 -1
  100. package/dist/packages/wje-grid/grid.d.ts +0 -2
  101. package/dist/packages/wje-grid/grid.element.d.ts +0 -26
  102. package/dist/packages/wje-header/header.d.ts +0 -2
  103. package/dist/packages/wje-header/header.element.d.ts +0 -35
  104. package/dist/packages/wje-icon/icon.d.ts +0 -2
  105. package/dist/packages/wje-icon/icon.element.d.ts +0 -40
  106. package/dist/packages/wje-icon/service/library.d.ts +0 -3
  107. package/dist/packages/wje-icon/service/service.d.ts +0 -11
  108. package/dist/packages/wje-icon-picker/icon-picker.d.ts +0 -2
  109. package/dist/packages/wje-icon-picker/icon-picker.element.d.ts +0 -187
  110. package/dist/packages/wje-img/img.d.ts +0 -2
  111. package/dist/packages/wje-img/img.element.d.ts +0 -118
  112. package/dist/packages/wje-img-comparer/img-comparer.d.ts +0 -2
  113. package/dist/packages/wje-img-comparer/img-comparer.element.d.ts +0 -60
  114. package/dist/packages/wje-img-comparer/service/service.d.ts +0 -1
  115. package/dist/packages/wje-infinite-scroll/infinite-scroll.d.ts +0 -2
  116. package/dist/packages/wje-infinite-scroll/infinite-scroll.element.d.ts +0 -172
  117. package/dist/packages/wje-input/input.d.ts +0 -2
  118. package/dist/packages/wje-input/input.element.d.ts +0 -159
  119. package/dist/packages/wje-input-file/input-file.d.ts +0 -2
  120. package/dist/packages/wje-input-file/input-file.element.d.ts +0 -50
  121. package/dist/packages/wje-item/item.d.ts +0 -2
  122. package/dist/packages/wje-item/item.element.d.ts +0 -68
  123. package/dist/packages/wje-kanban/kanban.d.ts +0 -2
  124. package/dist/packages/wje-kanban/kanban.element.d.ts +0 -182
  125. package/dist/packages/wje-label/label.d.ts +0 -2
  126. package/dist/packages/wje-label/label.element.d.ts +0 -34
  127. package/dist/packages/wje-level-indicator/level-indicator.d.ts +0 -2
  128. package/dist/packages/wje-level-indicator/level-indicator.element.d.ts +0 -91
  129. package/dist/packages/wje-list/list.d.ts +0 -2
  130. package/dist/packages/wje-list/list.element.d.ts +0 -31
  131. package/dist/packages/wje-main/main.d.ts +0 -2
  132. package/dist/packages/wje-main/main.element.d.ts +0 -30
  133. package/dist/packages/wje-masonry/masonry.d.ts +0 -2
  134. package/dist/packages/wje-masonry/masonry.element.d.ts +0 -114
  135. package/dist/packages/wje-masonry/service/service.d.ts +0 -32
  136. package/dist/packages/wje-menu/menu.d.ts +0 -2
  137. package/dist/packages/wje-menu/menu.element.d.ts +0 -47
  138. package/dist/packages/wje-menu-button/menu-button.d.ts +0 -2
  139. package/dist/packages/wje-menu-button/menu-button.element.d.ts +0 -34
  140. package/dist/packages/wje-menu-item/menu-item.d.ts +0 -2
  141. package/dist/packages/wje-menu-item/menu-item.element.d.ts +0 -158
  142. package/dist/packages/wje-menu-label/menu-label.d.ts +0 -2
  143. package/dist/packages/wje-menu-label/menu-label.element.d.ts +0 -39
  144. package/dist/packages/wje-option/option.d.ts +0 -2
  145. package/dist/packages/wje-option/option.element.d.ts +0 -95
  146. package/dist/packages/wje-options/options.d.ts +0 -2
  147. package/dist/packages/wje-options/options.element.d.ts +0 -232
  148. package/dist/packages/wje-orgchart/orgchart.d.ts +0 -2
  149. package/dist/packages/wje-orgchart/orgchart.element.d.ts +0 -24
  150. package/dist/packages/wje-orgchart-group/orgchart-group.d.ts +0 -2
  151. package/dist/packages/wje-orgchart-group/orgchart-group.element.d.ts +0 -28
  152. package/dist/packages/wje-orgchart-item/orgchart-item.d.ts +0 -2
  153. package/dist/packages/wje-orgchart-item/orgchart-item.element.d.ts +0 -49
  154. package/dist/packages/wje-pagination/pagination.d.ts +0 -2
  155. package/dist/packages/wje-pagination/pagination.element.d.ts +0 -166
  156. package/dist/packages/wje-pagination/pagination.test.d.ts +0 -1
  157. package/dist/packages/wje-pagination/service/service.d.ts +0 -9
  158. package/dist/packages/wje-panel/panel.d.ts +0 -2
  159. package/dist/packages/wje-panel/panel.element.d.ts +0 -34
  160. package/dist/packages/wje-popup/popup.d.ts +0 -2
  161. package/dist/packages/wje-popup/popup.element.d.ts +0 -94
  162. package/dist/packages/wje-progress-bar/progress-bar.d.ts +0 -2
  163. package/dist/packages/wje-progress-bar/progress-bar.element.d.ts +0 -96
  164. package/dist/packages/wje-qr-code/qr-code.d.ts +0 -2
  165. package/dist/packages/wje-qr-code/qr-code.element.d.ts +0 -33
  166. package/dist/packages/wje-radio/radio.d.ts +0 -2
  167. package/dist/packages/wje-radio/radio.element.d.ts +0 -64
  168. package/dist/packages/wje-radio-group/radio-group.d.ts +0 -2
  169. package/dist/packages/wje-radio-group/radio-group.element.d.ts +0 -61
  170. package/dist/packages/wje-rate/rate.d.ts +0 -2
  171. package/dist/packages/wje-rate/rate.element.d.ts +0 -156
  172. package/dist/packages/wje-relative-time/relative-time.d.ts +0 -2
  173. package/dist/packages/wje-relative-time/relative-time.element.d.ts +0 -55
  174. package/dist/packages/wje-relative-time/relative-time.test.d.ts +0 -1
  175. package/dist/packages/wje-reorder/reorder.d.ts +0 -2
  176. package/dist/packages/wje-reorder/reorder.element.d.ts +0 -119
  177. package/dist/packages/wje-reorder-dropzone/reorder-dropzone.d.ts +0 -2
  178. package/dist/packages/wje-reorder-dropzone/reorder-dropzone.element.d.ts +0 -23
  179. package/dist/packages/wje-reorder-handle/reorder-handle.d.ts +0 -2
  180. package/dist/packages/wje-reorder-handle/reorder-handle.element.d.ts +0 -75
  181. package/dist/packages/wje-reorder-item/reorder-item.d.ts +0 -2
  182. package/dist/packages/wje-reorder-item/reorder-item.element.d.ts +0 -24
  183. package/dist/packages/wje-route/route.d.ts +0 -2
  184. package/dist/packages/wje-route/route.element.d.ts +0 -22
  185. package/dist/packages/wje-router/router.d.ts +0 -2
  186. package/dist/packages/wje-router/router.element.d.ts +0 -39
  187. package/dist/packages/wje-router-link/router-link.d.ts +0 -2
  188. package/dist/packages/wje-router-link/router-link.element.d.ts +0 -31
  189. package/dist/packages/wje-router-outlet/router-outlet.d.ts +0 -2
  190. package/dist/packages/wje-router-outlet/router-outlet.element.d.ts +0 -15
  191. package/dist/packages/wje-row/row.d.ts +0 -2
  192. package/dist/packages/wje-row/row.element.d.ts +0 -23
  193. package/dist/packages/wje-select/select.d.ts +0 -2
  194. package/dist/packages/wje-select/select.element.d.ts +0 -358
  195. package/dist/packages/wje-slider/slider.d.ts +0 -2
  196. package/dist/packages/wje-slider/slider.element.d.ts +0 -103
  197. package/dist/packages/wje-sliding-container/sliding-container.d.ts +0 -2
  198. package/dist/packages/wje-sliding-container/sliding-container.element.d.ts +0 -265
  199. package/dist/packages/wje-split-view/service/service.d.ts +0 -1
  200. package/dist/packages/wje-split-view/split-view.d.ts +0 -2
  201. package/dist/packages/wje-split-view/split-view.element.d.ts +0 -65
  202. package/dist/packages/wje-status/status.d.ts +0 -2
  203. package/dist/packages/wje-status/status.element.d.ts +0 -26
  204. package/dist/packages/wje-step/step.d.ts +0 -2
  205. package/dist/packages/wje-step/step.element.d.ts +0 -23
  206. package/dist/packages/wje-stepper/stepper.d.ts +0 -2
  207. package/dist/packages/wje-stepper/stepper.element.d.ts +0 -80
  208. package/dist/packages/wje-store/default-store-actions.d.ts +0 -25
  209. package/dist/packages/wje-store/pubsub.d.ts +0 -22
  210. package/dist/packages/wje-store/store.d.ts +0 -153
  211. package/dist/packages/wje-tab/tab.d.ts +0 -2
  212. package/dist/packages/wje-tab/tab.element.d.ts +0 -66
  213. package/dist/packages/wje-tab-group/tab-group.d.ts +0 -2
  214. package/dist/packages/wje-tab-group/tab-group.element.d.ts +0 -107
  215. package/dist/packages/wje-tab-panel/tab-panel.d.ts +0 -2
  216. package/dist/packages/wje-tab-panel/tab-panel.element.d.ts +0 -23
  217. package/dist/packages/wje-textarea/textarea.d.ts +0 -2
  218. package/dist/packages/wje-textarea/textarea.element.d.ts +0 -89
  219. package/dist/packages/wje-thumbnail/thumbnail.d.ts +0 -2
  220. package/dist/packages/wje-thumbnail/thumbnail.element.d.ts +0 -31
  221. package/dist/packages/wje-timeline/timeline.d.ts +0 -2
  222. package/dist/packages/wje-timeline/timeline.element.d.ts +0 -25
  223. package/dist/packages/wje-timeline-item/timeline-item.d.ts +0 -2
  224. package/dist/packages/wje-timeline-item/timeline-item.element.d.ts +0 -27
  225. package/dist/packages/wje-toast/toast.d.ts +0 -2
  226. package/dist/packages/wje-toast/toast.element.d.ts +0 -173
  227. package/dist/packages/wje-toast/toast.test.d.ts +0 -1
  228. package/dist/packages/wje-toggle/toggle.d.ts +0 -2
  229. package/dist/packages/wje-toggle/toggle.element.d.ts +0 -65
  230. package/dist/packages/wje-toolbar/toolbar.d.ts +0 -2
  231. package/dist/packages/wje-toolbar/toolbar.element.d.ts +0 -39
  232. package/dist/packages/wje-toolbar-action/toolbar-action.d.ts +0 -2
  233. package/dist/packages/wje-toolbar-action/toolbar-action.element.d.ts +0 -35
  234. package/dist/packages/wje-tooltip/tooltip.d.ts +0 -2
  235. package/dist/packages/wje-tooltip/tooltip.element.d.ts +0 -77
  236. package/dist/packages/wje-tree/tree.d.ts +0 -2
  237. package/dist/packages/wje-tree/tree.element.d.ts +0 -105
  238. package/dist/packages/wje-tree/tree.test.d.ts +0 -1
  239. package/dist/packages/wje-tree-item/tree-item.d.ts +0 -2
  240. package/dist/packages/wje-tree-item/tree-item.element.d.ts +0 -155
  241. package/dist/packages/wje-tree-item/tree-item.test.d.ts +0 -1
  242. package/dist/packages/wje-visually-hidden/visually-hidden.d.ts +0 -2
  243. package/dist/packages/wje-visually-hidden/visually-hidden.element.d.ts +0 -29
@@ -3,7 +3,7 @@ var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { en
3
3
  var __publicField = (obj, key, value) => __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
4
4
  import WJElement from "./wje-element.js";
5
5
  import { event } from "./event.js";
6
- const styles = "/*\n[ WJ Dialog ]\n*/\n\n:host {\n --wje-dialog-header-actions-gap: 0.5rem;\n\n .close {\n margin-left: auto;\n }\n\n .header-actions {\n margin-left: auto;\n display: flex;\n align-items: center;\n gap: var(--wje-dialog-header-actions-gap);\n }\n\n .modal-content {\n border-radius: 3px;\n box-shadow: none;\n }\n\n .dialog-header {\n position: relative;\n border-bottom: 0;\n padding-inline: var(--wje-dialog-padding);\n padding-top: var(--wje-dialog-padding);\n padding-bottom: var(--wje-dialog-padding);\n display: flex;\n align-items: center;\n span {\n font-family: var(--wje-font-family-secondary);\n font-size: var(--wje-dialog-headline-font-size);\n text-transform: var(--wje-dialog-headline-text-transform);\n display: inline-block;\n letter-spacing: var(--wje-dialog-headline-letter-spacing);\n font-weight: var(--wje-dialog-headline-font-weight);\n margin: 0;\n padding: 0;\n line-height: normal;\n overflow: hidden;\n text-overflow: ellipsis;\n filter: alpha(opacity=40);\n }\n }\n\n .dialog-content {\n box-shadow: none;\n padding-inline: var(--wje-dialog-padding);\n white-space: normal;\n z-index: 1;\n }\n\n .dialog-footer {\n display: flex;\n justify-content: end;\n border-top: none;\n box-shadow: none;\n margin-top: 0;\n padding-inline: var(--wje-dialog-padding-inline);\n padding-top: var(--wje-dialog-padding-top);\n padding-bottom: var(--wje-dialog-padding-bottom);\n }\n}\n\n/*Blocking element styles*/\n.blocking-element {\n position: absolute;\n top: 0;\n left: 0;\n right: 0;\n bottom: 0;\n background-color: var(--wje-color-contrast-0);\n opacity: 0.75;\n z-index: 1;\n display: flex;\n align-items: center;\n justify-content: center;\n height: 100%;\n\n wje-icon {\n animation: loader 1s linear infinite;\n }\n}\n\n@keyframes loader {\n 0% {\n transform: rotate(0deg);\n }\n 100% {\n transform: rotate(360deg);\n }\n}\n\ndialog::backdrop {\n opacity: var(--wje-backdrop-opacity);\n background-color: var(--wje-backdrop);\n}\n\ndialog:focus-visible {\n outline: none;\n}\n\n:host(.separator) .dialog-header:after {\n content: '';\n height: 1px;\n background: rgba(0, 0, 0, 0.08);\n left: var(--wje-dialog-padding);\n right: var(--wje-dialog-padding);\n position: absolute;\n bottom: 0;\n}\n\n:host {\n dialog {\n box-sizing: border-box;\n transition: all 0.2s !important;\n width: var(--wje-dialog-width);\n height: var(--wje-dialog-height);\n box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15);\n\n border-radius: var(--wje-dialog-border-radius);\n border-width: var(--wje-dialog-border-width);\n border-style: var(--wje-dialog-border-style);\n border-color: var(--wje-dialog-border-color);\n\n margin-top: var(--wje-dialog-margin-top);\n\n margin-bottom: var(--wje-dialog-margin-bottom);\n margin-inline: var(--wje-dialog-margin-start) var(--wje-dialog-margin-end);\n\n padding: 0;\n }\n}\n\n/*Top*/\n:host(.stick-up) {\n --wje-dialog-width: 300px !important;\n --wje-dialog-height: fit-content;\n --wje-dialog-border-radius: 0 0 8px 8px;\n --wje-dialog-border-width: 0 1px 1px 1px;\n --wje-dialog-margin-top: 0;\n --wje-dialog-translate-from: translateY(-110%);\n --wje-dialog-template-to: translateX(0);\n}\n\n/*Cenetered*/\n:host(.slide-up) {\n --wje-dialog-width: 300px !important;\n --wje-dialog-height: fit-content;\n --wje-dialog-border-radius: 8px;\n --wje-dialog-border-width: 1px;\n --wje-dialog-opacity-from: 0;\n --wje-dialog-translate-from: scale(0.9);\n --wje-dialog-translate-to: scale(1);\n}\n\n/*Fullscreen*/\n:host(.fill-in) {\n --wje-dialog-width: 100%;\n --wje-dialog-height: 100%;\n --wje-dialog-border-radius: 0 0 0 0 !important;\n --wje-dialog-border-width: 0;\n --wje-dialog-margin-top: 0;\n --wje-dialog-margin-start: 0;\n --wje-dialog-margin-end: 0;\n --wje-dialog-margin-bottom: 0;\n --wje-dialog-translate-from: scale(0.95);\n --wje-dialog-translate-to: scale(1);\n dialog {\n min-width: var(--wje-dialog-width);\n min-height: var(--wje-dialog-height);\n }\n}\n\n/*Slide Left*/\n:host(.slide-left) {\n --wje-dialog-width: 300px !important;\n --wje-dialog-height: 100% !important;\n --wje-dialog-border-radius: 0;\n --wje-dialog-border-width: 0 1px 0 0;\n --wje-dialog-margin-top: 0;\n --wje-dialog-margin-start: 0;\n --wje-dialog-margin-end: auto;\n --wje-dialog-margin-bottom: 0;\n dialog {\n min-height: var(--wje-dialog-height);\n --wje-dialog-translate-from: translateX(-110%);\n --wje-dialog-template-to: translateX(0);\n }\n}\n\n/*Slide Right*/\n:host(.slide-right) {\n --wje-dialog-width: 300px !important;\n --wje-dialog-height: 100% !important;\n --wje-dialog-border-radius: 0;\n --wje-dialog-border-width: 0 0 0 1px;\n --wje-dialog-margin-top: 0;\n --wje-dialog-margin-start: auto;\n --wje-dialog-margin-end: 0;\n --wje-dialog-margin-bottom: 0;\n dialog {\n min-height: var(--wje-dialog-height);\n --wje-dialog-translate-from: translateX(110%);\n --wje-dialog-template-to: translateX(0);\n }\n}\n\n:host(.small) {\n --wje-dialog-width: 300px !important;\n}\n\n:host(.medium) {\n --wje-dialog-width: 500px !important;\n}\n\n:host(.large) {\n --wje-dialog-width: 600px !important;\n}\n\n:host(.ex-large) {\n --wje-dialog-width: 900px !important;\n}\n\ndialog[open] {\n animation: show 0.5s ease normal;\n}\n\n@keyframes show {\n from {\n opacity: var(--wje-dialog-opacity-from, 1);\n transform: var(--wje-dialog-translate-from);\n }\n to {\n opacity: 1;\n transform: var(--wje-dialog-translate-to);\n }\n}\n";
6
+ const styles = "/*\n[ WJ Dialog ]\n*/\n\n:host {\n --wje-dialog-header-actions-gap: 0.5rem;\n\n .close {\n margin-left: auto;\n }\n\n .header-actions {\n margin-left: auto;\n display: flex;\n align-items: center;\n gap: var(--wje-dialog-header-actions-gap);\n }\n\n .modal-content {\n border-radius: 3px;\n box-shadow: none;\n }\n\n .dialog-header {\n position: relative;\n border-bottom: 0;\n padding-inline: var(--wje-dialog-padding);\n padding-top: var(--wje-dialog-padding);\n padding-bottom: var(--wje-dialog-padding);\n display: flex;\n align-items: center;\n span {\n font-family: var(--wje-font-family-secondary);\n font-size: var(--wje-dialog-headline-font-size);\n text-transform: var(--wje-dialog-headline-text-transform);\n display: inline-block;\n letter-spacing: var(--wje-dialog-headline-letter-spacing);\n font-weight: var(--wje-dialog-headline-font-weight);\n margin: 0;\n padding: 0;\n line-height: normal;\n overflow: hidden;\n text-overflow: ellipsis;\n filter: alpha(opacity=40);\n }\n }\n\n .dialog-content {\n box-shadow: none;\n padding-inline: var(--wje-dialog-padding);\n white-space: normal;\n z-index: 1;\n }\n\n .dialog-footer {\n display: flex;\n justify-content: end;\n border-top: none;\n box-shadow: none;\n margin-top: 0;\n padding-inline: var(--wje-dialog-padding-inline);\n padding-top: var(--wje-dialog-padding-top);\n padding-bottom: var(--wje-dialog-padding-bottom);\n }\n}\n\n/*Blocking element styles*/\n.blocking-element {\n position: absolute;\n top: 0;\n left: 0;\n right: 0;\n bottom: 0;\n background-color: var(--wje-color-contrast-0);\n opacity: 0.75;\n z-index: 1;\n display: flex;\n align-items: center;\n justify-content: center;\n height: 100%;\n\n wje-icon {\n animation: loader 1s linear infinite;\n }\n}\n\n@keyframes loader {\n 0% {\n transform: rotate(0deg);\n }\n 100% {\n transform: rotate(360deg);\n }\n}\n\ndialog::backdrop {\n opacity: var(--wje-backdrop-opacity);\n background-color: var(--wje-backdrop);\n}\n\ndialog:focus-visible {\n outline: none;\n}\n\n:host(.separator) .dialog-header:after {\n content: '';\n height: 1px;\n background: rgba(0, 0, 0, 0.08);\n left: var(--wje-dialog-padding);\n right: var(--wje-dialog-padding);\n position: absolute;\n bottom: 0;\n}\n\n:host {\n dialog {\n box-sizing: border-box;\n transition: all 0.2s !important;\n width: var(--wje-dialog-width);\n height: var(--wje-dialog-height);\n box-shadow: var(--wje-shadow-large);\n\n border-radius: var(--wje-dialog-border-radius);\n border-width: var(--wje-dialog-border-width);\n border-style: var(--wje-dialog-border-style);\n border-color: var(--wje-dialog-border-color);\n\n margin-top: var(--wje-dialog-margin-top);\n\n margin-bottom: var(--wje-dialog-margin-bottom);\n margin-inline: var(--wje-dialog-margin-start) var(--wje-dialog-margin-end);\n\n padding: 0;\n }\n}\n\n/*Top*/\n:host(.stick-up) {\n --wje-dialog-width: 300px;\n --wje-dialog-height: fit-content;\n --wje-dialog-border-radius: 0 0 var(--wje-border-radius-large) var(--wje-border-radius-large);\n --wje-dialog-border-width: 0 1px 1px 1px;\n --wje-dialog-margin-top: 0;\n --wje-dialog-translate-from: translateY(-110%);\n --wje-dialog-template-to: translateX(0);\n}\n\n/*Cenetered*/\n:host(.slide-up) {\n --wje-dialog-width: 300px;\n --wje-dialog-height: fit-content;\n --wje-dialog-border-radius: var(--wje-border-radius-large);\n --wje-dialog-border-width: 1px;\n --wje-dialog-opacity-from: 0;\n --wje-dialog-translate-from: scale(0.9);\n --wje-dialog-translate-to: scale(1);\n}\n\n/*Fullscreen*/\n:host(.fill-in) {\n --wje-dialog-width: 100%;\n --wje-dialog-height: 100%;\n --wje-dialog-border-radius: 0 0 0 0 !important;\n --wje-dialog-border-width: 0;\n --wje-dialog-margin-top: 0;\n --wje-dialog-margin-start: 0;\n --wje-dialog-margin-end: 0;\n --wje-dialog-margin-bottom: 0;\n --wje-dialog-translate-from: scale(0.95);\n --wje-dialog-translate-to: scale(1);\n dialog {\n min-width: var(--wje-dialog-width);\n min-height: var(--wje-dialog-height);\n }\n}\n\n/*Slide Left*/\n:host(.slide-left) {\n --wje-dialog-width: 300px;\n --wje-dialog-height: 100%;\n --wje-dialog-border-radius: 0;\n --wje-dialog-border-width: 0 1px 0 0;\n --wje-dialog-margin-top: 0;\n --wje-dialog-margin-start: 0;\n --wje-dialog-margin-end: auto;\n --wje-dialog-margin-bottom: 0;\n dialog {\n min-height: var(--wje-dialog-height);\n --wje-dialog-translate-from: translateX(-110%);\n --wje-dialog-template-to: translateX(0);\n }\n}\n\n/*Slide Right*/\n:host(.slide-right) {\n --wje-dialog-width: 300px !important;\n --wje-dialog-height: 100% !important;\n --wje-dialog-border-radius: 0;\n --wje-dialog-border-width: 0 0 0 1px;\n --wje-dialog-margin-top: 0;\n --wje-dialog-margin-start: auto;\n --wje-dialog-margin-end: 0;\n --wje-dialog-margin-bottom: 0;\n dialog {\n min-height: var(--wje-dialog-height);\n --wje-dialog-translate-from: translateX(110%);\n --wje-dialog-template-to: translateX(0);\n }\n}\n\n:host(.small) {\n --wje-dialog-width: 300px !important;\n}\n\n:host(.medium) {\n --wje-dialog-width: 500px !important;\n}\n\n:host(.large) {\n --wje-dialog-width: 600px !important;\n}\n\n:host(.ex-large) {\n --wje-dialog-width: 900px !important;\n}\n\ndialog[open] {\n animation: show 0.5s ease normal;\n}\n\n@keyframes show {\n from {\n opacity: var(--wje-dialog-opacity-from, 1);\n transform: var(--wje-dialog-translate-from);\n }\n to {\n opacity: 1;\n transform: var(--wje-dialog-translate-to);\n }\n}\n";
7
7
  class Dialog extends WJElement {
8
8
  /**
9
9
  * @class
@@ -33,13 +33,9 @@ class Dropdown extends WJElement {
33
33
  this.popup.hide();
34
34
  }
35
35
  });
36
- __publicField(this, "popupHideCallback", () => {
36
+ __publicField(this, "popupHideCallback", (e) => {
37
37
  if (this.classList.contains("active")) {
38
- this.classList.remove("active");
39
- event.dispatchCustomEvent(this, "wje-dropdown:close", {
40
- bubbles: true,
41
- detail: { target: this }
42
- });
38
+ this.toggleCallback(e);
43
39
  }
44
40
  });
45
41
  /**
@@ -49,10 +45,11 @@ class Dropdown extends WJElement {
49
45
  * @param {Event} e The event object.
50
46
  */
51
47
  __publicField(this, "toggleCallback", (e) => {
52
- e.stopPropagation();
53
48
  if (this.classList.contains("active")) {
54
- this.onClose(e);
49
+ e.stopPropagation();
50
+ this.onClose();
55
51
  } else {
52
+ e.stopPropagation();
56
53
  this.onOpen(e);
57
54
  }
58
55
  });
@@ -61,7 +58,6 @@ class Dropdown extends WJElement {
61
58
  * @param {object} e
62
59
  */
63
60
  __publicField(this, "onOpen", (e) => {
64
- e.stopPropagation();
65
61
  this.classList.add("active");
66
62
  Promise.resolve(this.beforeShow(this)).then((res) => {
67
63
  if (!this.classList.contains("active")) {
@@ -82,8 +78,7 @@ class Dropdown extends WJElement {
82
78
  });
83
79
  __publicField(this, "afterClose", () => {
84
80
  });
85
- __publicField(this, "onClose", (e) => {
86
- e.stopPropagation();
81
+ __publicField(this, "onClose", () => {
87
82
  this.classList.remove("active");
88
83
  Promise.resolve(this.beforeClose(this)).then((res) => {
89
84
  if (this.classList.contains("active")) {
@@ -1 +1 @@
1
- {"version":3,"file":"wje-dropdown.js","sources":["../packages/wje-dropdown/dropdown.element.js","../packages/wje-dropdown/dropdown.js"],"sourcesContent":["import { default as WJElement, event } from '../wje-element/element.js';\nimport Popup from '../wje-popup/popup.element.js';\n\n/**\n * `Dropdown` is a custom element that displays a dropdown menu.\n * @summary This element represents a dropdown menu.\n * @documentation https://elements.webjet.sk/components/dropdown\n * @status stable\n * @augments {WJElement}\n * @csspart native - The native part of the dropdown.\n * @slot trigger - The slot for the trigger of the dropdown.\n * @slot - The default slot for the dropdown.\n * // @fires wje-dropdown:open - Event fired when the dropdown is opened.\n * // @fires wje-dropdown:close - Event fired when the dropdown is closed.\n * @tag wje-dropdown\n */\nexport default class Dropdown extends WJElement {\n /**\n * Creates an instance of Dropdown.\n * @class\n */\n constructor() {\n super();\n }\n\n /**\n * The placement of the dropdown.\n * @type {{\"wje-popup\": Popup}}\n */\n dependencies = {\n 'wje-popup': Popup,\n };\n\n /**\n * Sets the placement of the dropdown.\n * @param value\n */\n set trigger(value) {\n this.setAttribute('trigger', value);\n }\n\n /**\n * Gets the placement of the dropdown.\n * @returns {string|string}\n */\n get trigger() {\n return this.getAttribute('trigger') || 'click';\n }\n\n /**\n * Sets the placement of the dropdown.\n * @type {string}\n */\n className = 'Dropdown';\n\n /**\n * Getter for the CSS stylesheet.\n * @returns {string[]}\n */\n static get observedAttributes() {\n return ['active'];\n }\n\n /**\n * Callback function to handle other dropdowns being opened. Close the dropdown if it is not the target and collapse is enabled.\n * @param {Event} e The event object.\n */\n otherDropdownOpennedCallback = (e) => {\n if (e.detail.detail.target !== this) {\n this.classList.remove('active');\n this.popup.hide();\n }\n };\n\n /**\n * Sets up the attributes for the dropdown.\n */\n setupAttributes() {\n this.isShadowRoot = 'open';\n }\n\n /**\n * Removes the popup element.\n */\n beforeDraw() {\n this.popup?.remove();\n this.popup = null;\n }\n\n /**\n * Draws the dropdown element and returns the created document fragment.\n * @returns {DocumentFragment}\n */\n draw() {\n let fragment = document.createDocumentFragment();\n\n this.classList.add('wje-placement', 'wje-' + this.placement || 'wje-start');\n\n let native = document.createElement('div');\n native.setAttribute('part', 'native');\n native.classList.add('native-dropdown');\n\n let tooltip = document.createElement('wje-tooltip');\n tooltip.setAttribute('content', this.tooltip);\n\n let anchorSlot = document.createElement('slot');\n anchorSlot.setAttribute('name', 'trigger');\n anchorSlot.setAttribute('slot', 'anchor');\n\n let slot = document.createElement('slot');\n\n let popup = document.createElement('wje-popup');\n popup.setAttribute('placement', this.placement);\n popup.setAttribute('offset', this.offset);\n popup.setAttribute('part', 'popup');\n\n popup.appendChild(anchorSlot);\n popup.appendChild(slot);\n\n // if(this.trigger === \"click\")\n popup.setAttribute('manual', '');\n\n native.appendChild(popup);\n\n fragment.appendChild(native);\n\n this.popup = popup;\n this.anchorSlot = anchorSlot;\n\n return fragment;\n }\n\n /**\n * Adds event listeners for the mouseenter and mouseleave events.\n */\n afterDisconnect() {\n event.removeListener(this, 'mouseenter', null, this.onOpen);\n event.removeListener(this, 'mouseleave', null, this.onClose);\n event.removeListener(this.anchorSlot, 'click', null, this.toggleCallback, { capture: true });\n event.removeListener(this, 'wje-popup:hide', null, this.popupHideCallback);\n }\n\n popupHideCallback = () => {\n if (this.classList.contains('active')) {\n this.classList.remove('active');\n\n event.dispatchCustomEvent(this, 'wje-dropdown:close', {\n bubbles: true,\n detail: { target: this },\n });\n }\n };\n\n /**\n * Adds event listeners for the mouseenter and mouseleave events.\n */\n afterDraw() {\n event.addListener(this, 'wje-popup:hide', null, this.popupHideCallback);\n\n if (this.trigger !== 'click') {\n event.addListener(this, 'mouseenter', null, this.onOpen);\n event.addListener(this, 'mouseleave', null, this.onClose);\n } else {\n event.addListener(this.anchorSlot, 'click', null, this.toggleCallback, { capture: true });\n }\n\n if (this.hasAttribute('collapsible')) {\n event.addListener(\n Array.from(this.querySelectorAll('wje-menu-item')),\n 'click',\n 'wje-menu-item:click',\n this.onClose\n );\n }\n }\n\n /**\n * @summary Returns the content to be displayed before showing the dropdown.\n * @returns {any} The content to be displayed.\n */\n beforeShow() {\n return this.content;\n }\n\n /**\n * This method is called after the dropdown is shown.\n */\n afterShow() {\n // Do nothing\n }\n\n /**\n * @summary Toggles the dropdown element between active and inactive states.\n * Calls the `onOpen` method if the element is currently inactive,\n * and calls the `onClose` method if the element is currently active.\n * @param {Event} e The event object.\n */\n toggleCallback = (e) => {\n e.stopPropagation();\n\n if (this.classList.contains('active')) {\n this.onClose(e);\n } else {\n this.onOpen(e);\n }\n };\n\n /**\n * Open the popup element.\n * @param {object} e\n */\n onOpen = (e) => {\n e.stopPropagation();\n\n this.classList.add('active');\n Promise.resolve(this.beforeShow(this))\n .then((res) => {\n if (!this.classList.contains('active')) {\n throw new Error('beforeShow method returned false or not string');\n }\n\n this.popup.show(true); // Show tooltip\n\n event.dispatchCustomEvent(this, 'wje-dropdown:open', {\n bubbles: true,\n detail: { target: this },\n });\n\n Promise.resolve(this.afterShow(this));\n })\n .catch((error) => {\n // ak je nejaka chyba tak to len zatvorime\n this.classList.remove('active');\n this.popup.hide(true);\n });\n };\n\n beforeClose = () => {\n // Do nothing\n };\n\n afterClose = () => {\n // Do nothing\n };\n\n onClose = (e) => {\n e.stopPropagation();\n\n this.classList.remove('active');\n Promise.resolve(this.beforeClose(this))\n .then((res) => {\n if (this.classList.contains('active')) {\n throw new Error('beforeShow method returned false or not string');\n }\n\n this.popup.hide(true); // Show tooltip\n\n event.dispatchCustomEvent(this, 'wje-dropdown:close', {\n bubbles: true,\n detail: { target: this },\n });\n\n Promise.resolve(this.afterClose(this));\n })\n .catch((error) => {\n this.classList.add('active');\n this.popup.show(true);\n });\n };\n}\n","import Dropdown from './dropdown.element.js';\n\nexport default Dropdown;\n\nDropdown.define('wje-dropdown', Dropdown);\n"],"names":[],"mappings":"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"}
1
+ {"version":3,"file":"wje-dropdown.js","sources":["../packages/wje-dropdown/dropdown.element.js","../packages/wje-dropdown/dropdown.js"],"sourcesContent":["import { default as WJElement, event } from '../wje-element/element.js';\nimport Popup from '../wje-popup/popup.element.js';\n\n/**\n * `Dropdown` is a custom element that displays a dropdown menu.\n * @summary This element represents a dropdown menu.\n * @documentation https://elements.webjet.sk/components/dropdown\n * @status stable\n * @augments {WJElement}\n * @csspart native - The native part of the dropdown.\n * @slot trigger - The slot for the trigger of the dropdown.\n * @slot - The default slot for the dropdown.\n * // @fires wje-dropdown:open - Event fired when the dropdown is opened.\n * // @fires wje-dropdown:close - Event fired when the dropdown is closed.\n * @tag wje-dropdown\n */\nexport default class Dropdown extends WJElement {\n /**\n * Creates an instance of Dropdown.\n * @class\n */\n constructor() {\n super();\n }\n\n /**\n * The placement of the dropdown.\n * @type {{\"wje-popup\": Popup}}\n */\n dependencies = {\n 'wje-popup': Popup,\n };\n\n /**\n * Sets the placement of the dropdown.\n * @param value\n */\n set trigger(value) {\n this.setAttribute('trigger', value);\n }\n\n /**\n * Gets the placement of the dropdown.\n * @returns {string|string}\n */\n get trigger() {\n return this.getAttribute('trigger') || 'click';\n }\n\n /**\n * Sets the placement of the dropdown.\n * @type {string}\n */\n className = 'Dropdown';\n\n /**\n * Getter for the CSS stylesheet.\n * @returns {string[]}\n */\n static get observedAttributes() {\n return ['active'];\n }\n\n /**\n * Callback function to handle other dropdowns being opened. Close the dropdown if it is not the target and collapse is enabled.\n * @param {Event} e The event object.\n */\n otherDropdownOpennedCallback = (e) => {\n if (e.detail.detail.target !== this) {\n this.classList.remove('active');\n this.popup.hide();\n }\n };\n\n /**\n * Sets up the attributes for the dropdown.\n */\n setupAttributes() {\n this.isShadowRoot = 'open';\n }\n\n /**\n * Removes the popup element.\n */\n beforeDraw() {\n this.popup?.remove();\n this.popup = null;\n }\n\n /**\n * Draws the dropdown element and returns the created document fragment.\n * @returns {DocumentFragment}\n */\n draw() {\n let fragment = document.createDocumentFragment();\n\n this.classList.add('wje-placement', 'wje-' + this.placement || 'wje-start');\n\n let native = document.createElement('div');\n native.setAttribute('part', 'native');\n native.classList.add('native-dropdown');\n\n let tooltip = document.createElement('wje-tooltip');\n tooltip.setAttribute('content', this.tooltip);\n\n let anchorSlot = document.createElement('slot');\n anchorSlot.setAttribute('name', 'trigger');\n anchorSlot.setAttribute('slot', 'anchor');\n\n let slot = document.createElement('slot');\n\n let popup = document.createElement('wje-popup');\n popup.setAttribute('placement', this.placement);\n popup.setAttribute('offset', this.offset);\n popup.setAttribute('part', 'popup');\n\n popup.appendChild(anchorSlot);\n popup.appendChild(slot);\n\n // if(this.trigger === \"click\")\n popup.setAttribute('manual', '');\n\n native.appendChild(popup);\n\n fragment.appendChild(native);\n\n this.popup = popup;\n this.anchorSlot = anchorSlot;\n\n return fragment;\n }\n\n /**\n * Adds event listeners for the mouseenter and mouseleave events.\n */\n afterDisconnect() {\n event.removeListener(this, 'mouseenter', null, this.onOpen);\n event.removeListener(this, 'mouseleave', null, this.onClose);\n event.removeListener(this.anchorSlot, 'click', null, this.toggleCallback, { capture: true });\n event.removeListener(this, 'wje-popup:hide', null, this.popupHideCallback);\n }\n\n popupHideCallback = (e) => {\n if (this.classList.contains('active')) {\n this.toggleCallback(e);\n }\n };\n\n /**\n * Adds event listeners for the mouseenter and mouseleave events.\n */\n afterDraw() {\n event.addListener(this, 'wje-popup:hide', null, this.popupHideCallback);\n\n if (this.trigger !== 'click') {\n event.addListener(this, 'mouseenter', null, this.onOpen);\n event.addListener(this, 'mouseleave', null, this.onClose);\n } else {\n event.addListener(this.anchorSlot, 'click', null, this.toggleCallback, { capture: true });\n }\n\n if (this.hasAttribute('collapsible')) {\n event.addListener(\n Array.from(this.querySelectorAll('wje-menu-item')),\n 'click',\n 'wje-menu-item:click',\n this.onClose\n );\n }\n }\n\n /**\n * @summary Toggles the dropdown element between active and inactive states.\n * Calls the `onOpen` method if the element is currently inactive,\n * and calls the `onClose` method if the element is currently active.\n * @param {Event} e The event object.\n */\n toggleCallback = (e) => {\n if (this.classList.contains('active')) {\n e.stopPropagation();\n this.onClose();\n } else {\n e.stopPropagation();\n this.onOpen(e);\n }\n };\n\n /**\n * @summary Returns the content to be displayed before showing the dropdown.\n * @returns {any} The content to be displayed.\n */\n beforeShow() {\n return this.content;\n }\n\n /**\n * This method is called after the dropdown is shown.\n */\n afterShow() {\n // Do nothing\n }\n\n /**\n * Open the popup element.\n * @param {object} e\n */\n onOpen = (e) => {\n this.classList.add('active');\n Promise.resolve(this.beforeShow(this))\n .then((res) => {\n if (!this.classList.contains('active')) {\n throw new Error('beforeShow method returned false or not string');\n }\n\n this.popup.show(true); // Show tooltip\n\n event.dispatchCustomEvent(this, 'wje-dropdown:open', {\n bubbles: true,\n detail: { target: this },\n });\n\n Promise.resolve(this.afterShow(this));\n })\n .catch((error) => {\n // ak je nejaka chyba tak to len zatvorime\n this.classList.remove('active');\n this.popup.hide(true);\n });\n };\n\n beforeClose = () => {\n // Do nothing\n };\n\n afterClose = () => {\n // Do nothing\n };\n\n onClose = () => {\n this.classList.remove('active');\n Promise.resolve(this.beforeClose(this))\n .then((res) => {\n if (this.classList.contains('active')) {\n throw new Error('beforeShow method returned false or not string');\n }\n\n this.popup.hide(true); // Show tooltip\n\n event.dispatchCustomEvent(this, 'wje-dropdown:close', {\n bubbles: true,\n detail: { target: this },\n });\n\n Promise.resolve(this.afterClose(this));\n })\n .catch((error) => {\n this.classList.add('active');\n this.popup.show(true);\n });\n };\n}\n","import Dropdown from './dropdown.element.js';\n\nexport default Dropdown;\n\nDropdown.define('wje-dropdown', Dropdown);\n"],"names":[],"mappings":"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"}
@@ -375,9 +375,8 @@ class FileUpload extends WJElement {
375
375
  native.classList.add("native-file-upload");
376
376
  native.setAttribute("part", "native");
377
377
  let label = document.createElement("div");
378
- label.setAttribute("part", "label");
379
- label.classList.add("file-label");
380
378
  label.setAttribute("part", "file-label");
379
+ label.classList.add("file-label");
381
380
  let fileList = document.createElement("slot");
382
381
  fileList.setAttribute("name", "item");
383
382
  fileList.setAttribute("part", "items");
@@ -1 +1 @@
1
- {"version":3,"file":"wje-file-upload.js","sources":["../packages/wje-file-upload/service/service.js","../packages/wje-file-upload/file-upload.element.js","../packages/wje-file-upload/file-upload.js"],"sourcesContent":["/**\n * Returns a list of file type categories and their corresponding icon names.\n * @returns {Array<object>} An array of objects representing file type categories.\n * Each object contains the following properties:\n * - `type` {Array&lt;string>} A list of file extensions associated with the category.\n * - `name` {string} The name of the icon representing the category.\n * @example\n * const types = fileType();\n * console.log(types);\n * // [\n * // { type: [\"jpg\", \"jpeg\", \"png\", \"gif\", \"bpm\", \"tiff\", \"svg\"], name: \"photo\" },\n * // { type: [\"zip\", \"rar\", \"cab\", \"jar\", \"tar\", \"gzip\", \"uue\", \"bz2\", \"scorm\", \"war\"], name: \"file-type-zip\" },\n * // ...\n * // ]\n */\nfunction fileType() {\n return [\n {\n type: ['jpg', 'jpeg', 'png', 'gif', 'bpm', 'tiff', 'svg'],\n name: 'photo',\n },\n {\n type: ['zip', 'rar', 'cab', 'jar', 'tar', 'gzip', 'uue', 'bz2', 'scorm', 'war'],\n name: 'file-type-zip',\n },\n {\n type: ['mov', 'mp4', 'avi', 'flv'],\n name: 'video',\n },\n {\n type: ['m4a', 'mp3', 'wav'],\n name: 'audio',\n },\n {\n type: ['html', 'html'],\n name: 'file-type-html',\n },\n {\n type: ['css'],\n name: 'code',\n },\n {\n type: ['txt'],\n name: 'file-type-txt',\n },\n {\n type: ['doc', 'docx'],\n name: 'file-type-doc',\n },\n {\n type: ['xls', 'xlsx'],\n name: 'file-type-xls',\n },\n {\n type: ['pdf'],\n name: 'file-type-pdf',\n },\n {\n type: ['ppt', 'pptx', 'odp'],\n name: 'file-type-ppt',\n },\n ];\n}\n\n/**\n * Retrieves the icon name for a given file type.\n * @param {string} type The file type or category (e.g., \"pdf\", \"image\", \"folder\").\n * @returns {string} The name of the icon associated with the file type.\n * @example\n * getFileTypeIcon('pdf'); // Returns the icon name for PDF files.\n * getFileTypeIcon('folder'); // Returns 'folder'.\n */\nexport function getFileTypeIcon(type) {\n let searchType;\n if (type.toLowerCase() !== 'folder') {\n fileType().forEach((i) => {\n if (i.type.includes(type.toLowerCase())) {\n searchType = i.name;\n }\n });\n } else {\n searchType = 'folder';\n }\n\n return searchType;\n}\n\n/**\n * Checks if a given file matches any of the accepted file types.\n * @param {File} file The file to validate.\n * @param {string|string[]} acceptedFileTypes A comma-separated string or an array of accepted MIME types or file extensions.\n * @returns {boolean} Returns `true` if the file type is valid, otherwise `false`.\n * @throws {Error} Throws an error if `acceptedFileTypes` is empty.\n * @example\n * const file = new File([\"\"], \"example.png\", { type: \"image/png\" });\n * const isValid = isValidFileType(file, \"image/*,application/pdf\");\n * console.log(isValid); // true\n * @example\n * const file = new File([\"\"], \"example.txt\", { type: \"text/plain\" });\n * const isValid = isValidFileType(file, [\"text/plain\", \"application/json\"]);\n * console.log(isValid); // true\n */\nexport function isValidFileType(file, acceptedFileTypes) {\n // Get the base MIME type\n const baseMimeType = file.type.split('/')[0];\n // If acceptedFileTypes is a string, convert it to an array\n let acceptedTypes = Array.isArray(acceptedFileTypes) ? acceptedFileTypes : acceptedFileTypes.split(',');\n // If acceptedFileTypes is empty, throw an error\n if (acceptedTypes.length === 0) {\n throw new Error('acceptedFileTypes is empty');\n }\n\n // Iterate over acceptedFileTypes\n for (let type of acceptedTypes) {\n // ak type na image/* a file je napriklad image/png tak vratime true\n if (type.includes(baseMimeType + '/*')) {\n return true;\n }\n\n // Ak type suboru obsahuje konkretny typ a to bud ak je to zapisany napriklad image/png alebo len png tak vratime true\n if (type.includes(file.type) || type.includes(file.type.split('/')[1])) {\n return true;\n }\n }\n\n // Ak sme nic nenasli tak vratime false\n return false;\n}\n\n/**\n * Uploads a file in chunks using `XMLHttpRequest`, allowing for progress tracking.\n * @param {File} file The file to be uploaded.\n * @param {number} chunkSize The size of each chunk in bytes.\n * @param {HTMLElement} preview The element used to display upload progress.\n */\nexport function uploadFile(file, chunkSize, preview) {\n let offset = 0;\n const progressArray = new Array(Math.ceil(file.size / chunkSize)).fill(0);\n\n const readAndUploadChunk = (start, end) => {\n const reader = new FileReader();\n const chunkIndex = start / chunkSize;\n const chunk = file.slice(start, end);\n\n reader.onload = (e) => {\n const xhr = new XMLHttpRequest();\n xhr.open('POST', '/upload', true);\n xhr.setRequestHeader('Content-Range', `${start}-${end}/${file.size}`);\n\n xhr.upload.onprogress = (event) => {\n if (event.lengthComputable) {\n const progress = (event.loaded / event.total) * 100;\n progressArray[chunkIndex] = progress;\n const totalProgress = progressArray.reduce((a, b) => a + b, 0) / progressArray.length;\n // this.updateOverallProgress(progressArray, file.lastModified);\n // preview.setAttribute(\"progress\", totalProgress);\n }\n };\n\n xhr.onload = () => {\n if (xhr.status === 200 || xhr.status === 201) {\n progressArray[chunkIndex] = 100; // Táto časť je kompletná\n\n // Odoslanie ďalšej časti\n start += chunkSize;\n if (start < file.size) {\n preview.setAttribute('uploaded', start);\n readAndUploadChunk(start, Math.min(start + chunkSize, file.size));\n } else {\n preview.setAttribute('uploaded', start);\n }\n } else {\n console.error('Error during upload: ', xhr.statusText);\n }\n };\n xhr.send(e.target.result);\n };\n reader.readAsArrayBuffer(chunk);\n };\n\n readAndUploadChunk(offset, Math.min(offset + chunkSize, file.size));\n}\n\n/**\n * Returns a function for uploading files either in chunks or as a whole file, based on the provided options.\n * @param {string} url The URL to which the file will be uploaded.\n * @param {number} [chunkSize] The size of each chunk in bytes when uploading in chunks (default is 1MB).\n * @param {boolean} [wholeFile] Whether to upload the file as a whole. If `true`, the entire file is uploaded at once.\n * @returns {Function} A function that takes a file and a preview element as arguments and uploads the file.\n * @example\n * // Upload a file in chunks\n * const uploadInChunks = upload('/upload', 1024 * 512); // 512KB chunks\n * uploadInChunks(file, previewElement);\n * @example\n * // Upload a whole file\n * const uploadWhole = upload('/upload', undefined, true);\n * uploadWhole(file, previewElement);\n */\nexport function upload(url, chunkSize = 1024 * 1024, wholeFile = false) {\n if (wholeFile) {\n return (file, preview) => uploadWholeFile(url, file, preview);\n }\n return (file, preview) => uploadFileInChunks(url, file, preview, chunkSize);\n}\n\n/**\n * Uploads a file in chunks to a specified URL, allowing for progress tracking and resuming in case of errors.\n * @param {string} url The URL to which the file chunks will be uploaded.\n * @param {File} file The file to be uploaded in chunks.\n * @param {HTMLElement} preview The element used to display upload progress.\n * @param {number} [chunkSize] The size of each chunk in bytes (default is 1MB).\n * @returns {Promise<object>} Resolves with the response of the last chunk uploaded, parsed as JSON.\n * @throws {Error} - Throws an error if a chunk fails to upload.\n */\nexport async function uploadFileInChunks(url, file, preview, chunkSize = 1024 * 1024) {\n let offset = 0;\n const totalChunks = Math.ceil(file.size / chunkSize);\n const partResponses = [];\n\n while (offset < file.size) {\n const chunk = file.slice(offset, offset + chunkSize);\n\n // Creating a custom ReadableStream to track progress of the current chunk\n const stream = new ReadableStream({\n start(controller) {\n const reader = chunk.stream().getReader();\n let uploadedBytes = 0;\n\n reader.read().then(function process({ done, value }) {\n if (done) {\n controller.close();\n return Promise.resolve();\n }\n\n // Track progress\n uploadedBytes += value.byteLength;\n const percentComplete = ((offset + uploadedBytes) / file.size) * 100;\n preview.setAttribute('uploaded', offset + uploadedBytes);\n\n // Enqueue chunk data into the stream\n controller.enqueue(value);\n\n // Read the next chunk\n return reader.read().then(process);\n });\n },\n });\n\n const formData = new FormData();\n formData.append('file', new Blob([stream])); // Send the current stream (chunk)\n formData.append('chunkIndex', Math.floor(offset / chunkSize)); // Send chunk index\n formData.append('totalChunks', totalChunks); // Send total chunks\n formData.append('fileName', file.name); // Send file name\n\n try {\n // Send the current chunk via Fetch\n const response = await fetch(url, {\n method: 'POST',\n body: formData,\n });\n\n if (!response.ok) {\n throw new Error(`Failed to upload chunk ${Math.floor(offset / chunkSize) + 1}: ${response.statusText}`);\n }\n\n partResponses.push(response);\n } catch (error) {\n console.error('Error uploading chunk:', error);\n break;\n }\n\n // Move to the next chunk\n offset += chunkSize;\n }\n\n const response = await partResponses.at(-1).json();\n\n return {\n data: response,\n file,\n };\n}\n\n/**\n * Uploads a file to a specified URL using a `POST` request and updates the preview element with the uploaded file size.\n * @param {string} url The URL to which the file will be uploaded.\n * @param {File} file The file to be uploaded.\n * @param {HTMLElement} preview The element that displays the upload preview. It will be updated with the file size.\n * @returns {Promise<{data: object, file: File}>} - A promise that resolves with the server response and the uploaded file.\n * @throws {Error} - Logs an error to the console if the request fails.\n */\nexport function uploadWholeFile(url, file, preview) {\n const formData = new FormData();\n formData.append('file', file);\n\n //use fetch\n return fetch(url, {\n method: 'POST',\n body: formData,\n })\n .then((response) => response.json())\n .then((data) => {\n preview.setAttribute('uploaded', file.size);\n return {\n data,\n file,\n };\n })\n .catch((error) => {\n console.error('Error:', error);\n });\n}\n","import { Localizer } from '../utils/localize.js';\nimport Button from '../wje-button/button.js';\nimport { default as WJElement } from '../wje-element/element.js';\nimport { getFileTypeIcon, isValidFileType, upload } from './service/service.js';\nimport styles from './styles/styles.css?inline';\n\n/**\n * @summary FileUpload is a custom web component for uploading files.\n * It extends from WJElement and provides functionalities for file upload.\n * @documentation https://elements.webjet.sk/components/file-upload\n * @status stable\n * @augments WJElement\n * @slot - This is a default/unnamed slot.\n * @csspart native - The native file upload part.\n * @csspart file-list - The file list part.\n * @csspart upload-button - The label part.\n * @event change - Fires when the file input changes.\n * @event drop - Fires when a file is dropped into the component.\n * @attribute {string} accepted-types - The accepted file types for upload.\n * @attribute {number} chunk-size - The chunk size for file upload.\n * @attribute {number} max-file-size - The maximum file size for upload.\n * @attribute {string} upload-url - The URL to set as the upload URL.\n * @attribute {boolean} auto-process-files - The auto process files attribute.\n * @attribute {boolean} no-upload-button - The no upload button attribute.\n * @tag wje-file-upload\n */\nexport default class FileUpload extends WJElement {\n /**\n * Constructor for FileUpload.\n * Initializes a new instance of the Localizer.\n */\n constructor() {\n super();\n this.localizer = new Localizer(this);\n this._uploadedFiles = [];\n this._queuedFiles = [];\n }\n\n /**\n * Dependencies for the FileUpload component.\n * @type {object}\n */\n dependencies = {\n 'wje-button': Button,\n };\n\n /**\n * Setter for acceptedTypes attribute.\n * @param {string} value The accepted file types for upload.\n */\n set acceptedTypes(value) {\n this.setAttribute('accepted-types', value);\n }\n\n /**\n * Getter for acceptedTypes attribute.\n * @returns {string} The accepted file types for upload.\n */\n get acceptedTypes() {\n const accepted = this.getAttribute('accepted-types');\n return this.hasAttribute('accepted-types') ? accepted : '';\n }\n\n /**\n * Setter for chunkSize attribute.\n * @param {number} value The chunk size for file upload.\n */\n set chunkSize(value) {\n this.setAttribute('chunk-size', value);\n }\n\n /**\n * Getter for chunkSize attribute.\n * @returns {number} The chunk size for file upload.\n */\n get chunkSize() {\n const chunk = this.getAttribute('chunk-size');\n return this.hasAttribute('chunk-size') ? chunk : 1024 * 1024;\n }\n\n /**\n * Setter for maxFileSize attribute.\n * @param {number} value The maximum file size for upload.\n */\n set maxFileSize(value) {\n this.setAttribute('max-file-size', value);\n }\n\n /**\n * Getter for maxFileSize attribute.\n * @returns {number} The maximum file size for upload.\n */\n get maxFileSize() {\n const fileSize = this.getAttribute('max-file-size');\n return this.hasAttribute('max-file-size') ? fileSize * 1024 * 1024 : 1024 * 1024;\n }\n\n /**\n * Setter for label attribute.\n * @param {string} value The URL to set as the upload URL.\n */\n set uploadUrl(value) {\n this.setAttribute('upload-url', value);\n }\n\n /**\n * Gets the upload URL for the file upload element.\n * @returns {string} The upload URL for the file upload element.\n */\n get uploadUrl() {\n return this.getAttribute('upload-url') ?? '/upload';\n }\n\n /**\n * Sets the autoProcessFiles attribute.\n * @param value\n */\n set autoProcessFiles(value) {\n this.setAttribute('auto-process-files', value);\n }\n\n /**\n * Gets the autoProcessFiles attribute.\n * @returns {any|boolean}\n */\n get autoProcessFiles() {\n return JSON.parse(this.getAttribute('auto-process-files')) ?? true;\n }\n\n /**\n * Sets the noUploadButton attribute.\n * @param value\n */\n set noUploadButton(value) {\n this.setAttribute('no-upload-button', value);\n }\n\n /**\n * Gets the noUploadButton attribute.\n * @returns {boolean}\n */\n get noUploadButton() {\n return this.hasAttribute('no-upload-button');\n }\n\n /**\n * Sets the uploaded files.\n * @param value\n */\n set uploadedFiles(value) {\n this._uploadedFiles = value;\n }\n\n /**\n * Return the uploaded files.\n * @returns {[]}\n */\n get uploadedFiles() {\n return this._uploadedFiles;\n }\n\n /**\n * Sets the to-chunk attribute.\n * @param value\n */\n set toChunk(value) {\n this.setAttribute('to-chunk', value);\n }\n\n /**\n * Gets the to-chunk attribute.\n * @returns {boolean}\n */\n get toChunk() {\n return this.hasAttribute('to-chunk');\n }\n\n className = 'FileUpload';\n\n /**\n * Getter for cssStyleSheet.\n * @returns {string} The CSS styles for the component.\n */\n static get cssStyleSheet() {\n return styles;\n }\n\n /**\n * Getter for observedAttributes.\n * @returns {Array} An empty array as no attributes are observed.\n */\n static get observedAttributes() {\n return [];\n }\n\n /**\n * Method to setup attributes for the component.\n */\n setupAttributes() {\n this.isShadowRoot = 'open';\n }\n\n beforeDraw() {\n this.uploadFunction = upload(this.uploadUrl, this.chunkSize, !this.toChunk);\n }\n\n /**\n * Method to draw the component on the screen.\n * @returns {DocumentFragment} The fragment containing the component.\n */\n draw() {\n let fragment = document.createDocumentFragment();\n\n let native = document.createElement('div');\n native.classList.add('native-file-upload');\n native.setAttribute('part', 'native');\n\n let label = document.createElement('div');\n label.setAttribute('part', 'label');\n label.classList.add('file-label');\n label.setAttribute('part', 'file-label');\n\n let fileList = document.createElement('slot');\n fileList.setAttribute('name', 'item');\n fileList.setAttribute('part', 'items');\n fileList.classList.add('file-list');\n\n let slot = document.createElement('slot');\n label.appendChild(slot);\n\n let fileInput = document.createElement('input');\n fileInput.setAttribute('type', 'file');\n fileInput.setAttribute('multiple', '');\n fileInput.setAttribute('style', 'display:none;');\n\n if (!this.noUploadButton) {\n let button = document.createElement('wje-button');\n button.innerText = this.label || this.localizer.translate('wj.file.upload.button');\n button.setAttribute('part', 'upload-button');\n\n label.appendChild(button);\n\n this.button = button;\n }\n\n native.appendChild(fileInput);\n native.appendChild(label);\n native.appendChild(fileList);\n\n fragment.appendChild(native);\n\n this.native = native;\n this.fileList = fileList;\n this.fileInput = fileInput;\n\n return fragment;\n }\n\n /**\n * Method to perform actions after the component is drawn.\n */\n afterDraw() {\n this.button?.addEventListener('click', () => {\n this.fileInput.click();\n });\n\n this.fileInput.addEventListener('change', this.handleInputChange);\n this.native.addEventListener('drop', this.handleDrop);\n\n let dragEventCounter = 0;\n\n this.native.addEventListener('dragenter', (event) => {\n event.preventDefault();\n\n if (dragEventCounter === 0) {\n this.native.classList.add('highlight');\n }\n\n dragEventCounter += 1;\n });\n\n this.native.addEventListener('dragover', (event) => {\n event.preventDefault();\n\n if (dragEventCounter === 0) {\n dragEventCounter = 1;\n }\n });\n\n this.native.addEventListener('dragleave', (event) => {\n event.preventDefault();\n\n dragEventCounter -= 1;\n\n if (dragEventCounter <= 0) {\n dragEventCounter = 0;\n this.native.classList.remove('highlight');\n }\n });\n\n this.native.addEventListener('drop', (event) => {\n event.preventDefault();\n\n dragEventCounter = 0;\n this.native.classList.remove('highlight');\n });\n }\n\n /**\n * Method to handle form submission.\n * @param {Event} event The form submission event.\n */\n handleSubmit(event) {\n event.preventDefault();\n\n // TODO: TU TREBA PRIDAT ZOBRAZENIE SUBORU A JEHO PROCESSU\n\n this.addFilesToQueue(this.fileInput.files);\n }\n\n /**\n * Method to handle file drop event.\n * @param {Event} event The file drop event object.\n */\n handleDrop = (event) => {\n const fileList = event.dataTransfer.files;\n\n this.resetFormState();\n\n this.addFilesToQueue(fileList);\n };\n\n /**\n * Method to handle file input change event.\n * @param {Event} event The file input change event object.\n */\n handleInputChange = (event) => {\n this.resetFormState();\n\n try {\n this.handleSubmit(event);\n } catch (err) {}\n };\n\n /**\n * Method to add files to the queue.\n * @param files\n */\n addFilesToQueue(files) {\n this._queuedFiles = [...files];\n\n this.dispatchEvent(\n new CustomEvent('file-upload:files-added', { detail: files, bubbles: true, composed: true })\n );\n this.onAddedFiles?.();\n\n if (this.autoProcessFiles) {\n this.uploadFiles();\n }\n\n this.fileInput.value = '';\n }\n\n /**\n * Method to upload files.\n */\n uploadFiles() {\n if (this._queuedFiles.length === 0) {\n return;\n }\n\n const uploadPromises = this._queuedFiles.map((file) => this.createUploadPromise(file));\n uploadPromises\n .reduce((prev, curr) => {\n return prev.then(() => {\n return curr;\n });\n }, Promise.resolve())\n .then(() => {\n this.dispatchEvent(\n new CustomEvent('file-upload:all-files-uploaded', {\n detail: this.uploadedFiles,\n bubbles: true,\n composed: true,\n })\n );\n this.onAllFilesUploaded?.();\n this._queuedFiles = [];\n });\n }\n\n /**\n * Method to create an upload promise.\n * @param file\n * @returns {Promise<unknown>}\n */\n createUploadPromise = (file) => {\n return new Promise((resolve, reject) => {\n this.assertFilesValid(file);\n let preview;\n\n let reader = new FileReader();\n reader.onload = (e) => {\n this.dispatchEvent(\n new CustomEvent('file-upload:upload-started', { detail: file, bubbles: true, composed: true })\n );\n this.onUploadStarted?.(file);\n\n preview = this.createPreview(file, reader);\n this.appendChild(preview);\n\n this.uploadFunction(file, preview).then((res) => {\n this.dispatchEvent(\n new CustomEvent('file-upload:upladed-file-complete', {\n detail: res,\n bubbles: true,\n composed: true,\n })\n );\n this.onUploadedFileComplete?.(res);\n this.uploadedFiles.push(res.data);\n\n resolve(res);\n });\n };\n\n reader.readAsDataURL(file);\n });\n };\n\n /**\n * Method to create a preview for the file.\n * @param {File} file The file for which the preview is to be created.\n * @param {FileReader} reader The FileReader instance to read the file.\n * @returns {HTMLElement} The created preview.\n */\n createPreview(file, reader) {\n let preview = document.createElement('wje-file-upload-item');\n preview.setAttribute('slot', 'item');\n preview.setAttribute('name', file.name);\n preview.setAttribute('size', file.size);\n preview.setAttribute('uploaded', '0');\n preview.setAttribute('progress', '0');\n preview.innerHTML = `<wje-icon slot=\"img\" name=\"${getFileTypeIcon(file.type.split('/')[1])}\" size=\"large\"></wje-icon>`;\n\n return preview;\n }\n\n /**\n * Method to create a thumbnail for the file.\n * @param {File} file The file for which the thumbnail is to be created.\n * @param {FileReader} reader The FileReader instance to read the file.\n * @returns {HTMLElement} The created thumbnail.\n */\n createThumbnail(file, reader) {\n let img = document.createElement('img');\n img.setAttribute('src', reader.result);\n\n return img;\n }\n\n /**\n * Method to validate the files.\n * @param {File} file The file to be validated.\n * TODO: alowed types a size limit by malo byt cez attributy\n */\n assertFilesValid(file) {\n const { name: fileName, size: fileSize } = file;\n if (!isValidFileType(file, this.acceptedTypes)) {\n throw new Error(`❌ FILE: \"${fileName}\" Valid file types are: \"${this.acceptedTypes}\"`);\n }\n\n if (fileSize > this.maxFileSize) {\n throw new Error(\n `❌ File \"${fileName}\" could not be uploaded. Only images up to ${this.maxFileSize} MB are allowed. Nie je to ${fileSize}`\n );\n }\n }\n\n /**\n * Method to reset the form state.\n */\n resetFormState() {\n this.fileList.textContent = '';\n }\n}\n","import FileUpload from './file-upload.element.js';\n\nexport default FileUpload;\n\nFileUpload.define('wje-file-upload', FileUpload);\n"],"names":["response","_a"],"mappings":"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"}
1
+ {"version":3,"file":"wje-file-upload.js","sources":["../packages/wje-file-upload/service/service.js","../packages/wje-file-upload/file-upload.element.js","../packages/wje-file-upload/file-upload.js"],"sourcesContent":["/**\n * Returns a list of file type categories and their corresponding icon names.\n * @returns {Array<object>} An array of objects representing file type categories.\n * Each object contains the following properties:\n * - `type` {Array&lt;string>} A list of file extensions associated with the category.\n * - `name` {string} The name of the icon representing the category.\n * @example\n * const types = fileType();\n * console.log(types);\n * // [\n * // { type: [\"jpg\", \"jpeg\", \"png\", \"gif\", \"bpm\", \"tiff\", \"svg\"], name: \"photo\" },\n * // { type: [\"zip\", \"rar\", \"cab\", \"jar\", \"tar\", \"gzip\", \"uue\", \"bz2\", \"scorm\", \"war\"], name: \"file-type-zip\" },\n * // ...\n * // ]\n */\nfunction fileType() {\n return [\n {\n type: ['jpg', 'jpeg', 'png', 'gif', 'bpm', 'tiff', 'svg'],\n name: 'photo',\n },\n {\n type: ['zip', 'rar', 'cab', 'jar', 'tar', 'gzip', 'uue', 'bz2', 'scorm', 'war'],\n name: 'file-type-zip',\n },\n {\n type: ['mov', 'mp4', 'avi', 'flv'],\n name: 'video',\n },\n {\n type: ['m4a', 'mp3', 'wav'],\n name: 'audio',\n },\n {\n type: ['html', 'html'],\n name: 'file-type-html',\n },\n {\n type: ['css'],\n name: 'code',\n },\n {\n type: ['txt'],\n name: 'file-type-txt',\n },\n {\n type: ['doc', 'docx'],\n name: 'file-type-doc',\n },\n {\n type: ['xls', 'xlsx'],\n name: 'file-type-xls',\n },\n {\n type: ['pdf'],\n name: 'file-type-pdf',\n },\n {\n type: ['ppt', 'pptx', 'odp'],\n name: 'file-type-ppt',\n },\n ];\n}\n\n/**\n * Retrieves the icon name for a given file type.\n * @param {string} type The file type or category (e.g., \"pdf\", \"image\", \"folder\").\n * @returns {string} The name of the icon associated with the file type.\n * @example\n * getFileTypeIcon('pdf'); // Returns the icon name for PDF files.\n * getFileTypeIcon('folder'); // Returns 'folder'.\n */\nexport function getFileTypeIcon(type) {\n let searchType;\n if (type.toLowerCase() !== 'folder') {\n fileType().forEach((i) => {\n if (i.type.includes(type.toLowerCase())) {\n searchType = i.name;\n }\n });\n } else {\n searchType = 'folder';\n }\n\n return searchType;\n}\n\n/**\n * Checks if a given file matches any of the accepted file types.\n * @param {File} file The file to validate.\n * @param {string|string[]} acceptedFileTypes A comma-separated string or an array of accepted MIME types or file extensions.\n * @returns {boolean} Returns `true` if the file type is valid, otherwise `false`.\n * @throws {Error} Throws an error if `acceptedFileTypes` is empty.\n * @example\n * const file = new File([\"\"], \"example.png\", { type: \"image/png\" });\n * const isValid = isValidFileType(file, \"image/*,application/pdf\");\n * console.log(isValid); // true\n * @example\n * const file = new File([\"\"], \"example.txt\", { type: \"text/plain\" });\n * const isValid = isValidFileType(file, [\"text/plain\", \"application/json\"]);\n * console.log(isValid); // true\n */\nexport function isValidFileType(file, acceptedFileTypes) {\n // Get the base MIME type\n const baseMimeType = file.type.split('/')[0];\n // If acceptedFileTypes is a string, convert it to an array\n let acceptedTypes = Array.isArray(acceptedFileTypes) ? acceptedFileTypes : acceptedFileTypes.split(',');\n // If acceptedFileTypes is empty, throw an error\n if (acceptedTypes.length === 0) {\n throw new Error('acceptedFileTypes is empty');\n }\n\n // Iterate over acceptedFileTypes\n for (let type of acceptedTypes) {\n // ak type na image/* a file je napriklad image/png tak vratime true\n if (type.includes(baseMimeType + '/*')) {\n return true;\n }\n\n // Ak type suboru obsahuje konkretny typ a to bud ak je to zapisany napriklad image/png alebo len png tak vratime true\n if (type.includes(file.type) || type.includes(file.type.split('/')[1])) {\n return true;\n }\n }\n\n // Ak sme nic nenasli tak vratime false\n return false;\n}\n\n/**\n * Uploads a file in chunks using `XMLHttpRequest`, allowing for progress tracking.\n * @param {File} file The file to be uploaded.\n * @param {number} chunkSize The size of each chunk in bytes.\n * @param {HTMLElement} preview The element used to display upload progress.\n */\nexport function uploadFile(file, chunkSize, preview) {\n let offset = 0;\n const progressArray = new Array(Math.ceil(file.size / chunkSize)).fill(0);\n\n const readAndUploadChunk = (start, end) => {\n const reader = new FileReader();\n const chunkIndex = start / chunkSize;\n const chunk = file.slice(start, end);\n\n reader.onload = (e) => {\n const xhr = new XMLHttpRequest();\n xhr.open('POST', '/upload', true);\n xhr.setRequestHeader('Content-Range', `${start}-${end}/${file.size}`);\n\n xhr.upload.onprogress = (event) => {\n if (event.lengthComputable) {\n const progress = (event.loaded / event.total) * 100;\n progressArray[chunkIndex] = progress;\n const totalProgress = progressArray.reduce((a, b) => a + b, 0) / progressArray.length;\n // this.updateOverallProgress(progressArray, file.lastModified);\n // preview.setAttribute(\"progress\", totalProgress);\n }\n };\n\n xhr.onload = () => {\n if (xhr.status === 200 || xhr.status === 201) {\n progressArray[chunkIndex] = 100; // Táto časť je kompletná\n\n // Odoslanie ďalšej časti\n start += chunkSize;\n if (start < file.size) {\n preview.setAttribute('uploaded', start);\n readAndUploadChunk(start, Math.min(start + chunkSize, file.size));\n } else {\n preview.setAttribute('uploaded', start);\n }\n } else {\n console.error('Error during upload: ', xhr.statusText);\n }\n };\n xhr.send(e.target.result);\n };\n reader.readAsArrayBuffer(chunk);\n };\n\n readAndUploadChunk(offset, Math.min(offset + chunkSize, file.size));\n}\n\n/**\n * Returns a function for uploading files either in chunks or as a whole file, based on the provided options.\n * @param {string} url The URL to which the file will be uploaded.\n * @param {number} [chunkSize] The size of each chunk in bytes when uploading in chunks (default is 1MB).\n * @param {boolean} [wholeFile] Whether to upload the file as a whole. If `true`, the entire file is uploaded at once.\n * @returns {Function} A function that takes a file and a preview element as arguments and uploads the file.\n * @example\n * // Upload a file in chunks\n * const uploadInChunks = upload('/upload', 1024 * 512); // 512KB chunks\n * uploadInChunks(file, previewElement);\n * @example\n * // Upload a whole file\n * const uploadWhole = upload('/upload', undefined, true);\n * uploadWhole(file, previewElement);\n */\nexport function upload(url, chunkSize = 1024 * 1024, wholeFile = false) {\n if (wholeFile) {\n return (file, preview) => uploadWholeFile(url, file, preview);\n }\n return (file, preview) => uploadFileInChunks(url, file, preview, chunkSize);\n}\n\n/**\n * Uploads a file in chunks to a specified URL, allowing for progress tracking and resuming in case of errors.\n * @param {string} url The URL to which the file chunks will be uploaded.\n * @param {File} file The file to be uploaded in chunks.\n * @param {HTMLElement} preview The element used to display upload progress.\n * @param {number} [chunkSize] The size of each chunk in bytes (default is 1MB).\n * @returns {Promise<object>} Resolves with the response of the last chunk uploaded, parsed as JSON.\n * @throws {Error} - Throws an error if a chunk fails to upload.\n */\nexport async function uploadFileInChunks(url, file, preview, chunkSize = 1024 * 1024) {\n let offset = 0;\n const totalChunks = Math.ceil(file.size / chunkSize);\n const partResponses = [];\n\n while (offset < file.size) {\n const chunk = file.slice(offset, offset + chunkSize);\n\n // Creating a custom ReadableStream to track progress of the current chunk\n const stream = new ReadableStream({\n start(controller) {\n const reader = chunk.stream().getReader();\n let uploadedBytes = 0;\n\n reader.read().then(function process({ done, value }) {\n if (done) {\n controller.close();\n return Promise.resolve();\n }\n\n // Track progress\n uploadedBytes += value.byteLength;\n const percentComplete = ((offset + uploadedBytes) / file.size) * 100;\n preview.setAttribute('uploaded', offset + uploadedBytes);\n\n // Enqueue chunk data into the stream\n controller.enqueue(value);\n\n // Read the next chunk\n return reader.read().then(process);\n });\n },\n });\n\n const formData = new FormData();\n formData.append('file', new Blob([stream])); // Send the current stream (chunk)\n formData.append('chunkIndex', Math.floor(offset / chunkSize)); // Send chunk index\n formData.append('totalChunks', totalChunks); // Send total chunks\n formData.append('fileName', file.name); // Send file name\n\n try {\n // Send the current chunk via Fetch\n const response = await fetch(url, {\n method: 'POST',\n body: formData,\n });\n\n if (!response.ok) {\n throw new Error(`Failed to upload chunk ${Math.floor(offset / chunkSize) + 1}: ${response.statusText}`);\n }\n\n partResponses.push(response);\n } catch (error) {\n console.error('Error uploading chunk:', error);\n break;\n }\n\n // Move to the next chunk\n offset += chunkSize;\n }\n\n const response = await partResponses.at(-1).json();\n\n return {\n data: response,\n file,\n };\n}\n\n/**\n * Uploads a file to a specified URL using a `POST` request and updates the preview element with the uploaded file size.\n * @param {string} url The URL to which the file will be uploaded.\n * @param {File} file The file to be uploaded.\n * @param {HTMLElement} preview The element that displays the upload preview. It will be updated with the file size.\n * @returns {Promise<{data: object, file: File}>} - A promise that resolves with the server response and the uploaded file.\n * @throws {Error} - Logs an error to the console if the request fails.\n */\nexport function uploadWholeFile(url, file, preview) {\n const formData = new FormData();\n formData.append('file', file);\n\n //use fetch\n return fetch(url, {\n method: 'POST',\n body: formData,\n })\n .then((response) => response.json())\n .then((data) => {\n preview.setAttribute('uploaded', file.size);\n return {\n data,\n file,\n };\n })\n .catch((error) => {\n console.error('Error:', error);\n });\n}\n","import { Localizer } from '../utils/localize.js';\nimport Button from '../wje-button/button.js';\nimport { default as WJElement } from '../wje-element/element.js';\nimport { getFileTypeIcon, isValidFileType, upload } from './service/service.js';\nimport styles from './styles/styles.css?inline';\n\n/**\n * @summary FileUpload is a custom web component for uploading files.\n * It extends from WJElement and provides functionalities for file upload.\n * @documentation https://elements.webjet.sk/components/file-upload\n * @status stable\n * @augments WJElement\n * @slot - This is a default/unnamed slot.\n * @csspart native - The native file upload part.\n * @csspart file-list - The file list part.\n * @csspart upload-button - The label part.\n * @event change - Fires when the file input changes.\n * @event drop - Fires when a file is dropped into the component.\n * @attribute {string} accepted-types - The accepted file types for upload.\n * @attribute {number} chunk-size - The chunk size for file upload.\n * @attribute {number} max-file-size - The maximum file size for upload.\n * @attribute {string} upload-url - The URL to set as the upload URL.\n * @attribute {boolean} auto-process-files - The auto process files attribute.\n * @attribute {boolean} no-upload-button - The no upload button attribute.\n * @tag wje-file-upload\n */\nexport default class FileUpload extends WJElement {\n /**\n * Constructor for FileUpload.\n * Initializes a new instance of the Localizer.\n */\n constructor() {\n super();\n this.localizer = new Localizer(this);\n this._uploadedFiles = [];\n this._queuedFiles = [];\n }\n\n /**\n * Dependencies for the FileUpload component.\n * @type {object}\n */\n dependencies = {\n 'wje-button': Button,\n };\n\n /**\n * Setter for acceptedTypes attribute.\n * @param {string} value The accepted file types for upload.\n */\n set acceptedTypes(value) {\n this.setAttribute('accepted-types', value);\n }\n\n /**\n * Getter for acceptedTypes attribute.\n * @returns {string} The accepted file types for upload.\n */\n get acceptedTypes() {\n const accepted = this.getAttribute('accepted-types');\n return this.hasAttribute('accepted-types') ? accepted : '';\n }\n\n /**\n * Setter for chunkSize attribute.\n * @param {number} value The chunk size for file upload.\n */\n set chunkSize(value) {\n this.setAttribute('chunk-size', value);\n }\n\n /**\n * Getter for chunkSize attribute.\n * @returns {number} The chunk size for file upload.\n */\n get chunkSize() {\n const chunk = this.getAttribute('chunk-size');\n return this.hasAttribute('chunk-size') ? chunk : 1024 * 1024;\n }\n\n /**\n * Setter for maxFileSize attribute.\n * @param {number} value The maximum file size for upload.\n */\n set maxFileSize(value) {\n this.setAttribute('max-file-size', value);\n }\n\n /**\n * Getter for maxFileSize attribute.\n * @returns {number} The maximum file size for upload.\n */\n get maxFileSize() {\n const fileSize = this.getAttribute('max-file-size');\n return this.hasAttribute('max-file-size') ? fileSize * 1024 * 1024 : 1024 * 1024;\n }\n\n /**\n * Setter for label attribute.\n * @param {string} value The URL to set as the upload URL.\n */\n set uploadUrl(value) {\n this.setAttribute('upload-url', value);\n }\n\n /**\n * Gets the upload URL for the file upload element.\n * @returns {string} The upload URL for the file upload element.\n */\n get uploadUrl() {\n return this.getAttribute('upload-url') ?? '/upload';\n }\n\n /**\n * Sets the autoProcessFiles attribute.\n * @param value\n */\n set autoProcessFiles(value) {\n this.setAttribute('auto-process-files', value);\n }\n\n /**\n * Gets the autoProcessFiles attribute.\n * @returns {any|boolean}\n */\n get autoProcessFiles() {\n return JSON.parse(this.getAttribute('auto-process-files')) ?? true;\n }\n\n /**\n * Sets the noUploadButton attribute.\n * @param value\n */\n set noUploadButton(value) {\n this.setAttribute('no-upload-button', value);\n }\n\n /**\n * Gets the noUploadButton attribute.\n * @returns {boolean}\n */\n get noUploadButton() {\n return this.hasAttribute('no-upload-button');\n }\n\n /**\n * Sets the uploaded files.\n * @param value\n */\n set uploadedFiles(value) {\n this._uploadedFiles = value;\n }\n\n /**\n * Return the uploaded files.\n * @returns {[]}\n */\n get uploadedFiles() {\n return this._uploadedFiles;\n }\n\n /**\n * Sets the to-chunk attribute.\n * @param value\n */\n set toChunk(value) {\n this.setAttribute('to-chunk', value);\n }\n\n /**\n * Gets the to-chunk attribute.\n * @returns {boolean}\n */\n get toChunk() {\n return this.hasAttribute('to-chunk');\n }\n\n className = 'FileUpload';\n\n /**\n * Getter for cssStyleSheet.\n * @returns {string} The CSS styles for the component.\n */\n static get cssStyleSheet() {\n return styles;\n }\n\n /**\n * Getter for observedAttributes.\n * @returns {Array} An empty array as no attributes are observed.\n */\n static get observedAttributes() {\n return [];\n }\n\n /**\n * Method to setup attributes for the component.\n */\n setupAttributes() {\n this.isShadowRoot = 'open';\n }\n\n beforeDraw() {\n this.uploadFunction = upload(this.uploadUrl, this.chunkSize, !this.toChunk);\n }\n\n /**\n * Method to draw the component on the screen.\n * @returns {DocumentFragment} The fragment containing the component.\n */\n draw() {\n let fragment = document.createDocumentFragment();\n\n let native = document.createElement('div');\n native.classList.add('native-file-upload');\n native.setAttribute('part', 'native');\n\n let label = document.createElement('div');\n label.setAttribute('part', 'file-label');\n label.classList.add('file-label');\n\n let fileList = document.createElement('slot');\n fileList.setAttribute('name', 'item');\n fileList.setAttribute('part', 'items');\n fileList.classList.add('file-list');\n\n let slot = document.createElement('slot');\n label.appendChild(slot);\n\n let fileInput = document.createElement('input');\n fileInput.setAttribute('type', 'file');\n fileInput.setAttribute('multiple', '');\n fileInput.setAttribute('style', 'display:none;');\n\n if (!this.noUploadButton) {\n let button = document.createElement('wje-button');\n button.innerText = this.label || this.localizer.translate('wj.file.upload.button');\n button.setAttribute('part', 'upload-button');\n\n label.appendChild(button);\n\n this.button = button;\n }\n\n native.appendChild(fileInput);\n native.appendChild(label);\n native.appendChild(fileList);\n\n fragment.appendChild(native);\n\n this.native = native;\n this.fileList = fileList;\n this.fileInput = fileInput;\n\n return fragment;\n }\n\n /**\n * Method to perform actions after the component is drawn.\n */\n afterDraw() {\n this.button?.addEventListener('click', () => {\n this.fileInput.click();\n });\n\n this.fileInput.addEventListener('change', this.handleInputChange);\n this.native.addEventListener('drop', this.handleDrop);\n\n let dragEventCounter = 0;\n\n this.native.addEventListener('dragenter', (event) => {\n event.preventDefault();\n\n if (dragEventCounter === 0) {\n this.native.classList.add('highlight');\n }\n\n dragEventCounter += 1;\n });\n\n this.native.addEventListener('dragover', (event) => {\n event.preventDefault();\n\n if (dragEventCounter === 0) {\n dragEventCounter = 1;\n }\n });\n\n this.native.addEventListener('dragleave', (event) => {\n event.preventDefault();\n\n dragEventCounter -= 1;\n\n if (dragEventCounter <= 0) {\n dragEventCounter = 0;\n this.native.classList.remove('highlight');\n }\n });\n\n this.native.addEventListener('drop', (event) => {\n event.preventDefault();\n\n dragEventCounter = 0;\n this.native.classList.remove('highlight');\n });\n }\n\n /**\n * Method to handle form submission.\n * @param {Event} event The form submission event.\n */\n handleSubmit(event) {\n event.preventDefault();\n\n // TODO: TU TREBA PRIDAT ZOBRAZENIE SUBORU A JEHO PROCESSU\n\n this.addFilesToQueue(this.fileInput.files);\n }\n\n /**\n * Method to handle file drop event.\n * @param {Event} event The file drop event object.\n */\n handleDrop = (event) => {\n const fileList = event.dataTransfer.files;\n\n this.resetFormState();\n\n this.addFilesToQueue(fileList);\n };\n\n /**\n * Method to handle file input change event.\n * @param {Event} event The file input change event object.\n */\n handleInputChange = (event) => {\n this.resetFormState();\n\n try {\n this.handleSubmit(event);\n } catch (err) {}\n };\n\n /**\n * Method to add files to the queue.\n * @param files\n */\n addFilesToQueue(files) {\n this._queuedFiles = [...files];\n\n this.dispatchEvent(\n new CustomEvent('file-upload:files-added', { detail: files, bubbles: true, composed: true })\n );\n this.onAddedFiles?.();\n\n if (this.autoProcessFiles) {\n this.uploadFiles();\n }\n\n this.fileInput.value = '';\n }\n\n /**\n * Method to upload files.\n */\n uploadFiles() {\n if (this._queuedFiles.length === 0) {\n return;\n }\n\n const uploadPromises = this._queuedFiles.map((file) => this.createUploadPromise(file));\n uploadPromises\n .reduce((prev, curr) => {\n return prev.then(() => {\n return curr;\n });\n }, Promise.resolve())\n .then(() => {\n this.dispatchEvent(\n new CustomEvent('file-upload:all-files-uploaded', {\n detail: this.uploadedFiles,\n bubbles: true,\n composed: true,\n })\n );\n this.onAllFilesUploaded?.();\n this._queuedFiles = [];\n });\n }\n\n /**\n * Method to create an upload promise.\n * @param file\n * @returns {Promise<unknown>}\n */\n createUploadPromise = (file) => {\n return new Promise((resolve, reject) => {\n this.assertFilesValid(file);\n let preview;\n\n let reader = new FileReader();\n reader.onload = (e) => {\n this.dispatchEvent(\n new CustomEvent('file-upload:upload-started', { detail: file, bubbles: true, composed: true })\n );\n this.onUploadStarted?.(file);\n\n preview = this.createPreview(file, reader);\n this.appendChild(preview);\n\n this.uploadFunction(file, preview).then((res) => {\n this.dispatchEvent(\n new CustomEvent('file-upload:upladed-file-complete', {\n detail: res,\n bubbles: true,\n composed: true,\n })\n );\n this.onUploadedFileComplete?.(res);\n this.uploadedFiles.push(res.data);\n\n resolve(res);\n });\n };\n\n reader.readAsDataURL(file);\n });\n };\n\n /**\n * Method to create a preview for the file.\n * @param {File} file The file for which the preview is to be created.\n * @param {FileReader} reader The FileReader instance to read the file.\n * @returns {HTMLElement} The created preview.\n */\n createPreview(file, reader) {\n let preview = document.createElement('wje-file-upload-item');\n preview.setAttribute('slot', 'item');\n preview.setAttribute('name', file.name);\n preview.setAttribute('size', file.size);\n preview.setAttribute('uploaded', '0');\n preview.setAttribute('progress', '0');\n preview.innerHTML = `<wje-icon slot=\"img\" name=\"${getFileTypeIcon(file.type.split('/')[1])}\" size=\"large\"></wje-icon>`;\n\n return preview;\n }\n\n /**\n * Method to create a thumbnail for the file.\n * @param {File} file The file for which the thumbnail is to be created.\n * @param {FileReader} reader The FileReader instance to read the file.\n * @returns {HTMLElement} The created thumbnail.\n */\n createThumbnail(file, reader) {\n let img = document.createElement('img');\n img.setAttribute('src', reader.result);\n\n return img;\n }\n\n /**\n * Method to validate the files.\n * @param {File} file The file to be validated.\n * TODO: alowed types a size limit by malo byt cez attributy\n */\n assertFilesValid(file) {\n const { name: fileName, size: fileSize } = file;\n if (!isValidFileType(file, this.acceptedTypes)) {\n throw new Error(`❌ FILE: \"${fileName}\" Valid file types are: \"${this.acceptedTypes}\"`);\n }\n\n if (fileSize > this.maxFileSize) {\n throw new Error(\n `❌ File \"${fileName}\" could not be uploaded. Only images up to ${this.maxFileSize} MB are allowed. Nie je to ${fileSize}`\n );\n }\n }\n\n /**\n * Method to reset the form state.\n */\n resetFormState() {\n this.fileList.textContent = '';\n }\n}\n","import FileUpload from './file-upload.element.js';\n\nexport default FileUpload;\n\nFileUpload.define('wje-file-upload', FileUpload);\n"],"names":["response","_a"],"mappings":"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"}
@@ -1374,7 +1374,7 @@ class Routerx extends WJElement {
1374
1374
  const rootElement = htmlDocument.querySelector("wje-router");
1375
1375
  const routes = this.parseElement(rootElement).root;
1376
1376
  this.router = new Router2({
1377
- outlet: this.outlet,
1377
+ outlet: this.outlet || "wje-router-outlet",
1378
1378
  log: false,
1379
1379
  logError: true,
1380
1380
  root: this.root || "/",