@acorex/components 7.3.1 → 7.4.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 (441) hide show
  1. package/button/lib/button-group.component.d.ts +10 -73
  2. package/button/lib/button-item.class.d.ts +1 -3
  3. package/button/lib/button-item.component.d.ts +12 -75
  4. package/button/lib/button.component.d.ts +1 -1
  5. package/button-group/README.md +3 -0
  6. package/button-group/index.d.ts +2 -0
  7. package/button-group/lib/button-group.component.d.ts +21 -0
  8. package/button-group/lib/button-group.module.d.ts +8 -0
  9. package/calendar/lib/calendar-range.component.d.ts +2 -1
  10. package/calendar/lib/calendar.class.d.ts +9 -8
  11. package/calendar/lib/calendar.component.d.ts +2 -1
  12. package/check-box/lib/check-box.component.d.ts +3 -2
  13. package/color-box/README.md +3 -0
  14. package/color-box/index.d.ts +2 -0
  15. package/color-box/lib/color-box.component.d.ts +27 -0
  16. package/color-box/lib/color-box.module.d.ts +11 -0
  17. package/common/index.d.ts +6 -5
  18. package/common/lib/classes/styles.class.d.ts +0 -9
  19. package/common/lib/components/button-base-component.class.d.ts +0 -2
  20. package/common/lib/components/interactive-component.class.d.ts +7 -1
  21. package/common/lib/types/direction.d.ts +4 -0
  22. package/common/lib/types/orientation.d.ts +4 -0
  23. package/common/lib/types/placement.d.ts +30 -0
  24. package/common/lib/types/selection-mode.d.ts +4 -0
  25. package/data-pager/lib/data-pager.module.d.ts +5 -4
  26. package/data-table/lib/data-column.directive.d.ts +2 -2
  27. package/datetime-box/README.md +3 -0
  28. package/datetime-box/index.d.ts +2 -0
  29. package/datetime-box/lib/datetime-box.component.d.ts +34 -0
  30. package/datetime-box/lib/datetime-box.module.d.ts +13 -0
  31. package/datetime-input/README.md +3 -0
  32. package/datetime-input/index.d.ts +2 -0
  33. package/datetime-input/lib/datetime-input.component.d.ts +44 -0
  34. package/datetime-input/lib/datetime-input.module.d.ts +10 -0
  35. package/datetime-picker/README.md +3 -0
  36. package/datetime-picker/index.d.ts +2 -0
  37. package/datetime-picker/lib/datetime-picker.component.d.ts +42 -0
  38. package/datetime-picker/lib/datetime-picker.module.d.ts +14 -0
  39. package/decorators/index.d.ts +4 -4
  40. package/decorators/lib/decorators.module.d.ts +4 -4
  41. package/dropdown/index.d.ts +2 -0
  42. package/dropdown/lib/dropdown-box.class.d.ts +15 -0
  43. package/dropdown/lib/dropdown-box.component.d.ts +25 -0
  44. package/dropdown/lib/dropdown-panel.component.d.ts +31 -20
  45. package/dropdown/lib/dropdown.module.d.ts +9 -8
  46. package/esm2022/action-sheet/lib/action-sheet.class.mjs +1 -1
  47. package/esm2022/action-sheet/lib/action-sheet.component.mjs +3 -3
  48. package/esm2022/action-sheet/lib/action-sheet.module.mjs +4 -4
  49. package/esm2022/action-sheet/lib/action-sheet.service.mjs +3 -3
  50. package/esm2022/alert/lib/alert.component.mjs +3 -3
  51. package/esm2022/alert/lib/alert.module.mjs +4 -4
  52. package/esm2022/avatar/lib/avatar-group.component.mjs +3 -3
  53. package/esm2022/avatar/lib/avatar.component.mjs +3 -3
  54. package/esm2022/avatar/lib/avatar.module.mjs +4 -4
  55. package/esm2022/badge/lib/badge.component.mjs +3 -3
  56. package/esm2022/badge/lib/badge.module.mjs +4 -4
  57. package/esm2022/breadcrumbs/lib/breadcrumbs-item.component.mjs +3 -3
  58. package/esm2022/breadcrumbs/lib/breadcrumbs.component.mjs +3 -3
  59. package/esm2022/breadcrumbs/lib/breadcrumbs.module.mjs +4 -4
  60. package/esm2022/button/lib/button-group.component.mjs +36 -29
  61. package/esm2022/button/lib/button-item.class.mjs +1 -1
  62. package/esm2022/button/lib/button-item.component.mjs +46 -32
  63. package/esm2022/button/lib/button.component.mjs +14 -10
  64. package/esm2022/button/lib/button.module.mjs +4 -4
  65. package/esm2022/{color-picker/acorex-components-color-picker.mjs → button-group/acorex-components-button-group.mjs} +1 -1
  66. package/esm2022/button-group/index.mjs +3 -0
  67. package/esm2022/button-group/lib/button-group.component.mjs +97 -0
  68. package/esm2022/button-group/lib/button-group.module.mjs +21 -0
  69. package/esm2022/calendar/lib/calendar-range.component.mjs +14 -13
  70. package/esm2022/calendar/lib/calendar.class.mjs +19 -18
  71. package/esm2022/calendar/lib/calendar.component.mjs +80 -40
  72. package/esm2022/calendar/lib/calendar.module.mjs +4 -4
  73. package/esm2022/check-box/lib/check-box.component.mjs +9 -5
  74. package/esm2022/check-box/lib/check-box.module.mjs +4 -4
  75. package/esm2022/chips/lib/chips.component.mjs +3 -3
  76. package/esm2022/chips/lib/chips.module.mjs +4 -4
  77. package/esm2022/collapse/lib/collapse-group.component.mjs +3 -3
  78. package/esm2022/collapse/lib/collapse.component.mjs +3 -3
  79. package/esm2022/collapse/lib/collapse.module.mjs +4 -4
  80. package/esm2022/color-box/acorex-components-color-box.mjs +5 -0
  81. package/esm2022/color-box/index.mjs +3 -0
  82. package/esm2022/color-box/lib/color-box.component.mjs +91 -0
  83. package/esm2022/color-box/lib/color-box.module.mjs +24 -0
  84. package/esm2022/color-palette/lib/color-palette-input.component.mjs +3 -3
  85. package/esm2022/color-palette/lib/color-palette-picker.component.mjs +13 -13
  86. package/esm2022/color-palette/lib/color-palette-preview.component.mjs +3 -3
  87. package/esm2022/color-palette/lib/color-palette-swatches.component.mjs +3 -3
  88. package/esm2022/color-palette/lib/color-palette.class.mjs +6 -6
  89. package/esm2022/color-palette/lib/color-palette.component.mjs +5 -5
  90. package/esm2022/color-palette/lib/color-palette.module.mjs +4 -4
  91. package/esm2022/common/index.mjs +7 -6
  92. package/esm2022/common/lib/classes/components.class.mjs +22 -22
  93. package/esm2022/common/lib/classes/styles.class.mjs +1 -2
  94. package/esm2022/common/lib/common.module.mjs +4 -4
  95. package/esm2022/common/lib/components/base-component.class.mjs +3 -3
  96. package/esm2022/common/lib/components/button-base-component.class.mjs +4 -18
  97. package/esm2022/common/lib/components/input-base-value-component.class.mjs +3 -3
  98. package/esm2022/common/lib/components/interactive-component.class.mjs +14 -1
  99. package/esm2022/common/lib/components/value-component.class.mjs +6 -6
  100. package/esm2022/common/lib/directives/auto-focus.directive.mjs +3 -3
  101. package/esm2022/common/lib/directives/delayed-value-changed.directive.mjs +3 -3
  102. package/esm2022/common/lib/directives/hotkey.directive.mjs +3 -3
  103. package/esm2022/common/lib/directives/infinite-scroll.directive.mjs +3 -3
  104. package/esm2022/common/lib/directives/responsive.directive.mjs +3 -3
  105. package/esm2022/common/lib/services/dom.service.mjs +3 -3
  106. package/esm2022/common/lib/services/hotkey.service.mjs +3 -3
  107. package/esm2022/common/lib/types/direction.mjs +2 -0
  108. package/esm2022/common/lib/types/orientation.mjs +2 -0
  109. package/esm2022/common/lib/types/placement.mjs +160 -0
  110. package/esm2022/common/lib/types/range.mjs +2 -0
  111. package/esm2022/common/lib/types/selection-mode.mjs +5 -0
  112. package/esm2022/context-menu/lib/context-menu.component.mjs +3 -3
  113. package/esm2022/context-menu/lib/context-menu.module.mjs +4 -4
  114. package/esm2022/data-pager/lib/data-pager-base.component.mjs +6 -6
  115. package/esm2022/data-pager/lib/data-pager-info.component.mjs +3 -3
  116. package/esm2022/data-pager/lib/data-pager-input-selector.component.mjs +3 -3
  117. package/esm2022/data-pager/lib/data-pager-next-buttons.components.mjs +4 -4
  118. package/esm2022/data-pager/lib/data-pager-numeric-selector.component.mjs +15 -18
  119. package/esm2022/data-pager/lib/data-pager-pagesize-dropdown.component.mjs +7 -7
  120. package/esm2022/data-pager/lib/data-pager-prev-buttons.component.mjs +4 -4
  121. package/esm2022/data-pager/lib/data-pager.component.mjs +5 -5
  122. package/esm2022/data-pager/lib/data-pager.module.mjs +8 -7
  123. package/esm2022/data-table/lib/data-column.directive.mjs +6 -8
  124. package/esm2022/data-table/lib/data-table.component.mjs +3 -3
  125. package/esm2022/data-table/lib/data-table.module.mjs +4 -4
  126. package/esm2022/datetime-box/acorex-components-datetime-box.mjs +5 -0
  127. package/esm2022/datetime-box/index.mjs +3 -0
  128. package/esm2022/datetime-box/lib/datetime-box.component.mjs +109 -0
  129. package/esm2022/datetime-box/lib/datetime-box.module.mjs +38 -0
  130. package/esm2022/datetime-input/acorex-components-datetime-input.mjs +5 -0
  131. package/esm2022/datetime-input/index.mjs +3 -0
  132. package/esm2022/datetime-input/lib/datetime-input.component.mjs +522 -0
  133. package/esm2022/datetime-input/lib/datetime-input.module.mjs +23 -0
  134. package/esm2022/datetime-picker/acorex-components-datetime-picker.mjs +5 -0
  135. package/esm2022/datetime-picker/index.mjs +3 -0
  136. package/esm2022/datetime-picker/lib/datetime-picker.component.mjs +232 -0
  137. package/esm2022/datetime-picker/lib/datetime-picker.module.mjs +41 -0
  138. package/esm2022/decorators/index.mjs +5 -5
  139. package/esm2022/decorators/lib/components/clear-button.component.mjs +58 -0
  140. package/esm2022/decorators/lib/components/close-button.component.mjs +43 -0
  141. package/esm2022/decorators/lib/components/generic-content.component.mjs +17 -0
  142. package/esm2022/decorators/lib/components/icon.component.mjs +26 -0
  143. package/esm2022/decorators/lib/decorators.module.mjs +10 -10
  144. package/esm2022/dialog/lib/dialog.component.mjs +4 -4
  145. package/esm2022/dialog/lib/dialog.module.mjs +4 -4
  146. package/esm2022/dialog/lib/dialog.service.mjs +3 -3
  147. package/esm2022/drawer/lib/drawer-container.component.mjs +3 -3
  148. package/esm2022/drawer/lib/drawer.component.mjs +3 -3
  149. package/esm2022/drawer/lib/drawer.module.mjs +4 -4
  150. package/esm2022/dropdown/index.mjs +3 -1
  151. package/esm2022/dropdown/lib/dropdown-box.class.mjs +38 -0
  152. package/esm2022/dropdown/lib/dropdown-box.component.mjs +94 -0
  153. package/esm2022/dropdown/lib/dropdown-panel.component.mjs +88 -37
  154. package/esm2022/dropdown/lib/dropdown.module.mjs +8 -7
  155. package/esm2022/form/index.mjs +2 -1
  156. package/esm2022/form/lib/form-field.component.mjs +3 -3
  157. package/esm2022/form/lib/form.component.mjs +3 -3
  158. package/esm2022/form/lib/form.config.mjs +36 -0
  159. package/esm2022/form/lib/form.module.mjs +6 -28
  160. package/esm2022/form/lib/validation-rule.widget.mjs +8 -7
  161. package/esm2022/form/lib/validation-summary.component.mjs +4 -4
  162. package/esm2022/image/lib/image.component.mjs +3 -3
  163. package/esm2022/image/lib/image.module.mjs +4 -4
  164. package/esm2022/label/lib/label.component.mjs +3 -3
  165. package/esm2022/label/lib/label.module.mjs +4 -4
  166. package/esm2022/loading/lib/loading-spinner.component.mjs +3 -3
  167. package/esm2022/loading/lib/loading.component.mjs +6 -6
  168. package/esm2022/loading/lib/loading.directive.mjs +20 -51
  169. package/esm2022/loading/lib/loading.module.mjs +6 -6
  170. package/esm2022/loading/lib/loading.service.mjs +36 -28
  171. package/esm2022/menu/lib/menu.component.mjs +3 -3
  172. package/esm2022/menu/lib/menu.module.mjs +4 -4
  173. package/esm2022/mixin/index.mjs +1 -2
  174. package/esm2022/mixin/lib/base-components.class.mjs +3 -3
  175. package/esm2022/mixin/lib/selection-component.class.mjs +3 -3
  176. package/esm2022/mixin/lib/value-mixin.class.mjs +3 -3
  177. package/esm2022/notification/lib/notification.component.mjs +3 -3
  178. package/esm2022/notification/lib/notification.module.mjs +4 -4
  179. package/esm2022/notification/lib/notification.service.mjs +3 -3
  180. package/esm2022/number-box/lib/number-box.component.mjs +3 -3
  181. package/esm2022/number-box/lib/number-box.module.mjs +4 -4
  182. package/esm2022/otp/lib/otp.component.mjs +23 -11
  183. package/esm2022/otp/lib/otp.module.mjs +4 -4
  184. package/esm2022/page/lib/base-page.class.mjs +20 -21
  185. package/esm2022/page/lib/page.component.mjs +13 -13
  186. package/esm2022/page/lib/page.module.mjs +4 -4
  187. package/esm2022/password-box/lib/password-box.component.mjs +3 -3
  188. package/esm2022/password-box/lib/password-box.module.mjs +4 -4
  189. package/esm2022/picker/acorex-components-picker.mjs +5 -0
  190. package/esm2022/picker/index.mjs +4 -0
  191. package/esm2022/picker/lib/picker-column.directive.mjs +73 -0
  192. package/esm2022/picker/lib/picker.component.mjs +148 -0
  193. package/esm2022/picker/lib/picker.module.mjs +22 -0
  194. package/esm2022/popover/index.mjs +1 -2
  195. package/esm2022/popover/lib/popover.component.mjs +270 -166
  196. package/esm2022/popover/lib/popover.module.mjs +4 -4
  197. package/esm2022/popup/lib/popup.component.mjs +40 -15
  198. package/esm2022/popup/lib/popup.module.mjs +6 -6
  199. package/esm2022/popup/lib/popup.service.mjs +9 -6
  200. package/esm2022/progress-bar/lib/progress-bar.component.mjs +9 -13
  201. package/esm2022/progress-bar/lib/progress-bar.module.mjs +4 -4
  202. package/esm2022/radio/lib/radio.component.mjs +36 -21
  203. package/esm2022/radio/lib/radio.module.mjs +4 -4
  204. package/esm2022/range-slider/lib/range-slider.component.mjs +21 -34
  205. package/esm2022/range-slider/lib/range-slider.module.mjs +4 -4
  206. package/esm2022/result/lib/result.component.mjs +6 -6
  207. package/esm2022/result/lib/result.module.mjs +4 -4
  208. package/esm2022/scheduler/index.mjs +2 -1
  209. package/esm2022/scheduler/lib/scheduler-month-view.component.mjs +16 -9
  210. package/esm2022/scheduler/lib/scheduler-week-view.component.mjs +12 -0
  211. package/esm2022/scheduler/lib/scheduler.component.mjs +27 -14
  212. package/esm2022/scheduler/lib/scheduler.module.mjs +10 -9
  213. package/esm2022/search-box/lib/search-box.component.mjs +3 -3
  214. package/esm2022/search-box/lib/search-box.module.mjs +4 -4
  215. package/esm2022/select-box/lib/select-box.component.mjs +7 -7
  216. package/esm2022/select-box/lib/select-box.module.mjs +4 -4
  217. package/esm2022/selection-list/lib/selection-list.component.mjs +3 -3
  218. package/esm2022/selection-list/lib/selection-list.module.mjs +4 -4
  219. package/esm2022/switch/lib/switch-content.component.mjs +3 -3
  220. package/esm2022/switch/lib/switch.component.mjs +3 -3
  221. package/esm2022/switch/lib/switch.module.mjs +4 -4
  222. package/esm2022/tabs/lib/tab-content.directive.mjs +3 -3
  223. package/esm2022/tabs/lib/tab-item.component.mjs +23 -53
  224. package/esm2022/tabs/lib/tabs.class.mjs +1 -1
  225. package/esm2022/tabs/lib/tabs.component.mjs +19 -28
  226. package/esm2022/tabs/lib/tabs.module.mjs +4 -4
  227. package/esm2022/tag/lib/tag.component.mjs +8 -10
  228. package/esm2022/tag/lib/tag.module.mjs +4 -4
  229. package/esm2022/text-area/lib/text-area.component.mjs +3 -3
  230. package/esm2022/text-area/lib/text-area.module.mjs +4 -4
  231. package/esm2022/text-box/lib/mask-options.directive.mjs +3 -3
  232. package/esm2022/text-box/lib/text-box.component.mjs +3 -3
  233. package/esm2022/text-box/lib/text-box.module.mjs +4 -4
  234. package/esm2022/toast/lib/toast.component.mjs +3 -3
  235. package/esm2022/toast/lib/toast.config.mjs +9 -3
  236. package/esm2022/toast/lib/toast.module.mjs +10 -6
  237. package/esm2022/toast/lib/toast.service.mjs +3 -3
  238. package/esm2022/tooltip/lib/tooltip.component.mjs +9 -13
  239. package/esm2022/tooltip/lib/tooltip.directive.mjs +35 -143
  240. package/esm2022/tooltip/lib/tooltip.module.mjs +4 -4
  241. package/esm2022/uploader/index.mjs +4 -2
  242. package/esm2022/uploader/lib/uploader-drop-zone.component.mjs +13 -0
  243. package/esm2022/uploader/lib/uploader-list.component.mjs +14 -0
  244. package/esm2022/uploader/lib/uploader-overlay.component.mjs +12 -0
  245. package/esm2022/uploader/lib/uploader.module.mjs +14 -11
  246. package/fesm2022/acorex-components-action-sheet.mjs +10 -10
  247. package/fesm2022/acorex-components-alert.mjs +7 -7
  248. package/fesm2022/acorex-components-avatar.mjs +10 -10
  249. package/fesm2022/acorex-components-badge.mjs +7 -7
  250. package/fesm2022/acorex-components-breadcrumbs.mjs +10 -10
  251. package/fesm2022/acorex-components-button-group.mjs +122 -0
  252. package/fesm2022/acorex-components-button-group.mjs.map +1 -0
  253. package/fesm2022/acorex-components-button.mjs +138 -116
  254. package/fesm2022/acorex-components-button.mjs.map +1 -1
  255. package/fesm2022/acorex-components-calendar.mjs +110 -68
  256. package/fesm2022/acorex-components-calendar.mjs.map +1 -1
  257. package/fesm2022/acorex-components-check-box.mjs +12 -8
  258. package/fesm2022/acorex-components-check-box.mjs.map +1 -1
  259. package/fesm2022/acorex-components-chips.mjs +7 -7
  260. package/fesm2022/acorex-components-collapse.mjs +10 -10
  261. package/fesm2022/acorex-components-color-box.mjs +116 -0
  262. package/fesm2022/acorex-components-color-box.mjs.map +1 -0
  263. package/fesm2022/acorex-components-color-palette.mjs +36 -36
  264. package/fesm2022/acorex-components-color-palette.mjs.map +1 -1
  265. package/fesm2022/acorex-components-common.mjs +238 -301
  266. package/fesm2022/acorex-components-common.mjs.map +1 -1
  267. package/fesm2022/acorex-components-context-menu.mjs +7 -7
  268. package/fesm2022/acorex-components-data-pager.mjs +52 -54
  269. package/fesm2022/acorex-components-data-pager.mjs.map +1 -1
  270. package/fesm2022/acorex-components-data-table.mjs +12 -14
  271. package/fesm2022/acorex-components-data-table.mjs.map +1 -1
  272. package/fesm2022/acorex-components-datetime-box.mjs +146 -0
  273. package/fesm2022/acorex-components-datetime-box.mjs.map +1 -0
  274. package/fesm2022/acorex-components-datetime-input.mjs +547 -0
  275. package/fesm2022/acorex-components-datetime-input.mjs.map +1 -0
  276. package/fesm2022/acorex-components-datetime-picker.mjs +273 -0
  277. package/fesm2022/acorex-components-datetime-picker.mjs.map +1 -0
  278. package/fesm2022/acorex-components-decorators.mjs +50 -50
  279. package/fesm2022/acorex-components-decorators.mjs.map +1 -1
  280. package/fesm2022/acorex-components-dialog.mjs +11 -11
  281. package/fesm2022/acorex-components-dialog.mjs.map +1 -1
  282. package/fesm2022/acorex-components-drawer.mjs +10 -10
  283. package/fesm2022/acorex-components-dropdown.mjs +217 -44
  284. package/fesm2022/acorex-components-dropdown.mjs.map +1 -1
  285. package/fesm2022/acorex-components-form.mjs +58 -44
  286. package/fesm2022/acorex-components-form.mjs.map +1 -1
  287. package/fesm2022/acorex-components-image.mjs +7 -7
  288. package/fesm2022/acorex-components-label.mjs +7 -7
  289. package/fesm2022/acorex-components-loading.mjs +93 -116
  290. package/fesm2022/acorex-components-loading.mjs.map +1 -1
  291. package/fesm2022/acorex-components-menu.mjs +7 -7
  292. package/fesm2022/acorex-components-mixin.mjs +7 -26
  293. package/fesm2022/acorex-components-mixin.mjs.map +1 -1
  294. package/fesm2022/acorex-components-notification.mjs +10 -10
  295. package/fesm2022/acorex-components-notification.mjs.map +1 -1
  296. package/fesm2022/acorex-components-number-box.mjs +7 -7
  297. package/fesm2022/acorex-components-otp.mjs +27 -15
  298. package/fesm2022/acorex-components-otp.mjs.map +1 -1
  299. package/fesm2022/acorex-components-page.mjs +55 -56
  300. package/fesm2022/acorex-components-page.mjs.map +1 -1
  301. package/fesm2022/acorex-components-password-box.mjs +7 -7
  302. package/fesm2022/acorex-components-picker.mjs +242 -0
  303. package/fesm2022/acorex-components-picker.mjs.map +1 -0
  304. package/fesm2022/acorex-components-popover.mjs +275 -241
  305. package/fesm2022/acorex-components-popover.mjs.map +1 -1
  306. package/fesm2022/acorex-components-popup.mjs +52 -24
  307. package/fesm2022/acorex-components-popup.mjs.map +1 -1
  308. package/fesm2022/acorex-components-progress-bar.mjs +12 -16
  309. package/fesm2022/acorex-components-progress-bar.mjs.map +1 -1
  310. package/fesm2022/acorex-components-radio.mjs +39 -25
  311. package/fesm2022/acorex-components-radio.mjs.map +1 -1
  312. package/fesm2022/acorex-components-range-slider.mjs +24 -37
  313. package/fesm2022/acorex-components-range-slider.mjs.map +1 -1
  314. package/fesm2022/acorex-components-result.mjs +9 -9
  315. package/fesm2022/acorex-components-result.mjs.map +1 -1
  316. package/fesm2022/acorex-components-scheduler.mjs +50 -25
  317. package/fesm2022/acorex-components-scheduler.mjs.map +1 -1
  318. package/fesm2022/acorex-components-search-box.mjs +7 -7
  319. package/fesm2022/acorex-components-select-box.mjs +10 -10
  320. package/fesm2022/acorex-components-select-box.mjs.map +1 -1
  321. package/fesm2022/acorex-components-selection-list.mjs +7 -7
  322. package/fesm2022/acorex-components-switch.mjs +10 -10
  323. package/fesm2022/acorex-components-tabs.mjs +45 -85
  324. package/fesm2022/acorex-components-tabs.mjs.map +1 -1
  325. package/fesm2022/acorex-components-tag.mjs +11 -13
  326. package/fesm2022/acorex-components-tag.mjs.map +1 -1
  327. package/fesm2022/acorex-components-text-area.mjs +7 -7
  328. package/fesm2022/acorex-components-text-box.mjs +10 -10
  329. package/fesm2022/acorex-components-toast.mjs +23 -13
  330. package/fesm2022/acorex-components-toast.mjs.map +1 -1
  331. package/fesm2022/acorex-components-tooltip.mjs +45 -157
  332. package/fesm2022/acorex-components-tooltip.mjs.map +1 -1
  333. package/fesm2022/acorex-components-uploader.mjs +38 -103
  334. package/fesm2022/acorex-components-uploader.mjs.map +1 -1
  335. package/form/index.d.ts +1 -0
  336. package/form/lib/form.config.d.ts +17 -0
  337. package/form/lib/form.module.d.ts +0 -1
  338. package/form/lib/validation-rule.widget.d.ts +1 -0
  339. package/loading/lib/loading.directive.d.ts +10 -17
  340. package/loading/lib/loading.module.d.ts +1 -1
  341. package/loading/lib/loading.service.d.ts +10 -15
  342. package/mixin/index.d.ts +0 -1
  343. package/mixin/lib/base-components.class.d.ts +2 -2
  344. package/mixin/lib/base-menu-mixin.class.d.ts +5 -5
  345. package/mixin/lib/button-mixin.class.d.ts +2 -2
  346. package/mixin/lib/clickable-mixin.class.d.ts +2 -2
  347. package/mixin/lib/color-look-mixing.class.d.ts +2 -2
  348. package/mixin/lib/datalist-component.class.d.ts +10 -10
  349. package/mixin/lib/dropdown-mixin.class.d.ts +2 -2
  350. package/mixin/lib/interactive-mixin.class.d.ts +4 -4
  351. package/mixin/lib/mixin.class.d.ts +61 -61
  352. package/mixin/lib/page-component.class.d.ts +2 -2
  353. package/mixin/lib/selection-component.class.d.ts +2 -2
  354. package/mixin/lib/sizable-mixin.class.d.ts +2 -2
  355. package/mixin/lib/textbox-mixin.class.d.ts +2 -2
  356. package/mixin/lib/value-mixin.class.d.ts +8 -8
  357. package/otp/lib/otp.component.d.ts +10 -6
  358. package/package.json +56 -41
  359. package/page/lib/base-page.class.d.ts +6 -10
  360. package/page/lib/page.component.d.ts +4 -4
  361. package/picker/README.md +3 -0
  362. package/picker/index.d.ts +3 -0
  363. package/picker/lib/picker-column.directive.d.ts +16 -0
  364. package/picker/lib/picker.component.d.ts +30 -0
  365. package/picker/lib/picker.module.d.ts +9 -0
  366. package/popover/index.d.ts +0 -1
  367. package/popover/lib/popover.component.d.ts +51 -27
  368. package/popup/lib/popup.component.d.ts +6 -6
  369. package/progress-bar/lib/progress-bar.component.d.ts +3 -8
  370. package/radio/lib/radio.component.d.ts +8 -10
  371. package/range-slider/lib/range-slider.component.d.ts +12 -12
  372. package/result/lib/result.component.d.ts +2 -2
  373. package/scheduler/index.d.ts +1 -0
  374. package/scheduler/lib/scheduler-month-view.component.d.ts +2 -1
  375. package/scheduler/lib/scheduler-week-view.component.d.ts +6 -0
  376. package/scheduler/lib/scheduler.component.d.ts +6 -0
  377. package/scheduler/lib/scheduler.module.d.ts +7 -6
  378. package/tabs/lib/tab-item.component.d.ts +7 -38
  379. package/tabs/lib/tabs.class.d.ts +2 -1
  380. package/tabs/lib/tabs.component.d.ts +7 -9
  381. package/tag/lib/tag.component.d.ts +2 -4
  382. package/tooltip/lib/tooltip.component.d.ts +3 -6
  383. package/tooltip/lib/tooltip.directive.d.ts +11 -17
  384. package/uploader/index.d.ts +3 -1
  385. package/uploader/lib/uploader-drop-zone.component.d.ts +6 -0
  386. package/uploader/lib/uploader-list.component.d.ts +6 -0
  387. package/uploader/lib/uploader-overlay.component.d.ts +6 -0
  388. package/uploader/lib/uploader.module.d.ts +7 -4
  389. package/color-picker/README.md +0 -3
  390. package/color-picker/index.d.ts +0 -2
  391. package/color-picker/lib/color-picker.component.d.ts +0 -191
  392. package/color-picker/lib/color-picker.module.d.ts +0 -18
  393. package/common/lib/classes/drawing.class.d.ts +0 -9
  394. package/common/lib/constant/positions.d.ts +0 -75
  395. package/common/lib/services/custom-cdk-overlay.service.d.ts +0 -19
  396. package/common/lib/services/overlay.service.d.ts +0 -34
  397. package/date-picker/README.md +0 -3
  398. package/date-picker/index.d.ts +0 -2
  399. package/date-picker/lib/datepicker.component.d.ts +0 -40
  400. package/date-picker/lib/datepicker.module.d.ts +0 -15
  401. package/esm2022/color-picker/index.mjs +0 -3
  402. package/esm2022/color-picker/lib/color-picker.component.mjs +0 -116
  403. package/esm2022/color-picker/lib/color-picker.module.mjs +0 -61
  404. package/esm2022/common/lib/classes/data.class.mjs +0 -2
  405. package/esm2022/common/lib/classes/drawing.class.mjs +0 -2
  406. package/esm2022/common/lib/constant/positions.mjs +0 -75
  407. package/esm2022/common/lib/services/custom-cdk-overlay.service.mjs +0 -49
  408. package/esm2022/common/lib/services/overlay.service.mjs +0 -113
  409. package/esm2022/date-picker/acorex-components-date-picker.mjs +0 -5
  410. package/esm2022/date-picker/index.mjs +0 -3
  411. package/esm2022/date-picker/lib/datepicker.component.mjs +0 -128
  412. package/esm2022/date-picker/lib/datepicker.module.mjs +0 -44
  413. package/esm2022/decorators/lib/clear-button.component.mjs +0 -58
  414. package/esm2022/decorators/lib/close-button.component.mjs +0 -43
  415. package/esm2022/decorators/lib/generic-content.component.mjs +0 -17
  416. package/esm2022/decorators/lib/icon.component.mjs +0 -26
  417. package/esm2022/mixin/lib/loading-mixin.class.mjs +0 -18
  418. package/esm2022/popover/lib/dropdown-component.class.mjs +0 -73
  419. package/esm2022/time-box/acorex-components-time-box.mjs +0 -5
  420. package/esm2022/time-box/index.mjs +0 -3
  421. package/esm2022/time-box/lib/time-box.component.mjs +0 -294
  422. package/esm2022/time-box/lib/time-box.module.mjs +0 -32
  423. package/esm2022/uploader/lib/uploader.component.mjs +0 -99
  424. package/fesm2022/acorex-components-color-picker.mjs +0 -178
  425. package/fesm2022/acorex-components-color-picker.mjs.map +0 -1
  426. package/fesm2022/acorex-components-date-picker.mjs +0 -173
  427. package/fesm2022/acorex-components-date-picker.mjs.map +0 -1
  428. package/fesm2022/acorex-components-time-box.mjs +0 -329
  429. package/fesm2022/acorex-components-time-box.mjs.map +0 -1
  430. package/mixin/lib/loading-mixin.class.d.ts +0 -40
  431. package/popover/lib/dropdown-component.class.d.ts +0 -17
  432. package/time-box/README.md +0 -3
  433. package/time-box/index.d.ts +0 -2
  434. package/time-box/lib/time-box.component.d.ts +0 -50
  435. package/time-box/lib/time-box.module.d.ts +0 -11
  436. package/uploader/lib/uploader.component.d.ts +0 -28
  437. /package/common/lib/{classes/data.class.d.ts → types/range.d.ts} +0 -0
  438. /package/decorators/lib/{clear-button.component.d.ts → components/clear-button.component.d.ts} +0 -0
  439. /package/decorators/lib/{close-button.component.d.ts → components/close-button.component.d.ts} +0 -0
  440. /package/decorators/lib/{generic-content.component.d.ts → components/generic-content.component.d.ts} +0 -0
  441. /package/decorators/lib/{icon.component.d.ts → components/icon.component.d.ts} +0 -0
