design-angular-kit 1.0.0-9 → 1.0.0-prerelease.2

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 (259) hide show
  1. package/README.md +212 -64
  2. package/assets/i18n/en.json +81 -12
  3. package/assets/i18n/it.json +80 -11
  4. package/esm2022/lib/abstracts/abstract-form.component.mjs +187 -0
  5. package/esm2022/lib/abstracts/abstract.component.mjs +45 -0
  6. package/esm2022/lib/components/core/accordion/accordion.component.mjs +39 -0
  7. package/esm2022/lib/components/core/alert/alert.component.mjs +71 -0
  8. package/esm2022/lib/components/core/avatar/avatar-dropdown/avatar-dropdown.component.mjs +43 -0
  9. package/esm2022/lib/components/core/avatar/avatar-group/avatar-group.component.mjs +38 -0
  10. package/esm2022/lib/components/core/avatar/avatar.directive.mjs +78 -0
  11. package/esm2022/lib/components/core/avatar/avatar.module.mjs +33 -0
  12. package/esm2022/lib/components/core/badge/badge.directive.mjs +39 -0
  13. package/esm2022/lib/components/core/button/button.directive.mjs +86 -0
  14. package/esm2022/lib/components/core/callout/callout.component.mjs +57 -0
  15. package/esm2022/lib/components/core/card/card.component.mjs +59 -0
  16. package/esm2022/lib/components/core/carousel/carousel/carousel.component.mjs +84 -0
  17. package/esm2022/lib/components/core/carousel/carousel-item/carousel-item.component.mjs +19 -0
  18. package/esm2022/lib/components/core/carousel/carousel.module.mjs +18 -0
  19. package/esm2022/lib/components/core/chip/chip.component.mjs +136 -0
  20. package/esm2022/lib/components/core/collapse/collapse.component.mjs +104 -0
  21. package/esm2022/lib/components/core/dimmer/dimmer-buttons/dimmer-buttons.component.mjs +24 -0
  22. package/esm2022/lib/components/core/dimmer/dimmer-icon/dimmer-icon.component.mjs +11 -0
  23. package/esm2022/lib/components/core/dimmer/dimmer.component.mjs +55 -0
  24. package/esm2022/lib/components/core/dimmer/dimmer.module.mjs +19 -0
  25. package/esm2022/lib/components/core/dropdown/dropdown/dropdown.component.mjs +144 -0
  26. package/esm2022/lib/components/core/dropdown/dropdown-item/dropdown-item.component.mjs +61 -0
  27. package/esm2022/lib/components/core/dropdown/dropdown.module.mjs +18 -0
  28. package/esm2022/lib/components/core/forward/forward.directive.mjs +53 -0
  29. package/esm2022/lib/components/core/link/link.component.mjs +42 -0
  30. package/esm2022/lib/components/core/list/list/list.component.mjs +22 -0
  31. package/esm2022/lib/components/core/list/list-item/list-item.component.mjs +51 -0
  32. package/esm2022/lib/components/core/list/list.module.mjs +18 -0
  33. package/esm2022/lib/components/core/modal/modal.component.mjs +194 -0
  34. package/esm2022/lib/components/core/notifications/notifications.component.mjs +111 -0
  35. package/esm2022/lib/components/core/pagination/pagination.component.mjs +130 -0
  36. package/esm2022/lib/components/core/popover/popover.directive.mjs +176 -0
  37. package/esm2022/lib/components/core/progress-bar/progress-bar.component.mjs +34 -0
  38. package/esm2022/lib/components/core/progress-button/progress-button.component.mjs +25 -0
  39. package/esm2022/lib/components/core/spinner/spinner.component.mjs +30 -0
  40. package/esm2022/lib/components/core/steppers/steppers-container/steppers-container.component.mjs +116 -0
  41. package/esm2022/lib/components/core/steppers/steppers-item/steppers-item.component.mjs +20 -0
  42. package/esm2022/lib/components/core/steppers/steppers.module.mjs +18 -0
  43. package/esm2022/lib/components/core/tab/tab-container/tab-container.component.mjs +63 -0
  44. package/esm2022/lib/components/core/tab/tab-item/tab-item.component.mjs +39 -0
  45. package/esm2022/lib/components/core/tab/tab.module.mjs +18 -0
  46. package/esm2022/lib/components/core/table/sort/sort-header/sort-header.component.mjs +134 -0
  47. package/esm2022/lib/components/core/table/sort/sort.directive.mjs +123 -0
  48. package/esm2022/lib/components/core/table/table.component.mjs +45 -0
  49. package/esm2022/lib/components/core/table/table.module.mjs +19 -0
  50. package/esm2022/lib/components/core/tooltip/tooltip.directive.mjs +143 -0
  51. package/esm2022/lib/components/form/autocomplete/autocomplete.component.mjs +106 -0
  52. package/esm2022/lib/components/form/checkbox/checkbox.component.mjs +48 -0
  53. package/esm2022/lib/components/form/form.module.mjs +59 -0
  54. package/esm2022/lib/components/form/input/input.component.mjs +187 -0
  55. package/esm2022/lib/components/form/password-input/password-input.component.mjs +149 -0
  56. package/esm2022/lib/components/form/radio-button/radio-button.component.mjs +60 -0
  57. package/esm2022/lib/components/form/range/range.component.mjs +64 -0
  58. package/esm2022/lib/components/form/rating/rating.component.mjs +50 -0
  59. package/esm2022/lib/components/form/select/select.component.mjs +70 -0
  60. package/esm2022/lib/components/form/textarea/textarea.component.mjs +55 -0
  61. package/esm2022/lib/components/form/upload-drag-drop/upload-drag-drop.component.mjs +142 -0
  62. package/esm2022/lib/components/form/upload-file-list/upload-file-list.component.mjs +107 -0
  63. package/esm2022/lib/components/navigation/back-button/back-button.component.mjs +67 -0
  64. package/esm2022/lib/components/navigation/back-to-top/back-to-top.component.mjs +58 -0
  65. package/esm2022/lib/components/navigation/breadcrumbs/breadcrumb/breadcrumb.component.mjs +51 -0
  66. package/esm2022/lib/components/navigation/breadcrumbs/breadcrumb-item/breadcrumb-item.component.mjs +21 -0
  67. package/esm2022/lib/components/navigation/breadcrumbs/breadcrumbs.module.mjs +18 -0
  68. package/esm2022/lib/components/navigation/header/header.component.mjs +87 -0
  69. package/esm2022/lib/components/navigation/megamenu/megamenu.component.mjs +27 -0
  70. package/esm2022/lib/components/navigation/navbar/navbar/navbar.component.mjs +40 -0
  71. package/esm2022/lib/components/navigation/navbar/navbar-item/navbar-item.component.mjs +11 -0
  72. package/esm2022/lib/components/navigation/navbar/navbar.module.mjs +18 -0
  73. package/esm2022/lib/components/utils/error-page/error-page.component.mjs +74 -0
  74. package/esm2022/lib/components/utils/icon/icon.component.mjs +58 -0
  75. package/esm2022/lib/components/utils/language-switcher/language-switcher.component.mjs +50 -0
  76. package/esm2022/lib/design-angular-kit.module.mjs +213 -0
  77. package/esm2022/lib/enums/colors.enums.mjs +12 -0
  78. package/esm2022/lib/enums/sizes.enum.mjs +9 -0
  79. package/esm2022/lib/interfaces/core.mjs +16 -0
  80. package/esm2022/lib/interfaces/design-angular-kit-config.mjs +7 -0
  81. package/esm2022/lib/interfaces/form.mjs +2 -0
  82. package/esm2022/lib/interfaces/icon.mjs +165 -0
  83. package/esm2022/lib/interfaces/sortable-table.mjs +6 -0
  84. package/esm2022/lib/pipes/date-ago.pipe.mjs +56 -0
  85. package/esm2022/lib/pipes/duration.pipe.mjs +110 -0
  86. package/esm2022/lib/pipes/mark-matching-text.pipe.mjs +48 -0
  87. package/esm2022/lib/provide-design-angular-kit.mjs +61 -0
  88. package/esm2022/lib/services/notification/notification.service.mjs +120 -0
  89. package/esm2022/lib/utils/coercion.mjs +18 -0
  90. package/esm2022/lib/utils/date-utils.mjs +160 -0
  91. package/esm2022/lib/utils/file-utils.mjs +73 -0
  92. package/esm2022/lib/utils/regex.mjs +31 -0
  93. package/esm2022/lib/validators/it-validators.mjs +153 -0
  94. package/esm2022/public_api.mjs +99 -0
  95. package/fesm2022/design-angular-kit.mjs +5556 -0
  96. package/fesm2022/design-angular-kit.mjs.map +1 -0
  97. package/lib/abstracts/{abstract-form-component.d.ts → abstract-form.component.d.ts} +12 -14
  98. package/lib/abstracts/abstract.component.d.ts +18 -8
  99. package/lib/components/core/accordion/accordion.component.d.ts +11 -5
  100. package/lib/components/core/alert/alert.component.d.ts +15 -10
  101. package/lib/components/core/avatar/avatar-dropdown/avatar-dropdown.component.d.ts +29 -0
  102. package/lib/components/core/avatar/avatar-group/avatar-group.component.d.ts +13 -0
  103. package/lib/components/core/avatar/avatar.directive.d.ts +33 -0
  104. package/lib/components/core/avatar/avatar.module.d.ts +9 -0
  105. package/lib/components/core/badge/badge.directive.d.ts +14 -7
  106. package/lib/components/core/button/button.directive.d.ts +25 -15
  107. package/lib/components/core/callout/callout.component.d.ts +18 -20
  108. package/lib/components/core/card/card.component.d.ts +46 -18
  109. package/lib/components/core/carousel/carousel/carousel.component.d.ts +34 -15
  110. package/lib/components/core/carousel/carousel-item/carousel-item.component.d.ts +8 -3
  111. package/lib/components/core/carousel/carousel.module.d.ts +8 -0
  112. package/lib/components/core/chip/chip.component.d.ts +29 -15
  113. package/lib/components/core/collapse/collapse.component.d.ts +22 -15
  114. package/lib/components/core/dimmer/dimmer-buttons/dimmer-buttons.component.d.ts +3 -3
  115. package/lib/components/core/dimmer/dimmer-icon/dimmer-icon.component.d.ts +3 -3
  116. package/lib/components/core/dimmer/dimmer.component.d.ts +6 -6
  117. package/lib/components/core/dimmer/dimmer.module.d.ts +9 -0
  118. package/lib/components/core/dropdown/dropdown/dropdown.component.d.ts +30 -17
  119. package/lib/components/core/dropdown/dropdown-item/dropdown-item.component.d.ts +15 -12
  120. package/lib/components/core/dropdown/dropdown.module.d.ts +8 -0
  121. package/lib/components/core/forward/forward.directive.d.ts +3 -3
  122. package/lib/components/core/link/link.component.d.ts +14 -10
  123. package/lib/components/core/list/list/list.component.d.ts +20 -6
  124. package/lib/components/core/list/list-item/list-item.component.d.ts +23 -9
  125. package/lib/components/core/list/list.module.d.ts +8 -0
  126. package/lib/components/core/modal/modal.component.d.ts +89 -13
  127. package/lib/components/core/notifications/notifications.component.d.ts +9 -8
  128. package/lib/components/core/pagination/pagination.component.d.ts +71 -10
  129. package/lib/components/core/popover/popover.directive.d.ts +15 -14
  130. package/lib/components/core/progress-bar/progress-bar.component.d.ts +11 -8
  131. package/lib/components/core/progress-button/progress-button.component.d.ts +5 -6
  132. package/lib/components/core/spinner/spinner.component.d.ts +13 -10
  133. package/lib/components/core/steppers/steppers-container/steppers-container.component.d.ts +55 -27
  134. package/lib/components/core/steppers/steppers-item/steppers-item.component.d.ts +5 -4
  135. package/lib/components/core/steppers/steppers.module.d.ts +8 -0
  136. package/lib/components/core/tab/tab-container/tab-container.component.d.ts +15 -12
  137. package/lib/components/core/tab/tab-item/tab-item.component.d.ts +14 -10
  138. package/lib/components/core/tab/tab.module.d.ts +8 -0
  139. package/lib/components/core/table/sort/sort-header/sort-header.component.d.ts +72 -0
  140. package/lib/components/core/table/sort/sort.directive.d.ts +53 -0
  141. package/lib/components/core/table/table.component.d.ts +26 -20
  142. package/lib/components/core/table/table.module.d.ts +9 -0
  143. package/lib/components/core/tooltip/tooltip.directive.d.ts +12 -11
  144. package/lib/components/form/autocomplete/autocomplete.component.d.ts +55 -0
  145. package/lib/components/form/checkbox/checkbox.component.d.ts +23 -12
  146. package/lib/components/form/form.module.d.ts +17 -0
  147. package/lib/components/form/input/input.component.d.ts +42 -43
  148. package/lib/components/form/password-input/password-input.component.d.ts +35 -10
  149. package/lib/components/form/radio-button/radio-button.component.d.ts +20 -11
  150. package/lib/components/form/range/range.component.d.ts +42 -0
  151. package/lib/components/form/rating/rating.component.d.ts +24 -0
  152. package/lib/components/form/select/select.component.d.ts +12 -6
  153. package/lib/components/form/textarea/textarea.component.d.ts +15 -5
  154. package/lib/components/form/upload-drag-drop/upload-drag-drop.component.d.ts +18 -12
  155. package/lib/components/form/upload-file-list/upload-file-list.component.d.ts +14 -11
  156. package/lib/components/navigation/back-button/back-button.component.d.ts +8 -8
  157. package/lib/components/navigation/back-to-top/back-to-top.component.d.ts +15 -16
  158. package/lib/components/navigation/breadcrumbs/breadcrumb/breadcrumb.component.d.ts +12 -14
  159. package/lib/components/navigation/breadcrumbs/breadcrumb-item/breadcrumb-item.component.d.ts +9 -8
  160. package/lib/components/navigation/breadcrumbs/breadcrumbs.module.d.ts +8 -0
  161. package/lib/components/navigation/header/header.component.d.ts +28 -25
  162. package/lib/components/navigation/megamenu/megamenu.component.d.ts +22 -0
  163. package/lib/components/navigation/navbar/navbar/navbar.component.d.ts +16 -0
  164. package/lib/components/navigation/navbar/navbar-item/navbar-item.component.d.ts +5 -0
  165. package/lib/components/navigation/navbar/navbar.module.d.ts +8 -0
  166. package/lib/components/utils/error-page/error-page.component.d.ts +44 -0
  167. package/lib/components/utils/icon/icon.component.d.ts +25 -17
  168. package/lib/components/utils/language-switcher/language-switcher.component.d.ts +9 -5
  169. package/lib/design-angular-kit.module.d.ts +44 -7
  170. package/lib/enums/colors.enums.d.ts +10 -0
  171. package/lib/enums/sizes.enum.d.ts +7 -0
  172. package/lib/interfaces/core.d.ts +16 -15
  173. package/lib/interfaces/design-angular-kit-config.d.ts +30 -0
  174. package/lib/interfaces/form.d.ts +9 -9
  175. package/lib/interfaces/icon.d.ts +4 -3
  176. package/lib/interfaces/sortable-table.d.ts +33 -0
  177. package/lib/pipes/date-ago.pipe.d.ts +17 -0
  178. package/lib/pipes/duration.pipe.d.ts +35 -0
  179. package/lib/pipes/mark-matching-text.pipe.d.ts +15 -7
  180. package/lib/provide-design-angular-kit.d.ts +7 -0
  181. package/lib/services/{notifications/notifications.service.d.ts → notification/notification.service.d.ts} +3 -3
  182. package/lib/utils/coercion.d.ts +14 -0
  183. package/lib/utils/date-utils.d.ts +78 -0
  184. package/lib/utils/file-utils.d.ts +1 -1
  185. package/lib/utils/regex.d.ts +5 -0
  186. package/lib/validators/it-validators.d.ts +9 -2
  187. package/package.json +17 -22
  188. package/public_api.d.ts +31 -4
  189. package/esm2020/lib/abstracts/abstract-form-component.mjs +0 -174
  190. package/esm2020/lib/abstracts/abstract.component.mjs +0 -27
  191. package/esm2020/lib/components/core/accordion/accordion.component.mjs +0 -31
  192. package/esm2020/lib/components/core/alert/alert.component.mjs +0 -69
  193. package/esm2020/lib/components/core/badge/badge.directive.mjs +0 -34
  194. package/esm2020/lib/components/core/button/button.directive.mjs +0 -80
  195. package/esm2020/lib/components/core/callout/callout.component.mjs +0 -84
  196. package/esm2020/lib/components/core/card/card.component.mjs +0 -58
  197. package/esm2020/lib/components/core/carousel/carousel/carousel.component.mjs +0 -66
  198. package/esm2020/lib/components/core/carousel/carousel-item/carousel-item.component.mjs +0 -14
  199. package/esm2020/lib/components/core/chip/chip.component.mjs +0 -89
  200. package/esm2020/lib/components/core/collapse/collapse.component.mjs +0 -101
  201. package/esm2020/lib/components/core/dimmer/dimmer-buttons/dimmer-buttons.component.mjs +0 -24
  202. package/esm2020/lib/components/core/dimmer/dimmer-icon/dimmer-icon.component.mjs +0 -11
  203. package/esm2020/lib/components/core/dimmer/dimmer.component.mjs +0 -59
  204. package/esm2020/lib/components/core/dropdown/dropdown/dropdown.component.mjs +0 -130
  205. package/esm2020/lib/components/core/dropdown/dropdown-item/dropdown-item.component.mjs +0 -68
  206. package/esm2020/lib/components/core/forward/forward.directive.mjs +0 -51
  207. package/esm2020/lib/components/core/link/link.component.mjs +0 -40
  208. package/esm2020/lib/components/core/list/list/list.component.mjs +0 -13
  209. package/esm2020/lib/components/core/list/list-item/list-item.component.mjs +0 -36
  210. package/esm2020/lib/components/core/modal/modal.component.mjs +0 -98
  211. package/esm2020/lib/components/core/notifications/notifications.component.mjs +0 -110
  212. package/esm2020/lib/components/core/pagination/pagination.component.mjs +0 -51
  213. package/esm2020/lib/components/core/popover/popover.directive.mjs +0 -179
  214. package/esm2020/lib/components/core/progress-bar/progress-bar.component.mjs +0 -34
  215. package/esm2020/lib/components/core/progress-button/progress-button.component.mjs +0 -27
  216. package/esm2020/lib/components/core/spinner/spinner.component.mjs +0 -35
  217. package/esm2020/lib/components/core/steppers/steppers-container/steppers-container.component.mjs +0 -119
  218. package/esm2020/lib/components/core/steppers/steppers-item/steppers-item.component.mjs +0 -18
  219. package/esm2020/lib/components/core/tab/tab-container/tab-container.component.mjs +0 -59
  220. package/esm2020/lib/components/core/tab/tab-item/tab-item.component.mjs +0 -36
  221. package/esm2020/lib/components/core/table/table.component.mjs +0 -57
  222. package/esm2020/lib/components/core/tooltip/tooltip.directive.mjs +0 -143
  223. package/esm2020/lib/components/form/checkbox/checkbox.component.mjs +0 -40
  224. package/esm2020/lib/components/form/input/input.component.mjs +0 -222
  225. package/esm2020/lib/components/form/password-input/password-input.component.mjs +0 -112
  226. package/esm2020/lib/components/form/radio-button/radio-button.component.mjs +0 -53
  227. package/esm2020/lib/components/form/select/select.component.mjs +0 -62
  228. package/esm2020/lib/components/form/textarea/textarea.component.mjs +0 -46
  229. package/esm2020/lib/components/form/upload-drag-drop/upload-drag-drop.component.mjs +0 -137
  230. package/esm2020/lib/components/form/upload-file-list/upload-file-list.component.mjs +0 -104
  231. package/esm2020/lib/components/navigation/back-button/back-button.component.mjs +0 -69
  232. package/esm2020/lib/components/navigation/back-to-top/back-to-top.component.mjs +0 -74
  233. package/esm2020/lib/components/navigation/breadcrumbs/breadcrumb/breadcrumb.component.mjs +0 -45
  234. package/esm2020/lib/components/navigation/breadcrumbs/breadcrumb-item/breadcrumb-item.component.mjs +0 -23
  235. package/esm2020/lib/components/navigation/header/header.component.mjs +0 -63
  236. package/esm2020/lib/components/utils/icon/icon.component.mjs +0 -54
  237. package/esm2020/lib/components/utils/language-switcher/language-switcher.component.mjs +0 -39
  238. package/esm2020/lib/components/utils/not-found-page/not-found-page.component.mjs +0 -13
  239. package/esm2020/lib/design-angular-kit.module.mjs +0 -56
  240. package/esm2020/lib/interfaces/core.mjs +0 -16
  241. package/esm2020/lib/interfaces/form.mjs +0 -2
  242. package/esm2020/lib/interfaces/icon.mjs +0 -2
  243. package/esm2020/lib/modules/components.module.mjs +0 -257
  244. package/esm2020/lib/pipes/mark-matching-text.pipe.mjs +0 -36
  245. package/esm2020/lib/services/notifications/notifications.service.mjs +0 -120
  246. package/esm2020/lib/utils/boolean-input.mjs +0 -15
  247. package/esm2020/lib/utils/file-utils.mjs +0 -73
  248. package/esm2020/lib/utils/regex.mjs +0 -26
  249. package/esm2020/lib/validators/it-validators.mjs +0 -134
  250. package/esm2020/public_api.mjs +0 -70
  251. package/fesm2015/design-angular-kit.mjs +0 -3850
  252. package/fesm2015/design-angular-kit.mjs.map +0 -1
  253. package/fesm2020/design-angular-kit.mjs +0 -3797
  254. package/fesm2020/design-angular-kit.mjs.map +0 -1
  255. package/lib/components/utils/not-found-page/not-found-page.component.d.ts +0 -5
  256. package/lib/modules/components.module.d.ts +0 -61
  257. package/lib/utils/boolean-input.d.ts +0 -11
  258. /package/{esm2020 → esm2022}/design-angular-kit.mjs +0 -0
  259. /package/{esm2020 → esm2022}/lib/interfaces/utils.mjs +0 -0