@@ -1,21 +1,25 @@
1
1
  import { MXBaseComponent } from '@acorex/components/common';
2
- import { AXDateTimeRange, AXDateTime, AXDateTimeModule } from '@acorex/core/dateTime';
2
+ import { AXDateTimeRange, AXCalendarService, AXDateTimeModule } from '@acorex/core/dateTime';
3
+ import { AXPlatform } from '@acorex/core/platform';
3
4
  import * as i0 from '@angular/core';
4
- import { Component, ChangeDetectionStrategy, ViewEncapsulation, Input, NgModule } from '@angular/core';
5
+ import { inject, Component, ChangeDetectionStrategy, ViewEncapsulation, Input, NgModule } from '@angular/core';
5
6
  import * as i1 from '@angular/common';
6
7
  import { CommonModule } from '@angular/common';
7
- import * as i1$1 from '@acorex/components/button';
8
+ import * as i2 from '@acorex/components/button';
8
9
  import { AXButtonModule } from '@acorex/components/button';
9
- import * as i2 from '@acorex/components/decorators';
10
+ import * as i3 from '@acorex/components/decorators';
10
11
  import { AXDecoratorModule } from '@acorex/components/decorators';
11
- import * as i3 from '@acorex/components/dropdown';
12
+ import * as i4 from '@acorex/components/dropdown';
12
13
  import { AXDropdownModule } from '@acorex/components/dropdown';
13
14
 
14
15
  class AXSchedulerMonthViewComponent extends MXBaseComponent {
15
16
  constructor() {
16
17
  super(...arguments);
18
+ this._platform = inject(AXPlatform);
17
19
  this._slots = [];
18
- this._dayNames = [];
20
+ }
21
+ get dayNames() {
22
+ return this._platform.is('SM') ? this.date.calendar.dayNames.map(c => c.letter) : this.date.calendar.dayNames.map(c => c.short);
19
23
  }
20
24
  get date() {
21
25
  return this._date;
@@ -26,10 +30,11 @@ class AXSchedulerMonthViewComponent extends MXBaseComponent {
26
30
  }
27
31
  ngOnInit() {
28
32
  this.generateSlots();
29
- this._dayNames = this.date.calendar.dayShortNames;
33
+ this._platform.resize.subscribe((c) => {
34
+ this.cdr.markForCheck();
35
+ });
30
36
  }
31
37
  generateSlots() {
32
- debugger;
33
38
  const startDate = this.date.startOf('month').startOf('week');
34
39
  const endDate = this.date.endOf('month').endOf('week');
35
40
  const range = new AXDateTimeRange(startDate, endDate).enumurate('day');
@@ -41,46 +46,66 @@ class AXSchedulerMonthViewComponent extends MXBaseComponent {
41
46
  isToday: c.dayOfYear == this.date.dayOfYear,
42
47
  }));
43
48
  }
44
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.7", ngImport: i0, type: AXSchedulerMonthViewComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
45
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.7", type: AXSchedulerMonthViewComponent, selector: "ax-scheduler-month-view", inputs: { date: "date" }, usesInheritance: true, ngImport: i0, template: "<div class=\"ax-flex ax-flex-col ax-flex-1\">\n <div class=\"ax-flex ax-bg-neutral-200 ax-border-b\">\n <div class=\"ax-grid ax-grid-cols-7 ax-gap-[1px] ax-w-full\">\n <ng-container *ngFor=\"let item of _dayNames\">\n <div class=\"ax-flex ax-items-center ax-justify-center ax-py-2 ax-bg-white\">\n {{item}}\n </div>\n </ng-container>\n </div>\n </div>\n <div class=\"ax-flex ax-flex-1 ax-bg-neutral-200\">\n <div class=\"ax-grid ax-grid-cols-7 ax-gap-[1px] ax-w-full\">\n <ng-container *ngFor=\"let item of _slots\">\n <div class=\"ax-py-2 ax-px-3 ax-bg-white\" [ngClass]=\"item.cssClass\">\n <time class=\"ax-text-sm ax-flex ax-items-center ax-justify-center ax-rounded-full ax-w-6 ax-h-6\"\n [class.ax-bg-primary-500]=\"item.isToday\" [class.ax-text-white]=\"item.isToday\"\n datetime=\"item.date.format('dd')\">{{item.date.format('d')}}</time>\n </div>\n </ng-container>\n </div>\n </div>\n</div>", dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
49
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.9", ngImport: i0, type: AXSchedulerMonthViewComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
50
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.9", type: AXSchedulerMonthViewComponent, selector: "ax-scheduler-month-view", inputs: { date: "date" }, usesInheritance: true, ngImport: i0, template: "<div class=\"ax-flex ax-flex-col ax-flex-auto ax-shadow-md\">\n <div class=\"ax-grid ax-grid-cols-7 ax-gap-[1px] ax-w-full ax-bg-neutral-200 ax-border-b\">\n <ng-container *ngFor=\"let item of dayNames\">\n <div class=\"ax-flex ax-items-center ax-justify-center ax-py-2 ax-bg-white ax-font-medium\">\n {{item}}\n </div>\n </ng-container>\n </div>\n <div class=\"ax-flex ax-flex-auto ax-bg-neutral-200\">\n <div class=\"ax-grid ax-grid-cols-7 ax-gap-[1px] ax-w-full\">\n <ng-container *ngFor=\"let item of _slots\">\n <div class=\"ax-py-2 ax-px-3 ax-bg-white ax-cursor-pointer hover:ax-bg-neutral-100\n ax-flex ax-flex-col ax-justify-between\" [ngClass]=\"item.cssClass\">\n <time class=\"ax-text-sm ax-flex ax-items-center ax-justify-center ax-rounded-full ax-w-6 ax-h-6\"\n [class.ax-bg-primary-500]=\"item.isToday\" [class.ax-text-white]=\"item.isToday\"\n datetime=\"item.date.format('dd')\">{{item.date.format('d')}}</time>\n <ol class=\"ax-mt-2 ax-hidden lg:ax-flex ax-flex-col ax-gap-1\">\n <li *ngIf=\"item.date.dayOfMonth % 6 === 0\">\n <a href=\"#\"\n class=\"ax-flex ax-justify-between ax-text-sm ax-bg-primary-500 ax-py-1 ax-px-2 ax-rounded ax-text-primary-fore\">\n <p class=\"ax-text-sm\">Launch Time</p>\n <time class=\"ax-ms-3\" datetime=\"item.date.format('HH A')\">\n {{item.date.format('hh A')}}\n </time>\n </a>\n </li>\n <li *ngIf=\"item.date.dayOfMonth % 5 === 0\">\n <a href=\"#\"\n class=\"ax-flex ax-justify-between ax-text-sm ax-bg-success-500 ax-py-1 ax-px-2 ax-rounded ax-text-success-fore\">\n <p class=\"ax-text-sm\">Daily meeting</p>\n <time class=\"ax-ms-3\" datetime=\"item.date.format('HH A')\">\n {{item.date.format('hh A')}}\n </time>\n </a>\n </li>\n </ol>\n <ol class=\"ax-flex ax-gap-1 ax-self-center md:ax-hidden\">\n <li *ngIf=\"item.date.dayOfMonth % 5 === 0\">\n <span\n class=\"ax-flex ax-w-1.5 ax-h-1.5 ax-rounded-full ax-bg-primary-500 lg:ax-hidden\"></span>\n </li>\n <li *ngIf=\"item.date.dayOfMonth % 6 === 0\">\n <span\n class=\"ax-flex ax-w-1.5 ax-h-1.5 ax-rounded-full ax-bg-danger-500 lg:ax-hidden\"></span>\n </li>\n <li *ngIf=\"item.date.dayOfMonth % 8 === 0\">\n <span\n class=\"ax-flex ax-w-1.5 ax-h-1.5 ax-rounded-full ax-bg-warning-500 lg:ax-hidden\"></span>\n </li>\n <li *ngIf=\"item.date.dayOfMonth % 3 === 0\">\n <span\n class=\"ax-flex ax-w-1.5 ax-h-1.5 ax-rounded-full ax-bg-success-500 lg:ax-hidden\"></span>\n </li>\n </ol>\n </div>\n </ng-container>\n </div>\n </div>\n</div>\n<div class=\"ax-p-4 lg:ax-hidden\">\n <ol\n class=\"ax-flex ax-flex-col ax-rounded-lg ax-border ax-bg-surface ax-divide-y ax-overflow-hidden ax-cursor-pointer\">\n <li class=\"ax-flex ax-items-start ax-justify-between ax-p-4 hover:ax-bg-neutral-100 mobile-task\">\n <div class=\"ax-flex ax-flex-col ax-gap-2\">\n <p class=\"ax-font-medium\">Daily Meeting at the Office</p>\n <div class=\"ax-flex ax-gap-2 ax-items-center\">\n <ax-icon class=\"fa-solid fa-clock ax-text-neutral-400\"></ax-icon>\n <p class=\"ax-text-sm\">3 PM</p>\n </div>\n </div>\n <ax-button text=\"Edit\" class=\"!ax-bg-surface ax-border ax-sm ax-opacity-0\"></ax-button>\n </li>\n </ol>\n</div>", dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i2.AXButtonComponent, selector: "ax-button", inputs: ["disabled", "size", "tabIndex", "color", "look", "text", "toggleable", "selected", "type"], outputs: ["onBlur", "onFocus", "onClick", "selectedChange", "toggleableChange", "lookChange", "colorChange", "disabledChange"] }, { kind: "component", type: i3.AXDecoratorIconComponent, selector: "ax-icon", inputs: ["icon"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
46
51
  }
47
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.7", ngImport: i0, type: AXSchedulerMonthViewComponent, decorators: [{
52
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.9", ngImport: i0, type: AXSchedulerMonthViewComponent, decorators: [{
48
53
  type: Component,
49
- args: [{ selector: 'ax-scheduler-month-view', changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, template: "<div class=\"ax-flex ax-flex-col ax-flex-1\">\n <div class=\"ax-flex ax-bg-neutral-200 ax-border-b\">\n <div class=\"ax-grid ax-grid-cols-7 ax-gap-[1px] ax-w-full\">\n <ng-container *ngFor=\"let item of _dayNames\">\n <div class=\"ax-flex ax-items-center ax-justify-center ax-py-2 ax-bg-white\">\n {{item}}\n </div>\n </ng-container>\n </div>\n </div>\n <div class=\"ax-flex ax-flex-1 ax-bg-neutral-200\">\n <div class=\"ax-grid ax-grid-cols-7 ax-gap-[1px] ax-w-full\">\n <ng-container *ngFor=\"let item of _slots\">\n <div class=\"ax-py-2 ax-px-3 ax-bg-white\" [ngClass]=\"item.cssClass\">\n <time class=\"ax-text-sm ax-flex ax-items-center ax-justify-center ax-rounded-full ax-w-6 ax-h-6\"\n [class.ax-bg-primary-500]=\"item.isToday\" [class.ax-text-white]=\"item.isToday\"\n datetime=\"item.date.format('dd')\">{{item.date.format('d')}}</time>\n </div>\n </ng-container>\n </div>\n </div>\n</div>" }]
54
+ args: [{ selector: 'ax-scheduler-month-view', changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, template: "<div class=\"ax-flex ax-flex-col ax-flex-auto ax-shadow-md\">\n <div class=\"ax-grid ax-grid-cols-7 ax-gap-[1px] ax-w-full ax-bg-neutral-200 ax-border-b\">\n <ng-container *ngFor=\"let item of dayNames\">\n <div class=\"ax-flex ax-items-center ax-justify-center ax-py-2 ax-bg-white ax-font-medium\">\n {{item}}\n </div>\n </ng-container>\n </div>\n <div class=\"ax-flex ax-flex-auto ax-bg-neutral-200\">\n <div class=\"ax-grid ax-grid-cols-7 ax-gap-[1px] ax-w-full\">\n <ng-container *ngFor=\"let item of _slots\">\n <div class=\"ax-py-2 ax-px-3 ax-bg-white ax-cursor-pointer hover:ax-bg-neutral-100\n ax-flex ax-flex-col ax-justify-between\" [ngClass]=\"item.cssClass\">\n <time class=\"ax-text-sm ax-flex ax-items-center ax-justify-center ax-rounded-full ax-w-6 ax-h-6\"\n [class.ax-bg-primary-500]=\"item.isToday\" [class.ax-text-white]=\"item.isToday\"\n datetime=\"item.date.format('dd')\">{{item.date.format('d')}}</time>\n <ol class=\"ax-mt-2 ax-hidden lg:ax-flex ax-flex-col ax-gap-1\">\n <li *ngIf=\"item.date.dayOfMonth % 6 === 0\">\n <a href=\"#\"\n class=\"ax-flex ax-justify-between ax-text-sm ax-bg-primary-500 ax-py-1 ax-px-2 ax-rounded ax-text-primary-fore\">\n <p class=\"ax-text-sm\">Launch Time</p>\n <time class=\"ax-ms-3\" datetime=\"item.date.format('HH A')\">\n {{item.date.format('hh A')}}\n </time>\n </a>\n </li>\n <li *ngIf=\"item.date.dayOfMonth % 5 === 0\">\n <a href=\"#\"\n class=\"ax-flex ax-justify-between ax-text-sm ax-bg-success-500 ax-py-1 ax-px-2 ax-rounded ax-text-success-fore\">\n <p class=\"ax-text-sm\">Daily meeting</p>\n <time class=\"ax-ms-3\" datetime=\"item.date.format('HH A')\">\n {{item.date.format('hh A')}}\n </time>\n </a>\n </li>\n </ol>\n <ol class=\"ax-flex ax-gap-1 ax-self-center md:ax-hidden\">\n <li *ngIf=\"item.date.dayOfMonth % 5 === 0\">\n <span\n class=\"ax-flex ax-w-1.5 ax-h-1.5 ax-rounded-full ax-bg-primary-500 lg:ax-hidden\"></span>\n </li>\n <li *ngIf=\"item.date.dayOfMonth % 6 === 0\">\n <span\n class=\"ax-flex ax-w-1.5 ax-h-1.5 ax-rounded-full ax-bg-danger-500 lg:ax-hidden\"></span>\n </li>\n <li *ngIf=\"item.date.dayOfMonth % 8 === 0\">\n <span\n class=\"ax-flex ax-w-1.5 ax-h-1.5 ax-rounded-full ax-bg-warning-500 lg:ax-hidden\"></span>\n </li>\n <li *ngIf=\"item.date.dayOfMonth % 3 === 0\">\n <span\n class=\"ax-flex ax-w-1.5 ax-h-1.5 ax-rounded-full ax-bg-success-500 lg:ax-hidden\"></span>\n </li>\n </ol>\n </div>\n </ng-container>\n </div>\n </div>\n</div>\n<div class=\"ax-p-4 lg:ax-hidden\">\n <ol\n class=\"ax-flex ax-flex-col ax-rounded-lg ax-border ax-bg-surface ax-divide-y ax-overflow-hidden ax-cursor-pointer\">\n <li class=\"ax-flex ax-items-start ax-justify-between ax-p-4 hover:ax-bg-neutral-100 mobile-task\">\n <div class=\"ax-flex ax-flex-col ax-gap-2\">\n <p class=\"ax-font-medium\">Daily Meeting at the Office</p>\n <div class=\"ax-flex ax-gap-2 ax-items-center\">\n <ax-icon class=\"fa-solid fa-clock ax-text-neutral-400\"></ax-icon>\n <p class=\"ax-text-sm\">3 PM</p>\n </div>\n </div>\n <ax-button text=\"Edit\" class=\"!ax-bg-surface ax-border ax-sm ax-opacity-0\"></ax-button>\n </li>\n </ol>\n</div>" }]
50
55
  }], propDecorators: { date: [{
51
56
  type: Input
52
57
  }] } });
53
58
 