@@ -1,3797 +0,0 @@
1
- import * as i0 from '@angular/core';
2
- import { EventEmitter, Component, Input, Output, Self, Optional, ChangeDetectionStrategy, ViewChild, Directive, HostBinding, Host, ContentChildren, HostListener, TemplateRef, Injectable, ViewChildren, Pipe, Inject, NgModule } from '@angular/core';
3
- import * as i1 from '@ngx-translate/core';
4
- import { TranslateModule, TranslateLoader } from '@ngx-translate/core';
5
- import { HttpClientModule, HttpClient } from '@angular/common/http';
6
- import { TranslateHttpLoader } from '@ngx-translate/http-loader';
7
- import * as i1$1 from '@angular/common';
8
- import { DOCUMENT, CommonModule, NgIf, NgForOf } from '@angular/common';
9
- import * as i2 from '@angular/forms';
10
- import { FormControl, Validators, ReactiveFormsModule } from '@angular/forms';
11
- import * as i2$1 from '@angular/router';
12
- import { RouterLink } from '@angular/router';
13
- import { Collapse, Alert, CarouselBI, Dropdown, Modal, Notification, Popover, Tab, Tooltip, InputPassword, ProgressDonut, BackToTop } from 'bootstrap-italia';
14
- import { Subject, filter, startWith, tap, switchMap, of, Observable, debounceTime, distinctUntilChanged, map, take, forkJoin } from 'rxjs';
15
- import * as i1$2 from '@angular/platform-browser';
16
- import { trigger, transition, style, animate } from '@angular/animations';
17
-
18
- class AbstractComponent {
19
- constructor(_renderer, _elementRef, _changeDetectorRef) {
20
- this._renderer = _renderer;
21
- this._elementRef = _elementRef;
22
- this._changeDetectorRef = _changeDetectorRef;
23
- this.valueChanges = new EventEmitter();
24
- }
25
- ngAfterViewInit() {
26
- this._renderer.removeAttribute(this._elementRef.nativeElement, 'id');
27
- }
28
- ngOnChanges(changes) {
29
- this.valueChanges.next(); // The inputs were changed
30
- }
31
- }
32
- AbstractComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: AbstractComponent, deps: [{ token: i0.Renderer2 }, { token: i0.ElementRef }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
33
- AbstractComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.0.4", type: AbstractComponent, selector: "ng-component", inputs: { id: "id" }, outputs: { valueChanges: "valueChanges" }, usesOnChanges: true, ngImport: i0, template: '', isInline: true });
34
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: AbstractComponent, decorators: [{
35
- type: Component,
36
- args: [{ template: '' }]
37
- }], ctorParameters: function () { return [{ type: i0.Renderer2 }, { type: i0.ElementRef }, { type: i0.ChangeDetectorRef }]; }, propDecorators: { id: [{
38
- type: Input
39
- }], valueChanges: [{
40
- type: Output
41
- }] } });
42
-
43
- /**
44
- * Check if boolean input has true value and not is `undefined`
45
- * @param booleanInput the boolean input
46
- */
47
- function isTrueBooleanInput(booleanInput) {
48
- return booleanInput !== undefined && (booleanInput === true || booleanInput === 'true');
49
- }
50
- /**
51
- * Check if boolean input has false value or is `undefined`
52
- * @param booleanInput the boolean input
53
- */
54
- function isFalseBooleanInput(booleanInput) {
55
- return booleanInput === undefined || booleanInput === false || booleanInput === 'false';
56
- }
57
-
58
- class AbstractFormComponent extends AbstractComponent {
59
- constructor(_ngControl, _translateService, _renderer, _elementRef, _changeDetectorRef) {
60
- super(_renderer, _elementRef, _changeDetectorRef);
61
- this._ngControl = _ngControl;
62
- this._translateService = _translateService;
63
- this._renderer = _renderer;
64
- this._elementRef = _elementRef;
65
- this._changeDetectorRef = _changeDetectorRef;
66
- /**
67
- * Validation color display mode (validation triggered if field is touched or not pristine)
68
- * - <b>true</b>: Always show the validation color
69
- * - <b>false</b>: Never show validation color
70
- * - <b>only-valid</b>: Show only valid validation color
71
- * - <b>only-invalid</b>: Show only invalid validation color
72
- * @default <b>only-invalid</b>: Show only invalid validation color
73
- */
74
- this.validationMode = 'only-invalid';
75
- this.onChange = (_) => {
76
- };
77
- this.onTouched = () => {
78
- };
79
- this.control = new FormControl();
80
- this._ngControl && (this._ngControl.valueAccessor = this);
81
- }
82
- /**
83
- * Set the disabled state
84
- */
85
- set disabled(isDisabled) {
86
- this.setDisabledState(isTrueBooleanInput(isDisabled));
87
- }
88
- /**
89
- * Check if field is invalid (Validation failed)
90
- */
91
- get isInvalid() {
92
- if (this.validationMode === 'only-valid' || (this.validationMode !== 'only-invalid' && isFalseBooleanInput(this.validationMode))) {
93
- return undefined;
94
- }
95
- if (this._ngControl) {
96
- return this._ngControl.invalid === true && (!this._ngControl.pristine || this._ngControl.touched === true);
97
- }
98
- return this.control.invalid && (!this.control.pristine || this.control.touched);
99
- }
100
- /**
101
- * Check if field is valid (Validation successful)
102
- */
103
- get isValid() {
104
- if (this.validationMode === 'only-invalid' || (this.validationMode !== 'only-valid' && isFalseBooleanInput(this.validationMode))) {
105
- return undefined;
106
- }
107
- if (this._ngControl) {
108
- return this._ngControl.valid === true && (!this._ngControl.pristine || this._ngControl.touched === true);
109
- }
110
- return this.control.valid && (!this.control.pristine || this.control.touched);
111
- }
112
- /**
113
- * Return the invalid message string from TranslateService
114
- */
115
- get invalidMessage() {
116
- if (this.control.hasError('required')) {
117
- return this._translateService.get('it.errors.required-field');
118
- }
119
- return this._translateService.get('it.errors.invalid-field');
120
- }
121
- ngOnInit() {
122
- if (this._ngControl) {
123
- this.control.setValidators(this._ngControl.control.validator);
124
- }
125
- }
126
- registerOnChange(fn) {
127
- this.control.valueChanges.subscribe(fn);
128
- this.onChange = fn;
129
- }
130
- registerOnTouched(fn) {
131
- this.onTouched = fn;
132
- }
133
- setDisabledState(isDisabled) {
134
- if (isDisabled) {
135
- return this.control.disable();
136
- }
137
- this.control.enable();
138
- }
139
- writeValue(value) {
140
- this.control.setValue(value, { emitEvent: false });
141
- }
142
- /**
143
- * Mark the control as touched
144
- */
145
- markAsTouched() {
146
- if (!this.control.touched) {
147
- this.onTouched();
148
- }
149
- }
150
- /**
151
- * Fired to check if form control is touched
152
- */
153
- ngDoCheck() {
154
- if (this.control.touched) {
155
- return;
156
- }
157
- if (this._ngControl?.control?.touched) {
158
- this.control.markAsTouched();
159
- }
160
- }
161
- /**
162
- * Add the validators in control and parent control
163
- * @param validators the validators
164
- * @protected
165
- */
166
- addValidators(validators) {
167
- if (!Array.isArray(validators)) {
168
- validators = [validators];
169
- }
170
- validators.forEach(validator => {
171
- if (!this.control.hasValidator(validator)) {
172
- this.control.addValidators(validator);
173
- }
174
- if (this._ngControl?.control && !this._ngControl.control.hasValidator(validator)) {
175
- this._ngControl.control.addValidators(validator);
176
- }
177
- });
178
- }
179
- /**
180
- * Reports whether the control with the given path has the error specified. <br/>
181
- * If the control is not present, false is returned.
182
- * @param errorCode The code of the error to check
183
- * @param path A list of control names that designates how to move from the current control
184
- * to the control that should be queried for errors.
185
- * @returns whether the given error is present in the control at the given path.
186
- */
187
- hasError(errorCode, path) {
188
- if (this._ngControl) {
189
- return this._ngControl.hasError(errorCode, path);
190
- }
191
- return this.control.hasError(errorCode, path);
192
- }
193
- /**
194
- * Reports error data for the control with the given path.
195
- * @param errorCode The code of the error to check
196
- * @param path A list of control names that designates how to move from the current control
197
- * to the control that should be queried for errors.
198
- * @returns error data for that particular error. If the control or error is not present,
199
- * null is returned.
200
- */
201
- getError(errorCode, path) {
202
- if (this._ngControl) {
203
- return this._ngControl.getError(errorCode, path);
204
- }
205
- return this.control.getError(errorCode, path);
206
- }
207
- }
208
- AbstractFormComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: AbstractFormComponent, deps: [{ token: i2.NgControl, optional: true, self: true }, { token: i1.TranslateService }, { token: i0.Renderer2 }, { token: i0.ElementRef }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
209
- AbstractFormComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.0.4", type: AbstractFormComponent, selector: "ng-component", inputs: { label: "label", validationMode: "validationMode", disabled: "disabled" }, usesInheritance: true, ngImport: i0, template: '', isInline: true });
210
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: AbstractFormComponent, decorators: [{
211
- type: Component,
212
- args: [{ template: '' }]
213
- }], ctorParameters: function () { return [{ type: i2.NgControl, decorators: [{
214
- type: Self
215
- }, {
216
- type: Optional
217
- }] }, { type: i1.TranslateService }, { type: i0.Renderer2 }, { type: i0.ElementRef }, { type: i0.ChangeDetectorRef }]; }, propDecorators: { label: [{
218
- type: Input
219
- }], validationMode: [{
220
- type: Input
221
- }], disabled: [{
222
- type: Input
223
- }] } });
224
-
225
- class CollapseComponent extends AbstractComponent {
226
- constructor() {
227
- super(...arguments);
228
- /**
229
- * Custom class
230
- */
231
- this.class = '';
232
- /**
233
- * This event fires immediately when the show method is called.
234
- */
235
- this.onShow = new EventEmitter();
236
- /**
237
- * This event is triggered when the tooltip has been made visible to the user (it will wait for the CSS transitions to complete).
238
- */
239
- this.onShown = new EventEmitter();
240
- /**
241
- * This event fires immediately when the hide method is called.
242
- */
243
- this.onHide = new EventEmitter();
244
- /**
245
- * This event is raised when the tooltip has finished being hidden from the user (it will wait for the CSS transitions to complete).
246
- */
247
- this.onHidden = new EventEmitter();
248
- }
249
- get isMulti() {
250
- return isTrueBooleanInput(this.multi);
251
- }
252
- get isOpenedOnStart() {
253
- return isTrueBooleanInput(this.opened);
254
- }
255
- ngAfterViewInit() {
256
- super.ngAfterViewInit();
257
- this._renderer.removeAttribute(this._elementRef.nativeElement, 'class');
258
- if (this.collapseDiv) {
259
- const element = this.collapseDiv.nativeElement;
260
- this.collapse = Collapse.getOrCreateInstance(element, {
261
- toggle: this.isOpenedOnStart
262
- });
263
- element.addEventListener('show.bs.collapse', event => this.onShow.emit(event));
264
- element.addEventListener('shown.bs.collapse', event => this.onShown.emit(event));
265
- element.addEventListener('hide.bs.collapse', event => this.onHide.emit(event));
266
- element.addEventListener('hidden.bs.collapse', event => this.onHidden.emit(event));
267
- }
268
- }
269
- /**
270
- * Shows a resealable item
271
- * NOTE: Returns to the caller before the collapsable element has actually been shown (onShown event).
272
- */
273
- show() {
274
- this.collapse?.show();
275
- }
276
- /**
277
- * Hides a resealable item
278
- * NOTE: Returns to the caller before the collapsable element has actually been hidden (onHidden Event)
279
- */
280
- hide() {
281
- this.collapse?.hide();
282
- }
283
- /**
284
- * Toggle a collapsible item to show or hide it.
285
- * NOTE: Returns to the caller before the collapsable element has actually been shown or hidden (onShown and onHidden events)
286
- */
287
- toggle() {
288
- this.collapse?.toggle();
289
- }
290
- /**
291
- * Eliminates the possibility of an item being resealable
292
- */
293
- dispose() {
294
- this.collapse?.dispose();
295
- }
296
- }
297
- CollapseComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: CollapseComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
298
- CollapseComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.0.4", type: CollapseComponent, selector: "it-collapse[id]", inputs: { multi: "multi", opened: "opened", class: "class" }, outputs: { onShow: "onShow", onShown: "onShown", onHide: "onHide", onHidden: "onHidden" }, viewQueries: [{ propertyName: "collapseDiv", first: true, predicate: ["collapse"], descendants: true }], exportAs: ["itCollapse"], usesInheritance: true, ngImport: i0, template: "<div [id]=\"id\" class=\"collapse {{class}}\" [class.multi-collapse]=\"isMulti\" #collapse>\n <ng-content></ng-content>\n</div>\n", changeDetection: i0.ChangeDetectionStrategy.OnPush });
299
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: CollapseComponent, decorators: [{
300
- type: Component,
301
- args: [{ selector: 'it-collapse[id]', exportAs: 'itCollapse', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div [id]=\"id\" class=\"collapse {{class}}\" [class.multi-collapse]=\"isMulti\" #collapse>\n <ng-content></ng-content>\n</div>\n" }]
302
- }], propDecorators: { multi: [{
303
- type: Input
304
- }], opened: [{
305
- type: Input
306
- }], class: [{
307
- type: Input
308
- }], onShow: [{
309
- type: Output
310
- }], onShown: [{
311
- type: Output
312
- }], onHide: [{
313
- type: Output
314
- }], onHidden: [{
315
- type: Output
316
- }], collapseDiv: [{
317
- type: ViewChild,
318
- args: ['collapse']
319
- }] } });
320
-
321
- class AccordionComponent extends CollapseComponent {
322
- constructor() {
323
- super(...arguments);
324
- this.isCollapsed = true;
325
- }
326
- ngAfterViewInit() {
327
- super.ngAfterViewInit();
328
- this._renderer.removeAttribute(this._elementRef.nativeElement, 'title');
329
- this.isCollapsed = !this.isOpenedOnStart;
330
- this.onHide.subscribe(() => {
331
- this.isCollapsed = true;
332
- this._changeDetectorRef.detectChanges();
333
- });
334
- this.onShow.subscribe(() => {
335
- this.isCollapsed = false;
336
- this._changeDetectorRef.detectChanges();
337
- });
338
- }
339
- }
340
- AccordionComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: AccordionComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
341
- AccordionComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.0.4", type: AccordionComponent, selector: "it-accordion[id][title]", inputs: { title: "title" }, exportAs: ["itAccordion"], usesInheritance: true, ngImport: i0, template: "<div class=\"accordion\">\n <div class=\"accordion-item\">\n\n <h2 class=\"accordion-header\" id=\"collapse-{{id}}-heading\">\n <button\n class=\"accordion-button\"\n type=\"button\"\n data-bs-toggle=\"collapse\"\n [class.collapsed]=\"isCollapsed\"\n [attr.data-bs-target]=\"'#collapse-' + id\"\n [attr.aria-controls]=\"'collapse-' + id\"\n [attr.aria-expanded]=\"isOpenedOnStart ? 'true' : 'false'\">\n {{title}}\n </button>\n </h2>\n\n <div #collapse id=\"collapse-{{id}}\" role=\"region\"\n class=\"accordion-collapse collapse {{class}}\"\n [attr.aria-labelledby]=\"'collapse-' + id + '-heading'\">\n\n <div class=\"accordion-body\">\n <ng-content></ng-content>\n </div>\n </div>\n </div>\n</div>\n\n", changeDetection: i0.ChangeDetectionStrategy.OnPush });
342
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: AccordionComponent, decorators: [{
343
- type: Component,
344
- args: [{ selector: 'it-accordion[id][title]', exportAs: 'itAccordion', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"accordion\">\n <div class=\"accordion-item\">\n\n <h2 class=\"accordion-header\" id=\"collapse-{{id}}-heading\">\n <button\n class=\"accordion-button\"\n type=\"button\"\n data-bs-toggle=\"collapse\"\n [class.collapsed]=\"isCollapsed\"\n [attr.data-bs-target]=\"'#collapse-' + id\"\n [attr.aria-controls]=\"'collapse-' + id\"\n [attr.aria-expanded]=\"isOpenedOnStart ? 'true' : 'false'\">\n {{title}}\n </button>\n </h2>\n\n <div #collapse id=\"collapse-{{id}}\" role=\"region\"\n class=\"accordion-collapse collapse {{class}}\"\n [attr.aria-labelledby]=\"'collapse-' + id + '-heading'\">\n\n <div class=\"accordion-body\">\n <ng-content></ng-content>\n </div>\n </div>\n </div>\n</div>\n\n" }]
345
- }], propDecorators: { title: [{
346
- type: Input
347
- }] } });
348
-
349
- class IconComponent {
350
- constructor(_renderer, _elementRef) {
351
- this._renderer = _renderer;
352
- this._elementRef = _elementRef;
353
- /**
354
- * Custom class
355
- */
356
- this.class = '';
357
- }
358
- /**
359
- * Return the icon href
360
- */
361
- get iconHref() {
362
- return `/bootstrap-italia/dist/svg/sprites.svg#it-${this.name}`;
363
- }
364
- /**
365
- * Return the icon class
366
- */
367
- get iconClass() {
368
- let iconClass = 'icon';
369
- if (this.size) {
370
- iconClass += ` icon-${this.size}`;
371
- }
372
- if (this.color) {
373
- iconClass += ` icon-${this.color}`;
374
- }
375
- if (this.class) {
376
- iconClass += ` ${this.class}`;
377
- }
378
- return iconClass;
379
- }
380
- ngAfterViewInit() {
381
- this._renderer.removeAttribute(this._elementRef.nativeElement, 'class');
382
- }
383
- }
384
- IconComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: IconComponent, deps: [{ token: i0.Renderer2 }, { token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component });
385
- IconComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.0.4", type: IconComponent, selector: "it-icon[name]", inputs: { name: "name", size: "size", color: "color", padded: "padded", class: "class" }, ngImport: i0, template: "<svg [class]=\"iconClass\" [class.icon-padded]=\"padded\">\n <use [attr.href]=\"iconHref\" [attr.xlink:href]=\"iconHref\"></use>\n</svg>\n", styles: [""] });
386
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: IconComponent, decorators: [{
387
- type: Component,
388
- args: [{ selector: 'it-icon[name]', template: "<svg [class]=\"iconClass\" [class.icon-padded]=\"padded\">\n <use [attr.href]=\"iconHref\" [attr.xlink:href]=\"iconHref\"></use>\n</svg>\n" }]
389
- }], ctorParameters: function () { return [{ type: i0.Renderer2 }, { type: i0.ElementRef }]; }, propDecorators: { name: [{
390
- type: Input
391
- }], size: [{
392
- type: Input
393
- }], color: [{
394
- type: Input
395
- }], padded: [{
396
- type: Input
397
- }], class: [{
398
- type: Input
399
- }] } });
400
-
401
- class AlertComponent extends AbstractComponent {
402
- constructor() {
403
- super(...arguments);
404
- /**
405
- * The alert color
406
- * @default info
407
- */
408
- this.color = 'info';
409
- /**
410
- * This event fires immediately when the instance's close method is called.
411
- */
412
- this.onClose = new EventEmitter();
413
- /**
414
- * This event fires when the alert has been closed (it will wait for CSS transitions to complete).
415
- */
416
- this.onClosed = new EventEmitter();
417
- }
418
- get isDismissible() {
419
- return isTrueBooleanInput(this.dismissible);
420
- }
421
- ngAfterViewInit() {
422
- super.ngAfterViewInit();
423
- if (this.alertElement) {
424
- const element = this.alertElement.nativeElement;
425
- this.alert = Alert.getOrCreateInstance(element);
426
- element.addEventListener('close.bs.alert', event => this.onClose.emit(event));
427
- element.addEventListener('closed.bs.alert', event => this.onClosed.emit(event));
428
- }
429
- }
430
- /**
431
- * Close an alert by removing it from the DOM.
432
- * If the `.fade` and `.show` classes are present in the element, the alert will be closed with a disappearing effect.
433
- */
434
- close() {
435
- this.alert?.close();
436
- }
437
- /**
438
- * The alert is removed
439
- */
440
- dispose() {
441
- this.alert?.dispose();
442
- }
443
- }
444
- AlertComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: AlertComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
445
- AlertComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.0.4", type: AlertComponent, selector: "it-alert", inputs: { color: "color", dismissible: "dismissible" }, outputs: { onClose: "onClose", onClosed: "onClosed" }, viewQueries: [{ propertyName: "alertElement", first: true, predicate: ["alertElement"], descendants: true }], exportAs: ["itAlert"], usesInheritance: true, ngImport: i0, template: "<div class=\"alert alert-{{color}}\" #alertElement\n [class.alert-dismissible]=\"isDismissible\"\n [class.fade]=\"isDismissible\"\n [class.show]=\"isDismissible\"\n role=\"alert\">\n <h4 class=\"alert-heading\">\n <ng-content select=\"[heading]\"></ng-content>\n </h4>\n\n <ng-content></ng-content>\n\n <button *ngIf=\"isDismissible\"\n type=\"button\"\n class=\"btn-close\"\n data-bs-dismiss=\"alert\"\n [attr.aria-label]=\"'it.core.close-alert'|translate\">\n <it-icon name=\"close\"></it-icon>\n </button>\n</div>\n", styles: [".alert-heading:empty{display:none}\n"], dependencies: [{ kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: IconComponent, selector: "it-icon[name]", inputs: ["name", "size", "color", "padded", "class"] }, { kind: "pipe", type: i1.TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
446
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: AlertComponent, decorators: [{
447
- type: Component,
448
- args: [{ selector: 'it-alert', exportAs: 'itAlert', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"alert alert-{{color}}\" #alertElement\n [class.alert-dismissible]=\"isDismissible\"\n [class.fade]=\"isDismissible\"\n [class.show]=\"isDismissible\"\n role=\"alert\">\n <h4 class=\"alert-heading\">\n <ng-content select=\"[heading]\"></ng-content>\n </h4>\n\n <ng-content></ng-content>\n\n <button *ngIf=\"isDismissible\"\n type=\"button\"\n class=\"btn-close\"\n data-bs-dismiss=\"alert\"\n [attr.aria-label]=\"'it.core.close-alert'|translate\">\n <it-icon name=\"close\"></it-icon>\n </button>\n</div>\n", styles: [".alert-heading:empty{display:none}\n"] }]
449
- }], propDecorators: { color: [{
450
- type: Input
451
- }], dismissible: [{
452
- type: Input
453
- }], onClose: [{
454
- type: Output
455
- }], onClosed: [{
456
- type: Output
457
- }], alertElement: [{
458
- type: ViewChild,
459
- args: ['alertElement']
460
- }] } });
461
-
462
- class BadgeDirective {
463
- get badgeClass() {
464
- let badgeClass = 'badge';
465
- if (isTrueBooleanInput(this.rounded)) {
466
- badgeClass += ` rounded-pill`;
467
- }
468
- if (this.color) {
469
- badgeClass += ` bg-${this.color}`;
470
- }
471
- return badgeClass;
472
- }
473
- }
474
- BadgeDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: BadgeDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
475
- BadgeDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.0.4", type: BadgeDirective, selector: "[itBadge]", inputs: { color: ["itBadge", "color"], rounded: "rounded" }, host: { properties: { "class": "this.badgeClass" } }, exportAs: ["itBadge"], ngImport: i0 });
476
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: BadgeDirective, decorators: [{
477
- type: Directive,
478
- args: [{
479
- selector: '[itBadge]',
480
- exportAs: 'itBadge'
481
- }]
482
- }], propDecorators: { color: [{
483
- type: Input,
484
- args: ['itBadge']
485
- }], rounded: [{
486
- type: Input,
487
- args: ['rounded']
488
- }], badgeClass: [{
489
- type: HostBinding,
490
- args: ['class']
491
- }] } });
492
-
493
- class ProgressBarComponent {
494
- /**
495
- * Return the background color
496
- */
497
- get bgColor() {
498
- if (!this.color) {
499
- return '';
500
- }
501
- return ` bg-${this.color}`;
502
- }
503
- get isIndeterminate() {
504
- return isTrueBooleanInput(this.indeterminate);
505
- }
506
- }
507
- ProgressBarComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: ProgressBarComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
508
- ProgressBarComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.0.4", type: ProgressBarComponent, selector: "it-progress-bar[value]", inputs: { value: "value", showLabel: "showLabel", indeterminate: "indeterminate", color: "color" }, ngImport: i0, template: "<div class=\"progress-bar-wrapper\">\n <div *ngIf=\"showLabel\" class=\"progress-bar-label\">\n <span class=\"visually-hidden\">{{'it.core.progress'|translate}} </span>{{value}}%\n </div>\n <div class=\"progress\"\n [class.progress-color]=\"!!color\"\n [class.progress-indeterminate]=\"isIndeterminate\">\n\n <div *ngIf=\"isIndeterminate; else determinate\" class=\"progress-bar{{bgColor}}\" role=\"progressbar\"></div>\n <ng-template #determinate>\n <div class=\"progress-bar{{bgColor}}\" role=\"progressbar\" [style.width.%]=\"value\"\n [attr.aria-valuenow]=\"value\" aria-valuemin=\"0\" aria-valuemax=\"100\"></div>\n </ng-template>\n </div>\n</div>\n", styles: [""], dependencies: [{ kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "pipe", type: i1.TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
509
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: ProgressBarComponent, decorators: [{
510
- type: Component,
511
- args: [{ selector: 'it-progress-bar[value]', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"progress-bar-wrapper\">\n <div *ngIf=\"showLabel\" class=\"progress-bar-label\">\n <span class=\"visually-hidden\">{{'it.core.progress'|translate}} </span>{{value}}%\n </div>\n <div class=\"progress\"\n [class.progress-color]=\"!!color\"\n [class.progress-indeterminate]=\"isIndeterminate\">\n\n <div *ngIf=\"isIndeterminate; else determinate\" class=\"progress-bar{{bgColor}}\" role=\"progressbar\"></div>\n <ng-template #determinate>\n <div class=\"progress-bar{{bgColor}}\" role=\"progressbar\" [style.width.%]=\"value\"\n [attr.aria-valuenow]=\"value\" aria-valuemin=\"0\" aria-valuemax=\"100\"></div>\n </ng-template>\n </div>\n</div>\n" }]
512
- }], propDecorators: { value: [{
513
- type: Input
514
- }], showLabel: [{
515
- type: Input
516
- }], indeterminate: [{
517
- type: Input
518
- }], color: [{
519
- type: Input
520
- }] } });
521
-
522
- class ProgressButtonComponent {
523
- get isProgress() {
524
- return typeof this.progress === 'number' || isTrueBooleanInput(this.progress);
525
- }
526
- get progressValue() {
527
- return typeof this.progress === 'number' ? this.progress : 0;
528
- }
529
- get isIndeterminate() {
530
- return typeof this.progress !== 'number' && isTrueBooleanInput(this.progress);
531
- }
532
- }
533
- ProgressButtonComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: ProgressButtonComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
534
- ProgressButtonComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.0.4", type: ProgressButtonComponent, selector: "button[itButton][progress]", inputs: { progress: "progress", progressColor: "progressColor" }, ngImport: i0, template: "<ng-content></ng-content>\n\n<it-progress-bar *ngIf=\"isProgress\"\n [value]=\"progressValue\"\n [indeterminate]=\"isIndeterminate\"\n [color]=\"progressColor\"></it-progress-bar>\n", styles: [""], dependencies: [{ kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: ProgressBarComponent, selector: "it-progress-bar[value]", inputs: ["value", "showLabel", "indeterminate", "color"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
535
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: ProgressButtonComponent, decorators: [{
536
- type: Component,
537
- args: [{ selector: 'button[itButton][progress]', changeDetection: ChangeDetectionStrategy.OnPush, template: "<ng-content></ng-content>\n\n<it-progress-bar *ngIf=\"isProgress\"\n [value]=\"progressValue\"\n [indeterminate]=\"isIndeterminate\"\n [color]=\"progressColor\"></it-progress-bar>\n" }]
538
- }], propDecorators: { progress: [{
539
- type: Input
540
- }], progressColor: [{
541
- type: Input
542
- }] } });
543
-
544
- class ButtonDirective {
545
- constructor(progressButtonComponent) {
546
- this.progressButtonComponent = progressButtonComponent;
547
- this.isFocus = false;
548
- }
549
- onFocus() {
550
- this.isFocus = true;
551
- }
552
- onBlur() {
553
- this.isFocus = false;
554
- }
555
- get hostClasses() {
556
- let cssClass = 'btn';
557
- if (this.color) {
558
- cssClass += ` btn-${this.color}`;
559
- }
560
- if (this.size) {
561
- cssClass += ` btn-${this.size}`;
562
- }
563
- if (this.block) {
564
- cssClass += ' btn-block';
565
- }
566
- if (isTrueBooleanInput(this.disabled)) {
567
- cssClass += ' disabled';
568
- }
569
- if (this.isFocus) {
570
- cssClass += ' focus--mouse';
571
- }
572
- if (this.icons?.length && !this.progressButtonComponent) {
573
- cssClass += ' btn-icon';
574
- }
575
- if (!!this.progressButtonComponent) {
576
- cssClass += ' btn-progress';
577
- }
578
- return cssClass;
579
- }
580
- }
581
- ButtonDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: ButtonDirective, deps: [{ token: ProgressButtonComponent, host: true, optional: true }], target: i0.ɵɵFactoryTarget.Directive });
582
- ButtonDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.0.4", type: ButtonDirective, selector: "[itButton]", inputs: { color: ["itButton", "color"], size: "size", block: "block", disabled: "disabled" }, host: { listeners: { "focus": "onFocus()", "blur": "onBlur()" }, properties: { "disabled": "this.disabled", "class": "this.hostClasses" } }, queries: [{ propertyName: "icons", predicate: IconComponent }], exportAs: ["itButton"], ngImport: i0 });
583
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: ButtonDirective, decorators: [{
584
- type: Directive,
585
- args: [{
586
- selector: '[itButton]',
587
- exportAs: 'itButton'
588
- }]
589
- }], ctorParameters: function () { return [{ type: ProgressButtonComponent, decorators: [{
590
- type: Optional
591
- }, {
592
- type: Host
593
- }] }]; }, propDecorators: { color: [{
594
- type: Input,
595
- args: ['itButton']
596
- }], size: [{
597
- type: Input
598
- }], block: [{
599
- type: Input
600
- }], disabled: [{
601
- type: Input
602
- }, {
603
- type: HostBinding,
604
- args: ['disabled']
605
- }], icons: [{
606
- type: ContentChildren,
607
- args: [IconComponent]
608
- }], onFocus: [{
609
- type: HostListener,
610
- args: ['focus']
611
- }], onBlur: [{
612
- type: HostListener,
613
- args: ['blur']
614
- }], hostClasses: [{
615
- type: HostBinding,
616
- args: ['class']
617
- }] } });
618
-
619
- class CalloutComponent {
620
- constructor() {
621
- this._label = undefined;
622
- this._hiddenLabel = undefined;
623
- this._color = undefined;
624
- this._appearance = 'default';
625
- this._icon = undefined;
626
- }
627
- /**
628
- * Callout label
629
- */
630
- set label(value) { this._label = value; }
631
- get label() { return this._label; }
632
- /**
633
- * Callout hiddenLabel
634
- */
635
- set hiddenLabel(value) { this._hiddenLabel = value; }
636
- get hiddenLabel() { return this._hiddenLabel; }
637
- /**
638
- * Callout color
639
- * - <b>success</b>
640
- * - <b>danger</b>
641
- * - <b>warning</b>
642
- * - <b>important</b>
643
- * - <b>note</b>
644
- */
645
- set color(value) { this._color = value; }
646
- get color() { return this._color; }
647
- /**
648
- * Callout appearance
649
- * - <b>default</b>
650
- * - <b>highlight</b>: Callout version with border only on the left side
651
- * - <b>more</b>: It looks radically different from the other styles available and is suitable for more extensive texts
652
- * @default default
653
- */
654
- set appearance(value) { this._appearance = value; }
655
- get appearance() { return this._appearance; }
656
- /**
657
- * Custom icon
658
- */
659
- set icon(value) { this._icon = value; }
660
- get icon() { return this._icon; }
661
- get iconName() {
662
- if (this._icon) {
663
- return this._icon;
664
- }
665
- if (this.appearance === 'more') {
666
- return 'zoom-in';
667
- }
668
- switch (this.color) {
669
- case 'success':
670
- return 'check-circle';
671
- case 'warning':
672
- return 'help-circle';
673
- case 'danger':
674
- return 'close-circle';
675
- case 'important':
676
- case 'note':
677
- default:
678
- return 'info-circle';
679
- }
680
- }
681
- }
682
- CalloutComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: CalloutComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
683
- CalloutComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.0.4", type: CalloutComponent, selector: "it-callout", inputs: { label: "label", hiddenLabel: "hiddenLabel", color: "color", appearance: "appearance", icon: "icon" }, ngImport: i0, template: "<div class=\"callout {{color}}\" [class.callout-highlight]=\"appearance === 'highlight'\"\n [class.callout-more]=\"appearance === 'more'\">\n <div class=\"callout-title\" *ngIf=\"label\">\n <it-icon [name]=\"iconName\"></it-icon>\n <span *ngIf=\"hiddenLabel\" class=\"visually-hidden\">{{ hiddenLabel }}</span>\n <span>{{ label }}</span>\n </div>\n <p class=\"callout-big-text\">\n <ng-content select=\"[bigText]\"></ng-content>\n </p>\n <ng-content></ng-content>\n</div>", styles: [".callout-big-text:empty{display:none}\n"], dependencies: [{ kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: IconComponent, selector: "it-icon[name]", inputs: ["name", "size", "color", "padded", "class"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
684
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: CalloutComponent, decorators: [{
685
- type: Component,
686
- args: [{ selector: 'it-callout', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"callout {{color}}\" [class.callout-highlight]=\"appearance === 'highlight'\"\n [class.callout-more]=\"appearance === 'more'\">\n <div class=\"callout-title\" *ngIf=\"label\">\n <it-icon [name]=\"iconName\"></it-icon>\n <span *ngIf=\"hiddenLabel\" class=\"visually-hidden\">{{ hiddenLabel }}</span>\n <span>{{ label }}</span>\n </div>\n <p class=\"callout-big-text\">\n <ng-content select=\"[bigText]\"></ng-content>\n </p>\n <ng-content></ng-content>\n</div>", styles: [".callout-big-text:empty{display:none}\n"] }]
687
- }], propDecorators: { label: [{
688
- type: Input
689
- }], hiddenLabel: [{
690
- type: Input
691
- }], color: [{
692
- type: Input
693
- }], appearance: [{
694
- type: Input
695
- }], icon: [{
696
- type: Input
697
- }] } });
698
-
699
- class CardComponent extends AbstractComponent {
700
- constructor() {
701
- super(...arguments);
702
- /**
703
- * It serves to space the cards in their mobile version.
704
- * @default true
705
- */
706
- this.space = true;
707
- /**
708
- * Custom card class
709
- */
710
- this.cardClass = '';
711
- /**
712
- * Custom card body class
713
- */
714
- this.bodyClass = '';
715
- }
716
- get isSpace() {
717
- return isTrueBooleanInput(this.space);
718
- }
719
- get isTeaser() {
720
- return isTrueBooleanInput(this.teaser);
721
- }
722
- get isHasImage() {
723
- return isTrueBooleanInput(this.hasImage);
724
- }
725
- get isRounded() {
726
- return isTrueBooleanInput(this.rounded);
727
- }
728
- get isShadow() {
729
- return isTrueBooleanInput(this.shadow);
730
- }
731
- }
732
- CardComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: CardComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
733
- CardComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.0.4", type: CardComponent, selector: "it-card", inputs: { space: "space", teaser: "teaser", hasImage: "hasImage", rounded: "rounded", shadow: "shadow", cardClass: "cardClass", bodyClass: "bodyClass" }, usesInheritance: true, ngImport: i0, template: "<div class=\"card-wrapper\" [class.card-space]=\"isSpace\">\n <div class=\"card {{cardClass}}\"\n [class.card-teaser]=\"isTeaser\"\n [class.card-img.no-after]=\"isHasImage\"\n [class.shadow]=\"isShadow\"\n [class.rounded]=\"isRounded\">\n\n <ng-content select=\"[beforeBody]\"></ng-content>\n\n <div class=\"card-body {{bodyClass}}\">\n <ng-content></ng-content>\n </div>\n\n </div>\n</div>\n", styles: [".card-body:empty{display:none}\n"] });
734
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: CardComponent, decorators: [{
735
- type: Component,
736
- args: [{ selector: 'it-card', template: "<div class=\"card-wrapper\" [class.card-space]=\"isSpace\">\n <div class=\"card {{cardClass}}\"\n [class.card-teaser]=\"isTeaser\"\n [class.card-img.no-after]=\"isHasImage\"\n [class.shadow]=\"isShadow\"\n [class.rounded]=\"isRounded\">\n\n <ng-content select=\"[beforeBody]\"></ng-content>\n\n <div class=\"card-body {{bodyClass}}\">\n <ng-content></ng-content>\n </div>\n\n </div>\n</div>\n", styles: [".card-body:empty{display:none}\n"] }]
737
- }], propDecorators: { space: [{
738
- type: Input
739
- }], teaser: [{
740
- type: Input
741
- }], hasImage: [{
742
- type: Input
743
- }], rounded: [{
744
- type: Input
745
- }], shadow: [{
746
- type: Input
747
- }], cardClass: [{
748
- type: Input
749
- }], bodyClass: [{
750
- type: Input
751
- }] } });
752
-
753
- class CarouselItemComponent {
754
- }
755
- CarouselItemComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: CarouselItemComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
756
- CarouselItemComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.0.4", type: CarouselItemComponent, selector: "it-carousel-item", viewQueries: [{ propertyName: "htmlContent", first: true, predicate: TemplateRef, descendants: true }], ngImport: i0, template: "<ng-template>\n <ng-content></ng-content>\n</ng-template>\n", styles: [""] });
757
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: CarouselItemComponent, decorators: [{
758
- type: Component,
759
- args: [{ selector: 'it-carousel-item', template: "<ng-template>\n <ng-content></ng-content>\n</ng-template>\n" }]
760
- }], propDecorators: { htmlContent: [{
761
- type: ViewChild,
762
- args: [TemplateRef]
763
- }] } });
764
-
765
- class CarouselComponent {
766
- constructor() {
767
- /**
768
- * The carousel type
769
- * @default default
770
- */
771
- this.type = 'default';
772
- /**
773
- * Custom class in splide__track element
774
- */
775
- this.trackClass = '';
776
- }
777
- get typeClass() {
778
- const typeClass = 'it-carousel-landscape-abstract';
779
- return this.type === 'default' ? typeClass : typeClass + `-${this.type}`;
780
- }
781
- get isFullCarousel() {
782
- return isTrueBooleanInput(this.fullCarousel);
783
- }
784
- get isBigImg() {
785
- return isTrueBooleanInput(this.bigImg);
786
- }
787
- get isLined() {
788
- return isTrueBooleanInput(this.lined);
789
- }
790
- ngAfterViewInit() {
791
- this.carousel = CarouselBI.getOrCreateInstance(this.carouselDiv.nativeElement);
792
- }
793
- /**
794
- * Removes CarouselBI features
795
- */
796
- dispose() {
797
- this.carousel?.dispose();
798
- }
799
- }
800
- CarouselComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: CarouselComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
801
- CarouselComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.0.4", type: CarouselComponent, selector: "it-carousel", inputs: { title: "title", type: "type", trackClass: "trackClass", fullCarousel: "fullCarousel", bigImg: "bigImg", lined: "lined" }, queries: [{ propertyName: "items", predicate: CarouselItemComponent }], viewQueries: [{ propertyName: "carouselDiv", first: true, predicate: ["carousel"], descendants: true }], exportAs: ["itCarousel"], ngImport: i0, template: "<div #carousel class=\"it-carousel-wrapper splide {{typeClass}}\"\n [class.it-full-carousel]=\"isFullCarousel\"\n [class.it-big-img]=\"isBigImg\"\n data-bs-carousel-splide>\n\n <div class=\"it-header-block\" *ngIf=\"title\">\n <div class=\"it-header-block-title\">\n <h2>{{title}}</h2>\n </div>\n </div>\n\n <div class=\"splide__track {{trackClass}}\">\n <ul class=\"splide__list\">\n <li *ngFor=\"let item of items\" class=\"splide__slide\" [class.lined_slide]=\"isLined\">\n <div class=\"it-single-slide-wrapper\">\n <ng-container *ngTemplateOutlet=\"item.htmlContent\"></ng-container>\n </div>\n </li>\n </ul>\n </div>\n</div>\n", styles: [".splide__container{box-sizing:border-box;position:relative}.splide__list{-webkit-backface-visibility:hidden;backface-visibility:hidden;display:flex;height:100%;margin:0!important;padding:0!important;transform-style:preserve-3d}.splide.is-initialized:not(.is-active) .splide__list{display:block}.splide__pagination{align-items:center;display:flex;flex-wrap:wrap;justify-content:center;margin:0;pointer-events:none}.splide__pagination li{display:inline-block;line-height:1;list-style-type:none;margin:0;pointer-events:auto}.splide__progress__bar{width:0}.splide{outline:none;position:relative;visibility:hidden}.splide.is-initialized,.splide.is-rendered{visibility:visible}.splide__slide{-webkit-backface-visibility:hidden;backface-visibility:hidden;box-sizing:border-box;flex-shrink:0;list-style-type:none!important;margin:0;outline:none;position:relative}.splide__slide img{vertical-align:bottom}.splide__slider{position:relative}.splide__spinner{animation:splide-loading 1s linear infinite;border:2px solid #999;border-left-color:transparent;border-radius:50%;contain:strict;display:inline-block;height:20px;inset:0;margin:auto;position:absolute;width:20px}.splide__track{overflow:hidden;position:relative;z-index:0}@keyframes splide-loading{0%{transform:rotate(0)}to{transform:rotate(1turn)}}.splide--draggable>.splide__slider>.splide__track,.splide--draggable>.splide__track{-webkit-user-select:none;user-select:none}.splide--fade>.splide__slider>.splide__track>.splide__list,.splide--fade>.splide__track>.splide__list{display:block}.splide--fade>.splide__slider>.splide__track>.splide__list>.splide__slide,.splide--fade>.splide__track>.splide__list>.splide__slide{left:0;opacity:0;position:absolute;top:0;z-index:0}.splide--fade>.splide__slider>.splide__track>.splide__list>.splide__slide.is-active,.splide--fade>.splide__track>.splide__list>.splide__slide.is-active{opacity:1;position:relative;z-index:1}.splide--rtl{direction:rtl}.splide--ttb.is-active>.splide__slider>.splide__track>.splide__list,.splide--ttb.is-active>.splide__track>.splide__list{display:block}.splide__arrow{align-items:center;background:#ccc;border:0;border-radius:50%;cursor:pointer;display:flex;height:2em;justify-content:center;opacity:.7;padding:0;position:absolute;top:50%;transform:translateY(-50%);width:2em;z-index:1}.splide__arrow svg{fill:#000;height:1.2em;width:1.2em}.splide__arrow:hover{opacity:.9}.splide__arrow:focus{outline:none}.splide__arrow--prev{left:1em}.splide__arrow--prev svg{transform:scaleX(-1)}.splide__arrow--next{right:1em}.splide__pagination{bottom:.5em;left:0;padding:0 1em;position:absolute;right:0;z-index:1}.splide__pagination__page{background:#ccc;border:0;border-radius:50%;display:inline-block;height:8px;margin:3px;opacity:.7;padding:0;transition:transform .2s linear;width:8px}.splide__pagination__page.is-active{background:#fff;transform:scale(1.4)}.splide__pagination__page:hover{cursor:pointer;opacity:.9}.splide__pagination__page:focus{outline:none}.splide__progress__bar{background:#ccc;height:3px}.splide--nav>.splide__slider>.splide__track>.splide__list>.splide__slide,.splide--nav>.splide__track>.splide__list>.splide__slide{border:3px solid transparent;cursor:pointer}.splide--nav>.splide__slider>.splide__track>.splide__list>.splide__slide.is-active,.splide--nav>.splide__track>.splide__list>.splide__slide.is-active{border:3px solid #000}.splide--nav>.splide__slider>.splide__track>.splide__list>.splide__slide:focus,.splide--nav>.splide__track>.splide__list>.splide__slide:focus{outline:none}.splide--rtl>.splide__arrows .splide__arrow--prev,.splide--rtl>.splide__slider>.splide__track>.splide__arrows .splide__arrow--prev,.splide--rtl>.splide__track>.splide__arrows .splide__arrow--prev{left:auto;right:1em}.splide--rtl>.splide__arrows .splide__arrow--prev svg,.splide--rtl>.splide__slider>.splide__track>.splide__arrows .splide__arrow--prev svg,.splide--rtl>.splide__track>.splide__arrows .splide__arrow--prev svg{transform:scaleX(1)}.splide--rtl>.splide__arrows .splide__arrow--next,.splide--rtl>.splide__slider>.splide__track>.splide__arrows .splide__arrow--next,.splide--rtl>.splide__track>.splide__arrows .splide__arrow--next{left:1em;right:auto}.splide--rtl>.splide__arrows .splide__arrow--next svg,.splide--rtl>.splide__slider>.splide__track>.splide__arrows .splide__arrow--next svg,.splide--rtl>.splide__track>.splide__arrows .splide__arrow--next svg{transform:scaleX(-1)}.splide--ttb>.splide__arrows .splide__arrow,.splide--ttb>.splide__slider>.splide__track>.splide__arrows .splide__arrow,.splide--ttb>.splide__track>.splide__arrows .splide__arrow{left:50%;transform:translate(-50%)}.splide--ttb>.splide__arrows .splide__arrow--prev,.splide--ttb>.splide__slider>.splide__track>.splide__arrows .splide__arrow--prev,.splide--ttb>.splide__track>.splide__arrows .splide__arrow--prev{top:1em}.splide--ttb>.splide__arrows .splide__arrow--prev svg,.splide--ttb>.splide__slider>.splide__track>.splide__arrows .splide__arrow--prev svg,.splide--ttb>.splide__track>.splide__arrows .splide__arrow--prev svg{transform:rotate(-90deg)}.splide--ttb>.splide__arrows .splide__arrow--next,.splide--ttb>.splide__slider>.splide__track>.splide__arrows .splide__arrow--next,.splide--ttb>.splide__track>.splide__arrows .splide__arrow--next{bottom:1em;top:auto}.splide--ttb>.splide__arrows .splide__arrow--next svg,.splide--ttb>.splide__slider>.splide__track>.splide__arrows .splide__arrow--next svg,.splide--ttb>.splide__track>.splide__arrows .splide__arrow--next svg{transform:rotate(90deg)}.splide--ttb>.splide__pagination,.splide--ttb>.splide__slider>.splide__pagination{display:flex;flex-direction:column;inset:0 .5em 0 auto;padding:1em 0}\n"], dependencies: [{ kind: "directive", type: i1$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }] });
802
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: CarouselComponent, decorators: [{
803
- type: Component,
804
- args: [{ selector: 'it-carousel', exportAs: 'itCarousel', template: "<div #carousel class=\"it-carousel-wrapper splide {{typeClass}}\"\n [class.it-full-carousel]=\"isFullCarousel\"\n [class.it-big-img]=\"isBigImg\"\n data-bs-carousel-splide>\n\n <div class=\"it-header-block\" *ngIf=\"title\">\n <div class=\"it-header-block-title\">\n <h2>{{title}}</h2>\n </div>\n </div>\n\n <div class=\"splide__track {{trackClass}}\">\n <ul class=\"splide__list\">\n <li *ngFor=\"let item of items\" class=\"splide__slide\" [class.lined_slide]=\"isLined\">\n <div class=\"it-single-slide-wrapper\">\n <ng-container *ngTemplateOutlet=\"item.htmlContent\"></ng-container>\n </div>\n </li>\n </ul>\n </div>\n</div>\n", styles: [".splide__container{box-sizing:border-box;position:relative}.splide__list{-webkit-backface-visibility:hidden;backface-visibility:hidden;display:flex;height:100%;margin:0!important;padding:0!important;transform-style:preserve-3d}.splide.is-initialized:not(.is-active) .splide__list{display:block}.splide__pagination{align-items:center;display:flex;flex-wrap:wrap;justify-content:center;margin:0;pointer-events:none}.splide__pagination li{display:inline-block;line-height:1;list-style-type:none;margin:0;pointer-events:auto}.splide__progress__bar{width:0}.splide{outline:none;position:relative;visibility:hidden}.splide.is-initialized,.splide.is-rendered{visibility:visible}.splide__slide{-webkit-backface-visibility:hidden;backface-visibility:hidden;box-sizing:border-box;flex-shrink:0;list-style-type:none!important;margin:0;outline:none;position:relative}.splide__slide img{vertical-align:bottom}.splide__slider{position:relative}.splide__spinner{animation:splide-loading 1s linear infinite;border:2px solid #999;border-left-color:transparent;border-radius:50%;contain:strict;display:inline-block;height:20px;inset:0;margin:auto;position:absolute;width:20px}.splide__track{overflow:hidden;position:relative;z-index:0}@keyframes splide-loading{0%{transform:rotate(0)}to{transform:rotate(1turn)}}.splide--draggable>.splide__slider>.splide__track,.splide--draggable>.splide__track{-webkit-user-select:none;user-select:none}.splide--fade>.splide__slider>.splide__track>.splide__list,.splide--fade>.splide__track>.splide__list{display:block}.splide--fade>.splide__slider>.splide__track>.splide__list>.splide__slide,.splide--fade>.splide__track>.splide__list>.splide__slide{left:0;opacity:0;position:absolute;top:0;z-index:0}.splide--fade>.splide__slider>.splide__track>.splide__list>.splide__slide.is-active,.splide--fade>.splide__track>.splide__list>.splide__slide.is-active{opacity:1;position:relative;z-index:1}.splide--rtl{direction:rtl}.splide--ttb.is-active>.splide__slider>.splide__track>.splide__list,.splide--ttb.is-active>.splide__track>.splide__list{display:block}.splide__arrow{align-items:center;background:#ccc;border:0;border-radius:50%;cursor:pointer;display:flex;height:2em;justify-content:center;opacity:.7;padding:0;position:absolute;top:50%;transform:translateY(-50%);width:2em;z-index:1}.splide__arrow svg{fill:#000;height:1.2em;width:1.2em}.splide__arrow:hover{opacity:.9}.splide__arrow:focus{outline:none}.splide__arrow--prev{left:1em}.splide__arrow--prev svg{transform:scaleX(-1)}.splide__arrow--next{right:1em}.splide__pagination{bottom:.5em;left:0;padding:0 1em;position:absolute;right:0;z-index:1}.splide__pagination__page{background:#ccc;border:0;border-radius:50%;display:inline-block;height:8px;margin:3px;opacity:.7;padding:0;transition:transform .2s linear;width:8px}.splide__pagination__page.is-active{background:#fff;transform:scale(1.4)}.splide__pagination__page:hover{cursor:pointer;opacity:.9}.splide__pagination__page:focus{outline:none}.splide__progress__bar{background:#ccc;height:3px}.splide--nav>.splide__slider>.splide__track>.splide__list>.splide__slide,.splide--nav>.splide__track>.splide__list>.splide__slide{border:3px solid transparent;cursor:pointer}.splide--nav>.splide__slider>.splide__track>.splide__list>.splide__slide.is-active,.splide--nav>.splide__track>.splide__list>.splide__slide.is-active{border:3px solid #000}.splide--nav>.splide__slider>.splide__track>.splide__list>.splide__slide:focus,.splide--nav>.splide__track>.splide__list>.splide__slide:focus{outline:none}.splide--rtl>.splide__arrows .splide__arrow--prev,.splide--rtl>.splide__slider>.splide__track>.splide__arrows .splide__arrow--prev,.splide--rtl>.splide__track>.splide__arrows .splide__arrow--prev{left:auto;right:1em}.splide--rtl>.splide__arrows .splide__arrow--prev svg,.splide--rtl>.splide__slider>.splide__track>.splide__arrows .splide__arrow--prev svg,.splide--rtl>.splide__track>.splide__arrows .splide__arrow--prev svg{transform:scaleX(1)}.splide--rtl>.splide__arrows .splide__arrow--next,.splide--rtl>.splide__slider>.splide__track>.splide__arrows .splide__arrow--next,.splide--rtl>.splide__track>.splide__arrows .splide__arrow--next{left:1em;right:auto}.splide--rtl>.splide__arrows .splide__arrow--next svg,.splide--rtl>.splide__slider>.splide__track>.splide__arrows .splide__arrow--next svg,.splide--rtl>.splide__track>.splide__arrows .splide__arrow--next svg{transform:scaleX(-1)}.splide--ttb>.splide__arrows .splide__arrow,.splide--ttb>.splide__slider>.splide__track>.splide__arrows .splide__arrow,.splide--ttb>.splide__track>.splide__arrows .splide__arrow{left:50%;transform:translate(-50%)}.splide--ttb>.splide__arrows .splide__arrow--prev,.splide--ttb>.splide__slider>.splide__track>.splide__arrows .splide__arrow--prev,.splide--ttb>.splide__track>.splide__arrows .splide__arrow--prev{top:1em}.splide--ttb>.splide__arrows .splide__arrow--prev svg,.splide--ttb>.splide__slider>.splide__track>.splide__arrows .splide__arrow--prev svg,.splide--ttb>.splide__track>.splide__arrows .splide__arrow--prev svg{transform:rotate(-90deg)}.splide--ttb>.splide__arrows .splide__arrow--next,.splide--ttb>.splide__slider>.splide__track>.splide__arrows .splide__arrow--next,.splide--ttb>.splide__track>.splide__arrows .splide__arrow--next{bottom:1em;top:auto}.splide--ttb>.splide__arrows .splide__arrow--next svg,.splide--ttb>.splide__slider>.splide__track>.splide__arrows .splide__arrow--next svg,.splide--ttb>.splide__track>.splide__arrows .splide__arrow--next svg{transform:rotate(90deg)}.splide--ttb>.splide__pagination,.splide--ttb>.splide__slider>.splide__pagination{display:flex;flex-direction:column;inset:0 .5em 0 auto;padding:1em 0}\n"] }]
805
- }], propDecorators: { title: [{
806
- type: Input
807
- }], type: [{
808
- type: Input
809
- }], trackClass: [{
810
- type: Input
811
- }], fullCarousel: [{
812
- type: Input
813
- }], bigImg: [{
814
- type: Input
815
- }], lined: [{
816
- type: Input
817
- }], items: [{
818
- type: ContentChildren,
819
- args: [CarouselItemComponent]
820
- }], carouselDiv: [{
821
- type: ViewChild,
822
- args: ['carousel']
823
- }] } });
824
-
825
- class LinkComponent extends AbstractComponent {
826
- constructor() {
827
- super(...arguments);
828
- /**
829
- * Custom class
830
- */
831
- this.class = '';
832
- }
833
- get isExternalLink() {
834
- return isTrueBooleanInput(this.externalLink);
835
- }
836
- get isDisabled() {
837
- return isTrueBooleanInput(this.disabled);
838
- }
839
- ngAfterViewInit() {
840
- super.ngAfterViewInit();
841
- this._renderer.removeAttribute(this._elementRef.nativeElement, 'class');
842
- }
843
- }
844
- LinkComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: LinkComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
845
- LinkComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.0.4", type: LinkComponent, selector: "it-link", inputs: { href: "href", externalLink: "externalLink", disabled: "disabled", class: "class" }, usesInheritance: true, ngImport: i0, template: "<a *ngIf=\"!isExternalLink; else externalLink\" [class]=\"class\" [routerLink]=\"isDisabled ? null : href\">\n <ng-container *ngTemplateOutlet=\"linkContent\"></ng-container>\n</a>\n<ng-template #externalLink>\n <a [class]=\"class\" [attr.href]=\"isDisabled ? null : href\">\n <ng-container *ngTemplateOutlet=\"linkContent\"></ng-container>\n </a>\n</ng-template>\n\n<ng-template #linkContent>\n <ng-content></ng-content>\n</ng-template>\n", styles: [""], dependencies: [{ kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i2$1.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }] });
846
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: LinkComponent, decorators: [{
847
- type: Component,
848
- args: [{ selector: 'it-link', template: "<a *ngIf=\"!isExternalLink; else externalLink\" [class]=\"class\" [routerLink]=\"isDisabled ? null : href\">\n <ng-container *ngTemplateOutlet=\"linkContent\"></ng-container>\n</a>\n<ng-template #externalLink>\n <a [class]=\"class\" [attr.href]=\"isDisabled ? null : href\">\n <ng-container *ngTemplateOutlet=\"linkContent\"></ng-container>\n </a>\n</ng-template>\n\n<ng-template #linkContent>\n <ng-content></ng-content>\n</ng-template>\n" }]
849
- }], propDecorators: { href: [{
850
- type: Input
851
- }], externalLink: [{
852
- type: Input
853
- }], disabled: [{
854
- type: Input
855
- }], class: [{
856
- type: Input
857
- }] } });
858
-
859
- class DropdownItemComponent extends LinkComponent {
860
- constructor() {
861
- super(...arguments);
862
- /**
863
- * The icon position
864
- * @default right
865
- */
866
- this.iconPosition = 'right';
867
- /**
868
- * Change icon color if menu is dark
869
- * @default false
870
- */
871
- this.isDark = false;
872
- }
873
- get isDivider() {
874
- return isTrueBooleanInput(this.divider);
875
- }
876
- get isActive() {
877
- return isTrueBooleanInput(this.active);
878
- }
879
- get isLarge() {
880
- return isTrueBooleanInput(this.large);
881
- }
882
- get linkClass() {
883
- let linkClass = `list-item ${this.isActive ? 'active' : 'dropdown-item'}`;
884
- if (this.isDisabled) {
885
- linkClass += ' disabled';
886
- }
887
- if (this.isLarge) {
888
- linkClass += ' large';
889
- }
890
- if (this.iconName) {
891
- linkClass += ` ${this.iconPosition === 'right' ? 'right-icon' : 'left-icon'}`;
892
- }
893
- return linkClass;
894
- }
895
- setDark(dark) {
896
- if (this.isDark !== dark) {
897
- this.isDark = dark;
898
- this._changeDetectorRef.detectChanges();
899
- }
900
- }
901
- }
902
- DropdownItemComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: DropdownItemComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
903
- DropdownItemComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.0.4", type: DropdownItemComponent, selector: "it-dropdown-item", inputs: { divider: "divider", active: "active", large: "large", iconName: "iconName", iconPosition: "iconPosition" }, usesInheritance: true, ngImport: i0, template: "<li>\n <span *ngIf=\"isDivider; else item\" class=\"divider\"></span>\n\n <ng-template #item>\n <it-link [class]=\"linkClass\" [href]=\"href\" [externalLink]=\"externalLink\" [disabled]=\"disabled\">\n <it-icon *ngIf=\"iconName && iconPosition === 'left'\"\n size=\"sm\"\n [name]=\"iconName\"\n [color]=\"isDark ? 'light' : 'primary'\"\n [class]=\"iconPosition\"></it-icon>\n\n <span><ng-content></ng-content></span>\n\n <it-icon *ngIf=\"iconName && iconPosition === 'right'\"\n size=\"sm\"\n [name]=\"iconName\"\n [color]=\"isDark ? 'light' : 'primary'\"\n [class]=\"iconPosition\"></it-icon>\n\n <span *ngIf=\"isActive\" class=\"visually-hidden\">{{'it.core.active'|translate}}</span>\n </it-link>\n </ng-template>\n</li>\n", styles: [".list-item.disabled{pointer-events:none;cursor:default}\n"], dependencies: [{ kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: LinkComponent, selector: "it-link", inputs: ["href", "externalLink", "disabled", "class"] }, { kind: "component", type: IconComponent, selector: "it-icon[name]", inputs: ["name", "size", "color", "padded", "class"] }, { kind: "pipe", type: i1.TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
904
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: DropdownItemComponent, decorators: [{
905
- type: Component,
906
- args: [{ selector: 'it-dropdown-item', changeDetection: ChangeDetectionStrategy.OnPush, template: "<li>\n <span *ngIf=\"isDivider; else item\" class=\"divider\"></span>\n\n <ng-template #item>\n <it-link [class]=\"linkClass\" [href]=\"href\" [externalLink]=\"externalLink\" [disabled]=\"disabled\">\n <it-icon *ngIf=\"iconName && iconPosition === 'left'\"\n size=\"sm\"\n [name]=\"iconName\"\n [color]=\"isDark ? 'light' : 'primary'\"\n [class]=\"iconPosition\"></it-icon>\n\n <span><ng-content></ng-content></span>\n\n <it-icon *ngIf=\"iconName && iconPosition === 'right'\"\n size=\"sm\"\n [name]=\"iconName\"\n [color]=\"isDark ? 'light' : 'primary'\"\n [class]=\"iconPosition\"></it-icon>\n\n <span *ngIf=\"isActive\" class=\"visually-hidden\">{{'it.core.active'|translate}}</span>\n </it-link>\n </ng-template>\n</li>\n", styles: [".list-item.disabled{pointer-events:none;cursor:default}\n"] }]
907
- }], propDecorators: { divider: [{
908
- type: Input
909
- }], active: [{
910
- type: Input
911
- }], large: [{
912
- type: Input
913
- }], iconName: [{
914
- type: Input
915
- }], iconPosition: [{
916
- type: Input
917
- }] } });
918
-
919
- class DropdownComponent extends AbstractComponent {
920
- constructor() {
921
- super(...arguments);
922
- /**
923
- * Fires immediately when the show instance method is called.
924
- */
925
- this.onShow = new EventEmitter();
926
- /**
927
- * Fired when the dropdown has been made visible to the user and CSS transitions have completed.
928
- */
929
- this.onShown = new EventEmitter();
930
- /**
931
- * Fires immediately when the hide instance method has been called.
932
- */
933
- this.onHide = new EventEmitter();
934
- /**
935
- * Fired when the dropdown has finished being hidden from the user and CSS transitions have completed.
936
- */
937
- this.onHidden = new EventEmitter();
938
- }
939
- get buttonClass() {
940
- let btnClass = 'btn dropdown-toggle';
941
- if (this.color) {
942
- btnClass += ` btn-${this.color}`;
943
- }
944
- else {
945
- btnClass += ` btn-dropdown`;
946
- }
947
- return btnClass;
948
- }
949
- get isFullWidth() {
950
- return isTrueBooleanInput(this.fullWidth);
951
- }
952
- get isDark() {
953
- return isTrueBooleanInput(this.dark);
954
- }
955
- ngOnChanges(changes) {
956
- if (changes['dark'] && !changes['dark'].firstChange) {
957
- this.setDarkItems();
958
- }
959
- super.ngOnChanges(changes);
960
- }
961
- ngAfterViewInit() {
962
- super.ngAfterViewInit();
963
- this.setDarkItems();
964
- if (this.dropdownButton) {
965
- const element = this.dropdownButton.nativeElement;
966
- this.dropdown = Dropdown.getOrCreateInstance(element);
967
- element.addEventListener('show.bs.dropdown', event => this.onShow.emit(event));
968
- element.addEventListener('shown.bs.dropdown', event => this.onShown.emit(event));
969
- element.addEventListener('hide.bs.dropdown', event => this.onHide.emit(event));
970
- element.addEventListener('hidden.bs.dropdown', event => this.onHidden.emit(event));
971
- }
972
- }
973
- /**
974
- * Set child items dark mode
975
- * @private
976
- */
977
- setDarkItems() {
978
- this.items?.forEach(item => {
979
- item.setDark(this.isDark);
980
- });
981
- }
982
- /**
983
- * Toggles the dropdown menu of a given navbar or tabbed navigation.
984
- */
985
- toggle() {
986
- this.dropdown?.toggle();
987
- }
988
- /**
989
- * Shows the dropdown menu of a given navbar or tabbed navigation.
990
- */
991
- show() {
992
- this.dropdown?.show();
993
- }
994
- /**
995
- * Hides the dropdown menu of a given navbar or tabbed navigation.
996
- */
997
- hide() {
998
- this.dropdown?.hide();
999
- }
1000
- /**
1001
- * Updates the position of an element's dropdown.
1002
- */
1003
- update() {
1004
- this.dropdown?.update();
1005
- }
1006
- /**
1007
- * Destroys an element's dropdown. (Removes stored data on the DOM element)
1008
- */
1009
- dispose() {
1010
- this.dropdown?.dispose();
1011
- }
1012
- }
1013
- DropdownComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: DropdownComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
1014
- DropdownComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.0.4", type: DropdownComponent, selector: "it-dropdown[id]", inputs: { color: "color", direction: "direction", fullWidth: "fullWidth", dark: "dark" }, outputs: { onShow: "onShow", onShown: "onShown", onHide: "onHide", onHidden: "onHidden" }, queries: [{ propertyName: "items", predicate: DropdownItemComponent }], viewQueries: [{ propertyName: "dropdownButton", first: true, predicate: ["dropdownButton"], descendants: true }], exportAs: ["itDropdown"], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<div class=\"dropdown {{direction}}\">\n <button #dropdownButton [id]=\"id\"\n [class]=\"buttonClass\"\n type=\"button\"\n data-bs-toggle=\"dropdown\"\n aria-haspopup=\"true\"\n aria-expanded=\"false\">\n <ng-content select=\"[button]\"></ng-content>\n <it-icon class=\"icon-expand\" name=\"expand\" size=\"sm\" [color]=\"this.color ? 'light' : 'primary'\"></it-icon>\n </button>\n\n <div class=\"dropdown-menu\" [class.full-width]=\"isFullWidth\" [class.dark]=\"isDark\" [attr.aria-labelledby]=\"id\">\n <div class=\"link-list-wrapper\">\n <div class=\"link-list-heading\">\n <ng-content select=\"[listHeading]\"></ng-content>\n </div>\n <ul class=\"link-list\">\n <ng-content select=\"[list]\"></ng-content>\n </ul>\n </div>\n </div>\n</div>\n", styles: [".link-list-heading:empty{display:none}\n"], dependencies: [{ kind: "component", type: IconComponent, selector: "it-icon[name]", inputs: ["name", "size", "color", "padded", "class"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
1015
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: DropdownComponent, decorators: [{
1016
- type: Component,
1017
- args: [{ selector: 'it-dropdown[id]', exportAs: 'itDropdown', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"dropdown {{direction}}\">\n <button #dropdownButton [id]=\"id\"\n [class]=\"buttonClass\"\n type=\"button\"\n data-bs-toggle=\"dropdown\"\n aria-haspopup=\"true\"\n aria-expanded=\"false\">\n <ng-content select=\"[button]\"></ng-content>\n <it-icon class=\"icon-expand\" name=\"expand\" size=\"sm\" [color]=\"this.color ? 'light' : 'primary'\"></it-icon>\n </button>\n\n <div class=\"dropdown-menu\" [class.full-width]=\"isFullWidth\" [class.dark]=\"isDark\" [attr.aria-labelledby]=\"id\">\n <div class=\"link-list-wrapper\">\n <div class=\"link-list-heading\">\n <ng-content select=\"[listHeading]\"></ng-content>\n </div>\n <ul class=\"link-list\">\n <ng-content select=\"[list]\"></ng-content>\n </ul>\n </div>\n </div>\n</div>\n", styles: [".link-list-heading:empty{display:none}\n"] }]
1018
- }], propDecorators: { color: [{
1019
- type: Input
1020
- }], direction: [{
1021
- type: Input
1022
- }], fullWidth: [{
1023
- type: Input
1024
- }], dark: [{
1025
- type: Input
1026
- }], items: [{
1027
- type: ContentChildren,
1028
- args: [DropdownItemComponent]
1029
- }], onShow: [{
1030
- type: Output
1031
- }], onShown: [{
1032
- type: Output
1033
- }], onHide: [{
1034
- type: Output
1035
- }], onHidden: [{
1036
- type: Output
1037
- }], dropdownButton: [{
1038
- type: ViewChild,
1039
- args: ['dropdownButton']
1040
- }] } });
1041
-
1042
- class ListComponent {
1043
- }
1044
- ListComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: ListComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
1045
- ListComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.0.4", type: ListComponent, selector: "it-list", inputs: { linkList: "linkList" }, ngImport: i0, template: "<div class=\"it-list-wrapper\">\n <ul class=\"it-list\">\n <ng-content></ng-content>\n </ul>\n</div>\n", styles: [""] });
1046
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: ListComponent, decorators: [{
1047
- type: Component,
1048
- args: [{ selector: 'it-list', template: "<div class=\"it-list-wrapper\">\n <ul class=\"it-list\">\n <ng-content></ng-content>\n </ul>\n</div>\n" }]
1049
- }], propDecorators: { linkList: [{
1050
- type: Input
1051
- }] } });
1052
-
1053
- class ListItemComponent extends LinkComponent {
1054
- get itemClass() {
1055
- let itemClass = 'list-item';
1056
- if (isTrueBooleanInput(this.active)) {
1057
- itemClass += ` active`;
1058
- }
1059
- if (isTrueBooleanInput(this.large)) {
1060
- itemClass += ` large`;
1061
- }
1062
- if (this.class) {
1063
- itemClass += ` ${this.class}`;
1064
- }
1065
- return itemClass;
1066
- }
1067
- }
1068
- ListItemComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: ListItemComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
1069
- ListItemComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.0.4", type: ListItemComponent, selector: "it-list-item", inputs: { active: "active", large: "large", avatar: "avatar", image: "image" }, usesInheritance: true, ngImport: i0, template: "<li>\n <ng-template #content>\n <div class=\"it-rounded-icon\">\n <ng-content select=\"[icon]\"></ng-content>\n </div>\n\n <div *ngIf=\"avatar\" class=\"avatar size-lg\">\n <img [attr.src]=\"avatar\" alt=\"avatar\">\n </div>\n\n <div *ngIf=\"image\" class=\"it-thumb\">\n <img [attr.src]=\"image\" alt=\"thumb\">\n </div>\n\n <div class=\"it-right-zone\">\n <span class=\"text\">\n <ng-content></ng-content>\n </span>\n <ng-content select=\"[action]\"></ng-content>\n\n <span class=\"it-multiple\">\n <span class=\"metadata\">\n <ng-content select=\"[metadata]\"></ng-content>\n </span>\n\n <ng-content select=\"[multiple]\"></ng-content>\n </span>\n </div>\n </ng-template>\n\n\n <div *ngIf=\"!href; else link\" [class]=\"itemClass\">\n <ng-container *ngTemplateOutlet=\"content\"></ng-container>\n </div>\n\n <ng-template #link>\n <it-link [class]=\"itemClass\" [href]=\"href\" [externalLink]=\"externalLink\" [disabled]=\"disabled\">\n <ng-container *ngTemplateOutlet=\"content\"></ng-container>\n </it-link>\n </ng-template>\n</li>\n", styles: [".metadata:empty,.it-rounded-icon:empty{display:none}\n"], dependencies: [{ kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: LinkComponent, selector: "it-link", inputs: ["href", "externalLink", "disabled", "class"] }] });
1070
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: ListItemComponent, decorators: [{
1071
- type: Component,
1072
- args: [{ selector: 'it-list-item', template: "<li>\n <ng-template #content>\n <div class=\"it-rounded-icon\">\n <ng-content select=\"[icon]\"></ng-content>\n </div>\n\n <div *ngIf=\"avatar\" class=\"avatar size-lg\">\n <img [attr.src]=\"avatar\" alt=\"avatar\">\n </div>\n\n <div *ngIf=\"image\" class=\"it-thumb\">\n <img [attr.src]=\"image\" alt=\"thumb\">\n </div>\n\n <div class=\"it-right-zone\">\n <span class=\"text\">\n <ng-content></ng-content>\n </span>\n <ng-content select=\"[action]\"></ng-content>\n\n <span class=\"it-multiple\">\n <span class=\"metadata\">\n <ng-content select=\"[metadata]\"></ng-content>\n </span>\n\n <ng-content select=\"[multiple]\"></ng-content>\n </span>\n </div>\n </ng-template>\n\n\n <div *ngIf=\"!href; else link\" [class]=\"itemClass\">\n <ng-container *ngTemplateOutlet=\"content\"></ng-container>\n </div>\n\n <ng-template #link>\n <it-link [class]=\"itemClass\" [href]=\"href\" [externalLink]=\"externalLink\" [disabled]=\"disabled\">\n <ng-container *ngTemplateOutlet=\"content\"></ng-container>\n </it-link>\n </ng-template>\n</li>\n", styles: [".metadata:empty,.it-rounded-icon:empty{display:none}\n"] }]
1073
- }], propDecorators: { active: [{
1074
- type: Input
1075
- }], large: [{
1076
- type: Input
1077
- }], avatar: [{
1078
- type: Input
1079
- }], image: [{
1080
- type: Input
1081
- }] } });
1082
-
1083
- class ModalComponent extends AbstractComponent {
1084
- constructor() {
1085
- super(...arguments);
1086
- /**
1087
- * This event fires immediately when the instance method show is called.
1088
- */
1089
- this.onShow = new EventEmitter();
1090
- /**
1091
- * This event fires when the modal has been made visible to the user (it will wait for CSS transitions to complete).
1092
- */
1093
- this.onShown = new EventEmitter();
1094
- /**
1095
- * This event is raised immediately when the instance method hide has been called.
1096
- */
1097
- this.onHide = new EventEmitter();
1098
- /**
1099
- * This event fires when the modal has finished hiding from the user (it will wait for CSS transitions to complete).
1100
- */
1101
- this.onHidden = new EventEmitter();
1102
- /**
1103
- * This event is fired when the modal is displayed, its background is static and a click outside the modal or a press
1104
- * of the esc key occurs and data-bs-keyboard is set to false.
1105
- */
1106
- this.onHidePrevented = new EventEmitter();
1107
- }
1108
- ngAfterViewInit() {
1109
- super.ngAfterViewInit();
1110
- this._renderer.removeAttribute(this._elementRef.nativeElement, 'title');
1111
- if (this.modalElement) {
1112
- const element = this.modalElement.nativeElement;
1113
- this.modal = Modal.getOrCreateInstance(element);
1114
- element.addEventListener('show.bs.modal', event => this.onShow.emit(event));
1115
- element.addEventListener('shown.bs.modal', event => this.onShown.emit(event));
1116
- element.addEventListener('hide.bs.modal', event => this.onHide.emit(event));
1117
- element.addEventListener('hidden.bs.modal', event => this.onHidden.emit(event));
1118
- element.addEventListener('hidePrevented.bs.modal', event => this.onHidePrevented.emit(event));
1119
- }
1120
- }
1121
- /**
1122
- * Manually activate/deactivate a modal. Returns to the caller before the modal has actually been shown or hidden
1123
- */
1124
- toggle() {
1125
- this.modal?.toggle();
1126
- }
1127
- /**
1128
- * Manually open a modal. Returns to the caller before the modal has actually been displayed
1129
- */
1130
- show() {
1131
- this.modal?.show();
1132
- }
1133
- /**
1134
- * Manually hide a modal. Returns to the caller before the modal has actually been hidden
1135
- */
1136
- hide() {
1137
- this.modal?.hide();
1138
- }
1139
- /**
1140
- * Manually reposition the modal if the height of the modal changes when it is opened (in case a scroll bar appears).
1141
- */
1142
- handleUpdate() {
1143
- this.modal?.handleUpdate();
1144
- }
1145
- /**
1146
- * Destroys the modal of an element.
1147
- */
1148
- dispose() {
1149
- this.modal?.dispose();
1150
- }
1151
- }
1152
- ModalComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: ModalComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
1153
- ModalComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.0.4", type: ModalComponent, selector: "it-modal[id][title]", inputs: { title: "title", size: "size" }, outputs: { onShow: "onShow", onShown: "onShown", onHide: "onHide", onHidden: "onHidden", onHidePrevented: "onHidePrevented" }, viewQueries: [{ propertyName: "modalElement", first: true, predicate: ["modalElement"], descendants: true }], exportAs: ["itModal"], usesInheritance: true, ngImport: i0, template: "<div #modalElement [id]=\"id\" class=\"modal fade\"\n tabindex=\"-1\"\n role=\"dialog\"\n aria-hidden=\"true\"\n [attr.aria-labelledby]=\"id+'-label'\">\n <div class=\"modal-dialog {{size}}\">\n <div class=\"modal-content\">\n <div class=\"modal-header\">\n <h2 class=\"modal-title h5 no_toc\" id=\"{{id}}-label\">{{title}}</h2>\n <button type=\"button\" class=\"btn-close\" data-bs-dismiss=\"modal\"\n [attr.aria-label]=\"'it.core.close-modal'|translate\"></button>\n </div>\n <div class=\"modal-body mb-3\">\n <ng-content></ng-content>\n </div>\n <div class=\"modal-footer modal-footer-shadow\">\n <ng-content select=\"[footer]\"></ng-content>\n </div>\n </div>\n </div>\n</div>\n", styles: [".modal-footer:empty{display:none}\n"], dependencies: [{ kind: "pipe", type: i1.TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
1154
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: ModalComponent, decorators: [{
1155
- type: Component,
1156
- args: [{ selector: 'it-modal[id][title]', exportAs: 'itModal', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div #modalElement [id]=\"id\" class=\"modal fade\"\n tabindex=\"-1\"\n role=\"dialog\"\n aria-hidden=\"true\"\n [attr.aria-labelledby]=\"id+'-label'\">\n <div class=\"modal-dialog {{size}}\">\n <div class=\"modal-content\">\n <div class=\"modal-header\">\n <h2 class=\"modal-title h5 no_toc\" id=\"{{id}}-label\">{{title}}</h2>\n <button type=\"button\" class=\"btn-close\" data-bs-dismiss=\"modal\"\n [attr.aria-label]=\"'it.core.close-modal'|translate\"></button>\n </div>\n <div class=\"modal-body mb-3\">\n <ng-content></ng-content>\n </div>\n <div class=\"modal-footer modal-footer-shadow\">\n <ng-content select=\"[footer]\"></ng-content>\n </div>\n </div>\n </div>\n</div>\n", styles: [".modal-footer:empty{display:none}\n"] }]
1157
- }], propDecorators: { title: [{
1158
- type: Input
1159
- }], size: [{
1160
- type: Input
1161
- }], onShow: [{
1162
- type: Output
1163
- }], onShown: [{
1164
- type: Output
1165
- }], onHide: [{
1166
- type: Output
1167
- }], onHidden: [{
1168
- type: Output
1169
- }], onHidePrevented: [{
1170
- type: Output
1171
- }], modalElement: [{
1172
- type: ViewChild,
1173
- args: ['modalElement', { static: false }]
1174
- }] } });
1175
-
1176
- var NotificationType;
1177
- (function (NotificationType) {
1178
- NotificationType["Standard"] = "standard";
1179
- NotificationType["Success"] = "success";
1180
- NotificationType["Error"] = "error";
1181
- NotificationType["Info"] = "info";
1182
- NotificationType["Warning"] = "warning";
1183
- })(NotificationType || (NotificationType = {}));
1184
- var NotificationPosition;
1185
- (function (NotificationPosition) {
1186
- NotificationPosition["Top"] = "top-fix mt-3";
1187
- NotificationPosition["Bottom"] = "bottom-fix mb-3";
1188
- NotificationPosition["Left"] = "left-fix ms-3";
1189
- NotificationPosition["Right"] = "right-fix me-3";
1190
- })(NotificationPosition || (NotificationPosition = {}));
1191
-
1192
- class NotificationsService {
1193
- constructor() {
1194
- this.subject = new Subject();
1195
- }
1196
- /**
1197
- * Listen on notification arrived
1198
- * @param filterType filter type of notification
1199
- */
1200
- onNotification(filterType) {
1201
- return this.subject.asObservable().pipe(filter(n => n && (!filterType || (n.type === filterType))));
1202
- }
1203
- /**
1204
- * Show new notification
1205
- * @param notification notification
1206
- */
1207
- addNotification(notification) {
1208
- this.subject.next(notification);
1209
- }
1210
- /**
1211
- * Create new Standard notification
1212
- * @param title notification title
1213
- * @param message notification message
1214
- * @param dismissible notification dismissible
1215
- * @param duration notification duration (milliseconds)
1216
- * @param position notification position
1217
- */
1218
- standard(title, message, dismissible, duration, position) {
1219
- this.addNotification({
1220
- type: NotificationType.Standard,
1221
- message,
1222
- title,
1223
- duration,
1224
- dismissible,
1225
- position
1226
- });
1227
- }
1228
- /**
1229
- * Create new Success notification
1230
- * @param title notification title
1231
- * @param message notification message
1232
- * @param dismissible notification dismissible
1233
- * @param duration notification duration (milliseconds)
1234
- * @param position notification position
1235
- */
1236
- success(title, message, dismissible, duration, position) {
1237
- this.addNotification({
1238
- type: NotificationType.Success,
1239
- message,
1240
- title,
1241
- duration,
1242
- dismissible,
1243
- position
1244
- });
1245
- }
1246
- /**
1247
- * Create new Error notification
1248
- * @param title notification title
1249
- * @param message notification message
1250
- * @param dismissible notification dismissible
1251
- * @param duration notification duration (milliseconds)
1252
- * @param position notification position
1253
- */
1254
- error(title, message, dismissible, duration, position) {
1255
- this.addNotification({
1256
- type: NotificationType.Error,
1257
- message,
1258
- title,
1259
- duration,
1260
- dismissible,
1261
- position
1262
- });
1263
- }
1264
- /**
1265
- * Create new Warning notification
1266
- * @param title notification title
1267
- * @param message notification message
1268
- * @param dismissible notification dismissible
1269
- * @param duration notification duration (milliseconds)
1270
- * @param position notification position
1271
- */
1272
- warning(title, message, dismissible, duration, position) {
1273
- this.addNotification({
1274
- type: NotificationType.Warning,
1275
- message,
1276
- title,
1277
- duration,
1278
- dismissible,
1279
- position
1280
- });
1281
- }
1282
- /**
1283
- * Create new Info notification
1284
- * @param title notification title
1285
- * @param message notification message
1286
- * @param dismissible notification dismissible
1287
- * @param duration notification duration (milliseconds)
1288
- * @param position notification position
1289
- */
1290
- info(title, message, dismissible, duration, position) {
1291
- this.addNotification({
1292
- type: NotificationType.Info,
1293
- message,
1294
- title,
1295
- duration,
1296
- dismissible,
1297
- position
1298
- });
1299
- }
1300
- }
1301
- NotificationsService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: NotificationsService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
1302
- NotificationsService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: NotificationsService, providedIn: 'root' });
1303
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: NotificationsService, decorators: [{
1304
- type: Injectable,
1305
- args: [{ providedIn: 'root' }]
1306
- }] });
1307
-
1308
- class NotificationsComponent {
1309
- constructor(_changeDetectorRef, _notificationService) {
1310
- this._changeDetectorRef = _changeDetectorRef;
1311
- this._notificationService = _notificationService;
1312
- /**
1313
- * Default notifications duration (milliseconds)
1314
- * @default 8000
1315
- */
1316
- this.duration = 8000;
1317
- /**
1318
- * Default notifications is dismissible
1319
- * @default true
1320
- */
1321
- this.dismissible = true;
1322
- this.notificationCount = 0;
1323
- this.notifications = [];
1324
- this.subscription = this._notificationService.onNotification().subscribe(notification => {
1325
- if (!notification.duration) {
1326
- notification.duration = this.duration; // Add duration if not is set
1327
- }
1328
- if (!notification.position && this.position) {
1329
- notification.position = this.position; // Add position if not is set
1330
- }
1331
- if (notification.dismissible === undefined && isTrueBooleanInput(this.dismissible)) {
1332
- notification.dismissible = true; // Add dismissible if not is set
1333
- }
1334
- if (!notification.icon) {
1335
- notification.icon = this.getNotificationIcon(notification);
1336
- }
1337
- const newNotification = {
1338
- ...notification,
1339
- id: `${notification.type}-${this.notificationCount++}-notification`
1340
- };
1341
- this.notifications.push(newNotification);
1342
- this._changeDetectorRef.detectChanges();
1343
- setTimeout(() => {
1344
- // Show the notification
1345
- new Notification(document.getElementById(newNotification.id), {
1346
- timeout: notification.duration
1347
- }).show();
1348
- // Clear notification after the duration
1349
- setTimeout(() => {
1350
- const index = this.notifications.findIndex(n => n.id === newNotification.id);
1351
- if (index > -1) {
1352
- this.notifications.splice(index, 1);
1353
- if (!this.notifications.length) {
1354
- this.notificationCount = 0;
1355
- }
1356
- this._changeDetectorRef.detectChanges();
1357
- }
1358
- }, notification.duration);
1359
- }, 200);
1360
- });
1361
- }
1362
- ngOnDestroy() {
1363
- this.subscription.unsubscribe();
1364
- }
1365
- get NotificationType() {
1366
- return NotificationType;
1367
- }
1368
- /**
1369
- * Hide the notification
1370
- * @param id
1371
- */
1372
- hideNotification(id) {
1373
- Notification.getInstance(document.getElementById(id))?.hide();
1374
- }
1375
- /**
1376
- * Retrieve the icon name by notification type
1377
- * @param notification the notification
1378
- * @protected
1379
- */
1380
- getNotificationIcon(notification) {
1381
- switch (notification.type) {
1382
- case NotificationType.Success:
1383
- return 'check-circle';
1384
- case NotificationType.Error:
1385
- return 'close-circle';
1386
- case NotificationType.Warning:
1387
- return 'error';
1388
- case NotificationType.Info:
1389
- return 'info-circle';
1390
- case NotificationType.Standard:
1391
- default:
1392
- return undefined;
1393
- }
1394
- }
1395
- }
1396
- NotificationsComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: NotificationsComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: NotificationsService }], target: i0.ɵɵFactoryTarget.Component });
1397
- NotificationsComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.0.4", type: NotificationsComponent, selector: "it-notifications", inputs: { duration: "duration", position: "position", dismissible: "dismissible" }, ngImport: i0, template: "<div *ngFor=\"let notification of notifications\"\n [id]=\"notification.id\"\n class=\"notification {{notification.position}} {{notification.type}}\"\n [class.with-icon]=\"!!notification.icon\"\n [class.dismissable]=\"notification.dismissible\"\n role=\"alert\" [attr.aria-labelledby]=\"notification.id+'-title'\">\n\n <h2 [id]=\"notification.id+'-title'\" class=\"h5\">\n <it-icon *ngIf=\"!!notification.icon\" [name]=\"notification.icon\"></it-icon>\n <ng-container>{{notification.title}}</ng-container>\n </h2>\n <p *ngIf=\"notification.message\">{{notification.message}}</p>\n\n <button *ngIf=\"notification.dismissible\" type=\"button\" class=\"btn notification-close\"\n (click)=\"hideNotification(notification.id)\">\n <it-icon name=\"close\"></it-icon>\n <span class=\"visually-hidden\">{{'it.core.close-notification'|translate:{ title: notification.title } }}</span>\n </button>\n</div>\n", styles: [".notification{z-index:10000}\n"], dependencies: [{ kind: "directive", type: i1$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: IconComponent, selector: "it-icon[name]", inputs: ["name", "size", "color", "padded", "class"] }, { kind: "pipe", type: i1.TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
1398
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: NotificationsComponent, decorators: [{
1399
- type: Component,
1400
- args: [{ selector: 'it-notifications', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div *ngFor=\"let notification of notifications\"\n [id]=\"notification.id\"\n class=\"notification {{notification.position}} {{notification.type}}\"\n [class.with-icon]=\"!!notification.icon\"\n [class.dismissable]=\"notification.dismissible\"\n role=\"alert\" [attr.aria-labelledby]=\"notification.id+'-title'\">\n\n <h2 [id]=\"notification.id+'-title'\" class=\"h5\">\n <it-icon *ngIf=\"!!notification.icon\" [name]=\"notification.icon\"></it-icon>\n <ng-container>{{notification.title}}</ng-container>\n </h2>\n <p *ngIf=\"notification.message\">{{notification.message}}</p>\n\n <button *ngIf=\"notification.dismissible\" type=\"button\" class=\"btn notification-close\"\n (click)=\"hideNotification(notification.id)\">\n <it-icon name=\"close\"></it-icon>\n <span class=\"visually-hidden\">{{'it.core.close-notification'|translate:{ title: notification.title } }}</span>\n </button>\n</div>\n", styles: [".notification{z-index:10000}\n"] }]
1401
- }], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }, { type: NotificationsService }]; }, propDecorators: { duration: [{
1402
- type: Input
1403
- }], position: [{
1404
- type: Input
1405
- }], dismissible: [{
1406
- type: Input
1407
- }] } });
1408
-
1409
- class PaginationComponent {
1410
- constructor() {
1411
- /**
1412
- * Fired when page is changed
1413
- */
1414
- this.newPageEvent = new EventEmitter();
1415
- }
1416
- /**
1417
- * Create array to generate pagination of 5 element
1418
- */
1419
- get pages() {
1420
- const length = this.pageNumbers > 5 ? 5 : this.pageNumbers;
1421
- let start = (this.currentPage > 1 && this.pageNumbers > 5) ? this.currentPage - 1 : 1;
1422
- if (this.pageNumbers > 5) {
1423
- if ((this.currentPage + 1) >= this.pageNumbers) {
1424
- start -= 2;
1425
- }
1426
- else if (this.currentPage >= (this.pageNumbers - 2)) {
1427
- start -= (this.pageNumbers - (this.currentPage + 1));
1428
- }
1429
- }
1430
- return Array.from({ length }, (_, i) => i + start);
1431
- }
1432
- /**
1433
- * On click page change
1434
- * @param newPage the new page of table
1435
- */
1436
- pageChange(newPage) {
1437
- this.newPageEvent.emit(newPage - 1); // emit new page
1438
- }
1439
- }
1440
- PaginationComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: PaginationComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
1441
- PaginationComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.0.4", type: PaginationComponent, selector: "it-pagination[currentPage][pageNumbers]", inputs: { currentPage: "currentPage", pageNumbers: "pageNumbers", alignment: "alignment" }, outputs: { newPageEvent: "newPageEvent" }, ngImport: i0, template: "<nav class=\"pagination-wrapper\"\n [class.justify-content-center]=\"alignment==='center'\"\n [class.justify-content-end]=\"alignment==='end'\">\n <ul class=\"pagination\">\n <li class=\"page-item\" [class.disabled]=\"currentPage < 1\">\n <a class=\"page-link\" (click)=\"pageChange(currentPage)\">\n <it-icon name=\"chevron-left\" color=\"primary\"></it-icon>\n <span class=\"visually-hidden\">{{'it.core.previous-page'|translate}}</span>\n </a>\n </li>\n\n <ng-container *ngIf=\"pageNumbers > 5 && currentPage > 2\">\n <li class=\"page-item\"><a class=\"page-link\" (click)=\"pageChange(1)\">1</a></li>\n <li class=\"page-item\" *ngIf=\"currentPage > 3\">\n <span class=\"page-link\">...</span>\n </li>\n </ng-container>\n\n <li class=\"page-item\" *ngFor=\"let page of pages\">\n <a class=\"page-link\" aria-current=\"page\" *ngIf=\"page === (currentPage + 1); else inactivePage\">\n <span class=\"d-inline-block d-sm-none\">{{'it.core.page'|translate}}</span> {{page}}\n </a>\n <ng-template #inactivePage>\n <a class=\"page-link\" (click)=\"pageChange(page)\">{{page}}</a>\n </ng-template>\n </li>\n\n <ng-container *ngIf=\"pageNumbers > 5 && pageNumbers - currentPage > 3\">\n <li class=\"page-item\">\n <span class=\"page-link\">...</span>\n </li>\n <li class=\"page-item\"><a class=\"page-link\" (click)=\"pageChange(pageNumbers)\">{{pageNumbers}}</a></li>\n </ng-container>\n\n <li class=\"page-item\" [class.disabled]=\"currentPage >= pageNumbers - 1\">\n <a class=\"page-link\" (click)=\"pageChange(currentPage + 2)\">\n <span class=\"visually-hidden\">{{'it.core.next-page'|translate}}</span>\n <it-icon name=\"chevron-right\" color=\"primary\"></it-icon>\n </a>\n </li>\n </ul>\n</nav>\n", styles: [".page-item:not(.disabled)>a.page-link{cursor:pointer}\n"], dependencies: [{ kind: "directive", type: i1$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: IconComponent, selector: "it-icon[name]", inputs: ["name", "size", "color", "padded", "class"] }, { kind: "pipe", type: i1.TranslatePipe, name: "translate" }] });
1442
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: PaginationComponent, decorators: [{
1443
- type: Component,
1444
- args: [{ selector: 'it-pagination[currentPage][pageNumbers]', template: "<nav class=\"pagination-wrapper\"\n [class.justify-content-center]=\"alignment==='center'\"\n [class.justify-content-end]=\"alignment==='end'\">\n <ul class=\"pagination\">\n <li class=\"page-item\" [class.disabled]=\"currentPage < 1\">\n <a class=\"page-link\" (click)=\"pageChange(currentPage)\">\n <it-icon name=\"chevron-left\" color=\"primary\"></it-icon>\n <span class=\"visually-hidden\">{{'it.core.previous-page'|translate}}</span>\n </a>\n </li>\n\n <ng-container *ngIf=\"pageNumbers > 5 && currentPage > 2\">\n <li class=\"page-item\"><a class=\"page-link\" (click)=\"pageChange(1)\">1</a></li>\n <li class=\"page-item\" *ngIf=\"currentPage > 3\">\n <span class=\"page-link\">...</span>\n </li>\n </ng-container>\n\n <li class=\"page-item\" *ngFor=\"let page of pages\">\n <a class=\"page-link\" aria-current=\"page\" *ngIf=\"page === (currentPage + 1); else inactivePage\">\n <span class=\"d-inline-block d-sm-none\">{{'it.core.page'|translate}}</span> {{page}}\n </a>\n <ng-template #inactivePage>\n <a class=\"page-link\" (click)=\"pageChange(page)\">{{page}}</a>\n </ng-template>\n </li>\n\n <ng-container *ngIf=\"pageNumbers > 5 && pageNumbers - currentPage > 3\">\n <li class=\"page-item\">\n <span class=\"page-link\">...</span>\n </li>\n <li class=\"page-item\"><a class=\"page-link\" (click)=\"pageChange(pageNumbers)\">{{pageNumbers}}</a></li>\n </ng-container>\n\n <li class=\"page-item\" [class.disabled]=\"currentPage >= pageNumbers - 1\">\n <a class=\"page-link\" (click)=\"pageChange(currentPage + 2)\">\n <span class=\"visually-hidden\">{{'it.core.next-page'|translate}}</span>\n <it-icon name=\"chevron-right\" color=\"primary\"></it-icon>\n </a>\n </li>\n </ul>\n</nav>\n", styles: [".page-item:not(.disabled)>a.page-link{cursor:pointer}\n"] }]
1445
- }], propDecorators: { currentPage: [{
1446
- type: Input
1447
- }], pageNumbers: [{
1448
- type: Input
1449
- }], alignment: [{
1450
- type: Input
1451
- }], newPageEvent: [{
1452
- type: Output
1453
- }] } });
1454
-
1455
- class PopoverDirective {
1456
- constructor(_elementRef) {
1457
- this._elementRef = _elementRef;
1458
- /**
1459
- * This event fires immediately when the show method is called.
1460
- */
1461
- this.onShow = new EventEmitter();
1462
- /**
1463
- * This event is triggered when the tooltip has been made visible to the user (it will wait for the CSS transitions to complete).
1464
- */
1465
- this.onShown = new EventEmitter();
1466
- /**
1467
- * This event fires immediately when the hide method is called.
1468
- */
1469
- this.onHide = new EventEmitter();
1470
- /**
1471
- * This event is raised when the tooltip has finished being hidden from the user (it will wait for the CSS transitions to complete).
1472
- */
1473
- this.onHidden = new EventEmitter();
1474
- /**
1475
- * This event fires after the show event when the tooltip template has been added to the DOM.
1476
- */
1477
- this.onInserted = new EventEmitter();
1478
- this.element = this._elementRef.nativeElement;
1479
- }
1480
- /**
1481
- * Define the popover content
1482
- * @param content the popover content
1483
- */
1484
- set content(content) {
1485
- this.element.setAttribute('data-bs-content', content);
1486
- }
1487
- /**
1488
- * Define the popover title
1489
- * @param title the popover title
1490
- */
1491
- set title(title) {
1492
- if (title) {
1493
- this.element.setAttribute('title', title);
1494
- this.element.setAttribute('data-bs-original-title', title);
1495
- }
1496
- }
1497
- /**
1498
- * Define the popover placement
1499
- * @param placement
1500
- */
1501
- set placement(placement) {
1502
- this.element.setAttribute('data-bs-placement', placement);
1503
- }
1504
- /**
1505
- * Appends the popover to a specific element.
1506
- * @param container
1507
- */
1508
- set container(container) {
1509
- if (container) {
1510
- this.element.setAttribute('data-container', container);
1511
- }
1512
- }
1513
- /**
1514
- * Indicates whether the title contains html
1515
- * @param html true if contain html
1516
- */
1517
- set html(html) {
1518
- this.element.setAttribute('data-bs-html', isTrueBooleanInput(html) ? 'true' : 'false');
1519
- }
1520
- /**
1521
- * How popover is triggered
1522
- * - 'hover': To open the Popover on hover of the mouse over the element
1523
- * - 'focus': To ignore popovers on the user's next click of an element other than the toggle element.
1524
- * @param trigger
1525
- */
1526
- set hover(trigger) {
1527
- if (trigger) {
1528
- this.element.setAttribute('data-bs-trigger', trigger);
1529
- }
1530
- }
1531
- ngAfterViewInit() {
1532
- this.element.setAttribute('data-bs-toggle', 'popover');
1533
- this.popover = Popover.getOrCreateInstance(this.element);
1534
- this.element.addEventListener('show.bs.popover', event => this.onShow.emit(event));
1535
- this.element.addEventListener('shown.bs.popover', event => this.onShown.emit(event));
1536
- this.element.addEventListener('hide.bs.popover', event => this.onHide.emit(event));
1537
- this.element.addEventListener('hidden.bs.popover', event => this.onHidden.emit(event));
1538
- this.element.addEventListener('inserted.bs.popover', event => this.onInserted.emit(event));
1539
- }
1540
- ngOnDestroy() {
1541
- this.dispose();
1542
- }
1543
- /**
1544
- * Shows the popover of an item.
1545
- */
1546
- show() {
1547
- this.popover?.show();
1548
- }
1549
- /**
1550
- * Hide the popover of an element.
1551
- */
1552
- hide() {
1553
- this.popover?.hide();
1554
- }
1555
- /**
1556
- * Activate / Deactivate the popover of an element
1557
- */
1558
- toggle() {
1559
- this.popover?.toggle();
1560
- }
1561
- /**
1562
- * Hides and destroys the popover of an element.
1563
- */
1564
- dispose() {
1565
- this.popover?.dispose();
1566
- }
1567
- /**
1568
- * Gives the popover of an element a chance to be shown.
1569
- */
1570
- enable() {
1571
- this.popover?.enable();
1572
- }
1573
- /**
1574
- * Removes the ability to show the popover of an element.
1575
- */
1576
- disable() {
1577
- this.popover?.disable();
1578
- }
1579
- /**
1580
- * Toggles the possibility that the popover of an element is shown or hidden.
1581
- */
1582
- toggleEnabled() {
1583
- this.popover?.disable();
1584
- }
1585
- /**
1586
- * Updates the position of an element's popover.
1587
- */
1588
- update() {
1589
- this.popover?.disable();
1590
- }
1591
- }
1592
- PopoverDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: PopoverDirective, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Directive });
1593
- PopoverDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.0.4", type: PopoverDirective, selector: "[itPopover]", inputs: { content: ["itPopover", "content"], title: ["popoverTitle", "title"], placement: ["popoverPlacement", "placement"], container: ["popoverContainer", "container"], html: ["popoverHtml", "html"], hover: ["popoverTrigger", "hover"] }, outputs: { onShow: "onShow", onShown: "onShown", onHide: "onHide", onHidden: "onHidden", onInserted: "onInserted" }, exportAs: ["itPopover"], ngImport: i0 });
1594
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: PopoverDirective, decorators: [{
1595
- type: Directive,
1596
- args: [{
1597
- selector: '[itPopover]',
1598
- exportAs: 'itPopover'
1599
- }]
1600
- }], ctorParameters: function () { return [{ type: i0.ElementRef }]; }, propDecorators: { content: [{
1601
- type: Input,
1602
- args: ['itPopover']
1603
- }], title: [{
1604
- type: Input,
1605
- args: ['popoverTitle']
1606
- }], placement: [{
1607
- type: Input,
1608
- args: ['popoverPlacement']
1609
- }], container: [{
1610
- type: Input,
1611
- args: ['popoverContainer']
1612
- }], html: [{
1613
- type: Input,
1614
- args: ['popoverHtml']
1615
- }], hover: [{
1616
- type: Input,
1617
- args: ['popoverTrigger']
1618
- }], onShow: [{
1619
- type: Output
1620
- }], onShown: [{
1621
- type: Output
1622
- }], onHide: [{
1623
- type: Output
1624
- }], onHidden: [{
1625
- type: Output
1626
- }], onInserted: [{
1627
- type: Output
1628
- }] } });
1629
-
1630
- class SpinnerComponent {
1631
- constructor() {
1632
- /**
1633
- * The spinner is active
1634
- */
1635
- this.active = true;
1636
- }
1637
- get isActive() {
1638
- return isTrueBooleanInput(this.active);
1639
- }
1640
- get isSmall() {
1641
- return isTrueBooleanInput(this.small);
1642
- }
1643
- get isDouble() {
1644
- return isTrueBooleanInput(this.double);
1645
- }
1646
- }
1647
- SpinnerComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: SpinnerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
1648
- SpinnerComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.0.4", type: SpinnerComponent, selector: "it-spinner", inputs: { active: "active", small: "small", double: "double" }, ngImport: i0, template: "<div class=\"progress-spinner\"\n [class.progress-spinner-double]=\"isDouble\"\n [class.progress-spinner-active]=\"isActive\"\n [class.size-sm]=\"isSmall\">\n <div *ngIf=\"isDouble\" class=\"progress-spinner-inner\"></div>\n <div *ngIf=\"isDouble\" class=\"progress-spinner-inner\"></div>\n <span class=\"visually-hidden\">{{'it.core.loading'|translate}}...</span>\n</div>\n", styles: [""], dependencies: [{ kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "pipe", type: i1.TranslatePipe, name: "translate" }] });
1649
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: SpinnerComponent, decorators: [{
1650
- type: Component,
1651
- args: [{ selector: 'it-spinner', template: "<div class=\"progress-spinner\"\n [class.progress-spinner-double]=\"isDouble\"\n [class.progress-spinner-active]=\"isActive\"\n [class.size-sm]=\"isSmall\">\n <div *ngIf=\"isDouble\" class=\"progress-spinner-inner\"></div>\n <div *ngIf=\"isDouble\" class=\"progress-spinner-inner\"></div>\n <span class=\"visually-hidden\">{{'it.core.loading'|translate}}...</span>\n</div>\n" }]
1652
- }], propDecorators: { active: [{
1653
- type: Input
1654
- }], small: [{
1655
- type: Input
1656
- }], double: [{
1657
- type: Input
1658
- }] } });
1659
-
1660
- class SteppersItemComponent {
1661
- }
1662
- SteppersItemComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: SteppersItemComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
1663
- SteppersItemComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.0.4", type: SteppersItemComponent, selector: "it-steppers-item[label]", inputs: { label: "label", icon: "icon" }, viewQueries: [{ propertyName: "htmlContent", first: true, predicate: TemplateRef, descendants: true }], ngImport: i0, template: "<ng-template>\n <ng-content></ng-content>\n</ng-template>\n", changeDetection: i0.ChangeDetectionStrategy.OnPush });
1664
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: SteppersItemComponent, decorators: [{
1665
- type: Component,
1666
- args: [{ selector: 'it-steppers-item[label]', changeDetection: ChangeDetectionStrategy.OnPush, template: "<ng-template>\n <ng-content></ng-content>\n</ng-template>\n" }]
1667
- }], propDecorators: { label: [{
1668
- type: Input
1669
- }], icon: [{
1670
- type: Input
1671
- }], htmlContent: [{
1672
- type: ViewChild,
1673
- args: [TemplateRef]
1674
- }] } });
1675
-
1676
- class SteppersContainerComponent {
1677
- constructor(_changeDetectorRef) {
1678
- this._changeDetectorRef = _changeDetectorRef;
1679
- /**
1680
- * Show the stepper header
1681
- * @default true
1682
- */
1683
- this.showHeader = true;
1684
- /**
1685
- * Show the back button
1686
- * @default true
1687
- */
1688
- this.showBackButton = true;
1689
- /**
1690
- * Show the forward button
1691
- * @default true
1692
- */
1693
- this.showForwardButton = true;
1694
- /**
1695
- * Show the confirm button
1696
- * @default false
1697
- */
1698
- this.showConfirmButton = false;
1699
- /**
1700
- * Show the save button
1701
- * @default false
1702
- */
1703
- this.showSaveButton = false;
1704
- this.backClick = new EventEmitter();
1705
- this.forwardClick = new EventEmitter();
1706
- this.confirmClick = new EventEmitter();
1707
- this.saveClick = new EventEmitter();
1708
- }
1709
- get isShowHeader() {
1710
- return isTrueBooleanInput(this.showHeader);
1711
- }
1712
- get isSteppersNumber() {
1713
- return isTrueBooleanInput(this.steppersNumber);
1714
- }
1715
- get isDark() {
1716
- return isTrueBooleanInput(this.dark);
1717
- }
1718
- get isShowBackButton() {
1719
- return isTrueBooleanInput(this.showBackButton);
1720
- }
1721
- get isShowForwardButton() {
1722
- return isTrueBooleanInput(this.showForwardButton);
1723
- }
1724
- get isShowConfirmButton() {
1725
- return isTrueBooleanInput(this.showConfirmButton);
1726
- }
1727
- get isConfirmLoading() {
1728
- return isTrueBooleanInput(this.confirmLoading);
1729
- }
1730
- get isShowSaveButton() {
1731
- return isTrueBooleanInput(this.showSaveButton);
1732
- }
1733
- get isSaveLoading() {
1734
- return isTrueBooleanInput(this.saveLoading);
1735
- }
1736
- ngAfterViewInit() {
1737
- this._changeDetectorRef.detectChanges();
1738
- this.steps?.changes.subscribe(() => {
1739
- this._changeDetectorRef.detectChanges();
1740
- });
1741
- }
1742
- }
1743
- SteppersContainerComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: SteppersContainerComponent, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
1744
- SteppersContainerComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.0.4", type: SteppersContainerComponent, selector: "it-steppers-container[activeStep]", inputs: { activeStep: "activeStep", showHeader: "showHeader", dark: "dark", steppersNumber: "steppersNumber", progressStyle: "progressStyle", progressColor: "progressColor", showBackButton: "showBackButton", showForwardButton: "showForwardButton", showConfirmButton: "showConfirmButton", confirmLoading: "confirmLoading", showSaveButton: "showSaveButton", saveLoading: "saveLoading" }, outputs: { backClick: "backClick", forwardClick: "forwardClick", confirmClick: "confirmClick", saveClick: "saveClick" }, queries: [{ propertyName: "steps", predicate: SteppersItemComponent }], ngImport: i0, template: "<div class=\"steppers\" [class.bg-dark]=\"isDark\">\n <div *ngIf=\"isShowHeader\" class=\"steppers-header\">\n <ul>\n <li *ngFor=\"let step of steps; let i = index\"\n [class.confirmed]=\"i < activeStep\"\n [class.active]=\"i === activeStep\"\n [class.no-line]=\"i === activeStep && isSteppersNumber\">\n\n <it-icon *ngIf=\"step.icon && !isSteppersNumber\" [name]=\"step.icon\"></it-icon>\n <span *ngIf=\"isSteppersNumber\" class=\"steppers-number\">\n <ng-container *ngIf=\"i < activeStep; else showNumber\">\n <ng-container *ngTemplateOutlet=\"checkIcon\"></ng-container>\n </ng-container>\n <ng-template #showNumber>\n <span class=\"visually-hidden\">{{'it.core.step' | translate}} </span>{{i + 1}}\n </ng-template>\n </span>\n\n {{step.label}}\n\n <span *ngIf=\"i < activeStep && !isSteppersNumber\" class=\"ms-auto\">\n <ng-container *ngTemplateOutlet=\"checkIcon\"></ng-container>\n </span>\n <span *ngIf=\"i === activeStep\" class=\"visually-hidden\">{{'it.core.active' | translate}}</span>\n </li>\n </ul>\n <span class=\"steppers-index\" aria-hidden=\"true\">\n <ng-container\n *ngIf=\"!isSteppersNumber; else showNumbers\">{{(activeStep + 1) + '/' + steps?.length}}</ng-container>\n <ng-template #showNumbers>\n <span *ngFor=\"let step of steps; let i = index\" [class.active]=\"i === activeStep\">{{i + 1}}</span>\n </ng-template>\n </span>\n </div>\n\n <div *ngIf=\"steps?.get(activeStep) as step\" class=\"steppers-content\" aria-live=\"polite\">\n <ng-container *ngTemplateOutlet=\"step.htmlContent\"></ng-container>\n </div>\n\n <nav *ngIf=\"isShowBackButton || isShowSaveButton || isShowForwardButton || isShowConfirmButton || !!progressStyle\"\n class=\"steppers-nav\">\n <button *ngIf=\"isShowBackButton\" type=\"button\" itButton=\"outline-primary\" size=\"sm\" class=\"steppers-btn-prev\"\n (click)=\"backClick.emit(activeStep)\">\n <it-icon name=\"chevron-left\" color=\"primary\"></it-icon>\n {{'it.core.back' | translate}}\n </button>\n\n <ng-container *ngIf=\"!!progressStyle\">\n <ul *ngIf=\"progressStyle === 'dots'; else progressBar\" class=\"steppers-dots\">\n <li *ngFor=\"let step of steps; let i = index\" [class.done]=\"i < activeStep\">\n <span class=\"visually-hidden\">\n {{'it.core.step-of' | translate: { current: activeStep + 1, available: steps?.length } }}\n {{i < activeStep ? ('- ' + ('it.core.confirmed' | translate)) : ''}}\n </span>\n </li>\n </ul>\n\n <ng-template #progressBar>\n <div class=\"steppers-progress\">\n <it-progress-bar [color]=\"progressColor\" [value]=\"(activeStep/(steps?.length||1)) * 100\"></it-progress-bar>\n </div>\n </ng-template>\n </ng-container>\n\n <button *ngIf=\"isShowSaveButton\" type=\"button\" itButton=\"primary\" size=\"sm\" class=\"steppers-btn-save\"\n [progress]=\"isSaveLoading\" [disabled]=\"isSaveLoading\" (click)=\"saveClick.emit(activeStep)\">\n {{'it.general.save' | translate}}\n </button>\n\n <button *ngIf=\"isShowForwardButton\" type=\"button\" itButton=\"outline-primary\" size=\"sm\" class=\"steppers-btn-next\"\n (click)=\"forwardClick.emit(activeStep)\">\n {{'it.core.forward' | translate}}\n <it-icon name=\"chevron-right\" color=\"primary\"></it-icon>\n </button>\n\n <button *ngIf=\"isShowConfirmButton\" type=\"button\" itButton=\"primary\" size=\"sm\"\n class=\"steppers-btn-confirm d-lg-block\"\n [progress]=\"isConfirmLoading\" [disabled]=\"isConfirmLoading\"\n (click)=\"confirmClick.emit(activeStep)\">\n {{'it.core.confirm' | translate}}\n </button>\n </nav>\n</div>\n\n<ng-template #checkIcon>\n <it-icon name=\"check\" class=\"steppers-success\"></it-icon>\n <span class=\"visually-hidden\">{{'it.core.confirmed' | translate}}</span>\n</ng-template>\n", dependencies: [{ kind: "directive", type: i1$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: ButtonDirective, selector: "[itButton]", inputs: ["itButton", "size", "block", "disabled"], exportAs: ["itButton"] }, { kind: "component", type: ProgressBarComponent, selector: "it-progress-bar[value]", inputs: ["value", "showLabel", "indeterminate", "color"] }, { kind: "component", type: ProgressButtonComponent, selector: "button[itButton][progress]", inputs: ["progress", "progressColor"] }, { kind: "component", type: IconComponent, selector: "it-icon[name]", inputs: ["name", "size", "color", "padded", "class"] }, { kind: "pipe", type: i1.TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
1745
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: SteppersContainerComponent, decorators: [{
1746
- type: Component,
1747
- args: [{ selector: 'it-steppers-container[activeStep]', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"steppers\" [class.bg-dark]=\"isDark\">\n <div *ngIf=\"isShowHeader\" class=\"steppers-header\">\n <ul>\n <li *ngFor=\"let step of steps; let i = index\"\n [class.confirmed]=\"i < activeStep\"\n [class.active]=\"i === activeStep\"\n [class.no-line]=\"i === activeStep && isSteppersNumber\">\n\n <it-icon *ngIf=\"step.icon && !isSteppersNumber\" [name]=\"step.icon\"></it-icon>\n <span *ngIf=\"isSteppersNumber\" class=\"steppers-number\">\n <ng-container *ngIf=\"i < activeStep; else showNumber\">\n <ng-container *ngTemplateOutlet=\"checkIcon\"></ng-container>\n </ng-container>\n <ng-template #showNumber>\n <span class=\"visually-hidden\">{{'it.core.step' | translate}} </span>{{i + 1}}\n </ng-template>\n </span>\n\n {{step.label}}\n\n <span *ngIf=\"i < activeStep && !isSteppersNumber\" class=\"ms-auto\">\n <ng-container *ngTemplateOutlet=\"checkIcon\"></ng-container>\n </span>\n <span *ngIf=\"i === activeStep\" class=\"visually-hidden\">{{'it.core.active' | translate}}</span>\n </li>\n </ul>\n <span class=\"steppers-index\" aria-hidden=\"true\">\n <ng-container\n *ngIf=\"!isSteppersNumber; else showNumbers\">{{(activeStep + 1) + '/' + steps?.length}}</ng-container>\n <ng-template #showNumbers>\n <span *ngFor=\"let step of steps; let i = index\" [class.active]=\"i === activeStep\">{{i + 1}}</span>\n </ng-template>\n </span>\n </div>\n\n <div *ngIf=\"steps?.get(activeStep) as step\" class=\"steppers-content\" aria-live=\"polite\">\n <ng-container *ngTemplateOutlet=\"step.htmlContent\"></ng-container>\n </div>\n\n <nav *ngIf=\"isShowBackButton || isShowSaveButton || isShowForwardButton || isShowConfirmButton || !!progressStyle\"\n class=\"steppers-nav\">\n <button *ngIf=\"isShowBackButton\" type=\"button\" itButton=\"outline-primary\" size=\"sm\" class=\"steppers-btn-prev\"\n (click)=\"backClick.emit(activeStep)\">\n <it-icon name=\"chevron-left\" color=\"primary\"></it-icon>\n {{'it.core.back' | translate}}\n </button>\n\n <ng-container *ngIf=\"!!progressStyle\">\n <ul *ngIf=\"progressStyle === 'dots'; else progressBar\" class=\"steppers-dots\">\n <li *ngFor=\"let step of steps; let i = index\" [class.done]=\"i < activeStep\">\n <span class=\"visually-hidden\">\n {{'it.core.step-of' | translate: { current: activeStep + 1, available: steps?.length } }}\n {{i < activeStep ? ('- ' + ('it.core.confirmed' | translate)) : ''}}\n </span>\n </li>\n </ul>\n\n <ng-template #progressBar>\n <div class=\"steppers-progress\">\n <it-progress-bar [color]=\"progressColor\" [value]=\"(activeStep/(steps?.length||1)) * 100\"></it-progress-bar>\n </div>\n </ng-template>\n </ng-container>\n\n <button *ngIf=\"isShowSaveButton\" type=\"button\" itButton=\"primary\" size=\"sm\" class=\"steppers-btn-save\"\n [progress]=\"isSaveLoading\" [disabled]=\"isSaveLoading\" (click)=\"saveClick.emit(activeStep)\">\n {{'it.general.save' | translate}}\n </button>\n\n <button *ngIf=\"isShowForwardButton\" type=\"button\" itButton=\"outline-primary\" size=\"sm\" class=\"steppers-btn-next\"\n (click)=\"forwardClick.emit(activeStep)\">\n {{'it.core.forward' | translate}}\n <it-icon name=\"chevron-right\" color=\"primary\"></it-icon>\n </button>\n\n <button *ngIf=\"isShowConfirmButton\" type=\"button\" itButton=\"primary\" size=\"sm\"\n class=\"steppers-btn-confirm d-lg-block\"\n [progress]=\"isConfirmLoading\" [disabled]=\"isConfirmLoading\"\n (click)=\"confirmClick.emit(activeStep)\">\n {{'it.core.confirm' | translate}}\n </button>\n </nav>\n</div>\n\n<ng-template #checkIcon>\n <it-icon name=\"check\" class=\"steppers-success\"></it-icon>\n <span class=\"visually-hidden\">{{'it.core.confirmed' | translate}}</span>\n</ng-template>\n" }]
1748
- }], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }]; }, propDecorators: { activeStep: [{
1749
- type: Input
1750
- }], showHeader: [{
1751
- type: Input
1752
- }], dark: [{
1753
- type: Input
1754
- }], steppersNumber: [{
1755
- type: Input
1756
- }], progressStyle: [{
1757
- type: Input
1758
- }], progressColor: [{
1759
- type: Input
1760
- }], showBackButton: [{
1761
- type: Input
1762
- }], showForwardButton: [{
1763
- type: Input
1764
- }], showConfirmButton: [{
1765
- type: Input
1766
- }], confirmLoading: [{
1767
- type: Input
1768
- }], showSaveButton: [{
1769
- type: Input
1770
- }], saveLoading: [{
1771
- type: Input
1772
- }], steps: [{
1773
- type: ContentChildren,
1774
- args: [SteppersItemComponent]
1775
- }], backClick: [{
1776
- type: Output
1777
- }], forwardClick: [{
1778
- type: Output
1779
- }], confirmClick: [{
1780
- type: Output
1781
- }], saveClick: [{
1782
- type: Output
1783
- }] } });
1784
-
1785
- class TabItemComponent extends AbstractComponent {
1786
- constructor() {
1787
- super(...arguments);
1788
- /**
1789
- * Custom class
1790
- */
1791
- this.class = '';
1792
- }
1793
- ngAfterViewInit() {
1794
- super.ngAfterViewInit();
1795
- this._renderer.removeAttribute(this._elementRef.nativeElement, 'class');
1796
- }
1797
- }
1798
- TabItemComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: TabItemComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
1799
- TabItemComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.0.4", type: TabItemComponent, selector: "it-tab-item[id]", inputs: { label: "label", icon: "icon", active: "active", disabled: "disabled", class: "class" }, viewQueries: [{ propertyName: "htmlContent", first: true, predicate: TemplateRef, descendants: true }], usesInheritance: true, ngImport: i0, template: "<ng-template>\n <ng-content></ng-content>\n</ng-template>\n", changeDetection: i0.ChangeDetectionStrategy.OnPush });
1800
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: TabItemComponent, decorators: [{
1801
- type: Component,
1802
- args: [{ selector: 'it-tab-item[id]', changeDetection: ChangeDetectionStrategy.OnPush, template: "<ng-template>\n <ng-content></ng-content>\n</ng-template>\n" }]
1803
- }], propDecorators: { label: [{
1804
- type: Input
1805
- }], icon: [{
1806
- type: Input
1807
- }], active: [{
1808
- type: Input
1809
- }], disabled: [{
1810
- type: Input
1811
- }], class: [{
1812
- type: Input
1813
- }], htmlContent: [{
1814
- type: ViewChild,
1815
- args: [TemplateRef]
1816
- }] } });
1817
-
1818
- class TabContainerComponent extends AbstractComponent {
1819
- isTrueBooleanInput(booleanInput) {
1820
- return isTrueBooleanInput(booleanInput);
1821
- }
1822
- ngAfterViewInit() {
1823
- super.ngAfterViewInit();
1824
- this.tabs?.changes.pipe(// When tabs changes (dynamic add/remove)
1825
- startWith(undefined), tap(() => {
1826
- this.tabSubscriptions?.forEach(sub => sub.unsubscribe()); // Remove old subscriptions
1827
- this.tabSubscriptions = this.tabs?.map(tab => tab.valueChanges.subscribe(() => {
1828
- this._changeDetectorRef.detectChanges(); // DetectChanges when tab-item attributes changes
1829
- }));
1830
- this._changeDetectorRef.detectChanges(); // Force update html render
1831
- }), switchMap(() => this.tabNavLinks?.changes.pipe(startWith(undefined)) || of(undefined))).subscribe(() => {
1832
- // Init tabs from bootstrap-italia
1833
- this.tabNavLinks?.forEach(tabNavLink => {
1834
- const triggerEl = tabNavLink.nativeElement, tabTrigger = Tab.getOrCreateInstance(triggerEl);
1835
- if (triggerEl.getAttribute('tab-listener') !== 'true') {
1836
- triggerEl.addEventListener('click', event => {
1837
- event.preventDefault();
1838
- tabTrigger.show();
1839
- });
1840
- triggerEl.setAttribute('tab-listener', 'true'); // Prevents multiple insertion of the listener
1841
- }
1842
- });
1843
- });
1844
- }
1845
- ngOnDestroy() {
1846
- this.tabSubscriptions?.forEach(sub => sub.unsubscribe());
1847
- }
1848
- }
1849
- TabContainerComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: TabContainerComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
1850
- TabContainerComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.0.4", type: TabContainerComponent, selector: "it-tab-container", inputs: { auto: "auto", iconText: "iconText", dark: "dark" }, queries: [{ propertyName: "tabs", predicate: TabItemComponent }], viewQueries: [{ propertyName: "tabNavLinks", predicate: ["tabNavLinks"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<ul class=\"nav nav-tabs\"\n [class.auto]=\"isTrueBooleanInput(auto)\"\n [class.nav-tabs-icon-text]=\"isTrueBooleanInput(iconText)\"\n [class.nav-dark]=\"isTrueBooleanInput(dark)\"\n role=\"tablist\">\n\n <li class=\"nav-item\" *ngFor=\"let tab of tabs\">\n <a #tabNavLinks [id]=\"tab.id+'-tab-link'\"\n role=\"tab\"\n class=\"nav-link\"\n [class.active]=\"isTrueBooleanInput(tab.active)\"\n [class.disabled]=\"isTrueBooleanInput(tab.disabled)\"\n [attr.href]=\"'#'+tab.id+'-tab'\"\n [attr.aria-controls]=\"tab.id+'-tab'\">\n <it-icon *ngIf=\"tab.icon\" [name]=\"tab.icon\" class=\"me-2\"></it-icon>\n {{tab.label}}\n </a>\n </li>\n</ul>\n\n<div class=\"tab-content\">\n <div *ngFor=\"let tab of tabs\"\n [id]=\"tab.id+'-tab'\"\n class=\"tab-pane p-4 fade {{tab.class ?? ''}}\"\n [class.active]=\"isTrueBooleanInput(tab.active)\"\n [class.show]=\"isTrueBooleanInput(tab.active)\"\n role=\"tabpanel\"\n [attr.aria-labelledby]=\"tab.id+'-tab-link'\">\n <ng-container *ngTemplateOutlet=\"tab.htmlContent\"></ng-container>\n </div>\n</div>\n", dependencies: [{ kind: "directive", type: i1$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: IconComponent, selector: "it-icon[name]", inputs: ["name", "size", "color", "padded", "class"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
1851
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: TabContainerComponent, decorators: [{
1852
- type: Component,
1853
- args: [{ selector: 'it-tab-container', changeDetection: ChangeDetectionStrategy.OnPush, template: "<ul class=\"nav nav-tabs\"\n [class.auto]=\"isTrueBooleanInput(auto)\"\n [class.nav-tabs-icon-text]=\"isTrueBooleanInput(iconText)\"\n [class.nav-dark]=\"isTrueBooleanInput(dark)\"\n role=\"tablist\">\n\n <li class=\"nav-item\" *ngFor=\"let tab of tabs\">\n <a #tabNavLinks [id]=\"tab.id+'-tab-link'\"\n role=\"tab\"\n class=\"nav-link\"\n [class.active]=\"isTrueBooleanInput(tab.active)\"\n [class.disabled]=\"isTrueBooleanInput(tab.disabled)\"\n [attr.href]=\"'#'+tab.id+'-tab'\"\n [attr.aria-controls]=\"tab.id+'-tab'\">\n <it-icon *ngIf=\"tab.icon\" [name]=\"tab.icon\" class=\"me-2\"></it-icon>\n {{tab.label}}\n </a>\n </li>\n</ul>\n\n<div class=\"tab-content\">\n <div *ngFor=\"let tab of tabs\"\n [id]=\"tab.id+'-tab'\"\n class=\"tab-pane p-4 fade {{tab.class ?? ''}}\"\n [class.active]=\"isTrueBooleanInput(tab.active)\"\n [class.show]=\"isTrueBooleanInput(tab.active)\"\n role=\"tabpanel\"\n [attr.aria-labelledby]=\"tab.id+'-tab-link'\">\n <ng-container *ngTemplateOutlet=\"tab.htmlContent\"></ng-container>\n </div>\n</div>\n" }]
1854
- }], propDecorators: { auto: [{
1855
- type: Input
1856
- }], iconText: [{
1857
- type: Input
1858
- }], dark: [{
1859
- type: Input
1860
- }], tabs: [{
1861
- type: ContentChildren,
1862
- args: [TabItemComponent]
1863
- }], tabNavLinks: [{
1864
- type: ViewChildren,
1865
- args: ['tabNavLinks']
1866
- }] } });
1867
-
1868
- class TableComponent {
1869
- constructor() {
1870
- /**
1871
- * Responsive tables allow you to scroll tables horizontally with ease.
1872
- * @default responsive
1873
- */
1874
- this.responsive = 'responsive';
1875
- }
1876
- get isStriped() {
1877
- return isTrueBooleanInput(this.striped);
1878
- }
1879
- get isHover() {
1880
- return isTrueBooleanInput(this.hover);
1881
- }
1882
- get isBordered() {
1883
- return isTrueBooleanInput(this.bordered);
1884
- }
1885
- get isBorderless() {
1886
- return isTrueBooleanInput(this.borderless);
1887
- }
1888
- get isCompact() {
1889
- return isTrueBooleanInput(this.compact);
1890
- }
1891
- get isCaptionTop() {
1892
- return isTrueBooleanInput(this.captionTop);
1893
- }
1894
- }
1895
- TableComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: TableComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
1896
- TableComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.0.4", type: TableComponent, selector: "it-table", inputs: { color: "color", headColor: "headColor", alignment: "alignment", striped: "striped", hover: "hover", bordered: "bordered", borderless: "borderless", compact: "compact", captionTop: "captionTop", responsive: "responsive" }, ngImport: i0, template: "<div [class]=\"responsive ? 'table-' + responsive : undefined\">\n <table class=\"table{{color ? ' table-' + color : '' }}\"\n [class.table-striped]=\"isStriped\"\n [class.table-hover]=\"isHover\"\n [class.table-bordered]=\"isBordered\"\n [class.table-borderless]=\"isBorderless\"\n [class.table-sm]=\"isCompact\"\n [class.caption-top]=\"isCaptionTop\">\n <caption>\n <ng-content select=\"[caption]\"></ng-content>\n </caption>\n <thead [class]=\"headColor ? 'table-' + headColor : undefined\">\n <ng-content select=\"[thead]\"></ng-content>\n </thead>\n <tbody>\n <ng-content select=\"[tbody]\"></ng-content>\n </tbody>\n <tfoot>\n <ng-content select=\"[tfoot]\"></ng-content>\n </tfoot>\n </table>\n</div>\n", styles: ["caption:empty{display:none}caption:empty~thead{border-top:none!important}\n"] });
1897
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: TableComponent, decorators: [{
1898
- type: Component,
1899
- args: [{ selector: 'it-table', template: "<div [class]=\"responsive ? 'table-' + responsive : undefined\">\n <table class=\"table{{color ? ' table-' + color : '' }}\"\n [class.table-striped]=\"isStriped\"\n [class.table-hover]=\"isHover\"\n [class.table-bordered]=\"isBordered\"\n [class.table-borderless]=\"isBorderless\"\n [class.table-sm]=\"isCompact\"\n [class.caption-top]=\"isCaptionTop\">\n <caption>\n <ng-content select=\"[caption]\"></ng-content>\n </caption>\n <thead [class]=\"headColor ? 'table-' + headColor : undefined\">\n <ng-content select=\"[thead]\"></ng-content>\n </thead>\n <tbody>\n <ng-content select=\"[tbody]\"></ng-content>\n </tbody>\n <tfoot>\n <ng-content select=\"[tfoot]\"></ng-content>\n </tfoot>\n </table>\n</div>\n", styles: ["caption:empty{display:none}caption:empty~thead{border-top:none!important}\n"] }]
1900
- }], propDecorators: { color: [{
1901
- type: Input
1902
- }], headColor: [{
1903
- type: Input
1904
- }], alignment: [{
1905
- type: Input
1906
- }], striped: [{
1907
- type: Input
1908
- }], hover: [{
1909
- type: Input
1910
- }], bordered: [{
1911
- type: Input
1912
- }], borderless: [{
1913
- type: Input
1914
- }], compact: [{
1915
- type: Input
1916
- }], captionTop: [{
1917
- type: Input
1918
- }], responsive: [{
1919
- type: Input
1920
- }] } });
1921
-
1922
- class TooltipDirective {
1923
- constructor(_elementRef) {
1924
- this._elementRef = _elementRef;
1925
- /**
1926
- * This event fires immediately when the show method is called.
1927
- */
1928
- this.onShow = new EventEmitter();
1929
- /**
1930
- * This event is triggered when the tooltip has been made visible to the user (it will wait for the CSS transitions to complete).
1931
- */
1932
- this.onShown = new EventEmitter();
1933
- /**
1934
- * This event fires immediately when the hide method is called.
1935
- */
1936
- this.onHide = new EventEmitter();
1937
- /**
1938
- * This event is raised when the tooltip has finished being hidden from the user (it will wait for the CSS transitions to complete).
1939
- */
1940
- this.onHidden = new EventEmitter();
1941
- /**
1942
- * This event fires after the show event when the tooltip template has been added to the DOM.
1943
- */
1944
- this.onInserted = new EventEmitter();
1945
- this.element = this._elementRef.nativeElement;
1946
- }
1947
- /**
1948
- * Define the tooltip title
1949
- * @param title the tooltip title
1950
- */
1951
- set title(title) {
1952
- if (title) {
1953
- // this.element.setAttribute("title", title);
1954
- this.element.setAttribute('data-bs-original-title', title);
1955
- }
1956
- }
1957
- /**
1958
- * Define the tooltip placement
1959
- * @param placement
1960
- */
1961
- set placement(placement) {
1962
- this.element.setAttribute('data-bs-placement', placement);
1963
- }
1964
- /**
1965
- * Indicates whether the title contains html
1966
- * @param html true if contain html
1967
- */
1968
- set html(html) {
1969
- this.element.setAttribute('data-bs-html', isTrueBooleanInput(html) ? 'true' : 'false');
1970
- }
1971
- ngAfterViewInit() {
1972
- this.element.setAttribute('data-bs-toggle', 'tooltip');
1973
- this.tooltip = Tooltip.getOrCreateInstance(this.element);
1974
- this.element.addEventListener('show.bs.tooltip', event => this.onShow.emit(event));
1975
- this.element.addEventListener('shown.bs.tooltip', event => this.onShown.emit(event));
1976
- this.element.addEventListener('hide.bs.tooltip', event => this.onHide.emit(event));
1977
- this.element.addEventListener('hidden.bs.tooltip', event => this.onHidden.emit(event));
1978
- this.element.addEventListener('inserted.bs.tooltip', event => this.onInserted.emit(event));
1979
- }
1980
- ngOnDestroy() {
1981
- this.dispose();
1982
- }
1983
- /**
1984
- * Shows the tooltip of an item.
1985
- */
1986
- show() {
1987
- this.tooltip?.show();
1988
- }
1989
- /**
1990
- * Hide the tooltip of an element.
1991
- */
1992
- hide() {
1993
- this.tooltip?.hide();
1994
- }
1995
- /**
1996
- * Activate / Deactivate the tooltip of an element
1997
- */
1998
- toggle() {
1999
- this.tooltip?.toggle();
2000
- }
2001
- /**
2002
- * Hides and destroys the tooltip of an element.
2003
- */
2004
- dispose() {
2005
- this.tooltip?.dispose();
2006
- }
2007
- /**
2008
- * Gives the tooltip of an element a chance to be shown.
2009
- */
2010
- enable() {
2011
- this.tooltip?.enable();
2012
- }
2013
- /**
2014
- * Removes the ability to show the tooltip of an element.
2015
- */
2016
- disable() {
2017
- this.tooltip?.disable();
2018
- }
2019
- /**
2020
- * Toggles the possibility that the tooltip of an element is shown or hidden.
2021
- */
2022
- toggleEnabled() {
2023
- this.tooltip?.disable();
2024
- }
2025
- /**
2026
- * Updates the position of an element's tooltip.
2027
- */
2028
- update() {
2029
- this.tooltip?.disable();
2030
- }
2031
- }
2032
- TooltipDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: TooltipDirective, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Directive });
2033
- TooltipDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.0.4", type: TooltipDirective, selector: "[itTooltip]", inputs: { title: ["itTooltip", "title"], placement: ["tooltipPlacement", "placement"], html: ["tooltipHtml", "html"] }, outputs: { onShow: "onShow", onShown: "onShown", onHide: "onHide", onHidden: "onHidden", onInserted: "onInserted" }, exportAs: ["itTooltip"], ngImport: i0 });
2034
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: TooltipDirective, decorators: [{
2035
- type: Directive,
2036
- args: [{
2037
- selector: '[itTooltip]',
2038
- exportAs: 'itTooltip'
2039
- }]
2040
- }], ctorParameters: function () { return [{ type: i0.ElementRef }]; }, propDecorators: { title: [{
2041
- type: Input,
2042
- args: ['itTooltip']
2043
- }], placement: [{
2044
- type: Input,
2045
- args: ['tooltipPlacement']
2046
- }], html: [{
2047
- type: Input,
2048
- args: ['tooltipHtml']
2049
- }], onShow: [{
2050
- type: Output
2051
- }], onShown: [{
2052
- type: Output
2053
- }], onHide: [{
2054
- type: Output
2055
- }], onHidden: [{
2056
- type: Output
2057
- }], onInserted: [{
2058
- type: Output
2059
- }] } });
2060
-
2061
- class CheckboxComponent extends AbstractFormComponent {
2062
- get isIndeterminate() {
2063
- return isTrueBooleanInput(this.indeterminate);
2064
- }
2065
- get isGroup() {
2066
- return isTrueBooleanInput(this.group);
2067
- }
2068
- ngOnInit() {
2069
- super.ngOnInit();
2070
- if (this.control.value || this.checked === undefined) {
2071
- return;
2072
- }
2073
- const value = isTrueBooleanInput(this.checked);
2074
- this.writeValue(value);
2075
- return this.onChange(value);
2076
- }
2077
- }
2078
- CheckboxComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: CheckboxComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
2079
- CheckboxComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.0.4", type: CheckboxComponent, selector: "it-checkbox[id]", inputs: { toggle: "toggle", inline: "inline", group: "group", checked: "checked", indeterminate: "indeterminate" }, usesInheritance: true, ngImport: i0, template: "<ng-container>\n <div class=\"form-check\"\n [class.form-check-group]=\"isGroup\"\n [class.form-check-inline]=\"inline\">\n\n <div *ngIf=\"toggle; else defaultStyle\" class=\"toggles\">\n <label [for]=\"id\">\n <ng-container *ngTemplateOutlet=\"htmlLabel\"></ng-container>\n <input [id]=\"id\"\n type=\"checkbox\"\n [formControl]=\"control\"\n [attr.aria-describedby]=\"id + '-help'\">\n <span class=\"lever\"></span>\n </label>\n </div>\n\n <ng-template #defaultStyle>\n <input [id]=\"id\"\n type=\"checkbox\"\n class=\"form-check-input\"\n [class.is-invalid]=\"isInvalid\"\n [class.is-valid]=\"isValid\"\n [class.semi-checked]=\"isIndeterminate\"\n [formControl]=\"control\"\n [attr.aria-describedby]=\"id + '-help'\">\n <label class=\"form-check-label\" [for]=\"id\">\n <ng-container *ngTemplateOutlet=\"htmlLabel\"></ng-container>\n </label>\n </ng-template>\n\n <small *ngIf=\"isGroup\" [id]=\"id + '-help'\" class=\"form-text\">\n <ng-content></ng-content>\n </small>\n\n <div *ngIf=\"isInvalid && isGroup\" class=\"form-feedback just-validate-error-label\" [id]=\"id + '-error'\">\n <ng-container *ngTemplateOutlet=\"error\"></ng-container>\n </div>\n </div>\n\n <div *ngIf=\"isInvalid && !isGroup\" class=\"form-feedback just-validate-error-label\" [id]=\"id + '-error'\">\n <ng-container *ngTemplateOutlet=\"error\"></ng-container>\n </div>\n</ng-container>\n\n<ng-template #error>\n <div #customError>\n <ng-content select=\"[error]\"></ng-content>\n </div>\n <ng-container *ngIf=\"!customError.hasChildNodes()\">{{invalidMessage | async}}</ng-container>\n</ng-template>\n\n<ng-template #htmlLabel>\n <div #customLabel>\n <ng-content select=\"[label]\"></ng-content>\n </div>\n <ng-container *ngIf=\"!customLabel.hasChildNodes()\">{{label}}</ng-container>\n</ng-template>\n", dependencies: [{ kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i2.CheckboxControlValueAccessor, selector: "input[type=checkbox][formControlName],input[type=checkbox][formControl],input[type=checkbox][ngModel]" }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "pipe", type: i1$1.AsyncPipe, name: "async" }] });
2080
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: CheckboxComponent, decorators: [{
2081
- type: Component,
2082
- args: [{ selector: 'it-checkbox[id]', template: "<ng-container>\n <div class=\"form-check\"\n [class.form-check-group]=\"isGroup\"\n [class.form-check-inline]=\"inline\">\n\n <div *ngIf=\"toggle; else defaultStyle\" class=\"toggles\">\n <label [for]=\"id\">\n <ng-container *ngTemplateOutlet=\"htmlLabel\"></ng-container>\n <input [id]=\"id\"\n type=\"checkbox\"\n [formControl]=\"control\"\n [attr.aria-describedby]=\"id + '-help'\">\n <span class=\"lever\"></span>\n </label>\n </div>\n\n <ng-template #defaultStyle>\n <input [id]=\"id\"\n type=\"checkbox\"\n class=\"form-check-input\"\n [class.is-invalid]=\"isInvalid\"\n [class.is-valid]=\"isValid\"\n [class.semi-checked]=\"isIndeterminate\"\n [formControl]=\"control\"\n [attr.aria-describedby]=\"id + '-help'\">\n <label class=\"form-check-label\" [for]=\"id\">\n <ng-container *ngTemplateOutlet=\"htmlLabel\"></ng-container>\n </label>\n </ng-template>\n\n <small *ngIf=\"isGroup\" [id]=\"id + '-help'\" class=\"form-text\">\n <ng-content></ng-content>\n </small>\n\n <div *ngIf=\"isInvalid && isGroup\" class=\"form-feedback just-validate-error-label\" [id]=\"id + '-error'\">\n <ng-container *ngTemplateOutlet=\"error\"></ng-container>\n </div>\n </div>\n\n <div *ngIf=\"isInvalid && !isGroup\" class=\"form-feedback just-validate-error-label\" [id]=\"id + '-error'\">\n <ng-container *ngTemplateOutlet=\"error\"></ng-container>\n </div>\n</ng-container>\n\n<ng-template #error>\n <div #customError>\n <ng-content select=\"[error]\"></ng-content>\n </div>\n <ng-container *ngIf=\"!customError.hasChildNodes()\">{{invalidMessage | async}}</ng-container>\n</ng-template>\n\n<ng-template #htmlLabel>\n <div #customLabel>\n <ng-content select=\"[label]\"></ng-content>\n </div>\n <ng-container *ngIf=\"!customLabel.hasChildNodes()\">{{label}}</ng-container>\n</ng-template>\n" }]
2083
- }], propDecorators: { toggle: [{
2084
- type: Input
2085
- }], inline: [{
2086
- type: Input
2087
- }], group: [{
2088
- type: Input
2089
- }], checked: [{
2090
- type: Input
2091
- }], indeterminate: [{
2092
- type: Input
2093
- }] } });
2094
-
2095
- /**
2096
- * General Email Regex (RFC 5322 Official Standard)
2097
- * http://emailregex.com/
2098
- */
2099
- const EMAIL_REGEX = /(?:[a-z0-9!#$%&'*+/=?^_`{|}~-]+(?:\.[a-z0-9!#$%&'*+/=?^_`{|}~-]+)*|"(?:[\x01-\x08\x0b\x0c\x0e-\x1f\x21\x23-\x5b\x5d-\x7f]|\\[\x01-\x09\x0b\x0c\x0e-\x7f])*")@(?:(?:[a-z0-9](?:[a-z0-9-]*[a-z0-9])?\.)+[a-z0-9](?:[a-z0-9-]*[a-z0-9])?|\[(?:(?:25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)\.){3}(?:25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?|[a-z0-9-]*[a-z0-9]:(?:[\x01-\x08\x0b\x0c\x0e-\x1f\x21-\x5a\x53-\x7f]|\\[\x01-\x09\x0b\x0c\x0e-\x7f])+)\])/;
2100
- /**
2101
- * Phone number Regex
2102
- */
2103
- const PHONE_NUMBER_REGEX = /^\s*(?:\+?(\d{1,3}))?[-. (]*(\d{3})[-. )]*(\d{3})[-. ]*(\d{3})(?: *x(\d+))?\s*$/;
2104
- /**
2105
- * URL Regex
2106
- */
2107
- const URL_REGEX = /(https?:\/\/(?:www\.|(?!www))[a-zA-Z0-9][a-zA-Z0-9-]+[a-zA-Z0-9]\.[^\s]{2,}|www\.[a-zA-Z0-9][a-zA-Z0-9-]+[a-zA-Z0-9]\.[^\s]{2,}|https?:\/\/(?:www\.|(?!www))[a-zA-Z0-9]+\.[^\s]{2,}|www\.[a-zA-Z0-9]+\.[^\s]{2,})/;
2108
- /**
2109
- * The italian tax code Regex (Codice Fiscale)
2110
- */
2111
- const ITALIAN_TAX_CODE_REGEX = /^[A-Za-z]{6}[0-9]{2}[A-Za-z]{1}[0-9]{2}[A-Za-z]{1}[0-9]{3}[A-Za-z]{1}$/i;
2112
- /**
2113
- * The VAT number Regex (Partita iva)
2114
- */
2115
- const VAT_NUMBER_REGEX = /^[0-9]{11}$/;
2116
- /**
2117
- * Italian CAP Regex
2118
- */
2119
- const CAP_REGEX = /^[0-9]{5}$/;
2120
-
2121
- class ItValidators {
2122
- /**
2123
- * Static pattern validator with custom error
2124
- * @param regex
2125
- * @param error
2126
- */
2127
- static customPattern(regex, error) {
2128
- return (control) => {
2129
- if (!control.value) {
2130
- // if control is empty return no error
2131
- return null;
2132
- }
2133
- // test the value of the control against the regexp supplied
2134
- const valid = regex.test(control.value);
2135
- // if true, return no error (no error), else return error passed in the second parameter
2136
- return valid ? null : error;
2137
- };
2138
- }
2139
- /**
2140
- * Set Validator if the condition is satisfied
2141
- * @param validator the validator to apply if the condition is true
2142
- * @param condition the condition
2143
- */
2144
- static conditional(validator, condition) {
2145
- return formControl => {
2146
- if (!formControl.parent) {
2147
- return null;
2148
- }
2149
- if (condition(formControl)) {
2150
- return validator(formControl);
2151
- }
2152
- return null;
2153
- };
2154
- }
2155
- /**
2156
- * Check whether our password and confirm password are a match
2157
- * @param control
2158
- */
2159
- static passwordMatch(control) {
2160
- const confirmControl = control.get('passwordConfirm'); //confirmPassword form control
2161
- if (!confirmControl) {
2162
- return null;
2163
- }
2164
- const password = control.get('password')?.value; // get password from our password form control
2165
- // compare is the password match
2166
- if ((password && !confirmControl.value) || (confirmControl.value && password !== confirmControl.value)) {
2167
- // if they don't match, set an error in our confirmPassword form control
2168
- confirmControl?.setErrors({ noPasswordMatch: true });
2169
- confirmControl?.markAsTouched();
2170
- return control;
2171
- }
2172
- if (password) {
2173
- confirmControl?.markAsTouched();
2174
- }
2175
- return null;
2176
- }
2177
- /**
2178
- * Password validator
2179
- * @param minLength minimum password length - default 10
2180
- * @param hasNumber check whether the entered password has a number - default true
2181
- * @param hasCapitalCase check whether the entered password has upper case letter - default true
2182
- * @param hasSmallCase check whether the entered password has a lower-case letter - default true
2183
- * @param hasSpecialCharacters check whether the entered password has a special character - default true
2184
- */
2185
- static password(minLength = 10, hasNumber = true, hasCapitalCase = true, hasSmallCase = true, hasSpecialCharacters = true) {
2186
- return Validators.compose([
2187
- Validators.required,
2188
- ItValidators.customPattern(/\d/, { hasNumber: hasNumber }),
2189
- ItValidators.customPattern(/[A-Z]/, { hasCapitalCase: hasCapitalCase }),
2190
- ItValidators.customPattern(/[a-z]/, { hasSmallCase: hasSmallCase }),
2191
- ItValidators.customPattern(new RegExp(`[${ItValidators.SpecialCharacterPattern}]`), { hasSpecialCharacters: hasSpecialCharacters }),
2192
- Validators.minLength(minLength)
2193
- ]);
2194
- }
2195
- /**
2196
- * Email validator
2197
- */
2198
- static get email() {
2199
- return Validators.compose([
2200
- Validators.email,
2201
- ItValidators.customPattern(EMAIL_REGEX, { invalidEmail: true })
2202
- ]);
2203
- }
2204
- /**
2205
- * Phone number validator
2206
- */
2207
- static get tel() {
2208
- return ItValidators.customPattern(PHONE_NUMBER_REGEX, { invalidTel: true });
2209
- }
2210
- /**
2211
- * URL validator
2212
- */
2213
- static get url() {
2214
- return ItValidators.customPattern(URL_REGEX, { invalidUrl: true });
2215
- }
2216
- /**
2217
- * Italian Tax Code validator
2218
- */
2219
- static get taxCode() {
2220
- return ItValidators.customPattern(ITALIAN_TAX_CODE_REGEX, { invalidTaxCode: true });
2221
- }
2222
- /**
2223
- * VAT Number validator
2224
- */
2225
- static get vatNumber() {
2226
- return ItValidators.customPattern(VAT_NUMBER_REGEX, { invalidVatNumber: true });
2227
- }
2228
- /**
2229
- * Italian Postal Code validator (CAP)
2230
- */
2231
- static get cap() {
2232
- return ItValidators.customPattern(CAP_REGEX, { invalidCap: true });
2233
- }
2234
- /**
2235
- * Check if value is a valid RegExp
2236
- */
2237
- static get regExp() {
2238
- return (control) => {
2239
- try {
2240
- if (control?.value) {
2241
- new RegExp(control.value);
2242
- }
2243
- }
2244
- catch (e) {
2245
- return { invalidRegex: true };
2246
- }
2247
- return null;
2248
- };
2249
- }
2250
- }
2251
- ItValidators.SpecialCharacterPattern = '!@#$%&*_+=;:|,.';
2252
-
2253
- class MarkMatchingTextPipe {
2254
- constructor(domSanitizer) {
2255
- this.domSanitizer = domSanitizer;
2256
- }
2257
- transform(allString, searchString) {
2258
- if (!searchString) {
2259
- return allString;
2260
- }
2261
- else if (!allString) {
2262
- return "";
2263
- }
2264
- // Check if search string is a substring of pivot string (no case-sensitive)
2265
- const idxOfMatchString = allString.toLowerCase().indexOf(searchString.toLowerCase());
2266
- if (idxOfMatchString !== -1) {
2267
- // retrieve the exactly substring
2268
- const matchingString = allString.substring(idxOfMatchString, idxOfMatchString + searchString.length);
2269
- // Replace original string marking as <strong> (bold) the matchinng substring
2270
- const regEx = new RegExp('(' + matchingString + ')', 'gi');
2271
- const res = allString.replace(regEx, '<mark>$1</mark>');
2272
- return this.domSanitizer.bypassSecurityTrustHtml(res);
2273
- }
2274
- return allString;
2275
- }
2276
- }
2277
- MarkMatchingTextPipe.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: MarkMatchingTextPipe, deps: [{ token: i1$2.DomSanitizer }], target: i0.ɵɵFactoryTarget.Pipe });
2278
- MarkMatchingTextPipe.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "15.0.4", ngImport: i0, type: MarkMatchingTextPipe, name: "markMatchingText" });
2279
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: MarkMatchingTextPipe, decorators: [{
2280
- type: Pipe,
2281
- args: [{
2282
- name: 'markMatchingText'
2283
- }]
2284
- }], ctorParameters: function () { return [{ type: i1$2.DomSanitizer }]; } });
2285
-
2286
- class InputComponent extends AbstractFormComponent {
2287
- constructor() {
2288
- super(...arguments);
2289
- /**
2290
- * The input type
2291
- * @default text
2292
- */
2293
- this.type = 'text';
2294
- /**
2295
- * The input placeholder
2296
- */
2297
- this.placeholder = '';
2298
- /**
2299
- * Time span [ms] has passed without another source emission, to delay data filtering.
2300
- * Useful when the user is typing multiple letters
2301
- * @default 300 [ms]
2302
- */
2303
- this.autocompleteDebounceTime = 300;
2304
- /**
2305
- * Fired when the Autocomplete Item has been selected
2306
- */
2307
- this.onAutocompleteSelected = new EventEmitter();
2308
- this.showAutocompletion = false;
2309
- /** Observable da cui vengono emessi i risultati dell'auto completamento */
2310
- this.autocompleteResults$ = new Observable();
2311
- }
2312
- get isActiveLabel() {
2313
- const value = this.control.value;
2314
- if ((!!value && value !== 0) || value === 0 || !!this.placeholder) {
2315
- return true;
2316
- }
2317
- if (this.type === 'number' && (isTrueBooleanInput(this.currency) || isTrueBooleanInput(this.percentage))) {
2318
- return true;
2319
- }
2320
- return this.type === 'date' || this.type === 'time' || this.type === 'color';
2321
- }
2322
- /**
2323
- * Check is readonly field
2324
- */
2325
- get isReadonly() {
2326
- return this.readonly === 'plaintext' || isTrueBooleanInput(this.readonly);
2327
- }
2328
- /**
2329
- * Return the invalid message string from TranslateService
2330
- */
2331
- get invalidMessage() {
2332
- if (this.hasError('min') && this.min) {
2333
- return this._translateService.get('it.errors.min-invalid', {
2334
- min: this.min
2335
- });
2336
- }
2337
- if (this.hasError('max') && this.max) {
2338
- return this._translateService.get('it.errors.max-invalid', {
2339
- max: this.max
2340
- });
2341
- }
2342
- if (this.hasError('minlength')) {
2343
- const error = this.getError('minlength');
2344
- return this._translateService.get('it.errors.min-length-invalid', { min: error.requiredLength });
2345
- }
2346
- if (this.hasError('maxlength')) {
2347
- const error = this.getError('maxlength');
2348
- return this._translateService.get('it.errors.max-length-invalid', { max: error.requiredLength });
2349
- }
2350
- if (this.hasError('email') || this.hasError('invalidEmail')) {
2351
- return this._translateService.get('it.errors.email-invalid');
2352
- }
2353
- if (this.hasError('invalidTel')) {
2354
- return this._translateService.get('it.errors.tel-invalid');
2355
- }
2356
- if (this.hasError('invalidUrl')) {
2357
- return this._translateService.get('it.errors.url-invalid');
2358
- }
2359
- if (this.hasError('invalidTaxCode')) {
2360
- return this._translateService.get('it.errors.tax-code-invalid');
2361
- }
2362
- if (this.hasError('invalidVatNumber')) {
2363
- return this._translateService.get('it.errors.vat-number-invalid');
2364
- }
2365
- if (this.hasError('invalidCap')) {
2366
- return this._translateService.get('it.errors.cap-invalid');
2367
- }
2368
- if (this.hasError('invalidRegex')) {
2369
- return this._translateService.get('it.errors.regex-invalid');
2370
- }
2371
- if (this.hasError('pattern')) {
2372
- const error = this.getError('pattern');
2373
- return this._translateService.get('it.errors.pattern-invalid', { pattern: error.requiredPattern });
2374
- }
2375
- return super.invalidMessage;
2376
- }
2377
- ngOnInit() {
2378
- super.ngOnInit();
2379
- const validators = [];
2380
- switch (this.type) {
2381
- case 'number':
2382
- if (isTrueBooleanInput(this.percentage)) {
2383
- this.min = this.min || 0;
2384
- this.max = this.max || 100;
2385
- }
2386
- // Dynamic min/max validators
2387
- validators.push((control) => this.min ? Validators.min(this.min)(control) : null);
2388
- validators.push((control) => this.max ? Validators.max(this.max)(control) : null);
2389
- break;
2390
- case 'email':
2391
- validators.push(ItValidators.email);
2392
- break;
2393
- case 'tel':
2394
- validators.push(ItValidators.tel);
2395
- break;
2396
- case 'url':
2397
- validators.push(ItValidators.url);
2398
- break;
2399
- }
2400
- this.addValidators(validators);
2401
- this.autocompleteResults$ = this.getAutocompleteResults$();
2402
- }
2403
- /**
2404
- * Increment or decrease the input number value of step
2405
- * @param decrease true to decrease value
2406
- */
2407
- incrementNumber(decrease = false) {
2408
- if (this.type !== 'number') {
2409
- return;
2410
- }
2411
- const step = (this.step === 'any' ? 1 : (this.step ?? 1));
2412
- let value = Number(this.control.value);
2413
- value = (isNaN(value) ? 0 : value) + (decrease ? -step : step);
2414
- value = Math.round(value * 1e12) / 1e12; // prevent js decimal error
2415
- if (this.min !== undefined && value < this.min) {
2416
- value = this.min;
2417
- }
2418
- else if (this.max !== undefined && value > this.max) {
2419
- value = this.max;
2420
- }
2421
- this.control.setValue(value);
2422
- }
2423
- /**
2424
- * Create the autocomplete list
2425
- */
2426
- getAutocompleteResults$() {
2427
- if (this.type !== 'search') {
2428
- return of({ searchedValue: '', relatedEntries: [] });
2429
- }
2430
- return this.control.valueChanges.pipe(debounceTime(this.autocompleteDebounceTime), // Delay filter data after time span has passed without another source emission, useful when the user is typing multiple letters
2431
- distinctUntilChanged(), // Only if searchValue is distinct in comparison to the last value
2432
- switchMap(searchedValue => {
2433
- if (!this.autocompleteData) {
2434
- return of({ searchedValue, relatedEntries: [] });
2435
- }
2436
- const autoCompleteData$ = Array.isArray(this.autocompleteData) ? of(this.autocompleteData) : this.autocompleteData(searchedValue);
2437
- return autoCompleteData$.pipe(map(autocompleteData => {
2438
- if (!searchedValue) {
2439
- return { searchedValue, relatedEntries: [] };
2440
- }
2441
- const lowercaseValue = searchedValue.toLowerCase();
2442
- const relatedEntries = autocompleteData.filter(item => item.value?.toLowerCase().includes(lowercaseValue));
2443
- return { searchedValue, relatedEntries };
2444
- }));
2445
- }));
2446
- }
2447
- onEntryClick(entry, event) {
2448
- // Se non è stato definito un link associato all'elemento dell'autocomplete, probabilmente il desiderata
2449
- // non è effettuare la navigazione al default '#', pertanto in tal caso meglio annullare la navigazione.
2450
- if (!entry.link) {
2451
- event.preventDefault();
2452
- }
2453
- this.onAutocompleteSelected.next(entry);
2454
- this.control.setValue(entry.value);
2455
- this.showAutocompletion = false;
2456
- }
2457
- autocompleteItemTrackByValueFn(index, item) {
2458
- return item.value;
2459
- }
2460
- onKeyDown() {
2461
- this.showAutocompletion = this.type === 'search';
2462
- }
2463
- }
2464
- InputComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: InputComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
2465
- InputComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.0.4", type: InputComponent, selector: "it-input[id]", inputs: { type: "type", placeholder: "placeholder", description: "description", readonly: "readonly", max: "max", min: "min", step: "step", currency: "currency", percentage: "percentage", adaptive: "adaptive", autocompleteData: "autocompleteData", autocompleteDebounceTime: "autocompleteDebounceTime" }, outputs: { onAutocompleteSelected: "onAutocompleteSelected" }, usesInheritance: true, ngImport: i0, template: "<div class=\"form-group\">\n <div class=\"input-group\">\n <div class=\"input-group-prepend\" [class.d-none]=\"!prependText.hasChildNodes() && !prepend.hasChildNodes()\">\n <div #prepend>\n <ng-content select=\"[prepend]\"></ng-content>\n </div>\n <div class=\"input-group-text\" #prependText>\n <ng-content select=\"[prependText]\"></ng-content>\n </div>\n </div>\n\n <label *ngIf=\"label\" [for]=\"id\" [class.active]=\"isActiveLabel\"\n [class.empty-prepend-label]=\"!prependText.hasChildNodes() && !prepend.hasChildNodes()\">\n {{label}}\n </label>\n\n <span *ngIf=\"type === 'number'\"\n class=\"input-number\"\n [class.input-number-currency]=\"currency\"\n [class.input-number-percentage]=\"percentage\"\n [class.input-number-adaptive]=\"adaptive\">\n\n <input type=\"number\"\n [id]=\"id\"\n [step]=\"step ?? null\"\n [class.is-invalid]=\"isInvalid\"\n [class.is-valid]=\"isValid\"\n [formControl]=\"control\"\n [placeholder]=\"placeholder\"\n [readonly]=\"isReadonly\"\n [attr.aria-describedby]=\"id + '-description'\"\n (blur)=\"markAsTouched()\" />\n\n <button type=\"button\" class=\"input-number-add\" (click)=\"incrementNumber()\">\n <span class=\"visually-hidden\">{{'it.form.increase-value'}}</span>\n </button>\n <button type=\"button\" class=\"input-number-sub\" (click)=\"incrementNumber(true)\">\n <span class=\"visually-hidden\">{{'it.form.decrease-value'}}</span>\n </button>\n </span>\n\n <input *ngIf=\"type !== 'number'\"\n [id]=\"id\"\n [type]=\"type\"\n [class.form-control]=\"readonly !== 'plaintext'\"\n [class.form-control-plaintext]=\"readonly === 'plaintext'\"\n [class.is-invalid]=\"isInvalid\"\n [class.is-valid]=\"isValid\"\n [formControl]=\"control\"\n [placeholder]=\"placeholder\"\n [readonly]=\"isReadonly\"\n (keydown)=\"onKeyDown()\"\n [attr.aria-describedby]=\"id + '-description'\"\n (blur)=\"markAsTouched()\">\n\n <div class=\"input-group-append\">\n <ng-content select=\"[append]\"></ng-content>\n\n <div class=\"input-group-text\">\n <ng-content select=\"[appendText]\"></ng-content>\n </div>\n </div>\n </div>\n\n <small *ngIf=\"description\" [id]=\"id + '-description'\" class=\"form-text\">{{description}}</small>\n\n <!-- INIZIO gestione AUTOCOMPLETAMENTO -->\n <ng-container *ngIf=\"type === 'search'\">\n <!-- Icona lente per autocompletamento -->\n <span class=\"autocomplete-icon\" aria-hidden=\"true\">\n <it-icon name=\"search\" size=\"sm\"></it-icon>\n </span>\n\n <ng-container *ngIf=\"autocompleteResults$ | async as autocomplete\">\n <!-- Lista di autocompletamento -->\n <ul class=\"autocomplete-list\" [class.autocomplete-list-show]=\"autocomplete.relatedEntries?.length && showAutocompletion\">\n <li *ngFor=\"let entry of autocomplete.relatedEntries; trackBy: autocompleteItemTrackByValueFn\"\n (click)=\"onEntryClick(entry, $event)\">\n <a [href]=\"entry.link\">\n <ng-container *ngTemplateOutlet=\"autocompleteItemTemplate\"></ng-container>\n </a>\n <ng-template #autocompleteItemTemplate>\n <div class=\"avatar size-sm\" *ngIf=\"entry.avatarSrcPath\">\n <img [src]=\"entry.avatarSrcPath\" [alt]=\"entry.avatarAltText\">\n </div>\n <it-icon *ngIf=\"entry.icon\" [name]=\"entry.icon\" size=\"sm\"></it-icon>\n <span class=\"autocomplete-list-text\">\n <span [innerHTML]=\"entry.value | markMatchingText: autocomplete.searchedValue\"></span>\n <em *ngIf=\"entry.label\">{{entry.label}}</em>\n </span>\n </ng-template>\n </li>\n </ul>\n </ng-container>\n </ng-container>\n <!-- FINE gestione AUTOCOMPLETAMENTO -->\n\n <div *ngIf=\"isInvalid\" class=\"form-feedback just-validate-error-label\" [id]=\"id + '-error'\">\n <div #customError>\n <ng-content select=\"[error]\"></ng-content>\n </div>\n <ng-container *ngIf=\"!customError.hasChildNodes()\">{{invalidMessage | async}}</ng-container>\n </div>\n</div>\n", styles: [".form-group label{z-index:1000}.form-group input:focus:not(.focus--mouse){box-shadow:inherit!important;border-color:inherit!important}.form-group .input-number button.input-number-add{top:0}.form-group .input-number button.input-number-sub{bottom:0}.form-group .input-group-text:empty{display:none}.form-group label.empty-prepend-label{left:auto!important;max-width:100%!important}\n"], dependencies: [{ kind: "directive", type: i1$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { 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.NumberValueAccessor, selector: "input[type=number][formControlName],input[type=number][formControl],input[type=number][ngModel]" }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "component", type: IconComponent, selector: "it-icon[name]", inputs: ["name", "size", "color", "padded", "class"] }, { kind: "pipe", type: i1$1.AsyncPipe, name: "async" }, { kind: "pipe", type: MarkMatchingTextPipe, name: "markMatchingText" }] });
2466
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: InputComponent, decorators: [{
2467
- type: Component,
2468
- args: [{ selector: 'it-input[id]', template: "<div class=\"form-group\">\n <div class=\"input-group\">\n <div class=\"input-group-prepend\" [class.d-none]=\"!prependText.hasChildNodes() && !prepend.hasChildNodes()\">\n <div #prepend>\n <ng-content select=\"[prepend]\"></ng-content>\n </div>\n <div class=\"input-group-text\" #prependText>\n <ng-content select=\"[prependText]\"></ng-content>\n </div>\n </div>\n\n <label *ngIf=\"label\" [for]=\"id\" [class.active]=\"isActiveLabel\"\n [class.empty-prepend-label]=\"!prependText.hasChildNodes() && !prepend.hasChildNodes()\">\n {{label}}\n </label>\n\n <span *ngIf=\"type === 'number'\"\n class=\"input-number\"\n [class.input-number-currency]=\"currency\"\n [class.input-number-percentage]=\"percentage\"\n [class.input-number-adaptive]=\"adaptive\">\n\n <input type=\"number\"\n [id]=\"id\"\n [step]=\"step ?? null\"\n [class.is-invalid]=\"isInvalid\"\n [class.is-valid]=\"isValid\"\n [formControl]=\"control\"\n [placeholder]=\"placeholder\"\n [readonly]=\"isReadonly\"\n [attr.aria-describedby]=\"id + '-description'\"\n (blur)=\"markAsTouched()\" />\n\n <button type=\"button\" class=\"input-number-add\" (click)=\"incrementNumber()\">\n <span class=\"visually-hidden\">{{'it.form.increase-value'}}</span>\n </button>\n <button type=\"button\" class=\"input-number-sub\" (click)=\"incrementNumber(true)\">\n <span class=\"visually-hidden\">{{'it.form.decrease-value'}}</span>\n </button>\n </span>\n\n <input *ngIf=\"type !== 'number'\"\n [id]=\"id\"\n [type]=\"type\"\n [class.form-control]=\"readonly !== 'plaintext'\"\n [class.form-control-plaintext]=\"readonly === 'plaintext'\"\n [class.is-invalid]=\"isInvalid\"\n [class.is-valid]=\"isValid\"\n [formControl]=\"control\"\n [placeholder]=\"placeholder\"\n [readonly]=\"isReadonly\"\n (keydown)=\"onKeyDown()\"\n [attr.aria-describedby]=\"id + '-description'\"\n (blur)=\"markAsTouched()\">\n\n <div class=\"input-group-append\">\n <ng-content select=\"[append]\"></ng-content>\n\n <div class=\"input-group-text\">\n <ng-content select=\"[appendText]\"></ng-content>\n </div>\n </div>\n </div>\n\n <small *ngIf=\"description\" [id]=\"id + '-description'\" class=\"form-text\">{{description}}</small>\n\n <!-- INIZIO gestione AUTOCOMPLETAMENTO -->\n <ng-container *ngIf=\"type === 'search'\">\n <!-- Icona lente per autocompletamento -->\n <span class=\"autocomplete-icon\" aria-hidden=\"true\">\n <it-icon name=\"search\" size=\"sm\"></it-icon>\n </span>\n\n <ng-container *ngIf=\"autocompleteResults$ | async as autocomplete\">\n <!-- Lista di autocompletamento -->\n <ul class=\"autocomplete-list\" [class.autocomplete-list-show]=\"autocomplete.relatedEntries?.length && showAutocompletion\">\n <li *ngFor=\"let entry of autocomplete.relatedEntries; trackBy: autocompleteItemTrackByValueFn\"\n (click)=\"onEntryClick(entry, $event)\">\n <a [href]=\"entry.link\">\n <ng-container *ngTemplateOutlet=\"autocompleteItemTemplate\"></ng-container>\n </a>\n <ng-template #autocompleteItemTemplate>\n <div class=\"avatar size-sm\" *ngIf=\"entry.avatarSrcPath\">\n <img [src]=\"entry.avatarSrcPath\" [alt]=\"entry.avatarAltText\">\n </div>\n <it-icon *ngIf=\"entry.icon\" [name]=\"entry.icon\" size=\"sm\"></it-icon>\n <span class=\"autocomplete-list-text\">\n <span [innerHTML]=\"entry.value | markMatchingText: autocomplete.searchedValue\"></span>\n <em *ngIf=\"entry.label\">{{entry.label}}</em>\n </span>\n </ng-template>\n </li>\n </ul>\n </ng-container>\n </ng-container>\n <!-- FINE gestione AUTOCOMPLETAMENTO -->\n\n <div *ngIf=\"isInvalid\" class=\"form-feedback just-validate-error-label\" [id]=\"id + '-error'\">\n <div #customError>\n <ng-content select=\"[error]\"></ng-content>\n </div>\n <ng-container *ngIf=\"!customError.hasChildNodes()\">{{invalidMessage | async}}</ng-container>\n </div>\n</div>\n", styles: [".form-group label{z-index:1000}.form-group input:focus:not(.focus--mouse){box-shadow:inherit!important;border-color:inherit!important}.form-group .input-number button.input-number-add{top:0}.form-group .input-number button.input-number-sub{bottom:0}.form-group .input-group-text:empty{display:none}.form-group label.empty-prepend-label{left:auto!important;max-width:100%!important}\n"] }]
2469
- }], propDecorators: { type: [{
2470
- type: Input
2471
- }], placeholder: [{
2472
- type: Input
2473
- }], description: [{
2474
- type: Input
2475
- }], readonly: [{
2476
- type: Input
2477
- }], max: [{
2478
- type: Input
2479
- }], min: [{
2480
- type: Input
2481
- }], step: [{
2482
- type: Input
2483
- }], currency: [{
2484
- type: Input
2485
- }], percentage: [{
2486
- type: Input
2487
- }], adaptive: [{
2488
- type: Input
2489
- }], autocompleteData: [{
2490
- type: Input
2491
- }], autocompleteDebounceTime: [{
2492
- type: Input
2493
- }], onAutocompleteSelected: [{
2494
- type: Output
2495
- }] } });
2496
-
2497
- class PasswordInputComponent extends AbstractFormComponent {
2498
- constructor() {
2499
- super(...arguments);
2500
- /**
2501
- * The password minimum length
2502
- * @default 10
2503
- */
2504
- this.minLength = 10;
2505
- /**
2506
- * The password must contain at least one number
2507
- * @default true
2508
- */
2509
- this.useNumber = true;
2510
- /**
2511
- * The password must contain at least one uppercase character
2512
- * @default true
2513
- */
2514
- this.useCapitalCase = true;
2515
- /**
2516
- * The password must contain at least one lowercase character
2517
- * @default true
2518
- */
2519
- this.useSmallCase = true;
2520
- /**
2521
- * The password must contain at least one special character
2522
- * @default true
2523
- */
2524
- this.useSpecialCharacters = true;
2525
- /**
2526
- * The input placeholder
2527
- */
2528
- this.placeholder = '';
2529
- }
2530
- ngOnInit() {
2531
- super.ngOnInit();
2532
- this.addValidators(ItValidators.password(this.minLength, this.useNumber, this.useCapitalCase, this.useSmallCase, this.useSpecialCharacters));
2533
- }
2534
- ngAfterViewInit() {
2535
- super.ngAfterViewInit();
2536
- if (this.inputElement) {
2537
- this.inputPasswordBs = new InputPassword(this.inputElement.nativeElement, {
2538
- ...this.description && { enterPass: this.description },
2539
- showText: this.isStrengthMeter,
2540
- minimumLength: this.minLength
2541
- });
2542
- }
2543
- }
2544
- get isStrengthMeter() {
2545
- return isTrueBooleanInput(this.showStrengthMeter);
2546
- }
2547
- /**
2548
- * Return the invalid message string from TranslateService
2549
- */
2550
- get invalidMessage() {
2551
- if (this.hasError('noPasswordMatch')) {
2552
- return this._translateService.get('it.errors.password-no-match');
2553
- }
2554
- if (this.hasError('minlength')) {
2555
- return this._translateService.get('it.errors.password-min-length', {
2556
- minLength: this.minLength
2557
- });
2558
- }
2559
- if (this.hasError('hasNumber')) {
2560
- return this._translateService.get('it.errors.password-number');
2561
- }
2562
- if (this.hasError('hasCapitalCase')) {
2563
- return this._translateService.get('it.errors.password-capital-case');
2564
- }
2565
- if (this.hasError('hasSmallCase')) {
2566
- return this._translateService.get('it.errors.password-capital-case');
2567
- }
2568
- if (this.hasError('hasSpecialCharacters')) {
2569
- return this._translateService.get('it.errors.password-special-character');
2570
- }
2571
- return super.invalidMessage;
2572
- }
2573
- }
2574
- PasswordInputComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: PasswordInputComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
2575
- PasswordInputComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.0.4", type: PasswordInputComponent, selector: "it-password-input[id]", inputs: { minLength: "minLength", useNumber: "useNumber", useCapitalCase: "useCapitalCase", useSmallCase: "useSmallCase", useSpecialCharacters: "useSpecialCharacters", placeholder: "placeholder", description: "description", showStrengthMeter: "showStrengthMeter" }, viewQueries: [{ propertyName: "inputElement", first: true, predicate: ["input"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<div class=\"form-group\">\n\n <label *ngIf=\"label\" [for]=\"id\" [class.active]=\"!!control.value || !!placeholder\">{{label}}</label>\n\n <input type=\"password\"\n [id]=\"id\"\n class=\"form-control input-password\"\n [class.input-password-strength-meter]=\"isStrengthMeter\"\n [class.is-invalid]=\"isInvalid\"\n [class.is-valid]=\"isValid\"\n [formControl]=\"control\"\n [placeholder]=\"placeholder\"\n [attr.aria-describedby]=\"id + '-description'\" #input>\n\n <span class=\"password-icon\" aria-hidden=\"true\">\n <it-icon name=\"password-visible\" size=\"sm\" class=\"password-icon-visible\"></it-icon>\n <it-icon name=\"password-invisible\" size=\"sm\" class=\"password-icon-invisible d-none\"></it-icon>\n </span>\n\n <small *ngIf=\"description && !isStrengthMeter\" [id]=\"id + '-description'\" class=\"form-text\">{{description}}</small>\n\n <div *ngIf=\"isInvalid\" class=\"form-feedback just-validate-error-label\" [id]=\"id + '-error'\">\n <div #customError><ng-content select=\"[error]\"></ng-content></div>\n <ng-container *ngIf=\"!customError.hasChildNodes()\">{{invalidMessage | async}}</ng-container>\n </div>\n</div>\n", styles: [".form-group input:focus:not(.focus--mouse){box-shadow:inherit!important;border-color:inherit!important}\n"], dependencies: [{ kind: "directive", type: i1$1.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.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "component", type: IconComponent, selector: "it-icon[name]", inputs: ["name", "size", "color", "padded", "class"] }, { kind: "pipe", type: i1$1.AsyncPipe, name: "async" }] });
2576
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: PasswordInputComponent, decorators: [{
2577
- type: Component,
2578
- args: [{ selector: 'it-password-input[id]', template: "<div class=\"form-group\">\n\n <label *ngIf=\"label\" [for]=\"id\" [class.active]=\"!!control.value || !!placeholder\">{{label}}</label>\n\n <input type=\"password\"\n [id]=\"id\"\n class=\"form-control input-password\"\n [class.input-password-strength-meter]=\"isStrengthMeter\"\n [class.is-invalid]=\"isInvalid\"\n [class.is-valid]=\"isValid\"\n [formControl]=\"control\"\n [placeholder]=\"placeholder\"\n [attr.aria-describedby]=\"id + '-description'\" #input>\n\n <span class=\"password-icon\" aria-hidden=\"true\">\n <it-icon name=\"password-visible\" size=\"sm\" class=\"password-icon-visible\"></it-icon>\n <it-icon name=\"password-invisible\" size=\"sm\" class=\"password-icon-invisible d-none\"></it-icon>\n </span>\n\n <small *ngIf=\"description && !isStrengthMeter\" [id]=\"id + '-description'\" class=\"form-text\">{{description}}</small>\n\n <div *ngIf=\"isInvalid\" class=\"form-feedback just-validate-error-label\" [id]=\"id + '-error'\">\n <div #customError><ng-content select=\"[error]\"></ng-content></div>\n <ng-container *ngIf=\"!customError.hasChildNodes()\">{{invalidMessage | async}}</ng-container>\n </div>\n</div>\n", styles: [".form-group input:focus:not(.focus--mouse){box-shadow:inherit!important;border-color:inherit!important}\n"] }]
2579
- }], propDecorators: { minLength: [{
2580
- type: Input
2581
- }], useNumber: [{
2582
- type: Input
2583
- }], useCapitalCase: [{
2584
- type: Input
2585
- }], useSmallCase: [{
2586
- type: Input
2587
- }], useSpecialCharacters: [{
2588
- type: Input
2589
- }], placeholder: [{
2590
- type: Input
2591
- }], description: [{
2592
- type: Input
2593
- }], showStrengthMeter: [{
2594
- type: Input
2595
- }], inputElement: [{
2596
- type: ViewChild,
2597
- args: ['input']
2598
- }] } });
2599
-
2600
- class RadioButtonComponent extends AbstractFormComponent {
2601
- constructor() {
2602
- super(...arguments);
2603
- /**
2604
- * If show radio inline
2605
- * @default false
2606
- */
2607
- this.inline = false;
2608
- /**
2609
- * If is radio group
2610
- * @default false
2611
- */
2612
- this.group = false;
2613
- }
2614
- get isInline() {
2615
- return isTrueBooleanInput(this.inline);
2616
- }
2617
- get isGroup() {
2618
- return isTrueBooleanInput(this.group);
2619
- }
2620
- get name() {
2621
- return this._ngControl?.name?.toString() || '';
2622
- }
2623
- ngOnInit() {
2624
- super.ngOnInit();
2625
- if (this.control.value || !this.value || isFalseBooleanInput(this.checked)) {
2626
- return;
2627
- }
2628
- this.writeValue(this.value);
2629
- return this.onChange(this.value);
2630
- }
2631
- }
2632
- RadioButtonComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: RadioButtonComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
2633
- RadioButtonComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.0.4", type: RadioButtonComponent, selector: "it-radio-button[id][value]", inputs: { value: "value", inline: "inline", group: "group", checked: "checked" }, usesInheritance: true, ngImport: i0, template: "<ng-container>\n <div class=\"form-check\"\n [class.form-check-group]=\"isGroup\"\n [class.form-check-inline]=\"isInline\">\n\n <input\n [id]=\"id\"\n type=\"radio\"\n [value]=\"value\"\n class=\"form-check-input\"\n [name]=\"name\"\n [class.is-invalid]=\"isInvalid\"\n [class.is-valid]=\"isValid\"\n [formControl]=\"control\"\n [attr.aria-describedby]=\"id + '-help'\">\n\n <label class=\"form-check-label\" [for]=\"id\">\n <div #customLabel>\n <ng-content select=\"[label]\"></ng-content>\n </div>\n <ng-container *ngIf=\"!customLabel.hasChildNodes()\">{{label}}</ng-container>\n </label>\n\n <small *ngIf=\"isGroup\" [id]=\"id + '-help'\" class=\"form-text\">\n <ng-content></ng-content>\n </small>\n\n <div *ngIf=\"isInvalid && isGroup\" class=\"form-feedback just-validate-error-label\" [id]=\"id + '-error'\">\n <div #customError>\n <ng-content select=\"[error]\"></ng-content>\n </div>\n <ng-container *ngIf=\"!customError.hasChildNodes()\">{{invalidMessage | async}}</ng-container>\n </div>\n\n </div>\n\n <div *ngIf=\"isInvalid && !isGroup\" class=\"form-feedback just-validate-error-label\" [id]=\"id + '-error'\">\n <div #customError>\n <ng-content select=\"[error]\"></ng-content>\n </div>\n <ng-container *ngIf=\"!customError.hasChildNodes()\">{{invalidMessage | async}}</ng-container>\n </div>\n</ng-container>\n", styles: [""], dependencies: [{ kind: "directive", type: i1$1.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.RadioControlValueAccessor, selector: "input[type=radio][formControlName],input[type=radio][formControl],input[type=radio][ngModel]", inputs: ["name", "formControlName", "value"] }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "pipe", type: i1$1.AsyncPipe, name: "async" }] });
2634
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: RadioButtonComponent, decorators: [{
2635
- type: Component,
2636
- args: [{ selector: 'it-radio-button[id][value]', template: "<ng-container>\n <div class=\"form-check\"\n [class.form-check-group]=\"isGroup\"\n [class.form-check-inline]=\"isInline\">\n\n <input\n [id]=\"id\"\n type=\"radio\"\n [value]=\"value\"\n class=\"form-check-input\"\n [name]=\"name\"\n [class.is-invalid]=\"isInvalid\"\n [class.is-valid]=\"isValid\"\n [formControl]=\"control\"\n [attr.aria-describedby]=\"id + '-help'\">\n\n <label class=\"form-check-label\" [for]=\"id\">\n <div #customLabel>\n <ng-content select=\"[label]\"></ng-content>\n </div>\n <ng-container *ngIf=\"!customLabel.hasChildNodes()\">{{label}}</ng-container>\n </label>\n\n <small *ngIf=\"isGroup\" [id]=\"id + '-help'\" class=\"form-text\">\n <ng-content></ng-content>\n </small>\n\n <div *ngIf=\"isInvalid && isGroup\" class=\"form-feedback just-validate-error-label\" [id]=\"id + '-error'\">\n <div #customError>\n <ng-content select=\"[error]\"></ng-content>\n </div>\n <ng-container *ngIf=\"!customError.hasChildNodes()\">{{invalidMessage | async}}</ng-container>\n </div>\n\n </div>\n\n <div *ngIf=\"isInvalid && !isGroup\" class=\"form-feedback just-validate-error-label\" [id]=\"id + '-error'\">\n <div #customError>\n <ng-content select=\"[error]\"></ng-content>\n </div>\n <ng-container *ngIf=\"!customError.hasChildNodes()\">{{invalidMessage | async}}</ng-container>\n </div>\n</ng-container>\n" }]
2637
- }], propDecorators: { value: [{
2638
- type: Input
2639
- }], inline: [{
2640
- type: Input
2641
- }], group: [{
2642
- type: Input
2643
- }], checked: [{
2644
- type: Input
2645
- }] } });
2646
-
2647
- class SelectComponent extends AbstractFormComponent {
2648
- ngOnInit() {
2649
- super.ngOnInit();
2650
- if (this.control.value) {
2651
- return;
2652
- }
2653
- const selectedOption = this.options.find(this.optionIsSelected);
2654
- if (selectedOption) {
2655
- this.writeValue(selectedOption.value);
2656
- return this.onChange(selectedOption.value);
2657
- }
2658
- const selectedGroupOption = this.groups?.flatMap(g => g.options).find(this.optionIsSelected);
2659
- if (selectedGroupOption) {
2660
- this.writeValue(selectedGroupOption.value);
2661
- this.onChange(selectedGroupOption.value);
2662
- }
2663
- }
2664
- /**
2665
- * Check if the option is selected
2666
- * @param option the option
2667
- */
2668
- optionIsSelected(option) {
2669
- if (option.selected === true) {
2670
- return true;
2671
- }
2672
- if (typeof option.selected === 'function') {
2673
- return option.selected(this.control.value);
2674
- }
2675
- return false;
2676
- }
2677
- /**
2678
- * Check if the option is disabled
2679
- * @param option the option
2680
- */
2681
- optionIsDisabled(option) {
2682
- if (option.disabled === true) {
2683
- return true;
2684
- }
2685
- if (typeof option.disabled === 'function') {
2686
- return option.disabled(this.control.value);
2687
- }
2688
- return false;
2689
- }
2690
- }
2691
- SelectComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: SelectComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
2692
- SelectComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.0.4", type: SelectComponent, selector: "it-select[id][options]", inputs: { options: "options", groups: "groups", description: "description" }, usesInheritance: true, ngImport: i0, template: "<div class=\"select-wrapper\">\n <label [for]=\"id\">{{label}}</label>\n <select [id]=\"id\" [formControl]=\"control\" [attr.aria-describedby]=\"id + '-description'\">\n <option *ngFor=\"let option of options\" [disabled]=\"optionIsDisabled(option)\" [value]=\"option.value\">\n {{option.text ?? option.value}}\n </option>\n\n <ng-container *ngIf=\"groups\">\n <optgroup *ngFor=\"let group of groups\" [label]=\"group.label\">\n <option *ngFor=\"let option of group.options\" [disabled]=\"optionIsDisabled(option)\" [value]=\"option.value\">\n {{option.text ?? option.value}}\n </option>\n </optgroup>\n </ng-container>\n </select>\n <small *ngIf=\"description\" [id]=\"id + '-description'\" class=\"form-text\">{{description}}</small>\n</div>\n", styles: [".select-wrapper{margin-bottom:1.7rem}\n"], dependencies: [{ kind: "directive", type: i1$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i2.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i2.SelectControlValueAccessor, selector: "select:not([multiple])[formControlName],select:not([multiple])[formControl],select:not([multiple])[ngModel]", inputs: ["compareWith"] }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }] });
2693
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: SelectComponent, decorators: [{
2694
- type: Component,
2695
- args: [{ selector: 'it-select[id][options]', template: "<div class=\"select-wrapper\">\n <label [for]=\"id\">{{label}}</label>\n <select [id]=\"id\" [formControl]=\"control\" [attr.aria-describedby]=\"id + '-description'\">\n <option *ngFor=\"let option of options\" [disabled]=\"optionIsDisabled(option)\" [value]=\"option.value\">\n {{option.text ?? option.value}}\n </option>\n\n <ng-container *ngIf=\"groups\">\n <optgroup *ngFor=\"let group of groups\" [label]=\"group.label\">\n <option *ngFor=\"let option of group.options\" [disabled]=\"optionIsDisabled(option)\" [value]=\"option.value\">\n {{option.text ?? option.value}}\n </option>\n </optgroup>\n </ng-container>\n </select>\n <small *ngIf=\"description\" [id]=\"id + '-description'\" class=\"form-text\">{{description}}</small>\n</div>\n", styles: [".select-wrapper{margin-bottom:1.7rem}\n"] }]
2696
- }], propDecorators: { options: [{
2697
- type: Input
2698
- }], groups: [{
2699
- type: Input
2700
- }], description: [{
2701
- type: Input
2702
- }] } });
2703
-
2704
- class TextareaComponent extends AbstractFormComponent {
2705
- constructor() {
2706
- super(...arguments);
2707
- /**
2708
- * Textarea Rows
2709
- * @default 3
2710
- */
2711
- this.rows = 3;
2712
- /**
2713
- * The textarea placeholder
2714
- */
2715
- this.placeholder = '';
2716
- }
2717
- /**
2718
- * Return the invalid message string from TranslateService
2719
- */
2720
- get invalidMessage() {
2721
- if (this.control.hasError('maxlength')) {
2722
- const error = this.getError('maxlength');
2723
- return this._translateService.get('it.errors.max-length-invalid', { max: error.requiredLength });
2724
- }
2725
- if (this.control.hasError('pattern')) {
2726
- const error = this.getError('pattern');
2727
- return this._translateService.get('it.errors.pattern-invalid', { pattern: error.requiredPattern });
2728
- }
2729
- return super.invalidMessage;
2730
- }
2731
- }
2732
- TextareaComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: TextareaComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
2733
- TextareaComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.0.4", type: TextareaComponent, selector: "it-textarea[id]", inputs: { rows: "rows", placeholder: "placeholder", description: "description" }, usesInheritance: true, ngImport: i0, template: "<div class=\"form-group\">\n <label *ngIf=\"label\" [for]=\"id\" [class.active]=\"!!control.value || !!placeholder\">{{label}}</label>\n <textarea\n [id]=\"id\"\n [rows]=\"rows\"\n [class.is-invalid]=\"isInvalid\"\n [class.is-valid]=\"isValid\"\n [placeholder]=\"placeholder\"\n [formControl]=\"control\"\n (blur)=\"markAsTouched()\"></textarea>\n\n <small *ngIf=\"description\" [id]=\"id + '-description'\" class=\"form-text\">{{description}}</small>\n <div *ngIf=\"isInvalid\" class=\"form-feedback just-validate-error-label\" [id]=\"id + '-error'\">\n <div #customError><ng-content select=\"[error]\"></ng-content></div>\n <ng-container *ngIf=\"!customError.hasChildNodes()\">{{invalidMessage | async}}</ng-container>\n </div>\n</div>\n", styles: ["textarea.is-invalid{border-color:#cc334d}\n"], dependencies: [{ kind: "directive", type: i1$1.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.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "pipe", type: i1$1.AsyncPipe, name: "async" }] });
2734
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: TextareaComponent, decorators: [{
2735
- type: Component,
2736
- args: [{ selector: 'it-textarea[id]', template: "<div class=\"form-group\">\n <label *ngIf=\"label\" [for]=\"id\" [class.active]=\"!!control.value || !!placeholder\">{{label}}</label>\n <textarea\n [id]=\"id\"\n [rows]=\"rows\"\n [class.is-invalid]=\"isInvalid\"\n [class.is-valid]=\"isValid\"\n [placeholder]=\"placeholder\"\n [formControl]=\"control\"\n (blur)=\"markAsTouched()\"></textarea>\n\n <small *ngIf=\"description\" [id]=\"id + '-description'\" class=\"form-text\">{{description}}</small>\n <div *ngIf=\"isInvalid\" class=\"form-feedback just-validate-error-label\" [id]=\"id + '-error'\">\n <div #customError><ng-content select=\"[error]\"></ng-content></div>\n <ng-container *ngIf=\"!customError.hasChildNodes()\">{{invalidMessage | async}}</ng-container>\n </div>\n</div>\n", styles: ["textarea.is-invalid{border-color:#cc334d}\n"] }]
2737
- }], propDecorators: { rows: [{
2738
- type: Input
2739
- }], placeholder: [{
2740
- type: Input
2741
- }], description: [{
2742
- type: Input
2743
- }] } });
2744
-
2745
- class FileUtils {
2746
- /**
2747
- * Return the file size string
2748
- * @param file the file
2749
- * @param decimals decimal to show
2750
- */
2751
- static getFileSizeString(file, decimals = 2) {
2752
- const bytes = file.size;
2753
- if (!+bytes) {
2754
- return '0 Bytes';
2755
- }
2756
- const k = 1024;
2757
- const dm = decimals < 0 ? 0 : decimals;
2758
- const sizes = ['Bytes', 'KB', 'MB', 'GB', 'TB', 'PB', 'EB', 'ZB', 'YB'];
2759
- const i = Math.floor(Math.log(bytes) / Math.log(k));
2760
- return `${parseFloat((bytes / Math.pow(k, i)).toFixed(dm))} ${sizes[i]}`;
2761
- }
2762
- /**
2763
- * Convert a file to base64 string
2764
- * @param file the base64 string
2765
- */
2766
- static fileToBase64(file) {
2767
- const reader = new FileReader();
2768
- reader.readAsDataURL(file);
2769
- return new Observable(observer => {
2770
- reader.onload = (e) => {
2771
- const target = e.target;
2772
- if (!target || !target.result || target.result instanceof ArrayBuffer) {
2773
- return observer.error('Error on parse');
2774
- }
2775
- observer.next(target.result);
2776
- observer.complete();
2777
- };
2778
- reader.onerror = error => {
2779
- observer.error(error);
2780
- };
2781
- });
2782
- }
2783
- /**
2784
- * Convert base64 to Blob
2785
- * @param base64 the base64 string
2786
- * @param mimeType the <a href="https://developer.mozilla.org/en-US/docs/Web/HTTP/Basics_of_HTTP/MIME_types/Common_types">MIME type</a> (example 'application/pdf')
2787
- */
2788
- static base64ToBlob(base64, mimeType) {
2789
- const byteString = window.atob(base64);
2790
- const arrayBuffer = new ArrayBuffer(byteString.length);
2791
- const int8Array = new Uint8Array(arrayBuffer);
2792
- for (let i = 0; i < byteString.length; i++) {
2793
- int8Array[i] = byteString.charCodeAt(i);
2794
- }
2795
- return new Blob([int8Array], { type: mimeType });
2796
- }
2797
- /**
2798
- * Convert base64 to File
2799
- * @param base64 the base64 string
2800
- * @param mimeType the <a href="https://developer.mozilla.org/en-US/docs/Web/HTTP/Basics_of_HTTP/MIME_types/Common_types">MIME type</a> (example 'application/pdf')
2801
- * @param filename the file name
2802
- */
2803
- static base64ToFile(base64, mimeType, filename) {
2804
- const fileBlob = FileUtils.base64ToBlob(base64, mimeType);
2805
- return new File([fileBlob], filename, { type: mimeType });
2806
- }
2807
- /**
2808
- * Extract the MIME type from base64 string
2809
- * @param base64 the base64 string
2810
- */
2811
- static getMimeTypeFromBase64(base64) {
2812
- const mime = base64.match(/data:([a-zA-Z0-9]+\/[a-zA-Z0-9-.+]+).*,.*/);
2813
- return (mime && mime.length) ? mime[1] : undefined;
2814
- }
2815
- }
2816
-
2817
- class UploadDragDropComponent extends AbstractComponent {
2818
- constructor() {
2819
- super(...arguments);
2820
- /**
2821
- * The accepted file type to upload <br>
2822
- * Possible values: <a href="https://developer.mozilla.org/en-US/docs/Web/HTTP/Basics_of_HTTP/MIME_types/Common_types">MIME Types</a> separated by comma
2823
- * @example application/pdf,image/png
2824
- * @default *
2825
- */
2826
- this.accept = '*';
2827
- /**
2828
- * Fired when file start to upload
2829
- */
2830
- this.fileStartUpload = new EventEmitter();
2831
- this.isDragover = false;
2832
- this.isLoading = false;
2833
- this.isSuccess = false;
2834
- }
2835
- ngAfterViewInit() {
2836
- super.ngAfterViewInit();
2837
- if (this.donutElement) {
2838
- this.donut = ProgressDonut.getOrCreateInstance(this.donutElement.nativeElement);
2839
- }
2840
- }
2841
- // Dragover listener
2842
- onDragOver(evt) {
2843
- evt.preventDefault();
2844
- evt.stopPropagation();
2845
- this.isDragover = !this.isLoading;
2846
- }
2847
- // Dragleave listener
2848
- onDragLeave(evt) {
2849
- evt.preventDefault();
2850
- evt.stopPropagation();
2851
- this.isDragover = false;
2852
- }
2853
- // Drop leave listener
2854
- onDrop(evt) {
2855
- evt.preventDefault();
2856
- evt.stopPropagation();
2857
- this.isDragover = false;
2858
- const files = evt.dataTransfer?.files;
2859
- if (this.isLoading || !files?.length) {
2860
- return;
2861
- }
2862
- this.start(files[0]);
2863
- }
2864
- /**
2865
- * On load file from input
2866
- * @param event
2867
- */
2868
- onLoadFile(event) {
2869
- const files = event.target?.files;
2870
- if (!files?.length) {
2871
- return;
2872
- }
2873
- this.start(files[0]);
2874
- }
2875
- /**
2876
- * Start the upload file
2877
- * @param file
2878
- */
2879
- start(file) {
2880
- if (this.accept !== '*' && !this.accept.includes(file.type)) {
2881
- return;
2882
- }
2883
- this.reset();
2884
- this.isLoading = true;
2885
- const splitName = file.name.split('.');
2886
- this.filename = splitName[0];
2887
- this.extension = splitName[1]?.toUpperCase();
2888
- this.fileSize = FileUtils.getFileSizeString(file);
2889
- this.fileStartUpload.emit(file);
2890
- }
2891
- /**
2892
- * Percentage of upload
2893
- * @param value the percentage [0 - 100]
2894
- */
2895
- progress(value) {
2896
- if (!this.isLoading) {
2897
- return;
2898
- }
2899
- if (value >= 100) {
2900
- this.success();
2901
- }
2902
- else {
2903
- this.donut?.set(((value < 0) ? 0 : value) / 100);
2904
- }
2905
- }
2906
- /**
2907
- * Upload success
2908
- */
2909
- success() {
2910
- this.isLoading = false;
2911
- this.isSuccess = true;
2912
- }
2913
- /**
2914
- * Reset file uploader
2915
- */
2916
- reset() {
2917
- this.isLoading = false;
2918
- this.isSuccess = false;
2919
- this.filename = this.extension = this.fileSize = undefined;
2920
- this.donut?.set(0);
2921
- }
2922
- }
2923
- UploadDragDropComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: UploadDragDropComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
2924
- UploadDragDropComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.0.4", type: UploadDragDropComponent, selector: "it-upload-drag-drop[id]", inputs: { accept: "accept" }, outputs: { fileStartUpload: "fileStartUpload" }, host: { listeners: { "dragover": "onDragOver($event)", "dragleave": "onDragLeave($event)", "drop": "onDrop($event)" } }, viewQueries: [{ propertyName: "donutElement", first: true, predicate: ["donutElement"], descendants: true }], exportAs: ["itUploadDragDrop"], usesInheritance: true, ngImport: i0, template: "<div class=\"upload-dragdrop\" [class.dragover]=\"isDragover\" [class.loading]=\"isLoading\" [class.success]=\"isSuccess\">\n <div class=\"upload-dragdrop-image\">\n <img src=\"/bootstrap-italia/dist/assets/upload-drag-drop-icon.svg\" alt=\"drag-drop-icon\" aria-hidden=\"true\">\n <div class=\"upload-dragdrop-loading\">\n <div class=\"progress-donut\" #donutElement></div>\n </div>\n <div class=\"upload-dragdrop-success\">\n <it-icon name=\"check\"></it-icon>\n </div>\n </div>\n <div class=\"upload-dragdrop-text\">\n <p class=\"upload-dragdrop-weight\">\n <it-icon name=\"file\" size=\"xs\"></it-icon>\n {{extension}} ({{fileSize}})\n </p>\n <h5>{{filename || ('it.form.upload-drag-file'|translate)}}</h5>\n <p *ngIf=\"isLoading\">{{'it.form.upload-loading'|translate}}</p>\n <p *ngIf=\"isSuccess\">{{'it.form.upload-complete'|translate}}</p>\n <p *ngIf=\"!isLoading && !isSuccess\">{{'it.form.upload-or'|translate}}\n <input type=\"file\" [id]=\"id\" class=\"upload-dragdrop-input\" [accept]=\"accept\" (change)=\"onLoadFile($event)\"/>\n <label [for]=\"id\">{{'it.form.upload-select-device'|translate}}</label>\n </p>\n </div>\n</div>\n", dependencies: [{ kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: IconComponent, selector: "it-icon[name]", inputs: ["name", "size", "color", "padded", "class"] }, { kind: "pipe", type: i1.TranslatePipe, name: "translate" }] });
2925
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: UploadDragDropComponent, decorators: [{
2926
- type: Component,
2927
- args: [{ selector: 'it-upload-drag-drop[id]', exportAs: 'itUploadDragDrop', template: "<div class=\"upload-dragdrop\" [class.dragover]=\"isDragover\" [class.loading]=\"isLoading\" [class.success]=\"isSuccess\">\n <div class=\"upload-dragdrop-image\">\n <img src=\"/bootstrap-italia/dist/assets/upload-drag-drop-icon.svg\" alt=\"drag-drop-icon\" aria-hidden=\"true\">\n <div class=\"upload-dragdrop-loading\">\n <div class=\"progress-donut\" #donutElement></div>\n </div>\n <div class=\"upload-dragdrop-success\">\n <it-icon name=\"check\"></it-icon>\n </div>\n </div>\n <div class=\"upload-dragdrop-text\">\n <p class=\"upload-dragdrop-weight\">\n <it-icon name=\"file\" size=\"xs\"></it-icon>\n {{extension}} ({{fileSize}})\n </p>\n <h5>{{filename || ('it.form.upload-drag-file'|translate)}}</h5>\n <p *ngIf=\"isLoading\">{{'it.form.upload-loading'|translate}}</p>\n <p *ngIf=\"isSuccess\">{{'it.form.upload-complete'|translate}}</p>\n <p *ngIf=\"!isLoading && !isSuccess\">{{'it.form.upload-or'|translate}}\n <input type=\"file\" [id]=\"id\" class=\"upload-dragdrop-input\" [accept]=\"accept\" (change)=\"onLoadFile($event)\"/>\n <label [for]=\"id\">{{'it.form.upload-select-device'|translate}}</label>\n </p>\n </div>\n</div>\n" }]
2928
- }], propDecorators: { accept: [{
2929
- type: Input
2930
- }], fileStartUpload: [{
2931
- type: Output
2932
- }], donutElement: [{
2933
- type: ViewChild,
2934
- args: ['donutElement']
2935
- }], onDragOver: [{
2936
- type: HostListener,
2937
- args: ['dragover', ['$event']]
2938
- }], onDragLeave: [{
2939
- type: HostListener,
2940
- args: ['dragleave', ['$event']]
2941
- }], onDrop: [{
2942
- type: HostListener,
2943
- args: ['drop', ['$event']]
2944
- }] } });
2945
-
2946
- class UploadFileListComponent extends AbstractComponent {
2947
- constructor() {
2948
- super(...arguments);
2949
- /**
2950
- * The accepted file type to upload <br>
2951
- * Possible values: <a href="https://developer.mozilla.org/en-US/docs/Web/HTTP/Basics_of_HTTP/MIME_types/Common_types">MIME Types</a> separated by comma
2952
- * @example application/pdf,image/png
2953
- * @default *
2954
- */
2955
- this.accept = '*';
2956
- /**
2957
- * If upload multiple files
2958
- */
2959
- this.multiple = true;
2960
- /**
2961
- * Fired when upload new files
2962
- */
2963
- this.uploadFiles = new EventEmitter();
2964
- /**
2965
- * Fired on delete item button click
2966
- */
2967
- this.deleteItem = new EventEmitter();
2968
- /**
2969
- * Cache to preview image
2970
- */
2971
- this.previewImages = new Map();
2972
- }
2973
- ngOnInit() {
2974
- if (this.isImageList && this.accept === '*') {
2975
- this.accept = 'image/*';
2976
- }
2977
- }
2978
- ngOnChanges(changes) {
2979
- if (changes['fileList'] && this.isImageList) {
2980
- const images$ = this.fileList.map(item => FileUtils.fileToBase64(item.file).pipe(take(1), tap(base64 => this.previewImages.set(item.id, base64))));
2981
- forkJoin(images$).subscribe(() => {
2982
- this._changeDetectorRef.detectChanges();
2983
- super.ngOnChanges(changes);
2984
- });
2985
- }
2986
- else {
2987
- super.ngOnChanges(changes);
2988
- }
2989
- }
2990
- get isMultipleInput() {
2991
- return isTrueBooleanInput(this.multiple);
2992
- }
2993
- get isImageList() {
2994
- return isTrueBooleanInput(this.images);
2995
- }
2996
- get isHideLoadButton() {
2997
- return isTrueBooleanInput(this.hideLoadButton);
2998
- }
2999
- /**
3000
- * On load file from input
3001
- * @param event
3002
- */
3003
- onLoadFiles(event) {
3004
- const files = event.target?.files;
3005
- if (!files || !files.length) {
3006
- return;
3007
- }
3008
- this.uploadFiles.emit(files);
3009
- }
3010
- /**
3011
- * Get the file size string
3012
- * @param file
3013
- */
3014
- getFileSize(file) {
3015
- return FileUtils.getFileSizeString(file);
3016
- }
3017
- }
3018
- UploadFileListComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: UploadFileListComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
3019
- UploadFileListComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.0.4", type: UploadFileListComponent, selector: "it-upload-file-list[id][fileList]", inputs: { fileList: "fileList", accept: "accept", multiple: "multiple", images: "images", hideLoadButton: "hideLoadButton" }, outputs: { uploadFiles: "uploadFiles", deleteItem: "deleteItem" }, usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<ng-container *ngIf=\"!isHideLoadButton\">\n <input type=\"file\" [id]=\"id\" class=\"upload\" [accept]=\"accept\" [multiple]=\"isMultipleInput\"\n (change)=\"onLoadFiles($event)\" />\n <label [for]=\"id\">\n <it-icon name=\"upload\" size=\"sm\"></it-icon>\n <span>{{'it.form.upload'|translate}}</span>\n </label>\n</ng-container>\n\n<ul class=\"upload-file-list\" [class.upload-file-list-image]=\"isImageList\" *ngIf=\"fileList.length\">\n <li *ngFor=\"let item of fileList\" class=\"upload-file\"\n [class.error]=\"item.error\"\n [class.uploading]=\"!item.error && item.progress !== undefined && item.progress > 0 && item.progress < 100\"\n [class.success]=\"!item.error && (!item.progress || item.progress >= 100)\">\n\n <div class=\"upload-image\" *ngIf=\"isImageList; else icon\">\n <img [attr.src]=\"previewImages.get(item.id)\" [alt]=\"item.file.name\" />\n </div>\n <ng-template #icon>\n <it-icon name=\"file\" size=\"sm\" [color]=\"!item.error ? (item.progress ? 'secondary' : 'primary') : 'danger'\"></it-icon>\n </ng-template>\n\n <p [itTooltip]=\"item.tooltip\">\n <span class=\"visually-hidden\">{{'it.form.uploaded-file'|translate : { name: item.file.name } }}</span>\n {{item.file.name}} <span class=\"upload-file-weight\">{{getFileSize(item.file)}}</span>\n </p>\n\n <button *ngIf=\"item.removable && (!item.progress || item.progress < 100)\" type=\"button\" (click)=\"deleteItem.emit(item)\">\n <span class=\"visually-hidden\">{{'it.form.delete-file'|translate : { name: item.file.name } }}</span>\n <it-icon name=\"close\"></it-icon>\n </button>\n <button *ngIf=\"(!item.removable && !item.progress) || (item.progress !== undefined && item.progress >= 100)\" type=\"button\" disabled>\n <span class=\"visually-hidden\">{{'it.form.upload-complete'|translate}}</span>\n <it-icon name=\"check\"></it-icon>\n </button>\n\n <it-progress-bar *ngIf=\"!item.error && item.progress !== undefined && item.progress > 0 && item.progress < 100\"\n [value]=\"item.progress\"></it-progress-bar>\n </li>\n</ul>\n", dependencies: [{ kind: "directive", type: i1$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: ProgressBarComponent, selector: "it-progress-bar[value]", inputs: ["value", "showLabel", "indeterminate", "color"] }, { kind: "directive", type: TooltipDirective, selector: "[itTooltip]", inputs: ["itTooltip", "tooltipPlacement", "tooltipHtml"], outputs: ["onShow", "onShown", "onHide", "onHidden", "onInserted"], exportAs: ["itTooltip"] }, { kind: "component", type: IconComponent, selector: "it-icon[name]", inputs: ["name", "size", "color", "padded", "class"] }, { kind: "pipe", type: i1.TranslatePipe, name: "translate" }] });
3020
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: UploadFileListComponent, decorators: [{
3021
- type: Component,
3022
- args: [{ selector: 'it-upload-file-list[id][fileList]', template: "<ng-container *ngIf=\"!isHideLoadButton\">\n <input type=\"file\" [id]=\"id\" class=\"upload\" [accept]=\"accept\" [multiple]=\"isMultipleInput\"\n (change)=\"onLoadFiles($event)\" />\n <label [for]=\"id\">\n <it-icon name=\"upload\" size=\"sm\"></it-icon>\n <span>{{'it.form.upload'|translate}}</span>\n </label>\n</ng-container>\n\n<ul class=\"upload-file-list\" [class.upload-file-list-image]=\"isImageList\" *ngIf=\"fileList.length\">\n <li *ngFor=\"let item of fileList\" class=\"upload-file\"\n [class.error]=\"item.error\"\n [class.uploading]=\"!item.error && item.progress !== undefined && item.progress > 0 && item.progress < 100\"\n [class.success]=\"!item.error && (!item.progress || item.progress >= 100)\">\n\n <div class=\"upload-image\" *ngIf=\"isImageList; else icon\">\n <img [attr.src]=\"previewImages.get(item.id)\" [alt]=\"item.file.name\" />\n </div>\n <ng-template #icon>\n <it-icon name=\"file\" size=\"sm\" [color]=\"!item.error ? (item.progress ? 'secondary' : 'primary') : 'danger'\"></it-icon>\n </ng-template>\n\n <p [itTooltip]=\"item.tooltip\">\n <span class=\"visually-hidden\">{{'it.form.uploaded-file'|translate : { name: item.file.name } }}</span>\n {{item.file.name}} <span class=\"upload-file-weight\">{{getFileSize(item.file)}}</span>\n </p>\n\n <button *ngIf=\"item.removable && (!item.progress || item.progress < 100)\" type=\"button\" (click)=\"deleteItem.emit(item)\">\n <span class=\"visually-hidden\">{{'it.form.delete-file'|translate : { name: item.file.name } }}</span>\n <it-icon name=\"close\"></it-icon>\n </button>\n <button *ngIf=\"(!item.removable && !item.progress) || (item.progress !== undefined && item.progress >= 100)\" type=\"button\" disabled>\n <span class=\"visually-hidden\">{{'it.form.upload-complete'|translate}}</span>\n <it-icon name=\"check\"></it-icon>\n </button>\n\n <it-progress-bar *ngIf=\"!item.error && item.progress !== undefined && item.progress > 0 && item.progress < 100\"\n [value]=\"item.progress\"></it-progress-bar>\n </li>\n</ul>\n" }]
3023
- }], propDecorators: { fileList: [{
3024
- type: Input
3025
- }], accept: [{
3026
- type: Input
3027
- }], multiple: [{
3028
- type: Input
3029
- }], images: [{
3030
- type: Input
3031
- }], hideLoadButton: [{
3032
- type: Input
3033
- }], uploadFiles: [{
3034
- type: Output
3035
- }], deleteItem: [{
3036
- type: Output
3037
- }] } });
3038
-
3039
- class BackButtonComponent {
3040
- constructor(_location) {
3041
- this._location = _location;
3042
- /**
3043
- * Back button style
3044
- * - <b>link</b>: use a link with icon and text
3045
- * - <b>button</b>: use a button with icon and text
3046
- * @default button
3047
- */
3048
- this.buttonStyle = 'button';
3049
- /**
3050
- * Button direction
3051
- * - <b>left</b>: Back direction
3052
- * - <b>up</b>: Upper direction
3053
- * @default left
3054
- */
3055
- this.direction = 'left';
3056
- /**
3057
- * Show/Hide icon
3058
- * @default true
3059
- */
3060
- this.showIcon = true;
3061
- /**
3062
- * Show/Hide text
3063
- * @default true
3064
- */
3065
- this.showText = true;
3066
- }
3067
- get isShowIcon() {
3068
- return isTrueBooleanInput(this.showIcon);
3069
- }
3070
- get isShowText() {
3071
- return isTrueBooleanInput(this.showText);
3072
- }
3073
- /**
3074
- * Go back function
3075
- */
3076
- goBack(event) {
3077
- event.preventDefault();
3078
- if (this.backFn) {
3079
- return this.backFn(this._location);
3080
- }
3081
- this._location.back();
3082
- }
3083
- }
3084
- BackButtonComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: BackButtonComponent, deps: [{ token: i1$1.Location }], target: i0.ɵɵFactoryTarget.Component });
3085
- BackButtonComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.0.4", type: BackButtonComponent, selector: "it-back-button", inputs: { buttonStyle: "buttonStyle", direction: "direction", showIcon: "showIcon", showText: "showText", backFn: "backFn" }, exportAs: ["itBackButton"], ngImport: i0, template: "<a *ngIf=\"buttonStyle === 'link'\" href=\"#\" class=\"go-back\" (click)=\"goBack($event)\">\n <ng-container *ngTemplateOutlet=\"content\"></ng-container>\n</a>\n\n<button *ngIf=\"buttonStyle === 'button'\" itButton=\"primary\" class=\"go-back\" (click)=\"goBack($event)\">\n <ng-container *ngTemplateOutlet=\"content\"></ng-container>\n</button>\n\n<ng-template #content>\n <it-icon *ngIf=\"isShowIcon\"\n size=\"sm\"\n [name]=\"direction === 'left' ? 'arrow-left' : 'arrow-up'\"\n [color]=\"buttonStyle === 'link' ? 'primary' : 'white'\"\n [class.me-2]=\"isShowText\"></it-icon>\n\n <span [class.visually-hidden]=\"!isShowText\">\n {{(direction === 'left' ? 'it.navigation.go-back' : 'it.navigation.upper-level') | translate}}\n </span>\n</ng-template>\n", dependencies: [{ kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: ButtonDirective, selector: "[itButton]", inputs: ["itButton", "size", "block", "disabled"], exportAs: ["itButton"] }, { kind: "component", type: IconComponent, selector: "it-icon[name]", inputs: ["name", "size", "color", "padded", "class"] }, { kind: "pipe", type: i1.TranslatePipe, name: "translate" }] });
3086
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: BackButtonComponent, decorators: [{
3087
- type: Component,
3088
- args: [{ selector: 'it-back-button', exportAs: 'itBackButton', template: "<a *ngIf=\"buttonStyle === 'link'\" href=\"#\" class=\"go-back\" (click)=\"goBack($event)\">\n <ng-container *ngTemplateOutlet=\"content\"></ng-container>\n</a>\n\n<button *ngIf=\"buttonStyle === 'button'\" itButton=\"primary\" class=\"go-back\" (click)=\"goBack($event)\">\n <ng-container *ngTemplateOutlet=\"content\"></ng-container>\n</button>\n\n<ng-template #content>\n <it-icon *ngIf=\"isShowIcon\"\n size=\"sm\"\n [name]=\"direction === 'left' ? 'arrow-left' : 'arrow-up'\"\n [color]=\"buttonStyle === 'link' ? 'primary' : 'white'\"\n [class.me-2]=\"isShowText\"></it-icon>\n\n <span [class.visually-hidden]=\"!isShowText\">\n {{(direction === 'left' ? 'it.navigation.go-back' : 'it.navigation.upper-level') | translate}}\n </span>\n</ng-template>\n" }]
3089
- }], ctorParameters: function () { return [{ type: i1$1.Location }]; }, propDecorators: { buttonStyle: [{
3090
- type: Input
3091
- }], direction: [{
3092
- type: Input
3093
- }], showIcon: [{
3094
- type: Input
3095
- }], showText: [{
3096
- type: Input
3097
- }], backFn: [{
3098
- type: Input
3099
- }] } });
3100
-
3101
- class BackToTopComponent extends AbstractComponent {
3102
- constructor() {
3103
- super(...arguments);
3104
- /**
3105
- * The back to top ID
3106
- * @default 'back-to-top-button'
3107
- */
3108
- this.id = 'back-to-top-button';
3109
- }
3110
- get isSmall() {
3111
- return isTrueBooleanInput(this.small);
3112
- }
3113
- get isShadow() {
3114
- return isTrueBooleanInput(this.shadow);
3115
- }
3116
- get isDark() {
3117
- return isTrueBooleanInput(this.dark);
3118
- }
3119
- ngAfterViewInit() {
3120
- super.ngAfterViewInit();
3121
- if (this.backToTopElement) {
3122
- const element = this.backToTopElement.nativeElement;
3123
- this.backToTop = BackToTop.getOrCreateInstance(element);
3124
- }
3125
- }
3126
- /**
3127
- * Show button
3128
- */
3129
- show() {
3130
- this.backToTop?.show();
3131
- }
3132
- /**
3133
- * Hide the button
3134
- */
3135
- hide() {
3136
- this.backToTop?.hide();
3137
- }
3138
- /**
3139
- * Activates the scroll animation towards the Y coordinate indicated by the positionTop option
3140
- */
3141
- scrollToTop() {
3142
- this.backToTop?.scrollToTop();
3143
- }
3144
- /**
3145
- * Eliminate component features
3146
- */
3147
- dispose() {
3148
- this.backToTop?.dispose();
3149
- }
3150
- }
3151
- BackToTopComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: BackToTopComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
3152
- BackToTopComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.0.4", type: BackToTopComponent, selector: "it-back-to-top", inputs: { id: "id", small: "small", shadow: "shadow", dark: "dark" }, viewQueries: [{ propertyName: "backToTopElement", first: true, predicate: ["backToTop"], descendants: true }], exportAs: ["itBackToTop"], usesInheritance: true, ngImport: i0, template: "<a #backToTop [id]=\"id\"\n href=\"#\"\n aria-hidden=\"true\"\n class=\"back-to-top\"\n [class.back-to-top-small]=\"isSmall\"\n [class.shadow]=\"isShadow\"\n [class.dark]=\"isDark\">\n\n <it-icon name=\"arrow-up\" [color]=\"isDark ? 'secondary' : 'light'\"></it-icon>\n</a>\n", dependencies: [{ kind: "component", type: IconComponent, selector: "it-icon[name]", inputs: ["name", "size", "color", "padded", "class"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
3153
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: BackToTopComponent, decorators: [{
3154
- type: Component,
3155
- args: [{ selector: 'it-back-to-top', exportAs: 'itBackToTop', changeDetection: ChangeDetectionStrategy.OnPush, template: "<a #backToTop [id]=\"id\"\n href=\"#\"\n aria-hidden=\"true\"\n class=\"back-to-top\"\n [class.back-to-top-small]=\"isSmall\"\n [class.shadow]=\"isShadow\"\n [class.dark]=\"isDark\">\n\n <it-icon name=\"arrow-up\" [color]=\"isDark ? 'secondary' : 'light'\"></it-icon>\n</a>\n" }]
3156
- }], propDecorators: { id: [{
3157
- type: Input
3158
- }], small: [{
3159
- type: Input
3160
- }], shadow: [{
3161
- type: Input
3162
- }], dark: [{
3163
- type: Input
3164
- }], backToTopElement: [{
3165
- type: ViewChild,
3166
- args: ['backToTop']
3167
- }] } });
3168
-
3169
- class BreadcrumbItemComponent extends LinkComponent {
3170
- get isActive() {
3171
- return isTrueBooleanInput(this.active);
3172
- }
3173
- }
3174
- BreadcrumbItemComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: BreadcrumbItemComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
3175
- BreadcrumbItemComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.0.4", type: BreadcrumbItemComponent, selector: "it-breadcrumb-item", inputs: { active: "active", iconName: "iconName" }, viewQueries: [{ propertyName: "htmlContent", first: true, predicate: TemplateRef, descendants: true }], usesInheritance: true, ngImport: i0, template: "<ng-template>\n <ng-content></ng-content>\n</ng-template>\n", styles: [""] });
3176
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: BreadcrumbItemComponent, decorators: [{
3177
- type: Component,
3178
- args: [{ selector: 'it-breadcrumb-item', template: "<ng-template>\n <ng-content></ng-content>\n</ng-template>\n" }]
3179
- }], propDecorators: { active: [{
3180
- type: Input
3181
- }], iconName: [{
3182
- type: Input
3183
- }], htmlContent: [{
3184
- type: ViewChild,
3185
- args: [TemplateRef]
3186
- }] } });
3187
-
3188
- class BreadcrumbComponent {
3189
- constructor(_changeDetectorRef) {
3190
- this._changeDetectorRef = _changeDetectorRef;
3191
- /**
3192
- * The character to use as separator
3193
- * @default /
3194
- */
3195
- this.separator = '/';
3196
- }
3197
- get isDark() {
3198
- return isTrueBooleanInput(this.dark);
3199
- }
3200
- ngAfterViewInit() {
3201
- this._changeDetectorRef.detectChanges();
3202
- }
3203
- /**
3204
- * Check if index is last item
3205
- * @param index
3206
- */
3207
- isLastItem(index) {
3208
- return !!this.items && index >= (this.items.length - 1);
3209
- }
3210
- }
3211
- BreadcrumbComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: BreadcrumbComponent, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
3212
- BreadcrumbComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.0.4", type: BreadcrumbComponent, selector: "it-breadcrumb", inputs: { separator: "separator", dark: "dark" }, queries: [{ propertyName: "items", predicate: BreadcrumbItemComponent }], ngImport: i0, template: "<nav class=\"breadcrumb-container\" [attr.aria-label]=\"'it.navigation.navigation-path'|translate\">\n <ol class=\"breadcrumb\" [class.dark]=\"isDark\" [class.px-3]=\"isDark\">\n <li *ngFor=\"let item of items; let i = index\"\n class=\"breadcrumb-item\"\n [class.active]=\"item.isActive\"\n [attr.aria-current]=\"item.isActive ? 'page' : null\">\n\n <it-icon *ngIf=\"item.iconName\"\n [name]=\"item.iconName\"\n [color]=\"isDark ? 'white' : 'secondary'\"\n size=\"sm\"\n class=\"align-top me-1\"></it-icon>\n\n <it-link *ngIf=\"!item.isActive && !isLastItem(i); else activeContent\"\n [href]=\"item.href\" [class]=\"item.class\" [externalLink]=\"item.externalLink\" [disabled]=\"item.disabled\">\n <ng-container *ngTemplateOutlet=\"item.htmlContent\"></ng-container>\n </it-link>\n\n <ng-template #activeContent>\n <ng-container *ngTemplateOutlet=\"item.htmlContent\"></ng-container>\n </ng-template>\n\n <span *ngIf=\"!isLastItem(i)\" class=\"separator\">{{separator}}</span>\n </li>\n </ol>\n</nav>\n", styles: [""], dependencies: [{ kind: "directive", type: i1$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: LinkComponent, selector: "it-link", inputs: ["href", "externalLink", "disabled", "class"] }, { kind: "component", type: IconComponent, selector: "it-icon[name]", inputs: ["name", "size", "color", "padded", "class"] }, { kind: "pipe", type: i1.TranslatePipe, name: "translate" }] });
3213
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: BreadcrumbComponent, decorators: [{
3214
- type: Component,
3215
- args: [{ selector: 'it-breadcrumb', template: "<nav class=\"breadcrumb-container\" [attr.aria-label]=\"'it.navigation.navigation-path'|translate\">\n <ol class=\"breadcrumb\" [class.dark]=\"isDark\" [class.px-3]=\"isDark\">\n <li *ngFor=\"let item of items; let i = index\"\n class=\"breadcrumb-item\"\n [class.active]=\"item.isActive\"\n [attr.aria-current]=\"item.isActive ? 'page' : null\">\n\n <it-icon *ngIf=\"item.iconName\"\n [name]=\"item.iconName\"\n [color]=\"isDark ? 'white' : 'secondary'\"\n size=\"sm\"\n class=\"align-top me-1\"></it-icon>\n\n <it-link *ngIf=\"!item.isActive && !isLastItem(i); else activeContent\"\n [href]=\"item.href\" [class]=\"item.class\" [externalLink]=\"item.externalLink\" [disabled]=\"item.disabled\">\n <ng-container *ngTemplateOutlet=\"item.htmlContent\"></ng-container>\n </it-link>\n\n <ng-template #activeContent>\n <ng-container *ngTemplateOutlet=\"item.htmlContent\"></ng-container>\n </ng-template>\n\n <span *ngIf=\"!isLastItem(i)\" class=\"separator\">{{separator}}</span>\n </li>\n </ol>\n</nav>\n" }]
3216
- }], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }]; }, propDecorators: { separator: [{
3217
- type: Input
3218
- }], dark: [{
3219
- type: Input
3220
- }], items: [{
3221
- type: ContentChildren,
3222
- args: [BreadcrumbItemComponent]
3223
- }] } });
3224
-
3225
- class HeaderComponent extends AbstractComponent {
3226
- /**
3227
- * TODO: complete header
3228
- * @param _renderer
3229
- * @param _elementRef
3230
- * @param _changeDetectorRef
3231
- */
3232
- constructor(_renderer, _elementRef, _changeDetectorRef) {
3233
- super(_renderer, _elementRef, _changeDetectorRef);
3234
- this._renderer = _renderer;
3235
- this._elementRef = _elementRef;
3236
- this._changeDetectorRef = _changeDetectorRef;
3237
- this.showSlim = true;
3238
- this.loginStyle = 'full';
3239
- this.smallHeader = true;
3240
- this.showSearch = true;
3241
- this.loginClick = new EventEmitter();
3242
- this.searchClick = new EventEmitter();
3243
- }
3244
- get isLight() {
3245
- return isTrueBooleanInput(this.light);
3246
- }
3247
- get isShowSlim() {
3248
- return isTrueBooleanInput(this.showSlim);
3249
- }
3250
- get isSmallHeader() {
3251
- return isTrueBooleanInput(this.smallHeader);
3252
- }
3253
- get isShowSearch() {
3254
- return isTrueBooleanInput(this.showSearch);
3255
- }
3256
- }
3257
- HeaderComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: HeaderComponent, deps: [{ token: i0.Renderer2 }, { token: i0.ElementRef }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
3258
- HeaderComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.0.4", type: HeaderComponent, selector: "it-header", inputs: { light: "light", showSlim: "showSlim", slimTitle: "slimTitle", loginStyle: "loginStyle", smallHeader: "smallHeader", showSearch: "showSearch" }, outputs: { loginClick: "loginClick", searchClick: "searchClick" }, usesInheritance: true, ngImport: i0, template: "<header class=\"it-header-wrapper\">\n <div *ngIf=\"isShowSlim\" class=\"it-header-slim-wrapper\" [class.theme-light]=\"isLight\">\n <div class=\"container\">\n <div class=\"row\">\n <div class=\"col-12\">\n <div class=\"it-header-slim-wrapper-content\">\n <a class=\"d-none d-lg-block navbar-brand\" href=\"#\">{{slimTitle}}</a>\n <div class=\"nav-mobile\">\n <nav [attr.aria-label]=\"'it.navigation.secondary-navigation'|translate\">\n <a class=\"it-opener d-lg-none\" data-bs-toggle=\"collapse\" href=\"#menuC1\" role=\"button\"\n aria-expanded=\"false\" aria-controls=\"menuC1\">\n <span>{{slimTitle}}</span>\n <it-icon name=\"expand\"></it-icon>\n </a>\n <div class=\"link-list-wrapper collapse\" id=\"menuC1\">\n <ng-content select=\"[slimLinkList]\"></ng-content>\n </div>\n </nav>\n </div>\n <div class=\"it-header-slim-right-zone\">\n <!-- TODO: add language dropdown -->\n <ng-content select=\"[slimRightZone]\"></ng-content>\n <div *ngIf=\"loginStyle === 'default'\" class=\"it-access-top-wrapper\">\n <a class=\"btn btn-primary btn-sm\" (click)=\"loginClick.emit($event)\">\n {{'it.navigation.login'|translate}}\n </a>\n </div>\n </div>\n <button *ngIf=\"loginStyle === 'full'\" itButton=\"primary\" class=\"btn-full\" (click)=\"loginClick.emit($event)\">\n <span class=\"rounded-icon\">\n <it-icon name=\"user\" color=\"primary\"></it-icon>\n <span class=\"d-none d-lg-block\">{{'it.navigation.full-login'|translate}}</span>\n </span>\n </button>\n </div>\n </div>\n </div>\n </div>\n </div>\n <div class=\"it-nav-wrapper\">\n <div class=\"it-header-center-wrapper\" [class.it-small-header]=\"isSmallHeader\">\n <div class=\"container-fluid\">\n <div class=\"row\">\n <div class=\"col-12\">\n <div class=\"it-header-center-content-wrapper\">\n <div class=\"it-brand-wrapper\">\n <ng-content select=\"[brand]\"></ng-content>\n </div>\n <div class=\"it-right-zone\">\n <ng-content select=\"[rightZone]\"></ng-content>\n\n <div class=\"it-search-wrapper\" *ngIf=\"isShowSearch\">\n <span class=\"d-none d-md-block\">{{'it.navigation.search'|translate}}</span>\n <a class=\"search-link rounded-icon\" [attr.aria-label]=\"'it.navigation.website-search'|translate\" (click)=\"searchClick.emit($event)\">\n <it-icon name=\"search\"></it-icon>\n </a>\n </div>\n </div>\n </div>\n </div>\n </div>\n </div>\n </div>\n\n <!-- TODO: complete header -->\n </div>\n</header>\n", styles: [".nav-mobile:has(.link-list-wrapper:empty){display:none}\n"], dependencies: [{ kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: ButtonDirective, selector: "[itButton]", inputs: ["itButton", "size", "block", "disabled"], exportAs: ["itButton"] }, { kind: "component", type: IconComponent, selector: "it-icon[name]", inputs: ["name", "size", "color", "padded", "class"] }, { kind: "pipe", type: i1.TranslatePipe, name: "translate" }] });
3259
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: HeaderComponent, decorators: [{
3260
- type: Component,
3261
- args: [{ selector: 'it-header', template: "<header class=\"it-header-wrapper\">\n <div *ngIf=\"isShowSlim\" class=\"it-header-slim-wrapper\" [class.theme-light]=\"isLight\">\n <div class=\"container\">\n <div class=\"row\">\n <div class=\"col-12\">\n <div class=\"it-header-slim-wrapper-content\">\n <a class=\"d-none d-lg-block navbar-brand\" href=\"#\">{{slimTitle}}</a>\n <div class=\"nav-mobile\">\n <nav [attr.aria-label]=\"'it.navigation.secondary-navigation'|translate\">\n <a class=\"it-opener d-lg-none\" data-bs-toggle=\"collapse\" href=\"#menuC1\" role=\"button\"\n aria-expanded=\"false\" aria-controls=\"menuC1\">\n <span>{{slimTitle}}</span>\n <it-icon name=\"expand\"></it-icon>\n </a>\n <div class=\"link-list-wrapper collapse\" id=\"menuC1\">\n <ng-content select=\"[slimLinkList]\"></ng-content>\n </div>\n </nav>\n </div>\n <div class=\"it-header-slim-right-zone\">\n <!-- TODO: add language dropdown -->\n <ng-content select=\"[slimRightZone]\"></ng-content>\n <div *ngIf=\"loginStyle === 'default'\" class=\"it-access-top-wrapper\">\n <a class=\"btn btn-primary btn-sm\" (click)=\"loginClick.emit($event)\">\n {{'it.navigation.login'|translate}}\n </a>\n </div>\n </div>\n <button *ngIf=\"loginStyle === 'full'\" itButton=\"primary\" class=\"btn-full\" (click)=\"loginClick.emit($event)\">\n <span class=\"rounded-icon\">\n <it-icon name=\"user\" color=\"primary\"></it-icon>\n <span class=\"d-none d-lg-block\">{{'it.navigation.full-login'|translate}}</span>\n </span>\n </button>\n </div>\n </div>\n </div>\n </div>\n </div>\n <div class=\"it-nav-wrapper\">\n <div class=\"it-header-center-wrapper\" [class.it-small-header]=\"isSmallHeader\">\n <div class=\"container-fluid\">\n <div class=\"row\">\n <div class=\"col-12\">\n <div class=\"it-header-center-content-wrapper\">\n <div class=\"it-brand-wrapper\">\n <ng-content select=\"[brand]\"></ng-content>\n </div>\n <div class=\"it-right-zone\">\n <ng-content select=\"[rightZone]\"></ng-content>\n\n <div class=\"it-search-wrapper\" *ngIf=\"isShowSearch\">\n <span class=\"d-none d-md-block\">{{'it.navigation.search'|translate}}</span>\n <a class=\"search-link rounded-icon\" [attr.aria-label]=\"'it.navigation.website-search'|translate\" (click)=\"searchClick.emit($event)\">\n <it-icon name=\"search\"></it-icon>\n </a>\n </div>\n </div>\n </div>\n </div>\n </div>\n </div>\n </div>\n\n <!-- TODO: complete header -->\n </div>\n</header>\n", styles: [".nav-mobile:has(.link-list-wrapper:empty){display:none}\n"] }]
3262
- }], ctorParameters: function () { return [{ type: i0.Renderer2 }, { type: i0.ElementRef }, { type: i0.ChangeDetectorRef }]; }, propDecorators: { light: [{
3263
- type: Input
3264
- }], showSlim: [{
3265
- type: Input
3266
- }], slimTitle: [{
3267
- type: Input
3268
- }], loginStyle: [{
3269
- type: Input
3270
- }], smallHeader: [{
3271
- type: Input
3272
- }], showSearch: [{
3273
- type: Input
3274
- }], loginClick: [{
3275
- type: Output
3276
- }], searchClick: [{
3277
- type: Output
3278
- }] } });
3279
-
3280
- class LanguageSwitcherComponent {
3281
- constructor(translateService) {
3282
- this.translateService = translateService;
3283
- this.currentLang$ = translateService.onLangChange.pipe(map(event => this.availableLanguages?.find(l => l.code === event.lang)));
3284
- }
3285
- ngOnInit() {
3286
- if (!this.availableLanguages) {
3287
- this.availableLanguages = this.translateService.getLangs().map(lang => ({
3288
- code: lang,
3289
- label: lang,
3290
- ...(lang === 'it' && { label: 'ITA' }),
3291
- ...(lang === 'en' && { label: 'ENG' })
3292
- }));
3293
- }
3294
- }
3295
- /**
3296
- * Change the current language
3297
- * @param lang the language code
3298
- */
3299
- changeLanguage(lang) {
3300
- this.translateService.use(lang);
3301
- }
3302
- }
3303
- LanguageSwitcherComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: LanguageSwitcherComponent, deps: [{ token: i1.TranslateService }], target: i0.ɵɵFactoryTarget.Component });
3304
- LanguageSwitcherComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.0.4", type: LanguageSwitcherComponent, selector: "it-language-switcher", inputs: { availableLanguages: "availableLanguages" }, ngImport: i0, template: "<it-dropdown id=\"language-switcher\">\n <ng-container button>\n <span class=\"visually-hidden\">{{'it.utils.selected' | translate: { lang: (currentLang$ | async)?.label } }}</span>\n <span>{{(currentLang$ | async)?.label || ('it.utils.select-language' | translate)}}</span>\n </ng-container>\n\n <ng-container list>\n <it-dropdown-item *ngFor=\"let lang of availableLanguages\" (click)=\"changeLanguage(lang.code)\"\n [active]=\"lang.code === (currentLang$ | async)?.code\">\n {{lang.label}}\n <span class=\"visually-hidden\" *ngIf=\"lang.code === (currentLang$ | async)?.code\">\n {{'it.utils.selected' | translate}}\n </span>\n </it-dropdown-item>\n </ng-container>\n</it-dropdown>\n", dependencies: [{ kind: "directive", type: i1$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: DropdownComponent, selector: "it-dropdown[id]", inputs: ["color", "direction", "fullWidth", "dark"], outputs: ["onShow", "onShown", "onHide", "onHidden"], exportAs: ["itDropdown"] }, { kind: "component", type: DropdownItemComponent, selector: "it-dropdown-item", inputs: ["divider", "active", "large", "iconName", "iconPosition"] }, { kind: "pipe", type: i1$1.AsyncPipe, name: "async" }, { kind: "pipe", type: i1.TranslatePipe, name: "translate" }] });
3305
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: LanguageSwitcherComponent, decorators: [{
3306
- type: Component,
3307
- args: [{ selector: 'it-language-switcher', template: "<it-dropdown id=\"language-switcher\">\n <ng-container button>\n <span class=\"visually-hidden\">{{'it.utils.selected' | translate: { lang: (currentLang$ | async)?.label } }}</span>\n <span>{{(currentLang$ | async)?.label || ('it.utils.select-language' | translate)}}</span>\n </ng-container>\n\n <ng-container list>\n <it-dropdown-item *ngFor=\"let lang of availableLanguages\" (click)=\"changeLanguage(lang.code)\"\n [active]=\"lang.code === (currentLang$ | async)?.code\">\n {{lang.label}}\n <span class=\"visually-hidden\" *ngIf=\"lang.code === (currentLang$ | async)?.code\">\n {{'it.utils.selected' | translate}}\n </span>\n </it-dropdown-item>\n </ng-container>\n</it-dropdown>\n" }]
3308
- }], ctorParameters: function () { return [{ type: i1.TranslateService }]; }, propDecorators: { availableLanguages: [{
3309
- type: Input
3310
- }] } });
3311
-
3312
- class NotFoundPageComponent {
3313
- }
3314
- NotFoundPageComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: NotFoundPageComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
3315
- NotFoundPageComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.0.4", type: NotFoundPageComponent, selector: "it-not-found-page", ngImport: i0, template: "<div class=\"error-template text-center mt-5\">\n <h1>404</h1>\n <h2>{{'it.utils.404.title' | translate}}</h2>\n <p>{{'it.utils.404.description' | translate}}</p>\n\n <div class=\"mt-3\">\n <it-back-button></it-back-button>\n <a class=\"btn btn-primary ms-3\" href=\"/\" title=\"{{'it.utils.404.go-to-homepage' | translate}}\">\n {{'it.utils.404.go-to-homepage' | translate}}\n </a>\n </div>\n\n</div>\n", styles: [""], dependencies: [{ kind: "component", type: BackButtonComponent, selector: "it-back-button", inputs: ["buttonStyle", "direction", "showIcon", "showText", "backFn"], exportAs: ["itBackButton"] }, { kind: "pipe", type: i1.TranslatePipe, name: "translate" }] });
3316
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: NotFoundPageComponent, decorators: [{
3317
- type: Component,
3318
- args: [{ selector: 'it-not-found-page', template: "<div class=\"error-template text-center mt-5\">\n <h1>404</h1>\n <h2>{{'it.utils.404.title' | translate}}</h2>\n <p>{{'it.utils.404.description' | translate}}</p>\n\n <div class=\"mt-3\">\n <it-back-button></it-back-button>\n <a class=\"btn btn-primary ms-3\" href=\"/\" title=\"{{'it.utils.404.go-to-homepage' | translate}}\">\n {{'it.utils.404.go-to-homepage' | translate}}\n </a>\n </div>\n\n</div>\n" }]
3319
- }] });
3320
-
3321
- class ChipComponent {
3322
- constructor() {
3323
- this._label = '';
3324
- this._showCloseButton = false;
3325
- this._size = '';
3326
- this._color = undefined;
3327
- this._disabled = false;
3328
- this._icon = undefined;
3329
- this._avatar = undefined;
3330
- this._altAvatar = '';
3331
- /**
3332
- * Evento emesso al click sul bottone di chiusura
3333
- */
3334
- this.close = new EventEmitter();
3335
- this.iconClose = 'close';
3336
- }
3337
- /**
3338
- * Indica la label
3339
- */
3340
- set label(value) { this._label = value; }
3341
- get label() { return this._label; }
3342
- /**
3343
- * Indica se mostrate il pulante di chisura
3344
- */
3345
- set showCloseButton(value) { this._showCloseButton = value; }
3346
- get showCloseButton() { return this._showCloseButton; }
3347
- /**
3348
- * Indica il size
3349
- */
3350
- set size(value) { this._size = value; }
3351
- get size() { return this._size; }
3352
- /**
3353
- * Indica il colore della chip
3354
- */
3355
- set color(value) { this._color = value; }
3356
- get color() { return this._color; }
3357
- /**
3358
- * Indica se la chip è disabilitata
3359
- */
3360
- set disabled(value) { this._disabled = value; }
3361
- get disabled() { return this._disabled; }
3362
- /**
3363
- * Indica il nome dell'icona, se valorizzata viene mostrata
3364
- */
3365
- set icon(value) { this._icon = value; }
3366
- get icon() { return this._icon; }
3367
- /**
3368
- * Indica l'url dell'avatar, se valorizzata viene mostrata
3369
- */
3370
- set avatar(value) { this._avatar = value; }
3371
- get avatar() { return this._avatar; }
3372
- /**
3373
- * Indica il valore da aggiungere al parametro alt, di default ''
3374
- */
3375
- set altAvatar(value) { this._altAvatar = value; }
3376
- get altAvatar() { return this._altAvatar; }
3377
- clickToClose() {
3378
- this.close.emit();
3379
- }
3380
- }
3381
- ChipComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: ChipComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
3382
- ChipComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.0.4", type: ChipComponent, selector: "it-chip", inputs: { label: "label", showCloseButton: "showCloseButton", size: "size", color: "color", disabled: "disabled", icon: "icon", avatar: "avatar", altAvatar: "altAvatar" }, outputs: { close: "close" }, ngImport: i0, template: "<div class=\"chip\" [ngClass]=\"[!showCloseButton ? 'chip-simple': 'alert', size === 'lg' ? 'chip-lg': '', color ? 'chip-' + color : '', disabled ? 'chip-disabled' : '']\">\n <svg *ngIf=\"icon\" class=\"icon icon-xs\"><use [attr.href]=\"'/bootstrap-italia/dist/svg/sprites.svg#it-' + icon\" [attr.xlink:href]=\"'/bootstrap-italia/dist/svg/sprites.svg#it-' + icon\"></use></svg>\n <div *ngIf=\"avatar\" class=\"avatar size-xs\">\n <img [src]=\"avatar\" [alt]=\"altAvatar\">\n </div>\n <span class=\"chip-label\">{{ label }}</span>\n <button *ngIf=\"showCloseButton\" (click)=\"clickToClose()\" [disabled]=\"disabled\">\n <svg class=\"icon\"><use href=\"/bootstrap-italia/dist/svg/sprites.svg#it-close\" xlink:href=\"/bootstrap-italia/dist/svg/sprites.svg#it-close\"></use></svg>\n <span class=\"visually-hidden\">{{ 'it.core.remove' | translate }} {{ label }}</span>\n </button>\n</div>", dependencies: [{ kind: "directive", type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "pipe", type: i1.TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
3383
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: ChipComponent, decorators: [{
3384
- type: Component,
3385
- args: [{ selector: 'it-chip', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"chip\" [ngClass]=\"[!showCloseButton ? 'chip-simple': 'alert', size === 'lg' ? 'chip-lg': '', color ? 'chip-' + color : '', disabled ? 'chip-disabled' : '']\">\n <svg *ngIf=\"icon\" class=\"icon icon-xs\"><use [attr.href]=\"'/bootstrap-italia/dist/svg/sprites.svg#it-' + icon\" [attr.xlink:href]=\"'/bootstrap-italia/dist/svg/sprites.svg#it-' + icon\"></use></svg>\n <div *ngIf=\"avatar\" class=\"avatar size-xs\">\n <img [src]=\"avatar\" [alt]=\"altAvatar\">\n </div>\n <span class=\"chip-label\">{{ label }}</span>\n <button *ngIf=\"showCloseButton\" (click)=\"clickToClose()\" [disabled]=\"disabled\">\n <svg class=\"icon\"><use href=\"/bootstrap-italia/dist/svg/sprites.svg#it-close\" xlink:href=\"/bootstrap-italia/dist/svg/sprites.svg#it-close\"></use></svg>\n <span class=\"visually-hidden\">{{ 'it.core.remove' | translate }} {{ label }}</span>\n </button>\n</div>" }]
3386
- }], propDecorators: { label: [{
3387
- type: Input
3388
- }], showCloseButton: [{
3389
- type: Input
3390
- }], size: [{
3391
- type: Input
3392
- }], color: [{
3393
- type: Input
3394
- }], disabled: [{
3395
- type: Input
3396
- }], icon: [{
3397
- type: Input
3398
- }], avatar: [{
3399
- type: Input
3400
- }], altAvatar: [{
3401
- type: Input
3402
- }], close: [{
3403
- type: Output
3404
- }] } });
3405
-
3406
- class ForwardDirective {
3407
- constructor(document) {
3408
- this.document = document;
3409
- this._itForward = undefined;
3410
- }
3411
- /**
3412
- * Indica, se HTMLElement, l'elemento a cui navigare, o se stringa, il selettore che selezionerà l'elemento a cui navigare.
3413
- */
3414
- set itForward(value) { this._itForward = value; }
3415
- get itForward() { return this._itForward; }
3416
- onClick(event) {
3417
- event.preventDefault();
3418
- if (this.itForward) {
3419
- if (typeof this.itForward === 'string') {
3420
- this.document?.querySelector(this.itForward)?.scrollIntoView({
3421
- behavior: 'smooth',
3422
- block: 'start',
3423
- inline: "nearest"
3424
- });
3425
- }
3426
- else if (this.itForward instanceof HTMLElement) {
3427
- this.itForward.scrollIntoView({
3428
- behavior: 'smooth',
3429
- block: 'start',
3430
- inline: "nearest"
3431
- });
3432
- }
3433
- }
3434
- }
3435
- }
3436
- ForwardDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: ForwardDirective, deps: [{ token: DOCUMENT }], target: i0.ɵɵFactoryTarget.Directive });
3437
- ForwardDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.0.4", type: ForwardDirective, selector: "[itForward]", inputs: { itForward: "itForward" }, host: { listeners: { "click": "onClick($event)" }, classAttribute: "forward" }, ngImport: i0 });
3438
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: ForwardDirective, decorators: [{
3439
- type: Directive,
3440
- args: [{
3441
- selector: '[itForward]',
3442
- host: { 'class': 'forward' }
3443
- }]
3444
- }], ctorParameters: function () { return [{ type: Document, decorators: [{
3445
- type: Inject,
3446
- args: [DOCUMENT]
3447
- }] }]; }, propDecorators: { itForward: [{
3448
- type: Input
3449
- }], onClick: [{
3450
- type: HostListener,
3451
- args: ['click', ['$event']]
3452
- }] } });
3453
-
3454
- class DimmerComponent {
3455
- constructor(elementRef) {
3456
- this.elementRef = elementRef;
3457
- this._active = false;
3458
- this._color = '';
3459
- }
3460
- /**
3461
- * Dimmer status
3462
- * @default false
3463
- */
3464
- set active(value) { this._active = value; }
3465
- ;
3466
- get active() { return this._active; }
3467
- /**
3468
- * Colore del dimmer
3469
- * @default ''
3470
- */
3471
- set color(value) { this._color = value; }
3472
- ;
3473
- get color() { return this._color; }
3474
- ngOnInit() {
3475
- this.elementRef?.nativeElement?.parentElement?.classList?.add('dimmable');
3476
- }
3477
- }
3478
- DimmerComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: DimmerComponent, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component });
3479
- DimmerComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.0.4", type: DimmerComponent, selector: "it-dimmer", inputs: { active: "active", color: "color" }, ngImport: i0, template: "<div class=\"dimmer\" *ngIf=\"active\" @fade [ngClass]=\"[color]\">\n <div class=\"dimmer-inner\">\n <ng-content></ng-content>\n </div>\n</div>", dependencies: [{ kind: "directive", type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], animations: [
3480
- trigger('fade', [
3481
- transition(':enter', [
3482
- style({ opacity: 0 }),
3483
- animate('150ms', style({ opacity: 0.92 })),
3484
- ]),
3485
- transition(':leave', [
3486
- animate('150ms', style({ opacity: 0 })),
3487
- ]),
3488
- ])
3489
- ], changeDetection: i0.ChangeDetectionStrategy.OnPush });
3490
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: DimmerComponent, decorators: [{
3491
- type: Component,
3492
- args: [{ selector: 'it-dimmer', changeDetection: ChangeDetectionStrategy.OnPush, animations: [
3493
- trigger('fade', [
3494
- transition(':enter', [
3495
- style({ opacity: 0 }),
3496
- animate('150ms', style({ opacity: 0.92 })),
3497
- ]),
3498
- transition(':leave', [
3499
- animate('150ms', style({ opacity: 0 })),
3500
- ]),
3501
- ])
3502
- ], template: "<div class=\"dimmer\" *ngIf=\"active\" @fade [ngClass]=\"[color]\">\n <div class=\"dimmer-inner\">\n <ng-content></ng-content>\n </div>\n</div>" }]
3503
- }], ctorParameters: function () { return [{ type: i0.ElementRef }]; }, propDecorators: { active: [{
3504
- type: Input
3505
- }], color: [{
3506
- type: Input
3507
- }] } });
3508
-
3509
- class DimmerButtonsComponent {
3510
- constructor() {
3511
- this._hasOneButton = false;
3512
- }
3513
- /**
3514
- * Indica se abbiamo 1 solo bottone
3515
- * @default false
3516
- */
3517
- set hasOneButton(value) { this._hasOneButton = value; }
3518
- ;
3519
- get hasOneButton() { return this._hasOneButton; }
3520
- }
3521
- DimmerButtonsComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: DimmerButtonsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
3522
- DimmerButtonsComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.0.4", type: DimmerButtonsComponent, selector: "it-dimmer-buttons", inputs: { hasOneButton: "hasOneButton" }, ngImport: i0, template: "<div class=\"dimmer-buttons bg-dark\" [ngClass]=\"{'single-button': hasOneButton}\">\n <ng-content></ng-content>\n</div>", dependencies: [{ kind: "directive", type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
3523
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: DimmerButtonsComponent, decorators: [{
3524
- type: Component,
3525
- args: [{ selector: 'it-dimmer-buttons', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"dimmer-buttons bg-dark\" [ngClass]=\"{'single-button': hasOneButton}\">\n <ng-content></ng-content>\n</div>" }]
3526
- }], propDecorators: { hasOneButton: [{
3527
- type: Input
3528
- }] } });
3529
-
3530
- class DimmerIconComponent {
3531
- }
3532
- DimmerIconComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: DimmerIconComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
3533
- DimmerIconComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.0.4", type: DimmerIconComponent, selector: "it-dimmer-icon", ngImport: i0, template: "<div class=\"dimmer-icon\">\n <ng-content></ng-content>\n</div>", changeDetection: i0.ChangeDetectionStrategy.OnPush });
3534
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: DimmerIconComponent, decorators: [{
3535
- type: Component,
3536
- args: [{ selector: 'it-dimmer-icon', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"dimmer-icon\">\n <ng-content></ng-content>\n</div>" }]
3537
- }] });
3538
-
3539
- /**
3540
- * Core components
3541
- */
3542
- const core = [
3543
- AccordionComponent,
3544
- AlertComponent,
3545
- BadgeDirective,
3546
- ButtonDirective,
3547
- CalloutComponent,
3548
- CardComponent,
3549
- CarouselComponent,
3550
- CarouselItemComponent,
3551
- ChipComponent,
3552
- CollapseComponent,
3553
- DimmerButtonsComponent,
3554
- DimmerComponent,
3555
- DimmerIconComponent,
3556
- DropdownComponent,
3557
- DropdownItemComponent,
3558
- ForwardDirective,
3559
- LinkComponent,
3560
- ListComponent,
3561
- ListItemComponent,
3562
- ModalComponent,
3563
- NotificationsComponent,
3564
- PaginationComponent,
3565
- PopoverDirective,
3566
- ProgressBarComponent,
3567
- ProgressButtonComponent,
3568
- SpinnerComponent,
3569
- SteppersContainerComponent,
3570
- SteppersItemComponent,
3571
- TabContainerComponent,
3572
- TabItemComponent,
3573
- TableComponent,
3574
- TooltipDirective
3575
- ];
3576
- /**
3577
- * Form components
3578
- */
3579
- const form = [
3580
- CheckboxComponent,
3581
- InputComponent,
3582
- PasswordInputComponent,
3583
- RadioButtonComponent,
3584
- SelectComponent,
3585
- TextareaComponent,
3586
- UploadDragDropComponent,
3587
- UploadFileListComponent
3588
- ];
3589
- /**
3590
- * Navigation Components
3591
- */
3592
- const navigation = [
3593
- BackButtonComponent,
3594
- BackToTopComponent,
3595
- BreadcrumbComponent,
3596
- BreadcrumbItemComponent,
3597
- HeaderComponent
3598
- ];
3599
- /**
3600
- * Utils components
3601
- */
3602
- const utils = [
3603
- IconComponent,
3604
- NotFoundPageComponent,
3605
- LanguageSwitcherComponent,
3606
- MarkMatchingTextPipe
3607
- ];
3608
- class ComponentsModule {
3609
- }
3610
- ComponentsModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: ComponentsModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
3611
- ComponentsModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.0.4", ngImport: i0, type: ComponentsModule, declarations: [AbstractComponent,
3612
- AbstractFormComponent, AccordionComponent,
3613
- AlertComponent,
3614
- BadgeDirective,
3615
- ButtonDirective,
3616
- CalloutComponent,
3617
- CardComponent,
3618
- CarouselComponent,
3619
- CarouselItemComponent,
3620
- ChipComponent,
3621
- CollapseComponent,
3622
- DimmerButtonsComponent,
3623
- DimmerComponent,
3624
- DimmerIconComponent,
3625
- DropdownComponent,
3626
- DropdownItemComponent,
3627
- ForwardDirective,
3628
- LinkComponent,
3629
- ListComponent,
3630
- ListItemComponent,
3631
- ModalComponent,
3632
- NotificationsComponent,
3633
- PaginationComponent,
3634
- PopoverDirective,
3635
- ProgressBarComponent,
3636
- ProgressButtonComponent,
3637
- SpinnerComponent,
3638
- SteppersContainerComponent,
3639
- SteppersItemComponent,
3640
- TabContainerComponent,
3641
- TabItemComponent,
3642
- TableComponent,
3643
- TooltipDirective, CheckboxComponent,
3644
- InputComponent,
3645
- PasswordInputComponent,
3646
- RadioButtonComponent,
3647
- SelectComponent,
3648
- TextareaComponent,
3649
- UploadDragDropComponent,
3650
- UploadFileListComponent, BackButtonComponent,
3651
- BackToTopComponent,
3652
- BreadcrumbComponent,
3653
- BreadcrumbItemComponent,
3654
- HeaderComponent, IconComponent,
3655
- NotFoundPageComponent,
3656
- LanguageSwitcherComponent,
3657
- MarkMatchingTextPipe], imports: [CommonModule,
3658
- TranslateModule,
3659
- ReactiveFormsModule,
3660
- NgIf,
3661
- NgForOf,
3662
- RouterLink], exports: [AccordionComponent,
3663
- AlertComponent,
3664
- BadgeDirective,
3665
- ButtonDirective,
3666
- CalloutComponent,
3667
- CardComponent,
3668
- CarouselComponent,
3669
- CarouselItemComponent,
3670
- ChipComponent,
3671
- CollapseComponent,
3672
- DimmerButtonsComponent,
3673
- DimmerComponent,
3674
- DimmerIconComponent,
3675
- DropdownComponent,
3676
- DropdownItemComponent,
3677
- ForwardDirective,
3678
- LinkComponent,
3679
- ListComponent,
3680
- ListItemComponent,
3681
- ModalComponent,
3682
- NotificationsComponent,
3683
- PaginationComponent,
3684
- PopoverDirective,
3685
- ProgressBarComponent,
3686
- ProgressButtonComponent,
3687
- SpinnerComponent,
3688
- SteppersContainerComponent,
3689
- SteppersItemComponent,
3690
- TabContainerComponent,
3691
- TabItemComponent,
3692
- TableComponent,
3693
- TooltipDirective, CheckboxComponent,
3694
- InputComponent,
3695
- PasswordInputComponent,
3696
- RadioButtonComponent,
3697
- SelectComponent,
3698
- TextareaComponent,
3699
- UploadDragDropComponent,
3700
- UploadFileListComponent, BackButtonComponent,
3701
- BackToTopComponent,
3702
- BreadcrumbComponent,
3703
- BreadcrumbItemComponent,
3704
- HeaderComponent, IconComponent,
3705
- NotFoundPageComponent,
3706
- LanguageSwitcherComponent,
3707
- MarkMatchingTextPipe] });
3708
- ComponentsModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: ComponentsModule, imports: [CommonModule,
3709
- TranslateModule,
3710
- ReactiveFormsModule] });
3711
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: ComponentsModule, decorators: [{
3712
- type: NgModule,
3713
- args: [{
3714
- declarations: [
3715
- AbstractComponent,
3716
- AbstractFormComponent,
3717
- ...core,
3718
- ...form,
3719
- ...navigation,
3720
- ...utils
3721
- ],
3722
- imports: [
3723
- CommonModule,
3724
- TranslateModule,
3725
- ReactiveFormsModule,
3726
- NgIf,
3727
- NgForOf,
3728
- RouterLink
3729
- ],
3730
- exports: [
3731
- ...core,
3732
- ...form,
3733
- ...navigation,
3734
- ...utils
3735
- ]
3736
- }]
3737
- }] });
3738
-
3739
- class DesignAngularKitModule {
3740
- constructor(translateService) {
3741
- this.translateService = translateService;
3742
- translateService.addLangs(['it', 'en']); // Adds 'it' and 'eng' as available languages.
3743
- translateService.use('it');
3744
- }
3745
- }
3746
- DesignAngularKitModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: DesignAngularKitModule, deps: [{ token: i1.TranslateService }], target: i0.ɵɵFactoryTarget.NgModule });
3747
- DesignAngularKitModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.0.4", ngImport: i0, type: DesignAngularKitModule, imports: [ComponentsModule,
3748
- HttpClientModule, i1.TranslateModule], exports: [ComponentsModule,
3749
- TranslateModule] });
3750
- DesignAngularKitModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: DesignAngularKitModule, imports: [ComponentsModule,
3751
- HttpClientModule,
3752
- TranslateModule.forChild({
3753
- loader: {
3754
- provide: TranslateLoader,
3755
- useFactory: (http) => new TranslateHttpLoader(http, '/bootstrap-italia/i18n/'),
3756
- deps: [HttpClient]
3757
- },
3758
- extend: true,
3759
- isolate: false,
3760
- defaultLanguage: 'it'
3761
- }), ComponentsModule,
3762
- TranslateModule] });
3763
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: DesignAngularKitModule, decorators: [{
3764
- type: NgModule,
3765
- args: [{
3766
- declarations: [],
3767
- imports: [
3768
- ComponentsModule,
3769
- HttpClientModule,
3770
- TranslateModule.forChild({
3771
- loader: {
3772
- provide: TranslateLoader,
3773
- useFactory: (http) => new TranslateHttpLoader(http, '/bootstrap-italia/i18n/'),
3774
- deps: [HttpClient]
3775
- },
3776
- extend: true,
3777
- isolate: false,
3778
- defaultLanguage: 'it'
3779
- })
3780
- ],
3781
- exports: [
3782
- ComponentsModule,
3783
- TranslateModule
3784
- ]
3785
- }]
3786
- }], ctorParameters: function () { return [{ type: i1.TranslateService }]; } });
3787
-
3788
- /*
3789
- * Public API Surface of design-angular-kit
3790
- */
3791
-
3792
- /**
3793
- * Generated bundle index. Do not edit.
3794
- */
3795
-
3796
- export { AccordionComponent, AlertComponent, BackButtonComponent, BackToTopComponent, BadgeDirective, BreadcrumbComponent, BreadcrumbItemComponent, ButtonDirective, CAP_REGEX, CalloutComponent, CardComponent, CarouselComponent, CarouselItemComponent, CheckboxComponent, ChipComponent, CollapseComponent, ComponentsModule, DesignAngularKitModule, DimmerButtonsComponent, DimmerComponent, DimmerIconComponent, DropdownComponent, DropdownItemComponent, EMAIL_REGEX, FileUtils, ForwardDirective, HeaderComponent, ITALIAN_TAX_CODE_REGEX, IconComponent, InputComponent, ItValidators, LanguageSwitcherComponent, LinkComponent, ListComponent, ListItemComponent, MarkMatchingTextPipe, ModalComponent, NotFoundPageComponent, NotificationPosition, NotificationType, NotificationsComponent, NotificationsService, PHONE_NUMBER_REGEX, PaginationComponent, PasswordInputComponent, PopoverDirective, ProgressBarComponent, ProgressButtonComponent, RadioButtonComponent, SelectComponent, SpinnerComponent, SteppersContainerComponent, SteppersItemComponent, TabContainerComponent, TabItemComponent, TableComponent, TextareaComponent, TooltipDirective, URL_REGEX, UploadDragDropComponent, UploadFileListComponent, VAT_NUMBER_REGEX };
3797
- //# sourceMappingURL=design-angular-kit.mjs.map