59
+ class AXSchedulerWeekViewComponent extends MXBaseComponent {
60
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.9", ngImport: i0, type: AXSchedulerWeekViewComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
61
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.9", type: AXSchedulerWeekViewComponent, selector: "ax-scheduler-week-view", usesInheritance: true, ngImport: i0, template: "<div class=\"ax-flex ax-flex-col ax-flex-auto ax-isolate ax-overflow-auto ax-bg-white\">\n <div class=\"ax-flex ax-flex-col ax-max-w-full\">\n <div class=\"ax-shadow-md ax-pr-8 ax-z-30 ax-sticky ax-top-0\">\n <div class=\"ax-grid ax-leading-6 ax-border-r ax-grid-cols-7\">\n <div class=\"ax-w-14 ax-col-end-1\"></div>\n <div\n class=\"ax-flex ax-items-center ax-justify-center ax-py-3 ax-bg-white ax-font-medium ax-border-l ax-border-r\">\n Mon 10\n </div>\n <div class=\"ax-flex ax-items-center ax-justify-center ax-py-3 ax-bg-white ax-font-medium ax-border-r\">\n Mon 10\n </div>\n <div class=\"ax-flex ax-items-center ax-justify-center ax-py-3 ax-bg-white ax-font-medium ax-border-r\">\n Mon 10\n </div>\n <div class=\"ax-flex ax-items-center ax-justify-center ax-py-3 ax-bg-white ax-font-medium ax-border-r\">\n Mon 10\n </div>\n <div class=\"ax-flex ax-items-center ax-justify-center ax-py-3 ax-bg-white ax-font-medium ax-border-r\">\n Mon 10\n </div>\n <div class=\"ax-flex ax-items-center ax-justify-center ax-py-3 ax-bg-white ax-font-medium ax-border-r\">\n Mon 10\n </div>\n <div class=\"ax-flex ax-items-center ax-justify-center ax-py-3 ax-bg-white ax-font-medium\">\n Mon 10\n </div>\n </div>\n </div>\n <div class=\"ax-flex ax-flex-auto\">\n <div class=\"ax-w-14 ax-z-10 ax-sticky ax-left-0 ax-bg-white ax-shadow\"></div>\n <div class=\"ax-grid ax-flex-auto ax-grid-cols-1 ax-grid-rows-1\">\n <div class=\"ax-grid ax-col-start-1 ax-col-end-2 ax-row-start-1\"\n style=\"grid-template-rows: repeat(45, minmax(3.5rem, 1fr))\">\n <div class=\"ax-row-end-1 ax-h-7\"></div>\n <div class=\"ax-border-t ax-border-b\">\n <div class=\"ax-leading-5 ax-text-right ax-w-14 -ax-mt-[0.625rem] -ax-ml-14 ax-sticky ax-left-0\">\n </div>\n </div>\n </div>\n <div class=\"ax-grid ax-grid-rows-1 ax-grid-cols-7 ax-row-start-1 ax-col-end-2 ax-col-start-1\">\n <div class=\"ax-col-start-1 ax-row-start-1 ax-row-end-[-1]\"></div>\n <div class=\"ax-col-start-2 ax-row-start-1 ax-row-end-[-1] ax-border-l\"></div>\n <div class=\"ax-col-start-3 ax-row-start-1 ax-row-end-[-1] ax-border-l\"></div>\n <div class=\"ax-col-start-4 ax-row-start-1 ax-row-end-[-1] ax-border-l\"></div>\n <div class=\"ax-col-start-5 ax-row-start-1 ax-row-end-[-1] ax-border-l\"></div>\n <div class=\"ax-col-start-6 ax-row-start-1 ax-row-end-[-1] ax-border-l\"></div>\n <div class=\"ax-col-start-7 ax-row-start-1 ax-row-end-[-1] ax-border-l\"></div>\n <div class=\"ax-col-start-8 ax-row-start-1 ax-row-end-[-1] ax-border-l ax-w-8\"></div>\n </div>\n <ol class=\"ax-grid ax-pr-8 ax-grid-cols-7 ax-row-start-1 ax-col-end-2 ax-col-start-2\"\n style=\"grid-template-rows: 1.75rem repeat(288, minmax(0px, 1fr)) auto\"></ol>\n </div>\n </div>\n </div>\n</div>", changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
62
+ }
63
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.9", ngImport: i0, type: AXSchedulerWeekViewComponent, decorators: [{
64
+ type: Component,
65
+ args: [{ selector: 'ax-scheduler-week-view', changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, template: "<div class=\"ax-flex ax-flex-col ax-flex-auto ax-isolate ax-overflow-auto ax-bg-white\">\n <div class=\"ax-flex ax-flex-col ax-max-w-full\">\n <div class=\"ax-shadow-md ax-pr-8 ax-z-30 ax-sticky ax-top-0\">\n <div class=\"ax-grid ax-leading-6 ax-border-r ax-grid-cols-7\">\n <div class=\"ax-w-14 ax-col-end-1\"></div>\n <div\n class=\"ax-flex ax-items-center ax-justify-center ax-py-3 ax-bg-white ax-font-medium ax-border-l ax-border-r\">\n Mon 10\n </div>\n <div class=\"ax-flex ax-items-center ax-justify-center ax-py-3 ax-bg-white ax-font-medium ax-border-r\">\n Mon 10\n </div>\n <div class=\"ax-flex ax-items-center ax-justify-center ax-py-3 ax-bg-white ax-font-medium ax-border-r\">\n Mon 10\n </div>\n <div class=\"ax-flex ax-items-center ax-justify-center ax-py-3 ax-bg-white ax-font-medium ax-border-r\">\n Mon 10\n </div>\n <div class=\"ax-flex ax-items-center ax-justify-center ax-py-3 ax-bg-white ax-font-medium ax-border-r\">\n Mon 10\n </div>\n <div class=\"ax-flex ax-items-center ax-justify-center ax-py-3 ax-bg-white ax-font-medium ax-border-r\">\n Mon 10\n </div>\n <div class=\"ax-flex ax-items-center ax-justify-center ax-py-3 ax-bg-white ax-font-medium\">\n Mon 10\n </div>\n </div>\n </div>\n <div class=\"ax-flex ax-flex-auto\">\n <div class=\"ax-w-14 ax-z-10 ax-sticky ax-left-0 ax-bg-white ax-shadow\"></div>\n <div class=\"ax-grid ax-flex-auto ax-grid-cols-1 ax-grid-rows-1\">\n <div class=\"ax-grid ax-col-start-1 ax-col-end-2 ax-row-start-1\"\n style=\"grid-template-rows: repeat(45, minmax(3.5rem, 1fr))\">\n <div class=\"ax-row-end-1 ax-h-7\"></div>\n <div class=\"ax-border-t ax-border-b\">\n <div class=\"ax-leading-5 ax-text-right ax-w-14 -ax-mt-[0.625rem] -ax-ml-14 ax-sticky ax-left-0\">\n </div>\n </div>\n </div>\n <div class=\"ax-grid ax-grid-rows-1 ax-grid-cols-7 ax-row-start-1 ax-col-end-2 ax-col-start-1\">\n <div class=\"ax-col-start-1 ax-row-start-1 ax-row-end-[-1]\"></div>\n <div class=\"ax-col-start-2 ax-row-start-1 ax-row-end-[-1] ax-border-l\"></div>\n <div class=\"ax-col-start-3 ax-row-start-1 ax-row-end-[-1] ax-border-l\"></div>\n <div class=\"ax-col-start-4 ax-row-start-1 ax-row-end-[-1] ax-border-l\"></div>\n <div class=\"ax-col-start-5 ax-row-start-1 ax-row-end-[-1] ax-border-l\"></div>\n <div class=\"ax-col-start-6 ax-row-start-1 ax-row-end-[-1] ax-border-l\"></div>\n <div class=\"ax-col-start-7 ax-row-start-1 ax-row-end-[-1] ax-border-l\"></div>\n <div class=\"ax-col-start-8 ax-row-start-1 ax-row-end-[-1] ax-border-l ax-w-8\"></div>\n </div>\n <ol class=\"ax-grid ax-pr-8 ax-grid-cols-7 ax-row-start-1 ax-col-end-2 ax-col-start-2\"\n style=\"grid-template-rows: 1.75rem repeat(288, minmax(0px, 1fr)) auto\"></ol>\n </div>\n </div>\n </div>\n</div>" }]
66
+ }] });
67
+
54
68
  class AXSchedulerComponent extends MXBaseComponent {
55
69
  constructor() {
56
70
  super(...arguments);
57
- this.current = new AXDateTime();
71
+ this._calendarService = inject(AXCalendarService);
72
+ this._platform = inject(AXPlatform);
73
+ this.current = this._calendarService.now();
58
74
  }
59
75
  handleOnItemClick() { }
76
+ ngOnInit() {
77
+ this.detectSize();
78
+ this._platform.resize.subscribe(() => {
79
+ this.detectSize();
80
+ super.cdr.markForCheck();
81
+ });
82
+ }
83
+ detectSize() {
84
+ this._size = this._platform.screenSize;
85
+ console.log(this._size);
86
+ }
60
87
  _handleNextClick() {
61
- debugger;
62
88
  this.current = this.current.add('month', 1);
63
89
  }
64
90
  _handlePrevClick() {
65
- debugger;
66
91
  this.current = this.current.add('month', -1);
67
92
  }
68
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.7", ngImport: i0, type: AXSchedulerComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
69
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.7", type: AXSchedulerComponent, selector: "ax-scheduler", usesInheritance: true, ngImport: i0, template: "<div class=\"ax-flex ax-flex-col ax-h-[500px]\">\n <div class=\"scheduler-header\">\n <p>\n {{current.format(\"MMMM yyyy\")}}\n </p>\n <div class=\"scheduler-actions\">\n <ax-button text=\"Today\">\n <ax-prefix>\n <ax-icon class=\"fa-solid fa-chevron-left\" (click)=\"_handlePrevClick()\">\n </ax-icon>\n </ax-prefix>\n <ax-suffix>\n <ax-icon class=\"fa-solid fa-chevron-right\" (click)=\"_handleNextClick()\">\n </ax-icon>\n </ax-suffix>\n </ax-button>\n <ax-button text=\"Week View\">\n <ax-suffix>\n <ax-icon class=\"fa-solid fa-chevron-down\">\n </ax-icon>\n </ax-suffix>\n <ax-dropdown-panel (onItemClick)=\"handleOnItemClick()\">\n <ax-button-item text=\"Day View\" name=\"text\">\n </ax-button-item>\n <ax-button-item text=\"Week View\" name=\"text\">\n </ax-button-item>\n <ax-button-item text=\"Month View\" name=\"text\">\n </ax-button-item>\n <ax-button-item text=\"Year View\" name=\"text\">\n </ax-button-item>\n </ax-dropdown-panel>\n <ax-suffix>\n <ax-icon icon=\"\"></ax-icon>\n </ax-suffix>\n </ax-button>\n <ax-button color=\"primary\" text=\"Add Event\">\n <ax-prefix>\n <ax-icon class=\"fa-solid fa-plus\"></ax-icon>\n </ax-prefix>\n </ax-button>\n </div>\n </div>\n <ax-scheduler-month-view [date]=\"current\"></ax-scheduler-month-view>\n</div>", styles: ["ax-scheduler{width:100%;display:block;border-width:1px;border-radius:.75rem;overflow:hidden}ax-scheduler .scheduler-header{display:flex;align-items:center;justify-content:space-between;padding:1rem;border-bottom-width:1px}ax-scheduler .scheduler-header p{margin:0;font-size:1.5rem;font-weight:500}ax-scheduler .scheduler-actions{display:flex;gap:.75rem}ax-scheduler ax-scheduler-month-view{display:flex;flex:1}\n"], dependencies: [{ kind: "component", type: i1$1.AXButtonComponent, selector: "ax-button", inputs: ["disabled", "size", "tabIndex", "color", "look", "text", "toggleable", "selected", "type"], outputs: ["onBlur", "onFocus", "onClick", "selectedChange", "toggleableChange", "lookChange", "colorChange"] }, { kind: "component", type: i1$1.AXButtonItemComponent, selector: "ax-button-item", inputs: ["text", "tooltip", "selected", "seperated", "name", "data", "color"], outputs: ["onClick"] }, { kind: "component", type: i2.AXDecoratorIconComponent, selector: "ax-icon", inputs: ["icon"] }, { kind: "component", type: i2.AXDecoratorGenericComponent, selector: "ax-footer, ax-header, ax-content, ax-divider, ax-form-hint, ax-prefix, ax-suffix, ax-text, ax-title , ax-sub-title" }, { kind: "component", type: i3.AXDropdownPanelComponent, selector: "ax-dropdown-panel", inputs: ["isOpen", "fitParent", "dropdownWidth", "position", "target"], outputs: ["onOpened", "onClosed", "onItemClick"] }, { kind: "component", type: AXSchedulerMonthViewComponent, selector: "ax-scheduler-month-view", inputs: ["date"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
93
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.9", ngImport: i0, type: AXSchedulerComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
94
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.9", type: AXSchedulerComponent, selector: "ax-scheduler", usesInheritance: true, ngImport: i0, template: "<div class=\"ax-flex ax-flex-col ax-h-full\">\n <div class=\"scheduler-header\">\n <p>\n {{ current.format('MMMM yyyy') }}\n </p>\n <div class=\"scheduler-actions\">\n <div class=\"ax-flex ax-border ax-rounded-md ax-items-center ax-px-1 ax-gap-0.5 ax-bg-surface\">\n <button class=\"ax-w-8 ax-h-8 ax-rounded-md hover:ax-bg-neutral-100\" (click)=\"_handlePrevClick()\">\n <ax-icon class=\"fa-solid fa-chevron-left\"> </ax-icon>\n </button>\n <ng-container *ngIf=\"_size === 'SM'; else elseTemplate\">\n <span class=\"ax-text-neutral-200\">|</span>\n </ng-container>\n <ng-template #elseTemplate>\n <ax-button look=\"blank\" class=\"ax-sm\" text=\"Today\"> </ax-button>\n </ng-template>\n <button class=\"ax-w-8 ax-h-8 ax-rounded-md hover:ax-bg-neutral-100\" (click)=\"_handleNextClick()\">\n <ax-icon class=\"fa-solid fa-chevron-right\"> </ax-icon>\n </button>\n </div>\n <ax-button [text]=\"_size === 'SM' ? '' : 'Week View'\" class=\"!ax-bg-surface ax-border\">\n <ax-suffix>\n <ax-icon\n [class]=\"\n _size === 'SM'\n ? 'fa-solid fa-ellipsis-vertical'\n : 'fa-solid fa-chevron-down ax-text-neutral-400'\n \"\n >\n </ax-icon>\n </ax-suffix>\n <ax-dropdown-panel (onItemClick)=\"handleOnItemClick()\" [adaptivityEnabled]=\"true\">\n <ax-button-item\n *ngIf=\"_size === 'SM' || _size === 'MD'\"\n text=\"Add Event\"\n name=\"text\"\n [divided]=\"true\"\n color=\"primary\"\n >\n </ax-button-item>\n <ax-button-item *ngIf=\"_size === 'SM'\" text=\"Go to Today\" name=\"text\" [divided]=\"true\">\n </ax-button-item>\n <ax-button-item text=\"Day View\" name=\"text\"> </ax-button-item>\n <ax-button-item text=\"Week View\" name=\"text\"> </ax-button-item>\n <ax-button-item text=\"Month View\" name=\"text\"> </ax-button-item>\n <ax-button-item text=\"Year View\" name=\"text\"> </ax-button-item>\n </ax-dropdown-panel>\n <ax-suffix>\n <ax-icon icon=\"\"></ax-icon>\n </ax-suffix>\n </ax-button>\n <ax-button color=\"primary\" text=\"Add Event\" class=\"ax-hidden lg:ax-block\">\n <ax-prefix>\n <ax-icon class=\"fa-solid fa-plus\"></ax-icon>\n </ax-prefix>\n </ax-button>\n </div>\n </div>\n <!-- <ax-scheduler-month-view [date]=\"current\"></ax-scheduler-month-view> -->\n <ax-scheduler-week-view></ax-scheduler-week-view>\n</div>\n", styles: ["ax-scheduler{height:100%;display:block;border-width:1px;border-radius:.75rem;@apply ax-bg-neutral-100;overflow:hidden}ax-scheduler .scheduler-header{display:flex;align-items:center;justify-content:space-between;padding:1rem;border-bottom-width:1px}ax-scheduler .scheduler-header p{margin:0;font-size:1rem;font-weight:500}ax-scheduler .scheduler-actions{display:flex;gap:.75rem}ax-scheduler ax-scheduler-month-view{display:flex;flex-direction:column;flex:1 1 auto}ax-scheduler ax-scheduler-month-view .mobile-task:hover ax-button{opacity:1}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i2.AXButtonComponent, selector: "ax-button", inputs: ["disabled", "size", "tabIndex", "color", "look", "text", "toggleable", "selected", "type"], outputs: ["onBlur", "onFocus", "onClick", "selectedChange", "toggleableChange", "lookChange", "colorChange", "disabledChange"] }, { kind: "component", type: i2.AXButtonItemComponent, selector: "ax-button-item", inputs: ["color", "disabled", "text", "selected", "divided", "data", "name"], outputs: ["onClick", "onFocus", "onBlur", "disabledChange"] }, { kind: "component", type: i3.AXDecoratorIconComponent, selector: "ax-icon", inputs: ["icon"] }, { kind: "component", type: i3.AXDecoratorGenericComponent, selector: "ax-footer, ax-header, ax-content, ax-divider, ax-form-hint, ax-prefix, ax-suffix, ax-text, ax-title , ax-sub-title" }, { kind: "component", type: i4.AXDropdownPanelComponent, selector: "ax-dropdown-panel", inputs: ["isOpen", "fitParent", "dropdownWidth", "position", "adaptivityEnabled"], outputs: ["onOpened", "onClosed", "onItemClick"] }, { kind: "component", type: AXSchedulerWeekViewComponent, selector: "ax-scheduler-week-view" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
70
95
  }
71
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.7", ngImport: i0, type: AXSchedulerComponent, decorators: [{
96
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.9", ngImport: i0, type: AXSchedulerComponent, decorators: [{
72
97
  type: Component,
73
- args: [{ selector: 'ax-scheduler', changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, template: "<div class=\"ax-flex ax-flex-col ax-h-[500px]\">\n <div class=\"scheduler-header\">\n <p>\n {{current.format(\"MMMM yyyy\")}}\n </p>\n <div class=\"scheduler-actions\">\n <ax-button text=\"Today\">\n <ax-prefix>\n <ax-icon class=\"fa-solid fa-chevron-left\" (click)=\"_handlePrevClick()\">\n </ax-icon>\n </ax-prefix>\n <ax-suffix>\n <ax-icon class=\"fa-solid fa-chevron-right\" (click)=\"_handleNextClick()\">\n </ax-icon>\n </ax-suffix>\n </ax-button>\n <ax-button text=\"Week View\">\n <ax-suffix>\n <ax-icon class=\"fa-solid fa-chevron-down\">\n </ax-icon>\n </ax-suffix>\n <ax-dropdown-panel (onItemClick)=\"handleOnItemClick()\">\n <ax-button-item text=\"Day View\" name=\"text\">\n </ax-button-item>\n <ax-button-item text=\"Week View\" name=\"text\">\n </ax-button-item>\n <ax-button-item text=\"Month View\" name=\"text\">\n </ax-button-item>\n <ax-button-item text=\"Year View\" name=\"text\">\n </ax-button-item>\n </ax-dropdown-panel>\n <ax-suffix>\n <ax-icon icon=\"\"></ax-icon>\n </ax-suffix>\n </ax-button>\n <ax-button color=\"primary\" text=\"Add Event\">\n <ax-prefix>\n <ax-icon class=\"fa-solid fa-plus\"></ax-icon>\n </ax-prefix>\n </ax-button>\n </div>\n </div>\n <ax-scheduler-month-view [date]=\"current\"></ax-scheduler-month-view>\n</div>", styles: ["ax-scheduler{width:100%;display:block;border-width:1px;border-radius:.75rem;overflow:hidden}ax-scheduler .scheduler-header{display:flex;align-items:center;justify-content:space-between;padding:1rem;border-bottom-width:1px}ax-scheduler .scheduler-header p{margin:0;font-size:1.5rem;font-weight:500}ax-scheduler .scheduler-actions{display:flex;gap:.75rem}ax-scheduler ax-scheduler-month-view{display:flex;flex:1}\n"] }]
98
+ args: [{ selector: 'ax-scheduler', changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, template: "<div class=\"ax-flex ax-flex-col ax-h-full\">\n <div class=\"scheduler-header\">\n <p>\n {{ current.format('MMMM yyyy') }}\n </p>\n <div class=\"scheduler-actions\">\n <div class=\"ax-flex ax-border ax-rounded-md ax-items-center ax-px-1 ax-gap-0.5 ax-bg-surface\">\n <button class=\"ax-w-8 ax-h-8 ax-rounded-md hover:ax-bg-neutral-100\" (click)=\"_handlePrevClick()\">\n <ax-icon class=\"fa-solid fa-chevron-left\"> </ax-icon>\n </button>\n <ng-container *ngIf=\"_size === 'SM'; else elseTemplate\">\n <span class=\"ax-text-neutral-200\">|</span>\n </ng-container>\n <ng-template #elseTemplate>\n <ax-button look=\"blank\" class=\"ax-sm\" text=\"Today\"> </ax-button>\n </ng-template>\n <button class=\"ax-w-8 ax-h-8 ax-rounded-md hover:ax-bg-neutral-100\" (click)=\"_handleNextClick()\">\n <ax-icon class=\"fa-solid fa-chevron-right\"> </ax-icon>\n </button>\n </div>\n <ax-button [text]=\"_size === 'SM' ? '' : 'Week View'\" class=\"!ax-bg-surface ax-border\">\n <ax-suffix>\n <ax-icon\n [class]=\"\n _size === 'SM'\n ? 'fa-solid fa-ellipsis-vertical'\n : 'fa-solid fa-chevron-down ax-text-neutral-400'\n \"\n >\n </ax-icon>\n </ax-suffix>\n <ax-dropdown-panel (onItemClick)=\"handleOnItemClick()\" [adaptivityEnabled]=\"true\">\n <ax-button-item\n *ngIf=\"_size === 'SM' || _size === 'MD'\"\n text=\"Add Event\"\n name=\"text\"\n [divided]=\"true\"\n color=\"primary\"\n >\n </ax-button-item>\n <ax-button-item *ngIf=\"_size === 'SM'\" text=\"Go to Today\" name=\"text\" [divided]=\"true\">\n </ax-button-item>\n <ax-button-item text=\"Day View\" name=\"text\"> </ax-button-item>\n <ax-button-item text=\"Week View\" name=\"text\"> </ax-button-item>\n <ax-button-item text=\"Month View\" name=\"text\"> </ax-button-item>\n <ax-button-item text=\"Year View\" name=\"text\"> </ax-button-item>\n </ax-dropdown-panel>\n <ax-suffix>\n <ax-icon icon=\"\"></ax-icon>\n </ax-suffix>\n </ax-button>\n <ax-button color=\"primary\" text=\"Add Event\" class=\"ax-hidden lg:ax-block\">\n <ax-prefix>\n <ax-icon class=\"fa-solid fa-plus\"></ax-icon>\n </ax-prefix>\n </ax-button>\n </div>\n </div>\n <!-- <ax-scheduler-month-view [date]=\"current\"></ax-scheduler-month-view> -->\n <ax-scheduler-week-view></ax-scheduler-week-view>\n</div>\n", styles: ["ax-scheduler{height:100%;display:block;border-width:1px;border-radius:.75rem;@apply ax-bg-neutral-100;overflow:hidden}ax-scheduler .scheduler-header{display:flex;align-items:center;justify-content:space-between;padding:1rem;border-bottom-width:1px}ax-scheduler .scheduler-header p{margin:0;font-size:1rem;font-weight:500}ax-scheduler .scheduler-actions{display:flex;gap:.75rem}ax-scheduler ax-scheduler-month-view{display:flex;flex-direction:column;flex:1 1 auto}ax-scheduler ax-scheduler-month-view .mobile-task:hover ax-button{opacity:1}\n"] }]
74
99
  }] });
75
100
 
76
- const COMPONENT = [AXSchedulerComponent, AXSchedulerMonthViewComponent];
101
+ const COMPONENT = [AXSchedulerComponent, AXSchedulerMonthViewComponent, AXSchedulerWeekViewComponent];
77
102
  const MODULES = [CommonModule, AXButtonModule, AXDecoratorModule, AXDropdownModule, AXDateTimeModule];
78
103
  class AXSchedulerModule {
79
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.7", ngImport: i0, type: AXSchedulerModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
80
- static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "16.1.7", ngImport: i0, type: AXSchedulerModule, declarations: [AXSchedulerComponent, AXSchedulerMonthViewComponent], imports: [CommonModule, AXButtonModule, AXDecoratorModule, AXDropdownModule, AXDateTimeModule], exports: [AXSchedulerComponent, AXSchedulerMonthViewComponent] }); }
81
- static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "16.1.7", ngImport: i0, type: AXSchedulerModule, imports: [MODULES] }); }
104
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.9", ngImport: i0, type: AXSchedulerModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
105
+ static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "16.1.9", ngImport: i0, type: AXSchedulerModule, declarations: [AXSchedulerComponent, AXSchedulerMonthViewComponent, AXSchedulerWeekViewComponent], imports: [CommonModule, AXButtonModule, AXDecoratorModule, AXDropdownModule, AXDateTimeModule], exports: [AXSchedulerComponent, AXSchedulerMonthViewComponent, AXSchedulerWeekViewComponent] }); }
106
+ static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "16.1.9", ngImport: i0, type: AXSchedulerModule, imports: [MODULES] }); }
82
107
  }
83
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.7", ngImport: i0, type: AXSchedulerModule, decorators: [{
108
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.9", ngImport: i0, type: AXSchedulerModule, decorators: [{
84
109
  type: NgModule,
85
110
  args: [{
86
111
  declarations: [...COMPONENT],
@@ -94,5 +119,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.7", ngImpor
94
119
  * Generated bundle index. Do not edit.
95
120
  */
96
121
 
97
- export { AXSchedulerComponent, AXSchedulerModule, AXSchedulerMonthViewComponent };
122
+ export { AXSchedulerComponent, AXSchedulerModule, AXSchedulerMonthViewComponent, AXSchedulerWeekViewComponent };
98
123
  //# sourceMappingURL=acorex-components-scheduler.mjs.map
@@ -1 +1 @@
1
- {"version":3,"file":"acorex-components-scheduler.mjs","sources":["../../../../libs/components/scheduler/src/lib/scheduler-month-view.component.ts","../../../../libs/components/scheduler/src/lib/scheduler-month-view.component.html","../../../../libs/components/scheduler/src/lib/scheduler.component.ts","../../../../libs/components/scheduler/src/lib/scheduler.component.html","../../../../libs/components/scheduler/src/lib/scheduler.module.ts","../../../../libs/components/scheduler/src/acorex-components-scheduler.ts"],"sourcesContent":["import { MXBaseComponent } from '@acorex/components/common';\nimport { AXDateTime, AXDateTimeRange } from '@acorex/core/dateTime';\nimport { ChangeDetectionStrategy, Component, Input, ViewEncapsulation } from '@angular/core';\n\n@Component({\n selector: 'ax-scheduler-month-view',\n templateUrl: './scheduler-month-view.component.html',\n changeDetection: ChangeDetectionStrategy.OnPush,\n encapsulation: ViewEncapsulation.None,\n})\nexport class AXSchedulerMonthViewComponent extends MXBaseComponent {\n protected _slots: { date: AXDateTime; cssClass: { [key: string]: boolean }; isToday: boolean }[] = [];\n protected _dayNames: string[] = [];\n\n private _date: AXDateTime;\n @Input()\n public get date(): AXDateTime {\n return this._date;\n }\n public set date(v: AXDateTime) {\n this._date = v;\n this.generateSlots();\n }\n\n ngOnInit() {\n this.generateSlots();\n this._dayNames = this.date.calendar.dayShortNames;\n }\n\n generateSlots() {\n debugger;\n const startDate = this.date.startOf('month').startOf('week');\n const endDate = this.date.endOf('month').endOf('week');\n const range = new AXDateTimeRange(startDate, endDate).enumurate('day');\n this._slots = range.map((c: AXDateTime) => ({\n date: c,\n cssClass: {\n '!ax-bg-neutral-100': c.monthOfYear != this.date.monthOfYear,\n },\n isToday: c.dayOfYear == this.date.dayOfYear,\n }));\n }\n}\n","<div class=\"ax-flex ax-flex-col ax-flex-1\">\n <div class=\"ax-flex ax-bg-neutral-200 ax-border-b\">\n <div class=\"ax-grid ax-grid-cols-7 ax-gap-[1px] ax-w-full\">\n <ng-container *ngFor=\"let item of _dayNames\">\n <div class=\"ax-flex ax-items-center ax-justify-center ax-py-2 ax-bg-white\">\n {{item}}\n </div>\n </ng-container>\n </div>\n </div>\n <div class=\"ax-flex ax-flex-1 ax-bg-neutral-200\">\n <div class=\"ax-grid ax-grid-cols-7 ax-gap-[1px] ax-w-full\">\n <ng-container *ngFor=\"let item of _slots\">\n <div class=\"ax-py-2 ax-px-3 ax-bg-white\" [ngClass]=\"item.cssClass\">\n <time class=\"ax-text-sm ax-flex ax-items-center ax-justify-center ax-rounded-full ax-w-6 ax-h-6\"\n [class.ax-bg-primary-500]=\"item.isToday\" [class.ax-text-white]=\"item.isToday\"\n datetime=\"item.date.format('dd')\">{{item.date.format('d')}}</time>\n </div>\n </ng-container>\n </div>\n </div>\n</div>","import { MXBaseComponent } from '@acorex/components/common';\nimport { AXDateTime } from '@acorex/core/dateTime';\nimport { ChangeDetectionStrategy, Component, ViewEncapsulation } from '@angular/core';\n\n@Component({\n selector: 'ax-scheduler',\n templateUrl: './scheduler.component.html',\n styleUrls: ['./scheduler.component.scss'],\n changeDetection: ChangeDetectionStrategy.OnPush,\n encapsulation: ViewEncapsulation.None,\n})\nexport class AXSchedulerComponent extends MXBaseComponent {\n protected current: AXDateTime = new AXDateTime();\n\n handleOnItemClick() {}\n\n _handleNextClick() {\n debugger;\n this.current = this.current.add('month', 1);\n }\n\n _handlePrevClick() {\n debugger;\n this.current = this.current.add('month', -1);\n }\n}\n","<div class=\"ax-flex ax-flex-col ax-h-[500px]\">\n <div class=\"scheduler-header\">\n <p>\n {{current.format(\"MMMM yyyy\")}}\n </p>\n <div class=\"scheduler-actions\">\n <ax-button text=\"Today\">\n <ax-prefix>\n <ax-icon class=\"fa-solid fa-chevron-left\" (click)=\"_handlePrevClick()\">\n </ax-icon>\n </ax-prefix>\n <ax-suffix>\n <ax-icon class=\"fa-solid fa-chevron-right\" (click)=\"_handleNextClick()\">\n </ax-icon>\n </ax-suffix>\n </ax-button>\n <ax-button text=\"Week View\">\n <ax-suffix>\n <ax-icon class=\"fa-solid fa-chevron-down\">\n </ax-icon>\n </ax-suffix>\n <ax-dropdown-panel (onItemClick)=\"handleOnItemClick()\">\n <ax-button-item text=\"Day View\" name=\"text\">\n </ax-button-item>\n <ax-button-item text=\"Week View\" name=\"text\">\n </ax-button-item>\n <ax-button-item text=\"Month View\" name=\"text\">\n </ax-button-item>\n <ax-button-item text=\"Year View\" name=\"text\">\n </ax-button-item>\n </ax-dropdown-panel>\n <ax-suffix>\n <ax-icon icon=\"\"></ax-icon>\n </ax-suffix>\n </ax-button>\n <ax-button color=\"primary\" text=\"Add Event\">\n <ax-prefix>\n <ax-icon class=\"fa-solid fa-plus\"></ax-icon>\n </ax-prefix>\n </ax-button>\n </div>\n </div>\n <ax-scheduler-month-view [date]=\"current\"></ax-scheduler-month-view>\n</div>","import { AXDateTimeModule } from '@acorex/core/dateTime';\nimport { CommonModule } from '@angular/common';\nimport { NgModule } from '@angular/core';\nimport { AXButtonModule } from '@acorex/components/button';\nimport { AXDecoratorModule } from '@acorex/components/decorators';\nimport { AXDropdownModule } from '@acorex/components/dropdown';\nimport { AXSchedulerMonthViewComponent } from './scheduler-month-view.component';\nimport { AXSchedulerComponent } from './scheduler.component';\n\nconst COMPONENT = [AXSchedulerComponent, AXSchedulerMonthViewComponent];\nconst MODULES = [CommonModule, AXButtonModule, AXDecoratorModule, AXDropdownModule, AXDateTimeModule];\n\n@NgModule({\n declarations: [...COMPONENT],\n imports: [...MODULES],\n exports: [...COMPONENT],\n providers: [],\n})\nexport class AXSchedulerModule {}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":["i1","i4.AXSchedulerMonthViewComponent"],"mappings":";;;;;;;;;;;;;AAUM,MAAO,6BAA8B,SAAQ,eAAe,CAAA;AANlE,IAAA,WAAA,GAAA;;QAOY,IAAM,CAAA,MAAA,GAAmF,EAAE,CAAC;QAC5F,IAAS,CAAA,SAAA,GAAa,EAAE,CAAC;AA8BpC,KAAA;AA3BC,IAAA,IACW,IAAI,GAAA;QACb,OAAO,IAAI,CAAC,KAAK,CAAC;KACnB;IACD,IAAW,IAAI,CAAC,CAAa,EAAA;AAC3B,QAAA,IAAI,CAAC,KAAK,GAAG,CAAC,CAAC;QACf,IAAI,CAAC,aAAa,EAAE,CAAC;KACtB;IAED,QAAQ,GAAA;QACN,IAAI,CAAC,aAAa,EAAE,CAAC;QACrB,IAAI,CAAC,SAAS,GAAG,IAAI,CAAC,IAAI,CAAC,QAAQ,CAAC,aAAa,CAAC;KACnD;IAED,aAAa,GAAA;AACX,QAAA,SAAS;AACT,QAAA,MAAM,SAAS,GAAG,IAAI,CAAC,IAAI,CAAC,OAAO,CAAC,OAAO,CAAC,CAAC,OAAO,CAAC,MAAM,CAAC,CAAC;AAC7D,QAAA,MAAM,OAAO,GAAG,IAAI,CAAC,IAAI,CAAC,KAAK,CAAC,OAAO,CAAC,CAAC,KAAK,CAAC,MAAM,CAAC,CAAC;AACvD,QAAA,MAAM,KAAK,GAAG,IAAI,eAAe,CAAC,SAAS,EAAE,OAAO,CAAC,CAAC,SAAS,CAAC,KAAK,CAAC,CAAC;AACvE,QAAA,IAAI,CAAC,MAAM,GAAG,KAAK,CAAC,GAAG,CAAC,CAAC,CAAa,MAAM;AAC1C,YAAA,IAAI,EAAE,CAAC;AACP,YAAA,QAAQ,EAAE;gBACR,oBAAoB,EAAE,CAAC,CAAC,WAAW,IAAI,IAAI,CAAC,IAAI,CAAC,WAAW;AAC7D,aAAA;YACD,OAAO,EAAE,CAAC,CAAC,SAAS,IAAI,IAAI,CAAC,IAAI,CAAC,SAAS;AAC5C,SAAA,CAAC,CAAC,CAAC;KACL;8GA/BU,6BAA6B,EAAA,IAAA,EAAA,IAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA,CAAA,EAAA;AAA7B,IAAA,SAAA,IAAA,CAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,6BAA6B,gHCV1C,0mCAqBM,EAAA,YAAA,EAAA,CAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,OAAA,EAAA,QAAA,EAAA,WAAA,EAAA,MAAA,EAAA,CAAA,OAAA,EAAA,SAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,OAAA,EAAA,QAAA,EAAA,kBAAA,EAAA,MAAA,EAAA,CAAA,SAAA,EAAA,cAAA,EAAA,eAAA,CAAA,EAAA,CAAA,EAAA,eAAA,EAAA,EAAA,CAAA,uBAAA,CAAA,MAAA,EAAA,aAAA,EAAA,EAAA,CAAA,iBAAA,CAAA,IAAA,EAAA,CAAA,CAAA,EAAA;;2FDXO,6BAA6B,EAAA,UAAA,EAAA,CAAA;kBANzC,SAAS;AACE,YAAA,IAAA,EAAA,CAAA,EAAA,QAAA,EAAA,yBAAyB,mBAElB,uBAAuB,CAAC,MAAM,EAChC,aAAA,EAAA,iBAAiB,CAAC,IAAI,EAAA,QAAA,EAAA,0mCAAA,EAAA,CAAA;8BAQ1B,IAAI,EAAA,CAAA;sBADd,KAAK;;;AEJF,MAAO,oBAAqB,SAAQ,eAAe,CAAA;AAPzD,IAAA,WAAA,GAAA;;AAQY,QAAA,IAAA,CAAA,OAAO,GAAe,IAAI,UAAU,EAAE,CAAC;AAalD,KAAA;AAXC,IAAA,iBAAiB,MAAK;IAEtB,gBAAgB,GAAA;AACd,QAAA,SAAS;AACT,QAAA,IAAI,CAAC,OAAO,GAAG,IAAI,CAAC,OAAO,CAAC,GAAG,CAAC,OAAO,EAAE,CAAC,CAAC,CAAC;KAC7C;IAED,gBAAgB,GAAA;AACd,QAAA,SAAS;AACT,QAAA,IAAI,CAAC,OAAO,GAAG,IAAI,CAAC,OAAO,CAAC,GAAG,CAAC,OAAO,EAAE,CAAC,CAAC,CAAC,CAAC;KAC9C;8GAbU,oBAAoB,EAAA,IAAA,EAAA,IAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA,CAAA,EAAA;AAApB,IAAA,SAAA,IAAA,CAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,oBAAoB,2ECXjC,y0DA2CM,EAAA,MAAA,EAAA,CAAA,8ZAAA,CAAA,EAAA,YAAA,EAAA,CAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAAA,IAAA,CAAA,iBAAA,EAAA,QAAA,EAAA,WAAA,EAAA,MAAA,EAAA,CAAA,UAAA,EAAA,MAAA,EAAA,UAAA,EAAA,OAAA,EAAA,MAAA,EAAA,MAAA,EAAA,YAAA,EAAA,UAAA,EAAA,MAAA,CAAA,EAAA,OAAA,EAAA,CAAA,QAAA,EAAA,SAAA,EAAA,SAAA,EAAA,gBAAA,EAAA,kBAAA,EAAA,YAAA,EAAA,aAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAAA,IAAA,CAAA,qBAAA,EAAA,QAAA,EAAA,gBAAA,EAAA,MAAA,EAAA,CAAA,MAAA,EAAA,SAAA,EAAA,UAAA,EAAA,WAAA,EAAA,MAAA,EAAA,MAAA,EAAA,OAAA,CAAA,EAAA,OAAA,EAAA,CAAA,SAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,wBAAA,EAAA,QAAA,EAAA,SAAA,EAAA,MAAA,EAAA,CAAA,MAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,2BAAA,EAAA,QAAA,EAAA,oHAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,wBAAA,EAAA,QAAA,EAAA,mBAAA,EAAA,MAAA,EAAA,CAAA,QAAA,EAAA,WAAA,EAAA,eAAA,EAAA,UAAA,EAAA,QAAA,CAAA,EAAA,OAAA,EAAA,CAAA,UAAA,EAAA,UAAA,EAAA,aAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAAC,6BAAA,EAAA,QAAA,EAAA,yBAAA,EAAA,MAAA,EAAA,CAAA,MAAA,CAAA,EAAA,CAAA,EAAA,eAAA,EAAA,EAAA,CAAA,uBAAA,CAAA,MAAA,EAAA,aAAA,EAAA,EAAA,CAAA,iBAAA,CAAA,IAAA,EAAA,CAAA,CAAA,EAAA;;2FDhCO,oBAAoB,EAAA,UAAA,EAAA,CAAA;kBAPhC,SAAS;AACE,YAAA,IAAA,EAAA,CAAA,EAAA,QAAA,EAAA,cAAc,mBAGP,uBAAuB,CAAC,MAAM,EAChC,aAAA,EAAA,iBAAiB,CAAC,IAAI,EAAA,QAAA,EAAA,y0DAAA,EAAA,MAAA,EAAA,CAAA,8ZAAA,CAAA,EAAA,CAAA;;;AEAvC,MAAM,SAAS,GAAG,CAAC,oBAAoB,EAAE,6BAA6B,CAAC,CAAC;AACxE,MAAM,OAAO,GAAG,CAAC,YAAY,EAAE,cAAc,EAAE,iBAAiB,EAAE,gBAAgB,EAAE,gBAAgB,CAAC,CAAC;MAQzF,iBAAiB,CAAA;8GAAjB,iBAAiB,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,QAAA,EAAA,CAAA,CAAA,EAAA;AAAjB,IAAA,SAAA,IAAA,CAAA,IAAA,GAAA,EAAA,CAAA,mBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,QAAA,EAAA,EAAA,EAAA,IAAA,EAAA,iBAAiB,iBATX,oBAAoB,EAAE,6BAA6B,CAAA,EAAA,OAAA,EAAA,CACrD,YAAY,EAAE,cAAc,EAAE,iBAAiB,EAAE,gBAAgB,EAAE,gBAAgB,CADjF,EAAA,OAAA,EAAA,CAAA,oBAAoB,EAAE,6BAA6B,CAAA,EAAA,CAAA,CAAA,EAAA;AASzD,IAAA,SAAA,IAAA,CAAA,IAAA,GAAA,EAAA,CAAA,mBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,QAAA,EAAA,EAAA,EAAA,IAAA,EAAA,iBAAiB,YAJf,OAAO,CAAA,EAAA,CAAA,CAAA,EAAA;;2FAIT,iBAAiB,EAAA,UAAA,EAAA,CAAA;kBAN7B,QAAQ;AAAC,YAAA,IAAA,EAAA,CAAA;AACR,oBAAA,YAAY,EAAE,CAAC,GAAG,SAAS,CAAC;AAC5B,oBAAA,OAAO,EAAE,CAAC,GAAG,OAAO,CAAC;AACrB,oBAAA,OAAO,EAAE,CAAC,GAAG,SAAS,CAAC;AACvB,oBAAA,SAAS,EAAE,EAAE;AACd,iBAAA,CAAA;;;ACjBD;;AAEG;;;;"}
1
+ {"version":3,"file":"acorex-components-scheduler.mjs","sources":["../../../../libs/components/scheduler/src/lib/scheduler-month-view.component.ts","../../../../libs/components/scheduler/src/lib/scheduler-month-view.component.html","../../../../libs/components/scheduler/src/lib/scheduler-week-view.component.ts","../../../../libs/components/scheduler/src/lib/scheduler-week-view.component.html","../../../../libs/components/scheduler/src/lib/scheduler.component.ts","../../../../libs/components/scheduler/src/lib/scheduler.component.html","../../../../libs/components/scheduler/src/lib/scheduler.module.ts","../../../../libs/components/scheduler/src/acorex-components-scheduler.ts"],"sourcesContent":["import { MXBaseComponent } from '@acorex/components/common';\nimport { AXDateTime, AXDateTimeRange } from '@acorex/core/dateTime';\nimport { AXPlatform } from '@acorex/core/platform';\nimport { ChangeDetectionStrategy, Component, Input, ViewEncapsulation, inject } from '@angular/core';\n\n@Component({\n selector: 'ax-scheduler-month-view',\n templateUrl: './scheduler-month-view.component.html',\n changeDetection: ChangeDetectionStrategy.OnPush,\n encapsulation: ViewEncapsulation.None,\n})\nexport class AXSchedulerMonthViewComponent extends MXBaseComponent {\n private _platform = inject(AXPlatform);\n\n protected _slots: { date: AXDateTime; cssClass: { [key: string]: boolean }; isToday: boolean }[] = [];\n protected get dayNames(): string[] {\n return this._platform.is('SM') ? this.date.calendar.dayNames.map(c => c.letter) : this.date.calendar.dayNames.map(c => c.short);\n }\n\n private _date: AXDateTime;\n @Input()\n public get date(): AXDateTime {\n return this._date;\n }\n public set date(v: AXDateTime) {\n this._date = v;\n this.generateSlots();\n }\n\n ngOnInit() {\n this.generateSlots();\n this._platform.resize.subscribe((c) => {\n this.cdr.markForCheck();\n });\n }\n\n generateSlots() {\n const startDate = this.date.startOf('month').startOf('week');\n const endDate = this.date.endOf('month').endOf('week');\n const range = new AXDateTimeRange(startDate, endDate).enumurate('day');\n this._slots = range.map((c: AXDateTime) => ({\n date: c,\n cssClass: {\n '!ax-bg-neutral-100': c.monthOfYear != this.date.monthOfYear,\n },\n isToday: c.dayOfYear == this.date.dayOfYear,\n }));\n }\n}\n","<div class=\"ax-flex ax-flex-col ax-flex-auto ax-shadow-md\">\n <div class=\"ax-grid ax-grid-cols-7 ax-gap-[1px] ax-w-full ax-bg-neutral-200 ax-border-b\">\n <ng-container *ngFor=\"let item of dayNames\">\n <div class=\"ax-flex ax-items-center ax-justify-center ax-py-2 ax-bg-white ax-font-medium\">\n {{item}}\n </div>\n </ng-container>\n </div>\n <div class=\"ax-flex ax-flex-auto ax-bg-neutral-200\">\n <div class=\"ax-grid ax-grid-cols-7 ax-gap-[1px] ax-w-full\">\n <ng-container *ngFor=\"let item of _slots\">\n <div class=\"ax-py-2 ax-px-3 ax-bg-white ax-cursor-pointer hover:ax-bg-neutral-100\n ax-flex ax-flex-col ax-justify-between\" [ngClass]=\"item.cssClass\">\n <time class=\"ax-text-sm ax-flex ax-items-center ax-justify-center ax-rounded-full ax-w-6 ax-h-6\"\n [class.ax-bg-primary-500]=\"item.isToday\" [class.ax-text-white]=\"item.isToday\"\n datetime=\"item.date.format('dd')\">{{item.date.format('d')}}</time>\n <ol class=\"ax-mt-2 ax-hidden lg:ax-flex ax-flex-col ax-gap-1\">\n <li *ngIf=\"item.date.dayOfMonth % 6 === 0\">\n <a href=\"#\"\n class=\"ax-flex ax-justify-between ax-text-sm ax-bg-primary-500 ax-py-1 ax-px-2 ax-rounded ax-text-primary-fore\">\n <p class=\"ax-text-sm\">Launch Time</p>\n <time class=\"ax-ms-3\" datetime=\"item.date.format('HH A')\">\n {{item.date.format('hh A')}}\n </time>\n </a>\n </li>\n <li *ngIf=\"item.date.dayOfMonth % 5 === 0\">\n <a href=\"#\"\n class=\"ax-flex ax-justify-between ax-text-sm ax-bg-success-500 ax-py-1 ax-px-2 ax-rounded ax-text-success-fore\">\n <p class=\"ax-text-sm\">Daily meeting</p>\n <time class=\"ax-ms-3\" datetime=\"item.date.format('HH A')\">\n {{item.date.format('hh A')}}\n </time>\n </a>\n </li>\n </ol>\n <ol class=\"ax-flex ax-gap-1 ax-self-center md:ax-hidden\">\n <li *ngIf=\"item.date.dayOfMonth % 5 === 0\">\n <span\n class=\"ax-flex ax-w-1.5 ax-h-1.5 ax-rounded-full ax-bg-primary-500 lg:ax-hidden\"></span>\n </li>\n <li *ngIf=\"item.date.dayOfMonth % 6 === 0\">\n <span\n class=\"ax-flex ax-w-1.5 ax-h-1.5 ax-rounded-full ax-bg-danger-500 lg:ax-hidden\"></span>\n </li>\n <li *ngIf=\"item.date.dayOfMonth % 8 === 0\">\n <span\n class=\"ax-flex ax-w-1.5 ax-h-1.5 ax-rounded-full ax-bg-warning-500 lg:ax-hidden\"></span>\n </li>\n <li *ngIf=\"item.date.dayOfMonth % 3 === 0\">\n <span\n class=\"ax-flex ax-w-1.5 ax-h-1.5 ax-rounded-full ax-bg-success-500 lg:ax-hidden\"></span>\n </li>\n </ol>\n </div>\n </ng-container>\n </div>\n </div>\n</div>\n<div class=\"ax-p-4 lg:ax-hidden\">\n <ol\n class=\"ax-flex ax-flex-col ax-rounded-lg ax-border ax-bg-surface ax-divide-y ax-overflow-hidden ax-cursor-pointer\">\n <li class=\"ax-flex ax-items-start ax-justify-between ax-p-4 hover:ax-bg-neutral-100 mobile-task\">\n <div class=\"ax-flex ax-flex-col ax-gap-2\">\n <p class=\"ax-font-medium\">Daily Meeting at the Office</p>\n <div class=\"ax-flex ax-gap-2 ax-items-center\">\n <ax-icon class=\"fa-solid fa-clock ax-text-neutral-400\"></ax-icon>\n <p class=\"ax-text-sm\">3 PM</p>\n </div>\n </div>\n <ax-button text=\"Edit\" class=\"!ax-bg-surface ax-border ax-sm ax-opacity-0\"></ax-button>\n </li>\n </ol>\n</div>","import { MXBaseComponent } from '@acorex/components/common';\nimport { ChangeDetectionStrategy, Component, ViewEncapsulation } from '@angular/core';\n\n@Component({\n selector: 'ax-scheduler-week-view',\n templateUrl: './scheduler-week-view.component.html',\n changeDetection: ChangeDetectionStrategy.OnPush,\n encapsulation: ViewEncapsulation.None,\n})\nexport class AXSchedulerWeekViewComponent extends MXBaseComponent {}\n","<div class=\"ax-flex ax-flex-col ax-flex-auto ax-isolate ax-overflow-auto ax-bg-white\">\n <div class=\"ax-flex ax-flex-col ax-max-w-full\">\n <div class=\"ax-shadow-md ax-pr-8 ax-z-30 ax-sticky ax-top-0\">\n <div class=\"ax-grid ax-leading-6 ax-border-r ax-grid-cols-7\">\n <div class=\"ax-w-14 ax-col-end-1\"></div>\n <div\n class=\"ax-flex ax-items-center ax-justify-center ax-py-3 ax-bg-white ax-font-medium ax-border-l ax-border-r\">\n Mon 10\n </div>\n <div class=\"ax-flex ax-items-center ax-justify-center ax-py-3 ax-bg-white ax-font-medium ax-border-r\">\n Mon 10\n </div>\n <div class=\"ax-flex ax-items-center ax-justify-center ax-py-3 ax-bg-white ax-font-medium ax-border-r\">\n Mon 10\n </div>\n <div class=\"ax-flex ax-items-center ax-justify-center ax-py-3 ax-bg-white ax-font-medium ax-border-r\">\n Mon 10\n </div>\n <div class=\"ax-flex ax-items-center ax-justify-center ax-py-3 ax-bg-white ax-font-medium ax-border-r\">\n Mon 10\n </div>\n <div class=\"ax-flex ax-items-center ax-justify-center ax-py-3 ax-bg-white ax-font-medium ax-border-r\">\n Mon 10\n </div>\n <div class=\"ax-flex ax-items-center ax-justify-center ax-py-3 ax-bg-white ax-font-medium\">\n Mon 10\n </div>\n </div>\n </div>\n <div class=\"ax-flex ax-flex-auto\">\n <div class=\"ax-w-14 ax-z-10 ax-sticky ax-left-0 ax-bg-white ax-shadow\"></div>\n <div class=\"ax-grid ax-flex-auto ax-grid-cols-1 ax-grid-rows-1\">\n <div class=\"ax-grid ax-col-start-1 ax-col-end-2 ax-row-start-1\"\n style=\"grid-template-rows: repeat(45, minmax(3.5rem, 1fr))\">\n <div class=\"ax-row-end-1 ax-h-7\"></div>\n <div class=\"ax-border-t ax-border-b\">\n <div class=\"ax-leading-5 ax-text-right ax-w-14 -ax-mt-[0.625rem] -ax-ml-14 ax-sticky ax-left-0\">\n </div>\n </div>\n </div>\n <div class=\"ax-grid ax-grid-rows-1 ax-grid-cols-7 ax-row-start-1 ax-col-end-2 ax-col-start-1\">\n <div class=\"ax-col-start-1 ax-row-start-1 ax-row-end-[-1]\"></div>\n <div class=\"ax-col-start-2 ax-row-start-1 ax-row-end-[-1] ax-border-l\"></div>\n <div class=\"ax-col-start-3 ax-row-start-1 ax-row-end-[-1] ax-border-l\"></div>\n <div class=\"ax-col-start-4 ax-row-start-1 ax-row-end-[-1] ax-border-l\"></div>\n <div class=\"ax-col-start-5 ax-row-start-1 ax-row-end-[-1] ax-border-l\"></div>\n <div class=\"ax-col-start-6 ax-row-start-1 ax-row-end-[-1] ax-border-l\"></div>\n <div class=\"ax-col-start-7 ax-row-start-1 ax-row-end-[-1] ax-border-l\"></div>\n <div class=\"ax-col-start-8 ax-row-start-1 ax-row-end-[-1] ax-border-l ax-w-8\"></div>\n </div>\n <ol class=\"ax-grid ax-pr-8 ax-grid-cols-7 ax-row-start-1 ax-col-end-2 ax-col-start-2\"\n style=\"grid-template-rows: 1.75rem repeat(288, minmax(0px, 1fr)) auto\"></ol>\n </div>\n </div>\n </div>\n</div>","import { MXBaseComponent } from '@acorex/components/common';\nimport { AXDateTime, AXCalendarService } from '@acorex/core/dateTime';\nimport { AXPlatform, AXScreenSizes } from '@acorex/core/platform';\nimport { ChangeDetectionStrategy, Component, ViewEncapsulation, inject } from '@angular/core';\n\n@Component({\n selector: 'ax-scheduler',\n templateUrl: './scheduler.component.html',\n styleUrls: ['./scheduler.component.scss'],\n changeDetection: ChangeDetectionStrategy.OnPush,\n encapsulation: ViewEncapsulation.None,\n})\nexport class AXSchedulerComponent extends MXBaseComponent {\n\n private _calendarService: AXCalendarService = inject(AXCalendarService);\n protected _platform: AXPlatform = inject(AXPlatform);\n protected current: AXDateTime = this._calendarService.now();\n\n protected _size: AXScreenSizes;\n\n handleOnItemClick() { }\n\n ngOnInit(): void {\n this.detectSize();\n this._platform.resize.subscribe(() => {\n this.detectSize();\n super.cdr.markForCheck();\n });\n }\n\n private detectSize() {\n this._size = this._platform.screenSize;\n console.log(this._size);\n }\n\n _handleNextClick() {\n this.current = this.current.add('month', 1);\n }\n\n _handlePrevClick() {\n this.current = this.current.add('month', -1);\n }\n}\n","<div class=\"ax-flex ax-flex-col ax-h-full\">\n <div class=\"scheduler-header\">\n <p>\n {{ current.format('MMMM yyyy') }}\n </p>\n <div class=\"scheduler-actions\">\n <div class=\"ax-flex ax-border ax-rounded-md ax-items-center ax-px-1 ax-gap-0.5 ax-bg-surface\">\n <button class=\"ax-w-8 ax-h-8 ax-rounded-md hover:ax-bg-neutral-100\" (click)=\"_handlePrevClick()\">\n <ax-icon class=\"fa-solid fa-chevron-left\"> </ax-icon>\n </button>\n <ng-container *ngIf=\"_size === 'SM'; else elseTemplate\">\n <span class=\"ax-text-neutral-200\">|</span>\n </ng-container>\n <ng-template #elseTemplate>\n <ax-button look=\"blank\" class=\"ax-sm\" text=\"Today\"> </ax-button>\n </ng-template>\n <button class=\"ax-w-8 ax-h-8 ax-rounded-md hover:ax-bg-neutral-100\" (click)=\"_handleNextClick()\">\n <ax-icon class=\"fa-solid fa-chevron-right\"> </ax-icon>\n </button>\n </div>\n <ax-button [text]=\"_size === 'SM' ? '' : 'Week View'\" class=\"!ax-bg-surface ax-border\">\n <ax-suffix>\n <ax-icon\n [class]=\"\n _size === 'SM'\n ? 'fa-solid fa-ellipsis-vertical'\n : 'fa-solid fa-chevron-down ax-text-neutral-400'\n \"\n >\n </ax-icon>\n </ax-suffix>\n <ax-dropdown-panel (onItemClick)=\"handleOnItemClick()\" [adaptivityEnabled]=\"true\">\n <ax-button-item\n *ngIf=\"_size === 'SM' || _size === 'MD'\"\n text=\"Add Event\"\n name=\"text\"\n [divided]=\"true\"\n color=\"primary\"\n >\n </ax-button-item>\n <ax-button-item *ngIf=\"_size === 'SM'\" text=\"Go to Today\" name=\"text\" [divided]=\"true\">\n </ax-button-item>\n <ax-button-item text=\"Day View\" name=\"text\"> </ax-button-item>\n <ax-button-item text=\"Week View\" name=\"text\"> </ax-button-item>\n <ax-button-item text=\"Month View\" name=\"text\"> </ax-button-item>\n <ax-button-item text=\"Year View\" name=\"text\"> </ax-button-item>\n </ax-dropdown-panel>\n <ax-suffix>\n <ax-icon icon=\"\"></ax-icon>\n </ax-suffix>\n </ax-button>\n <ax-button color=\"primary\" text=\"Add Event\" class=\"ax-hidden lg:ax-block\">\n <ax-prefix>\n <ax-icon class=\"fa-solid fa-plus\"></ax-icon>\n </ax-prefix>\n </ax-button>\n </div>\n </div>\n <!-- <ax-scheduler-month-view [date]=\"current\"></ax-scheduler-month-view> -->\n <ax-scheduler-week-view></ax-scheduler-week-view>\n</div>\n","import { AXButtonModule } from '@acorex/components/button';\nimport { AXDecoratorModule } from '@acorex/components/decorators';\nimport { AXDropdownModule } from '@acorex/components/dropdown';\nimport { AXDateTimeModule } from '@acorex/core/dateTime';\nimport { CommonModule } from '@angular/common';\nimport { NgModule } from '@angular/core';\nimport { AXSchedulerMonthViewComponent } from './scheduler-month-view.component';\nimport { AXSchedulerWeekViewComponent } from './scheduler-week-view.component';\nimport { AXSchedulerComponent } from './scheduler.component';\n\nconst COMPONENT = [AXSchedulerComponent, AXSchedulerMonthViewComponent, AXSchedulerWeekViewComponent];\nconst MODULES = [CommonModule, AXButtonModule, AXDecoratorModule, AXDropdownModule, AXDateTimeModule];\n\n@NgModule({\n declarations: [...COMPONENT],\n imports: [...MODULES],\n exports: [...COMPONENT],\n providers: [],\n})\nexport class AXSchedulerModule {}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":["i5.AXSchedulerWeekViewComponent"],"mappings":"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"}
@@ -32,10 +32,10 @@ class AXSearchBoxComponent extends MXInputBaseValueComponent {
32
32
  _handleClearClick() {
33
33
  this.clear(true);
34
34
  }
35
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.7", ngImport: i0, type: AXSearchBoxComponent, deps: [{ token: AXSearchableComponent, optional: true }], target: i0.ɵɵFactoryTarget.Component }); }
36
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.7", type: AXSearchBoxComponent, selector: "ax-search-box", inputs: { disabled: "disabled", tabIndex: "tabIndex", readonly: "readonly", value: "value", state: "state", name: "name", id: "id", placeholder: "placeholder", delayTime: "delayTime" }, outputs: { onBlur: "onBlur", onFocus: "onFocus", valueChange: "valueChange", stateChange: "stateChange", onValueChanged: "onValueChanged", readonlyChange: "readonlyChange", disabledChange: "disabledChange" }, host: { classAttribute: "ax-editor-container" }, usesInheritance: true, ngImport: i0, template: "<ng-content select=\"ax-prefix\">\n</ng-content>\n<span class=\"ax-icon ax-icon-search ax-editor-control\"></span>\n<input #input class=\"ax-input\" [attr.name]=\"name\" [attr.placeholder]=\"placeholder\" [class.ax-state-disabled]=\"disabled\"\n [class.ax-state-readonly]=\"readonly\" [disabled]=\"disabled\" [readonly]=\"readonly\" [tabindex]=\"tabIndex\"\n [ngModel]=\"value\" [delayTime]=\"delayTime\" (delayedValueChanged)=\"_handleModelChange($event)\"\n (keydown)=\"emitOnKeydownEvent($event)\" (keyup)=\"emitOnKeyupEvent($event)\" (keypress)=\"emitOnKeypressEvent($event)\"\n (focus)=\"emitOnFocusEvent($event)\" (blur)=\"emitOnBlurEvent($event)\">\n<button type=\"button\" *ngIf=\"value\" class=\"ax-general-button ax-button-icon\" (click)=\"_handleClearClick()\">\n <span class=\"ax-icon ax-icon-close\"></span>\n</button>\n<ng-content select=\"ax-suffix\">\n</ng-content>", dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i3.AXNgModelDelayedValueChangedDirective, selector: "[delayedValueChanged]", inputs: ["delayTime"], outputs: ["delayedValueChanged", "delayTimeChange"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
35
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.9", ngImport: i0, type: AXSearchBoxComponent, deps: [{ token: AXSearchableComponent, optional: true }], target: i0.ɵɵFactoryTarget.Component }); }
36
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.9", type: AXSearchBoxComponent, selector: "ax-search-box", inputs: { disabled: "disabled", tabIndex: "tabIndex", readonly: "readonly", value: "value", state: "state", name: "name", id: "id", placeholder: "placeholder", delayTime: "delayTime" }, outputs: { onBlur: "onBlur", onFocus: "onFocus", valueChange: "valueChange", stateChange: "stateChange", onValueChanged: "onValueChanged", readonlyChange: "readonlyChange", disabledChange: "disabledChange" }, host: { classAttribute: "ax-editor-container" }, usesInheritance: true, ngImport: i0, template: "<ng-content select=\"ax-prefix\">\n</ng-content>\n<span class=\"ax-icon ax-icon-search ax-editor-control\"></span>\n<input #input class=\"ax-input\" [attr.name]=\"name\" [attr.placeholder]=\"placeholder\" [class.ax-state-disabled]=\"disabled\"\n [class.ax-state-readonly]=\"readonly\" [disabled]=\"disabled\" [readonly]=\"readonly\" [tabindex]=\"tabIndex\"\n [ngModel]=\"value\" [delayTime]=\"delayTime\" (delayedValueChanged)=\"_handleModelChange($event)\"\n (keydown)=\"emitOnKeydownEvent($event)\" (keyup)=\"emitOnKeyupEvent($event)\" (keypress)=\"emitOnKeypressEvent($event)\"\n (focus)=\"emitOnFocusEvent($event)\" (blur)=\"emitOnBlurEvent($event)\">\n<button type=\"button\" *ngIf=\"value\" class=\"ax-general-button ax-button-icon\" (click)=\"_handleClearClick()\">\n <span class=\"ax-icon ax-icon-close\"></span>\n</button>\n<ng-content select=\"ax-suffix\">\n</ng-content>", dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i3.AXNgModelDelayedValueChangedDirective, selector: "[delayedValueChanged]", inputs: ["delayTime"], outputs: ["delayedValueChanged", "delayTimeChange"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
37
37
  }
38
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.7", ngImport: i0, type: AXSearchBoxComponent, decorators: [{
38
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.9", ngImport: i0, type: AXSearchBoxComponent, decorators: [{
39
39
  type: Component,
40
40
  args: [{ selector: 'ax-search-box', changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, inputs: [
41
41
  'disabled',
@@ -67,22 +67,22 @@ const MODULES = [
67
67
  AXNgModelDelayedValueChangedDirective
68
68
  ];
69
69
  class AXSearchBoxModule {
70
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.7", ngImport: i0, type: AXSearchBoxModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
71
- static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "16.1.7", ngImport: i0, type: AXSearchBoxModule, declarations: [AXSearchBoxComponent], imports: [CommonModule,
70
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.9", ngImport: i0, type: AXSearchBoxModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
71
+ static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "16.1.9", ngImport: i0, type: AXSearchBoxModule, declarations: [AXSearchBoxComponent], imports: [CommonModule,
72
72
  FormsModule,
73
73
  AXTranslationModule,
74
74
  AXDecoratorModule,
75
75
  AXTextBoxModule,
76
76
  AXButtonModule,
77
77
  AXNgModelDelayedValueChangedDirective], exports: [AXSearchBoxComponent] }); }
78
- static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "16.1.7", ngImport: i0, type: AXSearchBoxModule, imports: [CommonModule,
78
+ static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "16.1.9", ngImport: i0, type: AXSearchBoxModule, imports: [CommonModule,
79
79
  FormsModule,
80
80
  AXTranslationModule,
81
81
  AXDecoratorModule,
82
82
  AXTextBoxModule,
83
83
  AXButtonModule] }); }
84
84
  }
85
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.7", ngImport: i0, type: AXSearchBoxModule, decorators: [{
85
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.9", ngImport: i0, type: AXSearchBoxModule, decorators: [{
86
86
  type: NgModule,
87
87
  args: [{
88
88
  declarations: [...COMPONENT],
@@ -56,7 +56,7 @@ class AXSelectBoxComponent extends AXBaseSelectionDropdownMixin {
56
56
  this._isActionSheet = this._platform.is('SM');
57
57
  this._platform.resize.subscribe(() => {
58
58
  this._isActionSheet = this._platform.is('SM');
59
- this.popover.dispose();
59
+ this.popover.close();
60
60
  this._detectPopupSize();
61
61
  });
62
62
  }
@@ -315,14 +315,14 @@ class AXSelectBoxComponent extends AXBaseSelectionDropdownMixin {
315
315
  _fetchData() {
316
316
  super._fetchData({ searchQuery: this._searchBox?.value });
317
317
  }
318
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.7", ngImport: i0, type: AXSelectBoxComponent, deps: [{ token: i0.ElementRef }, { token: i0.ChangeDetectorRef }, { token: i0.NgZone }, { token: i1.AXPlatform }], target: i0.ɵɵFactoryTarget.Component }); }
319
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.7", type: AXSelectBoxComponent, selector: "ax-select-box", inputs: { isOpen: "isOpen", fitParent: "fitParent", dropdownWidth: "dropdownWidth", position: "position", disabled: "disabled", tabIndex: "tabIndex", allowNull: "allowNull", value: "value", name: "name", checked: "checked", placeholder: "placeholder", maxLength: "maxLength", type: "type", autoComplete: "autoComplete", readonly: "readonly", pageSize: "pageSize", items: "items", valueField: "valueField", textField: "textField", disabledField: "disabledField", disabledCallback: "disabledCallback", multiple: "multiple", selectionMode: "selectionMode", clearButton: "clearButton", checkbox: "checkbox" }, outputs: { onOpened: "onOpened", onClosed: "onClosed", onBlur: "onBlur", onFocus: "onFocus", valueChange: "valueChange", onValueChanged: "onValueChanged" }, host: { listeners: { "keydown": "_handleKeydown($event)" }, classAttribute: "ax-editor-container ax-drop-down" }, providers: [
318
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.9", ngImport: i0, type: AXSelectBoxComponent, deps: [{ token: i0.ElementRef }, { token: i0.ChangeDetectorRef }, { token: i0.NgZone }, { token: i1.AXPlatform }], target: i0.ɵɵFactoryTarget.Component }); }
319
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.9", type: AXSelectBoxComponent, selector: "ax-select-box", inputs: { isOpen: "isOpen", fitParent: "fitParent", dropdownWidth: "dropdownWidth", position: "position", disabled: "disabled", tabIndex: "tabIndex", allowNull: "allowNull", value: "value", name: "name", checked: "checked", placeholder: "placeholder", maxLength: "maxLength", type: "type", autoComplete: "autoComplete", readonly: "readonly", pageSize: "pageSize", items: "items", valueField: "valueField", textField: "textField", disabledField: "disabledField", disabledCallback: "disabledCallback", multiple: "multiple", selectionMode: "selectionMode", clearButton: "clearButton", checkbox: "checkbox" }, outputs: { onOpened: "onOpened", onClosed: "onClosed", onBlur: "onBlur", onFocus: "onFocus", valueChange: "valueChange", onValueChanged: "onValueChanged" }, host: { listeners: { "keydown": "_handleKeydown($event)" }, classAttribute: "ax-editor-container ax-drop-down" }, providers: [
320
320
  { provide: AXClosbaleComponent, useExisting: AXSelectBoxComponent },
321
321
  { provide: AXSearchableComponent, useExisting: AXSelectBoxComponent },
322
322
  { provide: AXValuableComponent, useExisting: AXSelectBoxComponent },
323
- ], queries: [{ propertyName: "_searchBox", first: true, predicate: AXSearchBoxComponent, descendants: true, static: true }, { propertyName: "_contentEmptyTemplate", first: true, predicate: ["emptyTemplate"], descendants: true }], viewQueries: [{ propertyName: "popover", first: true, predicate: AXPopoverComponent, descendants: true, static: true }, { propertyName: "listContainer", first: true, predicate: ["listContainer"], descendants: true, static: true }], usesInheritance: true, ngImport: i0, template: "<ng-content select=\"ax-prefix\"> </ng-content>\n<div class=\"ax-dropdown-content\" [class.ax-state-disabled]=\"disabled\" (click)=\"_handleInputClickEvent($event)\">\n <div class=\"ax-select-box-selection\" [tabindex]=\"tabIndex\" (focus)=\"_emitOnFocusEvent($event)\"\n (blur)=\"_emitOnBlurEvent($event)\">\n <ng-container *ngIf=\"selectedItems && selectedItems.length; else showPlaceholder\">\n <ng-container *ngIf=\"!multiple; then singleSelectedTemplate; else multipleSelectedTemplate\"></ng-container>\n <ng-template #singleSelectedTemplate>\n <ng-container *ngFor=\"let item of selectedItems\">\n <span> {{ _getItemDisplayTextTemplte(item) }}</span>\n </ng-container>\n </ng-template>\n <ng-template #multipleSelectedTemplate>\n <div class=\"ax-select-box-multi-selection\">\n <ng-container *ngFor=\"let item of selectedItems\">\n <div class=\"ax-select-multi-item\">\n {{ _getItemDisplayTextTemplte(item) }}\n <span class=\"ax-icon ax-icon-close\" (click)=\"_handleBadgeRemove($event, item)\"> </span>\n </div>\n </ng-container>\n </div>\n </ng-template>\n </ng-container>\n <ng-template #showPlaceholder>\n <div class=\"ax-placeholder\" role=\"textbox\" area-readonly=\"true\">\n {{ placeholder }}\n </div>\n </ng-template>\n </div>\n</div>\n<button type=\"button\" class=\"ax-general-button ax-button-icon\" (click)=\"clear()\" [tabIndex]=\"-1\"\n *ngIf=\"value && clearButton && !(disabled || readonly)\">\n <span class=\"ax-icon ax-icon-close\"></span>\n</button>\n<button type=\"button\" [disabled]=\"disabled\" [tabIndex]=\"-1\" class=\"ax-general-button ax-button-icon\"\n (click)=\"_handleArrowClickEvent($event)\">\n <ng-container *ngIf=\"isLoading && !this.popover.isOpen; else iconTemplate\">\n <ax-loading type=\"spinner\"></ax-loading>\n </ng-container>\n <ng-template #iconTemplate>\n <span class=\"ax-icon ax-icon-chevron-left ax-transition-all\" [ngClass]=\"{\n '-ax-rotation-90': !isOpen,\n 'ax-rotation-90': isOpen\n }\"></span>\n </ng-template>\n</button>\n<ng-content select=\"ax-validation-rule\"> </ng-content>\n<ng-content select=\"ax-suffix\"> </ng-content>\n<ax-popover [target]=\"_target\" [position]=\"position\" [openTrigger]=\"'manual'\" [closeTrigger]=\"'clickout'\"\n [adaptivityEnabled]=\"true\" (onOpened)=\"_handlePopupOnOpened($event)\" (onClosed)=\"_handlePopupOnClosed($event)\">\n <div class=\"ax-overlay-pane\" (keydown)=\"_handlePopoverKeydown($event)\" tabindex=\"0\" aria-modal=\"true\" cdkTrapFocus\n [class.ax-overlay-actionsheet]=\"_isActionSheet\" [class.ax-full]=\"_searchBox || isLazy\"\n [style.min-width.px]=\"_popoverWidth\">\n <div class=\"ax-list\">\n <ax-header *ngIf=\"_isActionSheet\">\n <ax-title>{{ _popoverTitle }}</ax-title>\n <ax-close-button class=\"ax-icon\"\n [icon]=\"multiple ? 'ax-icon-done !ax-text-primary-500' : 'ax-icon-close'\"></ax-close-button>\n </ax-header>\n <div class=\"ax-search-box-container\" [class.ax-state-hidden]=\"!_searchBox\" [cdkTrapFocus]=\"_searchBox != null\">\n <ng-content select=\"ax-search-box\"></ng-content>\n </div>\n <div class=\"ax-content ax-list-items-container ax-default\" (scroll)=\"_handleListScroll($event)\" #listContainer>\n <ng-container *ngIf=\"displayItems.length; else tmpEmpty\">\n <ul>\n <ng-container *ngTemplateOutlet=\"tmpTree; context: { list: displayItems }\"> </ng-container>\n <ng-template #tmpTree let-list=\"list\">\n <ng-container *ngFor=\"let item of list; let i = index; trackBy: _trackByFunction\">\n <ng-container *ngIf=\"itemTemplate; else defualtTemplate\">\n <li class=\"ax-list-item\" (click)=\"_handleOnItemClick($event, item)\"\n [attr.data-id]=\"item[this.valueField]\">\n <ng-container *ngTemplateOutlet=\"itemTemplate; context: { $implicit: item, direction: direction }\">\n </ng-container>\n </li>\n </ng-container>\n <ng-template #defualtTemplate>\n <ng-container *ngIf=\"item.children?.length > 0; else tmpItem\">\n <li class=\"ax-list-item-group\" [attr.data-id]=\"item[this.valueField]\">\n <span> {{ _getItemDisplayTextTemplte(item) }}</span>\n <ul *ngIf=\"item.children?.length > 0\">\n <ng-container *ngTemplateOutlet=\"tmpTree; context: { list: item.children }\"> </ng-container>\n </ul>\n </li>\n </ng-container>\n <ng-template #tmpItem>\n <ng-container *ngIf=\"!multiple; else multipleTemplate\">\n <li class=\"ax-list-item\" [class.ax-state-selected]=\"isItemSelected(item)\"\n [class.ax-state-disabled]=\"isItemDisabled(item)\" [attr.tabindex]=\"i\"\n (click)=\"_handleOnItemClick($event, item)\" [attr.data-id]=\"item[this.valueField]\">\n <span> {{ _getItemDisplayTextTemplte(item) }}</span>\n <span class=\"ax-icon ax-icon-done ax-selected-icon\" *ngIf=\"isItemSelected(item)\"></span>\n </li>\n </ng-container>\n <ng-template #multipleTemplate>\n <li class=\"ax-list-item\" [class.ax-state-selected]=\"isItemSelected(item)\"\n [class.ax-state-disabled]=\"isItemDisabled(item)\" [class.ax-state-checkbox]=\"checkbox\"\n [attr.tabindex]=\"i\" (click)=\"_handleOnItemClick($event, item)\"\n [attr.data-id]=\"item[this.valueField]\">\n <span>\n <input class=\"ax-checkbox\" type=\"checkbox\" [class.ax-state-disabled]=\"isItemDisabled(item)\"\n *ngIf=\"checkbox\" [checked]=\"isItemSelected(item)\" [disabled]=\"isItemDisabled(item)\" />\n <span class=\"ax-checkbox-label\">{{ _getItemDisplayTextTemplte(item) }}</span>\n </span>\n <span class=\"ax-icon ax-icon-done ax-selected-icon\"\n *ngIf=\"isItemSelected(item) && !checkbox\"></span>\n </li>\n </ng-template>\n </ng-template>\n </ng-template>\n </ng-container>\n </ng-template>\n </ul>\n </ng-container>\n <ng-container *ngIf=\"isLoading\">\n <ng-container *ngIf=\"loadingTemplate; else elseLoadingTemplate\">\n <ng-container *ngTemplateOutlet=\"loadingTemplate\"> </ng-container>\n </ng-container>\n <ng-template #elseLoadingTemplate>\n <div class=\"ax-flex ax-items-center ax-justify-center ax-p-4\">\n <ax-loading [context]=\"_loadingOptions\"></ax-loading>\n </div>\n </ng-template>\n </ng-container>\n <ng-template #tmpEmpty>\n <ng-container *ngIf=\"!isLoading\">\n <ng-container *ngIf=\"emptyTemplate; else elseEmptyTemplate\">\n <ng-container *ngTemplateOutlet=\"emptyTemplate\"> </ng-container>\n </ng-container>\n <ng-template #elseEmptyTemplate>\n <div class=\"ax-flex ax-items-center ax-justify-center ax-p-4\" [innerHTML]=\"\n 'common.no-result-for'\n | trans\n : {\n exp: this._searchBox ? this._searchBox.value : ''\n }\n \"></div>\n </ng-template>\n </ng-container>\n </ng-template>\n </div>\n <!-- <div class=\"ax-list-items-container ax-vertical ax-default\" [class.ax-full]=\"_isMobile\"\n >\n \n </div> -->\n <!-- <div class=\"ax-footer\">footer</div> -->\n </div>\n </div>\n</ax-popover>", styles: ["ax-select-box .ax-select-multi-item{display:flex;align-items:center;padding:.25rem .5rem;background-color:rgba(var(--ax-color-default));color:rgba(var(--ax-color-default-fore));border-radius:var(--ax-rounded-border-default);margin-inline-end:.5rem}ax-select-box .ax-select-multi-item .ax-icon-close{cursor:pointer;margin-inline-start:.5rem}ax-select-box .ax-select-box-selection{display:flex;justify-content:center;align-items:center;outline-color:transparent;outline:transparent;-webkit-user-select:none;user-select:none}ax-select-box .ax-select-box-selection>span{padding-inline-start:1rem;padding-inline-end:.75rem;white-space:nowrap}ax-select-box .ax-select-box-selection .ax-selectbox-input{opacity:0;width:0}ax-select-box .ax-select-box-multi-selection{padding:0 .5rem;display:flex;justify-content:center;align-items:center}ax-select-box .ax-placeholder{padding-inline-start:1rem;padding-inline-end:.75rem}\n"], dependencies: [{ kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: i3.AXDecoratorCloseButtonComponent, selector: "ax-close-button", inputs: ["icon"] }, { kind: "component", type: i3.AXDecoratorGenericComponent, selector: "ax-footer, ax-header, ax-content, ax-divider, ax-form-hint, ax-prefix, ax-suffix, ax-text, ax-title , ax-sub-title" }, { kind: "component", type: i4.AXPopoverComponent, selector: "ax-popover", inputs: ["target", "position", "openTrigger", "closeTrigger", "hasBackdrop", "backdropClass", "adaptivityEnabled"], outputs: ["onOpened", "onClosed"] }, { kind: "component", type: i5.AXLoadingComponent, selector: "ax-loading", inputs: ["visible", "type", "context"], outputs: ["visibleChange"] }, { kind: "directive", type: i6.CdkTrapFocus, selector: "[cdkTrapFocus]", inputs: ["cdkTrapFocus", "cdkTrapFocusAutoCapture"], exportAs: ["cdkTrapFocus"] }, { kind: "pipe", type: i7.AXTranslatorPipe, name: "trans" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
323
+ ], queries: [{ propertyName: "_searchBox", first: true, predicate: AXSearchBoxComponent, descendants: true, static: true }, { propertyName: "_contentEmptyTemplate", first: true, predicate: ["emptyTemplate"], descendants: true }], viewQueries: [{ propertyName: "popover", first: true, predicate: AXPopoverComponent, descendants: true, static: true }, { propertyName: "listContainer", first: true, predicate: ["listContainer"], descendants: true, static: true }], usesInheritance: true, ngImport: i0, template: "<ng-content select=\"ax-prefix\"> </ng-content>\n<div class=\"ax-dropdown-content\" [class.ax-state-disabled]=\"disabled\" (click)=\"_handleInputClickEvent($event)\">\n <div class=\"ax-select-box-selection\" [tabindex]=\"tabIndex\" (focus)=\"_emitOnFocusEvent($event)\"\n (blur)=\"_emitOnBlurEvent($event)\">\n <ng-container *ngIf=\"selectedItems && selectedItems.length; else showPlaceholder\">\n <ng-container *ngIf=\"!multiple; then singleSelectedTemplate; else multipleSelectedTemplate\"></ng-container>\n <ng-template #singleSelectedTemplate>\n <ng-container *ngFor=\"let item of selectedItems\">\n <span> {{ _getItemDisplayTextTemplte(item) }}</span>\n </ng-container>\n </ng-template>\n <ng-template #multipleSelectedTemplate>\n <div class=\"ax-select-box-multi-selection\">\n <ng-container *ngFor=\"let item of selectedItems\">\n <div class=\"ax-select-multi-item\">\n {{ _getItemDisplayTextTemplte(item) }}\n <span class=\"ax-icon ax-icon-close\" (click)=\"_handleBadgeRemove($event, item)\"> </span>\n </div>\n </ng-container>\n </div>\n </ng-template>\n </ng-container>\n <ng-template #showPlaceholder>\n <div class=\"ax-placeholder\" role=\"textbox\" area-readonly=\"true\">\n {{ placeholder }}\n </div>\n </ng-template>\n </div>\n</div>\n<button type=\"button\" class=\"ax-general-button ax-button-icon\" (click)=\"clear()\" [tabIndex]=\"-1\"\n *ngIf=\"value && clearButton && !(disabled || readonly)\">\n <span class=\"ax-icon ax-icon-close\"></span>\n</button>\n<button type=\"button\" [disabled]=\"disabled\" [tabIndex]=\"-1\" class=\"ax-general-button ax-button-icon\"\n (click)=\"_handleArrowClickEvent($event)\">\n <ng-container *ngIf=\"isLoading && !this.popover.isOpen; else iconTemplate\">\n <ax-loading type=\"spinner\"></ax-loading>\n </ng-container>\n <ng-template #iconTemplate>\n <span class=\"ax-icon ax-icon-chevron-left ax-transition-all\" [ngClass]=\"{\n '-ax-rotation-90': !isOpen,\n 'ax-rotation-90': isOpen\n }\"></span>\n </ng-template>\n</button>\n<ng-content select=\"ax-validation-rule\"> </ng-content>\n<ng-content select=\"ax-suffix\"> </ng-content>\n<ax-popover [target]=\"_target\" [placement]=\"position\" [openOn]=\"'manual'\" [closeOn]=\"'clickout'\"\n [adaptivityEnabled]=\"true\" (onOpened)=\"_handlePopupOnOpened($event)\" (onClosed)=\"_handlePopupOnClosed($event)\">\n <div class=\"ax-overlay-pane\" (keydown)=\"_handlePopoverKeydown($event)\" tabindex=\"0\" aria-modal=\"true\" cdkTrapFocus\n [class.ax-overlay-actionsheet]=\"_isActionSheet\" [class.ax-full]=\"_searchBox || isLazy\"\n [style.min-width.px]=\"_popoverWidth\">\n <div class=\"ax-list\">\n <ax-header *ngIf=\"_isActionSheet\">\n <ax-title>{{ _popoverTitle }}</ax-title>\n <ax-close-button class=\"ax-icon\"\n [icon]=\"multiple ? 'ax-icon-done !ax-text-primary-500' : 'ax-icon-close'\"></ax-close-button>\n </ax-header>\n <div class=\"ax-search-box-container\" [class.ax-state-hidden]=\"!_searchBox\" [cdkTrapFocus]=\"_searchBox != null\">\n <ng-content select=\"ax-search-box\"></ng-content>\n </div>\n <div class=\"ax-content ax-list-items-container ax-default\" (scroll)=\"_handleListScroll($event)\" #listContainer>\n <ng-container *ngIf=\"displayItems.length; else tmpEmpty\">\n <ul>\n <ng-container *ngTemplateOutlet=\"tmpTree; context: { list: displayItems }\"> </ng-container>\n <ng-template #tmpTree let-list=\"list\">\n <ng-container *ngFor=\"let item of list; let i = index; trackBy: _trackByFunction\">\n <ng-container *ngIf=\"itemTemplate; else defualtTemplate\">\n <li class=\"ax-list-item\" (click)=\"_handleOnItemClick($event, item)\"\n [attr.data-id]=\"item[this.valueField]\">\n <ng-container *ngTemplateOutlet=\"itemTemplate; context: { $implicit: item, direction: direction }\">\n </ng-container>\n </li>\n </ng-container>\n <ng-template #defualtTemplate>\n <ng-container *ngIf=\"item.children?.length > 0; else tmpItem\">\n <li class=\"ax-list-item-group\" [attr.data-id]=\"item[this.valueField]\">\n <span> {{ _getItemDisplayTextTemplte(item) }}</span>\n <ul *ngIf=\"item.children?.length > 0\">\n <ng-container *ngTemplateOutlet=\"tmpTree; context: { list: item.children }\"> </ng-container>\n </ul>\n </li>\n </ng-container>\n <ng-template #tmpItem>\n <ng-container *ngIf=\"!multiple; else multipleTemplate\">\n <li class=\"ax-list-item\" [class.ax-state-selected]=\"isItemSelected(item)\"\n [class.ax-state-disabled]=\"isItemDisabled(item)\" [attr.tabindex]=\"i\"\n (click)=\"_handleOnItemClick($event, item)\" [attr.data-id]=\"item[this.valueField]\">\n <span> {{ _getItemDisplayTextTemplte(item) }}</span>\n <span class=\"ax-icon ax-icon-done ax-selected-icon\" *ngIf=\"isItemSelected(item)\"></span>\n </li>\n </ng-container>\n <ng-template #multipleTemplate>\n <li class=\"ax-list-item\" [class.ax-state-selected]=\"isItemSelected(item)\"\n [class.ax-state-disabled]=\"isItemDisabled(item)\" [class.ax-state-checkbox]=\"checkbox\"\n [attr.tabindex]=\"i\" (click)=\"_handleOnItemClick($event, item)\"\n [attr.data-id]=\"item[this.valueField]\">\n <span>\n <input class=\"ax-checkbox\" type=\"checkbox\" [class.ax-state-disabled]=\"isItemDisabled(item)\"\n *ngIf=\"checkbox\" [checked]=\"isItemSelected(item)\" [disabled]=\"isItemDisabled(item)\" />\n <span class=\"ax-checkbox-label\">{{ _getItemDisplayTextTemplte(item) }}</span>\n </span>\n <span class=\"ax-icon ax-icon-done ax-selected-icon\"\n *ngIf=\"isItemSelected(item) && !checkbox\"></span>\n </li>\n </ng-template>\n </ng-template>\n </ng-template>\n </ng-container>\n </ng-template>\n </ul>\n </ng-container>\n <ng-container *ngIf=\"isLoading\">\n <ng-container *ngIf=\"loadingTemplate; else elseLoadingTemplate\">\n <ng-container *ngTemplateOutlet=\"loadingTemplate\"> </ng-container>\n </ng-container>\n <ng-template #elseLoadingTemplate>\n <div class=\"ax-flex ax-items-center ax-justify-center ax-p-4\">\n <ax-loading [context]=\"_loadingOptions\"></ax-loading>\n </div>\n </ng-template>\n </ng-container>\n <ng-template #tmpEmpty>\n <ng-container *ngIf=\"!isLoading\">\n <ng-container *ngIf=\"emptyTemplate; else elseEmptyTemplate\">\n <ng-container *ngTemplateOutlet=\"emptyTemplate\"> </ng-container>\n </ng-container>\n <ng-template #elseEmptyTemplate>\n <div class=\"ax-flex ax-items-center ax-justify-center ax-p-4\" [innerHTML]=\"\n 'common.no-result-for'\n | trans\n : {\n exp: this._searchBox ? this._searchBox.value : ''\n }\n \"></div>\n </ng-template>\n </ng-container>\n </ng-template>\n </div>\n <!-- <div class=\"ax-list-items-container ax-vertical ax-default\" [class.ax-full]=\"_isMobile\"\n >\n \n </div> -->\n <!-- <div class=\"ax-footer\">footer</div> -->\n </div>\n </div>\n</ax-popover>", styles: ["ax-select-box .ax-select-multi-item{display:flex;align-items:center;padding:.25rem .5rem;background-color:rgba(var(--ax-color-default));color:rgba(var(--ax-color-default-fore));border-radius:var(--ax-rounded-border-default);margin-inline-end:.5rem}ax-select-box .ax-select-multi-item .ax-icon-close{cursor:pointer;margin-inline-start:.5rem}ax-select-box .ax-select-box-selection{display:flex;justify-content:center;align-items:center;outline-color:transparent;outline:transparent;-webkit-user-select:none;user-select:none}ax-select-box .ax-select-box-selection>span{padding-inline-start:1rem;padding-inline-end:.75rem;white-space:nowrap}ax-select-box .ax-select-box-selection .ax-selectbox-input{opacity:0;width:0}ax-select-box .ax-select-box-multi-selection{padding:0 .5rem;display:flex;justify-content:center;align-items:center}ax-select-box .ax-placeholder{padding-inline-start:1rem;padding-inline-end:.75rem}\n"], dependencies: [{ kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: i3.AXDecoratorCloseButtonComponent, selector: "ax-close-button", inputs: ["icon"] }, { kind: "component", type: i3.AXDecoratorGenericComponent, selector: "ax-footer, ax-header, ax-content, ax-divider, ax-form-hint, ax-prefix, ax-suffix, ax-text, ax-title , ax-sub-title" }, { kind: "component", type: i4.AXPopoverComponent, selector: "ax-popover", inputs: ["offsetX", "offsetY", "target", "placement", "content", "openOn", "closeOn", "hasBackdrop", "backdropClass", "adaptivityEnabled"], outputs: ["onOpened", "onClosed"] }, { kind: "component", type: i5.AXLoadingComponent, selector: "ax-loading", inputs: ["visible", "type", "context"], outputs: ["visibleChange"] }, { kind: "directive", type: i6.CdkTrapFocus, selector: "[cdkTrapFocus]", inputs: ["cdkTrapFocus", "cdkTrapFocusAutoCapture"], exportAs: ["cdkTrapFocus"] }, { kind: "pipe", type: i7.AXTranslatorPipe, name: "trans" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
324
324
  }
325
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.7", ngImport: i0, type: AXSelectBoxComponent, decorators: [{
325
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.9", ngImport: i0, type: AXSelectBoxComponent, decorators: [{
326
326
  type: Component,
327
327
  args: [{ selector: 'ax-select-box', inputs: [
328
328
  'isOpen',
@@ -352,7 +352,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.7", ngImpor
352
352
  { provide: AXClosbaleComponent, useExisting: AXSelectBoxComponent },
353
353
  { provide: AXSearchableComponent, useExisting: AXSelectBoxComponent },
354
354
  { provide: AXValuableComponent, useExisting: AXSelectBoxComponent },
355
- ], host: { class: 'ax-editor-container ax-drop-down' }, template: "<ng-content select=\"ax-prefix\"> </ng-content>\n<div class=\"ax-dropdown-content\" [class.ax-state-disabled]=\"disabled\" (click)=\"_handleInputClickEvent($event)\">\n <div class=\"ax-select-box-selection\" [tabindex]=\"tabIndex\" (focus)=\"_emitOnFocusEvent($event)\"\n (blur)=\"_emitOnBlurEvent($event)\">\n <ng-container *ngIf=\"selectedItems && selectedItems.length; else showPlaceholder\">\n <ng-container *ngIf=\"!multiple; then singleSelectedTemplate; else multipleSelectedTemplate\"></ng-container>\n <ng-template #singleSelectedTemplate>\n <ng-container *ngFor=\"let item of selectedItems\">\n <span> {{ _getItemDisplayTextTemplte(item) }}</span>\n </ng-container>\n </ng-template>\n <ng-template #multipleSelectedTemplate>\n <div class=\"ax-select-box-multi-selection\">\n <ng-container *ngFor=\"let item of selectedItems\">\n <div class=\"ax-select-multi-item\">\n {{ _getItemDisplayTextTemplte(item) }}\n <span class=\"ax-icon ax-icon-close\" (click)=\"_handleBadgeRemove($event, item)\"> </span>\n </div>\n </ng-container>\n </div>\n </ng-template>\n </ng-container>\n <ng-template #showPlaceholder>\n <div class=\"ax-placeholder\" role=\"textbox\" area-readonly=\"true\">\n {{ placeholder }}\n </div>\n </ng-template>\n </div>\n</div>\n<button type=\"button\" class=\"ax-general-button ax-button-icon\" (click)=\"clear()\" [tabIndex]=\"-1\"\n *ngIf=\"value && clearButton && !(disabled || readonly)\">\n <span class=\"ax-icon ax-icon-close\"></span>\n</button>\n<button type=\"button\" [disabled]=\"disabled\" [tabIndex]=\"-1\" class=\"ax-general-button ax-button-icon\"\n (click)=\"_handleArrowClickEvent($event)\">\n <ng-container *ngIf=\"isLoading && !this.popover.isOpen; else iconTemplate\">\n <ax-loading type=\"spinner\"></ax-loading>\n </ng-container>\n <ng-template #iconTemplate>\n <span class=\"ax-icon ax-icon-chevron-left ax-transition-all\" [ngClass]=\"{\n '-ax-rotation-90': !isOpen,\n 'ax-rotation-90': isOpen\n }\"></span>\n </ng-template>\n</button>\n<ng-content select=\"ax-validation-rule\"> </ng-content>\n<ng-content select=\"ax-suffix\"> </ng-content>\n<ax-popover [target]=\"_target\" [position]=\"position\" [openTrigger]=\"'manual'\" [closeTrigger]=\"'clickout'\"\n [adaptivityEnabled]=\"true\" (onOpened)=\"_handlePopupOnOpened($event)\" (onClosed)=\"_handlePopupOnClosed($event)\">\n <div class=\"ax-overlay-pane\" (keydown)=\"_handlePopoverKeydown($event)\" tabindex=\"0\" aria-modal=\"true\" cdkTrapFocus\n [class.ax-overlay-actionsheet]=\"_isActionSheet\" [class.ax-full]=\"_searchBox || isLazy\"\n [style.min-width.px]=\"_popoverWidth\">\n <div class=\"ax-list\">\n <ax-header *ngIf=\"_isActionSheet\">\n <ax-title>{{ _popoverTitle }}</ax-title>\n <ax-close-button class=\"ax-icon\"\n [icon]=\"multiple ? 'ax-icon-done !ax-text-primary-500' : 'ax-icon-close'\"></ax-close-button>\n </ax-header>\n <div class=\"ax-search-box-container\" [class.ax-state-hidden]=\"!_searchBox\" [cdkTrapFocus]=\"_searchBox != null\">\n <ng-content select=\"ax-search-box\"></ng-content>\n </div>\n <div class=\"ax-content ax-list-items-container ax-default\" (scroll)=\"_handleListScroll($event)\" #listContainer>\n <ng-container *ngIf=\"displayItems.length; else tmpEmpty\">\n <ul>\n <ng-container *ngTemplateOutlet=\"tmpTree; context: { list: displayItems }\"> </ng-container>\n <ng-template #tmpTree let-list=\"list\">\n <ng-container *ngFor=\"let item of list; let i = index; trackBy: _trackByFunction\">\n <ng-container *ngIf=\"itemTemplate; else defualtTemplate\">\n <li class=\"ax-list-item\" (click)=\"_handleOnItemClick($event, item)\"\n [attr.data-id]=\"item[this.valueField]\">\n <ng-container *ngTemplateOutlet=\"itemTemplate; context: { $implicit: item, direction: direction }\">\n </ng-container>\n </li>\n </ng-container>\n <ng-template #defualtTemplate>\n <ng-container *ngIf=\"item.children?.length > 0; else tmpItem\">\n <li class=\"ax-list-item-group\" [attr.data-id]=\"item[this.valueField]\">\n <span> {{ _getItemDisplayTextTemplte(item) }}</span>\n <ul *ngIf=\"item.children?.length > 0\">\n <ng-container *ngTemplateOutlet=\"tmpTree; context: { list: item.children }\"> </ng-container>\n </ul>\n </li>\n </ng-container>\n <ng-template #tmpItem>\n <ng-container *ngIf=\"!multiple; else multipleTemplate\">\n <li class=\"ax-list-item\" [class.ax-state-selected]=\"isItemSelected(item)\"\n [class.ax-state-disabled]=\"isItemDisabled(item)\" [attr.tabindex]=\"i\"\n (click)=\"_handleOnItemClick($event, item)\" [attr.data-id]=\"item[this.valueField]\">\n <span> {{ _getItemDisplayTextTemplte(item) }}</span>\n <span class=\"ax-icon ax-icon-done ax-selected-icon\" *ngIf=\"isItemSelected(item)\"></span>\n </li>\n </ng-container>\n <ng-template #multipleTemplate>\n <li class=\"ax-list-item\" [class.ax-state-selected]=\"isItemSelected(item)\"\n [class.ax-state-disabled]=\"isItemDisabled(item)\" [class.ax-state-checkbox]=\"checkbox\"\n [attr.tabindex]=\"i\" (click)=\"_handleOnItemClick($event, item)\"\n [attr.data-id]=\"item[this.valueField]\">\n <span>\n <input class=\"ax-checkbox\" type=\"checkbox\" [class.ax-state-disabled]=\"isItemDisabled(item)\"\n *ngIf=\"checkbox\" [checked]=\"isItemSelected(item)\" [disabled]=\"isItemDisabled(item)\" />\n <span class=\"ax-checkbox-label\">{{ _getItemDisplayTextTemplte(item) }}</span>\n </span>\n <span class=\"ax-icon ax-icon-done ax-selected-icon\"\n *ngIf=\"isItemSelected(item) && !checkbox\"></span>\n </li>\n </ng-template>\n </ng-template>\n </ng-template>\n </ng-container>\n </ng-template>\n </ul>\n </ng-container>\n <ng-container *ngIf=\"isLoading\">\n <ng-container *ngIf=\"loadingTemplate; else elseLoadingTemplate\">\n <ng-container *ngTemplateOutlet=\"loadingTemplate\"> </ng-container>\n </ng-container>\n <ng-template #elseLoadingTemplate>\n <div class=\"ax-flex ax-items-center ax-justify-center ax-p-4\">\n <ax-loading [context]=\"_loadingOptions\"></ax-loading>\n </div>\n </ng-template>\n </ng-container>\n <ng-template #tmpEmpty>\n <ng-container *ngIf=\"!isLoading\">\n <ng-container *ngIf=\"emptyTemplate; else elseEmptyTemplate\">\n <ng-container *ngTemplateOutlet=\"emptyTemplate\"> </ng-container>\n </ng-container>\n <ng-template #elseEmptyTemplate>\n <div class=\"ax-flex ax-items-center ax-justify-center ax-p-4\" [innerHTML]=\"\n 'common.no-result-for'\n | trans\n : {\n exp: this._searchBox ? this._searchBox.value : ''\n }\n \"></div>\n </ng-template>\n </ng-container>\n </ng-template>\n </div>\n <!-- <div class=\"ax-list-items-container ax-vertical ax-default\" [class.ax-full]=\"_isMobile\"\n >\n \n </div> -->\n <!-- <div class=\"ax-footer\">footer</div> -->\n </div>\n </div>\n</ax-popover>", styles: ["ax-select-box .ax-select-multi-item{display:flex;align-items:center;padding:.25rem .5rem;background-color:rgba(var(--ax-color-default));color:rgba(var(--ax-color-default-fore));border-radius:var(--ax-rounded-border-default);margin-inline-end:.5rem}ax-select-box .ax-select-multi-item .ax-icon-close{cursor:pointer;margin-inline-start:.5rem}ax-select-box .ax-select-box-selection{display:flex;justify-content:center;align-items:center;outline-color:transparent;outline:transparent;-webkit-user-select:none;user-select:none}ax-select-box .ax-select-box-selection>span{padding-inline-start:1rem;padding-inline-end:.75rem;white-space:nowrap}ax-select-box .ax-select-box-selection .ax-selectbox-input{opacity:0;width:0}ax-select-box .ax-select-box-multi-selection{padding:0 .5rem;display:flex;justify-content:center;align-items:center}ax-select-box .ax-placeholder{padding-inline-start:1rem;padding-inline-end:.75rem}\n"] }]
355
+ ], host: { class: 'ax-editor-container ax-drop-down' }, template: "<ng-content select=\"ax-prefix\"> </ng-content>\n<div class=\"ax-dropdown-content\" [class.ax-state-disabled]=\"disabled\" (click)=\"_handleInputClickEvent($event)\">\n <div class=\"ax-select-box-selection\" [tabindex]=\"tabIndex\" (focus)=\"_emitOnFocusEvent($event)\"\n (blur)=\"_emitOnBlurEvent($event)\">\n <ng-container *ngIf=\"selectedItems && selectedItems.length; else showPlaceholder\">\n <ng-container *ngIf=\"!multiple; then singleSelectedTemplate; else multipleSelectedTemplate\"></ng-container>\n <ng-template #singleSelectedTemplate>\n <ng-container *ngFor=\"let item of selectedItems\">\n <span> {{ _getItemDisplayTextTemplte(item) }}</span>\n </ng-container>\n </ng-template>\n <ng-template #multipleSelectedTemplate>\n <div class=\"ax-select-box-multi-selection\">\n <ng-container *ngFor=\"let item of selectedItems\">\n <div class=\"ax-select-multi-item\">\n {{ _getItemDisplayTextTemplte(item) }}\n <span class=\"ax-icon ax-icon-close\" (click)=\"_handleBadgeRemove($event, item)\"> </span>\n </div>\n </ng-container>\n </div>\n </ng-template>\n </ng-container>\n <ng-template #showPlaceholder>\n <div class=\"ax-placeholder\" role=\"textbox\" area-readonly=\"true\">\n {{ placeholder }}\n </div>\n </ng-template>\n </div>\n</div>\n<button type=\"button\" class=\"ax-general-button ax-button-icon\" (click)=\"clear()\" [tabIndex]=\"-1\"\n *ngIf=\"value && clearButton && !(disabled || readonly)\">\n <span class=\"ax-icon ax-icon-close\"></span>\n</button>\n<button type=\"button\" [disabled]=\"disabled\" [tabIndex]=\"-1\" class=\"ax-general-button ax-button-icon\"\n (click)=\"_handleArrowClickEvent($event)\">\n <ng-container *ngIf=\"isLoading && !this.popover.isOpen; else iconTemplate\">\n <ax-loading type=\"spinner\"></ax-loading>\n </ng-container>\n <ng-template #iconTemplate>\n <span class=\"ax-icon ax-icon-chevron-left ax-transition-all\" [ngClass]=\"{\n '-ax-rotation-90': !isOpen,\n 'ax-rotation-90': isOpen\n }\"></span>\n </ng-template>\n</button>\n<ng-content select=\"ax-validation-rule\"> </ng-content>\n<ng-content select=\"ax-suffix\"> </ng-content>\n<ax-popover [target]=\"_target\" [placement]=\"position\" [openOn]=\"'manual'\" [closeOn]=\"'clickout'\"\n [adaptivityEnabled]=\"true\" (onOpened)=\"_handlePopupOnOpened($event)\" (onClosed)=\"_handlePopupOnClosed($event)\">\n <div class=\"ax-overlay-pane\" (keydown)=\"_handlePopoverKeydown($event)\" tabindex=\"0\" aria-modal=\"true\" cdkTrapFocus\n [class.ax-overlay-actionsheet]=\"_isActionSheet\" [class.ax-full]=\"_searchBox || isLazy\"\n [style.min-width.px]=\"_popoverWidth\">\n <div class=\"ax-list\">\n <ax-header *ngIf=\"_isActionSheet\">\n <ax-title>{{ _popoverTitle }}</ax-title>\n <ax-close-button class=\"ax-icon\"\n [icon]=\"multiple ? 'ax-icon-done !ax-text-primary-500' : 'ax-icon-close'\"></ax-close-button>\n </ax-header>\n <div class=\"ax-search-box-container\" [class.ax-state-hidden]=\"!_searchBox\" [cdkTrapFocus]=\"_searchBox != null\">\n <ng-content select=\"ax-search-box\"></ng-content>\n </div>\n <div class=\"ax-content ax-list-items-container ax-default\" (scroll)=\"_handleListScroll($event)\" #listContainer>\n <ng-container *ngIf=\"displayItems.length; else tmpEmpty\">\n <ul>\n <ng-container *ngTemplateOutlet=\"tmpTree; context: { list: displayItems }\"> </ng-container>\n <ng-template #tmpTree let-list=\"list\">\n <ng-container *ngFor=\"let item of list; let i = index; trackBy: _trackByFunction\">\n <ng-container *ngIf=\"itemTemplate; else defualtTemplate\">\n <li class=\"ax-list-item\" (click)=\"_handleOnItemClick($event, item)\"\n [attr.data-id]=\"item[this.valueField]\">\n <ng-container *ngTemplateOutlet=\"itemTemplate; context: { $implicit: item, direction: direction }\">\n </ng-container>\n </li>\n </ng-container>\n <ng-template #defualtTemplate>\n <ng-container *ngIf=\"item.children?.length > 0; else tmpItem\">\n <li class=\"ax-list-item-group\" [attr.data-id]=\"item[this.valueField]\">\n <span> {{ _getItemDisplayTextTemplte(item) }}</span>\n <ul *ngIf=\"item.children?.length > 0\">\n <ng-container *ngTemplateOutlet=\"tmpTree; context: { list: item.children }\"> </ng-container>\n </ul>\n </li>\n </ng-container>\n <ng-template #tmpItem>\n <ng-container *ngIf=\"!multiple; else multipleTemplate\">\n <li class=\"ax-list-item\" [class.ax-state-selected]=\"isItemSelected(item)\"\n [class.ax-state-disabled]=\"isItemDisabled(item)\" [attr.tabindex]=\"i\"\n (click)=\"_handleOnItemClick($event, item)\" [attr.data-id]=\"item[this.valueField]\">\n <span> {{ _getItemDisplayTextTemplte(item) }}</span>\n <span class=\"ax-icon ax-icon-done ax-selected-icon\" *ngIf=\"isItemSelected(item)\"></span>\n </li>\n </ng-container>\n <ng-template #multipleTemplate>\n <li class=\"ax-list-item\" [class.ax-state-selected]=\"isItemSelected(item)\"\n [class.ax-state-disabled]=\"isItemDisabled(item)\" [class.ax-state-checkbox]=\"checkbox\"\n [attr.tabindex]=\"i\" (click)=\"_handleOnItemClick($event, item)\"\n [attr.data-id]=\"item[this.valueField]\">\n <span>\n <input class=\"ax-checkbox\" type=\"checkbox\" [class.ax-state-disabled]=\"isItemDisabled(item)\"\n *ngIf=\"checkbox\" [checked]=\"isItemSelected(item)\" [disabled]=\"isItemDisabled(item)\" />\n <span class=\"ax-checkbox-label\">{{ _getItemDisplayTextTemplte(item) }}</span>\n </span>\n <span class=\"ax-icon ax-icon-done ax-selected-icon\"\n *ngIf=\"isItemSelected(item) && !checkbox\"></span>\n </li>\n </ng-template>\n </ng-template>\n </ng-template>\n </ng-container>\n </ng-template>\n </ul>\n </ng-container>\n <ng-container *ngIf=\"isLoading\">\n <ng-container *ngIf=\"loadingTemplate; else elseLoadingTemplate\">\n <ng-container *ngTemplateOutlet=\"loadingTemplate\"> </ng-container>\n </ng-container>\n <ng-template #elseLoadingTemplate>\n <div class=\"ax-flex ax-items-center ax-justify-center ax-p-4\">\n <ax-loading [context]=\"_loadingOptions\"></ax-loading>\n </div>\n </ng-template>\n </ng-container>\n <ng-template #tmpEmpty>\n <ng-container *ngIf=\"!isLoading\">\n <ng-container *ngIf=\"emptyTemplate; else elseEmptyTemplate\">\n <ng-container *ngTemplateOutlet=\"emptyTemplate\"> </ng-container>\n </ng-container>\n <ng-template #elseEmptyTemplate>\n <div class=\"ax-flex ax-items-center ax-justify-center ax-p-4\" [innerHTML]=\"\n 'common.no-result-for'\n | trans\n : {\n exp: this._searchBox ? this._searchBox.value : ''\n }\n \"></div>\n </ng-template>\n </ng-container>\n </ng-template>\n </div>\n <!-- <div class=\"ax-list-items-container ax-vertical ax-default\" [class.ax-full]=\"_isMobile\"\n >\n \n </div> -->\n <!-- <div class=\"ax-footer\">footer</div> -->\n </div>\n </div>\n</ax-popover>", styles: ["ax-select-box .ax-select-multi-item{display:flex;align-items:center;padding:.25rem .5rem;background-color:rgba(var(--ax-color-default));color:rgba(var(--ax-color-default-fore));border-radius:var(--ax-rounded-border-default);margin-inline-end:.5rem}ax-select-box .ax-select-multi-item .ax-icon-close{cursor:pointer;margin-inline-start:.5rem}ax-select-box .ax-select-box-selection{display:flex;justify-content:center;align-items:center;outline-color:transparent;outline:transparent;-webkit-user-select:none;user-select:none}ax-select-box .ax-select-box-selection>span{padding-inline-start:1rem;padding-inline-end:.75rem;white-space:nowrap}ax-select-box .ax-select-box-selection .ax-selectbox-input{opacity:0;width:0}ax-select-box .ax-select-box-multi-selection{padding:0 .5rem;display:flex;justify-content:center;align-items:center}ax-select-box .ax-placeholder{padding-inline-start:1rem;padding-inline-end:.75rem}\n"] }]
356
356
  }], ctorParameters: function () { return [{ type: i0.ElementRef }, { type: i0.ChangeDetectorRef }, { type: i0.NgZone }, { type: i1.AXPlatform }]; }, propDecorators: { popover: [{
357
357
  type: ViewChild,
358
358
  args: [AXPopoverComponent, { static: true }]
@@ -375,8 +375,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.7", ngImpor
375
375
  }] } });
376
376
 
377
377
  class AXSelectBoxModule {
378
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.7", ngImport: i0, type: AXSelectBoxModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
379
- static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "16.1.7", ngImport: i0, type: AXSelectBoxModule, declarations: [AXSelectBoxComponent], imports: [CommonModule,
378
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.9", ngImport: i0, type: AXSelectBoxModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
379
+ static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "16.1.9", ngImport: i0, type: AXSelectBoxModule, declarations: [AXSelectBoxComponent], imports: [CommonModule,
380
380
  AXCommonModule,
381
381
  FormsModule,
382
382
  AXCheckBoxModule,
@@ -387,7 +387,7 @@ class AXSelectBoxModule {
387
387
  AXLoadingModule,
388
388
  A11yModule,
389
389
  AXTextBoxModule], exports: [AXSelectBoxComponent] }); }
390
- static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "16.1.7", ngImport: i0, type: AXSelectBoxModule, imports: [CommonModule,
390
+ static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "16.1.9", ngImport: i0, type: AXSelectBoxModule, imports: [CommonModule,
391
391
  AXCommonModule,
392
392
  FormsModule,
393
393
  AXCheckBoxModule,
@@ -399,7 +399,7 @@ class AXSelectBoxModule {
399
399
  A11yModule,
400
400
  AXTextBoxModule] }); }
401
401
  }
402
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.7", ngImport: i0, type: AXSelectBoxModule, decorators: [{
402
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.9", ngImport: i0, type: AXSelectBoxModule, decorators: [{
403
403
  type: NgModule,
404
404
  args: [{
405
405
  imports: [